@flowdrop/flowdrop 1.5.0 → 1.7.0

package/README.md

@@ -10,7 +10,6 @@
   <img src="https://img.shields.io/npm/unpacked-size/%40flowdrop%2Fflowdrop?style=flat-square" alt="NPM Unpacked Size" />
   <img src="https://img.shields.io/npm/types/@flowdrop/flowdrop?style=flat-square" alt="npm type definitions" />
   <a href="http://npmjs.com/package/@flowdrop/flowdrop"><img alt="NPM Downloads" src="https://img.shields.io/npm/d18m/%40flowdrop%2Fflowdrop"></a>
-  
 
 </p>
 
@@ -59,8 +58,8 @@ You get a production-ready workflow UI. You keep full control of everything else
 
 ```svelte
 <script lang="ts">
-  import { WorkflowEditor } from "@flowdrop/flowdrop";
-  import "@flowdrop/flowdrop/styles/base.css";
+  import { WorkflowEditor } from '@flowdrop/flowdrop';
+  import '@flowdrop/flowdrop/styles/base.css';
 </script>
 
 <WorkflowEditor />
@@ -70,8 +69,8 @@ You get a production-ready workflow UI. You keep full control of everything else
 
 ## Features
 
-|                              |                                                                           |
-| ---------------------------- | ------------------------------------------------------------------------- |
+|                           |                                                                           |
+| ------------------------- | ------------------------------------------------------------------------- |
 | **Visual Editor Only**    | Pure UI component. No hidden backend, no external dependencies            |
 | **You Own Everything**    | Your data, your servers, your orchestration logic, your security policies |
 | **Backend Agnostic**      | Connect to any API: Drupal, Laravel, Express, FastAPI, or your own        |
@@ -113,8 +112,8 @@ FlowDrop includes a theme system with built-in light/dark support:
 
 ```svelte
 <script lang="ts">
-  import { WorkflowEditor } from "@flowdrop/flowdrop";
-  import "@flowdrop/flowdrop/styles";
+  import { WorkflowEditor } from '@flowdrop/flowdrop';
+  import '@flowdrop/flowdrop/styles';
 </script>
 
 <!-- Built-in themes: 'default' or 'minimal' -->
@@ -126,7 +125,7 @@ Themes bundle a visual skin (CSS token palette) with behavioral UI defaults. You
 ```javascript
 // Via the mount API
 const app = await mountFlowDropApp(container, {
-  theme: "minimal",
+  theme: 'minimal'
   // or a custom theme object:
   // theme: { name: 'minimal', skin: { tokens: { primary: '#e11d48' } } }
 });
@@ -136,19 +135,19 @@ const app = await mountFlowDropApp(container, {
 
 FlowDrop provides tree-shakeable sub-module exports so you can import only what you need:
 
-| Export Path | Contents |
-| --- | --- |
-| `@flowdrop/flowdrop` | Full library (components, stores, services, types) |
-| `@flowdrop/flowdrop/core` | Types and utilities only (no heavy dependencies) |
-| `@flowdrop/flowdrop/editor` | WorkflowEditor, stores, services |
-| `@flowdrop/flowdrop/form` | SchemaForm, form fields, registry |
-| `@flowdrop/flowdrop/form/code` | Code editor field (CodeMirror) |
-| `@flowdrop/flowdrop/form/markdown` | Markdown editor field |
-| `@flowdrop/flowdrop/display` | MarkdownDisplay component |
-| `@flowdrop/flowdrop/playground` | Playground components and services |
-| `@flowdrop/flowdrop/settings` | SettingsPanel, stores, services |
-| `@flowdrop/flowdrop/styles` | Base CSS stylesheet |
-| `@flowdrop/flowdrop/schema` | Workflow JSON schema |
+| Export Path                        | Contents                                           |
+| ---------------------------------- | -------------------------------------------------- |
+| `@flowdrop/flowdrop`               | Full library (components, stores, services, types) |
+| `@flowdrop/flowdrop/core`          | Types and utilities only (no heavy dependencies)   |
+| `@flowdrop/flowdrop/editor`        | WorkflowEditor, stores, services                   |
+| `@flowdrop/flowdrop/form`          | SchemaForm, form fields, registry                  |
+| `@flowdrop/flowdrop/form/code`     | Code editor field (CodeMirror)                     |
+| `@flowdrop/flowdrop/form/markdown` | Markdown editor field                              |
+| `@flowdrop/flowdrop/display`       | MarkdownDisplay component                          |
+| `@flowdrop/flowdrop/playground`    | Playground components and services                 |
+| `@flowdrop/flowdrop/settings`      | SettingsPanel, stores, services                    |
+| `@flowdrop/flowdrop/styles`        | Base CSS stylesheet                                |
+| `@flowdrop/flowdrop/schema`        | Workflow JSON schema                               |
 
 ## Integration
 
@@ -156,7 +155,7 @@ FlowDrop provides tree-shakeable sub-module exports so you can import only what
 
 ```svelte
 <script>
