@d34dman/flowdrop 0.0.28 → 0.0.29

package/dist/editor/index.js

@@ -0,0 +1,117 @@
+/**
+ * FlowDrop Editor Module
+ *
+ * Provides the WorkflowEditor component and related functionality for
+ * building visual workflow editors. This module includes @xyflow/svelte
+ * and all node components.
+ *
+ * @module editor
+ *
+ * @example Mounting a standalone workflow editor:
+ * ```typescript
+ * import { mountFlowDropApp, WorkflowEditor } from "@d34dman/flowdrop/editor";
+ * import "@d34dman/flowdrop/styles";
+ *
+ * const app = await mountFlowDropApp(document.getElementById("editor"), {
+ *   workflow: myWorkflow,
+ *   nodes: availableNodes
+ * });
+ * ```
+ *
+ * @example Using WorkflowEditor in Svelte:
+ * ```svelte
+ * <script>
+ *   import { WorkflowEditor } from "@d34dman/flowdrop/editor";
+ * </script>
+ *
+ * <WorkflowEditor nodes={availableNodes} />
+ * ```
+ */
+// ============================================================================
+// Initialize Built-in Nodes
+// This side effect is intentional for the editor module - users importing
+// the editor expect all node types to be available.
+// ============================================================================
+import "../registry/builtinNodes.js";
+// ============================================================================
+// Main Editor Components
+// ============================================================================
+export { default as WorkflowEditor } from "../components/WorkflowEditor.svelte";
+export { default as App } from "../components/App.svelte";
+// ============================================================================
+// Node Components
+// ============================================================================
+export { default as WorkflowNodeComponent } from "../components/nodes/WorkflowNode.svelte";
+export { default as SimpleNodeComponent } from "../components/nodes/SimpleNode.svelte";
+export { default as ToolNodeComponent } from "../components/nodes/ToolNode.svelte";
+export { default as NotesNodeComponent } from "../components/nodes/NotesNode.svelte";
+export { default as GatewayNode } from "../components/nodes/GatewayNode.svelte";
+export { default as SquareNode } from "../components/nodes/SquareNode.svelte";
+export { default as TerminalNode } from "../components/nodes/TerminalNode.svelte";
+export { default as UniversalNode } from "../components/UniversalNode.svelte";
+// ============================================================================
+// Supporting Editor Components
+// ============================================================================
+export { default as NodeSidebar } from "../components/NodeSidebar.svelte";
+export { default as CanvasBanner } from "../components/CanvasBanner.svelte";
+export { default as LoadingSpinner } from "../components/LoadingSpinner.svelte";
+export { default as StatusIcon } from "../components/StatusIcon.svelte";
+export { default as StatusLabel } from "../components/StatusLabel.svelte";
+export { default as NodeStatusOverlay } from "../components/NodeStatusOverlay.svelte";
+export { default as ConfigForm } from "../components/ConfigForm.svelte";
+export { default as ConfigModal } from "../components/ConfigModal.svelte";
+export { default as ConfigPanel } from "../components/ConfigPanel.svelte";
+export { default as ReadOnlyDetails } from "../components/ReadOnlyDetails.svelte";
+export { default as ConnectionLine } from "../components/ConnectionLine.svelte";
+export { default as LogsSidebar } from "../components/LogsSidebar.svelte";
+export { default as PipelineStatus } from "../components/PipelineStatus.svelte";
+export { default as Navbar } from "../components/Navbar.svelte";
+export { default as Logo } from "../components/Logo.svelte";
+// ============================================================================
+// Mount Functions
+// ============================================================================
+export { mountWorkflowEditor, mountFlowDropApp, unmountFlowDropApp } from "../svelte-app.js";
+// ============================================================================
+// Node Component Registry
+// ============================================================================
+export { 
+// Core registry
+nodeComponentRegistry, createNamespacedType, parseNamespacedType, 
+// Built-in nodes
+BUILTIN_NODE_COMPONENTS, BUILTIN_NODE_TYPES, FLOWDROP_SOURCE, registerBuiltinNodes, areBuiltinsRegistered, isBuiltinType, getBuiltinTypes, resolveBuiltinAlias, 
+// Plugin system
+registerFlowDropPlugin, unregisterFlowDropPlugin, registerCustomNode, createPlugin, isValidNamespace, getRegisteredPlugins, getPluginNodeCount } from "../registry/index.js";
+// ============================================================================
+// Editor Helpers
+// ============================================================================
+export { EdgeStylingHelper, NodeOperationsHelper, WorkflowOperationsHelper, ConfigurationHelper } from "../helpers/workflowEditorHelper.js";
+// ============================================================================
+// Stores
+// ============================================================================
+export { workflowStore, workflowActions, workflowId, workflowName, workflowNodes, workflowEdges, workflowMetadata, workflowChanged, workflowValidation, workflowMetadataChanged, connectedHandles, 
+// Dirty state tracking
+isDirtyStore, isDirty, markAsSaved, getWorkflow as getWorkflowFromStore, setOnDirtyStateChange, setOnWorkflowChange } from "../stores/workflowStore.js";
+// ============================================================================
+// Services
+// ============================================================================
+export * from "../services/api.js";
+export { showSuccess, showError, showWarning, showInfo, showLoading, dismissToast, dismissAllToasts, showPromise, showConfirmation, apiToasts, workflowToasts, pipelineToasts } from "../services/toastService.js";
+export { NodeExecutionService, nodeExecutionService } from "../services/nodeExecutionService.js";
+export { saveWorkflow, updateWorkflow, getWorkflow, getWorkflows, deleteWorkflow, getWorkflowCount, initializeSampleWorkflows } from "../services/workflowStorage.js";
+export { globalSaveWorkflow, globalExportWorkflow, initializeGlobalSave } from "../services/globalSave.js";
+export { fetchPortConfig, validatePortConfig } from "../services/portConfigApi.js";
+export { fetchDynamicSchema, resolveExternalEditUrl, getEffectiveConfigEditOptions, clearSchemaCache, invalidateSchemaCache, hasConfigEditOptions, shouldShowExternalEdit, shouldUseDynamicSchema } from "../services/dynamicSchemaService.js";
+export { getDraftStorageKey, saveDraft, loadDraft, deleteDraft, hasDraft, getDraftMetadata, DraftAutoSaveManager } from "../services/draftStorage.js";
+// ============================================================================
+// API Clients
+// ============================================================================
+export { FlowDropApiClient } from "../api/client.js";
+export { EnhancedFlowDropApiClient, ApiError } from "../api/enhanced-client.js";
+// ============================================================================
+// Connection Utilities
+// ============================================================================
+export * from "../utils/connections.js";
+// ============================================================================
+// Runtime Configuration
+// ============================================================================
+export * from "../config/runtimeConfig.js";

