@hitachivantara/uikit-react-core 5.60.0 → 5.62.0

package/dist/esm/hooks/useControlled.js.map

@@ -1 +1 @@
-{"version":3,"file":"useControlled.js","sources":["../../../src/hooks/useControlled.ts"],"sourcesContent":["// based in https://raw.githubusercontent.com/mui-org/material-ui/next/packages/material-ui/src/utils/useControlled.js\n// modifications:\n// 1. renamed default to initialState, to convey the same meaning of the useState hook.\n// 2. removed the console error when initialState changes; that is acceptable and just ignored, like in useState.\n// 3. the console error regarding switching from controlled to uncontrolled (or vice-versa) is sent synchronously\n//    so the stacktrace shows the caller\n// 4. given that, the hook signature was simplified, no need for metadata\n\nimport { useRef, useState, useCallback, SetStateAction } from \"react\";\n\nexport const useControlled = (controlledProp: any, initialState: any) => {\n  const { current: isControlled } = useRef(controlledProp !== undefined);\n  const [valueState, setValue] = useState(initialState);\n  const value = isControlled ? controlledProp : valueState;\n\n  if (import.meta.env.DEV && isControlled !== (controlledProp !== undefined)) {\n    // eslint-disable-next-line no-console\n    console.error(\n      [\n        `A component is changing the ${\n          isControlled ? \"\" : \"un\"\n        }controlled state to be ${isControlled ? \"un\" : \"\"}controlled.`,\n        \"Elements should not switch from uncontrolled to controlled (or vice versa).\",\n        \"Decide between using a controlled or uncontrolled element for the lifetime of the component.\",\n        \"The nature of the state is determined during the first render, it's considered controlled if the value is not `undefined`.\",\n      ].join(\"\\n\")\n    );\n  }\n\n  const setValueIfUncontrolled = useCallback(\n    (newValue: SetStateAction<any>) => {\n      if (!isControlled) {\n        setValue(newValue);\n      }\n    },\n    [isControlled]\n  );\n\n  return [value, setValueIfUncontrolled];\n};\n"],"names":[],"mappings":";AAUa,MAAA,gBAAgB,CAAC,gBAAqB,iBAAsB;AACvE,QAAM,EAAE,SAAS,aAAiB,IAAA,OAAO,mBAAmB,MAAS;AACrE,QAAM,CAAC,YAAY,QAAQ,IAAI,SAAS,YAAY;AAC9C,QAAA,QAAQ,eAAe,iBAAiB;AAgB9C,QAAM,yBAAyB;AAAA,IAC7B,CAAC,aAAkC;AACjC,UAAI,CAAC,cAAc;AACjB,iBAAS,QAAQ;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,YAAY;AAAA,EAAA;AAGR,SAAA,CAAC,OAAO,sBAAsB;AACvC;"}
+{"version":3,"file":"useControlled.js","sources":["../../../src/hooks/useControlled.ts"],"sourcesContent":["// based in https://raw.githubusercontent.com/mui-org/material-ui/next/packages/material-ui/src/utils/useControlled.js\n// modifications:\n// 1. renamed default to initialState, to convey the same meaning of the useState hook.\n// 2. removed the console error when initialState changes; that is acceptable and just ignored, like in useState.\n// 3. the console error regarding switching from controlled to uncontrolled (or vice-versa) is sent synchronously\n//    so the stacktrace shows the caller\n// 4. given that, the hook signature was simplified, no need for metadata\n\nimport { SetStateAction, useCallback, useRef, useState } from \"react\";\n\nexport const useControlled = (controlledProp: any, initialState: any) => {\n  const { current: isControlled } = useRef(controlledProp !== undefined);\n  const [valueState, setValue] = useState(initialState);\n  const value = isControlled ? controlledProp : valueState;\n\n  if (import.meta.env.DEV && isControlled !== (controlledProp !== undefined)) {\n    // eslint-disable-next-line no-console\n    console.error(\n      [\n        `A component is changing the ${\n          isControlled ? \"\" : \"un\"\n        }controlled state to be ${isControlled ? \"un\" : \"\"}controlled.`,\n        \"Elements should not switch from uncontrolled to controlled (or vice versa).\",\n        \"Decide between using a controlled or uncontrolled element for the lifetime of the component.\",\n        \"The nature of the state is determined during the first render, it's considered controlled if the value is not `undefined`.\",\n      ].join(\"\\n\"),\n    );\n  }\n\n  const setValueIfUncontrolled = useCallback(\n    (newValue: SetStateAction<any>) => {\n      if (!isControlled) {\n        setValue(newValue);\n      }\n    },\n    [isControlled],\n  );\n\n  return [value, setValueIfUncontrolled];\n};\n"],"names":[],"mappings":";AAUa,MAAA,gBAAgB,CAAC,gBAAqB,iBAAsB;AACvE,QAAM,EAAE,SAAS,aAAiB,IAAA,OAAO,mBAAmB,MAAS;AACrE,QAAM,CAAC,YAAY,QAAQ,IAAI,SAAS,YAAY;AAC9C,QAAA,QAAQ,eAAe,iBAAiB;AAgB9C,QAAM,yBAAyB;AAAA,IAC7B,CAAC,aAAkC;AACjC,UAAI,CAAC,cAAc;AACjB,iBAAS,QAAQ;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,YAAY;AAAA,EAAA;AAGR,SAAA,CAAC,OAAO,sBAAsB;AACvC;"}

package/dist/esm/hooks/useCss.js

@@ -1,7 +1,7 @@
 import { useMemo } from "react";
-import clsx from "clsx";
 import { serializeStyles } from "@emotion/serialize";
 import { insertStyles, getRegisteredStyles } from "@emotion/utils";
