@tollerud/ui 1.1.4 → 3.0.0

package/dist/chunk-EN4OJCEF.js

@@ -0,0 +1,54 @@
+'use client';
+import { cn } from './chunk-WSQNPRGN.js';
+import { forwardRef } from 'react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+
+var severityStyles = {
+  critical: { border: "border-tollerud-error/50", dot: "bg-tollerud-error shadow-[0_0_8px_rgba(239,68,68,0.6)]", label: "text-tollerud-error" },
+  high: { border: "border-tollerud-yellow/50", dot: "bg-tollerud-yellow shadow-[0_0_8px_rgba(232,213,0,0.5)]", label: "text-tollerud-yellow" },
+  medium: { border: "border-tollerud-amber/40", dot: "bg-tollerud-amber", label: "text-tollerud-amber" },
+  low: { border: "border-tollerud-noir-500", dot: "bg-tollerud-noir-400", label: "text-tollerud-text-muted" },
+  info: { border: "border-tollerud-info/30", dot: "bg-tollerud-info", label: "text-tollerud-info" }
+};
+var IncidentCard = forwardRef(
+  ({ className, title, severity, timestamp, description, service, acknowledged, loading, ...props }, ref) => {
+    const style = severityStyles[severity];
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        className: cn(
+          "rounded-lg border bg-tollerud-surface-raised p-4",
+          "transition-[border-color] duration-[150ms]",
+          style.border,
+          acknowledged && "opacity-50",
+          loading && "animate-pulse",
+          className
+        ),
+        ...props,
+        children: /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3", children: [
+          /* @__PURE__ */ jsx("span", { className: cn("w-2 h-2 rounded-full mt-1.5 flex-shrink-0", style.dot) }),
+          /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+              /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold text-tollerud-foreground truncate", children: title }),
+              /* @__PURE__ */ jsx("span", { className: cn("text-[11px] font-medium uppercase whitespace-nowrap", style.label), children: severity })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mt-0.5 text-xs text-tollerud-text-muted", children: [
+              /* @__PURE__ */ jsx("span", { children: timestamp }),
+              service && /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsx("span", { className: "text-tollerud-noir-500", children: "\xB7" }),
+                /* @__PURE__ */ jsx("span", { children: service })
+              ] })
+            ] }),
+            description && /* @__PURE__ */ jsx("p", { className: "mt-1.5 text-xs text-tollerud-text-secondary leading-relaxed", children: description })
+          ] })
+        ] })
+      }
+    );
+  }
+);
+IncidentCard.displayName = "IncidentCard";
+
+export { IncidentCard };
+//# sourceMappingURL=chunk-EN4OJCEF.js.map
+//# sourceMappingURL=chunk-EN4OJCEF.js.map

package/dist/chunk-EN4OJCEF.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/IncidentCard.tsx"],"names":[],"mappings":";;;;AAsBA,IAAM,cAAA,GAA2F;AAAA,EAC/F,UAAU,EAAE,MAAA,EAAQ,4BAA4B,GAAA,EAAK,wDAAA,EAA0D,OAAO,qBAAA,EAAsB;AAAA,EAC5I,MAAU,EAAE,MAAA,EAAQ,6BAA6B,GAAA,EAAK,yDAAA,EAA2D,OAAO,sBAAA,EAAuB;AAAA,EAC/I,QAAU,EAAE,MAAA,EAAQ,4BAA4B,GAAA,EAAK,mBAAA,EAAqB,OAAO,qBAAA,EAAsB;AAAA,EACvG,KAAU,EAAE,MAAA,EAAQ,4BAA4B,GAAA,EAAK,sBAAA,EAAwB,OAAO,0BAAA,EAA2B;AAAA,EAC/G,MAAU,EAAE,MAAA,EAAQ,2BAA2B,GAAA,EAAK,kBAAA,EAAoB,OAAO,oBAAA;AACjF,CAAA;AAEA,IAAM,YAAA,GAAe,UAAA;AAAA,EACnB,CAAC,EAAE,SAAA,EAAW,KAAA,EAAO,QAAA,EAAU,SAAA,EAAW,WAAA,EAAa,OAAA,EAAS,YAAA,EAAc,OAAA,EAAS,GAAG,KAAA,IAAS,GAAA,KAAQ;AACzG,IAAA,MAAM,KAAA,GAAQ,eAAe,QAAQ,CAAA;AAErC,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,EAAA;AAAA,UACT,kDAAA;AAAA,UACA,4CAAA;AAAA,UACA,KAAA,CAAM,MAAA;AAAA,UACN,YAAA,IAAgB,YAAA;AAAA,UAChB,OAAA,IAAW,eAAA;AAAA,UACX;AAAA,SACF;AAAA,QACC,GAAG,KAAA;AAAA,QAEJ,QAAA,kBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,wBAAA,EACb,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,UAAK,SAAA,EAAW,EAAA,CAAG,2CAAA,EAA6C,KAAA,CAAM,GAAG,CAAA,EAAG,CAAA;AAAA,0BAC7E,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,gBAAA,EACb,QAAA,EAAA;AAAA,4BAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,yCAAA,EACb,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,yDAAA,EAA2D,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,8BACjF,GAAA,CAAC,UAAK,SAAA,EAAW,EAAA,CAAG,uDAAuD,KAAA,CAAM,KAAK,GACnF,QAAA,EAAA,QAAA,EACH;AAAA,aAAA,EACF,CAAA;AAAA,4BACA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,iEAAA,EACb,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,UAAM,QAAA,EAAA,SAAA,EAAU,CAAA;AAAA,cAChB,2BAAW,IAAA,CAAA,QAAA,EAAA,EAAE,QAAA,EAAA;AAAA,gCAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,wBAAA,EAAyB,QAAA,EAAA,MAAA,EAAC,CAAA;AAAA,gCAAO,GAAA,CAAC,UAAM,QAAA,EAAA,OAAA,EAAQ;AAAA,eAAA,EAAO;AAAA,aAAA,EACvF,CAAA;AAAA,YACC,WAAA,oBACC,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,+DAA+D,QAAA,EAAA,WAAA,EAAY;AAAA,WAAA,EAE5F;AAAA,SAAA,EACF;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;AACA,YAAA,CAAa,WAAA,GAAc,cAAA","file":"chunk-EN4OJCEF.js","sourcesContent":["import { type HTMLAttributes, forwardRef } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport type IncidentSeverity = 'critical' | 'high' | 'medium' | 'low' | 'info'\n\nexport interface IncidentCardProps extends HTMLAttributes<HTMLDivElement> {\n  /** Incident title */\n  title: string\n  /** Severity level */\n  severity: IncidentSeverity\n  /** Timestamp string */\n  timestamp: string\n  /** Description / detail */\n  description?: string\n  /** Service name affected */\n  service?: string\n  /** Whether acknowledged */\n  acknowledged?: boolean\n  /** Whether the card is loading */\n  loading?: boolean\n}\n\nconst severityStyles: Record<IncidentSeverity, { border: string; dot: string; label: string }> = {\n  critical: { border: 'border-tollerud-error/50', dot: 'bg-tollerud-error shadow-[0_0_8px_rgba(239,68,68,0.6)]', label: 'text-tollerud-error' },\n  high:     { border: 'border-tollerud-yellow/50', dot: 'bg-tollerud-yellow shadow-[0_0_8px_rgba(232,213,0,0.5)]', label: 'text-tollerud-yellow' },\n  medium:   { border: 'border-tollerud-amber/40', dot: 'bg-tollerud-amber', label: 'text-tollerud-amber' },\n  low:      { border: 'border-tollerud-noir-500', dot: 'bg-tollerud-noir-400', label: 'text-tollerud-text-muted' },\n  info:     { border: 'border-tollerud-info/30', dot: 'bg-tollerud-info', label: 'text-tollerud-info' },\n}\n\nconst IncidentCard = forwardRef<HTMLDivElement, IncidentCardProps>(\n  ({ className, title, severity, timestamp, description, service, acknowledged, loading, ...props }, ref) => {\n    const style = severityStyles[severity]\n\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          'rounded-lg border bg-tollerud-surface-raised p-4',\n          'transition-[border-color] duration-[150ms]',\n          style.border,\n          acknowledged && 'opacity-50',\n          loading && 'animate-pulse',\n          className\n        )}\n        {...props}\n      >\n        <div className=\"flex items-start gap-3\">\n          <span className={cn('w-2 h-2 rounded-full mt-1.5 flex-shrink-0', style.dot)} />\n          <div className=\"flex-1 min-w-0\">\n            <div className=\"flex items-center justify-between gap-2\">\n              <span className=\"text-sm font-semibold text-tollerud-foreground truncate\">{title}</span>\n              <span className={cn('text-[11px] font-medium uppercase whitespace-nowrap', style.label)}>\n                {severity}\n              </span>\n            </div>\n            <div className=\"flex items-center gap-2 mt-0.5 text-xs text-tollerud-text-muted\">\n              <span>{timestamp}</span>\n              {service && <><span className=\"text-tollerud-noir-500\">·</span><span>{service}</span></>}\n            </div>\n            {description && (\n              <p className=\"mt-1.5 text-xs text-tollerud-text-secondary leading-relaxed\">{description}</p>\n            )}\n          </div>\n        </div>\n      </div>\n    )\n  }\n)\nIncidentCard.displayName = 'IncidentCard'\n\nexport { IncidentCard }\n"]}

