@ds-mo/ui 14.23.0 → 14.25.0

package/dist/react/ds-button-filled.d.ts

@@ -8,5 +8,6 @@ import type { Components } from "@ds-mo/ui/dist/components";
 import { DsButtonFilled as DsButtonFilledElement } from "@ds-mo/ui/dist/components/ds-button-filled.js";
 export type DsButtonFilledEvents = {
     onDsClick: EventName<DsButtonFilledCustomEvent<MouseEvent>>;
+    onDsMenuClick: EventName<DsButtonFilledCustomEvent<MouseEvent>>;
 };
 export declare const DsButtonFilled: StencilReactComponent<DsButtonFilledElement, DsButtonFilledEvents, Components.DsButtonFilled>;

package/dist/react/ds-button-filled.js

@@ -7,6 +7,9 @@ export const DsButtonFilled = /*@__PURE__*/ createComponent({
     elementClass: DsButtonFilledElement,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
     react: React,
-    events: { onDsClick: 'dsClick' },
+    events: {
+        onDsClick: 'dsClick',
+        onDsMenuClick: 'dsMenuClick'
+    },
     defineCustomElement: defineDsButtonFilled
 });

package/dist/react/ds-button-unfilled.d.ts

@@ -8,6 +8,7 @@ import type { Components } from "@ds-mo/ui/dist/components";
 import { DsButtonUnfilled as DsButtonUnfilledElement } from "@ds-mo/ui/dist/components/ds-button-unfilled.js";
 export type DsButtonUnfilledEvents = {
     onDsClick: EventName<DsButtonUnfilledCustomEvent<MouseEvent>>;
+    onDsMenuClick: EventName<DsButtonUnfilledCustomEvent<MouseEvent>>;
     onDsChange: EventName<DsButtonUnfilledCustomEvent<boolean>>;
 };
 export declare const DsButtonUnfilled: StencilReactComponent<DsButtonUnfilledElement, DsButtonUnfilledEvents, Components.DsButtonUnfilled>;

package/dist/react/ds-button-unfilled.js

