# React DND

We've implemented some components which can help you for make your app draggable and droppable. Those are,

1. [useDragSource](src/hooks/useDragSource.md)
2. [useDragPreview](src/hooks/useDragPreview.md)
3. [useDropTarget](src/hooks/useDropTarget.md)
4. [useSortableElement](src/hooks/useSortableElement.md)
5. [useDropShadow](src/hooks/useDropShadow.md)
6. [SortableContainer](src/components/SortableContainer.md)
   (below readme not ready yet)
7. [useDNDMonitior](src/hooks/useDNDMonitior.md)
8. [DNDBackend](src/common/DNDBackend.md)
9. [createBackend](src/common/createBackend.md)
10. [DNDProvider](src/components/DNDProvider.md)
11. [withHooks](src/common/withHooks.md)
12. [useResizeObserver](src/hooks/useResizeObserver/Readme.md)

# Installation procedure

1.  `npm install @zohodesk/react-dnd`

# To run examples

1.  Clone [this](https://git.csez.zohocorpin.com/zohodesk/weirdo-components.git) repo
2.  Navigate to examples [folder](./examples/src/react-dnd/examples)
3.  Then run `npm install` command and `npm run start`
4.  The examples will run your local machine on 9090 that is default port.
5.  You can change the port through the CLI like `npm run start 5000` when start the server.

# Contribution guide

- Sure, you can contribute here to develop most tough components.
- Make sure you have'd docs, unit test cases and examples for your contributed component before raise the merge request.
- Also you can fix the bugs and raise the issue here in issues panel.

Happy Coding! :v: