@nadicodeai/design-system 0.20.0 → 0.21.0

package/AGENTS.md

@@ -38,7 +38,7 @@ Handoff gate: `npm run lint:design && npm run lint && npm run build && npm run t
 - `DESIGN.md` `## Components` is the semantic component catalog; CSS is its implementation, and `tests/guards/component-contract-matches-css.test.ts` derives the two-way fence without a copied inventory.
 - `DESIGN.md` stays contract-only and spec-shaped: check `npm exec --package=@google/design.md -- design.md spec` before changing YAML fields; exact reusable values go in YAML, application guidance in prose; add a non-spec YAML field only when repo code or a test reads it (spec-shape don'ts: `DESIGN.md` "Do's and Don'ts").
 - Seams and grids are computed, single-owner, never eyeballed (doctrine home: `DESIGN.md` "## Layout" and "Seam Ownership").
-- External references are source-first: read live DOM/CSSOM rules before authoring; screenshots verify, they never author. Map every imported behavior to `DESIGN.md` or an explicit user approval, ask when the contract leaves a decision open, and never import reference mood, polarity, decoration, or animation uninvited. Stop and re-read source before a second visual patch to the same component.
-- Name everything as NadicodeAI-owned primitives; source brands (Vercel, Attio) appear only in reference notes, never in names, comments, or contracts.
+- Authoring is contract-first: a visual behavior comes from `DESIGN.md`, from our own shipped surfaces, or from an explicit user approval — never from another product's rendered output (ADR 0047). Screenshots verify, they never author. Ask when the contract leaves a decision open, and stop and re-read `DESIGN.md` before a second visual patch to the same component.
+- Name everything as NadicodeAI-owned primitives. A source brand appears only in a `../docs/adr/` decision record, as the history of what once inspired a choice; never in a name, a comment, a contract, or any living design document (ADR 0047).
 - Any change to package-consumed output ends with an explicit release decision, a version bump or a `[no-publish]` commit marker (enforced by the pre-push release gate; procedure: `../docs/internal/npm-publishing.md`).
 - The deleted `design-canvas/` prototypes live only in git history. `src/css/motion.css` owns shared runtime motion primitives, while `src/js/chat-autoplay.js` is the single allowed runtime JS enhancer; never reconstruct the prototypes or add a second runtime JS surface.

package/DESIGN.md

@@ -399,7 +399,7 @@ Do not delete a color because the current website kernel does not consume it. Pr
 
 ### Meter and bullet grammar
 
-- **Meter and bullet grammar**: cap and included-usage bars carry a positional threshold tick at the product-configured warning fraction (80% is the common default; the fraction is a consumer input, never a constant of this contract) and a cap tick at 100%. Overflow renders as a distinct segment continuing past the cap tick, never clamped away. Severity state tokens (`{colors.state-*}`) reinforce position, never act as the sole signal. The current value reads at the bar tip. Every meter carries an accessible name, and its `aria` values clamp to the meter maximum.
+- **Meter and bullet grammar**: cap and included-usage bars carry a positional threshold tick at the product-configured warning fraction (80% is the common default; the fraction is a consumer input, never a constant of this contract) and a cap tick at 100%. Overflow renders as a distinct segment continuing past the cap tick, never clamped away. Severity state tokens (`{colors.state-*}`) reinforce position, never act as the sole signal. The current value reads at the bar tip. Every meter carries an accessible name, and its `aria` values clamp to the meter maximum. A meter has two scales. At panel scale the grammar above holds whole. At row scale — a meter inside a membership row, shown only once the value is already past the warning rung — it is a warning rather than a gauge: it drops both ticks and the tip value for a percent and a thin bar on one line, because a row cannot encode position legibly and the reader is asking how close the wall is, not how many. The overflow segment and the accessible name survive at both scales; the words a caption would have printed live in that name.
 
 ### Mark specs
 
@@ -419,7 +419,7 @@ Do not delete a color because the current website kernel does not consume it. Pr
 
 ## Typography
 
-Geist Sans carries all narrative and interface copy, including the entity-status `status-tag` family. Geist Mono is reserved for eyebrows, labels, run-state `state-tag` labels, code, traces, and small technical metadata.
+Geist Sans and Geist Mono are the two families. Each token below carries its own — `caption-mono` and `code` are Geist Mono, every other token is Geist Sans — and its Use column says what that token is for. The register law that decides which family a given string takes, and what a card, panel, or section title therefore takes, is stated once in `## Components` → **`label-mono`**.
 
 All body, title, caption, and code typography uses `letterSpacing: 0px`. Do not use viewport-scaled type (no `vw`/`vh` font sizing): use fixed token sizes stepped by breakpoint-specific rules when a headline must grow. The two large display tiers carry a small negative tracking — `display-xl` at `-1.5px` and `display-lg` at `-1px` — so large type reads optically tight; this is a display-heading-only exception and every non-display tier stays at `0px`.
 
@@ -439,7 +439,7 @@ All body, title, caption, and code typography uses `letterSpacing: 0px`. Do not
 | `{typography.body-sm-strong}` | 14px | 500    | 20px        | Emphasised secondary copy and compact labels.                              |
 | `{typography.caption}`        | 12px | 400    | 16px        | Footer secondary lines and badge labels.                                   |
 | `{typography.caption-strong}` | 12px | 500    | 16px        | Entity-status `status-tag` labels.                                         |
-| `{typography.caption-mono}`   | 12px | 500    | 16px        | Eyebrows, labels, run-state `state-tag` labels.                            |
+| `{typography.caption-mono}`   | 12px | 500    | 16px        | Eyebrows, identifiers and code, run-state `state-tag` labels.              |
 | `{typography.code}`           | 13px | 400    | 20px        | Tool calls, snippets, traces.                                              |
 | `{typography.button-lg}`      | 16px | 500    | 24px        | Marketing-scale button labels.                                             |
 | `{typography.button-md}`      | 14px | 500    | 18px        | Standard button and control labels.                                        |
@@ -584,7 +584,7 @@ Interface CSS components provide small metadata, label, and link chrome. They in
 
 Interactive CSS components must expose a visible `:focus-visible` state using the `{spacing.focus-ring-width}` full-opacity `{colors.focus-ring}` / `{colors.dark-focus-ring}` role with no offset. Do not remove outlines without that contrast-safe equivalent.
 
-**`label-mono`** — mono eyebrow/label text for section labels and low-priority metadata.
+**`label-mono`** — mono eyebrow text, identifiers and code, and low-priority metadata. The mono register marks what the machine owns, not what a heading says, so a card, panel, or section title never takes it: titles are sentence-case sans.
 
 **`badge-secondary`** — small rounded metadata badge for "New", "Beta", "Live", or similar labels.
 
@@ -745,6 +745,8 @@ The NadicodeAI logo has three approved forms:
 2. **Mark.** The two interlocked rounded-square links may stand alone where space is tight: favicons, app icons, avatars, watermarks, stamps, and compact navigation. A containing link or control names NadicodeAI when the mark is used without visible text.
 3. **Wordmark.** The NadicodeAI letterforms may stand alone where the name must read by itself, including document headers and editorial layouts.
 
+Other companies' marks are not NadicodeAI company logos and are not governed by anything in this section. They are generated identity images owned by `@nadicodeai/ui/components/brand-icons`, decided in [`docs/adr/0042-third-party-brand-marks-are-generated-identity-images.md`](../docs/adr/0042-third-party-brand-marks-are-generated-identity-images.md). A third-party mark never enters a NadicodeAI logo form, composition, or clear-space measurement.
+
 Nadia's portrait and generated imagery are not NadicodeAI company logos. Their identity and selection rules live in [`brand/visual-design/NADIA-VISUAL-IDENTITY.md`](../brand/visual-design/NADIA-VISUAL-IDENTITY.md); editorial imagery routes through [`brand/visual-design/EDITORIAL-ILLUSTRATION.md`](../brand/visual-design/EDITORIAL-ILLUSTRATION.md). This contract owns only the package delivery interface.
 
 The approved transparent Nadia master ships at `assets/nadia-solid-surface`.

package/dist/css/index.css

@@ -913,8 +913,6 @@
       opacity: 0;
       transform: none;
     }
-    .nc-transition-paint,
-    .nc-transition-opacity,
     .nc-transition-transform {
       transition: none;
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nadicodeai/design-system",
-  "version": "0.20.0",
+  "version": "0.21.0",
   "type": "module",
   "publishConfig": {
     "access": "public"