@siemens/ix 5.1.0 → 5.2.0

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

@@ -0,0 +1,210 @@
+import { InheritAriaAttributesMixinContract } from '../utils/internal/mixins/accessibility/inherit-aria-attributes.mixin';
+import { ComponentIdMixinContract } from '../utils/internal/mixins/id.mixin';
+import { BadgeAnatomyType, BadgePosition, BadgeVariant } from './badge.types';
+declare const Badge_base: abstract new (...args: any[]) => {
+    componentDidLoad(): void;
+    disconnectedCallback(): void;
+    hostElement?: import("@stencil/core/internal").HTMLStencilElement;
+    connectedCallback?(): void;
+    componentWillRender?(): Promise<void> | void;
+    componentDidRender?(): void;
+    componentWillLoad?(): Promise<void> | void;
+    componentShouldUpdate?(newVal: any, oldVal: any, propName: string): boolean | void;
+    componentWillUpdate?(): Promise<void> | void;
+    componentDidUpdate?(): void;
+    render?(): any;
+} & import("../utils/internal/component").StencilLifecycle & {
+    inheritAriaAttributes: import("../utils/a11y").A11yAttributes;
+    getIgnoredAriaAttributes(): import("../utils/a11y").A11yAttributeName[];
+    componentWillLoad(): Promise<void> | void;
+    ariaAttributeChanged(newValue: string | null, _: string | null, propName: string): void;
+    hostElement?: import("@stencil/core/internal").HTMLStencilElement;
+    connectedCallback?(): void;
+    disconnectedCallback?(): void;
+    componentWillRender?(): Promise<void> | void;
+    componentDidRender?(): void;
+    componentDidLoad?(): void;
+    componentShouldUpdate?(newVal: any, oldVal: any, propName: string): boolean | void;
+    componentWillUpdate?(): Promise<void> | void;
+    componentDidUpdate?(): void;
+    render?(): any;
+} & {
+    $internal_id: number;
+    getHostElementId(): string;
+    hostElement?: import("@stencil/core/internal").HTMLStencilElement;
+    connectedCallback?(): void;
+    disconnectedCallback?(): void;
+    componentWillRender?(): Promise<void> | void;
+    componentDidRender?(): void;
+    componentWillLoad?(): Promise<void> | void;
+    componentDidLoad?(): void;
+    componentShouldUpdate?(newVal: any, oldVal: any, propName: string): boolean | void;
+    componentWillUpdate?(): Promise<void> | void;
+    componentDidUpdate?(): void;
+    render?(): any;
+};
+/**
+ * Overlay indicator for counts, labels, dots, and status icons.
+ *
+ * **Attached** (default slot has content): the indicator is decorative.
+ * When `label` is set, that text is exposed on the anchor via `aria-describedby`.
+ * Host `role` / `aria-*` are discarded so the anchor owns the accessible name.
+ *
+ * **Standalone** (empty default slot): author `role` / `aria-*` stay on the host.
+ * For `dot` and `status-icon`, provide a host `aria-label` and a naming role
+ * (for example `role="img"`, or `role="status"` / `role="alert"` for a live region).
+ *
+ * Override max-width with `--ix-badge-max-width`.
+ *
+ * @since 5.2.0
+ */
+export declare class Badge extends Badge_base implements InheritAriaAttributesMixinContract, ComponentIdMixinContract {
+    hostElement: HTMLIxBadgeElement;
+    /**
+     * Badge type (`counter`, `label`, `dot`, or `status-icon`).
+     *
+     * @since 5.2.0
+     */
+    type: BadgeAnatomyType;
+    /**
+     * Visible text or count.
+     * Required for `label` and `counter`. Omit for `dot` and `status-icon`.
+     * Counters accept integers only (decimals truncated); values above 99 render as `99+`.
+     *
+     * @since 5.2.0
+     */
+    label?: string;
+    /**
+     * Color variant.
+     * For `status-icon`, unsupported values fall back to `info`.
+     * Use `error` only with `status-icon` (other types map it to `alarm`).
+     *
+     * @since 5.2.0
+     */
+    variant: BadgeVariant;
+    /**
+     * Show the badge in outline style.
+     *
+     * @since 5.2.0
+     */
+    outline: boolean;
+    /**
+     * Add a high-contrast border on filled badges.
+     * Ignored when **outline** is `true` or **type** is `status-icon`.
+     *
+     * @since 5.2.0
+     */
+    border: boolean;
+    /**
+     * Position relative to the slotted anchor.
+     * Only has an effect when attached.
+     *
+     * @since 5.2.0
+     */
+    position: BadgePosition;
+    /**
+     * Extra horizontal offset in pixels.
+     * Only has an effect when attached.
+     * Added to the type default.
+     *
+     * @since 5.2.0
+     */
+    offsetX: number;
+    /**
+     * Extra vertical offset in pixels.
+     * Only has an effect when attached.
+     * Added to the type default.
+     *
+     * @since 5.2.0
+     */
+    offsetY: number;
+    /**
+     * Play the attention pulse animation.
+     * Override duration with `--ix-badge-animation-duration` (default `2s`).
+     *
+     * @since 5.2.0
+     */
+    enableAnimation: boolean;
+    /**
+     * Custom background or border color.
+     * Only has an effect when **variant** is `custom`.
+     *
+     * @since 5.2.0
+     */
+    background?: string;
+    /**
+     * Custom text color.
+     * Only has an effect when **variant** is `custom`.
+     *
+     * @since 5.2.0
+     */
+    badgeColor?: string;
+    /**
+     * Leading icon name.
+     * Only has an effect when **type** is `label`.
+     *
+     * @since 5.2.0
+     */
+    icon?: string;
+    /**
+     * Accessible name for the leading icon.
+     * When unset, the icon is decorative if **label** provides visible text.
+     * Only has an effect when **type** is `label`.
+     *
+     * @since 5.2.0
+     */
+    ariaLabelIcon?: string;
+    /**
+     * Left-align label content.
+     * Only has an effect when **type** is `label`.
+     *
+     * @since 5.2.0
+     */
+    alignLeft: boolean;
+    /**
+     * Display a tooltip when the badge is standalone.
+     * By default, no tooltip is displayed.
+     * Add the attribute to use the badge label (or host `aria-label`) as the tooltip, or pass a string for custom text.
+     * Ignored when the badge is attached to an anchor.
+     *
+     * @since 5.2.0
+     */
+    tooltipText: string | boolean;
+    hasAnchor: boolean;
+    private descriptionId;
+    private anchorElements;
+    private slotElement?;
+    private readonly indicatorElementRef;
+    private hasDisconnected;
+    componentWillLoad(): void;
+    componentDidLoad(): void;
+    componentDidRender(): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    labelOrTypeChanged(): void;
+    private readonly setSlotRef;
+    private readonly onSlotChange;
+    private isDescriptionElement;
+    private getAnchorElements;
+    private detectHasAnchor;
+    private applyAnchorMode;
+    private getResolvedVariant;
+    private getResolvedType;
+    private getResolvedPosition;
+    private getResolvedOffsets;
+    private getFormattedLabel;
+    private getAccessibleText;
+    private isTooltipRequested;
+    private hasVisibleIndicator;
+    private shouldShowTooltip;
+    private getTooltipContent;
+    private getTooltip;
+    private syncAnchorDescribedBy;
+    private ensureLightDomDescription;
+    private removeLightDomDescription;
+    private clearAnchorDescribedBy;
+    private renderIndicatorShell;
+    private renderIndicator;
+    render(): any;
+}
+export {};

