@uni-design-system/uni-mcp 4.2.0 → 4.3.0

package/dist/{chunk-VQE52XFX.js → chunk-WCJS2FYS.js}

@@ -7,8 +7,8 @@ import { z } from "zod";
 // src/data/uni-index.json
 var uni_index_default = {
   meta: {
-    version: "6.0.0",
-    builtAt: "2026-07-24T13:32:56.708Z",
+    version: "6.0.1",
+    builtAt: "2026-07-24T15:08:54.365Z",
     frameworks: [
       "angular"
     ],
@@ -27,7 +27,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "feedback",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -82,7 +82,7 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "The Alert is used to communicate a state that affects a system, feature or page.\nFor instance, alerts can be used to display errors or any unexpected results from a user's action.",
         dos: [],
         donts: [],
         accessibility: []
@@ -101,7 +101,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "components",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -141,10 +141,13 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Horizontal application bar for the top of a page or section. Project controls with the\n`leading` attribute (menu button, logo) and actions with `trailing` (pushed to the far\nedge); pass `title` or project your own center content. Surface color, height, the\ndivider rule, title typography and spacing all resolve from the theme's `appBar`\noptions, and `sticky` pins the bar to the top of its scroll container.\nPlace it inside your page's `<header>` landmark. It pairs with the Drawer \u2014 see the\nDrawer docs for the full dashboard-shell recipe.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          "The bar is a styled container, not a landmark \u2014 place it inside your page's `<header>` element.",
+          "Give leading/trailing icon buttons text content or `ariaLabel` so they announce."
+        ]
       },
       relatedTokens: []
     },
@@ -155,7 +158,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "components",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -213,10 +216,13 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Identity avatar with a graceful fallback chain: the image when it loads, initials\nderived from `name` when it doesn't (or was never given), and a themed symbol as the\nlast resort. The name doubles as the accessible label; avatars with no name are marked\ndecorative automatically.\nVariants color initials from the role's container tokens, so avatars follow the brand\npalette in light and dark. The corner radius is the theme's `avatar.options.borderRadius`\ntoken \u2014 circles by default, squares under a `sharp` shape language.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          'With a `name`, the avatar is `role="img"` labelled by that name; purely decorative avatars are `aria-hidden`.',
+          'The group is a `role="group"`; the "+N" chip reads as text.'
+        ]
       },
       relatedTokens: [
         "avatar.behavior.borderRadius",
@@ -231,7 +237,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "components",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -264,7 +270,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "primitives",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -327,10 +333,14 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "The Background component is a flexible container that allows you to add and control background images in your application.\nIt provides various options for positioning and sizing the background image while maintaining a clean and responsive layout.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          "Ensure any text overlaid on the background has sufficient contrast",
+          "Don't rely on background images to convey important information",
+          "Consider providing alternative visual styles for users who prefer reduced motion"
+        ]
       },
       relatedTokens: []
     },
@@ -341,7 +351,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "feedback",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -406,7 +416,7 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Badges are used to highlight an item's status for quick recognition.",
         dos: [],
         donts: [],
         accessibility: []
@@ -422,7 +432,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "directives",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -446,7 +456,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -795,7 +805,7 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Box is the base Layout component. It is highly configurable.\nEach layout component extends the Box component while providing presets to support their application.",
         dos: [],
         donts: [],
         accessibility: []
@@ -809,7 +819,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "components",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -853,10 +863,15 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Breadcrumbs show where the current page sits in the hierarchy and give one-click\npassage back up the trail. The component renders the WAI-ARIA pattern: a labelled\n`nav` landmark wrapping an ordered list, with the last item marked as the current page\nand separators hidden from assistive tech.\nItems with `href` render as real links. For SPA routing, omit `href` and handle\n`itemClicked` \u2014 items render as link-styled buttons instead. Typography, link and\ncurrent-page colors, the separator symbol, and spacing all resolve from the theme's\n`breadcrumb` options.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          "Renders the WAI-ARIA pattern: a labelled `nav` landmark wrapping an ordered list.",
+          'The last item is `aria-current="page"` and not a link.',
+          "Separators are `aria-hidden` \u2014 screen readers hear the trail, not the chevrons.",
+          "Set `ariaLabel` when a page has more than one breadcrumb nav."
+        ]
       },
       relatedTokens: [
         "breadcrumb.behavior.typeface",
@@ -873,7 +888,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "primitives",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -996,10 +1011,13 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Button is a clickable interactive element that triggers a response.\nYou can place text and icons inside of a button.\nButtons are often used for form submissions and to toggle elements into view.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          "A real `<button>` element \u2014 native focus, Enter/Space activation, and `disabled` semantics.",
+          "`aria-busy` is set while `loading`; the spinner and symbols are decorative."
+        ]
       },
       relatedTokens: [
         "button.behavior.borderRadius",
@@ -1013,7 +1031,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "primitives",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1029,10 +1047,12 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "The `ButtonGroup` component is used to group related buttons. It applies some base styling to the nested buttons.\nIf this is not desirable, consider using the `Row` component.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          "Group the related actions; each button keeps its own accessible name."
+        ]
       },
       relatedTokens: []
     },
