@siemens/ix 5.0.0 → 5.1.1

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/split-button/split-button.d.ts

@@ -33,6 +33,9 @@ declare const SplitButton_base: abstract new (...args: any[]) => {
     componentDidUpdate?(): void;
     render?(): any;
 };
+/**
+ * @slot default - Dropdown items for the split button.
+ */
 export declare class SplitButton extends SplitButton_base implements AriaActiveDescendantMixinContract {
     hostElement: HTMLIxSplitButtonElement;
     /**

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

@@ -42,6 +42,9 @@ declare const TabItem_base: abstract new (...args: any[]) => {
     componentDidUpdate?(): void;
     render?(): any;
 };
+/**
+ * @slot default - Tab label.
+ */
 export declare class TabItem extends TabItem_base implements BaseTabMixinContract, ComponentIdMixinContract {
     hostElement: HTMLIxTabItemElement;
     /**

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

@@ -27,6 +27,9 @@ declare const Tabs_base: abstract new (...args: any[]) => {
     componentDidUpdate?(): void;
     render?(): any;
 };
+/**
+ * @slot default - Tab items.
+ */
 export declare class Tabs extends Tabs_base {
     hostElement: HTMLIxTabsElement;
     /**

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

@@ -1,3 +1,9 @@
+/**
+ * @slot header - Content displayed in the tile header.
+ * @slot subheader - Content displayed below the tile header.
+ * @slot default - Main tile content.
+ * @slot footer - Content displayed in the tile footer.
+ */
 export declare class Tile {
     hostElement: HTMLIxTileElement;
     /**

package/dist/types/components/toast/toast-container.d.ts

@@ -1,5 +1,8 @@
 import type { ShowToastResult } from './toast-container.types';
 import { ToastConfig } from './toast-utils';
+/**
+ * @slot default - Toast messages.
+ */
 export declare class ToastContainer {
     hostElement: HTMLIxToastContainerElement;
     /**

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

@@ -1,5 +1,9 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { ToastType } from './toast-utils';
+/**
+ * @slot default - Toast message content.
+ * @slot action - Action displayed next to the toast message.
+ */
 export declare class Toast {
     /**
      * Toast type

package/dist/types/components/toggle-button/toggle-button.d.ts

@@ -31,6 +31,9 @@ declare const ToggleButton_base: abstract new (...args: any[]) => {
     componentDidUpdate?(): void;
     render?(): any;
 };
+/**
+ * @slot default - Toggle button label.
+ */
 export declare class ToggleButton extends ToggleButton_base implements InheritAriaAttributesMixinContract {
     hostElement: HTMLIxToggleButtonElement;
     /**

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

@@ -2,6 +2,7 @@ import { ElementReference } from '../utils/element-reference';
 /**
  * @slot title-icon - Icon displayed next to the tooltip title. The icon will be displayed as 16x16px.
  * @slot title-content - Content of tooltip title
+ * @slot default - Tooltip body content.
  */
 export declare class Tooltip {
     /**
@@ -36,6 +37,7 @@ export declare class Tooltip {
     private disposeTriggerListener?;
     private disposeTooltipListener?;
     private disposeDomChangeListener?;
+    private hasDisconnected;
     private readonly instance;
     private readonly dialogRef;
     private get arrowElement();
@@ -58,6 +60,7 @@ export declare class Tooltip {
     private clearTimeouts;
     componentWillLoad(): void;
     componentDidLoad(): void;
+    connectedCallback(): void;
     disconnectedCallback(): void;
     private handleTitleIconSlotChange;
     render(): any;

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

@@ -1,6 +1,9 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { TreeContext, TreeModel, UpdateCallback } from './tree-model';
 import { RefreshTreeOptions } from './tree.types';
+/**
+ * @slot default - Tree items.
+ */
 export declare class Tree {
     hostElement: HTMLIxTreeElement;
     /**

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

@@ -1,5 +1,8 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { TreeItemContext } from '../tree/tree-model';
+/**
+ * @slot default - Tree item content and nested items.
+ */
 export declare class TreeItem {
     /**
      * Text

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

@@ -1,4 +1,7 @@
 import type { TypographyFormat, TextDecoration, TypographyColors } from './typography.types';
+/**
+ * @slot default - Text content.
+ */
 export declare class IxTypography {
     /**
      * Text format

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;
 /**

package/dist/types/components/workflow-step/workflow-step.d.ts

@@ -1,4 +1,8 @@
 import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * @slot custom-icon - Custom icon displayed for the workflow step.
+ * @slot default - Workflow step label and content.
+ */
 export declare class WorkflowStep {
     hostElement: HTMLIxWorkflowStepElement;
     /**

package/dist/types/components/workflow-steps/workflow-steps.d.ts

@@ -1,4 +1,7 @@
 import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * @slot default - Workflow step items.
+ */
 export declare class WorkflowSteps {
     hostElement: HTMLIxWorkflowStepsElement;
     /**