package/dist/chunk-EVHZFYWX.js

@@ -0,0 +1,33 @@
+'use client';
+import { cn } from './chunk-WSQNPRGN.js';
+import { forwardRef } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+var Sparkline = forwardRef(
+  ({ className, data, width, height, w, h, color = "#E8D500", ...props }, ref) => {
+    const resolvedWidth = width ?? w ?? 120;
+    const resolvedHeight = height ?? h ?? 34;
+    const max = Math.max(...data);
+    const min = Math.min(...data);
+    const span = Math.max(data.length - 1, 1);
+    const pts = data.map(
+      (v, i) => `${i / span * resolvedWidth},${resolvedHeight - 2 - (v - min) / (max - min || 1) * (resolvedHeight - 4)}`
+    ).join(" ");
+    return /* @__PURE__ */ jsx("div", { ref, className: cn("inline-block", className), ...props, children: /* @__PURE__ */ jsx("svg", { width: resolvedWidth, height: resolvedHeight, className: "block", role: "img", "aria-hidden": "true", children: /* @__PURE__ */ jsx(
+      "polyline",
+      {
+        points: pts,
+        fill: "none",
+        stroke: color,
+        strokeWidth: "1.6",
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }
+    ) }) });
+  }
+);
+Sparkline.displayName = "Sparkline";
+
+export { Sparkline };
+//# sourceMappingURL=chunk-EVHZFYWX.js.map
+//# sourceMappingURL=chunk-EVHZFYWX.js.map

