Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/shakacode/rescript-dnd

Drag-n-drop for @rescript/react
https://github.com/shakacode/rescript-dnd

Last synced: about 2 months ago
JSON representation

Drag-n-drop for @rescript/react

Host: GitHub
URL: https://github.com/shakacode/rescript-dnd
Owner: shakacode
Created: 2018-06-16T09:39:48.000Z (over 6 years ago)
Default Branch: master
Last Pushed: 2024-02-28T16:08:27.000Z (7 months ago)
Last Synced: 2024-05-23T07:06:22.853Z (4 months ago)
Language: ReScript
Homepage: https://rescript-dnd.vercel.app
Size: 837 KB
Stars: 115
Watchers: 5
Forks: 15
Open Issues: 5
Metadata Files:
- Readme: README.md
- Changelog: HISTORY.md

Awesome Lists containing this project

awesome-list - re-dnd - react | shakacode | 99 | (Reason)

README

        # rescript-dnd

[![npm version](https://img.shields.io/npm/v/rescript-dnd.svg?style=flat-square)](https://www.npmjs.com/package/rescript-dnd)

[![license](https://img.shields.io/npm/l/rescript-dnd.svg?style=flat-square)](https://www.npmjs.com/package/rescript-dnd)

[![build](https://github.com/shakacode/re-dnd/actions/workflows/pr.yml/badge.svg)](https://github.com/shakacode/re-dnd/actions/workflows/pr.yml)

Drag & drop for [`@rescript/react`](https://reasonml.github.io/reason-react/).

## Features

* Vertical lists

* Horizontal lists

* Multiple drop targets

* Mouse & Touch interactions

* Conditional drag & drop

* Custom drag handles

* Scrollable containers

* Auto-scroll when dragging at container's edge

> ### ShakaCode

> If you are looking for help with the development and optimization of your project, [ShakaCode](https://www.shakacode.com) can help you to take the reliability and performance of your app to the next level.

>

> If you are a developer interested in working on ReScript / TypeScript / Rust / Ruby on Rails projects, [we're hiring](https://www.shakacode.com/career/)!

## Installation

```shell

# yarn

yarn add rescript-dnd rescript-webapi

# or npm

npm install --save rescript-dnd rescript-webapi

```

Then add it to `bsconfig.json`:

```json

"bs-dependencies": [

  "rescript-dnd",

  "rescript-webapi"

]

```

## Docs

* [Getting Started](./docs/01-GettingStartedGuide.md)

* [Advanced guide: Safer identifiers and multiple containers](./docs/02-SaferIdentifiersAndMultipleContainersGuide.md)

* [Api](./docs/03-Api.md)

## Examples

* Demos: [`live`](https://rescript-dnd.vercel.app) | [`sources`](./examples)

* Production app: [`Minima`](https://minima.app)

## State

🚧 The library is not feature-complete and some features/apis might be missing.


🎙 Let us know if you miss anything via [creating an issue](issues/new).


🌎 We're using it in production BTW.

### Features we'd like to add at some point

- [ ] Keyboard interactions

- [ ] Ignore form elements (opt-out)

- [ ] Drop-zones

- [ ] Multi-select

## Thanks

* To [`react-beautiful-dnd`](https://github.com/atlassian/react-beautiful-dnd) for inspiration

## License

MIT.

## Supporters



  





  

    

    

    

  








  

    

    

    

  





  





  









The following companies support our open source projects, and ShakaCode uses their products!