windmill-components 1.532.0 → 1.542.4

package/package/components/ConcurrentJobsChart.svelte

@@ -1,14 +1,9 @@
 <script lang="ts">import 'chartjs-adapter-date-fns';
 import zoomPlugin from 'chartjs-plugin-zoom';
 import { Chart as ChartJS, CategoryScale, Legend, LineElement, LinearScale, PointElement, TimeScale, Title, Tooltip } from 'chart.js';
-import { createEventDispatcher } from 'svelte';
 import { getDbClockNow } from '../forLater';
 import { Line } from './chartjs-wrappers/chartJs';
-export let extendedJobs = undefined;
-export let maxIsNow = false;
-export let minTimeSet = undefined;
-export let maxTimeSet = undefined;
-const dispatch = createEventDispatcher();
+let { extendedJobs = undefined, maxIsNow = false, minTimeSet = undefined, maxTimeSet = undefined, onZoom } = $props();
 function calculateTimeSeries(extendedJobs) {
     const timeline = new Map();
     extendedJobs.jobs.forEach((j) => {
@@ -40,7 +35,7 @@ function calculateTimeSeries(extendedJobs) {
             }
             const s = timeline.get(startTime);
             s.count += 1;
-            s.id_started.push('unknoww');
+            s.id_started.push('unknown');
             if (j.duration_ms != undefined) {
                 const jc = j;
                 const endTime = startTime + jc.duration_ms;
@@ -79,32 +74,13 @@ function calculateTimeSeries(extendedJobs) {
     }
     return result;
 }
-let intervals = undefined;
-$: intervals = extendedJobs ? calculateTimeSeries(extendedJobs) : undefined;
 ChartJS.register(Title, Tooltip, Legend, zoomPlugin, LineElement, CategoryScale, LinearScale, PointElement, TimeScale);
-$: data = {
-    datasets: [
-        {
-            borderColor: '#4ade80',
-            backgroundColor: '#f8717100',
-            pointRadius: 0,
-            label: 'running',
-            showLine: true,
-            stepped: true,
-            data: intervals?.map((job) => ({
-                x: job.time,
-                y: job.count,
-                id: job.msg
-            })) ?? []
-        }
-    ]
-};
 const zoomOptions = {
     pan: {
         enabled: true,
         modifierKey: 'ctrl',
         onPanComplete: ({ chart }) => {
-            dispatch('zoom', {
+            onZoom({
                 min: addSeconds(new Date(chart.scales.x.min), -1),
                 max: addSeconds(new Date(chart.scales.x.max), 1)
             });
@@ -116,16 +92,13 @@ const zoomOptions = {
         },
         mode: 'x',
         onZoom: ({ chart }) => {
-            dispatch('zoom', {
+            onZoom({
                 min: addSeconds(new Date(chart.scales.x.min), -1),
                 max: addSeconds(new Date(chart.scales.x.max), 1)
             });
         }
     }
 };
-let minTime = addSeconds(new Date(), -300);
-let maxTime = getDbClockNow();
-$: computeMinMaxTime(intervals, minTimeSet, maxTimeSet);
 function minJobTime(intervals) {
     return intervals[0].time;
 }
@@ -136,31 +109,46 @@ function computeMinMaxTime(intervals, minTimeSet, maxTimeSet) {
     let minTimeSetDate = minTimeSet ? new Date(minTimeSet) : undefined;
     let maxTimeSetDate = maxTimeSet ? new Date(maxTimeSet) : undefined;
     if (minTimeSetDate && maxTimeSetDate) {
-        minTime = minTimeSetDate;
-        maxTime = maxTimeSetDate;
-        return;
+        return { min: minTimeSetDate, max: maxTimeSetDate };
     }
     if (intervals == undefined || intervals?.length == 0) {
-        minTime = minTimeSetDate ?? addSeconds(new Date(), -300);
-        maxTime = maxTimeSetDate ?? getDbClockNow();
-        return;
+        const minTime = minTimeSetDate ?? addSeconds(new Date(), -300);
+        const maxTime = maxTimeSetDate ?? getDbClockNow();
+        return { min: minTime, max: maxTime };
     }
     const maxJob = maxIsNow ? getDbClockNow() : maxJobTime(intervals);
     const minJob = minJobTime(intervals);
     const diff = (maxJob.getTime() - minJob.getTime()) / 20000;
-    minTime = minTimeSetDate ?? addSeconds(minJob, -diff);
-    if (maxIsNow) {
-        maxTime = maxTimeSetDate ?? maxJob;
-    }
-    else {
-        maxTime = maxTimeSetDate ?? addSeconds(maxJob, diff);
-    }
+    const minTime = minTimeSetDate ?? addSeconds(minJob, -diff);
+    const maxTime = maxIsNow
+        ? (maxTimeSetDate ?? maxJob)
+        : (maxTimeSetDate ?? addSeconds(maxJob, diff));
+    return { min: minTime, max: maxTime };
 }
 function addSeconds(date, seconds) {
     date.setTime(date.getTime() + seconds * 1000);
     return date;
 }
-$: options = {
+const intervals = $derived(extendedJobs ? calculateTimeSeries(extendedJobs) : undefined);
+let data = $derived({
+    datasets: [
+        {
+            borderColor: '#4ade80',
+            backgroundColor: '#f8717100',
+            pointRadius: 0,
+            label: 'running',
+            showLine: true,
+            stepped: true,
+            data: intervals?.map((job) => ({
+                x: job.time,
+                y: job.count,
+                id: job.msg
+            })) ?? []
+        }
+    ]
+});
+const minMaxTimes = $derived(computeMinMaxTime(intervals, minTimeSet, maxTimeSet));
+let options = $derived({
     responsive: true,
     maintainAspectRatio: false,
     plugins: {
@@ -182,8 +170,8 @@ $: options = {
             grid: {
                 display: false
             },
-            min: minTime,
-            max: maxTime
+            min: minMaxTimes.min,
+            max: minMaxTimes.max
         },
         y: {
             grid: {
@@ -204,7 +192,7 @@ $: options = {
         intersect: false,
         mode: 'index'
     }
-};
+});
 </script>
 
 <div class="relative max-h-40">

package/package/components/ConcurrentJobsChart.svelte.d.ts

@@ -1,27 +1,15 @@
 import 'chartjs-adapter-date-fns';
 import type { ExtendedJobs } from '../gen';
-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 ConcurrentJobsChart: $$__sveltets_2_IsomorphicComponent<{
+interface Props {
     extendedJobs?: ExtendedJobs | undefined;
     maxIsNow?: boolean;
     minTimeSet?: string | undefined;
     maxTimeSet?: string | undefined;
-}, {
-    zoom: CustomEvent<any>;
-} & {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-type ConcurrentJobsChart = InstanceType<typeof ConcurrentJobsChart>;
+    onZoom: (zoom: {
+        min: Date;
+        max: Date;
+    }) => void;
+}
+declare const ConcurrentJobsChart: import("svelte").Component<Props, {}, "">;
+type ConcurrentJobsChart = ReturnType<typeof ConcurrentJobsChart>;
 export default ConcurrentJobsChart;

package/package/components/CustomPopover.svelte.d.ts

@@ -31,7 +31,7 @@ declare const CustomPopover: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_P
     default: {};
     overlay: {};
 }>, {
-    click: MouseEvent;
+    click: PointerEvent;
 } & {
     [evt: string]: CustomEvent<any>;
 }, {

package/package/components/Dev.svelte

@@ -27,7 +27,7 @@ import { approximateFindPythonRelativePath, isTypescriptRelativePath, parseTypes
 import Tooltip from './Tooltip.svelte';
 import { workspaceAIClients } from './copilot/lib';
 import { Triggers } from './triggers/triggers.svelte';
-import { TestSteps } from './flows/testSteps.svelte';
+import { StepsInputArgs } from './flows/stepsInputArgs.svelte';
 import { ModulesTestStates } from './modulesTest.svelte';
 let flowCopilotContext = {
     shouldUpdatePropertyType: writable({}),
@@ -374,7 +374,7 @@ const previewArgsStore = $state({ val: {} });
 const scriptEditorDrawer = writable(undefined);
 const moving = writable(undefined);
 const history = initHistory(flowStore.val);
-const testSteps = new TestSteps();
+const stepsInputArgs = new StepsInputArgs();
 const selectedIdStore = writable('settings-metadata');
 const triggersCount = writable(undefined);
 const modulesTestStates = new ModulesTestStates((moduleId) => {
@@ -397,7 +397,7 @@ setContext('FlowEditorContext', {
     pathStore: writable(''),
     flowStateStore,
     flowStore,
-    testSteps,
+    stepsInputArgs,
     saveDraft: () => { },
     initialPathStore: writable(''),
     fakeInitialPath: '',
@@ -708,7 +708,7 @@ const flowHasChanged = $derived(flowPreviewContent?.flowHasChanged());
 								noEditor
 								on:applyArgs={(ev) => {
 									if (ev.detail.kind === 'preprocessor') {
-										testSteps.setStepArgs('preprocessor', ev.detail.args ?? {})
+										stepsInputArgs.setStepArgs('preprocessor', ev.detail.args ?? {})
 										$selectedIdStore = 'preprocessor'
 									} else {
 										previewArgsStore.val = ev.detail.args ?? {}
@@ -720,6 +720,7 @@ const flowHasChanged = $derived(flowPreviewContent?.flowHasChanged());
 								isOwner={flowPreviewContent?.getIsOwner()}
 								{suspendStatus}
 								onOpenDetails={flowPreviewButtons?.openPreview}
+								previewOpen={flowPreviewButtons?.getPreviewOpen()}
 							/>
 						{/key}
 					</Pane>

package/package/components/DiffDrawer.svelte

@@ -155,7 +155,7 @@ export function setDiff(diff) {
 										<Module.default
 											open={true}
 											automaticLayout
-											class="h-full"
+											className="h-full"
 											defaultLang={lang}
 											defaultModifiedLang={data.current.lang}
 											defaultOriginal={content}
@@ -170,7 +170,7 @@ export function setDiff(diff) {
 										<Module.default
 											open={true}
 											automaticLayout
-											class="h-full"
+											className="h-full"
 											defaultLang="yaml"
 											defaultOriginal={metadata}
 											defaultModified={data.current.metadata}

package/package/components/DiffEditor.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">import { BROWSER } from 'esm-env';
-import { createEventDispatcher, onMount } from 'svelte';
+import { onMount } from 'svelte';
 import '@codingame/monaco-vscode-standalone-languages';
 import '@codingame/monaco-vscode-standalone-json-language-features';
 import '@codingame/monaco-vscode-standalone-typescript-language-features';
@@ -7,20 +7,12 @@ import { editor as meditor } from 'monaco-editor';
 import { initializeVscode } from './vscode';
 import EditorTheme from './EditorTheme.svelte';
 import Button from './common/button/Button.svelte';
+import { twMerge } from 'tailwind-merge';
 const SIDE_BY_SIDE_MIN_WIDTH = 700;
-export let automaticLayout = true;
-export let fixedOverflowWidgets = true;
-export let defaultLang = undefined;
-export let defaultModifiedLang = undefined;
-export let defaultOriginal = undefined;
-export let defaultModified = undefined;
-export let readOnly = false;
-export let showButtons = false;
-export let showHistoryButton = true;
-let diffEditor;
-let diffDivEl = null;
-let editorWidth = SIDE_BY_SIDE_MIN_WIDTH;
-export let open = false;
+let { open = false, className = '', automaticLayout = true, fixedOverflowWidgets = true, defaultLang, defaultModifiedLang, defaultOriginal = undefined, defaultModified = undefined, readOnly = false, buttons = [], modifiedModel } = $props();
+let diffEditor = $state(undefined);
+let diffDivEl = $state(null);
+let editorWidth = $state(SIDE_BY_SIDE_MIN_WIDTH);
 async function loadDiffEditor() {
     await initializeVscode();
     if (!diffDivEl) {
@@ -40,23 +32,17 @@ async function loadDiffEditor() {
         lineNumbersMinChars: 2,
         scrollbar: { alwaysConsumeMouseWheel: false }
     });
-    if (defaultOriginal !== undefined &&
-        defaultModified !== undefined &&
-        defaultLang !== undefined) {
+    if (defaultLang !== undefined) {
         setupModel(defaultLang, defaultOriginal, defaultModified, defaultModifiedLang);
     }
 }
 export function setupModel(lang, original, modified, modifiedLang) {
+    const o = meditor.createModel(original ?? '', lang);
+    const m = modifiedModel ?? meditor.createModel(modified ?? '', modifiedLang ?? lang);
     diffEditor?.setModel({
-        original: meditor.createModel('', lang),
-        modified: meditor.createModel('', modifiedLang ?? lang)
+        original: o,
+        modified: m
     });
-    if (original) {
-        setOriginal(original);
-    }
-    if (modified) {
-        setModified(modified);
-    }
 }
 export function setOriginal(code) {
     diffEditor?.getModel()?.original?.setValue(code);
@@ -69,6 +55,15 @@ export function setModified(code) {
     diffEditor?.getModel()?.modified?.setValue(code);
     defaultModified = code;
 }
+export function setModifiedModel(model) {
+    const curr = diffEditor?.getModel();
+    if (!curr)
+        return;
+    diffEditor?.setModel({
+        original: curr.original,
+        modified: model
+    });
+}
 export function getModified() {
     return diffEditor?.getModel()?.modified.getValue() ?? '';
 }
@@ -81,8 +76,14 @@ export function hide() {
 function onWidthChange(editorWidth) {
     diffEditor?.updateOptions({ renderSideBySide: editorWidth >= SIDE_BY_SIDE_MIN_WIDTH });
 }
-$: onWidthChange(editorWidth);
-$: open && diffDivEl && loadDiffEditor();
+$effect(() => {
+    if (open && diffDivEl) {
+        loadDiffEditor();
+    }
+});
+$effect(() => {
+    onWidthChange(editorWidth);
+});
 onMount(() => {
     if (BROWSER) {
         return () => {
@@ -90,28 +91,24 @@ onMount(() => {
         };
     }
 });
-const dispatch = createEventDispatcher();
 </script>
 
 {#if open}
 	<EditorTheme />
 	<div
 		bind:this={diffDivEl}
-		class="{$$props.class} editor nonmain-editor"
+		class={twMerge('editor nonmain-editor', className)}
 		bind:clientWidth={editorWidth}
 	></div>
-	{#if showButtons}
+	{#if buttons.length > 0}
 		<div
 			class="absolute flex flex-row gap-2 bottom-10 left-1/2 z-10 -translate-x-1/2 rounded-md p-1 w-full justify-center"
 		>
-			{#if showHistoryButton}
-				<Button on:click={() => dispatch('seeHistory')} variant="contained" size="sm"
-					>See changes history</Button
+			{#each buttons as button}
+				<Button on:click={button.onClick} variant="contained" size="sm" color={button.color}
+					>{button.text}</Button
 				>
-			{/if}
-			<Button on:click={() => dispatch('hideDiffMode')} variant="contained" size="sm" color="red"
-				>Quit diff mode</Button
-			>
+			{/each}
 		</div>
 	{/if}
 {/if}

package/package/components/DiffEditor.svelte.d.ts

@@ -1,51 +1,35 @@
 import '@codingame/monaco-vscode-standalone-languages';
 import '@codingame/monaco-vscode-standalone-json-language-features';
 import '@codingame/monaco-vscode-standalone-typescript-language-features';
-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;
+import { editor as meditor } from 'monaco-editor';
+import type { ButtonType } from './common';
+export interface ButtonProp {
+    text: string;
+    color?: ButtonType.Color;
+    onClick: () => void;
 }
-declare const DiffEditor: $$__sveltets_2_IsomorphicComponent<{
-    [x: string]: any;
-    automaticLayout?: boolean | undefined;
-    fixedOverflowWidgets?: boolean | undefined;
-    defaultLang?: string | undefined | undefined;
-    defaultModifiedLang?: string | undefined | undefined;
-    defaultOriginal?: string | undefined | undefined;
-    defaultModified?: string | undefined | undefined;
-    readOnly?: boolean | undefined;
-    showButtons?: boolean | undefined;
-    showHistoryButton?: boolean | undefined;
-    open?: boolean | undefined;
-    setupModel?: ((lang: string, original?: string, modified?: string, modifiedLang?: string) => void) | undefined;
-    setOriginal?: ((code: string) => void) | undefined;
-    getOriginal?: (() => string) | undefined;
-    setModified?: ((code: string) => void) | undefined;
-    getModified?: (() => string) | undefined;
-    show?: (() => void) | undefined;
-    hide?: (() => void) | undefined;
-}, {
-    hideDiffMode: CustomEvent<void>;
-    seeHistory: CustomEvent<void>;
-} & {
-    [evt: string]: CustomEvent<any>;
-}, {}, {
+interface Props {
+    open?: boolean;
+    className?: string;
+    automaticLayout?: boolean;
+    fixedOverflowWidgets?: boolean;
+    defaultLang?: string;
+    defaultModifiedLang?: string;
+    defaultOriginal?: string;
+    defaultModified?: string;
+    readOnly?: boolean;
+    buttons?: ButtonProp[];
+    modifiedModel?: meditor.ITextModel;
+}
+declare const DiffEditor: import("svelte").Component<Props, {
     setupModel: (lang: string, original?: string, modified?: string, modifiedLang?: string) => void;
     setOriginal: (code: string) => void;
     getOriginal: () => string;
     setModified: (code: string) => void;
+    setModifiedModel: (model: meditor.ITextModel) => void;
     getModified: () => string;
     show: () => void;
     hide: () => void;
-}, string>;
-type DiffEditor = InstanceType<typeof DiffEditor>;
+}, "">;
+type DiffEditor = ReturnType<typeof DiffEditor>;
 export default DiffEditor;

package/package/components/DropdownSelect.svelte

@@ -0,0 +1,26 @@
+<script lang="ts">import DropdownV2 from './DropdownV2.svelte';
+import { ChevronDown } from 'lucide-svelte';
+import { twMerge } from 'tailwind-merge';
+let { items = [], extraLabel, selected, selectedDisplayName, btnClasses } = $props();
+const filteredItems = $derived(items.filter((item) => item.id !== selected));
+</script>
+
+<DropdownV2 items={filteredItems}>
+	{#snippet buttonReplacement()}
+		<div
+			class={twMerge(
+				'p-2 h-8 flex flex-row items-center gap-2 border hover:bg-surface-hover cursor-pointer rounded-md',
+				btnClasses
+			)}
+		>
+			<div class="flex flex-row items-center gap-1 pr-2 justify-between w-full">
+				<span class="text-xs whitespace-nowrap">
+					{selectedDisplayName ?? items.find((item) => item.id === selected)?.displayName ?? ''}
+				</span>
+
+				{@render extraLabel?.()}
+			</div>
+			<ChevronDown size={12} />
+		</div>
+	{/snippet}
+</DropdownV2>

package/package/components/DropdownSelect.svelte.d.ts

@@ -0,0 +1,11 @@
+import type { Item } from '../utils';
+interface Props {
+    items?: Item[];
+    extraLabel?: import('svelte').Snippet;
+    selected: string;
+    selectedDisplayName?: string;
+    btnClasses?: string;
+}
+declare const DropdownSelect: import("svelte").Component<Props, {}, "">;
+type DropdownSelect = ReturnType<typeof DropdownSelect>;
+export default DropdownSelect;

package/package/components/DropdownV2Inner.svelte

@@ -36,7 +36,7 @@ computeItems();
 				aiDescription={item.displayName}
 			>
 				{#if item.icon}
-					<item.icon size={14} color={item.iconColor} />
+					<item.icon size={14} color={item.iconColor} class="shrink-0" />
 				{/if}
 				<p title={item.displayName} class="truncate grow min-w-0 whitespace-nowrap text-left">
 					{item.displayName}

package/package/components/{DynSelect.svelte → DynamicInput.svelte}

@@ -17,12 +17,20 @@ function validSelectObject(x) {
 <script lang="ts">import { usePromise } from '../svelte5Utils.svelte';
 import JobLoader, {} from './JobLoader.svelte';
 import Select from './select/Select.svelte';
+import MultiSelect from './select/MultiSelect.svelte';
+import { safeSelectItems } from './select/utils.svelte';
 import Tooltip from './Tooltip.svelte';
 import { Loader2 } from 'lucide-svelte';
 import {} from '../utils';
 import { deepEqual } from 'fast-equals';
 import { untrack } from 'svelte';
-let { value = $bindable(), helperScript, entrypoint, otherArgs: otherArgs } = $props();
+let { value = $bindable(), helperScript, format, otherArgs: otherArgs } = $props();
+const [inputType, entrypoint] = format.includes('-') ? format.split('-', 2) : [format, ''];
+const isMultiple = inputType === 'dynmultiselect';
+const isSelect = inputType === 'dynselect' || inputType === 'dynmultiselect';
+if (isMultiple && value === undefined) {
+    value = [];
+}
 let resultJobLoader = $state();
 let _items = usePromise(getItemsFromOptions, { clearValueOnRefresh: false });
 let items = $derived(_items.value);
@@ -34,7 +42,7 @@ async function getItemsFromOptions() {
             doneResult({ result }) {
                 if (!result || !Array.isArray(result)) {
                     if (result?.error?.message && result?.error?.name) {
-                        reject('Error in DynSelect function execution: ' +
+                        reject(`Error in ${inputType} function execution: ` +
                             result?.error?.name +
                             ' - ' +
                             result?.error?.message);
@@ -67,9 +75,18 @@ async function getItemsFromOptions() {
 }
 let neverLoaded = $state(true);
 $effect(() => {
-    if (_items.value && value) {
-        if (!_items.value.find((x) => x.value == value)) {
-            value = undefined;
+    if (_items.value && value !== undefined && isSelect) {
+        if (isMultiple && Array.isArray(value)) {
+            const availableValues = new Set(_items.value.map((x) => x.value));
+            const filteredValue = value.filter((v) => availableValues.has(v));
+            if (filteredValue.length !== value.length) {
+                value = filteredValue;
+            }
+        }
+        else if (!isMultiple && value !== undefined) {
+            if (!_items.value.find((x) => x.value == value)) {
+                value = undefined;
+            }
         }
     }
 });
@@ -98,15 +115,30 @@ $effect(() => {
 	<JobLoader onlyResult bind:this={resultJobLoader} />
 
 	<div class="w-full flex-col flex">
-		<Select
-			bind:value
-			bind:open
-			{items}
-			bind:filterText
-			loading={!open && _items.status === 'loading'}
-			clearable
-			noItemsMsg={_items.status === 'loading' ? 'Loading...' : 'No items found'}
-		/>
+		{#if inputType === 'dynmultiselect'}
+			<MultiSelect
+				bind:value
+				items={safeSelectItems(items || [])}
+				placeholder="Select items"
+				noItemsMsg={_items.status === 'loading' ? 'Loading...' : 'No items found'}
+				disabled={_items.status === 'loading'}
+			/>
+		{:else if inputType === 'dynselect'}
+			<Select
+				bind:value
+				bind:open
+				{items}
+				bind:filterText
+				loading={!open && _items.status === 'loading'}
+				clearable
+				noItemsMsg={_items.status === 'loading' ? 'Loading...' : 'No items found'}
+			/>
+		{:else}
+			<!-- Future dynamic input types can be added here -->
+			<div class="text-red-400 text-sm">
+				Unsupported dynamic input type: {inputType}
+			</div>
+		{/if}
 		{#if _items.error}
 			<div class="text-red-400 text-2xs">
 				error: <Tooltip>{_items.error}</Tooltip>
@@ -116,7 +148,7 @@ $effect(() => {
 {:else}
 	<div class="flex flex-col gap-1 w-full">
 		<div class="text-xs text-tertiary"
-			>Dynamic Select is not available in this mode, write value directly</div
+			>Dynamic input ({inputType}) is not available in this mode, write value directly</div
 		>
 		{#await import('./JsonEditor.svelte')}
 			<Loader2 class="animate-spin" />

package/package/components/DynamicInput.svelte.d.ts

@@ -0,0 +1,11 @@
+import { type DynamicInput } from '../utils';
+interface Props {
+    value?: any;
+    helperScript?: DynamicInput.HelperScript;
+    format: string;
+    otherArgs?: Record<string, any>;
+    name: string;
+}
+declare const DynamicInput: import("svelte").Component<Props, {}, "value">;
+type DynamicInput = ReturnType<typeof DynamicInput>;
+export default DynamicInput;