diff --git a/frontend/src/lib/components/ArgInput.svelte b/frontend/src/lib/components/ArgInput.svelte index a15db45209..a3b4b801ae 100644 --- a/frontend/src/lib/components/ArgInput.svelte +++ b/frontend/src/lib/components/ArgInput.svelte @@ -340,6 +340,7 @@ { @@ -608,6 +609,7 @@ 0} + on:showExpr={(e) => { + monaco?.setSuggestion(e.detail) + }} on:setExpr={(e) => { arg = { type: 'javascript', expr: e.detail } propertyType = 'javascript' - monaco?.setCode(e.detail) + monaco?.setCode('') + monaco?.insertAtCursor(e.detail) }} {pickableProperties} {argName} @@ -395,6 +404,7 @@ focused = false }} autoHeight + preventTabOnEmpty={enableAi} /> diff --git a/frontend/src/lib/components/InputTransformSchemaForm.svelte b/frontend/src/lib/components/InputTransformSchemaForm.svelte index deb74486aa..ae2a9dad62 100644 --- a/frontend/src/lib/components/InputTransformSchemaForm.svelte +++ b/frontend/src/lib/components/InputTransformSchemaForm.svelte @@ -74,6 +74,7 @@ (args[argName].type === 'javascript' && !args[argName].expr)) ) : []} + {schema} /> {/if} {#if keys.length > 0} diff --git a/frontend/src/lib/components/SimpleEditor.svelte b/frontend/src/lib/components/SimpleEditor.svelte index 3d8022afaf..e15d008439 100644 --- a/frontend/src/lib/components/SimpleEditor.svelte +++ b/frontend/src/lib/components/SimpleEditor.svelte @@ -13,8 +13,7 @@ KeyMod, Uri as mUri, languages, - type IRange, - type IKeyboardEvent + type IRange } from 'monaco-editor' import 'monaco-editor/esm/vs/basic-languages/sql/sql.contribution' import 'monaco-editor/esm/vs/basic-languages/yaml/yaml.contribution' @@ -57,6 +56,7 @@ export let fixedOverflowWidgets = true export let small = false export let domLib = false + export let autofocus = false const dispatch = createEventDispatcher() @@ -117,12 +117,6 @@ } } - export function onKeyUp(f: (e: IKeyboardEvent) => void) { - if (editor) { - return editor.onKeyUp(f) - } - } - export function show(): void { divEl?.classList.remove('hidden') } @@ -131,9 +125,17 @@ divEl?.classList.add('hidden') } + let suggestion = '' + export function setSuggestion(value: string): void { + suggestion = value + } + let width = 0 let initialized = false + let disableTabCond: meditor.IContextKey | undefined + $: disableTabCond?.set(!code && !!suggestion) + async function loadMonaco() { await initializeVscode() initialized = true @@ -184,6 +186,7 @@ let timeoutModel: NodeJS.Timeout | undefined = undefined editor.onDidChangeModelContent((event) => { + suggestion = '' timeoutModel && clearTimeout(timeoutModel) timeoutModel = setTimeout(() => { code = getCode() @@ -198,6 +201,9 @@ code = getCode() shouldBindKey && format && format() }) + + disableTabCond = editor.createContextKey('disableTabCond', !code) + editor.addCommand(KeyCode.Tab, function () {}, 'disableTabCond') }) if (autoHeight) { @@ -332,6 +338,11 @@ if (BROWSER) { mounted = true await loadMonaco() + if (autofocus) { + setTimeout(() => { + focus() + }, 0) + } } }) @@ -347,6 +358,15 @@ +{#if editor && suggestion && code.length === 0} +
+ {suggestion} +
+{/if} +