@mich8060/unified-design-system 0.2.43 → 0.2.45

package/dist/ai/examples/dataset.index.json

@@ -33,6 +33,11 @@
       "path": "@mich8060/unified-design-system/ai/examples/kanban-board-uds.jsonl",
       "kind": "scenario-layout"
     },
+    {
+      "id": "app-shell-regions",
+      "path": "@mich8060/unified-design-system/ai/examples/app-shell-regions-uds.jsonl",
+      "kind": "scenario-layout"
+    },
     {
       "id": "uds-governed-training",
       "path": "@mich8060/unified-design-system/ai/examples/uds-governed-training.jsonl",

package/dist/ai/figma-make.contract.json

@@ -50,7 +50,9 @@
                 "Menu",
                 "Content",
                 "Listview",
-                "Main"
+                "Main",
+                "SidePanel",
+                "Footer"
             ],
             "namedSlots": [
                 "Header",
@@ -60,7 +62,7 @@
                 "SubNav"
             ],
             "requiredProps": {
-                "brand": "connect|comphealth|locumsmart|default|weatherby|modio|gms|wireframe",
+                "brand": "connect|comphealth|locumsmart|default|weatherby|modio|gms|chg|wireframe",
                 "theme": "light|dark"
             }
         },
@@ -179,7 +181,7 @@
     },
     "navigationLogic": {
         "router": "react-router-dom (^6.26.2 || ^7.0.0)",
-        "rootLayoutPattern": "AppShell with route outlet in AppShell.Main"
+        "rootLayoutPattern": "AppShell with route outlet in AppShell.Main (optional AppShell.Listview and AppShell.SidePanel rails)"
     },
     "iconMappings": {
         "dashboard": "House",

package/dist/ai/figma-make.md

@@ -32,6 +32,7 @@ Run this setup flow before generating UI:
 5. Build required scaffold
 - Wrap app root with `BrowserRouter` (or `RouterProvider`) before any route-aware UDS components.
 - Use `AppShell > AppShell.Menu > AppShell.Content > AppShell.Main` as root layout.
+- When context rails are required, include `AppShell.Listview` (left) and/or `AppShell.SidePanel` (right) inside `AppShell.Content`.
 - Build `Menu.navItems` from selected brand in `brand-menus.json`.
 
 6. Validate

package/dist/ai/layout/architecture.json

@@ -5,11 +5,12 @@
     "application": {
       "requiredRoot": "AppShell",
       "requiredChildren": ["AppShell.Content", "AppShell.Main"],
-      "optionalChildren": ["AppShell.Menu", "AppShell.Header", "AppShell.Footer", "AppShell.SubNav"],
+      "optionalChildren": ["AppShell.Menu", "AppShell.Listview", "AppShell.SidePanel", "AppShell.Header", "AppShell.Footer", "AppShell.SubNav"],
       "rules": [
         "Wrap route-aware views in BrowserRouter or RouterProvider.",
         "Render AppShell.Menu only when nav data is present.",
-        "Attach page content routes under AppShell.Main."
+        "Attach page content routes under AppShell.Main.",
+        "Use AppShell.Listview and AppShell.SidePanel as optional contextual rails around AppShell.Main."
       ]
     }
   },