@@ -1043,7 +1063,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1072,7 +1092,7 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Content container with a themed frame: the border resolves from the **border\nprimitive named by its variant** (`borders.primary` \u2026 `borders.success`), the corner\nradius from the `card` theme options, and an optional elevation shadow. Compose with\nCard Header and Card Content for the standard anatomy \u2014 or point `options.border` at\na custom primitive to restyle every card in the theme at once.",
         dos: [],
         donts: [],
         accessibility: []
@@ -1088,7 +1108,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1112,7 +1132,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1153,7 +1173,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1194,7 +1214,7 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "`Center` is a layout component that centers its child within itself.\n`Center` is an extension to the `Box` component and has all the `Box` attributes available to it.",
         dos: [],
         donts: [],
         accessibility: []
@@ -1208,7 +1228,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "forms",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1320,10 +1340,18 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
-        dos: [],
-        donts: [],
-        accessibility: []
+        whenToUse: 'Binary choice control for forms: check to opt in, submit to apply. It implements\n`FormCheckboxControl` for the Signal Forms `[field]` directive (or bind\n`[(checked)]` directly), exposes `aria-invalid` once touched, and supports an\n`indeterminate` model for "select all" parents \u2014 cleared automatically on the next\nuser interaction, matching native behavior.\nThe box color, check stroke (the variant\'s paired on-color), and size resolve from\nthe `checkbox` theme options.',
+        dos: [
+          "Use for choices that apply when the form is submitted"
+        ],
+        donts: [
+          "Use for instant on/off effects \u2014 that is a toggle"
+        ],
+        accessibility: [
+          'Semantic `<input type="checkbox">` + `<label>`; Space toggles.',
+          "`aria-invalid` reflects the error state once the field was touched or is dirty.",
+          'The indeterminate visual state is carried by the native `indeterminate` property, announced as "mixed".'
+        ]
       },
       relatedTokens: [
         "checkbox.behavior.size",
@@ -1337,7 +1365,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "feedback",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1384,7 +1412,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "forms",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1453,7 +1481,7 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: 'The Data Search input filters a `UniDatasource` as the user types. With a client-side\n`UniRecordDatasource` it applies a predicate over the record\'s fields; with a\n`UniServerSideDatasource` it sends a filter object to the data loader. Pass `fields` to\nrestrict the search to specific columns. A clear button resets the filter.\nIt pairs with the [Data Table](?path=/docs/components-data-table--docs) \u2014 see its\n"With Search" story.',
         dos: [],
         donts: [],
         accessibility: []
@@ -1467,7 +1495,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "data",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1550,10 +1578,14 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Data grid for structured records: sortable column headers (Sort Header), paging\n(Paginator), field-scoped search (Data Search), row interaction, sticky columns,\nand expandable detail rows \u2014 all themed through the `dataTable` options, which\npoint at shared tokens for surfaces, borders, and typography.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          'Column headers use `scope="col"`; sortable headers are real buttons with `aria-sort` on the `<th>`.',
+          'The loading overlay is a `role="status"` region and the table is `aria-busy` while loading.',
+          "Collapsed detail rows are `inert`, out of the accessibility tree until expanded."
+        ]
       },
       relatedTokens: []
     },
@@ -1564,7 +1596,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "forms",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1673,10 +1705,13 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "A themed text input that emits its `change` output only after the user pauses typing\n(400&nbsp;ms by default) and only when the value actually changed \u2014 a signal-based\ndebounce with no rxjs involved. The live value is exposed as the `value` signal, and\n`clear()` empties the field immediately (cancelling any pending emit).\nIt wears the shared input chrome (color, border, typeface, focus ring) via the input\nbox, and offers `pre-input` / `post-input` attribute slots for adornments plus ARIA\npassthrough inputs (`role`, `ariaExpanded`, `ariaControls`, `ariaActivedescendant`)\nso composite widgets can annotate the real input element.\nUsed by the [Search Input](?path=/docs/components-forms-search-input--docs), which\nprojects its magnifier and clear button through the slots and drives the combobox\nARIA through the passthroughs.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          "Set `label` \u2014 it becomes the accessible name (`aria-label`) of the inner input.",
+          "The ARIA passthrough inputs (`role`, `ariaExpanded`, `ariaControls`,"
+        ]
       },
       relatedTokens: []
     },
