@dnd-kit/sortable
Advanced tools
@dnd-kit/sortable - npm Package Compare versions
Comparing version 7.0.0-next-20224211110 to 7.0.0-next-20224211189
| # @dnd-kit/sortable | ||
| ## 7.0.0-next-20224211110 | ||
| ## 7.0.0-next-20224211189 | ||
| ### Major Changes | ||
| - [#755](https://github.com/clauderic/dnd-kit/pull/755) [`33e6dd2`](https://github.com/clauderic/dnd-kit/commit/33e6dd2dc954f1f2da90d8f8af995021031b6b41) Thanks [@clauderic](https://github.com/clauderic)! - The `UniqueIdentifier` type has been updated to now accept either `string` or `number` identifiers. As a result, the `id` property of `useDraggable`, `useDroppable` and `useSortable` and the `items` prop of `<SortableContext>` now all accept either `string` or `number` identifiers. | ||
| #### Migration steps | ||
| For consumers that are using TypeScript, import the `UniqueIdentifier` type to have strongly typed local state: | ||
| ```diff | ||
| + import type {UniqueIdentifier} from '@dnd-kit/core'; | ||
| function MyComponent() { | ||
| - const [items, setItems] = useState(['A', 'B', 'C']); | ||
| + const [items, setItems] = useState<UniqueIdentifier>(['A', 'B', 'C']); | ||
| } | ||
| ``` | ||
| Alternatively, consumers can cast or convert the `id` property to a `string` when reading the `id` property of interfaces such as `Active`, `Over`, `DroppableContainer` and `DraggableNode`. | ||
| The `draggableNodes` object has also been converted to a map. Consumers that were reading from the `draggableNodes` property that is available on the public context of `<DndContext>` should follow these migration steps: | ||
| ```diff | ||
| - draggableNodes[someId]; | ||
| + draggableNodes.get(someId); | ||
| ``` | ||
| - [#660](https://github.com/clauderic/dnd-kit/pull/660) [`30bbd12`](https://github.com/clauderic/dnd-kit/commit/30bbd12f9606c2e99523cb9ece465041cb37e916) Thanks [@clauderic](https://github.com/clauderic)! - Changes to the default `sortableKeyboardCoordinates` KeyboardSensor coordinate getter. | ||
@@ -98,5 +122,5 @@ | ||
| - Updated dependencies [[`4173087`](https://github.com/clauderic/dnd-kit/commit/417308704454c50f88ab305ab450a99bde5034b0), [`59ca82b`](https://github.com/clauderic/dnd-kit/commit/59ca82b9f228f34c7731ece87aef5d9633608b57), [`7161f70`](https://github.com/clauderic/dnd-kit/commit/7161f702c9fe06f8dafa6449d48b918070ca46fb), [`a52fba1`](https://github.com/clauderic/dnd-kit/commit/a52fba1ccff8a8f40e2cb8dcc15236cfd9e8fbec), [`40707ce`](https://github.com/clauderic/dnd-kit/commit/40707ce6f388957203d6df4ccbeef460450ffd7d), [`a41e5b8`](https://github.com/clauderic/dnd-kit/commit/a41e5b8eff84f0528ffc8b3455b94b95ab60a4a9), [`bf30718`](https://github.com/clauderic/dnd-kit/commit/bf30718bc22584a47053c14f5920e317ac45cd50), [`a41e5b8`](https://github.com/clauderic/dnd-kit/commit/a41e5b8eff84f0528ffc8b3455b94b95ab60a4a9), [`a41e5b8`](https://github.com/clauderic/dnd-kit/commit/a41e5b8eff84f0528ffc8b3455b94b95ab60a4a9), [`035021a`](https://github.com/clauderic/dnd-kit/commit/035021aac51161e2bf9715f087a6dd1b46647bfc), [`77e3d44`](https://github.com/clauderic/dnd-kit/commit/77e3d44502383d2f9a9f9af014b053619b3e37b3), [`5811986`](https://github.com/clauderic/dnd-kit/commit/5811986e7544a5e80039870a015e38df805eaad1), [`e302bd4`](https://github.com/clauderic/dnd-kit/commit/e302bd4488bdfb6735c97ac42c1f4a0b1e8bfdf9), [`188a450`](https://github.com/clauderic/dnd-kit/commit/188a4507b99d8e8fdaa50bd26deb826c86608e18), [`59ca82b`](https://github.com/clauderic/dnd-kit/commit/59ca82b9f228f34c7731ece87aef5d9633608b57), [`5f3c700`](https://github.com/clauderic/dnd-kit/commit/5f3c7009698d15936fd20f30f11ad3b23cd7886f), [`035021a`](https://github.com/clauderic/dnd-kit/commit/035021aac51161e2bf9715f087a6dd1b46647bfc), [`e6e242c`](https://github.com/clauderic/dnd-kit/commit/e6e242cbc718ed687a26f5c622eeed4dbd6c2425), [`035021a`](https://github.com/clauderic/dnd-kit/commit/035021aac51161e2bf9715f087a6dd1b46647bfc), [`10f6836`](https://github.com/clauderic/dnd-kit/commit/10f683631103b1d919f2fbca1177141b9369d2cf), [`c1b3b5a`](https://github.com/clauderic/dnd-kit/commit/c1b3b5a0be5759b707e22c4e1b1236aaa82773a2), [`035021a`](https://github.com/clauderic/dnd-kit/commit/035021aac51161e2bf9715f087a6dd1b46647bfc)]: | ||
| - @dnd-kit/core@6.0.0-next-20224211110 | ||
| - @dnd-kit/utilities@3.2.0-next-20224211110 | ||
| - Updated dependencies [[`4173087`](https://github.com/clauderic/dnd-kit/commit/417308704454c50f88ab305ab450a99bde5034b0), [`59ca82b`](https://github.com/clauderic/dnd-kit/commit/59ca82b9f228f34c7731ece87aef5d9633608b57), [`7161f70`](https://github.com/clauderic/dnd-kit/commit/7161f702c9fe06f8dafa6449d48b918070ca46fb), [`a52fba1`](https://github.com/clauderic/dnd-kit/commit/a52fba1ccff8a8f40e2cb8dcc15236cfd9e8fbec), [`40707ce`](https://github.com/clauderic/dnd-kit/commit/40707ce6f388957203d6df4ccbeef460450ffd7d), [`a41e5b8`](https://github.com/clauderic/dnd-kit/commit/a41e5b8eff84f0528ffc8b3455b94b95ab60a4a9), [`bf30718`](https://github.com/clauderic/dnd-kit/commit/bf30718bc22584a47053c14f5920e317ac45cd50), [`a41e5b8`](https://github.com/clauderic/dnd-kit/commit/a41e5b8eff84f0528ffc8b3455b94b95ab60a4a9), [`a41e5b8`](https://github.com/clauderic/dnd-kit/commit/a41e5b8eff84f0528ffc8b3455b94b95ab60a4a9), [`035021a`](https://github.com/clauderic/dnd-kit/commit/035021aac51161e2bf9715f087a6dd1b46647bfc), [`77e3d44`](https://github.com/clauderic/dnd-kit/commit/77e3d44502383d2f9a9f9af014b053619b3e37b3), [`5811986`](https://github.com/clauderic/dnd-kit/commit/5811986e7544a5e80039870a015e38df805eaad1), [`e302bd4`](https://github.com/clauderic/dnd-kit/commit/e302bd4488bdfb6735c97ac42c1f4a0b1e8bfdf9), [`188a450`](https://github.com/clauderic/dnd-kit/commit/188a4507b99d8e8fdaa50bd26deb826c86608e18), [`59ca82b`](https://github.com/clauderic/dnd-kit/commit/59ca82b9f228f34c7731ece87aef5d9633608b57), [`5f3c700`](https://github.com/clauderic/dnd-kit/commit/5f3c7009698d15936fd20f30f11ad3b23cd7886f), [`035021a`](https://github.com/clauderic/dnd-kit/commit/035021aac51161e2bf9715f087a6dd1b46647bfc), [`e6e242c`](https://github.com/clauderic/dnd-kit/commit/e6e242cbc718ed687a26f5c622eeed4dbd6c2425), [`035021a`](https://github.com/clauderic/dnd-kit/commit/035021aac51161e2bf9715f087a6dd1b46647bfc), [`33e6dd2`](https://github.com/clauderic/dnd-kit/commit/33e6dd2dc954f1f2da90d8f8af995021031b6b41), [`10f6836`](https://github.com/clauderic/dnd-kit/commit/10f683631103b1d919f2fbca1177141b9369d2cf), [`c1b3b5a`](https://github.com/clauderic/dnd-kit/commit/c1b3b5a0be5759b707e22c4e1b1236aaa82773a2), [`035021a`](https://github.com/clauderic/dnd-kit/commit/035021aac51161e2bf9715f087a6dd1b46647bfc)]: | ||
| - @dnd-kit/core@6.0.0-next-20224211189 | ||
| - @dnd-kit/utilities@3.2.0-next-20224211189 | ||
@@ -103,0 +127,0 @@ ## 6.0.1 |
@@ -22,3 +22,3 @@ /// <reference types="react" /> | ||
| newIndex: number; | ||
| items: string[]; | ||
| items: import("@dnd-kit/core").UniqueIdentifier[]; | ||
| isOver: boolean; | ||
@@ -25,0 +25,0 @@ isSorting: boolean; |
@@ -311,3 +311,3 @@ 'use strict'; | ||
| const useDragOverlay = Boolean(dragOverlay.rect !== null); | ||
| const items = React.useMemo(() => userDefinedItems.map(item => typeof item === 'string' ? item : item.id), [userDefinedItems]); | ||
| const items = React.useMemo(() => userDefinedItems.map(item => typeof item === 'object' && 'id' in item ? item.id : item), [userDefinedItems]); | ||
| const isDragging = active != null; | ||
@@ -314,0 +314,0 @@ const activeIndex = active ? items.indexOf(active.id) : -1; |
@@ -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 a(e,t){return e.reduce((e,r,n)=>{const i=t.get(r);return i&&(e[n]=i),e},Array(e.length))}function s(e){return null!==e&&e>=0}const d={scaleX:1,scaleY:1},l=({rects:e,activeIndex:t,overIndex:r,index:n})=>{const i=o(e,r,t),a=e[n],s=i[n];return s&&a?{x:s.left-a.left,y:s.top-a.top,scaleX:s.width/a.width,scaleY:s.height/a.height}:null},c={scaleX:1,scaleY:1},u=r.createContext({activeIndex:-1,containerId:"Sortable",disableTransforms:!1,items:[],overIndex:-1,useDragOverlay:!1,sortedRects:[],strategy:l,disabled:{draggable:!1,droppable:!1}}),f=({id:e,items:t,activeIndex:r,overIndex:n})=>o(t,r,n).indexOf(e),g=({containerId:e,isSorting:t,wasDragging:r,index:n,items:i,newIndex:o,previousItems:a,previousContainerId:s,transition:d})=>!(!d||!r||a!==i&&n===o||!t&&(o===n||e!==s)),p={duration:200,easing:"ease"},b=i.CSS.Transition.toString({property:"transform",duration:0,easing:"linear"}),x={roleDescription:"sortable"};function v(e){if(!e)return!1;const t=e.data.current;return!!(t&&"sortable"in t&&"object"==typeof t.sortable&&"containerId"in t.sortable&&"items"in t.sortable&&"index"in t.sortable)}const h=[n.KeyboardCode.Down,n.KeyboardCode.Right,n.KeyboardCode.Up,n.KeyboardCode.Left];function I(e,t){return!(!v(e)||!v(t))&&e.data.current.sortable.containerId===t.data.current.sortable.containerId}exports.SortableContext=function({children:e,id:o,items:s,strategy:d=l,disabled:c=!1}){const{active:f,dragOverlay:g,droppableRects:p,over:b,measureDroppableContainers:x,measuringScheduled:v}=n.useDndContext(),h=i.useUniqueId("Sortable",o),I=Boolean(null!==g.rect),y=t.useMemo(()=>s.map(e=>"string"==typeof e?e:e.id),[s]),m=null!=f,w=f?y.indexOf(f.id):-1,C=b?y.indexOf(b.id):-1,R=t.useRef(y),S=!function(e,t){if(e===t)return!0;if(e.length!==t.length)return!1;for(let r=0;r<e.length;r++)if(e[r]!==t[r])return!1;return!0}(y,R.current),D=-1!==C&&-1===w||S,O=function(e){return"boolean"==typeof e?{draggable:e,droppable:e}:e}(c);i.useIsomorphicLayoutEffect(()=>{S&&m&&!v&&x(y)},[S,y,m,x,v]),t.useEffect(()=>{R.current=y},[y]);const N=t.useMemo(()=>({activeIndex:w,containerId:h,disabled:O,disableTransforms:D,items:y,overIndex:C,useDragOverlay:I,sortedRects:a(y,p),strategy:d}),[w,h,O.draggable,O.droppable,D,y,C,p,I,d]);return r.createElement(u.Provider,{value:N},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=g,exports.defaultNewIndexGetter=f,exports.hasSortableData=v,exports.horizontalListSortingStrategy=({rects:e,activeNodeRect:t,activeIndex:r,overIndex:n,index:i})=>{var o;const a=null!=(o=e[r])?o:t;if(!a)return null;const s=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-(a.left+a.width):t.left-a.left,y:0,...d}:null}return i>r&&i<=n?{x:-a.width-s,y:0,...d}:i<r&&i>=n?{x:a.width+s,y:0,...d}:{x:0,y:0,...d}},exports.rectSortingStrategy=l,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,collisionRect:r,droppableRects:o,droppableContainers:a,over:s,scrollableAncestors:d}})=>{if(h.includes(e.code)){if(e.preventDefault(),!t||!r)return;const u=[];a.getEnabled().forEach(t=>{if(!t||(null==t?void 0:t.disabled))return;const i=o.get(t.id);if(i)switch(e.code){case n.KeyboardCode.Down:r.top<i.top&&u.push(t);break;case n.KeyboardCode.Up:r.top>i.top&&u.push(t);break;case n.KeyboardCode.Left:r.left>i.left&&u.push(t);break;case n.KeyboardCode.Right:r.left<i.left&&u.push(t)}});const f=n.closestCorners({active:t,collisionRect:r,droppableRects:o,droppableContainers:u,pointerCoordinates:null});let g=n.getFirstCollision(f,"id");if(g===(null==s?void 0:s.id)&&f.length>1&&(g=f[1].id),null!=g){const e=a.get(t.id),s=a.get(g),u=s?o.get(s.id):null,f=null==s?void 0:s.node.current;if(f&&u&&e&&s){const t=n.getScrollableAncestors(f).some((e,t)=>d[t]!==e),o=I(e,s),a=(c=s,!(!v(l=e)||!v(c))&&!!I(l,c)&&l.data.current.sortable.index<c.data.current.sortable.index),g=t||!o?{x:0,y:0}:{x:a?r.width-u.width:0,y:a?r.height-u.height:0},p={x:u.left,y:u.top};return g.x&&g.y?p:i.subtract(p,g)}}}var l,c},exports.useSortable=function({animateLayoutChanges:e=g,attributes:r,disabled:o,data:a,getNewIndex:d=f,id:l,strategy:c,resizeObserverConfig:v,transition:h=p}){const{items:I,containerId:y,activeIndex:m,disabled:w,disableTransforms:C,sortedRects:R,overIndex:S,useDragOverlay:D,strategy:O}=t.useContext(u),N=function(e,t){var r,n;return"boolean"==typeof e?{draggable:e,droppable:!1}:{draggable:null!=(r=null==e?void 0:e.draggable)?r:t.draggable,droppable:null!=(n=null==e?void 0:e.droppable)?n:t.droppable}}(o,w),E=I.indexOf(l),K=t.useMemo(()=>({sortable:{containerId:y,index:E,items:I},...a}),[y,a,E,I]),L=t.useMemo(()=>I.slice(I.indexOf(l)),[I,l]),{rect:T,node:A,isOver:M,setNodeRef:k}=n.useDroppable({id:l,data:K,disabled:N.droppable,resizeObserverConfig:{updateMeasurementsFor:L,...v}}),{active:q,activatorEvent:X,activeNodeRect:Y,attributes:j,setNodeRef:z,listeners:F,isDragging:U,over:B,setActivatorNodeRef:P,transform:_}=n.useDraggable({id:l,data:K,attributes:{...x,...r},disabled:N.draggable}),G=i.useCombinedRefs(k,z),H=Boolean(q),J=H&&!C&&s(m)&&s(S),Q=!D&&U,V=Q&&J?_:null,W=J?null!=V?V:(null!=c?c:O)({rects:R,activeNodeRect:Y,activeIndex:m,overIndex:S,index:E}):null,Z=s(m)&&s(S)?d({id:l,items:I,activeIndex:m,overIndex:S}):E,$=null==q?void 0:q.id,ee=t.useRef({activeId:$,items:I,newIndex:Z,containerId:y}),te=I!==ee.current.items,re=e({active:q,containerId:y,isDragging:U,isSorting:H,id:l,index:E,items:I,newIndex:ee.current.newIndex,previousItems:ee.current.items,previousContainerId:ee.current.containerId,transition:h,wasDragging:null!=ee.current.activeId}),ne=function({disabled:e,index:r,node:o,rect:a}){const[s,d]=t.useState(null),l=t.useRef(r);return i.useIsomorphicLayoutEffect(()=>{if(!e&&r!==l.current&&o.current){const e=a.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!==l.current&&(l.current=r)},[e,r,o,a]),t.useEffect(()=>{s&&requestAnimationFrame(()=>{d(null)})},[s]),s}({disabled:!re,index:E,node:A,rect:T});return t.useEffect(()=>{H&&ee.current.newIndex!==Z&&(ee.current.newIndex=Z),y!==ee.current.containerId&&(ee.current.containerId=y),I!==ee.current.items&&(ee.current.items=I)},[H,Z,y,I]),t.useEffect(()=>{if($===ee.current.activeId)return;if($&&!ee.current.activeId)return void(ee.current.activeId=$);const e=setTimeout(()=>{ee.current.activeId=$},50);return()=>clearTimeout(e)},[$]),{active:q,activeIndex:m,attributes:j,data:K,rect:T,index:E,newIndex:Z,items:I,isOver:M,isSorting:H,isDragging:U,listeners:F,node:A,overIndex:S,over:B,setNodeRef:G,setActivatorNodeRef:P,setDroppableNodeRef:k,setDraggableNodeRef:z,transform:null!=ne?ne:W,transition:ne||te&&ee.current.newIndex===E?b:Q&&!i.isKeyboardEvent(X)||!h?void 0:H||re?i.CSS.Transition.toString({...h,property:"transform"}):void 0}},exports.verticalListSortingStrategy=({activeIndex:e,activeNodeRect:t,index:r,rects:n,overIndex:i})=>{var o;const a=null!=(o=n[e])?o:t;if(!a)return null;if(r===e){const t=n[i];return t?{x:0,y:e<i?t.top+t.height-(a.top+a.height):t.top-a.top,...c}:null}const s=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:-a.height-s,...c}:r<e&&r>=i?{x:0,y:a.height+s,...c}:{x:0,y:0,...c}}; | ||
| "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 a(e,t){return e.reduce((e,r,n)=>{const i=t.get(r);return i&&(e[n]=i),e},Array(e.length))}function s(e){return null!==e&&e>=0}const d={scaleX:1,scaleY:1},l=({rects:e,activeIndex:t,overIndex:r,index:n})=>{const i=o(e,r,t),a=e[n],s=i[n];return s&&a?{x:s.left-a.left,y:s.top-a.top,scaleX:s.width/a.width,scaleY:s.height/a.height}:null},c={scaleX:1,scaleY:1},u=r.createContext({activeIndex:-1,containerId:"Sortable",disableTransforms:!1,items:[],overIndex:-1,useDragOverlay:!1,sortedRects:[],strategy:l,disabled:{draggable:!1,droppable:!1}}),f=({id:e,items:t,activeIndex:r,overIndex:n})=>o(t,r,n).indexOf(e),p=({containerId:e,isSorting:t,wasDragging:r,index:n,items:i,newIndex:o,previousItems:a,previousContainerId:s,transition:d})=>!(!d||!r||a!==i&&n===o||!t&&(o===n||e!==s)),g={duration:200,easing:"ease"},b=i.CSS.Transition.toString({property:"transform",duration:0,easing:"linear"}),x={roleDescription:"sortable"};function v(e){if(!e)return!1;const t=e.data.current;return!!(t&&"sortable"in t&&"object"==typeof t.sortable&&"containerId"in t.sortable&&"items"in t.sortable&&"index"in t.sortable)}const h=[n.KeyboardCode.Down,n.KeyboardCode.Right,n.KeyboardCode.Up,n.KeyboardCode.Left];function I(e,t){return!(!v(e)||!v(t))&&e.data.current.sortable.containerId===t.data.current.sortable.containerId}exports.SortableContext=function({children:e,id:o,items:s,strategy:d=l,disabled:c=!1}){const{active:f,dragOverlay:p,droppableRects:g,over:b,measureDroppableContainers:x,measuringScheduled:v}=n.useDndContext(),h=i.useUniqueId("Sortable",o),I=Boolean(null!==p.rect),y=t.useMemo(()=>s.map(e=>"object"==typeof e&&"id"in e?e.id:e),[s]),m=null!=f,w=f?y.indexOf(f.id):-1,C=b?y.indexOf(b.id):-1,R=t.useRef(y),S=!function(e,t){if(e===t)return!0;if(e.length!==t.length)return!1;for(let r=0;r<e.length;r++)if(e[r]!==t[r])return!1;return!0}(y,R.current),D=-1!==C&&-1===w||S,O=function(e){return"boolean"==typeof e?{draggable:e,droppable:e}:e}(c);i.useIsomorphicLayoutEffect(()=>{S&&m&&!v&&x(y)},[S,y,m,x,v]),t.useEffect(()=>{R.current=y},[y]);const N=t.useMemo(()=>({activeIndex:w,containerId:h,disabled:O,disableTransforms:D,items:y,overIndex:C,useDragOverlay:I,sortedRects:a(y,g),strategy:d}),[w,h,O.draggable,O.droppable,D,y,C,g,I,d]);return r.createElement(u.Provider,{value:N},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=p,exports.defaultNewIndexGetter=f,exports.hasSortableData=v,exports.horizontalListSortingStrategy=({rects:e,activeNodeRect:t,activeIndex:r,overIndex:n,index:i})=>{var o;const a=null!=(o=e[r])?o:t;if(!a)return null;const s=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-(a.left+a.width):t.left-a.left,y:0,...d}:null}return i>r&&i<=n?{x:-a.width-s,y:0,...d}:i<r&&i>=n?{x:a.width+s,y:0,...d}:{x:0,y:0,...d}},exports.rectSortingStrategy=l,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,collisionRect:r,droppableRects:o,droppableContainers:a,over:s,scrollableAncestors:d}})=>{if(h.includes(e.code)){if(e.preventDefault(),!t||!r)return;const u=[];a.getEnabled().forEach(t=>{if(!t||(null==t?void 0:t.disabled))return;const i=o.get(t.id);if(i)switch(e.code){case n.KeyboardCode.Down:r.top<i.top&&u.push(t);break;case n.KeyboardCode.Up:r.top>i.top&&u.push(t);break;case n.KeyboardCode.Left:r.left>i.left&&u.push(t);break;case n.KeyboardCode.Right:r.left<i.left&&u.push(t)}});const f=n.closestCorners({active:t,collisionRect:r,droppableRects:o,droppableContainers:u,pointerCoordinates:null});let p=n.getFirstCollision(f,"id");if(p===(null==s?void 0:s.id)&&f.length>1&&(p=f[1].id),null!=p){const e=a.get(t.id),s=a.get(p),u=s?o.get(s.id):null,f=null==s?void 0:s.node.current;if(f&&u&&e&&s){const t=n.getScrollableAncestors(f).some((e,t)=>d[t]!==e),o=I(e,s),a=(c=s,!(!v(l=e)||!v(c))&&!!I(l,c)&&l.data.current.sortable.index<c.data.current.sortable.index),p=t||!o?{x:0,y:0}:{x:a?r.width-u.width:0,y:a?r.height-u.height:0},g={x:u.left,y:u.top};return p.x&&p.y?g:i.subtract(g,p)}}}var l,c},exports.useSortable=function({animateLayoutChanges:e=p,attributes:r,disabled:o,data:a,getNewIndex:d=f,id:l,strategy:c,resizeObserverConfig:v,transition:h=g}){const{items:I,containerId:y,activeIndex:m,disabled:w,disableTransforms:C,sortedRects:R,overIndex:S,useDragOverlay:D,strategy:O}=t.useContext(u),N=function(e,t){var r,n;return"boolean"==typeof e?{draggable:e,droppable:!1}:{draggable:null!=(r=null==e?void 0:e.draggable)?r:t.draggable,droppable:null!=(n=null==e?void 0:e.droppable)?n:t.droppable}}(o,w),E=I.indexOf(l),K=t.useMemo(()=>({sortable:{containerId:y,index:E,items:I},...a}),[y,a,E,I]),L=t.useMemo(()=>I.slice(I.indexOf(l)),[I,l]),{rect:T,node:A,isOver:M,setNodeRef:k}=n.useDroppable({id:l,data:K,disabled:N.droppable,resizeObserverConfig:{updateMeasurementsFor:L,...v}}),{active:q,activatorEvent:X,activeNodeRect:Y,attributes:j,setNodeRef:z,listeners:F,isDragging:U,over:B,setActivatorNodeRef:P,transform:_}=n.useDraggable({id:l,data:K,attributes:{...x,...r},disabled:N.draggable}),G=i.useCombinedRefs(k,z),H=Boolean(q),J=H&&!C&&s(m)&&s(S),Q=!D&&U,V=Q&&J?_:null,W=J?null!=V?V:(null!=c?c:O)({rects:R,activeNodeRect:Y,activeIndex:m,overIndex:S,index:E}):null,Z=s(m)&&s(S)?d({id:l,items:I,activeIndex:m,overIndex:S}):E,$=null==q?void 0:q.id,ee=t.useRef({activeId:$,items:I,newIndex:Z,containerId:y}),te=I!==ee.current.items,re=e({active:q,containerId:y,isDragging:U,isSorting:H,id:l,index:E,items:I,newIndex:ee.current.newIndex,previousItems:ee.current.items,previousContainerId:ee.current.containerId,transition:h,wasDragging:null!=ee.current.activeId}),ne=function({disabled:e,index:r,node:o,rect:a}){const[s,d]=t.useState(null),l=t.useRef(r);return i.useIsomorphicLayoutEffect(()=>{if(!e&&r!==l.current&&o.current){const e=a.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!==l.current&&(l.current=r)},[e,r,o,a]),t.useEffect(()=>{s&&requestAnimationFrame(()=>{d(null)})},[s]),s}({disabled:!re,index:E,node:A,rect:T});return t.useEffect(()=>{H&&ee.current.newIndex!==Z&&(ee.current.newIndex=Z),y!==ee.current.containerId&&(ee.current.containerId=y),I!==ee.current.items&&(ee.current.items=I)},[H,Z,y,I]),t.useEffect(()=>{if($===ee.current.activeId)return;if($&&!ee.current.activeId)return void(ee.current.activeId=$);const e=setTimeout(()=>{ee.current.activeId=$},50);return()=>clearTimeout(e)},[$]),{active:q,activeIndex:m,attributes:j,data:K,rect:T,index:E,newIndex:Z,items:I,isOver:M,isSorting:H,isDragging:U,listeners:F,node:A,overIndex:S,over:B,setNodeRef:G,setActivatorNodeRef:P,setDroppableNodeRef:k,setDraggableNodeRef:z,transform:null!=ne?ne:W,transition:ne||te&&ee.current.newIndex===E?b:Q&&!i.isKeyboardEvent(X)||!h?void 0:H||re?i.CSS.Transition.toString({...h,property:"transform"}):void 0}},exports.verticalListSortingStrategy=({activeIndex:e,activeNodeRect:t,index:r,rects:n,overIndex:i})=>{var o;const a=null!=(o=n[e])?o:t;if(!a)return null;if(r===e){const t=n[i];return t?{x:0,y:e<i?t.top+t.height-(a.top+a.height):t.top-a.top,...c}:null}const s=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:-a.height-s,...c}:r<e&&r>=i?{x:0,y:a.height+s,...c}:{x:0,y:0,...c}}; | ||
| //# sourceMappingURL=sortable.cjs.production.min.js.map |
@@ -304,3 +304,3 @@ import React, { useMemo, useRef, useEffect, useState, useContext } from 'react'; | ||
| const useDragOverlay = Boolean(dragOverlay.rect !== null); | ||
| const items = useMemo(() => userDefinedItems.map(item => typeof item === 'string' ? item : item.id), [userDefinedItems]); | ||
| const items = useMemo(() => userDefinedItems.map(item => typeof item === 'object' && 'id' in item ? item.id : item), [userDefinedItems]); | ||
| const isDragging = active != null; | ||
@@ -307,0 +307,0 @@ const activeIndex = active ? items.indexOf(active.id) : -1; |
| { | ||
| "name": "@dnd-kit/sortable", | ||
| "version": "7.0.0-next-20224211110", | ||
| "version": "7.0.0-next-20224211189", | ||
| "description": "Official sortable preset and sensors for dnd kit", | ||
@@ -29,3 +29,3 @@ "author": "Claudéric Demers", | ||
| "dependencies": { | ||
| "@dnd-kit/utilities": "^3.2.0-next-20224211110", | ||
| "@dnd-kit/utilities": "^3.2.0-next-20224211189", | ||
| "tslib": "^2.0.0" | ||
@@ -35,6 +35,6 @@ }, | ||
| "react": ">=16.8.0", | ||
| "@dnd-kit/core": "^6.0.0-next-20224211110" | ||
| "@dnd-kit/core": "^6.0.0-next-20224211189" | ||
| }, | ||
| "devDependencies": { | ||
| "@dnd-kit/core": "^6.0.0-next-20224211110" | ||
| "@dnd-kit/core": "^6.0.0-next-20224211189" | ||
| }, | ||
@@ -41,0 +41,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
New alerts
License Policy Violation
LicenseThis 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
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by0.73%
235041