github.com/zjffun/vue-shopify-draggable ↗
Vue component of Shopify draggable.
An animated visualization of zjffun/vue-shopify-draggable's Git history from September 2020 to January 2021, built by 2 contributors. The codebase reached 63 lines, mostly JavaScript. The video runs 15 seconds.
Render your own repo
Turn any GitHub repository into a video like this — free sample in seconds.
Open this visualization on its own page →
Language
JavaScript
Contributors
2
Lines of Code
63
From
2020-09-30
To
2021-01-17
Advertisement
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.
Advertisement