package/dist/types/components/badge/badge.status-icon.d.ts

@@ -0,0 +1,21 @@
+import type { BadgeVariant } from './badge.types';
+/** Variants valid for **type** `status-icon`. */
+export type BadgeStatusIconVariant = 'alarm' | 'error' | 'critical' | 'warning' | 'info' | 'success';
+type BadgeStatusIconPair = {
+    filled: string;
+    outline: string;
+    /** Solid plate under the filled glyph. */
+    plate: string;
+};
+/** Fallback when the variant has no status glyph. */
+export declare const BADGE_STATUS_ICON_FALLBACK_VARIANT: BadgeStatusIconVariant;
+/** Status icons by variant (`outline` / `filled` / `plate`). */
+export declare const BADGE_STATUS_ICON_BY_VARIANT: Record<BadgeStatusIconVariant, BadgeStatusIconPair>;
+export declare function isBadgeStatusIconVariant(variant: string): variant is BadgeStatusIconVariant;
+/** Status glyph for a variant (falls back to **info**). */
+export declare function getBadgeStatusIcon(variant: BadgeVariant, outline?: boolean): string;
+/** Plate icon for the filled status stack. */
+export declare function getBadgeStatusIconPlate(variant: BadgeVariant): string;
+/** Resolved status-icon variant for host classes (falls back to **info**). */
+export declare function getResolvedStatusIconVariant(variant: BadgeVariant): BadgeStatusIconVariant;
+export {};

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

