@kaizen/components 1.5.1 → 1.6.3

package/dist/esm/chunk-7T4E5A7M.js

@@ -1,315 +0,0 @@
-// src/KaizenProvider/ThemeProvider/themes/heart.ts
-var heartTheme = {
-  themeKey: "heart",
-  animation: {
-    easingFunction: {
-      easeInOut: "cubic-bezier(0.455, 0.03, 0.515, 0.955)",
-      easeIn: "cubic-bezier(0.55, 0.085, 0.68, 0.53)",
-      easeOut: "cubic-bezier(0.25, 0.46, 0.45, 0.94)",
-      linear: "linear",
-      bounceIn: "cubic-bezier(0.485, 0.155, 0.24, 1.245)",
-      bounceOut: "cubic-bezier(0.485, 0.155, 0.515, 0.845)",
-      bounceInOut: "cubic-bezier(0.76, -0.245, 0.24, 1.245)"
-    },
-    duration: {
-      instant: "0ms",
-      immediate: "100ms",
-      rapid: "200ms",
-      fast: "300ms",
-      slow: "400ms",
-      deliberate: "700ms"
-    }
-  },
-  border: {
-    solid: {
-      borderWidth: "2px",
-      borderRadius: "7px",
-      borderStyle: "solid",
-      borderColor: "#e1e2ea"
-    },
-    dashed: {
-      borderWidth: "2px",
-      borderRadius: "7px",
-      borderStyle: "dashed"
-    },
-    borderless: {
-      borderWidth: "2px",
-      borderRadius: "7px",
-      borderStyle: "solid",
-      borderColor: "transparent"
-    },
-    focusRing: {
-      borderWidth: "2px",
-      borderRadius: "10px",
-      borderStyle: "solid"
-    }
-  },
-  color: {
-    purple: {
-      100: "#f4edf8",
-      200: "#dfc9ea",
-      300: "#c9a5dd",
-      400: "#ae67b1",
-      500: "#844587",
-      600: "#5f3361",
-      700: "#4a234d",
-      800: "#2f2438"
-    },
-    blue: {
-      100: "#e6f6ff",
-      200: "#bde2f5",
-      300: "#73c0e8",
-      400: "#008bd6",
-      500: "#0168b3",
-      600: "#004970",
-      700: "#003157"
-    },
-    green: {
-      100: "#e8f8f4",
-      200: "#c4ede2",
-      300: "#8fdbc7",
-      400: "#5dcbad",
-      500: "#44a289",
-      600: "#2c7d67",
-      700: "#22594a"
-    },
-    yellow: {
-      100: "#fff9e4",
-      200: "#ffeeb3",
-      300: "#ffe36e",
-      400: "#ffca4d",
-      500: "#ffb600",
-      600: "#c68600",
-      700: "#876400"
-    },
-    red: {
-      100: "#fdeaee",
-      200: "#f9c2cb",
-      300: "#f597a8",
-      400: "#e0707d",
-      500: "#c93b55",
-      600: "#a82433",
-      700: "#6c1e20"
-    },
-    orange: {
-      100: "#fff0e8",
-      200: "#ffd1b9",
-      300: "#ffb08a",
-      400: "#ff9461",
-      500: "#e96c2f",
-      600: "#b74302",
-      700: "#903c00"
-    },
-    gray: {
-      100: "#f9f9f9",
-      200: "#f4f4f5",
-      300: "#eaeaec",
-      400: "#cdcdd0",
-      500: "#8c8c97",
-      600: "#524e56"
-    },
-    white: "#ffffff"
-  },
-  dataViz: {
-    favorable: "#7dd5bd",
-    unfavorable: "#e68d97"
-  },
-  layout: {
-    contentMaxWidth: "1392px",
-    contentMaxWidthWithSidebar: "1080px",
-    contentSideMargin: "72px",
-    mobileActionsDrawerHeight: "60px",
-    navigationBarHeight: "72px",
-    breakpoints: {
-      medium: "768px",
-      large: "1080px"
-    }
-  },
-  shadow: {
-    small: {
-      boxShadow: "0px 3px 16px rgba(0, 0, 0, 0.06), 0px 1px 3px rgba(0, 0, 0, 0.1)"
-    },
-    large: {
-      boxShadow: "0px 8px 40px rgba(0, 0, 0, 0.08), 0px 3px 9px rgba(0, 0, 0, 0.1)"
-    }
-  },
-  spacing: {
-    xs: "0.375rem",
-    sm: "0.75rem",
-    md: "1.5rem",
-    lg: "2.25rem",
-    xl: "3rem",
-    xxl: "3.75rem",
-    xxxl: "4.5rem",
-    xxxxl: "5.25rem",
-    xxxxxl: "6rem",
-    0: "0",
-    1: ".0625rem",
-    2: ".125rem",
-    4: ".25rem",
-    6: ".375rem",
-    8: ".5rem",
-    12: ".75rem",
-    16: "1rem",
-    24: "1.5rem",
-    32: "2rem",
-    40: "2.5rem",
-    48: "3rem",
-    56: "3.5rem",
-    64: "4rem",
-    72: "4.5rem",
-    80: "5rem",
-    96: "6rem",
-    112: "7rem",
-    128: "8rem",
-    160: "10rem",
-    200: "12.5rem",
-    240: "15rem",
-    280: "17.5rem",
-    320: "20rem"
-  },
-  typography: {
-    dataLarge: {
-      fontFamily: '"Inter", "Noto Sans", Helvetica, Arial, sans-serif',
-      fontWeight: 700,
-      fontSize: "5.25rem",
-      lineHeight: "5.25rem",
-      letterSpacing: "normal"
-    },
-    dataLargeUnits: {
-      fontFamily: '"Inter", "Noto Sans", Helvetica, Arial, sans-serif',
-      fontWeight: 700,
-      fontSize: "2.625rem",
-      lineHeight: "5.25rem",
-      letterSpacing: "normal"
-    },
-    dataMedium: {
-      fontFamily: '"Inter", "Noto Sans", Helvetica, Arial, sans-serif',
-      fontWeight: 700,
-      fontSize: "3rem",
-      lineHeight: "5rem",
-      letterSpacing: "normal"
-    },
-    dataMediumUnits: {
-      fontFamily: '"Inter", "Noto Sans", Helvetica, Arial, sans-serif',
-      fontWeight: 700,
-      fontSize: "1.5rem",
-      lineHeight: "5rem",
-      letterSpacing: "normal"
-    },
-    dataSmall: {
-      fontFamily: '"Inter", "Noto Sans", Helvetica, Arial, sans-serif',
-      fontWeight: 700,
-      fontSize: "1.5rem",
-      lineHeight: "1.5rem",
-      letterSpacing: "normal"
-    },
-    dataSmallUnits: {
-      fontFamily: '"Inter", "Noto Sans", Helvetica, Arial, sans-serif',
-      fontWeight: 700,
-      fontSize: "1.125rem",
-      lineHeight: "1.5rem",
-      letterSpacing: "normal"
-    },
-    display0: {
-      fontFamily: '"Tiempos Headline", Georgia, serif',
-      fontWeight: 800,
-      fontSize: "4.5rem",
-      lineHeight: "5.25rem",
-      letterSpacing: "0em"
-    },
-    heading1: {
-      fontFamily: '"Inter", "Noto Sans", Helvetica, Arial, sans-serif',
-      fontWeight: 700,
-      fontSize: "2.125rem",
-      lineHeight: "2.625rem",
-      letterSpacing: "normal"
-    },
-    heading2: {
-      fontFamily: '"Inter", "Noto Sans", Helvetica, Arial, sans-serif',
-      fontWeight: 700,
-      fontSize: "1.75rem",
-      lineHeight: "2.25rem",
-      letterSpacing: "normal"
-    },
-    heading3: {
-      fontFamily: '"Inter", "Noto Sans", Helvetica, Arial, sans-serif',
-      fontWeight: 700,
-      fontSize: "1.375rem",
-      lineHeight: "1.875rem",
-      letterSpacing: "normal"
-    },
-    heading4: {
-      fontFamily: '"Inter", "Noto Sans", Helvetica, Arial, sans-serif',
-      fontWeight: 600,
-      fontSize: "1.125rem",
-      lineHeight: "1.5rem",
-      letterSpacing: "normal"
-    },
-    heading5: {
-      fontFamily: '"Inter", "Noto Sans", Helvetica, Arial, sans-serif',
-      fontWeight: 600,
-      fontSize: "1rem",
-      lineHeight: "1.5rem",
-      letterSpacing: "normal"
-    },
-    heading6: {
-      fontFamily: '"Inter", "Noto Sans", Helvetica, Arial, sans-serif',
-      fontWeight: 700,
-      fontSize: "0.875rem",
-      lineHeight: "1.5rem",
-      letterSpacing: "normal"
-    },
-    paragraphIntroLede: {
-      fontFamily: '"Inter", "Noto Sans", Helvetica, Arial, sans-serif',
-      fontWeight: 400,
-      fontSize: "1.25rem",
-      lineHeight: "1.875rem",
-      letterSpacing: "0"
-    },
-    paragraphBody: {
-      fontFamily: '"Inter", "Noto Sans", Helvetica, Arial, sans-serif',
-      fontWeight: 400,
-      fontSize: "1rem",
-      lineHeight: "1.5rem",
-      letterSpacing: "normal"
-    },
-    paragraphSmall: {
-      fontFamily: '"Inter", "Noto Sans", Helvetica, Arial, sans-serif',
-      fontWeight: 400,
-      fontSize: "0.875rem",
-      lineHeight: "1.125rem",
-      letterSpacing: "normal"
-    },
-    paragraphExtraSmall: {
-      fontFamily: '"Inter", "Noto Sans", Helvetica, Arial, sans-serif',
-      fontWeight: 400,
-      fontSize: "0.75rem",
-      lineHeight: "1.125rem",
-      letterSpacing: "normal"
-    },
-    paragraphBold: {
-      fontWeight: 600
-    },
-    buttonPrimary: {
-      fontFamily: '"Inter", "Noto Sans", Helvetica, Arial, sans-serif',
-      fontWeight: 700,
-      fontSize: "1.125rem",
-      lineHeight: "1.5rem",
-      letterSpacing: "normal"
-    },
-    buttonSecondary: {
-      fontFamily: '"Inter", "Noto Sans", Helvetica, Arial, sans-serif',
-      fontWeight: 500,
-      fontSize: "1rem",
-      lineHeight: "1.5rem",
-      letterSpacing: "normal"
-    }
-  }
-};
-var heart_default = heartTheme;
-
-export {
-  heartTheme,
-  heart_default
-};

