@flowdrop/flowdrop 1.15.0 → 2.0.0-beta.2

package/dist/stores/pipelinePanelStore.svelte.js

@@ -1,24 +1,71 @@
+/**
+ * Pipeline Panel Store for FlowDrop (Svelte 5 Runes)
+ *
+ * Tracks whether the pipeline panel is open, persisting the choice to
+ * localStorage so it survives reloads.
+ *
+ * The reactive state lives in the {@link PipelinePanelStore} class — one per
+ * FlowDrop instance, resolved in components via `getInstance().pipelinePanel`.
+ *
+ * @module stores/pipelinePanelStore
+ */
+/** Base localStorage key for the panel open state. */
 const STORAGE_KEY = 'fd-pipeline-panel-open';
-let _isOpen = $state(false);
-export function getPipelinePanelOpen() {
-    return _isOpen;
-}
-export const pipelinePanelActions = {
+// =========================================================================
+// PipelinePanelStore (per-instance reactive state)
+// =========================================================================
+/**
+ * Per-instance pipeline panel open state.
+ *
+ * Reads go through the {@link isOpen} getter backed by `$state`, so they track
+ * reactively in templates and `$derived`.
+ */
+export class PipelinePanelStore {
+    /** Whether the pipeline panel is currently open. */
+    #isOpen = $state(false);
+    /**
+     * The localStorage key for this instance — always instance-scoped
+     * (`fd-pipeline-panel-open:<instanceId>`) so multiple editors on one page
+     * don't clobber each other.
+     */
+    #storageKey;
+    /** @param instanceId - Instance id used to scope the localStorage key. */
+    constructor(instanceId) {
+        this.#storageKey = `${STORAGE_KEY}:${instanceId}`;
+    }
+    /** Whether the pipeline panel is currently open (reactive). */
+    get isOpen() {
+        return this.#isOpen;
+    }
+    /** Initialize open state from localStorage. */
     init() {
-        if (typeof localStorage !== 'undefined') {
-            _isOpen = localStorage.getItem(STORAGE_KEY) === 'true';
+        if (typeof localStorage === 'undefined')
+            return;
+        let stored = localStorage.getItem(this.#storageKey);
+        // One-time migration: in 1.x the page-default instance stored its state
+        // under the bare key. Adopt it on first read, then remove it.
+        if (stored === null && this.#storageKey === `${STORAGE_KEY}:default`) {
+            const legacy = localStorage.getItem(STORAGE_KEY);
+            if (legacy !== null) {
+                localStorage.setItem(this.#storageKey, legacy);
+                localStorage.removeItem(STORAGE_KEY);
+                stored = legacy;
+            }
         }
-    },
+        this.#isOpen = stored === 'true';
+    }
+    /** Toggle the panel open/closed, persisting the new state. */
     toggle() {
-        _isOpen = !_isOpen;
+        this.#isOpen = !this.#isOpen;
         if (typeof localStorage !== 'undefined') {
-            localStorage.setItem(STORAGE_KEY, String(_isOpen));
+            localStorage.setItem(this.#storageKey, String(this.#isOpen));
         }
-    },
+    }
+    /** Set the panel open state explicitly, persisting it. */
     setOpen(value) {
-        _isOpen = value;
+        this.#isOpen = value;
         if (typeof localStorage !== 'undefined') {
-            localStorage.setItem(STORAGE_KEY, String(value));
+            localStorage.setItem(this.#storageKey, String(value));
         }
     }
-};
+}

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

@@ -4,265 +4,212 @@
  * Svelte 5 rune-based state for managing playground state including sessions,
  * messages, and execution status.
  *
+ * The reactive state lives in the {@link PlaygroundStore} class — one per
+ * FlowDrop instance, created by `createFlowDropInstance()` and resolved in
+ * components via `getInstance().playground`.
+ *
  * @module stores/playgroundStore
  */
 import type { PlaygroundSession, PlaygroundMessage, PlaygroundInputField, PlaygroundSessionStatus, PlaygroundMessagesApiResponse, PlaygroundExecution } from '../types/playground.js';
 import type { Workflow } from '../types/index.js';
 /**
- * Get the current session
- */
-export declare function getCurrentSession(): PlaygroundSession | null;
-/**
- * Get all sessions
- */
-export declare function getSessions(): PlaygroundSession[];
-/**
- * Get all messages
- */
-export declare function getMessages(): PlaygroundMessage[];
-/**
- * Get executing state
- */
-export declare function getIsExecuting(): boolean;
-/**
- * Get loading state
- */
-export declare function getIsLoading(): boolean;
-/**
- * Get error state
- */
-export declare function getError(): string | null;
-/**
- * Get the current workflow
- */
-export declare function getCurrentWorkflow(): Workflow | null;
-/**
- * Get the last poll sequence number cursor
- */
-export declare function getLastPollSequenceNumber(): number | null;
-/**
- * Get current session status
- */
-export declare function getSessionStatus(): PlaygroundSessionStatus;
-/**
- * Whether the user can currently send a message.
- * False when executing, when awaiting input, or when no session exists.
- */
-export declare function getCanSendMessage(): boolean;
-/**
- * Get message count
- */
-export declare function getMessageCount(): number;
-/**
- * Get chat messages (excludes log messages)
- */
-export declare function getChatMessages(): PlaygroundMessage[];
-/**
- * Get log messages only
- */
-export declare function getLogMessages(): PlaygroundMessage[];
-/**
- * Get the latest message
- */
-export declare function getLatestMessage(): PlaygroundMessage | null;
-/**
- * Get input fields from workflow input nodes
+ * Playground mutation actions for a {@link PlaygroundStore}.
  *
- * Analyzes the workflow to extract input nodes and their configuration
- * schemas for auto-generating input forms.
- */
-export declare function getInputFields(): PlaygroundInputField[];
-/**
- * Check if workflow has a chat input
- */
-export declare function getHasChatInput(): boolean;
-/**
- * Get session count
- */
-export declare function getSessionCount(): number;
-export declare function getPinnedExecutionId(): string | null;
-export declare function getLatestExecutionId(): string | null;
-export declare function getActiveExecutionId(): string | null;
-/**
- * Main pipeline runs for the run-switcher. Excludes sub-flow runs, which can't
- * render their own graph and so aren't user-selectable.
- */
-export declare function getSelectableExecutions(): PlaygroundExecution[];
-/**
- * Counter that increments whenever new messages arrive and the pipeline display
- * should re-fetch — i.e. when following latest or pinned to the latest execution.
- * Pass to PipelinePanel's refreshTrigger prop.
+ * Bound facade — safe to detach (`onclick={fd.playground.actions.toggleShowLogs}`)
+ * because every entry is bound to its store in the constructor.
  */
-export declare function getPipelineRefreshTrigger(): number;
-/**
- * Whether log messages should be shown in the execution console
- */
-export declare function getShowLogs(): boolean;
-/**
- * Playground store actions for modifying state
- */
-export declare const playgroundActions: {
-    /**
-     * Set the current workflow
-     *
-     * @param workflow - The workflow to test
-     */
+export interface PlaygroundStoreActions {
     setWorkflow: (workflow: Workflow | null) => void;
+    setCurrentSession: (session: PlaygroundSession | null) => void;
+    updateSessionStatus: (status: PlaygroundSessionStatus) => void;
+    setSessions: (sessionList: PlaygroundSession[]) => void;
+    addSession: (session: PlaygroundSession) => void;
+    removeSession: (sessionId: string) => void;
+    setMessages: (messageList: PlaygroundMessage[]) => void;
+    addMessage: (message: PlaygroundMessage) => void;
+    addMessages: (newMessages: PlaygroundMessage[]) => void;
+    clearMessages: () => void;
+    setLoading: (loading: boolean) => void;
+    setError: (errorMessage: string | null) => void;
+    updateLastPollSequenceNumber: (seq: number) => void;
+    reset: () => void;
+    switchSession: (sessionId: string) => void;
+    pinExecution: (executionId: string | null) => void;
+    setShowLogs: (value: boolean) => void;
+    toggleShowLogs: () => void;
+}
+/**
+ * Per-instance playground state: sessions, messages, executions, and the
+ * polling/refresh machinery around them.
+ */
+export declare class PlaygroundStore {
+    #private;
+    /** Bound mutation facade — see {@link PlaygroundStoreActions}. */
+    readonly actions: PlaygroundStoreActions;
+    constructor();
+    /** The current session. */
+    get currentSession(): PlaygroundSession | null;
+    /** All sessions. */
+    get sessions(): PlaygroundSession[];
+    /** All messages (chronological). */
+    get messages(): PlaygroundMessage[];
+    /** Executing state (derived from server status). */
+    get isExecuting(): boolean;
+    /** Loading state. */
+    get isLoading(): boolean;
+    /** Error state. */
+    get error(): string | null;
+    /** The current workflow. */
+    get currentWorkflow(): Workflow | null;
+    /** The last poll sequence number cursor. */
+    get lastPollSequenceNumber(): number | null;
+    /** Current session status. */
+    get sessionStatus(): PlaygroundSessionStatus;
     /**
-     * Set the current session
-     *
-     * @param session - The session to set as active
+     * Whether the user can currently send a message.
+     * False when executing, when awaiting input, or when no session exists.
      */
-    setCurrentSession: (session: PlaygroundSession | null) => void;
+    get canSendMessage(): boolean;
+    /** Message count. */
+    get messageCount(): number;
+    /** Chat messages (excludes log messages). */
+    get chatMessages(): PlaygroundMessage[];
+    /** Log messages only. */
+    get logMessages(): PlaygroundMessage[];
+    /** The latest message, or null. */
+    get latestMessage(): PlaygroundMessage | null;
     /**
-     * Update session status
+     * Input fields from workflow input nodes.
      *
-     * @param status - The new status
+     * Analyzes the workflow to extract input nodes and their configuration
+     * schemas for auto-generating input forms.
      */
-    updateSessionStatus: (status: PlaygroundSessionStatus) => void;
+    get inputFields(): PlaygroundInputField[];
+    /** Whether the workflow has a chat input. */
+    get hasChatInput(): boolean;
+    /** Session count. */
+    get sessionCount(): number;
+    /** Execution ID explicitly pinned by the user (null = follow latest). */
+    get pinnedExecutionId(): string | null;
+    /** Latest main-run execution ID. */
+    get latestExecutionId(): string | null;
+    /** Active execution: pinned if set, otherwise latest. */
+    get activeExecutionId(): string | null;
     /**
-     * Set the sessions list
-     *
-     * @param sessionList - Array of sessions
+     * Main pipeline runs for the run-switcher. Excludes sub-flow runs, which can't
+     * render their own graph and so aren't user-selectable.
      */
-    setSessions: (sessionList: PlaygroundSession[]) => void;
+    get selectableExecutions(): PlaygroundExecution[];
     /**
-     * Add a new session to the list
-     *
-     * @param session - The session to add
+     * Counter that increments whenever new messages arrive and the pipeline display
+     * should re-fetch — i.e. when following latest or pinned to the latest execution.
+     * Pass to PipelinePanel's refreshTrigger prop.
      */
-    addSession: (session: PlaygroundSession) => void;
+    get pipelineRefreshTrigger(): number;
+    /** Whether log messages should be shown in the execution console. */
+    get showLogs(): boolean;
+    /** The current session ID, or null. */
+    get currentSessionId(): string | null;
+    /** Whether older messages exist before the oldest one currently loaded. */
+    get hasOlder(): boolean;
     /**
-     * Remove a session from the list
-     *
-     * @param sessionId - The session ID to remove
+     * The sequence number of the latest message, used to seed incremental polling.
      */
-    removeSession: (sessionId: string) => void;
+    get latestSequenceNumber(): number | null;
     /**
-     * Set messages for the current session
-     * Messages are automatically sorted chronologically
-     *
-     * @param messageList - Array of messages
+     * The sequence number of the oldest loaded message, used as the cursor
+     * for backward "load older" pagination.
      */
-    setMessages: (messageList: PlaygroundMessage[]) => void;
+    get oldestSequenceNumber(): number | null;
+    /** Set the current workflow. */
+    setWorkflow(workflow: Workflow | null): void;
+    /** Set the current session. */
+    setCurrentSession(session: PlaygroundSession | null): void;
+    /** Update session status. */
+    updateSessionStatus(status: PlaygroundSessionStatus): void;
+    /** Set the sessions list. */
+    setSessions(sessionList: PlaygroundSession[]): void;
+    /** Add a new session to the list. */
+    addSession(session: PlaygroundSession): void;
+    /** Remove a session from the list. */
+    removeSession(sessionId: string): void;
     /**
-     * Add a message to the current session
-     * Uses binary search insertion for O(log n) instead of full sort.
-     *
-     * @param message - The message to add
+     * Set messages for the current session.
+     * Messages are automatically sorted chronologically.
      */
-    addMessage: (message: PlaygroundMessage) => void;
+    setMessages(messageList: PlaygroundMessage[]): void;
     /**
-     * Add multiple messages to the current session
-     * Messages are deduplicated and automatically sorted chronologically
-     *
-     * @param newMessages - Array of messages to add
+     * Add a message to the current session.
+     * Uses binary search insertion for O(log n) instead of full sort.
      */
-    addMessages: (newMessages: PlaygroundMessage[]) => void;
+    addMessage(message: PlaygroundMessage): void;
     /**
-     * Clear all messages
+     * Add multiple messages to the current session.
+     * Messages are deduplicated and automatically sorted chronologically.
      */
-    clearMessages: () => void;
+    addMessages(newMessages: PlaygroundMessage[]): void;
+    /** Clear all messages. */
+    clearMessages(): void;
+    /** Set the loading state. */
+    setLoading(loading: boolean): void;
+    /** Set an error message (or null to clear). */
+    setError(errorMessage: string | null): void;
+    /** Update the last poll cursor. */
+    updateLastPollSequenceNumber(seq: number): void;
+    /** Reset all playground state. */
+    reset(): void;
+    /** Switch to a different session. */
+    switchSession(sessionId: string): void;
+    /** Pin an execution (null = follow latest). */
+    pinExecution(executionId: string | null): void;
+    /** Set log message visibility. */
+    setShowLogs(value: boolean): void;
+    /** Toggle log message visibility. */
+    toggleShowLogs(): void;
     /**
-     * Set the loading state
+     * Apply a server response to the store. All message and status updates from
+     * the server flow through here — polling callback, manual fetches, interrupt
+     * resolution. Nothing updates messages or session status except this function.
      *
-     * @param loading - Whether loading is in progress
+     * Pass `sessionId` (the session the response was fetched for) so a response
+     * that resolves after the user switched sessions is dropped instead of writing
+     * the old session's status/messages onto the new current session. Pass `null`
+     * to deliberately opt out of the guard (non-session-scoped callers only) — the
+     * argument is required so every new caller has to make that choice explicitly.
      */
-    setLoading: (loading: boolean) => void;
+    applyServerResponse(response: PlaygroundMessagesApiResponse, sessionId: string | null): void;
+    /** Check if a specific session is selected. */
+    isSessionSelected(sessionId: string): boolean;
     /**
-     * Set an error message
-     *
-     * @param errorMessage - The error message or null to clear
+     * Set whether older messages remain to be loaded, derived from a
+     * backward-pagination response.
      */
-    setError: (errorMessage: string | null) => void;
+    setHasOlder(hasOlder: boolean): void;
     /**
-     * Update the last poll timestamp
+     * Subscribe to session status changes using $effect.root.
+     * This is designed for use in non-component contexts (e.g., mount.ts).
+     *
+     * The effect root is tracked by the store and also disposed by
+     * {@link dispose} (via the owning instance's `destroy()`), so a forgotten
+     * unsubscribe can't outlive the instance.
      *
-     * @param timestamp - ISO 8601 timestamp
+     * @param callback - Called when session status changes
+     * @returns Cleanup function to stop the subscription
      */
-    updateLastPollSequenceNumber: (seq: number) => void;
+    subscribeToSessionStatus(callback: (status: PlaygroundSessionStatus, previousStatus: PlaygroundSessionStatus) => void): () => void;
     /**
-     * Reset all playground state
+     * Dispose all active session-status effect roots.
+     * Called by the owning instance's destroy(); safe to call repeatedly.
      */
-    reset: () => void;
+    dispose(): void;
     /**
-     * Switch to a different session
+     * Refresh messages for the current session.
      *
-     * @param sessionId - The session ID to switch to
+     * This function is useful after interrupt resolution when polling
+     * has stopped but new messages may exist on the server.
+     *
+     * @param fetchMessages - Async function to fetch messages from the API
+     * @returns Promise that resolves when messages are refreshed
      */
-    switchSession: (sessionId: string) => void;
-    pinExecution(executionId: string | null): void;
-    setShowLogs(value: boolean): void;
-    toggleShowLogs(): void;
-};
-/**
- * Apply a server response to the store. All message and status updates from
- * the server flow through here — polling callback, manual fetches, interrupt
- * resolution. Nothing updates messages or session status except this function.
- *
- * Pass `sessionId` (the session the response was fetched for) so a response
- * that resolves after the user switched sessions is dropped instead of writing
- * the old session's status/messages onto the new current session. Pass `null`
- * to deliberately opt out of the guard (non-session-scoped callers only) — the
- * argument is required so every new caller has to make that choice explicitly.
- */
-export declare function applyServerResponse(response: PlaygroundMessagesApiResponse, sessionId: string | null): void;
-/**
- * Get the current session ID
- *
- * @returns The current session ID or null
- */
-export declare function getCurrentSessionId(): string | null;
-/**
- * Check if a specific session is selected
- *
- * @param sessionId - The session ID to check
- * @returns True if the session is currently selected
- */
-export declare function isSessionSelected(sessionId: string): boolean;
-/**
- * Get all messages as a snapshot
- *
- * @returns Array of all messages
- */
-export declare function getMessagesSnapshot(): PlaygroundMessage[];
-/**
- * Get the sequence number of the latest message, used to seed incremental polling.
- *
- * @returns Sequence number of the last message, or null
- */
-export declare function getLatestSequenceNumber(): number | null;
-/**
- * Get the sequence number of the oldest loaded message, used as the cursor
- * for backward "load older" pagination.
- *
- * @returns Sequence number of the first message, or null
- */
-export declare function getOldestSequenceNumber(): number | null;
-/**
- * Whether older messages exist before the oldest one currently loaded.
- */
-export declare function getHasOlder(): boolean;
-/**
- * Set whether older messages remain to be loaded, derived from a
- * backward-pagination response.
- */
-export declare function setHasOlder(hasOlder: boolean): void;
-/**
- * Subscribe to session status changes using $effect.root.
- * This is designed for use in non-component contexts (e.g., mount.ts).
- *
- * @param callback - Called when session status changes
- * @returns Cleanup function to stop the subscription
- */
-export declare function subscribeToSessionStatus(callback: (status: PlaygroundSessionStatus, previousStatus: PlaygroundSessionStatus) => void): () => void;
-/**
- * Refresh messages for the current session
- *
- * This function is useful after interrupt resolution when polling
- * has stopped but new messages may exist on the server.
- *
- * @param fetchMessages - Async function to fetch messages from the API
- * @returns Promise that resolves when messages are refreshed
- */
-export declare function refreshSessionMessages(fetchMessages: (sessionId: string) => Promise<PlaygroundMessagesApiResponse>): Promise<void>;
+    refreshSessionMessages(fetchMessages: (sessionId: string) => Promise<PlaygroundMessagesApiResponse>): Promise<void>;
+}