package/dist/chunk-EVHZFYWX.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/Sparkline.tsx"],"names":[],"mappings":";;;;AAcA,IAAM,SAAA,GAAY,UAAA;AAAA,EAChB,CAAC,EAAE,SAAA,EAAW,IAAA,EAAM,KAAA,EAAO,MAAA,EAAQ,CAAA,EAAG,CAAA,EAAG,KAAA,GAAQ,SAAA,EAAW,GAAG,KAAA,IAAS,GAAA,KAAQ;AAC9E,IAAA,MAAM,aAAA,GAAgB,SAAS,CAAA,IAAK,GAAA;AACpC,IAAA,MAAM,cAAA,GAAiB,UAAU,CAAA,IAAK,EAAA;AACtC,IAAA,MAAM,GAAA,GAAM,IAAA,CAAK,GAAA,CAAI,GAAG,IAAI,CAAA;AAC5B,IAAA,MAAM,GAAA,GAAM,IAAA,CAAK,GAAA,CAAI,GAAG,IAAI,CAAA;AAC5B,IAAA,MAAM,OAAO,IAAA,CAAK,GAAA,CAAI,IAAA,CAAK,MAAA,GAAS,GAAG,CAAC,CAAA;AACxC,IAAA,MAAM,MAAM,IAAA,CACT,GAAA;AAAA,MACC,CAAC,CAAA,EAAG,CAAA,KACF,CAAA,EAAI,CAAA,GAAI,OAAQ,aAAa,CAAA,CAAA,EAAI,cAAA,GAAiB,CAAA,GAAA,CAAM,IAAI,GAAA,KAAQ,GAAA,GAAM,GAAA,IAAO,CAAA,CAAA,IAAO,iBAAiB,CAAA,CAAE,CAAA;AAAA,KAC/G,CACC,KAAK,GAAG,CAAA;AAEX,IAAA,uBACE,GAAA,CAAC,SAAI,GAAA,EAAU,SAAA,EAAW,GAAG,cAAA,EAAgB,SAAS,GAAI,GAAG,KAAA,EAC3D,8BAAC,KAAA,EAAA,EAAI,KAAA,EAAO,eAAe,MAAA,EAAQ,cAAA,EAAgB,WAAU,OAAA,EAAQ,IAAA,EAAK,KAAA,EAAM,aAAA,EAAY,MAAA,EAC1F,QAAA,kBAAA,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,MAAA,EAAQ,GAAA;AAAA,QACR,IAAA,EAAK,MAAA;AAAA,QACL,MAAA,EAAQ,KAAA;AAAA,QACR,WAAA,EAAY,KAAA;AAAA,QACZ,aAAA,EAAc,OAAA;AAAA,QACd,cAAA,EAAe;AAAA;AAAA,OAEnB,CAAA,EACF,CAAA;AAAA,EAEJ;AACF;AACA,SAAA,CAAU,WAAA,GAAc,WAAA","file":"chunk-EVHZFYWX.js","sourcesContent":["import { type HTMLAttributes, forwardRef } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport interface SparklineProps extends HTMLAttributes<HTMLDivElement> {\n  data: number[]\n  width?: number\n  height?: number\n  /** @deprecated Use `width` */\n  w?: number\n  /** @deprecated Use `height` */\n  h?: number\n  color?: string\n}\n\nconst Sparkline = forwardRef<HTMLDivElement, SparklineProps>(\n  ({ className, data, width, height, w, h, color = '#E8D500', ...props }, ref) => {\n    const resolvedWidth = width ?? w ?? 120\n    const resolvedHeight = height ?? h ?? 34\n    const max = Math.max(...data)\n    const min = Math.min(...data)\n    const span = Math.max(data.length - 1, 1)\n    const pts = data\n      .map(\n        (v, i) =>\n          `${(i / span) * resolvedWidth},${resolvedHeight - 2 - ((v - min) / (max - min || 1)) * (resolvedHeight - 4)}`\n      )\n      .join(' ')\n\n    return (\n      <div ref={ref} className={cn('inline-block', className)} {...props}>\n        <svg width={resolvedWidth} height={resolvedHeight} className=\"block\" role=\"img\" aria-hidden=\"true\">\n          <polyline\n            points={pts}\n            fill=\"none\"\n            stroke={color}\n            strokeWidth=\"1.6\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n          />\n        </svg>\n      </div>\n    )\n  }\n)\nSparkline.displayName = 'Sparkline'\n\nexport { Sparkline }\n"]}

package/dist/chunk-FGXOV2QH.js

@@ -0,0 +1,23 @@
+'use client';
+import { cn } from './chunk-WSQNPRGN.js';
+import { jsx } from 'react/jsx-runtime';
+
+function Skeleton({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "animate-pulse rounded-md bg-tollerud-noir-800",
+        className
+      ),
+      ...props
+    }
+  );
+}
+
+export { Skeleton };
+//# sourceMappingURL=chunk-FGXOV2QH.js.map
+//# sourceMappingURL=chunk-FGXOV2QH.js.map

package/dist/chunk-FGXOV2QH.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/Skeleton.tsx"],"names":[],"mappings":";;;AAEA,SAAS,QAAA,CAAS;AAAA,EAChB,SAAA;AAAA,EACA,GAAG;AACL,CAAA,EAAyC;AACvC,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,EAAA;AAAA,QACT,+CAAA;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG;AAAA;AAAA,GACN;AAEJ","file":"chunk-FGXOV2QH.js","sourcesContent":["import { cn } from '@/lib/utils'\n\nfunction Skeleton({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) {\n  return (\n    <div\n      className={cn(\n        'animate-pulse rounded-md bg-tollerud-noir-800',\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport { Skeleton }"]}

package/dist/chunk-G2VKWNZA.js

@@ -0,0 +1,53 @@
+'use client';
+import { StatusDot } from './chunk-NHPISZWS.js';
+import { cn } from './chunk-WSQNPRGN.js';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var DockerStackCard = forwardRef(
+  ({ className, name, services, composePath, loading, ...props }, ref) => {
+    const onlineCount = services.filter((s) => s.status === "online").length;
+    const degraded = services.some((s) => s.status === "offline" || s.status === "warning");
+    const status = services.every((s) => s.status === "online") ? "online" : degraded ? "warning" : "offline";
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          "rounded-lg border bg-tollerud-surface-raised p-4",
+          "transition-[border-color] duration-[150ms]",
+          status === "offline" && "border-tollerud-error/40",
+          status === "warning" && "border-tollerud-yellow/30",
+          status === "online" && "border-tollerud-border hover:border-tollerud-noir-500",
+          loading && "animate-pulse",
+          className
+        ),
+        ...props,
+        children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-3", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 min-w-0", children: [
+              /* @__PURE__ */ jsx(StatusDot, { status }),
+              /* @__PURE__ */ jsx("span", { className: "font-semibold text-sm text-tollerud-foreground truncate", children: name })
+            ] }),
+            /* @__PURE__ */ jsxs("span", { className: "text-xs text-tollerud-text-muted whitespace-nowrap ml-2", children: [
+              onlineCount,
+              "/",
+              services.length,
+              " healthy"
+            ] })
+          ] }),
+          composePath && /* @__PURE__ */ jsx("div", { className: "text-[11px] text-tollerud-text-muted font-mono mb-2 truncate", children: composePath }),
+          /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-1", children: services.map((svc) => /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between text-xs", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-tollerud-text-secondary truncate", children: svc.name }),
+            /* @__PURE__ */ jsx(StatusDot, { status: svc.status })
+          ] }, svc.name)) })
+        ]
+      }
+    );
+  }
+);
+DockerStackCard.displayName = "DockerStackCard";
+
+export { DockerStackCard };
+//# sourceMappingURL=chunk-G2VKWNZA.js.map
+//# sourceMappingURL=chunk-G2VKWNZA.js.map

