windmill-components 1.555.0 → 1.558.1

package/package/components/AIAgentLogViewer.svelte.d.ts

@@ -8,6 +8,6 @@ interface Props {
     storedToolCallJobs?: Record<number, Job>;
     onToolJobLoaded?: (job: Job, idx: number) => void;
 }
-declare const AiAgentLogViewer: import("svelte").Component<Props, {}, "">;
-type AiAgentLogViewer = ReturnType<typeof AiAgentLogViewer>;
-export default AiAgentLogViewer;
+declare const AIAgentLogViewer: import("svelte").Component<Props, {}, "">;
+type AIAgentLogViewer = ReturnType<typeof AIAgentLogViewer>;
+export default AIAgentLogViewer;

package/package/components/AIProviderPicker.svelte.d.ts

@@ -10,6 +10,6 @@ interface Props {
     disabled?: boolean;
     actions?: Snippet;
 }
-declare const AiProviderPicker: import("svelte").Component<Props, {}, "value">;
-type AiProviderPicker = ReturnType<typeof AiProviderPicker>;
-export default AiProviderPicker;
+declare const AIProviderPicker: import("svelte").Component<Props, {}, "value">;
+type AIProviderPicker = ReturnType<typeof AIProviderPicker>;
+export default AIProviderPicker;

package/package/components/ArgInput.svelte