package/dist/esm/chunk-7ZAJ7755.js

@@ -1,15 +0,0 @@
-import {
-  ThemeProvider
-} from "./chunk-MXW3YHBE.js";
-
-// src/KaizenProvider/KaizenProvider.tsx
-import React from "react";
-var KaizenProvider = ({
-  children,
-  themeManager
-}) => /* @__PURE__ */ React.createElement(ThemeProvider, { themeManager }, children);
-KaizenProvider.displayName = "KaizenProvider";
-
-export {
-  KaizenProvider
-};

package/dist/esm/chunk-DR7ZJ6Z3.js

@@ -1,38 +0,0 @@
-import {
-  isRefObject
-} from "./chunk-3VEH3HNR.js";
-import {
-  FilterButtonBase
-} from "./chunk-SBUK4XZM.js";
-
-// src/FilterButton/FilterButton/FilterButton.tsx
-import React, { forwardRef } from "react";
-import classnames from "classnames";
-import { Icon } from "@kaizen/component-library";
-import chevronDown from "@kaizen/component-library/icons/chevron-down.icon.svg";
-import chevronUp from "@kaizen/component-library/icons/chevron-up.icon.svg";
-import styles from "./FilterButton.module-HA7A5HIZ.scss";
-var FilterButton = forwardRef(
-  ({ label, selectedValue, isOpen = false, classNameOverride, ...restProps }, ref) => {
-    const customRefObject = isRefObject(ref) ? ref.current : null;
-    const triggerRef = customRefObject == null ? void 0 : customRefObject.triggerRef;
-    const selectedValuesLabel = selectedValue;
-    return /* @__PURE__ */ React.createElement(
-      FilterButtonBase,
-      {
-        ref: triggerRef,
-        classNameOverride: classnames(styles.filterButton, classNameOverride),
-        "aria-haspopup": "true",
-        "aria-expanded": isOpen,
-        ...restProps
-      },
-      /* @__PURE__ */ React.createElement("span", { className: styles.labelContainer }, selectedValuesLabel ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("span", { className: styles.hasSelectedValues }, /* @__PURE__ */ React.createElement("span", null, label), /* @__PURE__ */ React.createElement("span", { className: styles.labelSeparator }, ":")), /* @__PURE__ */ React.createElement("span", null, selectedValuesLabel)) : label),
-      /* @__PURE__ */ React.createElement(Icon, { icon: isOpen ? chevronUp : chevronDown, role: "presentation" })
-    );
-  }
-);
-FilterButton.displayName = "FilterButton";
-
-export {
-  FilterButton
-};

