@kaizen/components 1.28.0 → 1.30.0

package/dist/esm/KaizenProvider/ThemeProvider/themes/index.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.mjs","sources":["../../../../../src/KaizenProvider/ThemeProvider/themes/index.ts"],"sourcesContent":["export * from \"./heart\"\nexport * from \"./types\"\n\nimport { heartTheme } from \"./heart\"\nexport const defaultTheme = heartTheme\n"],"names":["defaultTheme","heartTheme"],"mappings":";AAIO,IAAMA,YAAY,GAAGC,UAAA;"}

package/dist/esm/__future__/Tag/Tag.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"Tag.mjs","sources":["../../../../src/__future__/Tag/Tag.tsx"],"sourcesContent":["import React, { ReactNode, HTMLAttributes } from \"react\"\nimport classNames from \"classnames\"\nimport { OverrideClassName } from \"~types/OverrideClassName\"\nimport { TagColors } from \"./types\"\nimport styles from \"./Tag.module.scss\"\n\nexport type TagProps = {\n  children: ReactNode\n  color?: TagColors\n  icon?: React.ReactElement\n} & OverrideClassName<HTMLAttributes<HTMLSpanElement>>\n\nexport const Tag = ({\n  children,\n  classNameOverride,\n  icon,\n  color = \"gray\",\n}: TagProps): JSX.Element => (\n  <span className={classNames(styles.tag, styles[color], classNameOverride)}>\n    {icon && <span className={styles.iconContainer}>{icon}</span>}\n    {children}\n  </span>\n)\n\nTag.displayName = \"Tag\"\n"],"names":["Tag","_a","children","classNameOverride","icon","_b","color","React","createElement","className","classNames","styles","tag","iconContainer","displayName"],"mappings":";;;MAYaA,GAAG;EAAA,MAAHA,GAAG,GAAG,SAAAA,CAACC,EAKT,EAAA;IAJT,IAAAC,QAAQ,GAAAD,EAAA,CAAAC,QAAA;MACRC,iBAAiB,GAAAF,EAAA,CAAAE,iBAAA;MACjBC,IAAI,GAAAH,EAAA,CAAAG,IAAA;MACJC,EAAc,GAAAJ,EAAA,CAAAK,KAAA;MAAdA,KAAK,GAAAD,EAAA,KAAA,KAAA,CAAA,GAAG,MAAM,GAAAA,EAAA;IACa,oBAC3BE,KAAM,CAAAC,aAAA,CAAA,MAAA,EAAA;MAAAC,SAAS,EAAEC,UAAU,CAACC,MAAM,CAACC,GAAG,EAAED,MAAM,CAACL,KAAK,CAAC,EAAEH,iBAAiB;IAAC,CAAA,EACtEC,IAAI,iBAAIG;MAAME,SAAS,EAAEE,MAAM,CAACE;IAAgB,CAAA,EAAAT,IAAI,CAAQ,EAC5DF,QAAQ,CACJ;EAJoB,CAK5B;EAEDF,GAAG,CAACc,WAAW,GAAG,KAAK;EAAA,OAZVd,GAAG;AAAA;"}

package/dist/esm/__future__/Tag/Tag.module.scss.mjs

@@ -1,13 +0,0 @@
-var styles = {
-  "tag": "Tag-module_tag__tuT2O",
-  "iconContainer": "Tag-module_iconContainer__OmQRU",
-  "gray": "Tag-module_gray__VqJ2M",
-  "blue": "Tag-module_blue__u3vnu",
-  "green": "Tag-module_green__7bcu7",
-  "yellow": "Tag-module_yellow__Br-2V",
-  "orange": "Tag-module_orange__LdmPX",
-  "red": "Tag-module_red__VB5dE",
-  "purple": "Tag-module_purple__A3Uy5"
-};
-export { styles as default };
-//# sourceMappingURL=Tag.module.scss.mjs.map

package/dist/esm/dts/KaizenProvider/ThemeProvider/ThemeProvider.d.ts

