@nadicodeai/ui 0.2.0 → 0.3.0

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,6 +88,7 @@ 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";

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,6 +88,7 @@ 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";

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"}

package/dist/lib/agent-work-state.js

@@ -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 { AlertTriangleIcon, ClockIcon, FileWarningIcon, LoaderCircleIcon, RefreshCwIcon, ShieldXIcon, } from "lucide-react";
+const presentationByState = {
+    fatal: { busy: false, icon: FileWarningIcon, role: "alert" },
+    interrupted: { busy: false, icon: AlertTriangleIcon, role: "status" },
+    "permission-denied": { busy: false, icon: ShieldXIcon, role: "alert" },
+    queued: { busy: false, icon: ClockIcon, role: "status" },
+    retryable: { busy: false, icon: RefreshCwIcon, role: "status" },
+    streaming: { busy: true, icon: LoaderCircleIcon, role: "status" },
+};
+/**
+ * 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.
+ */
+function statePresentation(state) {
+    return presentationByState[state];
+}
+export { statePresentation };

package/dist/lib/seam.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Internal seam helper for the "gap-as-seam" grid mechanics.
+ *
+ * This module is the ONE place the ink seam `color-mix(...)` string lives, so a
+ * typo can no longer silently break one band's seam while the others stay
+ * correct. `SeamGrid` (the public primitive) and the `logo-band` grid owner both
+ * derive their seam colour from `seamSurfaceClass` here.
+ *
+ * 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`: canvas paints the brand `line` via `bg-border`; ink mixes the
+ * line toward the ink role so the seam stays a seam and never changes weight.
+ * Token-only; no `dark:` styling.
+ *
+ * This is NOT part of the public package surface. It has no `exports` subpath, so
+ * consumers couple to the `SeamGrid` component contract rather than to the exact
+ * arbitrary Tailwind class string. Keep it that way.
+ */
+type SeamSurface = "canvas" | "ink";
+/**
+ * seamSurfaceClass is the single source for the seam colour class. Internal code
+ * reaches for this (or `SeamGrid`, which wraps it) instead of hand-copying the ink
+ * `color-mix(...)` string into another grid owner.
+ */
+declare function seamSurfaceClass(surface: SeamSurface): string;
+export { seamSurfaceClass };
+export type { SeamSurface };
+//# sourceMappingURL=seam.d.ts.map

package/dist/lib/seam.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"seam.d.ts","sourceRoot":"","sources":["../../src/lib/seam.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;GAkBG;AAEH,KAAK,WAAW,GAAG,QAAQ,GAAG,KAAK,CAAA;AAEnC;;;;GAIG;AACH,iBAAS,gBAAgB,CAAC,OAAO,EAAE,WAAW,GAAG,MAAM,CAItD;AAED,OAAO,EAAE,gBAAgB,EAAE,CAAA;AAC3B,YAAY,EAAE,WAAW,EAAE,CAAA"}

package/dist/lib/seam.js

@@ -0,0 +1,30 @@
+/**
+ * Internal seam helper for the "gap-as-seam" grid mechanics.
+ *
+ * This module is the ONE place the ink seam `color-mix(...)` string lives, so a
+ * typo can no longer silently break one band's seam while the others stay
+ * correct. `SeamGrid` (the public primitive) and the `logo-band` grid owner both
+ * derive their seam colour from `seamSurfaceClass` here.
+ *
+ * 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`: canvas paints the brand `line` via `bg-border`; ink mixes the
+ * line toward the ink role so the seam stays a seam and never changes weight.
+ * Token-only; no `dark:` styling.
+ *
+ * This is NOT part of the public package surface. It has no `exports` subpath, so
+ * consumers couple to the `SeamGrid` component contract rather than to the exact
+ * arbitrary Tailwind class string. Keep it that way.
+ */
+/**
+ * seamSurfaceClass is the single source for the seam colour class. Internal code
+ * reaches for this (or `SeamGrid`, which wraps it) instead of hand-copying the ink
+ * `color-mix(...)` string into another grid owner.
+ */
+function seamSurfaceClass(surface) {
+    return surface === "ink"
+        ? "bg-[color-mix(in_srgb,var(--nc-line)_40%,var(--nc-ink))]"
+        : "bg-border";
+}
+export { seamSurfaceClass };

package/dist/styles/globals.css