-  import { WorkflowEditor, NodeSidebar } from "@flowdrop/flowdrop";
+  import { WorkflowEditor, NodeSidebar } from '@flowdrop/flowdrop';
 </script>
 
 <div class="flex h-screen">
@@ -168,15 +167,15 @@ FlowDrop provides tree-shakeable sub-module exports so you can import only what
 ### Vanilla JS / React / Vue / Angular
 
 ```javascript
-import { mountFlowDropApp, createEndpointConfig } from "@flowdrop/flowdrop";
+import { mountFlowDropApp, createEndpointConfig } from '@flowdrop/flowdrop';
 
-const app = await mountFlowDropApp(document.getElementById("editor"), {
+const app = await mountFlowDropApp(document.getElementById('editor'), {
   workflow: myWorkflow,
-  endpointConfig: createEndpointConfig("/api/flowdrop"),
+  endpointConfig: createEndpointConfig('/api/flowdrop'),
   eventHandlers: {
-    onDirtyStateChange: (isDirty) => console.log("Unsaved changes:", isDirty),
-    onAfterSave: (workflow) => console.log("Saved!", workflow),
-  },
+    onDirtyStateChange: (isDirty) => console.log('Unsaved changes:', isDirty),
+    onAfterSave: (workflow) => console.log('Saved!', workflow)
+  }
 });
 
 // Full control over the editor
@@ -188,27 +187,27 @@ app.destroy();
 ### Enterprise Integration
 
 ```javascript
-import { mountFlowDropApp, CallbackAuthProvider } from "@flowdrop/flowdrop";
+import { mountFlowDropApp, CallbackAuthProvider } from '@flowdrop/flowdrop';
 
 const app = await mountFlowDropApp(container, {
   // Dynamic token refresh
   authProvider: new CallbackAuthProvider({
     getToken: () => authService.getAccessToken(),
-    onUnauthorized: () => authService.refreshToken(),
+    onUnauthorized: () => authService.refreshToken()
   }),
 
   // Lifecycle hooks
   eventHandlers: {
     onBeforeUnmount: (workflow, isDirty) => {
       if (isDirty) saveDraft(workflow);
-    },
+    }
   },
 
   // Auto-save, toasts, and more
   features: {
     autoSaveDraft: true,
-    autoSaveDraftInterval: 30000,
-  },
+    autoSaveDraftInterval: 30000
+  }
 });
 ```
 
@@ -217,19 +216,19 @@ const app = await mountFlowDropApp(container, {
 Connect to any backend in seconds:
 
 ```typescript
-import { createEndpointConfig } from "@flowdrop/flowdrop";
+import { createEndpointConfig } from '@flowdrop/flowdrop';
 
