@uni-design-system/uni-mcp 10.2.1 → 10.4.0

package/dist/{chunk-JMAG4RA3.js → chunk-QZ5TESCY.js}

@@ -7,16 +7,16 @@ import { z } from "zod";
 // src/data/uni-index.json
 var uni_index_default = {
   meta: {
-    version: "10.2.1",
-    builtAt: "2026-09-01T22:40:17.762Z",
+    version: "10.4.0",
+    builtAt: "2026-09-04T18:00:08.990Z",
     frameworks: [
       "angular"
     ],
     counts: {
       components: 84,
-      tokens: 454,
+      tokens: 458,
       themes: 2,
-      examples: 225
+      examples: 229
     }
   },
   components: [
@@ -27,7 +27,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "feedback",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -117,7 +117,7 @@ var uni_index_default = {
       summary: "Horizontal application bar: project leading controls (menu button, logo) with the `leading` attribute, actions with `trailing` (pushed to the far edge), and either pass `title` or project custom center content.",
       description: "Horizontal application bar: project leading controls (menu button, logo) with the `leading` attribute, actions with `trailing` (pushed to the far edge), and either pass `title` or project custom center content. Surface, divider, height, typography and spacing all resolve from `appBar` tokens. Place it inside your page's `<header>` landmark.",
       category: "components",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -190,7 +190,7 @@ var uni_index_default = {
       summary: "Identity avatar with a graceful fallback chain: image \u2192 initials from `name` \u2192 themed symbol.",
       description: "Identity avatar with a graceful fallback chain: image \u2192 initials from `name` \u2192 themed symbol. Coloring, radius, typeface and sizes all resolve from `avatar` theme tokens; `variant` picks the container palette.",
       category: "components",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -285,7 +285,7 @@ var uni_index_default = {
       summary: "Overlapping stack of avatars.",
       description: "Overlapping stack of avatars. `max` collapses the overflow into a themed \u201C+N\u201D chip (itself a `uni-avatar`). Overlap and separator ring resolve from `avatarGroup` theme tokens.",
       category: "components",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -334,7 +334,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "primitives",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -415,7 +415,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "feedback",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -512,7 +512,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "directives",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -536,7 +536,7 @@ var uni_index_default = {
       summary: 'The base layout primitive, applied as an attribute to any element so semantics stay yours: `<main box-layout [grow]="1" padding="md">`.',
       description: 'The base layout primitive, applied as an attribute to any element so semantics stay yours: `<main box-layout [grow]="1" padding="md">`. It is a directive, so it composes freely \u2014 with another layout attribute (`<div stack-layout uni-text="body-1-long">`) and with a component\'s own host element (`<uni-card box-layout padding="lg">`); Angular merges the host `class` bindings rather than letting one win. Sizing convention (height/width/min/max/inset): a **number is px and needs a binding** \u2014 `[height]="420"`; a **plain attribute is a CSS length string** \u2014 `height="420px"`. Spacing/radius/color inputs take theme tokens.',
       category: "layout",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -942,7 +942,7 @@ var uni_index_default = {
       summary: 'WAI-ARIA breadcrumb: a `nav` landmark wrapping an ordered list; the last item is the current page (`aria-current="page"`), separators are decorative.',
       description: 'WAI-ARIA breadcrumb: a `nav` landmark wrapping an ordered list; the last item is the current page (`aria-current="page"`), separators are decorative. Items with `href` render as real links; without one they render as link-styled buttons emitting `itemClicked` \u2014 wire that to your router.',
       category: "components",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1027,7 +1027,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "primitives",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1186,7 +1186,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "primitives",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1218,7 +1218,7 @@ var uni_index_default = {
       summary: "Inline month calendar: single-date or start\u2013end range selection, day markers (availability dots), min/max fences and disabled dates.",
       description: "Inline month calendar: single-date or start\u2013end range selection, day markers (availability dots), min/max fences and disabled dates. One tab stop with a roving-tabindex `role=\"grid\"`; every day is a real button named with its full date. Values are plain ISO strings (`'YYYY-MM-DD'`), never `Date` objects, so bindings are timezone-free and serializable. Selection and today colours come from the theme's `primary` role pair; geometry and glyphs come from the `calendar` theme entry.",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1452,7 +1452,7 @@ var uni_index_default = {
       summary: "Anchored coach-mark panel that dims the page and cuts a spotlight hole around its target.",
       description: 'Anchored coach-mark panel that dims the page and cuts a spotlight hole around its target. Both the scrim and the panel are `popover="manual"` elements shown in order, so they stack deterministically in the top layer above every app z-index, and every scrim piece is CSS-anchor-positioned to the target \u2014 the hole tracks scroll/resize/layout with zero listeners. The panel is a non-modal `role="dialog"` (deliberately no `aria-modal`): focus moves into it on open, Tab runs a "duet loop" over the panel\'s focusables plus the spotlit target while it stays interactive, and on close focus returns to the pre-open element \u2014 unless the user moved into the target, where it stays. Storage-free by rule: `key` and the `dismissed` output are the "don\'t show again" hooks; persistence is the app\'s business (e.g. cdk local-storage).',
       category: "components",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1672,7 +1672,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1734,7 +1734,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1775,7 +1775,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1832,7 +1832,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1887,7 +1887,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -2063,7 +2063,7 @@ var uni_index_default = {
       summary: "Form-bound, closed-set, single-select autocomplete: `FormValueControl<T | null>` over object `Options<T>`, type-to-filter, commit-on-select.",
       description: "Form-bound, closed-set, single-select autocomplete: `FormValueControl<T | null>` over object `Options<T>`, type-to-filter, commit-on-select. Typing produces a draft \u2014 a filter, never a value; the value changes only when an option commits, `clear()` runs, or the model is written from outside. Select semantics, not search: a real label, a chevron, no magnifier, nothing submits. For short lists with no need to type, prefer `uni-select` \u2014 the value contract is identical, so swapping is a template-only change.",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -2342,7 +2342,7 @@ emptyText="No countries found"
       summary: "",
       description: "",
       category: "feedback",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -2389,7 +2389,7 @@ emptyText="No countries found"
       summary: "",
       description: "",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -2488,7 +2488,7 @@ emptyText="No countries found"
       summary: "",
       description: "",
       category: "data",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -2728,7 +2728,7 @@ emptyText="No countries found"
       summary: "Date field with free-typed parsing and a popup calendar.",
       description: "Date field with free-typed parsing and a popup calendar. Type `aug 20`, `8/20/2026` or `2026-08-20`, or pick from the grid \u2014 the form gets the same canonical `'YYYY-MM-DD'` string either way. Parsing is `Intl`-driven (locale digit order and month names, never hardcoded); unreadable text stays in the field, flagged, with a `rejected` event. The popup is a native popover hosting the same `uni-calendar` an app could render inline.",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -2952,7 +2952,7 @@ emptyText="No countries found"
       summary: "One field for a date and a time: a thin composer seating a uni-date-input and a uni-time-input in one input-box chrome under one label, yielding one combined `'YYYY-MM-DDTHH:mm'` value.",
       description: "One field for a date and a time: a thin composer seating a uni-date-input and a uni-time-input in one input-box chrome under one label, yielding one combined `'YYYY-MM-DDTHH:mm'` value. The value emits only when both parts are set \u2014 a time without a day is not an answer \u2014 and clearing the date clears it. With `slotsFor`, the time part stays disabled until a day is chosen and offers exactly that day's slots: the scheduling flow in one attribute. Two honest tab stops (it is two questions); apps needing a different arrangement compose the primitives directly.",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -3138,7 +3138,7 @@ emptyText="No countries found"
       summary: "Text input that emits `change` only after the user pauses typing.",
       description: "Text input that emits `change` only after the user pauses typing. Wears the shared input chrome (themed color, border, typeface, focus ring) via `uni-input-box`; project adornments with the `pre-input` / `post-input` slots, matching `uni-input`'s convention. The ARIA passthrough inputs let a wrapping composite (e.g. SearchInput's combobox) annotate the real input element.",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -3283,10 +3283,10 @@ emptyText="No countries found"
       id: "dialog",
       name: "Dialog",
       status: "stable",
-      summary: "",
-      description: "",
+      summary: "Modal dialog on the native `<dialog>` element, laid out as three rows: an optional `[dialog-header]`, the projected body, an optional `[dialog-buttons]`.",
+      description: "Modal dialog on the native `<dialog>` element, laid out as three rows: an optional `[dialog-header]`, the projected body, an optional `[dialog-buttons]`. **The surface is never the scroll container.** It is a flex column that is `overflow: clip` on both axes; the header and buttons pin while only the body row scrolls. Unlike the drawer, which is deliberately viewport-tall, the dialog stays content-sized: it has no `height`, and grows until it hits `calc(100dvh - 2 x inset)` \u2014 the point at which the body starts to scroll. The theme's `padding` insets all three rows (which is what makes the default header read as a pill floating inside the surface); `bodyPadding` pads the scrolling row alone.",
       category: "feedback",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -3351,11 +3351,68 @@ emptyText="No countries found"
         {
           title: "Primary",
           framework: "angular",
-          code: '<!-- Storybook story: Primary -->\n<button text-button (click)="dialog.open()">Open Dialog</button>\n<dialog uni-dialog #dialog>\n  <header uni-dialog-header color="primary">Sample Dialog</header>\n  <div center-layout [width]="300" [height]="200">\n    <span uni-text>Dialog</span>\n  </div>\n  <footer dialog-buttons></footer>\n</dialog>\n<!-- args:\n{}\n-->'
+          code: '<!-- Storybook story: Primary -->\n<button text-button (click)="dialog.open()">Open Dialog</button>\n<dialog uni-dialog #dialog>\n  <header dialog-header color="primary">Sample Dialog</header>\n  <div center-layout [width]="300" [height]="200">\n    <span uni-text>Dialog</span>\n  </div>\n  <footer dialog-buttons></footer>\n</dialog>\n<!-- args:\n{}\n-->'
+        },
+        {
+          title: "Long Content",
+          framework: "angular",
+          code: `<!-- Storybook story: Long Content -->
+<div box-layout padding="md">
+<span uni-text="body-1-long" display="block">
+  The dialog opens over this. Close it and reopen from the button.
+</span>
+<button text-button variant="primary" size="md" (click)="show = true">Open dialog</button>
+</div>
+<dialog uni-dialog [(show)]="show">
+<header dialog-header>Edit line item</header>
+<div stack-layout gap="md" padding="md">
+  <uni-input label="SKU" placeholder="WS-00000" />
+  <!-- Long enough to overflow at any plausible viewport: the point of
+       the story is that this scrolls while the rows above and below it
+       do not. -->
+  @for (n of attributes; track n) {
+    <uni-input [label]="'Attribute ' + n" placeholder="Value" />
+  }
+</div>
+<footer dialog-buttons confirmButtonText="Save" cancelButtonText="Cancel"></footer>
+</dialog>`
+        },
+        {
+          title: "Shrink To Content",
+          framework: "angular",
+          code: '<!-- Storybook story: Shrink To Content -->\n<div box-layout padding="md">\n<button text-button variant="primary" size="md" (click)="show = true">Open dialog</button>\n</div>\n<dialog uni-dialog [(show)]="show">\n<header dialog-header>Discard changes?</header>\n<div box-layout padding="md">\n  <span uni-text="body-1-long">Your edits to this line item will be lost.</span>\n</div>\n<footer dialog-buttons confirmButtonText="Discard" cancelButtonText="Keep editing"></footer>\n</dialog>'
+        },
+        {
+          title: "Without Header",
+          framework: "angular",
+          code: '<!-- Storybook story: Without Header -->\n<button text-button variant="primary" (click)="show = true">Open dialog</button>\n<dialog uni-dialog [(show)]="show" ariaLabel="Keyboard shortcuts" [defaultCloseButton]="true">\n<div box-layout padding="lg" [width]="320">\n  <span uni-text="body-1-long" display="block">\n    Press <strong>Escape</strong> to close, or use the button in the corner.\n    With no header to be labelled by, the dialog announces its\n    <code>ariaLabel</code> instead.\n  </span>\n</div>\n</dialog>'
+        },
+        {
+          title: "Controlled",
+          framework: "angular",
+          code: `<!-- Storybook story: Controlled -->
+<div stack-layout gap="md" padding="md" alignItems="flex-start">
+<button text-button variant="primary" (click)="show = true">Open dialog</button>
+<span uni-text="body-2">Dialog reports: {{ lastEvent }}</span>
+</div>
+<dialog
+uni-dialog
+[(show)]="show"
+(showing)="lastEvent = $event ? 'open' : 'closed'"
+>
+<header dialog-header>Controlled dialog</header>
+<div box-layout padding="md" [width]="320">
+  <span uni-text="body-1-long" display="block">
+    Confirm and Cancel both close it, and so do Escape and a backdrop
+    click \u2014 every route keeps <code>show</code> in sync.
+  </span>
+</div>
+<footer dialog-buttons confirmButtonText="Save" cancelButtonText="Cancel"></footer>
+</dialog>`
         }
       ],
       guidelines: {
-        whenToUse: "Enhanced modal dialog that extends the native HTML `<dialog>` element with built-in animations, composition components, and accessibility features.\n### Features\n- **Native HTML Dialog**: Built on the standard dialog element with full semantic support\n- **Smooth Animations**: Automatic fade transitions for open/close states\n- **Composition Components**: Optional `DialogHeader` and `DialogButtons` for consistent layouts\n- **Programmatic Control**: Open/close methods plus show property binding\n- **Backdrop Handling**: Click-outside-to-close with customizable behavior\n- **Accessibility**: Full keyboard navigation, focus trapping, and screen reader support",
+        whenToUse: "Enhanced modal dialog that extends the native HTML `<dialog>` element with built-in animations, composition components, and accessibility features.\n### Features\n- **Native HTML Dialog**: Built on the standard dialog element with full semantic support\n- **Three-row layout**: Pinned header and action row with a scrolling body, on a surface that stays content-sized\n- **Smooth Animations**: Automatic fade transitions for open/close states\n- **Composition Components**: Optional `DialogHeader` and `DialogButtons` for consistent layouts\n- **Programmatic Control**: Open/close methods plus show property binding\n- **Backdrop Handling**: Click-outside-to-close with customizable behavior\n- **Accessibility**: Full keyboard navigation, focus trapping, and screen reader support",
         dos: [],
         donts: [],
         accessibility: [
@@ -3369,8 +3426,10 @@ emptyText="No countries found"
         "dialog.behavior.color",
         "dialog.behavior.border",
         "dialog.behavior.padding",
+        "dialog.behavior.inset",
         "dialog.behavior.elevation",
-        "dialog.behavior.backdrop"
+        "dialog.behavior.backdrop",
+        "dialog.behavior.motion"
       ]
     },
     {
@@ -3380,7 +3439,7 @@ emptyText="No countries found"
       summary: "",
       description: "",
       category: "feedback",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -3484,11 +3543,11 @@ emptyText="No countries found"
       summary: "",
       description: "",
       category: "feedback",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
-          selectorOrTag: "[uni-dialog-header]",
+          selectorOrTag: "[uni-dialog-header], [dialog-header]",
           api: [
             {
               name: "variant",
@@ -3525,7 +3584,7 @@ emptyText="No countries found"
       summary: "",
       description: "",
       category: "layout",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -3581,7 +3640,7 @@ emptyText="No countries found"
       summary: "",
       description: "",
       category: "directives",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -3613,7 +3672,7 @@ emptyText="No countries found"
       summary: "Drawer with two modes sharing one three-row layout: - `side` \u2014 an in-flow `<aside>` that pushes content (dashboard sidenav); opening/closing animates its width, and the divider border primitive separates it from the page.",
       description: "Drawer with two modes sharing one three-row layout: - `side` \u2014 an in-flow `<aside>` that pushes content (dashboard sidenav); opening/closing animates its width, and the divider border primitive separates it from the page. - `over` \u2014 a native `<dialog>` in the top layer: focus trap, Escape and scrim backdrop come from the platform (same machinery as `uni-dialog`), sliding in from its edge. **The panel is never the scroll container.** It is a flex column of three rows \u2014 an optional `[uni-drawer-header]`, the projected body, an optional `[uni-drawer-buttons]` \u2014 and only the body scrolls. The panel itself is `overflow: clip` on both axes. That is what lets a header and a save bar pin while a long form scrolls between them, and it is why the theme's `padding` option lands on the body row rather than the panel: padding on a scrolling box scrolls away with its content. Surface, width, divider, elevation, padding, backdrop, scrim and background all resolve from `drawer` theme tokens.",
       category: "components",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -3793,7 +3852,8 @@ initialFocus="input"
         "drawer.behavior.padding",
         "drawer.behavior.backdrop",
         "drawer.behavior.scrim",
-        "drawer.behavior.background"
+        "drawer.behavior.background",
+        "drawer.behavior.motion"
       ]
     },
     {
@@ -3803,7 +3863,7 @@ initialFocus="input"
       summary: "The drawer's pinned footer action row \u2014 the save bar of an editor panel.",
       description: "The drawer's pinned footer action row \u2014 the save bar of an editor panel. Sits outside the scrolling body, so the actions stay reachable however long the form is. Mirrors `[dialog-buttons]`; the difference is posture, which lives in the `drawerButtons` theme options rather than here.",
       category: "primitives",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -3900,7 +3960,7 @@ initialFocus="input"
       summary: "The drawer's pinned header row: a title, and optionally a close button.",
       description: "The drawer's pinned header row: a title, and optionally a close button. Sits outside the scrolling body, so it stays put while the form beneath it moves. Reached either by projecting it \u2014 `<div uni-drawer-header>` \u2014 or implicitly, by giving `uni-drawer` a `headline`, in which case the drawer renders one of these itself.",
       category: "components",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -3948,7 +4008,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "components",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -4082,7 +4142,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "layout",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -4186,7 +4246,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "layout",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -4257,7 +4317,7 @@ initialFocus="input"
       summary: "Trigger for a {@link UniExpandComponent} region.",
       description: "Trigger for a {@link UniExpandComponent} region. Two shapes, chosen by whether `label` is set: - **Icon only** (default) \u2014 the bare chevron, sized for a Card Header. - **Labelled** \u2014 chevron plus a label and optional muted sublabel, as a single full-width button. Most real disclosures need a name for the section, and building that row by hand is the thing this saves; it also makes the label the button's accessible name rather than adjacent text.",
       category: "layout",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -4342,7 +4402,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -4500,7 +4560,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "layout",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -4597,7 +4657,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "layout",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -4629,7 +4689,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "primitives",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -4689,7 +4749,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "primitives",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -4792,7 +4852,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -5070,7 +5130,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -5191,7 +5251,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "components",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -5261,7 +5321,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "layout",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -5365,7 +5425,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "layout",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -5447,7 +5507,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -5541,7 +5601,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -5713,7 +5773,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "feedback",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -5973,7 +6033,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "feedback",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -5997,7 +6057,7 @@ initialFocus="input"
       summary: "Numeric field with locale-aware parsing, `Intl` formatting on commit, prefix/suffix adornments and steppers that hold to repeat.",
       description: 'Numeric field with locale-aware parsing, `Intl` formatting on commit, prefix/suffix adornments and steppers that hold to repeat. Not `<input type="number">`, and the first reason is a data-loss bug: per the HTML value sanitization algorithm, a number input whose text is not a valid floating-point number reports `value === \'\'`. Type `12,50` as most of Europe does, or paste `1,234.56` from a spreadsheet, and the app reads an empty field. This is `type="text"` with `role="spinbutton"`, which is the only way to keep the user\'s malformed text on screen and tell them about it. Chrome comes from `uni-input-box`, so error, disabled and focus states match every other field. All arithmetic runs on the cdk\'s exact decimal helpers.',
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -6416,7 +6476,7 @@ initialFocus="input"
       summary: "Two linked numeric fields in one chrome, with one `{ start, end }` value \u2014 price filters, thresholds, tolerances.",
       description: "Two linked numeric fields in one chrome, with one `{ start, end }` value \u2014 price filters, thresholds, tolerances. `start`/`end` deliberately match `UniDateRange`, so the library has one range vocabulary, and they avoid colliding with the `min`/`max` **inputs**, which mean the fence rather than the value. It owns its commit path rather than nesting two `uni-number-input`s, because the two behaviours the spec asks for need *different* bounds: a stepper must be fenced at the other end, while a typed commit must reach the parent un-clamped so a backwards range can be swapped instead of destroyed. A child field applies one bound pair to both. The arithmetic, parsing and formatting are still the cdk's, shared with every other numeric control.",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -6698,7 +6758,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "data",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -6799,7 +6859,7 @@ initialFocus="input"
       summary: "Anchored, top-layer panel on the native `popover` element \u2014 the browser owns positioning (CSS anchor positioning), stacking, and, in rich mode, light dismissal.",
       description: 'Anchored, top-layer panel on the native `popover` element \u2014 the browser owns positioning (CSS anchor positioning), stacking, and, in rich mode, light dismissal. Two modes share one implementation: - `rich` (default): a click-toggled disclosure. The projected `[trigger]` carries `aria-expanded`/`aria-controls`; with no trigger content the app drives `open` and no element claims controller ARIA. Focus stays on the trigger (APG disclosure) unless the panel marks an `[autofocus]` field, and returns to the trigger on close. - `tooltip`: hover/focus-triggered, `role="tooltip"` + `aria-describedby`, WCAG 1.4.13 dismissable/hoverable/persistent. Content must not contain focusable elements. Anchoring and control are separate: `anchor` re-anchors the panel to any element (or id) while the trigger keeps the disclosure semantics.',
       category: "layout",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -6991,7 +7051,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "feedback",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -7055,7 +7115,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "feedback",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -7127,7 +7187,7 @@ initialFocus="input"
       summary: "`\u2212 3 +` for cart lines, table cells and seat counts: the numeric core with no field chrome, no label and no room for either.",
       description: '`\u2212 3 +` for cart lines, table cells and seat counts: the numeric core with no field chrome, no label and no room for either. A separate component rather than a `chrome="bare"` flag on `uni-number-input`, because this control is defined by what it does *not* have \u2014 presets, affixes, expressions, four stepper layouts \u2014 and eight inputs are easier to write correctly than forty with a list of which ones to leave alone. The arithmetic, parsing and hold-to-repeat are the cdk\'s, shared with the field, so `1,200` and the keyboard map behave identically in both. The middle stays a real input by default: typing `12` beats tapping `+` eleven times. `editable=false` is for read-mostly tables.',
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -7323,7 +7383,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -7514,7 +7574,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "directives",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -7538,7 +7598,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "layout",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -7593,7 +7653,7 @@ initialFocus="input"
       summary: "Native scroll area with theme-driven scrollbar styling.",
       description: "Native scroll area with theme-driven scrollbar styling. Scrollbars are styled entirely through Emotion-generated CSS: `::-webkit-scrollbar` rules cover Chromium/Safari, with a `scrollbar-width`/`scrollbar-color` fallback for Firefox.",
       category: "layout",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -7740,7 +7800,7 @@ initialFocus="input"
       summary: "Generic search field: shared input chrome with a leading magnifier, a clear button while there's a query, Enter to submit, and optional type-ahead \u2014 pass `suggestions` (refresh them from `change`) and the field becomes an ARIA combobox with a keyboard-navigable listbox.",
       description: "Generic search field: shared input chrome with a leading magnifier, a clear button while there's a query, Enter to submit, and optional type-ahead \u2014 pass `suggestions` (refresh them from `change`) and the field becomes an ARIA combobox with a keyboard-navigable listbox. Escape closes the list first, then clears the query.",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -7867,7 +7927,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -8033,7 +8093,7 @@ initialFocus="input"
       summary: "Loading placeholder painted with surface tokens.",
       description: "Loading placeholder painted with surface tokens. `text` renders one or more lines (the last line shortened, as real text would be), `rect` and `circle` render fixed shapes. The shimmer only animates when the user allows motion; it degrades to static blocks under `prefers-reduced-motion`. Color and radius are theme options with per-instance overrides, because one app routinely needs several: skeletons on a card and on the page background want different tints, and a pill placeholder wants a different corner than the text bars beside it.",
       category: "components",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -8184,7 +8244,7 @@ initialFocus="input"
       summary: "Bounded numeric input by pointer, for values where the *position* is the information: volume, opacity, weightings, price filters.",
       description: "Bounded numeric input by pointer, for values where the *position* is the information: volume, opacity, weightings, price filters. Custom thumbs rather than `<input type=\"range\">`, which the previous version used: one native range input cannot carry two thumbs, marks or a tooltip, and a second component for the range case would mean two keyboard maps to keep in step. The step model and the keyboard map are the cdk's, shared with the numeric fields, so nothing new is learned moving between them. All arithmetic on values runs through the cdk's exact decimal helpers \u2014 stepping `0.1` never yields `0.30000000000000004`. Only pointer *positions* use floats, and they are snapped to the grid before becoming a value.",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -8451,7 +8511,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "feedback",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -8563,7 +8623,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "data",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -8622,7 +8682,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "layout",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -8677,7 +8737,7 @@ initialFocus="input"
       summary: 'KPI stat tile: muted label, large value (numbers auto-compact: 48234 \u2192 "48.2K"), an optional delta whose ink is decided by *direction \xD7 whether up is good* (never direction alone \u2014 churn going down is good news), and an optional decorative sparkline.',
       description: 'KPI stat tile: muted label, large value (numbers auto-compact: 48234 \u2192 "48.2K"), an optional delta whose ink is decided by *direction \xD7 whether up is good* (never direction alone \u2014 churn going down is good news), and an optional decorative sparkline. Frame, typography and inks are all `stat` theme tokens.',
       category: "components",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -8795,7 +8855,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "primitives",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -8884,7 +8944,7 @@ initialFocus="input"
       summary: "One tab inside `uni-tabs`: a label for the tablist plus projected panel content.",
       description: "One tab inside `uni-tabs`: a label for the tablist plus projected panel content. Content is captured in a template and only instantiated while the tab is selected, so inactive panels cost nothing.",
       category: "components",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -8924,7 +8984,7 @@ initialFocus="input"
       summary: "WAI-ARIA tabs: roving tabindex, automatic activation (arrow keys move focus and select), Home/End, disabled tabs skipped.",
       description: "WAI-ARIA tabs: roving tabindex, automatic activation (arrow keys move focus and select), Home/End, disabled tabs skipped. Only the selected panel is instantiated. All styling resolves from `tabs` theme option tokens.",
       category: "components",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -9004,7 +9064,7 @@ initialFocus="input"
       summary: "Compact chip for categories, states, filters and tokens.",
       description: "Compact chip for categories, states, filters and tokens. Two orthogonal style axes: `variant` picks the colour role and `tone` picks the archetype (soft / solid / outline). Both live in the theme's `tag` entry, so a theme restyles every chip in the app without touching markup. Structurally a chip is **body + trailing action as siblings**, never nested buttons: an interactive chip whose body is a `<button>` cannot contain the remove `<button>` (invalid HTML, and the inner control becomes unreachable for keyboard users). Both stay independently operable.",
       category: "data",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -9361,7 +9421,7 @@ initialFocus="input"
       summary: "",
       description: "",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -9694,7 +9754,7 @@ placeholder="Name or address\u2026"
       summary: "The typography primitive, applied as an attribute to any element so semantics stay yours.",
       description: 'The typography primitive, applied as an attribute to any element so semantics stay yours. The attribute value is the typeface: `<h1 uni-text="display-small">`, `<span uni-text="caption">`, dynamic via `[uni-text]="role()"`. With no value, the typeface is inferred from the host element (h1 \u2192 headline-large, p \u2192 body-1-long, \u2026), falling back to `title-small`; the `typeface` input remains as an explicit override. It is a directive, so it stacks with anything else on the element \u2014 a layout attribute (`<div stack-layout uni-text="title-small">`) or a component\'s own host \u2014 rather than colliding with it.',
       category: "primitives",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -9796,7 +9856,7 @@ placeholder="Name or address\u2026"
       summary: "",
       description: "",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -9996,7 +10056,7 @@ placeholder="Name or address\u2026"
       summary: "",
       description: "",
       category: "primitives",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -10026,7 +10086,7 @@ placeholder="Name or address\u2026"
       summary: "Drop-in switcher for the themes registered via `UNI_THEMES`: a select over `ThemeService.themeOptions` that applies the choice through `selectTheme` (so it persists across reloads like any other theme selection).",
       description: "Drop-in switcher for the themes registered via `UNI_THEMES`: a select over `ThemeService.themeOptions` that applies the choice through `selectTheme` (so it persists across reloads like any other theme selection).",
       category: "components",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -10084,7 +10144,7 @@ placeholder="Name or address\u2026"
       summary: "Time field: a combobox over time options \u2014 the same listbox contract as uni-search-input and uni-tag-input.",
       description: "Time field: a combobox over time options \u2014 the same listbox contract as uni-search-input and uni-tag-input. Type `3p`, `930` or `15:00`, or pick `3:00 PM` from the list; the form always gets 24-hour `'HH:mm'` (`hour12` affects display only). The list is assistive, not exhaustive: any parseable time commits, unless `slots` pins the choices (a slot picker) \u2014 then a typed time must match one. Unreadable or unavailable text stays in the field, flagged, with a `rejected` event.",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -10292,7 +10352,7 @@ placeholder="Name or address\u2026"
       summary: "",
       description: "",
       category: "forms",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -10515,7 +10575,7 @@ placeholder="Name or address\u2026"
       summary: "",
       description: "",
       category: "feedback",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -10602,7 +10662,7 @@ placeholder="Name or address\u2026"
       summary: 'A thin sequencer over one `uni-callout`: steps spotlight their targets, a footer walks Next/Back with dots-or-fraction progress, and `advanceOn` gates a step behind an interaction with its target (auto-advancing for clicks, unlocking Next otherwise \u2014 announced through one `role="status"` region).',
       description: 'A thin sequencer over one `uni-callout`: steps spotlight their targets, a footer walks Next/Back with dots-or-fraction progress, and `advanceOn` gates a step behind an interaction with its target (auto-advancing for clicks, unlocking Next otherwise \u2014 announced through one `role="status"` region). Escape or the close button skips the tour and reports the step. `active` is a two-way model, so a tour is deep-linkable and inspectable; steps whose declared target cannot be resolved are skipped (with a dev warning) in the direction of travel rather than erroring.',
       category: "components",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -10729,7 +10789,7 @@ placeholder="Name or address\u2026"
       summary: "",
       description: "",
       category: "layout",
-      version: "10.2.1",
+      version: "10.4.0",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -11915,6 +11975,17 @@ placeholder="Name or address\u2026"
         DarkTheme: "0 0 5px rgba(255, 150, 138, 0.55), inset 0 0 5px rgba(255, 150, 138, 0.35)"
       }
     },
+    {
+      id: "backdrop.scrim",
+      value: '{"background":"rgba(255, 255, 255, 0.6)","backdropFilter":"blur(2px)"}',
+      type: "backdrop",
+      kind: "style",
+      target: "emotion-css",
+      themeValues: {
+        LightTheme: '{"background":"rgba(255, 255, 255, 0.6)","backdropFilter":"blur(2px)"}',
+        DarkTheme: '{"background":"rgba(255, 255, 255, 0.6)","backdropFilter":"blur(2px)"}'
+      }
+    },
     {
       id: "thickness.thin",
       value: 1,
@@ -12476,14 +12547,14 @@ placeholder="Name or address\u2026"
     },
     {
       id: "drawer.behavior.backdrop",
-      value: '{"background":"rgba(0, 0, 0, 0.4)"}',
-      type: "object",
+      value: "scrim",
+      type: "string",
       kind: "behavioral",
       target: "component-prop",
       appliesTo: "drawer",
       themeValues: {
-        LightTheme: '{"background":"rgba(0, 0, 0, 0.4)"}',
-        DarkTheme: '{"background":"rgba(0, 0, 0, 0.4)"}'
+        LightTheme: "scrim",
+        DarkTheme: "scrim"
       }
     },
     {
@@ -12510,6 +12581,18 @@ placeholder="Name or address\u2026"
         DarkTheme: "solid"
       }
     },
+    {
+      id: "drawer.behavior.motion",
+      value: "panel",
+      type: "string",
+      kind: "behavioral",
+      target: "component-prop",
+      appliesTo: "drawer",
+      themeValues: {
+        LightTheme: "panel",
+        DarkTheme: "panel"
+      }
+    },
     {
       id: "drawerHeader.behavior.height",
       value: 56,
@@ -13002,6 +13085,18 @@ placeholder="Name or address\u2026"
         DarkTheme: "sm"
       }
     },
+    {
+      id: "dialog.behavior.inset",
+      value: "lg",
+      type: "string",
+      kind: "behavioral",
+      target: "component-prop",
+      appliesTo: "dialog",
+      themeValues: {
+        LightTheme: "lg",
+        DarkTheme: "lg"
+      }
+    },
     {
       id: "dialog.behavior.elevation",
       value: "dialog",
@@ -13016,14 +13111,26 @@ placeholder="Name or address\u2026"
     },
     {
       id: "dialog.behavior.backdrop",
-      value: '{"background":"rgba(255, 255, 255, 0.6)","backdropFilter":"blur(2px)"}',
-      type: "object",
+      value: "scrim",
+      type: "string",
       kind: "behavioral",
       target: "component-prop",
       appliesTo: "dialog",
       themeValues: {
-        LightTheme: '{"background":"rgba(255, 255, 255, 0.6)","backdropFilter":"blur(2px)"}',
-        DarkTheme: '{"background":"rgba(255, 255, 255, 0.6)","backdropFilter":"blur(2px)"}'
+        LightTheme: "scrim",
+        DarkTheme: "scrim"
+      }
+    },
+    {
+      id: "dialog.behavior.motion",
+      value: "panel",
+      type: "string",
+      kind: "behavioral",
+      target: "component-prop",
+      appliesTo: "dialog",
+      themeValues: {
+        LightTheme: "panel",
+        DarkTheme: "panel"
       }
     },
     {
@@ -16197,6 +16304,7 @@ placeholder="Name or address\u2026"
         "shadow.menu": "rgba(23, 25, 43, 0.2) 0px 3px 3px -2px, rgba(23, 25, 43, 0.14) 0px 3px 4px 0px, rgba(23, 25, 43, 0.12) 0px 1px 8px 0px",
         "shadow.dialog": "rgba(23, 25, 43, 0.2) 0px 3px 5px -1px, rgba(23, 25, 43, 0.14) 0px 6px 10px 0px, rgba(23, 25, 43, 0.12) 0px 1px 18px 0px",
         "shadow.warn": "0 0 5px rgba(204, 40, 39, 0.5), inset 0 0 5px rgba(204, 40, 39, 0.3)",
+        "backdrop.scrim": '{"background":"rgba(255, 255, 255, 0.6)","backdropFilter":"blur(2px)"}',
         "thickness.thin": 1,
         "thickness.standard": 2,
         "thickness.thick": 4,
@@ -16255,9 +16363,10 @@ placeholder="Name or address\u2026"
           divider: "light",
           elevation: "menu",
           padding: "md",
-          backdrop: '{"background":"rgba(0, 0, 0, 0.4)"}',
+          backdrop: "scrim",
           scrim: true,
-          background: "solid"
+          background: "solid",
+          motion: "panel"
         },
         drawerHeader: {
           height: 56,
@@ -16315,8 +16424,10 @@ placeholder="Name or address\u2026"
           color: "primary-surface",
           border: "quaternary",
           padding: "sm",
+          inset: "lg",
           elevation: "dialog",
-          backdrop: '{"background":"rgba(255, 255, 255, 0.6)","backdropFilter":"blur(2px)"}'
+          backdrop: "scrim",
+          motion: "panel"
         },
         dialogButtons: {
           gap: "md",
@@ -16763,6 +16874,7 @@ placeholder="Name or address\u2026"
         "shadow.menu": "0px 4px 12px rgba(0, 0, 0, 0.45)",
         "shadow.dialog": "0px 8px 28px rgba(0, 0, 0, 0.55)",
         "shadow.warn": "0 0 5px rgba(255, 150, 138, 0.55), inset 0 0 5px rgba(255, 150, 138, 0.35)",
+        "backdrop.scrim": '{"background":"rgba(255, 255, 255, 0.6)","backdropFilter":"blur(2px)"}',
         "thickness.thin": 1,
         "thickness.standard": 2,
         "thickness.thick": 4,
@@ -16821,9 +16933,10 @@ placeholder="Name or address\u2026"
           divider: "light",
           elevation: "menu",
           padding: "md",
-          backdrop: '{"background":"rgba(0, 0, 0, 0.4)"}',
+          backdrop: "scrim",
           scrim: true,
-          background: "solid"
+          background: "solid",
+          motion: "panel"
         },
         drawerHeader: {
           height: 56,
@@ -16881,8 +16994,10 @@ placeholder="Name or address\u2026"
           color: "primary-surface",
           border: "quaternary",
           padding: "sm",
+          inset: "lg",
           elevation: "dialog",
-          backdrop: '{"background":"rgba(255, 255, 255, 0.6)","backdropFilter":"blur(2px)"}'
+          backdrop: "scrim",
+          motion: "panel"
         },
         dialogButtons: {
           gap: "md",
@@ -17225,6 +17340,30 @@ placeholder="Name or address\u2026"
     {
       package: "@uni-design-system/uni-angular",
       releases: [
+        {
+          version: "10.4.0",
+          entries: [
+            {
+              bump: "minor",
+              title: "Give `uni-dialog` the drawer's three-row layout: a pinned `[uni-dialog-header]`, a scrolling body, and pinned `[uni-dialog-buttons]`.",
+              body: "The surface is now a flex column that is `overflow: clip` on both axes, so it is never the scroll container \u2014 previously a long form scrolled the dialog's own title and action buttons off the screen. Unlike the drawer, the dialog declares no height and stays sized by its content, growing until it reaches `calc(100dvh - 2 \xD7 inset)` and only then scrolling its body.\n\nNew theme options: `dialog.inset` (gap from the viewport edge before the body scrolls, default `lg`), `dialog.bodyPadding` (pads the scrolling row alone; `dialog.padding` still insets all three rows), and `divider` on `dialogHeader` / `dialogButtons` for a border between a pinned row and the body \u2014 all off or unchanged by default, so existing dialogs keep their appearance.\n\n`[uni-dialog-header]` gains the shorter `[dialog-header]` alias, matching `[dialog-buttons]`; the long form keeps working. The `defaultCloseButton` now actually floats in the corner \u2014 its `position: absolute` was being lost to the icon button's own class, which left it inline at the top of the surface.\n\nThe drawer's overlay scrim now fades in and out with the panel instead of snapping. Its `::backdrop` had a background and no animation at all, so the dimming appeared and vanished instantly around a panel that took 250ms to slide. A new `drawer.motion` option (default `panel`) times the slide, the scrim's fade and the side panel's width transition together, replacing the hardcoded 250ms literals. The global reduced-motion rule now also reaches `::backdrop`, so both the drawer's and the dialog's scrim honour the preference (WCAG 2.3.3).\n\nDialog and drawer scrims now come from one token. `UniTheme` gains a `backdrops` scale \u2014 open and named like `shadows` and `motion` \u2014 and both components' `backdrop` option points at a name (`'scrim'`) instead of carrying its own CSS. They had drifted: the dialog washed the page white and blurred it while the drawer dimmed it dark, and a theme that dressed the dialog left the drawer on the library default. A raw style object is still accepted on either option, so a theme that states one keeps working.\n\nThe dialog's fade now reads the theme's `motion` token too (new `dialog.motion` option, default `panel`), replacing a hardcoded `350ms ease-in`. It shared the drawer's scrim but not its timing, so the same surface arrived at two speeds; both are now 250ms and a theme retimes them together.",
+              commit: "cb5f08f"
+            }
+          ],
+          dependencyBumps: []
+        },
+        {
+          version: "10.3.0",
+          entries: [
+            {
+              bump: "minor",
+              title: "`uni-button`: the focus ring is themed, and the theme now outranks the reset.",
+              body: "**Five of the twelve variants had no visible keyboard focus ring.** The ring\nresolved the variant _name_ as a colour token \u2014 the pattern 10.2.0 removed from\ncheckbox, radio and toggle, missed on the one component where it costs an\naccessibility failure rather than a wrong colour:\n\n```ts\noutline: `2px solid ${this.theme.colors()[this.variant()]}`;\n```\n\n`ghost` resolves to `transparent`, so its ring was drawn invisibly.\n`light`, `onLight`, `dark` and `onDark` have no colour token at all, so the\ndeclaration became `2px solid undefined` and the parser dropped it \u2014 as would\nany intent a consumer registers. In every case `outline-offset` survived, so\nthe element still shifted on focus and the missing ring went unnoticed. This\nwas live without the registry involved.\n\nThe colour now comes from the variant's theme entry via `variantOptions`, the\nmechanism the selection controls already use, and falls back to the reserved\n`primary` accent rather than to nothing. Each variant keeps the ring colour it\nhad; `ghost` gains a visible one. The ring also routes through the shared\n`focusRingStyle`, so a theme defining `focusRing` primitives restyles the button\nalongside every other control.\n\n**A theme could not give a button a border.** `border`, `outline`, `overflow`\nand `transition` were applied _after_ the theme's styles, so a variant\ndeclaring a border was silently erased and `!important` was the only way\nthrough \u2014 which then spread to every state adjusting that border, since the\nshorthand outranks the longhand.\n\nThe base theme was caught by its own reset: `secondary` is commented \"Hollow\"\nand declares `1px solid`, and has been rendering borderless. **It now renders\nits border** \u2014 the one visible change here for anyone on the default theme.\n\nThose four properties move ahead of the theme's styles, resolving the\n`TODO: Set priority on theme-defined styles` that sat on this line. Structure\nthe component genuinely owns \u2014 `position` for the ripple, the symbol slots \u2014\nstays after, and the reset still applies to every variant that does not\noverride it.\n\n**`uni-icon-button`'s hover moved to the theme too.** It branched on\n`variant() === 'ghost'` to choose between a raised shadow and a translucent\nwash, after the theme's own styles. Being a binary partition, every intent a\nconsumer registered fell into the not-ghost half and was given a lift whether\nor not it suited \u2014 a recessive intent included \u2014 and no theme could correct it.\nBoth themes in this repo declare a ghost hover and had it silently overridden.\n\nBoth treatments now live in `iconButton.variants` beside the colours they belong\nwith. Rendering is unchanged for the variants the theme styles; a variant it\ndoes not style no longer receives a hover it never asked for, and the `disabled`\nvariant loses one it should never have had, since its block is also spread into\n`&:disabled`.\n\n**`uni-icon-button` had no focus indicator at all.** Its structural block cleared\nthe user-agent outline and put nothing back, in every variant \u2014 so the close\naffordance in every dialog and drawer header was unreachable-looking under\nkeyboard navigation. This was not reported; it was found while verifying the\nbutton fix above.\n\nIt now draws the shared ring, with its colour read from the same\n`variantOptions.focusColor` the button uses. The indicator is applied last on\npurpose: its appearance is the theme's, through `focusColor` and the `focusRing`\nprimitives, but whether one exists is not a style a theme should be able to\nswitch off by accident.",
+              commit: "ab1689a"
+            }
+          ],
+          dependencyBumps: []
+        },
         {
           version: "10.2.1",
           entries: [],
@@ -17989,6 +18128,30 @@ placeholder="Name or address\u2026"
     {
       package: "@uni-design-system/uni-core",
       releases: [
+        {
+          version: "10.4.0",
+          entries: [
+            {
+              bump: "minor",
+              title: "Give `uni-dialog` the drawer's three-row layout: a pinned `[uni-dialog-header]`, a scrolling body, and pinned `[uni-dialog-buttons]`.",
+              body: "The surface is now a flex column that is `overflow: clip` on both axes, so it is never the scroll container \u2014 previously a long form scrolled the dialog's own title and action buttons off the screen. Unlike the drawer, the dialog declares no height and stays sized by its content, growing until it reaches `calc(100dvh - 2 \xD7 inset)` and only then scrolling its body.\n\nNew theme options: `dialog.inset` (gap from the viewport edge before the body scrolls, default `lg`), `dialog.bodyPadding` (pads the scrolling row alone; `dialog.padding` still insets all three rows), and `divider` on `dialogHeader` / `dialogButtons` for a border between a pinned row and the body \u2014 all off or unchanged by default, so existing dialogs keep their appearance.\n\n`[uni-dialog-header]` gains the shorter `[dialog-header]` alias, matching `[dialog-buttons]`; the long form keeps working. The `defaultCloseButton` now actually floats in the corner \u2014 its `position: absolute` was being lost to the icon button's own class, which left it inline at the top of the surface.\n\nThe drawer's overlay scrim now fades in and out with the panel instead of snapping. Its `::backdrop` had a background and no animation at all, so the dimming appeared and vanished instantly around a panel that took 250ms to slide. A new `drawer.motion` option (default `panel`) times the slide, the scrim's fade and the side panel's width transition together, replacing the hardcoded 250ms literals. The global reduced-motion rule now also reaches `::backdrop`, so both the drawer's and the dialog's scrim honour the preference (WCAG 2.3.3).\n\nDialog and drawer scrims now come from one token. `UniTheme` gains a `backdrops` scale \u2014 open and named like `shadows` and `motion` \u2014 and both components' `backdrop` option points at a name (`'scrim'`) instead of carrying its own CSS. They had drifted: the dialog washed the page white and blurred it while the drawer dimmed it dark, and a theme that dressed the dialog left the drawer on the library default. A raw style object is still accepted on either option, so a theme that states one keeps working.\n\nThe dialog's fade now reads the theme's `motion` token too (new `dialog.motion` option, default `panel`), replacing a hardcoded `350ms ease-in`. It shared the drawer's scrim but not its timing, so the same surface arrived at two speeds; both are now 250ms and a theme retimes them together.",
+              commit: "cb5f08f"
+            }
+          ],
+          dependencyBumps: []
+        },
+        {
+          version: "10.3.0",
+          entries: [
+            {
+              bump: "minor",
+              title: "`uni-button`: the focus ring is themed, and the theme now outranks the reset.",
+              body: "**Five of the twelve variants had no visible keyboard focus ring.** The ring\nresolved the variant _name_ as a colour token \u2014 the pattern 10.2.0 removed from\ncheckbox, radio and toggle, missed on the one component where it costs an\naccessibility failure rather than a wrong colour:\n\n```ts\noutline: `2px solid ${this.theme.colors()[this.variant()]}`;\n```\n\n`ghost` resolves to `transparent`, so its ring was drawn invisibly.\n`light`, `onLight`, `dark` and `onDark` have no colour token at all, so the\ndeclaration became `2px solid undefined` and the parser dropped it \u2014 as would\nany intent a consumer registers. In every case `outline-offset` survived, so\nthe element still shifted on focus and the missing ring went unnoticed. This\nwas live without the registry involved.\n\nThe colour now comes from the variant's theme entry via `variantOptions`, the\nmechanism the selection controls already use, and falls back to the reserved\n`primary` accent rather than to nothing. Each variant keeps the ring colour it\nhad; `ghost` gains a visible one. The ring also routes through the shared\n`focusRingStyle`, so a theme defining `focusRing` primitives restyles the button\nalongside every other control.\n\n**A theme could not give a button a border.** `border`, `outline`, `overflow`\nand `transition` were applied _after_ the theme's styles, so a variant\ndeclaring a border was silently erased and `!important` was the only way\nthrough \u2014 which then spread to every state adjusting that border, since the\nshorthand outranks the longhand.\n\nThe base theme was caught by its own reset: `secondary` is commented \"Hollow\"\nand declares `1px solid`, and has been rendering borderless. **It now renders\nits border** \u2014 the one visible change here for anyone on the default theme.\n\nThose four properties move ahead of the theme's styles, resolving the\n`TODO: Set priority on theme-defined styles` that sat on this line. Structure\nthe component genuinely owns \u2014 `position` for the ripple, the symbol slots \u2014\nstays after, and the reset still applies to every variant that does not\noverride it.\n\n**`uni-icon-button`'s hover moved to the theme too.** It branched on\n`variant() === 'ghost'` to choose between a raised shadow and a translucent\nwash, after the theme's own styles. Being a binary partition, every intent a\nconsumer registered fell into the not-ghost half and was given a lift whether\nor not it suited \u2014 a recessive intent included \u2014 and no theme could correct it.\nBoth themes in this repo declare a ghost hover and had it silently overridden.\n\nBoth treatments now live in `iconButton.variants` beside the colours they belong\nwith. Rendering is unchanged for the variants the theme styles; a variant it\ndoes not style no longer receives a hover it never asked for, and the `disabled`\nvariant loses one it should never have had, since its block is also spread into\n`&:disabled`.\n\n**`uni-icon-button` had no focus indicator at all.** Its structural block cleared\nthe user-agent outline and put nothing back, in every variant \u2014 so the close\naffordance in every dialog and drawer header was unreachable-looking under\nkeyboard navigation. This was not reported; it was found while verifying the\nbutton fix above.\n\nIt now draws the shared ring, with its colour read from the same\n`variantOptions.focusColor` the button uses. The indicator is applied last on\npurpose: its appearance is the theme's, through `focusColor` and the `focusRing`\nprimitives, but whether one exists is not a style a theme should be able to\nswitch off by accident.",
+              commit: "ab1689a"
+            }
+          ],
+          dependencyBumps: []
+        },
         {
           version: "10.2.1",
           entries: [],
@@ -18525,6 +18688,16 @@ placeholder="Name or address\u2026"
     {
       package: "@uni-design-system/uni-react",
       releases: [
+        {
+          version: "10.4.0",
+          entries: [],
+          dependencyBumps: []
+        },
+        {
+          version: "10.3.0",
+          entries: [],
+          dependencyBumps: []
+        },
         {
           version: "10.2.1",
           entries: [],
@@ -18768,6 +18941,16 @@ placeholder="Name or address\u2026"
     {
       package: "@uni-design-system/uni-mcp",
       releases: [
+        {
+          version: "10.4.0",
+          entries: [],
+          dependencyBumps: []
+        },
+        {
+          version: "10.3.0",
+          entries: [],
+          dependencyBumps: []
+        },
         {
           version: "10.2.1",
           entries: [
@@ -20032,6 +20215,10 @@ var BaseMotion = {
     easing: "ease"
   }
 };
+var BaseBackdrops = { scrim: {
+  background: "rgba(255, 255, 255, 0.6)",
+  backdropFilter: "blur(2px)"
+} };
 var BaseRadii = {
   none: "none",
   xxs: "4px",
@@ -20106,9 +20293,10 @@ var buildComponents = (c) => ({
     divider: "light",
     elevation: "menu",
     padding: "md",
-    backdrop: { background: "rgba(0, 0, 0, 0.4)" },
+    backdrop: "scrim",
     scrim: true,
-    background: "solid"
+    background: "solid",
+    motion: "panel"
   } },
   drawerHeader: { options: {
     color: void 0,
@@ -20223,17 +20411,18 @@ var buildComponents = (c) => ({
     color: "primary-surface",
     border: "quaternary",
     padding: "sm",
+    bodyPadding: void 0,
+    inset: "lg",
     elevation: "dialog",
-    backdrop: {
-      background: "rgba(255, 255, 255, 0.6)",
-      backdropFilter: "blur(2px)"
-    }
+    backdrop: "scrim",
+    motion: "panel"
   } },
   dialogButtons: { options: {
     gap: "md",
     padding: "md",
     paddingBottom: "lg",
     justifyContent: "center",
+    divider: void 0,
     confirmButtonVariant: "primary",
     cancelButtonVariant: "warn",
     buttonSize: "lg",
@@ -20246,6 +20435,7 @@ var buildComponents = (c) => ({
     height: 48,
     textRole: "title-large",
     textAlign: "center",
+    divider: void 0,
     closeButtonIcon: "close",
     closeButtonSize: "md"
   } },
@@ -20542,6 +20732,15 @@ var buildComponents = (c) => ({
       cursor: "pointer",
       transition: "all 0.28s ease"
     },
+    variantOptions: {
+      primary: { focusColor: "primary" },
+      secondary: { focusColor: "secondary" },
+      tertiary: { focusColor: "tertiary" },
+      warn: { focusColor: "warn" },
+      success: { focusColor: "success" },
+      disabled: { focusColor: "disabled" },
+      ghost: { focusColor: "primary" }
+    },
     variants: {
       ghost: {
         backgroundColor: "transparent",
@@ -20613,30 +20812,45 @@ var buildComponents = (c) => ({
   },
   iconButton: {
     options: { borderRadius: "max" },
+    variantOptions: {
+      primary: { focusColor: "primary" },
+      secondary: { focusColor: "secondary" },
+      tertiary: { focusColor: "tertiary" },
+      warn: { focusColor: "warn" },
+      success: { focusColor: "success" },
+      disabled: { focusColor: "disabled" },
+      ghost: { focusColor: "primary" }
+    },
     variants: {
       ghost: {
         backgroundColor: "transparent",
-        color: "currentcolor"
+        color: "currentcolor",
+        "&:hover": { backgroundColor: "rgba(0,0,0,0.1)" }
       },
       primary: {
         backgroundColor: c.primary,
-        color: c["on-primary"]
+        color: c["on-primary"],
+        "&:hover": { boxShadow: BaseShadows.raised }
       },
       secondary: {
         backgroundColor: c.secondary,
-        color: c["on-secondary"]
+        color: c["on-secondary"],
+        "&:hover": { boxShadow: BaseShadows.raised }
       },
       tertiary: {
         backgroundColor: c.tertiary,
-        color: c["on-tertiary"]
+        color: c["on-tertiary"],
+        "&:hover": { boxShadow: BaseShadows.raised }
       },
       warn: {
         backgroundColor: c.warn,
-        color: c["on-warn"]
+        color: c["on-warn"],
+        "&:hover": { boxShadow: BaseShadows.raised }
       },
       success: {
         backgroundColor: c.success,
-        color: c["on-success"]
+        color: c["on-success"],
+        "&:hover": { boxShadow: BaseShadows.raised }
       },
       disabled: {
         backgroundColor: "transparent !important",
@@ -20892,7 +21106,7 @@ var deepMerge = (base, override) => {
   for (const [key, value] of Object.entries(override)) out[key] = isRecord$1(value) && isRecord$1(out[key]) ? deepMerge(out[key], value) : value;
   return out;
 };
-var createTheme = ({ id, name, colors, icons = {}, radii = BaseRadii, shadows = BaseShadows, motion, typography, borders, thicknesses, spacing, components }) => ({
+var createTheme = ({ id, name, colors, icons = {}, radii = BaseRadii, shadows = BaseShadows, motion, backdrops, typography, borders, thicknesses, spacing, components }) => ({
   id,
   name,
   colors,
@@ -20908,6 +21122,10 @@ var createTheme = ({ id, name, colors, icons = {}, radii = BaseRadii, shadows =
     ...BaseMotion,
     ...motion
   },
+  backdrops: {
+    ...BaseBackdrops,
+    ...backdrops
+  },
   thicknesses: {
     ...BaseThicknesses,
     ...thicknesses
@@ -21938,7 +22156,7 @@ function createUniServer() {
     "list-tokens",
     {
       title: "List design tokens",
-      description: "Inventory of Uni design tokens. Filter by `type` (color, spacing, radius, shadow, border, thickness, typography, ...), `kind` (style|behavioral), or `theme`.",
+      description: "Inventory of Uni design tokens. Filter by `type` (color, spacing, radius, shadow, border, backdrop, thickness, typography, ...), `kind` (style|behavioral), or `theme`.",
       inputSchema: {
         type: z.string().optional(),
         kind: z.enum(["style", "behavioral"]).optional(),
@@ -22258,4 +22476,4 @@ export {
   buildStoredTheme,
   createUniServer
 };
-//# sourceMappingURL=chunk-JMAG4RA3.js.map
+//# sourceMappingURL=chunk-QZ5TESCY.js.map