package/dist/esm/chunk-GOA67MI6.js

@@ -1,8 +0,0 @@
-// src/__future__/ExampleComponent/ExampleComponent.tsx
-import React from "react";
-import styles from "./ExampleComponent.module-4G6FO336.scss";
-var ExampleComponent = () => /* @__PURE__ */ React.createElement("div", { className: `${styles.exampleComponent} bg-green-300` }, "ExampleComponent FUTURE");
-
-export {
-  ExampleComponent
-};

package/dist/esm/chunk-GTXIOS6D.js

@@ -1,51 +0,0 @@
-import {
-  FilterButtonBase
-} from "./chunk-SBUK4XZM.js";
-
-// src/ButtonGroup/ButtonGroup.tsx
-import React from "react";
-import classnames from "classnames";
-import { Tooltip } from "@kaizen/draft-tooltip";
-import styles from "./ButtonGroup.module-NQDV3763.scss";
-var isFilterButton = (node) => React.isValidElement(node) && node.type === FilterButtonBase;
-var ButtonGroup = ({
-  children,
-  classNameOverride,
-  ...restProps
-}) => {
-  const childCount = React.Children.count(children);
-  const containerProps = {
-    role: "group",
-    className: classnames(styles.buttonGroup, classNameOverride),
-    ...restProps
-  };
-  if (childCount === 1)
-    return /* @__PURE__ */ React.createElement("div", { ...containerProps }, children);
-  return /* @__PURE__ */ React.createElement("div", { ...containerProps }, React.Children.map(children, (child, index) => {
-    const buttonClassNames = classnames(
-      styles.child,
-      index === 0 && styles.firstChild,
-      index === childCount - 1 && styles.lastChild,
-      child.props.classNameOverride
-    );
-    if (child.type === Tooltip) {
-      const button = child.props.children;
-      if (isFilterButton(button)) {
-        return React.cloneElement(child, {
-          children: React.cloneElement(button, {
-            classNameOverride: buttonClassNames
-          })
-        });
-      }
-      return child;
-    }
-    return React.cloneElement(child, {
-      classNameOverride: buttonClassNames
-    });
-  }));
-};
-ButtonGroup.displayName = "ButtonGroup";
-
-export {
-  ButtonGroup
-};

