Socket
Socket
Sign inDemoInstall

nested-sort

Package Overview
Dependencies
0
Maintainers
1
Versions
22
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 4.2.1 to 4.3.0

137

dist/nested-sort.cjs.js

@@ -19,3 +19,3 @@ 'use strict';

maybeTransformData() {
if (!Object.keys(this.propertyMap).length) return;
if (!Object.keys(this.propertyMap).length) return

@@ -28,3 +28,3 @@ const getItemPropProxyName = this.getItemPropProxyName.bind(this);

return Reflect.get(target, getItemPropProxyName(prop), receiver)
}
},
})

@@ -39,3 +39,3 @@ });

getItemPropProxyName(prop) {
if (this.propertyMap.hasOwnProperty(prop)) {
if (Object.prototype.hasOwnProperty.call(this.propertyMap, prop)) {
return this.propertyMap[prop]

@@ -63,3 +63,3 @@ }

.reduce((groups, item) => {
if (groups.hasOwnProperty(item.parent)) {
if (Object.prototype.hasOwnProperty.call(groups, item.parent)) {
groups[item.parent].push(item);

@@ -78,3 +78,3 @@ } else {

...topLevelItems,
...Object.values(childItems).flat()
...Object.values(childItems).flat(),
];

@@ -146,3 +146,3 @@

if (!topParent) return false;
if (!topParent) return false

@@ -239,5 +239,6 @@ const listItem = this.createItemElement(item);

el,
init = true,
listClassNames,
listItemClassNames,
propertyMap = {}
propertyMap = {},
} = {}) {

@@ -255,8 +256,8 @@ this.data = data;

this.actions = {
onDrop
onDrop,
};
this.initialised = false;
this.targetNode = {
X: null,
Y: null
Y: null,
};

@@ -268,4 +269,4 @@

mouseTo: {
targetedElTop: undefined
}
targetedElTop: undefined,
},
};

@@ -275,4 +276,4 @@

targetedEl: {
H: undefined
}
H: undefined,
},
};

@@ -282,3 +283,3 @@

X: null,
Y: null
Y: null,
};

@@ -291,6 +292,13 @@

};
this.listEventListeners = {
dragover: this.onDragOver.bind(this),
dragstart: this.onDragStart.bind(this),
dragenter: this.onDragEnter.bind(this),
dragend: this.onDragEnd.bind(this),
drop: this.onDrop.bind(this),
};
this.maybeInitDataDom();
this.addListAttributes();
this.initDragAndDrop();
if (init) this.initDragAndDrop();
}

@@ -312,6 +320,8 @@

maybeInitDataDom() {
if (!(Array.isArray(this.data) && this.data.length)) return;
if (!(Array.isArray(this.data) && this.data.length)) return
const wrapper = document.querySelector(this.selector);
const list = this.getDataEngine().render();
document.querySelector(this.selector).appendChild(list);
wrapper.innerHTML = '';
wrapper.appendChild(list);
}

@@ -345,23 +355,41 @@

toggleListItemAttributes(enable = true) {
this.getSortableList().querySelectorAll('li').forEach(el => {
el.setAttribute('draggable', enable);
});
}
toggleListEventListeners(remove = false) {
const list = this.getSortableList();
Object.keys(this.listEventListeners).forEach(event => {
if (remove) {
list.removeEventListener(event, this.listEventListeners[event]);
} else {
list.addEventListener(event, this.listEventListeners[event], false);
}
});
}
initDragAndDrop() {
document.addEventListener('dragover', this.dragListener.bind(this), false);
if (this.initialised) return
this.toggleListEventListeners();
this.initPlaceholderList();
this.toggleListItemAttributes();
this.getSortableList().querySelectorAll('li').forEach(this.addListItemStyles.bind(this));
this.initialised = true;
}
this.getSortableList().querySelectorAll('li').forEach(el => {
el.setAttribute('draggable', 'true');
init() {
this.initDragAndDrop();
}
el.addEventListener('dragstart', this.onDragStart.bind(this), false);
el.addEventListener('dragenter', this.onDragEnter.bind(this), false);
el.addEventListener('dragover', this.onDragOver.bind(this), false);
el.addEventListener('dragleave', this.onDragLeave.bind(this), false);
el.addEventListener('dragend', this.onDragEnd.bind(this), false);
el.addEventListener('drop', this.onDrop.bind(this), false);
this.addListItemStyles(el);
});
destroy() {
this.toggleListEventListeners(true);
this.toggleListItemAttributes(false);
this.initialised = false;
}
getComputedStyleValue(el, prop) {
return window.getComputedStyle(el, null).getPropertyValue(prop);
return window.getComputedStyle(el, null).getPropertyValue(prop)
}

@@ -383,2 +411,7 @@

canBeTargeted(el) {
if (!this.draggedNode || this.draggedNode === el) return false
return el.nodeName === 'LI' || (el.nodeName === 'UL' && el.classList.contains(this.classNames.placeholder))
}
onDragStart(e) {

@@ -392,8 +425,10 @@ this.draggedNode = e.target;

e.preventDefault(); // prevent default to allow drop
this.updateCoordination(e);
this.managePlaceholderLists(e);
}
onDragEnter(e) {
if (!(this.draggedNode && ['LI', 'UL'].includes(e.target.nodeName))) return
if (!this.canBeTargeted(e.target)) return
if (this.targetedNode) this.targetedNode.classList.remove(this.classNames.targeted);
this.removeClassFromEl(this.targetedNode, this.classNames.targeted);
this.targetedNode = e.target;

@@ -403,5 +438,2 @@ this.targetedNode.classList.add(this.classNames.targeted);

onDragLeave(e) {
}
onDragEnd(e) {

@@ -426,7 +458,2 @@ e.stopPropagation();

dragListener(e) {
this.updateCoordination(e);
this.managePlaceholderLists(e);
}
updateCoordination(e) {

@@ -449,10 +476,10 @@ this.calcMouseCoords(e);

dropTheItem(place, e) {
dropTheItem(place) {
switch (place) {
case 'before':
this.targetedNode.parentNode.insertBefore(this.draggedNode, this.targetedNode);
break;
break
case 'inside':
this.targetedNode.appendChild(this.draggedNode);
break;
break
}

@@ -469,3 +496,3 @@ }

if (!this.targetedNode) {
return;
return
}

@@ -489,7 +516,7 @@

cursorIsIndentedEnough() {
return this.cursor.X - this.targetNode.X > 50;
return this.cursor.X - this.targetNode.X > 50
}
mouseIsTooCloseToTop() {
return this.cursor.Y - this.targetNode.Y < this.distances.droppingEdge;
return this.cursor.Y - this.targetNode.Y < this.distances.droppingEdge
}

@@ -506,6 +533,6 @@

this.addPlaceholderList();
break;
break
case 'cleanup':
this.cleanupPlaceholderLists();
break;
break
}

@@ -516,8 +543,8 @@ });

targetedNodeIsPlaceholder() {
return this.targetedNode.nodeName === 'UL' && this.targetedNode.classList.contains(this.classNames.placeholder);
return this.targetedNode.nodeName === 'UL' && this.targetedNode.classList.contains(this.classNames.placeholder)
}
analysePlaceHolderSituation(e) {
analysePlaceHolderSituation() {
if (!this.targetedNode || this.areNested(this.targetedNode, this.draggedNode)) {
return [];
return []
}

@@ -537,3 +564,3 @@

return actions;
return actions
}

@@ -554,3 +581,3 @@

targetNodeIsIdentified() {
return !!this.targetedNode;
return !!this.targetedNode
}

@@ -595,3 +622,3 @@

this.placeholderInUse = this.placeholderUl.cloneNode(true);
return this.placeholderInUse;
return this.placeholderInUse
}

@@ -598,0 +625,0 @@ }

