Marc Mintel
5397309103
Some checks failed
Build & Deploy / 🔍 Prepare (push) Successful in 20s
Build & Deploy / 🧪 QA (push) Failing after 34s
Build & Deploy / 🏗️ Build (push) Has started running
Build & Deploy / 🚀 Deploy (push) Has been cancelled
Build & Deploy / 🧪 Smoke Test (push) Has been cancelled
Build & Deploy / ⚡ Lighthouse (push) Has been cancelled
Build & Deploy / 🔔 Notify (push) Has been cancelled
29 lines
1.2 KiB
Plaintext
29 lines
1.2 KiB
Plaintext
import { rectIntersection } from '@dnd-kit/core';
|
|
// If the toolbar exits the preview area, we need to reset its position
|
|
// This will prevent the toolbar from getting stuck outside the preview area
|
|
export const customCollisionDetection = ({
|
|
collisionRect,
|
|
droppableContainers,
|
|
...args
|
|
}) => {
|
|
const droppableContainer = droppableContainers.find(({
|
|
id
|
|
}) => id === 'live-preview-area');
|
|
const rectIntersectionCollisions = rectIntersection({
|
|
...args,
|
|
collisionRect,
|
|
droppableContainers: [droppableContainer]
|
|
});
|
|
// Collision detection algorithms return an array of collisions
|
|
if (rectIntersectionCollisions.length === 0) {
|
|
// The preview area is not intersecting, return early
|
|
return rectIntersectionCollisions;
|
|
}
|
|
// Compute whether the draggable element is completely contained within the preview area
|
|
const previewAreaRect = droppableContainer?.rect?.current;
|
|
const isContained = collisionRect.top >= previewAreaRect.top && collisionRect.left >= previewAreaRect.left && collisionRect.bottom <= previewAreaRect.bottom && collisionRect.right <= previewAreaRect.right;
|
|
if (isContained) {
|
|
return rectIntersectionCollisions;
|
|
}
|
|
};
|
|
//# sourceMappingURL=collisionDetection.js.map |