@ship-it-ui/shipit 0.0.1

package/dist/index.cjs

@@ -0,0 +1,950 @@
+'use strict';
+
+var clsx = require('clsx');
+var tailwindMerge = require('tailwind-merge');
+var ui = require('@ship-it-ui/ui');
+var react = require('react');
+var jsxRuntime = require('react/jsx-runtime');
+
+// src/utils/cn.ts
+function cn(...inputs) {
+  return tailwindMerge.twMerge(clsx.clsx(inputs));
+}
+var AskBar = react.forwardRef(function AskBar2({
+  value: valueProp,
+  defaultValue,
+  onValueChange,
+  onSubmit,
+  placeholder = "Ask anything\u2026",
+  streaming,
+  submitLabel = "Ask",
+  disabled,
+  maxWidth = 620,
+  className,
+  children,
+  ...props
+}, ref) {
+  const [value, setValue] = ui.useControllableState({
+    value: valueProp,
+    defaultValue: defaultValue ?? "",
+    onChange: onValueChange
+  });
+  const inputRef = react.useRef(null);
+  const submit = () => {
+    const v = (value ?? "").trim();
+    if (!v) return;
+    onSubmit?.(v);
+  };
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    submit();
+  };
+  const handleKey = (e) => {
+    if (e.key === "Enter" && (e.metaKey || e.ctrlKey)) {
+      e.preventDefault();
+      submit();
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "form",
+    {
+      ref,
+      role: "search",
+      onSubmit: handleSubmit,
+      style: { maxWidth },
+      className: cn(
+        "border-border-strong bg-panel w-full rounded-xl border p-[14px] shadow",
+        "focus-within:border-accent focus-within:ring-accent-dim focus-within:ring-[3px]",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-[10px] flex items-start gap-[10px]", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: "text-accent text-[16px]", children: "\u2726" }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "textarea",
+            {
+              ref: inputRef,
+              value: value ?? "",
+              onChange: (e) => setValue(e.target.value),
+              onKeyDown: handleKey,
+              placeholder,
+              "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"
+              )
+            }
+          ),
+          streaming && /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              "aria-hidden": true,
+              className: "bg-accent mt-[3px] inline-block h-4 w-px animate-[ship-pulse_1s_infinite]"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-[6px]", children: [
+          children,
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ml-auto flex items-center gap-2", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: "text-text-dim font-mono text-[11px]", children: "\u2318\u21B5" }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              ui.Button,
+              {
+                type: "submit",
+                size: "sm",
+                variant: "primary",
+                disabled: disabled || !(value ?? "").trim(),
+                children: submitLabel
+              }
+            )
+          ] })
+        ] })
+      ]
+    }
+  );
+});
+AskBar.displayName = "AskBar";
+var SUPERSCRIPTS = ["\u2070", "\xB9", "\xB2", "\xB3", "\u2074", "\u2075", "\u2076", "\u2077", "\u2078", "\u2079"];
+function toSuperscript(n) {
+  return String(n).split("").map((d) => SUPERSCRIPTS[Number(d)] ?? d).join("");
+}
+var Citation = react.forwardRef(function Citation2({ index, source, meta, inline, className, ...props }, ref) {
+  if (inline) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "sup",
+      {
+        ref,
+        "aria-label": typeof source === "string" ? `Citation ${index}: ${source}` : `Citation ${index}`,
+        className: cn("text-accent ml-[2px] font-mono text-[10px]", className),
+        ...props,
+        children: toSuperscript(index)
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("span", { ref, className: cn("inline-flex items-center gap-2", className), ...props, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "span",
+      {
+        "aria-hidden": true,
+        className: "bg-accent-dim text-accent rounded-xs px-[6px] py-[2px] font-mono text-[10px]",
+        children: toSuperscript(index)
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-text-muted text-[12px]", children: [
+      source != null && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        "from ",
+        source
+      ] }),
+      source != null && meta != null && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-text-dim", children: " \xB7 " }),
+      meta
+    ] })
+  ] });
+});
+Citation.displayName = "Citation";
+var tierLabel = {
+  high: "High",
+  medium: "Medium",
+  low: "Low \xB7 review",
+  unverified: "Unverified"
+};
+var tierBarClass = {
+  high: "bg-ok",
+  medium: "bg-accent",
+  low: "bg-warn",
+  unverified: "bg-err"
+};
+var tierTextClass = {
+  high: "text-ok",
+  medium: "text-accent",
+  low: "text-warn",
+  unverified: "text-err"
+};
+function deriveTier(value) {
+  if (value >= 95) return "high";
+  if (value >= 80) return "medium";
+  if (value >= 50) return "low";
+  return "unverified";
+}
+var ConfidenceIndicator = react.forwardRef(
+  function ConfidenceIndicator2({ value, tier: tierProp, label, width = 120, hideValue, className, ...props }, ref) {
+    const tier = tierProp ?? deriveTier(value);
+    const pct = Math.max(0, Math.min(100, value));
+    const display = label ?? tierLabel[tier];
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        role: "meter",
+        "aria-label": props["aria-label"] ?? "Confidence",
+        "aria-valuemin": 0,
+        "aria-valuemax": 100,
+        "aria-valuenow": Math.round(pct),
+        "aria-valuetext": `${Math.round(pct)}% \u2014 ${typeof display === "string" ? display : tierLabel[tier]}`,
+        className: cn("inline-flex items-center gap-[10px] text-[11px]", className),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, style: { width }, className: "bg-panel-2 h-1 overflow-hidden rounded-full", children: /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              className: cn(
+                "block h-full rounded-full transition-[width] duration-(--duration-step)",
+                tierBarClass[tier]
+              ),
+              style: { width: `${pct}%` }
+            }
+          ) }),
+          !hideValue && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-text min-w-[44px] font-mono tabular-nums", children: [
+            pct.toFixed(1),
+            "%"
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: tierTextClass[tier], children: display })
+        ]
+      }
+    );
+  }
+);
+ConfidenceIndicator.displayName = "ConfidenceIndicator";
+var CopilotMessage = react.forwardRef(
+  function CopilotMessage2({ role, avatar, streaming, className, children, ...props }, ref) {
+    const isAssistant = role === "assistant";
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        className: cn("flex items-start gap-[10px]", className),
+        "data-role": role,
+        ...props,
+        children: [
+          isAssistant ? /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              "aria-hidden": true,
+              className: "bg-accent-dim text-accent grid h-6 w-6 shrink-0 place-items-center rounded-full text-[11px] font-semibold",
+              children: "\u2726"
+            }
+          ) : typeof avatar === "string" ? /* @__PURE__ */ jsxRuntime.jsx(ui.Avatar, { size: "sm", name: avatar }) : avatar ?? null,
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              className: cn(
+                "rounded-base min-w-0 flex-1 px-[14px] py-3 text-[13px] leading-[1.6]",
+                isAssistant ? "bg-panel border-border border" : "bg-panel-2"
+              ),
+              children: [
+                children,
+                streaming && /* @__PURE__ */ jsxRuntime.jsx(
+                  "span",
+                  {
+                    "aria-hidden": true,
+                    className: "bg-accent ml-[2px] inline-block h-[14px] w-px animate-[ship-pulse_1s_infinite] align-middle"
+                  }
+                )
+              ]
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+CopilotMessage.displayName = "CopilotMessage";
+var ReasoningBlock = react.forwardRef(
+  function ReasoningBlock2({
+    label,
+    stepCount,
+    duration,
+    open: openProp,
+    defaultOpen = false,
+    onOpenChange,
+    className,
+    children,
+    ...props
+  }, ref) {
+    const [open, setOpen] = ui.useControllableState({
+      value: openProp,
+      defaultValue: defaultOpen,
+      onChange: onOpenChange
+    });
+    const inferredCount = stepCount ?? react.Children.count(children);
+    const heading = label ?? `Reasoning \xB7 ${inferredCount} step${inferredCount === 1 ? "" : "s"}`;
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        className: cn("border-border bg-panel-2 overflow-hidden rounded-md border", className),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "button",
+            {
+              type: "button",
+              "aria-expanded": open,
+              onClick: () => setOpen(!open),
+              className: "focus-visible:ring-accent-dim flex w-full cursor-pointer items-center gap-[10px] border-0 bg-transparent px-[14px] py-[10px] text-left outline-none focus-visible:ring-[3px]",
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: "text-text-dim font-mono text-[11px]", children: open ? "\u25BE" : "\u25B8" }),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[12px] font-medium", children: heading }),
+                duration != null && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-text-dim ml-auto font-mono text-[10px]", children: duration })
+              ]
+            }
+          ),
+          open && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-border text-text-muted border-t px-[14px] py-[10px] pl-9 text-[11px] leading-[1.7]", children })
+        ]
+      }
+    );
+  }
+);
+ReasoningBlock.displayName = "ReasoningBlock";
+var ReasoningStep = react.forwardRef(function ReasoningStep2({ step, className, children, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: cn("mb-[2px] last:mb-0", className), ...props, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-accent mr-[6px] font-mono", children: [
+      step,
+      "."
+    ] }),
+    children
+  ] });
+});
+ReasoningStep.displayName = "ReasoningStep";
+var SuggestionChip = react.forwardRef(
+  function SuggestionChip2({ glyph = "\u2726", className, children, type, ...props }, ref) {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "button",
+      {
+        ref,
+        type: type ?? "button",
+        className: cn(
+          "border-border bg-panel text-text inline-flex cursor-pointer items-center gap-[6px] rounded-full border px-[10px] py-[6px] text-[12px] outline-none",
+          "transition-colors duration-(--duration-micro)",
+          "hover:border-border-strong hover:bg-panel-2",
+          "focus-visible:ring-accent-dim focus-visible:ring-[3px]",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: "text-accent", children: glyph }),
+          children
+        ]
+      }
+    );
+  }
+);
+SuggestionChip.displayName = "SuggestionChip";
+var ToolCallCard = react.forwardRef(function ToolCallCard2({ name, status, running, className, children, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ref,
+      className: cn("border-border bg-panel rounded-md border px-[14px] py-[10px]", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-[10px]", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ui.Badge, { size: "sm", variant: "accent", children: "TOOL" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-mono text-[12px] font-medium", children: name }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-text-dim ml-auto inline-flex items-center font-mono text-[10px]", children: running ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            "running",
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "span",
+              {
+                "aria-hidden": true,
+                className: "bg-accent ml-1 inline-block h-3 w-px animate-[ship-pulse_1s_infinite] align-middle"
+              }
+            )
+          ] }) : status })
+        ] }),
+        children && /* @__PURE__ */ jsxRuntime.jsx("pre", { className: "text-text-muted m-0 mt-[6px] font-mono text-[11px] leading-[1.6] break-words whitespace-pre-wrap", children })
+      ]
+    }
+  );
+});
+ToolCallCard.displayName = "ToolCallCard";
+
+// src/entity/types.ts
+var ENTITY_GLYPH = {
+  service: "\u25C7",
+  person: "\u25CB",
+  document: "\u25A4",
+  deployment: "\u2191",
+  incident: "\u25CE",
+  ticket: "\u25A2"
+};
+var ENTITY_LABEL = {
+  service: "Service",
+  person: "Person",
+  document: "Document",
+  deployment: "Deployment",
+  incident: "Incident",
+  ticket: "Ticket"
+};
+var ENTITY_TONE_CLASS = {
+  service: "text-accent",
+  person: "text-text-muted",
+  document: "text-purple",
+  deployment: "text-ok",
+  incident: "text-err",
+  ticket: "text-warn"
+};
+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%)]"
+};
+var typeVariant = {
+  service: "accent",
+  person: "neutral",
+  document: "purple",
+  deployment: "ok",
+  incident: "err",
+  ticket: "warn"
+};
+var EntityBadge = react.forwardRef(function EntityBadge2({ type, label, hideGlyph, className, children, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(ui.Badge, { ref, variant: typeVariant[type], className: cn(className), ...props, children: [
+    !hideGlyph && /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: "font-mono", children: ENTITY_GLYPH[type] }),
+    children ?? label ?? ENTITY_LABEL[type]
+  ] });
+});
+EntityBadge.displayName = "EntityBadge";
+var statToneClass = {
+  accent: "text-accent",
+  ok: "text-ok",
+  warn: "text-warn",
+  err: "text-err",
+  muted: "text-text-muted"
+};
+var EntityCard = react.forwardRef(function EntityCard2({ type, title, subtitle, description, stats, actions, glyph, className, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ref,
+      className: cn(
+        "rounded-base border-border bg-panel flex flex-col gap-3 border p-5",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-3", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              "aria-hidden": true,
+              className: cn(
+                "rounded-base grid h-12 w-12 shrink-0 place-items-center text-[20px]",
+                ENTITY_TONE_BG[type],
+                ENTITY_TONE_CLASS[type]
+              ),
+              children: glyph ?? ENTITY_GLYPH[type]
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(EntityBadge, { type, size: "sm" }),
+              subtitle && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-text-dim font-mono text-[11px]", children: subtitle })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 truncate font-mono text-[18px] font-medium tracking-tight", children: title }),
+            description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-text-muted mt-1 text-[13px] leading-[1.5]", children: description })
+          ] }),
+          actions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "shrink-0", children: actions })
+        ] }),
+        stats && stats.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: "divide-border border-border bg-panel-2 grid divide-x rounded-md border",
+            style: { gridTemplateColumns: `repeat(${Math.min(stats.length, 6)}, 1fr)` },
+            children: stats.map((stat, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-4 py-3", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-text-dim font-mono text-[10px] tracking-[1.3px] uppercase", children: stat.label }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  className: cn(
+                    "mt-1 text-[16px] font-medium tracking-tight",
+                    stat.tone ? statToneClass[stat.tone] : "text-text"
+                  ),
+                  children: stat.value
+                }
+              )
+            ] }, i))
+          }
+        )
+      ]
+    }
+  );
+});
+EntityCard.displayName = "EntityCard";
+var EntityListRow = react.forwardRef(function EntityListRow2({ type, name, relation, meta, onClick, hideGlyph, className, ...props }, ref) {
+  const interactive = typeof onClick === "function";
+  const baseClass = cn(
+    "flex w-full items-center gap-3 border-0 bg-transparent px-2 py-2 text-left",
+    "border-b border-border last:border-0",
+    interactive && "cursor-pointer outline-none transition-colors duration-(--duration-micro) hover:bg-panel-2 focus-visible:ring-[3px] focus-visible:ring-accent-dim",
+    className
+  );
+  const inner = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    !hideGlyph && /* @__PURE__ */ jsxRuntime.jsx(
+      "span",
+      {
+        "aria-hidden": true,
+        className: cn("font-mono text-[14px] leading-none", ENTITY_TONE_CLASS[type]),
+        children: ENTITY_GLYPH[type]
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-text min-w-0 flex-1 truncate font-mono text-[12px]", children: name }),
+    relation && /* @__PURE__ */ jsxRuntime.jsx("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__ */ jsxRuntime.jsx("span", { className: "text-text-dim font-mono text-[10px]", children: meta })
+  ] });
+  if (interactive) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        ref,
+        type: "button",
+        onClick,
+        className: baseClass,
+        ...props,
+        children: inner
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: baseClass, ...props, children: inner });
+});
+EntityListRow.displayName = "EntityListRow";
+var styleProps = {
+  solid: { stroke: "var(--color-accent)", strokeWidth: 1.5 },
+  dashed: { stroke: "var(--color-accent)", strokeWidth: 1.5, strokeDasharray: "4 3" },
+  highlighted: { stroke: "var(--color-purple)", strokeWidth: 2.5 },
+  dim: { stroke: "var(--color-text-dim)", strokeWidth: 1, opacity: 0.4 }
+};
+var GraphEdge = react.forwardRef(function GraphEdge2({ x1, y1, x2, y2, curve, edgeStyle = "solid", color, arrowheadId, ...props }, ref) {
+  const base = styleProps[edgeStyle];
+  const stroke = color ?? base.stroke;
+  const sharedProps = {
+    fill: "none",
+    stroke,
+    strokeWidth: base.strokeWidth,
+    strokeDasharray: base.strokeDasharray,
+    opacity: base.opacity,
+    markerEnd: arrowheadId ? `url(#${arrowheadId})` : void 0,
+    ...props
+  };
+  if (curve) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "path",
+      {
+        ref,
+        d: `M${x1},${y1} Q${curve.cx},${curve.cy} ${x2},${y2}`,
+        ...sharedProps
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx("line", { ref, x1, y1, x2, y2, ...sharedProps });
+});
+GraphEdge.displayName = "GraphEdge";
+var GraphInspector = react.forwardRef(
+  function GraphInspector2({
+    type,
+    entityId,
+    title,
+    description,
+    properties,
+    relations,
+    relationCount,
+    className,
+    ...props
+  }, ref) {
+    const total = relationCount ?? relations?.length ?? 0;
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "aside",
+      {
+        ref,
+        "aria-label": typeof title === "string" ? `${title} inspector` : "Node inspector",
+        className: cn(
+          "rounded-base border-border bg-panel flex w-[340px] flex-col gap-3 border p-4",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(EntityBadge, { type, size: "sm" }),
+            entityId && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-text-dim ml-auto font-mono text-[10px]", children: entityId })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[17px] font-medium", children: title }),
+            description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-text-muted mt-[2px] text-[12px]", children: description })
+          ] }),
+          properties && properties.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("section", { children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-text-dim mb-2 font-mono text-[9px] tracking-[1.4px] uppercase", children: "Properties" }),
+            /* @__PURE__ */ jsxRuntime.jsx("dl", { className: "m-0 flex flex-col gap-1 font-mono text-[11px]", children: properties.map((p, i) => /* @__PURE__ */ jsxRuntime.jsxs(
+              "div",
+              {
+                className: cn("border-border flex py-1", i < properties.length - 1 && "border-b"),
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("dt", { className: "text-text-dim w-[70px]", children: p.key }),
+                  /* @__PURE__ */ jsxRuntime.jsx("dd", { className: "m-0 flex-1", children: p.value })
+                ]
+              },
+              i
+            )) })
+          ] }),
+          relations && relations.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("section", { children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-text-dim mb-2 font-mono text-[9px] tracking-[1.4px] uppercase", children: [
+              "Relations \xB7 ",
+              total
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "m-0 flex list-none flex-col gap-1 p-0 text-[11px]", children: relations.map((r, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex gap-2", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-text-dim w-[100px] font-mono", children: r.relation }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { children: r.entity })
+            ] }, i)) })
+          ] })
+        ]
+      }
+    );
+  }
+);
+GraphInspector.displayName = "GraphInspector";
+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 }
+];
+var GraphLegend = react.forwardRef(function GraphLegend2({ entries = DEFAULT_ENTRIES, heading = "Legend", className, children, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ref,
+      className: cn(
+        "rounded-base border-border bg-panel/85 inline-flex flex-col gap-[6px] border p-[10px] text-[11px] backdrop-blur-[8px]",
+        className
+      ),
+      ...props,
+      children: [
+        heading && /* @__PURE__ */ jsxRuntime.jsx("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");
+          return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-[6px]", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: "h-2 w-2 rounded-full", style: { background: color } }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { children: entry.label })
+          ] }, i);
+        })
+      ]
+    }
+  );
+});
+GraphLegend.displayName = "GraphLegend";
+var GraphMinimap = react.forwardRef(function GraphMinimap2({ points, viewport, width = 120, height = 72, className, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      role: "img",
+      "aria-label": "Graph minimap",
+      className: cn(
+        "border-border bg-panel/85 relative rounded-md border p-1 backdrop-blur-[8px]",
+        className
+      ),
+      style: { width, height },
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative h-full w-full", children: [
+        points.map((p, i) => /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            "aria-hidden": true,
+            className: "absolute h-[2px] w-[2px] rounded-full",
+            style: {
+              left: `${p.x * 100}%`,
+              top: `${p.y * 100}%`,
+              background: p.color ?? "var(--color-accent)"
+            }
+          },
+          i
+        )),
+        viewport && /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            "aria-hidden": true,
+            className: "border-accent absolute rounded-[2px] border",
+            style: {
+              left: `${viewport.x * 100}%`,
+              top: `${viewport.y * 100}%`,
+              width: `${viewport.width * 100}%`,
+              height: `${viewport.height * 100}%`,
+              background: "oklch(0.8 0.12 200 / 0.12)"
+            }
+          }
+        )
+      ] })
+    }
+  );
+});
+GraphMinimap.displayName = "GraphMinimap";
+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 = react.forwardRef(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 glowAlpha = state === "hover" ? "80" : "40";
+  const opacity = state === "dim" ? 0.35 : 1;
+  const showRing = state === "selected" || state === "path";
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ref,
+      role: "img",
+      "aria-label": typeof label === "string" ? label : `${type} node`,
+      "data-state": state,
+      "data-entity-type": type,
+      className: cn("inline-flex flex-col items-center gap-[6px]", className),
+      style,
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: "bg-panel grid place-items-center rounded-[14px] border-[1.5px] transition-all duration-(--duration-micro)",
+            style: {
+              width: size,
+              height: size,
+              borderColor: color,
+              color,
+              fontSize: Math.round(size * 0.42),
+              boxShadow: `0 0 ${state === "hover" ? 30 : 20}px ${color}${glowAlpha}`,
+              outline: showRing ? `2px solid ${color}` : void 0,
+              outlineOffset: showRing ? 4 : void 0,
+              opacity
+            },
+            children: glyph ?? ENTITY_GLYPH[type]
+          }
+        ),
+        label && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-text-dim font-mono text-[10px]", children: label })
+      ]
+    }
+  );
+});
+GraphNode.displayName = "GraphNode";
+var PathOverlay = react.forwardRef(function PathOverlay2({ points, color = "var(--color-purple)", width = 2.5, halo = true, ...props }, ref) {
+  if (points.length < 2) return null;
+  const coords = points.map((p) => `${p.x},${p.y}`).join(" ");
+  return /* @__PURE__ */ jsxRuntime.jsxs("g", { ref, ...props, children: [
+    halo && /* @__PURE__ */ jsxRuntime.jsx(
+      "polyline",
+      {
+        points: coords,
+        fill: "none",
+        stroke: "var(--color-bg)",
+        strokeWidth: width + 4,
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        opacity: 0.65
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "polyline",
+      {
+        points: coords,
+        fill: "none",
+        stroke: color,
+        strokeWidth: width,
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }
+    )
+  ] });
+});
+PathOverlay.displayName = "PathOverlay";
+var CTAStrip = react.forwardRef(function CTAStrip2({ title, description, actions, className, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "section",
+    {
+      ref,
+      className: cn(
+        "rounded-xl px-10 py-12 text-center",
+        "bg-[linear-gradient(135deg,oklch(0.2_0.08_260),oklch(0.16_0.06_300))]",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "m-0 mb-[10px] text-[28px] font-medium tracking-[-0.4px]", children: title }),
+        description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-text-muted m-0 mb-5 text-[13px]", children: description }),
+        actions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap justify-center gap-2", children: actions })
+      ]
+    }
+  );
+});
+CTAStrip.displayName = "CTAStrip";
+var colsClass = {
+  2: "md:grid-cols-2",
+  3: "md:grid-cols-3",
+  4: "md:grid-cols-2 lg:grid-cols-4"
+};
+var FeatureGrid = react.forwardRef(function FeatureGrid2({ features, columns = 3, className, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      className: cn("grid grid-cols-1 gap-3", colsClass[columns], className),
+      ...props,
+      children: features.map((f, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-base border-border bg-panel border p-5", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { "aria-hidden": true, className: "text-accent mb-3 text-[22px]", children: f.glyph }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-[6px] text-[14px] font-medium", children: f.title }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-text-muted text-[12px] leading-[1.55]", children: f.description })
+      ] }, i))
+    }
+  );
+});
+FeatureGrid.displayName = "FeatureGrid";
+var Footer = react.forwardRef(function Footer2({ brand, columns, copyright, closing, className, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("footer", { ref, className: cn("px-7 py-7", className), ...props, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-7 flex flex-wrap gap-8", children: [
+      brand && /* @__PURE__ */ jsxRuntime.jsx("div", { children: brand }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-text-muted ml-auto flex flex-wrap gap-6 text-[12px]", children: columns.map((col, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-[6px]", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-text-dim font-mono text-[10px] tracking-[1.2px] uppercase", children: col.heading }),
+        col.links.map((link, j) => /* @__PURE__ */ jsxRuntime.jsx(
+          "a",
+          {
+            href: link.href,
+            className: "text-text-muted hover:text-text no-underline",
+            children: link.label
+          },
+          j
+        ))
+      ] }, i)) })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-border text-text-dim flex border-t pt-4 font-mono text-[11px]", children: [
+      copyright && /* @__PURE__ */ jsxRuntime.jsx("span", { children: copyright }),
+      closing && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-auto", children: closing })
+    ] })
+  ] });
+});
+Footer.displayName = "Footer";
+var Hero = react.forwardRef(function Hero2({ eyebrow, title, description, actions, visual, className, ...props }, ref) {
+  const hasVisual = visual != null;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "section",
+    {
+      ref,
+      className: cn(
+        "flex flex-col items-center justify-between gap-10 px-6 py-16 md:py-24",
+        hasVisual && "md:flex-row md:items-center md:gap-16",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("max-w-[680px]", !hasVisual && "mx-auto text-center"), children: [
+          eyebrow,
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "h1",
+            {
+              className: cn(
+                "mb-4 text-[44px] leading-[1.05] font-medium tracking-[-1.6px] md:text-[56px]",
+                eyebrow && "mt-5"
+              ),
+              children: title
+            }
+          ),
+          description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-text-muted mb-7 text-[17px] leading-[1.6]", children: description }),
+          actions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex flex-wrap gap-2", !hasVisual && "justify-center"), children: actions })
+        ] }),
+        visual && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1", children: visual })
+      ]
+    }
+  );
+});
+Hero.displayName = "Hero";
+var PricingCard = react.forwardRef(function PricingCard2({ tier, price, description, features, action, featured, className, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ref,
+      className: cn(
+        "bg-panel flex flex-col gap-5 rounded-lg border p-6",
+        featured ? "border-accent shadow-lg" : "border-border",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-1 flex items-center gap-2", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[14px] font-medium", children: tier }),
+            featured && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bg-accent-dim text-accent rounded-full px-[6px] py-[1px] font-mono text-[10px]", children: "recommended" })
+          ] }),
+          description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-text-muted text-[12px]", children: description })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-mono text-[28px] font-medium tracking-[-0.5px]", children: price }),
+        /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "m-0 flex list-none flex-col gap-2 p-0", children: features.map((f, i) => /* @__PURE__ */ jsxRuntime.jsxs("li", { className: "flex items-start gap-2 text-[13px]", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: "text-accent", children: "\u2713" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { children: f })
+        ] }, i)) }),
+        action && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-auto", children: action })
+      ]
+    }
+  );
+});
+PricingCard.displayName = "PricingCard";
+var Testimonial = react.forwardRef(function Testimonial2({ quote, author, role, avatar, className, ...props }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "figure",
+    {
+      ref,
+      className: cn("mx-auto max-w-[620px] px-6 py-10 text-center", className),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { "aria-hidden": true, className: "text-accent mb-4 text-[40px] leading-none", children: "\u201C" }),
+        /* @__PURE__ */ jsxRuntime.jsx("blockquote", { className: "m-0 text-[22px] leading-[1.45] font-medium tracking-[-0.3px]", children: quote }),
+        /* @__PURE__ */ jsxRuntime.jsxs("figcaption", { className: "mt-5 flex items-center justify-center gap-[10px]", children: [
+          typeof avatar === "string" ? /* @__PURE__ */ jsxRuntime.jsx(ui.Avatar, { size: "md", name: avatar }) : avatar,
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-left", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-[13px] font-medium", children: author }),
+            role && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-text-dim text-[11px]", children: role })
+          ] })
+        ] })
+      ]
+    }
+  );
+});
+Testimonial.displayName = "Testimonial";
+
+exports.AskBar = AskBar;
+exports.CTAStrip = CTAStrip;
+exports.Citation = Citation;
+exports.ConfidenceIndicator = ConfidenceIndicator;
+exports.CopilotMessage = CopilotMessage;
+exports.ENTITY_GLYPH = ENTITY_GLYPH;
+exports.ENTITY_LABEL = ENTITY_LABEL;
+exports.ENTITY_TONE_BG = ENTITY_TONE_BG;
+exports.ENTITY_TONE_CLASS = ENTITY_TONE_CLASS;
+exports.EntityBadge = EntityBadge;
+exports.EntityCard = EntityCard;
+exports.EntityListRow = EntityListRow;
+exports.FeatureGrid = FeatureGrid;
+exports.Footer = Footer;
+exports.GraphEdge = GraphEdge;
+exports.GraphInspector = GraphInspector;
+exports.GraphLegend = GraphLegend;
+exports.GraphMinimap = GraphMinimap;
+exports.GraphNode = GraphNode;
+exports.Hero = Hero;
+exports.PathOverlay = PathOverlay;
+exports.PricingCard = PricingCard;
+exports.ReasoningBlock = ReasoningBlock;
+exports.ReasoningStep = ReasoningStep;
+exports.SuggestionChip = SuggestionChip;
+exports.Testimonial = Testimonial;
+exports.ToolCallCard = ToolCallCard;
+exports.cn = cn;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map