@hitachivantara/uikit-react-core 5.27.6 → 5.27.7

package/dist/cjs/components/EmptyState/EmptyState.cjs

@@ -1,12 +1,12 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const styles = require("@mui/material/styles");
 const useMediaQuery = require("@mui/material/useMediaQuery");
 const uikitStyles = require("@hitachivantara/uikit-styles");
 const useDefaultProps = require("../../hooks/useDefaultProps.cjs");
 const useTheme = require("../../hooks/useTheme.cjs");
 const EmptyState_styles = require("./EmptyState.styles.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const Typography = require("../Typography/Typography.cjs");
 const _interopDefault = (e) => e && e.__esModule ? e : { default: e };
 const useMediaQuery__default = /* @__PURE__ */ _interopDefault(useMediaQuery);
@@ -32,35 +32,25 @@ const HvEmptyState = (props) => {
   const onlyXs = useMediaQuery__default.default(muiTheme.breakpoints.only("xs"));
   const upSm = useMediaQuery__default.default(muiTheme.breakpoints.up("sm"));
   const messageOnly = !!(message && !(title || action));
-  const renderNode = (variant, node, style) => node && /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
-    variant,
-    className: style,
-    children: node
-  });
-  return /* @__PURE__ */ jsxRuntime.jsx("div", {
-    className: cx(classes.root, className),
-    ...others,
-    children: /* @__PURE__ */ jsxRuntime.jsxs("div", {
-      className: cx(classes.container, onlyXs && css({
-        flexDirection: "column",
-        alignItems: "center",
-        textAlign: "center"
-      }), {
-        [classes.containerMessageOnly]: messageOnly
-      }, onlyXs && messageOnly && css({
-        flexDirection: "row"
-      })),
-      children: [/* @__PURE__ */ jsxRuntime.jsx("div", {
-        className: classes.iconContainer,
-        children: icon
-      }), /* @__PURE__ */ jsxRuntime.jsxs("div", {
-        className: cx(classes.textContainer, upSm && css({
-          marginLeft: uikitStyles.theme.space.xs
-        })),
-        children: [renderNode(activeTheme == null ? void 0 : activeTheme.emptyState.titleVariant, title, classes.titleContainer), renderNode("body", message, classes.messageContainer), renderNode("body", action, classes.actionContainer)]
-      })]
-    })
-  });
+  const renderNode = (variant, node, style) => node && /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { variant, className: style, children: node });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cx(classes.root, className), ...others, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx(classes.container, onlyXs && css({
+    flexDirection: "column",
+    alignItems: "center",
+    textAlign: "center"
+  }), {
+    [classes.containerMessageOnly]: messageOnly
+  }, onlyXs && messageOnly && css({
+    flexDirection: "row"
+  })), children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.iconContainer, children: icon }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cx(classes.textContainer, upSm && css({
+      marginLeft: uikitStyles.theme.space.xs
+    })), children: [
+      renderNode(activeTheme == null ? void 0 : activeTheme.emptyState.titleVariant, title, classes.titleContainer),
+      renderNode("body", message, classes.messageContainer),
+      renderNode("body", action, classes.actionContainer)
+    ] })
+  ] }) });
 };
 exports.emptyStateClasses = EmptyState_styles.staticClasses;
 exports.HvEmptyState = HvEmptyState;