@@ -9,6 +9,7 @@ export const DsButtonUnfilled = /*@__PURE__*/ createComponent({
     react: React,
     events: {
         onDsClick: 'dsClick',
+        onDsMenuClick: 'dsMenuClick',
         onDsChange: 'dsChange'
     },
     defineCustomElement: defineDsButtonUnfilled

package/dist/styles/table.css

@@ -209,10 +209,22 @@
 }
 
 /* Bound style and layout invalidation to recycled row shells during window updates. */
-:where(.ds-table__table--virtual .ds-table__row) {
+:where(.ds-table__table--windowed .ds-table__row) {
   contain: layout style;
 }
 
+/*
+ * Pagination and infinite windows keep every loaded semantic row in the DOM.
+ * Let the browser skip off-screen row contents while retaining a stable scroll
+ * range from the same token-aligned row estimates used by virtual mode. The
+ * `auto` form caches each real height after the row has been laid out.
+ */
+:where(.ds-table__table--deferred-rows .ds-table__row) {
+  content-visibility: auto;
+  contain-intrinsic-block-size: auto
+    var(--_table-row-intrinsic-block-size, var(--_table-row-min-block-size));
+}
+
 :where(.ds-table__table--native-group-sticky .ds-table__header-row),
 :where(.ds-table__table--native-group-sticky .ds-table__row),
 :where(.ds-table__table--native-group-sticky .ds-table__skeleton-row) {

package/dist/types/components/BarTitle/BarTitle.d.ts

@@ -1,6 +1,6 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import type { BreadcrumbItem, BreadcrumbSelectDetail } from '../Breadcrumb/breadcrumb-types';
-import { type BarTitleActionItem, type BarTitlePrimaryAction, type BarTitleSectionItem, type BarTitlePlacement, type BarTitleVariant } from './bar-title-types';
+import { type BarTitleActionConfigItem, type BarTitleActionItem, type BarTitlePrimaryAction, type BarTitleSectionItem, type BarTitlePlacement, type BarTitleVariant } from './bar-title-types';
 export declare class BarTitle {
     el: HTMLElement;
     /** The page's single visible h1. */
@@ -27,6 +27,11 @@ export declare class BarTitle {
     primaryAction: BarTitlePrimaryAction | null;
     /** Secondary page actions shown in the overflow menu. Dividers create groups. */
     actions: BarTitleActionItem[];
+    /**
+     * Ordered page-header actions. When supplied, this replaces the legacy
+     * primaryAction/actions presentation while preserving the same dsAction event.
+     */
+    actionItems?: BarTitleActionConfigItem[];
     /** Accessible name for the page-actions menu. */
     actionsAriaLabel: string;
     /** Explicit visual/capacity variant. ShellPage owns automatic selection. */
@@ -46,7 +51,7 @@ export declare class BarTitle {
     /** Emitted with the activated primary or overflow action id. */
     dsAction: EventEmitter<string>;
     private sectionMenuOpen;
-    private actionMenuOpen;
+    private openActionMenuId;
     private sectionMenuInitialFocusVisible;
     private actionMenuInitialFocusVisible;
     private readonly instanceId;
@@ -56,9 +61,11 @@ export declare class BarTitle {
     private readonly actionMenuId;
     private sectionTriggerEl;
     private actionTriggerEl;
+    private actionTriggerEls;
     componentWillLoad(): void;
     handleSectionsChange(): void;
     handleActionsChange(): void;
+    private reportActionIdIssues;
     private get compact();
     private get effectiveVariant();
     private get dividerVisible();
@@ -71,12 +78,16 @@ export declare class BarTitle {
     private get effectiveValue();
     private get selectedSectionLabel();
     private get sectionTriggerAriaLabel();
-    private groupsFromItems;
+    private groupsFromSections;
     private get sectionMenuSections();
-    private get selectableActions();
-    private get showActionMenuTrigger();
-    private actionMenuItem;
+    private get resolvedActionItems();
+    private get visibleActions();
     private get actionMenuSections();
+    private get showActionMenuTrigger();
+    private get availableActionMenuIds();
+    private actionMenuDomId;
+    private actionMenuAnchor;
+    private menuSectionsForAction;
     private toggleSectionMenu;
     private closeSectionMenu;
     private handleSectionSelect;
@@ -84,7 +95,9 @@ export declare class BarTitle {
     private closeActionMenu;
     private handleActionSelect;
     private renderSectionSelector;
+    private renderVisibleAction;
     private renderActions;
+    private renderActionMenus;
     private handleBreadcrumbSelect;
     private renderBreadcrumb;
     private renderBack;

package/dist/types/components/BarTitle/bar-title-actions.d.ts

@@ -0,0 +1,11 @@
+import type { MenuSection } from '../Menu/menu-types';
+import type { BarTitleAction, BarTitleActionConfigItem, BarTitleActionItem, BarTitleDivider, BarTitleMenuChoiceItem, BarTitlePrimaryAction, BarTitleVariant } from './bar-title-types';
+export type BarTitleActionPresentation = BarTitleVariant | 'mobile';
+export declare function isBarTitleActionDivider(item: BarTitleActionConfigItem | BarTitleMenuChoiceItem): item is BarTitleDivider;
+export declare function resolveBarTitleActionItems(actionItems: BarTitleActionConfigItem[] | undefined, primaryAction: BarTitlePrimaryAction | null, actions: BarTitleActionItem[]): BarTitleActionConfigItem[];
+export declare function barTitleActionIdIssues(items: BarTitleActionConfigItem[]): string[];
+export declare function visibleBarTitleActions(items: BarTitleActionConfigItem[], presentation: BarTitleActionPresentation): BarTitleActionConfigItem[];
+export declare function barTitleChoiceSections(choices: BarTitleMenuChoiceItem[]): MenuSection[];
+export declare function overflowBarTitleActionSections(items: BarTitleActionConfigItem[], presentation: BarTitleActionPresentation): MenuSection[];
+export declare function findBarTitleAction(items: BarTitleActionConfigItem[], id: string): BarTitleAction | undefined;
+//# sourceMappingURL=bar-title-actions.d.ts.map

package/dist/types/components/BarTitle/bar-title-types.d.ts

@@ -11,11 +11,12 @@ export type BarTitleSectionItem = BarTitleSection | BarTitleDivider;
 export interface BarTitleAction {
     id: string;
     label: string;
+    ariaLabel?: string;
+    icon?: string;
     isInactive?: boolean;
     isDestructive?: boolean;
 }
 export interface BarTitlePrimaryAction extends BarTitleAction {
-    icon?: string;
     intent?: ButtonFilledIntent;
     contrast?: ButtonFilledContrast;
     isLoading?: boolean;
@@ -23,8 +24,60 @@ export interface BarTitlePrimaryAction extends BarTitleAction {
     collapse?: BarTitlePrimaryActionCollapse;
 }
 export type BarTitleActionItem = BarTitleAction | BarTitleDivider;
+export type BarTitleActionAppearance = 'filled' | 'unfilled';
+export type BarTitleActionCollapse = 'auto' | 'never';
+export type BarTitleActionMobile = 'auto' | 'visible' | 'overflow';
+interface BarTitleVisibleActionBase extends BarTitleAction {
+    appearance?: BarTitleActionAppearance;
+    intent?: ButtonFilledIntent;
+    contrast?: ButtonFilledContrast;
+    isLoading?: boolean;
+    buttonType?: 'button' | 'submit' | 'reset';
+    /** Auto moves the action into overflow only in constrained presentation. */
+    collapse?: BarTitleActionCollapse;
+    /**
+     * Mobile defaults icon actions to visible and all labeled actions to overflow.
+     * `visible` is supported only by icon actions.
+     */
+    mobile?: BarTitleActionMobile;
+}
+/** Visible labeled command in the authored action order. */
+export interface BarTitleButtonAction extends BarTitleVisibleActionBase {
+    type: 'button';
+}
+/** Visible icon-only command. ariaLabel is required because label is not rendered. */
+export interface BarTitleIconAction extends BarTitleVisibleActionBase {
+    type: 'icon';
+    icon: string;
+    ariaLabel: string;
+}
+export type BarTitleMenuChoice = BarTitleAction;
+export type BarTitleMenuChoiceItem = BarTitleMenuChoice | BarTitleDivider;
+/** Visible labeled menu button. Selecting a choice emits that choice's flat id. */
+export interface BarTitleMenuAction extends BarTitleVisibleActionBase {
+    type: 'menu';
+    choices: BarTitleMenuChoiceItem[];
+    menuAriaLabel?: string;
+}
+/** Command with a dedicated menu segment; defaults filled when appearance is omitted. */
+export interface BarTitleSplitAction extends BarTitleVisibleActionBase {
+    type: 'split';
+    choices: BarTitleMenuChoiceItem[];
+    menuAriaLabel: string;
+}
+/** Command that is always presented in the shared overflow menu. */
+export interface BarTitleOverflowAction extends BarTitleAction {
+    type: 'overflow';
+}
+/**
+ * Ordered page-header action model. IDs must be non-empty and unique across
+ * top-level actions and every nested menu choice. At most the first eligible
+ * action renders beside the title; remaining actions use the text-only overflow.
+ */
+export type BarTitleActionConfigItem = BarTitleButtonAction | BarTitleIconAction | BarTitleMenuAction | BarTitleSplitAction | BarTitleOverflowAction | BarTitleDivider;
 export type BarTitleVariant = 'expanded' | 'compact' | 'constrained';
 export type BarTitlePlacement = 'page' | 'shell-bar';
 export type BarTitlePrimaryActionCollapse = 'auto' | 'never';
 export declare function isBarTitleDivider(item: BarTitleSectionItem | BarTitleActionItem): item is BarTitleDivider;
+export {};
 //# sourceMappingURL=bar-title-types.d.ts.map

package/dist/types/components/BarTitle/index.d.ts

@@ -1,2 +1,2 @@
-export type { BarTitleAction, BarTitleActionItem, BarTitleDivider, BarTitlePrimaryActionCollapse, BarTitlePrimaryAction, BarTitleSection, BarTitleSectionItem, BarTitlePlacement, BarTitleVariant, } from './bar-title-types';
+export type { BarTitleAction, BarTitleActionAppearance, BarTitleActionCollapse, BarTitleActionConfigItem, BarTitleActionItem, BarTitleActionMobile, BarTitleButtonAction, BarTitleDivider, BarTitleIconAction, BarTitleMenuAction, BarTitleMenuChoice, BarTitleMenuChoiceItem, BarTitleOverflowAction, BarTitlePrimaryActionCollapse, BarTitlePrimaryAction, BarTitleSection, BarTitleSectionItem, BarTitleSplitAction, BarTitlePlacement, BarTitleVariant, } from './bar-title-types';
 //# sourceMappingURL=index.d.ts.map

package/dist/types/components/ButtonFilled/ButtonFilled.d.ts

@@ -69,6 +69,13 @@ export declare class ButtonFilled {
     expanded: boolean | undefined;
     /** Popup type exposed to assistive technology. */
     haspopup: ButtonFilledPopup | undefined;
+    /**
+     * Append a separate ChevronDown menu segment while preserving this button's
+     * variant, size, intent, contrast, loading, inactive, and width treatment.
+     */
+    split: boolean;
+    /** Accessible name for the appended menu segment in split mode. */
+    menuAriaLabel: string;
     /**
      * This action *has* a menu: implies `aria-haspopup="menu"` and adds the trailing
      * chevron that carries the affordance.
@@ -81,12 +88,16 @@ export declare class ButtonFilled {
      */
     hasMenu: boolean;
     dsClick: EventEmitter<MouseEvent>;
+    dsMenuClick: EventEmitter<MouseEvent>;
     private buttonEl;
-    setFocus(): Promise<void>;
+    private menuButtonEl;
+    setFocus(segment?: 'primary' | 'menu'): Promise<void>;
     private handleClick;
+    private handleMenuClick;
     private get resolvedHaspopup();
     private get accessibleName();
     private get doubleInset();
+    private buttonClass;
     render(): any;
 }
 //# sourceMappingURL=ButtonFilled.d.ts.map

package/dist/types/components/ButtonUnfilled/ButtonUnfilled.d.ts

@@ -67,6 +67,13 @@ export declare class ButtonUnfilled {
      */
     expanded: boolean | undefined;
     haspopup: ButtonUnfilledPopup | undefined;
+    /**
+     * Append a separate ChevronDown menu segment while preserving this button's
+     * variant, size, surface, active, loading, border, and width treatment.
+     */
+    split: boolean;
+    /** Accessible name for the appended menu segment in split mode. */
+    menuAriaLabel: string;
     /**
      * Controlled state for a genuine toggle button. Adds aria-pressed, promotes
      * active styling, and makes activation emit dsChange with the requested state.
@@ -98,17 +105,20 @@ export declare class ButtonUnfilled {
      */
     focusTabIndex?: number;
     dsClick: EventEmitter<MouseEvent>;
+    dsMenuClick: EventEmitter<MouseEvent>;
     dsChange: EventEmitter<boolean>;
     private captionCompact;
     private buttonEl;
+    private menuButtonEl;
     private captionCompactDisconnect;
     private hasLoaded;
     componentDidLoad(): void;
     connectedCallback(): void;
     disconnectedCallback(): void;
     onCollapseLabelChange(): void;
-    setFocus(): Promise<void>;
+    setFocus(segment?: 'primary' | 'menu'): Promise<void>;
     private handleClick;
+    private handleMenuClick;
     private get captionIconOnly();
     private get visualVariant();
     private get showDot();
@@ -122,6 +132,7 @@ export declare class ButtonUnfilled {
     /** Knock-out ring: selected fill → active wash; otherwise surface token. */
     private get dotRing();
     private get accessibleName();
+    private buttonClass;
     render(): any;
 }
 //# sourceMappingURL=ButtonUnfilled.d.ts.map

package/dist/types/components/ShellApp/ShellApp.d.ts

@@ -89,6 +89,12 @@ export declare class ShellApp {
     private managedMobileSheetNavOpen;
     private managedInboxTool;
     private managedBrowseContext;
+    private mobileActionMenuOpen;
+    private mobileActionMenuInitialFocusVisible;
+    private readonly instanceId;
+    private readonly mobileActionMenuTriggerId;
+    private readonly mobileActionMenuId;
+    private mobileActionTriggerEl;
     private resizeObserver;
     private hasLoaded;
     private foregroundRefreshTimer;
@@ -114,6 +120,7 @@ export declare class ShellApp {
     disconnectedCallback(): void;
     onShellPropsChange(): void;
     handleNavigationChange(): void;
+    handlePageChromeChange(): void;
     handleToolsChange(): void;
     onMobileStateChange(_next: unknown, previous: unknown): void;
     private updateResponsiveMode;
@@ -184,6 +191,11 @@ export declare class ShellApp {
     private renderManagedMobileBarNav;
     private renderManagedMobileLeading;
     private renderManagedMobileActions;
+    private get resolvedHeaderActions();
+    private get mobileActionMenuSections();
+    private closeMobileActionMenu;
+    private handleMobileActionSelect;
+    private renderManagedMobileActionMenu;
     private get barTitleSections();
     private renderManagedBarTitle;
     private renderManagedPage;

package/dist/types/components/ShellApp/shell-app-types.d.ts

@@ -1,5 +1,5 @@
 import type { BarNavTab } from '../BarNav/bar-nav-types';
-import type { BarTitleActionItem, BarTitlePrimaryAction } from '../BarTitle/bar-title-types';
+import type { BarTitleActionConfigItem, BarTitleActionItem, BarTitlePrimaryAction } from '../BarTitle/bar-title-types';
 import type { BreadcrumbItem } from '../Breadcrumb/breadcrumb-types';
 import type { MobileHeaderTone } from '../MobileHeader/mobile-header-types';
 import type { PanelNavGroup, PanelNavItem, PanelNavRouterMode } from '../PanelNav/panel-nav-types';
@@ -67,6 +67,8 @@ export interface ShellPageChromeConfig {
     breadcrumbAriaLabel?: string;
     primaryAction?: BarTitlePrimaryAction | null;
     actions?: BarTitleActionItem[];
+    /** Ordered desktop, tablet, and mobile page-action model. */
+    actionItems?: BarTitleActionConfigItem[];
     /** Icon actions rendered in the mobile header's trailing lane. */
     mobileActions?: PanelToolsHeaderAction[];
     actionsAriaLabel?: string;

package/dist/types/components/Table/Table.d.ts

@@ -230,13 +230,13 @@ export declare class Table {
     private currentLoadedRowCount;
     private createRenderModel;
     private get highlightMatcher();
-    private get virtualizationEnabled();
+    private get rowWindowingEnabled();
     private get virtualViewportMissing();
     private get hasVirtualViewportBounds();
     private estimateVirtualViewportSize;
     private virtualPinnedRowIds;
     private syncVirtualItems;
-    private shouldVirtualize;
+    private shouldWindowRows;
     private get resolvedMaxHeight();
     private get resolvedHeight();
     private warnModelIssues;

package/dist/types/components/Table/table-row-view.d.ts

@@ -15,6 +15,7 @@ export interface TableRowViewOptions {
     highlightFieldIds: string[];
     ariaRowIndex?: number;
     variableVirtualSize?: boolean;
+    intrinsicBlockSize?: number;
     rowKey?: string;
     renderSelectionControl: (label: string, checked: boolean, indeterminate: boolean, disabled: boolean, onActivate: () => void) => unknown;
     renderStickyEdge: (sticky: TableColumn['sticky']) => unknown;
@@ -25,5 +26,5 @@ export interface TableRowViewOptions {
     onActionMenuToggle: (row: TableRow, column: TableColumn, event: MouseEvent) => void;
 }
 /** Render one semantic body row and the complete declarative table-cell vocabulary. */
-export declare function renderTableRow({ row, model, visibleColumns, emptyCellLabel, actionMenuElementId, actionMenu, highlightMatcher, highlightFieldIds, ariaRowIndex, variableVirtualSize, rowKey, renderSelectionControl, renderStickyEdge, onRowActivate, onRowKeyDown, onRowSelection, onCellAction, onActionMenuToggle, }: TableRowViewOptions): any;
+export declare function renderTableRow({ row, model, visibleColumns, emptyCellLabel, actionMenuElementId, actionMenu, highlightMatcher, highlightFieldIds, ariaRowIndex, variableVirtualSize, intrinsicBlockSize, rowKey, renderSelectionControl, renderStickyEdge, onRowActivate, onRowKeyDown, onRowSelection, onCellAction, onActionMenuToggle, }: TableRowViewOptions): any;
 //# sourceMappingURL=table-row-view.d.ts.map

package/dist/types/components.d.ts

@@ -13,7 +13,7 @@ import { BannerAnnouncement, BannerContrast, BannerIntent, BannerOrientation } f
 import { NavChromeStyle } from "./shell/nav-chrome";
 import { BarNavTab } from "./components/BarNav/bar-nav-types";
 import { BreadcrumbItem, BreadcrumbSelectDetail } from "./components/Breadcrumb/breadcrumb-types";
-import { BarTitleActionItem, BarTitlePlacement, BarTitlePrimaryAction, BarTitleSectionItem, BarTitleVariant } from "./components/BarTitle/bar-title-types";
+import { BarTitleActionConfigItem, BarTitleActionItem, BarTitlePlacement, BarTitlePrimaryAction, BarTitleSectionItem, BarTitleVariant } from "./components/BarTitle/bar-title-types";
 import { BarWorkflowStep, BarWorkflowSubmitAction } from "./components/BarWorkflow/bar-workflow-types";
 import { MobileDestination, ShellResponsiveMode } from "./shell/shell-responsive";
 import { ButtonFilledBackground, ButtonFilledContrast, ButtonFilledIntent, ButtonFilledPopup, ButtonFilledSize, ButtonFilledVariant, ButtonFilledWidth } from "./components/ButtonFilled/ButtonFilled";
@@ -83,7 +83,7 @@ export { BannerAnnouncement, BannerContrast, BannerIntent, BannerOrientation } f
 export { NavChromeStyle } from "./shell/nav-chrome";
 export { BarNavTab } from "./components/BarNav/bar-nav-types";
 export { BreadcrumbItem, BreadcrumbSelectDetail } from "./components/Breadcrumb/breadcrumb-types";
-export { BarTitleActionItem, BarTitlePlacement, BarTitlePrimaryAction, BarTitleSectionItem, BarTitleVariant } from "./components/BarTitle/bar-title-types";
+export { BarTitleActionConfigItem, BarTitleActionItem, BarTitlePlacement, BarTitlePrimaryAction, BarTitleSectionItem, BarTitleVariant } from "./components/BarTitle/bar-title-types";
 export { BarWorkflowStep, BarWorkflowSubmitAction } from "./components/BarWorkflow/bar-workflow-types";
 export { MobileDestination, ShellResponsiveMode } from "./shell/shell-responsive";
 export { ButtonFilledBackground, ButtonFilledContrast, ButtonFilledIntent, ButtonFilledPopup, ButtonFilledSize, ButtonFilledVariant, ButtonFilledWidth } from "./components/ButtonFilled/ButtonFilled";
@@ -420,6 +420,10 @@ export namespace Components {
         "value": string;
     }
     interface DsBarTitle {
+        /**
+          * Ordered page-header actions. When supplied, this replaces the legacy primaryAction/actions presentation while preserving the same dsAction event.
+         */
+        "actionItems"?: BarTitleActionConfigItem[];
         /**
           * Secondary page actions shown in the overflow menu. Dividers create groups.
           * @default []
@@ -644,6 +648,11 @@ export namespace Components {
           * @default true
          */
         "labelEmphasis": boolean;
+        /**
+          * Accessible name for the appended menu segment in split mode.
+          * @default 'More options'
+         */
+        "menuAriaLabel": string;
         /**
           * Scale down during a physical pointer press. Disable when an owning composite requires fixed child or background geometry.
           * @default true
@@ -654,12 +663,17 @@ export namespace Components {
           * @default false
          */
         "rounded": boolean;
-        "setFocus": () => Promise<void>;
+        "setFocus": (segment?: "primary" | "menu") => Promise<void>;
         /**
           * Control density (height, padding, icon, type).
           * @default 'md'
          */
         "size": ButtonFilledSize;
+        /**
+          * Append a separate ChevronDown menu segment while preserving this button's variant, size, intent, contrast, loading, inactive, and width treatment.
+          * @default false
+         */
+        "split": boolean;
         /**
           * Native button type.
           * @default 'button'
@@ -761,6 +775,11 @@ export namespace Components {
           * @default true
          */
         "labelEmphasis": boolean;
+        /**
+          * Accessible name for the appended menu segment in split mode.
+          * @default 'More options'
+         */
+        "menuAriaLabel": string;
         /**
           * Scale down during a physical pointer press. Disable when an owning composite requires fixed child or background geometry.
           * @default true
@@ -775,12 +794,17 @@ export namespace Components {
           * @default false
          */
         "rounded": boolean;
-        "setFocus": () => Promise<void>;
+        "setFocus": (segment?: "primary" | "menu") => Promise<void>;
         /**
           * Control density (height, padding, icon, type).
           * @default 'md'
          */
         "size": ButtonUnfilledSize;
+        /**
+          * Append a separate ChevronDown menu segment while preserving this button's variant, size, surface, active, loading, border, and width treatment.
+          * @default false
+         */
+        "split": boolean;
         /**
           * Native button type.
           * @default 'button'
@@ -4166,6 +4190,7 @@ declare global {
     };
     interface HTMLDsButtonFilledElementEventMap {
         "dsClick": MouseEvent;
+        "dsMenuClick": MouseEvent;
     }
     interface HTMLDsButtonFilledElement extends Components.DsButtonFilled, HTMLStencilElement {
         addEventListener<K extends keyof HTMLDsButtonFilledElementEventMap>(type: K, listener: (this: HTMLDsButtonFilledElement, ev: DsButtonFilledCustomEvent<HTMLDsButtonFilledElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -4183,6 +4208,7 @@ declare global {
     };
     interface HTMLDsButtonUnfilledElementEventMap {
         "dsClick": MouseEvent;
+        "dsMenuClick": MouseEvent;
         "dsChange": boolean;
     }
     interface HTMLDsButtonUnfilledElement extends Components.DsButtonUnfilled, HTMLStencilElement {
@@ -5543,6 +5569,10 @@ declare namespace LocalJSX {
         "value"?: string;
     }
     interface DsBarTitle {
+        /**
+          * Ordered page-header actions. When supplied, this replaces the legacy primaryAction/actions presentation while preserving the same dsAction event.
+         */
+        "actionItems"?: BarTitleActionConfigItem[];
         /**
           * Secondary page actions shown in the overflow menu. Dividers create groups.
           * @default []
@@ -5799,7 +5829,13 @@ declare namespace LocalJSX {
           * @default true
          */
         "labelEmphasis"?: boolean;
+        /**
+          * Accessible name for the appended menu segment in split mode.
+          * @default 'More options'
+         */
+        "menuAriaLabel"?: string;
         "onDsClick"?: (event: DsButtonFilledCustomEvent<MouseEvent>) => void;
+        "onDsMenuClick"?: (event: DsButtonFilledCustomEvent<MouseEvent>) => void;
         /**
           * Scale down during a physical pointer press. Disable when an owning composite requires fixed child or background geometry.
           * @default true
@@ -5815,6 +5851,11 @@ declare namespace LocalJSX {
           * @default 'md'
          */
         "size"?: ButtonFilledSize;
+        /**
+          * Append a separate ChevronDown menu segment while preserving this button's variant, size, intent, contrast, loading, inactive, and width treatment.
+          * @default false
+         */
+        "split"?: boolean;
         /**
           * Native button type.
           * @default 'button'
@@ -5916,8 +5957,14 @@ declare namespace LocalJSX {
           * @default true
          */
         "labelEmphasis"?: boolean;
+        /**
+          * Accessible name for the appended menu segment in split mode.
+          * @default 'More options'
+         */
+        "menuAriaLabel"?: string;
         "onDsChange"?: (event: DsButtonUnfilledCustomEvent<boolean>) => void;
         "onDsClick"?: (event: DsButtonUnfilledCustomEvent<MouseEvent>) => void;
+        "onDsMenuClick"?: (event: DsButtonUnfilledCustomEvent<MouseEvent>) => void;
         /**
           * Scale down during a physical pointer press. Disable when an owning composite requires fixed child or background geometry.
           * @default true
@@ -5937,6 +5984,11 @@ declare namespace LocalJSX {
           * @default 'md'
          */
         "size"?: ButtonUnfilledSize;
+        /**
+          * Append a separate ChevronDown menu segment while preserving this button's variant, size, surface, active, loading, border, and width treatment.
+          * @default false
+         */
+        "split"?: boolean;
         /**
           * Native button type.
           * @default 'button'
@@ -9355,6 +9407,8 @@ declare namespace LocalJSX {
         "controls": string | undefined;
         "expanded": boolean | undefined;
         "haspopup": ButtonFilledPopup | undefined;
+        "split": boolean;
+        "menuAriaLabel": string;
         "hasMenu": boolean;
     }
     interface DsButtonUnfilledAttributes {
@@ -9380,6 +9434,8 @@ declare namespace LocalJSX {
         "controls": string | undefined;
         "expanded": boolean | undefined;
         "haspopup": ButtonUnfilledPopup | undefined;
+        "split": boolean;
+        "menuAriaLabel": string;
         "pressed": boolean | undefined;
         "collapseLabel": boolean;
         "hasMenu": boolean;

package/dist/types/shell/index.d.ts

@@ -1,6 +1,7 @@
 export type { NavChromeStyle } from './nav-chrome';
 export type { PanelNavChildItem, PanelNavChildSelectDetail, PanelNavGroup, PanelNavItem, PanelNavPresentation, } from '../components/PanelNav/panel-nav-types';
 export type { BarNavTab } from '../components/BarNav/bar-nav-types';
+export type { BarTitleAction, BarTitleActionAppearance, BarTitleActionCollapse, BarTitleActionConfigItem, BarTitleActionItem, BarTitleActionMobile, BarTitleButtonAction, BarTitleDivider, BarTitleIconAction, BarTitleMenuAction, BarTitleMenuChoice, BarTitleMenuChoiceItem, BarTitleOverflowAction, BarTitlePrimaryAction, BarTitleSplitAction, } from '../components/BarTitle/bar-title-types';
 export type { ShellPageContentInset, ShellPageContentSurface, ShellPageDesktopHeaderPlacement, } from '../components/ShellPage/shell-page-types';
 export type { ShellAppComposition, ShellNavigationConfig, ShellNavigationSelectDetail, ShellPageChromeConfig, ShellSectionNavigation, ShellToolsConfig, } from '../components/ShellApp/shell-app-types';
 export type { PanelToolsHeaderAction, PanelToolsHeaderActionDetail, PanelToolHeaderActionDetail, PanelToolsHeaderConfig, PanelToolsHeaders, PanelToolsItem, PanelToolsRailAccessory, PanelToolsRailAccessoryAction, PanelToolsRailAccessoryActionDetail, PanelToolsRailAccessorySecondaryAction, PanelToolsRailAccessoryVisual, PanelToolsRailDividerAccessory, PanelToolsRailPlacement, PanelToolsRailShortcutAccessory, PanelToolsRailTransientAccessory, PanelToolsRailTransientTone, PanelToolsToolId, } from '../components/PanelTools/panel-tools-types';

package/dist/types/utils/button-story-foundation.d.ts

@@ -6,4 +6,6 @@ export declare const BUTTON_STORY_COLUMN = "display:flex;flex-direction:column;g
 export declare const BUTTON_STORY_SURFACE = "display:flex;gap:var(--dimension-space-100);align-items:center;padding:var(--dimension-space-150);border-radius:var(--dimension-radius-100);";
 /** Shared Storybook wiring for the two semantic menu-button components. */
 export declare function wireButtonStoryMenuTriggers(root: Element | undefined): void;
+/** Shared Storybook wiring for native split mode on either button family. */
+export declare function wireButtonStorySplitTriggers(root: Element | undefined): void;
 //# sourceMappingURL=button-story-foundation.d.ts.map

package/dist/vue/ds-bar-title.js

@@ -16,6 +16,7 @@ export const DsBarTitle = /*@__PURE__*/ defineContainer('ds-bar-title', defineDs
     'sectionsAriaLabel',
     'primaryAction',
     'actions',
+    'actionItems',
     'actionsAriaLabel',
     'variant',
     'placement',

package/dist/vue/ds-button-filled.js

@@ -25,8 +25,12 @@ export const DsButtonFilled = /*@__PURE__*/ defineContainer('ds-button-filled',
     'controls',
     'expanded',
     'haspopup',
+    'split',
+    'menuAriaLabel',
     'hasMenu',
-    'dsClick'
+    'dsClick',
+    'dsMenuClick'
 ], [
-    'dsClick'
+    'dsClick',
+    'dsMenuClick'
 ]);

package/dist/vue/ds-button-unfilled.js

@@ -26,13 +26,17 @@ export const DsButtonUnfilled = /*@__PURE__*/ defineContainer('ds-button-unfille
     'controls',
     'expanded',
     'haspopup',
+    'split',
+    'menuAriaLabel',
     'pressed',
     'collapseLabel',
     'hasMenu',
     'focusTabIndex',
     'dsClick',
+    'dsMenuClick',
     'dsChange'
 ], [
     'dsClick',
+    'dsMenuClick',
     'dsChange'
 ]);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ds-mo/ui",
-  "version": "14.23.0",
+  "version": "14.25.0",
   "description": "CompoMo — composable web components styled with TokoMo design tokens",
   "keywords": [
     "web-components",