package/dist/chunk-G2VKWNZA.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/DockerStackCard.tsx"],"names":[],"mappings":";;;;;AAoBA,IAAM,eAAA,GAAkB,UAAA;AAAA,EACtB,CAAC,EAAE,SAAA,EAAW,IAAA,EAAM,QAAA,EAAU,aAAa,OAAA,EAAS,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AACtE,IAAA,MAAM,WAAA,GAAc,SAAS,MAAA,CAAO,CAAC,MAAM,CAAA,CAAE,MAAA,KAAW,QAAQ,CAAA,CAAE,MAAA;AAClE,IAAA,MAAM,QAAA,GAAW,QAAA,CAAS,IAAA,CAAK,CAAC,CAAA,KAAM,EAAE,MAAA,KAAW,SAAA,IAAa,CAAA,CAAE,MAAA,KAAW,SAAS,CAAA;AACtF,IAAA,MAAM,MAAA,GAAiB,QAAA,CAAS,KAAA,CAAM,CAAC,CAAA,KAAM,CAAA,CAAE,MAAA,KAAW,QAAQ,CAAA,GAAI,QAAA,GAAW,QAAA,GAAW,SAAA,GAAY,SAAA;AAExG,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,EAAA;AAAA,UACT,kDAAA;AAAA,UACA,4CAAA;AAAA,UACA,WAAW,SAAA,IAAa,0BAAA;AAAA,UACxB,WAAW,SAAA,IAAa,2BAAA;AAAA,UACxB,WAAW,QAAA,IAAY,uDAAA;AAAA,UACvB,OAAA,IAAW,eAAA;AAAA,UACX;AAAA,SACF;AAAA,QACC,GAAG,KAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,wCAAA,EACb,QAAA,EAAA;AAAA,4BAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,iCAAA,EACb,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,aAAU,MAAA,EAAgB,CAAA;AAAA,8BAC3B,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,yDAAA,EACb,QAAA,EAAA,IAAA,EACH;AAAA,aAAA,EACF,CAAA;AAAA,4BACA,IAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,yDAAA,EACb,QAAA,EAAA;AAAA,cAAA,WAAA;AAAA,cAAY,GAAA;AAAA,cAAE,QAAA,CAAS,MAAA;AAAA,cAAO;AAAA,aAAA,EACjC;AAAA,WAAA,EACF,CAAA;AAAA,UACC,WAAA,oBACC,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,gEACZ,QAAA,EAAA,WAAA,EACH,CAAA;AAAA,0BAEF,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,qBAAA,EACZ,QAAA,EAAA,QAAA,CAAS,GAAA,CAAI,CAAC,GAAA,qBACb,IAAA,CAAC,KAAA,EAAA,EAAmB,SAAA,EAAU,2CAAA,EAC5B,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,uCAAA,EAAyC,QAAA,EAAA,GAAA,CAAI,IAAA,EAAK,CAAA;AAAA,4BAClE,GAAA,CAAC,SAAA,EAAA,EAAU,MAAA,EAAQ,GAAA,CAAI,MAAA,EAAQ;AAAA,WAAA,EAAA,EAFvB,GAAA,CAAI,IAGd,CACD,CAAA,EACH;AAAA;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;AACA,eAAA,CAAgB,WAAA,GAAc,iBAAA","file":"chunk-G2VKWNZA.js","sourcesContent":["import { type HTMLAttributes, forwardRef } from 'react'\nimport { cn } from '@/lib/utils'\nimport { StatusDot, type Status } from './StatusDot'\n\nexport interface StackService {\n  name: string\n  status: Status\n}\n\nexport interface DockerStackCardProps extends HTMLAttributes<HTMLDivElement> {\n  /** Stack name */\n  name: string\n  /** Services in the stack */\n  services: StackService[]\n  /** Path to compose file */\n  composePath?: string\n  /** Whether the card is loading */\n  loading?: boolean\n}\n\nconst DockerStackCard = forwardRef<HTMLDivElement, DockerStackCardProps>(\n  ({ className, name, services, composePath, loading, ...props }, ref) => {\n    const onlineCount = services.filter((s) => s.status === 'online').length\n    const degraded = services.some((s) => s.status === 'offline' || s.status === 'warning')\n    const status: Status = services.every((s) => s.status === 'online') ? 'online' : degraded ? 'warning' : 'offline'\n\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          'rounded-lg border bg-tollerud-surface-raised p-4',\n          'transition-[border-color] duration-[150ms]',\n          status === 'offline' && 'border-tollerud-error/40',\n          status === 'warning' && 'border-tollerud-yellow/30',\n          status === 'online' && 'border-tollerud-border hover:border-tollerud-noir-500',\n          loading && 'animate-pulse',\n          className\n        )}\n        {...props}\n      >\n        <div className=\"flex items-center justify-between mb-3\">\n          <div className=\"flex items-center gap-2 min-w-0\">\n            <StatusDot status={status} />\n            <span className=\"font-semibold text-sm text-tollerud-foreground truncate\">\n              {name}\n            </span>\n          </div>\n          <span className=\"text-xs text-tollerud-text-muted whitespace-nowrap ml-2\">\n            {onlineCount}/{services.length} healthy\n          </span>\n        </div>\n        {composePath && (\n          <div className=\"text-[11px] text-tollerud-text-muted font-mono mb-2 truncate\">\n            {composePath}\n          </div>\n        )}\n        <div className=\"flex flex-col gap-1\">\n          {services.map((svc) => (\n            <div key={svc.name} className=\"flex items-center justify-between text-xs\">\n              <span className=\"text-tollerud-text-secondary truncate\">{svc.name}</span>\n              <StatusDot status={svc.status} />\n            </div>\n          ))}\n        </div>\n      </div>\n    )\n  }\n)\nDockerStackCard.displayName = 'DockerStackCard'\n\nexport { DockerStackCard }\n"]}

package/dist/chunk-GTM2DE4C.js

