@siemens/ix 0.0.0-20240522074328 → 0.0.0-pr-1318-20240627080522

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

@@ -0,0 +1,127 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { IxInputFieldComponent, ValidationResults } from '../utils/field';
+export type DateFieldValidityState = {
+    patternMismatch: boolean;
+    invalidReason?: string;
+};
+/**
+ * @since 2.4.0
+ * @form-ready 2.4.0
+ */
+export declare class DateField implements IxInputFieldComponent<string> {
+    hostElement: HTMLIxDateFieldElement;
+    formInternals: ElementInternals;
+    /**
+     * name of the input element
+     */
+    name?: string;
+    /**
+     * placeholder of the input element
+     */
+    placeholder?: string;
+    /**
+     * value of the input element
+     */
+    value: string;
+    /**
+     * Date format string.
+     * See {@link "https://moment.github.io/luxon/#/formatting?id=table-of-tokens"} for all available tokens.
+     */
+    format: string;
+    /**
+     * required attribute
+     */
+    required?: boolean;
+    /**
+     * helper text below the input field
+     */
+    helperText?: string;
+    /**
+     * label of the input field
+     */
+    label?: string;
+    /**
+     * error text below the input field
+     */
+    invalidText?: string;
+    /**
+     * readonly attribute
+     */
+    readonly: boolean;
+    /**
+     * disabled attribute
+     */
+    disabled: boolean;
+    /**
+     * info text below the input field
+     */
+    infoText?: string;
+    /**
+     * warning text below the input field
+     */
+    warningText?: string;
+    /**
+     * valid text below the input field
+     */
+    validText?: string;
+    /**
+     * show text as tooltip
+     */
+    showTextAsTooltip?: boolean;
+    /**
+     * i18n string for the error message when the date is not parsable
+     */
+    i18nErrorDateUnparsable: string;
+    /**
+     * Input change event.
+     */
+    valueChange: EventEmitter<string>;
+    /**
+     * Validation state change event.
+     */
+    validityStateChange: EventEmitter<DateFieldValidityState>;
+    /** @internal */
+    ixFocus: EventEmitter<void>;
+    /** @internal */
+    ixBlur: EventEmitter<void>;
+    show: boolean;
+    from: string | null;
+    isInputInvalid: boolean;
+    isInvalid: boolean;
+    isValid: boolean;
+    isInfo: boolean;
+    isWarning: boolean;
+    focus: boolean;
+    private prefixRef;
+    private postfixRef;
+    private datepickerRef;
+    private inputElementRef;
+    private dropdownElementRef;
+    private classObserver?;
+    private invalidReason?;
+    updateFormInternalValue(value: string): void;
+    connectedCallback(): void;
+    componentWillLoad(): void;
+    componentDidRender(): void;
+    private updatePaddings;
+    disconnectedCallback(): void;
+    watchValue(): void;
+    /** @internal */
+    hasValidValue(): Promise<boolean>;
+    /** @internal */
+    getAssociatedFormElement(): Promise<HTMLFormElement | null>;
+    onInput(value: string): Promise<void>;
+    openDropdown(): Promise<void>;
+    closeDropdown(): Promise<void>;
+    private checkClassList;
+    private renderInput;
+    hookValidationLifecycle({ isInfo, isInvalid, isInvalidByRequired, isValid, isWarning, }: ValidationResults): void;
+    onInputValidationChange(): Promise<void>;
+    /** @internal */
+    getValidityState(): Promise<ValidityState>;
+    /**
+     * Get the native input element
+     */
+    getNativeInputElement(): Promise<HTMLInputElement>;
+    render(): any;
+}

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

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

package/dist/types/components/date-time-card/date-time-card.d.ts

@@ -4,7 +4,7 @@ export type DateTimeCardCorners = 'rounded' | 'left' | 'right' | 'straight';
  */
 export declare class DateTimeCard {
     /** @internal */
-    standaloneAppearance: any;
+    standaloneAppearance?: boolean;
     /**
      * set styles
      */

package/dist/types/components/dropdown/dropdown-controller.d.ts

@@ -22,6 +22,7 @@ declare class DropdownController {
     private isWindowListenerActive;
     connected(dropdown: DropdownInterface): void;
     disconnected(dropdown: DropdownInterface): void;
+    getDropdownById(id: string): DropdownInterface;
     discoverSubmenus(): void;
     present(dropdown: DropdownInterface): void;
     dismissChildren(uid: string): void;

package/dist/types/components/dropdown-button/dropdown-button.ct.d.ts

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

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

@@ -0,0 +1,27 @@
+import { IxComponent } from '../utils/internal';
+import { MakeRef } from '../utils/make-ref';
+export declare class FormFieldLabel implements IxComponent {
+    hostElement: HTMLIxFieldLabelElement;
+    /**
+     * A value is required or must be checked for the form to be submittable
+     */
+    required?: boolean;
+    /**
+     * The id of the form element that the label is associated with
+     */
+    htmlFor?: string;
+    /** @internal */
+    controlRef?: MakeRef<HTMLElement>;
+    private observer;
+    private a11yAttributes;
+    private labelRef;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    componentWillRender(): void;
+    componentWillLoad(): void | Promise<void>;
+    private destroyObserver;
+    private registerObserver;
+    private checkForRequired;
+    private focusOnClick;
+    render(): any;
+}

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

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

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

@@ -0,0 +1,64 @@
+import { FieldWrapperInterface } from '../utils/field';
+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 slotRef;
+    render(): any;
+}

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

@@ -0,0 +1,11 @@
+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/field';
+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 observer;
+    private classObserver?;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    componentWillRender(): void;
+    private checkForRequired;
+    render(): any;
+}

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

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

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

