imagekit-react
imagekit-react copied to clipboard
Please allow to forward references to the HTMLInputElement
I would like to use my own custom button, however, it's currently not possible since the IKUpload component does not forward references to the underlying input element.
Please allow for references to be forwarded.
The feature is barely usable as it is. Who is using the default button without using customisation for anything beside a demo app?
Added in version 2.0.0.
const reftest = useRef(null);
const onError = (err) => {
console.log('Error');
console.log(err);
};
const onSuccess = (res) => {
console.log('Success');
console.log(res);
};
<IKContext
publicKey="your_public_api_key"
urlEndpoint="https://ik.imagekit.io/your_imagekit_id"
authenticationEndpoint="http://www.yourserver.com/auth"
>
<IKUpload
onError={onError}
onSuccess={onSuccess}
inputRef={reftest}
style={{display: 'none'}} // hide default button
/>
<h1>Custom Upload Button</h1>
{reftest && <button className='custom-button-style' onClick={() => reftest.current.click()}>Upload</button>}
</IKContext>;