@availity/mui-file-selector 1.3.1 → 1.3.2

package/CHANGELOG.md

@@ -2,6 +2,14 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+## [1.3.2](https://github.com/Availity/element/compare/@availity/mui-file-selector@1.3.1...@availity/mui-file-selector@1.3.2) (2025-03-31)
+
+
+### Bug Fixes
+
+* **mui-file-selector:** check if upload is defined before attempting to render CustomRow ([26d22cc](https://github.com/Availity/element/commit/26d22cc44e18ac9c0fce9ea64c2d8d6c8a4cff47))
+* **mui-file-selector:** update customFileRow type on FileSelector ([8020d04](https://github.com/Availity/element/commit/8020d045d68b744fddd21b8f4953a4fd63c551de))
+
 ## [1.3.1](https://github.com/Availity/element/compare/@availity/mui-file-selector@1.3.0...@availity/mui-file-selector@1.3.1) (2025-03-27)
 
 ### Dependency Updates

package/dist/index.d.mts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { MouseEvent, Dispatch, ChangeEvent, RefObject, ReactNode, ElementType } from 'react';
+import { MouseEvent, Dispatch, ChangeEvent, RefObject, ReactNode } from 'react';
 import { DropEvent, FileRejection, FileError, DropzoneInputProps } from 'react-dropzone';
 import Upload, { UploadOptions } from '@availity/upload-core';
 import * as _tanstack_react_query from '@tanstack/react-query';
@@ -205,7 +205,11 @@ type FileSelectorProps = {
     /**
      * Componet to render the File information. This should return a `ListItem`
      */
-    customFileRow?: ElementType<FileListProps>;
+    customFileRow?: React.ElementType<{
+        upload?: Upload;
+        options: Options;
+        onRemoveFile: (id: string, upload: Upload) => void;
+    }>;
     /**
      * Whether to use the cloud upload endpoint
      * When true, uses '/cloud/web/appl/vault/upload/v1/resumable'

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { MouseEvent, Dispatch, ChangeEvent, RefObject, ReactNode, ElementType } from 'react';
+import { MouseEvent, Dispatch, ChangeEvent, RefObject, ReactNode } from 'react';
 import { DropEvent, FileRejection, FileError, DropzoneInputProps } from 'react-dropzone';
 import Upload, { UploadOptions } from '@availity/upload-core';
 import * as _tanstack_react_query from '@tanstack/react-query';
@@ -205,7 +205,11 @@ type FileSelectorProps = {
     /**
      * Componet to render the File information. This should return a `ListItem`
      */
-    customFileRow?: ElementType<FileListProps>;
+    customFileRow?: React.ElementType<{
+        upload?: Upload;
+        options: Options;
+        onRemoveFile: (id: string, upload: Upload) => void;
+    }>;
     /**
      * Whether to use the cloud upload endpoint
      * When true, uses '/cloud/web/appl/vault/upload/v1/resumable'

package/dist/index.js

@@ -692,8 +692,8 @@ var FileRow = ({
 }) => {
   const Icon = getFileExtIcon(file.name);
   const { data: upload } = useUploadCore(file, options, queryOptions);
-  if (CustomRow) return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(CustomRow, { upload, options, onRemoveFile });
   if (!upload) return null;
+  if (CustomRow) return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(CustomRow, { upload, options, onRemoveFile });
   return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
     import_mui_list3.ListItem,
     {

package/dist/index.mjs

@@ -667,8 +667,8 @@ var FileRow = ({
 }) => {
   const Icon = getFileExtIcon(file.name);
   const { data: upload } = useUploadCore(file, options, queryOptions);
-  if (CustomRow) return /* @__PURE__ */ jsx11(CustomRow, { upload, options, onRemoveFile });
   if (!upload) return null;
+  if (CustomRow) return /* @__PURE__ */ jsx11(CustomRow, { upload, options, onRemoveFile });
   return /* @__PURE__ */ jsxs8(
     ListItem2,
     {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@availity/mui-file-selector",
-  "version": "1.3.1",
+  "version": "1.3.2",
   "description": "Availity MUI file-selector Component - part of the @availity/element design system",
   "keywords": [
     "react",

package/src/lib/FileList.tsx

@@ -53,10 +53,10 @@ export const FileRow = ({
 
   const { data: upload } = useUploadCore(file, options, queryOptions);
 
-  if (CustomRow) return <CustomRow upload={upload} options={options} onRemoveFile={onRemoveFile} />;
-
   if (!upload) return null;
 
+  if (CustomRow) return <CustomRow upload={upload} options={options} onRemoveFile={onRemoveFile} />;
+
   return (
     <ListItem
       disableGutters
@@ -74,19 +74,19 @@ export const FileRow = ({
         )
       }
     >
-      <Grid container spacing={2} alignItems="center" justifyContent="space-between" width="100%"  flexWrap="wrap">
-        <Grid size={{ xs: "auto" }}>
-          <ListItemIcon sx={{minWidth: '1.5rem'}}>
+      <Grid container spacing={2} alignItems="center" justifyContent="space-between" width="100%" flexWrap="wrap">
+        <Grid size={{ xs: 'auto' }}>
+          <ListItemIcon sx={{ minWidth: '1.5rem' }}>
             <Icon />
           </ListItemIcon>
         </Grid>
-        <Grid size={{ xs: 4 }} sx={{minWidth: '8rem'}}>
-          <ListItemText sx={{wordBreak: 'break-all'}}>{upload.trimFileName(upload.file.name)}</ListItemText>
+        <Grid size={{ xs: 4 }} sx={{ minWidth: '8rem' }}>
+          <ListItemText sx={{ wordBreak: 'break-all' }}>{upload.trimFileName(upload.file.name)}</ListItemText>
         </Grid>
-        <Grid size={{ xs: 2 }} sx={{minWidth: '3rem'}}>
-          <ListItemText sx={{textAlign: 'end'}}>{formatBytes(upload.file.size)}</ListItemText>
+        <Grid size={{ xs: 2 }} sx={{ minWidth: '3rem' }}>
+          <ListItemText sx={{ textAlign: 'end' }}>{formatBytes(upload.file.size)}</ListItemText>
         </Grid>
-        <Grid size={{ xs: 'grow' }} sx={{minWidth: '6rem'}}>
+        <Grid size={{ xs: 'grow' }} sx={{ minWidth: '6rem' }}>
           <UploadProgressBar upload={upload} />
         </Grid>
       </Grid>

package/src/lib/FileSelector.tsx

@@ -66,7 +66,11 @@ export type FileSelectorProps = {
   /**
    * Componet to render the File information. This should return a `ListItem`
    */
-  customFileRow?: ElementType<FileListProps>;
+  customFileRow?: React.ElementType<{
+    upload?: Upload;
+    options: Options;
+    onRemoveFile: (id: string, upload: Upload) => void;
+  }>;
   /**
    * Whether to use the cloud upload endpoint
    * When true, uses '/cloud/web/appl/vault/upload/v1/resumable'