@hitachivantara/uikit-react-core 5.91.3 → 5.93.0

package/dist/cjs/ColorPicker/ColorPicker.cjs

@@ -2,19 +2,18 @@
 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 LabelContainer = require("../FormElement/LabelContainer.cjs");
 const useControlled = require("../hooks/useControlled.cjs");
 const useLabels = require("../hooks/useLabels.cjs");
 const useUniqueId = require("../hooks/useUniqueId.cjs");
+const icons = require("../icons.cjs");
 const setId = require("../utils/setId.cjs");
 const ColorPicker_styles = require("./ColorPicker.styles.cjs");
 const PresetColors = require("./PresetColors/PresetColors.cjs");
 const Picker = require("./Picker/Picker.cjs");
 const SavedColors = require("./SavedColors/SavedColors.cjs");
 const FormElement = require("../FormElement/FormElement.cjs");
-const Label = require("../FormElement/Label/Label.cjs");
-const InfoMessage = require("../FormElement/InfoMessage/InfoMessage.cjs");
 const BaseDropdown = require("../BaseDropdown/BaseDropdown.cjs");
 const Panel = require("../Panel/Panel.cjs");
 const Typography = require("../Typography/Typography.cjs");
@@ -80,8 +79,6 @@ const HvColorPicker = React.forwardRef(
       defaultSavedColorsValue
     );
     const elementId = useUniqueId.useUniqueId(id);
-    const hasLabel = label != null;
-    const hasDescription = description != null;
     const handleToggle = (_, open) => {
       setIsOpen(open);
     };
@@ -126,25 +123,20 @@ const HvColorPicker = React.forwardRef(
         required,
         className: cx(classes.root, className),
         children: [
-          (hasLabel || hasDescription) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.labelContainer, children: [
-            hasLabel && /* @__PURE__ */ jsxRuntime.jsx(
-              Label.HvLabel,
-              {
-                showGutter: true,
-                id: setId.setId(elementId, "label"),
-                label,
-                className: classes.label
-              }
-            ),
-            hasDescription && /* @__PURE__ */ jsxRuntime.jsx(
-              InfoMessage.HvInfoMessage,
-              {
-                id: setId.setId(elementId, "description"),
-                className: classes.description,
-                children: description
+          /* @__PURE__ */ jsxRuntime.jsx(
+            LabelContainer.HvLabelContainer,
+            {
+              label,
+              description,
+              labelId: setId.setId(elementId, "label"),
+              descriptionId: setId.setId(elementId, "description"),
+              classes: {
+                root: classes.labelContainer,
+                label: classes.label,
+                description: classes.description
               }
-            )
-          ] }),
+            }
+          ),
           /* @__PURE__ */ jsxRuntime.jsx(
             BaseDropdown.HvBaseDropdown,
             {
@@ -166,7 +158,7 @@ const HvColorPicker = React.forwardRef(
                     classes.headerColorIconOnly
                   )
                 }
-              ) : dropdownIcon === "colorPicker" ? /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.ColorPicker, { className: classes.colorPickerIcon }) : void 0,
+              ) : dropdownIcon === "colorPicker" ? /* @__PURE__ */ jsxRuntime.jsx(icons.HvIcon, { name: "ColorPicker", className: classes.colorPickerIcon }) : void 0,
               placeholder: iconOnly ? void 0 : color ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
                 /* @__PURE__ */ jsxRuntime.jsx(
                   "div",

package/dist/cjs/ColorPicker/ColorPicker.styles.cjs

@@ -3,10 +3,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvColorPicker", {
   root: {},
-  labelContainer: {
-    display: "flex",
-    alignItems: "flex-start"
-  },
+  labelContainer: {},
   label: {},
   description: {},
   headerColorValue: {
@@ -38,8 +35,10 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvColorPick
     }
   },
   dropdownRootIconOnly: {
-    width: 32,
-    height: 32,
+    "&,& .HvBaseDropdown-arrowContainer": {
+      width: 32,
+      height: 32
+    },
     "& .HvBaseDropdown-selection": {
       padding: 0
     }

package/dist/cjs/ColorPicker/SavedColors/SavedColors.cjs

@@ -2,8 +2,8 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const common = require("react-color/lib/components/common");
-const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
+const icons = require("../../icons.cjs");
 const SavedColors_styles = require("./SavedColors.styles.cjs");
 const IconButton = require("../../IconButton/IconButton.cjs");
 const SavedColors = (props) => {
@@ -31,7 +31,7 @@ const SavedColors = (props) => {
         variant: "secondarySubtle",
         onClick: onAddColor,
         title: addButtonAriaLabel,
-        children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Add, { "aria-hidden": true })
+        children: /* @__PURE__ */ jsxRuntime.jsx(icons.HvIcon, { name: "Add", compact: true })
       }
     ),
     colors.map((color, index) => /* @__PURE__ */ jsxRuntime.jsxs(
@@ -56,7 +56,7 @@ const SavedColors = (props) => {
               variant: "secondarySubtle",
               onClick: () => onRemoveColor(color, index),
               title: deleteButtonAriaLabel,
-              children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.CloseXS, { "aria-hidden": true, iconSize: "XS" })
+              children: /* @__PURE__ */ jsxRuntime.jsx(icons.HvIcon, { name: "Close", compact: true, size: "xs" })
             }
           ) })
         ]

package/dist/cjs/ColorPicker/SavedColors/SavedColors.styles.cjs

@@ -41,16 +41,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses(name, {
   },
   removeButton: {
     height: 16,
-    width: 16,
-    minWidth: 16,
-    minHeight: 16,
-    padding: 0,
-    margin: 0,
-    "& div > span": {
-      height: 16,
-      width: 16,
-      "& > div": { height: 16, width: 16 }
-    }
+    width: 16
   }
 });
 exports.staticClasses = staticClasses;

package/dist/cjs/DatePicker/DatePicker.cjs

@@ -3,12 +3,13 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const utils$1 = require("@mui/material/utils");
-const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const utils = require("../Calendar/utils.cjs");
+const LabelContainer = require("../FormElement/LabelContainer.cjs");
 const useControlled = require("../hooks/useControlled.cjs");
 const useLabels = require("../hooks/useLabels.cjs");
 const useUniqueId = require("../hooks/useUniqueId.cjs");
+const icons = require("../icons.cjs");
 const setId = require("../utils/setId.cjs");
 const useSavedState = require("../utils/useSavedState.cjs");
 const DatePicker_styles = require("./DatePicker.styles.cjs");
@@ -16,11 +17,9 @@ const useVisibleDate = require("./useVisibleDate.cjs");
 const utils$2 = require("./utils.cjs");
 const Calendar = require("../Calendar/Calendar.cjs");
 const Button = require("../Button/Button.cjs");
-const utils$3 = require("../FormElement/utils.cjs");
 const FormElement = require("../FormElement/FormElement.cjs");
-const Label = require("../FormElement/Label/Label.cjs");
-const InfoMessage = require("../FormElement/InfoMessage/InfoMessage.cjs");
 const BaseDropdown = require("../BaseDropdown/BaseDropdown.cjs");
+const utils$3 = require("../FormElement/utils.cjs");
 const WarningText = require("../FormElement/WarningText/WarningText.cjs");
 const ActionBar = require("../ActionBar/ActionBar.cjs");
 const DEFAULT_LABELS = {
@@ -233,8 +232,6 @@ const HvDatePicker = React.forwardRef(
     ] });
     const dateValue = rangeMode ? { startDate, endDate } : startDate;
     const dateString = utils$2.getDateLabel(dateValue, rangeMode, locale);
-    const hasLabel = label != null;
-    const hasDescription = description != null;
     const canShowError = ariaErrorMessage == null && (status !== void 0 && statusMessage !== void 0 || status === void 0 && required);
     const isStateInvalid = utils$3.isInvalid(validationState);
     let errorMessageId;
@@ -254,25 +251,20 @@ const HvDatePicker = React.forwardRef(
         readOnly,
         ...others,
         children: [
-          (hasLabel || hasDescription) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.labelContainer, children: [
-            hasLabel && /* @__PURE__ */ jsxRuntime.jsx(
-              Label.HvLabel,
-              {
-                showGutter: true,
-                id: setId.setId(elementId, "label"),
-                label,
-                className: classes.label
-              }
-            ),
-            hasDescription && /* @__PURE__ */ jsxRuntime.jsx(
-              InfoMessage.HvInfoMessage,
-              {
-                id: setId.setId(elementId, "description"),
-                className: classes.description,
-                children: description
+          /* @__PURE__ */ jsxRuntime.jsx(
+            LabelContainer.HvLabelContainer,
+            {
+              label,
+              description,
+              labelId: setId.setId(elementId, "label"),
+              descriptionId: setId.setId(elementId, "description"),
+              classes: {
+                root: classes.labelContainer,
+                label: classes.label,
+                description: classes.description
               }
-            )
-          ] }),
+            }
+          ),
           /* @__PURE__ */ jsxRuntime.jsxs(
             BaseDropdown.HvBaseDropdown,
             {
@@ -298,7 +290,7 @@ const HvDatePicker = React.forwardRef(
               onClickOutside: handleCalendarClose,
               onContainerCreation: focusOnContainer,
               placeholder: dateString || placeholder || "",
-              adornment: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Calendar, { className: classes.icon }),
+              adornment: /* @__PURE__ */ jsxRuntime.jsx(icons.HvIcon, { name: "Calendar", className: classes.icon }),
               popperProps: {
                 modifiers: [
                   { name: "preventOverflow", enabled: escapeWithReference }

package/dist/cjs/DatePicker/DatePicker.styles.cjs

@@ -11,10 +11,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvDatePicke
   },
   leftContainer: {},
   rightContainer: {},
-  labelContainer: {
-    display: "flex",
-    alignItems: "flex-start"
-  },
+  labelContainer: {},
   label: {},
   description: {},
   error: {},

package/dist/cjs/Dialog/Dialog.cjs

@@ -3,8 +3,8 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const MuiDialog = require("@mui/material/Dialog");
-const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
+const icons = require("../icons.cjs");
 const document$1 = require("../utils/document.cjs");
 const setId = require("../utils/setId.cjs");
 const context = require("./context.cjs");
@@ -74,7 +74,7 @@ const HvDialog = (props) => {
             id: setId.setId(id, "close"),
             className: classes.closeButton,
             onClick: (event) => onClose?.(event, void 0),
-            children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Close, {})
+            children: /* @__PURE__ */ jsxRuntime.jsx(icons.HvIcon, { name: "Close", compact: true })
           }
         ),
         /* @__PURE__ */ jsxRuntime.jsx(context.DialogContext.Provider, { value: contextValue, children })

package/dist/cjs/DotPagination/DotPagination.styles.cjs

@@ -43,7 +43,7 @@ const { useClasses, staticClasses } = uikitReactUtils.createClasses("HvDotPagina
       backgroundColor: "currentcolor",
       width: "1em",
       height: "1em",
-      borderRadius: "50%"
+      borderRadius: uikitStyles.theme.radii.full
     }
   }
 });

package/dist/cjs/Drawer/Drawer.cjs

@@ -3,8 +3,8 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const MuiDrawer = require("@mui/material/Drawer");
-const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
+const icons = require("../icons.cjs");
 const setId = require("../utils/setId.cjs");
 const Drawer_styles = require("./Drawer.styles.cjs");
 const IconButton = require("../IconButton/IconButton.cjs");
@@ -62,7 +62,7 @@ const HvDrawer = React.forwardRef(function HvDrawer2(props, ref) {
             className: classes.closeButton,
             onClick: onClose,
             title: buttonTitle,
-            children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Close, {})
+            children: /* @__PURE__ */ jsxRuntime.jsx(icons.HvIcon, { name: "Close" })
           }
         ),
         children

package/dist/cjs/DropDownMenu/DropDownMenu.cjs

@@ -2,12 +2,12 @@
 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 context = require("../BaseDropdown/context.cjs");
 const useControlled = require("../hooks/useControlled.cjs");
 const useLabels = require("../hooks/useLabels.cjs");
 const useUniqueId = require("../hooks/useUniqueId.cjs");
+const icons = require("../icons.cjs");
 const focusableElementFinder = require("../utils/focusableElementFinder.cjs");
 const keyboardUtils = require("../utils/keyboardUtils.cjs");
 const setId = require("../utils/setId.cjs");
@@ -33,7 +33,7 @@ const HeaderComponent = React.forwardRef(
         "aria-haspopup": "menu",
         placement: popperPlacement,
         ...others,
-        children: icon || /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.MoreOptionsVertical, { role: "presentation" })
+        children: icon || /* @__PURE__ */ jsxRuntime.jsx(icons.HvIcon, { name: "DotsVertical" })
       }
     );
   }

package/dist/cjs/DropDownMenu/DropDownMenu.styles.cjs

@@ -3,7 +3,12 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvDropDownMenu", {
-  root: {},
+  root: {
+    flexShrink: 0,
+    "& > div": {
+      height: "inherit"
+    }
+  },
   /** @deprecated use `classes.root` instead */
   container: {},
   baseContainer: {

package/dist/cjs/Dropdown/Dropdown.cjs

@@ -4,6 +4,7 @@ const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const utils$1 = require("@mui/material/utils");
 const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
+const LabelContainer = require("../FormElement/LabelContainer.cjs");
 const useControlled = require("../hooks/useControlled.cjs");
 const useLabels = require("../hooks/useLabels.cjs");
 const useUniqueId = require("../hooks/useUniqueId.cjs");
@@ -13,11 +14,9 @@ const setId = require("../utils/setId.cjs");
 const Dropdown_styles = require("./Dropdown.styles.cjs");
 const utils = require("./utils.cjs");
 const List = require("./List/List.cjs");
-const utils$2 = require("../FormElement/utils.cjs");
 const FormElement = require("../FormElement/FormElement.cjs");
-const Label = require("../FormElement/Label/Label.cjs");
-const InfoMessage = require("../FormElement/InfoMessage/InfoMessage.cjs");
 const BaseDropdown = require("../BaseDropdown/BaseDropdown.cjs");
+const utils$2 = require("../FormElement/utils.cjs");
 const WarningText = require("../FormElement/WarningText/WarningText.cjs");
 const Typography = require("../Typography/Typography.cjs");
 const DEFAULT_LABELS = {
@@ -196,8 +195,6 @@ const HvDropdown = generic.fixedForwardRef(function HvDropdown2(props, ref) {
       }
     );
   };
-  const hasLabel = label != null;
-  const hasDescription = description != null;
   const canShowError = ariaErrorMessage == null && (status !== void 0 && statusMessage !== void 0 || status === void 0 && required);
   const isStateInvalid = utils$2.isInvalid(validationState);
   let errorMessageId;
@@ -222,25 +219,20 @@ const HvDropdown = generic.fixedForwardRef(function HvDropdown2(props, ref) {
       ),
       ...others,
       children: [
-        (hasLabel || hasDescription) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.labelContainer, children: [
-          hasLabel && /* @__PURE__ */ jsxRuntime.jsx(
-            Label.HvLabel,
-            {
-              showGutter: true,
-              id: setId.setId(elementId, "label"),
-              label,
-              className: classes.label
-            }
-          ),
-          hasDescription && /* @__PURE__ */ jsxRuntime.jsx(
-            InfoMessage.HvInfoMessage,
-            {
-              id: setId.setId(elementId, "description"),
-              className: classes.description,
-              children: description
+        /* @__PURE__ */ jsxRuntime.jsx(
+          LabelContainer.HvLabelContainer,
+          {
+            label,
+            description,
+            labelId: setId.setId(elementId, "label"),
+            descriptionId: setId.setId(elementId, "description"),
+            classes: {
+              root: classes.labelContainer,
+              label: classes.label,
+              description: classes.description
             }
-          )
-        ] }),
+          }
+        ),
         /* @__PURE__ */ jsxRuntime.jsx(
           BaseDropdown.HvBaseDropdown,
           {
@@ -296,7 +288,7 @@ const HvDropdown = generic.fixedForwardRef(function HvDropdown2(props, ref) {
                 hasTooltips,
                 singleSelectionToggle,
                 "aria-label": ariaLabel,
-                "aria-labelledby": hasLabel ? setId.setId(elementId, "label") : void 0,
+                "aria-labelledby": label ? setId.setId(elementId, "label") : void 0,
                 height,
                 maxHeight,
                 virtualized,

package/dist/cjs/Dropdown/Dropdown.styles.cjs

@@ -8,7 +8,7 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvDropdown"
     position: "relative",
     display: "inline-block"
   },
-  labelContainer: { display: "flex", alignItems: "flex-start" },
+  labelContainer: {},
   label: {},
   description: {},
   error: {},

package/dist/cjs/DropdownButton/DropdownButton.cjs

@@ -2,8 +2,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 icons = require("../icons.cjs");
 const DropdownButton_styles = require("./DropdownButton.styles.cjs");
 const Button = require("../Button/Button.cjs");
 const HvDropdownButton = React.forwardRef(function HvDropdownButton2(props, ref) {
@@ -15,12 +15,13 @@ const HvDropdownButton = React.forwardRef(function HvDropdownButton2(props, ref)
     open,
     icon,
     readOnly,
-    children,
+    children: childrenProp,
     variant,
     ...others
   } = uikitReactUtils.useDefaultProps("HvDropdownButton", props);
   const { classes, cx } = DropdownButton_styles.useClasses(classesProp, false);
-  const endIcon = icon ? void 0 : /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.DropDownXS, { size: "XS", rotate: open });
+  const endIcon = !icon && /* @__PURE__ */ jsxRuntime.jsx(icons.HvIcon, { name: "CaretDown", size: "xs", rotate: open });
+  const children = childrenProp && typeof childrenProp === "string" ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.placeholder, children: childrenProp }) : childrenProp;
   return /* @__PURE__ */ jsxRuntime.jsx(
     Button.HvButton,
     {
@@ -41,7 +42,7 @@ const HvDropdownButton = React.forwardRef(function HvDropdownButton2(props, ref)
       endIcon,
       variant: open ? "secondarySubtle" : variant,
       ...others,
-      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx({ [classes.selection]: !icon }), children: children && typeof children === "string" ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.placeholder, children }) : children })
+      children: icon ? children : /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.selection, children })
     }
   );
 });

package/dist/cjs/FileUploader/DropZone/DropZone.cjs

@@ -2,17 +2,16 @@
 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 LabelContainer = require("../../FormElement/LabelContainer.cjs");
 const useLabels = require("../../hooks/useLabels.cjs");
 const useUniqueId = require("../../hooks/useUniqueId.cjs");
+const icons = require("../../icons.cjs");
 const helpers = require("../../utils/helpers.cjs");
 const setId = require("../../utils/setId.cjs");
 const utils = require("../utils.cjs");
 const DropZone_styles = require("./DropZone.styles.cjs");
 const context = require("../../FormElement/context.cjs");
-const Label = require("../../FormElement/Label/Label.cjs");
-const InfoMessage = require("../../FormElement/InfoMessage/InfoMessage.cjs");
 const DEFAULT_LABELS = {
   /** Extensions of the accepted file types */
   acceptedFiles: "",
@@ -99,23 +98,26 @@ const HvDropZone = (props) => {
     });
     onFilesAdded?.(newFiles);
   };
+  const description = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    Number.isInteger(maxFileSize) && `${labels.sizeWarning} ${utils.convertUnits(maxFileSize)}`,
+    labels.acceptedFiles || accept && ` (${accept?.replaceAll(",", ", ")})`
+  ] });
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    !hideLabels && /* @__PURE__ */ jsxRuntime.jsxs("div", { id, className: classes.dropZoneLabelsGroup, children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
-        Label.HvLabel,
-        {
-          showGutter: true,
-          id: setId.setId(id, "input-file-label"),
-          htmlFor: setId.setId(id, "input-file"),
-          label: label ?? labels?.dropzone,
-          className: classes.dropZoneLabel
+    !hideLabels && /* @__PURE__ */ jsxRuntime.jsx(
+      LabelContainer.HvLabelContainer,
+      {
+        id,
+        label: label ?? labels.dropzone,
+        description,
+        inputId: setId.setId(id, "input-file"),
+        labelId: setId.setId(id, "input-file-label"),
+        descriptionId: setId.setId(id, "description"),
+        classes: {
+          root: classes.dropZoneLabelsGroup,
+          label: classes.dropZoneLabel
         }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsxs(InfoMessage.HvInfoMessage, { id: setId.setId(id, "description"), children: [
-        Number.isInteger(maxFileSize) && `${labels?.sizeWarning} ${utils.convertUnits(maxFileSize)}`,
-        labels?.acceptedFiles ? labels.acceptedFiles : accept && ` (${accept?.replaceAll(",", ", ")})`
-      ] })
-    ] }),
+      }
+    ),
     /* @__PURE__ */ jsxRuntime.jsxs(
       "div",
       {
@@ -163,7 +165,14 @@ const HvDropZone = (props) => {
             }
           ),
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes?.dropArea, children: dragState ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.dropZoneAreaLabels, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.dragText, children: labels?.dropFiles }) }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-            /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Doc, { size: "M", className: classes.dropZoneAreaIcon }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              icons.HvIcon,
+              {
+                name: "Doc",
+                size: "md",
+                className: classes.dropZoneAreaIcon
+              }
+            ),
             /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.dropZoneAreaLabels, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classes.dragText, children: [
               labels?.drag,
               /* @__PURE__ */ jsxRuntime.jsx(

package/dist/cjs/FileUploader/DropZone/DropZone.styles.cjs

@@ -21,9 +21,6 @@ const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvDropZone"
     }
   },
   dropZoneLabelsGroup: {
-    display: "flex",
-    justifyContent: "start",
-    "& label:nth-of-type(1)": {},
     "& p:nth-of-type(2)": {
       marginLeft: "auto"
     }

package/dist/cjs/FileUploader/File/File.cjs

@@ -1,8 +1,8 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const jsxRuntime = require("react/jsx-runtime");
-const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
+const icons = require("../../icons.cjs");
 const utils = require("../utils.cjs");
 const File_styles = require("./File.styles.cjs");
 const ProgressBar = require("../../ProgressBar/ProgressBar.cjs");
@@ -11,9 +11,9 @@ const IconButton = require("../../IconButton/IconButton.cjs");
 const getStatusIcon = (classes, status) => {
   switch (status) {
     case "success":
-      return /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Success, { className: classes?.icon, color: "positive" });
+      return /* @__PURE__ */ jsxRuntime.jsx(icons.HvIcon, { name: "Success", className: classes?.icon, color: "positive" });
     case "fail":
-      return /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Fail, { className: classes?.icon, color: "negative" });
+      return /* @__PURE__ */ jsxRuntime.jsx(icons.HvIcon, { name: "Fail", className: classes?.icon, color: "negative" });
     default:
       return /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes?.icon });
   }
