@ds-mo/ui 13.17.0 → 13.18.0

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

@@ -0,0 +1,137 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { type ControlWidth } from '../../utils';
+import type { AnchoredAlign, AnchoredSide } from '../../utils/anchored-position';
+export type FilterMenuFilterKind = 'single' | 'multiple' | 'boolean' | 'date';
+export type FilterMenuSize = 'lg' | 'md' | 'sm' | 'xs';
+export type FilterMenuWidth = ControlWidth;
+export interface FilterMenuOption {
+    label: string;
+    value: string;
+    description?: string;
+    isInactive?: boolean;
+}
+export interface FilterMenuFilter {
+    id: string;
+    label: string;
+    kind: FilterMenuFilterKind;
+    options?: FilterMenuOption[];
+    description?: string;
+    fieldLabel?: string;
+    /** Draw a standard menu-section divider after this category. */
+    divider?: boolean;
+}
+export type FilterMenuValue = string[] | boolean | string;
+export type FilterMenuValues = Record<string, FilterMenuValue | undefined>;
+export interface FilterMenuChangeDetail {
+    filterId: string;
+    value: FilterMenuValue;
+}
+export declare class FilterMenu {
+    el: HTMLElement;
+    /** Controlled popup visibility. */
+    open: boolean;
+    /** Select trigger text. The selected count is appended automatically. */
+    triggerLabel: string;
+    /** Optional select trigger prefix icon name. */
+    icon: string | undefined;
+    /** Select trigger density. */
+    size: FilterMenuSize;
+    /** Select trigger width fit. */
+    width: FilterMenuWidth;
+    /** Show the surface-aware inset border around the select trigger. */
+    hasBorder: boolean;
+    /** Show selected interaction fill when one or more criteria are active. */
+    activeFill: boolean;
+    /** ID applied to the internal select trigger. */
+    inputId: string | undefined;
+    /** Direct accessible name for the internal select trigger. */
+    ariaLabel: string | null;
+    /** Product-owned filter categories and option definitions. */
+    filters: FilterMenuFilter[];
+    /** Controlled values keyed by filter id. */
+    values: FilterMenuValues;
+    /** Controlled category shown in the option pane. */
+    activeFilterId: string | undefined;
+    /** External trigger element to position against. */
+    anchor: HTMLElement | undefined;
+    /** ID of the external trigger element used for positioning and focus return. */
+    anchorId: string | undefined;
+    /** Preferred popup side; collision handling may flip it. */
+    side: AnchoredSide;
+    /** Cross-axis alignment against the trigger. */
+    align: AnchoredAlign;
+    /** Gap between trigger and popup — number in px or a TokoMo length. */
+    sideOffset: number | string;
+    /** Cross-axis offset — number in px or a TokoMo length. */
+    alignOffset: number | string;
+    /** Popup width. It remains clamped to the viewport by the component recipe. */
+    menuWidth: string;
+    /** Accessible name for the non-modal filter dialog. */
+    menuLabel: string;
+    /** Accessible name for the category tab list. */
+    categoriesLabel: string;
+    /** Footer action and date-clear accessible label. */
+    clearLabel: string;
+    /** Show a visible focus ring on initial entry after keyboard activation. */
+    initialFocusVisible: boolean;
+    private shouldRender;
+    private closing;
+    private positionReady;
+    private pos;
+    private focusRingVisible;
+    private activeOptionIndex;
+    /** Requests a controlled value replacement without closing the popup. */
+    dsChange: EventEmitter<FilterMenuChangeDetail>;
+    /** Requests that the consumer clear every filter value. */
+    dsClear: EventEmitter<void>;
+    /** Requests a controlled active-category replacement. */
+    dsActiveFilterChange: EventEmitter<string>;
+    /** Requests that the controlled popup close. */
+    dsClose: EventEmitter<void>;
+    /** Emitted whenever internal select-trigger activation changes popup visibility. */
+    dsOpenChange: EventEmitter<boolean>;
+    /** Emitted after exit motion and rendered popup removal complete. */
+    dsAfterClose: EventEmitter<void>;
+    private readonly generatedId;
+    private outsideHandler;
+    private triggerElement;
+    private pendingInitialFocusVisible;
+    private closeTimer;
+    private closingSnapshot;
+    private readonly position;
+    componentDidLoad(): void;
+    disconnectedCallback(): void;
+    onOpenChange(isOpen: boolean): void;
+    onPositionInputChange(): void;
+    handleKeyDown(event: KeyboardEvent): void;
+    private get resolvedAnchor();
+    private get usesInternalTrigger();
+    private get anchorFocusTarget();
+    private get viewportPad();
+    private get popupFallbackWidth();
+    private get popupFallbackHeight();
+    private setupListeners;
+    private teardownListeners;
+    private close;
+    private toggleFromTrigger;
+    private handleTriggerKeyDown;
+    private finishClose;
+    private captureClosingSnapshot;
+    private focusAnchor;
+    private focusInitialCategory;
+    private tabLeavesPopup;
+    private moveFocusAfterTab;
+    private selectedFilter;
+    private selectedCount;
+    private totalSelected;
+    private activeFilterCount;
+    private selectCategory;
+    private handleCategoryKeyDown;
+    private handlePanelKeyDown;
+    private handleOptionKeyDown;
+    private toggleMultiple;
+    private selectOption;
+    private renderOptions;
+    render(): any;
+}
+//# sourceMappingURL=FilterMenu.d.ts.map

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

