@particle-academy/fancy-flow 0.8.0 → 0.10.0

package/dist/index.cjs

@@ -8,6 +8,8 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
 var ReactExports__default = /*#__PURE__*/_interopDefault(ReactExports);
 
+// src/registry/builtin.ts
+
 // src/registry/registry.ts
 var kinds = /* @__PURE__ */ new Map();
 var listeners = /* @__PURE__ */ new Set();
@@ -81,6 +83,47 @@ function validateField(field, value) {
     case "json":
       return null;
     // permissive — just JSON-shaped
+    case "repeater": {
+      if (!Array.isArray(value)) return `${field.label} must be a list`;
+      if (field.minItems !== void 0 && value.length < field.minItems) {
+        return `${field.label} needs at least ${field.minItems}`;
+      }
+      if (field.maxItems !== void 0 && value.length > field.maxItems) {
+        return `${field.label} allows at most ${field.maxItems}`;
+      }
+      for (let i = 0; i < value.length; i++) {
+        const row = value[i];
+        if (!row || typeof row !== "object" || Array.isArray(row)) {
+          return `${field.label} item ${i + 1} must be an object`;
+        }
+        for (const sub of field.fields) {
+          const cell = row[sub.key];
+          if (sub.required && (cell === void 0 || cell === null || cell === "")) {
+            return `${field.label} item ${i + 1}: ${sub.label} is required`;
+          }
+          if (cell === void 0 || cell === null) continue;
+          const issue = validateField(sub, cell);
+          if (issue) return `${field.label} item ${i + 1}: ${issue}`;
+        }
+      }
+      return null;
+    }
+    case "keyvalue": {
+      if (typeof value !== "object" || value === null || Array.isArray(value)) {
+        return `${field.label} must be a key/value map`;
+      }
+      const allowed = field.valueOptions?.map((o) => o.value);
+      for (const [k, v] of Object.entries(value)) {
+        if (typeof v !== "string") return `${field.label}: "${k}" must be a string`;
+        if (allowed && !allowed.includes(v)) {
+          return `${field.label}: "${k}" must be one of ${allowed.join(", ")}`;
+        }
+      }
+      return null;
+    }
+    case "document":
+      return null;
+    // opaque to fancy-flow — the host's editor owns its shape
     default:
       return null;
   }
@@ -105,8 +148,90 @@ function categoryAccent(category) {
       return "#71717a";
   }
 }
+var adapter = null;
+var listeners2 = /* @__PURE__ */ new Set();
+function registerRichInputAdapter(next) {
+  adapter = next;
+  for (const l of listeners2) l();
+  return () => {
+    if (adapter === next) {
+      adapter = null;
+      for (const l of listeners2) l();
+    }
+  };
+}
+function getRichInputAdapter() {
+  return adapter;
+}
+function isRichInputEnabled() {
+  return adapter !== null && (adapter.renderDocument !== void 0 || adapter.renderEditor !== void 0);
+}
+function onRichInputAdapterChanged(fn) {
+  listeners2.add(fn);
+  return () => listeners2.delete(fn);
+}
+function RichInputPreview({ config }) {
+  const a = getRichInputAdapter();
+  const title = typeof config.title === "string" && config.title.trim() !== "" ? config.title : "Untitled step";
+  const doc = config.document;
+  if (!a || !a.renderDocument && !a.renderEditor) {
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ff-rich-preview", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ff-rich-preview__title", children: title }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ff-rich-preview__unavailable", children: [
+        "Add ",
+        /* @__PURE__ */ jsxRuntime.jsx("code", { children: "@particle-academy/fancy-cms-ui" }),
+        " +",
+        " ",
+        /* @__PURE__ */ jsxRuntime.jsx("code", { children: "@particle-academy/react-fancy" }),
+        ", then",
+        " ",
+        /* @__PURE__ */ jsxRuntime.jsx("code", { children: 'import "@particle-academy/fancy-flow/rich-input"' }),
+        "."
+      ] })
+    ] });
+  }
+  const body = doc === void 0 || doc === null ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "ff-rich-preview__unavailable", children: "Nothing authored yet." }) : a.renderDocument?.(doc) ?? null;
+  const Frame = a.FauxClient;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ff-rich-preview", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ff-rich-preview__title", children: title }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ff-rich-preview__frame", children: Frame ? /* @__PURE__ */ jsxRuntime.jsx(Frame, { ...a.frameProps ?? { variant: "browser" }, children: body }) : body })
+  ] });
+}
 
 // src/registry/builtin.ts