@@ -0,0 +1,156 @@
+'use client';
+import { cn } from './chunk-WSQNPRGN.js';
+import { forwardRef, useState, useRef, useEffect, useCallback } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var Select = forwardRef(
+  ({ className, label, error, placeholder, options = [], value, onChange, ...props }, ref) => {
+    const [open, setOpen] = useState(false);
+    const [highlightedIdx, setHighlightedIdx] = useState(0);
+    const containerRef = useRef(null);
+    const listRef = useRef(null);
+    const selectedOption = options.find((o) => o.value === value);
+    useEffect(() => {
+      if (!open) return;
+      const handleClick = (e) => {
+        if (containerRef.current && !containerRef.current.contains(e.target)) {
+          setOpen(false);
+        }
+      };
+      document.addEventListener("mousedown", handleClick);
+      return () => document.removeEventListener("mousedown", handleClick);
+    }, [open]);
+    useEffect(() => {
+      if (open) {
+        const idx = value ? options.findIndex((o) => o.value === value) : -1;
+        setHighlightedIdx(idx >= 0 ? idx : 0);
+      }
+    }, [open, options, value]);
+    useEffect(() => {
+      if (open && listRef.current) {
+        const item = listRef.current.children[highlightedIdx];
+        item?.scrollIntoView({ block: "nearest" });
+      }
+    }, [open, highlightedIdx]);
+    const selectOption = useCallback(
+      (opt) => {
+        onChange?.(opt.value);
+        setOpen(false);
+      },
+      [onChange]
+    );
+    const handleKeyDown = (e) => {
+      if (!open) {
+        if (e.key === "Enter" || e.key === " " || e.key === "ArrowDown") {
+          e.preventDefault();
+          setOpen(true);
+        }
+        return;
+      }
+      switch (e.key) {
+        case "Escape":
+          e.preventDefault();
+          setOpen(false);
+          break;
+        case "ArrowDown":
+          e.preventDefault();
+          setHighlightedIdx((prev) => Math.min(prev + 1, options.length - 1));
+          break;
+        case "ArrowUp":
+          e.preventDefault();
+          setHighlightedIdx((prev) => Math.max(prev - 1, 0));
+          break;
+        case "Enter":
+          e.preventDefault();
+          if (options[highlightedIdx]) {
+            selectOption(options[highlightedIdx]);
+          }
+          break;
+      }
+    };
+    return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", ref, ...props, children: [
+      label && /* @__PURE__ */ jsx("label", { className: "text-xs font-medium text-tollerud-text-muted", children: label }),
+      /* @__PURE__ */ jsxs("div", { ref: containerRef, className: "relative", children: [
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            onClick: () => setOpen(!open),
+            onKeyDown: handleKeyDown,
+            "aria-haspopup": "listbox",
+            "aria-expanded": open,
+            className: cn(
+              "font-sans text-sm w-full flex items-center justify-between px-3 py-2.5 rounded-lg",
+              "bg-tollerud-surface-raised",
+              "text-tollerud-text-primary text-left",
+              "transition-all duration-150 ease-out cursor-pointer",
+              error ? "border-tollerud-error/70 focus:border-tollerud-error focus:shadow-[0_0_0_1px_#EF4444]" : "border-tollerud-border focus:border-tollerud-yellow focus:shadow-[0_0_0_1px_#E8D500]",
+              "border hover:border-tollerud-noir-400",
+              "focus:outline-none",
+              className
+            ),
+            children: [
+              /* @__PURE__ */ jsx("span", { className: cn(!selectedOption && "text-tollerud-text-muted"), children: selectedOption ? selectedOption.label : placeholder || "Select\u2026" }),
+              /* @__PURE__ */ jsx(
+                "svg",
+                {
+                  className: cn(
+                    "h-4 w-4 text-tollerud-text-muted transition-transform duration-150 flex-shrink-0",
+                    open && "rotate-180"
+                  ),
+                  fill: "none",
+                  viewBox: "0 0 24 24",
+                  stroke: "currentColor",
+                  strokeWidth: 2,
+                  "aria-hidden": "true",
+                  children: /* @__PURE__ */ jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M6 9l6 6 6-6" })
+                }
+              )
+            ]
+          }
+        ),
+        open && /* @__PURE__ */ jsxs(
+          "div",
+          {
+            ref: listRef,
+            role: "listbox",
+            className: cn(
+              "absolute z-10 left-0 right-0 mt-1 py-1",
+              "rounded-lg border border-tollerud-border bg-tollerud-surface-overlay",
+              "shadow-[0_8px_24px_rgba(0,0,0,0.4)]",
+              "max-h-60 overflow-y-auto"
+            ),
+            children: [
+              options.length === 0 && /* @__PURE__ */ jsx("div", { className: "px-3 py-2 text-xs text-tollerud-text-muted text-center", children: "No options" }),
+              options.map((opt, idx) => /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  role: "option",
+                  "aria-selected": opt.value === value,
+                  onClick: () => selectOption(opt),
+                  onMouseEnter: () => setHighlightedIdx(idx),
+                  className: cn(
+                    "w-full text-sm text-left px-3 py-2 transition-colors duration-75",
+                    "cursor-pointer",
+                    opt.value === value ? "text-tollerud-yellow" : "text-tollerud-text-primary",
+                    idx === highlightedIdx && !(opt.value === value) ? "bg-tollerud-noir-700" : "hover:bg-tollerud-noir-700/60",
+                    opt.value === value && highlightedIdx === idx && "bg-tollerud-noir-700"
+                  ),
+                  children: opt.label
+                },
+                opt.value
+              ))
+            ]
+          }
+        )
+      ] }),
+      error && /* @__PURE__ */ jsx("p", { className: "text-xs text-tollerud-error mt-0.5", children: error })
+    ] });
+  }
+);
+Select.displayName = "Select";
+
+export { Select };
+//# sourceMappingURL=chunk-GTM2DE4C.js.map
+//# sourceMappingURL=chunk-GTM2DE4C.js.map