@@ -0,0 +1,53 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { IxFormComponent } from '../utils/field';
+/**
+ * @since 2.4.0
+ * @form-ready 2.4.0
+ */
+export declare class Radio implements IxFormComponent<string> {
+    hostElement: HTMLIxRadioElement;
+    formInternals: ElementInternals;
+    /**
+     * Name of the radio component
+     */
+    name?: string;
+    /**
+     * Value of the radio component
+     */
+    value?: string;
+    /**
+     * Label for the radio component
+     */
+    label?: string;
+    /**
+     * Disabled state of the radio component
+     */
+    disabled: boolean;
+    /**
+     * Checked state of the radio component
+     */
+    checked: boolean;
+    /**
+     * Event emitted when the checked state of the radio changes
+     */
+    checkedChange: EventEmitter<boolean>;
+    /**
+     * Event emitted when the value of the radio changes
+     */
+    valueChange: EventEmitter<string>;
+    /**
+     * Single radio cannot be required
+     * */
+    required: boolean;
+    private inputRef;
+    private setCheckedState;
+    onCheckedChange(): Promise<void>;
+    onValueChange(): void;
+    componentWillLoad(): void;
+    updateFormInternalValue(): void;
+    /** @internal */
+    hasValidValue(): Promise<boolean>;
+    /** @internal */
+    getAssociatedFormElement(): Promise<HTMLFormElement | null>;
+    render(): any;
+}

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

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

package/dist/types/components/radio-group/radio-group.d.ts

@@ -0,0 +1,60 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import { ValidationResults, FieldWrapperInterface, IxFormValidationState } from '../utils/field';
+/**
+ * @since 2.4.0
+ * @form-ready 2.4.0
+ */
+export declare class RadiobuttonGroup implements FieldWrapperInterface, IxFormValidationState {
+    hostElement: HTMLIxRadioGroupElement;
+    /**
+     * Show text below the field component
+     */
+    helperText?: string;
+    /**
+     * Label for the field component
+     */
+    label?: string;
+    /**
+     * Value of the radiobutton group component
+     */
+    value?: string;
+    /**
+     * Error text for the field component
+     */
+    invalidText?: string;
+    /**
+     * Info text for the field component
+     */
+    infoText?: string;
+    /**
+     * Warning text for the field component
+     */
+    warningText?: string;
+    /**
+     * Valid text for the field component
+     */
+    validText?: string;
+    /**
+     * Show helper, info, warning, error and valid text as tooltip
+     */
+    showTextAsTooltip?: boolean;
+    /**
+     * Event emitted when the value of the radiobutton group changes
+     */
+    valueChange: EventEmitter<string>;
+    isInvalid: boolean;
+    isValid: boolean;
+    isInfo: boolean;
+    isWarning: boolean;
+    private observer;
+    private get radiobuttonElements();
+    connectedCallback(): void;
+    componentWillLoad(): void | Promise<void>;
+    disconnectedCallback(): void;
+    private selectInitialValue;
+    private ensureOnlyLastRadioChecked;
+    onValueChangeHandler(newValue: string): void;
+    onCheckedChangeHandler(event: CustomEvent<boolean>): void;
+    onClassField({ isInvalid, isInfo, isValid, isWarning }: ValidationResults): void;
+    render(): any;
+}

package/dist/types/components/radio-group/test/radio-group.ct.d.ts

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

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

@@ -1,8 +1,68 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { IxSelectItemLabelChangeEvent } from '../select-item/events';
 import { DropdownItemWrapper } from '../dropdown/dropdown-controller';
