@ukic/canary-web-components 3.0.0-canary.1 → 3.0.0-canary.10

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";
 /**
@@ -19,7 +19,7 @@ export declare const stringEnumToArray: (theEnum: Record<string, string | number
  * does not trigger a re-render.
  */
 export declare const inheritAttributes: (element: HTMLElement, attributes?: string[]) => {
-    [key: string]: unknown;
+    [key: string]: string;
 };
 export declare const debounceEvent: (event: EventEmitter, wait: number) => EventEmitter;
 export declare const debounce: (func: (...args: unknown[]) => void, wait?: number) => unknown;
@@ -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;
@@ -144,8 +144,11 @@ export declare const removeDisabledFalse: (disabled: boolean, element: HTMLEleme
 export declare const isMacDevice: () => boolean;
 export declare function waitForHydration(): Promise<boolean>;
 export declare const capitalize: (text: string) => string;
-export declare const checkSlotInChildMutations: (addedNodes: NodeList, removedNodes: NodeList, slotName: string) => boolean;
+export declare const checkSlotInChildMutations: (addedNodes: NodeList, removedNodes: NodeList, slotName: string | string[]) => boolean;
 export declare const addDataToPosition: (dataObject: IcDataTableDataType, newKeys: {
     key: string;
     index: number;
 }[], newValue: unknown) => IcDataTableDataType;
+export declare const isSlottedInGroup: (component: any) => 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

@@ -12,17 +12,18 @@ 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";
 export type IcAdditionalFieldTypes = "static" | "dynamic";
 export type IcColorRGB = {
     r: number;
@@ -60,19 +61,23 @@ export interface IcMenuOption {
 }
 export type IcSearchMatchPositions = "start" | "anywhere";
 export interface IcPaginationBarOptions {
+    alignment?: IcPaginationAlignmentOptions;
+    hideAllFromItemsPerPage?: boolean;
+    hideRangeLabel?: boolean;
+    itemLabel?: string;
     itemsPerPageOptions?: {
         label: string;
         value: string;
     }[];
+    monochrome?: boolean;
+    pageLabel?: string;
     rangeLabelType?: IcPaginationLabelTypes;
-    type?: IcPaginationTypes;
-    showItemsPerPageControl?: boolean;
+    selectedItemsPerPage?: number;
+    setToFirstPageOnPaginationChange?: boolean;
     showGoToPageControl?: boolean;
-    alignment?: IcPaginationAlignmentOptions;
-    appearance?: IcThemeForeground;
-    itemLabel?: string;
-    pageLabel?: string;
-    hideRangeLabel?: boolean;
+    showItemsPerPageControl?: boolean;
+    theme?: IcThemeMode;
+    type?: IcPaginationTypes;
 }
 export type IcCallbackFunctionNoReturn = (...args: unknown[]) => void;
 export type IcDateFormat = "DD/MM/YYYY" | "MM/DD/YYYY" | "YYYY/MM/DD";