@availity/mui-file-selector 1.8.1 → 1.9.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/CHANGELOG.md +23 -0
  2. package/dist/index.js +99 -93
  3. package/dist/index.mjs +75 -69
  4. package/package.json +13 -12
  5. package/src/lib/Dropzone.tsx +15 -7
  6. package/src/lib/Dropzone2.tsx +15 -7
package/CHANGELOG.md CHANGED
@@ -2,6 +2,29 @@
2
2
 
3
3
  This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
4
4
 
5
+ ## [1.9.1](https://github.com/Availity/element/compare/@availity/mui-file-selector@1.9.0...@availity/mui-file-selector@1.9.1) (2025-10-30)
6
+
7
+ ### Dependency Updates
8
+
9
+ * `mui-paper` updated to version `1.9.0`
10
+ * `mui-alert` updated to version `1.9.0`
11
+ * `mui-button` updated to version `1.9.0`
12
+ * `mui-divider` updated to version `1.9.0`
13
+ * `mui-form-utils` updated to version `1.9.0`
14
+ * `mui-icon` updated to version `1.9.0`
15
+ * `mui-layout` updated to version `1.9.0`
16
+ * `mui-list` updated to version `1.9.0`
17
+ * `mui-progress` updated to version `1.9.0`
18
+ * `mui-typography` updated to version `1.9.0`
19
+ * `mui-dialog` updated to version `1.9.0`
20
+ * `mui-textfield` updated to version `1.9.0`
21
+ ## [1.9.0](https://github.com/Availity/element/compare/@availity/mui-file-selector@1.8.1...@availity/mui-file-selector@1.9.0) (2025-09-24)
22
+
23
+
24
+ ### Features
25
+
26
+ * **mui-file-selector:** disable FilePickerBtn when max files is reached ([06f1764](https://github.com/Availity/element/commit/06f176448192e89088e760c762b37b469ac39e95))
27
+
5
28
  ## [1.8.1](https://github.com/Availity/element/compare/@availity/mui-file-selector@1.8.0...@availity/mui-file-selector@1.8.1) (2025-06-16)
6
29
 
7
30
 
package/dist/index.js CHANGED
@@ -428,7 +428,12 @@ var Dropzone = ({
428
428
  const field = getValues();
429
429
  return field[name] || [];
430
430
  };
431
- const hasFiles = getFieldValue().length > 0;
431
+ const currentFileCount = getFieldValue().length;
432
+ const hasFiles = currentFileCount > 0;
433
+ const isMaxFilesReached = maxFiles && currentFileCount >= maxFiles;
434
+ if (isMaxFilesReached) {
435
+ disabled = true;
436
+ }
432
437
  return enableDropArea ? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(DropzoneContainer, __spreadProps(__spreadValues({ sx: outerBoxStyles }, rootProps), { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_mui_layout.Box, { sx: innerBoxStyles, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_mui_layout.Stack, { spacing: 2, alignItems: "center", justifyContent: "center", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
433
438
  /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_mui_icon2.CloudUploadIcon, { fontSize: "xlarge", color: "secondary" }),
434
439
  /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_mui_typography.Typography, { variant: "subtitle2", fontWeight: "700", children: "Drag and Drop Files Here" }),
@@ -560,7 +565,7 @@ var Dropzone2 = ({
560
565
  [maxFiles, validator, uploadOptions.allowedFileNameCharacters, allowedFileTypes, watch, name]
561
566
  );
562
567
  const handleOnDrop = (0, import_react2.useCallback)(
563
- (acceptedFiles, fileRejections, event) => __async(void 0, null, function* () {
568
+ (acceptedFiles, fileRejections, event) => __async(null, null, function* () {
564
569
  var _a2;
565
570
  let newSize = 0;
566
571
  for (const file of acceptedFiles) {
@@ -667,7 +672,12 @@ var Dropzone2 = ({
667
672
  const field = getValues();
668
673
  return field[name] || [];
669
674
  };
670
- const hasFiles = getFieldValue().length > 0;
675
+ const currentFileCount = getFieldValue().length;
676
+ const hasFiles = currentFileCount > 0;
677
+ const isMaxFilesReached = maxFiles && currentFileCount >= maxFiles;
678
+ if (isMaxFilesReached) {
679
+ disabled = true;
680
+ }
671
681
  return enableDropArea ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(DropzoneContainer, __spreadProps(__spreadValues({ sx: outerBoxStyles }, rootProps), { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_mui_layout2.Box, { sx: innerBoxStyles, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_mui_layout2.Stack, { spacing: 2, alignItems: "center", justifyContent: "center", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
672
682
  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_mui_icon3.CloudUploadIcon, { fontSize: "xlarge", color: "secondary" }),
673
683
  /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_mui_typography2.Typography, { variant: "subtitle2", fontWeight: "700", children: "Drag and Drop Files Here" }),
@@ -811,15 +821,11 @@ var DialogContent = (_a) => {
811
821
  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_DialogContent.default, __spreadProps(__spreadValues({}, rest), { children }));
812
822
  };
813
823
 
814
- // ../dialog/src/lib/DialogContentText.tsx
815
- var import_DialogContentText = __toESM(require("@mui/material/DialogContentText"));
816
- var import_jsx_runtime8 = require("react/jsx-runtime");
817
-
818
824
  // ../dialog/src/lib/DialogTitle.tsx
819
825
  var import_DialogTitle = __toESM(require("@mui/material/DialogTitle"));
820
826
  var import_mui_alert2 = require("@availity/mui-alert");
821
827
  var import_styles3 = require("@mui/material/styles");
822
- var import_jsx_runtime9 = require("react/jsx-runtime");
828
+ var import_jsx_runtime8 = require("react/jsx-runtime");
823
829
  var AlertIcon = (0, import_styles3.styled)("div", {
824
830
  name: "MuiDialogTitle",
825
831
  slot: "AvIcon",
@@ -832,8 +838,8 @@ var AlertIcon = (0, import_styles3.styled)("div", {
832
838
  });
833
839
  var DialogTitle = (_a) => {
834
840
  var _b = _a, { children, component = "h2", icon, variant = "h5" } = _b, rest = __objRest(_b, ["children", "component", "icon", "variant"]);
835
- return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_DialogTitle.default, __spreadProps(__spreadValues({ component, variant }, rest), { children: [
836
- icon ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(AlertIcon, { children: import_mui_alert2.AlertIcons[icon] }) : null,
841
+ return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_DialogTitle.default, __spreadProps(__spreadValues({ component, variant }, rest), { children: [
842
+ icon ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(AlertIcon, { children: import_mui_alert2.AlertIcons[icon] }) : null,
837
843
  children
838
844
  ] }));
839
845
  };
@@ -851,7 +857,7 @@ var import_TextField = __toESM(require("@mui/material/TextField"));
851
857
  var import_mui_form_utils2 = require("@availity/mui-form-utils");
852
858
  var import_mui_layout3 = require("@availity/mui-layout");
853
859
  var import_mui_typography3 = require("@availity/mui-typography");
854
- var import_jsx_runtime10 = require("react/jsx-runtime");
860
+ var import_jsx_runtime9 = require("react/jsx-runtime");
855
861
  var TextFieldFormHelperText = (_a) => {
856
862
  var _b = _a, {
857
863
  charCount,
@@ -865,16 +871,16 @@ var TextFieldFormHelperText = (_a) => {
865
871
  "showCharacterCount"
866
872
  ]);
867
873
  if (showCharacterCount) {
868
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_mui_layout3.Grid, { container: true, justifyContent: "space-between", flexWrap: "nowrap", children: [
869
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_mui_form_utils2.FormHelperText, __spreadProps(__spreadValues({}, FormHelperTextProps2), { sx: { marginRight: "12px" }, children: helperText })),
870
- /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_mui_typography3.Typography, { variant: "caption", marginTop: "4px", lineHeight: "1.25rem", children: [
871
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_mui_typography3.Typography, { component: "span", variant: "inherit", color: charCount > maxLength ? "error" : "textPrimary", children: charCount || 0 }),
874
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_mui_layout3.Grid, { container: true, justifyContent: "space-between", flexWrap: "nowrap", children: [
875
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_mui_form_utils2.FormHelperText, __spreadProps(__spreadValues({}, FormHelperTextProps2), { sx: { marginRight: "12px" }, children: helperText })),
876
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_mui_typography3.Typography, { variant: "caption", marginTop: "4px", lineHeight: "1.25rem", children: [
877
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_mui_typography3.Typography, { component: "span", variant: "inherit", color: charCount > maxLength ? "error" : "textPrimary", children: charCount || 0 }),
872
878
  "/",
873
879
  maxLength
874
880
  ] })
875
881
  ] });
876
882
  }
877
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_mui_form_utils2.FormHelperText, __spreadProps(__spreadValues({}, FormHelperTextProps2), { children: helperText }));
883
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_mui_form_utils2.FormHelperText, __spreadProps(__spreadValues({}, FormHelperTextProps2), { children: helperText }));
878
884
  };
879
885
  var TextField = (0, import_react3.forwardRef)((props, ref) => {
880
886
  var _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
@@ -906,14 +912,14 @@ var TextField = (0, import_react3.forwardRef)((props, ref) => {
906
912
  const maxLength = (inputProps == null ? void 0 : inputProps.maxLength) || ((_c = (_b = rest.slotProps) == null ? void 0 : _b.htmlInput) == null ? void 0 : _c.maxLength);
907
913
  const allReadOnly = (InputProps2 == null ? void 0 : InputProps2.readOnly) || (inputProps == null ? void 0 : inputProps.readOnly) || ((_e = (_d = rest.slotProps) == null ? void 0 : _d.htmlInput) == null ? void 0 : _e.readOnly) || ((_g = (_f = rest.slotProps) == null ? void 0 : _f.input) == null ? void 0 : _g.readOnly);
908
914
  const resolvedProps = (props2) => !props2 || Object.keys(props2).length === 0 ? void 0 : props2;
909
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
915
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
910
916
  import_TextField.default,
911
917
  __spreadProps(__spreadValues({}, rest), {
912
918
  onChange: (event) => {
913
919
  setCharCount(event.target.value.length);
914
920
  if (rest.onChange) rest.onChange(event);
915
921
  },
916
- helperText: helperText || /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_jsx_runtime10.Fragment, {}),
922
+ helperText: helperText || /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_jsx_runtime9.Fragment, {}),
917
923
  slots: { formHelperText: TextFieldFormHelperText },
918
924
  slotProps: {
919
925
  input: resolvedProps(__spreadProps(__spreadValues(__spreadValues(__spreadValues({}, InputProps2), import_mui_form_utils2.InputPropOverrides), (_h = rest.slotProps) == null ? void 0 : _h.input), {
@@ -946,7 +952,7 @@ var TextField = (0, import_react3.forwardRef)((props, ref) => {
946
952
  });
947
953
 
948
954
  // src/lib/UploadProgressBar.tsx
949
- var import_jsx_runtime11 = require("react/jsx-runtime");
955
+ var import_jsx_runtime10 = require("react/jsx-runtime");
950
956
  var ERROR_MAPPINGS = [
951
957
  {
952
958
  pattern: /but has an extension for/i,
@@ -995,24 +1001,24 @@ var UploadProgressBar = ({ upload, onProgress, onError, onSuccess }) => {
995
1001
  upload.onProgress.push(handleOnProgress);
996
1002
  upload.onSuccess.push(handleOnSuccess);
997
1003
  upload.onError.push(handleOnError);
998
- return errorMessage ? /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_mui_layout4.Box, { sx: { display: "flex", flexWrap: "wrap", columnGap: "4px" }, children: [
999
- /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
1004
+ return errorMessage ? /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_mui_layout4.Box, { sx: { display: "flex", flexWrap: "wrap", columnGap: "4px" }, children: [
1005
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
1000
1006
  import_mui_list2.ListItemText,
1001
1007
  {
1002
1008
  slotProps: { primary: { color: "text.error", variant: "body2", component: "div" } },
1003
1009
  sx: { wordWrap: "break-word" },
1004
1010
  children: [
1005
- /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_mui_icon5.WarningTriangleIcon, { sx: { verticalAlign: "middle", mt: "-2px" } }),
1011
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_mui_icon5.WarningTriangleIcon, { sx: { verticalAlign: "middle", mt: "-2px" } }),
1006
1012
  " ",
1007
1013
  errorMessage
1008
1014
  ]
1009
1015
  }
1010
1016
  ),
1011
- upload.status === "encrypted" && /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "pwRequired", children: [
1012
- /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_mui_button3.Button, { color: "secondary", size: "small", onClick: toggleModal, children: "Enter Password" }),
1013
- /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Dialog, { open: modalOpen, onClose: toggleModal, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("form", { onSubmit: verifyPassword, children: [
1014
- /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(DialogTitle, { children: "Enter Password" }),
1015
- /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(DialogContent, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
1017
+ upload.status === "encrypted" && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "pwRequired", children: [
1018
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_mui_button3.Button, { color: "secondary", size: "small", onClick: toggleModal, children: "Enter Password" }),
1019
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Dialog, { open: modalOpen, onClose: toggleModal, children: /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("form", { onSubmit: verifyPassword, children: [
1020
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(DialogTitle, { children: "Enter Password" }),
1021
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(DialogContent, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
1016
1022
  TextField,
1017
1023
  {
1018
1024
  type: showPassword ? "text" : "password",
@@ -1021,22 +1027,22 @@ var UploadProgressBar = ({ upload, onProgress, onError, onSuccess }) => {
1021
1027
  onChange: handlePasswordChange,
1022
1028
  autoFocus: true,
1023
1029
  InputProps: {
1024
- endAdornment: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_mui_form_utils3.InputAdornment, { position: "end", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
1030
+ endAdornment: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_mui_form_utils3.InputAdornment, { position: "end", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
1025
1031
  import_mui_button3.IconButton,
1026
1032
  {
1027
1033
  title: "password visibility",
1028
1034
  onClick: () => setShowPassword((prev) => !prev),
1029
1035
  edge: "end",
1030
- children: showPassword ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_mui_icon5.EyeIcon, { fontSize: "small" }) : /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_mui_icon5.EyeSlashIcon, { fontSize: "small" })
1036
+ children: showPassword ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_mui_icon5.EyeIcon, { fontSize: "small" }) : /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_mui_icon5.EyeSlashIcon, { fontSize: "small" })
1031
1037
  }
1032
1038
  ) })
1033
1039
  }
1034
1040
  }
1035
1041
  ) }),
1036
- /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(DialogActions, { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_mui_button3.Button, { color: "primary", type: "submit", children: "Ok" }) })
1042
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(DialogActions, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_mui_button3.Button, { color: "primary", type: "submit", children: "Ok" }) })
1037
1043
  ] }) })
1038
1044
  ] })
1039
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_mui_progress.LinearProgress, { value: statePercentage, "aria-label": `${upload.file.name}-progress` });
1045
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_mui_progress.LinearProgress, { value: statePercentage, "aria-label": `${upload.file.name}-progress` });
1040
1046
  };
1041
1047
 
1042
1048
  // src/lib/useUploadCore.tsx
@@ -1067,7 +1073,7 @@ function useUploadCore(file, options, queryOptions) {
1067
1073
  }
1068
1074
 
1069
1075
  // src/lib/FileList.tsx
1070
- var import_jsx_runtime12 = require("react/jsx-runtime");
1076
+ var import_jsx_runtime11 = require("react/jsx-runtime");
1071
1077
  var FileRow = ({
1072
1078
  file,
1073
1079
  options,
@@ -1079,12 +1085,12 @@ var FileRow = ({
1079
1085
  const Icon = getFileExtIcon(file.name);
1080
1086
  const { data: upload } = useUploadCore(file, options, queryOptions);
1081
1087
  if (!upload) return null;
1082
- if (CustomRow) return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(CustomRow, { upload, options, onRemoveFile });
1083
- return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
1088
+ if (CustomRow) return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(CustomRow, { upload, options, onRemoveFile });
1089
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
1084
1090
  import_mui_list3.ListItem,
1085
1091
  {
1086
1092
  disableGutters: true,
1087
- secondaryAction: !disableRemove && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
1093
+ secondaryAction: !disableRemove && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
1088
1094
  import_mui_button4.IconButton,
1089
1095
  {
1090
1096
  title: "remove file",
@@ -1092,17 +1098,17 @@ var FileRow = ({
1092
1098
  onClick: () => {
1093
1099
  onRemoveFile(upload.id, upload);
1094
1100
  },
1095
- children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_mui_icon6.DeleteIcon, {})
1101
+ children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_mui_icon6.DeleteIcon, {})
1096
1102
  }
1097
1103
  ),
1098
1104
  children: [
1099
- /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_mui_layout5.Grid, { container: true, spacing: 2, alignItems: "center", justifyContent: "space-between", width: "100%", flexWrap: "wrap", children: [
1100
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_mui_layout5.Grid, { size: { xs: "auto" }, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_mui_list3.ListItemIcon, { sx: { minWidth: "1.5rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Icon, {}) }) }),
1101
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_mui_layout5.Grid, { size: { xs: 4 }, sx: { minWidth: "8rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_mui_list3.ListItemText, { sx: { wordBreak: "break-all" }, children: upload.trimFileName(upload.file.name) }) }),
1102
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_mui_layout5.Grid, { size: { xs: 2 }, sx: { minWidth: "3rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_mui_list3.ListItemText, { sx: { textAlign: "end" }, children: formatBytes(upload.file.size) }) }),
1103
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_mui_layout5.Grid, { size: { xs: "grow" }, sx: { minWidth: "6rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(UploadProgressBar, { upload }) })
1105
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_mui_layout5.Grid, { container: true, spacing: 2, alignItems: "center", justifyContent: "space-between", width: "100%", flexWrap: "wrap", children: [
1106
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_mui_layout5.Grid, { size: { xs: "auto" }, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_mui_list3.ListItemIcon, { sx: { minWidth: "1.5rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Icon, {}) }) }),
1107
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_mui_layout5.Grid, { size: { xs: 4 }, sx: { minWidth: "8rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_mui_list3.ListItemText, { sx: { wordBreak: "break-all" }, children: upload.trimFileName(upload.file.name) }) }),
1108
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_mui_layout5.Grid, { size: { xs: 2 }, sx: { minWidth: "3rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_mui_list3.ListItemText, { sx: { textAlign: "end" }, children: formatBytes(upload.file.size) }) }),
1109
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_mui_layout5.Grid, { size: { xs: "grow" }, sx: { minWidth: "6rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(UploadProgressBar, { upload }) })
1104
1110
  ] }),
1105
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_mui_divider3.Divider, {})
1111
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_mui_divider3.Divider, {})
1106
1112
  ]
1107
1113
  }
1108
1114
  );
@@ -1116,8 +1122,8 @@ var FileList = ({
1116
1122
  disableRemove
1117
1123
  }) => {
1118
1124
  if (files.length === 0) return null;
1119
- return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_mui_list3.List, { children: files.map((file) => {
1120
- return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
1125
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_mui_list3.List, { children: files.map((file) => {
1126
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
1121
1127
  FileRow,
1122
1128
  {
1123
1129
  file,
@@ -1138,7 +1144,7 @@ var import_mui_button5 = require("@availity/mui-button");
1138
1144
  var import_mui_icon7 = require("@availity/mui-icon");
1139
1145
  var import_mui_layout6 = require("@availity/mui-layout");
1140
1146
  var import_mui_divider4 = require("@availity/mui-divider");
1141
- var import_jsx_runtime13 = require("react/jsx-runtime");
1147
+ var import_jsx_runtime12 = require("react/jsx-runtime");
1142
1148
  var FileRow2 = ({
1143
1149
  upload,
1144
1150
  options,
@@ -1148,12 +1154,12 @@ var FileRow2 = ({
1148
1154
  }) => {
1149
1155
  const Icon = getFileExtIcon(upload.file.name);
1150
1156
  if (!upload) return null;
1151
- if (CustomRow) return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(CustomRow, { upload, options, onRemoveFile });
1152
- return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
1157
+ if (CustomRow) return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(CustomRow, { upload, options, onRemoveFile });
1158
+ return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
1153
1159
  import_mui_list4.ListItem,
1154
1160
  {
1155
1161
  disableGutters: true,
1156
- secondaryAction: !disableRemove && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
1162
+ secondaryAction: !disableRemove && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
1157
1163
  import_mui_button5.IconButton,
1158
1164
  {
1159
1165
  title: "remove file",
@@ -1161,17 +1167,17 @@ var FileRow2 = ({
1161
1167
  onClick: () => {
1162
1168
  onRemoveFile(upload.id, upload);
1163
1169
  },
1164
- children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_mui_icon7.DeleteIcon, {})
1170
+ children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_mui_icon7.DeleteIcon, {})
1165
1171
  }
1166
1172
  ),
1167
1173
  children: [
1168
- /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_mui_layout6.Grid, { container: true, spacing: 2, alignItems: "center", justifyContent: "space-between", width: "100%", flexWrap: "wrap", children: [
1169
- /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_mui_layout6.Grid, { size: { xs: "auto" }, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_mui_list4.ListItemIcon, { sx: { minWidth: "1.5rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Icon, {}) }) }),
1170
- /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_mui_layout6.Grid, { size: { xs: 4 }, sx: { minWidth: "8rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_mui_list4.ListItemText, { sx: { wordBreak: "break-all" }, children: upload.trimFileName(upload.file.name) }) }),
1171
- /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_mui_layout6.Grid, { size: { xs: 2 }, sx: { minWidth: "3rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_mui_list4.ListItemText, { sx: { textAlign: "end" }, children: formatBytes(upload.file.size) }) }),
1172
- /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_mui_layout6.Grid, { size: { xs: "grow" }, sx: { minWidth: "6rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(UploadProgressBar, { upload }) })
1174
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_mui_layout6.Grid, { container: true, spacing: 2, alignItems: "center", justifyContent: "space-between", width: "100%", flexWrap: "wrap", children: [
1175
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_mui_layout6.Grid, { size: { xs: "auto" }, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_mui_list4.ListItemIcon, { sx: { minWidth: "1.5rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Icon, {}) }) }),
1176
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_mui_layout6.Grid, { size: { xs: 4 }, sx: { minWidth: "8rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_mui_list4.ListItemText, { sx: { wordBreak: "break-all" }, children: upload.trimFileName(upload.file.name) }) }),
1177
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_mui_layout6.Grid, { size: { xs: 2 }, sx: { minWidth: "3rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_mui_list4.ListItemText, { sx: { textAlign: "end" }, children: formatBytes(upload.file.size) }) }),
1178
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_mui_layout6.Grid, { size: { xs: "grow" }, sx: { minWidth: "6rem" }, children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(UploadProgressBar, { upload }) })
1173
1179
  ] }),
1174
- /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_mui_divider4.Divider, {})
1180
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_mui_divider4.Divider, {})
1175
1181
  ]
1176
1182
  }
1177
1183
  );
@@ -1184,8 +1190,8 @@ var FileList2 = ({
1184
1190
  disableRemove
1185
1191
  }) => {
1186
1192
  if (uploads.length === 0) return null;
1187
- return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_mui_list4.List, { children: uploads.map((upload) => {
1188
- return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
1193
+ return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_mui_list4.List, { children: uploads.map((upload) => {
1194
+ return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
1189
1195
  FileRow2,
1190
1196
  {
1191
1197
  upload,
@@ -1209,7 +1215,7 @@ var import_mui_alert3 = require("@availity/mui-alert");
1209
1215
 
1210
1216
  // src/lib/FileTypesMessage.tsx
1211
1217
  var import_mui_typography4 = require("@availity/mui-typography");
1212
- var import_jsx_runtime14 = require("react/jsx-runtime");
1218
+ var import_jsx_runtime13 = require("react/jsx-runtime");
1213
1219
  var FileTypesMessage = ({
1214
1220
  allowedFileTypes = [],
1215
1221
  customSizeMessage,
@@ -1222,7 +1228,7 @@ var FileTypesMessage = ({
1222
1228
  const fileSizeMsg = customSizeMessage || (typeof maxFileSize === "number" ? `Maximum file size is ${formatBytes(maxFileSize)}. ` : null);
1223
1229
  const totalFileSizeMsg = customTotalSizeMessage || (typeof maxTotalSize === "number" ? `Maximum total upload size is ${formatBytes(maxTotalSize)}. ` : null);
1224
1230
  const fileTypesMsg = customTypesMessage || (allowedFileTypes.length > 0 ? `Supported file types include: ${allowedFileTypes.join(", ")}` : "All file types allowed.");
1225
- return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_mui_typography4.Typography, { variant, children: [
1231
+ return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_mui_typography4.Typography, { variant, children: [
1226
1232
  fileSizeMsg,
1227
1233
  totalFileSizeMsg,
1228
1234
  fileTypesMsg
@@ -1231,9 +1237,9 @@ var FileTypesMessage = ({
1231
1237
 
1232
1238
  // src/lib/HeaderMessage.tsx
1233
1239
  var import_mui_typography5 = require("@availity/mui-typography");
1234
- var import_jsx_runtime15 = require("react/jsx-runtime");
1240
+ var import_jsx_runtime14 = require("react/jsx-runtime");
1235
1241
  var HeaderMessage = ({ maxFiles, maxSize, maxTotalSize }) => {
1236
- return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_mui_typography5.Typography, { variant: "h6", children: [
1242
+ return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_mui_typography5.Typography, { variant: "h6", children: [
1237
1243
  "Attach up to ",
1238
1244
  maxFiles,
1239
1245
  " file(s), with a maximum individual size of ",
@@ -1244,7 +1250,7 @@ var HeaderMessage = ({ maxFiles, maxSize, maxTotalSize }) => {
1244
1250
  };
1245
1251
 
1246
1252
  // src/lib/FileSelector.tsx
1247
- var import_jsx_runtime16 = require("react/jsx-runtime");
1253
+ var import_jsx_runtime15 = require("react/jsx-runtime");
1248
1254
  var CLOUD_URL = "/cloud/web/appl/vault/upload/v1/resumable";
1249
1255
  var FileSelector = ({
1250
1256
  name,
@@ -1317,10 +1323,10 @@ var FileSelector = ({
1317
1323
  const otherRejections = fileRejections.filter(
1318
1324
  (rejection) => !rejection.errors.some((error) => error.code === TOO_MANY_FILES_CODE)
1319
1325
  );
1320
- return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
1321
- enableDropArea ? /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
1322
- label ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_mui_typography6.Typography, { marginBottom: "4px", children: label }) : null,
1323
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
1326
+ return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_jsx_runtime15.Fragment, { children: [
1327
+ enableDropArea ? /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_jsx_runtime15.Fragment, { children: [
1328
+ label ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_mui_typography6.Typography, { marginBottom: "4px", children: label }) : null,
1329
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
1324
1330
  Dropzone,
1325
1331
  {
1326
1332
  name,
@@ -1339,7 +1345,7 @@ var FileSelector = ({
1339
1345
  validator
1340
1346
  }
1341
1347
  ),
1342
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
1348
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
1343
1349
  FileTypesMessage,
1344
1350
  {
1345
1351
  allowedFileTypes,
@@ -1352,10 +1358,10 @@ var FileSelector = ({
1352
1358
  }
1353
1359
  ),
1354
1360
  children
1355
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_mui_layout7.Grid, { container: true, rowSpacing: 3, flexDirection: "column", children: [
1356
- /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_mui_layout7.Grid, { children: [
1357
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(HeaderMessage, { maxFiles, maxSize, maxTotalSize }),
1358
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
1361
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_mui_layout7.Grid, { container: true, rowSpacing: 3, flexDirection: "column", children: [
1362
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_mui_layout7.Grid, { children: [
1363
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(HeaderMessage, { maxFiles, maxSize, maxTotalSize }),
1364
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
1359
1365
  FileTypesMessage,
1360
1366
  {
1361
1367
  allowedFileTypes,
@@ -1366,8 +1372,8 @@ var FileSelector = ({
1366
1372
  }
1367
1373
  )
1368
1374
  ] }),
1369
- children ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_mui_layout7.Grid, { children }) : null,
1370
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_mui_layout7.Grid, { children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
1375
+ children ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_mui_layout7.Grid, { children }) : null,
1376
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_mui_layout7.Grid, { children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
1371
1377
  Dropzone,
1372
1378
  {
1373
1379
  name,
@@ -1387,20 +1393,20 @@ var FileSelector = ({
1387
1393
  }
1388
1394
  ) })
1389
1395
  ] }),
1390
- tooManyFilesRejections.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
1396
+ tooManyFilesRejections.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
1391
1397
  import_mui_alert3.Alert,
1392
1398
  {
1393
1399
  severity: "error",
1394
1400
  onClose: () => tooManyFilesRejections.forEach((rejection) => handleRemoveRejection(rejection.id)),
1395
1401
  children: [
1396
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_mui_alert3.AlertTitle, { children: "Items not allowed." }),
1402
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_mui_alert3.AlertTitle, { children: "Items not allowed." }),
1397
1403
  "Too many files are selected for upload, maximum ",
1398
1404
  maxFiles,
1399
1405
  " allowed."
1400
1406
  ]
1401
1407
  }
1402
1408
  ),
1403
- otherRejections.length > 0 && otherRejections.map((rejection) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
1409
+ otherRejections.length > 0 && otherRejections.map((rejection) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
1404
1410
  ErrorAlert,
1405
1411
  {
1406
1412
  errors: rejection.errors,
@@ -1410,7 +1416,7 @@ var FileSelector = ({
1410
1416
  },
1411
1417
  rejection.id
1412
1418
  )),
1413
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
1419
+ /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
1414
1420
  FileList,
1415
1421
  {
1416
1422
  files: files || [],
@@ -1430,7 +1436,7 @@ var import_react_hook_form5 = require("react-hook-form");
1430
1436
  var import_mui_layout8 = require("@availity/mui-layout");
1431
1437
  var import_mui_typography7 = require("@availity/mui-typography");
1432
1438
  var import_mui_alert4 = require("@availity/mui-alert");
1433
- var import_jsx_runtime17 = require("react/jsx-runtime");
1439
+ var import_jsx_runtime16 = require("react/jsx-runtime");
1434
1440
  var FileSelector2 = ({
1435
1441
  name,
1436
1442
  allowedFileNameCharacters,
@@ -1499,10 +1505,10 @@ var FileSelector2 = ({
1499
1505
  const otherRejections = fileRejections.filter(
1500
1506
  (rejection) => !rejection.errors.some((error) => error.code === TOO_MANY_FILES_CODE)
1501
1507
  );
1502
- return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
1503
- enableDropArea ? /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
1504
- label ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_mui_typography7.Typography, { marginBottom: "4px", children: label }) : null,
1505
- /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
1508
+ return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
1509
+ enableDropArea ? /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
1510
+ label ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_mui_typography7.Typography, { marginBottom: "4px", children: label }) : null,
1511
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
1506
1512
  Dropzone2,
1507
1513
  {
1508
1514
  name,
@@ -1521,7 +1527,7 @@ var FileSelector2 = ({
1521
1527
  validator
1522
1528
  }
1523
1529
  ),
1524
- /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
1530
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
1525
1531
  FileTypesMessage,
1526
1532
  {
1527
1533
  allowedFileTypes,
@@ -1534,10 +1540,10 @@ var FileSelector2 = ({
1534
1540
  }
1535
1541
  ),
1536
1542
  children
1537
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_mui_layout8.Grid, { container: true, rowSpacing: 3, flexDirection: "column", children: [
1538
- /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_mui_layout8.Grid, { children: [
1539
- /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(HeaderMessage, { maxFiles, maxSize, maxTotalSize }),
1540
- /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
1543
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_mui_layout8.Grid, { container: true, rowSpacing: 3, flexDirection: "column", children: [
1544
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_mui_layout8.Grid, { children: [
1545
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(HeaderMessage, { maxFiles, maxSize, maxTotalSize }),
1546
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
1541
1547
  FileTypesMessage,
1542
1548
  {
1543
1549
  allowedFileTypes,
@@ -1548,8 +1554,8 @@ var FileSelector2 = ({
1548
1554
  }
1549
1555
  )
1550
1556
  ] }),
1551
- children ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_mui_layout8.Grid, { children }) : null,
1552
- /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_mui_layout8.Grid, { children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
1557
+ children ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_mui_layout8.Grid, { children }) : null,
1558
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_mui_layout8.Grid, { children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
1553
1559
  Dropzone2,
1554
1560
  {
1555
1561
  name,
@@ -1569,20 +1575,20 @@ var FileSelector2 = ({
1569
1575
  }
1570
1576
  ) })
1571
1577
  ] }),
1572
- tooManyFilesRejections.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
1578
+ tooManyFilesRejections.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
1573
1579
  import_mui_alert4.Alert,
1574
1580
  {
1575
1581
  severity: "error",
1576
1582
  onClose: () => tooManyFilesRejections.forEach((rejection) => handleRemoveRejection(rejection.id)),
1577
1583
  children: [
1578
- /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_mui_alert4.AlertTitle, { children: "Items not allowed." }),
1584
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_mui_alert4.AlertTitle, { children: "Items not allowed." }),
1579
1585
  "Too many files are selected for upload, maximum ",
1580
1586
  maxFiles,
1581
1587
  " allowed."
1582
1588
  ]
1583
1589
  }
1584
1590
  ),
1585
- otherRejections.length > 0 && otherRejections.map((rejection) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
1591
+ otherRejections.length > 0 && otherRejections.map((rejection) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
1586
1592
  ErrorAlert,
1587
1593
  {
1588
1594
  errors: rejection.errors,
@@ -1592,7 +1598,7 @@ var FileSelector2 = ({
1592
1598
  },
1593
1599
  rejection.id
1594
1600
  )),
1595
- /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
1601
+ /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
1596
1602
  FileList2,
1597
1603
  {
1598
1604
  uploads: uploads || [],
package/dist/index.mjs CHANGED
@@ -387,7 +387,12 @@ var Dropzone = ({
387
387
  const field = getValues();
388
388
  return field[name] || [];
389
389
  };
390
- const hasFiles = getFieldValue().length > 0;
390
+ const currentFileCount = getFieldValue().length;
391
+ const hasFiles = currentFileCount > 0;
392
+ const isMaxFilesReached = maxFiles && currentFileCount >= maxFiles;
393
+ if (isMaxFilesReached) {
394
+ disabled = true;
395
+ }
391
396
  return enableDropArea ? /* @__PURE__ */ jsx2(DropzoneContainer, __spreadProps(__spreadValues({ sx: outerBoxStyles }, rootProps), { children: /* @__PURE__ */ jsx2(Box, { sx: innerBoxStyles, children: /* @__PURE__ */ jsx2(Stack, { spacing: 2, alignItems: "center", justifyContent: "center", children: /* @__PURE__ */ jsxs2(Fragment2, { children: [
392
397
  /* @__PURE__ */ jsx2(CloudUploadIcon, { fontSize: "xlarge", color: "secondary" }),
393
398
  /* @__PURE__ */ jsx2(Typography, { variant: "subtitle2", fontWeight: "700", children: "Drag and Drop Files Here" }),
@@ -519,7 +524,7 @@ var Dropzone2 = ({
519
524
  [maxFiles, validator, uploadOptions.allowedFileNameCharacters, allowedFileTypes, watch, name]
520
525
  );
521
526
  const handleOnDrop = useCallback2(
522
- (acceptedFiles, fileRejections, event) => __async(void 0, null, function* () {
527
+ (acceptedFiles, fileRejections, event) => __async(null, null, function* () {
523
528
  var _a2;
524
529
  let newSize = 0;
525
530
  for (const file of acceptedFiles) {
@@ -626,7 +631,12 @@ var Dropzone2 = ({
626
631
  const field = getValues();
627
632
  return field[name] || [];
628
633
  };
629
- const hasFiles = getFieldValue().length > 0;
634
+ const currentFileCount = getFieldValue().length;
635
+ const hasFiles = currentFileCount > 0;
636
+ const isMaxFilesReached = maxFiles && currentFileCount >= maxFiles;
637
+ if (isMaxFilesReached) {
638
+ disabled = true;
639
+ }
630
640
  return enableDropArea ? /* @__PURE__ */ jsx3(DropzoneContainer, __spreadProps(__spreadValues({ sx: outerBoxStyles }, rootProps), { children: /* @__PURE__ */ jsx3(Box2, { sx: innerBoxStyles, children: /* @__PURE__ */ jsx3(Stack2, { spacing: 2, alignItems: "center", justifyContent: "center", children: /* @__PURE__ */ jsxs3(Fragment3, { children: [
631
641
  /* @__PURE__ */ jsx3(CloudUploadIcon2, { fontSize: "xlarge", color: "secondary" }),
632
642
  /* @__PURE__ */ jsx3(Typography2, { variant: "subtitle2", fontWeight: "700", children: "Drag and Drop Files Here" }),
@@ -770,15 +780,11 @@ var DialogContent = (_a) => {
770
780
  return /* @__PURE__ */ jsx7(MuiDialogContent, __spreadProps(__spreadValues({}, rest), { children }));
771
781
  };
772
782
 
773
- // ../dialog/src/lib/DialogContentText.tsx
774
- import MuiDialogContentText from "@mui/material/DialogContentText";
775
- import { jsx as jsx8 } from "react/jsx-runtime";
776
-
777
783
  // ../dialog/src/lib/DialogTitle.tsx
778
784
  import MuiDialogTitle from "@mui/material/DialogTitle";
779
785
  import { AlertIcons } from "@availity/mui-alert";
780
786
  import { styled as styled3 } from "@mui/material/styles";
781
- import { jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
787
+ import { jsx as jsx8, jsxs as jsxs6 } from "react/jsx-runtime";
782
788
  var AlertIcon = styled3("div", {
783
789
  name: "MuiDialogTitle",
784
790
  slot: "AvIcon",
@@ -792,7 +798,7 @@ var AlertIcon = styled3("div", {
792
798
  var DialogTitle = (_a) => {
793
799
  var _b = _a, { children, component = "h2", icon, variant = "h5" } = _b, rest = __objRest(_b, ["children", "component", "icon", "variant"]);
794
800
  return /* @__PURE__ */ jsxs6(MuiDialogTitle, __spreadProps(__spreadValues({ component, variant }, rest), { children: [
795
- icon ? /* @__PURE__ */ jsx9(AlertIcon, { children: AlertIcons[icon] }) : null,
801
+ icon ? /* @__PURE__ */ jsx8(AlertIcon, { children: AlertIcons[icon] }) : null,
796
802
  children
797
803
  ] }));
798
804
  };
@@ -816,7 +822,7 @@ import {
816
822
  } from "@availity/mui-form-utils";
817
823
  import { Grid } from "@availity/mui-layout";
818
824
  import { Typography as Typography3 } from "@availity/mui-typography";
819
- import { Fragment as Fragment5, jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
825
+ import { Fragment as Fragment5, jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
820
826
  var TextFieldFormHelperText = (_a) => {
821
827
  var _b = _a, {
822
828
  charCount,
@@ -831,15 +837,15 @@ var TextFieldFormHelperText = (_a) => {
831
837
  ]);
832
838
  if (showCharacterCount) {
833
839
  return /* @__PURE__ */ jsxs7(Grid, { container: true, justifyContent: "space-between", flexWrap: "nowrap", children: [
834
- /* @__PURE__ */ jsx10(FormHelperText, __spreadProps(__spreadValues({}, FormHelperTextProps2), { sx: { marginRight: "12px" }, children: helperText })),
840
+ /* @__PURE__ */ jsx9(FormHelperText, __spreadProps(__spreadValues({}, FormHelperTextProps2), { sx: { marginRight: "12px" }, children: helperText })),
835
841
  /* @__PURE__ */ jsxs7(Typography3, { variant: "caption", marginTop: "4px", lineHeight: "1.25rem", children: [
836
- /* @__PURE__ */ jsx10(Typography3, { component: "span", variant: "inherit", color: charCount > maxLength ? "error" : "textPrimary", children: charCount || 0 }),
842
+ /* @__PURE__ */ jsx9(Typography3, { component: "span", variant: "inherit", color: charCount > maxLength ? "error" : "textPrimary", children: charCount || 0 }),
837
843
  "/",
838
844
  maxLength
839
845
  ] })
840
846
  ] });
841
847
  }
842
- return /* @__PURE__ */ jsx10(FormHelperText, __spreadProps(__spreadValues({}, FormHelperTextProps2), { children: helperText }));
848
+ return /* @__PURE__ */ jsx9(FormHelperText, __spreadProps(__spreadValues({}, FormHelperTextProps2), { children: helperText }));
843
849
  };
844
850
  var TextField = forwardRef((props, ref) => {
845
851
  var _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
@@ -871,14 +877,14 @@ var TextField = forwardRef((props, ref) => {
871
877
  const maxLength = (inputProps == null ? void 0 : inputProps.maxLength) || ((_c = (_b = rest.slotProps) == null ? void 0 : _b.htmlInput) == null ? void 0 : _c.maxLength);
872
878
  const allReadOnly = (InputProps2 == null ? void 0 : InputProps2.readOnly) || (inputProps == null ? void 0 : inputProps.readOnly) || ((_e = (_d = rest.slotProps) == null ? void 0 : _d.htmlInput) == null ? void 0 : _e.readOnly) || ((_g = (_f = rest.slotProps) == null ? void 0 : _f.input) == null ? void 0 : _g.readOnly);
873
879
  const resolvedProps = (props2) => !props2 || Object.keys(props2).length === 0 ? void 0 : props2;
874
- return /* @__PURE__ */ jsx10(
880
+ return /* @__PURE__ */ jsx9(
875
881
  MuiTextField,
876
882
  __spreadProps(__spreadValues({}, rest), {
877
883
  onChange: (event) => {
878
884
  setCharCount(event.target.value.length);
879
885
  if (rest.onChange) rest.onChange(event);
880
886
  },
881
- helperText: helperText || /* @__PURE__ */ jsx10(Fragment5, {}),
887
+ helperText: helperText || /* @__PURE__ */ jsx9(Fragment5, {}),
882
888
  slots: { formHelperText: TextFieldFormHelperText },
883
889
  slotProps: {
884
890
  input: resolvedProps(__spreadProps(__spreadValues(__spreadValues(__spreadValues({}, InputProps2), InputPropOverrides), (_h = rest.slotProps) == null ? void 0 : _h.input), {
@@ -911,7 +917,7 @@ var TextField = forwardRef((props, ref) => {
911
917
  });
912
918
 
913
919
  // src/lib/UploadProgressBar.tsx
914
- import { jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
920
+ import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
915
921
  var ERROR_MAPPINGS = [
916
922
  {
917
923
  pattern: /but has an extension for/i,
@@ -967,17 +973,17 @@ var UploadProgressBar = ({ upload, onProgress, onError, onSuccess }) => {
967
973
  slotProps: { primary: { color: "text.error", variant: "body2", component: "div" } },
968
974
  sx: { wordWrap: "break-word" },
969
975
  children: [
970
- /* @__PURE__ */ jsx11(WarningTriangleIcon, { sx: { verticalAlign: "middle", mt: "-2px" } }),
976
+ /* @__PURE__ */ jsx10(WarningTriangleIcon, { sx: { verticalAlign: "middle", mt: "-2px" } }),
971
977
  " ",
972
978
  errorMessage
973
979
  ]
974
980
  }
975
981
  ),
976
982
  upload.status === "encrypted" && /* @__PURE__ */ jsxs8("div", { className: "pwRequired", children: [
977
- /* @__PURE__ */ jsx11(Button2, { color: "secondary", size: "small", onClick: toggleModal, children: "Enter Password" }),
978
- /* @__PURE__ */ jsx11(Dialog, { open: modalOpen, onClose: toggleModal, children: /* @__PURE__ */ jsxs8("form", { onSubmit: verifyPassword, children: [
979
- /* @__PURE__ */ jsx11(DialogTitle, { children: "Enter Password" }),
980
- /* @__PURE__ */ jsx11(DialogContent, { children: /* @__PURE__ */ jsx11(
983
+ /* @__PURE__ */ jsx10(Button2, { color: "secondary", size: "small", onClick: toggleModal, children: "Enter Password" }),
984
+ /* @__PURE__ */ jsx10(Dialog, { open: modalOpen, onClose: toggleModal, children: /* @__PURE__ */ jsxs8("form", { onSubmit: verifyPassword, children: [
985
+ /* @__PURE__ */ jsx10(DialogTitle, { children: "Enter Password" }),
986
+ /* @__PURE__ */ jsx10(DialogContent, { children: /* @__PURE__ */ jsx10(
981
987
  TextField,
982
988
  {
983
989
  type: showPassword ? "text" : "password",
@@ -986,22 +992,22 @@ var UploadProgressBar = ({ upload, onProgress, onError, onSuccess }) => {
986
992
  onChange: handlePasswordChange,
987
993
  autoFocus: true,
988
994
  InputProps: {
989
- endAdornment: /* @__PURE__ */ jsx11(InputAdornment, { position: "end", children: /* @__PURE__ */ jsx11(
995
+ endAdornment: /* @__PURE__ */ jsx10(InputAdornment, { position: "end", children: /* @__PURE__ */ jsx10(
990
996
  IconButton2,
991
997
  {
992
998
  title: "password visibility",
993
999
  onClick: () => setShowPassword((prev) => !prev),
994
1000
  edge: "end",
995
- children: showPassword ? /* @__PURE__ */ jsx11(EyeIcon, { fontSize: "small" }) : /* @__PURE__ */ jsx11(EyeSlashIcon, { fontSize: "small" })
1001
+ children: showPassword ? /* @__PURE__ */ jsx10(EyeIcon, { fontSize: "small" }) : /* @__PURE__ */ jsx10(EyeSlashIcon, { fontSize: "small" })
996
1002
  }
997
1003
  ) })
998
1004
  }
999
1005
  }
1000
1006
  ) }),
1001
- /* @__PURE__ */ jsx11(DialogActions, { children: /* @__PURE__ */ jsx11(Button2, { color: "primary", type: "submit", children: "Ok" }) })
1007
+ /* @__PURE__ */ jsx10(DialogActions, { children: /* @__PURE__ */ jsx10(Button2, { color: "primary", type: "submit", children: "Ok" }) })
1002
1008
  ] }) })
1003
1009
  ] })
1004
- ] }) : /* @__PURE__ */ jsx11(LinearProgress, { value: statePercentage, "aria-label": `${upload.file.name}-progress` });
1010
+ ] }) : /* @__PURE__ */ jsx10(LinearProgress, { value: statePercentage, "aria-label": `${upload.file.name}-progress` });
1005
1011
  };
1006
1012
 
1007
1013
  // src/lib/useUploadCore.tsx
@@ -1032,7 +1038,7 @@ function useUploadCore(file, options, queryOptions) {
1032
1038
  }
1033
1039
 
1034
1040
  // src/lib/FileList.tsx
1035
- import { jsx as jsx12, jsxs as jsxs9 } from "react/jsx-runtime";
1041
+ import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
1036
1042
  var FileRow = ({
1037
1043
  file,
1038
1044
  options,
@@ -1044,12 +1050,12 @@ var FileRow = ({
1044
1050
  const Icon = getFileExtIcon(file.name);
1045
1051
  const { data: upload } = useUploadCore(file, options, queryOptions);
1046
1052
  if (!upload) return null;
1047
- if (CustomRow) return /* @__PURE__ */ jsx12(CustomRow, { upload, options, onRemoveFile });
1053
+ if (CustomRow) return /* @__PURE__ */ jsx11(CustomRow, { upload, options, onRemoveFile });
1048
1054
  return /* @__PURE__ */ jsxs9(
1049
1055
  ListItem2,
1050
1056
  {
1051
1057
  disableGutters: true,
1052
- secondaryAction: !disableRemove && /* @__PURE__ */ jsx12(
1058
+ secondaryAction: !disableRemove && /* @__PURE__ */ jsx11(
1053
1059
  IconButton3,
1054
1060
  {
1055
1061
  title: "remove file",
@@ -1057,17 +1063,17 @@ var FileRow = ({
1057
1063
  onClick: () => {
1058
1064
  onRemoveFile(upload.id, upload);
1059
1065
  },
1060
- children: /* @__PURE__ */ jsx12(DeleteIcon, {})
1066
+ children: /* @__PURE__ */ jsx11(DeleteIcon, {})
1061
1067
  }
1062
1068
  ),
1063
1069
  children: [
1064
1070
  /* @__PURE__ */ jsxs9(Grid2, { container: true, spacing: 2, alignItems: "center", justifyContent: "space-between", width: "100%", flexWrap: "wrap", children: [
1065
- /* @__PURE__ */ jsx12(Grid2, { size: { xs: "auto" }, children: /* @__PURE__ */ jsx12(ListItemIcon, { sx: { minWidth: "1.5rem" }, children: /* @__PURE__ */ jsx12(Icon, {}) }) }),
1066
- /* @__PURE__ */ jsx12(Grid2, { size: { xs: 4 }, sx: { minWidth: "8rem" }, children: /* @__PURE__ */ jsx12(ListItemText2, { sx: { wordBreak: "break-all" }, children: upload.trimFileName(upload.file.name) }) }),
1067
- /* @__PURE__ */ jsx12(Grid2, { size: { xs: 2 }, sx: { minWidth: "3rem" }, children: /* @__PURE__ */ jsx12(ListItemText2, { sx: { textAlign: "end" }, children: formatBytes(upload.file.size) }) }),
1068
- /* @__PURE__ */ jsx12(Grid2, { size: { xs: "grow" }, sx: { minWidth: "6rem" }, children: /* @__PURE__ */ jsx12(UploadProgressBar, { upload }) })
1071
+ /* @__PURE__ */ jsx11(Grid2, { size: { xs: "auto" }, children: /* @__PURE__ */ jsx11(ListItemIcon, { sx: { minWidth: "1.5rem" }, children: /* @__PURE__ */ jsx11(Icon, {}) }) }),
1072
+ /* @__PURE__ */ jsx11(Grid2, { size: { xs: 4 }, sx: { minWidth: "8rem" }, children: /* @__PURE__ */ jsx11(ListItemText2, { sx: { wordBreak: "break-all" }, children: upload.trimFileName(upload.file.name) }) }),
1073
+ /* @__PURE__ */ jsx11(Grid2, { size: { xs: 2 }, sx: { minWidth: "3rem" }, children: /* @__PURE__ */ jsx11(ListItemText2, { sx: { textAlign: "end" }, children: formatBytes(upload.file.size) }) }),
1074
+ /* @__PURE__ */ jsx11(Grid2, { size: { xs: "grow" }, sx: { minWidth: "6rem" }, children: /* @__PURE__ */ jsx11(UploadProgressBar, { upload }) })
1069
1075
  ] }),
1070
- /* @__PURE__ */ jsx12(Divider3, {})
1076
+ /* @__PURE__ */ jsx11(Divider3, {})
1071
1077
  ]
1072
1078
  }
1073
1079
  );
@@ -1081,8 +1087,8 @@ var FileList = ({
1081
1087
  disableRemove
1082
1088
  }) => {
1083
1089
  if (files.length === 0) return null;
1084
- return /* @__PURE__ */ jsx12(List2, { children: files.map((file) => {
1085
- return /* @__PURE__ */ jsx12(
1090
+ return /* @__PURE__ */ jsx11(List2, { children: files.map((file) => {
1091
+ return /* @__PURE__ */ jsx11(
1086
1092
  FileRow,
1087
1093
  {
1088
1094
  file,
@@ -1103,7 +1109,7 @@ import { IconButton as IconButton4 } from "@availity/mui-button";
1103
1109
  import { DeleteIcon as DeleteIcon2 } from "@availity/mui-icon";
1104
1110
  import { Grid as Grid3 } from "@availity/mui-layout";
1105
1111
  import { Divider as Divider4 } from "@availity/mui-divider";
1106
- import { jsx as jsx13, jsxs as jsxs10 } from "react/jsx-runtime";
1112
+ import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
1107
1113
  var FileRow2 = ({
1108
1114
  upload,
1109
1115
  options,
@@ -1113,12 +1119,12 @@ var FileRow2 = ({
1113
1119
  }) => {
1114
1120
  const Icon = getFileExtIcon(upload.file.name);
1115
1121
  if (!upload) return null;
1116
- if (CustomRow) return /* @__PURE__ */ jsx13(CustomRow, { upload, options, onRemoveFile });
1122
+ if (CustomRow) return /* @__PURE__ */ jsx12(CustomRow, { upload, options, onRemoveFile });
1117
1123
  return /* @__PURE__ */ jsxs10(
1118
1124
  ListItem3,
1119
1125
  {
1120
1126
  disableGutters: true,
1121
- secondaryAction: !disableRemove && /* @__PURE__ */ jsx13(
1127
+ secondaryAction: !disableRemove && /* @__PURE__ */ jsx12(
1122
1128
  IconButton4,
1123
1129
  {
1124
1130
  title: "remove file",
@@ -1126,17 +1132,17 @@ var FileRow2 = ({
1126
1132
  onClick: () => {
1127
1133
  onRemoveFile(upload.id, upload);
1128
1134
  },
1129
- children: /* @__PURE__ */ jsx13(DeleteIcon2, {})
1135
+ children: /* @__PURE__ */ jsx12(DeleteIcon2, {})
1130
1136
  }
1131
1137
  ),
1132
1138
  children: [
1133
1139
  /* @__PURE__ */ jsxs10(Grid3, { container: true, spacing: 2, alignItems: "center", justifyContent: "space-between", width: "100%", flexWrap: "wrap", children: [
1134
- /* @__PURE__ */ jsx13(Grid3, { size: { xs: "auto" }, children: /* @__PURE__ */ jsx13(ListItemIcon2, { sx: { minWidth: "1.5rem" }, children: /* @__PURE__ */ jsx13(Icon, {}) }) }),
1135
- /* @__PURE__ */ jsx13(Grid3, { size: { xs: 4 }, sx: { minWidth: "8rem" }, children: /* @__PURE__ */ jsx13(ListItemText3, { sx: { wordBreak: "break-all" }, children: upload.trimFileName(upload.file.name) }) }),
1136
- /* @__PURE__ */ jsx13(Grid3, { size: { xs: 2 }, sx: { minWidth: "3rem" }, children: /* @__PURE__ */ jsx13(ListItemText3, { sx: { textAlign: "end" }, children: formatBytes(upload.file.size) }) }),
1137
- /* @__PURE__ */ jsx13(Grid3, { size: { xs: "grow" }, sx: { minWidth: "6rem" }, children: /* @__PURE__ */ jsx13(UploadProgressBar, { upload }) })
1140
+ /* @__PURE__ */ jsx12(Grid3, { size: { xs: "auto" }, children: /* @__PURE__ */ jsx12(ListItemIcon2, { sx: { minWidth: "1.5rem" }, children: /* @__PURE__ */ jsx12(Icon, {}) }) }),
1141
+ /* @__PURE__ */ jsx12(Grid3, { size: { xs: 4 }, sx: { minWidth: "8rem" }, children: /* @__PURE__ */ jsx12(ListItemText3, { sx: { wordBreak: "break-all" }, children: upload.trimFileName(upload.file.name) }) }),
1142
+ /* @__PURE__ */ jsx12(Grid3, { size: { xs: 2 }, sx: { minWidth: "3rem" }, children: /* @__PURE__ */ jsx12(ListItemText3, { sx: { textAlign: "end" }, children: formatBytes(upload.file.size) }) }),
1143
+ /* @__PURE__ */ jsx12(Grid3, { size: { xs: "grow" }, sx: { minWidth: "6rem" }, children: /* @__PURE__ */ jsx12(UploadProgressBar, { upload }) })
1138
1144
  ] }),
1139
- /* @__PURE__ */ jsx13(Divider4, {})
1145
+ /* @__PURE__ */ jsx12(Divider4, {})
1140
1146
  ]
1141
1147
  }
1142
1148
  );
@@ -1149,8 +1155,8 @@ var FileList2 = ({
1149
1155
  disableRemove
1150
1156
  }) => {
1151
1157
  if (uploads.length === 0) return null;
1152
- return /* @__PURE__ */ jsx13(List3, { children: uploads.map((upload) => {
1153
- return /* @__PURE__ */ jsx13(
1158
+ return /* @__PURE__ */ jsx12(List3, { children: uploads.map((upload) => {
1159
+ return /* @__PURE__ */ jsx12(
1154
1160
  FileRow2,
1155
1161
  {
1156
1162
  upload,
@@ -1209,7 +1215,7 @@ var HeaderMessage = ({ maxFiles, maxSize, maxTotalSize }) => {
1209
1215
  };
1210
1216
 
1211
1217
  // src/lib/FileSelector.tsx
1212
- import { Fragment as Fragment6, jsx as jsx14, jsxs as jsxs13 } from "react/jsx-runtime";
1218
+ import { Fragment as Fragment6, jsx as jsx13, jsxs as jsxs13 } from "react/jsx-runtime";
1213
1219
  var CLOUD_URL = "/cloud/web/appl/vault/upload/v1/resumable";
1214
1220
  var FileSelector = ({
1215
1221
  name,
@@ -1284,8 +1290,8 @@ var FileSelector = ({
1284
1290
  );
1285
1291
  return /* @__PURE__ */ jsxs13(Fragment6, { children: [
1286
1292
  enableDropArea ? /* @__PURE__ */ jsxs13(Fragment6, { children: [
1287
- label ? /* @__PURE__ */ jsx14(Typography6, { marginBottom: "4px", children: label }) : null,
1288
- /* @__PURE__ */ jsx14(
1293
+ label ? /* @__PURE__ */ jsx13(Typography6, { marginBottom: "4px", children: label }) : null,
1294
+ /* @__PURE__ */ jsx13(
1289
1295
  Dropzone,
1290
1296
  {
1291
1297
  name,
@@ -1304,7 +1310,7 @@ var FileSelector = ({
1304
1310
  validator
1305
1311
  }
1306
1312
  ),
1307
- /* @__PURE__ */ jsx14(
1313
+ /* @__PURE__ */ jsx13(
1308
1314
  FileTypesMessage,
1309
1315
  {
1310
1316
  allowedFileTypes,
@@ -1319,8 +1325,8 @@ var FileSelector = ({
1319
1325
  children
1320
1326
  ] }) : /* @__PURE__ */ jsxs13(Grid4, { container: true, rowSpacing: 3, flexDirection: "column", children: [
1321
1327
  /* @__PURE__ */ jsxs13(Grid4, { children: [
1322
- /* @__PURE__ */ jsx14(HeaderMessage, { maxFiles, maxSize, maxTotalSize }),
1323
- /* @__PURE__ */ jsx14(
1328
+ /* @__PURE__ */ jsx13(HeaderMessage, { maxFiles, maxSize, maxTotalSize }),
1329
+ /* @__PURE__ */ jsx13(
1324
1330
  FileTypesMessage,
1325
1331
  {
1326
1332
  allowedFileTypes,
@@ -1331,8 +1337,8 @@ var FileSelector = ({
1331
1337
  }
1332
1338
  )
1333
1339
  ] }),
1334
- children ? /* @__PURE__ */ jsx14(Grid4, { children }) : null,
1335
- /* @__PURE__ */ jsx14(Grid4, { children: /* @__PURE__ */ jsx14(
1340
+ children ? /* @__PURE__ */ jsx13(Grid4, { children }) : null,
1341
+ /* @__PURE__ */ jsx13(Grid4, { children: /* @__PURE__ */ jsx13(
1336
1342
  Dropzone,
1337
1343
  {
1338
1344
  name,
@@ -1358,14 +1364,14 @@ var FileSelector = ({
1358
1364
  severity: "error",
1359
1365
  onClose: () => tooManyFilesRejections.forEach((rejection) => handleRemoveRejection(rejection.id)),
1360
1366
  children: [
1361
- /* @__PURE__ */ jsx14(AlertTitle2, { children: "Items not allowed." }),
1367
+ /* @__PURE__ */ jsx13(AlertTitle2, { children: "Items not allowed." }),
1362
1368
  "Too many files are selected for upload, maximum ",
1363
1369
  maxFiles,
1364
1370
  " allowed."
1365
1371
  ]
1366
1372
  }
1367
1373
  ),
1368
- otherRejections.length > 0 && otherRejections.map((rejection) => /* @__PURE__ */ jsx14(
1374
+ otherRejections.length > 0 && otherRejections.map((rejection) => /* @__PURE__ */ jsx13(
1369
1375
  ErrorAlert,
1370
1376
  {
1371
1377
  errors: rejection.errors,
@@ -1375,7 +1381,7 @@ var FileSelector = ({
1375
1381
  },
1376
1382
  rejection.id
1377
1383
  )),
1378
- /* @__PURE__ */ jsx14(
1384
+ /* @__PURE__ */ jsx13(
1379
1385
  FileList,
1380
1386
  {
1381
1387
  files: files || [],
@@ -1395,7 +1401,7 @@ import { useFormContext as useFormContext4 } from "react-hook-form";
1395
1401
  import { Grid as Grid5 } from "@availity/mui-layout";
1396
1402
  import { Typography as Typography7 } from "@availity/mui-typography";
1397
1403
  import { Alert as Alert3, AlertTitle as AlertTitle3 } from "@availity/mui-alert";
1398
- import { Fragment as Fragment7, jsx as jsx15, jsxs as jsxs14 } from "react/jsx-runtime";
1404
+ import { Fragment as Fragment7, jsx as jsx14, jsxs as jsxs14 } from "react/jsx-runtime";
1399
1405
  var FileSelector2 = ({
1400
1406
  name,
1401
1407
  allowedFileNameCharacters,
@@ -1466,8 +1472,8 @@ var FileSelector2 = ({
1466
1472
  );
1467
1473
  return /* @__PURE__ */ jsxs14(Fragment7, { children: [
1468
1474
  enableDropArea ? /* @__PURE__ */ jsxs14(Fragment7, { children: [
1469
- label ? /* @__PURE__ */ jsx15(Typography7, { marginBottom: "4px", children: label }) : null,
1470
- /* @__PURE__ */ jsx15(
1475
+ label ? /* @__PURE__ */ jsx14(Typography7, { marginBottom: "4px", children: label }) : null,
1476
+ /* @__PURE__ */ jsx14(
1471
1477
  Dropzone2,
1472
1478
  {
1473
1479
  name,
@@ -1486,7 +1492,7 @@ var FileSelector2 = ({
1486
1492
  validator
1487
1493
  }
1488
1494
  ),
1489
- /* @__PURE__ */ jsx15(
1495
+ /* @__PURE__ */ jsx14(
1490
1496
  FileTypesMessage,
1491
1497
  {
1492
1498
  allowedFileTypes,
@@ -1501,8 +1507,8 @@ var FileSelector2 = ({
1501
1507
  children
1502
1508
  ] }) : /* @__PURE__ */ jsxs14(Grid5, { container: true, rowSpacing: 3, flexDirection: "column", children: [
1503
1509
  /* @__PURE__ */ jsxs14(Grid5, { children: [
1504
- /* @__PURE__ */ jsx15(HeaderMessage, { maxFiles, maxSize, maxTotalSize }),
1505
- /* @__PURE__ */ jsx15(
1510
+ /* @__PURE__ */ jsx14(HeaderMessage, { maxFiles, maxSize, maxTotalSize }),
1511
+ /* @__PURE__ */ jsx14(
1506
1512
  FileTypesMessage,
1507
1513
  {
1508
1514
  allowedFileTypes,
@@ -1513,8 +1519,8 @@ var FileSelector2 = ({
1513
1519
  }
1514
1520
  )
1515
1521
  ] }),
1516
- children ? /* @__PURE__ */ jsx15(Grid5, { children }) : null,
1517
- /* @__PURE__ */ jsx15(Grid5, { children: /* @__PURE__ */ jsx15(
1522
+ children ? /* @__PURE__ */ jsx14(Grid5, { children }) : null,
1523
+ /* @__PURE__ */ jsx14(Grid5, { children: /* @__PURE__ */ jsx14(
1518
1524
  Dropzone2,
1519
1525
  {
1520
1526
  name,
@@ -1540,14 +1546,14 @@ var FileSelector2 = ({
1540
1546
  severity: "error",
1541
1547
  onClose: () => tooManyFilesRejections.forEach((rejection) => handleRemoveRejection(rejection.id)),
1542
1548
  children: [
1543
- /* @__PURE__ */ jsx15(AlertTitle3, { children: "Items not allowed." }),
1549
+ /* @__PURE__ */ jsx14(AlertTitle3, { children: "Items not allowed." }),
1544
1550
  "Too many files are selected for upload, maximum ",
1545
1551
  maxFiles,
1546
1552
  " allowed."
1547
1553
  ]
1548
1554
  }
1549
1555
  ),
1550
- otherRejections.length > 0 && otherRejections.map((rejection) => /* @__PURE__ */ jsx15(
1556
+ otherRejections.length > 0 && otherRejections.map((rejection) => /* @__PURE__ */ jsx14(
1551
1557
  ErrorAlert,
1552
1558
  {
1553
1559
  errors: rejection.errors,
@@ -1557,7 +1563,7 @@ var FileSelector2 = ({
1557
1563
  },
1558
1564
  rejection.id
1559
1565
  )),
1560
- /* @__PURE__ */ jsx15(
1566
+ /* @__PURE__ */ jsx14(
1561
1567
  FileList2,
1562
1568
  {
1563
1569
  uploads: uploads || [],
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@availity/mui-file-selector",
3
- "version": "1.8.1",
3
+ "version": "1.9.1",
4
4
  "description": "Availity MUI file-selector Component - part of the @availity/element design system",
5
5
  "keywords": [
6
6
  "react",
@@ -41,15 +41,15 @@
41
41
  },
42
42
  "dependencies": {
43
43
  "@availity/api-axios": "^11.0.0",
44
- "@availity/mui-alert": "^1.0.6",
45
- "@availity/mui-button": "^1.1.4",
46
- "@availity/mui-divider": "^1.0.2",
47
- "@availity/mui-form-utils": "^1.3.2",
48
- "@availity/mui-icon": "^1.1.0",
49
- "@availity/mui-layout": "^1.0.2",
50
- "@availity/mui-list": "^1.0.7",
51
- "@availity/mui-progress": "^1.0.3",
52
- "@availity/mui-typography": "^1.0.2",
44
+ "@availity/mui-alert": "^1.0.7",
45
+ "@availity/mui-button": "^1.1.5",
46
+ "@availity/mui-divider": "^1.0.3",
47
+ "@availity/mui-form-utils": "^1.3.3",
48
+ "@availity/mui-icon": "^1.1.1",
49
+ "@availity/mui-layout": "^1.0.3",
50
+ "@availity/mui-list": "^1.0.8",
51
+ "@availity/mui-progress": "^1.0.4",
52
+ "@availity/mui-typography": "^1.0.3",
53
53
  "@availity/upload-core": "^8.0.0",
54
54
  "@tanstack/react-query": "^4.36.1",
55
55
  "react-dropzone": "^11.7.1",
@@ -58,7 +58,7 @@
58
58
  "uuid": "^9.0.1"
59
59
  },
60
60
  "devDependencies": {
61
- "@availity/mui-paper": "^1.0.2",
61
+ "@availity/mui-paper": "^1.0.3",
62
62
  "@mui/material": "^6.4.5",
63
63
  "react": "18.2.0",
64
64
  "react-dom": "18.2.0",
@@ -71,5 +71,6 @@
71
71
  },
72
72
  "publishConfig": {
73
73
  "access": "public"
74
- }
74
+ },
75
+ "sideEffects": false
75
76
  }
package/src/lib/Dropzone.tsx CHANGED
@@ -153,12 +153,12 @@ export const Dropzone = ({
153
153
  message: `Too many files. You may only upload ${maxFiles} file(s).`,
154
154
  });
155
155
  }
156
-
156
+
157
157
  // Check for allowed file name characters
158
158
  if (allowedFileNameCharacters) {
159
159
  const fileName = file.name.substring(0, file.name.lastIndexOf('.'));
160
160
  const regExp = new RegExp(`([^${allowedFileNameCharacters}])`, 'g');
161
-
161
+
162
162
  if (fileName.match(regExp) !== null) {
163
163
  errors.push({
164
164
  code: 'invalid-file-name-characters',
@@ -166,15 +166,15 @@ export const Dropzone = ({
166
166
  });
167
167
  }
168
168
  }
169
-
169
+
170
170
  // Explicit check for allowed file types
171
171
  if (allowedFileTypes.length > 0) {
172
172
  const fileName = file.name;
173
173
  const fileExt = fileName.substring(fileName.lastIndexOf('.')).toLowerCase();
174
-
174
+
175
175
  // Convert all file types to lowercase for comparison
176
- const lowerCaseAllowedTypes = allowedFileTypes.map(type => type.toLowerCase());
177
-
176
+ const lowerCaseAllowedTypes = allowedFileTypes.map((type) => type.toLowerCase());
177
+
178
178
  if (!lowerCaseAllowedTypes.includes(fileExt)) {
179
179
  errors.push({
180
180
  code: 'file-invalid-type',
@@ -344,7 +344,15 @@ export const Dropzone = ({
344
344
  return field[name] || [];
345
345
  };
346
346
 
347
- const hasFiles = getFieldValue().length > 0;
347
+ const currentFileCount = getFieldValue().length;
348
+
349
+ const hasFiles = currentFileCount > 0;
350
+
351
+ const isMaxFilesReached = maxFiles && currentFileCount >= maxFiles;
352
+
353
+ if (isMaxFilesReached) {
354
+ disabled = true;
355
+ }
348
356
 
349
357
  return enableDropArea ? (
350
358
  <DropzoneContainer sx={outerBoxStyles} {...rootProps}>
package/src/lib/Dropzone2.tsx CHANGED
@@ -94,12 +94,12 @@ export const Dropzone2 = ({
94
94
  message: `Too many files. You may only upload ${maxFiles} file(s).`,
95
95
  });
96
96
  }
97
-
97
+
98
98
  // Check for allowed file name characters
99
99
  if (uploadOptions.allowedFileNameCharacters) {
100
100
  const fileName = file.name.substring(0, file.name.lastIndexOf('.'));
101
101
  const regExp = new RegExp(`([^${uploadOptions.allowedFileNameCharacters}])`, 'g');
102
-
102
+
103
103
  if (fileName.match(regExp) !== null) {
104
104
  errors.push({
105
105
  code: 'invalid-file-name-characters',
@@ -107,15 +107,15 @@ export const Dropzone2 = ({
107
107
  });
108
108
  }
109
109
  }
110
-
110
+
111
111
  // Explicit check for allowed file types
112
112
  if (allowedFileTypes.length > 0) {
113
113
  const fileName = file.name;
114
114
  const fileExt = fileName.substring(fileName.lastIndexOf('.')).toLowerCase();
115
-
115
+
116
116
  // Convert all file types to lowercase for comparison
117
- const lowerCaseAllowedTypes = allowedFileTypes.map(type => type.toLowerCase());
118
-
117
+ const lowerCaseAllowedTypes = allowedFileTypes.map((type) => type.toLowerCase());
118
+
119
119
  if (!lowerCaseAllowedTypes.includes(fileExt)) {
120
120
  errors.push({
121
121
  code: 'file-invalid-type',
@@ -284,7 +284,15 @@ export const Dropzone2 = ({
284
284
  return field[name] || [];
285
285
  };
286
286
 
287
- const hasFiles = getFieldValue().length > 0;
287
+ const currentFileCount = getFieldValue().length;
288
+
289
+ const hasFiles = currentFileCount > 0;
290
+
291
+ const isMaxFilesReached = maxFiles && currentFileCount >= maxFiles;
292
+
293
+ if (isMaxFilesReached) {
294
+ disabled = true;
295
+ }
288
296
 
289
297
  return enableDropArea ? (
290
298
  <DropzoneContainer sx={outerBoxStyles} {...rootProps}>