@genfeedai/workflow-ui 0.1.0 → 0.1.2

package/dist/{chunk-H6LZKSLY.js → chunk-ECD5J2BA.js}

@@ -2,15 +2,16 @@
 
 var chunk3SPPKCWR_js = require('./chunk-3SPPKCWR.js');
 var chunk3YFFDHC5_js = require('./chunk-3YFFDHC5.js');
-var chunkHPQT36RR_js = require('./chunk-HPQT36RR.js');
+var chunk3TMV3K34_js = require('./chunk-3TMV3K34.js');
 var chunk5HJFQVUR_js = require('./chunk-5HJFQVUR.js');
 var chunkEMUMKW5C_js = require('./chunk-EMUMKW5C.js');
 var chunk6DOEUDD5_js = require('./chunk-6DOEUDD5.js');
-var chunkEC2ZIWOK_js = require('./chunk-EC2ZIWOK.js');
-var chunkNSDLGLAQ_js = require('./chunk-NSDLGLAQ.js');
+var chunkAXFOCPPP_js = require('./chunk-AXFOCPPP.js');
+var chunkIHF35QZD_js = require('./chunk-IHF35QZD.js');
 var chunkRJ262NXS_js = require('./chunk-RJ262NXS.js');
 var chunkRXNEDWK2_js = require('./chunk-RXNEDWK2.js');
-var chunkZ7PWFZG5_js = require('./chunk-Z7PWFZG5.js');
+var chunk4MZ62VMF_js = require('./chunk-4MZ62VMF.js');
+var types = require('@genfeedai/types');
 var react$1 = require('@xyflow/react');
 var clsx = require('clsx');
 var lucideReact = require('lucide-react');
@@ -18,16 +19,290 @@ var react = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 var Image4 = require('next/image');
 var reactDom = require('react-dom');
-var reactCompareSlider = require('react-compare-slider');
 var shallow = require('zustand/react/shallow');
-var core = require('@genfeedai/core');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
 var Image4__default = /*#__PURE__*/_interopDefault(Image4);
 
