@yiyi_zhang/reactflow-ui 0.4.0 → 1.0.0

package/dist/components/AiNative/AiCommandCenter.d.ts

@@ -0,0 +1,40 @@
+/**
+ * AiCommandCenter — AI chat panel (left side of AiWorkflowIDE)
+ *
+ * Tabs: 对话 | 工作流库
+ * Features: welcome chips, API-key onboarding, pending-proposal guard,
+ *           streaming messages, tool-call pipeline.
+ */
+import React from 'react';
+import type { WorkflowInstance } from '../../types/conductor';
+import type { ExecutionActions } from '../../types/workflow';
+import type { AiEvent } from '../../types/aiEvents';
+interface AiCommandCenterProps {
+    systemPrompt?: string;
+    systemPromptExtra?: string;
+    showConfigButton?: boolean;
+    onShowConfig: () => void;
+    executionActions?: ExecutionActions;
+    onAiEvent?: (event: AiEvent) => void;
+    aiPermissions?: {
+        canEdit?: boolean;
+        canRepair?: boolean;
+        restrictionMessage?: string;
+    };
+    /** Whether the canvas drawer is currently open */
+    canvasOpen?: boolean;
+    onOpenCanvas?: () => void;
+    onCloseCanvas?: () => void;
+    /** Trigger execution of the current workflow. Signature matches WorkflowIDE's onTriggerExecution. */
+    onTriggerExecution?: (workflowName: string, version: number, input: Record<string, any>) => Promise<{
+        workflowId: string;
+    }>;
+    /** Poll execution status by workflowId. Signature matches WorkflowIDE's onPollExecution. */
+    onPollExecution?: (workflowId: string) => Promise<WorkflowInstance | null>;
+    /** Accept the pending proposal (full accept) */
+    onAccept?: () => void;
+    /** Reject the pending proposal */
+    onReject?: () => void;
+}
+declare const AiCommandCenter: React.FC<AiCommandCenterProps>;
+export default AiCommandCenter;

package/dist/components/AiNative/AiConfigPanel.d.ts

@@ -0,0 +1,9 @@
+/**
+ * AiConfigPanel — AI 服务配置弹窗
+ */
+import React from 'react';
+interface AiConfigPanelProps {
+    onClose: () => void;
+}
+declare const AiConfigPanel: React.FC<AiConfigPanelProps>;
+export default AiConfigPanel;

package/dist/components/AiNative/BusinessCanvas.d.ts

@@ -0,0 +1,15 @@
+/**
+ * BusinessCanvas — renders a WorkflowDef as business-friendly step cards
+ * for non-technical users (business view mode).
+ */
+import React from 'react';
+import type { WorkflowDef } from '../../types/conductor';
+interface BusinessCanvasProps {
+    workflowDef: WorkflowDef | null;
+    /** Task statuses from execution (ref → status) */
+    executionStatus?: Record<string, string>;
+    /** Called when user clicks a step to ask AI about it */
+    onStepClick?: (taskRef: string, taskType: string) => void;
+}
+declare const BusinessCanvas: React.FC<BusinessCanvasProps>;
+export default BusinessCanvas;

package/dist/components/AiNative/CanvasPreview.d.ts

@@ -0,0 +1,16 @@
+/**
+ * CanvasPreview — 画布预览组件
+ *
+ * 包裹现有的 WorkflowDesigner，作为右侧预览区。
+ * 后续会增加 Ghost 节点叠加层。
+ */
+import React from 'react';
+import type { ExecutionActions } from '../../types/workflow';
+import type { WorkflowDef } from '../../types/conductor';
+interface CanvasPreviewProps {
+    onSave?: (def: WorkflowDef) => void;
+    onRequestImport?: () => void;
+    executionActions?: ExecutionActions;
+}
+declare const CanvasPreview: React.FC<CanvasPreviewProps>;
+export default CanvasPreview;

