@timeax/digital-service-engine 0.2.2 → 0.2.4

package/dist/react/index.js

@@ -12412,6 +12412,7 @@ function TabButton({
 
 // src/react/fallback-editor/VirtualServiceList.tsx
 import React7 from "react";
+import { Check } from "lucide-react";
 import { jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
 function VirtualServiceList({
   items,
@@ -12454,7 +12455,7 @@ function VirtualServiceList({
           {
             type: "button",
             onClick: () => onToggle(item.id),
-            className: "absolute left-0 right-0 flex items-center justify-between border-b border-zinc-100 bg-white px-3 text-left hover:bg-zinc-50 dark:border-zinc-800 dark:bg-zinc-900 dark:hover:bg-zinc-800",
+            className: "absolute left-0 right-0 flex items-center justify-between border-b border-zinc-100 bg-white px-3 text-left transition hover:bg-zinc-50 dark:border-zinc-800 dark:bg-zinc-900 dark:hover:bg-zinc-800",
             style: {
               top: index * rowHeight,
               height: rowHeight
@@ -12474,12 +12475,13 @@ function VirtualServiceList({
                 ] })
               ] }),
               /* @__PURE__ */ jsx7(
-                "input",
+                "span",
                 {
-                  type: "checkbox",
-                  checked,
-                  readOnly: true,
-                  className: "h-4 w-4 rounded border-zinc-300"
+                  className: [
+                    "inline-flex h-4 w-4 items-center justify-center rounded border transition",
+                    checked ? "border-blue-600 bg-blue-600 text-white dark:border-blue-500 dark:bg-blue-500" : "border-zinc-300 bg-white text-transparent dark:border-zinc-700 dark:bg-zinc-800"
+                  ].join(" "),
+                  children: /* @__PURE__ */ jsx7(Check, { className: "h-3 w-3" })
                 }
               )
             ]
@@ -12629,6 +12631,7 @@ function FallbackEditorHeader({
 
 // src/react/fallback-editor/FallbackSettingsPanel.tsx
 import React9 from "react";
+import { InputField as InputField21 } from "@timeax/form-palette";
 import { jsx as jsx10, jsxs as jsxs6 } from "react/jsx-runtime";
 function FallbackSettingsPanel() {
   var _a, _b, _c;
@@ -12664,7 +12667,7 @@ function FallbackSettingsPanel() {
     kind: "lte_primary",
     pct: 5
   };
-  return /* @__PURE__ */ jsxs6("section", { className: "rounded-2xl border border-zinc-200 bg-white p-4 shadow-sm dark:border-zinc-800 dark:bg-zinc-900 overflow-y-auto", children: [
+  return /* @__PURE__ */ jsxs6("section", { className: "overflow-y-auto rounded-2xl border border-zinc-200 bg-white p-4 shadow-sm dark:border-zinc-800 dark:bg-zinc-900", children: [
     /* @__PURE__ */ jsxs6("div", { className: "mb-4 flex items-start justify-between gap-3", children: [
       /* @__PURE__ */ jsxs6("div", { children: [
         /* @__PURE__ */ jsx10("h3", { className: "text-sm font-semibold text-zinc-900 dark:text-zinc-100", children: "Fallback settings" }),
@@ -12690,30 +12693,17 @@ function FallbackSettingsPanel() {
         {
           title: "Require constraint fit",
           hint: "Reject or warn when a candidate does not match effective tag constraints.",
-          children: /* @__PURE__ */ jsxs6(
-            "button",
+          children: /* @__PURE__ */ jsx10(
+            InputField21,
             {
-              type: "button",
-              onClick: () => setDraft((prev) => ({
+              variant: "toggle",
+              value: Boolean(draft.requireConstraintFit),
+              onChange: ({ value }) => setDraft((prev) => ({
                 ...prev,
-                requireConstraintFit: !(prev == null ? void 0 : prev.requireConstraintFit)
+                requireConstraintFit: Boolean(value)
               })),
-              className: [
-                "inline-flex items-center gap-2 rounded-full border px-3 py-2 text-sm",
-                draft.requireConstraintFit ? "border-green-300 bg-green-50 text-green-700 dark:border-green-900/50 dark:bg-green-950/30 dark:text-green-300" : "border-zinc-300 bg-white text-zinc-600 dark:border-zinc-700 dark:bg-zinc-900 dark:text-zinc-300"
-              ].join(" "),
-              children: [
-                /* @__PURE__ */ jsx10("span", { children: draft.requireConstraintFit ? "Enabled" : "Disabled" }),
-                /* @__PURE__ */ jsx10(
-                  "span",
-                  {
-                    className: [
-                      "h-2.5 w-2.5 rounded-full",
-                      draft.requireConstraintFit ? "bg-green-500" : "bg-zinc-400"
-                    ].join(" ")
-                  }
-                )
-              ]
+              onText: "Enabled",
+              offText: "Disabled"
             }
           )
         }
@@ -12724,12 +12714,13 @@ function FallbackSettingsPanel() {
           title: "Rate policy",
           hint: "Controls how fallback service rates are compared against the primary service.",
           children: /* @__PURE__ */ jsxs6("div", { className: "flex flex-col gap-2 md:items-end", children: [
-            /* @__PURE__ */ jsxs6(
-              "select",
+            /* @__PURE__ */ jsx10(
+              InputField21,
               {
+                variant: "select",
                 value: ratePolicy.kind,
-                onChange: (e) => {
-                  const kind = e.target.value;
+                onChange: ({ value }) => {
+                  const kind = value;
                   if (kind === "eq_primary") {
                     setRatePolicy({ kind: "eq_primary" });
                     return;
@@ -12754,30 +12745,39 @@ function FallbackSettingsPanel() {
                     pct: currentPct
                   });
                 },
-                className: "w-56 rounded-xl border border-zinc-300 bg-white px-3 py-2 text-sm dark:border-zinc-700 dark:bg-zinc-900 dark:text-zinc-100",
-                children: [
-                  /* @__PURE__ */ jsx10("option", { value: "eq_primary", children: "eq_primary" }),
-                  /* @__PURE__ */ jsx10("option", { value: "lte_primary", children: "lte_primary" }),
-                  /* @__PURE__ */ jsx10("option", { value: "within_pct", children: "within_pct" }),
-                  /* @__PURE__ */ jsx10("option", { value: "at_least_pct_lower", children: "at_least_pct_lower" })
-                ]
+                options: [
+                  { value: "eq_primary", label: "eq_primary" },
+                  {
+                    value: "lte_primary",
+                    label: "lte_primary"
+                  },
+                  { value: "within_pct", label: "within_pct" },
+                  {
+                    value: "at_least_pct_lower",
+                    label: "at_least_pct_lower"
+                  }
+                ],
+                clearable: false
               }
             ),
             ratePolicy.kind !== "eq_primary" && /* @__PURE__ */ jsxs6("div", { className: "flex items-center gap-2", children: [
-              /* @__PURE__ */ jsx10(
-                "input",
+              /* @__PURE__ */ jsx10("div", { className: "w-32", children: /* @__PURE__ */ jsx10(
+                InputField21,
                 {
-                  type: "number",
-                  min: 0,
-                  step: "0.01",
+                  variant: "number",
                   value: ratePolicy.pct,
-                  onChange: (e) => {
-                    const pct = Number(e.target.value || 0);
-                    setRatePolicy({ ...ratePolicy, pct });
+                  onChange: ({ value }) => {
+                    const pct = typeof value === "number" ? value : Number(value != null ? value : 0);
+                    setRatePolicy({
+                      ...ratePolicy,
+                      pct
+                    });
                   },
-                  className: "w-32 rounded-xl border border-zinc-300 bg-white px-3 py-2 text-sm dark:border-zinc-700 dark:bg-zinc-900 dark:text-zinc-100"
+                  min: 0,
+                  step: 0.01,
+                  fullWidth: true
                 }
-              ),
+              ) }),
               /* @__PURE__ */ jsx10("span", { className: "text-sm text-zinc-500 dark:text-zinc-400", children: "%" })
             ] })
           ] })
@@ -12788,19 +12788,20 @@ function FallbackSettingsPanel() {
         {
           title: "Selection strategy",
           hint: "How valid fallback candidates are ordered in previews.",
-          children: /* @__PURE__ */ jsxs6(
-            "select",
+          children: /* @__PURE__ */ jsx10(
+            InputField21,
             {
+              variant: "select",
               value: (_b = draft.selectionStrategy) != null ? _b : "priority",
-              onChange: (e) => setDraft((prev) => ({
+              onChange: ({ value }) => setDraft((prev) => ({
                 ...prev,
-                selectionStrategy: e.target.value
+                selectionStrategy: value
               })),
-              className: "w-48 rounded-xl border border-zinc-300 bg-white px-3 py-2 text-sm dark:border-zinc-700 dark:bg-zinc-900 dark:text-zinc-100",
-              children: [
-                /* @__PURE__ */ jsx10("option", { value: "priority", children: "priority" }),
-                /* @__PURE__ */ jsx10("option", { value: "cheapest", children: "cheapest" })
-              ]
+              options: [
+                { value: "priority", label: "priority" },
+                { value: "cheapest", label: "cheapest" }
+              ],
+              clearable: false
             }
           )
         }
@@ -12810,19 +12811,20 @@ function FallbackSettingsPanel() {
         {
           title: "Mode",
           hint: "Use strict for enforced filtering, dev for advisory feedback.",
-          children: /* @__PURE__ */ jsxs6(
-            "select",
+          children: /* @__PURE__ */ jsx10(
+            InputField21,
             {
+              variant: "select",
               value: (_c = draft.mode) != null ? _c : "strict",
-              onChange: (e) => setDraft((prev) => ({
+              onChange: ({ value }) => setDraft((prev) => ({
                 ...prev,
-                mode: e.target.value
+                mode: value
               })),
-              className: "w-48 rounded-xl border border-zinc-300 bg-white px-3 py-2 text-sm dark:border-zinc-700 dark:bg-zinc-900 dark:text-zinc-100",
-              children: [
-                /* @__PURE__ */ jsx10("option", { value: "strict", children: "strict" }),
-                /* @__PURE__ */ jsx10("option", { value: "dev", children: "dev" })
-              ]
+              options: [
+                { value: "strict", label: "strict" },
+                { value: "dev", label: "dev" }
+              ],
+              clearable: false
             }
           )
         }
@@ -12848,6 +12850,8 @@ function SettingRow({
 
 // src/react/fallback-editor/FallbackServiceSidebar.tsx
 import { useMemo as useMemo7, useState as useState4 } from "react";
+import { InputField as InputField22 } from "@timeax/form-palette";
+import { Search } from "lucide-react";
 import { jsx as jsx11, jsxs as jsxs7 } from "react/jsx-runtime";
 function FallbackServiceSidebar() {
   const { activeServiceId, setActiveServiceId, get } = useFallbackEditor();
@@ -12869,15 +12873,19 @@ function FallbackServiceSidebar() {
       /* @__PURE__ */ jsx11("p", { className: "mt-1 text-xs text-zinc-500 dark:text-zinc-400", children: "Services currently active in the builder/runtime context." })
     ] }),
     /* @__PURE__ */ jsxs7("div", { className: "flex min-h-0 flex-1 flex-col p-4", children: [
-      /* @__PURE__ */ jsx11(
-        "input",
+      /* @__PURE__ */ jsx11("div", { className: "rounded-xl border border-zinc-200 bg-zinc-50/80 p-2 dark:border-zinc-800 dark:bg-zinc-950/80", children: /* @__PURE__ */ jsx11(
+        InputField22,
         {
+          variant: "text",
           value: query,
-          onChange: (e) => setQuery(e.target.value),
+          onChange: ({ value }) => setQuery(String(value != null ? value : "")),
           placeholder: "Search primary service...",
-          className: "rounded-xl border border-zinc-300 bg-white px-3 py-2 text-sm outline-none focus:border-blue-500 dark:border-zinc-700 dark:bg-zinc-950 dark:text-zinc-100"
+          leadingControl: /* @__PURE__ */ jsx11(Search, { className: "h-4 w-4 text-zinc-400" }),
+          joinControls: true,
+          extendBoxToControls: true,
+          fullWidth: true
         }
-      ),
+      ) }),
       /* @__PURE__ */ jsx11("div", { className: "mt-3 flex-1 space-y-2 overflow-y-auto", children: filtered.map((service) => {
         var _a, _b;
         const active = String(service.id) === String(activeServiceId);
@@ -12889,7 +12897,7 @@ function FallbackServiceSidebar() {
             onClick: () => setActiveServiceId(service.id),
             className: [
               "w-full rounded-2xl border p-3 text-left transition",
-              active ? "border-blue-500 bg-blue-50 dark:bg-blue-950/30" : "border-zinc-200 bg-zinc-50 hover:border-zinc-300 dark:border-zinc-800 dark:bg-zinc-950 dark:hover:border-zinc-700"
+              active ? "border-blue-500 bg-blue-50 dark:border-blue-500/70 dark:bg-blue-950/30" : "border-zinc-200 bg-zinc-50 hover:border-zinc-300 dark:border-zinc-800 dark:bg-zinc-950 dark:hover:border-zinc-700 dark:hover:bg-zinc-900"
             ].join(" "),
             children: /* @__PURE__ */ jsxs7("div", { className: "flex items-start justify-between gap-3", children: [
               /* @__PURE__ */ jsxs7("div", { className: "min-w-0", children: [
@@ -13084,6 +13092,8 @@ function FallbackRegistrationsPanel() {
 
 // src/react/fallback-editor/FallbackAddCandidatesDialog.tsx
 import React12 from "react";
+import { InputField as InputField23 } from "@timeax/form-palette";
+import { Search as Search2 } from "lucide-react";
 import { jsx as jsx13, jsxs as jsxs9 } from "react/jsx-runtime";
 function FallbackAddCandidatesDialog({
   open,
@@ -13144,33 +13154,36 @@ function FallbackAddCandidatesDialog({
     }
   }
   if (!open || !context) return null;
-  return /* @__PURE__ */ jsx13("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4", children: /* @__PURE__ */ jsxs9("div", { className: "flex max-h-[85vh] w-full max-w-3xl flex-col rounded-2xl border border-zinc-200 bg-white shadow-2xl dark:border-zinc-800 dark:bg-zinc-900", children: [
+  return /* @__PURE__ */ jsx13("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/60 p-4", children: /* @__PURE__ */ jsxs9("div", { className: "flex max-h-[85vh] w-full max-w-3xl flex-col rounded-2xl border border-zinc-200 bg-white shadow-2xl dark:border-zinc-800 dark:bg-zinc-900", children: [
     /* @__PURE__ */ jsxs9("div", { className: "border-b border-zinc-200 p-4 dark:border-zinc-800", children: [
       /* @__PURE__ */ jsx13("h3", { className: "text-base font-semibold text-zinc-900 dark:text-zinc-100", children: "Add fallback services" }),
       /* @__PURE__ */ jsx13("p", { className: "mt-1 text-sm text-zinc-500 dark:text-zinc-400", children: "Search and select one or more eligible fallback candidates." })
     ] }),
     /* @__PURE__ */ jsxs9("div", { className: "flex flex-col gap-3 p-4", children: [
       /* @__PURE__ */ jsx13(
-        "input",
+        InputField23,
         {
+          variant: "text",
           value: query,
-          onChange: (e) => setQuery(e.target.value),
+          onChange: ({ value }) => setQuery(String(value != null ? value : "")),
           placeholder: "Search eligible services...",
-          className: "rounded-xl border border-zinc-300 bg-white px-3 py-2 text-sm outline-none focus:border-blue-500 dark:border-zinc-700 dark:bg-zinc-950 dark:text-zinc-100"
+          leadingControl: /* @__PURE__ */ jsx13(Search2, { className: "h-4 w-4 text-zinc-400" }),
+          joinControls: true,
+          extendBoxToControls: true,
+          fullWidth: true
+        }
+      ),
+      /* @__PURE__ */ jsx13(
+        InputField23,
+        {
+          variant: "toggle",
+          value: filterEligibleOnly,
+          onChange: ({ value }) => setFilterEligibleOnly(Boolean(value)),
+          label: "Filter eligible only",
+          onText: "On",
+          offText: "Off"
         }
       ),
-      /* @__PURE__ */ jsxs9("label", { className: "inline-flex items-center gap-2 text-sm text-zinc-700 dark:text-zinc-300", children: [
-        /* @__PURE__ */ jsx13(
-          "input",
-          {
-            type: "checkbox",
-            checked: filterEligibleOnly,
-            onChange: (e) => setFilterEligibleOnly(e.target.checked),
-            className: "h-4 w-4 rounded border-zinc-300"
-          }
-        ),
-        "Filter eligible only"
-      ] }),
       /* @__PURE__ */ jsx13(
         VirtualServiceList,
         {
@@ -13192,7 +13205,7 @@ function FallbackAddCandidatesDialog({
           {
             type: "button",
             onClick: onClose,
-            className: "rounded-xl border border-zinc-300 bg-white px-3 py-2 text-sm font-medium text-zinc-700 hover:bg-zinc-50 dark:border-zinc-700 dark:bg-zinc-950 dark:text-zinc-200 dark:hover:bg-zinc-800",
+            className: "rounded-xl border border-zinc-300 bg-white px-3 py-2 text-sm font-medium text-zinc-700 transition hover:bg-zinc-50 dark:border-zinc-700 dark:bg-zinc-950 dark:text-zinc-200 dark:hover:bg-zinc-800",
             children: "Cancel"
           }
         ),
@@ -13202,7 +13215,7 @@ function FallbackAddCandidatesDialog({
             type: "button",
             onClick: handleAdd,
             disabled: selected.size === 0 || submitting,
-            className: "rounded-xl bg-blue-600 px-3 py-2 text-sm font-medium text-white hover:bg-blue-700 disabled:cursor-not-allowed disabled:opacity-60",
+            className: "rounded-xl bg-blue-600 px-3 py-2 text-sm font-medium text-white transition hover:bg-blue-700 disabled:cursor-not-allowed disabled:opacity-60",
             children: submitting ? "Adding..." : "Add selected"
           }
         )
@@ -13213,6 +13226,7 @@ function FallbackAddCandidatesDialog({
 
 // src/react/fallback-editor/FallbackAddRegistrationDialog.tsx
 import React13 from "react";
+import { InputField as InputField24 } from "@timeax/form-palette";
 import { jsx as jsx14, jsxs as jsxs10 } from "react/jsx-runtime";
 function FallbackAddRegistrationDialog({
   open,
@@ -13363,7 +13377,7 @@ function FallbackAddRegistrationDialog({
   }
   if (!open) return null;
   const nodeScopeDisabled = nodeTargets.length === 0;
-  return /* @__PURE__ */ jsx14("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4", children: /* @__PURE__ */ jsxs10("div", { className: "w-full max-w-lg rounded-2xl border border-zinc-200 bg-white shadow-2xl dark:border-zinc-800 dark:bg-zinc-900", children: [
+  return /* @__PURE__ */ jsx14("div", { className: "fixed inset-0 z-50 flex items-center justify-center bg-black/60 p-4", children: /* @__PURE__ */ jsxs10("div", { className: "w-full max-w-lg rounded-2xl border border-zinc-200 bg-white shadow-2xl dark:border-zinc-800 dark:bg-zinc-900", children: [
     /* @__PURE__ */ jsxs10("div", { className: "border-b border-zinc-200 p-4 dark:border-zinc-800", children: [
       /* @__PURE__ */ jsx14("h3", { className: "text-base font-semibold text-zinc-900 dark:text-zinc-100", children: "Add registration" }),
       /* @__PURE__ */ jsx14("p", { className: "mt-1 text-sm text-zinc-500 dark:text-zinc-400", children: "Choose the registration scope before selecting fallback candidates." })
@@ -13371,70 +13385,44 @@ function FallbackAddRegistrationDialog({
     /* @__PURE__ */ jsxs10("div", { className: "space-y-4 p-4", children: [
       /* @__PURE__ */ jsxs10("div", { className: "space-y-2", children: [
         /* @__PURE__ */ jsx14("div", { className: "text-sm font-medium text-zinc-900 dark:text-zinc-100", children: "Scope" }),
-        /* @__PURE__ */ jsxs10("div", { className: "grid gap-2", children: [
-          !hasGlobal && /* @__PURE__ */ jsxs10("label", { className: "flex cursor-pointer items-start gap-3 rounded-xl border border-zinc-200 p-3 dark:border-zinc-800", children: [
-            /* @__PURE__ */ jsx14(
-              "input",
+        /* @__PURE__ */ jsx14(
+          InputField24,
+          {
+            variant: "radio",
+            value: scope,
+            onChange: ({ value }) => setScope(value),
+            options: [
+              ...!hasGlobal ? [
+                {
+                  value: "global",
+                  label: "Global"
+                }
+              ] : [],
               {
-                type: "radio",
-                name: "scope",
-                checked: scope === "global",
-                onChange: () => setScope("global"),
-                className: "mt-1 h-4 w-4"
+                value: "node",
+                label: nodeScopeDisabled ? "Node (Unavailable)" : "Node"
               }
-            ),
-            /* @__PURE__ */ jsxs10("div", { children: [
-              /* @__PURE__ */ jsx14("div", { className: "text-sm font-medium text-zinc-900 dark:text-zinc-100", children: "Global" }),
-              /* @__PURE__ */ jsx14("div", { className: "mt-1 text-xs text-zinc-500 dark:text-zinc-400", children: "Use one global registration for this primary service." })
-            ] })
-          ] }),
-          /* @__PURE__ */ jsxs10(
-            "label",
-            {
-              className: [
-                "flex items-start gap-3 rounded-xl border p-3",
-                nodeScopeDisabled ? "cursor-not-allowed border-zinc-200 opacity-60 dark:border-zinc-800" : "cursor-pointer border-zinc-200 dark:border-zinc-800"
-              ].join(" "),
-              children: [
-                /* @__PURE__ */ jsx14(
-                  "input",
-                  {
-                    type: "radio",
-                    name: "scope",
-                    checked: scope === "node",
-                    onChange: () => setScope("node"),
-                    disabled: nodeScopeDisabled,
-                    className: "mt-1 h-4 w-4"
-                  }
-                ),
-                /* @__PURE__ */ jsxs10("div", { children: [
-                  /* @__PURE__ */ jsx14("div", { className: "text-sm font-medium text-zinc-900 dark:text-zinc-100", children: "Node" }),
-                  /* @__PURE__ */ jsx14("div", { className: "mt-1 text-xs text-zinc-500 dark:text-zinc-400", children: 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." })
-                ] })
-              ]
-            }
-          )
-        ] })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx14("div", { className: "text-xs text-zinc-500 dark:text-zinc-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__ */ jsxs10("div", { className: "space-y-2", children: [
         /* @__PURE__ */ jsx14("div", { className: "text-sm font-medium text-zinc-900 dark:text-zinc-100", children: "Node id" }),
-        /* @__PURE__ */ jsxs10(
-          "select",
+        /* @__PURE__ */ jsx14(
+          InputField24,
           {
-            value: nodeId,
-            onChange: (e) => setNodeId(e.target.value),
-            className: "w-full rounded-xl border border-zinc-300 bg-white px-3 py-2 text-sm outline-none focus:border-blue-500 dark:border-zinc-700 dark:bg-zinc-950 dark:text-zinc-100",
-            children: [
-              /* @__PURE__ */ jsx14("option", { value: "", children: "Select node\u2026" }),
-              nodeTargets.map((node) => /* @__PURE__ */ jsxs10("option", { value: node.id, children: [
-                "[",
-                node.kind,
-                "] ",
-                node.label,
-                " \xB7 #",
-                String(node.serviceId)
-              ] }, node.id))
-            ]
+            variant: "select",
+            value: nodeId || void 0,
+            onChange: ({ value }) => setNodeId(String(value != null ? value : "")),
+            options: nodeTargets.map((node) => ({
+              value: node.id,
+              label: `[${node.kind}] ${node.label} \xB7 #${String(node.serviceId)}`
+            })),
+            placeholder: "Select node...",
+            searchable: true,
+            clearable: false,
+            fullWidth: true
           }
         ),
         nodeScopeDisabled ? /* @__PURE__ */ jsx14("div", { className: "text-xs text-zinc-500 dark:text-zinc-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
@@ -13446,7 +13434,7 @@ function FallbackAddRegistrationDialog({
         {
           type: "button",
           onClick: onClose,
-          className: "rounded-xl border border-zinc-300 bg-white px-3 py-2 text-sm font-medium text-zinc-700 hover:bg-zinc-50 dark:border-zinc-700 dark:bg-zinc-950 dark:text-zinc-200 dark:hover:bg-zinc-800",
+          className: "rounded-xl border border-zinc-300 bg-white px-3 py-2 text-sm font-medium text-zinc-700 transition hover:bg-zinc-50 dark:border-zinc-700 dark:bg-zinc-950 dark:text-zinc-200 dark:hover:bg-zinc-800",
           children: "Cancel"
         }
       ),
@@ -13456,7 +13444,7 @@ function FallbackAddRegistrationDialog({
           type: "button",
           onClick: handleContinue,
           disabled: activeServiceId === void 0 || scope === "node" && !nodeId,
-          className: "rounded-xl bg-blue-600 px-3 py-2 text-sm font-medium text-white hover:bg-blue-700 disabled:cursor-not-allowed disabled:opacity-60",
+          className: "rounded-xl bg-blue-600 px-3 py-2 text-sm font-medium text-white transition hover:bg-blue-700 disabled:cursor-not-allowed disabled:opacity-60",
           children: "Continue"
         }
       )