package/dist/form/code.d.ts

@@ -0,0 +1,100 @@
+/**
+ * FlowDrop Form Code Editor Module
+ *
+ * Adds CodeMirror-based code/JSON editor support to SchemaForm.
+ * This module bundles CodeMirror dependencies (~300KB).
+ *
+ * @module form/code
+ *
+ * @example
+ * ```typescript
+ * import { SchemaForm } from "@d34dman/flowdrop/form";
+ * import { registerCodeEditorField, registerTemplateEditorField } from "@d34dman/flowdrop/form/code";
+ *
+ * // Register code editor support (call once at app startup)
+ * registerCodeEditorField();
+ *
+ * // Optionally also register template editor
+ * registerTemplateEditorField();
+ *
+ * // Now SchemaForm will render code editors for format: "json", "code", or "template"
+ * ```
+ */
+import type { FieldSchema } from "../components/form/types.js";
+export { default as FormCodeEditor } from "../components/form/FormCodeEditor.svelte";
+export { default as FormTemplateEditor } from "../components/form/FormTemplateEditor.svelte";
+export type { CodeEditorFieldProps, TemplateEditorFieldProps } from "../components/form/types.js";
+/**
+ * Matcher for code/JSON editor fields
+ * Matches: format "json", "code", or type "object" without specific format
+ */
+export declare function codeEditorFieldMatcher(schema: FieldSchema): boolean;
+/**
+ * Matcher for template editor fields
+ * Matches: format "template" (Twig/Liquid-style templates)
+ */
+export declare function templateEditorFieldMatcher(schema: FieldSchema): boolean;
+/**
+ * Register the code/JSON editor field component
+ *
+ * Call this function once at application startup to enable
+ * code editor fields in SchemaForm. This loads CodeMirror dependencies.
+ *
+ * @param priority - Priority for field matching (default: 100)
+ *
+ * @example
+ * ```typescript
+ * // In your app's entry point:
+ * import { registerCodeEditorField } from "@d34dman/flowdrop/form/code";
+ *
+ * registerCodeEditorField();
+ * ```
+ */
+export declare function registerCodeEditorField(priority?: number): void;
+/**
+ * Register the template editor field component
+ *
+ * Call this function once at application startup to enable
+ * template editor fields (Twig/Liquid syntax) in SchemaForm.
+ *
+ * @param priority - Priority for field matching (default: 100)
+ *
+ * @example
+ * ```typescript
+ * // In your app's entry point:
+ * import { registerTemplateEditorField } from "@d34dman/flowdrop/form/code";
+ *
+ * registerTemplateEditorField();
+ * ```
+ */
+export declare function registerTemplateEditorField(priority?: number): void;
+/**
+ * Register all code-related editor fields (code + template)
+ *
+ * Convenience function to register both code editor types at once.
+ *
+ * @param priority - Priority for field matching (default: 100)
+ */
+export declare function registerAllCodeEditors(priority?: number): void;
+/**
+ * Synchronously register code editor field using the imported component
+ *
+ * Use this when you've already imported the component and want immediate registration.
+ *
+ * @param priority - Priority for field matching (default: 100)
+ *
+ * @example
+ * ```typescript
+ * import { registerCodeEditorFieldWithComponent, FormCodeEditor } from "@d34dman/flowdrop/form/code";
+ * registerCodeEditorFieldWithComponent(FormCodeEditor);
+ * ```
+ */
+export declare function registerCodeEditorFieldWithComponent(component: any, priority?: number): void;
+/**
+ * Check if code editor field is registered
+ */
+export declare function isCodeEditorRegistered(): boolean;
+/**
+ * Check if template editor field is registered
+ */
+export declare function isTemplateEditorRegistered(): boolean;