+function casePorts(cases) {
+  const byPort = /* @__PURE__ */ new Map();
+  if (cases && typeof cases === "object" && !Array.isArray(cases)) {
+    for (const [match, port] of Object.entries(cases)) {
+      if (typeof port !== "string" || port === "" || port === "default") continue;
+      const matches = byPort.get(port) ?? [];
+      matches.push(match);
+      byPort.set(port, matches);
+    }
+  }
+  const ports = [...byPort].map(([id2, matches]) => ({
+    id: id2,
+    label: matches.join("|")
+  }));
+  return [...ports, { id: "default", label: "default" }];
+}
+function routePorts(routes, fallback) {
+  const ports = [];
+  const seen = /* @__PURE__ */ new Set();
+  if (Array.isArray(routes)) {
+    for (const route of routes) {
+      const id2 = route?.port;
+      if (typeof id2 !== "string" || id2.trim() === "" || seen.has(id2)) continue;
+      seen.add(id2);
+      ports.push({ id: id2, label: id2 });
+    }
+  }
+  if (fallback !== false && !seen.has("fallback")) {
+    ports.push({ id: "fallback", label: "fallback" });
+  }
+  if (ports.length === 0) ports.push({ id: "out" });
+  return ports;
+}
 var HTTP_METHODS = [
   { type: "select", key: "method", label: "Method", options: [
     { value: "GET", label: "GET" },
@@ -175,15 +300,59 @@ var KINDS = [
     configSchema: [
       { type: "text", key: "title", label: "Form title", default: "Need your input" },
       {
-        type: "json",
+        type: "repeater",
         key: "fields",
-        label: "Fields (JSON)",
-        language: "json",
-        rows: 6,
-        default: [{ key: "answer", label: "Your answer", type: "textarea" }]
+        label: "Fields",
+        description: "The form the run pauses on.",
+        titleKey: "label",
+        addLabel: "Add field",
+        minItems: 1,
+        fields: [
+          { type: "text", key: "key", label: "Key", required: true, placeholder: "answer" },
+          { type: "text", key: "label", label: "Label", required: true, placeholder: "Your answer" },
+          {
+            type: "select",
+            key: "type",
+            label: "Type",
+            default: "text",
+            options: [
+              { value: "text", label: "Text" },
+              { value: "textarea", label: "Long text" },
+              { value: "number", label: "Number" },
+              { value: "select", label: "Select" },
+              { value: "switch", label: "Switch" }
+            ]
+          },
+          { type: "switch", key: "required", label: "Required", default: false }
+        ],
+        default: [{ key: "answer", label: "Your answer", type: "textarea", required: true }]
       }
     ]
   },
+  {
+    name: "rich_user_input",
+    category: "human",
+    label: "Rich User Input",
+    description: "Pause the flow on a fully authored page \u2014 content, required reading, multi-section forms.",
+    icon: "\u25A4",
+    inputs: [{ id: "in" }],
+    outputs: [{ id: "out", label: "values" }],
+    configSchema: [
+      { type: "text", key: "title", label: "Step title", default: "Please review" },
+      {
+        type: "document",
+        key: "document",
+        label: "Page content",
+        documentType: "stages",
+        description: "Authored with the host's document editor (fancy-cms Stages)."
+      },
+      { type: "switch", key: "requireConfirm", label: "Require explicit confirmation", default: true },
+      { type: "text", key: "submitLabel", label: "Submit button", default: "Continue" }
+    ],
+    // Preview the authored page inside a FauxClient frame, so the canvas shows
+    // what the person hitting this step will actually see.
+    renderBody: (ctx) => ReactExports.createElement(RichInputPreview, { config: ctx.config ?? {} })
+  },
   // ───────────── Logic ─────────────
   {
     name: "branch",
@@ -204,10 +373,24 @@ var KINDS = [
     description: "Route to one of N labelled outputs based on a key.",
     icon: "\u2933",
     inputs: [{ id: "in" }],
-    outputs: [{ id: "case_a", label: "a" }, { id: "case_b", label: "b" }, { id: "default", label: "default" }],
+    // Ports ARE the config: every distinct port a case routes to becomes an
+    // output handle, plus the always-present `default`. Editing the cases map
+    // moves the ports on the canvas and the ports the runtime activates.
+    outputs: (config) => casePorts(config?.cases),
     configSchema: [
       { type: "expression", key: "value", label: "Switch on", example: "{{ $json.kind }}", required: true },
-      { type: "json", key: "cases", label: "Cases (JSON)", default: { a: "case_a", b: "case_b" } }
+      {
+        type: "keyvalue",
+        key: "cases",
+        label: "Cases",
+        description: "Match value \u2192 output port. Unmatched input takes `default`.",
+        keyLabel: "When value is",
+        valueLabel: "Route to port",
+        keyPlaceholder: "a",
+        valuePlaceholder: "case_a",
+        addLabel: "Add case",
+        default: { a: "case_a", b: "case_b" }
+      }
     ]
   },
   {
@@ -362,6 +545,76 @@ var KINDS = [
       { type: "credential", key: "credential", label: "API credential", credentialType: "llm_credential" }
     ]
   },
+  {
+    name: "llm_branch",
+    category: "ai",
+    label: "LLM Router",
+    description: "Let a model choose which route the flow takes.",
+    icon: "\u2727",
+    inputs: [{ id: "in" }],
+    // Each declared route is a port. The executor returns `{ __port: id }`
+    // (or `Port.only(id)` on the PHP runtime) to pick one.
+    outputs: (config) => routePorts(config?.routes, config?.fallback),
+    configSchema: [
+      {
+        type: "textarea",
+        key: "system",
+        label: "System prompt",
+        rows: 3,
+        description: "Optional framing for the routing decision."
+      },
+      {
+        type: "expression",
+        key: "prompt",
+        label: "What to route on",
+        example: "{{ $json.message }}",
+        required: true
+      },
+      {
+        type: "repeater",
+        key: "routes",
+        label: "Routes",
+        description: "The model picks exactly one. Descriptions are what it chooses between \u2014 make them distinct.",
+        titleKey: "port",
+        addLabel: "Add route",
+        minItems: 2,
+        fields: [
+          { type: "text", key: "port", label: "Port", required: true, placeholder: "billing" },
+          {
+            type: "text",
+            key: "description",
+            label: "When to choose it",
+            required: true,
+            placeholder: "The user is asking about an invoice, refund, or payment."
+          }
+        ],
+        default: [
+          { port: "a", description: "Describe when the model should pick this route." },
+          { port: "b", description: "Describe when the model should pick this route." }
+        ]
+      },
+      {
+        type: "select",
+        key: "provider",
+        label: "Provider",
+        default: "anthropic",
+        options: [
+          { value: "anthropic", label: "Anthropic" },
+          { value: "openai", label: "OpenAI" },
+          { value: "custom", label: "Custom" }
+        ]
+      },
+      { type: "text", key: "model", label: "Model", placeholder: "claude-sonnet-4-5" },
+      {
+        type: "switch",
+        key: "fallback",
+        label: "Add a `fallback` port",
+        default: true,
+        description: "Where the flow goes if the model returns no usable route."
+      },
+      { type: "credential", key: "credential", label: "API credential", credentialType: "llm_credential" }
+    ]
+  },
   {
     name: "tool_use",
     category: "ai",
@@ -1474,7 +1727,7 @@ function defaultTouchable() {
   return navigator.maxTouchPoints || "ontouchstart" in this;
 }
 function drag_default() {
-  var filter2 = defaultFilter, container = defaultContainer, subject = defaultSubject, touchable = defaultTouchable, gestures = {}, listeners2 = dispatch_default("start", "drag", "end"), active = 0, mousedownx, mousedowny, mousemoving, touchending, clickDistance2 = 0;
+  var filter2 = defaultFilter, container = defaultContainer, subject = defaultSubject, touchable = defaultTouchable, gestures = {}, listeners3 = dispatch_default("start", "drag", "end"), active = 0, mousedownx, mousedowny, mousemoving, touchending, clickDistance2 = 0;
   function drag(selection2) {
     selection2.on("mousedown.drag", mousedowned).filter(touchable).on("touchstart.drag", touchstarted).on("touchmove.drag", touchmoved, nonpassive).on("touchend.drag touchcancel.drag", touchended).style("touch-action", "none").style("-webkit-tap-highlight-color", "rgba(0,0,0,0)");
   }
@@ -1537,7 +1790,7 @@ function drag_default() {
     }
   }
   function beforestart(that, container2, event, d, identifier, touch) {
-    var dispatch2 = listeners2.copy(), p = pointer_default(touch || event, container2), dx, dy, s;
+    var dispatch2 = listeners3.copy(), p = pointer_default(touch || event, container2), dx, dy, s;
     if ((s = subject.call(that, new DragEvent("beforestart", {
       sourceEvent: event,
       target: drag,
@@ -1596,8 +1849,8 @@ function drag_default() {
     return arguments.length ? (touchable = typeof _ === "function" ? _ : constant_default2(!!_), drag) : touchable;
   };
   drag.on = function() {
-    var value = listeners2.on.apply(listeners2, arguments);
-    return value === listeners2 ? drag : value;
+    var value = listeners3.on.apply(listeners3, arguments);
+    return value === listeners3 ? drag : value;
   };
   drag.clickDistance = function(_) {
     return arguments.length ? (clickDistance2 = (_ = +_) * _, drag) : Math.sqrt(clickDistance2);
@@ -3151,7 +3404,7 @@ function defaultConstrain(transform2, extent, translateExtent) {
   );
 }
 function zoom_default2() {
-  var filter2 = defaultFilter2, extent = defaultExtent, constrain = defaultConstrain, wheelDelta2 = defaultWheelDelta, touchable = defaultTouchable2, scaleExtent = [0, Infinity], translateExtent = [[-Infinity, -Infinity], [Infinity, Infinity]], duration = 250, interpolate = zoom_default, listeners2 = dispatch_default("start", "zoom", "end"), touchstarting, touchfirst, touchending, touchDelay = 500, wheelDelay = 150, clickDistance2 = 0, tapDistance = 10;
+  var filter2 = defaultFilter2, extent = defaultExtent, constrain = defaultConstrain, wheelDelta2 = defaultWheelDelta, touchable = defaultTouchable2, scaleExtent = [0, Infinity], translateExtent = [[-Infinity, -Infinity], [Infinity, Infinity]], duration = 250, interpolate = zoom_default, listeners3 = dispatch_default("start", "zoom", "end"), touchstarting, touchfirst, touchending, touchDelay = 500, wheelDelay = 150, clickDistance2 = 0, tapDistance = 10;
   function zoom(selection2) {
     selection2.property("__zoom", defaultTransform).on("wheel.zoom", wheeled, { passive: false }).on("mousedown.zoom", mousedowned).on("dblclick.zoom", dblclicked).filter(touchable).on("touchstart.zoom", touchstarted).on("touchmove.zoom", touchmoved).on("touchend.zoom touchcancel.zoom", touchended).style("-webkit-tap-highlight-color", "rgba(0,0,0,0)");
   }
@@ -3263,14 +3516,14 @@ function zoom_default2() {
     },
     emit: function(type) {
       var d = select_default2(this.that).datum();
-      listeners2.call(
+      listeners3.call(
         type,
         this.that,
         new ZoomEvent(type, {
           sourceEvent: this.sourceEvent,
           target: zoom,
           transform: this.that.__zoom,
-          dispatch: listeners2
+          dispatch: listeners3
         }),
         d
       );
@@ -3420,8 +3673,8 @@ function zoom_default2() {
     return arguments.length ? (interpolate = _, zoom) : interpolate;
   };
   zoom.on = function() {
-    var value = listeners2.on.apply(listeners2, arguments);
-    return value === listeners2 ? zoom : value;
+    var value = listeners3.on.apply(listeners3, arguments);
+    return value === listeners3 ? zoom : value;
   };
   zoom.clickDistance = function(_) {
     return arguments.length ? (clickDistance2 = (_ = +_) * _, zoom) : Math.sqrt(clickDistance2);
@@ -6094,20 +6347,20 @@ var use_sync_external_store_with_selector_default = { useSyncExternalStoreWithSe
 // node_modules/zustand/esm/vanilla.mjs
 var createStoreImpl = (createState) => {
   let state;
-  const listeners2 = /* @__PURE__ */ new Set();
+  const listeners3 = /* @__PURE__ */ new Set();
   const setState = (partial, replace) => {
     const nextState = typeof partial === "function" ? partial(state) : partial;
     if (!Object.is(nextState, state)) {
       const previousState = state;
       state = (replace != null ? replace : typeof nextState !== "object" || nextState === null) ? nextState : Object.assign({}, state, nextState);
-      listeners2.forEach((listener) => listener(state, previousState));
+      listeners3.forEach((listener) => listener(state, previousState));
     }
   };
   const getState = () => state;
   const getInitialState2 = () => initialState;
   const subscribe = (listener) => {
-    listeners2.add(listener);
-    return () => listeners2.delete(listener);
+    listeners3.add(listener);
+    return () => listeners3.delete(listener);
   };
   const destroy = () => {
     if ((undefined ? undefined.MODE : void 0) !== "production") {
@@ -6115,7 +6368,7 @@ var createStoreImpl = (createState) => {
         "[DEPRECATED] The `destroy` method will be unsupported in a future version. Instead use unsubscribe function returned by subscribe. Everything will be garbage-collected if store is garbage-collected."
       );
     }
-    listeners2.clear();
+    listeners3.clear();
   };
   const api = { setState, getState, getInitialState: getInitialState2, subscribe, destroy };
   const initialState = state = createState(setState, getState, api);
@@ -9647,9 +9900,18 @@ function paletteDropHandlers(onDrop) {
     }
   };
 }
-function ConfigFieldRenderer({ field, value, onChange, renderCredentialField }) {
+function ConfigFieldRenderer({
+  field,
+  value,
+  onChange,
+  renderCredentialField,
+  renderDocumentField
+}) {
   switch (field.type) {
-    case "text":
+    case "text": {
+      if (field.choices?.length) {
+        return /* @__PURE__ */ jsxRuntime.jsx(ChoiceField, { field, value, onChange });
+      }
       return /* @__PURE__ */ jsxRuntime.jsx(
         "input",
         {
@@ -9660,6 +9922,7 @@ function ConfigFieldRenderer({ field, value, onChange, renderCredentialField })
           onChange: (e) => onChange(e.target.value)
         }
       );
+    }
     case "textarea":
       return /* @__PURE__ */ jsxRuntime.jsx(
         "textarea",
@@ -9737,10 +10000,244 @@ function ConfigFieldRenderer({ field, value, onChange, renderCredentialField })
           onChange: (e) => onChange(e.target.value)
         }
       );
+    case "repeater":
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        RepeaterField,
+        {
+          field,
+          value,
+          onChange,
+          renderCredentialField,
+          renderDocumentField
+        }
+      );
+    case "keyvalue":
+      return /* @__PURE__ */ jsxRuntime.jsx(KeyValueField, { field, value, onChange });
+    case "document":
+      if (renderDocumentField) {
+        return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: renderDocumentField({ documentType: field.documentType, value, onChange }) });
+      }
+      return /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "ff-panel__hint ff-panel__hint--missing", children: [
+        "No document editor supplied. Pass ",
+        /* @__PURE__ */ jsxRuntime.jsx("code", { children: "renderDocumentField" }),
+        " to NodeConfigPanel to author this field."
+      ] });
     default:
       return null;
   }
 }
+function normalizeChoices(choices) {
+  return choices.map(
+    (c) => typeof c === "string" ? { value: c, label: c } : { value: c.value, label: c.label ?? c.value }
+  );
+}
+function ChoiceField({
+  field,
+  value,
+  onChange
+}) {
+  const options = normalizeChoices(field.choices ?? []);
+  const current = typeof value === "string" ? value : "";
+  const known = options.some((o) => o.value === current);
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "select",
+    {
+      className: "ff-panel__input",
+      value: current,
+      onChange: (e) => onChange(e.target.value),
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", disabled: true, children: field.placeholder ?? "\u2014" }),
+        options.map((o) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: o.value, children: o.label }, o.value)),
+        current !== "" && !known && /* @__PURE__ */ jsxRuntime.jsxs("option", { value: current, children: [
+          current,
+          " (not in list)"
+        ] })
+      ]
+    }
+  );
+}
+function RepeaterField({
+  field,
+  value,
+  onChange,
+  renderCredentialField,
+  renderDocumentField
+}) {
+  const rows = Array.isArray(value) ? value : [];
+  const max = field.maxItems ?? Infinity;
+  const min = field.minItems ?? 0;
+  const replace = (next) => onChange(next);
+  const addRow = () => {
+    const blank = {};
+    for (const f of field.fields) {
+      if ("default" in f && f.default !== void 0) blank[f.key] = f.default;
+    }
+    replace([...rows, blank]);
+  };
+  const removeRow = (i) => replace(rows.filter((_, idx) => idx !== i));
+  const moveRow = (i, delta) => {
+    const target = i + delta;
+    if (target < 0 || target >= rows.length) return;
+    const next = [...rows];
+    [next[i], next[target]] = [next[target], next[i]];
+    replace(next);
+  };
+  const setCell = (i, key, cell) => replace(rows.map((row, idx) => idx === i ? { ...row, [key]: cell } : row));
+  const rowTitle = (row, i) => {
+    const key = field.titleKey ?? field.fields[0]?.key;
+    const raw = key ? row[key] : void 0;
+    if (typeof raw === "string" && raw.trim() !== "") return raw;
+    if (typeof raw === "number" || typeof raw === "boolean") return String(raw);
+    return `Item ${i + 1}`;
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ff-repeater", "data-ff-repeater": field.key, children: [
+    rows.length === 0 && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "ff-repeater__empty", children: "None yet." }),
+    rows.map((row, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ff-repeater__row", "data-ff-repeater-row": i, children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ff-repeater__row-head", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ff-repeater__row-title", children: rowTitle(row, i) }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ff-repeater__row-actions", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              type: "button",
+              className: "ff-repeater__btn",
+              onClick: () => moveRow(i, -1),
+              disabled: i === 0,
+              "aria-label": `Move ${rowTitle(row, i)} up`,
+              children: "\u2191"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              type: "button",
+              className: "ff-repeater__btn",
+              onClick: () => moveRow(i, 1),
+              disabled: i === rows.length - 1,
+              "aria-label": `Move ${rowTitle(row, i)} down`,
+              children: "\u2193"
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "button",
+            {
+              type: "button",
+              className: "ff-repeater__btn ff-repeater__btn--danger",
+              onClick: () => removeRow(i),
+              disabled: rows.length <= min,
+              "aria-label": `Remove ${rowTitle(row, i)}`,
+              children: "\u2715"
+            }
+          )
+        ] })
+      ] }),
+      field.fields.map((sub) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ff-repeater__cell", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "ff-panel__label ff-panel__label--sub", children: [
+          sub.label,
+          sub.required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ff-panel__required", "aria-hidden": true, children: " *" })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ConfigFieldRenderer,
+          {
+            field: sub,
+            value: row[sub.key],
+            onChange: (cell) => setCell(i, sub.key, cell),
+            renderCredentialField,
+            renderDocumentField
+          }
+        )
+      ] }, sub.key))
+    ] }, i)),
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "button",
+      {
+        type: "button",
+        className: "ff-repeater__add",
+        onClick: addRow,
+        disabled: rows.length >= max,
+        children: [
+          "+ ",
+          field.addLabel ?? "Add"
+        ]
+      }
+    )
+  ] });
+}
+function KeyValueField({
+  field,
+  value,
+  onChange
+}) {
+  const map = value && typeof value === "object" && !Array.isArray(value) ? value : {};
+  const entries = Object.entries(map);
+  const commit = (next) => {
+    const obj = {};
+    for (const [k, v] of next) {
+      if (k === "") continue;
+      obj[k] = v;
+    }
+    onChange(obj);
+  };
+  const setKey = (i, key) => commit(entries.map(([k, v], idx) => idx === i ? [key, v] : [k, v]));
+  const setVal = (i, val) => commit(entries.map(([k, v], idx) => idx === i ? [k, val] : [k, v]));
+  const remove2 = (i) => commit(entries.filter((_, idx) => idx !== i));
+  const add = () => commit([...entries, ["", ""]]);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ff-keyvalue", "data-ff-keyvalue": field.key, children: [
+    entries.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ff-keyvalue__head", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("span", { children: field.keyLabel ?? "Key" }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { children: field.valueLabel ?? "Value" }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", {})
+    ] }),
+    entries.map(([k, v], i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ff-keyvalue__row", "data-ff-keyvalue-row": i, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          className: "ff-panel__input",
+          value: k,
+          placeholder: field.keyPlaceholder,
+          "aria-label": `${field.keyLabel ?? "Key"} ${i + 1}`,
+          onChange: (e) => setKey(i, e.target.value)
+        }
+      ),
+      field.valueOptions ? /* @__PURE__ */ jsxRuntime.jsxs(
+        "select",
+        {
+          className: "ff-panel__input",
+          value: v ?? "",
+          "aria-label": `${field.valueLabel ?? "Value"} ${i + 1}`,
+          onChange: (e) => setVal(i, e.target.value),
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", disabled: true, children: "\u2014" }),
+            field.valueOptions.map((o) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: o.value, children: o.label }, o.value))
+          ]
+        }
+      ) : /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          className: "ff-panel__input",
+          value: v ?? "",
+          placeholder: field.valuePlaceholder,
+          "aria-label": `${field.valueLabel ?? "Value"} ${i + 1}`,
+          onChange: (e) => setVal(i, e.target.value)
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          className: "ff-repeater__btn ff-repeater__btn--danger",
+          onClick: () => remove2(i),
+          "aria-label": `Remove ${k || `entry ${i + 1}`}`,
+          children: "\u2715"
+        }
+      )
+    ] }, i)),
+    /* @__PURE__ */ jsxRuntime.jsxs("button", { type: "button", className: "ff-repeater__add", onClick: add, children: [
+      "+ ",
+      field.addLabel ?? "Add"
+    ] })
+  ] });
+}
 function JsonField({ value, onChange, rows }) {
   const initial = ReactExports.useMemo(() => {
     try {
@@ -9775,6 +10272,7 @@ function NodeConfigPanel({
   onChange,
   header,
   renderCredentialField,
+  renderDocumentField,
   className,
   style: style2
 }) {
@@ -9800,6 +10298,8 @@ function NodeConfigPanel({
   const setDescription = (description) => onChange({ ...node, data: { ...node.data, description } });
   const setConfigValue = (key, value) => onChange({ ...node, data: { ...node.data, config: { ...config, [key]: value } } });
   const issues = validateConfig(kind, config);
+  const adapter2 = getRichInputAdapter();
+  const documentField = renderDocumentField ?? (adapter2?.renderEditor ? ({ value, onChange: set3 }) => adapter2.renderEditor({ value, onChange: set3 }) : void 0);
   return /* @__PURE__ */ jsxRuntime.jsxs("aside", { className: ["ff-panel", className ?? ""].filter(Boolean).join(" "), style: style2, children: [
     header,
     /* @__PURE__ */ jsxRuntime.jsxs("header", { className: "ff-panel__header", children: [
@@ -9848,7 +10348,8 @@ function NodeConfigPanel({
             field,
             value: config[field.key],
             onChange: (v) => setConfigValue(field.key, v),
-            renderCredentialField
+            renderCredentialField,
+            renderDocumentField: documentField
           }
         )
       ] }, field.key))
@@ -9897,6 +10398,29 @@ function useFlowState(initial) {
   return { nodes, edges, setNodes, setEdges, onNodesChange, onEdgesChange, onConnect, toGraph };
 }
 
+// src/registry/ports.ts
+function resolvePortSpec(spec, config) {
+  if (spec === void 0) return void 0;
+  if (typeof spec !== "function") return spec;
+  try {
+    const resolved = spec(config);
+    return Array.isArray(resolved) ? resolved : void 0;
+  } catch {
+    return void 0;
+  }
+}
+function nodeConfig(node) {
+  return node.data?.config ?? {};
+}
+function resolveNodePorts(node, kind) {
+  const config = nodeConfig(node);
+  const data = node.data;
+  return {
+    inputs: data?.inputs ?? resolvePortSpec(kind?.inputs, config),
+    outputs: data?.outputs ?? resolvePortSpec(kind?.outputs, config)
+  };
+}
+
 // src/runtime/run-flow.ts
 async function runFlow(graph, executors, onEvent = () => {
 }, options = {}) {
@@ -10028,8 +10552,9 @@ function activatedPorts(node, result) {
       return { ports: [r.branch], value: r.value ?? r };
     }
   }
-  const declared = node.data.outputs?.map((p) => p.id) ?? ["out"];
-  return { ports: declared, value: result };
+  const kind = getNodeKind(node.data?.kind ?? node.type ?? "") ?? void 0;
+  const declared = resolveNodePorts(node, kind).outputs?.map((p) => p.id);
+  return { ports: declared?.length ? declared : ["out"], value: result };
 }
 
 // src/runtime/use-flow-run.ts
@@ -10248,9 +10773,10 @@ function RegistryNodeInner(props) {
   const data = props.data;
   const status = data.status ?? "idle";
   const accent = kind.accent ?? categoryAccent(kind.category);
-  const inputs = data.inputs ?? kind.inputs ?? defaultInputs2(kind.category);
-  const outputs = data.outputs ?? kind.outputs ?? defaultOutputs2(kind.category);
-  const config = data.config ?? {};
+  const resolved = resolveNodePorts(props, kind);
+  const inputs = resolved.inputs ?? defaultInputs2(kind.category);
+  const outputs = resolved.outputs ?? defaultOutputs2(kind.category);
+  const config = nodeConfig(props);
   const label = data.label ?? kind.label;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
@@ -10363,6 +10889,17 @@ function removeEdges(edges, ids) {
   const doomed = new Set(ids);
   return edges.filter((e) => !doomed.has(e.id));
 }
+function setEdgeLabel(edges, id2, label) {
+  const next = label?.trim();
+  return edges.map((e) => {
+    if (e.id !== id2) return e;
+    if (!next) {
+      const { label: _drop, ...rest } = e;
+      return rest;
+    }
+    return { ...e, label: next };
+  });
+}
 function duplicateNode(node, id2, offset = 40) {
   return {
     ...node,
@@ -10410,6 +10947,7 @@ function FlowEditorInner({
   onChange,
   onSelectionChange,
   onDelete,
+  onEdgeDelete,
   apiRef
 }) {
   const internal = useFlowState(initial);
@@ -10427,18 +10965,39 @@ function FlowEditorInner({
   const [selectedId, setSelectedId] = ReactExports.useState(null);
   const selected2 = ReactExports.useMemo(() => flow.nodes.find((n) => n.id === selectedId) ?? null, [flow.nodes, selectedId]);
   ReactExports.useEffect(() => onSelectionChange?.(selected2), [selected2, onSelectionChange]);
-  const handleNodeClick2 = (_e, node) => setSelectedId(node.id);
+  const [selectedEdgeId, setSelectedEdgeId] = ReactExports.useState(null);
+  const selectedEdge = ReactExports.useMemo(
+    () => flow.edges.find((e) => e.id === selectedEdgeId) ?? null,
+    [flow.edges, selectedEdgeId]
+  );
+  const handleNodeClick2 = (_e, node) => {
+    setSelectedId(node.id);
+    setSelectedEdgeId(null);
+  };
   const [menu, setMenu] = ReactExports.useState(null);
+  const [labelEdit, setLabelEdit] = ReactExports.useState(null);
   const closeMenu = ReactExports.useCallback(() => setMenu(null), []);
   const handleNodeContextMenu = (event, node) => {
     event.preventDefault();
     setSelectedId(node.id);
-    setMenu({ x: event.clientX, y: event.clientY, nodeId: node.id });
+    setSelectedEdgeId(null);
+    setMenu({ x: event.clientX, y: event.clientY, target: { type: "node", id: node.id } });
+  };
+  const handleEdgeClick = (_e, edge) => {
+    setSelectedEdgeId(edge.id);
+  };
+  const handleEdgeContextMenu = (event, edge) => {
+    event.preventDefault();
+    setSelectedEdgeId(edge.id);
+    setMenu({ x: event.clientX, y: event.clientY, target: { type: "edge", id: edge.id } });
   };
   ReactExports.useEffect(() => {
-    if (menu === null) return;
-    const close = () => setMenu(null);
-    const onKey = (e) => e.key === "Escape" && setMenu(null);
+    if (menu === null && labelEdit === null) return;
+    const close = () => {
+      setMenu(null);
+      setLabelEdit(null);
+    };
+    const onKey = (e) => e.key === "Escape" && close();
     window.addEventListener("click", close);
     window.addEventListener("scroll", close, true);
     window.addEventListener("keydown", onKey);
@@ -10447,7 +11006,7 @@ function FlowEditorInner({
       window.removeEventListener("scroll", close, true);
       window.removeEventListener("keydown", onKey);
     };
-  }, [menu]);
+  }, [menu, labelEdit]);
   ReactExports.useEffect(() => {
     if (!controlled) onChange?.({ nodes: flow.nodes, edges: flow.edges });
   }, [flow.nodes, flow.edges, onChange, controlled]);
@@ -10490,14 +11049,29 @@ function FlowEditorInner({
       edges: flow.edges,
       selectedId,
       selected: selected2,
+      selectedEdgeId,
+      selectedEdge,
       running: runner.running,
       statuses: runner.statuses,
       select: setSelectedId,
+      selectEdge: setSelectedEdgeId,
       addNode,
       updateNode: (next) => flow.setNodes((all) => all.map((x) => x.id === next.id ? next : x)),
       deleteNodes,
       deleteSelected: () => deleteNodes(selectedId ? [selectedId] : []),
-      deleteEdges: (ids) => flow.setEdges((all) => removeEdges(all, ids)),
+      deleteEdges: (ids) => {
+        if (ids.length === 0) return;
+        flow.setEdges((all) => removeEdges(all, ids));
+        setSelectedEdgeId((cur) => cur !== null && ids.includes(cur) ? null : cur);
+        onEdgeDelete?.(ids);
+      },
+      deleteSelectedEdge: () => {
+        if (!selectedEdgeId) return;
+        flow.setEdges((all) => removeEdges(all, [selectedEdgeId]));
+        setSelectedEdgeId(null);
+        onEdgeDelete?.([selectedEdgeId]);
+      },
+      setEdgeLabel: (id2, label) => flow.setEdges((all) => setEdgeLabel(all, id2, label)),
       duplicateNode: (id2) => {
         const src = flow.nodes.find((n) => n.id === id2);
         if (!src) return null;
@@ -10569,6 +11143,9 @@ function FlowEditorInner({
           onConnect: flow.onConnect,
           onNodeClick: handleNodeClick2,
           onNodeContextMenu: builtins.contextMenu === false ? void 0 : handleNodeContextMenu,
+          onEdgeClick: handleEdgeClick,
+          onEdgeContextMenu: builtins.edgeContextMenu === false ? void 0 : handleEdgeContextMenu,
+          onEdgesDelete: (deleted) => onEdgeDelete?.(deleted.map((e) => e.id)),
           onNodesDelete: (deleted) => onDelete?.(deleted.map((n) => n.id)),
           deleteKeyCode: ["Delete", "Backspace"],
           height: "100%",
@@ -10577,14 +11154,14 @@ function FlowEditorInner({
         }
       ),
       slots.empty && api.nodes.length === 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ff-editor__empty", children: slots.empty(api) }),
-      menu !== null && builtins.contextMenu !== false && /* @__PURE__ */ jsxRuntime.jsx(
+      menu?.target.type === "node" && builtins.contextMenu !== false && /* @__PURE__ */ jsxRuntime.jsx(
         "div",
         {
           className: "ff-editor__ctx",
           style: { top: menu.y, left: menu.x },
           role: "menu",
           onClick: (e) => e.stopPropagation(),
-          children: slots.contextMenu ? slots.contextMenu(api, menu.nodeId, closeMenu) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          children: slots.contextMenu ? slots.contextMenu(api, menu.target.id, closeMenu) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
             /* @__PURE__ */ jsxRuntime.jsx(
               "button",
               {
@@ -10593,7 +11170,7 @@ function FlowEditorInner({
                 className: "ff-editor__ctx-item",
                 "data-action": "ctx-duplicate",
                 onClick: () => {
-                  api.duplicateNode(menu.nodeId);
+                  api.duplicateNode(menu.target.id);
                   closeMenu();
                 },
                 children: "Duplicate"
@@ -10607,7 +11184,7 @@ function FlowEditorInner({
                 className: "ff-editor__ctx-item ff-editor__ctx-item--danger",
                 "data-action": "ctx-delete",
                 onClick: () => {
-                  api.deleteNodes([menu.nodeId]);
+                  api.deleteNodes([menu.target.id]);
                   closeMenu();
                 },
                 children: "Delete"
@@ -10616,6 +11193,58 @@ function FlowEditorInner({
           ] })
         }
       ),
+      menu?.target.type === "edge" && builtins.edgeContextMenu !== false && /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: "ff-editor__ctx",
+          style: { top: menu.y, left: menu.x },
+          role: "menu",
+          onClick: (e) => e.stopPropagation(),
+          children: slots.edgeContextMenu ? slots.edgeContextMenu(api, menu.target.id, closeMenu) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                type: "button",
+                role: "menuitem",
+                className: "ff-editor__ctx-item",
+                "data-action": "ctx-edge-label",
+                onClick: () => {
+                  setLabelEdit({ x: menu.x, y: menu.y, edgeId: menu.target.id });
+                  setMenu(null);
+                },
+                children: "Label\u2026"
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                type: "button",
+                role: "menuitem",
+                className: "ff-editor__ctx-item ff-editor__ctx-item--danger",
+                "data-action": "ctx-edge-delete",
+                onClick: () => {
+                  api.deleteEdges([menu.target.id]);
+                  closeMenu();
+                },
+                children: "Delete connection"
+              }
+            )
+          ] })
+        }
+      ),
+      labelEdit !== null && /* @__PURE__ */ jsxRuntime.jsx(
+        EdgeLabelEditor,
+        {
+          x: labelEdit.x,
+          y: labelEdit.y,
+          initial: flow.edges.find((e) => e.id === labelEdit.edgeId)?.label ?? "",
+          onCommit: (text) => {
+            api.setEdgeLabel(labelEdit.edgeId, text);
+            setLabelEdit(null);
+          },
+          onCancel: () => setLabelEdit(null)
+        }
+      ),
       showFeed && (slots.feed ? slots.feed(api) : /* @__PURE__ */ jsxRuntime.jsx(FlowRunFeed, { entries: runner.feed, className: "ff-editor__feed" }))
     ] }),
     showPanel && (slots.panel ? slots.panel(api) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ff-editor__panel-wrap", children: [
@@ -10692,6 +11321,46 @@ function makeControlledFlowAdapter(value, onChange) {
     toGraph: () => value
   };
 }
+function EdgeLabelEditor({
+  x,
+  y,
+  initial,
+  onCommit,
+  onCancel
+}) {
+  const [text, setText] = ReactExports.useState(initial);
+  const ref = ReactExports.useRef(null);
+  ReactExports.useEffect(() => {
+    ref.current?.focus();
+    ref.current?.select();
+  }, []);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: "ff-editor__ctx ff-editor__edge-label",
+      style: { top: y, left: x },
+      onClick: (e) => e.stopPropagation(),
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          ref,
+          className: "ff-panel__input",
+          value: text,
+          placeholder: "Label this connection",
+          "aria-label": "Connection label",
+          "data-action": "edge-label-input",
+          onChange: (e) => setText(e.target.value),
+          onKeyDown: (e) => {
+            e.stopPropagation();
+            if (e.key === "Enter") onCommit(text);
+            if (e.key === "Escape") onCancel();
+          },
+          onBlur: () => onCommit(text)
+        }
+      )
+    }
+  );
+}
 function defineNode(render) {
   function Wrapped(props) {
     return render({
@@ -10741,6 +11410,7 @@ exports.NodeShell = NodeShell;
 exports.NoteNode = NoteNode;
 exports.OutputNode = OutputNode2;
 exports.RegistryNode = RegistryNode;
+exports.RichInputPreview = RichInputPreview;
 exports.SubgraphNode = SubgraphNode;
 exports.TriggerNode = TriggerNode;
 exports.WORKFLOW_SCHEMA_URL = WORKFLOW_SCHEMA_URL;
@@ -10753,12 +11423,18 @@ exports.defaultNodeTypes = defaultNodeTypes;
 exports.defineNode = defineNode;
 exports.exportWorkflow = exportWorkflow;
 exports.getNodeKind = getNodeKind;
+exports.getRichInputAdapter = getRichInputAdapter;
 exports.importWorkflow = importWorkflow;
+exports.isRichInputEnabled = isRichInputEnabled;
 exports.listNodeKinds = listNodeKinds;
 exports.onNodeKindsChanged = onNodeKindsChanged;
+exports.onRichInputAdapterChanged = onRichInputAdapterChanged;
 exports.paletteDropHandlers = paletteDropHandlers;
 exports.registerBuiltinKinds = registerBuiltinKinds;
 exports.registerNodeKind = registerNodeKind;
+exports.registerRichInputAdapter = registerRichInputAdapter;
+exports.resolveNodePorts = resolveNodePorts;
+exports.resolvePortSpec = resolvePortSpec;
 exports.runFlow = runFlow;
 exports.useFlowEditor = useFlowEditor;
 exports.useFlowEditorOptional = useFlowEditorOptional;