@tollerud/ui 1.1.4 → 3.0.0

package/dist/chunk-NOLWJJHT.js

@@ -0,0 +1,52 @@
+'use client';
+import { cn } from './chunk-WSQNPRGN.js';
+import { forwardRef, useState } from 'react';
+import { EyeOff, Eye } from 'lucide-react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var PasswordInput = forwardRef(
+  ({ className, label, error, id, ...props }, ref) => {
+    const [visible, setVisible] = useState(false);
+    return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1", 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",
+          {
+            ref,
+            id,
+            type: visible ? "text" : "password",
+            className: cn(
+              "w-full font-sans text-base px-3 py-2 pr-10 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",
+              className
+            ),
+            ...props
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            onClick: () => setVisible((v) => !v),
+            "aria-label": visible ? "Hide password" : "Show password",
+            "aria-pressed": visible,
+            className: "absolute right-2.5 top-1/2 -translate-y-1/2 text-tollerud-text-muted hover:text-tollerud-text-secondary transition-colors duration-[150ms]",
+            children: visible ? /* @__PURE__ */ jsx(EyeOff, { size: 16 }) : /* @__PURE__ */ jsx(Eye, { size: 16 })
+          }
+        )
+      ] }),
+      error && /* @__PURE__ */ jsx("p", { className: "text-xs text-tollerud-error mt-0.5", children: error })
+    ] });
+  }
+);
+PasswordInput.displayName = "PasswordInput";
+
+export { PasswordInput };
+//# sourceMappingURL=chunk-NOLWJJHT.js.map
+//# sourceMappingURL=chunk-NOLWJJHT.js.map

package/dist/chunk-NOLWJJHT.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/PasswordInput.tsx"],"names":[],"mappings":";;;;;AAWA,IAAM,aAAA,GAAgB,UAAA;AAAA,EACpB,CAAC,EAAE,SAAA,EAAW,KAAA,EAAO,OAAO,EAAA,EAAI,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AAClD,IAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAI,SAAS,KAAK,CAAA;AAE5C,IAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,qBAAA,EACZ,QAAA,EAAA;AAAA,MAAA,KAAA,wBACE,OAAA,EAAA,EAAM,OAAA,EAAS,EAAA,EAAI,SAAA,EAAU,gDAC3B,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,sBAEF,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,UAAA,EACb,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,OAAA;AAAA,UAAA;AAAA,YACC,GAAA;AAAA,YACA,EAAA;AAAA,YACA,IAAA,EAAM,UAAU,MAAA,GAAS,UAAA;AAAA,YACzB,SAAA,EAAW,EAAA;AAAA,cACT,oDAAA;AAAA,cACA,mCAAA;AAAA,cACA,4BAAA;AAAA,cACA,sCAAA;AAAA,cACA,4CAAA;AAAA,cACA,kFAAA;AAAA,cACA,QAAQ,uBAAA,GAA0B,wBAAA;AAAA,cAClC;AAAA,aACF;AAAA,YACC,GAAG;AAAA;AAAA,SACN;AAAA,wBACA,GAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACC,IAAA,EAAK,QAAA;AAAA,YACL,SAAS,MAAM,UAAA,CAAW,CAAC,CAAA,KAAM,CAAC,CAAC,CAAA;AAAA,YACnC,YAAA,EAAY,UAAU,eAAA,GAAkB,eAAA;AAAA,YACxC,cAAA,EAAc,OAAA;AAAA,YACd,SAAA,EAAU,4IAAA;AAAA,YAET,QAAA,EAAA,OAAA,uBAAW,MAAA,EAAA,EAAO,IAAA,EAAM,IAAI,CAAA,mBAAK,GAAA,CAAC,GAAA,EAAA,EAAI,IAAA,EAAM,EAAA,EAAI;AAAA;AAAA;AACnD,OAAA,EACF,CAAA;AAAA,MACC,KAAA,oBAAS,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,sCAAsC,QAAA,EAAA,KAAA,EAAM;AAAA,KAAA,EACrE,CAAA;AAAA,EAEJ;AACF;AACA,aAAA,CAAc,WAAA,GAAc,eAAA","file":"chunk-NOLWJJHT.js","sourcesContent":["'use client'\n\nimport { type InputHTMLAttributes, forwardRef, useState } from 'react'\nimport { Eye, EyeOff } from 'lucide-react'\nimport { cn } from '@/lib/utils'\n\nexport interface PasswordInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {\n  label?: string\n  error?: string\n}\n\nconst PasswordInput = forwardRef<HTMLInputElement, PasswordInputProps>(\n  ({ className, label, error, id, ...props }, ref) => {\n    const [visible, setVisible] = useState(false)\n\n    return (\n      <div className=\"flex flex-col gap-1\">\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            ref={ref}\n            id={id}\n            type={visible ? 'text' : 'password'}\n            className={cn(\n              'w-full font-sans text-base px-3 py-2 pr-10 rounded',\n              'bg-tollerud-surface-raised border',\n              'text-tollerud-text-primary',\n              '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              className\n            )}\n            {...props}\n          />\n          <button\n            type=\"button\"\n            onClick={() => setVisible((v) => !v)}\n            aria-label={visible ? 'Hide password' : 'Show password'}\n            aria-pressed={visible}\n            className=\"absolute right-2.5 top-1/2 -translate-y-1/2 text-tollerud-text-muted hover:text-tollerud-text-secondary transition-colors duration-[150ms]\"\n          >\n            {visible ? <EyeOff size={16} /> : <Eye size={16} />}\n          </button>\n        </div>\n        {error && <p className=\"text-xs text-tollerud-error mt-0.5\">{error}</p>}\n      </div>\n    )\n  }\n)\nPasswordInput.displayName = 'PasswordInput'\n\nexport { PasswordInput }\n"]}

package/dist/chunk-NPVINX3Q.js

@@ -0,0 +1,20 @@
+'use client';
+import { Card } from './chunk-DZOBXK2S.js';
+import { cn } from './chunk-WSQNPRGN.js';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var FeatureCard = forwardRef(
+  ({ className, icon, title, description, ...props }, ref) => {
+    return /* @__PURE__ */ jsxs(Card, { ref, className: cn("p-5", className), ...props, children: [
+      icon && /* @__PURE__ */ jsx("span", { className: "mb-3.5 inline-flex h-[38px] w-[38px] items-center justify-center rounded-[9px] bg-tollerud-yellow/12 text-tollerud-yellow", children: icon }),
+      /* @__PURE__ */ jsx("div", { className: "mb-1.5 text-base font-semibold text-tollerud-text-primary", children: title }),
+      /* @__PURE__ */ jsx("p", { className: "m-0 text-[13.5px] leading-snug text-tollerud-text-secondary", children: description })
+    ] });
+  }
+);
+FeatureCard.displayName = "FeatureCard";
+
+export { FeatureCard };
+//# sourceMappingURL=chunk-NPVINX3Q.js.map
+//# sourceMappingURL=chunk-NPVINX3Q.js.map

package/dist/chunk-NPVINX3Q.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/FeatureCard.tsx"],"names":[],"mappings":";;;;;AAUA,IAAM,WAAA,GAAc,UAAA;AAAA,EAClB,CAAC,EAAE,SAAA,EAAW,IAAA,EAAM,OAAO,WAAA,EAAa,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AAC1D,IAAA,uBACE,IAAA,CAAC,QAAK,GAAA,EAAU,SAAA,EAAW,GAAG,KAAA,EAAO,SAAS,CAAA,EAAI,GAAG,KAAA,EAClD,QAAA,EAAA;AAAA,MAAA,IAAA,oBACC,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,2HAAA,EACb,QAAA,EAAA,IAAA,EACH,CAAA;AAAA,sBAEF,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,2DAAA,EAA6D,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,sBAClF,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,6DAAA,EACV,QAAA,EAAA,WAAA,EACH;AAAA,KAAA,EACF,CAAA;AAAA,EAEJ;AACF;AACA,WAAA,CAAY,WAAA,GAAc,aAAA","file":"chunk-NPVINX3Q.js","sourcesContent":["import { type HTMLAttributes, forwardRef } from 'react'\nimport { cn } from '@/lib/utils'\nimport { Card } from './Card'\n\nexport interface FeatureCardProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {\n  icon?: React.ReactNode\n  title: React.ReactNode\n  description: React.ReactNode\n}\n\nconst FeatureCard = forwardRef<HTMLDivElement, FeatureCardProps>(\n  ({ className, icon, title, description, ...props }, ref) => {\n    return (\n      <Card ref={ref} className={cn('p-5', className)} {...props}>\n        {icon && (\n          <span className=\"mb-3.5 inline-flex h-[38px] w-[38px] items-center justify-center rounded-[9px] bg-tollerud-yellow/12 text-tollerud-yellow\">\n            {icon}\n          </span>\n        )}\n        <div className=\"mb-1.5 text-base font-semibold text-tollerud-text-primary\">{title}</div>\n        <p className=\"m-0 text-[13.5px] leading-snug text-tollerud-text-secondary\">\n          {description}\n        </p>\n      </Card>\n    )\n  }\n)\nFeatureCard.displayName = 'FeatureCard'\n\nexport { FeatureCard }\n"]}

package/dist/chunk-NSMU66ZX.js

@@ -0,0 +1,47 @@
+'use client';
+import { cn } from './chunk-WSQNPRGN.js';
+import { forwardRef } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+var Segmented = forwardRef(
+  ({ className, options, value, onChange, size = "md", ...props }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref,
+        role: "radiogroup",
+        className: cn(
+          "inline-flex items-center gap-0.5 rounded-lg p-1 bg-tollerud-surface-raised border border-tollerud-border",
+          className
+        ),
+        ...props,
+        children: options.map((opt) => {
+          const active = opt.value === value;
+          return /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              role: "radio",
+              "aria-checked": active,
+              disabled: opt.disabled,
+              onClick: () => !opt.disabled && onChange(opt.value),
+              className: cn(
+                "rounded-md font-medium transition-colors duration-[150ms]",
+                size === "sm" ? "px-2.5 py-1 text-xs" : "px-3.5 py-1.5 text-sm",
+                active ? "bg-tollerud-yellow text-tollerud-noir-black" : "text-tollerud-text-secondary hover:text-tollerud-text-primary",
+                opt.disabled && "opacity-40 pointer-events-none"
+              ),
+              children: opt.label
+            },
+            opt.value
+          );
+        })
+      }
+    );
+  }
+);
+Segmented.displayName = "Segmented";
+
+export { Segmented };
+//# sourceMappingURL=chunk-NSMU66ZX.js.map
+//# sourceMappingURL=chunk-NSMU66ZX.js.map

