@siemens/ix 2.5.0 → 2.6.0

package/dist/types/components/field-wrapper/field-wrapper.d.ts

@@ -0,0 +1,64 @@
+import { FieldWrapperInterface } from '../utils/input';
+import { MakeRef } from '../utils/make-ref';
+/** @internal */
+export declare class FieldWrapper implements FieldWrapperInterface {
+    hostElement: HTMLIxFieldWrapperElement;
+    /**
+     * Show text below the field component
+     */
+    helperText?: string;
+    /**
+     * Label for the field component
+     */
+    label?: string;
+    /**
+     * Error text for the field component
+     */
+    invalidText?: string;
+    /**
+     * Valid text for the field component
+     */
+    validText?: string;
+    /**
+     * Info text for the field component
+     */
+    infoText?: string;
+    /**
+     * Warning text for the field component
+     */
+    warningText?: string;
+    /**
+     * Is the field component invalid
+     */
+    isInvalid: boolean;
+    /**
+     * Is the field component valid
+     */
+    isValid: boolean;
+    /**
+     * Is the field component info
+     */
+    isInfo: boolean;
+    /**
+     * Is the field component warning
+     */
+    isWarning: boolean;
+    /**
+     * Show helper, error, info, warning text as tooltip
+     */
+    showTextAsTooltip: boolean;
+    /**
+     * Show label as required
+     */
+    required: boolean;
+    /**
+     * The id of the form element that the label is associated with
+     */
+    htmlForLabel?: string;
+    /**
+     * The control element that the label is associated with
+     */
+    controlRef?: MakeRef<HTMLElement>;
+    private readonly slotRef;
+    render(): any;
+}

package/dist/types/components/field-wrapper/helper-text-util.d.ts

@@ -0,0 +1,18 @@
+export declare function hasAnyText({ invalidText, warningText, infoText, validText, helperText, }: {
+    invalidText?: string;
+    warningText?: string;
+    infoText?: string;
+    validText?: string;
+    helperText?: string;
+}): string;
+export declare function renderHelperText({ isInvalid, invalidText, isWarning, warningText, isInfo, infoText, isValid, validText, helperText, }: {
+    isInvalid: boolean;
+    invalidText?: string;
+    isWarning: boolean;
+    warningText?: string;
+    isInfo: boolean;
+    infoText?: string;
+    isValid: boolean;
+    validText?: string;
+    helperText?: string;
+}): any;

package/dist/types/components/field-wrapper/tests/field-wrapper.ct.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/components/helper-text/helper-text.d.ts

@@ -0,0 +1,37 @@
+import { ValidationResults } from '../utils/input';
+import { IxComponent } from '../utils/internal';
+export declare class HelperText implements IxComponent {
+    hostElement: HTMLIxHelperTextElement;
+    /**
+     * The id of the form element that the label is associated with
+     */
+    htmlFor?: string;
+    /**
+     * Show text below the field component
+     */
+    helperText?: string;
+    /**
+     * Error text for the field component
+     */
+    invalidText?: string;
+    /**
+     * Valid text for the field component
+     */
+    validText?: string;
+    /**
+     * Info text for the field component
+     */
+    infoText?: string;
+    /**
+     * Warning text for the field component
+     */
+    warningText?: string;
+    validationResults: ValidationResults;
+    private readonly observer;
+    private classObserver?;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    componentWillRender(): void;
+    private checkForRequired;
+    render(): any;
+}

package/dist/types/components/input/input.animation.d.ts

@@ -0,0 +1 @@
+export declare function shakeInput(input: HTMLInputElement): void;

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