@@ -1687,7 +1722,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "feedback",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1740,10 +1775,14 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        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",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          "Focus trapping and keyboard navigation (Tab, Escape, Enter)",
+          "Screen reader announcements",
+          "Semantic dialog roles"
+        ]
       },
       relatedTokens: [
         "dialog.behavior.borderRadius",
@@ -1761,7 +1800,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "feedback",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1846,7 +1885,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "feedback",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1870,7 +1909,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1912,7 +1951,7 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Dividers are used to visually separate content in a list or group.",
         dos: [],
         donts: [],
         accessibility: []
@@ -1926,7 +1965,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "directives",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -1958,7 +1997,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "components",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -2012,10 +2051,14 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Navigation drawer with two modes sharing one content slot:\n- **`side`** renders an in-flow `<aside>` that pushes page content \u2014 the classic\n  dashboard sidenav. Opening and closing animates its width; a divider border primitive\n  separates it from the content, and it is hidden from assistive tech while closed.\n- **`over`** renders a native `<dialog>` in the top layer: focus trapping, Escape, and\n  the scrim backdrop come from the platform, and the panel slides in from its edge\n  (`position`: `start` or `end`).\n`[(open)]` is two-way; Escape and backdrop clicks keep it in sync. Surface, width,\ndivider, elevation, padding and backdrop all resolve from the theme's `drawer` options.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          "Overlay mode is a native `<dialog>`: focus is trapped by `showModal()`, Escape closes, and the backdrop click closes \u2014 all kept in sync with `[(open)]`.",
+          'Give the overlay an accessible name via `ariaLabel` (defaults to "Navigation").',
+          "A closed side drawer is `aria-hidden`, so its links leave the accessibility tree."
+        ]
       },
       relatedTokens: [
         "drawer.behavior.color",
@@ -2033,7 +2076,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "components",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -2122,7 +2165,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -2161,10 +2204,12 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Expand is a group of components that can be used in concert to expand/collapse sections of information.\nThe Expand component is transparent in nature and can nest any element to collapse it out of view.\nThe Expand Toggle is an optional convenience element that can be used to trigger the expand/collapse animation.\nIt has been designed to work with the Card Header.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          "The toggle carries `aria-expanded` and `aria-controls` for its region (wired automatically inside Expand Area)."
+        ]
       },
       relatedTokens: []
     },
@@ -2175,7 +2220,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -2232,7 +2277,7 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "The batteries-included collapsible: a themed surface with a header row, an Expand\nToggle, and a content region wired together \u2014 `aria-expanded`/`aria-controls`\nhandled automatically. For custom collapse layouts, compose the lower-level Expand\nand Expand Toggle directly.",
         dos: [],
         donts: [],
         accessibility: []
@@ -2246,7 +2291,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "forms",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -2278,7 +2323,7 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: 'The Expand Toggle is a chevron icon button that controls collapsed/expanded state. It pairs\nwith the [Expand](?path=/docs/components-expand--docs) component: bind the toggle\'s\n`collapsed` model to the Expand\'s `collapsed` input to build collapsible sections.\nThe icon rotates 180\xB0 between states and shows an "Expand"/"Collapse" tooltip.',
         dos: [],
         donts: [],
         accessibility: []
@@ -2292,7 +2337,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "forms",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -2434,10 +2479,12 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "The File Drop Zone component is used in uploading files.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          'Without a browse button, the zone itself is `role="button"` with `tabindex="0"` and Enter/Space activation.'
+        ]
       },
       relatedTokens: []
     },
@@ -2448,7 +2495,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -2531,7 +2578,7 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Grid is a layout component used for composing elements in a grid-like pattern.\nLike tables, grid layouts align elements into columns and rows.\nHowever, grids allow for more control when spanning elements across columns and rows.",
         dos: [],
         donts: [],
         accessibility: []