package/dist/components/AiNative/ClarificationCard.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import type { PendingClarification } from '../../store/aiStore';
+interface ClarificationCardProps {
+    clarification: PendingClarification;
+    onSelect: (optionLabel: string) => void;
+    onCustom: () => void;
+}
+declare const ClarificationCard: React.FC<ClarificationCardProps>;
+export default ClarificationCard;

package/dist/components/AiNative/FailureSummaryCard.d.ts

@@ -0,0 +1,20 @@
+/**
+ * FailureSummaryCard — proactive failure surface for run-mode (M4.1)
+ *
+ * The runtime banner + welcome-message chips only appear near the top of the
+ * conversation; if a workflow fails mid-conversation the user has to scroll back
+ * to find a "why did this fail" suggestion. This card appears wherever the user
+ * currently is the moment a failure is detected, with the failed task's own error
+ * reason and a one-click path straight into diagnosis (skips having to phrase the
+ * question themselves).
+ */
+import React from 'react';
+interface FailureSummaryCardProps {
+    taskRef: string;
+    taskType: string;
+    reason?: string;
+    onDiagnose: () => void;
+    onDismiss: () => void;
+}
+declare const FailureSummaryCard: React.FC<FailureSummaryCardProps>;
+export default FailureSummaryCard;

package/dist/components/AiNative/InlineCanvasCopilot.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { AIServiceConfig } from '../../services/aiService';
+interface InlineCanvasCopilotProps {
+    aiConfig?: Partial<AIServiceConfig>;
+}
+export declare const InlineCanvasCopilot: React.FC<InlineCanvasCopilotProps>;
+export default InlineCanvasCopilot;

package/dist/components/AiNative/LibraryPanel.d.ts

@@ -0,0 +1,9 @@
+/**
+ * LibraryPanel — L1/L2/L3 sub-workflow catalog browser
+ *
+ * Allows users to search the workflow library and insert workflows
+ * as SUB_WORKFLOW tasks directly onto the canvas (creates a proposal).
+ */
+import React from 'react';
+declare const LibraryPanel: React.FC;
+export default LibraryPanel;

package/dist/components/AiNative/MermaidBlock.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+interface MermaidBlockProps {
+    code: string;
+}
+declare const MermaidBlock: React.FC<MermaidBlockProps>;
+export default MermaidBlock;

package/dist/components/AiNative/PlanCard.d.ts

@@ -0,0 +1,15 @@
+/**
+ * PlanCard — displays an AI-proposed multi-step execution plan
+ *
+ * Shown in the chat when the AI calls propose_plan before executing a
+ * complex multi-step operation. The user can confirm or cancel.
+ */
+import React from 'react';
+import type { PendingPlan } from '../../store/aiStore';
+interface PlanCardProps {
+    plan: PendingPlan;
+    onExecute: () => void;
+    onCancel: () => void;
+}
+declare const PlanCard: React.FC<PlanCardProps>;
+export default PlanCard;

package/dist/components/AiNative/ProposalPreviewCard.d.ts

@@ -0,0 +1,21 @@
+/**
+ * ProposalPreviewCard — business step preview for AI proposals (UX Phase A / M2.2 + Semantic Verification Badge)
+ *
+ * Replaces the old "+N 新增 ~N 修改" number-chip summary with an actual preview of
+ * what the workflow will look like: every step in business language, added steps
+ * highlighted green, modified steps yellow with a one-line change description,
+ * removed steps struck through in place, plus a holistic semantic & data-flow
+ * verification badge.
+ */
+import React from 'react';
+import type { ProposedChange } from '../../store/aiStore';
+import type { WorkflowDef } from '../../types/conductor';
+interface ProposalPreviewCardProps {
+    proposal: ProposedChange;
+    currentDef: WorkflowDef | null;
+    isStale: boolean;
+    onAccept: () => void;
+    onReject: () => void;
+}
+declare const ProposalPreviewCard: React.FC<ProposalPreviewCardProps>;
+export default ProposalPreviewCard;

