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

package/dist/types/components/ic-card-horizontal/ic-card-horizontal.d.ts

@@ -1,4 +1,4 @@
-import { IcTheme, IcThemeForeground, IcThemeMode } from "../../utils/types";
+import { IcBrand, IcBrandForeground, IcThemeMode } from "../../utils/types";
 import { IcCardSizes } from "./ic-card-horizontal.types";
 /**
  * @slot heading - Content will be placed at the top of the horizontal card to the right of the icon.
@@ -10,7 +10,7 @@ import { IcCardSizes } from "./ic-card-horizontal.types";
 export declare class Card {
     private hostMutationObserver;
     el: HTMLIcCardHorizontalElement;
-    appearance?: IcThemeForeground;
+    appearance?: IcBrandForeground;
     isFocussed: boolean;
     parentEl: HTMLElement | null;
     parentIsAnchorTag: boolean;
@@ -22,6 +22,7 @@ export declare class Card {
      * If `true`, the horizontal card will be disabled if it is clickable.
      */
     disabled?: boolean;
+    watchDisabledHandler(): void;
     /**
      * The heading for the horizontal card. This is required, unless a slotted heading is used.
      */
@@ -62,7 +63,7 @@ export declare class Card {
     componentWillLoad(): void;
     componentDidLoad(): void;
     handleHostClick(event: Event): void;
-    themeChangeHandler(ev: CustomEvent<IcTheme>): void;
+    brandChangeHandler(ev: CustomEvent<IcBrand>): void;
     /**
      * Sets focus on the card.
      */

package/dist/types/components/ic-data-table/ic-data-table.d.ts

@@ -1,7 +1,6 @@
 import { EventEmitter } from "../../stencil-public-runtime";
 import { IcDataTableDataType, IcDataTableColumnObject, IcDataTableDensityOptions, IcDataTableRowHeights, IcDataTableSortOrderOptions, IcDataTableTruncationTypes, IcDensityUpdateEventDetail, IcSortEventDetail } from "./ic-data-table.types";
-import { IcThemeForegroundNoDefault } from "@ukic/web-components/dist/types/utils/types";
-import { IcPaginationBarOptions } from "../../utils/types";
+import { IcPaginationBarOptions, IcThemeMode } from "../../utils/types";
 /**
  * @slot empty-state - Content is slotted below the table header when there is no data and the table is not loading.
  * @slot {COLUMN_KEY}-{ROW_INDEX}[-icon] - Each cell should have its own slot, named using the column tag and the row index, allowing for custom elements to be displayed. Include `-icon` at the end for that cell's icon slot.
@@ -69,7 +68,7 @@ export declare class DataTable {
     /**
      * The row content for the table.
      */
-    data: IcDataTableDataType[];
+    data?: IcDataTableDataType[];
     /**
      * Set the density of the table including font and padding.
      */
@@ -98,7 +97,6 @@ export declare class DataTable {
      * Sets the props for the circular loading indicator used in the loading state.
      */
     loadingOptions?: {
-        appearance?: IcThemeForegroundNoDefault;
         description?: string;
         label?: string;
         labelDuration?: number;
@@ -151,6 +149,10 @@ export declare class DataTable {
      * Sets the layout of the table
      */
     tableLayout?: "fixed" | "auto";
+    /**
+     * 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;
     /**
      * Sets the method used to truncate long text in cells where textWrap is `false`. The `tooltip` truncation pattern allows the overflowing text to be seen in a tooltip. The `show-hide` truncation pattern allows the overflowing text to be shown and hidden using the ic-typography "See more"/"See less" buttons.
      */
@@ -163,7 +165,6 @@ export declare class DataTable {
      * Sets the props for the linear loading indicator used in the updating state.
      */
     updatingOptions?: {
-        appearance?: IcThemeForegroundNoDefault;
         description?: string;
         max?: number;
         min?: number;
@@ -245,6 +246,8 @@ export declare class DataTable {
     private setTruncationClass;
     private getColumnWidth;
     private getRowHeight;
+    private adjustWidthForActionElement;
+    private createCellContent;
     private createCells;
     private createColumnHeaders;
     private onRowClick;

package/dist/types/components/ic-data-table/story-data.d.ts

@@ -171,6 +171,31 @@ export declare const DATA_CELL_ALIGNMENT: ({
     jobTitle: string;
     address: string;
 })[];
+export declare const DATA_EMPHASIS: ({
+    firstName: {
+        data: string;
+        emphasis: string;
+    };
+    lastName: string;
+    age: number;
+    jobTitle: string;
+    address: string;
+} | {
+    firstName: string;
+    lastName: {
+        data: string;
+        emphasis: string;
+    };
+    age: number;
+    jobTitle: string;
+    address: string;
+} | {
+    firstName: string;
+    lastName: string;
+    age: number;
+    jobTitle: string;
+    address: string;
+})[];
 export declare const ROW_ALIGNMENT: ({
     header: {
         title: string;
@@ -279,6 +304,20 @@ export declare const DATA_ELEMENTS: ({
     firstName: {
         data: string;
         href: string;
+        target: string;
+        rel: string;
+    };
+    actions2: string;
+    age: number;
+    jobTitle: string;
+    address: string;
+} | {
+    actions: string;
+    firstName: {
+        data: string;
+        href: string;
+        target?: undefined;
+        rel?: undefined;
     };
     actions2: string;
     age: number;
@@ -296,6 +335,18 @@ export declare const DATA_REACT_ELEMENTS: ({
     firstName: {
         data: string;
         href: string;
+        target: string;
+        rel: string;
+    };
+    age: number;
+    jobTitle: string;
+    address: string;
+} | {
+    firstName: {
+        data: string;
+        href: string;
+        target?: undefined;
+        rel?: undefined;
     };
     age: number;
     jobTitle: string;
@@ -321,6 +372,56 @@ export declare const DATA_REACT_ELEMENTS_WITH_ICONS: ({
     jobTitle: string;
     address: string;
 })[];
+export declare const ACTION_DATA_ELEMENTS: ({
+    firstName: {
+        data: string;
+        actionElement: string;
+    };
+    lastName: string;
+    age: number;
+    jobTitle: string;
+    address: string;
+} | {
+    firstName: string;
+    lastName: string;
+    age: number;
+    jobTitle: {
+        data: string;
+        actionElement: string;
+    };
+    address: string;
+} | {
+    firstName: string;
+    lastName: string;
+    age: {
+        data: number;
+        actionElement: string;
+    };
+    jobTitle: string;
+    address: string;
+} | {
+    firstName: string;
+    lastName: string;
+    age: number;
+    jobTitle: string;
+    address: string;
+} | {
+    firstName: string;
+    lastName: string;
+    age: number;
+    jobTitle: string;
+    address: {
+        data: string;
+        actionElement: string;
+    };
+})[];
+export declare const DATA_WITH_EMPTY_VALUES: {
+    firstName: string;
+    lastName: string;
+    age: number;
+    jobTitle: string;
+    address: string;
+}[];
 export declare const createDataTableElement: (caption: string, columns?: IcDataTableColumnObject[], data?: object[]) => HTMLIcDataTableElement;
 export declare const Basic: () => HTMLIcDataTableElement;
 export declare const DataTableSizing: () => HTMLElement;
@@ -351,4 +452,6 @@ export declare const TruncationTooltip: () => HTMLElement;
 export declare const CustomTitleBar: () => HTMLIcDataTableElement;
 export declare const UpdatingData: () => HTMLElement;
 export declare const SlottedPagination: () => HTMLIcDataTableElement;
+export declare const ActionElement: () => HTMLElement;
+export declare const MissingCellData: () => HTMLElement;
 export declare const DevArea: () => HTMLElement;

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

@@ -1,5 +1,5 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { IcInformationStatusOrEmpty, IcSizes, IcDateFormat, IcWeekDays } from "../../utils/types";
+import { IcInformationStatusOrEmpty, IcSizes, IcDateFormat, IcWeekDays, IcThemeMode } from "../../utils/types";
 export declare class DateInput {
     private ARIA_INVALID;
     private ARIA_LABEL;
@@ -57,6 +57,7 @@ export declare class DateInput {
      * If `true`, the disabled state will be set.
      */
     disabled?: boolean;
+    watchDisabledHandler(): void;
     /**
      * The days of the week to disable.
      */
@@ -140,6 +141,10 @@ export declare class DateInput {
      * The size of the date input to be displayed.
      */
     size?: IcSizes;
+    /**
+     * Sets the date picker to the dark or light theme colors. "inherit" will set the color based on the system settings or ic-theme component.
+     */
+    theme?: IcThemeMode;
     /**
      * The value of the date input. The value can be in any format supported as `dateFormat`, in ISO 8601 date string format (`yyyy-mm-dd`) or as a JavaScript `Date` object.
      */

package/dist/types/components/ic-date-picker/ic-date-picker.d.ts

@@ -1,5 +1,5 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { IcWeekDays, IcDateFormat, IcSizes, IcInformationStatusOrEmpty } from "../../utils/types";
+import { IcWeekDays, IcDateFormat, IcSizes, IcInformationStatusOrEmpty, IcThemeMode } from "../../utils/types";
 export declare class DatePicker {
     private inputEl;
     private clearButtonEl;
@@ -49,6 +49,7 @@ export declare class DatePicker {
      * If `true`, the disabled state will be set.
      */
     disabled?: boolean;
+    watchDisabledHandler(): void;
     /**
      * The days of the week to disable.
      */
@@ -146,6 +147,10 @@ export declare class DatePicker {
      */
     startOfWeek?: IcWeekDays;
     watchStartOfWeekHandler(): void;
+    /**
+     * Sets the date picker to the dark or light theme colors. "inherit" will set the color based on the system settings or ic-theme component.
+     */
+    theme?: IcThemeMode;
     /**
      * The validation status - e.g. 'error' | 'warning' | 'success'. This will override the built-in date validation.
      */

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

@@ -1,5 +1,5 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { IcThemeMode } from "@ukic/web-components/dist/types/interface";
+import { IcThemeMode } from "../../utils/types";
 import { IcPageChangeEventDetail } from "./ic-pagination-bar.types";
 import { IcPaginationAlignmentOptions, IcPaginationLabelTypes, IcPaginationTypes } from "@ukic/web-components/dist/types/components/ic-pagination/ic-pagination.types";
 export declare class PaginationBar {

package/dist/types/components/ic-tree-item/ic-tree-item.d.ts

@@ -1,6 +1,5 @@
 import { EventEmitter } from "../../stencil-public-runtime";
-import { IcSizes } from "../../utils/types";
-import { IcThemeMode } from "@ukic/web-components";
+import { IcSizes, IcThemeMode } from "../../utils/types";
 /**
  * @slot label - Content is set as the tree item label.
  * @slot icon - Content is placed to the left of the label.
@@ -19,6 +18,7 @@ export declare class TreeItem {
      * If `true`, the tree item appears in the disabled state.
      */
     disabled?: boolean;
+    watchDisabledHandler(): void;
     /**
      * If `true`, the tree item appears in the expanded state.
      */
@@ -72,6 +72,10 @@ export declare class TreeItem {
      * 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;
+    /**
+     * If `true`, the tree item label will be truncated instead of text wrapping.
+     */
+    truncateTreeItem?: boolean;
     /**
      * Emitted when tree item is selected.
      */
@@ -79,6 +83,7 @@ export declare class TreeItem {
         id: string;
     }>;
     disconnectedCallback(): void;
+    componentWillLoad(): void;
     componentDidLoad(): void;
     componentDidUpdate(): void;
     handleKeyDown(ev: KeyboardEvent): void;

package/dist/types/components/ic-tree-view/ic-tree-view.d.ts

@@ -1,5 +1,4 @@
-import { IcSizes } from "../../utils/types";
-import { IcThemeMode } from "@ukic/web-components";
+import { IcSizes, IcThemeMode } from "../../utils/types";
 /**
  * @slot heading - Content is set as the tree view heading.
  * @slot icon - Content is placed to the left of the heading.
@@ -29,6 +28,15 @@ export declare class TreeView {
      */
     theme?: IcThemeMode;
     watchThemeHandler(): void;
+    /**
+     * If `true`, the tree view heading will be truncated instead of text wrapping.
+     */
+    truncateHeading?: boolean;
+    /**
+     * If `true`, tree items will be truncated, unless they are individually overridden.
+     */
+    truncateTreeItems?: boolean;
+    watchTruncateTreeItemsHandler(): void;
     disconnectedCallback(): void;
     componentDidLoad(): void;
     handleTreeItemSelected(event: CustomEvent): void;

package/dist/types/components.d.ts

@@ -8,19 +8,13 @@ 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 { 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 { 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 { 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 { 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 {
         /**
@@ -88,7 +82,7 @@ export namespace Components {
         /**
           * The row content for the table.
          */
-        "data": IcDataTableDataType[];
+        "data"?: IcDataTableDataType[];
         /**
           * Set the density of the table including font and padding.
          */
@@ -117,7 +111,6 @@ export namespace Components {
           * Sets the props for the circular loading indicator used in the loading state.
          */
         "loadingOptions"?: {
-    appearance?: IcThemeForegroundNoDefault;
     description?: string;
     label?: string;
     labelDuration?: number;
@@ -174,6 +167,10 @@ export namespace Components {
           * Sets the layout of the table
          */
         "tableLayout"?: "fixed" | "auto";
+        /**
+          * 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;
         /**
           * Sets the method used to truncate long text in cells where textWrap is `false`. The `tooltip` truncation pattern allows the overflowing text to be seen in a tooltip. The `show-hide` truncation pattern allows the overflowing text to be shown and hidden using the ic-typography "See more"/"See less" buttons.
          */
@@ -186,7 +183,6 @@ export namespace Components {
           * Sets the props for the linear loading indicator used in the updating state.
          */
         "updatingOptions"?: {
-    appearance?: IcThemeForegroundNoDefault;
     description?: string;
     max?: number;
     min?: number;
@@ -312,6 +308,10 @@ export namespace Components {
           * The size of the date input to be displayed.
          */
         "size"?: IcSizes;
+        /**
+          * Sets the date picker to the dark or light theme colors. "inherit" will set the color based on the system settings or ic-theme component.
+         */
+        "theme"?: IcThemeMode;
         "triggerIcChange": (d: Date) => Promise<void>;
         /**
           * The validation status - e.g. 'error' | 'warning' | 'success'. This will override the built-in date validation.
@@ -423,6 +423,10 @@ export namespace Components {
           * The first day of the week. `0` for Sunday, `1` for Monday, etc. Default is Monday.
          */
         "startOfWeek"?: IcWeekDays;
+        /**
+          * Sets the date picker to the dark or light theme colors. "inherit" will set the color based on the system settings or ic-theme component.
+         */
+        "theme"?: IcThemeMode;
         /**
           * The validation status - e.g. 'error' | 'warning' | 'success'. This will override the built-in date validation.
          */
@@ -487,7 +491,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"?: IcThemeMode1;
+        "theme"?: IcThemeMode;
         /**
           * Total number of items to be displayed across all pages.
          */
@@ -545,7 +549,11 @@ 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"?: IcThemeMode2;
+        "theme"?: IcThemeMode;
+        /**
+          * If `true`, the tree item label will be truncated instead of text wrapping.
+         */
+        "truncateTreeItem"?: boolean;
         "updateAriaLabel": () => Promise<void>;
     }
     interface IcTreeView {
@@ -564,7 +572,15 @@ 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"?: IcThemeMode2;
+        "theme"?: IcThemeMode;
+        /**
+          * If `true`, the tree view heading will be truncated instead of text wrapping.
+         */
+        "truncateHeading"?: boolean;
+        /**
+          * If `true`, tree items will be truncated, unless they are individually overridden.
+         */
+        "truncateTreeItems"?: boolean;
     }
 }
 export interface IcDataTableCustomEvent<T> extends CustomEvent<T> {
@@ -814,7 +830,6 @@ declare namespace LocalJSX {
           * Sets the props for the circular loading indicator used in the loading state.
          */
         "loadingOptions"?: {
-    appearance?: IcThemeForegroundNoDefault;
     description?: string;
     label?: string;
     labelDuration?: number;
@@ -875,6 +890,10 @@ declare namespace LocalJSX {
           * Sets the layout of the table
          */
         "tableLayout"?: "fixed" | "auto";
+        /**
+          * 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;
         /**
           * Sets the method used to truncate long text in cells where textWrap is `false`. The `tooltip` truncation pattern allows the overflowing text to be seen in a tooltip. The `show-hide` truncation pattern allows the overflowing text to be shown and hidden using the ic-typography "See more"/"See less" buttons.
          */
@@ -887,7 +906,6 @@ declare namespace LocalJSX {
           * Sets the props for the linear loading indicator used in the updating state.
          */
         "updatingOptions"?: {
-    appearance?: IcThemeForegroundNoDefault;
     description?: string;
     max?: number;
     min?: number;
@@ -1021,6 +1039,10 @@ declare namespace LocalJSX {
           * The size of the date input to be displayed.
          */
         "size"?: IcSizes;
+        /**
+          * Sets the date picker to the dark or light theme colors. "inherit" will set the color based on the system settings or ic-theme component.
+         */
+        "theme"?: IcThemeMode;
         /**
           * The validation status - e.g. 'error' | 'warning' | 'success'. This will override the built-in date validation.
          */
@@ -1135,6 +1157,10 @@ declare namespace LocalJSX {
           * The first day of the week. `0` for Sunday, `1` for Monday, etc. Default is Monday.
          */
         "startOfWeek"?: IcWeekDays;
+        /**
+          * Sets the date picker to the dark or light theme colors. "inherit" will set the color based on the system settings or ic-theme component.
+         */
+        "theme"?: IcThemeMode;
         /**
           * The validation status - e.g. 'error' | 'warning' | 'success'. This will override the built-in date validation.
          */
@@ -1207,7 +1233,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"?: IcThemeMode1;
+        "theme"?: IcThemeMode;
         /**
           * Total number of items to be displayed across all pages.
          */
@@ -1261,7 +1287,11 @@ 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"?: IcThemeMode2;
+        "theme"?: IcThemeMode;
+        /**
+          * If `true`, the tree item label will be truncated instead of text wrapping.
+         */
+        "truncateTreeItem"?: boolean;
     }
     interface IcTreeView {
         /**
@@ -1279,7 +1309,15 @@ 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"?: IcThemeMode2;
+        "theme"?: IcThemeMode;
+        /**
+          * If `true`, the tree view heading will be truncated instead of text wrapping.
+         */
+        "truncateHeading"?: boolean;
+        /**
+          * If `true`, tree items will be truncated, unless they are individually overridden.
+         */
+        "truncateTreeItems"?: boolean;
     }
     interface IntrinsicElements {
         "ic-card-horizontal": IcCardHorizontal;

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

@@ -1,10 +1,10 @@
 /**
  * To investigate:
- * IcColorRGBA works via @ukic/web-components but IcThemeForeground does not even though they are exported
+ * IcColorRGBA works via @ukic/web-components but IcBrandForeground does not even though they are exported
  * from @ukic/web-components in the same file. Why?
  */
 import { IcCallbackFunctionNoReturn, IcInformationStatusOrEmpty, IcNavParentDetails, IcPropObject, IcSearchMatchPositions, IcColorRGBA } from "@ukic/web-components";
-import { IcMenuOption, IcThemeForeground } from "./types";
+import { IcMenuOption, IcBrandForeground } from "./types";
 import { EventEmitter } from "../stencil-public-runtime";
 import { IcDataTableDataType } from "../interface";
 /**
@@ -48,9 +48,9 @@ export declare const removeHiddenInput: (container: HTMLElement) => void;
  * 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;
 /**
  * Will create a button within the lightDOM which interacts with the parent form.
  * This is required as buttons within the shadowDOM will not invoke a submit or reset
@@ -65,18 +65,18 @@ export declare const deviceSizeMatches: (size: number) => boolean;
 export declare const getCurrentDeviceSize: () => number;
 export declare const getCssProperty: (cssVar: string) => string;
 /**
- * Returns the brightness of the theme colour, calculated by using the theme RGB CSS values by:
+ * Returns the brightness of the brand colour, calculated by using the brand 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"
- * @returns number representing the brightness of the theme colour
+ * This is a similar calculation to its CSS counterpart: "--ic-brand-text-color"
+ * @returns number representing the brightness of the brand 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"
  */
-export declare const getThemeForegroundColor: () => IcThemeForeground;
+export declare const getBrandForegroundAppearance: () => IcBrandForeground;
 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;

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

@@ -12,15 +12,15 @@ 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 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 IcThemeMode = "dark" | "light" | "inherit";