@alchemdigital/draganddrop

1.1.0 • Public • Published

What is DragAndDrop

You can use this component to let the user drag and drop files. You can do your own styling if you want.

Compatability

It works fine with react and tested.

How to use

    npm i @alchemdigital/draganddrop
    import { DragAndDrop } from '@alchemdigital/draganddrop'

    function App() {

        /* const handleDrop = (files) => {
            console.log(files)
        }

        const removeFile = (e, index) => {
            console.log(e)
            console.log(index)
        } */

        const getFiles = (files) => {
            console.log(files)
        }

        return (
            <>
                <div>
                    <DragAndDrop getFiles={getFiles} />
                </div>
                {/* <div>
                    <DragAndDrop handleDrop={handleDrop} customUI={true} removeFile={removeFile} getFiles={getFiles}>
                        <div style={{height: '500px', width: '500px', border: '1px solid black', textAlign: 'center'}}>
                            Your Custom Text
                        </div>
                    </DragAndDrop>
                </div> */}
            </>
        )
    }

Demo output

draganddrop_1 draganddrop_2

Support

Alchem Digital (bairavan@alchemdigital.com)

/@alchemdigital/draganddrop/

    Package Sidebar

    Install

    npm i @alchemdigital/draganddrop

    Weekly Downloads

    2

    Version

    1.1.0

    License

    MIT

    Unpacked Size

    12.6 kB

    Total Files

    5

    Last publish

    Collaborators

    • bairavan