@ukic/web-components 3.0.0-alpha.5 → 3.0.0-alpha.7

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

@@ -53,6 +53,7 @@ export declare class SearchBar {
      * If `true`, the disabled state will be set.
      */
     disabled?: boolean;
+    watchDisabledHandler(): void;
     /**
      * 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.
@@ -62,6 +63,7 @@ export declare class SearchBar {
      * The amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.
      */
     debounce?: number;
+    private debounceChanged;
     /**
      * The text displayed when there are no options in the option list.
      */
@@ -210,11 +212,18 @@ export declare class SearchBar {
      * Emitted when focus is invoked from ic-search-bar
      */
     icSearchBarFocus: EventEmitter<IcValueEventDetail>;
+    /**
+     * Emitted when a keydown event occurred.
+     */
+    icKeydown: EventEmitter<{
+        event: KeyboardEvent;
+    }>;
+    connectedCallback(): void;
     disconnectedCallback(): void;
     componentWillLoad(): void;
     componentDidLoad(): void;
     componentWillRender(): void;
-    handleKeyDown(ev: CustomEvent): void;
+    handleKeyDown(event: KeyboardEvent): void;
     handleKeyUp(ev: KeyboardEvent): void;
     /**
      * Sets focus on the native `input`.
@@ -235,7 +244,6 @@ export declare class SearchBar {
     private handleHostBlur;
     private handleShowClearButton;
     private handleFocusClearButton;
-    private handleMenuCloseFromMenuChange;
     private handleTruncateValue;
     private renderAssistiveHintEl;
     private updateSearchResultAriaLive;

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

@@ -28,7 +28,7 @@ export declare class Select {
     el: HTMLIcSelectElement;
     ariaActiveDescendant: string;
     clearButtonFocused: boolean;
-    debounceIcChange: number;
+    debounceIcInput: number;
     hiddenInputValue: string;
     noOptions: IcMenuOption[];
     open: boolean;
@@ -38,6 +38,7 @@ export declare class Select {
      * If `true`, the disabled state will be set.
      */
     disabled?: boolean;
+    watchDisabledHandler(): void;
     /**
      * If `true`, the built in filtering will be disabled for a searchable variant. For example, if options will already be filtered from external source.
      */
@@ -151,7 +152,7 @@ export declare class Select {
     uniqueOptions: IcMenuOption[];
     watchOptionsHandler(): void;
     /**
-     * The amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.
+     * The amount of time, in milliseconds, to wait to trigger the `icInput` event after each keystroke.
      */
     debounce?: number;
     currDebounce: number;
@@ -176,7 +177,7 @@ export declare class Select {
      */
     icChange: EventEmitter<IcValueEventDetail>;
     /**
-     * Emitted when the clear button is clicked.
+     * Emitted when the clear or clear all button is clicked.
      */
     icClear: EventEmitter<void>;
     /**
@@ -220,7 +221,7 @@ export declare class Select {
     private handleRetry;
     private updateOnChangeDebounce;
     private emitIcChange;
-    private emitImmediateIcChange;
+    private emitIcInput;
     /**
      * Processes the provided array of IcMenuOptions, removing duplicates and reporting them with a console.warn
      * @param options array of IcMenuOptions
@@ -272,5 +273,6 @@ export declare class Select {
     private onBlur;
     private onTimeoutBlur;
     private handleFormReset;
+    private clearInput;
     render(): any;
 }

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

@@ -1,5 +1,5 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { IcThemeForeground } from "../../utils/types";
+import { IcBrand, IcBrandForeground } from "../../utils/types";
 import { IcExpandedDetail } from "./ic-side-navigation.types";
 /**
  * @slot app-icon - Content will be rendered adjacent to the app title at the very top of the side navigation.
@@ -17,7 +17,7 @@ export declare class SideNavigation {
     el: HTMLIcSideNavigationElement;
     deviceSize: number;
     deviceSizeAppTitle: number;
-    foregroundColor: IcThemeForeground;
+    foregroundColor: IcBrandForeground;
     hasSecondaryNavigation: boolean;
     menuExpanded: boolean;
     menuOpen: boolean;
@@ -73,7 +73,7 @@ export declare class SideNavigation {
     componentWillLoad(): void;
     componentDidLoad(): void;
     disconnectedCallback(): void;
-    themeChangeHandler({ detail }: CustomEvent): void;
+    brandChangeHandler({ detail }: CustomEvent<IcBrand>): void;
     private emitSideNavigationExpanded;
     private toggleMenu;
     private setToggleMenuFlyoutMenuVisibility;

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

@@ -1,7 +1,7 @@
-import { IcThemeForeground } from "../../utils/types";
+import { IcBrandForeground } from "../../utils/types";
 export interface IcTopBar {
     isSDevice: boolean;
-    foregroundColor: IcThemeForeground;
+    foregroundColor: IcBrandForeground;
     menuOpen: boolean;
     href: string;
     isAppNameSubtitleVariant: boolean;

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

@@ -18,6 +18,7 @@ export declare class Switch {
      * If `true`, the disabled state will be set.
      */
     disabled?: boolean;
+    watchDisabledHandler(): void;
     /**
      * The helper text that will be displayed for additional field guidance.
      */

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

@@ -16,6 +16,7 @@ export declare class Tab {
      * If `true`, the disabled state will be set.
      */
     disabled?: boolean;
+    watchDisabledHandler(): void;
     /** @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. */

package/dist/types/components/ic-text-field/ic-text-field.d.ts

@@ -8,6 +8,7 @@ export declare class TextField {
     private inheritedAttributes;
     private inputEl;
     private hostMutationObserver;
+    private interval;
     el: HTMLIcTextFieldElement;
     numChars: number;
     maxCharactersReached: boolean;
@@ -52,11 +53,12 @@ export declare class TextField {
     /**
      * If `true`, the form control will have input focus when the page loads.
      */
-    autoFocus: boolean;
+    autofocus: boolean;
     /**
      * If `true`, the disabled state will be set.
      */
     disabled: boolean;
+    watchDisabledHandler(): void;
     /**
      * Specify whether the text field fills the full width of the container.
      * If `true`, this overrides the --input-width CSS variable.
@@ -213,11 +215,13 @@ export declare class TextField {
     disconnectedCallback(): void;
     componentWillLoad(): void;
     componentDidLoad(): void;
+    private checkChildHydration;
     handleKeyDown(ev: KeyboardEvent): void;
     /**
      * Sets focus on the native `input`.
      */
     setFocus(): Promise<void>;
+    private getNumberOfCharacters;
     private getMaxValueExceeded;
     private getMaxCharactersReached;
     private onInput;

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

@@ -1,24 +1,24 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { IcColor, IcTheme } from "../../utils/types";
+import { IcColor, IcBrand } from "../../utils/types";
 export declare class Theme {
     themeClass: string;
     /**
-     * The theme colour. Can be a hex value e.g. "#ff0000", RGB e.g. "rgb(255, 0, 0)", or RGBA e.g. "rgba(255, 0, 0, 1)".
+     * The brand colour. Can be a hex value e.g. "#ff0000", RGB e.g. "rgb(255, 0, 0)", or RGBA e.g. "rgba(255, 0, 0, 1)".
      */
-    color?: IcColor;
-    watchColorPropHandler(): void;
+    brandColor?: IcColor;
+    watchBrandColorPropHandler(): void;
     /**
      * The theme mode. Can be "dark", "light", or "system". "system" will use the device or browser settings.
      */
     theme: "dark" | "light" | "system";
     watchThemePropHandler(): void;
     /**
-     * @internal Emitted when the theme is changed.
+     * @internal Emitted when the brand color is changed.
      */
-    themeChange: EventEmitter<IcTheme>;
+    brandChange: EventEmitter<IcBrand>;
     componentWillLoad(): void;
     private darkModeChangeHandler;
-    private checkThemeColorContrast;
-    private setThemeColor;
+    private checkBrandColorContrast;
+    private setBrandColor;
     render(): any;
 }

package/dist/types/components/ic-toggle-button/ic-toggle-button.d.ts

@@ -19,6 +19,7 @@ export declare class ToggleButton {
      * If `true`, the toggle button will be in disabled state.
      */
     disabled?: boolean;
+    watchDisabledHandler(): void;
     /**
      * If `true`, the toggle button will fill the width of the container.
      */

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

@@ -1,5 +1,5 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { IcAlignment, IcThemeForeground, IcTheme, IcDeviceSizes, IcValueEventDetail, IcThemeMode } from "../../utils/types";
+import { IcAlignment, IcBrandForeground, IcBrand, IcDeviceSizes, IcValueEventDetail, IcThemeMode } from "../../utils/types";
 import { IcSearchBarBlurEventDetail } from "../ic-search-bar/ic-search-bar.types";
 /**
  * @slot app-icon - Content will be rendered to left of app title. Anything that is slotted here will be hidden from screen readers.
@@ -20,7 +20,7 @@ export declare class TopNavigation {
     private searchBar;
     el: HTMLIcTopNavigationElement;
     deviceSize: number;
-    foregroundColor: IcThemeForeground;
+    foregroundColor: IcBrandForeground;
     hasFullWidthSearchBar: boolean;
     mobileSearchBarVisible: boolean;
     mobileSearchHiddenOnBlur: boolean;
@@ -86,7 +86,7 @@ export declare class TopNavigation {
     navBarMenuCloseHandler(): void;
     searchInputBlurHandler({ detail, }: CustomEvent<IcSearchBarBlurEventDetail>): void;
     searchValueChangeHandler({ detail }: CustomEvent<IcValueEventDetail>): void;
-    themeChangeHandler({ detail }: CustomEvent<IcTheme>): void;
+    brandChangeHandler({ detail }: CustomEvent<IcBrand>): void;
     private checkSlots;
     private initialiseSearchBar;
     private toggleSearchBar;

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, IcColor, IcDeviceSizes, IcEmphasisType, IcInformationStatusOrEmpty, IcMenuOption, IcOrientation, IcSearchMatchPositions, IcSelectMethodTypes, IcSelectTypes, IcSizes, IcSizesNoLarge, IcStatusVariants, IcTheme, IcThemeForeground, IcThemeMode, IcTypographyVariants, IcValueEventDetail } from "./utils/types";
+import { IcActivationTypes, IcAdditionalFieldTypes, IcAlignment, IcAutocompleteTypes, IcAutocorrectStates, IcBlurEventDetail, IcBrand, IcBrandForeground, IcColor, IcDeviceSizes, IcEmphasisType, IcInformationStatusOrEmpty, IcMenuOption, IcOrientation, IcSearchMatchPositions, IcSelectMethodTypes, IcSelectTypes, IcSizes, IcSizesNoLarge, IcStatusVariants, IcThemeMode, IcTypographyVariants, IcValueEventDetail } from "./utils/types";
 import { IcBackToTopVariants } from "./components/ic-back-to-top/ic-back-to-top.types";
 import { IcBadgePositions, IcBadgeTypes, IcBadgeVariants } from "./components/ic-badge/ic-badge.types";
 import { IcButtonTooltipPlacement, IcButtonTypes, IcButtonVariants } from "./components/ic-button/ic-button.types";
@@ -34,7 +34,7 @@ import { IcAriaAutocompleteTypes, IcTextFieldInputModes, IcTextFieldTypes } from
 import { IcChangeEventDetail as IcChangeEventDetail3 } from "./components/ic-toggle-button-group/ic-toggle-button-group.types";
 import { IcTooltipPlacements } from "./components/ic-tooltip/ic-tooltip.types";
 import { Options } from "@popperjs/core";
-export { IcActivationTypes, IcAdditionalFieldTypes, IcAlignment, IcAutocompleteTypes, IcAutocorrectStates, IcBlurEventDetail, IcColor, IcDeviceSizes, IcEmphasisType, IcInformationStatusOrEmpty, IcMenuOption, IcOrientation, IcSearchMatchPositions, IcSelectMethodTypes, IcSelectTypes, IcSizes, IcSizesNoLarge, IcStatusVariants, IcTheme, IcThemeForeground, IcThemeMode, IcTypographyVariants, IcValueEventDetail } from "./utils/types";
+export { IcActivationTypes, IcAdditionalFieldTypes, IcAlignment, IcAutocompleteTypes, IcAutocorrectStates, IcBlurEventDetail, IcBrand, IcBrandForeground, IcColor, IcDeviceSizes, IcEmphasisType, IcInformationStatusOrEmpty, IcMenuOption, IcOrientation, IcSearchMatchPositions, IcSelectMethodTypes, IcSelectTypes, IcSizes, IcSizesNoLarge, IcStatusVariants, IcThemeMode, IcTypographyVariants, IcValueEventDetail } from "./utils/types";
 export { IcBackToTopVariants } from "./components/ic-back-to-top/ic-back-to-top.types";
 export { IcBadgePositions, IcBadgeTypes, IcBadgeVariants } from "./components/ic-badge/ic-badge.types";
 export { IcButtonTooltipPlacement, IcButtonTypes, IcButtonVariants } from "./components/ic-button/ic-button.types";
@@ -552,6 +552,10 @@ export namespace Components {
           * If `true`, the chip will appear disabled.
          */
         "disabled"?: boolean;
+        /**
+          * The text in the dismiss button tooltip and aria label.
+         */
+        "dismissLabel"?: string;
         /**
           * If `true`, the chip will have a close button at the end to dismiss it.
          */
@@ -717,7 +721,7 @@ export namespace Components {
         /**
           * 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 | IcThemeForeground;
+        "theme"?: IcThemeMode | IcBrandForeground;
         /**
           * The thickness of the divider.
          */
@@ -849,7 +853,7 @@ export namespace Components {
         /**
           * The appearance of the horizontal scroll, e.g. dark, light or the default.
          */
-        "appearance"?: IcThemeForeground;
+        "appearance"?: IcBrandForeground;
         "focusTrigger"?: string;
         "monochrome"?: boolean;
         "scrollItemIntoView": (itemPosition: number) => Promise<void>;
@@ -1046,7 +1050,7 @@ export namespace Components {
           * The reference to an anchor element the menu will position itself from when rendered.
          */
         "anchorEl": HTMLElement;
-        "autoFocusOnSelected": boolean;
+        "autofocusOnSelected": boolean;
         /**
           * If `true`, the menu will close when an option is selected.
          */
@@ -1662,7 +1666,7 @@ export namespace Components {
     }
     interface IcSelect {
         /**
-          * The amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.
+          * The amount of time, in milliseconds, to wait to trigger the `icInput` event after each keystroke.
          */
         "debounce"?: number;
         /**
@@ -2027,10 +2031,6 @@ export namespace Components {
         "ariaAutocomplete": IcAriaAutocompleteTypes;
         "ariaExpanded": string;
         "ariaOwns": string;
-        /**
-          * If `true`, the form control will have input focus when the page loads.
-         */
-        "autoFocus": boolean;
         /**
           * The automatic capitalisation of the text value as it is entered/edited by the user. Available options: "off", "none", "on", "sentences", "words", "characters".
          */
@@ -2043,6 +2043,10 @@ export namespace Components {
           * The state of autocorrection the browser can apply when the user is entering/editing the text value.
          */
         "autocorrect": IcAutocorrectStates;
+        /**
+          * If `true`, the form control will have input focus when the page loads.
+         */
+        "autofocus": boolean;
         /**
           * The amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.
          */
@@ -2162,9 +2166,9 @@ export namespace Components {
     }
     interface IcTheme {
         /**
-          * The theme colour. Can be a hex value e.g. "#ff0000", RGB e.g. "rgb(255, 0, 0)", or RGBA e.g. "rgba(255, 0, 0, 1)".
+          * The brand colour. Can be a hex value e.g. "#ff0000", RGB e.g. "rgb(255, 0, 0)", or RGBA e.g. "rgba(255, 0, 0, 1)".
          */
-        "color"?: IcColor;
+        "brandColor"?: IcColor;
         /**
           * The theme mode. Can be "dark", "light", or "system". "system" will use the device or browser settings.
          */
@@ -2813,6 +2817,7 @@ declare global {
         new (): HTMLIcLoadingIndicatorElement;
     };
     interface HTMLIcMenuElementEventMap {
+        "icClear": void;
         "menuKeyPress": { isNavKey: boolean; key: string };
         "menuOptionId": IcMenuOptionIdEventDetail;
         "menuOptionSelect": IcOptionSelectEventDetail;
@@ -3015,6 +3020,7 @@ declare global {
         "icSubmitSearchBlur": IcBlurEventDetail;
         "icSearchBarBlur": IcSearchBarBlurEventDetail;
         "icSearchBarFocus": IcValueEventDetail;
+        "icKeydown": { event: KeyboardEvent };
     }
     interface HTMLIcSearchBarElement extends Components.IcSearchBar, HTMLStencilElement {
         addEventListener<K extends keyof HTMLIcSearchBarElementEventMap>(type: K, listener: (this: HTMLIcSearchBarElement, ev: IcSearchBarCustomEvent<HTMLIcSearchBarElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -3207,7 +3213,7 @@ declare global {
         new (): HTMLIcTextFieldElement;
     };
     interface HTMLIcThemeElementEventMap {
-        "themeChange": IcTheme;
+        "brandChange": IcBrand;
     }
     interface HTMLIcThemeElement extends Components.IcTheme, HTMLStencilElement {
         addEventListener<K extends keyof HTMLIcThemeElementEventMap>(type: K, listener: (this: HTMLIcThemeElement, ev: IcThemeCustomEvent<HTMLIcThemeElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -3878,6 +3884,10 @@ declare namespace LocalJSX {
           * If `true`, the chip will appear disabled.
          */
         "disabled"?: boolean;
+        /**
+          * The text in the dismiss button tooltip and aria label.
+         */
+        "dismissLabel"?: string;
         /**
           * If `true`, the chip will have a close button at the end to dismiss it.
          */
@@ -4051,7 +4061,7 @@ declare namespace LocalJSX {
         /**
           * 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 | IcThemeForeground;
+        "theme"?: IcThemeMode | IcBrandForeground;
         /**
           * The thickness of the divider.
          */
@@ -4183,7 +4193,7 @@ declare namespace LocalJSX {
         /**
           * The appearance of the horizontal scroll, e.g. dark, light or the default.
          */
-        "appearance"?: IcThemeForeground;
+        "appearance"?: IcBrandForeground;
     }
     interface IcInputComponentContainer {
         /**
@@ -4394,6 +4404,10 @@ declare namespace LocalJSX {
           * The ID of the menu.
          */
         "menuId": string;
+        /**
+          * Emitted when the clear all button is clicked.
+         */
+        "onIcClear"?: (event: IcMenuCustomEvent<void>) => void;
         /**
           * If `true`, the menu will be displayed open.
          */
@@ -4918,6 +4932,10 @@ declare namespace LocalJSX {
           * Emitted when a keyboard input occurred.
          */
         "onIcInput"?: (event: IcSearchBarCustomEvent<IcValueEventDetail>) => void;
+        /**
+          * Emitted when a keydown event occurred.
+         */
+        "onIcKeydown"?: (event: IcSearchBarCustomEvent<{ event: KeyboardEvent }>) => void;
         /**
           * Emitted when the state of the menu changes (i.e. open or close)
          */
@@ -4999,7 +5017,7 @@ declare namespace LocalJSX {
     }
     interface IcSelect {
         /**
-          * The amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.
+          * The amount of time, in milliseconds, to wait to trigger the `icInput` event after each keystroke.
          */
         "debounce"?: number;
         /**
@@ -5071,7 +5089,7 @@ declare namespace LocalJSX {
          */
         "onIcChange"?: (event: IcSelectCustomEvent<IcValueEventDetail>) => void;
         /**
-          * Emitted when the clear button is clicked.
+          * Emitted when the clear or clear all button is clicked.
          */
         "onIcClear"?: (event: IcSelectCustomEvent<void>) => void;
         /**
@@ -5384,10 +5402,6 @@ declare namespace LocalJSX {
     interface IcTabPanel {
     }
     interface IcTextField {
-        /**
-          * If `true`, the form control will have input focus when the page loads.
-         */
-        "autoFocus"?: boolean;
         /**
           * The automatic capitalisation of the text value as it is entered/edited by the user. Available options: "off", "none", "on", "sentences", "words", "characters".
          */
@@ -5400,6 +5414,10 @@ declare namespace LocalJSX {
           * The state of autocorrection the browser can apply when the user is entering/editing the text value.
          */
         "autocorrect"?: IcAutocorrectStates;
+        /**
+          * If `true`, the form control will have input focus when the page loads.
+         */
+        "autofocus"?: boolean;
         /**
           * The amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.
          */
@@ -5531,9 +5549,9 @@ declare namespace LocalJSX {
     }
     interface IcTheme {
         /**
-          * The theme colour. Can be a hex value e.g. "#ff0000", RGB e.g. "rgb(255, 0, 0)", or RGBA e.g. "rgba(255, 0, 0, 1)".
+          * The brand colour. Can be a hex value e.g. "#ff0000", RGB e.g. "rgb(255, 0, 0)", or RGBA e.g. "rgba(255, 0, 0, 1)".
          */
-        "color"?: IcColor;
+        "brandColor"?: IcColor;
         /**
           * The theme mode. Can be "dark", "light", or "system". "system" will use the device or browser settings.
          */

package/dist/types/testspec.setup.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="jest" />
 type TestKeyboardEvent = {
     key: string;
     preventDefault: () => void;
@@ -7,6 +8,14 @@ type TestKeyboardEvent = {
         id: string;
     };
 };
+export declare const mockMutationObserverImplementation: jest.SpyInstance<MutationObserver, [callback: MutationCallback]>;
+export type MockMutationRecord = {
+    addedNodes?: Node[];
+    removedNodes?: Node[];
+    target?: Node;
+};
+export declare const mockRenderDynamicChildSlots: jest.SpyInstance<void, [mutationList: MutationRecord[], slotNames: string | string[], ref: any]>;
+export declare const mockHasDynamicChildSlots: jest.SpyInstance<boolean, [mutationList: MutationRecord[], slotNames: string | string[]]>;
 export declare const waitForTimeout: (ms: number) => Promise<void>;
 export declare const mockDeviceSize: (size: number) => void;
 export declare const waitForNavGroupLoad: () => Promise<void>;

package/dist/types/utils/helpers.d.ts

@@ -1,6 +1,6 @@
 import { EventEmitter } from "../stencil-public-runtime";
-import { IcCallbackFunctionNoReturn, IcInformationStatusOrEmpty, IcNavParentDetails, IcPropObject, IcSearchMatchPositions, IcColorRGBA, IcDeviceSizes, IcColor, IcThemeForegroundNoDefault } from "./types";
-import { IcMenuOption, IcThemeForeground } from "../utils/types";
+import { IcCallbackFunctionNoReturn, IcInformationStatusOrEmpty, IcNavParentDetails, IcPropObject, IcSearchMatchPositions, IcColorRGBA, IcDeviceSizes, IcColor, IcBrandForegroundNoDefault } from "./types";
+import { IcMenuOption, IcBrandForeground } from "../utils/types";
 /**
  * converts an enum of strings into an array of strings
  */
@@ -60,9 +60,9 @@ export declare const getInputDescribedByText: (inputId: string, helperText: bool
  * are part of an IC component.
  *
  * ""
- * @returns IcThemeForeground depending on the context
+ * @returns IcBrandForeground depending on the context
  */
-export declare const getThemeFromContext: (el: Element, themeFromEvent?: IcThemeForeground) => IcThemeForeground;
+export declare const getBrandFromContext: (el: Element, brandFromEvent?: IcBrandForeground) => IcBrandForeground;
 /**
  * Checks if the current device is a mobile or tablet device.
  * @returns {boolean} Returns true if the device is a mobile or tablet device, otherwise returns false.
@@ -108,16 +108,16 @@ export declare const getCssProperty: (cssVar: string) => string;
  * Returns the brightness of the theme colour, calculated by using the theme RGB CSS values by:
  * - Multiplying each RGB value by a set number: https://www.w3.org/TR/AERT/#color-contrast
  * - Adding them together and dividing by 1000
- * This is a similar calculation to its CSS counterpart: "--ic-theme-text"
+ * This is a similar calculation to its CSS counterpart: "--ic-brand-text-color"
  * @returns number representing the brightness of the theme colour
  */
-export declare const getThemeColorBrightness: () => number;
+export declare const getBrandColorBrightness: () => number;
 /**
  * Returns if dark or light foreground colors should be used for color contrast reasons
  * @returns "dark" or "light"
- * @param brightness - Optional custom brightness value. Defaults to `getThemeColorBrightness`
+ * @param brightness - Optional custom brightness value. Defaults to `getBrandColorBrightness`
  */
-export declare const getThemeForegroundColor: (brightness?: number) => IcThemeForegroundNoDefault;
+export declare const getBrandForegroundAppearance: (brightness?: number) => IcBrandForegroundNoDefault;
 export declare const getSlot: (element: HTMLElement, name: string) => Element | null;
 export declare const slotHasContent: (element: HTMLElement, name: string) => boolean;
 export declare const getSlotContent: (element: HTMLElement, name: string) => Element[] | NodeListOf<ChildNode> | null;
@@ -144,6 +144,10 @@ export declare const hasClassificationBanner: () => boolean;
 export declare const addFormResetListener: (el: HTMLElement, callbackFn: IcCallbackFunctionNoReturn) => void;
 export declare const removeFormResetListener: (el: HTMLElement, callbackFn: IcCallbackFunctionNoReturn) => void;
 export declare const pxToRem: (px: string, base?: number) => string;
+/**
+ * Removes the disabled attribute from the provided element when its value is set to false.
+ * This effectively makes it null, to not confuse screen readers that cannot interpret the false value
+ */
 export declare const removeDisabledFalse: (disabled: boolean, element: HTMLElement) => void;
 export declare const isMacDevice: () => boolean;
 export declare const isNumeric: (value: string) => boolean;
@@ -152,3 +156,5 @@ export declare const convertToRGBA: (color: IcColor) => IcColorRGBA | null;
 export declare const capitalize: (text: string) => string;
 export declare const checkSlotInChildMutations: (addedNodes: NodeList, removedNodes: NodeList, slotName: string | string[]) => boolean;
 export declare const isElInAGGrid: (el: HTMLElement) => boolean;
+export declare const hasDynamicChildSlots: (mutationList: MutationRecord[], slotNames: string | string[]) => boolean;
+export declare const renderDynamicChildSlots: (mutationList: MutationRecord[], slotNames: string | string[], ref: any) => void;

package/dist/types/utils/types.d.ts

@@ -11,16 +11,16 @@ export type IcInformationStatusOrEmpty = "warning" | "error" | "success" | "";
 export type IcNavType = "side" | "top" | "page-header";
 export type IcAutocompleteTypes = "on" | "off" | "name" | "honorific-prefix" | "given-name" | "additional-name" | "family-name" | "honorific-suffix" | "nickname" | "email" | "username" | "new-password" | "current-password" | "one-time-code" | "organization-title" | "organization" | "street-address" | "address-line1" | "address-line2" | "address-line3" | "address-level4" | "address-level3" | "address-level2" | "address-level1" | "country" | "country-name" | "postal-code" | "cc-name" | "cc-given-name" | "cc-additional-name" | "cc-family-name" | "cc-family-name" | "cc-number" | "cc-exp" | "cc-exp-month" | "cc-exp-year" | "cc-csc" | "cc-type" | "transaction-currency" | "transaction-amount" | "language" | "bday" | "bday-day" | "bday-month" | "bday-year" | "sex" | "tel" | "tel-country-code" | "tel-national" | "tel-area-code" | "tel-local" | "tel-extension" | "impp" | "url" | "photo";
 export type IcAlignment = "left" | "center" | "full-width";
-export declare enum IcThemeForegroundEnum {
+export declare enum IcBrandForegroundEnum {
     Default = "default",
     Dark = "dark",
     Light = "light"
 }
 export type IcThemeMode = "dark" | "light" | "inherit";
-export type IcThemeForeground = "default" | "dark" | "light";
-export type IcThemeForegroundNoDefault = "dark" | "light";
-export type IcTheme = {
-    mode: IcThemeForeground;
+export type IcBrandForeground = "default" | "dark" | "light";
+export type IcBrandForegroundNoDefault = "dark" | "light";
+export type IcBrand = {
+    mode: IcBrandForeground;
     color: IcColorRGB;
 };
 export type IcAdditionalFieldTypes = "static" | "dynamic";