@frontify/fondue-components 28.0.0 → 29.0.1

package/dist/fondue-components84.js

@@ -1,16 +1,632 @@
-import { useEffect as c } from "react";
-const s = (t) => {
-  c(() => {
-    if (!t.current)
-      return;
-    const e = t.current, n = new ResizeObserver(() => {
-      const r = e.scrollWidth > e.clientWidth;
-      e.title = r && e.textContent || "";
-    });
-    return n.observe(e), () => n.disconnect();
-  }, [t]);
+import { WeakStore as we, reactive as te } from "./fondue-components139.js";
+import { defaultCollisionDetection as me, closestCorners as Se } from "./fondue-components144.js";
+import { Droppable as Pe, Draggable as De, Scroller as Ee } from "./fondue-components145.js";
+import { ProxiedElements as Ge, isKeyboardEvent as re, DOMRectangle as ne, getVisibleBoundingRectangle as Te, scrollIntoViewIfNeeded as ke, getComputedStyles as Me, computeTranslate as ie, prefersReducedMotion as je, getWindow as Ce, animateTransform as Re } from "./fondue-components146.js";
+import { Plugin as ge } from "@dnd-kit/abstract";
+import { Rectangle as se } from "./fondue-components147.js";
+import { batch as w, untracked as oe, effect as Ae } from "./fondue-components142.js";
+var ze = Object.create, fe = Object.defineProperty, We = Object.defineProperties, $e = Object.getOwnPropertyDescriptor, Be = Object.getOwnPropertyDescriptors, J = Object.getOwnPropertySymbols, he = Object.prototype.hasOwnProperty, be = Object.prototype.propertyIsEnumerable, Le = (e, t) => (t = Symbol[e]) ? t : Symbol.for("Symbol." + e), N = (e) => {
+  throw TypeError(e);
+}, U = (e, t, r) => t in e ? fe(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r, ae = (e, t) => {
+  for (var r in t || (t = {}))
+    he.call(t, r) && U(e, r, t[r]);
+  if (J)
+    for (var r of J(t))
+      be.call(t, r) && U(e, r, t[r]);
+  return e;
+}, le = (e, t) => We(e, Be(t)), Ne = (e, t) => {
+  var r = {};
+  for (var i in e)
+    he.call(e, i) && t.indexOf(i) < 0 && (r[i] = e[i]);
+  if (e != null && J)
+    for (var i of J(e))
+      t.indexOf(i) < 0 && be.call(e, i) && (r[i] = e[i]);
+  return r;
+}, Ve = (e) => {
+  var t;
+  return [, , , ze((t = void 0) != null ? t : null)];
+}, ve = ["class", "method", "getter", "setter", "accessor", "field", "value", "get", "set"], W = (e) => e !== void 0 && typeof e != "function" ? N("Function expected") : e, qe = (e, t, r, i, a) => ({ kind: ve[e], name: t, metadata: i, addInitializer: (p) => r._ ? N("Already initialized") : a.push(W(p || null)) }), Fe = (e, t) => U(t, Le("metadata"), e[3]), q = (e, t, r, i) => {
+  for (var a = 0, p = e[t >> 1], n = p && p.length; a < n; a++) t & 1 ? p[a].call(r) : i = p[a].call(r, i);
+  return i;
+}, _e = (e, t, r, i, a, p) => {
+  for (var n, s, v, h, b, l = t & 7, o = !1, f = !1, g = e.length + 1, y = ve[l + 5], x = e[g - 1] = [], m = e[g] || (e[g] = []), I = (a = a.prototype, $e({ get [r]() {
+    return $(this, p);
+  }, set [r](c) {
+    return G(this, p, c);
+  } }, r)), S = i.length - 1; S >= 0; S--)
+    h = qe(l, r, v = {}, e[3], m), h.static = o, h.private = f, b = h.access = { has: (c) => r in c }, b.get = (c) => c[r], b.set = (c, d) => c[r] = d, s = (0, i[S])({ get: I.get, set: I.set }, h), v._ = 1, s === void 0 ? W(s) && (I[y] = s) : typeof s != "object" || s === null ? N("Object expected") : (W(n = s.get) && (I.get = n), W(n = s.set) && (I.set = n), W(n = s.init) && x.unshift(n));
+  return I && fe(a, r, I), a;
+}, xe = (e, t, r) => t.has(e) || N("Cannot " + r), $ = (e, t, r) => (xe(e, t, "read from private field"), t.get(e)), z = (e, t, r) => t.has(e) ? N("Cannot add the same private member more than once") : t instanceof WeakSet ? t.add(e) : t.set(e, r), G = (e, t, r, i) => (xe(e, t, "write to private field"), t.set(e, r), r);
+function T(e) {
+  return e instanceof ee || e instanceof Oe;
+}
+var F = 10, Ke = class extends ge {
+  constructor(e) {
+    super(e);
+    const t = Ae(() => {
+      const { dragOperation: i } = e;
+      if (re(i.activatorEvent) && T(i.source) && i.status.initialized) {
+        const a = e.registry.plugins.get(Ee);
+        if (a)
+          return a.disable(), () => a.enable();
+      }
+    }), r = e.monitor.addEventListener(
+      "dragmove",
+      (i, a) => {
+        queueMicrotask(() => {
+          if (this.disabled || i.defaultPrevented || !i.nativeEvent)
+            return;
+          const { dragOperation: p } = a;
+          if (!re(i.nativeEvent) || !T(p.source) || !p.shape)
+            return;
+          const { actions: n, collisionObserver: s, registry: v } = a, { by: h } = i;
+          if (!h)
+            return;
+          const b = He(h), { source: l, target: o } = p, { center: f } = p.shape.current, g = [], y = [];
+          w(() => {
+            for (const d of v.droppables) {
+              const { id: u } = d;
+              if (!d.accepts(l) || u === (o == null ? void 0 : o.id) && T(d) || !d.element)
+                continue;
+              let _ = d.shape;
+              const O = new ne(d.element, {
+                getBoundingClientRect: (C) => Te(C, void 0, 0.2)
+              });
+              !O.height || !O.width || (b == "down" && f.y + F < O.center.y || b == "up" && f.y - F > O.center.y || b == "left" && f.x - F > O.center.x || b == "right" && f.x + F < O.center.x) && (g.push(d), d.shape = O, y.push(() => d.shape = _));
+            }
+          }), i.preventDefault(), s.disable();
+          const x = s.computeCollisions(
+            g,
+            Se
+          );
+          w(() => y.forEach((d) => d()));
+          const [m] = x;
+          if (!m)
+            return;
+          const { id: I } = m, { index: S, group: c } = l.sortable;
+          n.setDropTarget(I).then(() => {
+            const { source: d, target: u, shape: _ } = p;
+            if (!d || !T(d) || !_)
+              return;
+            const {
+              index: O,
+              group: C,
+              target: D
+            } = d.sortable, P = S !== O || c !== C, R = P ? D : u == null ? void 0 : u.element;
+            if (!R) return;
+            ke(R);
+            const V = new ne(R);
+            if (!V)
+              return;
+            const A = se.delta(
+              V,
+              se.from(_.current.boundingRectangle),
+              d.alignment
+            );
+            n.move({
+              by: A
+            }), P ? n.setDropTarget(d.id).then(() => s.enable()) : s.enable();
+          });
+        });
+      }
+    );
+    this.destroy = () => {
+      r(), t();
+    };
+  }
+};
+function He(e) {
+  const { x: t, y: r } = e;
+  if (t > 0)
+    return "right";
+  if (t < 0)
+    return "left";
+  if (r > 0)
+    return "down";
+  if (r < 0)
+    return "up";
+}
+var Je = Object.defineProperty, Qe = Object.defineProperties, Ue = Object.getOwnPropertyDescriptors, de = Object.getOwnPropertySymbols, Xe = Object.prototype.hasOwnProperty, Ye = Object.prototype.propertyIsEnumerable, ce = (e, t, r) => t in e ? Je(e, t, { enumerable: !0, configurable: !0, writable: !0, value: r }) : e[t] = r, k = (e, t) => {
+  for (var r in t || (t = {}))
+    Xe.call(t, r) && ce(e, r, t[r]);
+  if (de)
+    for (var r of de(t))
+      Ye.call(t, r) && ce(e, r, t[r]);
+  return e;
+}, M = (e, t) => Qe(e, Ue(t));
+function Ze(e, t, r) {
+  if (t === r)
+    return e;
+  const i = e.slice();
+  return i.splice(r, 0, i.splice(t, 1)[0]), i;
+}
+function Q(e) {
+  return "initialIndex" in e && typeof e.initialIndex == "number" && "index" in e && typeof e.index == "number";
+}
+function et(e, t, r) {
+  var i, a, p;
+  const { source: n, target: s, canceled: v } = t.operation;
+  if (!n || !s || v)
+    return "preventDefault" in t && t.preventDefault(), e;
+  const h = (c, d) => c === d || typeof c == "object" && "id" in c && c.id === d;
+  if (Array.isArray(e)) {
+    const c = e.findIndex((u) => h(u, n.id)), d = e.findIndex((u) => h(u, s.id));
+    if (c === -1 || d === -1) {
+      if (Q(n)) {
+        const u = n.initialIndex, _ = n.index;
+        return u === _ || u < 0 || u >= e.length ? ("preventDefault" in t && t.preventDefault(), e) : r(e, u, _);
+      }
+      return e;
+    }
+    if (!v && "index" in n && typeof n.index == "number") {
+      const u = n.index;
+      if (u !== c)
+        return r(e, c, u);
+    }
+    return r(e, c, d);
+  }
+  const b = Object.entries(e);
+  let l = -1, o, f = -1, g;
+  for (const [c, d] of b)
+    if (l === -1 && (l = d.findIndex((u) => h(u, n.id)), l !== -1 && (o = c)), f === -1 && (f = d.findIndex((u) => h(u, s.id)), f !== -1 && (g = c)), l !== -1 && f !== -1)
+      break;
+  if (l === -1 && Q(n)) {
+    const c = n.initialGroup, d = n.initialIndex, u = n.group, _ = n.index;
+    if (c == null || u == null || !(c in e) || !(u in e) || c === u && d === _)
+      return "preventDefault" in t && t.preventDefault(), e;
+    if (c === u)
+      return M(k({}, e), {
+        [c]: r(e[c], d, _)
+      });
+    const O = e[c][d];
+    return M(k({}, e), {
+      [c]: [
+        ...e[c].slice(0, d),
+        ...e[c].slice(d + 1)
+      ],
+      [u]: [
+        ...e[u].slice(0, _),
+        O,
+        ...e[u].slice(_)
+      ]
+    });
+  }
+  if (!n.manager) return e;
+  const { dragOperation: y } = n.manager, x = (a = (i = y.shape) == null ? void 0 : i.current.center) != null ? a : y.position.current;
+  if (g == null && s.id in e) {
+    const c = s.shape && x.y > s.shape.center.y ? e[s.id].length : 0;
+    g = s.id, f = c;
+  }
+  if (o == null || g == null || o === g && l === f) {
+    if (o != null && o === g && l === f && Q(n)) {
+      const c = n.group != null && n.group !== o, d = n.index !== l;
+      if (c || d) {
+        const u = (p = n.group) != null ? p : o;
+        if (u in e) {
+          if (o === u)
+            return M(k({}, e), {
+              [o]: r(
+                e[o],
+                l,
+                n.index
+              )
+            });
+          const _ = e[o][l];
+          return M(k({}, e), {
+            [o]: [
+              ...e[o].slice(0, l),
+              ...e[o].slice(l + 1)
+            ],
+            [u]: [
+              ...e[u].slice(0, n.index),
+              _,
+              ...e[u].slice(n.index)
+            ]
+          });
+        }
+      }
+    }
+    return "preventDefault" in t && t.preventDefault(), e;
+  }
+  if (o === g)
+    return M(k({}, e), {
+      [o]: r(e[o], l, f)
+    });
+  const I = s.shape && Math.round(x.y) > Math.round(s.shape.center.y) ? 1 : 0, S = e[o][l];
+  return M(k({}, e), {
+    [o]: [
+      ...e[o].slice(0, l),
+      ...e[o].slice(l + 1)
+    ],
+    [g]: [
+      ...e[g].slice(0, f + I),
+      S,
+      ...e[g].slice(f + I)
+    ]
+  });
+}
+function tt(e, t) {
+  return et(e, t, Ze);
+}
+var ue = "__default__", rt = class extends ge {
+  constructor(e) {
+    super(e);
+    const t = () => {
+      const i = /* @__PURE__ */ new Map();
+      for (const a of e.registry.droppables)
+        if (a instanceof ee) {
+          const { sortable: p } = a, { group: n } = p;
+          let s = i.get(n);
+          s || (s = /* @__PURE__ */ new Set(), i.set(n, s)), s.add(p);
+        }
+      for (const [a, p] of i)
+        i.set(a, new Set(K(p)));
+      return i;
+    }, r = [
+      e.monitor.addEventListener("dragover", (i, a) => {
+        if (this.disabled)
+          return;
+        const { dragOperation: p } = a, { source: n, target: s } = p;
+        if (!T(n) || !T(s) || n.sortable === s.sortable)
+          return;
+        const v = t(), h = n.sortable.group === s.sortable.group, b = v.get(n.sortable.group), l = h ? b : v.get(s.sortable.group);
+        !b || !l || queueMicrotask(() => {
+          i.defaultPrevented || a.renderer.rendering.then(() => {
+            var o, f, g;
+            const y = t();
+            for (const [D, P] of v.entries()) {
+              const R = Array.from(P).entries();
+              for (const [V, A] of R)
+                if (A.index !== V || A.group !== D || !((o = y.get(D)) != null && o.has(A)))
+                  return;
+            }
+            const x = n.sortable.element, m = s.sortable.element;
+            if (!m || !x || !h && s.id === n.sortable.group)
+              return;
+            const I = K(b), S = h ? I : K(l), c = (f = n.sortable.group) != null ? f : ue, d = (g = s.sortable.group) != null ? g : ue, u = {
+              [c]: I,
+              [d]: S
+            }, _ = tt(u, i);
+            if (u === _) return;
+            const O = _[d].indexOf(n.sortable), C = _[d].indexOf(s.sortable);
+            a.collisionObserver.disable(), pe(x, O, m, C), w(() => {
+              for (const [D, P] of _[c].entries())
+                P.index = D;
+              if (!h)
+                for (const [D, P] of _[d].entries())
+                  P.group = s.sortable.group, P.index = D;
+            }), a.actions.setDropTarget(n.id).then(() => a.collisionObserver.enable());
+          });
+        });
+      }),
+      e.monitor.addEventListener("dragend", (i, a) => {
+        if (!i.canceled)
+          return;
+        const { dragOperation: p } = a, { source: n } = p;
+        T(n) && (n.sortable.initialIndex === n.sortable.index && n.sortable.initialGroup === n.sortable.group || queueMicrotask(() => {
+          const s = t(), v = s.get(
+            n.sortable.initialGroup
+          );
+          v && a.renderer.rendering.then(() => {
+            for (const [f, g] of s.entries()) {
+              const y = Array.from(g).entries();
+              for (const [x, m] of y)
+                if (m.index !== x || m.group !== f)
+                  return;
+            }
+            const h = K(v), b = n.sortable.element, l = h[n.sortable.initialIndex], o = l == null ? void 0 : l.element;
+            !l || !o || !b || (pe(b, l.index, o, n.index), w(() => {
+              for (const [f, g] of s.entries()) {
+                const y = Array.from(g).values();
+                for (const x of y)
+                  x.index = x.initialIndex, x.group = x.initialGroup;
+              }
+            }));
+          });
+        }));
+      })
+    ];
+    this.destroy = () => {
+      for (const i of r)
+        i();
+    };
+  }
+};
+function pe(e, t, r, i) {
+  const a = i < t ? "afterend" : "beforebegin";
+  r.insertAdjacentElement(a, e);
+}
+function nt(e, t) {
+  return e.index - t.index;
+}
+function K(e) {
+  return Array.from(e).sort(nt);
+}
+var it = [
+  Ke,
+  rt
+], st = {
+  duration: 250,
+  easing: "cubic-bezier(0.25, 1, 0.5, 1)",
+  idle: !1
+}, H = new we(), ye, Ie, E, X, B, L, Y, j;
+Ie = [te], ye = [te];
+var Z = class {
+  constructor(e, t) {
+    z(this, X, q(E, 8, this)), q(E, 11, this), z(this, B), z(this, L), z(this, Y, q(E, 12, this)), q(E, 15, this), z(this, j), this.register = () => (w(() => {
+      var l, o;
+      (l = this.manager) == null || l.registry.register(this.droppable), (o = this.manager) == null || o.registry.register(this.draggable);
+    }), () => this.unregister()), this.unregister = () => {
+      w(() => {
+        var l, o;
+        (l = this.manager) == null || l.registry.unregister(this.droppable), (o = this.manager) == null || o.registry.unregister(this.draggable);
+      });
+    }, this.destroy = () => {
+      w(() => {
+        this.droppable.destroy(), this.draggable.destroy();
+      });
+    };
+    var r = e, {
+      effects: i = () => [],
+      group: a,
+      index: p,
+      sensors: n,
+      type: s,
+      transition: v = st,
+      plugins: h = it
+    } = r, b = Ne(r, [
+      "effects",
+      "group",
+      "index",
+      "sensors",
+      "type",
+      "transition",
+      "plugins"
+    ]);
+    this.droppable = new ee(b, t, this), this.draggable = new Oe(
+      le(ae({}, b), {
+        effects: () => [
+          () => {
+            var l, o, f;
+            const g = (l = this.manager) == null ? void 0 : l.dragOperation.status;
+            g != null && g.initializing && this.id === ((f = (o = this.manager) == null ? void 0 : o.dragOperation.source) == null ? void 0 : f.id) && H.clear(this.manager), g != null && g.dragging && H.set(
+              this.manager,
+              this.id,
+              oe(() => ({
+                initialIndex: this.index,
+                initialGroup: this.group
+              }))
+            );
+          },
+          () => {
+            const { index: l, group: o, manager: f } = this, g = $(this, L), y = $(this, B);
+            (l !== g || o !== y) && (G(this, L, l), G(this, B, o), this.animate());
+          },
+          () => {
+            const { target: l } = this, { feedback: o, isDragSource: f } = this.draggable;
+            o == "move" && f && (this.droppable.disabled = !l);
+          },
+          () => {
+            const { manager: l } = this;
+            for (const o of h)
+              l == null || l.registry.register(o);
+          },
+          ...i()
+        ],
+        type: s,
+        sensors: n
+      }),
+      t,
+      this
+    ), G(this, j, b.element), this.manager = t, this.index = p, G(this, L, p), this.group = a, G(this, B, a), this.type = s, this.transition = v;
+  }
+  get initialIndex() {
+    var e, t;
+    return (t = (e = H.get(this.manager, this.id)) == null ? void 0 : e.initialIndex) != null ? t : this.index;
+  }
+  get initialGroup() {
+    var e, t;
+    return (t = (e = H.get(this.manager, this.id)) == null ? void 0 : e.initialGroup) != null ? t : this.group;
+  }
+  animate() {
+    oe(() => {
+      const { manager: e, transition: t } = this, { shape: r } = this.droppable;
+      if (!e) return;
+      const { idle: i } = e.dragOperation.status;
+      !r || !t || i && !t.idle || e.renderer.rendering.then(() => {
+        const { element: a } = this;
+        if (!a)
+          return;
+        const p = this.refreshShape();
+        if (!p)
+          return;
+        const n = {
+          x: r.boundingRectangle.left - p.boundingRectangle.left,
+          y: r.boundingRectangle.top - p.boundingRectangle.top
+        }, { translate: s } = Me(a), v = ie(a, s, !1), h = ie(a, s);
+        if (n.x || n.y) {
+          const b = je(Ce(a)) ? le(ae({}, t), { duration: 0 }) : t;
+          Re({
+            element: a,
+            keyframes: {
+              translate: [
+                `${v.x + n.x}px ${v.y + n.y}px ${v.z}`,
+                `${h.x}px ${h.y}px ${h.z}`
+              ]
+            },
+            options: b
+          }).then(() => {
+            e.dragOperation.status.dragging || (this.droppable.shape = void 0);
+          });
+        }
+      });
+    });
+  }
+  get manager() {
+    return this.draggable.manager;
+  }
+  set manager(e) {
+    w(() => {
+      this.draggable.manager = e, this.droppable.manager = e;
+    });
+  }
+  set element(e) {
+    w(() => {
+      const t = $(this, j), r = this.droppable.element, i = this.draggable.element;
+      (!r || r === t) && (this.droppable.element = e), (!i || i === t) && (this.draggable.element = e), G(this, j, e);
+    });
+  }
+  get element() {
+    var e, t;
+    const r = $(this, j);
+    if (r)
+      return (t = (e = Ge.get(r)) != null ? e : r) != null ? t : this.droppable.element;
+  }
+  set target(e) {
+    this.droppable.element = e;
+  }
+  get target() {
+    return this.droppable.element;
+  }
+  set source(e) {
+    this.draggable.element = e;
+  }
+  get source() {
+    return this.draggable.element;
+  }
+  get disabled() {
+    return this.draggable.disabled && this.droppable.disabled;
+  }
+  set feedback(e) {
+    this.draggable.feedback = e;
+  }
+  set disabled(e) {
+    w(() => {
+      this.droppable.disabled = e, this.draggable.disabled = e;
+    });
+  }
+  set data(e) {
+    w(() => {
+      this.droppable.data = e, this.draggable.data = e;
+    });
+  }
+  set handle(e) {
+    this.draggable.handle = e;
+  }
+  set id(e) {
+    w(() => {
+      this.droppable.id = e, this.draggable.id = e;
+    });
+  }
+  get id() {
+    return this.droppable.id;
+  }
+  set sensors(e) {
+    this.draggable.sensors = e;
+  }
+  set modifiers(e) {
+    this.draggable.modifiers = e;
+  }
+  set collisionPriority(e) {
+    this.droppable.collisionPriority = e;
+  }
+  set collisionDetector(e) {
+    this.droppable.collisionDetector = e ?? me;
+  }
+  set alignment(e) {
+    this.draggable.alignment = e;
+  }
+  get alignment() {
+    return this.draggable.alignment;
+  }
+  set type(e) {
+    w(() => {
+      this.droppable.type = e, this.draggable.type = e;
+    });
+  }
+  get type() {
+    return this.draggable.type;
+  }
+  set accept(e) {
+    this.droppable.accept = e;
+  }
+  get accept() {
+    return this.droppable.accept;
+  }
+  get isDropTarget() {
+    return this.droppable.isDropTarget;
+  }
+  /**
+   * A boolean indicating whether the sortable item is the source of a drag operation.
+   */
+  get isDragSource() {
+    return this.draggable.isDragSource;
+  }
+  /**
+   * A boolean indicating whether the sortable item is being dragged.
+   */
+  get isDragging() {
+    return this.draggable.isDragging;
+  }
+  /**
+   * A boolean indicating whether the sortable item is being dropped.
+   */
+  get isDropping() {
+    return this.draggable.isDropping;
+  }
+  get status() {
+    return this.draggable.status;
+  }
+  refreshShape() {
+    return this.droppable.refreshShape();
+  }
+  accepts(e) {
+    return this.droppable.accepts(e);
+  }
+};
+E = Ve();
+X = /* @__PURE__ */ new WeakMap();
+B = /* @__PURE__ */ new WeakMap();
+L = /* @__PURE__ */ new WeakMap();
+Y = /* @__PURE__ */ new WeakMap();
+j = /* @__PURE__ */ new WeakMap();
+_e(E, 4, "index", Ie, Z, X);
+_e(E, 4, "group", ye, Z, Y);
+Fe(E, Z);
+var Oe = class extends De {
+  constructor(e, t, r) {
+    super(e, t), this.sortable = r;
+  }
+  get index() {
+    return this.sortable.index;
+  }
+  get initialIndex() {
+    return this.sortable.initialIndex;
+  }
+  get group() {
+    return this.sortable.group;
+  }
+  get initialGroup() {
+    return this.sortable.initialGroup;
+  }
+}, ee = class extends Pe {
+  constructor(e, t, r) {
+    super(e, t), this.sortable = r;
+  }
+  get index() {
+    return this.sortable.index;
+  }
+  get group() {
+    return this.sortable.group;
+  }
 };
 export {
-  s as useTextTruncation
+  rt as OptimisticSortingPlugin,
+  Z as Sortable,
+  Oe as SortableDraggable,
+  ee as SortableDroppable,
+  Ke as SortableKeyboardPlugin,
+  st as defaultSortableTransition,
+  T as isSortable
 };
 //# sourceMappingURL=fondue-components84.js.map