@ship-it-ui/shipit 0.0.3 → 0.0.5

package/dist/index.js

@@ -1,15 +1,15 @@
 'use client';
 
 // src/index.ts
-import { cn as cn21 } from "@ship-it-ui/ui";
+import { cn as cn23 } from "@ship-it-ui/ui";
 
 // src/ai/AskBar.tsx
 import { Button, useControllableState } from "@ship-it-ui/ui";
+import { cn } from "@ship-it-ui/ui";
 import {
   forwardRef,
   useRef
 } from "react";
-import { cn } from "@ship-it-ui/ui";
 import { jsx, jsxs } from "react/jsx-runtime";
 var AskBar = forwardRef(function AskBar2({
   value: valueProp,
@@ -21,10 +21,12 @@ var AskBar = forwardRef(function AskBar2({
   submitLabel = "Ask",
   disabled,
   maxWidth = 620,
+  density = "comfortable",
   className,
   children,
   ...props
 }, ref) {
+  const isTouch = density === "touch";
   const [value, setValue] = useControllableState({
     value: valueProp,
     defaultValue: defaultValue ?? "",
@@ -52,16 +54,17 @@ var AskBar = forwardRef(function AskBar2({
       ref,
       role: "search",
       onSubmit: handleSubmit,
-      style: { maxWidth },
+      style: { maxWidth: isTouch ? void 0 : maxWidth },
       className: cn(
-        "border-border-strong bg-panel w-full rounded-xl border p-[14px] shadow",
+        "border-border-strong bg-panel w-full border",
+        isTouch ? "rounded-m-card p-3" : "rounded-xl p-[14px] shadow",
         "focus-within:border-accent focus-within:ring-accent-dim focus-within:ring-[3px]",
         className
       ),
       ...props,
       children: [
-        /* @__PURE__ */ jsxs("div", { className: "mb-[10px] flex items-start gap-[10px]", children: [
-          /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "text-accent text-[16px]", children: "\u2726" }),
+        /* @__PURE__ */ jsxs("div", { className: cn("flex items-start gap-[10px]", isTouch ? "mb-2" : "mb-[10px]"), children: [
+          /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: cn("text-accent", isTouch ? "text-[18px]" : "text-[16px]"), children: "\u2726" }),
           /* @__PURE__ */ jsx(
             "textarea",
             {
@@ -73,8 +76,9 @@ var AskBar = forwardRef(function AskBar2({
               "aria-label": placeholder,
               rows: 1,
               className: cn(
-                "text-text flex-1 resize-none border-0 bg-transparent text-[14px] leading-[1.5] outline-none",
-                "placeholder:text-text-dim"
+                "text-text flex-1 resize-none border-0 bg-transparent leading-[1.5] outline-none",
+                "placeholder:text-text-dim",
+                isTouch ? "text-m-body" : "text-[14px]"
               )
             }
           ),
@@ -82,19 +86,23 @@ var AskBar = forwardRef(function AskBar2({
             "span",
             {
               "aria-hidden": true,
-              className: "bg-accent mt-[3px] inline-block h-4 w-px animate-[ship-pulse_1s_infinite]"
+              className: cn(
+                "bg-accent mt-[3px] inline-block w-px animate-[ship-pulse_1s_infinite]",
+                isTouch ? "h-5" : "h-4"
+              )
             }
           )
         ] }),
         /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-[6px]", children: [
           children,
           /* @__PURE__ */ jsxs("div", { className: "ml-auto flex items-center gap-2", children: [
-            /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "text-text-dim font-mono text-[11px]", children: "\u2318\u21B5" }),
+            !isTouch && /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "text-text-dim font-mono text-[11px]", children: "\u2318\u21B5" }),
             /* @__PURE__ */ jsx(
               Button,
               {
                 type: "submit",
-                size: "sm",
+                size: isTouch ? "md" : "sm",
+                density: isTouch ? "touch" : void 0,
                 variant: "primary",
                 disabled: disabled || !(value ?? "").trim(),
                 children: submitLabel
@@ -109,8 +117,8 @@ var AskBar = forwardRef(function AskBar2({
 AskBar.displayName = "AskBar";
 
 // src/ai/Citation.tsx
-import { forwardRef as forwardRef2 } from "react";
 import { cn as cn2 } from "@ship-it-ui/ui";
+import { forwardRef as forwardRef2 } from "react";
 import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 var SUPERSCRIPTS = ["\u2070", "\xB9", "\xB2", "\xB3", "\u2074", "\u2075", "\u2076", "\u2077", "\u2078", "\u2079"];
 function toSuperscript(n) {
@@ -151,8 +159,8 @@ var Citation = forwardRef2(function Citation2({ index, source, meta, inline, cla
 Citation.displayName = "Citation";
 
 // src/ai/ConfidenceIndicator.tsx
-import { forwardRef as forwardRef3 } from "react";
 import { cn as cn3 } from "@ship-it-ui/ui";
+import { forwardRef as forwardRef3 } from "react";
 import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 var tierLabel = {
   high: "High",
@@ -220,12 +228,53 @@ ConfidenceIndicator.displayName = "ConfidenceIndicator";
 
 // src/ai/CopilotMessage.tsx
 import { Avatar } from "@ship-it-ui/ui";
-import { forwardRef as forwardRef4 } from "react";
 import { cn as cn4 } from "@ship-it-ui/ui";
+import { forwardRef as forwardRef4 } from "react";
 import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
 var CopilotMessage = forwardRef4(
-  function CopilotMessage2({ role, avatar, streaming, className, children, ...props }, ref) {
+  function CopilotMessage2({ role, avatar, streaming, density = "comfortable", className, children, ...props }, ref) {
     const isAssistant = role === "assistant";
+    const isTouch = density === "touch";
+    if (isTouch) {
+      return /* @__PURE__ */ jsxs4(
+        "div",
+        {
+          ref,
+          className: cn4(
+            "flex flex-col gap-[6px]",
+            isAssistant ? "items-start" : "items-end",
+            className
+          ),
+          "data-role": role,
+          ...props,
+          children: [
+            isAssistant && /* @__PURE__ */ jsxs4("div", { className: "text-m-eyebrow text-accent inline-flex items-center gap-[6px] font-mono tracking-wide uppercase", children: [
+              /* @__PURE__ */ jsx4("span", { "aria-hidden": true, children: "\u2726" }),
+              streaming ? "thinking" : "ShipIt"
+            ] }),
+            /* @__PURE__ */ jsxs4(
+              "div",
+              {
+                className: cn4(
+                  "rounded-m-card text-m-body max-w-[85%] px-[14px] py-3 leading-normal",
+                  isAssistant ? "bg-panel border-border border" : "bg-accent text-on-accent"
+                ),
+                children: [
+                  children,
+                  streaming && /* @__PURE__ */ jsx4(
+                    "span",
+                    {
+                      "aria-hidden": true,
+                      className: "bg-accent ml-[2px] inline-block h-4 w-px animate-[ship-pulse_1s_infinite] align-middle"
+                    }
+                  )
+                ]
+              }
+            )
+          ]
+        }
+      );
+    }
     return /* @__PURE__ */ jsxs4(
       "div",
       {
@@ -270,8 +319,8 @@ CopilotMessage.displayName = "CopilotMessage";
 
 // src/ai/ReasoningBlock.tsx
 import { useControllableState as useControllableState2 } from "@ship-it-ui/ui";
-import { Children, forwardRef as forwardRef5 } from "react";
 import { cn as cn5 } from "@ship-it-ui/ui";
+import { Children, forwardRef as forwardRef5 } from "react";
 import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 var ReasoningBlock = forwardRef5(
   function ReasoningBlock2({
@@ -332,8 +381,8 @@ var ReasoningStep = forwardRef5(function ReasoningStep2({ step, className, child
 ReasoningStep.displayName = "ReasoningStep";
 
 // src/ai/SuggestionChip.tsx
-import { forwardRef as forwardRef6 } from "react";
 import { cn as cn6 } from "@ship-it-ui/ui";
+import { forwardRef as forwardRef6 } from "react";
 import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
 var SuggestionChip = forwardRef6(
   function SuggestionChip2({ glyph = "\u2726", className, children, type, ...props }, ref) {
@@ -362,8 +411,8 @@ SuggestionChip.displayName = "SuggestionChip";
 
 // src/ai/ToolCallCard.tsx
 import { Badge } from "@ship-it-ui/ui";
-import { forwardRef as forwardRef7 } from "react";
 import { cn as cn7 } from "@ship-it-ui/ui";
+import { forwardRef as forwardRef7 } from "react";
 import { Fragment as Fragment2, jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
 var ToolCallCard = forwardRef7(function ToolCallCard2({ name, status, running, className, children, ...props }, ref) {
   return /* @__PURE__ */ jsxs7(
@@ -396,64 +445,140 @@ ToolCallCard.displayName = "ToolCallCard";
 
 // src/entity/EntityBadge.tsx
 import { Badge as Badge2 } from "@ship-it-ui/ui";
-import { forwardRef as forwardRef8 } from "react";
 import { cn as cn8 } from "@ship-it-ui/ui";
+import { forwardRef as forwardRef8 } from "react";
 
 // src/entity/types.ts
+var BUILTIN_META = {
+  service: {
+    glyph: "\u25C7",
+    label: "Service",
+    toneClass: "text-accent",
+    toneBg: "bg-accent-dim",
+    colorVar: "var(--color-accent)",
+    badgeVariant: "accent"
+  },
+  person: {
+    glyph: "\u25CB",
+    label: "Person",
+    toneClass: "text-text-muted",
+    toneBg: "bg-panel-2",
+    colorVar: "var(--color-purple)",
+    badgeVariant: "neutral"
+  },
+  document: {
+    glyph: "\u25A4",
+    label: "Document",
+    toneClass: "text-purple",
+    toneBg: "bg-[color-mix(in_oklab,var(--color-purple),transparent_85%)]",
+    colorVar: "var(--color-pink)",
+    badgeVariant: "purple"
+  },
+  deployment: {
+    glyph: "\u2191",
+    label: "Deployment",
+    toneClass: "text-ok",
+    toneBg: "bg-[color-mix(in_oklab,var(--color-ok),transparent_85%)]",
+    colorVar: "var(--color-ok)",
+    badgeVariant: "ok"
+  },
+  incident: {
+    glyph: "\u25CE",
+    label: "Incident",
+    toneClass: "text-err",
+    toneBg: "bg-[color-mix(in_oklab,var(--color-err),transparent_85%)]",
+    colorVar: "var(--color-warn)",
+    badgeVariant: "err"
+  },
+  ticket: {
+    glyph: "\u25A2",
+    label: "Ticket",
+    toneClass: "text-warn",
+    toneBg: "bg-[color-mix(in_oklab,var(--color-warn),transparent_85%)]",
+    colorVar: "var(--color-text-muted)",
+    badgeVariant: "warn"
+  }
+};
+var FALLBACK = BUILTIN_META.service;
+var registry = new Map(Object.entries(BUILTIN_META));
+function registerEntityType(type, meta) {
+  registry.set(type, meta);
+  return meta;
+}
+function registerEntityTypes(map) {
+  for (const [key, meta] of Object.entries(map)) {
+    registry.set(key, meta);
+  }
+}
+function getEntityTypeMeta(type) {
+  return registry.get(type) ?? FALLBACK;
+}
+function listEntityTypes() {
+  return Array.from(registry.entries());
+}
+function resetEntityTypeRegistry() {
+  registry.clear();
+  for (const key of Object.keys(BUILTIN_META)) {
+    registry.set(key, BUILTIN_META[key]);
+  }
+}
 var ENTITY_GLYPH = {
-  service: "\u25C7",
-  person: "\u25CB",
-  document: "\u25A4",
-  deployment: "\u2191",
-  incident: "\u25CE",
-  ticket: "\u25A2"
+  service: BUILTIN_META.service.glyph,
+  person: BUILTIN_META.person.glyph,
+  document: BUILTIN_META.document.glyph,
+  deployment: BUILTIN_META.deployment.glyph,
+  incident: BUILTIN_META.incident.glyph,
+  ticket: BUILTIN_META.ticket.glyph
 };
 var ENTITY_LABEL = {
-  service: "Service",
-  person: "Person",
-  document: "Document",
-  deployment: "Deployment",
-  incident: "Incident",
-  ticket: "Ticket"
+  service: BUILTIN_META.service.label,
+  person: BUILTIN_META.person.label,
+  document: BUILTIN_META.document.label,
+  deployment: BUILTIN_META.deployment.label,
+  incident: BUILTIN_META.incident.label,
+  ticket: BUILTIN_META.ticket.label
 };
 var ENTITY_TONE_CLASS = {
-  service: "text-accent",
-  person: "text-text-muted",
-  document: "text-purple",
-  deployment: "text-ok",
-  incident: "text-err",
-  ticket: "text-warn"
+  service: BUILTIN_META.service.toneClass,
+  person: BUILTIN_META.person.toneClass,
+  document: BUILTIN_META.document.toneClass,
+  deployment: BUILTIN_META.deployment.toneClass,
+  incident: BUILTIN_META.incident.toneClass,
+  ticket: BUILTIN_META.ticket.toneClass
 };
 var ENTITY_TONE_BG = {
-  service: "bg-accent-dim",
-  person: "bg-panel-2",
-  document: "bg-[color-mix(in_oklab,var(--color-purple),transparent_85%)]",
-  deployment: "bg-[color-mix(in_oklab,var(--color-ok),transparent_85%)]",
-  incident: "bg-[color-mix(in_oklab,var(--color-err),transparent_85%)]",
-  ticket: "bg-[color-mix(in_oklab,var(--color-warn),transparent_85%)]"
+  service: BUILTIN_META.service.toneBg,
+  person: BUILTIN_META.person.toneBg,
+  document: BUILTIN_META.document.toneBg,
+  deployment: BUILTIN_META.deployment.toneBg,
+  incident: BUILTIN_META.incident.toneBg,
+  ticket: BUILTIN_META.ticket.toneBg
 };
 
 // src/entity/EntityBadge.tsx
 import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
-var typeVariant = {
-  service: "accent",
-  person: "neutral",
-  document: "purple",
-  deployment: "ok",
-  incident: "err",
-  ticket: "warn"
-};
 var EntityBadge = forwardRef8(function EntityBadge2({ type, label, hideGlyph, className, children, ...props }, ref) {
-  return /* @__PURE__ */ jsxs8(Badge2, { ref, variant: typeVariant[type], className: cn8(className), ...props, children: [
-    !hideGlyph && /* @__PURE__ */ jsx8("span", { "aria-hidden": true, className: "font-mono", children: ENTITY_GLYPH[type] }),
-    children ?? label ?? ENTITY_LABEL[type]
-  ] });
+  const meta = getEntityTypeMeta(type);
+  return /* @__PURE__ */ jsxs8(
+    Badge2,
+    {
+      ref,
+      variant: meta.badgeVariant,
+      "data-entity-type": type,
+      className: cn8(className),
+      ...props,
+      children: [
+        !hideGlyph && /* @__PURE__ */ jsx8("span", { "aria-hidden": true, className: "font-mono", children: meta.glyph }),
+        children ?? label ?? meta.label
+      ]
+    }
+  );
 });
 EntityBadge.displayName = "EntityBadge";
 
 // src/entity/EntityCard.tsx
-import { forwardRef as forwardRef9 } from "react";
 import { cn as cn9 } from "@ship-it-ui/ui";
+import { forwardRef as forwardRef9 } from "react";
 import { jsx as jsx9, jsxs as jsxs9 } from "react/jsx-runtime";
 var statToneClass = {
   accent: "text-accent",
@@ -463,10 +588,12 @@ var statToneClass = {
   muted: "text-text-muted"
 };
 var EntityCard = forwardRef9(function EntityCard2({ type, title, subtitle, description, stats, actions, glyph, className, ...props }, ref) {
+  const meta = getEntityTypeMeta(type);
   return /* @__PURE__ */ jsxs9(
     "div",
     {
       ref,
+      "data-entity-type": type,
       className: cn9(
         "rounded-base border-border bg-panel flex flex-col gap-3 border p-5",
         className
@@ -480,10 +607,10 @@ var EntityCard = forwardRef9(function EntityCard2({ type, title, subtitle, descr
               "aria-hidden": true,
               className: cn9(
                 "rounded-base grid h-12 w-12 shrink-0 place-items-center text-[20px]",
-                ENTITY_TONE_BG[type],
-                ENTITY_TONE_CLASS[type]
+                meta.toneBg,
+                meta.toneClass
               ),
-              children: glyph ?? ENTITY_GLYPH[type]
+              children: glyph ?? meta.glyph
             }
           ),
           /* @__PURE__ */ jsxs9("div", { className: "min-w-0 flex-1", children: [
@@ -523,10 +650,10 @@ var EntityCard = forwardRef9(function EntityCard2({ type, title, subtitle, descr
 EntityCard.displayName = "EntityCard";
 
 // src/entity/EntityListRow.tsx
+import { cn as cn10 } from "@ship-it-ui/ui";
 import {
   forwardRef as forwardRef10
 } from "react";
-import { cn as cn10 } from "@ship-it-ui/ui";
 import { Fragment as Fragment3, jsx as jsx10, jsxs as jsxs10 } from "react/jsx-runtime";
 var baseClassNames = (interactive, className) => cn10(
   "flex w-full items-center gap-3 border-0 bg-transparent px-2 py-2 text-left",
@@ -541,15 +668,9 @@ function RowInner({
   meta,
   hideGlyph
 }) {
+  const typeMeta = getEntityTypeMeta(type);
   return /* @__PURE__ */ jsxs10(Fragment3, { children: [
-    !hideGlyph && /* @__PURE__ */ jsx10(
-      "span",
-      {
-        "aria-hidden": true,
-        className: cn10("font-mono text-[14px] leading-none", ENTITY_TONE_CLASS[type]),
-        children: ENTITY_GLYPH[type]
-      }
-    ),
+    !hideGlyph && /* @__PURE__ */ jsx10("span", { "aria-hidden": true, className: cn10("font-mono text-[14px] leading-none", typeMeta.toneClass), children: typeMeta.glyph }),
     /* @__PURE__ */ jsx10("span", { className: "text-text min-w-0 flex-1 truncate font-mono text-[12px]", children: name }),
     relation && /* @__PURE__ */ jsx10("span", { className: "border-border bg-panel-2 text-text-muted rounded-full border px-2 py-[2px] font-mono text-[10px]", children: relation }),
     meta && /* @__PURE__ */ jsx10("span", { className: "text-text-dim font-mono text-[10px]", children: meta })
@@ -557,7 +678,16 @@ function RowInner({
 }
 var EntityListRowDiv = forwardRef10(
   function EntityListRowDiv2({ type, name, relation, meta, hideGlyph, className, ...props }, ref) {
-    return /* @__PURE__ */ jsx10("div", { ref, className: baseClassNames(false, className), ...props, children: /* @__PURE__ */ jsx10(RowInner, { type, name, relation, meta, hideGlyph }) });
+    return /* @__PURE__ */ jsx10(
+      "div",
+      {
+        ref,
+        "data-entity-type": type,
+        className: baseClassNames(false, className),
+        ...props,
+        children: /* @__PURE__ */ jsx10(RowInner, { type, name, relation, meta, hideGlyph })
+      }
+    );
   }
 );
 EntityListRowDiv.displayName = "EntityListRowDiv";
@@ -568,6 +698,7 @@ var EntityListRowButton = forwardRef10(
       {
         ref,
         type: "button",
+        "data-entity-type": type,
         onClick,
         className: baseClassNames(true, className),
         ...props,
@@ -653,8 +784,8 @@ var GraphEdge = forwardRef11(function GraphEdge2({ x1, y1, x2, y2, curve, edgeSt
 GraphEdge.displayName = "GraphEdge";
 
 // src/graph/GraphInspector.tsx
-import { forwardRef as forwardRef12 } from "react";
 import { cn as cn11 } from "@ship-it-ui/ui";
+import { forwardRef as forwardRef12 } from "react";
 import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
 var GraphInspector = forwardRef12(
   function GraphInspector2({
@@ -720,21 +851,13 @@ var GraphInspector = forwardRef12(
 GraphInspector.displayName = "GraphInspector";
 
 // src/graph/GraphLegend.tsx
-import { forwardRef as forwardRef13 } from "react";
 import { cn as cn12 } from "@ship-it-ui/ui";
+import { forwardRef as forwardRef13 } from "react";
 import { jsx as jsx13, jsxs as jsxs12 } from "react/jsx-runtime";
-var typeColorVar = {
-  service: "var(--color-accent)",
-  person: "var(--color-purple)",
-  document: "var(--color-pink)",
-  deployment: "var(--color-ok)",
-  incident: "var(--color-warn)",
-  ticket: "var(--color-text-muted)"
-};
 var DEFAULT_ENTRIES = [
-  { type: "service", label: ENTITY_LABEL.service },
-  { type: "person", label: ENTITY_LABEL.person },
-  { type: "document", label: ENTITY_LABEL.document }
+  { type: "service" },
+  { type: "person" },
+  { type: "document" }
 ];
 var GraphLegend = forwardRef13(function GraphLegend2({ entries = DEFAULT_ENTRIES, heading = "Legend", className, children, ...props }, ref) {
   return /* @__PURE__ */ jsxs12(
@@ -749,10 +872,12 @@ var GraphLegend = forwardRef13(function GraphLegend2({ entries = DEFAULT_ENTRIES
       children: [
         heading && /* @__PURE__ */ jsx13("div", { className: "text-text-dim font-mono text-[9px] tracking-[1.4px] uppercase", children: heading }),
         children ?? entries.map((entry, i) => {
-          const color = entry.color ?? (entry.type ? typeColorVar[entry.type] : "currentColor");
+          const meta = entry.type ? getEntityTypeMeta(entry.type) : void 0;
+          const color = entry.color ?? meta?.colorVar ?? "currentColor";
+          const label = entry.label ?? meta?.label ?? "";
           return /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-[6px]", children: [
             /* @__PURE__ */ jsx13("span", { "aria-hidden": true, className: "h-2 w-2 rounded-full", style: { background: color } }),
-            /* @__PURE__ */ jsx13("span", { children: entry.label })
+            /* @__PURE__ */ jsx13("span", { children: label })
           ] }, i);
         })
       ]
@@ -762,8 +887,8 @@ var GraphLegend = forwardRef13(function GraphLegend2({ entries = DEFAULT_ENTRIES
 GraphLegend.displayName = "GraphLegend";
 
 // src/graph/GraphMinimap.tsx
-import { forwardRef as forwardRef14 } from "react";
 import { cn as cn13 } from "@ship-it-ui/ui";
+import { forwardRef as forwardRef14 } from "react";
 import { jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
 var GraphMinimap = forwardRef14(function GraphMinimap2({ points, viewport, width = 120, height = 72, className, ...props }, ref) {
   return /* @__PURE__ */ jsx14(
@@ -814,19 +939,12 @@ var GraphMinimap = forwardRef14(function GraphMinimap2({ points, viewport, width
 GraphMinimap.displayName = "GraphMinimap";
 
 // src/graph/GraphNode.tsx
-import { forwardRef as forwardRef15 } from "react";
 import { cn as cn14 } from "@ship-it-ui/ui";
+import { forwardRef as forwardRef15 } from "react";
 import { jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
-var typeColorVar2 = {
-  service: "var(--color-accent)",
-  person: "var(--color-purple)",
-  document: "var(--color-pink)",
-  deployment: "var(--color-ok)",
-  incident: "var(--color-warn)",
-  ticket: "var(--color-text-muted)"
-};
 var GraphNode = forwardRef15(function GraphNode2({ type, state = "default", glyph, label, size = 52, pathColor, className, style, ...props }, ref) {
-  const color = state === "path" ? pathColor ?? "var(--color-purple)" : typeColorVar2[type];
+  const meta = getEntityTypeMeta(type);
+  const color = state === "path" ? pathColor ?? "var(--color-purple)" : meta.colorVar;
   const glowPct = state === "hover" ? 50 : 25;
   const opacity = state === "dim" ? 0.35 : 1;
   const showRing = state === "selected" || state === "path";
@@ -857,7 +975,7 @@ var GraphNode = forwardRef15(function GraphNode2({ type, state = "default", glyp
               outlineOffset: showRing ? 4 : void 0,
               opacity
             },
-            children: glyph ?? ENTITY_GLYPH[type]
+            children: glyph ?? meta.glyph
           }
         ),
         label && /* @__PURE__ */ jsx15("span", { className: "text-text-dim font-mono text-[10px]", children: label })
@@ -902,8 +1020,8 @@ var PathOverlay = forwardRef16(function PathOverlay2({ points, color = "var(--co
 PathOverlay.displayName = "PathOverlay";
 
 // src/marketing/CTAStrip.tsx
-import { forwardRef as forwardRef17 } from "react";
 import { cn as cn15 } from "@ship-it-ui/ui";
+import { forwardRef as forwardRef17 } from "react";
 import { jsx as jsx17, jsxs as jsxs16 } from "react/jsx-runtime";
 var CTAStrip = forwardRef17(function CTAStrip2({ title, description, actions, className, ...props }, ref) {
   return /* @__PURE__ */ jsxs16(
@@ -927,8 +1045,8 @@ var CTAStrip = forwardRef17(function CTAStrip2({ title, description, actions, cl
 CTAStrip.displayName = "CTAStrip";
 
 // src/marketing/FeatureGrid.tsx
-import { forwardRef as forwardRef18 } from "react";
 import { cn as cn16 } from "@ship-it-ui/ui";
+import { forwardRef as forwardRef18 } from "react";
 import { jsx as jsx18, jsxs as jsxs17 } from "react/jsx-runtime";
 var colsClass = {
   2: "md:grid-cols-2",
@@ -953,8 +1071,8 @@ var FeatureGrid = forwardRef18(function FeatureGrid2({ features, columns = 3, cl
 FeatureGrid.displayName = "FeatureGrid";
 
 // src/marketing/Footer.tsx
-import { forwardRef as forwardRef19 } from "react";
 import { cn as cn17 } from "@ship-it-ui/ui";
+import { forwardRef as forwardRef19 } from "react";
 import { jsx as jsx19, jsxs as jsxs18 } from "react/jsx-runtime";
 var Footer = forwardRef19(function Footer2({ brand, columns, copyright, closing, className, ...props }, ref) {
   return /* @__PURE__ */ jsxs18("footer", { ref, className: cn17("px-7 py-7", className), ...props, children: [
@@ -982,8 +1100,8 @@ var Footer = forwardRef19(function Footer2({ brand, columns, copyright, closing,
 Footer.displayName = "Footer";
 
 // src/marketing/Hero.tsx
-import { forwardRef as forwardRef20 } from "react";
 import { cn as cn18 } from "@ship-it-ui/ui";
+import { forwardRef as forwardRef20 } from "react";
 import { jsx as jsx20, jsxs as jsxs19 } from "react/jsx-runtime";
 var Hero = forwardRef20(function Hero2({ eyebrow, title, description, actions, visual, className, ...props }, ref) {
   const hasVisual = visual != null;
@@ -1021,8 +1139,8 @@ var Hero = forwardRef20(function Hero2({ eyebrow, title, description, actions, v
 Hero.displayName = "Hero";
 
 // src/marketing/PricingCard.tsx
-import { forwardRef as forwardRef21 } from "react";
 import { cn as cn19 } from "@ship-it-ui/ui";
+import { forwardRef as forwardRef21 } from "react";
 import { jsx as jsx21, jsxs as jsxs20 } from "react/jsx-runtime";
 var PricingCard = forwardRef21(function PricingCard2({ tier, price, priceUnit, description, features, action, featured, className, ...props }, ref) {
   return /* @__PURE__ */ jsxs20(
@@ -1060,8 +1178,8 @@ PricingCard.displayName = "PricingCard";
 
 // src/marketing/Testimonial.tsx
 import { Avatar as Avatar2 } from "@ship-it-ui/ui";
-import { forwardRef as forwardRef22 } from "react";
 import { cn as cn20 } from "@ship-it-ui/ui";
+import { forwardRef as forwardRef22 } from "react";
 import { jsx as jsx22, jsxs as jsxs21 } from "react/jsx-runtime";
 var Testimonial = forwardRef22(function Testimonial2({ quote, author, role, avatar, className, ...props }, ref) {
   return /* @__PURE__ */ jsxs21(
@@ -1086,23 +1204,121 @@ var Testimonial = forwardRef22(function Testimonial2({ quote, author, role, avat
 });
 Testimonial.displayName = "Testimonial";
 
+// src/data/ConnectorCard.tsx
+import { IconGlyph } from "@ship-it-ui/icons";
+import { cn as cn21, formatRelative, StatusDot } from "@ship-it-ui/ui";
+import { forwardRef as forwardRef23 } from "react";
+import { Fragment as Fragment4, jsx as jsx23, jsxs as jsxs22 } from "react/jsx-runtime";
+var statusDot = {
+  connected: "ok",
+  syncing: "sync",
+  error: "err",
+  disconnected: "off"
+};
+var statusLabel = {
+  connected: "Connected",
+  syncing: "Syncing",
+  error: "Error",
+  disconnected: "Disconnected"
+};
+var ConnectorCard = forwardRef23(function ConnectorCard2({
+  connector,
+  name,
+  status,
+  lastSyncedAt,
+  relativeNow,
+  summary,
+  actions,
+  onClick,
+  accessibleName,
+  className,
+  ...props
+}, ref) {
+  const interactive = typeof onClick === "function";
+  const time = lastSyncedAt ? formatRelative(lastSyncedAt, relativeNow ?? /* @__PURE__ */ new Date()) : "";
+  const labelBlock = /* @__PURE__ */ jsxs22(Fragment4, { children: [
+    /* @__PURE__ */ jsx23(
+      "span",
+      {
+        "aria-hidden": true,
+        className: "bg-panel-2 grid h-10 w-10 shrink-0 place-items-center rounded-md font-mono text-[16px]",
+        children: /* @__PURE__ */ jsx23(IconGlyph, { name: connector, kind: "connector" })
+      }
+    ),
+    /* @__PURE__ */ jsxs22("div", { className: "min-w-0 flex-1", children: [
+      /* @__PURE__ */ jsxs22("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx23("span", { className: "truncate text-[14px] font-medium", children: name }),
+        /* @__PURE__ */ jsx23(
+          StatusDot,
+          {
+            state: statusDot[status],
+            pulse: status === "syncing",
+            label: statusLabel[status]
+          }
+        )
+      ] }),
+      (summary || time) && /* @__PURE__ */ jsxs22("div", { className: "text-text-muted mt-[2px] flex items-center gap-2 text-[12px]", children: [
+        summary && /* @__PURE__ */ jsx23("span", { className: "truncate", children: summary }),
+        summary && time && /* @__PURE__ */ jsx23("span", { "aria-hidden": true, className: "text-text-dim", children: "\xB7" }),
+        time && /* @__PURE__ */ jsxs22("time", { className: "text-text-dim font-mono text-[11px]", children: [
+          "last synced ",
+          time
+        ] })
+      ] })
+    ] })
+  ] });
+  const labelRegionClass = cn21(
+    "flex flex-1 items-start gap-3 rounded-md p-1 text-left transition-colors duration-(--duration-micro)",
+    interactive && "hover:bg-panel-2 focus-visible:ring-accent-dim cursor-pointer outline-none focus-visible:ring-[3px]"
+  );
+  const labelRegion = interactive ? /* @__PURE__ */ jsx23(
+    "button",
+    {
+      type: "button",
+      onClick,
+      "aria-label": accessibleName ?? (typeof name === "string" ? `${name} connector` : statusLabel[status]),
+      className: labelRegionClass,
+      children: labelBlock
+    }
+  ) : /* @__PURE__ */ jsx23("div", { className: labelRegionClass, children: labelBlock });
+  return /* @__PURE__ */ jsxs22(
+    "div",
+    {
+      ref,
+      className: cn21(
+        "rounded-base border-border bg-panel flex items-start gap-2 border p-3",
+        className
+      ),
+      ...props,
+      children: [
+        labelRegion,
+        actions && /* @__PURE__ */ jsx23("div", { className: "shrink-0 self-center pr-1", children: actions })
+      ]
+    }
+  );
+});
+ConnectorCard.displayName = "ConnectorCard";
+
 // src/data/EntityTable.tsx
 import { DataTable } from "@ship-it-ui/ui";
 import "react";
-import { jsx as jsx23, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx24, jsxs as jsxs23 } from "react/jsx-runtime";
 function EntityTable(props) {
   const { rowKey, ...rest } = props;
-  return /* @__PURE__ */ jsx23(DataTable, { ...rest, rowKey: rowKey ?? ((row) => row.id) });
+  return /* @__PURE__ */ jsx24(DataTable, { ...rest, rowKey: rowKey ?? ((row) => row.id) });
 }
 function entityColumn(options = {}) {
   return {
     key: options.key ?? "name",
     header: options.header ?? "Name",
     accessor: (row) => row.name,
-    cell: (row) => /* @__PURE__ */ jsxs22("span", { className: "flex items-center gap-2 font-mono", children: [
-      /* @__PURE__ */ jsx23("span", { "aria-hidden": true, className: ENTITY_TONE_CLASS[row.type], children: ENTITY_GLYPH[row.type] }),
-      row.name
-    ] })
+    cell: (row) => {
+      const meta = getEntityTypeMeta(row.type);
+      return /* @__PURE__ */ jsxs23("span", { className: "flex items-center gap-2 font-mono", "data-entity-type": row.type, children: [
+        /* @__PURE__ */ jsx24("span", { "aria-hidden": true, className: meta.toneClass, children: meta.glyph }),
+        row.name
+      ] });
+    }
   };
 }
 function entityTypeColumn(options = {}) {
@@ -1110,14 +1326,97 @@ function entityTypeColumn(options = {}) {
     key: options.key ?? "type",
     header: options.header ?? "Type",
     accessor: (row) => row.type,
-    cell: (row) => /* @__PURE__ */ jsx23(EntityBadge, { type: row.type, size: "sm" })
+    cell: (row) => /* @__PURE__ */ jsx24(EntityBadge, { type: row.type, size: "sm" })
   };
 }
+
+// src/notifications/NotifRow.tsx
+import { cn as cn22 } from "@ship-it-ui/ui";
+import { forwardRef as forwardRef24 } from "react";
+import { Fragment as Fragment5, jsx as jsx25, jsxs as jsxs24 } from "react/jsx-runtime";
+var toneClass = {
+  ok: "bg-ok",
+  warn: "bg-warn",
+  err: "bg-err",
+  neutral: "bg-accent-text"
+};
+var NotifRow = forwardRef24(function NotifRow2({
+  title,
+  body,
+  time,
+  tone = "neutral",
+  unread,
+  isFirst,
+  isLast,
+  href,
+  className,
+  onClick,
+  ...props
+}, ref) {
+  const content = /* @__PURE__ */ jsxs24(Fragment5, { children: [
+    /* @__PURE__ */ jsx25("div", { className: "pt-1", "aria-hidden": true, children: /* @__PURE__ */ jsx25(
+      "div",
+      {
+        className: cn22("h-2 w-2 rounded-full", unread ? toneClass[tone] : "bg-border-strong")
+      }
+    ) }),
+    /* @__PURE__ */ jsxs24("div", { className: "min-w-0 flex-1", children: [
+      /* @__PURE__ */ jsxs24("div", { className: "flex items-baseline justify-between gap-2", children: [
+        /* @__PURE__ */ jsx25("div", { className: "truncate text-[14px] font-medium tracking-tight", children: title }),
+        time != null && /* @__PURE__ */ jsx25("span", { className: "text-text-muted shrink-0 font-mono text-[11px] whitespace-nowrap", children: time })
+      ] }),
+      body && /* @__PURE__ */ jsx25("div", { className: "text-text-muted mt-[3px] text-[13px] leading-tight", children: body })
+    ] })
+  ] });
+  const baseClass = cn22(
+    "flex gap-3 p-[14px] bg-panel border-border border-l border-r",
+    isFirst ? "border-t rounded-t-m-card" : "",
+    "border-b",
+    isLast ? "rounded-b-m-card" : "",
+    href || onClick ? "cursor-pointer hover:bg-panel-2" : "",
+    className
+  );
+  if (href) {
+    return /* @__PURE__ */ jsx25(
+      "a",
+      {
+        ref,
+        href,
+        onClick,
+        className: cn22(
+          baseClass,
+          "text-text focus-visible:ring-accent-dim no-underline outline-none focus-visible:ring-[3px]"
+        ),
+        ...props,
+        children: content
+      }
+    );
+  }
+  if (onClick) {
+    return /* @__PURE__ */ jsx25(
+      "button",
+      {
+        type: "button",
+        ref,
+        onClick,
+        className: cn22(
+          baseClass,
+          "focus-visible:ring-accent-dim text-left outline-none focus-visible:ring-[3px]"
+        ),
+        ...props,
+        children: content
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx25("div", { ref, className: baseClass, ...props, children: content });
+});
+NotifRow.displayName = "NotifRow";
 export {
   AskBar,
   CTAStrip,
   Citation,
   ConfidenceIndicator,
+  ConnectorCard,
   CopilotMessage,
   ENTITY_GLYPH,
   ENTITY_LABEL,
@@ -1137,6 +1436,7 @@ export {
   GraphMinimap,
   GraphNode,
   Hero,
+  NotifRow,
   PathOverlay,
   PricingCard,
   ReasoningBlock,
@@ -1144,8 +1444,13 @@ export {
   SuggestionChip,
   Testimonial,
   ToolCallCard,
-  cn21 as cn,
+  cn23 as cn,
   entityColumn,
-  entityTypeColumn
+  entityTypeColumn,
+  getEntityTypeMeta,
+  listEntityTypes,
+  registerEntityType,
+  registerEntityTypes,
+  resetEntityTypeRegistry
 };
 //# sourceMappingURL=index.js.map