package/dist/ai/manifest/components.manifest.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=e=>e==="form"?["--uds-spacing-8","--uds-spacing-12","--uds-color-neutral-700","--uds-color-blue-600"]:e==="feedback"?["--uds-spacing-8","--uds-color-green-600","--uds-color-red-600"]:e==="layout"?["--uds-spacing-16","--uds-spacing-24","--uds-radius-8"]:e==="navigation"?["--uds-spacing-8","--uds-color-neutral-600","--uds-color-blue-600"]:["--uds-spacing-8","--uds-color-neutral-700","--uds-radius-8"],r=e=>({name:e.name,category:e.category,intent:e.intent,priority:e.priority,variants:e.variants??[],sizes:e.sizes,slots:e.slots,usage:{preferredContexts:e.preferredContexts,maxPerSection:e.maxPerSection},constraints:e.constraints,accessibility:{role:e.accessibilityRole??"group",keyboardSupport:e.keyboardSupport??["Tab"]},tokenDependencies:e.tokenDependencies??t(e.category)}),a=[{name:"Accordion",category:"layout",intent:"Progressive disclosure for grouped content.",preferredContexts:["settings","details"],accessibilityRole:"region"},{name:"ActionMenu",category:"navigation",intent:"Contextual action list for row/item actions.",preferredContexts:["tables","cards"],accessibilityRole:"menu",keyboardSupport:["Tab","Enter","ArrowUp","ArrowDown","Escape"]},{name:"AppShell",category:"layout",intent:"Top-level application shell composition.",preferredContexts:["app-root"],maxPerSection:1,tokenDependencies:["--uds-spacing-16","--uds-color-neutral-50","--uds-elevation-overlay"],accessibilityRole:"application"},{name:"Avatar",category:"data-display",intent:"Represent people or entities with image/initials.",preferredContexts:["lists","tables","headers"],accessibilityRole:"img"},{name:"Badge",category:"data-display",intent:"Small count/status indicator.",preferredContexts:["notifications","tabs"],maxPerSection:6},{name:"Branding",category:"branding",intent:"Brand identity lockup and context marker.",preferredContexts:["navigation","headers"],maxPerSection:1},{name:"Breadcrumb",category:"navigation",intent:"Hierarchy-aware page context trail.",preferredContexts:["page-header"],maxPerSection:1,accessibilityRole:"navigation"},{name:"Button",category:"action",intent:"Primary and secondary user actions.",preferredContexts:["forms","toolbars","dialogs"],constraints:{onlyOnePrimaryPerSection:!0},tokenDependencies:["--uds-spacing-8","--uds-spacing-12","--uds-color-blue-600","--uds-color-red-600","--uds-radius-8"],accessibilityRole:"button",keyboardSupport:["Tab","Enter","Space"]},{name:"ButtonGroup",category:"action",intent:"Grouped related button actions.",preferredContexts:["forms","dialogs","cards"],accessibilityRole:"group",keyboardSupport:["Tab","Enter","Space"]},{name:"Calendar",category:"form",intent:"Calendar date grid interactions.",preferredContexts:["scheduling","date-selection"]},{name:"Checkbox",category:"form",intent:"Multi-select boolean control.",preferredContexts:["forms","filters"],accessibilityRole:"checkbox",keyboardSupport:["Tab","Space"]},{name:"CheckboxGroup",category:"form",intent:"Grouped multi-select checkboxes.",preferredContexts:["forms","filters"],accessibilityRole:"group",keyboardSupport:["Tab","Space"]},{name:"Checklist",category:"navigation",intent:"Sidebar checklist for multi-step flows with completion status.",preferredContexts:["application-flow","forms","sidebars"],maxPerSection:1,tokenDependencies:["--uds-surface-primary","--uds-border-primary","--uds-text-primary","--uds-text-secondary","--uds-surface-brand-primary","--uds-spacing-8","--uds-spacing-12","--uds-spacing-20","--uds-spacing-24"],accessibilityRole:"navigation",keyboardSupport:["Tab","Enter","Space"]},{name:"Chip",category:"form",intent:"Compact selectable/taggable item.",preferredContexts:["filters","tags"],maxPerSection:12,accessibilityRole:"button"},{name:"Code",category:"data-display",intent:"Formatted code snippet display.",preferredContexts:["documentation","developer-tools"],tokenDependencies:["--uds-spacing-12","--uds-color-neutral-900","--uds-radius-8"]},{name:"Container",category:"layout",intent:"Consistent page/content width boundaries.",preferredContexts:["page-layout"],maxPerSection:1},{name:"Datepicker",category:"form",intent:"Date selection input control.",preferredContexts:["forms","filters"],accessibilityRole:"combobox",keyboardSupport:["Tab","Enter","ArrowDown"]},{name:"Dialog",category:"feedback",intent:"Structured dialog surface with actions.",preferredContexts:["confirmations","warnings"],maxPerSection:1,accessibilityRole:"dialog",keyboardSupport:["Tab","Escape","Enter"]},{name:"Divider",category:"layout",intent:"Semantic separation between sections.",preferredContexts:["page-sections","cards"]},{name:"DotStatus",category:"data-display",intent:"Compact status indicator dot.",preferredContexts:["tables","status-lists"]},{name:"Dropdown",category:"form",intent:"Select-style single choice control.",preferredContexts:["forms","filters"],accessibilityRole:"combobox",keyboardSupport:["Tab","Enter","ArrowDown"]},{name:"EmptyState",category:"feedback",intent:"Empty data guidance and next action.",preferredContexts:["tables","search-results"],maxPerSection:1},{name:"EventCard",category:"data-display",intent:"Event summary card with key metadata.",preferredContexts:["scheduling","timelines"]},{name:"Field",category:"form",intent:"Label/helper/error wrapper for form controls.",preferredContexts:["forms"],slots:{control:{required:!0,description:"Input-like child control."},helper:{required:!1},error:{required:!1}},tokenDependencies:["--uds-spacing-8","--uds-spacing-12","--uds-color-neutral-700","--uds-color-red-600"],accessibilityRole:"group"},{name:"FileUpload",category:"form",intent:"Upload surface for file selection/drop.",preferredContexts:["forms","document-intake"]},{name:"Flex",category:"layout",intent:"Primary layout utility for component composition.",preferredContexts:["all-layouts"],maxPerSection:999,tokenDependencies:["--uds-spacing-8","--uds-spacing-16","--uds-spacing-24"]},{name:"Icon",category:"data-display",intent:"Consistent icon rendering wrapper.",preferredContexts:["buttons","status","navigation"],tokenDependencies:["--uds-color-neutral-700","--uds-color-blue-600"],accessibilityRole:"img"},{name:"ImageAspect",category:"layout",intent:"Image with deterministic aspect ratio.",preferredContexts:["cards","media"]},{name:"Input",category:"form",intent:"Alias for TextInput control.",preferredContexts:["forms"],accessibilityRole:"textbox",keyboardSupport:["Tab"]},{name:"Key",category:"data-display",intent:"Keyboard shortcut visual token.",preferredContexts:["help","tooltips"]},{name:"Menu",category:"navigation",intent:"Main app navigation rail/menu.",preferredContexts:["app-shell"],maxPerSection:1,accessibilityRole:"navigation",keyboardSupport:["Tab","Enter","ArrowUp","ArrowDown"]},{name:"MicroCalendar",category:"data-display",intent:"Compact calendar visualization.",preferredContexts:["dashboards","side-panels"]},{name:"Modal",category:"feedback",intent:"Blocking focus-trap overlay with actions.",preferredContexts:["confirmations","forms"],maxPerSection:1,constraints:{disallowedChildren:["Modal"]},tokenDependencies:["--uds-elevation-overlay","--uds-spacing-16","--uds-radius-12"],accessibilityRole:"dialog",keyboardSupport:["Tab","Escape","Enter"]},{name:"Pagination",category:"navigation",intent:"Navigate paged dataset slices.",preferredContexts:["tables","list-pages"],maxPerSection:1,accessibilityRole:"navigation"},{name:"ProgressCircle",category:"data-display",intent:"Circular completion progress indicator.",preferredContexts:["status","dashboard"]},{name:"ProgressIndicator",category:"data-display",intent:"Linear progress indicator.",preferredContexts:["loaders","step-flows"]},{name:"Radio",category:"form",intent:"Single-select option control.",preferredContexts:["forms","filters"],accessibilityRole:"radio",keyboardSupport:["Tab","ArrowUp","ArrowDown","Space"]},{name:"RadioGroup",category:"form",intent:"Grouped single-select radios.",preferredContexts:["forms","filters"],accessibilityRole:"radiogroup",keyboardSupport:["Tab","ArrowUp","ArrowDown","Space"]},{name:"Slider",category:"form",intent:"Bounded numeric range control.",preferredContexts:["filters","settings"],accessibilityRole:"slider",keyboardSupport:["Tab","ArrowLeft","ArrowRight"]},{name:"Status",category:"data-display",intent:"Text + status color indicator.",preferredContexts:["tables","cards"]},{name:"Statistics",category:"data-display",intent:"KPI and metric summary display.",preferredContexts:["dashboards","cards","reporting"],accessibilityRole:"status"},{name:"Steps",category:"navigation",intent:"Multi-step flow progress tracker.",preferredContexts:["wizards","onboarding"],maxPerSection:1},{name:"Table",category:"data-display",intent:"Structured multi-column data presentation.",preferredContexts:["admin","reporting"],maxPerSection:1,slots:{row:{required:!0},cell:{required:!0},header:{required:!0}},tokenDependencies:["--uds-spacing-8","--uds-spacing-12","--uds-color-neutral-100","--uds-color-neutral-700"],accessibilityRole:"table",keyboardSupport:["Tab","ArrowUp","ArrowDown"]},{name:"Tabs",category:"navigation",intent:"Switch between peer content panels.",preferredContexts:["details","settings"],maxPerSection:1,accessibilityRole:"tablist",keyboardSupport:["Tab","ArrowLeft","ArrowRight","Enter"]},{name:"Tag",category:"data-display",intent:"Categorical metadata marker.",preferredContexts:["tables","cards"],maxPerSection:10},{name:"Text",category:"data-display",intent:"Semantic typography primitive.",preferredContexts:["all-content"],maxPerSection:999},{name:"TextInput",category:"form",intent:"Single-line text entry control.",preferredContexts:["forms","search"],accessibilityRole:"textbox",keyboardSupport:["Tab"]},{name:"Textarea",category:"form",intent:"Multi-line text entry control.",preferredContexts:["forms"],accessibilityRole:"textbox",keyboardSupport:["Tab"]},{name:"Toolbar",category:"layout",intent:"Top bar with left/right actions and centered title or branding.",preferredContexts:["app-shell","page-header","navigation"],maxPerSection:1,tokenDependencies:["--uds-surface-primary","--uds-border-primary","--uds-spacing-8","--uds-spacing-12","--uds-spacing-16"],accessibilityRole:"toolbar",keyboardSupport:["Tab"]},{name:"Toast",category:"feedback",intent:"Transient non-blocking notification.",preferredContexts:["system-feedback"],maxPerSection:3,constraints:{disallowedChildren:["Modal","Dialog"]},accessibilityRole:"status"},{name:"Toggle",category:"form",intent:"Binary on/off switch control.",preferredContexts:["settings","filters"],accessibilityRole:"switch",keyboardSupport:["Tab","Space"]},{name:"Tooltip",category:"feedback",intent:"Contextual hover/focus helper text.",preferredContexts:["dense-actions","icons"],maxPerSection:12,accessibilityRole:"tooltip"}],o=Object.fromEntries(a.map(e=>[e.name,r(e)]));exports.ComponentRegistry=o;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=e=>e==="form"?["--uds-spacing-8","--uds-spacing-12","--uds-color-neutral-700","--uds-color-blue-600"]:e==="feedback"?["--uds-spacing-8","--uds-color-green-600","--uds-color-red-600"]:e==="layout"?["--uds-spacing-16","--uds-spacing-24","--uds-radius-8"]:e==="navigation"?["--uds-spacing-8","--uds-color-neutral-600","--uds-color-blue-600"]:["--uds-spacing-8","--uds-color-neutral-700","--uds-radius-8"],r=e=>({name:e.name,category:e.category,intent:e.intent,priority:e.priority,variants:e.variants??[],sizes:e.sizes,slots:e.slots,usage:{preferredContexts:e.preferredContexts,maxPerSection:e.maxPerSection},constraints:e.constraints,accessibility:{role:e.accessibilityRole??"group",keyboardSupport:e.keyboardSupport??["Tab"]},tokenDependencies:e.tokenDependencies??t(e.category)}),a=[{name:"Accordion",category:"layout",intent:"Progressive disclosure for grouped content.",preferredContexts:["settings","details"],accessibilityRole:"region"},{name:"ActionMenu",category:"navigation",intent:"Contextual action list for row/item actions.",preferredContexts:["tables","cards"],accessibilityRole:"menu",keyboardSupport:["Tab","Enter","ArrowUp","ArrowDown","Escape"]},{name:"AppShell",category:"layout",intent:"Top-level application shell composition.",preferredContexts:["app-root"],maxPerSection:1,tokenDependencies:["--uds-spacing-16","--uds-color-neutral-50","--uds-elevation-overlay"],accessibilityRole:"application",slots:{menu:{required:!1,description:"Primary navigation region via AppShell.Menu."},content:{required:!0,description:"Primary layout body via AppShell.Content."},listview:{required:!1,description:"Optional left contextual rail via AppShell.Listview."},main:{required:!0,description:"Primary page/route content via AppShell.Main."},sidePanel:{required:!1,description:"Optional right contextual rail via AppShell.SidePanel."},footer:{required:!1,description:"Optional global footer via AppShell.Footer."}},constraints:{allowedChildren:["Menu","Listview","Main","SidePanel","Footer"]}},{name:"Avatar",category:"data-display",intent:"Represent people or entities with image/initials.",preferredContexts:["lists","tables","headers"],accessibilityRole:"img"},{name:"Badge",category:"data-display",intent:"Small count/status indicator.",preferredContexts:["notifications","tabs"],maxPerSection:6},{name:"Branding",category:"branding",intent:"Brand identity lockup and context marker.",preferredContexts:["navigation","headers"],maxPerSection:1},{name:"Breadcrumb",category:"navigation",intent:"Hierarchy-aware page context trail.",preferredContexts:["page-header"],maxPerSection:1,accessibilityRole:"navigation"},{name:"Button",category:"action",intent:"Primary and secondary user actions.",preferredContexts:["forms","toolbars","dialogs"],constraints:{onlyOnePrimaryPerSection:!0},tokenDependencies:["--uds-spacing-8","--uds-spacing-12","--uds-color-blue-600","--uds-color-red-600","--uds-radius-8"],accessibilityRole:"button",keyboardSupport:["Tab","Enter","Space"]},{name:"ButtonGroup",category:"action",intent:"Grouped related button actions.",preferredContexts:["forms","dialogs","cards"],accessibilityRole:"group",keyboardSupport:["Tab","Enter","Space"]},{name:"Calendar",category:"form",intent:"Calendar date grid interactions.",preferredContexts:["scheduling","date-selection"]},{name:"Checkbox",category:"form",intent:"Multi-select boolean control.",preferredContexts:["forms","filters"],accessibilityRole:"checkbox",keyboardSupport:["Tab","Space"]},{name:"CheckboxGroup",category:"form",intent:"Grouped multi-select checkboxes.",preferredContexts:["forms","filters"],accessibilityRole:"group",keyboardSupport:["Tab","Space"]},{name:"Checklist",category:"navigation",intent:"Sidebar checklist for multi-step flows with completion status.",preferredContexts:["application-flow","forms","sidebars"],maxPerSection:1,tokenDependencies:["--uds-surface-primary","--uds-border-primary","--uds-text-primary","--uds-text-secondary","--uds-surface-brand-primary","--uds-spacing-8","--uds-spacing-12","--uds-spacing-20","--uds-spacing-24"],accessibilityRole:"navigation",keyboardSupport:["Tab","Enter","Space"]},{name:"Chip",category:"form",intent:"Compact selectable/taggable item.",preferredContexts:["filters","tags"],maxPerSection:12,accessibilityRole:"button"},{name:"Code",category:"data-display",intent:"Formatted code snippet display.",preferredContexts:["documentation","developer-tools"],tokenDependencies:["--uds-spacing-12","--uds-color-neutral-900","--uds-radius-8"]},{name:"Container",category:"layout",intent:"Consistent page/content width boundaries.",preferredContexts:["page-layout"],maxPerSection:1},{name:"Datepicker",category:"form",intent:"Date selection input control.",preferredContexts:["forms","filters"],accessibilityRole:"combobox",keyboardSupport:["Tab","Enter","ArrowDown"]},{name:"Dialog",category:"feedback",intent:"Structured dialog surface with actions.",preferredContexts:["confirmations","warnings"],maxPerSection:1,accessibilityRole:"dialog",keyboardSupport:["Tab","Escape","Enter"]},{name:"Divider",category:"layout",intent:"Semantic separation between sections.",preferredContexts:["page-sections","cards"]},{name:"DotStatus",category:"data-display",intent:"Compact status indicator dot.",preferredContexts:["tables","status-lists"]},{name:"Dropdown",category:"form",intent:"Select-style single choice control.",preferredContexts:["forms","filters"],accessibilityRole:"combobox",keyboardSupport:["Tab","Enter","ArrowDown"]},{name:"EmptyState",category:"feedback",intent:"Empty data guidance and next action.",preferredContexts:["tables","search-results"],maxPerSection:1},{name:"EventCard",category:"data-display",intent:"Event summary card with key metadata.",preferredContexts:["scheduling","timelines"]},{name:"Field",category:"form",intent:"Label/helper/error wrapper for form controls.",preferredContexts:["forms"],slots:{control:{required:!0,description:"Input-like child control."},helper:{required:!1},error:{required:!1}},tokenDependencies:["--uds-spacing-8","--uds-spacing-12","--uds-color-neutral-700","--uds-color-red-600"],accessibilityRole:"group"},{name:"FileUpload",category:"form",intent:"Upload surface for file selection/drop.",preferredContexts:["forms","document-intake"]},{name:"Flex",category:"layout",intent:"Primary layout utility for component composition.",preferredContexts:["all-layouts"],maxPerSection:999,tokenDependencies:["--uds-spacing-8","--uds-spacing-16","--uds-spacing-24"]},{name:"Icon",category:"data-display",intent:"Consistent icon rendering wrapper.",preferredContexts:["buttons","status","navigation"],tokenDependencies:["--uds-color-neutral-700","--uds-color-blue-600"],accessibilityRole:"img"},{name:"ImageAspect",category:"layout",intent:"Image with deterministic aspect ratio.",preferredContexts:["cards","media"]},{name:"Input",category:"form",intent:"Alias for TextInput control.",preferredContexts:["forms"],accessibilityRole:"textbox",keyboardSupport:["Tab"]},{name:"Key",category:"data-display",intent:"Keyboard shortcut visual token.",preferredContexts:["help","tooltips"]},{name:"Menu",category:"navigation",intent:"Main app navigation rail/menu.",preferredContexts:["app-shell"],maxPerSection:1,accessibilityRole:"navigation",keyboardSupport:["Tab","Enter","ArrowUp","ArrowDown"]},{name:"MicroCalendar",category:"data-display",intent:"Compact calendar visualization.",preferredContexts:["dashboards","side-panels"]},{name:"Modal",category:"feedback",intent:"Blocking focus-trap overlay with actions.",preferredContexts:["confirmations","forms"],maxPerSection:1,constraints:{disallowedChildren:["Modal"]},tokenDependencies:["--uds-elevation-overlay","--uds-spacing-16","--uds-radius-12"],accessibilityRole:"dialog",keyboardSupport:["Tab","Escape","Enter"]},{name:"Pagination",category:"navigation",intent:"Navigate paged dataset slices.",preferredContexts:["tables","list-pages"],maxPerSection:1,accessibilityRole:"navigation"},{name:"ProgressCircle",category:"data-display",intent:"Circular completion progress indicator.",preferredContexts:["status","dashboard"]},{name:"ProgressIndicator",category:"data-display",intent:"Linear progress indicator.",preferredContexts:["loaders","step-flows"]},{name:"Radio",category:"form",intent:"Single-select option control.",preferredContexts:["forms","filters"],accessibilityRole:"radio",keyboardSupport:["Tab","ArrowUp","ArrowDown","Space"]},{name:"RadioGroup",category:"form",intent:"Grouped single-select radios.",preferredContexts:["forms","filters"],accessibilityRole:"radiogroup",keyboardSupport:["Tab","ArrowUp","ArrowDown","Space"]},{name:"Slider",category:"form",intent:"Bounded numeric range control.",preferredContexts:["filters","settings"],accessibilityRole:"slider",keyboardSupport:["Tab","ArrowLeft","ArrowRight"]},{name:"Status",category:"data-display",intent:"Text + status color indicator.",preferredContexts:["tables","cards"]},{name:"Statistics",category:"data-display",intent:"KPI and metric summary display.",preferredContexts:["dashboards","cards","reporting"],accessibilityRole:"status"},{name:"Steps",category:"navigation",intent:"Multi-step flow progress tracker.",preferredContexts:["wizards","onboarding"],maxPerSection:1},{name:"Table",category:"data-display",intent:"Structured multi-column data presentation.",preferredContexts:["admin","reporting"],maxPerSection:1,slots:{row:{required:!0},cell:{required:!0},header:{required:!0}},tokenDependencies:["--uds-spacing-8","--uds-spacing-12","--uds-color-neutral-100","--uds-color-neutral-700"],accessibilityRole:"table",keyboardSupport:["Tab","ArrowUp","ArrowDown"]},{name:"Tabs",category:"navigation",intent:"Switch between peer content panels.",preferredContexts:["details","settings"],maxPerSection:1,accessibilityRole:"tablist",keyboardSupport:["Tab","ArrowLeft","ArrowRight","Enter"]},{name:"Tag",category:"data-display",intent:"Categorical metadata marker.",preferredContexts:["tables","cards"],maxPerSection:10},{name:"Text",category:"data-display",intent:"Semantic typography primitive.",preferredContexts:["all-content"],maxPerSection:999},{name:"TextInput",category:"form",intent:"Single-line text entry control.",preferredContexts:["forms","search"],accessibilityRole:"textbox",keyboardSupport:["Tab"]},{name:"Textarea",category:"form",intent:"Multi-line text entry control.",preferredContexts:["forms"],accessibilityRole:"textbox",keyboardSupport:["Tab"]},{name:"Toolbar",category:"layout",intent:"Top bar with left/right actions and centered title or branding.",preferredContexts:["app-shell","page-header","navigation"],maxPerSection:1,tokenDependencies:["--uds-surface-primary","--uds-border-primary","--uds-spacing-8","--uds-spacing-12","--uds-spacing-16"],accessibilityRole:"toolbar",keyboardSupport:["Tab"]},{name:"Toast",category:"feedback",intent:"Transient non-blocking notification.",preferredContexts:["system-feedback"],maxPerSection:3,constraints:{disallowedChildren:["Modal","Dialog"]},accessibilityRole:"status"},{name:"Toggle",category:"form",intent:"Binary on/off switch control.",preferredContexts:["settings","filters"],accessibilityRole:"switch",keyboardSupport:["Tab","Space"]},{name:"Tooltip",category:"feedback",intent:"Contextual hover/focus helper text.",preferredContexts:["dense-actions","icons"],maxPerSection:12,accessibilityRole:"tooltip"}],o=Object.fromEntries(a.map(e=>[e.name,r(e)]));exports.ComponentRegistry=o;

