boreal-ui 0.0.72 → 0.0.73

package/dist/next/{EmptyState-C-tk-GFs.js → EmptyState-oXCSBosz.js}

@@ -4,7 +4,7 @@ import { c as combineClassNames } from "./classNames-AS8QjFq7.js";
 import { c as capitalize } from "./capitalize-C0TSQSPh.js";
 import { a as getDefaultRounding, b as getDefaultShadow, c as getDefaultSize, d as getDefaultTheme } from "./boreal-style-config-DsaRlxmw.js";
 /* empty css                 */
-import { B as Button } from "./Button-BNV2cbTA.js";
+import { B as Button } from "./Button-BfgUzkgN.js";
 const BaseEmptyState = ({
   icon: Icon,
   title: title2 = "Nothing Here Yet",
@@ -18,13 +18,25 @@ const BaseEmptyState = ({
   actionLabel,
   onActionClick,
   className = "",
+  id,
+  role,
+  iconDecorative = true,
+  iconAriaLabel,
+  actionAriaLabel,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy,
   "data-testid": testId = "empty-state",
   Button: Button2,
-  classMap
+  classMap,
+  ...rest
 }) => {
   const uid = useId();
-  const titleId = `${testId}-title-${uid}`;
-  const descId = message2 ? `${testId}-message-${uid}` : void 0;
+  const titleId = title2 && !ariaLabelledBy ? `${testId}-title-${uid}` : void 0;
+  const messageId = message2 && !ariaDescribedBy ? `${testId}-message-${uid}` : void 0;
+  const resolvedRole = role ?? (title2 ? "region" : void 0);
+  const resolvedAriaLabelledBy = ariaLabelledBy ?? (!ariaLabel && titleId ? titleId : void 0);
+  const resolvedAriaDescribedBy = ariaDescribedBy ?? messageId;
   const sectionClassNames = useMemo(
     () => combineClassNames(
       classMap.empty_state,
@@ -38,18 +50,36 @@ const BaseEmptyState = ({
     ),
     [classMap, rounding, shadow, size, state, theme, outline2, className]
   );
-  const buttonAriaLabel = typeof actionLabel === "string" ? void 0 : "Perform action";
-  return title2 ? /* @__PURE__ */ jsxs(
+  const resolvedActionAriaLabel = actionAriaLabel ?? (typeof actionLabel === "string" ? void 0 : "Perform action");
+  return /* @__PURE__ */ jsxs(
     "section",
     {
+      id,
       className: sectionClassNames,
-      role: "region",
-      "aria-labelledby": titleId,
-      "aria-describedby": descId,
+      role: resolvedRole,
+      "aria-label": ariaLabel,
+      "aria-labelledby": resolvedAriaLabelledBy,
+      "aria-describedby": resolvedAriaDescribedBy,
       "data-testid": testId,
+      ...rest,
       children: [
-        Icon && /* @__PURE__ */ jsx("div", { className: classMap.icon, "data-testid": `${testId}-icon`, children: /* @__PURE__ */ jsx(Icon, { "aria-hidden": "true", focusable: false }) }),
-        /* @__PURE__ */ jsx(
+        Icon && /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: classMap.icon,
+            "data-testid": `${testId}-icon`,
+            "aria-hidden": iconDecorative ? true : void 0,
+            children: /* @__PURE__ */ jsx(
+              Icon,
+              {
+                "aria-hidden": iconDecorative ? true : void 0,
+                "aria-label": !iconDecorative ? iconAriaLabel : void 0,
+                focusable: false
+              }
+            )
+          }
+        ),
+        title2 && /* @__PURE__ */ jsx(
           "h2",
           {
             id: titleId,
@@ -61,37 +91,7 @@ const BaseEmptyState = ({
         message2 && /* @__PURE__ */ jsx(
           "p",
           {
-            id: descId,
-            className: classMap.message,
-            "data-testid": `${testId}-message`,
-            children: message2
-          }
-        ),
-        actionLabel && onActionClick && /* @__PURE__ */ jsx(
-          Button2,
-          {
-            theme: "clear",
-            outline: outline2,
-            onClick: onActionClick,
-            "aria-label": buttonAriaLabel,
-            "data-testid": `${testId}-action`,
-            children: actionLabel
-          }
-        )
-      ]
-    }
-  ) : /* @__PURE__ */ jsxs(
-    "section",
-    {
-      className: sectionClassNames,
-      "aria-describedby": descId,
-      "data-testid": testId,
-      children: [
-        Icon && /* @__PURE__ */ jsx("div", { className: classMap.icon, "data-testid": `${testId}-icon`, children: /* @__PURE__ */ jsx(Icon, { "aria-hidden": "true", focusable: false }) }),
-        message2 && /* @__PURE__ */ jsx(
-          "p",
-          {
-            id: descId,
+            id: messageId,
             className: classMap.message,
             "data-testid": `${testId}-message`,
             children: message2
@@ -103,7 +103,7 @@ const BaseEmptyState = ({
             theme: "clear",
             outline: outline2,
             onClick: onActionClick,
-            "aria-label": buttonAriaLabel,
+            "aria-label": resolvedActionAriaLabel,
             "data-testid": `${testId}-action`,
             children: actionLabel
           }
@@ -180,4 +180,4 @@ EmptyState.displayName = "EmptyState";
 export {
   EmptyState as E
 };
-//# sourceMappingURL=EmptyState-C-tk-GFs.js.map
+//# sourceMappingURL=EmptyState-oXCSBosz.js.map

package/dist/next/EmptyState-oXCSBosz.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EmptyState-oXCSBosz.js","sources":["../../src/components/EmptyState/EmptyStateBase.tsx","../../src/components/EmptyState/next/EmptyState.tsx"],"sourcesContent":["import React, { useMemo, useId } from \"react\";\r\nimport type { BaseEmptyStateProps } from \"./EmptyState.types\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n  getDefaultSize,\r\n  getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nconst BaseEmptyState: React.FC<BaseEmptyStateProps> = ({\r\n  icon: Icon,\r\n  title = \"Nothing Here Yet\",\r\n  message = \"There’s no content to display.\",\r\n  theme = getDefaultTheme(),\r\n  state = \"\",\r\n  size = getDefaultSize(),\r\n  rounding = getDefaultRounding(),\r\n  shadow = getDefaultShadow(),\r\n  outline = false,\r\n  actionLabel,\r\n  onActionClick,\r\n  className = \"\",\r\n  id,\r\n  role,\r\n  iconDecorative = true,\r\n  iconAriaLabel,\r\n  actionAriaLabel,\r\n  \"aria-label\": ariaLabel,\r\n  \"aria-labelledby\": ariaLabelledBy,\r\n  \"aria-describedby\": ariaDescribedBy,\r\n  \"data-testid\": testId = \"empty-state\",\r\n  Button,\r\n  classMap,\r\n  ...rest\r\n}) => {\r\n  const uid = useId();\r\n\r\n  const titleId =\r\n    title && !ariaLabelledBy ? `${testId}-title-${uid}` : undefined;\r\n  const messageId =\r\n    message && !ariaDescribedBy ? `${testId}-message-${uid}` : undefined;\r\n\r\n  const resolvedRole = role ?? (title ? \"region\" : undefined);\r\n\r\n  const resolvedAriaLabelledBy =\r\n    ariaLabelledBy ?? (!ariaLabel && titleId ? titleId : undefined);\r\n\r\n  const resolvedAriaDescribedBy = ariaDescribedBy ?? messageId;\r\n\r\n  const sectionClassNames = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.empty_state,\r\n        classMap[theme],\r\n        classMap[state],\r\n        classMap[size],\r\n        shadow && classMap[`shadow${capitalize(shadow)}`],\r\n        rounding && classMap[`round${capitalize(rounding)}`],\r\n        outline && classMap.outline,\r\n        className,\r\n      ),\r\n    [classMap, rounding, shadow, size, state, theme, outline, className],\r\n  );\r\n\r\n  const resolvedActionAriaLabel =\r\n    actionAriaLabel ??\r\n    (typeof actionLabel === \"string\" ? undefined : \"Perform action\");\r\n\r\n  return (\r\n    <section\r\n      id={id}\r\n      className={sectionClassNames}\r\n      role={resolvedRole}\r\n      aria-label={ariaLabel}\r\n      aria-labelledby={resolvedAriaLabelledBy}\r\n      aria-describedby={resolvedAriaDescribedBy}\r\n      data-testid={testId}\r\n      {...rest}\r\n    >\r\n      {Icon && (\r\n        <div\r\n          className={classMap.icon}\r\n          data-testid={`${testId}-icon`}\r\n          aria-hidden={iconDecorative ? true : undefined}\r\n        >\r\n          <Icon\r\n            aria-hidden={iconDecorative ? true : undefined}\r\n            aria-label={!iconDecorative ? iconAriaLabel : undefined}\r\n            focusable={false}\r\n          />\r\n        </div>\r\n      )}\r\n\r\n      {title && (\r\n        <h2\r\n          id={titleId}\r\n          className={classMap.title}\r\n          data-testid={`${testId}-title`}\r\n        >\r\n          {title}\r\n        </h2>\r\n      )}\r\n\r\n      {message && (\r\n        <p\r\n          id={messageId}\r\n          className={classMap.message}\r\n          data-testid={`${testId}-message`}\r\n        >\r\n          {message}\r\n        </p>\r\n      )}\r\n\r\n      {actionLabel && onActionClick && (\r\n        <Button\r\n          theme=\"clear\"\r\n          outline={outline}\r\n          onClick={onActionClick}\r\n          aria-label={resolvedActionAriaLabel}\r\n          data-testid={`${testId}-action`}\r\n        >\r\n          {actionLabel}\r\n        </Button>\r\n      )}\r\n    </section>\r\n  );\r\n};\r\n\r\nBaseEmptyState.displayName = \"BaseEmptyState\";\r\nexport default BaseEmptyState;\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport BaseEmptyState from \"../EmptyStateBase\";\r\nimport { EmptyStateProps } from \"../EmptyState.types\";\r\nimport { Button } from \"../../../index.next\";\r\nimport styles from \"./EmptyState.module.scss\";\r\n\r\nconst EmptyState: React.FC<EmptyStateProps> = (props) => {\r\n  return <BaseEmptyState {...props} Button={Button} classMap={styles} />;\r\n};\r\nEmptyState.displayName = \"EmptyState\";\r\nexport default EmptyState;\r\n"],"names":["title","message","outline","Button"],"mappings":"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"}

package/dist/next/EmptyState.cjs.js

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

package/dist/next/EmptyState.js

@@ -1,4 +1,4 @@
-import { E } from "./EmptyState-C-tk-GFs.js";
+import { E } from "./EmptyState-oXCSBosz.js";
 export {
   E as default
 };

package/dist/next/{FileUpload-uJZYGisD.cjs → FileUpload-C1DVXFK7.cjs}

@@ -5,10 +5,10 @@ const classNames = require("./classNames-BcWMx052.cjs");
 const capitalize = require("./capitalize-DoV-nOmN.cjs");
 const borealStyleConfig = require("./boreal-style-config-C1UIwOFN.cjs");
 ;/* empty css                   */
-const Button = require("./Button-aiECSNNc.cjs");
-const IconButton = require("./IconButton-BNXb1M9u.cjs");
-const FormGroup = require("./FormGroup-DqApTe27.cjs");
-const ProgressBar = require("./ProgressBar-4SyKFeny.cjs");
+const Button = require("./Button-DMCOgi4K.cjs");
+const IconButton = require("./IconButton-C4OC99ig.cjs");
+const FormGroup = require("./FormGroup-B4Xb3X61.cjs");
+const ProgressBar = require("./ProgressBar-sg1jxDfy.cjs");
 const FileIcon = (props) => /* @__PURE__ */ require$$2.jsxs(
   "svg",
   {
@@ -102,15 +102,50 @@ const BaseFileUpload = ({
   maxFileSizeBytes = Infinity,
   allowedFileTypes = [],
   onSubmit,
+  onFilesChange,
   uploadProgress: uploadProgress2,
   "data-testid": testId = "file-upload",
+  id,
   FormGroup: FormGroup2,
   disabled: disabled2 = false,
   Button: Button2,
   IconButton: IconButton2,
   ProgressBar: ProgressBar2,
-  classMap
+  classMap,
+  // a11y props
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy,
+  "aria-errormessage": ariaErrorMessage,
+  "aria-invalid": ariaInvalid,
+  "aria-required": ariaRequired,
+  "aria-busy": ariaBusy,
+  "aria-live": ariaLive,
+  inputAriaLabel,
+  selectButtonAriaLabel,
+  uploadButtonAriaLabel,
+  removeFileAriaLabel,
+  fileListAriaLabel,
+  rejectedFilesAriaLabel,
+  successMessage = "Upload successful.",
+  failureMessage = "Upload failed. Please try again.",
+  filesSelectedMessage,
+  fileRemovedMessage,
+  rejectedFilesMessage,
+  liveRegionPoliteness = "polite",
+  dropzoneDescription,
+  dropzoneRole = "group",
+  enableDragAndDrop = true,
+  inputProps,
+  selectButtonProps,
+  uploadButtonProps,
+  removeButtonProps,
+  progressBarProps,
+  className,
+  ...rest
 }) => {
+  const reactId = React.useId();
+  const baseId = id || testId || `file-upload-${reactId.replace(/:/g, "")}`;
   const [fileNames, setFileNames] = React.useState([]);
   const [files, setFiles] = React.useState([]);
   const [rejectedFiles2, setRejectedFiles] = React.useState([]);
@@ -120,6 +155,13 @@ const BaseFileUpload = ({
   const [uploadMessage, setUploadMessage] = React.useState(null);
   const fileInput = React.useRef(null);
   const intervalRef = React.useRef(null);
+  const descriptionId = `${baseId}-description`;
+  const errorId = `${baseId}-error`;
+  const dropzoneDescriptionId = `${baseId}-dropzone-description`;
+  const liveRegionId = `${baseId}-live-region`;
+  const fileListId = `${baseId}-file-list`;
+  const rejectedListId = `${baseId}-rejected-list`;
+  const inputId = `${baseId}-input`;
   const accept = React.useMemo(() => {
     if (!allowedFileTypes || allowedFileTypes.length === 0) return void 0;
     return allowedFileTypes.join(",");
@@ -143,6 +185,19 @@ const BaseFileUpload = ({
     return { valid, rejected };
   };
   const truncate = (s) => s.length > 30 ? s.slice(0, 27) + "..." : s;
+  const announce = (message) => {
+    setUploadMessage(message);
+  };
+  const buildSelectedMessage = (selectedFiles) => {
+    if (filesSelectedMessage) return filesSelectedMessage(selectedFiles);
+    const count = selectedFiles.length;
+    return count === 1 ? `${selectedFiles[0].name} selected.` : `${count} files selected.`;
+  };
+  const buildRejectedMessage = (nextRejectedFiles) => {
+    if (nextRejectedFiles.length === 0) return null;
+    if (rejectedFilesMessage) return rejectedFilesMessage(nextRejectedFiles);
+    return nextRejectedFiles.length === 1 ? `${nextRejectedFiles[0].name} was rejected: ${nextRejectedFiles[0].reason}.` : `${nextRejectedFiles.length} files were rejected.`;
+  };
   const handleFileChange = (e) => {
     const selected = e.target.files;
     if (!selected || selected.length === 0) return;
@@ -151,25 +206,41 @@ const BaseFileUpload = ({
     setFiles(updatedFiles);
     setFileNames(updatedFiles.map((f) => truncate(f.name)));
     setRejectedFiles(rejected);
+    onFilesChange == null ? void 0 : onFilesChange(updatedFiles);
+    const selectedMessage = valid.length > 0 ? buildSelectedMessage(updatedFiles) : null;
+    const rejectedMessage = buildRejectedMessage(rejected);
+    announce(
+      [selectedMessage, rejectedMessage].filter(Boolean).join(" ") || null
+    );
     if (fileInput.current) fileInput.current.value = "";
   };
   const removeFile = (index) => {
+    const removedFile = files[index];
     const updatedFiles = files.filter((_, i) => i !== index);
     setFiles(updatedFiles);
     setFileNames(updatedFiles.map((f) => truncate(f.name)));
+    onFilesChange == null ? void 0 : onFilesChange(updatedFiles);
+    if (removedFile) {
+      announce(
+        fileRemovedMessage ? fileRemovedMessage(removedFile.name, index) : `${removedFile.name} removed.`
+      );
+    }
   };
   const getButtonLabel = () => {
     if (fileNames.length > 0) return multiple ? "Add Files" : "Select New";
     return "Choose File";
   };
   const handleDragOver = (e) => {
+    if (!enableDragAndDrop || disabled2) return;
     e.preventDefault();
     setIsDragging(true);
   };
   const handleDragLeave = () => {
+    if (!enableDragAndDrop || disabled2) return;
     setIsDragging(false);
   };
   const handleDrop = (e) => {
+    if (!enableDragAndDrop || disabled2) return;
     e.preventDefault();
     setIsDragging(false);
     const droppedFiles = e.dataTransfer.files;
@@ -180,10 +251,10 @@ const BaseFileUpload = ({
     }
   };
   const handleUpload = async () => {
-    if (!files.length || uploading) return;
+    if (!files.length || uploading || disabled2) return;
     setUploading(true);
     setInternalProgress(0);
-    setUploadMessage(null);
+    announce(null);
     try {
       if (uploadProgress2 === void 0) {
         intervalRef.current = setInterval(() => {
@@ -197,9 +268,9 @@ const BaseFileUpload = ({
         }, 100);
       }
       await Promise.resolve(onSubmit == null ? void 0 : onSubmit(files));
-      setUploadMessage("Upload successful.");
+      announce(successMessage);
     } catch {
-      setUploadMessage("Upload failed. Please try again.");
+      announce(failureMessage);
     } finally {
       if (intervalRef.current) {
         if (uploadProgress2 === void 0) setInternalProgress(100);
@@ -223,7 +294,8 @@ const BaseFileUpload = ({
       outlineRounding && classMap[`round${capitalize.capitalize(outlineRounding)}`],
       error2 && classMap.error,
       isDragging && classMap.dragging,
-      disabled2 && classMap.disabled
+      disabled2 && classMap.disabled,
+      className
     ),
     [
       classMap,
@@ -233,13 +305,18 @@ const BaseFileUpload = ({
       outlineRounding,
       error2,
       isDragging,
-      disabled2
+      disabled2,
+      className
     ]
   );
   const describedBy = [
-    description ? `${testId}-description` : void 0,
-    error2 ? `${testId}-error` : void 0
+    description ? descriptionId : void 0,
+    error2 ? errorId : void 0,
+    dropzoneDescription ? dropzoneDescriptionId : void 0,
+    ariaDescribedBy
   ].filter(Boolean).join(" ") || void 0;
+  const computedAriaInvalid = ariaInvalid !== void 0 ? ariaInvalid : error2 ? true : void 0;
+  const computedAriaRequired = ariaRequired !== void 0 ? ariaRequired : required ? true : void 0;
   return /* @__PURE__ */ require$$2.jsx(
     FormGroup2,
     {
@@ -251,104 +328,166 @@ const BaseFileUpload = ({
       children: /* @__PURE__ */ require$$2.jsxs(
         "div",
         {
+          ...rest,
           className: containerClassName,
-          onDragOver: handleDragOver,
-          onDragLeave: handleDragLeave,
-          onDrop: handleDrop,
-          "aria-busy": uploading || void 0,
+          onDragOver: enableDragAndDrop ? handleDragOver : void 0,
+          onDragLeave: enableDragAndDrop ? handleDragLeave : void 0,
+          onDrop: enableDragAndDrop ? handleDrop : void 0,
+          role: dropzoneRole,
+          "aria-label": ariaLabel,
+          "aria-labelledby": ariaLabelledBy,
+          "aria-describedby": describedBy,
+          "aria-errormessage": error2 ? ariaErrorMessage || errorId : void 0,
+          "aria-invalid": computedAriaInvalid,
+          "aria-required": computedAriaRequired,
+          "aria-busy": ariaBusy !== void 0 ? ariaBusy : uploading || void 0,
           "data-testid": testId ? `${testId}-wrapper` : void 0,
           children: [
+            dropzoneDescription && /* @__PURE__ */ require$$2.jsx("div", { id: dropzoneDescriptionId, className: "sr_only", children: dropzoneDescription }),
             /* @__PURE__ */ require$$2.jsx(
               "input",
               {
+                ...inputProps,
                 ref: fileInput,
-                id: `${testId}-input`,
+                id: (inputProps == null ? void 0 : inputProps.id) || inputId,
                 type: "file",
                 multiple,
                 accept,
                 onChange: handleFileChange,
-                className: classMap.hiddenInput,
+                className: classNames.combineClassNames(
+                  classMap.hiddenInput,
+                  inputProps == null ? void 0 : inputProps.className
+                ),
                 required,
-                "aria-label": label,
+                disabled: disabled2,
+                "aria-label": inputAriaLabel || label || "Choose file",
                 "aria-describedby": describedBy,
-                "data-testid": testId ? `${testId}-input` : void 0
+                "aria-errormessage": error2 ? ariaErrorMessage || errorId : void 0,
+                "aria-invalid": computedAriaInvalid,
+                "aria-required": computedAriaRequired,
+                "data-testid": `${testId}-input`
               }
             ),
             /* @__PURE__ */ require$$2.jsx("div", { className: classMap.uploadActions, children: /* @__PURE__ */ require$$2.jsx(
               Button2,
               {
+                ...selectButtonProps,
                 icon: FileIcon,
-                size: "small",
+                size: (selectButtonProps == null ? void 0 : selectButtonProps.size) ?? "small",
                 theme,
                 state: error2 ? "error" : state,
-                className: classMap.fileInput,
+                className: classNames.combineClassNames(
+                  classMap.fileInput,
+                  selectButtonProps == null ? void 0 : selectButtonProps.className
+                ),
                 disabled: uploading || disabled2,
                 outline,
                 rounding: controlRounding,
                 shadow: controlShadow,
                 onClick: () => {
                   var _a;
-                  return (_a = fileInput.current) == null ? void 0 : _a.click();
+                  (_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,
+                "aria-label": (selectButtonProps == null ? void 0 : selectButtonProps["aria-label"]) || selectButtonAriaLabel || "Choose file",
+                "aria-describedby": fileNames.length > 0 ? fileListId : void 0,
+                "data-testid": `${testId}-file-button`,
                 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)) })
-            ] }),
+            rejectedFiles2.length > 0 && /* @__PURE__ */ require$$2.jsxs(
+              "div",
+              {
+                className: classMap.rejectedFiles,
+                "aria-label": rejectedFilesAriaLabel,
+                "data-testid": testId ? `${testId}-rejected-files` : void 0,
+                children: [
+                  /* @__PURE__ */ require$$2.jsx("p", { className: classMap.rejectedLabel, children: "Rejected Files:" }),
+                  /* @__PURE__ */ require$$2.jsx(
+                    "ul",
+                    {
+                      id: rejectedListId,
+                      className: classMap.rejectedList,
+                      "aria-label": rejectedFilesAriaLabel || "Rejected files",
+                      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,
-                        state: "error",
-                        size: "small",
-                        type: "button",
-                        outline: true,
-                        "aria-label": `Remove ${name}`,
-                        onClick: () => removeFile(index),
-                        className: classMap.removeButton
-                      }
-                    )
-                  ] }, index)) }),
+                  /* @__PURE__ */ require$$2.jsx(
+                    "ul",
+                    {
+                      id: fileListId,
+                      className: classMap.fileList,
+                      "aria-label": fileListAriaLabel || "Selected files",
+                      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,
+                          {
+                            ...removeButtonProps,
+                            icon: TrashIcon,
+                            state: "error",
+                            size: (removeButtonProps == null ? void 0 : removeButtonProps.size) ?? "small",
+                            type: "button",
+                            outline: true,
+                            "aria-label": (removeFileAriaLabel == null ? void 0 : removeFileAriaLabel(name, index)) || `Remove ${name}`,
+                            onClick: () => removeFile(index),
+                            className: classNames.combineClassNames(
+                              classMap.removeButton,
+                              removeButtonProps == null ? void 0 : removeButtonProps.className
+                            ),
+                            "data-testid": `${testId}-remove-${index}`
+                          }
+                        )
+                      ] }, index))
+                    }
+                  ),
                   uploading && /* @__PURE__ */ require$$2.jsx(
                     ProgressBar2,
                     {
+                      ...progressBarProps,
                       theme,
-                      className: classMap.uploadProgress,
+                      className: classNames.combineClassNames(
+                        classMap.uploadProgress,
+                        progressBarProps == null ? void 0 : progressBarProps.className
+                      ),
                       value: uploadProgress2 ?? internalProgress,
                       indeterminate: uploadProgress2 === void 0,
-                      "data-testid": testId ? `${testId}-progress` : void 0
+                      "data-testid": (progressBarProps == null ? void 0 : progressBarProps["data-testid"]) || `${testId}-progress`
                     }
                   ),
                   !uploading && /* @__PURE__ */ require$$2.jsx(
                     Button2,
                     {
+                      ...uploadButtonProps,
                       theme,
                       state: error2 ? "error" : state,
                       disabled: disabled2 || files.length === 0,
-                      onClick: handleUpload,
+                      onClick: () => {
+                        void handleUpload();
+                      },
                       loading: uploading,
-                      size: "small",
-                      className: classMap.uploadButton,
-                      "data-testid": testId ? `${testId}-upload-button` : void 0,
+                      size: (uploadButtonProps == null ? void 0 : uploadButtonProps.size) ?? "small",
+                      className: classNames.combineClassNames(
+                        classMap.uploadButton,
+                        uploadButtonProps == null ? void 0 : uploadButtonProps.className
+                      ),
+                      "aria-label": uploadButtonAriaLabel || "Upload selected files",
+                      "data-testid": `${testId}-upload-button`,
                       children: "Upload"
                     }
                   )
@@ -358,8 +497,9 @@ const BaseFileUpload = ({
             /* @__PURE__ */ require$$2.jsx(
               "div",
               {
+                id: liveRegionId,
                 className: "sr_only",
-                "aria-live": "polite",
+                "aria-live": ariaLive || liveRegionPoliteness,
                 "aria-atomic": "true",
                 "data-testid": testId ? `${testId}-upload-message` : void 0,
                 children: uploadMessage
@@ -476,4 +616,4 @@ const FileUpload = (props) => {
 };
 FileUpload.displayName = "FileUpload";
 exports.FileUpload = FileUpload;
-//# sourceMappingURL=FileUpload-uJZYGisD.cjs.map
+//# sourceMappingURL=FileUpload-C1DVXFK7.cjs.map