windmill-components 1.550.0 → 1.555.0

package/package/components/raw_apps/RawAppEditorHeader.svelte

@@ -1,75 +1,42 @@
-<script lang="ts">import { Alert, Badge, Drawer, DrawerContent } from '../common';
+<script lang="ts">import { Badge, Drawer, DrawerContent } from '../common';
 import Button from '../common/button/Button.svelte';
-import Path from '../Path.svelte';
-import Toggle from '../Toggle.svelte';
 import { AppService, DraftService } from '../../gen';
 import { enterpriseLicense, userStore, workspaceStore } from '../../stores';
-import { Bug, DiffIcon, FileJson, FileUp, History, Loader2, MoreVertical, Pen, Save } from 'lucide-svelte';
+import { Bug, DiffIcon, FileJson, FileUp, History, MoreVertical, Pen, Save } from 'lucide-svelte';
 import { createEventDispatcher } from 'svelte';
 import { cleanValueProperties, orderedJsonStringify, replaceFalseWithUndefined, defaultIfEmptyString } from '../../utils';
 // import {  allItems, toStatic } from '../apps/editor/settingsPanel/utils'
 import AppExportButton from '../apps/editor/AppExportButton.svelte';
 import UnsavedConfirmationModal from '../common/confirmationModal/UnsavedConfirmationModal.svelte';
-import Tooltip from '../Tooltip.svelte';
 import { sendUserToast } from '../../toast';
 import DeploymentHistory from '../apps/editor/DeploymentHistory.svelte';
 import Awareness from '../Awareness.svelte';
 import Summary from '../Summary.svelte';
 import DeployOverrideConfirmationModal from '../common/confirmationModal/DeployOverrideConfirmationModal.svelte';
-import { isCloudHosted } from '../../cloud';
-import { base } from '../../base';
-import ClipboardPanel from '../details/ClipboardPanel.svelte';
 import AppJobsDrawer from '../apps/editor/AppJobsDrawer.svelte';
 import { collectStaticFields, hash } from '../apps/editor/commonAppUtils';
 import DropdownV2 from '../DropdownV2.svelte';
 import { stateSnapshot } from '../../svelte5Utils.svelte';
-// async function hash(message) {
-// 	try {
-// 		const msgUint8 = new TextEncoder().encode(message) // encode as (utf-8) Uint8Array
-// 		const hashBuffer = await crypto.subtle.digest('SHA-256', msgUint8) // hash the message
-// 		const hashArray = Array.from(new Uint8Array(hashBuffer)) // convert buffer to byte array
-// 		const hashHex = hashArray.map((b) => b.toString(16).padStart(2, '0')).join('') // convert bytes to hex string
-// 		return hashHex
-// 	} catch {
-// 		//subtle not available, trying pure js
-// 		const hash = new Sha256()
-// 		hash.update(message ?? '')
-// 		const result = Array.from(await hash.digest())
-// 		const hex = result.map((b) => b.toString(16).padStart(2, '0')).join('') // convert bytes to hex string
-// 		return hex
-// 	}
-// }
-export let summary;
-export let policy;
-export let diffDrawer = undefined;
-export let savedApp = undefined;
-export let version = undefined;
-export let newApp;
-export let newPath = '';
-export let appPath;
-export let runnables;
-export let files;
-export let jobs;
-export let jobsById;
-export let getBundle;
-let newEditedPath = '';
-$: app = files ? { runnables: $runnables, files } : undefined;
-let deployedValue = undefined; // Value to diff against
-let deployedBy = undefined; // Author
-let confirmCallback = () => { }; // What happens when user clicks `override` in warning
-let open = false; // Is confirmation modal open
+import AppEditorHeaderDeployInitialDraft from '../apps/editor/AppEditorHeaderDeployInitialDraft.svelte';
+import AppEditorHeaderDeploy from '../apps/editor/AppEditorHeaderDeploy.svelte';
+let { summary = $bindable(), policy = $bindable(), diffDrawer = undefined, savedApp = $bindable(undefined), version = $bindable(undefined), newApp, newPath = '', appPath, runnables, files, jobs = $bindable(), jobsById = $bindable(), getBundle } = $props();
+let newEditedPath = $state('');
+let deployedValue = $state(undefined); // Value to diff against
+let deployedBy = $state(undefined); // Author
+let confirmCallback = $state(() => { }); // What happens when user clicks `override` in warning
+let open = $state(false); // Is confirmation modal open
 // const { app, summary, appPath, jobs, jobsById, staticExporter } = getContext('AppViewerContext')