package/dist/cjs/components/EmptyState/EmptyState.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"EmptyState.cjs","sources":["../../../../src/components/EmptyState/EmptyState.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { useTheme } from \"@mui/material/styles\";\nimport useMediaQuery from \"@mui/material/useMediaQuery\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvTypography, HvTypographyProps } from \"@core/components/Typography\";\nimport { useTheme as useHvTheme } from \"@core/hooks/useTheme\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./EmptyState.styles\";\n\nexport { staticClasses as emptyStateClasses };\n\nexport type HvEmptyStateClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvEmptyStateProps\n  extends HvBaseProps<HTMLDivElement, \"title\"> {\n  /** Icon to be presented. */\n  icon: React.ReactNode;\n  /** The title to be shown. */\n  title?: string | React.ReactNode;\n  /** The message to be shown. */\n  message?: string | React.ReactNode;\n  /** The action message to be shown. */\n  action?: string | React.ReactNode;\n  /** A Jss Object used to override or extend the styles applied to the empty state component. */\n  classes?: HvEmptyStateClasses;\n}\n\n/**\n * Empty states communicate that there’s no information, data or values to display in a given context.\n */\nexport const HvEmptyState = (props: HvEmptyStateProps) => {\n  const {\n    action,\n    icon,\n    title,\n    message,\n    classes: classesProp,\n    className,\n    ...others\n  } = useDefaultProps(\"HvEmptyState\", props);\n\n  const { classes, cx, css } = useClasses(classesProp);\n\n  const { activeTheme } = useHvTheme();\n\n  const muiTheme = useTheme();\n\n  const onlyXs = useMediaQuery(muiTheme.breakpoints.only(\"xs\"));\n  const upSm = useMediaQuery(muiTheme.breakpoints.up(\"sm\"));\n\n  const messageOnly = !!(message && !(title || action));\n\n  const renderNode = (\n    variant?: HvTypographyProps[\"variant\"],\n    node?: React.ReactNode,\n    style?: string\n  ) =>\n    node && (\n      <HvTypography variant={variant} className={style}>\n        {node}\n      </HvTypography>\n    );\n\n  return (\n    <div className={cx(classes.root, className)} {...others}>\n      <div\n        className={cx(\n          classes.container,\n          onlyXs &&\n            css({\n              flexDirection: \"column\",\n              alignItems: \"center\",\n              textAlign: \"center\",\n            }),\n          {\n            [classes.containerMessageOnly]: messageOnly,\n          },\n          onlyXs && messageOnly && css({ flexDirection: \"row\" })\n        )}\n      >\n        <div className={classes.iconContainer}>{icon}</div>\n        <div\n          className={cx(\n            classes.textContainer,\n            upSm && css({ marginLeft: theme.space.xs })\n          )}\n        >\n          {renderNode(\n            activeTheme?.emptyState.titleVariant,\n            title,\n            classes.titleContainer\n          )}\n          {renderNode(\"body\", message, classes.messageContainer)}\n          {renderNode(\"body\", action, classes.actionContainer)}\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"names":["HvEmptyState","props","action","icon","title","message","classes","classesProp","className","others","useDefaultProps","cx","css","useClasses","activeTheme","useHvTheme","muiTheme","useTheme","onlyXs","useMediaQuery","breakpoints","only","upSm","up","messageOnly","renderNode","variant","node","style","HvTypography","children","root","container","flexDirection","alignItems","textAlign","containerMessageOnly","_jsx","iconContainer","_jsxs","textContainer","marginLeft","theme","space","xs","emptyState","titleVariant","titleContainer","messageContainer","actionContainer"],"mappings":";;;;;;;;;;;;AAoCaA,MAAAA,eAAeA,CAACC,UAA6B;AAClD,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,gBAAgBT,KAAK;AAEnC,QAAA;AAAA,IAAEK;AAAAA,IAASK;AAAAA,IAAIC;AAAAA,EAAAA,IAAQC,kBAAAA,WAAWN,WAAW;AAE7C,QAAA;AAAA,IAAEO;AAAAA,MAAgBC,SAAW,SAAA;AAEnC,QAAMC,WAAWC,OAAAA;AAEjB,QAAMC,SAASC,uBAAAA,QAAcH,SAASI,YAAYC,KAAK,IAAI,CAAC;AAC5D,QAAMC,OAAOH,uBAAAA,QAAcH,SAASI,YAAYG,GAAG,IAAI,CAAC;AAExD,QAAMC,cAAc,CAAC,EAAEnB,WAAW,EAAED,SAASF;AAE7C,QAAMuB,aAAaA,CACjBC,SACAC,MACAC,UAEAD,uCACGE,yBAAY;AAAA,IAACH;AAAAA,IAAkBlB,WAAWoB;AAAAA,IAAME,UAC9CH;AAAAA,EAAAA,CACW;AAGlB,wCACE,OAAA;AAAA,IAAKnB,WAAWG,GAAGL,QAAQyB,MAAMvB,SAAS;AAAA,IAAE,GAAKC;AAAAA,IAAMqB,0CACrD,OAAA;AAAA,MACEtB,WAAWG,GACTL,QAAQ0B,WACRd,UACEN,IAAI;AAAA,QACFqB,eAAe;AAAA,QACfC,YAAY;AAAA,QACZC,WAAW;AAAA,MAAA,CACZ,GACH;AAAA,QACE,CAAC7B,QAAQ8B,oBAAoB,GAAGZ;AAAAA,MAAAA,GAElCN,UAAUM,eAAeZ,IAAI;AAAA,QAAEqB,eAAe;AAAA,MAAA,CAAO,CACvD;AAAA,MAAEH,WAEFO,2BAAAA,IAAA,OAAA;AAAA,QAAK7B,WAAWF,QAAQgC;AAAAA,QAAcR,UAAE3B;AAAAA,MAAAA,CAAU,GAClDoC,2BAAAA,KAAA,OAAA;AAAA,QACE/B,WAAWG,GACTL,QAAQkC,eACRlB,QAAQV,IAAI;AAAA,UAAE6B,YAAYC,YAAAA,MAAMC,MAAMC;AAAAA,QAAAA,CAAI,CAC5C;AAAA,QAAEd,WAEDL,WACCX,2CAAa+B,WAAWC,cACxB1C,OACAE,QAAQyC,cACV,GACCtB,WAAW,QAAQpB,SAASC,QAAQ0C,gBAAgB,GACpDvB,WAAW,QAAQvB,QAAQI,QAAQ2C,eAAe,CAAC;AAAA,MAAA,CACjD,CAAC;AAAA,IAAA,CACH;AAAA,EAAA,CACF;AAET;;;"}
+{"version":3,"file":"EmptyState.cjs","sources":["../../../../src/components/EmptyState/EmptyState.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { useTheme } from \"@mui/material/styles\";\nimport useMediaQuery from \"@mui/material/useMediaQuery\";\n\nimport { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvTypography, HvTypographyProps } from \"@core/components/Typography\";\nimport { useTheme as useHvTheme } from \"@core/hooks/useTheme\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./EmptyState.styles\";\n\nexport { staticClasses as emptyStateClasses };\n\nexport type HvEmptyStateClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvEmptyStateProps\n  extends HvBaseProps<HTMLDivElement, \"title\"> {\n  /** Icon to be presented. */\n  icon: React.ReactNode;\n  /** The title to be shown. */\n  title?: string | React.ReactNode;\n  /** The message to be shown. */\n  message?: string | React.ReactNode;\n  /** The action message to be shown. */\n  action?: string | React.ReactNode;\n  /** A Jss Object used to override or extend the styles applied to the empty state component. */\n  classes?: HvEmptyStateClasses;\n}\n\n/**\n * Empty states communicate that there’s no information, data or values to display in a given context.\n */\nexport const HvEmptyState = (props: HvEmptyStateProps) => {\n  const {\n    action,\n    icon,\n    title,\n    message,\n    classes: classesProp,\n    className,\n    ...others\n  } = useDefaultProps(\"HvEmptyState\", props);\n\n  const { classes, cx, css } = useClasses(classesProp);\n\n  const { activeTheme } = useHvTheme();\n\n  const muiTheme = useTheme();\n\n  const onlyXs = useMediaQuery(muiTheme.breakpoints.only(\"xs\"));\n  const upSm = useMediaQuery(muiTheme.breakpoints.up(\"sm\"));\n\n  const messageOnly = !!(message && !(title || action));\n\n  const renderNode = (\n    variant?: HvTypographyProps[\"variant\"],\n    node?: React.ReactNode,\n    style?: string\n  ) =>\n    node && (\n      <HvTypography variant={variant} className={style}>\n        {node}\n      </HvTypography>\n    );\n\n  return (\n    <div className={cx(classes.root, className)} {...others}>\n      <div\n        className={cx(\n          classes.container,\n          onlyXs &&\n            css({\n              flexDirection: \"column\",\n              alignItems: \"center\",\n              textAlign: \"center\",\n            }),\n          {\n            [classes.containerMessageOnly]: messageOnly,\n          },\n          onlyXs && messageOnly && css({ flexDirection: \"row\" })\n        )}\n      >\n        <div className={classes.iconContainer}>{icon}</div>\n        <div\n          className={cx(\n            classes.textContainer,\n            upSm && css({ marginLeft: theme.space.xs })\n          )}\n        >\n          {renderNode(\n            activeTheme?.emptyState.titleVariant,\n            title,\n            classes.titleContainer\n          )}\n          {renderNode(\"body\", message, classes.messageContainer)}\n          {renderNode(\"body\", action, classes.actionContainer)}\n        </div>\n      </div>\n    </div>\n  );\n};\n"],"names":["HvEmptyState","props","action","icon","title","message","classes","classesProp","className","others","useDefaultProps","cx","css","useClasses","activeTheme","useHvTheme","muiTheme","useTheme","onlyXs","useMediaQuery","breakpoints","only","upSm","up","messageOnly","renderNode","variant","node","style","jsx","HvTypography","root","container","flexDirection","alignItems","textAlign","containerMessageOnly","iconContainer","textContainer","marginLeft","theme","space","xs","emptyState","titleVariant","titleContainer","messageContainer","actionContainer"],"mappings":";;;;;;;;;;;;AAoCaA,MAAAA,eAAeA,CAACC,UAA6B;AAClD,QAAA;AAAA,IACJC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,SAASC;AAAAA,IACTC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,gBAAgBT,KAAK;AAEnC,QAAA;AAAA,IAAEK;AAAAA,IAASK;AAAAA,IAAIC;AAAAA,EAAAA,IAAQC,kBAAAA,WAAWN,WAAW;AAE7C,QAAA;AAAA,IAAEO;AAAAA,MAAgBC,SAAW,SAAA;AAEnC,QAAMC,WAAWC,OAAAA;AAEjB,QAAMC,SAASC,uBAAAA,QAAcH,SAASI,YAAYC,KAAK,IAAI,CAAC;AAC5D,QAAMC,OAAOH,uBAAAA,QAAcH,SAASI,YAAYG,GAAG,IAAI,CAAC;AAExD,QAAMC,cAAc,CAAC,EAAEnB,WAAW,EAAED,SAASF;AAEvCuB,QAAAA,aAAaA,CACjBC,SACAC,MACAC,UAEAD,QACEE,2BAAA,IAACC,WAAa,cAAA,EAAA,SAAkB,WAAWF,OACxCD,UACH,KAAA,CAAA;AAGJ,wCACG,OAAI,EAAA,WAAWhB,GAAGL,QAAQyB,MAAMvB,SAAS,GAAG,GAAIC,QAC/C,0CAAC,OACC,EAAA,WAAWE,GACTL,QAAQ0B,WACRd,UACEN,IAAI;AAAA,IACFqB,eAAe;AAAA,IACfC,YAAY;AAAA,IACZC,WAAW;AAAA,EAAA,CACZ,GACH;AAAA,IACE,CAAC7B,QAAQ8B,oBAAoB,GAAGZ;AAAAA,EAAAA,GAElCN,UAAUM,eAAeZ,IAAI;AAAA,IAAEqB,eAAe;AAAA,EAAA,CAAO,CACvD,GAEA,UAAA;AAAA,IAAAJ,2BAAA,IAAC,OAAI,EAAA,WAAWvB,QAAQ+B,eAAgBlC,UAAK,MAAA;AAAA,oCAC5C,OACC,EAAA,WAAWQ,GACTL,QAAQgC,eACRhB,QAAQV,IAAI;AAAA,MAAE2B,YAAYC,YAAAA,MAAMC,MAAMC;AAAAA,IAAAA,CAAI,CAC5C,GAECjB,UAAAA;AAAAA,MAAAA,WACCX,2CAAa6B,WAAWC,cACxBxC,OACAE,QAAQuC,cACV;AAAA,MACCpB,WAAW,QAAQpB,SAASC,QAAQwC,gBAAgB;AAAA,MACpDrB,WAAW,QAAQvB,QAAQI,QAAQyC,eAAe;AAAA,IAAA,GACrD;AAAA,EAAA,EACF,CAAA,EACF,CAAA;AAEJ;;;"}

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

@@ -1,5 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const React = require("react");
 const uniqueId = require("lodash/uniqueId");
 const accept = require("attr-accept");
@@ -8,7 +9,6 @@ const useUniqueId = require("../../../hooks/useUniqueId.cjs");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const utils = require("../utils.cjs");
 const DropZone_styles = require("./DropZone.styles.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const Label = require("../../Forms/Label/Label.cjs");
 const InfoMessage = require("../../Forms/InfoMessage/InfoMessage.cjs");
 const Typography = require("../../Typography/Typography.cjs");
@@ -62,101 +62,61 @@ const HvDropZone = ({
     });
     onFilesAdded == null ? void 0 : onFilesAdded(newFiles);
   };
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
-    children: [!hideLabels && /* @__PURE__ */ jsxRuntime.jsxs("div", {
-      id,
-      className: classes.dropZoneLabelsGroup,
-      children: [/* @__PURE__ */ jsxRuntime.jsx(Label.HvLabel, {
-        id: setId.setId(id, "input-file-label"),
-        htmlFor: setId.setId(id, "input-file"),
-        label: labels == null ? void 0 : labels.dropzone,
-        className: classes.dropZoneLabel
-      }), /* @__PURE__ */ jsxRuntime.jsxs(InfoMessage.HvInfoMessage, {
-        id: setId.setId(id, "description"),
-        children: [Number.isInteger(maxFileSize) && `${labels == null ? void 0 : labels.sizeWarning} ${utils.convertUnits(maxFileSize)}`, (labels == null ? void 0 : labels.acceptedFiles) && labels.acceptedFiles, !(labels == null ? void 0 : labels.acceptedFiles) && acceptedFiles.length > 0 && ` (${acceptedFiles.join(", ")})`]
-      })]
-    }), /* @__PURE__ */ jsxRuntime.jsxs("div", {
-      id: setId.setId(id, "input-file-container"),
-      className: cx(classes.dropZoneContainer, {
-        [classes.dragAction]: dragState,
-        [classes.dropZoneContainerDisabled]: disabled
-      }),
-      children: [/* @__PURE__ */ jsxRuntime.jsx("input", {
-        id: setId.setId(id, "input-file"),
-        className: classes.inputArea,
-        type: "file",
-        multiple,
-        disabled,
-        title: !disabled ? `${labels == null ? void 0 : labels.drag} ${labels == null ? void 0 : labels.selectFiles}` : "",
-        onClick: () => {
-          if (inputRef.current) {
-            inputRef.current.value = "";
-          }
-        },
-        onChange: () => {
-          var _a;
-          if (!disabled && ((_a = inputRef.current) == null ? void 0 : _a.files)) {
-            onChangeHandler(inputRef.current.files);
-          }
-        },
-        onDragEnter: (event) => {
-          if (!disabled) {
-            enterDropArea();
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    !hideLabels && /* @__PURE__ */ jsxRuntime.jsxs("div", { id, className: classes.dropZoneLabelsGroup, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(Label.HvLabel, { id: setId.setId(id, "input-file-label"), htmlFor: setId.setId(id, "input-file"), label: labels == null ? void 0 : labels.dropzone, className: classes.dropZoneLabel }),
+      /* @__PURE__ */ jsxRuntime.jsxs(InfoMessage.HvInfoMessage, { id: setId.setId(id, "description"), children: [
+        Number.isInteger(maxFileSize) && `${labels == null ? void 0 : labels.sizeWarning} ${utils.convertUnits(maxFileSize)}`,
+        (labels == null ? void 0 : labels.acceptedFiles) && labels.acceptedFiles,
+        !(labels == null ? void 0 : labels.acceptedFiles) && acceptedFiles.length > 0 && ` (${acceptedFiles.join(", ")})`
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { id: setId.setId(id, "input-file-container"), className: cx(classes.dropZoneContainer, {
+      [classes.dragAction]: dragState,
+      [classes.dropZoneContainerDisabled]: disabled
+    }), children: [
+      /* @__PURE__ */ jsxRuntime.jsx("input", { id: setId.setId(id, "input-file"), className: classes.inputArea, type: "file", multiple, disabled, title: !disabled ? `${labels == null ? void 0 : labels.drag} ${labels == null ? void 0 : labels.selectFiles}` : "", onClick: () => {
+        if (inputRef.current) {
+          inputRef.current.value = "";
+        }
+      }, onChange: () => {
+        var _a;
+        if (!disabled && ((_a = inputRef.current) == null ? void 0 : _a.files)) {
+          onChangeHandler(inputRef.current.files);
+        }
+      }, onDragEnter: (event) => {
+        if (!disabled) {
+          enterDropArea();
+          event.stopPropagation();
+          event.preventDefault();
+        }
+      }, onDragLeave: leaveDropArea, onDropCapture: leaveDropArea, onDragOver: (event) => {
+        if (!disabled) {
+          enterDropArea();
+          event.stopPropagation();
+          event.preventDefault();
+        }
+      }, onDrop: (event) => {
+        if (!disabled) {
+          const {
+            files
+          } = event.dataTransfer;
+          if (multiple === true || files.length === 1) {
             event.stopPropagation();
             event.preventDefault();
+            onChangeHandler(files);
           }
-        },
-        onDragLeave: leaveDropArea,
-        onDropCapture: leaveDropArea,
-        onDragOver: (event) => {
-          if (!disabled) {
-            enterDropArea();
-            event.stopPropagation();
-            event.preventDefault();
-          }
-        },
-        onDrop: (event) => {
-          if (!disabled) {
-            const {
-              files
-            } = event.dataTransfer;
-            if (multiple === true || files.length === 1) {
-              event.stopPropagation();
-              event.preventDefault();
-              onChangeHandler(files);
-            }
-          }
-        },
-        ref: inputRef,
-        accept: acceptedFiles.join(","),
-        ...inputProps
-      }), /* @__PURE__ */ jsxRuntime.jsx("div", {
-        className: classes == null ? void 0 : classes.dropArea,
-        children: dragState ? /* @__PURE__ */ jsxRuntime.jsx("div", {
-          className: classes.dropZoneAreaLabels,
-          children: /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
-            className: classes.dragText,
-            children: labels == null ? void 0 : labels.dropFiles
-          })
-        }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
-          children: [/* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Doc, {
-            iconSize: "M",
-            className: classes.dropZoneAreaIcon,
-            color: disabled ? "secondary_60" : "secondary"
-          }), /* @__PURE__ */ jsxRuntime.jsx("div", {
-            className: classes.dropZoneAreaLabels,
-            children: /* @__PURE__ */ jsxRuntime.jsxs(Typography.HvTypography, {
-              className: classes.dragText,
-              children: [labels == null ? void 0 : labels.drag, /* @__PURE__ */ jsxRuntime.jsx("span", {
-                className: classes.selectFilesText,
-                children: ` ${labels == null ? void 0 : labels.selectFiles}`
-              })]
-            })
-          })]
-        })
-      })]
-    })]
-  });
+        }
+      }, ref: inputRef, accept: acceptedFiles.join(","), ...inputProps }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes == null ? void 0 : classes.dropArea, children: dragState ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.dropZoneAreaLabels, children: /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { className: classes.dragText, children: labels == null ? void 0 : labels.dropFiles }) }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Doc, { iconSize: "M", className: classes.dropZoneAreaIcon, color: disabled ? "secondary_60" : "secondary" }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.dropZoneAreaLabels, children: /* @__PURE__ */ jsxRuntime.jsxs(Typography.HvTypography, { className: classes.dragText, children: [
+          labels == null ? void 0 : labels.drag,
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: classes.selectFilesText, children: ` ${labels == null ? void 0 : labels.selectFiles}` })
+        ] }) })
+      ] }) })
+    ] })
+  ] });
 };
 exports.dropZoneClasses = DropZone_styles.staticClasses;
 exports.HvDropZone = HvDropZone;

