🐲 Draggy

Appearance

Getting Started ​

Installation ​

sh
npm add @sebkolind/draggy
sh
pnpm add @sebkolind/draggy
sh
yarn add @sebkolind/draggy
sh
bun add @sebkolind/draggy

Quick Start ​

Here's a basic example to initialize on all elements with the .container class. This will use the default configuration. You can read more about the options available here.

ts
import { draggy } from "@sebkolind/draggy";

draggy({
  target: ".container",
});

What does this do? ​

What this does is initialize Draggy on all elements with the class .container. This means that all children of .container will be draggable, and can be dropped on other .container elements if there are more than one. If only one .container element is found, the children can be dragged and dropped in the same container.

Next Steps ​

You can customize Draggy to fit your needs. You can read more about the options available here. If you want to see some examples, you can find them in the sidebar under "Examples".

For example, you can integrate with Vue or React. Or, create a custom shadow element with this example.

If you have any questions, feel free to ask in the Discussions or open an Issue.