@jswork/react-draggable-list - npm Package Compare versions

Comparing version 1.1.8 to 1.1.10

dist/index.cjs.js

@@ -1,2 +0,2 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }var J=Object.create;var x=Object.defineProperty,Y=Object.defineProperties,$=Object.getOwnPropertyDescriptor,F=Object.getOwnPropertyDescriptors,V=Object.getOwnPropertyNames,C=Object.getOwnPropertySymbols,k=Object.getPrototypeOf,I=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable;var v=(n,t,e)=>t in n?x(n,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):n[t]=e,A=(n,t)=>{for(var e in t||(t={}))I.call(t,e)&&v(n,e,t[e]);if(C)for(var e of C(t))b.call(t,e)&&v(n,e,t[e]);return n},w=(n,t)=>Y(n,F(t)),i=(n,t)=>x(n,"name",{value:t,configurable:!0});var P=(n,t)=>{var e={};for(var s in n)I.call(n,s)&&t.indexOf(s)<0&&(e[s]=n[s]);if(n!=null&&C)for(var s of C(n))t.indexOf(s)<0&&b.call(n,s)&&(e[s]=n[s]);return e};var R=(n,t)=>()=>(t||n((t={exports:{}}).exports,t),t.exports);var q=(n,t,e,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of V(t))!I.call(n,o)&&o!==e&&x(n,o,{get:()=>t[o],enumerable:!(s=$(t,o))||s.enumerable});return n};var E=(n,t,e)=>(e=n!=null?J(k(n)):{},q(t||!n||!n.__esModule?x(e,"default",{value:n,enumerable:!0}):e,n));var c=(n,t,e)=>(v(n,typeof t!="symbol"?t+"":t,e),e);var j=R((f,U)=>{"use strict";Object.defineProperty(f,"__esModule",{value:!0});var T=i(function(){},"NOOP"),z="",H=[],Q={};U.exports=T;f.default=T;f.NOOP_STRING=z;f.NOOP_ARRAY=H;f.NOOP_OBJECT=Q});var B=R((ne,S)=>{(function(){"use strict";var n={}.hasOwnProperty;function t(){for(var o="",r=0;r<arguments.length;r++){var a=arguments[r];a&&(o=s(o,e(a)))}return o}i(t,"classNames");function e(o){if(typeof o=="string"||typeof o=="number")return o;if(typeof o!="object")return"";if(Array.isArray(o))return t.apply(null,o);if(o.toString!==Object.prototype.toString&&!o.toString.toString().includes("[native code]"))return o.toString();var r="";for(var a in o)n.call(o,a)&&o[a]&&(r=s(r,a));return r}i(e,"parseValue");function s(o,r){return r?o?o+" "+r:o+r:o}i(s,"appendClass"),typeof S!="undefined"&&S.exports?(t.default=t,S.exports=t):typeof define=="function"&&typeof define.amd=="object"&&define.amd?define("classnames",[],function(){return t}):window.classNames=t})()});var g=E(j()),D=E(B());var _reactlist = require('@jswork/react-list'); var _reactlist2 = _interopRequireDefault(_reactlist);var _react = require('react'); var _react2 = _interopRequireDefault(_react);var _sortablejs = require('sortablejs'); var _sortablejs2 = _interopRequireDefault(_sortablejs);var y="react-draggable-list",L={animation:300,draggable:`.${y}__item`,ghostClass:"react-draggable-list__ghost",chosenClass:"react-draggable-list__chosen",dragClass:"react-draggable-list__drag"},u={nextSibling:null,activeComponent:null},ee=i(()=>Math.random().toString(36).substr(2),"randomKey"),l=class l extends _react.Component{constructor(e){super(e);c(this,"cacheKey");c(this,"template",i(({item:e,index:s})=>{let{template:o,rowKey:r}=this.props;return _react2.default.createElement("div",{key:e[r],className:`${y}__item`},o({item:e,index:s}))},"template"));c(this,"handleUpdate",i(e=>{this.fixDomNodeError(e);let{oldIndex:s,newIndex:o}=e,{name:r,items:a,onChange:m,onChooseDrop:p,rowKey:h}=this.props,d=a[s];o<s?(a.splice(s,1),a.splice(o,0,d)):(a.splice(o+1,0,d),a.splice(s,1));let O=a.map(N=>N[h]);m({target:{value:O}}),p({target:{value:d[h],name:r}})},"handleUpdate"));c(this,"handleAdd",i(e=>{this.fixDomNodeError(e);let{newIndex:s,oldIndex:o}=e,{cacheKey:r}=e.from.dataset,a=l.cachedItems[r],{name:m,items:p,onChange:h,onChooseDrop:d,rowKey:O}=this.props,N=a[o];p.splice(s,0,N);let M=p.map(G=>G[O]);h({target:{value:M}}),d({target:{value:N[O],name:m}})},"handleAdd"));c(this,"handleRemove",i(e=>{let{oldIndex:s}=e,{items:o,onChange:r,rowKey:a}=this.props;o.splice(s,1);let m=o.map(p=>p[a]);r({target:{value:m}})},"handleRemove"));c(this,"handleChoose",i(e=>{u.nextSibling=e.item.nextElementSibling,u.activeComponent=this},"handleChoose"));c(this,"handleRef",i(e=>{if(!e)return;let{rowKey:s,options:o}=this.props,r=A({dataIdAttr:s,onUpdate:this.handleUpdate,onAdd:this.handleAdd,onRemove:this.handleRemove,onChoose:this.handleChoose},o);_sortablejs2.default.create(e,r)},"handleRef"));c(this,"fixDomNodeError",i(e=>{let s=u.nextSibling&&u.nextSibling.parentNode!==null?u.nextSibling:null;e.from.insertBefore(e.item,s)},"fixDomNodeError"));let{items:s}=e;this.cacheKey=ee(),l.cachedItems[this.cacheKey]=s}shouldComponentUpdate(e){let{items:s}=e;return l.cachedItems[this.cacheKey]=s,!0}render(){let d=this.props,{className:e,children:s,items:o,template:r,rowKey:a,options:m,onChooseDrop:p}=d,h=P(d,["className","children","items","template","rowKey","options","onChooseDrop"]);return _react2.default.createElement("div",w(A({"data-component":y,"data-cache-key":this.cacheKey,className:(0,D.default)(y,e)},h),{ref:this.handleRef}),_react2.default.createElement(_reactlist2.default,{items:o,template:this.template}),s)}};i(l,"ReactDraggableList"),c(l,"displayName",y),c(l,"defaultProps",{onChange:g.default,onChooseDrop:g.default,items:[],template:g.default,rowKey:"id",options:L}),c(l,"cachedItems",{});var _=l;exports.default = _;
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }var J=Object.create;var v=Object.defineProperty;var Y=Object.getOwnPropertyDescriptor;var $=Object.getOwnPropertyNames,I=Object.getOwnPropertySymbols,F=Object.getPrototypeOf,x=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable;var g=(s,t,e)=>t in s?v(s,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):s[t]=e,K=(s,t)=>{for(var e in t||(t={}))x.call(t,e)&&g(s,e,t[e]);if(I)for(var e of I(t))_.call(t,e)&&g(s,e,t[e]);return s};var l=(s,t)=>v(s,"name",{value:t,configurable:!0});var P=(s,t)=>{var e={};for(var o in s)x.call(s,o)&&t.indexOf(o)<0&&(e[o]=s[o]);if(s!=null&&I)for(var o of I(s))t.indexOf(o)<0&&_.call(s,o)&&(e[o]=s[o]);return e};var E=(s,t)=>()=>(t||s((t={exports:{}}).exports,t),t.exports);var q=(s,t,e,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of $(t))!x.call(s,n)&&n!==e&&v(s,n,{get:()=>t[n],enumerable:!(o=Y(t,n))||o.enumerable});return s};var R=(s,t,e)=>(e=s!=null?J(F(s)):{},q(t||!s||!s.__esModule?v(e,"default",{value:s,enumerable:!0}):e,s));var d=(s,t,e)=>(g(s,typeof t!="symbol"?t+"":t,e),e);var T=E((u,j)=>{"use strict";Object.defineProperty(u,"__esModule",{value:!0});var b=l(function(){},"NOOP"),z="",D=[],H={};j.exports=b;u.default=b;u.NOOP_STRING=z;u.NOOP_ARRAY=D;u.NOOP_OBJECT=H});var U=E((ee,C)=>{(function(){"use strict";var s={}.hasOwnProperty;function t(){for(var e=[],o=0;o<arguments.length;o++){var n=arguments[o];if(n){var c=typeof n;if(c==="string"||c==="number")e.push(n);else if(Array.isArray(n)){if(n.length){var r=t.apply(null,n);r&&e.push(r)}}else if(c==="object")if(n.toString===Object.prototype.toString)for(var h in n)s.call(n,h)&&n[h]&&e.push(h);else e.push(n.toString())}}return e.join(" ")}l(t,"classNames"),typeof C!="undefined"&&C.exports?(t.default=t,C.exports=t):typeof define=="function"&&typeof define.amd=="object"&&define.amd?define("classnames",[],function(){return t}):window.classNames=t})()});var O=R(T()),B=R(U());var _reactlist = require('@jswork/react-list'); var _reactlist2 = _interopRequireDefault(_reactlist);var _react = require('react'); var _react2 = _interopRequireDefault(_react);var _reactsortablejs = require('react-sortablejs');var N="react-draggable-list",W={animation:300,draggable:`.${N}__item`,ghostClass:"react-draggable-list__ghost",chosenClass:"react-draggable-list__chosen",dragClass:"react-draggable-list__drag"},X=l(()=>Math.random().toString(36).substr(2),"randomKey"),p=class p extends _react.Component{constructor(e){super(e);d(this,"cacheKey");d(this,"template",l(({item:e,index:o})=>{let{template:n,rowKey:c}=this.props;return _react2.default.createElement("div",{key:e[c],className:`${N}__item`},n({item:e,index:o}))},"template"));d(this,"handleAdd",l(e=>{let{newIndex:o,oldIndex:n,from:c}=e,r=c.id,h=p.cachedItems[r],m=p.cachedItems[this.cacheKey],{name:a,onChange:i,onChooseDrop:f,rowKey:y}=this.props,S=h[n];m.splice(o,0,S);let M=m.map(G=>G[y]);this.execChange(m),i({target:{value:M}}),f({target:{value:S[y],name:a}})},"handleAdd"));d(this,"handleRemove",l(e=>{let{oldIndex:o,from:n}=e,c=n.id,r=p.cachedItems[c],{onChange:h,rowKey:m}=this.props;r.splice(o,1);let a=r.map(i=>i[m]);this.execChange(r),h({target:{value:a}})},"handleRemove"));d(this,"handleUpdate",l(e=>{let{oldIndex:o,newIndex:n}=e,{name:c,onChange:r,onChooseDrop:h,rowKey:m}=this.props,{stateItems:a}=this.state,i=a[o];n<o?(a.splice(o,1),a.splice(n,0,i)):(a.splice(n+1,0,i),a.splice(o,1));let f=a.map(y=>y[m]);this.execChange(a),r({target:{value:f}}),h({target:{value:i[m],name:c}})},"handleUpdate"));d(this,"execChange",l(e=>{this.setState({stateItems:e.slice(0)})},"execChange"));let{items:o}=e;this.cacheKey=X(),p.cachedItems[this.cacheKey]=o,this.state={stateItems:o}}render(){let f=this.props,{className:e,children:o,template:n,rowKey:c,options:r,onChooseDrop:h,emptySlot:m}=f,a=P(f,["className","children","template","rowKey","options","onChooseDrop","emptySlot"]),{stateItems:i}=this.state;return i.length===0&&m?m:_react2.default.createElement(_reactsortablejs.ReactSortable,K(K({id:this.cacheKey,group:name,className:(0,B.default)(N,e),list:i,setList:O.default,onUpdate:this.handleUpdate,onAdd:this.handleAdd,onRemove:this.handleRemove},r),a),i.length>0&&_react2.default.createElement(_reactlist2.default,{items:i,template:this.template}))}};l(p,"ReactDraggableList"),d(p,"displayName",N),d(p,"defaultProps",{onChange:O.default,onChooseDrop:O.default,items:[],template:O.default,rowKey:"id",options:W}),d(p,"cachedItems",{});var A=p;exports.default = A;
 /*! Bundled license information:
@@ -6,5 +6,5 @@
   (*!
-  	Copyright (c) 2018 Jed Watson.
-  	Licensed under the MIT License (MIT), see
-  	http://jedwatson.github.io/classnames
+    Copyright (c) 2018 Jed Watson.
+    Licensed under the MIT License (MIT), see
+    http://jedwatson.github.io/classnames
   *)
@@ -11,0 +11,0 @@ */