@@ -1125,6 +1125,8 @@ onDestroy(() => {
 		{:else if inputCat == 'date'}
 			{#if format === 'date'}
 				<DateInput {disabled} {autofocus} bind:value dateFormat={extra?.['dateFormat']} />
+			{:else if format === 'naive-date-time'}
+				<DateTimeInput {disabled} useDropdown {autofocus} bind:value timezone="naive" />
 			{:else}
 				<DateTimeInput {disabled} useDropdown {autofocus} bind:value />
 			{/if}

package/package/components/DBManager.svelte.d.ts

@@ -16,6 +16,6 @@ type Props = {
         selectedSchemaKey?: string;
     }) => DBTableEditorProps;
 };
-declare const DbManager: import("svelte").Component<Props, {}, "">;
-type DbManager = ReturnType<typeof DbManager>;
-export default DbManager;
+declare const DBManager: import("svelte").Component<Props, {}, "">;
+type DBManager = ReturnType<typeof DBManager>;
+export default DBManager;

package/package/components/DBManagerDrawer.svelte.d.ts

@@ -1,7 +1,7 @@
 import { type DbInput } from './dbOps';
-declare const DbManagerDrawer: import("svelte").Component<Record<string, never>, {
+declare const DBManagerDrawer: import("svelte").Component<Record<string, never>, {
     openDrawer: (nInput: DbInput) => void;
     closeDrawer: () => void;
 }, "">;
-type DbManagerDrawer = ReturnType<typeof DbManagerDrawer>;
-export default DbManagerDrawer;
+type DBManagerDrawer = ReturnType<typeof DBManagerDrawer>;
+export default DBManagerDrawer;

package/package/components/DBSchemaExplorer.svelte.d.ts

@@ -2,6 +2,6 @@ import { type DBSchema } from '../stores';
 type Props = {
     dbSchema: DBSchema;
 };
-declare const DbSchemaExplorer: import("svelte").Component<Props, {}, "">;
-type DbSchemaExplorer = ReturnType<typeof DbSchemaExplorer>;
-export default DbSchemaExplorer;
+declare const DBSchemaExplorer: import("svelte").Component<Props, {}, "">;
+type DBSchemaExplorer = ReturnType<typeof DBSchemaExplorer>;
+export default DBSchemaExplorer;

package/package/components/DBTable.svelte.d.ts

@@ -5,6 +5,6 @@ import './apps/components/display/table/theme/windmill-theme.css';
 type Props = {
     dbTableOps: IDbTableOps;
 };
-declare const DbTable: import("svelte").Component<Props, {}, "">;
-type DbTable = ReturnType<typeof DbTable>;
-export default DbTable;
+declare const DBTable: import("svelte").Component<Props, {}, "">;
+type DBTable = ReturnType<typeof DBTable>;
+export default DBTable;

package/package/components/DBTableEditor.svelte

@@ -46,10 +46,11 @@ import { twMerge } from 'tailwind-merge';
 import DarkModeObserver from './DarkModeObserver.svelte';
 import Select from './select/Select.svelte';
 import { safeSelectItems } from './select/utils.svelte';
+import TextInput from './text_input/TextInput.svelte';
 const { onConfirm, dbType, previewSql, dbSchema, currentSchema } = $props();
 const columnTypes = DB_TYPES[dbType];
 const defaultColumnType = {
-    postgresql: 'VARCHAR',
+    postgresql: 'BIGSERIAL',
     snowflake: 'varchar',
     ms_sql_server: 'varchar',
     bigquery: 'string',
@@ -83,9 +84,8 @@ let darkMode = $state(false);
 	<div class="flex-1 overflow-y-auto flex flex-col gap-6">
 		<label>
 			Name
-			<input
-				type="text"
-				placeholder="my_table"
+			<TextInput
+				inputProps={{ type: 'text', placeholder: 'my_table' }}
 				class={errors?.name ? 'border !border-red-600/60' : ''}
 				bind:value={values.name}
 			/>
@@ -106,12 +106,9 @@ let darkMode = $state(false);
 					{#each values.columns as column, i}
 						<tr>
 							<Cell first>
-								<input
-									type="text"
-									class={'h-10 ' +
-										(errors?.columns?.includes(column.name) ? 'border !border-red-600/60' : '')}
-									style="height: 2rem;"
-									placeholder="column_name"
+								<TextInput
+									error={errors?.columns?.includes(column.name)}
+									inputProps={{ type: 'text', placeholder: 'column_name' }}
 									bind:value={column.name}
 								/>
 							</Cell>
@@ -164,8 +161,8 @@ let darkMode = $state(false);
 										</label>
 										{#if !column.primaryKey}
 											<label class="flex gap-2 items-center text-xs">
-												<input type="checkbox" class="!w-4 !h-4" bind:checked={column.not_null} />
-												Not nullable
+												<input type="checkbox" class="!w-4 !h-4" bind:checked={column.nullable} />
+												Nullable
 											</label>
 										{/if}
 									{/snippet}

package/package/components/DBTableEditor.svelte.d.ts

@@ -8,6 +8,6 @@ export type DBTableEditorProps = {
 import { type DbType } from './apps/components/display/dbtable/utils';
 import { type CreateTableValues } from './apps/components/display/dbtable/queries/createTable';
 import { type DBSchema } from '../stores';
-declare const DbTableEditor: import("svelte").Component<DBTableEditorProps, {}, "">;
-type DbTableEditor = ReturnType<typeof DbTableEditor>;
-export default DbTableEditor;
+declare const DBTableEditor: import("svelte").Component<DBTableEditorProps, {}, "">;
+type DBTableEditor = ReturnType<typeof DBTableEditor>;
+export default DBTableEditor;

package/package/components/DateTimeInput.svelte

@@ -6,23 +6,26 @@ import { Clock, X } from 'lucide-svelte';
 import { twMerge } from 'tailwind-merge';
 import { createDispatcherIfMounted } from '../createDispatcherIfMounted';
 import { inputBaseClass, inputBorderClass } from './text_input/TextInput.svelte';
-let { value = $bindable(undefined), clearable = false, autofocus = false, useDropdown = false, minDate = undefined, maxDate = undefined, disabled = undefined, inputClass = undefined } = $props();
+let { value = $bindable(undefined), clearable = false, autofocus = false, useDropdown = false, minDate = undefined, maxDate = undefined, disabled = undefined, inputClass = undefined, timezone = 'local' } = $props();
 let date = $state(undefined);
 let time = $state(undefined);
 // let format: 'local' | 'utc' = 'local'
 function parseValue(value = undefined) {
     let dateFromValue = value ? new Date(value) : undefined;
-    date = isValidDate(dateFromValue)
-        ? `${dateFromValue.getFullYear().toString()}-${(dateFromValue.getMonth() + 1)
-            .toString()
-            .padStart(2, '0')}-${dateFromValue.getDate().toString().padStart(2, '0')}`
-        : undefined;
-    time = isValidDate(dateFromValue)
-        ? `${dateFromValue.getHours().toString().padStart(2, '0')}:${dateFromValue
-            .getMinutes()
-            .toString()
-            .padStart(2, '0')}`
-        : '12:00';
+    if (!isValidDate(dateFromValue)) {
+        date = undefined;
+        time = '12:00';
+        return;
+    }
+    let year = timezone === 'local' ? dateFromValue?.getFullYear() : dateFromValue?.getUTCFullYear();
+    let month = timezone === 'local' ? dateFromValue?.getMonth() : dateFromValue?.getUTCMonth();
+    let day = timezone === 'local' ? dateFromValue?.getDate() : dateFromValue?.getUTCDate();
+    let hours = timezone === 'local' ? dateFromValue.getHours() : dateFromValue.getUTCHours();
+    let minutes = timezone === 'local' ? dateFromValue.getMinutes() : dateFromValue.getUTCMinutes();
+    date = `${year.toString()}-${(month + 1)
+        .toString()
+        .padStart(2, '0')}-${day.toString().padStart(2, '0')}`;
+    time = `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}`;
 }
 $effect(() => {
     value;
@@ -34,7 +37,7 @@ let initialDate = untrack(() => date);
 let initialTime = untrack(() => time);
 function parseDateAndTime(date, time) {
     if (date && time && (initialDate != date || initialTime != time)) {
-        let newDate = new Date(`${date}T${time}`);
+        let newDate = new Date(timezone === 'local' ? `${date}T${time}` : `${date}T${time}Z`);
         if (newDate.toString() === 'Invalid Date')
             return;
         if (newDate.getFullYear() < 1900)
@@ -57,6 +60,9 @@ const dispatch = createEventDispatcher();
 const dispatchIfMounted = createDispatcherIfMounted(dispatch);
 function setTimeLater(mins) {
     let newDate = new Date();
+    if (timezone === 'naive') {
+        newDate.setMinutes(newDate.getMinutes() - newDate.getTimezoneOffset());
+    }
     newDate.setMinutes(newDate.getMinutes() + mins);
     value = newDate.toISOString();
     dispatch('change', value);

package/package/components/DateTimeInput.svelte.d.ts

@@ -7,6 +7,11 @@ interface Props {
     maxDate?: string | undefined;
     disabled?: boolean | undefined;
     inputClass?: string | undefined;
+    /**
+     * 'naive' will ignore timezone and return a date without timezone
+     * 'local' will use the local timezone of the user
+     */
+    timezone?: 'naive' | 'local';
 }
 interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
     new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {

package/package/components/DucklakePicker.svelte

@@ -0,0 +1,32 @@
+<script lang="ts">import { WorkspaceService } from '../gen';
+import { workspaceStore } from '../stores';
+import Select from './select/Select.svelte';
+import DbManagerDrawer from './DBManagerDrawer.svelte';
+import ExploreAssetButton, { assetCanBeExplored } from './ExploreAssetButton.svelte';
+import { usePromise } from '../svelte5Utils.svelte';
+let { value = $bindable(undefined), disabled = false, disablePortal = false, showSchemaExplorer = false, placeholder = undefined, selectInputClass = '', class: className = '', onClear = undefined } = $props();
+let ducklakes = usePromise(() => WorkspaceService.listDucklakes({ workspace: $workspaceStore ?? '' }));
+let dbManagerDrawer = $state();
+</script>
+
+<div class={className}>
+	<Select
+		items={ducklakes.value?.map((d) => ({ value: d })) ?? []}
+		bind:value
+		loading={ducklakes.status === 'loading'}
+		{disabled}
+		{disablePortal}
+		{placeholder}
+		inputClass={selectInputClass}
+		{onClear}
+	/>
+	{#if showSchemaExplorer && value && assetCanBeExplored({ kind: 'ducklake', path: value })}
+		<ExploreAssetButton
+			class="mt-1 w-fit"
+			asset={{ kind: 'ducklake', path: value }}
+			{dbManagerDrawer}
+		/>
+	{/if}
+
+	<DbManagerDrawer bind:this={dbManagerDrawer} />
+</div>

package/package/components/DucklakePicker.svelte.d.ts

@@ -0,0 +1,13 @@
+interface Props {
+    value?: string | undefined;
+    disabled?: boolean;
+    disablePortal?: boolean;
+    showSchemaExplorer?: boolean;
+    placeholder?: string | undefined;
+    selectInputClass?: string;
+    class?: string;
+    onClear?: () => void;
+}
+declare const DucklakePicker: import("svelte").Component<Props, {}, "value">;
+type DucklakePicker = ReturnType<typeof DucklakePicker>;
+export default DucklakePicker;

package/package/components/Editor.svelte

@@ -1381,8 +1381,8 @@ $effect(() => {
 });
 $effect(() => {
     if (yContent && awareness && model && editor) {
-        monacoBinding && monacoBinding.destroy();
         untrack(() => {
+            monacoBinding && monacoBinding.destroy();
             monacoBinding = new MonacoBinding(yContent, model, new Set([editor]), awareness);
         });
     }

package/package/components/EditorBar.svelte

@@ -55,7 +55,14 @@ let showContextVarPicker = $derived([
     'csharp',
     'nu',
     'java',
-    'ruby'
+    'ruby',
+    'postgresql',
+    'mysql',
+    'bigquery',
+    'mssql',
+    'oracledb',
+    'snowflake',
+    'duckdb'
     // for related places search: ADD_NEW_LANG
 ].includes(lang ?? ''));
 let showVarPicker = $derived([
@@ -347,6 +354,12 @@ function windmillPathToCamelCaseName(path) {
 			// for related places search: ADD_NEW_LANG
 		} else if (lang == 'ruby') {
 			editor.insertAtCursor(`ENV['${name}']`)
+		} else if (
+			['postgresql', 'mysql', 'bigquery', 'mssql', 'oracledb', 'snowflake', 'duckdb'].includes(
+				lang ?? ''
+			)
+		) {
+			editor.insertAtCursor(`%%${name}%%`)
 		}
 		sendUserToast(`${name} inserted at cursor`)
 	}}

package/package/components/FakeMonacoPlaceHolder.svelte

@@ -30,7 +30,7 @@ let [editorWidth, editorHeight] = $derived([
 <div
 	bind:clientWidth
 	bind:clientHeight
-	class="h-full w-full relative editor dark:bg-[#272D38] {className}"
+	class="h-full w-full relative editor {className}"
 	style="--vscode-editorCodeLens-lineHeight: 18px; --vscode-editorCodeLens-fontSize: 12px; --vscode-editorCodeLens-fontFeatureSettings: 'liga' off, 'calt' off; --code-editorInlayHintsFontFamily: {fontFamily};"
 >
 	<div

package/package/components/FlowGraphViewerStep.svelte

@@ -173,7 +173,7 @@ let codeViewer;
 					<HighlightCode
 						language={stepDetail.value.language}
 						code={stepDetail.value.content}
-						class="whitespace-pre-wrap"
+						className="whitespace-pre-wrap"
 					/>
 				</div>
 				<h3 class="mb-2 mt-4">Lockfile</h3>

package/package/components/FlowPreviewContent.svelte

@@ -20,7 +20,7 @@ import FlowHistoryJobPicker from './FlowHistoryJobPicker.svelte';
 import { getStepHistoryLoaderContext } from './stepHistoryLoader.svelte';
 import { aiChatManager } from './copilot/chat/AIChatManager.svelte';
 import { stateSnapshot } from '../svelte5Utils.svelte';
-import FlowChatInterface from './flows/FlowChatInterface.svelte';
+import FlowChatInterface from './flows/conversations/FlowChatInterface.svelte';
 let { previewMode = $bindable(), open, preventEscape = $bindable(false), jobId = $bindable(undefined), job = $bindable(undefined), initial = $bindable(false), selectedJobStep = $bindable(undefined), selectedJobStepIsTopLevel = $bindable(undefined), selectedJobStepType = $bindable('single'), rightColumnSelect = $bindable('timeline'), branchOrIterationN = $bindable(0), scrollTop = $bindable(0), localModuleStates = $bindable({}), localDurationStatuses = $bindable({}), onRunPreview, render = false, onJobDone, upToId = undefined } = $props();
 let restartBranchNames = [];
 let isRunning = $state(false);

package/package/components/HighlightCode.svelte

@@ -17,10 +17,7 @@ import { Button } from './common';
 import { copyToClipboard } from '../utils';
 import { ClipboardCopy } from 'lucide-svelte';
 import HighlightTheme from './HighlightTheme.svelte';
-export let code = '';
-export let language;
-export let highlightLanguage = undefined;
-export let lines = false;
+let { code = '', language, highlightLanguage = undefined, lines = false, className = '', onApplyCode = undefined, showApplyButton = false, applyButtonIcon = undefined } = $props();
 function getLang(lang) {
     switch (lang) {
         case 'python3':
@@ -69,12 +66,12 @@ function getLang(lang) {
             return java;
         case 'ruby':
             return ruby;
-        // for related places search: ADD_NEW_LANG 
+        // for related places search: ADD_NEW_LANG
         default:
             return typescript;
     }
 }
-$: lang = highlightLanguage ?? getLang(language);
+const lang = $derived(highlightLanguage ?? getLang(language));
 </script>
 
 <HighlightTheme />
@@ -82,25 +79,39 @@ $: lang = highlightLanguage ?? getLang(language);
 <div class="relative">
 	<Button
 		wrapperClasses="absolute top-2 right-2 z-20"
-		on:click={() => copyToClipboard(code)}
+		onclick={() => copyToClipboard(code)}
 		color="light"
 		size="xs2"
 		startIcon={{
 			icon: ClipboardCopy
 		}}
 		iconOnly
+		title="Copy to clipboard"
 	/>
+	{#if showApplyButton}
+		<Button
+			wrapperClasses="absolute top-2 right-10 z-20"
+			onclick={onApplyCode}
+			color="light"
+			size="xs2"
+			startIcon={{
+				icon: applyButtonIcon
+			}}
+			iconOnly
+			title="Apply code"
+		/>
+	{/if}
 	<div class="overflow-x-auto">
 		{#if code?.length < 10000}
 			{#if !lines}
-				<Highlight class="nowrap {$$props.class}" language={lang} {code} />
+				<Highlight class="nowrap {className}" language={lang} {code} />
 			{:else}
-				<Highlight class="nowrap {$$props.class}" language={lang} {code} let:highlighted>
+				<Highlight class="nowrap {className}" language={lang} {code} let:highlighted>
 					<LineNumbers {highlighted} />
 				</Highlight>
 			{/if}
 		{:else}
-			<pre class="overflow-auto max-h-screen text-xs {$$props.class}"
+			<pre class="overflow-auto max-h-screen text-xs {className}"
 				><code class="language-{language}">{code}</code></pre
 			>
 		{/if}

package/package/components/HighlightCode.svelte.d.ts

@@ -1,26 +1,16 @@
 import type { Script } from '../gen';
+import { ClipboardCopy } from 'lucide-svelte';
 import type { LanguageType } from 'svelte-highlight/languages';
-interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
-    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
-        $$bindings?: Bindings;
-    } & Exports;
-    (internal: unknown, props: Props & {
-        $$events?: Events;
-        $$slots?: Slots;
-    }): Exports & {
-        $set?: any;
-        $on?: any;
-    };
-    z_$$bindings?: Bindings;
-}
-declare const HighlightCode: $$__sveltets_2_IsomorphicComponent<{
-    [x: string]: any;
-    code?: string | undefined;
-    language: Script["language"] | "bunnative" | "frontend" | undefined;
+interface Props {
+    code?: string;
+    language: Script['language'] | 'bunnative' | 'frontend' | undefined;
     highlightLanguage?: LanguageType<string> | undefined;
-    lines?: boolean | undefined;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-type HighlightCode = InstanceType<typeof HighlightCode>;
+    lines?: boolean;
+    className?: string;
+    onApplyCode?: () => void;
+    showApplyButton?: boolean;
+    applyButtonIcon?: typeof ClipboardCopy;
+}
+declare const HighlightCode: import("svelte").Component<Props, {}, "">;
+type HighlightCode = ReturnType<typeof HighlightCode>;
 export default HighlightCode;

package/package/components/InputTransformForm.svelte

@@ -32,7 +32,6 @@ import { inputBorderClass } from './text_input/TextInput.svelte';
 let { schema = $bindable(), arg = $bindable(), argName = $bindable(), headerTooltip = undefined, headerTooltipIconClass = '', HeaderTooltipIcon = InfoIcon, extraLib = $bindable('missing extraLib'), inputCheck = $bindable(true), previousModuleId, pickForField = $bindable(undefined), variableEditor = undefined, itemPicker = undefined, noDynamicToggle = false, argExtra = {}, pickableProperties = undefined, enableAi = false, hideHelpButton = false, class: className = '', editor = $bindable(undefined), otherArgs = {}, helperScript = undefined } = $props();
 let monaco = $state(undefined);
 let monacoTemplate = $state(undefined);
-let argInput = $state(undefined);
 let focusedPrev = false;
 let hidden = $state(false);
 const variableMatch = (value) => value.match(/^variable\('([^']+)'\)$/);
@@ -210,6 +209,7 @@ function connectProperty(rawValue) {
         monaco?.setCode(arg.expr);
     }
 }
+// This only works if every fields are static, as we can't eval javascript
 function handleFieldVisibility(schema, arg, otherArgs) {
     const schemaProperty = schema?.properties?.[argName];
     if (schemaProperty?.showExpr) {
@@ -219,14 +219,18 @@ function handleFieldVisibility(schema, arg, otherArgs) {
         const contextArgs = {
             [argName]: currentValue
         };
+        let hasJavascript = false;
         // Extract values from InputTransform objects in otherArgs
         Object.keys(otherArgs ?? {}).forEach((key) => {
+            if (otherArgs[key].type === 'javascript') {
+                hasJavascript = true;
+            }
             const otherArg = otherArgs[key];
             const otherArgValue = otherArg.type === 'static' ? otherArg.value : otherArg.expr;
             contextArgs[key] = otherArgValue;
         });
         const shouldShow = computeShow(argName, schemaProperty.showExpr, contextArgs);
-        if (shouldShow) {
+        if (shouldShow || hasJavascript) {
             hidden = false;
         }
         else if (!hidden) {
@@ -247,33 +251,6 @@ function handleFieldVisibility(schema, arg, otherArgs) {
 }
 function onFocus() {
     focused = true;
-    if (isStaticTemplate(inputCat)) {
-        focusProp?.(argName, 'append', (path) => {
-            // Empty field + variable = use $var:/$res: syntax instead of ${...}
-            const isEmpty = !arg.value || arg.value.trim() === '';
-            if (isEmpty && variableMatch(path)) {
-                connectProperty(path);
-                return true;
-            }
-            else {
-                const toAppend = `\$\{${path}}`;
-                arg.value = `${arg.value ?? ''}${toAppend}`;
-                monacoTemplate?.setCode(arg.value);
-                setPropertyType(arg.value);
-                argInput?.focus();
-                return false;
-            }
-        });
-    }
-    else {
-        focusProp?.(argName, 'insert', (path) => {
-            arg.expr = path;
-            arg.type = 'javascript';
-            propertyType = 'javascript';
-            monaco?.setCode(arg.expr);
-            return true;
-        });
-    }
 }
 let prevArg = undefined;
 function onArgChange() {
@@ -347,7 +324,7 @@ let shouldShowS3ArrayHelper = $derived(inputCat === 'list' &&
     ['s3object', 's3_object'].includes(schema?.properties?.[argName]?.items?.resourceType));
 </script>
 
-{#if arg != undefined}
+{#if arg != undefined && !hidden}
 	<div class={twMerge('pt-2 pb-2 relative group', className)}>
 		<div class="flex flex-row justify-between gap-1 pb-1">
 			<div class="flex flex-wrap grow min-h-7 items-end">
@@ -588,7 +565,6 @@ let shouldShowS3ArrayHelper = $derived(inputCat === 'list' &&
 							{resourceTypes}
 							noMargin
 							compact
-							bind:this={argInput}
 							on:focus={onFocus}
 							on:blur={() => {
 								focused = false
@@ -654,19 +630,11 @@ let shouldShowS3ArrayHelper = $derived(inputCat === 'list' &&
 								renderLineHighlight="none"
 								hideLineNumbers
 								fakeMonacoPlaceholderClass="mt-2"
-								on:focus={() => {
-									focused = true
-									focusProp?.(argName, 'insert', (path) => {
-										monaco?.insertAtCursor(path)
-										return false
-									})
-								}}
+								on:focus={() => (focused = true)}
+								on:blur={() => (focused = false)}
 								on:change={() => {
 									dispatch('change', { argName, arg })
 								}}
-								on:blur={() => {
-									focused = false
-								}}
 								autoHeight
 								loadAsync
 							/>

package/package/components/InstanceSetting.svelte

@@ -1020,12 +1020,7 @@ function handleChannelChange(channel, i) {
 						bind:value={$values[setting.key]}
 					/>
 				{:else if setting.fieldType == 'password'}
-					<input
-						autocomplete="new-password"
-						type="password"
-						placeholder={setting.placeholder}
-						bind:value={$values[setting.key]}
-					/>
+					<Password small placeholder={setting.placeholder} bind:password={$values[setting.key]} />
 				{:else if setting.fieldType == 'boolean'}
 					<div class="mt-0.5">
 						<Toggle

package/package/components/ResourceEditor.svelte

@@ -149,7 +149,7 @@ run(() => {
     }
 });
 run(() => {
-    canSave = can_write && isValid && jsonError == '';
+    canSave = (can_write && isValid && jsonError == '') || (viewJsonSchema && jsonError == '');
 });
 $effect(() => {
     onChange && onChange({ path, args, description });

package/package/components/ResourcePicker.svelte

@@ -13,7 +13,6 @@ import { twMerge } from 'tailwind-merge';
 import DropdownV2 from './DropdownV2.svelte';
 let { initialValue = $bindable(undefined), value = $bindable(undefined), valueType = $bindable(undefined), resourceType = undefined, disabled = false, disablePortal = false, showSchemaExplorer = false, selectFirst = false, expressOAuthSetup = false, defaultValues = undefined, placeholder = undefined, selectInputClass = '', class: className = '', onClear = undefined, excludedValues = undefined } = $props();
 if (initialValue && value == undefined) {
-    console.log('initialValue', initialValue);
     value = initialValue;
 }
 onMount(() => {
@@ -35,17 +34,14 @@ onMount(() => {
 $effect(() => {
     if (value === undefined) {
         if (initialValue) {
-            console.log('initialValue', initialValue);
             if (initialValue != value) {
                 value = initialValue;
             }
         }
         else {
-            console.log('no value');
         }
     }
     else {
-        console.log('value', value);
     }
 });
 let collection = $state(value ? [{ value, label: value, type: valueType }] : []);
@@ -76,7 +72,6 @@ async function loadResources(resourceType) {
         }
         collection = nc;
         if (collection.length == 1 && selectFirst && (value == undefined || value == '')) {
-            console.log('selectFirst', collection[0].value);
             value = collection[0].value;
             valueType = collection[0].type;
         }