@echothink-ui/workflow 0.1.0

package/README.md

@@ -0,0 +1,5 @@
+# @echothink-ui/workflow
+
+Workflow package for EchoThink app-domain websites.
+
+This package is part of the EchoThink-UI app-domain library. It is designed for normal website app domains rendered inside EchoThink Studio's Chromium shell, not for implementing the studio browser chrome itself.

package/dist/components/ApprovalWorkflowEditor.d.ts

@@ -0,0 +1,2 @@
+import type { ApprovalWorkflowEditorProps } from "./types";
+export declare function ApprovalWorkflowEditor({ steps, onChange, className, ...props }: ApprovalWorkflowEditorProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ConditionBuilder.d.ts

@@ -0,0 +1,2 @@
+import type { ConditionBuilderProps } from "./types";
+export declare function ConditionBuilder({ value, onChange, variables, className, ...props }: ConditionBuilderProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/PipelineStage.d.ts

@@ -0,0 +1,2 @@
+import type { PipelineStageProps } from "./types";
+export declare function PipelineStage({ stage, active, onSelect, className, ...props }: PipelineStageProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ProcessDesigner.d.ts

@@ -0,0 +1,2 @@
+import type { ProcessDesignerProps } from "./types";
+export declare function ProcessDesigner({ nodes, edges, onNodeMove, onAddNode, onConnect, className, ...props }: ProcessDesignerProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/ProcessTimeline.d.ts

@@ -0,0 +1,2 @@
+import type { ProcessTimelineProps } from "./types";
+export declare function ProcessTimeline({ events, className, ...props }: ProcessTimelineProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/RuleBuilder.d.ts

@@ -0,0 +1,2 @@
+import type { RuleBuilderProps } from "./types";
+export declare function RuleBuilder({ value, onChange, variables, className, ...props }: RuleBuilderProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/RuleSimulationPanel.d.ts

@@ -0,0 +1,2 @@
+import type { RuleSimulationPanelProps } from "./types";
+export declare function RuleSimulationPanel({ rule, sampleInputs, results, onRun, className, ...props }: RuleSimulationPanelProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/WorkflowHandoffPanel.d.ts

@@ -0,0 +1,2 @@
+import type { WorkflowHandoffPanelProps } from "./types";
+export declare function WorkflowHandoffPanel({ item, assigneeOptions, onSubmit, className, ...props }: WorkflowHandoffPanelProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/WorkflowPipelineView.d.ts

@@ -0,0 +1,2 @@
+import type { WorkflowPipelineViewProps } from "./types";
+export declare function WorkflowPipelineView({ stages, activeStageId, onSelect, className, ...props }: WorkflowPipelineViewProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/types.d.ts

@@ -0,0 +1,112 @@
+import type * as React from "react";
+import type { EthOperationalStatus } from "@echothink-ui/core";
+export interface WorkflowStage extends Record<string, unknown> {
+    id: string;
+    label: string;
+    status: EthOperationalStatus;
+    startedAt?: string;
+    durationMs?: number;
+}
+export interface WorkflowPipelineViewProps extends Omit<React.HTMLAttributes<HTMLElement>, "onSelect"> {
+    stages: WorkflowStage[];
+    activeStageId?: string;
+    onSelect?: (id: string) => void;
+}
+export interface PipelineStageProps extends Omit<React.HTMLAttributes<HTMLElement>, "onSelect"> {
+    stage: WorkflowStage;
+    active?: boolean;
+    onSelect?: (id: string) => void;
+}
+export interface ProcessNode extends Record<string, unknown> {
+    id: string;
+    label: string;
+    type: "task" | "decision" | "start" | "end";
+    x?: number;
+    y?: number;
+}
+export interface ProcessEdge extends Record<string, unknown> {
+    from: string;
+    to: string;
+    label?: string;
+}
+export interface ProcessDesignerProps extends Omit<React.HTMLAttributes<HTMLElement>, "onSelect"> {
+    nodes: ProcessNode[];
+    edges: ProcessEdge[];
+    onNodeMove?: (id: string, x: number, y: number) => void;
+    onAddNode?: () => void;
+    onConnect?: (from: string, to: string) => void;
+}
+export interface WorkflowRuleCondition extends Record<string, unknown> {
+    field: string;
+    operator: "equals" | "not-equals" | "contains" | "gt" | "gte" | "lt" | "lte" | "exists";
+    value?: string;
+}
+export interface WorkflowRule extends Record<string, unknown> {
+    combinator: "all" | "any";
+    conditions: WorkflowRuleCondition[];
+}
+export interface RuleBuilderProps extends Omit<React.HTMLAttributes<HTMLElement>, "onChange"> {
+    value?: WorkflowRule;
+    onChange?: (rule: WorkflowRule) => void;
+    variables?: string[];
+}
+export interface ConditionBuilderProps extends Omit<React.HTMLAttributes<HTMLElement>, "onChange"> {
+    value: WorkflowRuleCondition;
+    onChange: (condition: WorkflowRuleCondition) => void;
+    variables?: string[];
+}
+export interface RuleSimulationSample extends Record<string, unknown> {
+    id: string;
+    label: string;
+    data: unknown;
+    expectedOutcome?: unknown;
+}
+export interface RuleSimulationResult extends Record<string, unknown> {
+    sampleId: string;
+    actualOutcome: unknown;
+    matched: boolean;
+}
+export interface RuleSimulationPanelProps extends Omit<React.HTMLAttributes<HTMLElement>, "results"> {
+    rule: unknown;
+    sampleInputs: RuleSimulationSample[];
+    results?: RuleSimulationResult[];
+    onRun?: () => void;
+}
+export interface WorkflowHandoffPanelProps extends Omit<React.HTMLAttributes<HTMLElement>, "onSubmit"> {
+    item?: {
+        id: string;
+        label: React.ReactNode;
+        status?: EthOperationalStatus;
+    };
+    assigneeOptions?: Array<{
+        id: string;
+        label: string;
+        kind?: "user" | "team" | "agent";
+    }>;
+    onSubmit?: (handoff: {
+        assigneeId: string;
+        reason: string;
+    }) => void;
+}
+export interface ApprovalWorkflowEditorProps extends Omit<React.HTMLAttributes<HTMLElement>, "onChange"> {
+    steps?: Array<{
+        id: string;
+        label: string;
+        approver?: string;
+        required?: boolean;
+    }>;
+    onChange?: (steps: Array<{
+        id: string;
+        label: string;
+        approver?: string;
+        required?: boolean;
+    }>) => void;
+}
+export interface ProcessTimelineProps extends React.HTMLAttributes<HTMLElement> {
+    events?: Array<{
+        id: string;
+        label: React.ReactNode;
+        timestamp?: string;
+        status?: EthOperationalStatus;
+    }>;
+}

package/dist/index.cjs

@@ -0,0 +1,499 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.tsx
+var index_exports = {};
+__export(index_exports, {
+  ApprovalWorkflowEditor: () => ApprovalWorkflowEditor,
+  ConditionBuilder: () => ConditionBuilder,
+  PipelineStage: () => PipelineStage,
+  ProcessDesigner: () => ProcessDesigner,
+  ProcessTimeline: () => ProcessTimeline,
+  RuleBuilder: () => RuleBuilder,
+  RuleSimulationPanel: () => RuleSimulationPanel,
+  WorkflowComponentNames: () => WorkflowComponentNames,
+  WorkflowHandoffPanel: () => WorkflowHandoffPanel,
+  WorkflowPipelineView: () => WorkflowPipelineView
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/components/ApprovalWorkflowEditor.tsx
+var import_core = require("@echothink-ui/core");
+var import_jsx_runtime = require("react/jsx-runtime");
+function ApprovalWorkflowEditor({ steps = [], onChange, className, ...props }) {
+  const update = (index, next) => {
+    const nextSteps = [...steps];
+    nextSteps[index] = next;
+    onChange?.(nextSteps);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    "section",
+    {
+      ...props,
+      className: `eth-workflow-approval-editor ${className ?? ""}`,
+      "data-eth-component": "ApprovalWorkflowEditor",
+      children: [
+        steps.map((step, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "eth-workflow-approval-editor__step", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.TextInput, { value: step.label, onChange: (event) => update(index, { ...step, label: event.currentTarget.value }), "aria-label": "Step label" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.TextInput, { value: step.approver ?? "", onChange: (event) => update(index, { ...step, approver: event.currentTarget.value }), "aria-label": "Approver" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Checkbox, { checked: Boolean(step.required), label: "Required", onChange: (event) => update(index, { ...step, required: event.currentTarget.checked }) })
+        ] }, step.id)),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_core.Button,
+          {
+            intent: "secondary",
+            density: "compact",
+            onClick: () => onChange?.([...steps, { id: `step-${steps.length + 1}`, label: "Approval step", required: true }]),
+            children: "Add approval"
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/components/ConditionBuilder.tsx
+var import_core2 = require("@echothink-ui/core");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var operators = [
+  { value: "equals", label: "Equals" },
+  { value: "not-equals", label: "Does not equal" },
+  { value: "contains", label: "Contains" },
+  { value: "gt", label: "Greater than" },
+  { value: "gte", label: "Greater than or equal" },
+  { value: "lt", label: "Less than" },
+  { value: "lte", label: "Less than or equal" },
+  { value: "exists", label: "Exists" }
+];
+function ConditionBuilder({ value, onChange, variables = [], className, ...props }) {
+  const fieldOptions = variables.length ? variables.map((field) => ({ value: field, label: field })) : [{ value: value.field, label: value.field || "field" }];
+  const update = (key, nextValue) => {
+    onChange({ ...value, [key]: nextValue });
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    "section",
+    {
+      ...props,
+      className: `eth-workflow-condition-builder ${className ?? ""}`,
+      "data-eth-component": "ConditionBuilder",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.FormField, { label: "Field", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.Select, { value: value.field, options: fieldOptions, onChange: (event) => update("field", event.currentTarget.value) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.FormField, { label: "Operator", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.Select, { value: value.operator, options: operators, onChange: (event) => update("operator", event.currentTarget.value) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.FormField, { label: "Value", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.TextInput, { value: value.value ?? "", onChange: (event) => update("value", event.currentTarget.value), disabled: value.operator === "exists" }) })
+      ]
+    }
+  );
+}
+
+// src/components/PipelineStage.tsx
+var import_core3 = require("@echothink-ui/core");
+var import_jsx_runtime3 = require("react/jsx-runtime");
+function PipelineStage({ stage, active, onSelect, className, ...props }) {
+  const content = /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core3.StatusDot, { status: stage.status, label: stage.status }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("strong", { children: stage.label }),
+    stage.durationMs !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("small", { children: [
+      stage.durationMs,
+      "ms"
+    ] }) : null
+  ] });
+  return onSelect ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    "button",
+    {
+      ...props,
+      type: "button",
+      className: `eth-workflow-pipeline-stage ${active ? "eth-workflow-pipeline-stage--active" : ""} ${className ?? ""}`,
+      "data-eth-component": "PipelineStage",
+      onClick: () => onSelect(stage.id),
+      children: content
+    }
+  ) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+    "article",
+    {
+      ...props,
+      className: `eth-workflow-pipeline-stage ${active ? "eth-workflow-pipeline-stage--active" : ""} ${className ?? ""}`,
+      "data-eth-component": "PipelineStage",
+      children: content
+    }
+  );
+}
+
+// src/components/ProcessDesigner.tsx
+var React = __toESM(require("react"), 1);
+var import_core4 = require("@echothink-ui/core");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+function ProcessDesigner({
+  nodes,
+  edges,
+  onNodeMove,
+  onAddNode,
+  onConnect,
+  className,
+  ...props
+}) {
+  const svgRef = React.useRef(null);
+  const [positions, setPositions] = React.useState(() => initialPositions(nodes));
+  const [draggingId, setDraggingId] = React.useState(null);
+  const [selectedNodeId, setSelectedNodeId] = React.useState(null);
+  React.useEffect(() => {
+    setPositions(initialPositions(nodes));
+  }, [nodes]);
+  const pointFromEvent = (event) => {
+    const rect = svgRef.current?.getBoundingClientRect();
+    if (!rect) return { x: 0, y: 0 };
+    return {
+      x: (event.clientX - rect.left) / rect.width * 900,
+      y: (event.clientY - rect.top) / rect.height * 420
+    };
+  };
+  const move = (event) => {
+    if (!draggingId) return;
+    const point = pointFromEvent(event);
+    setPositions((current) => ({ ...current, [draggingId]: point }));
+  };
+  const stop = () => {
+    if (!draggingId) return;
+    const point = positions[draggingId];
+    if (point) onNodeMove?.(draggingId, point.x, point.y);
+    setDraggingId(null);
+  };
+  const clickNode = (id) => {
+    if (selectedNodeId && selectedNodeId !== id) {
+      onConnect?.(selectedNodeId, id);
+      setSelectedNodeId(null);
+    } else {
+      setSelectedNodeId(id);
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+    "section",
+    {
+      ...props,
+      className: `eth-workflow-process-designer ${className ?? ""}`,
+      "data-eth-component": "ProcessDesigner",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("header", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("h3", { children: "Process designer" }),
+          onAddNode ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.Button, { intent: "secondary", density: "compact", onClick: onAddNode, children: "Add node" }) : null
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+          "svg",
+          {
+            ref: svgRef,
+            viewBox: "0 0 900 420",
+            role: "img",
+            "aria-label": "Process graph",
+            onMouseMove: move,
+            onMouseUp: stop,
+            onMouseLeave: stop,
+            children: [
+              edges.map((edge, index) => {
+                const from = positions[edge.from];
+                const to = positions[edge.to];
+                if (!from || !to) return null;
+                const midX = (from.x + to.x) / 2;
+                const midY = (from.y + to.y) / 2;
+                return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("g", { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("line", { x1: from.x, y1: from.y, x2: to.x, y2: to.y, stroke: "var(--eth-color-border-strong)", strokeWidth: 2, markerEnd: "url(#eth-workflow-arrow)" }),
+                  edge.label ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("text", { x: midX, y: midY - 6, textAnchor: "middle", fontSize: 12, children: edge.label }) : null
+                ] }, `${edge.from}-${edge.to}-${index}`);
+              }),
+              /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("marker", { id: "eth-workflow-arrow", viewBox: "0 0 10 10", refX: "8", refY: "5", markerWidth: "6", markerHeight: "6", orient: "auto-start-reverse", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M 0 0 L 10 5 L 0 10 z", fill: "var(--eth-color-border-strong)" }) }) }),
+              nodes.map((node) => {
+                const point = positions[node.id];
+                if (!point) return null;
+                return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+                  "g",
+                  {
+                    transform: `translate(${point.x}, ${point.y})`,
+                    className: `eth-workflow-process-designer__node eth-workflow-process-designer__node--${node.type} ${selectedNodeId === node.id ? "eth-workflow-process-designer__node--selected" : ""}`,
+                    onMouseDown: (event) => {
+                      event.preventDefault();
+                      setDraggingId(node.id);
+                    },
+                    onClick: () => clickNode(node.id),
+                    children: [
+                      node.type === "decision" ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("polygon", { points: "0,-32 54,0 0,32 -54,0", fill: "var(--eth-color-layer-01)", stroke: "var(--eth-color-border-strong)", strokeWidth: 2 }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("rect", { x: -62, y: -28, width: 124, height: 56, rx: 0, fill: "var(--eth-color-layer-01)", stroke: "var(--eth-color-border-strong)", strokeWidth: 2 }),
+                      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("text", { textAnchor: "middle", dominantBaseline: "middle", fontSize: 13, children: node.label })
+                    ]
+                  },
+                  node.id
+                );
+              })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+function initialPositions(nodes) {
+  const positions = {};
+  nodes.forEach((node, index) => {
+    positions[node.id] = {
+      x: node.x ?? 100 + index % 5 * 170,
+      y: node.y ?? 90 + Math.floor(index / 5) * 120
+    };
+  });
+  return positions;
+}
+
+// src/components/ProcessTimeline.tsx
+var import_core5 = require("@echothink-ui/core");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+function ProcessTimeline({ events = [], className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+    "section",
+    {
+      ...props,
+      className: `eth-workflow-process-timeline ${className ?? ""}`,
+      "data-eth-component": "ProcessTimeline",
+      children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("ol", { children: events.map((event) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("li", { children: [
+        event.status ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_core5.StatusDot, { status: event.status }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { children: event.label }),
+        event.timestamp ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("time", { dateTime: event.timestamp, children: event.timestamp }) : null
+      ] }, event.id)) })
+    }
+  );
+}
+
+// src/components/RuleBuilder.tsx
+var React2 = __toESM(require("react"), 1);
+var import_core6 = require("@echothink-ui/core");
+var import_jsx_runtime6 = require("react/jsx-runtime");
+var defaultRule = {
+  combinator: "all",
+  conditions: [{ field: "", operator: "equals", value: "" }]
+};
+function RuleBuilder({ value, onChange, variables = [], className, ...props }) {
+  const [internalRule, setInternalRule] = React2.useState(value ?? defaultRule);
+  const rule = value ?? internalRule;
+  const commit = (nextRule) => {
+    setInternalRule(nextRule);
+    onChange?.(nextRule);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+    "section",
+    {
+      ...props,
+      className: `eth-workflow-rule-builder ${className ?? ""}`,
+      "data-eth-component": "RuleBuilder",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core6.FormField, { label: "Match", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+          import_core6.Select,
+          {
+            value: rule.combinator,
+            options: [
+              { value: "all", label: "All conditions" },
+              { value: "any", label: "Any condition" }
+            ],
+            onChange: (event) => commit({ ...rule, combinator: event.currentTarget.value })
+          }
+        ) }),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "eth-workflow-rule-builder__conditions", children: rule.conditions.map((condition, index) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "eth-workflow-rule-builder__condition", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+            ConditionBuilder,
+            {
+              value: condition,
+              variables,
+              onChange: (nextCondition) => {
+                const conditions = [...rule.conditions];
+                conditions[index] = nextCondition;
+                commit({ ...rule, conditions });
+              }
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+            import_core6.Button,
+            {
+              intent: "ghost",
+              density: "compact",
+              onClick: () => commit({ ...rule, conditions: rule.conditions.filter((_, itemIndex) => itemIndex !== index) }),
+              children: "Remove"
+            }
+          )
+        ] }, index)) }),
+        /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+          import_core6.Button,
+          {
+            intent: "secondary",
+            density: "compact",
+            onClick: () => commit({ ...rule, conditions: [...rule.conditions, { field: variables[0] ?? "", operator: "equals", value: "" }] }),
+            children: "Add condition"
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/components/RuleSimulationPanel.tsx
+var import_core7 = require("@echothink-ui/core");
+var import_data = require("@echothink-ui/data");
+var import_jsx_runtime7 = require("react/jsx-runtime");
+function RuleSimulationPanel({
+  rule,
+  sampleInputs,
+  results = [],
+  onRun,
+  className,
+  ...props
+}) {
+  const resultMap = new Map(results.map((result) => [result.sampleId, result]));
+  const rows = sampleInputs.map((sample) => ({
+    ...sample,
+    actualOutcome: resultMap.get(sample.id)?.actualOutcome,
+    matched: resultMap.get(sample.id)?.matched
+  }));
+  const columns = [
+    { key: "label", header: "Sample" },
+    { key: "data", header: "Input", render: (row) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("code", { children: JSON.stringify(row.data) }) },
+    { key: "expectedOutcome", header: "Expected", render: (row) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("code", { children: JSON.stringify(row.expectedOutcome) }) },
+    { key: "actualOutcome", header: "Actual", render: (row) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("code", { children: JSON.stringify(row.actualOutcome) }) },
+    { key: "matched", header: "Matched", render: (row) => row.matched ? "Yes" : row.matched === false ? "No" : "Not run" }
+  ];
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+    "section",
+    {
+      ...props,
+      className: `eth-workflow-rule-simulation ${className ?? ""}`,
+      "data-eth-component": "RuleSimulationPanel",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("header", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("h3", { children: "Rule simulation" }),
+          onRun ? /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.Button, { onClick: onRun, children: "Run" }) : null
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("pre", { className: "eth-workflow-rule-simulation__rule", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("code", { children: JSON.stringify(rule, null, 2) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_data.DataTable, { rows, columns, rowKey: "id" })
+      ]
+    }
+  );
+}
+
+// src/components/WorkflowHandoffPanel.tsx
+var React3 = __toESM(require("react"), 1);
+var import_core8 = require("@echothink-ui/core");
+var import_jsx_runtime8 = require("react/jsx-runtime");
+function WorkflowHandoffPanel({
+  item,
+  assigneeOptions = [],
+  onSubmit,
+  className,
+  ...props
+}) {
+  const [assigneeId, setAssigneeId] = React3.useState(assigneeOptions[0]?.id ?? "");
+  const [reason, setReason] = React3.useState("");
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+    "section",
+    {
+      ...props,
+      className: `eth-workflow-handoff-panel ${className ?? ""}`,
+      "data-eth-component": "WorkflowHandoffPanel",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("header", { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h3", { children: "Workflow handoff" }),
+          item?.status ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core8.StatusDot, { status: item.status, label: item.status }) : null
+        ] }),
+        item ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("p", { children: item.label }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("form", { onSubmit: (event) => {
+          event.preventDefault();
+          onSubmit?.({ assigneeId, reason });
+        }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core8.FormField, { label: "Assignee", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+            import_core8.Select,
+            {
+              value: assigneeId,
+              options: assigneeOptions.map((option) => ({ value: option.id, label: option.kind ? `${option.label} (${option.kind})` : option.label })),
+              onChange: (event) => setAssigneeId(event.currentTarget.value)
+            }
+          ) }),
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core8.FormField, { label: "Reason", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core8.Textarea, { value: reason, rows: 4, onChange: (event) => setReason(event.currentTarget.value) }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core8.Button, { type: "submit", disabled: !assigneeId, children: "Handoff" })
+        ] })
+      ]
+    }
+  );
+}
+
+// src/components/WorkflowPipelineView.tsx
+var import_jsx_runtime9 = require("react/jsx-runtime");
+function WorkflowPipelineView({
+  stages,
+  activeStageId,
+  onSelect,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+    "section",
+    {
+      ...props,
+      className: `eth-workflow-pipeline-view ${className ?? ""}`,
+      "data-eth-component": "WorkflowPipelineView",
+      "aria-label": "Workflow pipeline",
+      children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("ol", { className: "eth-workflow-pipeline-view__stages", children: stages.map((stage, index) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+        PipelineStage,
+        {
+          stage,
+          active: stage.id === activeStageId,
+          onSelect,
+          "aria-posinset": index + 1,
+          "aria-setsize": stages.length
+        }
+      ) }, stage.id)) })
+    }
+  );
+}
+
+// src/index.tsx
+var WorkflowComponentNames = [
+  "WorkflowPipelineView",
+  "PipelineStage",
+  "ProcessDesigner",
+  "RuleBuilder",
+  "ConditionBuilder",
+  "RuleSimulationPanel",
+  "WorkflowHandoffPanel",
+  "ApprovalWorkflowEditor",
+  "ProcessTimeline"
+];
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ApprovalWorkflowEditor,
+  ConditionBuilder,
+  PipelineStage,
+  ProcessDesigner,
+  ProcessTimeline,
+  RuleBuilder,
+  RuleSimulationPanel,
+  WorkflowComponentNames,
+  WorkflowHandoffPanel,
+  WorkflowPipelineView
+});
+//# sourceMappingURL=index.cjs.map