@adoptai/genui-components 0.1.58 → 0.1.59

package/dist/index.cjs

@@ -5255,7 +5255,32 @@ var workflowStepperSchema = zod.z.object({
       n: zod.z.number().int().positive().optional(),
       title: zod.z.string(),
       sub: zod.z.string().optional(),
-      status: zod.z.enum(["done", "active", "review", "pending", "blocked", "failed"]),
+      status: zod.z.enum([
+        "done",
+        "active",
+        "running",
+        "review",
+        "pending",
+        "blocked",
+        "failed"
+      ]),
+      // Optional quality-gate verdict for a step run by an executor (e.g. a
+      // pipeline). Surfaces a subtle trust badge; flags hint at issues a human
+      // should review (the full list lives in the escalation dock).
+      eval: zod.z.object({
+        score: zod.z.number().min(0).max(1).nullable().optional(),
+        verdict: zod.z.enum(["good", "bad"]).optional(),
+        reasoning: zod.z.string().optional(),
+        judge_ok: zod.z.boolean().optional(),
+        data_quality_flags: zod.z.array(
+          zod.z.object({
+            field: zod.z.string().optional(),
+            issue: zod.z.string().optional(),
+            severity: zod.z.enum(["low", "medium", "high"]).optional(),
+            details: zod.z.string().optional()
+          })
+        ).optional()
+      }).optional(),
       assignees: zod.z.array(
         zod.z.object({
           name: zod.z.string(),
@@ -5291,7 +5316,32 @@ var workflowStepperTool = {
             n: { type: "number", description: "Step number; defaults to index + 1" },
             title: { type: "string" },
             sub: { type: "string", description: "Short status caption, e.g. '7 accounts \xB7 2 exceptions'" },
-            status: { type: "string", enum: ["done", "active", "review", "pending", "blocked", "failed"] },
+            status: {
+              type: "string",
+              enum: ["done", "active", "running", "review", "pending", "blocked", "failed"]
+            },
+            eval: {
+              type: "object",
+              description: "Optional quality-gate verdict for an executor-run step.",
+              properties: {
+                score: { type: "number" },
+                verdict: { type: "string", enum: ["good", "bad"] },
+                reasoning: { type: "string" },
+                judge_ok: { type: "boolean" },
+                data_quality_flags: {
+                  type: "array",
+                  items: {
+                    type: "object",
+                    properties: {
+                      field: { type: "string" },
+                      issue: { type: "string" },
+                      severity: { type: "string", enum: ["low", "medium", "high"] },
+                      details: { type: "string" }
+                    }
+                  }
+                }
+              }
+            },
             assignees: {
               type: "array",
               maxItems: 6,
@@ -5595,6 +5645,36 @@ var decisionCardTool = {
     required: ["type", "title", "question", "options"]
   }
 };
+var tabbyAuthSchema = zod.z.object({
+  type: zod.z.literal("tabby-auth"),
+  app: zod.z.string(),
+  url: zod.z.string(),
+  workspace: zod.z.string().optional(),
+  state: zod.z.enum(["pending", "connected"]).optional(),
+  ctaLabel: zod.z.string().optional(),
+  steps: zod.z.array(zod.z.string()).optional(),
+  description: zod.z.string().optional(),
+  iconUrl: zod.z.string().optional()
+});
+var tabbyAuthTool = {
+  name: "render_tabby_auth",
+  description: "Render a dedicated, trustworthy sign-in card when a harness skill needs the member to authenticate with a third-party app (e.g. Sage Intacct, Airbnb, an ERP) before a `call_web_api` request can proceed. Use this for the `login_required` path instead of a raw markdown link or a connect-integration card. `app` is the human display name (drives the title context, subtitle, and CTA). `url` is the login/short-link the prominent CTA opens in a new tab. `workspace` adds a subtitle suffix ('{app} \xB7 {workspace} workspace'). `state='pending'` (default) is the first-time connect; `state='connected'` is the verify/re-auth case (session already live) with a green badge and an Open deep-link. `steps` overrides the default numbered instructions; `description` is a one-line intro. The card title ('Authentication required') and the 'Credentials not stored by Adopt' trust footer are hardcoded brand constants \u2014 never supplied here.",
+  input_schema: {
+    type: "object",
+    properties: {
+      type: { type: "string", enum: ["tabby-auth"] },
+      app: { type: "string" },
+      url: { type: "string" },
+      workspace: { type: "string" },
+      state: { type: "string", enum: ["pending", "connected"] },
+      ctaLabel: { type: "string" },
+      steps: { type: "array", items: { type: "string" } },
+      description: { type: "string" },
+      iconUrl: { type: "string" }
+    },
+    required: ["type", "app", "url"]
+  }
+};
 
 // src/schemas/buildRenderUITool.ts
 function buildRenderUITool(selectedSchemas) {
@@ -5715,7 +5795,8 @@ var schemaRegistry = {
   "pipeline-preview": { schema: pipelinePreviewSchema, tool: pipelinePreviewTool },
   "workflow-stepper": { schema: workflowStepperSchema, tool: workflowStepperTool },
   "document-field-extraction": { schema: documentFieldExtractionSchema, tool: documentFieldExtractionTool },
-  "decision-card": { schema: decisionCardSchema, tool: decisionCardTool }
+  "decision-card": { schema: decisionCardSchema, tool: decisionCardTool },
+  "tabby-auth": { schema: tabbyAuthSchema, tool: tabbyAuthTool }
 };
 
 // src/shared/ColumnSettingsPanel.tsx
@@ -6428,17 +6509,17 @@ function SparklineTableResolver(p) {
 // src/composites/heatmap-table/resolver.tsx
 init_theme();
 init_ThemeContext();
-function heatColor(z61) {
-  const clamped = Math.max(-3, Math.min(3, z61));
+function heatColor(z62) {
+  const clamped = Math.max(-3, Math.min(3, z62));
   const abs = Math.abs(clamped);
   const lightness = 95 - abs * 8;
   const hue = clamped >= 0 ? 142 : 0;
   return `hsl(${hue} 60% ${lightness}%)`;
 }
-function heatTextColor(z61) {
-  const abs = Math.abs(z61);
-  if (abs > 2) return z61 >= 0 ? "#14532d" : "#7f1d1d";
-  if (abs > 1) return z61 >= 0 ? "#166534" : "#991b1b";
+function heatTextColor(z62) {
+  const abs = Math.abs(z62);
+  if (abs > 2) return z62 >= 0 ? "#14532d" : "#7f1d1d";
+  if (abs > 1) return z62 >= 0 ? "#166534" : "#991b1b";
   return "var(--foreground)";
 }
 var th2 = {
@@ -17502,6 +17583,8 @@ var STATUS_COLORS3 = {
   done: "#15803d",
   active: "",
   // filled from theme ACCENT at render time
+  running: "",
+  // filled from theme ACCENT at render time (executor in flight)
   review: "#f59e0b",
   pending: "#9ca3af",
   blocked: "#b45309",
@@ -17510,6 +17593,7 @@ var STATUS_COLORS3 = {
 var STATUS_LABELS = {
   done: "Complete",
   active: "In progress",
+  running: "Running",
   review: "In review",
   pending: "Pending",
   blocked: "Blocked",
@@ -17613,6 +17697,26 @@ function IndexDot({ step, index, accent }) {
   if (step.status === "failed") {
     return /* @__PURE__ */ jsxRuntime.jsx("div", { style: __spreadProps(__spreadValues({}, base), { background: "#dc2626", color: "white" }), children: /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: 10 }, children: "!" }) });
   }
+  if (step.status === "running") {
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: __spreadProps(__spreadValues({}, base), { position: "relative", background: `${accent}1f`, color: accent }), children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          className: "wfs-anim",
+          "aria-hidden": "true",
+          style: {
+            position: "absolute",
+            inset: 0,
+            borderRadius: "50%",
+            border: `1.5px solid ${accent}33`,
+            borderTopColor: accent,
+            animation: "wfsSpin 0.8s linear infinite"
+          }
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: 9 }, children: n })
+    ] });
+  }
   if (step.status === "active") {
     return /* @__PURE__ */ jsxRuntime.jsx("div", { style: __spreadProps(__spreadValues({}, base), { background: accent, color: "white" }), children: n });
   }
@@ -17621,6 +17725,44 @@ function IndexDot({ step, index, accent }) {
   }
   return /* @__PURE__ */ jsxRuntime.jsx("div", { style: __spreadProps(__spreadValues({}, base), { background: "#f2f2f2", color: "#9ca3af" }), children: n });
 }
+function EvalBadge({ step }) {
+  var _a2;
+  const ev = step.eval;
+  if (!ev || ev.judge_ok === false) return null;
+  const score = typeof ev.score === "number" ? ev.score : null;
+  const flags = (_a2 = ev.data_quality_flags) != null ? _a2 : [];
+  const bad = ev.verdict === "bad" || score !== null && score < 0.8;
+  const tip = flags.length > 0 ? flags.map((f) => {
+    var _a3;
+    return `${(_a3 = f.severity) != null ? _a3 : "?"}: ${f.details || f.issue || f.field || "issue"}`;
+  }).join("\n") : ev.reasoning || void 0;
+  const label = score !== null ? score.toFixed(2) : bad ? "flagged" : "ok";
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "span",
+    {
+      title: tip,
+      "data-testid": `workflow-stepper-eval-${step.id}`,
+      style: {
+        display: "inline-flex",
+        alignItems: "center",
+        gap: 3,
+        fontSize: 9,
+        fontWeight: 700,
+        padding: "1px 6px",
+        borderRadius: 9999,
+        background: bad ? "#fff7ed" : "#dcfce7",
+        color: bad ? "#b45309" : "#15803d",
+        whiteSpace: "nowrap",
+        flexShrink: 0
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children: bad ? "\u26A0" : "\u2713" }),
+        label,
+        flags.length > 0 ? ` \xB7 ${flags.length}` : ""
+      ]
+    }
+  );
+}
 var CARD_MIN = 132;
 var CARD_GAP = 16;
 var AUTO_COMPACT_BELOW = 360;
@@ -17645,6 +17787,7 @@ var KEYFRAMES = `
 @keyframes wfsLampPulse{0%,100%{box-shadow:0 0 0 0 var(--wfs-accent,#6366f1)73}50%{box-shadow:0 0 0 4px transparent}}
 @keyframes wfsRise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
 @keyframes wfsShimmer{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}
+@keyframes wfsSpin{to{transform:rotate(360deg)}}
 .wfs-rise{animation:wfsRise 0.32s cubic-bezier(0.22,1,0.36,1) both}
 @media (prefers-reduced-motion: reduce){
   .wfs-anim,.wfs-rise,.wfs-shim{animation:none !important}
@@ -17725,7 +17868,7 @@ function WorkflowStepperRenderer({
   const steps = (_a2 = data.steps) != null ? _a2 : [];
   const activeStepId = (_d = (_c = data.active_step) != null ? _c : (_b = steps.find((s) => s.status === "active")) == null ? void 0 : _b.id) != null ? _d : null;
   const interactive = typeof onSelectStep === "function";
-  const statusColor3 = (s) => s === "active" ? ACCENT2 : STATUS_COLORS3[s];
+  const statusColor3 = (s) => s === "active" || s === "running" ? ACCENT2 : STATUS_COLORS3[s];
   const doneCount = steps.filter((s) => s.status === "done").length;
   const rootRef = React45__default.default.useRef(null);
   const containerW = useContainerWidth(rootRef);
@@ -17953,6 +18096,7 @@ function WorkflowStepperRenderer({
             var _a3;
             const isSelected = selectedStep === step.id;
             const isActive = step.status === "active";
+            const isRunning = step.status === "running";
             const reached = step.status !== "pending";
             const clickable = interactive && reached;
             const color = statusColor3(step.status);
@@ -18049,36 +18193,41 @@ function WorkflowStepperRenderer({
                         }
                       }
                     ),
-                    /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between" }, children: [
-                      /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", gap: 6 }, children: [
+                    /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", gap: 4 }, children: [
+                      /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", gap: 6, minWidth: 0 }, children: [
                         /* @__PURE__ */ jsxRuntime.jsx(IndexDot, { step, index: i, accent: ACCENT2 }),
                         /* @__PURE__ */ jsxRuntime.jsx(
                           "span",
                           {
-                            className: isActive ? "wfs-anim" : void 0,
+                            className: isActive || isRunning ? "wfs-anim" : void 0,
                             style: {
                               width: 6,
                               height: 6,
                               borderRadius: "50%",
                               background: color,
-                              animation: isActive ? "wfsLampPulse 1.8s ease-in-out infinite" : "none"
+                              flexShrink: 0,
+                              animation: isActive || isRunning ? "wfsLampPulse 1.8s ease-in-out infinite" : "none"
                             }
                           }
                         )
                       ] }),
-                      /* @__PURE__ */ jsxRuntime.jsx(
-                        "span",
-                        {
-                          style: {
-                            fontSize: 9,
-                            fontWeight: 600,
-                            letterSpacing: "0.05em",
-                            textTransform: "uppercase",
-                            color
-                          },
-                          children: STATUS_LABELS[step.status]
-                        }
-                      )
+                      /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", gap: 4, minWidth: 0 }, children: [
+                        /* @__PURE__ */ jsxRuntime.jsx(EvalBadge, { step }),
+                        /* @__PURE__ */ jsxRuntime.jsx(
+                          "span",
+                          {
+                            style: {
+                              fontSize: 9,
+                              fontWeight: 600,
+                              letterSpacing: "0.05em",
+                              textTransform: "uppercase",
+                              color,
+                              whiteSpace: "nowrap"
+                            },
+                            children: STATUS_LABELS[step.status]
+                          }
+                        )
+                      ] })
                     ] }),
                     /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { minWidth: 0 }, children: [
                       /* @__PURE__ */ jsxRuntime.jsx(
@@ -18268,12 +18417,14 @@ var BADGE_TITLE = {
 var BADGE_STYLE = {
   SC: { bg: "#dcfce7", fg: "#15803d" },
   CN: { bg: "#eff6ff", fg: "#0364ff" },
+  // theme-ok (SECONDARY)
   AB: { bg: "#fff7ed", fg: "#92400e" },
   SW: { bg: "#fef2f2", fg: "#dc2626" }
 };
 var STATE_DOT = {
   ok: "#15803d",
   corrected: "#0364ff",
+  // theme-ok (SECONDARY)
   missing: "#dc2626",
   warn: "#f59e0b"
 };
@@ -18636,6 +18787,7 @@ var BADGE_DOT = {
   missing: "#dc2626",
   red: "#dc2626",
   corrected: "#0364ff"
+  // theme-ok (SECONDARY)
 };
 function FieldDetails({
   summary,
@@ -20265,6 +20417,317 @@ function DecisionCardResolver(p) {
     }
   ) });
 }
+init_ThemeContext();
+var CONNECTED_GREEN3 = "#15803d";
+var CONNECTED_GREEN_BG = "#dcfce7";
+var PENDING_AMBER = "#92400e";
+var PENDING_AMBER_BG = "#fff7ed";
+var CARD_TITLE = "Authentication required";
+var TRUST_FOOTER = "Credentials not stored by Adopt";
+var DEFAULT_STEPS = (app, ctaLabel, connected) => connected ? [
+  `Click ${ctaLabel} below to open ${app} in a new tab.`,
+  "Confirm you are signed in \u2014 re-authenticate if prompted.",
+  "Return here \u2014 the request continues automatically."
+] : [
+  `Click ${ctaLabel} below to open the sign-in page.`,
+  `Sign in with your ${app} credentials \u2014 SSO is supported.`,
+  "Return here \u2014 the request resumes automatically."
+];
+function humanizeApp(raw) {
+  const v = raw.trim();
+  if (!v) return v;
+  const looksLikeSlug = /^[a-z0-9]+([_-][a-z0-9]+)*$/.test(v);
+  if (!looksLikeSlug) return v;
+  return v.split(/[_-]+/).map((w) => w.charAt(0).toUpperCase() + w.slice(1)).join(" ");
+}
+function ShieldIcon({ color }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      width: "13",
+      height: "13",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: color,
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      style: { flexShrink: 0 },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m9 12 2 2 4-4" })
+      ]
+    }
+  );
+}
+function ExternalIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      width: "13",
+      height: "13",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      style: { flexShrink: 0 },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M15 3h6v6" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M10 14 21 3" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" })
+      ]
+    }
+  );
+}
+function TabbyAuthResolver(p) {
+  var _a2, _b, _c;
+  const { BORDER: BORDER4, MUTED: MUTED2, ACCENT: ACCENT2, ACCENT_SOFT: ACCENT_SOFT2 } = useTheme();
+  const [cardHovered, setCardHovered] = React45.useState(false);
+  const [btnHovered, setBtnHovered] = React45.useState(false);
+  const [imgFailed, setImgFailed] = React45.useState(false);
+  const app = humanizeApp(p.app || "the app");
+  const connected = p.state === "connected";
+  const accent = connected ? CONNECTED_GREEN3 : ACCENT2;
+  const ctaLabel = (_a2 = p.ctaLabel) != null ? _a2 : connected ? `Open ${app}` : `Connect ${app}`;
+  const subtitle = p.workspace ? `${app} \xB7 ${p.workspace} workspace` : app;
+  const steps = ((_b = p.steps) == null ? void 0 : _b.length) ? p.steps : DEFAULT_STEPS(app, ctaLabel, connected);
+  const description = (_c = p.description) != null ? _c : connected ? `Your ${app} session is active. Open ${app} to continue, or re-authenticate if prompted.` : `Your ${app} account is not yet connected to this workspace. Complete sign-in once to enable automatic access.`;
+  const iconSrc = p.iconUrl || brandIconUrl(app);
+  const showImg = Boolean(iconSrc) && !imgFailed;
+  const initial = app.charAt(0).toUpperCase();
+  const badge = connected ? { label: "Connected", bg: CONNECTED_GREEN_BG, color: CONNECTED_GREEN3 } : { label: "Pending sign-in", bg: PENDING_AMBER_BG, color: PENDING_AMBER };
+  const sectionPad = "13px 16px";
+  return /* @__PURE__ */ jsxRuntime.jsx(ComponentActions, { filename: `${app} authentication`, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { width: "100%", display: "flex", flexDirection: "column", gap: "10px" }, children: /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      onMouseEnter: () => setCardHovered(true),
+      onMouseLeave: () => setCardHovered(false),
+      style: {
+        display: "flex",
+        flexDirection: "row",
+        alignItems: "stretch",
+        borderRadius: "0.75rem",
+        border: `1px solid ${cardHovered ? "#d2d2d2" : BORDER4}`,
+        background: "white",
+        overflow: "hidden",
+        boxShadow: cardHovered ? "0 1px 3px rgba(0,0,0,0.05), 0 6px 18px rgba(0,0,0,0.06)" : "0 1px 2px rgba(0,0,0,0.03)",
+        transition: "box-shadow 0.18s ease, border-color 0.18s ease"
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { style: { width: "3px", flexShrink: 0, background: accent } }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { flex: 1, minWidth: 0, display: "flex", flexDirection: "column" }, children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              style: {
+                display: "flex",
+                alignItems: "flex-start",
+                gap: "12px",
+                padding: sectionPad
+              },
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "div",
+                  {
+                    style: {
+                      position: "relative",
+                      width: "34px",
+                      height: "34px",
+                      borderRadius: "9px",
+                      flexShrink: 0,
+                      display: "flex",
+                      alignItems: "center",
+                      justifyContent: "center",
+                      background: showImg ? "white" : "#fff3ee",
+                      boxShadow: "inset 0 0 0 1px rgba(0,0,0,0.06)",
+                      overflow: "hidden"
+                    },
+                    children: showImg ? /* @__PURE__ */ jsxRuntime.jsx(
+                      "img",
+                      {
+                        src: iconSrc,
+                        alt: app,
+                        onError: () => setImgFailed(true),
+                        style: { width: "22px", height: "22px", objectFit: "contain" }
+                      }
+                    ) : /* @__PURE__ */ jsxRuntime.jsx(
+                      "span",
+                      {
+                        style: {
+                          fontFamily: "var(--font-serif)",
+                          fontSize: "17px",
+                          fontWeight: 400,
+                          color: ACCENT2,
+                          lineHeight: 1
+                        },
+                        children: initial
+                      }
+                    )
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { flex: 1, minWidth: 0, display: "flex", flexDirection: "column", gap: "2px" }, children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "span",
+                    {
+                      style: {
+                        fontFamily: "var(--font-serif)",
+                        fontSize: "15px",
+                        fontWeight: 400,
+                        color: "var(--foreground)",
+                        letterSpacing: "-0.01em",
+                        lineHeight: 1.2
+                      },
+                      children: CARD_TITLE
+                    }
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "span",
+                    {
+                      style: {
+                        fontSize: "12px",
+                        color: MUTED2,
+                        whiteSpace: "nowrap",
+                        overflow: "hidden",
+                        textOverflow: "ellipsis"
+                      },
+                      children: subtitle
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsxs(
+                  "span",
+                  {
+                    style: {
+                      display: "inline-flex",
+                      alignItems: "center",
+                      gap: "5px",
+                      flexShrink: 0,
+                      fontSize: "10.5px",
+                      fontWeight: 600,
+                      padding: "3px 9px",
+                      borderRadius: "9999px",
+                      background: badge.bg,
+                      color: badge.color,
+                      whiteSpace: "nowrap"
+                    },
+                    children: [
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        "span",
+                        {
+                          style: {
+                            width: "6px",
+                            height: "6px",
+                            borderRadius: "9999px",
+                            background: badge.color
+                          }
+                        }
+                      ),
+                      badge.label
+                    ]
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              style: {
+                borderTop: `1px solid ${BORDER4}`,
+                padding: sectionPad,
+                display: "flex",
+                flexDirection: "column",
+                gap: "12px"
+              },
+              children: [
+                description && /* @__PURE__ */ jsxRuntime.jsx("p", { style: { margin: 0, fontSize: "12.5px", lineHeight: 1.5, color: "var(--foreground)" }, children: description }),
+                /* @__PURE__ */ jsxRuntime.jsx("ol", { style: { margin: 0, padding: 0, listStyle: "none", display: "flex", flexDirection: "column", gap: "8px" }, children: steps.map((step, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { style: { display: "flex", alignItems: "flex-start", gap: "10px" }, children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "span",
+                    {
+                      style: {
+                        flexShrink: 0,
+                        width: "18px",
+                        height: "18px",
+                        borderRadius: "9999px",
+                        background: accent,
+                        color: "white",
+                        fontSize: "10.5px",
+                        fontWeight: 600,
+                        display: "flex",
+                        alignItems: "center",
+                        justifyContent: "center",
+                        marginTop: "1px"
+                      },
+                      children: i + 1
+                    }
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { style: { fontSize: "12.5px", lineHeight: 1.45, color: "var(--foreground)" }, children: step })
+                ] }, i)) })
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              style: {
+                borderTop: `1px solid ${BORDER4}`,
+                padding: sectionPad,
+                background: "#fbfbfb",
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "space-between",
+                gap: "12px",
+                flexWrap: "wrap"
+              },
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsxs("span", { style: { display: "inline-flex", alignItems: "center", gap: "6px", color: MUTED2, fontSize: "11.5px" }, children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(ShieldIcon, { color: CONNECTED_GREEN3 }),
+                  TRUST_FOOTER
+                ] }),
+                /* @__PURE__ */ jsxRuntime.jsxs(
+                  "a",
+                  {
+                    href: p.url,
+                    target: "_blank",
+                    rel: "noopener noreferrer",
+                    onMouseEnter: () => setBtnHovered(true),
+                    onMouseLeave: () => setBtnHovered(false),
+                    style: {
+                      display: "inline-flex",
+                      alignItems: "center",
+                      gap: "7px",
+                      flexShrink: 0,
+                      borderRadius: "8px",
+                      padding: "8px 15px",
+                      fontSize: "12.5px",
+                      fontWeight: 600,
+                      textDecoration: "none",
+                      whiteSpace: "nowrap",
+                      cursor: "pointer",
+                      color: "white",
+                      border: "1px solid transparent",
+                      background: btnHovered ? connected ? "#126a33" : ACCENT_SOFT2 : accent,
+                      transition: "background 0.15s ease"
+                    },
+                    children: [
+                      /* @__PURE__ */ jsxRuntime.jsx(ExternalIcon, {}),
+                      ctaLabel
+                    ]
+                  }
+                )
+              ]
+            }
+          )
+        ] })
+      ]
+    }
+  ) }) });
+}
 function resolveUI(rawPayload) {
   const payload = coercePayload(rawPayload);
   switch (payload.type) {
@@ -20386,6 +20849,8 @@ function resolveUI(rawPayload) {
       return /* @__PURE__ */ jsxRuntime.jsx(DocumentFieldExtractionResolver, __spreadValues({}, payload));
     case "decision-card":
       return /* @__PURE__ */ jsxRuntime.jsx(DecisionCardResolver, __spreadValues({}, payload));
+    case "tabby-auth":
+      return /* @__PURE__ */ jsxRuntime.jsx(TabbyAuthResolver, __spreadValues({}, payload));
     default: {
       return /* @__PURE__ */ jsxRuntime.jsx(
         "div",