@@ -0,0 +1,19 @@
+import type { ChipVariant } from '../chip/chip.types';
+export declare const BADGE_ANATOMY_TYPES: readonly ["label", "counter", "dot", "status-icon"];
+export type BadgeAnatomyType = (typeof BADGE_ANATOMY_TYPES)[number];
+/** Pill anatomies share chip semantic variants. */
+export { CHIP_VARIANTS as BADGE_VARIANTS } from '../chip/chip.types';
+/**
+ * Badge variant.
+ * **error** is only for **type** `status-icon`; other anatomies coerce to `alarm`.
+ */
+export type BadgeVariant = ChipVariant | 'error';
+export type { ChipVariant };
+export declare const BADGE_POSITIONS: readonly ["top-after", "bottom-after"];
+export type BadgePosition = (typeof BADGE_POSITIONS)[number];
+export type BadgeAttachedOffset = {
+    x: number;
+    y: number;
+};
+/** Default attached offsets (px) added to **offsetX** / **offsetY**. */
+export declare const BADGE_ATTACHED_OFFSET_DEFAULTS: Record<BadgeAnatomyType, BadgeAttachedOffset>;

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

@@ -0,0 +1,10 @@
+import type { BadgeAnatomyType } from './badge.types';
+export declare const BADGE_OVERFLOW_THRESHOLD = 99;
+type BadgeLabelInput = string | number | null;
+/**
+ * Formats badge label text for supported anatomy types.
+ * Returns `null` when the type has no text or the value is invalid.
+ * Counters truncate decimals and cap at `99+`.
+ */
+export declare function formatBadgeLabel(type: BadgeAnatomyType, label?: BadgeLabelInput): string | null;
+export {};

package/dist/types/components/badge/test/badge.page.d.ts