@@ -2545,7 +2592,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -2577,7 +2624,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "primitives",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -2608,10 +2655,13 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Icons are adaptive svg images. Instead of defining a size or color attributes, Icons\nwill grow to the space allotted to them and use the current color of its parent element.\nHowever, it is possible to statically set the icon color.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          "Icons are decorative (`aria-hidden`) \u2014 the parent control carries the accessible name.",
+          "Icons come from the theme's `icons` map (masked with `currentColor`); unknown names render nothing."
+        ]
       },
       relatedTokens: []
     },
@@ -2622,7 +2672,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "primitives",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -2708,10 +2758,13 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "A square, icon-only button for toolbars, bars, and tight layouts. Renders a real\n`<button>` around a symbol or icon, with ghost as the default variant so it sits\nquietly on any surface. Because there is no visible text, the accessible name comes\nfrom projected (visually hidden) text or `ariaLabel`.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          "Icon-only buttons need a name: project text (rendered visually hidden) or set `ariaLabel`.",
+          "The icon/symbol itself is decorative (`aria-hidden`)."
+        ]
       },
       relatedTokens: []
     },
@@ -2722,7 +2775,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "forms",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -2834,10 +2887,15 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Single-line text field with the shared input chrome (themed color, border, typeface,\nfocus ring, error state). It implements `FormValueControl<string>`: bind a Signal\nForms field with `[field]`, or drive `[(value)]` directly. Errors style the field\nonly after the user has interacted (touched or dirty), and `required` syncs from\n`required()` validators automatically.\nProject adornments with the `pre-input` / `post-input` slots. For multi-line text\nuse Textarea; for search semantics use Search Input.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          "`label` is required and becomes the accessible name (`aria-label`).",
+          "`aria-invalid` reflects the error state once the field was touched or is dirty.",
+          "`aria-required` mirrors the `required` state synced from validators.",
+          "Link external error text with `ariaDescribedBy`."
+        ]
       },
       relatedTokens: [
         "input.behavior.typeFace",
@@ -2862,7 +2920,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "forms",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -2921,7 +2979,7 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "The Input Box is the themed shell shared by all text-like form controls\n([Input](?path=/docs/components-forms-input--docs),\n[Select](?path=/docs/components-forms-select--docs), Multi Select Dropdown). It projects any\nnative `input` or `select` element, strips the platform's default styling, and applies the\n`input` component theme options: colors, border, radius, focus outline, and the error and\ndisabled states.\nUse it directly when composing a custom form control that should match the design system's\ninput styling.",
         dos: [],
         donts: [],
         accessibility: []
@@ -2935,7 +2993,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "components",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -2991,7 +3049,7 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "The JSON View component provides a simple way to display JSON data in a formatted, readable manner. It renders the JSON in a textarea element, making it easy for users to view and copy the content. The component automatically formats the JSON with proper indentation for better readability.",
         dos: [],
         donts: [],
         accessibility: []
@@ -3005,7 +3063,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -3065,10 +3123,13 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Menus can be linked to any component, but it is recommended to use either the `text-button` or `icon-button` component.\nMenus are populated by creating an array of Menu Items (`MenuItem[]`) and binding it to the `Menu` component.\nActions are optional as the `Menu` component also emits the clicked menu item via the `menuItemClicked` output attribute.\n### Menu Item Interface\n```\nMenuItem {\n  label: string;\n  symbolName?: string;\n  action?: () => void;\n}\n```",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          "Full ARIA menu pattern: arrows and Home/End move, first-letter typeahead jumps, Enter/Space activates.",
+          "ArrowDown/ArrowUp on the trigger opens onto the first/last item; focus returns to the trigger on close."
+        ]
       },
       relatedTokens: []
     },
@@ -3079,7 +3140,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -3195,7 +3256,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "forms",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -3266,10 +3327,13 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Inline multiple-choice: every option visible as a toggleable item, selection\nemitted as an array. Reach for it when the option set is small enough to show all\nat once and seeing the full set helps the choice; when space is tight or options\nare many, use Multi Select Dropdown instead.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          "Options are real checkboxes in a labelled group \u2014 Space toggles, Tab moves between them.",
+          "Selection state is announced per option."
+        ]
       },
       relatedTokens: []
     },
@@ -3280,7 +3344,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "forms",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -3397,10 +3461,14 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Multiple choice behind a compact trigger: a disclosure popover containing a search\nfield, checkbox options, and a Done action. Implements `FormValueControl` with an\narray value for Signal Forms, and shows a summarized selection in the trigger.\nThe popover surface, radius, and elevation resolve from the\n`multiSelectDropdown` theme options.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          'The trigger is a disclosure (`aria-haspopup="dialog"`, `aria-expanded`); the popover contains native focusables Tab reaches normally.',
+          "The search input is labelled; options are real checkboxes announced with their state.",
+          "Escape closes the popover and returns focus to the trigger."
+        ]
       },
       relatedTokens: []
     },
