@siemens/ix 5.0.0 → 5.1.0

package/dist/types/components/popover-image/popover-image.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Optional image section for the popover.
+ *
+ * @since 5.1.0
+ */
+export declare class PopoverImage {
+    /**
+     * Image source URL
+     *
+     * @since 5.1.0
+     */
+    image?: string;
+    /**
+     * Alt text for the image.
+     * Use an empty string for decorative images; provide descriptive text for content images.
+     *
+     * @since 5.1.0
+     */
+    imageAlt: string;
+    render(): any;
+}

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

@@ -80,6 +80,14 @@ export declare class Select extends Select_base implements IxInputFieldComponent
      * @since TODO: Define
      */
     ariaLabelAddItem: string;
+    /**
+     * Accessible label template for the overflow indicator chip shown in multiple
+     * mode when not all selected chips fit on a single row. The `{count}`
+     * placeholder is replaced with the number of hidden items (e.g. "3 more").
+     *
+     * @since 5.1.0
+     */
+    i18nMoreItems: string;
     /**
      * Warning text for the select component
      **/
@@ -201,6 +209,9 @@ export declare class Select extends Select_base implements IxInputFieldComponent
     isDropdownEmpty: boolean;
     inputFilterText: string;
     inputValue: string;
+    visibleChipValues: string[] | null;
+    hiddenChipValues: string[];
+    overflowDropdownShow: boolean;
     hasInputFocus: boolean;
     dropdownItemsVisualFocused: boolean;
     isInvalid: boolean;
@@ -212,6 +223,17 @@ export declare class Select extends Select_base implements IxInputFieldComponent
     private readonly dropdownAnchorRef;
     private readonly inputRef;
     private readonly dropdownRef;
+    private readonly chipElementRefs;
+    private readonly chipWidths;
+    private readonly overflowChipRef;
+    private readonly chipsContainerRef;
+    private readonly clearButtonRef;
+    private readonly chipHorizontalMargin;
+    private readonly triggerMinWidth;
+    private readonly overflowChipFallbackWidth;
+    private overflowChipWidth;
+    private chipsResizeObserver?;
+    private overflowDropdownOpenedByKeyboard;
     private proxyListObserver;
     private inputElement?;
     private touched;
@@ -226,6 +248,7 @@ export declare class Select extends Select_base implements IxInputFieldComponent
     get isMultipleMode(): boolean;
     get isEveryDropdownItemHidden(): boolean;
     watchValue(value: string | string[]): void;
+    watchDisabledReadonly(): void;
     updateFormInternalValue(value: string | string[]): void;
     /** @internal */
     hasValidValue(): Promise<boolean>;
@@ -256,6 +279,32 @@ export declare class Select extends Select_base implements IxInputFieldComponent
     private getRemoveChipAriaLabel;
     private renderAllChip;
     private renderChip;
+    private renderHiddenChip;
+    private renderOverflowChip;
+    private renderMultipleModeChips;
+    private renderOverflowDropdown;
+    private toggleOverflowDropdown;
+    private getOverflowRemoveButtons;
+    private focusOverflowRemoveButton;
+    onOverflowRemoveButtonKeyDown(event: KeyboardEvent): void;
+    private focusOverflowChip;
+    private pruneChipWidthCache;
+    private sameChipValues;
+    private applyOverflowState;
+    private getChipWidthWithMargin;
+    private getOverflowChipWidthWithMargin;
+    private canShowAllChips;
+    private getOverflowChipValues;
+    private hasUnmeasuredSelectedChips;
+    private getChipOverflowContext;
+    private handleChipsContainerResize;
+    private calculateChipOverflow;
+    private waitForComponentReady;
+    private waitForNextFrame;
+    private waitForChipLayout;
+    private measureSelectedChipWidths;
+    private measureOverflowChipWidth;
+    componentDidRender(): Promise<void>;
     onValidationChange({ isInvalid, isInvalidByRequired, isValid, isInfo, isWarning, }: ValidationResults): void;
     /** @internal */
     getAssociatedFormElement(): Promise<HTMLFormElement | null>;

package/dist/types/components/select-item/select-item.d.ts

@@ -58,6 +58,13 @@ export declare class SelectItem extends SelectItem_base implements DropdownItemW
      * Flag indicating whether the item is selected
      */
     selected: boolean;
+    /**
+     * Disable the item. A disabled item cannot be selected via mouse or keyboard
+     * and is excluded from the focusable items of the parent ix-select.
+     *
+     * @since 5.1.0
+     */
+    disabled: boolean;
     /**
      * @internal
      */

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

