Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@dnd-kit/sortable

Package Overview
Dependencies
Maintainers
1
Versions
103
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@dnd-kit/sortable - npm Package Compare versions

Comparing version 7.0.0-next-2022212212756 to 7.0.0-next-202221516253

6

CHANGELOG.md
# @dnd-kit/sortable
## 7.0.0-next-2022212212756
## 7.0.0-next-202221516253
### Patch Changes
- Updated dependencies [[`2439aae`](https://github.com/clauderic/dnd-kit/commit/2439aaea86fad793f0da75e2319e174a27142658)]:
- @dnd-kit/core@5.1.0-next-2022212212756
- Updated dependencies [[`c1b3b5a`](https://github.com/clauderic/dnd-kit/commit/c1b3b5a0be5759b707e22c4e1b1236aaa82773a2)]:
- @dnd-kit/core@5.1.0-next-202221516253

@@ -10,0 +10,0 @@ ## 6.0.1

@@ -577,2 +577,3 @@ 'use strict';

active,
droppableRects,
droppableContainers,

@@ -635,2 +636,3 @@ collisionRect,

collisionRect: collisionRect,
droppableRects,
droppableContainers: filteredContainers,

@@ -637,0 +639,0 @@ pointerCoordinates: null

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

"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),r=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,n=require("@dnd-kit/core"),i=require("@dnd-kit/utilities");function o(e,t,r){const n=e.slice();return n.splice(r<0?n.length+r:r,0,n.splice(t,1)[0]),n}function s(e,t){return e.reduce((e,r,n)=>{const i=t.get(r);return i&&(e[n]=i),e},Array(e.length))}function a(e){return null!==e&&e>=0}const d={scaleX:1,scaleY:1},c=({rects:e,activeIndex:t,overIndex:r,index:n})=>{const i=o(e,r,t),s=e[n],a=i[n];return a&&s?{x:a.left-s.left,y:a.top-s.top,scaleX:a.width/s.width,scaleY:a.height/s.height}:null},l={scaleX:1,scaleY:1},u=r.createContext({activeIndex:-1,containerId:"Sortable",disableTransforms:!1,items:[],overIndex:-1,useDragOverlay:!1,sortedRects:[],strategy:c}),f=({id:e,items:t,activeIndex:r,overIndex:n})=>o(t,r,n).indexOf(e),x=({containerId:e,isSorting:t,wasDragging:r,index:n,items:i,newIndex:o,previousItems:s,previousContainerId:a,transition:d})=>!(!d||!r||s!==i&&n===o||!t&&(o===n||e!==a)),g={duration:200,easing:"ease"},p=i.CSS.Transition.toString({property:"transform",duration:0,easing:"linear"}),h={roleDescription:"sortable"},v=[n.KeyboardCode.Down,n.KeyboardCode.Right,n.KeyboardCode.Up,n.KeyboardCode.Left];exports.SortableContext=function({children:e,id:o,items:a,strategy:d=c}){const{active:l,dragOverlay:f,droppableRects:x,over:g,measureDroppableContainers:p,measuringScheduled:h}=n.useDndContext(),v=i.useUniqueId("Sortable",o),I=Boolean(null!==f.rect),y=t.useMemo(()=>a.map(e=>"string"==typeof e?e:e.id),[a]),b=null!=l,m=l?y.indexOf(l.id):-1,w=g?y.indexOf(g.id):-1,C=t.useRef(y),S=(R=C.current,!(y.join()===R.join()));var R;const D=-1!==w&&-1===m||S;i.useIsomorphicLayoutEffect(()=>{S&&b&&!h&&p(y)},[S,y,b,p,h]),t.useEffect(()=>{C.current=y},[y]);const O=t.useMemo(()=>({activeIndex:m,containerId:v,disableTransforms:D,items:y,overIndex:w,useDragOverlay:I,sortedRects:s(y,x),strategy:d}),[m,v,D,y,w,x,I,d]);return r.createElement(u.Provider,{value:O},e)},exports.arrayMove=o,exports.arraySwap=function(e,t,r){const n=e.slice();return n[t]=e[r],n[r]=e[t],n},exports.defaultAnimateLayoutChanges=x,exports.defaultNewIndexGetter=f,exports.horizontalListSortingStrategy=({rects:e,activeNodeRect:t,activeIndex:r,overIndex:n,index:i})=>{var o;const s=null!=(o=e[r])?o:t;if(!s)return null;const a=function(e,t,r){const n=e[t],i=e[t-1],o=e[t+1];return n&&(i||o)?r<t?i?n.left-(i.left+i.width):o.left-(n.left+n.width):o?o.left-(n.left+n.width):n.left-(i.left+i.width):0}(e,i,r);if(i===r){const t=e[n];return t?{x:r<n?t.left+t.width-(s.left+s.width):t.left-s.left,y:0,...d}:null}return i>r&&i<=n?{x:-s.width-a,y:0,...d}:i<r&&i>=n?{x:s.width+a,y:0,...d}:{x:0,y:0,...d}},exports.rectSortingStrategy=c,exports.rectSwappingStrategy=({activeIndex:e,index:t,rects:r,overIndex:n})=>{let i,o;return t===e&&(i=r[t],o=r[n]),t===n&&(i=r[t],o=r[e]),o&&i?{x:o.left-i.left,y:o.top-i.top,scaleX:o.width/i.width,scaleY:o.height/i.height}:null},exports.sortableKeyboardCoordinates=(e,{context:{active:t,droppableContainers:r,collisionRect:i,scrollableAncestors:o}})=>{if(v.includes(e.code)){if(e.preventDefault(),!t||!i)return;const s=[];r.getEnabled().forEach(t=>{if(!t||(null==t?void 0:t.disabled))return;const r=null==t?void 0:t.rect.current;if(r)switch(e.code){case n.KeyboardCode.Down:i.top+i.height<=r.top&&s.push(t);break;case n.KeyboardCode.Up:i.top>=r.top+r.height&&s.push(t);break;case n.KeyboardCode.Left:i.left>=r.left+r.width&&s.push(t);break;case n.KeyboardCode.Right:i.left+i.width<=r.left&&s.push(t)}});const a=n.closestCorners({active:t,collisionRect:i,droppableContainers:s,pointerCoordinates:null}),d=n.getFirstCollision(a,"id");if(null!=d){const e=r.get(d),t=null==e?void 0:e.node.current,s=null==e?void 0:e.rect.current;if(t&&s){const e=n.getScrollableAncestors(t).some((e,t)=>o[t]!==e)?{x:0,y:0}:{x:i.width-s.width,y:i.height-s.height};return{x:s.left-e.x,y:s.top-e.y}}}}},exports.useSortable=function({animateLayoutChanges:e=x,attributes:r,disabled:o,data:s,getNewIndex:d=f,id:c,strategy:l,resizeObserverConfig:v,transition:I=g}){const{items:y,containerId:b,activeIndex:m,disableTransforms:w,sortedRects:C,overIndex:S,useDragOverlay:R,strategy:D}=t.useContext(u),O=y.indexOf(c),N=t.useMemo(()=>({sortable:{containerId:b,index:O,items:y},...s}),[b,s,O,y]),E=t.useMemo(()=>y.slice(y.indexOf(c)),[y,c]),{rect:K,node:L,isOver:M,setNodeRef:T}=n.useDroppable({id:c,data:N,resizeObserverConfig:{updateMeasurementsFor:E,...v}}),{active:k,activatorEvent:q,activeNodeRect:A,attributes:X,setNodeRef:Y,listeners:j,isDragging:z,over:F,transform:U}=n.useDraggable({id:c,data:N,attributes:{...h,...r},disabled:o}),B=i.useCombinedRefs(T,Y),P=Boolean(k),_=P&&!w&&a(m)&&a(S),G=!R&&z,H=G&&_?U:null,J=_?null!=H?H:(null!=l?l:D)({rects:C,activeNodeRect:A,activeIndex:m,overIndex:S,index:O}):null,Q=a(m)&&a(S)?d({id:c,items:y,activeIndex:m,overIndex:S}):O,V=null==k?void 0:k.id,W=t.useRef({activeId:V,items:y,newIndex:Q,containerId:b}),Z=y!==W.current.items,$=e({active:k,containerId:b,isDragging:z,isSorting:P,id:c,index:O,items:y,newIndex:W.current.newIndex,previousItems:W.current.items,previousContainerId:W.current.containerId,transition:I,wasDragging:null!=W.current.activeId}),ee=function({disabled:e,index:r,node:o,rect:s}){const[a,d]=t.useState(null),c=t.useRef(r);return i.useIsomorphicLayoutEffect(()=>{if(!e&&r!==c.current&&o.current){const e=s.current;if(e){const t=n.getClientRect(o.current,{ignoreTransform:!0}),r={x:e.left-t.left,y:e.top-t.top,scaleX:e.width/t.width,scaleY:e.height/t.height};(r.x||r.y)&&d(r)}}r!==c.current&&(c.current=r)},[e,r,o,s]),t.useEffect(()=>{a&&requestAnimationFrame(()=>{d(null)})},[a]),a}({disabled:!$,index:O,node:L,rect:K});return t.useEffect(()=>{P&&W.current.newIndex!==Q&&(W.current.newIndex=Q),b!==W.current.containerId&&(W.current.containerId=b),y!==W.current.items&&(W.current.items=y),V!==W.current.activeId&&(W.current.activeId=V)},[V,P,Q,b,y]),{active:k,activeIndex:m,attributes:X,rect:K,index:O,newIndex:Q,items:y,isOver:M,isSorting:P,isDragging:z,listeners:j,node:L,overIndex:S,over:F,setNodeRef:B,setDroppableNodeRef:T,setDraggableNodeRef:Y,transform:null!=ee?ee:J,transition:ee||Z&&W.current.newIndex===O?p:G&&!i.isKeyboardEvent(q)||!I?void 0:P||$?i.CSS.Transition.toString({...I,property:"transform"}):void 0}},exports.verticalListSortingStrategy=({activeIndex:e,activeNodeRect:t,index:r,rects:n,overIndex:i})=>{var o;const s=null!=(o=n[e])?o:t;if(!s)return null;if(r===e){const t=n[i];return t?{x:0,y:e<i?t.top+t.height-(s.top+s.height):t.top-s.top,...l}:null}const a=function(e,t,r){const n=e[t],i=e[t-1],o=e[t+1];return n?r<t?i?n.top-(i.top+i.height):o?o.top-(n.top+n.height):0:o?o.top-(n.top+n.height):i?n.top-(i.top+i.height):0:0}(n,r,e);return r>e&&r<=i?{x:0,y:-s.height-a,...l}:r<e&&r>=i?{x:0,y:s.height+a,...l}:{x:0,y:0,...l}};
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),r=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,n=require("@dnd-kit/core"),i=require("@dnd-kit/utilities");function o(e,t,r){const n=e.slice();return n.splice(r<0?n.length+r:r,0,n.splice(t,1)[0]),n}function s(e,t){return e.reduce((e,r,n)=>{const i=t.get(r);return i&&(e[n]=i),e},Array(e.length))}function a(e){return null!==e&&e>=0}const d={scaleX:1,scaleY:1},c=({rects:e,activeIndex:t,overIndex:r,index:n})=>{const i=o(e,r,t),s=e[n],a=i[n];return a&&s?{x:a.left-s.left,y:a.top-s.top,scaleX:a.width/s.width,scaleY:a.height/s.height}:null},l={scaleX:1,scaleY:1},u=r.createContext({activeIndex:-1,containerId:"Sortable",disableTransforms:!1,items:[],overIndex:-1,useDragOverlay:!1,sortedRects:[],strategy:c}),f=({id:e,items:t,activeIndex:r,overIndex:n})=>o(t,r,n).indexOf(e),x=({containerId:e,isSorting:t,wasDragging:r,index:n,items:i,newIndex:o,previousItems:s,previousContainerId:a,transition:d})=>!(!d||!r||s!==i&&n===o||!t&&(o===n||e!==a)),p={duration:200,easing:"ease"},g=i.CSS.Transition.toString({property:"transform",duration:0,easing:"linear"}),h={roleDescription:"sortable"},v=[n.KeyboardCode.Down,n.KeyboardCode.Right,n.KeyboardCode.Up,n.KeyboardCode.Left];exports.SortableContext=function({children:e,id:o,items:a,strategy:d=c}){const{active:l,dragOverlay:f,droppableRects:x,over:p,measureDroppableContainers:g,measuringScheduled:h}=n.useDndContext(),v=i.useUniqueId("Sortable",o),I=Boolean(null!==f.rect),y=t.useMemo(()=>a.map(e=>"string"==typeof e?e:e.id),[a]),b=null!=l,m=l?y.indexOf(l.id):-1,w=p?y.indexOf(p.id):-1,C=t.useRef(y),S=(R=C.current,!(y.join()===R.join()));var R;const D=-1!==w&&-1===m||S;i.useIsomorphicLayoutEffect(()=>{S&&b&&!h&&g(y)},[S,y,b,g,h]),t.useEffect(()=>{C.current=y},[y]);const O=t.useMemo(()=>({activeIndex:m,containerId:v,disableTransforms:D,items:y,overIndex:w,useDragOverlay:I,sortedRects:s(y,x),strategy:d}),[m,v,D,y,w,x,I,d]);return r.createElement(u.Provider,{value:O},e)},exports.arrayMove=o,exports.arraySwap=function(e,t,r){const n=e.slice();return n[t]=e[r],n[r]=e[t],n},exports.defaultAnimateLayoutChanges=x,exports.defaultNewIndexGetter=f,exports.horizontalListSortingStrategy=({rects:e,activeNodeRect:t,activeIndex:r,overIndex:n,index:i})=>{var o;const s=null!=(o=e[r])?o:t;if(!s)return null;const a=function(e,t,r){const n=e[t],i=e[t-1],o=e[t+1];return n&&(i||o)?r<t?i?n.left-(i.left+i.width):o.left-(n.left+n.width):o?o.left-(n.left+n.width):n.left-(i.left+i.width):0}(e,i,r);if(i===r){const t=e[n];return t?{x:r<n?t.left+t.width-(s.left+s.width):t.left-s.left,y:0,...d}:null}return i>r&&i<=n?{x:-s.width-a,y:0,...d}:i<r&&i>=n?{x:s.width+a,y:0,...d}:{x:0,y:0,...d}},exports.rectSortingStrategy=c,exports.rectSwappingStrategy=({activeIndex:e,index:t,rects:r,overIndex:n})=>{let i,o;return t===e&&(i=r[t],o=r[n]),t===n&&(i=r[t],o=r[e]),o&&i?{x:o.left-i.left,y:o.top-i.top,scaleX:o.width/i.width,scaleY:o.height/i.height}:null},exports.sortableKeyboardCoordinates=(e,{context:{active:t,droppableRects:r,droppableContainers:i,collisionRect:o,scrollableAncestors:s}})=>{if(v.includes(e.code)){if(e.preventDefault(),!t||!o)return;const a=[];i.getEnabled().forEach(t=>{if(!t||(null==t?void 0:t.disabled))return;const r=null==t?void 0:t.rect.current;if(r)switch(e.code){case n.KeyboardCode.Down:o.top+o.height<=r.top&&a.push(t);break;case n.KeyboardCode.Up:o.top>=r.top+r.height&&a.push(t);break;case n.KeyboardCode.Left:o.left>=r.left+r.width&&a.push(t);break;case n.KeyboardCode.Right:o.left+o.width<=r.left&&a.push(t)}});const d=n.closestCorners({active:t,collisionRect:o,droppableRects:r,droppableContainers:a,pointerCoordinates:null}),c=n.getFirstCollision(d,"id");if(null!=c){const e=i.get(c),t=null==e?void 0:e.node.current,r=null==e?void 0:e.rect.current;if(t&&r){const e=n.getScrollableAncestors(t).some((e,t)=>s[t]!==e)?{x:0,y:0}:{x:o.width-r.width,y:o.height-r.height};return{x:r.left-e.x,y:r.top-e.y}}}}},exports.useSortable=function({animateLayoutChanges:e=x,attributes:r,disabled:o,data:s,getNewIndex:d=f,id:c,strategy:l,resizeObserverConfig:v,transition:I=p}){const{items:y,containerId:b,activeIndex:m,disableTransforms:w,sortedRects:C,overIndex:S,useDragOverlay:R,strategy:D}=t.useContext(u),O=y.indexOf(c),N=t.useMemo(()=>({sortable:{containerId:b,index:O,items:y},...s}),[b,s,O,y]),E=t.useMemo(()=>y.slice(y.indexOf(c)),[y,c]),{rect:K,node:L,isOver:M,setNodeRef:T}=n.useDroppable({id:c,data:N,resizeObserverConfig:{updateMeasurementsFor:E,...v}}),{active:k,activatorEvent:q,activeNodeRect:A,attributes:X,setNodeRef:Y,listeners:j,isDragging:z,over:F,transform:U}=n.useDraggable({id:c,data:N,attributes:{...h,...r},disabled:o}),B=i.useCombinedRefs(T,Y),P=Boolean(k),_=P&&!w&&a(m)&&a(S),G=!R&&z,H=G&&_?U:null,J=_?null!=H?H:(null!=l?l:D)({rects:C,activeNodeRect:A,activeIndex:m,overIndex:S,index:O}):null,Q=a(m)&&a(S)?d({id:c,items:y,activeIndex:m,overIndex:S}):O,V=null==k?void 0:k.id,W=t.useRef({activeId:V,items:y,newIndex:Q,containerId:b}),Z=y!==W.current.items,$=e({active:k,containerId:b,isDragging:z,isSorting:P,id:c,index:O,items:y,newIndex:W.current.newIndex,previousItems:W.current.items,previousContainerId:W.current.containerId,transition:I,wasDragging:null!=W.current.activeId}),ee=function({disabled:e,index:r,node:o,rect:s}){const[a,d]=t.useState(null),c=t.useRef(r);return i.useIsomorphicLayoutEffect(()=>{if(!e&&r!==c.current&&o.current){const e=s.current;if(e){const t=n.getClientRect(o.current,{ignoreTransform:!0}),r={x:e.left-t.left,y:e.top-t.top,scaleX:e.width/t.width,scaleY:e.height/t.height};(r.x||r.y)&&d(r)}}r!==c.current&&(c.current=r)},[e,r,o,s]),t.useEffect(()=>{a&&requestAnimationFrame(()=>{d(null)})},[a]),a}({disabled:!$,index:O,node:L,rect:K});return t.useEffect(()=>{P&&W.current.newIndex!==Q&&(W.current.newIndex=Q),b!==W.current.containerId&&(W.current.containerId=b),y!==W.current.items&&(W.current.items=y),V!==W.current.activeId&&(W.current.activeId=V)},[V,P,Q,b,y]),{active:k,activeIndex:m,attributes:X,rect:K,index:O,newIndex:Q,items:y,isOver:M,isSorting:P,isDragging:z,listeners:j,node:L,overIndex:S,over:F,setNodeRef:B,setDroppableNodeRef:T,setDraggableNodeRef:Y,transform:null!=ee?ee:J,transition:ee||Z&&W.current.newIndex===O?g:G&&!i.isKeyboardEvent(q)||!I?void 0:P||$?i.CSS.Transition.toString({...I,property:"transform"}):void 0}},exports.verticalListSortingStrategy=({activeIndex:e,activeNodeRect:t,index:r,rects:n,overIndex:i})=>{var o;const s=null!=(o=n[e])?o:t;if(!s)return null;if(r===e){const t=n[i];return t?{x:0,y:e<i?t.top+t.height-(s.top+s.height):t.top-s.top,...l}:null}const a=function(e,t,r){const n=e[t],i=e[t-1],o=e[t+1];return n?r<t?i?n.top-(i.top+i.height):o?o.top-(n.top+n.height):0:o?o.top-(n.top+n.height):i?n.top-(i.top+i.height):0:0}(n,r,e);return r>e&&r<=i?{x:0,y:-s.height-a,...l}:r<e&&r>=i?{x:0,y:s.height+a,...l}:{x:0,y:0,...l}};
//# sourceMappingURL=sortable.cjs.production.min.js.map

@@ -570,2 +570,3 @@ import React, { useMemo, useRef, useEffect, useState, useContext } from 'react';

active,
droppableRects,
droppableContainers,

@@ -628,2 +629,3 @@ collisionRect,

collisionRect: collisionRect,
droppableRects,
droppableContainers: filteredContainers,

@@ -630,0 +632,0 @@ pointerCoordinates: null

{
"name": "@dnd-kit/sortable",
"version": "7.0.0-next-2022212212756",
"version": "7.0.0-next-202221516253",
"description": "Official sortable preset and sensors for dnd kit",

@@ -34,6 +34,6 @@ "author": "Claudéric Demers",

"react": ">=16.8.0",
"@dnd-kit/core": "^5.1.0-next-2022212212756"
"@dnd-kit/core": "^5.1.0-next-202221516253"
},
"devDependencies": {
"@dnd-kit/core": "^5.1.0-next-2022212212756"
"@dnd-kit/core": "^5.1.0-next-202221516253"
},

@@ -40,0 +40,0 @@ "publishConfig": {

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

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

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc