@dnd-kit/modifiers 5.0.0-next-20220818116 → 5.0.0-next-202209154910
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.md +5 -3
- package/dist/modifiers.cjs.development.js +17 -17
- package/dist/modifiers.cjs.development.js.map +1 -1
- package/dist/modifiers.cjs.production.min.js +1 -1
- package/dist/modifiers.cjs.production.min.js.map +1 -1
- package/dist/modifiers.esm.js +17 -17
- package/dist/modifiers.esm.js.map +1 -1
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
@@ -1,9 +1,11 @@
|
|
1
1
|
# @dnd-kit/modifiers
|
2
2
|
|
3
|
-
## 5.0.0-next-
|
3
|
+
## 5.0.0-next-202209154910
|
4
4
|
|
5
5
|
### Minor Changes
|
6
6
|
|
7
|
+
- [#567](https://github.com/clauderic/dnd-kit/pull/567) [`cd3adf3`](https://github.com/clauderic/dnd-kit/commit/cd3adf34f6d3336c539a34e203177322614623ec) Thanks [@clauderic](https://github.com/clauderic)! - Update modifiers to use `draggingNodeRect` instead of `activeNodeRect`. Modifiers should be based on the rect of the node being dragged, whether it is the draggable node or drag overlay node.
|
8
|
+
|
7
9
|
- [#518](https://github.com/clauderic/dnd-kit/pull/518) [`6310227`](https://github.com/clauderic/dnd-kit/commit/63102272d0d63dae349e2e9f638277e16a7d5970) Thanks [@clauderic](https://github.com/clauderic)! - Major internal refactor of measuring and collision detection.
|
8
10
|
|
9
11
|
### Summary of changes
|
@@ -30,8 +32,8 @@
|
|
30
32
|
### Patch Changes
|
31
33
|
|
32
34
|
- Updated dependencies [[`f3ad20d`](https://github.com/clauderic/dnd-kit/commit/f3ad20d5b2c2f2ca7b82c193c9af5eef38c5ce11), [`02edd26`](https://github.com/clauderic/dnd-kit/commit/02edd2691b24bb49f2e7c9f9a3f282031bf658b7), [`c6c67cb`](https://github.com/clauderic/dnd-kit/commit/c6c67cb9cbc6e61027f7bb084fd2232160037d5e), [`6310227`](https://github.com/clauderic/dnd-kit/commit/63102272d0d63dae349e2e9f638277e16a7d5970), [`528c67e`](https://github.com/clauderic/dnd-kit/commit/528c67e4c617dfc0ce5221496aa8b222ffc82ddb), [`02edd26`](https://github.com/clauderic/dnd-kit/commit/02edd2691b24bb49f2e7c9f9a3f282031bf658b7)]:
|
33
|
-
- @dnd-kit/core@5.0.0-next-
|
34
|
-
- @dnd-kit/utilities@3.1.0-next-
|
35
|
+
- @dnd-kit/core@5.0.0-next-202209154910
|
36
|
+
- @dnd-kit/utilities@3.1.0-next-202209154910
|
35
37
|
|
36
38
|
## 4.0.0
|
37
39
|
|
@@ -41,29 +41,29 @@ function restrictToBoundingRect(transform, rect, boundingRect) {
|
|
41
41
|
}
|
42
42
|
|
43
43
|
const restrictToParentElement = ({
|
44
|
-
|
45
|
-
|
46
|
-
|
44
|
+
containerNodeRect,
|
45
|
+
draggingNodeRect,
|
46
|
+
transform
|
47
47
|
}) => {
|
48
|
-
if (!
|
48
|
+
if (!draggingNodeRect || !containerNodeRect) {
|
49
49
|
return transform;
|
50
50
|
}
|
51
51
|
|
52
|
-
return restrictToBoundingRect(transform,
|
52
|
+
return restrictToBoundingRect(transform, draggingNodeRect, containerNodeRect);
|
53
53
|
};
|
54
54
|
|
55
55
|
const restrictToFirstScrollableAncestor = ({
|
56
|
+
draggingNodeRect,
|
56
57
|
transform,
|
57
|
-
activeNodeRect,
|
58
58
|
scrollableAncestorRects
|
59
59
|
}) => {
|
60
60
|
const firstScrollableAncestorRect = scrollableAncestorRects[0];
|
61
61
|
|
62
|
-
if (!
|
62
|
+
if (!draggingNodeRect || !firstScrollableAncestorRect) {
|
63
63
|
return transform;
|
64
64
|
}
|
65
65
|
|
66
|
-
return restrictToBoundingRect(transform,
|
66
|
+
return restrictToBoundingRect(transform, draggingNodeRect, firstScrollableAncestorRect);
|
67
67
|
};
|
68
68
|
|
69
69
|
const restrictToVerticalAxis = ({
|
@@ -76,33 +76,33 @@ const restrictToVerticalAxis = ({
|
|
76
76
|
|
77
77
|
const restrictToWindowEdges = ({
|
78
78
|
transform,
|
79
|
-
|
79
|
+
draggingNodeRect,
|
80
80
|
windowRect
|
81
81
|
}) => {
|
82
|
-
if (!
|
82
|
+
if (!draggingNodeRect || !windowRect) {
|
83
83
|
return transform;
|
84
84
|
}
|
85
85
|
|
86
|
-
return restrictToBoundingRect(transform,
|
86
|
+
return restrictToBoundingRect(transform, draggingNodeRect, windowRect);
|
87
87
|
};
|
88
88
|
|
89
89
|
const snapCenterToCursor = ({
|
90
90
|
activatorEvent,
|
91
|
-
|
91
|
+
draggingNodeRect,
|
92
92
|
transform
|
93
93
|
}) => {
|
94
|
-
if (
|
94
|
+
if (draggingNodeRect && activatorEvent) {
|
95
95
|
const activatorCoordinates = utilities.getEventCoordinates(activatorEvent);
|
96
96
|
|
97
97
|
if (!activatorCoordinates) {
|
98
98
|
return transform;
|
99
99
|
}
|
100
100
|
|
101
|
-
const offsetX = activatorCoordinates.x -
|
102
|
-
const offsetY = activatorCoordinates.y -
|
101
|
+
const offsetX = activatorCoordinates.x - draggingNodeRect.left;
|
102
|
+
const offsetY = activatorCoordinates.y - draggingNodeRect.top;
|
103
103
|
return { ...transform,
|
104
|
-
x: transform.x + offsetX -
|
105
|
-
y: transform.y + offsetY -
|
104
|
+
x: transform.x + offsetX - draggingNodeRect.width / 2,
|
105
|
+
y: transform.y + offsetY - draggingNodeRect.height / 2
|
106
106
|
};
|
107
107
|
}
|
108
108
|
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"modifiers.cjs.development.js","sources":["../src/createSnapModifier.ts","../src/restrictToHorizontalAxis.ts","../src/utilities/restrictToBoundingRect.ts","../src/restrictToParentElement.ts","../src/restrictToFirstScrollableAncestor.ts","../src/restrictToVerticalAxis.ts","../src/restrictToWindowEdges.ts","../src/snapCenterToCursor.ts"],"sourcesContent":["import type {Modifier} from '@dnd-kit/core';\n\nexport function createSnapModifier(gridSize: number): Modifier {\n return ({transform}) => ({\n ...transform,\n x: Math.ceil(transform.x / gridSize) * gridSize,\n y: Math.ceil(transform.y / gridSize) * gridSize,\n });\n}\n","import type {Modifier} from '@dnd-kit/core';\n\nexport const restrictToHorizontalAxis: Modifier = ({transform}) => {\n return {\n ...transform,\n y: 0,\n };\n};\n","import type {ClientRect} from '@dnd-kit/core';\nimport type {Transform} from '@dnd-kit/utilities';\n\nexport function restrictToBoundingRect(\n transform: Transform,\n rect: ClientRect,\n boundingRect: ClientRect\n): Transform {\n const value = {\n ...transform,\n };\n\n if (rect.top + transform.y <= boundingRect.top) {\n value.y = boundingRect.top - rect.top;\n } else if (\n rect.bottom + transform.y >=\n boundingRect.top + boundingRect.height\n ) {\n value.y = boundingRect.top + boundingRect.height - rect.bottom;\n }\n\n if (rect.left + transform.x <= boundingRect.left) {\n value.x = boundingRect.left - rect.left;\n } else if (\n rect.right + transform.x >=\n boundingRect.left + boundingRect.width\n ) {\n value.x = boundingRect.left + boundingRect.width - rect.right;\n }\n\n return value;\n}\n","import type {Modifier} from '@dnd-kit/core';\nimport {restrictToBoundingRect} from './utilities';\n\nexport const restrictToParentElement: Modifier = ({\n
|
1
|
+
{"version":3,"file":"modifiers.cjs.development.js","sources":["../src/createSnapModifier.ts","../src/restrictToHorizontalAxis.ts","../src/utilities/restrictToBoundingRect.ts","../src/restrictToParentElement.ts","../src/restrictToFirstScrollableAncestor.ts","../src/restrictToVerticalAxis.ts","../src/restrictToWindowEdges.ts","../src/snapCenterToCursor.ts"],"sourcesContent":["import type {Modifier} from '@dnd-kit/core';\n\nexport function createSnapModifier(gridSize: number): Modifier {\n return ({transform}) => ({\n ...transform,\n x: Math.ceil(transform.x / gridSize) * gridSize,\n y: Math.ceil(transform.y / gridSize) * gridSize,\n });\n}\n","import type {Modifier} from '@dnd-kit/core';\n\nexport const restrictToHorizontalAxis: Modifier = ({transform}) => {\n return {\n ...transform,\n y: 0,\n };\n};\n","import type {ClientRect} from '@dnd-kit/core';\nimport type {Transform} from '@dnd-kit/utilities';\n\nexport function restrictToBoundingRect(\n transform: Transform,\n rect: ClientRect,\n boundingRect: ClientRect\n): Transform {\n const value = {\n ...transform,\n };\n\n if (rect.top + transform.y <= boundingRect.top) {\n value.y = boundingRect.top - rect.top;\n } else if (\n rect.bottom + transform.y >=\n boundingRect.top + boundingRect.height\n ) {\n value.y = boundingRect.top + boundingRect.height - rect.bottom;\n }\n\n if (rect.left + transform.x <= boundingRect.left) {\n value.x = boundingRect.left - rect.left;\n } else if (\n rect.right + transform.x >=\n boundingRect.left + boundingRect.width\n ) {\n value.x = boundingRect.left + boundingRect.width - rect.right;\n }\n\n return value;\n}\n","import type {Modifier} from '@dnd-kit/core';\nimport {restrictToBoundingRect} from './utilities';\n\nexport const restrictToParentElement: Modifier = ({\n containerNodeRect,\n draggingNodeRect,\n transform,\n}) => {\n if (!draggingNodeRect || !containerNodeRect) {\n return transform;\n }\n\n return restrictToBoundingRect(transform, draggingNodeRect, containerNodeRect);\n};\n","import type {Modifier} from '@dnd-kit/core';\nimport {restrictToBoundingRect} from './utilities';\n\nexport const restrictToFirstScrollableAncestor: Modifier = ({\n draggingNodeRect,\n transform,\n scrollableAncestorRects,\n}) => {\n const firstScrollableAncestorRect = scrollableAncestorRects[0];\n\n if (!draggingNodeRect || !firstScrollableAncestorRect) {\n return transform;\n }\n\n return restrictToBoundingRect(\n transform,\n draggingNodeRect,\n firstScrollableAncestorRect\n );\n};\n","import type {Modifier} from '@dnd-kit/core';\n\nexport const restrictToVerticalAxis: Modifier = ({transform}) => {\n return {\n ...transform,\n x: 0,\n };\n};\n","import type {Modifier} from '@dnd-kit/core';\n\nimport {restrictToBoundingRect} from './utilities';\n\nexport const restrictToWindowEdges: Modifier = ({\n transform,\n draggingNodeRect,\n windowRect,\n}) => {\n if (!draggingNodeRect || !windowRect) {\n return transform;\n }\n\n return restrictToBoundingRect(transform, draggingNodeRect, windowRect);\n};\n","import type {Modifier} from '@dnd-kit/core';\nimport {getEventCoordinates} from '@dnd-kit/utilities';\n\nexport const snapCenterToCursor: Modifier = ({\n activatorEvent,\n draggingNodeRect,\n transform,\n}) => {\n if (draggingNodeRect && activatorEvent) {\n const activatorCoordinates = getEventCoordinates(activatorEvent);\n\n if (!activatorCoordinates) {\n return transform;\n }\n\n const offsetX = activatorCoordinates.x - draggingNodeRect.left;\n const offsetY = activatorCoordinates.y - draggingNodeRect.top;\n\n return {\n ...transform,\n x: transform.x + offsetX - draggingNodeRect.width / 2,\n y: transform.y + offsetY - draggingNodeRect.height / 2,\n };\n }\n\n return transform;\n};\n"],"names":["createSnapModifier","gridSize","transform","x","Math","ceil","y","restrictToHorizontalAxis","restrictToBoundingRect","rect","boundingRect","value","top","bottom","height","left","right","width","restrictToParentElement","containerNodeRect","draggingNodeRect","restrictToFirstScrollableAncestor","scrollableAncestorRects","firstScrollableAncestorRect","restrictToVerticalAxis","restrictToWindowEdges","windowRect","snapCenterToCursor","activatorEvent","activatorCoordinates","getEventCoordinates","offsetX","offsetY"],"mappings":"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"}
|
@@ -1,2 +1,2 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("@dnd-kit/utilities");function e(t,e,r){const o={...t};return e.top+t.y<=r.top?o.y=r.top-e.top:e.bottom+t.y>=r.top+r.height&&(o.y=r.top+r.height-e.bottom),e.left+t.x<=r.left?o.x=r.left-e.left:e.right+t.x>=r.left+r.width&&(o.x=r.left+r.width-e.right),o}exports.createSnapModifier=function(t){return({transform:e})=>({...e,x:Math.ceil(e.x/t)*t,y:Math.ceil(e.y/t)*t})},exports.restrictToFirstScrollableAncestor=({
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("@dnd-kit/utilities");function e(t,e,r){const o={...t};return e.top+t.y<=r.top?o.y=r.top-e.top:e.bottom+t.y>=r.top+r.height&&(o.y=r.top+r.height-e.bottom),e.left+t.x<=r.left?o.x=r.left-e.left:e.right+t.x>=r.left+r.width&&(o.x=r.left+r.width-e.right),o}exports.createSnapModifier=function(t){return({transform:e})=>({...e,x:Math.ceil(e.x/t)*t,y:Math.ceil(e.y/t)*t})},exports.restrictToFirstScrollableAncestor=({draggingNodeRect:t,transform:r,scrollableAncestorRects:o})=>{const i=o[0];return t&&i?e(r,t,i):r},exports.restrictToHorizontalAxis=({transform:t})=>({...t,y:0}),exports.restrictToParentElement=({containerNodeRect:t,draggingNodeRect:r,transform:o})=>r&&t?e(o,r,t):o,exports.restrictToVerticalAxis=({transform:t})=>({...t,x:0}),exports.restrictToWindowEdges=({transform:t,draggingNodeRect:r,windowRect:o})=>r&&o?e(t,r,o):t,exports.snapCenterToCursor=({activatorEvent:e,draggingNodeRect:r,transform:o})=>{if(r&&e){const i=t.getEventCoordinates(e);if(!i)return o;const n=i.x-r.left,s=i.y-r.top;return{...o,x:o.x+n-r.width/2,y:o.y+s-r.height/2}}return o};
|
2
2
|
//# sourceMappingURL=modifiers.cjs.production.min.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"modifiers.cjs.production.min.js","sources":["../src/utilities/restrictToBoundingRect.ts","../src/createSnapModifier.ts","../src/restrictToFirstScrollableAncestor.ts","../src/restrictToHorizontalAxis.ts","../src/restrictToParentElement.ts","../src/restrictToVerticalAxis.ts","../src/restrictToWindowEdges.ts","../src/snapCenterToCursor.ts"],"sourcesContent":["import type {ClientRect} from '@dnd-kit/core';\nimport type {Transform} from '@dnd-kit/utilities';\n\nexport function restrictToBoundingRect(\n transform: Transform,\n rect: ClientRect,\n boundingRect: ClientRect\n): Transform {\n const value = {\n ...transform,\n };\n\n if (rect.top + transform.y <= boundingRect.top) {\n value.y = boundingRect.top - rect.top;\n } else if (\n rect.bottom + transform.y >=\n boundingRect.top + boundingRect.height\n ) {\n value.y = boundingRect.top + boundingRect.height - rect.bottom;\n }\n\n if (rect.left + transform.x <= boundingRect.left) {\n value.x = boundingRect.left - rect.left;\n } else if (\n rect.right + transform.x >=\n boundingRect.left + boundingRect.width\n ) {\n value.x = boundingRect.left + boundingRect.width - rect.right;\n }\n\n return value;\n}\n","import type {Modifier} from '@dnd-kit/core';\n\nexport function createSnapModifier(gridSize: number): Modifier {\n return ({transform}) => ({\n ...transform,\n x: Math.ceil(transform.x / gridSize) * gridSize,\n y: Math.ceil(transform.y / gridSize) * gridSize,\n });\n}\n","import type {Modifier} from '@dnd-kit/core';\nimport {restrictToBoundingRect} from './utilities';\n\nexport const restrictToFirstScrollableAncestor: Modifier = ({\n
|
1
|
+
{"version":3,"file":"modifiers.cjs.production.min.js","sources":["../src/utilities/restrictToBoundingRect.ts","../src/createSnapModifier.ts","../src/restrictToFirstScrollableAncestor.ts","../src/restrictToHorizontalAxis.ts","../src/restrictToParentElement.ts","../src/restrictToVerticalAxis.ts","../src/restrictToWindowEdges.ts","../src/snapCenterToCursor.ts"],"sourcesContent":["import type {ClientRect} from '@dnd-kit/core';\nimport type {Transform} from '@dnd-kit/utilities';\n\nexport function restrictToBoundingRect(\n transform: Transform,\n rect: ClientRect,\n boundingRect: ClientRect\n): Transform {\n const value = {\n ...transform,\n };\n\n if (rect.top + transform.y <= boundingRect.top) {\n value.y = boundingRect.top - rect.top;\n } else if (\n rect.bottom + transform.y >=\n boundingRect.top + boundingRect.height\n ) {\n value.y = boundingRect.top + boundingRect.height - rect.bottom;\n }\n\n if (rect.left + transform.x <= boundingRect.left) {\n value.x = boundingRect.left - rect.left;\n } else if (\n rect.right + transform.x >=\n boundingRect.left + boundingRect.width\n ) {\n value.x = boundingRect.left + boundingRect.width - rect.right;\n }\n\n return value;\n}\n","import type {Modifier} from '@dnd-kit/core';\n\nexport function createSnapModifier(gridSize: number): Modifier {\n return ({transform}) => ({\n ...transform,\n x: Math.ceil(transform.x / gridSize) * gridSize,\n y: Math.ceil(transform.y / gridSize) * gridSize,\n });\n}\n","import type {Modifier} from '@dnd-kit/core';\nimport {restrictToBoundingRect} from './utilities';\n\nexport const restrictToFirstScrollableAncestor: Modifier = ({\n draggingNodeRect,\n transform,\n scrollableAncestorRects,\n}) => {\n const firstScrollableAncestorRect = scrollableAncestorRects[0];\n\n if (!draggingNodeRect || !firstScrollableAncestorRect) {\n return transform;\n }\n\n return restrictToBoundingRect(\n transform,\n draggingNodeRect,\n firstScrollableAncestorRect\n );\n};\n","import type {Modifier} from '@dnd-kit/core';\n\nexport const restrictToHorizontalAxis: Modifier = ({transform}) => {\n return {\n ...transform,\n y: 0,\n };\n};\n","import type {Modifier} from '@dnd-kit/core';\nimport {restrictToBoundingRect} from './utilities';\n\nexport const restrictToParentElement: Modifier = ({\n containerNodeRect,\n draggingNodeRect,\n transform,\n}) => {\n if (!draggingNodeRect || !containerNodeRect) {\n return transform;\n }\n\n return restrictToBoundingRect(transform, draggingNodeRect, containerNodeRect);\n};\n","import type {Modifier} from '@dnd-kit/core';\n\nexport const restrictToVerticalAxis: Modifier = ({transform}) => {\n return {\n ...transform,\n x: 0,\n };\n};\n","import type {Modifier} from '@dnd-kit/core';\n\nimport {restrictToBoundingRect} from './utilities';\n\nexport const restrictToWindowEdges: Modifier = ({\n transform,\n draggingNodeRect,\n windowRect,\n}) => {\n if (!draggingNodeRect || !windowRect) {\n return transform;\n }\n\n return restrictToBoundingRect(transform, draggingNodeRect, windowRect);\n};\n","import type {Modifier} from '@dnd-kit/core';\nimport {getEventCoordinates} from '@dnd-kit/utilities';\n\nexport const snapCenterToCursor: Modifier = ({\n activatorEvent,\n draggingNodeRect,\n transform,\n}) => {\n if (draggingNodeRect && activatorEvent) {\n const activatorCoordinates = getEventCoordinates(activatorEvent);\n\n if (!activatorCoordinates) {\n return transform;\n }\n\n const offsetX = activatorCoordinates.x - draggingNodeRect.left;\n const offsetY = activatorCoordinates.y - draggingNodeRect.top;\n\n return {\n ...transform,\n x: transform.x + offsetX - draggingNodeRect.width / 2,\n y: transform.y + offsetY - draggingNodeRect.height / 2,\n };\n }\n\n return transform;\n};\n"],"names":["restrictToBoundingRect","transform","rect","boundingRect","value","top","y","bottom","height","left","x","right","width","gridSize","Math","ceil","draggingNodeRect","scrollableAncestorRects","firstScrollableAncestorRect","containerNodeRect","windowRect","activatorEvent","activatorCoordinates","getEventCoordinates","offsetX","offsetY"],"mappings":"iHAGgBA,EACdC,EACAC,EACAC,SAEMC,EAAQ,IACTH,UAGDC,EAAKG,IAAMJ,EAAUK,GAAKH,EAAaE,IACzCD,EAAME,EAAIH,EAAaE,IAAMH,EAAKG,IAElCH,EAAKK,OAASN,EAAUK,GACxBH,EAAaE,IAAMF,EAAaK,SAEhCJ,EAAME,EAAIH,EAAaE,IAAMF,EAAaK,OAASN,EAAKK,QAGtDL,EAAKO,KAAOR,EAAUS,GAAKP,EAAaM,KAC1CL,EAAMM,EAAIP,EAAaM,KAAOP,EAAKO,KAEnCP,EAAKS,MAAQV,EAAUS,GACvBP,EAAaM,KAAON,EAAaS,QAEjCR,EAAMM,EAAIP,EAAaM,KAAON,EAAaS,MAAQV,EAAKS,OAGnDP,sCC5B0BS,SAC1B,EAAEZ,UAAAA,UACJA,EACHS,EAAGI,KAAKC,KAAKd,EAAUS,EAAIG,GAAYA,EACvCP,EAAGQ,KAAKC,KAAKd,EAAUK,EAAIO,GAAYA,+CCHgB,EACzDG,iBAAAA,EACAf,UAAAA,EACAgB,wBAAAA,YAEMC,EAA8BD,EAAwB,UAEvDD,GAAqBE,EAInBlB,EACLC,EACAe,EACAE,GANOjB,oCCTuC,EAAEA,UAAAA,MAC3C,IACFA,EACHK,EAAG,oCCF0C,EAC/Ca,kBAAAA,EACAH,iBAAAA,EACAf,UAAAA,KAEKe,GAAqBG,EAInBnB,EAAuBC,EAAWe,EAAkBG,GAHlDlB,iCCPqC,EAAEA,UAAAA,MACzC,IACFA,EACHS,EAAG,kCCDwC,EAC7CT,UAAAA,EACAe,iBAAAA,EACAI,WAAAA,KAEKJ,GAAqBI,EAInBpB,EAAuBC,EAAWe,EAAkBI,GAHlDnB,6BCPiC,EAC1CoB,eAAAA,EACAL,iBAAAA,EACAf,UAAAA,SAEIe,GAAoBK,EAAgB,OAChCC,EAAuBC,sBAAoBF,OAE5CC,SACIrB,QAGHuB,EAAUF,EAAqBZ,EAAIM,EAAiBP,KACpDgB,EAAUH,EAAqBhB,EAAIU,EAAiBX,UAEnD,IACFJ,EACHS,EAAGT,EAAUS,EAAIc,EAAUR,EAAiBJ,MAAQ,EACpDN,EAAGL,EAAUK,EAAImB,EAAUT,EAAiBR,OAAS,UAIlDP"}
|
package/dist/modifiers.esm.js
CHANGED
@@ -37,29 +37,29 @@ function restrictToBoundingRect(transform, rect, boundingRect) {
|
|
37
37
|
}
|
38
38
|
|
39
39
|
const restrictToParentElement = ({
|
40
|
-
|
41
|
-
|
42
|
-
|
40
|
+
containerNodeRect,
|
41
|
+
draggingNodeRect,
|
42
|
+
transform
|
43
43
|
}) => {
|
44
|
-
if (!
|
44
|
+
if (!draggingNodeRect || !containerNodeRect) {
|
45
45
|
return transform;
|
46
46
|
}
|
47
47
|
|
48
|
-
return restrictToBoundingRect(transform,
|
48
|
+
return restrictToBoundingRect(transform, draggingNodeRect, containerNodeRect);
|
49
49
|
};
|
50
50
|
|
51
51
|
const restrictToFirstScrollableAncestor = ({
|
52
|
+
draggingNodeRect,
|
52
53
|
transform,
|
53
|
-
activeNodeRect,
|
54
54
|
scrollableAncestorRects
|
55
55
|
}) => {
|
56
56
|
const firstScrollableAncestorRect = scrollableAncestorRects[0];
|
57
57
|
|
58
|
-
if (!
|
58
|
+
if (!draggingNodeRect || !firstScrollableAncestorRect) {
|
59
59
|
return transform;
|
60
60
|
}
|
61
61
|
|
62
|
-
return restrictToBoundingRect(transform,
|
62
|
+
return restrictToBoundingRect(transform, draggingNodeRect, firstScrollableAncestorRect);
|
63
63
|
};
|
64
64
|
|
65
65
|
const restrictToVerticalAxis = ({
|
@@ -72,33 +72,33 @@ const restrictToVerticalAxis = ({
|
|
72
72
|
|
73
73
|
const restrictToWindowEdges = ({
|
74
74
|
transform,
|
75
|
-
|
75
|
+
draggingNodeRect,
|
76
76
|
windowRect
|
77
77
|
}) => {
|
78
|
-
if (!
|
78
|
+
if (!draggingNodeRect || !windowRect) {
|
79
79
|
return transform;
|
80
80
|
}
|
81
81
|
|
82
|
-
return restrictToBoundingRect(transform,
|
82
|
+
return restrictToBoundingRect(transform, draggingNodeRect, windowRect);
|
83
83
|
};
|
84
84
|
|
85
85
|
const snapCenterToCursor = ({
|
86
86
|
activatorEvent,
|
87
|
-
|
87
|
+
draggingNodeRect,
|
88
88
|
transform
|
89
89
|
}) => {
|
90
|
-
if (
|
90
|
+
if (draggingNodeRect && activatorEvent) {
|
91
91
|
const activatorCoordinates = getEventCoordinates(activatorEvent);
|
92
92
|
|
93
93
|
if (!activatorCoordinates) {
|
94
94
|
return transform;
|
95
95
|
}
|
96
96
|
|
97
|
-
const offsetX = activatorCoordinates.x -
|
98
|
-
const offsetY = activatorCoordinates.y -
|
97
|
+
const offsetX = activatorCoordinates.x - draggingNodeRect.left;
|
98
|
+
const offsetY = activatorCoordinates.y - draggingNodeRect.top;
|
99
99
|
return { ...transform,
|
100
|
-
x: transform.x + offsetX -
|
101
|
-
y: transform.y + offsetY -
|
100
|
+
x: transform.x + offsetX - draggingNodeRect.width / 2,
|
101
|
+
y: transform.y + offsetY - draggingNodeRect.height / 2
|
102
102
|
};
|
103
103
|
}
|
104
104
|
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"modifiers.esm.js","sources":["../src/createSnapModifier.ts","../src/restrictToHorizontalAxis.ts","../src/utilities/restrictToBoundingRect.ts","../src/restrictToParentElement.ts","../src/restrictToFirstScrollableAncestor.ts","../src/restrictToVerticalAxis.ts","../src/restrictToWindowEdges.ts","../src/snapCenterToCursor.ts"],"sourcesContent":["import type {Modifier} from '@dnd-kit/core';\n\nexport function createSnapModifier(gridSize: number): Modifier {\n return ({transform}) => ({\n ...transform,\n x: Math.ceil(transform.x / gridSize) * gridSize,\n y: Math.ceil(transform.y / gridSize) * gridSize,\n });\n}\n","import type {Modifier} from '@dnd-kit/core';\n\nexport const restrictToHorizontalAxis: Modifier = ({transform}) => {\n return {\n ...transform,\n y: 0,\n };\n};\n","import type {ClientRect} from '@dnd-kit/core';\nimport type {Transform} from '@dnd-kit/utilities';\n\nexport function restrictToBoundingRect(\n transform: Transform,\n rect: ClientRect,\n boundingRect: ClientRect\n): Transform {\n const value = {\n ...transform,\n };\n\n if (rect.top + transform.y <= boundingRect.top) {\n value.y = boundingRect.top - rect.top;\n } else if (\n rect.bottom + transform.y >=\n boundingRect.top + boundingRect.height\n ) {\n value.y = boundingRect.top + boundingRect.height - rect.bottom;\n }\n\n if (rect.left + transform.x <= boundingRect.left) {\n value.x = boundingRect.left - rect.left;\n } else if (\n rect.right + transform.x >=\n boundingRect.left + boundingRect.width\n ) {\n value.x = boundingRect.left + boundingRect.width - rect.right;\n }\n\n return value;\n}\n","import type {Modifier} from '@dnd-kit/core';\nimport {restrictToBoundingRect} from './utilities';\n\nexport const restrictToParentElement: Modifier = ({\n
|
1
|
+
{"version":3,"file":"modifiers.esm.js","sources":["../src/createSnapModifier.ts","../src/restrictToHorizontalAxis.ts","../src/utilities/restrictToBoundingRect.ts","../src/restrictToParentElement.ts","../src/restrictToFirstScrollableAncestor.ts","../src/restrictToVerticalAxis.ts","../src/restrictToWindowEdges.ts","../src/snapCenterToCursor.ts"],"sourcesContent":["import type {Modifier} from '@dnd-kit/core';\n\nexport function createSnapModifier(gridSize: number): Modifier {\n return ({transform}) => ({\n ...transform,\n x: Math.ceil(transform.x / gridSize) * gridSize,\n y: Math.ceil(transform.y / gridSize) * gridSize,\n });\n}\n","import type {Modifier} from '@dnd-kit/core';\n\nexport const restrictToHorizontalAxis: Modifier = ({transform}) => {\n return {\n ...transform,\n y: 0,\n };\n};\n","import type {ClientRect} from '@dnd-kit/core';\nimport type {Transform} from '@dnd-kit/utilities';\n\nexport function restrictToBoundingRect(\n transform: Transform,\n rect: ClientRect,\n boundingRect: ClientRect\n): Transform {\n const value = {\n ...transform,\n };\n\n if (rect.top + transform.y <= boundingRect.top) {\n value.y = boundingRect.top - rect.top;\n } else if (\n rect.bottom + transform.y >=\n boundingRect.top + boundingRect.height\n ) {\n value.y = boundingRect.top + boundingRect.height - rect.bottom;\n }\n\n if (rect.left + transform.x <= boundingRect.left) {\n value.x = boundingRect.left - rect.left;\n } else if (\n rect.right + transform.x >=\n boundingRect.left + boundingRect.width\n ) {\n value.x = boundingRect.left + boundingRect.width - rect.right;\n }\n\n return value;\n}\n","import type {Modifier} from '@dnd-kit/core';\nimport {restrictToBoundingRect} from './utilities';\n\nexport const restrictToParentElement: Modifier = ({\n containerNodeRect,\n draggingNodeRect,\n transform,\n}) => {\n if (!draggingNodeRect || !containerNodeRect) {\n return transform;\n }\n\n return restrictToBoundingRect(transform, draggingNodeRect, containerNodeRect);\n};\n","import type {Modifier} from '@dnd-kit/core';\nimport {restrictToBoundingRect} from './utilities';\n\nexport const restrictToFirstScrollableAncestor: Modifier = ({\n draggingNodeRect,\n transform,\n scrollableAncestorRects,\n}) => {\n const firstScrollableAncestorRect = scrollableAncestorRects[0];\n\n if (!draggingNodeRect || !firstScrollableAncestorRect) {\n return transform;\n }\n\n return restrictToBoundingRect(\n transform,\n draggingNodeRect,\n firstScrollableAncestorRect\n );\n};\n","import type {Modifier} from '@dnd-kit/core';\n\nexport const restrictToVerticalAxis: Modifier = ({transform}) => {\n return {\n ...transform,\n x: 0,\n };\n};\n","import type {Modifier} from '@dnd-kit/core';\n\nimport {restrictToBoundingRect} from './utilities';\n\nexport const restrictToWindowEdges: Modifier = ({\n transform,\n draggingNodeRect,\n windowRect,\n}) => {\n if (!draggingNodeRect || !windowRect) {\n return transform;\n }\n\n return restrictToBoundingRect(transform, draggingNodeRect, windowRect);\n};\n","import type {Modifier} from '@dnd-kit/core';\nimport {getEventCoordinates} from '@dnd-kit/utilities';\n\nexport const snapCenterToCursor: Modifier = ({\n activatorEvent,\n draggingNodeRect,\n transform,\n}) => {\n if (draggingNodeRect && activatorEvent) {\n const activatorCoordinates = getEventCoordinates(activatorEvent);\n\n if (!activatorCoordinates) {\n return transform;\n }\n\n const offsetX = activatorCoordinates.x - draggingNodeRect.left;\n const offsetY = activatorCoordinates.y - draggingNodeRect.top;\n\n return {\n ...transform,\n x: transform.x + offsetX - draggingNodeRect.width / 2,\n y: transform.y + offsetY - draggingNodeRect.height / 2,\n };\n }\n\n return transform;\n};\n"],"names":["createSnapModifier","gridSize","transform","x","Math","ceil","y","restrictToHorizontalAxis","restrictToBoundingRect","rect","boundingRect","value","top","bottom","height","left","right","width","restrictToParentElement","containerNodeRect","draggingNodeRect","restrictToFirstScrollableAncestor","scrollableAncestorRects","firstScrollableAncestorRect","restrictToVerticalAxis","restrictToWindowEdges","windowRect","snapCenterToCursor","activatorEvent","activatorCoordinates","getEventCoordinates","offsetX","offsetY"],"mappings":"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"}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@dnd-kit/modifiers",
|
3
|
-
"version": "5.0.0-next-
|
3
|
+
"version": "5.0.0-next-202209154910",
|
4
4
|
"description": "Translate modifier presets for use with `@dnd-kit` packages.",
|
5
5
|
"author": "Claudéric Demers",
|
6
6
|
"license": "MIT",
|
@@ -26,14 +26,14 @@
|
|
26
26
|
"dist"
|
27
27
|
],
|
28
28
|
"dependencies": {
|
29
|
-
"@dnd-kit/utilities": "^3.1.0-next-
|
29
|
+
"@dnd-kit/utilities": "^3.1.0-next-202209154910",
|
30
30
|
"tslib": "^2.0.0"
|
31
31
|
},
|
32
32
|
"peerDependencies": {
|
33
|
-
"@dnd-kit/core": "^5.0.0-next-
|
33
|
+
"@dnd-kit/core": "^5.0.0-next-202209154910"
|
34
34
|
},
|
35
35
|
"devDependencies": {
|
36
|
-
"@dnd-kit/core": "^5.0.0-next-
|
36
|
+
"@dnd-kit/core": "^5.0.0-next-202209154910"
|
37
37
|
},
|
38
38
|
"publishConfig": {
|
39
39
|
"access": "public"
|