@@ -102,7 +102,7 @@
   --nc-chat-artifact-surface: var(--popover);
   --nc-chat-inline-ref-surface: var(--nc-link-bg-soft);
   --nc-chat-directive-command: var(--nc-link);
-  --nc-chat-directive-skill: var(--nc-cyan-deep);
+  --nc-chat-directive-skill: var(--nc-info);
   --nc-chat-directive-theme: var(--nc-flag-red);
   --nc-composer-surface: var(--popover);
   --nc-composer-foreground: var(--popover-foreground);
@@ -139,15 +139,18 @@
   --nc-diff-file-header: var(--muted-foreground);
   --nc-code-surface: var(--nc-ink);
   --nc-code-border: var(--nc-body);
-  --nc-code-token-keyword: var(--nc-cyan);
+  /* cyan family retired per Italia color contract §6 (design-system). keyword
+     and terminal cyan roles repoint to info (blue-cobalto-700); function gets
+     a deeper blue-cobalto step so it stays visually distinct from keyword. */
+  --nc-code-token-keyword: var(--nc-info);
   --nc-code-token-string: var(--nc-success);
   --nc-code-token-comment: var(--nc-cross);
-  --nc-code-token-function: var(--nc-cyan-deep);
+  --nc-code-token-function: var(--nc-blue-cobalto-900);
 
   --nc-terminal-bg: var(--nc-ink);
   --nc-terminal-fg: var(--nc-on-primary);
   --nc-terminal-muted: var(--nc-cross);
-  --nc-terminal-cursor: var(--nc-cyan);
+  --nc-terminal-cursor: var(--nc-info);
   --nc-terminal-selection-bg: var(--nc-link-deep);
   --nc-terminal-ansi-black: var(--nc-ink);
   --nc-terminal-ansi-red: var(--nc-error);
@@ -155,15 +158,15 @@
   --nc-terminal-ansi-yellow: var(--nc-warning);
   --nc-terminal-ansi-blue: var(--nc-link);
   --nc-terminal-ansi-magenta: var(--nc-flag-red);
-  --nc-terminal-ansi-cyan: var(--nc-cyan);
+  --nc-terminal-ansi-cyan: var(--nc-info);
   --nc-terminal-ansi-white: var(--nc-on-primary);
   --nc-terminal-ansi-bright-black: var(--nc-body);
   --nc-terminal-ansi-bright-red: var(--nc-error-soft);
-  --nc-terminal-ansi-bright-green: var(--nc-cyan-soft);
+  --nc-terminal-ansi-bright-green: var(--nc-green-italia-400);
   --nc-terminal-ansi-bright-yellow: var(--nc-warning-soft);
-  --nc-terminal-ansi-bright-blue: var(--nc-cyan);
+  --nc-terminal-ansi-bright-blue: var(--nc-info);
   --nc-terminal-ansi-bright-magenta: var(--nc-flag-red);
-  --nc-terminal-ansi-bright-cyan: var(--nc-cyan-soft);
+  --nc-terminal-ansi-bright-cyan: var(--nc-blue-cobalto-200);
   --nc-terminal-ansi-bright-white: var(--nc-on-primary);
 
   --nc-model-provider-surface: var(--muted);
@@ -197,7 +200,7 @@
   --nc-app-text-secondary: var(--nc-cross);
   --nc-app-text-tertiary: var(--muted-foreground);
   --nc-app-text-inverse: var(--primary-foreground);
-  --nc-app-text-link: var(--nc-cyan-soft);
+  --nc-app-text-link: var(--nc-dark-cyan-soft);
   --nc-app-text-code: var(--nc-on-primary);
   --nc-app-text-placeholder: var(--nc-cross);
   --nc-app-text-disabled: var(--nc-body);
@@ -210,8 +213,8 @@
   --nc-chat-reasoning-surface: var(--accent);
   --nc-chat-artifact-surface: var(--popover);
   --nc-chat-inline-ref-surface: var(--nc-link-deep);
-  --nc-chat-directive-command: var(--nc-cyan);
-  --nc-chat-directive-skill: var(--nc-cyan-soft);
+  --nc-chat-directive-command: var(--nc-dark-cyan);
+  --nc-chat-directive-skill: var(--nc-dark-cyan-soft);
   --nc-chat-directive-theme: var(--nc-warning);
   --nc-composer-surface: var(--popover);
   --nc-composer-foreground: var(--popover-foreground);