package/dist/ai/manifest/components.manifest.js

@@ -1 +1 @@
-const t=e=>e==="form"?["--uds-spacing-8","--uds-spacing-12","--uds-color-neutral-700","--uds-color-blue-600"]:e==="feedback"?["--uds-spacing-8","--uds-color-green-600","--uds-color-red-600"]:e==="layout"?["--uds-spacing-16","--uds-spacing-24","--uds-radius-8"]:e==="navigation"?["--uds-spacing-8","--uds-color-neutral-600","--uds-color-blue-600"]:["--uds-spacing-8","--uds-color-neutral-700","--uds-radius-8"],r=e=>({name:e.name,category:e.category,intent:e.intent,priority:e.priority,variants:e.variants??[],sizes:e.sizes,slots:e.slots,usage:{preferredContexts:e.preferredContexts,maxPerSection:e.maxPerSection},constraints:e.constraints,accessibility:{role:e.accessibilityRole??"group",keyboardSupport:e.keyboardSupport??["Tab"]},tokenDependencies:e.tokenDependencies??t(e.category)}),a=[{name:"Accordion",category:"layout",intent:"Progressive disclosure for grouped content.",preferredContexts:["settings","details"],accessibilityRole:"region"},{name:"ActionMenu",category:"navigation",intent:"Contextual action list for row/item actions.",preferredContexts:["tables","cards"],accessibilityRole:"menu",keyboardSupport:["Tab","Enter","ArrowUp","ArrowDown","Escape"]},{name:"AppShell",category:"layout",intent:"Top-level application shell composition.",preferredContexts:["app-root"],maxPerSection:1,tokenDependencies:["--uds-spacing-16","--uds-color-neutral-50","--uds-elevation-overlay"],accessibilityRole:"application"},{name:"Avatar",category:"data-display",intent:"Represent people or entities with image/initials.",preferredContexts:["lists","tables","headers"],accessibilityRole:"img"},{name:"Badge",category:"data-display",intent:"Small count/status indicator.",preferredContexts:["notifications","tabs"],maxPerSection:6},{name:"Branding",category:"branding",intent:"Brand identity lockup and context marker.",preferredContexts:["navigation","headers"],maxPerSection:1},{name:"Breadcrumb",category:"navigation",intent:"Hierarchy-aware page context trail.",preferredContexts:["page-header"],maxPerSection:1,accessibilityRole:"navigation"},{name:"Button",category:"action",intent:"Primary and secondary user actions.",preferredContexts:["forms","toolbars","dialogs"],constraints:{onlyOnePrimaryPerSection:!0},tokenDependencies:["--uds-spacing-8","--uds-spacing-12","--uds-color-blue-600","--uds-color-red-600","--uds-radius-8"],accessibilityRole:"button",keyboardSupport:["Tab","Enter","Space"]},{name:"ButtonGroup",category:"action",intent:"Grouped related button actions.",preferredContexts:["forms","dialogs","cards"],accessibilityRole:"group",keyboardSupport:["Tab","Enter","Space"]},{name:"Calendar",category:"form",intent:"Calendar date grid interactions.",preferredContexts:["scheduling","date-selection"]},{name:"Checkbox",category:"form",intent:"Multi-select boolean control.",preferredContexts:["forms","filters"],accessibilityRole:"checkbox",keyboardSupport:["Tab","Space"]},{name:"CheckboxGroup",category:"form",intent:"Grouped multi-select checkboxes.",preferredContexts:["forms","filters"],accessibilityRole:"group",keyboardSupport:["Tab","Space"]},{name:"Checklist",category:"navigation",intent:"Sidebar checklist for multi-step flows with completion status.",preferredContexts:["application-flow","forms","sidebars"],maxPerSection:1,tokenDependencies:["--uds-surface-primary","--uds-border-primary","--uds-text-primary","--uds-text-secondary","--uds-surface-brand-primary","--uds-spacing-8","--uds-spacing-12","--uds-spacing-20","--uds-spacing-24"],accessibilityRole:"navigation",keyboardSupport:["Tab","Enter","Space"]},{name:"Chip",category:"form",intent:"Compact selectable/taggable item.",preferredContexts:["filters","tags"],maxPerSection:12,accessibilityRole:"button"},{name:"Code",category:"data-display",intent:"Formatted code snippet display.",preferredContexts:["documentation","developer-tools"],tokenDependencies:["--uds-spacing-12","--uds-color-neutral-900","--uds-radius-8"]},{name:"Container",category:"layout",intent:"Consistent page/content width boundaries.",preferredContexts:["page-layout"],maxPerSection:1},{name:"Datepicker",category:"form",intent:"Date selection input control.",preferredContexts:["forms","filters"],accessibilityRole:"combobox",keyboardSupport:["Tab","Enter","ArrowDown"]},{name:"Dialog",category:"feedback",intent:"Structured dialog surface with actions.",preferredContexts:["confirmations","warnings"],maxPerSection:1,accessibilityRole:"dialog",keyboardSupport:["Tab","Escape","Enter"]},{name:"Divider",category:"layout",intent:"Semantic separation between sections.",preferredContexts:["page-sections","cards"]},{name:"DotStatus",category:"data-display",intent:"Compact status indicator dot.",preferredContexts:["tables","status-lists"]},{name:"Dropdown",category:"form",intent:"Select-style single choice control.",preferredContexts:["forms","filters"],accessibilityRole:"combobox",keyboardSupport:["Tab","Enter","ArrowDown"]},{name:"EmptyState",category:"feedback",intent:"Empty data guidance and next action.",preferredContexts:["tables","search-results"],maxPerSection:1},{name:"EventCard",category:"data-display",intent:"Event summary card with key metadata.",preferredContexts:["scheduling","timelines"]},{name:"Field",category:"form",intent:"Label/helper/error wrapper for form controls.",preferredContexts:["forms"],slots:{control:{required:!0,description:"Input-like child control."},helper:{required:!1},error:{required:!1}},tokenDependencies:["--uds-spacing-8","--uds-spacing-12","--uds-color-neutral-700","--uds-color-red-600"],accessibilityRole:"group"},{name:"FileUpload",category:"form",intent:"Upload surface for file selection/drop.",preferredContexts:["forms","document-intake"]},{name:"Flex",category:"layout",intent:"Primary layout utility for component composition.",preferredContexts:["all-layouts"],maxPerSection:999,tokenDependencies:["--uds-spacing-8","--uds-spacing-16","--uds-spacing-24"]},{name:"Icon",category:"data-display",intent:"Consistent icon rendering wrapper.",preferredContexts:["buttons","status","navigation"],tokenDependencies:["--uds-color-neutral-700","--uds-color-blue-600"],accessibilityRole:"img"},{name:"ImageAspect",category:"layout",intent:"Image with deterministic aspect ratio.",preferredContexts:["cards","media"]},{name:"Input",category:"form",intent:"Alias for TextInput control.",preferredContexts:["forms"],accessibilityRole:"textbox",keyboardSupport:["Tab"]},{name:"Key",category:"data-display",intent:"Keyboard shortcut visual token.",preferredContexts:["help","tooltips"]},{name:"Menu",category:"navigation",intent:"Main app navigation rail/menu.",preferredContexts:["app-shell"],maxPerSection:1,accessibilityRole:"navigation",keyboardSupport:["Tab","Enter","ArrowUp","ArrowDown"]},{name:"MicroCalendar",category:"data-display",intent:"Compact calendar visualization.",preferredContexts:["dashboards","side-panels"]},{name:"Modal",category:"feedback",intent:"Blocking focus-trap overlay with actions.",preferredContexts:["confirmations","forms"],maxPerSection:1,constraints:{disallowedChildren:["Modal"]},tokenDependencies:["--uds-elevation-overlay","--uds-spacing-16","--uds-radius-12"],accessibilityRole:"dialog",keyboardSupport:["Tab","Escape","Enter"]},{name:"Pagination",category:"navigation",intent:"Navigate paged dataset slices.",preferredContexts:["tables","list-pages"],maxPerSection:1,accessibilityRole:"navigation"},{name:"ProgressCircle",category:"data-display",intent:"Circular completion progress indicator.",preferredContexts:["status","dashboard"]},{name:"ProgressIndicator",category:"data-display",intent:"Linear progress indicator.",preferredContexts:["loaders","step-flows"]},{name:"Radio",category:"form",intent:"Single-select option control.",preferredContexts:["forms","filters"],accessibilityRole:"radio",keyboardSupport:["Tab","ArrowUp","ArrowDown","Space"]},{name:"RadioGroup",category:"form",intent:"Grouped single-select radios.",preferredContexts:["forms","filters"],accessibilityRole:"radiogroup",keyboardSupport:["Tab","ArrowUp","ArrowDown","Space"]},{name:"Slider",category:"form",intent:"Bounded numeric range control.",preferredContexts:["filters","settings"],accessibilityRole:"slider",keyboardSupport:["Tab","ArrowLeft","ArrowRight"]},{name:"Status",category:"data-display",intent:"Text + status color indicator.",preferredContexts:["tables","cards"]},{name:"Statistics",category:"data-display",intent:"KPI and metric summary display.",preferredContexts:["dashboards","cards","reporting"],accessibilityRole:"status"},{name:"Steps",category:"navigation",intent:"Multi-step flow progress tracker.",preferredContexts:["wizards","onboarding"],maxPerSection:1},{name:"Table",category:"data-display",intent:"Structured multi-column data presentation.",preferredContexts:["admin","reporting"],maxPerSection:1,slots:{row:{required:!0},cell:{required:!0},header:{required:!0}},tokenDependencies:["--uds-spacing-8","--uds-spacing-12","--uds-color-neutral-100","--uds-color-neutral-700"],accessibilityRole:"table",keyboardSupport:["Tab","ArrowUp","ArrowDown"]},{name:"Tabs",category:"navigation",intent:"Switch between peer content panels.",preferredContexts:["details","settings"],maxPerSection:1,accessibilityRole:"tablist",keyboardSupport:["Tab","ArrowLeft","ArrowRight","Enter"]},{name:"Tag",category:"data-display",intent:"Categorical metadata marker.",preferredContexts:["tables","cards"],maxPerSection:10},{name:"Text",category:"data-display",intent:"Semantic typography primitive.",preferredContexts:["all-content"],maxPerSection:999},{name:"TextInput",category:"form",intent:"Single-line text entry control.",preferredContexts:["forms","search"],accessibilityRole:"textbox",keyboardSupport:["Tab"]},{name:"Textarea",category:"form",intent:"Multi-line text entry control.",preferredContexts:["forms"],accessibilityRole:"textbox",keyboardSupport:["Tab"]},{name:"Toolbar",category:"layout",intent:"Top bar with left/right actions and centered title or branding.",preferredContexts:["app-shell","page-header","navigation"],maxPerSection:1,tokenDependencies:["--uds-surface-primary","--uds-border-primary","--uds-spacing-8","--uds-spacing-12","--uds-spacing-16"],accessibilityRole:"toolbar",keyboardSupport:["Tab"]},{name:"Toast",category:"feedback",intent:"Transient non-blocking notification.",preferredContexts:["system-feedback"],maxPerSection:3,constraints:{disallowedChildren:["Modal","Dialog"]},accessibilityRole:"status"},{name:"Toggle",category:"form",intent:"Binary on/off switch control.",preferredContexts:["settings","filters"],accessibilityRole:"switch",keyboardSupport:["Tab","Space"]},{name:"Tooltip",category:"feedback",intent:"Contextual hover/focus helper text.",preferredContexts:["dense-actions","icons"],maxPerSection:12,accessibilityRole:"tooltip"}],o=Object.fromEntries(a.map(e=>[e.name,r(e)]));export{o as ComponentRegistry};
+const t=e=>e==="form"?["--uds-spacing-8","--uds-spacing-12","--uds-color-neutral-700","--uds-color-blue-600"]:e==="feedback"?["--uds-spacing-8","--uds-color-green-600","--uds-color-red-600"]:e==="layout"?["--uds-spacing-16","--uds-spacing-24","--uds-radius-8"]:e==="navigation"?["--uds-spacing-8","--uds-color-neutral-600","--uds-color-blue-600"]:["--uds-spacing-8","--uds-color-neutral-700","--uds-radius-8"],r=e=>({name:e.name,category:e.category,intent:e.intent,priority:e.priority,variants:e.variants??[],sizes:e.sizes,slots:e.slots,usage:{preferredContexts:e.preferredContexts,maxPerSection:e.maxPerSection},constraints:e.constraints,accessibility:{role:e.accessibilityRole??"group",keyboardSupport:e.keyboardSupport??["Tab"]},tokenDependencies:e.tokenDependencies??t(e.category)}),a=[{name:"Accordion",category:"layout",intent:"Progressive disclosure for grouped content.",preferredContexts:["settings","details"],accessibilityRole:"region"},{name:"ActionMenu",category:"navigation",intent:"Contextual action list for row/item actions.",preferredContexts:["tables","cards"],accessibilityRole:"menu",keyboardSupport:["Tab","Enter","ArrowUp","ArrowDown","Escape"]},{name:"AppShell",category:"layout",intent:"Top-level application shell composition.",preferredContexts:["app-root"],maxPerSection:1,tokenDependencies:["--uds-spacing-16","--uds-color-neutral-50","--uds-elevation-overlay"],accessibilityRole:"application",slots:{menu:{required:!1,description:"Primary navigation region via AppShell.Menu."},content:{required:!0,description:"Primary layout body via AppShell.Content."},listview:{required:!1,description:"Optional left contextual rail via AppShell.Listview."},main:{required:!0,description:"Primary page/route content via AppShell.Main."},sidePanel:{required:!1,description:"Optional right contextual rail via AppShell.SidePanel."},footer:{required:!1,description:"Optional global footer via AppShell.Footer."}},constraints:{allowedChildren:["Menu","Listview","Main","SidePanel","Footer"]}},{name:"Avatar",category:"data-display",intent:"Represent people or entities with image/initials.",preferredContexts:["lists","tables","headers"],accessibilityRole:"img"},{name:"Badge",category:"data-display",intent:"Small count/status indicator.",preferredContexts:["notifications","tabs"],maxPerSection:6},{name:"Branding",category:"branding",intent:"Brand identity lockup and context marker.",preferredContexts:["navigation","headers"],maxPerSection:1},{name:"Breadcrumb",category:"navigation",intent:"Hierarchy-aware page context trail.",preferredContexts:["page-header"],maxPerSection:1,accessibilityRole:"navigation"},{name:"Button",category:"action",intent:"Primary and secondary user actions.",preferredContexts:["forms","toolbars","dialogs"],constraints:{onlyOnePrimaryPerSection:!0},tokenDependencies:["--uds-spacing-8","--uds-spacing-12","--uds-color-blue-600","--uds-color-red-600","--uds-radius-8"],accessibilityRole:"button",keyboardSupport:["Tab","Enter","Space"]},{name:"ButtonGroup",category:"action",intent:"Grouped related button actions.",preferredContexts:["forms","dialogs","cards"],accessibilityRole:"group",keyboardSupport:["Tab","Enter","Space"]},{name:"Calendar",category:"form",intent:"Calendar date grid interactions.",preferredContexts:["scheduling","date-selection"]},{name:"Checkbox",category:"form",intent:"Multi-select boolean control.",preferredContexts:["forms","filters"],accessibilityRole:"checkbox",keyboardSupport:["Tab","Space"]},{name:"CheckboxGroup",category:"form",intent:"Grouped multi-select checkboxes.",preferredContexts:["forms","filters"],accessibilityRole:"group",keyboardSupport:["Tab","Space"]},{name:"Checklist",category:"navigation",intent:"Sidebar checklist for multi-step flows with completion status.",preferredContexts:["application-flow","forms","sidebars"],maxPerSection:1,tokenDependencies:["--uds-surface-primary","--uds-border-primary","--uds-text-primary","--uds-text-secondary","--uds-surface-brand-primary","--uds-spacing-8","--uds-spacing-12","--uds-spacing-20","--uds-spacing-24"],accessibilityRole:"navigation",keyboardSupport:["Tab","Enter","Space"]},{name:"Chip",category:"form",intent:"Compact selectable/taggable item.",preferredContexts:["filters","tags"],maxPerSection:12,accessibilityRole:"button"},{name:"Code",category:"data-display",intent:"Formatted code snippet display.",preferredContexts:["documentation","developer-tools"],tokenDependencies:["--uds-spacing-12","--uds-color-neutral-900","--uds-radius-8"]},{name:"Container",category:"layout",intent:"Consistent page/content width boundaries.",preferredContexts:["page-layout"],maxPerSection:1},{name:"Datepicker",category:"form",intent:"Date selection input control.",preferredContexts:["forms","filters"],accessibilityRole:"combobox",keyboardSupport:["Tab","Enter","ArrowDown"]},{name:"Dialog",category:"feedback",intent:"Structured dialog surface with actions.",preferredContexts:["confirmations","warnings"],maxPerSection:1,accessibilityRole:"dialog",keyboardSupport:["Tab","Escape","Enter"]},{name:"Divider",category:"layout",intent:"Semantic separation between sections.",preferredContexts:["page-sections","cards"]},{name:"DotStatus",category:"data-display",intent:"Compact status indicator dot.",preferredContexts:["tables","status-lists"]},{name:"Dropdown",category:"form",intent:"Select-style single choice control.",preferredContexts:["forms","filters"],accessibilityRole:"combobox",keyboardSupport:["Tab","Enter","ArrowDown"]},{name:"EmptyState",category:"feedback",intent:"Empty data guidance and next action.",preferredContexts:["tables","search-results"],maxPerSection:1},{name:"EventCard",category:"data-display",intent:"Event summary card with key metadata.",preferredContexts:["scheduling","timelines"]},{name:"Field",category:"form",intent:"Label/helper/error wrapper for form controls.",preferredContexts:["forms"],slots:{control:{required:!0,description:"Input-like child control."},helper:{required:!1},error:{required:!1}},tokenDependencies:["--uds-spacing-8","--uds-spacing-12","--uds-color-neutral-700","--uds-color-red-600"],accessibilityRole:"group"},{name:"FileUpload",category:"form",intent:"Upload surface for file selection/drop.",preferredContexts:["forms","document-intake"]},{name:"Flex",category:"layout",intent:"Primary layout utility for component composition.",preferredContexts:["all-layouts"],maxPerSection:999,tokenDependencies:["--uds-spacing-8","--uds-spacing-16","--uds-spacing-24"]},{name:"Icon",category:"data-display",intent:"Consistent icon rendering wrapper.",preferredContexts:["buttons","status","navigation"],tokenDependencies:["--uds-color-neutral-700","--uds-color-blue-600"],accessibilityRole:"img"},{name:"ImageAspect",category:"layout",intent:"Image with deterministic aspect ratio.",preferredContexts:["cards","media"]},{name:"Input",category:"form",intent:"Alias for TextInput control.",preferredContexts:["forms"],accessibilityRole:"textbox",keyboardSupport:["Tab"]},{name:"Key",category:"data-display",intent:"Keyboard shortcut visual token.",preferredContexts:["help","tooltips"]},{name:"Menu",category:"navigation",intent:"Main app navigation rail/menu.",preferredContexts:["app-shell"],maxPerSection:1,accessibilityRole:"navigation",keyboardSupport:["Tab","Enter","ArrowUp","ArrowDown"]},{name:"MicroCalendar",category:"data-display",intent:"Compact calendar visualization.",preferredContexts:["dashboards","side-panels"]},{name:"Modal",category:"feedback",intent:"Blocking focus-trap overlay with actions.",preferredContexts:["confirmations","forms"],maxPerSection:1,constraints:{disallowedChildren:["Modal"]},tokenDependencies:["--uds-elevation-overlay","--uds-spacing-16","--uds-radius-12"],accessibilityRole:"dialog",keyboardSupport:["Tab","Escape","Enter"]},{name:"Pagination",category:"navigation",intent:"Navigate paged dataset slices.",preferredContexts:["tables","list-pages"],maxPerSection:1,accessibilityRole:"navigation"},{name:"ProgressCircle",category:"data-display",intent:"Circular completion progress indicator.",preferredContexts:["status","dashboard"]},{name:"ProgressIndicator",category:"data-display",intent:"Linear progress indicator.",preferredContexts:["loaders","step-flows"]},{name:"Radio",category:"form",intent:"Single-select option control.",preferredContexts:["forms","filters"],accessibilityRole:"radio",keyboardSupport:["Tab","ArrowUp","ArrowDown","Space"]},{name:"RadioGroup",category:"form",intent:"Grouped single-select radios.",preferredContexts:["forms","filters"],accessibilityRole:"radiogroup",keyboardSupport:["Tab","ArrowUp","ArrowDown","Space"]},{name:"Slider",category:"form",intent:"Bounded numeric range control.",preferredContexts:["filters","settings"],accessibilityRole:"slider",keyboardSupport:["Tab","ArrowLeft","ArrowRight"]},{name:"Status",category:"data-display",intent:"Text + status color indicator.",preferredContexts:["tables","cards"]},{name:"Statistics",category:"data-display",intent:"KPI and metric summary display.",preferredContexts:["dashboards","cards","reporting"],accessibilityRole:"status"},{name:"Steps",category:"navigation",intent:"Multi-step flow progress tracker.",preferredContexts:["wizards","onboarding"],maxPerSection:1},{name:"Table",category:"data-display",intent:"Structured multi-column data presentation.",preferredContexts:["admin","reporting"],maxPerSection:1,slots:{row:{required:!0},cell:{required:!0},header:{required:!0}},tokenDependencies:["--uds-spacing-8","--uds-spacing-12","--uds-color-neutral-100","--uds-color-neutral-700"],accessibilityRole:"table",keyboardSupport:["Tab","ArrowUp","ArrowDown"]},{name:"Tabs",category:"navigation",intent:"Switch between peer content panels.",preferredContexts:["details","settings"],maxPerSection:1,accessibilityRole:"tablist",keyboardSupport:["Tab","ArrowLeft","ArrowRight","Enter"]},{name:"Tag",category:"data-display",intent:"Categorical metadata marker.",preferredContexts:["tables","cards"],maxPerSection:10},{name:"Text",category:"data-display",intent:"Semantic typography primitive.",preferredContexts:["all-content"],maxPerSection:999},{name:"TextInput",category:"form",intent:"Single-line text entry control.",preferredContexts:["forms","search"],accessibilityRole:"textbox",keyboardSupport:["Tab"]},{name:"Textarea",category:"form",intent:"Multi-line text entry control.",preferredContexts:["forms"],accessibilityRole:"textbox",keyboardSupport:["Tab"]},{name:"Toolbar",category:"layout",intent:"Top bar with left/right actions and centered title or branding.",preferredContexts:["app-shell","page-header","navigation"],maxPerSection:1,tokenDependencies:["--uds-surface-primary","--uds-border-primary","--uds-spacing-8","--uds-spacing-12","--uds-spacing-16"],accessibilityRole:"toolbar",keyboardSupport:["Tab"]},{name:"Toast",category:"feedback",intent:"Transient non-blocking notification.",preferredContexts:["system-feedback"],maxPerSection:3,constraints:{disallowedChildren:["Modal","Dialog"]},accessibilityRole:"status"},{name:"Toggle",category:"form",intent:"Binary on/off switch control.",preferredContexts:["settings","filters"],accessibilityRole:"switch",keyboardSupport:["Tab","Space"]},{name:"Tooltip",category:"feedback",intent:"Contextual hover/focus helper text.",preferredContexts:["dense-actions","icons"],maxPerSection:12,accessibilityRole:"tooltip"}],o=Object.fromEntries(a.map(e=>[e.name,r(e)]));export{o as ComponentRegistry};