@@ -17,3 +17,3 @@ class DataEngine {

maybeTransformData() {
if (!Object.keys(this.propertyMap).length) return;
if (!Object.keys(this.propertyMap).length) return

@@ -26,3 +26,3 @@ const getItemPropProxyName = this.getItemPropProxyName.bind(this);

return Reflect.get(target, getItemPropProxyName(prop), receiver)
}
},
})

@@ -37,3 +37,3 @@ });

getItemPropProxyName(prop) {
if (this.propertyMap.hasOwnProperty(prop)) {
if (Object.prototype.hasOwnProperty.call(this.propertyMap, prop)) {
return this.propertyMap[prop]

@@ -61,3 +61,3 @@ }

.reduce((groups, item) => {
if (groups.hasOwnProperty(item.parent)) {
if (Object.prototype.hasOwnProperty.call(groups, item.parent)) {
groups[item.parent].push(item);

@@ -76,3 +76,3 @@ } else {

...topLevelItems,
...Object.values(childItems).flat()
...Object.values(childItems).flat(),
];

@@ -144,3 +144,3 @@

if (!topParent) return false;
if (!topParent) return false

@@ -237,5 +237,6 @@ const listItem = this.createItemElement(item);

el,
init = true,
listClassNames,
listItemClassNames,
propertyMap = {}
propertyMap = {},
} = {}) {

@@ -253,8 +254,8 @@ this.data = data;

this.actions = {
onDrop
onDrop,
};
this.initialised = false;
this.targetNode = {
X: null,
Y: null
Y: null,
};

@@ -266,4 +267,4 @@

mouseTo: {
targetedElTop: undefined
}
targetedElTop: undefined,
},
};

@@ -273,4 +274,4 @@

targetedEl: {
H: undefined
}
H: undefined,
},
};

@@ -280,3 +281,3 @@

X: null,
Y: null
Y: null,
};

@@ -289,6 +290,13 @@

};
this.listEventListeners = {
dragover: this.onDragOver.bind(this),
dragstart: this.onDragStart.bind(this),
dragenter: this.onDragEnter.bind(this),
dragend: this.onDragEnd.bind(this),
drop: this.onDrop.bind(this),
};
this.maybeInitDataDom();
this.addListAttributes();
this.initDragAndDrop();
if (init) this.initDragAndDrop();
}

@@ -310,6 +318,8 @@

maybeInitDataDom() {
if (!(Array.isArray(this.data) && this.data.length)) return;
if (!(Array.isArray(this.data) && this.data.length)) return
const wrapper = document.querySelector(this.selector);
const list = this.getDataEngine().render();
document.querySelector(this.selector).appendChild(list);
wrapper.innerHTML = '';
wrapper.appendChild(list);
}

@@ -343,23 +353,41 @@

toggleListItemAttributes(enable = true) {
this.getSortableList().querySelectorAll('li').forEach(el => {
el.setAttribute('draggable', enable);
});
}
toggleListEventListeners(remove = false) {
const list = this.getSortableList();
Object.keys(this.listEventListeners).forEach(event => {
if (remove) {
list.removeEventListener(event, this.listEventListeners[event]);
} else {
list.addEventListener(event, this.listEventListeners[event], false);
}
});
}
initDragAndDrop() {
document.addEventListener('dragover', this.dragListener.bind(this), false);
if (this.initialised) return
this.toggleListEventListeners();
this.initPlaceholderList();
this.toggleListItemAttributes();
this.getSortableList().querySelectorAll('li').forEach(this.addListItemStyles.bind(this));
this.initialised = true;
}
this.getSortableList().querySelectorAll('li').forEach(el => {
el.setAttribute('draggable', 'true');
init() {
this.initDragAndDrop();
}
el.addEventListener('dragstart', this.onDragStart.bind(this), false);
el.addEventListener('dragenter', this.onDragEnter.bind(this), false);
el.addEventListener('dragover', this.onDragOver.bind(this), false);
el.addEventListener('dragleave', this.onDragLeave.bind(this), false);
el.addEventListener('dragend', this.onDragEnd.bind(this), false);
el.addEventListener('drop', this.onDrop.bind(this), false);
this.addListItemStyles(el);
});
destroy() {
this.toggleListEventListeners(true);
this.toggleListItemAttributes(false);
this.initialised = false;
}
getComputedStyleValue(el, prop) {
return window.getComputedStyle(el, null).getPropertyValue(prop);
return window.getComputedStyle(el, null).getPropertyValue(prop)
}

@@ -381,2 +409,7 @@

canBeTargeted(el) {
if (!this.draggedNode || this.draggedNode === el) return false
return el.nodeName === 'LI' || (el.nodeName === 'UL' && el.classList.contains(this.classNames.placeholder))
}
onDragStart(e) {

@@ -390,8 +423,10 @@ this.draggedNode = e.target;

e.preventDefault(); // prevent default to allow drop
this.updateCoordination(e);
this.managePlaceholderLists(e);
}
onDragEnter(e) {
if (!(this.draggedNode && ['LI', 'UL'].includes(e.target.nodeName))) return
if (!this.canBeTargeted(e.target)) return
if (this.targetedNode) this.targetedNode.classList.remove(this.classNames.targeted);
this.removeClassFromEl(this.targetedNode, this.classNames.targeted);
this.targetedNode = e.target;

@@ -401,5 +436,2 @@ this.targetedNode.classList.add(this.classNames.targeted);

onDragLeave(e) {
}
onDragEnd(e) {

@@ -424,7 +456,2 @@ e.stopPropagation();

dragListener(e) {
this.updateCoordination(e);
this.managePlaceholderLists(e);
}
updateCoordination(e) {

@@ -447,10 +474,10 @@ this.calcMouseCoords(e);

dropTheItem(place, e) {
dropTheItem(place) {
switch (place) {
case 'before':
this.targetedNode.parentNode.insertBefore(this.draggedNode, this.targetedNode);
break;
break
case 'inside':
this.targetedNode.appendChild(this.draggedNode);
break;
break
}

@@ -467,3 +494,3 @@ }

if (!this.targetedNode) {
return;
return
}

@@ -487,7 +514,7 @@

cursorIsIndentedEnough() {
return this.cursor.X - this.targetNode.X > 50;
return this.cursor.X - this.targetNode.X > 50
}
mouseIsTooCloseToTop() {
return this.cursor.Y - this.targetNode.Y < this.distances.droppingEdge;
return this.cursor.Y - this.targetNode.Y < this.distances.droppingEdge
}

@@ -504,6 +531,6 @@

this.addPlaceholderList();
break;
break
case 'cleanup':
this.cleanupPlaceholderLists();
break;
break
}

@@ -514,8 +541,8 @@ });

targetedNodeIsPlaceholder() {
return this.targetedNode.nodeName === 'UL' && this.targetedNode.classList.contains(this.classNames.placeholder);
return this.targetedNode.nodeName === 'UL' && this.targetedNode.classList.contains(this.classNames.placeholder)
}
analysePlaceHolderSituation(e) {
analysePlaceHolderSituation() {
if (!this.targetedNode || this.areNested(this.targetedNode, this.draggedNode)) {
return [];
return []
}

@@ -535,3 +562,3 @@

return actions;
return actions
}

@@ -552,3 +579,3 @@

targetNodeIsIdentified() {
return !!this.targetedNode;
return !!this.targetedNode
}

@@ -593,3 +620,3 @@

this.placeholderInUse = this.placeholderUl.cloneNode(true);
return this.placeholderInUse;
return this.placeholderInUse
}

@@ -596,0 +623,0 @@ }