package/dist/chunk-NSMU66ZX.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/Segmented.tsx"],"names":[],"mappings":";;;;AAgBA,IAAM,SAAA,GAAY,UAAA;AAAA,EAChB,CAAC,EAAE,SAAA,EAAW,OAAA,EAAS,KAAA,EAAO,QAAA,EAAU,IAAA,GAAO,IAAA,EAAM,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AACvE,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,IAAA,EAAK,YAAA;AAAA,QACL,SAAA,EAAW,EAAA;AAAA,UACT,0GAAA;AAAA,UACA;AAAA,SACF;AAAA,QACC,GAAG,KAAA;AAAA,QAEH,QAAA,EAAA,OAAA,CAAQ,GAAA,CAAI,CAAC,GAAA,KAAQ;AACpB,UAAA,MAAM,MAAA,GAAS,IAAI,KAAA,KAAU,KAAA;AAC7B,UAAA,uBACE,GAAA;AAAA,YAAC,QAAA;AAAA,YAAA;AAAA,cAEC,IAAA,EAAK,QAAA;AAAA,cACL,IAAA,EAAK,OAAA;AAAA,cACL,cAAA,EAAc,MAAA;AAAA,cACd,UAAU,GAAA,CAAI,QAAA;AAAA,cACd,SAAS,MAAM,CAAC,IAAI,QAAA,IAAY,QAAA,CAAS,IAAI,KAAK,CAAA;AAAA,cAClD,SAAA,EAAW,EAAA;AAAA,gBACT,2DAAA;AAAA,gBACA,IAAA,KAAS,OAAO,qBAAA,GAAwB,uBAAA;AAAA,gBACxC,SACI,6CAAA,GACA,+DAAA;AAAA,gBACJ,IAAI,QAAA,IAAY;AAAA,eAClB;AAAA,cAEC,QAAA,EAAA,GAAA,CAAI;AAAA,aAAA;AAAA,YAfA,GAAA,CAAI;AAAA,WAgBX;AAAA,QAEJ,CAAC;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;AACA,SAAA,CAAU,WAAA,GAAc,WAAA","file":"chunk-NSMU66ZX.js","sourcesContent":["import { type HTMLAttributes, forwardRef } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport interface SegmentedOption {\n  value: string\n  label: React.ReactNode\n  disabled?: boolean\n}\n\nexport interface SegmentedProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  options: SegmentedOption[]\n  value: string\n  onChange: (value: string) => void\n  size?: 'sm' | 'md'\n}\n\nconst Segmented = forwardRef<HTMLDivElement, SegmentedProps>(\n  ({ className, options, value, onChange, size = 'md', ...props }, ref) => {\n    return (\n      <div\n        ref={ref}\n        role=\"radiogroup\"\n        className={cn(\n          'inline-flex items-center gap-0.5 rounded-lg p-1 bg-tollerud-surface-raised border border-tollerud-border',\n          className\n        )}\n        {...props}\n      >\n        {options.map((opt) => {\n          const active = opt.value === value\n          return (\n            <button\n              key={opt.value}\n              type=\"button\"\n              role=\"radio\"\n              aria-checked={active}\n              disabled={opt.disabled}\n              onClick={() => !opt.disabled && onChange(opt.value)}\n              className={cn(\n                'rounded-md font-medium transition-colors duration-[150ms]',\n                size === 'sm' ? 'px-2.5 py-1 text-xs' : 'px-3.5 py-1.5 text-sm',\n                active\n                  ? 'bg-tollerud-yellow text-tollerud-noir-black'\n                  : 'text-tollerud-text-secondary hover:text-tollerud-text-primary',\n                opt.disabled && 'opacity-40 pointer-events-none'\n              )}\n            >\n              {opt.label}\n            </button>\n          )\n        })}\n      </div>\n    )\n  }\n)\nSegmented.displayName = 'Segmented'\n\nexport { Segmented }\n"]}

package/dist/chunk-O57QMLNI.js

@@ -0,0 +1,68 @@
+'use client';
+import { cn } from './chunk-WSQNPRGN.js';
+import { forwardRef, useId } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var Switch = forwardRef(
+  ({ className, label, id: idProp, checked, ...props }, ref) => {
+    const autoId = useId();
+    const id = idProp ?? autoId;
+    return /* @__PURE__ */ jsxs(
+      "label",
+      {
+        htmlFor: id,
+        className: cn(
+          "inline-flex items-center gap-2.5 cursor-pointer select-none group",
+          "text-sm text-tollerud-text-primary",
+          props.disabled && "opacity-40 pointer-events-none cursor-not-allowed",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsxs(
+            "span",
+            {
+              className: cn(
+                "relative inline-flex items-center h-5 w-9 flex-shrink-0 rounded-full",
+                "transition-colors duration-200 ease-out",
+                checked ? "bg-tollerud-yellow" : "bg-tollerud-noir-600",
+                "group-hover:bg-tollerud-noir-500",
+                checked && "group-hover:bg-tollerud-yellow-warm",
+                "peer-focus-visible:outline-2 peer-focus-visible:outline-tollerud-yellow peer-focus-visible:outline-offset-2"
+              ),
+              children: [
+                /* @__PURE__ */ jsx(
+                  "input",
+                  {
+                    ref,
+                    id,
+                    type: "checkbox",
+                    role: "switch",
+                    checked,
+                    className: "peer absolute inset-0 opacity-0 w-full h-full cursor-pointer z-10",
+                    ...props
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    className: cn(
+                      "block h-3.5 w-3.5 rounded-full shadow-sm",
+                      "transition-all duration-200 ease-out",
+                      checked ? "translate-x-[18px] bg-tollerud-black" : "translate-x-[3px] bg-tollerud-white"
+                    )
+                  }
+                )
+              ]
+            }
+          ),
+          label && /* @__PURE__ */ jsx("span", { children: label })
+        ]
+      }
+    );
+  }
+);
+Switch.displayName = "Switch";
+
+export { Switch };
+//# sourceMappingURL=chunk-O57QMLNI.js.map
+//# sourceMappingURL=chunk-O57QMLNI.js.map

package/dist/chunk-O57QMLNI.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/Switch.tsx"],"names":[],"mappings":";;;;AASA,IAAM,MAAA,GAAS,UAAA;AAAA,EACb,CAAC,EAAE,SAAA,EAAW,KAAA,EAAO,EAAA,EAAI,QAAQ,OAAA,EAAS,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AAC5D,IAAA,MAAM,SAAS,KAAA,EAAM;AACrB,IAAA,MAAM,KAAK,MAAA,IAAU,MAAA;AAErB,IAAA,uBACE,IAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAAS,EAAA;AAAA,QACT,SAAA,EAAW,EAAA;AAAA,UACT,mEAAA;AAAA,UACA,oCAAA;AAAA,UACA,MAAM,QAAA,IAAY,mDAAA;AAAA,UAClB;AAAA,SACF;AAAA,QAGA,QAAA,EAAA;AAAA,0BAAA,IAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,EAAA;AAAA,gBACT,sEAAA;AAAA,gBACA,yCAAA;AAAA,gBACA,UAAU,oBAAA,GAAuB,sBAAA;AAAA,gBACjC,kCAAA;AAAA,gBACA,OAAA,IAAW,qCAAA;AAAA,gBACX;AAAA,eACF;AAAA,cAGA,QAAA,EAAA;AAAA,gCAAA,GAAA;AAAA,kBAAC,OAAA;AAAA,kBAAA;AAAA,oBACC,GAAA;AAAA,oBACA,EAAA;AAAA,oBACA,IAAA,EAAK,UAAA;AAAA,oBACL,IAAA,EAAK,QAAA;AAAA,oBACL,OAAA;AAAA,oBACA,SAAA,EAAU,mEAAA;AAAA,oBACT,GAAG;AAAA;AAAA,iBACN;AAAA,gCAEA,GAAA;AAAA,kBAAC,MAAA;AAAA,kBAAA;AAAA,oBACC,SAAA,EAAW,EAAA;AAAA,sBACT,0CAAA;AAAA,sBACA,sCAAA;AAAA,sBACA,UACI,sCAAA,GACA;AAAA;AACN;AAAA;AACF;AAAA;AAAA,WACF;AAAA,UACC,KAAA,oBAAS,GAAA,CAAC,MAAA,EAAA,EAAM,QAAA,EAAA,KAAA,EAAM;AAAA;AAAA;AAAA,KACzB;AAAA,EAEJ;AACF;AACA,MAAA,CAAO,WAAA,GAAc,QAAA","file":"chunk-O57QMLNI.js","sourcesContent":["'use client'\n\nimport { type InputHTMLAttributes, forwardRef, useId } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport interface SwitchProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {\n  label?: string\n}\n\nconst Switch = forwardRef<HTMLInputElement, SwitchProps>(\n  ({ className, label, id: idProp, checked, ...props }, ref) => {\n    const autoId = useId()\n    const id = idProp ?? autoId\n\n    return (\n      <label\n        htmlFor={id}\n        className={cn(\n          'inline-flex items-center gap-2.5 cursor-pointer select-none group',\n          'text-sm text-tollerud-text-primary',\n          props.disabled && 'opacity-40 pointer-events-none cursor-not-allowed',\n          className\n        )}\n      >\n        {/* Track */}\n        <span\n          className={cn(\n            'relative inline-flex items-center h-5 w-9 flex-shrink-0 rounded-full',\n            'transition-colors duration-200 ease-out',\n            checked ? 'bg-tollerud-yellow' : 'bg-tollerud-noir-600',\n            'group-hover:bg-tollerud-noir-500',\n            checked && 'group-hover:bg-tollerud-yellow-warm',\n            'peer-focus-visible:outline-2 peer-focus-visible:outline-tollerud-yellow peer-focus-visible:outline-offset-2'\n          )}\n        >\n          {/* Hidden input (peer) */}\n          <input\n            ref={ref}\n            id={id}\n            type=\"checkbox\"\n            role=\"switch\"\n            checked={checked}\n            className=\"peer absolute inset-0 opacity-0 w-full h-full cursor-pointer z-10\"\n            {...props}\n          />\n          {/* Thumb */}\n          <span\n            className={cn(\n              'block h-3.5 w-3.5 rounded-full shadow-sm',\n              'transition-all duration-200 ease-out',\n              checked\n                ? 'translate-x-[18px] bg-tollerud-black'\n                : 'translate-x-[3px] bg-tollerud-white'\n            )}\n          />\n        </span>\n        {label && <span>{label}</span>}\n      </label>\n    )\n  }\n)\nSwitch.displayName = 'Switch'\n\nexport { Switch }"]}

package/dist/chunk-O5SWPHUQ.js

@@ -0,0 +1,79 @@
+'use client';
+import { cn } from './chunk-WSQNPRGN.js';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var Donut = forwardRef(
+  ({ className, segments, size = 160, ...props }, ref) => {
+    const total = segments.reduce((a, s) => a + s.value, 0) || 1;
+    const r = size / 2 - 14;
+    const c = 2 * Math.PI * r;
+    let offset = 0;
+    return /* @__PURE__ */ jsxs("div", { ref, className: cn("flex items-center gap-6", className), ...props, children: [
+      /* @__PURE__ */ jsxs(
+        "svg",
+        {
+          width: size,
+          height: size,
+          viewBox: `0 0 ${size} ${size}`,
+          className: "-rotate-90",
+          role: "img",
+          "aria-hidden": "true",
+          children: [
+            /* @__PURE__ */ jsx(
+              "circle",
+              {
+                cx: size / 2,
+                cy: size / 2,
+                r,
+                fill: "none",
+                stroke: "var(--muted)",
+                strokeWidth: "14"
+              }
+            ),
+            segments.map((s, i) => {
+              const len = s.value / total * c;
+              const gap = len > 10 ? 4 : 0;
+              const el = /* @__PURE__ */ jsx(
+                "circle",
+                {
+                  cx: size / 2,
+                  cy: size / 2,
+                  r,
+                  fill: "none",
+                  stroke: s.color,
+                  strokeWidth: "14",
+                  strokeDasharray: `${Math.max(0.1, len - gap)} ${c - (len - gap)}`,
+                  strokeDashoffset: -offset,
+                  strokeLinecap: "butt"
+                },
+                i
+              );
+              offset += len;
+              return el;
+            })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2", children: segments.map((s, i) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-[13px]", children: [
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: "h-2.5 w-2.5 shrink-0 rounded-[3px]",
+            style: { background: s.color }
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { className: "min-w-[70px] text-tollerud-text-primary", children: s.label }),
+        /* @__PURE__ */ jsxs("span", { className: "font-mono text-tollerud-text-muted", children: [
+          Math.round(s.value / total * 100),
+          "%"
+        ] })
+      ] }, i)) })
+    ] });
+  }
+);
+Donut.displayName = "Donut";
+
+export { Donut };
+//# sourceMappingURL=chunk-O5SWPHUQ.js.map
+//# sourceMappingURL=chunk-O5SWPHUQ.js.map