@@ -219,70 +222,77 @@
   --nc-composer-ring: var(--ring);
 
   --nc-tool-pending: var(--nc-warning);
-  --nc-tool-running: var(--nc-cyan);
-  --nc-tool-success: var(--nc-cyan-soft);
+  --nc-tool-running: var(--nc-dark-cyan);
+  --nc-tool-success: var(--nc-dark-cyan-soft);
   --nc-tool-warning: var(--nc-warning);
   --nc-tool-error: var(--nc-error-soft);
   --nc-tool-muted: var(--nc-cross);
-  --nc-tool-approval-run: var(--nc-cyan-deep);
+  --nc-tool-approval-run: var(--nc-dark-cyan-deep);
   --nc-tool-approval-deny: var(--nc-error-soft);
-  --nc-tool-approval-session: var(--nc-cyan);
-  --nc-tool-approval-always: var(--nc-cyan-soft);
+  --nc-tool-approval-session: var(--nc-dark-cyan);
+  --nc-tool-approval-always: var(--nc-dark-cyan-soft);
 
-  --nc-status-info: var(--nc-cyan);
-  --nc-status-success: var(--nc-cyan-soft);
+  --nc-status-info: var(--nc-dark-cyan);
+  --nc-status-success: var(--nc-dark-cyan-soft);
   --nc-status-warning: var(--nc-warning);
   --nc-status-error: var(--nc-error-soft);
   --nc-status-paused: var(--nc-cross);
-  --nc-status-running: var(--nc-cyan);
+  --nc-status-running: var(--nc-dark-cyan);
   --nc-status-blocked: var(--nc-error-soft);
-  --nc-status-complete: var(--nc-cyan-soft);
+  --nc-status-complete: var(--nc-dark-cyan-soft);
   --nc-status-offline: var(--nc-cross);
-  --nc-status-online: var(--nc-cyan-soft);
+  --nc-status-online: var(--nc-dark-cyan-soft);
 
   --nc-diff-added-line: var(--nc-link-deep);
-  --nc-diff-added-word: var(--nc-cyan-soft);
+  --nc-diff-added-word: var(--nc-dark-cyan-soft);
   --nc-diff-removed-line: var(--nc-error-deep);
   --nc-diff-removed-word: var(--nc-error-soft);
   --nc-diff-hunk: var(--muted);
   --nc-diff-file-header: var(--muted-foreground);
-  --nc-code-surface: var(--nc-primary);
+  /* --nc-primary is now green-700 (Italia contract §4); code/terminal chrome
+     must stay near-black in dark mode too, so repoint to --nc-ink instead of
+     letting the code surface render green. */
+  --nc-code-surface: var(--nc-ink);
   --nc-code-border: var(--nc-body);
-  --nc-code-token-keyword: var(--nc-cyan);
-  --nc-code-token-string: var(--nc-cyan-soft);
+  /* cyan family retired per Italia color contract §6. dark-cyan/-soft/-deep
+     were kept unchanged in DESIGN.md specifically for this dark-mode "electric"
+     accent role, so repoint here rather than to info (which is the light-mode
+     replacement) to preserve the existing dark-theme look. */
+  --nc-code-token-keyword: var(--nc-dark-cyan);
+  --nc-code-token-string: var(--nc-dark-cyan-soft);
   --nc-code-token-comment: var(--nc-cross);
-  --nc-code-token-function: var(--nc-cyan-soft);
+  --nc-code-token-function: var(--nc-dark-cyan-soft);
 
-  --nc-terminal-bg: var(--nc-primary);
+  --nc-terminal-bg: var(--nc-ink);
   --nc-terminal-fg: var(--nc-on-primary);
   --nc-terminal-muted: var(--nc-cross);
-  --nc-terminal-cursor: var(--nc-cyan);
+  --nc-terminal-cursor: var(--nc-dark-cyan);
   --nc-terminal-selection-bg: var(--nc-link-deep);
   --nc-terminal-ansi-black: var(--nc-body);
   --nc-terminal-ansi-red: var(--nc-error-soft);
-  --nc-terminal-ansi-green: var(--nc-cyan-soft);
+  --nc-terminal-ansi-green: var(--nc-dark-cyan-soft);
   --nc-terminal-ansi-yellow: var(--nc-warning);
-  --nc-terminal-ansi-blue: var(--nc-cyan);
+  --nc-terminal-ansi-blue: var(--nc-dark-cyan);
   --nc-terminal-ansi-magenta: var(--nc-flag-red);
