windmill-components 1.493.10 → 1.501.5

package/package/components/flows/map/VirtualItem.svelte

@@ -1,30 +1,15 @@
 <script lang="ts">import { Badge } from '../../common';
-import { getContext } from 'svelte';
 import VirtualItemWrapper from './VirtualItemWrapper.svelte';
 import OutputPicker from '../propPicker/OutputPicker.svelte';
 import OutputPickerInner from '../propPicker/OutputPickerInner.svelte';
 import Popover from '../../Popover.svelte';
 import { fade } from 'svelte/transition';
 import { Database, Square } from 'lucide-svelte';
-import { useSvelteFlow } from '@xyflow/svelte';
-export let label = undefined;
-export let bgColor = '';
-export let bgHoverColor = '';
-export let selected;
-export let selectable;
-export let id = undefined;
-export let center = true;
-export let borderColor = undefined;
-export let hideId = false;
-export let preLabel = undefined;
-export let inputJson = undefined;
-export let prefix = '';
-export let alwaysPluggable = false;
-export let cache = false;
-export let earlyStop = false;
-export let editMode = false;
-const { currentStepStore: copilotCurrentStepStore } = getContext('FlowCopilotContext') || {};
-const { viewport } = useSvelteFlow();
+import ModuleAcceptReject, { getAiModuleAction } from '../../copilot/chat/flow/ModuleAcceptReject.svelte';
+import { aiModuleActionToBgColor } from '../../copilot/chat/flow/utils';
+let { label = undefined, bgColor = '', bgHoverColor = '', selected, selectable, id = undefined, center = true, borderColor = undefined, hideId = false, preLabel = undefined, inputJson = undefined, prefix = '', alwaysPluggable = false, cache = false, earlyStop = false, editMode = false, icon, onUpdateMock, onEditInput } = $props();
+const outputPickerVisible = $derived((alwaysPluggable || (inputJson && Object.keys(inputJson).length > 0)) && editMode);
+let action = $derived(label === 'Input' ? getAiModuleAction(label) : undefined);
 </script>
 
 <VirtualItemWrapper
@@ -34,86 +19,96 @@ const { viewport } = useSvelteFlow();
 	{selected}
 	{selectable}
 	{id}
-	onTop={label === 'Input' && $copilotCurrentStepStore === 'Input'}
+	outputPickerVisible={outputPickerVisible ?? false}
+	className={editMode ? aiModuleActionToBgColor(action) : ''}
 	on:select
-	let:hover
 >