@@ -1,14 +0,0 @@
-import React from "react";
-import { Theme as BaseTheme } from "./themes";
-type ThemeContextValue<Theme extends BaseTheme = any> = Theme;
-export declare const ThemeContext: React.Context<any>;
-/**
- * Wrap your application in this provider using a ThemeManager, to synchronise it with a react context.
- * This allows child react elements to more easily use theme variables, using the {@link useTheme} hook.
- */
-export declare const ThemeProvider: <Theme extends BaseTheme = BaseTheme>({ theme: userTheme, ...props }: {
-    theme?: Theme | undefined;
-    children: React.ReactNode;
-}) => JSX.Element;
-export declare const useTheme: <Theme extends BaseTheme = BaseTheme>() => Theme;
-export {};

package/dist/esm/dts/KaizenProvider/ThemeProvider/index.d.ts

@@ -1,2 +0,0 @@
-export * from "./ThemeProvider";
-export * from "./themes";

package/dist/esm/dts/KaizenProvider/ThemeProvider/themes/heart.d.ts

@@ -1,2 +0,0 @@
-import { Theme } from "./types";
-export declare const heartTheme: Theme;

package/dist/esm/dts/KaizenProvider/ThemeProvider/themes/index.d.ts

@@ -1,3 +0,0 @@
-export * from "./heart";
-export * from "./types";
-export declare const defaultTheme: import("./types").Theme;

package/dist/esm/dts/KaizenProvider/ThemeProvider/themes/types.d.ts

