smoothly 0.3.38 → 1.0.0-alpha.10

package/dist/smoothly/p-5b28795c.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as s,a as i}from"./p-c88ae468.js";const h="smoothly-reorder>*{cursor:move;transition:transform 0.3s}smoothly-reorder>*.dragging{transition:none;box-shadow:0 0 10px rgba(var(--smoothly-dark-color));z-index:1;user-select:none}";const e=class{constructor(i){t(this,i);this.reorder=s(this,"reorder",7)}get children(){let t=[];if(this.childrenCache)t=this.childrenCache;else{for(let s=0;s<this.element.children.length;s++){const i=this.element.children[s];if(i instanceof HTMLElement){const s=i.getBoundingClientRect();t.push({top:s.top,middle:s.top+s.height/2,bottom:s.bottom,element:i})}}this.childrenCache=t}return t}onMouseDown(t){if(!this.move&&this.element.children.length>1){this.bounds=this.element.getBoundingClientRect();this.childrenCache=undefined;const s=this.getCurrentIndex(t.clientY);this.dragged=Object.assign(Object.assign({},this.children[s]),{startY:t.clientY,offsetY:t.clientY-this.children[s].middle,index:s,height:s<this.children.length-1?this.children[s+1].top-this.children[s].top:this.children[s].bottom-this.children[s-1].bottom});this.dragged.element.className+=" dragging"}}onMouseMove(t){if(this.dragged&&this.bounds&&t.clientY>=this.bounds.top&&t.clientY<=this.bounds.bottom){const s=this.getCurrentIndex(t.clientY-this.dragged.offsetY);this.translate(this.dragged.index,s,t.clientY-this.dragged.startY)}}onMouseUp(t){if(this.dragged){this.dragged.element.className=this.dragged.element.className.replace(" dragging","");const s=this.getCurrentIndex(t.clientY-this.dragged.offsetY);this.translate(this.dragged.index,s,this.children[s].top-this.dragged.top);this.move={from:this.dragged.index,to:s};this.dragged=undefined;window.setTimeout((()=>{if(this.move){const t=[...this.children.map((t=>t.element))];const s=t.splice(this.move.from,1);t.splice(this.move.to,0,...s);t.forEach((t=>this.element.removeChild(t)));t.forEach((t=>{t.style.transform="";this.element.appendChild(t)}));this.reorder.emit([this.move.from,this.move.to]);this.move=undefined}}),500)}}translate(t,s,i){for(let h=0;h<this.children.length;h++){let e;if(this.dragged){if(t<s&&h>t&&h<=s)e=-this.dragged.height;else if(t>s&&h<t&&h>=s)e=this.dragged.height;else e=h==t?i:0;this.children[h].element.style.transform=`translateY(${e}px)`}}}getCurrentIndex(t){return this.children.findIndex((s=>t<s.bottom))}componentDidLoad(){this.element.childNodes.forEach((t=>{t.addEventListener("mousedown",(t=>this.onMouseDown(t)));t.addEventListener("mousemove",(t=>this.onMouseMove(t)));t.addEventListener("mouseup",(t=>this.onMouseUp(t)))}))}get element(){return i(this)}};e.style=h;export{e as smoothly_reorder};
+//# sourceMappingURL=p-5b28795c.entry.js.map

