@availity/mui-file-selector 1.7.1 → 1.8.1

package/CHANGELOG.md

@@ -2,6 +2,27 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+## [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)
+
+
+### Bug Fixes
+
+* **mui-file-selector:** ensure allowedFileTypes and allowedFileNameCharacters validation ([bb0f3ea](https://github.com/Availity/element/commit/bb0f3eaa1dcab2e82f5037f534e959321366701a))
+
+## [1.8.0](https://github.com/Availity/element/compare/@availity/mui-file-selector@1.7.1...@availity/mui-file-selector@1.8.0) (2025-06-16)
+
+
+### Features
+
+* **mui-file-selector:** add maxTotalSize check to FileSelector ([03f78d6](https://github.com/Availity/element/commit/03f78d674243a76cc6d3e65a20b6e8ce3a46b8ca))
+* **mui-file-selector:** add maxTotalSize check to FileSelector ([802e2ae](https://github.com/Availity/element/commit/802e2ae502aa8727037e2998849acf01a6ea0382))
+* **mui-file-selector:** add maxTotalSize check to FileSelector2 ([ccd0cfa](https://github.com/Availity/element/commit/ccd0cfa95610d6e354402a3fa698b63b6659644c))
+
+
+### Bug Fixes
+
+* **mui-file-selector:** ensure only the maximum amount of files are uploaded ([5d80d2b](https://github.com/Availity/element/commit/5d80d2b046ea928ea432d7f269d1bfc99dd43782))
+
 ## [1.7.1](https://github.com/Availity/element/compare/@availity/mui-file-selector@1.7.0...@availity/mui-file-selector@1.7.1) (2025-05-30)
 
 

package/dist/index.d.mts

@@ -38,6 +38,11 @@ type DropzoneProps = {
      * List of allowed file extensions (e.g. ['.pdf', '.doc']). Each extension must start with a dot
      */
     allowedFileTypes?: `.${string}`[];
+    /**
+     * Regular expression pattern of allowed characters in file names
+     * @example "a-zA-Z0-9-_."
+     */
+    allowedFileNameCharacters?: string;
     /**
      * Whether the dropzone is disabled
      */
@@ -54,6 +59,10 @@ type DropzoneProps = {
      * Maximum size of each file in bytes
      */
     maxSize?: number;
+    /**
+     * Maximum size of total upload in bytes
+     */
+    maxTotalSize?: number;
     /**
      * Whether multiple file selection is allowed
      */
@@ -88,7 +97,7 @@ type DropzoneProps = {
     validator?: (file: File) => FileError | FileError[] | null;
 };
 declare const DropzoneContainer: typeof MuiBox;
-declare const Dropzone: ({ allowedFileTypes, disabled, enableDropArea, maxFiles, maxSize, multiple, name, onChange, onClick, onDrop, setFileRejections, setTotalSize, validator, }: DropzoneProps) => react_jsx_runtime.JSX.Element;
+declare const Dropzone: ({ allowedFileTypes, allowedFileNameCharacters, disabled, enableDropArea, maxFiles, maxSize, maxTotalSize, multiple, name, onChange, onClick, onDrop, setFileRejections, setTotalSize, validator, }: DropzoneProps) => react_jsx_runtime.JSX.Element;
 
 type Dropzone2Props = DropzoneProps & {
     uploadOptions: UploadOptions;
@@ -101,7 +110,7 @@ type Dropzone2Props = DropzoneProps & {
  * `<Dropzone2 />` adds the `uploadOptions` prop that previously existed on
  * `<FileSelector />`.
  */
-declare const Dropzone2: ({ allowedFileTypes, disabled, enableDropArea, maxFiles, maxSize, multiple, name, onChange, onClick, onDrop, setFileRejections, setTotalSize, uploadOptions, validator, }: Dropzone2Props) => react_jsx_runtime.JSX.Element;
+declare const Dropzone2: ({ allowedFileTypes, disabled, enableDropArea, maxFiles, maxSize, maxTotalSize, multiple, name, onChange, onClick, onDrop, setFileRejections, setTotalSize, uploadOptions, validator, }: Dropzone2Props) => react_jsx_runtime.JSX.Element;
 
 type ErrorAlertProps = {
     /**
@@ -268,6 +277,10 @@ type FileSelectorProps = {
      * Overrides the standard file size message
      */
     customSizeMessage?: React.ReactNode;
+    /**
+     * Overrides the standard total upload size message
+     */
+    customTotalSizeMessage?: React.ReactNode;
     /**
      * Overrides the standard file types message
      */
@@ -307,6 +320,11 @@ type FileSelectorProps = {
      * Use Kibi or Mibibytes. eg: 1kb = 1024 bytes; 1mb = 1024kb
      */
     maxSize: number;
+    /**
+     * Maximum size allowed for total upload in bytes
+     * Use Kibi or Mibibytes. eg: 1kb = 1024 bytes; 1mb = 1024kb
+     */
+    maxTotalSize?: number;
     /**
      * Whether multiple file selection is allowed
      * @default true
@@ -347,7 +365,7 @@ type FileSelectorProps = {
      */
     disableRemove?: boolean;
 };
-declare const FileSelector: ({ name, allowedFileNameCharacters, allowedFileTypes, bucketId, clientId, children, customSizeMessage, customTypesMessage, customerId, customFileRow, disabled, enableDropArea, endpoint, isCloud, label, maxFiles, maxSize, multiple, onChange, onDrop, onUploadRemove, queryOptions, uploadOptions, validator, disableRemove, }: FileSelectorProps) => react_jsx_runtime.JSX.Element;
+declare const FileSelector: ({ name, allowedFileNameCharacters, allowedFileTypes, bucketId, clientId, children, customSizeMessage, customTotalSizeMessage, customTypesMessage, customerId, customFileRow, disabled, enableDropArea, endpoint, isCloud, label, maxFiles, maxSize, maxTotalSize, multiple, onChange, onDrop, onUploadRemove, queryOptions, uploadOptions, validator, disableRemove, }: FileSelectorProps) => react_jsx_runtime.JSX.Element;
 
 type FileSelector2Props = Omit<FileSelectorProps, 'onUploadRemove' | 'queryOptions'> & {
     onUploadRemove?: (uploads: Upload[], removedUploadId: string) => void;
@@ -361,7 +379,7 @@ type FileSelector2Props = Omit<FileSelectorProps, 'onUploadRemove' | 'queryOptio
  * `<FileSelector2 />` removes the reliance on `@tanstack/react-query`. The
  * `Upload` object can now be accessed from the form state.
  */
-declare const FileSelector2: ({ name, allowedFileNameCharacters, allowedFileTypes, bucketId, clientId, children, customSizeMessage, customTypesMessage, customerId, customFileRow, disabled, enableDropArea, endpoint, isCloud, label, maxFiles, maxSize, multiple, onChange, onDrop, onUploadRemove, uploadOptions, validator, disableRemove, }: FileSelector2Props) => react_jsx_runtime.JSX.Element;
+declare const FileSelector2: ({ name, allowedFileNameCharacters, allowedFileTypes, bucketId, clientId, children, customSizeMessage, customTotalSizeMessage, customTypesMessage, customerId, customFileRow, disabled, enableDropArea, endpoint, isCloud, label, maxFiles, maxSize, maxTotalSize, multiple, onChange, onDrop, onUploadRemove, uploadOptions, validator, disableRemove, }: FileSelector2Props) => react_jsx_runtime.JSX.Element;
 
 type FileTypesMessageProps = {
     /**
@@ -372,6 +390,10 @@ type FileTypesMessageProps = {
      * Overrides the standard file size message
      */
     customSizeMessage?: React.ReactNode;
+    /**
+     * Overrides the standard total upload size message
+     */
+    customTotalSizeMessage?: React.ReactNode;
     /**
      * Overrides the standard file types message
      */
@@ -380,9 +402,13 @@ type FileTypesMessageProps = {
      * Maximum size per file in bytes. This will be formatted. eg: 1024 * 20 = 20 KB
      */
     maxFileSize?: number;
+    /**
+     * Maximum size of the total upload in bytes. This will be formatted. eg: 1024 * 20 = 20 KB
+     */
+    maxTotalSize?: number;
     variant?: 'caption' | 'body2';
 };
-declare const FileTypesMessage: ({ allowedFileTypes, customSizeMessage, customTypesMessage, maxFileSize, variant, }: FileTypesMessageProps) => react_jsx_runtime.JSX.Element;
+declare const FileTypesMessage: ({ allowedFileTypes, customSizeMessage, customTotalSizeMessage, customTypesMessage, maxFileSize, maxTotalSize, variant, }: FileTypesMessageProps) => react_jsx_runtime.JSX.Element;
 
 type HeaderMessageProps = {
     /**
@@ -390,11 +416,15 @@ type HeaderMessageProps = {
      */
     maxFiles: number;
     /**
-     * Maximum combined total size of all files
+     * Maximum size of each file
      */
     maxSize: number;
+    /**
+     * Maximum combined total size of all files
+     */
+    maxTotalSize?: number;
 };
-declare const HeaderMessage: ({ maxFiles, maxSize }: HeaderMessageProps) => react_jsx_runtime.JSX.Element;
+declare const HeaderMessage: ({ maxFiles, maxSize, maxTotalSize }: HeaderMessageProps) => react_jsx_runtime.JSX.Element;
 
 type UploadProgressBarProps = {
     /**

package/dist/index.d.ts

@@ -38,6 +38,11 @@ type DropzoneProps = {
      * List of allowed file extensions (e.g. ['.pdf', '.doc']). Each extension must start with a dot
      */
     allowedFileTypes?: `.${string}`[];
+    /**
+     * Regular expression pattern of allowed characters in file names
+     * @example "a-zA-Z0-9-_."
+     */
+    allowedFileNameCharacters?: string;
     /**
      * Whether the dropzone is disabled
      */
@@ -54,6 +59,10 @@ type DropzoneProps = {
      * Maximum size of each file in bytes
      */
     maxSize?: number;
+    /**
+     * Maximum size of total upload in bytes
+     */
+    maxTotalSize?: number;
     /**
      * Whether multiple file selection is allowed
      */
@@ -88,7 +97,7 @@ type DropzoneProps = {
     validator?: (file: File) => FileError | FileError[] | null;
 };
 declare const DropzoneContainer: typeof MuiBox;
-declare const Dropzone: ({ allowedFileTypes, disabled, enableDropArea, maxFiles, maxSize, multiple, name, onChange, onClick, onDrop, setFileRejections, setTotalSize, validator, }: DropzoneProps) => react_jsx_runtime.JSX.Element;
+declare const Dropzone: ({ allowedFileTypes, allowedFileNameCharacters, disabled, enableDropArea, maxFiles, maxSize, maxTotalSize, multiple, name, onChange, onClick, onDrop, setFileRejections, setTotalSize, validator, }: DropzoneProps) => react_jsx_runtime.JSX.Element;
 
 type Dropzone2Props = DropzoneProps & {
     uploadOptions: UploadOptions;
@@ -101,7 +110,7 @@ type Dropzone2Props = DropzoneProps & {
  * `<Dropzone2 />` adds the `uploadOptions` prop that previously existed on
  * `<FileSelector />`.
  */
-declare const Dropzone2: ({ allowedFileTypes, disabled, enableDropArea, maxFiles, maxSize, multiple, name, onChange, onClick, onDrop, setFileRejections, setTotalSize, uploadOptions, validator, }: Dropzone2Props) => react_jsx_runtime.JSX.Element;
+declare const Dropzone2: ({ allowedFileTypes, disabled, enableDropArea, maxFiles, maxSize, maxTotalSize, multiple, name, onChange, onClick, onDrop, setFileRejections, setTotalSize, uploadOptions, validator, }: Dropzone2Props) => react_jsx_runtime.JSX.Element;
 
 type ErrorAlertProps = {
     /**
@@ -268,6 +277,10 @@ type FileSelectorProps = {
      * Overrides the standard file size message
      */
     customSizeMessage?: React.ReactNode;
+    /**
+     * Overrides the standard total upload size message
+     */
+    customTotalSizeMessage?: React.ReactNode;
     /**
      * Overrides the standard file types message
      */
@@ -307,6 +320,11 @@ type FileSelectorProps = {
      * Use Kibi or Mibibytes. eg: 1kb = 1024 bytes; 1mb = 1024kb
      */
     maxSize: number;
+    /**
+     * Maximum size allowed for total upload in bytes
+     * Use Kibi or Mibibytes. eg: 1kb = 1024 bytes; 1mb = 1024kb
+     */
+    maxTotalSize?: number;
     /**
      * Whether multiple file selection is allowed
      * @default true
@@ -347,7 +365,7 @@ type FileSelectorProps = {
      */
     disableRemove?: boolean;
 };
-declare const FileSelector: ({ name, allowedFileNameCharacters, allowedFileTypes, bucketId, clientId, children, customSizeMessage, customTypesMessage, customerId, customFileRow, disabled, enableDropArea, endpoint, isCloud, label, maxFiles, maxSize, multiple, onChange, onDrop, onUploadRemove, queryOptions, uploadOptions, validator, disableRemove, }: FileSelectorProps) => react_jsx_runtime.JSX.Element;
+declare const FileSelector: ({ name, allowedFileNameCharacters, allowedFileTypes, bucketId, clientId, children, customSizeMessage, customTotalSizeMessage, customTypesMessage, customerId, customFileRow, disabled, enableDropArea, endpoint, isCloud, label, maxFiles, maxSize, maxTotalSize, multiple, onChange, onDrop, onUploadRemove, queryOptions, uploadOptions, validator, disableRemove, }: FileSelectorProps) => react_jsx_runtime.JSX.Element;
 
 type FileSelector2Props = Omit<FileSelectorProps, 'onUploadRemove' | 'queryOptions'> & {
     onUploadRemove?: (uploads: Upload[], removedUploadId: string) => void;
@@ -361,7 +379,7 @@ type FileSelector2Props = Omit<FileSelectorProps, 'onUploadRemove' | 'queryOptio
  * `<FileSelector2 />` removes the reliance on `@tanstack/react-query`. The
  * `Upload` object can now be accessed from the form state.
  */
-declare const FileSelector2: ({ name, allowedFileNameCharacters, allowedFileTypes, bucketId, clientId, children, customSizeMessage, customTypesMessage, customerId, customFileRow, disabled, enableDropArea, endpoint, isCloud, label, maxFiles, maxSize, multiple, onChange, onDrop, onUploadRemove, uploadOptions, validator, disableRemove, }: FileSelector2Props) => react_jsx_runtime.JSX.Element;
+declare const FileSelector2: ({ name, allowedFileNameCharacters, allowedFileTypes, bucketId, clientId, children, customSizeMessage, customTotalSizeMessage, customTypesMessage, customerId, customFileRow, disabled, enableDropArea, endpoint, isCloud, label, maxFiles, maxSize, maxTotalSize, multiple, onChange, onDrop, onUploadRemove, uploadOptions, validator, disableRemove, }: FileSelector2Props) => react_jsx_runtime.JSX.Element;
 
 type FileTypesMessageProps = {
     /**
@@ -372,6 +390,10 @@ type FileTypesMessageProps = {
      * Overrides the standard file size message
      */
     customSizeMessage?: React.ReactNode;
+    /**
+     * Overrides the standard total upload size message
+     */
+    customTotalSizeMessage?: React.ReactNode;
     /**
      * Overrides the standard file types message
      */
@@ -380,9 +402,13 @@ type FileTypesMessageProps = {
      * Maximum size per file in bytes. This will be formatted. eg: 1024 * 20 = 20 KB
      */
     maxFileSize?: number;
+    /**
+     * Maximum size of the total upload in bytes. This will be formatted. eg: 1024 * 20 = 20 KB
+     */
+    maxTotalSize?: number;
     variant?: 'caption' | 'body2';
 };
-declare const FileTypesMessage: ({ allowedFileTypes, customSizeMessage, customTypesMessage, maxFileSize, variant, }: FileTypesMessageProps) => react_jsx_runtime.JSX.Element;
+declare const FileTypesMessage: ({ allowedFileTypes, customSizeMessage, customTotalSizeMessage, customTypesMessage, maxFileSize, maxTotalSize, variant, }: FileTypesMessageProps) => react_jsx_runtime.JSX.Element;
 
 type HeaderMessageProps = {
     /**
@@ -390,11 +416,15 @@ type HeaderMessageProps = {
      */
     maxFiles: number;
     /**
-     * Maximum combined total size of all files
+     * Maximum size of each file
      */
     maxSize: number;
+    /**
+     * Maximum combined total size of all files
+     */
+    maxTotalSize?: number;
 };
-declare const HeaderMessage: ({ maxFiles, maxSize }: HeaderMessageProps) => react_jsx_runtime.JSX.Element;
+declare const HeaderMessage: ({ maxFiles, maxSize, maxTotalSize }: HeaderMessageProps) => react_jsx_runtime.JSX.Element;
 
 type UploadProgressBarProps = {
     /**