@ukic/canary-web-components 3.0.0-canary.2 → 3.0.0-canary.4

package/dist/types/components.d.ts

@@ -6,21 +6,21 @@
  */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
 import { IcCardSizes } from "./components/ic-card-horizontal/ic-card-horizontal.types";
+import { IcDateFormat, IcInformationStatusOrEmpty, IcPaginationBarOptions, IcSizes, IcThemeMode, IcWeekDays } from "./utils/types";
 import { IcDataTableColumnObject, IcDataTableDataType, IcDataTableDensityOptions, IcDataTableRowHeights, IcDataTableSortOrderOptions, IcDataTableTruncationTypes, IcDensityUpdateEventDetail, IcSortEventDetail } from "./components/ic-data-table/ic-data-table.types";
-import { IcActivationTypes, IcMenuOption, IcThemeForegroundNoDefault } from "@ukic/web-components/dist/types/utils/types";
-import { IcDateFormat, IcInformationStatusOrEmpty, IcPaginationBarOptions, IcSearchMatchPositions, IcSizes, IcThemeForegroundNoDefault as IcThemeForegroundNoDefault1, IcValueEventDetail, IcWeekDays } from "./utils/types";
-import { IcMenuChangeEventDetail, IcMenuOptionIdEventDetail, IcOptionSelectEventDetail, IcSearchBarSearchModes } from "@ukic/web-components/dist/types/components";
+import { IcThemeForegroundNoDefault } from "@ukic/web-components/dist/types/utils/types";
 import { IcPaginationAlignmentOptions, IcPaginationLabelTypes, IcPaginationTypes } from "@ukic/web-components/dist/types/components/ic-pagination/ic-pagination.types";
-import { IcThemeForeground } from "@ukic/web-components/dist/types/interface";
+import { IcThemeMode as IcThemeMode1 } from "@ukic/web-components/dist/types/interface";
 import { IcPageChangeEventDetail } from "./components/ic-pagination-bar/ic-pagination-bar.types";
+import { IcThemeMode as IcThemeMode2 } from "@ukic/web-components";
 export { IcCardSizes } from "./components/ic-card-horizontal/ic-card-horizontal.types";
+export { IcDateFormat, IcInformationStatusOrEmpty, IcPaginationBarOptions, IcSizes, IcThemeMode, IcWeekDays } from "./utils/types";
 export { IcDataTableColumnObject, IcDataTableDataType, IcDataTableDensityOptions, IcDataTableRowHeights, IcDataTableSortOrderOptions, IcDataTableTruncationTypes, IcDensityUpdateEventDetail, IcSortEventDetail } from "./components/ic-data-table/ic-data-table.types";
-export { IcActivationTypes, IcMenuOption, IcThemeForegroundNoDefault } from "@ukic/web-components/dist/types/utils/types";
-export { IcDateFormat, IcInformationStatusOrEmpty, IcPaginationBarOptions, IcSearchMatchPositions, IcSizes, IcThemeForegroundNoDefault as IcThemeForegroundNoDefault1, IcValueEventDetail, IcWeekDays } from "./utils/types";
-export { IcMenuChangeEventDetail, IcMenuOptionIdEventDetail, IcOptionSelectEventDetail, IcSearchBarSearchModes } from "@ukic/web-components/dist/types/components";
+export { IcThemeForegroundNoDefault } from "@ukic/web-components/dist/types/utils/types";
 export { IcPaginationAlignmentOptions, IcPaginationLabelTypes, IcPaginationTypes } from "@ukic/web-components/dist/types/components/ic-pagination/ic-pagination.types";
-export { IcThemeForeground } from "@ukic/web-components/dist/types/interface";
+export { IcThemeMode as IcThemeMode1 } from "@ukic/web-components/dist/types/interface";
 export { IcPageChangeEventDetail } from "./components/ic-pagination-bar/ic-pagination-bar.types";