package/dist/chunk-O5SWPHUQ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/Donut.tsx"],"names":[],"mappings":"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","file":"chunk-O5SWPHUQ.js","sourcesContent":["import { type HTMLAttributes, forwardRef } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport interface DonutSegment {\n  label: string\n  value: number\n  color: string\n}\n\nexport interface DonutProps extends HTMLAttributes<HTMLDivElement> {\n  segments: DonutSegment[]\n  size?: number\n}\n\nconst Donut = forwardRef<HTMLDivElement, DonutProps>(\n  ({ className, segments, size = 160, ...props }, ref) => {\n    const total = segments.reduce((a, s) => a + s.value, 0) || 1\n    const r = size / 2 - 14\n    const c = 2 * Math.PI * r\n    let offset = 0\n\n    return (\n      <div ref={ref} className={cn('flex items-center gap-6', className)} {...props}>\n        <svg\n          width={size}\n          height={size}\n          viewBox={`0 0 ${size} ${size}`}\n          className=\"-rotate-90\"\n          role=\"img\"\n          aria-hidden=\"true\"\n        >\n          <circle\n            cx={size / 2}\n            cy={size / 2}\n            r={r}\n            fill=\"none\"\n            stroke=\"var(--muted)\"\n            strokeWidth=\"14\"\n          />\n          {segments.map((s, i) => {\n            const len = (s.value / total) * c\n            const gap = len > 10 ? 4 : 0\n            const el = (\n              <circle\n                key={i}\n                cx={size / 2}\n                cy={size / 2}\n                r={r}\n                fill=\"none\"\n                stroke={s.color}\n                strokeWidth=\"14\"\n                strokeDasharray={`${Math.max(0.1, len - gap)} ${c - (len - gap)}`}\n                strokeDashoffset={-offset}\n                strokeLinecap=\"butt\"\n              />\n            )\n            offset += len\n            return el\n          })}\n        </svg>\n        <div className=\"flex flex-col gap-2\">\n          {segments.map((s, i) => (\n            <div key={i} className=\"flex items-center gap-2 text-[13px]\">\n              <span\n                className=\"h-2.5 w-2.5 shrink-0 rounded-[3px]\"\n                style={{ background: s.color }}\n              />\n              <span className=\"min-w-[70px] text-tollerud-text-primary\">{s.label}</span>\n              <span className=\"font-mono text-tollerud-text-muted\">\n                {Math.round((s.value / total) * 100)}%\n              </span>\n            </div>\n          ))}\n        </div>\n      </div>\n    )\n  }\n)\nDonut.displayName = 'Donut'\n\nexport { Donut }\n"]}

package/dist/chunk-OGVSZ7NV.js

@@ -0,0 +1,53 @@
+'use client';
+import { Kbd } from './chunk-HWAWUEHC.js';
+import { cn } from './chunk-WSQNPRGN.js';
+import { forwardRef } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var ActionRow = forwardRef(
+  ({
+    action,
+    highlighted = false,
+    showShortcut = true,
+    className,
+    disabled,
+    onClick,
+    ...props
+  }, ref) => {
+    return /* @__PURE__ */ jsxs(
+      "button",
+      {
+        ref,
+        type: "button",
+        disabled: disabled ?? action.disabled,
+        onClick: (e) => {
+          onClick?.(e);
+          action.onSelect?.();
+        },
+        className: cn(
+          "tollerud-action-row",
+          highlighted && "tollerud-action-row--highlighted",
+          (disabled ?? action.disabled) && "tollerud-action-row--disabled",
+          className
+        ),
+        role: "option",
+        "aria-selected": highlighted,
+        "aria-disabled": disabled ?? action.disabled,
+        ...props,
+        children: [
+          action.icon && /* @__PURE__ */ jsx("span", { className: "tollerud-action-row__icon", children: action.icon }),
+          /* @__PURE__ */ jsxs("span", { className: "tollerud-action-row__content", children: [
+            /* @__PURE__ */ jsx("span", { className: "tollerud-action-row__label", children: action.label }),
+            action.description && /* @__PURE__ */ jsx("span", { className: "tollerud-action-row__description", children: action.description })
+          ] }),
+          showShortcut && action.shortcut && /* @__PURE__ */ jsx("span", { className: "tollerud-action-row__shortcut", children: /* @__PURE__ */ jsx(Kbd, { keys: action.shortcut, size: "sm" }) })
+        ]
+      }
+    );
+  }
+);
+ActionRow.displayName = "ActionRow";
+
+export { ActionRow };
+//# sourceMappingURL=chunk-OGVSZ7NV.js.map
+//# sourceMappingURL=chunk-OGVSZ7NV.js.map

package/dist/chunk-OGVSZ7NV.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/ActionRow.tsx"],"names":[],"mappings":";;;;;AAuCA,IAAM,SAAA,GAAY,UAAA;AAAA,EAChB,CACE;AAAA,IACE,MAAA;AAAA,IACA,WAAA,GAAc,KAAA;AAAA,IACd,YAAA,GAAe,IAAA;AAAA,IACf,SAAA;AAAA,IACA,QAAA;AAAA,IACA,OAAA;AAAA,IACA,GAAG;AAAA,KAEL,GAAA,KACG;AACH,IAAA,uBACE,IAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,IAAA,EAAK,QAAA;AAAA,QACL,QAAA,EAAU,YAAY,MAAA,CAAO,QAAA;AAAA,QAC7B,OAAA,EAAS,CAAC,CAAA,KAAM;AACd,UAAA,OAAA,GAAU,CAAC,CAAA;AACX,UAAA,MAAA,CAAO,QAAA,IAAW;AAAA,QACpB,CAAA;AAAA,QACA,SAAA,EAAW,EAAA;AAAA,UACT,qBAAA;AAAA,UACA,WAAA,IAAe,kCAAA;AAAA,UAAA,CACd,QAAA,IAAY,OAAO,QAAA,KAAa,+BAAA;AAAA,UACjC;AAAA,SACF;AAAA,QACA,IAAA,EAAK,QAAA;AAAA,QACL,eAAA,EAAe,WAAA;AAAA,QACf,eAAA,EAAe,YAAY,MAAA,CAAO,QAAA;AAAA,QACjC,GAAG,KAAA;AAAA,QAEH,QAAA,EAAA;AAAA,UAAA,MAAA,CAAO,wBACN,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,2BAAA,EAA6B,iBAAO,IAAA,EAAK,CAAA;AAAA,0BAG3D,IAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,8BAAA,EACd,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,4BAAA,EAA8B,QAAA,EAAA,MAAA,CAAO,KAAA,EAAM,CAAA;AAAA,YAC1D,OAAO,WAAA,oBACN,GAAA,CAAC,UAAK,SAAA,EAAU,kCAAA,EACb,iBAAO,WAAA,EACV;AAAA,WAAA,EAEJ,CAAA;AAAA,UAEC,YAAA,IAAgB,MAAA,CAAO,QAAA,oBACtB,GAAA,CAAC,UAAK,SAAA,EAAU,+BAAA,EACd,QAAA,kBAAA,GAAA,CAAC,GAAA,EAAA,EAAI,IAAA,EAAM,MAAA,CAAO,QAAA,EAAU,IAAA,EAAK,MAAK,CAAA,EACxC;AAAA;AAAA;AAAA,KAEJ;AAAA,EAEJ;AACF;AACA,SAAA,CAAU,WAAA,GAAc,WAAA","file":"chunk-OGVSZ7NV.js","sourcesContent":["\"use client\"\n\nimport { type ButtonHTMLAttributes, forwardRef } from 'react'\nimport { cn } from '@/lib/utils'\nimport { Kbd } from './Kbd'\n\nexport interface ActionItem {\n  /** Unique ID */\n  id: string\n  /** Label text */\n  label: string\n  /** Subtitle / description */\n  description?: string\n  /** Optional icon element */\n  icon?: React.ReactNode\n  /** Keyboard shortcut */\n  shortcut?: string | string[]\n  /** Group this item belongs to */\n  group?: string\n  /** When true, item is disabled */\n  disabled?: boolean\n  /** Selection callback */\n  onSelect?: () => void\n}\n\nexport interface ActionRowProps\n  extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'onSelect'> {\n  /** Action data */\n  action: ActionItem\n  /** Whether this row is currently highlighted (keyboard navigation) */\n  highlighted?: boolean\n  /** Whether to show the shortcut */\n  showShortcut?: boolean\n}\n\n/**\n * Action row — a single command/action item in a list or command menu.\n * Inspired by Raycast's compact action layout.\n */\nconst ActionRow = forwardRef<HTMLButtonElement, ActionRowProps>(\n  (\n    {\n      action,\n      highlighted = false,\n      showShortcut = true,\n      className,\n      disabled,\n      onClick,\n      ...props\n    },\n    ref\n  ) => {\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        disabled={disabled ?? action.disabled}\n        onClick={(e) => {\n          onClick?.(e)\n          action.onSelect?.()\n        }}\n        className={cn(\n          'tollerud-action-row',\n          highlighted && 'tollerud-action-row--highlighted',\n          (disabled ?? action.disabled) && 'tollerud-action-row--disabled',\n          className\n        )}\n        role=\"option\"\n        aria-selected={highlighted}\n        aria-disabled={disabled ?? action.disabled}\n        {...props}\n      >\n        {action.icon && (\n          <span className=\"tollerud-action-row__icon\">{action.icon}</span>\n        )}\n\n        <span className=\"tollerud-action-row__content\">\n          <span className=\"tollerud-action-row__label\">{action.label}</span>\n          {action.description && (\n            <span className=\"tollerud-action-row__description\">\n              {action.description}\n            </span>\n          )}\n        </span>\n\n        {showShortcut && action.shortcut && (\n          <span className=\"tollerud-action-row__shortcut\">\n            <Kbd keys={action.shortcut} size=\"sm\" />\n          </span>\n        )}\n      </button>\n    )\n  }\n)\nActionRow.displayName = 'ActionRow'\n\nexport { ActionRow }"]}

package/dist/chunk-OONIUDST.js

@@ -0,0 +1,48 @@
+'use client';
+import { cn } from './chunk-WSQNPRGN.js';
+import { forwardRef, useId } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var Slider = forwardRef(
+  ({ className, label, showValue, id: idProp, value, defaultValue, min = 0, max = 100, onChange, ...props }, ref) => {
+    const autoId = useId();
+    const id = idProp ?? autoId;
+    const current = value ?? defaultValue ?? min;
+    return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
+      (label || showValue) && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between text-xs", children: [
+        label && /* @__PURE__ */ jsx("label", { htmlFor: id, className: "font-medium text-tollerud-text-muted", children: label }),
+        showValue && /* @__PURE__ */ jsx("span", { className: "text-tollerud-text-secondary tabular-nums", children: current })
+      ] }),
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          ref,
+          id,
+          type: "range",
+          min,
+          max,
+          value,
+          defaultValue,
+          onChange: (e) => onChange?.(Number(e.target.value)),
+          className: cn(
+            "h-1.5 w-full cursor-pointer appearance-none rounded-full bg-tollerud-surface-raised accent-tollerud-yellow",
+            "[&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:h-4 [&::-webkit-slider-thumb]:w-4",
+            "[&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:bg-tollerud-yellow [&::-webkit-slider-thumb]:cursor-pointer",
+            "[&::-webkit-slider-thumb]:border-2 [&::-webkit-slider-thumb]:border-tollerud-noir-black",
+            "[&::-moz-range-thumb]:h-4 [&::-moz-range-thumb]:w-4 [&::-moz-range-thumb]:rounded-full",
+            "[&::-moz-range-thumb]:bg-tollerud-yellow [&::-moz-range-thumb]:border-2 [&::-moz-range-thumb]:border-tollerud-noir-black [&::-moz-range-thumb]:cursor-pointer",
+            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-tollerud-yellow/50",
+            "disabled:opacity-40 disabled:pointer-events-none",
+            className
+          ),
+          ...props
+        }
+      )
+    ] });
+  }
+);
+Slider.displayName = "Slider";
+
+export { Slider };
+//# sourceMappingURL=chunk-OONIUDST.js.map
+//# sourceMappingURL=chunk-OONIUDST.js.map

