@lucasols/dnd-kit-core 0.1.3 → 0.2.0

package/dist/index.js

@@ -1,8 +1,2627 @@
-
-'use strict'
-
-if (process.env.NODE_ENV === 'production') {
-  module.exports = require('./dnd-kit-core.cjs.production.min.js')
-} else {
-  module.exports = require('./dnd-kit-core.cjs.development.js')
+import React, { cloneElement, createContext, forwardRef, memo, useCallback, useContext, useEffect, useMemo, useReducer, useRef, useState } from "react";
+import { createPortal } from "react-dom";
+import { CSS, add, canUseDOM, findFirstFocusableNode, getEventCoordinates, getOwnerDocument, getWindow, isDocument, isHTMLElement, isKeyboardEvent, isNode, isSVGElement, isWindow, subtract, useEvent, useInterval, useIsomorphicLayoutEffect, useLatestValue, useLazyMemo, useNodeRef, usePrevious, useUniqueId } from "@lucasols/dnd-kit-utilities";
+import { HiddenText, LiveRegion, useAnnouncement } from "@lucasols/dnd-kit-accessibility";
+//#region src/components/DndMonitor/context.ts
+const DndMonitorContext = createContext(null);
+//#endregion
+//#region src/components/DndMonitor/useDndMonitor.ts
+function useDndMonitor(listener) {
+	const registerListener = useContext(DndMonitorContext);
+	useEffect(() => {
+		if (!registerListener) throw new Error("useDndMonitor must be used within a children of <DndContext>");
+		return registerListener(listener);
+	}, [listener, registerListener]);
+}
+//#endregion
+//#region src/components/DndMonitor/useDndMonitorProvider.tsx
+function useDndMonitorProvider() {
+	const [listeners] = useState(() => /* @__PURE__ */ new Set());
+	const registerListener = useCallback((listener) => {
+		listeners.add(listener);
+		return () => listeners.delete(listener);
+	}, [listeners]);
+	return [useCallback(({ type, event }) => {
+		listeners.forEach((listener) => listener[type]?.(event));
+	}, [listeners]), registerListener];
+}
+//#endregion
+//#region src/components/Accessibility/defaults.ts
+const defaultScreenReaderInstructions = { draggable: `
+    To pick up a draggable item, press the space bar.
+    While dragging, use the arrow keys to move the item.
+    Press space again to drop the item in its new position, or press escape to cancel.
+  ` };
+const defaultAnnouncements = {
+	onDragStart({ active }) {
+		return `Picked up draggable item ${active.id}.`;
+	},
+	onDragOver({ active, over }) {
+		if (over) return `Draggable item ${active.id} was moved over droppable area ${over.id}.`;
+		return `Draggable item ${active.id} is no longer over a droppable area.`;
+	},
+	onDragEnd({ active, over }) {
+		if (over) return `Draggable item ${active.id} was dropped over droppable area ${over.id}`;
+		return `Draggable item ${active.id} was dropped.`;
+	},
+	onDragCancel({ active }) {
+		return `Dragging was cancelled. Draggable item ${active.id} was dropped.`;
+	}
+};
+//#endregion
+//#region src/components/Accessibility/Accessibility.tsx
+function Accessibility({ announcements = defaultAnnouncements, container, hiddenTextDescribedById, screenReaderInstructions = defaultScreenReaderInstructions }) {
+	const { announce, announcement } = useAnnouncement();
+	const liveRegionId = useUniqueId(`DndLiveRegion`);
+	const [mounted, setMounted] = useState(false);
+	useEffect(() => {
+		setMounted(true);
+	}, []);
+	useDndMonitor(useMemo(() => ({
+		onDragStart({ active }) {
+			announce(announcements.onDragStart({ active }));
+		},
+		onDragMove({ active, over }) {
+			if (announcements.onDragMove) announce(announcements.onDragMove({
+				active,
+				over
+			}));
+		},
+		onDragOver({ active, over }) {
+			announce(announcements.onDragOver({
+				active,
+				over
+			}));
+		},
+		onDragEnd({ active, over }) {
+			announce(announcements.onDragEnd({
+				active,
+				over
+			}));
+		},
+		onDragCancel({ active, over }) {
+			announce(announcements.onDragCancel({
+				active,
+				over
+			}));
+		}
+	}), [announce, announcements]));
+	if (!mounted) return null;
+	const markup = /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(HiddenText, {
+		id: hiddenTextDescribedById,
+		value: screenReaderInstructions.draggable
+	}), /* @__PURE__ */ React.createElement(LiveRegion, {
+		id: liveRegionId,
+		announcement
+	}));
+	return container ? createPortal(markup, container) : markup;
+}
+//#endregion
+//#region src/utilities/other/noop.ts
+function noop(..._args) {}
+//#endregion
+//#region src/sensors/useSensor.ts
+function useSensor(sensor, options) {
+	return useMemo(() => ({
+		sensor,
+		options: options ?? {}
+	}), [sensor, options]);
+}
+//#endregion
+//#region src/sensors/useSensors.ts
+function useSensors(...sensors) {
+	return useMemo(() => [...sensors].filter((sensor) => sensor != null), [...sensors]);
+}
+//#endregion
+//#region src/utilities/coordinates/constants.ts
+const defaultCoordinates = Object.freeze({
+	x: 0,
+	y: 0
+});
+//#endregion
+//#region src/utilities/coordinates/distanceBetweenPoints.ts
+/**
+* Returns the distance between two points
+*/
+function distanceBetween(p1, p2) {
+	return Math.sqrt(Math.pow(p1.x - p2.x, 2) + Math.pow(p1.y - p2.y, 2));
+}
+//#endregion
+//#region src/utilities/coordinates/getRelativeTransformOrigin.ts
+function getRelativeTransformOrigin(event, rect) {
+	const eventCoordinates = getEventCoordinates(event);
+	if (!eventCoordinates) return "0 0";
+	const transformOrigin = {
+		x: (eventCoordinates.x - rect.left) / rect.width * 100,
+		y: (eventCoordinates.y - rect.top) / rect.height * 100
+	};
+	return `${transformOrigin.x}% ${transformOrigin.y}%`;
+}
+//#endregion
+//#region src/utilities/algorithms/helpers.ts
+/**
+* Sort collisions from smallest to greatest value
+*/
+function sortCollisionsAsc({ data: { value: a } }, { data: { value: b } }) {
+	return a - b;
+}
+/**
+* Sort collisions from greatest to smallest value
+*/
+function sortCollisionsDesc({ data: { value: a } }, { data: { value: b } }) {
+	return b - a;
+}
+/**
+* Returns the coordinates of the corners of a given rectangle:
+* [TopLeft {x, y}, TopRight {x, y}, BottomLeft {x, y}, BottomRight {x, y}]
+*/
+function cornersOfRectangle({ left, top, height, width }) {
+	return [
+		{
+			x: left,
+			y: top
+		},
+		{
+			x: left + width,
+			y: top
+		},
+		{
+			x: left,
+			y: top + height
+		},
+		{
+			x: left + width,
+			y: top + height
+		}
+	];
+}
+function getFirstCollision(collisions, property) {
+	if (!collisions || collisions.length === 0) return null;
+	const [firstCollision] = collisions;
+	return property ? firstCollision[property] : firstCollision;
+}
+//#endregion
+//#region src/utilities/algorithms/closestCenter.ts
+/**
+* Returns the coordinates of the center of a given ClientRect
+*/
+function centerOfRectangle(rect, left = rect.left, top = rect.top) {
+	return {
+		x: left + rect.width * .5,
+		y: top + rect.height * .5
+	};
+}
+/**
+* Returns the closest rectangles from an array of rectangles to the center of a given
+* rectangle.
+*/
+const closestCenter = ({ collisionRect, droppableRects, droppableContainers }) => {
+	const centerRect = centerOfRectangle(collisionRect, collisionRect.left, collisionRect.top);
+	const collisions = [];
+	for (const droppableContainer of droppableContainers) {
+		const { id } = droppableContainer;
+		const rect = droppableRects.get(id);
+		if (rect) {
+			const distBetween = distanceBetween(centerOfRectangle(rect), centerRect);
+			collisions.push({
+				id,
+				data: {
+					droppableContainer,
+					value: distBetween
+				}
+			});
+		}
+	}
+	return collisions.sort(sortCollisionsAsc);
+};
+//#endregion
+//#region src/utilities/algorithms/closestCorners.ts
+/**
+* Returns the closest rectangles from an array of rectangles to the corners of
+* another rectangle.
+*/
+const closestCorners = ({ collisionRect, droppableRects, droppableContainers }) => {
+	const corners = cornersOfRectangle(collisionRect);
+	const collisions = [];
+	for (const droppableContainer of droppableContainers) {
+		const { id } = droppableContainer;
+		const rect = droppableRects.get(id);
+		if (rect) {
+			const rectCorners = cornersOfRectangle(rect);
+			const distances = corners.reduce((accumulator, corner, index) => {
+				return accumulator + distanceBetween(rectCorners[index], corner);
+			}, 0);
+			const effectiveDistance = Number((distances / 4).toFixed(4));
+			collisions.push({
+				id,
+				data: {
+					droppableContainer,
+					value: effectiveDistance
+				}
+			});
+		}
+	}
+	return collisions.sort(sortCollisionsAsc);
+};
+//#endregion
+//#region src/utilities/algorithms/rectIntersection.ts
+/**
+* Returns the intersecting rectangle area between two rectangles
+*/
+function getIntersectionRatio(entry, target) {
+	const top = Math.max(target.top, entry.top);
+	const left = Math.max(target.left, entry.left);
+	const right = Math.min(target.left + target.width, entry.left + entry.width);
+	const bottom = Math.min(target.top + target.height, entry.top + entry.height);
+	const width = right - left;
+	const height = bottom - top;
+	if (left < right && top < bottom) {
+		const targetArea = target.width * target.height;
+		const entryArea = entry.width * entry.height;
+		const intersectionArea = width * height;
+		const intersectionRatio = intersectionArea / (targetArea + entryArea - intersectionArea);
+		return Number(intersectionRatio.toFixed(4));
+	}
+	return 0;
+}
+/**
+* Returns the rectangles that has the greatest intersection area with a given
+* rectangle in an array of rectangles.
+*/
+const rectIntersection = ({ collisionRect, droppableRects, droppableContainers }) => {
+	const collisions = [];
+	for (const droppableContainer of droppableContainers) {
+		const { id } = droppableContainer;
+		const rect = droppableRects.get(id);
+		if (rect) {
+			const intersectionRatio = getIntersectionRatio(rect, collisionRect);
+			if (intersectionRatio > 0) collisions.push({
+				id,
+				data: {
+					droppableContainer,
+					value: intersectionRatio
+				}
+			});
+		}
+	}
+	return collisions.sort(sortCollisionsDesc);
+};
+//#endregion
+//#region src/utilities/algorithms/pointerWithin.ts
+/**
+* Check if a given point is contained within a bounding rectangle
+*/
+function isPointWithinRect(point, rect) {
+	const { top, left, bottom, right } = rect;
+	return top <= point.y && point.y <= bottom && left <= point.x && point.x <= right;
+}
+/**
+* Returns the rectangles that the pointer is hovering over
+*/
+const pointerWithin = ({ droppableContainers, droppableRects, pointerCoordinates }) => {
+	if (!pointerCoordinates) return [];
+	const collisions = [];
+	for (const droppableContainer of droppableContainers) {
+		const { id } = droppableContainer;
+		const rect = droppableRects.get(id);
+		if (rect && isPointWithinRect(pointerCoordinates, rect)) {
+			const distances = cornersOfRectangle(rect).reduce((accumulator, corner) => {
+				return accumulator + distanceBetween(pointerCoordinates, corner);
+			}, 0);
+			const effectiveDistance = Number((distances / 4).toFixed(4));
+			collisions.push({
+				id,
+				data: {
+					droppableContainer,
+					value: effectiveDistance
+				}
+			});
+		}
+	}
+	return collisions.sort(sortCollisionsAsc);
+};
+//#endregion
+//#region src/utilities/rect/adjustScale.ts
+function adjustScale(transform, rect1, rect2) {
+	return {
+		...transform,
+		scaleX: rect1 && rect2 ? rect1.width / rect2.width : 1,
+		scaleY: rect1 && rect2 ? rect1.height / rect2.height : 1
+	};
+}
+//#endregion
+//#region src/utilities/rect/getRectDelta.ts
+function getRectDelta(rect1, rect2) {
+	return rect1 && rect2 ? {
+		x: rect1.left - rect2.left,
+		y: rect1.top - rect2.top
+	} : defaultCoordinates;
+}
+//#endregion
+//#region src/utilities/rect/rectAdjustment.ts
+function createRectAdjustmentFn(modifier) {
+	return function adjustClientRect(rect, ...adjustments) {
+		return adjustments.reduce((acc, adjustment) => ({
+			...acc,
+			top: acc.top + modifier * adjustment.y,
+			bottom: acc.bottom + modifier * adjustment.y,
+			left: acc.left + modifier * adjustment.x,
+			right: acc.right + modifier * adjustment.x
+		}), { ...rect });
+	};
+}
+const getAdjustedRect = createRectAdjustmentFn(1);
+//#endregion
+//#region src/utilities/transform/parseTransform.ts
+function parseTransform(transform) {
+	if (transform.startsWith("matrix3d(")) {
+		const transformArray = transform.slice(9, -1).split(/, /);
+		return {
+			x: +transformArray[12],
+			y: +transformArray[13],
+			scaleX: +transformArray[0],
+			scaleY: +transformArray[5]
+		};
+	} else if (transform.startsWith("matrix(")) {
+		const transformArray = transform.slice(7, -1).split(/, /);
+		return {
+			x: +transformArray[4],
+			y: +transformArray[5],
+			scaleX: +transformArray[0],
+			scaleY: +transformArray[3]
+		};
+	}
+	return null;
+}
+//#endregion
+//#region src/utilities/transform/inverseTransform.ts
+function inverseTransform(rect, transform, transformOrigin) {
+	const parsedTransform = parseTransform(transform);
+	if (!parsedTransform) return rect;
+	const { scaleX, scaleY, x: translateX, y: translateY } = parsedTransform;
+	const x = rect.left - translateX - (1 - scaleX) * parseFloat(transformOrigin);
+	const y = rect.top - translateY - (1 - scaleY) * parseFloat(transformOrigin.slice(transformOrigin.indexOf(" ") + 1));
+	const w = scaleX ? rect.width / scaleX : rect.width;
+	const h = scaleY ? rect.height / scaleY : rect.height;
+	return {
+		width: w,
+		height: h,
+		top: y,
+		right: x + w,
+		bottom: y + h,
+		left: x
+	};
+}
+//#endregion
+//#region src/utilities/rect/getRect.ts
+const defaultOptions = { ignoreTransform: false };
+/**
+* Returns the bounding client rect of an element relative to the viewport.
+*/
+function getClientRect(element, options = defaultOptions) {
+	let rect = element.getBoundingClientRect();
+	if (options.ignoreTransform) {
+		const { transform, transformOrigin } = getWindow(element).getComputedStyle(element);
+		if (transform) rect = inverseTransform(rect, transform, transformOrigin);
+	}
+	const { top, left, width, height, bottom, right } = rect;
+	return {
+		top,
+		left,
+		width,
+		height,
+		bottom,
+		right
+	};
+}
+/**
+* Returns the bounding client rect of an element relative to the viewport.
+*
+* @remarks
+* The ClientRect returned by this method does not take into account transforms
+* applied to the element it measures.
+*
+*/
+function getTransformAgnosticClientRect(element) {
+	return getClientRect(element, { ignoreTransform: true });
+}
+//#endregion
+//#region src/utilities/rect/getWindowClientRect.ts
+function getWindowClientRect(element) {
+	const width = element.innerWidth;
+	const height = element.innerHeight;
+	return {
+		top: 0,
+		left: 0,
+		right: width,
+		bottom: height,
+		width,
+		height
+	};
+}
+//#endregion
+//#region src/utilities/scroll/isFixed.ts
+function isFixed(node, computedStyle = getWindow(node).getComputedStyle(node)) {
+	return computedStyle.position === "fixed";
+}
+//#endregion
+//#region src/utilities/scroll/isScrollable.ts
+function isScrollable(element, computedStyle = getWindow(element).getComputedStyle(element)) {
+	const overflowRegex = /(auto|scroll|overlay)/;
+	return [
+		"overflow",
+		"overflowX",
+		"overflowY"
+	].some((property) => {
+		const value = computedStyle[property];
+		return typeof value === "string" ? overflowRegex.test(value) : false;
+	});
+}
+//#endregion
+//#region src/utilities/scroll/getScrollableAncestors.ts
+function getScrollableAncestors(element, limit) {
+	const scrollParents = [];
+	function findScrollableAncestors(node) {
+		if (limit != null && scrollParents.length >= limit) return scrollParents;
+		if (!node) return scrollParents;
+		if (isDocument(node) && node.scrollingElement != null && !scrollParents.includes(node.scrollingElement)) {
+			scrollParents.push(node.scrollingElement);
+			return scrollParents;
+		}
+		if (!isHTMLElement(node) || isSVGElement(node)) return scrollParents;
+		if (scrollParents.includes(node)) return scrollParents;
+		const computedStyle = getWindow(element).getComputedStyle(node);
+		if (node !== element) {
+			if (isScrollable(node, computedStyle)) scrollParents.push(node);
+		}
+		if (isFixed(node, computedStyle)) return scrollParents;
+		return findScrollableAncestors(node.parentNode);
+	}
+	if (!element) return scrollParents;
+	return findScrollableAncestors(element);
+}
+function getFirstScrollableAncestor(node) {
+	const [firstScrollableAncestor] = getScrollableAncestors(node, 1);
+	return firstScrollableAncestor ?? null;
+}
+//#endregion
+//#region src/utilities/scroll/getScrollableElement.ts
+function getScrollableElement(element) {
+	if (!canUseDOM || !element) return null;
+	if (isWindow(element)) return element;
+	if (!isNode(element)) return null;
+	if (isDocument(element) || element === getOwnerDocument(element).scrollingElement) return window;
+	if (isHTMLElement(element)) return element;
+	return null;
+}
+//#endregion
+//#region src/utilities/scroll/getScrollCoordinates.ts
+function getScrollXCoordinate(element) {
+	if (isWindow(element)) return element.scrollX;
+	return element.scrollLeft;
+}
+function getScrollYCoordinate(element) {
+	if (isWindow(element)) return element.scrollY;
+	return element.scrollTop;
+}
+function getScrollCoordinates(element) {
+	return {
+		x: getScrollXCoordinate(element),
+		y: getScrollYCoordinate(element)
+	};
+}
+//#endregion
+//#region src/utilities/scroll/documentScrollingElement.ts
+function isDocumentScrollingElement(element) {
+	if (!canUseDOM || !element) return false;
+	return element === document.scrollingElement;
+}
+//#endregion
+//#region src/utilities/scroll/getScrollPosition.ts
+function getScrollPosition(scrollingContainer) {
+	const minScroll = {
+		x: 0,
+		y: 0
+	};
+	const dimensions = isDocumentScrollingElement(scrollingContainer) ? {
+		height: window.innerHeight,
+		width: window.innerWidth
+	} : {
+		height: scrollingContainer.clientHeight,
+		width: scrollingContainer.clientWidth
+	};
+	const maxScroll = {
+		x: scrollingContainer.scrollWidth - dimensions.width,
+		y: scrollingContainer.scrollHeight - dimensions.height
+	};
+	return {
+		isTop: scrollingContainer.scrollTop <= minScroll.y,
+		isLeft: scrollingContainer.scrollLeft <= minScroll.x,
+		isBottom: scrollingContainer.scrollTop >= maxScroll.y,
+		isRight: scrollingContainer.scrollLeft >= maxScroll.x,
+		maxScroll,
+		minScroll
+	};
+}
+//#endregion
+//#region src/utilities/scroll/getScrollDirectionAndSpeed.ts
+const defaultThreshold = {
+	x: .2,
+	y: .2
+};
+function getScrollDirectionAndSpeed(scrollContainer, scrollContainerRect, { top, left, right, bottom }, acceleration = 10, thresholdPercentage = defaultThreshold) {
+	const { isTop, isBottom, isLeft, isRight } = getScrollPosition(scrollContainer);
+	const direction = {
+		x: 0,
+		y: 0
+	};
+	const speed = {
+		x: 0,
+		y: 0
+	};
+	const threshold = {
+		height: scrollContainerRect.height * thresholdPercentage.y,
+		width: scrollContainerRect.width * thresholdPercentage.x
+	};
+	if (!isTop && top <= scrollContainerRect.top + threshold.height) {
+		direction.y = -1;
+		speed.y = acceleration * Math.abs((scrollContainerRect.top + threshold.height - top) / threshold.height);
+	} else if (!isBottom && bottom >= scrollContainerRect.bottom - threshold.height) {
+		direction.y = 1;
+		speed.y = acceleration * Math.abs((scrollContainerRect.bottom - threshold.height - bottom) / threshold.height);
+	}
+	if (!isRight && right >= scrollContainerRect.right - threshold.width) {
+		direction.x = 1;
+		speed.x = acceleration * Math.abs((scrollContainerRect.right - threshold.width - right) / threshold.width);
+	} else if (!isLeft && left <= scrollContainerRect.left + threshold.width) {
+		direction.x = -1;
+		speed.x = acceleration * Math.abs((scrollContainerRect.left + threshold.width - left) / threshold.width);
+	}
+	return {
+		direction,
+		speed
+	};
+}
+//#endregion
+//#region src/utilities/scroll/getScrollElementRect.ts
+function getScrollElementRect(element) {
+	if (element === document.scrollingElement) {
+		const { innerWidth, innerHeight } = window;
+		return {
+			top: 0,
+			left: 0,
+			right: innerWidth,
+			bottom: innerHeight,
+			width: innerWidth,
+			height: innerHeight
+		};
+	}
+	const { top, left, right, bottom } = element.getBoundingClientRect();
+	return {
+		top,
+		left,
+		right,
+		bottom,
+		width: element.clientWidth,
+		height: element.clientHeight
+	};
+}
+//#endregion
+//#region src/utilities/scroll/getScrollOffsets.ts
+function getScrollOffsets(scrollableAncestors) {
+	return scrollableAncestors.reduce((acc, node) => {
+		return add(acc, getScrollCoordinates(node));
+	}, defaultCoordinates);
+}
+function getScrollXOffset(scrollableAncestors) {
+	return scrollableAncestors.reduce((acc, node) => {
+		return acc + getScrollXCoordinate(node);
+	}, 0);
+}
+function getScrollYOffset(scrollableAncestors) {
+	return scrollableAncestors.reduce((acc, node) => {
+		return acc + getScrollYCoordinate(node);
+	}, 0);
+}
+//#endregion
+//#region src/utilities/scroll/scrollIntoViewIfNeeded.ts
+function scrollIntoViewIfNeeded(element, measure = getClientRect) {
+	if (!element) return;
+	const { top, left, bottom, right } = measure(element);
+	if (!getFirstScrollableAncestor(element)) return;
+	if (bottom <= 0 || right <= 0 || top >= window.innerHeight || left >= window.innerWidth) element.scrollIntoView({
+		block: "center",
+		inline: "center"
+	});
+}
+//#endregion
+//#region src/utilities/rect/Rect.ts
+const properties = [[
+	"x",
+	["left", "right"],
+	getScrollXOffset
+], [
+	"y",
+	["top", "bottom"],
+	getScrollYOffset
+]];
+var Rect = class {
+	constructor(rect, element) {
+		const scrollableAncestors = getScrollableAncestors(element);
+		const scrollOffsets = getScrollOffsets(scrollableAncestors);
+		this.rect = { ...rect };
+		this.width = rect.width;
+		this.height = rect.height;
+		for (const [axis, keys, getScrollOffset] of properties) for (const key of keys) Object.defineProperty(this, key, {
+			get: () => {
+				const currentOffsets = getScrollOffset(scrollableAncestors);
+				const scrollOffsetsDeltla = scrollOffsets[axis] - currentOffsets;
+				return this.rect[key] + scrollOffsetsDeltla;
+			},
+			enumerable: true
+		});
+		Object.defineProperty(this, "rect", { enumerable: false });
+	}
+	rect;
+	width;
+	height;
+	top;
+	bottom;
+	right;
+	left;
+};
+//#endregion
+//#region src/sensors/utilities/Listeners.ts
+var Listeners = class {
+	target;
+	listeners = [];
+	constructor(target) {
+		this.target = target;
+	}
+	add(eventName, handler, options) {
+		this.target?.addEventListener(eventName, handler, options);
+		this.listeners.push([
+			eventName,
+			handler,
+			options
+		]);
+	}
+	removeAll = () => {
+		this.listeners.forEach((listener) => this.target?.removeEventListener(...listener));
+	};
+};
+//#endregion
+//#region src/sensors/utilities/getEventListenerTarget.ts
+function getEventListenerTarget(target) {
+	const { EventTarget } = getWindow(target);
+	return target instanceof EventTarget ? target : getOwnerDocument(target);
+}
+//#endregion
+//#region src/sensors/utilities/hasExceededDistance.ts
+function hasExceededDistance(delta, measurement) {
+	const dx = Math.abs(delta.x);
+	const dy = Math.abs(delta.y);
+	if (typeof measurement === "number") return Math.sqrt(dx ** 2 + dy ** 2) > measurement;
+	if ("x" in measurement && "y" in measurement) return dx > measurement.x && dy > measurement.y;
+	if ("x" in measurement) return dx > measurement.x;
+	if ("y" in measurement) return dy > measurement.y;
+	return false;
 }
