@stimulus-components/sortable
Version:
A Stimulus controller to reorder lists with drag-and-drop.
2 lines (1 loc) • 1.53 kB
JavaScript
(function(global,factory){typeof exports=="object"&&typeof module<"u"?module.exports=factory(require("@hotwired/stimulus"),require("sortablejs"),require("@rails/request.js")):typeof define=="function"&&define.amd?define(["@hotwired/stimulus","sortablejs","@rails/request.js"],factory):(global=typeof globalThis<"u"?globalThis:global||self,global.StimulusSortable=factory(global.Stimulus,global.Sortable,global.Request.js))})(this,function(stimulus,Sortable,request_js){"use strict";const _StimulusSortable=class _StimulusSortable extends stimulus.Controller{initialize(){this.onUpdate=this.onUpdate.bind(this)}connect(){this.sortable=new Sortable(this.element,{...this.defaultOptions,...this.options})}disconnect(){this.sortable.destroy(),this.sortable=void 0}async onUpdate({item,newIndex}){if(!item.dataset.sortableUpdateUrl)return;const param=this.resourceNameValue?`${this.resourceNameValue}[${this.paramNameValue}]`:this.paramNameValue,data=new FormData;return data.append(param,newIndex+1),await request_js.patch(item.dataset.sortableUpdateUrl,{body:data,responseKind:this.responseKindValue})}get options(){return{animation:this.animationValue||this.defaultOptions.animation||150,handle:this.handleValue||this.defaultOptions.handle||void 0,onUpdate:this.onUpdate}}get defaultOptions(){return{}}};_StimulusSortable.values={resourceName:String,paramName:{type:String,default:"position"},responseKind:{type:String,default:"html"},animation:Number,handle:String};let StimulusSortable=_StimulusSortable;return StimulusSortable});