-// src/nodes/BaseNode.tsx
-var import_types = chunkZ7PWFZG5_js.__toESM(chunkNSDLGLAQ_js.require_dist());
+// ../core/dist/chunk-OAAW6BNW.js
+var require_chunk_OAAW6BNW = chunk4MZ62VMF_js.__commonJS({
+  "../core/dist/chunk-OAAW6BNW.js"(exports$1) {
+    function topologicalSort(nodes, edges) {
+      const inDegree = /* @__PURE__ */ new Map();
+      const adjList = /* @__PURE__ */ new Map();
+      for (const node of nodes) {
+        inDegree.set(node.id, 0);
+        adjList.set(node.id, []);
+      }
+      for (const edge of edges) {
+        adjList.get(edge.source)?.push(edge.target);
+        inDegree.set(edge.target, (inDegree.get(edge.target) ?? 0) + 1);
+      }
+      const queue = [];
+      for (const [nodeId, degree] of inDegree) {
+        if (degree === 0) {
+          queue.push(nodeId);
+        }
+      }
+      const result = [];
+      while (queue.length > 0) {
+        const node = queue.shift();
+        result.push(node);
+        for (const neighbor of adjList.get(node) ?? []) {
+          inDegree.set(neighbor, (inDegree.get(neighbor) ?? 1) - 1);
+          if (inDegree.get(neighbor) === 0) {
+            queue.push(neighbor);
+          }
+        }
+      }
+      return result;
+    }
+    function buildDependencyMap(nodes, edges) {
+      const deps = /* @__PURE__ */ new Map();
+      for (const node of nodes) {
+        deps.set(node.id, []);
+      }
+      for (const edge of edges) {
+        const existing = deps.get(edge.target) ?? [];
+        deps.set(edge.target, [...existing, edge.source]);
+      }
+      return deps;
+    }
+    exports$1.buildDependencyMap = buildDependencyMap;
+    exports$1.topologicalSort = topologicalSort;
+  }
+});
+
+// ../core/dist/chunk-FZCK5A7S.js
+var require_chunk_FZCK5A7S = chunk4MZ62VMF_js.__commonJS({
+  "../core/dist/chunk-FZCK5A7S.js"(exports$1) {
+    var types = chunk4MZ62VMF_js.__require("@genfeedai/types");
+    function detectCycles(nodes, edges) {
+      const visited = /* @__PURE__ */ new Set();
+      const recStack = /* @__PURE__ */ new Set();
+      function hasCycle(nodeId) {
+        if (recStack.has(nodeId)) return true;
+        if (visited.has(nodeId)) return false;
+        visited.add(nodeId);
+        recStack.add(nodeId);
+        const outgoing = edges.filter((e) => e.source === nodeId);
+        for (const edge of outgoing) {
+          if (hasCycle(edge.target)) return true;
+        }
+        recStack.delete(nodeId);
+        return false;
+      }
+      for (const node of nodes) {
+        if (hasCycle(node.id)) return true;
+      }
+      return false;
+    }
+    function validateWorkflow(nodes, edges) {
+      const errors = [];
+      const warnings = [];
+      for (const node of nodes) {
+        const nodeDef = types.NODE_DEFINITIONS[node.type];
+        if (!nodeDef) continue;
+        const incomingEdges = edges.filter((e) => e.target === node.id);
+        for (const input of nodeDef.inputs) {
+          if (input.required) {
+            const hasConnection = incomingEdges.some((e) => e.targetHandle === input.id);
+            if (!hasConnection) {
+              errors.push({
+                nodeId: node.id,
+                message: `Missing required input: ${input.label}`,
+                severity: "error"
+              });
+            }
+          }
+        }
+        if (node.type === "download") {
+          const hasMediaInput = incomingEdges.some(
+            (e) => e.targetHandle === "image" || e.targetHandle === "video"
+          );
+          if (!hasMediaInput) {
+            errors.push({
+              nodeId: node.id,
+              message: "Output node requires at least one Media input (image or video)",
+              severity: "error"
+            });
+          }
+        }
+      }
+      if (detectCycles(nodes, edges)) {
+        errors.push({
+          nodeId: nodes[0]?.id ?? "unknown",
+          message: "Workflow contains a cycle",
+          severity: "error"
+        });
+      }
+      return {
+        isValid: errors.length === 0,
+        errors,
+        warnings
+      };
+    }
+    function getHandleType(nodeType, handleId, direction) {
+      const nodeDef = types.NODE_DEFINITIONS[nodeType];
+      if (!nodeDef) return null;
+      const handles = direction === "source" ? nodeDef.outputs : nodeDef.inputs;
+      const handle = handles.find((h) => h.id === handleId);
+      return handle?.type ?? null;
+    }
+    function isValidConnection(sourceNodeType, sourceHandle, targetNodeType, targetHandle) {
+      const sourceType = getHandleType(sourceNodeType, sourceHandle, "source");
+      const targetType = getHandleType(targetNodeType, targetHandle, "target");
+      if (!sourceType || !targetType) return false;
+      return types.CONNECTION_RULES[sourceType]?.includes(targetType) ?? false;
+    }
+    function getCompatibleHandles(handleType) {
+      return types.CONNECTION_RULES[handleType] ?? [];
+    }
+    exports$1.detectCycles = detectCycles;
+    exports$1.getCompatibleHandles = getCompatibleHandles;
+    exports$1.getHandleType = getHandleType;
+    exports$1.isValidConnection = isValidConnection;
+    exports$1.validateWorkflow = validateWorkflow;
+  }
+});
+
+// ../core/dist/index.js
+var require_dist = chunk4MZ62VMF_js.__commonJS({
+  "../core/dist/index.js"(exports$1) {
+    var chunkOAAW6BNW_js = require_chunk_OAAW6BNW();
+    var chunkFZCK5A7S_js = require_chunk_FZCK5A7S();
+    var PRICING = {
+      // Image generation (per image)
+      "nano-banana": 0.039,
+      "nano-banana-pro": {
+        "1K": 0.15,
+        "2K": 0.15,
+        "4K": 0.3
+      },
+      // Legacy aliases
+      "imagen-4-fast": 0.039,
+      "imagen-4": 0.15,
+      // Video generation (per second)
+      "veo-3.1-fast": { withAudio: 0.15, withoutAudio: 0.1 },
+      "veo-3.1": { withAudio: 0.4, withoutAudio: 0.2 },
+      // Legacy aliases
+      "veo-3-fast": { withAudio: 0.15, withoutAudio: 0.1 },
+      "veo-3": { withAudio: 0.4, withoutAudio: 0.2 },
+      // LLM (per token, derived from $9.50/million)
+      llama: 95e-7,
+      // Luma Reframe
+      "luma-reframe-image": {
+        "photon-flash-1": 0.01,
+        "photon-1": 0.03
+      },
+      "luma-reframe-video": 0.06,
+      // per second
+      // Topaz Upscale (tiered by megapixels)
+      "topaz-image-upscale": [
+        { maxMP: 1, price: 0.05 },
+        { maxMP: 4, price: 0.08 },
+        { maxMP: 9, price: 0.16 },
+        { maxMP: 16, price: 0.27 },
+        { maxMP: 25, price: 0.41 },
+        { maxMP: Infinity, price: 0.82 }
+      ],
+      // Topaz Video (per 5 seconds based on resolution and fps)
+      "topaz-video-upscale": {
+        "720p-15": 0.014,
+        "720p-24": 0.022,
+        "720p-30": 0.027,
+        "720p-60": 0.054,
+        "1080p-15": 0.051,
+        "1080p-24": 0.081,
+        "1080p-30": 0.101,
+        "1080p-60": 0.203,
+        "4k-15": 0.187,
+        "4k-24": 0.299,
+        "4k-30": 0.373,
+        "4k-60": 0.747
+      }
+    };
+    var IMAGE_NODE_TYPES = ["imageGen", "image-gen", "ImageGenNode"];
+    var VIDEO_NODE_TYPES = ["videoGen", "video-gen", "VideoGenNode"];
+    var LUMA_NODE_TYPES = ["reframe", "lumaReframeImage", "lumaReframeVideo"];
+    var TOPAZ_NODE_TYPES = ["upscale", "topazImageUpscale", "topazVideoUpscale"];
+    var DEFAULT_VIDEO_DURATION = 8;
+    var ASPECT_RATIOS3 = [
+      "1:1",
+      "16:9",
+      "9:16",
+      "4:3",
+      "3:4",
+      "4:5",
+      "5:4",
+      "2:3",
+      "3:2",
+      "21:9"
+    ];
+    var VIDEO_ASPECT_RATIOS = ["16:9", "9:16"];
+    var RESOLUTIONS2 = ["1K", "2K", "4K"];
+    var VIDEO_RESOLUTIONS = ["720p", "1080p"];
+    var VIDEO_DURATIONS = [4, 6, 8];
+    var OUTPUT_FORMATS2 = ["jpg", "png", "webp"];
+    var LUMA_ASPECT_RATIOS2 = ["1:1", "3:4", "4:3", "9:16", "16:9", "9:21", "21:9"];
+    Object.defineProperty(exports$1, "buildDependencyMap", {
+      enumerable: true,
+      get: function() {
+        return chunkOAAW6BNW_js.buildDependencyMap;
+      }
+    });
+    Object.defineProperty(exports$1, "topologicalSort", {
+      enumerable: true,
+      get: function() {
+        return chunkOAAW6BNW_js.topologicalSort;
+      }
+    });
+    Object.defineProperty(exports$1, "detectCycles", {
+      enumerable: true,
+      get: function() {
+        return chunkFZCK5A7S_js.detectCycles;
+      }
+    });
+    Object.defineProperty(exports$1, "getCompatibleHandles", {
+      enumerable: true,
+      get: function() {
+        return chunkFZCK5A7S_js.getCompatibleHandles;
+      }
+    });
+    Object.defineProperty(exports$1, "getHandleType", {
+      enumerable: true,
+      get: function() {
+        return chunkFZCK5A7S_js.getHandleType;
+      }
+    });
+    Object.defineProperty(exports$1, "isValidConnection", {
+      enumerable: true,
+      get: function() {
+        return chunkFZCK5A7S_js.isValidConnection;
+      }
+    });
+    Object.defineProperty(exports$1, "validateWorkflow", {
+      enumerable: true,
+      get: function() {
+        return chunkFZCK5A7S_js.validateWorkflow;
+      }
+    });
+    exports$1.ASPECT_RATIOS = ASPECT_RATIOS3;
+    exports$1.DEFAULT_VIDEO_DURATION = DEFAULT_VIDEO_DURATION;
+    exports$1.IMAGE_NODE_TYPES = IMAGE_NODE_TYPES;
+    exports$1.LUMA_ASPECT_RATIOS = LUMA_ASPECT_RATIOS2;
+    exports$1.LUMA_NODE_TYPES = LUMA_NODE_TYPES;
+    exports$1.OUTPUT_FORMATS = OUTPUT_FORMATS2;
+    exports$1.PRICING = PRICING;
+    exports$1.RESOLUTIONS = RESOLUTIONS2;
+    exports$1.TOPAZ_NODE_TYPES = TOPAZ_NODE_TYPES;
+    exports$1.VIDEO_ASPECT_RATIOS = VIDEO_ASPECT_RATIOS;
+    exports$1.VIDEO_DURATIONS = VIDEO_DURATIONS;
+    exports$1.VIDEO_NODE_TYPES = VIDEO_NODE_TYPES;
+    exports$1.VIDEO_RESOLUTIONS = VIDEO_RESOLUTIONS;
+  }
+});
 var NodeErrorBoundary = class extends react.Component {
   constructor(props) {
     super(props);
@@ -204,18 +479,18 @@ function BaseNodeComponent({
   disabledInputs
 }) {
   const isResized = width !== void 0 || height !== void 0;
-  const selectNode = chunkEC2ZIWOK_js.useUIStore((state) => state.selectNode);
-  const selectedNodeId = chunkEC2ZIWOK_js.useUIStore((state) => state.selectedNodeId);
-  const highlightedNodeIds = chunkEC2ZIWOK_js.useUIStore((state) => state.highlightedNodeIds);
-  const toggleNodeLock = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.toggleNodeLock);
-  const isNodeLocked = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.isNodeLocked);
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
-  const executeNode = chunkEC2ZIWOK_js.useExecutionStore((state) => state.executeNode);
-  const isRunning = chunkEC2ZIWOK_js.useExecutionStore((state) => state.isRunning);
-  const stopExecution = chunkEC2ZIWOK_js.useExecutionStore((state) => state.stopExecution);
-  const stopNodeExecution = chunkEC2ZIWOK_js.useExecutionStore((state) => state.stopNodeExecution);
+  const selectNode = chunkAXFOCPPP_js.useUIStore((state) => state.selectNode);
+  const selectedNodeId = chunkAXFOCPPP_js.useUIStore((state) => state.selectedNodeId);
+  const highlightedNodeIds = chunkAXFOCPPP_js.useUIStore((state) => state.highlightedNodeIds);
+  const toggleNodeLock = chunkIHF35QZD_js.useWorkflowStore((state) => state.toggleNodeLock);
+  const isNodeLocked = chunkIHF35QZD_js.useWorkflowStore((state) => state.isNodeLocked);
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
+  const executeNode = chunkAXFOCPPP_js.useExecutionStore((state) => state.executeNode);
+  const isRunning = chunkAXFOCPPP_js.useExecutionStore((state) => state.isRunning);
+  const stopExecution = chunkAXFOCPPP_js.useExecutionStore((state) => state.stopExecution);
+  const stopNodeExecution = chunkAXFOCPPP_js.useExecutionStore((state) => state.stopNodeExecution);
   const updateNodeInternals = react$1.useUpdateNodeInternals();
-  const nodeDef = import_types.NODE_DEFINITIONS[type];
+  const nodeDef = types.NODE_DEFINITIONS[type];
   const nodeData = data;
   const nodeRef = react.useRef(null);
   const hoverTimeoutRef = react.useRef(null);
@@ -240,12 +515,12 @@ function BaseNodeComponent({
     return () => cancelAnimationFrame(rafId);
   }, [id, updateNodeInternals, handlesKey]);
   const isHighlighted = highlightedNodeIds.length === 0 || highlightedNodeIds.includes(id);
-  const nodeExecuting = chunkEC2ZIWOK_js.useExecutionStore((state) => state.activeNodeExecutions.has(id));
+  const nodeExecuting = chunkAXFOCPPP_js.useExecutionStore((state) => state.activeNodeExecutions.has(id));
   const handleRetry = react.useCallback(
     (e) => {
       e.stopPropagation();
       if (!nodeExecuting) {
-        updateNodeData(id, { error: void 0, status: import_types.NodeStatusEnum.PROCESSING });
+        updateNodeData(id, { error: void 0, status: types.NodeStatusEnum.PROCESSING });
         executeNode(id);
       }
     },
@@ -259,7 +534,7 @@ function BaseNodeComponent({
       } else if (nodeExecuting) {
         stopNodeExecution(id);
       } else {
-        updateNodeData(id, { status: import_types.NodeStatusEnum.IDLE, error: void 0 });
+        updateNodeData(id, { status: types.NodeStatusEnum.IDLE, error: void 0 });
       }
     },
     [id, isRunning, nodeExecuting, stopExecution, stopNodeExecution, updateNodeData]
@@ -948,9 +1223,9 @@ function ImageGenNodeComponent(props) {
   const { id, type, data } = props;
   const nodeData = data;
   const { ModelBrowserModal } = chunkRJ262NXS_js.useWorkflowUIConfig();
-  const openNodeDetailModal = chunkEC2ZIWOK_js.useUIStore((state) => state.openNodeDetailModal);
-  const { handleGenerate, handleStop } = chunkHPQT36RR_js.useNodeExecution(id);
-  const { canGenerate } = chunkHPQT36RR_js.useCanGenerate({
+  const openNodeDetailModal = chunkAXFOCPPP_js.useUIStore((state) => state.openNodeDetailModal);
+  const { handleGenerate, handleStop } = chunk3TMV3K34_js.useNodeExecution(id);
+  const { canGenerate } = chunk3TMV3K34_js.useCanGenerate({
     nodeId: id,
     nodeType: type,
     inputSchema: nodeData.selectedModel?.inputSchema,
@@ -978,12 +1253,12 @@ function ImageGenNodeComponent(props) {
       setTimeout(() => handleDownload(index), index * 100);
     });
   }, [nodeData.outputImages, handleDownload]);
-  const { handleModelSelect } = chunkHPQT36RR_js.useModelSelection({
+  const { handleModelSelect } = chunk3TMV3K34_js.useModelSelection({
     nodeId: id,
     modelMap: chunk3YFFDHC5_js.IMAGE_MODEL_MAP,
     fallbackModel: chunk3YFFDHC5_js.DEFAULT_IMAGE_MODEL
   });
-  chunkHPQT36RR_js.useAutoLoadModelSchema({
+  chunk3TMV3K34_js.useAutoLoadModelSchema({
     currentModel: nodeData.model,
     selectedModel: nodeData.selectedModel,
     modelIdMap: chunk3YFFDHC5_js.IMAGE_MODEL_ID_MAP,
@@ -995,7 +1270,7 @@ function ImageGenNodeComponent(props) {
     modelSupportsImageInput,
     handleSchemaParamChange,
     componentSchemas
-  } = chunkHPQT36RR_js.useAIGenNode({
+  } = chunk3TMV3K34_js.useAIGenNode({
     nodeId: id,
     selectedModel: nodeData.selectedModel,
     schemaParams: nodeData.schemaParams
@@ -1009,7 +1284,7 @@ function ImageGenNodeComponent(props) {
   );
   const isProcessing = nodeData.status === "processing";
   const handleModelBrowse = react.useCallback(() => setIsModelBrowserOpen(true), []);
-  const { titleElement, headerActions } = chunkHPQT36RR_js.useAIGenNodeHeader({
+  const { titleElement, headerActions } = chunk3TMV3K34_js.useAIGenNodeHeader({
     modelDisplayName,
     isProcessing,
     canGenerate,
@@ -1155,10 +1430,10 @@ var ImageGenNode = react.memo(ImageGenNodeComponent);
 function LipSyncNodeComponent(props) {
   const { id, type, data } = props;
   const nodeData = data;
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
-  const openNodeDetailModal = chunkEC2ZIWOK_js.useUIStore((state) => state.openNodeDetailModal);
-  const { handleGenerate } = chunkHPQT36RR_js.useNodeExecution(id);
-  const { canGenerate } = chunkHPQT36RR_js.useCanGenerate({
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
+  const openNodeDetailModal = chunkAXFOCPPP_js.useUIStore((state) => state.openNodeDetailModal);
+  const { handleGenerate } = chunk3TMV3K34_js.useNodeExecution(id);
+  const { canGenerate } = chunk3TMV3K34_js.useCanGenerate({
     nodeId: id,
     nodeType: type
   });
@@ -1294,10 +1569,10 @@ function LLMNodeComponent(props) {
   const { id, type, data } = props;
   const nodeData = data;
   const { ModelBrowserModal } = chunkRJ262NXS_js.useWorkflowUIConfig();
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
-  const openNodeDetailModal = chunkEC2ZIWOK_js.useUIStore((state) => state.openNodeDetailModal);
-  const { handleGenerate, handleStop } = chunkHPQT36RR_js.useNodeExecution(id);
-  const { canGenerate: hasRequiredConnections } = chunkHPQT36RR_js.useCanGenerate({
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
+  const openNodeDetailModal = chunkAXFOCPPP_js.useUIStore((state) => state.openNodeDetailModal);
+  const { handleGenerate, handleStop } = chunk3TMV3K34_js.useNodeExecution(id);
+  const { canGenerate: hasRequiredConnections } = chunk3TMV3K34_js.useCanGenerate({
     nodeId: id,
     nodeType: type
   });
@@ -1305,12 +1580,12 @@ function LLMNodeComponent(props) {
   const hasInputPrompt = !!nodeData.inputPrompt?.trim();
   const canGenerate = hasRequiredConnections && hasSystemPrompt && hasInputPrompt;
   const [isModelBrowserOpen, setIsModelBrowserOpen] = react.useState(false);
-  const { handleModelSelect } = chunkHPQT36RR_js.useModelSelection({
+  const { handleModelSelect } = chunk3TMV3K34_js.useModelSelection({
     nodeId: id,
     modelMap: chunk3YFFDHC5_js.LLM_MODEL_MAP,
     fallbackModel: chunk3YFFDHC5_js.DEFAULT_LLM_MODEL
   });
-  chunkHPQT36RR_js.useAutoLoadModelSchema({
+  chunk3TMV3K34_js.useAutoLoadModelSchema({
     currentModel: nodeData.model,
     selectedModel: nodeData.selectedModel,
     modelIdMap: chunk3YFFDHC5_js.LLM_MODEL_ID_MAP,
@@ -1343,7 +1618,7 @@ function LLMNodeComponent(props) {
   );
   const isProcessing = nodeData.status === "processing";
   const handleModelBrowse = react.useCallback(() => setIsModelBrowserOpen(true), []);
-  const { titleElement, headerActions } = chunkHPQT36RR_js.useAIGenNodeHeader({
+  const { titleElement, headerActions } = chunk3TMV3K34_js.useAIGenNodeHeader({
     modelDisplayName,
     isProcessing,
     canGenerate,
@@ -1499,10 +1774,10 @@ var DURATIONS = [
 function MotionControlNodeComponent(props) {
   const { id, type, data } = props;
   const nodeData = data;
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
-  const openNodeDetailModal = chunkEC2ZIWOK_js.useUIStore((state) => state.openNodeDetailModal);
-  const { handleGenerate, handleStop } = chunkHPQT36RR_js.useNodeExecution(id);
-  const { canGenerate } = chunkHPQT36RR_js.useCanGenerate({
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
+  const openNodeDetailModal = chunkAXFOCPPP_js.useUIStore((state) => state.openNodeDetailModal);
+  const { handleGenerate, handleStop } = chunk3TMV3K34_js.useNodeExecution(id);
+  const { canGenerate } = chunk3TMV3K34_js.useCanGenerate({
     nodeId: id,
     nodeType: type
   });
@@ -1736,9 +2011,9 @@ var VOICES = [
 function TextToSpeechNodeComponent(props) {
   const { id, type, data } = props;
   const nodeData = data;
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
-  const { handleGenerate } = chunkHPQT36RR_js.useNodeExecution(id);
-  const { canGenerate } = chunkHPQT36RR_js.useCanGenerate({
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
+  const { handleGenerate } = chunk3TMV3K34_js.useNodeExecution(id);
+  const { canGenerate } = chunk3TMV3K34_js.useCanGenerate({
     nodeId: id,
     nodeType: type
   });
@@ -1904,9 +2179,6 @@ function TextToSpeechNodeComponent(props) {
   ] }) });
 }
 var TextToSpeechNode = react.memo(TextToSpeechNodeComponent);
-
-// src/nodes/ai/TranscribeNode.tsx
-var import_types2 = chunkZ7PWFZG5_js.__toESM(chunkNSDLGLAQ_js.require_dist());
 var LANGUAGES = [
   { value: "auto", label: "Auto-detect" },
   { value: "en", label: "English" },
@@ -1921,10 +2193,10 @@ var LANGUAGES = [
 function TranscribeNodeComponent(props) {
   const { id, type, data } = props;
   const nodeData = data;
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
-  const executeNode = chunkEC2ZIWOK_js.useExecutionStore((state) => state.executeNode);
-  const openNodeDetailModal = chunkEC2ZIWOK_js.useUIStore((state) => state.openNodeDetailModal);
-  const { canGenerate } = chunkHPQT36RR_js.useCanGenerate({
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
+  const executeNode = chunkAXFOCPPP_js.useExecutionStore((state) => state.executeNode);
+  const openNodeDetailModal = chunkAXFOCPPP_js.useUIStore((state) => state.openNodeDetailModal);
+  const { canGenerate } = chunk3TMV3K34_js.useCanGenerate({
     nodeId: id,
     nodeType: type
   });
@@ -1943,7 +2215,7 @@ function TranscribeNodeComponent(props) {
     [id, updateNodeData]
   );
   const handleTranscribe = react.useCallback(() => {
-    updateNodeData(id, { status: import_types2.NodeStatusEnum.PROCESSING });
+    updateNodeData(id, { status: types.NodeStatusEnum.PROCESSING });
     executeNode(id);
   }, [id, executeNode, updateNodeData]);
   const handleExpand = react.useCallback(() => {
@@ -2019,21 +2291,21 @@ function VideoGenNodeComponent(props) {
   const { id, type, data } = props;
   const nodeData = data;
   const { ModelBrowserModal } = chunkRJ262NXS_js.useWorkflowUIConfig();
-  const openNodeDetailModal = chunkEC2ZIWOK_js.useUIStore((state) => state.openNodeDetailModal);
-  const { handleGenerate, handleStop } = chunkHPQT36RR_js.useNodeExecution(id);
-  const { canGenerate } = chunkHPQT36RR_js.useCanGenerate({
+  const openNodeDetailModal = chunkAXFOCPPP_js.useUIStore((state) => state.openNodeDetailModal);
+  const { handleGenerate, handleStop } = chunk3TMV3K34_js.useNodeExecution(id);
+  const { canGenerate } = chunk3TMV3K34_js.useCanGenerate({
     nodeId: id,
     nodeType: type,
     inputSchema: nodeData.selectedModel?.inputSchema,
     schemaParams: nodeData.schemaParams
   });
   const [isModelBrowserOpen, setIsModelBrowserOpen] = react.useState(false);
-  const { handleModelSelect } = chunkHPQT36RR_js.useModelSelection({
+  const { handleModelSelect } = chunk3TMV3K34_js.useModelSelection({
     nodeId: id,
     modelMap: chunk3YFFDHC5_js.VIDEO_MODEL_MAP,
     fallbackModel: chunk3YFFDHC5_js.DEFAULT_VIDEO_MODEL
   });
-  chunkHPQT36RR_js.useAutoLoadModelSchema({
+  chunk3TMV3K34_js.useAutoLoadModelSchema({
     currentModel: nodeData.model,
     selectedModel: nodeData.selectedModel,
     modelIdMap: chunk3YFFDHC5_js.VIDEO_MODEL_ID_MAP,
@@ -2045,7 +2317,7 @@ function VideoGenNodeComponent(props) {
     modelSupportsImageInput,
     handleSchemaParamChange,
     componentSchemas
-  } = chunkHPQT36RR_js.useAIGenNode({
+  } = chunk3TMV3K34_js.useAIGenNode({
     nodeId: id,
     selectedModel: nodeData.selectedModel,
     schemaParams: nodeData.schemaParams
@@ -2059,7 +2331,7 @@ function VideoGenNodeComponent(props) {
   );
   const isProcessing = nodeData.status === "processing";
   const handleModelBrowse = react.useCallback(() => setIsModelBrowserOpen(true), []);
-  const { titleElement, headerActions } = chunkHPQT36RR_js.useAIGenNodeHeader({
+  const { titleElement, headerActions } = chunk3TMV3K34_js.useAIGenNodeHeader({
     modelDisplayName,
     isProcessing,
     canGenerate,
@@ -2132,16 +2404,13 @@ function VideoGenNodeComponent(props) {
   );
 }
 var VideoGenNode = react.memo(VideoGenNodeComponent);
-
-// src/nodes/ai/VoiceChangeNode.tsx
-var import_types3 = chunkZ7PWFZG5_js.__toESM(chunkNSDLGLAQ_js.require_dist());
 function VoiceChangeNodeComponent(props) {
   const { id, type, data } = props;
   const nodeData = data;
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
-  const executeNode = chunkEC2ZIWOK_js.useExecutionStore((state) => state.executeNode);
-  const openNodeDetailModal = chunkEC2ZIWOK_js.useUIStore((state) => state.openNodeDetailModal);
-  const { canGenerate } = chunkHPQT36RR_js.useCanGenerate({
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
+  const executeNode = chunkAXFOCPPP_js.useExecutionStore((state) => state.executeNode);
+  const openNodeDetailModal = chunkAXFOCPPP_js.useUIStore((state) => state.openNodeDetailModal);
+  const { canGenerate } = chunk3TMV3K34_js.useCanGenerate({
     nodeId: id,
     nodeType: type
   });
@@ -2160,7 +2429,7 @@ function VoiceChangeNodeComponent(props) {
     [id, updateNodeData]
   );
   const handleProcess = react.useCallback(() => {
-    updateNodeData(id, { status: import_types3.NodeStatusEnum.PROCESSING });
+    updateNodeData(id, { status: types.NodeStatusEnum.PROCESSING });
     executeNode(id);
   }, [id, executeNode, updateNodeData]);
   const handleExpand = react.useCallback(() => {
@@ -2263,7 +2532,7 @@ var INPUT_TYPES = [
 function WorkflowInputNodeComponent(props) {
   const { id, data } = props;
   const nodeData = data;
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
   const handleNameChange = react.useCallback(
     (e) => {
       updateNodeData(id, {
@@ -2363,7 +2632,7 @@ var OUTPUT_TYPES = [
 function WorkflowOutputNodeComponent(props) {
   const { id, data } = props;
   const nodeData = data;
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
   const videoRef = react.useRef(null);
   const [isPlaying, setIsPlaying] = react.useState(false);
   const handleNameChange = react.useCallback(
@@ -2504,7 +2773,7 @@ function setWorkflowRefApi(api) {
 function WorkflowRefNodeComponent(props) {
   const { id, data, selected } = props;
   const nodeData = data;
-  const { updateNodeData, workflowId: currentWorkflowId } = chunkNSDLGLAQ_js.useWorkflowStore();
+  const { updateNodeData, workflowId: currentWorkflowId } = chunkIHF35QZD_js.useWorkflowStore();
   const [workflows, setWorkflows] = react.useState([]);
   const [isLoading, setIsLoading] = react.useState(false);
   const [error, setError] = react.useState(null);
@@ -2760,8 +3029,8 @@ var WorkflowRefNode = react.memo(WorkflowRefNodeComponent);
 function AudioInputNodeComponent(props) {
   const { id, data } = props;
   const nodeData = data;
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
-  const openNodeDetailModal = chunkEC2ZIWOK_js.useUIStore((state) => state.openNodeDetailModal);
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
+  const openNodeDetailModal = chunkAXFOCPPP_js.useUIStore((state) => state.openNodeDetailModal);
   const fileInputRef = react.useRef(null);
   const [showUrlInput, setShowUrlInput] = react.useState(false);
   const [urlValue, setUrlValue] = react.useState(nodeData.url || "");
@@ -2937,7 +3206,7 @@ var AudioInputNode = react.memo(AudioInputNodeComponent);
 function ImageInputNodeComponent(props) {
   const { id, data } = props;
   const nodeData = data;
-  const openNodeDetailModal = chunkEC2ZIWOK_js.useUIStore((state) => state.openNodeDetailModal);
+  const openNodeDetailModal = chunkAXFOCPPP_js.useUIStore((state) => state.openNodeDetailModal);
   const {
     fileInputRef,
     showUrlInput,
@@ -2949,7 +3218,7 @@ function ImageInputNodeComponent(props) {
     handleRemove,
     handleUrlSubmit,
     handleUrlKeyDown
-  } = chunkHPQT36RR_js.useMediaUpload({
+  } = chunk3TMV3K34_js.useMediaUpload({
     nodeId: id,
     mediaType: "image",
     initialUrl: nodeData.url || "",
@@ -3089,9 +3358,9 @@ var ImageInputNode = react.memo(ImageInputNodeComponent);
 function PromptConstructorNodeComponent(props) {
   const { id, data } = props;
   const nodeData = data;
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
-  const edges = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.edges);
-  const nodes = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.nodes);
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
+  const edges = chunkIHF35QZD_js.useWorkflowStore((state) => state.edges);
+  const nodes = chunkIHF35QZD_js.useWorkflowStore((state) => state.nodes);
   const [localTemplate, setLocalTemplate] = react.useState(nodeData.template);
   const [isEditing, setIsEditing] = react.useState(false);
   const textareaRef = react.useRef(null);
@@ -3125,7 +3394,7 @@ function PromptConstructorNodeComponent(props) {
     handleKeyDown,
     handleAutocompleteSelect,
     closeAutocomplete
-  } = chunkHPQT36RR_js.usePromptAutocomplete({
+  } = chunk3TMV3K34_js.usePromptAutocomplete({
     availableVariables,
     textareaRef,
     localTemplate,
@@ -3234,7 +3503,7 @@ function PromptNodeComponent(props) {
   const { id, data } = props;
   const nodeData = data;
   const { PromptPicker } = chunkRJ262NXS_js.useWorkflowUIConfig();
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
   const { openCreateModal } = chunkRXNEDWK2_js.usePromptLibraryStore();
   const { openEditor } = chunk6DOEUDD5_js.usePromptEditorStore();
   const handlePromptChange = react.useCallback(
@@ -3299,7 +3568,7 @@ var PromptNode = react.memo(PromptNodeComponent);
 function VideoInputNodeComponent(props) {
   const { id, data } = props;
   const nodeData = data;
-  const openNodeDetailModal = chunkEC2ZIWOK_js.useUIStore((state) => state.openNodeDetailModal);
+  const openNodeDetailModal = chunkAXFOCPPP_js.useUIStore((state) => state.openNodeDetailModal);
   const {
     fileInputRef,
     showUrlInput,
@@ -3311,7 +3580,7 @@ function VideoInputNodeComponent(props) {
     handleRemove,
     handleUrlSubmit,
     handleUrlKeyDown
-  } = chunkHPQT36RR_js.useMediaUpload({
+  } = chunk3TMV3K34_js.useMediaUpload({
     nodeId: id,
     mediaType: "video",
     initialUrl: nodeData.url || "",
@@ -3489,9 +3758,9 @@ function getExtensionFromUrl(url, inputType) {
 function DownloadNodeComponent(props) {
   const { id, data } = props;
   const nodeData = data;
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
-  const edges = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.edges);
-  const isRunning = chunkEC2ZIWOK_js.useExecutionStore((state) => state.isRunning);
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
+  const edges = chunkIHF35QZD_js.useWorkflowStore((state) => state.edges);
+  const isRunning = chunkAXFOCPPP_js.useExecutionStore((state) => state.isRunning);
   const [isDownloading, setIsDownloading] = react.useState(false);
   const isConnected = edges.some((edge) => edge.target === id);
   const activeMedia = nodeData.inputVideo || nodeData.inputImage;
@@ -3590,9 +3859,6 @@ function DownloadNodeComponent(props) {
 }
 var DownloadNode = react.memo(DownloadNodeComponent);
 var OutputNode = DownloadNode;
-
-// src/nodes/processing/AnimationNode.tsx
-var import_types4 = chunkZ7PWFZG5_js.__toESM(chunkNSDLGLAQ_js.require_dist());
 var PRESET_OPTIONS = [
   { value: "linear", label: "Linear" },
   { value: "easeIn", label: "Ease In" },
@@ -3611,10 +3877,10 @@ var PRESET_OPTIONS = [
 function AnimationNodeComponent(props) {
   const { id, type, data } = props;
   const nodeData = data;
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
-  const executeNode = chunkEC2ZIWOK_js.useExecutionStore((state) => state.executeNode);
-  const openNodeDetailModal = chunkEC2ZIWOK_js.useUIStore((state) => state.openNodeDetailModal);
-  const { hasRequiredInputs } = chunkHPQT36RR_js.useRequiredInputs(id, type);
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
+  const executeNode = chunkAXFOCPPP_js.useExecutionStore((state) => state.executeNode);
+  const openNodeDetailModal = chunkAXFOCPPP_js.useUIStore((state) => state.openNodeDetailModal);
+  const { hasRequiredInputs } = chunk3TMV3K34_js.useRequiredInputs(id, type);
   const handleCurveTypeChange = react.useCallback(
     (type2) => {
       updateNodeData(id, { curveType: type2 });
@@ -3640,7 +3906,7 @@ function AnimationNodeComponent(props) {
     [id, updateNodeData]
   );
   const handleProcess = react.useCallback(() => {
-    updateNodeData(id, { status: import_types4.NodeStatusEnum.PROCESSING });
+    updateNodeData(id, { status: types.NodeStatusEnum.PROCESSING });
     executeNode(id);
   }, [id, executeNode, updateNodeData]);
   const handleExpand = react.useCallback(() => {
@@ -3759,8 +4025,8 @@ function AnnotationNodeComponent(props) {
   const { id, data } = props;
   const nodeData = data;
   const openAnnotation = chunk6DOEUDD5_js.useAnnotationStore((state) => state.openAnnotation);
-  const openNodeDetailModal = chunkEC2ZIWOK_js.useUIStore((state) => state.openNodeDetailModal);
-  const getConnectedInputs = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.getConnectedInputs);
+  const openNodeDetailModal = chunkAXFOCPPP_js.useUIStore((state) => state.openNodeDetailModal);
+  const getConnectedInputs = chunkIHF35QZD_js.useWorkflowStore((state) => state.getConnectedInputs);
   const connectedInputs = getConnectedInputs(id);
   const inputImage = connectedInputs.get("image") ?? nodeData.inputImage;
   const handleEditAnnotations = react.useCallback(() => {
@@ -3824,11 +4090,110 @@ function AnnotationNodeComponent(props) {
   ] }) });
 }
 var AnnotationNode = react.memo(AnnotationNodeComponent);
+var B = react.forwardRef(({ transition: e, ...t }, r) => {
+  let o = { position: "absolute", top: 0, left: 0, width: "100%", height: "100%", transition: e ? `clip-path ${e}` : void 0, userSelect: "none", willChange: "clip-path, transition", KhtmlUserSelect: "none", MozUserSelect: "none", WebkitUserSelect: "none" };
+  return jsxRuntime.jsx("div", { ...t, style: o, "data-rcs": "clip-item", ref: r });
+});
+B.displayName = "ContainerClip";
+var W = react.forwardRef(({ children: e, disabled: t, portrait: r, position: o, transition: i }, m) => {
+  let u = { position: "absolute", top: 0, width: r ? "100%" : void 0, height: r ? void 0 : "100%", background: "none", border: 0, padding: 0, pointerEvents: "all", appearance: "none", WebkitAppearance: "none", MozAppearance: "none", outline: 0, transform: r ? "translate3d(0, -50% ,0)" : "translate3d(-50%, 0, 0)", transition: i ? `${r ? "top" : "left"} ${i}` : void 0 };
+  return jsxRuntime.jsx("button", { ref: m, "aria-label": "Drag to move or focus and use arrow keys", "aria-orientation": r ? "vertical" : "horizontal", "aria-valuemin": 0, "aria-valuemax": 100, "aria-valuenow": o, "data-rcs": "handle-container", disabled: t, role: "slider", style: u, children: e });
+});
+W.displayName = "ThisHandleContainer";
+var re = ({ flip: e }) => jsxRuntime.jsx("div", { className: "__rcs-handle-arrow", style: { width: 0, height: 0, borderTop: "8px solid transparent", borderRight: "10px solid", borderBottom: "8px solid transparent", transform: e ? "rotate(180deg)" : void 0 } });
+var F = ({ className: e = "__rcs-handle-root", disabled: t, buttonStyle: r, linesStyle: o, portrait: i, style: m, ...C }) => {
+  let u = { display: "flex", flexDirection: i ? "row" : "column", placeItems: "center", height: "100%", cursor: t ? "not-allowed" : i ? "ns-resize" : "ew-resize", pointerEvents: "none", color: "#fff", ...m }, E = { flexGrow: 1, height: i ? 2 : "100%", width: i ? "100%" : 2, backgroundColor: "currentColor", pointerEvents: "auto", boxShadow: "0 0 4px rgba(0,0,0,.5)", ...o }, y = { display: "grid", gridAutoFlow: "column", gap: 8, placeContent: "center", flexShrink: 0, width: 56, height: 56, borderRadius: "50%", borderStyle: "solid", borderWidth: 2, pointerEvents: "auto", backdropFilter: "blur(7px)", WebkitBackdropFilter: "blur(7px)", backgroundColor: "rgba(0, 0, 0, 0.125)", boxShadow: "0 0 4px rgba(0,0,0,.35)", transform: i ? "rotate(90deg)" : void 0, ...r };
+  return jsxRuntime.jsxs("div", { ...C, className: e, style: u, children: [jsxRuntime.jsx("div", { className: "__rcs-handle-line", style: E }), jsxRuntime.jsxs("div", { className: "__rcs-handle-button", style: y, children: [jsxRuntime.jsx(re, {}), jsxRuntime.jsx(re, { flip: true })] }), jsxRuntime.jsx("div", { className: "__rcs-handle-line", style: E })] });
+};
+var $ = ((i) => (i.ARROW_LEFT = "ArrowLeft", i.ARROW_RIGHT = "ArrowRight", i.ARROW_UP = "ArrowUp", i.ARROW_DOWN = "ArrowDown", i))($ || {});
+var G = ({ boxSizing: e = "border-box", objectFit: t = "cover", objectPosition: r = "center center", ...o } = {}) => ({ display: "block", width: "100%", height: "100%", maxWidth: "100%", boxSizing: e, objectFit: t, objectPosition: r, ...o });
+var oe = (e) => {
+  let t = react.useRef(e);
+  return react.useEffect(() => {
+    t.current = e;
+  }), t.current;
+};
+var U = (e, t, r, o) => {
+  let i = react.useRef();
+  react.useEffect(() => {
+    i.current = t;
+  }, [t]), react.useEffect(() => {
+    if (!(r && r.addEventListener)) return;
+    let m = (C) => i.current && i.current(C);
+    return r.addEventListener(e, m, o), () => {
+      r.removeEventListener(e, m, o);
+    };
+  }, [e, r, o]);
+};
+var Te = typeof window < "u" && typeof window.document < "u" && typeof window.document.createElement < "u" ? react.useLayoutEffect : react.useEffect;
+var ie = (e, t) => {
+  let r = react.useRef(), o = react.useCallback(() => {
+    e.current && r.current && r.current.observe(e.current);
+  }, [e]);
+  Te(() => (r.current = new ResizeObserver(([i]) => t(i.contentRect)), o(), () => {
+    r.current && r.current.disconnect();
+  }), [t, o]);
+};
+var I = { capture: false, passive: true };
+var X4 = { capture: true, passive: false };
+var Me = (e) => {
+  e.preventDefault(), e.currentTarget.focus();
+};
+var se = react.forwardRef(({ boundsPadding: e = 0, browsingContext: t = globalThis, changePositionOnHover: r = false, disabled: o = false, handle: i, itemOne: m, itemTwo: C, keyboardIncrement: u = "5%", onlyHandleDraggable: E = false, onPositionChange: y, portrait: a = false, position: g = 50, style: le, transition: ce, ...pe }, de) => {
+  let p = react.useRef(null), j = react.useRef(null), f = react.useRef(null), d = react.useRef(g), [L, q] = react.useState(false), [me, x] = react.useState(true), w = react.useRef(false), [ue, fe] = react.useState(), J = oe(g), l = react.useCallback(function({ x: s, y: c, isOffset: R }) {
+    let b = p.current, A = f.current, D = j.current, { width: h, height: S, left: Pe, top: Ee } = b.getBoundingClientRect();
+    if (h === 0 || S === 0) return;
+    let ye = a ? R ? c - Ee - t.scrollY : c : R ? s - Pe - t.scrollX : s, Q = Math.min(Math.max(ye / (a ? S : h) * 100, 0), 100), z = a ? S / (b.offsetHeight || 1) : h / (b.offsetWidth || 1), Z = e * z / (a ? S : h) * 100, _ = Math.min(Math.max(Q, Z * z), 100 - Z * z);
+    d.current = Q, A.setAttribute("aria-valuenow", `${Math.round(d.current)}`), A.style.top = a ? `${_}%` : "0", A.style.left = a ? "0" : `${_}%`, D.style.clipPath = a ? `inset(${_}% 0 0 0)` : `inset(0 0 0 ${_}%)`, y && y(d.current);
+  }, [e, y, a, t]);
+  react.useEffect(() => {
+    let { width: n, height: s } = p.current.getBoundingClientRect(), c = g === J ? d.current : g;
+    l({ x: n / 100 * c, y: s / 100 * c });
+  }, [e, g, a, J, l]);
+  let Re = react.useCallback((n) => {
+    n.preventDefault(), !(o || n.button !== 0) && (l({ isOffset: true, x: n.pageX, y: n.pageY }), q(true), x(true));
+  }, [o, l]), v = react.useCallback(function(s) {
+    l({ isOffset: true, x: s.pageX, y: s.pageY }), x(false);
+  }, [l]), T = react.useCallback(() => {
+    q(false), x(true);
+  }, []), Se = react.useCallback(({ width: n, height: s }) => {
+    let { width: c, height: R } = p.current.getBoundingClientRect();
+    l({ x: n / 100 * d.current * c / n, y: s / 100 * d.current * R / s });
+  }, [l]), Ce = react.useCallback((n) => {
+    if (!Object.values($).includes(n.key)) return;
+    n.preventDefault(), x(true);
+    let { top: s, left: c } = f.current.getBoundingClientRect(), { width: R, height: b } = p.current.getBoundingClientRect(), D = typeof u == "string" ? parseFloat(u) : u / R * 100, h = a ? n.key === "ArrowLeft" || n.key === "ArrowDown" : n.key === "ArrowRight" || n.key === "ArrowUp", S = Math.min(Math.max(h ? d.current + D : d.current - D, 0), 100);
+    l({ x: a ? c : R * S / 100, y: a ? b * S / 100 : s });
+  }, [u, a, l]);
+  react.useEffect(() => {
+    fe(E ? f.current : p.current);
+  }, [E]), react.useEffect(() => {
+    let n = p.current, s = () => {
+      L || T();
+    };
+    return r && (n.addEventListener("pointermove", v, I), n.addEventListener("pointerleave", s, I)), () => {
+      n.removeEventListener("pointermove", v), n.removeEventListener("pointerleave", s);
+    };
+  }, [r, v, T, L]), react.useEffect(() => (L && !w.current && (t.addEventListener("pointermove", v, I), t.addEventListener("pointerup", T, I), w.current = true), () => {
+    w.current && (t.removeEventListener("pointermove", v), t.removeEventListener("pointerup", T), w.current = false);
+  }), [v, T, L, t]), react.useImperativeHandle(de, () => ({ rootContainer: p.current, handleContainer: f.current, setPosition(n) {
+    let { width: s, height: c } = p.current.getBoundingClientRect();
+    l({ x: s / 100 * n, y: c / 100 * n });
+  } }), [l]), ie(p, Se), U("keydown", Ce, f.current, X4), U("click", Me, f.current, X4), U("pointerdown", Re, ue, X4);
+  let ve = i || jsxRuntime.jsx(F, { disabled: o, portrait: a }), K = me ? ce : void 0, he = { position: "relative", display: "flex", overflow: "hidden", cursor: L ? a ? "ns-resize" : "ew-resize" : void 0, touchAction: "none", userSelect: "none", KhtmlUserSelect: "none", msUserSelect: "none", MozUserSelect: "none", WebkitUserSelect: "none", ...le };
+  return jsxRuntime.jsxs("div", { ...pe, ref: p, style: he, "data-rcs": "root", children: [m, jsxRuntime.jsx(B, { ref: j, transition: K, children: C }), jsxRuntime.jsx(W, { disabled: o, portrait: a, position: Math.round(d.current), ref: f, transition: K, children: ve })] });
+});
+se.displayName = "ReactCompareSlider";
+var ae = react.forwardRef(({ style: e, ...t }, r) => {
+  let o = G(e);
+  return jsxRuntime.jsx("img", { ref: r, ...t, style: o, "data-rcs": "image" });
+});
+ae.displayName = "ReactCompareSliderImage";
 function ImageCompareNodeComponent(props) {
   const { id, data } = props;
   const nodeData = data;
-  const edges = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.edges);
-  const nodes = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.nodes);
+  const edges = chunkIHF35QZD_js.useWorkflowStore((state) => state.edges);
+  const nodes = chunkIHF35QZD_js.useWorkflowStore((state) => state.nodes);
   const displayImages = react.useMemo(() => {
     const connectedImages = [];
     const sortedEdges = edges.filter((edge) => edge.target === id).sort((a, b) => {
@@ -3858,10 +4223,10 @@ function ImageCompareNodeComponent(props) {
   const imageB = displayImages[1] || nodeData.imageB || null;
   return /* @__PURE__ */ jsxRuntime.jsx(BaseNode, { ...props, children: imageA && imageB ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 relative nodrag nopan nowheel min-h-[200px]", children: [
     /* @__PURE__ */ jsxRuntime.jsx(
-      reactCompareSlider.ReactCompareSlider,
+      se,
       {
         itemOne: /* @__PURE__ */ jsxRuntime.jsx(
-          reactCompareSlider.ReactCompareSliderImage,
+          ae,
           {
             src: imageA,
             alt: "Image A",
@@ -3869,7 +4234,7 @@ function ImageCompareNodeComponent(props) {
           }
         ),
         itemTwo: /* @__PURE__ */ jsxRuntime.jsx(
-          reactCompareSlider.ReactCompareSliderImage,
+          ae,
           {
             src: imageB,
             alt: "Image B",
@@ -3889,9 +4254,6 @@ function ImageCompareNodeComponent(props) {
   ] }) });
 }
 var ImageCompareNode = react.memo(ImageCompareNodeComponent);
-
-// src/nodes/processing/ImageGridSplitNode.tsx
-var import_types5 = chunkZ7PWFZG5_js.__toESM(chunkNSDLGLAQ_js.require_dist());
 var OUTPUT_FORMATS = [
   { value: "jpg", label: "JPEG" },
   { value: "png", label: "PNG" },
@@ -3900,8 +4262,8 @@ var OUTPUT_FORMATS = [
 function ImageGridSplitNodeComponent(props) {
   const { id, data } = props;
   const nodeData = data;
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
-  const executeNode = chunkEC2ZIWOK_js.useExecutionStore((state) => state.executeNode);
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
+  const executeNode = chunkAXFOCPPP_js.useExecutionStore((state) => state.executeNode);
   const [selectedPreview, setSelectedPreview] = react.useState(null);
   const handleRowsChange = react.useCallback(
     (e) => {
@@ -3942,7 +4304,7 @@ function ImageGridSplitNodeComponent(props) {
     [id, updateNodeData]
   );
   const handleProcess = react.useCallback(() => {
-    updateNodeData(id, { status: import_types5.NodeStatusEnum.PROCESSING });
+    updateNodeData(id, { status: types.NodeStatusEnum.PROCESSING });
     executeNode(id);
   }, [id, executeNode, updateNodeData]);
   const handleDownload = react.useCallback(
@@ -4169,7 +4531,7 @@ var ImageGridSplitNode = react.memo(ImageGridSplitNodeComponent);
 function OutputGalleryNodeComponent(props) {
   const { id, data } = props;
   const nodeData = data;
-  const { edges, nodes } = chunkNSDLGLAQ_js.useWorkflowStore(
+  const { edges, nodes } = chunkIHF35QZD_js.useWorkflowStore(
     shallow.useShallow((state) => ({ edges: state.edges, nodes: state.nodes }))
   );
   const [lightboxIndex, setLightboxIndex] = react.useState(null);
@@ -4357,9 +4719,6 @@ function OutputGalleryNodeComponent(props) {
   ] });
 }
 var OutputGalleryNode = react.memo(OutputGalleryNodeComponent);
-
-// src/nodes/processing/ReframeNode.tsx
-var import_types6 = chunkZ7PWFZG5_js.__toESM(chunkNSDLGLAQ_js.require_dist());
 var MODELS = [
   { value: "photon-flash-1", label: "Photon Flash", price: "$0.01" },
   { value: "photon-1", label: "Photon", price: "$0.03" }
@@ -4376,8 +4735,8 @@ var ASPECT_RATIOS2 = [
 function ReframeNodeComponent(props) {
   const { id, data } = props;
   const nodeData = data;
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
-  const executeNode = chunkEC2ZIWOK_js.useExecutionStore((state) => state.executeNode);
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
+  const executeNode = chunkAXFOCPPP_js.useExecutionStore((state) => state.executeNode);
   const videoRef = react.useRef(null);
   const [isPlaying, setIsPlaying] = react.useState(false);
   const inputType = nodeData.inputType ?? (nodeData.inputImage ? "image" : nodeData.inputVideo ? "video" : null);
@@ -4412,7 +4771,7 @@ function ReframeNodeComponent(props) {
     [id, updateNodeData]
   );
   const handleProcess = react.useCallback(() => {
-    updateNodeData(id, { status: import_types6.NodeStatusEnum.PROCESSING });
+    updateNodeData(id, { status: types.NodeStatusEnum.PROCESSING });
     executeNode(id);
   }, [id, executeNode, updateNodeData]);
   const togglePlayback = react.useCallback(() => {
@@ -4537,7 +4896,7 @@ function ReframeNodeComponent(props) {
 var ReframeNode = react.memo(ReframeNodeComponent);
 
 // src/nodes/processing/ResizeNode.tsx
-var import_types7 = chunkZ7PWFZG5_js.__toESM(chunkNSDLGLAQ_js.require_dist());
+var import_core = chunk4MZ62VMF_js.__toESM(require_dist());
 var MODELS2 = {
   image: { id: "photon-flash-1", label: "Luma Photon Flash", price: "$0.01" },
   video: { id: "luma-reframe", label: "Luma Reframe", price: "$0.05" }
@@ -4545,8 +4904,8 @@ var MODELS2 = {
 function ResizeNodeComponent(props) {
   const { id, data } = props;
   const nodeData = data;
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
-  const executeNode = chunkEC2ZIWOK_js.useExecutionStore((state) => state.executeNode);
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
+  const executeNode = chunkAXFOCPPP_js.useExecutionStore((state) => state.executeNode);
   const mediaType = nodeData.inputType ?? "image";
   const currentModel = MODELS2[mediaType];
   const handleTypeChange = react.useCallback(
@@ -4578,7 +4937,7 @@ function ResizeNodeComponent(props) {
     [id, updateNodeData]
   );
   const handleProcess = react.useCallback(() => {
-    updateNodeData(id, { status: import_types7.NodeStatusEnum.PROCESSING });
+    updateNodeData(id, { status: types.NodeStatusEnum.PROCESSING });
     executeNode(id);
   }, [id, executeNode, updateNodeData]);
   return /* @__PURE__ */ jsxRuntime.jsx(BaseNode, { ...props, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-3", children: [
@@ -4601,7 +4960,7 @@ function ResizeNodeComponent(props) {
       /* @__PURE__ */ jsxRuntime.jsx(chunk3SPPKCWR_js.Label, { className: "text-xs", children: "Target Aspect Ratio" }),
       /* @__PURE__ */ jsxRuntime.jsxs(chunk3SPPKCWR_js.Select, { value: nodeData.targetAspectRatio, onValueChange: handleAspectRatioChange, children: [
         /* @__PURE__ */ jsxRuntime.jsx(chunk3SPPKCWR_js.SelectTrigger, { className: "nodrag h-9 w-full", children: /* @__PURE__ */ jsxRuntime.jsx(chunk3SPPKCWR_js.SelectValue, {}) }),
-        /* @__PURE__ */ jsxRuntime.jsx(chunk3SPPKCWR_js.SelectContent, { children: core.LUMA_ASPECT_RATIOS.map((ratio) => /* @__PURE__ */ jsxRuntime.jsx(chunk3SPPKCWR_js.SelectItem, { value: ratio, children: ratio }, ratio)) })
+        /* @__PURE__ */ jsxRuntime.jsx(chunk3SPPKCWR_js.SelectContent, { children: import_core.LUMA_ASPECT_RATIOS.map((ratio) => /* @__PURE__ */ jsxRuntime.jsx(chunk3SPPKCWR_js.SelectItem, { value: ratio, children: ratio }, ratio)) })
       ] })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsx(
@@ -4672,9 +5031,6 @@ function ResizeNodeComponent(props) {
   ] }) });
 }
 var ResizeNode = react.memo(ResizeNodeComponent);
-
-// src/nodes/processing/SubtitleNode.tsx
-var import_types8 = chunkZ7PWFZG5_js.__toESM(chunkNSDLGLAQ_js.require_dist());
 var STYLE_OPTIONS = [
   { value: "modern", label: "Modern" },
   { value: "default", label: "Default" },
@@ -4689,8 +5045,8 @@ var POSITION_OPTIONS = [
 function SubtitleNodeComponent(props) {
   const { id, data } = props;
   const nodeData = data;
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
-  const executeNode = chunkEC2ZIWOK_js.useExecutionStore((state) => state.executeNode);
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
+  const executeNode = chunkAXFOCPPP_js.useExecutionStore((state) => state.executeNode);
   const handleStyleChange = react.useCallback(
     (value) => {
       updateNodeData(id, { style: value });
@@ -4716,7 +5072,7 @@ function SubtitleNodeComponent(props) {
     [id, updateNodeData]
   );
   const handleProcess = react.useCallback(() => {
-    updateNodeData(id, { status: import_types8.NodeStatusEnum.PROCESSING });
+    updateNodeData(id, { status: types.NodeStatusEnum.PROCESSING });
     executeNode(id);
   }, [id, executeNode, updateNodeData]);
   const hasRequiredInputs = nodeData.inputVideo && nodeData.inputText;
@@ -4797,9 +5153,6 @@ function SubtitleNodeComponent(props) {
   ] }) });
 }
 var SubtitleNode = react.memo(SubtitleNodeComponent);
-
-// src/nodes/processing/UpscaleNode.tsx
-var import_types9 = chunkZ7PWFZG5_js.__toESM(chunkNSDLGLAQ_js.require_dist());
 var IMAGE_MODELS2 = [
   { value: "topaz-standard-v2", label: "Standard V2" },
   { value: "topaz-low-res-v2", label: "Low Resolution V2" },
@@ -4830,9 +5183,9 @@ var FPS_OPTIONS = [
 function UpscaleNodeComponent(props) {
   const { id, data } = props;
   const nodeData = data;
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
-  const executeNode = chunkEC2ZIWOK_js.useExecutionStore((state) => state.executeNode);
-  const openNodeDetailModal = chunkEC2ZIWOK_js.useUIStore((state) => state.openNodeDetailModal);
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
+  const executeNode = chunkAXFOCPPP_js.useExecutionStore((state) => state.executeNode);
+  const openNodeDetailModal = chunkAXFOCPPP_js.useUIStore((state) => state.openNodeDetailModal);
   const videoRef = react.useRef(null);
   const [isPlaying, setIsPlaying] = react.useState(false);
   const inputType = nodeData.inputType ?? (nodeData.inputImage ? "image" : nodeData.inputVideo ? "video" : null);
@@ -4908,7 +5261,7 @@ function UpscaleNodeComponent(props) {
     [id, updateNodeData]
   );
   const handleProcess = react.useCallback(() => {
-    updateNodeData(id, { status: import_types9.NodeStatusEnum.PROCESSING });
+    updateNodeData(id, { status: types.NodeStatusEnum.PROCESSING });
     executeNode(id);
   }, [id, executeNode, updateNodeData]);
   const handleExpand = react.useCallback(() => {
@@ -5170,9 +5523,6 @@ function UpscaleNodeComponent(props) {
   ] }) });
 }
 var UpscaleNode = react.memo(UpscaleNodeComponent);
-
-// src/nodes/processing/VideoFrameExtractNode.tsx
-var import_types10 = chunkZ7PWFZG5_js.__toESM(chunkNSDLGLAQ_js.require_dist());
 var SELECTION_MODES = [
   { value: "last", label: "Last Frame" },
   { value: "first", label: "First Frame" }
@@ -5185,8 +5535,8 @@ function formatTime(seconds) {
 function VideoFrameExtractNodeComponent(props) {
   const { id, data } = props;
   const nodeData = data;
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
-  const executeNode = chunkEC2ZIWOK_js.useExecutionStore((state) => state.executeNode);
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
+  const executeNode = chunkAXFOCPPP_js.useExecutionStore((state) => state.executeNode);
   const handleModeChange = react.useCallback(
     (value) => {
       updateNodeData(id, { selectionMode: value });
@@ -5194,7 +5544,7 @@ function VideoFrameExtractNodeComponent(props) {
     [id, updateNodeData]
   );
   const handleProcess = react.useCallback(() => {
-    updateNodeData(id, { status: import_types10.NodeStatusEnum.PROCESSING });
+    updateNodeData(id, { status: types.NodeStatusEnum.PROCESSING });
     executeNode(id);
   }, [id, executeNode, updateNodeData]);
   return /* @__PURE__ */ jsxRuntime.jsx(BaseNode, { ...props, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
@@ -5246,9 +5596,6 @@ function VideoFrameExtractNodeComponent(props) {
   ] }) });
 }
 var VideoFrameExtractNode = react.memo(VideoFrameExtractNodeComponent);
-
-// src/nodes/processing/VideoStitchNode.tsx
-var import_types11 = chunkZ7PWFZG5_js.__toESM(chunkNSDLGLAQ_js.require_dist());
 var TRANSITIONS = [
   { value: "cut", label: "Cut (No transition)" },
   { value: "crossfade", label: "Crossfade" },
@@ -5263,8 +5610,8 @@ function VideoStitchNodeComponent(props) {
   const { id, data } = props;
   const nodeData = data;
   const inputVideos = nodeData.inputVideos ?? [];
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
-  const executeNode = chunkEC2ZIWOK_js.useExecutionStore((state) => state.executeNode);
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
+  const executeNode = chunkAXFOCPPP_js.useExecutionStore((state) => state.executeNode);
   const handleTransitionChange = react.useCallback(
     (value) => {
       updateNodeData(id, {
@@ -5310,7 +5657,7 @@ function VideoStitchNodeComponent(props) {
     [id, updateNodeData]
   );
   const handleProcess = react.useCallback(() => {
-    updateNodeData(id, { status: import_types11.NodeStatusEnum.PROCESSING });
+    updateNodeData(id, { status: types.NodeStatusEnum.PROCESSING });
     executeNode(id);
   }, [id, executeNode, updateNodeData]);
   return /* @__PURE__ */ jsxRuntime.jsx(BaseNode, { ...props, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
@@ -5444,9 +5791,6 @@ function VideoStitchNodeComponent(props) {
   ] }) });
 }
 var VideoStitchNode = react.memo(VideoStitchNodeComponent);
-
-// src/nodes/processing/VideoTrimNode.tsx
-var import_types12 = chunkZ7PWFZG5_js.__toESM(chunkNSDLGLAQ_js.require_dist());
 function formatTime2(seconds) {
   const mins = Math.floor(seconds / 60);
   const secs = Math.floor(seconds % 60);
@@ -5459,9 +5803,9 @@ function parseTime(timeStr) {
 function VideoTrimNodeComponent(props) {
   const { id, data } = props;
   const nodeData = data;
-  const updateNodeData = chunkNSDLGLAQ_js.useWorkflowStore((state) => state.updateNodeData);
-  const executeNode = chunkEC2ZIWOK_js.useExecutionStore((state) => state.executeNode);
-  const openNodeDetailModal = chunkEC2ZIWOK_js.useUIStore((state) => state.openNodeDetailModal);
+  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
+  const executeNode = chunkAXFOCPPP_js.useExecutionStore((state) => state.executeNode);
+  const openNodeDetailModal = chunkAXFOCPPP_js.useUIStore((state) => state.openNodeDetailModal);
   const hasRequiredInputs = !!nodeData.inputVideo;
   const handleStartTimeChange = react.useCallback(
     (e) => {
@@ -5490,7 +5834,7 @@ function VideoTrimNodeComponent(props) {
     [id, updateNodeData]
   );
   const handleProcess = react.useCallback(() => {
-    updateNodeData(id, { status: import_types12.NodeStatusEnum.PROCESSING });
+    updateNodeData(id, { status: types.NodeStatusEnum.PROCESSING });
     executeNode(id);
   }, [id, executeNode, updateNodeData]);
   const handleExpand = react.useCallback(() => {