@timeax/service-builder 0.1.2 → 0.1.4

package/dist/index.js

@@ -11895,9 +11895,14 @@ function AddServicePopover({
                     variant: "radio",
                     value: catalogMode,
                     options: [
-                      { key: "all", label: "All services" },
-                      { key: "catalog", label: "Catalog group" }
+                      { value: "all", label: "All services", description: "Show all services" },
+                      {
+                        value: "catalog",
+                        label: "Catalog group",
+                        description: "Show all services in the current catalog group"
+                      }
                     ],
+                    optGroupClassName: "gap-1",
                     onChange: (event) => setCatalogMode(event.value)
                   }
                 ),
@@ -11905,12 +11910,11 @@ function AddServicePopover({
                   InputField5,
                   {
                     variant: "treeselect",
-                    mode: "button",
-                    label: "Select group",
-                    className: "w-fit!",
+                    placeholder: "Select group",
                     disabled: catalogMode !== "catalog",
                     multiple: false,
                     value: treeValue,
+                    triggerClassName: "px-2",
                     options: [{ key: UNGROUPED_TREE_VALUE, label: "Ungrouped" }, ...treeOptions],
                     searchable: true,
                     clearable: true,
@@ -11920,7 +11924,7 @@ function AddServicePopover({
                         next === UNGROUPED_TREE_VALUE || next == null ? void 0 : next
                       );
                     },
-                    button: /* @__PURE__ */ jsx53(FaFolderOpen, {})
+                    trailingIcons: [/* @__PURE__ */ jsx53(FaFolderOpen, {})]
                   }
                 ),
                 catalogMode === "catalog" ? /* @__PURE__ */ jsxs35("div", { className: "text-xs text-slate-500 dark:text-slate-400", children: [
@@ -15728,14 +15732,7 @@ import { FiEdit2, FiFilter as FiFilter2, FiFolderPlus, FiPlus as FiPlus2, FiTras
 
 // src/workspace/bottom-panel/service-detail-card.tsx
 import { jsx as jsx78, jsxs as jsxs56 } from "react/jsx-runtime";
-function ServiceDetailCard({
-  mode,
-  row,
-  snapshot,
-  onNodeClick,
-  onOpenFallbackQuickAdd,
-  onOpenFallbackEditor
-}) {
+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: [
@@ -15744,13 +15741,12 @@ function ServiceDetailCard({
         /* @__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__ */ jsx78("h5", { className: "truncate text-lg font-semibold text-slate-900 dark:text-slate-100", children: summary.name })
-          ] }),
-          /* @__PURE__ */ jsxs56("div", { className: "mt-2 flex flex-wrap gap-2 text-xs text-slate-500 dark:text-slate-400", children: [
             /* @__PURE__ */ jsxs56("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
           ] })
@@ -15795,8 +15791,20 @@ function ServiceDetailCard({
       ),
       /* @__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(FilterChip, { label: row.check?.fitsConstraints ? "Constraints fit" : "Constraint mismatch", tone: row.check?.fitsConstraints ? "success" : "danger" }),
-          /* @__PURE__ */ jsx78(FilterChip, { label: row.check?.passesRate ? "Rate ok" : "Rate blocked", tone: row.check?.passesRate ? "success" : "warning" }),
+          /* @__PURE__ */ jsx78(
+            FilterChip,
+            {
+              label: row.check?.fitsConstraints ? "Constraints fit" : "Constraint mismatch",
+              tone: row.check?.fitsConstraints ? "success" : "danger"
+            }
+          ),
+          /* @__PURE__ */ jsx78(
+            FilterChip,
+            {
+              label: row.check?.passesRate ? "Rate ok" : "Rate blocked",
+              tone: row.check?.passesRate ? "success" : "warning"
+            }
+          ),
           /* @__PURE__ */ jsx78(
             FilterChip,
             {
@@ -15805,18 +15813,45 @@ function ServiceDetailCard({
             }
           )
         ] }),
-        row.reasonLabels.length ? /* @__PURE__ */ jsx78("div", { className: "mt-3 flex flex-wrap gap-2", children: row.reasonLabels.map((reason) => /* @__PURE__ */ jsx78("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." })
+        row.reasonLabels.length ? /* @__PURE__ */ jsx78("div", { className: "mt-3 flex flex-wrap gap-2", children: row.reasonLabels.map((reason) => /* @__PURE__ */ jsx78(
+          "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." })
       ] })
     ] }) : 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("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", children: flag }, flag)),
-        Object.keys(service?.meta ?? {}).slice(0, 3).map((key) => /* @__PURE__ */ jsx78("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", children: key }, key))
+        summary.flags.map((flag) => /* @__PURE__ */ jsx78(
+          "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",
+            children: flag
+          },
+          flag
+        )),
+        Object.keys(service?.meta ?? {}).slice(0, 3).map((key) => /* @__PURE__ */ jsx78(
+          "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",
+            children: key
+          },
+          key
+        ))
       ] }) : /* @__PURE__ */ jsx78("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(SectionTitle2, { title: "Bindings", description: "Nodes currently connected to this service. Click any node to jump back into the canvas." }),
+      /* @__PURE__ */ jsx78(
+        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(
         "button",
         {
@@ -15838,7 +15873,7 @@ function SectionTitle2({ title, 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 uppercase tracking-[0.16em] text-slate-400 dark:text-slate-500", children: label }),
+    /* @__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 })
   ] });
 }