@daisforge/ui 1.12.1 → 1.12.2

package/chunks/GridDND-rVSi0xX1.mjs

@@ -0,0 +1,852 @@
+import { jsxs as xe, jsx as V } from "react/jsx-runtime";
+import "react-grid-layout/css/styles.css";
+import { iconButtonFilterClassNames as ye } from "../components/IconButton/index.mjs";
+import { useRef as B, useState as P, useLayoutEffect as he, useEffect as et, forwardRef as ge, useCallback as G, useMemo as yt, useImperativeHandle as be } from "react";
+import { b as Qt } from "./AnalyticalWidget-CBi-2MtJ.mjs";
+import { Responsive as De } from "react-grid-layout";
+import { c as ve } from "./utils-C5SQhoON.mjs";
+import { surfaceTransparentAccent as ke, outlineAccent as Oe, outlineAccentMinor as Ne, shadowDownHardS as Ae, outlineTransparentAccent as Me, shadowDownSoftS as Re } from "@salutejs/sdds-themes/tokens/sdds_finai";
+import Et, { css as Ge } from "styled-components";
+const U = {
+  gridItemWrapper: "grid-dnd__item-wrapper",
+  gridItem: "grid-dnd__item",
+  dragHandle: "grid-dnd__drag-handle",
+  noDrag: "grid-dnd__no-drag"
+}, Xt = 248, z = 6, Fe = ({
+  item: e,
+  actionsSlot: n,
+  actionsSlotStyle: r,
+  children: f
+}) => /* @__PURE__ */ xe("div", { style: {
+  height: "100%",
+  position: "relative"
+}, id: e.id, className: U.gridItemWrapper, children: [
+  n && /* @__PURE__ */ V("div", { style: {
+    position: "absolute",
+    right: 16,
+    top: 16,
+    ...r
+  }, className: U.noDrag, children: n }),
+  f
+] });
+function Ee() {
+  const e = B(null), [n, r] = P(0);
+  return he(() => {
+    const f = e.current;
+    if (!f)
+      return;
+    let l = 0;
+    const o = ve((s) => {
+      var y;
+      const d = ((y = s[0]) == null ? void 0 : y.contentRect.width) ?? 0;
+      cancelAnimationFrame(l), l = requestAnimationFrame(() => r(d));
+    });
+    return o.observe(f), () => {
+      cancelAnimationFrame(l), o.disconnect();
+    };
+  }, []), {
+    ref: e,
+    width: n
+  };
+}
+function He(e) {
+  const {
+    onWidthChange: n,
+    margin: r,
+    cols: f,
+    containerPadding: l
+  } = e, {
+    ref: o,
+    width: s
+  } = Ee(), d = B(0);
+  return et(() => {
+    s > 0 && s !== d.current && (n == null || n(s, r, f, l), d.current = s);
+  }, [s, n, r, f, l]), /* @__PURE__ */ V("div", { ref: o, style: {
+    width: "100%"
+  }, children: s > 0 && /* @__PURE__ */ V(De, { ...e, width: s }) });
+}
+const Te = Ge(["background-color:", ";border-radius:16px;outline:1px solid ", ";"], () => ke, () => Oe), We = Et.div.withConfig({
+  displayName: "GridDNDstyled__GridDNDContainer"
+})(["width:100%;min-height:400px;max-width:1890px;&:has(.react-grid-placeholder){& .react-grid-item.react-grid-placeholder{", " opacity:1;}}"], Te), Se = Et.div.attrs(() => ({
+  className: U.gridItem
+})).withConfig({
+  displayName: "GridDNDstyled__GridItem"
+})(["&.react-draggable-dragging{outline:2px solid ", ";box-shadow:", ";cursor:grabbing;}& .", "{cursor:default;}height:100%;width:100%;cursor:", ";background-color:white;border-radius:16px;outline:", ";box-shadow:", ";overflow:hidden;"], () => Ne, () => Ae, Qt.topSlot, (e) => e.$isDraggable ? "grab" : "default", (e) => e.$isDraggable ? `2px solid ${Me}` : "none", () => Re), _e = Et.div.withConfig({
+  displayName: "GridDNDstyled__GridItemContent"
+})(["height:100%;width:100%;"]), qe = (e) => !e || e === "." || e === "-" || e === " ";
+function tr(e, n, r, f) {
+  var d, y;
+  const l = [], o = r[n], s = /* @__PURE__ */ new Set();
+  for (let N = 0; N < e.length; N++) {
+    const A = e[N];
+    if (!A)
+      return l;
+    for (let i = 0; i < A.length; i++) {
+      const m = A[i];
+      if (!m || qe(m) || s.has(`${m}`))
+        continue;
+      let p = 0;
+      for (let u = i; u < A.length && A[u] === m; u++)
+        p++;
+      let x = 0;
+      for (let u = N; u < e.length; u++) {
+        let b = !0;
+        for (let v = i; v < i + p; v++)
+          if (!((d = e[u]) != null && d[v]) || ((y = e[u]) == null ? void 0 : y[v]) !== m) {
+            b = !1;
+            break;
+          }
+        if (!b)
+          break;
+        x++;
+      }
+      for (let u = N; u < N + x; u++)
+        for (let b = i; b < i + p; b++)
+          s.add(`${m}`);
+      l.push({
+        i: m,
+        // ID элемента (имя из grid-template-areas)
+        x: i,
+        // X координата
+        y: N,
+        // Y координата
+        w: p,
+        // Ширина в колонках
+        h: x,
+        // Высота в строках
+        minW: 1,
+        // Минимальная ширина
+        maxW: o,
+        // Максимальная ширина (ограничена количеством колонок)
+        minH: 1,
+        // Минимальная высота
+        isResizable: f,
+        // Можно ли изменять размер
+        static: !1
+        // Элемент не статичный (можно перемещать)
+      });
+    }
+  }
+  return l;
+}
+function er(e) {
+  return Object.keys(e).sort((n, r) => (e[r] || 0) - (e[n] || 0));
+}
+function rr(e, n) {
+  const r = Object.keys(e).sort((f, l) => {
+    const o = e[f] || 0;
+    return (e[l] || 0) - o;
+  });
+  for (const f of r) {
+    const l = e[f];
+    if (l !== void 0 && n >= l)
+      return f;
+  }
+  return r[r.length - 1];
+}
+function nr(e, n, r) {
+  var l, o;
+  const f = r.indexOf(e);
+  if (f === -1)
+    return null;
+  for (let s = f - 1; s >= 0; s--) {
+    const d = r[s];
+    if (d && ((l = n[d]) != null && l.length))
+      return d;
+  }
+  for (let s = f + 1; s < r.length; s++) {
+    const d = r[s];
+    if (d && ((o = n[d]) != null && o.length))
+      return d;
+  }
+  return null;
+}
+function ir(e, n) {
+  const r = [...e].map((i) => ({
+    ...i,
+    // Ограничиваем ширину элемента количеством колонок
+    w: Math.max(1, Math.min(i.w, n))
+    // Старые координаты не важны - будем раскладывать заново
+  })).sort((i, m) => i.y - m.y || i.x - m.x), f = [], l = (i) => {
+    for (; f.length < i; )
+      f.push(Array(n).fill(!1));
+  }, o = (i, m, p, x) => {
+    l(m + x);
+    for (let u = m; u < m + x; u++) {
+      const b = f[u];
+      if (!b)
+        return !1;
+      for (let v = i; v < i + p; v++)
+        if (v >= n || b[v])
+          return !1;
+    }
+    return !0;
+  }, s = (i, m, p, x) => {
+    l(m + x);
+    for (let u = m; u < m + x; u++) {
+      const b = f[u];
+      if (b)
+        for (let v = i; v < i + p; v++)
+          v < b.length && (b[v] = !0);
+    }
+  }, d = (i) => {
+    let m = i;
+    for (; ; ) {
+      l(m + 1);
+      const p = f[m];
+      if (p && p.some((x) => !x))
+        return m;
+      m++;
+    }
+  };
+  let y = 0, N = 0;
+  const A = [];
+  for (const i of r) {
+    let m = !1;
+    for (let x = N; x <= n - i.w; x++)
+      if (o(x, y, i.w, i.h)) {
+        s(x, y, i.w, i.h), A.push({
+          ...i,
+          x,
+          y
+        }), N = x + i.w, N > n - 1 && (y = d(y), N = 0), m = !0;
+        break;
+      }
+    if (m)
+      continue;
+    y = d(y), N = 0;
+    let p = y;
+    for (; ; ) {
+      let x = !1;
+      for (let u = 0; u <= n - i.w; u++)
+        if (o(u, p, i.w, i.h)) {
+          s(u, p, i.w, i.h), A.push({
+            ...i,
+            x: u,
+            y: p
+          }), p === y && (N = u + i.w, N > n - 1 && (y = d(y), N = 0)), x = !0;
+          break;
+        }
+      if (x)
+        break;
+      p++;
+    }
+  }
+  return A;
+}
+const tt = (e) => e === "l" ? {
+  w: 2,
+  h: 2
+} : e === "m" ? {
+  w: 2,
+  h: 1
+} : {
+  w: 1,
+  h: 1
+};
+function Ft(e, n) {
+  if (!e || !n || e.length !== n.length)
+    return !1;
+  const r = [...e].sort((l, o) => l.i > o.i ? 1 : -1), f = [...n].sort((l, o) => l.i > o.i ? 1 : -1);
+  for (let l = 0; l < r.length; l += 1) {
+    const o = r[l], s = f[l];
+    if (!o || !s || o.i !== s.i || o.x !== s.x || o.y !== s.y || o.w !== s.w || o.h !== s.h)
+      return !1;
+  }
+  return !0;
+}
+function gt(e, n, r) {
+  for (; e.length < n; )
+    e.push(Array(r).fill(!1));
+}
+function Be(e, n, r) {
+  gt(e, n + 1, r);
+  const f = e[n];
+  return f ? f.some((l) => !l) : !1;
+}
+function ht(e, n, r, f = 0) {
+  gt(e, n + 1, r);
+  const l = e[n];
+  if (!l)
+    return -1;
+  for (let o = Math.max(0, f); o < r; o++) {
+    if (o >= l.length)
+      return -1;
+    if (!l[o])
+      return o;
+  }
+  return -1;
+}
+function Yt(e, n, r, f, l, o) {
+  gt(e, r + l, o);
+  for (let s = r; s < r + l; s++) {
+    const d = e[s];
+    if (!d)
+      return !1;
+    for (let y = n; y < n + f; y++)
+      if (y >= o || d[y])
+        return !1;
+  }
+  return !0;
+}
+function Ie(e, n, r, f, l, o) {
+  gt(e, r + l, o);
+  for (let s = r; s < r + l; s++) {
+    const d = e[s];
+    if (d)
+      for (let y = n; y < n + f; y++)
+        y < o && (d[y] = !0);
+  }
+}
+function zt(e, n, r) {
+  let f = Math.max(0, n);
+  for (; ; ) {
+    if (Be(e, f, r))
+      return f;
+    f++;
+  }
+}
+function $e(e, n, r, f) {
+  const l = [], o = [];
+  let s = 0, d = 0;
+  for (const y of e) {
+    const N = n[y];
+    if (!N)
+      continue;
+    const A = N, i = Math.max(1, Math.min(A.w, r)), m = Math.max(1, A.h);
+    let p = null;
+    for (let b = d; b <= r - i; b++)
+      if (Yt(o, b, s, i, m, r)) {
+        p = {
+          x: b,
+          y: s
+        };
+        break;
+      }
+    if (!p) {
+      let b = s + 1;
+      for (; ; ) {
+        for (let v = 0; v <= r - i; v++)
+          if (Yt(o, v, b, i, m, r)) {
+            p = {
+              x: v,
+              y: b
+            };
+            break;
+          }
+        if (p)
+          break;
+        b++;
+      }
+    }
+    const {
+      x,
+      y: u
+    } = p;
+    if (Ie(o, x, u, i, m, r), l.push({
+      i: y,
+      x,
+      y: u,
+      w: i,
+      h: m,
+      minW: 1,
+      maxW: r,
+      minH: 1,
+      isResizable: f,
+      static: !1
+    }), u > s)
+      s = u, d = Math.max(0, ht(o, s, r, 0)), d === -1 && (s = zt(o, s, r), d = ht(o, s, r, 0));
+    else {
+      const b = ht(o, s, r, x + i);
+      b === -1 ? (s = zt(o, s, r), d = ht(o, s, r, 0)) : d = b;
+    }
+  }
+  return l;
+}
+function Pt(e) {
+  return [...e].sort((n, r) => n.y - r.y || n.x - r.x).map((n) => n.i);
+}
+const sr = (e) => Object.keys(e).sort((n, r) => (e[r] || 0) - (e[n] || 0))[0] ?? "lg";
+function je(e, n, r, f, l = 0, o = 0) {
+  const s = e.reduce((i, m) => Math.max(i, m.y + m.h), 0), d = Array.from({
+    length: Math.max(s, o) + f + 1
+  }, () => Array(n).fill(!1));
+  for (const {
+    x: i,
+    y: m,
+    w: p,
+    h: x
+  } of e)
+    for (let u = m; u < m + x; u++) {
+      d[u] || (d[u] = Array(n).fill(!1));
+      const b = d[u];
+      for (let v = i; v < i + p; v++)
+        u >= 0 && v >= 0 && v < n && b && (b[v] = !0);
+    }
+  const y = (i, m) => {
+    for (let p = m; p < m + f; p++) {
+      d[p] || (d[p] = Array(n).fill(!1));
+      const x = d[p];
+      for (let u = i; u < i + r; u++)
+        if (u >= n || x && x[u])
+          return !1;
+    }
+    return !0;
+  }, N = (i, m) => {
+    for (let p = m; p < m + f; p++) {
+      d[p] || (d[p] = Array(n).fill(!1));
+      const x = d[p];
+      for (let u = i; u < i + r; u++)
+        u < n && x && (x[u] = !0);
+    }
+  };
+  let A = o;
+  for (; ; ) {
+    d[A] || (d[A] = Array(n).fill(!1));
+    for (let i = A === o ? l : 0; i <= n - r; i++)
+      if (y(i, A))
+        return N(i, A), {
+          x: i,
+          y: A
+        };
+    A++;
+  }
+}
+const or = (e) => {
+  typeof requestAnimationFrame == "function" ? requestAnimationFrame(() => e(!1)) : setTimeout(() => e(!1), 0);
+}, Xe = ({
+  children: e,
+  className: n
+}) => /* @__PURE__ */ V(_e, { className: n, children: e }), Kt = (...e) => (
+  // eslint-disable-next-line no-console
+  console.log("%c[GridDND]", "color:#6b5b95;font-weight:600", ...e)
+), Ye = ge(({
+  // Источник истины — последовательность
+  items: e,
+  // Адаптивность
+  breakpoints: n = {
+    lg: 1375,
+    md: 1143,
+    sm: 911,
+    xs: 679,
+    xxs: 0
+  },
+  cols: r = {
+    lg: 6,
+    md: 5,
+    sm: 4,
+    xs: 3,
+    xxs: 2
+  },
+  rowHeights: f = {
+    lg: 248,
+    md: 248,
+    sm: 248,
+    xs: 248,
+    xxs: 248
+  },
+  // RGL поведение
+  isDraggable: l = !0,
+  isResizable: o = !1,
+  margin: s = [16, 16],
+  containerPadding: d = [0, 0],
+  preventCollision: y = !1,
+  allowOverlap: N = !1,
+  isBounded: A = !0,
+  autoSize: i = !0,
+  useCSSTransforms: m = !0,
+  compactType: p = "horizontal",
+  smartCompact: x = !0,
+  resizeHandles: u = ["se", "sw", "ne", "nw", "s", "w", "e", "n"],
+  draggableHandle: b = `.${U.dragHandle}`,
+  draggableCancel: v = `button, input, select, textarea, .${U.noDrag}, .${Qt.topSlot}, .${ye.root}`,
+  maxRows: Ut,
+  transformScale: Vt,
+  // Колбеки
+  onLayoutChange: M,
+  onBreakpointChange: rt,
+  onItemsChange: F,
+  onWidthChange: nt,
+  onDrag: it,
+  onDragStart: st,
+  onDragStop: ot,
+  // Контент
+  children: bt,
+  // Задержка активации D&D
+  dragActivationDelay: Dt = 0,
+  // Стилизация
+  gridItemComponent: Ht,
+  containerStyle: Jt,
+  gridStyle: Zt,
+  enableLogs: Tt = !1
+}, Lt) => {
+  const [R, ct] = P(() => e.map((t) => t.id)), J = B(Object.fromEntries(e.map((t) => [t.id, tt(t.type)]))), vt = B(!1), Z = B({
+    lg: [],
+    md: [],
+    sm: [],
+    xs: [],
+    xxs: []
+  }), K = B("lg"), Q = B([]), j = Dt > 0, [kt, Wt] = P(!1), [Ct, Ot] = P(null), lt = B(null), Nt = B(!1), At = B(null), at = B(null), C = G(() => {
+    lt.current && (clearTimeout(lt.current), lt.current = null);
+  }, []), ft = G(() => {
+    Wt(!1), Ot(null), Nt.current = !1;
+  }, []), te = 64;
+  et(() => {
+    if (!j || !At.current)
+      return;
+    const t = At.current;
+    let a = null;
+    const c = (g, k) => {
+      const E = (T) => {
+        const W = T.clientX - g, X = T.clientY - k;
+        W * W + X * X > te && (C(), Ot(null), at.current = null, w());
+      };
+      document.addEventListener("pointermove", E), a = () => {
+        document.removeEventListener("pointermove", E), a = null;
+      };
+    }, w = () => {
+      a == null || a();
+    }, h = (g) => {
+      const k = g.target;
+      return g.offsetX > k.clientWidth || g.offsetY > k.clientHeight;
+    }, D = (g) => {
+      if (g._synthetic || g.button !== 0 || h(g))
+        return;
+      C(), w();
+      const E = g.target.closest(`.${U.gridItem}`), T = E == null ? void 0 : E.querySelector(`.${U.gridItemWrapper}`), W = (T == null ? void 0 : T.id) ?? null, X = E == null ? void 0 : E.querySelector(`.${U.dragHandle}`);
+      Ot(W), at.current = {
+        clientX: g.clientX,
+        clientY: g.clientY,
+        handleEl: X
+      }, c(g.clientX, g.clientY), lt.current = setTimeout(() => {
+        w(), Wt(!0), requestAnimationFrame(() => {
+          requestAnimationFrame(() => {
+            const Y = at.current;
+            if (!(Y != null && Y.handleEl))
+              return;
+            const wt = new MouseEvent("mousedown", {
+              bubbles: !0,
+              cancelable: !0,
+              clientX: Y.clientX,
+              clientY: Y.clientY,
+              button: 0,
+              buttons: 1
+            });
+            wt._synthetic = !0, Y.handleEl.dispatchEvent(wt);
+          });
+        });
+      }, Dt);
+    }, O = () => {
+      C(), w(), at.current = null, Nt.current || requestAnimationFrame(() => {
+        ft();
+      });
+    };
+    return t.addEventListener("pointerdown", D), document.addEventListener("pointerup", O), () => {
+      t.removeEventListener("pointerdown", D), document.removeEventListener("pointerup", O), C(), w();
+    };
+  }, [j, Dt, C, ft]);
+  const St = j ? l && kt : l, [I, _t] = P({
+    lg: [],
+    md: [],
+    sm: [],
+    xs: [],
+    xxs: []
+  }), [qt, ee] = P("lg"), [S, re] = P(f.lg ?? Xt), [ne, ut] = P(p), [ie, Bt] = P(!1), se = yt(() => b.split(".").join(" "), [b]), oe = yt(() => Ht ?? Xe, [Ht]), dt = yt(() => new Map(e.map((t) => [t.id, t.type])), [e]), L = B(/* @__PURE__ */ new Map()), mt = G((t) => L.current.get(t) ?? dt.get(t) ?? "s", [dt]), $ = G((t) => t.map((a) => ({
+    id: a,
+    type: mt(a)
+  })), [mt]), Mt = G((t) => f[t] ?? f.md ?? Xt, [f]), H = G((t, a, c) => {
+    const w = c ?? R, h = a[t] ?? [], D = Z.current[t] ?? [], O = new Map(h.map((k) => [k.i, k])), g = new Map(D.map((k) => [k.i, k]));
+    return w.map((k) => {
+      const E = mt(k), T = O.get(k) ?? g.get(k) ?? null, W = J.current[k] ?? tt(E), X = T ? {
+        x: T.x,
+        y: T.y,
+        w: T.w,
+        h: T.h
+      } : {
+        x: 0,
+        y: 0,
+        w: W.w,
+        h: W.h
+      };
+      return {
+        id: k,
+        type: E,
+        position: X
+      };
+    });
+  }, [R, mt]), It = G((t) => {
+    const a = Z.current[t] ?? [];
+    return a.length ? a : I[t] ?? [];
+  }, [I]), _ = G(
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (...t) => {
+      Tt && Kt(...t);
+    },
+    [Tt]
+  ), pt = G((t) => {
+    Z.current = t, vt.current = !0, Bt(!0), _t(t), requestAnimationFrame(() => {
+      requestAnimationFrame(() => {
+        vt.current = !1, Bt(!1), Kt("[GridDND] reflow window closed");
+      });
+    });
+  }, []), q = G((t) => {
+    const a = {};
+    for (const c of Object.keys(r)) {
+      const w = r[c] ?? z;
+      a[c] = $e(t, J.current, w, o);
+    }
+    return _("reflowAllByOrder", {
+      order: t,
+      out: a
+    }), pt(a), a;
+  }, [r, o, pt, _]), $t = G((t, a) => {
+    if (!x)
+      return;
+    const c = Date.now();
+    if (Q.current.push({
+      x: t,
+      y: a,
+      timestamp: c
+    }), Q.current = Q.current.filter((D) => c - D.timestamp <= 300), Q.current.length < 2)
+      return;
+    let w = 0, h = 0;
+    for (let D = 1; D < Q.current.length; D += 1) {
+      const O = Q.current[D - 1], g = Q.current[D];
+      !O || !g || (w += Math.abs(g.x - O.x), h += Math.abs(g.y - O.y));
+    }
+    w + h < 10 || (w > h * 1.5 ? ut("horizontal") : h > w * 1.5 && ut("vertical"));
+  }, [x]), jt = G(() => {
+    requestAnimationFrame(() => {
+      requestAnimationFrame(() => {
+        const t = Z.current, a = {};
+        for (const [c, w] of Object.entries(t))
+          a[c] = w.map((h) => ({
+            ...h
+          }));
+        _("[GridDND] forceSyncWithRgl → re-push target layouts"), pt(a);
+      });
+    });
+  }, [pt, _]);
+  et(() => {
+    q(e.map((t) => t.id));
+  }, []), et(() => {
+    const t = /* @__PURE__ */ new Set([...dt.keys(), ...R]);
+    L.current.forEach((a, c) => {
+      t.has(c) || L.current.delete(c);
+    });
+  }, [dt, R]), et(() => {
+    e.forEach((t) => {
+      J.current[t.id] || (J.current[t.id] = tt(t.type));
+    });
+  }, [e]);
+  const ce = G((t, a, c, w, h, D) => {
+    Q.current = [], ut(p), j && (Nt.current = !0), st == null || st(t, a, c, w, h, D);
+  }, [p, st, j]), le = G((t, a, c, w, h, D) => {
+    $t(h.clientX, h.clientY), it == null || it(t, a, c, w, h, D);
+  }, [$t, it]), ae = G((t, a, c, w, h, D) => {
+    ot == null || ot(t, a, c, w, h, D), j && ft();
+    const O = Pt(t);
+    _("[GridDND] dragStop: nextOrder(readingOrder)", O), ct(O);
+    const g = q(O), k = K.current, E = H(k, g, O);
+    F == null || F(E), M == null || M({
+      breakpoint: k,
+      cols: r[k] ?? z,
+      rowHeight: S,
+      items: E
+    }, g, {
+      itemsOrder: O,
+      itemsOrderTyped: $(O)
+    }), ut(p);
+    const T = t, W = g[k];
+    Ft(T, W) ? _("[GridDND] dragStop: live layout == target (OK)") : (_("[GridDND] dragStop: live layout != target → forceSyncWithRgl()"), jt());
+  }, [ot, j, ft, q, H, F, M, r, S, p, jt, _, $]), fe = G((t, a) => {
+    _("RGL onLayoutChange", {
+      cur: t,
+      all: a
+    });
+    const c = K.current, w = (Z.current[c] ?? []).length;
+    if (t.length === w && Ft(t, Z.current[c])) {
+      _("[GridDND] onLayoutChange[IGNORED: equals-target]", {
+        bp: c
+      });
+      return;
+    }
+    if (vt.current) {
+      _("[GridDND] onLayoutChange[IGNORED: reflow-window]", {
+        bp: c,
+        cur: t
+      });
+      return;
+    }
+    const h = r[c] ?? z;
+    if (t.some((g) => typeof g.maxW == "number" && g.maxW !== h))
+      return;
+    if (Ft(t, Z.current[c])) {
+      _("[GridDND] onLayoutChange[IGNORED: equals-target]", {
+        bp: c
+      });
+      return;
+    }
+    _t((g) => ({
+      ...g,
+      [c]: t.map((k) => ({
+        ...k
+      }))
+    }));
+    const O = H(c, {
+      ...I,
+      [c]: t
+    });
+    M == null || M({
+      breakpoint: c,
+      cols: h,
+      rowHeight: S,
+      items: O
+    }, {
+      ...I,
+      [c]: t
+    }, {
+      itemsOrder: R
+    });
+  }, [M, H, I, r, S, R, _]), ue = G((t) => {
+    K.current = t, ee(t), re(Mt(t));
+    const a = q(R), c = H(t, a, R);
+    rt == null || rt(t, {
+      breakpoint: t,
+      cols: r[t] ?? z,
+      rowHeight: Mt(t),
+      items: c
+    });
+  }, [Mt, q, R, H, rt, r]), de = G((t, a, c, w) => {
+    nt == null || nt(t, a, c, w);
+  }, [nt]), Rt = G((t) => {
+    L.current.delete(t), delete J.current[t], ct((a) => {
+      const c = a.filter((O) => O !== t), w = q(c), h = K.current, D = H(h, w, c);
+      return F == null || F(D), M == null || M({
+        breakpoint: h,
+        cols: r[h] ?? z,
+        rowHeight: S,
+        items: D
+      }, w, {
+        itemsOrder: c,
+        itemsOrderTyped: $(c)
+      }), c;
+    });
+  }, [q, H, F, M, r, S, $]), Gt = G((t, a) => {
+    if (!R.includes(t))
+      return;
+    L.current.set(t, a);
+    const c = K.current, w = r[c] ?? z, h = tt(a);
+    J.current[t] = {
+      w: Math.max(1, Math.min(h.w, w)),
+      h: Math.max(1, h.h)
+    };
+    const D = q(R), O = H(c, D, R);
+    F == null || F(O), M == null || M({
+      breakpoint: c,
+      cols: w,
+      rowHeight: S,
+      items: O
+    }, D, {
+      itemsOrder: R,
+      itemsOrderTyped: $(R)
+    });
+  }, [R, r, q, H, F, M, S, $]);
+  be(Lt, () => ({
+    api: {
+      getOrder: () => R,
+      getOrderDetailed: () => $(R),
+      setOrder: (t) => {
+        ct(t);
+        const a = q(t), c = K.current, w = H(c, a, t);
+        F == null || F(w), M == null || M({
+          breakpoint: c,
+          cols: r[c] ?? z,
+          rowHeight: S,
+          items: w
+        }, a, {
+          itemsOrder: t,
+          itemsOrderTyped: $(t)
+        });
+      },
+      addItem: (t, a) => {
+        L.current.set(t.id, t.type);
+        const c = tt(t.type), w = K.current, h = r[w] ?? z, D = {
+          w: Math.max(1, Math.min(c.w, h)),
+          h: Math.max(1, c.h)
+        };
+        J.current[t.id] = D;
+        const O = It(w);
+        let g = 0, k = 0;
+        if (a != null) {
+          const wt = Math.max(0, Math.min(a - 1, R.length - 1)), pe = R[wt], xt = O.find((we) => we.i === pe);
+          xt && (k = xt.y, g = xt.x + xt.w);
+        }
+        const E = je(O, h, D.w, D.h, g, k), T = O.concat([{
+          i: t.id,
+          x: E.x,
+          y: E.y,
+          w: D.w,
+          h: D.h
+        }]), W = Pt(T);
+        ct(W);
+        const X = q(W), Y = H(w, X, W);
+        F == null || F(Y), M == null || M({
+          breakpoint: w,
+          cols: h,
+          rowHeight: S,
+          items: Y
+        }, X, {
+          itemsOrder: W,
+          itemsOrderTyped: $(W)
+        });
+      },
+      removeItem: Rt,
+      setItemType: Gt,
+      getAllLayouts: () => I,
+      getCurrentLayout: () => {
+        const t = K.current, a = H(t, I, R);
+        return {
+          breakpoint: t,
+          cols: r[t] ?? z,
+          rowHeight: S,
+          items: a
+        };
+      }
+    }
+  }), [Rt, Gt, R, $, q, H, F, M, r, S, It, I]);
+  const me = yt(() => H(qt, I, R), [qt, I, R, H]);
+  return /* @__PURE__ */ V(We, { ref: At, style: {
+    ...Jt,
+    ...j && kt ? {
+      userSelect: "none",
+      touchAction: "none"
+    } : {}
+  }, children: /* @__PURE__ */ V(He, { className: "layout", layouts: I, breakpoints: n, cols: r, rowHeight: S, margin: s, containerPadding: d, isDraggable: St, isResizable: o, onLayoutChange: fe, onBreakpointChange: ue, autoSize: i, useCSSTransforms: m, preventCollision: y, compactType: ie ? null : x ? ne : p, allowOverlap: N, isBounded: A, draggableHandle: b, draggableCancel: v, resizeHandles: o ? u : [], maxRows: Ut, transformScale: Vt, onWidthChange: de, onDrag: le, onDragStart: ce, onDragStop: ae, style: {
+    background: "transparent",
+    ...Zt
+  }, children: me.map((t) => /* @__PURE__ */ V(Se, { $isDraggable: j ? kt && Ct === t.id : l, children: /* @__PURE__ */ V(oe, { isDraggable: St, className: se, children: typeof bt == "function" ? bt(t, () => Rt(t.id), (a) => Gt(t.id, a)) : bt }) }, t.id)) }) });
+}), ze = Object.assign(Ye, {
+  ItemWrapper: Fe
+});
+ze.displayName = "GridDND";
+export {
+  ze as G,
+  U as a,
+  Xt as b,
+  tr as c,
+  nr as d,
+  rr as e,
+  z as f,
+  Te as g,
+  ir as h,
+  tt as i,
+  qe as j,
+  sr as k,
+  Ft as l,
+  je as m,
+  er as o,
+  $e as p,
+  Pt as r,
+  or as u
+};