@genfeedai/workflow-ui 0.1.0 → 0.1.1

package/dist/chunk-RIGVIEYB.mjs

@@ -0,0 +1,1093 @@
+import { temporal } from 'zundo';
+import { create } from 'zustand';
+import { NODE_DEFINITIONS, CONNECTION_RULES } from '@genfeedai/types';
+import { addEdge, applyEdgeChanges, applyNodeChanges } from '@xyflow/react';
+import { nanoid } from 'nanoid';
+
+// src/stores/workflow/helpers/equality.ts
+function temporalStateEquals(a, b) {
+  if (a === b) return true;
+  if (!arraysShallowEqual(a.nodes, b.nodes, nodeEquals)) return false;
+  if (!arraysShallowEqual(a.edges, b.edges, edgeEquals)) return false;
+  if (!arraysShallowEqual(a.groups, b.groups, groupEquals)) return false;
+  return true;
+}
+function arraysShallowEqual(a, b, itemEquals) {
+  if (a === b) return true;
+  if (a.length !== b.length) return false;
+  for (let i = 0; i < a.length; i++) {
+    if (!itemEquals(a[i], b[i])) return false;
+  }
+  return true;
+}
+function nodeEquals(a, b) {
+  if (a === b) return true;
+  if (a.id !== b.id) return false;
+  if (a.type !== b.type) return false;
+  if (a.position.x !== b.position.x || a.position.y !== b.position.y) return false;
+  if (a.width !== b.width || a.height !== b.height) return false;
+  const aData = a.data;
+  const bData = b.data;
+  if (aData.status !== bData.status) return false;
+  if (aData.outputImage !== bData.outputImage) return false;
+  if (aData.outputVideo !== bData.outputVideo) return false;
+  if (aData.outputText !== bData.outputText) return false;
+  if (aData.outputAudio !== bData.outputAudio) return false;
+  if (aData.prompt !== bData.prompt) return false;
+  if (aData.image !== bData.image) return false;
+  if (aData.video !== bData.video) return false;
+  if (aData.audio !== bData.audio) return false;
+  if (aData.inputPrompt !== bData.inputPrompt) return false;
+  if (aData.inputImage !== bData.inputImage) return false;
+  if (aData.inputVideo !== bData.inputVideo) return false;
+  if (aData.inputAudio !== bData.inputAudio) return false;
+  if (aData.inputText !== bData.inputText) return false;
+  if (aData.model !== bData.model) return false;
+  if (aData.schemaParams !== bData.schemaParams) {
+    if (JSON.stringify(aData.schemaParams) !== JSON.stringify(bData.schemaParams)) {
+      return false;
+    }
+  }
+  return true;
+}
+function edgeEquals(a, b) {
+  if (a === b) return true;
+  return a.id === b.id && a.source === b.source && a.target === b.target && a.sourceHandle === b.sourceHandle && a.targetHandle === b.targetHandle;
+}
+function groupEquals(a, b) {
+  if (a === b) return true;
+  if (a.id !== b.id) return false;
+  if (a.name !== b.name) return false;
+  if (a.color !== b.color) return false;
+  if (a.nodeIds.length !== b.nodeIds.length) return false;
+  for (let i = 0; i < a.nodeIds.length; i++) {
+    if (a.nodeIds[i] !== b.nodeIds[i]) return false;
+  }
+  return true;
+}
+
+// src/stores/workflow/slices/chatSlice.ts
+var createChatSlice = (set, get) => ({
+  chatMessages: [],
+  isChatOpen: false,
+  addChatMessage: (role, content) => {
+    set((state) => ({
+      chatMessages: [
+        ...state.chatMessages,
+        {
+          id: `msg-${Date.now()}-${Math.random().toString(36).slice(2, 8)}`,
+          role,
+          content,
+          timestamp: Date.now()
+        }
+      ]
+    }));
+  },
+  clearChatMessages: () => {
+    set({ chatMessages: [] });
+  },
+  toggleChat: () => {
+    set((state) => ({ isChatOpen: !state.isChatOpen }));
+  },
+  setChatOpen: (open) => {
+    set({ isChatOpen: open });
+  },
+  applyChatEditOperations: (operations) => {
+    const state = get();
+    state.captureSnapshot();
+    return state.applyEditOperations(operations);
+  }
+});
+function generateId() {
+  return nanoid(8);
+}
+function getHandleType(nodeType, handleId, direction) {
+  const nodeDef = 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;
+}
+
+// src/stores/workflow/slices/edgeSlice.ts
+var createEdgeSlice = (set, get) => ({
+  onNodesChange: (changes) => {
+    const hasMeaningfulChange = changes.some(
+      (change) => change.type === "add" || change.type === "remove" || change.type === "replace"
+    );
+    set((state) => ({
+      nodes: applyNodeChanges(changes, state.nodes),
+      ...hasMeaningfulChange && { isDirty: true }
+    }));
+  },
+  onEdgesChange: (changes) => {
+    const hasMeaningfulChange = changes.some(
+      (change) => change.type === "add" || change.type === "remove" || change.type === "replace"
+    );
+    set((state) => ({
+      edges: applyEdgeChanges(changes, state.edges),
+      ...hasMeaningfulChange && { isDirty: true }
+    }));
+  },
+  onConnect: (connection) => {
+    const { isValidConnection, propagateOutputsDownstream } = get();
+    if (!isValidConnection(connection)) return;
+    set((state) => ({
+      edges: addEdge(
+        {
+          ...connection,
+          id: generateId(),
+          type: state.edgeStyle
+        },
+        state.edges
+      ),
+      isDirty: true
+    }));
+    if (connection.source) {
+      propagateOutputsDownstream(connection.source);
+    }
+  },
+  removeEdge: (edgeId) => {
+    set((state) => ({
+      edges: state.edges.filter((edge) => edge.id !== edgeId),
+      isDirty: true
+    }));
+  },
+  setEdgeStyle: (style) => {
+    set((state) => ({
+      edgeStyle: style,
+      edges: state.edges.map((edge) => ({ ...edge, type: style })),
+      isDirty: true
+    }));
+  },
+  toggleEdgePause: (edgeId) => {
+    set((state) => ({
+      edges: state.edges.map(
+        (edge) => edge.id === edgeId ? {
+          ...edge,
+          data: {
+            ...edge.data,
+            hasPause: !edge.data?.hasPause
+          }
+        } : edge
+      ),
+      isDirty: true
+    }));
+  },
+  isValidConnection: (connection) => {
+    const { nodes } = get();
+    const sourceNode = nodes.find((n) => n.id === connection.source);
+    const targetNode = nodes.find((n) => n.id === connection.target);
+    if (!sourceNode || !targetNode) return false;
+    const sourceType = getHandleType(
+      sourceNode.type,
+      connection.sourceHandle ?? null,
+      "source"
+    );
+    const targetType = getHandleType(
+      targetNode.type,
+      connection.targetHandle ?? null,
+      "target"
+    );
+    if (!sourceType || !targetType) return false;
+    return CONNECTION_RULES[sourceType]?.includes(targetType) ?? false;
+  },
+  findCompatibleHandle: (sourceNodeId, sourceHandleId, targetNodeId) => {
+    const { nodes, edges } = get();
+    const sourceNode = nodes.find((n) => n.id === sourceNodeId);
+    const targetNode = nodes.find((n) => n.id === targetNodeId);
+    if (!sourceNode || !targetNode) return null;
+    const sourceType = getHandleType(sourceNode.type, sourceHandleId, "source");
+    if (!sourceType) return null;
+    const targetDef = NODE_DEFINITIONS[targetNode.type];
+    if (!targetDef) return null;
+    const existingTargetHandles = new Set(
+      edges.filter((e) => e.target === targetNodeId).map((e) => e.targetHandle)
+    );
+    for (const input of targetDef.inputs) {
+      const hasExistingConnection = existingTargetHandles.has(input.id);
+      if (hasExistingConnection && !input.multiple) continue;
+      if (CONNECTION_RULES[sourceType]?.includes(input.type)) {
+        return input.id;
+      }
+    }
+    return null;
+  }
+});
+
+// src/stores/workflow/slices/groupSlice.ts
+var DEFAULT_GROUP_COLORS = [
+  "purple",
+  "blue",
+  "green",
+  "yellow",
+  "orange",
+  "red",
+  "pink",
+  "gray"
+];
+var createGroupSlice = (set, get) => ({
+  createGroup: (nodeIds, name) => {
+    if (nodeIds.length === 0) return "";
+    const groupId = generateId();
+    const { groups } = get();
+    const colorIndex = groups.length % DEFAULT_GROUP_COLORS.length;
+    const newGroup = {
+      id: groupId,
+      name: name ?? `Group ${groups.length + 1}`,
+      nodeIds,
+      isLocked: false,
+      color: DEFAULT_GROUP_COLORS[colorIndex]
+    };
+    set((state) => ({
+      groups: [...state.groups, newGroup],
+      isDirty: true
+    }));
+    return groupId;
+  },
+  deleteGroup: (groupId) => {
+    set((state) => ({
+      groups: state.groups.filter((g) => g.id !== groupId),
+      isDirty: true
+    }));
+  },
+  addToGroup: (groupId, nodeIds) => {
+    set((state) => ({
+      groups: state.groups.map(
+        (g) => g.id === groupId ? { ...g, nodeIds: [.../* @__PURE__ */ new Set([...g.nodeIds, ...nodeIds])] } : g
+      ),
+      isDirty: true
+    }));
+  },
+  removeFromGroup: (groupId, nodeIds) => {
+    set((state) => ({
+      groups: state.groups.map(
+        (g) => g.id === groupId ? { ...g, nodeIds: g.nodeIds.filter((id) => !nodeIds.includes(id)) } : g
+      ),
+      isDirty: true
+    }));
+  },
+  toggleGroupLock: (groupId) => {
+    const { groups, lockMultipleNodes, unlockMultipleNodes } = get();
+    const group = groups.find((g) => g.id === groupId);
+    if (!group) return;
+    set((state) => ({
+      groups: state.groups.map((g) => g.id === groupId ? { ...g, isLocked: !g.isLocked } : g),
+      isDirty: true
+    }));
+    if (!group.isLocked) {
+      lockMultipleNodes(group.nodeIds);
+    } else {
+      unlockMultipleNodes(group.nodeIds);
+    }
+  },
+  renameGroup: (groupId, name) => {
+    set((state) => ({
+      groups: state.groups.map((g) => g.id === groupId ? { ...g, name } : g),
+      isDirty: true
+    }));
+  },
+  setGroupColor: (groupId, color) => {
+    set((state) => ({
+      groups: state.groups.map((g) => g.id === groupId ? { ...g, color } : g),
+      isDirty: true
+    }));
+  },
+  getGroupByNodeId: (nodeId) => {
+    return get().groups.find((g) => g.nodeIds.includes(nodeId));
+  },
+  getGroupById: (groupId) => {
+    return get().groups.find((g) => g.id === groupId);
+  }
+});
+
+// src/stores/workflow/helpers/propagation.ts
+function getNodeOutput(node) {
+  const data = node.data;
+  const outputImages = data.outputImages;
+  if (outputImages?.length) return outputImages[0];
+  const output = data.outputImage ?? data.outputVideo ?? data.outputText ?? data.outputAudio ?? data.prompt ?? data.extractedTweet ?? data.image ?? data.video ?? data.audio ?? null;
+  if (output === null) return null;
+  if (typeof output === "string") return output;
+  if (Array.isArray(output) && output.length > 0) return String(output[0]);
+  return null;
+}
+function getOutputType(sourceType) {
+  if (["prompt", "llm", "tweetParser", "transcribe"].includes(sourceType)) {
+    return "text";
+  }
+  if (["imageGen", "image", "imageInput", "upscale", "resize", "reframe", "imageGridSplit"].includes(
+    sourceType
+  )) {
+    return "image";
+  }
+  if ([
+    "videoGen",
+    "video",
+    "videoInput",
+    "animation",
+    "videoStitch",
+    "lipSync",
+    "voiceChange",
+    "motionControl",
+    "videoTrim",
+    "videoFrameExtract",
+    "subtitle"
+  ].includes(sourceType)) {
+    return "video";
+  }
+  if (["textToSpeech", "audio", "audioInput"].includes(sourceType)) {
+    return "audio";
+  }
+  return null;
+}
+function mapOutputToInput(output, sourceType, targetType) {
+  const outputType = getOutputType(sourceType);
+  if (targetType === "download") {
+    if (outputType === "video") {
+      return { inputVideo: output, inputImage: null, inputType: "video" };
+    }
+    if (outputType === "image") {
+      return { inputImage: output, inputVideo: null, inputType: "image" };
+    }
+    return null;
+  }
+  if (outputType === "text") {
+    if (["textToSpeech", "subtitle"].includes(targetType)) {
+      return { inputText: output };
+    }
+    if (["imageGen", "videoGen", "llm", "motionControl"].includes(targetType)) {
+      return { inputPrompt: output };
+    }
+  }
+  if (outputType === "image") {
+    if (["upscale", "reframe"].includes(targetType)) {
+      return { inputImage: output, inputVideo: null, inputType: "image" };
+    }
+    if (["videoGen", "lipSync", "voiceChange", "motionControl", "resize", "animation"].includes(
+      targetType
+    )) {
+      return { inputImage: output };
+    }
+    if (targetType === "imageGen") {
+      return { inputImages: [output] };
+    }
+  }
+  if (outputType === "video") {
+    if (["upscale", "reframe"].includes(targetType)) {
+      return { inputVideo: output, inputImage: null, inputType: "video" };
+    }
+    if ([
+      "lipSync",
+      "voiceChange",
+      "resize",
+      "videoStitch",
+      "videoTrim",
+      "videoFrameExtract",
+      "subtitle",
+      "transcribe"
+    ].includes(targetType)) {
+      return { inputVideo: output };
+    }
+  }
+  if (outputType === "audio") {
+    if (["lipSync", "voiceChange", "transcribe"].includes(targetType)) {
+      return { inputAudio: output };
+    }
+  }
+  return null;
+}
+function collectGalleryUpdate(sourceData, currentOutput, existingGalleryImages, pendingUpdateImages) {
+  const allImages = [];
+  const outputImagesArr = sourceData.outputImages;
+  if (outputImagesArr?.length) {
+    allImages.push(...outputImagesArr);
+  } else if (typeof currentOutput === "string") {
+    allImages.push(currentOutput);
+  }
+  if (allImages.length === 0) return null;
+  return {
+    images: [.../* @__PURE__ */ new Set([...existingGalleryImages, ...pendingUpdateImages, ...allImages])]
+  };
+}
+function computeDownstreamUpdates(sourceNodeId, initialOutput, nodes, edges) {
+  const updates = /* @__PURE__ */ new Map();
+  const visited = /* @__PURE__ */ new Set();
+  const queue = [
+    { nodeId: sourceNodeId, output: initialOutput }
+  ];
+  while (queue.length > 0) {
+    const current = queue.shift();
+    if (visited.has(current.nodeId)) continue;
+    visited.add(current.nodeId);
+    const currentNode = nodes.find((n) => n.id === current.nodeId);
+    if (!currentNode) continue;
+    const downstreamEdges = edges.filter((e) => e.source === current.nodeId);
+    for (const edge of downstreamEdges) {
+      const targetNode = nodes.find((n) => n.id === edge.target);
+      if (!targetNode) continue;
+      if (targetNode.type === "outputGallery") {
+        const sourceData = currentNode.data;
+        const existing = updates.get(edge.target) ?? {};
+        const pendingImages = existing.images ?? [];
+        const targetData = targetNode.data;
+        const galleryExisting = targetData.images ?? [];
+        const galleryUpdate = collectGalleryUpdate(
+          sourceData,
+          current.output,
+          galleryExisting,
+          pendingImages
+        );
+        if (galleryUpdate) {
+          updates.set(edge.target, { ...existing, ...galleryUpdate });
+        }
+        continue;
+      }
+      const inputUpdate = mapOutputToInput(current.output, currentNode.type, targetNode.type);
+      if (inputUpdate) {
+        const existing = updates.get(edge.target) ?? {};
+        updates.set(edge.target, { ...existing, ...inputUpdate });
+        const targetOutput = getNodeOutput(targetNode);
+        if (targetOutput && !visited.has(edge.target)) {
+          queue.push({ nodeId: edge.target, output: targetOutput });
+        }
+      }
+    }
+  }
+  return updates;
+}
+function hasStateChanged(updates, nodes) {
+  for (const [nodeId, update] of updates) {
+    const existingNode = nodes.find((n) => n.id === nodeId);
+    if (!existingNode) continue;
+    const existingData = existingNode.data;
+    for (const [key, value] of Object.entries(update)) {
+      const prev = existingData[key];
+      if (Array.isArray(prev) && Array.isArray(value)) {
+        if (prev.length !== value.length || prev.some((v, i) => v !== value[i])) {
+          return true;
+        }
+      } else if (prev !== value) {
+        return true;
+      }
+    }
+  }
+  return false;
+}
+function applyNodeUpdates(nodes, updates) {
+  return nodes.map((n) => {
+    const update = updates.get(n.id);
+    if (update) {
+      return { ...n, data: { ...n.data, ...update } };
+    }
+    return n;
+  });
+}
+function propagateExistingOutputs(nodes, propagateFn) {
+  for (const node of nodes) {
+    if (getNodeOutput(node) !== null) {
+      propagateFn(node.id);
+    }
+  }
+}
+
+// src/stores/workflow/slices/lockingSlice.ts
+var createLockingSlice = (set, get) => ({
+  _setNodeLockState: (predicate, lock) => {
+    set((state) => ({
+      nodes: state.nodes.map(
+        (n) => predicate(n.id) ? {
+          ...n,
+          draggable: !lock,
+          data: {
+            ...n.data,
+            isLocked: lock,
+            lockTimestamp: lock ? Date.now() : void 0,
+            ...lock && { cachedOutput: getNodeOutput(n) }
+          }
+        } : n
+      ),
+      isDirty: true
+    }));
+  },
+  toggleNodeLock: (nodeId) => {
+    const node = get().getNodeById(nodeId);
+    if (!node) return;
+    const shouldLock = !(node.data.isLocked ?? false);
+    get()._setNodeLockState((id) => id === nodeId, shouldLock);
+  },
+  lockNode: (nodeId) => {
+    const node = get().getNodeById(nodeId);
+    if (!node || node.data.isLocked) return;
+    get()._setNodeLockState((id) => id === nodeId, true);
+  },
+  unlockNode: (nodeId) => {
+    get()._setNodeLockState((id) => id === nodeId, false);
+  },
+  lockMultipleNodes: (nodeIds) => {
+    get()._setNodeLockState((id) => nodeIds.includes(id), true);
+  },
+  unlockMultipleNodes: (nodeIds) => {
+    get()._setNodeLockState((id) => nodeIds.includes(id), false);
+  },
+  unlockAllNodes: () => {
+    get()._setNodeLockState(() => true, false);
+  },
+  isNodeLocked: (nodeId) => {
+    const { nodes, groups } = get();
+    const node = nodes.find((n) => n.id === nodeId);
+    if (!node) return false;
+    if (node.data.isLocked) return true;
+    return groups.some((group) => group.isLocked && group.nodeIds.includes(nodeId));
+  }
+});
+var createNodeSlice = (set, get) => ({
+  addNode: (type, position) => {
+    const nodeDef = NODE_DEFINITIONS[type];
+    if (!nodeDef) return "";
+    const id = generateId();
+    const newNode = {
+      id,
+      type,
+      position,
+      data: {
+        ...nodeDef.defaultData,
+        label: nodeDef.label,
+        status: "idle"
+      },
+      ...type === "download" && { width: 280, height: 320 }
+    };
+    set((state) => ({
+      nodes: [...state.nodes, newNode],
+      isDirty: true
+    }));
+    return id;
+  },
+  addNodesAndEdges: (newNodes, newEdges) => {
+    if (newNodes.length === 0) return;
+    set((state) => ({
+      nodes: [...state.nodes, ...newNodes],
+      edges: [...state.edges, ...newEdges],
+      isDirty: true
+    }));
+    const { propagateOutputsDownstream } = get();
+    const sourceNodeIds = new Set(newEdges.map((e) => e.source));
+    for (const sourceId of sourceNodeIds) {
+      propagateOutputsDownstream(sourceId);
+    }
+  },
+  updateNodeData: (nodeId, data) => {
+    const { nodes, propagateOutputsDownstream } = get();
+    const node = nodes.find((n) => n.id === nodeId);
+    const TRANSIENT_KEYS = /* @__PURE__ */ new Set(["status", "progress", "error", "jobId"]);
+    const dataKeys = Object.keys(data);
+    const hasPersistedChange = dataKeys.some((key) => !TRANSIENT_KEYS.has(key));
+    set((state) => ({
+      nodes: state.nodes.map((n) => n.id === nodeId ? { ...n, data: { ...n.data, ...data } } : n),
+      ...hasPersistedChange && { isDirty: true }
+    }));
+    const inputNodeTypes = [
+      "prompt",
+      "image",
+      "imageInput",
+      "video",
+      "videoInput",
+      "audio",
+      "audioInput",
+      "tweetParser"
+    ];
+    const hasOutputUpdate = "outputImage" in data || "outputImages" in data || "outputVideo" in data || "outputAudio" in data || "outputText" in data;
+    if (node && (inputNodeTypes.includes(node.type) || hasOutputUpdate)) {
+      if (hasOutputUpdate) {
+        const dataRecord = data;
+        if ("outputImages" in dataRecord) {
+          propagateOutputsDownstream(nodeId);
+        } else {
+          const outputValue = dataRecord.outputImage ?? dataRecord.outputVideo ?? dataRecord.outputAudio ?? dataRecord.outputText;
+          if (typeof outputValue === "string") {
+            propagateOutputsDownstream(nodeId, outputValue);
+          }
+        }
+      } else {
+        propagateOutputsDownstream(nodeId);
+      }
+    }
+  },
+  removeNode: (nodeId) => {
+    set((state) => ({
+      nodes: state.nodes.filter((node) => node.id !== nodeId),
+      edges: state.edges.filter((edge) => edge.source !== nodeId && edge.target !== nodeId),
+      isDirty: true
+    }));
+  },
+  duplicateNode: (nodeId) => {
+    const { nodes, edges, edgeStyle, propagateOutputsDownstream } = get();
+    const node = nodes.find((n) => n.id === nodeId);
+    if (!node) return null;
+    const newId = generateId();
+    const newNode = {
+      ...node,
+      id: newId,
+      position: {
+        x: node.position.x + 50,
+        y: node.position.y + 50
+      },
+      data: {
+        ...node.data,
+        status: "idle",
+        jobId: null
+      }
+    };
+    const incomingEdges = edges.filter((e) => e.target === nodeId && e.source !== nodeId);
+    const clonedEdges = incomingEdges.map((edge) => ({
+      ...edge,
+      id: generateId(),
+      target: newId,
+      type: edgeStyle
+    }));
+    set((state) => ({
+      nodes: [...state.nodes, newNode],
+      edges: [...state.edges, ...clonedEdges],
+      isDirty: true
+    }));
+    const sourcesNotified = /* @__PURE__ */ new Set();
+    for (const edge of incomingEdges) {
+      if (!sourcesNotified.has(edge.source)) {
+        sourcesNotified.add(edge.source);
+        propagateOutputsDownstream(edge.source);
+      }
+    }
+    return newId;
+  },
+  propagateOutputsDownstream: (sourceNodeId, outputValue) => {
+    const { nodes, edges } = get();
+    const sourceNode = nodes.find((n) => n.id === sourceNodeId);
+    if (!sourceNode) return;
+    const output = outputValue ?? getNodeOutput(sourceNode);
+    if (!output) return;
+    const updates = computeDownstreamUpdates(sourceNodeId, output, nodes, edges);
+    if (updates.size === 0) return;
+    if (!hasStateChanged(updates, nodes)) return;
+    set((state) => ({
+      nodes: applyNodeUpdates(state.nodes, updates),
+      isDirty: true
+    }));
+  }
+});
+function normalizeEdgeTypes(edges) {
+  return edges.map((edge) => ({
+    ...edge,
+    type: edge.type === "bezier" ? "default" : edge.type
+  }));
+}
+function hydrateWorkflowNodes(nodes) {
+  return nodes.map((node) => {
+    const nodeDef = NODE_DEFINITIONS[node.type];
+    if (!nodeDef) return node;
+    return {
+      ...node,
+      data: {
+        ...nodeDef.defaultData,
+        ...node.data
+      }
+    };
+  });
+}
+var createPersistenceSlice = (set, get) => ({
+  loadWorkflow: (workflow) => {
+    const hydratedNodes = hydrateWorkflowNodes(workflow.nodes);
+    set({
+      nodes: hydratedNodes,
+      edges: normalizeEdgeTypes(workflow.edges),
+      edgeStyle: workflow.edgeStyle,
+      workflowName: workflow.name,
+      workflowId: null,
+      isDirty: true,
+      groups: workflow.groups ?? [],
+      selectedNodeIds: []
+    });
+    propagateExistingOutputs(hydratedNodes, get().propagateOutputsDownstream);
+    set({ isDirty: false });
+  },
+  clearWorkflow: () => {
+    set({
+      nodes: [],
+      edges: [],
+      workflowName: "Untitled Workflow",
+      workflowId: null,
+      isDirty: false,
+      groups: [],
+      selectedNodeIds: []
+    });
+  },
+  exportWorkflow: () => {
+    const { nodes, edges, edgeStyle, workflowName, groups } = get();
+    return {
+      version: 1,
+      name: workflowName,
+      description: "",
+      nodes,
+      edges,
+      edgeStyle,
+      groups,
+      createdAt: (/* @__PURE__ */ new Date()).toISOString(),
+      updatedAt: (/* @__PURE__ */ new Date()).toISOString()
+    };
+  },
+  getNodeById: (id) => {
+    return get().nodes.find((node) => node.id === id);
+  },
+  getConnectedInputs: (nodeId) => {
+    const { nodes, edges } = get();
+    const inputs = /* @__PURE__ */ new Map();
+    const incomingEdges = edges.filter((edge) => edge.target === nodeId);
+    for (const edge of incomingEdges) {
+      const sourceNode = nodes.find((n) => n.id === edge.source);
+      if (!sourceNode) continue;
+      const handleId = edge.targetHandle;
+      if (!handleId) continue;
+      const sourceData = sourceNode.data;
+      let value = null;
+      if (edge.sourceHandle === "image") {
+        value = sourceData.outputImage ?? sourceData.image ?? null;
+      } else if (edge.sourceHandle === "video") {
+        value = sourceData.outputVideo ?? sourceData.video ?? null;
+      } else if (edge.sourceHandle === "text") {
+        value = sourceData.outputText ?? sourceData.prompt ?? null;
+      } else if (edge.sourceHandle === "audio") {
+        value = sourceData.outputAudio ?? sourceData.audio ?? null;
+      }
+      if (value) {
+        const existing = inputs.get(handleId);
+        if (existing) {
+          if (Array.isArray(existing)) {
+            inputs.set(handleId, [...existing, value]);
+          } else {
+            inputs.set(handleId, [existing, value]);
+          }
+        } else {
+          inputs.set(handleId, value);
+        }
+      }
+    }
+    return inputs;
+  },
+  getConnectedNodeIds: (nodeIds) => {
+    const { edges } = get();
+    const connected = new Set(nodeIds);
+    const visited = /* @__PURE__ */ new Set();
+    const queue = [...nodeIds];
+    while (queue.length > 0) {
+      const currentId = queue.shift();
+      if (visited.has(currentId)) continue;
+      visited.add(currentId);
+      const upstreamEdges = edges.filter((e) => e.target === currentId);
+      for (const edge of upstreamEdges) {
+        if (!connected.has(edge.source)) {
+          connected.add(edge.source);
+          queue.push(edge.source);
+        }
+      }
+    }
+    return Array.from(connected);
+  },
+  validateWorkflow: () => {
+    const { nodes, edges } = get();
+    const errors = [];
+    const warnings = [];
+    if (nodes.length === 0) {
+      errors.push({
+        nodeId: "",
+        message: "Workflow is empty - add some nodes first",
+        severity: "error"
+      });
+      return { isValid: false, errors, warnings };
+    }
+    if (edges.length === 0 && nodes.length > 1) {
+      errors.push({
+        nodeId: "",
+        message: "No connections - connect your nodes together",
+        severity: "error"
+      });
+      return { isValid: false, errors, warnings };
+    }
+    const hasNodeOutput = (node) => {
+      const data = node.data;
+      switch (node.type) {
+        case "prompt":
+          return Boolean(data.prompt?.trim());
+        case "imageInput":
+          return Boolean(data.image);
+        case "videoInput":
+          return Boolean(data.video);
+        case "audioInput":
+          return Boolean(data.audio);
+        default:
+          return true;
+      }
+    };
+    for (const node of nodes) {
+      const nodeDef = 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 connectionEdge = incomingEdges.find((e) => e.targetHandle === input.id);
+          if (!connectionEdge) {
+            errors.push({
+              nodeId: node.id,
+              message: `Missing required input: ${input.label}`,
+              severity: "error"
+            });
+          } else {
+            const sourceNode = nodes.find((n) => n.id === connectionEdge.source);
+            if (sourceNode && !hasNodeOutput(sourceNode)) {
+              errors.push({
+                nodeId: sourceNode.id,
+                message: `${sourceNode.data.label} is empty`,
+                severity: "error"
+              });
+            }
+          }
+        }
+      }
+    }
+    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)) {
+        errors.push({
+          nodeId: node.id,
+          message: "Workflow contains a cycle",
+          severity: "error"
+        });
+        break;
+      }
+    }
+    for (const node of nodes) {
+      if (node.type === "workflowRef") {
+        const refData = node.data;
+        if (!refData.referencedWorkflowId) {
+          errors.push({
+            nodeId: node.id,
+            message: "Subworkflow node must reference a workflow",
+            severity: "error"
+          });
+        } else if (!refData.cachedInterface) {
+          warnings.push({
+            nodeId: node.id,
+            message: "Subworkflow interface not loaded - refresh to update handles",
+            severity: "warning"
+          });
+        }
+      }
+    }
+    return {
+      isValid: errors.length === 0,
+      errors,
+      warnings
+    };
+  },
+  setDirty: (dirty) => {
+    set({ isDirty: dirty });
+  },
+  setWorkflowName: (name) => {
+    set({ workflowName: name, isDirty: true });
+  },
+  // API operations - stubs that throw by default.
+  // Consuming apps override these via the store creator or by extending the slice.
+  saveWorkflow: async () => {
+    throw new Error("saveWorkflow not implemented - consuming app must provide API integration");
+  },
+  loadWorkflowById: async () => {
+    throw new Error(
+      "loadWorkflowById not implemented - consuming app must provide API integration"
+    );
+  },
+  listWorkflows: async () => {
+    throw new Error("listWorkflows not implemented - consuming app must provide API integration");
+  },
+  deleteWorkflow: async () => {
+    throw new Error("deleteWorkflow not implemented - consuming app must provide API integration");
+  },
+  duplicateWorkflowApi: async () => {
+    throw new Error(
+      "duplicateWorkflowApi not implemented - consuming app must provide API integration"
+    );
+  },
+  createNewWorkflow: async () => {
+    throw new Error(
+      "createNewWorkflow not implemented - consuming app must provide API integration"
+    );
+  },
+  getNodesWithComments: () => {
+    const { nodes } = get();
+    return nodes.filter((node) => {
+      const data = node.data;
+      return data.comment?.trim();
+    }).sort((a, b) => {
+      if (Math.abs(a.position.y - b.position.y) < 50) {
+        return a.position.x - b.position.x;
+      }
+      return a.position.y - b.position.y;
+    });
+  },
+  markCommentViewed: (nodeId) => {
+    set((state) => {
+      const newSet = new Set(state.viewedCommentIds);
+      newSet.add(nodeId);
+      return { viewedCommentIds: newSet };
+    });
+  },
+  setNavigationTarget: (nodeId) => {
+    set({ navigationTargetId: nodeId });
+  },
+  getUnviewedCommentCount: () => {
+    const { nodes, viewedCommentIds } = get();
+    return nodes.filter((node) => {
+      const data = node.data;
+      return data.comment?.trim() && !viewedCommentIds.has(node.id);
+    }).length;
+  }
+});
+
+// src/stores/workflow/slices/selectionSlice.ts
+var createSelectionSlice = (set) => ({
+  setSelectedNodeIds: (nodeIds) => {
+    set({ selectedNodeIds: nodeIds });
+  },
+  addToSelection: (nodeId) => {
+    set((state) => ({
+      selectedNodeIds: state.selectedNodeIds.includes(nodeId) ? state.selectedNodeIds : [...state.selectedNodeIds, nodeId]
+    }));
+  },
+  removeFromSelection: (nodeId) => {
+    set((state) => ({
+      selectedNodeIds: state.selectedNodeIds.filter((id) => id !== nodeId)
+    }));
+  },
+  clearSelection: () => {
+    set({ selectedNodeIds: [] });
+  }
+});
+
+// src/stores/workflow/slices/snapshotSlice.ts
+function defaultApplyEditOperations(_operations, state) {
+  return { nodes: state.nodes, edges: state.edges, applied: 0, skipped: [] };
+}
+var createSnapshotSlice = (set, get) => ({
+  previousWorkflowSnapshot: null,
+  manualChangeCount: 0,
+  captureSnapshot: () => {
+    const state = get();
+    const snapshot = {
+      nodes: JSON.parse(JSON.stringify(state.nodes)),
+      edges: JSON.parse(JSON.stringify(state.edges)),
+      groups: JSON.parse(JSON.stringify(state.groups)),
+      edgeStyle: state.edgeStyle
+    };
+    set({
+      previousWorkflowSnapshot: snapshot,
+      manualChangeCount: 0
+    });
+  },
+  revertToSnapshot: () => {
+    const state = get();
+    if (state.previousWorkflowSnapshot) {
+      set({
+        nodes: state.previousWorkflowSnapshot.nodes,
+        edges: state.previousWorkflowSnapshot.edges,
+        groups: state.previousWorkflowSnapshot.groups,
+        edgeStyle: state.previousWorkflowSnapshot.edgeStyle,
+        previousWorkflowSnapshot: null,
+        manualChangeCount: 0,
+        isDirty: true
+      });
+    }
+  },
+  clearSnapshot: () => {
+    set({
+      previousWorkflowSnapshot: null,
+      manualChangeCount: 0
+    });
+  },
+  incrementManualChangeCount: () => {
+    const state = get();
+    const newCount = state.manualChangeCount + 1;
+    if (newCount >= 3) {
+      set({
+        previousWorkflowSnapshot: null,
+        manualChangeCount: 0
+      });
+    } else {
+      set({ manualChangeCount: newCount });
+    }
+  },
+  applyEditOperations: (operations) => {
+    const state = get();
+    const result = defaultApplyEditOperations(operations, {
+      nodes: state.nodes,
+      edges: state.edges
+    });
+    set({
+      nodes: result.nodes,
+      edges: result.edges,
+      isDirty: true
+    });
+    return { applied: result.applied, skipped: result.skipped };
+  }
+});
+
+// src/stores/workflow/workflowStore.ts
+var storeCreator = ((...args) => ({
+  // Initial state
+  nodes: [],
+  edges: [],
+  edgeStyle: "default",
+  workflowName: "Untitled Workflow",
+  workflowId: null,
+  isDirty: false,
+  isSaving: false,
+  isLoading: false,
+  groups: [],
+  selectedNodeIds: [],
+  viewedCommentIds: /* @__PURE__ */ new Set(),
+  navigationTargetId: null,
+  // Compose slices
+  ...createNodeSlice(...args),
+  ...createEdgeSlice(...args),
+  ...createLockingSlice(...args),
+  ...createGroupSlice(...args),
+  ...createSelectionSlice(...args),
+  ...createPersistenceSlice(...args),
+  ...createSnapshotSlice(...args),
+  ...createChatSlice(...args)
+}));
+var useWorkflowStore = create()(
+  temporal(storeCreator, {
+    // Only track meaningful state (not UI flags like isDirty, isSaving, etc.)
+    partialize: (state) => ({
+      nodes: state.nodes,
+      edges: state.edges,
+      groups: state.groups
+    }),
+    // Limit history to prevent memory issues
+    limit: 50,
+    // Optimized equality check using shallow comparison instead of JSON.stringify
+    equality: temporalStateEquals
+  })
+);
+
+export { useWorkflowStore };