@siemens/ix 2.5.0 → 2.6.0

package/dist/types/components.d.ts

@@ -20,14 +20,17 @@ import { ColumnSize } from "./components/col/col";
 import { ContentHeaderVariant } from "./components/content-header/content-header";
 import { CssGridTemplateType } from "./components/css-grid/css-grid";
 import { DateDropdownOption, DateRangeChangeEvent } from "./components/date-dropdown/date-dropdown";
+import { DateInputValidityState } from "./components/date-input/date-input";
 import { DateTimeCardCorners } from "./components/date-time-card/date-time-card";
 import { DateChangeEvent } from "./components/date-picker/date-picker";
 import { DateTimeCardCorners as DateTimeCardCorners1 } from "./components/date-time-card/date-time-card";
 import { DateTimeDateChangeEvent, DateTimeSelectEvent } from "./components/datetime-picker/datetime-picker";
+import { ElementReference } from "./components/utils/element-reference";
 import { CloseBehavior } from "./components/dropdown/dropdown-controller";
 import { AlignedPlacement, Side } from "./components/dropdown/placement";
 import { DropdownButtonVariant } from "./components/dropdown-button/dropdown-button";
 import { EmptyStateLayout } from "./components/empty-state/empty-state";
+import { MakeRef } from "./components/utils/make-ref";
 import { FlipTileState } from "./components/flip-tile/flip-tile-state";
 import { IconButtonVariant } from "./components/icon-button/icon-button";
 import { ButtonVariant as ButtonVariant1 } from "./components/button/button";
@@ -39,12 +42,14 @@ import { PushCardVariant } from "./components/push-card/push-card";
 import { SliderMarker } from "./components/slider/slider";
 import { SplitButtonVariant } from "./components/split-button/split-button";
 import { TabClickDetail } from "./components/tab-item/tab-item";
+import { TextareaResizeBehavior } from "./components/input/textarea";
 import { TimePickerCorners } from "./components/time-picker/time-picker";
 import { ToastConfig, ToastType } from "./components/toast/toast-utils";
 import { ShowToastResult } from "./components/toast/toast-container";
+import { ElementReference as ElementReference1 } from "./components.d";
 import { Element } from "./stencil-public-runtime";
 import { TreeContext, TreeItemContext, TreeModel, UpdateCallback } from "./components/tree/tree-model";
-import { TextDecoration, TypographyColors, TypographyFormat, TypographyVariants } from "./components/typography/typography";
+import { TextDecoration, TypographyColors, TypographyFormat } from "./components/typography/typography";
 import { UploadFileState } from "./components/upload/upload-file-state";
 export { ActionCardVariant } from "./components/action-card/action-card";
 export { IxTheme } from "./components/utils/theme-switcher";
@@ -61,14 +66,17 @@ export { ColumnSize } from "./components/col/col";
 export { ContentHeaderVariant } from "./components/content-header/content-header";
 export { CssGridTemplateType } from "./components/css-grid/css-grid";
 export { DateDropdownOption, DateRangeChangeEvent } from "./components/date-dropdown/date-dropdown";
+export { DateInputValidityState } from "./components/date-input/date-input";
 export { DateTimeCardCorners } from "./components/date-time-card/date-time-card";
 export { DateChangeEvent } from "./components/date-picker/date-picker";
 export { DateTimeCardCorners as DateTimeCardCorners1 } from "./components/date-time-card/date-time-card";
 export { DateTimeDateChangeEvent, DateTimeSelectEvent } from "./components/datetime-picker/datetime-picker";
+export { ElementReference } from "./components/utils/element-reference";
 export { CloseBehavior } from "./components/dropdown/dropdown-controller";
 export { AlignedPlacement, Side } from "./components/dropdown/placement";
 export { DropdownButtonVariant } from "./components/dropdown-button/dropdown-button";
 export { EmptyStateLayout } from "./components/empty-state/empty-state";
+export { MakeRef } from "./components/utils/make-ref";
 export { FlipTileState } from "./components/flip-tile/flip-tile-state";
 export { IconButtonVariant } from "./components/icon-button/icon-button";
 export { ButtonVariant as ButtonVariant1 } from "./components/button/button";
@@ -80,12 +88,14 @@ export { PushCardVariant } from "./components/push-card/push-card";
 export { SliderMarker } from "./components/slider/slider";
 export { SplitButtonVariant } from "./components/split-button/split-button";
 export { TabClickDetail } from "./components/tab-item/tab-item";
+export { TextareaResizeBehavior } from "./components/input/textarea";
 export { TimePickerCorners } from "./components/time-picker/time-picker";
 export { ToastConfig, ToastType } from "./components/toast/toast-utils";
 export { ShowToastResult } from "./components/toast/toast-container";
+export { ElementReference as ElementReference1 } from "./components.d";
 export { Element } from "./stencil-public-runtime";
 export { TreeContext, TreeItemContext, TreeModel, UpdateCallback } from "./components/tree/tree-model";
-export { TextDecoration, TypographyColors, TypographyFormat, TypographyVariants } from "./components/typography/typography";
+export { TextDecoration, TypographyColors, TypographyFormat } from "./components/typography/typography";
 export { UploadFileState } from "./components/upload/upload-file-state";
 export namespace Components {
     /**
@@ -95,7 +105,7 @@ export namespace Components {
         /**
           * Card heading
          */
-        "heading": string;
+        "heading"?: string;
         /**
           * Card icon
          */
@@ -107,7 +117,7 @@ export namespace Components {
         /**
           * Card subheading
          */
-        "subheading": string;
+        "subheading"?: string;
         /**
           * Card variant
           * @deprecated variant "insight" and "notification" will be removed in 3.0. Use "outline" or "filled" instead.
@@ -163,20 +173,20 @@ export namespace Components {
           * Optional description text that will be displayed underneath the username. Note: Only working if avatar is part of the ix-application-header
           * @since 2.1.0
          */
-        "extra": string;
+        "extra"?: string;
         /**
           * Display an avatar image
          */
-        "image": string;
+        "image"?: string;
         /**
           * Display the initials of the user. Will be overwritten by image
          */
-        "initials": string;
+        "initials"?: string;
         /**
           * If set an info card displaying the username will be placed inside the dropdown. Note: Only working if avatar is part of the ix-application-header
           * @since 2.1.0
          */
-        "username": string;
+        "username"?: string;
     }
     interface IxBasicNavigation {
         /**
@@ -206,16 +216,16 @@ export namespace Components {
           * Optional icon to be displayed next to the header label
           * @since 1.5.0
          */
-        "icon": string;
+        "icon"?: string;
         /**
           * Label of blind
          */
-        "label": string;
+        "label"?: string;
         /**
           * Secondary label inside blind header
           * @since 2.0.0
          */
-        "sublabel": string;
+        "sublabel"?: string;
         /**
           * Blind variant
           * @since 2.0.0
@@ -268,7 +278,7 @@ export namespace Components {
         /**
           * Icon name
          */
-        "icon": string;
+        "icon"?: string;
         "iconSize": '12' | '16' | '24';
         /**
           * Loading button
@@ -342,7 +352,7 @@ export namespace Components {
         /**
           * Name the card list
          */
-        "label": string;
+        "label"?: string;
         /**
           * List style
          */
@@ -354,7 +364,7 @@ export namespace Components {
         /**
           * Overwrite the default show all count.
          */
-        "showAllCount": number | undefined;
+        "showAllCount"?: number;
         /**
           * Suppress the overflow handling of child elements
          */
@@ -428,6 +438,80 @@ export namespace Components {
         "suggestions"?: string[];
         "tmpDisableScrollIntoView": boolean;
     }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface IxCheckbox {
+        /**
+          * Checked state of the checkbox component
+         */
+        "checked": boolean;
+        /**
+          * Disabled state of the checkbox component
+         */
+        "disabled": boolean;
+        "getAssociatedFormElement": () => Promise<HTMLFormElement | null>;
+        "hasValidValue": () => Promise<boolean>;
+        /**
+          * Indeterminate state of the checkbox component
+         */
+        "indeterminate": boolean;
+        /**
+          * Label for the checkbox component
+         */
+        "label"?: string;
+        /**
+          * Name of the checkbox component
+         */
+        "name"?: string;
+        /**
+          * Required state of the checkbox component.  If true, checkbox needs to be checked to be valid
+         */
+        "required": boolean;
+        /**
+          * Value of the checkbox component
+         */
+        "value": string;
+    }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface IxCheckboxGroup {
+        /**
+          * Alignment of the checkboxes in the group
+         */
+        "direction": 'row' | 'column';
+        /**
+          * Optional helper text displayed below the checkbox group
+         */
+        "helperText"?: string;
+        /**
+          * Info text for the checkbox group
+         */
+        "infoText"?: string;
+        /**
+          * Error text for the checkbox group
+         */
+        "invalidText"?: string;
+        /**
+          * Label for the checkbox group
+         */
+        "label"?: string;
+        /**
+          * Show helper, info, warning, error and valid text as tooltip
+         */
+        "showTextAsTooltip": boolean;
+        /**
+          * Valid text for the checkbox group
+         */
+        "validText"?: string;
+        /**
+          * Warning text for the checkbox group
+         */
+        "warningText"?: string;
+    }
     interface IxChip {
         /**
           * Determines if the chip is interactive. If false no user input (e.g. mouse states, keyboard navigation) will be possible and also the close button will not be present.
@@ -508,7 +592,7 @@ export namespace Components {
         /**
           * Title of Header
          */
-        "headerTitle": string;
+        "headerTitle"?: string;
         /**
           * Variant of content header
          */
@@ -518,7 +602,7 @@ export namespace Components {
         /**
           * Define css grid template
          */
-        "templates": Partial<Record<CssGridTemplateType, string[][]>>;
+        "templates"?: Partial<Record<CssGridTemplateType, string[][]>>;
     }
     interface IxCssGridItem {
         /**
@@ -526,6 +610,43 @@ export namespace Components {
          */
         "itemName": string;
     }
+    /**
+     * @since 2.6.0
+     */
+    interface IxCustomField {
+        /**
+          * Show text below the field component which show additional information
+         */
+        "helperText"?: string;
+        /**
+          * Info text for the field component
+         */
+        "infoText"?: string;
+        /**
+          * Error text for the field component
+         */
+        "invalidText"?: string;
+        /**
+          * Label for the field component
+         */
+        "label"?: string;
+        /**
+          * A value is required or must be checked for the form to be submittable
+         */
+        "required": boolean;
+        /**
+          * Show helper, info, warning, error and valid text as tooltip
+         */
+        "showTextAsTooltip"?: boolean;
+        /**
+          * Valid text for the field component
+         */
+        "validText"?: string;
+        /**
+          * Warning text for the field component
+         */
+        "warningText"?: string;
+    }
     /**
      * @since 2.1.0
      */
@@ -572,6 +693,11 @@ export namespace Components {
           * Text for the done button. Will be used for translation.
          */
         "i18nNoRange": string;
+        /**
+          * Locale identifier (e.g. 'en' or 'de').
+          * @since 2.6.0
+         */
+        "locale"?: string;
         /**
           * The latest date that can be selected by the date picker. If not set there will be no restriction.
          */
@@ -589,6 +715,93 @@ export namespace Components {
          */
         "to": string;
         "today": string;
+        /**
+          * The index of which day to start the week on, based on the Locale#weekdays array. E.g. if the locale is en-us, weekStartIndex = 1 results in starting the week on monday.
+          * @since 2.6.0
+         */
+        "weekStartIndex": number;
+    }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface IxDateInput {
+        /**
+          * disabled attribute
+         */
+        "disabled": boolean;
+        /**
+          * Focuses the input field
+         */
+        "focusInput": () => Promise<void>;
+        /**
+          * Date format string. See {@link "https://moment.github.io/luxon/#/formatting?id=table-of-tokens"} for all available tokens.
+         */
+        "format": string;
+        "getAssociatedFormElement": () => Promise<HTMLFormElement | null>;
+        /**
+          * Get the native input element
+         */
+        "getNativeInputElement": () => Promise<HTMLInputElement>;
+        "getValidityState": () => Promise<ValidityState>;
+        "hasValidValue": () => Promise<boolean>;
+        /**
+          * helper text below the input field
+         */
+        "helperText"?: string;
+        /**
+          * i18n string for the error message when the date is not parsable
+         */
+        "i18nErrorDateUnparsable": string;
+        /**
+          * info text below the input field
+         */
+        "infoText"?: string;
+        /**
+          * error text below the input field
+         */
+        "invalidText"?: string;
+        /**
+          * label of the input field
+         */
+        "label"?: string;
+        /**
+          * Locale identifier (e.g. 'en' or 'de').
+          * @since 2.6.0
+         */
+        "locale"?: string;
+        /**
+          * name of the input element
+         */
+        "name"?: string;
+        /**
+          * placeholder of the input element
+         */
+        "placeholder"?: string;
+        /**
+          * readonly attribute
+         */
+        "readonly": boolean;
+        /**
+          * required attribute
+         */
+        "required"?: boolean;
+        /**
+          * show text as tooltip
+         */
+        "showTextAsTooltip"?: boolean;
+        /**
+          * valid text below the input field
+         */
+        "validText"?: string;
+        /**
+          * value of the input element
+         */
+        "value": string;
+        /**
+          * warning text below the input field
+         */
+        "warningText"?: string;
     }
     interface IxDatePicker {
         /**
@@ -624,10 +837,10 @@ export namespace Components {
          */
         "individual": boolean;
         /**
-          * Format of time string See {@link "https://moment.github.io/luxon/#/formatting?id=table-of-tokens"} for all available tokens.
+          * Locale identifier (e.g. 'en' or 'de').
           * @since 2.1.0
          */
-        "locale": string;
+        "locale"?: string;
         /**
           * The latest date that can be selected by the date picker. If not set there will be no restriction.
           * @since 1.1.0
@@ -670,7 +883,7 @@ export namespace Components {
           * set styles
          */
         "individual": boolean;
-        "standaloneAppearance": any;
+        "standaloneAppearance"?: boolean;
     }
     interface IxDatetimePicker {
         /**
@@ -688,7 +901,7 @@ export namespace Components {
           * The selected starting date. If the picker is not in range mode this is the selected date. Format has to match the `format` property.
           * @since 1.1.0
          */
-        "from": string | undefined;
+        "from"?: string;
         /**
           * Text of date select button
           * @since 2.1.0
@@ -698,17 +911,17 @@ export namespace Components {
           * Format of time string See {@link "https://moment.github.io/luxon/#/formatting?id=table-of-tokens"} for all available tokens.
           * @since 2.1.0
          */
-        "locale": string;
+        "locale"?: string;
         /**
           * The latest date that can be selected by the date picker. If not set there will be no restriction.
           * @since 1.1.0
          */
-        "maxDate": string;
+        "maxDate"?: string;
         /**
           * The earliest date that can be selected by the date picker. If not set there will be no restriction.
           * @since 1.1.0
          */
-        "minDate": string;
+        "minDate"?: string;
         /**
           * If true a date-range can be selected (from/to).
          */
@@ -730,18 +943,18 @@ export namespace Components {
           * @see { this.timeFormat}
           * @since 1.1.0
          */
-        "showTimeReference": any;
+        "showTimeReference": boolean;
         /**
           * Text of date select button
           * @since 1.1.0
           * @deprecated since 2.1.0. Use `i18nDone`
          */
-        "textSelectDate": string;
+        "textSelectDate"?: string;
         /**
           * Select time with format string
           * @since 1.1.0
          */
-        "time": string;
+        "time"?: string;
         /**
           * Time format string. See {@link "https://moment.github.io/luxon/#/formatting?id=table-of-tokens"} for all available tokens.
           * @since 1.1.0
@@ -750,12 +963,12 @@ export namespace Components {
         /**
           * Set time reference
          */
-        "timeReference": 'AM' | 'PM';
+        "timeReference"?: 'AM' | 'PM';
         /**
           * The selected end date. If the the picker is not in range mode this property has no impact. Format has to match the `format` property.
           * @since 1.1.0
          */
-        "to": string | undefined;
+        "to"?: string;
         /**
           * The index of which day to start the week on, based on the Locale#weekdays array. E.g. if the locale is en-us, weekStartIndex = 1 results in starting the week on monday.
           * @since 2.1.0
@@ -802,7 +1015,7 @@ export namespace Components {
         /**
           * Define an anchor element
          */
-        "anchor": string | HTMLElement;
+        "anchor"?: ElementReference;
         /**
           * Controls if the dropdown will be closed in response to a click event depending on the position of the event relative to the dropdown. If the dropdown is a child of another one, it will be closed with the parent, regardless of its own close behavior.
          */
@@ -817,12 +1030,12 @@ export namespace Components {
         /**
           * Move dropdown along main axis of alignment
          */
-        "offset": {
+        "offset"?: {
     mainAxis?: number;
     crossAxis?: number;
     alignmentAxis?: number;
   };
-        "overwriteDropdownStyle": (delegate: {
+        "overwriteDropdownStyle"?: (delegate: {
     dropdownRef: HTMLElement;
     triggerRef?: HTMLElement;
   }) => Promise<Partial<CSSStyleDeclaration>>;
@@ -843,10 +1056,11 @@ export namespace Components {
           * @since 2.0.0
          */
         "suppressAutomaticPlacement": boolean;
+        "suppressOverflowBehavior": boolean;
         /**
           * Define an element that triggers the dropdown. A trigger can either be a string that will be interpreted as id attribute or a DOM element.
          */
-        "trigger": string | HTMLElement | Promise<HTMLElement>;
+        "trigger"?: ElementReference;
         /**
           * Update position of dropdown
          */
@@ -872,11 +1086,11 @@ export namespace Components {
         /**
           * Button icon
          */
-        "icon": string;
+        "icon"?: string;
         /**
           * Set label
          */
-        "label": string;
+        "label"?: string;
         /**
           * Outline button
          */
@@ -885,7 +1099,7 @@ export namespace Components {
           * Placement of the dropdown
           * @since 2.0.0
          */
-        "placement": AlignedPlacement;
+        "placement"?: AlignedPlacement;
         /**
           * Button variant
          */
@@ -987,7 +1201,7 @@ export namespace Components {
           * @link https://ix.siemens.io/docs/theming/colors/
           * @deprecated since 2.1.0 use `item-color`
          */
-        "color": string;
+        "color"?: string;
         /**
           * Disable event list item
          */
@@ -996,7 +1210,7 @@ export namespace Components {
           * Color of the status indicator. You can find a list of all available colors in our documentation. Example values are `--theme-color-alarm` or `color-alarm`
           * @link https://ix.siemens.io/docs/theming/colors/
          */
-        "itemColor": string;
+        "itemColor"?: string;
         /**
           * Show event list item as selected
          */
@@ -1021,6 +1235,76 @@ export namespace Components {
          */
         "value": string;
     }
+    interface IxFieldLabel {
+        "controlRef"?: MakeRef<HTMLElement>;
+        /**
+          * The id of the form element that the label is associated with
+         */
+        "htmlFor"?: string;
+        "isInvalid": boolean;
+        /**
+          * A value is required or must be checked for the form to be submittable
+         */
+        "required"?: boolean;
+    }
+    interface IxFieldWrapper {
+        /**
+          * The control element that the label is associated with
+         */
+        "controlRef"?: MakeRef<HTMLElement>;
+        /**
+          * Show text below the field component
+         */
+        "helperText"?: string;
+        /**
+          * The id of the form element that the label is associated with
+         */
+        "htmlForLabel"?: string;
+        /**
+          * Info text for the field component
+         */
+        "infoText"?: string;
+        /**
+          * Error text for the field component
+         */
+        "invalidText"?: string;
+        /**
+          * Is the field component info
+         */
+        "isInfo": boolean;
+        /**
+          * Is the field component invalid
+         */
+        "isInvalid": boolean;
+        /**
+          * Is the field component valid
+         */
+        "isValid": boolean;
+        /**
+          * Is the field component warning
+         */
+        "isWarning": boolean;
+        /**
+          * Label for the field component
+         */
+        "label"?: string;
+        /**
+          * Show label as required
+         */
+        "required": boolean;
+        /**
+          * Show helper, error, info, warning text as tooltip
+         */
+        "showTextAsTooltip": boolean;
+        /**
+          * Valid text for the field component
+         */
+        "validText"?: string;
+        /**
+          * Warning text for the field component
+         */
+        "warningText"?: string;
+    }
     interface IxFilterChip {
         /**
           * If true the filter chip will be in disabled state
@@ -1054,12 +1338,6 @@ export namespace Components {
          */
         "contentVisible": boolean;
     }
-    interface IxFormField {
-        /**
-          * Label
-         */
-        "label": string;
-    }
     interface IxGroup {
         /**
           * Whether the group is collapsed or expanded. Defaults to true.
@@ -1122,6 +1400,32 @@ export namespace Components {
          */
         "text"?: string;
     }
+    interface IxHelperText {
+        /**
+          * Show text below the field component
+         */
+        "helperText"?: string;
+        /**
+          * The id of the form element that the label is associated with
+         */
+        "htmlFor"?: string;
+        /**
+          * Info text for the field component
+         */
+        "infoText"?: string;
+        /**
+          * Error text for the field component
+         */
+        "invalidText"?: string;
+        /**
+          * Valid text for the field component
+         */
+        "validText"?: string;
+        /**
+          * Warning text for the field component
+         */
+        "warningText"?: string;
+    }
     interface IxIconButton {
         /**
           * Accessibility label for the icon button Will be set as aria-label on the nested HTML button element
@@ -1214,64 +1518,164 @@ export namespace Components {
          */
         "variant": ButtonVariant1;
     }
-    interface IxInputGroup {
-    }
     /**
-     * @since 1.6.0
+     * @since 2.6.0
+     * @form-ready 2.6.0
      */
-    interface IxKeyValue {
+    interface IxInput {
         /**
-          * Optional key value icon
+          * The allowed characters pattern for the text field.
          */
-        "icon": string;
+        "allowedCharactersPattern"?: string;
         /**
-          * Key value label
+          * Specifies whether the text field is disabled.
          */
-        "label": string;
+        "disabled": boolean;
         /**
-          * Optional key value label position - 'top' or 'left'
+          * Focuses the input field
          */
-        "labelPosition": KeyValueLabelPosition;
+        "focusInput": () => Promise<void>;
+        "getAssociatedFormElement": () => Promise<HTMLFormElement | null>;
         /**
-          * Optional key value text value
+          * Returns the native input element used in the text field.
          */
-        "value": string;
-    }
-    /**
-     * @since 1.6.0
-     */
-    interface IxKeyValueList {
+        "getNativeInputElement": () => Promise<HTMLInputElement>;
+        "hasValidValue": () => Promise<boolean>;
         /**
-          * Optional striped key value list style
+          * The helper text for the text field.
          */
-        "striped": boolean;
-    }
-    interface IxKpi {
-        "label": string;
-        "orientation": 'horizontal' | 'vertical';
-        "state": 'neutral' | 'warning' | 'alarm';
-        "unit": string;
-        "value": string | number;
-    }
-    /**
-     * @since 2.0.0
-     */
-    interface IxLayoutGrid {
+        "helperText"?: string;
         /**
-          * Overwrite the default number of columns. Choose between 2 and 12 columns.
+          * The info text for the text field.
          */
-        "columns": number;
+        "infoText"?: string;
         /**
-          * Grid gap
+          * The error text for the text field.
          */
-        "gap": '8' | '12' | '16' | '24';
+        "invalidText"?: string;
         /**
-          * The grid will not have any horizontal padding
+          * The label for the text field.
          */
-        "noMargin": boolean;
-    }
-    /**
-     * @since 2.0.0
+        "label"?: string;
+        /**
+          * The maximum length of the text field.
+         */
+        "maxLength"?: number;
+        /**
+          * The minimum length of the text field.
+         */
+        "minLength"?: number;
+        /**
+          * The name of the text field.
+         */
+        "name"?: string;
+        /**
+          * The pattern for the text field.
+         */
+        "pattern"?: string;
+        /**
+          * The placeholder text for the text field.
+         */
+        "placeholder"?: string;
+        /**
+          * Specifies whether the text field is readonly.
+         */
+        "readonly": boolean;
+        /**
+          * Specifies whether the text field is required.
+         */
+        "required": boolean;
+        /**
+          * Specifies whether to show the text as a tooltip.
+         */
+        "showTextAsTooltip"?: boolean;
+        /**
+          * The type of the text field. Possible values are 'text', 'email', or 'password'.
+         */
+        "type": 'text' | 'email' | 'password' | 'tel' | 'url';
+        /**
+          * The valid text for the text field.
+         */
+        "validText"?: string;
+        /**
+          * The value of the text field.
+         */
+        "value": string;
+        /**
+          * The warning text for the text field.
+         */
+        "warningText"?: string;
+    }
+    interface IxInputGroup {
+    }
+    /**
+     * @since 1.6.0
+     */
+    interface IxKeyValue {
+        /**
+          * Optional key value icon
+         */
+        "icon": string;
+        /**
+          * Key value label
+         */
+        "label": string;
+        /**
+          * Optional key value label position - 'top' or 'left'
+         */
+        "labelPosition": KeyValueLabelPosition;
+        /**
+          * Optional key value text value
+         */
+        "value": string;
+    }
+    /**
+     * @since 1.6.0
+     */
+    interface IxKeyValueList {
+        /**
+          * Optional striped key value list style
+         */
+        "striped": boolean;
+    }
+    interface IxKpi {
+        "label": string;
+        "orientation": 'horizontal' | 'vertical';
+        "state": 'neutral' | 'warning' | 'alarm';
+        "unit": string;
+        "value": string | number;
+    }
+    /**
+     * @since 2.6.0
+     */
+    interface IxLayoutAuto {
+        /**
+          * Defines the layout of the form.
+         */
+        "layout": {
+    minWidth: string;
+    columns: number;
+  }[];
+    }
+    /**
+     * @since 2.0.0
+     */
+    interface IxLayoutGrid {
+        /**
+          * Overwrite the default number of columns. Choose between 2 and 12 columns.
+         */
+        "columns": number;
+        /**
+          * Grid gap
+         */
+        "gap": '8' | '12' | '16' | '24';
+        /**
+          * The grid will not have any horizontal padding
+         */
+        "noMargin": boolean;
+    }
+    /**
+     * @since 2.0.0
      */
     interface IxLinkButton {
         /**
@@ -1348,7 +1752,7 @@ export namespace Components {
         /**
           * Should only be set if you use ix-menu standalone
          */
-        "applicationName": string;
+        "applicationName"?: string;
         /**
           * Internal
          */
@@ -1658,8 +2062,6 @@ export namespace Components {
      */
     interface IxModalContent {
     }
-    interface IxModalExample {
-    }
     /**
      * @since 2.0.0
      */
@@ -1676,14 +2078,102 @@ export namespace Components {
         /**
           * Icon of the Header
          */
-        "icon": string;
+        "icon"?: string;
         /**
           * Icon color
          */
-        "iconColor": string;
+        "iconColor"?: string;
     }
     interface IxModalLoading {
     }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface IxNumberInput {
+        /**
+          * The allowed characters pattern for the input field
+         */
+        "allowedCharactersPattern"?: string;
+        /**
+          * Disables the input field
+         */
+        "disabled": boolean;
+        /**
+          * Focuses the input field
+         */
+        "focusInput": () => Promise<void>;
+        "getAssociatedFormElement": () => Promise<HTMLFormElement | null>;
+        /**
+          * Returns the native input element used under the hood
+         */
+        "getNativeInputElement": () => Promise<HTMLInputElement>;
+        "hasValidValue": () => Promise<boolean>;
+        /**
+          * The helper text for the input field
+         */
+        "helperText"?: string;
+        /**
+          * The info text for the input field
+         */
+        "infoText"?: string;
+        /**
+          * The error text for the input field
+         */
+        "invalidText"?: string;
+        /**
+          * The label for the input field
+         */
+        "label"?: string;
+        /**
+          * The maximum value for the input field
+         */
+        "max"?: string | number;
+        /**
+          * The minimum value for the input field
+         */
+        "min"?: string | number;
+        /**
+          * name of the input element
+         */
+        "name"?: string;
+        /**
+          * The pattern for the input field
+         */
+        "pattern"?: string;
+        /**
+          * placeholder of the input element
+         */
+        "placeholder"?: string;
+        /**
+          * Indicates if the field is read-only
+         */
+        "readonly": boolean;
+        /**
+          * Indicates if the field is required
+         */
+        "required": boolean;
+        /**
+          * Indicates if the stepper buttons should be shown
+         */
+        "showStepperButtons"?: boolean;
+        /**
+          * Indicates if the text should be shown as a tooltip
+         */
+        "showTextAsTooltip"?: boolean;
+        /**
+          * The valid text for the input field
+         */
+        "validText"?: string;
+        /**
+          * The value of the input field
+         */
+        "value": number;
+        /**
+          * The warning text for the input field
+         */
+        "warningText"?: string;
+    }
     /**
      * @since 1.5.0
      */
@@ -1740,7 +2230,7 @@ export namespace Components {
         /**
           * Title of the side panel
          */
-        "heading": string;
+        "heading"?: string;
         /**
           * Define if the pane should have a collapsed state
          */
@@ -1748,7 +2238,7 @@ export namespace Components {
         /**
           * Name of the icon
          */
-        "icon": string;
+        "icon"?: string;
         "ignoreLayoutSettings": boolean;
         "isMobile": boolean;
         /**
@@ -1821,8 +2311,6 @@ export namespace Components {
     | 'success'
     | 'custom';
     }
-    interface IxPlaygroundInternal {
-    }
     /**
      * @since 1.6.0
      */
@@ -1854,11 +2342,84 @@ export namespace Components {
          */
         "variant": PushCardVariant;
     }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface IxRadio {
+        /**
+          * Checked state of the radio component
+         */
+        "checked": boolean;
+        /**
+          * Disabled state of the radio component
+         */
+        "disabled": boolean;
+        "getAssociatedFormElement": () => Promise<HTMLFormElement | null>;
+        "hasValidValue": () => Promise<boolean>;
+        /**
+          * Label for the radio component
+         */
+        "label"?: string;
+        /**
+          * Name of the radio component
+         */
+        "name"?: string;
+        /**
+          * Value of the radio component
+         */
+        "value"?: string;
+    }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface IxRadioGroup {
+        /**
+          * Alignment of the radio buttons in the group
+         */
+        "direction": 'column' | 'row';
+        /**
+          * Show text below the field component
+         */
+        "helperText"?: string;
+        /**
+          * Info text for the field component
+         */
+        "infoText"?: string;
+        /**
+          * Error text for the field component
+         */
+        "invalidText"?: string;
+        /**
+          * Label for the field component
+         */
+        "label"?: string;
+        /**
+          * Show helper, info, warning, error and valid text as tooltip
+         */
+        "showTextAsTooltip"?: boolean;
+        /**
+          * Valid text for the field component
+         */
+        "validText"?: string;
+        /**
+          * Value of the radiobutton group component
+         */
+        "value"?: string;
+        /**
+          * Warning text for the field component
+         */
+        "warningText"?: string;
+    }
     /**
      * @since 2.0.0
      */
     interface IxRow {
     }
+    /**
+     * @form-ready 2.6.0
+     */
     interface IxSelect {
         /**
           * Show clear button
@@ -1872,13 +2433,28 @@ export namespace Components {
           * Select is extendable
          */
         "editable": boolean;
+        /**
+          * Focuses the input field
+         */
+        "focusInput": () => Promise<void>;
+        "getAssociatedFormElement": () => Promise<HTMLFormElement | null>;
+        /**
+          * Returns the native input element used in the component.
+         */
+        "getNativeInputElement": () => Promise<HTMLInputElement>;
+        "hasValidValue": () => Promise<boolean>;
+        /**
+          * Helper text for the select component
+          * @since 2.6.0
+         */
+        "helperText"?: string;
         /**
           * Hide list header
           * @since 1.5.0
          */
         "hideListHeader": boolean;
         /**
-          * Hint inside of dropdown if no items where found with current filter text
+          * Information inside of dropdown if no items where found with current filter text
           * @since 1.5.0
          */
         "i18nNoMatches": string;
@@ -1894,24 +2470,64 @@ export namespace Components {
           * Select list header
          */
         "i18nSelectListHeader": string;
+        /**
+          * Info text for the select component
+          * @since 2.6.0
+         */
+        "infoText"?: string;
+        /**
+          * Error text for the select component
+          * @since 2.6.0
+         */
+        "invalidText"?: string;
+        /**
+          * Label for the select component
+          * @since 2.6.0
+         */
+        "label"?: string;
         /**
           * Selection mode
          */
         "mode": 'single' | 'multiple';
+        /**
+          * A string that represents the element's name attribute, containing a name that identifies the element when submitting the form.
+          * @since 2.6.0
+         */
+        "name"?: string;
         /**
           * If true the select will be in readonly mode
          */
         "readonly": boolean;
+        /**
+          * A Boolean attribute indicating that an option with a non-empty string value must be selected
+          * @since 2.6.0
+         */
+        "required": 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.
           * @deprecated since 2.0.0. Use the `value` property instead.
          */
         "selectedIndices"?: string | string[];
+        /**
+          * Show helper, error, info, warning text as tooltip
+          * @since 2.6.0
+         */
+        "showTextAsTooltip"?: boolean;
+        /**
+          * Valid text for the select component
+          * @since 2.6.0
+         */
+        "validText"?: string;
         /**
           * Current selected value. This corresponds to the value property of ix-select-items
           * @since 2.0.0
          */
-        "value"?: string | string[];
+        "value": string | string[];
+        /**
+          * Warning text for the select component
+          * @since 2.6.0
+         */
+        "warningText"?: string;
     }
     interface IxSelectItem {
         "getDropdownItemElement": () => Promise<HTMLIxDropdownItemElement>;
@@ -1919,7 +2535,7 @@ export namespace Components {
         /**
           * Displayed name of the item
          */
-        "label": string;
+        "label"?: string;
         /**
           * @param event
          */
@@ -2096,55 +2712,151 @@ export namespace Components {
          */
         "small": boolean;
     }
-    interface IxTile {
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface IxTextarea {
         /**
-          * Size of the tile - one of 'small', 'medium' or 'large'
+          * Determines if the textarea field is disabled.
          */
-        "size": 'small' | 'medium' | 'big';
-    }
-    interface IxTimePicker {
+        "disabled": boolean;
         /**
-          * Corner style
+          * Focuses the input field
          */
-        "corners": TimePickerCorners;
+        "focusInput": () => Promise<void>;
+        "getAssociatedFormElement": () => Promise<HTMLFormElement | null>;
         /**
-          * Format of time string See {@link "https://moment.github.io/luxon/#/formatting?id=table-of-tokens"} for all available tokens.
-          * @since 1.1.0
+          * Get the native textarea element.
          */
-        "format": string;
+        "getNativeInputElement": () => Promise<HTMLTextAreaElement>;
+        "hasValidValue": () => Promise<boolean>;
         /**
-          * Get the current time based on the wanted format
+          * The helper text for the textarea field.
          */
-        "getCurrentTime": () => Promise<string>;
+        "helperText"?: string;
         /**
-          * @deprecated Not supported since 2.0.0.
+          * The info text for the textarea field.
          */
-        "individual": boolean;
+        "infoText"?: string;
         /**
-          * Show hour input
+          * The error text for the textarea field.
          */
-        "showHour": boolean;
+        "invalidText"?: string;
         /**
-          * Show minutes input
+          * The label for the textarea field.
          */
-        "showMinutes": boolean;
+        "label"?: string;
         /**
-          * Show seconds input
+          * The maximum length of the textarea field.
          */
-        "showSeconds": boolean;
+        "maxLength"?: number;
         /**
-          * Show time reference input
-          * @since 1.1.0 time reference is default aligned with format tt
-          * @deprecated Since 2.0.0 time reference will be displayed depending on format.
+          * The minimum length of the textarea field.
          */
-        "showTimeReference"?: boolean;
+        "minLength"?: number;
         /**
-          * Controls the visual presentation and styling of the component when it is displayed as a standalone element
+          * The name of the textarea field.
          */
-        "standaloneAppearance": boolean;
+        "name"?: string;
         /**
-          * Text of date select button
-          * @since 1.1.0
+          * The placeholder text for the textarea field.
+         */
+        "placeholder"?: string;
+        /**
+          * Determines if the textarea field is readonly.
+         */
+        "readonly": boolean;
+        /**
+          * Determines if the textarea field is required.
+         */
+        "required": boolean;
+        /**
+          * Determines the resize behavior of the textarea field. Resizing can be enabled in one direction, both directions or completely disabled.
+         */
+        "resizeBehavior": TextareaResizeBehavior;
+        /**
+          * Determines if the text should be displayed as a tooltip.
+         */
+        "showTextAsTooltip"?: boolean;
+        /**
+          * The width of the textarea specified by number of characters.
+         */
+        "textareaCols"?: number;
+        /**
+          * The height of the textarea field (e.g. "52px").
+         */
+        "textareaHeight"?: string;
+        /**
+          * The height of the textarea specified by number of rows.
+         */
+        "textareaRows"?: number;
+        /**
+          * The width of the textarea field (e.g. "200px").
+         */
+        "textareaWidth"?: string;
+        /**
+          * The valid text for the textarea field.
+         */
+        "validText"?: string;
+        /**
+          * The value of the textarea field.
+         */
+        "value": string;
+        /**
+          * The warning text for the textarea field.
+         */
+        "warningText"?: string;
+    }
+    interface IxTile {
+        /**
+          * Size of the tile - one of 'small', 'medium' or 'large'
+         */
+        "size": 'small' | 'medium' | 'big';
+    }
+    interface IxTimePicker {
+        /**
+          * Corner style
+         */
+        "corners": TimePickerCorners;
+        /**
+          * Format of time string See {@link "https://moment.github.io/luxon/#/formatting?id=table-of-tokens"} for all available tokens.
+          * @since 1.1.0
+         */
+        "format": string;
+        /**
+          * Get the current time based on the wanted format
+         */
+        "getCurrentTime": () => Promise<string>;
+        /**
+          * @deprecated Not supported since 2.0.0.
+         */
+        "individual": boolean;
+        /**
+          * Show hour input
+         */
+        "showHour": boolean;
+        /**
+          * Show minutes input
+         */
+        "showMinutes": boolean;
+        /**
+          * Show seconds input
+         */
+        "showSeconds": boolean;
+        /**
+          * Show time reference input
+          * @since 1.1.0 time reference is default aligned with format tt
+          * @deprecated Since 2.0.0 time reference will be displayed depending on format.
+         */
+        "showTimeReference"?: boolean;
+        /**
+          * Controls the visual presentation and styling of the component when it is displayed as a standalone element
+         */
+        "standaloneAppearance": boolean;
+        /**
+          * Text of date select button
+          * @since 1.1.0
          */
         "textSelectTime": string;
         /**
@@ -2198,6 +2910,9 @@ export namespace Components {
          */
         "showToast": (config: ToastConfig) => Promise<ShowToastResult>;
     }
+    /**
+     * @form-ready 2.6.0
+     */
     interface IxToggle {
         /**
           * Whether the slide-toggle element is checked or not.
@@ -2207,6 +2922,8 @@ export namespace Components {
           * Whether the slide-toggle element is disabled or not.
          */
         "disabled": boolean;
+        "getAssociatedFormElement": () => Promise<HTMLFormElement | null>;
+        "hasValidValue": () => Promise<boolean>;
         /**
           * Hide `on` and `off` text
          */
@@ -2215,6 +2932,14 @@ export namespace Components {
           * If true the control is in indeterminate state
          */
         "indeterminate": boolean;
+        /**
+          * Name of the checkbox component
+         */
+        "name"?: string;
+        /**
+          * Required state of the checkbox component.  If true, checkbox needs to be checked to be valid
+         */
+        "required": boolean;
         /**
           * Text for indeterminate state
          */
@@ -2227,6 +2952,10 @@ export namespace Components {
           * Text for on state
          */
         "textOn": string;
+        /**
+          * Value of the checkbox component
+         */
+        "value": string;
     }
     /**
      * @since 2.0.0
@@ -2269,7 +2998,7 @@ export namespace Components {
         /**
           * CSS selector for hover trigger element e.g. `for="[data-my-custom-select]"`
          */
-        "for"?: string | HTMLElement | Promise<HTMLElement>;
+        "for"?: ElementReference;
         "hideDelay": number;
         "hideTooltip": () => Promise<void>;
         /**
@@ -2338,30 +3067,25 @@ export namespace Components {
           * Text color based on theme variables
           * @deprecated since 2.1.0 use property `text-color`
          */
-        "color": TypographyColors;
+        "color"?: TypographyColors;
         /**
           * Text format
          */
-        "format": TypographyFormat;
+        "format"?: TypographyFormat;
         /**
           * Text color based on theme variables
          */
-        "textColor": TypographyColors;
+        "textColor"?: TypographyColors;
         /**
           * Text decoration
          */
         "textDecoration": TextDecoration;
-        /**
-          * Font variant based on theme variables
-          * @deprecated Use `format` property
-         */
-        "variant": TypographyVariants;
     }
     interface IxUpload {
         /**
           * The accept attribute specifies the types of files that the server accepts (that can be submitted through a file upload). [accept]{@link "https://www.w3schools.com/tags/att_input_accept.asp"}
          */
-        "accept": string;
+        "accept"?: string;
         /**
           * Disable all input events
          */
@@ -2492,6 +3216,10 @@ export interface IxCategoryFilterCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIxCategoryFilterElement;
 }
+export interface IxCheckboxCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLIxCheckboxElement;
+}
 export interface IxChipCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIxChipElement;
@@ -2504,6 +3232,10 @@ export interface IxDateDropdownCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIxDateDropdownElement;
 }
+export interface IxDateInputCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLIxDateInputElement;
+}
 export interface IxDatePickerCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIxDatePickerElement;
@@ -2552,6 +3284,10 @@ export interface IxIconToggleButtonCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIxIconToggleButtonElement;
 }
+export interface IxInputCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLIxInputElement;
+}
 export interface IxMapNavigationCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIxMapNavigationElement;
@@ -2608,6 +3344,10 @@ export interface IxModalHeaderCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIxModalHeaderElement;
 }
+export interface IxNumberInputCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLIxNumberInputElement;
+}
 export interface IxPaginationCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIxPaginationElement;
@@ -2616,6 +3356,14 @@ export interface IxPaneCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIxPaneElement;
 }
+export interface IxRadioCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLIxRadioElement;
+}
+export interface IxRadioGroupCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLIxRadioGroupElement;
+}
 export interface IxSelectCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIxSelectElement;
@@ -2644,6 +3392,10 @@ export interface IxTabsCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIxTabsElement;
 }
+export interface IxTextareaCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLIxTextareaElement;
+}
 export interface IxTimePickerCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIxTimePickerElement;
@@ -2878,6 +3630,7 @@ declare global {
         "categoryChanged": string;
         "inputChanged": InputState;
         "filterChanged": FilterState;
+        "filterCleared": void;
     }
     interface HTMLIxCategoryFilterElement extends Components.IxCategoryFilter, HTMLStencilElement {
         addEventListener<K extends keyof HTMLIxCategoryFilterElementEventMap>(type: K, listener: (this: HTMLIxCategoryFilterElement, ev: IxCategoryFilterCustomEvent<HTMLIxCategoryFilterElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -2893,6 +3646,38 @@ declare global {
         prototype: HTMLIxCategoryFilterElement;
         new (): HTMLIxCategoryFilterElement;
     };
+    interface HTMLIxCheckboxElementEventMap {
+        "checkedChange": boolean;
+        "valueChange": string;
+    }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface HTMLIxCheckboxElement extends Components.IxCheckbox, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLIxCheckboxElementEventMap>(type: K, listener: (this: HTMLIxCheckboxElement, ev: IxCheckboxCustomEvent<HTMLIxCheckboxElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLIxCheckboxElementEventMap>(type: K, listener: (this: HTMLIxCheckboxElement, ev: IxCheckboxCustomEvent<HTMLIxCheckboxElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLIxCheckboxElement: {
+        prototype: HTMLIxCheckboxElement;
+        new (): HTMLIxCheckboxElement;
+    };
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface HTMLIxCheckboxGroupElement extends Components.IxCheckboxGroup, HTMLStencilElement {
+    }
+    var HTMLIxCheckboxGroupElement: {
+        prototype: HTMLIxCheckboxGroupElement;
+        new (): HTMLIxCheckboxGroupElement;
+    };
     interface HTMLIxChipElementEventMap {
         "closeChip": any;
     }
@@ -2957,6 +3742,15 @@ declare global {
         prototype: HTMLIxCssGridItemElement;
         new (): HTMLIxCssGridItemElement;
     };
+    /**
+     * @since 2.6.0
+     */
+    interface HTMLIxCustomFieldElement extends Components.IxCustomField, HTMLStencilElement {
+    }
+    var HTMLIxCustomFieldElement: {
+        prototype: HTMLIxCustomFieldElement;
+        new (): HTMLIxCustomFieldElement;
+    };
     interface HTMLIxDateDropdownElementEventMap {
         "dateRangeChange": DateRangeChangeEvent;
     }
@@ -2977,6 +3771,30 @@ declare global {
         prototype: HTMLIxDateDropdownElement;
         new (): HTMLIxDateDropdownElement;
     };
+    interface HTMLIxDateInputElementEventMap {
+        "valueChange": string;
+        "validityStateChange": DateInputValidityState;
+        "ixFocus": void;
+        "ixBlur": void;
+    }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface HTMLIxDateInputElement extends Components.IxDateInput, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLIxDateInputElementEventMap>(type: K, listener: (this: HTMLIxDateInputElement, ev: IxDateInputCustomEvent<HTMLIxDateInputElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLIxDateInputElementEventMap>(type: K, listener: (this: HTMLIxDateInputElement, ev: IxDateInputCustomEvent<HTMLIxDateInputElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLIxDateInputElement: {
+        prototype: HTMLIxDateInputElement;
+        new (): HTMLIxDateInputElement;
+    };
     interface HTMLIxDatePickerElementEventMap {
         "dateChange": DateChangeEvent;
         "dateRangeChange": DateChangeEvent;
@@ -3171,6 +3989,18 @@ declare global {
         prototype: HTMLIxExpandingSearchElement;
         new (): HTMLIxExpandingSearchElement;
     };
+    interface HTMLIxFieldLabelElement extends Components.IxFieldLabel, HTMLStencilElement {
+    }
+    var HTMLIxFieldLabelElement: {
+        prototype: HTMLIxFieldLabelElement;
+        new (): HTMLIxFieldLabelElement;
+    };
+    interface HTMLIxFieldWrapperElement extends Components.IxFieldWrapper, HTMLStencilElement {
+    }
+    var HTMLIxFieldWrapperElement: {
+        prototype: HTMLIxFieldWrapperElement;
+        new (): HTMLIxFieldWrapperElement;
+    };
     interface HTMLIxFilterChipElementEventMap {
         "closeClick": void;
     }
@@ -3200,12 +4030,6 @@ declare global {
         prototype: HTMLIxFlipTileContentElement;
         new (): HTMLIxFlipTileContentElement;
     };
-    interface HTMLIxFormFieldElement extends Components.IxFormField, HTMLStencilElement {
-    }
-    var HTMLIxFormFieldElement: {
-        prototype: HTMLIxFormFieldElement;
-        new (): HTMLIxFormFieldElement;
-    };
     interface HTMLIxGroupElementEventMap {
         "selectGroup": boolean;
         "selectItem": number;
@@ -3248,6 +4072,12 @@ declare global {
         prototype: HTMLIxGroupItemElement;
         new (): HTMLIxGroupItemElement;
     };
+    interface HTMLIxHelperTextElement extends Components.IxHelperText, HTMLStencilElement {
+    }
+    var HTMLIxHelperTextElement: {
+        prototype: HTMLIxHelperTextElement;
+        new (): HTMLIxHelperTextElement;
+    };
     interface HTMLIxIconButtonElement extends Components.IxIconButton, HTMLStencilElement {
     }
     var HTMLIxIconButtonElement: {
@@ -3274,6 +4104,29 @@ declare global {
         prototype: HTMLIxIconToggleButtonElement;
         new (): HTMLIxIconToggleButtonElement;
     };
+    interface HTMLIxInputElementEventMap {
+        "valueChange": string;
+        "validityStateChange": ValidityState;
+        "ixBlur": void;
+    }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface HTMLIxInputElement extends Components.IxInput, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLIxInputElementEventMap>(type: K, listener: (this: HTMLIxInputElement, ev: IxInputCustomEvent<HTMLIxInputElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLIxInputElementEventMap>(type: K, listener: (this: HTMLIxInputElement, ev: IxInputCustomEvent<HTMLIxInputElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLIxInputElement: {
+        prototype: HTMLIxInputElement;
+        new (): HTMLIxInputElement;
+    };
     interface HTMLIxInputGroupElement extends Components.IxInputGroup, HTMLStencilElement {
     }
     var HTMLIxInputGroupElement: {
@@ -3304,6 +4157,15 @@ declare global {
         prototype: HTMLIxKpiElement;
         new (): HTMLIxKpiElement;
     };
+    /**
+     * @since 2.6.0
+     */
+    interface HTMLIxLayoutAutoElement extends Components.IxLayoutAuto, HTMLStencilElement {
+    }
+    var HTMLIxLayoutAutoElement: {
+        prototype: HTMLIxLayoutAutoElement;
+        new (): HTMLIxLayoutAutoElement;
+    };
     /**
      * @since 2.0.0
      */
@@ -3571,12 +4433,6 @@ declare global {
         prototype: HTMLIxModalContentElement;
         new (): HTMLIxModalContentElement;
     };
-    interface HTMLIxModalExampleElement extends Components.IxModalExample, HTMLStencilElement {
-    }
-    var HTMLIxModalExampleElement: {
-        prototype: HTMLIxModalExampleElement;
-        new (): HTMLIxModalExampleElement;
-    };
     /**
      * @since 2.0.0
      */
@@ -3612,6 +4468,29 @@ declare global {
         prototype: HTMLIxModalLoadingElement;
         new (): HTMLIxModalLoadingElement;
     };
+    interface HTMLIxNumberInputElementEventMap {
+        "valueChange": number;
+        "validityStateChange": ValidityState;
+        "ixBlur": void;
+    }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface HTMLIxNumberInputElement extends Components.IxNumberInput, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLIxNumberInputElementEventMap>(type: K, listener: (this: HTMLIxNumberInputElement, ev: IxNumberInputCustomEvent<HTMLIxNumberInputElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLIxNumberInputElementEventMap>(type: K, listener: (this: HTMLIxNumberInputElement, ev: IxNumberInputCustomEvent<HTMLIxNumberInputElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLIxNumberInputElement: {
+        prototype: HTMLIxNumberInputElement;
+        new (): HTMLIxNumberInputElement;
+    };
     interface HTMLIxPaginationElementEventMap {
         "pageSelected": number;
         "itemCountChanged": number;
@@ -3672,12 +4551,6 @@ declare global {
         prototype: HTMLIxPillElement;
         new (): HTMLIxPillElement;
     };
-    interface HTMLIxPlaygroundInternalElement extends Components.IxPlaygroundInternal, HTMLStencilElement {
-    }
-    var HTMLIxPlaygroundInternalElement: {
-        prototype: HTMLIxPlaygroundInternalElement;
-        new (): HTMLIxPlaygroundInternalElement;
-    };
     /**
      * @since 1.6.0
      */
@@ -3687,6 +4560,49 @@ declare global {
         prototype: HTMLIxPushCardElement;
         new (): HTMLIxPushCardElement;
     };
+    interface HTMLIxRadioElementEventMap {
+        "checkedChange": boolean;
+        "valueChange": string;
+    }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface HTMLIxRadioElement extends Components.IxRadio, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLIxRadioElementEventMap>(type: K, listener: (this: HTMLIxRadioElement, ev: IxRadioCustomEvent<HTMLIxRadioElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLIxRadioElementEventMap>(type: K, listener: (this: HTMLIxRadioElement, ev: IxRadioCustomEvent<HTMLIxRadioElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLIxRadioElement: {
+        prototype: HTMLIxRadioElement;
+        new (): HTMLIxRadioElement;
+    };
+    interface HTMLIxRadioGroupElementEventMap {
+        "valueChange": string;
+    }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface HTMLIxRadioGroupElement extends Components.IxRadioGroup, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLIxRadioGroupElementEventMap>(type: K, listener: (this: HTMLIxRadioGroupElement, ev: IxRadioGroupCustomEvent<HTMLIxRadioGroupElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLIxRadioGroupElementEventMap>(type: K, listener: (this: HTMLIxRadioGroupElement, ev: IxRadioGroupCustomEvent<HTMLIxRadioGroupElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLIxRadioGroupElement: {
+        prototype: HTMLIxRadioGroupElement;
+        new (): HTMLIxRadioGroupElement;
+    };
     /**
      * @since 2.0.0
      */
@@ -3701,7 +4617,11 @@ declare global {
         "itemSelectionChange": string[];
         "inputChange": string;
         "addItem": string;
+        "ixBlur": void;
     }
+    /**
+     * @form-ready 2.6.0
+     */
     interface HTMLIxSelectElement extends Components.IxSelect, HTMLStencilElement {
         addEventListener<K extends keyof HTMLIxSelectElementEventMap>(type: K, listener: (this: HTMLIxSelectElement, ev: IxSelectCustomEvent<HTMLIxSelectElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
         addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
@@ -3830,6 +4750,29 @@ declare global {
         prototype: HTMLIxTabsElement;
         new (): HTMLIxTabsElement;
     };
+    interface HTMLIxTextareaElementEventMap {
+        "valueChange": string;
+        "validityStateChange": ValidityState;
+        "ixBlur": void;
+    }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface HTMLIxTextareaElement extends Components.IxTextarea, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLIxTextareaElementEventMap>(type: K, listener: (this: HTMLIxTextareaElement, ev: IxTextareaCustomEvent<HTMLIxTextareaElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLIxTextareaElementEventMap>(type: K, listener: (this: HTMLIxTextareaElement, ev: IxTextareaCustomEvent<HTMLIxTextareaElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLIxTextareaElement: {
+        prototype: HTMLIxTextareaElement;
+        new (): HTMLIxTextareaElement;
+    };
     interface HTMLIxTileElement extends Components.IxTile, HTMLStencilElement {
     }
     var HTMLIxTileElement: {
@@ -3880,7 +4823,11 @@ declare global {
     };
     interface HTMLIxToggleElementEventMap {
         "checkedChange": boolean;
+        "valueChange": string;
     }
+    /**
+     * @form-ready 2.6.0
+     */
     interface HTMLIxToggleElement extends Components.IxToggle, HTMLStencilElement {
         addEventListener<K extends keyof HTMLIxToggleElementEventMap>(type: K, listener: (this: HTMLIxToggleElement, ev: IxToggleCustomEvent<HTMLIxToggleElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
         addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
@@ -4046,13 +4993,17 @@ declare global {
         "ix-card-list": HTMLIxCardListElement;
         "ix-card-title": HTMLIxCardTitleElement;
         "ix-category-filter": HTMLIxCategoryFilterElement;
+        "ix-checkbox": HTMLIxCheckboxElement;
+        "ix-checkbox-group": HTMLIxCheckboxGroupElement;
         "ix-chip": HTMLIxChipElement;
         "ix-col": HTMLIxColElement;
         "ix-content": HTMLIxContentElement;
         "ix-content-header": HTMLIxContentHeaderElement;
         "ix-css-grid": HTMLIxCssGridElement;
         "ix-css-grid-item": HTMLIxCssGridItemElement;
+        "ix-custom-field": HTMLIxCustomFieldElement;
         "ix-date-dropdown": HTMLIxDateDropdownElement;
+        "ix-date-input": HTMLIxDateInputElement;
         "ix-date-picker": HTMLIxDatePickerElement;
         "ix-date-time-card": HTMLIxDateTimeCardElement;
         "ix-datetime-picker": HTMLIxDatetimePickerElement;
@@ -4067,19 +5018,23 @@ declare global {
         "ix-event-list": HTMLIxEventListElement;
         "ix-event-list-item": HTMLIxEventListItemElement;
         "ix-expanding-search": HTMLIxExpandingSearchElement;
+        "ix-field-label": HTMLIxFieldLabelElement;
+        "ix-field-wrapper": HTMLIxFieldWrapperElement;
         "ix-filter-chip": HTMLIxFilterChipElement;
         "ix-flip-tile": HTMLIxFlipTileElement;
         "ix-flip-tile-content": HTMLIxFlipTileContentElement;
-        "ix-form-field": HTMLIxFormFieldElement;
         "ix-group": HTMLIxGroupElement;
         "ix-group-context-menu": HTMLIxGroupContextMenuElement;
         "ix-group-item": HTMLIxGroupItemElement;
+        "ix-helper-text": HTMLIxHelperTextElement;
         "ix-icon-button": HTMLIxIconButtonElement;
         "ix-icon-toggle-button": HTMLIxIconToggleButtonElement;
+        "ix-input": HTMLIxInputElement;
         "ix-input-group": HTMLIxInputGroupElement;
         "ix-key-value": HTMLIxKeyValueElement;
         "ix-key-value-list": HTMLIxKeyValueListElement;
         "ix-kpi": HTMLIxKpiElement;
+        "ix-layout-auto": HTMLIxLayoutAutoElement;
         "ix-layout-grid": HTMLIxLayoutGridElement;
         "ix-link-button": HTMLIxLinkButtonElement;
         "ix-map-navigation": HTMLIxMapNavigationElement;
@@ -4098,16 +5053,17 @@ declare global {
         "ix-message-bar": HTMLIxMessageBarElement;
         "ix-modal": HTMLIxModalElement;
         "ix-modal-content": HTMLIxModalContentElement;
-        "ix-modal-example": HTMLIxModalExampleElement;
         "ix-modal-footer": HTMLIxModalFooterElement;
         "ix-modal-header": HTMLIxModalHeaderElement;
         "ix-modal-loading": HTMLIxModalLoadingElement;
+        "ix-number-input": HTMLIxNumberInputElement;
         "ix-pagination": HTMLIxPaginationElement;
         "ix-pane": HTMLIxPaneElement;
         "ix-pane-layout": HTMLIxPaneLayoutElement;
         "ix-pill": HTMLIxPillElement;
-        "ix-playground-internal": HTMLIxPlaygroundInternalElement;
         "ix-push-card": HTMLIxPushCardElement;
+        "ix-radio": HTMLIxRadioElement;
+        "ix-radio-group": HTMLIxRadioGroupElement;
         "ix-row": HTMLIxRowElement;
         "ix-select": HTMLIxSelectElement;
         "ix-select-item": HTMLIxSelectItemElement;
@@ -4117,6 +5073,7 @@ declare global {
         "ix-split-button-item": HTMLIxSplitButtonItemElement;
         "ix-tab-item": HTMLIxTabItemElement;
         "ix-tabs": HTMLIxTabsElement;
+        "ix-textarea": HTMLIxTextareaElement;
         "ix-tile": HTMLIxTileElement;
         "ix-time-picker": HTMLIxTimePickerElement;
         "ix-toast": HTMLIxToastElement;
@@ -4422,7 +5379,7 @@ declare namespace LocalJSX {
         /**
           * Overwrite the default show all count.
          */
-        "showAllCount"?: number | undefined;
+        "showAllCount"?: number;
         /**
           * Suppress the overflow handling of child elements
          */
@@ -4481,6 +5438,10 @@ declare namespace LocalJSX {
           * Event dispatched whenever the filter state changes.
          */
         "onFilterChanged"?: (event: IxCategoryFilterCustomEvent<FilterState>) => void;
+        /**
+          * Event dispatched whenever the filter gets cleared.
+         */
+        "onFilterCleared"?: (event: IxCategoryFilterCustomEvent<void>) => void;
         /**
           * Event dispatched whenever the text input changes.
          */
@@ -4507,6 +5468,86 @@ declare namespace LocalJSX {
          */
         "suggestions"?: string[];
     }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface IxCheckbox {
+        /**
+          * Checked state of the checkbox component
+         */
+        "checked"?: boolean;
+        /**
+          * Disabled state of the checkbox component
+         */
+        "disabled"?: boolean;
+        /**
+          * Indeterminate state of the checkbox component
+         */
+        "indeterminate"?: boolean;
+        /**
+          * Label for the checkbox component
+         */
+        "label"?: string;
+        /**
+          * Name of the checkbox component
+         */
+        "name"?: string;
+        /**
+          * Event emitted when the checked state of the checkbox changes
+         */
+        "onCheckedChange"?: (event: IxCheckboxCustomEvent<boolean>) => void;
+        /**
+          * Event emitted when the value of the checkbox changes
+         */
+        "onValueChange"?: (event: IxCheckboxCustomEvent<string>) => void;
+        /**
+          * Required state of the checkbox component.  If true, checkbox needs to be checked to be valid
+         */
+        "required"?: boolean;
+        /**
+          * Value of the checkbox component
+         */
+        "value"?: string;
+    }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface IxCheckboxGroup {
+        /**
+          * Alignment of the checkboxes in the group
+         */
+        "direction"?: 'row' | 'column';
+        /**
+          * Optional helper text displayed below the checkbox group
+         */
+        "helperText"?: string;
+        /**
+          * Info text for the checkbox group
+         */
+        "infoText"?: string;
+        /**
+          * Error text for the checkbox group
+         */
+        "invalidText"?: string;
+        /**
+          * Label for the checkbox group
+         */
+        "label"?: string;
+        /**
+          * Show helper, info, warning, error and valid text as tooltip
+         */
+        "showTextAsTooltip"?: boolean;
+        /**
+          * Valid text for the checkbox group
+         */
+        "validText"?: string;
+        /**
+          * Warning text for the checkbox group
+         */
+        "warningText"?: string;
+    }
     interface IxChip {
         /**
           * Determines if the chip is interactive. If false no user input (e.g. mouse states, keyboard navigation) will be possible and also the close button will not be present.
@@ -4614,6 +5655,43 @@ declare namespace LocalJSX {
          */
         "itemName"?: string;
     }
+    /**
+     * @since 2.6.0
+     */
+    interface IxCustomField {
+        /**
+          * Show text below the field component which show additional information
+         */
+        "helperText"?: string;
+        /**
+          * Info text for the field component
+         */
+        "infoText"?: string;
+        /**
+          * Error text for the field component
+         */
+        "invalidText"?: string;
+        /**
+          * Label for the field component
+         */
+        "label"?: string;
+        /**
+          * A value is required or must be checked for the form to be submittable
+         */
+        "required"?: boolean;
+        /**
+          * Show helper, info, warning, error and valid text as tooltip
+         */
+        "showTextAsTooltip"?: boolean;
+        /**
+          * Valid text for the field component
+         */
+        "validText"?: string;
+        /**
+          * Warning text for the field component
+         */
+        "warningText"?: string;
+    }
     /**
      * @since 2.1.0
      */
@@ -4656,6 +5734,11 @@ declare namespace LocalJSX {
           * Text for the done button. Will be used for translation.
          */
         "i18nNoRange"?: string;
+        /**
+          * Locale identifier (e.g. 'en' or 'de').
+          * @since 2.6.0
+         */
+        "locale"?: string;
         /**
           * The latest date that can be selected by the date picker. If not set there will be no restriction.
          */
@@ -4676,6 +5759,90 @@ declare namespace LocalJSX {
           * Picker date. If the picker is in range mode this property is the end date. If the picker is not in range mode leave this value `null`  Format is based on `format`
          */
         "to"?: string;
+        /**
+          * The index of which day to start the week on, based on the Locale#weekdays array. E.g. if the locale is en-us, weekStartIndex = 1 results in starting the week on monday.
+          * @since 2.6.0
+         */
+        "weekStartIndex"?: number;
+    }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface IxDateInput {
+        /**
+          * disabled attribute
+         */
+        "disabled"?: boolean;
+        /**
+          * Date format string. See {@link "https://moment.github.io/luxon/#/formatting?id=table-of-tokens"} for all available tokens.
+         */
+        "format"?: string;
+        /**
+          * helper text below the input field
+         */
+        "helperText"?: string;
+        /**
+          * i18n string for the error message when the date is not parsable
+         */
+        "i18nErrorDateUnparsable"?: string;
+        /**
+          * info text below the input field
+         */
+        "infoText"?: string;
+        /**
+          * error text below the input field
+         */
+        "invalidText"?: string;
+        /**
+          * label of the input field
+         */
+        "label"?: string;
+        /**
+          * Locale identifier (e.g. 'en' or 'de').
+          * @since 2.6.0
+         */
+        "locale"?: string;
+        /**
+          * name of the input element
+         */
+        "name"?: string;
+        /**
+          * Validation state change event.
+         */
+        "onValidityStateChange"?: (event: IxDateInputCustomEvent<DateInputValidityState>) => void;
+        /**
+          * Input change event.
+         */
+        "onValueChange"?: (event: IxDateInputCustomEvent<string>) => void;
+        /**
+          * placeholder of the input element
+         */
+        "placeholder"?: string;
+        /**
+          * readonly attribute
+         */
+        "readonly"?: boolean;
+        /**
+          * required attribute
+         */
+        "required"?: boolean;
+        /**
+          * show text as tooltip
+         */
+        "showTextAsTooltip"?: boolean;
+        /**
+          * valid text below the input field
+         */
+        "validText"?: string;
+        /**
+          * value of the input element
+         */
+        "value"?: string;
+        /**
+          * warning text below the input field
+         */
+        "warningText"?: string;
     }
     interface IxDatePicker {
         /**
@@ -4707,7 +5874,7 @@ declare namespace LocalJSX {
          */
         "individual"?: boolean;
         /**
-          * Format of time string See {@link "https://moment.github.io/luxon/#/formatting?id=table-of-tokens"} for all available tokens.
+          * Locale identifier (e.g. 'en' or 'de').
           * @since 2.1.0
          */
         "locale"?: string;
@@ -4788,7 +5955,7 @@ declare namespace LocalJSX {
           * The selected starting date. If the picker is not in range mode this is the selected date. Format has to match the `format` property.
           * @since 1.1.0
          */
-        "from"?: string | undefined;
+        "from"?: string;
         /**
           * Text of date select button
           * @since 2.1.0
@@ -4850,7 +6017,7 @@ declare namespace LocalJSX {
           * @see { this.timeFormat}
           * @since 1.1.0
          */
-        "showTimeReference"?: any;
+        "showTimeReference"?: boolean;
         /**
           * Text of date select button
           * @since 1.1.0
@@ -4875,7 +6042,7 @@ declare namespace LocalJSX {
           * The selected end date. If the the picker is not in range mode this property has no impact. Format has to match the `format` property.
           * @since 1.1.0
          */
-        "to"?: string | undefined;
+        "to"?: string;
         /**
           * The index of which day to start the week on, based on the Locale#weekdays array. E.g. if the locale is en-us, weekStartIndex = 1 results in starting the week on monday.
           * @since 2.1.0
@@ -4925,7 +6092,7 @@ declare namespace LocalJSX {
         /**
           * Define an anchor element
          */
-        "anchor"?: string | HTMLElement;
+        "anchor"?: ElementReference;
         /**
           * Controls if the dropdown will be closed in response to a click event depending on the position of the event relative to the dropdown. If the dropdown is a child of another one, it will be closed with the parent, regardless of its own close behavior.
          */
@@ -4958,7 +6125,7 @@ declare namespace LocalJSX {
         /**
           * Define an element that triggers the dropdown. A trigger can either be a string that will be interpreted as id attribute or a DOM element.
          */
-        "trigger"?: string | HTMLElement | Promise<HTMLElement>;
+        "trigger"?: ElementReference;
     }
     /**
      * @since 1.3.0
@@ -5134,6 +6301,74 @@ declare namespace LocalJSX {
          */
         "value"?: string;
     }
+    interface IxFieldLabel {
+        /**
+          * The id of the form element that the label is associated with
+         */
+        "htmlFor"?: string;
+        /**
+          * A value is required or must be checked for the form to be submittable
+         */
+        "required"?: boolean;
+    }
+    interface IxFieldWrapper {
+        /**
+          * The control element that the label is associated with
+         */
+        "controlRef"?: MakeRef<HTMLElement>;
+        /**
+          * Show text below the field component
+         */
+        "helperText"?: string;
+        /**
+          * The id of the form element that the label is associated with
+         */
+        "htmlForLabel"?: string;
+        /**
+          * Info text for the field component
+         */
+        "infoText"?: string;
+        /**
+          * Error text for the field component
+         */
+        "invalidText"?: string;
+        /**
+          * Is the field component info
+         */
+        "isInfo"?: boolean;
+        /**
+          * Is the field component invalid
+         */
+        "isInvalid"?: boolean;
+        /**
+          * Is the field component valid
+         */
+        "isValid"?: boolean;
+        /**
+          * Is the field component warning
+         */
+        "isWarning"?: boolean;
+        /**
+          * Label for the field component
+         */
+        "label"?: string;
+        /**
+          * Show label as required
+         */
+        "required"?: boolean;
+        /**
+          * Show helper, error, info, warning text as tooltip
+         */
+        "showTextAsTooltip"?: boolean;
+        /**
+          * Valid text for the field component
+         */
+        "validText"?: string;
+        /**
+          * Warning text for the field component
+         */
+        "warningText"?: string;
+    }
     interface IxFilterChip {
         /**
           * If true the filter chip will be in disabled state
@@ -5167,12 +6402,6 @@ declare namespace LocalJSX {
     }
     interface IxFlipTileContent {
     }
-    interface IxFormField {
-        /**
-          * Label
-         */
-        "label"?: string;
-    }
     interface IxGroup {
         /**
           * Whether the group is collapsed or expanded. Defaults to true.
@@ -5251,6 +6480,32 @@ declare namespace LocalJSX {
          */
         "text"?: string;
     }
+    interface IxHelperText {
+        /**
+          * Show text below the field component
+         */
+        "helperText"?: string;
+        /**
+          * The id of the form element that the label is associated with
+         */
+        "htmlFor"?: string;
+        /**
+          * Info text for the field component
+         */
+        "infoText"?: string;
+        /**
+          * Error text for the field component
+         */
+        "invalidText"?: string;
+        /**
+          * Valid text for the field component
+         */
+        "validText"?: string;
+        /**
+          * Warning text for the field component
+         */
+        "warningText"?: string;
+    }
     interface IxIconButton {
         /**
           * Accessibility label for the icon button Will be set as aria-label on the nested HTML button element
@@ -5286,66 +6541,156 @@ declare namespace LocalJSX {
         /**
           * Button outline
          */
-        "outline"?: boolean;
+        "outline"?: boolean;
+        /**
+          * Button in oval shape
+         */
+        "oval"?: boolean;
+        /**
+          * Size of icon in button
+          * @deprecated Only size 32 will be removed in 3.0.0
+         */
+        "size"?: '32' | '24' | '16' | '12';
+        /**
+          * Type of the button
+         */
+        "type"?: 'button' | 'submit';
+        /**
+          * Variant of button
+          * @since 2.3.0 - variant danger
+         */
+        "variant"?: IconButtonVariant;
+    }
+    /**
+     * @since 2.0.0
+     */
+    interface IxIconToggleButton {
+        /**
+          * Disable the button
+         */
+        "disabled"?: boolean;
+        /**
+          * Button with no background or outline
+         */
+        "ghost"?: boolean;
+        /**
+          * Icon name
+         */
+        "icon"?: string;
+        /**
+          * Loading button
+         */
+        "loading"?: boolean;
+        /**
+          * Pressed change event
+         */
+        "onPressedChange"?: (event: IxIconToggleButtonCustomEvent<boolean>) => void;
+        /**
+          * Outline button
+         */
+        "outline"?: boolean;
+        /**
+          * Show button as pressed
+         */
+        "pressed"?: boolean;
+        /**
+          * Size of icon in button
+         */
+        "size"?: '24' | '16' | '12';
+        /**
+          * Button variant. Important: Variant 'primary' can only be combined with either outline or ghost.
+         */
+        "variant"?: ButtonVariant1;
+    }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface IxInput {
+        /**
+          * The allowed characters pattern for the text field.
+         */
+        "allowedCharactersPattern"?: string;
+        /**
+          * Specifies whether the text field is disabled.
+         */
+        "disabled"?: boolean;
+        /**
+          * The helper text for the text field.
+         */
+        "helperText"?: string;
+        /**
+          * The info text for the text field.
+         */
+        "infoText"?: string;
+        /**
+          * The error text for the text field.
+         */
+        "invalidText"?: string;
+        /**
+          * The label for the text field.
+         */
+        "label"?: string;
+        /**
+          * The maximum length of the text field.
+         */
+        "maxLength"?: number;
+        /**
+          * The minimum length of the text field.
+         */
+        "minLength"?: number;
         /**
-          * Button in oval shape
+          * The name of the text field.
          */
-        "oval"?: boolean;
+        "name"?: string;
         /**
-          * Size of icon in button
-          * @deprecated Only size 32 will be removed in 3.0.0
+          * Event emitted when the text field loses focus.
          */
-        "size"?: '32' | '24' | '16' | '12';
+        "onIxBlur"?: (event: IxInputCustomEvent<void>) => void;
         /**
-          * Type of the button
+          * Event emitted when the validity state of the text field changes.
          */
-        "type"?: 'button' | 'submit';
+        "onValidityStateChange"?: (event: IxInputCustomEvent<ValidityState>) => void;
         /**
-          * Variant of button
-          * @since 2.3.0 - variant danger
+          * Event emitted when the value of the text field changes.
          */
-        "variant"?: IconButtonVariant;
-    }
-    /**
-     * @since 2.0.0
-     */
-    interface IxIconToggleButton {
+        "onValueChange"?: (event: IxInputCustomEvent<string>) => void;
         /**
-          * Disable the button
+          * The pattern for the text field.
          */
-        "disabled"?: boolean;
+        "pattern"?: string;
         /**
-          * Button with no background or outline
+          * The placeholder text for the text field.
          */
-        "ghost"?: boolean;
+        "placeholder"?: string;
         /**
-          * Icon name
+          * Specifies whether the text field is readonly.
          */
-        "icon"?: string;
+        "readonly"?: boolean;
         /**
-          * Loading button
+          * Specifies whether the text field is required.
          */
-        "loading"?: boolean;
+        "required"?: boolean;
         /**
-          * Pressed change event
+          * Specifies whether to show the text as a tooltip.
          */
-        "onPressedChange"?: (event: IxIconToggleButtonCustomEvent<boolean>) => void;
+        "showTextAsTooltip"?: boolean;
         /**
-          * Outline button
+          * The type of the text field. Possible values are 'text', 'email', or 'password'.
          */
-        "outline"?: boolean;
+        "type"?: 'text' | 'email' | 'password' | 'tel' | 'url';
         /**
-          * Show button as pressed
+          * The valid text for the text field.
          */
-        "pressed"?: boolean;
+        "validText"?: string;
         /**
-          * Size of icon in button
+          * The value of the text field.
          */
-        "size"?: '24' | '16' | '12';
+        "value"?: string;
         /**
-          * Button variant. Important: Variant 'primary' can only be combined with either outline or ghost.
+          * The warning text for the text field.
          */
-        "variant"?: ButtonVariant1;
+        "warningText"?: string;
     }
     interface IxInputGroup {
     }
@@ -5386,6 +6731,18 @@ declare namespace LocalJSX {
         "unit"?: string;
         "value"?: string | number;
     }
+    /**
+     * @since 2.6.0
+     */
+    interface IxLayoutAuto {
+        /**
+          * Defines the layout of the form.
+         */
+        "layout"?: {
+    minWidth: string;
+    columns: number;
+  }[];
+    }
     /**
      * @since 2.0.0
      */
@@ -5801,8 +7158,6 @@ declare namespace LocalJSX {
      */
     interface IxModalContent {
     }
-    interface IxModalExample {
-    }
     /**
      * @since 2.0.0
      */
@@ -5831,6 +7186,96 @@ declare namespace LocalJSX {
     }
     interface IxModalLoading {
     }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface IxNumberInput {
+        /**
+          * The allowed characters pattern for the input field
+         */
+        "allowedCharactersPattern"?: string;
+        /**
+          * Disables the input field
+         */
+        "disabled"?: boolean;
+        /**
+          * The helper text for the input field
+         */
+        "helperText"?: string;
+        /**
+          * The info text for the input field
+         */
+        "infoText"?: string;
+        /**
+          * The error text for the input field
+         */
+        "invalidText"?: string;
+        /**
+          * The label for the input field
+         */
+        "label"?: string;
+        /**
+          * The maximum value for the input field
+         */
+        "max"?: string | number;
+        /**
+          * The minimum value for the input field
+         */
+        "min"?: string | number;
+        /**
+          * name of the input element
+         */
+        "name"?: string;
+        /**
+          * Event emitted when the input field loses focus
+         */
+        "onIxBlur"?: (event: IxNumberInputCustomEvent<void>) => void;
+        /**
+          * Event emitted when the validity state of the input field changes
+         */
+        "onValidityStateChange"?: (event: IxNumberInputCustomEvent<ValidityState>) => void;
+        /**
+          * Event emitted when the value of the input field changes
+         */
+        "onValueChange"?: (event: IxNumberInputCustomEvent<number>) => void;
+        /**
+          * The pattern for the input field
+         */
+        "pattern"?: string;
+        /**
+          * placeholder of the input element
+         */
+        "placeholder"?: string;
+        /**
+          * Indicates if the field is read-only
+         */
+        "readonly"?: boolean;
+        /**
+          * Indicates if the field is required
+         */
+        "required"?: boolean;
+        /**
+          * Indicates if the stepper buttons should be shown
+         */
+        "showStepperButtons"?: boolean;
+        /**
+          * Indicates if the text should be shown as a tooltip
+         */
+        "showTextAsTooltip"?: boolean;
+        /**
+          * The valid text for the input field
+         */
+        "validText"?: string;
+        /**
+          * The value of the input field
+         */
+        "value"?: number;
+        /**
+          * The warning text for the input field
+         */
+        "warningText"?: string;
+    }
     /**
      * @since 1.5.0
      */
@@ -5986,8 +7431,6 @@ declare namespace LocalJSX {
     | 'success'
     | 'custom';
     }
-    interface IxPlaygroundInternal {
-    }
     /**
      * @since 1.6.0
      */
@@ -6019,11 +7462,94 @@ declare namespace LocalJSX {
          */
         "variant"?: PushCardVariant;
     }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface IxRadio {
+        /**
+          * Checked state of the radio component
+         */
+        "checked"?: boolean;
+        /**
+          * Disabled state of the radio component
+         */
+        "disabled"?: boolean;
+        /**
+          * Label for the radio component
+         */
+        "label"?: string;
+        /**
+          * Name of the radio component
+         */
+        "name"?: string;
+        /**
+          * Event emitted when the checked state of the radio changes
+         */
+        "onCheckedChange"?: (event: IxRadioCustomEvent<boolean>) => void;
+        /**
+          * Event emitted when the value of the radio changes
+         */
+        "onValueChange"?: (event: IxRadioCustomEvent<string>) => void;
+        /**
+          * Value of the radio component
+         */
+        "value"?: string;
+    }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface IxRadioGroup {
+        /**
+          * Alignment of the radio buttons in the group
+         */
+        "direction"?: 'column' | 'row';
+        /**
+          * Show text below the field component
+         */
+        "helperText"?: string;
+        /**
+          * Info text for the field component
+         */
+        "infoText"?: string;
+        /**
+          * Error text for the field component
+         */
+        "invalidText"?: string;
+        /**
+          * Label for the field component
+         */
+        "label"?: string;
+        /**
+          * Event emitted when the value of the radiobutton group changes
+         */
+        "onValueChange"?: (event: IxRadioGroupCustomEvent<string>) => void;
+        /**
+          * Show helper, info, warning, error and valid text as tooltip
+         */
+        "showTextAsTooltip"?: boolean;
+        /**
+          * Valid text for the field component
+         */
+        "validText"?: string;
+        /**
+          * Value of the radiobutton group component
+         */
+        "value"?: string;
+        /**
+          * Warning text for the field component
+         */
+        "warningText"?: string;
+    }
     /**
      * @since 2.0.0
      */
     interface IxRow {
     }
+    /**
+     * @form-ready 2.6.0
+     */
     interface IxSelect {
         /**
           * Show clear button
@@ -6037,13 +7563,18 @@ declare namespace LocalJSX {
           * Select is extendable
          */
         "editable"?: boolean;
+        /**
+          * Helper text for the select component
+          * @since 2.6.0
+         */
+        "helperText"?: string;
         /**
           * Hide list header
           * @since 1.5.0
          */
         "hideListHeader"?: boolean;
         /**
-          * Hint inside of dropdown if no items where found with current filter text
+          * Information inside of dropdown if no items where found with current filter text
           * @since 1.5.0
          */
         "i18nNoMatches"?: string;
@@ -6059,10 +7590,30 @@ declare namespace LocalJSX {
           * Select list header
          */
         "i18nSelectListHeader"?: string;
+        /**
+          * Info text for the select component
+          * @since 2.6.0
+         */
+        "infoText"?: string;
+        /**
+          * Error text for the select component
+          * @since 2.6.0
+         */
+        "invalidText"?: string;
+        /**
+          * Label for the select component
+          * @since 2.6.0
+         */
+        "label"?: string;
         /**
           * Selection mode
          */
         "mode"?: 'single' | 'multiple';
+        /**
+          * A string that represents the element's name attribute, containing a name that identifies the element when submitting the form.
+          * @since 2.6.0
+         */
+        "name"?: string;
         /**
           * Item added to selection
          */
@@ -6077,6 +7628,10 @@ declare namespace LocalJSX {
           * @deprecated since 2.0.0. Use `valueChange` instead.
          */
         "onItemSelectionChange"?: (event: IxSelectCustomEvent<string[]>) => void;
+        /**
+          * Blur input
+         */
+        "onIxBlur"?: (event: IxSelectCustomEvent<void>) => void;
         /**
           * Value changed
           * @since 2.0.0
@@ -6086,16 +7641,36 @@ declare namespace LocalJSX {
           * If true the select will be in readonly mode
          */
         "readonly"?: boolean;
+        /**
+          * A Boolean attribute indicating that an option with a non-empty string value must be selected
+          * @since 2.6.0
+         */
+        "required"?: 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.
           * @deprecated since 2.0.0. Use the `value` property instead.
          */
         "selectedIndices"?: string | string[];
+        /**
+          * Show helper, error, info, warning text as tooltip
+          * @since 2.6.0
+         */
+        "showTextAsTooltip"?: boolean;
+        /**
+          * Valid text for the select component
+          * @since 2.6.0
+         */
+        "validText"?: string;
         /**
           * Current selected value. This corresponds to the value property of ix-select-items
           * @since 2.0.0
          */
         "value"?: string | string[];
+        /**
+          * Warning text for the select component
+          * @since 2.6.0
+         */
+        "warningText"?: string;
     }
     interface IxSelectItem {
         /**
@@ -6295,6 +7870,104 @@ declare namespace LocalJSX {
          */
         "small"?: boolean;
     }
+    /**
+     * @since 2.6.0
+     * @form-ready 2.6.0
+     */
+    interface IxTextarea {
+        /**
+          * Determines if the textarea field is disabled.
+         */
+        "disabled"?: boolean;
+        /**
+          * The helper text for the textarea field.
+         */
+        "helperText"?: string;
+        /**
+          * The info text for the textarea field.
+         */
+        "infoText"?: string;
+        /**
+          * The error text for the textarea field.
+         */
+        "invalidText"?: string;
+        /**
+          * The label for the textarea field.
+         */
+        "label"?: string;
+        /**
+          * The maximum length of the textarea field.
+         */
+        "maxLength"?: number;
+        /**
+          * The minimum length of the textarea field.
+         */
+        "minLength"?: number;
+        /**
+          * The name of the textarea field.
+         */
+        "name"?: string;
+        /**
+          * Event emitted when the textarea field loses focus.
+         */
+        "onIxBlur"?: (event: IxTextareaCustomEvent<void>) => void;
+        /**
+          * Event emitted when the validity state of the textarea field changes.
+         */
+        "onValidityStateChange"?: (event: IxTextareaCustomEvent<ValidityState>) => void;
+        /**
+          * Event emitted when the value of the textarea field changes.
+         */
+        "onValueChange"?: (event: IxTextareaCustomEvent<string>) => void;
+        /**
+          * The placeholder text for the textarea field.
+         */
+        "placeholder"?: string;
+        /**
+          * Determines if the textarea field is readonly.
+         */
+        "readonly"?: boolean;
+        /**
+          * Determines if the textarea field is required.
+         */
+        "required"?: boolean;
+        /**
+          * Determines the resize behavior of the textarea field. Resizing can be enabled in one direction, both directions or completely disabled.
+         */
+        "resizeBehavior"?: TextareaResizeBehavior;
+        /**
+          * Determines if the text should be displayed as a tooltip.
+         */
+        "showTextAsTooltip"?: boolean;
+        /**
+          * The width of the textarea specified by number of characters.
+         */
+        "textareaCols"?: number;
+        /**
+          * The height of the textarea field (e.g. "52px").
+         */
+        "textareaHeight"?: string;
+        /**
+          * The height of the textarea specified by number of rows.
+         */
+        "textareaRows"?: number;
+        /**
+          * The width of the textarea field (e.g. "200px").
+         */
+        "textareaWidth"?: string;
+        /**
+          * The valid text for the textarea field.
+         */
+        "validText"?: string;
+        /**
+          * The value of the textarea field.
+         */
+        "value"?: string;
+        /**
+          * The warning text for the textarea field.
+         */
+        "warningText"?: string;
+    }
     interface IxTile {
         /**
           * Size of the tile - one of 'small', 'medium' or 'large'
@@ -6405,6 +8078,9 @@ declare namespace LocalJSX {
         "containerId"?: string;
         "position"?: 'bottom-right' | 'top-right';
     }
+    /**
+     * @form-ready 2.6.0
+     */
     interface IxToggle {
         /**
           * Whether the slide-toggle element is checked or not.
@@ -6422,10 +8098,18 @@ declare namespace LocalJSX {
           * If true the control is in indeterminate state
          */
         "indeterminate"?: boolean;
+        /**
+          * Name of the checkbox component
+         */
+        "name"?: string;
         /**
           * An event will be dispatched each time the slide-toggle changes its value.
          */
         "onCheckedChange"?: (event: IxToggleCustomEvent<boolean>) => void;
+        /**
+          * Required state of the checkbox component.  If true, checkbox needs to be checked to be valid
+         */
+        "required"?: boolean;
         /**
           * Text for indeterminate state
          */
@@ -6438,6 +8122,10 @@ declare namespace LocalJSX {
           * Text for on state
          */
         "textOn"?: string;
+        /**
+          * Value of the checkbox component
+         */
+        "value"?: string;
     }
     /**
      * @since 2.0.0
@@ -6483,7 +8171,7 @@ declare namespace LocalJSX {
         /**
           * CSS selector for hover trigger element e.g. `for="[data-my-custom-select]"`
          */
-        "for"?: string | HTMLElement | Promise<HTMLElement>;
+        "for"?: ElementReference;
         /**
           * Define if the user can access the tooltip via mouse.
          */
@@ -6711,13 +8399,17 @@ declare namespace LocalJSX {
         "ix-card-list": IxCardList;
         "ix-card-title": IxCardTitle;
         "ix-category-filter": IxCategoryFilter;
+        "ix-checkbox": IxCheckbox;
+        "ix-checkbox-group": IxCheckboxGroup;
         "ix-chip": IxChip;
         "ix-col": IxCol;
         "ix-content": IxContent;
         "ix-content-header": IxContentHeader;
         "ix-css-grid": IxCssGrid;
         "ix-css-grid-item": IxCssGridItem;
+        "ix-custom-field": IxCustomField;
         "ix-date-dropdown": IxDateDropdown;
+        "ix-date-input": IxDateInput;
         "ix-date-picker": IxDatePicker;
         "ix-date-time-card": IxDateTimeCard;
         "ix-datetime-picker": IxDatetimePicker;
@@ -6732,19 +8424,23 @@ declare namespace LocalJSX {
         "ix-event-list": IxEventList;
         "ix-event-list-item": IxEventListItem;
         "ix-expanding-search": IxExpandingSearch;
+        "ix-field-label": IxFieldLabel;
+        "ix-field-wrapper": IxFieldWrapper;
         "ix-filter-chip": IxFilterChip;
         "ix-flip-tile": IxFlipTile;
         "ix-flip-tile-content": IxFlipTileContent;
-        "ix-form-field": IxFormField;
         "ix-group": IxGroup;
         "ix-group-context-menu": IxGroupContextMenu;
         "ix-group-item": IxGroupItem;
+        "ix-helper-text": IxHelperText;
         "ix-icon-button": IxIconButton;
         "ix-icon-toggle-button": IxIconToggleButton;
+        "ix-input": IxInput;
         "ix-input-group": IxInputGroup;
         "ix-key-value": IxKeyValue;
         "ix-key-value-list": IxKeyValueList;
         "ix-kpi": IxKpi;
+        "ix-layout-auto": IxLayoutAuto;
         "ix-layout-grid": IxLayoutGrid;
         "ix-link-button": IxLinkButton;
         "ix-map-navigation": IxMapNavigation;
@@ -6763,16 +8459,17 @@ declare namespace LocalJSX {
         "ix-message-bar": IxMessageBar;
         "ix-modal": IxModal;
         "ix-modal-content": IxModalContent;
-        "ix-modal-example": IxModalExample;
         "ix-modal-footer": IxModalFooter;
         "ix-modal-header": IxModalHeader;
         "ix-modal-loading": IxModalLoading;
+        "ix-number-input": IxNumberInput;
         "ix-pagination": IxPagination;
         "ix-pane": IxPane;
         "ix-pane-layout": IxPaneLayout;
         "ix-pill": IxPill;
-        "ix-playground-internal": IxPlaygroundInternal;
         "ix-push-card": IxPushCard;
+        "ix-radio": IxRadio;
+        "ix-radio-group": IxRadioGroup;
         "ix-row": IxRow;
         "ix-select": IxSelect;
         "ix-select-item": IxSelectItem;
@@ -6782,6 +8479,7 @@ declare namespace LocalJSX {
         "ix-split-button-item": IxSplitButtonItem;
         "ix-tab-item": IxTabItem;
         "ix-tabs": IxTabs;
+        "ix-textarea": IxTextarea;
         "ix-tile": IxTile;
         "ix-time-picker": IxTimePicker;
         "ix-toast": IxToast;
@@ -6843,6 +8541,16 @@ declare module "@stencil/core" {
              */
             "ix-card-title": LocalJSX.IxCardTitle & JSXBase.HTMLAttributes<HTMLIxCardTitleElement>;
             "ix-category-filter": LocalJSX.IxCategoryFilter & JSXBase.HTMLAttributes<HTMLIxCategoryFilterElement>;
+            /**
+             * @since 2.6.0
+             * @form-ready 2.6.0
+             */
+            "ix-checkbox": LocalJSX.IxCheckbox & JSXBase.HTMLAttributes<HTMLIxCheckboxElement>;
+            /**
+             * @since 2.6.0
+             * @form-ready 2.6.0
+             */
+            "ix-checkbox-group": LocalJSX.IxCheckboxGroup & JSXBase.HTMLAttributes<HTMLIxCheckboxGroupElement>;
             "ix-chip": LocalJSX.IxChip & JSXBase.HTMLAttributes<HTMLIxChipElement>;
             /**
              * @since 2.0.0
@@ -6855,10 +8563,19 @@ declare module "@stencil/core" {
             "ix-content-header": LocalJSX.IxContentHeader & JSXBase.HTMLAttributes<HTMLIxContentHeaderElement>;
             "ix-css-grid": LocalJSX.IxCssGrid & JSXBase.HTMLAttributes<HTMLIxCssGridElement>;
             "ix-css-grid-item": LocalJSX.IxCssGridItem & JSXBase.HTMLAttributes<HTMLIxCssGridItemElement>;
+            /**
+             * @since 2.6.0
+             */
+            "ix-custom-field": LocalJSX.IxCustomField & JSXBase.HTMLAttributes<HTMLIxCustomFieldElement>;
             /**
              * @since 2.1.0
              */
             "ix-date-dropdown": LocalJSX.IxDateDropdown & JSXBase.HTMLAttributes<HTMLIxDateDropdownElement>;
+            /**
+             * @since 2.6.0
+             * @form-ready 2.6.0
+             */
+            "ix-date-input": LocalJSX.IxDateInput & JSXBase.HTMLAttributes<HTMLIxDateInputElement>;
             "ix-date-picker": LocalJSX.IxDatePicker & JSXBase.HTMLAttributes<HTMLIxDatePickerElement>;
             "ix-date-time-card": LocalJSX.IxDateTimeCard & JSXBase.HTMLAttributes<HTMLIxDateTimeCardElement>;
             "ix-datetime-picker": LocalJSX.IxDatetimePicker & JSXBase.HTMLAttributes<HTMLIxDatetimePickerElement>;
@@ -6888,18 +8605,25 @@ declare module "@stencil/core" {
             "ix-event-list": LocalJSX.IxEventList & JSXBase.HTMLAttributes<HTMLIxEventListElement>;
             "ix-event-list-item": LocalJSX.IxEventListItem & JSXBase.HTMLAttributes<HTMLIxEventListItemElement>;
             "ix-expanding-search": LocalJSX.IxExpandingSearch & JSXBase.HTMLAttributes<HTMLIxExpandingSearchElement>;
+            "ix-field-label": LocalJSX.IxFieldLabel & JSXBase.HTMLAttributes<HTMLIxFieldLabelElement>;
+            "ix-field-wrapper": LocalJSX.IxFieldWrapper & JSXBase.HTMLAttributes<HTMLIxFieldWrapperElement>;
             "ix-filter-chip": LocalJSX.IxFilterChip & JSXBase.HTMLAttributes<HTMLIxFilterChipElement>;
             "ix-flip-tile": LocalJSX.IxFlipTile & JSXBase.HTMLAttributes<HTMLIxFlipTileElement>;
             "ix-flip-tile-content": LocalJSX.IxFlipTileContent & JSXBase.HTMLAttributes<HTMLIxFlipTileContentElement>;
-            "ix-form-field": LocalJSX.IxFormField & JSXBase.HTMLAttributes<HTMLIxFormFieldElement>;
             "ix-group": LocalJSX.IxGroup & JSXBase.HTMLAttributes<HTMLIxGroupElement>;
             "ix-group-context-menu": LocalJSX.IxGroupContextMenu & JSXBase.HTMLAttributes<HTMLIxGroupContextMenuElement>;
             "ix-group-item": LocalJSX.IxGroupItem & JSXBase.HTMLAttributes<HTMLIxGroupItemElement>;
+            "ix-helper-text": LocalJSX.IxHelperText & JSXBase.HTMLAttributes<HTMLIxHelperTextElement>;
             "ix-icon-button": LocalJSX.IxIconButton & JSXBase.HTMLAttributes<HTMLIxIconButtonElement>;
             /**
              * @since 2.0.0
              */
             "ix-icon-toggle-button": LocalJSX.IxIconToggleButton & JSXBase.HTMLAttributes<HTMLIxIconToggleButtonElement>;
+            /**
+             * @since 2.6.0
+             * @form-ready 2.6.0
+             */
+            "ix-input": LocalJSX.IxInput & JSXBase.HTMLAttributes<HTMLIxInputElement>;
             "ix-input-group": LocalJSX.IxInputGroup & JSXBase.HTMLAttributes<HTMLIxInputGroupElement>;
             /**
              * @since 1.6.0
@@ -6910,6 +8634,10 @@ declare module "@stencil/core" {
              */
             "ix-key-value-list": LocalJSX.IxKeyValueList & JSXBase.HTMLAttributes<HTMLIxKeyValueListElement>;
             "ix-kpi": LocalJSX.IxKpi & JSXBase.HTMLAttributes<HTMLIxKpiElement>;
+            /**
+             * @since 2.6.0
+             */
+            "ix-layout-auto": LocalJSX.IxLayoutAuto & JSXBase.HTMLAttributes<HTMLIxLayoutAutoElement>;
             /**
              * @since 2.0.0
              */
@@ -6940,7 +8668,6 @@ declare module "@stencil/core" {
              * @since 2.0.0
              */
             "ix-modal-content": LocalJSX.IxModalContent & JSXBase.HTMLAttributes<HTMLIxModalContentElement>;
-            "ix-modal-example": LocalJSX.IxModalExample & JSXBase.HTMLAttributes<HTMLIxModalExampleElement>;
             /**
              * @since 2.0.0
              */
@@ -6950,6 +8677,11 @@ declare module "@stencil/core" {
              */
             "ix-modal-header": LocalJSX.IxModalHeader & JSXBase.HTMLAttributes<HTMLIxModalHeaderElement>;
             "ix-modal-loading": LocalJSX.IxModalLoading & JSXBase.HTMLAttributes<HTMLIxModalLoadingElement>;
+            /**
+             * @since 2.6.0
+             * @form-ready 2.6.0
+             */
+            "ix-number-input": LocalJSX.IxNumberInput & JSXBase.HTMLAttributes<HTMLIxNumberInputElement>;
             /**
              * @since 1.5.0
              */
@@ -6963,15 +8695,27 @@ declare module "@stencil/core" {
              */
             "ix-pane-layout": LocalJSX.IxPaneLayout & JSXBase.HTMLAttributes<HTMLIxPaneLayoutElement>;
             "ix-pill": LocalJSX.IxPill & JSXBase.HTMLAttributes<HTMLIxPillElement>;
-            "ix-playground-internal": LocalJSX.IxPlaygroundInternal & JSXBase.HTMLAttributes<HTMLIxPlaygroundInternalElement>;
             /**
              * @since 1.6.0
              */
             "ix-push-card": LocalJSX.IxPushCard & JSXBase.HTMLAttributes<HTMLIxPushCardElement>;
+            /**
+             * @since 2.6.0
+             * @form-ready 2.6.0
+             */
+            "ix-radio": LocalJSX.IxRadio & JSXBase.HTMLAttributes<HTMLIxRadioElement>;
+            /**
+             * @since 2.6.0
+             * @form-ready 2.6.0
+             */
+            "ix-radio-group": LocalJSX.IxRadioGroup & JSXBase.HTMLAttributes<HTMLIxRadioGroupElement>;
             /**
              * @since 2.0.0
              */
             "ix-row": LocalJSX.IxRow & JSXBase.HTMLAttributes<HTMLIxRowElement>;
+            /**
+             * @form-ready 2.6.0
+             */
             "ix-select": LocalJSX.IxSelect & JSXBase.HTMLAttributes<HTMLIxSelectElement>;
             "ix-select-item": LocalJSX.IxSelectItem & JSXBase.HTMLAttributes<HTMLIxSelectItemElement>;
             /**
@@ -6986,10 +8730,18 @@ declare module "@stencil/core" {
             "ix-split-button-item": LocalJSX.IxSplitButtonItem & JSXBase.HTMLAttributes<HTMLIxSplitButtonItemElement>;
             "ix-tab-item": LocalJSX.IxTabItem & JSXBase.HTMLAttributes<HTMLIxTabItemElement>;
             "ix-tabs": LocalJSX.IxTabs & JSXBase.HTMLAttributes<HTMLIxTabsElement>;
+            /**
+             * @since 2.6.0
+             * @form-ready 2.6.0
+             */
+            "ix-textarea": LocalJSX.IxTextarea & JSXBase.HTMLAttributes<HTMLIxTextareaElement>;
             "ix-tile": LocalJSX.IxTile & JSXBase.HTMLAttributes<HTMLIxTileElement>;
             "ix-time-picker": LocalJSX.IxTimePicker & JSXBase.HTMLAttributes<HTMLIxTimePickerElement>;
             "ix-toast": LocalJSX.IxToast & JSXBase.HTMLAttributes<HTMLIxToastElement>;
             "ix-toast-container": LocalJSX.IxToastContainer & JSXBase.HTMLAttributes<HTMLIxToastContainerElement>;
+            /**
+             * @form-ready 2.6.0
+             */
             "ix-toggle": LocalJSX.IxToggle & JSXBase.HTMLAttributes<HTMLIxToggleElement>;
             /**
              * @since 2.0.0