package/dist/cjs/components/FileUploader/DropZone/DropZone.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"DropZone.cjs","sources":["../../../../../src/components/FileUploader/DropZone/DropZone.tsx"],"sourcesContent":["import React, { useRef, useState } from \"react\";\n\nimport uniqueId from \"lodash/uniqueId\";\n\nimport accept from \"attr-accept\";\n\nimport { setId } from \"@core/utils/setId\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\n\nimport { HvTypography } from \"@core/components/Typography\";\nimport { Doc } from \"@hitachivantara/uikit-react-icons\";\nimport { HvInfoMessage, HvLabel } from \"@core/components/Forms\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { convertUnits } from \"../utils\";\nimport { HvFileData, HvFilesAddedEvent } from \"../File\";\n\nimport { staticClasses, useClasses } from \"./DropZone.styles\";\n\nexport { staticClasses as dropZoneClasses };\n\nexport type HvDropZoneClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDropZoneLabels {\n  /**\n   * Extensions of the accepted file types\n   */\n  acceptedFiles?: string;\n  /**\n   * Dropzone area label.\n   */\n  dropzone?: string;\n  /**\n   * Size file warning label.\n   */\n  sizeWarning?: string;\n  /**\n   * Size file warning label.\n   */\n  drag?: string;\n  /**\n   * Size file warning label.\n   */\n  selectFiles?: string;\n  /**\n   * Theming sheet used to style components\n   * */\n  dropFiles?: string;\n  /**\n   * Message to display when file size is greater than allowed\n   * */\n  fileSizeError?: string;\n  /**\n   * Message to display when file type is greater than allowed\n   * */\n  fileTypeError?: string;\n}\n\nexport interface HvDropZoneProps {\n  /**\n   * Id to be applied to the root node.\n   */\n  id?: string;\n  /**\n   * Labels to present in FileUploader.\n   */\n  labels?: HvDropZoneLabels;\n  /**\n   * Whether the Dropzone should accept multiple files at once.\n   */\n  multiple?: boolean;\n  /**\n   * If the input is disabled or not\n   */\n  disabled?: boolean;\n  /**\n   * Files extensions accepted for upload.\n   */\n  acceptedFiles: string[];\n  /**\n   * Max upload size\n   * */\n  maxFileSize: number;\n  /**\n   * Function responsible for processing files added to the drop zone.\n   */\n  onFilesAdded?: HvFilesAddedEvent;\n  /**\n   * Whether the DropZone should hide labels or not.\n   */\n  hideLabels?: boolean;\n  /**\n   * Attributes applied to the input element.\n   */\n  inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n  /**\n   * A Jss Object used to override or extend the styles applied to the component.\n   */\n  classes?: HvDropZoneClasses;\n}\n\nexport const HvDropZone = ({\n  id: idProp,\n  classes: classesProp,\n  labels,\n  acceptedFiles,\n  maxFileSize,\n  inputProps,\n  hideLabels,\n  multiple = true,\n  disabled = false,\n  onFilesAdded,\n}: HvDropZoneProps) => {\n  const id = useUniqueId(idProp, \"dropzone\");\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const [dragState, setDrag] = useState<boolean>(false);\n\n  const inputRef = useRef<HTMLInputElement | null>(null);\n\n  const leaveDropArea = () => {\n    setDrag(false);\n  };\n\n  const enterDropArea = () => {\n    setDrag(true);\n  };\n\n  const onChangeHandler = (filesList: FileList) => {\n    const filesToProcess = Object.keys(filesList).map((e) => filesList[e]);\n\n    const newFiles: HvFileData[] = [];\n\n    filesToProcess.forEach((file: File) => {\n      const newFile: HvFileData = file;\n\n      const isSizeAllowed = file.size <= maxFileSize;\n      const isFileAccepted =\n        !acceptedFiles.length ||\n        acceptedFiles.indexOf(file.type.split(\"/\")[1]) > -1 ||\n        acceptedFiles.some((acceptExtension) =>\n          accept({ name: file.name, type: file.type }, acceptExtension)\n        );\n\n      if (!isFileAccepted) {\n        newFile.errorMessage = labels?.fileTypeError;\n        newFile.status = \"fail\";\n      } else if (!isSizeAllowed) {\n        newFile.errorMessage = labels?.fileSizeError;\n        newFile.status = \"fail\";\n      }\n\n      newFile.id = uniqueId(\"uploaded-file-data-\");\n      newFiles.push(newFile);\n    });\n\n    onFilesAdded?.(newFiles);\n  };\n\n  return (\n    <>\n      {!hideLabels && (\n        <div id={id} className={classes.dropZoneLabelsGroup}>\n          <HvLabel\n            id={setId(id, \"input-file-label\")}\n            htmlFor={setId(id, \"input-file\")}\n            label={labels?.dropzone}\n            className={classes.dropZoneLabel}\n          />\n          <HvInfoMessage id={setId(id, \"description\")}>\n            {Number.isInteger(maxFileSize) &&\n              `${labels?.sizeWarning} ${convertUnits(maxFileSize)}`}\n            {labels?.acceptedFiles && labels.acceptedFiles}\n            {!labels?.acceptedFiles &&\n              acceptedFiles.length > 0 &&\n              `\\u00A0(${acceptedFiles.join(\", \")})`}\n          </HvInfoMessage>\n        </div>\n      )}\n      <div\n        id={setId(id, \"input-file-container\")}\n        className={cx(classes.dropZoneContainer, {\n          [classes.dragAction]: dragState,\n          [classes.dropZoneContainerDisabled]: disabled,\n        })}\n      >\n        <input\n          id={setId(id, \"input-file\")}\n          className={classes.inputArea}\n          type=\"file\"\n          multiple={multiple}\n          disabled={disabled}\n          title={!disabled ? `${labels?.drag}\\xa0${labels?.selectFiles}` : \"\"}\n          onClick={() => {\n            if (inputRef.current) {\n              inputRef.current.value = \"\";\n            }\n          }}\n          onChange={() => {\n            if (!disabled && inputRef.current?.files) {\n              onChangeHandler(inputRef.current.files);\n            }\n          }}\n          onDragEnter={(event) => {\n            if (!disabled) {\n              enterDropArea();\n              event.stopPropagation();\n              event.preventDefault();\n            }\n          }}\n          onDragLeave={leaveDropArea}\n          onDropCapture={leaveDropArea}\n          onDragOver={(event) => {\n            if (!disabled) {\n              enterDropArea();\n              event.stopPropagation();\n              event.preventDefault();\n            }\n          }}\n          onDrop={(event) => {\n            if (!disabled) {\n              const { files } = event.dataTransfer;\n              if (multiple === true || files.length === 1) {\n                event.stopPropagation();\n                event.preventDefault();\n                onChangeHandler(files);\n              }\n            }\n          }}\n          ref={inputRef}\n          accept={acceptedFiles.join(\",\")}\n          {...inputProps}\n        />\n        <div className={classes?.dropArea}>\n          {dragState ? (\n            <div className={classes.dropZoneAreaLabels}>\n              <HvTypography className={classes.dragText}>\n                {labels?.dropFiles}\n              </HvTypography>\n            </div>\n          ) : (\n            <>\n              <Doc\n                iconSize=\"M\"\n                className={classes.dropZoneAreaIcon}\n                color={disabled ? \"secondary_60\" : \"secondary\"}\n              />\n              <div className={classes.dropZoneAreaLabels}>\n                <HvTypography className={classes.dragText}>\n                  {labels?.drag}\n                  <span\n                    className={classes.selectFilesText}\n                  >{`\\xa0${labels?.selectFiles}`}</span>\n                </HvTypography>\n              </div>\n            </>\n          )}\n        </div>\n      </div>\n    </>\n  );\n};\n"],"names":["HvDropZone","id","idProp","classes","classesProp","labels","acceptedFiles","maxFileSize","inputProps","hideLabels","multiple","disabled","onFilesAdded","useUniqueId","cx","useClasses","dragState","setDrag","useState","inputRef","useRef","leaveDropArea","enterDropArea","onChangeHandler","filesList","filesToProcess","Object","keys","map","e","newFiles","forEach","file","newFile","isSizeAllowed","size","isFileAccepted","length","indexOf","type","split","some","acceptExtension","accept","name","errorMessage","fileTypeError","status","fileSizeError","uniqueId","push","_Fragment","children","className","dropZoneLabelsGroup","_jsx","HvLabel","setId","htmlFor","label","dropzone","dropZoneLabel","_jsxs","HvInfoMessage","Number","isInteger","sizeWarning","convertUnits","join","dropZoneContainer","dragAction","dropZoneContainerDisabled","inputArea","title","drag","selectFiles","onClick","current","value","onChange","files","onDragEnter","event","stopPropagation","preventDefault","onDragLeave","onDropCapture","onDragOver","onDrop","dataTransfer","ref","dropArea","dropZoneAreaLabels","HvTypography","dragText","dropFiles","Doc","iconSize","dropZoneAreaIcon","color","selectFilesText"],"mappings":"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"}
+{"version":3,"file":"DropZone.cjs","sources":["../../../../../src/components/FileUploader/DropZone/DropZone.tsx"],"sourcesContent":["import React, { useRef, useState } from \"react\";\n\nimport uniqueId from \"lodash/uniqueId\";\n\nimport accept from \"attr-accept\";\n\nimport { setId } from \"@core/utils/setId\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\n\nimport { HvTypography } from \"@core/components/Typography\";\nimport { Doc } from \"@hitachivantara/uikit-react-icons\";\nimport { HvInfoMessage, HvLabel } from \"@core/components/Forms\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { convertUnits } from \"../utils\";\nimport { HvFileData, HvFilesAddedEvent } from \"../File\";\n\nimport { staticClasses, useClasses } from \"./DropZone.styles\";\n\nexport { staticClasses as dropZoneClasses };\n\nexport type HvDropZoneClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvDropZoneLabels {\n  /**\n   * Extensions of the accepted file types\n   */\n  acceptedFiles?: string;\n  /**\n   * Dropzone area label.\n   */\n  dropzone?: string;\n  /**\n   * Size file warning label.\n   */\n  sizeWarning?: string;\n  /**\n   * Size file warning label.\n   */\n  drag?: string;\n  /**\n   * Size file warning label.\n   */\n  selectFiles?: string;\n  /**\n   * Theming sheet used to style components\n   * */\n  dropFiles?: string;\n  /**\n   * Message to display when file size is greater than allowed\n   * */\n  fileSizeError?: string;\n  /**\n   * Message to display when file type is greater than allowed\n   * */\n  fileTypeError?: string;\n}\n\nexport interface HvDropZoneProps {\n  /**\n   * Id to be applied to the root node.\n   */\n  id?: string;\n  /**\n   * Labels to present in FileUploader.\n   */\n  labels?: HvDropZoneLabels;\n  /**\n   * Whether the Dropzone should accept multiple files at once.\n   */\n  multiple?: boolean;\n  /**\n   * If the input is disabled or not\n   */\n  disabled?: boolean;\n  /**\n   * Files extensions accepted for upload.\n   */\n  acceptedFiles: string[];\n  /**\n   * Max upload size\n   * */\n  maxFileSize: number;\n  /**\n   * Function responsible for processing files added to the drop zone.\n   */\n  onFilesAdded?: HvFilesAddedEvent;\n  /**\n   * Whether the DropZone should hide labels or not.\n   */\n  hideLabels?: boolean;\n  /**\n   * Attributes applied to the input element.\n   */\n  inputProps?: React.InputHTMLAttributes<HTMLInputElement>;\n  /**\n   * A Jss Object used to override or extend the styles applied to the component.\n   */\n  classes?: HvDropZoneClasses;\n}\n\nexport const HvDropZone = ({\n  id: idProp,\n  classes: classesProp,\n  labels,\n  acceptedFiles,\n  maxFileSize,\n  inputProps,\n  hideLabels,\n  multiple = true,\n  disabled = false,\n  onFilesAdded,\n}: HvDropZoneProps) => {\n  const id = useUniqueId(idProp, \"dropzone\");\n\n  const { classes, cx } = useClasses(classesProp);\n\n  const [dragState, setDrag] = useState<boolean>(false);\n\n  const inputRef = useRef<HTMLInputElement | null>(null);\n\n  const leaveDropArea = () => {\n    setDrag(false);\n  };\n\n  const enterDropArea = () => {\n    setDrag(true);\n  };\n\n  const onChangeHandler = (filesList: FileList) => {\n    const filesToProcess = Object.keys(filesList).map((e) => filesList[e]);\n\n    const newFiles: HvFileData[] = [];\n\n    filesToProcess.forEach((file: File) => {\n      const newFile: HvFileData = file;\n\n      const isSizeAllowed = file.size <= maxFileSize;\n      const isFileAccepted =\n        !acceptedFiles.length ||\n        acceptedFiles.indexOf(file.type.split(\"/\")[1]) > -1 ||\n        acceptedFiles.some((acceptExtension) =>\n          accept({ name: file.name, type: file.type }, acceptExtension)\n        );\n\n      if (!isFileAccepted) {\n        newFile.errorMessage = labels?.fileTypeError;\n        newFile.status = \"fail\";\n      } else if (!isSizeAllowed) {\n        newFile.errorMessage = labels?.fileSizeError;\n        newFile.status = \"fail\";\n      }\n\n      newFile.id = uniqueId(\"uploaded-file-data-\");\n      newFiles.push(newFile);\n    });\n\n    onFilesAdded?.(newFiles);\n  };\n\n  return (\n    <>\n      {!hideLabels && (\n        <div id={id} className={classes.dropZoneLabelsGroup}>\n          <HvLabel\n            id={setId(id, \"input-file-label\")}\n            htmlFor={setId(id, \"input-file\")}\n            label={labels?.dropzone}\n            className={classes.dropZoneLabel}\n          />\n          <HvInfoMessage id={setId(id, \"description\")}>\n            {Number.isInteger(maxFileSize) &&\n              `${labels?.sizeWarning} ${convertUnits(maxFileSize)}`}\n            {labels?.acceptedFiles && labels.acceptedFiles}\n            {!labels?.acceptedFiles &&\n              acceptedFiles.length > 0 &&\n              `\\u00A0(${acceptedFiles.join(\", \")})`}\n          </HvInfoMessage>\n        </div>\n      )}\n      <div\n        id={setId(id, \"input-file-container\")}\n        className={cx(classes.dropZoneContainer, {\n          [classes.dragAction]: dragState,\n          [classes.dropZoneContainerDisabled]: disabled,\n        })}\n      >\n        <input\n          id={setId(id, \"input-file\")}\n          className={classes.inputArea}\n          type=\"file\"\n          multiple={multiple}\n          disabled={disabled}\n          title={!disabled ? `${labels?.drag}\\xa0${labels?.selectFiles}` : \"\"}\n          onClick={() => {\n            if (inputRef.current) {\n              inputRef.current.value = \"\";\n            }\n          }}\n          onChange={() => {\n            if (!disabled && inputRef.current?.files) {\n              onChangeHandler(inputRef.current.files);\n            }\n          }}\n          onDragEnter={(event) => {\n            if (!disabled) {\n              enterDropArea();\n              event.stopPropagation();\n              event.preventDefault();\n            }\n          }}\n          onDragLeave={leaveDropArea}\n          onDropCapture={leaveDropArea}\n          onDragOver={(event) => {\n            if (!disabled) {\n              enterDropArea();\n              event.stopPropagation();\n              event.preventDefault();\n            }\n          }}\n          onDrop={(event) => {\n            if (!disabled) {\n              const { files } = event.dataTransfer;\n              if (multiple === true || files.length === 1) {\n                event.stopPropagation();\n                event.preventDefault();\n                onChangeHandler(files);\n              }\n            }\n          }}\n          ref={inputRef}\n          accept={acceptedFiles.join(\",\")}\n          {...inputProps}\n        />\n        <div className={classes?.dropArea}>\n          {dragState ? (\n            <div className={classes.dropZoneAreaLabels}>\n              <HvTypography className={classes.dragText}>\n                {labels?.dropFiles}\n              </HvTypography>\n            </div>\n          ) : (\n            <>\n              <Doc\n                iconSize=\"M\"\n                className={classes.dropZoneAreaIcon}\n                color={disabled ? \"secondary_60\" : \"secondary\"}\n              />\n              <div className={classes.dropZoneAreaLabels}>\n                <HvTypography className={classes.dragText}>\n                  {labels?.drag}\n                  <span\n                    className={classes.selectFilesText}\n                  >{`\\xa0${labels?.selectFiles}`}</span>\n                </HvTypography>\n              </div>\n            </>\n          )}\n        </div>\n      </div>\n    </>\n  );\n};\n"],"names":["HvDropZone","id","idProp","classes","classesProp","labels","acceptedFiles","maxFileSize","inputProps","hideLabels","multiple","disabled","onFilesAdded","useUniqueId","cx","useClasses","dragState","setDrag","useState","inputRef","useRef","leaveDropArea","enterDropArea","onChangeHandler","filesList","filesToProcess","Object","keys","map","e","newFiles","forEach","file","newFile","isSizeAllowed","size","isFileAccepted","length","indexOf","type","split","some","acceptExtension","accept","name","errorMessage","fileTypeError","status","fileSizeError","uniqueId","push","jsxs","Fragment","dropZoneLabelsGroup","jsx","HvLabel","setId","dropzone","dropZoneLabel","HvInfoMessage","Number","isInteger","sizeWarning","convertUnits","join","dropZoneContainer","dragAction","dropZoneContainerDisabled","inputArea","drag","selectFiles","current","value","files","event","stopPropagation","preventDefault","dataTransfer","dropArea","dropZoneAreaLabels","HvTypography","dragText","dropFiles","Doc","dropZoneAreaIcon","selectFilesText"],"mappings":";;;;;;;;;;;;;;;;;AAoGO,MAAMA,aAAaA,CAAC;AAAA,EACzBC,IAAIC;AAAAA,EACJC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC,WAAW;AAAA,EACXC,WAAW;AAAA,EACXC;AACe,MAAM;AACfX,QAAAA,KAAKY,YAAAA,YAAYX,QAAQ,UAAU;AAEnC,QAAA;AAAA,IAAEC;AAAAA,IAASW;AAAAA,EAAAA,IAAOC,gBAAAA,WAAWX,WAAW;AAE9C,QAAM,CAACY,WAAWC,OAAO,IAAIC,eAAkB,KAAK;AAE9CC,QAAAA,WAAWC,aAAgC,IAAI;AAErD,QAAMC,gBAAgBA,MAAM;AAC1BJ,YAAQ,KAAK;AAAA,EAAA;AAGf,QAAMK,gBAAgBA,MAAM;AAC1BL,YAAQ,IAAI;AAAA,EAAA;AAGRM,QAAAA,kBAAkBA,CAACC,cAAwB;AACzCC,UAAAA,iBAAiBC,OAAOC,KAAKH,SAAS,EAAEI,IAAKC,CAAAA,MAAML,UAAUK,CAAC,CAAC;AAErE,UAAMC,WAAyB,CAAA;AAEhBC,mBAAAA,QAAQ,CAACC,SAAe;AACrC,YAAMC,UAAsBD;AAEtBE,YAAAA,gBAAgBF,KAAKG,QAAQ5B;AACnC,YAAM6B,iBACJ,CAAC9B,cAAc+B,UACf/B,cAAcgC,QAAQN,KAAKO,KAAKC,MAAM,GAAG,EAAE,CAAC,CAAC,IAAI,MACjDlC,cAAcmC,KAAMC,qBAClBC,wBAAO;AAAA,QAAEC,MAAMZ,KAAKY;AAAAA,QAAML,MAAMP,KAAKO;AAAAA,MAAAA,GAAQG,eAAe,CAC9D;AAEF,UAAI,CAACN,gBAAgB;AACnBH,gBAAQY,eAAexC,iCAAQyC;AAC/Bb,gBAAQc,SAAS;AAAA,MAAA,WACR,CAACb,eAAe;AACzBD,gBAAQY,eAAexC,iCAAQ2C;AAC/Bf,gBAAQc,SAAS;AAAA,MACnB;AAEQ9C,cAAAA,KAAKgD,0BAAS,qBAAqB;AAC3CnB,eAASoB,KAAKjB,OAAO;AAAA,IAAA,CACtB;AAEDrB,iDAAekB;AAAAA,EAAQ;AAGzB,SAEKqB,2BAAA,KAAAC,qBAAA,EAAA,UAAA;AAAA,IAAA,CAAC3C,cACC0C,2BAAA,KAAA,OAAA,EAAI,IAAQ,WAAWhD,QAAQkD,qBAC9B,UAAA;AAAA,MAAAC,2BAAA,IAACC,iBACC,IAAIC,MAAAA,MAAMvD,IAAI,kBAAkB,GAChC,SAASuD,MAAAA,MAAMvD,IAAI,YAAY,GAC/B,OAAOI,iCAAQoD,UACf,WAAWtD,QAAQuD,eAAc;AAAA,sCAElCC,YAAc,eAAA,EAAA,IAAIH,MAAMvD,MAAAA,IAAI,aAAa,GACvC2D,UAAAA;AAAAA,QAAOC,OAAAA,UAAUtD,WAAW,KAC1B,GAAEF,iCAAQyD,WAAY,IAAGC,MAAAA,aAAaxD,WAAW,CAAE;AAAA,SACrDF,iCAAQC,kBAAiBD,OAAOC;AAAAA,QAChC,EAACD,iCAAQC,kBACRA,cAAc+B,SAAS,KACtB,KAAS/B,cAAc0D,KAAK,IAAI,CAAE;AAAA,MAAA,GACvC;AAAA,IAAA,GACF;AAAA,IAEFb,2BAAAA,KAAC,OACC,EAAA,IAAIK,YAAMvD,IAAI,sBAAsB,GACpC,WAAWa,GAAGX,QAAQ8D,mBAAmB;AAAA,MACvC,CAAC9D,QAAQ+D,UAAU,GAAGlD;AAAAA,MACtB,CAACb,QAAQgE,yBAAyB,GAAGxD;AAAAA,IACtC,CAAA,GAED,UAAA;AAAA,MAAC2C,2BAAAA,IAAA,SAAA,EACC,IAAIE,MAAAA,MAAMvD,IAAI,YAAY,GAC1B,WAAWE,QAAQiE,WACnB,MAAK,QACL,UACA,UACA,OAAO,CAACzD,WAAY,GAAEN,iCAAQgE,IAAK,IAAMhE,iCAAQiE,WAAY,KAAI,IACjE,SAAS,MAAM;AACb,YAAInD,SAASoD,SAAS;AACpBpD,mBAASoD,QAAQC,QAAQ;AAAA,QAC3B;AAAA,MACF,GACA,UAAU,MAAM;;AACd,YAAI,CAAC7D,cAAYQ,cAASoD,YAATpD,mBAAkBsD,QAAO;AACxBtD,0BAAAA,SAASoD,QAAQE,KAAK;AAAA,QACxC;AAAA,MAAA,GAEF,aAAcC,CAAU,UAAA;AACtB,YAAI,CAAC/D,UAAU;AACC;AACd+D,gBAAMC,gBAAgB;AACtBD,gBAAME,eAAe;AAAA,QACvB;AAAA,MAAA,GAEF,aAAavD,eACb,eAAeA,eACf,YAAaqD,CAAU,UAAA;AACrB,YAAI,CAAC/D,UAAU;AACC;AACd+D,gBAAMC,gBAAgB;AACtBD,gBAAME,eAAe;AAAA,QACvB;AAAA,MAAA,GAEF,QAASF,CAAU,UAAA;AACjB,YAAI,CAAC/D,UAAU;AACP,gBAAA;AAAA,YAAE8D;AAAAA,UAAAA,IAAUC,MAAMG;AACxB,cAAInE,aAAa,QAAQ+D,MAAMpC,WAAW,GAAG;AAC3CqC,kBAAMC,gBAAgB;AACtBD,kBAAME,eAAe;AACrBrD,4BAAgBkD,KAAK;AAAA,UACvB;AAAA,QACF;AAAA,MAAA,GAEF,KAAKtD,UACL,QAAQb,cAAc0D,KAAK,GAAG,GAC1BxD,GAAAA,YAAW;AAAA,MAEjB8C,2BAAAA,IAAC,SAAI,WAAWnD,mCAAS2E,UACtB9D,UACC,YAAAsC,2BAAA,IAAC,SAAI,WAAWnD,QAAQ4E,oBACtB,UAACzB,2BAAA,IAAA0B,WAAA,cAAA,EAAa,WAAW7E,QAAQ8E,UAC9B5E,2CAAQ6E,UACX,CAAA,EAAA,CACF,IAGE/B,2BAAA,KAAAC,WAAA,UAAA,EAAA,UAAA;AAAA,QAACE,2BAAAA,IAAA6B,gBAAA,KAAA,EACC,UAAS,KACT,WAAWhF,QAAQiF,kBACnB,OAAOzE,WAAW,iBAAiB,YAAY,CAAA;AAAA,QAEjD2C,2BAAAA,IAAC,SAAI,WAAWnD,QAAQ4E,oBACtB,UAAC5B,2BAAA,KAAA6B,WAAA,cAAA,EAAa,WAAW7E,QAAQ8E,UAC9B5E,UAAAA;AAAAA,UAAQgE,iCAAAA;AAAAA,UACTf,2BAAAA,IAAC,UACC,WAAWnD,QAAQkF,iBAClB,UAAMhF,IAAAA,iCAAQiE,WAAY,GAAE,CAAA;AAAA,QAAA,EAAA,CACjC,EACF,CAAA;AAAA,MAAA,EAAA,CACF,EAEJ,CAAA;AAAA,IAAA,GACF;AAAA,EACF,EAAA,CAAA;AAEJ;;;"}

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

@@ -1,46 +1,33 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const uikitReactIcons = require("@hitachivantara/uikit-react-icons");
 const setId = require("../../../utils/setId.cjs");
 const css = require("@emotion/css");
 const utils = require("../utils.cjs");
 const File_styles = require("./File.styles.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const ProgressBar = require("../../ProgressBar/ProgressBar.cjs");
 const Button = require("../../Button/Button.cjs");
 const Typography = require("../../Typography/Typography.cjs");
 const getStatusIcon = (classes, status) => {
   switch (status) {
     case "success":
-      return /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Success, {
-        className: classes == null ? void 0 : classes.icon,
-        color: "positive"
-      });
+      return /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Success, { className: classes == null ? void 0 : classes.icon, color: "positive" });
     case "fail":
-      return /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Fail, {
-        className: classes == null ? void 0 : classes.icon,
-        color: "negative"
-      });
+      return /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Fail, { className: classes == null ? void 0 : classes.icon, color: "negative" });
     default:
-      return /* @__PURE__ */ jsxRuntime.jsx("div", {
-        className: classes == null ? void 0 : classes.icon
-      });
+      return /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes == null ? void 0 : classes.icon });
   }
 };
 const getProgressText = (data, classes) => {
   const hasFailed = data.status === "fail";
   const inProgress = data.status === "progress";
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
-    children: [data.progress || data.size || data.errorMessage ? ` | ` : null, inProgress && data.progress != null && /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
-      variant: "label",
-      children: `${utils.convertUnits(data.progress)} / `
-    }), !hasFailed && data.size && /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
-      children: `${utils.convertUnits(data.size)}`
-    }), hasFailed && data.errorMessage && /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
-      className: classes == null ? void 0 : classes.fail,
-      children: data.errorMessage
-    })]
-  });
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    data.progress || data.size || data.errorMessage ? ` | ` : null,
+    inProgress && data.progress != null && /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { variant: "label", children: `${utils.convertUnits(data.progress)} / ` }),
+    !hasFailed && data.size && /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { children: `${utils.convertUnits(data.size)}` }),
+    hasFailed && data.errorMessage && /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { className: classes == null ? void 0 : classes.fail, children: data.errorMessage })
+  ] });
 };
 const getProgressBarWith = ({
   size,
@@ -64,36 +51,17 @@ const HvFile = ({
   const progressText = getProgressText(data, classes);
   const statusIcon = getStatusIcon(classes, data.status);
   const currentProgress = getProgressBarWith(data);
-  return /* @__PURE__ */ jsxRuntime.jsxs("li", {
-    className: classes.root,
-    children: [!hasError && inProgress && /* @__PURE__ */ jsxRuntime.jsx(ProgressBar.HvProgressBar, {
-      classes: {
-        root: classes.progressbar,
-        progressBarContainer: css.cx(classes.progressbarContainer, classes.progressbarBack)
-      },
-      value: currentProgress,
-      hideLabel: true
-    }), statusIcon, /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, {
-      className: classes.nameText,
-      variant: "label",
-      children: data.name
-    }), /* @__PURE__ */ jsxRuntime.jsx("span", {
-      className: classes.progressTextContainer,
-      children: progressText
-    }), data.preview && /* @__PURE__ */ jsxRuntime.jsx("div", {
-      className: classes.previewContainer,
-      children: data.preview
-    }), /* @__PURE__ */ jsxRuntime.jsx(Button.HvButton, {
-      id: setId.setId(id, "remove-button"),
-      "aria-label": removeFileButtonLabel,
-      className: classes.removeButton,
-      onClick: () => onFileRemoved == null ? void 0 : onFileRemoved(data),
-      icon: true,
-      children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Close, {
-        iconSize: "XS"
-      })
-    })]
-  });
+  return /* @__PURE__ */ jsxRuntime.jsxs("li", { className: classes.root, children: [
+    !hasError && inProgress && /* @__PURE__ */ jsxRuntime.jsx(ProgressBar.HvProgressBar, { classes: {
+      root: classes.progressbar,
+      progressBarContainer: css.cx(classes.progressbarContainer, classes.progressbarBack)
+    }, value: currentProgress, hideLabel: true }),
+    statusIcon,
+    /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { className: classes.nameText, variant: "label", children: data.name }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: classes.progressTextContainer, children: progressText }),
+    data.preview && /* @__PURE__ */ jsxRuntime.jsx("div", { className: classes.previewContainer, children: data.preview }),
+    /* @__PURE__ */ jsxRuntime.jsx(Button.HvButton, { id: setId.setId(id, "remove-button"), "aria-label": removeFileButtonLabel, className: classes.removeButton, onClick: () => onFileRemoved == null ? void 0 : onFileRemoved(data), icon: true, children: /* @__PURE__ */ jsxRuntime.jsx(uikitReactIcons.Close, { iconSize: "XS" }) })
+  ] });
 };
 exports.fileClasses = File_styles.staticClasses;
 exports.HvFile = HvFile;