-  --nc-terminal-ansi-cyan: var(--nc-cyan-soft);
+  --nc-terminal-ansi-cyan: var(--nc-dark-cyan-soft);
   --nc-terminal-ansi-white: var(--nc-on-primary);
   --nc-terminal-ansi-bright-black: var(--nc-cross);
   --nc-terminal-ansi-bright-red: var(--nc-error-soft);
-  --nc-terminal-ansi-bright-green: var(--nc-cyan-soft);
+  --nc-terminal-ansi-bright-green: var(--nc-dark-cyan-soft);
   --nc-terminal-ansi-bright-yellow: var(--nc-warning-soft);
-  --nc-terminal-ansi-bright-blue: var(--nc-cyan);
+  --nc-terminal-ansi-bright-blue: var(--nc-dark-cyan);
   --nc-terminal-ansi-bright-magenta: var(--nc-flag-red);
-  --nc-terminal-ansi-bright-cyan: var(--nc-cyan-soft);
+  --nc-terminal-ansi-bright-cyan: var(--nc-dark-cyan-soft);
   --nc-terminal-ansi-bright-white: var(--nc-on-primary);
 
   --nc-model-provider-surface: var(--muted);
   --nc-model-capability-surface: var(--accent);
-  --nc-model-capability-border: var(--nc-cyan);
+  --nc-model-capability-border: var(--nc-dark-cyan);
   --nc-model-context-meter: var(--nc-warning);
   --nc-model-cost-warning: var(--nc-warning);
   --nc-model-rate-limit: var(--nc-error-soft);
 
-  --nc-plugin-permission-safe: var(--nc-cyan-soft);
+  --nc-plugin-permission-safe: var(--nc-dark-cyan-soft);
   --nc-plugin-permission-review: var(--nc-warning);
   --nc-plugin-permission-risk: var(--nc-flag-red);
   --nc-plugin-permission-denied: var(--nc-error-soft);

package/docs/agents/nadicodeai-ui.md

@@ -87,6 +87,11 @@ Current shipped product subpaths:
 - `@nadicodeai/ui/components/plugin-slot-boundary`
 - `@nadicodeai/ui/components/settings-section`
 
+`StateNotice` (`@nadicodeai/ui/components/state-notice`) is the supported
+low-level state-banner primitive behind `AgentMessageStateNotice` and
+`AgentThreadStateBanner`; it requires a `title` and owns the shared
+`role="status"`/`role="alert"` skeleton.
+
 ## Product Components And Migration
 
 Product components are presentational. Use them for shared settings, shell,
@@ -112,6 +117,23 @@ Read `docs/migration/nadia-consumer-readiness.md` before migrating a consumer.
 It lists the CSS imports, public subpaths, fixture redaction rules, and readiness
 gates.
 
+## Layout Primitives
+
+`SeamGrid` (`@nadicodeai/ui/components/seam-grid`) is a supported low-level layout
+primitive: the single owner of the "gap-as-seam" grid that backs the bordered
+section grids (stats band, testimonials, logo band, and siblings). It renders a
+`div` with the invariant `grid gap-px` base, so borderless, square-cornered cells
+paint one shared hairline seam at every boundary instead of doubling lines.
+
+Its only seam-specific prop is `surface`: `"canvas"` (default) paints the brand
+`line` via `bg-border`, and `"ink"` mixes the line toward the ink role for darker
+panels; the value is also mirrored on a `data-surface` attribute. Pass
+`className`, `children`, and any `div` props to keep a bespoke column map,
+heights, and `data-*` attributes. Reach for `SeamGrid` and its `surface` prop
+when building a new bordered grid rather than hand-copying the seam colour: the
+seam class helper is an internal `src/lib/seam` detail with no public subpath
+export, so nothing should couple to the raw arbitrary Tailwind class string.
+
 ## Forms
 
 Use the package's shadcn form stack as one model:

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nadicodeai/ui",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -41,7 +41,9 @@
     "skills"
   ],
   "scripts": {
+    "dev": "node scripts/dev-build.mjs --watch",
     "build": "rm -rf dist && tsc -p tsconfig.build.json && node scripts/fix-dist-imports.mjs && rm -rf dist/styles && cp -R src/styles dist/styles",
+    "build:fast": "node scripts/dev-build.mjs",
     "prepack": "npm run build",
     "test": "vitest run"
   },