@ds-mo/ui 14.21.0 → 14.22.1

package/dist/mcp-data/registry/registry.json

@@ -1309,6 +1309,7 @@
           ],
           "commonlyComposedWith": [
             "component:ds-shell-page",
+            "component:ds-shell-app",
             "component:ds-button-filled",
             "component:ds-button-unfilled",
             "component:ds-breadcrumb",
@@ -1333,11 +1334,13 @@
             "The overflow trigger uses its bordered treatment whenever the primary action is visible beside it; overflow-only and auto-collapsed-primary presentations keep the trigger borderless.",
             "expanded renders the larger heading, optional description, inset divider, and a full-width caption breadcrumb row above the title. The breadcrumb begins after 32px top padding; the following title and right-side actions share one top alignment. Compact renders 48px chrome with the existing icon Back action; constrained uses compact chrome and moves an auto-collapse primary action into overflow.",
             "primaryAction collapse defaults to auto. Use never for exceptional actions whose hierarchy must remain visible in constrained layouts.",
-            "showDivider=false removes the bottom divider when the surrounding page composition supplies the boundary; showCompactDivider can independently restore or remove that boundary in compact and constrained variants."
+            "showDivider=false removes the bottom divider when the surrounding page composition supplies the boundary; showCompactDivider can independently restore or remove that boundary in compact and constrained variants.",
+            "placement=shell-bar is reserved for ShellApp panel section navigation. It remains compact, omits description and breadcrumb presentation, and preserves applicable Back, section, primary, and overflow controls."
           ],
           "responsiveBehavior": [
             "BarTitle does not observe viewport, shell, scroll, or container state. Its owner selects an explicit variant.",
             "ShellPage is the standard owner for automatic expanded, compact, and constrained selection.",
+            "ShellApp owns shell-bar placement and always selects compact presentation there; mobile continues to use MobileHeader.",
             "When ShellPage owns BarTitle on a secondary desktop or tablet page, its expanded, compact, and constrained presentations all match that canvas; the separate MobileHeader component remains primary.",
             "Compact titles use the shared compact-header geometry and md control inset so top-level headings align with BarNav and inline Back geometry aligns with PanelToolHeader. Long headings and section labels truncate independently while Back and action controls retain complete hit targets and accessible names.",
             "A never-collapse primary action remains visible in constrained mode; the title and section label yield space first."
@@ -1404,6 +1407,10 @@
             "type": "string",
             "required": true
           },