package/dist/cjs/components/FileUploader/File/File.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"File.cjs","sources":["../../../../../src/components/FileUploader/File/File.tsx"],"sourcesContent":["import { Close, Fail, Success } from \"@hitachivantara/uikit-react-icons\";\n\nimport { setId } from \"@core/utils/setId\";\nimport { HvButton } from \"@core/components/Button\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvProgressBar } from \"@core/components/ProgressBar\";\nimport { cx } from \"@emotion/css\";\nimport { convertUnits } from \"../utils\";\nimport { staticClasses, useClasses } from \"./File.styles\";\n\nexport { staticClasses as fileClasses };\n\nexport type HvFileClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFileData extends Omit<File, \"name\" | \"size\"> {\n  /**\n   * The file id.\n   */\n  id?: string;\n  /**\n   * The file name.\n   */\n  name?: string;\n  /**\n   * The upload status.\n   */\n  status?: \"progress\" | \"success\" | \"fail\";\n  /**\n   * The file size in bytes.\n   */\n  size?: number;\n  /**\n   * Upload progress in bytes.\n   */\n  progress?: number;\n  /**\n   * Optional node representing a preview of the uploaded file.\n   */\n  preview?: React.ReactNode;\n  /**\n   * Error message when the upload failed.\n   */\n  errorMessage?: string;\n}\n\nexport type HvFilesAddedEvent = (files: HvFileData[]) => void;\n\nexport type HvFileRemovedEvent = (file: HvFileData) => void;\n\nexport type HvFileProps = {\n  /**\n   * Id to be applied to the root node.\n   */\n  id?: string;\n  /**\n   * File information to be displayed.\n   */\n  data: HvFileData;\n  /**\n   * Callback fired when file is removed from list.\n   */\n  onFileRemoved?: HvFileRemovedEvent;\n  /**\n   * Value of aria-label to apply to remove file button in file list.\n   * */\n  removeFileButtonLabel?: string;\n  /**\n   * A Jss Object used to override or extend the styles applied to the component.\n   */\n  classes?: HvFileClasses;\n};\n\nconst getStatusIcon = (\n  classes?: HvFileClasses,\n  status?: HvFileData[\"status\"]\n) => {\n  switch (status) {\n    case \"success\":\n      return <Success className={classes?.icon} color=\"positive\" />;\n    case \"fail\":\n      return <Fail className={classes?.icon} color=\"negative\" />;\n    default:\n      return <div className={classes?.icon} />;\n  }\n};\n\nconst getProgressText = (data: HvFileData, classes?: HvFileClasses) => {\n  const hasFailed = data.status === \"fail\";\n  const inProgress = data.status === \"progress\";\n\n  return (\n    <>\n      {data.progress || data.size || data.errorMessage ? `\\xa0|\\xa0` : null}\n\n      {inProgress && data.progress != null && (\n        <HvTypography variant=\"label\">\n          {`${convertUnits(data.progress)}\\xa0/\\xa0`}\n        </HvTypography>\n      )}\n\n      {!hasFailed && data.size && (\n        <HvTypography>{`${convertUnits(data.size)}`}</HvTypography>\n      )}\n\n      {hasFailed && data.errorMessage && (\n        <HvTypography className={classes?.fail}>\n          {data.errorMessage}\n        </HvTypography>\n      )}\n    </>\n  );\n};\n\nconst getProgressBarWith = ({ size, progress }: HvFileData) => {\n  const width =\n    progress != null && size != null ? Math.round((progress * 100) / size) : 0;\n\n  return width;\n};\n\nexport const HvFile = ({\n  id,\n  classes: classesProp,\n  data,\n  onFileRemoved,\n  removeFileButtonLabel,\n}: HvFileProps) => {\n  const { classes } = useClasses(classesProp);\n\n  const hasError = data.status === \"fail\";\n\n  const inProgress = data.status === \"progress\";\n\n  const progressText = getProgressText(data, classes);\n\n  const statusIcon = getStatusIcon(classes, data.status);\n\n  const currentProgress = getProgressBarWith(data);\n\n  return (\n    <li className={classes.root}>\n      {!hasError && inProgress && (\n        <HvProgressBar\n          classes={{\n            root: classes.progressbar,\n            progressBarContainer: cx(\n              classes.progressbarContainer,\n              classes.progressbarBack\n            ),\n          }}\n          value={currentProgress}\n          hideLabel\n        />\n      )}\n\n      {statusIcon}\n\n      <HvTypography className={classes.nameText} variant=\"label\">\n        {data.name}\n      </HvTypography>\n\n      <span className={classes.progressTextContainer}>{progressText}</span>\n\n      {data.preview && (\n        <div className={classes.previewContainer}>{data.preview}</div>\n      )}\n\n      <HvButton\n        id={setId(id, \"remove-button\")}\n        aria-label={removeFileButtonLabel}\n        className={classes.removeButton}\n        onClick={() => onFileRemoved?.(data)}\n        icon\n      >\n        <Close iconSize=\"XS\" />\n      </HvButton>\n    </li>\n  );\n};\n"],"names":["getStatusIcon","classes","status","Success","className","icon","color","Fail","getProgressText","data","hasFailed","inProgress","_Fragment","children","progress","size","errorMessage","HvTypography","variant","convertUnits","fail","getProgressBarWith","width","Math","round","HvFile","id","classesProp","onFileRemoved","removeFileButtonLabel","useClasses","hasError","progressText","statusIcon","currentProgress","root","HvProgressBar","progressbar","progressBarContainer","cx","progressbarContainer","progressbarBack","value","hideLabel","_jsx","nameText","name","progressTextContainer","preview","previewContainer","HvButton","setId","removeButton","onClick","Close","iconSize"],"mappings":"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"}
+{"version":3,"file":"File.cjs","sources":["../../../../../src/components/FileUploader/File/File.tsx"],"sourcesContent":["import { Close, Fail, Success } from \"@hitachivantara/uikit-react-icons\";\n\nimport { setId } from \"@core/utils/setId\";\nimport { HvButton } from \"@core/components/Button\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvProgressBar } from \"@core/components/ProgressBar\";\nimport { cx } from \"@emotion/css\";\nimport { convertUnits } from \"../utils\";\nimport { staticClasses, useClasses } from \"./File.styles\";\n\nexport { staticClasses as fileClasses };\n\nexport type HvFileClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFileData extends Omit<File, \"name\" | \"size\"> {\n  /**\n   * The file id.\n   */\n  id?: string;\n  /**\n   * The file name.\n   */\n  name?: string;\n  /**\n   * The upload status.\n   */\n  status?: \"progress\" | \"success\" | \"fail\";\n  /**\n   * The file size in bytes.\n   */\n  size?: number;\n  /**\n   * Upload progress in bytes.\n   */\n  progress?: number;\n  /**\n   * Optional node representing a preview of the uploaded file.\n   */\n  preview?: React.ReactNode;\n  /**\n   * Error message when the upload failed.\n   */\n  errorMessage?: string;\n}\n\nexport type HvFilesAddedEvent = (files: HvFileData[]) => void;\n\nexport type HvFileRemovedEvent = (file: HvFileData) => void;\n\nexport type HvFileProps = {\n  /**\n   * Id to be applied to the root node.\n   */\n  id?: string;\n  /**\n   * File information to be displayed.\n   */\n  data: HvFileData;\n  /**\n   * Callback fired when file is removed from list.\n   */\n  onFileRemoved?: HvFileRemovedEvent;\n  /**\n   * Value of aria-label to apply to remove file button in file list.\n   * */\n  removeFileButtonLabel?: string;\n  /**\n   * A Jss Object used to override or extend the styles applied to the component.\n   */\n  classes?: HvFileClasses;\n};\n\nconst getStatusIcon = (\n  classes?: HvFileClasses,\n  status?: HvFileData[\"status\"]\n) => {\n  switch (status) {\n    case \"success\":\n      return <Success className={classes?.icon} color=\"positive\" />;\n    case \"fail\":\n      return <Fail className={classes?.icon} color=\"negative\" />;\n    default:\n      return <div className={classes?.icon} />;\n  }\n};\n\nconst getProgressText = (data: HvFileData, classes?: HvFileClasses) => {\n  const hasFailed = data.status === \"fail\";\n  const inProgress = data.status === \"progress\";\n\n  return (\n    <>\n      {data.progress || data.size || data.errorMessage ? `\\xa0|\\xa0` : null}\n\n      {inProgress && data.progress != null && (\n        <HvTypography variant=\"label\">\n          {`${convertUnits(data.progress)}\\xa0/\\xa0`}\n        </HvTypography>\n      )}\n\n      {!hasFailed && data.size && (\n        <HvTypography>{`${convertUnits(data.size)}`}</HvTypography>\n      )}\n\n      {hasFailed && data.errorMessage && (\n        <HvTypography className={classes?.fail}>\n          {data.errorMessage}\n        </HvTypography>\n      )}\n    </>\n  );\n};\n\nconst getProgressBarWith = ({ size, progress }: HvFileData) => {\n  const width =\n    progress != null && size != null ? Math.round((progress * 100) / size) : 0;\n\n  return width;\n};\n\nexport const HvFile = ({\n  id,\n  classes: classesProp,\n  data,\n  onFileRemoved,\n  removeFileButtonLabel,\n}: HvFileProps) => {\n  const { classes } = useClasses(classesProp);\n\n  const hasError = data.status === \"fail\";\n\n  const inProgress = data.status === \"progress\";\n\n  const progressText = getProgressText(data, classes);\n\n  const statusIcon = getStatusIcon(classes, data.status);\n\n  const currentProgress = getProgressBarWith(data);\n\n  return (\n    <li className={classes.root}>\n      {!hasError && inProgress && (\n        <HvProgressBar\n          classes={{\n            root: classes.progressbar,\n            progressBarContainer: cx(\n              classes.progressbarContainer,\n              classes.progressbarBack\n            ),\n          }}\n          value={currentProgress}\n          hideLabel\n        />\n      )}\n\n      {statusIcon}\n\n      <HvTypography className={classes.nameText} variant=\"label\">\n        {data.name}\n      </HvTypography>\n\n      <span className={classes.progressTextContainer}>{progressText}</span>\n\n      {data.preview && (\n        <div className={classes.previewContainer}>{data.preview}</div>\n      )}\n\n      <HvButton\n        id={setId(id, \"remove-button\")}\n        aria-label={removeFileButtonLabel}\n        className={classes.removeButton}\n        onClick={() => onFileRemoved?.(data)}\n        icon\n      >\n        <Close iconSize=\"XS\" />\n      </HvButton>\n    </li>\n  );\n};\n"],"names":["getStatusIcon","classes","status","Success","icon","Fail","jsx","getProgressText","data","hasFailed","inProgress","progress","size","errorMessage","HvTypography","convertUnits","fail","getProgressBarWith","width","Math","round","HvFile","id","classesProp","onFileRemoved","removeFileButtonLabel","useClasses","hasError","progressText","statusIcon","currentProgress","jsxs","root","HvProgressBar","progressbar","progressBarContainer","cx","progressbarContainer","progressbarBack","nameText","name","progressTextContainer","preview","previewContainer","HvButton","setId","removeButton","Close"],"mappings":"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"}