@@ -36,6 +36,7 @@ export declare class Tooltip {
     private disposeTriggerListener?;
     private disposeTooltipListener?;
     private disposeDomChangeListener?;
+    private hasDisconnected;
     private readonly instance;
     private readonly dialogRef;
     private get arrowElement();
@@ -58,6 +59,7 @@ export declare class Tooltip {
     private clearTimeouts;
     componentWillLoad(): void;
     componentDidLoad(): void;
+    connectedCallback(): void;
     disconnectedCallback(): void;
     private handleTitleIconSlotChange;
     render(): any;

package/dist/types/components/utils/a11y.d.ts

@@ -6,4 +6,9 @@ type PartialRecord<K extends A11yAttributeName, T> = {
     [P in K]?: T;
 };
 export type A11yAttributes = PartialRecord<A11yAttributeName, string>;
+/**
+ * Usually called by ref={(ref) => forceTabIndex(ref, -1)} to workaround an issue
+ * where the tabIndex is not applied to the element after re-render.
+ */
+export declare const forceTabIndex: (element: HTMLElement | undefined, tabIndex: number) => void;
 export {};

package/dist/types/components/utils/focus/focus-proxy.d.ts

@@ -1,12 +1,14 @@
+type FocusProxyProps = {
+    hostId: string;
+    otherProps: Record<string, string | boolean | undefined>;
+};
 /**
  * Add a focus proxy element to the DOM to allow for better keyboard navigation and accessibility.
  *
  * Important: Also import the focus proxy mixin in the host component's scss file to ensure the proxy is visually hidden but still accessible to screen readers and keyboard navigation.
  */
-export declare const FocusProxy: (props: {
-    hostId: string;
-    otherProps: any;
-}) => any;
+export declare const FocusProxy: (props: FocusProxyProps) => any;
 export declare const PROXY_LIST_ID_SUFFIX: "proxy-listbox";
 export declare const PROXY_LISTITEM_ID_SUFFIX: "proxy-listbox-item";
 export declare const updateFocusProxyList: <T extends HTMLElement>(proxyListElement: HTMLElement, items: T[], modifyProxyElement?: (item: T, proxyElement: HTMLLIElement) => void) => void;
+export {};

package/dist/types/components/utils/focus/focus-trap.d.ts

@@ -1,4 +1,5 @@
 import { MakeRef } from '../make-ref';
+import { IxFocusOptions } from './focus-utilities';
 export interface FocusTrapResult {
     destroy: () => void;
 }
@@ -6,7 +7,21 @@ export declare const TRAP_FOCUS_EXCLUDE_ATTRIBUTE = "data-ix-focus-trap-exclude"
 export declare const TRAP_FOCUS_INCLUDE_ATTRIBUTE = "data-ix-focus-trap-include";
 export type FocusTrapOptions = {
     targetElement?: HTMLElement | MakeRef<any>;
-    trapFocusInShadowDom?: boolean;
+    trapFocusInShadowDom?: boolean | 'both';
     excludeElements?: boolean;
+    /** Capture Tab on `document` (popover in ancestor shadow roots / top layer). */
+    listenOnDocument?: boolean;
+    /** Skip handling when another overlay owns focus (nested / sibling popover). */
+    shouldDeferTabTrap?: (trapHost: HTMLElement) => boolean;
 };
+export declare const getDeepActiveElement: () => Element | null;
+export declare function findActiveFocusableIndex(active: Element | null, focusableElements: HTMLElement[]): number;
+export declare function isFocusWithinTrapHost(element: Element, trapHost: HTMLElement): boolean;
+export declare function getPopoverHostForElement(element: Element): HTMLElement | undefined;
+export declare function isWithinInertSubtree(element: Element): boolean;
+/** Drops focusables inside closed or nested child popovers (not tabbable in the active layer). */
+export declare function filterFocusTrapFocusables(focusableElements: HTMLElement[], trapHost: HTMLElement): HTMLElement[];
+export declare function getFocusTrapFocusables(ref: HTMLElement, options?: FocusTrapOptions): HTMLElement[];
+/** Focus the first content control; falls back to the header close when content has none. */
+export declare function focusFirstFocusTrapElement(ref: HTMLElement, options?: FocusTrapOptions, focusOptions?: IxFocusOptions): void;
 export declare const addFocusTrap: (element: HTMLElement, options?: FocusTrapOptions) => Promise<FocusTrapResult>;

package/dist/types/components/utils/focus/focus-utilities.d.ts

@@ -5,7 +5,7 @@
 export declare const IX_FOCUS_VISIBLE_ACTIVE = "ix-focused";
 export declare const IX_FOCUS_VISIBLE = "ix-focusable";
 export declare const FOCUS_KEYS: Set<string>;
-export declare function queryElements(dropdownElement: HTMLElement | ShadowRoot | null | undefined, query: string): HTMLElement[];
+export declare function queryElements(dropdownElement: HTMLElement | ShadowRoot | null | undefined, query: string, includeShadowDom?: boolean): HTMLElement[];
 export type DomFocusOptions = Parameters<HTMLElement['focus']>[0];
 /** `focusVisible` is supported in Firefox 104+; omitted from some TypeScript DOM typings. */
 export type IxFocusOptions = DomFocusOptions & {
@@ -26,7 +26,7 @@ export declare const focusLastDescendant: <R extends HTMLElement, T extends HTML
  * and returns the host element if it is, otherwise returns the element itself.
  */
 export declare const getHostElement: (element: HTMLElement) => HTMLElement;
-export declare const focusElementInContext: <T extends HTMLElement>(hostToFocus: HTMLElement | null | undefined, fallbackElement: T) => void;
+export declare const focusElementInContext: <T extends HTMLElement>(hostToFocus: HTMLElement | null | undefined, fallbackElement: T, options?: IxFocusOptions) => void;
 export declare const focusElement: (element: HTMLElement | null | undefined, options?: DomFocusOptions) => void;
 export declare const focusableQueryString: string;
 export declare const buildFocusableQueryString: (additionalSelector?: string) => string;

package/dist/types/components/utils/menu-service/menu-service.d.ts

@@ -2,6 +2,7 @@ import { TypedEvent } from '../typed-event';
 declare class MenuService {
     #private;
     register(menuElement: HTMLIxMenuElement): void;
+    unregister(menuElement: HTMLIxMenuElement): void;
     setIsPinned(pinned: boolean): void;
     open(): Promise<boolean>;
     close(): Promise<boolean>;

package/dist/types/components/utils/nested-overlay/hierarchy.d.ts

@@ -0,0 +1,6 @@
+/** Parent instance id → direct child instance ids */
+export type ChildIdsByParent = Record<string, string[]>;
+export declare function buildComposedPath(id: string, childIdsByParent: ChildIdsByParent, path?: Set<string>): Set<string>;
+export declare function buildPathIncluding(id: string, childIdsByParent: ChildIdsByParent): Set<string>;
+export declare function removeIdFromHierarchy(id: string, childIdsByParent: ChildIdsByParent, registeredIds: Iterable<string>): void;
+export declare function getParentId(childId: string, childIdsByParent: ChildIdsByParent): string | undefined;

package/dist/types/components/utils/nested-overlay/index.d.ts

@@ -0,0 +1,6 @@
+export { buildComposedPath, buildPathIncluding, getParentId, removeIdFromHierarchy, } from './hierarchy';
+export type { ChildIdsByParent } from './hierarchy';
+export { NestedOverlayStack } from './nested-overlay-stack';
+export type { OverlayInstanceBase } from './nested-overlay-stack';
+export { pathIncludesTrigger } from './path-utils';
+export type { DismissAllOptions, OverlayDismissPolicy } from './types';

package/dist/types/components/utils/nested-overlay/nested-overlay-stack.d.ts

@@ -0,0 +1,28 @@
+import { ChildIdsByParent } from './hierarchy';
+import { DismissAllOptions, OverlayDismissPolicy } from './types';
+export interface OverlayInstanceBase {
+    getId(): string;
+}
+export declare class NestedOverlayStack<T extends OverlayInstanceBase> {
+    private readonly policy;
+    private readonly dismissInstance;
+    private readonly instances;
+    private readonly childIdsByParent;
+    constructor(policy: OverlayDismissPolicy<T>, dismissInstance: (instance: T) => void);
+    connect(instance: T): void;
+    disconnect(instance: T): void;
+    get(id: string): T | undefined;
+    keys(): string[];
+    forEach(callback: (instance: T) => void): void;
+    values(): IterableIterator<T>;
+    setChildIds(parentId: string, childIds: string[]): void;
+    deleteChildIdsEntry(parentId: string): void;
+    getChildIds(parentId: string): string[];
+    getChildIdsByParent(): ChildIdsByParent;
+    removeFromHierarchy(id: string): void;
+    buildComposedPath(id: string, path?: Set<string>): Set<string>;
+    buildPathIncluding(id: string): Set<string>;
+    dismissChildren(parentId: string): void;
+    dismissAll(options?: DismissAllOptions): void;
+    dismissOthers(activeId: string): void;
+}

package/dist/types/components/utils/nested-overlay/path-utils.d.ts

@@ -0,0 +1 @@
+export declare function pathIncludesTrigger(eventTargets: EventTarget[], triggerAttribute: string): HTMLElement | undefined;

package/dist/types/components/utils/nested-overlay/types.d.ts

@@ -0,0 +1,13 @@
+export type DismissAllOptions = {
+    /**
+     * Skip the outside-dismiss guard for these instance ids.
+     * Escape handling passes all registered ids (same as legacy dropdown behavior).
+     */
+    ignorePolicyForIds?: string[];
+    /** When true with a non-empty ignore list, only dismiss instances related in the hierarchy. */
+    ignoreRelatedInHierarchy?: boolean;
+};
+export type OverlayDismissPolicy<T> = {
+    /** When true, the instance is not closed on outside click / dismissOthers (unless policy is ignored). */
+    blocksOutsideDismiss: (instance: T) => boolean;
+};

package/dist/types/components/utils/shadow-dom.d.ts

@@ -1,6 +1,7 @@
 export declare function closestElement(selector: string, el: any): null | Element;
 export declare function getSlottedElements<R = any>(slot: any): R[];
 export declare function hasSlottedElements(slot: any): boolean;
+export declare function hasSlottedContent(slot?: HTMLSlotElement | null): boolean;
 export declare function containsElement(target: Element, element: Element): boolean;
 export declare function closestPassShadow(node: Node, selector: string): HTMLElement | null;
 /**