@@ -0,0 +1,123 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { IxInputFieldComponent, ValidationResults } from '../utils/input';
+/**
+ * @since 2.6.0
+ * @form-ready 2.6.0
+ */
+export declare class Input implements IxInputFieldComponent<string> {
+    hostElement: HTMLIxInputElement;
+    formInternals: ElementInternals;
+    /**
+     * The type of the text field. Possible values are 'text', 'email', or 'password'.
+     */
+    type: 'text' | 'email' | 'password' | 'tel' | 'url';
+    /**
+     * The name of the text field.
+     */
+    name?: string;
+    /**
+     * The placeholder text for the text field.
+     */
+    placeholder?: string;
+    /**
+     * The value of the text field.
+     */
+    value: string;
+    /**
+     * Specifies whether the text field is required.
+     */
+    required: boolean;
+    /**
+     * Specifies whether the text field is disabled.
+     */
+    disabled: boolean;
+    /**
+     * Specifies whether the text field is readonly.
+     */
+    readonly: boolean;
+    /**
+     * The helper text for the text field.
+     */
+    helperText?: string;
+    /**
+     * The info text for the text field.
+     */
+    infoText?: string;
+    /**
+     * Specifies whether to show the text as a tooltip.
+     */
+    showTextAsTooltip?: boolean;
+    /**
+     * The valid text for the text field.
+     */
+    validText?: string;
+    /**
+     * The warning text for the text field.
+     */
+    warningText?: string;
+    /**
+     * The label for the text field.
+     */
+    label?: string;
+    /**
+     * The error text for the text field.
+     */
+    invalidText?: string;
+    /**
+     * The pattern for the text field.
+     */
+    pattern?: string;
+    /**
+     * The maximum length of the text field.
+     */
+    maxLength?: number;
+    /**
+     * The minimum length of the text field.
+     */
+    minLength?: number;
+    /**
+     * The allowed characters pattern for the text field.
+     */
+    allowedCharactersPattern?: string;
+    /**
+     * Event emitted when the value of the text field changes.
+     */
+    valueChange: EventEmitter<string>;
+    /**
+     * Event emitted when the validity state of the text field changes.
+     */
+    validityStateChange: EventEmitter<ValidityState>;
+    /**
+     * Event emitted when the text field loses focus.
+     */
+    ixBlur: EventEmitter<void>;
+    isInvalid: boolean;
+    isValid: boolean;
+    isInfo: boolean;
+    isWarning: boolean;
+    isInvalidByRequired: boolean;
+    inputType: string;
+    private readonly inputRef;
+    private readonly slotEndRef;
+    private readonly slotStartRef;
+    private readonly inputId;
+    updateClassMappings(result: ValidationResults): void;
+    updateInputType(): void;
+    componentWillLoad(): void;
+    componentDidRender(): void;
+    private updatePaddings;
+    updateFormInternalValue(value: string): void;
+    /** @internal */
+    getAssociatedFormElement(): Promise<HTMLFormElement | null>;
+    /** @internal */
+    hasValidValue(): Promise<boolean>;
+    /**
+     * Returns the native input element used in the text field.
+     */
+    getNativeInputElement(): Promise<HTMLInputElement>;
+    /**
+     * Focuses the input field
+     */
+    focusInput(): Promise<void>;
+    render(): any;
+}

package/dist/types/components/input/input.fc.d.ts

@@ -0,0 +1,52 @@
+import { FunctionalComponent } from '../../stencil-public-runtime';
+import { MakeRef } from '../utils/make-ref';
+import { A11yAttributes } from '../utils/a11y';
+export declare function TextareaElement(props: {
+    resizeBehavior: 'both' | 'horizontal' | 'vertical' | 'none';
+    textareaHeight?: string;
+    textareaWidth?: string;
+    textareaRows?: number;
+    textareaCols?: number;
+    disabled: boolean;
+    readonly: boolean;
+    maxLength?: number;
+    minLength?: number;
+    isInvalid: boolean;
+    required: boolean;
+    value: string;
+    placeholder?: string;
+    textAreaRef: (el: HTMLTextAreaElement | undefined) => void;
+    valueChange: (value: string) => void;
+    updateFormInternalValue: (value: string) => void;
+    onBlur: () => void;
+    ariaAttributes?: A11yAttributes;
+}): any;
+export declare function InputElement(props: {
+    id: string;
+    disabled: boolean;
+    readonly: boolean;
+    maxLength?: string | number;
+    minLength?: string | number;
+    max?: string | number;
+    min?: string | number;
+    pattern?: string;
+    type: string;
+    isInvalid: boolean;
+    required: boolean;
+    value: string | number;
+    placeholder?: string;
+    inputRef: (el: HTMLInputElement | undefined) => void;
+    onKeyPress: (event: KeyboardEvent) => void;
+    valueChange: (value: string) => void;
+    updateFormInternalValue: (value: string) => void;
+    onBlur: () => void;
+    ariaAttributes?: A11yAttributes;
+}): any;
+export declare const SlotEnd: FunctionalComponent<{
+    slotEndRef: MakeRef<HTMLDivElement>;
+    onSlotChange?: (e: Event) => void;
+}>;
+export declare const SlotStart: FunctionalComponent<{
+    slotStartRef: MakeRef<HTMLDivElement>;
+    onSlotChange?: (e: Event) => void;
+}>;