package/dist/chunk-GTM2DE4C.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/Select.tsx"],"names":[],"mappings":"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","file":"chunk-GTM2DE4C.js","sourcesContent":["'use client'\n\nimport { type HTMLAttributes, forwardRef, useState, useRef, useEffect, useCallback } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport interface SelectOption {\n  value: string\n  label: string\n}\n\nexport interface SelectProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  label?: string\n  error?: string\n  placeholder?: string\n  options?: SelectOption[]\n  value?: string\n  onChange?: (value: string) => void\n}\n\nconst Select = forwardRef<HTMLDivElement, SelectProps>(\n  ({ className, label, error, placeholder, options = [], value, onChange, ...props }, ref) => {\n    const [open, setOpen] = useState(false)\n    const [highlightedIdx, setHighlightedIdx] = useState(0)\n    const containerRef = useRef<HTMLDivElement>(null)\n    const listRef = useRef<HTMLDivElement>(null)\n\n    const selectedOption = options.find((o) => o.value === value)\n\n    // Close on click outside\n    useEffect(() => {\n      if (!open) return\n      const handleClick = (e: MouseEvent) => {\n        if (containerRef.current && !containerRef.current.contains(e.target as Node)) {\n          setOpen(false)\n        }\n      }\n      document.addEventListener('mousedown', handleClick)\n      return () => document.removeEventListener('mousedown', handleClick)\n    }, [open])\n\n    // Reset highlight when opening\n    useEffect(() => {\n      if (open) {\n        const idx = value ? options.findIndex((o) => o.value === value) : -1\n        setHighlightedIdx(idx >= 0 ? idx : 0)\n      }\n    }, [open, options, value])\n\n    // Scroll highlighted option into view\n    useEffect(() => {\n      if (open && listRef.current) {\n        const item = listRef.current.children[highlightedIdx] as HTMLElement | undefined\n        item?.scrollIntoView({ block: 'nearest' })\n      }\n    }, [open, highlightedIdx])\n\n    const selectOption = useCallback(\n      (opt: SelectOption) => {\n        onChange?.(opt.value)\n        setOpen(false)\n      },\n      [onChange]\n    )\n\n    const handleKeyDown = (e: React.KeyboardEvent) => {\n      if (!open) {\n        if (e.key === 'Enter' || e.key === ' ' || e.key === 'ArrowDown') {\n          e.preventDefault()\n          setOpen(true)\n        }\n        return\n      }\n\n      switch (e.key) {\n        case 'Escape':\n          e.preventDefault()\n          setOpen(false)\n          break\n        case 'ArrowDown':\n          e.preventDefault()\n          setHighlightedIdx((prev) => Math.min(prev + 1, options.length - 1))\n          break\n        case 'ArrowUp':\n          e.preventDefault()\n          setHighlightedIdx((prev) => Math.max(prev - 1, 0))\n          break\n        case 'Enter':\n          e.preventDefault()\n          if (options[highlightedIdx]) {\n            selectOption(options[highlightedIdx])\n          }\n          break\n      }\n    }\n\n    return (\n      <div className=\"flex flex-col gap-1.5\" ref={ref} {...props}>\n        {label && (\n          <label className=\"text-xs font-medium text-tollerud-text-muted\">\n            {label}\n          </label>\n        )}\n        <div ref={containerRef} className=\"relative\">\n          {/* Trigger */}\n          <button\n            type=\"button\"\n            onClick={() => setOpen(!open)}\n            onKeyDown={handleKeyDown}\n            aria-haspopup=\"listbox\"\n            aria-expanded={open}\n            className={cn(\n              'font-sans text-sm w-full flex items-center justify-between px-3 py-2.5 rounded-lg',\n              'bg-tollerud-surface-raised',\n              'text-tollerud-text-primary text-left',\n              'transition-all duration-150 ease-out cursor-pointer',\n              error\n                ? 'border-tollerud-error/70 focus:border-tollerud-error focus:shadow-[0_0_0_1px_#EF4444]'\n                : 'border-tollerud-border focus:border-tollerud-yellow focus:shadow-[0_0_0_1px_#E8D500]',\n              'border hover:border-tollerud-noir-400',\n              'focus:outline-none',\n              className\n            )}\n          >\n            <span className={cn(!selectedOption && 'text-tollerud-text-muted')}>\n              {selectedOption ? selectedOption.label : placeholder || 'Select…'}\n            </span>\n            <svg\n              className={cn(\n                'h-4 w-4 text-tollerud-text-muted transition-transform duration-150 flex-shrink-0',\n                open && 'rotate-180'\n              )}\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n              stroke=\"currentColor\"\n              strokeWidth={2}\n              aria-hidden=\"true\"\n            >\n              <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M6 9l6 6 6-6\" />\n            </svg>\n          </button>\n\n          {/* Dropdown */}\n          {open && (\n            <div\n              ref={listRef}\n              role=\"listbox\"\n              className={cn(\n                'absolute z-10 left-0 right-0 mt-1 py-1',\n                'rounded-lg border border-tollerud-border bg-tollerud-surface-overlay',\n                'shadow-[0_8px_24px_rgba(0,0,0,0.4)]',\n                'max-h-60 overflow-y-auto'\n              )}\n            >\n              {options.length === 0 && (\n                <div className=\"px-3 py-2 text-xs text-tollerud-text-muted text-center\">\n                  No options\n                </div>\n              )}\n              {options.map((opt, idx) => (\n                <button\n                  key={opt.value}\n                  type=\"button\"\n                  role=\"option\"\n                  aria-selected={opt.value === value}\n                  onClick={() => selectOption(opt)}\n                  onMouseEnter={() => setHighlightedIdx(idx)}\n                  className={cn(\n                    'w-full text-sm text-left px-3 py-2 transition-colors duration-75',\n                    'cursor-pointer',\n                    opt.value === value\n                      ? 'text-tollerud-yellow'\n                      : 'text-tollerud-text-primary',\n                    idx === highlightedIdx && !(opt.value === value)\n                      ? 'bg-tollerud-noir-700'\n                      : 'hover:bg-tollerud-noir-700/60',\n                    opt.value === value && highlightedIdx === idx && 'bg-tollerud-noir-700'\n                  )}\n                >\n                  {opt.label}\n                </button>\n              ))}\n            </div>\n          )}\n        </div>\n        {error && (\n          <p className=\"text-xs text-tollerud-error mt-0.5\">{error}</p>\n        )}\n      </div>\n    )\n  }\n)\nSelect.displayName = 'Select'\n\nexport { Select }"]}

package/dist/chunk-H3ZVGTJM.js

@@ -0,0 +1,165 @@
+'use client';
+import { cn } from './chunk-WSQNPRGN.js';
+import { useId, useRef, useState, useMemo, useEffect } from 'react';
+import { ChevronDown, Check } from 'lucide-react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var defaultFilter = (option, query) => option.label.toLowerCase().includes(query.toLowerCase());
+function Combobox({
+  options,
+  value: valueProp,
+  defaultValue,
+  onChange,
+  placeholder = "Search\u2026",
+  label,
+  error,
+  filter = defaultFilter,
+  className,
+  disabled
+}) {
+  const id = useId();
+  const rootRef = useRef(null);
+  const isControlled = valueProp !== void 0;
+  const [internalValue, setInternalValue] = useState(defaultValue);
+  const value = isControlled ? valueProp : internalValue;
+  const [open, setOpen] = useState(false);
+  const [query, setQuery] = useState("");
+  const [activeIndex, setActiveIndex] = useState(0);
+  const selected = options.find((o) => o.value === value);
+  const filtered = useMemo(() => {
+    if (!query) return options;
+    return options.filter((o) => filter(o, query));
+  }, [options, query, filter]);
+  useEffect(() => {
+    if (!open) return;
+    function onClickOutside(e) {
+      if (rootRef.current && !rootRef.current.contains(e.target)) {
+        setOpen(false);
+        setQuery("");
+      }
+    }
+    function onResize() {
+      setOpen(false);
+      setQuery("");
+    }
+    document.addEventListener("mousedown", onClickOutside);
+    window.addEventListener("resize", onResize);
+    return () => {
+      document.removeEventListener("mousedown", onClickOutside);
+      window.removeEventListener("resize", onResize);
+    };
+  }, [open]);
+  const commit = (option) => {
+    if (option.disabled) return;
+    if (!isControlled) setInternalValue(option.value);
+    onChange?.(option.value);
+    setOpen(false);
+    setQuery("");
+  };
+  const onKeyDown = (e) => {
+    if (e.key === "ArrowDown") {
+      e.preventDefault();
+      setOpen(true);
+      setActiveIndex((i) => Math.min(i + 1, filtered.length - 1));
+    } else if (e.key === "ArrowUp") {
+      e.preventDefault();
+      setActiveIndex((i) => Math.max(i - 1, 0));
+    } else if (e.key === "Enter") {
+      e.preventDefault();
+      const opt = filtered[activeIndex];
+      if (opt) commit(opt);
+    } else if (e.key === "Escape") {
+      setOpen(false);
+      setQuery("");
+    }
+  };
+  return /* @__PURE__ */ jsxs("div", { ref: rootRef, className: cn("relative flex flex-col gap-1", className), children: [
+    label && /* @__PURE__ */ jsx("label", { htmlFor: id, className: "text-xs font-medium text-tollerud-text-muted", children: label }),
+    /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          id,
+          role: "combobox",
+          "aria-expanded": open,
+          "aria-autocomplete": "list",
+          "aria-controls": `${id}-listbox`,
+          disabled,
+          value: open ? query : selected?.label ?? "",
+          placeholder: selected ? selected.label : placeholder,
+          onFocus: () => {
+            setOpen(true);
+            setActiveIndex(0);
+          },
+          onChange: (e) => {
+            setQuery(e.target.value);
+            setActiveIndex(0);
+            if (!open) setOpen(true);
+          },
+          onKeyDown,
+          className: cn(
+            "w-full font-sans text-base px-3 py-2 pr-9 rounded",
+            "bg-tollerud-surface-raised border",
+            "text-tollerud-text-primary placeholder:text-tollerud-text-muted",
+            "transition-[border-color] duration-[150ms]",
+            "focus:outline-none focus:border-tollerud-yellow focus:shadow-[0_0_0_1px_#E8D500]",
+            error ? "border-tollerud-error" : "border-tollerud-border",
+            disabled && "opacity-50 pointer-events-none"
+          )
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        ChevronDown,
+        {
+          size: 15,
+          className: cn(
+            "pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 text-tollerud-text-muted transition-transform duration-[150ms]",
+            open && "rotate-180"
+          )
+        }
+      )
+    ] }),
+    open && /* @__PURE__ */ jsxs(
+      "ul",
+      {
+        id: `${id}-listbox`,
+        role: "listbox",
+        className: "absolute top-full z-20 mt-1 max-h-64 w-full overflow-auto rounded-lg border border-tollerud-border bg-tollerud-surface-overlay py-1 shadow-lg",
+        children: [
+          filtered.length === 0 && /* @__PURE__ */ jsx("li", { className: "px-3 py-2 text-sm text-tollerud-text-muted", children: "No results" }),
+          filtered.map((option, i) => {
+            const isSelected = option.value === value;
+            return /* @__PURE__ */ jsxs(
+              "li",
+              {
+                role: "option",
+                "aria-selected": isSelected,
+                onMouseDown: (e) => {
+                  e.preventDefault();
+                  commit(option);
+                },
+                onMouseEnter: () => setActiveIndex(i),
+                className: cn(
+                  "flex items-center justify-between gap-2 px-3 py-2 text-sm cursor-pointer",
+                  i === activeIndex ? "bg-tollerud-surface-hover text-tollerud-text-primary" : "text-tollerud-text-secondary",
+                  option.disabled && "opacity-40 pointer-events-none"
+                ),
+                children: [
+                  option.label,
+                  isSelected && /* @__PURE__ */ jsx(Check, { size: 14, className: "text-tollerud-yellow" })
+                ]
+              },
+              option.value
+            );
+          })
+        ]
+      }
+    ),
+    error && /* @__PURE__ */ jsx("p", { className: "text-xs text-tollerud-error mt-0.5", children: error })
+  ] });
+}
+Combobox.displayName = "Combobox";
+
+export { Combobox };
+//# sourceMappingURL=chunk-H3ZVGTJM.js.map
+//# sourceMappingURL=chunk-H3ZVGTJM.js.map

