@d34dman/flowdrop 0.0.37 → 0.0.39

package/dist/stores/interruptStore.js

@@ -0,0 +1,424 @@
+/**
+ * Interrupt Store
+ *
+ * Svelte stores for managing interrupt state using a lightweight state machine.
+ * Ensures valid state transitions and prevents deadlocks.
+ *
+ * @module stores/interruptStore
+ */
+import { writable, derived, get } from 'svelte/store';
+import { initialState, transition, isTerminalState, isSubmitting as checkIsSubmitting, hasError as checkHasError, getErrorMessage, getResolvedValue, toLegacyStatus } from '../types/interruptState.js';
+// =========================================================================
+// Core Stores
+// =========================================================================
+/**
+ * Map of all interrupts by ID
+ * Key: interrupt ID, Value: Interrupt object with state
+ */
+export const interrupts = writable(new Map());
+// =========================================================================
+// Derived Stores
+// =========================================================================
+/**
+ * Derived store for pending interrupt IDs
+ */
+export const pendingInterruptIds = derived(interrupts, ($interrupts) => {
+    const pending = [];
+    $interrupts.forEach((interrupt, id) => {
+        if (!isTerminalState(interrupt.machineState)) {
+            pending.push(id);
+        }
+    });
+    return pending;
+});
+/**
+ * Derived store for pending interrupts array
+ */
+export const pendingInterrupts = derived(interrupts, ($interrupts) => {
+    const pending = [];
+    $interrupts.forEach((interrupt) => {
+        if (!isTerminalState(interrupt.machineState)) {
+            pending.push(interrupt);
+        }
+    });
+    return pending;
+});
+/**
+ * Derived store for count of pending interrupts
+ */
+export const pendingInterruptCount = derived(pendingInterruptIds, ($pendingIds) => $pendingIds.length);
+/**
+ * Derived store for resolved interrupts
+ */
+export const resolvedInterrupts = derived(interrupts, ($interrupts) => {
+    const resolved = [];
+    $interrupts.forEach((interrupt) => {
+        if (interrupt.machineState.status === 'resolved') {
+            resolved.push(interrupt);
+        }
+    });
+    return resolved;
+});
+/**
+ * Derived store to check if any interrupt is currently submitting
+ */
+export const isAnySubmitting = derived(interrupts, ($interrupts) => {
+    for (const interrupt of $interrupts.values()) {
+        if (checkIsSubmitting(interrupt.machineState)) {
+            return true;
+        }
+    }
+    return false;
+});
+/**
+ * Legacy derived store for submitting interrupt IDs
+ * @deprecated Use interrupt.machineState.status === "submitting" instead
+ */
+export const submittingInterrupts = derived(interrupts, ($interrupts) => {
+    const submitting = new Set();
+    $interrupts.forEach((interrupt, id) => {
+        if (checkIsSubmitting(interrupt.machineState)) {
+            submitting.add(id);
+        }
+    });
+    return submitting;
+});
+/**
+ * Legacy derived store for interrupt errors
+ * @deprecated Use interrupt.machineState.error instead
+ */
+export const interruptErrors = derived(interrupts, ($interrupts) => {
+    const errors = new Map();
+    $interrupts.forEach((interrupt, id) => {
+        const errorMsg = getErrorMessage(interrupt.machineState);
+        if (errorMsg) {
+            errors.set(id, errorMsg);
+        }
+    });
+    return errors;
+});
+// =========================================================================
+// State Machine Actions
+// =========================================================================
+/**
+ * Apply a state machine action to an interrupt
+ *
+ * @param interruptId - The interrupt ID
+ * @param action - The action to apply
+ * @returns Transition result with validity and any errors
+ */
+function applyAction(interruptId, action) {
+    const currentInterrupts = get(interrupts);
+    const interrupt = currentInterrupts.get(interruptId);
+    if (!interrupt) {
+        return {
+            state: initialState,
+            valid: false,
+            error: `Interrupt not found: ${interruptId}`
+        };
+    }
+    const result = transition(interrupt.machineState, action);
+    if (result.valid) {
+        interrupts.update(($interrupts) => {
+            const updated = new Map($interrupts);
+            const current = updated.get(interruptId);
+            if (current) {
+                // Update machine state and sync legacy fields
+                const newInterrupt = {
+                    ...current,
+                    machineState: result.state,
+                    status: toLegacyStatus(result.state),
+                    responseValue: getResolvedValue(result.state) ?? current.responseValue,
+                    resolvedAt: result.state.status === 'resolved'
+                        ? result.state.resolvedAt
+                        : result.state.status === 'cancelled'
+                            ? result.state.cancelledAt
+                            : current.resolvedAt
+                };
+                updated.set(interruptId, newInterrupt);
+            }
+            return updated;
+        });
+    }
+    else {
+        console.warn(`[InterruptStore] Invalid transition: ${result.error}`);
+    }
+    return result;
+}
+// =========================================================================
+// Public Actions
+// =========================================================================
+/**
+ * Interrupt store actions for modifying state
+ */
+export const interruptActions = {
+    /**
+     * Add or update an interrupt in the store
+     *
+     * @param interrupt - The interrupt to add or update
+     */
+    addInterrupt: (interrupt) => {
+        interrupts.update(($interrupts) => {
+            const updated = new Map($interrupts);
+            const existing = updated.get(interrupt.id);
+            // Preserve existing machine state if interrupt already exists
+            const machineState = existing?.machineState ?? initialState;
+            const interruptWithState = {
+                ...interrupt,
+                machineState
+            };
+            updated.set(interrupt.id, interruptWithState);
+            return updated;
+        });
+    },
+    /**
+     * Add multiple interrupts to the store
+     *
+     * @param interruptList - Array of interrupts to add
+     */
+    addInterrupts: (interruptList) => {
+        if (interruptList.length === 0)
+            return;
+        interrupts.update(($interrupts) => {
+            const updated = new Map($interrupts);
+            interruptList.forEach((interrupt) => {
+                const existing = updated.get(interrupt.id);
+                const machineState = existing?.machineState ?? initialState;
+                const interruptWithState = {
+                    ...interrupt,
+                    machineState
+                };
+                updated.set(interrupt.id, interruptWithState);
+            });
+            return updated;
+        });
+    },
+    /**
+     * Start submitting an interrupt (user clicked submit)
+     *
+     * @param interruptId - The interrupt ID
+     * @param value - The value being submitted
+     * @returns Transition result
+     */
+    startSubmit: (interruptId, value) => {
+        return applyAction(interruptId, { type: 'SUBMIT', value });
+    },
+    /**
+     * Start cancelling an interrupt (user clicked cancel)
+     *
+     * @param interruptId - The interrupt ID
+     * @returns Transition result
+     */
+    startCancel: (interruptId) => {
+        return applyAction(interruptId, { type: 'CANCEL' });
+    },
+    /**
+     * Mark submission as successful
+     *
+     * @param interruptId - The interrupt ID
+     * @returns Transition result
+     */
+    submitSuccess: (interruptId) => {
+        return applyAction(interruptId, { type: 'SUCCESS' });
+    },
+    /**
+     * Mark submission as failed
+     *
+     * @param interruptId - The interrupt ID
+     * @param error - Error message
+     * @returns Transition result
+     */
+    submitFailure: (interruptId, error) => {
+        return applyAction(interruptId, { type: 'FAILURE', error });
+    },
+    /**
+     * Retry a failed submission
+     *
+     * @param interruptId - The interrupt ID
+     * @returns Transition result
+     */
+    retry: (interruptId) => {
+        return applyAction(interruptId, { type: 'RETRY' });
+    },
+    /**
+     * Reset an interrupt to idle state
+     *
+     * @param interruptId - The interrupt ID
+     * @returns Transition result
+     */
+    resetInterrupt: (interruptId) => {
+        return applyAction(interruptId, { type: 'RESET' });
+    },
+    // =========================================================================
+    // Legacy Actions (for backward compatibility)
+    // =========================================================================
+    /**
+     * Update an interrupt's status (legacy)
+     * @deprecated Use startSubmit/submitSuccess/submitFailure instead
+     */
+    updateStatus: (interruptId, status, responseValue) => {
+        // Map legacy status to state machine actions
+        if (status === 'resolved' && responseValue !== undefined) {
+            const submitResult = applyAction(interruptId, { type: 'SUBMIT', value: responseValue });
+            if (submitResult.valid) {
+                applyAction(interruptId, { type: 'SUCCESS' });
+            }
+        }
+        else if (status === 'cancelled') {
+            const cancelResult = applyAction(interruptId, { type: 'CANCEL' });
+            if (cancelResult.valid) {
+                applyAction(interruptId, { type: 'SUCCESS' });
+            }
+        }
+    },
+    /**
+     * Mark an interrupt as resolved with the user's response (legacy)
+     * @deprecated Use startSubmit + submitSuccess instead
+     */
+    resolveInterrupt: (interruptId, value) => {
+        // For backward compatibility, immediately resolve
+        // (assumes sync operation or already completed API call)
+        const submitResult = applyAction(interruptId, { type: 'SUBMIT', value });
+        if (submitResult.valid) {
+            applyAction(interruptId, { type: 'SUCCESS' });
+        }
+    },
+    /**
+     * Mark an interrupt as cancelled (legacy)
+     * @deprecated Use startCancel + submitSuccess instead
+     */
+    cancelInterrupt: (interruptId) => {
+        const cancelResult = applyAction(interruptId, { type: 'CANCEL' });
+        if (cancelResult.valid) {
+            applyAction(interruptId, { type: 'SUCCESS' });
+        }
+    },
+    /**
+     * Set submitting state for an interrupt (legacy)
+     * @deprecated State is automatically managed by startSubmit/submitSuccess
+     */
+    setSubmitting: (interruptId, isSubmitting) => {
+        // This is now a no-op - state is managed by the state machine
+        // Kept for backward compatibility
+        if (isSubmitting) {
+            console.warn('[InterruptStore] setSubmitting(true) is deprecated. Use startSubmit() instead.');
+        }
+    },
+    /**
+     * Set error for an interrupt (legacy)
+     * @deprecated Use submitFailure() instead
+     */
+    setError: (interruptId, error) => {
+        if (error) {
+            applyAction(interruptId, { type: 'FAILURE', error });
+        }
+        // Clearing error is not directly supported - use retry or reset
+    },
+    /**
+     * Remove an interrupt from the store
+     *
+     * @param interruptId - The interrupt ID to remove
+     */
+    removeInterrupt: (interruptId) => {
+        interrupts.update(($interrupts) => {
+            const updated = new Map($interrupts);
+            updated.delete(interruptId);
+            return updated;
+        });
+    },
+    /**
+     * Clear all interrupts for a specific session
+     *
+     * @param sessionId - The session ID to clear interrupts for
+     */
+    clearSessionInterrupts: (sessionId) => {
+        interrupts.update(($interrupts) => {
+            const updated = new Map($interrupts);
+            $interrupts.forEach((interrupt, id) => {
+                if (interrupt.sessionId === sessionId) {
+                    updated.delete(id);
+                }
+            });
+            return updated;
+        });
+    },
+    /**
+     * Alias for clearSessionInterrupts
+     */
+    clearInterrupts: () => {
+        interrupts.set(new Map());
+    },
+    /**
+     * Reset all interrupt state
+     */
+    reset: () => {
+        interrupts.set(new Map());
+    }
+};
+// =========================================================================
+// Utilities
+// =========================================================================
+/**
+ * Get an interrupt by ID
+ *
+ * @param interruptId - The interrupt ID
+ * @returns The interrupt or undefined
+ */
+export function getInterrupt(interruptId) {
+    return get(interrupts).get(interruptId);
+}
+/**
+ * Check if an interrupt is pending (not resolved or cancelled)
+ *
+ * @param interruptId - The interrupt ID
+ * @returns True if the interrupt exists and is pending
+ */
+export function isInterruptPending(interruptId) {
+    const interrupt = get(interrupts).get(interruptId);
+    return interrupt ? !isTerminalState(interrupt.machineState) : false;
+}
+/**
+ * Check if an interrupt is currently submitting
+ *
+ * @param interruptId - The interrupt ID
+ * @returns True if the interrupt is being submitted
+ */
+export function isInterruptSubmitting(interruptId) {
+    const interrupt = get(interrupts).get(interruptId);
+    return interrupt ? checkIsSubmitting(interrupt.machineState) : false;
+}
+/**
+ * Get the error for an interrupt
+ *
+ * @param interruptId - The interrupt ID
+ * @returns The error message or undefined
+ */
+export function getInterruptError(interruptId) {
+    const interrupt = get(interrupts).get(interruptId);
+    return interrupt ? getErrorMessage(interrupt.machineState) : undefined;
+}
+/**
+ * Get an interrupt by its associated message ID
+ *
+ * @param messageId - The message ID
+ * @returns The interrupt or undefined
+ */
+export function getInterruptByMessageId(messageId) {
+    const interruptMap = get(interrupts);
+    for (const interrupt of interruptMap.values()) {
+        if (interrupt.messageId === messageId) {
+            return interrupt;
+        }
+    }
+    return undefined;
+}
+/**
+ * Check if an interrupt has an error
+ *
+ * @param interruptId - The interrupt ID
+ * @returns True if the interrupt has an error
+ */
+export function interruptHasError(interruptId) {
+    const interrupt = get(interrupts).get(interruptId);
+    return interrupt ? checkHasError(interrupt.machineState) : false;
+}

