import { computed as _, watchEffect as D } from "vue";
import { useEventListener as E } from "./useEventListener.js";
const l = {
  item: "sortable__item",
  animate: "sortable__animate"
}, f = (a) => a.getBoundingClientRect().y, L = (a) => {
  const { y: c, height: e } = a.getBoundingClientRect();
  return c + Math.ceil(e / 2);
}, S = (a) => {
  const { y: c, height: e } = a.getBoundingClientRect();
  return c + e;
};
function M(a, c) {
  const e = {
    item: void 0,
    options() {
      var t;
      return [...((t = a.value) == null ? void 0 : t.children) ?? []];
    }
  }, p = _(() => e.options()), y = c.shakeBuffer ?? 10, w = c.reorderDelay ?? 100;
  function v(t) {
    const n = c.handle ? this.querySelector(c.handle) : null;
    n && (n && !n.contains(t.target) || (this.classList.remove(l.animate), this.classList.add(l.item), e.item = {
      el: this,
      y: t.y,
      dy: 0,
      orderChanged: !1
    }));
  }
  function C(t) {
    const n = e.options();
    return n.slice(0, n.indexOf(t));
  }
  function b(t) {
    const n = e.options();
    return n.slice(n.indexOf(t) + 1);
  }
  function B(t, n) {
    const i = e.options().filter((s) => s !== n), r = i.indexOf(t);
    return i.splice(r, 0, n), i;
  }
  function A(t, n) {
    const i = e.options().filter((s) => s !== n), r = i.indexOf(t);
    return i.splice(r + 1, 0, n), i;
  }
  function O(t, n) {
    t.dy = n - t.y, t.el.style.setProperty("transform", `translateY(${t.dy}px)`);
  }
  function g(t) {
    var x;
    if (!e.item)
      return;
    const { el: n } = e.item;
    if (!n.isConnected) {
      e.item = void 0;
      return;
    }
    const i = t.map((o) => f(o)), r = f(n);
    (x = a.value) == null || x.replaceChildren(...t);
    const s = f(n), u = t.map((o) => f(o)), m = [];
    for (let o = 0; o < u.length; o++) {
      const h = t[o];
      if (h === e.item.el)
        continue;
      const P = u[o], Y = i[o] - P;
      h.style.transform = `translateY(${Y}px)`, m.push(h);
    }
    const d = s - r;
    e.item.y = e.item.y + d, e.item.dy = e.item.dy - d, e.item.orderChanged = !0, e.item.el.style.setProperty("transform", `translateY(${e.item.dy}px)`), m.forEach((o) => o.classList.remove(l.animate)), requestAnimationFrame(function() {
      m.forEach((o) => {
        o.classList.add(l.animate), o.style.transform = "", o.addEventListener("transitionend", () => {
          o.classList.remove(l.animate);
        });
      });
    });
  }
  E(window, "mousemove", (t) => {
    if (!e.item)
      return;
    const { el: n } = e.item;
    O(e.item, t.y);
    const i = f(e.item.el), r = S(e.item.el), s = C(n), u = b(n);
    s.forEach((m) => {
      const d = L(m);
      i + y < d && g(B(m, n));
    }), u.forEach((m) => {
      const d = L(m);
      r - y > d && g(A(m, n));
    });
  }), E(window, "mouseup", () => {
    if (!e.item)
      return;
    const { el: t, orderChanged: n } = e.item;
    t.classList.add(l.animate), t.style.removeProperty("transform"), t.addEventListener("transitionend", () => {
      t.classList.remove(l.animate, l.item);
    }), setTimeout(() => {
      if (!n)
        return;
      const i = e.options().map((s) => Number(s.getAttribute("data-index"))), r = a.value;
      if (r) {
        for (const s of e.options())
          r.removeChild(s);
        p.value.forEach((s) => {
          r.appendChild(s);
        });
      }
      c.onChange(i);
    }, w), e.item = void 0;
  }), D(() => {
    p.value.forEach((t, n) => {
      t.removeEventListener("mousedown", v), t.addEventListener("mousedown", v), t.setAttribute("data-index", String(n));
    });
  });
}
export {
  M as useSortable
};
//# sourceMappingURL=useSortable.js.map
