@flowdrop/flowdrop 1.15.0 → 2.0.0-beta.2

package/dist/services/workflowStorage.js

@@ -20,10 +20,10 @@ export async function saveWorkflow(workflow) {
         ...workflow,
         id,
         metadata: {
-            version: '1.0.0',
-            createdAt: new Date().toISOString(),
-            updatedAt: new Date().toISOString(),
-            ...workflow.metadata
+            ...workflow.metadata,
+            schemaVersion: workflow.metadata?.schemaVersion ?? '1.0.0',
+            createdAt: workflow.metadata?.createdAt ?? new Date().toISOString(),
+            updatedAt: workflow.metadata?.updatedAt ?? new Date().toISOString()
         }
     };
     workflows.set(id, newWorkflow);
@@ -42,7 +42,7 @@ export async function updateWorkflow(id, workflow) {
         ...workflow,
         id, // Ensure ID doesn't change
         metadata: {
-            version: existing.metadata?.version || '1.0.0',
+            schemaVersion: existing.metadata?.schemaVersion || '1.0.0',
             createdAt: existing.metadata?.createdAt || new Date().toISOString(),
             updatedAt: new Date().toISOString(),
             author: workflow.metadata?.author || existing.metadata?.author,
@@ -105,7 +105,7 @@ export async function initializeSampleWorkflows() {
         nodes: [],
         edges: [],
         metadata: {
-            version: '1.0.0',
+            schemaVersion: '1.0.0',
             createdAt: new Date().toISOString(),
             updatedAt: new Date().toISOString(),
             author: 'System',

package/dist/stores/apiContext.d.ts

@@ -0,0 +1,56 @@
+/**
+ * Per-instance API context for FlowDrop.
+ *
+ * Holds the endpoint configuration and auth provider for one FlowDrop
+ * instance and lazily exposes an {@link EnhancedFlowDropApiClient} built from
+ * them. Replaces the former module-level singleton in `services/api.ts`:
+ * each instance owns its own configuration so multiple editors can talk to
+ * different backends on a single page.
+ *
+ * Resolved in components via `getInstance().api`; configured at mount time by
+ * `mountFlowDropApp` / `mountPlayground` (or `<App>` when used directly).
+ *
+ * @module stores/apiContext
+ */
+import type { EndpointConfig } from '../config/endpoints.js';
+import type { AuthProvider } from '../types/auth.js';
+import { EnhancedFlowDropApiClient } from '../api/enhanced-client.js';
+/**
+ * Per-instance endpoint configuration, auth provider, and API client.
+ *
+ * The config is `null` until {@link configure} is called — mirroring the
+ * legacy "throws if not configured" contract. The client is created lazily on
+ * first access and rebuilt whenever the configuration changes.
+ */
+export declare class ApiContext {
+    #private;
+    /** The current endpoint configuration, or null until {@link configure}d. */
+    get config(): EndpointConfig | null;
+    /** The current auth provider (defaults to {@link NoAuthProvider}). */
+    get authProvider(): AuthProvider;
+    /**
+     * The API client for this instance, created lazily from the configured
+     * endpoints and auth provider.
+     *
+     * @throws Error if the context has not been configured yet.
+     */
+    get client(): EnhancedFlowDropApiClient;
+    /**
+     * Configure this instance's endpoints and (optionally) auth provider.
+     * Discards any previously built client so the next access rebuilds it.
+     */
+    configure(config: EndpointConfig, authProvider?: AuthProvider): void;
+    /**
+     * Swap the auth provider at runtime — e.g. on login or logout — without
+     * reconfiguring endpoints or remounting. Propagates to the live client so
+     * in-flight components keep working against the same instance.
+     *
+     * Per-instance services read `fd.api.authProvider` per request, so they pick
+     * up the new provider on their next call automatically.
+     *
+     * @param authProvider - The new authentication provider
+     */
+    setAuthProvider(authProvider: AuthProvider): void;
+    /** Whether {@link configure} has been called with a usable config. */
+    isConfigured(): boolean;
+}

package/dist/stores/apiContext.js

@@ -0,0 +1,80 @@
+/**
+ * Per-instance API context for FlowDrop.
+ *
+ * Holds the endpoint configuration and auth provider for one FlowDrop
+ * instance and lazily exposes an {@link EnhancedFlowDropApiClient} built from
+ * them. Replaces the former module-level singleton in `services/api.ts`:
+ * each instance owns its own configuration so multiple editors can talk to
+ * different backends on a single page.
+ *
+ * Resolved in components via `getInstance().api`; configured at mount time by
+ * `mountFlowDropApp` / `mountPlayground` (or `<App>` when used directly).
+ *
+ * @module stores/apiContext
+ */
+import { NoAuthProvider } from '../types/auth.js';
+import { EnhancedFlowDropApiClient } from '../api/enhanced-client.js';
+/**
+ * Per-instance endpoint configuration, auth provider, and API client.
+ *
+ * The config is `null` until {@link configure} is called — mirroring the
+ * legacy "throws if not configured" contract. The client is created lazily on
+ * first access and rebuilt whenever the configuration changes.
+ */
+export class ApiContext {
+    #config = null;
+    #authProvider = new NoAuthProvider();
+    #client = null;
+    /** The current endpoint configuration, or null until {@link configure}d. */
+    get config() {
+        return this.#config;
+    }
+    /** The current auth provider (defaults to {@link NoAuthProvider}). */
+    get authProvider() {
+        return this.#authProvider;
+    }
+    /**
+     * The API client for this instance, created lazily from the configured
+     * endpoints and auth provider.
+     *
+     * @throws Error if the context has not been configured yet.
+     */
+    get client() {
+        if (!this.#config) {
+            throw new Error('Endpoint configuration not set. Configure the instance via fd.api.configure() ' +
+                '(done automatically by mountFlowDropApp / <App>) before using fd.api.client.');
+        }
+        return (this.#client ??= new EnhancedFlowDropApiClient(this.#config, this.#authProvider));
+    }
+    /**
+     * Configure this instance's endpoints and (optionally) auth provider.
+     * Discards any previously built client so the next access rebuilds it.
+     */
+    configure(config, authProvider) {
+        this.#config = config;
+        if (authProvider) {
+            this.#authProvider = authProvider;
+        }
+        // Drop the cached client so it picks up the new config/auth on next access.
+        this.#client = null;
+    }
+    /**
+     * Swap the auth provider at runtime — e.g. on login or logout — without
+     * reconfiguring endpoints or remounting. Propagates to the live client so
+     * in-flight components keep working against the same instance.
+     *
+     * Per-instance services read `fd.api.authProvider` per request, so they pick
+     * up the new provider on their next call automatically.
+     *
+     * @param authProvider - The new authentication provider
+     */
+    setAuthProvider(authProvider) {
+        this.#authProvider = authProvider;
+        // Keep the cached client (and its in-flight consumers) in sync.
+        this.#client?.setAuthProvider(authProvider);
+    }
+    /** Whether {@link configure} has been called with a usable config. */
+    isConfigured() {
+        return Boolean(this.#config);
+    }
+}

package/dist/stores/categoriesStore.svelte.d.ts

@@ -3,30 +3,35 @@
  *
  * Manages category definitions with merged defaults and API-provided overrides.
  * Exposes lookup helpers for icon, color, and label resolution.
+ *
+ * The reactive state lives in the {@link CategoriesStore} class — one per
+ * FlowDrop instance, resolved in components via `getInstance().categories`.
+ *
+ * @module stores/categoriesStore
  */
 import type { CategoryDefinition, NodeCategory } from '../types/index.js';
 /**
- * Get all category definitions, sorted by weight.
- */
-export declare function getCategories(): CategoryDefinition[];
-/**
- * Initialize categories with API data, merging with defaults.
- * API categories override defaults by name; custom categories are appended.
- */
-export declare function initializeCategories(apiCategories: CategoryDefinition[]): void;
-/**
- * Get the display label for a category.
- */
-export declare function getCategoryLabel(category: NodeCategory): string;
-/**
- * Get the icon for a category.
- */
-export declare function getCategoryIcon(category: NodeCategory): string;
-/**
- * Get the color token for a category.
- */
-export declare function getCategoryColor(category: NodeCategory): string;
-/**
- * Get the full category definition, or undefined if not found.
+ * Per-instance category definitions with a derived name→definition lookup.
+ *
+ * Reads go through getters backed by `$state`/`$derived`, so they track
+ * reactively in templates and `$derived`, exactly like the legacy
+ * module-level functions did.
  */
-export declare function getCategoryDefinition(category: NodeCategory): CategoryDefinition | undefined;
+export declare class CategoriesStore {
+    #private;
+    /** All category definitions, sorted by weight (reactive). */
+    get categories(): CategoryDefinition[];
+    /**
+     * Initialize categories with API data, merging with defaults.
+     * API categories override defaults by name; custom categories are appended.
+     */
+    initialize(apiCategories: CategoryDefinition[]): void;
+    /** Get the display label for a category. */
+    getLabel(category: NodeCategory): string;
+    /** Get the icon for a category. */
+    getIcon(category: NodeCategory): string;
+    /** Get the color token for a category. */
+    getColor(category: NodeCategory): string;
+    /** Get the full category definition, or undefined if not found. */
+    getDefinition(category: NodeCategory): CategoryDefinition | undefined;
+}

package/dist/stores/categoriesStore.svelte.js

@@ -3,75 +3,80 @@
  *
  * Manages category definitions with merged defaults and API-provided overrides.
  * Exposes lookup helpers for icon, color, and label resolution.
+ *
+ * The reactive state lives in the {@link CategoriesStore} class — one per
+ * FlowDrop instance, resolved in components via `getInstance().categories`.
+ *
+ * @module stores/categoriesStore
  */
 import { DEFAULT_CATEGORIES } from '../config/defaultCategories.js';
+// =========================================================================
+// CategoriesStore (per-instance reactive state)
+// =========================================================================
 /**
- * Internal reactive state holding the category definitions.
- * Initialized with defaults, updated when API data is fetched.
- */
-let categoriesState = $state([...DEFAULT_CATEGORIES]);
-/**
- * Derived lookup map: category name → CategoryDefinition
+ * Per-instance category definitions with a derived name→definition lookup.
+ *
+ * Reads go through getters backed by `$state`/`$derived`, so they track
+ * reactively in templates and `$derived`, exactly like the legacy
+ * module-level functions did.
  */
-let categoryMap = $derived((() => {
-    const map = new Map();
-    for (const cat of categoriesState) {
-        map.set(cat.name, cat);
+export class CategoriesStore {
+    /**
+     * Reactive state holding the category definitions.
+     * Initialized with defaults, updated when API data is fetched.
+     */
+    #categories = $state([...DEFAULT_CATEGORIES]);
+    /** Derived lookup map: category name → CategoryDefinition. */
+    #categoryMap = $derived((() => {
+        const map = new Map();
+        for (const cat of this.#categories) {
+            map.set(cat.name, cat);
+        }
+        return map;
+    })());
+    /** All category definitions, sorted by weight (reactive). */
+    get categories() {
+        return [...this.#categories].sort((a, b) => (a.weight ?? 999) - (b.weight ?? 999));
     }
-    return map;
-})());
-/**
- * Get all category definitions, sorted by weight.
- */
-export function getCategories() {
-    return [...categoriesState].sort((a, b) => (a.weight ?? 999) - (b.weight ?? 999));
-}
-/**
- * Initialize categories with API data, merging with defaults.
- * API categories override defaults by name; custom categories are appended.
- */
-export function initializeCategories(apiCategories) {
-    const defaultMap = new Map();
-    for (const cat of DEFAULT_CATEGORIES) {
-        defaultMap.set(cat.name, cat);
+    /**
+     * Initialize categories with API data, merging with defaults.
+     * API categories override defaults by name; custom categories are appended.
+     */
+    initialize(apiCategories) {
+        const defaultMap = new Map();
+        for (const cat of DEFAULT_CATEGORIES) {
+            defaultMap.set(cat.name, cat);
+        }
+        // API categories override defaults by name
+        for (const cat of apiCategories) {
+            defaultMap.set(cat.name, {
+                ...defaultMap.get(cat.name),
+                ...cat
+            });
+        }
+        this.#categories = Array.from(defaultMap.values());
     }
-    // API categories override defaults by name
-    for (const cat of apiCategories) {
-        defaultMap.set(cat.name, {
-            ...defaultMap.get(cat.name),
-            ...cat
-        });
+    /** Get the display label for a category. */
+    getLabel(category) {
+        const def = this.#categoryMap.get(category);
+        if (def?.label)
+            return def.label;
+        // Auto-generate: capitalize each word
+        return category
+            .split(/[\s_-]+/)
+            .map((word) => word.charAt(0).toUpperCase() + word.slice(1))
+            .join(' ');
+    }
+    /** Get the icon for a category. */
+    getIcon(category) {
+        return this.#categoryMap.get(category)?.icon ?? 'mdi:folder';
+    }
+    /** Get the color token for a category. */
+    getColor(category) {
+        return this.#categoryMap.get(category)?.color ?? 'var(--fd-node-slate)';
+    }
+    /** Get the full category definition, or undefined if not found. */
+    getDefinition(category) {
+        return this.#categoryMap.get(category);
     }
-    categoriesState = Array.from(defaultMap.values());
-}
-/**
- * Get the display label for a category.
- */
-export function getCategoryLabel(category) {
-    const def = categoryMap.get(category);
-    if (def?.label)
-        return def.label;
-    // Auto-generate: capitalize each word
-    return category
-        .split(/[\s_-]+/)
-        .map((word) => word.charAt(0).toUpperCase() + word.slice(1))
-        .join(' ');
-}
-/**
- * Get the icon for a category.
- */
-export function getCategoryIcon(category) {
-    return categoryMap.get(category)?.icon ?? 'mdi:folder';
-}
-/**
- * Get the color token for a category.
- */
-export function getCategoryColor(category) {
-    return categoryMap.get(category)?.color ?? 'var(--fd-node-slate)';
-}
-/**
- * Get the full category definition, or undefined if not found.
- */
-export function getCategoryDefinition(category) {
-    return categoryMap.get(category);
 }

package/dist/stores/getInstance.svelte.d.ts

@@ -0,0 +1,39 @@
+/**
+ * Per-component access to the FlowDrop instance container.
+ *
+ * Components call `getInstance()` during init to resolve the instance
+ * provided by the nearest `<App>` / `<WorkflowEditor>` via Svelte context.
+ * When no provider exists (legacy single-instance usage), it falls back to
+ * the browser-only default instance.
+ *
+ * @module stores/getInstance
+ */
+import { type FlowDropInstance } from './instanceContainer.svelte.js';
+/**
+ * Context key under which the FlowDrop instance is provided.
+ * A Symbol (matching `messages/context.ts`) so consumer context can't collide.
+ */
+export declare const FLOWDROP_INSTANCE_KEY: unique symbol;
+/**
+ * Resolve the FlowDrop instance for the current component tree.
+ *
+ * Must be called during component initialisation (it reads Svelte context).
+ *
+ * Unlike the messages-context fallback (immutable defaults, silent), this
+ * fallback hands out *mutable shared state*, so it warns once in dev and
+ * throws during SSR rather than leaking state across server requests.
+ */
+export declare function getInstance(): FlowDropInstance;
+/**
+ * Resolve and provide the FlowDrop instance for a provider component
+ * (`<App>`, `<WorkflowEditor>`, `<Playground>`, `<PlaygroundStudio>`).
+ *
+ * Must be called during component initialisation. Resolution order:
+ * 1. An explicitly passed instance (from a mount function or consumer)
+ * 2. An instance already in context (provider nested inside another provider)
+ * 3. Browser: the page-default instance (legacy single-instance behavior)
+ *    Server: a fresh per-render instance (no cross-request leakage)
+ *
+ * The resolved instance is (re-)provided via context for all children.
+ */
+export declare function provideInstance(explicit?: FlowDropInstance): FlowDropInstance;

package/dist/stores/getInstance.svelte.js

@@ -0,0 +1,65 @@
+/**
+ * Per-component access to the FlowDrop instance container.
+ *
+ * Components call `getInstance()` during init to resolve the instance
+ * provided by the nearest `<App>` / `<WorkflowEditor>` via Svelte context.
+ * When no provider exists (legacy single-instance usage), it falls back to
+ * the browser-only default instance.
+ *
+ * @module stores/getInstance
+ */
+import { DEV } from 'esm-env';
+import { getContext, setContext } from 'svelte';
+import { createFlowDropInstance, getDefaultInstance } from './instanceContainer.svelte.js';
+/**
+ * Context key under which the FlowDrop instance is provided.
+ * A Symbol (matching `messages/context.ts`) so consumer context can't collide.
+ */
+export const FLOWDROP_INSTANCE_KEY = Symbol('flowdrop.instance');
+let warnedAboutFallback = false;
+/**
+ * Resolve the FlowDrop instance for the current component tree.
+ *
+ * Must be called during component initialisation (it reads Svelte context).
+ *
+ * Unlike the messages-context fallback (immutable defaults, silent), this
+ * fallback hands out *mutable shared state*, so it warns once in dev and
+ * throws during SSR rather than leaking state across server requests.
+ */
+export function getInstance() {
+    const instance = getContext(FLOWDROP_INSTANCE_KEY);
+    if (instance) {
+        return instance;
+    }
+    if (typeof window === 'undefined') {
+        throw new Error('[flowdrop] No FlowDrop instance in context during SSR. Render inside ' +
+            '<App> or <WorkflowEditor> (which set context), or provide one with ' +
+            'setContext(FLOWDROP_INSTANCE_KEY, createFlowDropInstance()).');
+    }
+    if (DEV && !warnedAboutFallback) {
+        warnedAboutFallback = true;
+        // eslint-disable-next-line no-console -- intentional one-time dev diagnostic for silent shared-state fallback
+        console.warn('[flowdrop] getInstance() fell back to the page-default instance — ' +
+            'fine for a single editor, but two editors mounted this way will share state.');
+    }
+    return getDefaultInstance();
+}
+/**
+ * Resolve and provide the FlowDrop instance for a provider component
+ * (`<App>`, `<WorkflowEditor>`, `<Playground>`, `<PlaygroundStudio>`).
+ *
+ * Must be called during component initialisation. Resolution order:
+ * 1. An explicitly passed instance (from a mount function or consumer)
+ * 2. An instance already in context (provider nested inside another provider)
+ * 3. Browser: the page-default instance (legacy single-instance behavior)
+ *    Server: a fresh per-render instance (no cross-request leakage)
+ *
+ * The resolved instance is (re-)provided via context for all children.
+ */
+export function provideInstance(explicit) {
+    const instance = explicit ??
+        getContext(FLOWDROP_INSTANCE_KEY) ??
+        (typeof window === 'undefined' ? createFlowDropInstance() : getDefaultInstance());
+    setContext(FLOWDROP_INSTANCE_KEY, instance);
+    return instance;
+}