@ds-mo/ui 14.22.1 → 14.23.0

package/dist/.package-ready.json

@@ -1 +1 @@
-{"schemaVersion":1,"package":"@ds-mo/ui","version":"14.22.1","components":77,"digest":"f3e3c27279561f0bc5f50e768da667395a20dd5d09a88fbdd0526d2eacc0ea3d","completedAt":"2026-08-30T01:47:44.823Z"}
+{"schemaVersion":1,"package":"@ds-mo/ui","version":"14.23.0","components":77,"digest":"2db305df550d826a65e3755c57cc2404e35f4ddd1ea9740d06ac41399959b27d","completedAt":"2026-08-31T23:09:00.789Z"}

package/dist/agent-patterns.json

@@ -1,7 +1,7 @@
 {
   "schemaVersion": "1.0.0",
   "package": "@ds-mo/ui",
-  "packageVersion": "14.22.1",
+  "packageVersion": "14.23.0",
   "kind": "patterns",
   "entries": [
     {
@@ -204,6 +204,8 @@
         "ShellApp emits stable navigation and page intent events; it never mutates router history.",
         "ShellApp owns responsive mode, PanelNav presentation, tool open state, active tool, direct mobile destinations, optional Inbox grouping, Menu state, fullscreen presentation, focus restoration, and breakpoint state preservation.",
         "Tool products and routed content are instantiated once by the application in named tool-view and default slots; ShellApp changes presentation without recreating those owners.",
+        "The application owns rail accessory state, labels, timers, permissions, navigation, and action consequences. ShellApp forwards governed desktop and tablet accessory definitions and intents without changing tool selection or drawer state.",
+        "When a transient status group and shortcut group coexist in the same rail region, the application assigns explicit orders for status, decorative boundary, then shortcuts; component behavior never infers grouping from product-specific ids.",
         "The application owns account menus, tool product data, page actions, and the consequences of every emitted intent event.",
         "The application owns viewport and theme-color metadata, the dynamic-viewport framework root, and containing document overscroll so body never becomes a second application scroller; ShellApp fills that owner and keeps its existing internal scrollers.",
         "The application resolves competing global messages to one Banner and owns its actions, controlled open state, orientation for the available shell capacity, dismissal persistence, and removal after exit motion.",
@@ -213,6 +215,7 @@
         "Render exactly one managed ShellApp and one active routed main landmark.",
         "Provide visible labels and accessible names in navigation, pageChrome, and tool definitions before passing them to ShellApp.",
         "Handle ShellApp intent events without replacing focusable owners during responsive or fullscreen transitions.",
+        "Pair accessory status indicators with accessible status text and keep decorative accessory boundaries out of the accessibility tree.",
         "Keep the canonical Agents and Help tools available; expose Activity directly on mobile unless the product explicitly opts into grouped Inbox behavior.",
         "Do not override browser keyboard chords when enabling shell shortcuts."
       ],
@@ -224,6 +227,7 @@
         "Below 768px the application root owns a 100dvh fixed stage with a 100vh fallback while ShellApp continues to fill its owner with height 100%; JavaScript viewport measurement synchronizes only the chrome wash and does not own layout height.",
         "With viewport-fit=cover, ShellApp consumes the shared top safe-area inset once and MobileBarNav consumes the persistent bottom inset; nested routed, tool, sheet, and consumer headers do not duplicate either inset.",
         "An optional Banner spans the complete application above desktop navigation, workspace, tools, and mobile global surfaces while remaining below the operating-system top safe area.",
+        "Desktop and tablet may render governed direct-action rail accessories. Mobile intentionally omits them, so applications provide equivalent persistent status in the top Banner lane when the product requires it.",
         "Switching breakpoints changes presentation and inert state without recreating route or tool elements.",
         "Switching sectionNavigation changes only desktop and tablet chrome; mobile composition, current route, routed content, and tool state remain stable.",
         "Search, Activity, Messages, and Agents use direct mobile destinations; products may explicitly group review tools under Inbox instead."

package/dist/agent.json

@@ -1,7 +1,7 @@
 {
   "schemaVersion": "1.0.0",
   "package": "@ds-mo/ui",
-  "packageVersion": "14.22.1",
+  "packageVersion": "14.23.0",
   "kind": "components",
   "entries": [
     {
@@ -5271,6 +5271,8 @@
           "Wheel, touch, keyboard navigation, selection, and transcript interaction release automatic following; Scroll to latest explicitly restores it.",
           "A newly appended outgoing Message marked scroll-anchor starts a turn near the top with the configurable previous-turn peek; mutations inside existing messages and prepended history do not re-anchor.",
           "Opening saved history, message jumps, and prepended history preserve deliberate position.",
+          "When a persistent scroller receives a cleared or wholly replaced transcript, it releases internal references to the previous message elements, invalidates their pending anchor work, and treats the replacement as a new baseline at defaultPosition rather than as an appended turn.",
+          "MessageScroller bounds its internal element tracking to the currently rendered transcript. The application still owns transcript data and must cap or window the rendered message collection when conversation history can grow without limit.",
           "The scroll-to-latest action is absent at the live edge, appears only after the reader moves away, and disappears again after returning to the newest message.",
           "Scroll to latest uses the shared md control-elevation wrapper with a pointer-transparent top highlight, preserving its transparent backdrop blur and borderless unfilled action while the press-scale modifier moves the complete elevated surface.",
           "Place a pending human-input surface in interaction and a composer container with 8px padding on every side in overlay; the shared scroll-overlay controller measures them as one stack, tracks every growth step, reserves matching transcript clearance, begins the fade before the stack, and keeps scroll-to-latest above it."
@@ -6780,23 +6782,25 @@
       "tag": "ds-panel-tools",
       "name": "panel-tools",
       "title": "PanelTools",
-      "summary": "Desktop and tablet utility rail-and-drawer primitive for explicitly defined application-wide tools, normally assembled by managed ShellApp through ShellTools.",
+      "summary": "Desktop and tablet utility rail-and-drawer primitive for explicitly defined application-wide tools and governed application-owned rail accessories, normally assembled by managed ShellApp through ShellTools.",
       "intentStatus": "complete",
       "intent": {
         "audience": "specialized",
         "status": "stable",
-        "summary": "Desktop and tablet utility rail-and-drawer primitive for explicitly defined application-wide tools, normally assembled by managed ShellApp through ShellTools.",
+        "summary": "Desktop and tablet utility rail-and-drawer primitive for explicitly defined application-wide tools and governed application-owned rail accessories, normally assembled by managed ShellApp through ShellTools.",
         "useWhen": [
           "An advanced slotted ShellApp needs the desktop and tablet global-tools primitive directly.",
           "Users need to move between application-wide utilities without losing each tool's in-progress state.",
-          "Search, AI conversations, user messages, review stacks, notifications, or help content must remain available alongside route content."
+          "Search, AI conversations, user messages, review stacks, notifications, or help content must remain available alongside route content.",
+          "A persistent desktop or tablet rail needs a generic direct-action status surface or shortcut that must not become a tool drawer."
         ],
         "avoidWhen": [
           "The action is specific to the current page or selected content rather than globally available across the application.",
           "The item navigates to a primary or secondary route; use PanelNav or BarNav instead.",
           "Tool definitions lack stable ids, visible labels, explicit rail placement, or application-owned view content.",
           "Building the mobile tools experience; use ShellTools or managed ShellApp.",
-          "PanelTools would be mounted outside the application's single ShellApp."
+          "PanelTools would be mounted outside the application's single ShellApp.",
+          "An application wants unrestricted rail markup that bypasses PanelTools ordering, geometry, focus, overflow, or action semantics."
         ],
         "alternatives": [
           {
@@ -6830,7 +6834,9 @@
           "When the shortcut rail overflows, its labeled body becomes a keyboard-focusable scroll region without changing the rail action order.",
           "Do not trigger global shortcuts while focus is in an editable control.",
           "Use notification dots only as supplemental unread or new-content status and never as the sole status indication.",
-          "Explain temporarily inactive tools through an accessible label or adjacent product guidance; omit unauthorized tools entirely."
+          "Explain temporarily inactive tools through an accessible label or adjacent product guidance; omit unauthorized tools entirely.",
+          "Give each interactive accessory a localized action label. Every transient surface requires short status text so its active or positive state is not color-only; shortcut notification dots remain supplemental and decorative accessory boundaries remain hidden from assistive technology.",
+          "Accessory primary and optional secondary actions participate in the same visual and roving keyboard order as tool actions."
         ],
         "states": [
           "Every tool has a stable explicit id and accessible label. The application filters definitions for authorization and entitlement.",
@@ -6848,6 +6854,11 @@
           "Tool view roots stay transparent so ShellApp's chrome wash remains visible; only explicitly designed child surfaces introduce a fill.",
           "Tools with search compose ds-panel-tool-search immediately below the shared header. Its 48px row always contains the md search control and must not be reduced to sm or xs.",
           "If an active optional tool becomes unavailable, PanelTools closes the drawer, clears activeTool, and emits its deselection.",
+          "Application-owned accessories are direct intents rather than tools. Activating one never selects a tool, changes activeTool, opens or closes the drawer, or changes mounted tool-view identity.",
+          "Accessory definitions use stable ids, explicit regions, and explicit order. The governed transient recipe is a 32px by 64px half-radius bold surface with 4px padding: a bordered 24px primary visual above an optional unbordered rounded 24px secondary icon action, separated by 8px. It requires accessible status text, supports active-brand or positive semantic tone, and never renders a notification dot.",
+          "The governed shortcut recipe is one standard-height action: a transparent 24px initial orb with a secondary token border centered in a 32px sizing frame, one or two caption-emphasis initials, an optional ds-badge notification dot aligned exactly with standard tool dots, circular hover and press paint, and no selected state or secondary control.",
+          "When transient status and shortcut groups coexist in one rail region, assign explicit orders that place the transient status first, then a decorative divider, then the shortcuts. Do not infer this grouping from application-specific ids.",
+          "Adding, removing, or reordering accessories preserves a surviving focused action when possible and moves focus to the nearest surviving rail action when the focused accessory is removed.",
           "Use isInactive only for a temporarily unavailable visible tool; omit tools the user is not authorized to access.",
           "Rail actions disable physical press scaling so notification-dot halos remain aligned to the shell gradient; hover and pressed washes continue to paint above the dot and halo.",
           "Rail tooltips are shell-owned and position against the viewport so the narrow tools-lane collision boundary cannot clamp them beyond the viewport edge.",
@@ -6860,22 +6871,23 @@
           "The open drawer reduces main-content width and uses --dimension-panel-width-xs (300px) on every supported desktop and tablet viewport.",
           "ShellApp owns the fixed drawer-width variable; consumers must not hardcode alternate drawer widths.",
           "Below 768px, do not reuse PanelTools directly; ShellTools and managed ShellApp present the same persistent tool owners through mobile chrome.",
+          "Rail accessories are intentionally desktop and tablet only. Consuming applications provide equivalent persistent mobile status through ShellApp's top banner or status region rather than converting an accessory into a tool view.",
           "Keep named-slot content mounted while tools switch or the drawer closes so users can return to in-progress global work.",
           "Conversation products may use fullscreenHeaderMode split for a 300px history rail beside a flexible detail pane, each with its own canonical header; the application owns that internal split layout.",
           "Use fixed drawer widths for now; do not add user resizing or width persistence."
         ],
         "frameworkCaveats": {
           "customElements": [
-            "Assign items and headers as JavaScript properties and replace their references when collections change.",
+            "Assign items, accessories, and headers as JavaScript properties and replace their references when collections change.",
             "Assign headers as a JavaScript property and replace its object identity whenever an active tool changes title, depth, or actions.",
             "Keep PanelTools mounted at ShellApp scope across route changes and provide each product through its matching named slot."
           ],
           "react": [
-            "Pass a stable explicitly ordered item collection through the generated React wrapper and keep named-slot product content mounted at ShellApp scope.",
+            "Pass stable explicitly ordered tool and accessory collections through the generated React wrapper and keep named-slot product content mounted at ShellApp scope.",
             "Use storageKey only for same-browser last-tool continuity; do not persist the open drawer."
           ],
           "angular": [
-            "Import DsPanelTools from @ds-mo/ui/angular/ds-panel-tools and bind items as a property.",
+            "Import DsPanelTools from @ds-mo/ui/angular/ds-panel-tools and bind structured tool and accessory collections as properties.",
             "Bind headers as a replaced object and route dsHeaderBack and dsHeaderAction to the active tool owner.",
             "Keep the component in the persistent shell layout rather than recreating it in routed page components."
           ]
@@ -6897,6 +6909,10 @@
       },
       "api": {
         "props": {
+          "accessories": {
+            "type": "PanelToolsRailAccessory[]",
+            "required": false
+          },
           "activeTool": {
             "type": "PanelToolsToolId | ''",
             "required": false
@@ -6955,6 +6971,10 @@
             "name": "dsPresentationChange",
             "detail": "{\n    presentation: 'drawer' | 'fullscreen';\n  }"
           },
+          {
+            "name": "dsRailAccessoryAction",
+            "detail": "PanelToolsRailAccessoryActionDetail"
+          },
           {
             "name": "dsToolChange",
             "detail": "{\n    id: PanelToolsToolId;\n    selected: boolean;\n  }"
@@ -6970,11 +6990,16 @@
       },
       "dependencies": [
         "@ds-mo/ui",
-        "@ds-mo/tokens"
+        "@ds-mo/tokens",
+        "@ds-mo/icons"
       ],
       "componentDependencies": [
+        "badge",
         "button-unfilled",
+        "divider",
+        "icon",
         "panel-tool-header",
+        "text",
         "tooltip"
       ]
     },
@@ -7677,6 +7702,8 @@
           "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.",
+          "Managed tools may include governed desktop and tablet rail accessories for transient status or direct shortcuts. ShellApp forwards their intents without changing the selected tool, drawer state, or mounted tool views.",
+          "Consuming applications own accessory state, labels, timers, permissions, navigation, and action consequences; ShellApp owns only managed forwarding and responsive placement.",
           "Use composition=slotted only for advanced application architectures that intentionally own all lower-level chrome wiring.",
           "Set gradientPreset to the single resolved global chrome preference: neutral by default, none for solid chrome, or cool, neutral, warm, and fresh for token-based washes.",
           "The application owns gradient preference persistence, cross-tab synchronization, and server or account precedence; ShellApp owns rendering the resolved preset across authenticated routes.",
@@ -7703,6 +7730,7 @@
           "When the application enables viewport-fit=cover, ShellApp reserves the shared top safe-area inset once for the complete mobile stage; nested routed, sheet, and tool headers must not add a second top inset.",
           "A slotted Banner remains below the top safe-area inset and above routed, navigation, fullscreen-tool, and mobile global-surface presentations.",
           "Mobile global surfaces conceal and inert the routed workspace without unmounting it, preserving nested routes and scroll state.",
+          "Managed rail accessories are intentionally omitted below 768px. Applications that need equivalent persistent mobile status provide it through the top banner or status region; ShellApp does not convert rail accessories into mobile tool views.",
           "Keep PanelNav width, BarNav height, PanelTools chrome, and main-content origin stable except during intentional responsive or collapse transitions.",
           "The routed content cell and tools cell expose separate anchored-overlay collision boundaries, so top-layer menus and tooltips remain above local clipping without crossing into neighboring shell lanes. Full-screen modal overlays remain viewport-owned.",
           "Paper texture chrome is desktop/tablet-only and follows the fixed viewport phase of the shell chrome; mobile remains a solid primary stage.",
@@ -7838,6 +7866,10 @@
             "name": "dsPresentationChange",
             "detail": "{ presentation: 'drawer' | 'fullscreen' }"
           },
+          {
+            "name": "dsRailAccessoryAction",
+            "detail": "PanelToolsRailAccessoryActionDetail"
+          },
           {
             "name": "dsResponsiveModeChange",
             "detail": "{ mode: ShellResponsiveMode }"
@@ -8087,21 +8119,24 @@
         "accessibility": [
           "Only the active mobile tool view participates in focus or the accessibility tree.",
           "Header Back and application-owned header actions preserve the PanelTools event contract.",
-          "A direct Activity destination renders its own named tool view; an explicitly grouped Inbox uses a named label-only TabGroup."
+          "A direct Activity destination renders its own named tool view; an explicitly grouped Inbox uses a named label-only TabGroup.",
+          "Desktop and tablet rail accessories retain PanelTools-owned labels, focus order, decorative-boundary semantics, and direct-action events."
         ],
         "states": [
           "The application owns open and activeTool and replaces headers when tool depth changes.",
           "Items with mobileDestination inbox map to one mobile Inbox destination while retaining the actual active tool id; the canonical recipe exposes Activity directly and keeps Inbox grouping opt-in.",
           "Stable tool ids own named slots; label, order, rail placement, shortcut, and mobile destination are explicit item data.",
+          "Application-owned rail accessories are forwarded unchanged to PanelTools on desktop and tablet and remain independent from activeTool and open.",
           "Switching responsive mode must not recreate application-owned slotted product elements."
         ],
         "responsiveBehavior": [
           "Desktop and tablet compose PanelTools-compatible rail and drawer chrome.",
-          "Mobile renders one centered MobileHeader for every direct tool; explicitly grouped Inbox tools use the large segmented section control."
+          "Mobile renders one centered MobileHeader for every direct tool; explicitly grouped Inbox tools use the large segmented section control.",
+          "Mobile intentionally omits desktop and tablet rail accessories instead of promoting them into tool views. Applications provide an equivalent persistent mobile status surface through ShellApp's top banner or status region."
         ],
         "frameworkCaveats": {
           "customElements": [
-            "Assign items and headers as JavaScript properties and place each persistent owner in its named *-view slot."
+            "Assign items, accessories, and headers as JavaScript properties and place each persistent owner in its named *-view slot."
           ],
           "react": [
             "Keep stable keyed product owner elements in the generated wrapper's named slots."
@@ -8123,6 +8158,10 @@
       },
       "api": {
         "props": {
+          "accessories": {
+            "type": "PanelToolsRailAccessory[]",
+            "required": false
+          },
           "activeTool": {
             "type": "PanelToolsToolId | ''",
             "required": false
@@ -8185,6 +8224,10 @@
             "name": "dsPresentationChange",
             "detail": "{\n    presentation: 'drawer' | 'fullscreen';\n  }"
           },
+          {
+            "name": "dsRailAccessoryAction",
+            "detail": "PanelToolsRailAccessoryActionDetail"
+          },
           {
             "name": "dsToolChange",
             "detail": "{\n    id: PanelToolsToolId;\n    selected: boolean;\n  }"

package/dist/angular/ds-panel-tools.d.ts

@@ -3,6 +3,7 @@ import type { Components } from '@ds-mo/ui/components';
 import type { DsPanelToolsCustomEvent } from '@ds-mo/ui/components';
 import type { PanelToolsToolId as IDsPanelToolsPanelToolsToolId } from '@ds-mo/ui/components';
 import type { PanelToolsHeaderActionDetail as IDsPanelToolsPanelToolsHeaderActionDetail } from '@ds-mo/ui/components';
+import type { PanelToolsRailAccessoryActionDetail as IDsPanelToolsPanelToolsRailAccessoryActionDetail } from '@ds-mo/ui/components';
 import type { ChromeTransitionDetail as IDsPanelToolsChromeTransitionDetail } from '@ds-mo/ui/components';
 import * as i0 from "@angular/core";
 export declare class DsPanelTools {
@@ -19,11 +20,12 @@ export declare class DsPanelTools {
         tool: IDsPanelToolsPanelToolsToolId;
     }>>;
     dsHeaderAction: EventEmitter<DsPanelToolsCustomEvent<IDsPanelToolsPanelToolsHeaderActionDetail>>;
+    dsRailAccessoryAction: EventEmitter<DsPanelToolsCustomEvent<IDsPanelToolsPanelToolsRailAccessoryActionDetail>>;
     dsChromeTransitionStart: EventEmitter<DsPanelToolsCustomEvent<IDsPanelToolsChromeTransitionDetail>>;
     dsChromeTransitionEnd: EventEmitter<DsPanelToolsCustomEvent<IDsPanelToolsChromeTransitionDetail>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<DsPanelTools, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DsPanelTools, "ds-panel-tools", never, { "activeTool": { "alias": "activeTool"; "required": false; }; "fullscreenHeaderMode": { "alias": "fullscreenHeaderMode"; "required": false; }; "headers": { "alias": "headers"; "required": false; }; "items": { "alias": "items"; "required": false; }; "open": { "alias": "open"; "required": false; }; "presentation": { "alias": "presentation"; "required": false; }; "storageKey": { "alias": "storageKey"; "required": false; }; "toolShortcutsLabel": { "alias": "toolShortcutsLabel"; "required": false; }; "toolsLabel": { "alias": "toolsLabel"; "required": false; }; }, { "dsToolChange": "dsToolChange"; "dsPresentationChange": "dsPresentationChange"; "dsHeaderBack": "dsHeaderBack"; "dsHeaderAction": "dsHeaderAction"; "dsChromeTransitionStart": "dsChromeTransitionStart"; "dsChromeTransitionEnd": "dsChromeTransitionEnd"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DsPanelTools, "ds-panel-tools", never, { "accessories": { "alias": "accessories"; "required": false; }; "activeTool": { "alias": "activeTool"; "required": false; }; "fullscreenHeaderMode": { "alias": "fullscreenHeaderMode"; "required": false; }; "headers": { "alias": "headers"; "required": false; }; "items": { "alias": "items"; "required": false; }; "open": { "alias": "open"; "required": false; }; "presentation": { "alias": "presentation"; "required": false; }; "storageKey": { "alias": "storageKey"; "required": false; }; "toolShortcutsLabel": { "alias": "toolShortcutsLabel"; "required": false; }; "toolsLabel": { "alias": "toolsLabel"; "required": false; }; }, { "dsToolChange": "dsToolChange"; "dsPresentationChange": "dsPresentationChange"; "dsHeaderBack": "dsHeaderBack"; "dsHeaderAction": "dsHeaderAction"; "dsRailAccessoryAction": "dsRailAccessoryAction"; "dsChromeTransitionStart": "dsChromeTransitionStart"; "dsChromeTransitionEnd": "dsChromeTransitionEnd"; }, never, ["*"], true, never>;
 }
 export declare interface DsPanelTools extends Components.DsPanelTools {
     /**
@@ -49,6 +51,10 @@ export declare interface DsPanelTools extends Components.DsPanelTools {
      * Requests one application-owned action from the active tool header.
      */
     dsHeaderAction: EventEmitter<DsPanelToolsCustomEvent<IDsPanelToolsPanelToolsHeaderActionDetail>>;
+    /**
+     * Direct accessory intent. Emitting this event never changes the active tool or drawer.
+     */
+    dsRailAccessoryAction: EventEmitter<DsPanelToolsCustomEvent<IDsPanelToolsPanelToolsRailAccessoryActionDetail>>;
     /**
      * Bubbling lifecycle — `ds-bar-nav` defers overflow checks during drawer motion.
      */

package/dist/angular/ds-panel-tools.js

@@ -17,18 +17,19 @@ let DsPanelTools = class DsPanelTools {
         this.dsPresentationChange = new EventEmitter();
         this.dsHeaderBack = new EventEmitter();
         this.dsHeaderAction = new EventEmitter();
+        this.dsRailAccessoryAction = new EventEmitter();
         this.dsChromeTransitionStart = new EventEmitter();
         this.dsChromeTransitionEnd = new EventEmitter();
         c.detach();
         this.el = r.nativeElement;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DsPanelTools, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.0", type: DsPanelTools, isStandalone: true, selector: "ds-panel-tools", inputs: { activeTool: "activeTool", fullscreenHeaderMode: "fullscreenHeaderMode", headers: "headers", items: "items", open: "open", presentation: "presentation", storageKey: "storageKey", toolShortcutsLabel: "toolShortcutsLabel", toolsLabel: "toolsLabel" }, outputs: { dsToolChange: "dsToolChange", dsPresentationChange: "dsPresentationChange", dsHeaderBack: "dsHeaderBack", dsHeaderAction: "dsHeaderAction", dsChromeTransitionStart: "dsChromeTransitionStart", dsChromeTransitionEnd: "dsChromeTransitionEnd" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.0", type: DsPanelTools, isStandalone: true, selector: "ds-panel-tools", inputs: { accessories: "accessories", activeTool: "activeTool", fullscreenHeaderMode: "fullscreenHeaderMode", headers: "headers", items: "items", open: "open", presentation: "presentation", storageKey: "storageKey", toolShortcutsLabel: "toolShortcutsLabel", toolsLabel: "toolsLabel" }, outputs: { dsToolChange: "dsToolChange", dsPresentationChange: "dsPresentationChange", dsHeaderBack: "dsHeaderBack", dsHeaderAction: "dsHeaderAction", dsRailAccessoryAction: "dsRailAccessoryAction", dsChromeTransitionStart: "dsChromeTransitionStart", dsChromeTransitionEnd: "dsChromeTransitionEnd" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 };
 DsPanelTools = __decorate([
     ProxyCmp({
         defineCustomElementFn: defineDsPanelTools,
-        inputs: ['activeTool', 'fullscreenHeaderMode', 'headers', 'items', 'open', 'presentation', 'storageKey', 'toolShortcutsLabel', 'toolsLabel'],
+        inputs: ['accessories', 'activeTool', 'fullscreenHeaderMode', 'headers', 'items', 'open', 'presentation', 'storageKey', 'toolShortcutsLabel', 'toolsLabel'],
         methods: ['activateTool', 'closeDrawer', 'focusHeaderAction']
     })
 ], DsPanelTools);
@@ -40,8 +41,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImpor
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                    inputs: ['activeTool', 'fullscreenHeaderMode', 'headers', 'items', 'open', 'presentation', 'storageKey', 'toolShortcutsLabel', 'toolsLabel'],
-                    outputs: ['dsToolChange', 'dsPresentationChange', 'dsHeaderBack', 'dsHeaderAction', 'dsChromeTransitionStart', 'dsChromeTransitionEnd'],
+                    inputs: ['accessories', 'activeTool', 'fullscreenHeaderMode', 'headers', 'items', 'open', 'presentation', 'storageKey', 'toolShortcutsLabel', 'toolsLabel'],
+                    outputs: ['dsToolChange', 'dsPresentationChange', 'dsHeaderBack', 'dsHeaderAction', 'dsRailAccessoryAction', 'dsChromeTransitionStart', 'dsChromeTransitionEnd'],
                 }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { dsToolChange: [{
                 type: Output
@@ -51,6 +52,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImpor
                 type: Output
             }], dsHeaderAction: [{
                 type: Output
+            }], dsRailAccessoryAction: [{
+                type: Output
             }], dsChromeTransitionStart: [{
                 type: Output
             }], dsChromeTransitionEnd: [{

package/dist/angular/ds-shell-app.d.ts

@@ -5,6 +5,7 @@ import type { ShellResponsiveMode as IDsShellAppShellResponsiveMode } from '@ds-
 import type { PanelNavChildSelectDetail as IDsShellAppPanelNavChildSelectDetail } from '@ds-mo/ui/components';
 import type { BreadcrumbSelectDetail as IDsShellAppBreadcrumbSelectDetail } from '@ds-mo/ui/components';
 import type { PanelToolsToolId as IDsShellAppPanelToolsToolId } from '@ds-mo/ui/components';
+import type { PanelToolsRailAccessoryActionDetail as IDsShellAppPanelToolsRailAccessoryActionDetail } from '@ds-mo/ui/components';
 import type { NavChromeStyle as IDsShellAppNavChromeStyle } from '@ds-mo/ui/components';
 import type { PanelNavUserActionDetail as IDsShellAppPanelNavUserActionDetail } from '@ds-mo/ui/components';
 import * as i0 from "@angular/core";
@@ -32,6 +33,7 @@ export declare class DsShellApp {
         tool: IDsShellAppPanelToolsToolId;
         id: string;
     }>>;
+    dsRailAccessoryAction: EventEmitter<DsShellAppCustomEvent<IDsShellAppPanelToolsRailAccessoryActionDetail>>;
     dsPresentationChange: EventEmitter<DsShellAppCustomEvent<{
         presentation: "drawer" | "fullscreen";
     }>>;
@@ -40,7 +42,7 @@ export declare class DsShellApp {
     dsNavUserAction: EventEmitter<DsShellAppCustomEvent<IDsShellAppPanelNavUserActionDetail>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<DsShellApp, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DsShellApp, "ds-shell-app", never, { "composition": { "alias": "composition"; "required": false; }; "gradientPreset": { "alias": "gradientPreset"; "required": false; }; "mobileDestination": { "alias": "mobileDestination"; "required": false; }; "mobileSheetNavOpen": { "alias": "mobileSheetNavOpen"; "required": false; }; "navStyle": { "alias": "navStyle"; "required": false; }; "navigation": { "alias": "navigation"; "required": false; }; "pageChrome": { "alias": "pageChrome"; "required": false; }; "paperTexture": { "alias": "paperTexture"; "required": false; }; "sectionNavigation": { "alias": "sectionNavigation"; "required": false; }; "shortcutsEnabled": { "alias": "shortcutsEnabled"; "required": false; }; "tools": { "alias": "tools"; "required": false; }; }, { "dsResponsiveModeChange": "dsResponsiveModeChange"; "dsNavSelect": "dsNavSelect"; "dsTabChange": "dsTabChange"; "dsNavChildSelect": "dsNavChildSelect"; "dsSubsectionChange": "dsSubsectionChange"; "dsPageBack": "dsPageBack"; "dsBreadcrumbSelect": "dsBreadcrumbSelect"; "dsPageAction": "dsPageAction"; "dsToolChange": "dsToolChange"; "dsHeaderBack": "dsHeaderBack"; "dsHeaderAction": "dsHeaderAction"; "dsPresentationChange": "dsPresentationChange"; "dsBrowseContextChange": "dsBrowseContextChange"; "dsNavFooterAction": "dsNavFooterAction"; "dsNavUserAction": "dsNavUserAction"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DsShellApp, "ds-shell-app", never, { "composition": { "alias": "composition"; "required": false; }; "gradientPreset": { "alias": "gradientPreset"; "required": false; }; "mobileDestination": { "alias": "mobileDestination"; "required": false; }; "mobileSheetNavOpen": { "alias": "mobileSheetNavOpen"; "required": false; }; "navStyle": { "alias": "navStyle"; "required": false; }; "navigation": { "alias": "navigation"; "required": false; }; "pageChrome": { "alias": "pageChrome"; "required": false; }; "paperTexture": { "alias": "paperTexture"; "required": false; }; "sectionNavigation": { "alias": "sectionNavigation"; "required": false; }; "shortcutsEnabled": { "alias": "shortcutsEnabled"; "required": false; }; "tools": { "alias": "tools"; "required": false; }; }, { "dsResponsiveModeChange": "dsResponsiveModeChange"; "dsNavSelect": "dsNavSelect"; "dsTabChange": "dsTabChange"; "dsNavChildSelect": "dsNavChildSelect"; "dsSubsectionChange": "dsSubsectionChange"; "dsPageBack": "dsPageBack"; "dsBreadcrumbSelect": "dsBreadcrumbSelect"; "dsPageAction": "dsPageAction"; "dsToolChange": "dsToolChange"; "dsHeaderBack": "dsHeaderBack"; "dsHeaderAction": "dsHeaderAction"; "dsRailAccessoryAction": "dsRailAccessoryAction"; "dsPresentationChange": "dsPresentationChange"; "dsBrowseContextChange": "dsBrowseContextChange"; "dsNavFooterAction": "dsNavFooterAction"; "dsNavUserAction": "dsNavUserAction"; }, never, ["*"], true, never>;
 }
 export declare interface DsShellApp extends Components.DsShellApp {
     /**
@@ -97,6 +99,10 @@ export declare interface DsShellApp extends Components.DsShellApp {
         tool: IDsShellAppPanelToolsToolId;
         id: string;
     }>>;
+    /**
+     * Managed desktop/tablet rail accessory intent.
+     */
+    dsRailAccessoryAction: EventEmitter<DsShellAppCustomEvent<IDsShellAppPanelToolsRailAccessoryActionDetail>>;
     /**
      * Managed drawer/fullscreen presentation state.
      */

package/dist/angular/ds-shell-app.js

@@ -24,6 +24,7 @@ let DsShellApp = class DsShellApp {
         this.dsToolChange = new EventEmitter();
         this.dsHeaderBack = new EventEmitter();
         this.dsHeaderAction = new EventEmitter();
+        this.dsRailAccessoryAction = new EventEmitter();
         this.dsPresentationChange = new EventEmitter();
         this.dsBrowseContextChange = new EventEmitter();
         this.dsNavFooterAction = new EventEmitter();
@@ -32,7 +33,7 @@ let DsShellApp = class DsShellApp {
         this.el = r.nativeElement;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DsShellApp, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.0", type: DsShellApp, isStandalone: true, selector: "ds-shell-app", inputs: { composition: "composition", gradientPreset: "gradientPreset", mobileDestination: "mobileDestination", mobileSheetNavOpen: "mobileSheetNavOpen", navStyle: "navStyle", navigation: "navigation", pageChrome: "pageChrome", paperTexture: "paperTexture", sectionNavigation: "sectionNavigation", shortcutsEnabled: "shortcutsEnabled", tools: "tools" }, outputs: { dsResponsiveModeChange: "dsResponsiveModeChange", dsNavSelect: "dsNavSelect", dsTabChange: "dsTabChange", dsNavChildSelect: "dsNavChildSelect", dsSubsectionChange: "dsSubsectionChange", dsPageBack: "dsPageBack", dsBreadcrumbSelect: "dsBreadcrumbSelect", dsPageAction: "dsPageAction", dsToolChange: "dsToolChange", dsHeaderBack: "dsHeaderBack", dsHeaderAction: "dsHeaderAction", dsPresentationChange: "dsPresentationChange", dsBrowseContextChange: "dsBrowseContextChange", dsNavFooterAction: "dsNavFooterAction", dsNavUserAction: "dsNavUserAction" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.0", type: DsShellApp, isStandalone: true, selector: "ds-shell-app", inputs: { composition: "composition", gradientPreset: "gradientPreset", mobileDestination: "mobileDestination", mobileSheetNavOpen: "mobileSheetNavOpen", navStyle: "navStyle", navigation: "navigation", pageChrome: "pageChrome", paperTexture: "paperTexture", sectionNavigation: "sectionNavigation", shortcutsEnabled: "shortcutsEnabled", tools: "tools" }, outputs: { dsResponsiveModeChange: "dsResponsiveModeChange", dsNavSelect: "dsNavSelect", dsTabChange: "dsTabChange", dsNavChildSelect: "dsNavChildSelect", dsSubsectionChange: "dsSubsectionChange", dsPageBack: "dsPageBack", dsBreadcrumbSelect: "dsBreadcrumbSelect", dsPageAction: "dsPageAction", dsToolChange: "dsToolChange", dsHeaderBack: "dsHeaderBack", dsHeaderAction: "dsHeaderAction", dsRailAccessoryAction: "dsRailAccessoryAction", dsPresentationChange: "dsPresentationChange", dsBrowseContextChange: "dsBrowseContextChange", dsNavFooterAction: "dsNavFooterAction", dsNavUserAction: "dsNavUserAction" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 };
 DsShellApp = __decorate([
     ProxyCmp({
@@ -50,7 +51,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImpor
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
                     inputs: ['composition', 'gradientPreset', 'mobileDestination', 'mobileSheetNavOpen', 'navStyle', 'navigation', 'pageChrome', 'paperTexture', 'sectionNavigation', 'shortcutsEnabled', 'tools'],
-                    outputs: ['dsResponsiveModeChange', 'dsNavSelect', 'dsTabChange', 'dsNavChildSelect', 'dsSubsectionChange', 'dsPageBack', 'dsBreadcrumbSelect', 'dsPageAction', 'dsToolChange', 'dsHeaderBack', 'dsHeaderAction', 'dsPresentationChange', 'dsBrowseContextChange', 'dsNavFooterAction', 'dsNavUserAction'],
+                    outputs: ['dsResponsiveModeChange', 'dsNavSelect', 'dsTabChange', 'dsNavChildSelect', 'dsSubsectionChange', 'dsPageBack', 'dsBreadcrumbSelect', 'dsPageAction', 'dsToolChange', 'dsHeaderBack', 'dsHeaderAction', 'dsRailAccessoryAction', 'dsPresentationChange', 'dsBrowseContextChange', 'dsNavFooterAction', 'dsNavUserAction'],
                 }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { dsResponsiveModeChange: [{
                 type: Output
@@ -74,6 +75,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImpor
                 type: Output
             }], dsHeaderAction: [{
                 type: Output
+            }], dsRailAccessoryAction: [{
+                type: Output
             }], dsPresentationChange: [{
                 type: Output
             }], dsBrowseContextChange: [{

package/dist/angular/ds-shell-tools.d.ts

@@ -2,6 +2,7 @@ import { ChangeDetectorRef, ElementRef, NgZone, EventEmitter } from '@angular/co
 import type { Components } from '@ds-mo/ui/components';
 import type { DsShellToolsCustomEvent } from '@ds-mo/ui/components';
 import type { PanelToolsToolId as IDsShellToolsPanelToolsToolId } from '@ds-mo/ui/components';
+import type { PanelToolsRailAccessoryActionDetail as IDsShellToolsPanelToolsRailAccessoryActionDetail } from '@ds-mo/ui/components';
 import * as i0 from "@angular/core";
 export declare class DsShellTools {
     protected z: NgZone;
@@ -20,9 +21,10 @@ export declare class DsShellTools {
         tool: IDsShellToolsPanelToolsToolId;
         id: string;
     }>>;
+    dsRailAccessoryAction: EventEmitter<DsShellToolsCustomEvent<IDsShellToolsPanelToolsRailAccessoryActionDetail>>;
     constructor(c: ChangeDetectorRef, r: ElementRef, z: NgZone);
     static ɵfac: i0.ɵɵFactoryDeclaration<DsShellTools, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DsShellTools, "ds-shell-tools", never, { "activeTool": { "alias": "activeTool"; "required": false; }; "fullscreenHeaderMode": { "alias": "fullscreenHeaderMode"; "required": false; }; "headers": { "alias": "headers"; "required": false; }; "inboxLabel": { "alias": "inboxLabel"; "required": false; }; "inboxNavigationLabel": { "alias": "inboxNavigationLabel"; "required": false; }; "items": { "alias": "items"; "required": false; }; "open": { "alias": "open"; "required": false; }; "presentation": { "alias": "presentation"; "required": false; }; "responsiveMode": { "alias": "responsiveMode"; "required": false; }; "storageKey": { "alias": "storageKey"; "required": false; }; "toolShortcutsLabel": { "alias": "toolShortcutsLabel"; "required": false; }; "toolsLabel": { "alias": "toolsLabel"; "required": false; }; }, { "dsToolChange": "dsToolChange"; "dsPresentationChange": "dsPresentationChange"; "dsHeaderBack": "dsHeaderBack"; "dsHeaderAction": "dsHeaderAction"; }, never, ["*"], true, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DsShellTools, "ds-shell-tools", never, { "accessories": { "alias": "accessories"; "required": false; }; "activeTool": { "alias": "activeTool"; "required": false; }; "fullscreenHeaderMode": { "alias": "fullscreenHeaderMode"; "required": false; }; "headers": { "alias": "headers"; "required": false; }; "inboxLabel": { "alias": "inboxLabel"; "required": false; }; "inboxNavigationLabel": { "alias": "inboxNavigationLabel"; "required": false; }; "items": { "alias": "items"; "required": false; }; "open": { "alias": "open"; "required": false; }; "presentation": { "alias": "presentation"; "required": false; }; "responsiveMode": { "alias": "responsiveMode"; "required": false; }; "storageKey": { "alias": "storageKey"; "required": false; }; "toolShortcutsLabel": { "alias": "toolShortcutsLabel"; "required": false; }; "toolsLabel": { "alias": "toolsLabel"; "required": false; }; }, { "dsToolChange": "dsToolChange"; "dsPresentationChange": "dsPresentationChange"; "dsHeaderBack": "dsHeaderBack"; "dsHeaderAction": "dsHeaderAction"; "dsRailAccessoryAction": "dsRailAccessoryAction"; }, never, ["*"], true, never>;
 }
 export declare interface DsShellTools extends Components.DsShellTools {
     dsToolChange: EventEmitter<DsShellToolsCustomEvent<{
@@ -39,4 +41,5 @@ export declare interface DsShellTools extends Components.DsShellTools {
         tool: IDsShellToolsPanelToolsToolId;
         id: string;
     }>>;
+    dsRailAccessoryAction: EventEmitter<DsShellToolsCustomEvent<IDsShellToolsPanelToolsRailAccessoryActionDetail>>;
 }

package/dist/angular/ds-shell-tools.js

@@ -17,16 +17,17 @@ let DsShellTools = class DsShellTools {
         this.dsPresentationChange = new EventEmitter();
         this.dsHeaderBack = new EventEmitter();
         this.dsHeaderAction = new EventEmitter();
+        this.dsRailAccessoryAction = new EventEmitter();
         c.detach();
         this.el = r.nativeElement;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.0", ngImport: i0, type: DsShellTools, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.0", type: DsShellTools, isStandalone: true, selector: "ds-shell-tools", inputs: { activeTool: "activeTool", fullscreenHeaderMode: "fullscreenHeaderMode", headers: "headers", inboxLabel: "inboxLabel", inboxNavigationLabel: "inboxNavigationLabel", items: "items", open: "open", presentation: "presentation", responsiveMode: "responsiveMode", storageKey: "storageKey", toolShortcutsLabel: "toolShortcutsLabel", toolsLabel: "toolsLabel" }, outputs: { dsToolChange: "dsToolChange", dsPresentationChange: "dsPresentationChange", dsHeaderBack: "dsHeaderBack", dsHeaderAction: "dsHeaderAction" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.0", type: DsShellTools, isStandalone: true, selector: "ds-shell-tools", inputs: { accessories: "accessories", activeTool: "activeTool", fullscreenHeaderMode: "fullscreenHeaderMode", headers: "headers", inboxLabel: "inboxLabel", inboxNavigationLabel: "inboxNavigationLabel", items: "items", open: "open", presentation: "presentation", responsiveMode: "responsiveMode", storageKey: "storageKey", toolShortcutsLabel: "toolShortcutsLabel", toolsLabel: "toolsLabel" }, outputs: { dsToolChange: "dsToolChange", dsPresentationChange: "dsPresentationChange", dsHeaderBack: "dsHeaderBack", dsHeaderAction: "dsHeaderAction", dsRailAccessoryAction: "dsRailAccessoryAction" }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 };
 DsShellTools = __decorate([
     ProxyCmp({
         defineCustomElementFn: defineDsShellTools,
-        inputs: ['activeTool', 'fullscreenHeaderMode', 'headers', 'inboxLabel', 'inboxNavigationLabel', 'items', 'open', 'presentation', 'responsiveMode', 'storageKey', 'toolShortcutsLabel', 'toolsLabel'],
+        inputs: ['accessories', 'activeTool', 'fullscreenHeaderMode', 'headers', 'inboxLabel', 'inboxNavigationLabel', 'items', 'open', 'presentation', 'responsiveMode', 'storageKey', 'toolShortcutsLabel', 'toolsLabel'],
         methods: ['activateTool', 'closeDrawer', 'focusHeaderAction']
     })
 ], DsShellTools);
@@ -38,8 +39,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImpor
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     template: '<ng-content></ng-content>',
                     // eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
-                    inputs: ['activeTool', 'fullscreenHeaderMode', 'headers', 'inboxLabel', 'inboxNavigationLabel', 'items', 'open', 'presentation', 'responsiveMode', 'storageKey', 'toolShortcutsLabel', 'toolsLabel'],
-                    outputs: ['dsToolChange', 'dsPresentationChange', 'dsHeaderBack', 'dsHeaderAction'],
+                    inputs: ['accessories', 'activeTool', 'fullscreenHeaderMode', 'headers', 'inboxLabel', 'inboxNavigationLabel', 'items', 'open', 'presentation', 'responsiveMode', 'storageKey', 'toolShortcutsLabel', 'toolsLabel'],
+                    outputs: ['dsToolChange', 'dsPresentationChange', 'dsHeaderBack', 'dsHeaderAction', 'dsRailAccessoryAction'],
                 }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { dsToolChange: [{
                 type: Output
@@ -49,4 +50,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.0", ngImpor
                 type: Output
             }], dsHeaderAction: [{
                 type: Output
+            }], dsRailAccessoryAction: [{
+                type: Output
             }] } });