dist/index.d.ts

@@ -10,2 +10,3 @@ import React, { Component } from 'react';
     }) => React.ReactNode;
+    emptySlot?: React.ReactNode;
     className?: string;
@@ -21,3 +22,6 @@ onChange?: (inEvent: {
 }
-declare class ReactDraggableList extends Component<ReactDraggableListProps> {
+interface ReactDraggableListState {
+    stateItems: any[];
+}
+declare class ReactDraggableList extends Component<ReactDraggableListProps, ReactDraggableListState> {
     static displayName: string;
@@ -41,3 +45,2 @@ static defaultProps: {
     constructor(inProps: any);
-    shouldComponentUpdate(nextProps: Readonly<ReactDraggableListProps>): boolean;
     template: ({ item, index }: {
@@ -47,11 +50,9 @@ item: any;
     }) => React.JSX.Element;
-    handleUpdate: (inEvent: any) => void;
     handleAdd: (inEvent: any) => void;
     handleRemove: (inEvent: any) => void;
-    handleChoose: (inEvent: any) => void;
-    handleRef: (inElement: any) => void;
-    fixDomNodeError: (inEvent: any) => void;
-    render(): React.JSX.Element;
+    handleUpdate: (inEvent: any) => void;
+    execChange: (inItems: any) => void;
+    render(): string | number | true | Iterable<React.ReactNode> | React.JSX.Element;
 }
 
 export { type ReactDraggableListProps, ReactDraggableList as default };

dist/index.esm.js

@@ -1,2 +0,2 @@
-var J=Object.create;var x=Object.defineProperty,Y=Object.defineProperties,$=Object.getOwnPropertyDescriptor,F=Object.getOwnPropertyDescriptors,V=Object.getOwnPropertyNames,C=Object.getOwnPropertySymbols,k=Object.getPrototypeOf,I=Object.prototype.hasOwnProperty,b=Object.prototype.propertyIsEnumerable;var v=(n,t,e)=>t in n?x(n,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):n[t]=e,A=(n,t)=>{for(var e in t||(t={}))I.call(t,e)&&v(n,e,t[e]);if(C)for(var e of C(t))b.call(t,e)&&v(n,e,t[e]);return n},w=(n,t)=>Y(n,F(t)),i=(n,t)=>x(n,"name",{value:t,configurable:!0});var P=(n,t)=>{var e={};for(var s in n)I.call(n,s)&&t.indexOf(s)<0&&(e[s]=n[s]);if(n!=null&&C)for(var s of C(n))t.indexOf(s)<0&&b.call(n,s)&&(e[s]=n[s]);return e};var R=(n,t)=>()=>(t||n((t={exports:{}}).exports,t),t.exports);var q=(n,t,e,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of V(t))!I.call(n,o)&&o!==e&&x(n,o,{get:()=>t[o],enumerable:!(s=$(t,o))||s.enumerable});return n};var E=(n,t,e)=>(e=n!=null?J(k(n)):{},q(t||!n||!n.__esModule?x(e,"default",{value:n,enumerable:!0}):e,n));var c=(n,t,e)=>(v(n,typeof t!="symbol"?t+"":t,e),e);var j=R((f,U)=>{"use strict";Object.defineProperty(f,"__esModule",{value:!0});var T=i(function(){},"NOOP"),z="",H=[],Q={};U.exports=T;f.default=T;f.NOOP_STRING=z;f.NOOP_ARRAY=H;f.NOOP_OBJECT=Q});var B=R((ne,S)=>{(function(){"use strict";var n={}.hasOwnProperty;function t(){for(var o="",r=0;r<arguments.length;r++){var a=arguments[r];a&&(o=s(o,e(a)))}return o}i(t,"classNames");function e(o){if(typeof o=="string"||typeof o=="number")return o;if(typeof o!="object")return"";if(Array.isArray(o))return t.apply(null,o);if(o.toString!==Object.prototype.toString&&!o.toString.toString().includes("[native code]"))return o.toString();var r="";for(var a in o)n.call(o,a)&&o[a]&&(r=s(r,a));return r}i(e,"parseValue");function s(o,r){return r?o?o+" "+r:o+r:o}i(s,"appendClass"),typeof S!="undefined"&&S.exports?(t.default=t,S.exports=t):typeof define=="function"&&typeof define.amd=="object"&&define.amd?define("classnames",[],function(){return t}):window.classNames=t})()});var g=E(j()),D=E(B());import W from"@jswork/react-list";import K,{Component as X}from"react";import Z from"sortablejs";var y="react-draggable-list",L={animation:300,draggable:`.${y}__item`,ghostClass:"react-draggable-list__ghost",chosenClass:"react-draggable-list__chosen",dragClass:"react-draggable-list__drag"},u={nextSibling:null,activeComponent:null},ee=i(()=>Math.random().toString(36).substr(2),"randomKey"),l=class l extends X{constructor(e){super(e);c(this,"cacheKey");c(this,"template",i(({item:e,index:s})=>{let{template:o,rowKey:r}=this.props;return K.createElement("div",{key:e[r],className:`${y}__item`},o({item:e,index:s}))},"template"));c(this,"handleUpdate",i(e=>{this.fixDomNodeError(e);let{oldIndex:s,newIndex:o}=e,{name:r,items:a,onChange:m,onChooseDrop:p,rowKey:h}=this.props,d=a[s];o<s?(a.splice(s,1),a.splice(o,0,d)):(a.splice(o+1,0,d),a.splice(s,1));let O=a.map(N=>N[h]);m({target:{value:O}}),p({target:{value:d[h],name:r}})},"handleUpdate"));c(this,"handleAdd",i(e=>{this.fixDomNodeError(e);let{newIndex:s,oldIndex:o}=e,{cacheKey:r}=e.from.dataset,a=l.cachedItems[r],{name:m,items:p,onChange:h,onChooseDrop:d,rowKey:O}=this.props,N=a[o];p.splice(s,0,N);let M=p.map(G=>G[O]);h({target:{value:M}}),d({target:{value:N[O],name:m}})},"handleAdd"));c(this,"handleRemove",i(e=>{let{oldIndex:s}=e,{items:o,onChange:r,rowKey:a}=this.props;o.splice(s,1);let m=o.map(p=>p[a]);r({target:{value:m}})},"handleRemove"));c(this,"handleChoose",i(e=>{u.nextSibling=e.item.nextElementSibling,u.activeComponent=this},"handleChoose"));c(this,"handleRef",i(e=>{if(!e)return;let{rowKey:s,options:o}=this.props,r=A({dataIdAttr:s,onUpdate:this.handleUpdate,onAdd:this.handleAdd,onRemove:this.handleRemove,onChoose:this.handleChoose},o);Z.create(e,r)},"handleRef"));c(this,"fixDomNodeError",i(e=>{let s=u.nextSibling&&u.nextSibling.parentNode!==null?u.nextSibling:null;e.from.insertBefore(e.item,s)},"fixDomNodeError"));let{items:s}=e;this.cacheKey=ee(),l.cachedItems[this.cacheKey]=s}shouldComponentUpdate(e){let{items:s}=e;return l.cachedItems[this.cacheKey]=s,!0}render(){let d=this.props,{className:e,children:s,items:o,template:r,rowKey:a,options:m,onChooseDrop:p}=d,h=P(d,["className","children","items","template","rowKey","options","onChooseDrop"]);return K.createElement("div",w(A({"data-component":y,"data-cache-key":this.cacheKey,className:(0,D.default)(y,e)},h),{ref:this.handleRef}),K.createElement(W,{items:o,template:this.template}),s)}};i(l,"ReactDraggableList"),c(l,"displayName",y),c(l,"defaultProps",{onChange:g.default,onChooseDrop:g.default,items:[],template:g.default,rowKey:"id",options:L}),c(l,"cachedItems",{});var _=l;export{_ as default};
+var J=Object.create;var v=Object.defineProperty;var Y=Object.getOwnPropertyDescriptor;var $=Object.getOwnPropertyNames,I=Object.getOwnPropertySymbols,F=Object.getPrototypeOf,x=Object.prototype.hasOwnProperty,_=Object.prototype.propertyIsEnumerable;var g=(s,t,e)=>t in s?v(s,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):s[t]=e,K=(s,t)=>{for(var e in t||(t={}))x.call(t,e)&&g(s,e,t[e]);if(I)for(var e of I(t))_.call(t,e)&&g(s,e,t[e]);return s};var l=(s,t)=>v(s,"name",{value:t,configurable:!0});var P=(s,t)=>{var e={};for(var o in s)x.call(s,o)&&t.indexOf(o)<0&&(e[o]=s[o]);if(s!=null&&I)for(var o of I(s))t.indexOf(o)<0&&_.call(s,o)&&(e[o]=s[o]);return e};var E=(s,t)=>()=>(t||s((t={exports:{}}).exports,t),t.exports);var q=(s,t,e,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of $(t))!x.call(s,n)&&n!==e&&v(s,n,{get:()=>t[n],enumerable:!(o=Y(t,n))||o.enumerable});return s};var R=(s,t,e)=>(e=s!=null?J(F(s)):{},q(t||!s||!s.__esModule?v(e,"default",{value:s,enumerable:!0}):e,s));var d=(s,t,e)=>(g(s,typeof t!="symbol"?t+"":t,e),e);var T=E((u,j)=>{"use strict";Object.defineProperty(u,"__esModule",{value:!0});var b=l(function(){},"NOOP"),z="",D=[],H={};j.exports=b;u.default=b;u.NOOP_STRING=z;u.NOOP_ARRAY=D;u.NOOP_OBJECT=H});var U=E((ee,C)=>{(function(){"use strict";var s={}.hasOwnProperty;function t(){for(var e=[],o=0;o<arguments.length;o++){var n=arguments[o];if(n){var c=typeof n;if(c==="string"||c==="number")e.push(n);else if(Array.isArray(n)){if(n.length){var r=t.apply(null,n);r&&e.push(r)}}else if(c==="object")if(n.toString===Object.prototype.toString)for(var h in n)s.call(n,h)&&n[h]&&e.push(h);else e.push(n.toString())}}return e.join(" ")}l(t,"classNames"),typeof C!="undefined"&&C.exports?(t.default=t,C.exports=t):typeof define=="function"&&typeof define.amd=="object"&&define.amd?define("classnames",[],function(){return t}):window.classNames=t})()});var O=R(T()),B=R(U());import L from"@jswork/react-list";import w,{Component as Q}from"react";import{ReactSortable as V}from"react-sortablejs";var N="react-draggable-list",W={animation:300,draggable:`.${N}__item`,ghostClass:"react-draggable-list__ghost",chosenClass:"react-draggable-list__chosen",dragClass:"react-draggable-list__drag"},X=l(()=>Math.random().toString(36).substr(2),"randomKey"),p=class p extends Q{constructor(e){super(e);d(this,"cacheKey");d(this,"template",l(({item:e,index:o})=>{let{template:n,rowKey:c}=this.props;return w.createElement("div",{key:e[c],className:`${N}__item`},n({item:e,index:o}))},"template"));d(this,"handleAdd",l(e=>{let{newIndex:o,oldIndex:n,from:c}=e,r=c.id,h=p.cachedItems[r],m=p.cachedItems[this.cacheKey],{name:a,onChange:i,onChooseDrop:f,rowKey:y}=this.props,S=h[n];m.splice(o,0,S);let M=m.map(G=>G[y]);this.execChange(m),i({target:{value:M}}),f({target:{value:S[y],name:a}})},"handleAdd"));d(this,"handleRemove",l(e=>{let{oldIndex:o,from:n}=e,c=n.id,r=p.cachedItems[c],{onChange:h,rowKey:m}=this.props;r.splice(o,1);let a=r.map(i=>i[m]);this.execChange(r),h({target:{value:a}})},"handleRemove"));d(this,"handleUpdate",l(e=>{let{oldIndex:o,newIndex:n}=e,{name:c,onChange:r,onChooseDrop:h,rowKey:m}=this.props,{stateItems:a}=this.state,i=a[o];n<o?(a.splice(o,1),a.splice(n,0,i)):(a.splice(n+1,0,i),a.splice(o,1));let f=a.map(y=>y[m]);this.execChange(a),r({target:{value:f}}),h({target:{value:i[m],name:c}})},"handleUpdate"));d(this,"execChange",l(e=>{this.setState({stateItems:e.slice(0)})},"execChange"));let{items:o}=e;this.cacheKey=X(),p.cachedItems[this.cacheKey]=o,this.state={stateItems:o}}render(){let f=this.props,{className:e,children:o,template:n,rowKey:c,options:r,onChooseDrop:h,emptySlot:m}=f,a=P(f,["className","children","template","rowKey","options","onChooseDrop","emptySlot"]),{stateItems:i}=this.state;return i.length===0&&m?m:w.createElement(V,K(K({id:this.cacheKey,group:name,className:(0,B.default)(N,e),list:i,setList:O.default,onUpdate:this.handleUpdate,onAdd:this.handleAdd,onRemove:this.handleRemove},r),a),i.length>0&&w.createElement(L,{items:i,template:this.template}))}};l(p,"ReactDraggableList"),d(p,"displayName",N),d(p,"defaultProps",{onChange:O.default,onChooseDrop:O.default,items:[],template:O.default,rowKey:"id",options:W}),d(p,"cachedItems",{});var A=p;export{A as default};
 /*! Bundled license information:
@@ -6,7 +6,7 @@
   (*!
-  	Copyright (c) 2018 Jed Watson.
-  	Licensed under the MIT License (MIT), see
-  	http://jedwatson.github.io/classnames
+    Copyright (c) 2018 Jed Watson.
+    Licensed under the MIT License (MIT), see
+    http://jedwatson.github.io/classnames
   *)
 */
 //# sourceMappingURL=index.esm.js.map

package.json

 {
   "name": "@jswork/react-draggable-list",
   "description": "A simple draggable list component.",
-  "version": "1.1.8",
+  "version": "1.1.10",
   "main": "dist/index.cjs.js",
@@ -25,2 +25,3 @@ "module": "dist/index.esm.js",
     "@types/react-dom": "^18.2.13",
+    "@types/sortablejs": "^1.15.7",
     "autoprefixer": "^10.4.16",
@@ -40,2 +41,3 @@ "cssnano": "^6.0.1",
     "@types/sortablejs": "^1.15.7",
+    "react-sortablejs": "^6.1.4",
     "sortablejs": "^1.15.1"
@@ -42,0 +44,0 @@ },

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

42997

decreased by-6.83%

Dependency count

4

increased by33.33%

Dev dependency count

10

increased by11.11%

Lines of code

237

decreased by-2.87%

Dependency changes

• + Addedreact-sortablejs@^6.1.4

• + Addedclassnames@2.3.1(transitive)

• + Addedjs-tokens@4.0.0(transitive)

• + Addedloose-envify@1.4.0(transitive)

• + Addedreact@18.3.1(transitive)

• + Addedreact-dom@18.3.1(transitive)

• + Addedreact-sortablejs@6.1.4(transitive)

• + Addedscheduler@0.23.2(transitive)

• + Addedtiny-invariant@1.2.0(transitive)