+          "placement": {
+            "type": "BarTitlePlacement",
+            "required": false
+          },
           "primaryAction": {
             "type": "BarTitlePrimaryAction | null",
             "required": false
@@ -6283,7 +6290,7 @@
     {
       "name": "panel-nav",
       "title": "PanelNav",
-      "description": "The single persistent primary navigation for an application, providing grouped top-level destinations, active-route state, standard dashboard/settings switching, user access, and collapsible desktop and tablet presentation.",
+      "description": "The single persistent primary navigation for an application, providing grouped destinations, optional nested route sections, active-route state, standard dashboard/settings switching, user access, and collapsible desktop and tablet presentation.",
       "type": "registry:ui",
       "meta": {
         "library": "@ds-mo/ui",
@@ -6294,7 +6301,7 @@
         "intent": {
           "audience": "specialized",
           "status": "stable",
-          "summary": "The single persistent primary navigation for an application, providing grouped top-level destinations, active-route state, standard dashboard/settings switching, user access, and collapsible desktop and tablet presentation.",
+          "summary": "The single persistent primary navigation for an application, providing grouped destinations, optional nested route sections, active-route state, standard dashboard/settings switching, user access, and collapsible desktop and tablet presentation.",
           "useWhen": [
             "Building the one primary navigation surface for an application that uses the CompoMo system.",
             "Top-level destinations must remain consistently available while the application's page content changes.",
@@ -6302,14 +6309,14 @@
           ],
           "avoidWhen": [
             "A second navigation surface is needed within the same application; an application must have only one PanelNav.",
-            "The choices represent sections within the active primary destination; use BarNav instead.",
+            "Route sections belong in the shell bar for the application's selected navigation mode; use flat PanelNav with BarNav rather than mixing both section presentations.",
             "The choices switch local content without changing the application's primary destination; use TabGroup instead.",
             "The interaction performs a command or presents temporary contextual choices; use a button or Menu instead.",
             "Building navigation below the mobile breakpoint; use the application's dedicated mobile navigation component instead."
           ],
           "alternatives": [
             {
-              "when": "The choices represent route sections within the active primary destination.",
+              "when": "The application uses the standard flat primary-navigation mode and route sections belong in the shell bar.",
               "component": "component:ds-bar-nav",
               "reason": "BarNav owns secondary section navigation within the destination selected by PanelNav."
             },
@@ -6337,6 +6344,7 @@
             "Give every primary destination a concise visible label and an icon that supports rather than replaces that label.",
             "Provide localized dashboard, settings, account, navigation, collapse, and expand labels.",
             "Preserve accessible destination names when the panel is collapsed to icon-only presentation.",
+            "In nested presentation, expose parent expansion state, give only the active child aria-current, and focus the selected or first enabled child when a keyboard-opened flyout appears.",
             "Use notification dots as supplemental status and never as the only indication of important information.",
             "When the destination body overflows, it becomes a localized keyboard-focusable scroll region in addition to the roving destination controls.",
             "Keep the standard dashboard/settings switch and user/account entry available in the footer."
@@ -6345,7 +6353,13 @@
             "Render exactly one PanelNav per application; it owns primary application destinations and no other navigation role.",
             "The host router owns the current route; prefer currentUrl for active destination matching and use activeId only when route matching is unavailable.",
             "Use anchor mode for native links or routers that intercept anchors; use event mode when the host performs navigation from dsNavSelect.",
-            "Groups visually organize top-level destinations only and must not be interpreted as nested or expandable navigation.",
+            "Groups visually organize top-level destinations. Use presentation=nested only when parent children replace BarNav route sections.",
+            "A parent with children is not a standalone page: activating it while expanded resolves to the first enabled child; route state keeps that parent expanded and gives both parent and child selected styling.",
+            "While one parent is expanded in nested presentation, other top-level destinations retain secondary foreground; flat and collapsed presentations keep their existing foreground treatment.",
+            "Within a multi-item group, an expanded nested branch is bounded beside its siblings: the first branch adds a divider after its children, a middle branch adds dividers before its parent and after its children, and the final branch adds a divider before its parent. Single-item groups add neither. Divider space expands on the nested section-height timing while the line fades in, with equal visible spacing on both sides; collapsing the full rail contracts and fades the divider on the rail-collapse timing.",
+            "Expanded nested branches animate to their full required height over 500ms while fixed-size child rows progressively fade over 500ms after a 250ms wait, with each row starting 50ms after the previous row. On close, child rows fade out in reverse order with secondary foreground and the height contraction waits 250ms; reduced-motion preferences collapse those transitions to the instant motion token.",
+            "Collapsing the full navigation rail keeps the active nested branch mounted through the rail transition and contracts its height over the same duration, so following destinations reposition without snapping.",
+            "Collapsed nested presentation opens a child-only flyout from the parent icon without navigating; the parent holds the transient pressed wash while the flyout is rendered, activates again to close, and emits navigation intent only after a child selection.",
             "Dashboard presents day-to-day operational destinations; Settings presents administrative and configuration destinations.",
             "The standard footer switches the entire destination collection and navStyle between Dashboard and Settings and exposes the user/account entry.",
             "The host owns the external user menu opened from dsNavUserAction.",
@@ -6359,7 +6373,8 @@
             "Below 768px, the consuming application replaces PanelNav with a dedicated mobile navigation component; PanelNav does not own mobile navigation.",
             "Managed ShellApp permanently owns responsive composition: it determines shell mode, enforces tablet collapse, and presents MobileSheetNav below 768px.",
             "When the viewport is below breakpoint, PanelNav locks collapsed, disables its header toggle affordance, and preserves the persisted desktop collapse preference.",
-            "Collapsed presentation must preserve destination ordering, active state, notification status, and accessible names."
+            "Collapsed presentation must preserve destination ordering, active state, notification status, and accessible names.",
+            "Nested parents expose child routes inline while expanded and in an anchored flyout while collapsed; mobile navigation remains owned by ShellApp."
           ],
           "frameworkCaveats": {
             "customElements": [
@@ -6400,6 +6415,10 @@
             "type": "boolean",
             "required": false
           },
+          "activeChildId": {
+            "type": "string",
+            "required": false
+          },
           "activeId": {
             "type": "string",
             "required": false
@@ -6448,6 +6467,10 @@
             "type": "string",
             "required": false
           },
+          "presentation": {
+            "type": "PanelNavPresentation",
+            "required": false
+          },
           "routerMode": {
             "type": "PanelNavRouterMode",
             "required": false
@@ -6482,6 +6505,10 @@
             "name": "dsChromeTransitionStart",
             "detail": "ChromeTransitionDetail"
           },
+          {
+            "name": "dsNavChildSelect",
+            "detail": "PanelNavChildSelectDetail"
+          },
           {
             "name": "dsNavFooterAction",
             "detail": "void"
@@ -6516,6 +6543,7 @@
         "badge",
         "button-unfilled",
         "icon",
+        "menu",
         "text",
         "tooltip"
       ]
@@ -7801,6 +7829,7 @@
           "commonlyComposedWith": [
             "component:ds-panel-nav",
             "component:ds-bar-nav",
+            "component:ds-bar-title",
             "component:ds-panel-tools",
             "component:ds-shell-tools",
             "component:ds-mobile-sheet-nav",
@@ -7830,6 +7859,10 @@
             "The application router owns the current route, authorization filtering, Dashboard or Settings context, destination collections, section collections, and localized content labels.",
             "ShellApp renders the lower-level desktop, tablet, and mobile chrome, coordinates layout, gradient alignment, transitions, shortcuts, global surfaces, optional Inbox state, focus restoration, and mobile-stage visibility.",
             "The application router owns authorization, current URLs, history, and route execution; ShellApp forwards navigation and page intent events without routing.",
+            "sectionNavigation is an application-controlled preference: bar keeps route sections in BarNav, while panel renders them as nested PanelNav children and places compact BarTitle in the shell bar.",
+            "Managed ShellApp derives ShellPage desktop header placement from sectionNavigation. Panel mode removes page-local title geometry, restores the standard responsive top gutter, and preserves full-bleed page content without requiring route-specific navigation branches.",
+            "Switch sectionNavigation at runtime without replacing routed content or tool owners; the application owns preference storage and defaults new users to bar unless product policy says otherwise.",
+            "In panel mode, supply the same route sections as children on their PanelNav parent and handle dsNavChildSelect as structured parent, child, and href navigation intent.",
             "The application supplies each routed content owner and tool view once. ShellApp changes visibility, inert state, and presentation without recreating those nodes.",
             "The optional banner slot accepts one application-owned ds-banner above the complete shell row. The application owns its open state, orientation for the current shell capacity, action consequences, dismissal persistence, and resolution when several messages compete.",
             "Use composition=slotted only for advanced application architectures that intentionally own all lower-level chrome wiring.",
@@ -7839,15 +7872,18 @@
             "Dashboard represents day-to-day operational work while Settings represents administrative and configuration work; route state selects the context.",
             "Replace navigation and pageChrome together from one completed route state.",
             "When pageChrome.showBack marks a detail depth, mobile chrome keeps the page heading as its identity and presents only local subsections; peer route tabs remain in desktop BarNav rather than replacing the detail heading.",
-            "Managed ShellApp keeps BarNav and ShellPage presentations present and owns page header stickiness and the content scroller.",
-            "Route-owned pageChrome independently selects ShellPage contentInset, roomy and compact top seams, scroll compaction, expanded and compact header-divider visibility, and contentSurface; ShellApp forwards them without making page-specific layout or surface decisions.",
+            "Managed ShellApp keeps the selected desktop section-navigation presentation and ShellPage present and owns page header stickiness and the content scroller.",
+            "Route-owned pageChrome independently selects ShellPage contentInset, page-header seams, scroll compaction, expanded and compact header-divider visibility, and contentSurface. ShellApp forwards them while resolving whether desktop title geometry is page-local or shell-bar-owned.",
             "The application filters unauthorized destinations, sections, and tools before passing them into shell components."
           ],
           "responsiveBehavior": [
             "ShellApp owns the fixed system breakpoints and resolves desktop at 1200px and wider, tablet from 768px through 1199px, and mobile below 768px.",
             "On desktop, PanelNav defaults expanded, permits user collapse or expansion, and respects the locally persisted desktop preference.",
             "On tablet, ShellApp keeps PanelNav permanently collapsed and prevents user expansion without overwriting the desktop preference.",
+            "On desktop and tablet, panel section navigation replaces BarNav with compact BarTitle; collapsed PanelNav exposes child sections through its anchored flyout.",
+            "When panel section navigation moves BarTitle into the shell bar, routed content starts at the standard 32px desktop or 16px tablet gutter and ShellPage reports no page-local sticky-header height.",
             "On mobile, ShellApp hides and inerts desktop chrome, uses a solid primary stage, and composes MobileHeader, MobileSheetNav, ShellTools, and the persistent MobileBarNav around the same application-owned content.",
+            "Changing sectionNavigation never changes mobile chrome; the preference may still be edited by an application Settings page.",
             "Opening MobileSheetNav temporarily overlays the active routed page or global tool; closing it without selecting an area restores that same destination and its nested state. The sheet exposes the router-derived current area only while the routed area owns the mobile stage, so a global tool never leaves an underlying route highlighted.",
             "Selecting Help from the managed mobile sheet activates the configured Help tool and promotes Help to the primary mobile destination instead of forwarding it as route navigation.",
             "Set navigation.showMobileAccount to false when the Settings destination collection already includes account and user preferences.",
@@ -7931,6 +7967,10 @@
             "type": "PaperTextureConfig",
             "required": false
           },
+          "sectionNavigation": {
+            "type": "ShellSectionNavigation",
+            "required": false
+          },
           "shortcutsEnabled": {
             "type": "boolean",
             "required": false
@@ -7957,6 +7997,10 @@
             "name": "dsHeaderBack",
             "detail": "{ tool: PanelToolsToolId }"
           },
+          {
+            "name": "dsNavChildSelect",
+            "detail": "PanelNavChildSelectDetail"
+          },
           {
             "name": "dsNavFooterAction",
             "detail": "void"
@@ -8074,7 +8118,7 @@
           ],
           "accessibility": [
             "ShellPage exposes the routed page as the main landmark; render exactly one active ShellPage inside ShellApp.",
-            "Provide one BarTitle or BarWorkflow through the desktop header slot and one MobileHeader through mobile-header when the page participates in the mobile shell.",
+            "Provide one BarTitle or BarWorkflow through the desktop header slot when desktopHeaderPlacement=page, and one MobileHeader through mobile-header when the page participates in the mobile shell.",
             "Keep loading, empty, validation, error, progress, success, and failure communication in the default product-content slot.",
             "Responsive variant changes preserve the same heading, controls, accessible names, and keyboard focus targets."
           ],
@@ -8082,6 +8126,7 @@
             "headerCapacity=roomy, compact, or constrained is supplied before paint by the owning application shell and describes the page-header space available after viewport and shell-chrome policy are applied.",
             "headerPresentation=auto selects the matching header variant from headerCapacity and scroll position.",
             "expanded, compact, and constrained are explicit overrides for exceptional layouts and deterministic examples.",
+            "desktopHeaderPlacement=page preserves page-local sticky title geometry. shell-bar declares that desktop and tablet title chrome is external and compact, restores the responsive top gutter, reports zero page-header block size, and disables page-header scroll compaction while preserving downstream compact-header behavior and full-bleed content.",
             "contentInset=default supplies standard page gutters; none permits maps, canvases, and other full-bleed content.",
             "contentInsetBlockStart=none removes only the gutter adjacent to the page header while retaining the responsive inline and bottom gutters.",
             "contentInsetBlockStartSize can provide an exact roomy top seam, while compactContentInsetBlockStartSize independently defines the compact and constrained seam. ShellPage exposes their resolved sticky-header offset through --ds-shell-page-content-block-start-offset for viewport-fitted descendants.",
@@ -8098,6 +8143,7 @@
             "responsiveMode=mobile hides and inerts the desktop header, exposes mobile-header, and disables desktop scroll-compaction geometry.",
             "Update headerCapacity synchronously with shell layout state so opening tools or crossing application breakpoints cannot briefly render the wrong presentation.",
             "The default content inset is balanced on every side: 32px in desktop mode and 16px in tablet and mobile modes.",
+            "When desktopHeaderPlacement=shell-bar, desktop and tablet ignore page-header-specific block-start seam overrides and expose --ds-shell-page-content-block-start-offset as the responsive gutter only; mobile keeps its MobileHeader geometry and existing seam.",
             "contentInsetBlockStart can independently remove the top gutter for table and canvas pages that should meet the sticky header; exact roomy and compact block-start sizes support pages whose seam changes with header capacity.",
             "The selected content surface persists unchanged across desktop, tablet, and mobile modes.",
             "On a secondary desktop or tablet page, BarTitle matches the page canvas across capacity and scroll-driven variant changes; the separate mobile-header presentation remains primary.",
@@ -8109,7 +8155,7 @@
           ],
           "frameworkCaveats": {
             "customElements": [
-              "Import ShellPage with BarTitle or BarWorkflow in slot=header and MobileHeader in slot=mobile-header, then render route content as default children.",
+              "Import ShellPage with BarTitle or BarWorkflow in slot=header when desktopHeaderPlacement=page and MobileHeader in slot=mobile-header, then render route content as default children.",
               "Do not set BarTitle.variant while ShellPage owns headerPresentation."
             ],
             "react": [
@@ -8157,6 +8203,10 @@
             "type": "ShellPageContentSurface",
             "required": false
           },
+          "desktopHeaderPlacement": {
+            "type": "ShellPageDesktopHeaderPlacement",
+            "required": false
+          },
           "headerCapacity": {
             "type": "ShellPageCapacity",
             "required": false