-const loading = {
+const loading = $state({
     publish: false,
     save: false,
     saveDraft: false
-};
-let pathError = undefined;
-let appExport;
-let draftDrawerOpen = false;
-let saveDrawerOpen = false;
-let historyBrowserDrawerOpen = false;
-let deploymentMsg = undefined;
+});
+let pathError = $state('');
+let appExport = $state();
+let draftDrawerOpen = $state(false);
+let saveDrawerOpen = $state(false);
+let historyBrowserDrawerOpen = $state(false);
+let deploymentMsg = $state(undefined);
 function closeSaveDrawer() {
     saveDrawerOpen = false;
 }
@@ -82,7 +49,7 @@ async function computeTriggerables() {
     policy.on_behalf_of = $userStore?.username.includes('@')
         ? $userStore?.username
         : `u/${$userStore?.username}`;
-    policy.triggerables_v2 = Object.fromEntries((await Promise.all(Object.values($runnables).map(async (runnable) => {
+    policy.triggerables_v2 = Object.fromEntries((await Promise.all(Object.values(runnables).map(async (runnable) => {
         return await processRunnable(runnable.name, runnable, runnable.fields);
     }))));
     return policy;
@@ -263,14 +230,6 @@ async function updateApp(npath) {
         dispatch('savedNewAppPath', npath);
     }
 }
-let secretUrl = undefined;
-$: appPath && appPath != '' && secretUrl == undefined && getSecretUrl();
-async function getSecretUrl() {
-    secretUrl = await AppService.getPublicSecretOfApp({
-        workspace: $workspaceStore,
-        path: appPath
-    });
-}
 async function setPublishState() {
     await computeTriggerables();
     await AppService.updateApp({
@@ -455,7 +414,7 @@ async function saveDraft(forceSave = false) {
         throw e;
     }
 }
-let onLatest = true;
+let onLatest = $state(true);
 async function compareVersions() {
     if (version === undefined) {
         return;
@@ -472,9 +431,6 @@ async function compareVersions() {
         onLatest = true;
     }
 }
-$: saveDrawerOpen && compareVersions();
-let dirtyPath = false;
-let path = undefined;
 let moreItems = [
     {
         displayName: 'Deployment history',
@@ -488,7 +444,7 @@ let moreItems = [
         displayName: 'Export',
         icon: FileJson,
         action: () => {
-            appExport.open(app);
+            appExport?.open(app);
         }
     },
     {
@@ -526,37 +482,9 @@ let moreItems = [
     }
 ];
 const dispatch = createEventDispatcher();
-let customPath = savedApp?.custom_path;
-let dirtyCustomPath = false;
-let customPathError = '';
-$: fullCustomUrl = `${window.location.origin}${base}/a/${isCloudHosted() ? $workspaceStore + '/' : ''}${customPath}`;
-async function appExists(customPath) {
-    return await AppService.customPathExists({
-        workspace: $workspaceStore,
-        customPath
-    });
-}
-let validateTimeout = undefined;
-async function validateCustomPath(customPath) {
-    customPathError = '';
-    if (validateTimeout) {
-        clearTimeout(validateTimeout);
-    }
-    validateTimeout = setTimeout(async () => {
-        if (!/^[\w-]+(\/[\w-]+)*$/.test(customPath)) {
-            customPathError = 'Invalid path';
-        }
-        else if (customPath !== savedApp?.custom_path && (await appExists(customPath))) {
-            customPathError = 'Path already taken';
-        }
-        else {
-            customPathError = '';
-        }
-        validateTimeout = undefined;
-    }, 500);
-}
-$: customPath !== undefined && validateCustomPath(customPath);
-let jobsDrawerOpen = false;
+let customPath = $state(savedApp?.custom_path);
+let customPathError = $state('');
+let jobsDrawerOpen = $state(false);
 function getInitialAndModifiedValues() {
     return {
         savedValue: savedApp,
@@ -569,6 +497,10 @@ function getInitialAndModifiedValues() {
         }
     };
 }
+let app = $derived(files ? { runnables: runnables, files } : undefined);
+$effect(() => {
+    saveDrawerOpen && compareVersions();
+});
 </script>
 
 <UnsavedConfirmationModal {diffDrawer} {getInitialAndModifiedValues} />
@@ -591,45 +523,6 @@ function getInitialAndModifiedValues() {
 {#if appPath == ''}
 	<Drawer bind:open={draftDrawerOpen} size="800px">
 		<DrawerContent title="Initial draft save" on:close={() => closeDraftDrawer()}>
-			<Alert bgClass="mb-4" title="Require path" type="info">
-				Choose a path to save the initial draft of the app.
-			</Alert>
-			<h3>Summary</h3>
-			<div class="w-full pt-2">
-				<!-- svelte-ignore a11y-autofocus -->
-				<input
-					autofocus
-					type="text"
-					placeholder="App summary"
-					class="text-sm w-full font-semibold"
-					on:keydown|stopPropagation
-					bind:value={summary}
-					on:keyup={() => {
-						if (appPath == '' && summary?.length > 0 && !dirtyPath) {
-							path?.setName(
-								summary
-									.toLowerCase()
-									.replace(/[^a-z0-9_]/g, '_')
-									.replace(/-+/g, '_')
-									.replace(/^-|-$/g, '')
-							)
-						}
-					}}
-				/>
-			</div>
-			<div class="py-2"></div>
-			<Path
-				autofocus={false}
-				bind:this={path}
-				bind:error={pathError}
-				bind:path={newEditedPath}
-				bind:dirty={dirtyPath}
-				initialPath=""
-				namePlaceholder="app"
-				kind="app"
-			/>
-			<div class="py-4"></div>
-
 			{#snippet actions()}
 				<div>
 					<Button
@@ -641,64 +534,12 @@ function getInitialAndModifiedValues() {
 					</Button>
 				</div>
 			{/snippet}
+			<AppEditorHeaderDeployInitialDraft {summary} {appPath} bind:pathError bind:newEditedPath />
 		</DrawerContent>
 	</Drawer>
 {/if}
 <Drawer bind:open={saveDrawerOpen} size="800px">
 	<DrawerContent title="Deploy" on:close={() => closeSaveDrawer()}>
-		{#if !onLatest}
-			<Alert title="You're not on the latest app version. " type="warning">
-				By deploying, you may overwrite changes made by other users. Press 'Deploy' to see diff.
-			</Alert>
-			<div class="py-2"></div>
-		{/if}
-		<span class="text-secondary text-sm font-bold">Summary</span>
-		<div class="w-full pt-2">
-			<!-- svelte-ignore a11y-autofocus -->
-			<input
-				autofocus
-				type="text"
-				placeholder="App summary"
-				class="text-sm w-full"
-				bind:value={summary}
-				on:keydown|stopPropagation
-				on:keyup={() => {
-					if (appPath == '' && summary?.length > 0 && !dirtyPath) {
-						path?.setName(
-							summary
-								.toLowerCase()
-								.replace(/[^a-z0-9_]/g, '_')
-								.replace(/-+/g, '_')
-								.replace(/^-|-$/g, '')
-						)
-					}
-				}}
-			/>
-		</div>
-		<div class="py-4"></div>
-		<span class="text-secondary text-sm font-bold">Deployment message</span>
-		<div class="w-full pt-2">
-			<!-- svelte-ignore a11y-autofocus -->
-			<input
-				type="text"
-				placeholder="Optional deployment message"
-				class="text-sm w-full"
-				bind:value={deploymentMsg}
-			/>
-		</div>
-		<div class="py-4"></div>
-		<span class="text-secondary text-sm font-bold">Path</span>
-		<Path
-			bind:this={path}
-			bind:dirty={dirtyPath}
-			bind:error={pathError}
-			bind:path={newEditedPath}
-			initialPath={newPath}
-			namePlaceholder="app"
-			kind="app"
-			autofocus={false}
-		/>
-
 		{#snippet actions()}
 			<div class="flex flex-row gap-4">
 				<Button
@@ -758,116 +599,22 @@ function getInitialAndModifiedValues() {
 				</Button>
 			</div>
 		{/snippet}
-		<div class="py-2"></div>
-		{#if appPath == ''}
-			<Alert title="Require saving" type="error">
-				Save this app once before you can publish it
-			</Alert>
-		{:else}
-			<Alert title="App executed on behalf of you">
-				A viewer of the app will execute the runnables of the app on behalf of the publisher (you)
-				<Tooltip>
-					It ensures that all required resources/runnable visible for publisher but not for viewer
-					at time of creating the app would prevent the execution of the app. To guarantee tight
-					security, a policy is computed at time of deployment of the app which only allow the
-					scripts/flows referred to in the app to be called on behalf of. Furthermore, static
-					parameters are not overridable. Hence, users will only be able to use the app as intended
-					by the publisher without risk for leaking resources not used in the app.
-				</Tooltip>
-			</Alert>
-
-			<div class="mt-10"></div>
-
-			<h2>Public URL</h2>
-			<div class="mt-4"></div>
-
-			<div class="flex gap-2 items-center">
-				<Toggle
-					options={{
-						left: `Require login and read-access`,
-						right: `No login required`
-					}}
-					checked={policy.execution_mode == 'anonymous'}
-					on:change={(e) => {
-						policy.execution_mode = e.detail ? 'anonymous' : 'publisher'
-						setPublishState()
-					}}
-				/>
-			</div>
-
-			<div class="my-6 box">
-				<div class="text-secondary">
-					<div>Public URL</div>
-				</div>
-				{#if secretUrl}
-					{@const href = `${window.location.origin}${base}/public/${$workspaceStore}/${secretUrl}`}
-					<ClipboardPanel content={href} size="md" />
-				{:else}<Loader2 class="animate-spin" />
-				{/if}
-				<div class="text-xs text-secondary mt-1">
-					Share this url directly or embed it using an iframe (if requiring login, top-level domain
-					of embedding app must be the same as the one of Windmill)
-				</div>
 
-				<div class="mt-4">
-					{#if !$enterpriseLicense}
-						<Alert title="EE Only" type="warning" size="xs">
-							Custom path is an enterprise only feature.
-						</Alert>
-						<div class="mb-2"></div>
-					{:else if !($userStore?.is_admin || $userStore?.is_super_admin)}
-						<Alert type="warning" title="Admin only" size="xs">
-							Custom path can only be set by workspace admins
-						</Alert>
-						<div class="mb-2"></div>
-					{/if}
-					<Toggle
-						on:change={({ detail }) => {
-							customPath = detail ? '' : undefined
-						}}
-						checked={customPath !== undefined}
-						options={{
-							right: 'Use a custom URL'
-						}}
-						disabled={!$enterpriseLicense || !($userStore?.is_admin || $userStore?.is_super_admin)}
-					/>
-
-					{#if customPath !== undefined}
-						<div class="text-secondary text-sm flex items-center gap-1 w-full justify-between">
-							<div>Custom path</div>
-						</div>
-						<input
-							disabled={!($userStore?.is_admin || $userStore?.is_super_admin)}
-							type="text"
-							autocomplete="off"
-							bind:value={customPath}
-							class={customPathError === ''
-								? ''
-								: 'border border-red-700 bg-red-100 border-opacity-30 focus:border-red-700 focus:border-opacity-30 focus-visible:ring-red-700 focus-visible:ring-opacity-25 focus-visible:border-red-700'}
-							on:input={() => {
-								dirtyCustomPath = true
-							}}
-						/>
-						<div class="text-secondary text-sm flex items-center gap-1 mt-2 w-full justify-between">
-							<div>Custom public URL</div>
-						</div>
-						<ClipboardPanel content={fullCustomUrl} size="md" />
-
-						<div class="text-red-600 dark:text-red-400 text-2xs mt-1.5"
-							>{dirtyCustomPath ? customPathError : ''}
-						</div>
-					{/if}
-				</div>
-			</div>
-			<Alert type="info" title="Only latest deployed app is publicly available">
-				You will still need to deploy the app to make visible the latest changes
-			</Alert>
-
-			<a
-				href="https://www.windmill.dev/docs/advanced/external_auth_with_jwt#embed-public-apps-using-your-own-authentification"
-				class="mt-4 text-2xs">Embed this app in your own product to be used by your own users</a
-			>
-		{/if}
+		<AppEditorHeaderDeploy
+			{newPath}
+			{policy}
+			{setPublishState}
+			{appPath}
+			{onLatest}
+			{savedApp}
+			{summary}
+			bind:customPath
+			bind:deploymentMsg
+			bind:customPathError
+			bind:pathError
+			bind:newEditedPath
+			hideSecretUrl={true}
+		/>
 	</DrawerContent>
 </Drawer>
 
@@ -903,7 +650,7 @@ function getInitialAndModifiedValues() {
 			<div class="flex justify-start w-full border rounded-md overflow-hidden">
 				<div>
 					<button
-						on:click={async () => {
+						onclick={async () => {
 							saveDrawerOpen = true
 							setTimeout(() => {
 								document.getElementById('path')?.focus()
@@ -924,7 +671,7 @@ function getInitialAndModifiedValues() {
 					value={defaultIfEmptyString(newEditedPath, newPath)}
 					size={defaultIfEmptyString(newEditedPath, newPath)?.length || 50}
 					class="font-mono !text-xs !min-w-[96px] !max-w-[300px] !w-full !h-[28px] !my-0 !py-0 !border-l-0 !rounded-l-none !border-0 !shadow-none"
-					on:focus={({ currentTarget }) => {
+					onfocus={({ currentTarget }) => {
 						currentTarget.select()
 					}}
 				/>
@@ -936,13 +683,13 @@ function getInitialAndModifiedValues() {
 	{/if}
 	<div class="flex flex-row gap-2 justify-end items-center overflow-visible">
 		<DropdownV2 items={moreItems} class="h-auto">
-			<svelte:fragment slot="buttonReplacement">
+			{#snippet buttonReplacement()}
 				<Button nonCaptureEvent size="xs" color="light">
 					<div class="flex flex-row items-center">
 						<MoreVertical size={14} />
 					</div>
 				</Button>
-			</svelte:fragment>
+			{/snippet}
 		</DropdownV2>
 
 		<div class="hidden md:inline relative overflow-visible">

package/package/components/raw_apps/RawAppEditorHeader.svelte.d.ts

@@ -1,21 +1,7 @@
 import { type Policy } from '../../gen';
 import type DiffDrawer from '../DiffDrawer.svelte';
 import type { HiddenRunnable } from '../apps/types';
-import type { Writable } from 'svelte/store';
-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 RawAppEditorHeader: $$__sveltets_2_IsomorphicComponent<{
+interface Props {
     summary: string;
     policy: Policy;
     diffDrawer?: DiffDrawer | undefined;
@@ -32,7 +18,7 @@ declare const RawAppEditorHeader: $$__sveltets_2_IsomorphicComponent<{
     newApp: boolean;
     newPath?: string;
     appPath: string;
-    runnables: Writable<Record<string, HiddenRunnable>>;
+    runnables: Record<string, HiddenRunnable>;
     files: Record<string, string> | undefined;
     jobs: string[];
     jobsById: Record<string, any>;
@@ -40,11 +26,24 @@ declare const RawAppEditorHeader: $$__sveltets_2_IsomorphicComponent<{
         js: string;
         css: string;
     }>;
-}, {
-    keydown: KeyboardEvent;
+}
+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 RawAppEditorHeader: $$__sveltets_2_IsomorphicComponent<Props, {
     restore: CustomEvent<any>;
 } & {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+}, {}, {}, "summary" | "jobs" | "version" | "policy" | "jobsById" | "savedApp">;
 type RawAppEditorHeader = InstanceType<typeof RawAppEditorHeader>;
 export default RawAppEditorHeader;

package/package/components/raw_apps/RawAppInlineScriptEditor.svelte

@@ -1,4 +1,6 @@
-<script lang="ts">import Button from '../common/button/Button.svelte';
+<script lang="ts">import { createBubbler, stopPropagation } from 'svelte/legacy';
+const bubble = createBubbler();
+import Button from '../common/button/Button.svelte';
 import { createEventDispatcher, onMount } from 'svelte';
 import { Maximize2, Trash2 } from 'lucide-svelte';
 import { inferArgs } from '../../infer';
@@ -12,18 +14,10 @@ import InlineScriptEditorDrawer from '../apps/editor/inlineScriptsPanel/InlineSc
 import CacheTtlPopup from '../apps/editor/inlineScriptsPanel/CacheTtlPopup.svelte';
 import RunButton from '../RunButton.svelte';
 import { computeFields } from '../apps/editor/inlineScriptsPanel/utils';
-let inlineScriptEditorDrawer;
-export let inlineScript;
-export let name = undefined;
-export let id;
-export let fields = {};
-export let path;
-export let isLoading = false;
-export let onRun;
-export let onCancel;
-export let editor = undefined;
-let diffEditor;
-let validCode = true;
+let inlineScriptEditorDrawer = $state();
+let { inlineScript = $bindable(), name = $bindable(undefined), id, fields = $bindable({}), path, isLoading = false, onRun, onCancel, editor = $bindable(undefined) } = $props();
+let diffEditor = $state();
+let validCode = $state(true);
 async function inferInlineScriptSchema(language, content, schema) {
     try {
         await inferArgs(language, content, schema);
@@ -50,7 +44,7 @@ async function syncFields() {
     }
 }
 const dispatch = createEventDispatcher();
-let drawerIsOpen = undefined;
+let drawerIsOpen = $state(undefined);
 </script>
 
 {#if inlineScript}
@@ -73,11 +67,11 @@ let drawerIsOpen = undefined;
 			{#if name !== undefined}
 				<div class="flex flex-row gap-2 w-full items-center">
 					<input
-						on:keydown|stopPropagation
+						onkeydown={stopPropagation(bubble('keydown'))}
 						bind:value={name}
 						placeholder="Inline script name"
 						class="!text-xs !rounded-sm !shadow-none"
-						on:keyup={() => {
+						onkeyup={() => {
 							// $app = $app
 							// if (stateId) {
 							// 	$stateId++

package/package/components/raw_apps/RawAppInlineScriptEditor.svelte.d.ts

@@ -1,6 +1,17 @@
 import Editor from '../Editor.svelte';
 import type { InlineScript } from '../apps/types';
 import type { AppInput } from '../apps/inputType';
+interface Props {
+    inlineScript: InlineScript | undefined;
+    name?: string | undefined;
+    id: string;
+    fields?: Record<string, AppInput>;
+    path: string;
+    isLoading?: boolean;
+    onRun: () => Promise<void>;
+    onCancel: () => Promise<void>;
+    editor?: Editor | 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;
@@ -14,22 +25,11 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
     };
     z_$$bindings?: Bindings;
 }
-declare const RawAppInlineScriptEditor: $$__sveltets_2_IsomorphicComponent<{
-    inlineScript: InlineScript | undefined;
-    name?: string | undefined;
-    id: string;
-    fields?: Record<string, AppInput>;
-    path: string;
-    isLoading?: boolean;
-    onRun: () => Promise<void>;
-    onCancel: () => Promise<void>;
-    editor?: Editor | undefined;
-}, {
-    keydown: KeyboardEvent;
+declare const RawAppInlineScriptEditor: $$__sveltets_2_IsomorphicComponent<Props, {
     createScriptFromInlineScript: CustomEvent<any>;
     delete: CustomEvent<any>;
 } & {
     [evt: string]: CustomEvent<any>;
-}, {}, {}, string>;
+}, {}, {}, "name" | "fields" | "inlineScript" | "editor">;
 type RawAppInlineScriptEditor = InstanceType<typeof RawAppInlineScriptEditor>;
 export default RawAppInlineScriptEditor;

package/package/components/raw_apps/RawAppInlineScriptPanelList.svelte

@@ -7,16 +7,13 @@ import HideButton from '../apps/editor/settingsPanel/HideButton.svelte';
 import { getNextId } from '../flows/idUtils';
 let { selectedRunnable = $bindable(), runnables } = $props();
 function createBackgroundScript() {
-    const nid = getNextId(Object.keys($runnables ?? {}));
+    const nid = getNextId(Object.keys(runnables ?? {}));
     const newScriptPath = `Backend Runnable ${nid}`;
-    runnables.update((r) => {
-        r[nid] = {
-            name: newScriptPath,
-            inlineScript: undefined,
-            type: 'runnableByName'
-        };
-        return r;
-    });
+    runnables[nid] = {
+        name: newScriptPath,
+        inlineScript: undefined,
+        type: 'runnableByName'
+    };
     selectedRunnable = nid;
 }
 const dispatch = createEventDispatcher();
@@ -51,8 +48,8 @@ const dispatch = createEventDispatcher();
 	<div class="w-full flex flex-col gap-6 py-1">
 		<div>
 			<div class="flex flex-col gap-1 w-full">
-				{#if Object.keys($runnables ?? {}).length > 0}
-					{#each Object.entries($runnables ?? {}) as [id, runnable]}
+				{#if Object.keys(runnables ?? {}).length > 0}
+					{#each Object.entries(runnables ?? {}) as [id, runnable]}
 						{#if runnable}
 							<button
 								{id}

package/package/components/raw_apps/RawAppInlineScriptPanelList.svelte.d.ts

@@ -1,8 +1,7 @@
-import type { Writable } from 'svelte/store';
 import type { Runnable } from '../apps/inputType';
 interface Props {
     selectedRunnable: string | undefined;
-    runnables: Writable<Record<string, Runnable>>;
+    runnables: Record<string, Runnable>;
 }
 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> & {