package/dist/chunk-H3ZVGTJM.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/Combobox.tsx"],"names":[],"mappings":"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","file":"chunk-H3ZVGTJM.js","sourcesContent":["'use client'\n\nimport { useEffect, useId, useMemo, useRef, useState } from 'react'\nimport { Check, ChevronDown } from 'lucide-react'\nimport { cn } from '@/lib/utils'\n\nexport interface ComboboxOption {\n  value: string\n  label: string\n  disabled?: boolean\n}\n\nexport interface ComboboxProps {\n  options: ComboboxOption[]\n  value?: string\n  defaultValue?: string\n  onChange?: (value: string) => void\n  placeholder?: string\n  label?: string\n  error?: string\n  /** Filter predicate, defaults to a case-insensitive substring match on the label */\n  filter?: (option: ComboboxOption, query: string) => boolean\n  className?: string\n  disabled?: boolean\n}\n\nconst defaultFilter = (option: ComboboxOption, query: string) =>\n  option.label.toLowerCase().includes(query.toLowerCase())\n\nfunction Combobox({\n  options,\n  value: valueProp,\n  defaultValue,\n  onChange,\n  placeholder = 'Search…',\n  label,\n  error,\n  filter = defaultFilter,\n  className,\n  disabled,\n}: ComboboxProps) {\n  const id = useId()\n  const rootRef = useRef<HTMLDivElement>(null)\n  const isControlled = valueProp !== undefined\n  const [internalValue, setInternalValue] = useState(defaultValue)\n  const value = isControlled ? valueProp : internalValue\n\n  const [open, setOpen] = useState(false)\n  const [query, setQuery] = useState('')\n  const [activeIndex, setActiveIndex] = useState(0)\n\n  const selected = options.find((o) => o.value === value)\n\n  const filtered = useMemo(() => {\n    if (!query) return options\n    return options.filter((o) => filter(o, query))\n  }, [options, query, filter])\n\n  useEffect(() => {\n    if (!open) return\n    function onClickOutside(e: MouseEvent) {\n      if (rootRef.current && !rootRef.current.contains(e.target as Node)) {\n        setOpen(false)\n        setQuery('')\n      }\n    }\n    function onResize() {\n      setOpen(false)\n      setQuery('')\n    }\n    document.addEventListener('mousedown', onClickOutside)\n    window.addEventListener('resize', onResize)\n    return () => {\n      document.removeEventListener('mousedown', onClickOutside)\n      window.removeEventListener('resize', onResize)\n    }\n  }, [open])\n\n  const commit = (option: ComboboxOption) => {\n    if (option.disabled) return\n    if (!isControlled) setInternalValue(option.value)\n    onChange?.(option.value)\n    setOpen(false)\n    setQuery('')\n  }\n\n  const onKeyDown = (e: React.KeyboardEvent) => {\n    if (e.key === 'ArrowDown') {\n      e.preventDefault()\n      setOpen(true)\n      setActiveIndex((i) => Math.min(i + 1, filtered.length - 1))\n    } else if (e.key === 'ArrowUp') {\n      e.preventDefault()\n      setActiveIndex((i) => Math.max(i - 1, 0))\n    } else if (e.key === 'Enter') {\n      e.preventDefault()\n      const opt = filtered[activeIndex]\n      if (opt) commit(opt)\n    } else if (e.key === 'Escape') {\n      setOpen(false)\n      setQuery('')\n    }\n  }\n\n  return (\n    <div ref={rootRef} className={cn('relative flex flex-col gap-1', className)}>\n      {label && (\n        <label htmlFor={id} className=\"text-xs font-medium text-tollerud-text-muted\">\n          {label}\n        </label>\n      )}\n      <div className=\"relative\">\n        <input\n          id={id}\n          role=\"combobox\"\n          aria-expanded={open}\n          aria-autocomplete=\"list\"\n          aria-controls={`${id}-listbox`}\n          disabled={disabled}\n          value={open ? query : selected?.label ?? ''}\n          placeholder={selected ? selected.label : placeholder}\n          onFocus={() => {\n            setOpen(true)\n            setActiveIndex(0)\n          }}\n          onChange={(e) => {\n            setQuery(e.target.value)\n            setActiveIndex(0)\n            if (!open) setOpen(true)\n          }}\n          onKeyDown={onKeyDown}\n          className={cn(\n            'w-full font-sans text-base px-3 py-2 pr-9 rounded',\n            'bg-tollerud-surface-raised border',\n            'text-tollerud-text-primary placeholder:text-tollerud-text-muted',\n            'transition-[border-color] duration-[150ms]',\n            'focus:outline-none focus:border-tollerud-yellow focus:shadow-[0_0_0_1px_#E8D500]',\n            error ? 'border-tollerud-error' : 'border-tollerud-border',\n            disabled && 'opacity-50 pointer-events-none'\n          )}\n        />\n        <ChevronDown\n          size={15}\n          className={cn(\n            'pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 text-tollerud-text-muted transition-transform duration-[150ms]',\n            open && 'rotate-180'\n          )}\n        />\n      </div>\n\n      {open && (\n        <ul\n          id={`${id}-listbox`}\n          role=\"listbox\"\n          className=\"absolute top-full z-20 mt-1 max-h-64 w-full overflow-auto rounded-lg border border-tollerud-border bg-tollerud-surface-overlay py-1 shadow-lg\"\n        >\n          {filtered.length === 0 && (\n            <li className=\"px-3 py-2 text-sm text-tollerud-text-muted\">No results</li>\n          )}\n          {filtered.map((option, i) => {\n            const isSelected = option.value === value\n            return (\n              <li\n                key={option.value}\n                role=\"option\"\n                aria-selected={isSelected}\n                onMouseDown={(e) => {\n                  e.preventDefault()\n                  commit(option)\n                }}\n                onMouseEnter={() => setActiveIndex(i)}\n                className={cn(\n                  'flex items-center justify-between gap-2 px-3 py-2 text-sm cursor-pointer',\n                  i === activeIndex ? 'bg-tollerud-surface-hover text-tollerud-text-primary' : 'text-tollerud-text-secondary',\n                  option.disabled && 'opacity-40 pointer-events-none'\n                )}\n              >\n                {option.label}\n                {isSelected && <Check size={14} className=\"text-tollerud-yellow\" />}\n              </li>\n            )\n          })}\n        </ul>\n      )}\n\n      {error && <p className=\"text-xs text-tollerud-error mt-0.5\">{error}</p>}\n    </div>\n  )\n}\nCombobox.displayName = 'Combobox'\n\nexport { Combobox }\n"]}

package/dist/chunk-HWAWUEHC.js

@@ -0,0 +1,28 @@
+'use client';
+import { cn } from './chunk-WSQNPRGN.js';
+import { forwardRef } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+var Kbd = forwardRef(
+  ({ className, keys, size = "md", ...props }, ref) => {
+    const keyArray = typeof keys === "string" ? [keys] : keys;
+    return /* @__PURE__ */ jsx(
+      "span",
+      {
+        ref,
+        className: cn(
+          "tollerud-kbd",
+          size === "sm" && "tollerud-kbd--sm",
+          className
+        ),
+        ...props,
+        children: keyArray.map((key, i) => /* @__PURE__ */ jsx("span", { className: "tollerud-kbd__key", children: key }, i))
+      }
+    );
+  }
+);
+Kbd.displayName = "Kbd";
+
+export { Kbd };
+//# sourceMappingURL=chunk-HWAWUEHC.js.map
+//# sourceMappingURL=chunk-HWAWUEHC.js.map

package/dist/chunk-HWAWUEHC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/Kbd.tsx"],"names":[],"mappings":";;;;AAwBA,IAAM,GAAA,GAAM,UAAA;AAAA,EACV,CAAC,EAAE,SAAA,EAAW,IAAA,EAAM,OAAO,IAAA,EAAM,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AACnD,IAAA,MAAM,WAAW,OAAO,IAAA,KAAS,QAAA,GAAW,CAAC,IAAI,CAAA,GAAI,IAAA;AAErD,IAAA,uBACE,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,EAAA;AAAA,UACT,cAAA;AAAA,UACA,SAAS,IAAA,IAAQ,kBAAA;AAAA,UACjB;AAAA,SACF;AAAA,QACC,GAAG,KAAA;AAAA,QAEH,QAAA,EAAA,QAAA,CAAS,GAAA,CAAI,CAAC,GAAA,EAAK,CAAA,qBAClB,GAAA,CAAC,MAAA,EAAA,EAAa,SAAA,EAAU,mBAAA,EACrB,QAAA,EAAA,GAAA,EAAA,EADQ,CAEX,CACD;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;AACA,GAAA,CAAI,WAAA,GAAc,KAAA","file":"chunk-HWAWUEHC.js","sourcesContent":["\"use client\"\n\nimport { type HTMLAttributes, forwardRef } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport interface KbdProps extends HTMLAttributes<HTMLSpanElement> {\n  /**\n   * The keys to display. Separate by + for chords.\n   * @example \"⌘K\", \"⌘⇧S\", \"⌘K\", \"Esc\"\n   */\n  keys: string | string[]\n  /** Small variant for inline use */\n  size?: 'sm' | 'md'\n}\n\n/**\n * Keyboard shortcut chip — inspired by Raycast shortcut badges.\n *\n * ```tsx\n * <Kbd keys=\"⌘K\" />\n * <Kbd keys={[\"⌘\", \"⇧\", \"S\"]} />\n * <Kbd keys=\"Esc\" size=\"sm\" />\n * ```\n */\nconst Kbd = forwardRef<HTMLSpanElement, KbdProps>(\n  ({ className, keys, size = 'md', ...props }, ref) => {\n    const keyArray = typeof keys === 'string' ? [keys] : keys\n\n    return (\n      <span\n        ref={ref}\n        className={cn(\n          'tollerud-kbd',\n          size === 'sm' && 'tollerud-kbd--sm',\n          className\n        )}\n        {...props}\n      >\n        {keyArray.map((key, i) => (\n          <span key={i} className=\"tollerud-kbd__key\">\n            {key}\n          </span>\n        ))}\n      </span>\n    )\n  }\n)\nKbd.displayName = 'Kbd'\n\nexport { Kbd }"]}