-	<div class="flex flex-col w-full">
-		<div
-			style={borderColor ? `border-color: ${borderColor};` : 'border: 0'}
-			class="flex flex-row gap-1 justify-between {center
-				? 'items-center'
-				: 'items-baseline'} w-full overflow-hidden rounded-sm border p-2 text-2xs module text-primary border-gray-400 dark:border-gray-600"
-		>
-			{#if $$slots.icon}
-				<slot name="icon" />
-				<span class="mr-2"></span>
-			{/if}
-			<div class="flex flex-col flex-grow shrink-0 max-w-full min-w-0">
-				{#if label}
-					<div class="truncate text-center">{label}</div>
+	{#snippet children({ hover })}
+		{#if editMode}
+			<ModuleAcceptReject id="Input" {action} />
+		{/if}
+		<div class="flex flex-col w-full">
+			<div
+				style={borderColor ? `border-color: ${borderColor};` : 'border: 0'}
+				class="flex flex-row gap-1 justify-between {center
+					? 'items-center'
+					: 'items-baseline'} w-full overflow-hidden rounded-sm border p-2 text-2xs module text-primary border-gray-400 dark:border-gray-600"
+			>
+				{#if icon}
+					{@render icon?.()}
+					<span class="mr-2"></span>
 				{/if}
-				{#if preLabel}
-					<div class="truncate text-2xs text-center"><pre>{preLabel}</pre></div>
+				<div class="flex flex-col flex-grow shrink-0 max-w-full min-w-0">
+					{#if label}
+						<div class="truncate text-center">{label}</div>
+					{/if}
+					{#if preLabel}
+						<div class="truncate text-2xs text-center"><pre>{preLabel}</pre></div>
+					{/if}
+				</div>
+				{#if id && !hideId && !id?.startsWith('subflow:')}
+					<div class="flex items-center shrink min-w-0">
+						<Badge color="indigo" wrapperClass="w-full" baseClass="max-w-full" title={id}>
+							<span class="max-w-full text-2xs truncate">{id}</span>
+						</Badge>
+					</div>
 				{/if}
 			</div>
-			{#if id && !hideId && !id?.startsWith('subflow:')}
-				<div class="flex items-center shrink min-w-0">
-					<Badge color="indigo" wrapperClass="w-full" baseClass="max-w-full" title={id}>
-						<span class="max-w-full text-2xs truncate">{id}</span>
-					</Badge>
-				</div>
+			{#if outputPickerVisible}
+				<OutputPicker
+					{selected}
+					{hover}
+					id={id ?? ''}
+					isConnectingCandidate={true}
+					variant="virtual"
+				>
+					{#snippet children({ allowCopy, isConnecting, selectConnection })}
+						<OutputPickerInner
+							{allowCopy}
+							{prefix}
+							connectingData={isConnecting ? inputJson : undefined}
+							onSelect={selectConnection}
+							moduleId={''}
+							{onUpdateMock}
+							hideHeaderBar
+							simpleViewer={inputJson}
+							rightMargin
+							historyOffset={{ mainAxis: 12, crossAxis: -9 }}
+							clazz="p-1"
+							{onEditInput}
+							selectionId={id ?? label ?? ''}
+						/>
+					{/snippet}
+				</OutputPicker>
 			{/if}
 		</div>
-		{#if (alwaysPluggable || (inputJson && Object.keys(inputJson).length > 0)) && editMode}
-			<OutputPicker
-				zoom={$viewport?.zoom ?? 1}
-				{selected}
-				{hover}
-				let:allowCopy
-				isConnectingCandidate={true}
-				let:isConnecting
-				let:selectConnection
-				variant="virtual"
-			>
-				<OutputPickerInner
-					{allowCopy}
-					{prefix}
-					connectingData={isConnecting ? inputJson : undefined}
-					on:select={selectConnection}
-					moduleId={''}
-					on:updateMock
-					hideHeaderBar
-					simpleViewer={inputJson}
-					rightMargin
-					historyOffset={{ mainAxis: 12, crossAxis: -9 }}
-					class="p-1"
-				/>
-			</OutputPicker>
-		{/if}
-	</div>
-	<div class="absolute text-sm right-12 -bottom-3 flex flex-row gap-1 z-10">
-		{#if cache}
-			<Popover notClickable>
-				<div
-					transition:fade|local={{ duration: 200 }}
-					class="center-center rounded border bg-surface border-gray-400 text-secondary px-1 py-0.5"
-				>
-					<Database size={12} />
-				</div>
-				<svelte:fragment slot="text">Cached</svelte:fragment>
-			</Popover>
-		{/if}
-		{#if earlyStop}
-			<Popover notClickable>
-				<div
-					transition:fade|local={{ duration: 200 }}
-					class="center-center bg-surface rounded border border-gray-400 text-secondary px-1 py-0.5"
-				>
-					<Square size={12} />
-				</div>
-				<svelte:fragment slot="text">Early stop if condition met</svelte:fragment>
-			</Popover>
-		{/if}
-	</div>
+		<div class="absolute text-sm right-12 -bottom-3 flex flex-row gap-1 z-10">
+			{#if cache}
+				<Popover notClickable>
+					<div
+						transition:fade|local={{ duration: 200 }}
+						class="center-center rounded border bg-surface border-gray-400 text-secondary px-1 py-0.5"
+					>
+						<Database size={12} />
+					</div>
+					{#snippet text()}
+						Cached
+					{/snippet}
+				</Popover>
+			{/if}
+			{#if earlyStop}
+				<Popover notClickable>
+					<div
+						transition:fade|local={{ duration: 200 }}
+						class="center-center bg-surface rounded border border-gray-400 text-secondary px-1 py-0.5"
+					>
+						<Square size={12} />
+					</div>
+					{#snippet text()}
+						Early stop if condition met
+					{/snippet}
+				</Popover>
+			{/if}
+		</div>
+	{/snippet}
 </VirtualItemWrapper>

package/package/components/flows/map/VirtualItem.svelte.d.ts

@@ -1,17 +1,4 @@
-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 VirtualItem: $$__sveltets_2_IsomorphicComponent<{
+interface Props {
     label?: string | undefined;
     bgColor?: string;
     bgHoverColor?: string;
@@ -28,16 +15,30 @@ declare const VirtualItem: $$__sveltets_2_IsomorphicComponent<{
     cache?: boolean;
     earlyStop?: boolean;
     editMode?: boolean;
-}, {
-    select: CustomEvent<string>;
-    updateMock: CustomEvent<{
+    icon?: import('svelte').Snippet;
+    onUpdateMock?: (mock: {
         enabled: boolean;
         return_value?: unknown;
-    }>;
+    }) => void;
+    onEditInput?: (moduleId: string, key: string) => void;
+}
+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 VirtualItem: $$__sveltets_2_IsomorphicComponent<Props, {
+    select: CustomEvent<string>;
 } & {
     [evt: string]: CustomEvent<any>;
-}, {
-    icon: {};
-}, {}, string>;
+}, {}, {}, "">;
 type VirtualItem = InstanceType<typeof VirtualItem>;
 export default VirtualItem;

package/package/components/flows/map/VirtualItemWrapper.svelte

@@ -1,40 +1,40 @@
 <script lang="ts">import { classNames } from '../../../utils';
 import { createEventDispatcher } from 'svelte';
-export let label;
-export let selectable;
-export let selected;
-export let id;
-export let onTop = false;
-export let bgColor;
-export let bgHoverColor = '';
+import { twMerge } from 'tailwind-merge';
+let { label, selectable, selected, id, onTop = false, bgColor, bgHoverColor = '', children, outputPickerVisible = false, className } = $props();
 const dispatch = createEventDispatcher();
-let hover = false;
+let hover = $state(false);
 </script>
 
-<!-- svelte-ignore a11y-click-events-have-key-events -->
-<!-- svelte-ignore a11y-no-static-element-interactions -->
+<!-- svelte-ignore a11y_click_events_have_key_events -->
+<!-- svelte-ignore a11y_no_static_element_interactions -->
 <div
-	class={classNames(
-		'w-full flex relative rounded-sm',
-		selectable ? 'cursor-pointer active:outline active:outline-2' : '',
-		selected ? 'outline outline-2' : '',
-		onTop ? 'z-[901]' : '',
-		'outline-offset-1 outline-gray-600 dark:outline-gray-400'
-	)}
-	style="width: 275px; max-height: 38px; background-color: {hover && bgHoverColor && selectable
+	class={classNames('w-full flex relative rounded-sm', onTop ? 'z-[901]' : '', className)}
+	style="width: 275px; max-height: 34px; background-color: {hover && bgHoverColor && selectable
 		? bgHoverColor
 		: bgColor};"
-	on:pointerdown={() => {
+	onpointerdown={() => {
 		if (selectable) {
 			dispatch('select', id || label || '')
 		}
 	}}
-	on:mouseenter={() => {
+	onmouseenter={() => {
 		hover = true
 	}}
-	on:mouseleave={() => {
+	onmouseleave={() => {
 		hover = false
 	}}
 	title={label ? label + ' ' : ''}
-	id={`flow-editor-virtual-${encodeURIComponent(label || label || '')}`}><slot {hover} /></div
+	id={`flow-editor-virtual-${encodeURIComponent(label || label || '')}`}
 >
+	<div
+		class={twMerge(
+			'absolute  outline-gray-600 dark:outline-gray-400 rounded-sm',
+			selected ? 'outline outline-2' : '',
+			selectable ? 'cursor-pointer active:outline active:outline-2' : ''
+		)}
+		style={`width: 275px; height: ${outputPickerVisible ? '50px' : '34px'};`}
+	>
+	</div>
+	{@render children?.({ hover })}
+</div>

package/package/components/flows/map/VirtualItemWrapper.svelte.d.ts

@@ -1,4 +1,16 @@
 import type { FlowModule } from '../../../gen';
+interface Props {
+    label: string | undefined;
+    selectable: boolean;
+    selected: boolean;
+    id: string | undefined;
+    onTop?: boolean;
+    bgColor: string;
+    bgHoverColor?: string;
+    children?: import('svelte').Snippet<[any]>;
+    outputPickerVisible?: boolean;
+    className?: string;
+}
 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;
@@ -12,24 +24,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
-    default: any;
-} ? Props extends Record<string, never> ? any : {
-    children?: any;
-} : {});
-declare const VirtualItemWrapper: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
-    label: string | undefined;
-    selectable: boolean;
-    selected: boolean;
-    id: string | undefined;
-    onTop?: boolean;
-    bgColor: string;
-    bgHoverColor?: string;
-}, {
-    default: {
-        hover: boolean;
-    };
-}>, {
+declare const VirtualItemWrapper: $$__sveltets_2_IsomorphicComponent<Props, {
     insert: CustomEvent<{
         script?: {
             path: string;
@@ -43,10 +38,6 @@ declare const VirtualItemWrapper: $$__sveltets_2_IsomorphicComponent<$$__sveltet
     select: CustomEvent<string>;
 } & {
     [evt: string]: CustomEvent<any>;
-}, {
-    default: {
-        hover: boolean;
-    };
-}, {}, string>;
+}, {}, {}, "">;
 type VirtualItemWrapper = InstanceType<typeof VirtualItemWrapper>;
 export default VirtualItemWrapper;

package/package/components/flows/missingInputWarnings.d.ts

@@ -0,0 +1,6 @@
+import type { OpenFlow } from '../../gen';
+import type { Writable } from 'svelte/store';
+import type { FlowInput } from './types';
+import type { StateStore } from '../../utils';
+import type { FlowState } from './flowState';
+export declare function computeMissingInputWarnings(flowStore: StateStore<OpenFlow>, flowState: FlowState, flowInputsStore: Writable<FlowInput>): Promise<void>;

package/package/components/flows/missingInputWarnings.js

@@ -0,0 +1,93 @@
+import { parseOutputs } from '../../infer';
+import { dfs } from './dfs';
+function isInputFilled(inputTransforms, key, schema) {
+    const required = schema?.required?.includes(key) ?? false;
+    if (!required) {
+        return true;
+    }
+    if (inputTransforms.hasOwnProperty(key)) {
+        const transform = inputTransforms[key];
+        if (transform?.type === 'static' &&
+            (transform?.value === undefined || transform?.value === '' || transform?.value === null)) {
+            return false;
+        }
+        else if (transform?.type === 'javascript' &&
+            (transform?.expr === undefined || transform?.expr === '' || transform?.expr === null)) {
+            return false;
+        }
+    }
+    return true;
+}
+async function isConnectedToMissingModule(argName, input_transform, moduleIds) {
+    const val = input_transform.type === 'static' ? String(input_transform.value) : input_transform.expr;
+    try {
+        const outputs = await parseOutputs(val, true);
+        let error = '';
+        outputs?.forEach(([componentId, id]) => {
+            if (componentId === 'results') {
+                if (!moduleIds.includes(id)) {
+                    error += `Input ${argName} is connected to a missing module with id ${id}\n`;
+                }
+            }
+        });
+        return error;
+    }
+    catch (e) {
+        return `Input ${argName} expression is invalid`;
+    }
+}
+async function computeFlowStepWarnings(input, moduleIds = []) {
+    const messages = {};
+    const { input_transforms, schema } = input;
+    const keys = Object.keys(input_transforms ?? {});
+    const promises = keys.map(async (key) => {
+        if (!isInputFilled(input_transforms, key, schema)) {
+            messages[key] = {
+                message: `Input ${key} is required but not filled`,
+                type: 'warning'
+            };
+        }
+        else {
+            const errorMessage = await isConnectedToMissingModule(key, input_transforms[key], moduleIds);
+            if (errorMessage) {
+                messages[key] = {
+                    message: errorMessage,
+                    type: 'error'
+                };
+            }
+        }
+    });
+    await Promise.all(promises);
+    return messages;
+}
+export async function computeMissingInputWarnings(flowStore, flowState, flowInputsStore) {
+    const inputs = dfs(flowStore.val.value.modules, (module) => {
+        if (module.value.type === 'script' ||
+            module.value.type === 'rawscript' ||
+            module.value.type === 'flow') {
+            const schema = flowState[module.id]?.schema;
+            return {
+                input_transforms: module.value.input_transforms,
+                id: module.id,
+                schema
+            };
+        }
+        return undefined;
+    }).filter((x) => x !== undefined);
+    const moduleIds = dfs(flowStore.val.value.modules, (module) => module.id);
+    const promises = inputs.map(async (input) => {
+        const warnings = await computeFlowStepWarnings(input, moduleIds);
+        return [input.id, warnings];
+    });
+    const warnings = Object.fromEntries(await Promise.all(promises));
+    for (const key in warnings) {
+        flowInputsStore.update((fi) => {
+            return {
+                ...fi,
+                [key]: {
+                    flowStepWarnings: warnings[key]
+                }
+            };
+        });
+    }
+}

package/package/components/flows/pickers/FlowScriptPicker.svelte

@@ -2,10 +2,7 @@
 import Button from '../../common/button/Button.svelte';
 import LanguageIcon from '../../common/languageIcons/LanguageIcon.svelte';
 import { enterpriseLicense } from '../../../stores';
-export let disabled = false;
-export let label;
-export let lang = undefined;
-export let id = undefined;
+let { disabled = false, label, lang = undefined, id = undefined } = $props();
 const enterpriseLangs = ['bigquery', 'snowflake', 'mssql', 'oracledb'];
 </script>
 
@@ -27,6 +24,7 @@ const enterpriseLangs = ['bigquery', 'snowflake', 'mssql', 'oracledb'];
 			<span class="text-xs">{label}</span>
 		</div>
 	</Button>
-	<svelte:fragment slot="text">{label} is only available with an enterprise license</svelte:fragment
-	>
+	{#snippet text()}
+		{label} is only available with an enterprise license
+	{/snippet}
 </Popover>

package/package/components/flows/pickers/FlowScriptPicker.svelte.d.ts

@@ -1,4 +1,10 @@
 import type { SupportedLanguage } from '../../../common';
+interface Props {
+    disabled?: boolean;
+    label: string;
+    lang?: SupportedLanguage | 'docker' | 'javascript' | undefined;
+    id?: string | undefined;
+}
 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;
@@ -12,15 +18,10 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const FlowScriptPicker: $$__sveltets_2_IsomorphicComponent<{
-    disabled?: boolean;
-    label: string;
-    lang?: SupportedLanguage | "docker" | "javascript" | undefined;
-    id?: string | undefined;
-}, {
+declare const FlowScriptPicker: $$__sveltets_2_IsomorphicComponent<Props, {
     click: CustomEvent<any>;
 } & {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+}, {}, {}, "">;
 type FlowScriptPicker = InstanceType<typeof FlowScriptPicker>;
 export default FlowScriptPicker;

package/package/components/flows/pickers/PickHubScript.svelte

@@ -1,4 +1,4 @@
-<script lang="ts">import { createEventDispatcher } from 'svelte';
+<script lang="ts">import { createEventDispatcher, untrack } from 'svelte';
 import { Alert, Badge, Skeleton } from '../../common';
 import { capitalize, classNames } from '../../../utils';
 import NoItemFound from '../../home/NoItemFound.svelte';
@@ -6,19 +6,14 @@ import { APP_TO_ICON_COMPONENT } from '../../icons';
 import ListFilters from '../../home/ListFilters.svelte';
 import { IntegrationService, ScriptService } from '../../../gen';
 import { Loader2 } from 'lucide-svelte';
-export let kind = 'script';
-export let filter = '';
-export let syncQuery = false;
-let loading = false;
-let hubNotAvailable = false;
+let { kind = 'script', filter = $bindable(''), syncQuery = false, children } = $props();
+let loading = $state(false);
+let hubNotAvailable = $state(false);
 const dispatch = createEventDispatcher();
-let appFilter = undefined;
-let items = [];
-let allApps = [];
-let apps = [];
-$: apps = filter.length > 0 ? Array.from(new Set(items?.map((x) => x.app) ?? [])).sort() : allApps;
-$: applyFilter(filter, kind, appFilter);
-$: getAllApps(kind);
+let appFilter = $state(undefined);
+let items = $state([]);
+let allApps = $state([]);
+let apps = $derived.by(() => filter.length > 0 ? Array.from(new Set(items?.map((x) => x.app) ?? [])).sort() : allApps);
 async function getAllApps(filterKind) {
     try {
         hubNotAvailable = false;
@@ -49,11 +44,11 @@ async function applyFilter(filter, filterKind, appFilter) {
                 kind: filterKind,
                 app: appFilter
             })
-            : (await ScriptService.getTopHubScripts({
+            : ((await ScriptService.getTopHubScripts({
                 limit: 40,
                 app: appFilter,
                 kind: filterKind
-            })).asks ?? [];
+            })).asks ?? []);
         if (ts === startTs) {
             loading = false;
         }
@@ -70,10 +65,19 @@ async function applyFilter(filter, filterKind, appFilter) {
         loading = false;
     }
 }
+$effect(() => {
+    ;
+    [filter, kind, appFilter];
+    untrack(() => applyFilter(filter, kind, appFilter));
+});
+$effect(() => {
+    kind;
+    untrack(() => getAllApps(kind));
+});
 </script>
 
 <div class="w-full flex mt-1 items-center gap-2">
-	<slot />
+	{@render children?.()}
 	<div class="relative w-full">
 		<input
 			type="text"
@@ -100,7 +104,7 @@ async function applyFilter(filter, filterKind, appFilter) {
 				<li class="flex flex-row w-full">
 					<button
 						class="p-4 gap-4 flex flex-row grow hover:bg-surface-hover bg-surface transition-all items-center rounded-md"
-						on:click={() => dispatch('pick', item)}
+						onclick={() => dispatch('pick', item)}
 					>
 						<div class="flex items-center gap-4">
 							<div
@@ -110,11 +114,8 @@ async function applyFilter(filter, filterKind, appFilter) {
 								)}
 							>
 								{#if item['app'] in APP_TO_ICON_COMPONENT}
-									<svelte:component
-										this={APP_TO_ICON_COMPONENT[item['app']]}
-										height={18}
-										width={18}
-									/>
+									{@const SvelteComponent = APP_TO_ICON_COMPONENT[item['app']]}
+									<SvelteComponent height={18} width={18} />
 								{/if}
 							</div>
 

package/package/components/flows/pickers/PickHubScript.svelte.d.ts

@@ -1,4 +1,10 @@
 import { type HubScriptKind } from '../../../gen';
+interface Props {
+    kind?: HubScriptKind & string;
+    filter?: string;
+    syncQuery?: boolean;
+    children?: import('svelte').Snippet;
+}
 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;
@@ -12,23 +18,10 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
-    default: any;
-} ? Props extends Record<string, never> ? any : {
-    children?: any;
-} : {});
-declare const PickHubScript: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
-    kind?: HubScriptKind & string;
-    filter?: string;
-    syncQuery?: boolean;
-}, {
-    default: {};
-}>, {
+declare const PickHubScript: $$__sveltets_2_IsomorphicComponent<Props, {
     pick: CustomEvent<any>;
 } & {
     [evt: string]: CustomEvent<any>;
-}, {
-    default: {};
-}, {}, string>;
+}, {}, {}, "filter">;
 type PickHubScript = InstanceType<typeof PickHubScript>;
 export default PickHubScript;