@@ -1,229 +0,0 @@
-import type { CSSProperties as ReactCSSProperties } from "react";
-/**
- * Use a custom type for CSS properties becauase we should eventually write a more strongly typed version using template literal types.
- * This could definitely be contributed back to the community too. An example starting point here https://github.com/ghoullier/awesome-template-literal-types#css-parser
- * For example:
- * ```ts
- * type Font = {
- *   fontSize: `${number}rem`,
- *
- *  }
- * type HexDigit = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | A | B | C | D | E | F ;
- * type Color = `rgba(${number}, ${number}, ${number}, ${number}) | #${HexDigit}${HexDigit}${HexDigit}` // You get the point
- *
- * ```
- * */
-type KaizenCSSProperties = ReactCSSProperties;
-type Hex = string;
-export type TypographyFont = {
-    fontFamily: KaizenCSSProperties["fontFamily"];
-    fontWeight: KaizenCSSProperties["fontWeight"];
-    fontSize: KaizenCSSProperties["fontSize"];
-    lineHeight: KaizenCSSProperties["lineHeight"];
-    letterSpacing: KaizenCSSProperties["letterSpacing"];
-};
-export type ThemeKey = "heart" | "custom";
-export type Theme = {
-    themeKey: ThemeKey;
-    border: {
-        solid: {
-            borderWidth: KaizenCSSProperties["borderWidth"];
-            borderRadius: KaizenCSSProperties["borderRadius"];
-            borderStyle: KaizenCSSProperties["borderStyle"];
-            borderColor: KaizenCSSProperties["borderColor"];
-        };
-        dashed: {
-            borderWidth: KaizenCSSProperties["borderWidth"];
-            borderRadius: KaizenCSSProperties["borderRadius"];
-            borderStyle: KaizenCSSProperties["borderStyle"];
-        };
-        borderless: {
-            borderWidth: KaizenCSSProperties["borderWidth"];
-            borderRadius: KaizenCSSProperties["borderRadius"];
-            borderStyle: KaizenCSSProperties["borderStyle"];
-            borderColor: KaizenCSSProperties["borderColor"];
-        };
-        focusRing: {
-            borderWidth: KaizenCSSProperties["borderWidth"];
-            borderRadius: KaizenCSSProperties["borderRadius"];
-            borderStyle: KaizenCSSProperties["borderStyle"];
-        };
-    };
-    animation: {
-        easingFunction: {
-            easeInOut: string;
-            easeIn: string;
-            easeOut: string;
-            linear: string;
-            bounceIn: string;
-            bounceOut: string;
-            bounceInOut: string;
-        };
-        duration: {
-            instant: string;
-            immediate: string;
-            rapid: string;
-            fast: string;
-            slow: string;
-            deliberate: string;
-        };
-    };
-    color: {
-        purple: {
-            "100": Hex;
-            "200": Hex;
-            "300": Hex;
-            "400": Hex;
-            "500": Hex;
-            "600": Hex;
-            "700": Hex;
-            "800": Hex;
-        };
-        blue: {
-            "100": Hex;
-            "200": Hex;
-            "300": Hex;
-            "400": Hex;
-            "500": Hex;
-            "600": Hex;
-            "700": Hex;
-        };
-        green: {
-            "100": Hex;
-            "200": Hex;
-            "300": Hex;
-            "400": Hex;
-            "500": Hex;
-            "600": Hex;
-            "700": Hex;
-        };
-        yellow: {
-            "100": Hex;
-            "200": Hex;
-            "300": Hex;
-            "400": Hex;
-            "500": Hex;
-            "600": Hex;
-            "700": Hex;
-        };
-        red: {
-            "100": Hex;
-            "200": Hex;
-            "300": Hex;
-            "400": Hex;
-            "500": Hex;
-            "600": Hex;
-            "700": Hex;
-        };
-        orange: {
-            "100": Hex;
-            "200": Hex;
-            "300": Hex;
-            "400": Hex;
-            "500": Hex;
-            "600": Hex;
-            "700": Hex;
-        };
-        gray: {
-            "100": Hex;
-            "200": Hex;
-            "300": Hex;
-            "400": Hex;
-            "500": Hex;
-            "600": Hex;
-        };
-        white: Hex;
-    };
-    dataViz: {
-        favorable: Hex;
-        unfavorable: Hex;
-    };
-    layout: {
-        contentMaxWidth: string;
-        contentMaxWidthWithSidebar: string;
-        contentSideMargin: string;
-        mobileActionsDrawerHeight: string;
-        navigationBarHeight: string;
-        breakpoints: {
-            medium: string;
-            large: string;
-        };
-    };
-    shadow: {
-        small: {
-            boxShadow: string;
-        };
-        large: {
-            boxShadow: string;
-        };
-    };
-    spacing: {
-        xs: string;
-        sm: string;
-        md: string;
-        lg: string;
-        xl: string;
-        xxl: string;
-        xxxl: string;
-        xxxxl: string;
-        xxxxxl: string;
-        0: string;
-        1: string;
-        2: string;
-        4: string;
-        6: string;
-        8: string;
-        12: string;
-        16: string;
-        24: string;
-        32: string;
-        40: string;
-        48: string;
-        56: string;
-        64: string;
-        72: string;
-        80: string;
-        96: string;
-        112: string;
-        128: string;
-        160: string;
-        200: string;
-        240: string;
-        280: string;
-        320: string;
-    };
-    typography: {
-        dataLarge: TypographyFont;
-        dataLargeUnits: TypographyFont;
-        dataMedium: TypographyFont;
-        dataMediumUnits: TypographyFont;
-        dataSmall: TypographyFont;
-        dataSmallUnits: TypographyFont;
-        display0: TypographyFont;
-        heading1: TypographyFont;
-        heading2: TypographyFont;
-        heading3: TypographyFont;
-        heading4: TypographyFont;
-        heading5: TypographyFont;
-        heading6: TypographyFont;
-        paragraphIntroLede: TypographyFont;
-        paragraphBody: TypographyFont;
-        paragraphSmall: TypographyFont;
-        paragraphExtraSmall: TypographyFont;
-        paragraphBold: {
-            fontWeight: KaizenCSSProperties["fontWeight"];
-        };
-        buttonPrimary: TypographyFont;
-        buttonSecondary: TypographyFont;
-    };
-};
-export type DeepMapObjectLeafs<T, LeafType> = T extends string | number | bigint | boolean | symbol | null | undefined | ((...params: any[]) => any) ? LeafType : T extends Record<any, any> ? {
-    [Key in keyof T]: DeepMapObjectLeafs<T[Key], LeafType>;
-} : T;
-/**
- * Apologies for the complex types.
- * This type represents the Theme type but with every leaf value in the tree mapped strictly to a string, rather than a number or a more complex type such as a string union.
- * The reason for this is to have a more accurate type for the generated hierarchy of design tokens which are represented as CSS custom properties, e.g. `var(--color-purple-800)`.
- */
-export type CSSVariableTheme = DeepMapObjectLeafs<Theme, string>;
-export {};