package/dist/components/AiNative/RecommendationCard.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import type { PendingRecommendation } from '../../store/aiStore';
+interface RecommendationCardProps {
+    recommendation: PendingRecommendation;
+    onUseWorkflow: (workflowName: string) => void;
+    onModifyWorkflow: (workflowName: string) => void;
+    onCreateNew: () => void;
+}
+declare const RecommendationCard: React.FC<RecommendationCardProps>;
+export default RecommendationCard;

package/dist/components/AiNative/RepairCard.d.ts

@@ -0,0 +1,17 @@
+/**
+ * RepairCard — AI-generated repair proposal for run-mode failures
+ *
+ * Shown when the AI calls propose_repair in run mode.
+ * Displays a diagnosis and a list of executable repair actions.
+ */
+import React from 'react';
+import type { RepairProposal, RepairAction } from '../../store/aiStore';
+interface RepairCardProps {
+    repair: RepairProposal;
+    /** True when the corresponding execution actions are available */
+    canExecute: boolean;
+    onExecuteAction: (action: RepairAction) => void;
+    onDismiss: () => void;
+}
+declare const RepairCard: React.FC<RepairCardProps>;
+export default RepairCard;

package/dist/components/AiNative/ReviewBar.d.ts

@@ -0,0 +1,21 @@
+/**
+ * ReviewBar — canvas-side status bar for the pending AI proposal (M2.2 simplified)
+ *
+ * The chat-inline ProposalPreviewCard is the single decision point for AI proposals
+ * (business step preview, accept/reject). When the user opens the canvas drawer,
+ * ReviewBar just reflects that a proposal is pending and offers the same two
+ * actions — it doesn't duplicate the review UI or offer per-item selection
+ * (that granular-accept UI was engineering-facing and has been removed; the
+ * AI-native way to keep only part of a proposal is to say so in chat and let the
+ * model regenerate). `applyPartialProposal` remains exported from toolExecutor for
+ * integrators who want to build their own granular-accept UI.
+ */
+import React from 'react';
+import type { ProposedChange } from '../../store/aiStore';
+interface ReviewBarProps {
+    proposal: ProposedChange | null;
+    onAccept: () => void;
+    onReject: () => void;
+}
+declare const ReviewBar: React.FC<ReviewBarProps>;
+export default ReviewBar;

package/dist/components/AiNative/WorkflowRunCard.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import type { WorkflowDef, WorkflowInstance } from '../../types/conductor';
+interface WorkflowRunCardProps {
+    workflowDef: WorkflowDef;
+    /** Signature matches WorkflowIDE's onTriggerExecution — one adapter serves both components. */
+    onTriggerExecution: (workflowName: string, version: number, input: Record<string, any>) => Promise<{
+        workflowId: string;
+    }>;
+    /** Signature matches WorkflowIDE's onPollExecution: null while pending, WorkflowInstance once available. */
+    onPollExecution: (workflowId: string) => Promise<WorkflowInstance | null>;
+    onClose: () => void;
+}
+declare const WorkflowRunCard: React.FC<WorkflowRunCardProps>;
+export default WorkflowRunCard;

package/dist/components/BrandLogo.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+interface BrandLogoProps {
+    size?: number;
+    className?: string;
+    style?: React.CSSProperties;
+}
+/**
+ * Conductor Workflow IDE 极简几何品牌 Logo
+ *
+ * 设计语言：深空圆角矩形底座 + 贝塞尔双分支编排流向 + 三色确定性拓扑节点（靛紫起点 → 青蓝分支 / 翠绿沙箱通过节点）
+ */
+export declare const BrandLogo: React.FC<BrandLogoProps>;
+export default BrandLogo;

package/dist/components/Controls/ModeSlider.d.ts