@@ -811,3 +811,3 @@ (function (global, factory) {

if (n === "Object" && o.constructor) n = o.constructor.name;
if (n === "Map" || n === "Set") return Array.from(n);
if (n === "Map" || n === "Set") return Array.from(o);
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return arrayLikeToArray(o, minLen);

@@ -914,3 +914,3 @@ }

value: function getItemPropProxyName(prop) {
if (this.propertyMap.hasOwnProperty(prop)) {
if (Object.prototype.hasOwnProperty.call(this.propertyMap, prop)) {
return this.propertyMap[prop];

@@ -945,3 +945,3 @@ }

}).reduce(function (groups, item) {
if (groups.hasOwnProperty(item.parent)) {
if (Object.prototype.hasOwnProperty.call(groups, item.parent)) {
groups[item.parent].push(item);

@@ -1149,2 +1149,4 @@ } else {

el = _ref.el,
_ref$init = _ref.init,
init = _ref$init === void 0 ? true : _ref$init,
listClassNames = _ref.listClassNames,

@@ -1170,2 +1172,3 @@ listItemClassNames = _ref.listItemClassNames,

};
this.initialised = false;
this.targetNode = {

@@ -1196,5 +1199,12 @@ X: null,

};
this.listEventListeners = {
dragover: this.onDragOver.bind(this),
dragstart: this.onDragStart.bind(this),
dragenter: this.onDragEnter.bind(this),
dragend: this.onDragEnd.bind(this),
drop: this.onDrop.bind(this)
};
this.maybeInitDataDom();
this.addListAttributes();
this.initDragAndDrop();
if (init) this.initDragAndDrop();
}

@@ -1225,4 +1235,6 @@

if (!(Array.isArray(this.data) && this.data.length)) return;
var wrapper = document.querySelector(this.selector);
var list = this.getDataEngine().render();
document.querySelector(this.selector).appendChild(list);
wrapper.innerHTML = '';
wrapper.appendChild(list);
}

@@ -1265,21 +1277,47 @@ }, {

}, {
key: "initDragAndDrop",
value: function initDragAndDrop() {
key: "toggleListItemAttributes",
value: function toggleListItemAttributes() {
var enable = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
this.getSortableList().querySelectorAll('li').forEach(function (el) {
el.setAttribute('draggable', enable);
});
}
}, {
key: "toggleListEventListeners",
value: function toggleListEventListeners() {
var _this2 = this;
document.addEventListener('dragover', this.dragListener.bind(this), false);
this.initPlaceholderList();
this.getSortableList().querySelectorAll('li').forEach(function (el) {
el.setAttribute('draggable', 'true');
el.addEventListener('dragstart', _this2.onDragStart.bind(_this2), false);
el.addEventListener('dragenter', _this2.onDragEnter.bind(_this2), false);
el.addEventListener('dragover', _this2.onDragOver.bind(_this2), false);
el.addEventListener('dragleave', _this2.onDragLeave.bind(_this2), false);
el.addEventListener('dragend', _this2.onDragEnd.bind(_this2), false);
el.addEventListener('drop', _this2.onDrop.bind(_this2), false);
_this2.addListItemStyles(el);
var remove = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
var list = this.getSortableList();
Object.keys(this.listEventListeners).forEach(function (event) {
if (remove) {
list.removeEventListener(event, _this2.listEventListeners[event]);
} else {
list.addEventListener(event, _this2.listEventListeners[event], false);
}
});
}
}, {
key: "initDragAndDrop",
value: function initDragAndDrop() {
if (this.initialised) return;
this.toggleListEventListeners();
this.initPlaceholderList();
this.toggleListItemAttributes();
this.getSortableList().querySelectorAll('li').forEach(this.addListItemStyles.bind(this));
this.initialised = true;
}
}, {
key: "init",
value: function init() {
this.initDragAndDrop();
}
}, {
key: "destroy",
value: function destroy() {
this.toggleListEventListeners(true);
this.toggleListItemAttributes(false);
this.initialised = false;
}
}, {
key: "getComputedStyleValue",

@@ -1307,2 +1345,8 @@ value: function getComputedStyleValue(el, prop) {

}, {
key: "canBeTargeted",
value: function canBeTargeted(el) {
if (!this.draggedNode || this.draggedNode === el) return false;
return el.nodeName === 'LI' || el.nodeName === 'UL' && el.classList.contains(this.classNames.placeholder);
}
}, {
key: "onDragStart",

@@ -1318,2 +1362,5 @@ value: function onDragStart(e) {

e.preventDefault(); // prevent default to allow drop
this.updateCoordination(e);
this.managePlaceholderLists(e);
}

@@ -1323,4 +1370,4 @@ }, {

value: function onDragEnter(e) {
if (!(this.draggedNode && ['LI', 'UL'].includes(e.target.nodeName))) return;
if (this.targetedNode) this.targetedNode.classList.remove(this.classNames.targeted);
if (!this.canBeTargeted(e.target)) return;
this.removeClassFromEl(this.targetedNode, this.classNames.targeted);
this.targetedNode = e.target;

@@ -1330,5 +1377,2 @@ this.targetedNode.classList.add(this.classNames.targeted);

}, {
key: "onDragLeave",
value: function onDragLeave(e) {}
}, {
key: "onDragEnd",

@@ -1355,8 +1399,2 @@ value: function onDragEnd(e) {

}, {
key: "dragListener",
value: function dragListener(e) {
this.updateCoordination(e);
this.managePlaceholderLists(e);
}
}, {
key: "updateCoordination",

@@ -1382,3 +1420,3 @@ value: function updateCoordination(e) {

key: "dropTheItem",
value: function dropTheItem(place, e) {
value: function dropTheItem(place) {
switch (place) {

@@ -1463,3 +1501,3 @@ case 'before':

key: "analysePlaceHolderSituation",
value: function analysePlaceHolderSituation(e) {
value: function analysePlaceHolderSituation() {
if (!this.targetedNode || this.areNested(this.targetedNode, this.draggedNode)) {

@@ -1466,0 +1504,0 @@ return [];

@@ -1,1 +0,1 @@

!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e=e||self).NestedSort=t()}(this,(function(){"use strict";function e(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function t(e,t){for(var r=0;r<t.length;r++){var a=t[r];a.enumerable=a.enumerable||!1,a.configurable=!0,"value"in a&&(a.writable=!0),Object.defineProperty(e,a.key,a)}}function r(e,r,a){return r&&t(e.prototype,r),a&&t(e,a),e}function a(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function n(e){return function(e){if(Array.isArray(e))return i(e)}(e)||function(e){if("undefined"!=typeof Symbol&&Symbol.iterator in Object(e))return Array.from(e)}(e)||function(e,t){if(!e)return;if("string"==typeof e)return i(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);"Object"===r&&e.constructor&&(r=e.constructor.name);if("Map"===r||"Set"===r)return Array.from(r);if("Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r))return i(e,t)}(e)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function i(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,a=new Array(t);r<t;r++)a[r]=e[r];return a}var s=function(){function t(r){var a=r.data,n=r.propertyMap,i=void 0===n?{}:n;e(this,t),this.data=a,this.sortedData=[],this.sortedDataDomArray=[],this.propertyMap=i,this.maybeTransformData()}return r(t,[{key:"maybeTransformData",value:function(){if(Object.keys(this.propertyMap).length){var e=this.getItemPropProxyName.bind(this);this.data=this.data.map((function(t){return new Proxy(t,{get:function(t,r,a){return Reflect.get(t,e(r),a)}})}))}}},{key:"getItemPropProxyName",value:function(e){return this.propertyMap.hasOwnProperty(e)?this.propertyMap[e]:e}},{key:"sortListItems",value:function(){return this.sortedData=n(this.data).sort((function(e,t){return!e.parent&&t.parent?-1:!t.parent&&e.parent?1:0})),this.sortedData}},{key:"createItemElement",value:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"li",r=e.id,a=e.text,n=document.createElement(t);return n.dataset.id=r,"li"===t&&(n.innerHTML=a),n}},{key:"elementIsParentOfItem",value:function(e,t){return e.dataset.id==="".concat(t.parent)}},{key:"getParentNodeOfItem",value:function(e,t,r){return e.querySelector("".concat(r,'[data-id="').concat(t.parent,'"]'))}},{key:"elementIsAncestorOfItem",value:function(e,t){return!!this.getParentNodeOfItem(e,t,"li")}},{key:"getDirectListParentOfItem",value:function(e,t){return this.getParentNodeOfItem(e,t,"ul")}},{key:"maybeAppendItemToParentDom",value:function(e){var t=this,r=e.parent,a=this.sortedDataDomArray.find((function(r){return t.elementIsParentOfItem(r,e)||t.elementIsAncestorOfItem(r,e)}));if(!a)return!1;var n=this.createItemElement(e),i=this.getDirectListParentOfItem(a,e);i||(i=this.createItemElement({id:r},"ul"),(this.getParentNodeOfItem(a,e,"li")||a).appendChild(i));return i.appendChild(n),!0}},{key:"getListItemsDom",value:function(){var e=this;this.sortedDataDomArray=[];for(var t=[];t.length!==this.sortListItems().length;)t=this.sortedData.reduce((function(t,r){var a,n=r.id;if(t.includes(n))return t;if(r.parent)a=e.maybeAppendItemToParentDom(r);else{var i=e.createItemElement(r);e.sortedDataDomArray.push(i),a=!0}return a&&t.push(n),t}),t);return this.sortedDataDomArray}},{key:"convertDomToData",value:function(e){var t=this;return Array.from(e.querySelectorAll("li")).map((function(e){var r,n=e.parentNode.dataset.id;return a(r={},t.getItemPropProxyName("id"),e.dataset.id),a(r,t.getItemPropProxyName("parent"),n),r}))}},{key:"render",value:function(){var e=document.createElement("ul");return this.getListItemsDom().forEach((function(t){return e.appendChild(t)})),e}}]),t}();return function(){function t(){var r=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},a=r.actions,n=(a=void 0===a?{}:a).onDrop,i=r.data,s=r.droppingEdge,o=void 0===s?15:s,d=r.el,l=r.listClassNames,u=r.propertyMap,c=void 0===u?{}:u;e(this,t),this.data=i,this.selector=d,this.sortableList=null,this.placeholderUl=null,this.placeholderInUse=null,this.draggedNode=null,this.targetedNode=null,this.listClassNames=this.createListClassNamesArray(l),this.propertyMap=c,this.actions={onDrop:n},this.targetNode={X:null,Y:null},this.distances={droppingEdge:o,droppingEdgeNegative:-1*o,mouseTo:{targetedElTop:void 0}},this.dimensions={targetedEl:{H:void 0}},this.cursor={X:null,Y:null},this.classNames={dragged:"ns-dragged",placeholder:"ns-placeholder",targeted:"ns-targeted"},this.maybeInitDataDom(),this.addListAttributes(),this.initDragAndDrop()}return r(t,[{key:"getDataEngine",value:function(){return this.dataEngine instanceof s||(this.dataEngine=new s({data:this.data,propertyMap:this.propertyMap})),this.dataEngine}},{key:"createListClassNamesArray",value:function(e){return e?Array.isArray(e)?e:e.split(" "):[]}},{key:"maybeInitDataDom",value:function(){if(Array.isArray(this.data)&&this.data.length){var e=this.getDataEngine().render();document.querySelector(this.selector).appendChild(e)}}},{key:"getSortableList",value:function(){if(this.sortableList instanceof HTMLUListElement)return this.sortableList;if(this.selector instanceof HTMLUListElement)this.sortableList=this.selector;else{var e=document.querySelector(this.selector);this.sortableList="UL"===e.nodeName?e:e.querySelector("ul")}return this.sortableList}},{key:"addListAttributes",value:function(){var e;(e=this.getSortableList().classList).add.apply(e,n(this.listClassNames))}},{key:"initDragAndDrop",value:function(){var e=this;document.addEventListener("dragover",this.dragListener.bind(this),!1),this.initPlaceholderList(),this.getSortableList().querySelectorAll("li").forEach((function(t){t.setAttribute("draggable","true"),t.addEventListener("dragstart",e.onDragStart.bind(e),!1),t.addEventListener("dragenter",e.onDragEnter.bind(e),!1),t.addEventListener("dragover",e.onDragOver.bind(e),!1),t.addEventListener("dragleave",e.onDragLeave.bind(e),!1),t.addEventListener("dragend",e.onDragEnd.bind(e),!1),t.addEventListener("drop",e.onDrop.bind(e),!1),e.addListItemStyles(t)}))}},{key:"getComputedStyleValue",value:function(e,t){return window.getComputedStyle(e,null).getPropertyValue(t)}},{key:"addListItemStyles",value:function(e){var t=this.getComputedStyleValue(e,"cursor");t&&"auto"!==t||(e.style.cursor="move")}},{key:"onDragStart",value:function(e){this.draggedNode=e.target,this.draggedNode.classList.add(this.classNames.dragged),e.dataTransfer.setData("text","Drag started!")}},{key:"onDragOver",value:function(e){e.preventDefault()}},{key:"onDragEnter",value:function(e){this.draggedNode&&["LI","UL"].includes(e.target.nodeName)&&(e.preventDefault(),this.targetedNode&&this.targetedNode.classList.remove(this.classNames.targeted),this.targetedNode=e.target,e.target.classList.add(this.classNames.targeted))}},{key:"onDragLeave",value:function(e){e.preventDefault(),e.target.removeEventListener("dragover",this.onDrop),e.target.removeEventListener("drop",this.onDrop),e.target.removeEventListener("dragleave",this.onDragLeave)}},{key:"onDragEnd",value:function(e){e.preventDefault(),e.stopPropagation(),this.draggedNode.classList.remove(this.classNames.dragged),this.targetedNode.classList.remove(this.classNames.targeted),this.cleanupPlaceholderLists(),this.draggedNode=null}},{key:"onDrop",value:function(e){e.preventDefault(),e.stopPropagation(),this.maybeDrop(),this.cleanupPlaceholderLists(),"function"==typeof this.actions.onDrop&&this.actions.onDrop(this.getDataEngine().convertDomToData(this.getSortableList()))}},{key:"dragListener",value:function(e){this.updateCoordination(e),this.managePlaceholderLists(e)}},{key:"updateCoordination",value:function(e){this.calcMouseCoords(e),this.calcMouseToTargetedElDist()}},{key:"maybeDrop",value:function(e){var t;this.canBeDropped()&&("LI"!==this.targetedNode.nodeName||this.cursorIsIndentedEnough()?"UL"===this.targetedNode.nodeName&&(t="inside"):t="before",t&&this.dropTheItem(t,e))}},{key:"dropTheItem",value:function(e,t){switch(e){case"before":this.targetedNode.parentNode.insertBefore(this.draggedNode,this.targetedNode);break;case"after":this.insertAfter(this.draggedNode,this.targetedNode);break;case"inside":this.targetedNode.appendChild(this.draggedNode)}}},{key:"calcMouseCoords",value:function(e){this.cursor.X=e.clientX,this.cursor.Y=e.clientY}},{key:"calcMouseToTargetedElDist",value:function(){if(this.targetedNode){var e=this.targetedNode.getBoundingClientRect();this.targetNode.X=e.left,this.targetNode.Y=e.top;var t=this.targetNode.Y-this.cursor.Y;this.distances.mouseTo.targetedElTop=t,this.distances.mouseTo.targetedElTopAbs=Math.abs(t),this.dimensions.targetedEl.H=this.targetedNode.clientHeight,this.distances.mouseTo.targetedElBot=this.distances.mouseTo.targetedElTopAbs-this.dimensions.targetedEl.H}}},{key:"areNested",value:function(e,t){return t&&Array.from(t.querySelectorAll("li")).some((function(t){return t===e}))}},{key:"cursorIsIndentedEnough",value:function(){return this.cursor.X-this.targetNode.X>50}},{key:"mouseIsTooCloseToTop",value:function(){return this.cursor.Y-this.targetNode.Y<this.distances.droppingEdge}},{key:"insertAfter",value:function(e,t){t.parentNode.insertBefore(e,t.nextSibling)}},{key:"managePlaceholderLists",value:function(e){var t=this;this.analysePlaceHolderSituation(e).forEach((function(e){switch(e){case"add":t.cleanupPlaceholderLists(),t.addPlaceholderList();break;case"cleanup":t.cleanupPlaceholderLists()}}))}},{key:"targetedNodeIsPlaceholder",value:function(){return"UL"===this.targetedNode.nodeName&&this.targetedNode.classList.contains(this.classNames.placeholder)}},{key:"analysePlaceHolderSituation",value:function(e){if(!this.targetedNode||this.areNested(this.targetedNode,this.draggedNode))return[];var t=[];return!this.cursorIsIndentedEnough()||this.mouseIsTooCloseToTop()?this.targetedNodeIsPlaceholder()||t.push("cleanup"):this.targetedNode===this.draggedNode||"LI"!==this.targetedNode.nodeName||this.targetedNode.querySelectorAll("ul").length||t.push("add"),t}},{key:"addPlaceholderList",value:function(){var e=this.getPlaceholderList();e.style.minHeight="0",this.targetedNode.appendChild(e),e.style.transition="min-height ease .2s",e.style.minHeight="".concat(this.draggedNode.offsetHeight,"px")}},{key:"targetNodeIsIdentified",value:function(){return!!this.targetedNode}},{key:"canBeDropped",value:function(){var e=!0;return e&=this.targetNodeIsIdentified()&&this.targetedNode!==this.draggedNode,e&=this.targetNodeIsIdentified()&&!("UL"===this.targetedNode.nodeName&&this.targetedNode.querySelectorAll("li").length),e&=!this.areNested(this.targetedNode,this.draggedNode)}},{key:"cleanupPlaceholderLists",value:function(){var e=this;this.getSortableList().querySelectorAll("ul").forEach((function(t){t.querySelectorAll("li").length?t.classList.contains(e.classNames.placeholder)&&(t.classList.remove(e.classNames.placeholder),t.style.minHeight="auto",t.dataset.id=t.parentNode.dataset.id):t.remove()}))}},{key:"initPlaceholderList",value:function(){this.placeholderUl=document.createElement("ul"),this.placeholderUl.classList.add(this.classNames.placeholder)}},{key:"getPlaceholderList",value:function(){return this.placeholderInUse=this.placeholderUl.cloneNode(!0),this.placeholderInUse}}]),t}()}));
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):(t=t||self).NestedSort=e()}(this,(function(){"use strict";var t=function(t,e){return t(e={exports:{}},e.exports),e.exports}((function(t){var e=function(t){var e=Object.prototype,r=e.hasOwnProperty,n="function"==typeof Symbol?Symbol:{},i=n.iterator||"@@iterator",o=n.asyncIterator||"@@asyncIterator",a=n.toStringTag||"@@toStringTag";function s(t,e,r,n){var i=e&&e.prototype instanceof u?e:u,o=Object.create(i.prototype),a=new I(n||[]);return o._invoke=function(t,e,r){var n="suspendedStart";return function(i,o){if("executing"===n)throw new Error("Generator is already running");if("completed"===n){if("throw"===i)throw o;return k()}for(r.method=i,r.arg=o;;){var a=r.delegate;if(a){var s=L(a,r);if(s){if(s===c)continue;return s}}if("next"===r.method)r.sent=r._sent=r.arg;else if("throw"===r.method){if("suspendedStart"===n)throw n="completed",r.arg;r.dispatchException(r.arg)}else"return"===r.method&&r.abrupt("return",r.arg);n="executing";var u=l(t,e,r);if("normal"===u.type){if(n=r.done?"completed":"suspendedYield",u.arg===c)continue;return{value:u.arg,done:r.done}}"throw"===u.type&&(n="completed",r.method="throw",r.arg=u.arg)}}}(t,r,a),o}function l(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}t.wrap=s;var c={};function u(){}function d(){}function h(){}var f={};f[i]=function(){return this};var g=Object.getPrototypeOf,p=g&&g(g(E([])));p&&p!==e&&r.call(p,i)&&(f=p);var y=h.prototype=u.prototype=Object.create(f);function v(t){["next","throw","return"].forEach((function(e){t[e]=function(t){return this._invoke(e,t)}}))}function m(t,e){var n;this._invoke=function(i,o){function a(){return new e((function(n,a){!function n(i,o,a,s){var c=l(t[i],t,o);if("throw"!==c.type){var u=c.arg,d=u.value;return d&&"object"==typeof d&&r.call(d,"__await")?e.resolve(d.__await).then((function(t){n("next",t,a,s)}),(function(t){n("throw",t,a,s)})):e.resolve(d).then((function(t){u.value=t,a(u)}),(function(t){return n("throw",t,a,s)}))}s(c.arg)}(i,o,n,a)}))}return n=n?n.then(a,a):a()}}function L(t,e){var r=t.iterator[e.method];if(void 0===r){if(e.delegate=null,"throw"===e.method){if(t.iterator.return&&(e.method="return",e.arg=void 0,L(t,e),"throw"===e.method))return c;e.method="throw",e.arg=new TypeError("The iterator does not provide a 'throw' method")}return c}var n=l(r,t.iterator,e.arg);if("throw"===n.type)return e.method="throw",e.arg=n.arg,e.delegate=null,c;var i=n.arg;return i?i.done?(e[t.resultName]=i.value,e.next=t.nextLoc,"return"!==e.method&&(e.method="next",e.arg=void 0),e.delegate=null,c):i:(e.method="throw",e.arg=new TypeError("iterator result is not an object"),e.delegate=null,c)}function N(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function b(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function I(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(N,this),this.reset(!0)}function E(t){if(t){var e=t[i];if(e)return e.call(t);if("function"==typeof t.next)return t;if(!isNaN(t.length)){var n=-1,o=function e(){for(;++n<t.length;)if(r.call(t,n))return e.value=t[n],e.done=!1,e;return e.value=void 0,e.done=!0,e};return o.next=o}}return{next:k}}function k(){return{value:void 0,done:!0}}return d.prototype=y.constructor=h,h.constructor=d,h[a]=d.displayName="GeneratorFunction",t.isGeneratorFunction=function(t){var e="function"==typeof t&&t.constructor;return!!e&&(e===d||"GeneratorFunction"===(e.displayName||e.name))},t.mark=function(t){return Object.setPrototypeOf?Object.setPrototypeOf(t,h):(t.__proto__=h,a in t||(t[a]="GeneratorFunction")),t.prototype=Object.create(y),t},t.awrap=function(t){return{__await:t}},v(m.prototype),m.prototype[o]=function(){return this},t.AsyncIterator=m,t.async=function(e,r,n,i,o){void 0===o&&(o=Promise);var a=new m(s(e,r,n,i),o);return t.isGeneratorFunction(r)?a:a.next().then((function(t){return t.done?t.value:a.next()}))},v(y),y[a]="Generator",y[i]=function(){return this},y.toString=function(){return"[object Generator]"},t.keys=function(t){var e=[];for(var r in t)e.push(r);return e.reverse(),function r(){for(;e.length;){var n=e.pop();if(n in t)return r.value=n,r.done=!1,r}return r.done=!0,r}},t.values=E,I.prototype={constructor:I,reset:function(t){if(this.prev=0,this.next=0,this.sent=this._sent=void 0,this.done=!1,this.delegate=null,this.method="next",this.arg=void 0,this.tryEntries.forEach(b),!t)for(var e in this)"t"===e.charAt(0)&&r.call(this,e)&&!isNaN(+e.slice(1))&&(this[e]=void 0)},stop:function(){this.done=!0;var t=this.tryEntries[0].completion;if("throw"===t.type)throw t.arg;return this.rval},dispatchException:function(t){if(this.done)throw t;var e=this;function n(r,n){return a.type="throw",a.arg=t,e.next=r,n&&(e.method="next",e.arg=void 0),!!n}for(var i=this.tryEntries.length-1;i>=0;--i){var o=this.tryEntries[i],a=o.completion;if("root"===o.tryLoc)return n("end");if(o.tryLoc<=this.prev){var s=r.call(o,"catchLoc"),l=r.call(o,"finallyLoc");if(s&&l){if(this.prev<o.catchLoc)return n(o.catchLoc,!0);if(this.prev<o.finallyLoc)return n(o.finallyLoc)}else if(s){if(this.prev<o.catchLoc)return n(o.catchLoc,!0)}else{if(!l)throw new Error("try statement without catch or finally");if(this.prev<o.finallyLoc)return n(o.finallyLoc)}}}},abrupt:function(t,e){for(var n=this.tryEntries.length-1;n>=0;--n){var i=this.tryEntries[n];if(i.tryLoc<=this.prev&&r.call(i,"finallyLoc")&&this.prev<i.finallyLoc){var o=i;break}}o&&("break"===t||"continue"===t)&&o.tryLoc<=e&&e<=o.finallyLoc&&(o=null);var a=o?o.completion:{};return a.type=t,a.arg=e,o?(this.method="next",this.next=o.finallyLoc,c):this.complete(a)},complete:function(t,e){if("throw"===t.type)throw t.arg;return"break"===t.type||"continue"===t.type?this.next=t.arg:"return"===t.type?(this.rval=this.arg=t.arg,this.method="return",this.next="end"):"normal"===t.type&&e&&(this.next=e),c},finish:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),b(r),c}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var i=n.arg;b(r)}return i}}throw new Error("illegal catch attempt")},delegateYield:function(t,e,r){return this.delegate={iterator:E(t),resultName:e,nextLoc:r},"next"===this.method&&(this.arg=void 0),c}},t}(t.exports);try{regeneratorRuntime=e}catch(t){Function("r","regeneratorRuntime = r")(e)}}));function e(t,e,r,n,i,o,a){try{var s=t[o](a),l=s.value}catch(t){return void r(t)}s.done?e(l):Promise.resolve(l).then(n,i)}var r=function(t){return function(){var r=this,n=arguments;return new Promise((function(i,o){var a=t.apply(r,n);function s(t){e(a,i,o,s,l,"next",t)}function l(t){e(a,i,o,s,l,"throw",t)}s(void 0)}))}};var n=function(t,e){(null==e||e>t.length)&&(e=t.length);for(var r=0,n=new Array(e);r<e;r++)n[r]=t[r];return n};var i=function(t){if(Array.isArray(t))return n(t)};var o=function(t){if("undefined"!=typeof Symbol&&Symbol.iterator in Object(t))return Array.from(t)};var a=function(t,e){if(t){if("string"==typeof t)return n(t,e);var r=Object.prototype.toString.call(t).slice(8,-1);return"Object"===r&&t.constructor&&(r=t.constructor.name),"Map"===r||"Set"===r?Array.from(t):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?n(t,e):void 0}};var s=function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")};var l=function(t){return i(t)||o(t)||a(t)||s()};var c=function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")};function u(t,e){for(var r=0;r<e.length;r++){var n=e[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}var d=function(t,e,r){return e&&u(t.prototype,e),r&&u(t,r),t};var h=function(t,e,r){return e in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t},f=function(){function t(e){var r=e.data,n=e.propertyMap,i=void 0===n?{}:n;c(this,t),this.data=r,this.sortedData=[],this.sortedDataDomArray=[],this.propertyMap=i,this.maybeTransformData()}return d(t,[{key:"maybeTransformData",value:function(){if(Object.keys(this.propertyMap).length){var t=this.getItemPropProxyName.bind(this);this.data=this.data.map((function(e){return new Proxy(e,{get:function(e,r,n){return Reflect.get(e,t(r),n)}})}))}}},{key:"getItemPropProxyName",value:function(t){return Object.prototype.hasOwnProperty.call(this.propertyMap,t)?this.propertyMap[t]:t}},{key:"isTopLevelItem",value:function(t){return!t.parent}},{key:"sortListItems",value:function(){var t=this,e=l(this.data),r=e.filter((function(e){return t.isTopLevelItem(e)})).sort((function(t,e){return t.order&&e.order?t.order-e.order:0})),n=e.filter((function(e){return!t.isTopLevelItem(e)})).reduce((function(t,e){return Object.prototype.hasOwnProperty.call(t,e.parent)?t[e.parent].push(e):t[e.parent]=[e],t}),{});return Object.keys(n).forEach((function(t){n[t].sort((function(t,e){return t.order&&e.order?t.order-e.order:0}))})),this.sortedData=[].concat(l(r),l(Object.values(n).flat())),this.sortedData}},{key:"createItemElement",value:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"li",r=t.id,n=t.text,i=document.createElement(e);return i.dataset.id=r,"li"===e&&(i.innerHTML=n),i}},{key:"elementIsParentOfItem",value:function(t,e){return t.dataset.id==="".concat(e.parent)}},{key:"getParentNodeOfItem",value:function(t,e,r){return t.querySelector("".concat(r,'[data-id="').concat(e.parent,'"]'))}},{key:"elementIsAncestorOfItem",value:function(t,e){return!!this.getParentNodeOfItem(t,e,"li")}},{key:"getDirectListParentOfItem",value:function(t,e){return this.getParentNodeOfItem(t,e,"ul")}},{key:"maybeAppendItemToParentDom",value:function(t){var e=this,r=t.parent,n=this.sortedDataDomArray.find((function(r){return e.elementIsParentOfItem(r,t)||e.elementIsAncestorOfItem(r,t)}));if(!n)return!1;var i=this.createItemElement(t),o=this.getDirectListParentOfItem(n,t);o||(o=this.createItemElement({id:r},"ul"),(this.getParentNodeOfItem(n,t,"li")||n).appendChild(o));return o.appendChild(i),!0}},{key:"getListItemsDom",value:function(){var t=this;this.sortedDataDomArray=[];for(var e=[];e.length!==this.sortListItems().length;)e=this.sortedData.reduce((function(e,r){var n,i=r.id;if(e.includes(i))return e;if(r.parent)n=t.maybeAppendItemToParentDom(r);else{var o=t.createItemElement(r);t.sortedDataDomArray.push(o),n=!0}return n&&e.push(i),e}),e);return this.sortedDataDomArray}},{key:"convertDomToData",value:function(t){var e=this;return Array.from(t.querySelectorAll("li")).map((function(t){var r,n=t.parentNode,i=n.dataset.id,o=Array.from(n.children).findIndex((function(e){return e===t}))+1;return h(r={},e.getItemPropProxyName("id"),t.dataset.id),h(r,e.getItemPropProxyName("parent"),i),h(r,e.getItemPropProxyName("order"),o),r}))}},{key:"render",value:function(){var t=document.createElement("ul");return this.getListItemsDom().forEach((function(e){return t.appendChild(e)})),t}}]),t}();return function(){function e(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},r=t.actions,n=(r=void 0===r?{}:r).onDrop,i=t.data,o=t.droppingEdge,a=void 0===o?15:o,s=t.el,l=t.init,u=void 0===l||l,d=t.listClassNames,h=t.listItemClassNames,f=t.propertyMap,g=void 0===f?{}:f;c(this,e),this.data=i,this.selector=s,this.sortableList=null,this.placeholderUl=null,this.placeholderInUse=null,this.draggedNode=null,this.targetedNode=null,this.listClassNames=this.createListClassNamesArray(d),this.listItemClassNames=this.createListClassNamesArray(h),this.propertyMap=g,this.actions={onDrop:n},this.initialised=!1,this.targetNode={X:null,Y:null},this.distances={droppingEdge:a,droppingEdgeNegative:-1*a,mouseTo:{targetedElTop:void 0}},this.dimensions={targetedEl:{H:void 0}},this.cursor={X:null,Y:null},this.classNames={dragged:"ns-dragged",placeholder:"ns-placeholder",targeted:"ns-targeted"},this.listEventListeners={dragover:this.onDragOver.bind(this),dragstart:this.onDragStart.bind(this),dragenter:this.onDragEnter.bind(this),dragend:this.onDragEnd.bind(this),drop:this.onDrop.bind(this)},this.maybeInitDataDom(),this.addListAttributes(),u&&this.initDragAndDrop()}var n;return d(e,[{key:"getDataEngine",value:function(){return this.dataEngine instanceof f||(this.dataEngine=new f({data:this.data,propertyMap:this.propertyMap})),this.dataEngine}},{key:"createListClassNamesArray",value:function(t){return t?Array.isArray(t)?t:t.split(" "):[]}},{key:"maybeInitDataDom",value:function(){if(Array.isArray(this.data)&&this.data.length){var t=document.querySelector(this.selector),e=this.getDataEngine().render();t.innerHTML="",t.appendChild(e)}}},{key:"getSortableList",value:function(){if(this.sortableList instanceof HTMLUListElement)return this.sortableList;if(this.selector instanceof HTMLUListElement)this.sortableList=this.selector;else{var t=document.querySelector(this.selector);this.sortableList="UL"===t.nodeName?t:t.querySelector("ul")}return this.sortableList}},{key:"addListAttributes",value:function(){var t,e=this,r=this.getSortableList();(t=r.classList).add.apply(t,l(this.listClassNames)),r.querySelectorAll("ul").forEach((function(t){var r;(r=t.classList).add.apply(r,l(e.listClassNames))})),r.querySelectorAll("li").forEach((function(t){var r;(r=t.classList).add.apply(r,l(e.listItemClassNames))}))}},{key:"toggleListItemAttributes",value:function(){var t=!(arguments.length>0&&void 0!==arguments[0])||arguments[0];this.getSortableList().querySelectorAll("li").forEach((function(e){e.setAttribute("draggable",t)}))}},{key:"toggleListEventListeners",value:function(){var t=this,e=arguments.length>0&&void 0!==arguments[0]&&arguments[0],r=this.getSortableList();Object.keys(this.listEventListeners).forEach((function(n){e?r.removeEventListener(n,t.listEventListeners[n]):r.addEventListener(n,t.listEventListeners[n],!1)}))}},{key:"initDragAndDrop",value:function(){this.initialised||(this.toggleListEventListeners(),this.initPlaceholderList(),this.toggleListItemAttributes(),this.getSortableList().querySelectorAll("li").forEach(this.addListItemStyles.bind(this)),this.initialised=!0)}},{key:"init",value:function(){this.initDragAndDrop()}},{key:"destroy",value:function(){this.toggleListEventListeners(!0),this.toggleListItemAttributes(!1),this.initialised=!1}},{key:"getComputedStyleValue",value:function(t,e){return window.getComputedStyle(t,null).getPropertyValue(e)}},{key:"addListItemStyles",value:function(t){var e=this.getComputedStyleValue(t,"cursor");e&&"auto"!==e||(t.style.cursor="move")}},{key:"removeClassFromEl",value:function(t,e){t&&t.classList.contains(e)&&t.classList.remove(e)}},{key:"canBeTargeted",value:function(t){return!(!this.draggedNode||this.draggedNode===t)&&("LI"===t.nodeName||"UL"===t.nodeName&&t.classList.contains(this.classNames.placeholder))}},{key:"onDragStart",value:function(t){this.draggedNode=t.target,this.draggedNode.classList.add(this.classNames.dragged),t.dataTransfer.setData("text","Drag started!")}},{key:"onDragOver",value:function(t){t.preventDefault(),this.updateCoordination(t),this.managePlaceholderLists(t)}},{key:"onDragEnter",value:function(t){this.canBeTargeted(t.target)&&(this.removeClassFromEl(this.targetedNode,this.classNames.targeted),this.targetedNode=t.target,this.targetedNode.classList.add(this.classNames.targeted))}},{key:"onDragEnd",value:function(t){t.stopPropagation(),this.removeClassFromEl(this.draggedNode,this.classNames.dragged),this.removeClassFromEl(this.targetedNode,this.classNames.targeted),this.cleanupPlaceholderLists(),this.draggedNode=null,this.targetedNode=null}},{key:"onDrop",value:function(t){t.stopPropagation(),this.maybeDrop(),this.cleanupPlaceholderLists(),"function"==typeof this.actions.onDrop&&this.actions.onDrop(this.getDataEngine().convertDomToData(this.getSortableList()))}},{key:"updateCoordination",value:function(t){this.calcMouseCoords(t),this.calcMouseToTargetedElDist()}},{key:"getDropLocation",value:function(){if(this.canBeDropped()){if("LI"===this.targetedNode.nodeName&&!this.cursorIsIndentedEnough())return"before";if("UL"===this.targetedNode.nodeName)return"inside"}}},{key:"maybeDrop",value:function(t){var e=this.getDropLocation();e&&this.dropTheItem(e,t)}},{key:"dropTheItem",value:function(t){switch(t){case"before":this.targetedNode.parentNode.insertBefore(this.draggedNode,this.targetedNode);break;case"inside":this.targetedNode.appendChild(this.draggedNode)}}},{key:"calcMouseCoords",value:function(t){this.cursor.X=t.clientX,this.cursor.Y=t.clientY}},{key:"calcMouseToTargetedElDist",value:function(){if(this.targetedNode){var t=this.targetedNode.getBoundingClientRect();this.targetNode.X=t.left,this.targetNode.Y=t.top;var e=this.targetNode.Y-this.cursor.Y;this.distances.mouseTo.targetedElTop=e,this.distances.mouseTo.targetedElTopAbs=Math.abs(e),this.dimensions.targetedEl.H=this.targetedNode.clientHeight,this.distances.mouseTo.targetedElBot=this.distances.mouseTo.targetedElTopAbs-this.dimensions.targetedEl.H}}},{key:"areNested",value:function(t,e){return e&&Array.from(e.querySelectorAll("li")).some((function(e){return e===t}))}},{key:"cursorIsIndentedEnough",value:function(){return this.cursor.X-this.targetNode.X>50}},{key:"mouseIsTooCloseToTop",value:function(){return this.cursor.Y-this.targetNode.Y<this.distances.droppingEdge}},{key:"managePlaceholderLists",value:function(t){var e=this;this.analysePlaceHolderSituation(t).forEach((function(t){switch(t){case"add":e.cleanupPlaceholderLists(),e.addPlaceholderList();break;case"cleanup":e.cleanupPlaceholderLists()}}))}},{key:"targetedNodeIsPlaceholder",value:function(){return"UL"===this.targetedNode.nodeName&&this.targetedNode.classList.contains(this.classNames.placeholder)}},{key:"analysePlaceHolderSituation",value:function(){if(!this.targetedNode||this.areNested(this.targetedNode,this.draggedNode))return[];var t=[];return!this.cursorIsIndentedEnough()||this.mouseIsTooCloseToTop()?this.targetedNodeIsPlaceholder()||t.push("cleanup"):this.targetedNode===this.draggedNode||"LI"!==this.targetedNode.nodeName||this.targetedNode.querySelectorAll("ul").length||t.push("add"),t}},{key:"animatePlaceholderList",value:function(){this.placeholderInUse.style.minHeight="0",this.placeholderInUse.style.transition="min-height ease .2s",this.placeholderInUse.style.minHeight="".concat(this.draggedNode.offsetHeight,"px")}},{key:"addPlaceholderList",value:(n=r(t.mark((function e(){return t.wrap((function(t){for(;;)switch(t.prev=t.next){case 0:return this.getPlaceholderList(),t.next=3,this.targetedNode.appendChild(this.placeholderInUse);case 3:this.animatePlaceholderList();case 4:case"end":return t.stop()}}),e,this)}))),function(){return n.apply(this,arguments)})},{key:"targetNodeIsIdentified",value:function(){return!!this.targetedNode}},{key:"targetNodeIsBeingDragged",value:function(){return this.targetNodeIsIdentified()&&this.targetedNode===this.draggedNode}},{key:"targetNodeIsListWithItems",value:function(){return this.targetNodeIsIdentified()&&"UL"===this.targetedNode.nodeName&&this.targetedNode.querySelectorAll("li").length}},{key:"canBeDropped",value:function(){return this.targetNodeIsIdentified()&&!this.targetNodeIsBeingDragged()&&!this.targetNodeIsListWithItems()&&!this.areNested(this.targetedNode,this.draggedNode)}},{key:"cleanupPlaceholderLists",value:function(){var t=this;this.getSortableList().querySelectorAll("ul").forEach((function(e){e.querySelectorAll("li").length?e.classList.contains(t.classNames.placeholder)&&(e.classList.remove(t.classNames.placeholder),e.style.minHeight="auto",e.dataset.id=e.parentNode.dataset.id):e.remove()}))}},{key:"initPlaceholderList",value:function(){var t;this.placeholderUl=document.createElement("ul"),(t=this.placeholderUl.classList).add.apply(t,[this.classNames.placeholder].concat(l(this.listClassNames)))}},{key:"getPlaceholderList",value:function(){return this.placeholderInUse=this.placeholderUl.cloneNode(!0),this.placeholderInUse}}]),e}()}));
{
"name": "nested-sort",
"version": "4.2.1",
"version": "4.3.0",
"author": "Hesam Bahrami (Genzo)",

@@ -9,2 +9,3 @@ "description": "A JavaScript library to create a nested list of elements",

"browser": "dist/nested-sort.umd.js",
"browserMin": "dist/nested-sort.umd.min.js",
"license": "MIT",

@@ -28,3 +29,5 @@ "repository": {

"rollup-plugin-commonjs": "10.1.0",
"rollup-plugin-eslint": "^7.0.0",
"rollup-plugin-node-resolve": "5.2.0",
"rollup-plugin-terser": "^6.1.0",
"serve": "11.3.0"

@@ -31,0 +34,0 @@ },

# Nested Sort
[![npm version](https://badge.fury.io/js/nested-sort.svg)](https://badge.fury.io/js/nested-sort)
[![](https://data.jsdelivr.com/v1/package/npm/nested-sort/badge)](https://www.jsdelivr.com/package/npm/nested-sort)

@@ -15,3 +16,3 @@ Nested Sort is a vanilla JavaScript library, without any dependencies, which helps you to sort a nested list of items via drag and drop. Unfortunately, it does not support touch screens yet.

* [CDN copies](https://www.jsdelivr.com/package/npm/nested-sort) [![](https://data.jsdelivr.com/v1/package/npm/nested-sort/badge)](https://www.jsdelivr.com/package/npm/nested-sort)
* [CDN copies](https://www.jsdelivr.com/package/npm/nested-sort)

@@ -18,0 +19,0 @@ ## Installation

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc