boreal-ui 0.0.1

package/dist/next/FileUpload-D65wKrsD.cjs

@@ -0,0 +1,447 @@
+"use strict";
+const require$$2 = require("react/jsx-runtime");
+const React = require("react");
+const classNames = require("./classNames-BcWMx052.cjs");
+const capitalize = require("./capitalize-DoV-nOmN.cjs");
+const borealStyleConfig = require("./boreal-style-config-Rr5d5Qts.cjs");
+const Button = require("./Button-DUh0L7vy.cjs");
+const IconButton = require("./IconButton-mY_E1gsn.cjs");
+const FormGroup = require("./FormGroup-BAtifQGH.cjs");
+const ProgressBar = require("./ProgressBar-Cvf0uNKW.cjs");
+const FileIcon = (props) => /* @__PURE__ */ require$$2.jsxs(
+  "svg",
+  {
+    width: "24px",
+    height: "24px",
+    viewBox: "0 0 24 24",
+    strokeWidth: "1.5",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    color: "currentColor",
+    ...props,
+    children: [
+      /* @__PURE__ */ require$$2.jsx(
+        "path",
+        {
+          d: "M3 20.5V6.5C3 5.67157 3.67157 5 4.5 5H14.2515C14.4106 5 14.5632 5.06321 14.6757 5.17574L17.8243 8.32426C17.9368 8.43679 18 8.5894 18 8.74853V20.5C18 21.3284 17.3284 22 16.5 22H4.5C3.67157 22 3 21.3284 3 20.5Z",
+          stroke: "currentColor",
+          strokeWidth: "1.5",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        }
+      ),
+      /* @__PURE__ */ require$$2.jsx(
+        "path",
+        {
+          d: "M14 5V8.4C14 8.73137 14.2686 9 14.6 9H18",
+          stroke: "currentColor",
+          strokeWidth: "1.5",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        }
+      )
+    ]
+  }
+);
+const TrashIcon = (props) => /* @__PURE__ */ require$$2.jsxs(
+  "svg",
+  {
+    width: "24px",
+    height: "24px",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    color: "currentColor",
+    "stroke-width": "1.5",
+    ...props,
+    children: [
+      /* @__PURE__ */ require$$2.jsx(
+        "path",
+        {
+          d: "M20 9L18.005 20.3463C17.8369 21.3026 17.0062 22 16.0353 22H7.96474C6.99379 22 6.1631 21.3026 5.99496 20.3463L4 9",
+          fill: "currentColor"
+        }
+      ),
+      /* @__PURE__ */ require$$2.jsx(
+        "path",
+        {
+          d: "M20 9L18.005 20.3463C17.8369 21.3026 17.0062 22 16.0353 22H7.96474C6.99379 22 6.1631 21.3026 5.99496 20.3463L4 9H20Z",
+          stroke: "currentColor",
+          strokeWidth: "1.5",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        }
+      ),
+      /* @__PURE__ */ require$$2.jsx(
+        "path",
+        {
+          d: "M21 6H15.375M3 6H8.625M8.625 6V4C8.625 2.89543 9.52043 2 10.625 2H13.375C14.4796 2 15.375 2.89543 15.375 4V6M8.625 6H15.375",
+          stroke: "currentColor",
+          strokeWidth: "1.5",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        }
+      )
+    ]
+  }
+);
+const BaseFileUpload = ({
+  label = "Upload File",
+  description,
+  error: error2,
+  required = false,
+  theme = borealStyleConfig.getDefaultTheme(),
+  controlRounding = borealStyleConfig.getDefaultRounding(),
+  controlShadow = borealStyleConfig.getDefaultShadow(),
+  outline = false,
+  outlineRounding = borealStyleConfig.getDefaultRounding(),
+  outlineShadow = borealStyleConfig.getDefaultShadow(),
+  state = "",
+  multiple = false,
+  maxFileSizeBytes = Infinity,
+  allowedFileTypes = [],
+  onSubmit,
+  uploadProgress: uploadProgress2,
+  "data-testid": testId = "file-upload",
+  FormGroup: FormGroup2,
+  disabled: disabled2 = false,
+  Button: Button2,
+  IconButton: IconButton2,
+  ProgressBar: ProgressBar2,
+  classMap
+}) => {
+  const [fileNames, setFileNames] = React.useState([]);
+  const [files, setFiles] = React.useState([]);
+  const [rejectedFiles2, setRejectedFiles] = React.useState([]);
+  const [internalProgress, setInternalProgress] = React.useState(0);
+  const [uploading, setUploading] = React.useState(false);
+  const [isDragging, setIsDragging] = React.useState(false);
+  const [uploadMessage, setUploadMessage] = React.useState(null);
+  const fileInput = React.useRef(null);
+  const validateFiles = (newFiles) => {
+    const valid = [];
+    const rejected = [];
+    newFiles.forEach((file) => {
+      const isSizeOk = file.size <= maxFileSizeBytes;
+      const isTypeOk = allowedFileTypes.length === 0 || allowedFileTypes.includes(file.type);
+      if (isSizeOk && isTypeOk) {
+        valid.push(file);
+      } else {
+        rejected.push({
+          name: file.name,
+          reason: !isSizeOk ? `Exceeds size limit (${(file.size / 1024 / 1024).toFixed(2)}MB)` : `Invalid type (${file.type || "unknown"})`
+        });
+      }
+    });
+    return { valid, rejected };
+  };
+  const handleFileChange = (e) => {
+    const selected = e.target.files;
+    if (!selected || selected.length === 0) return;
+    const { valid, rejected } = validateFiles(Array.from(selected));
+    const updatedFiles = multiple ? [...files, ...valid] : valid;
+    setFiles(updatedFiles);
+    setFileNames(
+      updatedFiles.map(
+        (file) => file.name.length > 30 ? file.name.slice(0, 27) + "..." : file.name
+      )
+    );
+    setRejectedFiles(rejected);
+  };
+  const removeFile = (index) => {
+    const updatedFiles = files.filter((_, i) => i !== index);
+    setFiles(updatedFiles);
+    setFileNames(
+      updatedFiles.map(
+        (file) => file.name.length > 30 ? file.name.slice(0, 27) + "..." : file.name
+      )
+    );
+  };
+  const getButtonLabel = () => {
+    if (fileNames.length > 0) return multiple ? "Add Files" : "Select New";
+    return "Choose File";
+  };
+  const handleDragOver = (e) => {
+    e.preventDefault();
+    setIsDragging(true);
+  };
+  const handleDragLeave = () => {
+    setIsDragging(false);
+  };
+  const handleDrop = (e) => {
+    e.preventDefault();
+    setIsDragging(false);
+    const droppedFiles = e.dataTransfer.files;
+    if (droppedFiles.length > 0) {
+      handleFileChange({
+        target: { files: droppedFiles }
+      });
+    }
+  };
+  const handleUpload = () => {
+    if (!files || uploading) return;
+    setUploading(true);
+    setInternalProgress(0);
+    setUploadMessage(null);
+    const interval = setInterval(() => {
+      setInternalProgress((prev) => {
+        if (prev >= 100) {
+          clearInterval(interval);
+          setTimeout(() => {
+            setUploading(false);
+            try {
+              onSubmit(files);
+              setUploadMessage("Upload successful.");
+            } catch {
+              setUploadMessage("Upload failed. Please try again.");
+            }
+          }, 500);
+          return 100;
+        }
+        return prev + 10;
+      });
+    }, 100);
+  };
+  const containerClassName = React.useMemo(
+    () => classNames.combineClassNames(
+      classMap.fileUpload,
+      classMap[state],
+      classMap[theme],
+      outlineShadow && classMap[`shadow${capitalize.capitalize(outlineShadow)}`],
+      outlineRounding && classMap[`round${capitalize.capitalize(outlineRounding)}`],
+      error2 && classMap.error,
+      isDragging ? "dragging" : "",
+      disabled2 && classMap.disabled
+    ),
+    [classMap, isDragging, theme, state, disabled2]
+  );
+  return /* @__PURE__ */ require$$2.jsx(
+    FormGroup2,
+    {
+      label,
+      description,
+      error: error2,
+      required,
+      "data-testid": testId,
+      children: /* @__PURE__ */ require$$2.jsxs(
+        "div",
+        {
+          className: containerClassName,
+          onDragOver: handleDragOver,
+          onDragLeave: handleDragLeave,
+          onDrop: handleDrop,
+          "data-testid": testId ? `${testId}-wrapper` : void 0,
+          children: [
+            /* @__PURE__ */ require$$2.jsx(
+              "input",
+              {
+                ref: fileInput,
+                id: `${testId}-input`,
+                type: "file",
+                multiple,
+                onChange: handleFileChange,
+                className: classMap.hiddenInput,
+                "aria-required": required,
+                "aria-label": label,
+                "aria-describedby": `${testId}-description ${testId}-error`,
+                "data-testid": testId ? `${testId}-input` : void 0
+              }
+            ),
+            /* @__PURE__ */ require$$2.jsx("div", { className: classMap.uploadActions, children: /* @__PURE__ */ require$$2.jsx(
+              Button2,
+              {
+                icon: FileIcon,
+                size: "small",
+                theme,
+                state: error2 && classMap.error,
+                className: classMap.fileInput,
+                disabled: uploading || disabled2,
+                outline,
+                rounding: controlRounding,
+                shadow: controlShadow,
+                onClick: () => {
+                  var _a;
+                  return (_a = fileInput.current) == null ? void 0 : _a.click();
+                },
+                "aria-label": fileNames.length > 0 ? fileNames.join(", ") : "Choose File",
+                "data-testid": testId ? `${testId}-file-button` : void 0,
+                children: getButtonLabel()
+              }
+            ) }),
+            rejectedFiles2.length > 0 && /* @__PURE__ */ require$$2.jsxs("div", { className: classMap.rejectedFiles, children: [
+              /* @__PURE__ */ require$$2.jsx("p", { className: classMap.rejectedLabel, children: "Rejected Files:" }),
+              /* @__PURE__ */ require$$2.jsx("ul", { className: classMap.rejectedList, children: rejectedFiles2.map((file, index) => /* @__PURE__ */ require$$2.jsxs("li", { className: classMap.rejectedItem, children: [
+                /* @__PURE__ */ require$$2.jsx("span", { children: file.name }),
+                /* @__PURE__ */ require$$2.jsxs("span", { className: classMap.rejectedReason, children: [
+                  " ",
+                  "– ",
+                  file.reason
+                ] })
+              ] }, index)) })
+            ] }),
+            fileNames.length > 0 && /* @__PURE__ */ require$$2.jsxs(
+              "div",
+              {
+                className: classMap.uploadControls,
+                "data-testid": testId ? `${testId}-controls` : void 0,
+                children: [
+                  /* @__PURE__ */ require$$2.jsx("ul", { className: classMap.fileList, children: fileNames.map((name, index) => /* @__PURE__ */ require$$2.jsxs("li", { className: classMap.fileListItem, children: [
+                    /* @__PURE__ */ require$$2.jsx("span", { children: name }),
+                    /* @__PURE__ */ require$$2.jsx(
+                      IconButton2,
+                      {
+                        icon: TrashIcon,
+                        theme: "error",
+                        size: "xsmall",
+                        outline: true,
+                        "aria-label": `Remove ${name}`,
+                        onClick: () => removeFile(index),
+                        className: classMap.removeButton
+                      }
+                    )
+                  ] }, index)) }),
+                  uploading && /* @__PURE__ */ require$$2.jsx(
+                    ProgressBar2,
+                    {
+                      theme,
+                      className: classMap.uploadProgress,
+                      progress: uploadProgress2 ?? internalProgress,
+                      indeterminate: uploadProgress2 === void 0,
+                      "data-testid": testId ? `${testId}-progress` : void 0
+                    }
+                  ),
+                  !uploading && /* @__PURE__ */ require$$2.jsx(
+                    Button2,
+                    {
+                      theme,
+                      state: error2 && classMap.error || state,
+                      disabled: uploading,
+                      onClick: handleUpload,
+                      loading: uploading,
+                      size: "small",
+                      className: classMap.uploadButton,
+                      "data-testid": testId ? `${testId}-upload-button` : void 0,
+                      children: "Upload"
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ require$$2.jsx(
+              "div",
+              {
+                className: "sr_only",
+                "aria-live": "polite",
+                "aria-atomic": "true",
+                "data-testid": testId ? `${testId}-upload-message` : void 0,
+                children: uploadMessage
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
+};
+const noScroll = "_noScroll_takvz_91";
+const errorMessage = "_errorMessage_takvz_92";
+const loadingContainer = "_loadingContainer_takvz_93";
+const hideScrollbar = "_hideScrollbar_takvz_85";
+const sr_only = "_sr_only_takvz_94";
+const fileUpload = "_fileUpload_takvz_479";
+const disabled = "_disabled_takvz_495";
+const uploadActions = "_uploadActions_takvz_511";
+const uploadControls = "_uploadControls_takvz_517";
+const uploadProgress = "_uploadProgress_takvz_524";
+const uploadButton = "_uploadButton_takvz_528";
+const removeButton = "_removeButton_takvz_531";
+const hiddenInput = "_hiddenInput_takvz_535";
+const fileList = "_fileList_takvz_538";
+const fileListItem = "_fileListItem_takvz_545";
+const rejectedFiles = "_rejectedFiles_takvz_554";
+const rejectedLabel = "_rejectedLabel_takvz_559";
+const rejectedList = "_rejectedList_takvz_563";
+const rejectedItem = "_rejectedItem_takvz_567";
+const roundNone = "_roundNone_takvz_571";
+const roundSmall = "_roundSmall_takvz_575";
+const roundMedium = "_roundMedium_takvz_579";
+const roundLarge = "_roundLarge_takvz_583";
+const roundFull = "_roundFull_takvz_587";
+const shadowNone = "_shadowNone_takvz_591";
+const shadowLight = "_shadowLight_takvz_595";
+const shadowMedium = "_shadowMedium_takvz_599";
+const shadowStrong = "_shadowStrong_takvz_603";
+const shadowIntense = "_shadowIntense_takvz_607";
+const primary = "_primary_takvz_611";
+const secondary = "_secondary_takvz_615";
+const tertiary = "_tertiary_takvz_619";
+const quaternary = "_quaternary_takvz_623";
+const clear = "_clear_takvz_627";
+const success = "_success_takvz_631";
+const error = "_error_takvz_92";
+const warning = "_warning_takvz_647";
+const spin = "_spin_takvz_1";
+const pulse = "_pulse_takvz_1";
+const styles = {
+  noScroll,
+  errorMessage,
+  loadingContainer,
+  hideScrollbar,
+  sr_only,
+  fileUpload,
+  disabled,
+  uploadActions,
+  uploadControls,
+  uploadProgress,
+  uploadButton,
+  removeButton,
+  hiddenInput,
+  fileList,
+  fileListItem,
+  rejectedFiles,
+  rejectedLabel,
+  rejectedList,
+  rejectedItem,
+  roundNone,
+  roundSmall,
+  roundMedium,
+  roundLarge,
+  roundFull,
+  shadowNone,
+  shadowLight,
+  shadowMedium,
+  shadowStrong,
+  shadowIntense,
+  primary,
+  secondary,
+  tertiary,
+  quaternary,
+  clear,
+  success,
+  error,
+  warning,
+  "fade-in": "_fade-in_takvz_1",
+  "slide-up": "_slide-up_takvz_1",
+  "spin-3d": "_spin-3d_takvz_1",
+  spin,
+  pulse,
+  "fade-in-up": "_fade-in-up_takvz_1",
+  "progress-grow": "_progress-grow_takvz_1",
+  "indeterminate-move": "_indeterminate-move_takvz_1",
+  "skeleton-loading": "_skeleton-loading_takvz_1"
+};
+const FileUpload = (props) => {
+  return /* @__PURE__ */ require$$2.jsx(
+    BaseFileUpload,
+    {
+      ...props,
+      FormGroup: FormGroup.FormGroup,
+      Button: Button.Button,
+      IconButton: IconButton.IconButton,
+      ProgressBar: ProgressBar.ProgressBar,
+      classMap: styles
+    }
+  );
+};
+exports.FileUpload = FileUpload;
+//# sourceMappingURL=FileUpload-D65wKrsD.cjs.map

package/dist/next/FileUpload-D65wKrsD.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileUpload-D65wKrsD.cjs","sources":["../../src/Icons/FileIcon.tsx","../../src/Icons/TrashIcon.tsx","../../src/components/FileUpload/FileUploadBase.tsx","../../src/components/FileUpload/next/FileUpload.tsx"],"sourcesContent":["const FileIcon: React.FC<React.SVGProps<SVGSVGElement>> = (props) => (\r\n  <svg\r\n    width=\"24px\"\r\n    height=\"24px\"\r\n    viewBox=\"0 0 24 24\"\r\n    strokeWidth=\"1.5\"\r\n    fill=\"none\"\r\n    xmlns=\"http://www.w3.org/2000/svg\"\r\n    color=\"currentColor\"\r\n    {...props}\r\n  >\r\n    <path\r\n      d=\"M3 20.5V6.5C3 5.67157 3.67157 5 4.5 5H14.2515C14.4106 5 14.5632 5.06321 14.6757 5.17574L17.8243 8.32426C17.9368 8.43679 18 8.5894 18 8.74853V20.5C18 21.3284 17.3284 22 16.5 22H4.5C3.67157 22 3 21.3284 3 20.5Z\"\r\n      stroke=\"currentColor\"\r\n      strokeWidth=\"1.5\"\r\n      strokeLinecap=\"round\"\r\n      strokeLinejoin=\"round\"\r\n    ></path>\r\n    <path\r\n      d=\"M14 5V8.4C14 8.73137 14.2686 9 14.6 9H18\"\r\n      stroke=\"currentColor\"\r\n      strokeWidth=\"1.5\"\r\n      strokeLinecap=\"round\"\r\n      strokeLinejoin=\"round\"\r\n    ></path>\r\n  </svg>\r\n);\r\n\r\nexport default FileIcon;\r\n","const TrashIcon: React.FC<React.SVGProps<SVGSVGElement>> = (props) => (\r\n  <svg\r\n    width=\"24px\"\r\n    height=\"24px\"\r\n    viewBox=\"0 0 24 24\"\r\n    fill=\"none\"\r\n    xmlns=\"http://www.w3.org/2000/svg\"\r\n    color=\"currentColor\"\r\n    stroke-width=\"1.5\"\r\n    {...props}\r\n  >\r\n    <path\r\n      d=\"M20 9L18.005 20.3463C17.8369 21.3026 17.0062 22 16.0353 22H7.96474C6.99379 22 6.1631 21.3026 5.99496 20.3463L4 9\"\r\n      fill=\"currentColor\"\r\n    ></path>\r\n    <path\r\n      d=\"M20 9L18.005 20.3463C17.8369 21.3026 17.0062 22 16.0353 22H7.96474C6.99379 22 6.1631 21.3026 5.99496 20.3463L4 9H20Z\"\r\n      stroke=\"currentColor\"\r\n      strokeWidth=\"1.5\"\r\n      strokeLinecap=\"round\"\r\n      strokeLinejoin=\"round\"\r\n    ></path>\r\n    <path\r\n      d=\"M21 6H15.375M3 6H8.625M8.625 6V4C8.625 2.89543 9.52043 2 10.625 2H13.375C14.4796 2 15.375 2.89543 15.375 4V6M8.625 6H15.375\"\r\n      stroke=\"currentColor\"\r\n      strokeWidth=\"1.5\"\r\n      strokeLinecap=\"round\"\r\n      strokeLinejoin=\"round\"\r\n    ></path>\r\n  </svg>\r\n);\r\n\r\nexport default TrashIcon;\r\n","import React, { useMemo, useRef, useState } from \"react\";\r\nimport { FileUploadProps } from \"./FileUpload.types\";\r\nimport { FileIcon, TrashIcon } from \"../../Icons\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n  getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nexport interface BaseFileUploadProps extends FileUploadProps {\r\n  FormGroup: React.ComponentType<any>;\r\n  Button: React.ComponentType<any>;\r\n  IconButton: React.ComponentType<any>;\r\n  ProgressBar: React.ComponentType<any>;\r\n  classMap: Record<string, string>;\r\n}\r\n\r\nconst BaseFileUpload: React.FC<BaseFileUploadProps> = ({\r\n  label = \"Upload File\",\r\n  description,\r\n  error,\r\n  required = false,\r\n  theme = getDefaultTheme(),\r\n  controlRounding = getDefaultRounding(),\r\n  controlShadow = getDefaultShadow(),\r\n  outline = false,\r\n  outlineRounding = getDefaultRounding(),\r\n  outlineShadow = getDefaultShadow(),\r\n  state = \"\",\r\n  multiple = false,\r\n  maxFileSizeBytes = Infinity,\r\n  allowedFileTypes = [],\r\n  onSubmit,\r\n  uploadProgress,\r\n  \"data-testid\": testId = \"file-upload\",\r\n  FormGroup,\r\n  disabled = false,\r\n  Button,\r\n  IconButton,\r\n  ProgressBar,\r\n  classMap,\r\n}) => {\r\n  const [fileNames, setFileNames] = useState<string[]>([]);\r\n  const [files, setFiles] = useState<File[]>([]);\r\n  const [rejectedFiles, setRejectedFiles] = useState<\r\n    { name: string; reason: string }[]\r\n  >([]);\r\n  const [internalProgress, setInternalProgress] = useState<number>(0);\r\n  const [uploading, setUploading] = useState(false);\r\n  const [isDragging, setIsDragging] = useState(false);\r\n  const [uploadMessage, setUploadMessage] = useState<string | null>(null);\r\n  const fileInput = useRef<HTMLInputElement | null>(null);\r\n\r\n  const validateFiles = (newFiles: File[]) => {\r\n    const valid: File[] = [];\r\n    const rejected: { name: string; reason: string }[] = [];\r\n\r\n    newFiles.forEach((file) => {\r\n      const isSizeOk = file.size <= maxFileSizeBytes;\r\n      const isTypeOk =\r\n        allowedFileTypes.length === 0 || allowedFileTypes.includes(file.type);\r\n\r\n      if (isSizeOk && isTypeOk) {\r\n        valid.push(file);\r\n      } else {\r\n        rejected.push({\r\n          name: file.name,\r\n          reason: !isSizeOk\r\n            ? `Exceeds size limit (${(file.size / 1024 / 1024).toFixed(2)}MB)`\r\n            : `Invalid type (${file.type || \"unknown\"})`,\r\n        });\r\n      }\r\n    });\r\n\r\n    return { valid, rejected };\r\n  };\r\n\r\n  const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {\r\n    const selected = e.target.files;\r\n    if (!selected || selected.length === 0) return;\r\n\r\n    const { valid, rejected } = validateFiles(Array.from(selected));\r\n    const updatedFiles = multiple ? [...files, ...valid] : valid;\r\n\r\n    setFiles(updatedFiles);\r\n    setFileNames(\r\n      updatedFiles.map((file) =>\r\n        file.name.length > 30 ? file.name.slice(0, 27) + \"...\" : file.name\r\n      )\r\n    );\r\n    setRejectedFiles(rejected);\r\n  };\r\n\r\n  const removeFile = (index: number) => {\r\n    const updatedFiles = files.filter((_, i) => i !== index);\r\n    setFiles(updatedFiles);\r\n    setFileNames(\r\n      updatedFiles.map((file) =>\r\n        file.name.length > 30 ? file.name.slice(0, 27) + \"...\" : file.name\r\n      )\r\n    );\r\n  };\r\n\r\n  const getButtonLabel = () => {\r\n    if (fileNames.length > 0) return multiple ? \"Add Files\" : \"Select New\";\r\n    return \"Choose File\";\r\n  };\r\n\r\n  const handleDragOver = (e: React.DragEvent) => {\r\n    e.preventDefault();\r\n    setIsDragging(true);\r\n  };\r\n\r\n  const handleDragLeave = () => {\r\n    setIsDragging(false);\r\n  };\r\n\r\n  const handleDrop = (e: React.DragEvent) => {\r\n    e.preventDefault();\r\n    setIsDragging(false);\r\n    const droppedFiles = e.dataTransfer.files;\r\n    if (droppedFiles.length > 0) {\r\n      handleFileChange({\r\n        target: { files: droppedFiles },\r\n      } as React.ChangeEvent<HTMLInputElement>);\r\n    }\r\n  };\r\n\r\n  const handleUpload = () => {\r\n    if (!files || uploading) return;\r\n    setUploading(true);\r\n    setInternalProgress(0);\r\n    setUploadMessage(null);\r\n\r\n    const interval = setInterval(() => {\r\n      setInternalProgress((prev) => {\r\n        if (prev >= 100) {\r\n          clearInterval(interval);\r\n          setTimeout(() => {\r\n            setUploading(false);\r\n            try {\r\n              onSubmit(files);\r\n              setUploadMessage(\"Upload successful.\");\r\n            } catch {\r\n              setUploadMessage(\"Upload failed. Please try again.\");\r\n            }\r\n          }, 500);\r\n          return 100;\r\n        }\r\n        return prev + 10;\r\n      });\r\n    }, 100);\r\n  };\r\n\r\n  const containerClassName = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.fileUpload,\r\n        classMap[state],\r\n        classMap[theme],\r\n        outlineShadow && classMap[`shadow${capitalize(outlineShadow)}`],\r\n        outlineRounding && classMap[`round${capitalize(outlineRounding)}`],\r\n        error && classMap.error,\r\n        isDragging ? \"dragging\" : \"\",\r\n        disabled && classMap.disabled\r\n      ),\r\n    [classMap, isDragging, theme, state, disabled]\r\n  );\r\n\r\n  return (\r\n    <FormGroup\r\n      label={label}\r\n      description={description}\r\n      error={error}\r\n      required={required}\r\n      data-testid={testId}\r\n    >\r\n      <div\r\n        className={containerClassName}\r\n        onDragOver={handleDragOver}\r\n        onDragLeave={handleDragLeave}\r\n        onDrop={handleDrop}\r\n        data-testid={testId ? `${testId}-wrapper` : undefined}\r\n      >\r\n        <input\r\n          ref={fileInput}\r\n          id={`${testId}-input`}\r\n          type=\"file\"\r\n          multiple={multiple}\r\n          onChange={handleFileChange}\r\n          className={classMap.hiddenInput}\r\n          aria-required={required}\r\n          aria-label={label}\r\n          aria-describedby={`${testId}-description ${testId}-error`}\r\n          data-testid={testId ? `${testId}-input` : undefined}\r\n        />\r\n\r\n        <div className={classMap.uploadActions}>\r\n          <Button\r\n            icon={FileIcon}\r\n            size=\"small\"\r\n            theme={theme}\r\n            state={error && classMap.error}\r\n            className={classMap.fileInput}\r\n            disabled={uploading || disabled}\r\n            outline={outline}\r\n            rounding={controlRounding}\r\n            shadow={controlShadow}\r\n            onClick={() => fileInput.current?.click()}\r\n            aria-label={\r\n              fileNames.length > 0 ? fileNames.join(\", \") : \"Choose File\"\r\n            }\r\n            data-testid={testId ? `${testId}-file-button` : undefined}\r\n          >\r\n            {getButtonLabel()}\r\n          </Button>\r\n        </div>\r\n\r\n        {rejectedFiles.length > 0 && (\r\n          <div className={classMap.rejectedFiles}>\r\n            <p className={classMap.rejectedLabel}>Rejected Files:</p>\r\n            <ul className={classMap.rejectedList}>\r\n              {rejectedFiles.map((file, index) => (\r\n                <li key={index} className={classMap.rejectedItem}>\r\n                  <span>{file.name}</span>\r\n                  <span className={classMap.rejectedReason}>\r\n                    {\" \"}\r\n                    – {file.reason}\r\n                  </span>\r\n                </li>\r\n              ))}\r\n            </ul>\r\n          </div>\r\n        )}\r\n\r\n        {fileNames.length > 0 && (\r\n          <div\r\n            className={classMap.uploadControls}\r\n            data-testid={testId ? `${testId}-controls` : undefined}\r\n          >\r\n            <ul className={classMap.fileList}>\r\n              {fileNames.map((name, index) => (\r\n                <li key={index} className={classMap.fileListItem}>\r\n                  <span>{name}</span>\r\n                  <IconButton\r\n                    icon={TrashIcon}\r\n                    theme=\"error\"\r\n                    size=\"xsmall\"\r\n                    outline\r\n                    aria-label={`Remove ${name}`}\r\n                    onClick={() => removeFile(index)}\r\n                    className={classMap.removeButton}\r\n                  />\r\n                </li>\r\n              ))}\r\n            </ul>\r\n            {uploading && (\r\n              <ProgressBar\r\n                theme={theme}\r\n                className={classMap.uploadProgress}\r\n                progress={uploadProgress ?? internalProgress}\r\n                indeterminate={uploadProgress === undefined}\r\n                data-testid={testId ? `${testId}-progress` : undefined}\r\n              />\r\n            )}\r\n            {!uploading && (\r\n              <Button\r\n                theme={theme}\r\n                state={(error && classMap.error) || state}\r\n                disabled={uploading}\r\n                onClick={handleUpload}\r\n                loading={uploading}\r\n                size=\"small\"\r\n                className={classMap.uploadButton}\r\n                data-testid={testId ? `${testId}-upload-button` : undefined}\r\n              >\r\n                Upload\r\n              </Button>\r\n            )}\r\n          </div>\r\n        )}\r\n        <div\r\n          className=\"sr_only\"\r\n          aria-live=\"polite\"\r\n          aria-atomic=\"true\"\r\n          data-testid={testId ? `${testId}-upload-message` : undefined}\r\n        >\r\n          {uploadMessage}\r\n        </div>\r\n      </div>\r\n    </FormGroup>\r\n  );\r\n};\r\n\r\nexport default BaseFileUpload;\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport BaseFileUpload from \"../FileUploadBase\";\r\nimport { FileUploadProps } from \"../FileUpload.types\";\r\nimport { Button, IconButton, Progressbar, FormGroup } from \"@/index.next\";\r\nimport styles from \"./FileUpload.module.scss\";\r\n\r\nconst FileUpload: React.FC<FileUploadProps> = (props) => {\r\n  return (\r\n    <BaseFileUpload\r\n      {...props}\r\n      FormGroup={FormGroup}\r\n      Button={Button}\r\n      IconButton={IconButton}\r\n      ProgressBar={Progressbar}\r\n      classMap={styles}\r\n    />\r\n  );\r\n};\r\n\r\nexport default FileUpload;\r\n"],"names":["jsxs","jsx","error","getDefaultTheme","getDefaultRounding","getDefaultShadow","uploadProgress","FormGroup","disabled","Button","IconButton","ProgressBar","useState","rejectedFiles","useRef","useMemo","combineClassNames","capitalize","Progressbar"],"mappings":"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"}

package/dist/next/FileUpload.cjs.js

@@ -0,0 +1,4 @@
+"use strict";
+const FileUpload = require("./FileUpload-D65wKrsD.cjs");
+module.exports = FileUpload.FileUpload;
+//# sourceMappingURL=FileUpload.cjs.js.map

package/dist/next/FileUpload.cjs.js.map

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

package/dist/next/FileUpload.js

@@ -0,0 +1,5 @@
+import { F } from "./FileUpload-BOSrZhPq.js";
+export {
+  F as default
+};
+//# sourceMappingURL=FileUpload.js.map

package/dist/next/FileUpload.js.map

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