package/dist/smoothly/p-5b28795c.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["styleCss","SmoothlyReorder","children","result","this","childrenCache","index","element","length","HTMLElement","bounds","getBoundingClientRect","push","top","middle","height","bottom","onMouseDown","event","move","undefined","getCurrentIndex","clientY","dragged","Object","assign","startY","offsetY","className","onMouseMove","currentIndex","translate","onMouseUp","replace","from","to","window","setTimeout","map","c","e","splice","forEach","child","removeChild","style","transform","appendChild","reorder","emit","fromIndex","toIndex","y","value","findIndex","componentDidLoad","childNodes","addEventListener"],"sources":["./src/components/reorder/style.css?tag=smoothly-reorder","./src/components/reorder/index.tsx"],"sourcesContent":["smoothly-reorder > * {\n\tcursor: move;\n\ttransition: transform 0.3s;\n}\nsmoothly-reorder > *.dragging {\n\ttransition: none;\n\tbox-shadow: 0 0 10px rgba(var(--smoothly-dark-color));\n\tz-index: 1;\n\tuser-select: none;\n}\n","import { Component, Element, Event, EventEmitter } from \"@stencil/core\"\n\n@Component({\n\ttag: \"smoothly-reorder\",\n\tstyleUrl: \"style.css\",\n})\nexport class SmoothlyReorder {\n\t@Event() reorder: EventEmitter<[number, number]>\n\t@Element() element: HTMLSmoothlyReorderElement\n\tprivate bounds?: DOMRect\n\tprivate childrenCache?: Draggable[]\n\tprivate get children(): Draggable[] {\n\t\tlet result: Draggable[] = []\n\t\tif (this.childrenCache)\n\t\t\tresult = this.childrenCache\n\t\telse {\n\t\t\tfor (let index = 0; index < this.element.children.length; index++) {\n\t\t\t\tconst element = this.element.children[index]\n\t\t\t\tif (element instanceof HTMLElement) {\n\t\t\t\t\tconst bounds = element.getBoundingClientRect()\n\t\t\t\t\tresult.push({\n\t\t\t\t\t\ttop: bounds.top,\n\t\t\t\t\t\tmiddle: bounds.top + bounds.height / 2,\n\t\t\t\t\t\tbottom: bounds.bottom,\n\t\t\t\t\t\telement: element,\n\t\t\t\t\t})\n\t\t\t\t}\n\t\t\t}\n\t\t\tthis.childrenCache = result\n\t\t}\n\t\treturn result\n\t}\n\tprivate dragged?: Dragged\n\tprivate move?: { from: number; to: number }\n\n\tprivate onMouseDown(event: MouseEvent) {\n\t\tif (!this.move && this.element.children.length > 1) {\n\t\t\tthis.bounds = this.element.getBoundingClientRect()\n\t\t\tthis.childrenCache = undefined\n\t\t\tconst index = this.getCurrentIndex(event.clientY)\n\t\t\tthis.dragged = {\n\t\t\t\t...this.children[index],\n\t\t\t\tstartY: event.clientY,\n\t\t\t\toffsetY: event.clientY - this.children[index].middle,\n\t\t\t\tindex,\n\t\t\t\theight:\n\t\t\t\t\tindex < this.children.length - 1\n\t\t\t\t\t\t? this.children[index + 1].top - this.children[index].top\n\t\t\t\t\t\t: this.children[index].bottom - this.children[index - 1].bottom,\n\t\t\t}\n\t\t\tthis.dragged.element.className += \" dragging\"\n\t\t}\n\t}\n\n\tprivate onMouseMove(event: MouseEvent) {\n\t\tif (this.dragged && this.bounds && event.clientY >= this.bounds.top && event.clientY <= this.bounds.bottom) {\n\t\t\tconst currentIndex = this.getCurrentIndex(event.clientY - this.dragged.offsetY)\n\t\t\tthis.translate(this.dragged.index, currentIndex, event.clientY - this.dragged.startY)\n\t\t}\n\t}\n\n\tprivate onMouseUp(event: MouseEvent) {\n\t\tif (this.dragged) {\n\t\t\tthis.dragged.element.className = this.dragged.element.className.replace(\" dragging\", \"\")\n\t\t\tconst index = this.getCurrentIndex(event.clientY - this.dragged.offsetY)\n\t\t\tthis.translate(this.dragged.index, index, this.children[index].top - this.dragged.top)\n\t\t\tthis.move = { from: this.dragged.index, to: index }\n\t\t\tthis.dragged = undefined\n\n\t\t\twindow.setTimeout(() => {\n\t\t\t\tif (this.move) {\n\t\t\t\t\tconst children = [...this.children.map(c => c.element)]\n\t\t\t\t\tconst e = children.splice(this.move.from, 1)\n\t\t\t\t\tchildren.splice(this.move.to, 0, ...e)\n\t\t\t\t\tchildren.forEach(child => this.element.removeChild(child))\n\t\t\t\t\tchildren.forEach(child => {\n\t\t\t\t\t\tchild.style.transform = \"\"\n\t\t\t\t\t\tthis.element.appendChild(child)\n\t\t\t\t\t})\n\t\t\t\t\tthis.reorder.emit([this.move.from, this.move.to])\n\t\t\t\t\tthis.move = undefined\n\t\t\t\t}\n\t\t\t}, 500)\n\t\t}\n\t}\n\n\tprivate translate(fromIndex: number, toIndex: number, y: number) {\n\t\tfor (let index = 0; index < this.children.length; index++) {\n\t\t\tlet value: number\n\t\t\tif (this.dragged) {\n\t\t\t\tif (fromIndex < toIndex && index > fromIndex && index <= toIndex)\n\t\t\t\t\tvalue = -this.dragged.height\n\t\t\t\telse if (fromIndex > toIndex && index < fromIndex && index >= toIndex)\n\t\t\t\t\tvalue = this.dragged.height\n\t\t\t\telse\n\t\t\t\t\tvalue = index == fromIndex ? y : 0\n\n\t\t\t\tthis.children[index].element.style.transform = `translateY(${value}px)`\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate getCurrentIndex(y: number): number {\n\t\treturn this.children.findIndex(c => y < c.bottom)\n\t}\n\n\tcomponentDidLoad() {\n\t\tthis.element.childNodes.forEach(child => {\n\t\t\tchild.addEventListener(\"mousedown\", (e: MouseEvent) => this.onMouseDown(e))\n\t\t\tchild.addEventListener(\"mousemove\", (e: MouseEvent) => this.onMouseMove(e))\n\t\t\tchild.addEventListener(\"mouseup\", (e: MouseEvent) => this.onMouseUp(e))\n\t\t})\n\t}\n}\n"],"mappings":"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"}