@@ -3411,7 +3479,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "feedback",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -3636,10 +3704,15 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: 'Attention indicator anchored to whatever it wraps \u2014 an icon button, a nav item, an\navatar. Three shapes: `dot` (something is new), `count` (how many), and `pill`\n(counts that need room); `maxCount` caps the display ("99+"). Position it on any\ncorner of the wrapped content.\nRadius and offset resolve from the `notificationBadge` theme options; the badge\nwears the active `variant` color.',
         dos: [],
-        donts: [],
-        accessibility: []
+        donts: [
+          "Convey urgency by color alone \u2014 the count/dot shape carries the signal"
+        ],
+        accessibility: [
+          'The visual badge is hidden from assistive tech; a visually-hidden text announcement carries the meaning ("3 notifications").',
+          "Provide `ariaLabel` context when the wrapped control's purpose isn't obvious from its own name."
+        ]
       },
       relatedTokens: []
     },
@@ -3650,7 +3723,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "feedback",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -3674,7 +3747,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "data",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -3734,10 +3807,13 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "The Paginator drives page navigation for any `UniDatasource`: first/previous/next/last\nbuttons, truncated page numbers, an editable page size, and a page jumper. Each section can\nbe toggled independently, so it can render as a full control bar or a minimal pager \u2014 the\n[Data Table](?path=/docs/components-data-table--docs) stories use one paginator in the header\nfor page size and another in the footer for page numbers.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          'A `role="navigation"` landmark; pages are real buttons with `aria-current="page"` on the active one.',
+          "The page-number input is labelled."
+        ]
       },
       relatedTokens: [
         "paginator.behavior.gap",
@@ -3756,7 +3832,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -3789,10 +3865,12 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Popover is a non-modal dialog that floats around a trigger.\nAny type of content can be added inside a popover; however, it is most suitable for short callouts or compact actions.\n**Note:** It is important to add the `trigger` attribute to the item you want to open and be referenced to the Popover.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          "The trigger carries `aria-expanded` and `aria-controls`; light-dismiss comes from the native popover."
+        ]
       },
       relatedTokens: []
     },
@@ -3803,7 +3881,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "feedback",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -3851,10 +3929,12 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "The progress bar is a graphical way of representing progress to completion.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          '`role="progressbar"` with `aria-valuenow`/`min`/`max`; name it with `ariaLabel`.'
+        ]
       },
       relatedTokens: []
     },
@@ -3865,7 +3945,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "feedback",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -3905,10 +3985,12 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "The progress gauge is a graphical way of representing progress to completion as well as scoring or ranking.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          '`role="progressbar"` with `aria-valuenow`/`min`/`max`; name it with `ariaLabel`. The SVG is decorative.'
+        ]
       },
       relatedTokens: []
     },
@@ -3919,7 +4001,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "forms",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -4044,10 +4126,18 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
-        dos: [],
-        donts: [],
-        accessibility: []
+        whenToUse: "Single choice among a small set of visible options. The component renders the whole\ngroup from an `options` array (`{ label, value, disabled? }`), implements\n`FormValueControl<string>` for Signal Forms, and defaults each group to a unique\n`name` so multiple groups on a page never collide.\nRing, fill, and size resolve from the `radio` theme options; the selected dot wears\nthe active `variant` color.",
+        dos: [
+          "Use for 2\u20135 mutually exclusive options that should all be visible"
+        ],
+        donts: [
+          "Use for long option lists \u2014 that is a select"
+        ],
+        accessibility: [
+          '`role="radiogroup"` labelled by the group label via `aria-labelledby`.',
+          "Native radio inputs: arrow keys move selection within the group, Tab moves out.",
+          "`aria-invalid` reflects the error state once the group was touched or is dirty."
+        ]
       },
       relatedTokens: [
         "radio.behavior.size",
@@ -4062,7 +4152,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "directives",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -4086,7 +4176,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -4127,7 +4217,7 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "`Row` is a layout component used to group elements in a horizontal arrangement and applies a uniform space between them.\n`Row` is an extension to the `Box` component and has all the `Box` attributes available to it.",
         dos: [],
         donts: [],
         accessibility: []
@@ -4141,7 +4231,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -4274,7 +4364,7 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "A scroll container with themed, consistent scrollbars across browsers \u2014 thin\nEmotion-styled WebKit scrollbars with a `scrollbar-width`/`scrollbar-color`\nfallback. It detects scrollable state via ResizeObserver (the `scrollable` output)\nand offers `scrollToTop`/`scrollToBottom` for programmatic control.",
         dos: [],
         donts: [],
         accessibility: []
@@ -4288,7 +4378,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "forms",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -4381,10 +4471,14 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Generic search field wearing the shared input chrome: a decorative leading magnifier,\na clear button while there's a query, and Enter to submit (`search`). `change` emits\ndebounced as the user types \u2014 use it to refresh results or the `suggestions` input.\nWith `suggestions`, the field becomes an ARIA combobox: entries render in a listbox\nunder the field, ArrowUp/Down move the highlight, Enter selects (emitting both\n`suggestionSelected` and `search`), and Escape closes the list first, then clears the\nquery. The suggestion list's surface, elevation and radius resolve from the theme's\n`searchInput` options, alongside the search/clear symbols.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          "The field is an ARIA combobox: `aria-expanded`, `aria-controls`, and `aria-activedescendant` track the suggestion listbox.",
+          "ArrowUp/ArrowDown move the active option, Enter selects, Escape closes the list first and clears the query second.",
+          'The magnifier is decorative; the clear button has an accessible name ("Clear search").'
+        ]
       },
       relatedTokens: []
     },