package/dist/esm/chunk-J42JQYBY.js

@@ -1,57 +0,0 @@
-// src/KaizenProvider/ThemeProvider/ThemeManager.ts
-import {
-  makeCssVariableDefinitionsMap
-} from "@kaizen/design-tokens";
-var ThemeManager = class {
-  constructor(theme, rootElementId = "", apply = true) {
-    this.themeChangeListeners = [];
-    this.rootElement = null;
-    this.getRootElement = () => this.rootElement;
-    this.getRootElementId = () => this.rootElementId;
-    this.getCurrentTheme = () => this.theme;
-    this.setRootElement = (element) => {
-      this.rootElement = element;
-    };
-    this.setRootElementId = (rootElementId) => this.rootElementId = rootElementId;
-    this.setAndApplyTheme = (theme, force) => {
-      if (!force) {
-        if (this.theme === theme)
-          return;
-      }
-      this.theme = theme;
-      this.applyCurrentTheme();
-      this.notifyThemeChangeListeners(theme);
-    };
-    this.addThemeChangeListener = (listener) => {
-      this.themeChangeListeners.push(listener);
-    };
-    this.removeThemeChangeListener = (listener) => {
-      this.themeChangeListeners = this.themeChangeListeners.filter(
-        (l) => l !== listener
-      );
-    };
-    this.applyCurrentTheme = () => {
-      if (typeof window !== "undefined") {
-        this.setRootElement(
-          document.getElementById(this.rootElementId) ?? document.documentElement
-        );
-        const cssVariableDefinitions = makeCssVariableDefinitionsMap(this.theme);
-        Object.entries(cssVariableDefinitions).forEach(([key, value]) => {
-          var _a;
-          (_a = this.rootElement) == null ? void 0 : _a.style.setProperty(key, value);
-        });
-      }
-    };
-    this.notifyThemeChangeListeners = (theme) => {
-      this.themeChangeListeners.forEach((listener) => listener(theme));
-    };
-    this.theme = theme;
-    this.rootElementId = rootElementId;
-    if (apply)
-      this.applyCurrentTheme();
-  }
-};
-
-export {
-  ThemeManager
-};