package/dist/chunk-OONIUDST.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/Slider.tsx"],"names":[],"mappings":";;;;AAYA,IAAM,MAAA,GAAS,UAAA;AAAA,EACb,CAAC,EAAE,SAAA,EAAW,KAAA,EAAO,SAAA,EAAW,IAAI,MAAA,EAAQ,KAAA,EAAO,YAAA,EAAc,GAAA,GAAM,GAAG,GAAA,GAAM,GAAA,EAAK,UAAU,GAAG,KAAA,IAAS,GAAA,KAAQ;AACjH,IAAA,MAAM,SAAS,KAAA,EAAM;AACrB,IAAA,MAAM,KAAK,MAAA,IAAU,MAAA;AACrB,IAAA,MAAM,OAAA,GAAU,SAAS,YAAA,IAAgB,GAAA;AAEzC,IAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,uBAAA,EACX,QAAA,EAAA;AAAA,MAAA,CAAA,KAAA,IAAS,SAAA,qBACT,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,2CAAA,EACZ,QAAA,EAAA;AAAA,QAAA,KAAA,wBACE,OAAA,EAAA,EAAM,OAAA,EAAS,EAAA,EAAI,SAAA,EAAU,wCAC3B,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,QAED,SAAA,oBAAa,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,6CAA6C,QAAA,EAAA,OAAA,EAAQ;AAAA,OAAA,EACrF,CAAA;AAAA,sBAEF,GAAA;AAAA,QAAC,OAAA;AAAA,QAAA;AAAA,UACC,GAAA;AAAA,UACA,EAAA;AAAA,UACA,IAAA,EAAK,OAAA;AAAA,UACL,GAAA;AAAA,UACA,GAAA;AAAA,UACA,KAAA;AAAA,UACA,YAAA;AAAA,UACA,QAAA,EAAU,CAAC,CAAA,KAAM,QAAA,GAAW,OAAO,CAAA,CAAE,MAAA,CAAO,KAAK,CAAC,CAAA;AAAA,UAClD,SAAA,EAAW,EAAA;AAAA,YACT,4GAAA;AAAA,YACA,uGAAA;AAAA,YACA,8HAAA;AAAA,YACA,yFAAA;AAAA,YACA,wFAAA;AAAA,YACA,+JAAA;AAAA,YACA,uFAAA;AAAA,YACA,kDAAA;AAAA,YACA;AAAA,WACF;AAAA,UACC,GAAG;AAAA;AAAA;AACN,KAAA,EACF,CAAA;AAAA,EAEJ;AACF;AACA,MAAA,CAAO,WAAA,GAAc,QAAA","file":"chunk-OONIUDST.js","sourcesContent":["'use client'\n\nimport { type InputHTMLAttributes, forwardRef, useId } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport interface SliderProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'onChange'> {\n  label?: string\n  /** Show the current numeric value next to the label */\n  showValue?: boolean\n  onChange?: (value: number) => void\n}\n\nconst Slider = forwardRef<HTMLInputElement, SliderProps>(\n  ({ className, label, showValue, id: idProp, value, defaultValue, min = 0, max = 100, onChange, ...props }, ref) => {\n    const autoId = useId()\n    const id = idProp ?? autoId\n    const current = value ?? defaultValue ?? min\n\n    return (\n      <div className=\"flex flex-col gap-1.5\">\n        {(label || showValue) && (\n          <div className=\"flex items-center justify-between text-xs\">\n            {label && (\n              <label htmlFor={id} className=\"font-medium text-tollerud-text-muted\">\n                {label}\n              </label>\n            )}\n            {showValue && <span className=\"text-tollerud-text-secondary tabular-nums\">{current}</span>}\n          </div>\n        )}\n        <input\n          ref={ref}\n          id={id}\n          type=\"range\"\n          min={min}\n          max={max}\n          value={value}\n          defaultValue={defaultValue}\n          onChange={(e) => onChange?.(Number(e.target.value))}\n          className={cn(\n            'h-1.5 w-full cursor-pointer appearance-none rounded-full bg-tollerud-surface-raised accent-tollerud-yellow',\n            '[&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:h-4 [&::-webkit-slider-thumb]:w-4',\n            '[&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:bg-tollerud-yellow [&::-webkit-slider-thumb]:cursor-pointer',\n            '[&::-webkit-slider-thumb]:border-2 [&::-webkit-slider-thumb]:border-tollerud-noir-black',\n            '[&::-moz-range-thumb]:h-4 [&::-moz-range-thumb]:w-4 [&::-moz-range-thumb]:rounded-full',\n            '[&::-moz-range-thumb]:bg-tollerud-yellow [&::-moz-range-thumb]:border-2 [&::-moz-range-thumb]:border-tollerud-noir-black [&::-moz-range-thumb]:cursor-pointer',\n            'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-tollerud-yellow/50',\n            'disabled:opacity-40 disabled:pointer-events-none',\n            className\n          )}\n          {...props}\n        />\n      </div>\n    )\n  }\n)\nSlider.displayName = 'Slider'\n\nexport { Slider }\n"]}

package/dist/chunk-PLF3BBQI.js

@@ -0,0 +1,139 @@
+'use client';
+import { cn } from './chunk-WSQNPRGN.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function BentoDashboard({
+  title,
+  hosts = [],
+  metrics = [],
+  services = [],
+  incidents = [],
+  className
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: cn("space-y-4", className), children: [
+    /* @__PURE__ */ jsx("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-tollerud-text-primary", children: title }),
+      /* @__PURE__ */ jsxs("p", { className: "text-xs text-tollerud-text-muted", children: [
+        hosts.length,
+        " hosts \xB7 ",
+        services.length,
+        " services",
+        incidents.length > 0 && ` \xB7 ${incidents.length} active incident${incidents.length > 1 ? "s" : ""}`
+      ] })
+    ] }) }),
+    hosts.length > 0 && /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-3", children: [
+      /* @__PURE__ */ jsx("div", { className: "md:col-span-2 lg:col-span-1", children: /* @__PURE__ */ jsx(HostCardComponent, { host: hosts[0] }) }),
+      /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-3 md:col-span-2 lg:col-span-1", children: hosts.slice(1).map((h, i) => /* @__PURE__ */ jsx(HostCardComponent, { host: h }, h.hostname ?? i)) })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 lg:grid-cols-3 gap-3", children: [
+      metrics.length > 0 && /* @__PURE__ */ jsxs("div", { className: "lg:col-span-2", children: [
+        /* @__PURE__ */ jsx(SectionLabel, { children: "Metrics" }),
+        /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 sm:grid-cols-4 gap-2", children: metrics.map((m, i) => /* @__PURE__ */ jsx(StatCardComponent, { stat: m }, m.label ?? i)) })
+      ] }),
+      services.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx(SectionLabel, { children: "Services" }),
+        /* @__PURE__ */ jsx("div", { className: "space-y-2", children: services.slice(0, 4).map((s, i) => /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-tollerud-border/20 bg-tollerud-surface p-3", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-tollerud-text-primary", children: s.service }),
+            /* @__PURE__ */ jsx("span", { className: cn(
+              "text-xs px-1.5 py-0.5 rounded-full font-medium",
+              s.status === "online" && "text-tollerud-accent bg-tollerud-accent/10",
+              s.status === "warning" && "text-tollerud-warning bg-tollerud-warning/10",
+              s.status === "offline" && "text-tollerud-error bg-tollerud-error/10",
+              s.status === "idle" && "text-tollerud-text-muted bg-tollerud-noir-800"
+            ), children: s.status })
+          ] }),
+          s.responseTime && /* @__PURE__ */ jsxs("p", { className: "text-xs text-tollerud-text-muted mt-1", children: [
+            s.responseTime,
+            " response"
+          ] })
+        ] }, s.service ?? i)) })
+      ] })
+    ] }),
+    incidents.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx(SectionLabel, { children: "Recent Incidents" }),
+      /* @__PURE__ */ jsx("div", { className: "space-y-1.5", children: incidents.slice(0, 4).map((inc, i) => /* @__PURE__ */ jsx(IncidentCardItem, { incident: inc }, inc.title + i)) })
+    ] })
+  ] });
+}
+function SectionLabel({ children }) {
+  return /* @__PURE__ */ jsx("p", { className: "text-xs font-semibold text-tollerud-text-muted uppercase tracking-wider mb-2", children });
+}
+function HostCardComponent({ host }) {
+  return /* @__PURE__ */ jsxs("div", { className: cn(
+    "rounded-xl border p-4",
+    host.status === "online" ? "border-tollerud-border/30 bg-tollerud-surface" : host.status === "warning" ? "border-tollerud-warning/30 bg-tollerud-warning/5" : "border-tollerud-border/20 bg-tollerud-surface opacity-70"
+  ), children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-3", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx(StatusDotComp, { status: host.status }),
+        /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold text-tollerud-text-primary", children: host.hostname })
+      ] }),
+      /* @__PURE__ */ jsx("span", { className: "text-xs text-tollerud-text-muted font-mono", children: host.ip })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-2 text-xs", children: [
+      host.cpu && /* @__PURE__ */ jsx(MetricBadge, { label: "CPU", value: host.cpu }),
+      host.memory && /* @__PURE__ */ jsx(MetricBadge, { label: "Mem", value: host.memory }),
+      host.disk && /* @__PURE__ */ jsx(MetricBadge, { label: "Disk", value: host.disk }),
+      host.uptime && /* @__PURE__ */ jsx(MetricBadge, { label: "Up", value: host.uptime })
+    ] })
+  ] });
+}
+function StatCardComponent({ stat }) {
+  return /* @__PURE__ */ jsxs("div", { className: "rounded-lg border border-tollerud-border/20 bg-tollerud-surface p-3", children: [
+    /* @__PURE__ */ jsx("p", { className: "text-xs text-tollerud-text-muted", children: stat.label }),
+    /* @__PURE__ */ jsx("p", { className: "text-lg font-semibold text-tollerud-text-primary mt-0.5", children: stat.value }),
+    stat.change && /* @__PURE__ */ jsx("span", { className: cn(
+      "text-xs font-medium",
+      stat.change.direction === "up" ? "text-tollerud-accent" : "text-tollerud-error"
+    ), children: stat.change.value })
+  ] });
+}
+function IncidentCardItem({ incident }) {
+  return /* @__PURE__ */ jsxs("div", { className: cn(
+    "flex items-start gap-3 rounded-lg border p-3",
+    incident.acknowledged ? "border-tollerud-border/10 bg-tollerud-noir-900/50 opacity-60" : "border-tollerud-border/20 bg-tollerud-surface"
+  ), children: [
+    /* @__PURE__ */ jsx(SeverityDot, { severity: incident.severity }),
+    /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-tollerud-text-primary truncate", children: incident.title }),
+        incident.acknowledged && /* @__PURE__ */ jsx("span", { className: "text-xs text-tollerud-text-muted", children: "(acknowledged)" })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-xs text-tollerud-text-muted mt-0.5", children: [
+        /* @__PURE__ */ jsx("span", { children: incident.service }),
+        /* @__PURE__ */ jsx("span", { children: "\xB7" }),
+        /* @__PURE__ */ jsx("span", { children: incident.timestamp })
+      ] }),
+      incident.description && /* @__PURE__ */ jsx("p", { className: "text-xs text-tollerud-text-secondary mt-1", children: incident.description })
+    ] })
+  ] });
+}
+function StatusDotComp({ status }) {
+  return /* @__PURE__ */ jsx("span", { className: cn(
+    "inline-block w-2 h-2 rounded-full",
+    status === "online" && "bg-tollerud-accent shadow-[0_0_4px_var(--tollerud-accent)]",
+    status === "warning" && "bg-tollerud-warning",
+    status === "offline" && "bg-tollerud-error"
+  ) });
+}
+function SeverityDot({ severity }) {
+  return /* @__PURE__ */ jsx("span", { className: cn(
+    "inline-block w-2 h-2 rounded-full mt-1 shrink-0",
+    severity === "critical" && "bg-tollerud-error shadow-[0_0_4px_var(--tollerud-error)]",
+    severity === "high" && "bg-tollerud-warning",
+    severity === "medium" && "bg-tollerud-accent",
+    severity === "low" && "bg-tollerud-text-muted",
+    severity === "info" && "bg-tollerud-info"
+  ) });
+}
+function MetricBadge({ label, value }) {
+  return /* @__PURE__ */ jsxs("div", { className: "rounded bg-tollerud-noir-800 px-2 py-1.5", children: [
+    /* @__PURE__ */ jsx("span", { className: "text-tollerud-text-muted", children: label }),
+    /* @__PURE__ */ jsx("span", { className: "float-right text-tollerud-text-primary font-mono", children: value })
+  ] });
+}
+
+export { BentoDashboard };
+//# sourceMappingURL=chunk-PLF3BBQI.js.map
+//# sourceMappingURL=chunk-PLF3BBQI.js.map