+//#endregion
+//#region src/sensors/events.ts
+function preventDefault(event) {
+	event.preventDefault();
+}
+function stopPropagation(event) {
+	event.stopPropagation();
+}
+//#endregion
+//#region src/sensors/keyboard/types.ts
+let KeyboardCode = /* @__PURE__ */ function(KeyboardCode) {
+	KeyboardCode["Space"] = "Space";
+	KeyboardCode["Down"] = "ArrowDown";
+	KeyboardCode["Right"] = "ArrowRight";
+	KeyboardCode["Left"] = "ArrowLeft";
+	KeyboardCode["Up"] = "ArrowUp";
+	KeyboardCode["Esc"] = "Escape";
+	KeyboardCode["Enter"] = "Enter";
+	return KeyboardCode;
+}({});
+//#endregion
+//#region src/sensors/keyboard/defaults.ts
+const defaultKeyboardCodes = {
+	start: ["Space", "Enter"],
+	cancel: ["Escape"],
+	end: ["Space", "Enter"]
+};
+const defaultKeyboardCoordinateGetter = (event, { currentCoordinates }) => {
+	switch (event.code) {
+		case "ArrowRight": return {
+			...currentCoordinates,
+			x: currentCoordinates.x + 25
+		};
+		case "ArrowLeft": return {
+			...currentCoordinates,
+			x: currentCoordinates.x - 25
+		};
+		case "ArrowDown": return {
+			...currentCoordinates,
+			y: currentCoordinates.y + 25
+		};
+		case "ArrowUp": return {
+			...currentCoordinates,
+			y: currentCoordinates.y - 25
+		};
+	}
+};
+//#endregion
+//#region src/sensors/keyboard/KeyboardSensor.ts
+var KeyboardSensor = class {
+	props;
+	autoScrollEnabled = false;
+	referenceCoordinates;
+	listeners;
+	windowListeners;
+	constructor(props) {
+		this.props = props;
+		const { event: { target } } = props;
+		this.listeners = new Listeners(getOwnerDocument(target));
+		this.windowListeners = new Listeners(getWindow(target));
+		this.handleKeyDown = this.handleKeyDown.bind(this);
+		this.handleCancel = this.handleCancel.bind(this);
+		this.attach();
+	}
+	attach() {
+		this.handleStart();
+		this.windowListeners.add("resize", this.handleCancel);
+		this.windowListeners.add("visibilitychange", this.handleCancel);
+		setTimeout(() => this.listeners.add("keydown", this.handleKeyDown));
+	}
+	handleStart() {
+		const { activeNode, onStart } = this.props;
+		const node = activeNode.node.current;
+		if (node) scrollIntoViewIfNeeded(node);
+		onStart(defaultCoordinates);
+	}
+	handleKeyDown(event) {
+		if (isKeyboardEvent(event)) {
+			const { active, context, options } = this.props;
+			const { keyboardCodes = defaultKeyboardCodes, coordinateGetter = defaultKeyboardCoordinateGetter, scrollBehavior = "smooth" } = options;
+			const { code } = event;
+			if (keyboardCodes.end.includes(code)) {
+				this.handleEnd(event);
+				return;
+			}
+			if (keyboardCodes.cancel.includes(code)) {
+				this.handleCancel(event);
+				return;
+			}
+			const { collisionRect } = context.current;
+			const currentCoordinates = collisionRect ? {
+				x: collisionRect.left,
+				y: collisionRect.top
+			} : defaultCoordinates;
+			if (!this.referenceCoordinates) this.referenceCoordinates = currentCoordinates;
+			const newCoordinates = coordinateGetter(event, {
+				active,
+				context: context.current,
+				currentCoordinates
+			});
+			if (newCoordinates) {
+				const coordinatesDelta = subtract(newCoordinates, currentCoordinates);
+				const scrollDelta = {
+					x: 0,
+					y: 0
+				};
+				const { scrollableAncestors } = context.current;
+				for (const scrollContainer of scrollableAncestors) {
+					const direction = event.code;
+					const { isTop, isRight, isLeft, isBottom, maxScroll, minScroll } = getScrollPosition(scrollContainer);
+					const scrollElementRect = getScrollElementRect(scrollContainer);
+					const clampedCoordinates = {
+						x: Math.min(direction === "ArrowRight" ? scrollElementRect.right - scrollElementRect.width / 2 : scrollElementRect.right, Math.max(direction === "ArrowRight" ? scrollElementRect.left : scrollElementRect.left + scrollElementRect.width / 2, newCoordinates.x)),
+						y: Math.min(direction === "ArrowDown" ? scrollElementRect.bottom - scrollElementRect.height / 2 : scrollElementRect.bottom, Math.max(direction === "ArrowDown" ? scrollElementRect.top : scrollElementRect.top + scrollElementRect.height / 2, newCoordinates.y))
+					};
+					const canScrollX = direction === "ArrowRight" && !isRight || direction === "ArrowLeft" && !isLeft;
+					const canScrollY = direction === "ArrowDown" && !isBottom || direction === "ArrowUp" && !isTop;
+					if (canScrollX && clampedCoordinates.x !== newCoordinates.x) {
+						const newScrollCoordinates = scrollContainer.scrollLeft + coordinatesDelta.x;
+						const canScrollToNewCoordinates = direction === "ArrowRight" && newScrollCoordinates <= maxScroll.x || direction === "ArrowLeft" && newScrollCoordinates >= minScroll.x;
+						if (canScrollToNewCoordinates && !coordinatesDelta.y) {
+							scrollContainer.scrollTo({
+								left: newScrollCoordinates,
+								behavior: scrollBehavior
+							});
+							return;
+						}
+						if (canScrollToNewCoordinates) scrollDelta.x = scrollContainer.scrollLeft - newScrollCoordinates;
+						else scrollDelta.x = direction === "ArrowRight" ? scrollContainer.scrollLeft - maxScroll.x : scrollContainer.scrollLeft - minScroll.x;
+						if (scrollDelta.x) scrollContainer.scrollBy({
+							left: -scrollDelta.x,
+							behavior: scrollBehavior
+						});
+						break;
+					} else if (canScrollY && clampedCoordinates.y !== newCoordinates.y) {
+						const newScrollCoordinates = scrollContainer.scrollTop + coordinatesDelta.y;
+						const canScrollToNewCoordinates = direction === "ArrowDown" && newScrollCoordinates <= maxScroll.y || direction === "ArrowUp" && newScrollCoordinates >= minScroll.y;
+						if (canScrollToNewCoordinates && !coordinatesDelta.x) {
+							scrollContainer.scrollTo({
+								top: newScrollCoordinates,
+								behavior: scrollBehavior
+							});
+							return;
+						}
+						if (canScrollToNewCoordinates) scrollDelta.y = scrollContainer.scrollTop - newScrollCoordinates;
+						else scrollDelta.y = direction === "ArrowDown" ? scrollContainer.scrollTop - maxScroll.y : scrollContainer.scrollTop - minScroll.y;
+						if (scrollDelta.y) scrollContainer.scrollBy({
+							top: -scrollDelta.y,
+							behavior: scrollBehavior
+						});
+						break;
+					}
+				}
+				this.handleMove(event, add(subtract(newCoordinates, this.referenceCoordinates), scrollDelta));
+			}
+		}
+	}
+	handleMove(event, coordinates) {
+		const { onMove } = this.props;
+		event.preventDefault();
+		onMove(coordinates);
+	}
+	handleEnd(event) {
+		const { onEnd } = this.props;
+		event.preventDefault();
+		this.detach();
+		onEnd();
+	}
+	handleCancel(event) {
+		const { onCancel } = this.props;
+		event.preventDefault();
+		this.detach();
+		onCancel();
+	}
+	detach() {
+		this.listeners.removeAll();
+		this.windowListeners.removeAll();
+	}
+	static activators = [{
+		eventName: "onKeyDown",
+		handler: (event, { keyboardCodes = defaultKeyboardCodes, onActivation }, { active }) => {
+			const { code } = event.nativeEvent;
+			if (keyboardCodes.start.includes(code)) {
+				const activator = active.activatorNode.current;
+				if (activator && event.target !== activator) return false;
+				event.preventDefault();
+				onActivation?.({ event: event.nativeEvent });
+				return true;
+			}
+			return false;
+		}
+	}];
+};
+//#endregion
+//#region src/sensors/pointer/AbstractPointerSensor.ts
+function isDistanceConstraint(constraint) {
+	return Boolean(constraint && "distance" in constraint);
+}
+function isDelayConstraint(constraint) {
+	return Boolean(constraint && "delay" in constraint);
+}
+var AbstractPointerSensor = class {
+	props;
+	events;
+	autoScrollEnabled = true;
+	document;
+	activated = false;
+	initialCoordinates;
+	timeoutId = null;
+	listeners;
+	documentListeners;
+	windowListeners;
+	constructor(props, events, listenerTarget = getEventListenerTarget(props.event.target)) {
+		this.props = props;
+		this.events = events;
+		const { event } = props;
+		const { target } = event;
+		this.document = getOwnerDocument(target);
+		this.documentListeners = new Listeners(this.document);
+		this.listeners = new Listeners(listenerTarget);
+		this.windowListeners = new Listeners(getWindow(target));
+		this.initialCoordinates = getEventCoordinates(event) ?? defaultCoordinates;
+		this.handleStart = this.handleStart.bind(this);
+		this.handleMove = this.handleMove.bind(this);
+		this.handleEnd = this.handleEnd.bind(this);
+		this.handleCancel = this.handleCancel.bind(this);
+		this.handleKeydown = this.handleKeydown.bind(this);
+		this.removeTextSelection = this.removeTextSelection.bind(this);
+		this.attach();
+	}
+	attach() {
+		const { events, props: { options: { activationConstraint } } } = this;
+		this.listeners.add(events.move.name, this.handleMove, { passive: false });
+		this.listeners.add(events.end.name, this.handleEnd);
+		this.windowListeners.add("resize", this.handleCancel);
+		this.windowListeners.add("dragstart", preventDefault);
+		this.windowListeners.add("visibilitychange", this.handleCancel);
+		this.windowListeners.add("contextmenu", preventDefault);
+		this.documentListeners.add("keydown", this.handleKeydown);
+		if (activationConstraint) {
+			if (isDistanceConstraint(activationConstraint)) return;
+			if (isDelayConstraint(activationConstraint)) {
+				this.timeoutId = setTimeout(this.handleStart, activationConstraint.delay);
+				return;
+			}
+		}
+		this.handleStart();
+	}
+	detach() {
+		this.listeners.removeAll();
+		this.windowListeners.removeAll();
+		setTimeout(this.documentListeners.removeAll, 50);
+		if (this.timeoutId !== null) {
+			clearTimeout(this.timeoutId);
+			this.timeoutId = null;
+		}
+	}
+	handleStart() {
+		const { initialCoordinates } = this;
+		const { onStart } = this.props;
+		if (initialCoordinates) {
+			this.activated = true;
+			this.documentListeners.add("click", stopPropagation, { capture: true });
+			this.removeTextSelection();
+			this.documentListeners.add("selectionchange", this.removeTextSelection);
+			onStart(initialCoordinates);
+		}
+	}
+	handleMove(event) {
+		const { activated, initialCoordinates, props } = this;
+		const { onMove, options: { activationConstraint } } = props;
+		if (!initialCoordinates) return;
+		const coordinates = getEventCoordinates(event) ?? defaultCoordinates;
+		const delta = subtract(initialCoordinates, coordinates);
+		if (!activated && activationConstraint) {
+			if (isDelayConstraint(activationConstraint)) {
+				if (hasExceededDistance(delta, activationConstraint.tolerance)) return this.handleCancel();
+				return;
+			}
+			if (isDistanceConstraint(activationConstraint)) {
+				if (activationConstraint.tolerance != null && hasExceededDistance(delta, activationConstraint.tolerance)) return this.handleCancel();
+				if (hasExceededDistance(delta, activationConstraint.distance)) return this.handleStart();
+				return;
+			}
+		}
+		if (event.cancelable) event.preventDefault();
+		onMove(coordinates);
+	}
+	handleEnd() {
+		const { onEnd } = this.props;
+		this.detach();
+		onEnd();
+	}
+	handleCancel() {
+		const { onCancel } = this.props;
+		this.detach();
+		onCancel();
+	}
+	handleKeydown(event) {
+		if (event.code === "Escape") this.handleCancel();
+	}
+	removeTextSelection() {
+		this.document.getSelection()?.removeAllRanges();
+	}
+};
+//#endregion
+//#region src/sensors/pointer/PointerSensor.ts
+const events$2 = {
+	move: { name: "pointermove" },
+	end: { name: "pointerup" }
+};
+var PointerSensor = class extends AbstractPointerSensor {
+	constructor(props) {
+		const { event } = props;
+		const listenerTarget = getOwnerDocument(event.target);
+		super(props, events$2, listenerTarget);
+	}
+	static activators = [{
+		eventName: "onPointerDown",
+		handler: ({ nativeEvent: event }, { onActivation }) => {
+			if (!event.isPrimary || event.button !== 0) return false;
+			onActivation?.({ event });
+			return true;
+		}
+	}];
+};
+//#endregion
+//#region src/sensors/mouse/MouseSensor.ts
+const events$1 = {
+	move: { name: "mousemove" },
+	end: { name: "mouseup" }
+};
+var MouseSensor = class extends AbstractPointerSensor {
+	constructor(props) {
+		super(props, events$1, getOwnerDocument(props.event.target));
+	}
+	static activators = [{
+		eventName: "onMouseDown",
+		handler: ({ nativeEvent: event }, { onActivation }) => {
+			if (event.button === 2) return false;
+			onActivation?.({ event });
+			return true;
+		}
+	}];
+};
+//#endregion
+//#region src/sensors/touch/TouchSensor.ts
+const events = {
+	move: { name: "touchmove" },
+	end: { name: "touchend" }
+};
+var TouchSensor = class extends AbstractPointerSensor {
+	constructor(props) {
+		super(props, events);
+	}
+	static activators = [{
+		eventName: "onTouchStart",
+		handler: ({ nativeEvent: event }, { onActivation }) => {
+			const { touches } = event;
+			if (touches.length > 1) return false;
+			onActivation?.({ event });
+			return true;
+		}
+	}];
+	static setup() {
+		window.addEventListener(events.move.name, noop, {
+			capture: false,
+			passive: false
+		});
+		return function teardown() {
+			window.removeEventListener(events.move.name, noop);
+		};
+		function noop() {}
+	}
+};
+//#endregion
+//#region src/hooks/utilities/useAutoScroller.ts
+let AutoScrollActivator = /* @__PURE__ */ function(AutoScrollActivator) {
+	AutoScrollActivator[AutoScrollActivator["Pointer"] = 0] = "Pointer";
+	AutoScrollActivator[AutoScrollActivator["DraggableRect"] = 1] = "DraggableRect";
+	return AutoScrollActivator;
+}({});
+let TraversalOrder = /* @__PURE__ */ function(TraversalOrder) {
+	TraversalOrder[TraversalOrder["TreeOrder"] = 0] = "TreeOrder";
+	TraversalOrder[TraversalOrder["ReversedTreeOrder"] = 1] = "ReversedTreeOrder";
+	return TraversalOrder;
+}({});
+function useAutoScroller({ acceleration, activator = 0, canScroll, draggingRect, enabled, interval = 5, order = 0, pointerCoordinates, scrollableAncestors, scrollableAncestorRects, delta, threshold }) {
+	const scrollIntent = useScrollIntent({
+		delta,
+		disabled: !enabled
+	});
+	const [setAutoScrollInterval, clearAutoScrollInterval] = useInterval();
+	const scrollSpeed = useRef({
+		x: 0,
+		y: 0
+	});
+	const scrollDirection = useRef({
+		x: 0,
+		y: 0
+	});
+	const rect = useMemo(() => {
+		switch (activator) {
+			case 0: return pointerCoordinates ? {
+				top: pointerCoordinates.y,
+				bottom: pointerCoordinates.y,
+				left: pointerCoordinates.x,
+				right: pointerCoordinates.x
+			} : null;
+			case 1: return draggingRect;
+		}
+	}, [
+		activator,
+		draggingRect,
+		pointerCoordinates
+	]);
+	const scrollContainerRef = useRef(null);
+	const autoScroll = useCallback(() => {
+		const scrollContainer = scrollContainerRef.current;
+		if (!scrollContainer) return;
+		const scrollLeft = scrollSpeed.current.x * scrollDirection.current.x;
+		const scrollTop = scrollSpeed.current.y * scrollDirection.current.y;
+		scrollContainer.scrollBy(Math.round(scrollLeft), Math.round(scrollTop));
+	}, []);
+	const sortedScrollableAncestors = useMemo(() => order === 0 ? [...scrollableAncestors].reverse() : scrollableAncestors, [order, scrollableAncestors]);
+	useEffect(() => {
+		if (!enabled || !scrollableAncestors.length || !rect) {
+			clearAutoScrollInterval();
+			return;
+		}
+		for (const scrollContainer of sortedScrollableAncestors) {
+			if (canScroll?.(scrollContainer) === false) continue;
+			const scrollContainerRect = scrollableAncestorRects.find(({ element }) => element === scrollContainer)?.rect;
+			if (!scrollContainerRect) continue;
+			const { direction, speed } = getScrollDirectionAndSpeed(scrollContainer, scrollContainerRect, rect, acceleration, threshold);
+			for (const axis of ["x", "y"]) if (!scrollIntent[axis][direction[axis]]) {
+				speed[axis] = 0;
+				direction[axis] = 0;
+			}
+			if (speed.x > 0 || speed.y > 0) {
+				clearAutoScrollInterval();
+				scrollContainerRef.current = scrollContainer;
+				setAutoScrollInterval(autoScroll, interval);
+				scrollSpeed.current = speed;
+				scrollDirection.current = direction;
+				return;
+			}
+		}
+		scrollSpeed.current = {
+			x: 0,
+			y: 0
+		};
+		scrollDirection.current = {
+			x: 0,
+			y: 0
+		};
+		clearAutoScrollInterval();
+	}, [
+		acceleration,
+		autoScroll,
+		canScroll,
+		clearAutoScrollInterval,
+		enabled,
+		interval,
+		JSON.stringify(rect),
+		JSON.stringify(scrollIntent),
+		setAutoScrollInterval,
+		scrollableAncestors,
+		sortedScrollableAncestors,
+		scrollableAncestorRects,
+		JSON.stringify(threshold)
+	]);
+}
+const defaultScrollIntent = {
+	x: {
+		[-1]: false,
+		[1]: false
+	},
+	y: {
+		[-1]: false,
+		[1]: false
+	}
+};
+function useScrollIntent({ delta, disabled }) {
+	const previousDelta = usePrevious(delta);
+	return useLazyMemo((previousIntent) => {
+		if (disabled || !previousDelta || !previousIntent) return defaultScrollIntent;
+		const direction = {
+			x: Math.sign(delta.x - previousDelta.x),
+			y: Math.sign(delta.y - previousDelta.y)
+		};
+		return {
+			x: {
+				[-1]: previousIntent.x[-1] || direction.x === -1,
+				[1]: previousIntent.x[1] || direction.x === 1
+			},
+			y: {
+				[-1]: previousIntent.y[-1] || direction.y === -1,
+				[1]: previousIntent.y[1] || direction.y === 1
+			}
+		};
+	}, [
+		disabled,
+		delta,
+		previousDelta
+	]);
+}
+//#endregion
+//#region src/hooks/utilities/useCachedNode.ts
+function useCachedNode(draggableNodes, id) {
+	const draggableNode = id !== null ? draggableNodes.get(id) : void 0;
+	const node = draggableNode ? draggableNode.node.current : null;
+	return useLazyMemo((cachedNode) => {
+		if (id === null) return null;
+		return node ?? cachedNode ?? null;
+	}, [node, id]);
+}
+//#endregion
+//#region src/hooks/utilities/useCombineActivators.ts
+function useCombineActivators(sensors, getSyntheticHandler) {
+	return useMemo(() => sensors.reduce((accumulator, sensor) => {
+		const { sensor: Sensor } = sensor;
+		const sensorActivators = Sensor.activators.map((activator) => ({
+			eventName: activator.eventName,
+			handler: getSyntheticHandler(activator.handler, sensor)
+		}));
+		return [...accumulator, ...sensorActivators];
+	}, []), [sensors, getSyntheticHandler]);
+}
+//#endregion
+//#region src/hooks/utilities/useDroppableMeasuring.ts
+let MeasuringStrategy = /* @__PURE__ */ function(MeasuringStrategy) {
+	MeasuringStrategy[MeasuringStrategy["Always"] = 0] = "Always";
+	MeasuringStrategy[MeasuringStrategy["BeforeDragging"] = 1] = "BeforeDragging";
+	MeasuringStrategy[MeasuringStrategy["WhileDragging"] = 2] = "WhileDragging";
+	return MeasuringStrategy;
+}({});
+let MeasuringFrequency = /* @__PURE__ */ function(MeasuringFrequency) {
+	MeasuringFrequency["Optimized"] = "optimized";
+	return MeasuringFrequency;
+}({});
+const defaultValue$2 = /* @__PURE__ */ new Map();
+function useDroppableMeasuring(containers, { dragging, dependencies, config }) {
+	const [queue, setQueue] = useState(null);
+	const { frequency, measure, strategy } = config;
+	const containersRef = useRef(containers);
+	const disabled = isDisabled();
+	const disabledRef = useLatestValue(disabled);
+	const measureDroppableContainers = useCallback((ids = []) => {
+		if (disabledRef.current) return;
+		setQueue((value) => {
+			if (value === null) return ids;
+			return value.concat(ids.filter((id) => !value.includes(id)));
+		});
+	}, [disabledRef]);
+	const timeoutId = useRef(null);
+	const droppableRects = useLazyMemo((previousValue) => {
+		if (disabled && !dragging) return defaultValue$2;
+		if (!previousValue || previousValue === defaultValue$2 || containersRef.current !== containers || queue != null) {
+			const map = /* @__PURE__ */ new Map();
+			for (let container of containers) {
+				if (!container) continue;
+				if (queue && queue.length > 0 && !queue.includes(container.id) && container.rect.current) {
+					map.set(container.id, container.rect.current);
+					continue;
+				}
+				const node = container.node.current;
+				const rect = node ? new Rect(measure(node), node) : null;
+				container.rect.current = rect;
+				if (rect) map.set(container.id, rect);
+			}
+			return map;
+		}
+		return previousValue;
+	}, [
+		containers,
+		queue,
+		dragging,
+		disabled,
+		measure
+	]);
+	useEffect(() => {
+		containersRef.current = containers;
+	}, [containers]);
+	useEffect(() => {
+		if (disabled) return;
+		measureDroppableContainers();
+	}, [dragging, disabled]);
+	useEffect(() => {
+		if (queue && queue.length > 0) setQueue(null);
+	}, [JSON.stringify(queue)]);
+	useEffect(() => {
+		if (disabled || typeof frequency !== "number" || timeoutId.current !== null) return;
+		timeoutId.current = setTimeout(() => {
+			measureDroppableContainers();
+			timeoutId.current = null;
+		}, frequency);
+	}, [
+		frequency,
+		disabled,
+		measureDroppableContainers,
+		...dependencies
+	]);
+	return {
+		droppableRects,
+		measureDroppableContainers,
+		measuringScheduled: queue != null
+	};
+	function isDisabled() {
+		switch (strategy) {
+			case 0: return false;
+			case 1: return dragging;
+			default: return !dragging;
+		}
+	}
+}
+//#endregion
+//#region src/hooks/utilities/useInitialValue.ts
+function useInitialValue(value, computeFn) {
+	return useLazyMemo((previousValue) => {
+		if (!value) return null;
+		if (previousValue) return previousValue;
+		return typeof computeFn === "function" ? computeFn(value) : value;
+	}, [computeFn, value]);
+}
+//#endregion
+//#region src/hooks/utilities/useInitialRect.ts
+function useInitialRect(node, measure) {
+	return useInitialValue(node, measure);
+}
+//#endregion
+//#region src/hooks/utilities/useMutationObserver.ts
+/**
+* Returns a new MutationObserver instance.
+* If `MutationObserver` is undefined in the execution environment, returns `undefined`.
+*/
+function useMutationObserver({ callback, disabled }) {
+	const handleMutations = useEvent(callback);
+	const mutationObserver = useMemo(() => {
+		if (disabled || typeof window === "undefined" || typeof window.MutationObserver === "undefined") return;
+		const { MutationObserver } = window;
+		return new MutationObserver(handleMutations);
+	}, [handleMutations, disabled]);
+	useEffect(() => {
+		return () => mutationObserver?.disconnect();
+	}, [mutationObserver]);
+	return mutationObserver;
+}
+//#endregion
+//#region src/hooks/utilities/useResizeObserver.ts
+/**
+* Returns a new ResizeObserver instance bound to the `onResize` callback.
+* If `ResizeObserver` is undefined in the execution environment, returns `undefined`.
+*/
+function useResizeObserver({ callback, disabled }) {
+	const handleResize = useEvent(callback);
+	const resizeObserver = useMemo(() => {
+		if (disabled || typeof window === "undefined" || typeof window.ResizeObserver === "undefined") return;
+		const { ResizeObserver } = window;
+		return new ResizeObserver(handleResize);
+	}, [disabled]);
+	useEffect(() => {
+		return () => resizeObserver?.disconnect();
+	}, [resizeObserver]);
+	return resizeObserver;
+}
+//#endregion
+//#region src/hooks/utilities/useRect.ts
+function defaultMeasure(element) {
+	return new Rect(getClientRect(element), element);
+}
+function useRect(element, measure = defaultMeasure, fallbackRect) {
+	const [rect, measureRect] = useReducer(reducer, null);
+	const mutationObserver = useMutationObserver({ callback(records) {
+		if (!element) return;
+		for (const record of records) {
+			const { type, target } = record;
+			if (type === "childList" && target instanceof HTMLElement && target.contains(element)) {
+				measureRect();
+				break;
+			}
+		}
+	} });
+	const resizeObserver = useResizeObserver({ callback: measureRect });
+	useIsomorphicLayoutEffect(() => {
+		measureRect();
+		if (element) {
+			resizeObserver?.observe(element);
+			mutationObserver?.observe(document.body, {
+				childList: true,
+				subtree: true
+			});
+		} else {
+			resizeObserver?.disconnect();
+			mutationObserver?.disconnect();
+		}
+	}, [element]);
+	return rect;
+	function reducer(currentRect) {
+		if (!element) return null;
+		if (element.isConnected === false) return currentRect ?? fallbackRect ?? null;
+		const newRect = measure(element);
+		if (JSON.stringify(currentRect) === JSON.stringify(newRect)) return currentRect;
+		return newRect;
+	}
+}
+//#endregion
+//#region src/hooks/utilities/useRectDelta.ts
+function useRectDelta(rect) {
+	return getRectDelta(rect, useInitialValue(rect));
+}
+//#endregion
+//#region src/hooks/utilities/useScrollableAncestors.ts
+const defaultValue$1 = [];
+function useScrollableAncestors(node) {
+	const previousNode = useRef(node);
+	const ancestors = useLazyMemo((previousValue) => {
+		if (!node) return defaultValue$1;
+		if (previousValue && previousValue !== defaultValue$1 && node && previousNode.current && node.parentNode === previousNode.current.parentNode) return previousValue;
+		return getScrollableAncestors(node);
+	}, [node]);
+	useEffect(() => {
+		previousNode.current = node;
+	}, [node]);
+	return ancestors;
+}
+//#endregion
+//#region src/hooks/utilities/useScrollOffsets.ts
+function useScrollOffsets(elements) {
+	const [scrollCoordinates, setScrollCoordinates] = useState(null);
+	const prevElements = useRef(elements);
+	const handleScroll = useCallback((event) => {
+		const scrollingElement = getScrollableElement(event.target);
+		if (!scrollingElement) return;
+		setScrollCoordinates((scrollCoordinates) => {
+			if (!scrollCoordinates) return null;
+			scrollCoordinates.set(scrollingElement, getScrollCoordinates(scrollingElement));
+			return new Map(scrollCoordinates);
+		});
+	}, []);
+	useEffect(() => {
+		const previousElements = prevElements.current;
+		if (elements !== previousElements) {
+			cleanup(previousElements);
+			const entries = elements.map((element) => {
+				const scrollableElement = getScrollableElement(element);
+				if (scrollableElement) {
+					scrollableElement.addEventListener("scroll", handleScroll, { passive: true });
+					return [scrollableElement, getScrollCoordinates(scrollableElement)];
+				}
+				return null;
+			}).filter((entry) => entry != null);
+			setScrollCoordinates(entries.length ? new Map(entries) : null);
+			prevElements.current = elements;
+		}
+		return () => {
+			cleanup(elements);
+			cleanup(previousElements);
+		};
+		function cleanup(elements) {
+			elements.forEach((element) => {
+				getScrollableElement(element)?.removeEventListener("scroll", handleScroll);
+			});
+		}
+	}, [handleScroll, elements]);
+	return useMemo(() => {
+		if (elements.length) return scrollCoordinates ? Array.from(scrollCoordinates.values()).reduce((acc, coordinates) => add(acc, coordinates), defaultCoordinates) : getScrollOffsets(elements);
+		return defaultCoordinates;
+	}, [elements, scrollCoordinates]);
+}
+//#endregion
+//#region src/hooks/utilities/useScrollOffsetsDelta.ts
+function useScrollOffsetsDelta(scrollOffsets, dependencies = []) {
+	const initialScrollOffsets = useRef(null);
+	useEffect(() => {
+		initialScrollOffsets.current = null;
+	}, dependencies);
+	useEffect(() => {
+		const hasScrollOffsets = scrollOffsets !== defaultCoordinates;
+		if (hasScrollOffsets && !initialScrollOffsets.current) initialScrollOffsets.current = scrollOffsets;
+		if (!hasScrollOffsets && initialScrollOffsets.current) initialScrollOffsets.current = null;
+	}, [scrollOffsets]);
+	return initialScrollOffsets.current ? subtract(scrollOffsets, initialScrollOffsets.current) : defaultCoordinates;
+}
+//#endregion
+//#region src/hooks/utilities/useSensorSetup.ts
+function useSensorSetup(sensors) {
+	useEffect(() => {
+		if (!canUseDOM) return;
+		const teardownFns = sensors.map(({ sensor }) => sensor.setup?.());
+		return () => {
+			for (const teardown of teardownFns) teardown?.();
+		};
+	}, sensors.map(({ sensor }) => sensor));
+}
+//#endregion
+//#region src/hooks/utilities/useSyntheticListeners.ts
+function useSyntheticListeners(listeners, id) {
+	return useMemo(() => {
+		return listeners.reduce((acc, { eventName, handler }) => {
+			acc[eventName] = (event) => {
+				handler(event, id);
+			};
+			return acc;
+		}, {});
+	}, [listeners, id]);
+}
+//#endregion
+//#region src/hooks/utilities/useWindowRect.ts
+function useWindowRect(element) {
+	return useMemo(() => element ? getWindowClientRect(element) : null, [element]);
+}
+//#endregion
+//#region src/hooks/utilities/useRects.ts
+const defaultValue = [];
+function useRects(elements, measure = getClientRect) {
+	const [firstElement] = elements;
+	const windowRect = useWindowRect(firstElement ? getWindow(firstElement) : null);
+	const [rects, measureRects] = useReducer(reducer, defaultValue);
+	const resizeObserver = useResizeObserver({ callback: measureRects });
+	if (elements.length > 0 && rects === defaultValue) measureRects();
+	useIsomorphicLayoutEffect(() => {
+		if (elements.length) elements.forEach((element) => resizeObserver?.observe(element));
+		else {
+			resizeObserver?.disconnect();
+			measureRects();
+		}
+	}, [elements]);
+	return rects;
+	function reducer() {
+		if (!elements.length) return defaultValue;
+		return elements.map((element) => isDocumentScrollingElement(element) ? {
+			rect: windowRect,
+			element
+		} : {
+			rect: new Rect(measure(element), element),
+			element
+		});
+	}
+}
+//#endregion
+//#region src/utilities/nodes/getMeasurableNode.ts
+function getMeasurableNode(node) {
+	if (!node) return null;
+	if (node.children.length > 1) return node;
+	const firstChild = node.children[0];
+	return isHTMLElement(firstChild) ? firstChild : node;
+}
+//#endregion
+//#region src/hooks/utilities/useDragOverlayMeasuring.ts
+function useDragOverlayMeasuring({ measure }) {
+	const [rect, setRect] = useState(null);
+	const resizeObserver = useResizeObserver({ callback: useCallback((entries) => {
+		for (const { target } of entries) if (isHTMLElement(target)) {
+			setRect((rect) => {
+				const newRect = measure(target);
+				return rect ? {
+					...rect,
+					width: newRect.width,
+					height: newRect.height
+				} : newRect;
+			});
+			break;
+		}
+	}, [measure]) });
+	const handleNodeChange = useCallback((element) => {
+		const node = getMeasurableNode(element);
+		resizeObserver?.disconnect();
+		if (node) resizeObserver?.observe(node);
+		setRect(node ? measure(node) : null);
+	}, [measure, resizeObserver]);
+	const [nodeRef, setRef] = useNodeRef(handleNodeChange);
+	return useMemo(() => ({
+		nodeRef,
+		rect,
+		setRef
+	}), [
+		rect,
+		nodeRef,
+		setRef
+	]);
+}
+//#endregion
+//#region src/components/DndContext/defaults.ts
+const defaultSensors = [{
+	sensor: PointerSensor,
+	options: {}
+}, {
+	sensor: KeyboardSensor,
+	options: {}
+}];
+const defaultData = { current: {} };
+const defaultMeasuringConfiguration = {
+	draggable: { measure: getTransformAgnosticClientRect },
+	droppable: {
+		measure: getTransformAgnosticClientRect,
+		strategy: 2,
+		frequency: "optimized"
+	},
+	dragOverlay: { measure: getClientRect }
+};
+//#endregion
+//#region src/store/constructors.ts
+var DroppableContainersMap = class extends Map {
+	get(id) {
+		return id != null ? super.get(id) ?? void 0 : void 0;
+	}
+	toArray() {
+		return Array.from(this.values());
+	}
+	getEnabled() {
+		return this.toArray().filter(({ disabled }) => !disabled);
+	}
+	getNodeFor(id) {
+		return this.get(id)?.node.current ?? void 0;
+	}
+};
+//#endregion
+//#region src/store/context.ts
+const defaultPublicContext = {
+	activatorEvent: null,
+	active: null,
+	activeNode: null,
+	activeNodeRect: null,
+	collisions: null,
+	containerNodeRect: null,
+	draggableNodes: /* @__PURE__ */ new Map(),
+	droppableRects: /* @__PURE__ */ new Map(),
+	droppableContainers: new DroppableContainersMap(),
+	over: null,
+	dragOverlay: {
+		nodeRef: { current: null },
+		rect: null,
+		setRef: noop
+	},
+	scrollableAncestors: [],
+	scrollableAncestorRects: [],
+	measuringConfiguration: defaultMeasuringConfiguration,
+	measureDroppableContainers: noop,
+	windowRect: null,
+	measuringScheduled: false
+};
+const defaultInternalContext = {
+	activatorEvent: null,
+	activators: [],
+	active: null,
+	activeNodeRect: null,
+	ariaDescribedById: { draggable: "" },
+	dispatch: noop,
+	draggableNodes: /* @__PURE__ */ new Map(),
+	over: null,
+	measureDroppableContainers: noop
+};
+const InternalContext = createContext(defaultInternalContext);
+const PublicContext = createContext(defaultPublicContext);
+//#endregion
+//#region src/store/reducer.ts
+function getInitialState() {
+	return {
+		draggable: {
+			active: null,
+			initialCoordinates: {
+				x: 0,
+				y: 0
+			},
+			nodes: /* @__PURE__ */ new Map(),
+			translate: {
+				x: 0,
+				y: 0
+			}
+		},
+		droppable: { containers: new DroppableContainersMap() }
+	};
+}
+function reducer(state, action) {
+	switch (action.type) {
+		case "dragStart": return {
+			...state,
+			draggable: {
+				...state.draggable,
+				initialCoordinates: action.initialCoordinates,
+				active: action.active
+			}
+		};
+		case "dragMove":
+			if (!state.draggable.active) return state;
+			return {
+				...state,
+				draggable: {
+					...state.draggable,
+					translate: {
+						x: action.coordinates.x - state.draggable.initialCoordinates.x,
+						y: action.coordinates.y - state.draggable.initialCoordinates.y
+					}
+				}
+			};
+		case "dragEnd":
+		case "dragCancel": return {
+			...state,
+			draggable: {
+				...state.draggable,
+				active: null,
+				initialCoordinates: {
+					x: 0,
+					y: 0
+				},
+				translate: {
+					x: 0,
+					y: 0
+				}
+			}
+		};
+		case "registerDroppable": {
+			const { element } = action;
+			const { id } = element;
+			const containers = new DroppableContainersMap(state.droppable.containers);
+			containers.set(id, element);
+			return {
+				...state,
+				droppable: {
+					...state.droppable,
+					containers
+				}
+			};
+		}
+		case "setDroppableDisabled": {
+			const { id, key, disabled } = action;
+			const element = state.droppable.containers.get(id);
+			if (!element || key !== element.key) return state;
+			const containers = new DroppableContainersMap(state.droppable.containers);
+			containers.set(id, {
+				...element,
+				disabled
+			});
+			return {
+				...state,
+				droppable: {
+					...state.droppable,
+					containers
+				}
+			};
+		}
+		case "unregisterDroppable": {
+			const { id, key } = action;
+			const element = state.droppable.containers.get(id);
+			if (!element || key !== element.key) return state;
+			const containers = new DroppableContainersMap(state.droppable.containers);
+			containers.delete(id);
+			return {
+				...state,
+				droppable: {
+					...state.droppable,
+					containers
+				}
+			};
+		}
+		default: return state;
+	}
+}
+//#endregion
+//#region src/components/Accessibility/components/RestoreFocus.tsx
+function RestoreFocus({ disabled }) {
+	const { active, activatorEvent, draggableNodes } = useContext(InternalContext);
+	const previousActivatorEvent = usePrevious(activatorEvent);
+	const previousActiveId = usePrevious(active?.id);
+	useEffect(() => {
+		if (disabled) return;
+		if (!activatorEvent && previousActivatorEvent && previousActiveId != null) {
+			if (!isKeyboardEvent(previousActivatorEvent)) return;
+			if (document.activeElement === previousActivatorEvent.target) return;
+			const draggableNode = draggableNodes.get(previousActiveId);
+			if (!draggableNode) return;
+			const { activatorNode, node } = draggableNode;
+			if (!activatorNode.current && !node.current) return;
+			requestAnimationFrame(() => {
+				for (const element of [activatorNode.current, node.current]) {
+					if (!element) continue;
+					const focusableNode = findFirstFocusableNode(element);
+					if (focusableNode) {
+						focusableNode.focus();
+						break;
+					}
+				}
+			});
+		}
+	}, [
+		activatorEvent,
+		disabled,
+		draggableNodes,
+		previousActiveId,
+		previousActivatorEvent
+	]);
+	return null;
+}
+//#endregion
+//#region src/modifiers/applyModifiers.ts
+function applyModifiers(modifiers, { transform, ...args }) {
+	return modifiers?.length ? modifiers.reduce((accumulator, modifier) => {
+		return modifier({
+			transform: accumulator,
+			...args
+		});
+	}, transform) : transform;
+}
+//#endregion
+//#region src/components/DndContext/hooks/useMeasuringConfiguration.ts
+function useMeasuringConfiguration(config) {
+	return useMemo(() => ({
+		draggable: {
+			...defaultMeasuringConfiguration.draggable,
+			...config?.draggable
+		},
+		droppable: {
+			...defaultMeasuringConfiguration.droppable,
+			...config?.droppable
+		},
+		dragOverlay: {
+			...defaultMeasuringConfiguration.dragOverlay,
+			...config?.dragOverlay
+		}
+	}), [
+		config?.draggable,
+		config?.droppable,
+		config?.dragOverlay
+	]);
+}
+//#endregion
+//#region src/components/DndContext/hooks/useLayoutShiftScrollCompensation.ts
+function useLayoutShiftScrollCompensation({ activeNode, measure, initialRect, config = true }) {
+	const initialized = useRef(false);
+	const { x, y } = typeof config === "boolean" ? {
+		x: config,
+		y: config
+	} : config;
+	useIsomorphicLayoutEffect(() => {
+		if (!x && !y || !activeNode) {
+			initialized.current = false;
+			return;
+		}
+		if (initialized.current || !initialRect) return;
+		const node = activeNode?.node.current;
+		if (!node || node.isConnected === false) return;
+		const rectDelta = getRectDelta(measure(node), initialRect);
+		if (!x) rectDelta.x = 0;
+		if (!y) rectDelta.y = 0;
+		initialized.current = true;
+		if (Math.abs(rectDelta.x) > 0 || Math.abs(rectDelta.y) > 0) {
+			const firstScrollableAncestor = getFirstScrollableAncestor(node);
+			if (firstScrollableAncestor) firstScrollableAncestor.scrollBy({
+				top: rectDelta.y,
+				left: rectDelta.x
+			});
+		}
+	}, [
+		activeNode,
+		x,
+		y,
+		initialRect,
+		measure
+	]);
+}
+//#endregion
+//#region src/components/DndContext/DndContext.tsx
+const ActiveDraggableContext = createContext({
+	...defaultCoordinates,
+	scaleX: 1,
+	scaleY: 1
+});
+const DndContext = memo(function DndContext({ id, accessibility, autoScroll = true, children, sensors = defaultSensors, collisionDetection = rectIntersection, measuring, modifiers, ...props }) {
+	const [state, dispatch] = useReducer(reducer, void 0, getInitialState);
+	const [dispatchMonitorEvent, registerMonitorListener] = useDndMonitorProvider();
+	const [status, setStatus] = useState(0);
+	const isInitialized = status === 2;
+	const { draggable: { active: activeId, nodes: draggableNodes, translate }, droppable: { containers: droppableContainers } } = state;
+	const node = activeId ? draggableNodes.get(activeId) : null;
+	const activeRects = useRef({
+		initial: null,
+		translated: null
+	});
+	const active = useMemo(() => activeId != null ? {
+		id: activeId,
+		data: node?.data ?? defaultData,
+		rect: activeRects
+	} : null, [activeId, node]);
+	const activeRef = useRef(null);
+	const [activeSensor, setActiveSensor] = useState(null);
+	const [activatorEvent, setActivatorEvent] = useState(null);
+	const latestProps = useLatestValue(props, Object.values(props));
+	const draggableDescribedById = useUniqueId(`DndDescribedBy`, id);
+	const enabledDroppableContainers = useMemo(() => droppableContainers.getEnabled(), [droppableContainers]);
+	const measuringConfiguration = useMeasuringConfiguration(measuring);
+	const { droppableRects, measureDroppableContainers, measuringScheduled } = useDroppableMeasuring(enabledDroppableContainers, {
+		dragging: isInitialized,
+		dependencies: [translate.x, translate.y],
+		config: measuringConfiguration.droppable
+	});
+	const activeNode = useCachedNode(draggableNodes, activeId);
+	const activationCoordinates = useMemo(() => activatorEvent ? getEventCoordinates(activatorEvent) : null, [activatorEvent]);
+	const autoScrollOptions = getAutoScrollerOptions();
+	const initialActiveNodeRect = useInitialRect(activeNode, measuringConfiguration.draggable.measure);
+	useLayoutShiftScrollCompensation({
+		activeNode: activeId ? draggableNodes.get(activeId) : null,
+		config: autoScrollOptions.layoutShiftCompensation,
+		initialRect: initialActiveNodeRect,
+		measure: measuringConfiguration.draggable.measure
+	});
+	const activeNodeRect = useRect(activeNode, measuringConfiguration.draggable.measure, initialActiveNodeRect);
+	const containerNodeRect = useRect(activeNode ? activeNode.parentElement : null);
+	const sensorContext = useRef({
+		activatorEvent: null,
+		active: null,
+		activeNode,
+		collisionRect: null,
+		collisions: null,
+		droppableRects,
+		draggableNodes,
+		draggingNode: null,
+		draggingNodeRect: null,
+		droppableContainers,
+		over: null,
+		scrollableAncestors: [],
+		scrollAdjustedTranslate: null
+	});
+	const overNode = droppableContainers.getNodeFor(sensorContext.current.over?.id);
+	const dragOverlay = useDragOverlayMeasuring({ measure: measuringConfiguration.dragOverlay.measure });
+	const draggingNode = dragOverlay.nodeRef.current ?? activeNode;
+	const draggingNodeRect = isInitialized ? dragOverlay.rect ?? activeNodeRect : null;
+	const usesDragOverlay = Boolean(dragOverlay.nodeRef.current && dragOverlay.rect);
+	const nodeRectDelta = useRectDelta(usesDragOverlay ? null : activeNodeRect);
+	const windowRect = useWindowRect(draggingNode ? getWindow(draggingNode) : null);
+	const scrollableAncestors = useScrollableAncestors(isInitialized ? overNode ?? activeNode : null);
+	const scrollableAncestorRects = useRects(scrollableAncestors);
+	const scrollableAncestorRectsRects = useMemo(() => scrollableAncestorRects.map(({ rect }) => rect), [scrollableAncestorRects]);
+	const modifiedTranslate = applyModifiers(modifiers, {
+		transform: {
+			x: translate.x - nodeRectDelta.x,
+			y: translate.y - nodeRectDelta.y,
+			scaleX: 1,
+			scaleY: 1
+		},
+		activatorEvent,
+		active,
+		activeNodeRect,
+		containerNodeRect,
+		draggingNodeRect,
+		over: sensorContext.current.over,
+		overlayNodeRect: dragOverlay.rect,
+		scrollableAncestors,
+		scrollableAncestorRects: scrollableAncestorRectsRects,
+		windowRect
+	});
+	const pointerCoordinates = activationCoordinates ? add(activationCoordinates, translate) : null;
+	const scrollOffsets = useScrollOffsets(scrollableAncestors);
+	const scrollAdjustment = useScrollOffsetsDelta(scrollOffsets);
+	const activeNodeScrollDelta = useScrollOffsetsDelta(scrollOffsets, [activeNodeRect]);
+	const scrollAdjustedTranslate = add(modifiedTranslate, scrollAdjustment);
+	const collisionRect = draggingNodeRect ? getAdjustedRect(draggingNodeRect, modifiedTranslate) : null;
+	const collisions = active && collisionRect ? collisionDetection({
+		active,
+		collisionRect,
+		droppableRects,
+		droppableContainers: enabledDroppableContainers,
+		pointerCoordinates
+	}) : null;
+	const overId = getFirstCollision(collisions, "id");
+	const [over, setOver] = useState(null);
+	const transform = adjustScale(usesDragOverlay ? modifiedTranslate : add(modifiedTranslate, activeNodeScrollDelta), over?.rect ?? null, activeNodeRect);
+	const instantiateSensor = useCallback((event, { sensor: Sensor, options }) => {
+		if (activeRef.current == null) return;
+		const activeNode = draggableNodes.get(activeRef.current);
+		if (!activeNode) return;
+		const activatorEvent = event.nativeEvent;
+		const sensorInstance = new Sensor({
+			active: activeRef.current,
+			activeNode,
+			event: activatorEvent,
+			options,
+			context: sensorContext,
+			onStart(initialCoordinates) {
+				const id = activeRef.current;
+				if (id == null) return;
+				const draggableNode = draggableNodes.get(id);
+				if (!draggableNode) return;
+				const { onDragStart } = latestProps.current;
+				const event = { active: {
+					id,
+					data: draggableNode.data,
+					rect: activeRects
+				} };
+				onDragStart?.(event);
+				setStatus(1);
+				dispatch({
+					type: "dragStart",
+					initialCoordinates,
+					active: id
+				});
+				dispatchMonitorEvent({
+					type: "onDragStart",
+					event
+				});
+			},
+			onMove(coordinates) {
+				dispatch({
+					type: "dragMove",
+					coordinates
+				});
+			},
+			onEnd: createHandler("dragEnd"),
+			onCancel: createHandler("dragCancel")
+		});
+		setActiveSensor(sensorInstance);
+		setActivatorEvent(event.nativeEvent);
+		function createHandler(type) {
+			return async function handler() {
+				const { active, collisions, over, scrollAdjustedTranslate } = sensorContext.current;
+				let event = null;
+				if (active && scrollAdjustedTranslate) {
+					const { cancelDrop } = latestProps.current;
+					event = {
+						activatorEvent,
+						active,
+						collisions,
+						delta: scrollAdjustedTranslate,
+						over
+					};
+					if (type === "dragEnd" && typeof cancelDrop === "function") {
+						if (await Promise.resolve(cancelDrop(event))) type = "dragCancel";
+					}
+				}
+				activeRef.current = null;
+				dispatch({ type });
+				setStatus(0);
+				setOver(null);
+				setActiveSensor(null);
+				setActivatorEvent(null);
+				const eventName = type === "dragEnd" ? "onDragEnd" : "onDragCancel";
+				if (event) {
+					const handler = latestProps.current[eventName];
+					handler?.(event);
+					dispatchMonitorEvent({
+						type: eventName,
+						event
+					});
+				}
+			};
+		}
+	}, [draggableNodes]);
+	const activators = useCombineActivators(sensors, useCallback((handler, sensor) => {
+		return (event, active) => {
+			const nativeEvent = event.nativeEvent;
+			const activeDraggableNode = draggableNodes.get(active);
+			if (activeRef.current !== null || !activeDraggableNode || nativeEvent.dndKit || nativeEvent.defaultPrevented) return;
+			const activationContext = { active: activeDraggableNode };
+			if (handler(event, sensor.options, activationContext) === true) {
+				nativeEvent.dndKit = { capturedBy: sensor.sensor };
+				activeRef.current = active;
+				instantiateSensor(event, sensor);
+			}
+		};
+	}, [draggableNodes, instantiateSensor]));
+	useSensorSetup(sensors);
+	useIsomorphicLayoutEffect(() => {
+		if (activeNodeRect && status === 1) setStatus(2);
+	}, [activeNodeRect, status]);
+	useEffect(() => {
+		const { onDragMove } = latestProps.current;
+		const { active, activatorEvent, collisions, over } = sensorContext.current;
+		if (!active || !activatorEvent) return;
+		const event = {
+			active,
+			activatorEvent,
+			collisions,
+			delta: {
+				x: scrollAdjustedTranslate.x,
+				y: scrollAdjustedTranslate.y
+			},
+			over
+		};
+		onDragMove?.(event);
+		dispatchMonitorEvent({
+			type: "onDragMove",
+			event
+		});
+	}, [scrollAdjustedTranslate.x, scrollAdjustedTranslate.y]);
+	useEffect(() => {
+		const { active, activatorEvent, collisions, droppableContainers, scrollAdjustedTranslate } = sensorContext.current;
+		if (!active || activeRef.current == null || !activatorEvent || !scrollAdjustedTranslate) return;
+		const { onDragOver } = latestProps.current;
+		const overContainer = droppableContainers.get(overId);
+		const over = overContainer && overContainer.rect.current ? {
+			id: overContainer.id,
+			rect: overContainer.rect.current,
+			data: overContainer.data,
+			disabled: overContainer.disabled
+		} : null;
+		const event = {
+			active,
+			activatorEvent,
+			collisions,
+			delta: {
+				x: scrollAdjustedTranslate.x,
+				y: scrollAdjustedTranslate.y
+			},
+			over
+		};
+		setOver(over);
+		onDragOver?.(event);
+		dispatchMonitorEvent({
+			type: "onDragOver",
+			event
+		});
+	}, [overId]);
+	useIsomorphicLayoutEffect(() => {
+		sensorContext.current = {
+			activatorEvent,
+			active,
+			activeNode,
+			collisionRect,
+			collisions,
+			droppableRects,
+			draggableNodes,
+			draggingNode,
+			draggingNodeRect,
+			droppableContainers,
+			over,
+			scrollableAncestors,
+			scrollAdjustedTranslate
+		};
+		activeRects.current = {
+			initial: draggingNodeRect,
+			translated: collisionRect
+		};
+	}, [
+		active,
+		activeNode,
+		collisions,
+		collisionRect,
+		draggableNodes,
+		draggingNode,
+		draggingNodeRect,
+		droppableRects,
+		droppableContainers,
+		over,
+		scrollableAncestors,
+		scrollAdjustedTranslate
+	]);
+	useAutoScroller({
+		...autoScrollOptions,
+		delta: translate,
+		draggingRect: collisionRect,
+		pointerCoordinates,
+		scrollableAncestors,
+		scrollableAncestorRects
+	});
+	const publicContext = useMemo(() => {
+		return {
+			active,
+			activeNode,
+			activeNodeRect,
+			activatorEvent,
+			collisions,
+			containerNodeRect,
+			dragOverlay,
+			draggableNodes,
+			droppableContainers,
+			droppableRects,
+			over,
+			measureDroppableContainers,
+			scrollableAncestors,
+			scrollableAncestorRects: scrollableAncestorRectsRects,
+			measuringConfiguration,
+			measuringScheduled,
+			windowRect
+		};
+	}, [
+		active,
+		activeNode,
+		activeNodeRect,
+		activatorEvent,
+		collisions,
+		containerNodeRect,
+		dragOverlay,
+		draggableNodes,
+		droppableContainers,
+		droppableRects,
+		over,
+		measureDroppableContainers,
+		scrollableAncestors,
+		scrollableAncestorRects,
+		measuringConfiguration,
+		measuringScheduled,
+		windowRect
+	]);
+	const internalContext = useMemo(() => {
+		return {
+			activatorEvent,
+			activators,
+			active,
+			activeNodeRect,
+			ariaDescribedById: { draggable: draggableDescribedById },
+			dispatch,
+			draggableNodes,
+			over,
+			measureDroppableContainers
+		};
+	}, [
+		activatorEvent,
+		activators,
+		active,
+		activeNodeRect,
+		dispatch,
+		draggableDescribedById,
+		draggableNodes,
+		over,
+		measureDroppableContainers
+	]);
+	return /* @__PURE__ */ React.createElement(DndMonitorContext.Provider, { value: registerMonitorListener }, /* @__PURE__ */ React.createElement(InternalContext.Provider, { value: internalContext }, /* @__PURE__ */ React.createElement(PublicContext.Provider, { value: publicContext }, /* @__PURE__ */ React.createElement(ActiveDraggableContext.Provider, { value: transform }, children)), /* @__PURE__ */ React.createElement(RestoreFocus, { disabled: accessibility?.restoreFocus === false })), /* @__PURE__ */ React.createElement(Accessibility, {
+		...accessibility,
+		hiddenTextDescribedById: draggableDescribedById
+	}));
+	function getAutoScrollerOptions() {
+		const activeSensorDisablesAutoscroll = activeSensor?.autoScrollEnabled === false;
+		const autoScrollGloballyDisabled = typeof autoScroll === "object" ? autoScroll.enabled === false : autoScroll === false;
+		const enabled = isInitialized && !activeSensorDisablesAutoscroll && !autoScrollGloballyDisabled;
+		if (typeof autoScroll === "object") return {
+			...autoScroll,
+			enabled
+		};
+		return { enabled };
+	}
+});
+//#endregion
+//#region src/hooks/useDraggable.ts
+const NullContext = createContext(null);
+const defaultRole = "button";
+const ID_PREFIX$1 = "Droppable";
+function useDraggable({ id, data, disabled = false, attributes }) {
+	const key = useUniqueId(ID_PREFIX$1);
+	const { activators, activatorEvent, active, activeNodeRect, ariaDescribedById, draggableNodes, over } = useContext(InternalContext);
+	const { role = defaultRole, roleDescription = "draggable", tabIndex = 0 } = attributes ?? {};
+	const isDragging = active?.id === id;
+	const transform = useContext(isDragging ? ActiveDraggableContext : NullContext);
+	const [node, setNodeRef] = useNodeRef();
+	const [activatorNode, setActivatorNodeRef] = useNodeRef();
+	const listeners = useSyntheticListeners(activators, id);
+	const dataRef = useLatestValue(data);
+	useIsomorphicLayoutEffect(() => {
+		draggableNodes.set(id, {
+			id,
+			key,
+			node,
+			activatorNode,
+			data: dataRef
+		});
+		return () => {
+			const node = draggableNodes.get(id);
+			if (node && node.key === key) draggableNodes.delete(id);
+		};
+	}, [draggableNodes, id]);
+	return {
+		active,
+		activatorEvent,
+		activeNodeRect,
+		attributes: useMemo(() => ({
+			role,
+			tabIndex,
+			"aria-disabled": disabled,
+			"aria-pressed": isDragging && role === defaultRole ? true : void 0,
+			"aria-roledescription": roleDescription,
+			"aria-describedby": ariaDescribedById.draggable
+		}), [
+			disabled,
+			role,
+			tabIndex,
+			isDragging,
+			roleDescription,
+			ariaDescribedById.draggable
+		]),
+		isDragging,
+		listeners: disabled ? void 0 : listeners,
+		node,
+		over,
+		setNodeRef,
+		setActivatorNodeRef,
+		transform
+	};
+}
+//#endregion
+//#region src/hooks/useDndContext.ts
+function useDndContext() {
+	return useContext(PublicContext);
+}
+//#endregion
+//#region src/hooks/useDroppable.ts
+const ID_PREFIX = "Droppable";
+const defaultResizeObserverConfig = { timeout: 25 };
+function useDroppable({ data, disabled = false, id, resizeObserverConfig }) {
+	const key = useUniqueId(ID_PREFIX);
+	const { active, dispatch, over, measureDroppableContainers } = useContext(InternalContext);
+	const previous = useRef({ disabled });
+	const resizeObserverConnected = useRef(false);
+	const rect = useRef(null);
+	const callbackId = useRef(null);
+	const { disabled: resizeObserverDisabled, updateMeasurementsFor, timeout: resizeObserverTimeout } = {
+		...defaultResizeObserverConfig,
+		...resizeObserverConfig
+	};
+	const ids = useLatestValue(updateMeasurementsFor ?? id);
+	const resizeObserver = useResizeObserver({
+		callback: useCallback(() => {
+			if (!resizeObserverConnected.current) {
+				resizeObserverConnected.current = true;
+				return;
+			}
+			if (callbackId.current != null) clearTimeout(callbackId.current);
+			callbackId.current = setTimeout(() => {
+				measureDroppableContainers(Array.isArray(ids.current) ? ids.current : [ids.current]);
+				callbackId.current = null;
+			}, resizeObserverTimeout);
+		}, [resizeObserverTimeout]),
+		disabled: resizeObserverDisabled || !active
+	});
+	const handleNodeChange = useCallback((newElement, previousElement) => {
+		if (!resizeObserver) return;
+		if (previousElement) {
+			resizeObserver.unobserve(previousElement);
+			resizeObserverConnected.current = false;
+		}
+		if (newElement) resizeObserver.observe(newElement);
+	}, [resizeObserver]);
+	const [nodeRef, setNodeRef] = useNodeRef(handleNodeChange);
+	const dataRef = useLatestValue(data);
+	useEffect(() => {
+		if (!resizeObserver || !nodeRef.current) return;
+		resizeObserver.disconnect();
+		resizeObserverConnected.current = false;
+		resizeObserver.observe(nodeRef.current);
+	}, [nodeRef, resizeObserver]);
+	useIsomorphicLayoutEffect(() => {
+		dispatch({
+			type: "registerDroppable",
+			element: {
+				id,
+				key,
+				disabled,
+				node: nodeRef,
+				rect,
+				data: dataRef
+			}
+		});
+		return () => dispatch({
+			type: "unregisterDroppable",
+			key,
+			id
+		});
+	}, [id]);
+	useEffect(() => {
+		if (disabled !== previous.current.disabled) {
+			dispatch({
+				type: "setDroppableDisabled",
+				id,
+				key,
+				disabled
+			});
+			previous.current.disabled = disabled;
+		}
+	}, [
+		id,
+		key,
+		disabled,
+		dispatch
+	]);
+	return {
+		active,
+		rect,
+		isOver: over?.id === id,
+		node: nodeRef,
+		over,
+		setNodeRef
+	};
+}
+//#endregion
+//#region src/components/DragOverlay/components/AnimationManager/AnimationManager.tsx
+function AnimationManager({ animation, children }) {
+	const [clonedChildren, setClonedChildren] = useState(null);
+	const [element, setElement] = useState(null);
+	const previousChildren = usePrevious(children);
+	if (!children && !clonedChildren && previousChildren) setClonedChildren(previousChildren);
+	useIsomorphicLayoutEffect(() => {
+		if (!element) return;
+		const key = clonedChildren?.key;
+		const id = clonedChildren?.props.id;
+		if (key == null || id == null) {
+			setClonedChildren(null);
+			return;
+		}
+		Promise.resolve(animation(id, element)).then(() => {
+			setClonedChildren(null);
+		});
+	}, [
+		animation,
+		clonedChildren,
+		element
+	]);
+	return /* @__PURE__ */ React.createElement(React.Fragment, null, children, clonedChildren ? cloneElement(clonedChildren, { ref: setElement }) : null);
+}
+//#endregion
+//#region src/components/DragOverlay/components/NullifiedContextProvider/NullifiedContextProvider.tsx
+const defaultTransform = {
+	x: 0,
+	y: 0,
+	scaleX: 1,
+	scaleY: 1
+};
+function NullifiedContextProvider({ children }) {
+	return /* @__PURE__ */ React.createElement(InternalContext.Provider, { value: defaultInternalContext }, /* @__PURE__ */ React.createElement(ActiveDraggableContext.Provider, { value: defaultTransform }, children));
+}
+//#endregion
+//#region src/components/DragOverlay/components/PositionedOverlay/PositionedOverlay.tsx
+const baseStyles = {
+	position: "fixed",
+	touchAction: "none"
+};
+const defaultTransition = (activatorEvent) => {
+	return isKeyboardEvent(activatorEvent) ? "transform 250ms ease" : void 0;
+};
+const PositionedOverlay = forwardRef(({ as, activatorEvent, adjustScale, children, className, rect, style, transform, transition = defaultTransition }, ref) => {
+	if (!rect) return null;
+	const scaleAdjustedTransform = adjustScale ? transform : {
+		...transform,
+		scaleX: 1,
+		scaleY: 1
+	};
+	const styles = {
+		...baseStyles,
+		width: rect.width,
+		height: rect.height,
+		top: rect.top,
+		left: rect.left,
+		transform: CSS.Transform.toString(scaleAdjustedTransform),
+		transformOrigin: adjustScale && activatorEvent ? getRelativeTransformOrigin(activatorEvent, rect) : void 0,
+		transition: typeof transition === "function" ? transition(activatorEvent) : transition,
+		...style
+	};
+	return React.createElement(as, {
+		className,
+		style: styles,
+		ref
+	}, children);
+});
+//#endregion
+//#region src/components/DragOverlay/hooks/useDropAnimation.ts
+const defaultDropAnimationSideEffects = (options) => ({ active, dragOverlay }) => {
+	const originalStyles = {};
+	const { styles, className } = options;
+	if (styles?.active) for (const [key, value] of Object.entries(styles.active)) {
+		if (value === void 0) continue;
+		originalStyles[key] = active.node.style.getPropertyValue(key);
+		active.node.style.setProperty(key, value);
+	}
+	if (styles?.dragOverlay) for (const [key, value] of Object.entries(styles.dragOverlay)) {
+		if (value === void 0) continue;
+		dragOverlay.node.style.setProperty(key, value);
+	}
+	if (className?.active) active.node.classList.add(className.active);
+	if (className?.dragOverlay) dragOverlay.node.classList.add(className.dragOverlay);
+	return function cleanup() {
+		for (const [key, value] of Object.entries(originalStyles)) active.node.style.setProperty(key, value);
+		if (className?.active) active.node.classList.remove(className.active);
+	};
+};
+const defaultKeyframeResolver = ({ transform: { initial, final } }) => [{ transform: CSS.Transform.toString(initial) }, { transform: CSS.Transform.toString(final) }];
+const defaultDropAnimationConfiguration = {
+	duration: 250,
+	easing: "ease",
+	keyframes: defaultKeyframeResolver,
+	sideEffects: defaultDropAnimationSideEffects({ styles: { active: { opacity: "0" } } })
+};
+function useDropAnimation({ config, draggableNodes, droppableContainers, measuringConfiguration }) {
+	return useEvent((id, node) => {
+		if (config === null) return;
+		const activeDraggable = draggableNodes.get(id);
+		if (!activeDraggable) return;
+		const activeNode = activeDraggable.node.current;
+		if (!activeNode) return;
+		const measurableNode = getMeasurableNode(node);
+		if (!measurableNode) return;
+		const { transform } = getWindow(node).getComputedStyle(node);
+		const parsedTransform = parseTransform(transform);
+		if (!parsedTransform) return;
+		const animation = typeof config === "function" ? config : createDefaultDropAnimation(config);
+		scrollIntoViewIfNeeded(activeNode, measuringConfiguration.draggable.measure);
+		return animation({
+			active: {
+				id,
+				data: activeDraggable.data,
+				node: activeNode,
+				rect: measuringConfiguration.draggable.measure(activeNode)
+			},
+			draggableNodes,
+			dragOverlay: {
+				node,
+				rect: measuringConfiguration.dragOverlay.measure(measurableNode)
+			},
+			droppableContainers,
+			measuringConfiguration,
+			transform: parsedTransform
+		});
+	});
+}
+function createDefaultDropAnimation(options) {
+	const { duration, easing, sideEffects, keyframes } = {
+		...defaultDropAnimationConfiguration,
+		...options
+	};
+	return ({ active, dragOverlay, transform, ...rest }) => {
+		if (!duration) return;
+		const delta = {
+			x: dragOverlay.rect.left - active.rect.left,
+			y: dragOverlay.rect.top - active.rect.top
+		};
+		const scale = {
+			scaleX: transform.scaleX !== 1 ? active.rect.width * transform.scaleX / dragOverlay.rect.width : 1,
+			scaleY: transform.scaleY !== 1 ? active.rect.height * transform.scaleY / dragOverlay.rect.height : 1
+		};
+		const finalTransform = {
+			x: transform.x - delta.x,
+			y: transform.y - delta.y,
+			...scale
+		};
+		const animationKeyframes = keyframes({
+			...rest,
+			active,
+			dragOverlay,
+			transform: {
+				initial: transform,
+				final: finalTransform
+			}
+		});
+		const [firstKeyframe] = animationKeyframes;
+		const lastKeyframe = animationKeyframes[animationKeyframes.length - 1];
+		if (JSON.stringify(firstKeyframe) === JSON.stringify(lastKeyframe)) return;
+		const cleanup = sideEffects?.({
+			active,
+			dragOverlay,
+			...rest
+		});
+		const animation = dragOverlay.node.animate(animationKeyframes, {
+			duration,
+			easing,
+			fill: "forwards"
+		});
+		return new Promise((resolve) => {
+			animation.onfinish = () => {
+				cleanup?.();
+				resolve();
+			};
+		});
+	};
+}
+//#endregion
+//#region src/components/DragOverlay/hooks/useKey.ts
+let key = 0;
+function useKey(id) {
+	return useMemo(() => {
+		if (id == null) return;
+		key++;
+		return key;
+	}, [id]);
+}
+//#endregion
+//#region src/components/DragOverlay/DragOverlay.tsx
+const DragOverlay = React.memo(({ adjustScale = false, children, dropAnimation: dropAnimationConfig, style, transition, modifiers, wrapperElement = "div", className, zIndex = 999 }) => {
+	const { activatorEvent, active, activeNodeRect, containerNodeRect, draggableNodes, droppableContainers, dragOverlay, over, measuringConfiguration, scrollableAncestors, scrollableAncestorRects, windowRect } = useDndContext();
+	const transform = useContext(ActiveDraggableContext);
+	const key = useKey(active?.id);
+	const modifiedTransform = applyModifiers(modifiers, {
+		activatorEvent,
+		active,
+		activeNodeRect,
+		containerNodeRect,
+		draggingNodeRect: dragOverlay.rect,
+		over,
+		overlayNodeRect: dragOverlay.rect,
+		scrollableAncestors,
+		scrollableAncestorRects,
+		transform,
+		windowRect
+	});
+	const initialRect = useInitialValue(activeNodeRect);
+	const dropAnimation = useDropAnimation({
+		config: dropAnimationConfig,
+		draggableNodes,
+		droppableContainers,
+		measuringConfiguration
+	});
+	const ref = initialRect ? dragOverlay.setRef : void 0;
+	return /* @__PURE__ */ React.createElement(NullifiedContextProvider, null, /* @__PURE__ */ React.createElement(AnimationManager, { animation: dropAnimation }, active && key ? /* @__PURE__ */ React.createElement(PositionedOverlay, {
+		key,
+		id: active.id,
+		ref,
+		as: wrapperElement,
+		activatorEvent,
+		adjustScale,
+		className,
+		transition,
+		rect: initialRect,
+		style: {
+			zIndex,
+			...style
+		},
+		transform: modifiedTransform
+	}, children) : null));
+});
+//#endregion
+export { AutoScrollActivator, DndContext, DragOverlay, KeyboardCode, KeyboardSensor, MeasuringFrequency, MeasuringStrategy, MouseSensor, PointerSensor, TouchSensor, TraversalOrder, applyModifiers, closestCenter, closestCorners, defaultAnnouncements, defaultCoordinates, defaultDropAnimationConfiguration as defaultDropAnimation, defaultDropAnimationSideEffects, defaultScreenReaderInstructions, getClientRect, getFirstCollision, getScrollableAncestors, pointerWithin, rectIntersection, useDndContext, useDndMonitor, useDraggable, useDroppable, useSensor, useSensors };
+
+//# sourceMappingURL=index.js.map