Add custom button for files loading

Question

I'm using filepond with react and material-ui.

If I add very basic filepond component, like this:

 <FilePond name="files" labelIdle="" />

It will render default browser input with type file, like this:

I want to render custom material-ui button instead. I know that FilePond can be styled in a different way via CSS, but it's not about styling with CSS-classes, but about inserting predefined component, like naterial-ui one. Is it possible?

Dylan Lee · Accepted Answer · 2021-10-25 14:53:24Z

1

Based on the code in the github, linked here, https://github.com/pqina/react-filepond/blob/master/lib/index.js, the package is creating the input element directly rather than wrapping a passed in component. Therefore you cannot pass in a predefined Material-UI component. If you want to use Material-UI styles you'll have to do the styling yourself or edit the filepond package to support passing in a component.

answered Oct 25, 2021 at 14:53

Dylan Lee

1181 silver badge11 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Add custom button for files loading

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related