@@ -4395,7 +4489,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "forms",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -4514,10 +4608,13 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Single choice from a list, on a native `<select>` \u2014 platform pickers on mobile,\nplatform keyboard behavior everywhere. Options are typed generically\n(`options: T[]` with `optionLabel`/`optionValue` accessors), and the component\nimplements `FormValueControl` for the Signal Forms `[field]` directive. Errors\nstyle the field only after interaction, matching Input.\nFor choosing several, use Multi Select; for type-to-filter over large sets, use\nSearch Input's type-ahead.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          "Native `<select>`: platform keyboard interaction and mobile pickers for free.",
+          "`label` becomes the accessible name; `aria-invalid` reflects the touched error state."
+        ]
       },
       relatedTokens: []
     },
@@ -4528,7 +4625,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "components",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -4598,10 +4695,15 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Loading placeholder that sketches the shape of incoming content: `text` renders one or\nmore lines (ending on a short line, as real copy would), `rect` stands in for media and\ncharts, `circle` for avatars. Skeletons paint with the theme's surface tokens so they\nsit naturally on any brand in both modes, and the shimmer sweep only animates for users\nwho allow motion \u2014 under `prefers-reduced-motion` it degrades to calm static blocks.\nSkeletons are `aria-hidden`; announce loading on the container (e.g. `aria-busy`)\nwhere your app knows what is actually loading.",
         dos: [],
