@tollerud/ui 3.0.0 → 3.1.1

package/AGENTS.md

@@ -134,8 +134,8 @@ import { BarChart, AreaChart, Donut, Sparkline, HeroBlock, FeatureCard, CTABand
 // Infra / homelab set
 import { HostCard, ServiceHealthCard, DockerStackCard, IncidentCard } from '@tollerud/ui'
 import { ApprovalCard, ActionDiff, AlertInbox, RollbackPlan, BackupStatusPanel } from '@tollerud/ui'
-// Footer
-import { Footer } from '@tollerud/ui' // or: import { Footer } from '@tollerud/footer'
+// Footer & branding
+import { Footer, Monogram } from '@tollerud/ui' // or: import { Footer } from '@tollerud/footer'
 ```
 
 ### Button
@@ -330,7 +330,9 @@ Monogram sizing: top bar/sidebar expanded → `h-5`, sidebar collapsed → `h-6`
 
 ```html
 <h1 class="tollerud-display text-[70px]">Dark. Monochrome.</h1>
-<h2 class="tollerud-display--secondary text-[40px]">Yellow where it counts</h2>
+<h2 class="tollerud-display--secondary text-[40px]">
+  <span class="tollerud-display-shimmer">Yellow where it counts</span>
+</h2>
 ```
 
 ### Container

package/CHANGELOG.md

@@ -7,6 +7,73 @@
      • Never write bold mid-paragraph as a heading substitute — it merges into surrounding text
 -->
 
+## 3.1.1 — 2026-06-09 — Display shimmer, form indicators, and button fixes
+
+Patch release: ships hero text shimmer for consumer apps, fixes secondary/checkbox/radio styling, and polishes docs layout components.
+
+### New utilities
+
+- `.tollerud-display-shimmer` — animated yellow gradient clipped to text; respects `prefers-reduced-motion` (static `var(--primary)` fallback)
+
+### Fixes
+
+- `Button` — secondary variant restores raised surface and border (theme-aware CSS vars); all variants apply layer classes again
+- `Checkbox` — checkmark visible on `defaultChecked` and click via `peer-checked` on the custom indicator
+- `RadioGroup` — wires `value`, `onChange`, and `name` to children; inner dot shows when selected
+- `CTABand` — title and description centered in the band
+- `BentoDashboard` — section spacing and label alignment
+- Docs `PageTOC` — restores `jumpToSection` import for in-page scroll
+
+### Registry
+
+- Top-level `name` → `Tollerud User Interface`; updated description and component metadata for blocks
+
+### Docs
+
+- Overview, Backgrounds, and Foundations Typography use `.tollerud-display-shimmer` (replaces docs-only `.ds-shimmer`)
+- Light theme shimmer and secondary-button token overrides
+
+### Migration
+
+Drop-in. Replace any copied `.ds-shimmer` with `.tollerud-display-shimmer` from `@tollerud/ui/globals.css`.
+
+---
+
+## 3.1.0 — 2026-06-09 — Monogram component and docs fixes
+
+Restores component styling in the docs site, ships the monogram as an npm component, and renames brand avatar assets.
+
+### New components
+
+- `Monogram` — inline SVG with `color`: `yellow` | `black` | `white`, optional `size` and `title`
+
+### Fixes
+
+- `Button` — `terminal` variant uses layer classes again
+- `Pill`, `Avatar`, `Skeleton`, `Timeline`, `Switch`, `Slider`, `FormRow` — layer-class / prop adapter fixes
+- `DatePicker` — calendar popover `z-50`
+- `DataTable` — explicit `text-left` on column headers
+- `CTABand` — inline accent bar margin
+- `BentoDashboard` — real infra cards instead of placeholders
+- `Footer` — uses `<Monogram color="yellow" />`
+- `NoirGlowBackground` — `scale` and `offsetX` for edge-biased shader placement
+
+### Brand assets
+
+- `tia-full-figure.svg` renamed to `tollerud-avatar-full.svg` (plus PNG export)
+- npm exports: `@tollerud/ui/tollerud-avatar-full.svg` and `@tollerud/ui/tollerud-avatar-full.png`
+
+### Docs
+
+- Docs-only brand layer: `Monogram`, `TiaPortrait`, `TollerudAvatarFull`, `NavLockup` under `@/components/brand`
+- Tailwind `@source` fix, light-mode monogram via `currentColor`, onboarding/auth/foundations page updates
+
+### Migration
+
+Drop-in. Replace any copied `tia-full-figure` paths with `tollerud-avatar-full`. Use `<Monogram />` instead of inline SVG or `<img src={logo}>` where you need theme-aware fill.
+
+---
+
 ## 3.0.0 — 2026-06-09 — ESM-only and rich DataTable
 
 Ships the full table pattern in npm, drops CommonJS builds, and adds release/props tooling.

package/COMPONENTS.md

@@ -786,10 +786,22 @@ The config-driven table. Pass `rows` + a `columns` spec and opt into search, a f
 
 ```html
 <h1 class="tollerud-display text-[70px]">Dark. Monochrome.</h1>
-<h2 class="tollerud-display--secondary text-[40px]">Yellow where it counts</h2>
+<h2 class="tollerud-display--secondary text-[40px]">
+  <span class="tollerud-display-shimmer">Yellow where it counts</span>
+</h2>
 <h3 class="tollerud-display--tertiary text-[28px]">Subtle hierarchy</h3>
 ```
 
+## Display shimmer
+
+Animated yellow gradient clipped to text — for hero accent lines and key metrics on **dark surfaces**. Respects `prefers-reduced-motion` (falls back to static `var(--primary)` / `var(--tollerud-yellow)`).
+
+```html
+<span class="tollerud-display-shimmer">Yellow where it counts.</span>
+```
+
+Pair with `.tollerud-display` on the parent heading. Not for body copy or light backgrounds (yellow fails contrast on white).
+
 ## Container
 
 ```jsx

package/README.md

@@ -288,4 +288,5 @@ New additions inspired by [Graphify Labs](https://graphifylabs.ai/):
 | Accent Bar | `.tollerud-accent-bar` | `bg-tollerud-gradient-bar h-[1px]` | Gradient divider bar |
 | Gradient Text | `.tollerud-gradient-text` | `bg-tollerud-gradient-soft bg-clip-text text-transparent` | Yellow → amber gradient text |
 | Display Heading | `.tollerud-display` | `tracking-tightest leading-[0.95] font-semibold text-white` | Tight, impactful display heads |
+| Display Shimmer | `.tollerud-display-shimmer` | — | Animated yellow gradient sweep clipped to hero accent text (dark surfaces) |
 | Section Container | `.tollerud-section` | `max-w-[1100px] mx-auto px-6` | Content width constraint |

package/SKILL.md

@@ -20,7 +20,7 @@ npm install @tollerud/ui clsx tailwind-merge tailwindcss@4 \
 npm install @paper-design/shaders-react
 ```
 
-As of **v3.0.0**, the package is **ESM-only** (no CJS `require` entry). As of **v2.0.0**, Radix, Lucide, Framer Motion, and Sonner are **required peers** (not bundled).
+As of **v3.1.1**, `.tollerud-display-shimmer` ships in `globals.css` for animated hero accent text. As of **v3.1.0**, `Monogram` ships as an inline SVG component (`color`: `yellow` | `black` | `white`). As of **v3.0.0**, the package is **ESM-only** (no CJS `require` entry). As of **v2.0.0**, Radix, Lucide, Framer Motion, and Sonner are **required peers** (not bundled).
 
 Apply the Tailwind preset when you need extra utilities from `tollerud-preset.js` — `globals.css` already includes tokens and component layers for v4:
 
@@ -445,8 +445,7 @@ import type { IncidentSeverity } from '@tollerud/ui'
 ### Footer & branding
 
 ```tsx
-import { Footer } from '@tollerud/ui'
-import logo from '@tollerud/ui/tollerud-logo.svg'
+import { Footer, Monogram } from '@tollerud/ui'
 
 <Footer layout="responsive" accent labels={{ tollerudProject: 'A Tollerud Project' }} />
 ```
@@ -454,10 +453,12 @@ The monogram must always sit left of the project name with `gap-2`. Never show t
 
 ```tsx
 <div className="flex items-center gap-2 shrink-0">
-  <img src={logo} alt="Tollerud" className="h-5 w-auto" />
+  <Monogram color="yellow" className="h-5 w-auto" />
   <span className="font-semibold text-sm text-white">Project Name</span>
 </div>
 ```
+
+**Monogram** — `color?: 'yellow' | 'black' | 'white'` (default `yellow`), `size?: number`, `title?: string` (default `'Tollerud'`). Brand avatars: `@tollerud/ui/tollerud-avatar.svg`, `tollerud-avatar-full.svg` (+ `.png` variants).
 Monogram sizing: top bar/sidebar expanded → `h-5`, collapsed → `h-6`, footer → `h-4` (handled automatically by `<Footer />`).
 
 ---
@@ -468,7 +469,9 @@ Monogram sizing: top bar/sidebar expanded → `h-5`, collapsed → `h-6`, footer
 <nav class="tollerud-glass fixed top-0 inset-x-0 z-50 h-14 flex items-center px-6">…</nav>
 <section class="tollerud-grid-bg">…</section>
 <h1 class="tollerud-display text-[70px]">Dark. Monochrome.</h1>
-<h2 class="tollerud-display--secondary text-[40px]">Yellow where it counts</h2>
+<h2 class="tollerud-display--secondary text-[40px]">
+  <span class="tollerud-display-shimmer">Yellow where it counts</span>
+</h2>
 <div data-density="compact">…dense tables / forms…</div>
 ```
 

package/components.json

@@ -1,6 +1,6 @@
 {
   "$schema": "https://ui.shadcn.com/schema.json",
-  "name": "tollerud-noir",
+  "name": "Tollerud User Interface",
   "style": "default",
   "rsc": true,
   "tsx": true,

package/dist/avatar.d.ts

@@ -13,13 +13,14 @@ interface AvatarProps extends HTMLAttributes<HTMLSpanElement> {
     name?: string;
     /** Explicit fallback content (overrides derived initials) */
     fallback?: React.ReactNode;
-    size?: keyof typeof avatarSizes;
+    /** Named size token or explicit pixel diameter */
+    size?: keyof typeof avatarSizes | number;
 }
 declare const Avatar: react.ForwardRefExoticComponent<AvatarProps & react.RefAttributes<HTMLSpanElement>>;
 interface AvatarGroupProps extends HTMLAttributes<HTMLDivElement> {
     /** Maximum avatars to render before collapsing into a "+N" overflow indicator */
     max?: number;
-    size?: keyof typeof avatarSizes;
+    size?: keyof typeof avatarSizes | number;
     children: React.ReactNode;
 }
 declare const AvatarGroup: react.ForwardRefExoticComponent<AvatarGroupProps & react.RefAttributes<HTMLDivElement>>;

package/dist/avatar.js

@@ -1,5 +1,5 @@
 'use client';
-export { Avatar, AvatarGroup } from './chunk-DGCRHVWW.js';
+export { Avatar, AvatarGroup } from './chunk-VFS3V3VY.js';
 import './chunk-WSQNPRGN.js';
 //# sourceMappingURL=avatar.js.map
 //# sourceMappingURL=avatar.js.map

package/dist/bento-dashboard.js

@@ -1,5 +1,10 @@
 'use client';
-export { BentoDashboard } from './chunk-PLF3BBQI.js';
+export { BentoDashboard } from './chunk-LGVXEWNB.js';
+import './chunk-LUM2YJBH.js';
+import './chunk-7EP2T3OW.js';
+import './chunk-DOUDJU4P.js';
+import './chunk-NHPISZWS.js';
+import './chunk-EN4OJCEF.js';
 import './chunk-WSQNPRGN.js';
 //# sourceMappingURL=bento-dashboard.js.map
 //# sourceMappingURL=bento-dashboard.js.map

package/dist/button.d.ts

@@ -3,10 +3,10 @@ import { ButtonHTMLAttributes } from 'react';
 
 declare const variants: {
     readonly primary: "bg-tollerud-yellow text-tollerud-black border-tollerud-yellow hover:bg-tollerud-yellow hover:shadow-tollerud-glow";
-    readonly secondary: "bg-transparent text-tollerud-text-primary border-tollerud-border hover:border-tollerud-text-secondary hover:bg-tollerud-surface-hover";
-    readonly ghost: "bg-transparent text-tollerud-text-secondary border-transparent hover:text-tollerud-text-primary hover:bg-tollerud-surface-hover";
+    readonly secondary: "text-tollerud-text-primary [background:var(--surface-raised,var(--tollerud-surface-raised))] [border-color:var(--border,var(--tollerud-border))] hover:[border-color:var(--text-secondary,var(--tollerud-text-secondary))] hover:[background:var(--surface-hover,var(--tollerud-surface-hover))]";
+    readonly ghost: "text-tollerud-text-secondary border-transparent hover:text-tollerud-text-primary hover:bg-tollerud-surface-hover";
     readonly destructive: "bg-tollerud-error text-white border-tollerud-error hover:shadow-[0_0_12px_rgba(239,68,68,0.3)]";
-    readonly terminal: "font-mono text-tollerud-yellow border-[rgba(255,255,0,0.25)] bg-transparent before:content-[\"❯_\"] before:opacity-70 hover:border-tollerud-yellow hover:shadow-tollerud-glow hover:bg-[rgba(255,255,0,0.05)]";
+    readonly terminal: "font-mono text-tollerud-yellow border-[rgba(255,255,0,0.25)] bg-transparent hover:border-tollerud-yellow hover:shadow-tollerud-glow hover:bg-[rgba(255,255,0,0.05)]";
 };
 declare const sizes: {
     readonly sm: "px-3 py-1 text-sm";

package/dist/button.js

@@ -1,5 +1,5 @@
 'use client';
-export { Button, buttonVariants } from './chunk-RWJELAS6.js';
+export { Button, buttonVariants } from './chunk-BQWF5MP7.js';
 import './chunk-WSQNPRGN.js';
 //# sourceMappingURL=button.js.map
 //# sourceMappingURL=button.js.map

package/dist/checkbox.js

@@ -1,5 +1,5 @@
 'use client';
-export { Checkbox } from './chunk-T3TQPOVM.js';
+export { Checkbox } from './chunk-TLEKK53J.js';
 import './chunk-WSQNPRGN.js';
 //# sourceMappingURL=checkbox.js.map
 //# sourceMappingURL=checkbox.js.map

package/dist/{chunk-7TOT5ME3.js → chunk-3LTW224O.js}

@@ -23,10 +23,10 @@ var Timeline = forwardRef(
                   className: cn(
                     "tollerud-timeline__dot",
                     active && "tollerud-timeline__dot--active",
-                    item.status === "online" && "bg-tollerud-success shadow-[0_0_6px_rgba(34,197,94,0.5)]",
-                    item.status === "offline" && "bg-tollerud-error",
-                    item.status === "warning" && "bg-tollerud-yellow shadow-[0_0_6px_rgba(232,213,0,0.5)]",
-                    !item.status && "bg-tollerud-noir-500"
+                    item.status === "online" && "tollerud-timeline__dot--online",
+                    item.status === "offline" && "tollerud-timeline__dot--offline",
+                    item.status === "warning" && "tollerud-timeline__dot--warning",
+                    item.status === "idle" && "tollerud-timeline__dot--idle"
                   )
                 }
               ),
@@ -49,5 +49,5 @@ var Timeline = forwardRef(
 Timeline.displayName = "Timeline";
 
 export { Timeline };
-//# sourceMappingURL=chunk-7TOT5ME3.js.map
-//# sourceMappingURL=chunk-7TOT5ME3.js.map
+//# sourceMappingURL=chunk-3LTW224O.js.map
+//# sourceMappingURL=chunk-3LTW224O.js.map

package/dist/chunk-3LTW224O.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/Timeline.tsx"],"names":[],"mappings":";;;;AA6BA,IAAM,QAAA,GAAW,UAAA;AAAA,EACf,CAAC,EAAE,SAAA,EAAW,KAAA,EAAO,QAAQ,OAAA,EAAS,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AACxD,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,EAAA,CAAG,mBAAA,EAAqB,OAAA,IAAW,iBAAiB,SAAS,CAAA;AAAA,QACxE,IAAA,EAAK,MAAA;AAAA,QACL,YAAA,EAAW,mBAAA;AAAA,QACV,GAAG,KAAA;AAAA,QAEH,QAAA,EAAA,KAAA,CAAM,GAAA,CAAI,CAAC,IAAA,EAAM,CAAA,KAAM;AACtB,UAAA,MAAM,MAAA,GAAS,CAAA,KAAM,KAAA,CAAM,MAAA,GAAS,CAAA;AAEpC,UAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAkB,SAAA,EAAU,yBAAA,EAA0B,MAAK,UAAA,EAE1D,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,SAAI,SAAA,EAAU,2BAAA,EACb,QAAA,kBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,8BAAA,EACZ,QAAA,EAAA;AAAA,cAAA,IAAA,CAAK,uBACJ,GAAA,CAAC,MAAA,EAAA,EAAK,WAAU,yBAAA,EAA2B,QAAA,EAAA,IAAA,CAAK,MAAK,CAAA,mBAErD,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,SAAA,EAAW,EAAA;AAAA,oBACT,wBAAA;AAAA,oBACA,MAAA,IAAU,gCAAA;AAAA,oBACV,IAAA,CAAK,WAAW,QAAA,IAAY,gCAAA;AAAA,oBAC5B,IAAA,CAAK,WAAW,SAAA,IAAa,iCAAA;AAAA,oBAC7B,IAAA,CAAK,WAAW,SAAA,IAAa,iCAAA;AAAA,oBAC7B,IAAA,CAAK,WAAW,MAAA,IAAU;AAAA;AAC5B;AAAA,eACF;AAAA,cAED,CAAC,MAAA,oBAAU,GAAA,CAAC,KAAA,EAAA,EAAI,WAAU,yBAAA,EAA0B;AAAA,aAAA,EACvD,CAAA,EACF,CAAA;AAAA,4BAGA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,4BAAA,EACb,QAAA,EAAA;AAAA,8BAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,wCAAA,EACb,QAAA,EAAA;AAAA,gCAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,0BAAA,EAA4B,QAAA,EAAA,IAAA,CAAK,KAAA,EAAM,CAAA;AAAA,gCACvD,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,yBAAA,EAA2B,eAAK,IAAA,EAAK;AAAA,eAAA,EACvD,CAAA;AAAA,cACC,KAAK,WAAA,oBACJ,GAAA,CAAC,OAAE,SAAA,EAAU,gCAAA,EAAkC,eAAK,WAAA,EAAY,CAAA;AAAA,cAEjE,IAAA,CAAK,QAAQ,IAAA,CAAK,IAAA,CAAK,SAAS,CAAA,oBAC/B,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,6BAAA,EACZ,QAAA,EAAA,IAAA,CAAK,KAAK,GAAA,CAAI,CAAC,sBACd,GAAA,CAAC,MAAA,EAAA,EAAa,WAAU,yBAAA,EAA2B,QAAA,EAAA,CAAA,EAAA,EAAxC,CAA0C,CACtD,CAAA,EACH;AAAA,aAAA,EAEJ;AAAA,WAAA,EAAA,EAtCQ,KAAK,EAuCf,CAAA;AAAA,QAEJ,CAAC;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;AACA,QAAA,CAAS,WAAA,GAAc,UAAA","file":"chunk-3LTW224O.js","sourcesContent":["import { type HTMLAttributes, type ReactNode, forwardRef } from 'react'\nimport { cn } from '@/lib/utils'\nimport type { Status } from './StatusDot'\n\nexport interface TimelineItemData {\n  id: string\n  /** Timestamp label */\n  time: string\n  /** Title/headline of the event */\n  title: string\n  /** Description */\n  description?: string\n  /** Status indicator dot */\n  status?: Status\n  /** Optional icon to replace dot */\n  icon?: ReactNode\n  /** Optional metadata badges */\n  meta?: string[]\n}\n\nexport interface TimelineProps extends HTMLAttributes<HTMLDivElement> {\n  /** Timeline events */\n  items: TimelineItemData[]\n  /** Whether items are active (show animated dot pulse) */\n  active?: boolean\n  /** Whether the timeline is loading */\n  loading?: boolean\n}\n\nconst Timeline = forwardRef<HTMLDivElement, TimelineProps>(\n  ({ className, items, active, loading, ...props }, ref) => {\n    return (\n      <div\n        ref={ref}\n        className={cn('tollerud-timeline', loading && 'animate-pulse', className)}\n        role=\"list\"\n        aria-label=\"Activity timeline\"\n        {...props}\n      >\n        {items.map((item, i) => {\n          const isLast = i === items.length - 1\n\n          return (\n            <div key={item.id} className=\"tollerud-timeline__item\" role=\"listitem\">\n              {/* Dot column */}\n              <div className=\"tollerud-timeline__marker\">\n                <div className=\"tollerud-timeline__dot-group\">\n                  {item.icon ? (\n                    <span className=\"tollerud-timeline__icon\">{item.icon}</span>\n                  ) : (\n                    <span\n                      className={cn(\n                        'tollerud-timeline__dot',\n                        active && 'tollerud-timeline__dot--active',\n                        item.status === 'online' && 'tollerud-timeline__dot--online',\n                        item.status === 'offline' && 'tollerud-timeline__dot--offline',\n                        item.status === 'warning' && 'tollerud-timeline__dot--warning',\n                        item.status === 'idle' && 'tollerud-timeline__dot--idle'\n                      )}\n                    />\n                  )}\n                  {!isLast && <div className=\"tollerud-timeline__line\" />}\n                </div>\n              </div>\n\n              {/* Content */}\n              <div className=\"tollerud-timeline__content\">\n                <div className=\"flex items-start justify-between gap-2\">\n                  <span className=\"tollerud-timeline__title\">{item.title}</span>\n                  <span className=\"tollerud-timeline__time\">{item.time}</span>\n                </div>\n                {item.description && (\n                  <p className=\"tollerud-timeline__description\">{item.description}</p>\n                )}\n                {item.meta && item.meta.length > 0 && (\n                  <div className=\"flex flex-wrap gap-1.5 mt-1\">\n                    {item.meta.map((m) => (\n                      <span key={m} className=\"tollerud-timeline__meta\">{m}</span>\n                    ))}\n                  </div>\n                )}\n              </div>\n            </div>\n          )\n        })}\n      </div>\n    )\n  }\n)\nTimeline.displayName = 'Timeline'\n\nexport { Timeline }"]}

package/dist/chunk-AQT3FZRQ.js

@@ -0,0 +1,23 @@
+'use client';
+import { cn } from './chunk-WSQNPRGN.js';
+import { jsx } from 'react/jsx-runtime';
+
+function Skeleton({ className, h, w, r, style, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn("tollerud-skeleton", className),
+      style: {
+        ...h != null ? { height: h } : null,
+        ...w != null ? { width: w } : null,
+        ...r != null ? { borderRadius: r } : null,
+        ...style
+      },
+      ...props
+    }
+  );
+}
+
+export { Skeleton };
+//# sourceMappingURL=chunk-AQT3FZRQ.js.map
+//# sourceMappingURL=chunk-AQT3FZRQ.js.map

package/dist/chunk-AQT3FZRQ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/Skeleton.tsx"],"names":[],"mappings":";;;AAWA,SAAS,QAAA,CAAS,EAAE,SAAA,EAAW,CAAA,EAAG,GAAG,CAAA,EAAG,KAAA,EAAO,GAAG,KAAA,EAAM,EAAkB;AACxE,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,EAAA,CAAG,mBAAA,EAAqB,SAAS,CAAA;AAAA,MAC5C,KAAA,EAAO;AAAA,QACL,GAAI,CAAA,IAAK,IAAA,GAAO,EAAE,MAAA,EAAQ,GAAE,GAAI,IAAA;AAAA,QAChC,GAAI,CAAA,IAAK,IAAA,GAAO,EAAE,KAAA,EAAO,GAAE,GAAI,IAAA;AAAA,QAC/B,GAAI,CAAA,IAAK,IAAA,GAAO,EAAE,YAAA,EAAc,GAAE,GAAI,IAAA;AAAA,QACtC,GAAG;AAAA,OACL;AAAA,MACC,GAAG;AAAA;AAAA,GACN;AAEJ","file":"chunk-AQT3FZRQ.js","sourcesContent":["import { cn } from '@/lib/utils'\n\nexport interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Shorthand height in px (or any CSS length via className) */\n  h?: number | string\n  /** Shorthand width in px or percentage string e.g. \"60%\" */\n  w?: number | string\n  /** Shorthand border-radius in px */\n  r?: number | string\n}\n\nfunction Skeleton({ className, h, w, r, style, ...props }: SkeletonProps) {\n  return (\n    <div\n      className={cn('tollerud-skeleton', className)}\n      style={{\n        ...(h != null ? { height: h } : null),\n        ...(w != null ? { width: w } : null),\n        ...(r != null ? { borderRadius: r } : null),\n        ...style,\n      }}\n      {...props}\n    />\n  )\n}\n\nexport { Skeleton }\n"]}

package/dist/{chunk-RWJELAS6.js → chunk-BQWF5MP7.js}

@@ -6,10 +6,17 @@ import { jsx } from 'react/jsx-runtime';
 
 var variants = {
   primary: "bg-tollerud-yellow text-tollerud-black border-tollerud-yellow hover:bg-tollerud-yellow hover:shadow-tollerud-glow",
-  secondary: "bg-transparent text-tollerud-text-primary border-tollerud-border hover:border-tollerud-text-secondary hover:bg-tollerud-surface-hover",
-  ghost: "bg-transparent text-tollerud-text-secondary border-transparent hover:text-tollerud-text-primary hover:bg-tollerud-surface-hover",
+  secondary: "text-tollerud-text-primary [background:var(--surface-raised,var(--tollerud-surface-raised))] [border-color:var(--border,var(--tollerud-border))] hover:[border-color:var(--text-secondary,var(--tollerud-text-secondary))] hover:[background:var(--surface-hover,var(--tollerud-surface-hover))]",
+  ghost: "text-tollerud-text-secondary border-transparent hover:text-tollerud-text-primary hover:bg-tollerud-surface-hover",
   destructive: "bg-tollerud-error text-white border-tollerud-error hover:shadow-[0_0_12px_rgba(239,68,68,0.3)]",
-  terminal: 'font-mono text-tollerud-yellow border-[rgba(255,255,0,0.25)] bg-transparent before:content-["\u276F_"] before:opacity-70 hover:border-tollerud-yellow hover:shadow-tollerud-glow hover:bg-[rgba(255,255,0,0.05)]'
+  terminal: "font-mono text-tollerud-yellow border-[rgba(255,255,0,0.25)] bg-transparent hover:border-tollerud-yellow hover:shadow-tollerud-glow hover:bg-[rgba(255,255,0,0.05)]"
+};
+var variantLayers = {
+  primary: "tollerud-btn--primary",
+  secondary: "tollerud-btn--secondary",
+  ghost: "tollerud-btn--ghost",
+  destructive: "tollerud-btn--destructive",
+  terminal: "tollerud-btn--terminal"
 };
 var sizes = {
   sm: "px-3 py-1 text-sm",
@@ -18,10 +25,11 @@ var sizes = {
 };
 function buttonVariants({ variant = "secondary", size = "md", className } = {}) {
   return cn(
-    "inline-flex items-center justify-center gap-2 font-semibold rounded transition-all duration-[150ms] focus-visible:outline-2 focus-visible:outline-tollerud-yellow focus-visible:outline-offset-2",
+    "tollerud-btn inline-flex items-center justify-center gap-2 font-semibold rounded transition-all duration-[150ms] focus-visible:outline-2 focus-visible:outline-tollerud-yellow focus-visible:outline-offset-2",
     "border cursor-pointer",
     "disabled:opacity-50 disabled:pointer-events-none",
     variants[variant],
+    variantLayers[variant],
     sizes[size],
     className
   );
@@ -42,5 +50,5 @@ var Button = forwardRef(
 Button.displayName = "Button";
 
 export { Button, buttonVariants };
-//# sourceMappingURL=chunk-RWJELAS6.js.map
-//# sourceMappingURL=chunk-RWJELAS6.js.map
+//# sourceMappingURL=chunk-BQWF5MP7.js.map
+//# sourceMappingURL=chunk-BQWF5MP7.js.map

package/dist/chunk-BQWF5MP7.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/Button.tsx"],"names":[],"mappings":";;;;;AAIA,IAAM,QAAA,GAAW;AAAA,EACf,OAAA,EAAS,mHAAA;AAAA,EACT,SAAA,EACE,kSAAA;AAAA,EACF,KAAA,EAAO,kHAAA;AAAA,EACP,WAAA,EAAa,gGAAA;AAAA,EACb,QAAA,EAAU;AACZ,CAAA;AAGA,IAAM,aAAA,GAAgB;AAAA,EACpB,OAAA,EAAS,uBAAA;AAAA,EACT,SAAA,EAAW,yBAAA;AAAA,EACX,KAAA,EAAO,qBAAA;AAAA,EACP,WAAA,EAAa,2BAAA;AAAA,EACb,QAAA,EAAU;AACZ,CAAA;AAEA,IAAM,KAAA,GAAQ;AAAA,EACZ,EAAA,EAAI,mBAAA;AAAA,EACJ,EAAA,EAAI,qBAAA;AAAA,EACJ,EAAA,EAAI;AACN,CAAA;AAOO,SAAS,cAAA,CAAe,EAAE,OAAA,GAAU,WAAA,EAAa,OAAO,IAAA,EAAM,SAAA,EAAU,GAAiD,EAAC,EAAG;AAClI,EAAA,OAAO,EAAA;AAAA,IACL,+MAAA;AAAA,IACA,uBAAA;AAAA,IACA,kDAAA;AAAA,IACA,SAAS,OAAO,CAAA;AAAA,IAChB,cAAc,OAAO,CAAA;AAAA,IACrB,MAAM,IAAI,CAAA;AAAA,IACV;AAAA,GACF;AACF;AAOA,IAAM,MAAA,GAAS,UAAA;AAAA,EACb,CAAC,EAAE,SAAA,EAAW,OAAA,GAAU,WAAA,EAAa,IAAA,GAAO,IAAA,EAAM,OAAA,GAAU,KAAA,EAAO,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AACrF,IAAA,MAAM,IAAA,GAAO,UAAU,IAAA,GAAO,QAAA;AAC9B,IAAA,uBACE,GAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,WAAW,cAAA,CAAe,EAAE,OAAA,EAAS,IAAA,EAAM,WAAW,CAAA;AAAA,QACrD,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AACA,MAAA,CAAO,WAAA,GAAc,QAAA","file":"chunk-BQWF5MP7.js","sourcesContent":["import { type ButtonHTMLAttributes, forwardRef } from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { cn } from '@/lib/utils'\n\nconst variants = {\n  primary: 'bg-tollerud-yellow text-tollerud-black border-tollerud-yellow hover:bg-tollerud-yellow hover:shadow-tollerud-glow',\n  secondary:\n    'text-tollerud-text-primary [background:var(--surface-raised,var(--tollerud-surface-raised))] [border-color:var(--border,var(--tollerud-border))] hover:[border-color:var(--text-secondary,var(--tollerud-text-secondary))] hover:[background:var(--surface-hover,var(--tollerud-surface-hover))]',\n  ghost: 'text-tollerud-text-secondary border-transparent hover:text-tollerud-text-primary hover:bg-tollerud-surface-hover',\n  destructive: 'bg-tollerud-error text-white border-tollerud-error hover:shadow-[0_0_12px_rgba(239,68,68,0.3)]',\n  terminal: 'font-mono text-tollerud-yellow border-[rgba(255,255,0,0.25)] bg-transparent hover:border-tollerud-yellow hover:shadow-tollerud-glow hover:bg-[rgba(255,255,0,0.05)]',\n} as const\n\n/** Layer classes from globals-layers.css — ❯ prefix, hover glow, magnetic glow in docs */\nconst variantLayers = {\n  primary: 'tollerud-btn--primary',\n  secondary: 'tollerud-btn--secondary',\n  ghost: 'tollerud-btn--ghost',\n  destructive: 'tollerud-btn--destructive',\n  terminal: 'tollerud-btn--terminal',\n} as const\n\nconst sizes = {\n  sm: 'px-3 py-1 text-sm',\n  md: 'px-4 py-2 text-base',\n  lg: 'px-6 py-3 text-lg',\n} as const\n\nexport interface ButtonVariantProps {\n  variant?: keyof typeof variants\n  size?: keyof typeof sizes\n}\n\nexport function buttonVariants({ variant = 'secondary', size = 'md', className }: ButtonVariantProps & { className?: string } = {}) {\n  return cn(\n    'tollerud-btn inline-flex items-center justify-center gap-2 font-semibold rounded transition-all duration-[150ms] focus-visible:outline-2 focus-visible:outline-tollerud-yellow focus-visible:outline-offset-2',\n    'border cursor-pointer',\n    'disabled:opacity-50 disabled:pointer-events-none',\n    variants[variant],\n    variantLayers[variant],\n    sizes[size],\n    className\n  )\n}\n\nexport interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement>, ButtonVariantProps {\n  /** Render as the single child element (e.g. a `<Link>`) instead of a `<button>`, merging props and styles onto it. */\n  asChild?: boolean\n}\n\nconst Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  ({ className, variant = 'secondary', size = 'md', asChild = false, ...props }, ref) => {\n    const Comp = asChild ? Slot : 'button'\n    return (\n      <Comp\n        ref={ref}\n        className={buttonVariants({ variant, size, className })}\n        {...props}\n      />\n    )\n  }\n)\nButton.displayName = 'Button'\n\nexport { Button }\n"]}

package/dist/{chunk-VTRUUT5K.js → chunk-FPFLOYIJ.js}

@@ -10,15 +10,15 @@ var CTABand = forwardRef(
       {
         ref,
         className: cn(
-          "rounded-xl border border-tollerud-border bg-tollerud-surface px-8 py-11 text-center",
+          "tollerud-card w-full rounded-xl border border-tollerud-border bg-tollerud-surface px-8 py-11 text-center",
           className
         ),
         ...props,
         children: [
-          /* @__PURE__ */ jsx("h2", { className: "tollerud-display text-[30px] text-tollerud-text-primary", children: title }),
-          description && /* @__PURE__ */ jsx("p", { className: "mx-auto mt-3 max-w-[440px] text-[15px] text-tollerud-text-secondary", children: description }),
+          /* @__PURE__ */ jsx("h2", { className: "tollerud-display mx-auto max-w-[640px] text-center text-[30px] text-tollerud-text-primary", children: title }),
+          description && /* @__PURE__ */ jsx("p", { className: "mx-auto mt-3 max-w-[440px] text-center text-[15px] text-tollerud-text-secondary", children: description }),
           actions && /* @__PURE__ */ jsx("div", { className: "mt-[22px] flex flex-wrap items-center justify-center gap-3", children: actions }),
-          accentBar && /* @__PURE__ */ jsx("hr", { className: "tollerud-accent-bar mx-auto mt-8 max-w-[320px] border-0" })
+          accentBar && /* @__PURE__ */ jsx("hr", { className: "tollerud-accent-bar tollerud-accent-bar--inline mx-auto mt-8 max-w-[320px] border-0" })
         ]
       }
     );
@@ -27,5 +27,5 @@ var CTABand = forwardRef(
 CTABand.displayName = "CTABand";
 
 export { CTABand };
-//# sourceMappingURL=chunk-VTRUUT5K.js.map
-//# sourceMappingURL=chunk-VTRUUT5K.js.map
+//# sourceMappingURL=chunk-FPFLOYIJ.js.map
+//# sourceMappingURL=chunk-FPFLOYIJ.js.map

package/dist/chunk-FPFLOYIJ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/CTABand.tsx"],"names":[],"mappings":";;;;AAUA,IAAM,OAAA,GAAU,UAAA;AAAA,EACd,CAAC,EAAE,SAAA,EAAW,KAAA,EAAO,WAAA,EAAa,OAAA,EAAS,SAAA,GAAY,IAAA,EAAM,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AAC/E,IAAA,uBACE,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,EAAA;AAAA,UACT,0GAAA;AAAA,UACA;AAAA,SACF;AAAA,QACC,GAAG,KAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAU,2FAAA,EACX,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,UACC,WAAA,oBACC,GAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,mFACV,QAAA,EAAA,WAAA,EACH,CAAA;AAAA,UAED,OAAA,oBACC,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,8DAA8D,QAAA,EAAA,OAAA,EAAQ,CAAA;AAAA,UAEtF,SAAA,oBACC,GAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAU,qFAAA,EAAsF;AAAA;AAAA;AAAA,KAExG;AAAA,EAEJ;AACF;AACA,OAAA,CAAQ,WAAA,GAAc,SAAA","file":"chunk-FPFLOYIJ.js","sourcesContent":["import { type HTMLAttributes, forwardRef } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport interface CTABandProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {\n  title: React.ReactNode\n  description?: React.ReactNode\n  actions?: React.ReactNode\n  accentBar?: boolean\n}\n\nconst CTABand = forwardRef<HTMLDivElement, CTABandProps>(\n  ({ className, title, description, actions, accentBar = true, ...props }, ref) => {\n    return (\n      <div\n        ref={ref}\n        className={cn(\n          'tollerud-card w-full rounded-xl border border-tollerud-border bg-tollerud-surface px-8 py-11 text-center',\n          className\n        )}\n        {...props}\n      >\n        <h2 className=\"tollerud-display mx-auto max-w-[640px] text-center text-[30px] text-tollerud-text-primary\">\n          {title}\n        </h2>\n        {description && (\n          <p className=\"mx-auto mt-3 max-w-[440px] text-center text-[15px] text-tollerud-text-secondary\">\n            {description}\n          </p>\n        )}\n        {actions && (\n          <div className=\"mt-[22px] flex flex-wrap items-center justify-center gap-3\">{actions}</div>\n        )}\n        {accentBar && (\n          <hr className=\"tollerud-accent-bar tollerud-accent-bar--inline mx-auto mt-8 max-w-[320px] border-0\" />\n        )}\n      </div>\n    )\n  }\n)\nCTABand.displayName = 'CTABand'\n\nexport { CTABand }\n"]}

package/dist/{chunk-6SKTH45H.js → chunk-J2Z4ZFVX.js}

@@ -1,20 +1,38 @@
 'use client';
 import { cn } from './chunk-WSQNPRGN.js';
-import { forwardRef, useId } from 'react';
+import { forwardRef, useId, Children, isValidElement, cloneElement } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
 var RadioGroup = forwardRef(
-  ({ label, error, children, className }, ref) => {
+  ({ label, error, value, onChange, name: nameProp, children, className }, ref) => {
+    const autoName = useId();
+    const name = nameProp ?? autoName;
+    const wired = Children.map(children, (child) => {
+      if (!isValidElement(child)) return child;
+      const radio = child;
+      const optionValue = radio.props.value;
+      if (optionValue === void 0) return child;
+      const option = String(optionValue);
+      const checked = value !== void 0 ? value === option : radio.props.checked;
+      return cloneElement(radio, {
+        name,
+        ...checked !== void 0 ? { checked } : {},
+        onChange: (e) => {
+          radio.props.onChange?.(e);
+          if (e.target.checked) onChange?.(option);
+        }
+      });
+    });
     return /* @__PURE__ */ jsxs("fieldset", { ref, className: cn("flex flex-col gap-1", className), children: [
       label && /* @__PURE__ */ jsx("legend", { className: "text-xs font-medium text-tollerud-text-muted mb-1", children: label }),
-      /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2", children }),
+      /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2", children: wired }),
       error && /* @__PURE__ */ jsx("p", { className: "text-xs text-tollerud-error mt-0.5", children: error })
     ] });
   }
 );
 RadioGroup.displayName = "RadioGroup";
 var Radio = forwardRef(
-  ({ className, label, id: idProp, ...props }, ref) => {
+  ({ className, label, id: idProp, checked, ...props }, ref) => {
     const autoId = useId();
     const id = idProp ?? autoId;
     return /* @__PURE__ */ jsxs(
@@ -35,6 +53,7 @@ var Radio = forwardRef(
                 ref,
                 id,
                 type: "radio",
+                ...checked !== void 0 ? { checked } : {},
                 className: "peer sr-only",
                 ...props
               }
@@ -43,22 +62,14 @@ var Radio = forwardRef(
               "span",
               {
                 className: cn(
-                  "h-4 w-4 rounded-full border transition-all duration-[150ms]",
+                  "flex h-4 w-4 items-center justify-center rounded-full border transition-all duration-[150ms]",
                   "bg-tollerud-surface-raised border-tollerud-border",
                   "peer-focus-visible:outline-2 peer-focus-visible:outline-tollerud-yellow",
                   "peer-checked:border-tollerud-yellow",
-                  "group-hover:border-tollerud-text-secondary",
-                  "flex items-center justify-center"
+                  "peer-checked:[&>span]:opacity-100",
+                  "group-hover:border-tollerud-text-secondary"
                 ),
-                children: /* @__PURE__ */ jsx(
-                  "span",
-                  {
-                    className: cn(
-                      "h-2 w-2 rounded-full bg-tollerud-yellow transition-opacity duration-[150ms]",
-                      props.checked ? "opacity-100" : "opacity-0"
-                    )
-                  }
-                )
+                children: /* @__PURE__ */ jsx("span", { className: "pointer-events-none h-2 w-2 rounded-full bg-tollerud-yellow opacity-0 transition-opacity duration-[150ms]" })
               }
             )
           ] }),
@@ -71,5 +82,5 @@ var Radio = forwardRef(
 Radio.displayName = "Radio";
 
 export { Radio, RadioGroup };
-//# sourceMappingURL=chunk-6SKTH45H.js.map
-//# sourceMappingURL=chunk-6SKTH45H.js.map
+//# sourceMappingURL=chunk-J2Z4ZFVX.js.map
+//# sourceMappingURL=chunk-J2Z4ZFVX.js.map

package/dist/chunk-J2Z4ZFVX.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/RadioGroup.tsx"],"names":[],"mappings":"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","file":"chunk-J2Z4ZFVX.js","sourcesContent":["'use client'\n\nimport {\n  Children,\n  cloneElement,\n  isValidElement,\n  type InputHTMLAttributes,\n  type ReactElement,\n  forwardRef,\n  useId,\n} from 'react'\nimport { cn } from '@/lib/utils'\n\nexport interface RadioGroupProps {\n  /** Group label */\n  label?: string\n  /** Error message */\n  error?: string\n  /** Controlled selected value */\n  value?: string\n  /** Called with the selected option value */\n  onChange?: (value: string) => void\n  /** Shared name for native radio grouping (auto-generated if omitted) */\n  name?: string\n  children?: React.ReactNode\n  className?: string\n}\n\nconst RadioGroup = forwardRef<HTMLFieldSetElement, RadioGroupProps>(\n  ({ label, error, value, onChange, name: nameProp, children, className }, ref) => {\n    const autoName = useId()\n    const name = nameProp ?? autoName\n\n    const wired = Children.map(children, (child) => {\n      if (!isValidElement(child)) return child\n      const radio = child as ReactElement<RadioProps>\n      const optionValue = radio.props.value\n      if (optionValue === undefined) return child\n\n      const option = String(optionValue)\n      const checked = value !== undefined ? value === option : radio.props.checked\n\n      return cloneElement(radio, {\n        name,\n        ...(checked !== undefined ? { checked } : {}),\n        onChange: (e) => {\n          radio.props.onChange?.(e)\n          if (e.target.checked) onChange?.(option)\n        },\n      })\n    })\n\n    return (\n      <fieldset ref={ref} className={cn('flex flex-col gap-1', className)}>\n        {label && (\n          <legend className=\"text-xs font-medium text-tollerud-text-muted mb-1\">\n            {label}\n          </legend>\n        )}\n        <div className=\"flex flex-col gap-2\">{wired}</div>\n        {error && (\n          <p className=\"text-xs text-tollerud-error mt-0.5\">{error}</p>\n        )}\n      </fieldset>\n    )\n  }\n)\nRadioGroup.displayName = 'RadioGroup'\n\nexport interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {\n  label?: string\n}\n\nconst Radio = forwardRef<HTMLInputElement, RadioProps>(\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 cursor-pointer select-none group',\n          'text-sm text-tollerud-text-primary',\n          props.disabled && 'opacity-50 pointer-events-none',\n          className\n        )}\n      >\n        <span className=\"relative flex items-center justify-center\">\n          <input\n            ref={ref}\n            id={id}\n            type=\"radio\"\n            {...(checked !== undefined ? { checked } : {})}\n            className=\"peer sr-only\"\n            {...props}\n          />\n          {/* Custom radio circle */}\n          <span\n            className={cn(\n              'flex h-4 w-4 items-center justify-center rounded-full border transition-all duration-[150ms]',\n              'bg-tollerud-surface-raised border-tollerud-border',\n              'peer-focus-visible:outline-2 peer-focus-visible:outline-tollerud-yellow',\n              'peer-checked:border-tollerud-yellow',\n              'peer-checked:[&>span]:opacity-100',\n              'group-hover:border-tollerud-text-secondary'\n            )}\n          >\n            {/* Inner dot — visible when checked (via peer on sibling input) */}\n            <span className=\"pointer-events-none h-2 w-2 rounded-full bg-tollerud-yellow opacity-0 transition-opacity duration-[150ms]\" />\n          </span>\n        </span>\n        {label && <span>{label}</span>}\n      </label>\n    )\n  }\n)\nRadio.displayName = 'Radio'\n\nexport { RadioGroup, Radio }"]}

package/dist/{chunk-ISHZ6ZPJ.js → chunk-JFOW2DI5.js}

@@ -3,9 +3,20 @@ import { cn } from './chunk-WSQNPRGN.js';
 import { forwardRef } from 'react';
 import { jsx } from 'react/jsx-runtime';
 
+var pillLayers = {
+  outline: "tollerud-pill--outline",
+  muted: "tollerud-pill--muted",
+  success: "tollerud-pill--success",
+  error: "tollerud-pill--error",
+  solid: "",
+  accent: ""
+};
 var pillVariants = {
-  outline: "bg-transparent border border-tollerud-border text-tollerud-text-secondary",
-  solid: "bg-tollerud-surface-raised text-tollerud-text-primary",
+  outline: "",
+  muted: "",
+  success: "",
+  error: "",
+  solid: "bg-tollerud-surface-raised text-tollerud-text-primary border-transparent",
   accent: "bg-tollerud-yellow/15 border border-tollerud-yellow/30 text-tollerud-yellow"
 };
 var Pill = forwardRef(
@@ -15,7 +26,8 @@ var Pill = forwardRef(
       {
         ref,
         className: cn(
-          "inline-flex items-center gap-1 px-2.5 py-1 text-xs font-medium rounded-full leading-none",
+          "tollerud-pill inline-flex items-center gap-1 leading-none",
+          pillLayers[variant],
           pillVariants[variant],
           className
         ),
@@ -27,5 +39,5 @@ var Pill = forwardRef(
 Pill.displayName = "Pill";
 
 export { Pill };
-//# sourceMappingURL=chunk-ISHZ6ZPJ.js.map
-//# sourceMappingURL=chunk-ISHZ6ZPJ.js.map
+//# sourceMappingURL=chunk-JFOW2DI5.js.map
+//# sourceMappingURL=chunk-JFOW2DI5.js.map

package/dist/chunk-JFOW2DI5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/Pill.tsx"],"names":[],"mappings":";;;;AAIA,IAAM,UAAA,GAAa;AAAA,EACjB,OAAA,EAAS,wBAAA;AAAA,EACT,KAAA,EAAO,sBAAA;AAAA,EACP,OAAA,EAAS,wBAAA;AAAA,EACT,KAAA,EAAO,sBAAA;AAAA,EACP,KAAA,EAAO,EAAA;AAAA,EACP,MAAA,EAAQ;AACV,CAAA;AAEA,IAAM,YAAA,GAAe;AAAA,EACnB,OAAA,EAAS,EAAA;AAAA,EACT,KAAA,EAAO,EAAA;AAAA,EACP,OAAA,EAAS,EAAA;AAAA,EACT,KAAA,EAAO,EAAA;AAAA,EACP,KAAA,EAAO,0EAAA;AAAA,EACP,MAAA,EAAQ;AACV,CAAA;AAMA,IAAM,IAAA,GAAO,UAAA;AAAA,EACX,CAAC,EAAE,SAAA,EAAW,OAAA,GAAU,WAAW,GAAG,KAAA,IAAS,GAAA,KAAQ;AACrD,IAAA,uBACE,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,EAAA;AAAA,UACT,2DAAA;AAAA,UACA,WAAW,OAAO,CAAA;AAAA,UAClB,aAAa,OAAO,CAAA;AAAA,UACpB;AAAA,SACF;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AACA,IAAA,CAAK,WAAA,GAAc,MAAA","file":"chunk-JFOW2DI5.js","sourcesContent":["import { type HTMLAttributes, forwardRef } from 'react'\nimport { cn } from '@/lib/utils'\n\n/** Layer classes from globals-layers.css — colored mono tags */\nconst pillLayers = {\n  outline: 'tollerud-pill--outline',\n  muted: 'tollerud-pill--muted',\n  success: 'tollerud-pill--success',\n  error: 'tollerud-pill--error',\n  solid: '',\n  accent: '',\n} as const\n\nconst pillVariants = {\n  outline: '',\n  muted: '',\n  success: '',\n  error: '',\n  solid: 'bg-tollerud-surface-raised text-tollerud-text-primary border-transparent',\n  accent: 'bg-tollerud-yellow/15 border border-tollerud-yellow/30 text-tollerud-yellow',\n} as const\n\nexport interface PillProps extends HTMLAttributes<HTMLSpanElement> {\n  variant?: keyof typeof pillVariants\n}\n\nconst Pill = forwardRef<HTMLSpanElement, PillProps>(\n  ({ className, variant = 'outline', ...props }, ref) => {\n    return (\n      <span\n        ref={ref}\n        className={cn(\n          'tollerud-pill inline-flex items-center gap-1 leading-none',\n          pillLayers[variant],\n          pillVariants[variant],\n          className\n        )}\n        {...props}\n      />\n    )\n  }\n)\nPill.displayName = 'Pill'\n\nexport { Pill }\n"]}

package/dist/{chunk-3TGMGBKM.js → chunk-K4ALNUZI.js}

@@ -1,11 +1,11 @@
 'use client';
+import { Skeleton } from './chunk-AQT3FZRQ.js';
 import { Segmented } from './chunk-NSMU66ZX.js';
-import { Skeleton } from './chunk-FGXOV2QH.js';
 import { Pagination } from './chunk-RJTDQOT2.js';
 import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuSeparator, DropdownMenuLabel, DropdownMenuItem } from './chunk-435JHF7G.js';
-import { Checkbox } from './chunk-T3TQPOVM.js';
+import { Checkbox } from './chunk-TLEKK53J.js';
 import { Badge } from './chunk-QEHTPQHL.js';
-import { Button } from './chunk-RWJELAS6.js';
+import { Button } from './chunk-BQWF5MP7.js';
 import { cn } from './chunk-WSQNPRGN.js';
 import { forwardRef, useMemo, useState } from 'react';
 import { Search, X, MoreHorizontal, ChevronDown } from 'lucide-react';
@@ -146,7 +146,7 @@ function DataTableInner({
     "th",
     {
       className: cn(
-        "px-3 py-2.5 text-xs font-semibold text-tollerud-text-muted uppercase tracking-wider",
+        "px-3 py-2.5 text-left text-xs font-semibold text-tollerud-text-muted uppercase tracking-wider",
         col.sortable && "cursor-pointer select-none hover:text-tollerud-text-primary transition-colors",
         col.align === "right" && "text-right",
         col.align === "center" && "text-center"
@@ -389,5 +389,5 @@ var DataTable = forwardRef((props, ref) => /* @__PURE__ */ jsx(DataTableInner, {
 DataTable.displayName = "DataTable";
 
 export { DataTable };
-//# sourceMappingURL=chunk-3TGMGBKM.js.map
-//# sourceMappingURL=chunk-3TGMGBKM.js.map
+//# sourceMappingURL=chunk-K4ALNUZI.js.map
+//# sourceMappingURL=chunk-K4ALNUZI.js.map