@ukic/web-components 2.29.1 → 3.0.0-alpha.2

package/dist/types/components/ic-hero/ic-hero.d.ts

@@ -30,11 +30,11 @@ export declare class Hero {
      */
     disableBackgroundParallax?: boolean;
     /**
-     * The heading of the hero.
+     * The heading of the hero. An <h2> level heading.
      */
     heading: string;
     /**
-     * The optional secondary heading, replaced by slotted right content.
+     * The optional secondary heading, an <h3> level heading. Replaced by slotted right content.
      */
     secondaryHeading?: string;
     /**
@@ -45,10 +45,6 @@ export declare class 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;
     /**
      * The description for the hero.
      */

package/dist/types/components/ic-input-component-container/ic-input-component-container.d.ts

@@ -9,10 +9,6 @@ export declare class InputComponentContainer {
      * 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;
     /**
      *  If `true`, the disabled state will be set.
      */
@@ -33,10 +29,6 @@ export declare class InputComponentContainer {
      * The size of the input component container component.
      */
     size?: IcSizes;
-    /**
-     * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
-     */
-    small?: boolean;
     /**
      *  If `true`, the validation will display inline.
      */

package/dist/types/components/ic-input-label/ic-input-label.d.ts

@@ -3,18 +3,10 @@ export declare class InputLabel {
      * 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;
     /**
      * If `true`, the disabled state will be set.
      */
     disabled: boolean;
-    /**
-     * If `true`, the input label will display with error styling.
-     */
-    error?: boolean;
     /**
      * The ID of the form element the label is bound to.
      */
@@ -35,6 +27,10 @@ export declare class InputLabel {
      * If `true`, the input label will require a value.
      */
     required: boolean;
+    /**
+     * The status of the label - e.g. 'error'.
+     */
+    status: "error" | "";
     componentDidLoad(): void;
     render(): any;
 }

package/dist/types/components/ic-link/ic-link.d.ts

@@ -1,4 +1,4 @@
-import { IcTheme, IcThemeForeground } from "../../utils/types";
+import { IcTheme, IcThemeMode } from "../../utils/types";
 /**
  * @slot router-item - Handle routing by nesting your routes in this slot.
  */
@@ -7,10 +7,6 @@ export declare class Link {
     private routerSlot;
     private hostMutationObserver;
     el: HTMLIcLinkElement;
-    /**
-     * The appearance of the link, e.g. dark, light, or default.
-     */
-    appearance?: IcThemeForeground;
     /**
      * If `true`, the user can save the linked URL instead of navigating to it.
      */
@@ -23,6 +19,10 @@ export declare class Link {
      * The human language of the linked URL.
      */
     hreflang?: string;
+    /**
+     * If `true`, the link will display as black in the light theme, and white in the dark theme.
+     */
+    monochrome?: boolean;
     /**
      * How much of the referrer to send when following the link.
      */
@@ -31,14 +31,14 @@ export declare class Link {
      * The relationship of the linked URL as space-separated link types.
      */
     rel?: string;
-    /**
-     * @deprecated This prop should not be used anymore. The 'open in new tab/window' icon will display automatically if target="_blank".
-     */
-    showIcon?: boolean;
     /**
      * The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).
      */
     target?: string;
+    /**
+     * Sets the theme color to the dark or light theme color. "inherit" will set the color based on the system settings or ic-theme component.
+     */
+    theme?: IcThemeMode;
     componentWillLoad(): void;
     componentDidLoad(): void;
     disconnectedCallback(): void;

package/dist/types/components/ic-loading-indicator/ic-loading-indicator.d.ts

@@ -1,5 +1,5 @@
 import { IcLoadingSizes, IcLoadingTypes } from "./ic-loading-indicator.types";
-import { IcThemeForegroundNoDefault } from "../../utils/types";
+import { IcThemeMode } from "../../utils/types";
 export declare class LoadingIndicator {
     private circularMeter;
     private innerElement?;
@@ -11,11 +11,7 @@ export declare class LoadingIndicator {
     circularLineWidth: number;
     indeterminate: boolean;
     indicatorLabel: string;
-    showSecond: boolean;
-    /**
-     * The appearance of the loading indicator, e.g. dark or light.
-     */
-    appearance?: IcThemeForegroundNoDefault;
+    clipInnerElement: boolean;
     /**
      * The description that will be set as the aria-label of the loading indicator when not using a visible label.
      */
@@ -42,6 +38,10 @@ export declare class LoadingIndicator {
      * Used to calculate the proportional width of the progress bar.
      */
     min?: number;
+    /**
+     * If `true`, the element will display as black and white.
+     */
+    monochrome?: boolean;
     /**
      * The size of the loading indicator.
      */
@@ -52,9 +52,9 @@ export declare class LoadingIndicator {
     type?: IcLoadingTypes;
     /**
      * The label to be displayed beneath the loading indicator.
-     * Display a changing label by separating multiple messages with forward slashes.
+     * Display a changing label by supplying an array of messages.
      */
-    label?: string;
+    label?: string | string[];
     watchPropHandler(): void;
     /**
      * The current amount of progress made.
@@ -62,6 +62,10 @@ export declare class LoadingIndicator {
      */
     progress?: number;
     watchProgressHandler(): void;
+    /**
+     * Sets the theme color to the dark or light theme color. "inherit" will set the color based on the system settings or ic-theme component.
+     */
+    theme: IcThemeMode;
     disconnectedCallback(): void;
     componentWillLoad(): void;
     componentDidLoad(): void;

package/dist/types/components/ic-loading-indicator/ic-loading-indicator.types.d.ts

@@ -1,4 +1,4 @@
-export type IcLoadingSizes = "default" | "small" | "large" | "icon";
+export type IcLoadingSizes = "medium" | "small" | "large" | "icon";
 export type IcLoadingTypes = "circular" | "linear";
 export interface IcLoadingCircleXYR {
     x: number;

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

@@ -72,10 +72,6 @@ export declare class Menu {
      * The size of the menu component.
      */
     size?: IcSizes;
-    /**
-     * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
-     */
-    small?: boolean;
     /**
      * The possible menu selection options.
      */

package/dist/types/components/ic-page-header/ic-page-header.d.ts

@@ -35,10 +35,6 @@ export declare class PageHeader {
      * 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;
     /**
      * If `true`, the page header will be sticky at all breakpoints.
      */

package/dist/types/components/ic-pagination/ic-pagination.d.ts

@@ -11,8 +11,8 @@ export declare class Pagination {
     /**
      * The number of pages displayed adjacent to the current page when using 'complex' type pagination. Accepted values are 0, 1 & 2.
      */
-    adjacentCount: number;
-    watchAdjacentCountHandler(): void;
+    adjacentPageCount: number;
+    watchAdjacentPageCountHandler(): void;
     /**
      * The appearance of the pagination, e.g. dark, light or the default.
      */
@@ -20,8 +20,8 @@ export declare class Pagination {
     /**
      * The number of pages displayed as boundary items to the current page when using 'complex' type pagination. Accepted values are 0, 1 & 2.
      */
-    boundaryCount: number;
-    watchBoundaryCountHandler(): void;
+    boundaryPageCount: number;
+    watchBoundaryPageCountHandler(): void;
     /**
      * The default page to display.
      */

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

@@ -46,10 +46,6 @@ export declare class RadioGroup {
      * 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;
     /**
      * The validation status - e.g. 'error' | 'warning' | 'success'.
      */

package/dist/types/components/ic-radio-option/ic-radio-option.d.ts

@@ -25,26 +25,6 @@ export declare class RadioOption {
      * 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.
      */
@@ -71,10 +51,6 @@ export declare class RadioOption {
      * Emitted when the radio option is selected.
      */
     icCheck: EventEmitter<IcValueEventDetail>;
-    /**
-     * @deprecated This event should not be used anymore. Use icCheck instead.
-     */
-    radioOptionSelect: EventEmitter<IcValueEventDetail>;
     /**
      * Emitted when the radio option is selected or deselected.
      */

package/dist/types/components/ic-search-bar/ic-search-bar.d.ts

@@ -57,7 +57,7 @@ export declare class SearchBar {
      * Specify whether to disable the built in filtering. For example, if options will already be filtered from external source.
      * If `true`, all options provided will be displayed.
      */
-    disableFilter?: boolean;
+    disableAutoFiltering?: boolean;
     /**
      * The amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.
      */
@@ -86,7 +86,7 @@ export declare class SearchBar {
     /**
      * The hint text for the hidden assistive description element.
      */
-    hintText?: string;
+    assistiveHintText?: string;
     /**
      * The label for the search bar.
      */
@@ -131,10 +131,6 @@ export declare class SearchBar {
      * 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;
     /**
      * If `true`, the value of the search will have its spelling and grammar checked.
      */
@@ -174,15 +170,7 @@ export declare class SearchBar {
      */
     icInput: EventEmitter<IcValueEventDetail>;
     private onInput;
-    /**
-     * @deprecated This event should not be used anymore. Use icSearchBarBlur instead.
-     */
-    icInputBlur: EventEmitter<IcSearchBarBlurEventDetail>;
     private onInputBlur;
-    /**
-     * @deprecated This event should not be used anymore. Use icSearchBarFocus instead.
-     */
-    icInputFocus: EventEmitter<IcValueEventDetail>;
     private onInputFocus;
     /**
      * Emitted when option is highlighted within the menu
@@ -217,7 +205,7 @@ export declare class SearchBar {
     /**
      * Emitted when focus is invoked from ic-search-bar
      */
-    icSearchBarFocus: EventEmitter<void>;
+    icSearchBarFocus: EventEmitter<IcValueEventDetail>;
     disconnectedCallback(): void;
     componentWillLoad(): void;
     componentDidLoad(): void;

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

@@ -34,10 +34,6 @@ export declare class Select {
     open: boolean;
     pressedCharacters: string;
     searchableSelectInputValue: string;
-    /**
-     * @deprecated This prop should not be used anymore.
-     */
-    charactersUntilSuggestions?: number;
     /**
      * If `true`, the disabled state will be set.
      */
@@ -45,7 +41,7 @@ export declare class Select {
     /**
      * If `true`, the built in filtering will be disabled for a searchable variant. For example, if options will already be filtered from external source.
      */
-    disableFilter?: boolean;
+    disableAutoFiltering?: boolean;
     /**
      * The text displayed when there are no options in the option list.
      */
@@ -54,28 +50,6 @@ export declare class Select {
      * 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.
      */
@@ -144,10 +118,6 @@ export declare class Select {
      * The size of the select component.
      */
     size?: IcSizes;
-    /**
-     * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
-     */
-    small?: boolean;
     /**
      * If using external filtering, set a timeout for when loading takes too long.
      */

package/dist/types/components/ic-side-navigation/ic-side-navigation.d.ts

@@ -69,7 +69,7 @@ export declare class SideNavigation {
     /**
      * Emitted when the side navigation is collapsed and expanded.
      */
-    sideNavExpanded: EventEmitter<IcExpandedDetail>;
+    icSideNavExpanded: EventEmitter<IcExpandedDetail>;
     componentWillLoad(): void;
     componentDidLoad(): void;
     disconnectedCallback(): void;

package/dist/types/components/ic-skeleton/ic-skeleton.d.ts

@@ -1,14 +1,11 @@
 import { IcSkeletonVariants } from "./ic-skeleton.types";
+import { IcThemeMode } from "../../utils/types";
 export declare class Skeleton {
     el: HTMLIcSkeletonElement;
     /**
-     * The appearance of the skeleton.
+     * Sets the theme color to the dark or light theme color. "inherit" will set the color based on the system settings or ic-theme component.
      */
-    appearance?: "light" | "default";
-    /**
-     * @deprecated This prop should not be used anymore. Set prop `appearance` to "light" instead.
-     */
-    light?: boolean;
+    theme?: IcThemeMode;
     /**
      * The variant of the skeleton that will be displayed.
      */

package/dist/types/components/ic-status-tag/ic-status-tag.d.ts

@@ -1,4 +1,4 @@
-import { IcStatusTagStatuses, IcStatusTagAppearance } from "./ic-status-tag.types";
+import { IcStatusTagStatuses } from "./ic-status-tag.types";
 import { IcEmphasisType, IcSizes } from "../../utils/types";
 export declare class StatusTag {
     /**
@@ -6,10 +6,6 @@ export declare class StatusTag {
      * Screen readers will announce changes to the `label`, but not the initial value.
      */
     announced?: boolean;
-    /**
-     * @deprecated This prop should not be used anymore. Use variant prop instead.
-     */
-    appearance?: IcStatusTagAppearance;
     /**
      * The content rendered within the status tag.
      */
@@ -18,19 +14,18 @@ export declare class StatusTag {
      * The size of the status tag component.
      */
     size?: IcSizes;
-    /**
-     * @deprecated This prop should not be used anymore. Set prop `size` to "small" instead.
-     */
-    small?: boolean;
     /**
      * The colour of the status tag.
      */
     status?: IcStatusTagStatuses;
+    /**
+     * Sets the theme color to the dark or light theme color. "inherit" will set the color based on the system settings or ic-theme component.
+     */
+    theme?: "dark" | "light" | "inherit";
     /**
      * The emphasis of the status tag.
      */
     variant?: IcEmphasisType;
-    componentWillLoad(): void;
     componentDidLoad(): void;
     render(): any;
 }

package/dist/types/components/ic-status-tag/ic-status-tag.types.d.ts

@@ -1,2 +1 @@
 export type IcStatusTagStatuses = "neutral" | "success" | "warning" | "danger";
-export type IcStatusTagAppearance = "filled" | "outlined";

package/dist/types/components/ic-step/ic-step.d.ts

@@ -1,4 +1,5 @@
 import { IcStepVariants, IcStepStatuses, IcStepTypes } from "./ic-step.types";
+import { IcThemeMode } from "../../utils/types";
 export declare class Step {
     el: HTMLIcStepElement;
     /**
@@ -20,7 +21,7 @@ export declare class Step {
     /**
      * @internal The name of the next step. This is managed by ic-stepper.
      */
-    nextStepTitle?: string;
+    nextStepHeading?: string;
     /**
      * @internal The progress of the next step, calculated by dividing the current step number by the total number of steps. This is managed by ic-stepper.
      */
@@ -32,15 +33,19 @@ export declare class Step {
     /**
      * The status of the step. Use this prop to display a status message on the step if it is required or optional.
      */
-    stepStatus?: IcStepStatuses;
+    status?: IcStepStatuses;
     /**
      * Additional information about the step. Use this prop to override the default step status messaging displayed when selecting a step type or step status.
      */
-    stepSubtitle?: string;
+    subheading?: string;
     /**
      * The title of the step within the stepper.
      */
-    stepTitle?: string;
+    heading?: string;
+    /**
+     * @internal Sets the theme color to the dark or light theme color. "inherit" will set the color based on the system settings or ic-theme component.
+     */
+    theme?: IcThemeMode;
     /**
      * @internal The variant of the step. This is managed by ic-stepper.
      */
@@ -48,7 +53,7 @@ export declare class Step {
     /**
      * The state of the step within the stepper.
      */
-    stepType?: IcStepTypes;
-    stepTypeChangeHandler(): void;
+    type?: IcStepTypes;
+    typeChangeHandler(): void;
     render(): any;
 }

package/dist/types/components/ic-stepper/ic-stepper.d.ts

@@ -1,5 +1,6 @@
 import { IcStepperAlignment } from "./ic-stepper.types";
 import { IcStepTypes, IcStepVariants } from "../ic-step/ic-step.types";
+import { IcThemeMode } from "../../utils/types";
 export declare class Stepper {
     private resizeObserver;
     private steps;
@@ -17,10 +18,6 @@ export declare class Stepper {
      * The alignment of the default stepper within its container.
      */
     aligned?: IcStepperAlignment;
-    /**
-     * The appearance of the stepper.
-     */
-    appearance?: "light" | "default";
     /**
      * The length of the connector between each step in pixels. Minimum length is 100px.
      */
@@ -29,6 +26,11 @@ export declare class Stepper {
      * If `true`, the information about each step, i.e. step title, step subtitle and step status, will be hidden on all default steps. The information about each step will still be visible in the compact variant of the stepper.
      */
     hideStepInfo?: boolean;
+    /**
+     * Sets the theme color to the dark or light theme color. "inherit" will set the color based on the system settings or ic-theme component.
+     */
+    theme?: IcThemeMode;
+    handleThemeChange(): void;
     /**
      * The variant of the stepper.
      */

package/dist/types/components/ic-stepper/test/basic/ic-stepper-test-examples.d.ts

@@ -1,4 +1,4 @@
-export declare const defaultStepper = "\n    <ic-stepper>\n        <ic-step step-title=\"First\"></ic-step>\n        <ic-step\n        step-title=\"Second With a Very Long Title\"\n        step-subtitle=\"Optional Subtitle\"\n        step-type=\"current\"\n        ></ic-step>\n        <ic-step step-title=\"Third\" step-type=\"disabled\"></ic-step>\n        <ic-step\n        step-title=\"Fourth\"\n        step-subtitle=\"Optional Subtitle\"\n        step-type=\"completed\"\n        ></ic-step>\n    </ic-stepper>";
-export declare const customConnectorWidthStepper = "\n    <ic-stepper aligned=\"left\" connector-width=\"150\">\n        <ic-step step-title=\"First\"></ic-step>\n        <ic-step\n        step-title=\"Second With a Very Long Title\"\n        step-subtitle=\"Optional Subtitle\"\n        step-type=\"current\"\n        ></ic-step>\n        <ic-step step-title=\"Third\" step-type=\"disabled\"></ic-step>\n        <ic-step\n        step-title=\"Fourth\"\n        step-subtitle=\"Optional Subtitle\"\n        step-type=\"completed\"\n        ></ic-step>\n    </ic-stepper>";
-export declare const invalidConnectorWidthStepper = "\n    <ic-stepper aligned=\"left\" connector-width=\"96\">\n        <ic-step step-title=\"First\"></ic-step>\n        <ic-step\n        step-title=\"Second With a Very Long Title\"\n        step-subtitle=\"Optional Subtitle\"\n        step-type=\"current\"\n        ></ic-step>\n        <ic-step step-title=\"Third\" step-type=\"disabled\"></ic-step>\n        <ic-step\n        step-title=\"Fourth\"\n        step-subtitle=\"Optional Subtitle\"\n        step-type=\"completed\"\n        ></ic-step>\n    </ic-stepper>";
-export declare const compactStepper = "\n    <ic-stepper variant=\"compact\" id=\"custom-compact-stepper\">\n        <ic-step \n        step-title=\"First\"\n        ></ic-step>\n        <ic-step\n          step-title=\"Second With a Very Long Title\"\n          step-subtitle=\"Optional subtitle that is long and should wrap\"\n          current\n          step-type=\"current\"\n        ></ic-step>\n        <ic-step\n          step-title=\"Third\"\n          step-type=\"disabled\"\n        ></ic-step>\n        <ic-step\n          step-title=\"Fourth title that is long and should wrap\"\n          step-subtitle=\"Optional Subtitle\"\n          step-type=\"completed\"\n        ></ic-step>\n        <ic-step\n          step-title=\"Fifth and final step\"\n          step-subtitle=\"Optional Subtitle\"\n          icon\n          step-status=\"optional\"\n          step-type=\"completed\"\n        ></ic-step>\n      </ic-stepper>";
+export declare const defaultStepper = "\n    <ic-stepper>\n        <ic-step heading=\"First\"></ic-step>\n        <ic-step\n        heading=\"Second With a Very Long Title\"\n        subheading=\"Optional Subtitle\"\n        type=\"current\"\n        ></ic-step>\n        <ic-step heading=\"Third\" type=\"disabled\"></ic-step>\n        <ic-step\n        heading=\"Fourth\"\n        subheading=\"Optional Subtitle\"\n        type=\"completed\"\n        ></ic-step>\n    </ic-stepper>";
+export declare const customConnectorWidthStepper = "\n    <ic-stepper aligned=\"left\" connector-width=\"150\">\n        <ic-step heading=\"First\"></ic-step>\n        <ic-step\n        heading=\"Second With a Very Long Title\"\n        subheading=\"Optional Subtitle\"\n        type=\"current\"\n        ></ic-step>\n        <ic-step heading=\"Third\" type=\"disabled\"></ic-step>\n        <ic-step\n        heading=\"Fourth\"\n        subheading=\"Optional Subtitle\"\n        type=\"completed\"\n        ></ic-step>\n    </ic-stepper>";
+export declare const invalidConnectorWidthStepper = "\n    <ic-stepper aligned=\"left\" connector-width=\"96\">\n        <ic-step heading=\"First\"></ic-step>\n        <ic-step\n        heading=\"Second With a Very Long Title\"\n        subheading=\"Optional Subtitle\"\n        type=\"current\"\n        ></ic-step>\n        <ic-step heading=\"Third\" type=\"disabled\"></ic-step>\n        <ic-step\n        heading=\"Fourth\"\n        subheading=\"Optional Subtitle\"\n        type=\"completed\"\n        ></ic-step>\n    </ic-stepper>";
+export declare const compactStepper = "\n    <ic-stepper variant=\"compact\" id=\"custom-compact-stepper\">\n        <ic-step \n        heading=\"First\"\n        ></ic-step>\n        <ic-step\n          heading=\"Second With a Very Long Title\"\n          subheading=\"Optional subtitle that is long and should wrap\"\n          current\n          type=\"current\"\n        ></ic-step>\n        <ic-step\n          heading=\"Third\"\n          type=\"disabled\"\n        ></ic-step>\n        <ic-step\n          heading=\"Fourth title that is long and should wrap\"\n          subheading=\"Optional Subtitle\"\n          type=\"completed\"\n        ></ic-step>\n        <ic-step\n          heading=\"Fifth and final step\"\n          subheading=\"Optional Subtitle\"\n          icon\n          status=\"optional\"\n          type=\"completed\"\n        ></ic-step>\n      </ic-stepper>";

package/dist/types/components/ic-switch/ic-switch.d.ts

@@ -42,10 +42,6 @@ export declare class 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;
     /**
      * The value of the toggle does not mean if it's checked or not, use the `checked`
      * property for that.

package/dist/types/components/ic-tab/ic-tab.d.ts

@@ -1,6 +1,6 @@
 import { EventEmitter } from "../../stencil-public-runtime";
 import { IcTabClickEventDetail } from "./ic-tab.types";
-import { IcThemeForegroundNoDefault } from "../../utils/types";
+import { IcThemeMode } from "../../utils/types";
 /**
  * @slot icon - Content will be rendered next to the tab label.
  * @slot badge - Badge component displayed inline with the tab.
@@ -10,20 +10,22 @@ export declare class Tab {
     private focusTabId;
     private isInitialRender;
     el: HTMLIcTabElement;
-    /** @internal Determines whether the light or dark variant of the tabs should be displayed. */
-    appearance?: IcThemeForegroundNoDefault;
     /** @internal The unique context needed if using multiple tabs inside one another i.e. rendering another tabs inside a tab panel. */
     contextId?: string;
     /**
      * If `true`, the disabled state will be set.
      */
     disabled?: boolean;
+    /** @internal Determines whether black variant of the tabs should be displayed. */
+    monochrome?: boolean;
     /** @internal If `true`, the tab will display with a selected indicator and tabIndex will be set. */
     selected?: boolean;
     /** @internal The shared ID between panel and tab. */
     tabId?: string;
     /** @internal The position of the tab inside the tabs array in context. */
     tabPosition?: number;
+    /** @internal Determines whether the light or dark variant of the tabs should be displayed. */
+    theme?: IcThemeMode;
     disabledWatchHandler(): void;
     /**
      * @internal Emitted when a tab is selected.