windmill-components 1.339.2 → 1.352.1

package/package/components/FlowBuilder.svelte

@@ -25,11 +25,9 @@ import FlowCopilotStatus from './copilot/FlowCopilotStatus.svelte';
 import { fade } from 'svelte/transition';
 import { loadFlowModuleState, pickScript } from './flows/flowStateUtils';
 import FlowCopilotInputsModal from './copilot/FlowCopilotInputsModal.svelte';
-import { snakeCase } from 'lodash';
 import FlowBuilderTutorials from './FlowBuilderTutorials.svelte';
 import FlowTutorials from './FlowTutorials.svelte';
 import { ignoredTutorials } from './tutorials/ignoredTutorials';
-import { cloneDeep } from 'lodash';
 export let initialPath = '';
 export let pathStoreInit = undefined;
 export let newFlow;
@@ -129,13 +127,13 @@ async function saveDraft(forceSave = false) {
         savedFlow = {
             ...(newFlow || savedFlow?.draft_only
                 ? {
-                    ...cloneDeep($flowStore),
+                    ...structuredClone($flowStore),
                     path: $pathStore,
                     draft_only: true
                 }
                 : savedFlow),
             draft: {
-                ...cloneDeep($flowStore),
+                ...structuredClone($flowStore),
                 path: $pathStore
             }
         };
@@ -252,7 +250,7 @@ async function saveFlow() {
             });
         }
         savedFlow = {
-            ...cloneDeep($flowStore),
+            ...structuredClone($flowStore),
             path: $pathStore
         };
         loadingSave = false;
