@nivaro/react 0.3.35 → 0.3.37

package/dist/shared/components/layout-editor/dnd/LayoutDndProvider.js

@@ -1,229 +1,416 @@
-import { jsx as C, jsxs as W } from "react/jsx-runtime";
-import { useSensors as tt, useSensor as T, PointerSensor as et, KeyboardSensor as nt, KeyboardCode as D, DndContext as rt, MeasuringStrategy as ot, DragOverlay as st } from "@dnd-kit/core";
-import { getEventCoordinates as it } from "@dnd-kit/utilities";
-import { useState as _, useRef as K, useMemo as B, useCallback as at, createContext as lt, useLayoutEffect as dt, useContext as ct } from "react";
-import { createPortal as ut } from "react-dom";
-import { UNGROUPED_KEY as z } from "../../../lib/layout-ops.js";
-import { targetKey as m } from "../design-context.js";
-import { typedKeyboardCoordinates as ft, nodeData as k } from "./collision.js";
-import { DndStore as pt, DndStoreContext as gt, NO_DND as yt, IDLE as G } from "./node.js";
-import { railAwareCollision as ht, railDropData as q, copyableGroup as Y } from "./rail-drop.js";
-import { dropLabel as bt, landsOnCanvas as j, placeAfterDrop as mt, orderAfterDrop as Ct } from "./order.js";
-const F = lt(yt);
-function Gt() {
-  return ct(F);
+import { jsx as S, jsxs as ae } from "react/jsx-runtime";
+import { useSensors as Ue, useSensor as te, TouchSensor as _e, KeyboardSensor as ve, KeyboardCode as H, DndContext as Be, MeasuringStrategy as je, DragOverlay as He } from "@dnd-kit/core";
+import { getEventCoordinates as ye } from "@dnd-kit/utilities";
+import { Plus as Ge } from "lucide-react";
+import { useState as I, useRef as E, useMemo as he, useCallback as G, useEffect as qe, createContext as Ye, useSyncExternalStore as be, useLayoutEffect as ze, useContext as Ve } from "react";
+import { createPortal as ne } from "react-dom";
+import { UNGROUPED_KEY as Ee } from "../../../lib/layout-ops.js";
+import { targetKey as P } from "../design-context.js";
+import { mergePlan as Fe, mergeBlocked as Xe } from "../section-structure.js";
+import { typedKeyboardCoordinates as Ze, nodeData as L, dndRole as we } from "./collision.js";
+import { mergeAwareCollision as Je, mergeIndicatorStyle as Qe } from "./merge-drop.js";
+import { manyLabel as ke, carriedTargets as We, dropMany as et, copyAfterDrop as tt } from "./multi-drop.js";
+import { DndStore as nt, DndStoreContext as rt, NO_DND as ot, IDLE as Ce } from "./node.js";
+import { landsOnCanvas as Se, placeAfterDrop as at, orderAfterDrop as st, dropLabel as lt } from "./order.js";
+import { railDropData as De, copyableGroup as xe, railAwareCollision as it } from "./rail-drop.js";
+import { MousePointerSensor as ct, MOUSE_ACTIVATION as dt, TOUCH_ACTIVATION as ut } from "./sensors.js";
+import { TrashZone as pt } from "./TrashZone.js";
+import { trashAwareCollision as gt, TRASH_DROP_ID as se, trashDropData as F, trashPlan as re, trashPlanMany as $e } from "./trash-drop.js";
+import { UndoChip as ft } from "./UndoChip.js";
+const Oe = Ye(ot);
+function Ht() {
+  return Ve(Oe);
 }
-const A = 3, P = 20;
-function St(u, t, e, p) {
-  var o;
-  if (u.body) {
-    const S = e - 2 * P, b = p && S > 0 ? Math.min(p, S) : void 0, x = b ? { left: P, width: b } : { left: P, right: P };
-    return u.side === "before" ? { top: (((o = t.headerHeight) == null ? void 0 : o.call(t)) ?? 0) + 4, height: A, ...x } : { bottom: 8, height: A, ...x };
+const X = 3, Z = 20;
+function mt(g, n, o, d) {
+  var y, R;
+  if (g.merge) return Qe(((y = n.headerHeight) == null ? void 0 : y.call(n)) ?? 0);
+  if (g.body) {
+    const O = o - 2 * Z, r = d && O > 0 ? Math.min(d, O) : void 0, M = r ? { left: Z, width: r } : { left: Z, right: Z };
+    return g.side === "before" ? { top: (((R = n.headerHeight) == null ? void 0 : R.call(n)) ?? 0) + 4, height: X, ...M } : { bottom: 8, height: X, ...M };
   }
-  if (u.axis === "x")
-    return { top: 0, bottom: 0, width: A, [u.side === "before" ? "left" : "right"]: -4 };
-  const y = t.role.kind === "item" && p && e ? Math.min(p, e) : void 0;
+  if (g.axis === "x")
+    return { top: 0, bottom: 0, width: X, [g.side === "before" ? "left" : "right"]: -4 };
+  const m = n.role.kind === "item" && d && o ? Math.min(d, o) : void 0;
   return {
-    [u.side === "before" ? "top" : "bottom"]: -6,
-    height: A,
+    [g.side === "before" ? "top" : "bottom"]: -6,
+    height: X,
     left: 0,
-    ...y ? { width: y } : { right: 0 }
+    ...m ? { width: m } : { right: 0 }
   };
 }
-const wt = (u, t) => {
-  var e, p;
-  return ((p = (e = (u ?? []).find((y) => y.id === t)) == null ? void 0 : e.data) == null ? void 0 : p.hint) ?? null;
+const yt = (g, n) => {
+  var o, d;
+  return ((d = (o = (g ?? []).find((m) => m.id === n)) == null ? void 0 : o.data) == null ? void 0 : d.hint) ?? null;
 };
-function Dt(u) {
-  for (let t = u; t && t !== document.documentElement; ) {
-    const e = getComputedStyle(t);
-    if (e.transform && e.transform !== "none" || e.perspective && e.perspective !== "none" || e.filter && e.filter !== "none" || /paint|layout|strict|content/.test(e.contain ?? "") || /transform|perspective|filter/.test(e.willChange ?? "")) {
-      const y = t.getBoundingClientRect();
-      return { x: y.left + t.clientLeft - t.scrollLeft, y: y.top + t.clientTop - t.scrollTop };
+function Ae(g) {
+  for (let n = g; n && n !== document.documentElement; ) {
+    const o = getComputedStyle(n);
+    if (o.transform && o.transform !== "none" || o.perspective && o.perspective !== "none" || o.filter && o.filter !== "none" || /paint|layout|strict|content/.test(o.contain ?? "") || /transform|perspective|filter/.test(o.willChange ?? "")) {
+      const m = n.getBoundingClientRect();
+      return { x: m.left + n.clientLeft - n.scrollLeft, y: m.top + n.clientTop - n.scrollTop };
     }
-    t = t.parentElement;
+    n = n.parentElement;
   }
   return { x: 0, y: 0 };
 }
-function kt(u) {
-  const t = u.cloneNode(!0);
-  for (const e of [t, ...Array.from(t.querySelectorAll("*"))])
-    for (const p of ["data-design-target", "data-selected", "data-drop-slot", "id"])
-      e.removeAttribute(p);
-  if (t.classList.remove("opacity-40"), t.style.clipPath) {
-    t.style.clipPath = "none", t.style.transform = "none", t.style.overflow = "visible", t.style.borderRadius = "0", t.style.height = "100%";
-    for (const e of Array.from(t.querySelectorAll("*")))
-      e.style.clipPath && (e.style.clipPath = "none", e.style.borderRadius = "0");
+function ht(g) {
+  const n = g.cloneNode(!0);
+  for (const o of [n, ...Array.from(n.querySelectorAll("*"))])
+    for (const d of ["data-design-target", "data-selected", "data-drop-slot", "id"])
+      o.removeAttribute(d);
+  if (n.classList.remove("opacity-40"), n.style.clipPath) {
+    n.style.clipPath = "none", n.style.transform = "none", n.style.overflow = "visible", n.style.borderRadius = "0", n.style.height = "100%";
+    for (const o of Array.from(n.querySelectorAll("*")))
+      o.style.clipPath && (o.style.clipPath = "none", o.style.borderRadius = "0");
   }
-  for (const e of Array.from(t.querySelectorAll("[data-design-drop-indicator]"))) e.remove();
-  for (const e of ["role", "tabindex", "aria-describedby", "aria-pressed", "aria-hidden"])
-    t.removeAttribute(e);
-  return t.removeAttribute("data-header-folded"), t.setAttribute("inert", ""), Object.assign(t.style, { margin: "0", width: "100%", opacity: "1", outline: "none" }), t;
+  for (const o of Array.from(n.querySelectorAll("[data-design-drop-indicator]"))) o.remove();
+  for (const o of ["role", "tabindex", "aria-describedby", "aria-pressed", "aria-hidden"])
+    n.removeAttribute(o);
+  return n.removeAttribute("data-header-folded"), n.setAttribute("inert", ""), Object.assign(n.style, { margin: "0", width: "100%", opacity: "1", outline: "none" }), n;
 }
-const R = 320;
-function xt({ node: u }) {
-  const t = K(null);
-  return dt(() => {
-    const e = t.current;
-    if (e)
-      return e.replaceChildren(kt(u)), () => e.replaceChildren();
-  }, [u]), /* @__PURE__ */ C(
+const J = 320;
+function bt({
+  node: g,
+  store: n,
+  count: o
+}) {
+  const d = E(null), m = be(
+    n.subscribe,
+    G(() => n.state.overKey === se, [n]),
+    () => !1
+  ), y = be(
+    n.subscribe,
+    G(() => n.state.copy, [n]),
+    () => !1
+  );
+  ze(() => {
+    const O = d.current;
+    if (O)
+      return O.replaceChildren(ht(g)), () => O.replaceChildren();
+  }, [g]);
+  const R = o > 1 || y ? /* @__PURE__ */ ae(
+    "span",
+    {
+      "data-design-drag-badge": y ? "copy" : "count",
+      className: "absolute -right-2 -top-2 z-10 inline-flex h-6 min-w-6 items-center justify-center gap-0.5 rounded-full bg-nvr-cyan px-1.5 text-[11.5px] font-semibold text-white shadow-md ring-2 ring-white dark:ring-[#0f172a]",
+      children: [
+        y && /* @__PURE__ */ S(Ge, { "aria-hidden": !0, className: "h-3 w-3" }),
+        o > 1 ? o : y ? "Copy" : null
+      ]
+    }
+  ) : null;
+  return /* @__PURE__ */ ae(
     "div",
     {
-      ref: t,
       "aria-hidden": !0,
       "data-design-drag-preview": "",
-      className: "pointer-events-none h-full w-full cursor-grabbing overflow-hidden rounded-lg bg-white shadow-xl ring-1 ring-slate-900/10 dark:bg-card dark:ring-white/10"
+      "data-over-trash": m ? "" : void 0,
+      "data-copy": y ? "" : void 0,
+      style: {
+        transformOrigin: "top left",
+        transform: m ? "scale(0.4)" : void 0,
+        opacity: m ? 0.45 : void 0
+      },
+      className: "pointer-events-none relative h-full w-full cursor-grabbing transition-[transform,opacity] duration-150 ease-out motion-reduce:transition-none",
+      children: [
+        o > 1 && /* @__PURE__ */ S("span", { className: "absolute inset-0 translate-x-1.5 translate-y-1.5 rounded-lg bg-white shadow-lg ring-1 ring-slate-900/10 dark:bg-card dark:ring-white/10" }),
+        /* @__PURE__ */ S(
+          "div",
+          {
+            ref: d,
+            className: "relative h-full w-full overflow-hidden rounded-lg bg-white shadow-xl ring-1 ring-slate-900/10 dark:bg-card dark:ring-white/10"
+          }
+        ),
+        R,
+        y && /* @__PURE__ */ S("style", { children: "*{cursor:copy !important}" })
+      ]
     }
   );
 }
-const L = { kind: "group", key: z }, Et = { droppable: { strategy: ot.Always } }, Ot = {
-  start: [D.Space],
-  cancel: [D.Esc],
-  end: [D.Space, D.Enter, D.Tab]
-}, At = { threshold: { x: 0.08, y: 0.15 }, acceleration: 12 }, Pt = {
-  draggable: "Press space to pick this up. Use the arrow keys to choose where it goes, then space or enter to drop it, or escape to cancel."
+const oe = { kind: "group", key: Ee }, wt = { droppable: { strategy: je.Always } }, kt = {
+  start: [H.Space],
+  cancel: [H.Esc],
+  end: [H.Space, H.Enter, H.Tab]
+}, Ct = {
+  draggable: "Press space to pick this up. Use the arrow keys to choose where it goes, then space or enter to drop it, or escape to cancel. Hold Alt to copy instead of moving."
 };
-function qt({
-  bundle: u,
-  apply: t,
-  onDragActive: e,
-  onDropOnLayout: p,
-  children: y
+function Gt({
+  bundle: g,
+  apply: n,
+  onDragActive: o,
+  onDropOnLayout: d,
+  selection: m,
+  undo: y,
+  warnTrash: R,
+  children: O
 }) {
-  const [o] = _(() => new pt());
-  o.bundle = u;
-  const S = K(t);
-  S.current = t;
-  const b = K(p);
-  b.current = p;
-  const [x] = _(
-    () => ht((n) => !!b.current && Y(o.bundle, n) != null)
-  ), H = B(
+  const [r] = I(() => new nt());
+  r.bundle = g;
+  const M = E(n);
+  M.current = n;
+  const U = E(d);
+  U.current = d;
+  const le = E(m ?? []);
+  le.current = m ?? [];
+  const q = E(R);
+  q.current = R;
+  const Q = E(y);
+  Q.current = y;
+  const h = E([]), [Pe] = I(
+    () => gt(
+      Je(
+        it(
+          (e) => !!U.current && xe(r.bundle, e) != null
+        ),
+        (e, t) => !r.state.copy && e.target.kind === "group" && t.target.kind === "group" && !!r.bundle && Xe(r.bundle, e.target.key, t.target.key) === null
+      ),
+      (e) => re(r.bundle, e) != null
+    )
+  ), [Re] = I(() => ({
+    threshold: { x: 0.08, y: 0.15 },
+    acceleration: 12,
+    canScroll: () => r.state.overKey !== se
+  })), [_, ie] = I(null), [w, W] = I(null), Ke = he(
     () => ({
       draggableProps: () => ({}),
-      isDragging: (n) => o.state.activeKey === m(n),
-      dropSlot: (n) => o.state.overKey === m(n) ? o.state.side : null,
-      dropIndicator: (n) => o.state.overKey === m(n) ? o.state.indicator : null
+      isDragging: (e) => r.isCarried(P(e)),
+      dropSlot: (e) => r.state.overKey === P(e) ? r.state.side : null,
+      dropIndicator: (e) => r.state.overKey === P(e) ? r.state.indicator : null
     }),
-    [o]
-  ), V = tt(
-    T(et, { activationConstraint: { distance: 4 } }),
-    T(nt, {
-      coordinateGetter: ft,
-      keyboardCodes: Ot
+    [r]
+  ), Le = Ue(
+    te(ct, { activationConstraint: dt }),
+    te(_e, { activationConstraint: ut }),
+    te(ve, {
+      coordinateGetter: Ze,
+      keyboardCodes: kt
     })
-  ), [w, M] = _(null), h = at(
-    (n) => {
-      var l, i, c, f;
-      const r = k(n == null ? void 0 : n.data.current);
-      if (!r) return "this";
-      if (r.add) return r.add.label;
-      const d = r.target;
-      if (d.kind === "group")
-        return d.key === "__ungrouped__" ? "Ungrouped fields" : ((i = (l = o.bundle) == null ? void 0 : l.groups.find((g) => g.key === d.key)) == null ? void 0 : i.label) ?? "section";
-      const a = o.nodes.get(m(d));
-      return ((f = (c = a == null ? void 0 : a.querySelector("label, [data-header-label]")) == null ? void 0 : c.textContent) == null ? void 0 : f.trim()) || (d.kind === "slot" ? "panel" : "field");
+  ), [x, ce] = I(null), Y = G(
+    (e) => {
+      var s, c, l, p;
+      if (!e) return "this";
+      if (e.add) return e.add.label;
+      const t = e.target;
+      if (t.kind === "group")
+        return t.key === "__ungrouped__" ? "Ungrouped fields" : ((c = (s = r.bundle) == null ? void 0 : s.groups.find((f) => f.key === t.key)) == null ? void 0 : c.label) ?? "section";
+      const i = r.nodes.get(P(t));
+      return ((p = (l = i == null ? void 0 : i.querySelector("label, [data-header-label]")) == null ? void 0 : l.textContent) == null ? void 0 : p.replace(/\s*\*\s*$/, "").trim()) || (t.kind === "slot" ? "panel" : "field");
     },
-    [o]
-  ), X = B(
+    [r]
+  ), K = G(
+    (e) => Y(L(e == null ? void 0 : e.data.current)),
+    [Y]
+  ), k = G(
+    (e) => h.current.length > 1 ? ke(h.current, "move").replace(/^Move /, "") : K(e),
+    [K]
+  ), Me = he(
     () => ({
-      onDragStart: ({ active: n }) => `Picked up ${h(n)}.`,
-      onDragOver: ({ active: n, over: r }) => r ? `${h(n)} is over ${h(r)}.` : `${h(n)} is not over a place it can go.`,
-      onDragEnd: ({ active: n, over: r }) => r ? `Dropped ${h(n)} by ${h(r)}.` : `Dropped ${h(n)}.`,
-      onDragCancel: ({ active: n }) => `Cancelled. ${h(n)} stays where it was.`
+      onDragStart: ({ active: e }) => `Picked up ${k(e)}.`,
+      onDragOver: ({ active: e, over: t }) => t && F(t.data.current) ? `${k(e)} is over Remove. Drop it to take it off this form.` : t && r.state.merge && r.state.overKey === String(t.id) ? `${k(e)} is over ${K(t)}. Drop it to join them.` : t ? `${k(e)} is over ${K(t)}${r.state.copy ? ". Dropping copies it" : ""}.` : `${k(e)} is not over a place it can go.`,
+      onDragEnd: ({ active: e, over: t }) => t && F(t.data.current) ? `Removed ${k(e)} from this form. Undo brings it back.` : t ? `Dropped ${k(e)} by ${K(t)}.` : `Dropped ${k(e)}.`,
+      onDragCancel: ({ active: e }) => `Cancelled. ${k(e)} stays where it was.`
     }),
-    [h]
-  ), $ = () => {
-    o.set(G), M(null), e == null || e(!1);
-  }, J = ({ active: n, activatorEvent: r }) => {
-    e == null || e(!0);
-    const d = k(n.data.current);
-    if (!d) return;
-    const a = m(d.target);
-    o.set({ ...G, activeKey: a });
-    const s = o.nodes.get(a);
-    if (!s || typeof document > "u") return;
-    const l = s.closest("[role=dialog]") ?? document.body, i = Dt(l), c = s.getBoundingClientRect(), f = it(r), g = f ? f.y - c.top : 0, O = c.height > R && g > R - 32 ? g - R / 2 : 0, v = ({ transform: N }) => ({
-      ...N,
-      x: N.x - i.x,
-      y: N.y - i.y + O
+    [K, k, r]
+  ), N = E(null), z = () => {
+    r.set(Ce), h.current = [], N.current = null, ce(null), ie(null), o == null || o(!1);
+  }, Ne = ({ active: e, activatorEvent: t }) => {
+    var T;
+    o == null || o(!0), W(null);
+    const i = L(e.data.current);
+    if (!i) return;
+    const a = P(i.target), s = r.bundle;
+    h.current = i.add ? [i.target] : We(s, le.current, i.target);
+    const c = h.current.length > 1, l = !i.add && !!(t != null && t.altKey);
+    r.set({
+      ...Ce,
+      activeKey: a,
+      carried: c ? h.current.map(P) : null,
+      copy: l
+    });
+    const p = c ? $e(
+      s,
+      h.current.map((D) => {
+        const j = s ? we(s, D) : null;
+        return j ? { target: D, role: j } : null;
+      })
+    ) : re(s, i);
+    ie(
+      p && s ? {
+        plan: p,
+        name: c ? k(e) : K(e),
+        warning: ((T = q.current) == null ? void 0 : T.call(q, s, p.ops)) ?? null
+      } : null
+    );
+    const f = r.nodes.get(a);
+    if (!f || typeof document > "u") return;
+    const C = f.closest("[role=dialog]") ?? document.body, b = Ae(C), u = f.getBoundingClientRect(), $ = ye(t), A = $ ? $.y - u.top : 0, V = u.height > J && A > J - 32 ? A - J / 2 : 0, B = ({ transform: D }) => ({
+      ...D,
+      x: D.x - b.x,
+      y: D.y - b.y + V
     });
-    M({ node: s, host: l, height: Math.min(c.height, R), shift: v });
-  }, E = K({
+    ce({ node: f, host: C, height: Math.min(u.height, J), shift: B });
+  }, v = E({
     bundle: null,
     map: /* @__PURE__ */ new Map()
-  }), I = (n, r, d) => {
-    const a = k(n.data.current), s = k(r == null ? void 0 : r.data.current), l = wt(d, r == null ? void 0 : r.id), i = o.bundle;
-    if (!a || !s || !l || !i || !r) return null;
-    E.current.bundle !== i && (E.current = { bundle: i, map: /* @__PURE__ */ new Map() });
-    const c = `${n.id}|${r.id}|${l.side}`;
-    let f = E.current.map.get(c);
-    return f || (f = a.add ? mt(i, a.add.field, s.target, l.side, a.add.patch) : Ct(i, a.target, s.target, l.side), j(i, a.target, s.target) && !o.nodes.has(m(L)) && (f = []), E.current.map.set(c, f)), { a, o: s, hint: l, ops: f };
-  }, U = ({ active: n, over: r, collisions: d }) => {
-    var g, O;
-    if (r && q(r.data.current)) {
-      o.set({ overKey: String(r.id), side: null, indicator: null });
+  }), de = (e, t, i) => {
+    const a = L(e.data.current), s = L(t == null ? void 0 : t.data.current), c = yt(i, t == null ? void 0 : t.id), l = r.bundle;
+    if (!a || !s || !c || !l || !t) return null;
+    v.current.bundle !== l && (v.current = { bundle: l, map: /* @__PURE__ */ new Map() });
+    const p = r.state.copy && !a.add ? "copy" : "move", f = h.current.length > 1, C = `${e.id}|${t.id}|${c.side}|${c.merge ? "join" : ""}|${p}|${f ? h.current.length : 1}`;
+    if (v.current.map.has(C)) return v.current.map.get(C) ?? null;
+    let b = [], u = "";
+    if (c.merge && a.target.kind === "group" && s.target.kind === "group") {
+      const A = Fe(l, a.target.key, s.target.key);
+      A.ok && (b = A.ops, u = A.label);
+    } else a.add ? (b = at(l, a.add.field, s.target, c.side, a.add.patch), u = `Add ${a.add.label}`) : f ? (b = et(l, h.current, s.target, c.side, p), u = ke(h.current, p)) : p === "copy" ? (b = tt(l, a.target, s.target, c.side), u = St(l, a.target, Y(a))) : (b = st(l, a.target, s.target, c.side), u = lt(l, a.target), Se(l, a.target, s.target) && !r.nodes.has(P(oe)) && (b = []));
+    const $ = { a, o: s, hint: c, ops: b, label: u };
+    return v.current.map.set(C, $), $;
+  }, ee = (e) => {
+    var u, $;
+    N.current = e;
+    const { active: t, over: i, collisions: a } = e;
+    if (i && F(i.data.current)) {
+      r.set({ overKey: se, side: null, indicator: null, merge: null });
+      return;
+    }
+    if (i && De(i.data.current)) {
+      r.set({ overKey: String(i.id), side: null, indicator: null, merge: null });
       return;
     }
-    const a = I(n, r, d);
-    if (!a || a.ops.length === 0 || !r) {
-      o.set({ overKey: null, side: null, indicator: null });
+    const s = de(t, i, a);
+    if (!s || s.ops.length === 0 || !i) {
+      r.set({ overKey: null, side: null, indicator: null, merge: null });
       return;
     }
-    let { o: s, hint: l } = a, i = String(r.id);
-    o.bundle && j(o.bundle, a.a.target, s.target) && (i = m(L), s = {
-      target: L,
-      role: { kind: "group", key: z, parent: null, body: !0 }
+    let { o: c, hint: l } = s, p = String(i.id);
+    h.current.length <= 1 && !r.state.copy && !l.merge && r.bundle && Se(r.bundle, s.a.target, c.target) && (p = P(oe), c = {
+      target: oe,
+      role: { kind: "group", key: Ee, parent: null, body: !0 }
     }, l = { side: l.side, axis: "y", body: !1 });
-    const c = ((g = o.nodes.get(i)) == null ? void 0 : g.getBoundingClientRect().width) ?? 0, f = ((O = n.rect.current.initial) == null ? void 0 : O.width) ?? null;
-    o.set({
-      overKey: i,
+    const C = ((u = r.nodes.get(p)) == null ? void 0 : u.getBoundingClientRect().width) ?? 0, b = (($ = t.rect.current.initial) == null ? void 0 : $.width) ?? null;
+    r.set({
+      overKey: p,
       side: l.side,
-      indicator: St(l, s, c, f)
+      indicator: mt(l, c, C, b),
+      merge: l.merge ? Y(c) : null
     });
-  }, Q = ({ active: n, over: r, collisions: d }) => {
-    var c, f;
-    const a = q(r == null ? void 0 : r.data.current);
-    if (a) {
-      const g = Y(o.bundle, k(n.data.current));
-      $(), g && ((c = b.current) == null || c.call(b, g, a.railLayoutId));
+  }, ue = x != null || _ != null;
+  qe(() => {
+    if (!ue) return;
+    const e = (a) => {
+      if (!r.state.activeKey || r.state.copy === a) return;
+      const s = N.current ? L(N.current.active.data.current) : null;
+      s != null && s.add || (r.set({ copy: a }), N.current && ee(N.current));
+    }, t = (a) => {
+      a.key === "Alt" && (a.preventDefault(), e(a.type === "keydown"));
+    }, i = (a) => e(a.altKey);
+    return window.addEventListener("keydown", t, !0), window.addEventListener("keyup", t, !0), window.addEventListener("pointermove", i, !0), () => {
+      window.removeEventListener("keydown", t, !0), window.removeEventListener("keyup", t, !0), window.removeEventListener("pointermove", i, !0);
+    };
+  }, [ue, r]);
+  const Te = ({ active: e, over: t, collisions: i, activatorEvent: a, delta: s }) => {
+    var C, b;
+    if (F(t == null ? void 0 : t.data.current)) {
+      const u = r.bundle, A = h.current.length > 1 ? $e(
+        u,
+        h.current.map((fe) => {
+          const me = u ? we(u, fe) : null;
+          return me ? { target: fe, role: me } : null;
+        })
+      ) : re(u, L(e.data.current)), V = k(e), B = r.nodes.get(String(e.id)), T = (B == null ? void 0 : B.closest("[role=dialog]")) ?? (typeof document > "u" ? null : document.body), D = ye(a);
+      if (z(), !A) return;
+      const j = `Remove ${V}`;
+      M.current(A.ops, { label: j }), Q.current && T && D && W({
+        label: V,
+        applied: j,
+        point: { x: D.x + s.x, y: D.y + s.y },
+        host: T,
+        origin: Ae(T),
+        armed: !1
+      });
       return;
     }
-    const s = I(n, r, d), l = o.bundle;
-    if ($(), !(s != null && s.ops.length) || !l) return;
-    const i = s.a.add;
-    S.current(s.ops, { label: i ? `Add ${i.label}` : bt(l, s.a.target) }), (f = i == null ? void 0 : i.onAdded) == null || f.call(i, s.ops);
-  }, Z = (n) => {
-    var d, a, s, l, i, c;
-    if ((a = (d = n.target) == null ? void 0 : d.closest) != null && a.call(d, "[data-design-resize]")) return;
-    const r = (l = (s = n.target) == null ? void 0 : s.closest) == null ? void 0 : l.call(s, "[data-design-target]");
-    r && ((c = (i = o.activators.get(r)) == null ? void 0 : i()) == null || c(n));
+    const c = De(t == null ? void 0 : t.data.current);
+    if (c) {
+      const u = xe(r.bundle, L(e.data.current));
+      z(), u && ((C = U.current) == null || C.call(U, u, c.railLayoutId));
+      return;
+    }
+    const l = de(e, t, i), p = r.bundle;
+    if (z(), !(l != null && l.ops.length) || !p) return;
+    const f = l.a.add;
+    M.current(l.ops, { label: l.label }), (b = f == null ? void 0 : f.onAdded) == null || b.call(f, l.ops);
+  }, pe = (y == null ? void 0 : y.label) ?? null;
+  w && !w.armed && pe === w.applied && (w.armed = !0);
+  const Ie = !!w && (!w.armed || pe === w.applied), ge = (e) => {
+    var a, s, c, l, p, f;
+    if ((s = (a = e.target) == null ? void 0 : a.closest) != null && s.call(a, "[data-design-resize]")) return;
+    const t = (l = (c = e.target) == null ? void 0 : c.closest) == null ? void 0 : l.call(c, "[data-design-target]");
+    if (!t) return;
+    const i = (p = r.activators.get(t)) == null ? void 0 : p();
+    (f = i == null ? void 0 : i[e.type === "touchstart" ? "onTouchStart" : "onPointerDown"]) == null || f.call(i, e);
   };
-  return /* @__PURE__ */ C(gt.Provider, { value: o, children: /* @__PURE__ */ C(F.Provider, { value: H, children: /* @__PURE__ */ W(
-    rt,
+  return /* @__PURE__ */ S(rt.Provider, { value: r, children: /* @__PURE__ */ S(Oe.Provider, { value: Ke, children: /* @__PURE__ */ ae(
+    Be,
     {
-      sensors: V,
-      collisionDetection: x,
-      measuring: Et,
-      autoScroll: At,
-      accessibility: { announcements: X, screenReaderInstructions: Pt },
-      onDragStart: J,
-      onDragMove: U,
-      onDragOver: U,
-      onDragEnd: Q,
-      onDragCancel: $,
+      sensors: Le,
+      collisionDetection: Pe,
+      measuring: wt,
+      autoScroll: Re,
+      accessibility: { announcements: Me, screenReaderInstructions: Ct },
+      onDragStart: Ne,
+      onDragMove: ee,
+      onDragOver: ee,
+      onDragEnd: Te,
+      onDragCancel: z,
       children: [
-        /* @__PURE__ */ C("div", { className: "contents", onPointerDownCapture: Z, children: y }),
-        w && ut(
-          /* @__PURE__ */ C(
-            st,
+        /* @__PURE__ */ S("div", { className: "contents", onPointerDownCapture: ge, onTouchStartCapture: ge, children: O }),
+        x && ne(
+          /* @__PURE__ */ S(
+            He,
             {
               dropAnimation: null,
               zIndex: 1e3,
-              modifiers: [w.shift],
-              style: { height: w.height },
-              children: /* @__PURE__ */ C(xt, { node: w.node })
+              modifiers: [x.shift],
+              style: { height: x.height },
+              children: /* @__PURE__ */ S(
+                bt,
+                {
+                  node: x.node,
+                  store: r,
+                  count: Math.max(1, h.current.length)
+                }
+              )
+            }
+          ),
+          x.host
+        ),
+        _ && ne(
+          /* @__PURE__ */ S(
+            pt,
+            {
+              store: r,
+              plan: _.plan,
+              name: _.name,
+              warning: _.warning
+            }
+          ),
+          (x == null ? void 0 : x.host) ?? document.body
+        ),
+        w && y && ne(
+          /* @__PURE__ */ S(
+            ft,
+            {
+              label: w.label,
+              point: w.point,
+              origin: w.origin,
+              stillUndoable: Ie,
+              onUndo: () => {
+                var e;
+                return (e = Q.current) == null ? void 0 : e.run();
+              },
+              onClose: () => W(null)
             }
           ),
           w.host
@@ -232,11 +419,18 @@ function qt({
     }
   ) }) });
 }
+function St(g, n, o) {
+  if (n.kind === "group") {
+    const d = g.groups.find((m) => m.key === n.key);
+    return `Copy ${(d == null ? void 0 : d.type) === "tab" ? "tab" : "section"} "${(d == null ? void 0 : d.label) || o}"`;
+  }
+  return `Copy ${o}`;
+}
 export {
-  qt as LayoutDndProvider,
-  yt as NO_DND,
-  kt as designClone,
-  Dt as fixedOrigin,
-  St as indicatorStyle,
-  Gt as useLayoutDnd
+  Gt as LayoutDndProvider,
+  ot as NO_DND,
+  ht as designClone,
+  Ae as fixedOrigin,
+  mt as indicatorStyle,
+  Ht as useLayoutDnd
 };