+import clsx from "clsx";
 import { useEmotionCache } from "./useEmotionCache.js";
 function getRef(args) {
   if (args.length !== 1) {

package/dist/esm/hooks/useCss.js.map

@@ -1 +1 @@
-{"version":3,"file":"useCss.js","sources":["../../../src/hooks/useCss.ts"],"sourcesContent":["import { useMemo } from \"react\";\nimport clsx from \"clsx\";\nimport { css as emotionCss, EmotionCache } from \"@emotion/css\";\nimport { serializeStyles, RegisteredCache } from \"@emotion/serialize\";\nimport { insertStyles, getRegisteredStyles } from \"@emotion/utils\";\n\nimport { useEmotionCache } from \"./useEmotionCache\";\n\ntype CSS = typeof emotionCss;\n\nfunction getRef(args: any[]) {\n  if (args.length !== 1) {\n    return { args, ref: undefined };\n  }\n\n  const [arg] = args;\n\n  if (!(arg instanceof Object)) {\n    return { args, ref: undefined };\n  }\n\n  if (!(\"ref\" in arg)) {\n    return { args, ref: undefined };\n  }\n\n  const { ref, ...argCopy } = arg;\n  return { args: [argCopy], ref };\n}\n\nconst cssFactory = (() => {\n  function merge(registered: RegisteredCache, css: CSS, className: string) {\n    const registeredStyles: string[] = [];\n\n    const rawClassName = getRegisteredStyles(\n      registered,\n      registeredStyles,\n      className\n    );\n\n    if (registeredStyles.length < 2) {\n      return className;\n    }\n\n    return rawClassName + css(registeredStyles);\n  }\n\n  function innerCssFactory(cache: EmotionCache) {\n    const css: CSS = (...styles: any) => {\n      const { ref, args } = getRef(styles);\n      const serialized = serializeStyles(args, cache.registered);\n      insertStyles(cache, serialized, false);\n      return `${cache.key}-${serialized.name}${\n        ref === undefined ? \"\" : ` ${ref}`\n      }`;\n    };\n\n    const cx = (...args: any) => merge(cache.registered, css, clsx(args));\n\n    return { css, cx };\n  }\n\n  return innerCssFactory;\n})();\n\nexport function useCss() {\n  const cache = useEmotionCache();\n  return useMemo(() => cssFactory(cache), [cache]);\n}\n"],"names":[],"mappings":";;;;;AAUA,SAAS,OAAO,MAAa;AACvB,MAAA,KAAK,WAAW,GAAG;AACd,WAAA,EAAE,MAAM,KAAK,OAAU;AAAA,EAChC;AAEM,QAAA,CAAC,GAAG,IAAI;AAEV,MAAA,EAAE,eAAe,SAAS;AACrB,WAAA,EAAE,MAAM,KAAK,OAAU;AAAA,EAChC;AAEI,MAAA,EAAE,SAAS,MAAM;AACZ,WAAA,EAAE,MAAM,KAAK,OAAU;AAAA,EAChC;AAEA,QAAM,EAAE,KAAK,GAAG,QAAA,IAAY;AAC5B,SAAO,EAAE,MAAM,CAAC,OAAO,GAAG,IAAI;AAChC;AAEA,MAAM,aAAoB,uBAAA;AACf,WAAA,MAAM,YAA6B,KAAU,WAAmB;AACvE,UAAM,mBAA6B,CAAA;AAEnC,UAAM,eAAe;AAAA,MACnB;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAGE,QAAA,iBAAiB,SAAS,GAAG;AACxB,aAAA;AAAA,IACT;AAEO,WAAA,eAAe,IAAI,gBAAgB;AAAA,EAC5C;AAEA,WAAS,gBAAgB,OAAqB;AACtC,UAAA,MAAW,IAAI,WAAgB;AACnC,YAAM,EAAE,KAAK,KAAK,IAAI,OAAO,MAAM;AACnC,YAAM,aAAa,gBAAgB,MAAM,MAAM,UAAU;AAC5C,mBAAA,OAAO,YAAY,KAAK;AACrC,aAAO,GAAG,MAAM,GAAG,IAAI,WAAW,IAAI,GACpC,QAAQ,SAAY,KAAK,IAAI,GAAG,EAClC;AAAA,IAAA;AAGI,UAAA,KAAK,IAAI,SAAc,MAAM,MAAM,YAAY,KAAK,KAAK,IAAI,CAAC;AAE7D,WAAA,EAAE,KAAK;EAChB;AAEO,SAAA;AACT;AAEO,SAAS,SAAS;AACvB,QAAM,QAAQ;AACd,SAAO,QAAQ,MAAM,WAAW,KAAK,GAAG,CAAC,KAAK,CAAC;AACjD;"}
+{"version":3,"file":"useCss.js","sources":["../../../src/hooks/useCss.ts"],"sourcesContent":["import { useMemo } from \"react\";\nimport { EmotionCache, css as emotionCss } from \"@emotion/css\";\nimport { RegisteredCache, serializeStyles } from \"@emotion/serialize\";\nimport { getRegisteredStyles, insertStyles } from \"@emotion/utils\";\nimport clsx from \"clsx\";\n\nimport { useEmotionCache } from \"./useEmotionCache\";\n\ntype CSS = typeof emotionCss;\n\nfunction getRef(args: any[]) {\n  if (args.length !== 1) {\n    return { args, ref: undefined };\n  }\n\n  const [arg] = args;\n\n  if (!(arg instanceof Object)) {\n    return { args, ref: undefined };\n  }\n\n  if (!(\"ref\" in arg)) {\n    return { args, ref: undefined };\n  }\n\n  const { ref, ...argCopy } = arg;\n  return { args: [argCopy], ref };\n}\n\nconst cssFactory = (() => {\n  function merge(registered: RegisteredCache, css: CSS, className: string) {\n    const registeredStyles: string[] = [];\n\n    const rawClassName = getRegisteredStyles(\n      registered,\n      registeredStyles,\n      className,\n    );\n\n    if (registeredStyles.length < 2) {\n      return className;\n    }\n\n    return rawClassName + css(registeredStyles);\n  }\n\n  function innerCssFactory(cache: EmotionCache) {\n    const css: CSS = (...styles: any) => {\n      const { ref, args } = getRef(styles);\n      const serialized = serializeStyles(args, cache.registered);\n      insertStyles(cache, serialized, false);\n      return `${cache.key}-${serialized.name}${\n        ref === undefined ? \"\" : ` ${ref}`\n      }`;\n    };\n\n    const cx = (...args: any) => merge(cache.registered, css, clsx(args));\n\n    return { css, cx };\n  }\n\n  return innerCssFactory;\n})();\n\nexport function useCss() {\n  const cache = useEmotionCache();\n  return useMemo(() => cssFactory(cache), [cache]);\n}\n"],"names":[],"mappings":";;;;;AAUA,SAAS,OAAO,MAAa;AACvB,MAAA,KAAK,WAAW,GAAG;AACd,WAAA,EAAE,MAAM,KAAK,OAAU;AAAA,EAChC;AAEM,QAAA,CAAC,GAAG,IAAI;AAEV,MAAA,EAAE,eAAe,SAAS;AACrB,WAAA,EAAE,MAAM,KAAK,OAAU;AAAA,EAChC;AAEI,MAAA,EAAE,SAAS,MAAM;AACZ,WAAA,EAAE,MAAM,KAAK,OAAU;AAAA,EAChC;AAEA,QAAM,EAAE,KAAK,GAAG,QAAA,IAAY;AAC5B,SAAO,EAAE,MAAM,CAAC,OAAO,GAAG,IAAI;AAChC;AAEA,MAAM,aAAoB,uBAAA;AACf,WAAA,MAAM,YAA6B,KAAU,WAAmB;AACvE,UAAM,mBAA6B,CAAA;AAEnC,UAAM,eAAe;AAAA,MACnB;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAGE,QAAA,iBAAiB,SAAS,GAAG;AACxB,aAAA;AAAA,IACT;AAEO,WAAA,eAAe,IAAI,gBAAgB;AAAA,EAC5C;AAEA,WAAS,gBAAgB,OAAqB;AACtC,UAAA,MAAW,IAAI,WAAgB;AACnC,YAAM,EAAE,KAAK,KAAK,IAAI,OAAO,MAAM;AACnC,YAAM,aAAa,gBAAgB,MAAM,MAAM,UAAU;AAC5C,mBAAA,OAAO,YAAY,KAAK;AACrC,aAAO,GAAG,MAAM,GAAG,IAAI,WAAW,IAAI,GACpC,QAAQ,SAAY,KAAK,IAAI,GAAG,EAClC;AAAA,IAAA;AAGI,UAAA,KAAK,IAAI,SAAc,MAAM,MAAM,YAAY,KAAK,KAAK,IAAI,CAAC;AAE7D,WAAA,EAAE,KAAK;EAChB;AAEO,SAAA;AACT;AAEO,SAAS,SAAS;AACvB,QAAM,QAAQ;AACd,SAAO,QAAQ,MAAM,WAAW,KAAK,GAAG,CAAC,KAAK,CAAC;AACjD;"}

package/dist/esm/hooks/useDefaultProps.js

@@ -2,12 +2,15 @@ import { useMemo } from "react";
 import { useCss } from "./useCss.js";
 import { useTheme } from "./useTheme.js";
 function filterProps(props) {
-  return Object.keys(props).reduce((acc, key) => {
-    if (props[key] !== void 0) {
-      acc[key] = props[key];
-    }
-    return acc;
-  }, {});
+  return Object.keys(props).reduce(
+    (acc, key) => {
+      if (props[key] !== void 0) {
+        acc[key] = props[key];
+      }
+      return acc;
+    },
+    {}
+  );
 }
 function useDefaultProps(componentName, props) {
   const { activeTheme } = useTheme();
@@ -20,13 +23,16 @@ function useDefaultProps(componentName, props) {
       ...Object.keys(themeClasses),
       ...Object.keys(propsClasses)
     ];
-    return classKeys.reduce((acc, key) => {
-      acc[key] = cx(
-        themeClasses[key] && css(themeClasses[key]),
-        propsClasses[key]
-      );
-      return acc;
-    }, {});
+    return classKeys.reduce(
+      (acc, key) => {
+        acc[key] = cx(
+          themeClasses[key] && css(themeClasses[key]),
+          propsClasses[key]
+        );
+        return acc;
+      },
+      {}
+    );
   }, [css, cx, props?.classes, themeDefaultProps?.classes]);
   return {
     ...themeDefaultProps,

package/dist/esm/hooks/useDefaultProps.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDefaultProps.js","sources":["../../../src/hooks/useDefaultProps.ts"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport { useCss } from \"./useCss\";\nimport { useTheme } from \"./useTheme\";\n\n/** Filter out `undefined` entries from `props` object. */\nexport function filterProps(props: Record<string, any>) {\n  return Object.keys(props).reduce((acc, key) => {\n    if (props[key] !== undefined) {\n      acc[key] = props[key];\n    }\n    return acc;\n  }, {} as typeof props);\n}\n\n/** Injects into `props` the props defined in the theme `componentName`. */\nexport function useDefaultProps<T extends Record<string, any>>(\n  /** Name of the theme component key to inject defaultProps */\n  componentName: string, // keyof HvThemeComponents,\n  props: T\n): T {\n  const { activeTheme } = useTheme();\n  const { css, cx } = useCss();\n\n  const themeDefaultProps = activeTheme?.components?.[componentName];\n\n  const classes = useMemo(() => {\n    const themeClasses = themeDefaultProps?.classes || {};\n    const propsClasses = props?.classes || {};\n    const classKeys = [\n      ...Object.keys(themeClasses),\n      ...Object.keys(propsClasses),\n    ];\n    return classKeys.reduce((acc, key) => {\n      acc[key] = cx(\n        themeClasses[key] && css(themeClasses[key]),\n        propsClasses[key]\n      );\n      return acc;\n    }, {} as Record<string, string>);\n  }, [css, cx, props?.classes, themeDefaultProps?.classes]);\n\n  return {\n    ...themeDefaultProps,\n    ...filterProps(props),\n    classes,\n  };\n}\n"],"names":[],"mappings":";;;AAMO,SAAS,YAAY,OAA4B;AACtD,SAAO,OAAO,KAAK,KAAK,EAAE,OAAO,CAAC,KAAK,QAAQ;AACzC,QAAA,MAAM,GAAG,MAAM,QAAW;AACxB,UAAA,GAAG,IAAI,MAAM,GAAG;AAAA,IACtB;AACO,WAAA;AAAA,EACT,GAAG,CAAkB,CAAA;AACvB;AAGgB,SAAA,gBAEd,eACA,OACG;AACG,QAAA,EAAE,gBAAgB;AACxB,QAAM,EAAE,KAAK,GAAG,IAAI,OAAO;AAErB,QAAA,oBAAoB,aAAa,aAAa,aAAa;AAE3D,QAAA,UAAU,QAAQ,MAAM;AACtB,UAAA,eAAe,mBAAmB,WAAW;AAC7C,UAAA,eAAe,OAAO,WAAW;AACvC,UAAM,YAAY;AAAA,MAChB,GAAG,OAAO,KAAK,YAAY;AAAA,MAC3B,GAAG,OAAO,KAAK,YAAY;AAAA,IAAA;AAE7B,WAAO,UAAU,OAAO,CAAC,KAAK,QAAQ;AACpC,UAAI,GAAG,IAAI;AAAA,QACT,aAAa,GAAG,KAAK,IAAI,aAAa,GAAG,CAAC;AAAA,QAC1C,aAAa,GAAG;AAAA,MAAA;AAEX,aAAA;AAAA,IACT,GAAG,CAA4B,CAAA;AAAA,EAAA,GAC9B,CAAC,KAAK,IAAI,OAAO,SAAS,mBAAmB,OAAO,CAAC;AAEjD,SAAA;AAAA,IACL,GAAG;AAAA,IACH,GAAG,YAAY,KAAK;AAAA,IACpB;AAAA,EAAA;AAEJ;"}
+{"version":3,"file":"useDefaultProps.js","sources":["../../../src/hooks/useDefaultProps.ts"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport { useCss } from \"./useCss\";\nimport { useTheme } from \"./useTheme\";\n\n/** Filter out `undefined` entries from `props` object. */\nexport function filterProps(props: Record<string, any>) {\n  return Object.keys(props).reduce(\n    (acc, key) => {\n      if (props[key] !== undefined) {\n        acc[key] = props[key];\n      }\n      return acc;\n    },\n    {} as typeof props,\n  );\n}\n\n/** Injects into `props` the props defined in the theme `componentName`. */\nexport function useDefaultProps<T extends Record<string, any>>(\n  /** Name of the theme component key to inject defaultProps */\n  componentName: string, // keyof HvThemeComponents,\n  props: T,\n): T {\n  const { activeTheme } = useTheme();\n  const { css, cx } = useCss();\n\n  const themeDefaultProps = activeTheme?.components?.[componentName];\n\n  const classes = useMemo(() => {\n    const themeClasses = themeDefaultProps?.classes || {};\n    const propsClasses = props?.classes || {};\n    const classKeys = [\n      ...Object.keys(themeClasses),\n      ...Object.keys(propsClasses),\n    ];\n    return classKeys.reduce(\n      (acc, key) => {\n        acc[key] = cx(\n          themeClasses[key] && css(themeClasses[key]),\n          propsClasses[key],\n        );\n        return acc;\n      },\n      {} as Record<string, string>,\n    );\n  }, [css, cx, props?.classes, themeDefaultProps?.classes]);\n\n  return {\n    ...themeDefaultProps,\n    ...filterProps(props),\n    classes,\n  };\n}\n"],"names":[],"mappings":";;;AAMO,SAAS,YAAY,OAA4B;AAC/C,SAAA,OAAO,KAAK,KAAK,EAAE;AAAA,IACxB,CAAC,KAAK,QAAQ;AACR,UAAA,MAAM,GAAG,MAAM,QAAW;AACxB,YAAA,GAAG,IAAI,MAAM,GAAG;AAAA,MACtB;AACO,aAAA;AAAA,IACT;AAAA,IACA,CAAC;AAAA,EAAA;AAEL;AAGgB,SAAA,gBAEd,eACA,OACG;AACG,QAAA,EAAE,gBAAgB;AACxB,QAAM,EAAE,KAAK,GAAG,IAAI,OAAO;AAErB,QAAA,oBAAoB,aAAa,aAAa,aAAa;AAE3D,QAAA,UAAU,QAAQ,MAAM;AACtB,UAAA,eAAe,mBAAmB,WAAW;AAC7C,UAAA,eAAe,OAAO,WAAW;AACvC,UAAM,YAAY;AAAA,MAChB,GAAG,OAAO,KAAK,YAAY;AAAA,MAC3B,GAAG,OAAO,KAAK,YAAY;AAAA,IAAA;AAE7B,WAAO,UAAU;AAAA,MACf,CAAC,KAAK,QAAQ;AACZ,YAAI,GAAG,IAAI;AAAA,UACT,aAAa,GAAG,KAAK,IAAI,aAAa,GAAG,CAAC;AAAA,UAC1C,aAAa,GAAG;AAAA,QAAA;AAEX,eAAA;AAAA,MACT;AAAA,MACA,CAAC;AAAA,IAAA;AAAA,EACH,GACC,CAAC,KAAK,IAAI,OAAO,SAAS,mBAAmB,OAAO,CAAC;AAEjD,SAAA;AAAA,IACL,GAAG;AAAA,IACH,GAAG,YAAY,KAAK;AAAA,IACpB;AAAA,EAAA;AAEJ;"}

