draggable - The JavaScript Drag & Drop library your grandparents warned you about.

  •        130

Get complete control over drag and drop behaviour with Draggable! Draggable abstracts native browser events into a comprehensive API to create a custom drag and drop experience. Draggable comes with additional modules: Sortable, Droppable, Swappable. Draggable itself does not perform any sorting behaviour while dragging, but does the heavy lifting, e.g. creates mirror, emits events, manages sensor events, makes elements draggable.The additional modules are built on top of Draggable and therefore provide a similar API interface, for more information read the documentation below.

https://github.com/Shopify/draggable#readme
https://github.com/Shopify/draggable

Tags
Implementation
License
Platform

   




Related Projects

Sortable - Sortable — is a JavaScript library for reorderable drag-and-drop lists on modern browsers and touch devices

  •    Javascript

Sortable is a minimalist JavaScript library for reorderable drag-and-drop lists. You can use any element for the list and its elements, not just ul/li. Here is an example with divs.

react-smooth-dnd - react wrapper components for smooth-dnd

  •    Javascript

A fast and lightweight drag&drop, sortable library for React with many configuration options covering many d&d scenarios. It uses css transitions for animations so it's hardware accelerated whenever possible. This library consists wrapper React components over smooth-dnd library.

vue-grid-layout - A draggable and resizable grid layout, for Vue.js.

  •    Vue

This is the initial layout of the grid. The value must be an Array of Object items. Each item must have i, x, y, w and h proprties. Please refer to GridItem documentation below for more informations.

react-grid-layout - A draggable and resizable grid layout with responsive breakpoints, for React.

  •    Javascript

React-Grid-Layout is a grid layout system much like Packery or Gridster, for React. Unlike those systems, it is responsive and supports breakpoints. Breakpoint layouts can be provided by the user or autogenerated.


react-dnd - Drag and Drop for React

  •    TypeScript

Drag and Drop for React. Big thanks to BrowserStack for letting the maintainers use their service to debug browser issues.

interact

  •    Javascript

JavaScript drag and drop, resizing and multi-touch gestures with inertia and snapping for modern browsers (and also IE9+). Visit http://interactjs.io/docs for the API documentation.

knockout-sortable - A Knockout

  •    Javascript

knockout-sortable is a binding for Knockout.js designed to connect observableArrays with jQuery UI's sortable functionality. This allows a user to drag and drop items within a list or between lists and have the corresponding observableArrays updated appropriately. Note: The sortable binding assumes that the child "templates" have a single container element. You cannot use containerless bindings (comment-based) bindings at the top-level of your template, as the jQuery draggable/sortable functionality needs an element to operate on.

TableDnD - jQuery plug-in to drag and drop rows in HTML tables

  •    HTML

You'll also need to include jQuery before you include this plugin (so that jQuery is defined). Basically we get the table element and call tableDnD. If you try this, you'll see that the rows are now draggable.

react-rnd - 🖱 A resizable and draggable component for React.

  •    TypeScript

A resizable and draggable component for React. The width and height property is used to set the default size of the component. For example, you can set 300, '300px', 50%. If omitted, set 'auto'.

Timber - The ultimate Shopify theme framework, built by Shopify.

  •    Liquid

The Timber theme is no longer being maintained by Shopify. Developers are encouraged to check out Slate - a theme scaffolding and command line tool built for developing Shopify themes.You can continue to use Timber; however, this repo will not be kept up-to-date with changes in Shopify theme development.

vue-draggable-resizable - Vue2 Component for draggable and resizable elements.

  •    Javascript

Vue2 Component for draggable and resizable elements. Determines if the component should be active or not. The prop reacts to changes and also can be used with the syncmodifier to keep the state in sync with the parent.

react-draggable - React draggable component

  •    Javascript

A simple component for making elements draggable.If you aren't using browserify/webpack, a UMD version of react-draggable is available. It is updated per-release only. This bundle is also what is loaded when installing from npm. It expects external React and ReactDOM.

themekit - Shopify theme interaction command line tool.

  •    Go

Theme Kit is a cross-platform tool for building Shopify Themes. Theme Kit is a single binary that has no dependencies.

skeleton-theme - A simplified Shopify theme

  •    Liquid

The Skeleton theme is no longer being maintained by Shopify. Developers are encouraged to use Slate - a theme scaffolding and command line tool built for developing Shopify themes.You can continue to use Skeleton; however, this repo will not be kept up-to-date with changes in Shopify theme development.

DraggablePanel - Android library used to create an awesome Android UI based on a draggable element similar to the last YouTube graphic component

  •    Java

DEPRECATED. This project is not maintained anymore. Draggable Panel is an Android library created to build a draggable user interface similar to the new YouTube draggable video component based on Fragments or Views.

slate - Slate is a theme scaffold and command line tool for developing Shopify themes

  •    Javascript

A theme scaffold and command line tool for developing Shopify themes.

shopify_api - ShopifyAPI is a lightweight gem for accessing the Shopify admin REST web services.

  •    Ruby

The Shopify API gem allows Ruby developers to programmatically access the admin section of Shopify stores.The API is implemented as JSON over HTTP using all four verbs (GET/POST/PUT/DELETE). Each resource, like Order, Product, or Collection, has its own URL and is manipulated in isolation. In other words, we’ve tried to make the API follow the REST principles as much as possible.

polaris-react - Shopify’s product component library

  •    TypeScript

Polaris React is a component library designed to help developers create the best experience for merchants who use Shopify. Visit the Polaris style guide to learn more. For more information about creating apps for the Shopify App Store, take a look at the app development documentation.