@starci/grammar 0.4.12 → 0.5.0

package/dist/common/styles.css

@@ -1,5 +1,8 @@
 /* Common owns only universal structure/scales. Families supply material DNA. */
 @layer starci-grammar-common, starci-grammar-core, starci-grammar-heritage, starci-grammar-offset-pop;
+@import "./components-forms.css";
+@import "./components-overlays.css";
+@import "./components-navigation.css";
 
 @layer starci-grammar-common {
     .grammar-common-root {
@@ -11,6 +14,204 @@
         min-width: 0;
     }
 
+    /*
+     * THE ROOT OWNS EVERY VENDOR THEME VARIABLE.
+     *
+     * HeroUI declares its theme on `:root`, where each `color-mix()` is substituted against HeroUI's
+     * own light values, and a descendant inherits the RESULT. A family that re-declares `--accent`
+     * on its root therefore still received HeroUI's blue `--accent-soft`, and a dark scope still
+     * received HeroUI's light `--default`, `--field-background`, `--segment` and `--overlay`. So
+     * this root declares every HeroUI theme variable itself: the semantic ones get neutral,
+     * AA-safe defaults (bare Common is a real theme, light and dark), and every derived one is
+     * written in terms of the semantic ones, so it re-resolves on whichever family and theme scope
+     * it lands on. A family supplies its semantic values; the rest follows.
+     */
+    .grammar-common-root {
+        color-scheme: light;
+
+        --background: oklch(97.02% 0 0);
+        --foreground: oklch(21.03% 0.0059 285.89);
+        --surface: oklch(100% 0 0);
+        --surface-secondary: oklch(95.24% 0.0013 286.37);
+        --muted: oklch(49.5% 0.0138 285.94);
+        --border: oklch(90% 0.004 286.32);
+        --separator: oklch(92% 0.004 286.32);
+        --accent: oklch(53% 0.2 256);
+        --accent-foreground: oklch(99.11% 0 0);
+        --success: oklch(73.29% 0.1935 150.81);
+        --success-foreground: oklch(21.03% 0.0059 285.89);
+        --warning: oklch(78.19% 0.1585 72.33);
+        --warning-foreground: oklch(21.03% 0.0059 285.89);
+        --danger: oklch(55% 0.215 26);
+        --danger-foreground: oklch(99.11% 0 0);
+        --info: var(--accent);
+        --info-foreground: var(--accent-foreground);
+        --backdrop: rgb(0 0 0 / 50%);
+        --surface-shadow: 0 2px 4px 0 rgb(0 0 0 / 4%), 0 1px 2px 0 rgb(0 0 0 / 6%), 0 0 1px 0 rgb(0 0 0 / 6%);
+        --overlay-shadow: 0 2px 8px 0 rgb(0 0 0 / 6%), 0 -6px 12px 0 rgb(0 0 0 / 3%), 0 14px 28px 0 rgb(0 0 0 / 8%);
+        --field-shadow: 0 2px 4px 0 rgb(0 0 0 / 4%), 0 1px 2px 0 rgb(0 0 0 / 6%), 0 0 1px 0 rgb(0 0 0 / 6%);
+
+        /* Derived from the semantic set above, so they follow the family and theme in scope. */
+        --focus: var(--accent);
+        --link: var(--foreground);
+        --surface-foreground: var(--foreground);
+        --surface-secondary-foreground: var(--foreground);
+        --surface-tertiary: color-mix(in oklab, var(--surface-secondary) 98%, var(--foreground));
+        --surface-tertiary-foreground: var(--foreground);
+        --overlay: var(--surface);
+        --overlay-foreground: var(--foreground);
+        --default: color-mix(in oklab, var(--surface-secondary) 98%, var(--foreground));
+        --default-foreground: var(--foreground);
+        --segment: var(--surface);
+        --segment-foreground: var(--foreground);
+        --field-background: var(--surface);
+        --field-foreground: var(--foreground);
+        --field-placeholder: var(--muted);
+        --field-border: transparent;
+        --scrollbar-thumb: color-mix(in oklch, var(--foreground) 15%, transparent);
+        --scrollbar-track: transparent;
+        --scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
+        --surface-hover: color-mix(in oklab, var(--surface) 92%, var(--surface-foreground) 8%);
+        --default-hover: color-mix(in oklab, var(--default) 96%, var(--default-foreground) 4%);
+        --accent-hover: color-mix(in oklab, var(--accent) 90%, var(--accent-foreground) 10%);
+        --success-hover: color-mix(in oklab, var(--success) 90%, var(--success-foreground) 10%);
+        --warning-hover: color-mix(in oklab, var(--warning) 90%, var(--warning-foreground) 10%);
+        --danger-hover: color-mix(in oklab, var(--danger) 90%, var(--danger-foreground) 10%);
+        --field-hover: color-mix(in oklab, var(--field-background) 98%, var(--field-foreground) 2%);
+        --field-focus: var(--field-background);
+        --field-border-hover: color-mix(in oklab, var(--field-border, var(--border)) 88%, var(--field-foreground) 10%);
+        --field-border-focus: color-mix(in oklab, var(--field-border, var(--border)) 74%, var(--field-foreground) 22%);
+        --default-soft: color-mix(in oklab, var(--default) 50%, transparent);
+        --default-soft-foreground: var(--default-foreground);
+        --default-soft-hover: color-mix(in oklab, var(--default) 60%, transparent);
+        --accent-soft: color-mix(in oklab, var(--accent) 15%, transparent);
+        --accent-soft-foreground: color-mix(in oklab, var(--accent) 70%, var(--foreground) 30%);
+        --accent-soft-hover: color-mix(in oklab, var(--accent-soft) 94%, var(--accent));
+        --success-soft: color-mix(in oklab, var(--success) 15%, transparent);
+        --success-soft-foreground: color-mix(in oklab, var(--success) 50%, var(--foreground) 50%);
+        --success-soft-hover: color-mix(in oklab, var(--success) 20%, transparent);
+        --warning-soft: color-mix(in oklab, var(--warning) 15%, transparent);
+        --warning-soft-foreground: color-mix(in oklab, var(--warning) 45%, var(--foreground) 55%);
+        --warning-soft-hover: color-mix(in oklab, var(--warning) 20%, transparent);
+        --danger-soft: color-mix(in oklab, var(--danger) 15%, transparent);
+        --danger-soft-foreground: color-mix(in oklab, var(--danger) 65%, var(--foreground) 35%);
+        --danger-soft-hover: color-mix(in oklab, var(--danger) 20%, transparent);
+        --background-secondary: color-mix(in oklab, var(--background) 96%, var(--foreground) 4%);
+        --background-tertiary: color-mix(in oklab, var(--background) 92%, var(--foreground) 8%);
+        --background-inverse: var(--foreground);
+        --separator-secondary: color-mix(in oklab, var(--surface) 85%, var(--surface-foreground) 15%);
+        --separator-tertiary: color-mix(in oklab, var(--surface) 81%, var(--surface-foreground) 19%);
+        --border-secondary: color-mix(in oklab, var(--surface) 78%, var(--surface-foreground) 22%);
+        --border-tertiary: color-mix(in oklab, var(--surface) 66%, var(--surface-foreground) 34%);
+
+        color: var(--foreground);
+        background-color: var(--background);
+    }
+
+    /*
+     * A hover fill moves AWAY from its foreground, so the pair keeps (and gains) contrast instead
+     * of HeroUI's mix toward the foreground, which takes a 5:1 button under AA on hover. Relative
+     * colour inverts the foreground's lightness; without it the fill keeps the gentler vendor mix.
+     */
+    @supports (color: oklch(from white l c h)) {
+        .grammar-common-root {
+            --accent-hover: color-mix(in oklab, var(--accent) 90%, oklch(from var(--accent-foreground) calc(1 - l) 0 0));
+            --success-hover: color-mix(in oklab, var(--success) 90%, oklch(from var(--success-foreground) calc(1 - l) 0 0));
+            --warning-hover: color-mix(in oklab, var(--warning) 90%, oklch(from var(--warning-foreground) calc(1 - l) 0 0));
+            --danger-hover: color-mix(in oklab, var(--danger) 90%, oklch(from var(--danger-foreground) calc(1 - l) 0 0));
+        }
+    }
+
+    /* A real dark theme for bare Common; families override the semantic set, the mixes follow. */
+    .grammar-common-root[data-grammar-theme="dark"] {
+        color-scheme: dark;
+
+        --background: oklch(12% 0.005 285.82);
+        --foreground: oklch(99.11% 0 0);
+        --surface: oklch(21.03% 0.0059 285.89);
+        --surface-secondary: oklch(25.7% 0.0037 286.14);
+        --muted: oklch(72% 0.015 286.07);
+        --border: oklch(28% 0.006 286.03);
+        --separator: oklch(25% 0.006 286.03);
+        --accent: oklch(72% 0.14 250);
+        --accent-foreground: oklch(21.03% 0.0059 285.89);
+        --success: oklch(73.29% 0.1935 150.81);
+        --success-foreground: oklch(21.03% 0.0059 285.89);
+        --warning: oklch(82.03% 0.1388 76.34);
+        --warning-foreground: oklch(21.03% 0.0059 285.89);
+        --danger: oklch(70% 0.17 24);
+        --danger-foreground: oklch(21.03% 0.0059 285.89);
+        --backdrop: rgb(0 0 0 / 60%);
+        --surface-shadow: 0 0 0 0 transparent inset;
+        --overlay-shadow: 0 0 1px 0 rgb(255 255 255 / 30%) inset;
+        --field-shadow: 0 0 0 0 transparent inset;
+        --segment: color-mix(in oklab, var(--surface) 76%, var(--foreground));
+        --accent-soft: color-mix(in oklab, var(--accent) 16%, transparent);
+        --accent-soft-foreground: color-mix(in oklab, var(--accent) 70%, var(--foreground) 30%);
+        --success-soft: color-mix(in oklab, var(--success) 14%, transparent);
+        --success-soft-foreground: color-mix(in oklab, var(--success) 70%, var(--foreground) 30%);
+        --warning-soft: color-mix(in oklab, var(--warning) 14%, transparent);
+        --warning-soft-foreground: color-mix(in oklab, var(--warning) 70%, var(--foreground) 30%);
+        --danger-soft: color-mix(in oklab, var(--danger) 16%, transparent);
+        --danger-soft-foreground: color-mix(in oklab, var(--danger) 70%, var(--foreground) 30%);
+    }
+
+    @media (prefers-color-scheme: dark) {
+        .grammar-common-root[data-grammar-theme="system"] {
+            color-scheme: dark;
+
+            --background: oklch(12% 0.005 285.82);
+            --foreground: oklch(99.11% 0 0);
+            --surface: oklch(21.03% 0.0059 285.89);
+            --surface-secondary: oklch(25.7% 0.0037 286.14);
+            --muted: oklch(72% 0.015 286.07);
+            --border: oklch(28% 0.006 286.03);
+            --separator: oklch(25% 0.006 286.03);
+            --accent: oklch(72% 0.14 250);
+            --accent-foreground: oklch(21.03% 0.0059 285.89);
+            --success: oklch(73.29% 0.1935 150.81);
+            --success-foreground: oklch(21.03% 0.0059 285.89);
+            --warning: oklch(82.03% 0.1388 76.34);
+            --warning-foreground: oklch(21.03% 0.0059 285.89);
+            --danger: oklch(70% 0.17 24);
+            --danger-foreground: oklch(21.03% 0.0059 285.89);
+            --backdrop: rgb(0 0 0 / 60%);
+            --surface-shadow: 0 0 0 0 transparent inset;
+            --overlay-shadow: 0 0 1px 0 rgb(255 255 255 / 30%) inset;
+            --field-shadow: 0 0 0 0 transparent inset;
+            --segment: color-mix(in oklab, var(--surface) 76%, var(--foreground));
+            --accent-soft: color-mix(in oklab, var(--accent) 16%, transparent);
+            --accent-soft-foreground: color-mix(in oklab, var(--accent) 70%, var(--foreground) 30%);
+            --success-soft: color-mix(in oklab, var(--success) 14%, transparent);
+            --success-soft-foreground: color-mix(in oklab, var(--success) 70%, var(--foreground) 30%);
+            --warning-soft: color-mix(in oklab, var(--warning) 14%, transparent);
+            --warning-soft-foreground: color-mix(in oklab, var(--warning) 70%, var(--foreground) 30%);
+            --danger-soft: color-mix(in oklab, var(--danger) 16%, transparent);
+            --danger-soft-foreground: color-mix(in oklab, var(--danger) 70%, var(--foreground) 30%);
+        }
+    }
+
+    @media (forced-colors: active) {
+        .grammar-common-root,
+        .grammar-common-root[data-grammar-theme] {
+            --background: Canvas;
+            --foreground: CanvasText;
+            --surface: Canvas;
+            --surface-secondary: Canvas;
+            --muted: GrayText;
+            --border: CanvasText;
+            --separator: CanvasText;
+            --accent: Highlight;
+            --accent-foreground: HighlightText;
+            --success: CanvasText;
+            --success-foreground: Canvas;
+            --warning: CanvasText;
+            --warning-foreground: Canvas;
+            --danger: CanvasText;
+            --danger-foreground: Canvas;
+        }
+    }
+
     .grammar-common-root,
     .grammar-common-root::before,
     .grammar-common-root::after,
@@ -98,6 +299,35 @@
         flex: none;
     }
 