package/dist/ai/manifest/composition.manifest.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={AppShell:["Menu","Container","Layout","Text","Button"],Container:["Layout","Table","Text","Button","Field","Divider","Tag"],Field:["TextInput","Input","Dropdown","Datepicker","Textarea","Checkbox","Radio","Toggle","Slider","FileUpload"],Modal:["Text","Button","Divider","Field","TextInput","Dropdown","Datepicker","Textarea","Tag"],Table:["Tag","Status","Avatar","Button","ActionMenu","ProgressIndicator","DotStatus"],Tabs:["Text","Tag","Button","Table","Field"],Menu:["ActionMenu","Dropdown","Toggle","Text","Icon"]},a={ActionMenu:["Menu","Table"],Avatar:["Table"],Button:["AppShell","Container","Layout","Modal","Table","Tabs"],Checkbox:["Field"],Container:["AppShell","root"],Datepicker:["Field","Modal"],Divider:["Container","Modal"],DotStatus:["Table"],Dropdown:["Field","Menu","Modal"],Field:["Container","Modal","Tabs"],FileUpload:["Field"],Layout:["AppShell","Container"],Icon:["Menu"],Input:["Field"],Menu:["AppShell","root"],Modal:["AppShell","Container","root"],ProgressIndicator:["Table"],Radio:["Field"],Slider:["Field"],Status:["Table"],Table:["Container","Tabs"],Tag:["Container","Modal","Table","Tabs"],Text:["AppShell","Container","Layout","Menu","Modal","Tabs"],TextInput:["Field","Modal"],Textarea:["Field","Modal"],Toggle:["Field","Menu"]},o=[{parent:"Modal",child:"Modal",reason:"Nested modals create inaccessible focus traps."},{parent:"Dialog",child:"Dialog",reason:"Nested dialogs reduce escape behavior predictability."},{parent:"Toast",child:"Modal",reason:"Toast surfaces must remain non-blocking."},{parent:"Toast",child:"Dialog",reason:"Toast surfaces must remain non-blocking."},{parent:"Table",child:"Table",reason:"Nested tables reduce readability and responsiveness."},{parent:"Button",child:"Button",reason:"Interactive controls cannot be nested."}],t={allowedChildrenByParent:e,allowedParentsByChild:a,disallowedPairs:o};exports.CompositionRules=t;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={AppShell:["Menu","Listview","Main","SidePanel","Footer","Container","Layout","Text","Button"],Container:["Layout","Table","Text","Button","Field","Divider","Tag"],Field:["TextInput","Input","Dropdown","Datepicker","Textarea","Checkbox","Radio","Toggle","Slider","FileUpload"],Modal:["Text","Button","Divider","Field","TextInput","Dropdown","Datepicker","Textarea","Tag"],Table:["Tag","Status","Avatar","Button","ActionMenu","ProgressIndicator","DotStatus"],Tabs:["Text","Tag","Button","Table","Field"],Menu:["ActionMenu","Dropdown","Toggle","Text","Icon"]},a={ActionMenu:["Menu","Table"],Avatar:["Table"],Button:["AppShell","Container","Layout","Modal","Table","Tabs"],Checkbox:["Field"],Container:["AppShell","root"],Datepicker:["Field","Modal"],Divider:["Container","Modal"],DotStatus:["Table"],Dropdown:["Field","Menu","Modal"],Field:["Container","Modal","Tabs"],FileUpload:["Field"],Layout:["AppShell","Container"],Icon:["Menu"],Input:["Field"],Menu:["AppShell","root"],Modal:["AppShell","Container","root"],ProgressIndicator:["Table"],Radio:["Field"],Slider:["Field"],Status:["Table"],Table:["Container","Tabs"],Tag:["Container","Modal","Table","Tabs"],Text:["AppShell","Container","Layout","Menu","Modal","Tabs"],TextInput:["Field","Modal"],Textarea:["Field","Modal"],Toggle:["Field","Menu"]},o=[{parent:"Modal",child:"Modal",reason:"Nested modals create inaccessible focus traps."},{parent:"Dialog",child:"Dialog",reason:"Nested dialogs reduce escape behavior predictability."},{parent:"Toast",child:"Modal",reason:"Toast surfaces must remain non-blocking."},{parent:"Toast",child:"Dialog",reason:"Toast surfaces must remain non-blocking."},{parent:"Table",child:"Table",reason:"Nested tables reduce readability and responsiveness."},{parent:"Button",child:"Button",reason:"Interactive controls cannot be nested."}],t={allowedChildrenByParent:e,allowedParentsByChild:a,disallowedPairs:o};exports.CompositionRules=t;

