@hitachivantara/uikit-react-core 5.67.0 → 5.68.0

package/dist/cjs/Accordion/Accordion.cjs

@@ -3,8 +3,8 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const useControlled = require("../hooks/useControlled.cjs");
-const useDefaultProps = require("../hooks/useDefaultProps.cjs");
 const useUniqueId = require("../hooks/useUniqueId.cjs");
 const setId = require("../utils/setId.cjs");
 const Accordion_styles = require("./Accordion.styles.cjs");
@@ -25,7 +25,7 @@ const HvAccordion = (props) => {
     labelVariant = "label",
     disableEventHandling,
     ...others
-  } = useDefaultProps.useDefaultProps("HvAccordion", props);
+  } = uikitReactUtils.useDefaultProps("HvAccordion", props);
   const id = useUniqueId.useUniqueId(idProp);
   const { classes, cx } = Accordion_styles.useClasses(classesProp);
   const [isOpen, setIsOpen] = useControlled.useControlled(expanded, Boolean(defaultExpanded));

package/dist/cjs/Accordion/Accordion.styles.cjs

@@ -1,9 +1,9 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const focusUtils = require("../utils/focusUtils.cjs");
-const uikitReactShared = require("@hitachivantara/uikit-react-shared");
-const { staticClasses, useClasses } = uikitReactShared.createClasses("HvAccordion", {
+const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvAccordion", {
   root: {
     "& + root": {
       paddingTop: 8

package/dist/cjs/ActionBar/ActionBar.cjs

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
-const useDefaultProps = require("../hooks/useDefaultProps.cjs");
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const ActionBar_styles = require("./ActionBar.styles.cjs");
 const HvActionBar = (props) => {
   const {
@@ -9,7 +9,7 @@ const HvActionBar = (props) => {
     className,
     children,
     ...others
-  } = useDefaultProps.useDefaultProps("HvActionBar", props);
+  } = uikitReactUtils.useDefaultProps("HvActionBar", props);
   const { classes, cx } = ActionBar_styles.useClasses(classesProp);
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx(classes.root, className), ...others, children });
 };

package/dist/cjs/ActionBar/ActionBar.styles.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const uikitReactShared = require("@hitachivantara/uikit-react-shared");
-const { staticClasses, useClasses } = uikitReactShared.createClasses("HvActionBar", {
+const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvActionBar", {
   root: {
     width: "100%",
     padding: uikitStyles.theme.space.sm,

package/dist/cjs/ActionsGeneric/ActionsGeneric.cjs

@@ -3,7 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
-const useDefaultProps = require("../hooks/useDefaultProps.cjs");
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const setId = require("../utils/setId.cjs");
 const ActionsGeneric_styles = require("./ActionsGeneric.styles.cjs");
 const IconButton = require("../IconButton/IconButton.cjs");
@@ -26,7 +26,7 @@ const HvActionsGeneric = (props) => {
     iconOnly: iconOnlyProp,
     dropdownMenuProps: dropdownMenuPropsProp,
     ...others
-  } = useDefaultProps.useDefaultProps("HvActionsGeneric", props);
+  } = uikitReactUtils.useDefaultProps("HvActionsGeneric", props);
   const { onClick: onClickDropdownMenu, ...dropdownMenuProps } = dropdownMenuPropsProp || {};
   const variant = variantProp || category;
   const { classes, cx } = ActionsGeneric_styles.useClasses(classesProp);

package/dist/cjs/ActionsGeneric/ActionsGeneric.styles.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const uikitReactShared = require("@hitachivantara/uikit-react-shared");
-const { staticClasses, useClasses } = uikitReactShared.createClasses("HvActionsGeneric", {
+const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvActionsGeneric", {
   root: {},
   button: {
     "&:not(:last-child)": {

package/dist/cjs/AppSwitcher/Action/Action.cjs

@@ -7,8 +7,8 @@ const uikitStyles = require("@hitachivantara/uikit-styles");
 const useUniqueId = require("../../hooks/useUniqueId.cjs");
 const Action_styles = require("./Action.styles.cjs");
 const Avatar = require("../../Avatar/Avatar.cjs");
-const Typography = require("../../Typography/Typography.cjs");
 const ListItem = require("../../ListContainer/ListItem/ListItem.cjs");
+const Typography = require("../../Typography/Typography.cjs");
 const OverflowTooltip = require("../../OverflowTooltip/OverflowTooltip.cjs");
 const Tooltip = require("../../Tooltip/Tooltip.cjs");
 const HvAppSwitcherAction = ({
@@ -22,7 +22,10 @@ const HvAppSwitcherAction = ({
 }) => {
   const { classes, cx } = Action_styles.useClasses(classesProp);
   const { name, description, disabled, iconElement, iconUrl, url, target } = application;
-  const color = disabled ? uikitStyles.theme.colors.secondary_60 : uikitStyles.getColor(application?.color, uikitStyles.theme.colors.secondary);
+  const color = uikitStyles.getColor(
+    disabled ? "secondary_60" : application?.color,
+    "secondary"
+  );
   const [validIconUrl, setValidIconUrl] = React.useState(true);
   const renderApplicationIcon = () => {
     if (iconElement) {
@@ -58,41 +61,6 @@ const HvAppSwitcherAction = ({
   );
   const isLink = url != null;
   const descriptionElementId = useUniqueId.useUniqueId(id);
-  const renderApplication = React.useCallback(
-    (children) => {
-      const typographyProps = {
-        className: classes.typography,
-        onClick: handleOnClick,
-        style: { borderColor: color },
-        "aria-label": name,
-        ...description && { "aria-describedby": descriptionElementId }
-      };
-      if (isLink) {
-        return /* @__PURE__ */ jsxRuntime.jsx(
-          Typography.HvTypography,
-          {
-            component: "a",
-            href: url,
-            target: target || "_top",
-            ...typographyProps,
-            children
-          }
-        );
-      }
-      return /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { component: "button", ...typographyProps, children });
-    },
-    [
-      classes.typography,
-      color,
-      description,
-      descriptionElementId,
-      handleOnClick,
-      isLink,
-      name,
-      target,
-      url
-    ]
-  );
   return /* @__PURE__ */ jsxRuntime.jsx(
     ListItem.HvListItem,
     {
@@ -106,38 +74,33 @@ const HvAppSwitcherAction = ({
         { [classes.disabled]: disabled, [classes.selected]: isSelected },
         className
       ),
-      children: renderApplication(
-        /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.icon, children: renderApplicationIcon() }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            OverflowTooltip.HvOverflowTooltip,
-            {
-              paragraphOverflow: true,
-              className: classes.title,
-              placement: "top-start",
-              data: name,
-              classes: {
-                tooltipAnchorParagraph: classes.titleAnchor
-              }
-            }
-          ),
-          description && /* @__PURE__ */ jsxRuntime.jsx(
-            Tooltip.HvTooltip,
-            {
-              disableFocusListener: true,
-              disableTouchListener: true,
-              title: description,
-              children: /* @__PURE__ */ jsxRuntime.jsx(
-                uikitReactIcons.Info,
-                {
-                  className: classes.iconInfo,
-                  title: description,
-                  id: descriptionElementId
+      children: /* @__PURE__ */ jsxRuntime.jsxs(
+        Typography.HvTypography,
+        {
+          component: "button",
+          className: classes.typography,
+          onClick: handleOnClick,
+          style: { borderColor: color },
+          "aria-label": name,
+          ...description && { "aria-describedby": descriptionElementId },
+          ...isLink && { component: "a", href: url, target: target || "_top" },
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.icon, children: renderApplicationIcon() }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              OverflowTooltip.HvOverflowTooltip,
+              {
+                paragraphOverflow: true,
+                className: classes.title,
+                placement: "top-start",
+                data: name,
+                classes: {
+                  tooltipAnchorParagraph: classes.titleAnchor
                 }
-              )
-            }
-          )
-        ] })
+              }
+            ),
+            description && /* @__PURE__ */ jsxRuntime.jsx(Tooltip.HvTooltip, { title: description, children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Info, { className: classes.iconInfo, id: descriptionElementId }) })
+          ]
+        }
       )
     }
   );

package/dist/cjs/AppSwitcher/Action/Action.styles.cjs

@@ -1,15 +1,14 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const uikitReactShared = require("@hitachivantara/uikit-react-shared");
-const { staticClasses, useClasses } = uikitReactShared.createClasses(
+const { staticClasses, useClasses } = uikitReactUtils.createClasses(
   "HvAppSwitcher-Action",
   {
     root: {
       width: "100%",
       maxWidth: 280,
-      minHeight: 52,
-      marginRight: uikitStyles.theme.space.sm
+      minHeight: 52
     },
     icon: { display: "flex", minWidth: 40, justifyContent: "center" },
     iconUrl: { width: 32 },

package/dist/cjs/AppSwitcher/AppSwitcher.cjs

@@ -2,9 +2,10 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
-const useDefaultProps = require("../hooks/useDefaultProps.cjs");
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const AppSwitcher_styles = require("./AppSwitcher.styles.cjs");
 const Action = require("./Action/Action.cjs");
+const Panel = require("../Panel/Panel.cjs");
 const Typography = require("../Typography/Typography.cjs");
 const OverflowTooltip = require("../OverflowTooltip/OverflowTooltip.cjs");
 const ListContainer = require("../ListContainer/ListContainer.cjs");
@@ -22,7 +23,7 @@ const HvAppSwitcher = (props) => {
     footer,
     isOpen,
     ...others
-  } = useDefaultProps.useDefaultProps("HvAppSwitcher", props);
+  } = uikitReactUtils.useDefaultProps("HvAppSwitcher", props);
   const { classes, cx } = AppSwitcher_styles.useClasses(classesProp);
   const panelActions = React.useMemo(
     () => applications?.map((application) => {
@@ -51,7 +52,7 @@ const HvAppSwitcher = (props) => {
     [applications, classes, isActionSelectedCallback, onActionClickedCallback]
   );
   return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
+    Panel.HvPanel,
     {
       className: cx(
         classes.root,
@@ -72,7 +73,15 @@ const HvAppSwitcher = (props) => {
             }
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsx(ListContainer.HvListContainer, { disableGutters: true, className: classes.actionsContainer, children: panelActions }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          ListContainer.HvListContainer,
+          {
+            condensed: true,
+            disableGutters: true,
+            className: classes.actionsContainer,
+            children: panelActions
+          }
+        ),
         footer && /* @__PURE__ */ jsxRuntime.jsx(
           Typography.HvTypography,
           {

package/dist/cjs/AppSwitcher/AppSwitcher.styles.cjs

@@ -1,18 +1,12 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const uikitReactShared = require("@hitachivantara/uikit-react-shared");
-const { staticClasses, useClasses } = uikitReactShared.createClasses("HvAppSwitcher", {
+const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvAppSwitcher", {
   root: {
     display: "flex",
     flexDirection: "column",
-    backgroundColor: uikitStyles.theme.colors.atmo1,
-    overflow: "hidden",
-    // we need to play with the 4px because of the focus ring
-    // padding: `${theme.spacing(2) - 4}px 0 ${theme.spacing(2) - 4}px ${
-    //   theme.spacing(2) - 4
-    // }px`,
-    padding: uikitStyles.theme.spacing("sm", 0, "sm", "sm")
+    overflow: "hidden"
   },
   item: {},
   itemSelected: {},
@@ -26,20 +20,19 @@ const { staticClasses, useClasses } = uikitReactShared.createClasses("HvAppSwitc
     flexWrap: "wrap",
     justifyContent: "flex-start",
     overflowY: "auto",
-    // We need to play with the 4px because of the focus ring
-    padding: "4px 0 4px 4px"
+    gap: uikitStyles.theme.space.xs,
+    padding: 4,
+    margin: -4
   },
   footerContainer: {
     display: "flex",
     alignItems: "center",
     marginTop: "auto",
     height: 52,
-    // We need to play with the 4px because of the focus ring
-    // padding: `${theme.hv.spacing.sm - 4}px ${theme.hv.spacing.sm + 4}px 4px 4px`,
-    padding: `${uikitStyles.theme.space.sm} ${uikitStyles.theme.space.sm} 4px 4px`
+    paddingTop: uikitStyles.theme.space.sm
   },
   open: {
-    zIndex: "1200",
+    zIndex: uikitStyles.theme.zIndices.overlay,
     position: "absolute",
     top: "50px",
     overflowX: "hidden",
@@ -48,16 +41,14 @@ const { staticClasses, useClasses } = uikitReactShared.createClasses("HvAppSwitc
   closed: { display: "none" },
   title: {
     minHeight: 36,
-    // we need to play with the 4px because of the focus ring
-    // padding: `4px ${theme.hv.spacing.sm}px ${theme.hv.spacing.sm - 4}px 4px`,
-    padding: `4px ${uikitStyles.theme.space.sm} ${uikitStyles.theme.space.sm} 4px`,
+    paddingBottom: uikitStyles.theme.space.sm,
     ...uikitStyles.theme.typography.label
   },
   titleAnchor: {
     WebkitLineClamp: 2
   },
-  single: { width: 320 },
-  dual: { width: 640 },
+  single: { width: 280 + 40 },
+  dual: { width: 560 + 40 },
   fluid: {}
 });
 exports.staticClasses = staticClasses;

package/dist/cjs/Avatar/Avatar.cjs

@@ -4,9 +4,9 @@ const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const MuiAvatar = require("@mui/material/Avatar");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const AvatarGroupContext = require("../AvatarGroup/AvatarGroupContext.cjs");
-const useDefaultProps = require("../hooks/useDefaultProps.cjs");
 const useImageLoaded = require("../hooks/useImageLoaded.cjs");
 const sizes = require("../utils/sizes.cjs");
 const Avatar_styles = require("./Avatar.styles.cjs");
@@ -32,7 +32,7 @@ const HvAvatar = React.forwardRef((props, ref) => {
     variant = "circular",
     avatarProps,
     ...others
-  } = useDefaultProps.useDefaultProps("HvAvatar", props);
+  } = uikitReactUtils.useDefaultProps("HvAvatar", props);
   const { classes, cx } = Avatar_styles.useClasses(classesProp);
   const avatarGroupContext = AvatarGroupContext.useAvatarGroupContext();
   const size = sizeProp || avatarGroupContext?.size || "sm";

package/dist/cjs/Avatar/Avatar.styles.cjs

@@ -1,13 +1,13 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const focusUtils = require("../utils/focusUtils.cjs");
-const uikitReactShared = require("@hitachivantara/uikit-react-shared");
 const EXTRA_SMALL = { container: "32px", avatar: "24px" };
 const SMALL = { container: "40px", avatar: "32px" };
 const MEDIUM = { container: "48px", avatar: "40px" };
 const LARGE = { container: "60px", avatar: "52px" };
 const EXTRA_LARGE = { container: "96px", avatar: "88px" };
-const { staticClasses, useClasses } = uikitReactShared.createClasses("HvAvatar", {
+const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvAvatar", {
   root: {
     fontSize: "1rem"
   },

package/dist/cjs/AvatarGroup/AvatarGroup.cjs

@@ -2,10 +2,9 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
-const uikitReactShared = require("@hitachivantara/uikit-react-shared");
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const Avatar = require("../Avatar/Avatar.cjs");
-const useDefaultProps = require("../hooks/useDefaultProps.cjs");
 const AvatarGroup_styles = require("./AvatarGroup.styles.cjs");
 const AvatarGroupContext = require("./AvatarGroupContext.cjs");
 const getSpacingValue = (spacing, size) => {
@@ -49,7 +48,7 @@ const Overflow = ({
   maxVisible,
   size
 }) => {
-  const { css } = uikitReactShared.useCss();
+  const { css } = uikitReactUtils.useCss();
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
@@ -94,7 +93,7 @@ const HvAvatarGroup = React.forwardRef(
       highlight = false,
       toBack = false,
       ...others
-    } = useDefaultProps.useDefaultProps("HvAvatarGroup", props);
+    } = uikitReactUtils.useDefaultProps("HvAvatarGroup", props);
     const { classes, cx } = AvatarGroup_styles.useClasses(classesProp);
     const spacingValue = getSpacingValue(spacing, size);
     const totalChildren = React.Children.count(children);
@@ -107,14 +106,15 @@ const HvAvatarGroup = React.forwardRef(
         className: cx(
           classes.root,
           classes[direction],
-          { [classes.highlight]: highlight },
-          { [classes.toBack]: toBack },
+          {
+            [classes.highlight]: highlight,
+            [classes.toBack]: toBack
+          },
           className
         ),
-        style: {
-          ["--spacing"]: `-${spacingValue}px`,
-          ...style
-        },
+        style: uikitReactUtils.mergeStyles(style, {
+          "--spacing": `-${spacingValue}px`
+        }),
         ref,
         ...others,
         children: /* @__PURE__ */ jsxRuntime.jsxs(AvatarGroupContext.HvAvatarGroupProvider, { size, children: [

package/dist/cjs/AvatarGroup/AvatarGroup.styles.cjs

@@ -1,10 +1,10 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 require("../Avatar/Avatar.cjs");
 const Avatar_styles = require("../Avatar/Avatar.styles.cjs");
-const uikitReactShared = require("@hitachivantara/uikit-react-shared");
-const { staticClasses, useClasses } = uikitReactShared.createClasses("HvAvatarGroup", {
+const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvAvatarGroup", {
   root: {
     display: "flex",
     [`& .${Avatar_styles.staticClasses.root}`]: {

package/dist/cjs/Badge/Badge.cjs

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
-const useDefaultProps = require("../hooks/useDefaultProps.cjs");
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const Badge_styles = require("./Badge.styles.cjs");
 const Typography = require("../Typography/Typography.cjs");
 const HvBadge = (props) => {
@@ -16,7 +16,7 @@ const HvBadge = (props) => {
     text = null,
     textVariant = void 0,
     ...others
-  } = useDefaultProps.useDefaultProps("HvBadge", props);
+  } = uikitReactUtils.useDefaultProps("HvBadge", props);
   const { classes, cx } = Badge_styles.useClasses(classesProp);
   const renderedCount = count > maxCount ? `${maxCount}+` : count;
   const renderedCountOrLabel = label || showCount && count > 0 && renderedCount || null;

package/dist/cjs/Badge/Badge.styles.cjs

@@ -1,14 +1,14 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const uikitReactShared = require("@hitachivantara/uikit-react-shared");
 const labelBaseStyle = {
   ...uikitStyles.theme.typography.label,
   padding: "0 5px",
   color: uikitStyles.theme.colors.atmo1,
   lineHeight: "16px"
 };
-const { staticClasses, useClasses } = uikitReactShared.createClasses("HvBadge", {
+const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvBadge", {
   root: { position: "relative", "&>*": { float: "left" } },
   badgeContainer: { width: 0 },
   badgePosition: {},

package/dist/cjs/Banner/Banner.cjs

@@ -4,7 +4,7 @@ const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const Slide = require("@mui/material/Slide");
 const Snackbar = require("@mui/material/Snackbar");
-const useDefaultProps = require("../hooks/useDefaultProps.cjs");
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const setId = require("../utils/setId.cjs");
 const Banner_styles = require("./Banner.styles.cjs");
 const BannerContent = require("./BannerContent/BannerContent.cjs");
@@ -34,7 +34,7 @@ const HvBanner = (props) => {
     offset = 60,
     bannerContentProps,
     ...others
-  } = useDefaultProps.useDefaultProps("HvBanner", props);
+  } = uikitReactUtils.useDefaultProps("HvBanner", props);
   const { classes, cx } = Banner_styles.useClasses(classesProp);
   const anchorOriginBanner = {
     horizontal: "center",

package/dist/cjs/Banner/Banner.styles.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const uikitReactShared = require("@hitachivantara/uikit-react-shared");
-const { useClasses, staticClasses } = uikitReactShared.createClasses("HvBanner", {
+const { useClasses, staticClasses } = uikitReactUtils.createClasses("HvBanner", {
   /** Styles applied to the component root class when the component is closed. */
   rootClosed: {
     display: "none"

package/dist/cjs/Banner/BannerContent/ActionContainer/ActionContainer.styles.cjs

@@ -1,9 +1,9 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const focusUtils = require("../../../utils/focusUtils.cjs");
-const uikitReactShared = require("@hitachivantara/uikit-react-shared");
 const name = "HvBannerActionContainer";
-const { staticClasses, useClasses } = uikitReactShared.createClasses(name, {
+const { staticClasses, useClasses } = uikitReactUtils.createClasses(name, {
   actionContainer: {
     display: "flex",
     flexDirection: "column",

package/dist/cjs/Banner/BannerContent/BannerContent.styles.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const uikitReactShared = require("@hitachivantara/uikit-react-shared");
-const { useClasses, staticClasses } = uikitReactShared.createClasses("HvBannerContent", {
+const { useClasses, staticClasses } = uikitReactUtils.createClasses("HvBannerContent", {
   root: {
     minWidth: "100%",
     position: "relative",

package/dist/cjs/Banner/BannerContent/MessageContainer/MessageContainer.styles.cjs

@@ -1,9 +1,9 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const uikitStyles = require("@hitachivantara/uikit-styles");
-const uikitReactShared = require("@hitachivantara/uikit-react-shared");
 const name = "HvBannerMessageContainer";
-const { staticClasses, useClasses } = uikitReactShared.createClasses(name, {
+const { staticClasses, useClasses } = uikitReactUtils.createClasses(name, {
   message: {
     color: uikitStyles.theme.colors.base_dark,
     wordBreak: "break-word",

package/dist/cjs/BaseCheckBox/BaseCheckBox.cjs

@@ -3,7 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const MuiCheckbox = require("@mui/material/Checkbox");
-const useDefaultProps = require("../hooks/useDefaultProps.cjs");
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const BaseCheckBox_styles = require("./BaseCheckBox.styles.cjs");
 const icons = require("./icons.cjs");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
@@ -34,7 +34,7 @@ const HvBaseCheckBox = React.forwardRef((props, ref) => {
     disabled = false,
     semantic = false,
     ...others
-  } = useDefaultProps.useDefaultProps("HvBaseCheckBox", props);
+  } = uikitReactUtils.useDefaultProps("HvBaseCheckBox", props);
   const { classes, cx } = BaseCheckBox_styles.useClasses(classesProp);
   const [focusVisible, setFocusVisible] = React.useState(false);
   const icons2 = getSelectorIcons();

package/dist/cjs/BaseCheckBox/BaseCheckBox.styles.cjs

@@ -1,9 +1,9 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const focusUtils = require("../utils/focusUtils.cjs");
-const uikitReactShared = require("@hitachivantara/uikit-react-shared");
-const { staticClasses, useClasses } = uikitReactShared.createClasses("HvBaseCheckBox", {
+const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvBaseCheckBox", {
   root: {
     padding: 0,
     width: 32,