windmill-components 1.493.10 → 1.501.5

package/package/components/SchemaForm.svelte

@@ -1,4 +1,6 @@
-<script lang="ts">import { VariableService } from '../gen';
+<script lang="ts">import { createBubbler } from 'svelte/legacy';
+const bubble = createBubbler();
+import { VariableService } from '../gen';
 import { workspaceStore } from '../stores';
 import { allTrue, computeShow } from '../utils';
 import { Button } from './common';
@@ -9,80 +11,40 @@ import ToggleButton from './common/toggleButton-v2/ToggleButton.svelte';
 import { getResourceTypes } from './resourceTypesStore';
 import { Plus } from 'lucide-svelte';
 import ArgInput from './ArgInput.svelte';
-import { createEventDispatcher } from 'svelte';
+import { createEventDispatcher, untrack } from 'svelte';
 import { deepEqual } from 'fast-equals';
 import { dragHandleZone } from '@windmill-labs/svelte-dnd-action';
-export let schema;
-export let hiddenArgs = [];
-export let schemaFieldTooltip = {};
-export let args = {};
-export let disabledArgs = [];
-export let disabled = false;
-export let isValid = true;
-export let autofocus = false;
-export let defaultValues = {};
-export let shouldHideNoInputs = false;
-export let compact = false;
-export let linkedSecret = undefined;
-export let linkedSecretCandidates = undefined;
-export let noVariablePicker = false;
-export let flexWrap = false;
-export let noDelete = false;
-export let prettifyHeader = false;
-export let disablePortal = false;
-export let showSchemaExplorer = false;
-export let showReset = false;
-export let onlyMaskPassword = false;
-export let dndConfig = undefined;
-export let items = undefined;
-export let helperScript = undefined;
-export let lightHeader = false;
-export let diff = {};
-export let nestedParent = undefined;
-export let shouldDispatchChanges = false;
-export let nestedClasses = '';
-export let dynamicEnums = {};
-export let largeGap = false;
-export let css = undefined;
-export let displayType = true;
-export let appPath = undefined;
-export let computeS3ForceViewerPolicies = undefined;
-export let workspace = undefined;
+let { schema = $bindable(), hiddenArgs = [], schemaFieldTooltip = {}, args = $bindable(undefined), disabledArgs = [], disabled = false, isValid = $bindable(true), autofocus = false, defaultValues = {}, shouldHideNoInputs = false, compact = false, linkedSecret = $bindable(undefined), linkedSecretCandidates = undefined, noVariablePicker = false, flexWrap = false, noDelete = false, prettifyHeader = false, disablePortal = false, showSchemaExplorer = false, showReset = false, onlyMaskPassword = false, dndConfig = undefined, items = undefined, helperScript = undefined, lightHeader = false, diff = {}, nestedParent = undefined, shouldDispatchChanges = false, nestedClasses = '', dynamicEnums = {}, largeGap = false, css = undefined, displayType = true, appPath = undefined, className = '', computeS3ForceViewerPolicies = undefined, workspace = undefined, actions } = $props();
 const dispatch = createEventDispatcher();
