windmill-components 1.13.27 → 1.22.42

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

@@ -0,0 +1,22 @@
+import { SvelteComponentTyped } from "svelte";
+import type { IconDefinition } from '@fortawesome/free-brands-svg-icons';
+declare const __propDef: {
+    props: {
+        disabled?: boolean | undefined;
+        icon: IconDefinition;
+        label: string;
+        iconColor: string;
+    };
+    events: {
+        click: MouseEvent;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export declare type FlowScriptPickerProps = typeof __propDef.props;
+export declare type FlowScriptPickerEvents = typeof __propDef.events;
+export declare type FlowScriptPickerSlots = typeof __propDef.slots;
+export default class FlowScriptPicker extends SvelteComponentTyped<FlowScriptPickerProps, FlowScriptPickerEvents, FlowScriptPickerSlots> {
+}
+export {};

package/components/flows/pickers/PickHubScript.svelte

@@ -0,0 +1,30 @@
+<script>import { faUserGroup } from '@fortawesome/free-solid-svg-icons';
+import FlowScriptPicker from './FlowScriptPicker.svelte';
+import ItemPicker from '../../ItemPicker.svelte';
+import { hubScripts } from '../../../stores';
+import { createEventDispatcher } from 'svelte';
+export let isTrigger;
+let items;
+$: items = $hubScripts?.filter((x) => x.is_trigger == isTrigger) ?? [];
+let itemPicker;
+const dispatch = createEventDispatcher();
+</script>
+
+<ItemPicker
+	bind:this={itemPicker}
+	pickCallback={(path) => {
+		dispatch('pick', { path })
+	}}
+	itemName={'Script'}
+	extraField="summary"
+	loadItems={async () => {
+		return items
+	}}
+/>
+
+<FlowScriptPicker
+	label={`Pick a ${isTrigger ? 'trigger ' : ''} script from the Hub`}
+	icon={faUserGroup}
+	iconColor="text-blue-500"
+	on:click={() => itemPicker.openModal()}
+/>

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

@@ -0,0 +1,18 @@
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        isTrigger: boolean;
+    };
+    events: {
+        pick: CustomEvent<any>;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export declare type PickHubScriptProps = typeof __propDef.props;
+export declare type PickHubScriptEvents = typeof __propDef.events;
+export declare type PickHubScriptSlots = typeof __propDef.slots;
+export default class PickHubScript extends SvelteComponentTyped<PickHubScriptProps, PickHubScriptEvents, PickHubScriptSlots> {
+}
+export {};

package/components/flows/pickers/PickScript.svelte

@@ -0,0 +1,38 @@
+<script>import ItemPicker from '../../ItemPicker.svelte';
+import { faUserGroup } from '@fortawesome/free-solid-svg-icons';
+import { ScriptService } from '../../../gen';
+import { workspaceStore } from '../../../stores';
+import { createEventDispatcher } from 'svelte';
+import FlowScriptPicker from './FlowScriptPicker.svelte';
+export let isTrigger;
+let items = [];
+let itemPicker;
+const dispatch = createEventDispatcher();
+async function loadItems() {
+    items = await ScriptService.listScripts({ workspace: $workspaceStore, isTrigger });
+}
+$: {
+    if ($workspaceStore) {
+        loadItems();
+    }
+}
+</script>
+
+<ItemPicker
+	bind:this={itemPicker}
+	pickCallback={(path) => {
+		dispatch('pick', { path })
+	}}
+	itemName={'Script'}
+	extraField="summary"
+	loadItems={async () => {
+		return items
+	}}
+/>
+
+<FlowScriptPicker
+	label={`Pick a ${isTrigger ? 'trigger ' : ''}script from your workspace`}
+	icon={faUserGroup}
+	iconColor="text-blue-500"
+	on:click={() => itemPicker.openModal()}
+/>

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

@@ -0,0 +1,18 @@
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        isTrigger: boolean;
+    };
+    events: {
+        pick: CustomEvent<any>;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export declare type PickScriptProps = typeof __propDef.props;
+export declare type PickScriptEvents = typeof __propDef.events;
+export declare type PickScriptSlots = typeof __propDef.slots;
+export default class PickScript extends SvelteComponentTyped<PickScriptProps, PickScriptEvents, PickScriptSlots> {
+}
+export {};

package/components/flows/utils.d.ts

@@ -0,0 +1,17 @@
+import type { Schema } from '../../common';
+import { FlowModuleValue, InputTransform, type Flow, type FlowModule } from '../../gen';
+import type { FlowMode } from './flowStore';
+export declare function flowToMode(flow: Flow, mode: FlowMode): Flow;
+export declare function flattenForloopFlows(flow: Flow): Flow;
+export declare function getTypeAsString(arg: any): string;
+export declare function formatValue(arg: any): any;
+export declare function getFirstStepSchema(flow: Flow): Promise<Schema>;
+export declare function createInlineScriptModuleFromPath(path: string): Promise<FlowModuleValue>;
+export declare function scrollIntoView(el: any): void;
+export declare function loadSchemaFromModule(module: FlowModule): Promise<{
+    input_transform: Record<string, InputTransform>;
+    schema: Schema;
+}>;
+export declare function isCodeInjection(expr: string | undefined): boolean;
+export declare function getCodeInjectionExpr(code: string, isRaw: boolean): string;
+export declare function getDefaultExpr(i: number, key?: string): string;

package/components/flows/utils.js

@@ -0,0 +1,143 @@
+import { FlowModuleValue, InputTransform, ScriptService } from '../../gen';
+import { inferArgs } from '../../infer';
+import { loadSchema } from '../../scripts';
+import { emptySchema, getScriptByPath } from '../../utils';
+export function flowToMode(flow, mode) {
+    if (mode == 'pull') {
+        const newFlow = JSON.parse(JSON.stringify(flow));
+        const triggerModule = newFlow.value.modules[0];
+        const oldModules = newFlow.value.modules.slice(1);
+        if (triggerModule) {
+            triggerModule.stop_after_if_expr = 'result.res1.length == 0';
+            triggerModule.skip_if_stopped = true;
+        }
+        newFlow.value.modules = newFlow.value.modules.slice(0, 1);
+        if (oldModules.length > 0) {
+            newFlow.value.modules.push({
+                input_transform: oldModules[0].input_transform,
+                value: {
+                    type: FlowModuleValue.type.FORLOOPFLOW,
+                    iterator: { type: InputTransform.type.JAVASCRIPT, expr: 'result.res1' },
+                    value: {
+                        modules: oldModules
+                    }
+                }
+            });
+        }
+        return newFlow;
+    }
+    return flow;
+}
+export function flattenForloopFlows(flow) {
+    let newFlow = JSON.parse(JSON.stringify(flow));
+    if (newFlow.value.modules[1]?.value.type == FlowModuleValue.type.FORLOOPFLOW) {
+        const oldModules = newFlow.value.modules[1].value.value?.modules ?? [];
+        newFlow.value.modules = newFlow.value.modules.slice(0, 1);
+        newFlow.value.modules.push(...oldModules);
+    }
+    return newFlow;
+}
+export function getTypeAsString(arg) {
+    if (arg === null) {
+        return 'null';
+    }
+    return typeof arg;
+}
+export function formatValue(arg) {
+    if (getTypeAsString(arg) === 'string') {
+        return `"${arg}"`;
+    }
+    return arg;
+}
+export async function getFirstStepSchema(flow) {
+    const [firstModule] = flow.value.modules;
+    if (firstModule.value.type === FlowModuleValue.type.RAWSCRIPT) {
+        const { language, content } = firstModule.value;
+        if (language && content) {
+            const schema = emptySchema();
+            await inferArgs(language, content, schema);
+            return schema;
+        }
+    }
+    else if (firstModule.value.path) {
+        return await loadSchema(firstModule.value.path);
+    }
+    return emptySchema();
+}
+export async function createInlineScriptModuleFromPath(path) {
+    const { content, language } = await getScriptByPath(path);
+    return {
+        type: FlowModuleValue.type.RAWSCRIPT,
+        language: language,
+        content: content,
+        path
+    };
+}
+export function scrollIntoView(el) {
+    if (!el)
+        return;
+    el.scrollIntoView({
+        behavior: 'smooth',
+        block: 'start',
+        inline: 'nearest'
+    });
+}
+export async function loadSchemaFromModule(module) {
+    const isRaw = module?.value.type === FlowModuleValue.type.RAWSCRIPT;
+    if (isRaw || Boolean(module.value.path)) {
+        let schema;
+        if (isRaw) {
+            schema = emptySchema();
+            await inferArgs(module.value.language, module.value.content, schema);
+        }
+        else {
+            schema = await loadSchema(module.value.path);
+        }
+        const keys = Object.keys(schema?.properties ?? {});
+        let input_transform = module.input_transform;
+        if (JSON.stringify(Object.keys(schema?.properties ?? {}).sort()) !==
+            JSON.stringify(Object.keys(module.input_transform).sort())) {
+            input_transform = keys.reduce((accu, key) => {
+                accu[key] = {
+                    type: 'static',
+                    value: undefined
+                };
+                return accu;
+            }, {});
+        }
+        return {
+            input_transform: input_transform,
+            schema: schema ?? emptySchema()
+        };
+    }
+    return {
+        input_transform: {},
+        schema: emptySchema()
+    };
+}
+export function isCodeInjection(expr) {
+    if (!expr) {
+        return false;
+    }
+    const lines = expr.split('\n');
+    const [returnStatement] = lines.reverse();
+    const returnStatementRegex = new RegExp(/\$\{(.*)\}/);
+    if (returnStatementRegex.test(returnStatement)) {
+        const [_, argName] = returnStatement.split(returnStatementRegex);
+        return Boolean(argName);
+    }
+    return false;
+}
+export function getCodeInjectionExpr(code, isRaw) {
+    let expr = `\`${code}\``;
+    if (isRaw) {
+        expr = `JSON.parse(${expr})`;
+    }
+    return `import { previous_result, flow_input, step, variable, resource, params } from 'windmill'
+${expr}`;
+}
+export function getDefaultExpr(i, key = 'myfield') {
+    return `import { previous_result, flow_input, step, variable, resource, params } from 'windmill@${i}'
+
+previous_result.${key}`;
+}

package/components/propertyPicker/ObjectViewer.svelte

@@ -0,0 +1,113 @@
+<script>import { createEventDispatcher } from 'svelte';
+import { formatValue, getTypeAsString } from '../flows/utils';
+export let json;
+export let level = 0;
+export let isLast = true;
+export let currentPath = '';
+const collapsedSymbol = '...';
+let keys;
+let isArray;
+let openBracket;
+let closeBracket;
+$: {
+    keys = getTypeAsString(json) === 'object' ? Object.keys(json) : [];
+    isArray = Array.isArray(json);
+    openBracket = isArray ? '[' : '{';
+    closeBracket = isArray ? ']' : '}';
+}
+$: collapsed = false;
+function collapse() {
+    collapsed = !collapsed;
+}
+const dispatch = createEventDispatcher();
+function computeKey(key) {
+    if (isArray) {
+        return `${currentPath}[${key}]`;
+    }
+    else {
+        if (currentPath) {
+            return `${currentPath}.${key}`;
+        }
+        else {
+            return key;
+        }
+    }
+}
+function selectProp(key) {
+    dispatch('select', computeKey(key));
+}
+</script>
+
+{#if keys.length > 0}
+	<span class:hidden={collapsed}>
+		<span class="cursor-pointer hover:bg-slate-200" on:click={collapse}>{openBracket}</span>
+		<ul>
+			{#each keys as key, index}
+				<li class={getTypeAsString(json[key]) !== 'object' ? 'hover:bg-sky-100 py-2' : 'py-2'}>
+					{#if !isArray}
+						<span class="key">{key}:</span>
+					{/if}
+
+					{#if getTypeAsString(json[key]) === 'object'}
+						<svelte:self
+							json={json[key]}
+							level={level + 1}
+							isLast={index === keys.length - 1}
+							currentPath={computeKey(key)}
+							on:select
+						/>
+					{:else}
+						<span class="val {getTypeAsString(json[key])}">
+							{formatValue(json[key])}
+							{#if index < keys.length - 1}
+								<span class="text-black">,</span>
+							{/if}
+							<button class="default-button-secondary" on:click={() => selectProp(key)}>
+								Select
+							</button>
+						</span>
+					{/if}
+				</li>
+			{/each}
+		</ul>
+		<span class="cursor-pointer hover:bg-slate-200" on:click={collapse}>{closeBracket}</span>
+		{#if !isLast}
+			<span class="text-black">,</span>
+		{/if}
+	</span>
+	<span class="cursor-pointer hover:bg-slate-200" class:hidden={!collapsed} on:click={collapse}>
+		{openBracket}{collapsedSymbol}{closeBracket}
+	</span>
+	{#if !isLast && collapsed}
+		<span class="text-black">,</span>
+	{/if}
+{/if}
+
+<style>
+	ul {
+		list-style: none;
+		padding-left: 1rem;
+		border-left: 1px dotted lightgray;
+		--tw-text-opacity: 1;
+		color: rgb(0 0 0 / var(--tw-text-opacity));
+	}
+
+	.hidden {
+		display: none;
+	}
+	.val {
+		--tw-text-opacity: 1;
+		color: rgb(0 0 0 / var(--tw-text-opacity));
+}
+	.val.string {
+		--tw-text-opacity: 1;
+		color: rgb(101 163 13 / var(--tw-text-opacity));
+}
+	.val.number {
+		--tw-text-opacity: 1;
+		color: rgb(234 88 12 / var(--tw-text-opacity));
+}
+	.val.boolean {
+		--tw-text-opacity: 1;
+		color: rgb(8 145 178 / var(--tw-text-opacity));
+}</style>

package/components/propertyPicker/ObjectViewer.svelte.d.ts

@@ -0,0 +1,21 @@
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        json: Object;
+        level?: number | undefined;
+        isLast?: boolean | undefined;
+        currentPath?: string | undefined;
+    };
+    events: {
+        select: CustomEvent<any>;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export declare type ObjectViewerProps = typeof __propDef.props;
+export declare type ObjectViewerEvents = typeof __propDef.events;
+export declare type ObjectViewerSlots = typeof __propDef.slots;
+export default class ObjectViewer extends SvelteComponentTyped<ObjectViewerProps, ObjectViewerEvents, ObjectViewerSlots> {
+}
+export {};

package/components/propertyPicker/OverlayPropertyPicker.svelte

@@ -0,0 +1,69 @@
+<script>import { createEventDispatcher } from 'svelte';
+import Overlay from 'svelte-overlay';
+import PropPicker from './PropPicker.svelte';
+import WarningMessage from './WarningMessage.svelte';
+export let previousSchema;
+export let disabled = false;
+let isOpen = false;
+const dispatch = createEventDispatcher();
+function handleWindowKeyDown(event) {
+    if (event.key === 'Escape') {
+        isOpen = false;
+    }
+}
+function onMouseLeave(mouseEvent) {
+    const { offsetY } = mouseEvent;
+    const target = mouseEvent.target;
+    const down = offsetY >= target.clientHeight;
+    const up = offsetY <= 0;
+    const content = document.getElementsByClassName('content');
+    const overlayBottom = content.item(0)?.classList.contains('bottom-right');
+    if ((down && overlayBottom) || (up && !overlayBottom)) {
+        return;
+    }
+    isOpen = !isOpen;
+}
+</script>
+
+{#if !disabled}
+	<Overlay
+		onWindowKeyDown={handleWindowKeyDown}
+		closeOnClickOutside
+		closeOnScroll
+		bind:isOpen
+		class="w-full"
+		style="z-index:unset"
+	>
+		<div
+			slot="parent"
+			let:toggle
+			on:mousemove={() => !isOpen && toggle()}
+			on:mouseleave={onMouseLeave}
+		>
+			<slot />
+		</div>
+
+		<div slot="content" class="content" let:toggle on:mouseleave={toggle} let:close>
+			{#if Boolean(previousSchema)}
+				<PropPicker
+					props={previousSchema}
+					on:select={(event) => {
+						isOpen = false
+						dispatch('select', event.detail)
+					}}
+				/>
+			{:else}
+				<WarningMessage {close} />
+			{/if}
+		</div>
+	</Overlay>
+{:else}
+	<slot />
+{/if}
+
+<style>
+	.content {
+    width: 100%;
+    --tw-drop-shadow: drop-shadow(0 20px 13px rgb(0 0 0 / 0.03)) drop-shadow(0 8px 5px rgb(0 0 0 / 0.08));
+    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
+}</style>

package/components/propertyPicker/OverlayPropertyPicker.svelte.d.ts

@@ -0,0 +1,21 @@
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        previousSchema: Object | undefined;
+        disabled?: boolean | undefined;
+    };
+    events: {
+        select: CustomEvent<any>;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {
+        default: {};
+    };
+};
+export declare type OverlayPropertyPickerProps = typeof __propDef.props;
+export declare type OverlayPropertyPickerEvents = typeof __propDef.events;
+export declare type OverlayPropertyPickerSlots = typeof __propDef.slots;
+export default class OverlayPropertyPicker extends SvelteComponentTyped<OverlayPropertyPickerProps, OverlayPropertyPickerEvents, OverlayPropertyPickerSlots> {
+}
+export {};

package/components/propertyPicker/PropPicker.svelte

@@ -0,0 +1,24 @@
+<script>import { derived, writable } from 'svelte/store';
+import ObjectViewer from './ObjectViewer.svelte';
+import { keepByKey } from './utils';
+export let props = {};
+const EMPTY_STRING = '';
+const search = writable(EMPTY_STRING);
+$: propsFiltered = derived(search, ($search) => {
+    if ($search === EMPTY_STRING) {
+        return props;
+    }
+    return keepByKey(props, $search);
+});
+</script>
+
+<div class="relative">
+	<div class="p-3 bg-white rounded-lg border border-gray-200 shadow-md">
+		<input
+			bind:value={$search}
+			class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg block w-full p-2 mb-2"
+			placeholder="Search prop..."
+		/>
+		<ObjectViewer json={$propsFiltered} on:select />
+	</div>
+</div>

package/components/propertyPicker/PropPicker.svelte.d.ts

@@ -0,0 +1,18 @@
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        props?: Object | undefined;
+    };
+    events: {
+        select: CustomEvent<any>;
+    } & {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export declare type PropPickerProps = typeof __propDef.props;
+export declare type PropPickerEvents = typeof __propDef.events;
+export declare type PropPickerSlots = typeof __propDef.slots;
+export default class PropPicker extends SvelteComponentTyped<PropPickerProps, PropPickerEvents, PropPickerSlots> {
+}
+export {};

package/components/propertyPicker/WarningMessage.svelte

@@ -0,0 +1,43 @@
+<script>export let close;
+</script>
+
+<div class="relative">
+	<div class="p-3 bg-white rounded-lg border border-gray-200 shadow-md">
+		<div id="alert-4" class="flex p-4 bg-yellow-100 rounded-lg dark:bg-yellow-200" role="alert">
+			<svg
+				class="flex-shrink-0 w-5 h-5 text-yellow-700 dark:text-yellow-800"
+				fill="currentColor"
+				viewBox="0 0 20 20"
+				xmlns="http://www.w3.org/2000/svg"
+				><path
+					fill-rule="evenodd"
+					d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z"
+					clip-rule="evenodd"
+				/></svg
+			>
+			<div class="ml-3 text-sm font-medium text-yellow-700 dark:text-yellow-800">
+				The property picker is not available unless a preview is run on the previous step.
+			</div>
+			<button
+				type="button"
+				class="ml-auto -mx-1.5 -my-1.5 bg-yellow-100 text-yellow-500 rounded-lg focus:ring-2 focus:ring-yellow-400 p-1.5 hover:bg-yellow-200 inline-flex h-8 w-8 dark:bg-yellow-200 dark:text-yellow-600 dark:hover:bg-yellow-300"
+				data-dismiss-target="#alert-4"
+				aria-label="Close"
+				on:click={close}
+			>
+				<span class="sr-only">Close</span>
+				<svg
+					class="w-5 h-5"
+					fill="currentColor"
+					viewBox="0 0 20 20"
+					xmlns="http://www.w3.org/2000/svg"
+					><path
+						fill-rule="evenodd"
+						d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z"
+						clip-rule="evenodd"
+					/></svg
+				>
+			</button>
+		</div>
+	</div>
+</div>

package/components/propertyPicker/WarningMessage.svelte.d.ts

@@ -0,0 +1,16 @@
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        close: () => void;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export declare type WarningMessageProps = typeof __propDef.props;
+export declare type WarningMessageEvents = typeof __propDef.events;
+export declare type WarningMessageSlots = typeof __propDef.slots;
+export default class WarningMessage extends SvelteComponentTyped<WarningMessageProps, WarningMessageEvents, WarningMessageSlots> {
+}
+export {};

package/components/propertyPicker/utils.d.ts

@@ -0,0 +1,2 @@
+export declare function keepByKey(json: Object, key: string): Object;
+export declare function getTypeAsString(arg: any): string;

package/components/propertyPicker/utils.js

@@ -0,0 +1,40 @@
+function filterByKey(obj, key) {
+    if (Object(obj) !== obj) {
+        return obj;
+    }
+    else if (Array.isArray(obj)) {
+        return obj.map((o) => filterByKey(o, key));
+    }
+    else {
+        return Object.fromEntries(Object.entries(obj)
+            .filter(([k, v]) => !k.includes(key))
+            .map(([k, v]) => [k, filterByKey(v, key)]));
+    }
+}
+function diff(target, source) {
+    if (Array.isArray(target)) {
+        return target;
+    }
+    const result = {};
+    Object.keys(target).forEach((key) => {
+        if (typeof source[key] === 'object') {
+            const difference = diff(target[key], source[key]);
+            if (Object.keys(difference).length > 0) {
+                result[key] = difference;
+            }
+        }
+        else if (source[key] !== target[key]) {
+            result[key] = target[key];
+        }
+    });
+    return result;
+}
+export function keepByKey(json, key) {
+    return diff(json, filterByKey(json, key));
+}
+export function getTypeAsString(arg) {
+    if (arg === null) {
+        return 'null';
+    }
+    return typeof arg;
+}

package/gen/core/ApiError.d.ts

@@ -1,8 +1,10 @@
+import type { ApiRequestOptions } from './ApiRequestOptions';
 import type { ApiResult } from './ApiResult';
 export declare class ApiError extends Error {
     readonly url: string;
     readonly status: number;
     readonly statusText: string;
     readonly body: any;
-    constructor(response: ApiResult, message: string);
+    readonly request: ApiRequestOptions;
+    constructor(request: ApiRequestOptions, response: ApiResult, message: string);
 }