windmill-components 1.613.5 → 1.623.1

package/package/navigation.d.ts

@@ -1,2 +1,2 @@
-export declare function goto(path: string, options?: {}): any;
+export declare function goto(path: any, options?: {}): any;
 export declare function setQuery(url: URL, key: string, value: string | undefined, currentHash?: string | undefined): Promise<void>;

package/package/rawAppWmillTs.d.ts

@@ -2,14 +2,3 @@ export declare const backend: {};
 export declare const backendAsync: {};
 export declare function waitJob(jobId: string): Promise<unknown>;
 export declare function getJob(jobId: string): Promise<unknown>;
-/**
- * Stream job results using SSE. Calls onUpdate for each stream update,
- * and resolves with the final result when the job completes.
- * @param jobId - The job ID to stream
- * @param onUpdate - Callback for stream updates with new_result_stream data
- * @returns Promise that resolves with the final job result
- */
-export declare function streamJob(jobId: string, onUpdate?: (data: {
-    new_result_stream?: string;
-    stream_offset?: number;
-}) => void): Promise<any>;

package/package/rawAppWmillTs.js

@@ -26,45 +26,8 @@ export function waitJob(jobId) {
 export function getJob(jobId) {
     return doRequest('getJob', { jobId });
 }
-/**
- * Stream job results using SSE. Calls onUpdate for each stream update,
- * and resolves with the final result when the job completes.
- * @param jobId - The job ID to stream
- * @param onUpdate - Callback for stream updates with new_result_stream data
- * @returns Promise that resolves with the final job result
- */
-export function streamJob(jobId, onUpdate) {
-    return new Promise((resolve, reject) => {
-        const reqId = Math.random().toString(36);
-        reqs[reqId] = { resolve, reject, onUpdate };
-        parent.postMessage({ jobId, type: 'streamJob', reqId }, '*');
-    });
-}
 window.addEventListener('message', (e) => {
-    if (e.data.type == 'streamJobUpdate') {
-        // Handle streaming update
-        let job = reqs[e.data.reqId];
-        if (job && job.onUpdate) {
-            job.onUpdate({
-                new_result_stream: e.data.new_result_stream,
-                stream_offset: e.data.stream_offset
-            });
-        }
-    }
-    else if (e.data.type == 'streamJobRes') {
-        // Handle stream completion
-        let job = reqs[e.data.reqId];
-        if (job) {
-            if (e.data.error) {
-                job.reject(new Error(e.data.result?.stack ?? e.data.result?.message ?? 'Stream error'));
-            }
-            else {
-                job.resolve(e.data.result);
-            }
-            delete reqs[e.data.reqId];
-        }
-    }
-    else if (e.data.type == 'backendRes' || e.data.type == 'backendAsyncRes') {
+    if (e.data.type == 'backendRes' || e.data.type == 'backendAsyncRes') {
         console.log('Message from parent backend', e.data);
         let job = reqs[e.data.reqId];
         if (job) {

package/package/svelte5Utils.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { StateStore } from './utils';
+import { type StateStore } from './utils';
 export declare function withProps<Component, Props>(component: Component, props: Props): {
     component: Component;
     props: Props;
@@ -69,9 +69,3 @@ export declare class ChangeOnDeepInequality<T> {
     constructor(compute: () => T);
     get value(): T;
 }
-export declare class StaleWhileLoading<T> {
-    private _current;
-    private _currentTimeout;
-    constructor(getter: () => T, timeout?: number);
-    get current(): T | undefined;
-}

package/package/svelte5Utils.svelte.js

@@ -1,7 +1,8 @@
 // https://github.com/sveltejs/svelte/issues/14600
 import { untrack } from 'svelte';
 import { deepEqual } from 'fast-equals';
-import { resource, watch } from 'runed';
+import {} from './utils';
+import { resource } from 'runed';
 export function withProps(component, props) {
     const ret = $state({
         component,
@@ -146,25 +147,3 @@ export class ChangeOnDeepInequality {
         return this._cached;
     }
 }
-// Prevents flickering when data is unloaded (undefined) then reloaded quickly
-// But still becomes undefined if data is not reloaded within the timeout
-// so the user has feedback that the data is not available anymore.
-export class StaleWhileLoading {
-    _current = $state();
-    _currentTimeout;
-    constructor(getter, timeout = 400) {
-        watch(getter, (value) => {
-            if (this._currentTimeout)
-                clearTimeout(this._currentTimeout);
-            if (value === undefined) {
-                this._currentTimeout = setTimeout(() => (this._current = undefined), timeout);
-            }
-            else {
-                this._current = value;
-            }
-        });
-    }
-    get current() {
-        return this._current;
-    }
-}

package/package/tutorialUtils.js

@@ -60,6 +60,10 @@ export async function skipAllTodos() {
     }
     tutorialsToDo.set([]);
     skippedAll.set(true);
+    // Dismiss the tutorial banner when all tutorials are skipped
+    if (typeof window !== 'undefined') {
+        localStorage.setItem(TUTORIAL_BANNER_DISMISSED_KEY, 'true');
+    }
     await UserService.updateTutorialProgress({ requestBody: { progress: bits, skipped_all: true } });
 }
 export async function resetAllTodos() {

package/package/tutorials/config.js

@@ -1,4 +1,4 @@
-import { Workflow, GraduationCap, Wrench, PlayCircle, Link2, History } from 'lucide-svelte';
+import { Workflow, GraduationCap, Wrench, PlayCircle, Link2 } from 'lucide-svelte';
 import { base } from '../base';
 /**
  * Get tutorial index from config by tutorial ID.
@@ -16,7 +16,7 @@ export function getTutorialIndex(id) {
 export const TUTORIALS_CONFIG = {
     quickstart: {
         label: 'Quickstart',
-        roles: ['admin', 'developer', 'operator'],
+        roles: ['admin', 'developer'],
         progressBar: true,
         active: true,
         tutorials: [
@@ -61,35 +61,7 @@ export const TUTORIALS_CONFIG = {
                 comingSoon: false,
                 roles: ['admin', 'developer'],
                 order: 3
-            },
-            {
-                id: 'runs-tutorial',
-                icon: History,
-                title: 'Discover your monitoring dashboard',
-                description: 'Learn how to monitor, filter, and manage your script and flow executions.',
-                onClick: () => {
-                    window.location.href = `${base}/runs?tutorial=runs-tutorial`;
-                },
-                index: 7,
-                active: true,
-                comingSoon: false,
-                roles: ['admin', 'developer', 'operator'],
-                order: 4
-            },
-            {
-                id: 'workspace-onboarding-operator',
-                icon: GraduationCap,
-                title: 'Workspace onboarding',
-                description: 'Discover the basics of Windmill with a quick tour of the workspace.',
-                onClick: () => {
-                    window.location.href = `${base}/?tutorial=workspace-onboarding-operator`;
-                },
-                index: 6,
-                active: true,
-                comingSoon: false,
-                roles: ['operator'],
-                order: 1
-            },
+            }
         ]
     },
     app_editor: {

package/package/tutorials/roleUtils.d.ts

@@ -15,6 +15,6 @@ export declare function hasRoleAccess(user: UserExt | null | undefined, roles?:
 /**
  * Check if a preview role has access based on a roles array.
  * Used by admins to preview what other roles can see.
- * Uses exact role matching - only shows tutorials explicitly marked for the preview role.
+ * This is a convenience wrapper around hasRoleAccess for preview mode.
  */
 export declare function hasRoleAccessForPreview(previewRole: Role, roles?: Role[]): boolean;

package/package/tutorials/roleUtils.js

@@ -45,12 +45,8 @@ export function hasRoleAccess(user, roles, previewRole) {
 /**
  * Check if a preview role has access based on a roles array.
  * Used by admins to preview what other roles can see.
- * Uses exact role matching - only shows tutorials explicitly marked for the preview role.
+ * This is a convenience wrapper around hasRoleAccess for preview mode.
  */
 export function hasRoleAccessForPreview(previewRole, roles) {
-    // No roles specified = available to everyone
-    if (!roles || roles.length === 0)
-        return true;
-    // Exact role match - tutorial must explicitly include the preview role
-    return roles.includes(previewRole);
+    return hasRoleAccess(null, roles, previewRole);
 }

package/package/utils.js

@@ -678,7 +678,7 @@ export function pluralize(quantity, word, customPlural) {
         return `${quantity} ${word}`;
     }
     else if (customPlural) {
-        return `${quantity} ${customPlural}`;
+        return `${quantity} ${customPlural}}`;
     }
     else {
         return `${quantity} ${word}s`;
@@ -730,134 +730,6 @@ export function getModifierKey() {
 export function isValidHexColor(color) {
     return /^#(([A-F0-9]{2}){3,4}|[A-F0-9]{3})$/i.test(color);
 }
-/**
- * Calculates the relative luminance of a color according to WCAG 2.1
- * @param r Red component (0-255)
- * @param g Green component (0-255)
- * @param b Blue component (0-255)
- * @returns Relative luminance value (0-1)
- */
-function getRelativeLuminance(r, g, b) {
-    const [rs, gs, bs] = [r, g, b].map((val) => {
-        val = val / 255;
-        return val <= 0.03928 ? val / 12.92 : Math.pow((val + 0.055) / 1.055, 2.4);
-    });
-    return 0.2126 * rs + 0.7152 * gs + 0.0722 * bs;
-}
-/**
- * Converts hex color to HSL
- * @param hex Hex color string (e.g., "#FF0000")
- * @returns Array of [hue (0-360), saturation (0-100), lightness (0-100)]
- */
-function hexToHsl(hex) {
-    // Normalize hex color
-    let normalizedHex = hex.replace('#', '');
-    if (normalizedHex.length === 3) {
-        normalizedHex = normalizedHex
-            .split('')
-            .map((char) => char + char)
-            .join('');
-    }
-    const r = parseInt(normalizedHex.substring(0, 2), 16) / 255;
-    const g = parseInt(normalizedHex.substring(2, 4), 16) / 255;
-    const b = parseInt(normalizedHex.substring(4, 6), 16) / 255;
-    const max = Math.max(r, g, b);
-    const min = Math.min(r, g, b);
-    let h = 0;
-    let s = 0;
-    const l = (max + min) / 2;
-    if (max !== min) {
-        const d = max - min;
-        s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
-        switch (max) {
-            case r:
-                h = ((g - b) / d + (g < b ? 6 : 0)) / 6;
-                break;
-            case g:
-                h = ((b - r) / d + 2) / 6;
-                break;
-            case b:
-                h = ((r - g) / d + 4) / 6;
-                break;
-        }
-    }
-    return [h * 360, s * 100, l * 100];
-}
-/**
- * Converts HSL to hex color
- * @param h Hue (0-360)
- * @param s Saturation (0-100)
- * @param l Lightness (0-100)
- * @returns Hex color string
- */
-function hslToHex(h, s, l) {
-    h = h / 360;
-    s = s / 100;
-    l = l / 100;
-    let r, g, b;
-    if (s === 0) {
-        r = g = b = l; // Achromatic
-    }
-    else {
-        const hue2rgb = (p, q, t) => {
-            if (t < 0)
-                t += 1;
-            if (t > 1)
-                t -= 1;
-            if (t < 1 / 6)
-                return p + (q - p) * 6 * t;
-            if (t < 1 / 2)
-                return q;
-            if (t < 2 / 3)
-                return p + (q - p) * (2 / 3 - t) * 6;
-            return p;
-        };
-        const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
-        const p = 2 * l - q;
-        r = hue2rgb(p, q, h + 1 / 3);
-        g = hue2rgb(p, q, h);
-        b = hue2rgb(p, q, h - 1 / 3);
-    }
-    const toHex = (c) => {
-        const hex = Math.round(c * 255).toString(16);
-        return hex.length === 1 ? '0' + hex : hex;
-    };
-    return `#${toHex(r)}${toHex(g)}${toHex(b)}`;
-}
-/**
- * Generates a text color with the same hue as the background but adjusted lightness for good contrast
- * @param backgroundColor Hex color string (e.g., "#FF0000" or "#F00")
- * @returns Hex color string with same hue but good contrast, or undefined if invalid
- */
-export function getContrastTextColor(backgroundColor) {
-    if (!backgroundColor || !isValidHexColor(backgroundColor)) {
-        return undefined;
-    }
-    // Normalize hex color
-    let hex = backgroundColor.replace('#', '');
-    if (hex.length === 3) {
-        hex = hex
-            .split('')
-            .map((char) => char + char)
-            .join('');
-    }
-    // Parse RGB components and calculate background luminance
-    const r = parseInt(hex.substring(0, 2), 16);
-    const g = parseInt(hex.substring(2, 4), 16);
-    const b = parseInt(hex.substring(4, 6), 16);
-    const bgLuminance = getRelativeLuminance(r, g, b);
-    // Convert to HSL to extract hue
-    const [hue] = hexToHsl(backgroundColor);
-    // Determine if background is light or dark
-    const isLightBackground = bgLuminance > 0.5;
-    // Use fixed saturation and lightness based on background lightness
-    // For light backgrounds: use dark text (low lightness, high saturation)
-    // For dark backgrounds: use light text (high lightness, high saturation)
-    const saturation = 70; // Fixed saturation for good readability
-    const lightness = isLightBackground ? 25 : 85; // Dark for light bg, light for dark bg
-    // Generate the color with the same hue but adjusted saturation and lightness
-    return hslToHex(hue, saturation, lightness);
-}
 export function sortObject(o) {
     return Object.keys(o)
         .sort()
@@ -1642,33 +1514,3 @@ export function getQueryStmtCountHeuristic(query) {
     }
     return count;
 }
-export function countChars(str, char) {
-    let count = 0;
-    for (let i = 0; i < str.length; i++) {
-        if (str[i] === char) {
-            count++;
-        }
-    }
-    return count;
-}
-export function buildReactiveObj(fields) {
-    const obj = {};
-    for (const key in fields) {
-        Object.defineProperty(obj, key, {
-            get: fields[key][0],
-            set: fields[key][1],
-            enumerable: true,
-            configurable: true
-        });
-    }
-    return obj;
-}
-export function pick(obj, keys) {
-    const result = {};
-    for (const key of keys) {
-        if (key in obj) {
-            result[key] = obj[key];
-        }
-    }
-    return result;
-}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "windmill-components",
-	"version": "1.613.5",
+	"version": "1.623.1",
 	"scripts": {
 		"dev": "vite dev",
 		"build": "vite build",
@@ -15,16 +15,16 @@
 		"generate-backend-client": "openapi-ts --input ../backend/windmill-api/openapi.yaml --output ./src/lib/gen --useOptions --enums javascript --format false",
 		"generate-backend-client-mac": "openapi-ts --input ../backend/windmill-api/openapi.yaml --output ./src/lib/gen --useOptions --enums javascript",
 		"pretest": "tsc --incremental -p tests/tsconfig.json",
-		"test": "playwright test --config=tests-out/playwright.config.js && npm run test:unit -- --run",
 		"filter-classes": "node filterTailwindClasses.js",
-		"test:unit": "vitest"
+		"test:unit": "vitest",
+		"test:e2e": "playwright test"
 	},
 	"devDependencies": {
 		"@floating-ui/core": "^1.3.1",
 		"@hey-api/openapi-ts": "^0.43.0",
 		"@melt-ui/pp": "^0.3.2",
 		"@melt-ui/svelte": "^0.86.2",
-		"@playwright/test": "^1.34.3",
+		"@playwright/test": "^1.57.0",
 		"@sveltejs/adapter-static": "^3.0.6",
 		"@sveltejs/kit": "^2.49.2",
 		"@sveltejs/package": "^2.3.7",
@@ -38,7 +38,6 @@
 		"@types/vscode": "^1.83.5",
 		"@typescript-eslint/eslint-plugin": "^5.59.8",
 		"@typescript-eslint/parser": "^5.60.0",
-		"@vitest/browser-playwright": "^4.0.10",
 		"@zerodevx/svelte-toast": "^0.9.6",
 		"autoprefixer": "^10.4.13",
 		"cssnano": "^6.0.1",
@@ -50,7 +49,6 @@
 		"json-refs": "^3.0.15",
 		"json-schema-to-zod": "^2.7.0",
 		"path-browserify": "^1.0.1",
-		"playwright": "^1.56.1",
 		"postcss": "^8.4.49",
 		"postcss-load-config": "^4.0.1",
 		"prettier": "^3.1.0",

package/dist/sharedUtils/assets/tokens/colorTokensConfig.d.ts

@@ -1,2 +0,0 @@
-export declare const lightModeName: "light";
-export declare const darkModeName: "dark-3";

package/dist/sharedUtils/base.d.ts

@@ -1 +0,0 @@
-export declare let base: string;

package/dist/sharedUtils/cloud.d.ts

@@ -1 +0,0 @@
-export declare function isCloudHosted(): boolean;

package/dist/sharedUtils/common.d.ts

@@ -1,111 +0,0 @@
-import type { Script, ScriptLang } from './gen';
-export type OwnerKind = 'group' | 'user' | 'folder';
-export type ActionKind = 'Create' | 'Update' | 'Delete' | 'Execute';
-export type SupportedLanguage = Script['language'];
-export interface PropertyDisplayInfo {
-    property: SchemaProperty;
-    name: string;
-    isRequired: boolean;
-    path: string[];
-    index: number;
-    propertiesNumber: number;
-}
-export type EnumType = string[] | {
-    value: string;
-    label: string;
-}[] | undefined;
-export interface SchemaProperty {
-    type: string | undefined;
-    description?: string;
-    pattern?: string;
-    default?: any;
-    enum?: EnumType;
-    contentEncoding?: 'base64' | 'binary';
-    format?: string;
-    items?: {
-        type?: 'string' | 'number' | 'bytes' | 'object' | 'resource';
-        contentEncoding?: 'base64';
-        enum?: string[];
-        resourceType?: string;
-        properties?: {
-            [name: string]: SchemaProperty;
-        };
-        required?: string[];
-    };
-    min?: number;
-    max?: number;
-    currency?: string;
-    currencyLocale?: string;
-    multiselect?: boolean;
-    customErrorMessage?: string;
-    properties?: {
-        [name: string]: SchemaProperty;
-    };
-    required?: string[];
-    showExpr?: string;
-    hideWhenChatEnabled?: boolean;
-    password?: boolean;
-    order?: string[];
-    nullable?: boolean;
-    dateFormat?: string;
-    title?: string;
-    placeholder?: string;
-    oneOf?: SchemaProperty[];
-    originalType?: string;
-    disabled?: boolean;
-    'x-no-s3-storage-workspace-warning'?: string;
-    'x-auto-generate'?: boolean;
-}
-export interface ModalSchemaProperty {
-    selectedType?: string;
-    description: string;
-    name: string;
-    required: boolean;
-    min?: number;
-    max?: number;
-    currency?: string;
-    currencyLocale?: string;
-    multiselect?: boolean;
-    format?: string;
-    pattern?: string;
-    enum_?: EnumType;
-    default?: any;
-    items?: {
-        type?: 'string' | 'number';
-        enum?: string[];
-    };
-    contentEncoding?: 'base64' | 'binary';
-    schema?: Schema;
-    customErrorMessage?: string;
-    showExpr?: string;
-    password?: boolean;
-    nullable?: boolean;
-    dateFormat?: string;
-    title?: string;
-    placeholder?: string;
-    oneOf?: SchemaProperty[];
-}
-export declare function modalToSchema(schema: ModalSchemaProperty): SchemaProperty;
-export type Schema = {
-    $schema: string | undefined;
-    type: string;
-    'x-windmill-dyn-select-code'?: string;
-    'x-windmill-dyn-select-lang'?: ScriptLang;
-    properties: {
-        [name: string]: SchemaProperty;
-    };
-    order?: string[];
-    required: string[];
-};
-export declare function mergeSchema(schema: Schema | Record<string, any>, enum_payload?: Record<string, any>): Schema | Record<string, any>;
-export type Meta = {
-    ownerKind: OwnerKind;
-    owner: string;
-    name: string;
-};
-type Enumerate<N extends number, Acc extends number[] = []> = Acc['length'] extends N ? Acc[number] : Enumerate<N, [...Acc, Acc['length']]>;
-/** An inclusive range of integer numbers */
-export type IntRange<F extends number, T extends number> = F | Exclude<Enumerate<T>, Enumerate<F>> | T;
-export declare function pathToMeta(path: string, hideUser: boolean): Meta;
-export declare function prettyLanguage(lang: string): string;
-export {};

package/dist/sharedUtils/components/apps/components/display/dbtable/queries/count.d.ts

@@ -1,5 +0,0 @@
-import type { AppInput } from '$lib/components/apps/inputType';
-import type { DbType, DbInput } from '$lib/components/dbTypes';
-import { type ColumnDef } from '../utils';
-export declare function makeCountQuery(dbType: DbType, table: string, whereClause: string | undefined, columnDefs: ColumnDef[]): string;
-export declare function getCountInput(dbInput: DbInput, table: string, columnDefs: ColumnDef[], whereClause: string | undefined): AppInput | undefined;

package/dist/sharedUtils/components/apps/components/display/dbtable/queries/delete.d.ts

@@ -1,5 +0,0 @@
-import type { AppInput } from '$lib/components/apps/inputType';
-import type { DbType, DbInput } from '$lib/components/dbTypes';
-import { type ColumnDef } from '../utils';
-export declare function makeDeleteQuery(table: string, columns: ColumnDef[], dbType: DbType): string;
-export declare function getDeleteInput(dbInput: DbInput, table: string, columns: ColumnDef[]): AppInput | undefined;

package/dist/sharedUtils/components/apps/components/display/dbtable/queries/insert.d.ts

@@ -1,5 +0,0 @@
-import type { AppInput } from '$lib/components/apps/inputType';
-import type { DbType, DbInput } from '$lib/components/dbTypes';
-import { type ColumnDef } from '../utils';
-export declare function makeInsertQuery(table: string, columns: ColumnDef[], dbType: DbType): string;
-export declare function getInsertInput(dbInput: DbInput, table: string, columns: ColumnDef[]): AppInput;

package/dist/sharedUtils/components/apps/components/display/dbtable/queries/select.d.ts

@@ -1,13 +0,0 @@
-import type { AppInput } from '$lib/components/apps/inputType';
-import type { DbType, DbInput } from '$lib/components/dbTypes';
-import { type ColumnDef } from '../utils';
-export declare function makeSelectQuery(table: string, columnDefs: ColumnDef[], whereClause: string | undefined, dbType: DbType, options?: {
-    limit?: number;
-    offset?: number;
-}, breakingFeatures?: {
-    fixPgIntTypes?: boolean;
-}): string;
-export declare function getSelectInput(dbInput: DbInput, table: string | undefined, columnDefs: ColumnDef[], whereClause: string | undefined, options?: {
-    limit?: number;
-    offset?: number;
-}): AppInput | undefined;

package/dist/sharedUtils/components/apps/components/display/dbtable/queries/update.d.ts

@@ -1,11 +0,0 @@
-import type { AppInput } from '$lib/components/apps/inputType';
-import type { DbInput, DbType } from '$lib/components/dbTypes';
-import { type ColumnDef } from '../utils';
-export declare function makeUpdateQuery(table: string, column: {
-    datatype: string;
-    field: string;
-}, columns: {
-    datatype: string;
-    field: string;
-}[], dbType: DbType): string;
-export declare function getUpdateInput(dbInput: DbInput, table: string, column: ColumnDef, columns: ColumnDef[]): AppInput | undefined;