package/dist/chunk-PLF3BBQI.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/BentoDashboard.tsx"],"names":[],"mappings":"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","file":"chunk-PLF3BBQI.js","sourcesContent":["'use client'\n\nimport { type ReactNode } from 'react'\nimport { cn } from '@/lib/utils'\nimport type { HostCardProps } from './HostCard'\nimport type { StatCardProps } from './StatCard'\nimport type { ServiceHealthCardProps } from './ServiceHealthCard'\nimport type { IncidentSeverity } from './IncidentCard'\nimport type { BackupJob } from './BackupStatusPanel'\n\n/* ──────────────────── Bento Grid Dashboard Template ──────────────────── */\n\nexport interface BentoDashboardProps {\n  title: string\n  hosts?: HostCardProps[]\n  metrics?: StatCardProps[]\n  services?: ServiceHealthCardProps[]\n  incidents?: { title: string; severity: IncidentSeverity; timestamp: string; service: string; description?: string; acknowledged?: boolean }[]\n  backupJobs?: BackupJob[]\n  className?: string\n  /** Render the incident list footer */\n  renderIncidentFooter?: () => ReactNode\n}\n\nexport function BentoDashboard({\n  title,\n  hosts = [],\n  metrics = [],\n  services = [],\n  incidents = [],\n  className,\n}: BentoDashboardProps) {\n  return (\n    <div className={cn('space-y-4', className)}>\n      {/* Title bar */}\n      <div className=\"flex items-center justify-between\">\n        <div>\n          <h2 className=\"text-lg font-semibold text-tollerud-text-primary\">{title}</h2>\n          <p className=\"text-xs text-tollerud-text-muted\">\n            {hosts.length} hosts · {services.length} services\n            {incidents.length > 0 && ` · ${incidents.length} active incident${incidents.length > 1 ? 's' : ''}`}\n          </p>\n        </div>\n      </div>\n\n      {/* Row 1: Host cards — bento asymmetric */}\n      {hosts.length > 0 && (\n        <div className=\"grid grid-cols-1 md:grid-cols-2 gap-3\">\n          {/* First host spans wider */}\n          <div className=\"md:col-span-2 lg:col-span-1\">\n            <HostCardComponent host={hosts[0]} />\n          </div>\n          {/* Remaining hosts in the second column area */}\n          <div className=\"grid grid-cols-1 gap-3 md:col-span-2 lg:col-span-1\">\n            {hosts.slice(1).map((h, i) => (\n              <HostCardComponent key={h.hostname ?? i} host={h} />\n            ))}\n          </div>\n        </div>\n      )}\n\n      {/* Row 2: Metrics + Services — side by side */}\n      <div className=\"grid grid-cols-1 lg:grid-cols-3 gap-3\">\n        {/* Metrics grid — 2 columns within */}\n        {metrics.length > 0 && (\n          <div className=\"lg:col-span-2\">\n            <SectionLabel>Metrics</SectionLabel>\n            <div className=\"grid grid-cols-2 sm:grid-cols-4 gap-2\">\n              {metrics.map((m, i) => (\n                <StatCardComponent key={m.label ?? i} stat={m} />\n              ))}\n            </div>\n          </div>\n        )}\n\n        {/* Services list */}\n        {services.length > 0 && (\n          <div>\n            <SectionLabel>Services</SectionLabel>\n            <div className=\"space-y-2\">\n              {services.slice(0, 4).map((s, i) => (\n                <div key={s.service ?? i} className=\"rounded-lg border border-tollerud-border/20 bg-tollerud-surface p-3\">\n                  <div className=\"flex items-center justify-between\">\n                    <span className=\"text-sm font-medium text-tollerud-text-primary\">{s.service}</span>\n                    <span className={cn(\n                      'text-xs px-1.5 py-0.5 rounded-full font-medium',\n                      s.status === 'online' && 'text-tollerud-accent bg-tollerud-accent/10',\n                      s.status === 'warning' && 'text-tollerud-warning bg-tollerud-warning/10',\n                      s.status === 'offline' && 'text-tollerud-error bg-tollerud-error/10',\n                      s.status === 'idle' && 'text-tollerud-text-muted bg-tollerud-noir-800',\n                    )}>\n                      {s.status}\n                    </span>\n                  </div>\n                  {s.responseTime && (\n                    <p className=\"text-xs text-tollerud-text-muted mt-1\">{s.responseTime} response</p>\n                  )}\n                </div>\n              ))}\n            </div>\n          </div>\n        )}\n      </div>\n\n      {/* Row 3: Incidents — full width */}\n      {incidents.length > 0 && (\n        <div>\n          <SectionLabel>Recent Incidents</SectionLabel>\n          <div className=\"space-y-1.5\">\n            {incidents.slice(0, 4).map((inc, i) => (\n              <IncidentCardItem key={inc.title + i} incident={inc} />\n            ))}\n          </div>\n        </div>\n      )}\n    </div>\n  )\n}\n\n/* ────────── Internal sub-components for rendering ────────── */\n\nfunction SectionLabel({ children }: { children: ReactNode }) {\n  return (\n    <p className=\"text-xs font-semibold text-tollerud-text-muted uppercase tracking-wider mb-2\">{children}</p>\n  )\n}\n\nfunction HostCardComponent({ host }: { host: HostCardProps }) {\n  return (\n    <div className={cn(\n      'rounded-xl border p-4',\n      host.status === 'online' ? 'border-tollerud-border/30 bg-tollerud-surface' :\n      host.status === 'warning' ? 'border-tollerud-warning/30 bg-tollerud-warning/5' :\n      'border-tollerud-border/20 bg-tollerud-surface opacity-70'\n    )}>\n      <div className=\"flex items-center justify-between mb-3\">\n        <div className=\"flex items-center gap-2\">\n          <StatusDotComp status={host.status as 'online' | 'offline' | 'warning'} />\n          <span className=\"text-sm font-semibold text-tollerud-text-primary\">{host.hostname}</span>\n        </div>\n        <span className=\"text-xs text-tollerud-text-muted font-mono\">{host.ip}</span>\n      </div>\n      <div className=\"grid grid-cols-2 gap-2 text-xs\">\n        {host.cpu && <MetricBadge label=\"CPU\" value={host.cpu} />}\n        {host.memory && <MetricBadge label=\"Mem\" value={host.memory} />}\n        {host.disk && <MetricBadge label=\"Disk\" value={host.disk} />}\n        {host.uptime && <MetricBadge label=\"Up\" value={host.uptime} />}\n      </div>\n    </div>\n  )\n}\n\nfunction StatCardComponent({ stat }: { stat: StatCardProps }) {\n  return (\n    <div className=\"rounded-lg border border-tollerud-border/20 bg-tollerud-surface p-3\">\n      <p className=\"text-xs text-tollerud-text-muted\">{stat.label}</p>\n      <p className=\"text-lg font-semibold text-tollerud-text-primary mt-0.5\">{stat.value}</p>\n      {stat.change && (\n        <span className={cn(\n          'text-xs font-medium',\n          stat.change.direction === 'up' ? 'text-tollerud-accent' : 'text-tollerud-error'\n        )}>\n          {stat.change.value}\n        </span>\n      )}\n    </div>\n  )\n}\n\nfunction IncidentCardItem({ incident }: { incident: { title: string; severity: IncidentSeverity; timestamp: string; service: string; description?: string; acknowledged?: boolean } }) {\n  return (\n    <div className={cn(\n      'flex items-start gap-3 rounded-lg border p-3',\n      incident.acknowledged ? 'border-tollerud-border/10 bg-tollerud-noir-900/50 opacity-60' : 'border-tollerud-border/20 bg-tollerud-surface'\n    )}>\n      <SeverityDot severity={incident.severity} />\n      <div className=\"flex-1 min-w-0\">\n        <div className=\"flex items-center gap-2\">\n          <span className=\"text-sm font-medium text-tollerud-text-primary truncate\">{incident.title}</span>\n          {incident.acknowledged && (\n            <span className=\"text-xs text-tollerud-text-muted\">(acknowledged)</span>\n          )}\n        </div>\n        <div className=\"flex items-center gap-2 text-xs text-tollerud-text-muted mt-0.5\">\n          <span>{incident.service}</span>\n          <span>·</span>\n          <span>{incident.timestamp}</span>\n        </div>\n        {incident.description && (\n          <p className=\"text-xs text-tollerud-text-secondary mt-1\">{incident.description}</p>\n        )}\n      </div>\n    </div>\n  )\n}\n\nfunction StatusDotComp({ status }: { status: 'online' | 'offline' | 'warning' }) {\n  return (\n    <span className={cn(\n      'inline-block w-2 h-2 rounded-full',\n      status === 'online' && 'bg-tollerud-accent shadow-[0_0_4px_var(--tollerud-accent)]',\n      status === 'warning' && 'bg-tollerud-warning',\n      status === 'offline' && 'bg-tollerud-error',\n    )} />\n  )\n}\n\nfunction SeverityDot({ severity }: { severity: IncidentSeverity }) {\n  return (\n    <span className={cn(\n      'inline-block w-2 h-2 rounded-full mt-1 shrink-0',\n      severity === 'critical' && 'bg-tollerud-error shadow-[0_0_4px_var(--tollerud-error)]',\n      severity === 'high' && 'bg-tollerud-warning',\n      severity === 'medium' && 'bg-tollerud-accent',\n      severity === 'low' && 'bg-tollerud-text-muted',\n      severity === 'info' && 'bg-tollerud-info',\n    )} />\n  )\n}\n\nfunction MetricBadge({ label, value }: { label: string; value: string }) {\n  return (\n    <div className=\"rounded bg-tollerud-noir-800 px-2 py-1.5\">\n      <span className=\"text-tollerud-text-muted\">{label}</span>\n      <span className=\"float-right text-tollerud-text-primary font-mono\">{value}</span>\n    </div>\n  )\n}\n\nexport default BentoDashboard"]}