+    /*
+     * Keyboard-reachable scroll owners (VerticalScrollRegion / HorizontalScrollRegion when focusable,
+     * the Rail body, fenced code and Markdown table frames) draw the same inset focus ring the chat
+     * scroll owners use, so a Tab stop that scrolls is never invisible.
+     */
+    [data-grammar-scroll-region][tabindex="0"]:focus-visible,
+    .starci-core-horizontal-scroll-region[tabindex="0"]:focus-visible,
+    .starci-core-rail-body[tabindex="0"]:focus-visible,
+    .starci-core-fenced-code-block pre[tabindex="0"]:focus-visible,
+    .starci-core-markdown-table-frame[tabindex="0"]:focus-visible {
+        outline: 2px solid var(--focus, var(--starci-core-focus, Highlight));
+        outline-offset: -2px;
+    }
+
+    /* OtpInput with a drawn label: the label stacks above the slot strip, which keeps its own scroll. */
+    .starci-core-otp-field {
+        display: flex;
+        min-width: 0;
+        flex-direction: column;
+        gap: 0.5rem;
+    }
+
+    /* The drawn label is one block in that stack; a long name wraps instead of widening the field. */
+    .starci-core-otp-label {
+        display: block;
+        min-width: 0;
+        overflow-wrap: anywhere;
+    }
+
     .starci-core-visually-hidden {
         position: absolute;
         width: 1px;
@@ -371,6 +601,23 @@
         min-width: max-content;
     }
 
