@genfeedai/workflow-ui 0.1.3 → 0.1.5

package/dist/chunk-3TMV3K34.js

@@ -1,534 +0,0 @@
-'use strict';
-
-var chunk5HJFQVUR_js = require('./chunk-5HJFQVUR.js');
-var chunkEMUMKW5C_js = require('./chunk-EMUMKW5C.js');
-var chunkAXFOCPPP_js = require('./chunk-AXFOCPPP.js');
-var chunkIHF35QZD_js = require('./chunk-IHF35QZD.js');
-var chunkRJ262NXS_js = require('./chunk-RJ262NXS.js');
-var react = require('react');
-var lucideReact = require('lucide-react');
-var jsxRuntime = require('react/jsx-runtime');
-var types = require('@genfeedai/types');
-var shallow = require('zustand/react/shallow');
-
-function useAIGenNode({
-  nodeId,
-  selectedModel,
-  schemaParams
-}) {
-  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
-  const schemaProperties = react.useMemo(() => {
-    const schema = selectedModel?.inputSchema;
-    return schema?.properties;
-  }, [selectedModel?.inputSchema]);
-  const enumValues = react.useMemo(
-    () => chunkEMUMKW5C_js.extractEnumValues(
-      selectedModel?.componentSchemas
-    ),
-    [selectedModel?.componentSchemas]
-  );
-  const modelSupportsImageInput = react.useMemo(
-    () => chunkEMUMKW5C_js.supportsImageInput(selectedModel?.inputSchema),
-    [selectedModel?.inputSchema]
-  );
-  const componentSchemas = selectedModel?.componentSchemas;
-  const handleSchemaParamChange = react.useCallback(
-    (key, value) => {
-      const currentNode = chunkIHF35QZD_js.useWorkflowStore.getState().getNodeById(nodeId);
-      const currentData = currentNode?.data;
-      updateNodeData(nodeId, {
-        schemaParams: {
-          ...currentData?.schemaParams ?? {},
-          [key]: value
-        }
-      });
-    },
-    [nodeId, updateNodeData]
-  );
-  return {
-    schemaProperties,
-    enumValues,
-    modelSupportsImageInput,
-    handleSchemaParamChange,
-    componentSchemas
-  };
-}
-function useAIGenNodeHeader({
-  modelDisplayName,
-  isProcessing,
-  canGenerate,
-  hasOutput,
-  onModelBrowse,
-  onGenerate,
-  onStop,
-  onExpand
-}) {
-  const titleElement = react.useMemo(
-    () => /* @__PURE__ */ jsxRuntime.jsxs(
-      "button",
-      {
-        className: `flex flex-1 items-center gap-1 text-sm font-medium text-left text-foreground ${isProcessing ? "opacity-50 cursor-default" : "hover:text-foreground/80 cursor-pointer"}`,
-        onClick: () => !isProcessing && onModelBrowse(),
-        title: "Browse models",
-        disabled: isProcessing,
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: modelDisplayName }),
-          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-3 w-3 shrink-0" })
-        ]
-      }
-    ),
-    [modelDisplayName, isProcessing, onModelBrowse]
-  );
-  const headerActions = react.useMemo(
-    () => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      hasOutput && /* @__PURE__ */ jsxRuntime.jsx(chunk5HJFQVUR_js.Button, { variant: "ghost", size: "icon-sm", onClick: onExpand, title: "Expand preview", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Expand, { className: "h-3 w-3" }) }),
-      isProcessing ? /* @__PURE__ */ jsxRuntime.jsxs(chunk5HJFQVUR_js.Button, { variant: "destructive", size: "sm", onClick: onStop, children: [
-        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Square, { className: "h-4 w-4 fill-current" }),
-        "Generating"
-      ] }) : /* @__PURE__ */ jsxRuntime.jsxs(
-        chunk5HJFQVUR_js.Button,
-        {
-          variant: canGenerate ? "default" : "secondary",
-          size: "sm",
-          onClick: onGenerate,
-          disabled: !canGenerate,
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Play, { className: "h-4 w-4 fill-current" }),
-            "Generate"
-          ]
-        }
-      )
-    ] }),
-    [hasOutput, isProcessing, canGenerate, onGenerate, onStop, onExpand]
-  );
-  return { titleElement, headerActions };
-}
-function useAutoLoadModelSchema({
-  currentModel,
-  selectedModel,
-  modelIdMap,
-  onModelSelect
-}) {
-  const { modelSchema } = chunkRJ262NXS_js.useWorkflowUIConfig();
-  const hasAttemptedSchemaLoad = react.useRef(false);
-  react.useEffect(() => {
-    if (hasAttemptedSchemaLoad.current || selectedModel || !currentModel || !modelSchema) {
-      return;
-    }
-    const modelId = modelIdMap[currentModel];
-    if (!modelId) return;
-    const controller = new AbortController();
-    let isCancelled = false;
-    const loadSchema = async () => {
-      try {
-        const model = await modelSchema.fetchModelSchema(modelId, controller.signal);
-        if (model && !isCancelled) {
-          hasAttemptedSchemaLoad.current = true;
-          onModelSelect(model);
-        }
-      } catch {
-      }
-    };
-    loadSchema();
-    return () => {
-      isCancelled = true;
-      controller.abort();
-    };
-  }, [currentModel, selectedModel, modelIdMap, onModelSelect, modelSchema]);
-}
-function useRequiredInputs(nodeId, nodeType) {
-  const edges = chunkIHF35QZD_js.useWorkflowStore((state) => state.edges);
-  return react.useMemo(() => {
-    const nodeDef = types.NODE_DEFINITIONS[nodeType];
-    if (!nodeDef) {
-      return { hasRequiredInputs: true, missingInputs: [], connectionStatus: /* @__PURE__ */ new Map() };
-    }
-    const incomingEdges = edges.filter((e) => e.target === nodeId);
-    const connectedHandles = new Set(incomingEdges.map((e) => e.targetHandle).filter(Boolean));
-    const connectionStatus = /* @__PURE__ */ new Map();
-    const missingInputs = [];
-    for (const input of nodeDef.inputs) {
-      const isConnected = connectedHandles.has(input.id);
-      connectionStatus.set(input.id, isConnected);
-      if (input.required && !isConnected) {
-        missingInputs.push(input.id);
-      }
-    }
-    return {
-      hasRequiredInputs: missingInputs.length === 0,
-      missingInputs,
-      connectionStatus
-    };
-  }, [nodeId, nodeType, edges]);
-}
-function extractOutputValue(node, handleType) {
-  const data = node.data;
-  if (handleType === "text") {
-    return data.outputText ?? data.prompt;
-  } else if (handleType === "image") {
-    return data.outputImage ?? data.image;
-  } else if (handleType === "video") {
-    return data.outputVideo ?? data.video;
-  } else if (handleType === "audio") {
-    return data.outputAudio ?? data.audio;
-  }
-  return void 0;
-}
-function useCanGenerate({
-  nodeId,
-  nodeType,
-  inputSchema,
-  schemaParams
-}) {
-  const { hasRequiredInputs, missingInputs } = useRequiredInputs(nodeId, nodeType);
-  const getConnectedInputs = chunkIHF35QZD_js.useWorkflowStore((state) => state.getConnectedInputs);
-  const incomingEdgesSelector = react.useCallback(
-    (state) => state.edges.filter((e) => e.target === nodeId),
-    [nodeId]
-  );
-  const incomingEdges = chunkIHF35QZD_js.useWorkflowStore(shallow.useShallow(incomingEdgesSelector));
-  const connectedOutputsSelector = react.useCallback(
-    (state) => {
-      const outputs = {};
-      for (const edge of incomingEdges) {
-        const sourceNode = state.nodes.find((n) => n.id === edge.source);
-        if (sourceNode) {
-          outputs[edge.source] = extractOutputValue(sourceNode, edge.sourceHandle);
-        }
-      }
-      return outputs;
-    },
-    [incomingEdges]
-  );
-  chunkIHF35QZD_js.useWorkflowStore(shallow.useShallow(connectedOutputsSelector));
-  return react.useMemo(() => {
-    const missingItems = [];
-    for (const inputId of missingInputs) {
-      missingItems.push({
-        type: "connection",
-        field: inputId,
-        message: `Missing connection: ${inputId}`
-      });
-    }
-    const connectedInputs = getConnectedInputs(nodeId);
-    const nodeDef = types.NODE_DEFINITIONS[nodeType];
-    const requiredHandleIds = new Set(
-      nodeDef?.inputs.filter((h) => h.required).map((h) => h.id) ?? []
-    );
-    let hasRequiredData = true;
-    let hasConnectedData = true;
-    if (hasRequiredInputs) {
-      for (const edge of incomingEdges) {
-        const handleId = edge.targetHandle;
-        if (!handleId) continue;
-        if (!connectedInputs.has(handleId)) {
-          hasConnectedData = false;
-          if (requiredHandleIds.has(handleId)) {
-            hasRequiredData = false;
-          }
-        }
-      }
-    }
-    const schemaValidation = chunkEMUMKW5C_js.validateRequiredSchemaFields(
-      inputSchema,
-      schemaParams ?? {},
-      chunkEMUMKW5C_js.CONNECTION_FIELDS
-    );
-    for (const field of schemaValidation.missingFields) {
-      missingItems.push({
-        type: "schema",
-        field,
-        message: `Required field: ${field}`
-      });
-    }
-    const canGenerate = hasRequiredInputs && hasRequiredData && schemaValidation.isValid;
-    return {
-      canGenerate,
-      missingItems,
-      hasRequiredConnections: hasRequiredInputs,
-      hasConnectedData,
-      hasRequiredSchemaFields: schemaValidation.isValid
-    };
-  }, [
-    nodeId,
-    nodeType,
-    hasRequiredInputs,
-    missingInputs,
-    inputSchema,
-    schemaParams,
-    getConnectedInputs,
-    incomingEdges
-  ]);
-}
-function useModelSelection({ nodeId, modelMap, fallbackModel }) {
-  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
-  const handleModelSelect = react.useCallback(
-    (model) => {
-      const internalModel = modelMap[model.id] ?? fallbackModel;
-      const schemaDefaults = chunkEMUMKW5C_js.getSchemaDefaults(model.inputSchema);
-      const selectedModel = {
-        provider: model.provider,
-        modelId: model.id,
-        displayName: model.displayName,
-        inputSchema: model.inputSchema,
-        componentSchemas: model.componentSchemas
-      };
-      updateNodeData(nodeId, {
-        model: internalModel,
-        provider: model.provider,
-        selectedModel,
-        schemaParams: schemaDefaults
-      });
-    },
-    [nodeId, modelMap, fallbackModel, updateNodeData]
-  );
-  return { handleModelSelect };
-}
-function useNodeExecution(nodeId) {
-  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
-  const executeNode = chunkAXFOCPPP_js.useExecutionStore((state) => state.executeNode);
-  const stopNodeExecution = chunkAXFOCPPP_js.useExecutionStore((state) => state.stopNodeExecution);
-  const handleGenerate = react.useCallback(() => {
-    updateNodeData(nodeId, { status: types.NodeStatusEnum.PROCESSING });
-    executeNode(nodeId);
-  }, [nodeId, executeNode, updateNodeData]);
-  const handleStop = react.useCallback(() => {
-    stopNodeExecution(nodeId);
-  }, [nodeId, stopNodeExecution]);
-  return { handleGenerate, handleStop };
-}
-function readFileAsBase64(file, nodeId, getMetadata, buildUploadUpdate, updateNodeData, onComplete) {
-  const reader = new FileReader();
-  reader.onload = async (event) => {
-    const dataUrl = event.target?.result;
-    const metadata = await getMetadata(dataUrl);
-    updateNodeData(nodeId, buildUploadUpdate(dataUrl, file.name, metadata));
-  };
-  reader.readAsDataURL(file);
-}
-function useMediaUpload({
-  nodeId,
-  mediaType,
-  initialUrl = "",
-  getMetadata,
-  buildUploadUpdate,
-  buildUrlUpdate,
-  buildRemoveUpdate
-}) {
-  const updateNodeData = chunkIHF35QZD_js.useWorkflowStore((state) => state.updateNodeData);
-  const workflowId = chunkIHF35QZD_js.useWorkflowStore((state) => state.workflowId);
-  const { fileUpload } = chunkRJ262NXS_js.useWorkflowUIConfig();
-  const fileInputRef = react.useRef(null);
-  const [showUrlInput, setShowUrlInput] = react.useState(false);
-  const [urlValue, setUrlValue] = react.useState(initialUrl);
-  const [isUploading, setIsUploading] = react.useState(false);
-  const getMetadataRef = react.useRef(getMetadata);
-  getMetadataRef.current = getMetadata;
-  const buildUploadUpdateRef = react.useRef(buildUploadUpdate);
-  buildUploadUpdateRef.current = buildUploadUpdate;
-  const buildUrlUpdateRef = react.useRef(buildUrlUpdate);
-  buildUrlUpdateRef.current = buildUrlUpdate;
-  const buildRemoveUpdateRef = react.useRef(buildRemoveUpdate);
-  buildRemoveUpdateRef.current = buildRemoveUpdate;
-  const handleFileSelect = react.useCallback(
-    async (e) => {
-      const file = e.target.files?.[0];
-      if (!file) return;
-      if (workflowId && fileUpload) {
-        setIsUploading(true);
-        try {
-          const result = await fileUpload.uploadFile(
-            `/files/workflows/${workflowId}/input/${mediaType}`,
-            file
-          );
-          const metadata = await getMetadataRef.current(result.url);
-          updateNodeData(
-            nodeId,
-            buildUploadUpdateRef.current(result.url, result.filename, metadata)
-          );
-        } catch (_error) {
-          readFileAsBase64(
-            file,
-            nodeId,
-            getMetadataRef.current,
-            buildUploadUpdateRef.current,
-            updateNodeData
-          );
-        } finally {
-          setIsUploading(false);
-        }
-      } else {
-        readFileAsBase64(
-          file,
-          nodeId,
-          getMetadataRef.current,
-          buildUploadUpdateRef.current,
-          updateNodeData
-        );
-      }
-    },
-    [nodeId, updateNodeData, workflowId, mediaType, fileUpload]
-  );
-  const handleRemove = react.useCallback(() => {
-    updateNodeData(nodeId, buildRemoveUpdateRef.current());
-    setUrlValue("");
-  }, [nodeId, updateNodeData]);
-  const handleUrlSubmit = react.useCallback(async () => {
-    if (!urlValue.trim()) return;
-    try {
-      let metadata;
-      if (mediaType === "image") {
-        metadata = await chunkEMUMKW5C_js.getImageDimensions(urlValue);
-      } else {
-        const meta = await chunkEMUMKW5C_js.getVideoMetadata(urlValue);
-        metadata = {
-          duration: meta.duration,
-          width: meta.dimensions.width,
-          height: meta.dimensions.height
-        };
-      }
-      updateNodeData(nodeId, buildUrlUpdateRef.current(urlValue, metadata));
-    } catch (_error) {
-      updateNodeData(nodeId, buildUrlUpdateRef.current(urlValue, null));
-    }
-    setShowUrlInput(false);
-  }, [nodeId, updateNodeData, urlValue, mediaType]);
-  const handleUrlKeyDown = react.useCallback(
-    (e) => {
-      if (e.key === "Enter") {
-        handleUrlSubmit();
-      } else if (e.key === "Escape") {
-        setShowUrlInput(false);
-        setUrlValue(initialUrl);
-      }
-    },
-    [handleUrlSubmit, initialUrl]
-  );
-  return {
-    fileInputRef,
-    showUrlInput,
-    setShowUrlInput,
-    urlValue,
-    setUrlValue,
-    isUploading,
-    handleFileSelect,
-    handleRemove,
-    handleUrlSubmit,
-    handleUrlKeyDown
-  };
-}
-function usePromptAutocomplete({
-  availableVariables,
-  textareaRef,
-  localTemplate,
-  setLocalTemplate,
-  onTemplateCommit
-}) {
-  const [showAutocomplete, setShowAutocomplete] = react.useState(false);
-  const [autocompletePosition, setAutocompletePosition] = react.useState({ top: 0, left: 0 });
-  const [autocompleteFilter, setAutocompleteFilter] = react.useState("");
-  const [selectedAutocompleteIndex, setSelectedAutocompleteIndex] = react.useState(0);
-  const filteredAutocompleteVars = react.useMemo(() => {
-    return availableVariables.filter(
-      (v) => v.name.toLowerCase().includes(autocompleteFilter.toLowerCase())
-    );
-  }, [availableVariables, autocompleteFilter]);
-  const handleAutocompleteSelect = react.useCallback(
-    (varName) => {
-      if (!textareaRef.current) return;
-      const cursorPos = textareaRef.current.selectionStart;
-      const textBeforeCursor = localTemplate.slice(0, cursorPos);
-      const textAfterCursor = localTemplate.slice(cursorPos);
-      const match = textBeforeCursor.match(/@(\w*)$/);
-      if (!match) return;
-      const atPosition = cursorPos - match[0].length;
-      const newTemplate = `${localTemplate.slice(0, atPosition)}@${varName}${textAfterCursor}`;
-      setLocalTemplate(newTemplate);
-      onTemplateCommit?.(newTemplate);
-      setShowAutocomplete(false);
-      const newCursorPos = atPosition + varName.length + 1;
-      setTimeout(() => {
-        if (textareaRef.current) {
-          textareaRef.current.focus();
-          textareaRef.current.setSelectionRange(newCursorPos, newCursorPos);
-        }
-      }, 0);
-    },
-    [localTemplate, textareaRef, setLocalTemplate, onTemplateCommit]
-  );
-  const handleChange = react.useCallback(
-    (e) => {
-      const newValue = e.target.value;
-      setLocalTemplate(newValue);
-      const cursorPos = e.target.selectionStart;
-      const textBeforeCursor = newValue.slice(0, cursorPos);
-      const match = textBeforeCursor.match(/@(\w*)$/);
-      if (match && textareaRef.current) {
-        setAutocompleteFilter(match[1] || "");
-        setSelectedAutocompleteIndex(0);
-        const lineHeight = 20;
-        const lines = textBeforeCursor.split("\n");
-        const currentLine = lines.length - 1;
-        const top = currentLine * lineHeight + 30;
-        const left = 10;
-        setAutocompletePosition({ top, left });
-        setShowAutocomplete(true);
-      } else {
-        setShowAutocomplete(false);
-      }
-    },
-    [textareaRef, setLocalTemplate]
-  );
-  const handleKeyDown = react.useCallback(
-    (e) => {
-      if (!showAutocomplete) return;
-      if (e.key === "ArrowDown") {
-        e.preventDefault();
-        setSelectedAutocompleteIndex((prev) => (prev + 1) % filteredAutocompleteVars.length);
-      } else if (e.key === "ArrowUp") {
-        e.preventDefault();
-        setSelectedAutocompleteIndex(
-          (prev) => (prev - 1 + filteredAutocompleteVars.length) % filteredAutocompleteVars.length
-        );
-      } else if (e.key === "Enter" || e.key === "Tab") {
-        if (filteredAutocompleteVars.length > 0) {
-          e.preventDefault();
-          handleAutocompleteSelect(filteredAutocompleteVars[selectedAutocompleteIndex].name);
-        }
-      } else if (e.key === "Escape") {
-        e.preventDefault();
-        e.stopPropagation();
-        setShowAutocomplete(false);
-      }
-    },
-    [
-      showAutocomplete,
-      filteredAutocompleteVars,
-      selectedAutocompleteIndex,
-      handleAutocompleteSelect
-    ]
-  );
-  const closeAutocomplete = react.useCallback(() => {
-    setShowAutocomplete(false);
-  }, []);
-  return {
-    showAutocomplete,
-    autocompletePosition,
-    filteredAutocompleteVars,
-    selectedAutocompleteIndex,
-    handleChange,
-    handleKeyDown,
-    handleAutocompleteSelect,
-    closeAutocomplete
-  };
-}
-
-exports.useAIGenNode = useAIGenNode;
-exports.useAIGenNodeHeader = useAIGenNodeHeader;
-exports.useAutoLoadModelSchema = useAutoLoadModelSchema;
-exports.useCanGenerate = useCanGenerate;
-exports.useMediaUpload = useMediaUpload;
-exports.useModelSelection = useModelSelection;
-exports.useNodeExecution = useNodeExecution;
-exports.usePromptAutocomplete = usePromptAutocomplete;
-exports.useRequiredInputs = useRequiredInputs;