-let inputCheck = {};
-$: if (args == undefined || typeof args !== 'object') {
-    args = {};
-}
+let inputCheck = $state({});
 export function setDefaults() {
-    const nargs = structuredClone(defaultValues);
+    const nargs = structuredClone($state.snapshot(defaultValues));
     Object.keys(schema?.properties ?? {}).forEach((key) => {
-        if (schema?.properties[key].default != undefined && args[key] == undefined) {
+        if (schema?.properties[key].default != undefined && args && args[key] == undefined) {
             let value = schema?.properties[key].default;
-            nargs[key] = value === 'object' ? structuredClone(value) : value;
+            nargs[key] = value === 'object' ? structuredClone($state.snapshot(value)) : value;
         }
     });
     args = nargs;
 }
-let keys;
-$: keys = Array.isArray(schema?.order) ? schema?.order : Object.keys(schema?.properties ?? {});
+let keys = $state([]);
 function removeExtraKey() {
     const nargs = {};
     Object.keys(args ?? {}).forEach((key) => {
-        if (keys.includes(key)) {
+        if (keys.includes(key) && args) {
             nargs[key] = args[key];
         }
     });
     args = nargs;
 }
-let pickForField;
-let itemPicker = undefined;
-let variableEditor = undefined;
-let resourceTypes = undefined;
+let pickForField = $state();
+let itemPicker = $state(undefined);
+let variableEditor = $state(undefined);
+let resourceTypes = $state(undefined);
 async function loadResourceTypes() {
     resourceTypes = await getResourceTypes();
 }
 loadResourceTypes();
-$: schema && (reorder(), (hidden = {}));
 function hasExtraKeys() {
     return Object.keys(args ?? {}).some((x) => !keys.includes(x));
 }
@@ -101,7 +63,10 @@ function reorder() {
                 .forEach((x) => {
                 n[x] = schema.properties[x];
             });
-            schema.properties = n;
+            if (!deepEqual(schema.properties, n) ||
+                !deepEqual(Object.keys(schema.properties), Object.keys(n))) {
+                schema.properties = n;
+            }
         }
         let nkeys = Object.keys(schema.properties ?? {});
         if (!deepEqual(keys, nkeys)) {
@@ -109,16 +74,23 @@ function reorder() {
             dispatch('change');
         }
     }
+    // let missingKeys = keys.filter((x) => args && !(x in args))
+    // console.log('missingKeys', missingKeys)
+    // missingKeys.forEach((x) => {
+    // 	if (args) {
+    // 		args[x] = undefined
+    // 	}
+    // })
     if (!noDelete && hasExtraKeys()) {
         removeExtraKey();
     }
 }
-$: fields = items ?? keys.map((x) => ({ id: x, value: x }));
-let hidden = {};
+let hidden = $state({});
+let fields = $derived(items ?? keys.map((x) => ({ id: x, value: x })));
 function handleHiddenFields(schema, args) {
     for (const x of fields) {
-        if (schema?.properties[x.value]?.showExpr) {
-            if (computeShow(x.value, schema.properties[x.value].showExpr, args)) {
+        if (schema?.properties?.[x.value]?.showExpr) {
+            if (computeShow(x.value, schema.properties?.[x.value]?.showExpr, args)) {
                 hidden[x.value] = false;
             }
             else if (!hidden[x.value]) {
@@ -131,11 +103,41 @@ function handleHiddenFields(schema, args) {
         }
     }
 }
-$: handleHiddenFields(schema, args);
-$: isValid = allTrue(inputCheck ?? {});
+$effect.pre(() => {
+    if (args == undefined || typeof args !== 'object') {
+        args = {};
+    }
+});
+$effect.pre(() => {
+    schema.order;
+    Object.keys(schema.properties ?? {});
+    schema && (untrack(() => reorder()), (hidden = {}));
+});
+$effect.pre(() => {
+    ;
+    [schema, args];
+    if (args && typeof args == 'object') {
+        let oneShowExpr = false;
+        for (const key of fields) {
+            if (schema.properties?.[key.value]?.showExpr) {
+                oneShowExpr = true;
+            }
+        }
+        if (!oneShowExpr) {
+            return;
+        }
+        for (const key in args) {
+            args[key];
+        }
+    }
+    untrack(() => handleHiddenFields(schema, args ?? {}));
+});
+$effect.pre(() => {
+    isValid = allTrue(inputCheck ?? {});
+});
+const actions_render = $derived(actions);
 </script>
 
-<!-- {JSON.stringify(args)} -->
 {#if showReset}
 	<div class="flex flex-row-reverse w-full">
 		<Button size="xs" color="light" on:click={() => setDefaults()}>
@@ -143,16 +145,15 @@ $: isValid = allTrue(inputCheck ?? {});
 		</Button>
 	</div>
 {/if}
-
+<!-- {JSON.stringify(schema.order)} -->
+<!-- {JSON.stringify(schema)} -->
 <div
-	class="w-full {$$props.class} {flexWrap
-		? 'flex flex-row flex-wrap gap-x-6 '
-		: ''} {nestedClasses}"
+	class="w-full {className} {flexWrap ? 'flex flex-row flex-wrap gap-x-6 ' : ''} {nestedClasses}"
 	use:dragHandleZone={dndConfig ?? { items: [], dragDisabled: true }}
-	on:finalize
-	on:consider
+	onfinalize={bubble('finalize')}
+	onconsider={bubble('consider')}
 >
-	{#if keys.length > 0}
+	{#if keys.length > 0 && args}
 		{#each fields as item, i (item.id)}
 			{@const argName = item.value}
 			<div
@@ -160,7 +161,7 @@ $: isValid = allTrue(inputCheck ?? {});
 					? 'bg-red-300 dark:bg-red-800 rounded-md'
 					: ''}
 			>
-				<!-- svelte-ignore a11y-click-events-have-key-events -->
+				<!-- svelte-ignore a11y_click_events_have_key_events -->
 				{#if !hiddenArgs.includes(argName) && keys.includes(argName)}
 					{#if typeof diff[argName] === 'object' && diff[argName].oldSchema}
 						{@const formerProperty = diff[argName].oldSchema}
@@ -178,7 +179,8 @@ $: isValid = allTrue(inputCheck ?? {});
 								required={formerProperty?.required}
 								pattern={formerProperty?.pattern}
 								valid={inputCheck[argName]}
-								defaultValue={defaultValues?.[argName] ?? structuredClone(formerProperty?.default)}
+								defaultValue={defaultValues?.[argName] ??
+									structuredClone($state.snapshot(formerProperty?.default))}
 								enum_={dynamicEnums?.[argName] ?? formerProperty?.enum}
 								format={formerProperty?.format}
 								contentEncoding={formerProperty?.contentEncoding}
@@ -214,10 +216,10 @@ $: isValid = allTrue(inputCheck ?? {});
 							/>
 						</div>
 					{/if}
-					<!-- svelte-ignore a11y-no-static-element-interactions -->
+					<!-- svelte-ignore a11y_no_static_element_interactions -->
 					<div
 						class="flex flex-row items-center {largeGap ? 'pb-4' : ''} "
-						on:click={() => {
+						onclick={() => {
 							dispatch('click', argName)
 						}}
 					>
@@ -249,7 +251,7 @@ $: isValid = allTrue(inputCheck ?? {});
 									pattern={schema.properties[argName].pattern}
 									bind:valid={inputCheck[argName]}
 									defaultValue={defaultValues?.[argName] ??
-										structuredClone(schema.properties[argName].default)}
+										structuredClone($state.snapshot(schema.properties[argName].default))}
 									enum_={dynamicEnums?.[argName] ?? schema.properties[argName].enum}
 									format={schema.properties[argName].format}
 									contentEncoding={schema.properties[argName].contentEncoding}
@@ -287,8 +289,8 @@ $: isValid = allTrue(inputCheck ?? {});
 									{css}
 									{displayType}
 								>
-									<svelte:fragment slot="actions">
-										<slot name="actions" />
+									{#snippet actions()}
+										{@render actions_render?.()}
 										{#if linkedSecretCandidates?.includes(argName)}
 											<div>
 												<ToggleButtonGroup
@@ -300,30 +302,31 @@ $: isValid = allTrue(inputCheck ?? {});
 															linkedSecret = undefined
 														}
 													}}
-													let:item
 												>
-													<ToggleButton
-														value="inlined"
-														size="sm"
-														label="Inlined"
-														tooltip="The value is inlined in the resource and thus has no special treatment."
-														{item}
-													/>
-													<ToggleButton
-														position="right"
-														value="secret"
-														size="sm"
-														label="Secret"
-														tooltip="The value will be stored in a newly created linked secret variable at the same path. That variable can be permissioned differently, will be treated as a secret the UI, operators will not be able to load it and every access will generate a corresponding audit log."
-														{item}
-													/>
+													{#snippet children({ item })}
+														<ToggleButton
+															value="inlined"
+															size="sm"
+															label="Inlined"
+															tooltip="The value is inlined in the resource and thus has no special treatment."
+															{item}
+														/>
+														<ToggleButton
+															position="right"
+															value="secret"
+															size="sm"
+															label="Secret"
+															tooltip="The value will be stored in a newly created linked secret variable at the same path. That variable can be permissioned differently, will be treated as a secret the UI, operators will not be able to load it and every access will generate a corresponding audit log."
+															{item}
+														/>
+													{/snippet}
 												</ToggleButtonGroup>
-											</div>{/if}</svelte:fragment
-									>
+											</div>{/if}
+									{/snippet}
 								</ArgInput>
 							{/if}
-							<!-- svelte-ignore a11y-no-noninteractive-tabindex -->
-							<!-- svelte-ignore a11y-no-static-element-interactions -->
+							<!-- svelte-ignore a11y_no_noninteractive_tabindex -->
+							<!-- svelte-ignore a11y_no_static_element_interactions -->
 						{/if}
 					</div>
 				{/if}
@@ -337,7 +340,7 @@ $: isValid = allTrue(inputCheck ?? {});
 	<ItemPicker
 		bind:this={itemPicker}
 		pickCallback={(path, _) => {
-			if (pickForField) {
+			if (pickForField && args) {
 				args[pickForField] = '$var:' + path
 			}
 		}}
@@ -351,17 +354,19 @@ $: isValid = allTrue(inputCheck ?? {});
 				...x
 			}))}
 	>
-		<div slot="submission">
-			<Button
-				variant="border"
-				color="blue"
-				size="sm"
-				startIcon={{ icon: Plus }}
-				on:click={() => variableEditor?.initNew?.()}
-			>
-				New variable
-			</Button>
-		</div>
+		{#snippet submission()}
+			<div>
+				<Button
+					variant="border"
+					color="blue"
+					size="sm"
+					startIcon={{ icon: Plus }}
+					on:click={() => variableEditor?.initNew?.()}
+				>
+					New variable
+				</Button>
+			</div>
+		{/snippet}
 	</ItemPicker>
 
 	<VariableEditor bind:this={variableEditor} />

package/package/components/SchemaForm.svelte.d.ts

@@ -1,94 +1,81 @@
 import type { Schema } from '../common';
 import { type Script } from '../gen';
 import { type Options as DndOptions } from '@windmill-labs/svelte-dnd-action';
-import type { SchemaDiff } from './schema/schemaUtils';
-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 SchemaForm: $$__sveltets_2_IsomorphicComponent<{
-    [x: string]: any;
+import type { SchemaDiff } from './schema/schemaUtils.svelte';
+import type { ComponentCustomCSS } from './apps/types';
+interface Props {
     schema: Schema | any;
-    hiddenArgs?: string[] | undefined;
-    schemaFieldTooltip?: Record<string, string> | undefined;
-    args?: Record<string, any> | undefined;
-    disabledArgs?: string[] | undefined;
-    disabled?: boolean | undefined;
-    isValid?: boolean | undefined;
-    autofocus?: boolean | undefined;
-    defaultValues?: Record<string, any> | undefined;
-    shouldHideNoInputs?: boolean | undefined;
-    compact?: boolean | undefined;
-    linkedSecret?: string | undefined | undefined;
-    linkedSecretCandidates?: string[] | undefined | undefined;
-    noVariablePicker?: boolean | undefined;
-    flexWrap?: boolean | undefined;
-    noDelete?: boolean | undefined;
-    prettifyHeader?: boolean | undefined;
-    disablePortal?: boolean | undefined;
-    showSchemaExplorer?: boolean | undefined;
-    showReset?: boolean | undefined;
-    onlyMaskPassword?: boolean | undefined;
-    dndConfig?: DndOptions<import("@windmill-labs/svelte-dnd-action").Item> | undefined;
+    hiddenArgs?: string[];
+    schemaFieldTooltip?: Record<string, string>;
+    args?: Record<string, any>;
+    disabledArgs?: string[];
+    disabled?: boolean;
+    isValid?: boolean;
+    autofocus?: boolean;
+    defaultValues?: Record<string, any>;
+    shouldHideNoInputs?: boolean;
+    compact?: boolean;
+    linkedSecret?: string | undefined;
+    linkedSecretCandidates?: string[] | undefined;
+    noVariablePicker?: boolean;
+    flexWrap?: boolean;
+    noDelete?: boolean;
+    prettifyHeader?: boolean;
+    disablePortal?: boolean;
+    showSchemaExplorer?: boolean;
+    showReset?: boolean;
+    onlyMaskPassword?: boolean;
+    dndConfig?: DndOptions | undefined;
     items?: {
         id: string;
         value: string;
-    }[] | undefined | undefined;
+    }[] | undefined;
     helperScript?: {
-        type: "inline";
+        type: 'inline';
         path?: string;
-        lang: Script["language"];
+        lang: Script['language'];
         code: string;
     } | {
-        type: "hash";
+        type: 'hash';
         hash: string;
-    } | undefined | undefined;
-    lightHeader?: boolean | undefined;
-    diff?: Record<string, SchemaDiff> | undefined;
+    } | undefined;
+    lightHeader?: boolean;
+    diff?: Record<string, SchemaDiff>;
     nestedParent?: {
         label: string;
         nestedParent: any | undefined;
-    } | undefined | undefined;
-    shouldDispatchChanges?: boolean | undefined;
-    nestedClasses?: string | undefined;
-    dynamicEnums?: Record<string, any> | undefined;
-    largeGap?: boolean | undefined;
-    css?: Partial<{
-        readonly container: {
-            readonly class: "";
-            readonly style: "";
-        };
-        readonly label: {
-            readonly class: "";
-            readonly style: "";
-        };
-        readonly description: {
-            readonly class: "";
-            readonly style: "";
-        };
-    }> | undefined;
-    displayType?: boolean | undefined;
-    appPath?: string | undefined | undefined;
+    } | undefined;
+    shouldDispatchChanges?: boolean;
+    nestedClasses?: string;
+    dynamicEnums?: Record<string, any>;
+    largeGap?: boolean;
+    css?: ComponentCustomCSS<'schemaformcomponent'> | undefined;
+    displayType?: boolean;
+    appPath?: string | undefined;
+    className?: string;
     computeS3ForceViewerPolicies?: (() => {
         allowed_resources: string[];
         allow_user_resources: boolean;
         allow_workspace_resource: boolean;
         file_key_regex: string;
-    } | undefined) | undefined | undefined;
-    workspace?: string | undefined | undefined;
-    setDefaults?: (() => void) | undefined;
-}, {
-    finalize: Event | MouseEvent | UIEvent | ErrorEvent | ProgressEvent<EventTarget> | SubmitEvent | AnimationEvent | InputEvent | FocusEvent | CompositionEvent | ClipboardEvent | DragEvent | FormDataEvent | PointerEvent | KeyboardEvent | SecurityPolicyViolationEvent | TouchEvent | TransitionEvent | WheelEvent;
-    consider: Event | MouseEvent | UIEvent | ErrorEvent | ProgressEvent<EventTarget> | SubmitEvent | AnimationEvent | InputEvent | FocusEvent | CompositionEvent | ClipboardEvent | DragEvent | FormDataEvent | PointerEvent | KeyboardEvent | SecurityPolicyViolationEvent | TouchEvent | TransitionEvent | WheelEvent;
+    } | undefined) | undefined;
+    workspace?: string | undefined;
+    actions?: 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;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+declare const SchemaForm: $$__sveltets_2_IsomorphicComponent<Props, {
     click: CustomEvent<any>;
     change: CustomEvent<any>;
     nestedChange: CustomEvent<any>;
@@ -97,10 +84,8 @@ declare const SchemaForm: $$__sveltets_2_IsomorphicComponent<{
     keydownCmdEnter: CustomEvent<any>;
 } & {
     [evt: string]: CustomEvent<any>;
-}, {
-    actions: {};
-}, {
+}, {}, {
     setDefaults: () => void;
-}, string>;
+}, "args" | "schema" | "linkedSecret" | "isValid">;
 type SchemaForm = InstanceType<typeof SchemaForm>;
 export default SchemaForm;

package/package/components/SchemaFormWithArgPicker.svelte

@@ -88,7 +88,7 @@ let inputPanelSize = 70;
 <div class="h-fit">
 	<div class="relative z-[100000] w-full">
 		<div class="absolute" style="right: calc({100 - inputPanelSize}%); top: -1px;">
-			<SideBarTab expandRight={rightPanelOpen} {dropdownItems} fullMenu={true} noTrigger={true} />
+			<SideBarTab {dropdownItems} fullMenu={true} noTrigger={true} />
 		</div>
 	</div>
 	<Splitpanes class={!rightPanelOpen ? 'splitter-hidden' : ''}>

package/package/components/SchemaViewer.svelte

@@ -9,7 +9,7 @@ import { Badge } from './common';
 import HighlightTheme from './HighlightTheme.svelte';
 import Button from './common/button/Button.svelte';
 import { ClipboardCopy } from 'lucide-svelte';
-export let schema = emptySchema();
+let { schema = emptySchema() } = $props();
 function getProperties(schema) {
     if (schema.properties) {
         return Object.entries(schema.properties);
@@ -24,12 +24,13 @@ function getProperties(schema) {
 	<Tabs selected="arguments">
 		<Tab value="arguments">Arguments</Tab>
 		<Tab value="advanced">Advanced</Tab>
-		<svelte:fragment slot="content">
+		{#snippet content()}
 			<div class="overflow-auto pt-2">
 				<TabContent value="arguments">
 					{#if schema && schema.properties && Object.keys(schema.properties).length > 0 && schema.required}
 						<div class="flex flex-row">
 							<TableCustom>
+								<!-- @migration-task: migrate this slot by hand, `header-row` is an invalid identifier -->
 								<tr slot="header-row" class="underline">
 									<th>name</th>
 									<th>type</th>
@@ -38,37 +39,43 @@ function getProperties(schema) {
 									<th>format</th>
 									<th>required</th>
 								</tr>
-								<tbody slot="body">
-									{#each getProperties(schema) as [name, property] (name)}
-										<tr>
-											<td class="font-semibold pl-1">{name}</td>
-											<td
-												><Badge color="blue"
-													>{#if !property.type} any {:else} {property.type} {/if}</Badge
-												></td
-											>
-											<td>{property.description ?? ''}</td>
-											<td
-												>{property.default == '<function call>'
-													? '<function call>'
-													: property.default
-													? JSON.stringify(property.default)
-													: ''}</td
-											>
-											<td
-												>{property.format ?? ''}
-												{property.contentEncoding
-													? `(encoding: ${property.contentEncoding})`
-													: ''}</td
-											>
-											<td
-												>{#if schema.required.includes(name)}
-													<span class="text-red-600 font-bold text-lg">*</span>
-												{/if}</td
-											>
-										</tr>
-									{/each}
-								</tbody>
+								{#snippet body()}
+									<tbody>
+										{#each getProperties(schema) as [name, property] (name)}
+											<tr>
+												<td class="font-semibold pl-1">{name}</td>
+												<td
+													><Badge color="blue"
+														>{#if !property.type}
+															any
+														{:else}
+															{property.type}
+														{/if}</Badge
+													></td
+												>
+												<td>{property.description ?? ''}</td>
+												<td
+													>{property.default == '<function call>'
+														? '<function call>'
+														: property.default
+															? JSON.stringify(property.default)
+															: ''}</td
+												>
+												<td
+													>{property.format ?? ''}
+													{property.contentEncoding
+														? `(encoding: ${property.contentEncoding})`
+														: ''}</td
+												>
+												<td
+													>{#if schema.required.includes(name)}
+														<span class="text-red-600 font-bold text-lg">*</span>
+													{/if}</td
+												>
+											</tr>
+										{/each}
+									</tbody>
+								{/snippet}
 							</TableCustom>
 						</div>
 					{:else}
@@ -91,6 +98,6 @@ function getProperties(schema) {
 					</div>
 				</TabContent>
 			</div>
-		</svelte:fragment>
+		{/snippet}
 	</Tabs>
 </div>

package/package/components/SchemaViewer.svelte.d.ts

@@ -1,21 +1,7 @@
 import type { Schema } from '../common';
-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 SchemaViewer: $$__sveltets_2_IsomorphicComponent<{
+interface Props {
     schema?: Schema | undefined | any;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
-type SchemaViewer = InstanceType<typeof SchemaViewer>;
+}
+declare const SchemaViewer: import("svelte").Component<Props, {}, "">;
+type SchemaViewer = ReturnType<typeof SchemaViewer>;
 export default SchemaViewer;