@@ -0,0 +1,2 @@
+import './ModeSlider.css';
+export default function ModeSlider(): import("react/jsx-runtime").JSX.Element;

package/dist/components/ExecutionWaterfallPanel.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const ExecutionWaterfallPanel: React.FC;
+export default ExecutionWaterfallPanel;

package/dist/components/SandboxConfigModal.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+interface SandboxConfigModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+}
+export declare const SandboxConfigModal: React.FC<SandboxConfigModalProps>;
+export default SandboxConfigModal;

package/dist/components/StructuredJsonViewer.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+interface StructuredJsonViewerProps {
+    data: any;
+    /** Optional taskReferenceName to generate `${taskRef.output.xxx}` expressions on hover */
+    taskReferenceName?: string;
+    /** Either 'output' or 'input' (or 'workflow.input') for expression path generation */
+    expressionScope?: 'output' | 'input' | 'workflow.input';
+    maxHeight?: string;
+}
+export declare const StructuredJsonViewer: React.FC<StructuredJsonViewerProps>;
+export default StructuredJsonViewer;

package/dist/components/nodes/NodeLayout.d.ts

@@ -4,7 +4,9 @@ interface NodeLayoutProps {
     icon: React.ElementType;
     header: string;
     title: string;
+    subTitle?: string;
     meta?: string;
+    duration?: string;
     color: string;
     status?: ExecutionStatus;
     isRunning?: boolean;
@@ -12,5 +14,5 @@ interface NodeLayoutProps {
     width?: string | number;
     border?: boolean;
 }
-declare const _default: React.MemoExoticComponent<({ icon: Icon, header, title, meta, color, status, isRunning, children, width, border }: NodeLayoutProps) => import("react/jsx-runtime").JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ icon: Icon, header, title, subTitle, meta, duration, color, status, isRunning, children, width, }: NodeLayoutProps) => import("react/jsx-runtime").JSX.Element>;
 export default _default;

package/dist/components/nodes/NodeWrapper.d.ts

@@ -12,6 +12,7 @@ interface NodeWrapperProps {
     executionStatus?: ExecutionStatus;
     simRunning?: boolean;
     simDone?: boolean;
+    proposalStatus?: 'added' | 'modified' | 'removed';
 }
-declare const NodeWrapper: ({ children, nodeId, selected, isStartOrEnd, isError, hasWarning, isDecision, isHighlighted, executionStatus, simRunning, simDone, }: NodeWrapperProps) => import("react/jsx-runtime").JSX.Element;
+declare const NodeWrapper: ({ children, nodeId, selected, isStartOrEnd, isError, hasWarning, isDecision, isHighlighted, executionStatus, simRunning, simDone, proposalStatus, }: NodeWrapperProps) => import("react/jsx-runtime").JSX.Element;
 export default NodeWrapper;

package/dist/hooks/useNodeExecution.d.ts

@@ -1,9 +1,12 @@
+import type { TaskExecutionData } from '../types/workflow';
 /**
- * 获取节点的运行态信息（mode、executionData、retryCount）
+ * 获取节点的运行态信息（mode、executionData、retryCount），
+ * 支持 DO_WHILE 循环迭代轮次切换与 Time-Travel 时间旅行状态投影。
  */
 export declare const useNodeExecution: (taskReferenceName: string) => {
     mode: import("../types/workflow").EditorMode;
-    execution: import("../types/workflow").TaskExecutionData | null | undefined;
+    execution: TaskExecutionData | null;
     isRunning: boolean;
     retryCount: number;
+    durationText: string | undefined;
 };

package/dist/hooks/useNodeLayout.d.ts

@@ -4,7 +4,7 @@ import { WorkflowNodeData } from '../types/workflow';
  * 从节点数据中计算 Handle 的 source/target 位置
  */
 export declare const useNodeLayout: (data: WorkflowNodeData) => {
-    layoutDirection: import("../types/workflow").LayoutDirection;
+    layoutDirection: import("../ai").LayoutDirection;
     sourcePosition: Position;
     targetPosition: Position;
 };

