@hitachivantara/uikit-react-core 5.0.0-next.8 → 5.0.0

package/dist/cjs/hooks/useControlled.cjs

@@ -1,5 +1,5 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
 const useControlled = (controlledProp, initialState) => {
   const {

package/dist/cjs/hooks/useEnhancedEffect.cjs

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const React = require("react");
+const useEnhancedEffect = typeof window !== "undefined" ? React.useLayoutEffect : React.useEffect;
+exports.useEnhancedEffect = useEnhancedEffect;
+//# sourceMappingURL=useEnhancedEffect.cjs.map

package/dist/cjs/hooks/useEnhancedEffect.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useEnhancedEffect.cjs","sources":["../../../src/hooks/useEnhancedEffect.ts"],"sourcesContent":["import { useEffect, useLayoutEffect } from \"react\";\n\nexport const useEnhancedEffect =\n  typeof window !== \"undefined\" ? useLayoutEffect : useEffect;\n"],"names":["useEnhancedEffect","window","useLayoutEffect","useEffect"],"mappings":";;;AAEO,MAAMA,oBACX,OAAOC,WAAW,cAAcC,wBAAkBC,MAAAA;;"}

package/dist/cjs/hooks/useImageLoaded.cjs

@@ -1,5 +1,5 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
 const useImageLoaded = (src, srcSet) => {
   const [imageLoaded, setImageLoaded] = React.useState(false);

package/dist/cjs/hooks/useLabels.cjs

@@ -1,5 +1,5 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const React__default = /* @__PURE__ */ _interopDefault(React);

package/dist/cjs/hooks/useSelectionPath.cjs

@@ -1,5 +1,5 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
 const getSelectionPath = (data, selectedId, selection = [], idx = -1, parent = []) => {
   data == null ? void 0 : data.forEach((item, i) => {

package/dist/cjs/hooks/useSelectionPath.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useSelectionPath.cjs","sources":["../../../src/hooks/useSelectionPath.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { HvHeaderNavigationItemProp } from \"components\";\n\nconst getSelectionPath = (\n  data: HvHeaderNavigationItemProp[] | undefined,\n  selectedId: string,\n  selection: string[] = [],\n  idx: number = -1,\n  parent: HvHeaderNavigationItemProp[] = []\n): string[] => {\n  data?.forEach((item: HvHeaderNavigationItemProp, i) => {\n    const hasData = item.data && item.data.length;\n    const isSelected = item.id === selectedId;\n\n    if (isSelected)\n      selection.push(...(idx > -1 ? [parent[idx].id] : []), item.id);\n    if (hasData) getSelectionPath(item.data, selectedId, selection, i, data);\n  });\n\n  return selection;\n};\n\nexport const useSelectionPath = (data, selectedId): string[] => {\n  const [selectionPath, setSelectionPath] = useState<string[]>([]);\n\n  useEffect(() => {\n    const path = getSelectionPath(data, selectedId);\n    setSelectionPath(path);\n  }, [data, selectedId]);\n\n  return selectionPath;\n};\n"],"names":["getSelectionPath","data","selectedId","selection","idx","parent","forEach","item","i","hasData","length","isSelected","id","push","useSelectionPath","selectionPath","setSelectionPath","useState","useEffect","path"],"mappings":";;;AAGA,MAAMA,mBAAmBA,CACvBC,MACAC,YACAC,YAAsB,IACtBC,MAAc,IACdC,SAAuC,OAC1B;AACPC,+BAAAA,QAAQ,CAACC,MAAkCC,MAAM;AACrD,UAAMC,UAAUF,KAAKN,QAAQM,KAAKN,KAAKS;AACjCC,UAAAA,aAAaJ,KAAKK,OAAOV;AAE3BS,QAAAA;AACFR,gBAAUU,KAAK,GAAIT,MAAM,KAAK,CAACC,OAAOD,KAAKQ,EAAE,IAAI,CAAKL,GAAAA,KAAKK,EAAE;AAC3DH,QAAAA;AAAST,uBAAiBO,KAAKN,MAAMC,YAAYC,WAAWK,GAAGP,IAAI;AAAA,EAAA;AAGlEE,SAAAA;AACT;AAEaW,MAAAA,mBAAmBA,CAACb,MAAMC,eAAyB;AAC9D,QAAM,CAACa,eAAeC,gBAAgB,IAAIC,MAAAA,SAAmB,CAAE,CAAA;AAE/DC,QAAAA,UAAU,MAAM;AACRC,UAAAA,OAAOnB,iBAAiBC,MAAMC,UAAU;AAC9Cc,qBAAiBG,IAAI;AAAA,EAAA,GACpB,CAAClB,MAAMC,UAAU,CAAC;AAEda,SAAAA;AACT;;"}
+{"version":3,"file":"useSelectionPath.cjs","sources":["../../../src/hooks/useSelectionPath.ts"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { HvHeaderNavigationItemProp } from \"components\";\n\nconst getSelectionPath = (\n  data: HvHeaderNavigationItemProp[] | undefined,\n  selectedId: string,\n  selection: string[] = [],\n  idx: number = -1,\n  parent: HvHeaderNavigationItemProp[] = []\n): string[] => {\n  data?.forEach((item: HvHeaderNavigationItemProp, i) => {\n    const hasData = item.data && item.data.length;\n    const isSelected = item.id === selectedId;\n\n    if (isSelected)\n      selection.push(...(idx > -1 ? [parent[idx].id] : []), item.id);\n    if (hasData) getSelectionPath(item.data, selectedId, selection, i, data);\n  });\n\n  return selection;\n};\n\nexport const useSelectionPath = (data, selectedId): string[] => {\n  const [selectionPath, setSelectionPath] = useState<string[]>([]);\n\n  useEffect(() => {\n    const path = getSelectionPath(data, selectedId);\n    setSelectionPath(path);\n  }, [data, selectedId]);\n\n  return selectionPath;\n};\n"],"names":["getSelectionPath","data","selectedId","selection","idx","parent","forEach","item","i","hasData","length","isSelected","id","push","useSelectionPath","selectionPath","setSelectionPath","useState","useEffect","path"],"mappings":";;;AAGA,MAAMA,mBAAmBA,CACvBC,MACAC,YACAC,YAAsB,IACtBC,MAAc,IACdC,SAAuC,OAC1B;AACPC,+BAAAA,QAAQ,CAACC,MAAkCC,MAAM;AACrD,UAAMC,UAAUF,KAAKN,QAAQM,KAAKN,KAAKS;AACjCC,UAAAA,aAAaJ,KAAKK,OAAOV;AAE3BS,QAAAA;AACFR,gBAAUU,KAAK,GAAIT,MAAM,KAAK,CAACC,OAAOD,GAAG,EAAEQ,EAAE,IAAI,CAAE,GAAGL,KAAKK,EAAE;AAC3DH,QAAAA;AAAST,uBAAiBO,KAAKN,MAAMC,YAAYC,WAAWK,GAAGP,IAAI;AAAA,EAAA;AAGlEE,SAAAA;AACT;AAEaW,MAAAA,mBAAmBA,CAACb,MAAMC,eAAyB;AAC9D,QAAM,CAACa,eAAeC,gBAAgB,IAAIC,MAAAA,SAAmB,CAAE,CAAA;AAE/DC,QAAAA,UAAU,MAAM;AACRC,UAAAA,OAAOnB,iBAAiBC,MAAMC,UAAU;AAC9Cc,qBAAiBG,IAAI;AAAA,EAAA,GACpB,CAAClB,MAAMC,UAAU,CAAC;AAEda,SAAAA;AACT;;"}

package/dist/cjs/hooks/useTheme.cjs

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const React = require("react");
+require("@hitachivantara/uikit-styles");
+const uikitReactShared = require("@hitachivantara/uikit-react-shared");
+require("@mui/material/styles");
+require("@emotion/react/jsx-runtime");
+const useTheme = () => {
+  return React.useContext(uikitReactShared.HvThemeContext);
+};
+exports.useTheme = useTheme;
+//# sourceMappingURL=useTheme.cjs.map

package/dist/cjs/hooks/useTheme.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTheme.cjs","sources":["../../../src/hooks/useTheme.ts"],"sourcesContent":["import {\n  HvThemeContext,\n  HvThemeContextValue,\n} from \"../providers/ThemeProvider\";\nimport { useContext } from \"react\";\n\nexport const useTheme = (): HvThemeContextValue => {\n  return useContext(HvThemeContext);\n};\n"],"names":["useTheme","useContext","HvThemeContext"],"mappings":";;;;;;;AAMO,MAAMA,WAAWA,MAA2B;AACjD,SAAOC,MAAAA,WAAWC,iBAAAA,cAAc;AAClC;;"}

package/dist/cjs/hooks/useUniqueId.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useUniqueId.cjs","sources":["../../../src/hooks/useUniqueId.ts"],"sourcesContent":["import { useState } from \"react\";\nimport uniqueId from \"lodash/uniqueId\";\n\nexport default (id, idPrefix) => useState(id || uniqueId(idPrefix))[0];\n"],"names":["id","idPrefix","useState","uniqueId"],"mappings":";;;;;;AAGA,MAAA,cAAe,CAACA,IAAIC,aAAaC,eAASF,MAAMG,kBAAAA,QAASF,QAAQ,CAAC,EAAE;;"}
+{"version":3,"file":"useUniqueId.cjs","sources":["../../../src/hooks/useUniqueId.ts"],"sourcesContent":["import { useState } from \"react\";\nimport uniqueId from \"lodash/uniqueId\";\n\nexport default (id, idPrefix) => useState(id || uniqueId(idPrefix))[0];\n"],"names":["id","idPrefix","useState","uniqueId"],"mappings":";;;;;;AAGA,MAAA,cAAe,CAACA,IAAIC,aAAaC,eAASF,MAAMG,kBAAAA,QAASF,QAAQ,CAAC,EAAE,CAAC;;"}

package/dist/cjs/hooks/useWidth.cjs

