zjffun/vue-shopify-draggable ↗
Created Feb 16, 2021 · View the zjffun/vue-shopify-draggable repository page
Vue component of Shopify draggable.
Want this for your repo?
Render a free sample of any GitHub repo in seconds.
Contributors
2
Lines of Code
63
From
Sep 30, 2020
To
Jan 17, 2021
About zjffun/vue-shopify-draggable
Vue-shopify-draggable is a Vue component wrapper around Shopify's draggable library, providing an easy way to integrate drag-and-drop functionality into Vue applications. The package exposes five main components: vue-sortable, vue-swappable, vue-droppable, vue-draggable, and vue-draggable-container, each corresponding to different dragging behaviors from the underlying Shopify library.
The components support comprehensive configuration through props like options and tag, allowing developers to customize wrapper elements and behavior. They emit a full suite of events covering the drag lifecycle (drag:start, drag:move, drag:stop), sorting operations (sortable:start, sortable:sort, sortable:sorted), swapping (swappable:swap, swappable:swapped), and dropping interactions (droppable:dropped, droppable:returned). The library also supports plugin events from Shopify's official plugins including mirror, collidable, and snap functionality.
The package is available via npm and CDN, with support for both Vue 2 and Vue 3, and includes options for flexible component registration. Developers can use individual components separately or register them globally, and have the option to avoid wrapper DOM generation by setting an empty string for the tag property.