@timeax/service-builder 0.1.6 → 0.1.7

package/dist/index.js

@@ -4750,7 +4750,8 @@ import { LuTags as LuTags2 } from "react-icons/lu";
 import { MdOutlineRadioButtonChecked as MdOutlineRadioButtonChecked2 } from "react-icons/md";
 import { RxInput as RxInput2 } from "react-icons/rx";
 import { Fragment as Fragment5, jsx as jsx16, jsxs as jsxs12 } from "react/jsx-runtime";
-var ACTIVE_NODE_RING_CLASS = "ring-2 ring-sky-300 shadow-lg shadow-sky-300/20 dark:ring-sky-400";
+var SELECTED_NODE_RING_CLASS = "ring-2 ring-sky-300 shadow-lg shadow-sky-300/20 dark:ring-sky-400";
+var ACTIVE_NODE_OUTLINE_CLASS = "outline-2 outline-solid outline-emerald-500 dark:outline-emerald-400";
 var HIGHLIGHT_NODE_OUTLINE_CLASS = "outline-2 outline-solid outline-amber-300 dark:outline-amber-200";
 function NodeShell({
   label,
@@ -4782,7 +4783,7 @@ function NodeShell({
         isManualHighlighted ? "manual-highlighted" : "",
         focusDimLevel && focusDimLevel !== "none" ? `dim-${focusDimLevel}` : ""
       ].filter(Boolean).join(" "),
-      className: "group relative min-w-44 rounded-lg bg-white p-3 ring-1 ring-slate-200 shadow-[0_4px_12px_rgba(0,0,0,0.05)] transition-all duration-200 dark:bg-slate-900 dark:ring-slate-700 " + (selected ? `${ACTIVE_NODE_RING_CLASS} ` : "hover:shadow-lg ") + (isActiveNode ? `${ACTIVE_NODE_RING_CLASS} ` : "") + (isCurrentTag ? "ring-2 ring-emerald-500 bg-emerald-50/70 shadow-lg shadow-emerald-500/25 dark:bg-emerald-500/10 " : "") + (isVisibleGroupField ? "ring-2 ring-emerald-300 bg-emerald-50/35 dark:bg-emerald-500/5 " : "") + (isRelatedTag ? "ring-1 ring-teal-300 bg-teal-50/25 dark:bg-teal-500/8 " : "") + (isManualHighlighted ? `${HIGHLIGHT_NODE_OUTLINE_CLASS} ` : "") + (draggingService && canAssignService2 ? "border border-dashed border-emerald-400 " : "") + (!canAssignService2 && draggingService ? "opacity-70 " : "") + dimClass,
+      className: "group relative min-w-44 rounded-lg bg-white p-3 ring-1 ring-slate-200 shadow-[0_4px_12px_rgba(0,0,0,0.05)] transition-all duration-200 dark:bg-slate-900 dark:ring-slate-700 " + (selected ? `${SELECTED_NODE_RING_CLASS} ` : "hover:shadow-lg ") + (isActiveNode ? `${ACTIVE_NODE_OUTLINE_CLASS} ` : "") + (isCurrentTag ? "ring-2 ring-emerald-500 bg-emerald-50/70 shadow-lg shadow-emerald-500/25 dark:bg-emerald-500/10 " : "") + (isVisibleGroupField ? "ring-2 ring-emerald-300 bg-emerald-50/35 dark:bg-emerald-500/5 " : "") + (isRelatedTag ? "ring-1 ring-teal-300 bg-teal-50/25 dark:bg-teal-500/8 " : "") + (isManualHighlighted ? `${HIGHLIGHT_NODE_OUTLINE_CLASS} ` : "") + (draggingService && canAssignService2 ? "border border-dashed border-emerald-400 " : "") + (!canAssignService2 && draggingService ? "opacity-70 " : "") + dimClass,
       onDragOver: (event) => {
         if (!canAcceptDropPayload?.(event.dataTransfer)) return;
         event.preventDefault();
@@ -4879,7 +4880,7 @@ function OptionNode(props) {
           props.data.isManualHighlighted ? "manual-highlighted" : "",
           props.data.focusDimLevel && props.data.focusDimLevel !== "none" ? `dim-${props.data.focusDimLevel}` : ""
         ].filter(Boolean).join(" "),
-        className: "relative rounded-full border px-4 py-1.5 text-sm bg-white text-slate-800 transition dark:bg-slate-900 dark:text-slate-200 " + (props.selected ? "border-sky-300 bg-sky-50 text-sky-700 dark:bg-sky-500/15 dark:border-sky-400 " : "border-slate-300 dark:border-slate-700 ") + (props.data.isActiveNode ? `${ACTIVE_NODE_RING_CLASS} ` : "") + (props.data.isCurrentTag ? "ring-2 ring-emerald-500 bg-emerald-50/70 dark:bg-emerald-500/10 " : "") + (props.data.isVisibleGroupField ? "ring-2 ring-emerald-300 bg-emerald-50/35 dark:bg-emerald-500/5 " : "") + (props.data.isRelatedTag ? "ring-1 ring-teal-300 bg-teal-50/25 dark:bg-teal-500/8 " : "") + (props.data.isManualHighlighted ? `${HIGHLIGHT_NODE_OUTLINE_CLASS} ` : "") + (props.data.focusDimLevel === "soft" ? "opacity-80 " : props.data.focusDimLevel === "medium" ? "opacity-[0.55] " : props.data.focusDimLevel === "strong" ? "opacity-35 " : ""),
+        className: "relative rounded-full border px-4 py-1.5 text-sm bg-white text-slate-800 transition dark:bg-slate-900 dark:text-slate-200 " + (props.selected ? `border-sky-300 bg-sky-50 text-sky-700 dark:bg-sky-500/15 dark:border-sky-400 ${SELECTED_NODE_RING_CLASS} ` : "border-slate-300 dark:border-slate-700 ") + (props.data.isActiveNode ? `${ACTIVE_NODE_OUTLINE_CLASS} ` : "") + (props.data.isCurrentTag ? "ring-2 ring-emerald-500 bg-emerald-50/70 dark:bg-emerald-500/10 " : "") + (props.data.isVisibleGroupField ? "ring-2 ring-emerald-300 bg-emerald-50/35 dark:bg-emerald-500/5 " : "") + (props.data.isRelatedTag ? "ring-1 ring-teal-300 bg-teal-50/25 dark:bg-teal-500/8 " : "") + (props.data.isManualHighlighted ? `${HIGHLIGHT_NODE_OUTLINE_CLASS} ` : "") + (props.data.focusDimLevel === "soft" ? "opacity-80 " : props.data.focusDimLevel === "medium" ? "opacity-[0.55] " : props.data.focusDimLevel === "strong" ? "opacity-35 " : ""),
         onDragOver: (event) => {
           if (!props.data.canAcceptDropPayload?.(event.dataTransfer)) return;
           event.preventDefault();
@@ -4909,7 +4910,7 @@ function CommentNode(props) {
   return /* @__PURE__ */ jsxs12(
     "div",
     {
-      className: "h-48 w-64 rounded-lg border border-[#E0E0E0] bg-[#FEFBEA] shadow-md transition-all hover:shadow-lg dark:border-[#555] dark:bg-[#4a4a38] " + (props.selected ? `${ACTIVE_NODE_RING_CLASS} ` : ""),
+      className: "h-48 w-64 rounded-lg border border-[#E0E0E0] bg-[#FEFBEA] shadow-md transition-all hover:shadow-lg dark:border-[#555] dark:bg-[#4a4a38] " + (props.selected ? `${SELECTED_NODE_RING_CLASS} ` : ""),
       children: [
         /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-2 border-b border-[#E0E0E0]/70 px-3 py-2 text-xs font-medium text-slate-600 dark:border-[#555] dark:text-slate-300", children: [
           /* @__PURE__ */ jsx16(BsChatSquareQuote2, {}),
@@ -14395,9 +14396,14 @@ var wireframe_tags_widget_default = WireframeTagsWidget;
 // src/panels/right/tabs/wireframe.tsx
 import { useOrderFlow, Wrapper } from "@timeax/digital-service-engine/react";
 import { useCanvas as useCanvas16, useWorkspace as useWorkspace14 } from "@timeax/digital-service-engine/workspace";
-import { useCallback as useCallback19, useMemo as useMemo33 } from "react";
+import { useCallback as useCallback19, useMemo as useMemo33, useState as useState33 } from "react";
+import { BsChevronDown as BsChevronDown2 } from "react-icons/bs";
 import { jsx as jsx71, jsxs as jsxs51 } from "react/jsx-runtime";
 var CHECKBOX_SINGLE_EXTRA_PROPS = Object.freeze({ single: true });
+function formatMetricNumber(value) {
+  if (typeof value !== "number" || !Number.isFinite(value)) return "--";
+  return new Intl.NumberFormat("en-US", { maximumFractionDigits: 4 }).format(value);
+}
 function Wireframe() {
   const canvas = useCanvas16();
   const ws = useWorkspace14();
@@ -14406,7 +14412,109 @@ function Wireframe() {
   const previewFields = useMemo33(() => getVisiblePreviewFields(canvas, currentTag?.id), [canvas.props, canvas.selectionInfo, canvas.activeId]);
   const selectedOptionsCount = canvas.selectionInfo.optionIds.length;
   const flow = useOrderFlow();
-  const footerLine = currentTag ? `Tag: ${currentTag.raw.label} \xB7 Visible fields: ${previewFields.length} \xB7 Selected options: ${selectedOptionsCount}` : `No active tag \xB7 Visible fields: 0 \xB7 Selected options: ${selectedOptionsCount}`;
+  const [isFooterOpen, setIsFooterOpen] = useState33(true);
+  const footerSummary = useMemo33(() => {
+    const minText = formatMetricNumber(flow.min);
+    const maxText = formatMetricNumber(flow.max);
+    const rangeText = minText === "--" && maxText === "--" ? "--" : `${minText} - ${maxText}`;
+    return [
+      { label: "Tag", value: currentTag?.raw.label ?? "No active tag" },
+      { label: "Visible fields", value: String(previewFields.length) },
+      { label: "Selected options", value: String(selectedOptionsCount) },
+      { label: "Quantity", value: formatMetricNumber(flow.quantityPreview) },
+      { label: "Min/Max", value: rangeText },
+      { label: "Services", value: String(flow.services.length), detailsKind: "services" },
+      { label: "Base", value: formatMetricNumber(flow.pricingPreview?.base), detailsKind: "pricing" },
+      { label: "Utilities", value: formatMetricNumber(flow.pricingPreview?.utilities), detailsKind: "pricing" },
+      { label: "Total", value: formatMetricNumber(flow.pricingPreview?.total), detailsKind: "pricing" },
+      { label: "Utility lines", value: String(flow.pricingPreview?.utilityBreakdown?.length ?? 0), detailsKind: "utility_lines" }
+    ];
+  }, [
+    currentTag?.raw.label,
+    flow.max,
+    flow.min,
+    flow.pricingPreview?.base,
+    flow.pricingPreview?.total,
+    flow.pricingPreview?.utilities,
+    flow.pricingPreview?.utilityBreakdown?.length,
+    flow.quantityPreview,
+    flow.services.length,
+    previewFields.length,
+    selectedOptionsCount
+  ]);
+  const serviceDetails = useMemo33(() => {
+    const servicesMap = ws.services.data ?? {};
+    return flow.services.map((serviceId) => {
+      const service = servicesMap[String(serviceId)];
+      return {
+        id: serviceId,
+        name: service?.name ?? `Service ${String(serviceId)}`,
+        rate: service?.rate,
+        min: service?.min,
+        max: service?.max
+      };
+    });
+  }, [flow.services, ws.services.data]);
+  const renderPillDetails = useCallback19(
+    (kind) => {
+      if (kind === "services") {
+        return /* @__PURE__ */ jsxs51("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ jsx71("p", { className: "text-xs font-semibold text-slate-700 dark:text-slate-200", children: "Visible Services" }),
+          serviceDetails.length ? /* @__PURE__ */ jsx71("div", { className: "max-h-56 space-y-2 overflow-auto pr-1", children: serviceDetails.map((service) => /* @__PURE__ */ jsxs51("div", { className: "rounded-md border border-slate-200 bg-slate-50 px-2 py-1.5 text-xs dark:border-slate-700 dark:bg-slate-900", children: [
+            /* @__PURE__ */ jsx71("p", { className: "font-medium text-slate-700 dark:text-slate-200", children: service.name }),
+            /* @__PURE__ */ jsxs51("p", { className: "text-slate-500 dark:text-slate-400", children: [
+              "ID: ",
+              String(service.id)
+            ] }),
+            /* @__PURE__ */ jsxs51("p", { className: "text-slate-500 dark:text-slate-400", children: [
+              "Rate: ",
+              formatMetricNumber(service.rate),
+              " \xB7 Min/Max: ",
+              formatMetricNumber(service.min),
+              " - ",
+              formatMetricNumber(service.max)
+            ] })
+          ] }, String(service.id))) }) : /* @__PURE__ */ jsx71("p", { className: "text-xs text-slate-500 dark:text-slate-400", children: "No services are currently active for this selection." })
+        ] });
+      }
+      if (kind === "utility_lines") {
+        const lines = flow.pricingPreview?.utilityBreakdown ?? [];
+        return /* @__PURE__ */ jsxs51("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ jsx71("p", { className: "text-xs font-semibold text-slate-700 dark:text-slate-200", children: "Utility Breakdown" }),
+          lines.length ? /* @__PURE__ */ jsx71("div", { className: "max-h-56 space-y-2 overflow-auto pr-1", children: lines.map((line, index) => /* @__PURE__ */ jsxs51("div", { className: "rounded-md border border-slate-200 bg-slate-50 px-2 py-1.5 text-xs dark:border-slate-700 dark:bg-slate-900", children: [
+            /* @__PURE__ */ jsxs51("p", { className: "font-medium text-slate-700 dark:text-slate-200", children: [
+              "Node: ",
+              line.nodeId
+            ] }),
+            /* @__PURE__ */ jsxs51("p", { className: "text-slate-500 dark:text-slate-400", children: [
+              "Mode: ",
+              line.mode
+            ] }),
+            /* @__PURE__ */ jsxs51("p", { className: "text-slate-500 dark:text-slate-400", children: [
+              "Amount: ",
+              formatMetricNumber(line.amount)
+            ] })
+          ] }, `${line.nodeId}:${index}`)) }) : /* @__PURE__ */ jsx71("p", { className: "text-xs text-slate-500 dark:text-slate-400", children: "No utility line items in the current preview." })
+        ] });
+      }
+      return /* @__PURE__ */ jsxs51("div", { className: "space-y-1 text-xs", children: [
+        /* @__PURE__ */ jsx71("p", { className: "font-semibold text-slate-700 dark:text-slate-200", children: "Pricing Summary" }),
+        /* @__PURE__ */ jsxs51("p", { className: "text-slate-500 dark:text-slate-400", children: [
+          "Base: ",
+          formatMetricNumber(flow.pricingPreview?.base)
+        ] }),
+        /* @__PURE__ */ jsxs51("p", { className: "text-slate-500 dark:text-slate-400", children: [
+          "Utilities: ",
+          formatMetricNumber(flow.pricingPreview?.utilities)
+        ] }),
+        /* @__PURE__ */ jsxs51("p", { className: "text-slate-500 dark:text-slate-400", children: [
+          "Total: ",
+          formatMetricNumber(flow.pricingPreview?.total)
+        ] })
+      ] });
+    },
+    [flow.pricingPreview?.base, flow.pricingPreview?.total, flow.pricingPreview?.utilities, flow.pricingPreview?.utilityBreakdown, serviceDetails]
+  );
   const { visibleTag, parents, children, visibleFields } = useMemo33(() => {
     const result = canvas.api.selection.visibleGroup();
     const notices = canvas.api.builder.getProps().notices;
@@ -14552,7 +14660,44 @@ function Wireframe() {
         }
       ) })
     ] }) }) }),
-    /* @__PURE__ */ jsx71("div", { className: "border-t border-slate-200 px-4 py-2 text-xs text-slate-600 dark:border-slate-800 dark:text-slate-300", children: /* @__PURE__ */ jsx71("p", { className: "truncate", children: footerLine }) })
+    /* @__PURE__ */ jsxs51("div", { className: "mt-auto border-t border-slate-200 px-4 py-2 text-xs text-slate-600 dark:border-slate-800 dark:text-slate-300", children: [
+      /* @__PURE__ */ jsxs51(
+        "button",
+        {
+          type: "button",
+          className: "flex w-full items-center justify-between rounded-md px-1 py-1 text-left hover:bg-slate-100/70 dark:hover:bg-slate-900/80",
+          onClick: () => setIsFooterOpen((prev) => !prev),
+          "aria-expanded": isFooterOpen,
+          "aria-controls": "wireframe-footer-summary",
+          children: [
+            /* @__PURE__ */ jsx71("span", { className: "font-medium", children: "Order preview summary" }),
+            /* @__PURE__ */ jsx71(BsChevronDown2, { className: `transition-transform ${isFooterOpen ? "rotate-180" : "rotate-0"}` })
+          ]
+        }
+      ),
+      isFooterOpen ? /* @__PURE__ */ jsx71("div", { id: "wireframe-footer-summary", className: "mt-2 flex flex-wrap gap-2", children: footerSummary.map((item) => {
+        const chip = /* @__PURE__ */ jsxs51("span", { className: "inline-flex items-center gap-1 rounded-md border border-slate-200 bg-slate-50 px-2 py-1 dark:border-slate-700 dark:bg-slate-900", children: [
+          /* @__PURE__ */ jsxs51("span", { className: "text-slate-500 dark:text-slate-400", children: [
+            item.label,
+            ":"
+          ] }),
+          /* @__PURE__ */ jsx71("span", { className: "font-medium text-slate-700 dark:text-slate-200", children: item.value })
+        ] });
+        if (!item.detailsKind) return /* @__PURE__ */ jsx71("div", { children: chip }, item.label);
+        return /* @__PURE__ */ jsxs51(Popover, { children: [
+          /* @__PURE__ */ jsx71(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx71(
+            "button",
+            {
+              type: "button",
+              className: "rounded-md transition-transform hover:scale-[1.01] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-sky-500/50",
+              "aria-label": `${item.label} details`,
+              children: chip
+            }
+          ) }),
+          /* @__PURE__ */ jsx71(PopoverContent, { align: "start", side: "top", sideOffset: 8, collisionPadding: 12, className: "w-80 rounded-xl p-3", children: renderPillDetails(item.detailsKind) })
+        ] }, item.label);
+      }) }) : null
+    ] })
   ] });
 }
 var wireframe_default = Wireframe;
@@ -14595,17 +14740,1172 @@ var RightPanel = ({ onShare, onPlay }) => {
 };
 var right_default = RightPanel;
 