package/dist/form/code.js

@@ -0,0 +1,153 @@
+/**
+ * FlowDrop Form Code Editor Module
+ *
+ * Adds CodeMirror-based code/JSON editor support to SchemaForm.
+ * This module bundles CodeMirror dependencies (~300KB).
+ *
+ * @module form/code
+ *
+ * @example
+ * ```typescript
+ * import { SchemaForm } from "@d34dman/flowdrop/form";
+ * import { registerCodeEditorField, registerTemplateEditorField } from "@d34dman/flowdrop/form/code";
+ *
+ * // Register code editor support (call once at app startup)
+ * registerCodeEditorField();
+ *
+ * // Optionally also register template editor
+ * registerTemplateEditorField();
+ *
+ * // Now SchemaForm will render code editors for format: "json", "code", or "template"
+ * ```
+ */
+import { registerFieldComponent } from "./fieldRegistry.js";
+// Re-export the components for direct usage if needed
+export { default as FormCodeEditor } from "../components/form/FormCodeEditor.svelte";
+export { default as FormTemplateEditor } from "../components/form/FormTemplateEditor.svelte";
+/**
+ * Matcher for code/JSON editor fields
+ * Matches: format "json", "code", or type "object" without specific format
+ */
+export function codeEditorFieldMatcher(schema) {
+    // JSON/code format
+    if (schema.format === "json" || schema.format === "code") {
+        return true;
+    }
+    // Object type without specific format (render as JSON editor)
+    if (schema.type === "object" && !schema.format) {
+        return true;
+    }
+    return false;
+}
+/**
+ * Matcher for template editor fields
+ * Matches: format "template" (Twig/Liquid-style templates)
+ */
+export function templateEditorFieldMatcher(schema) {
+    return schema.format === "template";
+}
+/**
+ * Track if code editor is registered
+ */
+let codeEditorRegistered = false;
+/**
+ * Track if template editor is registered
+ */
+let templateEditorRegistered = false;
+/**
+ * Register the code/JSON editor field component
+ *
+ * Call this function once at application startup to enable
+ * code editor fields in SchemaForm. This loads CodeMirror dependencies.
+ *
+ * @param priority - Priority for field matching (default: 100)
+ *
+ * @example
+ * ```typescript
+ * // In your app's entry point:
+ * import { registerCodeEditorField } from "@d34dman/flowdrop/form/code";
+ *
+ * registerCodeEditorField();
+ * ```
+ */
+export function registerCodeEditorField(priority = 100) {
+    if (codeEditorRegistered) {
+        return;
+    }
+    // Dynamic import to ensure proper code splitting
+    import("../components/form/FormCodeEditor.svelte").then((module) => {
+        registerFieldComponent("code-editor", module.default, codeEditorFieldMatcher, priority);
+        codeEditorRegistered = true;
+    });
+}
+/**
+ * Register the template editor field component
+ *
+ * Call this function once at application startup to enable
+ * template editor fields (Twig/Liquid syntax) in SchemaForm.
+ *
+ * @param priority - Priority for field matching (default: 100)
+ *
+ * @example
+ * ```typescript
+ * // In your app's entry point:
+ * import { registerTemplateEditorField } from "@d34dman/flowdrop/form/code";
+ *
+ * registerTemplateEditorField();
+ * ```
+ */
+export function registerTemplateEditorField(priority = 100) {
+    if (templateEditorRegistered) {
+        return;
+    }
+    // Dynamic import to ensure proper code splitting
+    import("../components/form/FormTemplateEditor.svelte").then((module) => {
+        registerFieldComponent("template-editor", module.default, templateEditorFieldMatcher, priority);
+        templateEditorRegistered = true;
+    });
+}
+/**
+ * Register all code-related editor fields (code + template)
+ *
+ * Convenience function to register both code editor types at once.
+ *
+ * @param priority - Priority for field matching (default: 100)
+ */
+export function registerAllCodeEditors(priority = 100) {
+    registerCodeEditorField(priority);
+    registerTemplateEditorField(priority);
+}
+/**
+ * Synchronously register code editor field using the imported component
+ *
+ * Use this when you've already imported the component and want immediate registration.
+ *
+ * @param priority - Priority for field matching (default: 100)
+ *
+ * @example
+ * ```typescript
+ * import { registerCodeEditorFieldWithComponent, FormCodeEditor } from "@d34dman/flowdrop/form/code";
+ * registerCodeEditorFieldWithComponent(FormCodeEditor);
+ * ```
+ */
+export function registerCodeEditorFieldWithComponent(
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+component, priority = 100) {
+    if (codeEditorRegistered) {
+        return;
+    }
+    registerFieldComponent("code-editor", component, codeEditorFieldMatcher, priority);
+    codeEditorRegistered = true;
+}
+/**
+ * Check if code editor field is registered
+ */
+export function isCodeEditorRegistered() {
+    return codeEditorRegistered;
+}
+/**
+ * Check if template editor field is registered
+ */
+export function isTemplateEditorRegistered() {
+    return templateEditorRegistered;
+}