@@ -72,7 +72,7 @@ const HvFile = (props) => {
         title: removeFileButtonLabel,
         className: classes.removeButton,
         onClick: () => onFileRemoved?.(data),
-        children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Close, { iconSize: "XS" })
+        children: /* @__PURE__ */ jsxRuntime.jsx(icons.HvIcon, { name: "Close", size: "xs" })
       }
     )
   ] });

package/dist/cjs/FileUploader/Preview/Preview.cjs

@@ -2,8 +2,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 icons = require("../../Input/icons.cjs");
 const Preview_styles = require("./Preview.styles.cjs");
 const Button = require("../../Button/Button.cjs");
 const HvFileUploaderPreview = (props) => {
@@ -33,7 +33,7 @@ const HvFileUploaderPreview = (props) => {
         children: [
           children,
           !disableOverlay && /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.overlay, "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
-            uikitReactIcons.Preview,
+            icons.EyeIcon,
             {
               className: css({
                 position: "absolute",

package/dist/cjs/FilterGroup/FilterContent/FilterContent.cjs

@@ -2,8 +2,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 icons = require("../../icons.cjs");
 const setId = require("../../utils/setId.cjs");
 const FilterGroupContext = require("../FilterGroupContext.cjs");
 const FilterContent_styles = require("./FilterContent.styles.cjs");
@@ -72,7 +72,7 @@ const HvFilterGroupContent = React.forwardRef(function HvFilterGroupContent2(pro
   };
   const Header = React.useMemo(
     () => /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Filters, {}),
+      /* @__PURE__ */ jsxRuntime.jsx(icons.HvIcon, { name: "Filters" }),
       /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { variant: "label", children: labels?.placeholder })
     ] }),
     [labels?.placeholder]