package/dist/esm/chunk-J5NCLDC5.js

@@ -1,55 +0,0 @@
-import {
-  FilterPopover
-} from "./chunk-TGN3Y4NF.js";
-
-// src/Filter/Filter.tsx
-import React, { useEffect, useRef, useState } from "react";
-import { FocusOn } from "react-focus-on";
-var Filter = ({
-  children,
-  isOpen,
-  setIsOpen,
-  renderTrigger,
-  classNameOverride,
-  ...restProps
-}) => {
-  var _a, _b, _c, _d;
-  const [isRefLoaded, setIsRefLoaded] = useState(false);
-  const trigger = renderTrigger({
-    onClick: () => setIsOpen(!isOpen),
-    isOpen
-  });
-  const inbuiltButtonRef = useRef(null);
-  const inbuiltRef = useRef({
-    triggerRef: inbuiltButtonRef
-  });
-  const filterButtonRef = trigger.ref ?? inbuiltRef;
-  useEffect(() => {
-    var _a2, _b2;
-    if ((_b2 = (_a2 = filterButtonRef.current) == null ? void 0 : _a2.triggerRef) == null ? void 0 : _b2.current) {
-      setIsRefLoaded(true);
-    }
-  }, [(_b = (_a = filterButtonRef.current) == null ? void 0 : _a.triggerRef) == null ? void 0 : _b.current]);
-  return /* @__PURE__ */ React.createElement("div", { className: classNameOverride, ...restProps }, React.cloneElement(trigger, {
-    ref: filterButtonRef
-  }), isRefLoaded && isOpen && /* @__PURE__ */ React.createElement(
-    FocusOn,
-    {
-      scrollLock: false,
-      onClickOutside: () => setIsOpen(false),
-      onEscapeKey: () => setIsOpen(false)
-    },
-    /* @__PURE__ */ React.createElement(
-      FilterPopover,
-      {
-        referenceElement: ((_d = (_c = filterButtonRef.current) == null ? void 0 : _c.triggerRef) == null ? void 0 : _d.current) || null
-      },
-      children
-    )
-  ));
-};
-Filter.displayName = "Filter";
-
-export {
-  Filter
-};

