api_binding_ui 1.0.0 → 2.0.0

package/dist/index.js

@@ -1,3790 +1,345 @@
-var __defProp = Object.defineProperty;
-var __returnValue = (v) => v;
-function __exportSetter(name, newValue) {
-  this[name] = __returnValue.bind(null, newValue);
-}
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, {
-      get: all[name],
-      enumerable: true,
-      configurable: true,
-      set: __exportSetter.bind(all, name)
-    });
-};
-
-// src/components/ui/Icons.tsx
-var exports_Icons = {};
-__export(exports_Icons, {
-  AlertCircleIcon: () => AlertCircleIcon,
-  AlertTriangleIcon: () => AlertTriangleIcon,
-  ArrowDownIcon: () => ArrowDownIcon,
-  ArrowUpIcon: () => ArrowUpIcon,
-  CheckIcon: () => CheckIcon,
-  LinkIcon: () => LinkIcon,
-  PencilIcon: () => PencilIcon,
-  PlayIcon: () => PlayIcon,
-  PlusIcon: () => PlusIcon,
-  SearchIcon: () => SearchIcon,
-  SettingsIcon: () => SettingsIcon,
-  Trash2Icon: () => Trash2Icon,
-  XIcon: () => XIcon,
-  iconMap: () => iconMap,
-  renderIcon: () => renderIcon
-});
-
-// src/types.ts
-var BINDING_CHANNEL = "api-binding-studio";
-var BINDING_READY = "api-binding-ready";
-var BINDING_CONTEXT = "api-binding-context";
-var BINDING_APPLIED = "api-binding-applied";
-var BINDING_SELECTION_UPDATE = "api-binding-selection-update";
-// src/core/componentId.ts
-function componentId(c) {
-  if (c.kind === "button")
-    return `button:${c.name}`;
-  return c.name;
-}
-function isButtonId(id) {
-  return id.startsWith("button:");
-}
-function parseComponentId(id) {
-  if (id.startsWith("button:")) {
-    return { kind: "button", name: id.slice(7) };
-  }
-  if (id.startsWith("field:")) {
-    return { kind: "field", name: id.slice(6) };
-  }
-  return { kind: "field", name: id };
-}
-function normalizeComponent(id) {
-  if (id.startsWith("field:"))
-    return id.slice(6);
-  return id;
-}
-
-// src/core/bindingContext.ts
-var FREE_TEXT_SOURCE = "freeText";
-var FREE_TEXT_OPTION = { value: FREE_TEXT_SOURCE, label: "Free Text" };
-function storageKey(key) {
-  return `api-binding-snapshot:${key}`;
-}
-function storeSnapshot(snapshot) {
-  try {
-    localStorage.setItem(storageKey(snapshot.key), JSON.stringify(snapshot));
-  } catch {}
-}
-function readSnapshot(key) {
-  try {
-    const raw = localStorage.getItem(storageKey(key));
-    return raw ? JSON.parse(raw) : null;
-  } catch {
-    return null;
-  }
-}
-function windowIds({
-  appId,
-  windowId,
-  gridId,
-  parentWindowIds
-}) {
-  const parts = [appId];
-  if (gridId)
-    parts.push(gridId);
-  if (parentWindowIds?.length)
-    parts.push(...parentWindowIds);
-  parts.push(windowId);
-  return {
-    appId,
-    windowId,
-    gridId,
-    parentWindowIds,
-    key: parts.join(".")
-  };
-}
-function gridPropertyPaths({ gridId, rows }) {
-  if (!rows || rows.length === 0)
-    return [];
-  const paths = new Set;
-  function collect(obj, prefix) {
-    if (obj === null || obj === undefined)
-      return;
-    if (typeof obj === "object" && !Array.isArray(obj)) {
-      for (const [k, v] of Object.entries(obj)) {
-        const next = prefix ? `${prefix}.${k}` : k;
-        if (typeof v === "object" && v !== null && !Array.isArray(v)) {
-          collect(v, next);
-        } else {
-          paths.add(`${gridId}.${next}`);
-        }
-      }
-    }
-  }
-  rows.slice(0, 5).forEach((r) => collect(r, ""));
-  return [...paths].sort();
-}
-function contextComponents(snapshot) {
-  const fields = snapshot.components.map((c) => ({
-    value: c.name,
-    label: c.label || c.name
-  }));
-  const buttons = snapshot.buttons.map((b) => ({
-    value: componentId({ kind: "button", name: b }),
-    label: `Button: ${b}`
-  }));
-  return [...fields, ...buttons];
-}
-function sourceComponents(snapshot) {
-  const fields = snapshot.components.map((c) => ({
-    value: c.name,
-    label: c.label || c.name
-  }));
-  const gridOption = snapshot.grid ? [{ value: snapshot.grid.id, label: snapshot.grid.label || snapshot.grid.id }] : [];
-  const parents = (snapshot.contexts ?? []).flatMap((p) => p.components.map((c) => ({
-    value: `${p.id}.${c.name}`,
-    label: `${p.label || p.id} → ${c.label || c.name}`
-  })));
-  return [...fields, ...gridOption, ...parents];
-}
-function findEnclosingContextElement(triggerElement, options) {
-  if (options?.rootElement)
-    return options.rootElement;
-  if (options?.containerRef?.current)
-    return options.containerRef.current;
-  if (options?.formId) {
-    const el = document.getElementById(options.formId);
-    if (el)
-      return el;
-  }
-  if (options?.containerSelector && triggerElement) {
-    const el = triggerElement.closest(options.containerSelector) || document.querySelector(options.containerSelector);
-    if (el)
-      return el;
-  }
-  if (!triggerElement)
-    return document.body;
-  const dialog = triggerElement.closest('[role="dialog"], [role="alertdialog"], dialog, .ds-dialog, [data-modal], [data-drawer], [data-panel]');
-  if (dialog)
-    return dialog;
-  const form = triggerElement.closest('form, [role="form"]');
-  if (form)
-    return form;
-  let curr = triggerElement.parentElement;
-  let candidateWithInputs = null;
-  while (curr && curr !== document.body && curr !== document.documentElement) {
-    if (curr.matches('[data-screen], [data-view], [role="region"], main, [role="main"], article, section, .screen, .view, .page, .page-container, .card, .panel')) {
-      return curr;
-    }
-    const inputs = curr.querySelectorAll("[name], input:not([type='hidden']), select, textarea, [role='combobox']");
-    if (inputs.length > 0 && !candidateWithInputs) {
-      candidateWithInputs = curr;
-    }
-    curr = curr.parentElement;
-  }
-  if (candidateWithInputs)
-    return candidateWithInputs;
-  return document.querySelector("main") || document.getElementById("root") || document.body;
-}
-function discoverFormComponents(root) {
-  if (!root)
-    return [];
-  const components = [];
-  const seen = new Set;
-  function extractLabel(el, name) {
-    const labelled = el.labels?.[0];
-    const byId = el.getAttribute("aria-labelledby");
-    const labelById = byId ? byId.split(" ").map((id) => document.getElementById(id)?.textContent).filter(Boolean).join(" ") : null;
-    const parentLabel = el.closest("label");
-    const ariaLabel = el.getAttribute("aria-label");
-    const placeholder = el.getAttribute("placeholder");
-    const title = el.getAttribute("title");
-    const raw = labelled?.textContent ?? labelById ?? ariaLabel ?? (parentLabel ? Array.from(parentLabel.childNodes).filter((n) => n.nodeType === Node.TEXT_NODE).map((n) => n.textContent).join("").trim() : null) ?? placeholder ?? title ?? name;
-    return raw.replace(/\*/g, "").trim() || name;
-  }
-  root.querySelectorAll("[name]").forEach((el) => {
-    const name = el.getAttribute("name");
-    if (!name || seen.has(name))
-      return;
-    if (el instanceof HTMLInputElement && (el.type === "submit" || el.type === "reset" || el.type === "button"))
-      return;
-    seen.add(name);
-    const label = extractLabel(el, name);
-    const role = el.getAttribute("role");
-    const rawType = role ?? (el instanceof HTMLInputElement ? el.type : el.tagName.toLowerCase());
-    const isDropdown = rawType === "select" || rawType === "combobox" || rawType === "listbox" || el.tagName.toLowerCase() === "select";
-    const isTextArea = rawType === "textarea" || el.tagName.toLowerCase() === "textarea";
-    const isCheckbox = rawType === "checkbox" || rawType === "switch";
-    const kind = isDropdown ? "dropdown" : isTextArea ? "text-area" : isCheckbox ? "checkbox" : "text";
-    const isRequired = el.hasAttribute("required") || el.getAttribute("aria-required") === "true" || (el.getAttribute("aria-label")?.includes("*") ?? false);
-    let value;
-    if (el instanceof HTMLInputElement) {
-      value = el.type === "checkbox" ? String(el.checked) : el.value;
-    } else if (el instanceof HTMLSelectElement || el instanceof HTMLTextAreaElement) {
-      value = el.value;
-    } else {
-      value = el.getAttribute("data-value") ?? el.getAttribute("aria-valuenow") ?? el.textContent?.trim() ?? undefined;
-    }
-    components.push({
-      name,
-      label,
-      type: rawType,
-      kind,
-      readable: isDropdown,
-      required: isRequired,
-      value: value || undefined
-    });
-  });
-  root.querySelectorAll('[role="combobox"]:not([name]), [role="textbox"]:not([name]), [role="checkbox"]:not([name]), [role="switch"]:not([name]), select:not([name]), textarea:not([name]), input:not([name]):not([type="submit"]):not([type="button"]):not([type="reset"])').forEach((el) => {
-    const id = el.id || el.getAttribute("data-testid") || el.getAttribute("data-field");
-    const ariaLabel = el.getAttribute("aria-label");
-    const name = id || (ariaLabel ? ariaLabel.toLowerCase().replace(/[^a-z0-9]/g, "_") : undefined);
-    if (!name || seen.has(name))
-      return;
-    seen.add(name);
-    const label = extractLabel(el, name);
-    const role = el.getAttribute("role");
-    const rawType = role ?? (el instanceof HTMLInputElement ? el.type : el.tagName.toLowerCase());
-    const isDropdown = rawType === "select" || rawType === "combobox" || rawType === "listbox";
-    const isTextArea = rawType === "textarea" || el.tagName.toLowerCase() === "textarea";
-    const isCheckbox = rawType === "checkbox" || rawType === "switch";
-    const kind = isDropdown ? "dropdown" : isTextArea ? "text-area" : isCheckbox ? "checkbox" : "text";
-    const isRequired = el.hasAttribute("required") || el.getAttribute("aria-required") === "true";
-    components.push({
-      name,
-      label,
-      type: rawType,
-      kind,
-      readable: isDropdown,
-      required: isRequired,
-      value: el.value || el.getAttribute("data-value") || undefined
-    });
-  });
-  return components;
-}
-function discoverButtons(root) {
-  if (!root)
-    return ["Submit", "Cancel"];
-  const TOOL_BUTTONS = new Set([
-    "Bind API",
-    "Dynamic Bind",
-    "API Binding",
-    "Close",
-    "Minimize",
-    "Maximize",
-    "Help",
-    "Dismiss"
-  ]);
-  const buttons = [];
-  root.querySelectorAll("button, [role='button'], input[type='submit']").forEach((b) => {
-    if (b.offsetParent === null && !b.getAttribute("aria-label"))
-      return;
-    if (b.closest(".ds-dialog__title-adornment, .ds-dialog__heading, .ds-dialog__close, .ds-dialog__minimize, [data-dismiss], header .close-btn")) {
-      return;
-    }
-    const text = (b.textContent ?? "").trim() || b.getAttribute("aria-label") || (b instanceof HTMLInputElement ? b.value : "");
-    if (!text || TOOL_BUTTONS.has(text) || text.includes("Bind API") || buttons.includes(text))
-      return;
-    if (text.length <= 1 && !/[a-zA-Z0-9]/.test(text))
-      return;
-    buttons.push(text);
-  });
-  return buttons.length ? buttons : ["Submit", "Cancel"];
-}
-function buildSnapshot({
-  ids,
-  source,
-  parent,
-  root,
-  grid,
-  kind = "screen",
-  trigger,
-  contexts,
-  components: explicitComponents,
-  buttons: explicitButtons
-}) {
-  const discoveredComponents = discoverFormComponents(root);
-  const discoveredButtons = discoverButtons(root);
-  const components = explicitComponents && explicitComponents.length > 0 ? explicitComponents : discoveredComponents;
-  const buttons = explicitButtons && explicitButtons.length > 0 ? explicitButtons : discoveredButtons;
-  return {
-    key: ids.key,
-    name: `${source} - API Binding : ${parent}`,
-    ids: {
-      appId: ids.appId,
-      windowId: ids.windowId,
-      gridId: ids.gridId,
-      parentWindowIds: ids.parentWindowIds
-    },
-    source,
-    parent,
-    kind,
-    trigger,
-    components,
-    buttons,
-    contexts,
-    grid: grid ? {
-      id: grid.gridId,
-      label: grid.label || grid.gridId,
-      columns: grid.columns ?? (grid.rows.length ? Object.keys(grid.rows[0]) : []),
-      rows: grid.rows
-    } : undefined,
-    capturedAt: new Date().toISOString()
-  };
-}
-
-// src/core/valueCoercion.ts
-var TRUE = new Set(["true", "1", "yes", "y"]);
-var FALSE = new Set(["false", "0", "no", "n"]);
-function baseType(type) {
-  let t = type.replace(/\s*\|\s*(null|undefined)\b/g, "").trim();
-  let array = false;
-  const arr = t.match(/^Array<\s*([\s\S]+)\s*>$/);
-  if (arr) {
-    t = arr[1].trim();
-    array = true;
-  } else if (/\[\]$/.test(t)) {
-    t = t.replace(/\[\]$/, "").trim();
-    array = true;
-  }
-  return { base: t, array };
-}
-function coerceScalar(text, base) {
-  const t = text.trim();
-  if (/^number$/.test(base)) {
-    if (t === "")
-      return;
-    const n = Number(t);
-    return Number.isFinite(n) ? n : undefined;
-  }
-  if (/^boolean$/.test(base)) {
-    const l = t.toLowerCase();
-    return TRUE.has(l) ? true : FALSE.has(l) ? false : undefined;
-  }
-  return text;
-}
-function coerce(text, type) {
-  const { base, array } = baseType(type);
-  if (!array)
-    return coerceScalar(text, base);
-  const items = text.split(",").map((s) => s.trim()).filter((s) => s !== "");
-  const out = items.map((s) => coerceScalar(s, base));
-  if (out.some((v) => v === undefined))
-    return;
-  return out.length ? out : undefined;
-}
-function readPath(obj, path) {
-  if (path === "")
-    return obj;
-  return path.split(".").reduce((curr, key) => {
-    if (curr === null || curr === undefined || typeof curr !== "object")
-      return;
-    return curr[key];
-  }, obj);
-}
-var asText = (v) => v === null || v === undefined ? "" : typeof v === "object" ? JSON.stringify(v) : String(v);
-var FREE_TEXT_SOURCE2 = "freeText";
-function resolveParam(p, ctx) {
-  if (!p.source)
-    return;
-  let value;
-  if (p.source === FREE_TEXT_SOURCE2) {
-    value = p.property;
-  } else if (ctx.grid && p.source === ctx.grid.gridId) {
-    const prefix = `${ctx.grid.gridId}.`;
-    if (!p.property.startsWith(prefix) || !ctx.grid.rows.length)
-      return;
-    const path = p.property.slice(prefix.length);
-    const parts = ctx.grid.rows.map((r) => asText(readPath(r, path)));
-    value = parts.every((s) => s === "") ? "" : parts.join(",");
-  } else {
-    const parents = ctx.parents ?? [];
-    let parentId;
-    let fieldName = p.source;
-    for (const parent of parents) {
-      if (p.source.startsWith(`${parent.id}.`)) {
-        parentId = parent.id;
-        fieldName = p.source.slice(parent.id.length + 1);
-        break;
-      }
-    }
-    const values = parentId ? parents.find((x) => x.id === parentId)?.values ?? {} : ctx.form;
-    value = asText(values[fieldName]);
-  }
-  return value === "" ? undefined : value;
-}
-function setPath(target, path, value) {
-  const keys = path.split(".");
-  let cur = target;
-  keys.slice(0, -1).forEach((k) => {
-    if (!cur[k] || typeof cur[k] !== "object")
-      cur[k] = {};
-    cur = cur[k];
-  });
-  cur[keys[keys.length - 1]] = value;
-}
-function setArrayOfObjects(target, name, text, leafType) {
-  const i = name.indexOf("[].");
-  const head = name.slice(0, i);
-  const rest = name.slice(i + 3);
-  const values = text.split(",").map((s) => s.trim());
-  const coerced = values.map((v) => v === "" ? undefined : coerce(v, leafType));
-  if (coerced.some((v, idx) => v === undefined && values[idx] !== ""))
-    return false;
-  let arr = head.split(".").reduce((o, k) => o?.[k], target);
-  if (!Array.isArray(arr)) {
-    arr = [];
-    setPath(target, head, arr);
-  }
-  coerced.forEach((v, idx) => {
-    if (v === undefined)
-      return;
-    arr[idx] ??= {};
-    if (rest.includes("[]."))
-      setArrayOfObjects(arr[idx], rest, String(v), leafType);
-    else
-      setPath(arr[idx], rest, v);
-  });
-  return true;
-}
-function buildRequest(mappings, ctx, spec) {
-  const out = { data: {}, params: {}, path: {} };
-  const byName = new Map(spec.map((p) => [p.name, p]));
-  for (const m of mappings) {
-    const text = resolveParam(m, ctx);
-    if (text === undefined)
-      continue;
-    const s = byName.get(m.param);
-    const type = s?.type ?? "string";
-    const target = s?.in === "query" ? out.params : s?.in === "path" ? out.path : out.data;
-    if (m.param.includes("[].")) {
-      setArrayOfObjects(target, m.param, text, type);
-      continue;
-    }
-    const value = coerce(text, type);
-    if (value === undefined)
-      continue;
-    setPath(target, m.param, value);
-  }
-  return out;
-}
-
-// src/core/model.ts
-var CONFIG_VERSION = 1;
-var draftKey = (key) => `api-binding:draft:${key}`;
-var appliedKey = (key) => `api-binding:applied:${key}`;
-var fingerprint = (config) => JSON.stringify(config);
-var SUBMIT = componentId({ kind: "button", name: "Submit" });
-var CANCEL = componentId({ kind: "button", name: "Cancel" });
-var CUSTOMER_PARAM = "customerIds";
-var seq = 0;
-var newCallId = () => `call-${Date.now().toString(36)}-${(seq++).toString(36)}`;
-var definitionFor = (context, api, method) => context.definitions.find((d) => d.api === api && (!method || d.method === method));
-var methodsFor = (context, api) => context.definitions.filter((d) => d.api === api).map((d) => d.method);
-var apisOf = (context) => [...new Set(context.definitions.map((d) => d.api))];
-var fieldId = (name) => componentId({ kind: "field", name });
-function defaultField(c) {
-  return {
-    name: c.name,
-    label: c.label,
-    required: !!c.required,
-    input: c.name === "subject" || c.name === "notes" ? "template" : "user",
-    excluded: false
-  };
-}
-function reconcileCallParams(call, context) {
-  const def = definitionFor(context, call.api, call.method);
-  if (!def)
-    return call;
-  const saved = new Map(call.params.map((p) => [p.param, p]));
-  const params = def.params.map((p) => ({
-    param: p.name,
-    required: p.required,
-    source: saved.get(p.name)?.source ?? "",
-    property: saved.get(p.name)?.property ?? ""
-  }));
-  for (const p of call.params) {
-    if (!def.params.some((d) => d.name === p.param))
-      params.push(p);
-  }
-  return JSON.stringify(params) === JSON.stringify(call.params) ? call : { ...call, params };
-}
-function fromFile(file, context) {
-  if (!file)
-    return [];
-  const rows = (purpose) => (file[purpose] ?? []).map((r, i) => ({
-    id: `${purpose}-${i + 1}`,
-    purpose,
-    component: normalizeComponent(r.component),
-    api: r.api,
-    method: r.method || methodsFor(context, r.api)[0] || "",
-    timing: purpose === "read" ? r.timing || "lazy" : "",
-    ...purpose === "read" ? { freshness: r.freshness || "fresh" } : {},
-    ...purpose === "read" && r.pollSeconds ? { pollSeconds: r.pollSeconds } : {},
-    params: r.params.map((p) => ({
-      ...p,
-      source: normalizeComponent(p.source),
-      property: p.source === FREE_TEXT_SOURCE2 ? p.property : normalizeComponent(p.property)
-    }))
-  }));
-  return [...rows("read"), ...rows("write")].map((c) => reconcileCallParams(c, context));
-}
-function proposeConfig(context) {
-  return {
-    version: 2,
-    customerRule: "each",
-    success: "close",
-    templateFills: true,
-    fields: context.snapshot.components.map(defaultField),
-    calls: fromFile(context.mappings, context)
-  };
-}
-function reconcileConfig(config, context) {
-  const fields = context.snapshot.components.map((c) => {
-    const old = config.fields.find((f) => f.name === c.name);
-    return old ? { ...old, label: c.label, required: !!c.required } : defaultField(c);
-  });
-  const next = {
-    ...config,
-    fields,
-    calls: config.calls.map((c) => reconcileCallParams(c, context))
-  };
-  return fingerprint(next) === fingerprint(config) ? config : next;
-}
-function migrateConfig(raw, context) {
-  if (!raw || typeof raw !== "object")
-    return null;
-  const value = raw;
-  if (value.version === 2 && Array.isArray(value.calls) && Array.isArray(value.fields)) {
-    return reconcileConfig(value, context);
-  }
-  if (!Array.isArray(value.connections))
-    return null;
-  const old = value;
-  const has = (o, k) => Object.prototype.hasOwnProperty.call(o, k);
-  const base = proposeConfig(context);
-  let calls = base.calls;
-  const grid = context.snapshot.grid?.id;
-  const conflicts = [];
-  const legacy = new Set(old.connections.map((c) => c.name));
-  if (has(old, "saveApi") && !old.saveApi) {
-    calls = calls.filter((c) => !(c.purpose === "write" && c.component === SUBMIT));
-  } else if (old.saveApi || !has(old, "saveApi")) {
-    let submit = calls.find((c) => c.purpose === "write" && c.component === SUBMIT);
-    if (!submit && old.saveApi) {
-      submit = { id: "write-1", purpose: "write", component: SUBMIT, api: old.saveApi, method: "", timing: "", params: [] };
-      calls = [...calls, submit];
-    }
-    if (submit) {
-      const api = old.saveApi || submit.api;
-      const pick = methodsFor(context, api).includes("POST") ? "POST" : methodsFor(context, api)[0] ?? "";
-      const patched = reconcileCallParams({ ...submit, api, method: submit.api === api && submit.method ? submit.method : pick }, context);
-      const params = patched.params.map((p) => {
-        let next = legacy.has(p.source) ? { ...p, source: "", property: "" } : p;
-        const claim = old.connections.filter((c) => c.destination === p.param && !c.excluded);
-        if (claim.length === 1) {
-          next = { ...next, source: claim[0].name, property: claim[0].name };
-        } else if (claim.length > 1) {
-          conflicts.push({ callId: patched.id, param: p.param, fields: claim.map((c) => c.name) });
-          next = { ...next, source: "", property: "" };
-        }
-        if (has(old, "customerProperty") && grid && next.source === grid && p.param === CUSTOMER_PARAM) {
-          next = { ...next, property: old.customerProperty ?? "" };
-        }
-        return next;
-      });
-      calls = calls.map((c) => c.id === submit.id ? { ...patched, params } : c);
-    }
-  }
-  for (const conn of old.connections) {
-    if (!has(conn, "readApi"))
-      continue;
-    if (!conn.readApi) {
-      calls = calls.filter((c) => !(c.purpose === "read" && c.component === conn.name));
-      continue;
-    }
-    const existing = calls.find((c) => c.purpose === "read" && c.component === conn.name);
-    if (existing) {
-      calls = calls.map((c) => c === existing ? reconcileCallParams({ ...c, api: conn.readApi, method: c.api === conn.readApi ? c.method : methodsFor(context, conn.readApi)[0] ?? "" }, context) : c);
-    } else {
-      calls = [
-        ...calls,
-        reconcileCallParams({
-          id: newCallId(),
-          purpose: "read",
-          component: conn.name,
-          api: conn.readApi,
-          method: methodsFor(context, conn.readApi)[0] ?? "",
-          timing: "lazy",
-          freshness: "fresh",
-          params: []
-        }, context)
-      ];
-    }
-  }
-  const fields = base.fields.map((f) => {
-    const c = old.connections.find((x) => x.name === f.name);
-    return c ? { ...f, input: c.input, excluded: c.excluded } : f;
-  });
-  return {
-    version: 2,
-    customerRule: old.customerRule ?? "each",
-    success: old.success ?? "close",
-    templateFills: old.templateFills ?? true,
-    fields,
-    calls,
-    ...conflicts.length ? { conflicts } : {}
-  };
-}
-function callsFor(config, component) {
-  if (!component)
-    return config.calls;
-  return config.calls.filter((c) => c.component === component || c.params.some((p) => p.source === component));
-}
-function changeCallTarget(call, api, method, context) {
-  const methods = methodsFor(context, api);
-  const m = method && methods.includes(method) ? method : methods[0] ?? "";
-  const def = definitionFor(context, api, m);
-  const saved = new Map(call.params.map((p) => [p.param, p]));
-  const params = (def?.params ?? []).map((p) => ({
-    param: p.name,
-    required: p.required,
-    source: saved.get(p.name)?.source ?? "",
-    property: saved.get(p.name)?.property ?? ""
-  }));
-  const read = call.purpose === "read";
-  return {
-    ...call,
-    api,
-    method: m,
-    params,
-    ...read ? { timing: call.timing || "lazy", freshness: call.freshness || "fresh" } : {}
-  };
-}
-function droppedBy(call, api, method, context) {
-  const next = changeCallTarget(call, api, method, context);
-  const kept = new Set(next.params.map((p) => p.param));
-  return call.params.filter((p) => p.source && !kept.has(p.param)).length;
-}
-var populated = (call) => call.params.some((p) => !!p.source);
-function changePurpose(call, purpose) {
-  if (purpose === call.purpose)
-    return call;
-  return purpose === "read" ? { ...call, purpose, timing: "lazy", freshness: "fresh" } : { ...call, purpose, timing: "", freshness: undefined, pollSeconds: undefined };
-}
-function newCall(purpose, component) {
-  return {
-    id: newCallId(),
-    purpose,
-    component,
-    api: "",
-    method: "",
-    timing: purpose === "read" ? "lazy" : "",
-    ...purpose === "read" ? { freshness: "fresh" } : {},
-    params: []
-  };
-}
-function moveCall(calls, id, delta) {
-  const i = calls.findIndex((c) => c.id === id);
-  const j = i + delta;
-  if (i < 0 || j < 0 || j >= calls.length)
-    return calls;
-  const next = [...calls];
-  [next[i], next[j]] = [next[j], next[i]];
-  return next;
-}
-function setParamSource(p, source, gridId) {
-  if (source === FREE_TEXT_SOURCE2)
-    return { ...p, source, property: "" };
-  if (gridId && source === gridId)
-    return { ...p, source, property: "" };
-  return { ...p, source, property: source };
-}
-var gridPaths = (context) => context.snapshot.grid ? gridPropertyPaths({ gridId: context.snapshot.grid.id, rows: context.snapshot.grid.rows }) : [];
-var componentLabel = (context, id) => contextComponents(context.snapshot).find((o) => o.value === id)?.label ?? (id || "No target");
-var endpointLabel = (call) => call.api ? `${call.method || "?"} ${call.api}` : "No API selected";
-function callIssues(call, index, context) {
-  const out = [];
-  const name = `Call ${index + 1} (${call.purpose}${call.api ? ` ${endpointLabel(call)}` : ""})`;
-  const targets = new Set(contextComponents(context.snapshot).map((o) => o.value));
-  const sources = new Set(sourceComponents(context.snapshot).map((o) => o.value));
-  const paths = new Set(gridPaths(context));
-  const gridId = context.snapshot.grid?.id;
-  if (!call.component)
-    out.push(`${name}: choose which component it belongs to.`);
-  else if (!targets.has(call.component))
-    out.push(`${name}: target "${call.component}" is not in this window.`);
-  if (!call.api) {
-    out.push(`${name}: choose an API.`);
-    return out;
-  }
-  if (!apisOf(context).includes(call.api)) {
-    out.push(`${name}: API "${call.api}" is not registered.`);
-    return out;
-  }
-  if (!call.method || !methodsFor(context, call.api).includes(call.method)) {
-    out.push(`${name}: method "${call.method || "none"}" is not registered for this API.`);
-    return out;
-  }
-  const def = definitionFor(context, call.api, call.method);
-  if (def.available === false)
-    out.push(`${name}: unavailable — ${def.problem || "generated hook/contract missing"}.`);
-  if (call.purpose === "read") {
-    if (call.timing !== "lazy" && call.timing !== "prefetch")
-      out.push(`${name}: choose when it loads.`);
-    if (!call.freshness)
-      out.push(`${name}: choose freshness.`);
-    if (call.freshness === "poll" && !(Number.isInteger(call.pollSeconds) && (call.pollSeconds ?? 0) > 0)) {
-      out.push(`${name}: poll interval must be a whole number of seconds above 0.`);
-    }
-  }
-  for (const p of call.params) {
-    const spec = def.params.find((d) => d.name === p.param);
-    if (!spec) {
-      out.push(`${name}: "${p.param}" is no longer in the API contract — remove it or change the API.`);
-      continue;
-    }
-    if (!p.source) {
-      if (spec.required)
-        out.push(`${name}: required "${p.param}" has no source.`);
-      continue;
-    }
-    if (p.source === FREE_TEXT_SOURCE2) {
-      if (p.property === "") {
-        if (spec.required)
-          out.push(`${name}: required "${p.param}" has an empty fixed value.`);
-      } else if (!p.param.includes("[].") && coerce(p.property, spec.type) === undefined) {
-        out.push(`${name}: "${p.property}" is not a valid ${spec.type} for "${p.param}".`);
-      }
-      continue;
-    }
-    if (!sources.has(p.source)) {
-      out.push(`${name}: "${p.param}" source "${p.source}" is not in this window.`);
-      continue;
-    }
-    if (gridId && p.source === gridId && !paths.has(p.property)) {
-      out.push(`${name}: "${p.param}" needs a valid grid property${p.property ? ` ("${p.property}" not found)` : ""}.`);
-    }
-  }
-  return out;
-}
-var fieldUsed = (config, name) => config.calls.some((c) => c.component === name || c.params.some((p) => p.source === name));
-function issuesFor(config, context) {
-  const issues = [];
-  config.calls.forEach((c, i) => issues.push(...callIssues(c, i, context)));
-  if (context.snapshot.buttons.includes("Submit") && !config.calls.some((c) => c.purpose === "write" && c.component === SUBMIT)) {
-    issues.push("Submit has no write API mapping.");
-  }
-  for (const field of config.fields) {
-    const component = context.snapshot.components.find((c) => c.name === field.name);
-    if (field.excluded) {
-      if (field.required)
-        issues.push(`${field.label} is required and cannot be excluded.`);
-      if (fieldUsed(config, field.name))
-        issues.push(`${field.label} is excluded but still used by an API mapping.`);
-      continue;
-    }
-    if ((component?.kind ?? component?.type) === "checkbox" && !fieldUsed(config, field.name)) {
-      issues.push(`${field.label} has no supported action. Resolve it or explicitly exclude it.`);
-    }
-    if (component && (component.readable || component.kind === "dropdown" || component.type === "combobox") && component.optionsSource !== "static" && !config.calls.some((c) => c.purpose === "read" && c.component === field.name)) {
-      issues.push(`${field.label} needs a load connection.`);
-    }
-  }
-  for (const k of config.conflicts ?? []) {
-    const i = config.calls.findIndex((c) => c.id === k.callId);
-    const p = config.calls[i]?.params.find((x) => x.param === k.param);
-    if (p && !p.source) {
-      issues.push(`Call ${i + 1} (${endpointLabel(config.calls[i])}): "${k.param}" was claimed by ${k.fields.join(" and ")} in an older draft — choose its source.`);
-    }
-  }
-  return [...new Set(issues)];
-}
-function actionContext(context, form, rows) {
-  const grid = context.snapshot.grid;
-  return {
-    form,
-    ...grid ? { grid: { gridId: grid.id, rows: rows ?? grid.rows } } : {},
-    parents: (context.snapshot.contexts ?? []).map((p) => ({
-      id: p.id,
-      values: Object.fromEntries(p.components.map((c) => [c.name, c.value ?? ""]))
-    }))
-  };
-}
-var snapshotForm = (context) => Object.fromEntries(context.snapshot.components.map((c) => [c.name, c.value ?? ""]));
-function resolutionIssues(call, index, def, ctx) {
-  if (!def)
-    return [];
-  const out = [];
-  const name = `Call ${index + 1} (${call.purpose} ${endpointLabel(call)})`;
-  for (const spec of def.params) {
-    const m = call.params.find((p) => p.param === spec.name);
-    const text = m ? resolveParam(m, ctx) : undefined;
-    if (text === undefined || text === "") {
-      if (spec.required && m?.source)
-        out.push(`${name}: required "${spec.name}" resolves to no value.`);
-      continue;
-    }
-    if (!spec.name.includes("[].") && coerce(text, spec.type) === undefined) {
-      out.push(`${name}: "${text}" is not a valid ${spec.type} for "${spec.name}", so it would not be sent.`);
-    }
-  }
-  return out;
-}
-function previewRequests(config, context, ctx, filter) {
-  return config.calls.map((c, i) => ({ c, i })).filter(({ c }) => !filter || filter(c)).map(({ c, i }) => {
-    const def = definitionFor(context, c.api, c.method);
-    const parts = buildRequest(c.params, ctx, def?.params ?? []);
-    return {
-      order: i + 1,
-      id: c.id,
-      purpose: c.purpose,
-      target: componentLabel(context, c.component),
-      method: c.method ?? "",
-      api: c.api,
-      hook: def?.hook ?? "",
-      available: !!def && def.available !== false,
-      parts,
-      issues: [...callIssues(c, i, context), ...resolutionIssues(c, i, def, ctx)]
-    };
-  });
-}
-var isNoteContract = (def) => !!def && ["subject", "description", "noteType"].every((n) => def.params.some((p) => p.name === n));
-function isSimulated(call, context) {
-  const def = definitionFor(context, call.api, call.method);
-  if (!def || def.available === false)
-    return false;
-  if (call.purpose === "write") {
-    return call.component === SUBMIT && call.method === "POST" && isNoteContract(def) && def.params.some((p) => p.name === CUSTOMER_PARAM);
-  }
-  return !!context.options[call.component]?.length && !!context.mappings?.read.some((r) => normalizeComponent(r.component) === call.component && r.api === call.api && (r.method || call.method) === call.method);
-}
-function simulatorGaps(config, context) {
-  return config.calls.filter((c) => c.api && !isSimulated(c, context)).map((c) => c.purpose === "write" ? `No simulator for ${endpointLabel(c)} on ${componentLabel(context, c.component)}; only its request preview can be shown, so this binding cannot be verified here.` : `${endpointLabel(c)} for ${componentLabel(context, c.component)} is not tested: no captured response exists for it, so this binding cannot be verified here.`);
-}
-function simulationErrors(config, input, customers) {
-  const errors = [];
-  const hasGridParam = config.calls.some((c) => c.params.some((p) => p.param === CUSTOMER_PARAM || p.source.toLowerCase().includes("grid")));
-  if (hasGridParam) {
-    if (!customers)
-      errors.push("Select at least one customer.");
-    if (config.customerRule === "single" && customers !== 1)
-      errors.push("This binding requires exactly one customer.");
-  }
-  const required = (name) => config.fields.find((f) => f.name === name && !f.excluded && f.required);
-  if (required("notesType") && !input.notesType)
-    errors.push("Notes Type is required.");
-  if (required("subject") && !String(input.subject ?? "").trim())
-    errors.push("Subject is required.");
-  if (required("notes") && !String(input.notes ?? "").trim())
-    errors.push("Description is required.");
-  for (const field of config.fields) {
-    if (field.excluded || !field.required)
-      continue;
-    if (field.name === "notesType" || field.name === "subject" || field.name === "notes")
-      continue;
-    const val = input[field.name];
-    if (val === undefined || val === null || String(val).trim() === "") {
-      errors.push(`${field.label} is required.`);
-    }
-  }
-  return errors;
-}
-var simulationForm = (input) => {
-  const form = {
-    notesType: String(input.notesType ?? ""),
-    template: String(input.template ?? ""),
-    subject: String(input.subject ?? ""),
-    notes: String(input.notes ?? ""),
-    addCallLog: String(input.addCallLog ?? "")
-  };
-  for (const [k, v] of Object.entries(input)) {
-    form[k] = typeof v === "boolean" ? String(v) : String(v ?? "");
-  }
-  return form;
-};
-function simulateSave(config, context, input, rows, fail) {
-  const ctx = actionContext(context, simulationForm(input), rows);
-  const requests = previewRequests(config, context, ctx, (c) => c.purpose === "write" && c.component === SUBMIT);
-  const errors = [...simulationErrors(config, input, rows.length), ...simulatorGaps(config, context)];
-  if (!requests.length)
-    errors.push("Submit has no write API mapping.");
-  errors.push(...requests.flatMap((r) => r.issues));
-  if (errors.length)
-    return { notes: [], errors: [...new Set(errors)], requests };
-  if (fail) {
-    return {
-      notes: [],
-      errors: ["Simulated save failed. Your entered information is preserved; retry when ready."],
-      requests
-    };
-  }
-  const notes = [];
-  for (const r of requests) {
-    const d = r.parts.data;
-    const def = definitionFor(context, r.api, r.method);
-    if (isNoteContract(def)) {
-      if (typeof d.subject !== "string" || !d.subject.trim() || typeof d.description !== "string" || !d.description.trim() || typeof d.noteType !== "number") {
-        return {
-          notes: [],
-          errors: [`${endpointLabel(r)} would not send a valid note (subject, description, noteType). Review its request mappings.`],
-          requests
-        };
-      }
-      const ids = d[CUSTOMER_PARAM];
-      if (!Array.isArray(ids) || !ids.length || !ids.every((x) => typeof x === "number" && Number.isFinite(x))) {
-        return {
-          notes: [],
-          errors: [`${endpointLabel(r)} would not send valid customer IDs ("${CUSTOMER_PARAM}"). Review its customer identifier.`],
-          requests
-        };
-      }
-      const customers = ids;
-      customers.forEach((customerId) => notes.push({
-        id: `sample-note-${notes.length + 1}`,
-        customerId,
-        noteType: d.noteType,
-        subject: d.subject,
-        description: d.description
-      }));
-    } else {
-      notes.push({
-        id: `sample-record-${notes.length + 1}`,
-        ...d
-      });
-    }
-  }
-  return { notes, errors: [], requests };
-}
-function canApply(config, context, verified) {
-  return issuesFor(config, context).length === 0 && simulatorGaps(config, context).length === 0 && verified === fingerprint(config);
-}
-function fieldSummary(config, context, name) {
-  const reads = config.calls.filter((c) => c.purpose === "read" && c.component === name).map((c) => `${endpointLabel(c)} · ${c.timing === "prefetch" ? "On Window Load" : "Lazy on Click"}`);
-  const field = config.fields.find((f) => f.name === name);
-  const sends = config.calls.flatMap((c) => c.params.filter((p) => p.source === name).map((p) => `${endpointLabel(c)} → ${p.param}`));
-  const input = field?.input === "template" && config.templateFills ? "User input or template" : "User input";
-  return {
-    from: field?.excluded ? "Excluded by choice" : [...reads, ...reads.length ? [] : [input]].join("; "),
-    to: field?.excluded ? "Hidden in Studio preview" : sends.join("; ") || (name === "template" && config.templateFills ? "Fills Subject and Description · not saved" : "Not sent by any API")
-  };
-}
-var isButton = isButtonId;
-// src/core/transport.ts
-var contextKey = (key) => `api-binding:context:${key}`;
-var latestContexts = new Map;
-var hostListening = false;
-function storeBindingContext(context) {
-  try {
-    const key = context.snapshot.key;
-    const json = JSON.stringify(context);
-    localStorage.setItem(contextKey(key), json);
-    storeSnapshot(context.snapshot);
-  } catch {}
-}
-function readBindingContext(key) {
-  try {
-    const raw = localStorage.getItem(contextKey(key)) || localStorage.getItem(`api-binding-v2:context:${key}`);
-    return raw ? JSON.parse(raw) : null;
-  } catch {
-    return null;
-  }
-}
-function validBindingContext(value, key) {
-  if (!value || typeof value !== "object")
-    return false;
-  const context = value;
-  return context.snapshot?.key === key && Array.isArray(context.snapshot.components) && !!context.options;
-}
-function openBindingStudio(context, options) {
-  const key = context.snapshot.key;
-  storeBindingContext(context);
-  latestContexts.set(key, context);
-  if (!hostListening) {
-    hostListening = true;
-    window.addEventListener("message", (event) => {
-      if (event.origin !== window.location.origin)
-        return;
-      const data = event.data;
-      if ((data?.type === BINDING_READY || data?.type === "api-binding-v2-ready") && data.key) {
-        const current = latestContexts.get(data.key);
-        if (current) {
-          const msg = { type: BINDING_CONTEXT, context: current };
-          event.source?.postMessage(msg, event.origin);
-        }
-      }
-    });
-  }
-  const tabName = `api-binding:${key}`;
-  const routeBase = options?.routeBase || "/api-binding";
-  const url = `${routeBase}/${encodeURIComponent(key)}`;
-  const tab = window.open("", tabName, options?.features);
-  if (!tab) {
-    throw new Error("Your browser blocked the API Binding tab. Please allow popups for this site and try again.");
-  }
-  try {
-    if (tab.location.href === "about:blank") {
-      tab.location.href = url;
-    }
-  } catch {
-    tab.location.href = url;
-  }
-  const msg = { type: BINDING_CONTEXT, context };
-  try {
-    tab.postMessage(msg, window.location.origin);
-  } catch {}
-  tab.focus();
-  try {
-    const channel = new BroadcastChannel(BINDING_CHANNEL);
-    channel.postMessage({ key });
-    channel.close();
-  } catch {}
-  return tab;
-}
-function notifyApplied(key, config) {
-  const payload = {
-    version: CONFIG_VERSION,
-    config,
-    appliedAt: new Date().toISOString()
-  };
-  const rawPayload = JSON.stringify(payload);
-  try {
-    localStorage.setItem(appliedKey(key), rawPayload);
-    localStorage.setItem(`api-binding:applied:${key}`, rawPayload);
-  } catch {}
-  const msg = {
-    type: BINDING_APPLIED,
-    key,
-    config
-  };
-  try {
-    window.opener?.postMessage(msg, window.location.origin);
-    window.opener?.postMessage({ type: "api-binding-v2-applied", key, config }, window.location.origin);
-  } catch {}
-  try {
-    const channel = new BroadcastChannel(BINDING_CHANNEL);
-    channel.postMessage(msg);
-    channel.close();
-  } catch {}
-}
-function notifySelectionUpdate(key, grid) {
-  const msg = {
-    type: BINDING_SELECTION_UPDATE,
-    key,
-    grid
-  };
-  try {
-    const channel = new BroadcastChannel(BINDING_CHANNEL);
-    channel.postMessage(msg);
-    channel.close();
-  } catch {}
-}
-var validContext = validBindingContext;
-// src/core/catalog.ts
-function friendlyLabel(operationId) {
-  if (!operationId)
-    return;
-  return operationId.split(".").filter((p) => !/^v\d+$/i.test(p)).map((p) => p.replace(/([a-z0-9])([A-Z])/g, "$1 $2").replace(/^./, (c) => c.toUpperCase())).join(" ");
-}
-function buildCatalogFromRegistry({
-  bindings,
-  hookResolver = () => {
-    return;
-  },
-  paramsResolver = () => [],
-  availabilityChecker = () => ({ available: true })
-}) {
-  const definitions = [];
-  for (const [api, methodsObj] of Object.entries(bindings)) {
-    for (const [method, meta] of Object.entries(methodsObj)) {
-      const hook = hookResolver(api, method) ?? "";
-      const params = paramsResolver(api, method);
-      const status = availabilityChecker(api, method);
-      definitions.push({
-        api,
-        method: method.toUpperCase(),
-        hook,
-        params,
-        label: friendlyLabel(meta?.operationId),
-        available: status.available,
-        ...status.problem ? { problem: status.problem } : {}
-      });
-    }
-  }
-  return definitions;
-}
-// src/hooks/useAppliedBinding.ts
-import * as React from "react";
-function useAppliedBinding(pageKey) {
-  const [applied, setApplied] = React.useState(() => {
-    try {
-      const raw = localStorage.getItem(appliedKey(pageKey));
-      return raw ? JSON.parse(raw) : null;
-    } catch {
-      return null;
-    }
-  });
-  React.useEffect(() => {
-    function check() {
-      try {
-        const raw = localStorage.getItem(appliedKey(pageKey));
-        if (raw)
-          setApplied(JSON.parse(raw));
-      } catch {}
-    }
-    const onMessage = (event) => {
-      if (event.origin === window.location.origin) {
-        const data = event.data;
-        if (data?.type === BINDING_APPLIED && data.key === pageKey) {
-          check();
-        }
-      }
-    };
-    const onStorage = (event) => {
-      if (event.key === appliedKey(pageKey)) {
-        check();
-      }
-    };
-    window.addEventListener("message", onMessage);
-    window.addEventListener("storage", onStorage);
-    let channel;
-    try {
-      channel = new BroadcastChannel(BINDING_CHANNEL);
-      channel.onmessage = (event) => {
-        if (event.data?.type === BINDING_APPLIED && event.data?.key === pageKey) {
-          check();
-        }
-      };
-    } catch {}
-    return () => {
-      window.removeEventListener("message", onMessage);
-      window.removeEventListener("storage", onStorage);
-      channel?.close();
-    };
-  }, [pageKey]);
-  return {
-    appliedConfig: applied?.config ?? null,
-    isApplied: !!applied,
-    appliedAt: applied?.appliedAt ?? null
-  };
-}
-// src/components/BindApiButton.tsx
-import * as React3 from "react";
-
-// src/components/ui/Icons.tsx
-import * as React2 from "react";
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-var base = (path) => React2.forwardRef(({ size = 16, className = "", ...props }, ref) => /* @__PURE__ */ jsx("svg", {
-  ref,
-  width: size,
-  height: size,
-  viewBox: "0 0 24 24",
-  fill: "none",
-  stroke: "currentColor",
-  strokeWidth: "2",
-  strokeLinecap: "round",
-  strokeLinejoin: "round",
-  className,
-  ...props,
-  children: path
-}));
-var LinkIcon = base(/* @__PURE__ */ jsxs(Fragment, {
-  children: [
-    /* @__PURE__ */ jsx("path", {
-      d: "M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"
-    }),
-    /* @__PURE__ */ jsx("path", {
-      d: "M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"
-    })
-  ]
-}));
-var PencilIcon = base(/* @__PURE__ */ jsxs(Fragment, {
-  children: [
-    /* @__PURE__ */ jsx("path", {
-      d: "M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z"
-    }),
-    /* @__PURE__ */ jsx("path", {
-      d: "m15 5 4 4"
-    })
-  ]
-}));
-var SettingsIcon = base(/* @__PURE__ */ jsxs(Fragment, {
-  children: [
-    /* @__PURE__ */ jsx("path", {
-      d: "M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z"
-    }),
-    /* @__PURE__ */ jsx("circle", {
-      cx: "12",
-      cy: "12",
-      r: "3"
-    })
-  ]
-}));
-var PlusIcon = base(/* @__PURE__ */ jsxs(Fragment, {
-  children: [
-    /* @__PURE__ */ jsx("path", {
-      d: "M5 12h14"
-    }),
-    /* @__PURE__ */ jsx("path", {
-      d: "M12 5v14"
-    })
-  ]
-}));
-var Trash2Icon = base(/* @__PURE__ */ jsxs(Fragment, {
-  children: [
-    /* @__PURE__ */ jsx("path", {
-      d: "M3 6h18"
-    }),
-    /* @__PURE__ */ jsx("path", {
-      d: "M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6"
-    }),
-    /* @__PURE__ */ jsx("path", {
-      d: "M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"
-    }),
-    /* @__PURE__ */ jsx("line", {
-      x1: "10",
-      x2: "10",
-      y1: "11",
-      y2: "17"
-    }),
-    /* @__PURE__ */ jsx("line", {
-      x1: "14",
-      x2: "14",
-      y1: "11",
-      y2: "17"
-    })
-  ]
-}));
-var ArrowUpIcon = base(/* @__PURE__ */ jsxs(Fragment, {
-  children: [
-    /* @__PURE__ */ jsx("path", {
-      d: "m5 12 7-7 7 7"
-    }),
-    /* @__PURE__ */ jsx("path", {
-      d: "M12 19V5"
-    })
-  ]
-}));
-var ArrowDownIcon = base(/* @__PURE__ */ jsxs(Fragment, {
-  children: [
-    /* @__PURE__ */ jsx("path", {
-      d: "M12 5v14"
-    }),
-    /* @__PURE__ */ jsx("path", {
-      d: "m19 12-7 7-7-7"
-    })
-  ]
-}));
-var PlayIcon = base(/* @__PURE__ */ jsx("polygon", {
-  points: "6 3 20 12 6 21 6 3"
-}));
-var CheckIcon = base(/* @__PURE__ */ jsx("polyline", {
-  points: "20 6 9 17 4 12"
-}));
-var XIcon = base(/* @__PURE__ */ jsxs(Fragment, {
-  children: [
-    /* @__PURE__ */ jsx("path", {
-      d: "M18 6 6 18"
-    }),
-    /* @__PURE__ */ jsx("path", {
-      d: "m6 6 12 12"
-    })
-  ]
-}));
-var SearchIcon = base(/* @__PURE__ */ jsxs(Fragment, {
-  children: [
-    /* @__PURE__ */ jsx("circle", {
-      cx: "11",
-      cy: "11",
-      r: "8"
-    }),
-    /* @__PURE__ */ jsx("path", {
-      d: "m21 21-4.3-4.3"
-    })
-  ]
-}));
-var AlertTriangleIcon = base(/* @__PURE__ */ jsxs(Fragment, {
-  children: [
-    /* @__PURE__ */ jsx("path", {
-      d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z"
-    }),
-    /* @__PURE__ */ jsx("line", {
-      x1: "12",
-      x2: "12",
-      y1: "9",
-      y2: "13"
-    }),
-    /* @__PURE__ */ jsx("line", {
-      x1: "12",
-      x2: "12.01",
-      y1: "17",
-      y2: "17"
-    })
-  ]
-}));
-var AlertCircleIcon = base(/* @__PURE__ */ jsxs(Fragment, {
-  children: [
-    /* @__PURE__ */ jsx("circle", {
-      cx: "12",
-      cy: "12",
-      r: "10"
-    }),
-    /* @__PURE__ */ jsx("line", {
-      x1: "12",
-      x2: "12",
-      y1: "8",
-      y2: "12"
-    }),
-    /* @__PURE__ */ jsx("line", {
-      x1: "12",
-      x2: "12.01",
-      y1: "16",
-      y2: "16"
-    })
-  ]
-}));
-var iconMap = {
-  Link: LinkIcon,
-  Pencil: PencilIcon,
-  Settings: SettingsIcon,
-  Plus: PlusIcon,
-  Trash2: Trash2Icon,
-  ArrowUp: ArrowUpIcon,
-  ArrowDown: ArrowDownIcon,
-  Play: PlayIcon,
-  Check: CheckIcon,
-  X: XIcon,
-  Search: SearchIcon,
-  AlertTriangle: AlertTriangleIcon,
-  AlertCircle: AlertCircleIcon
-};
-function renderIcon(icon, props) {
-  if (!icon)
-    return null;
-  if (typeof icon === "string") {
-    const Component = iconMap[icon];
-    return Component ? /* @__PURE__ */ jsx(Component, {
-      ...props
-    }) : null;
-  }
-  return icon;
-}
-
-// src/components/ui/Button.tsx
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-function Button({
-  variant = "secondary",
-  size = "md",
-  icon,
-  tooltip,
-  children,
-  className = "",
-  type = "button",
-  ...rest
-}) {
-  const iconOnly = Boolean(icon) && (children === undefined || children === null || children === false);
-  return /* @__PURE__ */ jsxs2("button", {
-    type,
-    className: `ds-button ds-button--${size} ds-button--${variant} ${iconOnly ? "ds-button--icon-only" : ""} ${className}`,
-    title: typeof tooltip === "string" ? tooltip : undefined,
-    ...rest,
-    children: [
-      icon && /* @__PURE__ */ jsx2("span", {
-        className: "ds-button__icon",
-        children: renderIcon(icon)
-      }),
-      children && /* @__PURE__ */ jsx2("span", {
-        children
-      })
-    ]
-  });
-}
-function ButtonBar({ justify, children, className = "" }) {
-  return /* @__PURE__ */ jsx2("div", {
-    className: `ds-button-bar ${justify === "between" ? "ds-button-bar--justify-between" : ""} ${className}`,
-    children
-  });
-}
-function ButtonGroup({
-  value,
-  onChange,
-  options = [],
-  "aria-label": ariaLabel,
-  className = ""
-}) {
-  return /* @__PURE__ */ jsx2("div", {
-    className: `ds-button-group ${className}`,
-    role: "group",
-    "aria-label": ariaLabel,
-    children: options.map((opt) => /* @__PURE__ */ jsx2("button", {
-      type: "button",
-      className: `ds-button-group__button ${opt.value === value ? "ds-button-group__button--selected active" : ""}`,
-      onClick: () => onChange(opt.value),
-      children: opt.label
-    }, opt.value))
-  });
-}
-
-// src/components/BindApiButton.tsx
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
-function BindApiButton({
-  appId = "app",
-  windowId,
-  source,
-  parent,
-  grid,
-  parents,
-  kind,
-  trigger,
-  options = {},
-  definitions = [],
-  mappingFile = null,
-  routeBase = "/api-binding",
-  containerRef,
-  containerSelector,
-  rootElement,
-  formId,
-  components: explicitComponents,
-  buttons: explicitButtons,
-  className = "",
-  children = "Bind API"
-}) {
-  const ref = React3.useRef(null);
-  const [error, setError] = React3.useState("");
-  function handleClick(e) {
-    e.preventDefault();
-    e.stopPropagation();
-    try {
-      const ids = windowIds({
-        appId,
-        windowId,
-        gridId: grid?.gridId,
-        parentWindowIds: parents?.map((p) => p.id)
-      });
-      const root = findEnclosingContextElement(ref.current, {
-        containerRef,
-        containerSelector,
-        rootElement,
-        formId
-      });
-      const resolvedKind = kind ?? (root?.closest('[role="dialog"], dialog, .ds-dialog') ? "dialog" : root?.closest("[data-drawer], aside, .drawer") ? "drawer" : "screen");
-      const snapshot = buildSnapshot({
-        ids,
-        source,
-        parent,
-        root,
-        grid,
-        kind: resolvedKind,
-        trigger,
-        contexts: parents,
-        components: explicitComponents,
-        buttons: explicitButtons
-      });
-      openBindingStudio({
-        snapshot,
-        mappings: mappingFile,
-        options,
-        definitions
-      }, { routeBase });
-      setError("");
-    } catch (err) {
-      const msg = err instanceof Error ? err.message : "Could not open API Binding Studio.";
-      setError(msg);
-      console.error("[BindApiButton] Error:", err);
-    }
-  }
-  return /* @__PURE__ */ jsxs3("span", {
-    ref,
-    className,
-    children: [
-      /* @__PURE__ */ jsx3(Button, {
-        size: "sm",
-        icon: "Link",
-        onClick: handleClick,
-        tooltip: error || undefined,
-        children
-      }),
-      error && /* @__PURE__ */ jsx3("span", {
-        role: "alert",
-        className: "binding-error",
-        style: { marginLeft: "0.5rem" },
-        children: error
-      })
-    ]
-  });
-}
-// src/components/ApiBindingWorkspace.tsx
-import * as React9 from "react";
-
-// src/components/WorkspaceContext.tsx
-import * as React6 from "react";
-
-// src/components/ui/Badge.tsx
-import { jsx as jsx4 } from "react/jsx-runtime";
-var TONES = {
-  neutral: {
-    bg: "var(--ds-badge-neutral-background, var(--ds-color-surface, #f8fafc))",
-    fg: "var(--ds-badge-neutral-foreground, var(--ds-color-muted-foreground, #64748b))",
-    border: "var(--ds-badge-neutral-border, var(--ds-color-border, #e2e8f0))"
-  },
-  warning: {
-    bg: "var(--ds-badge-warning-background, #fff7ed)",
-    fg: "var(--ds-badge-warning-foreground, #9a3412)",
-    border: "var(--ds-badge-warning-border, #fed7aa)"
-  },
-  success: {
-    bg: "var(--ds-badge-success-background, #f0fdf4)",
-    fg: "var(--ds-badge-success-foreground, #166534)",
-    border: "var(--ds-badge-success-border, #bbf7d0)"
-  },
-  danger: {
-    bg: "var(--ds-badge-danger-background, #fef2f2)",
-    fg: "var(--ds-badge-danger-foreground, #991b1b)",
-    border: "var(--ds-badge-danger-border, #fecaca)"
-  },
-  info: {
-    bg: "var(--ds-badge-info-background, #eff6ff)",
-    fg: "var(--ds-badge-info-foreground, #1e40af)",
-    border: "var(--ds-badge-info-border, #bfdbfe)"
-  },
-  brand: {
-    bg: "var(--ds-badge-brand-background, #fff7ed)",
-    fg: "var(--ds-badge-brand-foreground, #c2410c)",
-    border: "var(--ds-badge-brand-border, #fdba74)"
-  }
-};
-function Badge({ variant = "neutral", children, className = "", style, ...rest }) {
-  const tone = TONES[variant] ?? TONES.neutral;
-  return /* @__PURE__ */ jsx4("span", {
-    className: `ds-badge ds-badge--${variant} ${className}`,
-    style: {
-      display: "inline-flex",
-      alignItems: "center",
-      borderWidth: "1px",
-      borderStyle: "solid",
-      borderColor: tone.border,
-      backgroundColor: tone.bg,
-      color: tone.fg,
-      borderRadius: "var(--ds-badge-radius, 4px)",
-      height: "var(--ds-badge-height-sm, 20px)",
-      padding: "0 var(--ds-badge-padding-x-sm, 8px)",
-      fontSize: "var(--ds-badge-font-size-sm, 12px)",
-      fontWeight: 500,
-      lineHeight: 1,
-      whiteSpace: "nowrap",
-      ...style
-    },
-    ...rest,
-    children
-  });
-}
-
-// src/components/ui/AppGrid.tsx
-import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
-function createActionColumn(spec) {
-  return {
-    type: "action",
-    headerName: spec.headerName,
-    labelField: spec.labelField,
-    icon: spec.icon,
-    onClick: spec.onClick
-  };
-}
-function AppGrid({
-  rows = [],
-  columns = [],
-  getRowKey = (_, i) => i,
-  className = ""
-}) {
-  return /* @__PURE__ */ jsx5("div", {
-    className: `ds-grid ${className}`,
-    style: {
-      border: "1px solid var(--ds-color-border, #e2e8f0)",
-      borderRadius: "var(--ds-radius-md, 6px)",
-      overflow: "hidden",
-      backgroundColor: "var(--ds-color-surface, #ffffff)",
-      width: "100%"
-    },
-    children: /* @__PURE__ */ jsx5("div", {
-      style: { width: "100%", overflowX: "auto" },
-      children: /* @__PURE__ */ jsxs4("table", {
-        className: "ds-grid__table",
-        style: {
-          width: "100%",
-          borderCollapse: "collapse",
-          fontSize: "13px",
-          textAlign: "left"
-        },
-        children: [
-          /* @__PURE__ */ jsx5("thead", {
-            children: /* @__PURE__ */ jsx5("tr", {
-              className: "ds-grid__header-row",
-              style: {
-                backgroundColor: "var(--ds-grid-header-background, #f8fafc)",
-                borderBottom: "1px solid var(--ds-color-border, #e2e8f0)"
-              },
-              children: columns.map((col, idx) => /* @__PURE__ */ jsx5("th", {
-                className: `ds-grid__header-cell ${col.fill ? "ds-grid__header-cell--fill" : ""}`,
-                style: {
-                  padding: "8px 12px",
-                  fontSize: "12px",
-                  fontWeight: 600,
-                  color: "var(--ds-grid-header-foreground, #475569)",
-                  borderRight: idx < columns.length - 1 ? "1px solid var(--ds-color-border, #e2e8f0)" : "none",
-                  width: col.fill ? undefined : col.type === "action" ? "120px" : undefined
-                },
-                children: /* @__PURE__ */ jsx5("div", {
-                  className: "ds-grid__header-cell-label",
-                  children: col.headerName
-                })
-              }, `${String(col.field ?? idx)}`))
-            })
-          }),
-          /* @__PURE__ */ jsx5("tbody", {
-            children: rows.map((row, rowIdx) => /* @__PURE__ */ jsx5("tr", {
-              className: "ds-grid__row",
-              style: {
-                borderBottom: rowIdx < rows.length - 1 ? "1px solid var(--ds-color-border, #e2e8f0)" : "none",
-                backgroundColor: rowIdx % 2 === 1 ? "var(--ds-grid-row-alt, #fafbfc)" : "#ffffff"
-              },
-              children: columns.map((col, colIdx) => {
-                let content = null;
-                if (col.type === "action") {
-                  const label = col.labelField ? String(row[col.labelField] ?? "") : "Edit";
-                  content = /* @__PURE__ */ jsx5(Button, {
-                    size: "sm",
-                    variant: "secondary",
-                    icon: col.icon,
-                    onClick: () => col.onClick?.(row),
-                    children: label
-                  });
-                } else if (col.type === "badge") {
-                  const val = String(row[col.field] ?? "");
-                  const variant = col.badgeVariants?.[val] ?? "neutral";
-                  content = /* @__PURE__ */ jsx5(Badge, {
-                    variant,
-                    children: val
-                  });
-                } else if (col.render) {
-                  content = col.render(row);
-                } else {
-                  const val = row[col.field];
-                  content = val !== undefined && val !== null ? String(val) : "—";
-                }
-                return /* @__PURE__ */ jsx5("td", {
-                  className: `ds-grid__cell ${col.fill ? "ds-grid__cell--fill" : ""} ${col.type === "number" ? "ds-grid__cell--numeric" : ""}`,
-                  style: {
-                    padding: "8px 12px",
-                    color: "var(--ds-color-foreground, #0f172a)",
-                    borderRight: colIdx < columns.length - 1 ? "1px solid var(--ds-color-border, #e2e8f0)" : "none"
-                  },
-                  children: content
-                }, `${String(col.field ?? colIdx)}`);
-              })
-            }, String(getRowKey(row, rowIdx))))
-          })
-        ]
-      })
-    })
-  });
-}
-
-// src/components/ui/Banner.tsx
-import { jsx as jsx6 } from "react/jsx-runtime";
-function Banner({ tone = "caution", children, className = "" }) {
-  return /* @__PURE__ */ jsx6("div", {
-    className: `ds-banner ds-banner--${tone} ${className}`,
-    role: "status",
-    children: /* @__PURE__ */ jsx6("div", {
-      className: "ds-banner__content",
-      children
-    })
-  });
-}
-
-// src/components/ui/Card.tsx
-import * as React4 from "react";
-import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
-function DetailCard({
-  title,
-  subtitle,
-  actions,
-  fields = [],
-  dense = true,
-  className = ""
-}) {
-  const showHeader = Boolean(title) || Boolean(subtitle) || Boolean(actions);
-  return /* @__PURE__ */ jsxs5("section", {
-    className: `ds-detail-card ${dense ? "ds-detail-card--dense" : ""} ${className}`,
-    style: {
-      backgroundColor: "var(--ds-detail-card-background, var(--ds-color-surface, #ffffff))",
-      border: "1px solid var(--ds-detail-card-border, var(--ds-color-border, #e2e8f0))",
-      borderRadius: "var(--ds-detail-card-radius, var(--ds-radius-md, 6px))",
-      boxShadow: "var(--ds-detail-card-shadow, none)",
-      display: "flex",
-      flexDirection: "column",
-      minWidth: 0
-    },
-    children: [
-      showHeader && /* @__PURE__ */ jsxs5("div", {
-        className: "ds-detail-card__header",
-        style: {
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "space-between",
-          padding: "12px 16px",
-          borderBottom: "1px solid var(--ds-detail-card-border, var(--ds-color-border, #e2e8f0))"
-        },
-        children: [
-          /* @__PURE__ */ jsxs5("div", {
-            className: "ds-detail-card__heading",
-            style: { minWidth: 0 },
-            children: [
-              title && /* @__PURE__ */ jsx7("h3", {
-                className: "ds-detail-card__title",
-                style: {
-                  margin: 0,
-                  fontSize: "var(--ds-detail-card-title-font-size, 14px)",
-                  fontWeight: 600,
-                  color: "var(--ds-color-foreground, #0f172a)"
-                },
-                children: title
-              }),
-              subtitle && /* @__PURE__ */ jsx7("p", {
-                className: "ds-detail-card__subtitle",
-                style: {
-                  margin: 0,
-                  fontSize: "12px",
-                  color: "var(--ds-color-muted-foreground, #64748b)"
-                },
-                children: subtitle
-              })
-            ]
-          }),
-          actions && /* @__PURE__ */ jsx7("div", {
-            className: "ds-detail-card__actions",
-            children: actions
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsx7("dl", {
-        className: "ds-detail-card__body",
-        style: {
-          margin: 0,
-          padding: "12px 16px",
-          display: "grid",
-          gridTemplateColumns: "max-content 1fr",
-          columnGap: "24px",
-          rowGap: "8px",
-          alignItems: "baseline"
-        },
-        children: fields.map((f, i) => /* @__PURE__ */ jsxs5(React4.Fragment, {
-          children: [
-            /* @__PURE__ */ jsx7("dt", {
-              className: "ds-detail-card__label",
-              style: {
-                fontWeight: 600,
-                color: "var(--ds-color-foreground, #0f172a)",
-                fontSize: "var(--ds-font-size-sm, 13px)",
-                lineHeight: 1.4
-              },
-              children: f.label
-            }),
-            /* @__PURE__ */ jsx7("dd", {
-              className: "ds-detail-card__value",
-              style: {
-                margin: 0,
-                color: "var(--ds-color-foreground, #0f172a)",
-                fontSize: "var(--ds-font-size-sm, 13px)",
-                lineHeight: 1.4
-              },
-              children: f.value !== undefined && f.value !== null && f.value !== "" ? f.value : "—"
-            })
-          ]
-        }, `${f.label}-${i}`))
-      })
-    ]
-  });
-}
-
-// src/components/ui/Dialog.tsx
-import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
-function Dialog({
-  open = true,
-  title,
-  description,
-  submitLabel = "Submit",
-  cancelLabel = "Cancel",
-  onCancel,
-  onSubmit,
-  children,
-  size = "large",
-  formId,
-  className = ""
-}) {
-  if (!open)
-    return null;
-  return /* @__PURE__ */ jsx8("div", {
-    className: "ds-dialog__backdrop",
-    onClick: onCancel,
-    children: /* @__PURE__ */ jsxs6("div", {
-      className: `ds-dialog ${size === "large" ? "ds-dialog--lg" : ""} ${className}`,
-      role: "dialog",
-      "aria-modal": "true",
-      onClick: (e) => e.stopPropagation(),
-      children: [
-        /* @__PURE__ */ jsxs6("div", {
-          className: "ds-dialog__header",
-          children: [
-            /* @__PURE__ */ jsxs6("div", {
-              className: "ds-dialog__heading",
-              children: [
-                /* @__PURE__ */ jsx8("h2", {
-                  className: "ds-dialog__title",
-                  children: title
-                }),
-                description && /* @__PURE__ */ jsx8("p", {
-                  className: "ds-dialog__description",
-                  children: description
-                })
-              ]
-            }),
-            onCancel && /* @__PURE__ */ jsx8(Button, {
-              variant: "ghost",
-              size: "sm",
-              icon: "X",
-              "aria-label": "Close",
-              onClick: onCancel,
-              className: "ds-dialog__close"
-            })
-          ]
-        }),
-        /* @__PURE__ */ jsxs6("form", {
-          id: formId,
-          onSubmit: (e) => {
-            e.preventDefault();
-            onSubmit?.();
-          },
-          className: "ds-dialog__form",
-          children: [
-            /* @__PURE__ */ jsx8("div", {
-              className: "ds-dialog__body",
-              children
-            }),
-            /* @__PURE__ */ jsx8("div", {
-              className: "ds-dialog__footer",
-              children: /* @__PURE__ */ jsxs6(ButtonBar, {
-                justify: "between",
-                children: [
-                  onCancel && /* @__PURE__ */ jsx8(Button, {
-                    variant: "secondary",
-                    onClick: onCancel,
-                    children: cancelLabel
-                  }),
-                  onSubmit && /* @__PURE__ */ jsx8(Button, {
-                    variant: "primary",
-                    type: "submit",
-                    children: submitLabel
-                  })
-                ]
-              })
-            })
-          ]
-        })
-      ]
-    })
-  });
-}
-function actionFormDialogTemplateV1(spec) {
-  return spec;
-}
-function alertDialogTemplateV1(spec) {
-  return {
-    open: spec.open,
-    title: spec.title,
-    description: spec.message,
-    submitLabel: spec.primaryAction?.label ?? spec.confirmLabel ?? "Confirm",
-    cancelLabel: spec.cancelLabel ?? "Cancel",
-    onSubmit: spec.primaryAction?.onClick ?? spec.onConfirm,
-    onCancel: spec.onCancel,
-    children: null
-  };
-}
-
-// src/components/ui/Input.tsx
-import * as React5 from "react";
-import { jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
-function Input({ label, required, className = "", id, ...rest }) {
-  const generatedId = React5.useId();
-  const inputId = id ?? generatedId;
-  const inputEl = /* @__PURE__ */ jsx9("input", {
-    id: inputId,
-    className: `ds-field__control ds-input ${className}`,
-    required,
-    style: {
-      width: "100%",
-      height: "32px",
-      padding: "4px 8px",
-      fontSize: "13px",
-      fontFamily: "inherit",
-      border: "1px solid var(--ds-color-border, #cbd5e1)",
-      borderRadius: "4px",
-      backgroundColor: "var(--ds-color-surface, #ffffff)",
-      color: "var(--ds-color-foreground, #0f172a)",
-      outline: "none",
-      boxSizing: "border-box"
-    },
-    ...rest
-  });
-  if (!label)
-    return inputEl;
-  return /* @__PURE__ */ jsxs7("div", {
-    className: "ds-field-wrapper binding-stack-tight",
-    style: { width: "100%" },
-    children: [
-      /* @__PURE__ */ jsxs7("label", {
-        htmlFor: inputId,
-        className: "ds-field__label",
-        style: {
-          fontSize: "12px",
-          fontWeight: 500,
-          color: "var(--ds-color-foreground, #0f172a)",
-          display: "flex",
-          alignItems: "center",
-          gap: "2px"
-        },
-        children: [
-          label,
-          required && /* @__PURE__ */ jsx9("span", {
-            style: { color: "var(--ds-color-destructive, #ef4444)" },
-            children: "*"
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsx9("div", {
-        className: "ds-field",
-        style: { width: "100%" },
-        children: inputEl
-      })
-    ]
-  });
-}
-function TextArea({ label, required, className = "", id, ...rest }) {
-  const generatedId = React5.useId();
-  const textareaId = id ?? generatedId;
-  const textEl = /* @__PURE__ */ jsx9("textarea", {
-    id: textareaId,
-    className: `ds-field__control ds-textarea ${className}`,
-    required,
-    style: {
-      width: "100%",
-      minHeight: "80px",
-      padding: "6px 8px",
-      fontSize: "13px",
-      fontFamily: "inherit",
-      border: "1px solid var(--ds-color-border, #cbd5e1)",
-      borderRadius: "4px",
-      backgroundColor: "var(--ds-color-surface, #ffffff)",
-      color: "var(--ds-color-foreground, #0f172a)",
-      outline: "none",
-      resize: "vertical",
-      boxSizing: "border-box"
-    },
-    ...rest
-  });
-  if (!label)
-    return textEl;
-  return /* @__PURE__ */ jsxs7("div", {
-    className: "ds-field-wrapper binding-stack-tight",
-    style: { width: "100%" },
-    children: [
-      /* @__PURE__ */ jsxs7("label", {
-        htmlFor: textareaId,
-        className: "ds-field__label",
-        style: {
-          fontSize: "12px",
-          fontWeight: 500,
-          color: "var(--ds-color-foreground, #0f172a)",
-          display: "flex",
-          alignItems: "center",
-          gap: "2px"
-        },
-        children: [
-          label,
-          required && /* @__PURE__ */ jsx9("span", {
-            style: { color: "var(--ds-color-destructive, #ef4444)" },
-            children: "*"
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsx9("div", {
-        className: "ds-field",
-        style: { width: "100%" },
-        children: textEl
-      })
-    ]
-  });
-}
-function Select({
-  label,
-  required,
-  value,
-  options = [],
-  onChange,
-  placeholder,
-  disabled,
-  className = "",
-  id,
-  ...rest
-}) {
-  const generatedId = React5.useId();
-  const selectId = id ?? generatedId;
-  const selectEl = /* @__PURE__ */ jsxs7("select", {
-    id: selectId,
-    className: `ds-field__control ds-select ${className}`,
-    disabled,
-    value: value ?? "",
-    onChange: (e) => onChange?.(e.target.value || null),
-    style: {
-      width: "100%",
-      height: "32px",
-      padding: "4px 8px",
-      fontSize: "13px",
-      fontFamily: "inherit",
-      border: "1px solid var(--ds-color-border, #cbd5e1)",
-      borderRadius: "4px",
-      backgroundColor: disabled ? "var(--ds-color-surface-subtle, #f8fafc)" : "var(--ds-color-surface, #ffffff)",
-      color: "var(--ds-color-foreground, #0f172a)",
-      outline: "none",
-      cursor: disabled ? "not-allowed" : "pointer",
-      boxSizing: "border-box"
-    },
-    ...rest,
-    children: [
-      placeholder && /* @__PURE__ */ jsx9("option", {
-        value: "",
-        children: placeholder
-      }),
-      options.map((opt) => /* @__PURE__ */ jsx9("option", {
-        value: opt.value,
-        children: opt.label || opt.value
-      }, opt.value))
-    ]
-  });
-  if (!label)
-    return selectEl;
-  return /* @__PURE__ */ jsxs7("div", {
-    className: "ds-field-wrapper binding-stack-tight",
-    style: { width: "100%" },
-    children: [
-      /* @__PURE__ */ jsxs7("label", {
-        htmlFor: selectId,
-        className: "ds-field__label",
-        style: {
-          fontSize: "12px",
-          fontWeight: 500,
-          color: "var(--ds-color-foreground, #0f172a)",
-          display: "flex",
-          alignItems: "center",
-          gap: "2px"
-        },
-        children: [
-          label,
-          required && /* @__PURE__ */ jsx9("span", {
-            style: { color: "var(--ds-color-destructive, #ef4444)" },
-            children: "*"
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsx9("div", {
-        className: "ds-field",
-        style: { width: "100%" },
-        children: selectEl
-      })
-    ]
-  });
-}
-function Checkbox({ label, checked = false, onChange, disabled, className = "", id, ...rest }) {
-  const generatedId = React5.useId();
-  const checkboxId = id ?? generatedId;
-  return /* @__PURE__ */ jsxs7("label", {
-    htmlFor: checkboxId,
-    className: `ds-checkbox-wrapper ${className}`,
-    style: {
-      display: "inline-flex",
-      alignItems: "center",
-      gap: "8px",
-      cursor: disabled ? "not-allowed" : "pointer",
-      fontSize: "13px",
-      color: "var(--ds-color-foreground, #0f172a)"
-    },
-    children: [
-      /* @__PURE__ */ jsx9("input", {
-        type: "checkbox",
-        id: checkboxId,
-        className: "ds-checkbox",
-        checked,
-        disabled,
-        onChange: (e) => onChange?.(e.target.checked),
-        style: {
-          width: "16px",
-          height: "16px",
-          accentColor: "var(--ds-color-primary, #0284c7)",
-          cursor: disabled ? "not-allowed" : "pointer"
-        },
-        ...rest
-      }),
-      /* @__PURE__ */ jsx9("span", {
-        children: label
-      })
-    ]
-  });
-}
-
-// src/components/WorkspaceContext.tsx
-import { jsx as jsx10 } from "react/jsx-runtime";
-var defaultComponents = {
-  AppGrid,
-  Button,
-  ButtonBar,
-  ButtonGroup,
-  Badge,
-  Banner,
-  DetailCard,
-  Select,
-  Input,
-  TextArea,
-  Checkbox,
-  Dialog,
-  createActionColumn
-};
-var WorkspaceComponentsContext = React6.createContext(defaultComponents);
-function WorkspaceComponentsProvider({
-  components,
-  children
-}) {
-  const merged = React6.useMemo(() => {
-    return {
-      AppGrid: components?.AppGrid ?? defaultComponents.AppGrid,
-      Button: components?.Button ?? defaultComponents.Button,
-      ButtonBar: components?.ButtonBar ?? defaultComponents.ButtonBar,
-      ButtonGroup: components?.ButtonGroup ?? defaultComponents.ButtonGroup,
-      Badge: components?.Badge ?? defaultComponents.Badge,
-      Banner: components?.Banner ?? defaultComponents.Banner,
-      DetailCard: components?.DetailCard ?? defaultComponents.DetailCard,
-      Select: components?.Select ?? defaultComponents.Select,
-      Input: components?.Input ?? defaultComponents.Input,
-      TextArea: components?.TextArea ?? defaultComponents.TextArea,
-      Checkbox: components?.Checkbox ?? defaultComponents.Checkbox,
-      Dialog: components?.Dialog ?? defaultComponents.Dialog,
-      createActionColumn: components?.createActionColumn ?? defaultComponents.createActionColumn
-    };
-  }, [components]);
-  return /* @__PURE__ */ jsx10(WorkspaceComponentsContext.Provider, {
-    value: merged,
-    children
-  });
-}
-function useWorkspaceComponents() {
-  return React6.useContext(WorkspaceComponentsContext);
-}
-
-// src/components/ApiMappings.tsx
-import * as React7 from "react";
-import { jsx as jsx11, jsxs as jsxs8, Fragment as Fragment3 } from "react/jsx-runtime";
-var TIMING_OPTIONS = [
-  { value: "lazy", label: "Lazy on Click" },
-  { value: "prefetch", label: "On Window Load" }
-];
-var FRESHNESS_OPTIONS = [
-  { value: "fresh", label: "Fresh on every open" },
-  { value: "reuse", label: "Reuse cached response" },
-  { value: "poll", label: "Poll on interval" }
-];
-function ApiMappings({
-  config,
-  context,
-  focus,
-  defaultTarget,
-  onChange
-}) {
-  const { Badge, Banner, Button, ButtonBar, Dialog, Input, Select } = useWorkspaceComponents();
-  const [confirm, setConfirm] = React7.useState(null);
-  const targets = contextComponents(context.snapshot);
-  const sources = [...sourceComponents(context.snapshot), FREE_TEXT_OPTION];
-  const paths = gridPaths(context);
-  const gridId = context.snapshot.grid?.id;
-  const shown = config.calls.map((call, index) => ({ call, index })).filter(({ call }) => !focus || call.component === focus || call.params.some((p) => p.source === focus));
-  const update = (id, f) => onChange((old) => ({ ...old, calls: old.calls.map((c) => c.id === id ? f(c) : c) }));
-  const ask = (c, run) => c ? setConfirm(c) : run();
-  function changeApi(call, api, method) {
-    const run = () => update(call.id, (c) => changeCallTarget(c, api, method, context));
-    const lost = droppedBy(call, api, method, context);
-    ask(lost > 0 ? {
-      title: "Change API Mapping?",
-      label: "Change API",
-      message: `${lost} mapped request ${lost === 1 ? "property is" : "properties are"} not in ${method ?? ""} ${api} and will be discarded. Mappings with the same name are kept.`,
-      run
-    } : null, run);
-  }
-  function remove(call, index) {
-    const run = () => onChange((old) => ({ ...old, calls: old.calls.filter((c) => c.id !== call.id) }));
-    ask(populated(call) ? {
-      title: "Remove API Mapping?",
-      label: "Remove",
-      message: `Call ${index + 1} (${endpointLabel(call)}) has mapped request properties that will be discarded.`,
-      run
-    } : null, run);
-  }
-  function clearAll() {
-    const ids = new Set(shown.map((s) => s.call.id));
-    const run = () => onChange((old) => ({ ...old, calls: old.calls.filter((c) => !ids.has(c.id)) }));
-    ask(shown.some((s) => populated(s.call)) ? {
-      title: "Clear API Mappings?",
-      label: "Clear Mappings",
-      message: `${ids.size} API ${ids.size === 1 ? "mapping" : "mappings"} and their request properties will be discarded.`,
-      run
-    } : null, run);
-  }
-  const add = (purpose) => onChange((old) => ({ ...old, calls: [...old.calls, newCall(purpose, defaultTarget ?? focus ?? "")] }));
-  return /* @__PURE__ */ jsxs8("div", {
-    className: "binding-stack",
-    "aria-label": "API mappings",
-    children: [
-      /* @__PURE__ */ jsxs8("div", {
-        className: "binding-section-title",
-        children: [
-          /* @__PURE__ */ jsx11("h3", {
-            children: "API mappings"
-          }),
-          /* @__PURE__ */ jsxs8(ButtonBar, {
-            children: [
-              /* @__PURE__ */ jsx11(Button, {
-                icon: "Plus",
-                onClick: () => add("read"),
-                children: "Add Read Call"
-              }),
-              /* @__PURE__ */ jsx11(Button, {
-                icon: "Plus",
-                onClick: () => add("write"),
-                children: "Add Write Call"
-              }),
-              shown.length > 0 && /* @__PURE__ */ jsx11(Button, {
-                icon: "Trash2",
-                variant: "ghost",
-                onClick: clearAll,
-                children: "Clear Mappings"
-              })
-            ]
-          })
-        ]
-      }),
-      shown.length === 0 && /* @__PURE__ */ jsxs8("p", {
-        className: "binding-muted",
-        children: [
-          "No API mappings ",
-          focus ? "for this component yet" : "yet",
-          ". Add a read or write call."
-        ]
-      }),
-      shown.map(({ call, index }) => {
-        const def = definitionFor(context, call.api, call.method);
-        const issues = callIssues(call, index, context);
-        const related = focus && call.component !== focus;
-        return /* @__PURE__ */ jsxs8("section", {
-          className: "binding-call",
-          "aria-label": `Call ${index + 1}`,
-          children: [
-            /* @__PURE__ */ jsxs8("div", {
-              className: "binding-section-title",
-              children: [
-                /* @__PURE__ */ jsxs8("div", {
-                  className: "binding-stack-tight",
-                  children: [
-                    /* @__PURE__ */ jsxs8("strong", {
-                      children: [
-                        index + 1,
-                        ". ",
-                        call.purpose === "read" ? "Read" : "Write",
-                        " ·",
-                        " ",
-                        targets.find((t) => t.value === call.component)?.label ?? (call.component || "No target")
-                      ]
-                    }),
-                    /* @__PURE__ */ jsxs8("code", {
-                      className: "binding-endpoint",
-                      children: [
-                        endpointLabel(call),
-                        def?.hook ? ` · ${def.hook}` : ""
-                      ]
-                    })
-                  ]
-                }),
-                /* @__PURE__ */ jsxs8(ButtonBar, {
-                  children: [
-                    related && /* @__PURE__ */ jsx11(Badge, {
-                      children: "Sends this field"
-                    }),
-                    def?.available === false && /* @__PURE__ */ jsx11(Badge, {
-                      variant: "danger",
-                      children: "Unavailable"
-                    }),
-                    /* @__PURE__ */ jsx11(Badge, {
-                      variant: issues.length ? "warning" : "success",
-                      children: issues.length ? `${issues.length} to resolve` : "Ready"
-                    }),
-                    /* @__PURE__ */ jsx11(Button, {
-                      icon: "ArrowUp",
-                      "aria-label": `Move Call ${index + 1} Up`,
-                      tooltip: "Move Up",
-                      disabled: index === 0,
-                      onClick: () => onChange((old) => ({ ...old, calls: moveCall(old.calls, call.id, -1) }))
-                    }),
-                    /* @__PURE__ */ jsx11(Button, {
-                      icon: "ArrowDown",
-                      "aria-label": `Move Call ${index + 1} Down`,
-                      tooltip: "Move Down",
-                      disabled: index === config.calls.length - 1,
-                      onClick: () => onChange((old) => ({ ...old, calls: moveCall(old.calls, call.id, 1) }))
-                    }),
-                    /* @__PURE__ */ jsx11(Button, {
-                      icon: "Trash2",
-                      "aria-label": `Remove Call ${index + 1}`,
-                      tooltip: "Remove",
-                      onClick: () => remove(call, index)
-                    })
-                  ]
-                })
-              ]
-            }),
-            /* @__PURE__ */ jsxs8("div", {
-              className: "binding-call-grid",
-              children: [
-                /* @__PURE__ */ jsx11(Select, {
-                  label: "Purpose",
-                  value: call.purpose,
-                  options: [
-                    { value: "read", label: "Read (load data)" },
-                    { value: "write", label: "Write (send data)" }
-                  ],
-                  onChange: (v) => update(call.id, (c) => changePurpose(c, v === "write" ? "write" : "read"))
-                }),
-                /* @__PURE__ */ jsx11(Select, {
-                  label: "Component",
-                  value: call.component || null,
-                  placeholder: "Choose a component",
-                  options: [
-                    ...targets,
-                    ...call.component && !targets.some((t) => t.value === call.component) ? [{ value: call.component, label: `${call.component} (missing)` }] : []
-                  ],
-                  onChange: (v) => update(call.id, (c) => ({ ...c, component: String(v ?? "") }))
-                }),
-                /* @__PURE__ */ jsx11(Select, {
-                  label: "API",
-                  value: call.api || null,
-                  placeholder: "Choose an API",
-                  options: [
-                    ...apisOf(context).map((api) => {
-                      const defs = context.definitions.filter((d) => d.api === api);
-                      return {
-                        value: api,
-                        label: api,
-                        description: defs.map((d) => `${d.method}${d.label ? ` ${d.label}` : ""}`).join(" · "),
-                        ...defs.every((d) => d.available === false) ? { badges: [{ label: "Unavailable", variant: "danger" }] } : {}
-                      };
-                    }),
-                    ...call.api && !apisOf(context).includes(call.api) ? [{ value: call.api, label: `${call.api} (not registered)` }] : []
-                  ],
-                  onChange: (v) => changeApi(call, String(v ?? ""))
-                }),
-                /* @__PURE__ */ jsx11(Select, {
-                  label: "Method",
-                  value: call.method || null,
-                  disabled: !call.api,
-                  placeholder: "Choose a method",
-                  options: methodsFor(context, call.api).map((m) => {
-                    const d = definitionFor(context, call.api, m);
-                    return {
-                      value: m,
-                      label: m,
-                      description: d?.label,
-                      ...d?.available === false ? { badges: [{ label: "Unavailable", variant: "danger" }] } : {}
-                    };
-                  }),
-                  onChange: (v) => changeApi(call, call.api, String(v ?? ""))
-                }),
-                call.purpose === "read" && /* @__PURE__ */ jsxs8(Fragment3, {
-                  children: [
-                    /* @__PURE__ */ jsx11(Select, {
-                      label: "Load Timing",
-                      value: call.timing || null,
-                      options: TIMING_OPTIONS,
-                      onChange: (v) => update(call.id, (c) => ({ ...c, timing: v === "prefetch" ? "prefetch" : "lazy" }))
-                    }),
-                    /* @__PURE__ */ jsx11(Select, {
-                      label: "Freshness",
-                      value: call.freshness || null,
-                      options: FRESHNESS_OPTIONS,
-                      onChange: (v) => update(call.id, (c) => ({
-                        ...c,
-                        freshness: v ?? "fresh",
-                        pollSeconds: v === "poll" ? c.pollSeconds : undefined
-                      }))
-                    }),
-                    call.freshness === "poll" && /* @__PURE__ */ jsx11(Input, {
-                      label: "Poll Every (s)",
-                      type: "number",
-                      min: 1,
-                      value: call.pollSeconds ?? "",
-                      onChange: (e) => {
-                        const n = Number(e.target.value);
-                        update(call.id, (c) => ({ ...c, pollSeconds: e.target.value === "" ? undefined : n }));
-                      }
-                    })
-                  ]
-                })
-              ]
-            }),
-            def?.available === false && /* @__PURE__ */ jsxs8(Banner, {
-              tone: "caution",
-              children: [
-                "This API is registered but cannot run: ",
-                def.problem
-              ]
-            }),
-            call.api && def && call.params.length === 0 && /* @__PURE__ */ jsx11("p", {
-              className: "binding-muted",
-              children: "This API takes no request properties."
-            }),
-            call.params.length > 0 && /* @__PURE__ */ jsxs8("div", {
-              className: "binding-params",
-              role: "table",
-              "aria-label": `Request properties for call ${index + 1}`,
-              children: [
-                /* @__PURE__ */ jsxs8("div", {
-                  className: "binding-param binding-muted",
-                  role: "row",
-                  children: [
-                    /* @__PURE__ */ jsx11("span", {
-                      role: "columnheader",
-                      children: "Request property"
-                    }),
-                    /* @__PURE__ */ jsx11("span", {
-                      role: "columnheader",
-                      children: "Source"
-                    }),
-                    /* @__PURE__ */ jsx11("span", {
-                      role: "columnheader",
-                      children: "Property / value"
-                    })
-                  ]
-                }),
-                call.params.map((p) => {
-                  const spec = def?.params.find((d) => d.name === p.param);
-                  return /* @__PURE__ */ jsxs8("div", {
-                    className: "binding-param",
-                    role: "row",
-                    children: [
-                      /* @__PURE__ */ jsxs8("div", {
-                        className: "binding-stack-tight",
-                        role: "cell",
-                        children: [
-                          /* @__PURE__ */ jsxs8("span", {
-                            children: [
-                              p.param,
-                              spec?.required ? " *" : ""
-                            ]
-                          }),
-                          /* @__PURE__ */ jsx11("span", {
-                            className: "binding-muted",
-                            children: spec ? `${spec.type} · ${spec.in ?? "body"}${spec.required ? " · required" : ""}` : "Not in contract"
-                          }),
-                          !spec && /* @__PURE__ */ jsx11(Button, {
-                            size: "sm",
-                            variant: "ghost",
-                            onClick: () => update(call.id, (c) => ({ ...c, params: c.params.filter((x) => x.param !== p.param) })),
-                            children: "Remove Property"
-                          })
-                        ]
-                      }),
-                      /* @__PURE__ */ jsx11("div", {
-                        role: "cell",
-                        children: /* @__PURE__ */ jsx11(Select, {
-                          "aria-label": `Source for ${p.param}`,
-                          value: p.source || null,
-                          placeholder: "Not sent",
-                          options: [{ value: "", label: "Not sent" }, ...sources],
-                          onChange: (v) => update(call.id, (c) => ({
-                            ...c,
-                            params: c.params.map((x) => x.param === p.param ? v ? setParamSource(x, String(v), gridId) : { ...x, source: "", property: "" } : x)
-                          }))
-                        })
-                      }),
-                      /* @__PURE__ */ jsx11("div", {
-                        role: "cell",
-                        children: p.source === FREE_TEXT_SOURCE ? /* @__PURE__ */ jsx11(Input, {
-                          "aria-label": `Fixed value for ${p.param}`,
-                          value: p.property,
-                          placeholder: spec?.type === "boolean" ? "true or false" : "Fixed value",
-                          onChange: (e) => {
-                            const value = e.target.value;
-                            update(call.id, (c) => ({
-                              ...c,
-                              params: c.params.map((x) => x.param === p.param ? { ...x, property: value } : x)
-                            }));
-                          }
-                        }) : gridId && p.source === gridId ? /* @__PURE__ */ jsx11(Select, {
-                          "aria-label": `Grid property for ${p.param}`,
-                          value: p.property || null,
-                          placeholder: "Choose a grid property",
-                          options: paths.map((path) => ({
-                            value: path,
-                            label: path.slice(gridId.length + 1),
-                            description: `First row: ${String(path.slice(gridId.length + 1).split(".").reduce((o, k) => o?.[k], context.snapshot.grid?.rows[0]) ?? "—")}`
-                          })),
-                          onChange: (v) => update(call.id, (c) => ({
-                            ...c,
-                            params: c.params.map((x) => x.param === p.param ? { ...x, property: String(v ?? "") } : x)
-                          }))
-                        }) : /* @__PURE__ */ jsx11("span", {
-                          className: "binding-muted",
-                          children: p.source ? p.property : "—"
-                        })
-                      })
-                    ]
-                  }, p.param);
-                })
-              ]
-            }),
-            issues.length > 0 && /* @__PURE__ */ jsx11("div", {
-              role: "status",
-              children: issues.map((i) => /* @__PURE__ */ jsx11("p", {
-                className: "binding-error",
-                children: i
-              }, i))
-            })
-          ]
-        }, call.id);
-      }),
-      confirm && /* @__PURE__ */ jsx11(Dialog, {
-        ...alertDialogTemplateV1({
-          open: true,
-          kind: "destructive",
-          title: confirm.title,
-          message: confirm.message,
-          onCancel: () => setConfirm(null),
-          primaryAction: {
-            label: confirm.label,
-            onClick: () => {
-              confirm.run();
-              setConfirm(null);
-            }
-          }
-        })
-      })
-    ]
-  });
-}
-
-// src/components/RequestPreview.tsx
-import { jsx as jsx12, jsxs as jsxs9 } from "react/jsx-runtime";
-var json = (o) => Object.keys(o).length ? JSON.stringify(o, null, 2) : "—";
-function RequestPreview({ title, requests }) {
-  const { Badge } = useWorkspaceComponents();
-  return /* @__PURE__ */ jsxs9("div", {
-    className: "binding-stack",
-    "aria-label": title,
-    children: [
-      /* @__PURE__ */ jsx12("h3", {
-        children: title
-      }),
-      requests.length === 0 && /* @__PURE__ */ jsx12("p", {
-        className: "binding-muted",
-        children: "No calls to preview."
-      }),
-      requests.map((r) => /* @__PURE__ */ jsxs9("div", {
-        className: "binding-call",
-        children: [
-          /* @__PURE__ */ jsxs9("div", {
-            className: "binding-section-title",
-            children: [
-              /* @__PURE__ */ jsxs9("strong", {
-                children: [
-                  r.order,
-                  ". ",
-                  r.purpose === "read" ? "Read" : "Write",
-                  " · ",
-                  r.target
-                ]
-              }),
-              /* @__PURE__ */ jsx12(Badge, {
-                variant: !r.available ? "danger" : r.issues.length ? "warning" : "neutral",
-                children: !r.available ? "Unavailable" : r.issues.length ? "Incomplete" : "Simulated only"
-              })
-            ]
-          }),
-          /* @__PURE__ */ jsxs9("code", {
-            className: "binding-endpoint",
-            children: [
-              r.method,
-              " ",
-              r.api || "No API",
-              r.hook ? ` · ${r.hook}` : ""
-            ]
-          }),
-          /* @__PURE__ */ jsxs9("div", {
-            className: "binding-preview-parts",
-            children: [
-              /* @__PURE__ */ jsxs9("div", {
-                children: [
-                  /* @__PURE__ */ jsx12("span", {
-                    className: "binding-muted",
-                    children: "Body"
-                  }),
-                  /* @__PURE__ */ jsx12("pre", {
-                    className: "binding-pre",
-                    children: json(r.parts.data)
-                  })
-                ]
-              }),
-              /* @__PURE__ */ jsxs9("div", {
-                children: [
-                  /* @__PURE__ */ jsx12("span", {
-                    className: "binding-muted",
-                    children: "Query"
-                  }),
-                  /* @__PURE__ */ jsx12("pre", {
-                    className: "binding-pre",
-                    children: json(r.parts.params)
-                  })
-                ]
-              }),
-              /* @__PURE__ */ jsxs9("div", {
-                children: [
-                  /* @__PURE__ */ jsx12("span", {
-                    className: "binding-muted",
-                    children: "Path"
-                  }),
-                  /* @__PURE__ */ jsx12("pre", {
-                    className: "binding-pre",
-                    children: json(r.parts.path)
-                  })
-                ]
-              })
-            ]
-          })
-        ]
-      }, r.id))
-    ]
-  });
-}
-
-// src/components/SimulationDialog.tsx
-import * as React8 from "react";
-import { jsx as jsx13, jsxs as jsxs10, Fragment as Fragment4 } from "react/jsx-runtime";
-function SimulationDialog({
-  config,
-  context,
-  onClose,
-  onVerified
-}) {
-  const {
-    Banner,
-    Button,
-    ButtonBar,
-    ButtonGroup,
-    DetailCard,
-    Dialog,
-    Checkbox,
-    Input,
-    Select,
-    TextArea
-  } = useWorkspaceComponents();
-  const [input, setInput] = React8.useState(() => {
-    const initial = {
-      notesType: "",
-      template: "",
-      subject: "",
-      notes: "",
-      addCallLog: false
-    };
-    for (const comp of context.snapshot.components) {
-      if (comp.kind === "checkbox") {
-        initial[comp.name] = comp.value === "true";
-      } else {
-        initial[comp.name] = comp.value ?? "";
-      }
-    }
-    return initial;
-  });
-  const [scope, setScope] = React8.useState("one");
-  const [failure, setFailure] = React8.useState(false);
-  const [errors, setErrors] = React8.useState([]);
-  const [saved, setSaved] = React8.useState([]);
-  const [retrieved, setRetrieved] = React8.useState([]);
-  const [message, setMessage] = React8.useState("");
-  const callLog = config.fields.find((c) => c.name === "addCallLog");
-  const source = context.snapshot.grid?.rows ?? [];
-  const example = source[0] ?? {};
-  const rows = scope === "none" ? [] : scope === "one" ? [source[0] ?? example] : source.length > 1 ? source.slice(0, 2) : [example, { ...example, customerName: "Example customer" }];
-  const nameOf = (r) => String(r.customerName ?? r.customerNumber ?? r.id ?? "Example customer");
-  const gaps = simulatorGaps(config, context);
-  const requests = previewRequests(config, context, actionContext(context, simulationForm(input), rows), (c) => c.purpose === "write" && c.component === SUBMIT);
-  function setField(key, value) {
-    setInput((prev) => ({ ...prev, [key]: value }));
-    setErrors([]);
-  }
-  function chooseTemplate(value) {
-    const template = context.options.template?.find((o) => o.value === value);
-    const fromTemplate = (name) => config.templateFills && config.fields.find((c) => c.name === name)?.input === "template";
-    setInput((prev) => ({
-      ...prev,
-      template: value ?? "",
-      ...template && fromTemplate("subject") ? { subject: template.subject ?? "" } : {},
-      ...template && fromTemplate("notes") ? { notes: template.description ?? "" } : {}
-    }));
-  }
-  function submit() {
-    const result = simulateSave(config, context, input, rows, failure);
-    setErrors(result.errors);
-    if (result.errors.length) {
-      setMessage("");
-      return;
-    }
-    setSaved(result.notes);
-    setRetrieved([]);
-    setMessage(config.success === "close" ? "Simulated popup closed after save. Retrieve the saved note to finish the test." : "Saved. The simulated popup stays open. Retrieve the note to finish the test.");
-  }
-  const isNotesContract = context.snapshot.source === "Add Notes" || config.fields.some((f) => f.name === "notesType");
-  return /* @__PURE__ */ jsx13(Dialog, {
-    ...actionFormDialogTemplateV1({
-      open: true,
-      title: `Try ${context.snapshot.source || "Add Notes"}`,
-      description: "Simulation — sample data only.",
-      size: "large",
-      formId: "binding-simulation",
-      submitLabel: "Submit",
-      cancelLabel: "Cancel",
-      onCancel: onClose,
-      onSubmit: submit,
-      children: /* @__PURE__ */ jsxs10("div", {
-        className: "binding-simulation",
-        onInvalidCapture: (event) => {
-          event.preventDefault();
-          setErrors([...simulationErrors(config, input, rows.length), ...gaps]);
-        },
-        children: [
-          /* @__PURE__ */ jsxs10("div", {
-            className: "binding-stack",
-            children: [
-              /* @__PURE__ */ jsxs10("p", {
-                children: [
-                  "Selected customers: ",
-                  rows.length ? rows.map(nameOf).join(", ") : "None"
-                ]
-              }),
-              /* @__PURE__ */ jsx13(ButtonGroup, {
-                "aria-label": "Selected customers",
-                value: scope,
-                onChange: setScope,
-                options: [
-                  { value: "one", label: "One Customer" },
-                  { value: "multiple", label: "Multiple Customers" },
-                  { value: "none", label: "No Customers" }
-                ]
-              }),
-              /* @__PURE__ */ jsx13(Checkbox, {
-                label: "Simulate a failed save",
-                checked: failure,
-                onChange: setFailure
-              })
-            ]
-          }),
-          errors.length > 0 && /* @__PURE__ */ jsx13(Banner, {
-            tone: "caution",
-            children: /* @__PURE__ */ jsx13("div", {
-              role: "alert",
-              children: errors.map((error) => /* @__PURE__ */ jsx13("p", {
-                children: error
-              }, error))
-            })
-          }),
-          isNotesContract ? /* @__PURE__ */ jsxs10(Fragment4, {
-            children: [
-              /* @__PURE__ */ jsx13(Select, {
-                label: "Notes Type",
-                required: true,
-                value: input.notesType || null,
-                onChange: (value) => setField("notesType", String(value ?? "")),
-                options: context.options.notesType ?? []
-              }),
-              /* @__PURE__ */ jsx13(Select, {
-                label: "Template",
-                value: input.template || null,
-                onChange: (value) => chooseTemplate(value),
-                options: context.options.template ?? []
-              }),
-              /* @__PURE__ */ jsx13(Input, {
-                label: "Subject",
-                required: true,
-                value: input.subject,
-                onChange: (event) => setField("subject", event.target.value)
-              }),
-              /* @__PURE__ */ jsx13(TextArea, {
-                label: "Description",
-                required: true,
-                value: input.notes,
-                onChange: (event) => setField("notes", event.target.value)
-              }),
-              callLog && !callLog.excluded && /* @__PURE__ */ jsx13(Checkbox, {
-                label: "Add Call Log",
-                checked: input.addCallLog,
-                onChange: (value) => setField("addCallLog", value)
-              }),
-              context.options.notesType?.length || context.options.template?.length ? /* @__PURE__ */ jsx13("p", {
-                className: "binding-muted",
-                children: "Notes Type and Template choices are samples captured from the open window, not responses fetched by this test."
-              }) : null
-            ]
-          }) : config.fields.filter((f) => !f.excluded).map((f) => {
-            const comp = context.snapshot.components.find((c) => c.name === f.name);
-            const fieldKind = comp?.kind ?? (comp?.type === "select" || comp?.type === "combobox" ? "dropdown" : comp?.type === "textarea" ? "text-area" : comp?.type === "checkbox" ? "checkbox" : "text");
-            const opts = context.options[f.name] ?? [];
-            if (fieldKind === "dropdown" || opts.length > 0) {
-              return /* @__PURE__ */ jsx13(Select, {
-                label: f.label,
-                required: f.required,
-                value: String(input[f.name] ?? "") || null,
-                onChange: (val) => setField(f.name, String(val ?? "")),
-                options: opts
-              }, f.name);
-            }
-            if (fieldKind === "text-area") {
-              return /* @__PURE__ */ jsx13(TextArea, {
-                label: f.label,
-                required: f.required,
-                value: String(input[f.name] ?? ""),
-                onChange: (event) => setField(f.name, event.target.value)
-              }, f.name);
-            }
-            if (fieldKind === "checkbox") {
-              return /* @__PURE__ */ jsx13(Checkbox, {
-                label: f.label,
-                checked: Boolean(input[f.name]),
-                onChange: (val) => setField(f.name, val)
-              }, f.name);
-            }
-            return /* @__PURE__ */ jsx13(Input, {
-              label: f.label,
-              required: f.required,
-              value: String(input[f.name] ?? ""),
-              onChange: (event) => setField(f.name, event.target.value)
-            }, f.name);
-          }),
-          gaps.length > 0 && /* @__PURE__ */ jsx13(Banner, {
-            tone: "caution",
-            children: /* @__PURE__ */ jsx13("div", {
-              children: gaps.map((g) => /* @__PURE__ */ jsx13("p", {
-                children: g
-              }, g))
-            })
-          }),
-          /* @__PURE__ */ jsx13(RequestPreview, {
-            title: "Request preview (sample values)",
-            requests
-          }),
-          message && /* @__PURE__ */ jsx13(Banner, {
-            tone: "resolved",
-            children: /* @__PURE__ */ jsx13("p", {
-              role: "status",
-              children: message
-            })
-          }),
-          saved.length > 0 && /* @__PURE__ */ jsx13(ButtonBar, {
-            children: /* @__PURE__ */ jsx13(Button, {
-              icon: "Search",
-              onClick: () => {
-                const readback = JSON.parse(JSON.stringify(saved));
-                setRetrieved(readback);
-                if (readback.length === saved.length && readback.every((note) => note.subject && note.description)) {
-                  onVerified(fingerprint(config));
-                }
-              },
-              children: "Retrieve Saved Note"
-            })
-          }),
-          retrieved.map((note, i) => /* @__PURE__ */ jsx13(DetailCard, {
-            title: `Retrieved note ${i + 1} (${note.customerName || note.customerNumber || "Customer"})`,
-            dense: true,
-            fields: [
-              { label: "Notes Type", value: String(note.notesType ?? "") },
-              { label: "Subject", value: String(note.subject ?? "") },
-              { label: "Description", value: String(note.description ?? "") }
-            ]
-          }, i))
-        ]
-      })
-    })
-  });
-}
-
-// src/components/ApiBindingWorkspace.tsx
-import { jsx as jsx14, jsxs as jsxs11, Fragment as Fragment6 } from "react/jsx-runtime";
-function loadDraft(key) {
-  try {
-    const raw = localStorage.getItem(draftKey(key)) || localStorage.getItem(`api-binding-v2:draft:${key}`) || localStorage.getItem(`api-binding:draft:${key}`);
-    return raw ? JSON.parse(raw) : null;
-  } catch {
-    return null;
-  }
-}
-function ApiBindingWorkspace({
-  pageKey,
-  initialContext,
-  components
-}) {
-  return /* @__PURE__ */ jsx14(WorkspaceComponentsProvider, {
-    components,
-    children: /* @__PURE__ */ jsx14(ApiBindingWorkspaceInner, {
-      pageKey,
-      initialContext
-    })
-  });
-}
-function ApiBindingWorkspaceInner({
-  pageKey,
-  initialContext
-}) {
-  const {
-    AppGrid,
-    Button,
-    ButtonBar,
-    Badge,
-    Banner,
-    Select,
-    Input,
-    TextArea,
-    Checkbox,
-    DetailCard,
-    createActionColumn
-  } = useWorkspaceComponents();
-  const [context, setContext] = React9.useState(initialContext ?? null);
-  const [config, setConfig] = React9.useState(null);
-  const [verified, setVerified] = React9.useState(null);
-  const [editing, setEditing] = React9.useState(null);
-  const [simulation, setSimulation] = React9.useState(false);
-  const [applied, setApplied] = React9.useState(false);
-  const [showCustomers, setShowCustomers] = React9.useState(false);
-  const [storageError, setStorageError] = React9.useState("");
-  const loaded = React9.useRef(false);
-  React9.useEffect(() => {
-    loaded.current = false;
-    function receive(raw) {
-      if (!validBindingContext(raw, pageKey))
-        return;
-      try {
-        storeBindingContext(raw);
-      } catch {
-        setStorageError("Browser storage is unavailable. Changes cannot be kept after refresh.");
-      }
-      const value = raw;
-      setContext(value);
-      if (!loaded.current) {
-        const draft = loadDraft(pageKey);
-        const initial = draft && migrateConfig(draft.config, value) || proposeConfig(value);
-        setConfig(initial);
-        setVerified(draft?.version === CONFIG_VERSION && draft.verified === fingerprint(initial) ? draft.verified : null);
-        try {
-          const stored = localStorage.getItem(appliedKey(pageKey)) || localStorage.getItem(`api-binding:applied:${pageKey}`) || localStorage.getItem(`api-binding-v2:applied:${pageKey}`);
-          const appliedConfig = stored ? migrateConfig(JSON.parse(stored).config, value) : null;
-          setApplied(!!appliedConfig && fingerprint(appliedConfig) === fingerprint(initial));
-        } catch {
-          setApplied(false);
-        }
-        loaded.current = true;
-      } else {
-        setConfig((previous) => previous ? reconcileConfig(previous, value) : proposeConfig(value));
-      }
-    }
-    const local = readBindingContext(pageKey);
-    if (local)
-      receive(local);
-    else if (initialContext && validBindingContext(initialContext, pageKey))
-      receive(initialContext);
-    const onMessage = (event) => {
-      if (event.origin === window.location.origin && (event.data?.type === BINDING_CONTEXT || event.data?.type === "api-binding-v2-context")) {
-        receive(event.data.context);
-      }
-    };
-    const onStorage = (event) => {
-      if (event.key === contextKey(pageKey) || event.key === `api-binding:context:${pageKey}` || event.key === `api-binding-v2:context:${pageKey}`) {
-        receive(readBindingContext(pageKey));
-      }
-    };
-    window.addEventListener("message", onMessage);
-    window.addEventListener("storage", onStorage);
-    let channel;
-    try {
-      channel = new BroadcastChannel(BINDING_CHANNEL);
-      channel.onmessage = (event) => {
-        if (event.data?.key === pageKey) {
-          if (event.data?.type === BINDING_SELECTION_UPDATE && event.data?.grid) {
-            setContext((prev) => prev ? {
-              ...prev,
-              snapshot: {
-                ...prev.snapshot,
-                grid: {
-                  id: event.data.grid.id,
-                  label: prev.snapshot.grid?.label,
-                  columns: prev.snapshot.grid?.columns ?? [],
-                  rows: event.data.grid.rows
-                }
-              }
-            } : prev);
-          } else {
-            receive(readBindingContext(pageKey));
-          }
-        }
-      };
-    } catch {}
-    try {
-      window.opener?.postMessage({ type: BINDING_READY, key: pageKey }, window.location.origin);
-      window.opener?.postMessage({ type: "api-binding-v2-ready", key: pageKey }, window.location.origin);
-    } catch {}
-    return () => {
-      window.removeEventListener("message", onMessage);
-      window.removeEventListener("storage", onStorage);
-      channel?.close();
-    };
-  }, [pageKey, initialContext]);
-  React9.useEffect(() => {
-    if (!config)
-      return;
-    try {
-      const payload = JSON.stringify({ version: CONFIG_VERSION, config, verified });
-      localStorage.setItem(draftKey(pageKey), payload);
-    } catch {
-      setStorageError("Browser storage is unavailable. Your changes have not been saved.");
-    }
-  }, [config, verified, pageKey]);
-  function change(updater) {
-    setConfig((old) => {
-      if (!old)
-        return old;
-      const next = updater(old);
-      if (fingerprint(next) !== fingerprint(old)) {
-        setVerified(null);
-        setApplied(false);
-      }
-      return next;
-    });
-  }
-  function updateField(name, patch) {
-    change((old) => ({
-      ...old,
-      fields: old.fields.map((c) => c.name === name ? { ...c, ...patch } : c)
-    }));
-  }
-  if (!context || !config) {
-    return /* @__PURE__ */ jsx14("main", {
-      className: "binding-workspace",
-      children: /* @__PURE__ */ jsxs11("div", {
-        className: "binding-empty",
-        children: [
-          /* @__PURE__ */ jsxs11("h1", {
-            children: [
-              "Bind ",
-              pageKey.includes("worklist-add-notes") ? "Add Notes" : "Add Notes"
-            ]
-          }),
-          /* @__PURE__ */ jsx14("p", {
-            children: "Open Add Notes and choose Bind API to bring its fields and selected customers here."
-          })
-        ]
-      })
-    });
-  }
-  const issues = issuesFor(config, context);
-  const gaps = simulatorGaps(config, context);
-  const grid = context.snapshot.grid;
-  const submitCalls = config.calls.filter((c) => c.purpose === "write" && c.component === SUBMIT);
-  const customerParams = submitCalls.filter((c) => isNoteContract(definitionFor(context, c.api, c.method))).flatMap((c) => c.params.filter((p) => p.param === CUSTOMER_PARAM && grid && p.source === grid.id).map((p) => ({ call: c, param: p })));
-  const cancelCalls = config.calls.filter((c) => c.component === CANCEL);
-  const customerOptions = gridPaths(context).map((path) => {
-    const key = path.slice((grid?.id.length ?? 0) + 1);
-    return {
-      value: path,
-      label: key,
-      description: `First selected customer: ${String(key.split(".").reduce((o, k) => o?.[k], grid?.rows[0]) ?? "—")}`
-    };
-  });
-  const selectedField = config.fields.find((c) => c.name === editing);
-  const fieldIssues = (name, label) => issues.filter((i) => i.includes(label) || config.calls.some((c, idx) => (c.component === name || c.params.some((p) => p.source === name)) && i.startsWith(`Call ${idx + 1} `)));
-  const rows = config.fields.map((field) => {
-    const s = fieldSummary(config, context, field.name);
-    return {
-      id: field.name,
-      label: field.label,
-      from: s.from,
-      to: s.to,
-      action: fieldIssues(field.name, field.label).length ? "Resolve" : "Change"
-    };
-  });
-  const columns = [
-    { field: "label", headerName: "Popup field" },
-    { field: "from", headerName: "Gets its value from", fill: true },
-    { field: "to", headerName: "Saves to / Used for", fill: true },
-    createActionColumn({
-      headerName: "Change or Resolve",
-      labelField: "action",
-      icon: "Pencil",
-      onClick: (row) => setEditing(row.id)
-    })
-  ];
-  const callRows = config.calls.map((c, i) => ({
-    id: c.id,
-    order: i + 1,
-    purpose: c.purpose === "read" ? "Read" : "Write",
-    target: componentLabel(context, c.component),
-    endpoint: endpointLabel(c),
-    mapped: `${c.params.filter((p) => p.source).length} of ${c.params.length}`,
-    status: issues.some((x) => x.startsWith(`Call ${i + 1} `)) ? "Needs attention" : "Ready"
-  }));
-  const callColumns = [
-    { field: "order", headerName: "Order", type: "number" },
-    { field: "purpose", headerName: "Purpose" },
-    { field: "target", headerName: "Component" },
-    { field: "endpoint", headerName: "Endpoint", fill: true },
-    { field: "mapped", headerName: "Mapped" },
-    {
-      field: "status",
-      headerName: "Status",
-      type: "badge",
-      badgeVariants: { Ready: "success", "Needs attention": "warning" }
-    }
-  ];
-  const customerNames = grid?.rows.map((row) => String(row.customerName ?? row.customerNumber ?? row.id ?? "Selected customer")) ?? [];
-  const field = (name) => config.fields.find((c) => c.name === name);
-  const callLog = field("addCallLog");
-  const inputValue = (name) => context.snapshot.components.find((c) => c.name === name)?.value ?? "";
-  const previewTemplate = context.options.template?.find((option) => option.value === inputValue("template")) ?? context.options.template?.[0];
-  const previewValue = (name) => inputValue(name) || (config.templateFills && field(name)?.input === "template" ? (name === "subject" ? previewTemplate?.subject : previewTemplate?.description) ?? "" : "");
-  const liveCtx = actionContext(context, snapshotForm(context));
-  const panelTitle = editing === "customers" ? "Customer context" : editing === "actions" ? "Submit behavior" : editing === "mappings" ? "Manage API mappings" : selectedField?.label;
-  const focus = editing === "actions" ? SUBMIT : selectedField ? selectedField.name : undefined;
-  return /* @__PURE__ */ jsxs11("main", {
-    className: "binding-workspace",
-    children: [
-      /* @__PURE__ */ jsxs11("header", {
-        className: "binding-header",
-        children: [
-          /* @__PURE__ */ jsxs11("div", {
-            className: "binding-stack",
-            children: [
-              /* @__PURE__ */ jsxs11("h1", {
-                children: [
-                  "Bind ",
-                  context.snapshot.source || "Add Notes"
-                ]
-              }),
-              /* @__PURE__ */ jsx14("p", {
-                className: "binding-muted",
-                children: "Review how this popup loads and saves information."
-              })
-            ]
-          }),
-          /* @__PURE__ */ jsx14(Badge, {
-            variant: issues.length ? "warning" : "success",
-            children: issues.length ? `${issues.length} connections to resolve` : "Connections ready"
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsxs11("div", {
-        className: "binding-body",
-        children: [
-          /* @__PURE__ */ jsxs11("div", {
-            className: "binding-columns",
-            children: [
-              /* @__PURE__ */ jsxs11("div", {
-                className: "binding-main",
-                children: [
-                  /* @__PURE__ */ jsx14("section", {
-                    className: "binding-section",
-                    "aria-label": "Customer context",
-                    children: /* @__PURE__ */ jsx14(DetailCard, {
-                      title: "Customer context",
-                      dense: true,
-                      actions: grid ? /* @__PURE__ */ jsx14(Button, {
-                        icon: "Pencil",
-                        onClick: () => setEditing("customers"),
-                        children: "Edit"
-                      }) : undefined,
-                      fields: [
-                        {
-                          label: "Customer source",
-                          value: grid ? `${grid.label || grid.id} · selected rows` : "No source grid connected"
-                        },
-                        {
-                          label: "Save behavior",
-                          value: config.customerRule === "each" ? "One note per selected customer" : "Require exactly one customer"
-                        },
-                        {
-                          label: "Customer identifier",
-                          value: customerParams.length ? customerParams.map((x) => `${x.param.property || "not chosen"} → ${x.param.param}`).join("; ") : "No Submit request property uses the selection"
-                        },
-                        {
-                          label: "Current selection",
-                          value: customerNames.length === 0 ? "No customers selected in the worklist" : customerNames.length === 1 ? customerNames[0] : /* @__PURE__ */ jsxs11("div", {
-                            className: "binding-stack-tight",
-                            children: [
-                              /* @__PURE__ */ jsxs11("span", {
-                                children: [
-                                  customerNames.length,
-                                  " customers selected"
-                                ]
-                              }),
-                              /* @__PURE__ */ jsx14(Button, {
-                                variant: "ghost",
-                                size: "sm",
-                                "aria-expanded": showCustomers,
-                                onClick: () => setShowCustomers((v) => !v),
-                                children: showCustomers ? "Hide Customers" : "Show Customers"
-                              }),
-                              showCustomers && /* @__PURE__ */ jsx14("ul", {
-                                className: "binding-list",
-                                children: customerNames.map((name, i) => /* @__PURE__ */ jsx14("li", {
-                                  children: name
-                                }, `${name}-${i}`))
-                              })
-                            ]
-                          })
-                        }
-                      ]
-                    })
-                  }),
-                  /* @__PURE__ */ jsxs11("section", {
-                    className: "binding-section",
-                    "aria-labelledby": "fields-heading",
-                    children: [
-                      /* @__PURE__ */ jsx14("h2", {
-                        id: "fields-heading",
-                        children: "Field connections"
-                      }),
-                      /* @__PURE__ */ jsx14(AppGrid, {
-                        rows,
-                        getRowKey: (row) => row.id,
-                        columns,
-                        filtering: false,
-                        height: "auto"
-                      })
-                    ]
-                  }),
-                  /* @__PURE__ */ jsxs11("section", {
-                    className: "binding-section",
-                    "aria-labelledby": "actions-heading",
-                    children: [
-                      /* @__PURE__ */ jsx14("h2", {
-                        id: "actions-heading",
-                        children: "Action behavior"
-                      }),
-                      /* @__PURE__ */ jsx14(DetailCard, {
-                        title: "Submit",
-                        dense: true,
-                        actions: /* @__PURE__ */ jsx14(Button, {
-                          icon: "Pencil",
-                          onClick: () => setEditing("actions"),
-                          children: "Edit"
-                        }),
-                        fields: [
-                          { label: "Before saving", value: "Validate required fields" },
-                          {
-                            label: "Save operation",
-                            value: submitCalls.length ? submitCalls.map((c) => `${endpointLabel(c)} (${config.customerRule === "each" ? "one note per selected customer" : "one customer"})`).join(" then ") : "Save connection missing"
-                          },
-                          { label: "On success", value: config.success === "close" ? "Close popup" : "Keep popup open" },
-                          { label: "On failure", value: "Keep popup open, preserve entered values, allow retry" }
-                        ]
-                      }),
-                      cancelCalls.length ? /* @__PURE__ */ jsx14(DetailCard, {
-                        title: "Cancel",
-                        subtitle: "Configured API mappings",
-                        dense: true,
-                        fields: [
-                          {
-                            label: "API calls",
-                            value: cancelCalls.map((c) => `${c.purpose === "read" ? "Read" : "Write"} ${endpointLabel(c)}`).join(" then ")
-                          },
-                          { label: "Then", value: "Close popup" }
-                        ]
-                      }) : /* @__PURE__ */ jsx14(DetailCard, {
-                        title: "Cancel",
-                        subtitle: "Fixed behavior",
-                        dense: true,
-                        fields: [{ label: "Behavior", value: "Close without saving" }]
-                      })
-                    ]
-                  }),
-                  /* @__PURE__ */ jsxs11("section", {
-                    className: "binding-section",
-                    "aria-labelledby": "calls-heading",
-                    children: [
-                      /* @__PURE__ */ jsxs11("div", {
-                        className: "binding-section-title",
-                        children: [
-                          /* @__PURE__ */ jsx14("h2", {
-                            id: "calls-heading",
-                            children: "API mappings"
-                          }),
-                          /* @__PURE__ */ jsx14(Button, {
-                            icon: "Settings",
-                            onClick: () => setEditing("mappings"),
-                            children: "Manage API Mappings"
-                          })
-                        ]
-                      }),
-                      callRows.length ? /* @__PURE__ */ jsx14(AppGrid, {
-                        rows: callRows,
-                        getRowKey: (r) => r.id,
-                        columns: callColumns,
-                        filtering: false,
-                        height: "auto"
-                      }) : /* @__PURE__ */ jsx14("p", {
-                        className: "binding-muted",
-                        children: "No API mappings yet."
-                      })
-                    ]
-                  }),
-                  issues.length > 0 && /* @__PURE__ */ jsx14(Banner, {
-                    tone: "caution",
-                    children: /* @__PURE__ */ jsx14("div", {
-                      children: issues.map((issue) => /* @__PURE__ */ jsx14("p", {
-                        children: issue
-                      }, issue))
-                    })
-                  }),
-                  storageError && /* @__PURE__ */ jsx14(Banner, {
-                    tone: "caution",
-                    children: storageError
-                  })
-                ]
-              }),
-              /* @__PURE__ */ jsxs11("aside", {
-                className: "binding-preview",
-                "aria-label": `Read-only ${context.snapshot.source || "Add Notes"} preview`,
-                children: [
-                  /* @__PURE__ */ jsxs11("div", {
-                    className: "binding-section-title",
-                    children: [
-                      /* @__PURE__ */ jsx14("h2", {
-                        children: context.snapshot.source || "Add Notes"
-                      }),
-                      /* @__PURE__ */ jsx14(Badge, {
-                        children: "Read-only preview"
-                      })
-                    ]
-                  }),
-                  /* @__PURE__ */ jsx14("p", {
-                    className: "binding-muted",
-                    children: config.customerRule === "each" ? "One note per selected customer" : "Exactly one customer"
-                  }),
-                  context.snapshot.source === "Add Notes" || config.fields.some((f) => f.name === "notesType") ? /* @__PURE__ */ jsxs11(Fragment6, {
-                    children: [
-                      /* @__PURE__ */ jsx14(Select, {
-                        label: "Notes Type",
-                        required: true,
-                        disabled: true,
-                        value: inputValue("notesType") || context.options.notesType?.[0]?.value || null,
-                        options: context.options.notesType ?? []
-                      }),
-                      /* @__PURE__ */ jsx14(Select, {
-                        label: "Template",
-                        disabled: true,
-                        value: config.templateFills ? previewTemplate?.value ?? null : null,
-                        options: context.options.template ?? []
-                      }),
-                      /* @__PURE__ */ jsx14(Input, {
-                        label: "Subject",
-                        required: true,
-                        readOnly: true,
-                        value: previewValue("subject")
-                      }),
-                      /* @__PURE__ */ jsx14(TextArea, {
-                        label: "Description",
-                        required: true,
-                        readOnly: true,
-                        value: previewValue("notes")
-                      }),
-                      /* @__PURE__ */ jsx14("p", {
-                        className: "binding-muted",
-                        children: "Preview uses your entered values or sample template content."
-                      }),
-                      callLog && !callLog.excluded && /* @__PURE__ */ jsxs11(Fragment6, {
-                        children: [
-                          /* @__PURE__ */ jsx14(Checkbox, {
-                            label: "Add Call Log",
-                            disabled: true,
-                            checked: false
-                          }),
-                          issues.some((i) => i.startsWith(callLog.label)) && /* @__PURE__ */ jsx14(Badge, {
-                            variant: "warning",
-                            children: "Connection unresolved"
-                          })
-                        ]
-                      }),
-                      /* @__PURE__ */ jsxs11(ButtonBar, {
-                        justify: "between",
-                        children: [
-                          /* @__PURE__ */ jsx14(Button, {
-                            disabled: true,
-                            children: "Cancel"
-                          }),
-                          /* @__PURE__ */ jsx14(Button, {
-                            variant: "primary",
-                            disabled: true,
-                            children: "Submit"
-                          })
-                        ]
-                      })
-                    ]
-                  }) : /* @__PURE__ */ jsxs11(Fragment6, {
-                    children: [
-                      config.fields.filter((f) => !f.excluded).map((f) => {
-                        const comp = context.snapshot.components.find((c) => c.name === f.name);
-                        const fieldKind = comp?.kind ?? (comp?.type === "select" || comp?.type === "combobox" ? "dropdown" : comp?.type === "textarea" ? "text-area" : comp?.type === "checkbox" ? "checkbox" : "text");
-                        const opts = context.options[f.name] ?? [];
-                        if (fieldKind === "dropdown" || opts.length > 0) {
-                          return /* @__PURE__ */ jsx14(Select, {
-                            label: f.label,
-                            required: f.required,
-                            disabled: true,
-                            value: inputValue(f.name) || opts[0]?.value || null,
-                            options: opts
-                          }, f.name);
-                        }
-                        if (fieldKind === "text-area") {
-                          return /* @__PURE__ */ jsx14(TextArea, {
-                            label: f.label,
-                            required: f.required,
-                            readOnly: true,
-                            value: previewValue(f.name)
-                          }, f.name);
-                        }
-                        if (fieldKind === "checkbox") {
-                          return /* @__PURE__ */ jsxs11(React9.Fragment, {
-                            children: [
-                              /* @__PURE__ */ jsx14(Checkbox, {
-                                label: f.label,
-                                disabled: true,
-                                checked: comp?.value === "true"
-                              }),
-                              issues.some((i) => i.startsWith(f.label)) && /* @__PURE__ */ jsx14(Badge, {
-                                variant: "warning",
-                                children: "Connection unresolved"
-                              })
-                            ]
-                          }, f.name);
-                        }
-                        return /* @__PURE__ */ jsx14(Input, {
-                          label: f.label,
-                          required: f.required,
-                          readOnly: true,
-                          value: previewValue(f.name)
-                        }, f.name);
-                      }),
-                      /* @__PURE__ */ jsx14("p", {
-                        className: "binding-muted",
-                        children: "Preview uses your entered values or sample data."
-                      }),
-                      /* @__PURE__ */ jsx14(ButtonBar, {
-                        justify: "between",
-                        children: (context.snapshot.buttons && context.snapshot.buttons.length > 0 ? context.snapshot.buttons : ["Cancel", "Submit"]).map((btnText, idx) => /* @__PURE__ */ jsx14(Button, {
-                          variant: idx === (context.snapshot.buttons?.length ?? 2) - 1 ? "primary" : "secondary",
-                          disabled: true,
-                          children: btnText
-                        }, btnText))
-                      })
-                    ]
-                  }),
-                  /* @__PURE__ */ jsxs11("p", {
-                    className: "binding-muted",
-                    children: [
-                      "After save: ",
-                      config.success === "close" ? "close popup" : "keep popup open",
-                      "."
-                    ]
-                  })
-                ]
-              })
-            ]
-          }),
-          editing && /* @__PURE__ */ jsxs11("aside", {
-            className: `binding-panel${editing !== "customers" ? " binding-panel-wide" : ""}`,
-            "aria-label": "Edit connection",
-            children: [
-              /* @__PURE__ */ jsxs11("div", {
-                className: "binding-section-title",
-                children: [
-                  /* @__PURE__ */ jsx14("h2", {
-                    children: panelTitle
-                  }),
-                  /* @__PURE__ */ jsx14(Button, {
-                    icon: "X",
-                    tooltip: "Close Panel",
-                    "aria-label": "Close Panel",
-                    onClick: () => setEditing(null)
-                  })
-                ]
-              }),
-              editing === "customers" && /* @__PURE__ */ jsxs11(Fragment6, {
-                children: [
-                  /* @__PURE__ */ jsx14(Select, {
-                    label: "Selection rule",
-                    value: config.customerRule,
-                    options: [
-                      { value: "each", label: "One note per selected customer" },
-                      { value: "single", label: "Require exactly one customer" }
-                    ],
-                    onChange: (value) => change((old) => ({ ...old, customerRule: value === "single" ? "single" : "each" }))
-                  }),
-                  customerParams.length > 0 && grid ? customerParams.map(({ call, param }) => /* @__PURE__ */ jsx14(Select, {
-                    label: customerParams.length > 1 ? `Customer identifier · ${endpointLabel(call)} (call ${config.calls.indexOf(call) + 1})` : "Customer identifier",
-                    value: param.property || null,
-                    options: customerOptions,
-                    onChange: (value) => change((old) => ({
-                      ...old,
-                      calls: old.calls.map((c) => c.id === call.id ? {
-                        ...c,
-                        params: c.params.map((p) => p.param === CUSTOMER_PARAM && p.source === grid.id ? { ...p, property: String(value ?? "") } : p)
-                      } : c)
-                    }))
-                  }, call.id)) : /* @__PURE__ */ jsx14("p", {
-                    className: "binding-muted",
-                    children: "No Submit request property takes the selected customers. Map one to the grid in the Submit API mappings."
-                  }),
-                  /* @__PURE__ */ jsx14("p", {
-                    children: config.customerRule === "single" ? "Submitting with no customers or multiple customers will be blocked." : "Submitting with multiple customers saves the same note separately for each customer."
-                  })
-                ]
-              }),
-              editing === "actions" && /* @__PURE__ */ jsx14(Select, {
-                label: "After a successful save",
-                value: config.success,
-                options: [
-                  { value: "close", label: "Close the popup" },
-                  { value: "keep", label: "Keep the popup open" }
-                ],
-                onChange: (value) => change((old) => ({ ...old, success: value === "keep" ? "keep" : "close" }))
-              }),
-              selectedField && /* @__PURE__ */ jsxs11(Fragment6, {
-                children: [
-                  selectedField.name === "template" && /* @__PURE__ */ jsx14(Checkbox, {
-                    label: "Fill Subject and Description from the selected template",
-                    checked: config.templateFills,
-                    onChange: (value) => change((old) => ({ ...old, templateFills: value }))
-                  }),
-                  (selectedField.name === "subject" || selectedField.name === "notes") && /* @__PURE__ */ jsx14(Select, {
-                    label: "Gets its value from",
-                    value: selectedField.input,
-                    options: [
-                      { value: "template", label: "User input or template" },
-                      { value: "user", label: "User input only" }
-                    ],
-                    onChange: (value) => updateField(selectedField.name, { input: value === "user" ? "user" : "template" })
-                  }),
-                  !selectedField.required && /* @__PURE__ */ jsx14(Select, {
-                    label: "Include in Binding",
-                    value: selectedField.excluded ? "exclude" : "include",
-                    options: [
-                      { value: "include", label: "Keep this field" },
-                      { value: "exclude", label: "Exclude and hide it" }
-                    ],
-                    onChange: (value) => updateField(selectedField.name, { excluded: value === "exclude" })
-                  }),
-                  context.options[selectedField.name]?.length ? /* @__PURE__ */ jsxs11("p", {
-                    className: "binding-muted",
-                    children: [
-                      "Sample choices:",
-                      " ",
-                      context.options[selectedField.name].map((option) => `${option.label} (${option.value})`).join(" · ")
-                    ]
-                  }) : null,
-                  fieldIssues(selectedField.name, selectedField.label).filter((i) => i.startsWith(selectedField.label)).map((i) => /* @__PURE__ */ jsx14("p", {
-                    className: "binding-error",
-                    children: i
-                  }, i))
-                ]
-              }),
-              editing !== "customers" && /* @__PURE__ */ jsxs11(Fragment6, {
-                children: [
-                  /* @__PURE__ */ jsx14(ApiMappings, {
-                    config,
-                    context,
-                    focus,
-                    defaultTarget: editing === "actions" ? SUBMIT : focus,
-                    onChange: change
-                  }),
-                  /* @__PURE__ */ jsx14(RequestPreview, {
-                    title: "Request preview (current window values)",
-                    requests: previewRequests(config, context, liveCtx, focus ? (c) => c.component === focus || c.params.some((p) => p.source === focus) : undefined)
-                  })
-                ]
-              }),
-              /* @__PURE__ */ jsx14(ButtonBar, {
-                children: /* @__PURE__ */ jsx14(Button, {
-                  icon: "Check",
-                  onClick: () => setEditing(null),
-                  children: "Done"
-                })
-              })
-            ]
-          })
-        ]
-      }),
-      /* @__PURE__ */ jsxs11("footer", {
-        className: "binding-footer",
-        children: [
-          /* @__PURE__ */ jsx14("p", {
-            className: "binding-muted",
-            role: "status",
-            children: applied ? "API binding applied in this browser only. Current Notes behavior is unchanged." : canApply(config, context, verified) ? "Simulated save and retrieval passed. Ready to apply." : gaps.length ? gaps[0] : verified ? "Resolve the remaining connections before applying." : "Try a save and retrieve the sample note before applying."
-          }),
-          /* @__PURE__ */ jsxs11(ButtonBar, {
-            children: [
-              /* @__PURE__ */ jsx14(Button, {
-                icon: "Play",
-                onClick: () => setSimulation(true),
-                children: "Try It"
-              }),
-              /* @__PURE__ */ jsx14(Button, {
-                variant: "primary",
-                icon: "Check",
-                disabled: !canApply(config, context, verified) || !!storageError,
-                onClick: () => {
-                  try {
-                    localStorage.setItem(appliedKey(pageKey), JSON.stringify({ version: CONFIG_VERSION, config, appliedAt: new Date().toISOString() }));
-                    notifyApplied(pageKey, config);
-                    setApplied(true);
-                  } catch {
-                    setStorageError("Could not apply: browser storage is unavailable.");
-                  }
-                },
-                children: "Apply Binding"
-              })
-            ]
-          })
-        ]
-      }),
-      simulation && /* @__PURE__ */ jsx14(SimulationDialog, {
-        config,
-        context,
-        onClose: () => setSimulation(false),
-        onVerified: setVerified
-      }, fingerprint(config))
-    ]
-  });
-}
-var ApiBindingStudio = ApiBindingWorkspace;
-export {
-  ApiBindingStudio,
-  ApiBindingWorkspace,
-  ApiMappings,
-  AppGrid,
-  BINDING_APPLIED,
-  BINDING_CHANNEL,
-  BINDING_CONTEXT,
-  BINDING_READY,
-  BINDING_SELECTION_UPDATE,
-  Badge,
-  Banner,
-  BindApiButton,
-  Button,
-  ButtonBar,
-  ButtonGroup,
-  CANCEL,
-  CONFIG_VERSION,
-  CUSTOMER_PARAM,
-  Checkbox,
-  DetailCard,
-  Dialog,
-  FREE_TEXT_OPTION,
-  FREE_TEXT_SOURCE,
-  exports_Icons as Icons,
-  Input,
-  RequestPreview,
-  SUBMIT,
-  Select,
-  SimulationDialog,
-  TextArea,
-  WorkspaceComponentsProvider,
-  actionContext,
-  actionFormDialogTemplateV1,
-  alertDialogTemplateV1,
-  apisOf,
-  appliedKey,
-  baseType,
-  buildCatalogFromRegistry,
-  buildRequest,
-  buildSnapshot,
-  callIssues,
-  callsFor,
-  canApply,
-  changeCallTarget,
-  changePurpose,
-  coerce,
-  coerceScalar,
-  componentId,
-  componentLabel,
-  contextComponents,
-  contextKey,
-  createActionColumn,
-  definitionFor,
-  discoverButtons,
-  discoverFormComponents,
-  draftKey,
-  droppedBy,
-  endpointLabel,
-  fieldId,
-  fieldSummary,
-  fingerprint,
-  friendlyLabel,
-  gridPaths,
-  gridPropertyPaths,
-  isButton,
-  isButtonId,
-  isNoteContract,
-  isSimulated,
-  issuesFor,
-  methodsFor,
-  migrateConfig,
-  moveCall,
-  newCall,
-  newCallId,
-  normalizeComponent,
-  notifyApplied,
-  notifySelectionUpdate,
-  openBindingStudio,
-  parseComponentId,
-  populated,
-  previewRequests,
-  proposeConfig,
-  readBindingContext,
-  readSnapshot,
-  reconcileCallParams,
-  reconcileConfig,
-  resolutionIssues,
-  resolveParam,
-  setParamSource,
-  simulateSave,
-  simulationErrors,
-  simulationForm,
-  simulatorGaps,
-  snapshotForm,
-  sourceComponents,
-  storageKey,
-  storeBindingContext,
-  storeSnapshot,
-  useAppliedBinding,
-  useWorkspaceComponents,
-  validBindingContext,
-  validContext,
-  windowIds
-};
+import {
+  catalogFromOpenApi2,
+  localStorageAdapter2,
+  memoryAdapter2,
+  toManifest2,
+  createEngine2,
+  validateRegistry2,
+  validateBindings2,
+  useBindingRuntime,
+  BindingProvider2
+} from "./index-e9twc25y.js";
+// src/framework/expr.ts
+var PIPE = /^([A-Za-z_][\w-]*)\((.*)\)$/;
+var cache = new Map;
+function parseArg(raw) {
+  const t = raw.trim();
+  if (!t)
+    return;
+  try {
+    return JSON.parse(t);
+  } catch {
+    return t;
+  }
+}
+function segments(path) {
+  return path.replace(/\[(\*|\d+)\]/g, ".$1").split(".").filter(Boolean);
+}
+function parse(expr) {
+  const hit = cache.get(expr);
+  if (hit)
+    return hit;
+  const [main, ...rest] = expr.split("|");
+  const segs = segments(main.trim());
+  if (!segs.length)
+    throw new Error(`Empty expression: "${expr}"`);
+  const width = segs[0] === "$item" || segs[0].startsWith("$") && !["$context", "$steps"].includes(segs[0]) ? 1 : 2;
+  const pipes = rest.map((p) => {
+    const m = PIPE.exec(p.trim());
+    if (!m)
+      throw new Error(`Bad transform "${p.trim()}" in "${expr}"`);
+    return { name: m[1], args: m[2] ? m[2].split(",").map(parseArg) : [] };
+  });
+  const parsed = { head: segs.slice(0, width), path: segs.slice(width), pipes };
+  cache.set(expr, parsed);
+  return parsed;
+}
+function walk(value, path) {
+  let v = value;
+  for (let i = 0;i < path.length; i++) {
+    if (v == null)
+      return;
+    if (path[i] === "*") {
+      if (!Array.isArray(v))
+        return;
+      const rest = path.slice(i + 1);
+      return v.map((x) => walk(x, rest));
+    }
+    v = v[path[i]];
+  }
+  return v;
+}
+function evaluate(expr, scope) {
+  const { head, path, pipes } = parse(expr);
+  let root;
+  if (head[0] === "$item")
+    root = scope.item;
+  else if (head[0] === "$context")
+    root = scope.context?.[head[1]];
+  else if (head[0] === "$steps")
+    root = scope.steps?.[head[1]];
+  else if (head[0].startsWith("$"))
+    root = scope.providers?.[head[0].slice(1)];
+  else
+    root = scope.slot(head[0], head[1]);
+  let value = walk(root, path);
+  for (const p of pipes) {
+    const fn = scope.transforms?.[p.name];
+    if (!fn)
+      throw new Error(`Unknown transform "${p.name}" in "${expr}"`);
+    value = fn(value, ...p.args);
+  }
+  return value;
+}
+// src/framework/runner.ts
+class BindingError extends Error {
+  detail;
+  constructor(message, detail) {
+    super(message);
+    this.detail = detail;
+    this.name = "BindingError";
+  }
+}
+function setPointer(target, keys, value) {
+  let node = target;
+  keys.slice(0, -1).forEach((k) => {
+    node = node[k] ??= {};
+  });
+  node[keys[keys.length - 1]] = value;
+}
+var decode = (k) => k.replace(/~1/g, "/").replace(/~0/g, "~");
+function buildRequest(op, request, scope) {
+  const out = { method: op.method, path: op.path, query: {}, headers: {} };
+  let body;
+  for (const [pointer, expr] of Object.entries(request)) {
+    const value = evaluate(expr, scope);
+    if (value === undefined)
+      continue;
+    const [, where, ...rest] = pointer.split("/");
+    const keys = rest.map(decode);
+    if (where === "path")
+      out.path = out.path.replace(`{${keys[0]}}`, encodeURIComponent(String(value)));
+    else if (where === "query")
+      out.query[keys[0]] = String(value);
+    else if (where === "header")
+      out.headers[keys[0]] = String(value);
+    else if (where === "body") {
+      if (!keys.length)
+        out.body = value;
+      else
+        setPointer(body ??= {}, keys, value);
+    }
+  }
+  if (body)
+    out.body = { ...out.body, ...body };
+  const missing = op.parameters.filter((p) => p.required && !((p.pointer in request) && evaluate(request[p.pointer], scope) !== undefined));
+  if (missing.length)
+    throw new BindingError(`Missing required input: ${missing.map((p) => p.name).join(", ")}.`);
+  return out;
+}
+var requestKey = (r) => JSON.stringify([r.method, r.path, r.query, r.body ?? null]);
+function select(response, selector) {
+  const path = selector.replace(/^\$\.?/, "").replace(/\[\*\]$/, "").split(".").filter(Boolean);
+  return path.reduce((v, k) => v == null ? undefined : v[k], response);
+}
+function mapItems(data, binding, scope) {
+  if (!binding.map || !Object.keys(binding.map).length)
+    return data;
+  const one = (item) => Object.fromEntries(Object.entries(binding.map).map(([k, e]) => [k, evaluate(e, { ...scope, item })]));
+  return Array.isArray(data) ? data.map(one) : data == null ? data : one(data);
+}
+async function runConsume(binding, op, scope, fetcher) {
+  const response = await fetcher(buildRequest(op, binding.request, scope), op);
+  return mapItems(select(response, binding.select), binding, scope);
+}
+async function runSteps(steps, operations, scope, fetcher) {
+  const outcomes = [];
+  const results = { ...scope.steps };
+  for (const step of steps) {
+    const op = operations.get(step.operation);
+    if (!op)
+      throw new BindingError(`Operation "${step.operation}" is not in the catalog.`);
+    const items = step.forEach ? evaluate(step.forEach, scope) : [scope.item];
+    const list = Array.isArray(items) ? items : [items];
+    const responses = [];
+    let failed = false;
+    for (const item of list) {
+      try {
+        responses.push(await fetcher(buildRequest(op, step.request, { ...scope, item, steps: results }), op));
+      } catch (error) {
+        failed = true;
+        outcomes.push({ step: step.id, ok: false, error });
+        if (step.onError === "stop")
+          return outcomes;
+      }
+    }
+    const response = step.forEach ? responses : responses[0];
+    results[step.id] = { response };
+    if (!failed)
+      outcomes.push({ step: step.id, ok: true, response });
+  }
+  return outcomes;
+}
+// src/runtime/BindingScreen.tsx
+import * as React from "react";
+
+// src/runtime/screenStore.ts
+function createScreenStore() {
+  const values = new Map;
+  const listeners = new Set;
+  return {
+    get: (b, s) => values.get(`${b}.${s}`),
+    set(b, s, value) {
+      const k = `${b}.${s}`;
+      if (Object.is(values.get(k), value))
+        return;
+      values.set(k, value);
+      listeners.forEach((l) => l());
+    },
+    subscribe(l) {
+      listeners.add(l);
+      return () => {
+        listeners.delete(l);
+      };
+    }
+  };
+}
+
+// src/runtime/BindingScreen.tsx
+import { jsx } from "react/jsx-runtime";
+var ScreenContext = React.createContext(null);
+var ShownContext = React.createContext(true);
+function useScreen() {
+  const s = React.useContext(ScreenContext);
+  if (!s)
+    throw new Error("Use binding hooks inside <BindingScreen id=…>.");
+  return s;
+}
+function BindingActive({ value, children }) {
+  const parent = React.useContext(ShownContext);
+  return /* @__PURE__ */ jsx(ShownContext.Provider, {
+    value: parent && value,
+    children
+  });
+}
+var NO_CONTEXT = {};
+function BindingScreen({ id, context = NO_CONTEXT, children }) {
+  const [store] = React.useState(createScreenStore);
+  const shown = React.useContext(ShownContext);
+  const { loadSaved, mountScreen } = useBindingRuntime();
+  React.useEffect(() => {
+    loadSaved(id);
+  }, [loadSaved, id]);
+  React.useEffect(() => mountScreen(id, shown), [mountScreen, id, shown]);
+  const scope = React.useMemo(() => ({ id, store, context }), [id, store, context]);
+  return /* @__PURE__ */ jsx(ScreenContext.Provider, {
+    value: scope,
+    children
+  });
+}
+// src/runtime/hooks.ts
+import * as React2 from "react";
+function scopeOf(runtime, screen, item) {
+  return { slot: screen.store.get, context: screen.context, providers: runtime.providers(), transforms: runtime.transforms, item };
+}
+function useProduce(bindId, slot, value) {
+  const { store } = useScreen();
+  React2.useEffect(() => {
+    store.set(bindId, slot, value);
+  }, [store, bindId, slot, value]);
+}
+var WAIT = "\x00wait:";
+function useSlot(bindId, slot) {
+  const runtime = useBindingRuntime();
+  const screen = useScreen();
+  const binding = runtime.binding(screen.id, bindId, slot);
+  const [nonce, setNonce] = React2.useState(0);
+  const [state, setState] = React2.useState({ key: "", status: "loading" });
+  const snapshot = React2.useCallback(() => {
+    if (!binding)
+      return "";
+    try {
+      const scope = scopeOf(runtime, screen);
+      if (binding.type === "expression")
+        return JSON.stringify(evaluate(binding.value, scope) ?? null);
+      if (binding.type !== "operation")
+        return "";
+      const op = runtime.operations.get(binding.operation);
+      return op ? requestKey(buildRequest(op, binding.request, scope)) : WAIT + "operation missing";
+    } catch (e) {
+      return WAIT + (e instanceof Error ? e.message : String(e));
+    }
+  }, [binding, runtime, screen]);
+  const key = React2.useSyncExternalStore(screen.store.subscribe, snapshot, snapshot);
+  React2.useEffect(() => {
+    if (!binding || binding.type !== "operation" || !key || key.startsWith(WAIT))
+      return;
+    const op = runtime.operations.get(binding.operation);
+    const scope = scopeOf(runtime, screen);
+    const request = buildRequest(op, binding.request, scope);
+    const k = requestKey(request);
+    let live = true;
+    setState((s) => ({ key, status: "loading", data: s.data }));
+    let p = nonce ? undefined : runtime.inflight.get(k);
+    if (!p) {
+      p = runtime.fetcher(request, op).finally(() => runtime.inflight.delete(k));
+      runtime.inflight.set(k, p);
+    }
+    p.then((res) => {
+      if (live)
+        setState({ key, status: "ready", data: mapItems(select(res, binding.select), binding, scope) });
+    }, (error) => {
+      if (live)
+        setState({ key, status: "error", error });
+    });
+    return () => {
+      live = false;
+    };
+  }, [binding, key, nonce, runtime, screen]);
+  const reload = React2.useCallback(() => setNonce((n) => n + 1), []);
+  if (!binding || binding.type === "steps" || binding.type === "none")
+    return { status: "unbound", data: undefined, error: undefined, reload };
+  if (binding.type === "expression")
+    return { status: "ready", data: key ? JSON.parse(key) : undefined, error: undefined, reload };
+  if (key.startsWith(WAIT))
+    return { status: "waiting", data: undefined, error: new BindingError(key.slice(WAIT.length)), reload };
+  return { status: state.key === key ? state.status : "loading", data: state.data, error: state.error, reload };
+}
+function useCell(bindId, slot) {
+  const runtime = useBindingRuntime();
+  const screen = useScreen();
+  const binding = runtime.binding(screen.id, bindId, slot);
+  return React2.useCallback((item) => binding?.type === "expression" ? evaluate(binding.value, scopeOf(runtime, screen, item)) : undefined, [binding, runtime, screen]);
+}
+function useTrigger(bindId, slot) {
+  const runtime = useBindingRuntime();
+  const screen = useScreen();
+  const binding = runtime.binding(screen.id, bindId, slot);
+  const [running, setRunning] = React2.useState(false);
+  const run = React2.useCallback(async (item) => {
+    if (binding?.type !== "steps")
+      return [];
+    setRunning(true);
+    try {
+      return await runSteps(binding.steps, runtime.operations, scopeOf(runtime, screen, item), runtime.fetcher);
+    } finally {
+      setRunning(false);
+    }
+  }, [binding, runtime, screen]);
+  return { bound: binding?.type === "steps" || binding?.type === "none", running, run };
+}
+export {
+  BindingActive,
+  BindingError,
+  BindingProvider2 as BindingProvider,
+  BindingScreen,
+  buildRequest,
+  catalogFromOpenApi2 as catalogFromOpenApi,
+  createEngine2 as createEngine,
+  evaluate,
+  localStorageAdapter2 as localStorageAdapter,
+  memoryAdapter2 as memoryAdapter,
+  runConsume,
+  runSteps,
+  select,
+  toManifest2 as toManifest,
+  useCell,
+  useProduce,
+  useSlot,
+  useTrigger,
+  validateBindings2 as validateBindings,
+  validateRegistry2 as validateRegistry
+};
+
+//# debugId=0D89B09671A8D81B64756E2164756E21
+//# sourceMappingURL=index.js.map