package/dist/ai/manifest/composition.manifest.js

@@ -1 +1 @@
-const e={AppShell:["Menu","Container","Layout","Text","Button"],Container:["Layout","Table","Text","Button","Field","Divider","Tag"],Field:["TextInput","Input","Dropdown","Datepicker","Textarea","Checkbox","Radio","Toggle","Slider","FileUpload"],Modal:["Text","Button","Divider","Field","TextInput","Dropdown","Datepicker","Textarea","Tag"],Table:["Tag","Status","Avatar","Button","ActionMenu","ProgressIndicator","DotStatus"],Tabs:["Text","Tag","Button","Table","Field"],Menu:["ActionMenu","Dropdown","Toggle","Text","Icon"]},a={ActionMenu:["Menu","Table"],Avatar:["Table"],Button:["AppShell","Container","Layout","Modal","Table","Tabs"],Checkbox:["Field"],Container:["AppShell","root"],Datepicker:["Field","Modal"],Divider:["Container","Modal"],DotStatus:["Table"],Dropdown:["Field","Menu","Modal"],Field:["Container","Modal","Tabs"],FileUpload:["Field"],Layout:["AppShell","Container"],Icon:["Menu"],Input:["Field"],Menu:["AppShell","root"],Modal:["AppShell","Container","root"],ProgressIndicator:["Table"],Radio:["Field"],Slider:["Field"],Status:["Table"],Table:["Container","Tabs"],Tag:["Container","Modal","Table","Tabs"],Text:["AppShell","Container","Layout","Menu","Modal","Tabs"],TextInput:["Field","Modal"],Textarea:["Field","Modal"],Toggle:["Field","Menu"]},o=[{parent:"Modal",child:"Modal",reason:"Nested modals create inaccessible focus traps."},{parent:"Dialog",child:"Dialog",reason:"Nested dialogs reduce escape behavior predictability."},{parent:"Toast",child:"Modal",reason:"Toast surfaces must remain non-blocking."},{parent:"Toast",child:"Dialog",reason:"Toast surfaces must remain non-blocking."},{parent:"Table",child:"Table",reason:"Nested tables reduce readability and responsiveness."},{parent:"Button",child:"Button",reason:"Interactive controls cannot be nested."}],t={allowedChildrenByParent:e,allowedParentsByChild:a,disallowedPairs:o};export{t as CompositionRules};
+const e={AppShell:["Menu","Listview","Main","SidePanel","Footer","Container","Layout","Text","Button"],Container:["Layout","Table","Text","Button","Field","Divider","Tag"],Field:["TextInput","Input","Dropdown","Datepicker","Textarea","Checkbox","Radio","Toggle","Slider","FileUpload"],Modal:["Text","Button","Divider","Field","TextInput","Dropdown","Datepicker","Textarea","Tag"],Table:["Tag","Status","Avatar","Button","ActionMenu","ProgressIndicator","DotStatus"],Tabs:["Text","Tag","Button","Table","Field"],Menu:["ActionMenu","Dropdown","Toggle","Text","Icon"]},a={ActionMenu:["Menu","Table"],Avatar:["Table"],Button:["AppShell","Container","Layout","Modal","Table","Tabs"],Checkbox:["Field"],Container:["AppShell","root"],Datepicker:["Field","Modal"],Divider:["Container","Modal"],DotStatus:["Table"],Dropdown:["Field","Menu","Modal"],Field:["Container","Modal","Tabs"],FileUpload:["Field"],Layout:["AppShell","Container"],Icon:["Menu"],Input:["Field"],Menu:["AppShell","root"],Modal:["AppShell","Container","root"],ProgressIndicator:["Table"],Radio:["Field"],Slider:["Field"],Status:["Table"],Table:["Container","Tabs"],Tag:["Container","Modal","Table","Tabs"],Text:["AppShell","Container","Layout","Menu","Modal","Tabs"],TextInput:["Field","Modal"],Textarea:["Field","Modal"],Toggle:["Field","Menu"]},o=[{parent:"Modal",child:"Modal",reason:"Nested modals create inaccessible focus traps."},{parent:"Dialog",child:"Dialog",reason:"Nested dialogs reduce escape behavior predictability."},{parent:"Toast",child:"Modal",reason:"Toast surfaces must remain non-blocking."},{parent:"Toast",child:"Dialog",reason:"Toast surfaces must remain non-blocking."},{parent:"Table",child:"Table",reason:"Nested tables reduce readability and responsiveness."},{parent:"Button",child:"Button",reason:"Interactive controls cannot be nested."}],t={allowedChildrenByParent:e,allowedParentsByChild:a,disallowedPairs:o};export{t as CompositionRules};

package/dist/ai/manifest.json

@@ -86,13 +86,38 @@
       "name": "AppShell",
       "category": "layout",
       "intent": "Top-level application shell and page structure",
-      "purpose": "Top-level application shell that composes menu, content, and main regions for consistent page architecture.",
+      "purpose": "Top-level application shell that composes menu, listview, main, side panel, and footer regions for consistent page architecture.",
       "tier": 1,
-      "description": "The structural application layout framework that governs global regions such as header, sidebar, breadcrumb, sub-navigation, and main content. It enforces consistent structure, theme/brand application, and layout configuration.",
+      "description": "The structural application layout framework that governs global regions such as menu, listview, main content, side panel, and footer while enforcing consistent structure, theme/brand application, and layout configuration.",
       "roles": [
         "application"
       ],
-      "slots": null,
+      "slots": {
+        "menu": {
+          "required": false,
+          "description": "Primary navigation region via AppShell.Menu."
+        },
+        "content": {
+          "required": true,
+          "description": "Primary layout body via AppShell.Content."
+        },
+        "listview": {
+          "required": false,
+          "description": "Optional left contextual rail via AppShell.Listview."
+        },
+        "main": {
+          "required": true,
+          "description": "Primary page/route content via AppShell.Main."
+        },
+        "sidePanel": {
+          "required": false,
+          "description": "Optional right contextual rail via AppShell.SidePanel."
+        },
+        "footer": {
+          "required": false,
+          "description": "Optional global footer via AppShell.Footer."
+        }
+      },
       "states": [
         "default"
       ],
@@ -131,6 +156,10 @@
         ],
         "allowedChildren": [
           "Menu",
+          "Listview",
+          "Main",
+          "SidePanel",
+          "Footer",
           "Container",
           "Layout",
           "Text",
@@ -138,7 +167,15 @@
         ],
         "allowedParents": [],
         "disallowedChildren": [],
