@nadicodeai/ui 0.1.1 → 0.3.0

package/dist/components/installer-shell.js

@@ -5,17 +5,14 @@ import { cn } from "../lib/utils.js";
 import { Card, CardContent, CardHeader, } from "./card.js";
 import { FeedbackState } from "./feedback-state.js";
 import { Progress } from "./progress.js";
-const installerFeedbackStatus = {
-    welcome: "empty",
-    progress: "loading",
-    success: "empty",
-    failure: "error",
-};
-const installerIcons = {
-    welcome: _jsx(SparklesIcon, { className: "size-5" }),
-    progress: _jsx(LoaderCircleIcon, { className: "size-5 animate-spin" }),
-    success: _jsx(CheckCircleIcon, { className: "size-5" }),
-    failure: _jsx(XCircleIcon, { className: "size-5" }),
+const installerStateMeta = {
+    welcome: { status: "empty", icon: _jsx(SparklesIcon, { className: "size-5" }) },
+    progress: {
+        status: "loading",
+        icon: _jsx(LoaderCircleIcon, { className: "size-5 animate-spin" }),
+    },
+    success: { status: "empty", icon: _jsx(CheckCircleIcon, { className: "size-5" }) },
+    failure: { status: "error", icon: _jsx(XCircleIcon, { className: "size-5" }) },
 };
 const installerStepIcons = {
     pending: _jsx(CircleIcon, { className: "size-4" }),
@@ -31,6 +28,6 @@ function InstallerShellStepList({ steps, }) {
 }
 function InstallerShell({ state, title, description, progressValue, steps, actions, aside, children, progressLabel = "Installer progress", className, contentClassName, ...props }) {
     const showProgress = state === "progress" && typeof progressValue === "number";
-    return (_jsx("section", { "data-slot": "installer-shell", "data-state": state, className: cn("grid min-h-svh place-items-center bg-background p-4 text-foreground md:p-6", className), ...props, children: _jsxs(Card, { className: "w-full max-w-3xl overflow-hidden", children: [_jsx(CardHeader, { children: _jsx(FeedbackState, { "data-slot": "installer-shell-feedback", status: installerFeedbackStatus[state], title: title, description: description, icon: installerIcons[state], actions: actions, compact: true, className: "rounded-none border-0 bg-transparent p-0 md:p-0" }) }), _jsxs(CardContent, { "data-slot": "installer-shell-content", className: cn("grid gap-5", contentClassName), children: [showProgress && (_jsxs("div", { "data-slot": "installer-shell-progress", className: "grid gap-2", children: [_jsxs("div", { className: "flex items-center justify-between gap-3 text-sm", children: [_jsx("span", { className: "font-medium", children: progressLabel }), _jsxs("span", { className: "text-muted-foreground", children: [Math.round(progressValue), "%"] })] }), _jsx(Progress, { value: progressValue, "aria-label": progressLabel })] })), steps?.length ? _jsx(InstallerShellStepList, { steps: steps }) : null, children && (_jsx("div", { "data-slot": "installer-shell-primary", className: "min-w-0", children: children })), aside && (_jsx("div", { "data-slot": "installer-shell-aside", className: "rounded-md border bg-muted/30 p-4 text-sm text-muted-foreground", children: aside }))] })] }) }));
+    return (_jsx("section", { "data-slot": "installer-shell", "data-state": state, className: cn("grid min-h-svh place-items-center bg-background p-4 text-foreground md:p-6", className), ...props, children: _jsxs(Card, { className: "w-full max-w-3xl overflow-hidden", children: [_jsx(CardHeader, { children: _jsx(FeedbackState, { "data-slot": "installer-shell-feedback", status: installerStateMeta[state].status, title: title, description: description, icon: installerStateMeta[state].icon, actions: actions, compact: true, className: "rounded-none border-0 bg-transparent p-0 md:p-0" }) }), _jsxs(CardContent, { "data-slot": "installer-shell-content", className: cn("grid gap-5", contentClassName), children: [showProgress && (_jsxs("div", { "data-slot": "installer-shell-progress", className: "grid gap-2", children: [_jsxs("div", { className: "flex items-center justify-between gap-3 text-sm", children: [_jsx("span", { className: "font-medium", children: progressLabel }), _jsxs("span", { className: "text-muted-foreground", children: [Math.round(progressValue), "%"] })] }), _jsx(Progress, { value: progressValue, "aria-label": progressLabel })] })), steps?.length ? _jsx(InstallerShellStepList, { steps: steps }) : null, children && (_jsx("div", { "data-slot": "installer-shell-primary", className: "min-w-0", children: children })), aside && (_jsx("div", { "data-slot": "installer-shell-aside", className: "rounded-md border bg-muted/30 p-4 text-sm text-muted-foreground", children: aside }))] })] }) }));
 }
 export { InstallerShell };

package/dist/components/logo-band.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"logo-band.d.ts","sourceRoot":"","sources":["../../src/components/logo-band.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B;;;;;;;;;;;;;GAaG;AAEH,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,OAAW,EACX,OAAkB,EAClB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;IAC3B,OAAO,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAA;CAC3B,qBAqBA;AAED,iBAAS,QAAQ,CAAC,EAChB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,qBAEvC;AAED,iBAAS,gBAAgB,CAAC,EACxB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,qBAEvC;AAED,OAAO,EAAE,QAAQ,EAAE,gBAAgB,EAAE,CAAA"}
+{"version":3,"file":"logo-band.d.ts","sourceRoot":"","sources":["../../src/components/logo-band.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B;;;;;;;;;;;;;GAaG;AAEH,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,OAAW,EACX,OAAkB,EAClB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;IAC3B,OAAO,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAA;CAC3B,qBAmBA;AAED,iBAAS,QAAQ,CAAC,EAChB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,qBAEvC;AAED,iBAAS,gBAAgB,CAAC,EACxB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,QAAQ,CAAC,qBAEvC;AAED,OAAO,EAAE,QAAQ,EAAE,gBAAgB,EAAE,CAAA"}

package/dist/components/logo-band.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { cn } from "../lib/utils.js";
+import { seamSurfaceClass } from "../lib/seam.js";
 /**
  * logo-band / integrations-grid — wall of monochrome marks (replaces the retired
  * `sections/logo-band.css` + `sections/integrations-grid.css` + their coupled
@@ -22,9 +23,7 @@ function LogoGrid({ className, columns = 4, surface = "canvas", ...props }) {
         5: "grid-cols-2 sm:grid-cols-3 lg:grid-cols-5",
         6: "grid-cols-2 sm:grid-cols-3 lg:grid-cols-6",
     };
-    return (_jsx("div", { className: cn("grid h-full gap-px", cols[columns], surface === "ink"
-            ? "bg-[color-mix(in_srgb,var(--nc-line)_40%,var(--nc-ink))]"
-            : "bg-border", className), ...props }));
+    return (_jsx("div", { className: cn("grid h-full gap-px", cols[columns], seamSurfaceClass(surface), className), ...props }));
 }
 function LogoBand({ ...props }) {
     return _jsx(LogoGrid, { "data-slot": "logo-band", ...props });

package/dist/components/pricing.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pricing.d.ts","sourceRoot":"","sources":["../../src/components/pricing.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,KAAK,eAAe,GAAG,MAAM,GAAG,UAAU,CAAA;AAE1C,iBAAS,OAAO,CAAC,EACf,SAAS,EACT,OAAW,EACX,QAAiB,EACjB,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,CAAA;IACf,QAAQ,CAAC,EAAE,eAAe,CAAA;CAC3B,qBA0CA;AAED,OAAO,EAAE,OAAO,EAAE,CAAA"}
+{"version":3,"file":"pricing.d.ts","sourceRoot":"","sources":["../../src/components/pricing.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,KAAK,eAAe,GAAG,MAAM,GAAG,UAAU,CAAA;AAE1C,iBAAS,OAAO,CAAC,EACf,SAAS,EACT,OAAW,EACX,QAAiB,EACjB,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,CAAA;IACf,QAAQ,CAAC,EAAE,eAAe,CAAA;CAC3B,qBA2CA;AAED,OAAO,EAAE,OAAO,EAAE,CAAA"}

package/dist/components/pricing.js

@@ -1,10 +1,12 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { cn } from "../lib/utils.js";
+import { SeamGrid } from "./seam-grid.js";
 function Pricing({ className, columns = 3, emphasis = "none", children, ...props }) {
-    return (_jsx("div", { "data-slot": "pricing", "data-emphasis": emphasis, className: cn(
-        // gap-as-seam: the grid is the single owner of every divider between tiers.
-        "grid h-full gap-px bg-border", columns === 2
+    return (_jsx(SeamGrid, { "data-slot": "pricing", "data-emphasis": emphasis, className: cn(
+        // gap-as-seam: SeamGrid (no surface) is the single owner of every divider
+        // between tiers (`gap-px bg-border`).
+        "h-full", columns === 2
             ? "grid-cols-1 sm:grid-cols-2"
             : "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3", 
         // the featured card is the rail's positioning context and gets the rail span.

package/dist/components/seam-grid.d.ts

@@ -0,0 +1,30 @@
+import * as React from "react";
+import { type SeamSurface } from "../lib/seam";
+/**
+ * SeamGrid is the single owner of the "gap-as-seam" grid mechanics shared by the
+ * bordered section grids (stats-band, testimonials, logo-band, and their siblings).
+ *
+ * SINGLE-OWNER SEAM: a `grid` with `gap-px` lets the panel paint one hairline at
+ * every cell boundary while borderless, square-cornered cells fill on top, so no
+ * coordinate ever carries two lines. The seam COLOUR is the only thing that flips
+ * with `surface`, and that colour comes from `seamSurfaceClass` in the internal
+ * `lib/seam` module, the one place the ink `color-mix(...)` string lives.
+ *
+ * `surface` is OPTIONAL. Pass `"canvas"` or `"ink"` (as the bordered proof bands
+ * do) to mark the grid with `data-surface` and pick the seam colour. Omit it for
+ * the plain canvas seam (`bg-border`) with NO `data-surface` marker, exactly the
+ * single-owner `gap-px bg-border` grid the canvas-only section grids render
+ * (faq, pricing, hero-split, bento, shift-band, action-band content, watch-it-work).
+ * Token-only; no `dark:` styling. Callers keep their own column maps, heights,
+ * `data-slot`, and extra classes by passing `className` and spreading props.
+ *
+ * This is a supported low-level layout primitive. The seam class helper stays
+ * module-private (`lib/seam`, no public subpath export); consumers reach for
+ * `SeamGrid` and its `surface` prop rather than the raw arbitrary Tailwind class
+ * string.
+ */
+declare function SeamGrid({ surface, className, ...props }: React.ComponentProps<"div"> & {
+    surface?: SeamSurface;
+}): React.JSX.Element;
+export { SeamGrid };
+//# sourceMappingURL=seam-grid.d.ts.map

package/dist/components/seam-grid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"seam-grid.d.ts","sourceRoot":"","sources":["../../src/components/seam-grid.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAAoB,KAAK,WAAW,EAAE,MAAM,YAAY,CAAA;AAE/D;;;;;;;;;;;;;;;;;;;;;;GAsBG;AAEH,iBAAS,QAAQ,CAAC,EAChB,OAAO,EACP,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAAE,OAAO,CAAC,EAAE,WAAW,CAAA;CAAE,qBAUzD;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA"}

package/dist/components/seam-grid.js

@@ -0,0 +1,30 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { cn } from "../lib/utils.js";
+import { seamSurfaceClass } from "../lib/seam.js";
+/**
+ * SeamGrid is the single owner of the "gap-as-seam" grid mechanics shared by the
+ * bordered section grids (stats-band, testimonials, logo-band, and their siblings).
+ *
+ * SINGLE-OWNER SEAM: a `grid` with `gap-px` lets the panel paint one hairline at
+ * every cell boundary while borderless, square-cornered cells fill on top, so no
+ * coordinate ever carries two lines. The seam COLOUR is the only thing that flips
+ * with `surface`, and that colour comes from `seamSurfaceClass` in the internal
+ * `lib/seam` module, the one place the ink `color-mix(...)` string lives.
+ *
+ * `surface` is OPTIONAL. Pass `"canvas"` or `"ink"` (as the bordered proof bands
+ * do) to mark the grid with `data-surface` and pick the seam colour. Omit it for
+ * the plain canvas seam (`bg-border`) with NO `data-surface` marker, exactly the
+ * single-owner `gap-px bg-border` grid the canvas-only section grids render
+ * (faq, pricing, hero-split, bento, shift-band, action-band content, watch-it-work).
+ * Token-only; no `dark:` styling. Callers keep their own column maps, heights,
+ * `data-slot`, and extra classes by passing `className` and spreading props.
+ *
+ * This is a supported low-level layout primitive. The seam class helper stays
+ * module-private (`lib/seam`, no public subpath export); consumers reach for
+ * `SeamGrid` and its `surface` prop rather than the raw arbitrary Tailwind class
+ * string.
+ */
+function SeamGrid({ surface, className, ...props }) {
+    return (_jsx("div", { "data-surface": surface, className: cn("grid gap-px", seamSurfaceClass(surface ?? "canvas"), className), ...props }));
+}
+export { SeamGrid };

package/dist/components/section-intro.js

@@ -17,6 +17,6 @@ function SectionIntroTitle({ className, size = "lg", ...props }) {
     return (_jsx("h2", { "data-slot": "section-intro-title", className: cn(size === "lg" ? "nc-type-title-lg" : "nc-type-title-md", "mx-auto text-foreground", className), ...props }));
 }
 function SectionIntroLead({ className, ...props }) {
-    return (_jsx("p", { "data-slot": "section-intro-lead", className: cn("nc-type-body-md mx-auto max-w-[64ch] text-muted-foreground", className), ...props }));
+    return (_jsx("p", { "data-slot": "section-intro-lead", className: cn("nc-type-body-md mx-auto max-w-[64ch] text-[var(--nc-body)]", className), ...props }));
 }
 export { SectionIntro, SectionIntroKicker, SectionIntroTitle, SectionIntroLead };

package/dist/components/select.js

@@ -13,7 +13,7 @@ function SelectValue({ ...props }) {
     return _jsx(SelectPrimitive.Value, { "data-slot": "select-value", ...props });
 }
 function SelectTrigger({ className, size = "default", children, ...props }) {
-    return (_jsxs(SelectPrimitive.Trigger, { "data-slot": "select-trigger", "data-size": size, className: cn("flex w-fit items-center justify-between gap-2 rounded-md border border-input bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[placeholder]:text-muted-foreground data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground", className), ...props, children: [children, _jsx(SelectPrimitive.Icon, { asChild: true, children: _jsx(ChevronDownIcon, { className: "size-4 opacity-50" }) })] }));
+    return (_jsxs(SelectPrimitive.Trigger, { "data-slot": "select-trigger", "data-size": size, className: cn("flex w-fit items-center justify-between gap-2 rounded-sm border border-input bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 data-[placeholder]:text-muted-foreground data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground", className), ...props, children: [children, _jsx(SelectPrimitive.Icon, { asChild: true, children: _jsx(ChevronDownIcon, { className: "size-4 opacity-50" }) })] }));
 }
 function SelectContent({ className, children, position = "item-aligned", align = "center", ...props }) {
     return (_jsx(SelectPrimitive.Portal, { children: _jsxs(SelectPrimitive.Content, { "data-slot": "select-content", className: cn("relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border bg-popover text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", position === "popper" &&

package/dist/components/shift-band.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"shift-band.d.ts","sourceRoot":"","sources":["../../src/components/shift-band.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAW9B,KAAK,cAAc,GAAG;IACpB,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;AAED,iBAAS,SAAS,CAAC,EACjB,MAAM,EACN,KAAK,EACL,QAAQ,EACR,MAAM,EACN,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,cAAc,EAAE,CAAA;CACzB,qBAsBA;AAED,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,qBAOxE;AAED,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,CAAA;AACnC,YAAY,EAAE,cAAc,EAAE,CAAA"}
+{"version":3,"file":"shift-band.d.ts","sourceRoot":"","sources":["../../src/components/shift-band.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAY9B,KAAK,cAAc,GAAG;IACpB,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;AAED,iBAAS,SAAS,CAAC,EACjB,MAAM,EACN,KAAK,EACL,QAAQ,EACR,MAAM,EACN,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,cAAc,EAAE,CAAA;CACzB,qBAsBA;AAED,iBAAS,aAAa,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,CAAC,cAAc,CAAC,GAAG,CAAC,qBAOxE;AAED,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,CAAA;AACnC,YAAY,EAAE,cAAc,EAAE,CAAA"}

package/dist/components/shift-band.js

@@ -1,8 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { cn } from "../lib/utils.js";
+import { SeamGrid } from "./seam-grid.js";
 import { SectionIntro, SectionIntroKicker, SectionIntroLead, SectionIntroTitle, } from "./section-intro.js";
 function ShiftBand({ kicker, title, children, proofs, className, ...props }) {
-    return (_jsxs("div", { "data-slot": "shift-band", className: cn("grid gap-px bg-border", className), ...props, children: [_jsxs(SectionIntro, { className: "justify-items-center text-center", children: [_jsx(SectionIntroKicker, { children: kicker }), _jsx(SectionIntroTitle, { className: "max-w-[18ch] text-balance text-center", children: title }), children] }), _jsx("div", { className: "grid gap-px bg-border md:grid-cols-4", children: proofs.map((proof) => (_jsxs("div", { className: "nc-panel-cell bg-card", children: [_jsx("h3", { className: "nc-type-body-md-strong text-foreground", children: proof.title }), _jsx("p", { className: "nc-type-body-sm text-muted-foreground", children: proof.body })] }, proof.title))) })] }));
+    return (_jsxs(SeamGrid, { "data-slot": "shift-band", className: className, ...props, children: [_jsxs(SectionIntro, { className: "justify-items-center text-center", children: [_jsx(SectionIntroKicker, { children: kicker }), _jsx(SectionIntroTitle, { className: "max-w-[18ch] text-balance text-center", children: title }), children] }), _jsx(SeamGrid, { className: "md:grid-cols-4", children: proofs.map((proof) => (_jsxs("div", { className: "nc-panel-cell bg-card", children: [_jsx("h3", { className: "nc-type-body-md-strong text-foreground", children: proof.title }), _jsx("p", { className: "nc-type-body-sm text-[var(--nc-body)]", children: proof.body })] }, proof.title))) })] }));
 }
 function ShiftBandLead({ className, ...props }) {
     return (_jsx(SectionIntroLead, { className: cn("text-balance text-center", className), ...props }));

package/dist/components/sonner.d.ts

@@ -1,4 +1,4 @@
 import { type ToasterProps } from "sonner";
-declare const Toaster: ({ ...props }: ToasterProps) => import("react").JSX.Element;
+declare const Toaster: ({ theme, ...props }: ToasterProps) => import("react").JSX.Element;
 export { Toaster };
 //# sourceMappingURL=sonner.d.ts.map

package/dist/components/sonner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"sonner.d.ts","sourceRoot":"","sources":["../../src/components/sonner.tsx"],"names":[],"mappings":"AASA,OAAO,EAAqB,KAAK,YAAY,EAAE,MAAM,QAAQ,CAAA;AAE7D,QAAA,MAAM,OAAO,GAAI,cAAc,YAAY,gCAuB1C,CAAA;AAED,OAAO,EAAE,OAAO,EAAE,CAAA"}
+{"version":3,"file":"sonner.d.ts","sourceRoot":"","sources":["../../src/components/sonner.tsx"],"names":[],"mappings":"AASA,OAAO,EAAqB,KAAK,YAAY,EAAE,MAAM,QAAQ,CAAA;AAE7D,QAAA,MAAM,OAAO,GAAI,qBAA+B,YAAY,gCAuB3D,CAAA;AAED,OAAO,EAAE,OAAO,EAAE,CAAA"}

package/dist/components/sonner.js

@@ -2,7 +2,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { CircleCheckIcon, InfoIcon, Loader2Icon, OctagonXIcon, TriangleAlertIcon, } from "lucide-react";
 import { Toaster as Sonner } from "sonner";
-const Toaster = ({ ...props }) => {
+const Toaster = ({ theme = "light", ...props }) => {
     return (_jsx(Sonner, { className: "toaster group", icons: {
             success: _jsx(CircleCheckIcon, { className: "size-4" }),
             info: _jsx(InfoIcon, { className: "size-4" }),
@@ -14,6 +14,6 @@ const Toaster = ({ ...props }) => {
             "--normal-text": "var(--popover-foreground)",
             "--normal-border": "var(--border)",
             "--border-radius": "var(--radius)",
-        }, ...props, theme: "light" }));
+        }, ...props, theme: theme }));
 };
 export { Toaster };

package/dist/components/state-notice.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+import type { AgentWorkState } from "./agent-message";
+declare function StateNotice({ state, icon: Icon, title, description, actions, className, ...props }: {
+    state: Exclude<AgentWorkState, "empty" | "idle">;
+    icon: React.ComponentType<{
+        className?: string;
+    }>;
+    title: React.ReactNode;
+    description?: React.ReactNode;
+    actions?: React.ReactNode;
+} & Omit<React.ComponentProps<"div">, "title">): React.JSX.Element;
+export { StateNotice };
+//# sourceMappingURL=state-notice.d.ts.map

package/dist/components/state-notice.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"state-notice.d.ts","sourceRoot":"","sources":["../../src/components/state-notice.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAA;AAIhE,iBAAS,WAAW,CAAC,EACnB,KAAK,EACL,IAAI,EAAE,IAAI,EACV,KAAK,EACL,WAAW,EACX,OAAO,EACP,SAAS,EACT,GAAG,KAAK,EACT,EAAE;IACD,KAAK,EAAE,OAAO,CAAC,cAAc,EAAE,OAAO,GAAG,MAAM,CAAC,CAAA;IAChD,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IACjD,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,OAAO,CAAC,qBA2B7C;AAED,OAAO,EAAE,WAAW,EAAE,CAAA"}

package/dist/components/state-notice.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { statePresentation } from "../lib/agent-work-state.js";
+import { cn } from "../lib/utils.js";
+function StateNotice({ state, icon: Icon, title, description, actions, className, ...props }) {
+    const { role, busy } = statePresentation(state);
+    return (_jsxs("div", { "data-agent-state": state, role: role, className: cn("flex flex-wrap items-center gap-3 border bg-muted/30 text-sm", className), ...props, children: [_jsx(Icon, { className: cn("size-4 text-muted-foreground", busy && "animate-spin") }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("div", { className: "font-medium", children: title }), description && (_jsx("div", { className: "text-muted-foreground", children: description }))] }), actions] }));
+}
+export { StateNotice };

package/dist/components/stats-band.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stats-band.d.ts","sourceRoot":"","sources":["../../src/components/stats-band.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B;;;;;;;;;;GAUG;AAEH,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,OAAW,EACX,OAAkB,EAClB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;IAC3B,OAAO,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAA;CAC3B,qBAwBA;AAED,OAAO,EAAE,SAAS,EAAE,CAAA"}
+{"version":3,"file":"stats-band.d.ts","sourceRoot":"","sources":["../../src/components/stats-band.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B;;;;;;;;;;GAUG;AAEH,iBAAS,SAAS,CAAC,EACjB,SAAS,EACT,OAAW,EACX,OAAkB,EAClB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;IAC3B,OAAO,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAA;CAC3B,qBAiBA;AAED,OAAO,EAAE,SAAS,EAAE,CAAA"}

package/dist/components/stats-band.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { cn } from "../lib/utils.js";
+import { SeamGrid } from "./seam-grid.js";
 /**
  * stats-band — proof row of headline statistics (replaces the retired
  * `sections/stats-band.css` + its coupled `stat-block` cells).
@@ -19,10 +20,8 @@ function StatsBand({ className, columns = 4, surface = "canvas", ...props }) {
         5: "grid-cols-2 lg:grid-cols-5",
         6: "grid-cols-2 lg:grid-cols-6",
     };
-    return (_jsx("div", { "data-slot": "stats-band", "data-surface": surface, className: cn("grid h-full gap-px", cols[columns], 
-        // single-owner seam: the grid owns every divider; ink flips only its colour.
-        surface === "ink"
-            ? "bg-[color-mix(in_srgb,var(--nc-line)_40%,var(--nc-ink))]"
-            : "bg-border", className), ...props }));
+    return (
+    // single-owner seam: SeamGrid owns every divider; ink flips only its colour.
+    _jsx(SeamGrid, { "data-slot": "stats-band", surface: surface, className: cn("h-full", cols[columns], className), ...props }));
 }
 export { StatsBand };

package/dist/components/testimonials.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"testimonials.d.ts","sourceRoot":"","sources":["../../src/components/testimonials.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAI9B;;;;;;;;;;;;;GAaG;AAEH,iBAAS,YAAY,CAAC,EACpB,SAAS,EACT,OAAO,EACP,OAAkB,EAClB,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,CAAA;IACf,OAAO,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAA;CAC3B,qBAkCA;AAED,OAAO,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"testimonials.d.ts","sourceRoot":"","sources":["../../src/components/testimonials.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B;;;;;;;;;;;;;GAaG;AAEH,iBAAS,YAAY,CAAC,EACpB,SAAS,EACT,OAAO,EACP,OAAkB,EAClB,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,CAAA;IACf,OAAO,CAAC,EAAE,QAAQ,GAAG,KAAK,CAAA;CAC3B,qBA+BA;AAED,OAAO,EAAE,YAAY,EAAE,CAAA"}

package/dist/components/testimonials.js

@@ -1,5 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { cn } from "../lib/utils.js";
+import { SeamGrid } from "./seam-grid.js";
 /**
  * testimonials — credibility row of customer quotes (replaces the retired
  * `sections/testimonials.css` + its coupled `quote-card` cells).
@@ -19,10 +20,8 @@ function Testimonials({ className, columns, surface = "canvas", children, ...pro
         // single featured mode — the lone card is centered; no grid, no seam.
         return (_jsx("div", { "data-slot": "testimonials", "data-surface": surface, className: cn("flex h-full items-center justify-center", className), ...props, children: _jsx("div", { className: "w-full max-w-[760px]", children: children }) }));
     }
-    return (_jsx("div", { "data-slot": "testimonials", "data-surface": surface, className: cn("grid h-full gap-px", columns === 2
+    return (_jsx(SeamGrid, { "data-slot": "testimonials", surface: surface, className: cn("h-full", columns === 2
             ? "grid-cols-1 sm:grid-cols-2"
-            : "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3", surface === "ink"
-            ? "bg-[color-mix(in_srgb,var(--nc-line)_40%,var(--nc-ink))]"
-            : "bg-border", className), ...props, children: children }));
+            : "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3", className), ...props, children: children }));
 }
 export { Testimonials };

package/dist/components/textarea.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { cn } from "../lib/utils.js";
 function Textarea({ className, ...props }) {
-    return (_jsx("textarea", { "data-slot": "textarea", className: cn("flex field-sizing-content min-h-16 w-full rounded-md border border-input bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 md:text-sm", className), ...props }));
+    return (_jsx("textarea", { "data-slot": "textarea", className: cn("flex field-sizing-content min-h-16 w-full rounded-sm border border-input bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 md:text-sm", className), ...props }));
 }
 export { Textarea };

package/dist/components/theme-mode-switcher.d.ts

@@ -0,0 +1,17 @@
+import * as React from "react";
+import { ToggleGroup } from "./toggle-group";
+import { isThemeMode, themeModes, type ThemeMode } from "../lib/theme-mode";
+export { isThemeMode, themeModes };
+export type { ThemeMode };
+export type ThemeModeOptionLabels = Record<ThemeMode, string>;
+export type ThemeModeSwitcherProps = Omit<React.ComponentProps<typeof ToggleGroup>, "children" | "defaultValue" | "onValueChange" | "type" | "value"> & {
+    "aria-label": string;
+    compact?: boolean;
+    itemClassName?: string;
+    labels: ThemeModeOptionLabels;
+    onValueChange: (value: ThemeMode) => void;
+    value: ThemeMode;
+};
+declare function ThemeModeSwitcher({ "aria-label": ariaLabel, className, compact, disabled, itemClassName, labels, onValueChange, value, ...props }: ThemeModeSwitcherProps): React.JSX.Element;
+export { ThemeModeSwitcher };
+//# sourceMappingURL=theme-mode-switcher.d.ts.map

package/dist/components/theme-mode-switcher.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-mode-switcher.d.ts","sourceRoot":"","sources":["../../src/components/theme-mode-switcher.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAAE,WAAW,EAAmB,MAAM,2BAA2B,CAAA;AACxE,OAAO,EACL,WAAW,EACX,UAAU,EACV,KAAK,SAAS,EACf,MAAM,kBAAkB,CAAA;AAGzB,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,CAAA;AAClC,YAAY,EAAE,SAAS,EAAE,CAAA;AAEzB,MAAM,MAAM,qBAAqB,GAAG,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,CAAA;AAE7D,MAAM,MAAM,sBAAsB,GAAG,IAAI,CACvC,KAAK,CAAC,cAAc,CAAC,OAAO,WAAW,CAAC,EACxC,UAAU,GAAG,cAAc,GAAG,eAAe,GAAG,MAAM,GAAG,OAAO,CACjE,GAAG;IACF,YAAY,EAAE,MAAM,CAAA;IACpB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,MAAM,EAAE,qBAAqB,CAAA;IAC7B,aAAa,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAA;IACzC,KAAK,EAAE,SAAS,CAAA;CACjB,CAAA;AAQD,iBAAS,iBAAiB,CAAC,EACzB,YAAY,EAAE,SAAS,EACvB,SAAS,EACT,OAAe,EACf,QAAQ,EACR,aAAa,EACb,MAAM,EACN,aAAa,EACb,KAAK,EACL,GAAG,KAAK,EACT,EAAE,sBAAsB,qBAuCxB;AAED,OAAO,EAAE,iBAAiB,EAAE,CAAA"}

package/dist/components/theme-mode-switcher.js

@@ -0,0 +1,24 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { MonitorIcon, MoonIcon, SunIcon } from "lucide-react";
+import { ToggleGroup, ToggleGroupItem } from "./toggle-group.js";
+import { isThemeMode, themeModes, } from "../lib/theme-mode.js";
+import { cn } from "../lib/utils.js";
+export { isThemeMode, themeModes };
+const themeModeIcons = {
+    light: SunIcon,
+    dark: MoonIcon,
+    system: MonitorIcon,
+};
+function ThemeModeSwitcher({ "aria-label": ariaLabel, className, compact = false, disabled, itemClassName, labels, onValueChange, value, ...props }) {
+    return (_jsx(ToggleGroup, { "aria-label": ariaLabel, className: cn("max-w-full", className), disabled: disabled, onValueChange: (nextValue) => {
+            if (isThemeMode(nextValue)) {
+                onValueChange(nextValue);
+            }
+        }, type: "single", value: value, variant: "outline", ...props, children: themeModes.map((mode) => {
+            const Icon = themeModeIcons[mode];
+            const label = labels[mode];
+            return (_jsxs(ToggleGroupItem, { "aria-label": label, className: cn("min-w-0 gap-1.5 px-2.5", compact ? "h-8 text-xs" : "h-9", itemClassName), disabled: disabled, value: mode, children: [_jsx(Icon, { "aria-hidden": "true", className: "size-4", "data-icon": true }), _jsx("span", { className: "min-w-0 truncate", children: label })] }, mode));
+        }) }));
+}
+export { ThemeModeSwitcher };

package/dist/components/use-case-bento.d.ts

@@ -1,13 +1,15 @@
 import * as React from "react";
-import { type DemoSurfaceScript } from "./demo-surface";
-declare function UseCaseBento({ kicker, title, body, proof, media, mediaClassName, demo, className, ...props }: React.ComponentProps<"article"> & {
+import { type DemoSurfaceLabels, type DemoSurfaceScript } from "./demo-surface";
+declare function UseCaseBento({ kicker, title, body, proof, proofLabel, media, mediaClassName, demo, demoLabels, className, ...props }: React.ComponentProps<"article"> & {
     kicker: string;
     title: string;
     body: string;
     proof: string;
+    proofLabel?: string;
     media: React.ReactNode;
     mediaClassName?: string;
     demo: DemoSurfaceScript;
+    demoLabels?: Partial<DemoSurfaceLabels>;
 }): React.JSX.Element;
 export { UseCaseBento };
 //# sourceMappingURL=use-case-bento.d.ts.map

package/dist/components/use-case-bento.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-case-bento.d.ts","sourceRoot":"","sources":["../../src/components/use-case-bento.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,OAAO,EAAe,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAGpE,iBAAS,YAAY,CAAC,EACpB,MAAM,EACN,KAAK,EACL,IAAI,EACJ,KAAK,EACL,KAAK,EACL,cAAc,EACd,IAAI,EACJ,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC,GAAG;IACnC,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,IAAI,EAAE,iBAAiB,CAAA;CACxB,qBAmDA;AAED,OAAO,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"use-case-bento.d.ts","sourceRoot":"","sources":["../../src/components/use-case-bento.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,OAAO,EAEL,KAAK,iBAAiB,EACtB,KAAK,iBAAiB,EACvB,MAAM,gBAAgB,CAAA;AAGvB,iBAAS,YAAY,CAAC,EACpB,MAAM,EACN,KAAK,EACL,IAAI,EACJ,KAAK,EACL,UAAmC,EACnC,KAAK,EACL,cAAc,EACd,IAAI,EACJ,UAAU,EACV,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC,GAAG;IACnC,MAAM,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,MAAM,CAAA;IACb,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,IAAI,EAAE,iBAAiB,CAAA;IACvB,UAAU,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAA;CACxC,qBAmDA;AAED,OAAO,EAAE,YAAY,EAAE,CAAA"}

package/dist/components/use-case-bento.js

@@ -1,9 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { cn } from "../lib/utils.js";
 import { Bento, BentoCopy, BentoDemo, BentoItem, BentoMedia } from "./bento.js";
-import { DemoSurface } from "./demo-surface.js";
+import { DemoSurface, } from "./demo-surface.js";
 import { MediaMount } from "./media-mount.js";
-function UseCaseBento({ kicker, title, body, proof, media, mediaClassName, demo, className, ...props }) {
-    return (_jsx("article", { "data-slot": "use-case-bento", className: className, ...props, children: _jsxs(Bento, { height: "primary", children: [_jsxs(BentoItem, { span: 3, children: [_jsx("div", { className: "nc-artifact-surface pointer-events-none absolute inset-0 border-0 p-0 opacity-60", "aria-hidden": "true" }), _jsxs(BentoCopy, { children: [_jsx("p", { className: "nc-type-caption-mono text-muted-foreground uppercase", children: kicker }), _jsx("h3", { className: "nc-type-title-md text-foreground", children: title }), _jsx("p", { className: "nc-type-body-sm text-muted-foreground", children: body }), _jsxs("div", { className: "grid gap-2 border-t border-border pt-4", children: [_jsx("p", { className: "nc-type-caption-mono text-muted-foreground uppercase", children: "What the agent shows" }), _jsx("p", { className: "nc-type-body-sm text-foreground", children: proof })] })] })] }), _jsx(BentoItem, { span: 5, flush: true, stretch: true, className: "min-h-[var(--nc-h-bento-primary)]", children: _jsx(BentoMedia, { children: _jsx(MediaMount, { ratio: "auto", className: cn("!h-full min-h-[var(--nc-h-bento-primary)]", mediaClassName), children: media }) }) }), _jsx(BentoItem, { span: 4, surface: "soft", stretch: true, className: "min-h-0 p-[var(--nc-sm)]", children: _jsx(BentoDemo, { children: _jsx(DemoSurface, { script: demo, title: title }) }) })] }) }));
+function UseCaseBento({ kicker, title, body, proof, proofLabel = "What the agent shows", media, mediaClassName, demo, demoLabels, className, ...props }) {
+    return (_jsx("article", { "data-slot": "use-case-bento", className: className, ...props, children: _jsxs(Bento, { height: "primary", children: [_jsxs(BentoItem, { span: 3, children: [_jsx("div", { className: "nc-artifact-surface pointer-events-none absolute inset-0 border-0 p-0 opacity-60", "aria-hidden": "true" }), _jsxs(BentoCopy, { children: [_jsx("p", { className: "nc-type-caption-mono text-muted-foreground uppercase", children: kicker }), _jsx("h3", { className: "nc-type-title-md text-foreground", children: title }), _jsx("p", { className: "nc-type-body-sm text-[var(--nc-body)]", children: body }), _jsxs("div", { className: "grid gap-2 border-t border-border pt-4", children: [_jsx("p", { className: "nc-type-caption-mono text-muted-foreground uppercase", children: proofLabel }), _jsx("p", { className: "nc-type-body-sm text-foreground", children: proof })] })] })] }), _jsx(BentoItem, { span: 5, flush: true, stretch: true, className: "min-h-[var(--nc-h-bento-primary)]", children: _jsx(BentoMedia, { children: _jsx(MediaMount, { ratio: "auto", className: cn("!h-full min-h-[var(--nc-h-bento-primary)]", mediaClassName), children: media }) }) }), _jsx(BentoItem, { span: 4, surface: "soft", stretch: true, className: "min-h-0 p-[var(--nc-sm)]", children: _jsx(BentoDemo, { children: _jsx(DemoSurface, { labels: demoLabels, script: demo, title: title }) }) })] }) }));
 }
 export { UseCaseBento };

package/dist/components/watch-it-work-band.d.ts

@@ -1,11 +1,12 @@
 import * as React from "react";
-import { type DemoSurfaceScript } from "./demo-surface";
-declare function WatchItWorkBand({ kicker, title, lead, primaryDemo, secondaryDemo, className, ...props }: React.ComponentProps<"div"> & {
+import { type DemoSurfaceLabels, type DemoSurfaceScript } from "./demo-surface";
+declare function WatchItWorkBand({ kicker, title, lead, primaryDemo, secondaryDemo, demoLabels, className, ...props }: React.ComponentProps<"div"> & {
     kicker?: string;
     title?: string;
     lead?: string;
     primaryDemo?: DemoSurfaceScript;
     secondaryDemo?: DemoSurfaceScript;
+    demoLabels?: Partial<DemoSurfaceLabels>;
 }): React.JSX.Element;
 export { WatchItWorkBand };
 //# sourceMappingURL=watch-it-work-band.d.ts.map

package/dist/components/watch-it-work-band.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"watch-it-work-band.d.ts","sourceRoot":"","sources":["../../src/components/watch-it-work-band.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,OAAO,EAAe,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AAEpE,iBAAS,eAAe,CAAC,EACvB,MAAgC,EAChC,KAAuB,EACvB,IAAI,EACJ,WAAW,EACX,aAAa,EACb,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,iBAAiB,CAAA;IAC/B,aAAa,CAAC,EAAE,iBAAiB,CAAA;CAClC,qBA8BA;AAED,OAAO,EAAE,eAAe,EAAE,CAAA"}
+{"version":3,"file":"watch-it-work-band.d.ts","sourceRoot":"","sources":["../../src/components/watch-it-work-band.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,OAAO,EAEL,KAAK,iBAAiB,EACtB,KAAK,iBAAiB,EACvB,MAAM,gBAAgB,CAAA;AAEvB,iBAAS,eAAe,CAAC,EACvB,MAAgC,EAChC,KAAuB,EACvB,IAAI,EACJ,WAAW,EACX,aAAa,EACb,UAAU,EACV,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,iBAAiB,CAAA;IAC/B,aAAa,CAAC,EAAE,iBAAiB,CAAA;IACjC,UAAU,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAA;CACxC,qBA8BA;AAED,OAAO,EAAE,eAAe,EAAE,CAAA"}

package/dist/components/watch-it-work-band.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { cn } from "../lib/utils.js";
+import { SeamGrid } from "./seam-grid.js";
 import { Bento, BentoItem } from "./bento.js";
-import { DemoSurface } from "./demo-surface.js";
-function WatchItWorkBand({ kicker = "Product demonstration", title = "Watch it work", lead, primaryDemo, secondaryDemo, className, ...props }) {
-    return (_jsx("div", { "data-slot": "watch-it-work-band", className: cn("grid gap-px bg-border", className), ...props, children: _jsxs(Bento, { children: [_jsxs(BentoItem, { span: 4, children: [_jsx("p", { className: "nc-type-caption-mono text-muted-foreground uppercase", children: kicker }), _jsx("h2", { className: "nc-type-title-md text-foreground", children: title }), lead ? (_jsx("p", { className: "nc-type-body-md text-muted-foreground", children: lead })) : null] }), primaryDemo ? (_jsx(BentoItem, { span: 4, surface: "soft", stretch: true, className: "p-[var(--nc-sm)]", children: _jsx(DemoSurface, { script: primaryDemo, title: "Conversation" }) })) : null, secondaryDemo ? (_jsx(BentoItem, { span: 4, surface: "soft", stretch: true, className: "p-[var(--nc-sm)]", children: _jsx(DemoSurface, { script: secondaryDemo, title: "Screen" }) })) : null] }) }));
+import { DemoSurface, } from "./demo-surface.js";
+function WatchItWorkBand({ kicker = "Product demonstration", title = "Watch it work", lead, primaryDemo, secondaryDemo, demoLabels, className, ...props }) {
+    return (_jsx(SeamGrid, { "data-slot": "watch-it-work-band", className: className, ...props, children: _jsxs(Bento, { children: [_jsxs(BentoItem, { span: 4, children: [_jsx("p", { className: "nc-type-caption-mono text-muted-foreground uppercase", children: kicker }), _jsx("h2", { className: "nc-type-title-md text-foreground", children: title }), lead ? (_jsx("p", { className: "nc-type-body-md text-muted-foreground", children: lead })) : null] }), primaryDemo ? (_jsx(BentoItem, { span: 4, surface: "soft", stretch: true, className: "p-[var(--nc-sm)]", children: _jsx(DemoSurface, { labels: demoLabels, script: primaryDemo, title: "Conversation" }) })) : null, secondaryDemo ? (_jsx(BentoItem, { span: 4, surface: "soft", stretch: true, className: "p-[var(--nc-sm)]", children: _jsx(DemoSurface, { labels: demoLabels, script: secondaryDemo, title: "Screen" }) })) : null] }) }));
 }
 export { WatchItWorkBand };

package/dist/index.d.ts

@@ -75,6 +75,7 @@ export * from "./components/quote-card";
 export * from "./components/radio-group";
 export * from "./components/resizable";
 export * from "./components/scroll-area";
+export * from "./components/seam-grid";
 export * from "./components/section-intro";
 export * from "./components/select";
 export * from "./components/separator";
@@ -87,12 +88,14 @@ export * from "./components/slider";
 export * from "./components/sonner";
 export * from "./components/spinner";
 export * from "./components/stat-block";
+export * from "./components/state-notice";
 export * from "./components/stats-band";
 export * from "./components/switch";
 export * from "./components/table";
 export * from "./components/tabs";
 export * from "./components/testimonials";
 export * from "./components/textarea";
+export * from "./components/theme-mode-switcher";
 export * from "./components/toggle";
 export * from "./components/toggle-group";
 export * from "./components/tooltip";

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/dist/index.js

@@ -75,6 +75,7 @@ export * from "./components/quote-card.js";
 export * from "./components/radio-group.js";
 export * from "./components/resizable.js";
 export * from "./components/scroll-area.js";
+export * from "./components/seam-grid.js";
 export * from "./components/section-intro.js";
 export * from "./components/select.js";
 export * from "./components/separator.js";
@@ -87,12 +88,14 @@ export * from "./components/slider.js";
 export * from "./components/sonner.js";
 export * from "./components/spinner.js";
 export * from "./components/stat-block.js";
+export * from "./components/state-notice.js";
 export * from "./components/stats-band.js";
 export * from "./components/switch.js";
 export * from "./components/table.js";
 export * from "./components/tabs.js";
 export * from "./components/testimonials.js";
 export * from "./components/textarea.js";
+export * from "./components/theme-mode-switcher.js";
 export * from "./components/toggle.js";
 export * from "./components/toggle-group.js";
 export * from "./components/tooltip.js";

package/dist/lib/agent-work-state.d.ts

@@ -0,0 +1,36 @@
+/**
+ * Internal seam for the `AgentWorkState` presentation contract.
+ *
+ * This module is the ONE place a work state's icon, ARIA `role`, and
+ * busy/motion signal are decided. Every caller (`agent-message.tsx`,
+ * `agent-thread.tsx`, `state-notice.tsx`) reads `statePresentation` instead
+ * of keeping its own copy of the icon table or the role/busy rule, so a
+ * future state's presentation rule has exactly one place to be added or
+ * fixed.
+ *
+ * This is NOT part of the public package surface. It has no `exports`
+ * subpath, matching `agent-attachment.ts` and `seam.ts` in this directory.
+ *
+ * Dependency direction is one-way: components import this module; this
+ * module never imports a component (no cycle).
+ */
+import type { ComponentType } from "react";
+type AgentWorkState = "idle" | "empty" | "queued" | "streaming" | "interrupted" | "retryable" | "permission-denied" | "fatal";
+type AgentWorkStatePresentation = {
+    icon: ComponentType<{
+        className?: string;
+    }>;
+    role: "alert" | "status";
+    busy: boolean;
+};
+/**
+ * statePresentation is the single source of truth for a presentable
+ * `AgentWorkState`'s icon, ARIA `role`, and busy/motion signal. Icon values
+ * reproduce `agent-message.tsx`'s `stateMeta` and `agent-thread.tsx`'s
+ * `threadStateDefaults` (confirmed byte-identical icon-for-icon); `role`
+ * and `busy` reproduce `state-notice.tsx`'s inline rules verbatim.
+ */
+declare function statePresentation(state: Exclude<AgentWorkState, "idle" | "empty">): AgentWorkStatePresentation;
+export { statePresentation };
+export type { AgentWorkState };
+//# sourceMappingURL=agent-work-state.d.ts.map

package/dist/lib/agent-work-state.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"agent-work-state.d.ts","sourceRoot":"","sources":["../../src/lib/agent-work-state.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAU1C,KAAK,cAAc,GACf,MAAM,GACN,OAAO,GACP,QAAQ,GACR,WAAW,GACX,aAAa,GACb,WAAW,GACX,mBAAmB,GACnB,OAAO,CAAA;AAEX,KAAK,0BAA0B,GAAG;IAChC,IAAI,EAAE,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IAC3C,IAAI,EAAE,OAAO,GAAG,QAAQ,CAAA;IACxB,IAAI,EAAE,OAAO,CAAA;CACd,CAAA;AAcD;;;;;;GAMG;AACH,iBAAS,iBAAiB,CACxB,KAAK,EAAE,OAAO,CAAC,cAAc,EAAE,MAAM,GAAG,OAAO,CAAC,GAC/C,0BAA0B,CAE5B;AAED,OAAO,EAAE,iBAAiB,EAAE,CAAA;AAC5B,YAAY,EAAE,cAAc,EAAE,CAAA"}