-export declare class Select {
+import { ValidationResults, IxInputFieldComponent } from '../utils/field';
+/**
+ * @form-ready 2.4.0
+ */
+export declare class Select implements IxInputFieldComponent<string | string[]> {
     hostElement: HTMLIxSelectElement;
+    formInternals: ElementInternals;
+    /**
+     * A string that represents the element's name attribute,
+     * containing a name that identifies the element when submitting the form.
+     *
+     * @since 2.4.0
+     */
+    name?: string;
+    /**
+     * A Boolean attribute indicating that an option with a non-empty string value must be selected
+     *
+     * @since 2.4.0
+     */
+    required: boolean;
+    /**
+     * Label for the select component
+     *
+     *  @since 2.4.0
+     */
+    label?: string;
+    /**
+     * Warning text for the select component
+     *
+     *  @since 2.4.0
+     **/
+    warningText?: string;
+    /**
+     * Info text for the select component
+     *
+     *  @since 2.4.0
+     **/
+    infoText?: string;
+    /**
+     * Error text for the select component
+     *
+     *  @since 2.4.0
+     **/
+    invalidText?: string;
+    /**
+     * Valid text for the select component
+     *
+     *  @since 2.4.0
+     **/
+    validText?: string;
+    /**
+     * Helper text for the select component
+     *
+     *  @since 2.4.0
+     **/
+    helperText?: string;
+    /**
+     * Show helper, error, info, warning text as tooltip
+     *
+     *  @since 2.4.0
+     */
+    showTextAsTooltip?: boolean;
     /**
      * Indices of selected items.
      * This corresponds to the value property of ix-select-items and therefor not necessarily the indices of the items in the list.
@@ -14,7 +74,7 @@ export declare class Select {
      * This corresponds to the value property of ix-select-items
      * @since 2.0.0
      */
-    value?: string | string[];
+    value: string | string[];
     /**
      * Show clear button
      */
@@ -79,14 +139,23 @@ export declare class Select {
      * Item added to selection
      */
     addItem: EventEmitter<string>;
+    /**
+     * Blur input
+     */
+    ixBlur: EventEmitter<void>;
     dropdownShow: boolean;
     selectedLabels: string[];
     dropdownWrapperRef: HTMLElement;
     dropdownAnchor: HTMLElement;
     isDropdownEmpty: boolean;
-    navigationItem: DropdownItemWrapper;
+    navigationItem: DropdownItemWrapper | null;
     inputFilterText: string;
-    inputValue: string;
+    inputValue: string | null;
+    isInvalid: boolean;
+    isValid: boolean;
+    isInfo: boolean;
+    isWarning: boolean;
+    private input;
     private inputRef;
     private dropdownRef;
     private customItemsContainerRef;
@@ -110,6 +179,10 @@ export declare class Select {
     watchValue(value: string | string[]): void;
     watchDropdownShow(show: boolean): void;
     onItemClicked(event: CustomEvent<string>): void;
+    updateFormInternalValue(value: string | string[]): Promise<void>;
+    /** @internal */
+    hasValidValue(): Promise<boolean>;
+    private hasValue;
     private focusDropdownItem;
     private itemClick;
     private emitAddItem;
@@ -134,5 +207,12 @@ export declare class Select {
     private onInputBlur;
     private placeholderValue;
     private isAddItemVisible;
+    onValidationChange({ isInvalid, isInvalidByRequired, isValid, isInfo, isWarning, }: ValidationResults): void;
+    /** @internal */
+    getAssociatedFormElement(): Promise<HTMLFormElement | null>;
+    /**
+     * Returns the native input element used in the component.
+     */
+    getNativeInputElement(): Promise<HTMLInputElement>;
     render(): any;
 }

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

@@ -1,6 +1,7 @@
 import { EventEmitter } from '../../stencil-public-runtime';
 import { ButtonVariant } from '../button/button';
 import { AlignedPlacement } from '../dropdown/placement';
+import { CloseBehavior } from '../dropdown/dropdown-controller';
 export type SplitButtonVariant = ButtonVariant;
 export declare class SplitButton {
     hostElement: HTMLIxSplitButtonElement;
@@ -8,6 +9,11 @@ export declare class SplitButton {
      * Color variant of button
      */
     variant: SplitButtonVariant;
+    /**
+     * Controls if the dropdown will be closed in response to a click event depending on the position of the event relative to the dropdown.
+     * @since 2.3.0
+     */
+    closeBehavior: CloseBehavior;
     /**
      * Button outline variant
      */

package/dist/types/components/text-field/input.fc.d.ts

@@ -0,0 +1,50 @@
+import { MakeRef } from '../utils/make-ref';
+import { A11yAttributes } from '../utils/a11y';
+export declare function TextareaElement(props: {
+    textareaHeight?: string;
+    textareaWidth?: string;
+    textareaRows?: string;
+    textareaCols?: string;
+    disabled: boolean;
+    readonly: boolean;
+    maxLength?: number;
+    minLength?: number;
+    isInvalid: boolean;
+    required: boolean;
+    value: string;
+    placeholder?: string;
+    textAreaRef: (el: HTMLTextAreaElement) => 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) => void;
+    onKeyPress: (event: KeyboardEvent) => void;
+    valueChange: (value: string) => void;
+    updateFormInternalValue: (value: string) => void;
+    onBlur: () => void;
+    ariaAttributes?: A11yAttributes;
+}): any;
+export declare function PostfixSlot(props: {
+    postfixRef: MakeRef<HTMLDivElement>;
+    onSlotChange?: (e: Event) => void;
+}, children: any): any;
+export declare function PrefixSlot(props: {
+    prefixRef: MakeRef<HTMLDivElement>;
+    onSlotChange?: (e: Event) => void;
+}): any;