+    /*
+     * The same one scrolling axis, for the vertical region.
+     *
+     * The vendor's `.scroll-shadow--vertical` sets `overflow-y: auto` alone, and every host class
+     * this region wears - the chat conversation, the chat overlay rail, the accordion region, the
+     * form scroll viewport - names that same single axis or names none at all. A computed non-visible
+     * overflow on one axis forces the other from `visible` to `auto`, so the region rendered
+     * `overflow: auto auto`: two scrolling axes under an OVERFLOW-3 claim that promises one. Naming
+     * both axes on the region's own identity holds the render at the one axis the claim describes,
+     * and needs no `!important` to do it: no host class and no vendor rule ever names `overflow-x`,
+     * so this declaration is unopposed whichever order a consumer imports the two sheets in.
+     */
+    [data-grammar-scroll-region="vertical"] {
+        overflow-x: hidden;
+        overflow-y: auto;
+    }
+
     @media (min-width: 40rem) {
         .starci-core-form-page {
             padding-block: 2.5rem;
@@ -622,7 +869,17 @@
         cursor: not-allowed;
     }
 
-    [data-grammar-state="unavailable"] {
+    /*
+     * Unavailable is not disabled: the row or surface is still content a reader needs, so its copy
+     * reads in the muted ink (AA on every family ground) rather than fading the whole element to
+     * ~2.3:1. Only the non-text state mark keeps the disabled fade as the visual cue.
+     */
+    [data-grammar-state="unavailable"],
+    [data-grammar-state="unavailable"] .starci-core-static-row-copy > * {
+        color: var(--muted, GrayText);
+    }
+
+    [data-grammar-state="unavailable"] [data-grammar-state-mark] {
         opacity: var(--starci-core-disabled-opacity, 0.55);
     }
 
@@ -660,6 +917,13 @@
         min-width: 0;
     }
 
+    /* The collection IS the list (`<ul role="list">`, or the scroll region with role="list"): no UA indent or bullets. */
+    .starci-core-owned-collection:is(ul, ol, [role="list"]) {
+        margin: 0;
+        padding: 0;
+        list-style: none;
+    }
+
     /* A verdict list is flush inside its shell; the shell already owns the corner. */
     .starci-core-owned-collection[data-grammar-collection="verdict"] {
         border-radius: 0 !important;
@@ -1480,6 +1744,18 @@
         background: transparent !important;
     }
 
+    /*
+     * THE 44px TOUCH FLOOR, as the form controls spell it: on a touch pointer or a narrow viewport
+     * the menu target is at least 44px in both axes even where a consumer resizes the toggle. It is
+     * a MINIMUM, which the vendor never sets, so it owes no `!important`.
+     */
+    @media (pointer: coarse), (max-width: 40rem) {
+        .starci-core-subnav-toggle {
+            min-inline-size: var(--starci-core-control-min-size, 2.75rem);
+            min-block-size: var(--starci-core-control-min-size, 2.75rem);
+        }
+    }
+
     @media (min-width: 48rem) {
         .starci-core-navigation-feature-nav[data-grammar-navigation-feature-nav-destinations="absent"] .starci-core-navigation-feature-nav-primary {
             grid-template-columns: auto minmax(0, 1fr) !important;
@@ -2159,6 +2435,11 @@
         flex: none;
     }
 
+    /* RankArtwork is a glyph too: a flex row never squeezes it. Its size stays the consumer's. */
+    .starci-core-rank-artwork {
+        flex: none;
+    }
+
     .starci-core-icon[data-usage="heading"] {
         width: 1.5rem;
         height: 1.5rem;

package/dist/core/LeadingNumber.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LeadingNumber.d.ts","sourceRoot":"","sources":["../../src/core/LeadingNumber.tsx"],"names":[],"mappings":"AAAA,MAAM,MAAM,kBAAkB,GAAG;IAC7B,mEAAmE;IACnE,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAA;CAC5B,CAAA;AAID;;;;;GAKG;AACH,eAAO,MAAM,aAAa,GAAI,OAAO,kBAAkB,gCAMtD,CAAA"}
+{"version":3,"file":"LeadingNumber.d.ts","sourceRoot":"","sources":["../../src/core/LeadingNumber.tsx"],"names":[],"mappings":"AAAA,MAAM,MAAM,kBAAkB,GAAG;IAC7B,mEAAmE;IACnE,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAA;CAC5B,CAAA;AAID;;;;;GAKG;AACH,eAAO,MAAM,aAAa,GAAI,OAAO,kBAAkB,gCAOtD,CAAA"}

package/dist/core/LeadingNumber.js

@@ -6,5 +6,5 @@ import { leadingNumberClassName } from "./classNames.js";
  * The punctuation and treatment are intentionally closed: an ordinal prefix is
  * quiet reading structure (`1.`), never a badge, chip, status, or decoration.
  */
-export const LeadingNumber = (props) => (_jsxs("span", { className: leadingNumberClassName, children: [props.position, "."] }));
+export const LeadingNumber = (props) => (_jsxs("span", { className: leadingNumberClassName, "data-contract": "FONT-2 TONE-2", children: [props.position, "."] }));
 //# sourceMappingURL=LeadingNumber.js.map

package/dist/core/LeadingNumber.js.map

@@ -1 +1 @@
-{"version":3,"file":"LeadingNumber.js","sourceRoot":"","sources":["../../src/core/LeadingNumber.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAA;AAExD;;;;;GAKG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,KAAyB,EAAE,EAAE,CAAC,CACxD,gBACI,SAAS,EAAE,sBAAsB,aAEhC,KAAK,CAAC,QAAQ,SACZ,CACV,CAAA"}
+{"version":3,"file":"LeadingNumber.js","sourceRoot":"","sources":["../../src/core/LeadingNumber.tsx"],"names":[],"mappings":";AAKA,OAAO,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAA;AAExD;;;;;GAKG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,KAAyB,EAAE,EAAE,CAAC,CACxD,gBACI,SAAS,EAAE,sBAAsB,mBACnB,eAAe,aAE5B,KAAK,CAAC,QAAQ,SACZ,CACV,CAAA"}

package/dist/core/OtpInput.d.ts

@@ -1,12 +1,28 @@
 export type OtpInputProps = {
     readonly id: string;
     readonly name: string;
+    /**
+     * Visible name of the code, e.g. "Verification code". It is drawn above the slots as a
+     * `<label for={id}>` and names both the slot group (`role="group"`) and the one real input.
+     */
+    readonly label?: string;
+    /** Keep `label` as the accessible name but hide the drawn text. */
+    readonly isLabelHidden?: boolean;
+    /** Id of an app-owned element (a Field label, a heading) that names the code instead of `label`. */
+    readonly labelledBy?: string;
     readonly defaultValue?: string;
     readonly disabled?: boolean;
     readonly invalid?: boolean;
     readonly describedBy?: string;
     readonly onChange?: (value: string) => void;
 };
-/** Own the conventional six-digit OTP control and its intrinsic-width overflow treatment. */
+/**
+ * Own the conventional six-digit OTP control and its intrinsic-width overflow treatment.
+ *
+ * The slot strip is a `role="group"` named by `label` (or `labelledBy`), and the single hidden
+ * `<input>` that receives the code carries the same name, so the control is announced as, e.g.,
+ * "Verification code, group" and "Verification code, edit text". The strip scrolls only the slots,
+ * which the focused input already reaches, so the region adds no extra Tab stop.
+ */
 export declare const OtpInput: (props: OtpInputProps) => import("react").JSX.Element;
 //# sourceMappingURL=OtpInput.d.ts.map

package/dist/core/OtpInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"OtpInput.d.ts","sourceRoot":"","sources":["../../src/core/OtpInput.tsx"],"names":[],"mappings":"AAOA,MAAM,MAAM,aAAa,GAAG;IACxB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAA;IAC9B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAC3B,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAA;IAC1B,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAA;IAC7B,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CAC9C,CAAA;AAED,6FAA6F;AAC7F,eAAO,MAAM,QAAQ,GAAI,OAAO,aAAa,gCAqC5C,CAAA"}
+{"version":3,"file":"OtpInput.d.ts","sourceRoot":"","sources":["../../src/core/OtpInput.tsx"],"names":[],"mappings":"AAOA,MAAM,MAAM,aAAa,GAAG;IACxB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;IACrB;;;OAGG;IACH,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAA;IACvB,mEAAmE;IACnE,QAAQ,CAAC,aAAa,CAAC,EAAE,OAAO,CAAA;IAChC,oGAAoG;IACpG,QAAQ,CAAC,UAAU,CAAC,EAAE,MAAM,CAAA;IAC5B,QAAQ,CAAC,YAAY,CAAC,EAAE,MAAM,CAAA;IAC9B,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAC3B,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,CAAA;IAC1B,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAA;IAC7B,QAAQ,CAAC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CAC9C,CAAA;AAED;;;;;;;GAOG;AACH,eAAO,MAAM,QAAQ,GAAI,OAAO,aAAa,gCA4D5C,CAAA"}

package/dist/core/OtpInput.js

@@ -1,12 +1,20 @@
 "use client";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useCallback, useRef } from "react";
-import { InputOTP, REGEXP_ONLY_DIGITS } from "@heroui/react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useId, useRef } from "react";
+import { InputOTP, Label as HeroLabel, REGEXP_ONLY_DIGITS } from "@heroui/react";
 import { horizontalScrollRegionClassName } from "./classNames.js";
 import { HorizontalScrollRegion } from "./composite/HorizontalScrollRegion/index.js";
-/** Own the conventional six-digit OTP control and its intrinsic-width overflow treatment. */
+/**
+ * Own the conventional six-digit OTP control and its intrinsic-width overflow treatment.
+ *
+ * The slot strip is a `role="group"` named by `label` (or `labelledBy`), and the single hidden
+ * `<input>` that receives the code carries the same name, so the control is announced as, e.g.,
+ * "Verification code, group" and "Verification code, edit text". The strip scrolls only the slots,
+ * which the focused input already reaches, so the region adds no extra Tab stop.
+ */
 export const OtpInput = (props) => {
     const regionRef = useRef(null);
+    const generatedLabelId = useId();
     const onChange = useCallback((nextValue) => {
         props.onChange?.(nextValue);
         window.requestAnimationFrame(() => {
@@ -17,6 +25,10 @@ export const OtpInput = (props) => {
             slots.item(activeIndex).scrollIntoView({ block: "nearest", inline: "nearest" });
         });
     }, [props.onChange]);
-    return (_jsx(HorizontalScrollRegion, { ref: regionRef, className: horizontalScrollRegionClassName, "data-contract": "PADDING-1 OVERFLOW-3 OVERFLOW-5", children: _jsx(InputOTP, { id: props.id, name: props.name, maxLength: 6, pattern: REGEXP_ONLY_DIGITS, autoComplete: "one-time-code", inputMode: "numeric", defaultValue: props.defaultValue, isDisabled: props.disabled === true, isInvalid: props.invalid === true, "aria-invalid": props.invalid === true ? true : undefined, "aria-describedby": props.describedBy, variant: "secondary", onChange: onChange, children: _jsx(InputOTP.Group, { children: Array.from({ length: 6 }, (_, index) => (_jsx(InputOTP.Slot, { index: index }, index))) }) }) }));
+    const labelId = props.label === undefined ? props.labelledBy : generatedLabelId;
+    const control = (_jsx(HorizontalScrollRegion, { ref: regionRef, className: horizontalScrollRegionClassName, "data-contract": "PADDING-1 OVERFLOW-3 OVERFLOW-5", isFocusable: false, ...(labelId === undefined ? {} : { role: "group", "aria-labelledby": labelId }), children: _jsx(InputOTP, { id: props.id, name: props.name, maxLength: 6, pattern: REGEXP_ONLY_DIGITS, autoComplete: "one-time-code", inputMode: "numeric", defaultValue: props.defaultValue, isDisabled: props.disabled === true, isInvalid: props.invalid === true, "aria-invalid": props.invalid === true ? true : undefined, "aria-describedby": props.describedBy, ...(labelId === undefined ? {} : { "aria-labelledby": labelId }), variant: "secondary", onChange: onChange, children: _jsx(InputOTP.Group, { children: Array.from({ length: 6 }, (_, index) => (_jsx(InputOTP.Slot, { index: index }, index))) }) }) }));
+    if (props.label === undefined)
+        return control;
+    return (_jsxs("div", { className: "starci-core-otp-field", "data-grammar-otp-field": "true", children: [_jsx(HeroLabel, { className: props.isLabelHidden === true ? "starci-core-visually-hidden" : "starci-core-otp-label", htmlFor: props.id, id: labelId, children: props.label }), control] }));
 };
 //# sourceMappingURL=OtpInput.js.map

package/dist/core/OtpInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"OtpInput.js","sourceRoot":"","sources":["../../src/core/OtpInput.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAC3C,OAAO,EAAE,QAAQ,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAA;AAC5D,OAAO,EAAE,+BAA+B,EAAE,MAAM,iBAAiB,CAAA;AACjE,OAAO,EAAE,sBAAsB,EAAE,MAAM,6CAA6C,CAAA;AAYpF,6FAA6F;AAC7F,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAoB,EAAE,EAAE;IAC7C,MAAM,SAAS,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IAC9C,MAAM,QAAQ,GAAG,WAAW,CAAC,CAAC,SAAiB,EAAE,EAAE;QAC/C,KAAK,CAAC,QAAQ,EAAE,CAAC,SAAS,CAAC,CAAA;QAC3B,MAAM,CAAC,qBAAqB,CAAC,GAAG,EAAE;YAC9B,MAAM,KAAK,GAAG,SAAS,CAAC,OAAO,EAAE,gBAAgB,CAAc,8BAA8B,CAAC,CAAA;YAC9F,IAAI,CAAC,KAAK,EAAE,MAAM;gBAAE,OAAM;YAC1B,MAAM,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,MAAM,EAAE,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAA;YAChE,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,cAAc,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,CAAC,CAAA;QACnF,CAAC,CAAC,CAAA;IACN,CAAC,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;IAEpB,OAAO,CACH,KAAC,sBAAsB,IAAC,GAAG,EAAE,SAAS,EAAE,SAAS,EAAE,+BAA+B,mBAAgB,iCAAiC,YAC/H,KAAC,QAAQ,IACL,EAAE,EAAE,KAAK,CAAC,EAAE,EACZ,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,SAAS,EAAE,CAAC,EACZ,OAAO,EAAE,kBAAkB,EAC3B,YAAY,EAAC,eAAe,EAC5B,SAAS,EAAC,SAAS,EACnB,YAAY,EAAE,KAAK,CAAC,YAAY,EAChC,UAAU,EAAE,KAAK,CAAC,QAAQ,KAAK,IAAI,EACnC,SAAS,EAAE,KAAK,CAAC,OAAO,KAAK,IAAI,kBACnB,KAAK,CAAC,OAAO,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,sBACrC,KAAK,CAAC,WAAW,EACnC,OAAO,EAAC,WAAW,EACnB,QAAQ,EAAE,QAAQ,YAElB,KAAC,QAAQ,CAAC,KAAK,cACV,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,CACrC,KAAC,QAAQ,CAAC,IAAI,IAAa,KAAK,EAAE,KAAK,IAAnB,KAAK,CAAkB,CAC9C,CAAC,GACW,GACV,GACU,CAC5B,CAAA;AACL,CAAC,CAAA"}
+{"version":3,"file":"OtpInput.js","sourceRoot":"","sources":["../../src/core/OtpInput.tsx"],"names":[],"mappings":"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"}

package/dist/core/StateMark.d.ts

@@ -3,6 +3,11 @@ import type { PresentationState } from "./state.js";
 export type StateMarkProps = {
     readonly state: PresentationState;
 };
-/** Draw the check mark used by successful neutral states. */
+/**
+ * Draw the check mark used by successful neutral states.
+ *
+ * Contract: STATE-1 (the carrier is chosen from the named state through `treatmentFor`) and ICON-6
+ * (the mark is decorative, so it is always `aria-hidden`; the state's words carry the meaning).
+ */
 export declare const StateMark: (props: StateMarkProps) => import("react").JSX.Element | null;
 //# sourceMappingURL=StateMark.d.ts.map

package/dist/core/StateMark.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StateMark.d.ts","sourceRoot":"","sources":["../../src/core/StateMark.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAA;AAGnD,wCAAwC;AACxC,MAAM,MAAM,cAAc,GAAG;IACzB,QAAQ,CAAC,KAAK,EAAE,iBAAiB,CAAA;CACpC,CAAA;AAED,6DAA6D;AAC7D,eAAO,MAAM,SAAS,GAAI,OAAO,cAAc,uCAc9C,CAAA"}
+{"version":3,"file":"StateMark.d.ts","sourceRoot":"","sources":["../../src/core/StateMark.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAA;AAGnD,wCAAwC;AACxC,MAAM,MAAM,cAAc,GAAG;IACzB,QAAQ,CAAC,KAAK,EAAE,iBAAiB,CAAA;CACpC,CAAA;AAED;;;;;GAKG;AACH,eAAO,MAAM,SAAS,GAAI,OAAO,cAAc,uCAe9C,CAAA"}

package/dist/core/StateMark.js

@@ -1,10 +1,15 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { treatmentFor } from "./state.js";
-/** Draw the check mark used by successful neutral states. */
+/**
+ * Draw the check mark used by successful neutral states.
+ *
+ * Contract: STATE-1 (the carrier is chosen from the named state through `treatmentFor`) and ICON-6
+ * (the mark is decorative, so it is always `aria-hidden`; the state's words carry the meaning).
+ */
 export const StateMark = (props) => {
     const treatment = treatmentFor(props.state);
     if (treatment.mark !== "check")
         return null;
-    return (_jsx("svg", { "aria-hidden": "true", "data-grammar-state-mark": "check", focusable: "false", viewBox: "0 0 20 20", children: _jsx("path", { d: "M5 10.5 8.25 14 15 6.5", fill: "none", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2" }) }));
+    return (_jsx("svg", { "aria-hidden": "true", "data-contract": "STATE-1 ICON-6", "data-grammar-state-mark": "check", focusable: "false", viewBox: "0 0 20 20", children: _jsx("path", { d: "M5 10.5 8.25 14 15 6.5", fill: "none", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2" }) }));
 };
 //# sourceMappingURL=StateMark.js.map

package/dist/core/StateMark.js.map

@@ -1 +1 @@
-{"version":3,"file":"StateMark.js","sourceRoot":"","sources":["../../src/core/StateMark.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAOzC,6DAA6D;AAC7D,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,KAAqB,EAAE,EAAE;IAC/C,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;IAC3C,IAAI,SAAS,CAAC,IAAI,KAAK,OAAO;QAAE,OAAO,IAAI,CAAA;IAE3C,OAAO,CACH,6BACgB,MAAM,6BACM,OAAO,EAC/B,SAAS,EAAC,OAAO,EACjB,OAAO,EAAC,WAAW,YAEnB,eAAM,CAAC,EAAC,wBAAwB,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAC,aAAa,EAAC,OAAO,EAAC,cAAc,EAAC,OAAO,EAAC,WAAW,EAAC,GAAG,GAAG,GAChI,CACT,CAAA;AACL,CAAC,CAAA"}
+{"version":3,"file":"StateMark.js","sourceRoot":"","sources":["../../src/core/StateMark.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AAOzC;;;;;GAKG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,KAAqB,EAAE,EAAE;IAC/C,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;IAC3C,IAAI,SAAS,CAAC,IAAI,KAAK,OAAO;QAAE,OAAO,IAAI,CAAA;IAE3C,OAAO,CACH,6BACgB,MAAM,mBACJ,gBAAgB,6BACN,OAAO,EAC/B,SAAS,EAAC,OAAO,EACjB,OAAO,EAAC,WAAW,YAEnB,eAAM,CAAC,EAAC,wBAAwB,EAAC,IAAI,EAAC,MAAM,EAAC,MAAM,EAAC,cAAc,EAAC,aAAa,EAAC,OAAO,EAAC,cAAc,EAAC,OAAO,EAAC,WAAW,EAAC,GAAG,GAAG,GAChI,CACT,CAAA;AACL,CAAC,CAAA"}

package/dist/core/branch/Accordion/index.d.ts

@@ -0,0 +1,28 @@
+import { type ReactNode } from "react";
+export type AccordionItem = {
+    readonly id: string;
+    readonly title: ReactNode;
+    readonly content: ReactNode;
+    readonly isDisabled?: boolean;
+};
+export type AccordionProps = {
+    /** Names the group of sections for assistive technology. */
+    readonly label: string;
+    readonly items: ReadonlyArray<AccordionItem>;
+    /** Controlled open sections. Omit for uncontrolled use with `defaultExpandedIds`. */
+    readonly expandedIds?: ReadonlyArray<string>;
+    readonly defaultExpandedIds?: ReadonlyArray<string>;
+    readonly onExpandedChange?: (ids: ReadonlyArray<string>) => void;
+    /** Single-open (default) closes the previous section when another opens. */
+    readonly allowsMultipleExpanded?: boolean;
+    readonly headingLevel?: 2 | 3 | 4 | 5 | 6;
+    readonly className?: string;
+};
+/**
+ * A generic, unframed stack of disclosures (FAQ, settings groups). `SurfaceAccordionCard` stays
+ * the framed card form. Up/Down/Home/End move between section triggers; each section exposes
+ * `data-grammar-disclosure-state`.
+ * Contract: group FOCUS-2 (peer keys), item STATE-7 (controlled open set), trigger FOCUS-1, indicator MOTION-2.
+ */
+export declare const Accordion: ({ label, items, expandedIds, defaultExpandedIds, onExpandedChange, allowsMultipleExpanded, headingLevel, className, }: AccordionProps) => import("react").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/core/branch/Accordion/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/branch/Accordion/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAY,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAIhD,MAAM,MAAM,aAAa,GAAG;IACxB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,KAAK,EAAE,SAAS,CAAA;IACzB,QAAQ,CAAC,OAAO,EAAE,SAAS,CAAA;IAC3B,QAAQ,CAAC,UAAU,CAAC,EAAE,OAAO,CAAA;CAChC,CAAA;AAED,MAAM,MAAM,cAAc,GAAG;IACzB,4DAA4D;IAC5D,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,KAAK,EAAE,aAAa,CAAC,aAAa,CAAC,CAAA;IAC5C,qFAAqF;IACrF,QAAQ,CAAC,WAAW,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAA;IAC5C,QAAQ,CAAC,kBAAkB,CAAC,EAAE,aAAa,CAAC,MAAM,CAAC,CAAA;IACnD,QAAQ,CAAC,gBAAgB,CAAC,EAAE,CAAC,GAAG,EAAE,aAAa,CAAC,MAAM,CAAC,KAAK,IAAI,CAAA;IAChE,4EAA4E;IAC5E,QAAQ,CAAC,sBAAsB,CAAC,EAAE,OAAO,CAAA;IACzC,QAAQ,CAAC,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;IACzC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAC9B,CAAA;AASD;;;;;GAKG;AACH,eAAO,MAAM,SAAS,GAAI,uHASvB,cAAc,gCA+ChB,CAAA"}

package/dist/core/branch/Accordion/index.js

@@ -0,0 +1,30 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Accordion as HeroAccordion } from "@heroui/react";
+import { useState } from "react";
+import { moveFocusBetweenPeers } from "../../navigationKeys.js";
+import { navigationClassName } from "../../navigationClassNames.js";
+/*
+ * Consumer hooks: `starci-core-generic-accordion-root`, `starci-core-generic-accordion-panel`,
+ * `starci-core-generic-accordion-body` name HeroUI parts whose vendor paint Common leaves as it is.
+ * No shipped sheet paints them; the Grammar name lets a consumer or family select those parts
+ * without reaching for vendor class names.
+ */
+/**
+ * A generic, unframed stack of disclosures (FAQ, settings groups). `SurfaceAccordionCard` stays
+ * the framed card form. Up/Down/Home/End move between section triggers; each section exposes
+ * `data-grammar-disclosure-state`.
+ * Contract: group FOCUS-2 (peer keys), item STATE-7 (controlled open set), trigger FOCUS-1, indicator MOTION-2.
+ */
+export const Accordion = ({ label, items, expandedIds, defaultExpandedIds = [], onExpandedChange, allowsMultipleExpanded = false, headingLevel = 3, className, }) => {
+    const [uncontrolled, setUncontrolled] = useState(defaultExpandedIds);
+    const expanded = expandedIds ?? uncontrolled;
+    const expandedSet = new Set(expanded);
+    return (_jsx("div", { "aria-label": label, className: navigationClassName("starci-core-generic-accordion", className), "data-component": "Accordion", "data-tier": "branch", "data-contract": "FOCUS-2", onKeyDown: (event) => { moveFocusBetweenPeers(event, "[data-grammar-accordion-trigger]", "vertical"); }, role: "group", children: _jsx(HeroAccordion, { allowsMultipleExpanded: allowsMultipleExpanded, className: "starci-core-generic-accordion-root", expandedKeys: expandedSet, onExpandedChange: (keys) => {
+                const next = [...keys].map(String);
+                if (expandedIds === undefined)
+                    setUncontrolled(next);
+                onExpandedChange?.(next);
+            }, children: items.map((item) => (_jsxs(HeroAccordion.Item, { id: item.id, className: "starci-core-generic-accordion-item", "data-contract": "STATE-7", "data-grammar-disclosure-state": expandedSet.has(item.id) ? "open" : "closed", ...(item.isDisabled === undefined ? {} : { isDisabled: item.isDisabled }), children: [_jsx(HeroAccordion.Heading, { className: "starci-core-generic-accordion-heading", level: headingLevel, children: _jsxs(HeroAccordion.Trigger, { className: "starci-core-generic-accordion-trigger", "data-contract": "FOCUS-1", "data-grammar-accordion-trigger": "true", children: [_jsx("span", { className: "starci-core-generic-accordion-title", children: item.title }), _jsx(HeroAccordion.Indicator, { className: "starci-core-generic-accordion-indicator", "data-contract": "MOTION-2" })] }) }), _jsx(HeroAccordion.Panel, { className: "starci-core-generic-accordion-panel", children: _jsx(HeroAccordion.Body, { className: "starci-core-generic-accordion-body", children: item.content }) })] }, item.id))) }) }));
+};
+//# sourceMappingURL=index.js.map

package/dist/core/branch/Accordion/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/core/branch/Accordion/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,EAAE,SAAS,IAAI,aAAa,EAAY,MAAM,eAAe,CAAA;AACpE,OAAO,EAAE,QAAQ,EAAkB,MAAM,OAAO,CAAA;AAChD,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAA;AAC/D,OAAO,EAAE,mBAAmB,EAAE,MAAM,+BAA+B,CAAA;AAuBnE;;;;;GAKG;AAEH;;;;;GAKG;AACH,MAAM,CAAC,MAAM,SAAS,GAAG,CAAC,EACtB,KAAK,EACL,KAAK,EACL,WAAW,EACX,kBAAkB,GAAG,EAAE,EACvB,gBAAgB,EAChB,sBAAsB,GAAG,KAAK,EAC9B,YAAY,GAAG,CAAC,EAChB,SAAS,GACI,EAAE,EAAE;IACjB,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAwB,kBAAkB,CAAC,CAAA;IAC3F,MAAM,QAAQ,GAAG,WAAW,IAAI,YAAY,CAAA;IAC5C,MAAM,WAAW,GAAG,IAAI,GAAG,CAAC,QAAQ,CAAC,CAAA;IACrC,OAAO,CACH,4BACgB,KAAK,EACjB,SAAS,EAAE,mBAAmB,CAAC,+BAA+B,EAAE,SAAS,CAAC,oBAC3D,WAAW,eAChB,QAAQ,mBACJ,SAAS,EACvB,SAAS,EAAE,CAAC,KAAK,EAAE,EAAE,GAAG,qBAAqB,CAAC,KAAK,EAAE,kCAAkC,EAAE,UAAU,CAAC,CAAA,CAAC,CAAC,EACtG,IAAI,EAAC,OAAO,YAEZ,KAAC,aAAa,IACV,sBAAsB,EAAE,sBAAsB,EAC9C,SAAS,EAAC,oCAAoC,EAC9C,YAAY,EAAE,WAAW,EACzB,gBAAgB,EAAE,CAAC,IAAc,EAAE,EAAE;gBACjC,MAAM,IAAI,GAAG,CAAC,GAAG,IAAI,CAAC,CAAC,GAAG,CAAC,MAAM,CAAC,CAAA;gBAClC,IAAI,WAAW,KAAK,SAAS;oBAAE,eAAe,CAAC,IAAI,CAAC,CAAA;gBACpD,gBAAgB,EAAE,CAAC,IAAI,CAAC,CAAA;YAC5B,CAAC,YAEA,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CACjB,MAAC,aAAa,CAAC,IAAI,IAEf,EAAE,EAAE,IAAI,CAAC,EAAE,EACX,SAAS,EAAC,oCAAoC,mBAChC,SAAS,mCACQ,WAAW,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,KACvE,CAAC,IAAI,CAAC,UAAU,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,CAAC,aAE1E,KAAC,aAAa,CAAC,OAAO,IAAC,SAAS,EAAC,uCAAuC,EAAC,KAAK,EAAE,YAAY,YACxF,MAAC,aAAa,CAAC,OAAO,IAAC,SAAS,EAAC,uCAAuC,mBAAe,SAAS,oCAAgC,MAAM,aAClI,eAAM,SAAS,EAAC,qCAAqC,YAAE,IAAI,CAAC,KAAK,GAAQ,EACzE,KAAC,aAAa,CAAC,SAAS,IAAC,SAAS,EAAC,yCAAyC,mBAAe,UAAU,GAAG,IACpF,GACJ,EACxB,KAAC,aAAa,CAAC,KAAK,IAAC,SAAS,EAAC,qCAAqC,YAChE,KAAC,aAAa,CAAC,IAAI,IAAC,SAAS,EAAC,oCAAoC,YAAE,IAAI,CAAC,OAAO,GAAsB,GACpF,KAfjB,IAAI,CAAC,EAAE,CAgBK,CACxB,CAAC,GACU,GACd,CACT,CAAA;AACL,CAAC,CAAA"}

package/dist/core/branch/AlertDialog/index.d.ts

@@ -0,0 +1,40 @@
+import { type ReactNode } from "react";
+import type { PresentationState } from "../../../common/state.js";
+import { type OverlayOpenState } from "../../overlayScope.js";
+export type AlertDialogProps = OverlayOpenState & {
+    /** The question being confirmed; the dialog's accessible name. */
+    readonly title: string;
+    /** The consequence, wired as `aria-describedby`. */
+    readonly description?: ReactNode;
+    readonly children?: ReactNode;
+    /**
+     * Meaning of the decision. `negative` marks a destructive confirm (danger-toned action);
+     * anything else confirms with the family decision accent. Default `negative`.
+     */
+    readonly tone?: PresentationState;
+    readonly confirmLabel: string;
+    readonly cancelLabel: string;
+    /**
+     * Runs on confirm. Returning a promise keeps the dialog open and the confirm action pending
+     * until it settles; it closes on success and stays open on rejection so the person can retry.
+     */
+    readonly onConfirm: () => void | Promise<unknown>;
+    readonly onCancel?: () => void;
+    /** App-owned pending state for a confirm whose work is tracked elsewhere. */
+    readonly isConfirmPending?: boolean;
+    /** A Common `Button` (any React Aria pressable) that opens the confirmation. */
+    readonly trigger?: ReactNode;
+    /** Escape cancels by default; disable only when cancelling would itself be unsafe. */
+    readonly isKeyboardDismissDisabled?: boolean;
+};
+/**
+ * BRANCH - `AlertDialog`: an interrupting confirmation (`role="alertdialog"`).
+ *
+ * Dismiss rules differ from `Dialog` on purpose: an outside press never dismisses (the decision must
+ * be explicit), Escape cancels, and the cancel action is first in focus order so initial focus lands
+ * on the safe choice. Focus trap/return, scroll lock and the scoped portal are the `Dialog` rules.
+ * Contract: confirm CTA-4 ACTION-2 FEEDBACK-3 (explicit destructive authority, pending on the initiator,
+ * closes only on settlement); surface and container as `Dialog`.
+ */
+export declare const AlertDialog: ({ title, description, children, tone, confirmLabel, cancelLabel, onConfirm, onCancel, isConfirmPending, trigger, isKeyboardDismissDisabled, ...openState }: AlertDialogProps) => import("react").JSX.Element;
+//# sourceMappingURL=index.d.ts.map

package/dist/core/branch/AlertDialog/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/branch/AlertDialog/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAsC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAA;AAC1E,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAA;AACjE,OAAO,EAA0D,KAAK,gBAAgB,EAAE,MAAM,uBAAuB,CAAA;AAGrH,MAAM,MAAM,gBAAgB,GAAG,gBAAgB,GAAG;IAC9C,kEAAkE;IAClE,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;IACtB,oDAAoD;IACpD,QAAQ,CAAC,WAAW,CAAC,EAAE,SAAS,CAAA;IAChC,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAA;IAC7B;;;OAGG;IACH,QAAQ,CAAC,IAAI,CAAC,EAAE,iBAAiB,CAAA;IACjC,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAA;IAC7B,QAAQ,CAAC,WAAW,EAAE,MAAM,CAAA;IAC5B;;;OAGG;IACH,QAAQ,CAAC,SAAS,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,OAAO,CAAC,CAAA;IACjD,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;IAC9B,6EAA6E;IAC7E,QAAQ,CAAC,gBAAgB,CAAC,EAAE,OAAO,CAAA;IACnC,gFAAgF;IAChF,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,CAAA;IAC5B,sFAAsF;IACtF,QAAQ,CAAC,yBAAyB,CAAC,EAAE,OAAO,CAAA;CAC/C,CAAA;AAeD;;;;;;;;GAQG;AACH,eAAO,MAAM,WAAW,GAAI,4JAazB,gBAAgB,gCAsFlB,CAAA"}