@ukic/web-components 2.5.0 → 2.7.0

package/dist/types/components.d.ts

@@ -5,7 +5,7 @@
  * It contains typing information for all components that exist in this project.
  */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
-import { IcActivationTypes, IcAdditionalFieldTypes, IcAlignment, IcAutocompleteTypes, IcAutocorrectStates, IcBlurEventDetail, IcInformationStatusOrEmpty, IcMenuOption, IcOrientation, IcSearchMatchPositions, IcSizes, IcStatusVariants, IcTheme, IcThemeForeground, IcThemeForegroundNoDefault, IcTypographyVariants, IcValueEventDetail } from "./utils/types";
+import { IcActivationTypes, IcAdditionalFieldTypes, IcAlignment, IcAutocompleteTypes, IcAutocorrectStates, IcBlurEventDetail, IcEmphasisType, IcInformationStatusOrEmpty, IcMenuOption, IcOrientation, IcSearchMatchPositions, IcSizes, IcSizesNoLarge, IcStatusVariants, IcTheme, IcThemeForeground, IcThemeForegroundNoDefault, IcTypographyVariants, IcValueEventDetail } from "./utils/types";
 import { IcBadgePositions, IcBadgeTypes, IcBadgeVariants, IcColor } from "./components/ic-badge/ic-badge.types";
 import { IcButtonTooltipPlacement, IcButtonTypes, IcButtonVariants } from "./components/ic-button/ic-button.types";
 import { IcChangeEventDetail } from "./components/ic-checkbox-group/ic-checkbox-group.types";
@@ -30,7 +30,7 @@ import { IcSwitchChangeEventDetail } from "./components/ic-switch/ic-switch.type
 import { IcTabClickEventDetail, IcTabSelectEventDetail } from "./components/ic-tab/ic-tab.types";
 import { IcAriaAutocompleteTypes, IcTextFieldInputModes, IcTextFieldTypes } from "./components/ic-text-field/ic-text-field.types";
 import { IcTooltipPlacements } from "./components/ic-tooltip/ic-tooltip.types";
-export { IcActivationTypes, IcAdditionalFieldTypes, IcAlignment, IcAutocompleteTypes, IcAutocorrectStates, IcBlurEventDetail, IcInformationStatusOrEmpty, IcMenuOption, IcOrientation, IcSearchMatchPositions, IcSizes, IcStatusVariants, IcTheme, IcThemeForeground, IcThemeForegroundNoDefault, IcTypographyVariants, IcValueEventDetail } from "./utils/types";
+export { IcActivationTypes, IcAdditionalFieldTypes, IcAlignment, IcAutocompleteTypes, IcAutocorrectStates, IcBlurEventDetail, IcEmphasisType, IcInformationStatusOrEmpty, IcMenuOption, IcOrientation, IcSearchMatchPositions, IcSizes, IcSizesNoLarge, IcStatusVariants, IcTheme, IcThemeForeground, IcThemeForegroundNoDefault, IcTypographyVariants, IcValueEventDetail } from "./utils/types";
 export { IcBadgePositions, IcBadgeTypes, IcBadgeVariants, IcColor } from "./components/ic-badge/ic-badge.types";
 export { IcButtonTooltipPlacement, IcButtonTypes, IcButtonVariants } from "./components/ic-button/ic-button.types";
 export { IcChangeEventDetail } from "./components/ic-checkbox-group/ic-checkbox-group.types";