-        "constraints": null
+        "constraints": {
+          "allowedChildren": [
+            "Menu",
+            "Listview",
+            "Main",
+            "SidePanel",
+            "Footer"
+          ]
+        }
       },
       "tokens": {
         "allowed": [
@@ -3319,6 +3356,10 @@
     "allowedComposition": {
       "AppShell": [
         "Menu",
+        "Listview",
+        "Main",
+        "SidePanel",
+        "Footer",
         "Container",
         "Layout",
         "Text",

package/dist/ai/prompts/starter.prompt.md

@@ -22,7 +22,9 @@ Required layout scaffold:
   - `AppShell`
   - `AppShell.Menu`
   - `AppShell.Content`
+  - `AppShell.Listview` (optional)
   - `AppShell.Main`
+  - `AppShell.SidePanel` (optional)
 - Place route/page content in `AppShell.Main`.
 
 Brand menu requirements:

package/dist/app-shell/AppShell.d.ts

@@ -16,7 +16,9 @@ export interface AppShellSlots {
  * <AppShell brand="comphealth" theme="dark">
  *   <AppShell.Menu>...</AppShell.Menu>
  *   <AppShell.Content>
+ *     <AppShell.Listview>...</AppShell.Listview>
  *     <AppShell.Main>...</AppShell.Main>
+ *     <AppShell.SidePanel>...</AppShell.SidePanel>
  *   </AppShell.Content>
  * </AppShell>
  * ```
@@ -47,12 +49,14 @@ declare const AppShellMenuSlot: ({ children }: AppShellSectionProps) => import("
 declare const AppShellContentSlot: ({ children }: AppShellSectionProps) => import("react/jsx-runtime").JSX.Element;
 declare const AppShellListviewSlot: ({ children }: AppShellSectionProps) => import("react/jsx-runtime").JSX.Element;
 declare const AppShellMainSlot: ({ children }: AppShellSectionProps) => import("react/jsx-runtime").JSX.Element;
+declare const AppShellSidePanelSlot: ({ children }: AppShellSectionProps) => import("react/jsx-runtime").JSX.Element;
 declare const AppShellFooterSlot: ({ children }: AppShellSectionProps) => import("react/jsx-runtime").JSX.Element;
 type AppShellCompound = React.FC<AppShellProps> & {
     Menu: typeof AppShellMenuSlot;
     Content: typeof AppShellContentSlot;
     Listview: typeof AppShellListviewSlot;
     Main: typeof AppShellMainSlot;
+    SidePanel: typeof AppShellSidePanelSlot;
     Footer: typeof AppShellFooterSlot;
 };
 export declare const AppShell: AppShellCompound;

package/dist/components/SearchInput/SearchInput.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),h=require("../Dropdown/Dropdown.cjs");;/* empty css                     */const S=require("../TextInput/TextInput.cjs"),m="uds-search-input";function p({dropdownOptions:e,dropdownValue:c,onDropdownChange:t,dropdownPlaceholder:o="All",dropdownDisabled:u=!1,dropdownPlacement:i="bottom-end",className:f="",disabled:l=!1,size:n="default",...r}){const d=!!(e&&e.length>0)?s.jsx(h.default,{options:e,value:c,onChange:a=>{typeof a=="string"&&(t==null||t(a))},placeholder:o,size:n,placement:i,disabled:l||u,searchable:!1,menuFullWidth:!1,className:`${m}__dropdown-control`}):null;return s.jsx(S.default,{type:"search",icon:"MagnifyingGlass",iconPosition:"left",placeholder:r.placeholder??"Search",className:f,disabled:l,size:n,endAdornment:d,...r})}exports.SearchInput=p;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),S=require("../Dropdown/Dropdown.cjs");;/* empty css                     */const j=require("../TextInput/TextInput.cjs"),l="uds-search-input";function y({dropdownOptions:e,dropdownValue:u,onDropdownChange:t,dropdownPlaceholder:i="All",dropdownDisabled:f=!1,dropdownPlacement:d="bottom-end",className:h="",disabled:a=!1,size:n="default",...r}){const s=!!(e&&e.length>0),m=[l,s&&`${l}--with-dropdown`,h].filter(Boolean).join(" "),p=s?c.jsx(S.default,{options:e,value:u,onChange:o=>{typeof o=="string"&&(t==null||t(o))},placeholder:i,size:n,placement:d,disabled:a||f,searchable:!1,menuFullWidth:!1,className:`${l}__dropdown-control`}):null;return c.jsx(j.default,{type:"search",icon:"MagnifyingGlass",iconPosition:"left",placeholder:r.placeholder??"Search",className:m,disabled:a,size:n,endAdornment:p,...r})}exports.SearchInput=y;

package/dist/components/SearchInput/SearchInput.js

@@ -1 +1 @@
-import{jsx as n}from"react/jsx-runtime";import u from"../Dropdown/Dropdown.js";/* empty css                  */import h from"../TextInput/TextInput.js";const d="uds-search-input";function x({dropdownOptions:e,dropdownValue:c,onDropdownChange:l,dropdownPlaceholder:s="All",dropdownDisabled:f=!1,dropdownPlacement:i="bottom-end",className:m="",disabled:t=!1,size:o="default",...r}){const p=!!(e&&e.length>0)?n(u,{options:e,value:c,onChange:a=>{typeof a=="string"&&(l==null||l(a))},placeholder:s,size:o,placement:i,disabled:t||f,searchable:!1,menuFullWidth:!1,className:`${d}__dropdown-control`}):null;return n(h,{type:"search",icon:"MagnifyingGlass",iconPosition:"left",placeholder:r.placeholder??"Search",className:m,disabled:t,size:o,endAdornment:p,...r})}export{x as SearchInput};
+import{jsx as c}from"react/jsx-runtime";import S from"../Dropdown/Dropdown.js";/* empty css                  */import A from"../TextInput/TextInput.js";const t="uds-search-input";function b({dropdownOptions:e,dropdownValue:i,onDropdownChange:l,dropdownPlaceholder:f="All",dropdownDisabled:m=!1,dropdownPlacement:p="bottom-end",className:u="",disabled:o=!1,size:a="default",...r}){const n=!!(e&&e.length>0),d=[t,n&&`${t}--with-dropdown`,u].filter(Boolean).join(" "),h=n?c(S,{options:e,value:i,onChange:s=>{typeof s=="string"&&(l==null||l(s))},placeholder:f,size:a,placement:p,disabled:o||m,searchable:!1,menuFullWidth:!1,className:`${t}__dropdown-control`}):null;return c(A,{type:"search",icon:"MagnifyingGlass",iconPosition:"left",placeholder:r.placeholder??"Search",className:d,disabled:o,size:a,endAdornment:h,...r})}export{b as SearchInput};

package/dist/components/Tabs/Tabs.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("react/jsx-runtime"),o=require("react"),$=require("./TabItem.cjs"),W=require("../Button/Button.cjs");;/* empty css             */const i="uds-tabs",E={underline:"underline",block:"block","block-inverted":"block-inverted"},V={horizontal:"horizontal",vertical:"vertical"};function P({tabs:u=[],appearance:S="underline",orientation:k="horizontal",activeTab:f,fill:B=!1,scrollable:w=!1,onTabChange:y,className:z="",...j}){const h=o.useRef(null),n=o.useRef(null),[A,N]=o.useState(!1),[q,I]=o.useState(!1),[b,C]=o.useState(!1),s=w&&k==="horizontal",g=f!=null&&f>=0&&f<u.length?f:0,L=[i,E[S]&&`${i}--${E[S]}`,V[k]&&`${i}--${V[k]}`,B&&`${i}--fill`,s&&`${i}--scrollable`,z].filter(Boolean).join(" "),_=o.useCallback((e,t)=>{t.onClick&&t.onClick(e,t),y&&y(e,t)},[y]),a=o.useCallback(()=>{if(!s||!h.current||!n.current)return;const e=h.current,t=n.current,l=e.offsetWidth,r=t.scrollWidth,c=t.scrollLeft;N(c>0),I(c<r-l-1)},[s]),m=o.useCallback(()=>{if(!s||!n.current||g===void 0)return;const e=n.current,t=h.current,l=e.children[g];if(!l||!t)return;const r=t.offsetWidth,c=l.offsetLeft,p=l.offsetWidth,v=e.scrollLeft,R=c+p,K=v,T=v+r;c<K?e.scrollTo({left:c-16,behavior:"smooth"}):R>T&&e.scrollTo({left:R-r+16,behavior:"smooth"})},[g,s]),O=o.useCallback(()=>{if(!n.current)return;const e=n.current.offsetWidth*.75;n.current.scrollBy({left:-e,behavior:"smooth"})},[]),M=o.useCallback(()=>{if(!n.current)return;const e=n.current.offsetWidth*.75;n.current.scrollBy({left:e,behavior:"smooth"})},[]);if(o.useEffect(()=>{const e=h.current??n.current;if(!e||typeof IntersectionObserver>"u"){C(!0);return}const t=new IntersectionObserver(l=>{const r=l[0];C(!!(r!=null&&r.isIntersecting))},{root:null,threshold:.01});return t.observe(e),()=>t.disconnect()},[]),o.useEffect(()=>{if(!s||!b)return;a(),m();const e=h.current,t=n.current;if(!e||!t)return;const l=new ResizeObserver(()=>{a(),m()});return l.observe(e),l.observe(t),t.addEventListener("scroll",a),()=>{l.disconnect(),t.removeEventListener("scroll",a)}},[a,m,s,b,u.length]),o.useEffect(()=>{f==null&&y&&u.length>0&&y(0,u[0])},[]),o.useEffect(()=>{s&&b&&setTimeout(()=>{m(),a()},100)},[a,g,m,s,b]),!u||u.length===0)return null;const x=d.jsx("div",{ref:n,className:`${i}__list`,role:"tablist",...j,children:u.map((e,t)=>{if(!e||typeof e!="object")return null;const l=e.label!=null&&typeof e.label=="string"?e.label:e.label!=null&&typeof e.label!="object"?String(e.label):"",r=typeof e.icon=="string"?e.icon:void 0,c=typeof e.tag=="number"||typeof e.tag=="string"?e.tag:void 0,p=typeof e.tagVariant=="string"?e.tagVariant:void 0,v=e.id!=null&&typeof e.id!="object"?typeof e.id=="string"||typeof e.id=="number"?e.id:String(e.id):t;return d.jsx($.default,{label:l,appearance:S,active:t===g,icon:r,tag:c,tagVariant:p,onClick:()=>_(t,e)},v)})});return s?d.jsxs("div",{ref:h,className:L,children:[A&&d.jsx(W.default,{appearance:"ghost",layout:"icon-only",icon:"CaretLeft",onClick:O,className:`${i}__scroll-button ${i}__scroll-button--left`,"aria-label":"Scroll tabs left"}),x,q&&d.jsx(W.default,{appearance:"ghost",layout:"icon-only",icon:"CaretRight",onClick:M,className:`${i}__scroll-button ${i}__scroll-button--right`,"aria-label":"Scroll tabs right"})]}):d.jsx("div",{className:L,role:"tablist",...j,children:u.map((e,t)=>{if(!e||typeof e!="object")return null;const l=e.label!=null&&typeof e.label=="string"?e.label:e.label!=null&&typeof e.label!="object"?String(e.label):"",r=typeof e.icon=="string"?e.icon:void 0,c=typeof e.tag=="number"||typeof e.tag=="string"?e.tag:void 0,p=typeof e.tagVariant=="string"?e.tagVariant:void 0,v=e.id!=null&&typeof e.id!="object"?typeof e.id=="string"||typeof e.id=="number"?e.id:String(e.id):t;return d.jsx($.default,{label:l,appearance:S,active:t===g,icon:r,tag:c,tagVariant:p,onClick:()=>_(t,e)},v)})})}const D=o.memo(P);exports.default=D;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const b=require("react/jsx-runtime"),n=require("react"),I=require("./TabItem.cjs"),W=require("../Button/Button.cjs");;/* empty css             */const i="uds-tabs",z={underline:"underline",block:"block","block-inverted":"block-inverted"},T={horizontal:"horizontal",vertical:"vertical"};function U({tabs:o=[],appearance:$="underline",orientation:d="horizontal",activeTab:h,fill:V=!1,scrollable:q=!1,onTabChange:m,className:B="",..._}){const v=n.useRef(null),s=n.useRef(null),w=n.useId().replace(/[:]/g,""),[N,O]=n.useState(!1),[K,M]=n.useState(!1),[j,R]=n.useState(!1),a=q&&d==="horizontal",u=h!=null&&h>=0&&h<o.length?h:0,A=[i,z[$]&&`${i}--${z[$]}`,T[d]&&`${i}--${T[d]}`,V&&`${i}--fill`,a&&`${i}--scrollable`,B].filter(Boolean).join(" "),k=n.useCallback((r,e)=>{e.onClick&&e.onClick(r,e),m&&m(r,e)},[m]),E=n.useCallback(r=>{if(!s.current)return;const t=s.current.querySelectorAll('[role="tab"]')[r];t&&t.focus()},[]),L=n.useCallback(r=>!r||typeof r!="object"?null:r,[]),D=n.useCallback((r,e,t)=>{if(!o.length)return;let l=e;const c=d==="horizontal";switch(r.key){case"ArrowRight":if(!c)return;r.preventDefault(),l=(e+1)%o.length;break;case"ArrowLeft":if(!c)return;r.preventDefault(),l=(e-1+o.length)%o.length;break;case"ArrowDown":if(c)return;r.preventDefault(),l=(e+1)%o.length;break;case"ArrowUp":if(c)return;r.preventDefault(),l=(e-1+o.length)%o.length;break;case"Home":r.preventDefault(),l=0;break;case"End":r.preventDefault(),l=o.length-1;break;case"Enter":case" ":r.preventDefault(),k(e,t);return;default:return}const f=L(o[l]);f&&(k(l,f),requestAnimationFrame(()=>E(l)))},[E,L,k,d,o]),g=n.useCallback(()=>{if(!a||!v.current||!s.current)return;const r=v.current,e=s.current,t=r.offsetWidth,l=e.scrollWidth,c=e.scrollLeft;O(c>0),M(c<l-t-1)},[a]),S=n.useCallback(()=>{if(!a||!s.current||u===void 0)return;const r=s.current,e=v.current,t=r.children[u];if(!t||!e)return;const l=e.offsetWidth,c=t.offsetLeft,f=t.offsetWidth,p=r.scrollLeft,y=c+f,C=p,P=p+l;c<C?r.scrollTo({left:c-16,behavior:"smooth"}):y>P&&r.scrollTo({left:y-l+16,behavior:"smooth"})},[u,a]),F=n.useCallback(()=>{if(!s.current)return;const r=s.current.offsetWidth*.75;s.current.scrollBy({left:-r,behavior:"smooth"})},[]),G=n.useCallback(()=>{if(!s.current)return;const r=s.current.offsetWidth*.75;s.current.scrollBy({left:r,behavior:"smooth"})},[]);if(n.useEffect(()=>{const r=v.current??s.current;if(!r||typeof IntersectionObserver>"u"){R(!0);return}const e=new IntersectionObserver(t=>{const l=t[0];R(!!(l!=null&&l.isIntersecting))},{root:null,threshold:.01});return e.observe(r),()=>e.disconnect()},[]),n.useEffect(()=>{if(!a||!j)return;g(),S();const r=v.current,e=s.current;if(!r||!e)return;const t=new ResizeObserver(()=>{g(),S()});return t.observe(r),t.observe(e),e.addEventListener("scroll",g),()=>{t.disconnect(),e.removeEventListener("scroll",g)}},[g,S,a,j,o.length]),n.useEffect(()=>{h==null&&m&&o.length>0&&m(0,o[0])},[]),n.useEffect(()=>{a&&j&&setTimeout(()=>{S(),g()},100)},[g,u,S,a,j]),!o||o.length===0)return null;const H=b.jsx("div",{ref:s,className:`${i}__list`,role:"tablist","aria-orientation":d,..._,children:o.map((r,e)=>{const t=L(r);if(!t)return null;const l=t.label!=null&&typeof t.label=="string"?t.label:t.label!=null&&typeof t.label!="object"?String(t.label):"",c=typeof t.icon=="string"?t.icon:void 0,f=typeof t.tag=="number"||typeof t.tag=="string"?t.tag:void 0,p=typeof t.tagVariant=="string"?t.tagVariant:void 0,y=t.id!=null&&typeof t.id!="object"?typeof t.id=="string"||typeof t.id=="number"?t.id:String(t.id):e;return b.jsx(I.default,{label:l,appearance:$,active:e===u,icon:c,tag:f,tagVariant:p,id:`${i}-tab-${w}-${e}`,tabIndex:e===u?0:-1,onKeyDown:C=>D(C,e,t),onClick:()=>k(e,t)},y)})});return a?b.jsxs("div",{ref:v,className:A,children:[N&&b.jsx(W.default,{appearance:"ghost",layout:"icon-only",icon:"CaretLeft",onClick:F,className:`${i}__scroll-button ${i}__scroll-button--left`,"aria-label":"Scroll tabs left"}),H,K&&b.jsx(W.default,{appearance:"ghost",layout:"icon-only",icon:"CaretRight",onClick:G,className:`${i}__scroll-button ${i}__scroll-button--right`,"aria-label":"Scroll tabs right"})]}):b.jsx("div",{className:A,..._,children:b.jsx("div",{ref:s,className:`${i}__list`,role:"tablist","aria-orientation":d,children:o.map((r,e)=>{const t=L(r);if(!t)return null;const l=t.label!=null&&typeof t.label=="string"?t.label:t.label!=null&&typeof t.label!="object"?String(t.label):"",c=typeof t.icon=="string"?t.icon:void 0,f=typeof t.tag=="number"||typeof t.tag=="string"?t.tag:void 0,p=typeof t.tagVariant=="string"?t.tagVariant:void 0,y=t.id!=null&&typeof t.id!="object"?typeof t.id=="string"||typeof t.id=="number"?t.id:String(t.id):e;return b.jsx(I.default,{label:l,appearance:$,active:e===u,icon:c,tag:f,tagVariant:p,id:`${i}-tab-${w}-${e}`,tabIndex:e===u?0:-1,onKeyDown:C=>D(C,e,t),onClick:()=>k(e,t)},y)})})})}const J=n.memo(U);exports.default=J;

package/dist/components/Tabs/Tabs.js

@@ -1 +1 @@
-import{jsx as g,jsxs as J}from"react/jsx-runtime";import P,{useRef as V,useState as b,useCallback as y,useEffect as k}from"react";import B from"./TabItem.js";import w from"../Button/Button.js";/* empty css          */const i="uds-tabs",z={underline:"underline",block:"block","block-inverted":"block-inverted"},A={horizontal:"horizontal",vertical:"vertical"};function Q({tabs:c=[],appearance:S="underline",orientation:_="horizontal",activeTab:f,fill:N=!1,scrollable:E=!1,onTabChange:m,className:I="",...C}){const a=V(null),l=V(null),[O,K]=b(!1),[M,T]=b(!1),[L,R]=b(!1),r=E&&_==="horizontal",d=f!=null&&f>=0&&f<c.length?f:0,$=[i,z[S]&&`${i}--${z[S]}`,A[_]&&`${i}--${A[_]}`,N&&`${i}--fill`,r&&`${i}--scrollable`,I].filter(Boolean).join(" "),W=y((t,e)=>{e.onClick&&e.onClick(t,e),m&&m(t,e)},[m]),u=y(()=>{if(!r||!a.current||!l.current)return;const t=a.current,e=l.current,o=t.offsetWidth,n=e.scrollWidth,s=e.scrollLeft;K(s>0),T(s<n-o-1)},[r]),v=y(()=>{if(!r||!l.current||d===void 0)return;const t=l.current,e=a.current,o=t.children[d];if(!o||!e)return;const n=e.offsetWidth,s=o.offsetLeft,p=o.offsetWidth,h=t.scrollLeft,j=s+p,G=h,H=h+n;s<G?t.scrollTo({left:s-16,behavior:"smooth"}):j>H&&t.scrollTo({left:j-n+16,behavior:"smooth"})},[d,r]),q=y(()=>{if(!l.current)return;const t=l.current.offsetWidth*.75;l.current.scrollBy({left:-t,behavior:"smooth"})},[]),D=y(()=>{if(!l.current)return;const t=l.current.offsetWidth*.75;l.current.scrollBy({left:t,behavior:"smooth"})},[]);if(k(()=>{const t=a.current??l.current;if(!t||typeof IntersectionObserver>"u"){R(!0);return}const e=new IntersectionObserver(o=>{const n=o[0];R(!!(n!=null&&n.isIntersecting))},{root:null,threshold:.01});return e.observe(t),()=>e.disconnect()},[]),k(()=>{if(!r||!L)return;u(),v();const t=a.current,e=l.current;if(!t||!e)return;const o=new ResizeObserver(()=>{u(),v()});return o.observe(t),o.observe(e),e.addEventListener("scroll",u),()=>{o.disconnect(),e.removeEventListener("scroll",u)}},[u,v,r,L,c.length]),k(()=>{f==null&&m&&c.length>0&&m(0,c[0])},[]),k(()=>{r&&L&&setTimeout(()=>{v(),u()},100)},[u,d,v,r,L]),!c||c.length===0)return null;const F=g("div",{ref:l,className:`${i}__list`,role:"tablist",...C,children:c.map((t,e)=>{if(!t||typeof t!="object")return null;const o=t.label!=null&&typeof t.label=="string"?t.label:t.label!=null&&typeof t.label!="object"?String(t.label):"",n=typeof t.icon=="string"?t.icon:void 0,s=typeof t.tag=="number"||typeof t.tag=="string"?t.tag:void 0,p=typeof t.tagVariant=="string"?t.tagVariant:void 0,h=t.id!=null&&typeof t.id!="object"?typeof t.id=="string"||typeof t.id=="number"?t.id:String(t.id):e;return g(B,{label:o,appearance:S,active:e===d,icon:n,tag:s,tagVariant:p,onClick:()=>W(e,t)},h)})});return r?J("div",{ref:a,className:$,children:[O&&g(w,{appearance:"ghost",layout:"icon-only",icon:"CaretLeft",onClick:q,className:`${i}__scroll-button ${i}__scroll-button--left`,"aria-label":"Scroll tabs left"}),F,M&&g(w,{appearance:"ghost",layout:"icon-only",icon:"CaretRight",onClick:D,className:`${i}__scroll-button ${i}__scroll-button--right`,"aria-label":"Scroll tabs right"})]}):g("div",{className:$,role:"tablist",...C,children:c.map((t,e)=>{if(!t||typeof t!="object")return null;const o=t.label!=null&&typeof t.label=="string"?t.label:t.label!=null&&typeof t.label!="object"?String(t.label):"",n=typeof t.icon=="string"?t.icon:void 0,s=typeof t.tag=="number"||typeof t.tag=="string"?t.tag:void 0,p=typeof t.tagVariant=="string"?t.tagVariant:void 0,h=t.id!=null&&typeof t.id!="object"?typeof t.id=="string"||typeof t.id=="number"?t.id:String(t.id):e;return g(B,{label:o,appearance:S,active:e===d,icon:n,tag:s,tagVariant:p,onClick:()=>W(e,t)},h)})})}const tt=P.memo(Q);export{tt as default};
+import{jsx as g,jsxs as X}from"react/jsx-runtime";import Y,{useRef as z,useId as Z,useState as R,useCallback as u,useEffect as A}from"react";import V from"./TabItem.js";import B from"../Button/Button.js";/* empty css          */const c="uds-tabs",N={underline:"underline",block:"block","block-inverted":"block-inverted"},T={horizontal:"horizontal",vertical:"vertical"};function x({tabs:n=[],appearance:L="underline",orientation:b="horizontal",activeTab:h,fill:K=!1,scrollable:O=!1,onTabChange:y,className:q="",...C}){const m=z(null),l=z(null),D=Z().replace(/[:]/g,""),[M,F]=R(!1),[G,H]=R(!1),[w,I]=R(!1),i=O&&b==="horizontal",a=h!=null&&h>=0&&h<n.length?h:0,W=[c,N[L]&&`${c}--${N[L]}`,T[b]&&`${c}--${T[b]}`,K&&`${c}--fill`,i&&`${c}--scrollable`,q].filter(Boolean).join(" "),S=u((r,e)=>{e.onClick&&e.onClick(r,e),y&&y(r,e)},[y]),j=u(r=>{if(!l.current)return;const t=l.current.querySelectorAll('[role="tab"]')[r];t&&t.focus()},[]),_=u(r=>!r||typeof r!="object"?null:r,[]),E=u((r,e,t)=>{if(!n.length)return;let o=e;const s=b==="horizontal";switch(r.key){case"ArrowRight":if(!s)return;r.preventDefault(),o=(e+1)%n.length;break;case"ArrowLeft":if(!s)return;r.preventDefault(),o=(e-1+n.length)%n.length;break;case"ArrowDown":if(s)return;r.preventDefault(),o=(e+1)%n.length;break;case"ArrowUp":if(s)return;r.preventDefault(),o=(e-1+n.length)%n.length;break;case"Home":r.preventDefault(),o=0;break;case"End":r.preventDefault(),o=n.length-1;break;case"Enter":case" ":r.preventDefault(),S(e,t);return;default:return}const f=_(n[o]);f&&(S(o,f),requestAnimationFrame(()=>j(o)))},[j,_,S,b,n]),d=u(()=>{if(!i||!m.current||!l.current)return;const r=m.current,e=l.current,t=r.offsetWidth,o=e.scrollWidth,s=e.scrollLeft;F(s>0),H(s<o-t-1)},[i]),k=u(()=>{if(!i||!l.current||a===void 0)return;const r=l.current,e=m.current,t=r.children[a];if(!t||!e)return;const o=e.offsetWidth,s=t.offsetLeft,f=t.offsetWidth,p=r.scrollLeft,v=s+f,$=p,Q=p+o;s<$?r.scrollTo({left:s-16,behavior:"smooth"}):v>Q&&r.scrollTo({left:v-o+16,behavior:"smooth"})},[a,i]),U=u(()=>{if(!l.current)return;const r=l.current.offsetWidth*.75;l.current.scrollBy({left:-r,behavior:"smooth"})},[]),J=u(()=>{if(!l.current)return;const r=l.current.offsetWidth*.75;l.current.scrollBy({left:r,behavior:"smooth"})},[]);if(A(()=>{const r=m.current??l.current;if(!r||typeof IntersectionObserver>"u"){I(!0);return}const e=new IntersectionObserver(t=>{const o=t[0];I(!!(o!=null&&o.isIntersecting))},{root:null,threshold:.01});return e.observe(r),()=>e.disconnect()},[]),A(()=>{if(!i||!w)return;d(),k();const r=m.current,e=l.current;if(!r||!e)return;const t=new ResizeObserver(()=>{d(),k()});return t.observe(r),t.observe(e),e.addEventListener("scroll",d),()=>{t.disconnect(),e.removeEventListener("scroll",d)}},[d,k,i,w,n.length]),A(()=>{h==null&&y&&n.length>0&&y(0,n[0])},[]),A(()=>{i&&w&&setTimeout(()=>{k(),d()},100)},[d,a,k,i,w]),!n||n.length===0)return null;const P=g("div",{ref:l,className:`${c}__list`,role:"tablist","aria-orientation":b,...C,children:n.map((r,e)=>{const t=_(r);if(!t)return null;const o=t.label!=null&&typeof t.label=="string"?t.label:t.label!=null&&typeof t.label!="object"?String(t.label):"",s=typeof t.icon=="string"?t.icon:void 0,f=typeof t.tag=="number"||typeof t.tag=="string"?t.tag:void 0,p=typeof t.tagVariant=="string"?t.tagVariant:void 0,v=t.id!=null&&typeof t.id!="object"?typeof t.id=="string"||typeof t.id=="number"?t.id:String(t.id):e;return g(V,{label:o,appearance:L,active:e===a,icon:s,tag:f,tagVariant:p,id:`${c}-tab-${D}-${e}`,tabIndex:e===a?0:-1,onKeyDown:$=>E($,e,t),onClick:()=>S(e,t)},v)})});return i?X("div",{ref:m,className:W,children:[M&&g(B,{appearance:"ghost",layout:"icon-only",icon:"CaretLeft",onClick:U,className:`${c}__scroll-button ${c}__scroll-button--left`,"aria-label":"Scroll tabs left"}),P,G&&g(B,{appearance:"ghost",layout:"icon-only",icon:"CaretRight",onClick:J,className:`${c}__scroll-button ${c}__scroll-button--right`,"aria-label":"Scroll tabs right"})]}):g("div",{className:W,...C,children:g("div",{ref:l,className:`${c}__list`,role:"tablist","aria-orientation":b,children:n.map((r,e)=>{const t=_(r);if(!t)return null;const o=t.label!=null&&typeof t.label=="string"?t.label:t.label!=null&&typeof t.label!="object"?String(t.label):"",s=typeof t.icon=="string"?t.icon:void 0,f=typeof t.tag=="number"||typeof t.tag=="string"?t.tag:void 0,p=typeof t.tagVariant=="string"?t.tagVariant:void 0,v=t.id!=null&&typeof t.id!="object"?typeof t.id=="string"||typeof t.id=="number"?t.id:String(t.id):e;return g(V,{label:o,appearance:L,active:e===a,icon:s,tag:f,tagVariant:p,id:`${c}-tab-${D}-${e}`,tabIndex:e===a?0:-1,onKeyDown:$=>E($,e,t),onClick:()=>S(e,t)},v)})})})}const lt=Y.memo(x);export{lt as default};

package/dist/components/Tag/Tag.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),j=require("../Icon/Icon.cjs");;/* empty css            */const e="uds-tag",h={"label-only":"label-only","icon-left":"icon-left"},i={compact:"compact",default:"default"},x={transparent:"transparent",neutral:"neutral",red:"red",orange:"orange",yellow:"yellow",emerald:"emerald",green:"green",sky:"sky",cyan:"cyan",blue:"blue",indigo:"indigo",purple:"purple",fuchsia:"fuchsia",magenta:"magenta",inverse:"inverse"};function M({label:l="Label",appearance:r="label-only",size:n="compact",color:p="transparent",rounded:d=!0,solid:t=!1,outlined:f=!1,pastel:m=!1,icon:a,className:g="",onClick:o,...$}){const c=f&&!t,y=m&&!t&&!c,b=[e,`${e}--${h[r]}`,i[n]&&`${e}--${i[n]}`,`${e}--${x[p]}`,d&&`${e}--rounded`,t&&`${e}--solid`,c&&`${e}--outlined`,y&&`${e}--pastel`,g].filter(Boolean).join(" "),_=o?"button":"span",u=r==="icon-left"&&a;return s.jsxs(_,{className:b,onClick:o,...$,children:[u&&typeof a=="string"&&s.jsx(j.default,{name:a,size:n==="compact"?12:16,appearance:"regular",className:`${e}__icon`}),u&&typeof a!="string"&&s.jsx("span",{className:`${e}__icon`,children:a}),l&&s.jsx("span",{className:`${e}__label`,children:l})]})}exports.default=M;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),h=require("../Icon/Icon.cjs");;/* empty css            */const e="uds-tag",v={"label-only":"label-only","icon-left":"icon-left"},i={compact:"compact",default:"default"},x={transparent:"transparent",neutral:"neutral",red:"red",orange:"orange",yellow:"yellow",emerald:"emerald",green:"green",sky:"sky",cyan:"cyan",blue:"blue",indigo:"indigo",purple:"purple",fuchsia:"fuchsia",magenta:"magenta",inverse:"inverse"};function M({label:r="Label",appearance:o="label-only",size:t="compact",color:p="transparent",rounded:d=!0,solid:n=!1,outlined:f=!1,pastel:m=!1,icon:a,className:g="",onClick:l,...y}){const c=f&&!n,$=m&&!n&&!c,b=[e,`${e}--${v[o]}`,i[t]&&`${e}--${i[t]}`,`${e}--${x[p]}`,d&&`${e}--rounded`,n&&`${e}--solid`,c&&`${e}--outlined`,$&&`${e}--pastel`,g].filter(Boolean).join(" "),_=l?"button":"span",u=o==="icon-left"&&a,j=l?{type:"button"}:{};return s.jsxs(_,{className:b,onClick:l,...j,...y,children:[u&&typeof a=="string"&&s.jsx(h.default,{name:a,size:t==="compact"?12:16,appearance:"regular",className:`${e}__icon`}),u&&typeof a!="string"&&s.jsx("span",{className:`${e}__icon`,children:a}),r&&s.jsx("span",{className:`${e}__label`,children:r})]})}exports.default=M;

package/dist/components/Tag/Tag.js

@@ -1 +1 @@
-import{jsxs as h,jsx as l}from"react/jsx-runtime";import N from"../Icon/Icon.js";/* empty css         */const e="uds-tag",j={"label-only":"label-only","icon-left":"icon-left"},i={compact:"compact",default:"default"},x={transparent:"transparent",neutral:"neutral",red:"red",orange:"orange",yellow:"yellow",emerald:"emerald",green:"green",sky:"sky",cyan:"cyan",blue:"blue",indigo:"indigo",purple:"purple",fuchsia:"fuchsia",magenta:"magenta",inverse:"inverse"};function v({label:t="Label",appearance:o="label-only",size:n="compact",color:m="transparent",rounded:u=!0,solid:s=!1,outlined:f=!1,pastel:d=!1,icon:a,className:g="",onClick:r,...$}){const c=f&&!s,y=d&&!s&&!c,b=[e,`${e}--${j[o]}`,i[n]&&`${e}--${i[n]}`,`${e}--${x[m]}`,u&&`${e}--rounded`,s&&`${e}--solid`,c&&`${e}--outlined`,y&&`${e}--pastel`,g].filter(Boolean).join(" "),_=r?"button":"span",p=o==="icon-left"&&a;return h(_,{className:b,onClick:r,...$,children:[p&&typeof a=="string"&&l(N,{name:a,size:n==="compact"?12:16,appearance:"regular",className:`${e}__icon`}),p&&typeof a!="string"&&l("span",{className:`${e}__icon`,children:a}),t&&l("span",{className:`${e}__label`,children:t})]})}export{v as default};
+import{jsxs as h,jsx as l}from"react/jsx-runtime";import N from"../Icon/Icon.js";/* empty css         */const e="uds-tag",v={"label-only":"label-only","icon-left":"icon-left"},i={compact:"compact",default:"default"},j={transparent:"transparent",neutral:"neutral",red:"red",orange:"orange",yellow:"yellow",emerald:"emerald",green:"green",sky:"sky",cyan:"cyan",blue:"blue",indigo:"indigo",purple:"purple",fuchsia:"fuchsia",magenta:"magenta",inverse:"inverse"};function w({label:r="Label",appearance:o="label-only",size:n="compact",color:u="transparent",rounded:m=!0,solid:t=!1,outlined:f=!1,pastel:d=!1,icon:a,className:g="",onClick:s,...$}){const c=f&&!t,y=d&&!t&&!c,b=[e,`${e}--${v[o]}`,i[n]&&`${e}--${i[n]}`,`${e}--${j[u]}`,m&&`${e}--rounded`,t&&`${e}--solid`,c&&`${e}--outlined`,y&&`${e}--pastel`,g].filter(Boolean).join(" "),_=s?"button":"span",p=o==="icon-left"&&a;return h(_,{className:b,onClick:s,...s?{type:"button"}:{},...$,children:[p&&typeof a=="string"&&l(N,{name:a,size:n==="compact"?12:16,appearance:"regular",className:`${e}__icon`}),p&&typeof a!="string"&&l("span",{className:`${e}__icon`,children:a}),r&&l("span",{className:`${e}__label`,children:r})]})}export{w as default};

package/dist/design-system/components/Tag/Tag.d.ts

@@ -11,7 +11,7 @@ import type { TagProps } from "./Tag.types";
  * @param {boolean} solid - Whether to use solid background (default: false)
  * @param {boolean} outlined - Whether to use outlined treatment (default: false)
  * @param {boolean} pastel - Whether to use lighter pastel treatment (default: false)
- * @param {string|boolean} icon - Icon name to display (when appearance is 'icon-left')
+ * @param {string|ReactNode} icon - Icon name or custom node (when appearance is 'icon-left')
  * @param {string} className - Additional CSS classes
  * @param {function} onClick - Click handler function
  * @param {object} props - Additional props to pass to the tag element

package/dist/design-system/components/Tag/Tag.types.d.ts

@@ -1,8 +1,8 @@
-import type { HTMLAttributes, ReactNode } from "react";
+import type { HTMLAttributes, MouseEventHandler, ReactNode } from "react";
 export type TagAppearance = "label-only" | "icon-left";
 export type TagSize = "compact" | "default";
 export type TagColor = "transparent" | "neutral" | "red" | "orange" | "yellow" | "emerald" | "green" | "sky" | "cyan" | "blue" | "indigo" | "purple" | "fuchsia" | "magenta" | "inverse";
-export interface TagProps extends HTMLAttributes<HTMLDivElement> {
+export interface TagProps extends HTMLAttributes<HTMLElement> {
     label?: string;
     appearance?: TagAppearance;
     size?: TagSize;
@@ -13,5 +13,5 @@ export interface TagProps extends HTMLAttributes<HTMLDivElement> {
     pastel?: boolean;
     icon?: string | ReactNode;
     className?: string;
-    onClick?: (...args: unknown[]) => void;
+    onClick?: MouseEventHandler<HTMLElement>;
 }

package/dist/design-system/generated/component-api.d.ts

@@ -51,7 +51,7 @@ export declare const COMPONENT_API: {
         readonly name: "AppShell";
         readonly source: "src/design-system/components/AppShell/AppShell.spec.ts";
         readonly tier: 1;
-        readonly purpose: "Top-level application shell that composes menu, content, and main regions for consistent page architecture.";
+        readonly purpose: "Top-level application shell that composes menu, listview, main, side panel, and footer regions for consistent page architecture.";
         readonly props: {
             readonly brand: {
                 readonly type: "enum";
@@ -75,7 +75,7 @@ export declare const COMPONENT_API: {
             readonly keyboard: readonly ["Tab"];
         };
         readonly composition: {
-            readonly allowedChildren: readonly ["Menu", "Container", "Layout", "Text", "Button"];
+            readonly allowedChildren: readonly ["Menu", "Listview", "Main", "SidePanel", "Footer", "Container", "Layout", "Text", "Button"];
             readonly allowedParents: readonly [];
             readonly disallowedChildren: readonly [];
         };
@@ -1214,6 +1214,53 @@ export declare const COMPONENT_API: {
         };
         readonly antiPatterns: readonly ["Using Link for button-like actions that do not navigate.", "Relying on color only without visible text for meaning."];
     };
+    readonly Medallion: {
+        readonly name: "Medallion";
+        readonly source: "src/design-system/components/Medallion/Medallion.spec.ts";
+        readonly tier: 2;
+        readonly purpose: "Displays an icon inside a colorized shape for compact visual context.";
+        readonly props: {
+            readonly shape: {
+                readonly type: "enum";
+                readonly values: readonly ["circle", "square", "roundedSquare", "diamond"];
+                readonly default: "circle";
+            };
+            readonly size: {
+                readonly type: "enum";
+                readonly values: readonly ["small", "default", "large", "xl"];
+                readonly default: "default";
+            };
+            readonly color: {
+                readonly type: "enum";
+                readonly values: readonly ["transparent", "neutral", "red", "orange", "yellow", "emerald", "green", "sky", "cyan", "blue", "indigo", "purple", "fuchsia", "magenta", "inverse"];
+                readonly default: "neutral";
+            };
+        };
+        readonly defaults: {
+            readonly shape: "circle";
+            readonly size: "default";
+            readonly color: "neutral";
+        };
+        readonly states: readonly ["default"];
+        readonly tokensUsed: readonly ["--uds-color-accent-*-100", "--uds-color-accent-*-700", "--uds-surface-secondary", "--uds-border-primary"];
+        readonly accessibility: {
+            readonly role: "img";
+            readonly keyboard: readonly [];
+        };
+        readonly composition: {
+            readonly allowedChildren: readonly [];
+            readonly allowedParents: readonly [];
+            readonly disallowedChildren: readonly [];
+        };
+        readonly aliases: {
+            readonly props: {};
+        };
+        readonly ambiguity: {
+            readonly propNameCollisions: readonly [];
+            readonly hadAliasNormalization: false;
+        };
+        readonly antiPatterns: readonly [];
+    };
     readonly Menu: {
         readonly name: "Menu";
         readonly source: "src/design-system/components/Menu/Menu.spec.ts";