-const config = createEndpointConfig("https://api.example.com", {
+const config = createEndpointConfig('https://api.example.com', {
   endpoints: {
-    nodes: { list: "/nodes", get: "/nodes/{id}" },
+    nodes: { list: '/nodes', get: '/nodes/{id}' },
     workflows: {
-      list: "/workflows",
-      get: "/workflows/{id}",
-      create: "/workflows",
-      update: "/workflows/{id}",
-      execute: "/workflows/{id}/execute",
-    },
-  },
+      list: '/workflows',
+      get: '/workflows/{id}',
+      create: '/workflows',
+      update: '/workflows/{id}',
+      execute: '/workflows/{id}/execute'
+    }
+  }
 });
 ```
 
@@ -267,10 +266,10 @@ Runtime configuration means you build once and deploy to staging, production, or
 
 ## Documentation
 
-| Resource                                                     | Description              |
-| ------------------------------------------------------------ | ------------------------ |
-| [QUICK_START.md](https://docs.flowdrop.io/getting-started/installation/)                           | Get running in 5 minutes |
-| [API Documentation](https://api.flowdrop.io/v1/) | REST API specification   |
+| Resource                                                                                     | Description              |
+| -------------------------------------------------------------------------------------------- | ------------------------ |
+| [QUICK_START.md](https://docs.flowdrop.io/getting-started/installation/)                     | Get running in 5 minutes |
+| [API Documentation](https://api.flowdrop.io/v1/)                                             | REST API specification   |
 | [CHANGELOG.md](https://github.com/flowdrop-io/flowdrop/blob/main/libs/flowdrop/CHANGELOG.md) | Version history          |
 
 ## Development

package/dist/adapters/WorkflowAdapter.d.ts

@@ -13,7 +13,7 @@
  * - External applications that want to integrate with FlowDrop
  * - Systems that need to generate or modify workflows programmatically
  */
-import type { Workflow, NodeMetadata, WorkflowFormat } from "../types/index.js";
+import type { Workflow, NodeMetadata, WorkflowFormat } from '../types/index.js';
 /**
  * Standard workflow node interface (SvelteFlow-agnostic)
  */

package/dist/adapters/WorkflowAdapter.js

@@ -13,8 +13,8 @@
  * - External applications that want to integrate with FlowDrop
  * - Systems that need to generate or modify workflows programmatically
  */
-import { v4 as uuidv4 } from "uuid";
-import { generateNodeId } from "../utils/nodeIds.js";
+import { v4 as uuidv4 } from 'uuid';
+import { generateNodeId } from '../utils/nodeIds.js';
 /**
  * Workflow Adapter Class
  * Provides a clean API for workflow operations without exposing SvelteFlow internals
@@ -35,10 +35,10 @@ export class WorkflowAdapter {
             nodes: [],
             edges: [],
             metadata: {
-                version: "1.0.0",
+                version: '1.0.0',
                 createdAt: new Date().toISOString(),
-                updatedAt: new Date().toISOString(),
-            },
+                updatedAt: new Date().toISOString()
+            }
         };
     }
     /**
@@ -58,8 +58,8 @@ export class WorkflowAdapter {
             data: {
                 label: metadata.name,
                 config: config || {},
-                metadata,
-            },
+                metadata
+            }
         };
         workflow.nodes.push(node);
         workflow.metadata.updatedAt = new Date().toISOString();
@@ -109,7 +109,7 @@ export class WorkflowAdapter {
             source: sourceNodeId,
             target: targetNodeId,
             sourceHandle,
-            targetHandle,
+            targetHandle
         };
         workflow.edges.push(edge);
         workflow.metadata.updatedAt = new Date().toISOString();
@@ -161,7 +161,7 @@ export class WorkflowAdapter {
         const warnings = [];
         // Check for empty workflow
         if (workflow.nodes.length === 0) {
-            warnings.push("Workflow has no nodes");
+            warnings.push('Workflow has no nodes');
         }
         // Check for orphaned edges
         const nodeIds = new Set(workflow.nodes.map((n) => n.id));
@@ -202,7 +202,7 @@ export class WorkflowAdapter {
         return {
             valid: errors.length === 0,
             errors,
-            warnings,
+            warnings
         };
     }
     /**
@@ -220,20 +220,20 @@ export class WorkflowAdapter {
             // Validate the imported workflow
             const validation = this.validateWorkflow(workflow);
             if (!validation.valid) {
-                throw new Error(`Invalid workflow: ${validation.errors.join(", ")}`);
+                throw new Error(`Invalid workflow: ${validation.errors.join(', ')}`);
             }
             // Update metadata
             workflow.metadata = {
-                version: workflow.metadata?.version || "1.0.0",
+                version: workflow.metadata?.version || '1.0.0',
                 createdAt: workflow.metadata?.createdAt || new Date().toISOString(),
                 updatedAt: new Date().toISOString(),
                 author: workflow.metadata?.author,
-                tags: workflow.metadata?.tags,
+                tags: workflow.metadata?.tags
             };
             return workflow;
         }
         catch (error) {
-            throw new Error(`Failed to import workflow: ${error instanceof Error ? error.message : "Unknown error"}`);
+            throw new Error(`Failed to import workflow: ${error instanceof Error ? error.message : 'Unknown error'}`);
         }
     }
     /**
@@ -251,17 +251,17 @@ export class WorkflowAdapter {
                 data: {
                     label: node.data.label,
                     config: node.data.config,
-                    metadata: node.data.metadata,
-                },
+                    metadata: node.data.metadata
+                }
             })),
             edges: svelteFlowWorkflow.edges.map((edge) => ({
                 id: edge.id,
                 source: edge.source,
                 target: edge.target,
                 sourceHandle: edge.sourceHandle,
-                targetHandle: edge.targetHandle,
+                targetHandle: edge.targetHandle
             })),
-            metadata: svelteFlowWorkflow.metadata,
+            metadata: svelteFlowWorkflow.metadata
         };
     }
     /**
@@ -274,24 +274,24 @@ export class WorkflowAdapter {
             description: workflow.description,
             nodes: workflow.nodes.map((node) => ({
                 id: node.id,
-                type: "workflowNode",
+                type: 'workflowNode',
                 position: node.position,
                 deletable: true,
                 data: {
                     label: node.data.label,
                     config: node.data.config,
                     metadata: node.data.metadata,
-                    nodeId: node.id,
-                },
+                    nodeId: node.id
+                }
             })),
             edges: workflow.edges.map((edge) => ({
                 id: edge.id,
                 source: edge.source,
                 target: edge.target,
                 sourceHandle: edge.sourceHandle,
-                targetHandle: edge.targetHandle,
+                targetHandle: edge.targetHandle
             })),
-            metadata: workflow.metadata,
+            metadata: workflow.metadata
         };
     }
     /**
@@ -306,7 +306,7 @@ export class WorkflowAdapter {
             totalNodes: workflow.nodes.length,
             totalEdges: workflow.edges.length,
             nodeTypeCounts: Object.fromEntries(nodeTypeCounts),
-            lastModified: workflow.metadata?.updatedAt,
+            lastModified: workflow.metadata?.updatedAt
         };
     }
     /**
@@ -337,11 +337,11 @@ export class WorkflowAdapter {
         cloned.id = uuidv4();
         cloned.name = newName || `${workflow.name} (Copy)`;
         cloned.metadata = {
-            version: cloned.metadata?.version || "1.0.0",
+            version: cloned.metadata?.version || '1.0.0',
             createdAt: new Date().toISOString(),
             updatedAt: new Date().toISOString(),
             author: cloned.metadata?.author,
-            tags: cloned.metadata?.tags,
+            tags: cloned.metadata?.tags
         };
         return cloned;
     }

package/dist/adapters/agentspec/AgentSpecAdapter.d.ts

@@ -9,8 +9,8 @@
  *
  * @see https://github.com/oracle/agent-spec
  */
-import type { AgentSpecFlow } from "../../types/agentspec.js";
-import type { StandardWorkflow } from "../WorkflowAdapter.js";
+import type { AgentSpecFlow } from '../../types/agentspec.js';
+import type { StandardWorkflow } from '../WorkflowAdapter.js';
 export declare class AgentSpecAdapter {
     /**
      * Convert a FlowDrop StandardWorkflow to an Agent Spec Flow.