DRAGGABLE BOXES

A simple container and item setup for adding draggable and droppable items to your react app.

Things to be dragged, wrap in <Draggable>. Things to hold items, wrap in <DragContainer>.

Both components have a id, this is to identify the pieces and is returned when something is successfuly dragged with the setterFunction prop.

There is also implementation in place to pass style down to the div.

##Implementation:

import {Draggable, DragContainer} from "./index";

<DragContainer
    id={'container1'}
    setterFunction={(
        draggedId: string,
        oldContainerId: string,
        newContainerId: string
    ): void => {
        /*
        Input your logic here for state setting
         */
    }}
    style={{border:'1px solid black'}}
>
    /*
    Header or other cool components
    */

    <Draggable
        id={'box1'}
        style={{bgcolor:'red'}}
    >
        /*
        contents to be dragged
        */
    </Draggable>
    /*
       other children
    */
</DragContainer>
/*
Other DragContainers
 */