Files
windmill/frontend/src/lib/components/GraphqlSchemaViewer.svelte
HugoCasa f1a0070b71 feat: add graphql support (#2014)
* feat: add graphql support

* fix: use custom editor for viewing graphql schema

* fix: graphql parser cargo version

* fix: add graphql where missing
2023-08-09 16:19:57 +02:00

41 lines
909 B
Svelte

<script lang="ts">
import { BROWSER } from 'esm-env'
import 'monaco-editor/esm/vs/editor/edcore.main'
import { editor as meditor } from 'monaco-editor/esm/vs/editor/editor.api'
import 'monaco-editor/esm/vs/basic-languages/graphql/graphql.contribution'
import { onDestroy, onMount } from 'svelte'
let divEl: HTMLDivElement | null = null
let editor: meditor.IStandaloneCodeEditor
export let code: string = ''
async function loadMonaco() {
editor = meditor.create(divEl as HTMLDivElement, {
value: code,
language: 'graphql',
readOnly: true,
automaticLayout: true,
scrollBeyondLastLine: false,
lineNumbers: 'off',
minimap: { enabled: false }
})
}
onMount(async () => {
if (BROWSER) {
await loadMonaco()
}
})
onDestroy(() => {
try {
editor && editor.dispose()
} catch (err) {}
})
</script>
<div bind:this={divEl} class="{$$props.class ?? ''} editor" />