UNPKG

react-appointment-scheduler

Version:

A production-ready React scheduler component for appointment management with day/week views, drag-and-drop, and TypeScript support

2,132 lines (2,131 loc) 159 kB
import { jsx as i, jsxs as c, Fragment as Zn } from "react/jsx-runtime"; import te, { useMemo as L, useRef as Q, useCallback as x, useLayoutEffect as er, useEffect as q, useState as $, createContext as lt, useContext as Pe, memo as Ne, useReducer as tr, cloneElement as nr, forwardRef as rr } from "react"; import { unstable_batchedUpdates as vt, createPortal as ir } from "react-dom"; const kt = typeof window < "u" && typeof window.document < "u" && typeof window.document.createElement < "u"; function Ke(t) { const e = Object.prototype.toString.call(t); return e === "[object Window]" || // In Electron context the Window object serializes to [object global] e === "[object global]"; } function Jt(t) { return "nodeType" in t; } function ue(t) { var e, n; return t ? Ke(t) ? t : Jt(t) && (e = (n = t.ownerDocument) == null ? void 0 : n.defaultView) != null ? e : window : window; } function Vt(t) { const { Document: e } = ue(t); return t instanceof e; } function ct(t) { return Ke(t) ? !1 : t instanceof ue(t).HTMLElement; } function Dn(t) { return t instanceof ue(t).SVGElement; } function Ue(t) { return t ? Ke(t) ? t.document : Jt(t) ? Vt(t) ? t : ct(t) || Dn(t) ? t.ownerDocument : document : document : document; } const Re = kt ? er : q; function St(t) { const e = Q(t); return Re(() => { e.current = t; }), x(function() { for (var n = arguments.length, r = new Array(n), o = 0; o < n; o++) r[o] = arguments[o]; return e.current == null ? void 0 : e.current(...r); }, []); } function or() { const t = Q(null), e = x((r, o) => { t.current = setInterval(r, o); }, []), n = x(() => { t.current !== null && (clearInterval(t.current), t.current = null); }, []); return [e, n]; } function ot(t, e) { e === void 0 && (e = [t]); const n = Q(t); return Re(() => { n.current !== t && (n.current = t); }, e), n; } function dt(t, e) { const n = Q(); return L( () => { const r = t(n.current); return n.current = r, r; }, // eslint-disable-next-line react-hooks/exhaustive-deps [...e] ); } function bt(t) { const e = St(t), n = Q(null), r = x( (o) => { o !== n.current && e?.(o, n.current), n.current = o; }, //eslint-disable-next-line [] ); return [n, r]; } function yt(t) { const e = Q(); return q(() => { e.current = t; }, [t]), e.current; } let Ot = {}; function xt(t, e) { return L(() => { if (e) return e; const n = Ot[t] == null ? 0 : Ot[t] + 1; return Ot[t] = n, t + "-" + n; }, [t, e]); } function Cn(t) { return function(e) { for (var n = arguments.length, r = new Array(n > 1 ? n - 1 : 0), o = 1; o < n; o++) r[o - 1] = arguments[o]; return r.reduce((a, s) => { const l = Object.entries(s); for (const [d, u] of l) { const h = a[d]; h != null && (a[d] = h + t * u); } return a; }, { ...e }); }; } const qe = /* @__PURE__ */ Cn(1), Nt = /* @__PURE__ */ Cn(-1); function ar(t) { return "clientX" in t && "clientY" in t; } function Yt(t) { if (!t) return !1; const { KeyboardEvent: e } = ue(t.target); return e && t instanceof e; } function sr(t) { if (!t) return !1; const { TouchEvent: e } = ue(t.target); return e && t instanceof e; } function wt(t) { if (sr(t)) { if (t.touches && t.touches.length) { const { clientX: e, clientY: n } = t.touches[0]; return { x: e, y: n }; } else if (t.changedTouches && t.changedTouches.length) { const { clientX: e, clientY: n } = t.changedTouches[0]; return { x: e, y: n }; } } return ar(t) ? { x: t.clientX, y: t.clientY } : null; } const at = /* @__PURE__ */ Object.freeze({ Translate: { toString(t) { if (!t) return; const { x: e, y: n } = t; return "translate3d(" + (e ? Math.round(e) : 0) + "px, " + (n ? Math.round(n) : 0) + "px, 0)"; } }, Scale: { toString(t) { if (!t) return; const { scaleX: e, scaleY: n } = t; return "scaleX(" + e + ") scaleY(" + n + ")"; } }, Transform: { toString(t) { if (t) return [at.Translate.toString(t), at.Scale.toString(t)].join(" "); } }, Transition: { toString(t) { let { property: e, duration: n, easing: r } = t; return e + " " + n + "ms " + r; } } }), ln = "a,frame,iframe,input:not([type=hidden]):not(:disabled),select:not(:disabled),textarea:not(:disabled),button:not(:disabled),*[tabindex]"; function lr(t) { return t.matches(ln) ? t : t.querySelector(ln); } const cr = { display: "none" }; function dr(t) { let { id: e, value: n } = t; return te.createElement("div", { id: e, style: cr }, n); } function ur(t) { let { id: e, announcement: n, ariaLiveType: r = "assertive" } = t; const o = { 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 te.createElement("div", { id: e, style: o, role: "status", "aria-live": r, "aria-atomic": !0 }, n); } function hr() { const [t, e] = $(""); return { announce: x((r) => { r != null && e(r); }, []), announcement: t }; } const Tn = /* @__PURE__ */ lt(null); function fr(t) { const e = Pe(Tn); q(() => { if (!e) throw new Error("useDndMonitor must be used within a children of <DndContext>"); return e(t); }, [t, e]); } function mr() { const [t] = $(() => /* @__PURE__ */ new Set()), e = x((r) => (t.add(r), () => t.delete(r)), [t]); return [x((r) => { let { type: o, event: a } = r; t.forEach((s) => { var l; return (l = s[o]) == null ? void 0 : l.call(s, a); }); }, [t]), e]; } const gr = { 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. ` }, vr = { onDragStart(t) { let { active: e } = t; return "Picked up draggable item " + e.id + "."; }, onDragOver(t) { let { active: e, over: n } = t; return n ? "Draggable item " + e.id + " was moved over droppable area " + n.id + "." : "Draggable item " + e.id + " is no longer over a droppable area."; }, onDragEnd(t) { let { active: e, over: n } = t; return n ? "Draggable item " + e.id + " was dropped over droppable area " + n.id : "Draggable item " + e.id + " was dropped."; }, onDragCancel(t) { let { active: e } = t; return "Dragging was cancelled. Draggable item " + e.id + " was dropped."; } }; function pr(t) { let { announcements: e = vr, container: n, hiddenTextDescribedById: r, screenReaderInstructions: o = gr } = t; const { announce: a, announcement: s } = hr(), l = xt("DndLiveRegion"), [d, u] = $(!1); if (q(() => { u(!0); }, []), fr(L(() => ({ onDragStart(f) { let { active: m } = f; a(e.onDragStart({ active: m })); }, onDragMove(f) { let { active: m, over: y } = f; e.onDragMove && a(e.onDragMove({ active: m, over: y })); }, onDragOver(f) { let { active: m, over: y } = f; a(e.onDragOver({ active: m, over: y })); }, onDragEnd(f) { let { active: m, over: y } = f; a(e.onDragEnd({ active: m, over: y })); }, onDragCancel(f) { let { active: m, over: y } = f; a(e.onDragCancel({ active: m, over: y })); } }), [a, e])), !d) return null; const h = te.createElement(te.Fragment, null, te.createElement(dr, { id: r, value: o.draggable }), te.createElement(ur, { id: l, announcement: s })); return n ? ir(h, n) : h; } var ie; (function(t) { t.DragStart = "dragStart", t.DragMove = "dragMove", t.DragEnd = "dragEnd", t.DragCancel = "dragCancel", t.DragOver = "dragOver", t.RegisterDroppable = "registerDroppable", t.SetDroppableDisabled = "setDroppableDisabled", t.UnregisterDroppable = "unregisterDroppable"; })(ie || (ie = {})); function Dt() { } function jt(t, e) { return L( () => ({ sensor: t, options: e ?? {} }), // eslint-disable-next-line react-hooks/exhaustive-deps [t, e] ); } function br() { for (var t = arguments.length, e = new Array(t), n = 0; n < t; n++) e[n] = arguments[n]; return L( () => [...e].filter((r) => r != null), // eslint-disable-next-line react-hooks/exhaustive-deps [...e] ); } const De = /* @__PURE__ */ Object.freeze({ x: 0, y: 0 }); function yr(t, e) { const n = wt(t); if (!n) return "0 0"; const r = { x: (n.x - e.left) / e.width * 100, y: (n.y - e.top) / e.height * 100 }; return r.x + "% " + r.y + "%"; } function Nr(t, e) { let { data: { value: n } } = t, { data: { value: r } } = e; return r - n; } function wr(t, e) { if (!t || t.length === 0) return null; const [n] = t; return n[e]; } function Dr(t, e) { const n = Math.max(e.top, t.top), r = Math.max(e.left, t.left), o = Math.min(e.left + e.width, t.left + t.width), a = Math.min(e.top + e.height, t.top + t.height), s = o - r, l = a - n; if (r < o && n < a) { const d = e.width * e.height, u = t.width * t.height, h = s * l, f = h / (d + u - h); return Number(f.toFixed(4)); } return 0; } const Cr = (t) => { let { collisionRect: e, droppableRects: n, droppableContainers: r } = t; const o = []; for (const a of r) { const { id: s } = a, l = n.get(s); if (l) { const d = Dr(l, e); d > 0 && o.push({ id: s, data: { droppableContainer: a, value: d } }); } } return o.sort(Nr); }; function Tr(t, e, n) { return { ...t, scaleX: e && n ? e.width / n.width : 1, scaleY: e && n ? e.height / n.height : 1 }; } function kn(t, e) { return t && e ? { x: t.left - e.left, y: t.top - e.top } : De; } function kr(t) { return function(n) { for (var r = arguments.length, o = new Array(r > 1 ? r - 1 : 0), a = 1; a < r; a++) o[a - 1] = arguments[a]; return o.reduce((s, l) => ({ ...s, top: s.top + t * l.y, bottom: s.bottom + t * l.y, left: s.left + t * l.x, right: s.right + t * l.x }), { ...n }); }; } const Sr = /* @__PURE__ */ kr(1); function Sn(t) { if (t.startsWith("matrix3d(")) { const e = t.slice(9, -1).split(/, /); return { x: +e[12], y: +e[13], scaleX: +e[0], scaleY: +e[5] }; } else if (t.startsWith("matrix(")) { const e = t.slice(7, -1).split(/, /); return { x: +e[4], y: +e[5], scaleX: +e[0], scaleY: +e[3] }; } return null; } function xr(t, e, n) { const r = Sn(e); if (!r) return t; const { scaleX: o, scaleY: a, x: s, y: l } = r, d = t.left - s - (1 - o) * parseFloat(n), u = t.top - l - (1 - a) * parseFloat(n.slice(n.indexOf(" ") + 1)), h = o ? t.width / o : t.width, f = a ? t.height / a : t.height; return { width: h, height: f, top: u, right: d + h, bottom: u + f, left: d }; } const Mr = { ignoreTransform: !1 }; function ut(t, e) { e === void 0 && (e = Mr); let n = t.getBoundingClientRect(); if (e.ignoreTransform) { const { transform: u, transformOrigin: h } = ue(t).getComputedStyle(t); u && (n = xr(n, u, h)); } const { top: r, left: o, width: a, height: s, bottom: l, right: d } = n; return { top: r, left: o, width: a, height: s, bottom: l, right: d }; } function cn(t) { return ut(t, { ignoreTransform: !0 }); } function Er(t) { const e = t.innerWidth, n = t.innerHeight; return { top: 0, left: 0, right: e, bottom: n, width: e, height: n }; } function Ar(t, e) { return e === void 0 && (e = ue(t).getComputedStyle(t)), e.position === "fixed"; } function Lr(t, e) { e === void 0 && (e = ue(t).getComputedStyle(t)); const n = /(auto|scroll|overlay)/; return ["overflow", "overflowX", "overflowY"].some((o) => { const a = e[o]; return typeof a == "string" ? n.test(a) : !1; }); } function qt(t, e) { const n = []; function r(o) { if (e != null && n.length >= e || !o) return n; if (Vt(o) && o.scrollingElement != null && !n.includes(o.scrollingElement)) return n.push(o.scrollingElement), n; if (!ct(o) || Dn(o) || n.includes(o)) return n; const a = ue(t).getComputedStyle(o); return o !== t && Lr(o, a) && n.push(o), Ar(o, a) ? n : r(o.parentNode); } return t ? r(t) : n; } function xn(t) { const [e] = qt(t, 1); return e ?? null; } function Bt(t) { return !kt || !t ? null : Ke(t) ? t : Jt(t) ? Vt(t) || t === Ue(t).scrollingElement ? window : ct(t) ? t : null : null; } function Mn(t) { return Ke(t) ? t.scrollX : t.scrollLeft; } function En(t) { return Ke(t) ? t.scrollY : t.scrollTop; } function Pt(t) { return { x: Mn(t), y: En(t) }; } var ae; (function(t) { t[t.Forward = 1] = "Forward", t[t.Backward = -1] = "Backward"; })(ae || (ae = {})); function An(t) { return !kt || !t ? !1 : t === document.scrollingElement; } function Ln(t) { const e = { x: 0, y: 0 }, n = An(t) ? { height: window.innerHeight, width: window.innerWidth } : { height: t.clientHeight, width: t.clientWidth }, r = { x: t.scrollWidth - n.width, y: t.scrollHeight - n.height }, o = t.scrollTop <= e.y, a = t.scrollLeft <= e.x, s = t.scrollTop >= r.y, l = t.scrollLeft >= r.x; return { isTop: o, isLeft: a, isBottom: s, isRight: l, maxScroll: r, minScroll: e }; } const Rr = { x: 0.2, y: 0.2 }; function Ir(t, e, n, r, o) { let { top: a, left: s, right: l, bottom: d } = n; r === void 0 && (r = 10), o === void 0 && (o = Rr); const { isTop: u, isBottom: h, isLeft: f, isRight: m } = Ln(t), y = { x: 0, y: 0 }, v = { x: 0, y: 0 }, b = { height: e.height * o.y, width: e.width * o.x }; return !u && a <= e.top + b.height ? (y.y = ae.Backward, v.y = r * Math.abs((e.top + b.height - a) / b.height)) : !h && d >= e.bottom - b.height && (y.y = ae.Forward, v.y = r * Math.abs((e.bottom - b.height - d) / b.height)), !m && l >= e.right - b.width ? (y.x = ae.Forward, v.x = r * Math.abs((e.right - b.width - l) / b.width)) : !f && s <= e.left + b.width && (y.x = ae.Backward, v.x = r * Math.abs((e.left + b.width - s) / b.width)), { direction: y, speed: v }; } function $r(t) { if (t === document.scrollingElement) { const { innerWidth: a, innerHeight: s } = window; return { top: 0, left: 0, right: a, bottom: s, width: a, height: s }; } const { top: e, left: n, right: r, bottom: o } = t.getBoundingClientRect(); return { top: e, left: n, right: r, bottom: o, width: t.clientWidth, height: t.clientHeight }; } function Rn(t) { return t.reduce((e, n) => qe(e, Pt(n)), De); } function Or(t) { return t.reduce((e, n) => e + Mn(n), 0); } function jr(t) { return t.reduce((e, n) => e + En(n), 0); } function In(t, e) { if (e === void 0 && (e = ut), !t) return; const { top: n, left: r, bottom: o, right: a } = e(t); xn(t) && (o <= 0 || a <= 0 || n >= window.innerHeight || r >= window.innerWidth) && t.scrollIntoView({ block: "center", inline: "center" }); } const Br = [["x", ["left", "right"], Or], ["y", ["top", "bottom"], jr]]; class Kt { constructor(e, n) { 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 r = qt(n), o = Rn(r); this.rect = { ...e }, this.width = e.width, this.height = e.height; for (const [a, s, l] of Br) for (const d of s) Object.defineProperty(this, d, { get: () => { const u = l(r), h = o[a] - u; return this.rect[d] + h; }, enumerable: !0 }); Object.defineProperty(this, "rect", { enumerable: !1 }); } } class et { constructor(e) { this.target = void 0, this.listeners = [], this.removeAll = () => { this.listeners.forEach((n) => { var r; return (r = this.target) == null ? void 0 : r.removeEventListener(...n); }); }, this.target = e; } add(e, n, r) { var o; (o = this.target) == null || o.addEventListener(e, n, r), this.listeners.push([e, n, r]); } } function Fr(t) { const { EventTarget: e } = ue(t); return t instanceof e ? t : Ue(t); } function Ft(t, e) { const n = Math.abs(t.x), r = Math.abs(t.y); return typeof e == "number" ? Math.sqrt(n ** 2 + r ** 2) > e : "x" in e && "y" in e ? n > e.x && r > e.y : "x" in e ? n > e.x : "y" in e ? r > e.y : !1; } var ye; (function(t) { t.Click = "click", t.DragStart = "dragstart", t.Keydown = "keydown", t.ContextMenu = "contextmenu", t.Resize = "resize", t.SelectionChange = "selectionchange", t.VisibilityChange = "visibilitychange"; })(ye || (ye = {})); function dn(t) { t.preventDefault(); } function zr(t) { t.stopPropagation(); } var _; (function(t) { t.Space = "Space", t.Down = "ArrowDown", t.Right = "ArrowRight", t.Left = "ArrowLeft", t.Up = "ArrowUp", t.Esc = "Escape", t.Enter = "Enter", t.Tab = "Tab"; })(_ || (_ = {})); const $n = { start: [_.Space, _.Enter], cancel: [_.Esc], end: [_.Space, _.Enter, _.Tab] }, Pr = (t, e) => { let { currentCoordinates: n } = e; switch (t.code) { case _.Right: return { ...n, x: n.x + 25 }; case _.Left: return { ...n, x: n.x - 25 }; case _.Down: return { ...n, y: n.y + 25 }; case _.Up: return { ...n, y: n.y - 25 }; } }; class Ut { constructor(e) { this.props = void 0, this.autoScrollEnabled = !1, this.referenceCoordinates = void 0, this.listeners = void 0, this.windowListeners = void 0, this.props = e; const { event: { target: n } } = e; this.props = e, this.listeners = new et(Ue(n)), this.windowListeners = new et(ue(n)), this.handleKeyDown = this.handleKeyDown.bind(this), this.handleCancel = this.handleCancel.bind(this), this.attach(); } attach() { this.handleStart(), this.windowListeners.add(ye.Resize, this.handleCancel), this.windowListeners.add(ye.VisibilityChange, this.handleCancel), setTimeout(() => this.listeners.add(ye.Keydown, this.handleKeyDown)); } handleStart() { const { activeNode: e, onStart: n } = this.props, r = e.node.current; r && In(r), n(De); } handleKeyDown(e) { if (Yt(e)) { const { active: n, context: r, options: o } = this.props, { keyboardCodes: a = $n, coordinateGetter: s = Pr, scrollBehavior: l = "smooth" } = o, { code: d } = e; if (a.end.includes(d)) { this.handleEnd(e); return; } if (a.cancel.includes(d)) { this.handleCancel(e); return; } const { collisionRect: u } = r.current, h = u ? { x: u.left, y: u.top } : De; this.referenceCoordinates || (this.referenceCoordinates = h); const f = s(e, { active: n, context: r.current, currentCoordinates: h }); if (f) { const m = Nt(f, h), y = { x: 0, y: 0 }, { scrollableAncestors: v } = r.current; for (const b of v) { const N = e.code, { isTop: k, isRight: S, isLeft: D, isBottom: B, maxScroll: I, minScroll: j } = Ln(b), w = $r(b), R = { x: Math.min(N === _.Right ? w.right - w.width / 2 : w.right, Math.max(N === _.Right ? w.left : w.left + w.width / 2, f.x)), y: Math.min(N === _.Down ? w.bottom - w.height / 2 : w.bottom, Math.max(N === _.Down ? w.top : w.top + w.height / 2, f.y)) }, F = N === _.Right && !S || N === _.Left && !D, z = N === _.Down && !B || N === _.Up && !k; if (F && R.x !== f.x) { const J = b.scrollLeft + m.x, V = N === _.Right && J <= I.x || N === _.Left && J >= j.x; if (V && !m.y) { b.scrollTo({ left: J, behavior: l }); return; } V ? y.x = b.scrollLeft - J : y.x = N === _.Right ? b.scrollLeft - I.x : b.scrollLeft - j.x, y.x && b.scrollBy({ left: -y.x, behavior: l }); break; } else if (z && R.y !== f.y) { const J = b.scrollTop + m.y, V = N === _.Down && J <= I.y || N === _.Up && J >= j.y; if (V && !m.x) { b.scrollTo({ top: J, behavior: l }); return; } V ? y.y = b.scrollTop - J : y.y = N === _.Down ? b.scrollTop - I.y : b.scrollTop - j.y, y.y && b.scrollBy({ top: -y.y, behavior: l }); break; } } this.handleMove(e, qe(Nt(f, this.referenceCoordinates), y)); } } } handleMove(e, n) { const { onMove: r } = this.props; e.preventDefault(), r(n); } handleEnd(e) { const { onEnd: n } = this.props; e.preventDefault(), this.detach(), n(); } handleCancel(e) { const { onCancel: n } = this.props; e.preventDefault(), this.detach(), n(); } detach() { this.listeners.removeAll(), this.windowListeners.removeAll(); } } Ut.activators = [{ eventName: "onKeyDown", handler: (t, e, n) => { let { keyboardCodes: r = $n, onActivation: o } = e, { active: a } = n; const { code: s } = t.nativeEvent; if (r.start.includes(s)) { const l = a.activatorNode.current; return l && t.target !== l ? !1 : (t.preventDefault(), o?.({ event: t.nativeEvent }), !0); } return !1; } }]; function un(t) { return !!(t && "distance" in t); } function hn(t) { return !!(t && "delay" in t); } class Xt { constructor(e, n, r) { var o; r === void 0 && (r = Fr(e.event.target)), this.props = void 0, this.events = void 0, this.autoScrollEnabled = !0, this.document = void 0, this.activated = !1, this.initialCoordinates = void 0, this.timeoutId = null, this.listeners = void 0, this.documentListeners = void 0, this.windowListeners = void 0, this.props = e, this.events = n; const { event: a } = e, { target: s } = a; this.props = e, this.events = n, this.document = Ue(s), this.documentListeners = new et(this.document), this.listeners = new et(r), this.windowListeners = new et(ue(s)), this.initialCoordinates = (o = wt(a)) != null ? o : De, 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: e, props: { options: { activationConstraint: n, bypassActivationConstraint: r } } } = this; if (this.listeners.add(e.move.name, this.handleMove, { passive: !1 }), this.listeners.add(e.end.name, this.handleEnd), e.cancel && this.listeners.add(e.cancel.name, this.handleCancel), this.windowListeners.add(ye.Resize, this.handleCancel), this.windowListeners.add(ye.DragStart, dn), this.windowListeners.add(ye.VisibilityChange, this.handleCancel), this.windowListeners.add(ye.ContextMenu, dn), this.documentListeners.add(ye.Keydown, this.handleKeydown), n) { if (r != null && r({ event: this.props.event, activeNode: this.props.activeNode, options: this.props.options })) return this.handleStart(); if (hn(n)) { this.timeoutId = setTimeout(this.handleStart, n.delay), this.handlePending(n); return; } if (un(n)) { this.handlePending(n); return; } } this.handleStart(); } detach() { this.listeners.removeAll(), this.windowListeners.removeAll(), setTimeout(this.documentListeners.removeAll, 50), this.timeoutId !== null && (clearTimeout(this.timeoutId), this.timeoutId = null); } handlePending(e, n) { const { active: r, onPending: o } = this.props; o(r, e, this.initialCoordinates, n); } handleStart() { const { initialCoordinates: e } = this, { onStart: n } = this.props; e && (this.activated = !0, this.documentListeners.add(ye.Click, zr, { capture: !0 }), this.removeTextSelection(), this.documentListeners.add(ye.SelectionChange, this.removeTextSelection), n(e)); } handleMove(e) { var n; const { activated: r, initialCoordinates: o, props: a } = this, { onMove: s, options: { activationConstraint: l } } = a; if (!o) return; const d = (n = wt(e)) != null ? n : De, u = Nt(o, d); if (!r && l) { if (un(l)) { if (l.tolerance != null && Ft(u, l.tolerance)) return this.handleCancel(); if (Ft(u, l.distance)) return this.handleStart(); } if (hn(l) && Ft(u, l.tolerance)) return this.handleCancel(); this.handlePending(l, u); return; } e.cancelable && e.preventDefault(), s(d); } handleEnd() { const { onAbort: e, onEnd: n } = this.props; this.detach(), this.activated || e(this.props.active), n(); } handleCancel() { const { onAbort: e, onCancel: n } = this.props; this.detach(), this.activated || e(this.props.active), n(); } handleKeydown(e) { e.code === _.Esc && this.handleCancel(); } removeTextSelection() { var e; (e = this.document.getSelection()) == null || e.removeAllRanges(); } } const Hr = { cancel: { name: "pointercancel" }, move: { name: "pointermove" }, end: { name: "pointerup" } }; class Gt extends Xt { constructor(e) { const { event: n } = e, r = Ue(n.target); super(e, Hr, r); } } Gt.activators = [{ eventName: "onPointerDown", handler: (t, e) => { let { nativeEvent: n } = t, { onActivation: r } = e; return !n.isPrimary || n.button !== 0 ? !1 : (r?.({ event: n }), !0); } }]; const Wr = { move: { name: "mousemove" }, end: { name: "mouseup" } }; var Ht; (function(t) { t[t.RightClick = 2] = "RightClick"; })(Ht || (Ht = {})); class Jr extends Xt { constructor(e) { super(e, Wr, Ue(e.event.target)); } } Jr.activators = [{ eventName: "onMouseDown", handler: (t, e) => { let { nativeEvent: n } = t, { onActivation: r } = e; return n.button === Ht.RightClick ? !1 : (r?.({ event: n }), !0); } }]; const zt = { cancel: { name: "touchcancel" }, move: { name: "touchmove" }, end: { name: "touchend" } }; class On extends Xt { constructor(e) { super(e, zt); } static setup() { return window.addEventListener(zt.move.name, e, { capture: !1, passive: !1 }), function() { window.removeEventListener(zt.move.name, e); }; function e() { } } } On.activators = [{ eventName: "onTouchStart", handler: (t, e) => { let { nativeEvent: n } = t, { onActivation: r } = e; const { touches: o } = n; return o.length > 1 ? !1 : (r?.({ event: n }), !0); } }]; var tt; (function(t) { t[t.Pointer = 0] = "Pointer", t[t.DraggableRect = 1] = "DraggableRect"; })(tt || (tt = {})); var Ct; (function(t) { t[t.TreeOrder = 0] = "TreeOrder", t[t.ReversedTreeOrder = 1] = "ReversedTreeOrder"; })(Ct || (Ct = {})); function Vr(t) { let { acceleration: e, activator: n = tt.Pointer, canScroll: r, draggingRect: o, enabled: a, interval: s = 5, order: l = Ct.TreeOrder, pointerCoordinates: d, scrollableAncestors: u, scrollableAncestorRects: h, delta: f, threshold: m } = t; const y = qr({ delta: f, disabled: !a }), [v, b] = or(), N = Q({ x: 0, y: 0 }), k = Q({ x: 0, y: 0 }), S = L(() => { switch (n) { case tt.Pointer: return d ? { top: d.y, bottom: d.y, left: d.x, right: d.x } : null; case tt.DraggableRect: return o; } }, [n, o, d]), D = Q(null), B = x(() => { const j = D.current; if (!j) return; const w = N.current.x * k.current.x, R = N.current.y * k.current.y; j.scrollBy(w, R); }, []), I = L(() => l === Ct.TreeOrder ? [...u].reverse() : u, [l, u]); q( () => { if (!a || !u.length || !S) { b(); return; } for (const j of I) { if (r?.(j) === !1) continue; const w = u.indexOf(j), R = h[w]; if (!R) continue; const { direction: F, speed: z } = Ir(j, R, S, e, m); for (const J of ["x", "y"]) y[J][F[J]] || (z[J] = 0, F[J] = 0); if (z.x > 0 || z.y > 0) { b(), D.current = j, v(B, s), N.current = z, k.current = F; return; } } N.current = { x: 0, y: 0 }, k.current = { x: 0, y: 0 }, b(); }, // eslint-disable-next-line react-hooks/exhaustive-deps [ e, B, r, b, a, s, // eslint-disable-next-line react-hooks/exhaustive-deps JSON.stringify(S), // eslint-disable-next-line react-hooks/exhaustive-deps JSON.stringify(y), v, u, I, h, // eslint-disable-next-line react-hooks/exhaustive-deps JSON.stringify(m) ] ); } const Yr = { x: { [ae.Backward]: !1, [ae.Forward]: !1 }, y: { [ae.Backward]: !1, [ae.Forward]: !1 } }; function qr(t) { let { delta: e, disabled: n } = t; const r = yt(e); return dt((o) => { if (n || !r || !o) return Yr; const a = { x: Math.sign(e.x - r.x), y: Math.sign(e.y - r.y) }; return { x: { [ae.Backward]: o.x[ae.Backward] || a.x === -1, [ae.Forward]: o.x[ae.Forward] || a.x === 1 }, y: { [ae.Backward]: o.y[ae.Backward] || a.y === -1, [ae.Forward]: o.y[ae.Forward] || a.y === 1 } }; }, [n, e, r]); } function Kr(t, e) { const n = e != null ? t.get(e) : void 0, r = n ? n.node.current : null; return dt((o) => { var a; return e == null ? null : (a = r ?? o) != null ? a : null; }, [r, e]); } function Ur(t, e) { return L(() => t.reduce((n, r) => { const { sensor: o } = r, a = o.activators.map((s) => ({ eventName: s.eventName, handler: e(s.handler, r) })); return [...n, ...a]; }, []), [t, e]); } var st; (function(t) { t[t.Always = 0] = "Always", t[t.BeforeDragging = 1] = "BeforeDragging", t[t.WhileDragging = 2] = "WhileDragging"; })(st || (st = {})); var Wt; (function(t) { t.Optimized = "optimized"; })(Wt || (Wt = {})); const fn = /* @__PURE__ */ new Map(); function Xr(t, e) { let { dragging: n, dependencies: r, config: o } = e; const [a, s] = $(null), { frequency: l, measure: d, strategy: u } = o, h = Q(t), f = N(), m = ot(f), y = x(function(k) { k === void 0 && (k = []), !m.current && s((S) => S === null ? k : S.concat(k.filter((D) => !S.includes(D)))); }, [m]), v = Q(null), b = dt((k) => { if (f && !n) return fn; if (!k || k === fn || h.current !== t || a != null) { const S = /* @__PURE__ */ new Map(); for (let D of t) { if (!D) continue; if (a && a.length > 0 && !a.includes(D.id) && D.rect.current) { S.set(D.id, D.rect.current); continue; } const B = D.node.current, I = B ? new Kt(d(B), B) : null; D.rect.current = I, I && S.set(D.id, I); } return S; } return k; }, [t, a, n, f, d]); return q(() => { h.current = t; }, [t]), q( () => { f || y(); }, // eslint-disable-next-line react-hooks/exhaustive-deps [n, f] ), q( () => { a && a.length > 0 && s(null); }, //eslint-disable-next-line react-hooks/exhaustive-deps [JSON.stringify(a)] ), q( () => { f || typeof l != "number" || v.current !== null || (v.current = setTimeout(() => { y(), v.current = null; }, l)); }, // eslint-disable-next-line react-hooks/exhaustive-deps [l, f, y, ...r] ), { droppableRects: b, measureDroppableContainers: y, measuringScheduled: a != null }; function N() { switch (u) { case st.Always: return !1; case st.BeforeDragging: return n; default: return !n; } } } function _t(t, e) { return dt((n) => t ? n || (typeof e == "function" ? e(t) : t) : null, [e, t]); } function Gr(t, e) { return _t(t, e); } function _r(t) { let { callback: e, disabled: n } = t; const r = St(e), o = L(() => { if (n || typeof window > "u" || typeof window.MutationObserver > "u") return; const { MutationObserver: a } = window; return new a(r); }, [r, n]); return q(() => () => o?.disconnect(), [o]), o; } function Mt(t) { let { callback: e, disabled: n } = t; const r = St(e), o = L( () => { if (n || typeof window > "u" || typeof window.ResizeObserver > "u") return; const { ResizeObserver: a } = window; return new a(r); }, // eslint-disable-next-line react-hooks/exhaustive-deps [n] ); return q(() => () => o?.disconnect(), [o]), o; } function Qr(t) { return new Kt(ut(t), t); } function mn(t, e, n) { e === void 0 && (e = Qr); const [r, o] = $(null); function a() { o((d) => { if (!t) return null; if (t.isConnected === !1) { var u; return (u = d ?? n) != null ? u : null; } const h = e(t); return JSON.stringify(d) === JSON.stringify(h) ? d : h; }); } const s = _r({ callback(d) { if (t) for (const u of d) { const { type: h, target: f } = u; if (h === "childList" && f instanceof HTMLElement && f.contains(t)) { a(); break; } } } }), l = Mt({ callback: a }); return Re(() => { a(), t ? (l?.observe(t), s?.observe(document.body, { childList: !0, subtree: !0 })) : (l?.disconnect(), s?.disconnect()); }, [t]), r; } function Zr(t) { const e = _t(t); return kn(t, e); } const gn = []; function ei(t) { const e = Q(t), n = dt((r) => t ? r && r !== gn && t && e.current && t.parentNode === e.current.parentNode ? r : qt(t) : gn, [t]); return q(() => { e.current = t; }, [t]), n; } function ti(t) { const [e, n] = $(null), r = Q(t), o = x((a) => { const s = Bt(a.target); s && n((l) => l ? (l.set(s, Pt(s)), new Map(l)) : null); }, []); return q(() => { const a = r.current; if (t !== a) { s(a); const l = t.map((d) => { const u = Bt(d); return u ? (u.addEventListener("scroll", o, { passive: !0 }), [u, Pt(u)]) : null; }).filter((d) => d != null); n(l.length ? new Map(l) : null), r.current = t; } return () => { s(t), s(a); }; function s(l) { l.forEach((d) => { const u = Bt(d); u?.removeEventListener("scroll", o); }); } }, [o, t]), L(() => t.length ? e ? Array.from(e.values()).reduce((a, s) => qe(a, s), De) : Rn(t) : De, [t, e]); } function vn(t, e) { e === void 0 && (e = []); const n = Q(null); return q( () => { n.current = null; }, // eslint-disable-next-line react-hooks/exhaustive-deps e ), q(() => { const r = t !== De; r && !n.current && (n.current = t), !r && n.current && (n.current = null); }, [t]), n.current ? Nt(t, n.current) : De; } function ni(t) { q( () => { if (!kt) return; const e = t.map((n) => { let { sensor: r } = n; return r.setup == null ? void 0 : r.setup(); }); return () => { for (const n of e) n?.(); }; }, // TO-DO: Sensors length could theoretically change which would not be a valid dependency // eslint-disable-next-line react-hooks/exhaustive-deps t.map((e) => { let { sensor: n } = e; return n; }) ); } function ri(t, e) { return L(() => t.reduce((n, r) => { let { eventName: o, handler: a } = r; return n[o] = (s) => { a(s, e); }, n; }, {}), [t, e]); } function jn(t) { return L(() => t ? Er(t) : null, [t]); } const pn = []; function ii(t, e) { e === void 0 && (e = ut); const [n] = t, r = jn(n ? ue(n) : null), [o, a] = $(pn); function s() { a(() => t.length ? t.map((d) => An(d) ? r : new Kt(e(d), d)) : pn); } const l = Mt({ callback: s }); return Re(() => { l?.disconnect(), s(), t.forEach((d) => l?.observe(d)); }, [t]), o; } function Bn(t) { if (!t) return null; if (t.children.length > 1) return t; const e = t.children[0]; return ct(e) ? e : t; } function oi(t) { let { measure: e } = t; const [n, r] = $(null), o = x((u) => { for (const { target: h } of u) if (ct(h)) { r((f) => { const m = e(h); return f ? { ...f, width: m.width, height: m.height } : m; }); break; } }, [e]), a = Mt({ callback: o }), s = x((u) => { const h = Bn(u); a?.disconnect(), h && a?.observe(h), r(h ? e(h) : null); }, [e, a]), [l, d] = bt(s); return L(() => ({ nodeRef: l, rect: n, setRef: d }), [n, l, d]); } const ai = [{ sensor: Gt, options: {} }, { sensor: Ut, options: {} }], si = { current: {} }, pt = { draggable: { measure: cn }, droppable: { measure: cn, strategy: st.WhileDragging, frequency: Wt.Optimized }, dragOverlay: { measure: ut } }; class nt extends Map { get(e) { var n; return e != null && (n = super.get(e)) != null ? n : void 0; } toArray() { return Array.from(this.values()); } getEnabled() { return this.toArray().filter((e) => { let { disabled: n } = e; return !n; }); } getNodeFor(e) { var n, r; return (n = (r = this.get(e)) == null ? void 0 : r.node.current) != null ? n : void 0; } } const li = { activatorEvent: null, active: null, activeNode: null, activeNodeRect: null, collisions: null, containerNodeRect: null, draggableNodes: /* @__PURE__ */ new Map(), droppableRects: /* @__PURE__ */ new Map(), droppableContainers: /* @__PURE__ */ new nt(), over: null, dragOverlay: { nodeRef: { current: null }, rect: null, setRef: Dt }, scrollableAncestors: [], scrollableAncestorRects: [], measuringConfiguration: pt, measureDroppableContainers: Dt, windowRect: null, measuringScheduled: !1 }, Fn = { activatorEvent: null, activators: [], active: null, activeNodeRect: null, ariaDescribedById: { draggable: "" }, dispatch: Dt, draggableNodes: /* @__PURE__ */ new Map(), over: null, measureDroppableContainers: Dt }, ht = /* @__PURE__ */ lt(Fn), zn = /* @__PURE__ */ lt(li); function ci() { return { draggable: { active: null, initialCoordinates: { x: 0, y: 0 }, nodes: /* @__PURE__ */ new Map(), translate: { x: 0, y: 0 } }, droppable: { containers: new nt() } }; } function di(t, e) { switch (e.type) { case ie.DragStart: return { ...t, draggable: { ...t.draggable, initialCoordinates: e.initialCoordinates, active: e.active } }; case ie.DragMove: return t.draggable.active == null ? t : { ...t, draggable: { ...t.draggable, translate: { x: e.coordinates.x - t.draggable.initialCoordinates.x, y: e.coordinates.y - t.draggable.initialCoordinates.y } } }; case ie.DragEnd: case ie.DragCancel: return { ...t, draggable: { ...t.draggable, active: null, initialCoordinates: { x: 0, y: 0 }, translate: { x: 0, y: 0 } } }; case ie.RegisterDroppable: { const { element: n } = e, { id: r } = n, o = new nt(t.droppable.containers); return o.set(r, n), { ...t, droppable: { ...t.droppable, containers: o } }; } case ie.SetDroppableDisabled: { const { id: n, key: r, disabled: o } = e, a = t.droppable.containers.get(n); if (!a || r !== a.key) return t; const s = new nt(t.droppable.containers); return s.set(n, { ...a, disabled: o }), { ...t, droppable: { ...t.droppable, containers: s } }; } case ie.UnregisterDroppable: { const { id: n, key: r } = e, o = t.droppable.containers.get(n); if (!o || r !== o.key) return t; const a = new nt(t.droppable.containers); return a.delete(n), { ...t, droppable: { ...t.droppable, containers: a } }; } default: return t; } } function ui(t) { let { disabled: e } = t; const { active: n, activatorEvent: r, draggableNodes: o } = Pe(ht), a = yt(r), s = yt(n?.id); return q(() => { if (!e && !r && a && s != null) { if (!Yt(a) || document.activeElement === a.target) return; const l = o.get(s); if (!l) return; const { activatorNode: d, node: u } = l; if (!d.current && !u.current) return; requestAnimationFrame(() => { for (const h of [d.current, u.current]) { if (!h) continue; const f = lr(h); if (f) { f.focus(); break; } } }); } }, [r, e, o, s, a]), null; } function Pn(t, e) { let { transform: n, ...r } = e; return t != null && t.length ? t.reduce((o, a) => a({ transform: o, ...r }), n) : n; } function hi(t) { return L( () => ({ draggable: { ...pt.draggable, ...t?.draggable }, droppable: { ...pt.droppable, ...t?.droppable }, dragOverlay: { ...pt.dragOverlay, ...t?.dragOverlay } }), // eslint-disable-next-line react-hooks/exhaustive-deps [t?.draggable, t?.droppable, t?.dragOverlay] ); } function fi(t) { let { activeNode: e, measure: n, initialRect: r, config: o = !0 } = t; const a = Q(!1), { x: s, y: l } = typeof o == "boolean" ? { x: o, y: o } : o; Re(() => { if (!s && !l || !e) { a.current = !1; return; } if (a.current || !r) return; const u = e?.node.current; if (!u || u.isConnected === !1) return; const h = n(u), f = kn(h, r); if (s || (f.x = 0), l || (f.y = 0), a.current = !0, Math.abs(f.x) > 0 || Math.abs(f.y) > 0) { const m = xn(u); m && m.scrollBy({ top: f.y, left: f.x }); } }, [e, s, l, r, n]); } const Et = /* @__PURE__ */ lt({ ...De, scaleX: 1, scaleY: 1 }); var Fe; (function(t) { t[t.Uninitialized = 0] = "Uninitialized", t[t.Initializing = 1] = "Initializing", t[t.Initialized = 2] = "Initialized"; })(Fe || (Fe = {})); const mi = /* @__PURE__ */ Ne(function(e) { var n, r, o, a; let { id: s, accessibility: l, autoScroll: d = !0, children: u, sensors: h = ai, collisionDetection: f = Cr, measuring: m, modifiers: y, ...v } = e; const b = tr(di, void 0, ci), [N, k] = b, [S, D] = mr(), [B, I] = $(Fe.Uninitialized), j = B === Fe.Initialized, { draggable: { active: w, nodes: R, translate: F }, droppable: { containers: z } } = N, J = w != null ? R.get(w) : null, V = Q({ initial: null, translated: null }), U = L(() => { var de; return w != null ? { id: w, // It's possible for the active node to unmount while dragging data: (de = J?.data) != null ? de : si, rect: V } : null; }, [w, J]), G = Q(null), [le, T] = $(null), [H, oe] = $(null), Z = ot(v, Object.values(v)), ce = xt("DndDescribedBy", s), ne = L(() => z.getEnabled(), [z]), C = hi(m), { droppableRects: P, measureDroppableContainers: g, measuringScheduled: M } = Xr(ne, { dragging: j, dependencies: [F.x, F.y], config: C.droppable }), O = Kr(R, w), Y = L(() => H ? wt(H) : null, [H]), p = Qn(), A = Gr(O, C.draggable.measure); fi({ activeNode: w != null ? R.get(w) : null, config: p.layoutShiftCompensation, initialRect: A, measure: C.draggable.measure }); const K = mn(O, C.draggable.measure, A), ee = mn(O ? O.parentElement : null), re = Q({ activatorEvent: null, active: null, activeNode: O, collisionRect: null, collisions: null, droppableRects: P, draggableNodes: R, draggingNode: null, draggingNodeRect: null, droppableContainers: z, over: null, scrollableAncestors: [], scrollAdjustedTranslate: null }), pe = z.getNodeFor((n = re.current.over) == null ? void 0 : n.id), we = oi({ measure: C.dragOverlay.measure }), Ce = (r = we.nodeRef.current) != null ? r : O, Te = j ? (o = we.rect) != null ? o : K : null, Me = !!(we.nodeRef.current && we.rect), Xe = Zr(Me ? null : K), Ge = jn(Ce ? ue(Ce) : null), ke = ei(j ? pe ?? O : null), He = ii(ke), We = Pn(y, { transform: { x: F.x - Xe.x, y: F.y - Xe.y, scaleX: 1, scaleY: 1 }, activatorEvent: H, active: U, activeNodeRect: K, containerNodeRect: ee, draggingNodeRect: Te, over: re.current.over, overlayNodeRect: we.rect, scrollableAncestors: ke, scrollableAncestorRects: He, windowRect: Ge }), mt = Y ? qe(Y, F) : null, gt = ti(ke), Lt = vn(gt), Je = vn(gt, [K]), Ee = qe(We, Lt), $e = Te ? Sr(Te, We) : null, E = U && $e ? f({ active: U, collisionRect: $e, droppableRects: P, droppableContainers: ne, pointerCoordinates: mt }) : null, W = wr(E, "id"), [X, Ae] = $(null), Ve = Me ? We : qe(We, Je), Rt = Tr(Ve, (a = X?.rect) != null ? a : null, K), It = Q(null), an = x( (de, fe) => { let { sensor: me, options: Oe } = fe; if (G.current == null) return; const be = R.get(G.current); if (!be) return; const ge = de.nativeEvent, Se = new me({ active: G.current, activeNode: be, event: ge, options: Oe, // Sensors need to be instantiated with refs for arguments that change over time // otherwise they are frozen in time with the stale arguments context: re, onAbort(se) { if (!R.get(se)) return; const { onDragAbort: xe } = Z.current, Le = { id: se }; xe?.(Le), S({ type: "onDragAbort", event: Le }); }, onPending(se, je, xe, Le) { if (!R.get(se)) return; const { onDragPending: Qe } = Z.current, Be = { id: se, constraint: je, initialCoordinates: xe, offset: Le }; Qe?.(Be), S({ type: "onDragPending", event: Be }); }, onStart(se) { const je = G.current; if (je == null) return; const xe = R.get(je); if (!xe) return; const { onDragStart: Le } = Z.current, _e = { activatorEvent: ge, active: { id: je, data: xe.data, rect: V } }; vt(() => { Le?.(_e), I(Fe.Initializing), k({ type: ie.DragStart, initialCoordinates: se, active: je }), S({ type: "onDragStart", event: _e }), T(It.current), oe(ge); }); }, onMove(se) { k({ type: ie.DragMove, coordinates: se