@@ -0,0 +1,67 @@
+import { Locator, Page } from '@playwright/test';
+/**
+ * Page Object Model for ix-badge component testing.
+ *
+ * Prefer accessibility locators (`getByRole`, `getByText`, accessible name /
+ * description) for author-facing contracts. Fall back to tag / CSS selectors
+ * for custom-element host state and decorative chrome (e.g. attached
+ * `aria-hidden` indicator) that is intentionally outside the a11y tree.
+ *
+ * Usage:
+ * ```ts
+ * const badge = new BadgePage(page);
+ * await badge.expectHydrated();
+ * await badge.expectVisibleLabel('12');
+ * ```
+ */
+export declare class BadgePage {
+    readonly page: Page;
+    constructor(page: Page);
+    /** First badge on the page (single-badge fixtures without a naming role). */
+    get host(): Locator;
+    /**
+     * Named standalone badge via host `role` + accessible name.
+     * Prefer this over `host` when the fixture sets `role` / `aria-label`.
+     */
+    getByRole(role: 'img' | 'alert' | 'status', name: string | RegExp): Locator;
+    getButton(name: string | RegExp): Locator;
+    /**
+     * Decorative indicator chrome (often `aria-hidden` when attached).
+     * Structural on purpose — not exposed in the accessibility tree.
+     */
+    get indicator(): Locator;
+    indicatorOf(badge: Locator): Locator;
+    get label(): Locator;
+    get description(): Locator;
+    get leadingIcon(): Locator;
+    get statusIconPlate(): Locator;
+    get statusIconGlyph(): Locator;
+    expectHydrated(badge?: Locator): Promise<void>;
+    expectAttached(badge?: Locator): Promise<void>;
+    expectStandalone(badge?: Locator): Promise<void>;
+    expectHostClass(pattern: RegExp, badge?: Locator): Promise<void>;
+    expectNoHostClass(pattern: RegExp, badge?: Locator): Promise<void>;
+    expectVisibleLabel(text: string, badge?: Locator): Promise<void>;
+    expectNoIndicator(badge?: Locator): Promise<void>;
+    expectIndicatorVisible(badge?: Locator): Promise<void>;
+    expectLeadingIconDecorative(): Promise<void>;
+    expectLeadingIconNamed(ariaLabel: string): Promise<void>;
+    expectCustomVariantColors(background: string, color: string, badge?: Locator): Promise<void>;
+    expectOffsets(offsetX: string, offsetY: string, badge?: Locator): Promise<void>;
+    expectAttachedTextLabelA11y(buttonName: string, descriptionText: string): Promise<void>;
+    expectDotAttachedNoDescribedBy(buttonName: string): Promise<void>;
+    expectMergedDescribedBy(buttonName: string, existingId: string, descriptionText: string): Promise<void>;
+    expectStandaloneStaticChrome(options?: {
+        visibleLabel?: string;
+        hostRole?: string | null;
+        hostAriaLabel?: string;
+    }): Promise<void>;
+    expectStandaloneHostAria(options: {
+        role: 'img' | 'alert' | 'status';
+        ariaLabel: string;
+        ariaLive?: string;
+    }): Promise<void>;
+    setLabel(label: string, badge?: Locator): Promise<void>;
+    disconnectKeepingAnchor(buttonName: string): Promise<void>;
+    tooltip(badge?: Locator): Locator;
+}

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