package/dist/cjs/components/FileUploader/FileList/FileList.cjs

@@ -1,9 +1,9 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const useUniqueId = require("../../../hooks/useUniqueId.cjs");
 const setId = require("../../../utils/setId.cjs");
 const FileList_styles = require("./FileList.styles.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const File = require("../File/File.cjs");
 const HvFileList = ({
   id,
@@ -19,19 +19,9 @@ const HvFileList = ({
   const hasFiles = list.length > 0;
   if (!hasFiles)
     return null;
-  return /* @__PURE__ */ jsxRuntime.jsx("ul", {
-    id: setId.setId(id, "list"),
-    className: classes.list,
-    children: list.map((data) => /* @__PURE__ */ jsxRuntime.jsx(File.HvFile, {
-      classes: {
-        root: classes == null ? void 0 : classes.listItem
-      },
-      id: setId.setId(elementId, "values"),
-      data,
-      onFileRemoved,
-      removeFileButtonLabel
-    }, data.id))
-  });
+  return /* @__PURE__ */ jsxRuntime.jsx("ul", { id: setId.setId(id, "list"), className: classes.list, children: list.map((data) => /* @__PURE__ */ jsxRuntime.jsx(File.HvFile, { classes: {
+    root: classes == null ? void 0 : classes.listItem
+  }, id: setId.setId(elementId, "values"), data, onFileRemoved, removeFileButtonLabel }, data.id)) });
 };
 exports.fileListClasses = FileList_styles.staticClasses;
 exports.HvFileList = HvFileList;

package/dist/cjs/components/FileUploader/FileList/FileList.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"FileList.cjs","sources":["../../../../../src/components/FileUploader/FileList/FileList.tsx"],"sourcesContent":["import { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { setId } from \"@core/utils/setId\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvFile, HvFileData, HvFileRemovedEvent } from \"../File\";\nimport { staticClasses, useClasses } from \"./FileList.styles\";\n\nexport { staticClasses as fileListClasses };\n\nexport type HvFileListClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFileListProps {\n  /**\n   * Id to be applied to the root node.\n   */\n  id?: string;\n  /**\n   * The files to upload.\n   */\n  list?: HvFileData[];\n  /**\n   * Callback fired when file is removed from list.\n   */\n  onFileRemoved?: HvFileRemovedEvent;\n  /**\n   * Value of aria-label to apply to remove file button in FileList\n   * */\n  removeFileButtonLabel?: string;\n  /**\n   * A Jss Object used to override or extend the styles applied to the component.\n   */\n  classes?: HvFileListClasses;\n}\n\nexport const HvFileList = ({\n  id,\n  classes: classesProp,\n  list = [],\n  removeFileButtonLabel,\n  onFileRemoved,\n}: HvFileListProps) => {\n  const { classes } = useClasses(classesProp);\n\n  const elementId = useUniqueId(id, \"hvfilelist\");\n\n  const hasFiles = list.length > 0;\n  if (!hasFiles) return null;\n\n  return (\n    <ul id={setId(id, \"list\")} className={classes.list}>\n      {list.map((data) => (\n        <HvFile\n          key={data.id}\n          classes={{ root: classes?.listItem }}\n          id={setId(elementId, \"values\")}\n          data={data}\n          onFileRemoved={onFileRemoved}\n          removeFileButtonLabel={removeFileButtonLabel}\n        />\n      ))}\n    </ul>\n  );\n};\n"],"names":["HvFileList","id","classes","classesProp","list","removeFileButtonLabel","onFileRemoved","useClasses","elementId","useUniqueId","hasFiles","length","setId","className","children","map","data","HvFile","root","listItem"],"mappings":";;;;;;;AAkCO,MAAMA,aAAaA,CAAC;AAAA,EACzBC;AAAAA,EACAC,SAASC;AAAAA,EACTC,OAAO,CAAE;AAAA,EACTC;AAAAA,EACAC;AACe,MAAM;AACf,QAAA;AAAA,IAAEJ;AAAAA,EAAAA,IAAYK,gBAAAA,WAAWJ,WAAW;AAEpCK,QAAAA,YAAYC,YAAAA,YAAYR,IAAI,YAAY;AAExCS,QAAAA,WAAWN,KAAKO,SAAS;AAC/B,MAAI,CAACD;AAAiB,WAAA;AAEtB,wCACE,MAAA;AAAA,IAAIT,IAAIW,MAAAA,MAAMX,IAAI,MAAM;AAAA,IAAGY,WAAWX,QAAQE;AAAAA,IAAKU,UAChDV,KAAKW,IAAKC,CAAAA,wCACRC,KAAAA,QAAM;AAAA,MAELf,SAAS;AAAA,QAAEgB,MAAMhB,mCAASiB;AAAAA,MAAS;AAAA,MACnClB,IAAIW,MAAAA,MAAMJ,WAAW,QAAQ;AAAA,MAC7BQ;AAAAA,MACAV;AAAAA,MACAD;AAAAA,IAAAA,GALKW,KAAKf,EAMX,CACF;AAAA,EAAA,CACC;AAER;;;"}
+{"version":3,"file":"FileList.cjs","sources":["../../../../../src/components/FileUploader/FileList/FileList.tsx"],"sourcesContent":["import { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { setId } from \"@core/utils/setId\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvFile, HvFileData, HvFileRemovedEvent } from \"../File\";\nimport { staticClasses, useClasses } from \"./FileList.styles\";\n\nexport { staticClasses as fileListClasses };\n\nexport type HvFileListClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFileListProps {\n  /**\n   * Id to be applied to the root node.\n   */\n  id?: string;\n  /**\n   * The files to upload.\n   */\n  list?: HvFileData[];\n  /**\n   * Callback fired when file is removed from list.\n   */\n  onFileRemoved?: HvFileRemovedEvent;\n  /**\n   * Value of aria-label to apply to remove file button in FileList\n   * */\n  removeFileButtonLabel?: string;\n  /**\n   * A Jss Object used to override or extend the styles applied to the component.\n   */\n  classes?: HvFileListClasses;\n}\n\nexport const HvFileList = ({\n  id,\n  classes: classesProp,\n  list = [],\n  removeFileButtonLabel,\n  onFileRemoved,\n}: HvFileListProps) => {\n  const { classes } = useClasses(classesProp);\n\n  const elementId = useUniqueId(id, \"hvfilelist\");\n\n  const hasFiles = list.length > 0;\n  if (!hasFiles) return null;\n\n  return (\n    <ul id={setId(id, \"list\")} className={classes.list}>\n      {list.map((data) => (\n        <HvFile\n          key={data.id}\n          classes={{ root: classes?.listItem }}\n          id={setId(elementId, \"values\")}\n          data={data}\n          onFileRemoved={onFileRemoved}\n          removeFileButtonLabel={removeFileButtonLabel}\n        />\n      ))}\n    </ul>\n  );\n};\n"],"names":["HvFileList","id","classes","classesProp","list","removeFileButtonLabel","onFileRemoved","useClasses","elementId","useUniqueId","hasFiles","length","jsx","setId","map","data","HvFile","root","listItem"],"mappings":";;;;;;;AAkCO,MAAMA,aAAaA,CAAC;AAAA,EACzBC;AAAAA,EACAC,SAASC;AAAAA,EACTC,OAAO,CAAE;AAAA,EACTC;AAAAA,EACAC;AACe,MAAM;AACf,QAAA;AAAA,IAAEJ;AAAAA,EAAAA,IAAYK,gBAAAA,WAAWJ,WAAW;AAEpCK,QAAAA,YAAYC,YAAAA,YAAYR,IAAI,YAAY;AAExCS,QAAAA,WAAWN,KAAKO,SAAS;AAC/B,MAAI,CAACD;AAAiB,WAAA;AAEtB,SACGE,2BAAA,IAAA,MAAA,EAAG,IAAIC,MAAAA,MAAMZ,IAAI,MAAM,GAAG,WAAWC,QAAQE,MAC3CA,UAAKU,KAAAA,IAAKC,CACT,SAAAH,+BAACI,KAAAA,UAEC,SAAS;AAAA,IAAEC,MAAMf,mCAASgB;AAAAA,EAC1B,GAAA,IAAIL,MAAML,MAAAA,WAAW,QAAQ,GAC7B,MACA,eACA,sBALKO,GAAAA,KAAKd,GAOb,EACH,CAAA;AAEJ;;;"}

package/dist/cjs/components/FileUploader/FileUploader.cjs

@@ -1,9 +1,9 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("@emotion/react/jsx-runtime");
 const useLabels = require("../../hooks/useLabels.cjs");
 const setId = require("../../utils/setId.cjs");
 const useDefaultProps = require("../../hooks/useDefaultProps.cjs");
-const jsxRuntime = require("@emotion/react/jsx-runtime");
 const DropZone = require("./DropZone/DropZone.cjs");
 const FileList = require("./FileList/FileList.cjs");
 const DEFAULT_LABELS = {
@@ -33,27 +33,10 @@ const HvFileUploader = (props) => {
     ...others
   } = useDefaultProps.useDefaultProps("HvFileUploader", props);
   const labels = useLabels.useLabels(DEFAULT_LABELS, labelsProp);
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", {
-    id,
-    className,
-    ...others,
-    children: [/* @__PURE__ */ jsxRuntime.jsx(DropZone.HvDropZone, {
-      id: setId.setId(id, "dropzone"),
-      labels,
-      multiple,
-      disabled,
-      acceptedFiles,
-      maxFileSize,
-      onFilesAdded,
-      inputProps,
-      hideLabels
-    }), /* @__PURE__ */ jsxRuntime.jsx(FileList.HvFileList, {
-      id: setId.setId(id, "filelist"),
-      list: fileList,
-      onFileRemoved,
-      removeFileButtonLabel: labels == null ? void 0 : labels.removeFileButtonLabel
-    })]
-  });
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { id, className, ...others, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(DropZone.HvDropZone, { id: setId.setId(id, "dropzone"), labels, multiple, disabled, acceptedFiles, maxFileSize, onFilesAdded, inputProps, hideLabels }),
+    /* @__PURE__ */ jsxRuntime.jsx(FileList.HvFileList, { id: setId.setId(id, "filelist"), list: fileList, onFileRemoved, removeFileButtonLabel: labels == null ? void 0 : labels.removeFileButtonLabel })
+  ] });
 };
 exports.HvFileUploader = HvFileUploader;
 //# sourceMappingURL=FileUploader.cjs.map