package/dist/form/fieldRegistry.d.ts

@@ -0,0 +1,163 @@
+/**
+ * Form Field Component Registry
+ *
+ * Provides a registry system for form field components that enables:
+ * - Tree-shaking: Heavy components (code editor, markdown) are only bundled when registered
+ * - Dynamic field types: Users can add custom field renderers
+ * - Lazy loading: Components can be registered at runtime
+ *
+ * @module form/fieldRegistry
+ *
+ * @example Basic usage with light fields only (no codemirror/easymde):
+ * ```typescript
+ * import { SchemaForm } from "@d34dman/flowdrop/form";
+ * // Uses only basic fields - small bundle size
+ * ```
+ *
+ * @example Adding code editor support:
+ * ```typescript
+ * import { SchemaForm, registerFieldComponent } from "@d34dman/flowdrop/form";
+ * import { FormCodeEditor, codeEditorFieldMatcher } from "@d34dman/flowdrop/form/code";
+ *
+ * registerFieldComponent("code-editor", FormCodeEditor, codeEditorFieldMatcher);
+ * ```
+ */
+import type { Component } from "svelte";
+import type { FieldSchema } from "../components/form/types.js";
+/**
+ * Base field component props that all registered field components should accept.
+ * Components may have additional specific props.
+ */
+export interface FieldComponentProps {
+    /** Field identifier */
+    id: string;
+    /** Current field value */
+    value: unknown;
+    /** Placeholder text */
+    placeholder?: string;
+    /** Whether field is required */
+    required?: boolean;
+    /** ARIA description ID */
+    ariaDescribedBy?: string;
+    /** Change callback */
+    onChange: (value: unknown) => void;
+    /** Additional schema-derived props */
+    [key: string]: unknown;
+}
+/**
+ * Function type for determining if a field schema should use a specific component
+ */
+export type FieldMatcher = (schema: FieldSchema) => boolean;
+/**
+ * Generic component type that accepts any props
+ * This is needed because different field components have different prop requirements
+ */
+export type FieldComponent = Component<any, any, any>;
+/**
+ * Registration entry for a field component
+ */
+export interface FieldComponentRegistration {
+    /** The Svelte component to render */
+    component: FieldComponent;
+    /** Function to determine if this component should handle a given schema */
+    matcher: FieldMatcher;
+    /** Priority for matching (higher = checked first) */
+    priority: number;
+}
+/**
+ * Register a field component for a specific field type
+ *
+ * @param type - Unique identifier for this field type
+ * @param component - Svelte component to render for matching fields
+ * @param matcher - Function to determine if a schema matches this type
+ * @param priority - Priority for matching (default: 0, higher = checked first)
+ *
+ * @example
+ * ```typescript
+ * registerFieldComponent(
+ *   "code-editor",
+ *   FormCodeEditor,
+ *   (schema) => schema.format === "json" || schema.format === "code",
+ *   100 // High priority to override default
+ * );
+ * ```
+ */
+export declare function registerFieldComponent(type: string, component: FieldComponent, matcher: FieldMatcher, priority?: number): void;
+/**
+ * Unregister a field component
+ *
+ * @param type - The field type to unregister
+ * @returns true if the component was registered and removed
+ */
+export declare function unregisterFieldComponent(type: string): boolean;
+/**
+ * Get all registered field types
+ *
+ * @returns Array of registered field type identifiers
+ */
+export declare function getRegisteredFieldTypes(): string[];
+/**
+ * Check if a field type is registered
+ *
+ * @param type - Field type to check
+ * @returns true if the type is registered
+ */
+export declare function isFieldTypeRegistered(type: string): boolean;
+/**
+ * Resolve which component should render a given field schema
+ * Checks registered matchers in priority order
+ *
+ * @param schema - The field schema to resolve
+ * @returns The matching registration or null if no match
+ */
+export declare function resolveFieldComponent(schema: FieldSchema): FieldComponentRegistration | null;
+/**
+ * Clear all registered field components
+ * Useful for testing or reset scenarios
+ */
+export declare function clearFieldRegistry(): void;
+/**
+ * Get the registry size
+ * @returns Number of registered field components
+ */
+export declare function getFieldRegistrySize(): number;
+/**
+ * Matcher for hidden fields (should not render)
+ */
+export declare const hiddenFieldMatcher: FieldMatcher;
+/**
+ * Matcher for checkbox group fields (enum with multiple)
+ */
+export declare const checkboxGroupMatcher: FieldMatcher;
+/**
+ * Matcher for enum select fields
+ */
+export declare const enumSelectMatcher: FieldMatcher;
+/**
+ * Matcher for multiline textarea fields
+ */
+export declare const textareaMatcher: FieldMatcher;
+/**
+ * Matcher for range slider fields
+ */
+export declare const rangeMatcher: FieldMatcher;
+/**
+ * Matcher for string text fields
+ */
+export declare const textFieldMatcher: FieldMatcher;
+/**
+ * Matcher for number fields
+ */
+export declare const numberFieldMatcher: FieldMatcher;
+/**
+ * Matcher for boolean toggle fields
+ */
+export declare const toggleMatcher: FieldMatcher;
+/**
+ * Matcher for select fields with options
+ */
+export declare const selectOptionsMatcher: FieldMatcher;
+/**
+ * Matcher for array fields
+ */
+export declare const arrayMatcher: FieldMatcher;