package/dist/types/components/input/input.util.d.ts

@@ -0,0 +1,13 @@
+import { A11yAttributes } from '../utils/a11y';
+import { IxFormComponent, IxInputFieldComponent, ValidationResults } from '../utils/input';
+export declare function createIdIfNotExists(element: IxFormComponent, idPrefix?: string): any;
+export declare function mapValidationResult<T>(ref: IxInputFieldComponent<T>, result: ValidationResults): void;
+export declare function checkAllowedKeys<T>(comp: IxInputFieldComponent<T>, event: KeyboardEvent): void;
+export declare function checkInternalValidity<T>(comp: IxFormComponent<T>, input: HTMLInputElement | HTMLTextAreaElement): Promise<void>;
+export declare function onInputBlur<T>(comp: IxInputFieldComponent<T>, input?: HTMLInputElement | HTMLTextAreaElement | null): void;
+export declare function applyPaddingEnd(inputElement: HTMLElement | null, width: number, options: {
+    slotEnd: boolean;
+    additionalPaddingRight?: string;
+}): void;
+export declare function adjustPaddingForStartAndEnd(startElement: HTMLElement | null, endElement: HTMLElement | null, inputElement: HTMLElement | null): void;
+export declare function getAriaAttributesForInput(component: IxInputFieldComponent): A11yAttributes;

package/dist/types/components/input/number-input.d.ts

@@ -0,0 +1,121 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { IxInputFieldComponent, ValidationResults } from '../utils/input';
+/**
+ * @since 2.6.0
+ * @form-ready 2.6.0
+ */
+export declare class NumberInput implements IxInputFieldComponent<number> {
+    hostElement: HTMLIxNumberInputElement;
+    formInternals: ElementInternals;
+    /**
+     * name of the input element
+     */
+    name?: string;
+    /**
+     * placeholder of the input element
+     */
+    placeholder?: string;
+    /**
+     * The value of the input field
+     */
+    value: number;
+    /**
+     * Indicates if the field is required
+     */
+    required: boolean;
+    /**
+     * Disables the input field
+     */
+    disabled: boolean;
+    /**
+     * Indicates if the field is read-only
+     */
+    readonly: boolean;
+    /**
+     * The helper text for the input field
+     */
+    helperText?: string;
+    /**
+     * The info text for the input field
+     */
+    infoText?: string;
+    /**
+     * Indicates if the text should be shown as a tooltip
+     */
+    showTextAsTooltip?: boolean;
+    /**
+     * The valid text for the input field
+     */
+    validText?: string;
+    /**
+     * The warning text for the input field
+     */
+    warningText?: string;
+    /**
+     * The label for the input field
+     */
+    label?: string;
+    /**
+     * The error text for the input field
+     */
+    invalidText?: string;
+    /**
+     * The pattern for the input field
+     */
+    pattern?: string;
+    /**
+     * The minimum value for the input field
+     */
+    min?: string | number;
+    /**
+     * The maximum value for the input field
+     */
+    max?: string | number;
+    /**
+     * The allowed characters pattern for the input field
+     */
+    allowedCharactersPattern?: string;
+    /**
+     * Indicates if the stepper buttons should be shown
+     */
+    showStepperButtons?: boolean;
+    /**
+     * Event emitted when the value of the input field changes
+     */
+    valueChange: EventEmitter<number>;
+    /**
+     * Event emitted when the validity state of the input field changes
+     */
+    validityStateChange: EventEmitter<ValidityState>;
+    /**
+     * Event emitted when the input field loses focus
+     */
+    ixBlur: EventEmitter<void>;
+    isInvalid: boolean;
+    isValid: boolean;
+    isInfo: boolean;
+    isWarning: boolean;
+    isInvalidByRequired: boolean;
+    private readonly inputRef;
+    private readonly slotEndRef;
+    private readonly slotStartRef;
+    private readonly numberInputId;
+    updateClassMappings(result: ValidationResults): void;
+    componentWillLoad(): void;
+    componentDidRender(): void;
+    private updatePaddings;
+    updateFormInternalValue(value: number): void;
+    /** @internal */
+    getAssociatedFormElement(): Promise<HTMLFormElement | null>;
+    /** @internal */
+    hasValidValue(): Promise<boolean>;
+    /**
+     * Returns the native input element used under the hood
+     */
+    getNativeInputElement(): Promise<HTMLInputElement>;
+    /**
+     * Focuses the input field
+     */
+    focusInput(): Promise<void>;
+    render(): any;
+}