+export { IcThemeMode as IcThemeMode2 } from "@ukic/web-components";
 export namespace Components {
     interface IcCardHorizontal {
         /**
@@ -67,12 +67,20 @@ export namespace Components {
           * 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;
     }
     interface IcDataTable {
         /**
           * The title for the table only visible to screen readers.
          */
         "caption": string;
+        /**
+          * Determines whether the column header should be truncated and display a tooltip. Default is `false`.
+         */
+        "columnHeaderTruncation": boolean;
         /**
           * The column headers for the table.
          */
@@ -261,6 +269,10 @@ export namespace Components {
           * If `true`, the helper text will be visually hidden, but still read out by screenreaders.
          */
         "hideHelperText": boolean;
+        /**
+          * If `true`, the label will be visually hidden, but will still be read out by screen readers.
+         */
+        "hideLabel"?: boolean;
         /**
           * The ID for the input.
          */
@@ -355,6 +367,10 @@ export namespace Components {
           * If `true`, the helper text will be visually hidden, but still read out by screenreaders.
          */
         "hideHelperText": boolean;
+        /**
+          * If `true`, the label will be visually hidden, but the required label will still be read out by screen readers.
+         */
+        "hideLabel"?: boolean;
         /**
           * The ID for the input field. The default will be an automatically generated value.
          */
@@ -420,88 +436,19 @@ export namespace Components {
          */
         "value"?: string | Date | null | undefined;
     }
-    interface IcMenuWithMulti {
-        /**
-          * Determines whether options manually set as values (by pressing 'Enter') when they receive focus using keyboard navigation.
-         */
-        "activationType"?: IcActivationTypes;
-        /**
-          * The reference to an anchor element the menu will position itself from when rendered.
-         */
-        "anchorEl": HTMLElement;
-        "autoFocusOnSelected": boolean;
-        /**
-          * If `true`, the menu will close when an option is selected.
-         */
-        "closeOnSelect": boolean;
-        /**
-          * If `true`, the menu will fill the width of the container.
-         */
-        "fullWidth": boolean;
-        "handleClickOpen": () => Promise<void>;
-        /**
-          * Used alongside activationType If menu is opened via keyboard navigation (i.e. Enter, ArrowUp or ArrowDown), emit optionSelect custom event.
-          * @param event - keyboard event
-         */
-        "handleKeyboardOpen": (event: KeyboardEvent) => Promise<void>;
-        "handleSetFirstOption": () => Promise<void>;
-        "initPopperJs": (anchor: HTMLElement) => Promise<void>;
-        /**
-          * The reference to the input element.
-         */
-        "inputEl": HTMLElement;
-        /**
-          * The label for the input element.
-         */
-        "inputLabel": string;
-        /**
-          * The custom name for the label field for IcMenuOption.
-         */
-        "labelField": string;
-        /**
-          * The ID of the menu.
-         */
-        "menuId": string;
-        /**
-          * If `true`, the menu will be displayed open.
-         */
-        "open": boolean;
-        /**
-          * The possible menu selection options.
-         */
-        "options": IcMenuOption[];
-        "parentEl"?: HTMLElement;
-        /**
-          * Specify the mode search bar uses to search. `navigation` allows for quick lookups of a set of values, `query` allows for more general searches.
-         */
-        "searchMode"?: IcSearchBarSearchModes;
-        "selectOnEnter"?: boolean;
-        /**
-          * The size of the menu.
-         */
-        "size"?: IcSizes;
-        /**
-          * The value of the currently selected option - or array of values (if multiple options allowed).
-         */
-        "value": string | string[];
-        /**
-          * The custom name for the value field for IcMenuOption.
-         */
-        "valueField": string;
-    }
     interface IcPaginationBar {
         /**
           * Sets the alignment of the items in the pagination bar.
          */
         "alignment"?: IcPaginationAlignmentOptions;
-        /**
-          * Sets the styling for the items in the pagination bar.
-         */
-        "appearance"?: IcThemeForeground;
         /**
           * The current page number to be displayed on the pagination bar.
          */
         "currentPage"?: number;
+        /**
+          * If `true`, the 'All' option will be hidden from the 'items per page' select input.
+         */
+        "hideAllFromItemsPerPage"?: boolean;
         /**
           * If `true`, the number of total items and current item range or number of total pages and current page will be hidden.
          */
@@ -511,12 +458,16 @@ export namespace Components {
          */
         "itemLabel"?: string;
         /**
-          * The options which will be displayed for 'items per page' select input. Set a maximum of 4 options including a required 'All' option with value equal to total number of items.
+          * The options which will be displayed for 'items per page' select input.
          */
         "itemsPerPageOptions"?: {
     label: string;
     value: string;
   }[];
+        /**
+          * If `true`, the pagination bar will display as black in the light theme, and white in dark theme.
+         */
+        "monochrome"?: boolean;
         /**
           * The text which will be used in place of 'Page' on the pagination bar.
          */
@@ -533,6 +484,10 @@ export namespace Components {
           * If `true`, the select input to control 'items per page' should be displayed.
          */
         "showItemsPerPageControl"?: 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"?: IcThemeMode1;
         /**
           * Total number of items to be displayed across all pages.
          */
@@ -542,135 +497,16 @@ export namespace Components {
          */
         "type"?: IcPaginationTypes;
     }
-    interface IcSelectWithMulti {
-        /**
-          * The amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.
-         */
-        "debounce"?: number;
-        /**
-          * If `true`, the built in filtering will be disabled for a searchable variant. For example, if options will already be filtered from external source.
-         */
-        "disableAutoFiltering"?: boolean;
-        /**
-          * If `true`, the disabled state will be set.
-         */
-        "disabled"?: boolean;
-        /**
-          * The text displayed when there are no options in the option list.
-         */
-        "emptyOptionListText": string;
-        /**
-          * The <form> element to associate the select with.
-         */
-        "form"?: 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;
-        /**
-          * The helper text that will be displayed for additional field guidance.
-         */
-        "helperText"?: string;
-        /**
-          * If `true`, the label will be hidden and the required label value will be applied as an aria-label.
-         */
-        "hideLabel"?: boolean;
-        /**
-          * If `true`, descriptions of options will be included when filtering options in a searchable select. Only applies to built in filtering.
-         */
-        "includeDescriptionsInSearch"?: boolean;
-        /**
-          * If `true`, group titles of grouped options will be included when filtering options in a searchable select. Only applies to built in filtering.
-         */
-        "includeGroupTitlesInSearch"?: boolean;
-        /**
-          * The label for the select.
-         */
-        "label": string;
-        /**
-          * If `true`, the loading state will be triggered when fetching options asynchronously.
-         */
-        "loading"?: boolean;
-        /**
-          * The message displayed when external loading times out.
-         */
-        "loadingErrorLabel"?: string;
-        /**
-          * The message displayed whilst the options are being loaded externally.
-         */
-        "loadingLabel"?: string;
-        /**
-          * If `true`, multiple options can be selected.
-         */
-        "multiple"?: boolean;
-        /**
-          * The name of the control, which is submitted with the form data.
-         */
-        "name"?: string;
-        /**
-          * The possible selection options.
-         */
-        "options"?: IcMenuOption[];
-        /**
-          * The placeholder value to be displayed.
-         */
-        "placeholder"?: string;
-        /**
-          * If `true`, the readonly state will be set.
-         */
-        "readonly"?: boolean;
-        /**
-          * If `true`, the select will require a value.
-         */
-        "required"?: boolean;
-        /**
-          * Whether the search string of the searchable select should match the start of or anywhere in the options. Only applies to built in filtering.
-         */
-        "searchMatchPosition"?: IcSearchMatchPositions;
-        /**
-          * If `true`, a searchable variant of the select will be displayed which can be typed in to filter options.
-         */
-        "searchable"?: boolean;
-        /**
-          * If `true`, the icOptionSelect event will be fired on enter instead of ArrowUp and ArrowDown.
-         */
-        "selectOnEnter"?: boolean;
-        /**
-          * Sets focus on the input box.
-         */
-        "setFocus": () => Promise<void>;
-        /**
-          * If `true`, a button which clears the select input when clicked will be displayed. The button will always appear on the searchable select.
-         */
-        "showClearButton"?: boolean;
-        /**
-          * The size of the select.
-         */
-        "size"?: IcSizes;
-        /**
-          * If using external filtering, set a timeout for when loading takes too long.
-         */
-        "timeout"?: number;
-        /**
-          * The validation status - e.g. 'error' | 'warning' | 'success'.
-         */
-        "validationStatus"?: IcInformationStatusOrEmpty;
-        /**
-          * The text to display as the validation message.
-         */
-        "validationText"?: string;
-        /**
-          * The value of the select, reflected by the value of the currently selected option. For the searchable variant, the value is also reflected by the user input. For the multi-select variant, the value must be an array of option values.
-         */
-        "value"?: string | string[];
-    }
     interface IcTreeItem {
-        "appearance"?: IcThemeForegroundNoDefault1;
         /**
           * If `true`, the tree item appears in the disabled state.
          */
         "disabled"?: boolean;
+        /**
+          * If `true`, the tree item appears in the expanded state.
+         */
         "expanded": boolean;
+        "focusInset"?: boolean;
         "hasParentExpanded": boolean;
         /**
           * The URL that the tree item link points to. If set, the tree item will render as an "a" tag, otherwise it will render as a div.
@@ -706,13 +542,17 @@ export namespace Components {
           * 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"?: IcThemeMode2;
         "updateAriaLabel": () => Promise<void>;
     }
     interface IcTreeView {
         /**
-          * The appearance of the tree view, e.g. dark, or light.
+          * If `true`, tree items will have inset focus.
          */
-        "appearance"?: IcThemeForegroundNoDefault1;
+        "focusInset"?: boolean;
         /**
           * The heading of the tree view.
          */
@@ -721,6 +561,10 @@ export namespace Components {
           * The size of the tree view.
          */
         "size"?: IcSizes;
+        /**
+          * 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"?: IcThemeMode2;
     }
 }
 export interface IcDataTableCustomEvent<T> extends CustomEvent<T> {
@@ -739,18 +583,10 @@ export interface IcDatePickerCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIcDatePickerElement;
 }
-export interface IcMenuWithMultiCustomEvent<T> extends CustomEvent<T> {
-    detail: T;
-    target: HTMLIcMenuWithMultiElement;
-}
 export interface IcPaginationBarCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIcPaginationBarElement;
 }
-export interface IcSelectWithMultiCustomEvent<T> extends CustomEvent<T> {
-    detail: T;
-    target: HTMLIcSelectWithMultiElement;
-}
 export interface IcTreeItemCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLIcTreeItemElement;
@@ -834,30 +670,6 @@ declare global {
         prototype: HTMLIcDatePickerElement;
         new (): HTMLIcDatePickerElement;
     };
-    interface HTMLIcMenuWithMultiElementEventMap {
-        "menuKeyPress": { isNavKey: boolean; key: string };
-        "menuOptionId": IcMenuOptionIdEventDetail;
-        "menuOptionSelect": IcOptionSelectEventDetail;
-        "menuOptionSelectAll": { select: boolean };
-        "menuStateChange": IcMenuChangeEventDetail;
-        "retryButtonClicked": IcValueEventDetail;
-        "timeoutBlur": { ev: FocusEvent };
-        "ungroupedOptionsSet": { options: IcMenuOption[] };
-    }
-    interface HTMLIcMenuWithMultiElement extends Components.IcMenuWithMulti, HTMLStencilElement {
-        addEventListener<K extends keyof HTMLIcMenuWithMultiElementEventMap>(type: K, listener: (this: HTMLIcMenuWithMultiElement, ev: IcMenuWithMultiCustomEvent<HTMLIcMenuWithMultiElementEventMap[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 HTMLIcMenuWithMultiElementEventMap>(type: K, listener: (this: HTMLIcMenuWithMultiElement, ev: IcMenuWithMultiCustomEvent<HTMLIcMenuWithMultiElementEventMap[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 HTMLIcMenuWithMultiElement: {
-        prototype: HTMLIcMenuWithMultiElement;
-        new (): HTMLIcMenuWithMultiElement;
-    };
     interface HTMLIcPaginationBarElementEventMap {
         "icPageChange": IcPageChangeEventDetail;
         "icItemsPerPageChange": { value: number };
@@ -876,30 +688,6 @@ declare global {
         prototype: HTMLIcPaginationBarElement;
         new (): HTMLIcPaginationBarElement;
     };
-    interface HTMLIcSelectWithMultiElementEventMap {
-        "icBlur": void;
-        "icChange": IcValueEventDetail;
-        "icClear": void;
-        "icFocus": void;
-        "icInput": IcValueEventDetail;
-        "icOptionSelect": IcOptionSelectEventDetail;
-        "icOptionDeselect": IcOptionSelectEventDetail;
-        "icRetryLoad": IcValueEventDetail;
-    }
-    interface HTMLIcSelectWithMultiElement extends Components.IcSelectWithMulti, HTMLStencilElement {
-        addEventListener<K extends keyof HTMLIcSelectWithMultiElementEventMap>(type: K, listener: (this: HTMLIcSelectWithMultiElement, ev: IcSelectWithMultiCustomEvent<HTMLIcSelectWithMultiElementEventMap[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 HTMLIcSelectWithMultiElementEventMap>(type: K, listener: (this: HTMLIcSelectWithMultiElement, ev: IcSelectWithMultiCustomEvent<HTMLIcSelectWithMultiElementEventMap[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 HTMLIcSelectWithMultiElement: {
-        prototype: HTMLIcSelectWithMultiElement;
-        new (): HTMLIcSelectWithMultiElement;
-    };
     interface HTMLIcTreeItemElementEventMap {
         "icTreeItemSelected": { id: string };
     }
@@ -929,9 +717,7 @@ declare global {
         "ic-data-table-title-bar": HTMLIcDataTableTitleBarElement;
         "ic-date-input": HTMLIcDateInputElement;
         "ic-date-picker": HTMLIcDatePickerElement;
-        "ic-menu-with-multi": HTMLIcMenuWithMultiElement;
         "ic-pagination-bar": HTMLIcPaginationBarElement;
-        "ic-select-with-multi": HTMLIcSelectWithMultiElement;
         "ic-tree-item": HTMLIcTreeItemElement;
         "ic-tree-view": HTMLIcTreeViewElement;
     }
@@ -978,12 +764,20 @@ declare namespace LocalJSX {
           * 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;
     }
     interface IcDataTable {
         /**
           * The title for the table only visible to screen readers.
          */
         "caption": string;
+        /**
+          * Determines whether the column header should be truncated and display a tooltip. Default is `false`.
+         */
+        "columnHeaderTruncation"?: boolean;
         /**
           * The column headers for the table.
          */
@@ -1175,6 +969,10 @@ declare namespace LocalJSX {
           * If `true`, the helper text will be visually hidden, but still read out by screenreaders.
          */
         "hideHelperText"?: boolean;
+        /**
+          * If `true`, the label will be visually hidden, but will still be read out by screen readers.
+         */
+        "hideLabel"?: boolean;
         /**
           * The ID for the input.
          */
@@ -1277,6 +1075,10 @@ declare namespace LocalJSX {
           * If `true`, the helper text will be visually hidden, but still read out by screenreaders.
          */
         "hideHelperText"?: boolean;
+        /**
+          * If `true`, the label will be visually hidden, but the required label will still be read out by screen readers.
+         */
+        "hideLabel"?: boolean;
         /**
           * The ID for the input field. The default will be an automatically generated value.
          */
@@ -1346,77 +1148,19 @@ declare namespace LocalJSX {
          */
         "value"?: string | Date | null | undefined;
     }
-    interface IcMenuWithMulti {
-        /**
-          * Determines whether options manually set as values (by pressing 'Enter') when they receive focus using keyboard navigation.
-         */
-        "activationType"?: IcActivationTypes;
-        /**
-          * The reference to an anchor element the menu will position itself from when rendered.
-         */
-        "anchorEl": HTMLElement;
-        /**
-          * If `true`, the menu will close when an option is selected.
-         */
-        "closeOnSelect"?: boolean;
-        /**
-          * If `true`, the menu will fill the width of the container.
-         */
-        "fullWidth"?: boolean;
-        /**
-          * The reference to the input element.
-         */
-        "inputEl": HTMLElement;
-        /**
-          * The label for the input element.
-         */
-        "inputLabel": string;
-        /**
-          * The custom name for the label field for IcMenuOption.
-         */
-        "labelField"?: string;
-        /**
-          * The ID of the menu.
-         */
-        "menuId": string;
-        /**
-          * If `true`, the menu will be displayed open.
-         */
-        "open": boolean;
-        /**
-          * The possible menu selection options.
-         */
-        "options": IcMenuOption[];
-        /**
-          * Specify the mode search bar uses to search. `navigation` allows for quick lookups of a set of values, `query` allows for more general searches.
-         */
-        "searchMode"?: IcSearchBarSearchModes;
-        /**
-          * The size of the menu.
-         */
-        "size"?: IcSizes;
-        /**
-          * The value of the currently selected option - or array of values (if multiple options allowed).
-         */
-        "value": string | string[];
-        /**
-          * The custom name for the value field for IcMenuOption.
-         */
-        "valueField"?: string;
-    }
     interface IcPaginationBar {
         /**
           * Sets the alignment of the items in the pagination bar.
          */
         "alignment"?: IcPaginationAlignmentOptions;
-        /**
-          * Sets the styling for the items in the pagination bar.
-         */
-        "appearance"?: IcThemeForeground;
         /**
           * The current page number to be displayed on the pagination bar.
          */
         "currentPage"?: number;
+        /**
+          * If `true`, the 'All' option will be hidden from the 'items per page' select input.
+         */
+        "hideAllFromItemsPerPage"?: boolean;
         /**
           * If `true`, the number of total items and current item range or number of total pages and current page will be hidden.
          */
@@ -1426,12 +1170,16 @@ declare namespace LocalJSX {
          */
         "itemLabel"?: string;
         /**
-          * The options which will be displayed for 'items per page' select input. Set a maximum of 4 options including a required 'All' option with value equal to total number of items.
+          * The options which will be displayed for 'items per page' select input.
          */
         "itemsPerPageOptions"?: {
     label: string;
     value: string;
   }[];
+        /**
+          * If `true`, the pagination bar will display as black in the light theme, and white in dark theme.
+         */
+        "monochrome"?: boolean;
         /**
           * Emitted when the items per page option is changed.
          */
@@ -1456,6 +1204,10 @@ declare namespace LocalJSX {
           * If `true`, the select input to control 'items per page' should be displayed.
          */
         "showItemsPerPageControl"?: 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"?: IcThemeMode1;
         /**
           * Total number of items to be displayed across all pages.
          */
@@ -1465,161 +1217,15 @@ declare namespace LocalJSX {
          */
         "type"?: IcPaginationTypes;
     }
-    interface IcSelectWithMulti {
-        /**
-          * The amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.
-         */
-        "debounce"?: number;
-        /**
-          * If `true`, the built in filtering will be disabled for a searchable variant. For example, if options will already be filtered from external source.
-         */
-        "disableAutoFiltering"?: boolean;
-        /**
-          * If `true`, the disabled state will be set.
-         */
-        "disabled"?: boolean;
-        /**
-          * The text displayed when there are no options in the option list.
-         */
-        "emptyOptionListText"?: string;
-        /**
-          * The <form> element to associate the select with.
-         */
-        "form"?: 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;
-        /**
-          * The helper text that will be displayed for additional field guidance.
-         */
-        "helperText"?: string;
-        /**
-          * If `true`, the label will be hidden and the required label value will be applied as an aria-label.
-         */
-        "hideLabel"?: boolean;
-        /**
-          * If `true`, descriptions of options will be included when filtering options in a searchable select. Only applies to built in filtering.
-         */
-        "includeDescriptionsInSearch"?: boolean;
-        /**
-          * If `true`, group titles of grouped options will be included when filtering options in a searchable select. Only applies to built in filtering.
-         */
-        "includeGroupTitlesInSearch"?: boolean;
-        /**
-          * The label for the select.
-         */
-        "label": string;
-        /**
-          * If `true`, the loading state will be triggered when fetching options asynchronously.
-         */
-        "loading"?: boolean;
-        /**
-          * The message displayed when external loading times out.
-         */
-        "loadingErrorLabel"?: string;
-        /**
-          * The message displayed whilst the options are being loaded externally.
-         */
-        "loadingLabel"?: string;
-        /**
-          * If `true`, multiple options can be selected.
-         */
-        "multiple"?: boolean;
-        /**
-          * The name of the control, which is submitted with the form data.
-         */
-        "name"?: string;
-        /**
-          * Emitted when the select loses focus.
-         */
-        "onIcBlur"?: (event: IcSelectWithMultiCustomEvent<void>) => void;
-        /**
-          * Emitted when the value changes.
-         */
-        "onIcChange"?: (event: IcSelectWithMultiCustomEvent<IcValueEventDetail>) => void;
-        /**
-          * Emitted when the clear button is clicked.
-         */
-        "onIcClear"?: (event: IcSelectWithMultiCustomEvent<void>) => void;
-        /**
-          * Emitted when the select gains focus.
-         */
-        "onIcFocus"?: (event: IcSelectWithMultiCustomEvent<void>) => void;
-        /**
-          * Emitted when a keyboard input occurred.
-         */
-        "onIcInput"?: (event: IcSelectWithMultiCustomEvent<IcValueEventDetail>) => void;
-        /**
-          * Emitted when `multiple` is `true` and an option is deselected.
-         */
-        "onIcOptionDeselect"?: (event: IcSelectWithMultiCustomEvent<IcOptionSelectEventDetail>) => void;
-        /**
-          * Emitted when an option is selected. Selecting an option will also trigger an `icChange/onIcChange` due to the value being updated.
-         */
-        "onIcOptionSelect"?: (event: IcSelectWithMultiCustomEvent<IcOptionSelectEventDetail>) => void;
-        /**
-          * Emitted when the 'retry loading' button is clicked for a searchable variant.
-         */
-        "onIcRetryLoad"?: (event: IcSelectWithMultiCustomEvent<IcValueEventDetail>) => void;
-        /**
-          * The possible selection options.
-         */
-        "options"?: IcMenuOption[];
-        /**
-          * The placeholder value to be displayed.
-         */
-        "placeholder"?: string;
-        /**
-          * If `true`, the readonly state will be set.
-         */
-        "readonly"?: boolean;
-        /**
-          * If `true`, the select will require a value.
-         */
-        "required"?: boolean;
-        /**
-          * Whether the search string of the searchable select should match the start of or anywhere in the options. Only applies to built in filtering.
-         */
-        "searchMatchPosition"?: IcSearchMatchPositions;
-        /**
-          * If `true`, a searchable variant of the select will be displayed which can be typed in to filter options.
-         */
-        "searchable"?: boolean;
-        /**
-          * If `true`, the icOptionSelect event will be fired on enter instead of ArrowUp and ArrowDown.
-         */
-        "selectOnEnter"?: boolean;
-        /**
-          * If `true`, a button which clears the select input when clicked will be displayed. The button will always appear on the searchable select.
-         */
-        "showClearButton"?: boolean;
-        /**
-          * The size of the select.
-         */
-        "size"?: IcSizes;
-        /**
-          * If using external filtering, set a timeout for when loading takes too long.
-         */
-        "timeout"?: number;
-        /**
-          * The validation status - e.g. 'error' | 'warning' | 'success'.
-         */
-        "validationStatus"?: IcInformationStatusOrEmpty;
-        /**
-          * The text to display as the validation message.
-         */
-        "validationText"?: string;
-        /**
-          * The value of the select, reflected by the value of the currently selected option. For the searchable variant, the value is also reflected by the user input. For the multi-select variant, the value must be an array of option values.
-         */
-        "value"?: string | string[];
-    }
     interface IcTreeItem {
         /**
           * If `true`, the tree item appears in the disabled state.
          */
         "disabled"?: boolean;
+        /**
+          * If `true`, the tree item appears in the expanded state.
+         */
+        "expanded"?: boolean;
         /**
           * The URL that the tree item link points to. If set, the tree item will render as an "a" tag, otherwise it will render as a div.
          */
@@ -1652,12 +1258,16 @@ declare namespace LocalJSX {
           * 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"?: IcThemeMode2;
     }
     interface IcTreeView {
         /**
-          * The appearance of the tree view, e.g. dark, or light.
+          * If `true`, tree items will have inset focus.
          */
-        "appearance"?: IcThemeForegroundNoDefault1;
+        "focusInset"?: boolean;
         /**
           * The heading of the tree view.
          */
@@ -1666,6 +1276,10 @@ declare namespace LocalJSX {
           * The size of the tree view.
          */
         "size"?: IcSizes;
+        /**
+          * 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"?: IcThemeMode2;
     }
     interface IntrinsicElements {
         "ic-card-horizontal": IcCardHorizontal;
@@ -1673,9 +1287,7 @@ declare namespace LocalJSX {
         "ic-data-table-title-bar": IcDataTableTitleBar;
         "ic-date-input": IcDateInput;
         "ic-date-picker": IcDatePicker;
-        "ic-menu-with-multi": IcMenuWithMulti;
         "ic-pagination-bar": IcPaginationBar;
-        "ic-select-with-multi": IcSelectWithMulti;
         "ic-tree-item": IcTreeItem;
         "ic-tree-view": IcTreeView;
     }
@@ -1689,9 +1301,7 @@ declare module "@stencil/core" {
             "ic-data-table-title-bar": LocalJSX.IcDataTableTitleBar & JSXBase.HTMLAttributes<HTMLIcDataTableTitleBarElement>;
             "ic-date-input": LocalJSX.IcDateInput & JSXBase.HTMLAttributes<HTMLIcDateInputElement>;
             "ic-date-picker": LocalJSX.IcDatePicker & JSXBase.HTMLAttributes<HTMLIcDatePickerElement>;
-            "ic-menu-with-multi": LocalJSX.IcMenuWithMulti & JSXBase.HTMLAttributes<HTMLIcMenuWithMultiElement>;
             "ic-pagination-bar": LocalJSX.IcPaginationBar & JSXBase.HTMLAttributes<HTMLIcPaginationBarElement>;
-            "ic-select-with-multi": LocalJSX.IcSelectWithMulti & JSXBase.HTMLAttributes<HTMLIcSelectWithMultiElement>;
             "ic-tree-item": LocalJSX.IcTreeItem & JSXBase.HTMLAttributes<HTMLIcTreeItemElement>;
             "ic-tree-view": LocalJSX.IcTreeView & JSXBase.HTMLAttributes<HTMLIcTreeViewElement>;
         }