-        donts: [],
-        accessibility: []
+        donts: [
+          "Announce individual skeletons to assistive tech \u2014 they are decorative placeholders"
+        ],
+        accessibility: [
+          "Skeletons are `aria-hidden` \u2014 announce loading on the container (e.g. `aria-busy`) where your app knows what is loading.",
+          "The shimmer respects `prefers-reduced-motion`, degrading to static blocks."
+        ]
       },
       relatedTokens: [
         "skeleton.behavior.color",
@@ -4619,7 +4721,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "forms",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -4732,10 +4834,14 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: 'Range slider for picking a number within bounds. It renders a native\n`<input type="range">`, so keyboard interaction (arrows, Home/End, Page Up/Down) and\nthe ARIA slider contract come from the platform. The same Signal Forms contract as\nInput applies \u2014 bind with the `[field]` directive or drive `[(value)]` directly.\nFill and thumb color, track color, radii and geometry resolve from the theme\'s\n`slider` options; the fill level rides a CSS custom property, so dragging never\nregenerates styles.',
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          'Native `<input type="range">`: arrows, Home/End, and Page Up/Down come from the platform, and the ARIA slider contract (valuenow/min/max) is native.',
+          "`label` is required and becomes the accessible name.",
+          "Expose the current value textually nearby and link it with `ariaDescribedBy` when the number matters."
+        ]
       },
       relatedTokens: [
         "slider.behavior.color",
@@ -4752,7 +4858,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "feedback",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -4826,7 +4932,7 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "The Snackbar component is used to give feedback to users after an action has taken place.\nIt appears near the bottom center of the screen temporarily and floats above the UI to not affect the application's layout.\nA side action can be defined (e.g. undoing a process or navigating to the details of a newly created record).",
         dos: [],
         donts: [],
         accessibility: []
@@ -4844,7 +4950,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "data",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -4889,7 +4995,7 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "The Sort Header wraps a column heading and cycles the bound datasource's sort state\n(ascending \u2192 descending \u2192 unsorted) when clicked. An animated arrow indicates the current\nsort direction. It is used by the [Data Table](?path=/docs/components-data-table--docs)\nfor sortable columns, but can wrap any header content bound to a `UniDatasource`.",
         dos: [],
         donts: [],
         accessibility: []
@@ -4903,7 +5009,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -4944,7 +5050,7 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "`Stack` is a layout component used to group elements in a vertical arrangement and applies a uniform space between them.\n`Stack` is an extension to the `Box` component and has all the `Box` attributes available to it.",
         dos: [],
         donts: [],
         accessibility: []
@@ -4958,7 +5064,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "components",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -5029,10 +5135,15 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: 'The KPI tile a dashboard leads with: a muted label, a large headline value (numbers\nauto-compact \u2014 `48234` renders "48.2K"), an optional signed delta, and an optional\ndecorative sparkline.\nThe delta\'s color is decided by **direction \xD7 whether up is good**, never direction\nalone \u2014 set `upIsGood` to `false` for measures like churn, errors, or cost, and a\nfalling number correctly reads as good news. The arrow is accompanied by\nscreen-reader text ("up"/"down"), so state never relies on color alone, and `caption`\nnames the comparison period.\nFrame (surface, border primitive, radius), typography (the type scale\'s `stat` role\nfor values), delta inks (the semantic `success`/`error`), and sparkline colors all\nresolve from the theme\'s `stat` options.',
         dos: [],
-        donts: [],
-        accessibility: []
+        donts: [
+          "Rely on delta color alone \u2014 the arrow + wording carry direction for everyone"
+        ],
+        accessibility: [
+          'The delta arrow is decorative; screen readers hear "up"/"down" in words instead.',
+          "The sparkline is `aria-hidden` \u2014 the value and delta carry the information."
+        ]
       },
       relatedTokens: [
         "stat.behavior.labelTypeface",
@@ -5055,7 +5166,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "primitives",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -5107,10 +5218,12 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "The Symbol Component integrates the latest [Material Symbols](https://fonts.google.com/icons?icon.platform=web&icon.style=Rounded&icon.set=Material+Symbols&query=les).\nMaterial Symbols consolidates over 3,275 glyphs (icons) in a single font file with a wide range of design variants.\nSymbols are available in three styles and four adjustable variable font styles (fill, weight, grade, and optical size).",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          "Symbols are decorative (`aria-hidden`) \u2014 the parent control carries the accessible name."
+        ]
       },
       relatedTokens: [
         "symbol.behavior.fill",
@@ -5126,7 +5239,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "components",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -5166,7 +5279,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "components",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -5196,10 +5309,20 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
-        dos: [],
-        donts: [],
-        accessibility: []
+        whenToUse: "Tabs organize peer views behind a single switcher. Each `uni-tab` supplies a label and\nits panel content; only the selected panel is instantiated, so heavy tab content costs\nnothing until visited.\nThe default tokens render underline tabs; a theme that sets `borderRadius: 'max'` and\nan `activeColor` gets segmented pills without any component changes.",
+        dos: [
+          "Use for peer views of the same subject (details, activity, settings)",
+          "Keep labels to one or two words"
+        ],
+        donts: [
+          "Nest tabs inside tabs",
+          "Use tabs for sequential steps \u2014 that is a stepper"
+        ],
+        accessibility: [
+          "Full WAI-ARIA tabs pattern: `tablist`/`tab`/`tabpanel` roles with wired",
+          "Arrow keys move between tabs with selection following focus, wrapping at the ends;",
+          "Roving tabindex: only the selected tab sits in the tab order; the panel itself is"
+        ]
       },
       relatedTokens: [
         "tabs.behavior.typeface",
@@ -5220,7 +5343,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "data",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -5273,7 +5396,7 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Compact label for classifying content \u2014 categories, states, filters. Tags are\ndisplay-only chips that wear the active variant's colors; for removable,\ntype-to-add chips (a future input variant), see the roadmap.",
         dos: [],
         donts: [],
         accessibility: []
@@ -5287,7 +5410,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "primitives",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -5368,10 +5491,17 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
-        dos: [],
-        donts: [],
-        accessibility: []
+        whenToUse: 'The typography primitive, applied as an **attribute on any element** so your HTML\nsemantics stay intact. The attribute value is the typeface \u2014\n`<h1 uni-text="display-small">` \u2014 and `[uni-text]="role()"` binds it dynamically.\nWith no value, the typeface is inferred from the host element (`h1` \u2192\n`headline-large`, `p` \u2192 `body-1-long`, `small` \u2192 `caption`, `blockquote` \u2192 `quote`,\nfalling back to `title-small`), so plain semantic markup is correctly set with zero\nconfiguration. `color` takes any theme color token; `align`, `nowrap`, `maxWidth`,\nand `ellipsis` handle common text layout.',
+        dos: [
+          "Reach for semantic elements first and let the element-aware defaults set the type"
+        ],
+        donts: [
+          'Use `span uni-text="headline-large"` where a real heading belongs'
+        ],
+        accessibility: [
+          "Text never replaces your elements \u2014 headings stay `h1`\u2013`h6`, paragraphs stay `p`,",
+          "Type is styling only: pick the element for meaning, the typeface for appearance"
+        ]
       },
       relatedTokens: []
     },