package/dist/esm/chunk-MXW3YHBE.js

@@ -1,91 +0,0 @@
-import {
-  defaultTheme
-} from "./chunk-WDAFEOSV.js";
-import {
-  ThemeManager
-} from "./chunk-J42JQYBY.js";
-
-// src/KaizenProvider/ThemeProvider/ThemeProvider.tsx
-import React, {
-  createContext,
-  useContext,
-  useEffect,
-  useState
-} from "react";
-var ThemeContext = createContext(defaultTheme);
-var ThemeProvider = ({
-  themeManager,
-  ...props
-}) => {
-  const [themeManagerInstance] = useState(
-    () => themeManager || new ThemeManager(defaultTheme)
-  );
-  const [theme, setTheme] = useState(
-    themeManagerInstance.getCurrentTheme()
-  );
-  useEffect(() => {
-    let cancelled = false;
-    const listener = (newTheme) => {
-      if (!cancelled)
-        setTheme(newTheme);
-    };
-    themeManagerInstance.addThemeChangeListener(listener);
-    return () => {
-      cancelled = true;
-      themeManagerInstance.removeThemeChangeListener(listener);
-    };
-  }, []);
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(ThemeContext.Provider, { value: theme }, props.children), /* @__PURE__ */ React.createElement(
-    "link",
-    {
-      rel: "preload",
-      href: "https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-bold.woff2",
-      as: "font",
-      type: "font/woff2",
-      crossOrigin: "anonymous"
-    }
-  ), /* @__PURE__ */ React.createElement(
-    "link",
-    {
-      rel: "preload",
-      href: "https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-demi-bold.woff2",
-      as: "font",
-      type: "font/woff2",
-      crossOrigin: "anonymous"
-    }
-  ), /* @__PURE__ */ React.createElement(
-    "link",
-    {
-      rel: "preload",
-      href: "https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-medium.woff2",
-      as: "font",
-      type: "font/woff2",
-      crossOrigin: "anonymous"
-    }
-  ), /* @__PURE__ */ React.createElement(
-    "link",
-    {
-      rel: "preload",
-      href: "https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-regular.woff2",
-      as: "font",
-      type: "font/woff2",
-      crossOrigin: "anonymous"
-    }
-  ), /* @__PURE__ */ React.createElement(
-    "link",
-    {
-      rel: "preload",
-      href: "https://d1e7r7b0lb8p4d.cloudfront.net/fonts/tiempos/tiempos-headline-bold.woff2",
-      as: "font",
-      type: "font/woff2",
-      crossOrigin: "anonymous"
-    }
-  ));
-};
-var useTheme = () => useContext(ThemeContext);
-
-export {
-  ThemeContext,
-  ThemeProvider,
-  useTheme
-};

package/dist/esm/chunk-SBUK4XZM.js

@@ -1,18 +0,0 @@
-// src/FilterButton/components/FilterButtonBase/FilterButtonBase.tsx
-import React, { forwardRef } from "react";
-import classNames from "classnames";
-import styles from "./FilterButtonBase.module-KNRAMYSJ.scss";
-var FilterButtonBase = forwardRef(({ children, classNameOverride, ...restProps }, ref) => /* @__PURE__ */ React.createElement(
-  "button",
-  {
-    ref,
-    className: classNames(styles.filterButtonBase, classNameOverride),
-    ...restProps
-  },
-  children
-));
-FilterButtonBase.displayName = "FilterButtonBase";
-
-export {
-  FilterButtonBase
-};