+// src/components/ui/resizable.tsx
+import { GripVertical } from "lucide-react";
+import "react";
+import { Group as Group2, Panel as Panel3, Separator as Separator3 } from "react-resizable-panels";
+import { jsx as jsx73 } from "react/jsx-runtime";
+function ResizablePanelGroup({
+  className,
+  direction = "horizontal",
+  ...props
+}) {
+  return /* @__PURE__ */ jsx73(Group2, { className: cn("flex h-full w-full data-[group-orientation=vertical]:flex-col", className), orientation: direction, ...props });
+}
+function ResizablePanel({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx73(Panel3, { className: cn("min-h-0 min-w-0", className), ...props });
+}
+function ResizableHandle({
+  withHandle,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx73(
+    Separator3,
+    {
+      className: cn(
+        "relative flex w-3 shrink-0 items-center justify-center bg-transparent outline-none transition-colors after:absolute after:inset-y-3 after:left-1/2 after:w-px after:-translate-x-1/2 after:rounded-full after:bg-slate-200 dark:after:bg-slate-800",
+        "hover:after:bg-slate-300 dark:hover:after:bg-slate-700",
+        className
+      ),
+      ...props,
+      children: withHandle ? /* @__PURE__ */ jsx73("div", { className: "z-10 flex h-10 w-3 items-center justify-center rounded-md border border-slate-200 bg-white text-slate-400 shadow-sm dark:border-slate-800 dark:bg-slate-950 dark:text-slate-500", children: /* @__PURE__ */ jsx73(GripVertical, { className: "h-3.5 w-3.5" }) }) : null
+    }
+  );
+}
+
+// src/workspace/fallback-editor/native-fallback-editor.tsx
+import { FallbackEditorProvider, useActiveFallbackRegistrations as useActiveFallbackRegistrations4, useFallbackEditor as useFallbackEditor6, usePrimaryServiceList as usePrimaryServiceList3 } from "@timeax/digital-service-engine/react";
+import { useMemo as useMemo37 } from "react";
+
+// src/workspace/fallback-editor/fallback-details-panel.tsx
+import { useActiveFallbackRegistrations, useFallbackEditor, usePrimaryServiceList } from "@timeax/digital-service-engine/react";
+import { useMemo as useMemo34 } from "react";
+
+// src/workspace/fallback-editor/shared.tsx
+import { X } from "lucide-react";
+import { jsx as jsx74, jsxs as jsxs53 } from "react/jsx-runtime";
+var surfaceClassName = "rounded-md border border-slate-200/80 bg-white/95 shadow-sm backdrop-blur dark:border-slate-800 dark:bg-slate-950/85";
+function SectionCard({
+  className,
+  children
+}) {
+  return /* @__PURE__ */ jsx74("section", { className: cn(surfaceClassName, className), children });
+}
+function SectionHeader2({
+  title,
+  description,
+  action,
+  className
+}) {
+  return /* @__PURE__ */ jsxs53("div", { className: cn("flex items-start justify-between gap-3", className), children: [
+    /* @__PURE__ */ jsxs53("div", { className: "min-w-0", children: [
+      /* @__PURE__ */ jsx74("h3", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: title }),
+      description ? /* @__PURE__ */ jsx74("p", { className: "mt-1 text-xs text-slate-500 dark:text-slate-400", children: description }) : null
+    ] }),
+    action ? /* @__PURE__ */ jsx74("div", { className: "shrink-0", children: action }) : null
+  ] });
+}
+function EmptyState2({
+  title,
+  description,
+  className
+}) {
+  return /* @__PURE__ */ jsxs53(
+    "div",
+    {
+      className: cn(
+        "flex min-h-40 flex-col items-center justify-center rounded-md border border-dashed border-slate-300 bg-slate-50/80 px-5 py-8 text-center dark:border-slate-700 dark:bg-slate-900/40",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx74("h4", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: title }),
+        /* @__PURE__ */ jsx74("p", { className: "mt-2 max-w-sm text-sm text-slate-500 dark:text-slate-400", children: description })
+      ]
+    }
+  );
+}
+function DetailRow({
+  label,
+  value,
+  className
+}) {
+  return /* @__PURE__ */ jsxs53("div", { className: cn("flex items-start justify-between gap-3 rounded-md bg-slate-50 px-3 py-2 dark:bg-slate-900/70", className), children: [
+    /* @__PURE__ */ jsx74("span", { className: "text-sm text-slate-500 dark:text-slate-400", children: label }),
+    /* @__PURE__ */ jsx74("span", { className: "text-right text-sm font-medium text-slate-900 dark:text-slate-100", children: value })
+  ] });
+}
+function ToneBadge({
+  label,
+  tone = "neutral",
+  className
+}) {
+  const palette = tone === "info" ? "border-sky-200 bg-sky-50 text-sky-700 dark:border-sky-500/30 dark:bg-sky-500/10 dark:text-sky-200" : tone === "success" ? "border-emerald-200 bg-emerald-50 text-emerald-700 dark:border-emerald-500/30 dark:bg-emerald-500/10 dark:text-emerald-200" : tone === "warning" ? "border-amber-200 bg-amber-50 text-amber-700 dark:border-amber-500/30 dark:bg-amber-500/10 dark:text-amber-200" : tone === "danger" ? "border-rose-200 bg-rose-50 text-rose-700 dark:border-rose-500/30 dark:bg-rose-500/10 dark:text-rose-200" : "border-slate-200 bg-white text-slate-600 dark:border-slate-700 dark:bg-slate-950 dark:text-slate-300";
+  return /* @__PURE__ */ jsx74("span", { className: cn("inline-flex rounded-md border px-2.5 py-1 text-[11px] font-medium", palette, className), children: label });
+}
+function ModalShell({
+  open,
+  title,
+  description,
+  onClose,
+  children,
+  footer,
+  size = "default"
+}) {
+  if (!open) return null;
+  return /* @__PURE__ */ jsx74(
+    "div",
+    {
+      className: "fixed inset-0 z-[60] flex items-center justify-center bg-slate-950/65 p-4 backdrop-blur-sm",
+      onMouseDown: (event) => {
+        if (event.target === event.currentTarget) onClose();
+      },
+      children: /* @__PURE__ */ jsxs53(
+        "div",
+        {
+          className: cn(
+            "flex max-h-[85vh] w-full flex-col overflow-hidden rounded-md border border-slate-200 bg-white shadow-2xl dark:border-slate-800 dark:bg-slate-950",
+            size === "wide" ? "max-w-4xl" : "max-w-xl"
+          ),
+          onMouseDown: (event) => event.stopPropagation(),
+          children: [
+            /* @__PURE__ */ jsxs53("div", { className: "flex items-start justify-between gap-4 border-b border-slate-200 px-6 py-4 dark:border-slate-800", children: [
+              /* @__PURE__ */ jsxs53("div", { className: "min-w-0", children: [
+                /* @__PURE__ */ jsx74("h3", { className: "text-base font-semibold text-slate-900 dark:text-slate-100", children: title }),
+                description ? /* @__PURE__ */ jsx74("p", { className: "mt-1 text-sm text-slate-500 dark:text-slate-400", children: description }) : null
+              ] }),
+              /* @__PURE__ */ jsx74(Button, { type: "button", variant: "ghost", size: "icon-sm", onClick: onClose, className: "rounded-md", children: /* @__PURE__ */ jsx74(X, { className: "size-4" }) })
+            ] }),
+            /* @__PURE__ */ jsx74(ScrollArea, { className: "min-h-0 flex-1", children: /* @__PURE__ */ jsx74("div", { className: "p-6", children }) }),
+            footer ? /* @__PURE__ */ jsx74("div", { className: "border-t border-slate-200 px-6 py-4 dark:border-slate-800", children: footer }) : null
+          ]
+        }
+      )
+    }
+  );
+}
+
+// src/workspace/fallback-editor/fallback-details-panel.tsx
+import { jsx as jsx75, jsxs as jsxs54 } from "react/jsx-runtime";
+function FallbackDetailsPanel() {
+  const { activeServiceId, state, settings, check } = useFallbackEditor();
+  const services2 = usePrimaryServiceList();
+  const registrations = useActiveFallbackRegistrations();
+  const service = useMemo34(() => services2.find((entry) => String(entry.id) === String(activeServiceId)), [services2, activeServiceId]);
+  const diagnostics = useMemo34(() => {
+    return registrations.flatMap((registration) => {
+      const context = toScopeRef(registration);
+      const result = check(context, registration.services);
+      const rejected = result.rejected.map((item) => ({
+        scope: registration.scope,
+        scopeId: registration.scopeId,
+        candidate: item.candidate,
+        reasons: item.reasons
+      }));
+      if (result.warnings.length === 0 && rejected.length === 0) {
+        return [
+          {
+            scope: registration.scope,
+            scopeId: registration.scopeId,
+            candidate: null,
+            reasons: ["valid"]
+          }
+        ];
+      }
+      return [...rejected, ...result.warnings.map((reason) => ({ scope: registration.scope, scopeId: registration.scopeId, candidate: null, reasons: [reason] }))];
+    });
+  }, [check, registrations]);
+  return /* @__PURE__ */ jsx75(ScrollArea, { className: "min-h-0 flex-1 overflow-y-auto pr-1", "data-testid": "fallback-editor-details-scroll", children: /* @__PURE__ */ jsxs54("aside", { className: "flex flex-col gap-4", children: [
+    /* @__PURE__ */ jsxs54(SectionCard, { className: "p-4", children: [
+      /* @__PURE__ */ jsx75(SectionHeader2, { title: "Primary service", description: "Current editor target and change state." }),
+      /* @__PURE__ */ jsxs54("div", { className: "mt-4 space-y-2", children: [
+        /* @__PURE__ */ jsx75(
+          DetailRow,
+          {
+            label: "Service",
+            value: service ? `${service.name ?? "Unnamed"} (#${String(service.id)})` : "No service selected"
+          }
+        ),
+        /* @__PURE__ */ jsx75(DetailRow, { label: "Platform", value: service?.platform ?? "-" }),
+        /* @__PURE__ */ jsx75(DetailRow, { label: "Rate", value: typeof service?.rate === "number" ? String(service.rate) : "-" }),
+        /* @__PURE__ */ jsx75(DetailRow, { label: "Changed", value: state.changed ? "Yes" : "No" })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs54(SectionCard, { className: "p-4", children: [
+      /* @__PURE__ */ jsx75(SectionHeader2, { title: "Policy", description: "Effective fallback rules applied by the provider." }),
+      /* @__PURE__ */ jsxs54("div", { className: "mt-4 space-y-2", children: [
+        /* @__PURE__ */ jsx75(DetailRow, { label: "Constraint fit", value: settings.requireConstraintFit ? "Enabled" : "Disabled" }),
+        /* @__PURE__ */ jsx75(DetailRow, { label: "Rate policy", value: formatRatePolicy(settings) }),
+        /* @__PURE__ */ jsx75(DetailRow, { label: "Strategy", value: settings.selectionStrategy ?? "priority" }),
+        /* @__PURE__ */ jsx75(DetailRow, { label: "Mode", value: settings.mode ?? "strict" })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs54(SectionCard, { className: "flex min-h-0 flex-col overflow-hidden", children: [
+      /* @__PURE__ */ jsx75("div", { className: "border-b border-slate-200 px-4 py-4 dark:border-slate-800", children: /* @__PURE__ */ jsx75(SectionHeader2, { title: "Diagnostics", description: "Live validation hints for the selected service registrations." }) }),
+      /* @__PURE__ */ jsx75(ScrollArea, { className: "min-h-0 flex-1", children: /* @__PURE__ */ jsx75("div", { className: "space-y-2 p-3", children: diagnostics.length ? diagnostics.map((entry, index) => {
+        const tone = entry.reasons[0] === "valid" ? "success" : entry.reasons.includes("rate_violation") || entry.reasons.includes("constraint_mismatch") ? "danger" : "warning";
+        return /* @__PURE__ */ jsx75(
+          "div",
+          {
+            className: "rounded-md border border-slate-200 bg-slate-50/80 p-3 dark:border-slate-800 dark:bg-slate-900/60",
+            children: /* @__PURE__ */ jsxs54("div", { className: "flex flex-wrap items-center gap-2", children: [
+              /* @__PURE__ */ jsx75(ToneBadge, { label: entry.scope === "global" ? "Global" : `Node ${entry.scopeId ?? ""}`.trim() }),
+              entry.candidate != null ? /* @__PURE__ */ jsx75(ToneBadge, { label: `Candidate #${String(entry.candidate)}`, tone: "info" }) : null,
+              /* @__PURE__ */ jsx75(ToneBadge, { label: entry.reasons.join(", "), tone })
+            ] })
+          },
+          `${entry.scope}:${String(entry.scopeId ?? "global")}:${String(entry.candidate ?? "none")}:${index}`
+        );
+      }) : /* @__PURE__ */ jsx75("div", { className: "rounded-md border border-dashed border-slate-300 bg-slate-50/80 px-4 py-8 text-center text-sm text-slate-500 dark:border-slate-700 dark:bg-slate-900/40 dark:text-slate-400", children: "No registrations selected yet." }) }) })
+    ] }),
+    /* @__PURE__ */ jsxs54(SectionCard, { className: "flex min-h-0 flex-col overflow-hidden", children: [
+      /* @__PURE__ */ jsx75("div", { className: "border-b border-slate-200 px-4 py-4 dark:border-slate-800", children: /* @__PURE__ */ jsx75(SectionHeader2, { title: "Current payload", description: "Serialized fallback state from the provider." }) }),
+      /* @__PURE__ */ jsx75(ScrollArea, { className: "min-h-0 flex-1", children: /* @__PURE__ */ jsx75("pre", { className: "p-4 text-xs text-slate-700 dark:text-slate-200", children: JSON.stringify(state.current, null, 2) }) })
+    ] })
+  ] }) });
+}
+function toScopeRef(registration) {
+  if (registration.scope === "global") {
+    return {
+      scope: "global",
+      primary: registration.primary
+    };
+  }
+  return {
+    scope: "node",
+    nodeId: registration.scopeId
+  };
+}
+function formatRatePolicy(settings) {
+  if (settings.ratePolicy?.kind === "eq_primary") return "eq_primary";
+  if (settings.ratePolicy?.kind === "within_pct") return `within_pct (${settings.ratePolicy.pct}%)`;
+  if (settings.ratePolicy?.kind === "at_least_pct_lower") return `at_least_pct_lower (${settings.ratePolicy.pct}%)`;
+  if (settings.ratePolicy?.kind === "lte_primary") return `lte_primary (${settings.ratePolicy.pct}%)`;
+  return "lte_primary (5%)";
+}
+
+// src/workspace/fallback-editor/fallback-editor-header.tsx
+import { RotateCcw, Save, ShieldCheck } from "lucide-react";
+import { jsx as jsx76, jsxs as jsxs55 } from "react/jsx-runtime";
+function FallbackEditorHeader({
+  activeServiceLabel,
+  registrationCount,
+  changed,
+  onReset,
+  onValidate,
+  onSave,
+  resetting = false,
+  validating = false,
+  saving = false
+}) {
+  return /* @__PURE__ */ jsx76(SectionCard, { className: "px-5 py-4", children: /* @__PURE__ */ jsxs55("div", { className: "flex flex-col gap-4 xl:flex-row xl:items-center xl:justify-between", children: [
+    /* @__PURE__ */ jsxs55("div", { className: "space-y-3", children: [
+      /* @__PURE__ */ jsx76(
+        SectionHeader2,
+        {
+          title: "Fallback editor",
+          description: "Manage global and node-scoped fallback registrations with the workspace design system."
+        }
+      ),
+      /* @__PURE__ */ jsxs55("div", { className: "flex flex-wrap items-center gap-2 text-xs", children: [
+        /* @__PURE__ */ jsx76(ToneBadge, { label: activeServiceLabel ?? "No service selected", tone: "info" }),
+        /* @__PURE__ */ jsx76(ToneBadge, { label: `${registrationCount} registration${registrationCount === 1 ? "" : "s"}` }),
+        /* @__PURE__ */ jsx76(ToneBadge, { label: changed ? "Unsaved changes" : "Synced", tone: changed ? "warning" : "success" })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs55("div", { className: "flex flex-wrap items-center gap-2", children: [
+      /* @__PURE__ */ jsxs55(Button, { type: "button", variant: "outline", onClick: onReset, disabled: resetting, children: [
+        /* @__PURE__ */ jsx76(RotateCcw, { className: "size-4" }),
+        resetting ? "Resetting..." : "Reset"
+      ] }),
+      /* @__PURE__ */ jsxs55(Button, { type: "button", variant: "outline", onClick: onValidate, disabled: validating, children: [
+        /* @__PURE__ */ jsx76(ShieldCheck, { className: "size-4" }),
+        validating ? "Validating..." : "Validate"
+      ] }),
+      /* @__PURE__ */ jsx76(Separator2, { orientation: "vertical", className: "hidden h-8 xl:block" }),
+      /* @__PURE__ */ jsxs55(Button, { type: "button", onClick: onSave, disabled: saving, children: [
+        /* @__PURE__ */ jsx76(Save, { className: "size-4" }),
+        saving ? "Saving..." : "Save changes"
+      ] })
+    ] })
+  ] }) });
+}
+
+// src/workspace/fallback-editor/fallback-registrations-panel.tsx
+import { useActiveFallbackRegistrations as useActiveFallbackRegistrations3, useEligibleServiceList as useEligibleServiceList2, useFallbackEditor as useFallbackEditor3 } from "@timeax/digital-service-engine/react";
+import { Plus, Trash2, X as X2 } from "lucide-react";
+import { useCallback as useCallback20, useState as useState35 } from "react";
+
+// src/workspace/fallback-editor/fallback-dialogs.tsx
+import { InputField as InputField16 } from "@timeax/form-palette";
+import { useActiveFallbackRegistrations as useActiveFallbackRegistrations2, useEligibleServiceList, useFallbackEditor as useFallbackEditor2 } from "@timeax/digital-service-engine/react";
+import { Check, Search } from "lucide-react";
+import { useEffect as useEffect21, useMemo as useMemo35, useState as useState34 } from "react";
+import { jsx as jsx77, jsxs as jsxs56 } from "react/jsx-runtime";
+function FallbackAddRegistrationDialog({
+  open,
+  onClose,
+  onSelect
+}) {
+  const { activeServiceId, serviceProps, snapshot } = useFallbackEditor2();
+  const registrations = useActiveFallbackRegistrations2();
+  const [scope, setScope] = useState34("global");
+  const [nodeId, setNodeId] = useState34("");
+  const mode = useMemo35(() => {
+    if (snapshot) return "snapshot";
+    if (serviceProps) return "props";
+    return "none";
+  }, [snapshot, serviceProps]);
+  useEffect21(() => {
+    if (open) {
+      setScope("global");
+      setNodeId("");
+    }
+  }, [open]);
+  const hasGlobal = useMemo35(() => registrations.some((registration) => registration.scope === "global"), [registrations]);
+  const nodeTargets = useMemo35(() => {
+    if (activeServiceId === void 0 || activeServiceId === null) return [];
+    if (mode === "snapshot" && snapshot?.serviceMap) {
+      const entries = [];
+      for (const [id, primaryIds] of Object.entries(snapshot.serviceMap)) {
+        const matchesPrimary = (primaryIds ?? []).some((serviceId) => String(serviceId) === String(activeServiceId));
+        if (!matchesPrimary) continue;
+        const meta = resolveNodeMeta(serviceProps, id);
+        entries.push({
+          id,
+          kind: meta.kind,
+          label: meta.label,
+          serviceId: activeServiceId
+        });
+      }
+      return dedupeNodeTargets(entries);
+    }
+    if (mode === "props" && serviceProps) {
+      const entries = [];
+      for (const tag of serviceProps.filters ?? []) {
+        if (tag.service_id == null || String(tag.service_id) !== String(activeServiceId)) continue;
+        entries.push({
+          id: tag.id,
+          kind: "tag",
+          label: tag.label ?? tag.title ?? tag.id,
+          serviceId: tag.service_id
+        });
+      }
+      for (const field of serviceProps.fields ?? []) {
+        if (field.service_id != null && String(field.service_id) === String(activeServiceId)) {
+          entries.push({
+            id: field.id,
+            kind: "field",
+            label: field.label ?? field.title ?? field.id,
+            serviceId: field.service_id
+          });
+        }
+        for (const option of field.options ?? []) {
+          if (option.service_id == null || String(option.service_id) !== String(activeServiceId)) continue;
+          entries.push({
+            id: option.id,
+            kind: "option",
+            label: option.label ?? option.title ?? String(option.value ?? option.id),
+            serviceId: option.service_id
+          });
+        }
+      }
+      return dedupeNodeTargets(entries);
+    }
+    return [];
+  }, [activeServiceId, mode, serviceProps, snapshot]);
+  useEffect21(() => {
+    if (hasGlobal && scope === "global") {
+      setScope("node");
+    }
+  }, [hasGlobal, scope]);
+  useEffect21(() => {
+    if (!nodeId) return;
+    if (nodeTargets.some((entry) => entry.id === nodeId)) return;
+    setNodeId("");
+  }, [nodeId, nodeTargets]);
+  function handleContinue() {
+    if (activeServiceId === void 0 || activeServiceId === null) return;
+    if (scope === "global") {
+      onSelect(
+        {
+          scope: "global",
+          primary: activeServiceId
+        },
+        activeServiceId
+      );
+      return;
+    }
+    if (!nodeId) return;
+    const node = nodeTargets.find((entry) => entry.id === nodeId);
+    onSelect(
+      {
+        scope: "node",
+        nodeId
+      },
+      node?.serviceId ?? activeServiceId
+    );
+  }
+  const nodeScopeDisabled = nodeTargets.length === 0;
+  return /* @__PURE__ */ jsx77(
+    ModalShell,
+    {
+      open,
+      onClose,
+      title: "Add registration",
+      description: "Choose the registration scope before selecting fallback candidates.",
+      footer: /* @__PURE__ */ jsxs56("div", { className: "flex items-center justify-end gap-2", children: [
+        /* @__PURE__ */ jsx77(Button, { type: "button", variant: "ghost", onClick: onClose, className: "rounded-md", children: "Cancel" }),
+        /* @__PURE__ */ jsx77(Button, { type: "button", onClick: handleContinue, disabled: activeServiceId === void 0 || scope === "node" && !nodeId, className: "rounded-md", children: "Continue" })
+      ] }),
+      children: /* @__PURE__ */ jsxs56("div", { className: "space-y-5", children: [
+        /* @__PURE__ */ jsxs56("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ jsx77("label", { className: "text-sm font-medium text-slate-900 dark:text-slate-100", children: "Scope" }),
+          /* @__PURE__ */ jsx77(
+            InputField16,
+            {
+              variant: "radio",
+              label: "Scope",
+              value: scope,
+              onChange: ({ value }) => setScope(value),
+              options: [
+                ...!hasGlobal ? [{ value: "global", label: "Global" }] : [],
+                { value: "node", label: nodeScopeDisabled ? "Node (Unavailable)" : "Node" }
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx77("p", { className: "text-xs text-slate-500 dark:text-slate-400", children: scope === "global" ? "Use one global registration for this primary service." : mode === "snapshot" ? "Pick a node currently active in the order snapshot for this primary service." : mode === "props" ? "Pick a tag, field, or option from ServiceProps that maps to this primary service." : "Node-scoped registration is unavailable without OrderSnapshot or ServiceProps." })
+        ] }),
+        scope === "node" ? /* @__PURE__ */ jsxs56("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ jsx77("label", { className: "text-sm font-medium text-slate-900 dark:text-slate-100", children: "Node id" }),
+          /* @__PURE__ */ jsx77(
+            InputField16,
+            {
+              variant: "select",
+              label: "Node id",
+              value: nodeId || void 0,
+              onChange: ({ value }) => setNodeId(String(value ?? "")),
+              options: nodeTargets.map((node) => ({
+                value: node.id,
+                label: `[${node.kind}] ${node.label} - #${String(node.serviceId)}`
+              })),
+              placeholder: "Select node",
+              searchable: true,
+              clearable: false,
+              fullWidth: true
+            }
+          ),
+          nodeScopeDisabled ? /* @__PURE__ */ jsx77("p", { className: "text-xs text-slate-500 dark:text-slate-400", children: mode === "snapshot" ? "No active snapshot nodes were found for this primary service." : mode === "props" ? "No ServiceProps nodes were found for this primary service." : "Node-scoped registration requires either OrderSnapshot or ServiceProps." }) : null
+        ] }) : null
+      ] })
+    }
+  );
+}
+function FallbackAddCandidatesDialog({
+  open,
+  onClose,
+  context,
+  primaryId
+}) {
+  const { eligible, addMany } = useFallbackEditor2();
+  const eligibleServices = useEligibleServiceList();
+  const [query, setQuery] = useState34("");
+  const [filterEligibleOnly, setFilterEligibleOnly] = useState34(true);
+  const [selected, setSelected] = useState34(/* @__PURE__ */ new Set());
+  const [submitting, setSubmitting] = useState34(false);
+  useEffect21(() => {
+    if (!open) {
+      setQuery("");
+      setFilterEligibleOnly(true);
+      setSelected(/* @__PURE__ */ new Set());
+    }
+  }, [open]);
+  const allowedIds = useMemo35(() => {
+    if (!context || !filterEligibleOnly) return null;
+    return new Set(eligible(context).map((id) => String(id)));
+  }, [context, eligible, filterEligibleOnly]);
+  const items = useMemo35(() => {
+    const normalizedQuery = query.trim().toLowerCase();
+    return eligibleServices.filter((service) => {
+      if (primaryId !== void 0 && String(service.id) === String(primaryId)) return false;
+      if (allowedIds && !allowedIds.has(String(service.id))) return false;
+      if (!normalizedQuery) return true;
+      return String(service.id).includes(normalizedQuery) || String(service.name ?? "").toLowerCase().includes(normalizedQuery) || String(service.platform ?? "").toLowerCase().includes(normalizedQuery);
+    });
+  }, [allowedIds, eligibleServices, primaryId, query]);
+  function toggle(id) {
+    setSelected((previous) => {
+      const next = new Set(previous);
+      const key = String(id);
+      if (next.has(key)) next.delete(key);
+      else next.add(key);
+      return next;
+    });
+  }
+  async function handleAdd() {
+    if (!context || selected.size === 0) return;
+    setSubmitting(true);
+    try {
+      const ids = items.filter((item) => selected.has(String(item.id))).map((item) => item.id);
+      addMany(context, ids);
+      onClose();
+    } finally {
+      setSubmitting(false);
+    }
+  }
+  return /* @__PURE__ */ jsx77(
+    ModalShell,
+    {
+      open: open && Boolean(context),
+      onClose,
+      title: "Add fallback services",
+      description: "Search and select one or more eligible fallback candidates.",
+      size: "wide",
+      footer: /* @__PURE__ */ jsxs56("div", { className: "flex items-center justify-between gap-4", children: [
+        /* @__PURE__ */ jsxs56("p", { className: "text-sm text-slate-500 dark:text-slate-400", children: [
+          selected.size,
+          " selected"
+        ] }),
+        /* @__PURE__ */ jsxs56("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx77(Button, { type: "button", variant: "ghost", onClick: onClose, className: "rounded-md", children: "Cancel" }),
+          /* @__PURE__ */ jsx77(Button, { type: "button", onClick: () => void handleAdd(), disabled: selected.size === 0 || submitting, className: "rounded-md", children: submitting ? "Adding..." : "Add selected" })
+        ] })
+      ] }),
+      children: /* @__PURE__ */ jsxs56("div", { className: "space-y-4", children: [
+        /* @__PURE__ */ jsxs56("div", { className: "grid gap-3 md:grid-cols-[minmax(0,1fr)_220px]", children: [
+          /* @__PURE__ */ jsx77(
+            InputField16,
+            {
+              variant: "text",
+              label: "Search eligible services",
+              value: query,
+              onChange: ({ value }) => setQuery(String(value ?? "")),
+              placeholder: "Search eligible services",
+              leadingControl: /* @__PURE__ */ jsx77(Search, { className: "size-4 text-slate-400" }),
+              joinControls: true,
+              extendBoxToControls: true,
+              fullWidth: true
+            }
+          ),
+          /* @__PURE__ */ jsx77("div", { className: "rounded-md border border-slate-200 bg-slate-50/70 px-4 py-3 dark:border-slate-800 dark:bg-slate-900/70", children: /* @__PURE__ */ jsx77(
+            InputField16,
+            {
+              variant: "toggle",
+              label: "Filter eligible only",
+              value: filterEligibleOnly,
+              onChange: ({ value }) => setFilterEligibleOnly(Boolean(value)),
+              onText: "On",
+              offText: "Off"
+            }
+          ) })
+        ] }),
+        /* @__PURE__ */ jsx77(
+          VirtualServiceList,
+          {
+            items,
+            selected,
+            onToggle: toggle,
+            emptyText: "No eligible services found."
+          }
+        )
+      ] })
+    }
+  );
+}
+function VirtualServiceList({
+  items,
+  selected,
+  onToggle,
+  height = 420,
+  rowHeight = 72,
+  emptyText = "No services found."
+}) {
+  const [scrollTop, setScrollTop] = useState34(0);
+  const total = items.length;
+  const visibleCount = Math.ceil(height / rowHeight);
+  const overscan = 6;
+  const start = Math.max(0, Math.floor(scrollTop / rowHeight) - overscan);
+  const end = Math.min(total, start + visibleCount + overscan * 2);
+  const visibleItems = items.slice(start, end);
+  if (total === 0) {
+    return /* @__PURE__ */ jsx77(
+      "div",
+      {
+        className: "flex items-center justify-center rounded-md border border-dashed border-slate-300 bg-slate-50/80 text-sm text-slate-500 dark:border-slate-700 dark:bg-slate-900/40 dark:text-slate-400",
+        style: { height },
+        children: emptyText
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx77(
+    "div",
+    {
+      className: "overflow-auto rounded-md border border-slate-200 bg-white/90 dark:border-slate-800 dark:bg-slate-950/70",
+      style: { height },
+      onScroll: (event) => setScrollTop(event.currentTarget.scrollTop),
+      children: /* @__PURE__ */ jsx77("div", { className: "relative", style: { height: total * rowHeight }, children: visibleItems.map((item, index) => {
+        const absoluteIndex = start + index;
+        const key = String(item.id);
+        const checked = selected.has(key);
+        return /* @__PURE__ */ jsxs56(
+          "button",
+          {
+            type: "button",
+            onClick: () => onToggle(item.id),
+            className: cn(
+              "absolute left-0 right-0 flex items-center justify-between gap-3 border-b border-slate-100 px-4 text-left transition dark:border-slate-800",
+              checked ? "bg-sky-50 dark:bg-sky-500/10" : "bg-white/90 hover:bg-slate-50 dark:bg-slate-950/70 dark:hover:bg-slate-900"
+            ),
+            style: { top: absoluteIndex * rowHeight, height: rowHeight },
+            children: [
+              /* @__PURE__ */ jsxs56("div", { className: "min-w-0", children: [
+                /* @__PURE__ */ jsxs56("div", { className: "truncate text-sm font-semibold text-slate-900 dark:text-slate-100", children: [
+                  "Service #",
+                  String(item.id),
+                  " - ",
+                  item.name ?? "Unnamed"
+                ] }),
+                /* @__PURE__ */ jsxs56("div", { className: "mt-1 text-xs text-slate-500 dark:text-slate-400", children: [
+                  item.platform ?? "Unknown platform",
+                  typeof item.rate === "number" ? ` | Rate ${item.rate}` : ""
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxs56("div", { className: "flex items-center gap-2", children: [
+                checked ? /* @__PURE__ */ jsx77(ToneBadge, { label: "Selected", tone: "info" }) : null,
+                /* @__PURE__ */ jsx77(
+                  "span",
+                  {
+                    className: cn(
+                      "inline-flex size-5 items-center justify-center rounded-md border transition",
+                      checked ? "border-sky-500 bg-sky-500 text-white" : "border-slate-300 bg-white text-transparent dark:border-slate-700 dark:bg-slate-900"
+                    ),
+                    children: /* @__PURE__ */ jsx77(Check, { className: "size-3.5" })
+                  }
+                )
+              ] })
+            ]
+          },
+          key
+        );
+      }) })
+    }
+  );
+}
+function resolveNodeMeta(props, nodeId) {
+  if (!props) return { kind: "node", label: nodeId };
+  const tag = props.filters?.find((entry) => entry.id === nodeId);
+  if (tag) {
+    return {
+      kind: "tag",
+      label: tag.label ?? tag.title ?? tag.id
+    };
+  }
+  const field = props.fields?.find((entry) => entry.id === nodeId);
+  if (field) {
+    return {
+      kind: "field",
+      label: field.label ?? field.title ?? field.id
+    };
+  }
+  for (const fieldItem of props.fields ?? []) {
+    const option = fieldItem.options?.find((entry) => entry.id === nodeId);
+    if (!option) continue;
+    return {
+      kind: "option",
+      label: option.label ?? option.title ?? String(option.value ?? option.id)
+    };
+  }
+  return { kind: "node", label: nodeId };
+}
+function dedupeNodeTargets(entries) {
+  const seen = /* @__PURE__ */ new Set();
+  return entries.filter((entry) => {
+    if (seen.has(entry.id)) return false;
+    seen.add(entry.id);
+    return true;
+  });
+}
+function registrationToScope(registration) {
+  if (registration.scope === "global") {
+    return {
+      scope: "global",
+      primary: registration.primary
+    };
+  }
+  return {
+    scope: "node",
+    nodeId: registration.scopeId
+  };
+}
+
+// src/workspace/fallback-editor/fallback-registrations-panel.tsx
+import { Fragment as Fragment15, jsx as jsx78, jsxs as jsxs57 } from "react/jsx-runtime";
+function FallbackRegistrationsPanel() {
+  const { activeServiceId, remove, clear, check } = useFallbackEditor3();
+  const registrations = useActiveFallbackRegistrations3();
+  const eligibleServices = useEligibleServiceList2();
+  const [candidatePickerOpen, setCandidatePickerOpen] = useState35(false);
+  const [candidateContext, setCandidateContext] = useState35(null);
+  const [candidatePrimaryId, setCandidatePrimaryId] = useState35(void 0);
+  const [registrationDialogOpen, setRegistrationDialogOpen] = useState35(false);
+  const openCandidatePicker = useCallback20((context, primaryId) => {
+    setCandidateContext(context);
+    setCandidatePrimaryId(primaryId);
+    setCandidatePickerOpen(true);
+  }, []);
+  if (activeServiceId === void 0 || activeServiceId === null) {
+    return /* @__PURE__ */ jsx78(SectionCard, { className: "p-5", children: /* @__PURE__ */ jsx78(
+      EmptyState2,
+      {
+        title: "Select a primary service",
+        description: "Pick a service from the left sidebar to review or create fallback registrations."
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsxs57(Fragment15, { children: [
+    /* @__PURE__ */ jsxs57(SectionCard, { className: "flex min-h-0 flex-col flex-1 overflow-hidden", children: [
+      /* @__PURE__ */ jsx78("div", { className: "border-b border-slate-200 px-5 py-4 dark:border-slate-800", children: /* @__PURE__ */ jsx78(
+        SectionHeader2,
+        {
+          title: "Registered fallbacks",
+          description: "Add global or node-scoped registrations, then curate the fallback candidates for each scope.",
+          action: /* @__PURE__ */ jsxs57(Button, { type: "button", variant: "outline", onClick: () => setRegistrationDialogOpen(true), className: "rounded-md", children: [
+            /* @__PURE__ */ jsx78(Plus, { className: "size-4" }),
+            "Add registration"
+          ] })
+        }
+      ) }),
+      /* @__PURE__ */ jsx78(ScrollArea, { className: "min-h-0 flex-1", "data-testid": "fallback-editor-registrations-scroll", children: /* @__PURE__ */ jsx78("div", { className: "space-y-4 p-4", children: registrations.length === 0 ? /* @__PURE__ */ jsx78(
+        EmptyState2,
+        {
+          title: "No registrations yet",
+          description: "Create a global or node-scoped registration for the selected primary service."
+        }
+      ) : registrations.map((registration, index) => {
+        const context = registrationToScope(registration);
+        const candidates = registration.services;
+        return /* @__PURE__ */ jsxs57(
+          "div",
+          {
+            className: "rounded-md border border-slate-200 bg-slate-50/80 p-4 shadow-sm dark:border-slate-800 dark:bg-slate-900/60",
+            children: [
+              /* @__PURE__ */ jsxs57("div", { className: "flex flex-wrap items-start justify-between gap-3", children: [
+                /* @__PURE__ */ jsxs57("div", { className: "space-y-2", children: [
+                  /* @__PURE__ */ jsxs57("div", { className: "flex flex-wrap items-center gap-2", children: [
+                    /* @__PURE__ */ jsx78(ToneBadge, { label: registration.scope === "global" ? "Global registration" : `Node ${registration.scopeId ?? ""}`.trim(), tone: "info" }),
+                    /* @__PURE__ */ jsx78(ToneBadge, { label: `Primary #${String(registration.primary)}` })
+                  ] }),
+                  /* @__PURE__ */ jsx78("p", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: registration.scope === "global" ? "Primary service fallback list" : `Node-scoped fallback list for ${registration.scopeId}` })
+                ] }),
+                /* @__PURE__ */ jsxs57("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsxs57(Button, { type: "button", variant: "outline", onClick: () => openCandidatePicker(context, registration.primary), className: "rounded-md", children: [
+                    /* @__PURE__ */ jsx78(Plus, { className: "size-4" }),
+                    "Add fallback"
+                  ] }),
+                  /* @__PURE__ */ jsxs57(Button, { type: "button", variant: "outline", onClick: () => clear(context), className: "rounded-md", children: [
+                    /* @__PURE__ */ jsx78(Trash2, { className: "size-4" }),
+                    "Clear"
+                  ] })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsx78("div", { className: "mt-4 flex flex-wrap gap-2", children: candidates.length === 0 ? /* @__PURE__ */ jsx78("span", { className: "text-xs text-slate-500 dark:text-slate-400", children: "No fallback services yet." }) : candidates.map((candidate) => {
+                const preview = check(context, [candidate]);
+                const rejected = preview.rejected[0];
+                const service = eligibleServices.find((entry) => String(entry.id) === String(candidate));
+                return /* @__PURE__ */ jsxs57(
+                  "div",
+                  {
+                    className: [
+                      "inline-flex items-center gap-2 rounded-md border px-3 py-1.5 text-xs",
+                      rejected ? "border-rose-200 bg-rose-50 text-rose-700 dark:border-rose-500/30 dark:bg-rose-500/10 dark:text-rose-200" : "border-slate-200 bg-white text-slate-700 dark:border-slate-700 dark:bg-slate-950 dark:text-slate-200"
+                    ].join(" "),
+                    children: [
+                      /* @__PURE__ */ jsx78("span", { children: service ? `#${String(service.id)} - ${service.name ?? "Unnamed"}` : `#${String(candidate)}` }),
+                      /* @__PURE__ */ jsx78(
+                        ToneBadge,
+                        {
+                          label: rejected ? rejected.reasons.join(", ") : "valid",
+                          tone: rejected ? "danger" : "success"
+                        }
+                      ),
+                      /* @__PURE__ */ jsx78(
+                        "button",
+                        {
+                          type: "button",
+                          "aria-label": `Remove candidate ${String(candidate)}`,
+                          onClick: () => remove(context, candidate),
+                          className: "text-current/70 transition hover:text-current",
+                          children: /* @__PURE__ */ jsx78(X2, { className: "size-3.5" })
+                        }
+                      )
+                    ]
+                  },
+                  String(candidate)
+                );
+              }) })
+            ]
+          },
+          `${registration.scope}:${String(registration.scopeId ?? "global")}:${index}`
+        );
+      }) }) })
+    ] }),
+    /* @__PURE__ */ jsx78(
+      FallbackAddRegistrationDialog,
+      {
+        open: registrationDialogOpen,
+        onClose: () => setRegistrationDialogOpen(false),
+        onSelect: (context, primaryId) => {
+          setRegistrationDialogOpen(false);
+          openCandidatePicker(context, primaryId);
+        }
+      }
+    ),
+    /* @__PURE__ */ jsx78(
+      FallbackAddCandidatesDialog,
+      {
+        open: candidatePickerOpen,
+        onClose: () => setCandidatePickerOpen(false),
+        context: candidateContext,
+        primaryId: candidatePrimaryId
+      }
+    )
+  ] });
+}
+
+// src/workspace/fallback-editor/fallback-service-sidebar.tsx
+import { useFallbackEditor as useFallbackEditor4, usePrimaryServiceList as usePrimaryServiceList2 } from "@timeax/digital-service-engine/react";
+import { InputField as InputField17 } from "@timeax/form-palette";
+import { Search as Search2 } from "lucide-react";
+import { useMemo as useMemo36, useState as useState36 } from "react";
+import { jsx as jsx79, jsxs as jsxs58 } from "react/jsx-runtime";
+function FallbackServiceSidebar() {
+  const { activeServiceId, setActiveServiceId, get } = useFallbackEditor4();
+  const services2 = usePrimaryServiceList2();
+  const [query, setQuery] = useState36("");
+  const filtered = useMemo36(() => {
+    const normalizedQuery = query.trim().toLowerCase();
+    if (!normalizedQuery) return services2;
+    return services2.filter((service) => {
+      return String(service.id).includes(normalizedQuery) || String(service.name ?? "").toLowerCase().includes(normalizedQuery) || String(service.platform ?? "").toLowerCase().includes(normalizedQuery);
+    });
+  }, [query, services2]);
+  return /* @__PURE__ */ jsxs58(SectionCard, { className: "flex h-full min-h-0 min-w-70 flex-col overflow-hidden border-r-0", children: [
+    /* @__PURE__ */ jsxs58("div", { className: "border-b border-slate-200 px-4 py-4 dark:border-slate-800 space-y-2", children: [
+      /* @__PURE__ */ jsx79(SectionHeader2, { title: "Primary services", description: "Choose the primary service whose fallback registrations you want to edit." }),
+      /* @__PURE__ */ jsx79(
+        InputField17,
+        {
+          variant: "text",
+          value: query,
+          onChange: ({ value }) => setQuery(String(value ?? "")),
+          placeholder: "Search primary service",
+          icon: /* @__PURE__ */ jsx79(Search2, { className: "size-4 text-slate-400" })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx79(ScrollArea, { className: "min-h-0 flex-1", children: /* @__PURE__ */ jsx79("div", { className: "space-y-2 p-3", children: filtered.map((service) => {
+      const selected = String(service.id) === String(activeServiceId);
+      const count = get(service.id).length;
+      return /* @__PURE__ */ jsx79(
+        "button",
+        {
+          type: "button",
+          onClick: () => setActiveServiceId(service.id),
+          className: cn(
+            "w-full rounded-md border px-4 py-3 text-left transition",
+            "hover:-translate-y-0.5 hover:border-slate-300 hover:shadow-md dark:hover:border-slate-700",
+            selected ? "border-sky-300 bg-sky-50 shadow-sm dark:border-sky-500/40 dark:bg-sky-500/10" : "border-slate-200 bg-white/90 dark:border-slate-800 dark:bg-slate-950/70"
+          ),
+          children: /* @__PURE__ */ jsxs58("div", { className: "flex items-start justify-between gap-3", children: [
+            /* @__PURE__ */ jsxs58("div", { className: "min-w-0", children: [
+              /* @__PURE__ */ jsxs58("p", { title: service.name, className: "truncate text-sm font-semibold text-slate-900 dark:text-slate-100", children: [
+                "Service #",
+                String(service.id),
+                " - ",
+                service.name ?? "Unnamed"
+              ] }),
+              /* @__PURE__ */ jsxs58("p", { className: "mt-1 text-xs text-slate-500 dark:text-slate-400", children: [
+                service.platform ?? "Unknown platform",
+                typeof service.rate === "number" ? ` | Rate ${service.rate}` : ""
+              ] })
+            ] }),
+            /* @__PURE__ */ jsx79(ToneBadge, { label: `${count} reg`, tone: selected ? "info" : "neutral", className: "shrink-0" })
+          ] })
+        },
+        String(service.id)
+      );
+    }) }) })
+  ] });
+}
+
+// src/workspace/fallback-editor/fallback-settings-panel.tsx
+import { useFallbackEditor as useFallbackEditor5 } from "@timeax/digital-service-engine/react";
+import { InputField as InputField18 } from "@timeax/form-palette";
+import { useEffect as useEffect22, useState as useState37 } from "react";
+import { jsx as jsx80, jsxs as jsxs59 } from "react/jsx-runtime";
+function FallbackSettingsPanel() {
+  const { settings, saveSettings, settingsSaving } = useFallbackEditor5();
+  const [draft, setDraft] = useState37(settings);
+  const [error, setError] = useState37(null);
+  const [saved, setSaved] = useState37(false);
+  useEffect22(() => {
+    setDraft(settings);
+    setSaved(false);
+    setError(null);
+  }, [settings]);
+  const changed = JSON.stringify(draft ?? {}) !== JSON.stringify(settings ?? {});
+  const ratePolicy = draft.ratePolicy ?? { kind: "lte_primary", pct: 5 };
+  async function handleSave() {
+    setError(null);
+    setSaved(false);
+    try {
+      await saveSettings(draft);
+      setSaved(true);
+    } catch (nextError) {
+      setError(nextError instanceof Error ? nextError.message : "Failed to save fallback settings.");
+    }
+  }
+  function setRatePolicy(next) {
+    setDraft((previous) => ({
+      ...previous,
+      ratePolicy: next
+    }));
+  }
+  return /* @__PURE__ */ jsxs59(SectionCard, { className: "flex flex-1 min-h-0 flex-col overflow-hidden", children: [
+    /* @__PURE__ */ jsx80("div", { className: "border-b border-slate-200 px-5 py-4 dark:border-slate-800", children: /* @__PURE__ */ jsx80(
+      SectionHeader2,
+      {
+        title: "Fallback settings",
+        description: "Persist policy changes through the host editor without changing the fallback payload shape.",
+        action: /* @__PURE__ */ jsx80(Button, { type: "button", onClick: () => void handleSave(), disabled: !changed || settingsSaving, className: "rounded-md", children: settingsSaving ? "Saving..." : "Save settings" })
+      }
+    ) }),
+    /* @__PURE__ */ jsx80(ScrollArea, { className: "min-h-0 flex-1 p-5", "data-testid": "fallback-editor-settings-scroll", children: /* @__PURE__ */ jsxs59("div", { className: "space-y-5", children: [
+      /* @__PURE__ */ jsx80(SettingRow, { title: "Require constraint fit", hint: "Reject or warn when a candidate does not match effective tag constraints.", children: /* @__PURE__ */ jsx80(
+        InputField18,
+        {
+          variant: "toggle",
+          value: Boolean(draft.requireConstraintFit),
+          onChange: ({ value }) => setDraft((previous) => ({
+            ...previous,
+            requireConstraintFit: Boolean(value)
+          })),
+          onText: "Enabled",
+          offText: "Disabled"
+        }
+      ) }),
+      /* @__PURE__ */ jsx80(SettingRow, { title: "Rate policy", hint: "Controls how fallback service rates are compared against the primary service.", children: /* @__PURE__ */ jsx80("div", { className: "flex flex-col gap-2 md:items-end", children: /* @__PURE__ */ jsx80(
+        InputField18,
+        {
+          variant: "select",
+          value: ratePolicy.kind,
+          onChange: ({ value }) => {
+            const kind = value;
+            const pct = ratePolicy.kind === "eq_primary" ? 5 : ratePolicy.pct;
+            if (kind === "eq_primary") {
+              setRatePolicy({ kind: "eq_primary" });
+              return;
+            }
+            if (kind === "lte_primary") {
+              setRatePolicy({ kind: "lte_primary", pct });
+              return;
+            }
+            if (kind === "within_pct") {
+              setRatePolicy({ kind: "within_pct", pct });
+              return;
+            }
+            setRatePolicy({ kind: "at_least_pct_lower", pct });
+          },
+          options: [
+            { value: "eq_primary", label: "Equals Primary" },
+            { value: "lte_primary", label: "Less than or Equals" },
+            { value: "within_pct", label: "Within Range" },
+            { value: "at_least_pct_lower", label: "Lower by" }
+          ],
+          clearable: false
+        }
+      ) }) }),
+      ratePolicy.kind !== "eq_primary" ? /* @__PURE__ */ jsx80(SettingRow, { title: "Rate Percentage", hint: "Rate percentage the policy is guarded by", children: /* @__PURE__ */ jsx80("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ jsx80("div", { className: "w-32", children: /* @__PURE__ */ jsx80(
+        InputField18,
+        {
+          variant: "number",
+          value: ratePolicy.pct,
+          onChange: ({ value }) => {
+            const pct = typeof value === "number" ? value : Number(value ?? 0);
+            setRatePolicy({
+              ...ratePolicy,
+              pct
+            });
+          },
+          min: 0,
+          step: 0.01,
+          fullWidth: true,
+          showButtons: true,
+          trailingIcons: [/* @__PURE__ */ jsx80("span", { className: "pr-2", children: "%" })]
+        }
+      ) }) }) }) : null,
+      /* @__PURE__ */ jsx80(SettingRow, { title: "Selection strategy", hint: "How valid fallback candidates are ordered in previews.", children: /* @__PURE__ */ jsx80(
+        InputField18,
+        {
+          variant: "select",
+          label: "Selection strategy",
+          value: draft.selectionStrategy ?? "priority",
+          onChange: ({ value }) => setDraft((previous) => ({
+            ...previous,
+            selectionStrategy: value
+          })),
+          options: [
+            { value: "priority", label: "priority" },
+            { value: "cheapest", label: "cheapest" }
+          ],
+          clearable: false
+        }
+      ) }),
+      /* @__PURE__ */ jsx80(SettingRow, { title: "Mode", hint: "Use strict for enforced filtering, dev for advisory feedback.", children: /* @__PURE__ */ jsx80(
+        InputField18,
+        {
+          variant: "select",
+          label: "Mode",
+          value: draft.mode ?? "strict",
+          onChange: ({ value }) => setDraft((previous) => ({
+            ...previous,
+            mode: value
+          })),
+          options: [
+            { value: "strict", label: "strict" },
+            { value: "dev", label: "dev" }
+          ],
+          clearable: false
+        }
+      ) }),
+      saved && !error ? /* @__PURE__ */ jsx80(Alert, { className: "border border-emerald-200 bg-emerald-50 text-emerald-700 dark:border-emerald-500/30 dark:bg-emerald-500/10 dark:text-emerald-200", children: /* @__PURE__ */ jsx80(AlertDescription, { children: "Settings saved." }) }) : null,
+      error ? /* @__PURE__ */ jsx80(Alert, { variant: "destructive", className: "border border-rose-200 bg-rose-50 dark:border-rose-500/30 dark:bg-rose-500/10", children: /* @__PURE__ */ jsx80(AlertDescription, { children: error }) }) : null
+    ] }) })
+  ] });
+}
+function SettingRow({ title, hint, children }) {
+  return /* @__PURE__ */ jsxs59("div", { className: "flex flex-col gap-3 border-b border-dashed border-slate-200 pb-5 last:border-b-0 last:pb-0 md:flex-row md:items-center md:justify-between dark:border-slate-800", children: [
+    /* @__PURE__ */ jsxs59("div", { className: "max-w-xl", children: [
+      /* @__PURE__ */ jsx80("div", { className: "text-sm font-medium text-slate-900 dark:text-slate-100", children: title }),
+      /* @__PURE__ */ jsx80("div", { className: "mt-1 text-xs text-slate-500 dark:text-slate-400", children: hint })
+    ] }),
+    /* @__PURE__ */ jsx80("div", { children })
+  ] });
+}
+
+// src/workspace/fallback-editor/native-fallback-editor.tsx
+import { jsx as jsx81, jsxs as jsxs60 } from "react/jsx-runtime";
+function NativeFallbackEditor({
+  className,
+  fallbacks,
+  props,
+  snapshot,
+  primaryServices,
+  eligibleServices,
+  settings,
+  initialServiceId,
+  initialTab,
+  onSettingsChange,
+  onSave,
+  onValidate,
+  onReset
+}) {
+  return /* @__PURE__ */ jsx81(
+    FallbackEditorProvider,
+    {
+      fallbacks,
+      props,
+      snapshot,
+      primaryServices,
+      eligibleServices,
+      settings,
+      initialServiceId,
+      initialTab,
+      onSettingsChange,
+      onSave,
+      onValidate,
+      onReset,
+      children: /* @__PURE__ */ jsx81(NativeFallbackEditorInner, { className })
+    }
+  );
+}
+function NativeFallbackEditorInner({ className }) {
+  const {
+    activeTab,
+    setActiveTab,
+    activeServiceId,
+    saveFallbacks,
+    validateFallbacks,
+    resetEditor,
+    state,
+    headerSaving,
+    headerValidating,
+    headerResetting
+  } = useFallbackEditor6();
+  const registrations = useActiveFallbackRegistrations4();
+  const services2 = usePrimaryServiceList3();
+  const activeServiceLabel = useMemo37(() => {
+    const service = services2.find((entry) => String(entry.id) === String(activeServiceId));
+    if (!service) return void 0;
+    return `${service.name ?? "Unnamed"} (#${String(service.id)})`;
+  }, [activeServiceId, services2]);
+  return /* @__PURE__ */ jsxs60("div", { className: cn("flex h-full min-h-0 flex-col gap-4 text-slate-900 dark:text-slate-100", className), children: [
+    /* @__PURE__ */ jsx81(
+      FallbackEditorHeader,
+      {
+        activeServiceLabel,
+        registrationCount: registrations.length,
+        changed: state.changed,
+        onReset: resetEditor,
+        onValidate: validateFallbacks,
+        onSave: saveFallbacks,
+        resetting: headerResetting,
+        validating: headerValidating,
+        saving: headerSaving
+      }
+    ),
+    /* @__PURE__ */ jsxs60(ResizablePanelGroup, { direction: "horizontal", className: "min-h-0 flex-1 gap-0 overflow-hidden", "data-testid": "fallback-editor-layout", children: [
+      /* @__PURE__ */ jsx81(ResizablePanel, { defaultSize: 300, minSize: 300, maxSize: 350, className: "", children: /* @__PURE__ */ jsx81("div", { className: "flex h-full min-h-0 min-w-70", "data-testid": "fallback-editor-sidebar-panel", children: /* @__PURE__ */ jsx81(FallbackServiceSidebar, {}) }) }),
+      /* @__PURE__ */ jsx81(ResizableHandle, {}),
+      /* @__PURE__ */ jsx81(ResizablePanel, { defaultSize: 78, minSize: 66, className: "pl-4", children: /* @__PURE__ */ jsxs60("div", { className: "grid h-full min-h-0 gap-4 xl:grid-cols-[minmax(0,1fr)_360px]", "data-testid": "fallback-editor-main-panel", children: [
+        /* @__PURE__ */ jsxs60(
+          Tabs,
+          {
+            value: activeTab,
+            onValueChange: (value) => setActiveTab(value),
+            className: "min-h-0 gap-4 overflow-hidden",
+            children: [
+              /* @__PURE__ */ jsx81(SectionCard, { className: "shrink-0 px-5 py-4", children: /* @__PURE__ */ jsxs60("div", { className: "flex flex-col gap-4 lg:flex-row lg:items-start lg:justify-between", children: [
+                /* @__PURE__ */ jsxs60("div", { className: "min-w-0", children: [
+                  /* @__PURE__ */ jsx81("h2", { className: "text-lg font-semibold text-slate-900 dark:text-slate-100", children: activeServiceId != null ? `Service #${String(activeServiceId)}` : "No service selected" }),
+                  /* @__PURE__ */ jsx81("p", { className: "mt-1 text-sm text-slate-500 dark:text-slate-400", children: "Edit fallback registrations, review validation hints, and persist policy updates." })
+                ] }),
+                /* @__PURE__ */ jsxs60(TabsList, { children: [
+                  /* @__PURE__ */ jsx81(TabsTrigger, { value: "registrations", children: "Registrations" }),
+                  /* @__PURE__ */ jsx81(TabsTrigger, { value: "settings", children: "Settings" })
+                ] })
+              ] }) }),
+              /* @__PURE__ */ jsx81(TabsContent, { value: "registrations", className: "min-h-0 overflow-hidden", "data-testid": "fallback-editor-registrations-tab", children: /* @__PURE__ */ jsx81(FallbackRegistrationsPanel, {}) }),
+              /* @__PURE__ */ jsx81(TabsContent, { value: "settings", className: "min-h-0 flex flex-col overflow-hidden", "data-testid": "fallback-editor-settings-tab", children: /* @__PURE__ */ jsx81(FallbackSettingsPanel, {}) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx81("div", { className: "min-h-0 overflow-hidden flex flex-col", "data-testid": "fallback-editor-details-panel", children: /* @__PURE__ */ jsx81(FallbackDetailsPanel, {}) })
+      ] }) })
+    ] })
+  ] });
+}
+
 // src/workspace/fallback-editor-modal.tsx
 import { useCanvas as useCanvas18, useWorkspace as useWorkspace15 } from "@timeax/digital-service-engine/workspace";
 import cloneDeep4 from "lodash/cloneDeep";
-import { Suspense, lazy, createContext as createContext4, useCallback as useCallback20, useContext as useContext4, useEffect as useEffect21, useMemo as useMemo34, useState as useState33 } from "react";
+import { createContext as createContext4, useCallback as useCallback21, useContext as useContext4, useEffect as useEffect23, useMemo as useMemo38, useState as useState38 } from "react";
 import { createPortal as createPortal4 } from "react-dom";
 import { FiX as FiX4 } from "react-icons/fi";
-import { jsx as jsx73, jsxs as jsxs53 } from "react/jsx-runtime";
-var LazyFallbackEditor = lazy(async () => {
-  const mod = await import("@timeax/digital-service-engine/react");
-  return { default: mod.FallbackEditor };
-});
+import { jsx as jsx82, jsxs as jsxs61 } from "react/jsx-runtime";
 var noop2 = () => {
 };
 var defaultContextValue2 = {
@@ -14618,14 +15918,14 @@ var FallbackEditorModalContext = createContext4(defaultContextValue2);
 function FallbackEditorModalProvider({ children }) {
   const canvas = useCanvas18();
   const ws = useWorkspace15();
-  const [launch, setLaunch] = useState33(null);
-  const [sessionId, setSessionId] = useState33(0);
-  const [surfaceError, setSurfaceError] = useState33(null);
-  const close = useCallback20(() => {
+  const [launch, setLaunch] = useState38(null);
+  const [sessionId, setSessionId] = useState38(0);
+  const [surfaceError, setSurfaceError] = useState38(null);
+  const close = useCallback21(() => {
     setLaunch(null);
     setSurfaceError(null);
   }, []);
-  const openForNode = useCallback20((input) => {
+  const openForNode = useCallback21((input) => {
     setSurfaceError(null);
     setSessionId((current) => current + 1);
     setLaunch({
@@ -14636,7 +15936,7 @@ function FallbackEditorModalProvider({ children }) {
       nodeLabel: input.nodeLabel ?? input.nodeId
     });
   }, []);
-  const openForService = useCallback20((input) => {
+  const openForService = useCallback21((input) => {
     setSurfaceError(null);
     setSessionId((current) => current + 1);
     setLaunch({
@@ -14645,7 +15945,7 @@ function FallbackEditorModalProvider({ children }) {
       serviceName: input.serviceName
     });
   }, []);
-  const persistProps = useCallback20(
+  const persistProps = useCallback21(
     (label, mutate) => {
       const editorAny = canvas.api.editor;
       if (typeof editorAny.transact !== "function" || typeof editorAny.replaceProps !== "function") {
@@ -14659,7 +15959,7 @@ function FallbackEditorModalProvider({ children }) {
     },
     [canvas.api.builder, canvas.api.editor, canvas.props]
   );
-  const handleSave = useCallback20(
+  const handleSave = useCallback21(
     async (nextFallbacks) => {
       setSurfaceError(null);
       try {
@@ -14676,7 +15976,7 @@ function FallbackEditorModalProvider({ children }) {
     },
     [close, persistProps]
   );
-  const handleSettingsChange = useCallback20(
+  const handleSettingsChange = useCallback21(
     async (nextSettings) => {
       setSurfaceError(null);
       try {
@@ -14692,26 +15992,26 @@ function FallbackEditorModalProvider({ children }) {
     },
     [persistProps]
   );
-  const launchTitle = useMemo34(() => {
+  const launchTitle = useMemo38(() => {
     if (!launch) return "Fallback editor";
     if (launch.source === "node") {
       return launch.nodeLabel ? `Fallback editor for ${launch.nodeLabel}` : "Fallback editor";
     }
     return launch.serviceName ? `Fallback editor for ${launch.serviceName}` : `Fallback editor for service #${String(launch.initialServiceId)}`;
   }, [launch]);
-  const launchDescription = useMemo34(() => {
+  const launchDescription = useMemo38(() => {
     if (!launch) return "";
     if (launch.source === "node") {
       return `Browse and edit fallback registrations for service #${String(launch.initialServiceId)}. Node-scoped and global registrations remain available inside the editor.`;
     }
     return `Browse and edit all fallback registrations for service #${String(launch.initialServiceId)} from Active Services.`;
   }, [launch]);
-  const servicesMap = useMemo34(() => ws.services.data ?? {}, [ws.services.data]);
-  const fallbackSettings = useMemo34(
+  const servicesMap = useMemo38(() => ws.services.data ?? {}, [ws.services.data]);
+  const fallbackSettings = useMemo38(
     () => canvas.props?.fallbackSettings ?? {},
     [canvas.props]
   );
-  useEffect21(() => {
+  useEffect23(() => {
     if (!launch) return;
     const onKeyDown = (event) => {
       if (event.key === "Escape") close();
@@ -14719,7 +16019,7 @@ function FallbackEditorModalProvider({ children }) {
     window.addEventListener("keydown", onKeyDown);
     return () => window.removeEventListener("keydown", onKeyDown);
   }, [close, launch]);
-  const value = useMemo34(
+  const value = useMemo38(
     () => ({
       openForNode,
       openForService,
@@ -14728,51 +16028,45 @@ function FallbackEditorModalProvider({ children }) {
     }),
     [close, launch, openForNode, openForService]
   );
-  return /* @__PURE__ */ jsxs53(FallbackEditorModalContext.Provider, { value, children: [
+  return /* @__PURE__ */ jsxs61(FallbackEditorModalContext.Provider, { value, children: [
     children,
     typeof document !== "undefined" && launch ? createPortal4(
-      /* @__PURE__ */ jsx73(
+      /* @__PURE__ */ jsx82(
         "div",
         {
           className: "fixed inset-0 z-50 flex items-center justify-center bg-slate-950/60 p-4 backdrop-blur-sm",
           onMouseDown: (event) => {
             if (event.target === event.currentTarget) close();
           },
-          children: /* @__PURE__ */ jsxs53(
+          children: /* @__PURE__ */ jsxs61(
             "div",
             {
               className: cn(
-                "flex h-[min(90vh,56rem)] w-[min(96vw,88rem)] flex-col overflow-hidden rounded-[28px] border border-slate-200 bg-white shadow-2xl dark:border-slate-800 dark:bg-slate-950"
+                "flex h-[min(90vh,56rem)] w-[min(96vw,88rem)] flex-col overflow-hidden rounded-md border border-slate-200 bg-white shadow-2xl dark:border-slate-800 dark:bg-slate-950"
               ),
               children: [
-                /* @__PURE__ */ jsxs53("div", { className: "flex items-start justify-between gap-4 border-b border-slate-200 px-6 py-4 dark:border-slate-800", children: [
-                  /* @__PURE__ */ jsxs53("div", { className: "min-w-0", children: [
-                    /* @__PURE__ */ jsx73("h2", { className: "text-lg font-semibold text-slate-900 dark:text-slate-100", children: launchTitle }),
-                    /* @__PURE__ */ jsx73("p", { className: "mt-1 text-sm text-slate-500 dark:text-slate-400", children: launchDescription })
+                /* @__PURE__ */ jsxs61("div", { className: "flex items-start justify-between gap-4 border-b border-slate-200 px-6 py-4 dark:border-slate-800", children: [
+                  /* @__PURE__ */ jsxs61("div", { className: "min-w-0", children: [
+                    /* @__PURE__ */ jsx82("h2", { className: "text-lg font-semibold text-slate-900 dark:text-slate-100", children: launchTitle }),
+                    /* @__PURE__ */ jsx82("p", { className: "mt-1 text-sm text-slate-500 dark:text-slate-400", children: launchDescription })
                   ] }),
-                  /* @__PURE__ */ jsx73(Button, { type: "button", variant: "ghost", size: "sm", onClick: close, className: "h-9 rounded-xl px-2", children: /* @__PURE__ */ jsx73(FiX4, {}) })
+                  /* @__PURE__ */ jsx82(Button, { type: "button", variant: "ghost", size: "sm", onClick: close, className: "h-9 rounded-md px-2", children: /* @__PURE__ */ jsx82(FiX4, {}) })
                 ] }),
-                surfaceError ? /* @__PURE__ */ jsx73("div", { className: "border-b border-rose-200 bg-rose-50 px-6 py-3 text-sm text-rose-700 dark:border-rose-900/40 dark:bg-rose-950/20 dark:text-rose-200", children: surfaceError }) : null,
-                /* @__PURE__ */ jsx73("div", { className: "min-h-0 flex-1 overflow-auto", children: /* @__PURE__ */ jsx73(
-                  Suspense,
+                surfaceError ? /* @__PURE__ */ jsx82("div", { className: "border-b border-rose-200 bg-rose-50 px-6 py-3 text-sm text-rose-700 dark:border-rose-900/40 dark:bg-rose-950/20 dark:text-rose-200", children: surfaceError }) : null,
+                /* @__PURE__ */ jsx82("div", { className: "min-h-0 flex-1 overflow-hidden", children: /* @__PURE__ */ jsx82(
+                  NativeFallbackEditor,
                   {
-                    fallback: /* @__PURE__ */ jsx73("div", { className: "flex h-full min-h-96 items-center justify-center px-6 text-sm text-slate-500 dark:text-slate-400", children: "Loading fallback editor..." }),
-                    children: /* @__PURE__ */ jsx73(
-                      LazyFallbackEditor,
-                      {
-                        className: "min-h-full bg-transparent p-5 dark:bg-transparent",
-                        fallbacks: canvas.props.fallbacks,
-                        props: canvas.props,
-                        primaryServices: servicesMap,
-                        eligibleServices: servicesMap,
-                        settings: fallbackSettings,
-                        initialServiceId: launch.initialServiceId,
-                        onSettingsChange: handleSettingsChange,
-                        onSave: handleSave
-                      },
-                      `${launch.source}:${String(launch.initialServiceId)}:${sessionId}`
-                    )
-                  }
+                    className: "h-full p-5",
+                    fallbacks: canvas.props.fallbacks,
+                    props: canvas.props,
+                    primaryServices: servicesMap,
+                    eligibleServices: servicesMap,
+                    settings: fallbackSettings,
+                    initialServiceId: launch.initialServiceId,
+                    onSettingsChange: handleSettingsChange,
+                    onSave: handleSave
+                  },
+                  `${launch.source}:${String(launch.initialServiceId)}:${sessionId}`
                 ) })
               ]
             }
@@ -14789,7 +16083,7 @@ function useFallbackEditorModal() {
 
 // src/workspace/bottom-panel/index.tsx
 import { useCanvas as useCanvas21, useWorkspace as useWorkspace16 } from "@timeax/digital-service-engine/workspace";
-import { useCallback as useCallback21, useEffect as useEffect24, useMemo as useMemo36, useRef as useRef12, useState as useState36 } from "react";
+import { useCallback as useCallback22, useEffect as useEffect26, useMemo as useMemo40, useRef as useRef12, useState as useState41 } from "react";
 import { FiEye as FiEye3, FiEyeOff as FiEyeOff2, FiSearch, FiTerminal as FiTerminal2, FiX as FiX6 } from "react-icons/fi";
 import { LuGripHorizontal, LuLayers3 } from "react-icons/lu";
 import { MdOutlineSync } from "react-icons/md";
@@ -14802,7 +16096,7 @@ import { FiInfo as FiInfo3, FiTrash2, FiX as FiX5 } from "react-icons/fi";
 import "@timeax/digital-service-engine/workspace";
 import { startTransition } from "react";
 import { FiAlertCircle as FiAlertCircle4, FiInfo as FiInfo2 } from "react-icons/fi";
-import { jsx as jsx74 } from "react/jsx-runtime";
+import { jsx as jsx83 } from "react/jsx-runtime";
 var PANEL_MARGIN = 8;
 var PANEL_LEFT_KEY = "service-builder.bottom-panel.pos-x";
 var PANEL_BOTTOM_KEY = "service-builder.bottom-panel.pos-y";
@@ -14817,9 +16111,9 @@ function sameIds(a, b) {
   return a.length === b.length && a.every((value, index) => value === b[index]);
 }
 function iconForSeverity(severity) {
-  if (severity === "error") return /* @__PURE__ */ jsx74(FiAlertCircle4, { className: "text-lg text-rose-500" });
-  if (severity === "warning") return /* @__PURE__ */ jsx74(FiAlertCircle4, { className: "text-lg text-amber-500" });
-  return /* @__PURE__ */ jsx74(FiInfo2, { className: "text-lg text-sky-500" });
+  if (severity === "error") return /* @__PURE__ */ jsx83(FiAlertCircle4, { className: "text-lg text-rose-500" });
+  if (severity === "warning") return /* @__PURE__ */ jsx83(FiAlertCircle4, { className: "text-lg text-amber-500" });
+  return /* @__PURE__ */ jsx83(FiInfo2, { className: "text-lg text-sky-500" });
 }
 function severityBadgeClassName(severity) {
   return cn(
@@ -15000,7 +16294,7 @@ function toNodeChip(canvas, id) {
 }
 
 // src/workspace/bottom-panel/console-tab.tsx
-import { Fragment as Fragment15, jsx as jsx75, jsxs as jsxs54 } from "react/jsx-runtime";
+import { Fragment as Fragment16, jsx as jsx84, jsxs as jsxs62 } from "react/jsx-runtime";
 function ConsoleTab({
   errors,
   notices,
@@ -15029,21 +16323,21 @@ function ConsoleTab({
   ];
   const activeIntro = introState[subTab];
   const introCopy = getConsoleIntroCopy(subTab);
-  return /* @__PURE__ */ jsxs54("div", { className: "space-y-4", children: [
-    !activeIntro.closed ? /* @__PURE__ */ jsx75("div", { className: "rounded-2xl border border-sky-200/80 bg-sky-50/70 p-3 dark:border-sky-500/20 dark:bg-sky-500/10", children: /* @__PURE__ */ jsxs54("div", { className: "flex items-start justify-between gap-3", children: [
-      /* @__PURE__ */ jsxs54("div", { className: "min-w-0", children: [
-        /* @__PURE__ */ jsx75("p", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: introCopy.title }),
-        !activeIntro.minimized ? /* @__PURE__ */ jsxs54(Fragment15, { children: [
-          /* @__PURE__ */ jsx75("p", { className: "mt-1 text-xs text-slate-600 dark:text-slate-300", children: introCopy.description }),
-          /* @__PURE__ */ jsxs54("div", { className: "mt-2 flex flex-wrap items-center gap-2 text-[11px] text-slate-500 dark:text-slate-400", children: [
-            /* @__PURE__ */ jsx75("span", { className: "rounded-full bg-white/80 px-2 py-0.5 dark:bg-slate-900/70", children: validating ? "Validating..." : "Console idle" }),
-            /* @__PURE__ */ jsx75("span", { className: "rounded-full bg-white/80 px-2 py-0.5 dark:bg-slate-900/70", children: shortcutLabel }),
-            /* @__PURE__ */ jsx75("span", { className: "rounded-full bg-white/80 px-2 py-0.5 dark:bg-slate-900/70", children: "Press Escape to close" })
+  return /* @__PURE__ */ jsxs62("div", { className: "space-y-4", children: [
+    !activeIntro.closed ? /* @__PURE__ */ jsx84("div", { className: "rounded-2xl border border-sky-200/80 bg-sky-50/70 p-3 dark:border-sky-500/20 dark:bg-sky-500/10", children: /* @__PURE__ */ jsxs62("div", { className: "flex items-start justify-between gap-3", children: [
+      /* @__PURE__ */ jsxs62("div", { className: "min-w-0", children: [
+        /* @__PURE__ */ jsx84("p", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: introCopy.title }),
+        !activeIntro.minimized ? /* @__PURE__ */ jsxs62(Fragment16, { children: [
+          /* @__PURE__ */ jsx84("p", { className: "mt-1 text-xs text-slate-600 dark:text-slate-300", children: introCopy.description }),
+          /* @__PURE__ */ jsxs62("div", { className: "mt-2 flex flex-wrap items-center gap-2 text-[11px] text-slate-500 dark:text-slate-400", children: [
+            /* @__PURE__ */ jsx84("span", { className: "rounded-full bg-white/80 px-2 py-0.5 dark:bg-slate-900/70", children: validating ? "Validating..." : "Console idle" }),
+            /* @__PURE__ */ jsx84("span", { className: "rounded-full bg-white/80 px-2 py-0.5 dark:bg-slate-900/70", children: shortcutLabel }),
+            /* @__PURE__ */ jsx84("span", { className: "rounded-full bg-white/80 px-2 py-0.5 dark:bg-slate-900/70", children: "Press Escape to close" })
           ] })
         ] }) : null
       ] }),
-      /* @__PURE__ */ jsxs54("div", { className: "flex items-center gap-2 text-xs", children: [
-        /* @__PURE__ */ jsx75(
+      /* @__PURE__ */ jsxs62("div", { className: "flex items-center gap-2 text-xs", children: [
+        /* @__PURE__ */ jsx84(
           "button",
           {
             type: "button",
@@ -15052,7 +16346,7 @@ function ConsoleTab({
             children: activeIntro.minimized ? "Expand" : "Minimize"
           }
         ),
-        /* @__PURE__ */ jsx75(
+        /* @__PURE__ */ jsx84(
           "button",
           {
             type: "button",
@@ -15063,9 +16357,9 @@ function ConsoleTab({
         )
       ] })
     ] }) }) : null,
-    /* @__PURE__ */ jsxs54("div", { className: "rounded-2xl border border-slate-200 bg-white/70 p-3 dark:border-slate-800 dark:bg-slate-950/40", children: [
-      /* @__PURE__ */ jsxs54("div", { className: "flex flex-wrap items-center justify-between gap-2", children: [
-        /* @__PURE__ */ jsx75("div", { className: "flex flex-wrap items-center gap-2", children: subTabs.map((tab) => /* @__PURE__ */ jsxs54(
+    /* @__PURE__ */ jsxs62("div", { className: "rounded-2xl border border-slate-200 bg-white/70 p-3 dark:border-slate-800 dark:bg-slate-950/40", children: [
+      /* @__PURE__ */ jsxs62("div", { className: "flex flex-wrap items-center justify-between gap-2", children: [
+        /* @__PURE__ */ jsx84("div", { className: "flex flex-wrap items-center gap-2", children: subTabs.map((tab) => /* @__PURE__ */ jsxs62(
           "button",
           {
             type: "button",
@@ -15075,20 +16369,20 @@ function ConsoleTab({
               subTab === tab.id ? "bg-slate-900 text-white dark:bg-slate-100 dark:text-slate-900" : "bg-slate-100 text-slate-600 hover:bg-slate-200 dark:bg-slate-900 dark:text-slate-300 dark:hover:bg-slate-800"
             ),
             children: [
-              /* @__PURE__ */ jsx75("span", { children: tab.label }),
-              /* @__PURE__ */ jsx75("span", { className: "rounded-full bg-black/10 px-1.5 py-0.5 text-[10px] dark:bg-white/10", children: tab.count })
+              /* @__PURE__ */ jsx84("span", { children: tab.label }),
+              /* @__PURE__ */ jsx84("span", { className: "rounded-full bg-black/10 px-1.5 py-0.5 text-[10px] dark:bg-white/10", children: tab.count })
             ]
           },
           tab.id
         )) }),
-        subTab === "logs" && logRows.length ? /* @__PURE__ */ jsxs54(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => errors.clear("logs"), className: "h-8 rounded-xl px-3 text-xs", children: [
-          /* @__PURE__ */ jsx75(FiTrash2, {}),
+        subTab === "logs" && logRows.length ? /* @__PURE__ */ jsxs62(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => errors.clear("logs"), className: "h-8 rounded-xl px-3 text-xs", children: [
+          /* @__PURE__ */ jsx84(FiTrash2, {}),
           "Clear logs"
         ] }) : null
       ] }),
-      /* @__PURE__ */ jsxs54("div", { className: "mt-3 flex flex-wrap items-center gap-2", children: [
-        /* @__PURE__ */ jsx75("span", { className: "text-[11px] font-semibold tracking-[0.16em] text-slate-500 uppercase dark:text-slate-400", children: "Scope" }),
-        /* @__PURE__ */ jsx75(
+      /* @__PURE__ */ jsxs62("div", { className: "mt-3 flex flex-wrap items-center gap-2", children: [
+        /* @__PURE__ */ jsx84("span", { className: "text-[11px] font-semibold tracking-[0.16em] text-slate-500 uppercase dark:text-slate-400", children: "Scope" }),
+        /* @__PURE__ */ jsx84(
           "button",
           {
             type: "button",
@@ -15100,7 +16394,7 @@ function ConsoleTab({
             children: "All items"
           }
         ),
-        /* @__PURE__ */ jsx75(
+        /* @__PURE__ */ jsx84(
           "button",
           {
             type: "button",
@@ -15112,9 +16406,9 @@ function ConsoleTab({
             children: "Active node"
           }
         ),
-        subTab !== "logs" ? /* @__PURE__ */ jsxs54(Fragment15, { children: [
-          /* @__PURE__ */ jsx75("span", { className: "ml-2 text-[11px] font-semibold tracking-[0.16em] text-slate-500 uppercase dark:text-slate-400", children: "Severity" }),
-          ["all", "error", "warning", "info"].map((option) => /* @__PURE__ */ jsx75(
+        subTab !== "logs" ? /* @__PURE__ */ jsxs62(Fragment16, { children: [
+          /* @__PURE__ */ jsx84("span", { className: "ml-2 text-[11px] font-semibold tracking-[0.16em] text-slate-500 uppercase dark:text-slate-400", children: "Severity" }),
+          ["all", "error", "warning", "info"].map((option) => /* @__PURE__ */ jsx84(
             "button",
             {
               type: "button",
@@ -15129,23 +16423,23 @@ function ConsoleTab({
           ))
         ] }) : null
       ] }),
-      scopeFilter === "activeNode" && !hasActiveSelection ? /* @__PURE__ */ jsx75("p", { className: "mt-2 text-xs text-amber-700 dark:text-amber-300", children: "No active node selected. Select a node to filter by active scope." }) : null
+      scopeFilter === "activeNode" && !hasActiveSelection ? /* @__PURE__ */ jsx84("p", { className: "mt-2 text-xs text-amber-700 dark:text-amber-300", children: "No active node selected. Select a node to filter by active scope." }) : null
     ] }),
-    subTab === "validation" ? validationRows.length ? /* @__PURE__ */ jsx75("div", { className: "space-y-3", children: validationRows.map((row) => /* @__PURE__ */ jsx75(ValidationCard, { onNodeClick, row }, row.id)) }) : /* @__PURE__ */ jsx75(
+    subTab === "validation" ? validationRows.length ? /* @__PURE__ */ jsx84("div", { className: "space-y-3", children: validationRows.map((row) => /* @__PURE__ */ jsx84(ValidationCard, { onNodeClick, row }, row.id)) }) : /* @__PURE__ */ jsx84(
       EmptyState,
       {
         title: "No validation rows for this filter",
         description: scopeFilter === "activeNode" ? "No validation rows match the current active node scope." : "No validation rows match the current severity filter."
       }
     ) : null,
-    subTab === "logs" ? logRows.length ? /* @__PURE__ */ jsx75("div", { className: "space-y-3", children: logRows.map((row) => /* @__PURE__ */ jsx75(LogCard, { row, onRemove: () => errors.removeLog(row.id) }, row.id)) }) : /* @__PURE__ */ jsx75(
+    subTab === "logs" ? logRows.length ? /* @__PURE__ */ jsx84("div", { className: "space-y-3", children: logRows.map((row) => /* @__PURE__ */ jsx84(LogCard, { row, onRemove: () => errors.removeLog(row.id) }, row.id)) }) : /* @__PURE__ */ jsx84(
       EmptyState,
       {
         title: "No logs for this filter",
         description: scopeFilter === "activeNode" ? "No logs are linked to the current active node scope." : "No logs have been captured yet."
       }
     ) : null,
-    subTab === "notices" ? noticeRows.length ? /* @__PURE__ */ jsx75("div", { className: "space-y-3", children: noticeRows.map((row) => /* @__PURE__ */ jsx75(NoticeCard, { notice: row, onNodeClick }, row.id)) }) : /* @__PURE__ */ jsx75(
+    subTab === "notices" ? noticeRows.length ? /* @__PURE__ */ jsx84("div", { className: "space-y-3", children: noticeRows.map((row) => /* @__PURE__ */ jsx84(NoticeCard, { notice: row, onNodeClick }, row.id)) }) : /* @__PURE__ */ jsx84(
       EmptyState,
       {
         title: "No notices for this filter",
@@ -15158,21 +16452,21 @@ function NoticeCard({ notice, onNodeClick }) {
   const canvas = useCanvas20();
   const targetNodeId = notice.target.scope === "node" ? notice.target.node_id : null;
   const targetChip = notice.target.scope === "node" ? toNodeChip(canvas, notice.target.node_id) : "Global notice";
-  return /* @__PURE__ */ jsx75("div", { className: "rounded-2xl border border-slate-200 bg-white p-4 shadow-sm dark:border-slate-800 dark:bg-slate-950/90", children: /* @__PURE__ */ jsxs54("div", { className: "flex items-start gap-3", children: [
-    /* @__PURE__ */ jsx75("div", { className: "mt-0.5", children: iconForSeverity(notice.severity) }),
-    /* @__PURE__ */ jsxs54("div", { className: "min-w-0 flex-1 space-y-2", children: [
-      /* @__PURE__ */ jsxs54("div", { className: "flex flex-wrap items-center gap-2", children: [
-        /* @__PURE__ */ jsx75("span", { className: severityBadgeClassName(notice.severity), children: notice.kind }),
-        /* @__PURE__ */ jsx75("span", { className: "rounded-full bg-slate-100 px-2.5 py-1 text-[10px] font-semibold tracking-[0.16em] text-slate-600 uppercase dark:bg-slate-900 dark:text-slate-300", children: notice.type }),
-        /* @__PURE__ */ jsx75("span", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: notice.title })
+  return /* @__PURE__ */ jsx84("div", { className: "rounded-2xl border border-slate-200 bg-white p-4 shadow-sm dark:border-slate-800 dark:bg-slate-950/90", children: /* @__PURE__ */ jsxs62("div", { className: "flex items-start gap-3", children: [
+    /* @__PURE__ */ jsx84("div", { className: "mt-0.5", children: iconForSeverity(notice.severity) }),
+    /* @__PURE__ */ jsxs62("div", { className: "min-w-0 flex-1 space-y-2", children: [
+      /* @__PURE__ */ jsxs62("div", { className: "flex flex-wrap items-center gap-2", children: [
+        /* @__PURE__ */ jsx84("span", { className: severityBadgeClassName(notice.severity), children: notice.kind }),
+        /* @__PURE__ */ jsx84("span", { className: "rounded-full bg-slate-100 px-2.5 py-1 text-[10px] font-semibold tracking-[0.16em] text-slate-600 uppercase dark:bg-slate-900 dark:text-slate-300", children: notice.type }),
+        /* @__PURE__ */ jsx84("span", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: notice.title })
       ] }),
-      notice.description ? /* @__PURE__ */ jsx75("p", { className: "text-sm text-slate-600 dark:text-slate-300", children: notice.description }) : null,
-      notice.reason ? /* @__PURE__ */ jsxs54("p", { className: "text-xs text-slate-500 dark:text-slate-400", children: [
+      notice.description ? /* @__PURE__ */ jsx84("p", { className: "text-sm text-slate-600 dark:text-slate-300", children: notice.description }) : null,
+      notice.reason ? /* @__PURE__ */ jsxs62("p", { className: "text-xs text-slate-500 dark:text-slate-400", children: [
         "Reason: ",
         notice.reason
       ] }) : null,
-      /* @__PURE__ */ jsxs54("div", { className: "flex flex-wrap items-center gap-2 text-xs text-slate-500 dark:text-slate-400", children: [
-        notice.target.scope === "node" ? /* @__PURE__ */ jsx75(
+      /* @__PURE__ */ jsxs62("div", { className: "flex flex-wrap items-center gap-2 text-xs text-slate-500 dark:text-slate-400", children: [
+        notice.target.scope === "node" ? /* @__PURE__ */ jsx84(
           "button",
           {
             type: "button",
@@ -15180,13 +16474,13 @@ function NoticeCard({ notice, onNodeClick }) {
             className: "rounded-full bg-slate-100 px-2.5 py-1 text-xs text-slate-700 transition hover:bg-slate-200 dark:bg-slate-900 dark:text-slate-300 dark:hover:bg-slate-800",
             children: targetChip
           }
-        ) : /* @__PURE__ */ jsx75("span", { className: "rounded-full bg-slate-100 px-2.5 py-1 text-xs text-slate-700 dark:bg-slate-900 dark:text-slate-300", children: targetChip }),
-        notice.marked_at ? /* @__PURE__ */ jsx75("span", { children: new Date(notice.marked_at).toLocaleString() }) : null,
-        notice.icon ? /* @__PURE__ */ jsxs54("span", { children: [
+        ) : /* @__PURE__ */ jsx84("span", { className: "rounded-full bg-slate-100 px-2.5 py-1 text-xs text-slate-700 dark:bg-slate-900 dark:text-slate-300", children: targetChip }),
+        notice.marked_at ? /* @__PURE__ */ jsx84("span", { children: new Date(notice.marked_at).toLocaleString() }) : null,
+        notice.icon ? /* @__PURE__ */ jsxs62("span", { children: [
           "Icon: ",
           notice.icon
         ] }) : null,
-        notice.color ? /* @__PURE__ */ jsxs54("span", { children: [
+        notice.color ? /* @__PURE__ */ jsxs62("span", { children: [
           "Color: ",
           notice.color
         ] }) : null
@@ -15197,19 +16491,19 @@ function NoticeCard({ notice, onNodeClick }) {
 function ValidationCard({ row, onNodeClick }) {
   const canvas = useCanvas20();
   const scope = describeValidationScope(canvas, row);
-  return /* @__PURE__ */ jsx75(
+  return /* @__PURE__ */ jsx84(
     "div",
     {
       className: "rounded-2xl border border-slate-200 bg-white p-4 shadow-sm dark:border-slate-800 dark:bg-slate-950/90",
       onClick: () => scope.length && canvas.api.setHighlighted(scope),
-      children: /* @__PURE__ */ jsxs54("div", { className: "flex items-start gap-3", children: [
-        /* @__PURE__ */ jsx75("div", { className: "mt-0.5", children: iconForSeverity(row.severity) }),
-        /* @__PURE__ */ jsxs54("div", { className: "min-w-0 flex-1", children: [
-          /* @__PURE__ */ jsxs54("div", { className: "flex flex-wrap items-center gap-2", children: [
-            /* @__PURE__ */ jsx75("span", { className: severityBadgeClassName(row.severity), children: row.code.replaceAll("_", " ") }),
-            /* @__PURE__ */ jsx75("span", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: row.message })
+      children: /* @__PURE__ */ jsxs62("div", { className: "flex items-start gap-3", children: [
+        /* @__PURE__ */ jsx84("div", { className: "mt-0.5", children: iconForSeverity(row.severity) }),
+        /* @__PURE__ */ jsxs62("div", { className: "min-w-0 flex-1", children: [
+          /* @__PURE__ */ jsxs62("div", { className: "flex flex-wrap items-center gap-2", children: [
+            /* @__PURE__ */ jsx84("span", { className: severityBadgeClassName(row.severity), children: row.code.replaceAll("_", " ") }),
+            /* @__PURE__ */ jsx84("span", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: row.message })
           ] }),
-          scope.length ? /* @__PURE__ */ jsx75("div", { className: "mt-3 flex flex-wrap gap-2", children: scope.map((item) => /* @__PURE__ */ jsx75(
+          scope.length ? /* @__PURE__ */ jsx84("div", { className: "mt-3 flex flex-wrap gap-2", children: scope.map((item) => /* @__PURE__ */ jsx84(
             "span",
             {
               onClick: () => onNodeClick(row.nodeId),
@@ -15224,17 +16518,17 @@ function ValidationCard({ row, onNodeClick }) {
   );
 }
 function LogCard({ row, onRemove }) {
-  return /* @__PURE__ */ jsx75("div", { className: "rounded-2xl border border-slate-200 bg-white p-4 shadow-sm dark:border-slate-800 dark:bg-slate-950/90", children: /* @__PURE__ */ jsxs54("div", { className: "flex items-start gap-3", children: [
-    /* @__PURE__ */ jsx75("div", { className: "mt-0.5", children: /* @__PURE__ */ jsx75(FiInfo3, { className: "text-lg text-sky-500" }) }),
-    /* @__PURE__ */ jsxs54("div", { className: "min-w-0 flex-1", children: [
-      /* @__PURE__ */ jsxs54("div", { className: "flex flex-wrap items-center gap-2", children: [
-        /* @__PURE__ */ jsx75("span", { className: "rounded-full bg-sky-100 px-2.5 py-1 text-[10px] font-semibold tracking-[0.16em] text-sky-700 uppercase dark:bg-sky-500/15 dark:text-sky-200", children: row.code ?? "log" }),
-        /* @__PURE__ */ jsx75("span", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: row.message })
+  return /* @__PURE__ */ jsx84("div", { className: "rounded-2xl border border-slate-200 bg-white p-4 shadow-sm dark:border-slate-800 dark:bg-slate-950/90", children: /* @__PURE__ */ jsxs62("div", { className: "flex items-start gap-3", children: [
+    /* @__PURE__ */ jsx84("div", { className: "mt-0.5", children: /* @__PURE__ */ jsx84(FiInfo3, { className: "text-lg text-sky-500" }) }),
+    /* @__PURE__ */ jsxs62("div", { className: "min-w-0 flex-1", children: [
+      /* @__PURE__ */ jsxs62("div", { className: "flex flex-wrap items-center gap-2", children: [
+        /* @__PURE__ */ jsx84("span", { className: "rounded-full bg-sky-100 px-2.5 py-1 text-[10px] font-semibold tracking-[0.16em] text-sky-700 uppercase dark:bg-sky-500/15 dark:text-sky-200", children: row.code ?? "log" }),
+        /* @__PURE__ */ jsx84("span", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: row.message })
       ] }),
-      /* @__PURE__ */ jsxs54("div", { className: "mt-3 flex items-center justify-between gap-3 text-xs text-slate-500 dark:text-slate-400", children: [
-        /* @__PURE__ */ jsx75("span", { children: new Date(row.createdAt).toLocaleTimeString() }),
-        /* @__PURE__ */ jsxs54(Button, { type: "button", variant: "ghost", size: "sm", onClick: onRemove, className: "h-7 rounded-xl px-2 text-xs", children: [
-          /* @__PURE__ */ jsx75(FiX5, {}),
+      /* @__PURE__ */ jsxs62("div", { className: "mt-3 flex items-center justify-between gap-3 text-xs text-slate-500 dark:text-slate-400", children: [
+        /* @__PURE__ */ jsx84("span", { children: new Date(row.createdAt).toLocaleTimeString() }),
+        /* @__PURE__ */ jsxs62(Button, { type: "button", variant: "ghost", size: "sm", onClick: onRemove, className: "h-7 rounded-xl px-2 text-xs", children: [
+          /* @__PURE__ */ jsx84(FiX5, {}),
           "Dismiss"
         ] })
       ] })
@@ -15243,8 +16537,8 @@ function LogCard({ row, onRemove }) {
 }
 
 // src/workspace/bottom-panel/service-picker-dialog.tsx
-import { InputField as InputField16 } from "@timeax/form-palette";
-import { useEffect as useEffect22, useMemo as useMemo35, useState as useState34 } from "react";
+import { InputField as InputField19 } from "@timeax/form-palette";
+import { useEffect as useEffect24, useMemo as useMemo39, useState as useState39 } from "react";
 import { createPortal as createPortal5 } from "react-dom";
 
 // src/workspace/bottom-panel/service-picker.ts
@@ -15362,7 +16656,7 @@ function isScalar(value) {
 }
 
 // src/workspace/bottom-panel/service-picker-dialog.tsx
-import { jsx as jsx76, jsxs as jsxs55 } from "react/jsx-runtime";
+import { jsx as jsx85, jsxs as jsxs63 } from "react/jsx-runtime";
 function ServicePickerDialog({
   open,
   groupLabel,
@@ -15373,14 +16667,14 @@ function ServicePickerDialog({
   onOpenChange,
   onConfirm
 }) {
-  const [filters, setFilters] = useState34(() => createDefaultServicePickerFilters());
-  const [selectedIds, setSelectedIds] = useState34(/* @__PURE__ */ new Set());
-  useEffect22(() => {
+  const [filters, setFilters] = useState39(() => createDefaultServicePickerFilters());
+  const [selectedIds, setSelectedIds] = useState39(/* @__PURE__ */ new Set());
+  useEffect24(() => {
     if (!open) return;
     setFilters(createDefaultServicePickerFilters());
     setSelectedIds(/* @__PURE__ */ new Set());
   }, [open]);
-  useEffect22(() => {
+  useEffect24(() => {
     if (!open) return;
     const onKeyDown = (event) => {
       if (event.key === "Escape") onOpenChange(false);
@@ -15388,14 +16682,14 @@ function ServicePickerDialog({
     window.addEventListener("keydown", onKeyDown);
     return () => window.removeEventListener("keydown", onKeyDown);
   }, [onOpenChange, open]);
-  const categories = useMemo35(
+  const categories = useMemo39(
     () => Array.from(new Set(services2.map((service) => service.category).filter(Boolean))).sort((a, b) => a.localeCompare(b)),
     [services2]
   );
-  const flags = useMemo35(() => Array.from(new Set(services2.flatMap((service) => service.flags))).sort((a, b) => a.localeCompare(b)), [services2]);
-  const metaPaths = useMemo35(() => discoverServiceMetaPaths(Object.values(serviceMap)), [serviceMap]);
+  const flags = useMemo39(() => Array.from(new Set(services2.flatMap((service) => service.flags))).sort((a, b) => a.localeCompare(b)), [services2]);
+  const metaPaths = useMemo39(() => discoverServiceMetaPaths(Object.values(serviceMap)), [serviceMap]);
   const metaValues = metaPaths.find((entry) => entry.path === filters.metaPath)?.values ?? [];
-  const filteredServices = useMemo35(
+  const filteredServices = useMemo39(
     () => filterServicePickerServices({
       services: services2,
       serviceMap,
@@ -15408,7 +16702,7 @@ function ServicePickerDialog({
   const selectedCount = selectedIds.size;
   const canConfirm = selectedCount > 0;
   return createPortal5(
-    /* @__PURE__ */ jsx76("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-slate-950/45 p-4", children: /* @__PURE__ */ jsxs55(
+    /* @__PURE__ */ jsx85("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-slate-950/45 p-4", children: /* @__PURE__ */ jsxs63(
       "div",
       {
         role: "dialog",
@@ -15416,17 +16710,17 @@ function ServicePickerDialog({
         "aria-label": "Service picker",
         className: "flex h-[min(80vh,42rem)] w-[min(72rem,calc(100vw-2rem))] flex-col overflow-hidden rounded-3xl border border-slate-200 bg-white shadow-2xl dark:border-slate-800 dark:bg-slate-950",
         children: [
-          /* @__PURE__ */ jsx76("div", { className: "border-b border-slate-200 px-5 py-4 dark:border-slate-800", children: /* @__PURE__ */ jsxs55("div", { className: "flex items-start justify-between gap-4", children: [
-            /* @__PURE__ */ jsxs55("div", { children: [
-              /* @__PURE__ */ jsx76("h3", { className: "text-lg font-semibold text-slate-900 dark:text-slate-100", children: "Assign services to group" }),
-              /* @__PURE__ */ jsx76("p", { className: "mt-1 text-sm text-slate-500 dark:text-slate-400", children: groupLabel ? `Pick one or more services to append into ${groupLabel}.` : "Pick one or more services to append into the selected catalog group." })
+          /* @__PURE__ */ jsx85("div", { className: "border-b border-slate-200 px-5 py-4 dark:border-slate-800", children: /* @__PURE__ */ jsxs63("div", { className: "flex items-start justify-between gap-4", children: [
+            /* @__PURE__ */ jsxs63("div", { children: [
+              /* @__PURE__ */ jsx85("h3", { className: "text-lg font-semibold text-slate-900 dark:text-slate-100", children: "Assign services to group" }),
+              /* @__PURE__ */ jsx85("p", { className: "mt-1 text-sm text-slate-500 dark:text-slate-400", children: groupLabel ? `Pick one or more services to append into ${groupLabel}.` : "Pick one or more services to append into the selected catalog group." })
             ] }),
-            /* @__PURE__ */ jsx76(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => onOpenChange(false), className: "rounded-xl", children: "Close" })
+            /* @__PURE__ */ jsx85(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => onOpenChange(false), className: "rounded-xl", children: "Close" })
           ] }) }),
-          /* @__PURE__ */ jsxs55("div", { className: "grid h-full min-h-0 flex-1 overflow-hidden md:grid-cols-[18rem_minmax(0,1fr)]", children: [
-            /* @__PURE__ */ jsx76("div", { className: "min-h-0 border-r border-slate-200 dark:border-slate-800", children: /* @__PURE__ */ jsx76(ScrollArea, { className: "h-full min-h-0", children: /* @__PURE__ */ jsxs55("div", { className: "space-y-4 p-4", children: [
-              /* @__PURE__ */ jsx76(FilterField, { label: "Search", children: /* @__PURE__ */ jsx76(
-                InputField16,
+          /* @__PURE__ */ jsxs63("div", { className: "grid h-full min-h-0 flex-1 overflow-hidden md:grid-cols-[18rem_minmax(0,1fr)]", children: [
+            /* @__PURE__ */ jsx85("div", { className: "min-h-0 border-r border-slate-200 dark:border-slate-800", children: /* @__PURE__ */ jsx85(ScrollArea, { className: "h-full min-h-0", children: /* @__PURE__ */ jsxs63("div", { className: "space-y-4 p-4", children: [
+              /* @__PURE__ */ jsx85(FilterField, { label: "Search", children: /* @__PURE__ */ jsx85(
+                InputField19,
                 {
                   variant: "text",
                   label: "Picker search",
@@ -15436,8 +16730,8 @@ function ServicePickerDialog({
                   autoComplete: "off"
                 }
               ) }),
-              /* @__PURE__ */ jsx76(FilterField, { label: "Category", children: /* @__PURE__ */ jsx76(
-                InputField16,
+              /* @__PURE__ */ jsx85(FilterField, { label: "Category", children: /* @__PURE__ */ jsx85(
+                InputField19,
                 {
                   variant: "select",
                   label: "Category filter",
@@ -15447,8 +16741,8 @@ function ServicePickerDialog({
                   onChange: (event) => setFilters((current) => ({ ...current, category: String(event.value ?? "") }))
                 }
               ) }),
-              /* @__PURE__ */ jsx76(FilterField, { label: "Flag", children: /* @__PURE__ */ jsx76(
-                InputField16,
+              /* @__PURE__ */ jsx85(FilterField, { label: "Flag", children: /* @__PURE__ */ jsx85(
+                InputField19,
                 {
                   variant: "select",
                   label: "Flag filter",
@@ -15458,8 +16752,8 @@ function ServicePickerDialog({
                   onChange: (event) => setFilters((current) => ({ ...current, flag: String(event.value ?? "") }))
                 }
               ) }),
-              /* @__PURE__ */ jsx76(FilterField, { label: "Activity", children: /* @__PURE__ */ jsx76(
-                InputField16,
+              /* @__PURE__ */ jsx85(FilterField, { label: "Activity", children: /* @__PURE__ */ jsx85(
+                InputField19,
                 {
                   variant: "select",
                   label: "Activity filter",
@@ -15475,9 +16769,9 @@ function ServicePickerDialog({
                   }))
                 }
               ) }),
-              /* @__PURE__ */ jsxs55("div", { className: "grid grid-cols-2 gap-2", children: [
-                /* @__PURE__ */ jsx76(FilterField, { label: "Min rate", children: /* @__PURE__ */ jsx76(
-                  InputField16,
+              /* @__PURE__ */ jsxs63("div", { className: "grid grid-cols-2 gap-2", children: [
+                /* @__PURE__ */ jsx85(FilterField, { label: "Min rate", children: /* @__PURE__ */ jsx85(
+                  InputField19,
                   {
                     variant: "number",
                     label: "Minimum rate filter",
@@ -15487,8 +16781,8 @@ function ServicePickerDialog({
                     autoComplete: "off"
                   }
                 ) }),
-                /* @__PURE__ */ jsx76(FilterField, { label: "Max rate", children: /* @__PURE__ */ jsx76(
-                  InputField16,
+                /* @__PURE__ */ jsx85(FilterField, { label: "Max rate", children: /* @__PURE__ */ jsx85(
+                  InputField19,
                   {
                     variant: "number",
                     label: "Maximum rate filter",
@@ -15499,9 +16793,9 @@ function ServicePickerDialog({
                   }
                 ) })
               ] }),
-              /* @__PURE__ */ jsx76(FilterField, { label: "Name keyword", children: /* @__PURE__ */ jsxs55("div", { className: "space-y-2", children: [
-                /* @__PURE__ */ jsx76(
-                  InputField16,
+              /* @__PURE__ */ jsx85(FilterField, { label: "Name keyword", children: /* @__PURE__ */ jsxs63("div", { className: "space-y-2", children: [
+                /* @__PURE__ */ jsx85(
+                  InputField19,
                   {
                     variant: "select",
                     label: "Keyword mode",
@@ -15516,8 +16810,8 @@ function ServicePickerDialog({
                     }))
                   }
                 ),
-                /* @__PURE__ */ jsx76(
-                  InputField16,
+                /* @__PURE__ */ jsx85(
+                  InputField19,
                   {
                     variant: "text",
                     label: "Keyword filter",
@@ -15528,8 +16822,8 @@ function ServicePickerDialog({
                   }
                 )
               ] }) }),
-              /* @__PURE__ */ jsx76(FilterField, { label: "Meta key", children: /* @__PURE__ */ jsx76(
-                InputField16,
+              /* @__PURE__ */ jsx85(FilterField, { label: "Meta key", children: /* @__PURE__ */ jsx85(
+                InputField19,
                 {
                   variant: "select",
                   label: "Meta key filter",
@@ -15543,8 +16837,8 @@ function ServicePickerDialog({
                   }))
                 }
               ) }),
-              /* @__PURE__ */ jsx76(FilterField, { label: "Meta value", children: /* @__PURE__ */ jsx76(
-                InputField16,
+              /* @__PURE__ */ jsx85(FilterField, { label: "Meta value", children: /* @__PURE__ */ jsx85(
+                InputField19,
                 {
                   variant: "select",
                   label: "Meta value filter",
@@ -15555,7 +16849,7 @@ function ServicePickerDialog({
                   onChange: (event) => setFilters((current) => ({ ...current, metaValue: String(event.value ?? "") }))
                 }
               ) }),
-              /* @__PURE__ */ jsx76("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx76(
+              /* @__PURE__ */ jsx85("div", { className: "flex justify-end", children: /* @__PURE__ */ jsx85(
                 Button,
                 {
                   type: "button",
@@ -15570,18 +16864,18 @@ function ServicePickerDialog({
                 }
               ) })
             ] }) }) }),
-            /* @__PURE__ */ jsxs55("div", { className: "flex min-h-0 flex-col overflow-hidden", children: [
-              /* @__PURE__ */ jsxs55("div", { className: "border-b border-slate-200 px-4 py-3 text-sm text-slate-500 dark:border-slate-800 dark:text-slate-400", children: [
+            /* @__PURE__ */ jsxs63("div", { className: "flex min-h-0 flex-col overflow-hidden", children: [
+              /* @__PURE__ */ jsxs63("div", { className: "border-b border-slate-200 px-4 py-3 text-sm text-slate-500 dark:border-slate-800 dark:text-slate-400", children: [
                 filteredServices.length,
                 " service",
                 filteredServices.length === 1 ? "" : "s",
                 " found"
               ] }),
-              /* @__PURE__ */ jsx76(ScrollArea, { className: "h-full min-h-0 flex-1", children: /* @__PURE__ */ jsx76("div", { className: "space-y-2 p-4", children: filteredServices.length ? filteredServices.map((service) => {
+              /* @__PURE__ */ jsx85(ScrollArea, { className: "h-full min-h-0 flex-1", children: /* @__PURE__ */ jsx85("div", { className: "space-y-2 p-4", children: filteredServices.length ? filteredServices.map((service) => {
                 const id = String(service.id);
                 const selected = selectedIds.has(id);
                 const alreadyAssigned = existingGroupServiceIds.has(id);
-                return /* @__PURE__ */ jsxs55(
+                return /* @__PURE__ */ jsxs63(
                   "label",
                   {
                     className: cn(
@@ -15589,7 +16883,7 @@ function ServicePickerDialog({
                       selected ? "border-blue-300 bg-blue-50 dark:border-blue-500/40 dark:bg-blue-500/10" : "border-slate-200 bg-white hover:border-slate-300 hover:bg-slate-50 dark:border-slate-800 dark:bg-slate-950/60 dark:hover:border-slate-700"
                     ),
                     children: [
-                      /* @__PURE__ */ jsx76(
+                      /* @__PURE__ */ jsx85(
                         "input",
                         {
                           type: "checkbox",
@@ -15603,21 +16897,21 @@ function ServicePickerDialog({
                           })
                         }
                       ),
-                      /* @__PURE__ */ jsxs55("div", { className: "min-w-0 flex-1", children: [
-                        /* @__PURE__ */ jsxs55("div", { className: "flex items-center justify-between gap-3", children: [
-                          /* @__PURE__ */ jsxs55("div", { className: "min-w-0", children: [
-                            /* @__PURE__ */ jsx76("div", { className: "truncate text-sm font-semibold text-slate-900 dark:text-slate-100", children: service.name }),
-                            /* @__PURE__ */ jsxs55("div", { className: "mt-1 flex flex-wrap gap-2 text-xs text-slate-500 dark:text-slate-400", children: [
-                              /* @__PURE__ */ jsxs55("span", { children: [
+                      /* @__PURE__ */ jsxs63("div", { className: "min-w-0 flex-1", children: [
+                        /* @__PURE__ */ jsxs63("div", { className: "flex items-center justify-between gap-3", children: [
+                          /* @__PURE__ */ jsxs63("div", { className: "min-w-0", children: [
+                            /* @__PURE__ */ jsx85("div", { className: "truncate text-sm font-semibold text-slate-900 dark:text-slate-100", children: service.name }),
+                            /* @__PURE__ */ jsxs63("div", { className: "mt-1 flex flex-wrap gap-2 text-xs text-slate-500 dark:text-slate-400", children: [
+                              /* @__PURE__ */ jsxs63("span", { children: [
                                 "#",
                                 service.id
                               ] }),
-                              service.category ? /* @__PURE__ */ jsx76("span", { children: service.category }) : null,
-                              service.platformId ? /* @__PURE__ */ jsx76("span", { children: service.platformId }) : null
+                              service.category ? /* @__PURE__ */ jsx85("span", { children: service.category }) : null,
+                              service.platformId ? /* @__PURE__ */ jsx85("span", { children: service.platformId }) : null
                             ] })
                           ] }),
-                          /* @__PURE__ */ jsxs55("div", { className: "flex items-center gap-2", children: [
-                            /* @__PURE__ */ jsx76(
+                          /* @__PURE__ */ jsxs63("div", { className: "flex items-center gap-2", children: [
+                            /* @__PURE__ */ jsx85(
                               ServiceMetaPopover,
                               {
                                 meta: serviceMap[id]?.meta,
@@ -15625,34 +16919,34 @@ function ServicePickerDialog({
                                 stopEventPropagation: true
                               }
                             ),
-                            alreadyAssigned ? /* @__PURE__ */ jsx76("span", { className: "rounded-full bg-emerald-50 px-2.5 py-1 text-[11px] text-emerald-700 dark:bg-emerald-500/10 dark:text-emerald-200", children: "Already in group" }) : null
+                            alreadyAssigned ? /* @__PURE__ */ jsx85("span", { className: "rounded-full bg-emerald-50 px-2.5 py-1 text-[11px] text-emerald-700 dark:bg-emerald-500/10 dark:text-emerald-200", children: "Already in group" }) : null
                           ] })
                         ] }),
-                        /* @__PURE__ */ jsxs55("div", { className: "mt-3 flex flex-wrap gap-2", children: [
-                          service.rate != null ? /* @__PURE__ */ jsxs55("span", { className: "rounded-full bg-slate-100 px-2.5 py-1 text-[11px] text-slate-600 dark:bg-slate-900 dark:text-slate-300", children: [
+                        /* @__PURE__ */ jsxs63("div", { className: "mt-3 flex flex-wrap gap-2", children: [
+                          service.rate != null ? /* @__PURE__ */ jsxs63("span", { className: "rounded-full bg-slate-100 px-2.5 py-1 text-[11px] text-slate-600 dark:bg-slate-900 dark:text-slate-300", children: [
                             "Rate ",
                             service.rate
                           ] }) : null,
-                          service.flags.slice(0, 3).map((flag) => /* @__PURE__ */ jsx76("span", { className: "rounded-full bg-amber-50 px-2.5 py-1 text-[11px] text-amber-700 dark:bg-amber-500/10 dark:text-amber-200", children: flag }, flag))
+                          service.flags.slice(0, 3).map((flag) => /* @__PURE__ */ jsx85("span", { className: "rounded-full bg-amber-50 px-2.5 py-1 text-[11px] text-amber-700 dark:bg-amber-500/10 dark:text-amber-200", children: flag }, flag))
                         ] })
                       ] })
                     ]
                   },
                   id
                 );
-              }) : /* @__PURE__ */ jsx76("div", { className: "rounded-2xl border border-dashed border-slate-300 px-4 py-10 text-center text-sm text-slate-500 dark:border-slate-700 dark:text-slate-400", children: "No services match the current filters." }) }) })
+              }) : /* @__PURE__ */ jsx85("div", { className: "rounded-2xl border border-dashed border-slate-300 px-4 py-10 text-center text-sm text-slate-500 dark:border-slate-700 dark:text-slate-400", children: "No services match the current filters." }) }) })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs55("div", { className: "flex items-center justify-between gap-3 border-t border-slate-200 px-5 py-4 dark:border-slate-800", children: [
-            /* @__PURE__ */ jsxs55("div", { className: "text-sm text-slate-500 dark:text-slate-400", children: [
+          /* @__PURE__ */ jsxs63("div", { className: "flex items-center justify-between gap-3 border-t border-slate-200 px-5 py-4 dark:border-slate-800", children: [
+            /* @__PURE__ */ jsxs63("div", { className: "text-sm text-slate-500 dark:text-slate-400", children: [
               selectedCount,
               " service",
               selectedCount === 1 ? "" : "s",
               " selected"
             ] }),
-            /* @__PURE__ */ jsxs55("div", { className: "flex items-center gap-2", children: [
-              /* @__PURE__ */ jsx76(Button, { type: "button", variant: "outline", onClick: () => onOpenChange(false), className: "rounded-xl", children: "Cancel" }),
-              /* @__PURE__ */ jsx76(
+            /* @__PURE__ */ jsxs63("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsx85(Button, { type: "button", variant: "outline", onClick: () => onOpenChange(false), className: "rounded-xl", children: "Cancel" }),
+              /* @__PURE__ */ jsx85(
                 Button,
                 {
                   type: "button",
@@ -15674,8 +16968,8 @@ function ServicePickerDialog({
   );
 }
 function FilterField({ label, children }) {
-  return /* @__PURE__ */ jsxs55("label", { className: "block space-y-1.5", children: [
-    /* @__PURE__ */ jsx76("span", { className: "text-[11px] font-semibold uppercase tracking-[0.16em] text-slate-500 dark:text-slate-400", children: label }),
+  return /* @__PURE__ */ jsxs63("label", { className: "block space-y-1.5", children: [
+    /* @__PURE__ */ jsx85("span", { className: "text-[11px] font-semibold uppercase tracking-[0.16em] text-slate-500 dark:text-slate-400", children: label }),
     children
   ] });
 }
@@ -15686,73 +16980,36 @@ function toPickerSelectOptions(values) {
   }));
 }
 
-// src/components/ui/resizable.tsx
-import { GripVertical } from "lucide-react";
-import "react";
-import { Group as Group2, Panel as Panel3, Separator as Separator3 } from "react-resizable-panels";
-import { jsx as jsx77 } from "react/jsx-runtime";
-function ResizablePanelGroup({
-  className,
-  direction = "horizontal",
-  ...props
-}) {
-  return /* @__PURE__ */ jsx77(Group2, { className: cn("flex h-full w-full data-[group-orientation=vertical]:flex-col", className), orientation: direction, ...props });
-}
-function ResizablePanel({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx77(Panel3, { className: cn("min-h-0 min-w-0", className), ...props });
-}
-function ResizableHandle({
-  withHandle,
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx77(
-    Separator3,
-    {
-      className: cn(
-        "relative flex w-3 shrink-0 items-center justify-center bg-transparent outline-none transition-colors after:absolute after:inset-y-3 after:left-1/2 after:w-px after:-translate-x-1/2 after:rounded-full after:bg-slate-200 dark:after:bg-slate-800",
-        "hover:after:bg-slate-300 dark:hover:after:bg-slate-700",
-        className
-      ),
-      ...props,
-      children: withHandle ? /* @__PURE__ */ jsx77("div", { className: "z-10 flex h-10 w-3 items-center justify-center rounded-full border border-slate-200 bg-white text-slate-400 shadow-sm dark:border-slate-800 dark:bg-slate-950 dark:text-slate-500", children: /* @__PURE__ */ jsx77(GripVertical, { className: "h-3.5 w-3.5" }) }) : null
-    }
-  );
-}
-
 // src/workspace/bottom-panel/services-split-pane.tsx
-import { InputField as InputField17 } from "@timeax/form-palette";
-import { useEffect as useEffect23, useState as useState35 } from "react";
+import { InputField as InputField20 } from "@timeax/form-palette";
+import { useEffect as useEffect25, useState as useState40 } from "react";
 import { FaFolderOpen as FaFolderOpen2 } from "react-icons/fa";
 import { FiEdit2, FiFilter as FiFilter2, FiFolderPlus, FiPlus as FiPlus2, FiTrash2 as FiTrash22 } from "react-icons/fi";
 
 // src/workspace/bottom-panel/service-detail-card.tsx
-import { jsx as jsx78, jsxs as jsxs56 } from "react/jsx-runtime";
+import { jsx as jsx86, jsxs as jsxs64 } from "react/jsx-runtime";
 function ServiceDetailCard({ mode, row, snapshot, onNodeClick, onOpenFallbackQuickAdd, onOpenFallbackEditor }) {
   const summary = row.summary;
   const service = row.service;
-  return /* @__PURE__ */ jsxs56("div", { className: "space-y-5", children: [
-    /* @__PURE__ */ jsxs56("div", { className: "rounded-3xl border border-slate-200 bg-slate-50/80 p-5 dark:border-slate-800 dark:bg-slate-900/40", children: [
-      /* @__PURE__ */ jsxs56("div", { className: "flex flex-wrap items-start justify-between gap-4", children: [
-        /* @__PURE__ */ jsxs56("div", { className: "min-w-0", children: [
-          /* @__PURE__ */ jsxs56("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ jsx78(StatusDot, { tone: row.statusTone, className: "mt-0.5" }),
-            /* @__PURE__ */ jsxs56("span", { children: [
+  return /* @__PURE__ */ jsxs64("div", { className: "space-y-5", children: [
+    /* @__PURE__ */ jsxs64("div", { className: "rounded-3xl border border-slate-200 bg-slate-50/80 p-5 dark:border-slate-800 dark:bg-slate-900/40", children: [
+      /* @__PURE__ */ jsxs64("div", { className: "flex flex-wrap items-start justify-between gap-4", children: [
+        /* @__PURE__ */ jsxs64("div", { className: "min-w-0", children: [
+          /* @__PURE__ */ jsxs64("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx86(StatusDot, { tone: row.statusTone, className: "mt-0.5" }),
+            /* @__PURE__ */ jsxs64("span", { children: [
               "#",
               summary.id
             ] })
           ] }),
-          /* @__PURE__ */ jsxs56("div", { className: "mt-2 flex flex-wrap gap-2 text-xs text-slate-500 dark:text-slate-400", children: [
-            summary.category ? /* @__PURE__ */ jsx78("span", { children: summary.category }) : null,
-            summary.platformId ? /* @__PURE__ */ jsx78("span", { children: summary.platformId }) : null
+          /* @__PURE__ */ jsxs64("div", { className: "mt-2 flex flex-wrap gap-2 text-xs text-slate-500 dark:text-slate-400", children: [
+            summary.category ? /* @__PURE__ */ jsx86("span", { children: summary.category }) : null,
+            summary.platformId ? /* @__PURE__ */ jsx86("span", { children: summary.platformId }) : null
           ] })
         ] }),
-        /* @__PURE__ */ jsxs56("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ jsx78(ServiceMetaPopover, { meta: service?.meta }),
-          mode === "active" && onOpenFallbackQuickAdd ? /* @__PURE__ */ jsx78(
+        /* @__PURE__ */ jsxs64("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx86(ServiceMetaPopover, { meta: service?.meta }),
+          mode === "active" && onOpenFallbackQuickAdd ? /* @__PURE__ */ jsx86(
             "button",
             {
               type: "button",
@@ -15761,7 +17018,7 @@ function ServiceDetailCard({ mode, row, snapshot, onNodeClick, onOpenFallbackQui
               children: "Add fallbacks"
             }
           ) : null,
-          mode === "active" && onOpenFallbackEditor ? /* @__PURE__ */ jsx78(
+          mode === "active" && onOpenFallbackEditor ? /* @__PURE__ */ jsx86(
             "button",
             {
               type: "button",
@@ -15770,41 +17027,41 @@ function ServiceDetailCard({ mode, row, snapshot, onNodeClick, onOpenFallbackQui
               children: "Open fallback editor"
             }
           ) : null,
-          /* @__PURE__ */ jsx78("span", { className: statusBadgeClassName(row.statusTone), children: row.statusLabel })
+          /* @__PURE__ */ jsx86("span", { className: statusBadgeClassName(row.statusTone), children: row.statusLabel })
         ] })
       ] }),
-      /* @__PURE__ */ jsxs56("div", { className: "mt-4 grid gap-3 sm:grid-cols-2", children: [
-        /* @__PURE__ */ jsx78(DetailMetric, { label: "Rate", value: summary.rate != null ? String(summary.rate) : "Not set" }),
-        /* @__PURE__ */ jsx78(DetailMetric, { label: "Estimate", value: summary.estimate ?? "No estimate" }),
-        /* @__PURE__ */ jsx78(DetailMetric, { label: "Min", value: summary.min != null ? String(summary.min) : "0" }),
-        /* @__PURE__ */ jsx78(DetailMetric, { label: "Max", value: summary.max != null ? String(summary.max) : "Unlimited" })
+      /* @__PURE__ */ jsxs64("div", { className: "mt-4 grid gap-3 sm:grid-cols-2", children: [
+        /* @__PURE__ */ jsx86(DetailMetric, { label: "Rate", value: summary.rate != null ? String(summary.rate) : "Not set" }),
+        /* @__PURE__ */ jsx86(DetailMetric, { label: "Estimate", value: summary.estimate ?? "No estimate" }),
+        /* @__PURE__ */ jsx86(DetailMetric, { label: "Min", value: summary.min != null ? String(summary.min) : "0" }),
+        /* @__PURE__ */ jsx86(DetailMetric, { label: "Max", value: summary.max != null ? String(summary.max) : "Unlimited" })
       ] })
     ] }),
-    mode !== "active" ? /* @__PURE__ */ jsxs56("section", { className: "space-y-3", children: [
-      /* @__PURE__ */ jsx78(
+    mode !== "active" ? /* @__PURE__ */ jsxs64("section", { className: "space-y-3", children: [
+      /* @__PURE__ */ jsx86(
         SectionTitle2,
         {
           title: "Context fit",
           description: mode === "catalog" ? "This summary shows how the service fits the current visible-group context while browsing catalog groups." : "This summary shows how the service fits the current visible-group context."
         }
       ),
-      /* @__PURE__ */ jsxs56("div", { className: "rounded-2xl border border-slate-200 bg-white p-4 dark:border-slate-800 dark:bg-slate-950/80", children: [
-        /* @__PURE__ */ jsxs56("div", { className: "flex flex-wrap gap-2", children: [
-          /* @__PURE__ */ jsx78(
+      /* @__PURE__ */ jsxs64("div", { className: "rounded-2xl border border-slate-200 bg-white p-4 dark:border-slate-800 dark:bg-slate-950/80", children: [
+        /* @__PURE__ */ jsxs64("div", { className: "flex flex-wrap gap-2", children: [
+          /* @__PURE__ */ jsx86(
             FilterChip,
             {
               label: row.check?.fitsConstraints ? "Constraints fit" : "Constraint mismatch",
               tone: row.check?.fitsConstraints ? "success" : "danger"
             }
           ),
-          /* @__PURE__ */ jsx78(
+          /* @__PURE__ */ jsx86(
             FilterChip,
             {
               label: row.check?.passesRate ? "Rate ok" : "Rate blocked",
               tone: row.check?.passesRate ? "success" : "warning"
             }
           ),
-          /* @__PURE__ */ jsx78(
+          /* @__PURE__ */ jsx86(
             FilterChip,
             {
               label: snapshot?.state.enforcePolicies === false ? "Policies relaxed" : row.check?.passesPolicies ? "Policies pass" : "Policy blocked",
@@ -15812,20 +17069,20 @@ function ServiceDetailCard({ mode, row, snapshot, onNodeClick, onOpenFallbackQui
             }
           )
         ] }),
-        row.reasonLabels.length ? /* @__PURE__ */ jsx78("div", { className: "mt-3 flex flex-wrap gap-2", children: row.reasonLabels.map((reason) => /* @__PURE__ */ jsx78(
+        row.reasonLabels.length ? /* @__PURE__ */ jsx86("div", { className: "mt-3 flex flex-wrap gap-2", children: row.reasonLabels.map((reason) => /* @__PURE__ */ jsx86(
           "span",
           {
             className: "rounded-full bg-amber-50 px-2.5 py-1 text-xs text-amber-700 dark:bg-amber-500/10 dark:text-amber-200",
             children: reason
           },
           `${row.id}:${reason}`
-        )) }) : /* @__PURE__ */ jsx78("p", { className: "mt-3 text-sm text-slate-500 dark:text-slate-400", children: "This service is a clean fit for the current visible-group and selected-trigger context." })
+        )) }) : /* @__PURE__ */ jsx86("p", { className: "mt-3 text-sm text-slate-500 dark:text-slate-400", children: "This service is a clean fit for the current visible-group and selected-trigger context." })
       ] })
     ] }) : null,
-    /* @__PURE__ */ jsxs56("section", { className: "space-y-3", children: [
-      /* @__PURE__ */ jsx78(SectionTitle2, { title: "Capabilities", description: "Flags and pricing hints attached to this service." }),
-      /* @__PURE__ */ jsx78("div", { className: "rounded-2xl border border-slate-200 bg-white p-4 dark:border-slate-800 dark:bg-slate-950/80", children: summary.flags.length || service?.meta ? /* @__PURE__ */ jsxs56("div", { className: "flex flex-wrap gap-2", children: [
-        summary.flags.map((flag) => /* @__PURE__ */ jsx78(
+    /* @__PURE__ */ jsxs64("section", { className: "space-y-3", children: [
+      /* @__PURE__ */ jsx86(SectionTitle2, { title: "Capabilities", description: "Flags and pricing hints attached to this service." }),
+      /* @__PURE__ */ jsx86("div", { className: "rounded-2xl border border-slate-200 bg-white p-4 dark:border-slate-800 dark:bg-slate-950/80", children: summary.flags.length || service?.meta ? /* @__PURE__ */ jsxs64("div", { className: "flex flex-wrap gap-2", children: [
+        summary.flags.map((flag) => /* @__PURE__ */ jsx86(
           "span",
           {
             className: "rounded-full bg-emerald-50 px-2.5 py-1 text-xs text-emerald-700 dark:bg-emerald-500/10 dark:text-emerald-200",
@@ -15833,7 +17090,7 @@ function ServiceDetailCard({ mode, row, snapshot, onNodeClick, onOpenFallbackQui
           },
           flag
         )),
-        Object.keys(service?.meta ?? {}).slice(0, 3).map((key) => /* @__PURE__ */ jsx78(
+        Object.keys(service?.meta ?? {}).slice(0, 3).map((key) => /* @__PURE__ */ jsx86(
           "span",
           {
             className: "rounded-full bg-slate-100 px-2.5 py-1 text-xs text-slate-600 dark:bg-slate-900 dark:text-slate-300",
@@ -15841,17 +17098,17 @@ function ServiceDetailCard({ mode, row, snapshot, onNodeClick, onOpenFallbackQui
           },
           key
         ))
-      ] }) : /* @__PURE__ */ jsx78("p", { className: "text-sm text-slate-500 dark:text-slate-400", children: "No capability flags were published for this service." }) })
+      ] }) : /* @__PURE__ */ jsx86("p", { className: "text-sm text-slate-500 dark:text-slate-400", children: "No capability flags were published for this service." }) })
     ] }),
-    /* @__PURE__ */ jsxs56("section", { className: "space-y-3", children: [
-      /* @__PURE__ */ jsx78(
+    /* @__PURE__ */ jsxs64("section", { className: "space-y-3", children: [
+      /* @__PURE__ */ jsx86(
         SectionTitle2,
         {
           title: "Bindings",
           description: "Nodes currently connected to this service. Click any node to jump back into the canvas."
         }
       ),
-      /* @__PURE__ */ jsx78("div", { className: "rounded-2xl border border-slate-200 bg-white p-4 dark:border-slate-800 dark:bg-slate-950/80", children: summary.attachedNodeIds.length ? /* @__PURE__ */ jsx78("div", { className: "flex flex-wrap gap-2", children: summary.attachedNodeIds.map((nodeId, index) => /* @__PURE__ */ jsx78(
+      /* @__PURE__ */ jsx86("div", { className: "rounded-2xl border border-slate-200 bg-white p-4 dark:border-slate-800 dark:bg-slate-950/80", children: summary.attachedNodeIds.length ? /* @__PURE__ */ jsx86("div", { className: "flex flex-wrap gap-2", children: summary.attachedNodeIds.map((nodeId, index) => /* @__PURE__ */ jsx86(
         "button",
         {
           type: "button",
@@ -15860,58 +17117,59 @@ function ServiceDetailCard({ mode, row, snapshot, onNodeClick, onOpenFallbackQui
           children: summary.attachedNodeLabels[index] ?? nodeId
         },
         `${row.id}:${nodeId}`
-      )) }) : /* @__PURE__ */ jsx78("p", { className: "text-sm text-slate-500 dark:text-slate-400", children: "This service is not attached to any node yet. Drag it from the catalog onto a node to assign it." }) })
+      )) }) : /* @__PURE__ */ jsx86("p", { className: "text-sm text-slate-500 dark:text-slate-400", children: "This service is not attached to any node yet. Drag it from the catalog onto a node to assign it." }) })
     ] })
   ] });
 }
 function SectionTitle2({ title, description }) {
-  return /* @__PURE__ */ jsxs56("div", { children: [
-    /* @__PURE__ */ jsx78("p", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: title }),
-    /* @__PURE__ */ jsx78("p", { className: "mt-1 text-xs text-slate-500 dark:text-slate-400", children: description })
+  return /* @__PURE__ */ jsxs64("div", { children: [
+    /* @__PURE__ */ jsx86("p", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: title }),
+    /* @__PURE__ */ jsx86("p", { className: "mt-1 text-xs text-slate-500 dark:text-slate-400", children: description })
   ] });
 }
 function DetailMetric({ label, value }) {
-  return /* @__PURE__ */ jsxs56("div", { className: "rounded-2xl bg-white px-4 py-3 dark:bg-slate-950", children: [
-    /* @__PURE__ */ jsx78("p", { className: "text-[11px] font-semibold tracking-[0.16em] text-slate-400 uppercase dark:text-slate-500", children: label }),
-    /* @__PURE__ */ jsx78("p", { className: "mt-2 text-sm font-semibold text-slate-900 dark:text-slate-100", children: value })
+  return /* @__PURE__ */ jsxs64("div", { className: "rounded-2xl bg-white px-4 py-3 dark:bg-slate-950", children: [
+    /* @__PURE__ */ jsx86("p", { className: "text-[11px] font-semibold tracking-[0.16em] text-slate-400 uppercase dark:text-slate-500", children: label }),
+    /* @__PURE__ */ jsx86("p", { className: "mt-2 text-sm font-semibold text-slate-900 dark:text-slate-100", children: value })
   ] });
 }
 function FilterChip({ label, tone = "default" }) {
-  return /* @__PURE__ */ jsx78("span", { className: cn("rounded-full px-2.5 py-1 text-[11px] font-medium", filterChipClassName(tone)), children: label });
+  return /* @__PURE__ */ jsx86("span", { className: cn("rounded-full px-2.5 py-1 text-[11px] font-medium", filterChipClassName(tone)), children: label });
 }
 
 // src/workspace/bottom-panel/services-split-pane.tsx
-import { jsx as jsx79, jsxs as jsxs57 } from "react/jsx-runtime";
+import { jsx as jsx87, jsxs as jsxs65 } from "react/jsx-runtime";
 var UNGROUPED_TREE_VALUE2 = "__catalog_ungrouped__";
 function ServicesSplitPane(props) {
   const emptyTitle = props.mode === "active" ? "No active services yet" : "No services match this view";
   const emptyDescription = props.mode === "active" ? "Connect a service to a tag, field, or option and it will appear here with its bindings." : props.mode === "catalog" ? "Select a catalog group or create one to organize source services for faster assignment." : "Try changing the search or toggles to bring more services into view.";
-  return /* @__PURE__ */ jsx79("div", { className: "min-h-90 p-4", children: /* @__PURE__ */ jsxs57(ResizablePanelGroup, { direction: "horizontal", className: "min-h-90", children: [
-    /* @__PURE__ */ jsx79(ResizablePanel, { defaultSize: 44, minSize: 30, children: /* @__PURE__ */ jsxs57("section", { className: "flex h-full min-h-0 flex-col overflow-hidden", children: [
-      /* @__PURE__ */ jsxs57("div", { className: "space-y-3 border-b border-slate-100 pr-4 dark:border-slate-800", children: [
-        /* @__PURE__ */ jsxs57("div", { className: "flex items-center justify-between gap-3", children: [
-          /* @__PURE__ */ jsx79("div", { children: /* @__PURE__ */ jsx79("h4", { className: "mt-1 text-base font-semibold text-slate-900 dark:text-slate-100", children: props.mode === "active" ? "Attached services" : props.mode === "catalog" ? "Catalog workspace" : "All services" }) }),
-          /* @__PURE__ */ jsxs57("div", { className: "flex items-center gap-2", children: [
-            props.mode === "catalog" ? /* @__PURE__ */ jsx79("span", { className: "rounded-full bg-blue-50 px-2.5 py-1 text-[10px] font-semibold tracking-[0.16em] text-blue-700 uppercase dark:bg-blue-500/10 dark:text-blue-200", children: props.selectedCatalogGroupLabel ?? "Ungrouped" }) : null,
-            /* @__PURE__ */ jsx79("span", { className: "rounded-full bg-slate-100 px-2.5 py-1 text-[10px] font-semibold tracking-[0.16em] text-slate-600 uppercase dark:bg-slate-900 dark:text-slate-300", children: props.rows.length })
+  const [size, setSize] = useState40(44);
+  return /* @__PURE__ */ jsx87("div", { className: "min-h-90 p-4", children: /* @__PURE__ */ jsxs65(ResizablePanelGroup, { direction: "horizontal", className: "min-h-90", children: [
+    /* @__PURE__ */ jsx87(ResizablePanel, { onResize: (s) => setSize(s.inPixels), defaultSize: 44, minSize: 30, children: /* @__PURE__ */ jsxs65("section", { className: "flex h-full min-h-0 flex-col overflow-hidden", style: { "--resizable-width": size + "px" }, children: [
+      /* @__PURE__ */ jsxs65("div", { className: "space-y-3 border-b border-slate-100 pr-4 dark:border-slate-800", children: [
+        /* @__PURE__ */ jsxs65("div", { className: "flex items-center justify-between gap-3", children: [
+          /* @__PURE__ */ jsx87("div", { children: /* @__PURE__ */ jsx87("h4", { className: "mt-1 text-base font-semibold text-slate-900 dark:text-slate-100", children: props.mode === "active" ? "Attached services" : props.mode === "catalog" ? "Catalog workspace" : "All services" }) }),
+          /* @__PURE__ */ jsxs65("div", { className: "flex items-center gap-2", children: [
+            props.mode === "catalog" ? /* @__PURE__ */ jsx87("span", { className: "rounded-full bg-blue-50 px-2.5 py-1 text-[10px] font-semibold tracking-[0.16em] text-blue-700 uppercase dark:bg-blue-500/10 dark:text-blue-200", children: props.selectedCatalogGroupLabel ?? "Ungrouped" }) : null,
+            /* @__PURE__ */ jsx87("span", { className: "rounded-full bg-slate-100 px-2.5 py-1 text-[10px] font-semibold tracking-[0.16em] text-slate-600 uppercase dark:bg-slate-900 dark:text-slate-300", children: props.rows.length })
           ] })
         ] }),
-        props.mode === "all" && props.appliedSnapshot?.selectedTag ? /* @__PURE__ */ jsxs57("div", { className: "flex flex-wrap gap-2 pb-3", children: [
-          /* @__PURE__ */ jsx79(FilterChip2, { label: `Context tag: ${props.appliedSnapshot.selectedTag.label}` }),
-          /* @__PURE__ */ jsx79(
+        props.mode === "all" && props.appliedSnapshot?.selectedTag ? /* @__PURE__ */ jsxs65("div", { className: "flex flex-wrap gap-2 pb-3", children: [
+          /* @__PURE__ */ jsx87(FilterChip2, { label: `Context tag: ${props.appliedSnapshot.selectedTag.label}` }),
+          /* @__PURE__ */ jsx87(
             FilterChip2,
             {
               label: `${props.appliedSnapshot.state.selectedButtons.length} selected trigger${props.appliedSnapshot.state.selectedButtons.length === 1 ? "" : "s"}`
             }
           ),
-          /* @__PURE__ */ jsx79(
+          /* @__PURE__ */ jsx87(
             FilterChip2,
             {
               label: `${props.appliedSnapshot.usedServiceIds.length} active service${props.appliedSnapshot.usedServiceIds.length === 1 ? "" : "s"} in context`
             }
           )
         ] }) : null,
-        props.mode === "catalog" ? /* @__PURE__ */ jsx79("div", { className: "space-y-3 pb-3", children: /* @__PURE__ */ jsx79(
+        props.mode === "catalog" ? /* @__PURE__ */ jsx87("div", { className: "space-y-3 pb-3", children: /* @__PURE__ */ jsx87(
           CatalogToolbar,
           {
             groups: props.catalogGroups ?? [],
@@ -15933,7 +17191,7 @@ function ServicesSplitPane(props) {
           }
         ) }) : null
       ] }),
-      /* @__PURE__ */ jsx79(ScrollArea, { className: "h-[calc(var(--bottom-panel-height)-14.5rem)] max-h-[calc(var(--bottom-panel-height)-14.5rem)] min-h-0 flex-1", children: /* @__PURE__ */ jsx79("div", { className: "space-y-2 p-3 pl-0", children: props.rows.length === 0 ? /* @__PURE__ */ jsx79(EmptyState, { title: emptyTitle, description: emptyDescription }) : props.rows.map((row) => /* @__PURE__ */ jsxs57(
+      /* @__PURE__ */ jsx87(ScrollArea, { className: "h-[calc(var(--bottom-panel-height)-14.5rem)] max-h-[calc(var(--bottom-panel-height)-14.5rem)] min-h-0 flex-1", children: /* @__PURE__ */ jsx87("div", { className: "space-y-2 p-3 pl-0", children: props.rows.length === 0 ? /* @__PURE__ */ jsx87(EmptyState, { title: emptyTitle, description: emptyDescription }) : props.rows.map((row) => /* @__PURE__ */ jsxs65(
         "button",
         {
           type: "button",
@@ -15946,34 +17204,34 @@ function ServicesSplitPane(props) {
             props.selectedRowId === row.id ? "border-blue-300 bg-blue-50 shadow-sm dark:border-blue-500/40 dark:bg-blue-500/10" : "border-slate-200 bg-white hover:border-slate-300 hover:bg-slate-50 dark:border-slate-800 dark:bg-slate-950/60 dark:hover:border-slate-700"
           ),
           children: [
-            /* @__PURE__ */ jsxs57("div", { className: "flex items-start justify-between gap-3", children: [
-              /* @__PURE__ */ jsxs57("div", { className: "min-w-0", children: [
-                /* @__PURE__ */ jsxs57("div", { className: "flex items-center gap-2", children: [
-                  /* @__PURE__ */ jsx79(StatusDot, { tone: row.statusTone }),
-                  /* @__PURE__ */ jsx79("span", { className: "truncate text-sm font-semibold text-slate-900 dark:text-slate-100", children: row.summary.name })
+            /* @__PURE__ */ jsxs65("div", { className: "flex items-start justify-between gap-3", children: [
+              /* @__PURE__ */ jsxs65("div", { className: "min-w-0", children: [
+                /* @__PURE__ */ jsxs65("div", { className: "flex items-center gap-2", children: [
+                  /* @__PURE__ */ jsx87(StatusDot, { tone: row.statusTone }),
+                  /* @__PURE__ */ jsx87("span", { title: row.summary.name, className: "truncate max-w-[calc(var(--resizable-width)-12rem)] text-sm font-semibold text-slate-900 dark:text-slate-100", children: row.summary.name })
                 ] }),
-                /* @__PURE__ */ jsxs57("div", { className: "mt-1 flex flex-wrap items-center gap-2 text-xs text-slate-500 dark:text-slate-400", children: [
-                  /* @__PURE__ */ jsxs57("span", { children: [
+                /* @__PURE__ */ jsxs65("div", { className: "mt-1 flex flex-wrap items-center gap-2 text-xs text-slate-500 dark:text-slate-400", children: [
+                  /* @__PURE__ */ jsxs65("span", { children: [
                     "#",
                     row.summary.id
                   ] }),
-                  row.summary.category ? /* @__PURE__ */ jsx79("span", { children: row.summary.category }) : null,
-                  row.summary.platformId ? /* @__PURE__ */ jsx79("span", { children: row.summary.platformId }) : null
+                  row.summary.category ? /* @__PURE__ */ jsx87("span", { children: row.summary.category }) : null,
+                  row.summary.platformId ? /* @__PURE__ */ jsx87("span", { children: row.summary.platformId }) : null
                 ] })
               ] }),
-              /* @__PURE__ */ jsx79("span", { className: statusBadgeClassName(row.statusTone), children: row.statusLabel })
+              /* @__PURE__ */ jsx87("span", { className: statusBadgeClassName(row.statusTone), children: row.statusLabel })
             ] }),
-            /* @__PURE__ */ jsxs57("div", { className: "mt-3 flex flex-wrap items-center gap-2", children: [
-              /* @__PURE__ */ jsxs57("span", { className: "rounded-full bg-slate-100 px-2.5 py-1 text-[11px] text-slate-600 dark:bg-slate-900 dark:text-slate-300", children: [
+            /* @__PURE__ */ jsxs65("div", { className: "mt-3 flex flex-wrap items-center gap-2", children: [
+              /* @__PURE__ */ jsxs65("span", { className: "rounded-full bg-slate-100 px-2.5 py-1 text-[11px] text-slate-600 dark:bg-slate-900 dark:text-slate-300", children: [
                 row.summary.attachmentCount,
                 " node",
                 row.summary.attachmentCount === 1 ? "" : "s"
               ] }),
-              row.summary.rate != null ? /* @__PURE__ */ jsxs57("span", { className: "rounded-full bg-slate-100 px-2.5 py-1 text-[11px] text-slate-600 dark:bg-slate-900 dark:text-slate-300", children: [
+              row.summary.rate != null ? /* @__PURE__ */ jsxs65("span", { className: "rounded-full bg-slate-100 px-2.5 py-1 text-[11px] text-slate-600 dark:bg-slate-900 dark:text-slate-300", children: [
                 "Rate ",
                 row.summary.rate
               ] }) : null,
-              row.reasonLabels.slice(0, 2).map((reason) => /* @__PURE__ */ jsx79(
+              row.reasonLabels.slice(0, 2).map((reason) => /* @__PURE__ */ jsx87(
                 "span",
                 {
                   className: "rounded-full bg-amber-50 px-2.5 py-1 text-[11px] text-amber-700 dark:bg-amber-500/10 dark:text-amber-200",
@@ -15987,14 +17245,14 @@ function ServicesSplitPane(props) {
         row.id
       )) }) })
     ] }) }),
-    /* @__PURE__ */ jsx79(ResizableHandle, { withHandle: true }),
-    /* @__PURE__ */ jsx79(ResizablePanel, { defaultSize: 56, minSize: 36, children: /* @__PURE__ */ jsxs57("section", { className: "flex h-full min-h-0 flex-col overflow-hidden", children: [
-      /* @__PURE__ */ jsxs57("div", { className: "border-b border-slate-100 px-4 dark:border-slate-800", children: [
-        /* @__PURE__ */ jsx79("p", { className: "text-xs font-semibold tracking-[0.18em] text-slate-400 uppercase dark:text-slate-500", children: "Service detail" }),
-        /* @__PURE__ */ jsx79("h4", { className: "mt-1 text-base font-semibold text-slate-900 dark:text-slate-100", children: props.detailRow ? props.detailRow.summary.name : "Select a service" }),
-        /* @__PURE__ */ jsx79("p", { className: "mt-1 text-sm text-slate-500 dark:text-slate-400", children: props.mode === "active" ? "Highlight connected nodes, inspect usage, and jump back into the canvas." : props.mode === "catalog" ? "Inspect compatibility, pricing, and bindings while browsing manual catalog groups." : "Inspect compatibility, pricing, and bindings before assigning the service to a node." })
+    /* @__PURE__ */ jsx87(ResizableHandle, { withHandle: true }),
+    /* @__PURE__ */ jsx87(ResizablePanel, { defaultSize: 56, minSize: 36, children: /* @__PURE__ */ jsxs65("section", { className: "flex h-full min-h-0 flex-col overflow-hidden", children: [
+      /* @__PURE__ */ jsxs65("div", { className: "border-b border-slate-100 px-4 dark:border-slate-800", children: [
+        /* @__PURE__ */ jsx87("p", { className: "text-xs font-semibold tracking-[0.18em] text-slate-400 uppercase dark:text-slate-500", children: "Service detail" }),
+        /* @__PURE__ */ jsx87("h4", { className: "mt-1 text-base font-semibold text-slate-900 dark:text-slate-100", children: props.detailRow ? props.detailRow.summary.name : "Select a service" }),
+        /* @__PURE__ */ jsx87("p", { className: "mt-1 text-sm text-slate-500 dark:text-slate-400", children: props.mode === "active" ? "Highlight connected nodes, inspect usage, and jump back into the canvas." : props.mode === "catalog" ? "Inspect compatibility, pricing, and bindings while browsing manual catalog groups." : "Inspect compatibility, pricing, and bindings before assigning the service to a node." })
       ] }),
-      /* @__PURE__ */ jsx79(ScrollArea, { className: "h-[calc(var(--bottom-panel-height)-14.5rem)] max-h-[calc(var(--bottom-panel-height)-14.5rem)] min-h-0 flex-1", children: /* @__PURE__ */ jsx79("div", { className: "p-5", children: props.detailRow ? /* @__PURE__ */ jsx79(
+      /* @__PURE__ */ jsx87(ScrollArea, { className: "h-[calc(var(--bottom-panel-height)-14.5rem)] max-h-[calc(var(--bottom-panel-height)-14.5rem)] min-h-0 flex-1", children: /* @__PURE__ */ jsx87("div", { className: "p-5", children: props.detailRow ? /* @__PURE__ */ jsx87(
         ServiceDetailCard,
         {
           mode: props.mode,
@@ -16004,7 +17262,7 @@ function ServicesSplitPane(props) {
           onOpenFallbackQuickAdd: props.onOpenFallbackQuickAdd,
           onOpenFallbackEditor: props.onOpenFallbackEditor
         }
-      ) : /* @__PURE__ */ jsx79(
+      ) : /* @__PURE__ */ jsx87(
         EmptyState,
         {
           title: "No service selected",
@@ -16026,8 +17284,8 @@ function CatalogContextPopover({
   onDraftContextChange
 }) {
   const context = draftContext;
-  return /* @__PURE__ */ jsxs57(Popover, { open, onOpenChange, children: [
-    /* @__PURE__ */ jsx79(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx79(
+  return /* @__PURE__ */ jsxs65(Popover, { open, onOpenChange, children: [
+    /* @__PURE__ */ jsx87(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx87(
       "button",
       {
         type: "button",
@@ -16036,10 +17294,10 @@ function CatalogContextPopover({
           "inline-flex h-9 w-9 items-center justify-center rounded-xl border text-sm transition",
           compatibleOnly ? "border-blue-200 bg-blue-50 text-blue-700 dark:border-blue-500/30 dark:bg-blue-500/10 dark:text-blue-200" : "border-slate-200 bg-white text-slate-600 hover:bg-slate-100 dark:border-slate-800 dark:bg-slate-950 dark:text-slate-300 dark:hover:bg-slate-900"
         ),
-        children: /* @__PURE__ */ jsx79(FiFilter2, {})
+        children: /* @__PURE__ */ jsx87(FiFilter2, {})
       }
     ) }),
-    /* @__PURE__ */ jsxs57(
+    /* @__PURE__ */ jsxs65(
       PopoverContent,
       {
         align: "end",
@@ -16047,31 +17305,31 @@ function CatalogContextPopover({
         collisionPadding: 16,
         className: "max-h-[min(32rem,var(--radix-popover-content-available-height))] w-[min(24rem,calc(100vw-2rem))] overflow-hidden rounded-2xl p-0",
         children: [
-          /* @__PURE__ */ jsxs57("div", { className: "border-b border-slate-200 px-4 py-3 dark:border-slate-800", children: [
-            /* @__PURE__ */ jsx79("div", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: "Catalog context" }),
-            /* @__PURE__ */ jsx79("p", { className: "mt-1 text-xs text-slate-500 dark:text-slate-400", children: "Control compatibility checks here, or link them to the current workspace context." })
+          /* @__PURE__ */ jsxs65("div", { className: "border-b border-slate-200 px-4 py-3 dark:border-slate-800", children: [
+            /* @__PURE__ */ jsx87("div", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: "Catalog context" }),
+            /* @__PURE__ */ jsx87("p", { className: "mt-1 text-xs text-slate-500 dark:text-slate-400", children: "Control compatibility checks here, or link them to the current workspace context." })
           ] }),
-          /* @__PURE__ */ jsx79(ScrollArea, { className: "h-[calc(var(--radix-popover-content-available-height)-4.5rem)] max-h-[calc(var(--radix-popover-content-available-height)-4.5rem)]", children: /* @__PURE__ */ jsxs57("div", { className: "space-y-4 p-4", children: [
-            /* @__PURE__ */ jsxs57("label", { className: "flex items-start justify-between gap-3 text-sm text-slate-900 dark:text-slate-100", children: [
-              /* @__PURE__ */ jsxs57("span", { className: "min-w-0", children: [
-                /* @__PURE__ */ jsx79("span", { className: "block font-medium", children: "Compatible only" }),
-                /* @__PURE__ */ jsx79("span", { className: "mt-1 block text-xs text-slate-500 dark:text-slate-400", children: "Show only services that fit this catalog context safely." })
+          /* @__PURE__ */ jsx87(ScrollArea, { className: "h-[calc(var(--radix-popover-content-available-height)-4.5rem)] max-h-[calc(var(--radix-popover-content-available-height)-4.5rem)]", children: /* @__PURE__ */ jsxs65("div", { className: "space-y-4 p-4", children: [
+            /* @__PURE__ */ jsxs65("label", { className: "flex items-start justify-between gap-3 text-sm text-slate-900 dark:text-slate-100", children: [
+              /* @__PURE__ */ jsxs65("span", { className: "min-w-0", children: [
+                /* @__PURE__ */ jsx87("span", { className: "block font-medium", children: "Compatible only" }),
+                /* @__PURE__ */ jsx87("span", { className: "mt-1 block text-xs text-slate-500 dark:text-slate-400", children: "Show only services that fit this catalog context safely." })
               ] }),
-              /* @__PURE__ */ jsx79("input", { type: "checkbox", checked: compatibleOnly, onChange: (event) => onCompatibleOnlyChange(event.target.checked) })
+              /* @__PURE__ */ jsx87("input", { type: "checkbox", checked: compatibleOnly, onChange: (event) => onCompatibleOnlyChange(event.target.checked) })
             ] }),
-            /* @__PURE__ */ jsxs57("label", { className: "flex items-start justify-between gap-3 text-sm text-slate-900 dark:text-slate-100", children: [
-              /* @__PURE__ */ jsxs57("span", { className: "min-w-0", children: [
-                /* @__PURE__ */ jsx79("span", { className: "block font-medium", children: "Link to current context" }),
-                /* @__PURE__ */ jsx79("span", { className: "mt-1 block text-xs text-slate-500 dark:text-slate-400", children: "Mirror the current canvas tag and selected buttons while linked." })
+            /* @__PURE__ */ jsxs65("label", { className: "flex items-start justify-between gap-3 text-sm text-slate-900 dark:text-slate-100", children: [
+              /* @__PURE__ */ jsxs65("span", { className: "min-w-0", children: [
+                /* @__PURE__ */ jsx87("span", { className: "block font-medium", children: "Link to current context" }),
+                /* @__PURE__ */ jsx87("span", { className: "mt-1 block text-xs text-slate-500 dark:text-slate-400", children: "Mirror the current canvas tag and selected buttons while linked." })
               ] }),
-              /* @__PURE__ */ jsx79("input", { type: "checkbox", checked: contextLinked, onChange: (event) => onContextLinkedChange(event.target.checked) })
+              /* @__PURE__ */ jsx87("input", { type: "checkbox", checked: contextLinked, onChange: (event) => onContextLinkedChange(event.target.checked) })
             ] }),
-            /* @__PURE__ */ jsxs57("div", { className: "space-y-2 rounded-2xl border border-slate-200 bg-slate-50/70 p-3 dark:border-slate-800 dark:bg-slate-900/40", children: [
-              /* @__PURE__ */ jsx79("div", { className: "text-xs font-semibold tracking-[0.16em] text-slate-500 uppercase dark:text-slate-400", children: "Tags" }),
-              /* @__PURE__ */ jsx79("div", { className: "space-y-2", children: (draftSnapshot?.tags ?? []).map((tag) => {
+            /* @__PURE__ */ jsxs65("div", { className: "space-y-2 rounded-2xl border border-slate-200 bg-slate-50/70 p-3 dark:border-slate-800 dark:bg-slate-900/40", children: [
+              /* @__PURE__ */ jsx87("div", { className: "text-xs font-semibold tracking-[0.16em] text-slate-500 uppercase dark:text-slate-400", children: "Tags" }),
+              /* @__PURE__ */ jsx87("div", { className: "space-y-2", children: (draftSnapshot?.tags ?? []).map((tag) => {
                 const selected = context?.selectedTagId === tag.id;
-                return /* @__PURE__ */ jsxs57("label", { className: "flex items-start gap-3 text-sm text-slate-900 dark:text-slate-100", children: [
-                  /* @__PURE__ */ jsx79(
+                return /* @__PURE__ */ jsxs65("label", { className: "flex items-start gap-3 text-sm text-slate-900 dark:text-slate-100", children: [
+                  /* @__PURE__ */ jsx87(
                     "input",
                     {
                       type: "radio",
@@ -16089,25 +17347,25 @@ function CatalogContextPopover({
                       })
                     }
                   ),
-                  /* @__PURE__ */ jsxs57("span", { className: "min-w-0", children: [
-                    /* @__PURE__ */ jsx79("span", { className: "block font-medium", children: tag.label }),
-                    tag.description ? /* @__PURE__ */ jsx79("span", { className: "block text-xs text-slate-500 dark:text-slate-400", children: tag.description }) : null
+                  /* @__PURE__ */ jsxs65("span", { className: "min-w-0", children: [
+                    /* @__PURE__ */ jsx87("span", { className: "block font-medium", children: tag.label }),
+                    tag.description ? /* @__PURE__ */ jsx87("span", { className: "block text-xs text-slate-500 dark:text-slate-400", children: tag.description }) : null
                   ] })
                 ] }, tag.id);
               }) })
             ] }),
-            /* @__PURE__ */ jsxs57("div", { className: "space-y-2 rounded-2xl border border-slate-200 bg-slate-50/70 p-3 dark:border-slate-800 dark:bg-slate-900/40", children: [
-              /* @__PURE__ */ jsx79("div", { className: "text-xs font-semibold tracking-[0.16em] text-slate-500 uppercase dark:text-slate-400", children: "Selected buttons" }),
-              draftSnapshot?.buttonGroups?.length ? /* @__PURE__ */ jsx79("div", { className: "space-y-3", children: draftSnapshot.buttonGroups.map((group) => /* @__PURE__ */ jsxs57("div", { className: "space-y-2", children: [
-                /* @__PURE__ */ jsx79("div", { className: "text-sm font-medium text-slate-900 dark:text-slate-100", children: group.label }),
-                /* @__PURE__ */ jsx79("div", { className: "space-y-1", children: group.options.map((option) => {
+            /* @__PURE__ */ jsxs65("div", { className: "space-y-2 rounded-2xl border border-slate-200 bg-slate-50/70 p-3 dark:border-slate-800 dark:bg-slate-900/40", children: [
+              /* @__PURE__ */ jsx87("div", { className: "text-xs font-semibold tracking-[0.16em] text-slate-500 uppercase dark:text-slate-400", children: "Selected buttons" }),
+              draftSnapshot?.buttonGroups?.length ? /* @__PURE__ */ jsx87("div", { className: "space-y-3", children: draftSnapshot.buttonGroups.map((group) => /* @__PURE__ */ jsxs65("div", { className: "space-y-2", children: [
+                /* @__PURE__ */ jsx87("div", { className: "text-sm font-medium text-slate-900 dark:text-slate-100", children: group.label }),
+                /* @__PURE__ */ jsx87("div", { className: "space-y-1", children: group.options.map((option) => {
                   const checked = context?.selectedButtons.includes(option.id) ?? false;
-                  return /* @__PURE__ */ jsxs57(
+                  return /* @__PURE__ */ jsxs65(
                     "label",
                     {
                       className: "flex items-start gap-3 text-sm text-slate-900 dark:text-slate-100",
                       children: [
-                        /* @__PURE__ */ jsx79(
+                        /* @__PURE__ */ jsx87(
                           "input",
                           {
                             type: "checkbox",
@@ -16124,22 +17382,22 @@ function CatalogContextPopover({
                             })
                           }
                         ),
-                        /* @__PURE__ */ jsxs57("span", { className: "min-w-0", children: [
-                          /* @__PURE__ */ jsx79("span", { className: "block", children: option.label }),
-                          option.description ? /* @__PURE__ */ jsx79("span", { className: "block text-xs text-slate-500 dark:text-slate-400", children: option.description }) : null
+                        /* @__PURE__ */ jsxs65("span", { className: "min-w-0", children: [
+                          /* @__PURE__ */ jsx87("span", { className: "block", children: option.label }),
+                          option.description ? /* @__PURE__ */ jsx87("span", { className: "block text-xs text-slate-500 dark:text-slate-400", children: option.description }) : null
                         ] })
                       ]
                     },
                     option.id
                   );
                 }) })
-              ] }, group.id)) }) : /* @__PURE__ */ jsx79("div", { className: "text-sm text-slate-500 dark:text-slate-400", children: "No visible trigger options for the selected tag." })
+              ] }, group.id)) }) : /* @__PURE__ */ jsx87("div", { className: "text-sm text-slate-500 dark:text-slate-400", children: "No visible trigger options for the selected tag." })
             ] }),
-            /* @__PURE__ */ jsxs57("div", { className: "space-y-2 rounded-2xl border border-slate-200 bg-slate-50/70 p-3 dark:border-slate-800 dark:bg-slate-900/40", children: [
-              /* @__PURE__ */ jsx79("div", { className: "text-xs font-semibold tracking-[0.16em] text-slate-500 uppercase dark:text-slate-400", children: "Safety" }),
-              /* @__PURE__ */ jsxs57("label", { className: "flex items-center justify-between gap-3 text-sm text-slate-900 dark:text-slate-100", children: [
-                /* @__PURE__ */ jsx79("span", { children: "Strict safety" }),
-                /* @__PURE__ */ jsx79(
+            /* @__PURE__ */ jsxs65("div", { className: "space-y-2 rounded-2xl border border-slate-200 bg-slate-50/70 p-3 dark:border-slate-800 dark:bg-slate-900/40", children: [
+              /* @__PURE__ */ jsx87("div", { className: "text-xs font-semibold tracking-[0.16em] text-slate-500 uppercase dark:text-slate-400", children: "Safety" }),
+              /* @__PURE__ */ jsxs65("label", { className: "flex items-center justify-between gap-3 text-sm text-slate-900 dark:text-slate-100", children: [
+                /* @__PURE__ */ jsx87("span", { children: "Strict safety" }),
+                /* @__PURE__ */ jsx87(
                   "input",
                   {
                     type: "checkbox",
@@ -16152,9 +17410,9 @@ function CatalogContextPopover({
                   }
                 )
               ] }),
-              /* @__PURE__ */ jsxs57("label", { className: "flex items-center justify-between gap-3 text-sm text-slate-900 dark:text-slate-100", children: [
-                /* @__PURE__ */ jsx79("span", { children: "Enforce policies" }),
-                /* @__PURE__ */ jsx79(
+              /* @__PURE__ */ jsxs65("label", { className: "flex items-center justify-between gap-3 text-sm text-slate-900 dark:text-slate-100", children: [
+                /* @__PURE__ */ jsx87("span", { children: "Enforce policies" }),
+                /* @__PURE__ */ jsx87(
                   "input",
                   {
                     type: "checkbox",
@@ -16188,34 +17446,34 @@ function CatalogToolbar({
 }) {
   const treeValue = selectedGroupId ?? (ungroupedSelected ? UNGROUPED_TREE_VALUE2 : void 0);
   const treeOptions = buildCatalogGroupTreeOptions2(groups);
-  return /* @__PURE__ */ jsxs57("div", { className: "flex items-center justify-between gap-3", children: [
-    /* @__PURE__ */ jsxs57("div", { className: "flex flex-wrap items-center gap-2", children: [
-      /* @__PURE__ */ jsx79(
+  return /* @__PURE__ */ jsxs65("div", { className: "flex items-center justify-between gap-3", children: [
+    /* @__PURE__ */ jsxs65("div", { className: "flex flex-wrap items-center gap-2", children: [
+      /* @__PURE__ */ jsx87(
         GroupInputPopoverButton,
         {
           label: "Create top-level group",
-          icon: /* @__PURE__ */ jsx79(FiPlus2, {}),
+          icon: /* @__PURE__ */ jsx87(FiPlus2, {}),
           submitLabel: "Create",
           title: "Create root group",
           onSubmit: onCreateRootGroup
         }
       ),
-      /* @__PURE__ */ jsx79(
+      /* @__PURE__ */ jsx87(
         GroupInputPopoverButton,
         {
           label: "Create child group",
-          icon: /* @__PURE__ */ jsx79(FiFolderPlus, {}),
+          icon: /* @__PURE__ */ jsx87(FiFolderPlus, {}),
           title: "Create child group",
           submitLabel: "Create",
           disabled: !selectedGroupId,
           onSubmit: onCreateChildGroup
         }
       ),
-      /* @__PURE__ */ jsx79(
+      /* @__PURE__ */ jsx87(
         GroupInputPopoverButton,
         {
           label: "Rename selected group",
-          icon: /* @__PURE__ */ jsx79(FiEdit2, {}),
+          icon: /* @__PURE__ */ jsx87(FiEdit2, {}),
           title: "Rename group",
           submitLabel: "Save",
           disabled: !selectedGroupId,
@@ -16223,11 +17481,11 @@ function CatalogToolbar({
           onSubmit: onRenameGroup
         }
       ),
-      /* @__PURE__ */ jsx79(
+      /* @__PURE__ */ jsx87(
         ConfirmPopoverButton,
         {
           label: "Delete selected group",
-          icon: /* @__PURE__ */ jsx79(FiTrash22, {}),
+          icon: /* @__PURE__ */ jsx87(FiTrash22, {}),
           title: "Delete group?",
           description: selectedGroupLabel ? `Remove ${selectedGroupLabel} and its child groups.` : "Remove this group and its child groups.",
           confirmLabel: "Delete",
@@ -16235,10 +17493,10 @@ function CatalogToolbar({
           onConfirm: onDeleteGroup
         }
       ),
-      /* @__PURE__ */ jsx79(ToolbarIconButton, { label: "Assign services to selected group", disabled: !selectedGroupId, onClick: onAssignServices, children: /* @__PURE__ */ jsx79(FiPlus2, {}) })
+      /* @__PURE__ */ jsx87(ToolbarIconButton, { label: "Assign services to selected group", disabled: !selectedGroupId, onClick: onAssignServices, children: /* @__PURE__ */ jsx87(FiPlus2, {}) })
     ] }),
-    /* @__PURE__ */ jsx79(
-      InputField17,
+    /* @__PURE__ */ jsx87(
+      InputField20,
       {
         variant: "treeselect",
         mode: "button",
@@ -16252,7 +17510,7 @@ function CatalogToolbar({
           const next = event.value == null ? null : String(event.value);
           onSelectGroup(next === UNGROUPED_TREE_VALUE2 ? null : next);
         },
-        button: /* @__PURE__ */ jsx79(FaFolderOpen2, {})
+        button: /* @__PURE__ */ jsx87(FaFolderOpen2, {})
       }
     )
   ] });
@@ -16266,13 +17524,13 @@ function GroupInputPopoverButton({
   disabled = false,
   onSubmit
 }) {
-  const [open, setOpen] = useState35(false);
-  const [value, setValue] = useState35(initialValue);
-  useEffect23(() => {
+  const [open, setOpen] = useState40(false);
+  const [value, setValue] = useState40(initialValue);
+  useEffect25(() => {
     if (open) setValue(initialValue);
   }, [initialValue, open]);
-  return /* @__PURE__ */ jsxs57(Popover, { open, onOpenChange: setOpen, children: [
-    /* @__PURE__ */ jsx79(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx79(
+  return /* @__PURE__ */ jsxs65(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx87(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx87(
       "button",
       {
         type: "button",
@@ -16286,13 +17544,13 @@ function GroupInputPopoverButton({
         children: icon
       }
     ) }),
-    /* @__PURE__ */ jsx79(PopoverContent, { align: "start", side: "bottom", sideOffset: 8, collisionPadding: 16, className: "w-80 rounded-2xl", children: /* @__PURE__ */ jsxs57("div", { className: "space-y-3", children: [
-      /* @__PURE__ */ jsxs57("div", { children: [
-        /* @__PURE__ */ jsx79("div", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: title }),
-        /* @__PURE__ */ jsx79("p", { className: "mt-1 text-xs text-slate-500 dark:text-slate-400", children: "Names are editor-side catalog labels only." })
+    /* @__PURE__ */ jsx87(PopoverContent, { align: "start", side: "bottom", sideOffset: 8, collisionPadding: 16, className: "w-80 rounded-2xl", children: /* @__PURE__ */ jsxs65("div", { className: "space-y-3", children: [
+      /* @__PURE__ */ jsxs65("div", { children: [
+        /* @__PURE__ */ jsx87("div", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: title }),
+        /* @__PURE__ */ jsx87("p", { className: "mt-1 text-xs text-slate-500 dark:text-slate-400", children: "Names are editor-side catalog labels only." })
       ] }),
-      /* @__PURE__ */ jsx79(
-        InputField17,
+      /* @__PURE__ */ jsx87(
+        InputField20,
         {
           variant: "text",
           label: title,
@@ -16302,9 +17560,9 @@ function GroupInputPopoverButton({
           autoComplete: "off"
         }
       ),
-      /* @__PURE__ */ jsxs57("div", { className: "flex justify-end gap-2", children: [
-        /* @__PURE__ */ jsx79(Button, { type: "button", variant: "outline", size: "sm", onClick: () => setOpen(false), className: "rounded-xl", children: "Cancel" }),
-        /* @__PURE__ */ jsx79(
+      /* @__PURE__ */ jsxs65("div", { className: "flex justify-end gap-2", children: [
+        /* @__PURE__ */ jsx87(Button, { type: "button", variant: "outline", size: "sm", onClick: () => setOpen(false), className: "rounded-xl", children: "Cancel" }),
+        /* @__PURE__ */ jsx87(
           Button,
           {
             type: "button",
@@ -16333,9 +17591,9 @@ function ConfirmPopoverButton({
   disabled = false,
   onConfirm
 }) {
-  const [open, setOpen] = useState35(false);
-  return /* @__PURE__ */ jsxs57(Popover, { open, onOpenChange: setOpen, children: [
-    /* @__PURE__ */ jsx79(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx79(
+  const [open, setOpen] = useState40(false);
+  return /* @__PURE__ */ jsxs65(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx87(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx87(
       "button",
       {
         type: "button",
@@ -16349,14 +17607,14 @@ function ConfirmPopoverButton({
         children: icon
       }
     ) }),
-    /* @__PURE__ */ jsx79(PopoverContent, { align: "start", side: "bottom", sideOffset: 8, collisionPadding: 16, className: "w-80 rounded-2xl", children: /* @__PURE__ */ jsxs57("div", { className: "space-y-3", children: [
-      /* @__PURE__ */ jsxs57("div", { children: [
-        /* @__PURE__ */ jsx79("div", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: title }),
-        /* @__PURE__ */ jsx79("p", { className: "mt-1 text-xs text-slate-500 dark:text-slate-400", children: description })
+    /* @__PURE__ */ jsx87(PopoverContent, { align: "start", side: "bottom", sideOffset: 8, collisionPadding: 16, className: "w-80 rounded-2xl", children: /* @__PURE__ */ jsxs65("div", { className: "space-y-3", children: [
+      /* @__PURE__ */ jsxs65("div", { children: [
+        /* @__PURE__ */ jsx87("div", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: title }),
+        /* @__PURE__ */ jsx87("p", { className: "mt-1 text-xs text-slate-500 dark:text-slate-400", children: description })
       ] }),
-      /* @__PURE__ */ jsxs57("div", { className: "flex justify-end gap-2", children: [
-        /* @__PURE__ */ jsx79(Button, { type: "button", variant: "outline", size: "sm", onClick: () => setOpen(false), className: "rounded-xl", children: "Cancel" }),
-        /* @__PURE__ */ jsx79(
+      /* @__PURE__ */ jsxs65("div", { className: "flex justify-end gap-2", children: [
+        /* @__PURE__ */ jsx87(Button, { type: "button", variant: "outline", size: "sm", onClick: () => setOpen(false), className: "rounded-xl", children: "Cancel" }),
+        /* @__PURE__ */ jsx87(
           Button,
           {
             type: "button",
@@ -16379,8 +17637,8 @@ function ToolbarIconButton({
   disabled = false,
   onClick
 }) {
-  return /* @__PURE__ */ jsxs57(Tooltip, { children: [
-    /* @__PURE__ */ jsx79(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx79(
+  return /* @__PURE__ */ jsxs65(Tooltip, { children: [
+    /* @__PURE__ */ jsx87(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx87(
       "button",
       {
         type: "button",
@@ -16394,11 +17652,11 @@ function ToolbarIconButton({
         children
       }
     ) }),
-    /* @__PURE__ */ jsx79(TooltipContent, { side: "top", sideOffset: 8, children: label })
+    /* @__PURE__ */ jsx87(TooltipContent, { side: "top", sideOffset: 8, children: label })
   ] });
 }
 function FilterChip2({ label, tone = "default" }) {
-  return /* @__PURE__ */ jsx79("span", { className: cn("rounded-full px-2.5 py-1 text-[11px] font-medium", filterChipClassName(tone)), children: label });
+  return /* @__PURE__ */ jsx87("span", { className: cn("rounded-full px-2.5 py-1 text-[11px] font-medium", filterChipClassName(tone)), children: label });
 }
 function buildCatalogGroupTreeOptions2(groups, parentId = null) {
   return groups.filter((group) => (group.parentId ?? null) === parentId).sort((a, b) => (a.order ?? 0) - (b.order ?? 0) || a.label.localeCompare(b.label)).map((group) => {
@@ -16413,7 +17671,7 @@ function buildCatalogGroupTreeOptions2(groups, parentId = null) {
 }
 
 // src/workspace/bottom-panel/index.tsx
-import { Fragment as Fragment16, jsx as jsx80, jsxs as jsxs58 } from "react/jsx-runtime";
+import { Fragment as Fragment17, jsx as jsx88, jsxs as jsxs66 } from "react/jsx-runtime";
 var DRAG_MIME = "application/x-service-builder-service";
 function BottomConsolePanel({ controller, errors, activeServices, allServices, onServiceDragStateChange }) {
   const canvas = useCanvas21();
@@ -16424,26 +17682,26 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
   const policies2 = ws.policies.policies.data ?? [];
   const currentTagId = canvas.api.selection.currentTag?.();
   const preferredTagId = currentTagId != null ? String(currentTagId) : canvas.layers.tags[0]?.id != null ? String(canvas.layers.tags[0]?.id) : null;
-  const [activeSearch, setActiveSearch] = useState36("");
-  const [allSearch, setAllSearch] = useState36("");
-  const [compatibleOnly, setCompatibleOnly] = useState36(false);
-  const [hideActiveServices, setHideActiveServices] = useState36(false);
-  const [filterOpen, setFilterOpen] = useState36(false);
-  const [searchOpen, setSearchOpen] = useState36(false);
-  const [contextLinked, setContextLinked] = useState36(false);
-  const [servicePickerOpen, setServicePickerOpen] = useState36(false);
-  const [selectedActiveServiceId, setSelectedActiveServiceId] = useState36(null);
-  const [selectedAllServiceId, setSelectedAllServiceId] = useState36(null);
-  const [catalogContextDraft, setCatalogContextDraft] = useState36(
+  const [activeSearch, setActiveSearch] = useState41("");
+  const [allSearch, setAllSearch] = useState41("");
+  const [compatibleOnly, setCompatibleOnly] = useState41(false);
+  const [hideActiveServices, setHideActiveServices] = useState41(false);
+  const [filterOpen, setFilterOpen] = useState41(false);
+  const [searchOpen, setSearchOpen] = useState41(false);
+  const [contextLinked, setContextLinked] = useState41(false);
+  const [servicePickerOpen, setServicePickerOpen] = useState41(false);
+  const [selectedActiveServiceId, setSelectedActiveServiceId] = useState41(null);
+  const [selectedAllServiceId, setSelectedAllServiceId] = useState41(null);
+  const [catalogContextDraft, setCatalogContextDraft] = useState41(
     () => createDefaultServiceContext(canvas.props, preferredTagId)
   );
-  const [catalogState, setCatalogState] = useState36(null);
-  const [panelPosition, setPanelPosition] = useState36(() => readStoredPanelPosition());
-  const [draggingPanel, setDraggingPanel] = useState36(false);
-  const [consoleSubTab, setConsoleSubTab] = useState36("validation");
-  const [consoleScopeFilter, setConsoleScopeFilter] = useState36("all");
-  const [consoleSeverityFilter, setConsoleSeverityFilter] = useState36("all");
-  const [consoleIntroState, setConsoleIntroState] = useState36({
+  const [catalogState, setCatalogState] = useState41(null);
+  const [panelPosition, setPanelPosition] = useState41(() => readStoredPanelPosition());
+  const [draggingPanel, setDraggingPanel] = useState41(false);
+  const [consoleSubTab, setConsoleSubTab] = useState41("validation");
+  const [consoleScopeFilter, setConsoleScopeFilter] = useState41("all");
+  const [consoleSeverityFilter, setConsoleSeverityFilter] = useState41("all");
+  const [consoleIntroState, setConsoleIntroState] = useState41({
     validation: { minimized: false, closed: false },
     logs: { minimized: false, closed: false },
     notices: { minimized: false, closed: false }
@@ -16453,11 +17711,11 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
   const panelRef = useRef12(null);
   const searchInputRef = useRef12(null);
   const dragStartRef = useRef12(null);
-  const selectedButtons = useMemo36(
+  const selectedButtons = useMemo40(
     () => (canvas.api.selection.selectedButtons?.() ?? []).map((value) => String(value)),
     [canvas.api.selection, canvas.selectionInfo.ids, canvas.selectionInfo.optionIds]
   );
-  const liveSelectionContext = useMemo36(
+  const liveSelectionContext = useMemo40(
     () => ({
       selectedTagId: preferredTagId,
       selectedButtons,
@@ -16467,15 +17725,15 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
     [preferredTagId, selectedButtons]
   );
   const effectiveCatalogContext = contextLinked ? liveSelectionContext : catalogContextDraft;
-  const appliedSnapshot = useMemo36(
+  const appliedSnapshot = useMemo40(
     () => buildServiceContextSnapshot({ props: canvas.props, services: servicesMap, state: effectiveCatalogContext }),
     [canvas.props, effectiveCatalogContext, servicesMap]
   );
-  const draftSnapshot = useMemo36(
+  const draftSnapshot = useMemo40(
     () => buildServiceContextSnapshot({ props: canvas.props, services: servicesMap, state: catalogContextDraft }),
     [canvas.props, catalogContextDraft, servicesMap]
   );
-  const allChecksById = useMemo36(() => {
+  const allChecksById = useMemo40(() => {
     if (!appliedSnapshot.selectedTag) return /* @__PURE__ */ new Map();
     const candidateIds = Object.values(servicesMap).map((service) => service.id);
     const checks = canvas.api.editor.filterServicesForVisibleGroup(candidateIds, {
@@ -16487,16 +17745,16 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
     });
     return new Map(checks.map((check) => [String(check.id), check]));
   }, [appliedSnapshot, canvas.api.editor, policies2, servicesMap]);
-  const hiddenServiceIds = useMemo36(() => {
+  const hiddenServiceIds = useMemo40(() => {
     const ids = new Set(activeServices.map((service) => String(service.id)));
     for (const id of appliedSnapshot.usedServiceIds) ids.add(String(id));
     return ids;
   }, [activeServices, appliedSnapshot.usedServiceIds]);
-  const activeRows = useMemo36(
+  const activeRows = useMemo40(
     () => activeServices.map((summary) => buildServiceRowVM({ summary, services: servicesMap, search: activeSearch })).filter((row) => row.matchesSearch),
     [activeSearch, activeServices, servicesMap]
   );
-  const filteredCatalogRows = useMemo36(
+  const filteredCatalogRows = useMemo40(
     () => allServices.map(
       (summary) => buildServiceRowVM({
         summary,
@@ -16508,25 +17766,25 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
     ).filter((row) => row.matchesSearch).filter((row) => !compatibleOnly || row.isCompatible).filter((row) => !hideActiveServices || !hiddenServiceIds.has(row.id)),
     [allChecksById, allSearch, allServices, compatibleOnly, effectiveCatalogContext, hiddenServiceIds, hideActiveServices, servicesMap]
   );
-  useEffect24(() => {
+  useEffect26(() => {
     const next = createDefaultServiceContext(canvas.props, preferredTagId);
     setCatalogContextDraft((current) => {
       if (contextLinked) return current;
       return current.selectedTagId ? current : next;
     });
   }, [canvas.props, contextLinked, preferredTagId]);
-  useEffect24(() => {
+  useEffect26(() => {
     if (!contextLinked) return;
     setCatalogContextDraft(liveSelectionContext);
   }, [contextLinked, liveSelectionContext]);
-  useEffect24(() => {
+  useEffect26(() => {
     if (contextLinked) return;
     const next = sanitizeServiceContext(draftSnapshot, catalogContextDraft);
     if (JSON.stringify(next) !== JSON.stringify(catalogContextDraft)) {
       setCatalogContextDraft(next);
     }
   }, [catalogContextDraft, contextLinked, draftSnapshot]);
-  useEffect24(() => {
+  useEffect26(() => {
     const editor = canvas.api.editor;
     const ensured = editor.getCatalog?.() ?? editor.ensureCatalog?.();
     if (ensured) setCatalogState(ensured);
@@ -16544,19 +17802,19 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
     };
   }, [canvas.api]);
   const catalogPanelMode = catalogState?.viewMode === "grouped" ? "catalog" : "all";
-  const catalogGroups = useMemo36(
+  const catalogGroups = useMemo40(
     () => (catalogState?.nodes ?? []).filter((node) => node.kind === "group").sort((a, b) => (a.order ?? 0) - (b.order ?? 0) || a.label.localeCompare(b.label)),
     [catalogState]
   );
   const selectedCatalogGroupId = catalogGroups.some((node) => node.id === catalogState?.activeNodeId) ? String(catalogState?.activeNodeId) : null;
-  const groupedServiceIds = useMemo36(() => {
+  const groupedServiceIds = useMemo40(() => {
     const ids = /* @__PURE__ */ new Set();
     for (const group of catalogGroups) {
       for (const serviceId of group.serviceIds) ids.add(String(serviceId));
     }
     return ids;
   }, [catalogGroups]);
-  const catalogRows = useMemo36(() => {
+  const catalogRows = useMemo40(() => {
     if (!selectedCatalogGroupId) return filteredCatalogRows.filter((row) => !groupedServiceIds.has(row.id));
     const selectedGroup = catalogGroups.find((group) => group.id === selectedCatalogGroupId);
     if (!selectedGroup) return filteredCatalogRows.filter((row) => !groupedServiceIds.has(row.id));
@@ -16564,32 +17822,32 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
     return filteredCatalogRows.filter((row) => allowedIds.has(row.id));
   }, [catalogGroups, filteredCatalogRows, groupedServiceIds, selectedCatalogGroupId]);
   const visibleAllRows = catalogPanelMode === "catalog" ? catalogRows : filteredCatalogRows;
-  const notices = useMemo36(() => normalizeNotices(canvas.props?.notices), [canvas.props]);
-  const activeNodeIds = useMemo36(() => {
+  const notices = useMemo40(() => normalizeNotices(canvas.props?.notices), [canvas.props]);
+  const activeNodeIds = useMemo40(() => {
     const ids = /* @__PURE__ */ new Set();
     if (canvas.activeId) ids.add(String(canvas.activeId));
     for (const id of canvas.selectionInfo.ids) ids.add(String(id));
     return ids;
   }, [canvas.activeId, canvas.selectionInfo.ids]);
   const consoleIssueCount = errors.validation.length + errors.logs.length + notices.length;
-  useEffect24(() => {
+  useEffect26(() => {
     setSelectedActiveServiceId((current) => ensureSelectedRow(current, activeRows));
   }, [activeRows]);
-  useEffect24(() => {
+  useEffect26(() => {
     if (catalogState?.selectedServiceId == null) return;
     setSelectedAllServiceId(String(catalogState.selectedServiceId));
   }, [catalogState?.selectedServiceId]);
-  useEffect24(() => {
+  useEffect26(() => {
     setSelectedAllServiceId((current) => ensureSelectedRow(current, visibleAllRows));
   }, [visibleAllRows]);
-  useEffect24(() => {
+  useEffect26(() => {
     const desiredIds = controller.isOpen && controller.activeTab === "activeServices" && selectedActiveServiceId ? activeRows.find((row) => row.id === selectedActiveServiceId)?.summary.attachedNodeIds ?? [] : [];
     if (!sameIds(lastHighlightedIdsRef.current, desiredIds)) {
       canvas.api.setHighlighted(desiredIds);
       lastHighlightedIdsRef.current = [...desiredIds];
     }
   }, [activeRows, canvas.api, controller.activeTab, controller.isOpen, selectedActiveServiceId]);
-  useEffect24(() => {
+  useEffect26(() => {
     return () => {
       if (lastHighlightedIdsRef.current.length) {
         canvas.api.setHighlighted([]);
@@ -16597,10 +17855,10 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
       }
     };
   }, [canvas.api]);
-  useEffect24(() => {
+  useEffect26(() => {
     if (searchOpen) searchInputRef.current?.focus();
   }, [searchOpen]);
-  useEffect24(() => {
+  useEffect26(() => {
     setPanelPosition((current) => {
       const resolved = resolvePanelPosition(current, panelRef.current, panelContainerRef.current);
       persistPanelPosition(resolved);
@@ -16622,7 +17880,7 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
     }
     event.preventDefault();
   };
-  useEffect24(() => {
+  useEffect26(() => {
     if (!draggingPanel) return;
     const onPointerMove = (event) => {
       const start = dragStartRef.current;
@@ -16650,7 +17908,7 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
       window.removeEventListener("pointercancel", onPointerUp);
     };
   }, [draggingPanel, panelPosition]);
-  const setCatalogMode = useCallback21(
+  const setCatalogMode = useCallback22(
     (mode) => {
       const editor = canvas.api.editor;
       editor.ensureCatalog?.();
@@ -16658,27 +17916,27 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
     },
     [canvas.api.editor]
   );
-  const handleSelectCatalogService = useCallback21(
+  const handleSelectCatalogService = useCallback22(
     (id) => {
       setSelectedAllServiceId(id);
       canvas.api.editor.setSelectedCatalogService?.(id ?? void 0);
     },
     [canvas.api.editor]
   );
-  const handleSelectCatalogGroup = useCallback21(
+  const handleSelectCatalogGroup = useCallback22(
     (groupId) => {
       canvas.api.editor.setActiveCatalogNode?.(groupId ?? void 0);
     },
     [canvas.api.editor]
   );
-  const handleCreateRootGroup = useCallback21(
+  const handleCreateRootGroup = useCallback22(
     (label) => {
       if (!label.trim()) return;
       canvas.api.editor.createCatalogGroup?.({ label: label.trim() });
     },
     [canvas.api.editor]
   );
-  const handleCreateChildGroup = useCallback21(
+  const handleCreateChildGroup = useCallback22(
     (label) => {
       if (!selectedCatalogGroupId) return;
       const editor = canvas.api.editor;
@@ -16687,7 +17945,7 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
     },
     [canvas.api.editor, selectedCatalogGroupId]
   );
-  const handleRenameGroup = useCallback21(
+  const handleRenameGroup = useCallback22(
     (label) => {
       if (!selectedCatalogGroupId) return;
       const group = catalogGroups.find((item) => item.id === selectedCatalogGroupId);
@@ -16697,15 +17955,15 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
     },
     [canvas.api.editor, catalogGroups, selectedCatalogGroupId]
   );
-  const handleDeleteGroup = useCallback21(() => {
+  const handleDeleteGroup = useCallback22(() => {
     if (!selectedCatalogGroupId) return;
     canvas.api.editor.removeCatalogNode?.(selectedCatalogGroupId, { cascade: true });
   }, [canvas.api.editor, selectedCatalogGroupId]);
-  const handleAssignServices = useCallback21(() => {
+  const handleAssignServices = useCallback22(() => {
     if (!selectedCatalogGroupId) return;
     setServicePickerOpen(true);
   }, [selectedCatalogGroupId]);
-  const handleConfirmAssignServices = useCallback21(
+  const handleConfirmAssignServices = useCallback22(
     (serviceIds) => {
       if (!selectedCatalogGroupId || !serviceIds.length) return;
       canvas.api.editor.assignServicesToCatalogGroup?.(selectedCatalogGroupId, serviceIds, "append");
@@ -16713,18 +17971,18 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
     [canvas.api.editor, selectedCatalogGroupId]
   );
   const tabs = [
-    { id: "console", label: "Console", icon: /* @__PURE__ */ jsx80(FiTerminal2, {}), count: consoleIssueCount },
-    { id: "activeServices", label: "Active Services", icon: /* @__PURE__ */ jsx80(MdOutlineSync, {}), count: activeServices.length },
-    { id: "allServices", label: "All Services", icon: /* @__PURE__ */ jsx80(LuLayers3, {}), count: allServices.length }
+    { id: "console", label: "Console", icon: /* @__PURE__ */ jsx88(FiTerminal2, {}), count: consoleIssueCount },
+    { id: "activeServices", label: "Active Services", icon: /* @__PURE__ */ jsx88(MdOutlineSync, {}), count: activeServices.length },
+    { id: "allServices", label: "All Services", icon: /* @__PURE__ */ jsx88(LuLayers3, {}), count: allServices.length }
   ];
   const selectedActiveRow = activeRows.find((row) => row.id === selectedActiveServiceId) ?? null;
   const selectedAllRow = visibleAllRows.find((row) => row.id === selectedAllServiceId) ?? null;
   const selectedCatalogGroup = catalogGroups.find((group) => group.id === selectedCatalogGroupId) ?? null;
-  const Search = useMemo36(() => {
+  const Search3 = useMemo40(() => {
     if (!["allServices", "activeServices"].includes(controller.activeTab)) return;
     const method = controller.activeTab == "allServices" ? setAllSearch : setActiveSearch;
     const value = controller.activeTab == "allServices" ? allSearch : activeSearch;
-    return /* @__PURE__ */ jsx80("div", { className: "absolute top-0 right-0 z-10", children: /* @__PURE__ */ jsx80(
+    return /* @__PURE__ */ jsx88("div", { className: "absolute top-0 right-0 z-10", children: /* @__PURE__ */ jsx88(
       "input",
       {
         ref: searchInputRef,
@@ -16746,8 +18004,8 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
       }
     ) });
   }, [controller.activeTab, activeSearch, allSearch, setActiveSearch, setAllSearch]);
-  return /* @__PURE__ */ jsxs58("div", { ref: panelContainerRef, className: "pointer-events-none absolute inset-0", children: [
-    /* @__PURE__ */ jsx80(
+  return /* @__PURE__ */ jsxs66("div", { ref: panelContainerRef, className: "pointer-events-none absolute inset-0", children: [
+    /* @__PURE__ */ jsx88(
       ServicePickerDialog,
       {
         open: servicePickerOpen,
@@ -16760,7 +18018,7 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
         onConfirm: handleConfirmAssignServices
       }
     ),
-    /* @__PURE__ */ jsxs58(
+    /* @__PURE__ */ jsxs66(
       Panel,
       {
         ref: panelRef,
@@ -16791,8 +18049,8 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
           ["--bottom-panel-height"]: controller.height + "px"
         },
         children: [
-          /* @__PURE__ */ jsxs58("div", { className: "flex items-center justify-between gap-3 border-b border-slate-200/80 px-3 py-2 dark:border-slate-800/80", children: [
-            /* @__PURE__ */ jsx80("div", { className: "flex min-w-0 items-center gap-1", children: tabs.map((tab) => /* @__PURE__ */ jsxs58(
+          /* @__PURE__ */ jsxs66("div", { className: "flex items-center justify-between gap-3 border-b border-slate-200/80 px-3 py-2 dark:border-slate-800/80", children: [
+            /* @__PURE__ */ jsx88("div", { className: "flex min-w-0 items-center gap-1", children: tabs.map((tab) => /* @__PURE__ */ jsxs66(
               "button",
               {
                 type: "button",
@@ -16802,9 +18060,9 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
                   controller.activeTab === tab.id ? "bg-slate-100 text-slate-900 dark:bg-slate-900 dark:text-slate-100" : "text-slate-500 hover:bg-slate-100 hover:text-slate-900 dark:text-slate-400 dark:hover:bg-slate-900 dark:hover:text-slate-100"
                 ),
                 children: [
-                  /* @__PURE__ */ jsx80("span", { className: "text-base", children: tab.icon }),
-                  /* @__PURE__ */ jsx80("span", { className: "truncate", children: tab.label }),
-                  typeof tab.count === "number" ? /* @__PURE__ */ jsx80(
+                  /* @__PURE__ */ jsx88("span", { className: "text-base", children: tab.icon }),
+                  /* @__PURE__ */ jsx88("span", { className: "truncate", children: tab.label }),
+                  typeof tab.count === "number" ? /* @__PURE__ */ jsx88(
                     "span",
                     {
                       className: cn(
@@ -16818,8 +18076,8 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
               },
               tab.id
             )) }),
-            /* @__PURE__ */ jsxs58("div", { className: "flex items-center gap-1", children: [
-              /* @__PURE__ */ jsxs58(
+            /* @__PURE__ */ jsxs66("div", { className: "flex items-center gap-1", children: [
+              /* @__PURE__ */ jsxs66(
                 "button",
                 {
                   type: "button",
@@ -16829,16 +18087,16 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
                     draggingPanel && "cursor-grabbing"
                   ),
                   children: [
-                    /* @__PURE__ */ jsx80(LuGripHorizontal, {}),
-                    /* @__PURE__ */ jsx80("span", { children: draggingPanel ? "Dragging panel..." : "Drag panel" })
+                    /* @__PURE__ */ jsx88(LuGripHorizontal, {}),
+                    /* @__PURE__ */ jsx88("span", { children: draggingPanel ? "Dragging panel..." : "Drag panel" })
                   ]
                 }
               ),
-              /* @__PURE__ */ jsxs58("div", { className: "hidden items-center gap-2 rounded-xl border border-slate-200/80 px-2 py-1 text-xs text-slate-500 md:flex dark:border-slate-800 dark:text-slate-400", children: [
-                /* @__PURE__ */ jsx80(LuGripHorizontal, {}),
-                /* @__PURE__ */ jsx80("span", { children: "Resize from top or side edges" })
+              /* @__PURE__ */ jsxs66("div", { className: "hidden items-center gap-2 rounded-xl border border-slate-200/80 px-2 py-1 text-xs text-slate-500 md:flex dark:border-slate-800 dark:text-slate-400", children: [
+                /* @__PURE__ */ jsx88(LuGripHorizontal, {}),
+                /* @__PURE__ */ jsx88("span", { children: "Resize from top or side edges" })
               ] }),
-              /* @__PURE__ */ jsx80(
+              /* @__PURE__ */ jsx88(
                 Button,
                 {
                   type: "button",
@@ -16846,30 +18104,30 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
                   size: "sm",
                   onClick: () => controller.close(),
                   className: "h-8 rounded-xl px-2 text-slate-500 hover:text-slate-900 dark:text-slate-400 dark:hover:text-slate-100",
-                  children: /* @__PURE__ */ jsx80(FiX6, {})
+                  children: /* @__PURE__ */ jsx88(FiX6, {})
                 }
               )
             ] })
           ] }),
-          /* @__PURE__ */ jsxs58("div", { className: "flex min-h-0 flex-1 flex-col bg-slate-50/70 dark:bg-slate-950/40", children: [
-            controller.activeTab !== "console" ? /* @__PURE__ */ jsxs58("div", { className: "flex items-center justify-between gap-3 border-b border-slate-200/70 px-4 py-3 dark:border-slate-800/70", children: [
-              /* @__PURE__ */ jsxs58("div", { className: "min-w-0", children: [
-                /* @__PURE__ */ jsx80("p", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: controller.activeTab === "activeServices" ? "Connected services" : "Service catalog" }),
-                /* @__PURE__ */ jsx80("p", { className: "mt-1 text-xs text-slate-500 dark:text-slate-400", children: controller.activeTab === "activeServices" ? "Bound services can be highlighted back onto the canvas from here." : catalogPanelMode === "catalog" ? "Browse source services through manual editor-side catalog groups while keeping detail and compatibility visible." : "Browse every source service, filter by current visible-group compatibility, and drag it onto nodes." })
+          /* @__PURE__ */ jsxs66("div", { className: "flex min-h-0 flex-1 flex-col bg-slate-50/70 dark:bg-slate-950/40", children: [
+            controller.activeTab !== "console" ? /* @__PURE__ */ jsxs66("div", { className: "flex items-center justify-between gap-3 border-b border-slate-200/70 px-4 py-3 dark:border-slate-800/70", children: [
+              /* @__PURE__ */ jsxs66("div", { className: "min-w-0", children: [
+                /* @__PURE__ */ jsx88("p", { className: "text-sm font-semibold text-slate-900 dark:text-slate-100", children: controller.activeTab === "activeServices" ? "Connected services" : "Service catalog" }),
+                /* @__PURE__ */ jsx88("p", { className: "mt-1 text-xs text-slate-500 dark:text-slate-400", children: controller.activeTab === "activeServices" ? "Bound services can be highlighted back onto the canvas from here." : catalogPanelMode === "catalog" ? "Browse source services through manual editor-side catalog groups while keeping detail and compatibility visible." : "Browse every source service, filter by current visible-group compatibility, and drag it onto nodes." })
               ] }),
-              /* @__PURE__ */ jsx80("div", { className: "flex items-center gap-3", children: /* @__PURE__ */ jsxs58("div", { className: "relative flex items-center gap-2", children: [
-                searchOpen ? Search : null,
-                /* @__PURE__ */ jsx80(
+              /* @__PURE__ */ jsx88("div", { className: "flex items-center gap-3", children: /* @__PURE__ */ jsxs66("div", { className: "relative flex items-center gap-2", children: [
+                searchOpen ? Search3 : null,
+                /* @__PURE__ */ jsx88(
                   HeaderIconButton,
                   {
                     label: "Search services",
                     active: searchOpen || Boolean(allSearch),
                     onClick: () => setSearchOpen(true),
-                    children: /* @__PURE__ */ jsx80(FiSearch, {})
+                    children: /* @__PURE__ */ jsx88(FiSearch, {})
                   }
                 ),
-                controller.activeTab === "allServices" ? /* @__PURE__ */ jsxs58(Fragment16, { children: [
-                  /* @__PURE__ */ jsx80(
+                controller.activeTab === "allServices" ? /* @__PURE__ */ jsxs66(Fragment17, { children: [
+                  /* @__PURE__ */ jsx88(
                     CatalogContextPopover,
                     {
                       open: filterOpen,
@@ -16883,20 +18141,20 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
                       onDraftContextChange: setCatalogContextDraft
                     }
                   ),
-                  /* @__PURE__ */ jsx80(CatalogModeSwitch, { mode: catalogPanelMode, onChange: setCatalogMode }),
-                  /* @__PURE__ */ jsx80(
+                  /* @__PURE__ */ jsx88(CatalogModeSwitch, { mode: catalogPanelMode, onChange: setCatalogMode }),
+                  /* @__PURE__ */ jsx88(
                     HeaderIconButton,
                     {
                       label: "Hide active services",
                       active: hideActiveServices,
                       onClick: () => setHideActiveServices((current) => !current),
-                      children: hideActiveServices ? /* @__PURE__ */ jsx80(FiEyeOff2, {}) : /* @__PURE__ */ jsx80(FiEye3, {})
+                      children: hideActiveServices ? /* @__PURE__ */ jsx88(FiEyeOff2, {}) : /* @__PURE__ */ jsx88(FiEye3, {})
                     }
                   )
                 ] }) : null
               ] }) })
             ] }) : null,
-            controller.activeTab === "console" ? /* @__PURE__ */ jsx80(ScrollArea, { className: "min-h-0 flex-1", children: /* @__PURE__ */ jsx80("div", { className: "p-4", children: /* @__PURE__ */ jsx80(
+            controller.activeTab === "console" ? /* @__PURE__ */ jsx88(ScrollArea, { className: "min-h-0 flex-1", children: /* @__PURE__ */ jsx88("div", { className: "p-4", children: /* @__PURE__ */ jsx88(
               ConsoleTab,
               {
                 errors,
@@ -16922,7 +18180,7 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
                 onNodeClick: (nodeId) => focusNode(canvas, nodeId)
               }
             ) }) }) : null,
-            controller.activeTab === "activeServices" ? /* @__PURE__ */ jsx80(
+            controller.activeTab === "activeServices" ? /* @__PURE__ */ jsx88(
               ServicesSplitPane,
               {
                 mode: "active",
@@ -16943,7 +18201,7 @@ function BottomConsolePanel({ controller, errors, activeServices, allServices, o
                 })
               }
             ) : null,
-            controller.activeTab === "allServices" ? /* @__PURE__ */ jsx80(
+            controller.activeTab === "allServices" ? /* @__PURE__ */ jsx88(
               ServicesSplitPane,
               {
                 mode: catalogPanelMode,
@@ -16996,8 +18254,8 @@ function HeaderIconButton({
   active = false,
   onClick
 }) {
-  return /* @__PURE__ */ jsxs58(Tooltip, { children: [
-    /* @__PURE__ */ jsx80(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx80(
+  return /* @__PURE__ */ jsxs66(Tooltip, { children: [
+    /* @__PURE__ */ jsx88(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx88(
       "button",
       {
         type: "button",
@@ -17010,12 +18268,12 @@ function HeaderIconButton({
         children
       }
     ) }),
-    /* @__PURE__ */ jsx80(TooltipContent, { side: "top", sideOffset: 8, children: label })
+    /* @__PURE__ */ jsx88(TooltipContent, { side: "top", sideOffset: 8, children: label })
   ] });
 }
 function CatalogModeSwitch({ mode, onChange }) {
-  return /* @__PURE__ */ jsxs58("div", { className: "inline-flex items-center rounded-xl border border-slate-200 bg-white p-1 dark:border-slate-800 dark:bg-slate-950", children: [
-    /* @__PURE__ */ jsx80(
+  return /* @__PURE__ */ jsxs66("div", { className: "inline-flex items-center rounded-xl border border-slate-200 bg-white p-1 dark:border-slate-800 dark:bg-slate-950", children: [
+    /* @__PURE__ */ jsx88(
       "button",
       {
         type: "button",
@@ -17027,7 +18285,7 @@ function CatalogModeSwitch({ mode, onChange }) {
         children: "All"
       }
     ),
-    /* @__PURE__ */ jsx80(
+    /* @__PURE__ */ jsx88(
       "button",
       {
         type: "button",
@@ -17050,7 +18308,7 @@ import {
   useWorkspace as useWorkspace17,
   Workspace
 } from "@timeax/digital-service-engine/workspace";
-import { useMemo as useMemo37, useState as useState37 } from "react";
+import { useMemo as useMemo41, useState as useState42 } from "react";
 
 // backend/memory/create-backend.ts
 import { createMemoryWorkspaceBackend } from "@timeax/digital-service-engine/workspace";
@@ -56453,7 +57711,7 @@ var workspaceBackend = {
 };
 
 // src/index.tsx
-import { Fragment as Fragment17, jsx as jsx81, jsxs as jsxs59 } from "react/jsx-runtime";
+import { Fragment as Fragment18, jsx as jsx89, jsxs as jsxs67 } from "react/jsx-runtime";
 var inputRegistry = createInputRegistry();
 registerEntries(inputRegistry);
 function WorkspaceLayout({ onShare, onPlay, menu }) {
@@ -56461,13 +57719,13 @@ function WorkspaceLayout({ onShare, onPlay, menu }) {
   const ws = useWorkspace17();
   const errors = useErrors();
   const bottomPanel = useBottomConsolePanel();
-  const [draggingServiceId, setDraggingServiceId] = useState37(null);
-  const serviceSummary = useMemo37(() => buildServiceSummaries(canvas, ws), [canvas.props, canvas.selectionInfo, canvas.activeId, ws.services.data]);
-  return /* @__PURE__ */ jsx81(FallbackQuickAddProvider, { children: /* @__PURE__ */ jsx81(NodeContextMenuProvider, { children: /* @__PURE__ */ jsx81(FallbackEditorModalProvider, { children: /* @__PURE__ */ jsxs59("div", { className: "relative flex h-screen flex-col overflow-hidden *:font-display", children: [
-    /* @__PURE__ */ jsx81("div", { className: "pointer-events-none absolute top-4 left-1/2 z-30 w-full max-w-2xl -translate-x-1/2 px-4", children: /* @__PURE__ */ jsx81("div", { className: "pointer-events-auto", children: /* @__PURE__ */ jsx81(WorkspaceBootStatusSurface, { boot: ws.boot }) }) }),
-    /* @__PURE__ */ jsxs59("div", { className: "flex grow overflow-hidden", children: [
-      /* @__PURE__ */ jsx81(left_default, { menu }),
-      /* @__PURE__ */ jsx81(
+  const [draggingServiceId, setDraggingServiceId] = useState42(null);
+  const serviceSummary = useMemo41(() => buildServiceSummaries(canvas, ws), [canvas.props, canvas.selectionInfo, canvas.activeId, ws.services.data]);
+  return /* @__PURE__ */ jsx89(FallbackQuickAddProvider, { children: /* @__PURE__ */ jsx89(NodeContextMenuProvider, { children: /* @__PURE__ */ jsx89(FallbackEditorModalProvider, { children: /* @__PURE__ */ jsxs67("div", { className: "relative flex h-screen flex-col overflow-hidden *:font-display", children: [
+    /* @__PURE__ */ jsx89("div", { className: "pointer-events-none absolute top-4 left-1/2 z-30 w-full max-w-2xl -translate-x-1/2 px-4", children: /* @__PURE__ */ jsx89("div", { className: "pointer-events-auto", children: /* @__PURE__ */ jsx89(WorkspaceBootStatusSurface, { boot: ws.boot }) }) }),
+    /* @__PURE__ */ jsxs67("div", { className: "flex grow overflow-hidden", children: [
+      /* @__PURE__ */ jsx89(left_default, { menu }),
+      /* @__PURE__ */ jsx89(
         CanvasPanel,
         {
           errors,
@@ -56476,9 +57734,9 @@ function WorkspaceLayout({ onShare, onPlay, menu }) {
           onServiceDragStateChange: (serviceId) => setDraggingServiceId(serviceId)
         }
       ),
-      /* @__PURE__ */ jsx81(right_default, { onShare, onPlay })
+      /* @__PURE__ */ jsx89(right_default, { onShare, onPlay })
     ] }),
-    /* @__PURE__ */ jsx81("div", { className: "pointer-events-none absolute inset-0 z-5", children: /* @__PURE__ */ jsx81(
+    /* @__PURE__ */ jsx89("div", { className: "pointer-events-none absolute inset-0 z-5", children: /* @__PURE__ */ jsx89(
       BottomConsolePanel,
       {
         controller: bottomPanel,
@@ -56566,13 +57824,13 @@ var Styles = `
 
 `;
 function ServiceBuilder({ backend, actor, ratePolicy, fallbackSettings, onShare, onPlay, menu }) {
-  return /* @__PURE__ */ jsxs59(Fragment17, { children: [
-    /* @__PURE__ */ jsx81("style", { children: Styles }),
-    /* @__PURE__ */ jsx81(InputsProvider, { initialRegistry: inputRegistry, children: /* @__PURE__ */ jsx81(Workspace, { backend, actor, ratePolicy, fallbackSettings, children: () => /* @__PURE__ */ jsx81(WorkspaceLayout, { onShare, onPlay, menu }) }) })
+  return /* @__PURE__ */ jsxs67(Fragment18, { children: [
+    /* @__PURE__ */ jsx89("style", { children: Styles }),
+    /* @__PURE__ */ jsx89(InputsProvider, { initialRegistry: inputRegistry, children: /* @__PURE__ */ jsx89(Workspace, { backend, actor, ratePolicy, fallbackSettings, children: () => /* @__PURE__ */ jsx89(WorkspaceLayout, { onShare, onPlay, menu }) }) })
   ] });
 }
 function ServiceBuilderWorkspace({ ratePolicy, fallbackSettings, onShare, onPlay, menu }) {
-  return /* @__PURE__ */ jsx81(
+  return /* @__PURE__ */ jsx89(
     ServiceBuilder,
     {
       backend: workspaceBackend,
@@ -56586,6 +57844,7 @@ function ServiceBuilderWorkspace({ ratePolicy, fallbackSettings, onShare, onPlay
   );
 }
 export {
+  NativeFallbackEditor,
   ServiceBuilder,
   ServiceBuilderWorkspace
 };