diff --git a/src/components/DropzoneAreaBase.js b/src/components/DropzoneAreaBase.js
index c9fe83d0..5297cdaf 100644
--- a/src/components/DropzoneAreaBase.js
+++ b/src/components/DropzoneAreaBase.js
@@ -405,7 +405,7 @@ DropzoneAreaBase.propTypes = {
*
* @see See [Material-UI Chip](https://material-ui.com/api/chip/#props) for available values.
*/
- previewChipProps: PropTypes.object,
+ previewChipProps: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),
/**
* Custom CSS classNames for preview Grid components.
* Should be in the form {container: string, item: string, image: string}.
diff --git a/src/components/PreviewList.js b/src/components/PreviewList.js
index d6693618..6f5b854f 100644
--- a/src/components/PreviewList.js
+++ b/src/components/PreviewList.js
@@ -68,6 +68,10 @@ function PreviewList({
className={clsx(classes.root, previewGridClasses.container)}
>
{fileObjects.map((fileObject, i) => {
+ let chipProps = previewChipProps;
+ if (typeof previewChipProps === 'function') {
+ chipProps = previewChipProps(fileObject);
+ }
return (
@@ -131,7 +135,7 @@ PreviewList.propTypes = {
fileObjects: PropTypes.arrayOf(PropTypes.object).isRequired,
getPreviewIcon: PropTypes.func.isRequired,
handleRemove: PropTypes.func.isRequired,
- previewChipProps: PropTypes.object,
+ previewChipProps: PropTypes.oneOfType([PropTypes.object, PropTypes.func]),
previewGridClasses: PropTypes.object,
previewGridProps: PropTypes.object,
showFileNames: PropTypes.bool,
diff --git a/src/index.d.ts b/src/index.d.ts
index e52beb4f..9949214f 100644
--- a/src/index.d.ts
+++ b/src/index.d.ts
@@ -49,7 +49,7 @@ export type DropzoneAreaBaseProps = {
showFileNamesInPreview?: boolean;
showFileNames?: boolean;
useChipsForPreview?: boolean;
- previewChipProps?: ChipProps;
+ previewChipProps?: ChipProps | ((fileObject: FileObject) => ChipProps);
previewGridClasses?: {
container?: string;
item?: string;