package/dist/types/components/input/tests/form-ready.ct.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/components/input/textarea.d.ts

@@ -0,0 +1,126 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { IxInputFieldComponent, ValidationResults } from '../utils/input';
+export type TextareaResizeBehavior = 'both' | 'horizontal' | 'vertical' | 'none';
+/**
+ * @since 2.6.0
+ * @form-ready 2.6.0
+ */
+export declare class Textarea implements IxInputFieldComponent<string> {
+    hostElement: HTMLIxTextareaElement;
+    formInternals: ElementInternals;
+    /**
+     * The name of the textarea field.
+     */
+    name?: string;
+    /**
+     * The placeholder text for the textarea field.
+     */
+    placeholder?: string;
+    /**
+     * The value of the textarea field.
+     */
+    value: string;
+    /**
+     * Determines if the textarea field is required.
+     */
+    required: boolean;
+    /**
+     * Determines if the textarea field is disabled.
+     */
+    disabled: boolean;
+    /**
+     * Determines if the textarea field is readonly.
+     */
+    readonly: boolean;
+    /**
+     * The helper text for the textarea field.
+     */
+    helperText?: string;
+    /**
+     * The info text for the textarea field.
+     */
+    infoText?: string;
+    /**
+     * Determines if the text should be displayed as a tooltip.
+     */
+    showTextAsTooltip?: boolean;
+    /**
+     * The valid text for the textarea field.
+     */
+    validText?: string;
+    /**
+     * The warning text for the textarea field.
+     */
+    warningText?: string;
+    /**
+     * The label for the textarea field.
+     */
+    label?: string;
+    /**
+     * The error text for the textarea field.
+     */
+    invalidText?: string;
+    /**
+     * The height of the textarea field (e.g. "52px").
+     */
+    textareaHeight?: string;
+    /**
+     * The width of the textarea field (e.g. "200px").
+     */
+    textareaWidth?: string;
+    /**
+     * The height of the textarea specified by number of rows.
+     */
+    textareaRows?: number;
+    /**
+     * The width of the textarea specified by number of characters.
+     */
+    textareaCols?: number;
+    /**
+     * Determines the resize behavior of the textarea field.
+     * Resizing can be enabled in one direction, both directions or completely disabled.
+     */
+    resizeBehavior: TextareaResizeBehavior;
+    /**
+     * The maximum length of the textarea field.
+     */
+    maxLength?: number;
+    /**
+     * The minimum length of the textarea field.
+     */
+    minLength?: number;
+    /**
+     * Event emitted when the value of the textarea field changes.
+     */
+    valueChange: EventEmitter<string>;
+    /**
+     * Event emitted when the validity state of the textarea field changes.
+     */
+    validityStateChange: EventEmitter<ValidityState>;
+    /**
+     * Event emitted when the textarea field loses focus.
+     */
+    ixBlur: EventEmitter<void>;
+    isInvalid: boolean;
+    isValid: boolean;
+    isInfo: boolean;
+    isWarning: boolean;
+    isInvalidByRequired: boolean;
+    private readonly textAreaRef;
+    updateClassMappings(result: ValidationResults): void;
+    componentWillLoad(): void;
+    updateFormInternalValue(value: string): void;
+    /** @internal */
+    getAssociatedFormElement(): Promise<HTMLFormElement | null>;
+    /** @internal */
+    hasValidValue(): Promise<boolean>;
+    /**
+     * Get the native textarea element.
+     */
+    getNativeInputElement(): Promise<HTMLTextAreaElement>;
+    /**
+     * Focuses the input field
+     */
+    focusInput(): Promise<void>;
+    render(): any;
+}