@@ -317,7 +315,8 @@ setContext('FlowEditorContext', {
     pathStore,
     testStepStore,
     saveDraft,
-    initialPath
+    initialPath,
+    flowInputsStore: writable({})
 });
 async function loadSchedule() {
     loadFlowSchedule(initialPath, $workspaceStore)
@@ -512,6 +511,15 @@ async function finishStepGen() {
     await sleep(3000);
     copilotStatus = '';
 }
+function snakeCase(e) {
+    if (e.toLowerCase() === e) {
+        return e;
+    }
+    return (e
+        .match(/([A-Z])/g)
+        ?.reduce((str, c) => str.replace(new RegExp(c), '_' + c.toLowerCase()), e)
+        ?.substring(e.slice(0, 1).match(/([A-Z])/g) ? 1 : 0) ?? e);
+}
 async function genFlow(idx, flowModules, stepOnly = false) {
     try {
         push(history, $flowStore);

package/package/components/FlowGraphViewer.svelte

@@ -37,7 +37,7 @@ const dispatch = createEventDispatcher();
 				noGraph ? 'border-0 w-max' : ''
 			)}
 		>
-			<FlowGraphViewerStep {flow} {stepDetail} />
+			<FlowGraphViewerStep schema={flow.schema} {stepDetail} />
 		</div>
 	{/if}
 </div>

package/package/components/FlowGraphViewerStep.svelte

@@ -13,7 +13,7 @@ import { hubBaseUrlStore } from '../stores';
 import { twMerge } from 'tailwind-merge';
 import FlowModuleScript from './flows/content/FlowModuleScript.svelte';
 import { Copy } from 'lucide-svelte';
-export let flow;
+export let schema = undefined;
 export let stepDetail = undefined;
 let codeViewer;
 </script>
@@ -32,7 +32,7 @@ let codeViewer;
 						<IconedPath path={stepDetail?.value?.path ?? ''} />
 					</a>
 				</div>
-				<div class="text-2xs mb-4">
+				<div class="text-2xs mb-4 mt-2">
 					<h3 class="mb-2">Step Inputs</h3>
 
 					<InputTransformsViewer inputTransforms={stepDetail?.value?.input_transforms ?? {}} />
@@ -49,7 +49,7 @@ let codeViewer;
 					</div>
 				{/if}
 			{:else if stepDetail.value.type == 'rawscript'}
-				<div class="text-2xs mb-4">
+				<div class="text-2xs mb-4 mt-2">
 					<h3 class="mb-2">Step Inputs</h3>
 					<InputTransformsViewer inputTransforms={stepDetail?.value?.input_transforms ?? {}} />
 				</div>
@@ -58,6 +58,16 @@ let codeViewer;
 				<span class="!text-xs">
 					<HighlightCode language={stepDetail.value.language} code={stepDetail.value.content} />
 				</span>
+				<h3 class="mb-2">Lockfile</h3>
+				<div>
+					{#if stepDetail.value.lock}
+						<pre class="bg-surface-secondary text-sm p-2 h-full overflow-auto w-full"
+							>{stepDetail.value.lock}</pre
+						>
+					{:else}
+						<p class="bg-surface-secondary text-sm p-2"> There is no lock file for this script </p>
+					{/if}
+				</div>
 			{/if}
 		{/if}
 	</DrawerContent>
@@ -69,11 +79,17 @@ let codeViewer;
 			<p class="font-medium text-secondary text-center pt-4 pb-8">
 				Click on a step to see its details
 			</p>
-			<h3 class="mb-2 font-semibold">Flow Inputs</h3>
-			<SchemaViewer schema={flow?.schema} />
+			{#if schema}
+				<h3 class="mb-2 font-semibold">Flow Inputs</h3>
+				<SchemaViewer {schema} />
+			{/if}
 		</div>
 	{:else if stepDetail == 'Input'}
-		<SchemaViewer schema={flow?.schema} />
+		{#if schema}
+			<SchemaViewer {schema} />
+		{:else}
+			<p class="font-medium text-secondary text-center pt-4 pb-8"> No input schema </p>
+		{/if}
 	{:else if stepDetail == 'Result'}
 		<p class="font-medium text-secondary text-center pt-4 pb-8"> End of the flow </p>
 	{:else if typeof stepDetail != 'string' && stepDetail.value}
@@ -122,12 +138,12 @@ let codeViewer;
 			</p>
 		{:else if stepDetail.value.type == 'rawscript'}
 			<div class="text-xs">
-				<h3 class="mb-2 font-semibold">Step Inputs</h3>
+				<h3 class="mb-2 font-semibold mt-2">Step Inputs</h3>
 				<InputTransformsViewer inputTransforms={stepDetail?.value?.input_transforms ?? {}} />
 			</div>
 
 			<div>
-				<div class="mb-2 flex justify-between items-center">
+				<div class="mb-2 mt-4 flex justify-between items-center">
 					<h3 class="font-semibold">Code</h3>
 					<Button size="xs2" color="light" variant="contained" on:click={codeViewer.openDrawer}>
 						Expand
@@ -140,10 +156,22 @@ let codeViewer;
 						class="whitespace-pre-wrap"
 					/>
 				</div>
+				<h3 class="mb-2 mt-4">Lockfile</h3>
+				<div>
+					{#if stepDetail.value.lock}
+						<pre class="bg-surface-secondary text-xs p-2 h-full overflow-auto w-full"
+							>{stepDetail.value.lock}</pre
+						>
+					{:else}
+						<p class="bg-surface-secondary text-sm p-2">
+							There is no lockfile for this inline script
+						</p>
+					{/if}
+				</div>
 			</div>
 		{:else if stepDetail.value.type == 'script'}
 			<div class="text-2xs">
-				<h3 class="mb-2 font-semibold">Step Inputs</h3>
+				<h3 class="mb-2 font-semibold mt-2">Step Inputs</h3>
 				<InputTransformsViewer inputTransforms={stepDetail?.value?.input_transforms ?? {}} />
 			</div>
 			{#if stepDetail.value.path.startsWith('hub/')}

package/package/components/FlowGraphViewerStep.svelte.d.ts

@@ -1,13 +1,8 @@
 import { SvelteComponent } from "svelte";
-import type { FlowModule, FlowValue } from '../gen';
+import type { FlowModule } from '../gen';
 declare const __propDef: {
     props: {
-        flow: {
-            summary: string;
-            description?: string;
-            value: FlowValue;
-            schema?: any;
-        };
+        schema?: any | undefined;
         stepDetail?: FlowModule | string | undefined;
     };
     events: {

package/package/components/FlowJobResult.svelte

@@ -56,9 +56,7 @@ async function getLogs() {
 </Drawer>
 <div
 	class:border={!noBorder}
-	class="grid {!col
-		? 'grid-cols-2'
-		: 'grid-rows-2'} shadow border border-tertiary-inverse h-full max-h-[70vh]"
+	class="grid {!col ? 'grid-cols-2' : 'grid-rows-2'} shadow border border-tertiary-inverse h-full"
 >
 	<div class="bg-surface {col ? '' : 'max-h-80'} h-full p-1 overflow-auto relative">
 		<span class="text-tertiary">Result</span>

package/package/components/FlowMetadata.svelte

@@ -23,7 +23,7 @@ export let scheduleEditor;
 			{#if job['success'] != undefined}
 				Received job: {displayDate(job.created_at ?? '')}
 			{:else}
-				Received job <TimeAgo date={job.created_at ?? ''} />
+				Received job <TimeAgo withDate date={job.created_at ?? ''} />
 			{/if}
 			<Tooltip small>{job?.created_at}</Tooltip>
 		</span>

package/package/components/FlowPreviewContent.svelte

@@ -292,8 +292,9 @@ let inputLibraryDrawer;
 		{/if}
 		<FlowProgressBar {job} bind:reset={jobProgressReset} />
 	</div>
-	<div class="overflow-y-auto grow pr-4">
-		<div class="max-h-1/2 overflow-auto border-b">
+
+	<div class="overflow-y-auto grow flex flex-col pr-4">
+		<div class="border-b">
 			<SchemaForm
 				noVariablePicker
 				compact
@@ -302,9 +303,10 @@ let inputLibraryDrawer;
 				bind:args={$previewArgs}
 			/>
 		</div>
-		<div class="pt-4 grow">
+		<div class="pt-4 flex flex-col grow">
 			{#if jobId}
 				<FlowStatusViewer
+					wideResults
 					{flowStateStore}
 					{jobId}
 					on:jobsLoaded={({ detail }) => {

package/package/components/FlowStatusViewer.svelte

@@ -8,6 +8,7 @@ export let workspaceId = undefined;
 export let flowStateStore = writable({});
 export let selectedJobStep = undefined;
 export let isOwner = false;
+export let wideResults = false;
 let lastJobId = jobId;
 let retryStatus = writable({});
 let suspendStatus = writable({});
@@ -42,7 +43,10 @@ $: jobId && updateJobId();
 	globalDurationStatuses={[]}
 	globalModuleStates={[]}
 	bind:selectedNode={selectedJobStep}
+	on:start
+	on:done
 	{jobId}
 	{workspaceId}
 	{isOwner}
+	{wideResults}
 />

package/package/components/FlowStatusViewer.svelte.d.ts

@@ -8,8 +8,11 @@ declare const __propDef: {
         flowStateStore?: Writable<FlowState> | undefined;
         selectedJobStep?: string | undefined;
         isOwner?: boolean | undefined;
+        wideResults?: boolean | undefined;
     };
     events: {
+        start: CustomEvent<any>;
+        done: CustomEvent<any>;
         jobsLoaded: CustomEvent<any>;
     } & {
         [evt: string]: CustomEvent<any>;

package/package/components/FlowStatusViewerInner.svelte

@@ -17,6 +17,8 @@ import { deepEqual } from 'fast-equals';
 import FlowTimeline from './FlowTimeline.svelte';
 import { dfs } from './flows/dfs';
 import { writable } from 'svelte/store';
+import Alert from './common/alert/Alert.svelte';
+import FlowGraphViewerStep from './FlowGraphViewerStep.svelte';
 const dispatch = createEventDispatcher();
 let { flowStateStore, retryStatus, suspendStatus } = getContext('FlowStatusViewer');
 export let jobId;
@@ -32,6 +34,7 @@ export let globalModuleStates;
 export let globalDurationStatuses;
 export let childFlow = false;
 export let reducedPolling = false;
+export let wideResults = false;
 let jobResults = [];
 let jobFailures = [];
 let forloop_selected = '';
@@ -95,6 +98,7 @@ function updateStatus(status) {
     }
     else if ($retryStatus[jobId ?? ''] != undefined) {
         delete $retryStatus[jobId ?? ''];
+        $retryStatus = $retryStatus;
     }
     let jobStatus = job?.flow_status?.modules?.[job?.flow_status.step];
     if (jobStatus && jobStatus.count != undefined) {
@@ -102,6 +106,7 @@ function updateStatus(status) {
     }
     else if ($suspendStatus[jobId ?? ''] != undefined) {
         delete $suspendStatus[jobId ?? ''];
+        $suspendStatus = $suspendStatus;
     }
 }
 function updateInnerModules() {
@@ -138,7 +143,9 @@ function updateInnerModules() {
     }
 }
 let errorCount = 0;
+let notAnonynmous = false;
 async function loadJobInProgress() {
+    dispatch('start');
     if (jobId != '00000000-0000-0000-0000-000000000000') {
         try {
             const newJob = await JobService.getJob({
@@ -152,15 +159,24 @@ async function loadJobInProgress() {
                 dispatch('jobsLoaded', job);
             }
             errorCount = 0;
+            notAnonynmous = false;
         }
         catch (e) {
-            errorCount += 1;
-            console.error(e);
+            if (e?.body?.includes('As a non logged in user, you can only see jobs ran by anonymous users')) {
+                notAnonynmous = true;
+            }
+            else {
+                errorCount += 1;
+                console.error(e);
+            }
         }
     }
     if (job?.type !== 'CompletedJob' && errorCount < 4 && !destroyed) {
         timeout = setTimeout(() => loadJobInProgress(), reducedPolling ? 5000 : 1000);
     }
+    else {
+        dispatch('done', job);
+    }
 }
 let destroyed = false;
 async function updateJobId() {
@@ -170,11 +186,12 @@ async function updateJobId() {
         timeout && clearTimeout(timeout);
         innerModules = [];
         if (flowJobIds) {
+            let modId = flowJobIds?.moduleId ?? '';
             let common = {
-                iteration_from: Math.max(flowJobIds.flowJobs.length - 20, 0),
-                iteration_total: flowJobIds?.length
+                iteration_from: $localDurationStatuses?.[modId]?.iteration_from ??
+                    Math.max(flowJobIds.flowJobs.length - 20, 0),
+                iteration_total: $localDurationStatuses?.[modId]?.iteration_total ?? flowJobIds?.length
             };
-            let modId = flowJobIds?.moduleId ?? '';
             $localDurationStatuses[modId] = {
                 ...($localDurationStatuses[modId] ?? { byJob: {} }),
                 ...common
@@ -361,10 +378,15 @@ function loadPreviousIters(lenToAdd) {
     jobResults = [...new Array(lenToAdd), ...jobResults];
     updateSlicedListJobIds();
 }
+let stepDetail = undefined;
 </script>
 
-{#if job}
-	<div class="flow-root w-full space-y-4">
+{#if notAnonynmous}
+	<Alert type="error" title="Required Auth">
+		As a non logged in user, you can only see jobs ran by anonymous users like you
+	</Alert>
+{:else if job}
+	<div class="flow-root w-full space-y-4 {wideResults ? '' : 'max-w-7xl'} mx-auto px-4">
 		<!-- {#if innerModules.length > 0 && true}
 			<h3 class="text-md leading-6 font-bold text-primay border-b pb-2">Flow result</h3>
 		{:else}
@@ -398,7 +420,7 @@ function loadPreviousIters(lenToAdd) {
 				</p>
 			{/if}
 			{#if render}
-				<div class="w-full h-full border border-secondary bg-surface p-1 overflow-auto">
+				<div class="w-full h-full border rounded-sm bg-surface p-1 overflow-auto">
 					<DisplayResult workspaceId={job?.workspace_id} {jobId} result={jobResults} />
 				</div>
 			{/if}
@@ -469,13 +491,13 @@ function loadPreviousIters(lenToAdd) {
 		{/if}
 		{#if render}
 			{#if innerModules.length > 0 && !isListJob}
-				<Tabs bind:selected>
+				<Tabs class="mx-auto {wideResults ? '' : 'max-w-7xl'}" bind:selected>
 					<Tab value="graph"><span class="font-semibold text-md">Graph</span></Tab>
 					<Tab value="sequence"><span class="font-semibold">Details</span></Tab>
 				</Tabs>
 			{/if}
 		{/if}
-		<div class={selected != 'sequence' ? 'hidden' : ''}>
+		<div class="{selected != 'sequence' ? 'hidden' : ''} max-w-7xl mx-auto">
 			{#if isListJob}
 				{@const lenToAdd = Math.min(
 					20,
@@ -662,8 +684,8 @@ function loadPreviousIters(lenToAdd) {
 	</div>
 	{#if render}
 		{#if job.raw_flow && !isListJob}
-			<div class="{selected != 'graph' ? 'hidden' : ''} mt-4">
-				<div class="grid grid-cols-3 border">
+			<div class="{selected != 'graph' ? 'hidden' : ''} grow mt-4">
+				<div class="grid grid-cols-3 border h-full">
 					<div class="col-span-2 bg-surface-secondary">
 						<div class="flex flex-col">
 							{#each Object.values($retryStatus) as count}
@@ -687,16 +709,22 @@ function loadPreviousIters(lenToAdd) {
 							success={jobId != undefined && isSuccess(job?.['success'])}
 							flowModuleStates={$localModuleStates}
 							on:select={(e) => {
-								rightColumnSelect = 'detail'
+								if (rightColumnSelect != 'node_definition') {
+									rightColumnSelect = 'node_status'
+								}
 								if (typeof e.detail == 'string') {
 									if (e.detail == 'Input') {
 										selectedNode = 'start'
+										stepDetail = undefined
 									} else if (e.detail == 'Result') {
 										selectedNode = 'end'
+										stepDetail = 'end'
 									} else {
 										selectedNode = e.detail
+										stepDetail = e.detail
 									}
 								} else {
+									stepDetail = e.detail
 									selectedNode = e.detail.id
 								}
 							}}
@@ -705,24 +733,27 @@ function loadPreviousIters(lenToAdd) {
 						/>
 					</div>
 					<div
-						class="border-l border-tertiary-inverse pt-1 overflow-auto min-h-[700px] flex flex-col"
+						class="border-l border-tertiary-inverse pt-1 overflow-auto min-h-[700px] flex flex-col z-0"
 					>
 						<Tabs bind:selected={rightColumnSelect}>
 							<Tab value="timeline"><span class="font-semibold text-md">Timeline</span></Tab>
-							<Tab value="detail"><span class="font-semibold">Details</span></Tab>
+							<Tab value="node_status"><span class="font-semibold">Node status</span></Tab>
+							<Tab value="node_definition"><span class="font-semibold">Node definition</span></Tab>
 							{#if Object.keys(job?.flow_status?.user_states ?? {}).length > 0}
 								<Tab value="user_states"><span class="font-semibold">User States</span></Tab>
 							{/if}
 						</Tabs>
 						{#if rightColumnSelect == 'timeline'}
 							<FlowTimeline
+								selfWaitTime={job?.self_wait_time_ms}
+								aggregateWaitTime={job?.aggregate_wait_time_ms}
 								flowDone={job?.['success'] != undefined}
 								bind:this={flowTimeline}
 								flowModules={dfs(job.raw_flow?.modules ?? [], (x) => x.id)}
 								durationStatuses={localDurationStatuses}
 							/>
-						{:else if rightColumnSelect == 'detail'}
-							<div class="pt-2 h-full">
+						{:else if rightColumnSelect == 'node_status'}
+							<div class="pt-2 max-h-[80vh]">
 								{#if selectedNode}
 									{@const node = $localModuleStates[selectedNode]}
 
@@ -793,6 +824,8 @@ function loadPreviousIters(lenToAdd) {
 								{:else}<p class="p-2 text-tertiary italic">Select a node to see its details here</p
 									>{/if}
 							</div>
+						{:else if rightColumnSelect == 'node_definition'}
+							<FlowGraphViewerStep {stepDetail} />
 						{:else if rightColumnSelect == 'user_states'}
 							<div class="p-2">
 								<JobArgs argLabel="Key" args={job?.flow_status?.user_states ?? {}} />

package/package/components/FlowStatusViewerInner.svelte.d.ts

@@ -20,9 +20,12 @@ declare const __propDef: {
         globalDurationStatuses: Writable<Record<string, DurationStatus>>[];
         childFlow?: boolean | undefined;
         reducedPolling?: boolean | undefined;
+        wideResults?: boolean | undefined;
     };
     events: {
+        start: CustomEvent<any>;
         jobsLoaded: CustomEvent<any>;
+        done: CustomEvent<any>;
     } & {
         [evt: string]: CustomEvent<any>;
     };

package/package/components/FlowTimeline.svelte

@@ -3,6 +3,9 @@ import { onDestroy } from 'svelte';
 import { getDbClockNow } from '../forLater';
 import { Loader2 } from 'lucide-svelte';
 import TimelineBar from './TimelineBar.svelte';
+import WaitTimeWarning from './common/waitTimeWarning/WaitTimeWarning.svelte';
+export let selfWaitTime = undefined;
+export let aggregateWaitTime = undefined;
 export let flowModules;
 export let durationStatuses;
 export let flowDone = false;
@@ -113,6 +116,16 @@ onDestroy(() => {
 				</div>
 			</div>
 		</div>
+		{#if selfWaitTime}
+			<div class="px-2 py-2 grid grid-cols-6 w-full">
+				root:
+				<WaitTimeWarning
+					self_wait_time_ms={selfWaitTime}
+					aggregate_wait_time_ms={aggregateWaitTime}
+					variant="badge-self-wait"
+				/>
+			</div>
+		{/if}
 		{#each Object.values(flowModules) as k (k)}
 			<div class="overflow-auto max-h-60 shadow-inner dark:shadow-gray-700 relative">
 				{#if ($durationStatuses?.[k]?.iteration_from ?? 0) > 0}

package/package/components/FlowTimeline.svelte.d.ts

@@ -2,6 +2,8 @@ import { SvelteComponent } from "svelte";
 import type { Writable } from 'svelte/store';
 declare const __propDef: {
     props: {
+        selfWaitTime?: number | undefined;
+        aggregateWaitTime?: number | undefined;
         flowModules: string[];
         durationStatuses: Writable<Record<string, {
             byJob: Record<string, {

package/package/components/FlowViewer.svelte

@@ -5,14 +5,9 @@ import SchemaViewer from './SchemaViewer.svelte';
 import FieldHeader from './FieldHeader.svelte';
 import { copyToClipboard } from '../utils';
 import FlowGraphViewer from './FlowGraphViewer.svelte';
-import { setContext } from 'svelte';
-import { SVELVET_CONTEXT_KEY } from './graph/svelvet/container/models';
 import { Clipboard } from 'lucide-svelte';
 import YAML from 'yaml';
 import { yaml } from 'svelte-highlight/languages';
-setContext(SVELVET_CONTEXT_KEY, {
-    fullHeight: true
-});
 export let flow;
 export let initialOpen = undefined;
 export let noSide = false;

package/package/components/FolderEditor.svelte

@@ -9,6 +9,9 @@ import ToggleButtonGroup from './common/toggleButton-v2/ToggleButtonGroup.svelte
 import ToggleButton from './common/toggleButton-v2/ToggleButton.svelte';
 import Section from './Section.svelte';
 import { Eye, Plus } from 'lucide-svelte';
+import Label from './Label.svelte';
+import { sendUserToast } from '../toast';
+import { createEventDispatcher } from 'svelte';
 export let name;
 let can_write = false;
 let folder;
@@ -49,6 +52,7 @@ let folderNotFound = undefined;
 async function loadFolder() {
     try {
         folder = await FolderService.getFolder({ workspace: $workspaceStore, name });
+        summary = folder.summary ?? '';
         can_write =
             $userStore != undefined &&
                 (folder?.owners.includes('u/' + $userStore.username) ||
@@ -85,6 +89,7 @@ function getRole(x) {
 let ownerKind = 'user';
 let groupCreated = undefined;
 let newGroupName = '';
+let summary = '';
 async function addGroup() {
     await GroupService.createGroup({
         workspace: $workspaceStore ?? '',
@@ -95,6 +100,17 @@ async function addGroup() {
     loadGroups();
     ownerItem = newGroupName;
 }
+const dispatch = createEventDispatcher();
+async function updateFolder() {
+    await FolderService.updateFolder({
+        workspace: $workspaceStore ?? '',
+        name,
+        requestBody: { summary }
+    });
+    sendUserToast('Folder summary updated');
+    dispatch('update');
+    loadFolder();
+}
 </script>
 
 <Drawer bind:this={newGroup}>
@@ -124,6 +140,15 @@ async function addGroup() {
 	</DrawerContent>
 </Drawer>
 
+<Section label="Metadata" class="mb-4">
+	<Label label="Summary">
+		<div class="flex flex-row gap-2">
+			<input placeholder="Short summary to be displayed when listed" bind:value={summary} />
+			<Button size="sm" on:click={updateFolder} disabled={!can_write}>Save</Button>
+		</div>
+	</Label>
+</Section>
+
 <Section label={`Permissions (${perms?.length ?? 0})`}>
 	<div class="flex flex-col gap-6">
 		{#if can_write}

package/package/components/FolderEditor.svelte.d.ts

@@ -4,6 +4,8 @@ declare const __propDef: {
         name: string;
     };
     events: {
+        update: CustomEvent<any>;
+    } & {
         [evt: string]: CustomEvent<any>;
     };
     slots: {};