@@ -1,5 +1,10 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import type { BlindVariant } from './blind.types';
+/**
+ * @slot custom-header - Custom content inside blind header.
+ * @slot header-actions - Actions displayed at the end of the header.
+ * @slot default - Expandable blind content.
+ */
 export declare class Blind {
     /**
      * Collapsed state

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

@@ -13,6 +13,9 @@ declare const Breadcrumb_base: abstract new (...args: any[]) => {
     componentDidUpdate?(): void;
     render?(): any;
 } & import("../utils/internal/component").StencilLifecycle;
+/**
+ * @slot default - Breadcrumb items.
+ */
 export declare class Breadcrumb extends Breadcrumb_base {
     hostElement: HTMLIxBreadcrumbElement;
     /**

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

@@ -30,6 +30,9 @@ declare const BreadcrumbItem_base: abstract new (...args: any[]) => {
     componentDidUpdate?(): void;
     render?(): any;
 };
+/**
+ * @slot default - Breadcrumb item label.
+ */
 export declare class BreadcrumbItem extends BreadcrumbItem_base implements AnchorInterface, InheritAriaAttributesMixinContract {
     hostElement: HTMLIxBreadcrumbItemElement;
     /**

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

@@ -31,6 +31,9 @@ declare const Button_base: abstract new (...args: any[]) => {
     componentDidUpdate?(): void;
     render?(): any;
 };
+/**
+ * @slot default - Button label.
+ */
 export declare class Button extends Button_base implements IxButtonComponent, InheritAriaAttributesMixinContract {
     /**
      * Button variant

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

@@ -1,4 +1,8 @@
 import type { CardVariant } from './card.types';
+/**
+ * @slot default - Main card content.
+ * @slot card-accordion - Accordion displayed in the card footer.
+ */
 export declare class Card {
     hostElement: HTMLIxCardElement;
     /**

package/dist/types/components/card-accordion/card-accordion.d.ts

@@ -1,5 +1,8 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import type { CardAccordionExpandChangeEvent, CardAccordionVariant } from './card-accordion.types';
+/**
+ * @slot default - Accordion content.
+ */
 export declare class CardAccordion {
     /**
      * ARIA label for the card's expand button.

package/dist/types/components/card-content/card-content.d.ts

@@ -1,3 +1,6 @@
+/**
+ * @slot default - Card body content.
+ */
 export declare class CardContent {
     render(): any;
 }

package/dist/types/components/card-list/card-list.d.ts

@@ -1,4 +1,7 @@
 import { EventEmitter } from '../../stencil-public-runtime';
+/**
+ * @slot default - Cards displayed in the list.
+ */
 export declare class CardList {
     /**
      * ARIA label for the card's expand button.
@@ -65,7 +68,7 @@ export declare class CardList {
      * Fire event when the show more card is clicked.
      */
     showMoreCardClick: EventEmitter<{
-        nativeEvent: MouseEvent;
+        nativeEvent: MouseEvent | KeyboardEvent;
     }>;
     hostElement: HTMLIxCardListElement;
     private isShowingAll;
@@ -76,8 +79,11 @@ export declare class CardList {
     private rightScrollDistance;
     private observer?;
     private onCardListVisibilityToggle;
+    private findFirstFocusable;
+    private focusFirstVisibleCard;
     private handleClick;
     private onShowAllClick;
+    private onShowMoreCardClick;
     private getListChildren;
     private changeVisibilityOfSlotChildren;
     private registerOverflowHandler;

package/dist/types/components/card-title/card-title.d.ts

@@ -1,4 +1,5 @@
 /**
+ * @slot default - Card title.
  * @slot title-actions - Place additional actions inside title
  */
 export declare class CardHeader {

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

@@ -0,0 +1,11 @@
+/**
+ * @since 5.2.0
+ * @slot - Chat messages, for example ix-chat-user-message and ix-chat-ai-message
+ * @slot prompt - Chat input displayed below the chat messages
+ */
+export declare class Chat {
+    hasPrompt: boolean;
+    private hasAssignedContent;
+    private handlePromptSlotChange;
+    render(): any;
+}

package/dist/types/components/chat-ai-message/chat-ai-message.d.ts

@@ -0,0 +1,14 @@
+/**
+ * @since 5.2.0
+ * @slot - AI-generated message content
+ * @slot actions - Optional actions displayed below the AI message
+ * @slot sources - Optional sources displayed next to the AI message actions
+ */
+export declare class ChatAiMessage {
+    hasActions: boolean;
+    hasSources: boolean;
+    private hasAssignedContent;
+    private handleActionsSlotChange;
+    private handleSourcesSlotChange;
+    render(): any;
+}

package/dist/types/components/chat-attachment/chat-attachment.d.ts

@@ -0,0 +1,47 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import type { ChatAttachmentStatus } from './chat-attachment.types';
+/**
+ * @since 5.2.0
+ */
+export declare class ChatAttachment {
+    /**
+     * Name of the attached file.
+     */
+    fileName: string;
+    /**
+     * Upload status of the attachment.
+     */
+    status: ChatAttachmentStatus;
+    /**
+     * Icon displayed before the file name.
+     */
+    icon: string;
+    /**
+     * Hide the remove action.
+     */
+    hideRemoveButton: boolean;
+    /**
+     * Enable preview interaction for default attachments.
+     */
+    previewSupported: boolean;
+    /**
+     * Accessible label for the remove action.
+     */
+    removeAriaLabel: string;
+    /**
+     * Event emitted when the attachment is clicked.
+     */
+    attachmentClick: EventEmitter<void>;
+    /**
+     * Event emitted when the remove action is clicked.
+     */
+    removeClick: EventEmitter<void>;
+    private canPreview;
+    private splitFileName;
+    private renderFileName;
+    private getChipVariant;
+    private renderChipContent;
+    private handleAttachmentClick;
+    private getIcon;
+    render(): any;
+}

package/dist/types/components/chat-attachment/chat-attachment.types.d.ts

@@ -0,0 +1 @@
+export type ChatAttachmentStatus = 'default' | 'loading' | 'failed';