package/dist/esm/hooks/useEmotionCache.js

@@ -1,8 +1,8 @@
 import { useContext } from "react";
 import "@emotion/react/jsx-runtime";
-import "@hitachivantara/uikit-styles";
-import { EmotionContext } from "@hitachivantara/uikit-react-shared";
 import "@mui/material/styles";
+import { EmotionContext } from "@hitachivantara/uikit-react-shared";
+import "@hitachivantara/uikit-styles";
 function useEmotionCache() {
   return useContext(EmotionContext).cache;
 }

package/dist/esm/hooks/useTheme.js

@@ -1,8 +1,8 @@
 import { useContext, useMemo } from "react";
 import "@emotion/react/jsx-runtime";
-import "@hitachivantara/uikit-styles";
-import { HvThemeContext } from "@hitachivantara/uikit-react-shared";
 import "@mui/material/styles";
+import { HvThemeContext } from "@hitachivantara/uikit-react-shared";
+import "@hitachivantara/uikit-styles";
 const useTheme = () => {
   const context = useContext(HvThemeContext);
   return useMemo(() => {

package/dist/esm/hooks/useWidth.js

@@ -1,6 +1,6 @@
-import { theme } from "@hitachivantara/uikit-styles";
 import { useTheme } from "@mui/material/styles";
 import useMediaQuery from "@mui/material/useMediaQuery";
+import { theme } from "@hitachivantara/uikit-styles";
 const useWidth = () => {
   const muiTheme = useTheme();
   const keys = Object.keys(theme.breakpoints.values).reverse();

package/dist/esm/hooks/useWidth.js.map

@@ -1 +1 @@
-{"version":3,"file":"useWidth.js","sources":["../../../src/hooks/useWidth.ts"],"sourcesContent":["/* eslint-disable react-hooks/rules-of-hooks */\nimport { theme } from \"@hitachivantara/uikit-styles\";\nimport { Breakpoint, useTheme } from \"@mui/material/styles\";\nimport useMediaQuery from \"@mui/material/useMediaQuery\";\n\nexport const useWidth = () => {\n  const muiTheme = useTheme();\n  const keys = Object.keys(theme.breakpoints.values).reverse() as Breakpoint[];\n\n  return (\n    keys.reduce<Breakpoint | null>((output, key) => {\n      const matches = useMediaQuery(muiTheme.breakpoints.up(key));\n\n      return !output && matches ? key : output;\n    }, null) || \"xs\"\n  );\n};\n"],"names":[],"mappings":";;;AAKO,MAAM,WAAW,MAAM;AAC5B,QAAM,WAAW;AACjB,QAAM,OAAO,OAAO,KAAK,MAAM,YAAY,MAAM,EAAE;AAEnD,SACE,KAAK,OAA0B,CAAC,QAAQ,QAAQ;AAC9C,UAAM,UAAU,cAAc,SAAS,YAAY,GAAG,GAAG,CAAC;AAEnD,WAAA,CAAC,UAAU,UAAU,MAAM;AAAA,EAAA,GACjC,IAAI,KAAK;AAEhB;"}
+{"version":3,"file":"useWidth.js","sources":["../../../src/hooks/useWidth.ts"],"sourcesContent":["/* eslint-disable react-hooks/rules-of-hooks */\nimport { Breakpoint, useTheme } from \"@mui/material/styles\";\nimport useMediaQuery from \"@mui/material/useMediaQuery\";\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nexport const useWidth = () => {\n  const muiTheme = useTheme();\n  const keys = Object.keys(theme.breakpoints.values).reverse() as Breakpoint[];\n\n  return (\n    keys.reduce<Breakpoint | null>((output, key) => {\n      const matches = useMediaQuery(muiTheme.breakpoints.up(key));\n\n      return !output && matches ? key : output;\n    }, null) || \"xs\"\n  );\n};\n"],"names":[],"mappings":";;;AAKO,MAAM,WAAW,MAAM;AAC5B,QAAM,WAAW;AACjB,QAAM,OAAO,OAAO,KAAK,MAAM,YAAY,MAAM,EAAE;AAEnD,SACE,KAAK,OAA0B,CAAC,QAAQ,QAAQ;AAC9C,UAAM,UAAU,cAAc,SAAS,YAAY,GAAG,GAAG,CAAC;AAEnD,WAAA,CAAC,UAAU,UAAU,MAAM;AAAA,EAAA,GACjC,IAAI,KAAK;AAEhB;"}

package/dist/esm/index.js

@@ -192,62 +192,64 @@ import { staticClasses as staticClasses70 } from "./List/List.styles.js";
 import { HvList } from "./List/List.js";
 import { staticClasses as staticClasses71 } from "./Loading/Loading.styles.js";
 import { HvLoading } from "./Loading/Loading.js";
-import { staticClasses as staticClasses72 } from "./Login/Login.styles.js";
+import { staticClasses as staticClasses72 } from "./LoadingContainer/LoadingContainer.styles.js";
+import { HvLoadingContainer } from "./LoadingContainer/LoadingContainer.js";
+import { staticClasses as staticClasses73 } from "./Login/Login.styles.js";
 import { HvLogin } from "./Login/Login.js";
-import { staticClasses as staticClasses73 } from "./MultiButton/MultiButton.styles.js";
+import { staticClasses as staticClasses74 } from "./MultiButton/MultiButton.styles.js";
 import { HvMultiButton } from "./MultiButton/MultiButton.js";
-import { staticClasses as staticClasses74 } from "./OverflowTooltip/OverflowTooltip.styles.js";
+import { staticClasses as staticClasses75 } from "./OverflowTooltip/OverflowTooltip.styles.js";
 import { HvOverflowTooltip } from "./OverflowTooltip/OverflowTooltip.js";
-import { staticClasses as staticClasses75 } from "./Pagination/Pagination.styles.js";
+import { staticClasses as staticClasses76 } from "./Pagination/Pagination.styles.js";
 import { HvPagination } from "./Pagination/Pagination.js";
-import { staticClasses as staticClasses76 } from "./Panel/Panel.styles.js";
+import { staticClasses as staticClasses77 } from "./Panel/Panel.styles.js";
 import { HvPanel } from "./Panel/Panel.js";
-import { staticClasses as staticClasses77 } from "./ProgressBar/ProgressBar.styles.js";
+import { staticClasses as staticClasses78 } from "./ProgressBar/ProgressBar.styles.js";
 import { HvProgressBar } from "./ProgressBar/ProgressBar.js";
 import { defaultCombinators, defaultLabels, defaultOperators, useQueryBuilderContext } from "./QueryBuilder/Context.js";
-import { staticClasses as staticClasses78 } from "./QueryBuilder/QueryBuilder.styles.js";
+import { staticClasses as staticClasses79 } from "./QueryBuilder/QueryBuilder.styles.js";
 import { HvQueryBuilder } from "./QueryBuilder/QueryBuilder.js";
-import { staticClasses as staticClasses79 } from "./Radio/Radio.styles.js";
+import { staticClasses as staticClasses80 } from "./Radio/Radio.styles.js";
 import { HvRadio } from "./Radio/Radio.js";
-import { staticClasses as staticClasses80 } from "./RadioGroup/RadioGroup.styles.js";
+import { staticClasses as staticClasses81 } from "./RadioGroup/RadioGroup.styles.js";
 import { HvRadioGroup } from "./RadioGroup/RadioGroup.js";
-import { staticClasses as staticClasses81 } from "./ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.styles.js";
-import { staticClasses as staticClasses82 } from "./ScrollTo/Vertical/ScrollToVertical.styles.js";
+import { staticClasses as staticClasses82 } from "./ScrollTo/Vertical/VerticalScrollListItem/VerticalScrollListItem.styles.js";
+import { staticClasses as staticClasses83 } from "./ScrollTo/Vertical/ScrollToVertical.styles.js";
 import { HvScrollToVertical } from "./ScrollTo/Vertical/ScrollToVertical.js";
-import { staticClasses as staticClasses83 } from "./ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.styles.js";
-import { staticClasses as staticClasses84 } from "./ScrollTo/Horizontal/ScrollToHorizontal.styles.js";
+import { staticClasses as staticClasses84 } from "./ScrollTo/Horizontal/HorizontalScrollListItem/HorizontalScrollListItem.styles.js";
+import { staticClasses as staticClasses85 } from "./ScrollTo/Horizontal/ScrollToHorizontal.styles.js";
 import { HvScrollToHorizontal } from "./ScrollTo/Horizontal/ScrollToHorizontal.js";
-import { staticClasses as staticClasses85 } from "./Section/Section.styles.js";
+import { staticClasses as staticClasses86 } from "./Section/Section.styles.js";
 import { HvSection } from "./Section/Section.js";
-import { staticClasses as staticClasses86 } from "./SimpleGrid/SimpleGrid.styles.js";
+import { staticClasses as staticClasses87 } from "./SimpleGrid/SimpleGrid.styles.js";
 import { HvSimpleGrid } from "./SimpleGrid/SimpleGrid.js";
-import { staticClasses as staticClasses87 } from "./Slider/Slider.styles.js";
+import { staticClasses as staticClasses88 } from "./Slider/Slider.styles.js";
 import { HvSlider } from "./Slider/Slider.js";
-import { staticClasses as staticClasses88 } from "./Snackbar/Snackbar.styles.js";
+import { staticClasses as staticClasses89 } from "./Snackbar/Snackbar.styles.js";
 import { HvSnackbar } from "./Snackbar/Snackbar.js";
-import { staticClasses as staticClasses89 } from "./Snackbar/SnackbarContent/SnackbarContent.styles.js";
+import { staticClasses as staticClasses90 } from "./Snackbar/SnackbarContent/SnackbarContent.styles.js";
 import { HvSnackbarContent } from "./Snackbar/SnackbarContent/SnackbarContent.js";
-import { staticClasses as staticClasses90 } from "./SnackbarProvider/SnackbarProvider.styles.js";
+import { staticClasses as staticClasses91 } from "./SnackbarProvider/SnackbarProvider.styles.js";
 import { HvSnackbarProvider, useHvSnackbar } from "./SnackbarProvider/SnackbarProvider.js";
-import { staticClasses as staticClasses91 } from "./Stack/Stack.styles.js";
+import { staticClasses as staticClasses92 } from "./Stack/Stack.styles.js";
 import { HvStack } from "./Stack/Stack.js";
-import { staticClasses as staticClasses92 } from "./Switch/Switch.styles.js";
+import { staticClasses as staticClasses93 } from "./Switch/Switch.styles.js";
 import { HvSwitch } from "./Switch/Switch.js";
-import { staticClasses as staticClasses93 } from "./Tab/Tab.styles.js";
+import { staticClasses as staticClasses94 } from "./Tab/Tab.styles.js";
 import { HvTab } from "./Tab/Tab.js";
-import { staticClasses as staticClasses94 } from "./Table/Table.styles.js";
+import { staticClasses as staticClasses95 } from "./Table/Table.styles.js";
 import { HvTable } from "./Table/Table.js";
-import { staticClasses as staticClasses95 } from "./Table/TableContainer/TableContainer.styles.js";
+import { staticClasses as staticClasses96 } from "./Table/TableContainer/TableContainer.styles.js";
 import { HvTableContainer } from "./Table/TableContainer/TableContainer.js";
-import { staticClasses as staticClasses96 } from "./Table/TableBody/TableBody.styles.js";
+import { staticClasses as staticClasses97 } from "./Table/TableBody/TableBody.styles.js";
 import { HvTableBody } from "./Table/TableBody/TableBody.js";
-import { staticClasses as staticClasses97 } from "./Table/TableHead/TableHead.styles.js";
+import { staticClasses as staticClasses98 } from "./Table/TableHead/TableHead.styles.js";
 import { HvTableHead } from "./Table/TableHead/TableHead.js";
-import { staticClasses as staticClasses98 } from "./Table/TableHeader/TableHeader.styles.js";
+import { staticClasses as staticClasses99 } from "./Table/TableHeader/TableHeader.styles.js";
 import { HvTableHeader } from "./Table/TableHeader/TableHeader.js";
-import { staticClasses as staticClasses99 } from "./Table/TableRow/TableRow.styles.js";
+import { staticClasses as staticClasses100 } from "./Table/TableRow/TableRow.styles.js";
 import { HvTableRow } from "./Table/TableRow/TableRow.js";
-import { staticClasses as staticClasses100 } from "./Table/TableCell/TableCell.styles.js";
+import { staticClasses as staticClasses101 } from "./Table/TableCell/TableCell.styles.js";
 import { HvTableCell } from "./Table/TableCell/TableCell.js";
 import { getHeaderFooterPropsHook, default as default4 } from "./Table/hooks/useTableStyles.js";
 import { default as default5 } from "./Table/hooks/useSortBy.js";
@@ -268,47 +270,47 @@ import { HvProgressColumnCell, normalizeProgressBar } from "./Table/renderers/Pr
 import { HvSwitchColumnCell } from "./Table/renderers/SwitchColumnCell/SwitchColumnCell.js";
 import { hvNodeFallback, hvNumberFallback, hvStringFallback } from "./Table/utils/fallbacks.js";
 import { getBorderStyles } from "./Table/utils/utils.js";
-import { staticClasses as staticClasses101 } from "./Tabs/Tabs.styles.js";
+import { staticClasses as staticClasses102 } from "./Tabs/Tabs.styles.js";
 import { HvTabs } from "./Tabs/Tabs.js";
-import { staticClasses as staticClasses102 } from "./Tag/Tag.styles.js";
+import { staticClasses as staticClasses103 } from "./Tag/Tag.styles.js";
 import { HvTag } from "./Tag/Tag.js";
-import { staticClasses as staticClasses103 } from "./TagsInput/TagsInput.styles.js";
+import { staticClasses as staticClasses104 } from "./TagsInput/TagsInput.styles.js";
 import { HvTagsInput } from "./TagsInput/TagsInput.js";
-import { staticClasses as staticClasses104 } from "./TextArea/TextArea.styles.js";
+import { staticClasses as staticClasses105 } from "./TextArea/TextArea.styles.js";
 import { HvTextArea } from "./TextArea/TextArea.js";
-import { staticClasses as staticClasses105 } from "./TimeAgo/TimeAgo.styles.js";
+import { staticClasses as staticClasses106 } from "./TimeAgo/TimeAgo.styles.js";
 import { HvTimeAgo } from "./TimeAgo/TimeAgo.js";
-import { staticClasses as staticClasses106 } from "./TimePicker/TimePicker.styles.js";
+import { staticClasses as staticClasses107 } from "./TimePicker/TimePicker.styles.js";
 import { HvTimePicker } from "./TimePicker/TimePicker.js";
 import { HvToggleButton } from "./ToggleButton/ToggleButton.js";
-import { staticClasses as staticClasses107 } from "./Tooltip/Tooltip.styles.js";
+import { staticClasses as staticClasses108 } from "./Tooltip/Tooltip.styles.js";
 import { HvTooltip } from "./Tooltip/Tooltip.js";
-import { staticClasses as staticClasses108 } from "./TreeView/TreeView.styles.js";
+import { staticClasses as staticClasses109 } from "./TreeView/TreeView.styles.js";
 import { HvTreeView } from "./TreeView/TreeView.js";
-import { staticClasses as staticClasses109 } from "./TreeView/TreeItem/TreeItem.styles.js";
+import { staticClasses as staticClasses110 } from "./TreeView/TreeItem/TreeItem.styles.js";
 import { HvTreeItem } from "./TreeView/TreeItem/TreeItem.js";
 import { useHvTreeItem } from "./TreeView/TreeItem/useHvTreeItem.js";
-import { staticClasses as staticClasses110 } from "./VerticalNavigation/VerticalNavigation.styles.js";
+import { staticClasses as staticClasses111 } from "./VerticalNavigation/VerticalNavigation.styles.js";
 import { HvVerticalNavigation } from "./VerticalNavigation/VerticalNavigation.js";
-import { staticClasses as staticClasses111 } from "./VerticalNavigation/Header/Header.styles.js";
+import { staticClasses as staticClasses112 } from "./VerticalNavigation/Header/Header.styles.js";
 import { HvVerticalNavigationHeader } from "./VerticalNavigation/Header/Header.js";
-import { staticClasses as staticClasses112 } from "./VerticalNavigation/Actions/Actions.styles.js";
+import { staticClasses as staticClasses113 } from "./VerticalNavigation/Actions/Actions.styles.js";
 import { HvVerticalNavigationActions } from "./VerticalNavigation/Actions/Actions.js";
-import { staticClasses as staticClasses113 } from "./VerticalNavigation/Actions/Action.styles.js";
+import { staticClasses as staticClasses114 } from "./VerticalNavigation/Actions/Action.styles.js";
 import { HvVerticalNavigationAction } from "./VerticalNavigation/Actions/Action.js";
-import { staticClasses as staticClasses114 } from "./VerticalNavigation/Navigation/Navigation.styles.js";
+import { staticClasses as staticClasses115 } from "./VerticalNavigation/Navigation/Navigation.styles.js";
 import { HvVerticalNavigationTree } from "./VerticalNavigation/Navigation/Navigation.js";
-import { staticClasses as staticClasses115 } from "./VerticalNavigation/NavigationSlider/NavigationSlider.styles.js";
+import { staticClasses as staticClasses116 } from "./VerticalNavigation/NavigationSlider/NavigationSlider.styles.js";
 import { HvVerticalNavigationSlider } from "./VerticalNavigation/NavigationSlider/NavigationSlider.js";
-import { staticClasses as staticClasses116 } from "./VerticalNavigation/TreeView/TreeView.styles.js";
+import { staticClasses as staticClasses117 } from "./VerticalNavigation/TreeView/TreeView.styles.js";
 import { HvVerticalNavigationTreeView } from "./VerticalNavigation/TreeView/TreeView.js";
-import { staticClasses as staticClasses117 } from "./VerticalNavigation/TreeView/TreeViewItem.styles.js";
+import { staticClasses as staticClasses118 } from "./VerticalNavigation/TreeView/TreeViewItem.styles.js";
 import { HvVerticalNavigationTreeViewItem } from "./VerticalNavigation/TreeView/TreeViewItem.js";
 import { VerticalNavigationContext } from "./VerticalNavigation/VerticalNavigationContext.js";
-import { staticClasses as staticClasses118 } from "./TableSection/TableSection.styles.js";
+import { staticClasses as staticClasses119 } from "./TableSection/TableSection.styles.js";
 import { HvTableSection } from "./TableSection/TableSection.js";
 import { HvIconButton } from "./IconButton/IconButton.js";
-import { staticClasses as staticClasses119 } from "./Skeleton/Skeleton.styles.js";
+import { staticClasses as staticClasses120 } from "./Skeleton/Skeleton.styles.js";
 import { HvSkeleton } from "./Skeleton/Skeleton.js";
 import { EmotionContext, HvThemeContext, defaultCacheKey, defaultEmotionCache } from "@hitachivantara/uikit-react-shared";
 export {
@@ -399,6 +401,7 @@ export {
   HvListContainer,
   HvListItem,
   HvLoading,
+  HvLoadingContainer,
   HvLogin,
   HvMultiButton,
   HvOption,
@@ -463,8 +466,8 @@ export {
   VerticalNavigationContext,
   staticClasses16 as accordionClasses,
   staticClasses17 as actionBarClasses,
-  staticClasses113 as actionClasses,
-  staticClasses112 as actionsClasses,
+  staticClasses114 as actionClasses,
+  staticClasses113 as actionsClasses,
   staticClasses18 as actionsGenericClasses,
   staticClasses6 as adornmentClasses,
   staticClasses20 as appSwitcherActionClasses,
@@ -552,7 +555,7 @@ export {
   staticClasses62 as headerClasses,
   staticClasses65 as headerNavigationClasses,
   hexToRgbA,
-  staticClasses83 as horizontalScrollListItemClasses,
+  staticClasses84 as horizontalScrollListItemClasses,
   hvDateColumn,
   hvDropdownColumn,
   hvExpandColumn,
@@ -585,65 +588,66 @@ export {
   staticClasses3 as listContainerClasses,
   staticClasses4 as listItemClasses,
   staticClasses71 as loadingClasses,
-  staticClasses72 as loginClasses,
-  staticClasses73 as multiButtonClasses,
+  staticClasses72 as loadingContainerClasses,
+  staticClasses73 as loginClasses,
+  staticClasses74 as multiButtonClasses,
   multiSelectionEventHandler,
   normalizeProgressBar,
   optionClasses,
   optionGroupClasses,
   outlineStyles,
-  staticClasses74 as overflowTooltipClasses,
-  staticClasses75 as paginationClasses,
-  staticClasses76 as panelClasses,
+  staticClasses75 as overflowTooltipClasses,
+  staticClasses76 as paginationClasses,
+  staticClasses77 as panelClasses,
   pentahoPlus,
   prepareRow,
   processThemes,
-  staticClasses77 as progressBarClasses,
-  staticClasses78 as queryBuilderClasses,
-  staticClasses79 as radioClasses,
-  staticClasses80 as radioGroupClasses,
+  staticClasses78 as progressBarClasses,
+  staticClasses79 as queryBuilderClasses,
+  staticClasses80 as radioClasses,
+  staticClasses81 as radioGroupClasses,
   reducer,
   replace$,
   staticClasses45 as rightControlClasses,
-  staticClasses84 as scrollToHorizontalClasses,
-  staticClasses82 as scrollToVerticalClasses,
-  staticClasses85 as sectionClasses,
+  staticClasses85 as scrollToHorizontalClasses,
+  staticClasses83 as scrollToVerticalClasses,
+  staticClasses86 as sectionClasses,
   staticClasses11 as selectClasses,
   staticClasses12 as selectionListClasses,
   setElementAttrs,
   setId,
   setUid,
-  staticClasses86 as simpleGridClasses,
-  staticClasses119 as skeletonClasses,
-  staticClasses87 as sliderClasses,
-  staticClasses88 as snackbarClasses,
-  staticClasses89 as snackbarContentClasses,
-  staticClasses90 as snackbarProviderClasses,
-  staticClasses91 as stackClasses,
+  staticClasses87 as simpleGridClasses,
+  staticClasses120 as skeletonClasses,
+  staticClasses88 as sliderClasses,
+  staticClasses89 as snackbarClasses,
+  staticClasses90 as snackbarContentClasses,
+  staticClasses91 as snackbarProviderClasses,
+  staticClasses92 as stackClasses,
   staticClasses13 as suggestionsClasses,
-  staticClasses92 as switchClasses,
-  staticClasses93 as tabClasses,
-  staticClasses96 as tableBodyClasses,
-  staticClasses100 as tableCellClasses,
-  staticClasses94 as tableClasses,
-  staticClasses95 as tableContainerClasses,
-  staticClasses97 as tableHeadClasses,
-  staticClasses98 as tableHeaderClasses,
-  staticClasses99 as tableRowClasses,
-  staticClasses118 as tableSectionClasses,
-  staticClasses101 as tabsClasses,
-  staticClasses102 as tagClasses,
-  staticClasses103 as tagsInputClasses,
-  staticClasses104 as textAreaClasses,
+  staticClasses93 as switchClasses,
+  staticClasses94 as tabClasses,
+  staticClasses97 as tableBodyClasses,
+  staticClasses101 as tableCellClasses,
+  staticClasses95 as tableClasses,
+  staticClasses96 as tableContainerClasses,
+  staticClasses98 as tableHeadClasses,
+  staticClasses99 as tableHeaderClasses,
+  staticClasses100 as tableRowClasses,
+  staticClasses119 as tableSectionClasses,
+  staticClasses102 as tabsClasses,
+  staticClasses103 as tagClasses,
+  staticClasses104 as tagsInputClasses,
+  staticClasses105 as textAreaClasses,
   theme,
   themes,
-  staticClasses105 as timeAgoClasses,
-  staticClasses106 as timePickerClasses,
-  staticClasses107 as tooltipClasses,
-  staticClasses109 as treeItemClasses,
-  staticClasses108 as treeView2Classes,
-  staticClasses116 as treeViewClasses,
-  staticClasses117 as treeViewItemClasses,
+  staticClasses106 as timeAgoClasses,
+  staticClasses107 as timePickerClasses,
+  staticClasses108 as tooltipClasses,
+  staticClasses110 as treeItemClasses,
+  staticClasses109 as treeView2Classes,
+  staticClasses117 as treeViewClasses,
+  staticClasses118 as treeViewItemClasses,
   staticClasses as typographyClasses,
   typographyVariants,
   useClickOutside,
@@ -679,11 +683,11 @@ export {
   useTheme,
   useUniqueId,
   useWidth,
-  staticClasses110 as verticalNavigationClasses,
-  staticClasses111 as verticalNavigationHeaderClasses,
-  staticClasses115 as verticalNavigationSliderClasses,
-  staticClasses114 as verticalNavigationTreeClasses,
-  staticClasses81 as verticalScrollListItemClasses,
+  staticClasses111 as verticalNavigationClasses,
+  staticClasses112 as verticalNavigationHeaderClasses,
+  staticClasses116 as verticalNavigationSliderClasses,
+  staticClasses115 as verticalNavigationTreeClasses,
+  staticClasses82 as verticalScrollListItemClasses,
   staticClasses10 as warningTextClasses,
   withTooltip,
   wrapperTooltip

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/esm/providers/Provider.js

@@ -3,9 +3,9 @@ import { useMemo } from "react";
 import createCache from "@emotion/cache";
 import { CacheProvider, Global, css, ClassNames } from "@emotion/react";
 import { CssBaseline, getThemesVars, CssScopedBaseline } from "@hitachivantara/uikit-styles";
+import { useUniqueId } from "../hooks/useUniqueId.js";
 import { getElementById } from "../utils/document.js";
 import { processThemes } from "../utils/theme.js";
-import { useUniqueId } from "../hooks/useUniqueId.js";
 import { HvThemeProvider } from "./ThemeProvider.js";
 import { defaultCacheKey, defaultEmotionCache } from "@hitachivantara/uikit-react-shared";
 const scopedRootPrefix = "hv-uikit-scoped-root";

package/dist/esm/providers/Provider.js.map

@@ -1 +1 @@
-{"version":3,"file":"Provider.js","sources":["../../../src/providers/Provider.tsx"],"sourcesContent":["import { useMemo } from \"react\";\n\nimport createCache, { EmotionCache } from \"@emotion/cache\";\nimport {\n  css as cssReact,\n  Global,\n  CacheProvider,\n  ClassNames,\n} from \"@emotion/react\";\n\nimport {\n  CssBaseline,\n  CssScopedBaseline,\n  getThemesVars,\n  HvThemeStructure,\n} from \"@hitachivantara/uikit-styles\";\n\nimport { getElementById } from \"../utils/document\";\nimport { processThemes } from \"../utils/theme\";\nimport { HvTheme } from \"../types/theme\";\nimport { useUniqueId } from \"../hooks/useUniqueId\";\n\nimport {\n  HvThemeProvider,\n  defaultCacheKey,\n  defaultEmotionCache,\n} from \"./ThemeProvider\";\n\n// Provider props\nexport interface HvProviderProps {\n  /**\n   * Your component tree.\n   */\n  children?: React.ReactNode;\n  /**\n   * Id of your root element.\n   */\n  rootElementId?: string;\n  /**\n   * By default the baseline styles are applied globally, `global`, to the application for the UI Kit components to work properly.\n   * If you need to scope the baseline styles to avoid styling conflicts, you can set this property to `scoped`.\n   * To scope the baseline to your root, you need to add the `rootElementId` property.\n   * If the `rootElementId` property is not set, the baseline will be scoped to a new container, `hv-uikit-scoped-root*`, created around your content.\n   * If you are providing your own baseline styles, you can set this property to `none` to disable the baseline styles.\n   */\n  cssBaseline?: \"global\" | \"scoped\" | \"none\";\n  /**\n   * By default the theme styles are applied globally, `global`, to the application.\n   * If you need to scope the theme styles to avoid styling conflicts, you can set this property to `scoped`.\n   * To scope the theme to your root, you need to add the `rootElementId` property.\n   * If the `rootElementId` property is not set, the theme will be scoped to a new container, `hv-uikit-scoped-root*`, created around your content.\n   */\n  cssTheme?: \"global\" | \"scoped\";\n  /**\n   * The string used to prefix the class names and uniquely identify them. The key can only contain lower case alphabetical characters.\n   * This is useful to avoid class name collisions.\n   *\n   * If `emotionCache` is passed, this is value is ignored.\n   *\n   * @default \"hv\"\n   */\n  classNameKey?: string;\n  /**\n   * The emotion cache instance to use. If no value is provided, the default cache is used.\n   */\n  emotionCache?: EmotionCache;\n  /**\n   * List of themes to be used by UI Kit.\n   * You can provide your own themes created with the `createTheme` utility and/or the default themes `ds3` and `ds5` provided by UI Kit.\n   *\n   * If no value is provided, the `ds5` theme will be used.\n   */\n  themes?: (HvTheme | HvThemeStructure)[];\n  /**\n   * The active theme. It must be one of the themes passed to `themes`.\n   *\n   * If no value is provided, the first theme from the `themes` list is used. If no `themes` list is provided, the `ds5` theme will be used.\n   */\n  theme?: string;\n  /**\n   * The active color mode. It must be one of the color modes of the active theme.\n   *\n   * If no value is provided, the first color mode defined in the active theme is used.\n   * For the default themes `ds3` and `ds5`, the `dawn` color mode is the one used.\n   */\n  colorMode?: string;\n}\n\nconst scopedRootPrefix = \"hv-uikit-scoped-root\" as const;\n\n/**\n * Enables theming capabilities and makes cross-component theme properties available down the tree.\n */\nexport const HvProvider = ({\n  children,\n  rootElementId,\n  cssBaseline = \"global\",\n  cssTheme = \"global\",\n  themes,\n  theme,\n  colorMode,\n  emotionCache: emotionCacheProp,\n  classNameKey = defaultCacheKey,\n}: HvProviderProps) => {\n  const generatedId = useUniqueId();\n  const scopedRootId = `${scopedRootPrefix}-${generatedId}`;\n\n  // Themes\n  const themesList: (HvTheme | HvThemeStructure)[] = processThemes(themes);\n\n  // Emotion cache\n  // Moves UI Kit styles to the top of the <head> so they're loaded first\n  // This enables users to override the UI Kit styles if necessary\n  const emotionCache = useMemo(() => {\n    if (emotionCacheProp) return emotionCacheProp;\n    // reuse the default shared cache if `classNameKey` is the same\n    if (classNameKey === defaultCacheKey) return defaultEmotionCache;\n\n    return createCache({ key: classNameKey, prepend: true });\n  }, [classNameKey, emotionCacheProp]);\n\n  return (\n    <CacheProvider value={emotionCache}>\n      <Global\n        styles={cssReact`\n          ${\n            cssBaseline === \"global\" && {\n              [`@layer hv-uikit-baseline`]: {\n                ...CssBaseline,\n              },\n            }\n          }\n          ${getThemesVars(themesList)}\n        `}\n      />\n      <HvThemeProvider\n        themes={themesList}\n        theme={theme || themesList[0].name}\n        emotionCache={emotionCache}\n        colorMode={colorMode || Object.keys(themesList[0].colors.modes)[0]}\n        themeRootId={\n          cssTheme === \"scoped\" ? rootElementId || scopedRootId : undefined\n        }\n      >\n        <ClassNames>\n          {({ css }) => {\n            if (cssBaseline === \"scoped\") {\n              const rootElement = getElementById(rootElementId);\n\n              if (rootElement) {\n                rootElement.classList.add(\n                  css({\n                    [`@layer ${rootElementId}-baseline`]: {\n                      ...CssScopedBaseline,\n                    },\n                  })\n                );\n              }\n            }\n\n            return (cssTheme === \"scoped\" || cssBaseline === \"scoped\") &&\n              !rootElementId ? (\n              <div\n                id={scopedRootId}\n                className={\n                  cssBaseline === \"scoped\"\n                    ? css({\n                        [`@layer ${rootElementId}-baseline`]: {\n                          ...CssScopedBaseline,\n                        },\n                      })\n                    : undefined\n                }\n              >\n                {children}\n              </div>\n            ) : (\n              children\n            );\n          }}\n        </ClassNames>\n      </HvThemeProvider>\n    </CacheProvider>\n  );\n};\n"],"names":["cssReact","css"],"mappings":";;;;;;;;;;AAwFA,MAAM,mBAAmB;AAKlB,MAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,eAAe;AACjB,MAAuB;AACrB,QAAM,cAAc;AACpB,QAAM,eAAe,GAAG,gBAAgB,IAAI,WAAW;AAGjD,QAAA,aAA6C,cAAc,MAAM;AAKjE,QAAA,eAAe,QAAQ,MAAM;AAC7B,QAAA;AAAyB,aAAA;AAE7B,QAAI,iBAAiB;AAAwB,aAAA;AAE7C,WAAO,YAAY,EAAE,KAAK,cAAc,SAAS,MAAM;AAAA,EAAA,GACtD,CAAC,cAAc,gBAAgB,CAAC;AAGjC,SAAA,qBAAC,eAAc,EAAA,OAAO,cACpB,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,QAAQA;AAAAA,YAEJ,gBAAgB,YAAY;AAAA,UAC1B,CAAC,0BAA0B,GAAG;AAAA,YAC5B,GAAG;AAAA,UACL;AAAA,QAAA,CAEJ;AAAA,YACE,cAAc,UAAU,CAAC;AAAA;AAAA,MAAA;AAAA,IAE/B;AAAA,IACA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,QAAQ;AAAA,QACR,OAAO,SAAS,WAAW,CAAC,EAAE;AAAA,QAC9B;AAAA,QACA,WAAW,aAAa,OAAO,KAAK,WAAW,CAAC,EAAE,OAAO,KAAK,EAAE,CAAC;AAAA,QACjE,aACE,aAAa,WAAW,iBAAiB,eAAe;AAAA,QAG1D,UAAC,oBAAA,YAAA,EACE,UAAC,CAAA,EAAE,KAAAC,WAAU;AACZ,cAAI,gBAAgB,UAAU;AACtB,kBAAA,cAAc,eAAe,aAAa;AAEhD,gBAAI,aAAa;AACf,0BAAY,UAAU;AAAA,gBACpBA,KAAI;AAAA,kBACF,CAAC,UAAU,aAAa,WAAW,GAAG;AAAA,oBACpC,GAAG;AAAA,kBACL;AAAA,gBAAA,CACD;AAAA,cAAA;AAAA,YAEL;AAAA,UACF;AAEA,kBAAQ,aAAa,YAAY,gBAAgB,aAC/C,CAAC,gBACD;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,IAAI;AAAA,cACJ,WACE,gBAAgB,WACZA,KAAI;AAAA,gBACF,CAAC,UAAU,aAAa,WAAW,GAAG;AAAA,kBACpC,GAAG;AAAA,gBACL;AAAA,cACD,CAAA,IACD;AAAA,cAGL;AAAA,YAAA;AAAA,UAGH,IAAA;AAAA,QAAA,GAGN;AAAA,MAAA;AAAA,IACF;AAAA,EACF,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"Provider.js","sources":["../../../src/providers/Provider.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport createCache, { EmotionCache } from \"@emotion/cache\";\nimport {\n  CacheProvider,\n  ClassNames,\n  css as cssReact,\n  Global,\n} from \"@emotion/react\";\nimport {\n  CssBaseline,\n  CssScopedBaseline,\n  getThemesVars,\n  HvThemeStructure,\n} from \"@hitachivantara/uikit-styles\";\n\nimport { useUniqueId } from \"../hooks/useUniqueId\";\nimport { HvTheme } from \"../types/theme\";\nimport { getElementById } from \"../utils/document\";\nimport { processThemes } from \"../utils/theme\";\nimport {\n  defaultCacheKey,\n  defaultEmotionCache,\n  HvThemeProvider,\n} from \"./ThemeProvider\";\n\n// Provider props\nexport interface HvProviderProps {\n  /**\n   * Your component tree.\n   */\n  children?: React.ReactNode;\n  /**\n   * Id of your root element.\n   */\n  rootElementId?: string;\n  /**\n   * By default the baseline styles are applied globally, `global`, to the application for the UI Kit components to work properly.\n   * If you need to scope the baseline styles to avoid styling conflicts, you can set this property to `scoped`.\n   * To scope the baseline to your root, you need to add the `rootElementId` property.\n   * If the `rootElementId` property is not set, the baseline will be scoped to a new container, `hv-uikit-scoped-root*`, created around your content.\n   * If you are providing your own baseline styles, you can set this property to `none` to disable the baseline styles.\n   */\n  cssBaseline?: \"global\" | \"scoped\" | \"none\";\n  /**\n   * By default the theme styles are applied globally, `global`, to the application.\n   * If you need to scope the theme styles to avoid styling conflicts, you can set this property to `scoped`.\n   * To scope the theme to your root, you need to add the `rootElementId` property.\n   * If the `rootElementId` property is not set, the theme will be scoped to a new container, `hv-uikit-scoped-root*`, created around your content.\n   */\n  cssTheme?: \"global\" | \"scoped\";\n  /**\n   * The string used to prefix the class names and uniquely identify them. The key can only contain lower case alphabetical characters.\n   * This is useful to avoid class name collisions.\n   *\n   * If `emotionCache` is passed, this is value is ignored.\n   *\n   * @default \"hv\"\n   */\n  classNameKey?: string;\n  /**\n   * The emotion cache instance to use. If no value is provided, the default cache is used.\n   */\n  emotionCache?: EmotionCache;\n  /**\n   * List of themes to be used by UI Kit.\n   * You can provide your own themes created with the `createTheme` utility and/or the default themes `ds3` and `ds5` provided by UI Kit.\n   *\n   * If no value is provided, the `ds5` theme will be used.\n   */\n  themes?: (HvTheme | HvThemeStructure)[];\n  /**\n   * The active theme. It must be one of the themes passed to `themes`.\n   *\n   * If no value is provided, the first theme from the `themes` list is used. If no `themes` list is provided, the `ds5` theme will be used.\n   */\n  theme?: string;\n  /**\n   * The active color mode. It must be one of the color modes of the active theme.\n   *\n   * If no value is provided, the first color mode defined in the active theme is used.\n   * For the default themes `ds3` and `ds5`, the `dawn` color mode is the one used.\n   */\n  colorMode?: string;\n}\n\nconst scopedRootPrefix = \"hv-uikit-scoped-root\" as const;\n\n/**\n * Enables theming capabilities and makes cross-component theme properties available down the tree.\n */\nexport const HvProvider = ({\n  children,\n  rootElementId,\n  cssBaseline = \"global\",\n  cssTheme = \"global\",\n  themes,\n  theme,\n  colorMode,\n  emotionCache: emotionCacheProp,\n  classNameKey = defaultCacheKey,\n}: HvProviderProps) => {\n  const generatedId = useUniqueId();\n  const scopedRootId = `${scopedRootPrefix}-${generatedId}`;\n\n  // Themes\n  const themesList: (HvTheme | HvThemeStructure)[] = processThemes(themes);\n\n  // Emotion cache\n  // Moves UI Kit styles to the top of the <head> so they're loaded first\n  // This enables users to override the UI Kit styles if necessary\n  const emotionCache = useMemo(() => {\n    if (emotionCacheProp) return emotionCacheProp;\n    // reuse the default shared cache if `classNameKey` is the same\n    if (classNameKey === defaultCacheKey) return defaultEmotionCache;\n\n    return createCache({ key: classNameKey, prepend: true });\n  }, [classNameKey, emotionCacheProp]);\n\n  return (\n    <CacheProvider value={emotionCache}>\n      <Global\n        styles={cssReact`\n          ${\n            cssBaseline === \"global\" && {\n              [`@layer hv-uikit-baseline`]: {\n                ...CssBaseline,\n              },\n            }\n          }\n          ${getThemesVars(themesList)}\n        `}\n      />\n      <HvThemeProvider\n        themes={themesList}\n        theme={theme || themesList[0].name}\n        emotionCache={emotionCache}\n        colorMode={colorMode || Object.keys(themesList[0].colors.modes)[0]}\n        themeRootId={\n          cssTheme === \"scoped\" ? rootElementId || scopedRootId : undefined\n        }\n      >\n        <ClassNames>\n          {({ css }) => {\n            if (cssBaseline === \"scoped\") {\n              const rootElement = getElementById(rootElementId);\n\n              if (rootElement) {\n                rootElement.classList.add(\n                  css({\n                    [`@layer ${rootElementId}-baseline`]: {\n                      ...CssScopedBaseline,\n                    },\n                  }),\n                );\n              }\n            }\n\n            return (cssTheme === \"scoped\" || cssBaseline === \"scoped\") &&\n              !rootElementId ? (\n              <div\n                id={scopedRootId}\n                className={\n                  cssBaseline === \"scoped\"\n                    ? css({\n                        [`@layer ${rootElementId}-baseline`]: {\n                          ...CssScopedBaseline,\n                        },\n                      })\n                    : undefined\n                }\n              >\n                {children}\n              </div>\n            ) : (\n              children\n            );\n          }}\n        </ClassNames>\n      </HvThemeProvider>\n    </CacheProvider>\n  );\n};\n"],"names":["cssReact","css"],"mappings":";;;;;;;;;;AAqFA,MAAM,mBAAmB;AAKlB,MAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd,eAAe;AACjB,MAAuB;AACrB,QAAM,cAAc;AACpB,QAAM,eAAe,GAAG,gBAAgB,IAAI,WAAW;AAGjD,QAAA,aAA6C,cAAc,MAAM;AAKjE,QAAA,eAAe,QAAQ,MAAM;AAC7B,QAAA;AAAyB,aAAA;AAE7B,QAAI,iBAAiB;AAAwB,aAAA;AAE7C,WAAO,YAAY,EAAE,KAAK,cAAc,SAAS,MAAM;AAAA,EAAA,GACtD,CAAC,cAAc,gBAAgB,CAAC;AAGjC,SAAA,qBAAC,eAAc,EAAA,OAAO,cACpB,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,QAAQA;AAAAA,YAEJ,gBAAgB,YAAY;AAAA,UAC1B,CAAC,0BAA0B,GAAG;AAAA,YAC5B,GAAG;AAAA,UACL;AAAA,QAAA,CAEJ;AAAA,YACE,cAAc,UAAU,CAAC;AAAA;AAAA,MAAA;AAAA,IAE/B;AAAA,IACA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,QAAQ;AAAA,QACR,OAAO,SAAS,WAAW,CAAC,EAAE;AAAA,QAC9B;AAAA,QACA,WAAW,aAAa,OAAO,KAAK,WAAW,CAAC,EAAE,OAAO,KAAK,EAAE,CAAC;AAAA,QACjE,aACE,aAAa,WAAW,iBAAiB,eAAe;AAAA,QAG1D,UAAC,oBAAA,YAAA,EACE,UAAC,CAAA,EAAE,KAAAC,WAAU;AACZ,cAAI,gBAAgB,UAAU;AACtB,kBAAA,cAAc,eAAe,aAAa;AAEhD,gBAAI,aAAa;AACf,0BAAY,UAAU;AAAA,gBACpBA,KAAI;AAAA,kBACF,CAAC,UAAU,aAAa,WAAW,GAAG;AAAA,oBACpC,GAAG;AAAA,kBACL;AAAA,gBAAA,CACD;AAAA,cAAA;AAAA,YAEL;AAAA,UACF;AAEA,kBAAQ,aAAa,YAAY,gBAAgB,aAC/C,CAAC,gBACD;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,IAAI;AAAA,cACJ,WACE,gBAAgB,WACZA,KAAI;AAAA,gBACF,CAAC,UAAU,aAAa,WAAW,GAAG;AAAA,kBACpC,GAAG;AAAA,gBACL;AAAA,cACD,CAAA,IACD;AAAA,cAGL;AAAA,YAAA;AAAA,UAGH,IAAA;AAAA,QAAA,GAGN;AAAA,MAAA;AAAA,IACF;AAAA,EACF,EAAA,CAAA;AAEJ;"}

package/dist/esm/providers/ThemeProvider.js

@@ -1,9 +1,9 @@
 import { jsx } from "@emotion/react/jsx-runtime";
 import { useState, useEffect, useCallback, useMemo } from "react";
-import { parseTheme } from "@hitachivantara/uikit-styles";
+import { createTheme, ThemeProvider } from "@mui/material/styles";
 import { HvThemeContext, EmotionContext } from "@hitachivantara/uikit-react-shared";
 import { EmotionContext as EmotionContext2, HvThemeContext as HvThemeContext2, defaultCacheKey, defaultEmotionCache } from "@hitachivantara/uikit-react-shared";
-import { createTheme, ThemeProvider } from "@mui/material/styles";
+import { parseTheme } from "@hitachivantara/uikit-styles";
 import { setElementAttrs } from "../utils/theme.js";
 const HvThemeProvider = ({
   children,

package/dist/esm/providers/ThemeProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.js","sources":["../../../src/providers/ThemeProvider.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useState } from \"react\";\n\nimport { parseTheme, HvThemeStructure } from \"@hitachivantara/uikit-styles\";\nimport {\n  HvThemeContext,\n  defaultCacheKey,\n  defaultEmotionCache,\n  EmotionContext,\n} from \"@hitachivantara/uikit-react-shared\";\nimport type { HvThemeContextValue } from \"@hitachivantara/uikit-react-shared\";\n\nimport {\n  createTheme,\n  ThemeProvider as MuiThemeProvider,\n} from \"@mui/material/styles\";\n\nimport { EmotionCache } from \"@emotion/cache\";\n\nimport { setElementAttrs } from \"../utils/theme\";\nimport { HvTheme } from \"../types/theme\";\n\nexport { HvThemeContext };\nexport type { HvThemeContextValue };\n\nexport { defaultCacheKey, defaultEmotionCache, EmotionContext };\n\ninterface HvThemeProviderProps {\n  children: React.ReactNode;\n  themes: (HvTheme | HvThemeStructure)[];\n  theme: string;\n  emotionCache: EmotionCache;\n  colorMode: string;\n  themeRootId?: string;\n}\n\nexport const HvThemeProvider = ({\n  children,\n  themes: themesList,\n  theme,\n  emotionCache,\n  colorMode,\n  themeRootId: rootId,\n}: HvThemeProviderProps) => {\n  const initTheme = parseTheme(themesList, theme, colorMode);\n\n  const [parsedTheme, setParsedTheme] = useState(initTheme);\n  const [activeTheme, setActiveTheme] = useState(parsedTheme.theme);\n  const [selectedTheme, setSelectedTheme] = useState(parsedTheme.selectedTheme);\n  const [selectedMode, setThemeMode] = useState(parsedTheme.selectedMode);\n  const [colorModes, setColorModes] = useState(parsedTheme.colorModes);\n  const [themes, setThemes] = useState(themesList.map((t) => t.name));\n\n  useEffect(() => {\n    const pTheme = parseTheme(themesList, theme, colorMode);\n    setThemes(themesList.map((t) => t.name));\n    setParsedTheme(pTheme);\n  }, [themesList, theme, colorMode]);\n\n  useEffect(() => {\n    setActiveTheme(parsedTheme.theme);\n    setSelectedTheme(parsedTheme.selectedTheme);\n    setThemeMode(parsedTheme.selectedMode);\n    setColorModes(parsedTheme.colorModes);\n\n    setElementAttrs(\n      parsedTheme.selectedTheme,\n      parsedTheme.selectedMode,\n      parsedTheme.colorScheme,\n      rootId\n    );\n  }, [parsedTheme, rootId]);\n\n  const changeTheme = useCallback(\n    (newTheme = selectedTheme, newMode = selectedMode) => {\n      const pTheme = parseTheme(themesList, newTheme, newMode);\n      setParsedTheme(pTheme);\n    },\n    [selectedMode, selectedTheme, themesList]\n  );\n\n  const value = useMemo<HvThemeContextValue>(\n    () => ({\n      themes,\n      colorModes,\n      activeTheme: activeTheme as HvTheme,\n      selectedTheme,\n      selectedMode,\n      changeTheme,\n      rootId,\n    }),\n    [\n      themes,\n      colorModes,\n      activeTheme,\n      selectedTheme,\n      selectedMode,\n      changeTheme,\n      rootId,\n    ]\n  );\n\n  const MuiTheme = createTheme({\n    breakpoints: {\n      values: {\n        ...activeTheme.breakpoints.values,\n      },\n    },\n  });\n\n  const emotionCacheValue = useMemo(\n    () => ({ cache: emotionCache }),\n    [emotionCache]\n  );\n\n  return (\n    <MuiThemeProvider theme={MuiTheme}>\n      <HvThemeContext.Provider value={value}>\n        <EmotionContext.Provider value={emotionCacheValue}>\n          {children}\n        </EmotionContext.Provider>\n      </HvThemeContext.Provider>\n    </MuiThemeProvider>\n  );\n};\n"],"names":["MuiThemeProvider"],"mappings":";;;;;;;AAmCO,MAAM,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AACf,MAA4B;AAC1B,QAAM,YAAY,WAAW,YAAY,OAAO,SAAS;AAEzD,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,SAAS;AACxD,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,YAAY,KAAK;AAChE,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAS,YAAY,aAAa;AAC5E,QAAM,CAAC,cAAc,YAAY,IAAI,SAAS,YAAY,YAAY;AACtE,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,YAAY,UAAU;AAC7D,QAAA,CAAC,QAAQ,SAAS,IAAI,SAAS,WAAW,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC;AAElE,YAAU,MAAM;AACd,UAAM,SAAS,WAAW,YAAY,OAAO,SAAS;AACtD,cAAU,WAAW,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC;AACvC,mBAAe,MAAM;AAAA,EACpB,GAAA,CAAC,YAAY,OAAO,SAAS,CAAC;AAEjC,YAAU,MAAM;AACd,mBAAe,YAAY,KAAK;AAChC,qBAAiB,YAAY,aAAa;AAC1C,iBAAa,YAAY,YAAY;AACrC,kBAAc,YAAY,UAAU;AAEpC;AAAA,MACE,YAAY;AAAA,MACZ,YAAY;AAAA,MACZ,YAAY;AAAA,MACZ;AAAA,IAAA;AAAA,EACF,GACC,CAAC,aAAa,MAAM,CAAC;AAExB,QAAM,cAAc;AAAA,IAClB,CAAC,WAAW,eAAe,UAAU,iBAAiB;AACpD,YAAM,SAAS,WAAW,YAAY,UAAU,OAAO;AACvD,qBAAe,MAAM;AAAA,IACvB;AAAA,IACA,CAAC,cAAc,eAAe,UAAU;AAAA,EAAA;AAG1C,QAAM,QAAQ;AAAA,IACZ,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAEF;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EAAA;AAGF,QAAM,WAAW,YAAY;AAAA,IAC3B,aAAa;AAAA,MACX,QAAQ;AAAA,QACN,GAAG,YAAY,YAAY;AAAA,MAC7B;AAAA,IACF;AAAA,EAAA,CACD;AAED,QAAM,oBAAoB;AAAA,IACxB,OAAO,EAAE,OAAO;IAChB,CAAC,YAAY;AAAA,EAAA;AAGf,6BACGA,eAAiB,EAAA,OAAO,UACvB,UAAA,oBAAC,eAAe,UAAf,EAAwB,OACvB,UAAA,oBAAC,eAAe,UAAf,EAAwB,OAAO,mBAC7B,SACH,CAAA,GACF,EACF,CAAA;AAEJ;"}
+{"version":3,"file":"ThemeProvider.js","sources":["../../../src/providers/ThemeProvider.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { EmotionCache } from \"@emotion/cache\";\nimport {\n  createTheme,\n  ThemeProvider as MuiThemeProvider,\n} from \"@mui/material/styles\";\nimport {\n  defaultCacheKey,\n  defaultEmotionCache,\n  EmotionContext,\n  HvThemeContext,\n  type HvThemeContextValue,\n} from \"@hitachivantara/uikit-react-shared\";\nimport { HvThemeStructure, parseTheme } from \"@hitachivantara/uikit-styles\";\n\nimport { HvTheme } from \"../types/theme\";\nimport { setElementAttrs } from \"../utils/theme\";\n\nexport { HvThemeContext };\nexport type { HvThemeContextValue };\n\nexport { defaultCacheKey, defaultEmotionCache, EmotionContext };\n\ninterface HvThemeProviderProps {\n  children: React.ReactNode;\n  themes: (HvTheme | HvThemeStructure)[];\n  theme: string;\n  emotionCache: EmotionCache;\n  colorMode: string;\n  themeRootId?: string;\n}\n\nexport const HvThemeProvider = ({\n  children,\n  themes: themesList,\n  theme,\n  emotionCache,\n  colorMode,\n  themeRootId: rootId,\n}: HvThemeProviderProps) => {\n  const initTheme = parseTheme(themesList, theme, colorMode);\n\n  const [parsedTheme, setParsedTheme] = useState(initTheme);\n  const [activeTheme, setActiveTheme] = useState(parsedTheme.theme);\n  const [selectedTheme, setSelectedTheme] = useState(parsedTheme.selectedTheme);\n  const [selectedMode, setThemeMode] = useState(parsedTheme.selectedMode);\n  const [colorModes, setColorModes] = useState(parsedTheme.colorModes);\n  const [themes, setThemes] = useState(themesList.map((t) => t.name));\n\n  useEffect(() => {\n    const pTheme = parseTheme(themesList, theme, colorMode);\n    setThemes(themesList.map((t) => t.name));\n    setParsedTheme(pTheme);\n  }, [themesList, theme, colorMode]);\n\n  useEffect(() => {\n    setActiveTheme(parsedTheme.theme);\n    setSelectedTheme(parsedTheme.selectedTheme);\n    setThemeMode(parsedTheme.selectedMode);\n    setColorModes(parsedTheme.colorModes);\n\n    setElementAttrs(\n      parsedTheme.selectedTheme,\n      parsedTheme.selectedMode,\n      parsedTheme.colorScheme,\n      rootId,\n    );\n  }, [parsedTheme, rootId]);\n\n  const changeTheme = useCallback(\n    (newTheme = selectedTheme, newMode = selectedMode) => {\n      const pTheme = parseTheme(themesList, newTheme, newMode);\n      setParsedTheme(pTheme);\n    },\n    [selectedMode, selectedTheme, themesList],\n  );\n\n  const value = useMemo<HvThemeContextValue>(\n    () => ({\n      themes,\n      colorModes,\n      activeTheme: activeTheme as HvTheme,\n      selectedTheme,\n      selectedMode,\n      changeTheme,\n      rootId,\n    }),\n    [\n      themes,\n      colorModes,\n      activeTheme,\n      selectedTheme,\n      selectedMode,\n      changeTheme,\n      rootId,\n    ],\n  );\n\n  const MuiTheme = createTheme({\n    breakpoints: {\n      values: {\n        ...activeTheme.breakpoints.values,\n      },\n    },\n  });\n\n  const emotionCacheValue = useMemo(\n    () => ({ cache: emotionCache }),\n    [emotionCache],\n  );\n\n  return (\n    <MuiThemeProvider theme={MuiTheme}>\n      <HvThemeContext.Provider value={value}>\n        <EmotionContext.Provider value={emotionCacheValue}>\n          {children}\n        </EmotionContext.Provider>\n      </HvThemeContext.Provider>\n    </MuiThemeProvider>\n  );\n};\n"],"names":["MuiThemeProvider"],"mappings":";;;;;;;AAgCO,MAAM,kBAAkB,CAAC;AAAA,EAC9B;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AACf,MAA4B;AAC1B,QAAM,YAAY,WAAW,YAAY,OAAO,SAAS;AAEzD,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,SAAS;AACxD,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,YAAY,KAAK;AAChE,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAS,YAAY,aAAa;AAC5E,QAAM,CAAC,cAAc,YAAY,IAAI,SAAS,YAAY,YAAY;AACtE,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,YAAY,UAAU;AAC7D,QAAA,CAAC,QAAQ,SAAS,IAAI,SAAS,WAAW,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC;AAElE,YAAU,MAAM;AACd,UAAM,SAAS,WAAW,YAAY,OAAO,SAAS;AACtD,cAAU,WAAW,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC;AACvC,mBAAe,MAAM;AAAA,EACpB,GAAA,CAAC,YAAY,OAAO,SAAS,CAAC;AAEjC,YAAU,MAAM;AACd,mBAAe,YAAY,KAAK;AAChC,qBAAiB,YAAY,aAAa;AAC1C,iBAAa,YAAY,YAAY;AACrC,kBAAc,YAAY,UAAU;AAEpC;AAAA,MACE,YAAY;AAAA,MACZ,YAAY;AAAA,MACZ,YAAY;AAAA,MACZ;AAAA,IAAA;AAAA,EACF,GACC,CAAC,aAAa,MAAM,CAAC;AAExB,QAAM,cAAc;AAAA,IAClB,CAAC,WAAW,eAAe,UAAU,iBAAiB;AACpD,YAAM,SAAS,WAAW,YAAY,UAAU,OAAO;AACvD,qBAAe,MAAM;AAAA,IACvB;AAAA,IACA,CAAC,cAAc,eAAe,UAAU;AAAA,EAAA;AAG1C,QAAM,QAAQ;AAAA,IACZ,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAEF;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EAAA;AAGF,QAAM,WAAW,YAAY;AAAA,IAC3B,aAAa;AAAA,MACX,QAAQ;AAAA,QACN,GAAG,YAAY,YAAY;AAAA,MAC7B;AAAA,IACF;AAAA,EAAA,CACD;AAED,QAAM,oBAAoB;AAAA,IACxB,OAAO,EAAE,OAAO;IAChB,CAAC,YAAY;AAAA,EAAA;AAGf,6BACGA,eAAiB,EAAA,OAAO,UACvB,UAAA,oBAAC,eAAe,UAAf,EAAwB,OACvB,UAAA,oBAAC,eAAe,UAAf,EAAwB,OAAO,mBAC7B,SACH,CAAA,GACF,EACF,CAAA;AAEJ;"}

package/dist/esm/types/generic.js.map

@@ -1 +1 @@
-{"version":3,"file":"generic.js","sources":["../../../src/types/generic.ts"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport type {\n  HvExtraProps,\n  HvExtraDeepProps,\n} from \"@hitachivantara/uikit-react-shared\";\n\nexport type { HvExtraProps, HvExtraDeepProps };\n\ntype AsProp<C extends React.ElementType> = {\n  /** Custom element type to override the root component */\n  component?: C;\n};\n\ntype PropsToOmit<C extends React.ElementType, P> = keyof (AsProp<C> & P);\n\n// Workaround to fix the use of Omit with ComponentPropsWithoutRef\n// Without this the event handlers return any instead of the type for the chosen element\ntype FixComponentProps<T> = T extends any ? T : never;\n\ntype PolymorphicComponent<\n  C extends React.ElementType,\n  Props = {}\n> = React.PropsWithChildren<Props & AsProp<C>> &\n  FixComponentProps<\n    Omit<React.ComponentPropsWithoutRef<C>, PropsToOmit<C, Props>>\n  >;\n\nexport type PolymorphicRef<C extends React.ElementType> =\n  React.ComponentPropsWithRef<C>[\"ref\"];\n\nexport type PolymorphicComponentRef<\n  C extends React.ElementType,\n  Props = {}\n> = PolymorphicComponent<C, Props> & { ref?: PolymorphicRef<C> };\n\n/** HV Base Props. Extends `React.HTMLAttributes` of an element `E`, and filters `K` keys. */\nexport type HvBaseProps<\n  E extends HTMLElement = HTMLDivElement,\n  K extends keyof React.HTMLAttributes<E> = never\n> = Omit<React.HTMLAttributes<E>, K>;\n\n/** This type allows to do a deep partial by applying the Partial type to each key recursively */\nexport type DeepPartial<T> = T extends Object\n  ? Partial<{\n      [P in keyof T]: DeepPartial<T[P]>;\n    }>\n  : T;\n\n/** This type combines the HvExtraProps and DeepPartial types */\nexport type HvExtraDeepPartialProps<T> = Partial<{\n  [P in keyof T]: DeepPartial<T[P]> & HvExtraProps;\n}> &\n  HvExtraProps;\n\nexport type Arrayable<T> = T | T[];\n\n/** React.forwardRef with fixed type declarations */\nexport function fixedForwardRef<T, P = {}>(\n  // TODO: change `React.ReactElement | null` to `React.ReactNode` in typescript@5\n  render: (props: P, ref: React.Ref<T>) => React.ReactElement | null\n): (props: P & React.RefAttributes<T>) => React.ReactElement | null {\n  return forwardRef(render) as any;\n}\n\n// Source code from: https://github.com/piotrwitek/utility-types/blob/master/src/mapped-types.ts\n/**\n * Optional\n * @desc From `T` make a set of properties by key `K` become optional\n * @example\n *    type Props = {\n *      name: string;\n *      age: number;\n *      visible: boolean;\n *    };\n *\n *    // Expect: { name?: string; age?: number; visible?: boolean; }\n *    type Props = Optional<Props>;\n *\n *    // Expect: { name: string; age?: number; visible?: boolean; }\n *    type Props = Optional<Props, 'age' | 'visible'>;\n */\nexport type HvOptional<T extends object, K extends keyof T = keyof T> = Omit<\n  T,\n  K\n> &\n  Partial<Pick<T, K>>;\n"],"names":[],"mappings":";AA0DO,SAAS,gBAEd,QACkE;AAClE,SAAO,WAAW,MAAM;AAC1B;"}
+{"version":3,"file":"generic.js","sources":["../../../src/types/generic.ts"],"sourcesContent":["import { forwardRef } from \"react\";\nimport type {\n  HvExtraDeepProps,\n  HvExtraProps,\n} from \"@hitachivantara/uikit-react-shared\";\n\nexport type { HvExtraProps, HvExtraDeepProps };\n\ntype AsProp<C extends React.ElementType> = {\n  /** Custom element type to override the root component */\n  component?: C;\n};\n\ntype PropsToOmit<C extends React.ElementType, P> = keyof (AsProp<C> & P);\n\n// Workaround to fix the use of Omit with ComponentPropsWithoutRef\n// Without this the event handlers return any instead of the type for the chosen element\ntype FixComponentProps<T> = T extends any ? T : never;\n\ntype PolymorphicComponent<\n  C extends React.ElementType,\n  Props = {},\n> = React.PropsWithChildren<Props & AsProp<C>> &\n  FixComponentProps<\n    Omit<React.ComponentPropsWithoutRef<C>, PropsToOmit<C, Props>>\n  >;\n\nexport type PolymorphicRef<C extends React.ElementType> =\n  React.ComponentPropsWithRef<C>[\"ref\"];\n\nexport type PolymorphicComponentRef<\n  C extends React.ElementType,\n  Props = {},\n> = PolymorphicComponent<C, Props> & { ref?: PolymorphicRef<C> };\n\n/** HV Base Props. Extends `React.HTMLAttributes` of an element `E`, and filters `K` keys. */\nexport type HvBaseProps<\n  E extends HTMLElement = HTMLDivElement,\n  K extends keyof React.HTMLAttributes<E> = never,\n> = Omit<React.HTMLAttributes<E>, K>;\n\n/** This type allows to do a deep partial by applying the Partial type to each key recursively */\nexport type DeepPartial<T> = T extends Object\n  ? Partial<{\n      [P in keyof T]: DeepPartial<T[P]>;\n    }>\n  : T;\n\n/** This type combines the HvExtraProps and DeepPartial types */\nexport type HvExtraDeepPartialProps<T> = Partial<{\n  [P in keyof T]: DeepPartial<T[P]> & HvExtraProps;\n}> &\n  HvExtraProps;\n\nexport type Arrayable<T> = T | T[];\n\n/** React.forwardRef with fixed type declarations */\nexport function fixedForwardRef<T, P = {}>(\n  // TODO: change `React.ReactElement | null` to `React.ReactNode` in typescript@5\n  render: (props: P, ref: React.Ref<T>) => React.ReactElement | null,\n): (props: P & React.RefAttributes<T>) => React.ReactElement | null {\n  return forwardRef(render) as any;\n}\n\n// Source code from: https://github.com/piotrwitek/utility-types/blob/master/src/mapped-types.ts\n/**\n * Optional\n * @desc From `T` make a set of properties by key `K` become optional\n * @example\n *    type Props = {\n *      name: string;\n *      age: number;\n *      visible: boolean;\n *    };\n *\n *    // Expect: { name?: string; age?: number; visible?: boolean; }\n *    type Props = Optional<Props>;\n *\n *    // Expect: { name: string; age?: number; visible?: boolean; }\n *    type Props = Optional<Props, 'age' | 'visible'>;\n */\nexport type HvOptional<T extends object, K extends keyof T = keyof T> = Omit<\n  T,\n  K\n> &\n  Partial<Pick<T, K>>;\n"],"names":[],"mappings":";AAyDO,SAAS,gBAEd,QACkE;AAClE,SAAO,WAAW,MAAM;AAC1B;"}