@@ -1,7 +1,7 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { type ChoicePopupAnchorAlignment, type ControlSize } from '../../utils';
 import type { MenuAlign, MenuSide } from './menu-position';
-import type { MenuItemData, MenuSection } from './menu-types';
+import { type MenuItemData, type MenuSection } from './menu-types';
 export type MenuSelectionMode = 'none' | 'single';
 export type MenuSize = ControlSize;
 export declare class Menu {

package/dist/types/components/Menu/menu-types.d.ts

@@ -1,12 +1,21 @@
 import type { SwatchPickerOption, SwatchPickerSection } from '../SwatchPicker/swatch-picker-types';
+import type { TagContrast, TagIntent } from '../Tag/Tag';
 export type { MenuAlign, MenuSide } from './menu-position';
 export { PANEL_NAV_USER_MENU_PLACEMENT, PANEL_TOOLS_HEADER_MENU_PLACEMENT, type MenuPlacement, } from './menu-placement';
+export interface MenuItemTagData {
+    label: string;
+    intent?: TagIntent;
+    contrast?: TagContrast;
+    rounded?: boolean;
+}
 export interface MenuItemData {
     label: string;
     value?: string;
     subtext?: string;
     /** Show a supplemental brand notification dot. */
     dot?: boolean;
+    /** Show a non-interactive tag at the trailing edge of the row. */
+    tag?: MenuItemTagData;
     isSelected?: boolean;
     isInactive?: boolean;
     isDestructive?: boolean;

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

@@ -27,6 +27,7 @@ export declare class Modal {
     private previousFocus;
     private closeTimer;
     componentDidLoad(): void;
+    componentDidRender(): void;
     disconnectedCallback(): void;
     onOpenChange(isOpen: boolean): void;
     private focusClose;

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

@@ -6,7 +6,13 @@ export type SelectSection = ChoiceSection;
 export type SelectBackground = ChoiceBackground;
 export type SelectSize = 'lg' | 'md' | 'sm' | 'xs';
 export type SelectWidth = ControlWidth;
+export type SelectPopupAlign = 'start' | 'end';
 export type SelectValue = string | string[];
+export interface SelectOptionActionDetail {
+    value: string;
+    anchorId: string;
+    originalEvent: MouseEvent;
+}
 export declare class Select {
     el: HTMLElement;
     internals: ElementInternals;
@@ -30,10 +36,18 @@ export declare class Select {
     requiredMessage: string;
     /** Trigger text shown when no valid value is selected. */
     placeholder: string;
+    /** Optional scalar-mode trigger text that does not change the selected option label. */
+    triggerLabel: string | undefined;
+    /** Present triggerLabel with placeholder emphasis while preserving the selected value. */
+    triggerLabelPlaceholder: boolean;
+    /** Show a supplemental notification dot beside the trigger label. */
+    dot: boolean;
     /** Control density. */
     size: SelectSize;
     /** Width fit — hug content (default) or fill the parent. */
     width: SelectWidth;
+    /** Align the popup's choice edge to the trigger start or end edge. */
+    popupAlign: SelectPopupAlign;
     /** Shared inactive treatment; removes interaction and form submission. */
     isInactive: boolean;
     /** Replace the prefix with a loader and disable option interaction. */
@@ -50,6 +64,8 @@ export declare class Select {
     clearLabel: string;
     /** Localized noun displayed after the selected count in multiple mode. */
     selectedLabel: string;
+    /** Optional text action shown in the popup footer instead of the clear action. */
+    footerActionLabel: string | undefined;
     /** Show immediate local filtering over option labels, subtext, and section headings. */
     searchable: boolean;
     /** Localized search-field placeholder and accessible name. */
@@ -78,23 +94,36 @@ export declare class Select {
     dsClear: EventEmitter<void>;
     /** Emitted whenever popup visibility changes. */
     dsOpenChange: EventEmitter<boolean>;
+    /** Emitted when the optional popup footer action is activated. */
+    dsFooterAction: EventEmitter<void>;
+    /** Emitted when an option's contextual ellipsis action is activated. */
+    dsOptionAction: EventEmitter<SelectOptionActionDetail>;
     private activeIndex;
     private searchTerm;
     private formDisabled;
     private position;
     private positionReady;
     private focusRingVisible;
+    private compactFooterSummary;
     private readonly generatedId;
     private readonly listboxId;
     private readonly errorId;
     private initialValue;
     private readonly controller;
+    private footerContentElement?;
+    private footerSummaryMeasureElement?;
+    private footerClearElement?;
+    private footerResizeObserver?;
+    private observedFooterContentElement?;
+    private footerMeasurementFrame?;
     private createController;
     componentWillLoad(): void;
     componentDidLoad(): void;
+    componentDidRender(): void;
     disconnectedCallback(): void;
     syncFormValue(): void;
     onLoadingChange(): void;
+    onPopupAlignChange(): void;
     onOpenChange(open: boolean): void;
     onSearchTermChange(): void;
     onActiveIndexChange(): void;
@@ -113,10 +142,15 @@ export declare class Select {
     private get selectedOption();
     private get hasSelection();
     private get activeOptionId();
+    private get popupRole();
+    private observeFooterContent;
+    private scheduleFooterSummaryMeasurement;
+    private measureFooterSummary;
     private closePopup;
     private openPopup;
     private selectOption;
     private clearSelection;
+    private activateFooterAction;
     private readonly handleListKeyDown;
     private readonly handleTriggerKeyDown;
     private renderOption;