package/dist/index.d.ts

@@ -3,4 +3,8 @@ export type { WorkflowIDEProps, WorkflowIDERef } from './WorkflowIDE';
 export type { WorkflowDef, TaskDef, WorkflowInputParam, WorkflowInstance } from './types/conductor';
 export { parseWorkflowInputParams } from './types/conductor';
 export type { AIServiceConfig } from './services/aiService';
-export type { ExecutionActions, RestartOptions, ViewMode, RunState } from './types/workflow';
+export type { ExecutionActions, RestartOptions, ViewMode, RunState, WorkflowExecutionInput } from './types/workflow';
+export { getCompletionItems, buildDataFlowGraph, refactorTaskReferenceName, getUpstreamAncestors, inferTaskOutputSchema, } from './services/wlsp/workflowLsp';
+export type { WlspCompletionItem, DataFlowGraph, DataFlowEdge, InferredField, UpstreamTaskInfo, } from './services/wlsp/workflowLsp';
+export { executeLocalSandboxDryRun, buildDefaultWorkflowMockInput, generateDefaultTaskOutputPreview, } from './utils/localSandboxEngine';
+export type { SandboxDryRunOptions, TaskMockOverride, } from './utils/localSandboxEngine';

package/dist/logo.svg

@@ -0,0 +1,37 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" fill="none">
+  <defs>
+    <linearGradient id="bg-grad" x1="0" y1="0" x2="32" y2="32" gradientUnits="userSpaceOnUse">
+      <stop offset="0%" stop-color="#11172B" />
+      <stop offset="100%" stop-color="#090D18" />
+    </linearGradient>
+    <linearGradient id="border-grad" x1="0" y1="0" x2="32" y2="32" gradientUnits="userSpaceOnUse">
+      <stop offset="0%" stop-color="#6366F1" stop-opacity="0.75" />
+      <stop offset="100%" stop-color="#06B6D4" stop-opacity="0.45" />
+    </linearGradient>
+    <linearGradient id="branch-top" x1="9" y1="16" x2="23" y2="10" gradientUnits="userSpaceOnUse">
+      <stop offset="0%" stop-color="#818CF8" />
+      <stop offset="100%" stop-color="#22D3EE" />
+    </linearGradient>
+    <linearGradient id="branch-bottom" x1="9" y1="16" x2="23" y2="22" gradientUnits="userSpaceOnUse">
+      <stop offset="0%" stop-color="#6366F1" />
+      <stop offset="100%" stop-color="#34D399" />
+    </linearGradient>
+  </defs>
+
+  <!-- Minimalist Squircle Base -->
+  <rect x="1.25" y="1.25" width="29.5" height="29.5" rx="8" fill="url(#bg-grad)" stroke="url(#border-grad)" stroke-width="1.5" />
+
+  <!-- Bifurcated DAG Flow Curves -->
+  <path d="M 9.5 16 C 15 16, 15.5 10, 22.5 10" stroke="url(#branch-top)" stroke-width="2.4" stroke-linecap="round" />
+  <path d="M 9.5 16 C 15 16, 15.5 22, 22.5 22" stroke="url(#branch-bottom)" stroke-width="2.4" stroke-linecap="round" />
+
+  <!-- Origin Root Node -->
+  <circle cx="9.5" cy="16" r="3.4" fill="#6366F1" />
+  <circle cx="9.5" cy="16" r="1.4" fill="#F8FAFC" />
+
+  <!-- Upper Branch Target Node -->
+  <circle cx="22.5" cy="10" r="2.7" fill="#22D3EE" />
+
+  <!-- Lower Branch Deterministic Pass Node -->
+  <circle cx="22.5" cy="22" r="2.7" fill="#34D399" />
+</svg>