@@ -5382,7 +5512,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "primitives",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -5492,10 +5622,13 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Multi-line text field with the same Signal Forms contract as Input \u2014 use it anywhere\nfree-form text runs past one line (comments, descriptions, feedback). It shares Input's\nthemed chrome (color, border, error state, focus outline, typeface) and adds\ntextarea-specific behavior from the theme's `textarea` options: default `rows` and the\nCSS `resize` mode. Bind it to a form with the `[field]` directive, or drive `[(value)]`\ndirectly.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          "`label` is required and becomes the accessible name (`aria-label`).",
+          "Error state is exposed as `aria-invalid` once the field was touched or is dirty; wire your error text with `ariaDescribedBy`."
+        ]
       },
       relatedTokens: [
         "textarea.behavior.rows",
@@ -5509,7 +5642,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "primitives",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -5539,7 +5672,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "forms",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -5643,10 +5776,18 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
-        dos: [],
-        donts: [],
-        accessibility: []
+        whenToUse: "A switch-style control for turning an option on or off with immediate effect \u2014\nprefer it over a checkbox when the change applies instantly (settings, feature\nswitches) rather than as part of a submitted form. It implements\n`FormCheckboxControl`, so it binds with the Signal Forms `[field]` directive or a\ndirect `[(checked)]` model.\nTrack, knob, and size resolve from the `toggle` theme options; the checked state\nwears the active `variant` color.",
+        dos: [
+          "Use for instant on/off effects (settings, feature switches)"
+        ],
+        donts: [
+          "Use in submitted forms where nothing happens until save \u2014 that is a checkbox"
+        ],
+        accessibility: [
+          'Semantic `<input type="checkbox">` with `role="switch"`, properly associated with its label.',
+          "Space toggles; focus indicators are provided for keyboard navigation.",
+          "Screen readers announce the label and on/off state."
+        ]
       },
       relatedTokens: [
         "toggle.behavior.size",
@@ -5661,7 +5802,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "feedback",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -5717,10 +5858,14 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "A tooltip is a brief, informative message that appears when a user interacts with an element.\nIf using a tooltip within a body of text, set the `inlineText` option to `true`.",
         dos: [],
         donts: [],
-        accessibility: []
+        accessibility: [
+          '`role="tooltip"` linked to the trigger via `aria-describedby` (wired once \u2014 the bubble is always in the DOM).',
+          "Shows on keyboard focus, hides on blur and Escape; stays open while hovered (WCAG 1.4.13).",
+          'Non-focusable triggers get `tabindex="0"` so keyboard users can reach the tooltip.'
+        ]
       },
       relatedTokens: [
         "tooltip.behavior.borderRadius",
@@ -5736,7 +5881,7 @@ var uni_index_default = {
       summary: "",
       description: "",
       category: "layout",
-      version: "6.0.0",
+      version: "6.0.1",
       bindings: {
         angular: {
           importPath: "@uni-design-system/uni-angular",
@@ -5769,7 +5914,7 @@ var uni_index_default = {
         }
       ],
       guidelines: {
-        whenToUse: "",
+        whenToUse: "Used to add space between elements and wraps automatically if there isn't enough space.",
         dos: [],
         donts: [],
         accessibility: []
@@ -11984,4 +12129,4 @@ export {
   meta,
   createUniServer
 };
-//# sourceMappingURL=chunk-VQE52XFX.js.map
+//# sourceMappingURL=chunk-WCJS2FYS.js.map