package/dist/stores/playgroundStore.d.ts

@@ -6,7 +6,7 @@
  *
  * @module stores/playgroundStore
  */
-import type { PlaygroundSession, PlaygroundMessage, PlaygroundInputField, PlaygroundSessionStatus } from '../types/playground.js';
+import type { PlaygroundSession, PlaygroundMessage, PlaygroundInputField, PlaygroundSessionStatus, PlaygroundMessagesApiResponse } from '../types/playground.js';
 import type { Workflow } from '../types/index.js';
 /**
  * Currently active playground session
@@ -200,3 +200,13 @@ export declare function getMessagesSnapshot(): PlaygroundMessage[];
  * @returns ISO 8601 timestamp of the latest message, or null
  */
 export declare function getLatestMessageTimestamp(): string | null;
+/**
+ * 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>;

package/dist/stores/playgroundStore.js

@@ -386,3 +386,37 @@ export function getLatestMessageTimestamp() {
         return null;
     return msgs[msgs.length - 1].timestamp;
 }
+/**
+ * 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 async function refreshSessionMessages(fetchMessages) {
+    const session = get(currentSession);
+    if (!session)
+        return;
+    try {
+        const response = await fetchMessages(session.id);
+        // Add new messages (deduplicates automatically)
+        if (response.data && response.data.length > 0) {
+            playgroundActions.addMessages(response.data);
+        }
+        // Update session status
+        if (response.sessionStatus) {
+            playgroundActions.updateSessionStatus(response.sessionStatus);
+            // Update executing state based on session status
+            if (response.sessionStatus === 'idle' ||
+                response.sessionStatus === 'completed' ||
+                response.sessionStatus === 'failed') {
+                isExecuting.set(false);
+            }
+        }
+    }
+    catch (err) {
+        console.error('[playgroundStore] Failed to refresh messages:', err);
+    }
+}

package/dist/styles/base.css

@@ -1180,6 +1180,95 @@
 	--flowdrop-text-color-primary: var(--color-ref-gray-900);
 	--flowdrop-text-color-secondary: var(--color-ref-gray-600);
 
+	/* =========================================================================
+	   Interrupt Component Tokens
+	   ========================================================================= */
+
+	/* Interrupt state: Pending (awaiting user response) */
+	--flowdrop-interrupt-pending-bg: linear-gradient(
+		135deg,
+		var(--color-ref-amber-100) 0%,
+		var(--color-ref-amber-200) 100%
+	);
+	--flowdrop-interrupt-pending-border: var(--color-ref-amber-500);
+	--flowdrop-interrupt-pending-shadow: rgba(245, 158, 11, 0.15);
+	--flowdrop-interrupt-pending-avatar: var(--color-ref-amber-500);
+	--flowdrop-interrupt-pending-text: var(--color-ref-amber-800);
+	--flowdrop-interrupt-pending-text-light: var(--color-ref-amber-700);
+
+	/* Interrupt state: Completed (response received - neutral) */
+	--flowdrop-interrupt-completed-bg: linear-gradient(
+		135deg,
+		var(--color-ref-blue-50) 0%,
+		var(--color-ref-blue-100) 100%
+	);
+	--flowdrop-interrupt-completed-border: var(--color-ref-blue-500);
+	--flowdrop-interrupt-completed-shadow: rgba(59, 130, 246, 0.15);
+	--flowdrop-interrupt-completed-avatar: var(--color-ref-blue-500);
+	--flowdrop-interrupt-completed-text: var(--color-ref-blue-800);
+	--flowdrop-interrupt-completed-text-light: var(--color-ref-blue-600);
+
+	/* Interrupt state: Cancelled (dismissed without responding) */
+	--flowdrop-interrupt-cancelled-bg: linear-gradient(
+		135deg,
+		var(--color-ref-gray-100) 0%,
+		var(--color-ref-gray-200) 100%
+	);
+	--flowdrop-interrupt-cancelled-border: var(--color-ref-gray-400);
+	--flowdrop-interrupt-cancelled-shadow: rgba(107, 114, 128, 0.15);
+	--flowdrop-interrupt-cancelled-avatar: var(--color-ref-gray-500);
+	--flowdrop-interrupt-cancelled-text: var(--color-ref-gray-600);
+	--flowdrop-interrupt-cancelled-text-light: var(--color-ref-gray-500);
+
+	/* Interrupt state: Error */
+	--flowdrop-interrupt-error-bg: linear-gradient(
+		135deg,
+		var(--color-ref-red-50) 0%,
+		var(--color-ref-red-100) 100%
+	);
+	--flowdrop-interrupt-error-border: var(--color-ref-red-500);
+	--flowdrop-interrupt-error-shadow: rgba(239, 68, 68, 0.15);
+	--flowdrop-interrupt-error-avatar: var(--color-ref-red-500);
+	--flowdrop-interrupt-error-text: var(--color-ref-red-700);
+	--flowdrop-interrupt-error-text-light: var(--color-ref-red-600);
+
+	/* Interrupt prompt inner styling */
+	--flowdrop-interrupt-prompt-bg: rgba(255, 255, 255, 0.85);
+	--flowdrop-interrupt-prompt-border-pending: rgba(245, 158, 11, 0.2);
+	--flowdrop-interrupt-prompt-border-completed: rgba(59, 130, 246, 0.2);
+	--flowdrop-interrupt-prompt-border-cancelled: rgba(107, 114, 128, 0.2);
+	--flowdrop-interrupt-prompt-border-error: rgba(239, 68, 68, 0.2);
+
+	/* Interrupt button tokens */
+	--flowdrop-interrupt-btn-primary-bg: linear-gradient(
+		135deg,
+		var(--color-ref-blue-500) 0%,
+		var(--color-ref-blue-600) 100%
+	);
+	--flowdrop-interrupt-btn-primary-bg-hover: linear-gradient(
+		135deg,
+		var(--color-ref-blue-600) 0%,
+		var(--color-ref-blue-700) 100%
+	);
+	--flowdrop-interrupt-btn-primary-shadow: rgba(59, 130, 246, 0.3);
+	--flowdrop-interrupt-btn-secondary-bg: var(--color-ref-gray-100);
+	--flowdrop-interrupt-btn-secondary-border: var(--color-ref-gray-300);
+	--flowdrop-interrupt-btn-secondary-text: var(--color-ref-gray-700);
+
+	/* Interrupt selection tokens (for confirmation/choice) */
+	--flowdrop-interrupt-selected-confirm-bg: var(--flowdrop-interrupt-btn-primary-bg);
+	--flowdrop-interrupt-selected-confirm-border: var(--color-ref-blue-700);
+	--flowdrop-interrupt-selected-confirm-glow: rgba(59, 130, 246, 0.3);
+	--flowdrop-interrupt-selected-decline-bg: var(--color-ref-red-50);
+	--flowdrop-interrupt-selected-decline-border: var(--color-ref-red-400);
+	--flowdrop-interrupt-selected-decline-text: var(--color-ref-red-600);
+	--flowdrop-interrupt-selected-decline-glow: rgba(248, 113, 113, 0.2);
+	--flowdrop-interrupt-not-selected-opacity: 0.4;
+
+	/* Interrupt badge tokens */
+	--flowdrop-interrupt-badge-completed-bg: var(--color-ref-blue-50);
+	--flowdrop-interrupt-badge-completed-text: var(--color-ref-blue-600);
+
 	/* NotesNode component variables */
 	--notes-node-width: 500px;
 	--notes-node-min-width: 250px;

package/dist/types/index.d.ts

@@ -8,7 +8,7 @@ import type { EndpointConfig } from '../config/endpoints.js';
  * Node category types for organizing nodes in the sidebar
  * Based on actual API response categories
  */
-export type NodeCategory = 'inputs' | 'outputs' | 'prompts' | 'models' | 'processing' | 'logic' | 'data' | 'tools' | 'helpers' | 'vector stores' | 'embeddings' | 'memories' | 'agents' | 'ai' | 'bundles';
+export type NodeCategory = 'triggers' | 'inputs' | 'outputs' | 'prompts' | 'models' | 'processing' | 'logic' | 'data' | 'tools' | 'helpers' | 'vector stores' | 'embeddings' | 'memories' | 'agents' | 'ai' | 'bundles';
 /**
  * Port data type configuration
  */