@@ -1,5 +1,5 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const material = require("@mui/material");
 const useWidth = () => {

package/dist/cjs/index.cjs

@@ -1,10 +1,11 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const useTable = require("./components/Table/hooks/useTable.cjs");
 require("./components/Table/hooks/useGlobalFilter.cjs");
 require("./components/Table/hooks/useFilters.cjs");
 const useForkRef = require("./hooks/useForkRef.cjs");
+const useComputation = require("./hooks/useComputation.cjs");
 const Random = require("./utils/Random.cjs");
 const typographyClasses = require("./components/Typography/typographyClasses.cjs");
 const Typography = require("./components/Typography/Typography.cjs");
@@ -81,9 +82,9 @@ const Actions$1 = require("./components/Header/Actions/Actions.cjs");
 const brandClasses = require("./components/Header/Brand/brandClasses.cjs");
 const Brand = require("./components/Header/Brand/Brand.cjs");
 const navigationClasses = require("./components/Header/Navigation/navigationClasses.cjs");
-const Navigation = require("./components/Header/Navigation/Navigation.cjs");
 const MenuBar = require("./components/Header/Navigation/MenuBar/MenuBar.cjs");
 const MenuItem = require("./components/Header/Navigation/MenuItem/MenuItem.cjs");
+const Navigation = require("./components/Header/Navigation/Navigation.cjs");
 const kpiClasses = require("./components/Kpi/kpiClasses.cjs");
 const Kpi = require("./components/Kpi/Kpi.cjs");
 const linkClasses = require("./components/Link/linkClasses.cjs");
@@ -151,18 +152,17 @@ const actionsGenericClasses = require("./components/ActionsGeneric/actionsGeneri
 const ActionsGeneric = require("./components/ActionsGeneric/ActionsGeneric.cjs");
 const breadCrumbClasses = require("./components/BreadCrumb/breadCrumbClasses.cjs");
 const BreadCrumb = require("./components/BreadCrumb/BreadCrumb.cjs");
-const pathElementClasses = require("./components/BreadCrumb/PathElement/pathElementClasses.cjs");
-const PathElement = require("./components/BreadCrumb/PathElement/PathElement.cjs");
-const pageClasses = require("./components/BreadCrumb/Page/pageClasses.cjs");
-const Page = require("./components/BreadCrumb/Page/Page.cjs");
 const dotPaginationClasses = require("./components/DotPagination/dotPaginationClasses.cjs");
 const DotPagination = require("./components/DotPagination/DotPagination.cjs");
 const bannerClasses = require("./components/Banner/bannerClasses.cjs");
 const Banner = require("./components/Banner/Banner.cjs");
-const SnackbarContentWrapper = require("./components/Snackbar/SnackbarContentWrapper/SnackbarContentWrapper.cjs");
+const bannerContentClasses = require("./components/Banner/BannerContent/bannerContentClasses.cjs");
+const BannerContent = require("./components/Banner/BannerContent/BannerContent.cjs");
+const snackbarClasses = require("./components/Snackbar/snackbarClasses.cjs");
+const Snackbar = require("./components/Snackbar/Snackbar.cjs");
 const SnackbarProvider = require("./components/Snackbar/SnackbarProvider/SnackbarProvider.cjs");
 const snackbarContentWrapperClasses = require("./components/Snackbar/SnackbarContentWrapper/snackbarContentWrapperClasses.cjs");
-const Snackbar = require("./components/Snackbar/Snackbar.cjs");
+const SnackbarContentWrapper = require("./components/Snackbar/SnackbarContentWrapper/SnackbarContentWrapper.cjs");
 const bulkActionsClasses = require("./components/BulkActions/bulkActionsClasses.cjs");
 const BulkActions = require("./components/BulkActions/BulkActions.cjs");
 const globalActionsClasses = require("./components/GlobalActions/globalActionsClasses.cjs");
@@ -207,6 +207,27 @@ const leftControlClasses = require("./components/Controls/LeftControl/leftContro
 const LeftControl = require("./components/Controls/LeftControl/LeftControl.cjs");
 const rightControlClasses = require("./components/Controls/RightControl/rightControlClasses.cjs");
 const RightControl = require("./components/Controls/RightControl/RightControl.cjs");
+const calendarClasses = require("./components/Calendar/calendarClasses.cjs");
+const Calendar = require("./components/Calendar/Calendar.cjs");
+const calendarHeaderClasses = require("./components/Calendar/CalendarHeader/calendarHeaderClasses.cjs");
+const CalendarHeader = require("./components/Calendar/CalendarHeader/CalendarHeader.cjs");
+const verticalNavigationClasses = require("./components/VerticalNavigation/verticalNavigationClasses.cjs");
+const VerticalNavigation = require("./components/VerticalNavigation/VerticalNavigation.cjs");
+const headerClasses$2 = require("./components/VerticalNavigation/Header/headerClasses.cjs");
+const Header$2 = require("./components/VerticalNavigation/Header/Header.cjs");
+const actionClasses$1 = require("./components/VerticalNavigation/Actions/actionClasses.cjs");
+const actionsClasses$2 = require("./components/VerticalNavigation/Actions/actionsClasses.cjs");
+const Actions$2 = require("./components/VerticalNavigation/Actions/Actions.cjs");
+const Action$1 = require("./components/VerticalNavigation/Actions/Action.cjs");
+const navigationClasses$1 = require("./components/VerticalNavigation/Navigation/navigationClasses.cjs");
+const Navigation$1 = require("./components/VerticalNavigation/Navigation/Navigation.cjs");
+const navigationSliderClasses = require("./components/VerticalNavigation/NavigationSlider/navigationSliderClasses.cjs");
+const NavigationSlider = require("./components/VerticalNavigation/NavigationSlider/NavigationSlider.cjs");
+const treeViewClasses = require("./components/VerticalNavigation/TreeView/treeViewClasses.cjs");
+const treeViewItemClasses = require("./components/VerticalNavigation/TreeView/treeViewItemClasses.cjs");
+const TreeView = require("./components/VerticalNavigation/TreeView/TreeView.cjs");
+const TreeViewItem = require("./components/VerticalNavigation/TreeView/TreeViewItem.cjs");
+const VerticalNavigationContext = require("./components/VerticalNavigation/VerticalNavigationContext.cjs");
 const useUniqueId = require("./hooks/useUniqueId.cjs");
 const useIsMounted = require("./hooks/useIsMounted.cjs");
 const useClickOutside = require("./hooks/useClickOutside.cjs");
@@ -215,7 +236,10 @@ const useImageLoaded = require("./hooks/useImageLoaded.cjs");
 const useSelectionPath = require("./hooks/useSelectionPath.cjs");
 const useWidth = require("./hooks/useWidth.cjs");
 const useLabels = require("./hooks/useLabels.cjs");
+const useTheme = require("./hooks/useTheme.cjs");
+const useEnhancedEffect = require("./hooks/useEnhancedEffect.cjs");
 const Provider = require("./providers/Provider.cjs");
+const uikitReactShared = require("@hitachivantara/uikit-react-shared");
 const ThemeProvider = require("./providers/ThemeProvider.cjs");
 const iconVariant = require("./utils/iconVariant.cjs");
 const hexToRgbA = require("./utils/hexToRgbA.cjs");
@@ -229,11 +253,17 @@ const sizes = require("./utils/sizes.cjs");
 const theme = require("./utils/theme.cjs");
 const setId = require("./utils/setId.cjs");
 const classes = require("./utils/classes.cjs");
+const focusableElementFinder = require("./utils/focusableElementFinder.cjs");
+const wrapperTooltip = require("./utils/wrapperTooltip.cjs");
 const withTooltip = require("./hocs/withTooltip.cjs");
 const withId = require("./hocs/withId.cjs");
-Object.defineProperty(exports, "makeTheme", {
+Object.defineProperty(exports, "ds3", {
+  enumerable: true,
+  get: () => uikitStyles.ds3
+});
+Object.defineProperty(exports, "ds5", {
   enumerable: true,
-  get: () => uikitStyles.makeTheme
+  get: () => uikitStyles.ds5
 });
 Object.defineProperty(exports, "theme", {
   enumerable: true,
@@ -246,6 +276,7 @@ Object.defineProperty(exports, "themes", {
 exports.useHvData = useTable.default;
 exports.useHvTable = useTable.default;
 exports.useForkRef = useForkRef.default;
+exports.useComputation = useComputation.default;
 exports.Random = Random.default;
 exports.typographyClasses = typographyClasses.default;
 exports.HvTypography = Typography.HvTypography;
@@ -305,20 +336,20 @@ exports.HvButton = Button.HvButton;
 exports.cardClasses = cardClasses.default;
 exports.HvCard = Card.HvCard;
 exports.cardHeaderClasses = headerClasses.default;
-exports.HvCardHeader = Header.HvHeader;
+exports.HvCardHeader = Header.HvCardHeader;
 exports.cardContentClasses = contentClasses.default;
-exports.HvCardContent = Content.HvContent;
+exports.HvCardContent = Content.HvCardContent;
 exports.cardMediaClasses = mediaClasses.default;
-exports.HvCardMedia = Media.HvMedia;
+exports.HvCardMedia = Media.HvCardMedia;
 exports.containerClasses = containerClasses.default;
 exports.HvContainer = Container.HvContainer;
 exports.dialogClasses = dialogClasses.default;
 exports.dialogTitleClasses = titleClasses.default;
-exports.HvDialogTitle = Title.HvTitle;
+exports.HvDialogTitle = Title.HvDialogTitle;
 exports.dialogContentClasses = contentClasses$1.default;
-exports.HvDialogContent = Content$1.HvContent;
+exports.HvDialogContent = Content$1.HvDialogContent;
 exports.dialogActionClasses = actionsClasses.default;
-exports.HvDialogActions = Actions.HvActions;
+exports.HvDialogActions = Actions.HvDialogActions;
 exports.HvDialog = Dialog.HvDialog;
 exports.emptyStateClasses = emptyStateClasses.default;
 exports.HvEmptyState = EmptyState.HvEmptyState;
@@ -329,13 +360,13 @@ exports.HvGrid = Grid.HvGrid;
 exports.headerClasses = headerClasses$1.default;
 exports.HvHeader = Header$1.HvHeader;
 exports.headerActionsClasses = actionsClasses$1.default;
-exports.HvHeaderActions = Actions$1.HvActions;
+exports.HvHeaderActions = Actions$1.HvHeaderActions;
 exports.headerBrandClasses = brandClasses.default;
-exports.HvHeaderBrand = Brand.HvBrand;
+exports.HvHeaderBrand = Brand.HvHeaderBrand;
 exports.headerNavigationClasses = navigationClasses.default;
-exports.HvHeaderNavigation = Navigation.HvNavigation;
 exports.HvHeaderMenuBar = MenuBar.HvMenuBar;
 exports.HvHeaderMenuItem = MenuItem.HvMenuItem;
+exports.HvHeaderNavigation = Navigation.HvHeaderNavigation;
 exports.kpiClasses = kpiClasses.default;
 exports.HvKpi = Kpi.HvKpi;
 exports.linkClasses = linkClasses.default;
@@ -370,7 +401,7 @@ exports.getSelectorIcons = BaseRadio.getSelectorIcons;
 exports.appSwitcherClasses = appSwitcherClasses.default;
 exports.HvAppSwitcher = AppSwitcher.HvAppSwitcher;
 exports.appSwitcherActionClasses = actionClasses.default;
-exports.HvAppSwitcherAction = Action.HvAction;
+exports.HvAppSwitcherAction = Action.HvAppSwitcherAction;
 exports.baseSwitchClasses = baseSwitchClasses.default;
 exports.HvBaseSwitch = BaseSwitch.HvBaseSwitch;
 exports.checkBoxClasses = checkBoxClasses.default;
@@ -404,19 +435,18 @@ exports.actionsGenericClasses = actionsGenericClasses.default;
 exports.HvActionsGeneric = ActionsGeneric.HvActionsGeneric;
 exports.breadCrumbClasses = breadCrumbClasses.default;
 exports.HvBreadCrumb = BreadCrumb.HvBreadCrumb;
-exports.pathElementClasses = pathElementClasses.default;
-exports.HvPathElement = PathElement.HvPathElement;
-exports.pageClasses = pageClasses.default;
-exports.HvPage = Page.HvPage;
 exports.dotPaginationClasses = dotPaginationClasses.default;
 exports.HvDotPagination = DotPagination.HvDotPagination;
 exports.bannerClasses = bannerClasses.default;
 exports.HvBanner = Banner.HvBanner;
-exports.HvSnackbarContent = SnackbarContentWrapper.default;
+exports.bannerContentClasses = bannerContentClasses.default;
+exports.HvBannerContent = BannerContent.HvBannerContent;
+exports.snackbarClasses = snackbarClasses.default;
+exports.HvSnackbar = Snackbar.HvSnackbar;
 exports.HvSnackbarProvider = SnackbarProvider.default;
 exports.useHvSnackbar = SnackbarProvider.useHvSnackbar;
-exports.snackbarContentWrapperClasses = snackbarContentWrapperClasses.default;
-exports.HvSnackbar = Snackbar.HvSnackbar;
+exports.snackbarContentClasses = snackbarContentWrapperClasses.default;
+exports.HvSnackbarContent = SnackbarContentWrapper.default;
 exports.bulkActionsClasses = bulkActionsClasses.default;
 exports.HvBulkActions = BulkActions.HvBulkActions;
 exports.globalActionsClasses = globalActionsClasses.default;
@@ -495,6 +525,27 @@ exports.leftControlClasses = leftControlClasses.default;
 exports.HvLeftControl = LeftControl.HvLeftControl;
 exports.rightControlClasses = rightControlClasses.default;
 exports.HvRightControl = RightControl.HvRightControl;
+exports.calendarClasses = calendarClasses.default;
+exports.HvCalendar = Calendar.HvCalendar;
+exports.calendarHeaderClasses = calendarHeaderClasses.default;
+exports.HvCalendarHeader = CalendarHeader.HvCalendarHeader;
+exports.verticalNavigationClasses = verticalNavigationClasses.default;
+exports.HvVerticalNavigation = VerticalNavigation.HvVerticalNavigation;
+exports.verticalNavigationHeaderClasses = headerClasses$2.default;
+exports.HvVerticalNavigationHeader = Header$2.HvVerticalNavigationHeader;
+exports.actionClasses = actionClasses$1.default;
+exports.actionsClasses = actionsClasses$2.default;
+exports.HvVerticalNavigationActions = Actions$2.HvVerticalNavigationActions;
+exports.HvVerticalNavigationAction = Action$1.HvVerticalNavigationAction;
+exports.verticalNavigationTreeClasses = navigationClasses$1.default;
+exports.HvVerticalNavigationTree = Navigation$1.HvVerticalNavigationTree;
+exports.verticalNavigationSliderClasses = navigationSliderClasses.default;
+exports.HvVerticalNavigationSlider = NavigationSlider.HvVerticalNavigationSlider;
+exports.treeViewClasses = treeViewClasses.default;
+exports.treeViewItemClasses = treeViewItemClasses.default;
+exports.HvVerticalNavigationTreeView = TreeView.HvVerticalNavigationTreeView;
+exports.HvVerticalNavigationTreeViewItem = TreeViewItem.HvVerticalNavigationTreeViewItem;
+exports.VerticalNavigationContext = VerticalNavigationContext.VerticalNavigationContext;
 exports.useUniqueId = useUniqueId.default;
 exports.useIsMounted = useIsMounted.default;
 exports.useClickOutside = useClickOutside.useClickOutside;
@@ -503,8 +554,13 @@ exports.useImageLoaded = useImageLoaded.useImageLoaded;
 exports.useSelectionPath = useSelectionPath.useSelectionPath;
 exports.useWidth = useWidth.useWidth;
 exports.useLabels = useLabels.useLabels;
+exports.useTheme = useTheme.useTheme;
+exports.useEnhancedEffect = useEnhancedEffect.useEnhancedEffect;
 exports.HvProvider = Provider.HvProvider;
-exports.HvThemeContext = ThemeProvider.HvThemeContext;
+Object.defineProperty(exports, "HvThemeContext", {
+  enumerable: true,
+  get: () => uikitReactShared.HvThemeContext
+});
 exports.HvThemeProvider = ThemeProvider.HvThemeProvider;
 exports.iconVariant = iconVariant.default;
 exports.hexToRgbA = hexToRgbA.default;
@@ -518,11 +574,16 @@ exports.isKeycode = keyCheck.isKeycode;
 exports.isKeypress = keyCheck.isKeypress;
 exports.decreaseSize = sizes.decreaseSize;
 exports.increaseSize = sizes.increaseSize;
-exports.parseThemes = theme.parseThemes;
+exports.createTheme = theme.createTheme;
+exports.processThemes = theme.processThemes;
 exports.setElementAttrs = theme.setElementAttrs;
 exports.setId = setId.setId;
 exports.setUid = setId.setUid;
 exports.getClasses = classes.getClasses;
+exports.getFirstAndLastFocus = focusableElementFinder.getFirstAndLastFocus;
+exports.getFocusableList = focusableElementFinder.getFocusableList;
+exports.getPrevNextFocus = focusableElementFinder.getPrevNextFocus;
+exports.wrapperTooltip = wrapperTooltip.wrapperTooltip;
 exports.withTooltip = withTooltip.default;
 exports.withId = withId.default;
 //# sourceMappingURL=index.cjs.map

package/dist/cjs/index.cjs.map

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

package/dist/cjs/providers/Provider.cjs

@@ -1,47 +1,64 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const react = require("@emotion/react");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const ThemeProvider = require("./ThemeProvider.cjs");
+const React = require("react");
 const createCache = require("@emotion/cache");
 const jsxRuntime = require("@emotion/react/jsx-runtime");
+const useUniqueId = require("../hooks/useUniqueId.cjs");
 const theme = require("../utils/theme.cjs");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const createCache__default = /* @__PURE__ */ _interopDefault(createCache);
+const scopedRootPrefix = "hv-uikit-scoped-root";
 const HvProvider = ({
   children,
   rootElementId,
-  enableCssBaseline = true,
-  theme: theme$1 = {}
+  cssBaseline = "global",
+  cssTheme = "global",
+  themes,
+  theme: theme$1,
+  colorMode,
+  classNameKey = "hv-uikit-css"
 }) => {
-  const {
-    baseTheme = "ds5",
-    baseColorMode = "dawn",
-    name,
-    ...customizations
-  } = theme$1;
-  const themes = theme.parseThemes(baseTheme, name, customizations);
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    react.CacheProvider,
-    {
-      value: createCache__default.default({
-        key: "hv-uikit-css",
-        prepend: true
-      }),
-      children: [/* @__PURE__ */ jsxRuntime.jsx(react.Global, {
-        styles: /* @__PURE__ */ react.css(enableCssBaseline && uikitStyles.CssBaseline, " ", uikitStyles.getThemesVars(themes), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:HvProvider;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL3Byb3ZpZGVycy9Qcm92aWRlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNkVtQiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9wcm92aWRlcnMvUHJvdmlkZXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzLCBHbG9iYWwsIENhY2hlUHJvdmlkZXIgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIjtcbmltcG9ydCB7IENzc0Jhc2VsaW5lLCBnZXRUaGVtZXNWYXJzIH0gZnJvbSBcIkBoaXRhY2hpdmFudGFyYS91aWtpdC1zdHlsZXNcIjtcbmltcG9ydCB7IHBhcnNlVGhlbWVzIH0gZnJvbSBcInV0aWxzXCI7XG5pbXBvcnQgeyBIdlRoZW1lIH0gZnJvbSBcIi4uL3R5cGVzL3RoZW1lXCI7XG5pbXBvcnQgeyBIdlRoZW1lUHJvdmlkZXIgfSBmcm9tIFwiLi9UaGVtZVByb3ZpZGVyXCI7XG5pbXBvcnQgY3JlYXRlQ2FjaGUgZnJvbSBcIkBlbW90aW9uL2NhY2hlXCI7XG5cbi8vIFByb3ZpZGVyIHByb3BzXG5leHBvcnQgdHlwZSBIdlByb3ZpZGVyUHJvcHMgPSB7XG4gIC8qKlxuICAgKiBZb3VyIGNvbXBvbmVudCB0cmVlLlxuICAgKi9cbiAgY2hpbGRyZW4/OiBSZWFjdC5SZWFjdE5vZGU7XG4gIC8qKlxuICAgKiBCeSBkZWZhdWx0IHRoZSBiYXNlbGluZSBzdHlsZXMgYXJlIGFwcGxpZWQgZ2xvYmFsbHkgdG8gdGhlIGFwcGxpY2F0aW9uIHRvIGF2b2lkIHN0eWxpbmcgY29uZmxpY3RzIGFuZCBmb3IgdGhlIFVJIEtpdCBjb21wb25lbnRzIHRvIHdvcmsgcHJvcGVybHkuXG4gICAqIElmIHlvdSBhcmUgcHJvdmlkaW5nIHlvdXIgb3duIGJhc2VsaW5lIHN0eWxlcywgeW91IGNhbiBzZXQgdGhpcyBwcm9wZXJ0eSB0byBmYWxzZS5cbiAgICovXG4gIGVuYWJsZUNzc0Jhc2VsaW5lPzogYm9vbGVhbjtcbiAgLyoqXG4gICAqIElkIG9mIHlvdXIgcm9vdCBlbGVtZW50LiBUaGUgdGhlbWUncyBhdHRyaWJ1dGVzIGFuZCBDU1MgdmFyaWFibGVzIHdpbGwgYmUgc2V0IGluIHRoaXMgZWxlbWVudC5cbiAgICogSWYgbm8gdmFsdWUgaXMgcHJvdmlkZWQsIHRoZSBkb2N1bWVudCdzIGJvZHkgd2lsbCBiZSB1c2VkLlxuICAgKi9cbiAgcm9vdEVsZW1lbnRJZD86IHN0cmluZztcbiAgLyoqXG4gICAqIFRoZSBVSSBLaXQgdGhlbWUgb2JqZWN0IHVzZWQgdG8gc2V0IHRoZSB0aGVtZSBhbmQgaW5qZWN0IHRoZSBjdXN0b21pemF0aW9ucyBuZWVkZWQgdG8gbWVldCBzcGVjaWZpYyBkZXNpZ24gbmVlZHMuXG4gICAqIElmIG5vIHZhbHVlIGlzIHByb3ZpZGVkLCB0aGUgZGVmYXVsdCB0aGVtZSBhbmQgbW9kZSB3aWxsIGJlIGBcImRzNVwiYCBhbmQgYFwiZGF3blwiYCwgcmVzcGVjdGl2ZWx5LlxuICAgKi9cbiAgdGhlbWU/OiBIdlRoZW1lO1xufTtcblxuLyoqXG4gKiBUaGlzIGNvbXBvbmVudCBtYWtlcyBjcm9zcy1jb21wb25lbnQgdGhlbWUgcHJvcGVydGllcyBhdmFpbGFibGUgZG93biB0aGUgUmVhY3QgdHJlZSB0aGFua3MgdG8gUmVhY3QgY29udGV4dC5cbiAqXG4gKiBUaGUgYEh2UHJvdmlkZXJgIHNob3VsZCBwcmVmZXJhYmx5IGJlIHVzZWQgYXQgKip0aGUgcm9vdCBvZiB5b3VyIGNvbXBvbmVudCB0cmVlKiogYW5kXG4gKiBiZSB1bmlxdWUgaW4gdGhlIEFwcCBpbiBtb3N0IGNhc2VzLlxuICpcbiAqIGBgYGpzeFxuICogPEh2UHJvdmlkZXI+XG4gKiAgIDxNeUFwcCAvPlxuICogPEh2UHJvdmlkZXIvPlxuICogYGBgXG4gKlxuICogSWYgc2V2ZXJhbCBgSHZQcm92aWRlcmAncyBhcmUgdXNlZCBpbiBwYXJhbGxlbCwgeW91J2xsIG5lZWQgdG8gY3JlYXRlIGRpZmZlcmVudCByb290IGVsZW1lbnRzIGFuZFxuICogc2V0IHRoZSBgcm9vdEVsZW1lbnRJZGAgcHJvcGVydHkgZm9yIGVhY2ggb25lIG9mIHRoZSBwcm92aWRlcnMuIE90aGVyd2lzZSwgdGhlIHN0eWxpbmcgd2lsbCBub3Qgd29yayBwcm9wZXJseS5cbiAqXG4gKiAqKlVJIEtpdCBjb21wb25lbnRzIHdpbGwgbm90IHdvcmsgYXQgYWxsIGlmIHRoZSBgSHZQcm92aWRlcmAgaXMgbm90IGNvbmZpZ3VyZWQgY29ycmVjdGx5KiosXG4gKiBhcyB0aGV5IHdpbGwgbm90IGJlIGFibGUgdG8gYWNjZXNzIHRoZSBwcm9wZXJ0aWVzIG9mIHRoZSBhY3RpdmUgdGhlbWUuXG4gKlxuICovXG5leHBvcnQgY29uc3QgSHZQcm92aWRlciA9ICh7XG4gIGNoaWxkcmVuLFxuICByb290RWxlbWVudElkLFxuICBlbmFibGVDc3NCYXNlbGluZSA9IHRydWUsXG4gIHRoZW1lID0ge30sXG59OiBIdlByb3ZpZGVyUHJvcHMpID0+IHtcbiAgY29uc3Qge1xuICAgIGJhc2VUaGVtZSA9IFwiZHM1XCIsXG4gICAgYmFzZUNvbG9yTW9kZSA9IFwiZGF3blwiLFxuICAgIG5hbWUsXG4gICAgLi4uY3VzdG9taXphdGlvbnNcbiAgfSA9IHRoZW1lO1xuXG4gIC8vIEdldCB0aGVtZXMgbGlzdFxuICBjb25zdCB0aGVtZXMgPSBwYXJzZVRoZW1lcyhiYXNlVGhlbWUsIG5hbWUsIGN1c3RvbWl6YXRpb25zKTtcblxuICByZXR1cm4gKFxuICAgIDxDYWNoZVByb3ZpZGVyXG4gICAgICAvKipcbiAgICAgICAqIE1vdmVzIFVJIEtpdCBzdHlsZXMgdG8gdGhlIHRvcCBvZiB0aGUgPGhlYWQ+IHNvIHRoZXkncmUgbG9hZGVkIGZpcnN0LlxuICAgICAgICogVGhpcyBlbmFibGVzIHVzZXJzIHRvIG92ZXJyaWRlIHRoZSBVSSBLaXQgc3R5bGVzIGlmIG5lY2Vzc2FyeS5cbiAgICAgICAqL1xuICAgICAgdmFsdWU9e2NyZWF0ZUNhY2hlKHtcbiAgICAgICAga2V5OiBcImh2LXVpa2l0LWNzc1wiLFxuICAgICAgICBwcmVwZW5kOiB0cnVlLFxuICAgICAgfSl9XG4gICAgPlxuICAgICAgPEdsb2JhbFxuICAgICAgICBzdHlsZXM9e2Nzc2BcbiAgICAgICAgICAke2VuYWJsZUNzc0Jhc2VsaW5lICYmIENzc0Jhc2VsaW5lfVxuICAgICAgICAgICR7Z2V0VGhlbWVzVmFycyh0aGVtZXMpfVxuICAgICAgICBgfVxuICAgICAgLz5cbiAgICAgIDxIdlRoZW1lUHJvdmlkZXJcbiAgICAgICAgdGhlbWVzPXt0aGVtZXN9XG4gICAgICAgIHRoZW1lPXtuYW1lIHx8IGJhc2VUaGVtZX1cbiAgICAgICAgY29sb3JNb2RlPXtiYXNlQ29sb3JNb2RlfVxuICAgICAgICByb290RWxlbWVudElkPXtyb290RWxlbWVudElkfVxuICAgICAgPlxuICAgICAgICB7Y2hpbGRyZW59XG4gICAgICA8L0h2VGhlbWVQcm92aWRlcj5cbiAgICA8L0NhY2hlUHJvdmlkZXI+XG4gICk7XG59O1xuXG5pZiAocHJvY2Vzcy5lbnYuTk9ERV9FTlYgIT09IFwicHJvZHVjdGlvblwiKSB7XG4gIEh2UHJvdmlkZXIuZGlzcGxheU5hbWUgPSBcIlByb3ZpZGVyXCI7XG59XG4iXX0= */")
-      }), /* @__PURE__ */ jsxRuntime.jsx(ThemeProvider.HvThemeProvider, {
-        themes,
-        theme: name || baseTheme,
-        colorMode: baseColorMode,
-        rootElementId,
-        children
-      })]
-    }
-  );
+  const scopedRootId = useUniqueId.default(void 0, scopedRootPrefix);
+  const themesList = theme.processThemes(themes);
+  const emotionCache = React.useMemo(() => createCache__default.default({
+    key: classNameKey,
+    prepend: true
+  }), [classNameKey]);
+  return /* @__PURE__ */ jsxRuntime.jsxs(react.CacheProvider, {
+    value: emotionCache,
+    children: [/* @__PURE__ */ jsxRuntime.jsx(react.Global, {
+      styles: /* @__PURE__ */ react.css(cssBaseline == "global" && uikitStyles.CssBaseline, " ", uikitStyles.getThemesVars(themesList), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:HvProvider;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi9ob21lL3J1bm5lci93b3JrL2h2LXVpa2l0LXJlYWN0L2h2LXVpa2l0LXJlYWN0L3BhY2thZ2VzL2NvcmUvc3JjL3Byb3ZpZGVycy9Qcm92aWRlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNEd3QiIsImZpbGUiOiIvaG9tZS9ydW5uZXIvd29yay9odi11aWtpdC1yZWFjdC9odi11aWtpdC1yZWFjdC9wYWNrYWdlcy9jb3JlL3NyYy9wcm92aWRlcnMvUHJvdmlkZXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgY3NzIGFzIGNzc1JlYWN0LFxuICBHbG9iYWwsXG4gIENhY2hlUHJvdmlkZXIsXG4gIENsYXNzTmFtZXMsXG59IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiO1xuaW1wb3J0IHtcbiAgQ3NzQmFzZWxpbmUsXG4gIENzc1Njb3BlZEJhc2VsaW5lLFxuICBnZXRUaGVtZXNWYXJzLFxuICBIdlRoZW1lU3RydWN0dXJlLFxufSBmcm9tIFwiQGhpdGFjaGl2YW50YXJhL3Vpa2l0LXN0eWxlc1wiO1xuaW1wb3J0IHsgcHJvY2Vzc1RoZW1lcyB9IGZyb20gXCJ1dGlsc1wiO1xuaW1wb3J0IHsgSHZUaGVtZSB9IGZyb20gXCIuLi90eXBlcy90aGVtZVwiO1xuaW1wb3J0IHsgSHZUaGVtZVByb3ZpZGVyIH0gZnJvbSBcIi4vVGhlbWVQcm92aWRlclwiO1xuaW1wb3J0IFJlYWN0LCB7IHVzZU1lbW8gfSBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBjcmVhdGVDYWNoZSBmcm9tIFwiQGVtb3Rpb24vY2FjaGVcIjtcbmltcG9ydCB7IHVzZVVuaXF1ZUlkIH0gZnJvbSBcImhvb2tzXCI7XG5cbi8vIFByb3ZpZGVyIHByb3BzXG5leHBvcnQgdHlwZSBIdlByb3ZpZGVyUHJvcHMgPSB7XG4gIC8qKlxuICAgKiBZb3VyIGNvbXBvbmVudCB0cmVlLlxuICAgKi9cbiAgY2hpbGRyZW4/OiBSZWFjdC5SZWFjdE5vZGU7XG4gIC8qKlxuICAgKiBJZCBvZiB5b3VyIHJvb3QgZWxlbWVudC5cbiAgICovXG4gIHJvb3RFbGVtZW50SWQ/OiBzdHJpbmc7XG4gIC8qKlxuICAgKiBCeSBkZWZhdWx0IHRoZSBiYXNlbGluZSBzdHlsZXMgYXJlIGFwcGxpZWQgZ2xvYmFsbHksIGBnbG9iYWxgLCB0byB0aGUgYXBwbGljYXRpb24gZm9yIHRoZSBVSSBLaXQgY29tcG9uZW50cyB0byB3b3JrIHByb3Blcmx5LlxuICAgKiBJZiB5b3UgbmVlZCB0byBzY29wZSB0aGUgYmFzZWxpbmUgc3R5bGVzIHRvIGF2b2lkIHN0eWxpbmcgY29uZmxpY3RzLCB5b3UgY2FuIHNldCB0aGlzIHByb3BlcnR5IHRvIGBzY29wZWRgLlxuICAgKiBUbyBzY29wZSB0aGUgYmFzZWxpbmUgdG8geW91ciByb290LCB5b3UgbmVlZCB0byBhZGQgdGhlIGByb290RWxlbWVudElkYCBwcm9wZXJ0eS5cbiAgICogSWYgdGhlIGByb290RWxlbWVudElkYCBwcm9wZXJ0eSBpcyBub3Qgc2V0LCB0aGUgYmFzZWxpbmUgd2lsbCBiZSBzY29wZWQgdG8gYSBuZXcgY29udGFpbmVyLCBgaHYtdWlraXQtc2NvcGVkLXJvb3QqYCwgY3JlYXRlZCBhcm91bmQgeW91ciBjb250ZW50LlxuICAgKiBJZiB5b3UgYXJlIHByb3ZpZGluZyB5b3VyIG93biBiYXNlbGluZSBzdHlsZXMsIHlvdSBjYW4gc2V0IHRoaXMgcHJvcGVydHkgdG8gYG5vbmVgIHRvIGRpc2FibGUgdGhlIGJhc2VsaW5lIHN0eWxlcy5cbiAgICovXG4gIGNzc0Jhc2VsaW5lPzogXCJnbG9iYWxcIiB8IFwic2NvcGVkXCIgfCBcIm5vbmVcIjtcbiAgLyoqXG4gICAqIEJ5IGRlZmF1bHQgdGhlIHRoZW1lIHN0eWxlcyBhcmUgYXBwbGllZCBnbG9iYWxseSwgYGdsb2JhbGAsIHRvIHRoZSBhcHBsaWNhdGlvbi5cbiAgICogSWYgeW91IG5lZWQgdG8gc2NvcGUgdGhlIHRoZW1lIHN0eWxlcyB0byBhdm9pZCBzdHlsaW5nIGNvbmZsaWN0cywgeW91IGNhbiBzZXQgdGhpcyBwcm9wZXJ0eSB0byBgc2NvcGVkYC5cbiAgICogVG8gc2NvcGUgdGhlIHRoZW1lIHRvIHlvdXIgcm9vdCwgeW91IG5lZWQgdG8gYWRkIHRoZSBgcm9vdEVsZW1lbnRJZGAgcHJvcGVydHkuXG4gICAqIElmIHRoZSBgcm9vdEVsZW1lbnRJZGAgcHJvcGVydHkgaXMgbm90IHNldCwgdGhlIHRoZW1lIHdpbGwgYmUgc2NvcGVkIHRvIGEgbmV3IGNvbnRhaW5lciwgYGh2LXVpa2l0LXNjb3BlZC1yb290KmAsIGNyZWF0ZWQgYXJvdW5kIHlvdXIgY29udGVudC5cbiAgICovXG4gIGNzc1RoZW1lPzogXCJnbG9iYWxcIiB8IFwic2NvcGVkXCI7XG4gIC8qKlxuICAgKiBUaGUgc3RyaW5nIHVzZWQgdG8gcHJlZml4IHRoZSBjbGFzcyBuYW1lcyBhbmQgdW5pcXVlbHkgaWRlbnRpZnkgdGhlbS4gVGhlIGtleSBjYW4gb25seSBjb250YWluIGxvd2VyIGNhc2UgYWxwaGFiZXRpY2FsIGNoYXJhY3RlcnMuXG4gICAqIFRoaXMgaXMgdXNlZnVsIHRvIGF2b2lkIGNsYXNzIG5hbWUgY29sbGlzaW9ucy5cbiAgICpcbiAgICogSWYgbm8gdmFsdWUgaXMgcHJvdmlkZWQsIHRoZSBkZWZhdWx0IGlzIGBodi11aWtpdC1jc3NgLlxuICAgKi9cbiAgY2xhc3NOYW1lS2V5Pzogc3RyaW5nO1xuICAvKipcbiAgICogTGlzdCBvZiB0aGVtZXMgdG8gYmUgdXNlZCBieSBVSSBLaXQuXG4gICAqIFlvdSBjYW4gcHJvdmlkZSB5b3VyIG93biB0aGVtZXMgY3JlYXRlZCB3aXRoIHRoZSBgY3JlYXRlVGhlbWVgIHV0aWxpdHkgYW5kL29yIHRoZSBkZWZhdWx0IHRoZW1lcyBgZHMzYCBhbmQgYGRzNWAgcHJvdmlkZWQgYnkgVUkgS2l0LlxuICAgKlxuICAgKiBJZiBubyB2YWx1ZSBpcyBwcm92aWRlZCwgdGhlIGBkczVgIHRoZW1lIHdpbGwgYmUgdXNlZC5cbiAgICovXG4gIHRoZW1lcz86IChIdlRoZW1lIHwgSHZUaGVtZVN0cnVjdHVyZSlbXTtcbiAgLyoqXG4gICAqIFRoZSBhY3RpdmUgdGhlbWUuIEl0IG11c3QgYmUgb25lIG9mIHRoZSB0aGVtZXMgcGFzc2VkIHRvIGB0aGVtZXNgLlxuICAgKlxuICAgKiBJZiBubyB2YWx1ZSBpcyBwcm92aWRlZCwgdGhlIGZpcnN0IHRoZW1lIGZyb20gdGhlIGB0aGVtZXNgIGxpc3QgaXMgdXNlZC4gSWYgbm8gYHRoZW1lc2AgbGlzdCBpcyBwcm92aWRlZCwgdGhlIGBkczVgIHRoZW1lIHdpbGwgYmUgdXNlZC5cbiAgICovXG4gIHRoZW1lPzogc3RyaW5nO1xuICAvKipcbiAgICogVGhlIGFjdGl2ZSBjb2xvciBtb2RlLiBJdCBtdXN0IGJlIG9uZSBvZiB0aGUgY29sb3IgbW9kZXMgb2YgdGhlIGFjdGl2ZSB0aGVtZS5cbiAgICpcbiAgICogSWYgbm8gdmFsdWUgaXMgcHJvdmlkZWQsIHRoZSBmaXJzdCBjb2xvciBtb2RlIGRlZmluZWQgaW4gdGhlIGFjdGl2ZSB0aGVtZSBpcyB1c2VkLlxuICAgKiBGb3IgdGhlIGRlZmF1bHQgdGhlbWVzIGBkczNgIGFuZCBgZHM1YCwgdGhlIGBkYXduYCBjb2xvciBtb2RlIGlzIHRoZSBvbmUgdXNlZC5cbiAgICovXG4gIGNvbG9yTW9kZT86IHN0cmluZztcbn07XG5cbmNvbnN0IHNjb3BlZFJvb3RQcmVmaXggPSBcImh2LXVpa2l0LXNjb3BlZC1yb290XCIgYXMgY29uc3Q7XG5cbi8qKlxuICogRW5hYmxlcyB0aGVtaW5nIGNhcGFiaWxpdGllcyBhbmQgbWFrZXMgY3Jvc3MtY29tcG9uZW50IHRoZW1lIHByb3BlcnRpZXMgYXZhaWxhYmxlIGRvd24gdGhlIHRyZWUuXG4gKi9cbmV4cG9ydCBjb25zdCBIdlByb3ZpZGVyID0gKHtcbiAgY2hpbGRyZW4sXG4gIHJvb3RFbGVtZW50SWQsXG4gIGNzc0Jhc2VsaW5lID0gXCJnbG9iYWxcIixcbiAgY3NzVGhlbWUgPSBcImdsb2JhbFwiLFxuICB0aGVtZXMsXG4gIHRoZW1lLFxuICBjb2xvck1vZGUsXG4gIGNsYXNzTmFtZUtleSA9IFwiaHYtdWlraXQtY3NzXCIsXG59OiBIdlByb3ZpZGVyUHJvcHMpID0+IHtcbiAgY29uc3Qgc2NvcGVkUm9vdElkID0gdXNlVW5pcXVlSWQodW5kZWZpbmVkLCBzY29wZWRSb290UHJlZml4KTtcblxuICAvLyBUaGVtZXNcbiAgY29uc3QgdGhlbWVzTGlzdDogKEh2VGhlbWUgfCBIdlRoZW1lU3RydWN0dXJlKVtdID0gcHJvY2Vzc1RoZW1lcyh0aGVtZXMpO1xuXG4gIC8vIEVtb3Rpb24gY2FjaGVcbiAgLy8gTW92ZXMgVUkgS2l0IHN0eWxlcyB0byB0aGUgdG9wIG9mIHRoZSA8aGVhZD4gc28gdGhleSdyZSBsb2FkZWQgZmlyc3RcbiAgLy8gVGhpcyBlbmFibGVzIHVzZXJzIHRvIG92ZXJyaWRlIHRoZSBVSSBLaXQgc3R5bGVzIGlmIG5lY2Vzc2FyeVxuICBjb25zdCBlbW90aW9uQ2FjaGUgPSB1c2VNZW1vKFxuICAgICgpID0+XG4gICAgICBjcmVhdGVDYWNoZSh7XG4gICAgICAgIGtleTogY2xhc3NOYW1lS2V5LFxuICAgICAgICBwcmVwZW5kOiB0cnVlLFxuICAgICAgfSksXG4gICAgW2NsYXNzTmFtZUtleV1cbiAgKTtcblxuICByZXR1cm4gKFxuICAgIDxDYWNoZVByb3ZpZGVyIHZhbHVlPXtlbW90aW9uQ2FjaGV9PlxuICAgICAgPEdsb2JhbFxuICAgICAgICBzdHlsZXM9e2Nzc1JlYWN0YFxuICAgICAgICAgICR7Y3NzQmFzZWxpbmUgPT0gXCJnbG9iYWxcIiAmJiBDc3NCYXNlbGluZX1cbiAgICAgICAgICAke2dldFRoZW1lc1ZhcnModGhlbWVzTGlzdCl9XG4gICAgICAgIGB9XG4gICAgICAvPlxuICAgICAgPEh2VGhlbWVQcm92aWRlclxuICAgICAgICB0aGVtZXM9e3RoZW1lc0xpc3R9XG4gICAgICAgIHRoZW1lPXt0aGVtZSB8fCB0aGVtZXNMaXN0WzBdLm5hbWV9XG4gICAgICAgIGNvbG9yTW9kZT17Y29sb3JNb2RlIHx8IE9iamVjdC5rZXlzKHRoZW1lc0xpc3RbMF0uY29sb3JzLm1vZGVzKVswXX1cbiAgICAgICAgdGhlbWVSb290SWQ9e1xuICAgICAgICAgIGNzc1RoZW1lID09PSBcInNjb3BlZFwiID8gcm9vdEVsZW1lbnRJZCB8fCBzY29wZWRSb290SWQgOiB1bmRlZmluZWRcbiAgICAgICAgfVxuICAgICAgPlxuICAgICAgICA8Q2xhc3NOYW1lcz5cbiAgICAgICAgICB7KHsgY3NzIH0pID0+IHtcbiAgICAgICAgICAgIGlmIChjc3NCYXNlbGluZSA9PT0gXCJzY29wZWRcIiAmJiByb290RWxlbWVudElkKSB7XG4gICAgICAgICAgICAgIGNvbnN0IHJvb3RFbGVtZW50ID0gZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQocm9vdEVsZW1lbnRJZCk7XG5cbiAgICAgICAgICAgICAgaWYgKHJvb3RFbGVtZW50KSB7XG4gICAgICAgICAgICAgICAgcm9vdEVsZW1lbnQuY2xhc3NMaXN0LmFkZChcbiAgICAgICAgICAgICAgICAgIGNzcyh7XG4gICAgICAgICAgICAgICAgICAgIC4uLkNzc1Njb3BlZEJhc2VsaW5lLFxuICAgICAgICAgICAgICAgICAgfSlcbiAgICAgICAgICAgICAgICApO1xuICAgICAgICAgICAgICB9XG4gICAgICAgICAgICB9XG5cbiAgICAgICAgICAgIHJldHVybiAoY3NzVGhlbWUgPT09IFwic2NvcGVkXCIgfHwgY3NzQmFzZWxpbmUgPT09IFwic2NvcGVkXCIpICYmXG4gICAgICAgICAgICAgICFyb290RWxlbWVudElkID8gKFxuICAgICAgICAgICAgICA8ZGl2XG4gICAgICAgICAgICAgICAgaWQ9e3Njb3BlZFJvb3RJZH1cbiAgICAgICAgICAgICAgICBjbGFzc05hbWU9e1xuICAgICAgICAgICAgICAgICAgY3NzQmFzZWxpbmUgPT09IFwic2NvcGVkXCJcbiAgICAgICAgICAgICAgICAgICAgPyBjc3MoeyAuLi5Dc3NTY29wZWRCYXNlbGluZSB9KVxuICAgICAgICAgICAgICAgICAgICA6IHVuZGVmaW5lZFxuICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgICAgPlxuICAgICAgICAgICAgICAgIHtjaGlsZHJlbn1cbiAgICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgICApIDogKFxuICAgICAgICAgICAgICBjaGlsZHJlblxuICAgICAgICAgICAgKTtcbiAgICAgICAgICB9fVxuICAgICAgICA8L0NsYXNzTmFtZXM+XG4gICAgICA8L0h2VGhlbWVQcm92aWRlcj5cbiAgICA8L0NhY2hlUHJvdmlkZXI+XG4gICk7XG59O1xuIl19 */")
+    }), /* @__PURE__ */ jsxRuntime.jsx(ThemeProvider.HvThemeProvider, {
+      themes: themesList,
+      theme: theme$1 || themesList[0].name,
+      colorMode: colorMode || Object.keys(themesList[0].colors.modes)[0],
+      themeRootId: cssTheme === "scoped" ? rootElementId || scopedRootId : void 0,
+      children: /* @__PURE__ */ jsxRuntime.jsx(react.ClassNames, {
+        children: ({
+          css
+        }) => {
+          if (cssBaseline === "scoped" && rootElementId) {
+            const rootElement = document.getElementById(rootElementId);
+            if (rootElement) {
+              rootElement.classList.add(css({
+                ...uikitStyles.CssScopedBaseline
+              }));
+            }
+          }
+          return (cssTheme === "scoped" || cssBaseline === "scoped") && !rootElementId ? /* @__PURE__ */ jsxRuntime.jsx("div", {
+            id: scopedRootId,
+            className: cssBaseline === "scoped" ? css({
+              ...uikitStyles.CssScopedBaseline
+            }) : void 0,
+            children
+          }) : children;
+        }
+      })
+    })]
+  });
 };
-if (process.env.NODE_ENV !== "production") {
-  HvProvider.displayName = "Provider";
-}
 exports.HvProvider = HvProvider;
 //# sourceMappingURL=Provider.cjs.map

package/dist/cjs/providers/Provider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Provider.cjs","sources":["../../../src/providers/Provider.tsx"],"sourcesContent":["import { css, Global, CacheProvider } from \"@emotion/react\";\nimport { CssBaseline, getThemesVars } from \"@hitachivantara/uikit-styles\";\nimport { parseThemes } from \"utils\";\nimport { HvTheme } from \"../types/theme\";\nimport { HvThemeProvider } from \"./ThemeProvider\";\nimport createCache from \"@emotion/cache\";\n\n// Provider props\nexport type HvProviderProps = {\n  /**\n   * Your component tree.\n   */\n  children?: React.ReactNode;\n  /**\n   * By default the baseline styles are applied globally to the application to avoid styling conflicts and for the UI Kit components to work properly.\n   * If you are providing your own baseline styles, you can set this property to false.\n   */\n  enableCssBaseline?: boolean;\n  /**\n   * Id of your root element. The theme's attributes and CSS variables will be set in this element.\n   * If no value is provided, the document's body will be used.\n   */\n  rootElementId?: string;\n  /**\n   * The UI Kit theme object used to set the theme and inject the customizations needed to meet specific design needs.\n   * If no value is provided, the default theme and mode will be `\"ds5\"` and `\"dawn\"`, respectively.\n   */\n  theme?: HvTheme;\n};\n\n/**\n * This component makes cross-component theme properties available down the React tree thanks to React context.\n *\n * The `HvProvider` should preferably be used at **the root of your component tree** and\n * be unique in the App in most cases.\n *\n * ```jsx\n * <HvProvider>\n *   <MyApp />\n * <HvProvider/>\n * ```\n *\n * If several `HvProvider`'s are used in parallel, you'll need to create different root elements and\n * set the `rootElementId` property for each one of the providers. Otherwise, the styling will not work properly.\n *\n * **UI Kit components will not work at all if the `HvProvider` is not configured correctly**,\n * as they will not be able to access the properties of the active theme.\n *\n */\nexport const HvProvider = ({\n  children,\n  rootElementId,\n  enableCssBaseline = true,\n  theme = {},\n}: HvProviderProps) => {\n  const {\n    baseTheme = \"ds5\",\n    baseColorMode = \"dawn\",\n    name,\n    ...customizations\n  } = theme;\n\n  // Get themes list\n  const themes = parseThemes(baseTheme, name, customizations);\n\n  return (\n    <CacheProvider\n      /**\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       */\n      value={createCache({\n        key: \"hv-uikit-css\",\n        prepend: true,\n      })}\n    >\n      <Global\n        styles={css`\n          ${enableCssBaseline && CssBaseline}\n          ${getThemesVars(themes)}\n        `}\n      />\n      <HvThemeProvider\n        themes={themes}\n        theme={name || baseTheme}\n        colorMode={baseColorMode}\n        rootElementId={rootElementId}\n      >\n        {children}\n      </HvThemeProvider>\n    </CacheProvider>\n  );\n};\n\nif (process.env.NODE_ENV !== \"production\") {\n  HvProvider.displayName = \"Provider\";\n}\n"],"names":["HvProvider","children","rootElementId","enableCssBaseline","theme","baseTheme","baseColorMode","name","customizations","themes","parseThemes","_jsxs","CacheProvider","value","createCache","key","prepend","_jsx","Global","styles","CssBaseline","getThemesVars","process","env","NODE_ENV","HvThemeProvider","colorMode","displayName"],"mappings":";;;;;;;;;;AAiDO,MAAMA,aAAaA,CAAC;AAAA,EACzBC;AAAAA,EACAC;AAAAA,EACAC,oBAAoB;AAAA,EACpBC,OAAAA,UAAQ,CAAC;AACM,MAAM;AACf,QAAA;AAAA,IACJC,YAAY;AAAA,IACZC,gBAAgB;AAAA,IAChBC;AAAAA,OACGC;AAAAA,EACDJ,IAAAA;AAGJ,QAAMK,SAASC,MAAAA,YAAYL,WAAWE,MAAMC,cAAc;AAGxDG,SAAAA,2BAAAA;AAAAA,IAACC,MAAAA;AAAAA,IACC;AAAA,MAIAC,OAAOC,qBAAAA,QAAY;AAAA,QACjBC,KAAK;AAAA,QACLC,SAAS;AAAA,MAAA,CACV;AAAA,MAAEf,UAAA,CAEHgB,2BAAAA,IAACC,cAAM;AAAA,QACLC,kCACIhB,qBAAqBiB,yBAAW,KAChCC,YAAAA,cAAcZ,MAAM,UAACa,QAAAC,IAAAC,wDAAAF,QAAAC,IAAAC,aAAA,eAAA,KAAA,y6IAAA;AAAA,MAAA,CAEzB,GACFP,2BAAAA,IAACQ,+BAAe;AAAA,QACdhB;AAAAA,QACAL,OAAOG,QAAQF;AAAAA,QACfqB,WAAWpB;AAAAA,QACXJ;AAAAA,QAA6BD;AAAAA,MAAAA,CAGb,CAAA;AAAA,IAAA;AAAA,EAAA;AAGxB;AAEA,IAAIqB,QAAQC,IAAIC,aAAa,cAAc;AACzCxB,aAAW2B,cAAc;AAC3B;;"}
+{"version":3,"file":"Provider.cjs","sources":["../../../src/providers/Provider.tsx"],"sourcesContent":["import {\n  css as cssReact,\n  Global,\n  CacheProvider,\n  ClassNames,\n} from \"@emotion/react\";\nimport {\n  CssBaseline,\n  CssScopedBaseline,\n  getThemesVars,\n  HvThemeStructure,\n} from \"@hitachivantara/uikit-styles\";\nimport { processThemes } from \"utils\";\nimport { HvTheme } from \"../types/theme\";\nimport { HvThemeProvider } from \"./ThemeProvider\";\nimport React, { useMemo } from \"react\";\nimport createCache from \"@emotion/cache\";\nimport { useUniqueId } from \"hooks\";\n\n// Provider props\nexport type 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 no value is provided, the default is `hv-uikit-css`.\n   */\n  classNameKey?: string;\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  classNameKey = \"hv-uikit-css\",\n}: HvProviderProps) => {\n  const scopedRootId = useUniqueId(undefined, scopedRootPrefix);\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    () =>\n      createCache({\n        key: classNameKey,\n        prepend: true,\n      }),\n    [classNameKey]\n  );\n\n  return (\n    <CacheProvider value={emotionCache}>\n      <Global\n        styles={cssReact`\n          ${cssBaseline == \"global\" && CssBaseline}\n          ${getThemesVars(themesList)}\n        `}\n      />\n      <HvThemeProvider\n        themes={themesList}\n        theme={theme || themesList[0].name}\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\" && rootElementId) {\n              const rootElement = document.getElementById(rootElementId);\n\n              if (rootElement) {\n                rootElement.classList.add(\n                  css({\n                    ...CssScopedBaseline,\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({ ...CssScopedBaseline })\n                    : undefined\n                }\n              >\n                {children}\n              </div>\n            ) : (\n              children\n            );\n          }}\n        </ClassNames>\n      </HvThemeProvider>\n    </CacheProvider>\n  );\n};\n"],"names":["scopedRootPrefix","HvProvider","children","rootElementId","cssBaseline","cssTheme","themes","theme","colorMode","classNameKey","scopedRootId","useUniqueId","undefined","themesList","processThemes","emotionCache","useMemo","createCache","key","prepend","CacheProvider","value","_jsx","Global","styles","CssBaseline","getThemesVars","process","env","NODE_ENV","HvThemeProvider","name","Object","keys","colors","modes","themeRootId","ClassNames","css","rootElement","document","getElementById","classList","add","CssScopedBaseline","id","className"],"mappings":";;;;;;;;;;;;AAyEA,MAAMA,mBAAmB;AAKlB,MAAMC,aAAaA,CAAC;AAAA,EACzBC;AAAAA,EACAC;AAAAA,EACAC,cAAc;AAAA,EACdC,WAAW;AAAA,EACXC;AAAAA,EAAAA,OACAC;AAAAA,EACAC;AAAAA,EACAC,eAAe;AACA,MAAM;AACfC,QAAAA,eAAeC,YAAYC,QAAAA,QAAWZ,gBAAgB;AAGtDa,QAAAA,aAA6CC,oBAAcR,MAAM;AAKjES,QAAAA,eAAeC,cACnB,MACEC,6BAAY;AAAA,IACVC,KAAKT;AAAAA,IACLU,SAAS;AAAA,EAAA,CACV,GACH,CAACV,YAAY,CAAC;AAGhB,yCACGW,MAAAA,eAAa;AAAA,IAACC,OAAON;AAAAA,IAAab,UAAA,CACjCoB,2BAAAA,IAACC,cAAM;AAAA,MACLC,kCACIpB,eAAe,YAAYqB,YAAAA,aAC3BC,KAAAA,0BAAcb,UAAU,GAACc,OAAAA,QAAAC,IAAAC,wDAAAF,QAAAC,IAAAC,aAAA,eAAA,KAAA,66OAAA;AAAA,IAAA,CAE7B,GACFP,2BAAAA,IAACQ,+BAAe;AAAA,MACdxB,QAAQO;AAAAA,MACRN,OAAOA,WAASM,WAAW,CAAC,EAAEkB;AAAAA,MAC9BvB,WAAWA,aAAawB,OAAOC,KAAKpB,WAAW,CAAC,EAAEqB,OAAOC,KAAK,EAAE,CAAC;AAAA,MACjEC,aACE/B,aAAa,WAAWF,iBAAiBO,eAAeE;AAAAA,MACzDV,yCAEAmC,kBAAU;AAAA,QAAAnC,UACRA,CAAC;AAAA,UAAEoC;AAAAA,QAAAA,MAAU;AACRlC,cAAAA,gBAAgB,YAAYD,eAAe;AACvCoC,kBAAAA,cAAcC,SAASC,eAAetC,aAAa;AAEzD,gBAAIoC,aAAa;AACHG,0BAAAA,UAAUC,IACpBL,IAAI;AAAA,gBACF,GAAGM,YAAAA;AAAAA,cACJ,CAAA,CAAC;AAAA,YAEN;AAAA,UACF;AAEA,kBAAQvC,aAAa,YAAYD,gBAAgB,aAC/C,CAACD,+CACD,OAAA;AAAA,YACE0C,IAAInC;AAAAA,YACJoC,WACE1C,gBAAgB,WACZkC,IAAI;AAAA,cAAE,GAAGM,YAAAA;AAAAA,YAAmB,CAAA,IAC5BhC;AAAAA,YACLV;AAAAA,UAEQ,CAAA,IAGXA;AAAAA,QAEJ;AAAA,MAAA,CAAC;AAAA,IAAA,CAEa,CAAA;AAAA,EAAA,CACJ;AAEpB;;"}

package/dist/cjs/providers/ThemeProvider.cjs

@@ -1,41 +1,35 @@
 "use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
 const uikitStyles = require("@hitachivantara/uikit-styles");
+const uikitReactShared = require("@hitachivantara/uikit-react-shared");
 const styles = require("@mui/material/styles");
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const theme = require("../utils/theme.cjs");
-const HvThemeContext = React.createContext({
-  themes: [],
-  activeTheme: void 0,
-  colorModes: [],
-  selectedTheme: "",
-  selectedMode: "",
-  changeTheme: () => {
-  },
-  rootId: void 0
-});
 const HvThemeProvider = ({
   children,
   themes: themesList,
   theme: theme$1,
   colorMode,
-  rootElementId
+  themeRootId
 }) => {
   let pTheme = uikitStyles.parseTheme(themesList, theme$1, colorMode);
-  const [rootId] = React.useState(rootElementId);
-  const [activeTheme, setActiveTheme] = React.useState(themesList[pTheme.selected]);
-  const [selectedTheme, setSelectedTheme] = React.useState(pTheme.selected);
+  const [rootId] = React.useState(themeRootId);
+  const [activeTheme, setActiveTheme] = React.useState(pTheme.theme);
+  const [selectedTheme, setSelectedTheme] = React.useState(pTheme.selectedTheme);
   const [selectedMode, setThemeMode] = React.useState(pTheme.selectedMode);
   const [colorModes, setColorModes] = React.useState(pTheme.colorModes);
-  const [themes] = React.useState(Object.keys(themesList));
+  const [themes, setThemes] = React.useState(themesList.map((t) => t.name));
+  React.useEffect(() => {
+    setThemes(themesList.map((t) => t.name));
+  }, [themesList]);
   const changeTheme = (newTheme = selectedTheme, newMode = selectedMode) => {
     pTheme = uikitStyles.parseTheme(themesList, newTheme, newMode);
-    setActiveTheme(themesList[pTheme.selected]);
-    setSelectedTheme(pTheme.selected);
+    setActiveTheme(pTheme.theme);
+    setSelectedTheme(pTheme.selectedTheme);
     setThemeMode(pTheme.selectedMode);
     setColorModes(pTheme.colorModes);
-    theme.setElementAttrs(pTheme.selected, pTheme.selectedMode, pTheme.styles, rootId);
+    theme.setElementAttrs(pTheme.selectedTheme, pTheme.selectedMode, pTheme.colorScheme, rootId);
   };
   React.useEffect(() => {
     changeTheme(theme$1, colorMode);
@@ -52,18 +46,21 @@ const HvThemeProvider = ({
   const MuiTheme = styles.createTheme({
     breakpoints: {
       values: {
-        ...themesList[selectedTheme].breakpoints.values
+        ...activeTheme.breakpoints.values
       }
     }
   });
   return /* @__PURE__ */ jsxRuntime.jsx(styles.ThemeProvider, {
     theme: MuiTheme,
-    children: /* @__PURE__ */ jsxRuntime.jsx(HvThemeContext.Provider, {
+    children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactShared.HvThemeContext.Provider, {
       value,
       children
     })
   });
 };
-exports.HvThemeContext = HvThemeContext;
+Object.defineProperty(exports, "HvThemeContext", {
+  enumerable: true,
+  get: () => uikitReactShared.HvThemeContext
+});
 exports.HvThemeProvider = HvThemeProvider;
 //# sourceMappingURL=ThemeProvider.cjs.map