@danfessler/react-dockable
Version:
1,629 lines • 191 kB
JavaScript
import React, { useLayoutEffect, useEffect, useRef, useMemo, useCallback, useState, createContext, memo, useReducer, useContext, forwardRef, cloneElement } from "react";
import { unstable_batchedUpdates, createPortal } from "react-dom";
var jsxRuntime = { exports: {} };
var reactJsxRuntime_production = {};
/**
* @license React
* react-jsx-runtime.production.js
*
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var hasRequiredReactJsxRuntime_production;
function requireReactJsxRuntime_production() {
if (hasRequiredReactJsxRuntime_production) return reactJsxRuntime_production;
hasRequiredReactJsxRuntime_production = 1;
var REACT_ELEMENT_TYPE = Symbol.for("react.transitional.element"), REACT_FRAGMENT_TYPE = Symbol.for("react.fragment");
function jsxProd(type, config, maybeKey) {
var key2 = null;
void 0 !== maybeKey && (key2 = "" + maybeKey);
void 0 !== config.key && (key2 = "" + config.key);
if ("key" in config) {
maybeKey = {};
for (var propName in config)
"key" !== propName && (maybeKey[propName] = config[propName]);
} else maybeKey = config;
config = maybeKey.ref;
return {
$$typeof: REACT_ELEMENT_TYPE,
type,
key: key2,
ref: void 0 !== config ? config : null,
props: maybeKey
};
}
reactJsxRuntime_production.Fragment = REACT_FRAGMENT_TYPE;
reactJsxRuntime_production.jsx = jsxProd;
reactJsxRuntime_production.jsxs = jsxProd;
return reactJsxRuntime_production;
}
var reactJsxRuntime_development = {};
/**
* @license React
* react-jsx-runtime.development.js
*
* Copyright (c) Meta Platforms, Inc. and affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
var hasRequiredReactJsxRuntime_development;
function requireReactJsxRuntime_development() {
if (hasRequiredReactJsxRuntime_development) return reactJsxRuntime_development;
hasRequiredReactJsxRuntime_development = 1;
"production" !== process.env.NODE_ENV && function() {
function getComponentNameFromType(type) {
if (null == type) return null;
if ("function" === typeof type)
return type.$$typeof === REACT_CLIENT_REFERENCE ? null : type.displayName || type.name || null;
if ("string" === typeof type) return type;
switch (type) {
case REACT_FRAGMENT_TYPE:
return "Fragment";
case REACT_PROFILER_TYPE:
return "Profiler";
case REACT_STRICT_MODE_TYPE:
return "StrictMode";
case REACT_SUSPENSE_TYPE:
return "Suspense";
case REACT_SUSPENSE_LIST_TYPE:
return "SuspenseList";
case REACT_ACTIVITY_TYPE:
return "Activity";
}
if ("object" === typeof type)
switch ("number" === typeof type.tag && console.error(
"Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
), type.$$typeof) {
case REACT_PORTAL_TYPE:
return "Portal";
case REACT_CONTEXT_TYPE:
return (type.displayName || "Context") + ".Provider";
case REACT_CONSUMER_TYPE:
return (type._context.displayName || "Context") + ".Consumer";
case REACT_FORWARD_REF_TYPE:
var innerType = type.render;
type = type.displayName;
type || (type = innerType.displayName || innerType.name || "", type = "" !== type ? "ForwardRef(" + type + ")" : "ForwardRef");
return type;
case REACT_MEMO_TYPE:
return innerType = type.displayName || null, null !== innerType ? innerType : getComponentNameFromType(type.type) || "Memo";
case REACT_LAZY_TYPE:
innerType = type._payload;
type = type._init;
try {
return getComponentNameFromType(type(innerType));
} catch (x) {
}
}
return null;
}
function testStringCoercion(value) {
return "" + value;
}
function checkKeyStringCoercion(value) {
try {
testStringCoercion(value);
var JSCompiler_inline_result = false;
} catch (e) {
JSCompiler_inline_result = true;
}
if (JSCompiler_inline_result) {
JSCompiler_inline_result = console;
var JSCompiler_temp_const = JSCompiler_inline_result.error;
var JSCompiler_inline_result$jscomp$0 = "function" === typeof Symbol && Symbol.toStringTag && value[Symbol.toStringTag] || value.constructor.name || "Object";
JSCompiler_temp_const.call(
JSCompiler_inline_result,
"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
JSCompiler_inline_result$jscomp$0
);
return testStringCoercion(value);
}
}
function getTaskName(type) {
if (type === REACT_FRAGMENT_TYPE) return "<>";
if ("object" === typeof type && null !== type && type.$$typeof === REACT_LAZY_TYPE)
return "<...>";
try {
var name = getComponentNameFromType(type);
return name ? "<" + name + ">" : "<...>";
} catch (x) {
return "<...>";
}
}
function getOwner() {
var dispatcher = ReactSharedInternals.A;
return null === dispatcher ? null : dispatcher.getOwner();
}
function UnknownOwner() {
return Error("react-stack-top-frame");
}
function hasValidKey(config) {
if (hasOwnProperty.call(config, "key")) {
var getter = Object.getOwnPropertyDescriptor(config, "key").get;
if (getter && getter.isReactWarning) return false;
}
return void 0 !== config.key;
}
function defineKeyPropWarningGetter(props, displayName) {
function warnAboutAccessingKey() {
specialPropKeyWarningShown || (specialPropKeyWarningShown = true, console.error(
"%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
displayName
));
}
warnAboutAccessingKey.isReactWarning = true;
Object.defineProperty(props, "key", {
get: warnAboutAccessingKey,
configurable: true
});
}
function elementRefGetterWithDeprecationWarning() {
var componentName = getComponentNameFromType(this.type);
didWarnAboutElementRef[componentName] || (didWarnAboutElementRef[componentName] = true, console.error(
"Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
));
componentName = this.props.ref;
return void 0 !== componentName ? componentName : null;
}
function ReactElement(type, key2, self, source, owner, props, debugStack, debugTask) {
self = props.ref;
type = {
$$typeof: REACT_ELEMENT_TYPE,
type,
key: key2,
props,
_owner: owner
};
null !== (void 0 !== self ? self : null) ? Object.defineProperty(type, "ref", {
enumerable: false,
get: elementRefGetterWithDeprecationWarning
}) : Object.defineProperty(type, "ref", { enumerable: false, value: null });
type._store = {};
Object.defineProperty(type._store, "validated", {
configurable: false,
enumerable: false,
writable: true,
value: 0
});
Object.defineProperty(type, "_debugInfo", {
configurable: false,
enumerable: false,
writable: true,
value: null
});
Object.defineProperty(type, "_debugStack", {
configurable: false,
enumerable: false,
writable: true,
value: debugStack
});
Object.defineProperty(type, "_debugTask", {
configurable: false,
enumerable: false,
writable: true,
value: debugTask
});
Object.freeze && (Object.freeze(type.props), Object.freeze(type));
return type;
}
function jsxDEVImpl(type, config, maybeKey, isStaticChildren, source, self, debugStack, debugTask) {
var children = config.children;
if (void 0 !== children)
if (isStaticChildren)
if (isArrayImpl(children)) {
for (isStaticChildren = 0; isStaticChildren < children.length; isStaticChildren++)
validateChildKeys(children[isStaticChildren]);
Object.freeze && Object.freeze(children);
} else
console.error(
"React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
);
else validateChildKeys(children);
if (hasOwnProperty.call(config, "key")) {
children = getComponentNameFromType(type);
var keys = Object.keys(config).filter(function(k) {
return "key" !== k;
});
isStaticChildren = 0 < keys.length ? "{key: someKey, " + keys.join(": ..., ") + ": ...}" : "{key: someKey}";
didWarnAboutKeySpread[children + isStaticChildren] || (keys = 0 < keys.length ? "{" + keys.join(": ..., ") + ": ...}" : "{}", console.error(
'A props object containing a "key" prop is being spread into JSX:\n let props = %s;\n <%s {...props} />\nReact keys must be passed directly to JSX without using spread:\n let props = %s;\n <%s key={someKey} {...props} />',
isStaticChildren,
children,
keys,
children
), didWarnAboutKeySpread[children + isStaticChildren] = true);
}
children = null;
void 0 !== maybeKey && (checkKeyStringCoercion(maybeKey), children = "" + maybeKey);
hasValidKey(config) && (checkKeyStringCoercion(config.key), children = "" + config.key);
if ("key" in config) {
maybeKey = {};
for (var propName in config)
"key" !== propName && (maybeKey[propName] = config[propName]);
} else maybeKey = config;
children && defineKeyPropWarningGetter(
maybeKey,
"function" === typeof type ? type.displayName || type.name || "Unknown" : type
);
return ReactElement(
type,
children,
self,
source,
getOwner(),
maybeKey,
debugStack,
debugTask
);
}
function validateChildKeys(node) {
"object" === typeof node && null !== node && node.$$typeof === REACT_ELEMENT_TYPE && node._store && (node._store.validated = 1);
}
var React$1 = React, REACT_ELEMENT_TYPE = Symbol.for("react.transitional.element"), REACT_PORTAL_TYPE = Symbol.for("react.portal"), REACT_FRAGMENT_TYPE = Symbol.for("react.fragment"), REACT_STRICT_MODE_TYPE = Symbol.for("react.strict_mode"), REACT_PROFILER_TYPE = Symbol.for("react.profiler");
var REACT_CONSUMER_TYPE = Symbol.for("react.consumer"), REACT_CONTEXT_TYPE = Symbol.for("react.context"), REACT_FORWARD_REF_TYPE = Symbol.for("react.forward_ref"), REACT_SUSPENSE_TYPE = Symbol.for("react.suspense"), REACT_SUSPENSE_LIST_TYPE = Symbol.for("react.suspense_list"), REACT_MEMO_TYPE = Symbol.for("react.memo"), REACT_LAZY_TYPE = Symbol.for("react.lazy"), REACT_ACTIVITY_TYPE = Symbol.for("react.activity"), REACT_CLIENT_REFERENCE = Symbol.for("react.client.reference"), ReactSharedInternals = React$1.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, hasOwnProperty = Object.prototype.hasOwnProperty, isArrayImpl = Array.isArray, createTask = console.createTask ? console.createTask : function() {
return null;
};
React$1 = {
"react-stack-bottom-frame": function(callStackForError) {
return callStackForError();
}
};
var specialPropKeyWarningShown;
var didWarnAboutElementRef = {};
var unknownOwnerDebugStack = React$1["react-stack-bottom-frame"].bind(
React$1,
UnknownOwner
)();
var unknownOwnerDebugTask = createTask(getTaskName(UnknownOwner));
var didWarnAboutKeySpread = {};
reactJsxRuntime_development.Fragment = REACT_FRAGMENT_TYPE;
reactJsxRuntime_development.jsx = function(type, config, maybeKey, source, self) {
var trackActualOwner = 1e4 > ReactSharedInternals.recentlyCreatedOwnerStacks++;
return jsxDEVImpl(
type,
config,
maybeKey,
false,
source,
self,
trackActualOwner ? Error("react-stack-top-frame") : unknownOwnerDebugStack,
trackActualOwner ? createTask(getTaskName(type)) : unknownOwnerDebugTask
);
};
reactJsxRuntime_development.jsxs = function(type, config, maybeKey, source, self) {
var trackActualOwner = 1e4 > ReactSharedInternals.recentlyCreatedOwnerStacks++;
return jsxDEVImpl(
type,
config,
maybeKey,
true,
source,
self,
trackActualOwner ? Error("react-stack-top-frame") : unknownOwnerDebugStack,
trackActualOwner ? createTask(getTaskName(type)) : unknownOwnerDebugTask
);
};
}();
return reactJsxRuntime_development;
}
var hasRequiredJsxRuntime;
function requireJsxRuntime() {
if (hasRequiredJsxRuntime) return jsxRuntime.exports;
hasRequiredJsxRuntime = 1;
if (process.env.NODE_ENV === "production") {
jsxRuntime.exports = requireReactJsxRuntime_production();
} else {
jsxRuntime.exports = requireReactJsxRuntime_development();
}
return jsxRuntime.exports;
}
var jsxRuntimeExports = requireJsxRuntime();
const container$1 = "_container_gmt9a_1";
const tabBar = "_tabBar_gmt9a_53";
const isOver = "_isOver_gmt9a_65";
const edgeZone = "_edgeZone_gmt9a_91";
const edgeZoneLeft = "_edgeZoneLeft_gmt9a_163";
const edgeZoneRight = "_edgeZoneRight_gmt9a_173";
const edgeZoneBottom = "_edgeZoneBottom_gmt9a_183";
const edgeZoneTop = "_edgeZoneTop_gmt9a_193";
const edgeZoneHover = "_edgeZoneHover_gmt9a_265";
const styles$3 = {
container: container$1,
tabBar,
isOver,
edgeZone,
edgeZoneLeft,
edgeZoneRight,
edgeZoneBottom,
edgeZoneTop,
edgeZoneHover
};
function useCombinedRefs() {
for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {
refs[_key] = arguments[_key];
}
return useMemo(
() => (node) => {
refs.forEach((ref) => ref(node));
},
// eslint-disable-next-line react-hooks/exhaustive-deps
refs
);
}
const canUseDOM = typeof window !== "undefined" && typeof window.document !== "undefined" && typeof window.document.createElement !== "undefined";
function isWindow(element) {
const elementString = Object.prototype.toString.call(element);
return elementString === "[object Window]" || // In Electron context the Window object serializes to [object global]
elementString === "[object global]";
}
function isNode(node) {
return "nodeType" in node;
}
function getWindow(target) {
var _target$ownerDocument, _target$ownerDocument2;
if (!target) {
return window;
}
if (isWindow(target)) {
return target;
}
if (!isNode(target)) {
return window;
}
return (_target$ownerDocument = (_target$ownerDocument2 = target.ownerDocument) == null ? void 0 : _target$ownerDocument2.defaultView) != null ? _target$ownerDocument : window;
}
function isDocument(node) {
const {
Document
} = getWindow(node);
return node instanceof Document;
}
function isHTMLElement(node) {
if (isWindow(node)) {
return false;
}
return node instanceof getWindow(node).HTMLElement;
}
function isSVGElement(node) {
return node instanceof getWindow(node).SVGElement;
}
function getOwnerDocument(target) {
if (!target) {
return document;
}
if (isWindow(target)) {
return target.document;
}
if (!isNode(target)) {
return document;
}
if (isDocument(target)) {
return target;
}
if (isHTMLElement(target) || isSVGElement(target)) {
return target.ownerDocument;
}
return document;
}
const useIsomorphicLayoutEffect = canUseDOM ? useLayoutEffect : useEffect;
function useEvent(handler) {
const handlerRef = useRef(handler);
useIsomorphicLayoutEffect(() => {
handlerRef.current = handler;
});
return useCallback(function() {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return handlerRef.current == null ? void 0 : handlerRef.current(...args);
}, []);
}
function useInterval() {
const intervalRef = useRef(null);
const set2 = useCallback((listener, duration) => {
intervalRef.current = setInterval(listener, duration);
}, []);
const clear = useCallback(() => {
if (intervalRef.current !== null) {
clearInterval(intervalRef.current);
intervalRef.current = null;
}
}, []);
return [set2, clear];
}
function useLatestValue(value, dependencies) {
if (dependencies === void 0) {
dependencies = [value];
}
const valueRef = useRef(value);
useIsomorphicLayoutEffect(() => {
if (valueRef.current !== value) {
valueRef.current = value;
}
}, dependencies);
return valueRef;
}
function useLazyMemo(callback, dependencies) {
const valueRef = useRef();
return useMemo(
() => {
const newValue = callback(valueRef.current);
valueRef.current = newValue;
return newValue;
},
// eslint-disable-next-line react-hooks/exhaustive-deps
[...dependencies]
);
}
function useNodeRef(onChange) {
const onChangeHandler = useEvent(onChange);
const node = useRef(null);
const setNodeRef = useCallback(
(element) => {
if (element !== node.current) {
onChangeHandler == null ? void 0 : onChangeHandler(element, node.current);
}
node.current = element;
},
//eslint-disable-next-line
[]
);
return [node, setNodeRef];
}
function usePrevious(value) {
const ref = useRef();
useEffect(() => {
ref.current = value;
}, [value]);
return ref.current;
}
let ids = {};
function useUniqueId(prefix, value) {
return useMemo(() => {
if (value) {
return value;
}
const id = ids[prefix] == null ? 0 : ids[prefix] + 1;
ids[prefix] = id;
return prefix + "-" + id;
}, [prefix, value]);
}
function createAdjustmentFn(modifier) {
return function(object) {
for (var _len = arguments.length, adjustments = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
adjustments[_key - 1] = arguments[_key];
}
return adjustments.reduce((accumulator, adjustment) => {
const entries = Object.entries(adjustment);
for (const [key2, valueAdjustment] of entries) {
const value = accumulator[key2];
if (value != null) {
accumulator[key2] = value + modifier * valueAdjustment;
}
}
return accumulator;
}, {
...object
});
};
}
const add = /* @__PURE__ */ createAdjustmentFn(1);
const subtract = /* @__PURE__ */ createAdjustmentFn(-1);
function hasViewportRelativeCoordinates(event) {
return "clientX" in event && "clientY" in event;
}
function isKeyboardEvent(event) {
if (!event) {
return false;
}
const {
KeyboardEvent
} = getWindow(event.target);
return KeyboardEvent && event instanceof KeyboardEvent;
}
function isTouchEvent(event) {
if (!event) {
return false;
}
const {
TouchEvent
} = getWindow(event.target);
return TouchEvent && event instanceof TouchEvent;
}
function getEventCoordinates(event) {
if (isTouchEvent(event)) {
if (event.touches && event.touches.length) {
const {
clientX: x,
clientY: y
} = event.touches[0];
return {
x,
y
};
} else if (event.changedTouches && event.changedTouches.length) {
const {
clientX: x,
clientY: y
} = event.changedTouches[0];
return {
x,
y
};
}
}
if (hasViewportRelativeCoordinates(event)) {
return {
x: event.clientX,
y: event.clientY
};
}
return null;
}
const CSS = /* @__PURE__ */ Object.freeze({
Translate: {
toString(transform) {
if (!transform) {
return;
}
const {
x,
y
} = transform;
return "translate3d(" + (x ? Math.round(x) : 0) + "px, " + (y ? Math.round(y) : 0) + "px, 0)";
}
},
Scale: {
toString(transform) {
if (!transform) {
return;
}
const {
scaleX,
scaleY
} = transform;
return "scaleX(" + scaleX + ") scaleY(" + scaleY + ")";
}
},
Transform: {
toString(transform) {
if (!transform) {
return;
}
return [CSS.Translate.toString(transform), CSS.Scale.toString(transform)].join(" ");
}
},
Transition: {
toString(_ref) {
let {
property,
duration,
easing
} = _ref;
return property + " " + duration + "ms " + easing;
}
}
});
const SELECTOR = "a,frame,iframe,input:not([type=hidden]):not(:disabled),select:not(:disabled),textarea:not(:disabled),button:not(:disabled),*[tabindex]";
function findFirstFocusableNode(element) {
if (element.matches(SELECTOR)) {
return element;
}
return element.querySelector(SELECTOR);
}
const hiddenStyles = {
display: "none"
};
function HiddenText(_ref) {
let {
id,
value
} = _ref;
return React.createElement("div", {
id,
style: hiddenStyles
}, value);
}
function LiveRegion(_ref) {
let {
id,
announcement,
ariaLiveType = "assertive"
} = _ref;
const visuallyHidden = {
position: "fixed",
top: 0,
left: 0,
width: 1,
height: 1,
margin: -1,
border: 0,
padding: 0,
overflow: "hidden",
clip: "rect(0 0 0 0)",
clipPath: "inset(100%)",
whiteSpace: "nowrap"
};
return React.createElement("div", {
id,
style: visuallyHidden,
role: "status",
"aria-live": ariaLiveType,
"aria-atomic": true
}, announcement);
}
function useAnnouncement() {
const [announcement, setAnnouncement] = useState("");
const announce = useCallback((value) => {
if (value != null) {
setAnnouncement(value);
}
}, []);
return {
announce,
announcement
};
}
const DndMonitorContext = /* @__PURE__ */ createContext(null);
function useDndMonitor(listener) {
const registerListener = useContext(DndMonitorContext);
useEffect(() => {
if (!registerListener) {
throw new Error("useDndMonitor must be used within a children of <DndContext>");
}
const unsubscribe = registerListener(listener);
return unsubscribe;
}, [listener, registerListener]);
}
function useDndMonitorProvider() {
const [listeners] = useState(() => /* @__PURE__ */ new Set());
const registerListener = useCallback((listener) => {
listeners.add(listener);
return () => listeners.delete(listener);
}, [listeners]);
const dispatch = useCallback((_ref) => {
let {
type,
event
} = _ref;
listeners.forEach((listener) => {
var _listener$type;
return (_listener$type = listener[type]) == null ? void 0 : _listener$type.call(listener, event);
});
}, [listeners]);
return [dispatch, registerListener];
}
const defaultScreenReaderInstructions = {
draggable: "\n To pick up a draggable item, press the space bar.\n While dragging, use the arrow keys to move the item.\n Press space again to drop the item in its new position, or press escape to cancel.\n "
};
const defaultAnnouncements = {
onDragStart(_ref) {
let {
active
} = _ref;
return "Picked up draggable item " + active.id + ".";
},
onDragOver(_ref2) {
let {
active,
over
} = _ref2;
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(_ref3) {
let {
active,
over
} = _ref3;
if (over) {
return "Draggable item " + active.id + " was dropped over droppable area " + over.id;
}
return "Draggable item " + active.id + " was dropped.";
},
onDragCancel(_ref4) {
let {
active
} = _ref4;
return "Dragging was cancelled. Draggable item " + active.id + " was dropped.";
}
};
function Accessibility(_ref) {
let {
announcements = defaultAnnouncements,
container: container2,
hiddenTextDescribedById,
screenReaderInstructions = defaultScreenReaderInstructions
} = _ref;
const {
announce,
announcement
} = useAnnouncement();
const liveRegionId = useUniqueId("DndLiveRegion");
const [mounted, setMounted] = useState(false);
useEffect(() => {
setMounted(true);
}, []);
useDndMonitor(useMemo(() => ({
onDragStart(_ref2) {
let {
active
} = _ref2;
announce(announcements.onDragStart({
active
}));
},
onDragMove(_ref3) {
let {
active,
over
} = _ref3;
if (announcements.onDragMove) {
announce(announcements.onDragMove({
active,
over
}));
}
},
onDragOver(_ref4) {
let {
active,
over
} = _ref4;
announce(announcements.onDragOver({
active,
over
}));
},
onDragEnd(_ref5) {
let {
active,
over
} = _ref5;
announce(announcements.onDragEnd({
active,
over
}));
},
onDragCancel(_ref6) {
let {
active,
over
} = _ref6;
announce(announcements.onDragCancel({
active,
over
}));
}
}), [announce, announcements]));
if (!mounted) {
return null;
}
const markup = React.createElement(React.Fragment, null, React.createElement(HiddenText, {
id: hiddenTextDescribedById,
value: screenReaderInstructions.draggable
}), React.createElement(LiveRegion, {
id: liveRegionId,
announcement
}));
return container2 ? createPortal(markup, container2) : markup;
}
var Action;
(function(Action2) {
Action2["DragStart"] = "dragStart";
Action2["DragMove"] = "dragMove";
Action2["DragEnd"] = "dragEnd";
Action2["DragCancel"] = "dragCancel";
Action2["DragOver"] = "dragOver";
Action2["RegisterDroppable"] = "registerDroppable";
Action2["SetDroppableDisabled"] = "setDroppableDisabled";
Action2["UnregisterDroppable"] = "unregisterDroppable";
})(Action || (Action = {}));
function noop() {
}
function useSensor(sensor, options) {
return useMemo(
() => ({
sensor,
options: options != null ? options : {}
}),
// eslint-disable-next-line react-hooks/exhaustive-deps
[sensor, options]
);
}
function useSensors() {
for (var _len = arguments.length, sensors = new Array(_len), _key = 0; _key < _len; _key++) {
sensors[_key] = arguments[_key];
}
return useMemo(
() => [...sensors].filter((sensor) => sensor != null),
// eslint-disable-next-line react-hooks/exhaustive-deps
[...sensors]
);
}
const defaultCoordinates = /* @__PURE__ */ Object.freeze({
x: 0,
y: 0
});
function distanceBetween(p1, p2) {
return Math.sqrt(Math.pow(p1.x - p2.x, 2) + Math.pow(p1.y - p2.y, 2));
}
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 + "%";
}
function sortCollisionsAsc(_ref, _ref2) {
let {
data: {
value: a
}
} = _ref;
let {
data: {
value: b
}
} = _ref2;
return a - b;
}
function sortCollisionsDesc(_ref3, _ref4) {
let {
data: {
value: a
}
} = _ref3;
let {
data: {
value: b
}
} = _ref4;
return b - a;
}
function getFirstCollision(collisions, property) {
if (!collisions || collisions.length === 0) {
return null;
}
const [firstCollision] = collisions;
return firstCollision[property];
}
function centerOfRectangle(rect, left, top) {
if (left === void 0) {
left = rect.left;
}
if (top === void 0) {
top = rect.top;
}
return {
x: left + rect.width * 0.5,
y: top + rect.height * 0.5
};
}
const closestCenter = (_ref) => {
let {
collisionRect,
droppableRects,
droppableContainers
} = _ref;
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);
};
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;
}
const rectIntersection = (_ref) => {
let {
collisionRect,
droppableRects,
droppableContainers
} = _ref;
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);
};
function adjustScale(transform, rect1, rect2) {
return {
...transform,
scaleX: rect1 && rect2 ? rect1.width / rect2.width : 1,
scaleY: rect1 && rect2 ? rect1.height / rect2.height : 1
};
}
function getRectDelta(rect1, rect2) {
return rect1 && rect2 ? {
x: rect1.left - rect2.left,
y: rect1.top - rect2.top
} : defaultCoordinates;
}
function createRectAdjustmentFn(modifier) {
return function adjustClientRect(rect) {
for (var _len = arguments.length, adjustments = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
adjustments[_key - 1] = arguments[_key];
}
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 = /* @__PURE__ */ createRectAdjustmentFn(1);
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;
}
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
};
}
const defaultOptions = {
ignoreTransform: false
};
function getClientRect(element, options) {
if (options === void 0) {
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
};
}
function getTransformAgnosticClientRect(element) {
return getClientRect(element, {
ignoreTransform: true
});
}
function getWindowClientRect(element) {
const width = element.innerWidth;
const height = element.innerHeight;
return {
top: 0,
left: 0,
right: width,
bottom: height,
width,
height
};
}
function isFixed(node, computedStyle) {
if (computedStyle === void 0) {
computedStyle = getWindow(node).getComputedStyle(node);
}
return computedStyle.position === "fixed";
}
function isScrollable(element, computedStyle) {
if (computedStyle === void 0) {
computedStyle = getWindow(element).getComputedStyle(element);
}
const overflowRegex = /(auto|scroll|overlay)/;
const properties2 = ["overflow", "overflowX", "overflowY"];
return properties2.some((property) => {
const value = computedStyle[property];
return typeof value === "string" ? overflowRegex.test(value) : false;
});
}
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 ? firstScrollableAncestor : null;
}
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;
}
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)
};
}
var Direction;
(function(Direction2) {
Direction2[Direction2["Forward"] = 1] = "Forward";
Direction2[Direction2["Backward"] = -1] = "Backward";
})(Direction || (Direction = {}));
function isDocumentScrollingElement(element) {
if (!canUseDOM || !element) {
return false;
}
return element === document.scrollingElement;
}
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
};
const isTop = scrollingContainer.scrollTop <= minScroll.y;
const isLeft = scrollingContainer.scrollLeft <= minScroll.x;
const isBottom = scrollingContainer.scrollTop >= maxScroll.y;
const isRight = scrollingContainer.scrollLeft >= maxScroll.x;
return {
isTop,
isLeft,
isBottom,
isRight,
maxScroll,
minScroll
};
}
const defaultThreshold = {
x: 0.2,
y: 0.2
};
function getScrollDirectionAndSpeed(scrollContainer, scrollContainerRect, _ref, acceleration, thresholdPercentage) {
let {
top,
left,
right,
bottom
} = _ref;
if (acceleration === void 0) {
acceleration = 10;
}
if (thresholdPercentage === void 0) {
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 = Direction.Backward;
speed.y = acceleration * Math.abs((scrollContainerRect.top + threshold.height - top) / threshold.height);
} else if (!isBottom && bottom >= scrollContainerRect.bottom - threshold.height) {
direction.y = Direction.Forward;
speed.y = acceleration * Math.abs((scrollContainerRect.bottom - threshold.height - bottom) / threshold.height);
}
if (!isRight && right >= scrollContainerRect.right - threshold.width) {
direction.x = Direction.Forward;
speed.x = acceleration * Math.abs((scrollContainerRect.right - threshold.width - right) / threshold.width);
} else if (!isLeft && left <= scrollContainerRect.left + threshold.width) {
direction.x = Direction.Backward;
speed.x = acceleration * Math.abs((scrollContainerRect.left + threshold.width - left) / threshold.width);
}
return {
direction,
speed
};
}
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
};
}
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);
}
function scrollIntoViewIfNeeded(element, measure) {
if (measure === void 0) {
measure = getClientRect;
}
if (!element) {
return;
}
const {
top,
left,
bottom,
right
} = measure(element);
const firstScrollableAncestor = getFirstScrollableAncestor(element);
if (!firstScrollableAncestor) {
return;
}
if (bottom <= 0 || right <= 0 || top >= window.innerHeight || left >= window.innerWidth) {
element.scrollIntoView({
block: "center",
inline: "center"
});
}
}
const properties = [["x", ["left", "right"], getScrollXOffset], ["y", ["top", "bottom"], getScrollYOffset]];
class Rect {
constructor(rect, element) {
this.rect = void 0;
this.width = void 0;
this.height = void 0;
this.top = void 0;
this.bottom = void 0;
this.right = void 0;
this.left = void 0;
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 key2 of keys) {
Object.defineProperty(this, key2, {
get: () => {
const currentOffsets = getScrollOffset(scrollableAncestors);
const scrollOffsetsDeltla = scrollOffsets[axis] - currentOffsets;
return this.rect[key2] + scrollOffsetsDeltla;
},
enumerable: true
});
}
}
Object.defineProperty(this, "rect", {
enumerable: false
});
}
}
class Listeners {
constructor(target) {
this.target = void 0;
this.listeners = [];
this.removeAll = () => {
this.listeners.forEach((listener) => {
var _this$target;
return (_this$target = this.target) == null ? void 0 : _this$target.removeEventListener(...listener);
});
};
this.target = target;
}
add(eventName, handler, options) {
var _this$target2;
(_this$target2 = this.target) == null ? void 0 : _this$target2.addEventListener(eventName, handler, options);
this.listeners.push([eventName, handler, options]);
}
}
function getEventListenerTarget(target) {
const {
EventTarget
} = getWindow(target);
return target instanceof EventTarget ? target : getOwnerDocument(target);
}
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;
}
var EventName;
(function(EventName2) {
EventName2["Click"] = "click";
EventName2["DragStart"] = "dragstart";
EventName2["Keydown"] = "keydown";
EventName2["ContextMenu"] = "contextmenu";
EventName2["Resize"] = "resize";
EventName2["SelectionChange"] = "selectionchange";
EventName2["VisibilityChange"] = "visibilitychange";
})(EventName || (EventName = {}));
function preventDefault(event) {
event.preventDefault();
}
function stopPropagation(event) {
event.stopPropagation();
}
var KeyboardCode;
(function(KeyboardCode2) {
KeyboardCode2["Space"] = "Space";
KeyboardCode2["Down"] = "ArrowDown";
KeyboardCode2["Right"] = "ArrowRight";
KeyboardCode2["Left"] = "ArrowLeft";
KeyboardCode2["Up"] = "ArrowUp";
KeyboardCode2["Esc"] = "Escape";
KeyboardCode2["Enter"] = "Enter";
KeyboardCode2["Tab"] = "Tab";
})(KeyboardCode || (KeyboardCode = {}));
const defaultKeyboardCodes = {
start: [KeyboardCode.Space, KeyboardCode.Enter],
cancel: [KeyboardCode.Esc],
end: [KeyboardCode.Space, KeyboardCode.Enter, KeyboardCode.Tab]
};
const defaultKeyboardCoordinateGetter = (event, _ref) => {
let {
currentCoordinates
} = _ref;
switch (event.code) {
case KeyboardCode.Right:
return {
...currentCoordinates,
x: currentCoordinates.x + 25
};
case KeyboardCode.Left:
return {
...currentCoordinates,
x: currentCoordinates.x - 25
};
case KeyboardCode.Down:
return {
...currentCoordinates,
y: currentCoordinates.y + 25
};
case KeyboardCode.Up:
return {
...currentCoordinates,
y: currentCoordinates.y - 25
};
}
return void 0;
};
class KeyboardSensor {
constructor(props) {
this.props = void 0;
this.autoScrollEnabled = false;
this.referenceCoordinates = void 0;
this.listeners = void 0;
this.windowListeners = void 0;
this.props = props;
const {
event: {
target
}
} = props;
this.props = 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(EventName.Resize, this.handleCancel);
this.windowListeners.add(EventName.VisibilityChange, this.handleCancel);
setTimeout(() => this.listeners.add(EventName.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 === KeyboardCode.Right ? scrollElementRect.right - scrollElementRect.width / 2 : scrollElementRect.right, Math.max(direction === KeyboardCode.Right ? scrollElementRect.left : scrollElementRect.left + scrollElementRect.width / 2, newCoordinates.x)),
y: Math.min(direction === KeyboardCode.Down ? scrollElementRect.bottom - scrollElementRect.height / 2 : scrollElementRect.bottom, Math.max(direction === KeyboardCode.Down ? scrollElementRect.top : scrollElementRect.top + scrollElementRect.height / 2, newCoordinates.y))
};
const canScrollX = direction === KeyboardCode.Right && !isRight || direction === KeyboardCode.Left && !isLeft;
const canScrollY = direction === KeyboardCode.Down && !isBottom || direction === KeyboardCode.Up && !isTop;
if (canScrollX && clampedCoordinates.x !== newCoordinates.x) {
const newScrollCoordinates = scrollContainer.scrollLeft + coordinatesDelta.x;
const canScrollToNewCoordinates = direction === KeyboardCode.Right && newScrollCoordinates <= maxScroll.x || direction === KeyboardCode.Left && 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 === KeyboardCode.Right ? 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 === KeyboardCode.Down && newScrollCoordinates <= maxScroll.y || direction === KeyboardCode.Up && newScrollCoordinates >= minScroll.y;
if (canScrollToNewCoordinates && !coordinatesDelta.x) {
scrollContainer.scrollTo({
top: newScrollCoordinates,
behavior: scrollBehavior
});
return;
}
if