@@ -147,7 +147,7 @@ export namespace Components {
          */
         "customColor"?: IcColor;
         /**
-          * Use to hide the badge.
+          * @deprecated This method should not be used anymore. Use visible prop to set badge visibility.
          */
         "hideBadge": () => Promise<void>;
         /**
@@ -159,7 +159,7 @@ export namespace Components {
          */
         "position"?: IcBadgePositions;
         /**
-          * Use to show the badge.
+          * @deprecated This method should not be used anymore. Use visible prop to set badge visibility.
          */
         "showBadge": () => Promise<void>;
         /**
@@ -178,6 +178,10 @@ export namespace Components {
           * The variant of the badge to be displayed.
          */
         "variant"?: IcBadgeVariants;
+        /**
+          * If `true`, the badge will be displayed.
+         */
+        "visible": boolean;
     }
     interface IcBreadcrumb {
         /**
@@ -213,6 +217,8 @@ export namespace Components {
           * The appearance of the button, e.g. dark, light, or the default.
          */
         "appearance"?: IcThemeForeground;
+        "ariaControlsId": string | boolean;
+        "ariaOwnsId": string | boolean;
         /**
           * If `true`, the ic-tooltip which is shown for icon variant will be disabled. Title or aria-label must be set if this prop is not applied.
          */
@@ -293,7 +299,6 @@ export namespace Components {
           * The type of the button.
          */
         "type"?: IcButtonTypes;
-        "updateAriaLabel": (newValue: string) => Promise<void>;
         /**
           * The variant of the button to be displayed.
          */
@@ -370,6 +375,30 @@ export namespace Components {
           * The text to be displayed when dynamic.
          */
         "dynamicText": string;
+        /**
+          * The <form> element to associate the checkbox with.
+         */
+        "form"?: string;
+        /**
+          * The URL that processes the information submitted by the checkbox. It overrides the action attribute of the checkbox's form owner. Does nothing if there is no form owner.
+         */
+        "formaction"?: string;
+        /**
+          * The way the submitted form data is encoded.
+         */
+        "formenctype"?: string;
+        /**
+          * The HTTP method used to submit the form.
+         */
+        "formmethod"?: string;
+        /**
+          * If `true`, the form will not be validated when submitted.
+         */
+        "formnovalidate"?: boolean;
+        /**
+          * The place to display the response from submitting the form. It overrides the target attribute of the checkbox's form owner.
+         */
+        "formtarget"?: string;
         /**
           * The group label for the checkbox.
          */
@@ -447,7 +476,7 @@ export namespace Components {
     }
     interface IcChip {
         /**
-          * The emphasis of the chip.
+          * @deprecated This prop should not be used anymore. Use variant prop instead.
          */
         "appearance"?: IcChipAppearance;
         /**
@@ -470,6 +499,10 @@ export namespace Components {
           * The size of the chip.
          */
         "size"?: IcSizes;
+        /**
+          * The emphasis of the chip.
+         */
+        "variant"?: IcEmphasisType;
     }
     interface IcClassificationBanner {
         /**
@@ -499,9 +532,13 @@ export namespace Components {
          */
         "heading": string;
         /**
-          * If `true`, the small styling will be applied to the data heading and all child data rows.
+          * The size of the data entity component.
          */
-        "small": boolean;
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
+         */
+        "small"?: boolean;
     }
     interface IcDataRow {
         /**
@@ -509,9 +546,13 @@ export namespace Components {
          */
         "label": string;
         /**
-          * If `true`, the small styling will be applied to the row. This is automatically applied if small is set on the parent data heading.
+          * The size of the data row component.
          */
-        "small": boolean;
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
+         */
+        "small"?: boolean;
         /**
           * The value of the middle (right if no end-component supplied) cell of the row.
          */
@@ -519,11 +560,11 @@ export namespace Components {
     }
     interface IcDialog {
         /**
-          * If a status is set, sets the heading for the displayed alert.
+          * @deprecated This prop should not be used anymore. Use an ic-alert/IcAlert component within an alert slot with a heading instead.
          */
         "alertHeading"?: string;
         /**
-          * If a status is set, sets the message for the displayed alert.
+          * @deprecated This prop should not be used anymore. Use an ic-alert/IcAlert component within an alert slot with a message instead.
          */
         "alertMessage"?: string;
         /**
@@ -559,7 +600,11 @@ export namespace Components {
          */
         "heading": string;
         /**
-          * Use to hide the dialog.
+          * If `true`, the close button will not be displayed.
+         */
+        "hideCloseButton"?: boolean;
+        /**
+          * @deprecated This method should not be used anymore. Use open prop to set dialog visibility.
          */
         "hideDialog": () => Promise<void>;
         /**
@@ -567,7 +612,11 @@ export namespace Components {
          */
         "label"?: string;
         /**
-          * Use to show the dialog.
+          * If `true`, the dialog will be displayed.
+         */
+        "open": boolean;
+        /**
+          * @deprecated This method should not be used anymore. Use open prop to set dialog visibility.
          */
         "showDialog": () => Promise<void>;
         /**
@@ -575,7 +624,7 @@ export namespace Components {
          */
         "size"?: "small" | "medium" | "large";
         /**
-          * If set, displays an alert of the corresponding variant below the heading.
+          * @deprecated This prop should not be used anymore. Use an ic-alert/IcAlert component within an alert slot with a variant instead.
          */
         "status"?: "neutral" | "info" | "warning" | "error" | "success";
     }
@@ -597,7 +646,7 @@ export namespace Components {
         /**
           * The title rendered in the empty state container.
          */
-        "heading": string;
+        "heading"?: string;
         /**
           * The size of the image or icon used in the image slot.
          */
@@ -695,9 +744,13 @@ export namespace Components {
          */
         "secondarySubheading"?: string;
         /**
-          * If `true`, the small styling will be applied to the hero.
+          * The size of the hero component.
          */
-        "small": boolean;
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
+         */
+        "small"?: boolean;
         /**
           * The description for the hero.
          */
@@ -708,11 +761,16 @@ export namespace Components {
           * The appearance of the horizontal scroll, e.g. dark, light or the default.
          */
         "appearance"?: IcThemeForeground;
+        "focusTrigger"?: string;
         "scrollItemIntoView": (itemPosition: number) => Promise<void>;
     }
     interface IcInputComponentContainer {
         /**
-          * If `true`, the dark variant of the input component container will be displayed.
+          * The appearance of the input component container.
+         */
+        "appearance"?: "dark" | "default";
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `appearance` to "dark" instead.
          */
         "dark"?: boolean;
         /**
@@ -732,9 +790,13 @@ export namespace Components {
          */
         "readonly": boolean;
         /**
-          * If `true`, the small styling will be applied to the input component container.
+          * The size of the input component container component.
          */
-        "small": boolean;
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
+         */
+        "small"?: boolean;
         /**
           * If `true`, the validation will display inline.
          */
@@ -756,7 +818,11 @@ export namespace Components {
     }
     interface IcInputLabel {
         /**
-          * If `true`, the dark variant of the input label will be displayed.
+          * The appearance of the input label.
+         */
+        "appearance"?: "dark" | "default";
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `appearance` to "dark" instead.
          */
         "dark"?: boolean;
         /**
@@ -942,7 +1008,11 @@ export namespace Components {
          */
         "searchMode"?: IcSearchBarSearchModes;
         /**
-          * If `true`, the small styling will be applied to the menu.
+          * The size of the menu component.
+         */
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
          */
         "small"?: boolean;
         /**
@@ -1123,7 +1193,11 @@ export namespace Components {
          */
         "reverseOrder"?: boolean;
         /**
-          * If `true`, the small styling will be applied to the page header.
+          * The size of the page header component.
+         */
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
          */
         "small"?: boolean;
         /**
@@ -1272,9 +1346,13 @@ export namespace Components {
          */
         "required": boolean;
         /**
-          * If `true`, the small styling will be applied to the radio group.
+          * The size of the radio group component.
          */
-        "small": boolean;
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
+         */
+        "small"?: boolean;
         /**
           * The validation status - e.g. 'error' | 'warning' | 'success'.
          */
@@ -1297,6 +1375,30 @@ export namespace Components {
           * The text to be displayed when dynamic.
          */
         "dynamicText": string;
+        /**
+          * The <form> element to associate the radio with.
+         */
+        "form"?: string;
+        /**
+          * The URL that processes the information submitted by the radio. It overrides the action attribute of the radio's form owner. Does nothing if there is no form owner.
+         */
+        "formaction"?: string;
+        /**
+          * The way the submitted form data is encoded.
+         */
+        "formenctype"?: string;
+        /**
+          * The HTTP method used to submit the form.
+         */
+        "formmethod"?: string;
+        /**
+          * If `true`, the form will not be validated when submitted.
+         */
+        "formnovalidate"?: boolean;
+        /**
+          * The place to display the response from submitting the form. It overrides the target attribute of the radio's form owner.
+         */
+        "formtarget"?: string;
         /**
           * The group label for the radio option.
          */
@@ -1428,7 +1530,11 @@ export namespace Components {
          */
         "setFocus": () => Promise<void>;
         /**
-          * If `true`, the small styling will be applied to the search bar.
+          * The size of the search bar component.
+         */
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
          */
         "small"?: boolean;
         /**
@@ -1480,7 +1586,31 @@ export namespace Components {
          */
         "emptyOptionListText": string;
         /**
-          * If `true`, the select element will fill the width of the container.
+          * The <form> element to associate the select with.
+         */
+        "form"?: string;
+        /**
+          * The URL that processes the information submitted by the select. It overrides the action attribute of the select's form owner. Does nothing if there is no form owner. This prop should only be used with searchable select and will only be applied if searchable is true.
+         */
+        "formaction"?: string;
+        /**
+          * The way the submitted form data is encoded. This prop should only be used with searchable select and will only be applied if searchable is true.
+         */
+        "formenctype"?: string;
+        /**
+          * The HTTP method used to submit the form. This prop should only be used with searchable select and will only be applied if searchable is true.
+         */
+        "formmethod"?: string;
+        /**
+          * If `true`, the form will not be validated when submitted. This prop should only be used with searchable select and will only be applied if searchable is true.
+         */
+        "formnovalidate"?: boolean;
+        /**
+          * The place to display the response from submitting the form. It overrides the target attribute of the select's form owner. This prop should only be used with searchable select and will only be applied if searchable is true.
+         */
+        "formtarget"?: string;
+        /**
+          * If `true`, the select element will fill the width of the container. This prop should only be used with searchable select and will only be applied if searchable is true.
          */
         "fullWidth": boolean;
         /**
@@ -1552,7 +1682,11 @@ export namespace Components {
          */
         "showClearButton"?: boolean;
         /**
-          * If `true`, the small styling will be applied to the select.
+          * The size of the select component.
+         */
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
          */
         "small"?: boolean;
         /**
@@ -1585,6 +1719,10 @@ export namespace Components {
           * If `true`, automatic parent wrapper styling will be disabled.
          */
         "disableAutoParentStyling": boolean;
+        /**
+          * If `true`, the side navigation will not display as a top bar on small devices.
+         */
+        "disableTopBarBehaviour": boolean;
         /**
           * If `true`, the side navigation will load in an expanded state.
          */
@@ -1613,7 +1751,11 @@ export namespace Components {
     }
     interface IcSkeleton {
         /**
-          * If `true`, the skeleton will be set to the light variant.
+          * The appearance of the skeleton.
+         */
+        "appearance"?: "light" | "default";
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `appearance` to "light" instead.
          */
         "light"?: boolean;
         /**
@@ -1627,7 +1769,7 @@ export namespace Components {
          */
         "announced"?: boolean;
         /**
-          * The emphasis of the status tag.
+          * @deprecated This prop should not be used anymore. Use variant prop instead.
          */
         "appearance"?: IcStatusTagAppearance;
         /**
@@ -1635,13 +1777,21 @@ export namespace Components {
          */
         "label": string;
         /**
-          * If `true`, the small styling will be applied to the status tag.
+          * The size of the status tag component.
+         */
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
          */
         "small"?: boolean;
         /**
           * The colour of the status tag.
          */
         "status"?: IcStatusTagStatuses;
+        /**
+          * The emphasis of the status tag.
+         */
+        "variant"?: IcEmphasisType;
     }
     interface IcStep {
         "compactStepStyling"?: IcStepTypes;
@@ -1721,7 +1871,11 @@ export namespace Components {
          */
         "showState"?: boolean;
         /**
-          * If `true`, the small styling will be applied to the switch.
+          * The size of the switch component.
+         */
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
          */
         "small"?: boolean;
         /**
@@ -1884,9 +2038,13 @@ export namespace Components {
          */
         "setFocus": () => Promise<void>;
         /**
-          * If `true`, the small styling will be applied to the text field.
+          * The size of the text field component.
          */
-        "small": boolean;
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
+         */
+        "small"?: boolean;
         /**
           * If `true`, the value of the text field will have its spelling and grammar checked.
          */
@@ -1946,7 +2104,6 @@ export namespace Components {
          */
         "neutralIconAriaLabel"?: string;
         /**
-          * Used to display the individual toast
           * @returns The element that previously had focus before the toast appeared
          */
         "setVisible": () => Promise<HTMLElement>;
@@ -1957,8 +2114,11 @@ export namespace Components {
     }
     interface IcToastRegion {
         /**
-          * Handles setting the visibility of various toasts based on what is already visible
-          * @param toast The toast element being requested to display
+          * The toast element to be displayed.
+         */
+        "openToast": HTMLIcToastElement;
+        /**
+          * @deprecated Use openToast prop to display toast instead.
          */
         "setVisible": (toast: HTMLIcToastElement) => Promise<void>;
     }
@@ -1977,6 +2137,10 @@ export namespace Components {
           * The text to display on the tooltip.
          */
         "label": string;
+        /**
+          * The number of lines to display before truncating the text.
+         */
+        "maxLines"?: number;
         /**
           * The position of the tool-tip in relation to the parent element.
          */
@@ -2707,6 +2871,10 @@ declare namespace LocalJSX {
           * The variant of the badge to be displayed.
          */
         "variant"?: IcBadgeVariants;
+        /**
+          * If `true`, the badge will be displayed.
+         */
+        "visible"?: boolean;
     }
     interface IcBreadcrumb {
         /**
@@ -2893,6 +3061,30 @@ declare namespace LocalJSX {
           * The text to be displayed when dynamic.
          */
         "dynamicText"?: string;
+        /**
+          * The <form> element to associate the checkbox with.
+         */
+        "form"?: string;
+        /**
+          * The URL that processes the information submitted by the checkbox. It overrides the action attribute of the checkbox's form owner. Does nothing if there is no form owner.
+         */
+        "formaction"?: string;
+        /**
+          * The way the submitted form data is encoded.
+         */
+        "formenctype"?: string;
+        /**
+          * The HTTP method used to submit the form.
+         */
+        "formmethod"?: string;
+        /**
+          * If `true`, the form will not be validated when submitted.
+         */
+        "formnovalidate"?: boolean;
+        /**
+          * The place to display the response from submitting the form. It overrides the target attribute of the checkbox's form owner.
+         */
+        "formtarget"?: string;
         /**
           * The group label for the checkbox.
          */
@@ -2978,7 +3170,7 @@ declare namespace LocalJSX {
     }
     interface IcChip {
         /**
-          * The emphasis of the chip.
+          * @deprecated This prop should not be used anymore. Use variant prop instead.
          */
         "appearance"?: IcChipAppearance;
         /**
@@ -3005,6 +3197,10 @@ declare namespace LocalJSX {
           * The size of the chip.
          */
         "size"?: IcSizes;
+        /**
+          * The emphasis of the chip.
+         */
+        "variant"?: IcEmphasisType;
     }
     interface IcClassificationBanner {
         /**
@@ -3034,7 +3230,11 @@ declare namespace LocalJSX {
          */
         "heading"?: string;
         /**
-          * If `true`, the small styling will be applied to the data heading and all child data rows.
+          * The size of the data entity component.
+         */
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
          */
         "small"?: boolean;
     }
@@ -3044,7 +3244,11 @@ declare namespace LocalJSX {
          */
         "label"?: string;
         /**
-          * If `true`, the small styling will be applied to the row. This is automatically applied if small is set on the parent data heading.
+          * The size of the data row component.
+         */
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
          */
         "small"?: boolean;
         /**
@@ -3054,11 +3258,11 @@ declare namespace LocalJSX {
     }
     interface IcDialog {
         /**
-          * If a status is set, sets the heading for the displayed alert.
+          * @deprecated This prop should not be used anymore. Use an ic-alert/IcAlert component within an alert slot with a heading instead.
          */
         "alertHeading"?: string;
         /**
-          * If a status is set, sets the message for the displayed alert.
+          * @deprecated This prop should not be used anymore. Use an ic-alert/IcAlert component within an alert slot with a message instead.
          */
         "alertMessage"?: string;
         /**
@@ -3085,6 +3289,10 @@ declare namespace LocalJSX {
           * Sets the heading for the dialog.
          */
         "heading": string;
+        /**
+          * If `true`, the close button will not be displayed.
+         */
+        "hideCloseButton"?: boolean;
         /**
           * Sets the optional label for the dialog which appears above the heading.
          */
@@ -3105,12 +3313,16 @@ declare namespace LocalJSX {
           * Emitted when dialog has opened.
          */
         "onIcDialogOpened"?: (event: IcDialogCustomEvent<void>) => void;
+        /**
+          * If `true`, the dialog will be displayed.
+         */
+        "open"?: boolean;
         /**
           * Sets the maximum and minimum height and width for the dialog.
          */
         "size"?: "small" | "medium" | "large";
         /**
-          * If set, displays an alert of the corresponding variant below the heading.
+          * @deprecated This prop should not be used anymore. Use an ic-alert/IcAlert component within an alert slot with a variant instead.
          */
         "status"?: "neutral" | "info" | "warning" | "error" | "success";
     }
@@ -3132,7 +3344,7 @@ declare namespace LocalJSX {
         /**
           * The title rendered in the empty state container.
          */
-        "heading": string;
+        "heading"?: string;
         /**
           * The size of the image or icon used in the image slot.
          */
@@ -3230,7 +3442,11 @@ declare namespace LocalJSX {
          */
         "secondarySubheading"?: string;
         /**
-          * If `true`, the small styling will be applied to the hero.
+          * The size of the hero component.
+         */
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
          */
         "small"?: boolean;
         /**
@@ -3246,7 +3462,11 @@ declare namespace LocalJSX {
     }
     interface IcInputComponentContainer {
         /**
-          * If `true`, the dark variant of the input component container will be displayed.
+          * The appearance of the input component container.
+         */
+        "appearance"?: "dark" | "default";
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `appearance` to "dark" instead.
          */
         "dark"?: boolean;
         /**
@@ -3266,7 +3486,11 @@ declare namespace LocalJSX {
          */
         "readonly"?: boolean;
         /**
-          * If `true`, the small styling will be applied to the input component container.
+          * The size of the input component container component.
+         */
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
          */
         "small"?: boolean;
         /**
@@ -3290,7 +3514,11 @@ declare namespace LocalJSX {
     }
     interface IcInputLabel {
         /**
-          * If `true`, the dark variant of the input label will be displayed.
+          * The appearance of the input label.
+         */
+        "appearance"?: "dark" | "default";
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `appearance` to "dark" instead.
          */
         "dark"?: boolean;
         /**
@@ -3462,7 +3690,11 @@ declare namespace LocalJSX {
          */
         "searchMode"?: IcSearchBarSearchModes;
         /**
-          * If `true`, the small styling will be applied to the menu.
+          * The size of the menu component.
+         */
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
          */
         "small"?: boolean;
         /**
@@ -3628,7 +3860,11 @@ declare namespace LocalJSX {
          */
         "reverseOrder"?: boolean;
         /**
-          * If `true`, the small styling will be applied to the page header.
+          * The size of the page header component.
+         */
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
          */
         "small"?: boolean;
         /**
@@ -3776,7 +4012,11 @@ declare namespace LocalJSX {
          */
         "required"?: boolean;
         /**
-          * If `true`, the small styling will be applied to the radio group.
+          * The size of the radio group component.
+         */
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
          */
         "small"?: boolean;
         /**
@@ -3801,6 +4041,30 @@ declare namespace LocalJSX {
           * The text to be displayed when dynamic.
          */
         "dynamicText"?: string;
+        /**
+          * The <form> element to associate the radio with.
+         */
+        "form"?: string;
+        /**
+          * The URL that processes the information submitted by the radio. It overrides the action attribute of the radio's form owner. Does nothing if there is no form owner.
+         */
+        "formaction"?: string;
+        /**
+          * The way the submitted form data is encoded.
+         */
+        "formenctype"?: string;
+        /**
+          * The HTTP method used to submit the form.
+         */
+        "formmethod"?: string;
+        /**
+          * If `true`, the form will not be validated when submitted.
+         */
+        "formnovalidate"?: boolean;
+        /**
+          * The place to display the response from submitting the form. It overrides the target attribute of the radio's form owner.
+         */
+        "formtarget"?: string;
         /**
           * The group label for the radio option.
          */
@@ -3980,7 +4244,11 @@ declare namespace LocalJSX {
          */
         "searchMode"?: IcSearchBarSearchModes;
         /**
-          * If `true`, the small styling will be applied to the search bar.
+          * The size of the search bar component.
+         */
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
          */
         "small"?: boolean;
         /**
@@ -4032,7 +4300,31 @@ declare namespace LocalJSX {
          */
         "emptyOptionListText"?: string;
         /**
-          * If `true`, the select element will fill the width of the container.
+          * The <form> element to associate the select with.
+         */
+        "form"?: string;
+        /**
+          * The URL that processes the information submitted by the select. It overrides the action attribute of the select's form owner. Does nothing if there is no form owner. This prop should only be used with searchable select and will only be applied if searchable is true.
+         */
+        "formaction"?: string;
+        /**
+          * The way the submitted form data is encoded. This prop should only be used with searchable select and will only be applied if searchable is true.
+         */
+        "formenctype"?: string;
+        /**
+          * The HTTP method used to submit the form. This prop should only be used with searchable select and will only be applied if searchable is true.
+         */
+        "formmethod"?: string;
+        /**
+          * If `true`, the form will not be validated when submitted. This prop should only be used with searchable select and will only be applied if searchable is true.
+         */
+        "formnovalidate"?: boolean;
+        /**
+          * The place to display the response from submitting the form. It overrides the target attribute of the select's form owner. This prop should only be used with searchable select and will only be applied if searchable is true.
+         */
+        "formtarget"?: string;
+        /**
+          * If `true`, the select element will fill the width of the container. This prop should only be used with searchable select and will only be applied if searchable is true.
          */
         "fullWidth"?: boolean;
         /**
@@ -4128,7 +4420,11 @@ declare namespace LocalJSX {
          */
         "showClearButton"?: boolean;
         /**
-          * If `true`, the small styling will be applied to the select.
+          * The size of the select component.
+         */
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
          */
         "small"?: boolean;
         /**
@@ -4161,6 +4457,10 @@ declare namespace LocalJSX {
           * If `true`, automatic parent wrapper styling will be disabled.
          */
         "disableAutoParentStyling"?: boolean;
+        /**
+          * If `true`, the side navigation will not display as a top bar on small devices.
+         */
+        "disableTopBarBehaviour"?: boolean;
         /**
           * If `true`, the side navigation will load in an expanded state.
          */
@@ -4188,7 +4488,11 @@ declare namespace LocalJSX {
     }
     interface IcSkeleton {
         /**
-          * If `true`, the skeleton will be set to the light variant.
+          * The appearance of the skeleton.
+         */
+        "appearance"?: "light" | "default";
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `appearance` to "light" instead.
          */
         "light"?: boolean;
         /**
@@ -4202,7 +4506,7 @@ declare namespace LocalJSX {
          */
         "announced"?: boolean;
         /**
-          * The emphasis of the status tag.
+          * @deprecated This prop should not be used anymore. Use variant prop instead.
          */
         "appearance"?: IcStatusTagAppearance;
         /**
@@ -4210,13 +4514,21 @@ declare namespace LocalJSX {
          */
         "label": string;
         /**
-          * If `true`, the small styling will be applied to the status tag.
+          * The size of the status tag component.
+         */
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
          */
         "small"?: boolean;
         /**
           * The colour of the status tag.
          */
         "status"?: IcStatusTagStatuses;
+        /**
+          * The emphasis of the status tag.
+         */
+        "variant"?: IcEmphasisType;
     }
     interface IcStep {
         /**
@@ -4296,7 +4608,11 @@ declare namespace LocalJSX {
          */
         "showState"?: boolean;
         /**
-          * If `true`, the small styling will be applied to the switch.
+          * The size of the switch component.
+         */
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
          */
         "small"?: boolean;
         /**
@@ -4462,7 +4778,11 @@ declare namespace LocalJSX {
          */
         "rows"?: number;
         /**
-          * If `true`, the small styling will be applied to the text field.
+          * The size of the text field component.
+         */
+        "size"?: IcSizesNoLarge;
+        /**
+          * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
          */
         "small"?: boolean;
         /**
@@ -4531,6 +4851,10 @@ declare namespace LocalJSX {
         "variant"?: IcStatusVariants;
     }
     interface IcToastRegion {
+        /**
+          * The toast element to be displayed.
+         */
+        "openToast"?: HTMLIcToastElement;
     }
     interface IcTooltip {
         /**
@@ -4541,6 +4865,10 @@ declare namespace LocalJSX {
           * The text to display on the tooltip.
          */
         "label": string;
+        /**
+          * The number of lines to display before truncating the text.
+         */
+        "maxLines"?: number;
         /**
           * The position of the tool-tip in relation to the parent element.
          */