@nadicodeai/ui 12.1.155 → 12.1.157

package/dist/components/entry-scene.d.ts

@@ -24,6 +24,8 @@ export type EntrySceneProps = {
     presence?: ReactNode;
     /** Which view is open. A failure quiets the picture; it is never removed. */
     view?: string;
+    /** Shown inside a page or a drawer rather than filling the window: its corners round as a card's do. */
+    contained?: boolean;
     className?: string;
     /** The message, the actions, the progress line and the stage list. */
     children?: ReactNode;
@@ -34,13 +36,13 @@ export type EntrySceneProps = {
  * group. The screen is black in every theme.
  *
  * @family Compositions
- * @when Nadia's installer and the desktop's sign-in, start, update and failure screens, which paint the same screen; a page that shows that screen beside other things.
+ * @when Nadia's installer and the desktop's sign-in, start, update and failure screens, which paint the same screen; a page that shows that screen beside other things; the top of every Nadia pairing drawer, contained at 16:9 with only its short status.
  * @instead The Portal's entry pages are its funnel frame with the shared entry header; Alveare Server's entry is the HiveScene; a wait inside the product is a WaitingLine.
  * @behaviour It holds no state and decides nothing: which view is open, the words and when the screen ends belong to whoever mounts it. Required: the picture, the wordmark and the heading, because every entry screen has all three; a screen that leaves one out does not compile. It fills a box of the window's own shape (`aspectRatio`), so the picture's figure stands on the window's floor (`pictureFeet`). A failure quiets the picture and never removes it. Its children stand in order: the message, the actions, the progress line, the stage list.
  * @words The heading names the surface and is never seen. Instructions and status are one plain sentence that changes only when the real stage changes ("Loading your tools").
  * @access One level-1 heading for the screen, read but not shown; a message that reports work in progress is a status.
  */
-export declare function EntryScene({ aspectRatio, minHeight, picture, pictureFeet, wordmark, title, presence, view, className, children, }: EntrySceneProps): import("react").JSX.Element;
+export declare function EntryScene({ aspectRatio, minHeight, picture, pictureFeet, wordmark, title, presence, view, contained, className, children, }: EntrySceneProps): import("react").JSX.Element;
 /**
  * What the screen is doing, said plainly. `lines` reserves the room a longer
  * translation needs, so nothing below it moves between stages.

package/dist/components/entry-scene.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"entry-scene.d.ts","sourceRoot":"","sources":["../../src/components/entry-scene.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAiB,SAAS,EAAE,MAAM,OAAO,CAAC;AAItE,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,CAAC;AAE5D,MAAM,MAAM,eAAe,GAAG;IAC5B;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,0EAA0E;IAC1E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yEAAyE;IACzE,OAAO,EAAE,SAAS,CAAC;IACnB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,sDAAsD;IACtD,QAAQ,EAAE,SAAS,CAAC;IACpB,yEAAyE;IACzE,KAAK,EAAE,MAAM,CAAC;IACd,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,6EAA6E;IAC7E,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sEAAsE;IACtE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF;;;;;;;;;;;GAWG;AACH,wBAAgB,UAAU,CAAC,EACzB,WAA0B,EAC1B,SAAS,EACT,OAAO,EACP,WAAiB,EACjB,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,SAAS,EACT,QAAQ,GACT,EAAE,eAAe,+BAuBjB;AAED;;;GAGG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,IAAY,EACZ,SAAS,EACT,QAAQ,GACT,EAAE;IACD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oDAAoD;IACpD,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;CACrB,+BAWA;AAED,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE;IAAE,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,SAAS,CAAA;CAAE,+BAEhG;AAED;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,EAC1B,OAAmB,EACnB,OAAO,EACP,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,QAAQ,CAAC,GAAG;IAC5B,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,CAAC;IAClC,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,+BAYA;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,KAAK,EACL,SAAS,GACV,EAAE;IACD,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,+BAaA;AAED;;;;;;;;;GASG;AACH,wBAAgB,cAAc,CAAC,EAC7B,MAAM,EACN,SAAS,GACV,EAAE;IACD,MAAM,EAAE,aAAa,CAAC;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,cAAc,CAAA;KAAE,CAAC,CAAC;IAC3E,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,+BAeA"}
+{"version":3,"file":"entry-scene.d.ts","sourceRoot":"","sources":["../../src/components/entry-scene.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAiB,SAAS,EAAE,MAAM,OAAO,CAAC;AAItE,MAAM,MAAM,cAAc,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,CAAC;AAE5D,MAAM,MAAM,eAAe,GAAG;IAC5B;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,0EAA0E;IAC1E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yEAAyE;IACzE,OAAO,EAAE,SAAS,CAAC;IACnB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,sDAAsD;IACtD,QAAQ,EAAE,SAAS,CAAC;IACpB,yEAAyE;IACzE,KAAK,EAAE,MAAM,CAAC;IACd,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,6EAA6E;IAC7E,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,wGAAwG;IACxG,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sEAAsE;IACtE,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF;;;;;;;;;;;GAWG;AACH,wBAAgB,UAAU,CAAC,EACzB,WAA0B,EAC1B,SAAS,EACT,OAAO,EACP,WAAiB,EACjB,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,SAAiB,EACjB,SAAS,EACT,QAAQ,GACT,EAAE,eAAe,+BAwBjB;AAED;;;GAGG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,IAAY,EACZ,SAAS,EACT,QAAQ,GACT,EAAE;IACD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oDAAoD;IACpD,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,SAAS,CAAC;CACrB,+BAWA;AAED,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE;IAAE,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,SAAS,CAAA;CAAE,+BAEhG;AAED;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,EAC1B,OAAmB,EACnB,OAAO,EACP,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,CAAC,QAAQ,CAAC,GAAG;IAC5B,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,CAAC;IAClC,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,+BAYA;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,aAAa,CAAC,EAC5B,QAAQ,EACR,KAAK,EACL,SAAS,GACV,EAAE;IACD,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,+BAaA;AAED;;;;;;;;;GASG;AACH,wBAAgB,cAAc,CAAC,EAC7B,MAAM,EACN,SAAS,GACV,EAAE;IACD,MAAM,EAAE,aAAa,CAAC;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,cAAc,CAAA;KAAE,CAAC,CAAC;IAC3E,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,+BAeA"}

package/dist/components/entry-scene.js

@@ -6,14 +6,14 @@ import { cn } from "../lib/utils.js";
  * group. The screen is black in every theme.
  *
  * @family Compositions
- * @when Nadia's installer and the desktop's sign-in, start, update and failure screens, which paint the same screen; a page that shows that screen beside other things.
+ * @when Nadia's installer and the desktop's sign-in, start, update and failure screens, which paint the same screen; a page that shows that screen beside other things; the top of every Nadia pairing drawer, contained at 16:9 with only its short status.
  * @instead The Portal's entry pages are its funnel frame with the shared entry header; Alveare Server's entry is the HiveScene; a wait inside the product is a WaitingLine.
  * @behaviour It holds no state and decides nothing: which view is open, the words and when the screen ends belong to whoever mounts it. Required: the picture, the wordmark and the heading, because every entry screen has all three; a screen that leaves one out does not compile. It fills a box of the window's own shape (`aspectRatio`), so the picture's figure stands on the window's floor (`pictureFeet`). A failure quiets the picture and never removes it. Its children stand in order: the message, the actions, the progress line, the stage list.
  * @words The heading names the surface and is never seen. Instructions and status are one plain sentence that changes only when the real stage changes ("Loading your tools").
  * @access One level-1 heading for the screen, read but not shown; a message that reports work in progress is a status.
  */
-export function EntryScene({ aspectRatio = "1220 / 800", minHeight, picture, pictureFeet = 906, wordmark, title, presence, view, className, children, }) {
-    return (_jsx("div", { "data-slot": "entry-scene", className: cn("nc-entry-scene", className), 
+export function EntryScene({ aspectRatio = "1220 / 800", minHeight, picture, pictureFeet = 906, wordmark, title, presence, view, contained = false, className, children, }) {
+    return (_jsx("div", { "data-slot": "entry-scene", className: cn("nc-entry-scene", contained && "rounded-lg", className), "data-contained": contained || undefined, 
         // SAFETY: CSSProperties lists only standard properties; React sets each `--` custom property key here through style.setProperty.
         style: {
             aspectRatio,

package/dist/components/numbered-steps.d.ts

@@ -21,7 +21,7 @@ export type NumberedStepsProps = {
     framed?: boolean;
     columns?: never;
 } | {
-    /** The steps side by side from 640 px, two across then three, each number above its words: a short sequence a page explains. */
+    /** The steps side by side as their width allows, each at least 192 px wide, each number above its words: a short sequence a page explains. */
     columns: true;
     framed?: never;
 });
@@ -31,7 +31,7 @@ export type NumberedStepsProps = {
  * @family Other
  * @when A short sequence the person does: installing Nadia from Downloads, connecting Teams, the Dashboard's setup guide; or a sequence whose real progress the page tracks, such as the company check; and, as `columns`, the few steps a page explains, such as the website's how it works. Vercel draws its Speed Insights *Get Started* the same way: three numbered steps, each with its words and its own action.
  * @instead Stages the system runs on an entry screen are the EntryStageList; the steps of an Agent's run are a RunTimeline; a setup with a wait is a FormDrawer with its "Step 2 of 3" line.
- * @behaviour Each step is a 28 px square number in label-mono, its title, one muted description and, under it, the step's own action. Instructions mark no step and every number stays muted, because the page cannot know which one the person is on. Where the page tracks real progress, `current` turns that step's number to ink and writes its word beside the title. `framed` draws one bordered list with a seam between steps; `columns` sets the steps side by side from 640 px, two across then three, each number above its words, and is never framed. Colour is neutral: the current number is ink on the page's background and the others are muted; no hue marks a step. It is the one owner of a drawn step number.
+ * @behaviour Each step is a 28 px square number in label-mono, its title, one muted description and, under it, the step's own action. Instructions mark no step and every number stays muted, because the page cannot know which one the person is on. Where the page tracks real progress, `current` turns that step's number to ink and writes its word beside the title. `framed` draws one bordered list with a seam between steps; `columns` sets the steps side by side as the width it is given allows, each column at least 192 px, so a phone stacks them and a wide page or panel holds three, each number above its words, and is never framed. A step's action never grows past its step: one wider than the step is held to its width. Colour is neutral: the current number is ink on the page's background and the others are muted; no hue marks a step. It is the one owner of a drawn step number.
  * @words The title is what the person does, in the imperative ("Install Nadia"), or a finished step in the past tense ("Sofia looked up acme.it"). The current step's word is short: "Now". An action names its verb and carries its platform line ("macOS · 2.14.0 · Apple silicon").
  * @access An ordered list named by `label`, so assistive technology reads the count and position; the drawn numbers are hidden. The current step carries `aria-current="step"`. The titles are not headings, so the list never breaks the page's heading order.
  */

package/dist/components/numbered-steps.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"numbered-steps.d.ts","sourceRoot":"","sources":["../../src/components/numbered-steps.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,MAAM,MAAM,YAAY,GAAG;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,8DAA8D;IAC9D,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,+DAA+D;IAC/D,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,qBAAqB;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,YAAY,EAAE,CAAC;IAC/B,gHAAgH;IAChH,OAAO,CAAC,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;CACzC,GAAG,CACA;IACE,mDAAmD;IACnD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,KAAK,CAAC;CACjB,GACD;IACE,gIAAgI;IAChI,OAAO,EAAE,IAAI,CAAC;IACd,MAAM,CAAC,EAAE,KAAK,CAAC;CAChB,CACJ,CAAC;AAEF;;;;;;;;;GASG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,KAAK,EACL,OAAO,EACP,MAAc,EACd,OAAO,GACR,EAAE,kBAAkB,+BAgEpB"}
+{"version":3,"file":"numbered-steps.d.ts","sourceRoot":"","sources":["../../src/components/numbered-steps.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,MAAM,MAAM,YAAY,GAAG;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,8DAA8D;IAC9D,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,+DAA+D;IAC/D,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,qBAAqB;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,YAAY,EAAE,CAAC;IAC/B,gHAAgH;IAChH,OAAO,CAAC,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;CACzC,GAAG,CACA;IACE,mDAAmD;IACnD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,KAAK,CAAC;CACjB,GACD;IACE,8IAA8I;IAC9I,OAAO,EAAE,IAAI,CAAC;IACd,MAAM,CAAC,EAAE,KAAK,CAAC;CAChB,CACJ,CAAC;AAEF;;;;;;;;;GASG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,KAAK,EACL,OAAO,EACP,MAAc,EACd,OAAO,GACR,EAAE,kBAAkB,+BAgEpB"}

package/dist/components/numbered-steps.js

@@ -6,20 +6,20 @@ import { cn } from "../lib/utils.js";
  * @family Other
  * @when A short sequence the person does: installing Nadia from Downloads, connecting Teams, the Dashboard's setup guide; or a sequence whose real progress the page tracks, such as the company check; and, as `columns`, the few steps a page explains, such as the website's how it works. Vercel draws its Speed Insights *Get Started* the same way: three numbered steps, each with its words and its own action.
  * @instead Stages the system runs on an entry screen are the EntryStageList; the steps of an Agent's run are a RunTimeline; a setup with a wait is a FormDrawer with its "Step 2 of 3" line.
- * @behaviour Each step is a 28 px square number in label-mono, its title, one muted description and, under it, the step's own action. Instructions mark no step and every number stays muted, because the page cannot know which one the person is on. Where the page tracks real progress, `current` turns that step's number to ink and writes its word beside the title. `framed` draws one bordered list with a seam between steps; `columns` sets the steps side by side from 640 px, two across then three, each number above its words, and is never framed. Colour is neutral: the current number is ink on the page's background and the others are muted; no hue marks a step. It is the one owner of a drawn step number.
+ * @behaviour Each step is a 28 px square number in label-mono, its title, one muted description and, under it, the step's own action. Instructions mark no step and every number stays muted, because the page cannot know which one the person is on. Where the page tracks real progress, `current` turns that step's number to ink and writes its word beside the title. `framed` draws one bordered list with a seam between steps; `columns` sets the steps side by side as the width it is given allows, each column at least 192 px, so a phone stacks them and a wide page or panel holds three, each number above its words, and is never framed. A step's action never grows past its step: one wider than the step is held to its width. Colour is neutral: the current number is ink on the page's background and the others are muted; no hue marks a step. It is the one owner of a drawn step number.
  * @words The title is what the person does, in the imperative ("Install Nadia"), or a finished step in the past tense ("Sofia looked up acme.it"). The current step's word is short: "Now". An action names its verb and carries its platform line ("macOS · 2.14.0 · Apple silicon").
  * @access An ordered list named by `label`, so assistive technology reads the count and position; the drawn numbers are hidden. The current step carries `aria-current="step"`. The titles are not headings, so the list never breaks the page's heading order.
  */
 export function NumberedSteps({ label, steps, current, framed = false, columns, }) {
     return (_jsx("ol", { "aria-label": label, className: cn(framed
             ? "grid divide-y divide-border rounded-md border border-border bg-card"
-            : "grid gap-6", columns && "gap-8 sm:grid-cols-2 lg:grid-cols-3"), "data-slot": "numbered-steps", children: steps.map((step, index) => {
+            : "grid gap-6", columns && "grid-cols-[repeat(auto-fit,minmax(min(100%,12rem),1fr))] gap-8"), "data-slot": "numbered-steps", children: steps.map((step, index) => {
             const word = current && step.id === current.id ? current.label : undefined;
             const isCurrent = word !== undefined;
             return (_jsxs("li", { "aria-current": isCurrent ? "step" : undefined, className: cn(columns
-                    ? "grid content-start gap-y-3"
+                    ? "grid grid-cols-[minmax(0,1fr)] content-start gap-y-3"
                     : "grid grid-cols-[1.75rem_minmax(0,1fr)] gap-x-3 gap-y-1", framed && "p-4"), children: [_jsx("span", { "aria-hidden": "true", className: isCurrent
                             ? "flex size-7 items-center justify-center rounded-md bg-foreground font-label-mono text-label-mono tabular-nums text-background"
-                            : "flex size-7 items-center justify-center rounded-md bg-muted font-label-mono text-label-mono tabular-nums text-muted-foreground", children: index + 1 }), _jsxs("div", { className: "flex min-h-7 min-w-0 flex-wrap items-center gap-2", children: [_jsx("span", { className: "text-body-sm font-medium text-foreground", children: step.title }), isCurrent ? (_jsx("span", { className: "font-label-mono text-label-mono uppercase text-muted-foreground", children: word })) : null] }), step.description ? (_jsx("div", { className: cn("text-body-sm text-muted-foreground", !columns && "col-start-2"), children: step.description })) : null, step.action ? (_jsx("div", { className: cn("grid justify-items-start gap-1.5", columns ? "pt-1" : "col-start-2 pt-3"), children: step.action })) : null] }, step.id));
+                            : "flex size-7 items-center justify-center rounded-md bg-muted font-label-mono text-label-mono tabular-nums text-muted-foreground", children: index + 1 }), _jsxs("div", { className: "flex min-h-7 min-w-0 flex-wrap items-center gap-2", children: [_jsx("span", { className: "text-body-sm font-medium text-foreground", children: step.title }), isCurrent ? (_jsx("span", { className: "font-label-mono text-label-mono uppercase text-muted-foreground", children: word })) : null] }), step.description ? (_jsx("div", { className: cn("text-body-sm text-muted-foreground", !columns && "col-start-2"), children: step.description })) : null, step.action ? (_jsx("div", { className: cn("grid grid-cols-[minmax(0,1fr)] justify-items-start gap-1.5 *:max-w-full", columns ? "pt-1" : "col-start-2 pt-3"), children: step.action })) : null] }, step.id));
         }) }));
 }

package/dist/components/pairing-code.d.ts

@@ -1,27 +1,33 @@
 import type * as React from "react";
 export type PairingCodeProps = Omit<React.ComponentProps<"div">, "children" | "role"> & {
-    /** The digits both screens show, such as "4821"; a leading zero is a digit. */
+    /** The characters the code holds, such as "4821" or "5QTH-LMWG"; a leading zero is a digit, and a "-" separates groups. */
     code: string;
     /** What the code is, in the person's language; a screen reader reads it before the digits. */
     label: string;
+    /** The code can no longer be used: it stays in view, dimmed, while the caller says why beside it. */
+    expired?: boolean;
 };
 /**
- * The short code two screens show at once so a person can tell they are talking
- * to each other, such as the four digits Nadia and Alveare Server both show
- * while a Nadia asks to join.
+ * The short code a person reads on one screen to pair it with another: compared
+ * between two screens, such as the four digits Nadia and Alveare Server both
+ * show while a Nadia asks to join, or typed on another device, such as the
+ * code WhatsApp asks for to link a device by its phone number.
  *
- * Each digit stands in its own cell, large enough to compare from across a
+ * Each character stands in its own cell, large enough to read from across a
  * desk. The caller places it.
  *
  * @family Data
  * @when Pairing two devices or apps a person can see side by side: the four digits Nadia and
- * Alveare Server both show while a Nadia asks to join.
- * @instead A code a person types is `InputOTP`. A link another device scans is `QrCode`.
- * @behaviour Each digit in its own cell at `heading-lg` with tabular figures, large enough to
- * compare from across a desk. A leading zero is a digit. It only shows a code and takes no input.
+ * Alveare Server both show while a Nadia asks to join; or a code the person types on another
+ * device, such as WhatsApp's linking code ("5QTH-LMWG") they type on the phone under Linked devices.
+ * @instead A code a person types into this screen is `InputOTP`. A link another device scans is `QrCode`.
+ * @behaviour Each character in its own cell at `heading-lg` with tabular figures, large enough to
+ * read from across a desk. A leading zero is a digit. A "-" is a narrow separator between groups,
+ * not a cell. An `expired` code stays in place, dimmed, so the person sees which code lapsed while
+ * the caller says so under it. It only shows a code and takes no input.
  * @words The label says what the code is: *Pairing code*.
- * @access `role="img"` named by the label and the digits read one by one.
+ * @access `role="img"` named by the label and the characters read one by one, the groups apart.
  */
-declare function PairingCode({ code, label, className, ...props }: PairingCodeProps): React.JSX.Element;
+declare function PairingCode({ code, label, expired, className, ...props }: PairingCodeProps): React.JSX.Element;
 export { PairingCode };
 //# sourceMappingURL=pairing-code.d.ts.map

package/dist/components/pairing-code.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pairing-code.d.ts","sourceRoot":"","sources":["../../src/components/pairing-code.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAIpC,MAAM,MAAM,gBAAgB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC,GAAG;IACtF,+EAA+E;IAC/E,IAAI,EAAE,MAAM,CAAC;IACb,8FAA8F;IAC9F,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF;;;;;;;;;;;;;;;;GAgBG;AACH,iBAAS,WAAW,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,qBAsB1E;AAED,OAAO,EAAE,WAAW,EAAE,CAAC"}
+{"version":3,"file":"pairing-code.d.ts","sourceRoot":"","sources":["../../src/components/pairing-code.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,KAAK,MAAM,OAAO,CAAC;AAIpC,MAAM,MAAM,gBAAgB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,UAAU,GAAG,MAAM,CAAC,GAAG;IACtF,2HAA2H;IAC3H,IAAI,EAAE,MAAM,CAAC;IACb,8FAA8F;IAC9F,KAAK,EAAE,MAAM,CAAC;IACd,qGAAqG;IACrG,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,iBAAS,WAAW,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,OAAe,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,qBAmC3F;AAED,OAAO,EAAE,WAAW,EAAE,CAAC"}

package/dist/components/pairing-code.js

@@ -1,24 +1,31 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { cn } from "../lib/utils.js";
 /**
- * The short code two screens show at once so a person can tell they are talking
- * to each other, such as the four digits Nadia and Alveare Server both show
- * while a Nadia asks to join.
+ * The short code a person reads on one screen to pair it with another: compared
+ * between two screens, such as the four digits Nadia and Alveare Server both
+ * show while a Nadia asks to join, or typed on another device, such as the
+ * code WhatsApp asks for to link a device by its phone number.
  *
- * Each digit stands in its own cell, large enough to compare from across a
+ * Each character stands in its own cell, large enough to read from across a
  * desk. The caller places it.
  *
  * @family Data
  * @when Pairing two devices or apps a person can see side by side: the four digits Nadia and
- * Alveare Server both show while a Nadia asks to join.
- * @instead A code a person types is `InputOTP`. A link another device scans is `QrCode`.
- * @behaviour Each digit in its own cell at `heading-lg` with tabular figures, large enough to
- * compare from across a desk. A leading zero is a digit. It only shows a code and takes no input.
+ * Alveare Server both show while a Nadia asks to join; or a code the person types on another
+ * device, such as WhatsApp's linking code ("5QTH-LMWG") they type on the phone under Linked devices.
+ * @instead A code a person types into this screen is `InputOTP`. A link another device scans is `QrCode`.
+ * @behaviour Each character in its own cell at `heading-lg` with tabular figures, large enough to
+ * read from across a desk. A leading zero is a digit. A "-" is a narrow separator between groups,
+ * not a cell. An `expired` code stays in place, dimmed, so the person sees which code lapsed while
+ * the caller says so under it. It only shows a code and takes no input.
  * @words The label says what the code is: *Pairing code*.
- * @access `role="img"` named by the label and the digits read one by one.
+ * @access `role="img"` named by the label and the characters read one by one, the groups apart.
  */
-function PairingCode({ code, label, className, ...props }) {
-    const digits = [...code];
-    return (_jsx("div", { ...props, "aria-label": `${label}: ${digits.join(" ")}`, className: cn("flex gap-2", className), "data-slot": "pairing-code", role: "img", children: digits.map((digit, place) => (_jsx("span", { "aria-hidden": "true", className: "grid h-16 w-12 place-items-center rounded-sm border border-border text-heading-lg text-foreground tabular-nums", "data-slot": "pairing-code-digit", children: digit }, place))) }));
+function PairingCode({ code, label, expired = false, className, ...props }) {
+    const groups = code.split("-").map((group) => [...group]);
+    return (_jsx("div", { ...props, "aria-label": `${label}: ${groups.map((group) => group.join(" ")).join(", ")}`, className: cn("flex items-center gap-2", expired && "opacity-50", className), "data-expired": expired || undefined, "data-slot": "pairing-code", role: "img", children: groups.map((group, groupPlace) => [
+            groupPlace > 0 ? (_jsx("span", { "aria-hidden": "true", className: "text-heading-lg text-muted-foreground", "data-slot": "pairing-code-separator", children: "-" }, `separator-${groupPlace}`)) : null,
+            ...group.map((digit, place) => (_jsx("span", { "aria-hidden": "true", className: "grid h-16 w-12 place-items-center rounded-sm border border-border text-heading-lg text-foreground tabular-nums", "data-slot": "pairing-code-digit", children: digit }, `${groupPlace}-${place}`))),
+        ]) }));
 }
 export { PairingCode };

package/dist/showcase/usage.generated.d.ts.map

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

package/dist/showcase/usage.generated.js

@@ -96,7 +96,7 @@ export const USAGE = [
         module: "entry-scene",
         family: "Compositions",
         summary: "Nadia's entry screen, contained: the approved picture of the surface behind, the wordmark at the upper left, Nadia's ribbon and her words centred as one group. The screen is black in every theme.",
-        when: "Nadia's installer and the desktop's sign-in, start, update and failure screens, which paint the same screen; a page that shows that screen beside other things.",
+        when: "Nadia's installer and the desktop's sign-in, start, update and failure screens, which paint the same screen; a page that shows that screen beside other things; the top of every Nadia pairing drawer, contained at 16:9 with only its short status.",
         instead: "The Portal's entry pages are its funnel frame with the shared entry header; Alveare Server's entry is the HiveScene; a wait inside the product is a WaitingLine.",
         behaviour: "It holds no state and decides nothing: which view is open, the words and when the screen ends belong to whoever mounts it. Required: the picture, the wordmark and the heading, because every entry screen has all three; a screen that leaves one out does not compile. It fills a box of the window's own shape (`aspectRatio`), so the picture's figure stands on the window's floor (`pictureFeet`). A failure quiets the picture and never removes it. Its children stand in order: the message, the actions, the progress line, the stage list.",
         words: 'The heading names the surface and is never seen. Instructions and status are one plain sentence that changes only when the real stage changes ("Loading your tools").',
@@ -1118,12 +1118,12 @@ export const USAGE = [
         name: "PairingCode",
         module: "pairing-code",
         family: "Data",
-        summary: "The short code two screens show at once so a person can tell they are talking to each other, such as the four digits Nadia and Alveare Server both show while a Nadia asks to join.",
-        when: "Pairing two devices or apps a person can see side by side: the four digits Nadia and Alveare Server both show while a Nadia asks to join.",
-        instead: "A code a person types is `InputOTP`. A link another device scans is `QrCode`.",
-        behaviour: "Each digit in its own cell at `heading-lg` with tabular figures, large enough to compare from across a desk. A leading zero is a digit. It only shows a code and takes no input.",
+        summary: "The short code a person reads on one screen to pair it with another: compared between two screens, such as the four digits Nadia and Alveare Server both show while a Nadia asks to join, or typed on another device, such as the code WhatsApp asks for to link a device by its phone number.",
+        when: 'Pairing two devices or apps a person can see side by side: the four digits Nadia and Alveare Server both show while a Nadia asks to join; or a code the person types on another device, such as WhatsApp\'s linking code ("5QTH-LMWG") they type on the phone under Linked devices.',
+        instead: "A code a person types into this screen is `InputOTP`. A link another device scans is `QrCode`.",
+        behaviour: 'Each character in its own cell at `heading-lg` with tabular figures, large enough to read from across a desk. A leading zero is a digit. A "-" is a narrow separator between groups, not a cell. An `expired` code stays in place, dimmed, so the person sees which code lapsed while the caller says so under it. It only shows a code and takes no input.',
         words: "The label says what the code is: *Pairing code*.",
-        access: '`role="img"` named by the label and the digits read one by one.',
+        access: '`role="img"` named by the label and the characters read one by one, the groups apart.',
     },
     {
         name: "Progress",
@@ -1781,7 +1781,7 @@ export const USAGE = [
         summary: "Steps a person follows, each with its number, its words and its own action.",
         when: "A short sequence the person does: installing Nadia from Downloads, connecting Teams, the Dashboard's setup guide; or a sequence whose real progress the page tracks, such as the company check; and, as `columns`, the few steps a page explains, such as the website's how it works. Vercel draws its Speed Insights *Get Started* the same way: three numbered steps, each with its words and its own action.",
         instead: 'Stages the system runs on an entry screen are the EntryStageList; the steps of an Agent\'s run are a RunTimeline; a setup with a wait is a FormDrawer with its "Step 2 of 3" line.',
-        behaviour: "Each step is a 28 px square number in label-mono, its title, one muted description and, under it, the step's own action. Instructions mark no step and every number stays muted, because the page cannot know which one the person is on. Where the page tracks real progress, `current` turns that step's number to ink and writes its word beside the title. `framed` draws one bordered list with a seam between steps; `columns` sets the steps side by side from 640 px, two across then three, each number above its words, and is never framed. Colour is neutral: the current number is ink on the page's background and the others are muted; no hue marks a step. It is the one owner of a drawn step number.",
+        behaviour: "Each step is a 28 px square number in label-mono, its title, one muted description and, under it, the step's own action. Instructions mark no step and every number stays muted, because the page cannot know which one the person is on. Where the page tracks real progress, `current` turns that step's number to ink and writes its word beside the title. `framed` draws one bordered list with a seam between steps; `columns` sets the steps side by side as the width it is given allows, each column at least 192 px, so a phone stacks them and a wide page or panel holds three, each number above its words, and is never framed. A step's action never grows past its step: one wider than the step is held to its width. Colour is neutral: the current number is ink on the page's background and the others are muted; no hue marks a step. It is the one owner of a drawn step number.",
         words: 'The title is what the person does, in the imperative ("Install Nadia"), or a finished step in the past tense ("Sofia looked up acme.it"). The current step\'s word is short: "Now". An action names its verb and carries its platform line ("macOS · 2.14.0 · Apple silicon").',
         access: 'An ordered list named by `label`, so assistive technology reads the count and position; the drawn numbers are hidden. The current step carries `aria-current="step"`. The titles are not headings, so the list never breaks the page\'s heading order.',
     },

package/dist/styles/components.css

@@ -616,6 +616,14 @@
   }
 }
 
+/*
+ * Contained, the scene is a card: the words wrap within its middle so a long
+ * status never reaches the picture's figure at the left.
+ */
+.nc-entry-scene[data-contained] .nc-entry-body {
+  max-width: 56%;
+}
+
 /*
  * Alveare's entry scene, the hive (`components/hive-scene.tsx`), in the
  * composition of Nadia's entry screen: the app's picture on a black ground and

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nadicodeai/ui",
-  "version": "12.1.155",
+  "version": "12.1.157",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -84,7 +84,7 @@
     "@base-ui/react": "^1.9.0",
     "@iconify-icons/logos": "^2.0.3",
     "@iconify/react": "^6.0.2",
-    "@nadicodeai/design-system": "12.1.155",
+    "@nadicodeai/design-system": "12.1.157",
     "@tanstack/react-table": "^9.3.1",
     "@vgpu/wgsl": "0.6.0",
     "class-variance-authority": "^0.7.1",