package/dist/types/components/layout-auto/layout-auto.d.ts

@@ -0,0 +1,24 @@
+import { IxComponent } from '../utils/internal';
+/**
+ * @since 2.6.0
+ */
+export declare class LayoutForm implements IxComponent {
+    hostElement: HTMLIxLayoutAutoElement;
+    /**
+     * Defines the layout of the form.
+     */
+    layout: {
+        minWidth: string;
+        columns: number;
+    }[];
+    private mediaQueryList;
+    private readonly observer;
+    private readonly resizeObserver;
+    connectedCallback(): void;
+    componentWillLoad(): void | Promise<void>;
+    disconnectedCallback(): void;
+    updateMediaQueryList(): void;
+    private parseNumber;
+    private calculateGridTemplateColumns;
+    render(): any;
+}

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

@@ -27,7 +27,7 @@ export declare class Menu {
     /**
      * Should only be set if you use ix-menu standalone
      */
-    applicationName: string;
+    applicationName?: string;
     /**
      * Should only be set if you use ix-menu standalone
      */
@@ -83,11 +83,10 @@ export declare class Menu {
     mapExpandChange: EventEmitter<boolean>;
     showPinned: boolean;
     mapExpand: boolean;
-    activeTab: HTMLIxMenuItemElement | null;
     breakpoint: Breakpoint;
     itemsScrollShadowTop: boolean;
     itemsScrollShadowBottom: boolean;
-    applicationLayoutContext: ContextType<typeof ApplicationLayoutContext>;
+    applicationLayoutContext?: ContextType<typeof ApplicationLayoutContext>;
     private isTransitionDisabled;
     private readonly isVisible;
     get popoverArea(): Element;
@@ -104,20 +103,17 @@ export declare class Menu {
     get activeMoreTab(): Element;
     get aboutPopoverContainer(): HTMLElement;
     get aboutNewsPopover(): HTMLIxMenuAboutNewsElement;
-    get aboutTab(): HTMLElement;
+    get aboutTab(): HTMLElement | null;
     get about(): HTMLIxMenuAboutElement | null;
     get settings(): HTMLIxMenuSettingsElement | null;
     get isSettingsEmpty(): boolean;
     get tabsContainer(): HTMLIxMenuElement;
     componentDidLoad(): void;
     componentWillLoad(): void;
-    componentWillRender(): void;
     componentDidRender(): void;
     private setPinned;
     private onBreakpointChange;
     private appendFragments;
-    private resetActiveTab;
-    private appendTabs;
     private getAboutPopoverVerticalPosition;
     private appendAboutNewsPopover;
     /**

package/dist/types/components/menu-about/test/menu-about.ct.d.ts

@@ -0,0 +1 @@
+export {};

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

@@ -45,10 +45,10 @@ export declare class MenuItem {
     hostElement: HTMLIxMenuItemElement;
     tooltip?: string;
     menuExpanded: boolean;
-    private buttonRef;
+    private readonly buttonRef;
     private isHostedInsideCategory;
-    private menuExpandedDisposer;
-    private observer;
+    private menuExpandedDisposer?;
+    private readonly observer;
     componentWillLoad(): void;
     componentWillRender(): void;
     setTooltip(): void;

package/dist/types/components/modal/test/modal.ct.d.ts

@@ -1,6 +1,7 @@
+import { showModal } from './../../utils/modal';
 declare global {
     interface Window {
-        showModal: any;
+        showModal: typeof showModal;
+        __counter: number;
     }
 }
-export {};

package/dist/types/components/modal-header/modal-header.d.ts

@@ -11,12 +11,12 @@ export declare class ModalHeader {
     /**
      * Icon of the Header
      */
-    icon: string;
-    onIconChange(icon: string): void;
+    icon?: string;
+    onIconChange(icon?: string): void;
     /**
      * Icon color
      */
-    iconColor: string;
+    iconColor?: string;
     /**
      * Emits when close icon is clicked and closes the modal
      * Can be prevented, in which case only the event is triggered, and the modal remains open