diff --git a/dist/swapy.d.ts b/dist/swapy.d.ts
index 2ec9f20..4d15462 100644
--- a/dist/swapy.d.ts
+++ b/dist/swapy.d.ts
@@ -3,15 +3,22 @@ declare type AnimationType = 'dynamic' | 'spring' | 'none';
 declare type Config = {
     animation: AnimationType;
     continuousMode: boolean;
+    manualSwap: boolean;
 };
 
 export declare function createSwapy(root: Element | null, userConfig?: Partial<Config>): SwapyApi;
 
+declare type RequireOnlyOne<T, Keys extends keyof T = keyof T> = Keys extends keyof T ? {
+    [K in Keys]: T[K];
+} & Partial<Record<Exclude<keyof T, Keys>, never>> : never;
+
 declare type SwapCallback = (event: SwapEventData) => void;
 
+declare type SwapData = RequireOnlyOne<SwapEventDataData, 'map' | 'array' | 'object'>;
+
 declare type SwapEventArray = Array<{
-    slot: string;
-    item: string | null;
+    slotId: string;
+    itemId: string | null;
 }>;
 
 declare interface SwapEventData {
@@ -31,6 +38,8 @@ declare type SwapEventObject = Record<string, string | null>;
 declare interface SwapyApi {
     onSwap(callback: SwapCallback): void;
     enable(enabled: boolean): void;
+    destroy(): void;
+    setData(swapData: SwapData): void;
 }
 
 export { }
diff --git a/dist/swapy.js b/dist/swapy.js
index 0ed6a4b..388fc1c 100644
--- a/dist/swapy.js
+++ b/dist/swapy.js
@@ -1,6 +1,6 @@
 var Ot = Object.defineProperty;
-var Wt = (n, t, e) => t in n ? Ot(n, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : n[t] = e;
-var R = (n, t, e) => Wt(n, typeof t != "symbol" ? t + "" : t, e);
+var Dt = (n, t, e) => t in n ? Ot(n, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : n[t] = e;
+var x = (n, t, e) => Dt(n, typeof t != "symbol" ? t + "" : t, e);
 function Ct(n, t) {
   if (n.size !== t.size)
     return !1;
@@ -9,25 +9,25 @@ function Ct(n, t) {
       return !1;
   return !0;
 }
-let Dt = 0;
+let Wt = 0;
 function qt() {
-  return Dt++ + "";
+  return Wt++ + "";
 }
-var Ut = Object.defineProperty, Ht = (n, t, e) => t in n ? Ut(n, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : n[t] = e, a = (n, t, e) => (Ht(n, typeof t != "symbol" ? t + "" : t, e), e);
-class Y {
+var Ut = Object.defineProperty, Ht = (n, t, e) => t in n ? Ut(n, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : n[t] = e, a = (n, t, e) => Ht(n, typeof t != "symbol" ? t + "" : t, e);
+class K {
   constructor(t) {
     a(this, "x"), a(this, "y"), a(this, "target"), this.x = t.x, this.y = t.y, this.target = t.target;
   }
 }
-class Nt extends Y {
+class Lt extends K {
 }
-class et extends Y {
+class rt extends K {
 }
-class it extends Y {
+class nt extends K {
 }
-class st extends Y {
+class at extends K {
 }
-class Lt {
+class Nt {
   constructor(t) {
     a(this, "pluginId"), a(this, "pluginName"), a(this, "viewName"), a(this, "dataName"), a(this, "dataValue"), this.event = t, this.pluginId = t.pluginId, this.pluginName = t.pluginName, this.viewName = t.viewName, this.dataName = t.dataName, this.dataValue = t.dataValue;
   }
@@ -40,17 +40,17 @@ function Yt(n) {
 function yt(n) {
   return n.split("").map((t, e) => t.toUpperCase() === t ? `${e !== 0 ? "-" : ""}${t.toLowerCase()}` : t).join("");
 }
-class q {
+class Y {
   constructor(t) {
     a(this, "node"), this.node = t.node;
   }
 }
-class G {
+class Q {
   constructor(t) {
     a(this, "node"), this.node = t.node;
   }
 }
-class Xt {
+class jt {
   constructor(t) {
     a(this, "_eventBus"), a(this, "_observer"), this._eventBus = t, this._observer = new MutationObserver(this._handler.bind(this)), this._observer.observe(document.body, {
       childList: !0,
@@ -61,39 +61,37 @@ class Xt {
   }
   _handler(t) {
     t.forEach((e) => {
-      e.addedNodes.forEach((r) => {
-        if (!(r instanceof HTMLElement) || r.dataset.velViewId || r.parentElement && typeof r.parentElement.dataset.velAdded < "u")
-          return;
-        let s = r;
-        if (r.dataset.velView || (s = r.querySelector("[data-vel-view][data-vel-plugin]")), !s)
+      e.addedNodes.forEach((s) => {
+        if (!(s instanceof HTMLElement) || s.dataset.velViewId || s.parentElement && typeof s.parentElement.dataset.velAdded < "u")
           return;
-        this._eventBus.emitEvent(q, { node: s });
-        const o = s.querySelectorAll("[data-vel-plugin]");
+        let r = s;
+        if (s.dataset.velView || (r = s.querySelector("[data-vel-view][data-vel-plugin]")), !r) return;
+        this._eventBus.emitEvent(Y, { node: r });
+        const o = r.querySelectorAll("[data-vel-plugin]");
         o.length && o.forEach((l) => {
-          this._eventBus.emitEvent(q, { node: l });
+          this._eventBus.emitEvent(Y, { node: l });
         });
-      }), e.removedNodes.forEach((r) => {
-        if (!(r instanceof HTMLElement) || typeof r.dataset.velProcessing < "u")
-          return;
-        const s = r.querySelectorAll("[data-vel-plugin]");
-        s.length && s.forEach((o) => {
-          this._eventBus.emitEvent(G, { node: o });
-        }), this._eventBus.emitEvent(G, { node: r });
+      }), e.removedNodes.forEach((s) => {
+        if (!(s instanceof HTMLElement) || typeof s.dataset.velProcessing < "u") return;
+        const r = s.querySelectorAll("[data-vel-plugin]");
+        r.length && r.forEach((o) => {
+          this._eventBus.emitEvent(Q, { node: o });
+        }), this._eventBus.emitEvent(Q, { node: s });
       });
       const i = e.attributeName;
-      if (i === "data-vel-view" && this._eventBus.emitEvent(q, {
+      if (i === "data-vel-view" && this._eventBus.emitEvent(Y, {
         node: e.target
       }), i && /data-vel-data-.+/gi.test(i)) {
-        const r = e.target, s = r.dataset.velPluginId || "", o = r.dataset.velPlugin || "", l = r.dataset.velView || "", h = r.getAttribute(i);
+        const s = e.target, r = s.dataset.velPluginId || "", o = s.dataset.velPlugin || "", l = s.dataset.velView || "", h = s.getAttribute(i);
         if (h && h !== e.oldValue) {
-          const d = Yt(
+          const g = Yt(
             i.replace("data-vel-data-", "")
           );
-          this._eventBus.emitEvent(Lt, {
-            pluginId: s,
+          this._eventBus.emitEvent(Nt, {
+            pluginId: r,
             pluginName: o,
             viewName: l,
-            dataName: d,
+            dataName: g,
             dataValue: h
           });
         }
@@ -101,12 +99,12 @@ class Xt {
     });
   }
 }
-class jt {
+class Xt {
   execute(t) {
     this.call(t);
   }
 }
-class Vt extends jt {
+class Vt extends Xt {
   constructor(t) {
     super(), a(this, "_handler"), this._handler = t;
   }
@@ -117,7 +115,7 @@ class Vt extends jt {
     this._handler(t);
   }
 }
-class Z {
+class tt {
   constructor() {
     a(this, "_listeners", /* @__PURE__ */ new Map()), a(this, "_keyedListeners", /* @__PURE__ */ new Map());
   }
@@ -126,50 +124,49 @@ class Z {
       this._subscribeToKeyedEvent(t, e, i);
       return;
     }
-    let r = this._listeners.get(t);
-    r || (r = [], this._listeners.set(t, r)), r.push(new Vt(e));
+    let s = this._listeners.get(t);
+    s || (s = [], this._listeners.set(t, s)), s.push(new Vt(e));
   }
   removeEventListener(t, e, i) {
     if (i) {
       this._removeKeyedEventListener(t, e, i);
       return;
     }
-    let r = this._listeners.get(t);
-    r && (r = r.filter(
-      (s) => s.getHandler() !== e
-    ), this._listeners.set(t, r));
+    let s = this._listeners.get(t);
+    s && (s = s.filter(
+      (r) => r.getHandler() !== e
+    ), this._listeners.set(t, s));
   }
   _subscribeToKeyedEvent(t, e, i) {
-    let r = this._keyedListeners.get(t);
-    r || (r = /* @__PURE__ */ new Map(), this._keyedListeners.set(t, r));
-    let s = r.get(i);
-    s || (s = [], r.set(i, s)), s.push(new Vt(e));
+    let s = this._keyedListeners.get(t);
+    s || (s = /* @__PURE__ */ new Map(), this._keyedListeners.set(t, s));
+    let r = s.get(i);
+    r || (r = [], s.set(i, r)), r.push(new Vt(e));
   }
   _removeKeyedEventListener(t, e, i) {
-    let r = this._keyedListeners.get(t);
-    if (!r)
+    let s = this._keyedListeners.get(t);
+    if (!s)
       return;
-    let s = r.get(i);
-    s && (s = s.filter(
+    let r = s.get(i);
+    r && (r = r.filter(
       (o) => o.getHandler() !== e
-    ), r.set(i, s));
+    ), s.set(i, r));
   }
   emitEvent(t, e, i) {
     if (i) {
       this._emitKeyedEvent(t, e, i);
       return;
     }
-    const r = this._listeners.get(t);
-    r && r.forEach((s) => {
-      s.execute(e);
+    const s = this._listeners.get(t);
+    s && s.forEach((r) => {
+      r.execute(e);
     });
   }
   _emitKeyedEvent(t, e, i) {
-    const r = this._keyedListeners.get(t);
-    if (!r)
-      return;
-    const s = r.get(i);
-    s && s.forEach((o) => {
+    const s = this._keyedListeners.get(t);
+    if (!s) return;
+    const r = s.get(i);
+    r && r.forEach((o) => {
       o.execute(e);
     });
   }
@@ -215,8 +212,8 @@ function St() {
   return Kt++ + "";
 }
 class Bt {
-  constructor(t, e, i, r, s, o, l) {
-    a(this, "_registry"), a(this, "_eventBus"), a(this, "_appEventBus"), a(this, "_internalEventBus"), a(this, "_initialized", !1), a(this, "_config"), a(this, "_pluginFactory"), a(this, "_pluginName"), a(this, "_id"), a(this, "_pluginKey"), a(this, "_layoutIdViewMapWaitingToEnter"), a(this, "_apiData"), a(this, "_isReady", !1), this._id = St(), this._pluginFactory = t, this._pluginName = e, this._registry = i, this._eventBus = r, this._appEventBus = s, this._internalEventBus = new Z(), this._config = o, this._layoutIdViewMapWaitingToEnter = /* @__PURE__ */ new Map(), this._pluginKey = l, this._apiData = {}, this._appEventBus.subscribeToPluginReadyEvent(
+  constructor(t, e, i, s, r, o, l) {
+    a(this, "_registry"), a(this, "_eventBus"), a(this, "_appEventBus"), a(this, "_internalEventBus"), a(this, "_initialized", !1), a(this, "_config"), a(this, "_pluginFactory"), a(this, "_pluginName"), a(this, "_id"), a(this, "_pluginKey"), a(this, "_layoutIdViewMapWaitingToEnter"), a(this, "_apiData"), a(this, "_isReady", !1), this._id = St(), this._pluginFactory = t, this._pluginName = e, this._registry = i, this._eventBus = s, this._appEventBus = r, this._internalEventBus = new tt(), this._config = o, this._layoutIdViewMapWaitingToEnter = /* @__PURE__ */ new Map(), this._pluginKey = l, this._apiData = {}, this._appEventBus.subscribeToPluginReadyEvent(
       () => {
         this._isReady = !0;
       },
@@ -264,10 +261,10 @@ class Bt {
     return this._internalEventBus;
   }
   emit(t, e) {
-    this._internalEventBus.emitEvent(t, e);
+    this._internalEventBus.emitEvent(t, e, this.pluginKey);
   }
   on(t, e) {
-    this._internalEventBus.subscribeToEvent(t, e);
+    this._internalEventBus.subscribeToEvent(t, e, this.pluginKey);
   }
   removeListener(t, e) {
     this._internalEventBus.removeEventListener(t, e);
@@ -294,12 +291,12 @@ class Bt {
     requestAnimationFrame(() => {
       var i;
       (i = e.onRemoveCallback) == null || i.call(e, e, () => {
-        var r, s;
-        if ((r = t.onAddCallbacks) != null && r.afterRemoved && t.layoutId) {
+        var s, r;
+        if ((s = t.onAddCallbacks) != null && s.afterRemoved && t.layoutId) {
           const o = this._layoutIdViewMapWaitingToEnter.get(
             t.layoutId
           );
-          (s = o == null ? void 0 : o.onAddCallbacks) == null || s.afterEnter(o), this._layoutIdViewMapWaitingToEnter.delete(t.layoutId);
+          (r = o == null ? void 0 : o.onAddCallbacks) == null || r.afterEnter(o), this._layoutIdViewMapWaitingToEnter.delete(t.layoutId);
         }
         this._deleteView(e, !0);
       }), setTimeout(() => {
@@ -313,12 +310,12 @@ class Bt {
   // This is a temporary view for deleted view. We need to create it
   // to show it again so the user can animate it before it disappears.
   _createTemporaryView(t) {
-    const e = t.previousRect.viewportOffset, i = t.previousRect.size, r = t.rotation.degrees < 0 ? 0 : Math.sin(t.rotation.radians) * i.height * t.scale.y, s = t.rotation.degrees > 0 ? 0 : Math.sin(t.rotation.radians) * i.width * t.scale.y, o = t.element.cloneNode(!0);
-    t.element.remove(), o.style.cssText = "", o.style.position = "absolute", o.style.left = `${e.left + r}px`, o.style.top = `${e.top - s}px`, o.style.width = `${i.width}px`, o.style.height = `${i.height}px`, o.style.transform = `
+    const e = t.previousRect.viewportOffset, i = t.previousRect.size, s = t.rotation.degrees < 0 ? 0 : Math.sin(t.rotation.radians) * i.height * t.scale.y, r = t.rotation.degrees > 0 ? 0 : Math.sin(t.rotation.radians) * i.width * t.scale.y, o = t.element.cloneNode(!0);
+    t.element.remove(), o.style.cssText = "", o.style.position = "absolute", o.style.left = `${e.left + s}px`, o.style.top = `${e.top - r}px`, o.style.width = `${i.width}px`, o.style.height = `${i.height}px`, o.style.transform = `
       scale3d(${t.scale.x}, ${t.scale.y}, 1) rotate(${t.rotation.degrees}deg)
     `, o.style.pointerEvents = "none", o.dataset.velRemoved = "", document.body.appendChild(o);
     const l = this._registry.createView(o, t.name);
-    return l.setAsTemporaryView(), l.styles.position = "absolute", l.styles.left = `${e.left + r}px`, l.styles.top = `${e.top - s}px`, l.rotation.setDegrees(t.rotation.degrees, !1), l.scale.set({ x: t.scale.x, y: t.scale.y }, !1), l.size.set(
+    return l.setAsTemporaryView(), l.styles.position = "absolute", l.styles.left = `${e.left + s}px`, l.styles.top = `${e.top - r}px`, l.rotation.setDegrees(t.rotation.degrees, !1), l.scale.set({ x: t.scale.x, y: t.scale.y }, !1), l.size.set(
       { width: t._localWidth, height: t._localHeight },
       !1
     ), t._copyAnimatorsToAnotherView(l), t.onRemoveCallback && l.onRemove(t.onRemoveCallback), l;
@@ -330,10 +327,10 @@ class Bt {
     this.onViewAdded(t), this._invokeAddCallbacks(t);
   }
   _invokeAddCallbacks(t) {
-    var e, i, r;
-    !((e = t.onAddCallbacks) != null && e.onInitialLoad) && !this._initialized || ((i = t.onAddCallbacks) == null || i.beforeEnter(t), !((r = t.onAddCallbacks) != null && r.afterRemoved) || !this._initialized ? requestAnimationFrame(() => {
-      var s;
-      (s = t.onAddCallbacks) == null || s.afterEnter(t);
+    var e, i, s;
+    !((e = t.onAddCallbacks) != null && e.onInitialLoad) && !this._initialized || ((i = t.onAddCallbacks) == null || i.beforeEnter(t), !((s = t.onAddCallbacks) != null && s.afterRemoved) || !this._initialized ? requestAnimationFrame(() => {
+      var r;
+      (r = t.onAddCallbacks) == null || r.afterEnter(t);
     }) : t.layoutId && this._layoutIdViewMapWaitingToEnter.set(t.layoutId, t));
   }
   // @ts-ignore
@@ -367,7 +364,7 @@ class Gt extends Bt {
     t.setPluginId(this.id), super.addView(t);
   }
 }
-class rt extends Bt {
+class ot extends Bt {
   isRenderable() {
     return !1;
   }
@@ -425,7 +422,7 @@ class Zt {
     this._plugin.subscribeToEvents = t;
   }
 }
-function j(n, t, e, i, r, s) {
+function Z(n, t, e, i, s, r) {
   if (Jt(n))
     return new n(
       n,
@@ -433,8 +430,8 @@ function j(n, t, e, i, r, s) {
       t,
       e,
       i,
-      r,
-      s
+      s,
+      r
     );
   const o = new Gt(
     n,
@@ -442,8 +439,8 @@ function j(n, t, e, i, r, s) {
     t,
     e,
     i,
-    r,
-    s
+    s,
+    r
   ), l = new Zt(o);
   return n(l), o;
 }
@@ -503,42 +500,42 @@ class Qt {
   _observe() {
     var t;
     const e = new MutationObserver(() => {
-      var s;
-      (s = this._callback) == null || s.call(this, !1);
+      var r;
+      (r = this._callback) == null || r.call(this, !1);
     }), i = {
       attributes: !0,
       childList: !0,
       attributeOldValue: !0
     };
     e.observe(this._element, i), new ResizeObserver(() => {
-      var s;
-      (s = this._callback) == null || s.call(this, !0);
+      var r;
+      (r = this._callback) == null || r.call(this, !0);
     }).observe(this._element);
-    function r(s, o) {
+    function s(r, o) {
       let l, h = !0;
       return function() {
-        h && (s(), h = !1), clearTimeout(l), l = setTimeout(() => {
-          s(), h = !0;
+        h && (r(), h = !1), clearTimeout(l), l = setTimeout(() => {
+          r(), h = !0;
         }, o);
       };
     }
     (t = this._element.parentElement) == null || t.addEventListener(
       "scroll",
-      r(() => {
-        var s;
-        (s = this._callback) == null || s.call(this, !0);
+      s(() => {
+        var r;
+        (r = this._callback) == null || r.call(this, !0);
       }, 30)
     ), window.addEventListener(
       "scroll",
-      r(() => {
-        var s;
-        (s = this._callback) == null || s.call(this, !0);
+      s(() => {
+        var r;
+        (r = this._callback) == null || r.call(this, !0);
       }, 30)
     ), window.addEventListener(
       "resize",
-      r(() => {
-        var s;
-        (s = this._callback) == null || s.call(this, !0);
+      s(() => {
+        var r;
+        (r = this._callback) == null || r.call(this, !0);
       }, 30)
     );
   }
@@ -557,28 +554,26 @@ function _(n, t) {
   const e = n - t;
   return Math.abs(e) <= 0.01;
 }
-function V(n) {
+function b(n) {
   let t = n.match(/^([\d.]+)([a-zA-Z%]*)$/);
   t || (t = "0px".match(/^([\d.]+)([a-zA-Z%]*)$/));
   const e = parseFloat(t[1]), i = t[2];
   return { value: e, unit: i, valueWithUnit: n };
 }
 function ie(n, t, e = !1) {
-  if (n === t)
-    return !0;
-  if (n.length !== t.length)
-    return !1;
+  if (n === t) return !0;
+  if (n.length !== t.length) return !1;
   for (let i = 0; i < n.length; i++)
     if (e && !_(n[i].value, t[i].value) || n[i].value !== t[i].value)
       return !1;
   return !0;
 }
-function Pt(n, t) {
+function bt(n, t) {
   return ie(n, t, !0);
 }
-class B {
-  constructor(t, e, i, r) {
-    a(this, "_topLeft"), a(this, "_topRight"), a(this, "_bottomLeft"), a(this, "_bottomRight"), this._topLeft = t, this._topRight = e, this._bottomLeft = i, this._bottomRight = r;
+class z {
+  constructor(t, e, i, s) {
+    a(this, "_topLeft"), a(this, "_topRight"), a(this, "_bottomLeft"), a(this, "_bottomRight"), this._topLeft = t, this._topRight = e, this._bottomLeft = i, this._bottomRight = s;
   }
   get value() {
     return {
@@ -592,33 +587,33 @@ class B {
     return _(this.value.topLeft.value, t.value.topLeft.value) && _(this.value.topRight.value, t.value.topRight.value) && _(this.value.bottomRight.value, t.value.bottomRight.value) && _(this.value.bottomLeft.value, t.value.bottomLeft.value);
   }
   toCssPercentageForNewSize(t) {
-    const e = this._convertToPercentage(this._topLeft, t), i = this._convertToPercentage(this._topRight, t), r = this._convertToPercentage(this._bottomLeft, t), s = this._convertToPercentage(this._bottomRight, t);
-    return `${e.h} ${i.h} ${s.h} ${r.h} / ${e.v} ${i.v} ${s.v} ${r.v}`;
+    const e = this._convertToPercentage(this._topLeft, t), i = this._convertToPercentage(this._topRight, t), s = this._convertToPercentage(this._bottomLeft, t), r = this._convertToPercentage(this._bottomRight, t);
+    return `${e.h} ${i.h} ${r.h} ${s.h} / ${e.v} ${i.v} ${r.v} ${s.v}`;
   }
   _convertToPercentage(t, e) {
     if (t.unit === "%")
       return { h: `${t.value}%`, v: `${t.value}%` };
-    const i = t.value / e.width * 100, r = t.value / e.height * 100;
-    return { h: `${i}%`, v: `${r}%` };
+    const i = t.value / e.width * 100, s = t.value / e.height * 100;
+    return { h: `${i}%`, v: `${s}%` };
   }
 }
-function J(n) {
-  const t = n.split(" ").map((i) => V(i)), e = {
+function et(n) {
+  const t = n.split(" ").map((i) => b(i)), e = {
     value: 0,
     unit: "",
     valueWithUnit: "0"
   };
   switch (t.length) {
     case 1:
-      return new B(t[0], t[0], t[0], t[0]);
+      return new z(t[0], t[0], t[0], t[0]);
     case 2:
-      return new B(t[0], t[1], t[0], t[1]);
+      return new z(t[0], t[1], t[0], t[1]);
     case 3:
-      return new B(t[0], t[1], t[2], t[1]);
+      return new z(t[0], t[1], t[2], t[1]);
     case 4:
-      return new B(t[0], t[1], t[3], t[2]);
+      return new z(t[0], t[1], t[3], t[2]);
     default:
-      return new B(
+      return new z(
         e,
         e,
         e,
@@ -627,32 +622,32 @@ function J(n) {
   }
 }
 function se(n, t) {
-  const e = o(n.topLeft, t), i = o(n.topRight, t), r = o(n.bottomLeft, t), s = o(n.bottomRight, t);
+  const e = o(n.topLeft, t), i = o(n.topRight, t), s = o(n.bottomLeft, t), r = o(n.bottomRight, t);
   return {
     v: {
       topLeft: e.v,
       topRight: i.v,
-      bottomRight: s.v,
-      bottomLeft: r.v
+      bottomRight: r.v,
+      bottomLeft: s.v
     },
     h: {
       topLeft: e.h,
       topRight: i.h,
-      bottomRight: s.h,
-      bottomLeft: r.h
+      bottomRight: r.h,
+      bottomLeft: s.h
     }
   };
   function o(l, h) {
     if (l.unit === "%")
       return {
-        h: V(`${l.value}%`),
-        v: V(`${l.value}%`)
+        h: b(`${l.value}%`),
+        v: b(`${l.value}%`)
       };
-    const d = l.value / h.width * 100, c = l.value / h.height * 100;
-    return { h: V(`${d}%`), v: V(`${c}%`) };
+    const g = l.value / h.width * 100, d = l.value / h.height * 100;
+    return { h: b(`${g}%`), v: b(`${d}%`) };
   }
 }
-function bt(n, t) {
+function Pt(n, t) {
   return _(n.topLeft.value, t.topLeft.value) && _(n.topRight.value, t.topRight.value) && _(n.bottomRight.value, t.bottomRight.value) && _(n.bottomLeft.value, t.bottomLeft.value);
 }
 class re {
@@ -678,14 +673,14 @@ class ae {
   }
 }
 function oe(n, t) {
-  const [e, i] = n.split(" "), r = V(e), s = V(i);
+  const [e, i] = n.split(" "), s = b(e), r = b(i);
   return new ae(
-    r.value / t.width,
-    s.value / t.height
+    s.value / t.width,
+    r.value / t.height
   );
 }
 function Et(n, t) {
-  const e = le(n), i = n.offsetWidth, r = n.offsetHeight;
+  const e = le(n), i = n.offsetWidth, s = n.offsetHeight;
   return {
     viewportOffset: {
       left: Math.round(e.left),
@@ -695,11 +690,11 @@ function Et(n, t) {
     },
     pageOffset: t.read({
       width: i,
-      height: r
+      height: s
     }),
     size: {
       width: i,
-      height: r
+      height: s
     }
   };
 }
@@ -732,10 +727,10 @@ class he {
   read(t) {
     if (this._isSvg)
       return this._currentPageRect || (this._currentPageRect = Rt(this._element)), this._currentPageRect;
-    const e = this._element.parentElement, i = this._element.offsetLeft, r = this._element.offsetTop, s = t.width, o = t.height, l = (e == null ? void 0 : e.offsetWidth) || 0, h = (e == null ? void 0 : e.offsetHeight) || 0;
-    return (this._offsetLeft !== i || this._offsetTop !== r || !_(this._width, s) || !_(this._height, o)) && this._view._children.forEach(
-      (d) => d.elementReader.invalidatePageRect()
-    ), !this._invalid && this._currentPageRect && this._offsetLeft === i && this._offsetTop === r && _(this._width, s) && _(this._height, o) && _(this._parentWidth, l) && _(this._parentHeight, h) && this._parentEl === e ? this._currentPageRect : (this._offsetLeft = i, this._offsetTop = r, this._width = s, this._height = o, this._parentWidth = l, this._parentHeight = h, this._parentEl = e, this._currentPageRect = Rt(this._element), this._invalid = !1, this._currentPageRect);
+    const e = this._element.parentElement, i = this._element.offsetLeft, s = this._element.offsetTop, r = t.width, o = t.height, l = (e == null ? void 0 : e.offsetWidth) || 0, h = (e == null ? void 0 : e.offsetHeight) || 0;
+    return (this._offsetLeft !== i || this._offsetTop !== s || !_(this._width, r) || !_(this._height, o)) && this._view._children.forEach(
+      (g) => g.elementReader.invalidatePageRect()
+    ), !this._invalid && this._currentPageRect && this._offsetLeft === i && this._offsetTop === s && _(this._width, r) && _(this._height, o) && _(this._parentWidth, l) && _(this._parentHeight, h) && this._parentEl === e ? this._currentPageRect : (this._offsetLeft = i, this._offsetTop = s, this._width = r, this._height = o, this._parentWidth = l, this._parentHeight = h, this._parentEl = e, this._currentPageRect = Rt(this._element), this._invalid = !1, this._currentPageRect);
   }
 }
 function ue(n) {
@@ -758,7 +753,7 @@ class ce {
     return ne(this._computedStyle.opacity);
   }
   get borderRadius() {
-    return J(this._computedStyle.borderRadius);
+    return et(this._computedStyle.borderRadius);
   }
   get origin() {
     return oe(
@@ -779,17 +774,17 @@ class ce {
 function xt(n) {
   return new ce(n);
 }
-function Q(n, t) {
+function it(n, t) {
   const e = {
-    set: (i, r, s) => (typeof i[r] == "object" && i[r] !== null ? i[r] = Q(s, t) : (t(), i[r] = s), !0),
-    get: (i, r) => typeof i[r] == "object" && i[r] !== null ? Q(i[r], t) : i[r]
+    set: (i, s, r) => (typeof i[s] == "object" && i[s] !== null ? i[s] = it(r, t) : (t(), i[s] = r), !0),
+    get: (i, s) => typeof i[s] == "object" && i[s] !== null ? it(i[s], t) : i[s]
   };
   return new Proxy(n, e);
 }
-const U = 0.01, nt = {
+const j = 0.01, lt = {
   speed: 15
 };
-class at {
+class ht {
   constructor(t) {
     a(this, "name", "dynamic"), a(this, "_config"), this._config = t;
   }
@@ -797,42 +792,42 @@ class at {
     return this._config;
   }
 }
-class de extends at {
-  update({ animatorProp: t, current: e, target: i, dt: r }) {
-    const s = u.sub(i, e), o = u.scale(s, this._config.speed);
-    let l = u.add(e, u.scale(o, r));
+class de extends ht {
+  update({ animatorProp: t, current: e, target: i, dt: s }) {
+    const r = u.sub(i, e), o = u.scale(r, this._config.speed);
+    let l = u.add(e, u.scale(o, s));
     return this._shouldFinish(i, e, o) && (l = i, requestAnimationFrame(() => {
       t.callCompleteCallback();
     })), t.callUpdateCallback(), l;
   }
   _shouldFinish(t, e, i) {
-    return u.sub(t, e).magnitude < U && i.magnitude < U;
+    return u.sub(t, e).magnitude < j && i.magnitude < j;
   }
 }
-class ge extends at {
-  update({ animatorProp: t, current: e, target: i, dt: r }) {
-    const s = (i - e) * this._config.speed;
-    let o = e + s * r;
+class ge extends ht {
+  update({ animatorProp: t, current: e, target: i, dt: s }) {
+    const r = (i - e) * this._config.speed;
+    let o = e + r * s;
     return _(o, i) && (o = i, requestAnimationFrame(() => {
       t.callCompleteCallback();
     })), t.callUpdateCallback(), o;
   }
 }
-class pe extends at {
-  update({ animatorProp: t, current: e, target: i, dt: r }) {
-    return i.map((s, o) => {
-      const l = e[o], h = s.value === 0 ? l.unit : s.unit, d = (s.value - l.value) * this._config.speed, c = l.value + d * r;
-      let p = V(`${c}${h}`);
-      return this._shouldFinish(s.value, l.value, d) && (p = s, requestAnimationFrame(() => {
+class pe extends ht {
+  update({ animatorProp: t, current: e, target: i, dt: s }) {
+    return i.map((r, o) => {
+      const l = e[o], h = r.value === 0 ? l.unit : r.unit, g = (r.value - l.value) * this._config.speed, d = l.value + g * s;
+      let p = b(`${d}${h}`);
+      return this._shouldFinish(r.value, l.value, g) && (p = r, requestAnimationFrame(() => {
         t.callCompleteCallback();
       })), t.callUpdateCallback(), p;
     });
   }
   _shouldFinish(t, e, i) {
-    return Math.abs(t - e) < U && Math.abs(i) < U;
+    return Math.abs(t - e) < j && Math.abs(i) < j;
   }
 }
-class ot {
+class ut {
   constructor() {
     a(this, "name", "instant"), a(this, "_config", {});
   }
@@ -845,12 +840,12 @@ class ot {
     }), t.target;
   }
 }
-const lt = {
+const ct = {
   stiffness: 0.5,
   damping: 0.75,
   speed: 10
-}, H = 0.01;
-class ht {
+}, X = 0.01;
+class dt {
   constructor(t) {
     a(this, "name", "spring"), a(this, "_config"), this._config = t;
   }
@@ -858,68 +853,68 @@ class ht {
     return this._config;
   }
 }
-class _e extends ht {
+class _e extends dt {
   constructor() {
     super(...arguments), a(this, "_velocity", new u(0, 0));
   }
-  update({ animatorProp: t, current: e, target: i, dt: r }) {
-    const s = u.scale(
+  update({ animatorProp: t, current: e, target: i, dt: s }) {
+    const r = u.scale(
       u.scale(u.sub(e, i), -1),
       this._config.stiffness
     );
-    this._velocity = u.add(this._velocity, s), this._velocity = u.scale(this._velocity, this._config.damping);
+    this._velocity = u.add(this._velocity, r), this._velocity = u.scale(this._velocity, this._config.damping);
     let o = u.add(
       e,
-      u.scale(this._velocity, r * this._config.speed)
+      u.scale(this._velocity, s * this._config.speed)
     );
     return this._shouldFinish(i, e) && (o = i, requestAnimationFrame(() => {
       t.callCompleteCallback();
     })), o;
   }
   _shouldFinish(t, e) {
-    return u.sub(t, e).magnitude < H && this._velocity.magnitude < H;
+    return u.sub(t, e).magnitude < X && this._velocity.magnitude < X;
   }
 }
-class ve extends ht {
+class me extends dt {
   constructor() {
     super(...arguments), a(this, "_velocity", 0);
   }
-  update({ animatorProp: t, current: e, target: i, dt: r }) {
-    const s = -(e - i) * this._config.stiffness;
-    this._velocity += s, this._velocity *= this._config.damping;
-    let o = e + this._velocity * r * this._config.speed;
+  update({ animatorProp: t, current: e, target: i, dt: s }) {
+    const r = -(e - i) * this._config.stiffness;
+    this._velocity += r, this._velocity *= this._config.damping;
+    let o = e + this._velocity * s * this._config.speed;
     return _(o, i) && (o = i, requestAnimationFrame(() => {
       t.callCompleteCallback();
     })), o;
   }
 }
-class me extends ht {
+class ve extends dt {
   constructor() {
     super(...arguments), a(this, "_velocity", 0);
   }
-  update({ animatorProp: t, current: e, target: i, dt: r }) {
-    return i.map((s, o) => {
-      const l = e[o], h = s.value === 0 ? l.unit : s.unit, d = -(l.value - s.value) * this._config.stiffness;
-      this._velocity += d, this._velocity *= this._config.damping;
-      const c = l.value + this._velocity * r * this._config.speed;
-      let p = V(`${c}${h}`);
-      return this._shouldFinish(s.value, l.value) && (p = s, requestAnimationFrame(() => {
+  update({ animatorProp: t, current: e, target: i, dt: s }) {
+    return i.map((r, o) => {
+      const l = e[o], h = r.value === 0 ? l.unit : r.unit, g = -(l.value - r.value) * this._config.stiffness;
+      this._velocity += g, this._velocity *= this._config.damping;
+      const d = l.value + this._velocity * s * this._config.speed;
+      let p = b(`${d}${h}`);
+      return this._shouldFinish(r.value, l.value) && (p = r, requestAnimationFrame(() => {
         t.callCompleteCallback();
       })), p;
     });
   }
   _shouldFinish(t, e) {
-    return Math.abs(t - e) < H && Math.abs(this._velocity) < H;
+    return Math.abs(t - e) < X && Math.abs(this._velocity) < X;
   }
 }
 function fe(n) {
   return n;
 }
-const ut = {
+const gt = {
   duration: 350,
   ease: fe
 };
-class ct {
+class pt {
   constructor(t) {
     a(this, "name", "tween"), a(this, "_config"), a(this, "_startTime"), this._config = t;
   }
@@ -930,40 +925,40 @@ class ct {
     this._startTime = void 0;
   }
 }
-class we extends ct {
-  update({ animatorProp: t, initial: e, target: i, ts: r }) {
-    this._startTime || (this._startTime = r);
-    const s = Math.min(1, (r - this._startTime) / this._config.duration);
-    return _(s, 1) ? (requestAnimationFrame(() => {
+class we extends pt {
+  update({ animatorProp: t, initial: e, target: i, ts: s }) {
+    this._startTime || (this._startTime = s);
+    const r = Math.min(1, (s - this._startTime) / this._config.duration);
+    return _(r, 1) ? (requestAnimationFrame(() => {
       t.callCompleteCallback();
     }), i) : u.add(
       e,
-      u.scale(u.sub(i, e), this._config.ease(s))
+      u.scale(u.sub(i, e), this._config.ease(r))
     );
   }
 }
-class ye extends ct {
-  update({ animatorProp: t, initial: e, target: i, ts: r }) {
-    this._startTime || (this._startTime = r);
-    const s = Math.min(1, (r - this._startTime) / this._config.duration);
-    return _(s, 1) ? (requestAnimationFrame(() => {
+class ye extends pt {
+  update({ animatorProp: t, initial: e, target: i, ts: s }) {
+    this._startTime || (this._startTime = s);
+    const r = Math.min(1, (s - this._startTime) / this._config.duration);
+    return _(r, 1) ? (requestAnimationFrame(() => {
       t.callCompleteCallback();
     }), i) : e.map((o, l) => {
-      const h = i[l], d = h.value === 0 ? o.unit : h.unit, c = o.value + this._config.ease(s) * (i[l].value - o.value);
-      return V(`${c}${d}`);
+      const h = i[l], g = h.value === 0 ? o.unit : h.unit, d = o.value + this._config.ease(r) * (i[l].value - o.value);
+      return b(`${d}${g}`);
     });
   }
 }
-class Ve extends ct {
-  update({ animatorProp: t, initial: e, target: i, ts: r }) {
-    this._startTime || (this._startTime = r);
-    const s = Math.min(1, (r - this._startTime) / this._config.duration);
-    return _(s, 1) ? (requestAnimationFrame(() => {
+class Ve extends pt {
+  update({ animatorProp: t, initial: e, target: i, ts: s }) {
+    this._startTime || (this._startTime = s);
+    const r = Math.min(1, (s - this._startTime) / this._config.duration);
+    return _(r, 1) ? (requestAnimationFrame(() => {
       t.callCompleteCallback();
-    }), i) : e + (i - e) * this._config.ease(s);
+    }), i) : e + (i - e) * this._config.ease(r);
   }
 }
-class dt {
+class _t {
   createAnimatorByName(t, e) {
     switch (t) {
       case "instant":
@@ -978,55 +973,55 @@ class dt {
     return this.createInstantAnimator();
   }
 }
-class D extends dt {
+class H extends _t {
   createInstantAnimator() {
-    return new ot();
+    return new ut();
   }
   createTweenAnimator(t) {
-    return new we({ ...ut, ...t });
+    return new we({ ...gt, ...t });
   }
   createDynamicAnimator(t) {
-    return new de({ ...nt, ...t });
+    return new de({ ...lt, ...t });
   }
   createSpringAnimator(t) {
-    return new _e({ ...lt, ...t });
+    return new _e({ ...ct, ...t });
   }
 }
-class Pe extends dt {
+class be extends _t {
   createInstantAnimator() {
-    return new ot();
+    return new ut();
   }
   createTweenAnimator(t) {
-    return new ye({ ...ut, ...t });
+    return new ye({ ...gt, ...t });
   }
   createDynamicAnimator(t) {
     return new pe({
-      ...nt,
+      ...lt,
       ...t
     });
   }
   createSpringAnimator(t) {
-    return new me({ ...lt, ...t });
+    return new ve({ ...ct, ...t });
   }
 }
-class At extends dt {
+class At extends _t {
   createInstantAnimator() {
-    return new ot();
+    return new ut();
   }
   createDynamicAnimator(t) {
-    return new ge({ ...nt, ...t });
+    return new ge({ ...lt, ...t });
   }
   createTweenAnimator(t) {
-    return new Ve({ ...ut, ...t });
+    return new Ve({ ...gt, ...t });
   }
   createSpringAnimator(t) {
-    return new ve({ ...lt, ...t });
+    return new me({ ...ct, ...t });
   }
 }
-function F(n) {
+function O(n) {
   return structuredClone(n);
 }
-class be {
+class Pe {
   constructor(t) {
     a(this, "_viewProp"), a(this, "_completeCallback"), a(this, "_updateCallback"), a(this, "_isAnimating"), this._viewProp = t, this._isAnimating = !1;
   }
@@ -1057,9 +1052,9 @@ class be {
     (t = this._updateCallback) == null || t.call(this);
   }
 }
-class I {
+class C {
   constructor(t, e, i) {
-    a(this, "_animatorProp"), a(this, "_animator"), a(this, "_initialValue"), a(this, "_previousValue"), a(this, "_targetValue"), a(this, "_currentValue"), a(this, "_hasChanged"), a(this, "_view"), a(this, "_animatorFactory"), a(this, "_previousRenderValue"), this._animatorProp = new be(this), this._animatorFactory = t, this._initialValue = F(e), this._previousValue = F(e), this._targetValue = F(e), this._currentValue = F(e), this._hasChanged = !1, this._previousRenderValue = void 0, this._view = i, this._animator = this._animatorFactory.createInstantAnimator();
+    a(this, "_animatorProp"), a(this, "_animator"), a(this, "_initialValue"), a(this, "_previousValue"), a(this, "_targetValue"), a(this, "_currentValue"), a(this, "_hasChanged"), a(this, "_view"), a(this, "_animatorFactory"), a(this, "_previousRenderValue"), this._animatorProp = new Pe(this), this._animatorFactory = t, this._initialValue = O(e), this._previousValue = O(e), this._targetValue = O(e), this._currentValue = O(e), this._hasChanged = !1, this._previousRenderValue = void 0, this._view = i, this._animator = this._animatorFactory.createInstantAnimator();
   }
   get shouldRender() {
     return !0;
@@ -1086,8 +1081,8 @@ class I {
     );
   }
   _setTarget(t, e = !0) {
-    var i, r;
-    this._previousValue = F(this._currentValue), this._targetValue = t, e ? ((r = (i = this._animator).reset) == null || r.call(i), this.animator.markAsAnimating()) : this._currentValue = t, this._hasChanged = !0;
+    var i, s;
+    this._previousValue = O(this._currentValue), this._targetValue = t, e ? ((s = (i = this._animator).reset) == null || s.call(i), this.animator.markAsAnimating()) : this._currentValue = t, this._hasChanged = !0;
   }
   hasChanged() {
     return this._hasChanged;
@@ -1099,7 +1094,7 @@ class I {
   update(t, e) {
   }
 }
-class Ee extends I {
+class Ee extends C {
   constructor() {
     super(...arguments), a(this, "_invertedBorderRadius"), a(this, "_forceStyleUpdateThisFrame", !1), a(this, "_updateWithScale", !1);
   }
@@ -1134,7 +1129,7 @@ class Ee extends I {
   set(t, e = !0) {
     let i;
     if (typeof t == "string") {
-      const h = J(t.trim());
+      const h = et(t.trim());
       i = {
         topLeft: h.value.topLeft.valueWithUnit,
         topRight: h.value.topRight.valueWithUnit,
@@ -1143,8 +1138,8 @@ class Ee extends I {
       };
     } else
       i = t;
-    const r = i.topLeft ? V(i.topLeft) : this._currentValue[0], s = i.topRight ? V(i.topRight) : this._currentValue[1], o = i.bottomRight ? V(i.bottomRight) : this._currentValue[2], l = i.bottomLeft ? V(i.bottomLeft) : this._currentValue[3];
-    this._setTarget([r, s, o, l], e);
+    const s = i.topLeft ? b(i.topLeft) : this._currentValue[0], r = i.topRight ? b(i.topRight) : this._currentValue[1], o = i.bottomRight ? b(i.bottomRight) : this._currentValue[2], l = i.bottomLeft ? b(i.bottomLeft) : this._currentValue[3];
+    this._setTarget([s, r, o, l], e);
   }
   reset(t = !0) {
     this._setTarget(this._initialValue, t);
@@ -1154,8 +1149,8 @@ class Ee extends I {
       this._hasChanged = !0, this._forceStyleUpdateThisFrame = !1;
     else if (this._view.scale.isAnimating && this._updateWithScale)
       this._hasChanged = !0;
-    else if (Pt(this._targetValue, this._currentValue)) {
-      this._hasChanged = !Pt(
+    else if (bt(this._targetValue, this._currentValue)) {
+      this._hasChanged = !bt(
         this._targetValue,
         this._initialValue
       );
@@ -1178,7 +1173,7 @@ class Ee extends I {
       return;
     const t = this._rect.size.width * this._view.scale.x, e = this._rect.size.height * this._view.scale.y;
     this._invertedBorderRadius = se(
-      J(
+      et(
         `${this._currentValue[0].valueWithUnit} ${this._currentValue[1].valueWithUnit} ${this._currentValue[2].valueWithUnit} ${this._currentValue[3].valueWithUnit}`
       ).value,
       {
@@ -1188,10 +1183,10 @@ class Ee extends I {
     );
   }
   get shouldRender() {
-    return this._hasChanged ? this._previousRenderValue ? !(bt(
+    return this._hasChanged ? this._previousRenderValue ? !(Pt(
       this.renderValue.v,
       this._previousRenderValue.v
-    ) && bt(this.renderValue.h, this._previousRenderValue.h)) : !0 : !1;
+    ) && Pt(this.renderValue.h, this._previousRenderValue.h)) : !0 : !1;
   }
   get renderValue() {
     return this.invertedBorderRadius ? {
@@ -1230,7 +1225,7 @@ class Ee extends I {
     return !1;
   }
 }
-class Re extends I {
+class Re extends C {
   setFromElementPropValue(t) {
     this._setTarget(t.value, !0);
   }
@@ -1271,7 +1266,7 @@ class Re extends I {
     return !1;
   }
 }
-class xe extends I {
+class xe extends C {
   get x() {
     return this._currentValue.x;
   }
@@ -1318,18 +1313,18 @@ class xe extends I {
     return !1;
   }
 }
-class Ae extends I {
+class Ae extends C {
   constructor() {
     super(...arguments), a(this, "_animateLayoutUpdateNextFrame", !1), a(this, "_parentScaleInverse", new u(1, 1));
   }
   get _parentDiff() {
     let t = this._view._parent, e = 0, i = 0;
     if (t) {
-      const r = t.rect.pageOffset, s = t.getScroll(), o = {
-        left: t.previousRect.viewportOffset.left + s.x,
-        top: t.previousRect.viewportOffset.top + s.y
+      const s = t.rect.pageOffset, r = t.getScroll(), o = {
+        left: t.previousRect.viewportOffset.left + r.x,
+        top: t.previousRect.viewportOffset.top + r.y
       };
-      e = o.left - r.left, i = o.top - r.top;
+      e = o.left - s.left, i = o.top - s.top;
     }
     return { parentDx: e, parentDy: i };
   }
@@ -1346,7 +1341,7 @@ class Ae extends I {
     return this._rect.pageOffset.top;
   }
   progressTo(t) {
-    const e = typeof t.x > "u" ? this.initialX : t.x, i = typeof t.y > "u" ? this.initialY : t.y, r = new u(e, i), s = new u(this.initialX, this.initialY), o = new u(this.x, this.y), l = u.sub(o, s), h = u.sub(r, s);
+    const e = typeof t.x > "u" ? this.initialX : t.x, i = typeof t.y > "u" ? this.initialY : t.y, s = new u(e, i), r = new u(this.initialX, this.initialY), o = new u(this.x, this.y), l = u.sub(o, r), h = u.sub(s, r);
     return 1 - u.sub(h, l).magnitude / h.magnitude;
   }
   set(t, e = !0) {
@@ -1364,17 +1359,17 @@ class Ae extends I {
   }
   update(t, e) {
     if ((this._view.isInverseEffectEnabled || this._view.isLayoutTransitionEnabled) && !this._view.isTemporaryView && this._runLayoutTransition(), this._view.isInverseEffectEnabled) {
-      const h = this._view._parent, d = h ? h.scale.x : 1, c = h ? h.scale.y : 1;
-      this._parentScaleInverse = new u(1 / d, 1 / c), this._parentScaleInverse.equals(new u(1, 1)) || (this._hasChanged = !0);
+      const h = this._view._parent, g = h ? h.scale.x : 1, d = h ? h.scale.y : 1;
+      this._parentScaleInverse = new u(1 / g, 1 / d), this._parentScaleInverse.equals(new u(1, 1)) || (this._hasChanged = !0);
     }
     if (this._targetValue.x === this._currentValue.x && this._targetValue.y === this._currentValue.y)
       return;
-    const i = this._view._parent, r = i ? i.scale.x : 1, s = i ? i.scale.y : 1, o = i ? i.scale._previousValue.x : 1, l = i ? i.scale._previousValue.y : 1;
+    const i = this._view._parent, s = i ? i.scale.x : 1, r = i ? i.scale.y : 1, o = i ? i.scale._previousValue.x : 1, l = i ? i.scale._previousValue.y : 1;
     this._currentValue = this._animator.update({
       animatorProp: this._animatorProp,
       current: new u(
-        this._currentValue.x * r,
-        this._currentValue.y * s
+        this._currentValue.x * s,
+        this._currentValue.y * r
       ),
       target: this._targetValue,
       initial: new u(
@@ -1384,64 +1379,63 @@ class Ae extends I {
       ts: t,
       dt: e
     }), this._currentValue = new u(
-      this._currentValue.x / r,
-      this._currentValue.y / s
+      this._currentValue.x / s,
+      this._currentValue.y / r
     );
   }
   _runLayoutTransition() {
-    const t = !(this._targetValue.x === this._currentValue.x && this._targetValue.y === this._currentValue.y), e = !(this._view.scale._targetValue.x === this._view.scale._currentValue.x && this._view.scale._targetValue.y === this._view.scale._currentValue.y), i = t || e, r = this._rect.pageOffset.left - this._previousRect.pageOffset.left, s = this._rect.pageOffset.top - this._previousRect.pageOffset.top, o = this._previousRect.size.width / this._rect.size.width, l = this._previousRect.size.height / this._rect.size.height;
+    const t = !(this._targetValue.x === this._currentValue.x && this._targetValue.y === this._currentValue.y), e = !(this._view.scale._targetValue.x === this._view.scale._currentValue.x && this._view.scale._targetValue.y === this._view.scale._currentValue.y), i = t || e, s = this._rect.pageOffset.left - this._previousRect.pageOffset.left, r = this._rect.pageOffset.top - this._previousRect.pageOffset.top, o = this._previousRect.size.width / this._rect.size.width, l = this._previousRect.size.height / this._rect.size.height;
     let h = !1;
-    if (r !== 0 || s !== 0 || !Number.isNaN(o) && o !== 1 || !Number.isNaN(l) && l !== 1 ? h = !0 : h = (() => {
-      const d = this._view._parents;
-      for (let c = 0; c < d.length; c++) {
-        const p = d[c], w = p.previousRect.size.width / p.rect.size.width, m = p.previousRect.size.height / p.rect.size.height;
-        if (w !== 1 || m !== 1)
+    if (s !== 0 || r !== 0 || !Number.isNaN(o) && o !== 1 || !Number.isNaN(l) && l !== 1 ? h = !0 : h = (() => {
+      const g = this._view._parents;
+      for (let d = 0; d < g.length; d++) {
+        const p = g[d], w = p.previousRect.size.width / p.rect.size.width, v = p.previousRect.size.height / p.rect.size.height;
+        if (w !== 1 || v !== 1)
           return !0;
       }
       return !1;
     })(), h) {
       if (this._currentValue.x !== 0 || this._currentValue.y !== 0 || this._view.scale._currentValue.x !== 1 || this._view.scale._currentValue.y !== 1) {
         if (!i) {
-          const z = this._rect.pageOffset.left - this._previousRect.pageOffset.left, O = this._rect.pageOffset.top - this._previousRect.pageOffset.top;
+          const W = this._rect.pageOffset.left - this._previousRect.pageOffset.left, q = this._rect.pageOffset.top - this._previousRect.pageOffset.top;
           this._setTarget(
-            new u(this._currentValue.x - z, this._currentValue.y - O),
+            new u(this._currentValue.x - W, this._currentValue.y - q),
             !1
           );
           return;
         }
-        const v = this._view._parent, E = this._rect.pageOffset, x = this._view.getScroll(), A = {
-          left: this._previousRect.viewportOffset.left + x.x,
-          top: this._previousRect.viewportOffset.top + x.y
-        }, k = A.left - E.left, $ = A.top - E.top;
-        let pt = 0, _t = 0, vt = 0, mt = 0;
-        if (v) {
-          const z = v.rect.pageOffset, O = v.getScroll(), W = {
-            left: v.previousRect.viewportOffset.left + O.x,
-            top: v.previousRect.viewportOffset.top + O.y
+        const c = this._view._parent, f = this._rect.pageOffset, m = this._view.getScroll(), E = {
+          left: this._previousRect.viewportOffset.left + m.x,
+          top: this._previousRect.viewportOffset.top + m.y
+        }, T = E.left - f.left, F = E.top - f.top;
+        let k = 0, R = 0, $ = 0, vt = 0;
+        if (c) {
+          const W = c.rect.pageOffset, q = c.getScroll(), U = {
+            left: c.previousRect.viewportOffset.left + q.x,
+            top: c.previousRect.viewportOffset.top + q.y
           };
-          pt = W.left - z.left, _t = W.top - z.top;
-          const ft = A.top - W.top, wt = A.left - W.left, $t = v.scale.y * ft;
-          vt = (ft - $t) / v.scale.y;
-          const zt = v.scale.x * wt;
-          mt = (wt - zt) / v.scale.x;
+          k = U.left - W.left, R = U.top - W.top;
+          const ft = E.top - U.top, wt = E.left - U.left, $t = c.scale.y * ft;
+          $ = (ft - $t) / c.scale.y;
+          const zt = c.scale.x * wt;
+          vt = (wt - zt) / c.scale.x;
         }
         this._setTarget(
-          new u(k - pt + mt, $ - _t + vt),
+          new u(T - k + vt, F - R + $),
           !1
         ), i && (this._animateLayoutUpdateNextFrame = !0);
         return;
       }
       this._animateLayoutUpdateNextFrame = !0;
-      const d = this._previousRect, c = this._rect, p = this._view._parent;
-      let w = 0, m = 0;
-      p && (w = p.previousRect.viewportOffset.left - p.rect.viewportOffset.left), p && (m = p.previousRect.viewportOffset.top - p.rect.viewportOffset.top);
-      let y = 1, f = 1;
-      p && (y = p.previousRect.size.width / p.rect.size.width, f = p.previousRect.size.height / p.rect.size.height);
-      const b = p ? p.previousRect.viewportOffset.left : 0, C = p ? p.previousRect.viewportOffset.top : 0, L = d.viewportOffset.left - b, S = d.viewportOffset.top - C, M = L / y - L, X = S / f - S;
-      let g = d.viewportOffset.left - c.viewportOffset.left - w + M, P = d.viewportOffset.top - c.viewportOffset.top - m + X;
-      g = Number.isFinite(g) ? g : 0, P = Number.isFinite(P) ? P : 0, this._setTarget(new u(g, P), !1);
-    } else
-      this._animateLayoutUpdateNextFrame && (this._setTarget(this._initialValue, !0), this._animateLayoutUpdateNextFrame = !1);
+      const g = this._previousRect, d = this._rect, p = this._view._parent;
+      let w = 0, v = 0;
+      p && (w = p.previousRect.viewportOffset.left - p.rect.viewportOffset.left), p && (v = p.previousRect.viewportOffset.top - p.rect.viewportOffset.top);
+      let y = 1, V = 1;
+      p && (y = p.previousRect.size.width / p.rect.size.width, V = p.previousRect.size.height / p.rect.size.height);
+      const P = p ? p.previousRect.viewportOffset.left : 0, S = p ? p.previousRect.viewportOffset.top : 0, B = g.viewportOffset.left - P, M = g.viewportOffset.top - S, G = B / y - B, D = M / V - M;
+      let A = g.viewportOffset.left - d.viewportOffset.left - w + G, L = g.viewportOffset.top - d.viewportOffset.top - v + D;
+      A = Number.isFinite(A) ? A : 0, L = Number.isFinite(L) ? L : 0, this._setTarget(new u(A, L), !1);
+    } else this._animateLayoutUpdateNextFrame && (this._setTarget(this._initialValue, !0), this._animateLayoutUpdateNextFrame = !1);
   }
   get shouldRender() {
     if (!this._hasChanged)
@@ -1466,7 +1460,7 @@ class Ae extends I {
     return !0;
   }
 }
-class Te extends I {
+class Te extends C {
   constructor() {
     super(...arguments), a(this, "_unit", "deg");
   }
@@ -1516,7 +1510,7 @@ class Te extends I {
     return !0;
   }
 }
-class Ie extends I {
+class Ie extends C {
   constructor() {
     super(...arguments), a(this, "_animateLayoutUpdateNextFrame", !1);
   }
@@ -1531,10 +1525,10 @@ class Ie extends I {
     this._setTarget(new u(i.x, i.y), e);
   }
   setWithSize(t, e = !0) {
-    let i = this._currentValue.x, r = this._currentValue.y;
-    t.width && (i = t.width / this._rect.size.width), t.height && (r = t.height / this._rect.size.height), !t.width && t.height && (i = r), !t.height && t.width && (r = i);
-    const s = { x: i, y: r };
-    this._setTarget(new u(s.x, s.y), e);
+    let i = this._currentValue.x, s = this._currentValue.y;
+    t.width && (i = t.width / this._rect.size.width), t.height && (s = t.height / this._rect.size.height), !t.width && t.height && (i = s), !t.height && t.width && (s = i);
+    const r = { x: i, y: s };
+    this._setTarget(new u(r.x, r.y), e);
   }
   reset(t = !0) {
     this._setTarget(new u(1, 1), t);
@@ -1542,8 +1536,8 @@ class Ie extends I {
   update(t, e) {
     if (this._view.layoutOption !== "position") {
       if ((this._view.isInverseEffectEnabled || this._view.isLayoutTransitionEnabled) && !this._view.isTemporaryView && this._runLayoutTransition(), this._view.isInverseEffectEnabled) {
-        const i = this._view._parent, r = i ? i.scale.x : 1, s = i ? i.scale.y : 1;
-        this._hasChanged = r !== 1 || s !== 1;
+        const i = this._view._parent, s = i ? i.scale.x : 1, r = i ? i.scale.y : 1;
+        this._hasChanged = s !== 1 || r !== 1;
       }
       this._targetValue.x === this._currentValue.x && this._targetValue.y === this._currentValue.y || (this._currentValue = this._animator.update({
         animatorProp: this._animatorProp,
@@ -1557,20 +1551,19 @@ class Ie extends I {
   }
   _runLayoutTransition() {
     const t = !(this._targetValue.x === this._currentValue.x && this._targetValue.y === this._currentValue.y), e = this._previousRect.size.width / this._rect.size.width, i = this._previousRect.size.height / this._rect.size.height;
-    let r = !1;
-    if ((!Number.isNaN(e) && e !== 1 || !Number.isNaN(i) && i !== 1) && (r = !0), r) {
+    let s = !1;
+    if ((!Number.isNaN(e) && e !== 1 || !Number.isNaN(i) && i !== 1) && (s = !0), s) {
       if (this._currentValue.x !== 1 || this._currentValue.y !== 1) {
-        const d = this._view.previousRect.size.width / this._view.rect.size.width, c = this._view.previousRect.size.height / this._view.rect.size.height;
+        const g = this._view.previousRect.size.width / this._view.rect.size.width, d = this._view.previousRect.size.height / this._view.rect.size.height;
         this._setTarget(
-          new u(this._currentValue.x * d, this._currentValue.y * c),
+          new u(this._currentValue.x * g, this._currentValue.y * d),
           !1
         ), t && (this._animateLayoutUpdateNextFrame = !0);
         return;
       }
-      const s = this._previousRect.size.width / this._rect.size.width, o = this._previousRect.size.height / this._rect.size.height, l = s, h = o;
+      const r = this._previousRect.size.width / this._rect.size.width, o = this._previousRect.size.height / this._rect.size.height, l = r, h = o;
       this._view.viewProps.borderRadius.applyScaleInverse(), this._setTarget(new u(l, h), !1), this._animateLayoutUpdateNextFrame = !0;
-    } else
-      this._animateLayoutUpdateNextFrame && (this._setTarget(this._initialValue, !0), this._animateLayoutUpdateNextFrame = !1);
+    } else this._animateLayoutUpdateNextFrame && (this._setTarget(this._initialValue, !0), this._animateLayoutUpdateNextFrame = !1);
   }
   get shouldRender() {
     if (!this._hasChanged)
@@ -1581,8 +1574,8 @@ class Ie extends I {
     return !(_(t.x, this._previousRenderValue.x) && _(t.y, this._previousRenderValue.y));
   }
   get renderValue() {
-    const t = this._view._parent ? this._view._parent.scale.x : 1, e = this._view._parent ? this._view._parent.scale.y : 1, i = this._currentValue.x / t, r = this._currentValue.y / e;
-    return new u(i, r);
+    const t = this._view._parent ? this._view._parent.scale.x : 1, e = this._view._parent ? this._view._parent.scale.y : 1, i = this._currentValue.x / t, s = this._currentValue.y / e;
+    return new u(i, s);
   }
   projectStyles() {
     const t = this.renderValue, e = `scale3d(${t.x}, ${t.y}, 1)`;
@@ -1592,7 +1585,7 @@ class Ie extends I {
     return !0;
   }
 }
-class Ce extends I {
+class Ce extends C {
   get width() {
     return this._view.rect.size.width;
   }
@@ -1666,21 +1659,21 @@ class Ce extends I {
     return !1;
   }
 }
-class Ne {
+class Le {
   constructor(t) {
     a(this, "_props", /* @__PURE__ */ new Map()), this._props.set(
       "position",
-      new Ae(new D(), new u(0, 0), t)
+      new Ae(new H(), new u(0, 0), t)
     ), this._props.set(
       "scale",
-      new Ie(new D(), new u(1, 1), t)
+      new Ie(new H(), new u(1, 1), t)
     ), this._props.set(
       "rotation",
       new Te(new At(), 0, t)
     ), this._props.set(
       "size",
       new Ce(
-        new D(),
+        new H(),
         new u(t.rect.size.width, t.rect.size.height),
         t
       )
@@ -1694,7 +1687,7 @@ class Ne {
     ), this._props.set(
       "borderRadius",
       new Ee(
-        new Pe(),
+        new be(),
         [
           t.elementReader.borderRadius.value.topLeft,
           t.elementReader.borderRadius.value.topRight,
@@ -1706,7 +1699,7 @@ class Ne {
     ), this._props.set(
       "origin",
       new xe(
-        new D(),
+        new H(),
         t.elementReader.origin.value,
         t
       )
@@ -1743,16 +1736,16 @@ class Ne {
     return this._props.get("origin");
   }
 }
-class Le {
-  constructor(t, e, i, r) {
-    a(this, "id"), a(this, "name"), a(this, "element"), a(this, "styles", {}), a(this, "_viewProps"), a(this, "_previousRect"), a(this, "_onAddCallbacks"), a(this, "_onRemoveCallback"), a(this, "_skipFirstRenderFrame"), a(this, "_layoutTransition"), a(this, "_registry"), a(this, "_layoutId"), a(this, "_elementReader"), a(this, "_viewParents"), a(this, "_temporaryView"), a(this, "_inverseEffect"), a(this, "_renderNextTick"), a(this, "_layoutOption"), a(this, "_elementObserver"), a(this, "_hasReadElement"), a(this, "_shouldReadRect"), a(this, "_readWithScroll"), a(this, "_externalUserStyles"), this._registry = i, this.id = St(), this.name = e, this.element = t, this.element.dataset.velViewId = this.id, this._elementReader = xt(this), this._viewParents = this._getParents(), this._previousRect = this._elementReader.rect, this._viewProps = new Ne(this), this._skipFirstRenderFrame = !0, this._layoutId = r, this._layoutTransition = !1, this._temporaryView = !1, this.styles = Q(this.styles, () => {
+class Ne {
+  constructor(t, e, i, s) {
+    a(this, "id"), a(this, "name"), a(this, "element"), a(this, "styles", {}), a(this, "_viewProps"), a(this, "_previousRect"), a(this, "_onAddCallbacks"), a(this, "_onRemoveCallback"), a(this, "_skipFirstRenderFrame"), a(this, "_layoutTransition"), a(this, "_registry"), a(this, "_layoutId"), a(this, "_elementReader"), a(this, "_viewParents"), a(this, "_temporaryView"), a(this, "_inverseEffect"), a(this, "_renderNextTick"), a(this, "_layoutOption"), a(this, "_elementObserver"), a(this, "_hasReadElement"), a(this, "_shouldReadRect"), a(this, "_readWithScroll"), a(this, "_externalUserStyles"), this._registry = i, this.id = St(), this.name = e, this.element = t, this.element.dataset.velViewId = this.id, this._elementReader = xt(this), this._viewParents = this._getParents(), this._previousRect = this._elementReader.rect, this._viewProps = new Le(this), this._skipFirstRenderFrame = !0, this._layoutId = s, this._layoutTransition = !1, this._temporaryView = !1, this.styles = it(this.styles, () => {
       this._renderNextTick = !0;
-    }), this._externalUserStyles = this._getExternalUserStyles(), this._renderNextTick = !1, this._layoutOption = this._getLayoutOption(), this._hasReadElement = !1, this._shouldReadRect = !1, this._readWithScroll = !1, this._elementObserver = te(t), this._elementObserver.onChange((s) => {
+    }), this._externalUserStyles = this._getExternalUserStyles(), this._renderNextTick = !1, this._layoutOption = this._getLayoutOption(), this._hasReadElement = !1, this._shouldReadRect = !1, this._readWithScroll = !1, this._elementObserver = te(t), this._elementObserver.onChange((r) => {
       if (this._hasReadElement) {
         this._shouldReadRect = !1;
         return;
       }
-      this._externalUserStyles = this._getExternalUserStyles(), this._shouldReadRect = !0, this._readWithScroll = s;
+      this._externalUserStyles = this._getExternalUserStyles(), this._shouldReadRect = !0, this._readWithScroll = r;
     });
   }
   destroy() {
@@ -1768,7 +1761,7 @@ class Le {
     return this.element.closest("[data-vel-layout-position]") ? "position" : this.element.closest("[data-vel-layout-size]") ? "size" : "all";
   }
   setElement(t) {
-    this.element = t, this._elementReader = xt(this), this.element.dataset.velViewId = this.id, this._elementObserver.setElement(t);
+    this.element = t, this._elementReader = xt(this), this.element.dataset.velViewId = this.id, this._elementObserver.setElement(t), this._viewParents = this._getParents();
   }
   get layoutId() {
     return this._layoutId;
@@ -1793,13 +1786,12 @@ class Le {
     var t;
     const e = [];
     let i = this.element.parentElement;
-    if (!i)
-      return e;
+    if (!i) return e;
     for (i = i.closest("[data-vel-view-id]"); i; ) {
-      const r = i.dataset.velViewId;
-      if (r) {
-        const s = this._registry.getViewById(r);
-        s && e.push(s);
+      const s = i.dataset.velViewId;
+      if (s) {
+        const r = this._registry.getViewById(s);
+        r && e.push(r);
       }
       i = (t = i.parentElement) == null ? void 0 : t.closest(
         "[data-vel-view-id]"
@@ -1831,8 +1823,8 @@ class Le {
   get data() {
     const t = this.element.dataset;
     return Object.keys(t).filter((e) => e.includes("velData")).map((e) => e.replace("velData", "")).map((e) => `${e[0].toLowerCase()}${e.slice(1)}`).reduce((e, i) => {
-      const r = t[`velData${i[0].toUpperCase()}${i.slice(1)}`];
-      return !e[i] && r && (e[i] = r), e;
+      const s = t[`velData${i[0].toUpperCase()}${i.slice(1)}`];
+      return !e[i] && s && (e[i] = s), e;
     }, {});
   }
   get onAddCallbacks() {
@@ -1904,16 +1896,16 @@ class Le {
     return this._elementReader.scroll;
   }
   intersects(t, e) {
-    const i = this.element.getBoundingClientRect(), r = {
+    const i = this.element.getBoundingClientRect(), s = {
       x: i.left,
       y: i.top
     };
-    return t >= r.x && t <= r.x + i.width && e >= r.y && e <= r.y + i.height;
+    return t >= s.x && t <= s.x + i.width && e >= s.y && e <= s.y + i.height;
   }
   // Using AABB collision detection
   overlapsWith(t) {
-    const e = t._localWidth * t.scale.x, i = t._localHeight * t.scale.y, r = this._localWidth * this.scale.x, s = this._localHeight * this.scale.y;
-    return this.position.x < t.position.x + e && this.position.x + r > t.position.x && this.position.y < t.position.y + i && this.position.y + s > t.position.y;
+    const e = t._localWidth * t.scale.x, i = t._localHeight * t.scale.y, s = this._localWidth * this.scale.x, r = this._localHeight * this.scale.y;
+    return this.position.x < t.position.x + e && this.position.x + s > t.position.x && this.position.y < t.position.y + i && this.position.y + r > t.position.y;
   }
   distanceTo(t) {
     const e = new u(this.position.x, this.position.y), i = new u(t.position.x, t.position.y);
@@ -1950,11 +1942,10 @@ class Le {
   }
   _cleanCssText(t) {
     const e = /* @__PURE__ */ new Map(), i = /([-\w]+)\s*:\s*([^;]+)\s*;?/g;
-    let r;
-    for (; (r = i.exec(t)) !== null; ) {
-      const [s, o, l] = r;
-      if (!l.trim())
-        continue;
+    let s;
+    for (; (s = i.exec(t)) !== null; ) {
+      const [r, o, l] = s;
+      if (!l.trim()) continue;
       const h = o.replace(/^-\w+-/, "");
       (!e.has(h) || !o.startsWith("-")) && e.set(
         h,
@@ -1971,13 +1962,13 @@ class Le {
       return;
     }
     let t = "";
-    const e = this._viewProps.allProps(), i = e.filter((s) => s.isTransform()), r = e.filter((s) => !s.isTransform());
-    if (i.some((s) => s.hasChanged())) {
-      const s = i.reduce((o, l, h) => (o += l.projectStyles(), h < i.length - 1 && (o += " "), h === i.length - 1 && (o += ";"), o), "transform: ");
-      t += s;
+    const e = this._viewProps.allProps(), i = e.filter((r) => r.isTransform()), s = e.filter((r) => !r.isTransform());
+    if (i.some((r) => r.hasChanged())) {
+      const r = i.reduce((o, l, h) => (o += l.projectStyles(), h < i.length - 1 && (o += " "), h === i.length - 1 && (o += ";"), o), "transform: ");
+      t += r;
     }
-    r.forEach((s) => {
-      s.hasChanged() && (t += s.projectStyles());
+    s.forEach((r) => {
+      r.hasChanged() && (t += r.projectStyles());
     }), t += this._getUserStyles(), this._cleanCssText(this.element.style.cssText) !== this._cleanCssText(t) && (this.element.style.cssText = t), this._renderNextTick = !1;
   }
   _getExternalUserStyles() {
@@ -1991,21 +1982,19 @@ class Le {
       "width",
       "height",
       "border-radius"
-    ], r = {};
-    for (const s in e)
-      e.hasOwnProperty(s) && (r[yt(s)] = e[s]);
-    return t.split(";").map((s) => s.trim()).filter(Boolean).filter((s) => {
-      const o = s.indexOf(":");
-      if (o === -1)
-        return !1;
-      const l = s.slice(0, o).trim();
-      return !r.hasOwnProperty(l) && !i.includes(l);
+    ], s = {};
+    for (const r in e)
+      e.hasOwnProperty(r) && (s[yt(r)] = e[r]);
+    return t.split(";").map((r) => r.trim()).filter(Boolean).filter((r) => {
+      const o = r.indexOf(":");
+      if (o === -1) return !1;
+      const l = r.slice(0, o).trim();
+      return !s.hasOwnProperty(l) && !i.includes(l);
     }).join("; ");
   }
   _getUserStyles() {
     return Object.keys(this.styles).reduce((t, e) => {
-      if (!e)
-        return t;
+      if (!e) return t;
       const i = yt(e).replace("webkit", "-webkit").replace("moz", "-moz");
       return t + `${i}: ${this.styles[e]}; `;
     }, this._externalUserStyles);
@@ -2027,16 +2016,16 @@ class Le {
   }
   _copyAnimatorsToAnotherView(t) {
     t.viewProps.allPropNames().forEach((e) => {
-      var i, r;
-      const s = (i = this.viewProps.getPropByName(e)) == null ? void 0 : i.getAnimator();
-      s && ((r = t.viewProps.getPropByName(e)) == null || r.setAnimator(s.name, s.config));
+      var i, s;
+      const r = (i = this.viewProps.getPropByName(e)) == null ? void 0 : i.getAnimator();
+      r && ((s = t.viewProps.getPropByName(e)) == null || s.setAnimator(r.name, r.config));
     });
   }
   getChildren(t) {
-    const e = this.element.querySelectorAll("*"), i = Array.from(e).filter((r) => {
-      const s = r;
-      return typeof s.dataset.velViewId < "u" && s.dataset.velView === t;
-    }).map((r) => r.dataset.velViewId);
+    const e = this.element.querySelectorAll("*"), i = Array.from(e).filter((s) => {
+      const r = s;
+      return typeof r.dataset.velViewId < "u" && r.dataset.velView === t;
+    }).map((s) => s.dataset.velViewId);
     return this._registry.getViewsById(i);
   }
   getChild(t) {
@@ -2046,8 +2035,7 @@ class Le {
     const e = this.element.closest(
       `[data-vel-view="${t}"]`
     );
-    if (!e)
-      return;
+    if (!e) return;
     const i = e.dataset.velViewId;
     if (i)
       return this._registry.getViewById(i);
@@ -2073,8 +2061,7 @@ class Se {
   }
   _getPluginNameForElement(t) {
     const e = t.dataset.velPlugin;
-    if (e && e.length > 0)
-      return e;
+    if (e && e.length > 0) return e;
     const i = t.closest("[data-vel-plugin]");
     if (i)
       return i.dataset.velPlugin;
@@ -2086,64 +2073,67 @@ class Se {
     const i = t.closest("[data-vel-plugin-id]");
     if (i)
       return i.dataset.velPluginId;
-    const r = this.getPluginByName(e);
-    if (r)
-      return r.id;
+    const s = this.getPluginByName(e);
+    if (s)
+      return s.id;
   }
   _isScopedElement(t) {
     const e = this._getPluginNameForElement(t);
     if (!e)
       return !1;
-    const i = this._pluginNameToPluginFactoryMap.get(e), r = i == null ? void 0 : i.scope;
-    return t.dataset.velView === r;
+    const i = this._pluginNameToPluginFactoryMap.get(e), s = i == null ? void 0 : i.scope;
+    return t.dataset.velView === s;
   }
   _removeElementsWithParent(t) {
     const e = new Set(t);
     return t.filter((i) => {
-      let r = i.parentElement;
-      for (; r; ) {
-        if (e.has(r))
+      let s = i.parentElement;
+      for (; s; ) {
+        if (e.has(s))
           return !1;
-        r = r.parentElement;
+        s = s.parentElement;
       }
       return !0;
     });
   }
   _handleAddedViews() {
-    this._viewsCreatedInPreviousFrame.forEach((s) => {
-      s.markAsAdded();
+    this._viewsCreatedInPreviousFrame.forEach((r) => {
+      r.markAsAdded();
     }), this._viewsCreatedInPreviousFrame = [];
     const t = this._removeElementsWithParent(
       this._viewsToBeCreated
-    ), e = t.filter(
-      (s) => this._isScopedElement(s) && !this._isElementIgnored(s)
+    ), e = Array.from(
+      new Set(
+        t.filter(
+          (r) => this._isScopedElement(r) && !this._isElementIgnored(r)
+        )
+      )
     ), i = t.filter(
-      (s) => !this._isScopedElement(s) && !this._isElementIgnored(s)
+      (r) => !this._isScopedElement(r) && !this._isElementIgnored(r)
     );
-    this._viewsToBeCreated = [], e.forEach((s) => {
-      const o = this._getPluginNameForElement(s), l = this._pluginNameToPluginFactoryMap.get(o), h = this._pluginNameToPluginConfigMap.get(o), d = s.dataset.velPluginKey, c = j(
+    this._viewsToBeCreated = [], e.forEach((r) => {
+      const o = this._getPluginNameForElement(r), l = this._pluginNameToPluginFactoryMap.get(o), h = this._pluginNameToPluginConfigMap.get(o), g = r.dataset.velPluginKey, d = Z(
         l,
         this,
         this._eventBus,
         this._appEventBus,
         h,
-        d
+        g
       );
-      this._plugins.push(c);
-      const p = s.dataset.velView, w = this._createNewView(s, p, c);
-      w.isInverseEffectEnabled && w.setAnimatorsFromParent(), c.notifyAboutViewAdded(w);
+      this._plugins.push(d);
+      const p = r.dataset.velView, w = this._createNewView(r, p, d);
+      w.isInverseEffectEnabled && w.setAnimatorsFromParent(), d.notifyAboutViewAdded(w);
     });
-    const r = i.filter((s) => !!this._getPluginIdForElement(s));
-    r.length !== 0 && r.forEach((s) => {
-      const o = this._getPluginIdForElement(s), l = s.dataset.velView;
-      if (!l || !o)
-        return;
+    const s = i.filter((r) => !!this._getPluginIdForElement(r));
+    s.length !== 0 && s.forEach((r) => {
+      const o = this._getPluginIdForElement(r), l = r.dataset.velView;
+      if (!l || !o) return;
       const h = this._getPluginById(o);
       if (!h)
         return;
-      const d = this._getLayoutIdForElement(s, h);
-      let c;
-      d && this._layoutIdToViewMap.has(d) ? (c = this._layoutIdToViewMap.get(d), c.setElement(s), c.setPluginId(h.id), this._createChildrenForView(c, h)) : c = this._createNewView(s, l, h), c.isInverseEffectEnabled && c.setAnimatorsFromParent(), h.notifyAboutViewAdded(c);
+      const g = this._getLayoutIdForElement(r, h);
+      let d;
+      g && this._layoutIdToViewMap.has(g) ? (d = this._layoutIdToViewMap.get(g), d.setElement(r), d.setPluginId(h.id), this._createChildrenForView(d, h)) : d = this._createNewView(r, l, h), d.isInverseEffectEnabled && d.setAnimatorsFromParent(), h.notifyAboutViewAdded(d);
     });
   }
   _getLayoutIdForElement(t, e) {
@@ -2152,18 +2142,18 @@ class Se {
       return `${i}-${e.id}`;
   }
   _createNewView(t, e, i) {
-    const r = this._getLayoutIdForElement(t, i), s = this.createView(t, e, r);
-    return i.addView(s), s.layoutId && this._layoutIdToViewMap.set(s.layoutId, s), this._createChildrenForView(s, i), this._appEventBus.emitPluginReadyEvent(i.pluginName, i.api, !0), requestAnimationFrame(() => {
+    const s = this._getLayoutIdForElement(t, i), r = this.createView(t, e, s);
+    return i.addView(r), r.layoutId && this._layoutIdToViewMap.set(r.layoutId, r), this._createChildrenForView(r, i), this._appEventBus.emitPluginReadyEvent(i.pluginName, i.api, !0), requestAnimationFrame(() => {
       requestAnimationFrame(() => {
         this._appEventBus.emitPluginReadyEvent(i.pluginName, i.api);
       });
-    }), s;
+    }), r;
   }
   _createChildrenForView(t, e) {
     const i = t.element.querySelectorAll("*");
     if (i.length) {
       if (Array.from(i).some(
-        (r) => this._getPluginNameForElement(r) !== e.pluginName
+        (s) => this._getPluginNameForElement(s) !== e.pluginName
       )) {
         console.log(
           `%c WARNING: The plugin "${e.pluginName}" has view(s) created for a different plugin. Make sure all views inside that plugin don't have data-vel-plugin set or the pluginName is set to "${e.pluginName}"`,
@@ -2171,16 +2161,15 @@ class Se {
         );
         return;
       }
-      Array.from(i).filter((r) => !this._isElementIgnored(r)).forEach((r) => {
-        const s = r, o = s.dataset.velView ? s.dataset.velView : `${t.name}-child`, l = this._getLayoutIdForElement(s, e), h = this.createView(s, o, l);
+      Array.from(i).filter((s) => !this._isElementIgnored(s)).forEach((s) => {
+        const r = s, o = r.dataset.velView ? r.dataset.velView : `${t.name}-child`, l = this._getLayoutIdForElement(r, e), h = this.createView(r, o, l);
         l && !this._layoutIdToViewMap.has(l) && this._layoutIdToViewMap.set(l, h), e.addView(h), e.notifyAboutViewAdded(h);
       });
     }
   }
   _handleRemoveView(t) {
     this._plugins.forEach((e) => {
-      if (!this._viewsPerPlugin.get(e.id))
-        return;
+      if (!this._viewsPerPlugin.get(e.id)) return;
       const i = this._getPluginViewById(e, t);
       i && e.removeView(i);
     });
@@ -2190,10 +2179,9 @@ class Se {
   }
   _unassignViewFromPlugin(t, e) {
     const i = this._viewsPerPlugin.get(e);
-    if (!i)
-      return;
-    const r = i.indexOf(t);
-    r !== -1 && i.splice(r, 1);
+    if (!i) return;
+    const s = i.indexOf(t);
+    s !== -1 && i.splice(s, 1);
   }
   getViewById(t) {
     return this._views.find((e) => e.id === t);
@@ -2214,19 +2202,17 @@ class Se {
     }
     let i = [];
     if (t && t.length > 0) {
-      const r = this.getPluginByName(t);
-      if (r) {
-        const s = (this._eventPluginsPerPlugin.get(r.id) || []).map((o) => this._getPluginById(o)).filter((o) => typeof o < "u");
-        i.push(r), i.push(...s);
+      const s = this.getPluginByName(t);
+      if (s) {
+        const r = (this._eventPluginsPerPlugin.get(s.id) || []).map((o) => this._getPluginById(o)).filter((o) => typeof o < "u");
+        i.push(s), i.push(...r);
       }
     } else
       i = this._plugins;
-    requestAnimationFrame(() => {
-      i.forEach((r) => {
-        this._destroyPlugin(r);
-      }), requestAnimationFrame(() => {
-        e == null || e();
-      });
+    i.forEach((s) => {
+      this._destroyPlugin(s);
+    }), requestAnimationFrame(() => {
+      e == null || e();
     });
   }
   _destroyPlugin(t) {
@@ -2234,7 +2220,7 @@ class Se {
     e.forEach((i) => {
       i.layoutId && this._layoutIdToViewMap.delete(i.layoutId), i.destroy();
     }), this._views = this._views.filter(
-      (i) => !e.find((r) => r.id === i.id)
+      (i) => !e.find((s) => s.id === i.id)
     ), this._viewsPerPlugin.delete(t.id), this._plugins = this._plugins.filter((i) => i.id !== t.id);
   }
   _destroyAll(t) {
@@ -2245,33 +2231,33 @@ class Se {
   reset(t, e) {
     let i = [];
     if (t && t.length > 0) {
-      const r = this.getPluginByName(t);
-      if (r) {
-        const s = (this._eventPluginsPerPlugin.get(r.id) || []).map((o) => this._getPluginById(o)).filter((o) => typeof o < "u");
-        i.push(r), i.push(...s);
+      const s = this.getPluginByName(t);
+      if (s) {
+        const r = (this._eventPluginsPerPlugin.get(s.id) || []).map((o) => this._getPluginById(o)).filter((o) => typeof o < "u");
+        i.push(s), i.push(...r);
       }
     } else
       i = this._plugins;
     requestAnimationFrame(() => {
-      i.forEach((r) => {
-        this._resetPlugin(r);
+      i.forEach((s) => {
+        this._resetPlugin(s);
       }), requestAnimationFrame(() => {
         e == null || e();
       });
     });
   }
   _resetPlugin(t) {
-    const e = t.config, i = t.pluginFactory, r = t.internalBusEvent, s = !t.isRenderable(), o = this.getViewsForPlugin(t);
+    const e = t.config, i = t.pluginFactory, s = t.internalBusEvent, r = !t.isRenderable(), o = this.getViewsForPlugin(t);
     o.forEach((l) => {
       l.layoutId && this._layoutIdToViewMap.delete(l.layoutId), l.destroy();
     }), this._views = this._views.filter(
       (l) => !o.find((h) => h.id === l.id)
-    ), this._viewsPerPlugin.delete(t.id), this._plugins = this._plugins.filter((l) => l.id !== t.id), s || requestAnimationFrame(() => {
+    ), this._viewsPerPlugin.delete(t.id), this._plugins = this._plugins.filter((l) => l.id !== t.id), r || requestAnimationFrame(() => {
       this.createPlugin(
         i,
         this._eventBus,
         e
-      ).setInternalEventBus(r);
+      ).setInternalEventBus(s);
     });
   }
   queueNodeToBeCreated(t) {
@@ -2310,55 +2296,54 @@ class Se {
   hasPlugin(t) {
     return t.pluginName ? !!this.getPluginByName(t.pluginName) : !1;
   }
-  createPlugin(t, e, i = {}, r = !1) {
+  createPlugin(t, e, i = {}, s = !1) {
     if (!t.pluginName)
       throw Error(
         `Plugin ${t.name} must contain a pluginName field`
       );
-    let s = [];
+    let r = [];
     if (t.scope) {
-      const h = r ? `[data-vel-plugin=${t.pluginName}][data-vel-view=${t.scope}]:not([data-vel-plugin-id])` : `[data-vel-plugin=${t.pluginName}][data-vel-view=${t.scope}]`, d = document.querySelectorAll(h);
+      const h = s ? `[data-vel-plugin=${t.pluginName}][data-vel-view=${t.scope}]:not([data-vel-plugin-id])` : `[data-vel-plugin=${t.pluginName}][data-vel-view=${t.scope}]`, g = document.querySelectorAll(h);
       this._pluginNameToPluginFactoryMap.has(t.pluginName) || this._pluginNameToPluginFactoryMap.set(
         t.pluginName,
         t
-      ), this._pluginNameToPluginConfigMap.has(t.pluginName) || this._pluginNameToPluginConfigMap.set(t.pluginName, i), d ? s = Array.from(d) : s = [document.documentElement];
+      ), this._pluginNameToPluginConfigMap.has(t.pluginName) || this._pluginNameToPluginConfigMap.set(t.pluginName, i), g ? r = Array.from(g) : r = [document.documentElement];
     } else
-      s = [document.documentElement];
-    const o = s.map((h) => {
-      const d = h.dataset.velPluginKey, c = j(
+      r = [document.documentElement];
+    const o = r.map((h) => {
+      const g = h.dataset.velPluginKey, d = Z(
         t,
         this,
         e,
         this._appEventBus,
         i,
-        d
+        g
       );
-      this._plugins.push(c);
+      this._plugins.push(d);
       let p = [];
       h !== document.documentElement && p.push(h);
       const w = h.querySelectorAll(
-        `[data-vel-plugin=${c.pluginName}]`
+        `[data-vel-plugin=${d.pluginName}]`
       );
       p = [...p, ...w];
-      const m = p.filter((y) => {
+      const v = p.filter((y) => {
         if (this._isElementIgnored(y))
           return !1;
         if (!y.parentElement)
           return !0;
-        const f = this._getPluginNameForElement(y.parentElement);
-        return !(f && f.length > 0);
+        const V = this._getPluginNameForElement(y.parentElement);
+        return !(V && V.length > 0);
       });
-      return m.length && m.forEach((y) => {
-        const f = y.dataset.velView;
-        if (!f)
-          return;
-        const b = this._createNewView(y, f, c);
-        c.notifyAboutViewAdded(b);
-      }), c;
+      return v.length && v.forEach((y) => {
+        const V = y.dataset.velView;
+        if (!V) return;
+        const P = this._createNewView(y, V, d);
+        d.notifyAboutViewAdded(P);
+      }), d;
     });
     if (o && o.length > 0)
       return o[0];
-    const l = j(
+    const l = Z(
       t,
       this,
       e,
@@ -2377,8 +2362,8 @@ class Se {
     return this._views;
   }
   createView(t, e, i) {
-    const r = new Le(t, e, this, i);
-    return this._views.push(r), this._viewsCreatedInPreviousFrame.push(r), r;
+    const s = new Ne(t, e, this, i);
+    return this._views.push(s), this._viewsCreatedInPreviousFrame.push(s), s;
   }
   _isElementIgnored(t) {
     return t.closest("[data-vel-ignore]");
@@ -2390,7 +2375,7 @@ class Se {
   }
   getViewsForPlugin(t) {
     const e = this._viewsPerPlugin.get(t.id);
-    return e ? e.map((i) => this._views.find((r) => r.id === i)).filter((i) => !!i) : [];
+    return e ? e.map((i) => this._views.find((s) => s.id === i)).filter((i) => !!i) : [];
   }
   getViewsByNameForPlugin(t, e) {
     return this.getViewsForPlugin(t).filter(
@@ -2408,12 +2393,12 @@ class It {
     a(this, "pluginApi"), this.pluginApi = t.pluginApi;
   }
 }
-class gt {
+class mt {
   constructor() {
-    a(this, "previousTime", 0), a(this, "registry"), a(this, "eventBus"), a(this, "appEventBus"), this.eventBus = new Z(), this.appEventBus = new Z(), this.registry = new Se(this.appEventBus, this.eventBus), new Xt(this.eventBus);
+    a(this, "previousTime", 0), a(this, "registry"), a(this, "eventBus"), a(this, "appEventBus"), this.eventBus = new tt(), this.appEventBus = new tt(), this.registry = new Se(this.appEventBus, this.eventBus), new jt(this.eventBus);
   }
   static create() {
-    return new gt();
+    return new mt();
   }
   addPlugin(t, e = {}) {
     this.registry.hasPlugin(t) || this.registry.createPlugin(t, this.eventBus, e);
@@ -2429,32 +2414,34 @@ class gt {
   }
   getPlugin(t, e) {
     let i = typeof t == "string" ? t : t.pluginName;
-    const r = this.registry.getPluginByName(i, e);
-    if (!r)
+    const s = this.registry.getPluginByName(i, e);
+    if (!s)
       throw new Error(
         `You can't call getPlugin for ${i} with key: ${e} because it does not exist in your app`
       );
-    return r.api;
+    return s.api;
   }
   getPlugins(t, e) {
     let i = typeof t == "string" ? t : t.pluginName;
-    const r = this.registry.getPluginsByName(i, e);
-    if (r.length === 0)
+    const s = this.registry.getPluginsByName(i, e);
+    if (s.length === 0)
       throw new Error(
         `You can't call getPlugins for ${i} with key: ${e} because they don't exist in your app`
       );
-    return r.map((s) => s.api);
+    return s.map((r) => r.api);
   }
-  onPluginEvent(t, e, i, r) {
-    const s = this.registry.getPluginByName(
-      t.pluginName,
-      r
-    );
-    s && s.on(e, i);
+  onPluginEvent(t, e, i, s) {
+    requestAnimationFrame(() => {
+      const r = this.registry.getPluginByName(
+        t.pluginName,
+        s
+      );
+      r && r.on(e, i);
+    });
   }
   removePluginEventListener(t, e, i) {
-    const r = this.registry.getPluginByName(t.pluginName);
-    r && r.removeListener(e, i);
+    const s = this.registry.getPluginByName(t.pluginName);
+    s && s.removeListener(e, i);
   }
   run() {
     document.readyState === "loading" ? document.addEventListener("DOMContentLoaded", this.start.bind(this)) : this.start();
@@ -2467,25 +2454,25 @@ class gt {
   }
   listenToNativeEvents() {
     document.addEventListener("click", (t) => {
-      this.eventBus.emitEvent(Nt, {
+      this.eventBus.emitEvent(Lt, {
         x: t.clientX,
         y: t.clientY,
         target: t.target
       });
     }), document.addEventListener("pointermove", (t) => {
-      this.eventBus.emitEvent(et, {
+      this.eventBus.emitEvent(rt, {
         x: t.clientX,
         y: t.clientY,
         target: t.target
       });
     }), document.addEventListener("pointerdown", (t) => {
-      this.eventBus.emitEvent(it, {
+      this.eventBus.emitEvent(nt, {
         x: t.clientX,
         y: t.clientY,
         target: t.target
       });
     }), document.addEventListener("pointerup", (t) => {
-      this.eventBus.emitEvent(st, {
+      this.eventBus.emitEvent(at, {
         x: t.clientX,
         y: t.clientY,
         target: t.target
@@ -2497,11 +2484,11 @@ class gt {
     e > 0.016 && (e = 1 / 60), this.previousTime = t, this.eventBus.reset(), this.subscribeToEvents(), this.read(), this.update(t, e), this.render(), requestAnimationFrame(this.tick.bind(this));
   }
   subscribeToEvents() {
-    this.eventBus.subscribeToEvent(q, this.onNodeAdded.bind(this)), this.eventBus.subscribeToEvent(
-      G,
+    this.eventBus.subscribeToEvent(Y, this.onNodeAdded.bind(this)), this.eventBus.subscribeToEvent(
+      Q,
       this.onNodeRemoved.bind(this)
     ), this.eventBus.subscribeToEvent(
-      Lt,
+      Nt,
       this.onDataChanged.bind(this)
     ), this.registry.getPlugins().forEach((t) => {
       t.subscribeToEvents(this.eventBus);
@@ -2541,16 +2528,16 @@ class gt {
   }
 }
 function Be() {
-  return gt.create();
+  return mt.create();
 }
-class Ft {
+class Mt {
   constructor(t) {
     a(this, "view"), a(this, "previousX"), a(this, "previousY"), a(this, "x"), a(this, "y"), a(this, "pointerX"), a(this, "pointerY"), a(this, "isDragging"), a(this, "target"), a(this, "directions", []), a(this, "width"), a(this, "height"), a(this, "distance"), a(this, "stopped"), this.props = t, this.previousX = t.previousX, this.previousY = t.previousY, this.x = t.x, this.y = t.y, this.pointerX = t.pointerX, this.pointerY = t.pointerY, this.width = t.width, this.height = t.height, this.distance = t.distance, this.view = t.view, this.isDragging = t.isDragging, this.stopped = t.stopped, this.target = t.target, this.directions = t.directions;
   }
 }
-class Mt extends rt {
+class Ft extends ot {
   constructor() {
-    super(...arguments), a(this, "_pointerX", 0), a(this, "_pointerY", 0), a(this, "_initialPointer", new u(0, 0)), a(this, "_initialPointerPerView", /* @__PURE__ */ new Map()), a(this, "_pointerDownPerView", /* @__PURE__ */ new Map()), a(this, "_targetPerView", /* @__PURE__ */ new Map()), a(this, "_viewPointerPositionLog", /* @__PURE__ */ new Map()), a(this, "_stopTimer", 0);
+    super(...arguments), a(this, "_pointerX", 0), a(this, "_pointerY", 0), a(this, "_initialPointer", new u(0, 0)), a(this, "_initialPointerPerView", /* @__PURE__ */ new Map()), a(this, "_pointerDownPerView", /* @__PURE__ */ new Map()), a(this, "_viewPointerPositionLog", /* @__PURE__ */ new Map()), a(this, "_stopTimer", 0);
   }
   setup() {
     document.addEventListener("selectstart", this.onSelect.bind(this));
@@ -2564,62 +2551,56 @@ class Mt extends rt {
     );
   }
   subscribeToEvents(t) {
-    t.subscribeToEvent(it, ({ x: e, y: i, target: r }) => {
+    t.subscribeToEvent(nt, ({ x: e, y: i }) => {
       this._initialPointer = new u(e, i), this.getViews().forEach((s) => {
-        this._pointerDownPerView.set(s.id, s.intersects(e, i)), this._targetPerView.set(s.id, r);
-        const o = new u(
-          e - s.position.initialX,
-          i - s.position.initialY
-        );
-        this._pointerX = e, this._pointerY = i, this._initialPointerPerView.set(s.id, o);
+        this._pointerDownPerView.set(s.id, s.intersects(e, i));
+        const r = s.isLayoutTransitionEnabled ? s.position.initialX : s.position.x, o = s.isLayoutTransitionEnabled ? s.position.initialY : s.position.y, l = new u(e - r, i - o);
+        this._pointerX = e, this._pointerY = i, this._initialPointerPerView.set(s.id, l);
       });
-    }), t.subscribeToEvent(st, () => {
+    }), t.subscribeToEvent(at, () => {
       this.getViews().forEach((e) => {
         this._pointerDownPerView.get(e.id) && this._initialPointerPerView.get(e.id) && (this._pointerDownPerView.set(e.id, !1), this._emitEvent(e, []));
       });
-    }), t.subscribeToEvent(et, ({ x: e, y: i }) => {
-      this._pointerX = e, this._pointerY = i, this.getViews().forEach((r) => {
-        if (this._pointerDownPerView.get(r.id) && this._initialPointerPerView.get(r.id)) {
-          this._viewPointerPositionLog.has(r.id) || this._viewPointerPositionLog.set(r.id, []);
-          const s = new u(e, i), o = this._viewPointerPositionLog.get(r.id);
+    }), t.subscribeToEvent(rt, ({ x: e, y: i }) => {
+      this._pointerX = e, this._pointerY = i, this.getViews().forEach((s) => {
+        if (this._pointerDownPerView.get(s.id) && this._initialPointerPerView.get(s.id)) {
+          this._viewPointerPositionLog.has(s.id) || this._viewPointerPositionLog.set(s.id, []);
+          const r = new u(e, i), o = this._viewPointerPositionLog.get(s.id);
           o && o.push(new u(e, i));
-          const l = o && o.length >= 2 ? o[o.length - 2] : s.clone(), h = this._calculateDirections(
+          const l = o && o.length >= 2 ? o[o.length - 2] : r.clone(), h = this._calculateDirections(
             l,
-            s
+            r
           );
-          this._emitEvent(r, h), clearTimeout(this._stopTimer), this._stopTimer = setTimeout(() => {
-            this._emitEvent(r, h, !0);
+          this._emitEvent(s, h), clearTimeout(this._stopTimer), this._stopTimer = setTimeout(() => {
+            this._emitEvent(s, h, !0);
           }, 120);
         }
       });
     });
   }
   _emitEvent(t, e, i = !1) {
-    const r = this._viewPointerPositionLog.get(t.id), s = r && r.length >= 2 ? r[r.length - 2] : null, o = this._pointerX - this._initialPointerPerView.get(t.id).x, l = this._pointerY - this._initialPointerPerView.get(t.id).y, h = this._pointerX, d = this._pointerY, c = s ? s.x - this._initialPointerPerView.get(t.id).x : o, p = s ? s.y - this._initialPointerPerView.get(t.id).y : l, w = this._pointerY - this._initialPointer.y, m = this._pointerX - this._initialPointer.x, y = ee(this._initialPointer, {
+    const s = this._viewPointerPositionLog.get(t.id), r = s && s.length >= 2 ? s[s.length - 2] : null, o = this._pointerX - this._initialPointerPerView.get(t.id).x, l = this._pointerY - this._initialPointerPerView.get(t.id).y, h = this._pointerX, g = this._pointerY, d = r ? r.x - this._initialPointerPerView.get(t.id).x : o, p = r ? r.y - this._initialPointerPerView.get(t.id).y : l, w = this._pointerY - this._initialPointer.y, v = this._pointerX - this._initialPointer.x, y = ee(this._initialPointer, {
       x: this._pointerX,
       y: this._pointerY
-    }), f = this._targetPerView.get(t.id);
-    if (!f || !t.hasElement(f))
-      return;
-    const b = this._pointerDownPerView.get(t.id) === !0;
-    b || this._viewPointerPositionLog.clear();
-    const C = {
+    }), V = this._pointerDownPerView.get(t.id) === !0;
+    V || this._viewPointerPositionLog.clear();
+    const P = {
       view: t,
-      target: f,
-      previousX: c,
+      target: t.element,
+      previousX: d,
       previousY: p,
       x: o,
       y: l,
       pointerX: h,
-      pointerY: d,
+      pointerY: g,
       distance: y,
-      width: m,
+      width: v,
       height: w,
-      isDragging: b,
+      isDragging: V,
       directions: e,
       stopped: i
     };
-    this.emit(Ft, C);
+    this.emit(Mt, P);
   }
   _calculateDirections(t, e) {
     const i = {
@@ -2627,150 +2608,187 @@ class Mt extends rt {
       down: u.sub(new u(t.x, t.y + 1), t),
       left: u.sub(new u(t.x - 1, t.y), t),
       right: u.sub(new u(t.x + 1, t.y), t)
-    }, r = u.sub(e, t).unitVector;
+    }, s = u.sub(e, t).unitVector;
     return [
-      { direction: "up", projection: r.dot(i.up) },
+      { direction: "up", projection: s.dot(i.up) },
       {
         direction: "down",
-        projection: r.dot(i.down)
+        projection: s.dot(i.down)
       },
       {
         direction: "left",
-        projection: r.dot(i.left)
+        projection: s.dot(i.left)
       },
       {
         direction: "right",
-        projection: r.dot(i.right)
+        projection: s.dot(i.right)
       }
     ].filter(
-      (s) => s.projection > 0
+      (r) => r.projection > 0
     ).map(
-      (s) => s.direction
+      (r) => r.direction
     );
   }
 }
-a(Mt, "pluginName", "DragEventPlugin");
-class Fe {
+a(Ft, "pluginName", "DragEventPlugin");
+class Me {
   constructor(t) {
     a(this, "view"), a(this, "direction"), this.props = t, this.view = t.view, this.direction = t.direction;
   }
 }
-class Me extends rt {
+class Fe extends ot {
   constructor() {
     super(...arguments), a(this, "_viewIsPointerDownMap", /* @__PURE__ */ new Map()), a(this, "_viewPointerPositionLog", /* @__PURE__ */ new Map()), a(this, "_targetPerView", /* @__PURE__ */ new Map());
   }
   subscribeToEvents(t) {
-    t.subscribeToEvent(it, ({ x: e, y: i, target: r }) => {
-      this.getViews().forEach((s) => {
-        this._targetPerView.set(s.id, r), s.intersects(e, i) && this._viewIsPointerDownMap.set(s.id, !0);
-      });
-    }), t.subscribeToEvent(et, ({ x: e, y: i }) => {
+    t.subscribeToEvent(nt, ({ x: e, y: i, target: s }) => {
       this.getViews().forEach((r) => {
-        this._viewIsPointerDownMap.get(r.id) && (this._viewPointerPositionLog.has(r.id) || this._viewPointerPositionLog.set(r.id, []), this._viewPointerPositionLog.get(r.id).push(new u(e, i)));
+        this._targetPerView.set(r.id, s), r.intersects(e, i) && this._viewIsPointerDownMap.set(r.id, !0);
       });
-    }), t.subscribeToEvent(st, ({ x: e, y: i }) => {
+    }), t.subscribeToEvent(rt, ({ x: e, y: i }) => {
       this.getViews().forEach((s) => {
-        if (!this._viewIsPointerDownMap.get(s.id) || !this._viewPointerPositionLog.has(s.id))
+        this._viewIsPointerDownMap.get(s.id) && (this._viewPointerPositionLog.has(s.id) || this._viewPointerPositionLog.set(s.id, []), this._viewPointerPositionLog.get(s.id).push(new u(e, i)));
+      });
+    }), t.subscribeToEvent(at, ({ x: e, y: i }) => {
+      this.getViews().forEach((r) => {
+        if (!this._viewIsPointerDownMap.get(r.id) || !this._viewPointerPositionLog.has(r.id))
           return;
-        const o = new u(e, i), l = this._viewPointerPositionLog.get(s.id), h = l[l.length - 2] || o.clone(), d = this._targetPerView.get(s.id), c = r(h, o);
-        d && s.hasElement(d) && c.hasSwiped && this.emit(Fe, {
-          view: s,
-          direction: c.direction
-        }), this._viewPointerPositionLog.set(s.id, []), this._viewIsPointerDownMap.set(s.id, !1);
+        const o = new u(e, i), l = this._viewPointerPositionLog.get(r.id), h = l[l.length - 2] || o.clone(), g = this._targetPerView.get(r.id), d = s(h, o);
+        g && r.hasElement(g) && d.hasSwiped && this.emit(Me, {
+          view: r,
+          direction: d.direction
+        }), this._viewPointerPositionLog.set(r.id, []), this._viewIsPointerDownMap.set(r.id, !1);
       });
-      function r(s, o) {
+      function s(r, o) {
         const l = {
-          up: u.sub(new u(s.x, s.y - 1), s),
-          down: u.sub(new u(s.x, s.y + 1), s),
-          left: u.sub(new u(s.x - 1, s.y), s),
-          right: u.sub(new u(s.x + 1, s.y), s)
-        }, h = u.sub(o, s).unitVector, d = [
+          up: u.sub(new u(r.x, r.y - 1), r),
+          down: u.sub(new u(r.x, r.y + 1), r),
+          left: u.sub(new u(r.x - 1, r.y), r),
+          right: u.sub(new u(r.x + 1, r.y), r)
+        }, h = u.sub(o, r).unitVector, g = [
           "up",
           "down",
           "left",
           "right"
-        ], c = [
+        ], d = [
           h.dot(l.up),
           h.dot(l.down),
           h.dot(l.left),
           h.dot(l.right)
-        ], p = Math.max(...c), w = c.indexOf(p), m = d[w], y = u.sub(o, s).magnitude;
+        ], p = Math.max(...d), w = d.indexOf(p), v = g[w], y = u.sub(o, r).magnitude;
         return {
-          hasSwiped: h.dot(l[m]) * y > 30,
-          direction: m
+          hasSwiped: h.dot(l[v]) * y > 30,
+          direction: v
         };
       }
     });
   }
 }
-a(Me, "pluginName", "SwipeEventPlugin");
+a(Fe, "pluginName", "SwipeEventPlugin");
 class ke {
   constructor(t) {
     a(this, "view"), this.props = t, this.view = t.view;
   }
 }
-class $e extends rt {
+class $e extends ot {
   subscribeToEvents(t) {
-    t.subscribeToEvent(Nt, ({ x: e, y: i, target: r }) => {
-      this.getViews().forEach((s) => {
-        const o = r, l = s.element === o || s.element.contains(o);
-        s.intersects(e, i) && l && this.emit(ke, {
-          view: s
+    t.subscribeToEvent(Lt, ({ x: e, y: i, target: s }) => {
+      this.getViews().forEach((r) => {
+        const o = s, l = r.element === o || r.element.contains(o);
+        r.intersects(e, i) && l && this.emit(ke, {
+          view: r
         });
       });
     });
   }
 }
 a($e, "pluginName", "ClickEventPlugin");
-class tt {
+class st {
   constructor(t) {
-    R(this, "data");
+    x(this, "data");
     this.data = t.data;
   }
 }
 class kt {
   constructor(t) {
-    R(this, "data");
+    x(this, "data");
     this.data = t.data;
   }
 }
-function K(n) {
+function J(n) {
   return {
     map: new Map(n),
-    array: Array.from(n).map(([e, i]) => ({ slot: e, item: i })),
+    array: Array.from(n).map(([e, i]) => ({ slotId: e, itemId: i })),
     object: Array.from(n).reduce(
-      (e, [i, r]) => (e[i] = r, e),
+      (e, [i, s]) => (e[i] = s, e),
       {}
     )
   };
 }
+function ze(n) {
+  if (n.map)
+    return {
+      map: new Map(n.map),
+      array: Array.from(n.map).map(([e, i]) => ({
+        slotId: e,
+        itemId: i
+      })),
+      object: Array.from(n.map).reduce(
+        (e, [i, s]) => (e[i] = s, e),
+        {}
+      )
+    };
+  if (n.object) {
+    const t = { ...n.object };
+    return {
+      map: new Map(Object.entries(t)),
+      array: Object.entries(t).map(([e, i]) => ({
+        slotId: e,
+        itemId: i
+      })),
+      object: t
+    };
+  } else {
+    const t = [...n.array];
+    return {
+      map: new Map(t.map(({ slotId: e, itemId: i }) => [e, i])),
+      array: t,
+      object: t.reduce((e, { slotId: i, itemId: s }) => (e[i] = s, e), {})
+    };
+  }
+}
 const N = (n) => {
-  const t = n.useEventPlugin(Mt);
-  t.on(Ft, X);
-  let e, i, r, s, o = /* @__PURE__ */ new Map(), l = /* @__PURE__ */ new Map(), h, d, c, p, w = !0, m, y, f;
+  const t = n.useEventPlugin(Ft);
+  t.on(Mt, L);
+  let e, i, s, r, o = /* @__PURE__ */ new Map(), l = /* @__PURE__ */ new Map(), h, g, d, p, w = !0, v, y, V, P;
   n.api({
-    setEnabled(g) {
-      w = g;
+    setEnabled(c) {
+      w = c;
+    },
+    setData(c) {
+      const f = ze(c);
+      o = new Map(f.map), l = new Map(o);
     }
   });
-  function b() {
+  function S() {
     return {
       animation: e.data.configAnimation,
-      continuousMode: typeof e.data.configContinuousMode < "u"
+      continuousMode: typeof e.data.configContinuousMode < "u",
+      manualSwap: typeof e.data.configManualSwap < "u"
     };
   }
-  function C() {
-    const g = b().animation;
-    return g === "dynamic" ? {
+  function B() {
+    const c = S().animation;
+    return c === "dynamic" ? {
       animator: "dynamic",
       config: {}
-    } : g === "spring" ? {
+    } : c === "spring" ? {
       animator: "spring",
       config: {
         damping: 0.7,
         stiffness: 0.62
       }
-    } : g === "none" ? {
+    } : c === "none" ? {
       animator: "instant",
       config: {}
     } : {
@@ -2779,97 +2797,114 @@ const N = (n) => {
     };
   }
   n.setup(() => {
-    e = n.getView("root"), i = n.getViews("slot"), r = n.getViews("item"), y = b().continuousMode, r.forEach((g) => {
-      L(g);
-    }), S(), l = new Map(o), n.emit(kt, { data: K(o) });
+    e = n.getView("root"), i = n.getViews("slot"), s = n.getViews("item"), y = S().continuousMode, V = S().manualSwap, i.forEach((c) => {
+      M(c);
+    }), D(), l = new Map(o), requestAnimationFrame(() => {
+      n.emit(kt, { data: J(o) });
+    });
   });
-  function L(g) {
-    const P = C();
-    g.styles.position = "relative", g.styles.touchAction = "none", g.styles.userSelect = "none", g.styles.webkitUserSelect = "none", g.position.setAnimator(P.animator, P.config), g.scale.setAnimator(P.animator, P.config), g.layoutTransition(!0);
-    const v = g.getChild("handle");
-    v ? t.addView(v) : t.addView(g);
-    const E = g.getParent("slot").element;
-    o.set(E.dataset.swapySlot, g.element.dataset.swapyItem);
-  }
-  n.onViewAdded((g) => {
-    n.initialized && g.name === "item" && (L(g), S(), r = n.getViews("item"), l = new Map(o), n.emit(tt, { data: K(o) })), g.name === "slot" && (i = n.getViews("slot"));
+  function M(c) {
+    const f = c.getChild("item");
+    f && G(f), o.set(
+      c.element.dataset.swapySlot,
+      f ? f.element.dataset.swapyItem : null
+    );
+  }
+  function G(c) {
+    const f = B();
+    c.styles.position = "relative", c.styles.userSelect = "none", c.styles.webkitUserSelect = "none", c.position.setAnimator(f.animator, f.config), c.scale.setAnimator(f.animator, f.config), c.layoutTransition(!0), requestAnimationFrame(() => {
+      const m = c.getChild("handle");
+      m ? (t.addView(m), m.styles.touchAction = "none") : (t.addView(c), c.styles.touchAction = "none");
+    });
+  }
+  n.onViewAdded((c) => {
+    if (n.initialized)
+      if (c.name === "item") {
+        s = n.getViews("item");
+        const f = c.getParent("slot");
+        M(f), D(), l = new Map(o), n.emit(st, { data: J(o) });
+      } else c.name === "slot" && (i = n.getViews("slot"));
   });
-  function S() {
-    const g = C();
-    n.getViews("root-child").forEach((v) => {
-      v.position.setAnimator(g.animator, g.config), v.scale.setAnimator(g.animator, g.config), v.layoutTransition(!0);
+  function D() {
+    const c = B();
+    n.getViews("root-child").forEach((m) => {
+      m.position.setAnimator(c.animator, c.config), m.scale.setAnimator(c.animator, c.config), m.layoutTransition(!0);
     });
   }
-  function M() {
-    if (!m) return;
-    if (!h || !d) {
-      const x = s.getScroll();
-      h = m.pointerX - s.position.x + x.x, d = m.pointerY - s.position.y + x.y;
+  function A() {
+    if (!v) return;
+    if (!h || !g) {
+      const T = r.getScroll();
+      h = v.pointerX - r.position.x + T.x, g = v.pointerY - r.position.y + T.y;
     }
-    (!c || !p) && (c = s.size.width, p = s.size.height);
-    const g = s.size.width / c, P = s.size.height / p, v = h * (g - 1), E = d * (P - 1);
-    s.position.set(
+    (!d || !p) && (d = r.size.width, p = r.size.height);
+    const c = r.size.width / d, f = r.size.height / p, m = h * (c - 1), E = g * (f - 1);
+    r.position.set(
       {
-        x: m.x - v,
-        y: m.y - E
+        x: v.x - m,
+        y: v.y - E
       },
-      s.scale.x !== 1 || s.scale.y !== 1
+      r.scale.x !== 1 || r.scale.y !== 1
     );
   }
-  function X(g) {
+  function L(c) {
     if (!w) return;
-    s = g.view.name === "handle" ? g.view.getParent("item") : g.view, f || (f = s.getParent("slot")), g.isDragging ? (m = g, M(), i.forEach((v) => {
+    r = c.view.name === "handle" ? c.view.getParent("item") : c.view, P || (P = r.getParent("slot")), c.isDragging ? (v = c, A(), i.forEach((m) => {
       var $;
-      if (!v.intersects(g.pointerX, g.pointerY)) {
-        v !== f && v.element.removeAttribute("data-swapy-highlighted");
+      if (!m.intersects(c.pointerX, c.pointerY)) {
+        m !== P && m.element.removeAttribute("data-swapy-highlighted");
         return;
       }
-      if (typeof v.element.dataset.swapyHighlighted > "u" && (v.element.dataset.swapyHighlighted = ""), !g.stopped && !y)
+      if (typeof m.element.dataset.swapyHighlighted > "u" && (m.element.dataset.swapyHighlighted = ""), !P || !c.stopped && !y)
+        return;
+      const E = m.element.dataset.swapySlot, T = ($ = m.getChild("item")) == null ? void 0 : $.element.dataset.swapyItem, F = P.element.dataset.swapySlot, k = r.element.dataset.swapyItem;
+      if (!E || !F || !k)
         return;
-      const E = v.element.dataset.swapySlot, x = ($ = v.getChild("item")) == null ? void 0 : $.element.dataset.swapyItem, A = f.element.dataset.swapySlot, k = s.element.dataset.swapyItem;
-      !E || !A || !k || (o.set(E, k), x ? o.set(A, x) : o.set(A, null), Ct(o, l) || (l = new Map(o), f = null, n.emit(tt, { data: K(o) })));
-    }), r.forEach((v) => {
-      v.styles.zIndex = v === s ? "2" : "";
-    })) : (i.forEach((v) => {
-      v.element.removeAttribute("data-swapy-highlighted");
-    }), s.position.reset(), f = null, h = null, d = null, c = null, p = null, m = null), requestAnimationFrame(() => {
-      M();
+      const R = new Map(o);
+      R.set(E, k), T ? R.set(F, T) : R.set(F, null), Ct(R, l) || (V || (o = R, l = new Map(o)), P = null, n.emit(st, { data: J(R) }));
+    }), s.forEach((m) => {
+      m.styles.zIndex = m === r ? "2" : "";
+    })) : (i.forEach((m) => {
+      m.element.removeAttribute("data-swapy-highlighted");
+    }), r.position.reset(), P = null, h = null, g = null, d = null, p = null, v = null), requestAnimationFrame(() => {
+      A();
     });
   }
 };
 N.pluginName = "Swapy";
 N.scope = "root";
-let T;
-function ze() {
-  return T ? (T.updatePlugin(N), T) : (T = Be(), T.addPlugin(N), T.run(), T);
+let I;
+function Oe() {
+  return I ? (I.updatePlugin(N), I) : (I = Be(), I.addPlugin(N), I.run(), I);
 }
-const Oe = {
+const De = {
   animation: "dynamic",
-  continuousMode: !0
+  continuousMode: !0,
+  manualSwap: !1
 };
 function We(n) {
   let t = !0;
   const e = n.querySelectorAll("[data-swapy-slot]");
   return e.length === 0 && (console.error("There are no slots defined in your root element:", n), t = !1), e.forEach((i) => {
-    const r = i, s = r.dataset.swapySlot;
-    (!s || s.length === 0) && (console.error(i, "does not contain a slotId using data-swapy-slot"), t = !1);
-    const o = r.children;
+    const s = i, r = s.dataset.swapySlot;
+    (!r || r.length === 0) && (console.error(i, "does not contain a slotId using data-swapy-slot"), t = !1);
+    const o = s.children;
     o.length > 1 && (console.error(
       "slot:",
-      `"${s}"`,
+      `"${r}"`,
       "cannot contain more than one element"
     ), t = !1);
     const l = o[0];
     l && (!l.dataset.swapyItem || l.dataset.swapyItem.length === 0) && (console.error(
       "slot:",
-      `"${s}"`,
+      `"${r}"`,
       "does not contain an element with item id using data-swapy-item"
     ), t = !1);
   }), t;
 }
-function De(n, t = {}) {
+function qe(n, t = {}) {
   const e = qt();
-  return n.dataset.velPluginKey = e, n.dataset.velPlugin = "Swapy", n.dataset.velView = "root", n.dataset.velDataConfigAnimation = t.animation, t.continuousMode && (n.dataset.velDataConfigContinuousMode = "true"), Array.from(
+  return n.dataset.velPluginKey = e, n.dataset.velPlugin = "Swapy", n.dataset.velView = "root", n.dataset.velDataConfigAnimation = t.animation, t.continuousMode && (n.dataset.velDataConfigContinuousMode = "true"), t.manualSwap && (n.dataset.velDataConfigManualSwap = "true"), Array.from(
     n.querySelectorAll("[data-swapy-slot]")
   ).forEach((l) => {
     l.dataset.velView = "slot";
@@ -2889,7 +2924,7 @@ function De(n, t = {}) {
     l.dataset.velIgnore = "";
   }), e;
 }
-function qe(n) {
+function Ue(n) {
   const t = Array.from(
     n.querySelectorAll("[data-swapy-slot]:not([data-vel-view])")
   );
@@ -2901,8 +2936,8 @@ function qe(n) {
   );
   return e.forEach((i) => {
     i.dataset.velView = "item", i.dataset.velLayoutId = i.dataset.swapyItem;
-    const r = i.querySelector("[data-swapy-handle]");
-    r && (r.dataset.velView = "handle"), Array.from(
+    const s = i.querySelector("[data-swapy-handle]");
+    s && (s.dataset.velView = "handle"), Array.from(
       i.querySelectorAll("[data-swapy-text]")
     ).forEach((l) => {
       l.dataset.velLayoutPosition = "";
@@ -2913,59 +2948,71 @@ function qe(n) {
     });
   }), e.length > 0 || t.length > 0;
 }
-function Ye(n, t = {}) {
+function je(n, t = {}) {
   if (!n)
     throw new Error(
       "Cannot create a Swapy instance because the element you provided does not exist on the page!"
     );
-  const e = { ...Oe, ...t }, i = n;
+  const e = { ...De, ...t }, i = n;
   if (!We(i))
     throw new Error(
       "Cannot create a Swapy instance because your HTML structure is invalid. Fix all above errors and then try!"
     );
-  const r = De(i, e), s = new Ue(i, r);
+  const s = qe(i, e), r = new He(i, s, e);
   return {
     onSwap(o) {
-      s.setSwapCallback(o);
+      r.setSwapCallback(o);
     },
     enable(o) {
-      s.setEnabled(o);
+      r.setEnabled(o);
+    },
+    destroy() {
+      r.destroy();
+    },
+    setData(o) {
+      r.setData(o);
     }
   };
 }
-class Ue {
-  constructor(t, e) {
-    R(this, "_rootEl");
-    R(this, "_veloxiApp");
-    R(this, "_slotElMap");
-    R(this, "_itemElMap");
-    R(this, "_swapCallback");
-    R(this, "_previousMap");
-    this._rootEl = t, this._veloxiApp = ze(), this._slotElMap = this._createSlotElMap(), this._itemElMap = this._createItemElMap(), this._veloxiApp.onPluginEvent(
+class He {
+  constructor(t, e, i) {
+    x(this, "_rootEl");
+    x(this, "_veloxiApp");
+    x(this, "_slotElMap");
+    x(this, "_itemElMap");
+    x(this, "_swapCallback");
+    x(this, "_previousMap");
+    this._rootEl = t, this._veloxiApp = Oe(), this._slotElMap = this._createSlotElMap(), this._itemElMap = this._createItemElMap(), this._veloxiApp.onPluginEvent(
       N,
       kt,
-      ({ data: i }) => {
-        this._previousMap = i.map;
+      ({ data: s }) => {
+        this._previousMap = s.map;
       },
       e
     ), this._veloxiApp.onPluginEvent(
       N,
-      tt,
-      (i) => {
+      st,
+      (s) => {
         var r;
-        this._previousMap && Ct(this._previousMap, i.data.map) || (this._applyOrder(i.data.map), (r = this._swapCallback) == null || r.call(this, i), this._previousMap = i.data.map);
+        this._previousMap && Ct(this._previousMap, s.data.map) || (i.manualSwap || this._applyOrder(s.data.map), this._previousMap = s.data.map, (r = this._swapCallback) == null || r.call(this, s));
       },
       e
     ), this.setupMutationObserver();
   }
   setupMutationObserver() {
     new MutationObserver((e) => {
-      e.some((i) => i.type === "childList") && qe(this._rootEl) && (this._slotElMap = this._createSlotElMap(), this._itemElMap = this._createItemElMap());
+      e.some((i) => i.type === "childList") && Ue(this._rootEl) && (this._slotElMap = this._createSlotElMap(), this._itemElMap = this._createItemElMap());
     }).observe(this._rootEl, {
       childList: !0,
       subtree: !0
     });
   }
+  setData(t) {
+    this._veloxiApp.getPlugin("Swapy").setData(t);
+  }
+  destroy() {
+    this._veloxiApp.destroy("Swapy");
+  }
   setEnabled(t) {
     this._veloxiApp.getPlugin("Swapy").setEnabled(t);
   }
@@ -2979,8 +3026,8 @@ class Ue {
         return;
       const i = t.get(e);
       if (!i) return;
-      const r = this._slotElMap.get(e), s = this._itemElMap.get(i);
-      !r || !s || (r.innerHTML = "", r.appendChild(s));
+      const s = this._slotElMap.get(e), r = this._itemElMap.get(i);
+      !s || !r || (s.innerHTML = "", s.appendChild(r));
     });
   }
   _createSlotElMap() {
@@ -2995,5 +3042,5 @@ class Ue {
   }
 }
 export {
-  Ye as createSwapy
+  je as createSwapy
 };
diff --git a/dist/swapy.min.js b/dist/swapy.min.js
index 436fb96..4c243b0 100644
--- a/dist/swapy.min.js
+++ b/dist/swapy.min.js
@@ -1,3 +1,3 @@
-(function(E,V){typeof exports=="object"&&typeof module<"u"?V(exports):typeof define=="function"&&define.amd?define(["exports"],V):(E=typeof globalThis<"u"?globalThis:E||self,V(E.Swapy={}))})(this,function(E){"use strict";var He=Object.defineProperty;var Ye=(E,V,L)=>V in E?He(E,V,{enumerable:!0,configurable:!0,writable:!0,value:L}):E[V]=L;var T=(E,V,L)=>Ye(E,typeof V!="symbol"?V+"":V,L);function V(n,t){if(n.size!==t.size)return!1;for(let[e,i]of n)if(!t.has(e)||t.get(e)!==i)return!1;return!0}let L=0;function Ot(){return L+++""}var Wt=Object.defineProperty,Dt=(n,t,e)=>t in n?Wt(n,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):n[t]=e,a=(n,t,e)=>(Dt(n,typeof t!="symbol"?t+"":t,e),e);class z{constructor(t){a(this,"x"),a(this,"y"),a(this,"target"),this.x=t.x,this.y=t.y,this.target=t.target}}class mt extends z{}class G extends z{}class Z extends z{}class J extends z{}class ft{constructor(t){a(this,"pluginId"),a(this,"pluginName"),a(this,"viewName"),a(this,"dataName"),a(this,"dataValue"),this.event=t,this.pluginId=t.pluginId,this.pluginName=t.pluginName,this.viewName=t.viewName,this.dataName=t.dataName,this.dataValue=t.dataValue}}function qt(n){return n.replace(/(?:^\w|[A-Z]|\b\w)/g,function(t,e){return e===0?t.toLowerCase():t.toUpperCase()}).replace(/\s+/g,"").replace(/-+/g,"")}function wt(n){return n.split("").map((t,e)=>t.toUpperCase()===t?`${e!==0?"-":""}${t.toLowerCase()}`:t).join("")}class O{constructor(t){a(this,"node"),this.node=t.node}}class Q{constructor(t){a(this,"node"),this.node=t.node}}class Ut{constructor(t){a(this,"_eventBus"),a(this,"_observer"),this._eventBus=t,this._observer=new MutationObserver(this._handler.bind(this)),this._observer.observe(document.body,{childList:!0,subtree:!0,attributes:!0,attributeOldValue:!0})}_handler(t){t.forEach(e=>{e.addedNodes.forEach(r=>{if(!(r instanceof HTMLElement)||r.dataset.velViewId||r.parentElement&&typeof r.parentElement.dataset.velAdded<"u")return;let s=r;if(r.dataset.velView||(s=r.querySelector("[data-vel-view][data-vel-plugin]")),!s)return;this._eventBus.emitEvent(O,{node:s});const o=s.querySelectorAll("[data-vel-plugin]");o.length&&o.forEach(l=>{this._eventBus.emitEvent(O,{node:l})})}),e.removedNodes.forEach(r=>{if(!(r instanceof HTMLElement)||typeof r.dataset.velProcessing<"u")return;const s=r.querySelectorAll("[data-vel-plugin]");s.length&&s.forEach(o=>{this._eventBus.emitEvent(Q,{node:o})}),this._eventBus.emitEvent(Q,{node:r})});const i=e.attributeName;if(i==="data-vel-view"&&this._eventBus.emitEvent(O,{node:e.target}),i&&/data-vel-data-.+/gi.test(i)){const r=e.target,s=r.dataset.velPluginId||"",o=r.dataset.velPlugin||"",l=r.dataset.velView||"",h=r.getAttribute(i);if(h&&h!==e.oldValue){const d=qt(i.replace("data-vel-data-",""));this._eventBus.emitEvent(ft,{pluginId:s,pluginName:o,viewName:l,dataName:d,dataValue:h})}}})}}class Ht{execute(t){this.call(t)}}class yt extends Ht{constructor(t){super(),a(this,"_handler"),this._handler=t}getHandler(){return this._handler}call(t){this._handler(t)}}class tt{constructor(){a(this,"_listeners",new Map),a(this,"_keyedListeners",new Map)}subscribeToEvent(t,e,i){if(i){this._subscribeToKeyedEvent(t,e,i);return}let r=this._listeners.get(t);r||(r=[],this._listeners.set(t,r)),r.push(new yt(e))}removeEventListener(t,e,i){if(i){this._removeKeyedEventListener(t,e,i);return}let r=this._listeners.get(t);r&&(r=r.filter(s=>s.getHandler()!==e),this._listeners.set(t,r))}_subscribeToKeyedEvent(t,e,i){let r=this._keyedListeners.get(t);r||(r=new Map,this._keyedListeners.set(t,r));let s=r.get(i);s||(s=[],r.set(i,s)),s.push(new yt(e))}_removeKeyedEventListener(t,e,i){let r=this._keyedListeners.get(t);if(!r)return;let s=r.get(i);s&&(s=s.filter(o=>o.getHandler()!==e),r.set(i,s))}emitEvent(t,e,i){if(i){this._emitKeyedEvent(t,e,i);return}const r=this._listeners.get(t);r&&r.forEach(s=>{s.execute(e)})}_emitKeyedEvent(t,e,i){const r=this._keyedListeners.get(t);if(!r)return;const s=r.get(i);s&&s.forEach(o=>{o.execute(e)})}_convertListener(t){return e=>t(e)}subscribeToPluginReadyEvent(t,e,i=!1){if(i){this.subscribeToEvent(Ct,this._convertListener(t),e);return}this.subscribeToEvent(It,this._convertListener(t),e)}emitPluginReadyEvent(t,e,i=!1){if(i){this.emitEvent(Ct,e,t);return}this.emitEvent(It,e,t)}reset(){this._listeners.clear()}}let Yt=0;function Vt(){return Yt+++""}class Pt{constructor(t,e,i,r,s,o,l){a(this,"_registry"),a(this,"_eventBus"),a(this,"_appEventBus"),a(this,"_internalEventBus"),a(this,"_initialized",!1),a(this,"_config"),a(this,"_pluginFactory"),a(this,"_pluginName"),a(this,"_id"),a(this,"_pluginKey"),a(this,"_layoutIdViewMapWaitingToEnter"),a(this,"_apiData"),a(this,"_isReady",!1),this._id=Vt(),this._pluginFactory=t,this._pluginName=e,this._registry=i,this._eventBus=r,this._appEventBus=s,this._internalEventBus=new tt,this._config=o,this._layoutIdViewMapWaitingToEnter=new Map,this._pluginKey=l,this._apiData={},this._appEventBus.subscribeToPluginReadyEvent(()=>{this._isReady=!0},this._pluginName,!0)}get api(){return this._apiData}_setApi(t){this._apiData=t}get pluginName(){return this._pluginName}get pluginFactory(){return this._pluginFactory}get pluginKey(){return this._pluginKey}get id(){return this._id}get config(){return{...this._config}}getViews(t){return t?this._registry.getViewsByNameForPlugin(this,t):this._registry.getViewsForPlugin(this)}getView(t){return t?this._registry.getViewsByNameForPlugin(this,t)[0]:this._registry.getViewsForPlugin(this)[0]}getViewById(t){return this._registry.getViewById(t)}addView(t){this._registry.assignViewToPlugin(t,this)}setInternalEventBus(t){this._internalEventBus=t}get internalBusEvent(){return this._internalEventBus}emit(t,e){this._internalEventBus.emitEvent(t,e)}on(t,e){this._internalEventBus.subscribeToEvent(t,e)}removeListener(t,e){this._internalEventBus.removeEventListener(t,e)}useEventPlugin(t,e={}){const i=this._registry.createPlugin(t,this._eventBus,e);return this._registry.associateEventPluginWithPlugin(this.id,i.id),i}notifyAboutDataChanged(t){this.onDataChanged(t)}onDataChanged(t){}removeView(t){t.onRemoveCallback?this._invokeRemoveCallback(t):this._deleteView(t),this.onViewRemoved(t)}_invokeRemoveCallback(t){const e=this._createTemporaryView(t);requestAnimationFrame(()=>{var i;(i=e.onRemoveCallback)==null||i.call(e,e,()=>{var r,s;if((r=t.onAddCallbacks)!=null&&r.afterRemoved&&t.layoutId){const o=this._layoutIdViewMapWaitingToEnter.get(t.layoutId);(s=o==null?void 0:o.onAddCallbacks)==null||s.afterEnter(o),this._layoutIdViewMapWaitingToEnter.delete(t.layoutId)}this._deleteView(e,!0)}),setTimeout(()=>{e.element.parentElement&&this._deleteView(e,!0)},1e4)})}_deleteView(t,e=!1){(e||!t.layoutId)&&(this._registry.removeViewById(t.id,this.id),t.element.remove())}_createTemporaryView(t){const e=t.previousRect.viewportOffset,i=t.previousRect.size,r=t.rotation.degrees<0?0:Math.sin(t.rotation.radians)*i.height*t.scale.y,s=t.rotation.degrees>0?0:Math.sin(t.rotation.radians)*i.width*t.scale.y,o=t.element.cloneNode(!0);t.element.remove(),o.style.cssText="",o.style.position="absolute",o.style.left=`${e.left+r}px`,o.style.top=`${e.top-s}px`,o.style.width=`${i.width}px`,o.style.height=`${i.height}px`,o.style.transform=`
+(function(R,V){typeof exports=="object"&&typeof module<"u"?V(exports):typeof define=="function"&&define.amd?define(["exports"],V):(R=typeof globalThis<"u"?globalThis:R||self,V(R.Swapy={}))})(this,function(R){"use strict";var He=Object.defineProperty;var Ye=(R,V,S)=>V in R?He(R,V,{enumerable:!0,configurable:!0,writable:!0,value:S}):R[V]=S;var T=(R,V,S)=>Ye(R,typeof V!="symbol"?V+"":V,S);function V(r,t){if(r.size!==t.size)return!1;for(let[e,i]of r)if(!t.has(e)||t.get(e)!==i)return!1;return!0}let S=0;function Ot(){return S+++""}var Dt=Object.defineProperty,Wt=(r,t,e)=>t in r?Dt(r,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):r[t]=e,a=(r,t,e)=>Wt(r,typeof t!="symbol"?t+"":t,e);class U{constructor(t){a(this,"x"),a(this,"y"),a(this,"target"),this.x=t.x,this.y=t.y,this.target=t.target}}class yt extends U{}class Q extends U{}class tt extends U{}class et extends U{}class Vt{constructor(t){a(this,"pluginId"),a(this,"pluginName"),a(this,"viewName"),a(this,"dataName"),a(this,"dataValue"),this.event=t,this.pluginId=t.pluginId,this.pluginName=t.pluginName,this.viewName=t.viewName,this.dataName=t.dataName,this.dataValue=t.dataValue}}function qt(r){return r.replace(/(?:^\w|[A-Z]|\b\w)/g,function(t,e){return e===0?t.toLowerCase():t.toUpperCase()}).replace(/\s+/g,"").replace(/-+/g,"")}function bt(r){return r.split("").map((t,e)=>t.toUpperCase()===t?`${e!==0?"-":""}${t.toLowerCase()}`:t).join("")}class j{constructor(t){a(this,"node"),this.node=t.node}}class it{constructor(t){a(this,"node"),this.node=t.node}}class Ut{constructor(t){a(this,"_eventBus"),a(this,"_observer"),this._eventBus=t,this._observer=new MutationObserver(this._handler.bind(this)),this._observer.observe(document.body,{childList:!0,subtree:!0,attributes:!0,attributeOldValue:!0})}_handler(t){t.forEach(e=>{e.addedNodes.forEach(s=>{if(!(s instanceof HTMLElement)||s.dataset.velViewId||s.parentElement&&typeof s.parentElement.dataset.velAdded<"u")return;let n=s;if(s.dataset.velView||(n=s.querySelector("[data-vel-view][data-vel-plugin]")),!n)return;this._eventBus.emitEvent(j,{node:n});const o=n.querySelectorAll("[data-vel-plugin]");o.length&&o.forEach(l=>{this._eventBus.emitEvent(j,{node:l})})}),e.removedNodes.forEach(s=>{if(!(s instanceof HTMLElement)||typeof s.dataset.velProcessing<"u")return;const n=s.querySelectorAll("[data-vel-plugin]");n.length&&n.forEach(o=>{this._eventBus.emitEvent(it,{node:o})}),this._eventBus.emitEvent(it,{node:s})});const i=e.attributeName;if(i==="data-vel-view"&&this._eventBus.emitEvent(j,{node:e.target}),i&&/data-vel-data-.+/gi.test(i)){const s=e.target,n=s.dataset.velPluginId||"",o=s.dataset.velPlugin||"",l=s.dataset.velView||"",h=s.getAttribute(i);if(h&&h!==e.oldValue){const g=qt(i.replace("data-vel-data-",""));this._eventBus.emitEvent(Vt,{pluginId:n,pluginName:o,viewName:l,dataName:g,dataValue:h})}}})}}class jt{execute(t){this.call(t)}}class Pt extends jt{constructor(t){super(),a(this,"_handler"),this._handler=t}getHandler(){return this._handler}call(t){this._handler(t)}}class st{constructor(){a(this,"_listeners",new Map),a(this,"_keyedListeners",new Map)}subscribeToEvent(t,e,i){if(i){this._subscribeToKeyedEvent(t,e,i);return}let s=this._listeners.get(t);s||(s=[],this._listeners.set(t,s)),s.push(new Pt(e))}removeEventListener(t,e,i){if(i){this._removeKeyedEventListener(t,e,i);return}let s=this._listeners.get(t);s&&(s=s.filter(n=>n.getHandler()!==e),this._listeners.set(t,s))}_subscribeToKeyedEvent(t,e,i){let s=this._keyedListeners.get(t);s||(s=new Map,this._keyedListeners.set(t,s));let n=s.get(i);n||(n=[],s.set(i,n)),n.push(new Pt(e))}_removeKeyedEventListener(t,e,i){let s=this._keyedListeners.get(t);if(!s)return;let n=s.get(i);n&&(n=n.filter(o=>o.getHandler()!==e),s.set(i,n))}emitEvent(t,e,i){if(i){this._emitKeyedEvent(t,e,i);return}const s=this._listeners.get(t);s&&s.forEach(n=>{n.execute(e)})}_emitKeyedEvent(t,e,i){const s=this._keyedListeners.get(t);if(!s)return;const n=s.get(i);n&&n.forEach(o=>{o.execute(e)})}_convertListener(t){return e=>t(e)}subscribeToPluginReadyEvent(t,e,i=!1){if(i){this.subscribeToEvent(St,this._convertListener(t),e);return}this.subscribeToEvent(Nt,this._convertListener(t),e)}emitPluginReadyEvent(t,e,i=!1){if(i){this.emitEvent(St,e,t);return}this.emitEvent(Nt,e,t)}reset(){this._listeners.clear()}}let Ht=0;function Et(){return Ht+++""}class Rt{constructor(t,e,i,s,n,o,l){a(this,"_registry"),a(this,"_eventBus"),a(this,"_appEventBus"),a(this,"_internalEventBus"),a(this,"_initialized",!1),a(this,"_config"),a(this,"_pluginFactory"),a(this,"_pluginName"),a(this,"_id"),a(this,"_pluginKey"),a(this,"_layoutIdViewMapWaitingToEnter"),a(this,"_apiData"),a(this,"_isReady",!1),this._id=Et(),this._pluginFactory=t,this._pluginName=e,this._registry=i,this._eventBus=s,this._appEventBus=n,this._internalEventBus=new st,this._config=o,this._layoutIdViewMapWaitingToEnter=new Map,this._pluginKey=l,this._apiData={},this._appEventBus.subscribeToPluginReadyEvent(()=>{this._isReady=!0},this._pluginName,!0)}get api(){return this._apiData}_setApi(t){this._apiData=t}get pluginName(){return this._pluginName}get pluginFactory(){return this._pluginFactory}get pluginKey(){return this._pluginKey}get id(){return this._id}get config(){return{...this._config}}getViews(t){return t?this._registry.getViewsByNameForPlugin(this,t):this._registry.getViewsForPlugin(this)}getView(t){return t?this._registry.getViewsByNameForPlugin(this,t)[0]:this._registry.getViewsForPlugin(this)[0]}getViewById(t){return this._registry.getViewById(t)}addView(t){this._registry.assignViewToPlugin(t,this)}setInternalEventBus(t){this._internalEventBus=t}get internalBusEvent(){return this._internalEventBus}emit(t,e){this._internalEventBus.emitEvent(t,e,this.pluginKey)}on(t,e){this._internalEventBus.subscribeToEvent(t,e,this.pluginKey)}removeListener(t,e){this._internalEventBus.removeEventListener(t,e)}useEventPlugin(t,e={}){const i=this._registry.createPlugin(t,this._eventBus,e);return this._registry.associateEventPluginWithPlugin(this.id,i.id),i}notifyAboutDataChanged(t){this.onDataChanged(t)}onDataChanged(t){}removeView(t){t.onRemoveCallback?this._invokeRemoveCallback(t):this._deleteView(t),this.onViewRemoved(t)}_invokeRemoveCallback(t){const e=this._createTemporaryView(t);requestAnimationFrame(()=>{var i;(i=e.onRemoveCallback)==null||i.call(e,e,()=>{var s,n;if((s=t.onAddCallbacks)!=null&&s.afterRemoved&&t.layoutId){const o=this._layoutIdViewMapWaitingToEnter.get(t.layoutId);(n=o==null?void 0:o.onAddCallbacks)==null||n.afterEnter(o),this._layoutIdViewMapWaitingToEnter.delete(t.layoutId)}this._deleteView(e,!0)}),setTimeout(()=>{e.element.parentElement&&this._deleteView(e,!0)},1e4)})}_deleteView(t,e=!1){(e||!t.layoutId)&&(this._registry.removeViewById(t.id,this.id),t.element.remove())}_createTemporaryView(t){const e=t.previousRect.viewportOffset,i=t.previousRect.size,s=t.rotation.degrees<0?0:Math.sin(t.rotation.radians)*i.height*t.scale.y,n=t.rotation.degrees>0?0:Math.sin(t.rotation.radians)*i.width*t.scale.y,o=t.element.cloneNode(!0);t.element.remove(),o.style.cssText="",o.style.position="absolute",o.style.left=`${e.left+s}px`,o.style.top=`${e.top-n}px`,o.style.width=`${i.width}px`,o.style.height=`${i.height}px`,o.style.transform=`
       scale3d(${t.scale.x}, ${t.scale.y}, 1) rotate(${t.rotation.degrees}deg)
-    `,o.style.pointerEvents="none",o.dataset.velRemoved="",document.body.appendChild(o);const l=this._registry.createView(o,t.name);return l.setAsTemporaryView(),l.styles.position="absolute",l.styles.left=`${e.left+r}px`,l.styles.top=`${e.top-s}px`,l.rotation.setDegrees(t.rotation.degrees,!1),l.scale.set({x:t.scale.x,y:t.scale.y},!1),l.size.set({width:t._localWidth,height:t._localHeight},!1),t._copyAnimatorsToAnotherView(l),t.onRemoveCallback&&l.onRemove(t.onRemoveCallback),l}onViewRemoved(t){}notifyAboutViewAdded(t){this.onViewAdded(t),this._invokeAddCallbacks(t)}_invokeAddCallbacks(t){var e,i,r;!((e=t.onAddCallbacks)!=null&&e.onInitialLoad)&&!this._initialized||((i=t.onAddCallbacks)==null||i.beforeEnter(t),!((r=t.onAddCallbacks)!=null&&r.afterRemoved)||!this._initialized?requestAnimationFrame(()=>{var s;(s=t.onAddCallbacks)==null||s.afterEnter(t)}):t.layoutId&&this._layoutIdViewMapWaitingToEnter.set(t.layoutId,t))}onViewAdded(t){}init(){!this._initialized&&this._isReady&&(this.setup(),this._initialized=!0)}setup(){}subscribeToEvents(t){}}class Xt extends Pt{isRenderable(){return!0}isInitialized(){return this._initialized}get initialized(){return this._initialized}update(t,e){}render(){}addView(t){t.setPluginId(this.id),super.addView(t)}}class et extends Pt{isRenderable(){return!1}}class jt{constructor(t){a(this,"_plugin"),this._plugin=t}get initialized(){return this._plugin.isInitialized()}get config(){return this._plugin.config}setup(t){this._plugin.setup=t}api(t){this._plugin._setApi(t)}update(t){this._plugin.update=t}render(t){this._plugin.render=t}getViews(t){return this._plugin.getViews(t)}getView(t){return this._plugin.getView(t)}getViewById(t){return this._plugin.getViewById(t)}useEventPlugin(t,e={}){return this._plugin.useEventPlugin(t,e)}emit(t,e){this._plugin.emit(t,e)}on(t,e){this._plugin.on(t,e)}onDataChanged(t){this._plugin.onDataChanged=t}onViewRemoved(t){this._plugin.onViewRemoved=t}onViewAdded(t){this._plugin.onViewAdded=t}subscribeToEvents(t){this._plugin.subscribeToEvents=t}}function it(n,t,e,i,r,s){if(Kt(n))return new n(n,n.pluginName,t,e,i,r,s);const o=new Xt(n,n.pluginName,t,e,i,r,s),l=new jt(o);return n(l),o}function Kt(n){var t;return((t=n.prototype)==null?void 0:t.constructor.toString().indexOf("class "))===0}class u{constructor(t,e){a(this,"x"),a(this,"y"),this.x=t,this.y=e}get magnitudeSquared(){return this.x*this.x+this.y*this.y}get magnitude(){return Math.sqrt(this.x*this.x+this.y*this.y)}get unitVector(){const t=new u(0,0),e=this.magnitude;return e!==0&&(t.x=this.x/e,t.y=this.y/e),t}add(t){this.x+=t.x,this.y+=t.y}sub(t){this.x-=t.x,this.y-=t.y}scale(t){this.x*=t,this.y*=t}dot(t){return this.x*t.x+this.y*t.y}equals(t){return this.x===t.x&&this.y===t.y}clone(){return new u(this.x,this.y)}static scale(t,e){return new u(t.x*e,t.y*e)}static sub(t,e){return new u(t.x-e.x,t.y-e.y)}static add(t,e){return new u(t.x+e.x,t.y+e.y)}}class Gt{constructor(t){a(this,"_element"),a(this,"_callback"),this._element=t,this._observe()}setElement(t){this._element=t,this._observe()}_observe(){var t;const e=new MutationObserver(()=>{var s;(s=this._callback)==null||s.call(this,!1)}),i={attributes:!0,childList:!0,attributeOldValue:!0};e.observe(this._element,i),new ResizeObserver(()=>{var s;(s=this._callback)==null||s.call(this,!0)}).observe(this._element);function r(s,o){let l,h=!0;return function(){h&&(s(),h=!1),clearTimeout(l),l=setTimeout(()=>{s(),h=!0},o)}}(t=this._element.parentElement)==null||t.addEventListener("scroll",r(()=>{var s;(s=this._callback)==null||s.call(this,!0)},30)),window.addEventListener("scroll",r(()=>{var s;(s=this._callback)==null||s.call(this,!0)},30)),window.addEventListener("resize",r(()=>{var s;(s=this._callback)==null||s.call(this,!0)},30))}onChange(t){this._callback=t}}function Zt(n){return new Gt(n)}function Jt(n,t){const e=t.x-n.x,i=t.y-n.y;return Math.sqrt(e*e+i*i)}function _(n,t){const e=n-t;return Math.abs(e)<=.01}function P(n){let t=n.match(/^([\d.]+)([a-zA-Z%]*)$/);t||(t="0px".match(/^([\d.]+)([a-zA-Z%]*)$/));const e=parseFloat(t[1]),i=t[2];return{value:e,unit:i,valueWithUnit:n}}function Qt(n,t,e=!1){if(n===t)return!0;if(n.length!==t.length)return!1;for(let i=0;i<n.length;i++)if(e&&!_(n[i].value,t[i].value)||n[i].value!==t[i].value)return!1;return!0}function bt(n,t){return Qt(n,t,!0)}class F{constructor(t,e,i,r){a(this,"_topLeft"),a(this,"_topRight"),a(this,"_bottomLeft"),a(this,"_bottomRight"),this._topLeft=t,this._topRight=e,this._bottomLeft=i,this._bottomRight=r}get value(){return{topLeft:this._topLeft,topRight:this._topRight,bottomRight:this._bottomRight,bottomLeft:this._bottomLeft}}equals(t){return _(this.value.topLeft.value,t.value.topLeft.value)&&_(this.value.topRight.value,t.value.topRight.value)&&_(this.value.bottomRight.value,t.value.bottomRight.value)&&_(this.value.bottomLeft.value,t.value.bottomLeft.value)}toCssPercentageForNewSize(t){const e=this._convertToPercentage(this._topLeft,t),i=this._convertToPercentage(this._topRight,t),r=this._convertToPercentage(this._bottomLeft,t),s=this._convertToPercentage(this._bottomRight,t);return`${e.h} ${i.h} ${s.h} ${r.h} / ${e.v} ${i.v} ${s.v} ${r.v}`}_convertToPercentage(t,e){if(t.unit==="%")return{h:`${t.value}%`,v:`${t.value}%`};const i=t.value/e.width*100,r=t.value/e.height*100;return{h:`${i}%`,v:`${r}%`}}}function st(n){const t=n.split(" ").map(i=>P(i)),e={value:0,unit:"",valueWithUnit:"0"};switch(t.length){case 1:return new F(t[0],t[0],t[0],t[0]);case 2:return new F(t[0],t[1],t[0],t[1]);case 3:return new F(t[0],t[1],t[2],t[1]);case 4:return new F(t[0],t[1],t[3],t[2]);default:return new F(e,e,e,e)}}function te(n,t){const e=o(n.topLeft,t),i=o(n.topRight,t),r=o(n.bottomLeft,t),s=o(n.bottomRight,t);return{v:{topLeft:e.v,topRight:i.v,bottomRight:s.v,bottomLeft:r.v},h:{topLeft:e.h,topRight:i.h,bottomRight:s.h,bottomLeft:r.h}};function o(l,h){if(l.unit==="%")return{h:P(`${l.value}%`),v:P(`${l.value}%`)};const d=l.value/h.width*100,c=l.value/h.height*100;return{h:P(`${d}%`),v:P(`${c}%`)}}}function Et(n,t){return _(n.topLeft.value,t.topLeft.value)&&_(n.topRight.value,t.topRight.value)&&_(n.bottomRight.value,t.bottomRight.value)&&_(n.bottomLeft.value,t.bottomLeft.value)}class ee{constructor(t){a(this,"_value"),this._value=t}get value(){return this._value}equals(t){return _(this.value,t.value)}}function ie(n){return new ee(parseFloat(n))}class se{constructor(t,e){a(this,"_x"),a(this,"_y"),this._x=t,this._y=e}get value(){return new u(this._x,this._y)}}function re(n,t){const[e,i]=n.split(" "),r=P(e),s=P(i);return new se(r.value/t.width,s.value/t.height)}function Rt(n,t){const e=ne(n),i=n.offsetWidth,r=n.offsetHeight;return{viewportOffset:{left:Math.round(e.left),top:Math.round(e.top),right:Math.round(e.right),bottom:Math.round(e.bottom)},pageOffset:t.read({width:i,height:r}),size:{width:i,height:r}}}function ne(n){const t=n.getBoundingClientRect();return{left:t.left,top:t.top,right:t.right,bottom:t.bottom,width:t.width,height:t.height}}function xt(n){let t=n,e=0,i=0;for(;t;)e+=t.offsetTop,i+=t.offsetLeft,t=t.offsetParent;return{top:e,left:i}}class ae{constructor(t){a(this,"_currentPageRect"),a(this,"_view"),a(this,"_element"),a(this,"_offsetLeft"),a(this,"_offsetTop"),a(this,"_width"),a(this,"_height"),a(this,"_parentWidth"),a(this,"_parentHeight"),a(this,"_parentEl"),a(this,"_isSvg"),a(this,"_invalid"),this._invalid=!0,this._view=t,this._element=t.element,this._isSvg=!!this._element.closest("svg"),this._offsetLeft=0,this._offsetTop=0,this._width=0,this._height=0,this._parentWidth=0,this._parentHeight=0,this._offsetLeft=0,this._parentEl=this._element.parentElement,window.addEventListener("resize",()=>{this.invalidate()})}invalidate(){this._invalid=!0}read(t){if(this._isSvg)return this._currentPageRect||(this._currentPageRect=xt(this._element)),this._currentPageRect;const e=this._element.parentElement,i=this._element.offsetLeft,r=this._element.offsetTop,s=t.width,o=t.height,l=(e==null?void 0:e.offsetWidth)||0,h=(e==null?void 0:e.offsetHeight)||0;return(this._offsetLeft!==i||this._offsetTop!==r||!_(this._width,s)||!_(this._height,o))&&this._view._children.forEach(d=>d.elementReader.invalidatePageRect()),!this._invalid&&this._currentPageRect&&this._offsetLeft===i&&this._offsetTop===r&&_(this._width,s)&&_(this._height,o)&&_(this._parentWidth,l)&&_(this._parentHeight,h)&&this._parentEl===e?this._currentPageRect:(this._offsetLeft=i,this._offsetTop=r,this._width=s,this._height=o,this._parentWidth=l,this._parentHeight=h,this._parentEl=e,this._currentPageRect=xt(this._element),this._invalid=!1,this._currentPageRect)}}function oe(n){return new ae(n)}class le{constructor(t){a(this,"_element"),a(this,"_rect"),a(this,"_computedStyle"),a(this,"_pageRectReader"),a(this,"_scroll"),this._element=t.element,this._pageRectReader=oe(t),this._rect=Rt(this._element,this._pageRectReader),this._computedStyle=getComputedStyle(this._element),this._scroll=this._calculateScroll()}invalidatePageRect(){this._pageRectReader.invalidate()}update(t=!1){this._rect=Rt(this._element,this._pageRectReader),this._computedStyle=getComputedStyle(this._element),t&&(this._scroll=this._calculateScroll())}get rect(){return this._rect}get opacity(){return ie(this._computedStyle.opacity)}get borderRadius(){return st(this._computedStyle.borderRadius)}get origin(){return re(this._computedStyle.transformOrigin,this._rect.size)}_calculateScroll(){let t=this._element,e=0,i=0;for(;t;)e+=t.scrollTop,i+=t.scrollLeft,t=t.offsetParent;return i+=window.scrollX,e+=window.scrollY,{y:e,x:i}}get scroll(){return this._scroll}}function Tt(n){return new le(n)}function rt(n,t){const e={set:(i,r,s)=>(typeof i[r]=="object"&&i[r]!==null?i[r]=rt(s,t):(t(),i[r]=s),!0),get:(i,r)=>typeof i[r]=="object"&&i[r]!==null?rt(i[r],t):i[r]};return new Proxy(n,e)}const W=.01,nt={speed:15};class at{constructor(t){a(this,"name","dynamic"),a(this,"_config"),this._config=t}get config(){return this._config}}class he extends at{update({animatorProp:t,current:e,target:i,dt:r}){const s=u.sub(i,e),o=u.scale(s,this._config.speed);let l=u.add(e,u.scale(o,r));return this._shouldFinish(i,e,o)&&(l=i,requestAnimationFrame(()=>{t.callCompleteCallback()})),t.callUpdateCallback(),l}_shouldFinish(t,e,i){return u.sub(t,e).magnitude<W&&i.magnitude<W}}class ue extends at{update({animatorProp:t,current:e,target:i,dt:r}){const s=(i-e)*this._config.speed;let o=e+s*r;return _(o,i)&&(o=i,requestAnimationFrame(()=>{t.callCompleteCallback()})),t.callUpdateCallback(),o}}class ce extends at{update({animatorProp:t,current:e,target:i,dt:r}){return i.map((s,o)=>{const l=e[o],h=s.value===0?l.unit:s.unit,d=(s.value-l.value)*this._config.speed,c=l.value+d*r;let p=P(`${c}${h}`);return this._shouldFinish(s.value,l.value,d)&&(p=s,requestAnimationFrame(()=>{t.callCompleteCallback()})),t.callUpdateCallback(),p})}_shouldFinish(t,e,i){return Math.abs(t-e)<W&&Math.abs(i)<W}}class ot{constructor(){a(this,"name","instant"),a(this,"_config",{})}get config(){return this._config}update(t){return requestAnimationFrame(()=>{t.animatorProp.callCompleteCallback()}),t.target}}const lt={stiffness:.5,damping:.75,speed:10},D=.01;class ht{constructor(t){a(this,"name","spring"),a(this,"_config"),this._config=t}get config(){return this._config}}class de extends ht{constructor(){super(...arguments),a(this,"_velocity",new u(0,0))}update({animatorProp:t,current:e,target:i,dt:r}){const s=u.scale(u.scale(u.sub(e,i),-1),this._config.stiffness);this._velocity=u.add(this._velocity,s),this._velocity=u.scale(this._velocity,this._config.damping);let o=u.add(e,u.scale(this._velocity,r*this._config.speed));return this._shouldFinish(i,e)&&(o=i,requestAnimationFrame(()=>{t.callCompleteCallback()})),o}_shouldFinish(t,e){return u.sub(t,e).magnitude<D&&this._velocity.magnitude<D}}class ge extends ht{constructor(){super(...arguments),a(this,"_velocity",0)}update({animatorProp:t,current:e,target:i,dt:r}){const s=-(e-i)*this._config.stiffness;this._velocity+=s,this._velocity*=this._config.damping;let o=e+this._velocity*r*this._config.speed;return _(o,i)&&(o=i,requestAnimationFrame(()=>{t.callCompleteCallback()})),o}}class pe extends ht{constructor(){super(...arguments),a(this,"_velocity",0)}update({animatorProp:t,current:e,target:i,dt:r}){return i.map((s,o)=>{const l=e[o],h=s.value===0?l.unit:s.unit,d=-(l.value-s.value)*this._config.stiffness;this._velocity+=d,this._velocity*=this._config.damping;const c=l.value+this._velocity*r*this._config.speed;let p=P(`${c}${h}`);return this._shouldFinish(s.value,l.value)&&(p=s,requestAnimationFrame(()=>{t.callCompleteCallback()})),p})}_shouldFinish(t,e){return Math.abs(t-e)<D&&Math.abs(this._velocity)<D}}function _e(n){return n}const ut={duration:350,ease:_e};class ct{constructor(t){a(this,"name","tween"),a(this,"_config"),a(this,"_startTime"),this._config=t}get config(){return this._config}reset(){this._startTime=void 0}}class ve extends ct{update({animatorProp:t,initial:e,target:i,ts:r}){this._startTime||(this._startTime=r);const s=Math.min(1,(r-this._startTime)/this._config.duration);return _(s,1)?(requestAnimationFrame(()=>{t.callCompleteCallback()}),i):u.add(e,u.scale(u.sub(i,e),this._config.ease(s)))}}class me extends ct{update({animatorProp:t,initial:e,target:i,ts:r}){this._startTime||(this._startTime=r);const s=Math.min(1,(r-this._startTime)/this._config.duration);return _(s,1)?(requestAnimationFrame(()=>{t.callCompleteCallback()}),i):e.map((o,l)=>{const h=i[l],d=h.value===0?o.unit:h.unit,c=o.value+this._config.ease(s)*(i[l].value-o.value);return P(`${c}${d}`)})}}class fe extends ct{update({animatorProp:t,initial:e,target:i,ts:r}){this._startTime||(this._startTime=r);const s=Math.min(1,(r-this._startTime)/this._config.duration);return _(s,1)?(requestAnimationFrame(()=>{t.callCompleteCallback()}),i):e+(i-e)*this._config.ease(s)}}class dt{createAnimatorByName(t,e){switch(t){case"instant":return this.createInstantAnimator();case"dynamic":return this.createDynamicAnimator(e);case"tween":return this.createTweenAnimator(e);case"spring":return this.createSpringAnimator(e)}return this.createInstantAnimator()}}class q extends dt{createInstantAnimator(){return new ot}createTweenAnimator(t){return new ve({...ut,...t})}createDynamicAnimator(t){return new he({...nt,...t})}createSpringAnimator(t){return new de({...lt,...t})}}class we extends dt{createInstantAnimator(){return new ot}createTweenAnimator(t){return new me({...ut,...t})}createDynamicAnimator(t){return new ce({...nt,...t})}createSpringAnimator(t){return new pe({...lt,...t})}}class At extends dt{createInstantAnimator(){return new ot}createDynamicAnimator(t){return new ue({...nt,...t})}createTweenAnimator(t){return new fe({...ut,...t})}createSpringAnimator(t){return new ge({...lt,...t})}}function M(n){return structuredClone(n)}class ye{constructor(t){a(this,"_viewProp"),a(this,"_completeCallback"),a(this,"_updateCallback"),a(this,"_isAnimating"),this._viewProp=t,this._isAnimating=!1}set(t,e){this._viewProp.setAnimator(t,e)}get name(){return this._viewProp.getAnimator().name}onComplete(t){this._completeCallback=t}get isAnimating(){return this._isAnimating}markAsAnimating(){this._isAnimating=!0}callCompleteCallback(){var t;(t=this._completeCallback)==null||t.call(this),this._isAnimating=!1}onUpdate(t){this._updateCallback=t}callUpdateCallback(){var t;(t=this._updateCallback)==null||t.call(this)}}class C{constructor(t,e,i){a(this,"_animatorProp"),a(this,"_animator"),a(this,"_initialValue"),a(this,"_previousValue"),a(this,"_targetValue"),a(this,"_currentValue"),a(this,"_hasChanged"),a(this,"_view"),a(this,"_animatorFactory"),a(this,"_previousRenderValue"),this._animatorProp=new ye(this),this._animatorFactory=t,this._initialValue=M(e),this._previousValue=M(e),this._targetValue=M(e),this._currentValue=M(e),this._hasChanged=!1,this._previousRenderValue=void 0,this._view=i,this._animator=this._animatorFactory.createInstantAnimator()}get shouldRender(){return!0}get isAnimating(){return this.animator.isAnimating}getAnimator(){return this._animator}get animator(){return this._animatorProp}get _rect(){return this._view.rect}get _previousRect(){return this._view.previousRect}setAnimator(t,e){this._animator=this._animatorFactory.createAnimatorByName(t,e)}_setTarget(t,e=!0){var i,r;this._previousValue=M(this._currentValue),this._targetValue=t,e?((r=(i=this._animator).reset)==null||r.call(i),this.animator.markAsAnimating()):this._currentValue=t,this._hasChanged=!0}hasChanged(){return this._hasChanged}destroy(){this._hasChanged=!1}update(t,e){}}class Ve extends C{constructor(){super(...arguments),a(this,"_invertedBorderRadius"),a(this,"_forceStyleUpdateThisFrame",!1),a(this,"_updateWithScale",!1)}setFromElementPropValue(t){this._setTarget([t.value.topLeft,t.value.topRight,t.value.bottomRight,t.value.bottomLeft],!0)}enableUpdateWithScale(){this._updateWithScale=!0}disableUpdateWithScale(){this._updateWithScale=!1}get value(){return{topLeft:this._currentValue[0],topRight:this._currentValue[1],bottomRight:this._currentValue[2],bottomLeft:this._currentValue[3]}}get invertedBorderRadius(){return this._invertedBorderRadius}set(t,e=!0){let i;if(typeof t=="string"){const h=st(t.trim());i={topLeft:h.value.topLeft.valueWithUnit,topRight:h.value.topRight.valueWithUnit,bottomRight:h.value.bottomRight.valueWithUnit,bottomLeft:h.value.bottomLeft.valueWithUnit}}else i=t;const r=i.topLeft?P(i.topLeft):this._currentValue[0],s=i.topRight?P(i.topRight):this._currentValue[1],o=i.bottomRight?P(i.bottomRight):this._currentValue[2],l=i.bottomLeft?P(i.bottomLeft):this._currentValue[3];this._setTarget([r,s,o,l],e)}reset(t=!0){this._setTarget(this._initialValue,t)}update(t,e){if(this._forceStyleUpdateThisFrame)this._hasChanged=!0,this._forceStyleUpdateThisFrame=!1;else if(this._view.scale.isAnimating&&this._updateWithScale)this._hasChanged=!0;else if(bt(this._targetValue,this._currentValue)){this._hasChanged=!bt(this._targetValue,this._initialValue);return}this._currentValue=this._animator.update({animatorProp:this._animatorProp,current:this._currentValue,target:this._targetValue,initial:this._previousValue,ts:t,dt:e}),this._updateWithScale&&this._applyScaleInverse()}applyScaleInverse(){this._updateWithScale&&(this._forceStyleUpdateThisFrame=!0)}_applyScaleInverse(){if(_(this._view.scale.x,1)&&_(this._view.scale.y,1))return;const t=this._rect.size.width*this._view.scale.x,e=this._rect.size.height*this._view.scale.y;this._invertedBorderRadius=te(st(`${this._currentValue[0].valueWithUnit} ${this._currentValue[1].valueWithUnit} ${this._currentValue[2].valueWithUnit} ${this._currentValue[3].valueWithUnit}`).value,{width:t,height:e})}get shouldRender(){return this._hasChanged?this._previousRenderValue?!(Et(this.renderValue.v,this._previousRenderValue.v)&&Et(this.renderValue.h,this._previousRenderValue.h)):!0:!1}get renderValue(){return this.invertedBorderRadius?{v:{topLeft:this.invertedBorderRadius.v.topLeft,topRight:this.invertedBorderRadius.v.topRight,bottomLeft:this.invertedBorderRadius.v.bottomLeft,bottomRight:this.invertedBorderRadius.v.bottomRight},h:{topLeft:this.invertedBorderRadius.h.topLeft,topRight:this.invertedBorderRadius.h.topRight,bottomLeft:this.invertedBorderRadius.h.bottomLeft,bottomRight:this.invertedBorderRadius.h.bottomRight}}:{v:{topLeft:this.value.topLeft,topRight:this.value.topRight,bottomLeft:this.value.bottomLeft,bottomRight:this.value.bottomRight},h:{topLeft:this.value.topLeft,topRight:this.value.topRight,bottomLeft:this.value.bottomLeft,bottomRight:this.value.bottomRight}}}projectStyles(){const t=this.renderValue,e=`border-radius: ${t.h.topLeft.valueWithUnit} ${t.h.topRight.valueWithUnit} ${t.h.bottomRight.valueWithUnit} ${t.h.bottomLeft.valueWithUnit} / ${t.v.topLeft.valueWithUnit} ${t.v.topRight.valueWithUnit} ${t.v.bottomRight.valueWithUnit} ${t.v.bottomLeft.valueWithUnit};`;return this._previousRenderValue=t,e}isTransform(){return!1}}class Pe extends C{setFromElementPropValue(t){this._setTarget(t.value,!0)}get value(){return this._currentValue}set(t,e=!0){this._setTarget(t,e)}reset(t=!0){this._setTarget(1,t)}update(t,e){if(_(this._targetValue,this._currentValue)){this._hasChanged=!_(this._targetValue,this._initialValue);return}this._currentValue=this._animator.update({animatorProp:this._animatorProp,current:this._currentValue,target:this._targetValue,initial:this._previousValue,ts:t,dt:e})}get shouldRender(){return this._hasChanged?typeof this._previousRenderValue>"u"?!0:this.renderValue!==this._previousRenderValue:!1}get renderValue(){return this.value}projectStyles(){const t=this.renderValue,e=`opacity: ${t};`;return this._previousRenderValue=t,e}isTransform(){return!1}}class be extends C{get x(){return this._currentValue.x}get y(){return this._currentValue.y}set(t){const e={x:this.x,y:this.y,...t};if(e.x<0||e.x>1){console.log(`%c WARNING: ${this._view.name}.origin.x property can only be a value from 0 to 1`,"background: #885500");return}if(e.y<0||e.y>1){console.log(`%c WARNING: ${this._view.name}.origin.y property can only be a value from 0 to 1`,"background: #885500");return}this._setTarget(new u(e.x,e.y),!1)}reset(){this._setTarget(this._initialValue,!1)}get shouldRender(){if(!this._hasChanged)return!1;if(!this._previousRenderValue)return!0;const t=this.renderValue;return!(_(t.x,this._previousRenderValue.x)&&_(t.y,this._previousRenderValue.y))}get renderValue(){return new u(this.x*100,this.y*100)}projectStyles(){const t=this.renderValue,e=`transform-origin: ${t.x}% ${t.y}%;`;return this._previousRenderValue=t,e}isTransform(){return!1}}class Ee extends C{constructor(){super(...arguments),a(this,"_animateLayoutUpdateNextFrame",!1),a(this,"_parentScaleInverse",new u(1,1))}get _parentDiff(){let t=this._view._parent,e=0,i=0;if(t){const r=t.rect.pageOffset,s=t.getScroll(),o={left:t.previousRect.viewportOffset.left+s.x,top:t.previousRect.viewportOffset.top+s.y};e=o.left-r.left,i=o.top-r.top}return{parentDx:e,parentDy:i}}get x(){return this._currentValue.x+this._rect.pageOffset.left+this._parentDiff.parentDx}get y(){return this._currentValue.y+this._rect.pageOffset.top+this._parentDiff.parentDy}get initialX(){return this._rect.pageOffset.left}get initialY(){return this._rect.pageOffset.top}progressTo(t){const e=typeof t.x>"u"?this.initialX:t.x,i=typeof t.y>"u"?this.initialY:t.y,r=new u(e,i),s=new u(this.initialX,this.initialY),o=new u(this.x,this.y),l=u.sub(o,s),h=u.sub(r,s);return 1-u.sub(h,l).magnitude/h.magnitude}set(t,e=!0){const i={x:this.x,y:this.y,...t};this._setTarget(new u(i.x-this._rect.pageOffset.left,i.y-this._rect.pageOffset.top),e)}reset(t=!0){this._setTarget(new u(0,0),t)}update(t,e){if((this._view.isInverseEffectEnabled||this._view.isLayoutTransitionEnabled)&&!this._view.isTemporaryView&&this._runLayoutTransition(),this._view.isInverseEffectEnabled){const h=this._view._parent,d=h?h.scale.x:1,c=h?h.scale.y:1;this._parentScaleInverse=new u(1/d,1/c),this._parentScaleInverse.equals(new u(1,1))||(this._hasChanged=!0)}if(this._targetValue.x===this._currentValue.x&&this._targetValue.y===this._currentValue.y)return;const i=this._view._parent,r=i?i.scale.x:1,s=i?i.scale.y:1,o=i?i.scale._previousValue.x:1,l=i?i.scale._previousValue.y:1;this._currentValue=this._animator.update({animatorProp:this._animatorProp,current:new u(this._currentValue.x*r,this._currentValue.y*s),target:this._targetValue,initial:new u(this._previousValue.x*o,this._previousValue.y*l),ts:t,dt:e}),this._currentValue=new u(this._currentValue.x/r,this._currentValue.y/s)}_runLayoutTransition(){const t=!(this._targetValue.x===this._currentValue.x&&this._targetValue.y===this._currentValue.y),e=!(this._view.scale._targetValue.x===this._view.scale._currentValue.x&&this._view.scale._targetValue.y===this._view.scale._currentValue.y),i=t||e,r=this._rect.pageOffset.left-this._previousRect.pageOffset.left,s=this._rect.pageOffset.top-this._previousRect.pageOffset.top,o=this._previousRect.size.width/this._rect.size.width,l=this._previousRect.size.height/this._rect.size.height;let h=!1;if(r!==0||s!==0||!Number.isNaN(o)&&o!==1||!Number.isNaN(l)&&l!==1?h=!0:h=(()=>{const d=this._view._parents;for(let c=0;c<d.length;c++){const p=d[c],w=p.previousRect.size.width/p.rect.size.width,m=p.previousRect.size.height/p.rect.size.height;if(w!==1||m!==1)return!0}return!1})(),h){if(this._currentValue.x!==0||this._currentValue.y!==0||this._view.scale._currentValue.x!==1||this._view.scale._currentValue.y!==1){if(!i){const X=this._rect.pageOffset.left-this._previousRect.pageOffset.left,j=this._rect.pageOffset.top-this._previousRect.pageOffset.top;this._setTarget(new u(this._currentValue.x-X,this._currentValue.y-j),!1);return}const v=this._view._parent,x=this._rect.pageOffset,A=this._view.getScroll(),I={left:this._previousRect.viewportOffset.left+A.x,top:this._previousRect.viewportOffset.top+A.y},H=I.left-x.left,Y=I.top-x.top;let Bt=0,Ft=0,Mt=0,kt=0;if(v){const X=v.rect.pageOffset,j=v.getScroll(),K={left:v.previousRect.viewportOffset.left+j.x,top:v.previousRect.viewportOffset.top+j.y};Bt=K.left-X.left,Ft=K.top-X.top;const $t=I.top-K.top,zt=I.left-K.left,qe=v.scale.y*$t;Mt=($t-qe)/v.scale.y;const Ue=v.scale.x*zt;kt=(zt-Ue)/v.scale.x}this._setTarget(new u(H-Bt+kt,Y-Ft+Mt),!1),i&&(this._animateLayoutUpdateNextFrame=!0);return}this._animateLayoutUpdateNextFrame=!0;const d=this._previousRect,c=this._rect,p=this._view._parent;let w=0,m=0;p&&(w=p.previousRect.viewportOffset.left-p.rect.viewportOffset.left),p&&(m=p.previousRect.viewportOffset.top-p.rect.viewportOffset.top);let y=1,f=1;p&&(y=p.previousRect.size.width/p.rect.size.width,f=p.previousRect.size.height/p.rect.size.height);const R=p?p.previousRect.viewportOffset.left:0,B=p?p.previousRect.viewportOffset.top:0,k=d.viewportOffset.left-R,$=d.viewportOffset.top-B,U=k/y-k,vt=$/f-$;let g=d.viewportOffset.left-c.viewportOffset.left-w+U,b=d.viewportOffset.top-c.viewportOffset.top-m+vt;g=Number.isFinite(g)?g:0,b=Number.isFinite(b)?b:0,this._setTarget(new u(g,b),!1)}else this._animateLayoutUpdateNextFrame&&(this._setTarget(this._initialValue,!0),this._animateLayoutUpdateNextFrame=!1)}get shouldRender(){if(!this._hasChanged)return!1;if(!this._previousRenderValue)return!0;const t=this.renderValue;return!(_(t.x,this._previousRenderValue.x)&&_(t.y,this._previousRenderValue.y))}get renderValue(){let t=0,e=0;return(this._view.isInverseEffectEnabled||this._view.isLayoutTransitionEnabled)&&(t=(this._rect.size.width*this._parentScaleInverse.x*this._view.scale.x-this._rect.size.width)*this._view.origin.x,e=(this._rect.size.height*this._parentScaleInverse.y*this._view.scale.y-this._rect.size.height)*this._view.origin.y),new u(this._currentValue.x+t,this._currentValue.y+e)}projectStyles(){const t=this.renderValue,e=`translate3d(${t.x}px, ${t.y}px, 0px)`;return this._previousRenderValue=t,e}isTransform(){return!0}}class Re extends C{constructor(){super(...arguments),a(this,"_unit","deg")}get degrees(){let t=this._currentValue;return this._unit==="rad"&&(t=t*(180/Math.PI)),t}get radians(){let t=this._currentValue;return this._unit==="deg"&&(t=t*(Math.PI/180)),t}setDegrees(t,e=!0){this._unit="deg",this._setTarget(t,e)}setRadians(t,e=!0){this._unit="rad",this._setTarget(t,e)}reset(t=!0){this._setTarget(0,t)}update(t,e){this._targetValue!==this._currentValue&&(this._currentValue=this._animator.update({animatorProp:this._animatorProp,current:this._currentValue,target:this._targetValue,initial:this._previousValue,ts:t,dt:e}))}get shouldRender(){if(!this._hasChanged)return!1;if(typeof this._previousRenderValue>"u")return!0;const t=this.renderValue;return!_(t,this._previousRenderValue)}get renderValue(){return this._currentValue}projectStyles(){const t=this.renderValue,e=`rotate(${t}${this._unit})`;return this._previousRenderValue=t,e}isTransform(){return!0}}class xe extends C{constructor(){super(...arguments),a(this,"_animateLayoutUpdateNextFrame",!1)}get x(){return this._currentValue.x}get y(){return this._currentValue.y}set(t,e=!0){const i={x:this._currentValue.x,y:this._currentValue.y,...typeof t=="number"?{x:t,y:t}:t};this._setTarget(new u(i.x,i.y),e)}setWithSize(t,e=!0){let i=this._currentValue.x,r=this._currentValue.y;t.width&&(i=t.width/this._rect.size.width),t.height&&(r=t.height/this._rect.size.height),!t.width&&t.height&&(i=r),!t.height&&t.width&&(r=i);const s={x:i,y:r};this._setTarget(new u(s.x,s.y),e)}reset(t=!0){this._setTarget(new u(1,1),t)}update(t,e){if(this._view.layoutOption!=="position"){if((this._view.isInverseEffectEnabled||this._view.isLayoutTransitionEnabled)&&!this._view.isTemporaryView&&this._runLayoutTransition(),this._view.isInverseEffectEnabled){const i=this._view._parent,r=i?i.scale.x:1,s=i?i.scale.y:1;this._hasChanged=r!==1||s!==1}this._targetValue.x===this._currentValue.x&&this._targetValue.y===this._currentValue.y||(this._currentValue=this._animator.update({animatorProp:this._animatorProp,current:this._currentValue,target:this._targetValue,initial:new u(this._previousValue.x,this._previousValue.y),ts:t,dt:e}))}}_runLayoutTransition(){const t=!(this._targetValue.x===this._currentValue.x&&this._targetValue.y===this._currentValue.y),e=this._previousRect.size.width/this._rect.size.width,i=this._previousRect.size.height/this._rect.size.height;let r=!1;if((!Number.isNaN(e)&&e!==1||!Number.isNaN(i)&&i!==1)&&(r=!0),r){if(this._currentValue.x!==1||this._currentValue.y!==1){const d=this._view.previousRect.size.width/this._view.rect.size.width,c=this._view.previousRect.size.height/this._view.rect.size.height;this._setTarget(new u(this._currentValue.x*d,this._currentValue.y*c),!1),t&&(this._animateLayoutUpdateNextFrame=!0);return}const s=this._previousRect.size.width/this._rect.size.width,o=this._previousRect.size.height/this._rect.size.height,l=s,h=o;this._view.viewProps.borderRadius.applyScaleInverse(),this._setTarget(new u(l,h),!1),this._animateLayoutUpdateNextFrame=!0}else this._animateLayoutUpdateNextFrame&&(this._setTarget(this._initialValue,!0),this._animateLayoutUpdateNextFrame=!1)}get shouldRender(){if(!this._hasChanged)return!1;if(!this._previousRenderValue)return!0;const t=this.renderValue;return!(_(t.x,this._previousRenderValue.x)&&_(t.y,this._previousRenderValue.y))}get renderValue(){const t=this._view._parent?this._view._parent.scale.x:1,e=this._view._parent?this._view._parent.scale.y:1,i=this._currentValue.x/t,r=this._currentValue.y/e;return new u(i,r)}projectStyles(){const t=this.renderValue,e=`scale3d(${t.x}, ${t.y}, 1)`;return this._previousRenderValue=t,e}isTransform(){return!0}}class Te extends C{get width(){return this._view.rect.size.width}get height(){return this._view.rect.size.height}get localWidth(){return this._currentValue.x}get localHeight(){return this._currentValue.y}get widthAfterScale(){const t=this._view.scale.x;return this.localWidth*t}get heightAfterScale(){const t=this._view.scale.y;return this.localHeight*t}get initialWidth(){return this._initialValue.x}get initialHeight(){return this._initialValue.y}set(t,e=!0){const i={width:this._currentValue.x,height:this._currentValue.y,...t};this._setTarget(new u(i.width,i.height),e)}setWidth(t,e=!0){const i={width:this._currentValue.x,height:this._currentValue.y,width:t};this._setTarget(new u(i.width,i.height),e)}setHeight(t,e=!0){const i={width:this._currentValue.x,height:this._currentValue.y,height:t};this._setTarget(new u(i.width,i.height),e)}reset(t=!0){this._setTarget(new u(this.initialWidth,this.initialHeight),t)}update(t,e){this._targetValue.x===this._currentValue.x&&this._targetValue.y===this._currentValue.y||(this._currentValue=this._animator.update({animatorProp:this._animatorProp,current:this._currentValue,target:this._targetValue,initial:this._previousValue,ts:t,dt:e}))}get shouldRender(){if(!this._hasChanged)return!1;if(!this._previousRenderValue)return!0;const t=this.renderValue;return!(_(t.x,this._previousRenderValue.x)&&_(t.y,this._previousRenderValue.y))}get renderValue(){return new u(this._currentValue.x,this._currentValue.y)}projectStyles(){const t=this.renderValue,e=`width: ${t.x}px; height: ${t.y}px;`;return this._previousRenderValue=t,e}isTransform(){return!1}}class Ae{constructor(t){a(this,"_props",new Map),this._props.set("position",new Ee(new q,new u(0,0),t)),this._props.set("scale",new xe(new q,new u(1,1),t)),this._props.set("rotation",new Re(new At,0,t)),this._props.set("size",new Te(new q,new u(t.rect.size.width,t.rect.size.height),t)),this._props.set("opacity",new Pe(new At,t.elementReader.opacity.value,t)),this._props.set("borderRadius",new Ve(new we,[t.elementReader.borderRadius.value.topLeft,t.elementReader.borderRadius.value.topRight,t.elementReader.borderRadius.value.bottomRight,t.elementReader.borderRadius.value.bottomLeft],t)),this._props.set("origin",new be(new q,t.elementReader.origin.value,t))}allProps(){return Array.from(this._props.values())}allPropNames(){return Array.from(this._props.keys())}getPropByName(t){return this._props.get(t)}get position(){return this._props.get("position")}get scale(){return this._props.get("scale")}get rotation(){return this._props.get("rotation")}get size(){return this._props.get("size")}get opacity(){return this._props.get("opacity")}get borderRadius(){return this._props.get("borderRadius")}get origin(){return this._props.get("origin")}}class Ie{constructor(t,e,i,r){a(this,"id"),a(this,"name"),a(this,"element"),a(this,"styles",{}),a(this,"_viewProps"),a(this,"_previousRect"),a(this,"_onAddCallbacks"),a(this,"_onRemoveCallback"),a(this,"_skipFirstRenderFrame"),a(this,"_layoutTransition"),a(this,"_registry"),a(this,"_layoutId"),a(this,"_elementReader"),a(this,"_viewParents"),a(this,"_temporaryView"),a(this,"_inverseEffect"),a(this,"_renderNextTick"),a(this,"_layoutOption"),a(this,"_elementObserver"),a(this,"_hasReadElement"),a(this,"_shouldReadRect"),a(this,"_readWithScroll"),a(this,"_externalUserStyles"),this._registry=i,this.id=Vt(),this.name=e,this.element=t,this.element.dataset.velViewId=this.id,this._elementReader=Tt(this),this._viewParents=this._getParents(),this._previousRect=this._elementReader.rect,this._viewProps=new Ae(this),this._skipFirstRenderFrame=!0,this._layoutId=r,this._layoutTransition=!1,this._temporaryView=!1,this.styles=rt(this.styles,()=>{this._renderNextTick=!0}),this._externalUserStyles=this._getExternalUserStyles(),this._renderNextTick=!1,this._layoutOption=this._getLayoutOption(),this._hasReadElement=!1,this._shouldReadRect=!1,this._readWithScroll=!1,this._elementObserver=Zt(t),this._elementObserver.onChange(s=>{if(this._hasReadElement){this._shouldReadRect=!1;return}this._externalUserStyles=this._getExternalUserStyles(),this._shouldReadRect=!0,this._readWithScroll=s})}destroy(){this._viewProps.allProps().forEach(t=>t.destroy()),this.element.removeAttribute("data-vel-view-id"),this.element.removeAttribute("data-vel-plugin-id"),this._renderNextTick=!0}get elementReader(){return this._elementReader}get layoutOption(){return this._layoutOption}_getLayoutOption(){return this.element.closest("[data-vel-layout-position]")?"position":this.element.closest("[data-vel-layout-size]")?"size":"all"}setElement(t){this.element=t,this._elementReader=Tt(this),this.element.dataset.velViewId=this.id,this._elementObserver.setElement(t)}get layoutId(){return this._layoutId}get position(){return this._viewProps.position}get scale(){return this._viewProps.scale}get _children(){const t=this.element.querySelectorAll("*");return Array.from(t).map(e=>e.dataset.velViewId).filter(e=>e&&typeof e=="string").map(e=>this._registry.getViewById(e)).filter(e=>!!e)}get _parent(){return this._parents[0]}get _parents(){return this._viewParents}_getParents(){var t;const e=[];let i=this.element.parentElement;if(!i)return e;for(i=i.closest("[data-vel-view-id]");i;){const r=i.dataset.velViewId;if(r){const s=this._registry.getViewById(r);s&&e.push(s)}i=(t=i.parentElement)==null?void 0:t.closest("[data-vel-view-id]")}return e}get rotation(){return this._viewProps.rotation}get size(){return this._viewProps.size}get _localWidth(){return this._viewProps.size.localWidth}get _localHeight(){return this._viewProps.size.localHeight}get opacity(){return this._viewProps.opacity}get borderRadius(){return this._viewProps.borderRadius}get origin(){return this._viewProps.origin}get data(){const t=this.element.dataset;return Object.keys(t).filter(e=>e.includes("velData")).map(e=>e.replace("velData","")).map(e=>`${e[0].toLowerCase()}${e.slice(1)}`).reduce((e,i)=>{const r=t[`velData${i[0].toUpperCase()}${i.slice(1)}`];return!e[i]&&r&&(e[i]=r),e},{})}get onAddCallbacks(){return this._onAddCallbacks}get onRemoveCallback(){return this._onRemoveCallback}get isLayoutTransitionEnabled(){return this._layoutTransition}get hasLayoutTransitionEnabledForParents(){return this._parents.some(t=>t.isLayoutTransitionEnabled)}get isInverseEffectEnabled(){let t=!1;for(let e=0;e<this._parents.length;e++){const i=this._parents[e];if(typeof i._inverseEffect<"u"){t=i._inverseEffect;break}}return t}layoutTransition(t){this._layoutTransition=t,this.inverseEffect(t)}inverseEffect(t){this._inverseEffect=t,t&&this._children.forEach(e=>{if(e.position.animator.name==="instant"){const i=this.viewProps.position.getAnimator();e.position.setAnimator(i.name,i.config)}if(e.scale.animator.name==="instant"){const i=this.viewProps.scale.getAnimator();e.scale.setAnimator(i.name,i.config)}})}setAnimatorsFromParent(){let t=this._parent;for(;t&&!t._inverseEffect;)t=t._parent;if(t){if(this.position.animator.name==="instant"){const e=t.viewProps.position.getAnimator();this.position.setAnimator(e.name,e.config)}if(this.scale.animator.name==="instant"){const e=t.viewProps.scale.getAnimator();this.scale.setAnimator(e.name,e.config)}}}get _isRemoved(){return!this._registry.getViewById(this.id)}setPluginId(t){this.element.dataset.velPluginId=t}hasElement(t){return this.element.contains(t)}getScroll(){return this._elementReader.scroll}intersects(t,e){const i=this.element.getBoundingClientRect(),r={x:i.left,y:i.top};return t>=r.x&&t<=r.x+i.width&&e>=r.y&&e<=r.y+i.height}overlapsWith(t){const e=t._localWidth*t.scale.x,i=t._localHeight*t.scale.y,r=this._localWidth*this.scale.x,s=this._localHeight*this.scale.y;return this.position.x<t.position.x+e&&this.position.x+r>t.position.x&&this.position.y<t.position.y+i&&this.position.y+s>t.position.y}distanceTo(t){const e=new u(this.position.x,this.position.y),i=new u(t.position.x,t.position.y);return u.sub(i,e).magnitude}read(){this._shouldReadRect&&(this._elementReader.update(this._readWithScroll),this._children.forEach(t=>{t.setHasReadElement(!0),t.elementReader.update(this._readWithScroll)}),this._shouldReadRect=!1,this._readWithScroll=!1),this.setHasReadElement(!1)}setHasReadElement(t){this._hasReadElement=t}get rect(){return this._elementReader.rect}get previousRect(){return this._previousRect}update(t,e){this._viewProps.allProps().forEach(i=>i.update(t,e))}_updatePreviousRect(){this._previousRect=this._elementReader.rect}setAsTemporaryView(){this._temporaryView=!0}get isTemporaryView(){return this._temporaryView}get shouldRender(){return this._renderNextTick||this._viewProps.allProps().some(t=>t.shouldRender)}_cleanCssText(t){const e=new Map,i=/([-\w]+)\s*:\s*([^;]+)\s*;?/g;let r;for(;(r=i.exec(t))!==null;){const[s,o,l]=r;if(!l.trim())continue;const h=o.replace(/^-\w+-/,"");(!e.has(h)||!o.startsWith("-"))&&e.set(h,`${h}: ${l.trim()}`)}return Array.from(e.values()).join("; ")}render(){if(!this.shouldRender)return;if(this._isRemoved&&this._skipFirstRenderFrame){this._skipFirstRenderFrame=!1;return}let t="";const e=this._viewProps.allProps(),i=e.filter(s=>s.isTransform()),r=e.filter(s=>!s.isTransform());if(i.some(s=>s.hasChanged())){const s=i.reduce((o,l,h)=>(o+=l.projectStyles(),h<i.length-1&&(o+=" "),h===i.length-1&&(o+=";"),o),"transform: ");t+=s}r.forEach(s=>{s.hasChanged()&&(t+=s.projectStyles())}),t+=this._getUserStyles(),this._cleanCssText(this.element.style.cssText)!==this._cleanCssText(t)&&(this.element.style.cssText=t),this._renderNextTick=!1}_getExternalUserStyles(){const t=this.element.style.cssText,e=this.styles;if(t.length===0)return"";const i=["transform","transform-origin","opacity","width","height","border-radius"],r={};for(const s in e)e.hasOwnProperty(s)&&(r[wt(s)]=e[s]);return t.split(";").map(s=>s.trim()).filter(Boolean).filter(s=>{const o=s.indexOf(":");if(o===-1)return!1;const l=s.slice(0,o).trim();return!r.hasOwnProperty(l)&&!i.includes(l)}).join("; ")}_getUserStyles(){return Object.keys(this.styles).reduce((t,e)=>{if(!e)return t;const i=wt(e).replace("webkit","-webkit").replace("moz","-moz");return t+`${i}: ${this.styles[e]}; `},this._externalUserStyles)}markAsAdded(){delete this.element.dataset.velProcessing}onAdd(t){this._onAddCallbacks=t}onRemove(t){this._onRemoveCallback=t}get viewProps(){return this._viewProps}getPropByName(t){return this._viewProps.getPropByName(t)}_copyAnimatorsToAnotherView(t){t.viewProps.allPropNames().forEach(e=>{var i,r;const s=(i=this.viewProps.getPropByName(e))==null?void 0:i.getAnimator();s&&((r=t.viewProps.getPropByName(e))==null||r.setAnimator(s.name,s.config))})}getChildren(t){const e=this.element.querySelectorAll("*"),i=Array.from(e).filter(r=>{const s=r;return typeof s.dataset.velViewId<"u"&&s.dataset.velView===t}).map(r=>r.dataset.velViewId);return this._registry.getViewsById(i)}getChild(t){return this.getChildren(t)[0]}getParent(t){const e=this.element.closest(`[data-vel-view="${t}"]`);if(!e)return;const i=e.dataset.velViewId;if(i)return this._registry.getViewById(i)}}class Ce{constructor(t,e){a(this,"_appEventBus"),a(this,"_eventBus"),a(this,"_plugins",[]),a(this,"_views",[]),a(this,"_viewsPerPlugin",new Map),a(this,"_viewsToBeCreated",[]),a(this,"_viewsToBeRemoved",[]),a(this,"_viewsCreatedInPreviousFrame",[]),a(this,"_layoutIdToViewMap",new Map),a(this,"_eventPluginsPerPlugin",new Map),a(this,"_pluginNameToPluginFactoryMap",new Map),a(this,"_pluginNameToPluginConfigMap",new Map),this._appEventBus=t,this._eventBus=e}update(){this._handleRemovedViews(),this._handleAddedViews()}associateEventPluginWithPlugin(t,e){let i=this._eventPluginsPerPlugin.get(t);i||(i=[],this._eventPluginsPerPlugin.set(t,i)),i.push(e)}_handleRemovedViews(){const t=this._viewsToBeRemoved.filter(e=>e.dataset.velViewId);t.length&&(t.forEach(e=>{const i=e.dataset.velViewId;i&&this._handleRemoveView(i)}),this._viewsToBeRemoved=[])}_getPluginNameForElement(t){const e=t.dataset.velPlugin;if(e&&e.length>0)return e;const i=t.closest("[data-vel-plugin]");if(i)return i.dataset.velPlugin}_getPluginIdForElement(t){const e=this._getPluginNameForElement(t);if(!e)return;const i=t.closest("[data-vel-plugin-id]");if(i)return i.dataset.velPluginId;const r=this.getPluginByName(e);if(r)return r.id}_isScopedElement(t){const e=this._getPluginNameForElement(t);if(!e)return!1;const i=this._pluginNameToPluginFactoryMap.get(e),r=i==null?void 0:i.scope;return t.dataset.velView===r}_removeElementsWithParent(t){const e=new Set(t);return t.filter(i=>{let r=i.parentElement;for(;r;){if(e.has(r))return!1;r=r.parentElement}return!0})}_handleAddedViews(){this._viewsCreatedInPreviousFrame.forEach(s=>{s.markAsAdded()}),this._viewsCreatedInPreviousFrame=[];const t=this._removeElementsWithParent(this._viewsToBeCreated),e=t.filter(s=>this._isScopedElement(s)&&!this._isElementIgnored(s)),i=t.filter(s=>!this._isScopedElement(s)&&!this._isElementIgnored(s));this._viewsToBeCreated=[],e.forEach(s=>{const o=this._getPluginNameForElement(s),l=this._pluginNameToPluginFactoryMap.get(o),h=this._pluginNameToPluginConfigMap.get(o),d=s.dataset.velPluginKey,c=it(l,this,this._eventBus,this._appEventBus,h,d);this._plugins.push(c);const p=s.dataset.velView,w=this._createNewView(s,p,c);w.isInverseEffectEnabled&&w.setAnimatorsFromParent(),c.notifyAboutViewAdded(w)});const r=i.filter(s=>!!this._getPluginIdForElement(s));r.length!==0&&r.forEach(s=>{const o=this._getPluginIdForElement(s),l=s.dataset.velView;if(!l||!o)return;const h=this._getPluginById(o);if(!h)return;const d=this._getLayoutIdForElement(s,h);let c;d&&this._layoutIdToViewMap.has(d)?(c=this._layoutIdToViewMap.get(d),c.setElement(s),c.setPluginId(h.id),this._createChildrenForView(c,h)):c=this._createNewView(s,l,h),c.isInverseEffectEnabled&&c.setAnimatorsFromParent(),h.notifyAboutViewAdded(c)})}_getLayoutIdForElement(t,e){const i=t.dataset.velLayoutId;if(i)return`${i}-${e.id}`}_createNewView(t,e,i){const r=this._getLayoutIdForElement(t,i),s=this.createView(t,e,r);return i.addView(s),s.layoutId&&this._layoutIdToViewMap.set(s.layoutId,s),this._createChildrenForView(s,i),this._appEventBus.emitPluginReadyEvent(i.pluginName,i.api,!0),requestAnimationFrame(()=>{requestAnimationFrame(()=>{this._appEventBus.emitPluginReadyEvent(i.pluginName,i.api)})}),s}_createChildrenForView(t,e){const i=t.element.querySelectorAll("*");if(i.length){if(Array.from(i).some(r=>this._getPluginNameForElement(r)!==e.pluginName)){console.log(`%c WARNING: The plugin "${e.pluginName}" has view(s) created for a different plugin. Make sure all views inside that plugin don't have data-vel-plugin set or the pluginName is set to "${e.pluginName}"`,"background: #885500");return}Array.from(i).filter(r=>!this._isElementIgnored(r)).forEach(r=>{const s=r,o=s.dataset.velView?s.dataset.velView:`${t.name}-child`,l=this._getLayoutIdForElement(s,e),h=this.createView(s,o,l);l&&!this._layoutIdToViewMap.has(l)&&this._layoutIdToViewMap.set(l,h),e.addView(h),e.notifyAboutViewAdded(h)})}}_handleRemoveView(t){this._plugins.forEach(e=>{if(!this._viewsPerPlugin.get(e.id))return;const i=this._getPluginViewById(e,t);i&&e.removeView(i)})}removeViewById(t,e){this._unassignViewFromPlugin(t,e),this._views=this._views.filter(i=>i.id!==t)}_unassignViewFromPlugin(t,e){const i=this._viewsPerPlugin.get(e);if(!i)return;const r=i.indexOf(t);r!==-1&&i.splice(r,1)}getViewById(t){return this._views.find(e=>e.id===t)}getViewsById(t){return this._views.filter(e=>t.includes(e.id))}_getPluginById(t){return this._plugins.find(e=>e.id===t)}_getPluginViewById(t,e){return this.getViewsForPlugin(t).find(i=>i.id===e)}destroy(t,e){if(!t){this._destroyAll(e);return}let i=[];if(t&&t.length>0){const r=this.getPluginByName(t);if(r){const s=(this._eventPluginsPerPlugin.get(r.id)||[]).map(o=>this._getPluginById(o)).filter(o=>typeof o<"u");i.push(r),i.push(...s)}}else i=this._plugins;requestAnimationFrame(()=>{i.forEach(r=>{this._destroyPlugin(r)}),requestAnimationFrame(()=>{e==null||e()})})}_destroyPlugin(t){const e=this.getViewsForPlugin(t);e.forEach(i=>{i.layoutId&&this._layoutIdToViewMap.delete(i.layoutId),i.destroy()}),this._views=this._views.filter(i=>!e.find(r=>r.id===i.id)),this._viewsPerPlugin.delete(t.id),this._plugins=this._plugins.filter(i=>i.id!==t.id)}_destroyAll(t){this._views.forEach(e=>e.destroy()),requestAnimationFrame(()=>{this._plugins=[],this._views=[],this._viewsPerPlugin.clear(),this._viewsToBeCreated=[],this._viewsToBeRemoved=[],this._viewsCreatedInPreviousFrame=[],this._layoutIdToViewMap.clear(),this._eventPluginsPerPlugin.clear(),t==null||t()})}reset(t,e){let i=[];if(t&&t.length>0){const r=this.getPluginByName(t);if(r){const s=(this._eventPluginsPerPlugin.get(r.id)||[]).map(o=>this._getPluginById(o)).filter(o=>typeof o<"u");i.push(r),i.push(...s)}}else i=this._plugins;requestAnimationFrame(()=>{i.forEach(r=>{this._resetPlugin(r)}),requestAnimationFrame(()=>{e==null||e()})})}_resetPlugin(t){const e=t.config,i=t.pluginFactory,r=t.internalBusEvent,s=!t.isRenderable(),o=this.getViewsForPlugin(t);o.forEach(l=>{l.layoutId&&this._layoutIdToViewMap.delete(l.layoutId),l.destroy()}),this._views=this._views.filter(l=>!o.find(h=>h.id===l.id)),this._viewsPerPlugin.delete(t.id),this._plugins=this._plugins.filter(l=>l.id!==t.id),s||requestAnimationFrame(()=>{this.createPlugin(i,this._eventBus,e).setInternalEventBus(r)})}queueNodeToBeCreated(t){this._viewsToBeCreated.push(t)}queueNodeToBeRemoved(t){this._viewsToBeRemoved.push(t)}notifyPluginAboutDataChange(t){const e=this._plugins.filter(i=>i.id===t.pluginId);!e||!e.length||e.forEach(i=>{i.notifyAboutDataChanged({dataName:t.dataName,dataValue:t.dataValue,viewName:t.viewName})})}getPlugins(){return this._plugins}getRenderablePlugins(){function t(e){return e.isRenderable()}return this._plugins.filter(t)}getPluginByName(t,e){return this._plugins.find(i=>e?i.pluginKey===e&&i.pluginName===t:i.pluginName===t)}getPluginsByName(t,e){return this._plugins.filter(i=>e?i.pluginKey===e&&i.pluginName===t:i.pluginName===t)}hasPlugin(t){return t.pluginName?!!this.getPluginByName(t.pluginName):!1}createPlugin(t,e,i={},r=!1){if(!t.pluginName)throw Error(`Plugin ${t.name} must contain a pluginName field`);let s=[];if(t.scope){const h=r?`[data-vel-plugin=${t.pluginName}][data-vel-view=${t.scope}]:not([data-vel-plugin-id])`:`[data-vel-plugin=${t.pluginName}][data-vel-view=${t.scope}]`,d=document.querySelectorAll(h);this._pluginNameToPluginFactoryMap.has(t.pluginName)||this._pluginNameToPluginFactoryMap.set(t.pluginName,t),this._pluginNameToPluginConfigMap.has(t.pluginName)||this._pluginNameToPluginConfigMap.set(t.pluginName,i),d?s=Array.from(d):s=[document.documentElement]}else s=[document.documentElement];const o=s.map(h=>{const d=h.dataset.velPluginKey,c=it(t,this,e,this._appEventBus,i,d);this._plugins.push(c);let p=[];h!==document.documentElement&&p.push(h);const w=h.querySelectorAll(`[data-vel-plugin=${c.pluginName}]`);p=[...p,...w];const m=p.filter(y=>{if(this._isElementIgnored(y))return!1;if(!y.parentElement)return!0;const f=this._getPluginNameForElement(y.parentElement);return!(f&&f.length>0)});return m.length&&m.forEach(y=>{const f=y.dataset.velView;if(!f)return;const R=this._createNewView(y,f,c);c.notifyAboutViewAdded(R)}),c});if(o&&o.length>0)return o[0];const l=it(t,this,e,this._appEventBus,i);return t.scope||console.log(`%c WARNING: The plugin "${l.pluginName}" is created but there are no elements using it on the page`,"background: #885500"),l}updatePlugin(t,e,i={}){return this.createPlugin(t,e,i,!0)}getViews(){return this._views}createView(t,e,i){const r=new Ie(t,e,this,i);return this._views.push(r),this._viewsCreatedInPreviousFrame.push(r),r}_isElementIgnored(t){return t.closest("[data-vel-ignore]")}assignViewToPlugin(t,e){this._viewsPerPlugin.has(e.id)||this._viewsPerPlugin.set(e.id,[]);const i=this._viewsPerPlugin.get(e.id);i.includes(t.id)||i.push(t.id)}getViewsForPlugin(t){const e=this._viewsPerPlugin.get(t.id);return e?e.map(i=>this._views.find(r=>r.id===i)).filter(i=>!!i):[]}getViewsByNameForPlugin(t,e){return this.getViewsForPlugin(t).filter(i=>i.name===e)}}class It{constructor(t){a(this,"pluginApi"),this.pluginApi=t.pluginApi}}class Ct{constructor(t){a(this,"pluginApi"),this.pluginApi=t.pluginApi}}class gt{constructor(){a(this,"previousTime",0),a(this,"registry"),a(this,"eventBus"),a(this,"appEventBus"),this.eventBus=new tt,this.appEventBus=new tt,this.registry=new Ce(this.appEventBus,this.eventBus),new Ut(this.eventBus)}static create(){return new gt}addPlugin(t,e={}){this.registry.hasPlugin(t)||this.registry.createPlugin(t,this.eventBus,e)}updatePlugin(t,e={}){this.registry.hasPlugin(t)&&this.registry.updatePlugin(t,this.eventBus,e)}reset(t,e){this.registry.reset(t,e)}destroy(t,e){this.registry.destroy(t,e)}getPlugin(t,e){let i=typeof t=="string"?t:t.pluginName;const r=this.registry.getPluginByName(i,e);if(!r)throw new Error(`You can't call getPlugin for ${i} with key: ${e} because it does not exist in your app`);return r.api}getPlugins(t,e){let i=typeof t=="string"?t:t.pluginName;const r=this.registry.getPluginsByName(i,e);if(r.length===0)throw new Error(`You can't call getPlugins for ${i} with key: ${e} because they don't exist in your app`);return r.map(s=>s.api)}onPluginEvent(t,e,i,r){const s=this.registry.getPluginByName(t.pluginName,r);s&&s.on(e,i)}removePluginEventListener(t,e,i){const r=this.registry.getPluginByName(t.pluginName);r&&r.removeListener(e,i)}run(){document.readyState==="loading"?document.addEventListener("DOMContentLoaded",this.start.bind(this)):this.start()}start(){this.setup(),requestAnimationFrame(this.tick.bind(this))}setup(){this.listenToNativeEvents(),this.subscribeToEvents()}listenToNativeEvents(){document.addEventListener("click",t=>{this.eventBus.emitEvent(mt,{x:t.clientX,y:t.clientY,target:t.target})}),document.addEventListener("pointermove",t=>{this.eventBus.emitEvent(G,{x:t.clientX,y:t.clientY,target:t.target})}),document.addEventListener("pointerdown",t=>{this.eventBus.emitEvent(Z,{x:t.clientX,y:t.clientY,target:t.target})}),document.addEventListener("pointerup",t=>{this.eventBus.emitEvent(J,{x:t.clientX,y:t.clientY,target:t.target})})}tick(t){let e=(t-this.previousTime)/1e3;e>.016&&(e=1/60),this.previousTime=t,this.eventBus.reset(),this.subscribeToEvents(),this.read(),this.update(t,e),this.render(),requestAnimationFrame(this.tick.bind(this))}subscribeToEvents(){this.eventBus.subscribeToEvent(O,this.onNodeAdded.bind(this)),this.eventBus.subscribeToEvent(Q,this.onNodeRemoved.bind(this)),this.eventBus.subscribeToEvent(ft,this.onDataChanged.bind(this)),this.registry.getPlugins().forEach(t=>{t.subscribeToEvents(this.eventBus)})}onNodeAdded({node:t}){this.registry.queueNodeToBeCreated(t)}onNodeRemoved({node:t}){this.registry.queueNodeToBeRemoved(t)}onDataChanged(t){this.registry.notifyPluginAboutDataChange(t)}read(){this.registry.getViews().forEach(t=>{t.read()})}update(t,e){this.registry.update(),this.registry.getPlugins().slice().reverse().forEach(i=>{i.init()}),this.registry.getRenderablePlugins().forEach(i=>{i.update(t,e)}),this.registry.getViews().forEach(i=>{i.update(t,e)}),this.registry.getViews().forEach(i=>{i._updatePreviousRect()})}render(){this.registry.getRenderablePlugins().forEach(t=>{t.render()}),this.registry.getViews().forEach(t=>{t.render()})}}function Ne(){return gt.create()}class Nt{constructor(t){a(this,"view"),a(this,"previousX"),a(this,"previousY"),a(this,"x"),a(this,"y"),a(this,"pointerX"),a(this,"pointerY"),a(this,"isDragging"),a(this,"target"),a(this,"directions",[]),a(this,"width"),a(this,"height"),a(this,"distance"),a(this,"stopped"),this.props=t,this.previousX=t.previousX,this.previousY=t.previousY,this.x=t.x,this.y=t.y,this.pointerX=t.pointerX,this.pointerY=t.pointerY,this.width=t.width,this.height=t.height,this.distance=t.distance,this.view=t.view,this.isDragging=t.isDragging,this.stopped=t.stopped,this.target=t.target,this.directions=t.directions}}class Lt extends et{constructor(){super(...arguments),a(this,"_pointerX",0),a(this,"_pointerY",0),a(this,"_initialPointer",new u(0,0)),a(this,"_initialPointerPerView",new Map),a(this,"_pointerDownPerView",new Map),a(this,"_targetPerView",new Map),a(this,"_viewPointerPositionLog",new Map),a(this,"_stopTimer",0)}setup(){document.addEventListener("selectstart",this.onSelect.bind(this))}onSelect(t){this._isDragging&&t.preventDefault()}get _isDragging(){return Array.from(this._pointerDownPerView.values()).some(t=>!!t)}subscribeToEvents(t){t.subscribeToEvent(Z,({x:e,y:i,target:r})=>{this._initialPointer=new u(e,i),this.getViews().forEach(s=>{this._pointerDownPerView.set(s.id,s.intersects(e,i)),this._targetPerView.set(s.id,r);const o=new u(e-s.position.initialX,i-s.position.initialY);this._pointerX=e,this._pointerY=i,this._initialPointerPerView.set(s.id,o)})}),t.subscribeToEvent(J,()=>{this.getViews().forEach(e=>{this._pointerDownPerView.get(e.id)&&this._initialPointerPerView.get(e.id)&&(this._pointerDownPerView.set(e.id,!1),this._emitEvent(e,[]))})}),t.subscribeToEvent(G,({x:e,y:i})=>{this._pointerX=e,this._pointerY=i,this.getViews().forEach(r=>{if(this._pointerDownPerView.get(r.id)&&this._initialPointerPerView.get(r.id)){this._viewPointerPositionLog.has(r.id)||this._viewPointerPositionLog.set(r.id,[]);const s=new u(e,i),o=this._viewPointerPositionLog.get(r.id);o&&o.push(new u(e,i));const l=o&&o.length>=2?o[o.length-2]:s.clone(),h=this._calculateDirections(l,s);this._emitEvent(r,h),clearTimeout(this._stopTimer),this._stopTimer=setTimeout(()=>{this._emitEvent(r,h,!0)},120)}})})}_emitEvent(t,e,i=!1){const r=this._viewPointerPositionLog.get(t.id),s=r&&r.length>=2?r[r.length-2]:null,o=this._pointerX-this._initialPointerPerView.get(t.id).x,l=this._pointerY-this._initialPointerPerView.get(t.id).y,h=this._pointerX,d=this._pointerY,c=s?s.x-this._initialPointerPerView.get(t.id).x:o,p=s?s.y-this._initialPointerPerView.get(t.id).y:l,w=this._pointerY-this._initialPointer.y,m=this._pointerX-this._initialPointer.x,y=Jt(this._initialPointer,{x:this._pointerX,y:this._pointerY}),f=this._targetPerView.get(t.id);if(!f||!t.hasElement(f))return;const R=this._pointerDownPerView.get(t.id)===!0;R||this._viewPointerPositionLog.clear();const B={view:t,target:f,previousX:c,previousY:p,x:o,y:l,pointerX:h,pointerY:d,distance:y,width:m,height:w,isDragging:R,directions:e,stopped:i};this.emit(Nt,B)}_calculateDirections(t,e){const i={up:u.sub(new u(t.x,t.y-1),t),down:u.sub(new u(t.x,t.y+1),t),left:u.sub(new u(t.x-1,t.y),t),right:u.sub(new u(t.x+1,t.y),t)},r=u.sub(e,t).unitVector;return[{direction:"up",projection:r.dot(i.up)},{direction:"down",projection:r.dot(i.down)},{direction:"left",projection:r.dot(i.left)},{direction:"right",projection:r.dot(i.right)}].filter(s=>s.projection>0).map(s=>s.direction)}}a(Lt,"pluginName","DragEventPlugin");class Le{constructor(t){a(this,"view"),a(this,"direction"),this.props=t,this.view=t.view,this.direction=t.direction}}class Se extends et{constructor(){super(...arguments),a(this,"_viewIsPointerDownMap",new Map),a(this,"_viewPointerPositionLog",new Map),a(this,"_targetPerView",new Map)}subscribeToEvents(t){t.subscribeToEvent(Z,({x:e,y:i,target:r})=>{this.getViews().forEach(s=>{this._targetPerView.set(s.id,r),s.intersects(e,i)&&this._viewIsPointerDownMap.set(s.id,!0)})}),t.subscribeToEvent(G,({x:e,y:i})=>{this.getViews().forEach(r=>{this._viewIsPointerDownMap.get(r.id)&&(this._viewPointerPositionLog.has(r.id)||this._viewPointerPositionLog.set(r.id,[]),this._viewPointerPositionLog.get(r.id).push(new u(e,i)))})}),t.subscribeToEvent(J,({x:e,y:i})=>{this.getViews().forEach(s=>{if(!this._viewIsPointerDownMap.get(s.id)||!this._viewPointerPositionLog.has(s.id))return;const o=new u(e,i),l=this._viewPointerPositionLog.get(s.id),h=l[l.length-2]||o.clone(),d=this._targetPerView.get(s.id),c=r(h,o);d&&s.hasElement(d)&&c.hasSwiped&&this.emit(Le,{view:s,direction:c.direction}),this._viewPointerPositionLog.set(s.id,[]),this._viewIsPointerDownMap.set(s.id,!1)});function r(s,o){const l={up:u.sub(new u(s.x,s.y-1),s),down:u.sub(new u(s.x,s.y+1),s),left:u.sub(new u(s.x-1,s.y),s),right:u.sub(new u(s.x+1,s.y),s)},h=u.sub(o,s).unitVector,d=["up","down","left","right"],c=[h.dot(l.up),h.dot(l.down),h.dot(l.left),h.dot(l.right)],p=Math.max(...c),w=c.indexOf(p),m=d[w],y=u.sub(o,s).magnitude;return{hasSwiped:h.dot(l[m])*y>30,direction:m}}})}}a(Se,"pluginName","SwipeEventPlugin");class Be{constructor(t){a(this,"view"),this.props=t,this.view=t.view}}class Fe extends et{subscribeToEvents(t){t.subscribeToEvent(mt,({x:e,y:i,target:r})=>{this.getViews().forEach(s=>{const o=r,l=s.element===o||s.element.contains(o);s.intersects(e,i)&&l&&this.emit(Be,{view:s})})})}}a(Fe,"pluginName","ClickEventPlugin");class pt{constructor(t){T(this,"data");this.data=t.data}}class St{constructor(t){T(this,"data");this.data=t.data}}function _t(n){return{map:new Map(n),array:Array.from(n).map(([e,i])=>({slot:e,item:i})),object:Array.from(n).reduce((e,[i,r])=>(e[i]=r,e),{})}}const S=n=>{const t=n.useEventPlugin(Lt);t.on(Nt,vt);let e,i,r,s,o=new Map,l=new Map,h,d,c,p,w=!0,m,y,f;n.api({setEnabled(g){w=g}});function R(){return{animation:e.data.configAnimation,continuousMode:typeof e.data.configContinuousMode<"u"}}function B(){const g=R().animation;return g==="dynamic"?{animator:"dynamic",config:{}}:g==="spring"?{animator:"spring",config:{damping:.7,stiffness:.62}}:g==="none"?{animator:"instant",config:{}}:{animator:"instant",config:{}}}n.setup(()=>{e=n.getView("root"),i=n.getViews("slot"),r=n.getViews("item"),y=R().continuousMode,r.forEach(g=>{k(g)}),$(),l=new Map(o),n.emit(St,{data:_t(o)})});function k(g){const b=B();g.styles.position="relative",g.styles.touchAction="none",g.styles.userSelect="none",g.styles.webkitUserSelect="none",g.position.setAnimator(b.animator,b.config),g.scale.setAnimator(b.animator,b.config),g.layoutTransition(!0);const v=g.getChild("handle");v?t.addView(v):t.addView(g);const x=g.getParent("slot").element;o.set(x.dataset.swapySlot,g.element.dataset.swapyItem)}n.onViewAdded(g=>{n.initialized&&g.name==="item"&&(k(g),$(),r=n.getViews("item"),l=new Map(o),n.emit(pt,{data:_t(o)})),g.name==="slot"&&(i=n.getViews("slot"))});function $(){const g=B();n.getViews("root-child").forEach(v=>{v.position.setAnimator(g.animator,g.config),v.scale.setAnimator(g.animator,g.config),v.layoutTransition(!0)})}function U(){if(!m)return;if(!h||!d){const A=s.getScroll();h=m.pointerX-s.position.x+A.x,d=m.pointerY-s.position.y+A.y}(!c||!p)&&(c=s.size.width,p=s.size.height);const g=s.size.width/c,b=s.size.height/p,v=h*(g-1),x=d*(b-1);s.position.set({x:m.x-v,y:m.y-x},s.scale.x!==1||s.scale.y!==1)}function vt(g){if(!w)return;s=g.view.name==="handle"?g.view.getParent("item"):g.view,f||(f=s.getParent("slot")),g.isDragging?(m=g,U(),i.forEach(v=>{var Y;if(!v.intersects(g.pointerX,g.pointerY)){v!==f&&v.element.removeAttribute("data-swapy-highlighted");return}if(typeof v.element.dataset.swapyHighlighted>"u"&&(v.element.dataset.swapyHighlighted=""),!g.stopped&&!y)return;const x=v.element.dataset.swapySlot,A=(Y=v.getChild("item"))==null?void 0:Y.element.dataset.swapyItem,I=f.element.dataset.swapySlot,H=s.element.dataset.swapyItem;!x||!I||!H||(o.set(x,H),A?o.set(I,A):o.set(I,null),V(o,l)||(l=new Map(o),f=null,n.emit(pt,{data:_t(o)})))}),r.forEach(v=>{v.styles.zIndex=v===s?"2":""})):(i.forEach(v=>{v.element.removeAttribute("data-swapy-highlighted")}),s.position.reset(),f=null,h=null,d=null,c=null,p=null,m=null),requestAnimationFrame(()=>{U()})}};S.pluginName="Swapy",S.scope="root";let N;function Me(){return N?(N.updatePlugin(S),N):(N=Ne(),N.addPlugin(S),N.run(),N)}const ke={animation:"dynamic",continuousMode:!0};function $e(n){let t=!0;const e=n.querySelectorAll("[data-swapy-slot]");return e.length===0&&(console.error("There are no slots defined in your root element:",n),t=!1),e.forEach(i=>{const r=i,s=r.dataset.swapySlot;(!s||s.length===0)&&(console.error(i,"does not contain a slotId using data-swapy-slot"),t=!1);const o=r.children;o.length>1&&(console.error("slot:",`"${s}"`,"cannot contain more than one element"),t=!1);const l=o[0];l&&(!l.dataset.swapyItem||l.dataset.swapyItem.length===0)&&(console.error("slot:",`"${s}"`,"does not contain an element with item id using data-swapy-item"),t=!1)}),t}function ze(n,t={}){const e=Ot();return n.dataset.velPluginKey=e,n.dataset.velPlugin="Swapy",n.dataset.velView="root",n.dataset.velDataConfigAnimation=t.animation,t.continuousMode&&(n.dataset.velDataConfigContinuousMode="true"),Array.from(n.querySelectorAll("[data-swapy-slot]")).forEach(l=>{l.dataset.velView="slot"}),Array.from(n.querySelectorAll("[data-swapy-item]")).forEach(l=>{l.dataset.velView="item",l.dataset.velLayoutId=l.dataset.swapyItem;const h=l.querySelector("[data-swapy-handle]");h&&(h.dataset.velView="handle")}),Array.from(n.querySelectorAll("[data-swapy-text]")).forEach(l=>{l.dataset.velLayoutPosition=""}),Array.from(n.querySelectorAll("[data-swapy-exclude]")).forEach(l=>{l.dataset.velIgnore=""}),e}function Oe(n){const t=Array.from(n.querySelectorAll("[data-swapy-slot]:not([data-vel-view])"));t.forEach(i=>{i.dataset.velView="slot"});const e=Array.from(n.querySelectorAll("[data-swapy-item]:not([data-vel-view]"));return e.forEach(i=>{i.dataset.velView="item",i.dataset.velLayoutId=i.dataset.swapyItem;const r=i.querySelector("[data-swapy-handle]");r&&(r.dataset.velView="handle"),Array.from(i.querySelectorAll("[data-swapy-text]")).forEach(l=>{l.dataset.velLayoutPosition=""}),Array.from(i.querySelectorAll("[data-swapy-exclude]")).forEach(l=>{l.dataset.velIgnore=""})}),e.length>0||t.length>0}function We(n,t={}){if(!n)throw new Error("Cannot create a Swapy instance because the element you provided does not exist on the page!");const e={...ke,...t},i=n;if(!$e(i))throw new Error("Cannot create a Swapy instance because your HTML structure is invalid. Fix all above errors and then try!");const r=ze(i,e),s=new De(i,r);return{onSwap(o){s.setSwapCallback(o)},enable(o){s.setEnabled(o)}}}class De{constructor(t,e){T(this,"_rootEl");T(this,"_veloxiApp");T(this,"_slotElMap");T(this,"_itemElMap");T(this,"_swapCallback");T(this,"_previousMap");this._rootEl=t,this._veloxiApp=Me(),this._slotElMap=this._createSlotElMap(),this._itemElMap=this._createItemElMap(),this._veloxiApp.onPluginEvent(S,St,({data:i})=>{this._previousMap=i.map},e),this._veloxiApp.onPluginEvent(S,pt,i=>{var r;this._previousMap&&V(this._previousMap,i.data.map)||(this._applyOrder(i.data.map),(r=this._swapCallback)==null||r.call(this,i),this._previousMap=i.data.map)},e),this.setupMutationObserver()}setupMutationObserver(){new MutationObserver(e=>{e.some(i=>i.type==="childList")&&Oe(this._rootEl)&&(this._slotElMap=this._createSlotElMap(),this._itemElMap=this._createItemElMap())}).observe(this._rootEl,{childList:!0,subtree:!0})}setEnabled(t){this._veloxiApp.getPlugin("Swapy").setEnabled(t)}setSwapCallback(t){this._swapCallback=t}_applyOrder(t){Array.from(t.keys()).forEach(e=>{var o;if(t.get(e)===((o=this._previousMap)==null?void 0:o.get(e)))return;const i=t.get(e);if(!i)return;const r=this._slotElMap.get(e),s=this._itemElMap.get(i);!r||!s||(r.innerHTML="",r.appendChild(s))})}_createSlotElMap(){return Array.from(this._rootEl.querySelectorAll("[data-swapy-slot]")).reduce((t,e)=>(t.set(e.dataset.swapySlot,e),t),new Map)}_createItemElMap(){return Array.from(this._rootEl.querySelectorAll("[data-swapy-item]")).reduce((t,e)=>(t.set(e.dataset.swapyItem,e),t),new Map)}}E.createSwapy=We,Object.defineProperty(E,Symbol.toStringTag,{value:"Module"})});
+    `,o.style.pointerEvents="none",o.dataset.velRemoved="",document.body.appendChild(o);const l=this._registry.createView(o,t.name);return l.setAsTemporaryView(),l.styles.position="absolute",l.styles.left=`${e.left+s}px`,l.styles.top=`${e.top-n}px`,l.rotation.setDegrees(t.rotation.degrees,!1),l.scale.set({x:t.scale.x,y:t.scale.y},!1),l.size.set({width:t._localWidth,height:t._localHeight},!1),t._copyAnimatorsToAnotherView(l),t.onRemoveCallback&&l.onRemove(t.onRemoveCallback),l}onViewRemoved(t){}notifyAboutViewAdded(t){this.onViewAdded(t),this._invokeAddCallbacks(t)}_invokeAddCallbacks(t){var e,i,s;!((e=t.onAddCallbacks)!=null&&e.onInitialLoad)&&!this._initialized||((i=t.onAddCallbacks)==null||i.beforeEnter(t),!((s=t.onAddCallbacks)!=null&&s.afterRemoved)||!this._initialized?requestAnimationFrame(()=>{var n;(n=t.onAddCallbacks)==null||n.afterEnter(t)}):t.layoutId&&this._layoutIdViewMapWaitingToEnter.set(t.layoutId,t))}onViewAdded(t){}init(){!this._initialized&&this._isReady&&(this.setup(),this._initialized=!0)}setup(){}subscribeToEvents(t){}}class Yt extends Rt{isRenderable(){return!0}isInitialized(){return this._initialized}get initialized(){return this._initialized}update(t,e){}render(){}addView(t){t.setPluginId(this.id),super.addView(t)}}class nt extends Rt{isRenderable(){return!1}}class Xt{constructor(t){a(this,"_plugin"),this._plugin=t}get initialized(){return this._plugin.isInitialized()}get config(){return this._plugin.config}setup(t){this._plugin.setup=t}api(t){this._plugin._setApi(t)}update(t){this._plugin.update=t}render(t){this._plugin.render=t}getViews(t){return this._plugin.getViews(t)}getView(t){return this._plugin.getView(t)}getViewById(t){return this._plugin.getViewById(t)}useEventPlugin(t,e={}){return this._plugin.useEventPlugin(t,e)}emit(t,e){this._plugin.emit(t,e)}on(t,e){this._plugin.on(t,e)}onDataChanged(t){this._plugin.onDataChanged=t}onViewRemoved(t){this._plugin.onViewRemoved=t}onViewAdded(t){this._plugin.onViewAdded=t}subscribeToEvents(t){this._plugin.subscribeToEvents=t}}function rt(r,t,e,i,s,n){if(Kt(r))return new r(r,r.pluginName,t,e,i,s,n);const o=new Yt(r,r.pluginName,t,e,i,s,n),l=new Xt(o);return r(l),o}function Kt(r){var t;return((t=r.prototype)==null?void 0:t.constructor.toString().indexOf("class "))===0}class u{constructor(t,e){a(this,"x"),a(this,"y"),this.x=t,this.y=e}get magnitudeSquared(){return this.x*this.x+this.y*this.y}get magnitude(){return Math.sqrt(this.x*this.x+this.y*this.y)}get unitVector(){const t=new u(0,0),e=this.magnitude;return e!==0&&(t.x=this.x/e,t.y=this.y/e),t}add(t){this.x+=t.x,this.y+=t.y}sub(t){this.x-=t.x,this.y-=t.y}scale(t){this.x*=t,this.y*=t}dot(t){return this.x*t.x+this.y*t.y}equals(t){return this.x===t.x&&this.y===t.y}clone(){return new u(this.x,this.y)}static scale(t,e){return new u(t.x*e,t.y*e)}static sub(t,e){return new u(t.x-e.x,t.y-e.y)}static add(t,e){return new u(t.x+e.x,t.y+e.y)}}class Gt{constructor(t){a(this,"_element"),a(this,"_callback"),this._element=t,this._observe()}setElement(t){this._element=t,this._observe()}_observe(){var t;const e=new MutationObserver(()=>{var n;(n=this._callback)==null||n.call(this,!1)}),i={attributes:!0,childList:!0,attributeOldValue:!0};e.observe(this._element,i),new ResizeObserver(()=>{var n;(n=this._callback)==null||n.call(this,!0)}).observe(this._element);function s(n,o){let l,h=!0;return function(){h&&(n(),h=!1),clearTimeout(l),l=setTimeout(()=>{n(),h=!0},o)}}(t=this._element.parentElement)==null||t.addEventListener("scroll",s(()=>{var n;(n=this._callback)==null||n.call(this,!0)},30)),window.addEventListener("scroll",s(()=>{var n;(n=this._callback)==null||n.call(this,!0)},30)),window.addEventListener("resize",s(()=>{var n;(n=this._callback)==null||n.call(this,!0)},30))}onChange(t){this._callback=t}}function Zt(r){return new Gt(r)}function Jt(r,t){const e=t.x-r.x,i=t.y-r.y;return Math.sqrt(e*e+i*i)}function _(r,t){const e=r-t;return Math.abs(e)<=.01}function b(r){let t=r.match(/^([\d.]+)([a-zA-Z%]*)$/);t||(t="0px".match(/^([\d.]+)([a-zA-Z%]*)$/));const e=parseFloat(t[1]),i=t[2];return{value:e,unit:i,valueWithUnit:r}}function Qt(r,t,e=!1){if(r===t)return!0;if(r.length!==t.length)return!1;for(let i=0;i<r.length;i++)if(e&&!_(r[i].value,t[i].value)||r[i].value!==t[i].value)return!1;return!0}function xt(r,t){return Qt(r,t,!0)}class F{constructor(t,e,i,s){a(this,"_topLeft"),a(this,"_topRight"),a(this,"_bottomLeft"),a(this,"_bottomRight"),this._topLeft=t,this._topRight=e,this._bottomLeft=i,this._bottomRight=s}get value(){return{topLeft:this._topLeft,topRight:this._topRight,bottomRight:this._bottomRight,bottomLeft:this._bottomLeft}}equals(t){return _(this.value.topLeft.value,t.value.topLeft.value)&&_(this.value.topRight.value,t.value.topRight.value)&&_(this.value.bottomRight.value,t.value.bottomRight.value)&&_(this.value.bottomLeft.value,t.value.bottomLeft.value)}toCssPercentageForNewSize(t){const e=this._convertToPercentage(this._topLeft,t),i=this._convertToPercentage(this._topRight,t),s=this._convertToPercentage(this._bottomLeft,t),n=this._convertToPercentage(this._bottomRight,t);return`${e.h} ${i.h} ${n.h} ${s.h} / ${e.v} ${i.v} ${n.v} ${s.v}`}_convertToPercentage(t,e){if(t.unit==="%")return{h:`${t.value}%`,v:`${t.value}%`};const i=t.value/e.width*100,s=t.value/e.height*100;return{h:`${i}%`,v:`${s}%`}}}function at(r){const t=r.split(" ").map(i=>b(i)),e={value:0,unit:"",valueWithUnit:"0"};switch(t.length){case 1:return new F(t[0],t[0],t[0],t[0]);case 2:return new F(t[0],t[1],t[0],t[1]);case 3:return new F(t[0],t[1],t[2],t[1]);case 4:return new F(t[0],t[1],t[3],t[2]);default:return new F(e,e,e,e)}}function te(r,t){const e=o(r.topLeft,t),i=o(r.topRight,t),s=o(r.bottomLeft,t),n=o(r.bottomRight,t);return{v:{topLeft:e.v,topRight:i.v,bottomRight:n.v,bottomLeft:s.v},h:{topLeft:e.h,topRight:i.h,bottomRight:n.h,bottomLeft:s.h}};function o(l,h){if(l.unit==="%")return{h:b(`${l.value}%`),v:b(`${l.value}%`)};const g=l.value/h.width*100,d=l.value/h.height*100;return{h:b(`${g}%`),v:b(`${d}%`)}}}function At(r,t){return _(r.topLeft.value,t.topLeft.value)&&_(r.topRight.value,t.topRight.value)&&_(r.bottomRight.value,t.bottomRight.value)&&_(r.bottomLeft.value,t.bottomLeft.value)}class ee{constructor(t){a(this,"_value"),this._value=t}get value(){return this._value}equals(t){return _(this.value,t.value)}}function ie(r){return new ee(parseFloat(r))}class se{constructor(t,e){a(this,"_x"),a(this,"_y"),this._x=t,this._y=e}get value(){return new u(this._x,this._y)}}function ne(r,t){const[e,i]=r.split(" "),s=b(e),n=b(i);return new se(s.value/t.width,n.value/t.height)}function Tt(r,t){const e=re(r),i=r.offsetWidth,s=r.offsetHeight;return{viewportOffset:{left:Math.round(e.left),top:Math.round(e.top),right:Math.round(e.right),bottom:Math.round(e.bottom)},pageOffset:t.read({width:i,height:s}),size:{width:i,height:s}}}function re(r){const t=r.getBoundingClientRect();return{left:t.left,top:t.top,right:t.right,bottom:t.bottom,width:t.width,height:t.height}}function It(r){let t=r,e=0,i=0;for(;t;)e+=t.offsetTop,i+=t.offsetLeft,t=t.offsetParent;return{top:e,left:i}}class ae{constructor(t){a(this,"_currentPageRect"),a(this,"_view"),a(this,"_element"),a(this,"_offsetLeft"),a(this,"_offsetTop"),a(this,"_width"),a(this,"_height"),a(this,"_parentWidth"),a(this,"_parentHeight"),a(this,"_parentEl"),a(this,"_isSvg"),a(this,"_invalid"),this._invalid=!0,this._view=t,this._element=t.element,this._isSvg=!!this._element.closest("svg"),this._offsetLeft=0,this._offsetTop=0,this._width=0,this._height=0,this._parentWidth=0,this._parentHeight=0,this._offsetLeft=0,this._parentEl=this._element.parentElement,window.addEventListener("resize",()=>{this.invalidate()})}invalidate(){this._invalid=!0}read(t){if(this._isSvg)return this._currentPageRect||(this._currentPageRect=It(this._element)),this._currentPageRect;const e=this._element.parentElement,i=this._element.offsetLeft,s=this._element.offsetTop,n=t.width,o=t.height,l=(e==null?void 0:e.offsetWidth)||0,h=(e==null?void 0:e.offsetHeight)||0;return(this._offsetLeft!==i||this._offsetTop!==s||!_(this._width,n)||!_(this._height,o))&&this._view._children.forEach(g=>g.elementReader.invalidatePageRect()),!this._invalid&&this._currentPageRect&&this._offsetLeft===i&&this._offsetTop===s&&_(this._width,n)&&_(this._height,o)&&_(this._parentWidth,l)&&_(this._parentHeight,h)&&this._parentEl===e?this._currentPageRect:(this._offsetLeft=i,this._offsetTop=s,this._width=n,this._height=o,this._parentWidth=l,this._parentHeight=h,this._parentEl=e,this._currentPageRect=It(this._element),this._invalid=!1,this._currentPageRect)}}function oe(r){return new ae(r)}class le{constructor(t){a(this,"_element"),a(this,"_rect"),a(this,"_computedStyle"),a(this,"_pageRectReader"),a(this,"_scroll"),this._element=t.element,this._pageRectReader=oe(t),this._rect=Tt(this._element,this._pageRectReader),this._computedStyle=getComputedStyle(this._element),this._scroll=this._calculateScroll()}invalidatePageRect(){this._pageRectReader.invalidate()}update(t=!1){this._rect=Tt(this._element,this._pageRectReader),this._computedStyle=getComputedStyle(this._element),t&&(this._scroll=this._calculateScroll())}get rect(){return this._rect}get opacity(){return ie(this._computedStyle.opacity)}get borderRadius(){return at(this._computedStyle.borderRadius)}get origin(){return ne(this._computedStyle.transformOrigin,this._rect.size)}_calculateScroll(){let t=this._element,e=0,i=0;for(;t;)e+=t.scrollTop,i+=t.scrollLeft,t=t.offsetParent;return i+=window.scrollX,e+=window.scrollY,{y:e,x:i}}get scroll(){return this._scroll}}function Ct(r){return new le(r)}function ot(r,t){const e={set:(i,s,n)=>(typeof i[s]=="object"&&i[s]!==null?i[s]=ot(n,t):(t(),i[s]=n),!0),get:(i,s)=>typeof i[s]=="object"&&i[s]!==null?ot(i[s],t):i[s]};return new Proxy(r,e)}const H=.01,lt={speed:15};class ht{constructor(t){a(this,"name","dynamic"),a(this,"_config"),this._config=t}get config(){return this._config}}class he extends ht{update({animatorProp:t,current:e,target:i,dt:s}){const n=u.sub(i,e),o=u.scale(n,this._config.speed);let l=u.add(e,u.scale(o,s));return this._shouldFinish(i,e,o)&&(l=i,requestAnimationFrame(()=>{t.callCompleteCallback()})),t.callUpdateCallback(),l}_shouldFinish(t,e,i){return u.sub(t,e).magnitude<H&&i.magnitude<H}}class ue extends ht{update({animatorProp:t,current:e,target:i,dt:s}){const n=(i-e)*this._config.speed;let o=e+n*s;return _(o,i)&&(o=i,requestAnimationFrame(()=>{t.callCompleteCallback()})),t.callUpdateCallback(),o}}class ce extends ht{update({animatorProp:t,current:e,target:i,dt:s}){return i.map((n,o)=>{const l=e[o],h=n.value===0?l.unit:n.unit,g=(n.value-l.value)*this._config.speed,d=l.value+g*s;let p=b(`${d}${h}`);return this._shouldFinish(n.value,l.value,g)&&(p=n,requestAnimationFrame(()=>{t.callCompleteCallback()})),t.callUpdateCallback(),p})}_shouldFinish(t,e,i){return Math.abs(t-e)<H&&Math.abs(i)<H}}class ut{constructor(){a(this,"name","instant"),a(this,"_config",{})}get config(){return this._config}update(t){return requestAnimationFrame(()=>{t.animatorProp.callCompleteCallback()}),t.target}}const ct={stiffness:.5,damping:.75,speed:10},Y=.01;class dt{constructor(t){a(this,"name","spring"),a(this,"_config"),this._config=t}get config(){return this._config}}class de extends dt{constructor(){super(...arguments),a(this,"_velocity",new u(0,0))}update({animatorProp:t,current:e,target:i,dt:s}){const n=u.scale(u.scale(u.sub(e,i),-1),this._config.stiffness);this._velocity=u.add(this._velocity,n),this._velocity=u.scale(this._velocity,this._config.damping);let o=u.add(e,u.scale(this._velocity,s*this._config.speed));return this._shouldFinish(i,e)&&(o=i,requestAnimationFrame(()=>{t.callCompleteCallback()})),o}_shouldFinish(t,e){return u.sub(t,e).magnitude<Y&&this._velocity.magnitude<Y}}class ge extends dt{constructor(){super(...arguments),a(this,"_velocity",0)}update({animatorProp:t,current:e,target:i,dt:s}){const n=-(e-i)*this._config.stiffness;this._velocity+=n,this._velocity*=this._config.damping;let o=e+this._velocity*s*this._config.speed;return _(o,i)&&(o=i,requestAnimationFrame(()=>{t.callCompleteCallback()})),o}}class pe extends dt{constructor(){super(...arguments),a(this,"_velocity",0)}update({animatorProp:t,current:e,target:i,dt:s}){return i.map((n,o)=>{const l=e[o],h=n.value===0?l.unit:n.unit,g=-(l.value-n.value)*this._config.stiffness;this._velocity+=g,this._velocity*=this._config.damping;const d=l.value+this._velocity*s*this._config.speed;let p=b(`${d}${h}`);return this._shouldFinish(n.value,l.value)&&(p=n,requestAnimationFrame(()=>{t.callCompleteCallback()})),p})}_shouldFinish(t,e){return Math.abs(t-e)<Y&&Math.abs(this._velocity)<Y}}function _e(r){return r}const gt={duration:350,ease:_e};class pt{constructor(t){a(this,"name","tween"),a(this,"_config"),a(this,"_startTime"),this._config=t}get config(){return this._config}reset(){this._startTime=void 0}}class me extends pt{update({animatorProp:t,initial:e,target:i,ts:s}){this._startTime||(this._startTime=s);const n=Math.min(1,(s-this._startTime)/this._config.duration);return _(n,1)?(requestAnimationFrame(()=>{t.callCompleteCallback()}),i):u.add(e,u.scale(u.sub(i,e),this._config.ease(n)))}}class ve extends pt{update({animatorProp:t,initial:e,target:i,ts:s}){this._startTime||(this._startTime=s);const n=Math.min(1,(s-this._startTime)/this._config.duration);return _(n,1)?(requestAnimationFrame(()=>{t.callCompleteCallback()}),i):e.map((o,l)=>{const h=i[l],g=h.value===0?o.unit:h.unit,d=o.value+this._config.ease(n)*(i[l].value-o.value);return b(`${d}${g}`)})}}class fe extends pt{update({animatorProp:t,initial:e,target:i,ts:s}){this._startTime||(this._startTime=s);const n=Math.min(1,(s-this._startTime)/this._config.duration);return _(n,1)?(requestAnimationFrame(()=>{t.callCompleteCallback()}),i):e+(i-e)*this._config.ease(n)}}class _t{createAnimatorByName(t,e){switch(t){case"instant":return this.createInstantAnimator();case"dynamic":return this.createDynamicAnimator(e);case"tween":return this.createTweenAnimator(e);case"spring":return this.createSpringAnimator(e)}return this.createInstantAnimator()}}class X extends _t{createInstantAnimator(){return new ut}createTweenAnimator(t){return new me({...gt,...t})}createDynamicAnimator(t){return new he({...lt,...t})}createSpringAnimator(t){return new de({...ct,...t})}}class we extends _t{createInstantAnimator(){return new ut}createTweenAnimator(t){return new ve({...gt,...t})}createDynamicAnimator(t){return new ce({...lt,...t})}createSpringAnimator(t){return new pe({...ct,...t})}}class Lt extends _t{createInstantAnimator(){return new ut}createDynamicAnimator(t){return new ue({...lt,...t})}createTweenAnimator(t){return new fe({...gt,...t})}createSpringAnimator(t){return new ge({...ct,...t})}}function k(r){return structuredClone(r)}class ye{constructor(t){a(this,"_viewProp"),a(this,"_completeCallback"),a(this,"_updateCallback"),a(this,"_isAnimating"),this._viewProp=t,this._isAnimating=!1}set(t,e){this._viewProp.setAnimator(t,e)}get name(){return this._viewProp.getAnimator().name}onComplete(t){this._completeCallback=t}get isAnimating(){return this._isAnimating}markAsAnimating(){this._isAnimating=!0}callCompleteCallback(){var t;(t=this._completeCallback)==null||t.call(this),this._isAnimating=!1}onUpdate(t){this._updateCallback=t}callUpdateCallback(){var t;(t=this._updateCallback)==null||t.call(this)}}class I{constructor(t,e,i){a(this,"_animatorProp"),a(this,"_animator"),a(this,"_initialValue"),a(this,"_previousValue"),a(this,"_targetValue"),a(this,"_currentValue"),a(this,"_hasChanged"),a(this,"_view"),a(this,"_animatorFactory"),a(this,"_previousRenderValue"),this._animatorProp=new ye(this),this._animatorFactory=t,this._initialValue=k(e),this._previousValue=k(e),this._targetValue=k(e),this._currentValue=k(e),this._hasChanged=!1,this._previousRenderValue=void 0,this._view=i,this._animator=this._animatorFactory.createInstantAnimator()}get shouldRender(){return!0}get isAnimating(){return this.animator.isAnimating}getAnimator(){return this._animator}get animator(){return this._animatorProp}get _rect(){return this._view.rect}get _previousRect(){return this._view.previousRect}setAnimator(t,e){this._animator=this._animatorFactory.createAnimatorByName(t,e)}_setTarget(t,e=!0){var i,s;this._previousValue=k(this._currentValue),this._targetValue=t,e?((s=(i=this._animator).reset)==null||s.call(i),this.animator.markAsAnimating()):this._currentValue=t,this._hasChanged=!0}hasChanged(){return this._hasChanged}destroy(){this._hasChanged=!1}update(t,e){}}class Ve extends I{constructor(){super(...arguments),a(this,"_invertedBorderRadius"),a(this,"_forceStyleUpdateThisFrame",!1),a(this,"_updateWithScale",!1)}setFromElementPropValue(t){this._setTarget([t.value.topLeft,t.value.topRight,t.value.bottomRight,t.value.bottomLeft],!0)}enableUpdateWithScale(){this._updateWithScale=!0}disableUpdateWithScale(){this._updateWithScale=!1}get value(){return{topLeft:this._currentValue[0],topRight:this._currentValue[1],bottomRight:this._currentValue[2],bottomLeft:this._currentValue[3]}}get invertedBorderRadius(){return this._invertedBorderRadius}set(t,e=!0){let i;if(typeof t=="string"){const h=at(t.trim());i={topLeft:h.value.topLeft.valueWithUnit,topRight:h.value.topRight.valueWithUnit,bottomRight:h.value.bottomRight.valueWithUnit,bottomLeft:h.value.bottomLeft.valueWithUnit}}else i=t;const s=i.topLeft?b(i.topLeft):this._currentValue[0],n=i.topRight?b(i.topRight):this._currentValue[1],o=i.bottomRight?b(i.bottomRight):this._currentValue[2],l=i.bottomLeft?b(i.bottomLeft):this._currentValue[3];this._setTarget([s,n,o,l],e)}reset(t=!0){this._setTarget(this._initialValue,t)}update(t,e){if(this._forceStyleUpdateThisFrame)this._hasChanged=!0,this._forceStyleUpdateThisFrame=!1;else if(this._view.scale.isAnimating&&this._updateWithScale)this._hasChanged=!0;else if(xt(this._targetValue,this._currentValue)){this._hasChanged=!xt(this._targetValue,this._initialValue);return}this._currentValue=this._animator.update({animatorProp:this._animatorProp,current:this._currentValue,target:this._targetValue,initial:this._previousValue,ts:t,dt:e}),this._updateWithScale&&this._applyScaleInverse()}applyScaleInverse(){this._updateWithScale&&(this._forceStyleUpdateThisFrame=!0)}_applyScaleInverse(){if(_(this._view.scale.x,1)&&_(this._view.scale.y,1))return;const t=this._rect.size.width*this._view.scale.x,e=this._rect.size.height*this._view.scale.y;this._invertedBorderRadius=te(at(`${this._currentValue[0].valueWithUnit} ${this._currentValue[1].valueWithUnit} ${this._currentValue[2].valueWithUnit} ${this._currentValue[3].valueWithUnit}`).value,{width:t,height:e})}get shouldRender(){return this._hasChanged?this._previousRenderValue?!(At(this.renderValue.v,this._previousRenderValue.v)&&At(this.renderValue.h,this._previousRenderValue.h)):!0:!1}get renderValue(){return this.invertedBorderRadius?{v:{topLeft:this.invertedBorderRadius.v.topLeft,topRight:this.invertedBorderRadius.v.topRight,bottomLeft:this.invertedBorderRadius.v.bottomLeft,bottomRight:this.invertedBorderRadius.v.bottomRight},h:{topLeft:this.invertedBorderRadius.h.topLeft,topRight:this.invertedBorderRadius.h.topRight,bottomLeft:this.invertedBorderRadius.h.bottomLeft,bottomRight:this.invertedBorderRadius.h.bottomRight}}:{v:{topLeft:this.value.topLeft,topRight:this.value.topRight,bottomLeft:this.value.bottomLeft,bottomRight:this.value.bottomRight},h:{topLeft:this.value.topLeft,topRight:this.value.topRight,bottomLeft:this.value.bottomLeft,bottomRight:this.value.bottomRight}}}projectStyles(){const t=this.renderValue,e=`border-radius: ${t.h.topLeft.valueWithUnit} ${t.h.topRight.valueWithUnit} ${t.h.bottomRight.valueWithUnit} ${t.h.bottomLeft.valueWithUnit} / ${t.v.topLeft.valueWithUnit} ${t.v.topRight.valueWithUnit} ${t.v.bottomRight.valueWithUnit} ${t.v.bottomLeft.valueWithUnit};`;return this._previousRenderValue=t,e}isTransform(){return!1}}class be extends I{setFromElementPropValue(t){this._setTarget(t.value,!0)}get value(){return this._currentValue}set(t,e=!0){this._setTarget(t,e)}reset(t=!0){this._setTarget(1,t)}update(t,e){if(_(this._targetValue,this._currentValue)){this._hasChanged=!_(this._targetValue,this._initialValue);return}this._currentValue=this._animator.update({animatorProp:this._animatorProp,current:this._currentValue,target:this._targetValue,initial:this._previousValue,ts:t,dt:e})}get shouldRender(){return this._hasChanged?typeof this._previousRenderValue>"u"?!0:this.renderValue!==this._previousRenderValue:!1}get renderValue(){return this.value}projectStyles(){const t=this.renderValue,e=`opacity: ${t};`;return this._previousRenderValue=t,e}isTransform(){return!1}}class Pe extends I{get x(){return this._currentValue.x}get y(){return this._currentValue.y}set(t){const e={x:this.x,y:this.y,...t};if(e.x<0||e.x>1){console.log(`%c WARNING: ${this._view.name}.origin.x property can only be a value from 0 to 1`,"background: #885500");return}if(e.y<0||e.y>1){console.log(`%c WARNING: ${this._view.name}.origin.y property can only be a value from 0 to 1`,"background: #885500");return}this._setTarget(new u(e.x,e.y),!1)}reset(){this._setTarget(this._initialValue,!1)}get shouldRender(){if(!this._hasChanged)return!1;if(!this._previousRenderValue)return!0;const t=this.renderValue;return!(_(t.x,this._previousRenderValue.x)&&_(t.y,this._previousRenderValue.y))}get renderValue(){return new u(this.x*100,this.y*100)}projectStyles(){const t=this.renderValue,e=`transform-origin: ${t.x}% ${t.y}%;`;return this._previousRenderValue=t,e}isTransform(){return!1}}class Ee extends I{constructor(){super(...arguments),a(this,"_animateLayoutUpdateNextFrame",!1),a(this,"_parentScaleInverse",new u(1,1))}get _parentDiff(){let t=this._view._parent,e=0,i=0;if(t){const s=t.rect.pageOffset,n=t.getScroll(),o={left:t.previousRect.viewportOffset.left+n.x,top:t.previousRect.viewportOffset.top+n.y};e=o.left-s.left,i=o.top-s.top}return{parentDx:e,parentDy:i}}get x(){return this._currentValue.x+this._rect.pageOffset.left+this._parentDiff.parentDx}get y(){return this._currentValue.y+this._rect.pageOffset.top+this._parentDiff.parentDy}get initialX(){return this._rect.pageOffset.left}get initialY(){return this._rect.pageOffset.top}progressTo(t){const e=typeof t.x>"u"?this.initialX:t.x,i=typeof t.y>"u"?this.initialY:t.y,s=new u(e,i),n=new u(this.initialX,this.initialY),o=new u(this.x,this.y),l=u.sub(o,n),h=u.sub(s,n);return 1-u.sub(h,l).magnitude/h.magnitude}set(t,e=!0){const i={x:this.x,y:this.y,...t};this._setTarget(new u(i.x-this._rect.pageOffset.left,i.y-this._rect.pageOffset.top),e)}reset(t=!0){this._setTarget(new u(0,0),t)}update(t,e){if((this._view.isInverseEffectEnabled||this._view.isLayoutTransitionEnabled)&&!this._view.isTemporaryView&&this._runLayoutTransition(),this._view.isInverseEffectEnabled){const h=this._view._parent,g=h?h.scale.x:1,d=h?h.scale.y:1;this._parentScaleInverse=new u(1/g,1/d),this._parentScaleInverse.equals(new u(1,1))||(this._hasChanged=!0)}if(this._targetValue.x===this._currentValue.x&&this._targetValue.y===this._currentValue.y)return;const i=this._view._parent,s=i?i.scale.x:1,n=i?i.scale.y:1,o=i?i.scale._previousValue.x:1,l=i?i.scale._previousValue.y:1;this._currentValue=this._animator.update({animatorProp:this._animatorProp,current:new u(this._currentValue.x*s,this._currentValue.y*n),target:this._targetValue,initial:new u(this._previousValue.x*o,this._previousValue.y*l),ts:t,dt:e}),this._currentValue=new u(this._currentValue.x/s,this._currentValue.y/n)}_runLayoutTransition(){const t=!(this._targetValue.x===this._currentValue.x&&this._targetValue.y===this._currentValue.y),e=!(this._view.scale._targetValue.x===this._view.scale._currentValue.x&&this._view.scale._targetValue.y===this._view.scale._currentValue.y),i=t||e,s=this._rect.pageOffset.left-this._previousRect.pageOffset.left,n=this._rect.pageOffset.top-this._previousRect.pageOffset.top,o=this._previousRect.size.width/this._rect.size.width,l=this._previousRect.size.height/this._rect.size.height;let h=!1;if(s!==0||n!==0||!Number.isNaN(o)&&o!==1||!Number.isNaN(l)&&l!==1?h=!0:h=(()=>{const g=this._view._parents;for(let d=0;d<g.length;d++){const p=g[d],w=p.previousRect.size.width/p.rect.size.width,v=p.previousRect.size.height/p.rect.size.height;if(w!==1||v!==1)return!0}return!1})(),h){if(this._currentValue.x!==0||this._currentValue.y!==0||this._view.scale._currentValue.x!==1||this._view.scale._currentValue.y!==1){if(!i){const G=this._rect.pageOffset.left-this._previousRect.pageOffset.left,Z=this._rect.pageOffset.top-this._previousRect.pageOffset.top;this._setTarget(new u(this._currentValue.x-G,this._currentValue.y-Z),!1);return}const c=this._view._parent,f=this._rect.pageOffset,m=this._view.getScroll(),x={left:this._previousRect.viewportOffset.left+m.x,top:this._previousRect.viewportOffset.top+m.y},N=x.left-f.left,D=x.top-f.top;let W=0,A=0,q=0,kt=0;if(c){const G=c.rect.pageOffset,Z=c.getScroll(),J={left:c.previousRect.viewportOffset.left+Z.x,top:c.previousRect.viewportOffset.top+Z.y};W=J.left-G.left,A=J.top-G.top;const $t=x.top-J.top,zt=x.left-J.left,Ue=c.scale.y*$t;q=($t-Ue)/c.scale.y;const je=c.scale.x*zt;kt=(zt-je)/c.scale.x}this._setTarget(new u(N-W+kt,D-A+q),!1),i&&(this._animateLayoutUpdateNextFrame=!0);return}this._animateLayoutUpdateNextFrame=!0;const g=this._previousRect,d=this._rect,p=this._view._parent;let w=0,v=0;p&&(w=p.previousRect.viewportOffset.left-p.rect.viewportOffset.left),p&&(v=p.previousRect.viewportOffset.top-p.rect.viewportOffset.top);let y=1,P=1;p&&(y=p.previousRect.size.width/p.rect.size.width,P=p.previousRect.size.height/p.rect.size.height);const E=p?p.previousRect.viewportOffset.left:0,$=p?p.previousRect.viewportOffset.top:0,z=g.viewportOffset.left-E,O=g.viewportOffset.top-$,wt=z/y-z,K=O/P-O;let L=g.viewportOffset.left-d.viewportOffset.left-w+wt,M=g.viewportOffset.top-d.viewportOffset.top-v+K;L=Number.isFinite(L)?L:0,M=Number.isFinite(M)?M:0,this._setTarget(new u(L,M),!1)}else this._animateLayoutUpdateNextFrame&&(this._setTarget(this._initialValue,!0),this._animateLayoutUpdateNextFrame=!1)}get shouldRender(){if(!this._hasChanged)return!1;if(!this._previousRenderValue)return!0;const t=this.renderValue;return!(_(t.x,this._previousRenderValue.x)&&_(t.y,this._previousRenderValue.y))}get renderValue(){let t=0,e=0;return(this._view.isInverseEffectEnabled||this._view.isLayoutTransitionEnabled)&&(t=(this._rect.size.width*this._parentScaleInverse.x*this._view.scale.x-this._rect.size.width)*this._view.origin.x,e=(this._rect.size.height*this._parentScaleInverse.y*this._view.scale.y-this._rect.size.height)*this._view.origin.y),new u(this._currentValue.x+t,this._currentValue.y+e)}projectStyles(){const t=this.renderValue,e=`translate3d(${t.x}px, ${t.y}px, 0px)`;return this._previousRenderValue=t,e}isTransform(){return!0}}class Re extends I{constructor(){super(...arguments),a(this,"_unit","deg")}get degrees(){let t=this._currentValue;return this._unit==="rad"&&(t=t*(180/Math.PI)),t}get radians(){let t=this._currentValue;return this._unit==="deg"&&(t=t*(Math.PI/180)),t}setDegrees(t,e=!0){this._unit="deg",this._setTarget(t,e)}setRadians(t,e=!0){this._unit="rad",this._setTarget(t,e)}reset(t=!0){this._setTarget(0,t)}update(t,e){this._targetValue!==this._currentValue&&(this._currentValue=this._animator.update({animatorProp:this._animatorProp,current:this._currentValue,target:this._targetValue,initial:this._previousValue,ts:t,dt:e}))}get shouldRender(){if(!this._hasChanged)return!1;if(typeof this._previousRenderValue>"u")return!0;const t=this.renderValue;return!_(t,this._previousRenderValue)}get renderValue(){return this._currentValue}projectStyles(){const t=this.renderValue,e=`rotate(${t}${this._unit})`;return this._previousRenderValue=t,e}isTransform(){return!0}}class xe extends I{constructor(){super(...arguments),a(this,"_animateLayoutUpdateNextFrame",!1)}get x(){return this._currentValue.x}get y(){return this._currentValue.y}set(t,e=!0){const i={x:this._currentValue.x,y:this._currentValue.y,...typeof t=="number"?{x:t,y:t}:t};this._setTarget(new u(i.x,i.y),e)}setWithSize(t,e=!0){let i=this._currentValue.x,s=this._currentValue.y;t.width&&(i=t.width/this._rect.size.width),t.height&&(s=t.height/this._rect.size.height),!t.width&&t.height&&(i=s),!t.height&&t.width&&(s=i);const n={x:i,y:s};this._setTarget(new u(n.x,n.y),e)}reset(t=!0){this._setTarget(new u(1,1),t)}update(t,e){if(this._view.layoutOption!=="position"){if((this._view.isInverseEffectEnabled||this._view.isLayoutTransitionEnabled)&&!this._view.isTemporaryView&&this._runLayoutTransition(),this._view.isInverseEffectEnabled){const i=this._view._parent,s=i?i.scale.x:1,n=i?i.scale.y:1;this._hasChanged=s!==1||n!==1}this._targetValue.x===this._currentValue.x&&this._targetValue.y===this._currentValue.y||(this._currentValue=this._animator.update({animatorProp:this._animatorProp,current:this._currentValue,target:this._targetValue,initial:new u(this._previousValue.x,this._previousValue.y),ts:t,dt:e}))}}_runLayoutTransition(){const t=!(this._targetValue.x===this._currentValue.x&&this._targetValue.y===this._currentValue.y),e=this._previousRect.size.width/this._rect.size.width,i=this._previousRect.size.height/this._rect.size.height;let s=!1;if((!Number.isNaN(e)&&e!==1||!Number.isNaN(i)&&i!==1)&&(s=!0),s){if(this._currentValue.x!==1||this._currentValue.y!==1){const g=this._view.previousRect.size.width/this._view.rect.size.width,d=this._view.previousRect.size.height/this._view.rect.size.height;this._setTarget(new u(this._currentValue.x*g,this._currentValue.y*d),!1),t&&(this._animateLayoutUpdateNextFrame=!0);return}const n=this._previousRect.size.width/this._rect.size.width,o=this._previousRect.size.height/this._rect.size.height,l=n,h=o;this._view.viewProps.borderRadius.applyScaleInverse(),this._setTarget(new u(l,h),!1),this._animateLayoutUpdateNextFrame=!0}else this._animateLayoutUpdateNextFrame&&(this._setTarget(this._initialValue,!0),this._animateLayoutUpdateNextFrame=!1)}get shouldRender(){if(!this._hasChanged)return!1;if(!this._previousRenderValue)return!0;const t=this.renderValue;return!(_(t.x,this._previousRenderValue.x)&&_(t.y,this._previousRenderValue.y))}get renderValue(){const t=this._view._parent?this._view._parent.scale.x:1,e=this._view._parent?this._view._parent.scale.y:1,i=this._currentValue.x/t,s=this._currentValue.y/e;return new u(i,s)}projectStyles(){const t=this.renderValue,e=`scale3d(${t.x}, ${t.y}, 1)`;return this._previousRenderValue=t,e}isTransform(){return!0}}class Ae extends I{get width(){return this._view.rect.size.width}get height(){return this._view.rect.size.height}get localWidth(){return this._currentValue.x}get localHeight(){return this._currentValue.y}get widthAfterScale(){const t=this._view.scale.x;return this.localWidth*t}get heightAfterScale(){const t=this._view.scale.y;return this.localHeight*t}get initialWidth(){return this._initialValue.x}get initialHeight(){return this._initialValue.y}set(t,e=!0){const i={width:this._currentValue.x,height:this._currentValue.y,...t};this._setTarget(new u(i.width,i.height),e)}setWidth(t,e=!0){const i={width:this._currentValue.x,height:this._currentValue.y,width:t};this._setTarget(new u(i.width,i.height),e)}setHeight(t,e=!0){const i={width:this._currentValue.x,height:this._currentValue.y,height:t};this._setTarget(new u(i.width,i.height),e)}reset(t=!0){this._setTarget(new u(this.initialWidth,this.initialHeight),t)}update(t,e){this._targetValue.x===this._currentValue.x&&this._targetValue.y===this._currentValue.y||(this._currentValue=this._animator.update({animatorProp:this._animatorProp,current:this._currentValue,target:this._targetValue,initial:this._previousValue,ts:t,dt:e}))}get shouldRender(){if(!this._hasChanged)return!1;if(!this._previousRenderValue)return!0;const t=this.renderValue;return!(_(t.x,this._previousRenderValue.x)&&_(t.y,this._previousRenderValue.y))}get renderValue(){return new u(this._currentValue.x,this._currentValue.y)}projectStyles(){const t=this.renderValue,e=`width: ${t.x}px; height: ${t.y}px;`;return this._previousRenderValue=t,e}isTransform(){return!1}}class Te{constructor(t){a(this,"_props",new Map),this._props.set("position",new Ee(new X,new u(0,0),t)),this._props.set("scale",new xe(new X,new u(1,1),t)),this._props.set("rotation",new Re(new Lt,0,t)),this._props.set("size",new Ae(new X,new u(t.rect.size.width,t.rect.size.height),t)),this._props.set("opacity",new be(new Lt,t.elementReader.opacity.value,t)),this._props.set("borderRadius",new Ve(new we,[t.elementReader.borderRadius.value.topLeft,t.elementReader.borderRadius.value.topRight,t.elementReader.borderRadius.value.bottomRight,t.elementReader.borderRadius.value.bottomLeft],t)),this._props.set("origin",new Pe(new X,t.elementReader.origin.value,t))}allProps(){return Array.from(this._props.values())}allPropNames(){return Array.from(this._props.keys())}getPropByName(t){return this._props.get(t)}get position(){return this._props.get("position")}get scale(){return this._props.get("scale")}get rotation(){return this._props.get("rotation")}get size(){return this._props.get("size")}get opacity(){return this._props.get("opacity")}get borderRadius(){return this._props.get("borderRadius")}get origin(){return this._props.get("origin")}}class Ie{constructor(t,e,i,s){a(this,"id"),a(this,"name"),a(this,"element"),a(this,"styles",{}),a(this,"_viewProps"),a(this,"_previousRect"),a(this,"_onAddCallbacks"),a(this,"_onRemoveCallback"),a(this,"_skipFirstRenderFrame"),a(this,"_layoutTransition"),a(this,"_registry"),a(this,"_layoutId"),a(this,"_elementReader"),a(this,"_viewParents"),a(this,"_temporaryView"),a(this,"_inverseEffect"),a(this,"_renderNextTick"),a(this,"_layoutOption"),a(this,"_elementObserver"),a(this,"_hasReadElement"),a(this,"_shouldReadRect"),a(this,"_readWithScroll"),a(this,"_externalUserStyles"),this._registry=i,this.id=Et(),this.name=e,this.element=t,this.element.dataset.velViewId=this.id,this._elementReader=Ct(this),this._viewParents=this._getParents(),this._previousRect=this._elementReader.rect,this._viewProps=new Te(this),this._skipFirstRenderFrame=!0,this._layoutId=s,this._layoutTransition=!1,this._temporaryView=!1,this.styles=ot(this.styles,()=>{this._renderNextTick=!0}),this._externalUserStyles=this._getExternalUserStyles(),this._renderNextTick=!1,this._layoutOption=this._getLayoutOption(),this._hasReadElement=!1,this._shouldReadRect=!1,this._readWithScroll=!1,this._elementObserver=Zt(t),this._elementObserver.onChange(n=>{if(this._hasReadElement){this._shouldReadRect=!1;return}this._externalUserStyles=this._getExternalUserStyles(),this._shouldReadRect=!0,this._readWithScroll=n})}destroy(){this._viewProps.allProps().forEach(t=>t.destroy()),this.element.removeAttribute("data-vel-view-id"),this.element.removeAttribute("data-vel-plugin-id"),this._renderNextTick=!0}get elementReader(){return this._elementReader}get layoutOption(){return this._layoutOption}_getLayoutOption(){return this.element.closest("[data-vel-layout-position]")?"position":this.element.closest("[data-vel-layout-size]")?"size":"all"}setElement(t){this.element=t,this._elementReader=Ct(this),this.element.dataset.velViewId=this.id,this._elementObserver.setElement(t),this._viewParents=this._getParents()}get layoutId(){return this._layoutId}get position(){return this._viewProps.position}get scale(){return this._viewProps.scale}get _children(){const t=this.element.querySelectorAll("*");return Array.from(t).map(e=>e.dataset.velViewId).filter(e=>e&&typeof e=="string").map(e=>this._registry.getViewById(e)).filter(e=>!!e)}get _parent(){return this._parents[0]}get _parents(){return this._viewParents}_getParents(){var t;const e=[];let i=this.element.parentElement;if(!i)return e;for(i=i.closest("[data-vel-view-id]");i;){const s=i.dataset.velViewId;if(s){const n=this._registry.getViewById(s);n&&e.push(n)}i=(t=i.parentElement)==null?void 0:t.closest("[data-vel-view-id]")}return e}get rotation(){return this._viewProps.rotation}get size(){return this._viewProps.size}get _localWidth(){return this._viewProps.size.localWidth}get _localHeight(){return this._viewProps.size.localHeight}get opacity(){return this._viewProps.opacity}get borderRadius(){return this._viewProps.borderRadius}get origin(){return this._viewProps.origin}get data(){const t=this.element.dataset;return Object.keys(t).filter(e=>e.includes("velData")).map(e=>e.replace("velData","")).map(e=>`${e[0].toLowerCase()}${e.slice(1)}`).reduce((e,i)=>{const s=t[`velData${i[0].toUpperCase()}${i.slice(1)}`];return!e[i]&&s&&(e[i]=s),e},{})}get onAddCallbacks(){return this._onAddCallbacks}get onRemoveCallback(){return this._onRemoveCallback}get isLayoutTransitionEnabled(){return this._layoutTransition}get hasLayoutTransitionEnabledForParents(){return this._parents.some(t=>t.isLayoutTransitionEnabled)}get isInverseEffectEnabled(){let t=!1;for(let e=0;e<this._parents.length;e++){const i=this._parents[e];if(typeof i._inverseEffect<"u"){t=i._inverseEffect;break}}return t}layoutTransition(t){this._layoutTransition=t,this.inverseEffect(t)}inverseEffect(t){this._inverseEffect=t,t&&this._children.forEach(e=>{if(e.position.animator.name==="instant"){const i=this.viewProps.position.getAnimator();e.position.setAnimator(i.name,i.config)}if(e.scale.animator.name==="instant"){const i=this.viewProps.scale.getAnimator();e.scale.setAnimator(i.name,i.config)}})}setAnimatorsFromParent(){let t=this._parent;for(;t&&!t._inverseEffect;)t=t._parent;if(t){if(this.position.animator.name==="instant"){const e=t.viewProps.position.getAnimator();this.position.setAnimator(e.name,e.config)}if(this.scale.animator.name==="instant"){const e=t.viewProps.scale.getAnimator();this.scale.setAnimator(e.name,e.config)}}}get _isRemoved(){return!this._registry.getViewById(this.id)}setPluginId(t){this.element.dataset.velPluginId=t}hasElement(t){return this.element.contains(t)}getScroll(){return this._elementReader.scroll}intersects(t,e){const i=this.element.getBoundingClientRect(),s={x:i.left,y:i.top};return t>=s.x&&t<=s.x+i.width&&e>=s.y&&e<=s.y+i.height}overlapsWith(t){const e=t._localWidth*t.scale.x,i=t._localHeight*t.scale.y,s=this._localWidth*this.scale.x,n=this._localHeight*this.scale.y;return this.position.x<t.position.x+e&&this.position.x+s>t.position.x&&this.position.y<t.position.y+i&&this.position.y+n>t.position.y}distanceTo(t){const e=new u(this.position.x,this.position.y),i=new u(t.position.x,t.position.y);return u.sub(i,e).magnitude}read(){this._shouldReadRect&&(this._elementReader.update(this._readWithScroll),this._children.forEach(t=>{t.setHasReadElement(!0),t.elementReader.update(this._readWithScroll)}),this._shouldReadRect=!1,this._readWithScroll=!1),this.setHasReadElement(!1)}setHasReadElement(t){this._hasReadElement=t}get rect(){return this._elementReader.rect}get previousRect(){return this._previousRect}update(t,e){this._viewProps.allProps().forEach(i=>i.update(t,e))}_updatePreviousRect(){this._previousRect=this._elementReader.rect}setAsTemporaryView(){this._temporaryView=!0}get isTemporaryView(){return this._temporaryView}get shouldRender(){return this._renderNextTick||this._viewProps.allProps().some(t=>t.shouldRender)}_cleanCssText(t){const e=new Map,i=/([-\w]+)\s*:\s*([^;]+)\s*;?/g;let s;for(;(s=i.exec(t))!==null;){const[n,o,l]=s;if(!l.trim())continue;const h=o.replace(/^-\w+-/,"");(!e.has(h)||!o.startsWith("-"))&&e.set(h,`${h}: ${l.trim()}`)}return Array.from(e.values()).join("; ")}render(){if(!this.shouldRender)return;if(this._isRemoved&&this._skipFirstRenderFrame){this._skipFirstRenderFrame=!1;return}let t="";const e=this._viewProps.allProps(),i=e.filter(n=>n.isTransform()),s=e.filter(n=>!n.isTransform());if(i.some(n=>n.hasChanged())){const n=i.reduce((o,l,h)=>(o+=l.projectStyles(),h<i.length-1&&(o+=" "),h===i.length-1&&(o+=";"),o),"transform: ");t+=n}s.forEach(n=>{n.hasChanged()&&(t+=n.projectStyles())}),t+=this._getUserStyles(),this._cleanCssText(this.element.style.cssText)!==this._cleanCssText(t)&&(this.element.style.cssText=t),this._renderNextTick=!1}_getExternalUserStyles(){const t=this.element.style.cssText,e=this.styles;if(t.length===0)return"";const i=["transform","transform-origin","opacity","width","height","border-radius"],s={};for(const n in e)e.hasOwnProperty(n)&&(s[bt(n)]=e[n]);return t.split(";").map(n=>n.trim()).filter(Boolean).filter(n=>{const o=n.indexOf(":");if(o===-1)return!1;const l=n.slice(0,o).trim();return!s.hasOwnProperty(l)&&!i.includes(l)}).join("; ")}_getUserStyles(){return Object.keys(this.styles).reduce((t,e)=>{if(!e)return t;const i=bt(e).replace("webkit","-webkit").replace("moz","-moz");return t+`${i}: ${this.styles[e]}; `},this._externalUserStyles)}markAsAdded(){delete this.element.dataset.velProcessing}onAdd(t){this._onAddCallbacks=t}onRemove(t){this._onRemoveCallback=t}get viewProps(){return this._viewProps}getPropByName(t){return this._viewProps.getPropByName(t)}_copyAnimatorsToAnotherView(t){t.viewProps.allPropNames().forEach(e=>{var i,s;const n=(i=this.viewProps.getPropByName(e))==null?void 0:i.getAnimator();n&&((s=t.viewProps.getPropByName(e))==null||s.setAnimator(n.name,n.config))})}getChildren(t){const e=this.element.querySelectorAll("*"),i=Array.from(e).filter(s=>{const n=s;return typeof n.dataset.velViewId<"u"&&n.dataset.velView===t}).map(s=>s.dataset.velViewId);return this._registry.getViewsById(i)}getChild(t){return this.getChildren(t)[0]}getParent(t){const e=this.element.closest(`[data-vel-view="${t}"]`);if(!e)return;const i=e.dataset.velViewId;if(i)return this._registry.getViewById(i)}}class Ce{constructor(t,e){a(this,"_appEventBus"),a(this,"_eventBus"),a(this,"_plugins",[]),a(this,"_views",[]),a(this,"_viewsPerPlugin",new Map),a(this,"_viewsToBeCreated",[]),a(this,"_viewsToBeRemoved",[]),a(this,"_viewsCreatedInPreviousFrame",[]),a(this,"_layoutIdToViewMap",new Map),a(this,"_eventPluginsPerPlugin",new Map),a(this,"_pluginNameToPluginFactoryMap",new Map),a(this,"_pluginNameToPluginConfigMap",new Map),this._appEventBus=t,this._eventBus=e}update(){this._handleRemovedViews(),this._handleAddedViews()}associateEventPluginWithPlugin(t,e){let i=this._eventPluginsPerPlugin.get(t);i||(i=[],this._eventPluginsPerPlugin.set(t,i)),i.push(e)}_handleRemovedViews(){const t=this._viewsToBeRemoved.filter(e=>e.dataset.velViewId);t.length&&(t.forEach(e=>{const i=e.dataset.velViewId;i&&this._handleRemoveView(i)}),this._viewsToBeRemoved=[])}_getPluginNameForElement(t){const e=t.dataset.velPlugin;if(e&&e.length>0)return e;const i=t.closest("[data-vel-plugin]");if(i)return i.dataset.velPlugin}_getPluginIdForElement(t){const e=this._getPluginNameForElement(t);if(!e)return;const i=t.closest("[data-vel-plugin-id]");if(i)return i.dataset.velPluginId;const s=this.getPluginByName(e);if(s)return s.id}_isScopedElement(t){const e=this._getPluginNameForElement(t);if(!e)return!1;const i=this._pluginNameToPluginFactoryMap.get(e),s=i==null?void 0:i.scope;return t.dataset.velView===s}_removeElementsWithParent(t){const e=new Set(t);return t.filter(i=>{let s=i.parentElement;for(;s;){if(e.has(s))return!1;s=s.parentElement}return!0})}_handleAddedViews(){this._viewsCreatedInPreviousFrame.forEach(n=>{n.markAsAdded()}),this._viewsCreatedInPreviousFrame=[];const t=this._removeElementsWithParent(this._viewsToBeCreated),e=Array.from(new Set(t.filter(n=>this._isScopedElement(n)&&!this._isElementIgnored(n)))),i=t.filter(n=>!this._isScopedElement(n)&&!this._isElementIgnored(n));this._viewsToBeCreated=[],e.forEach(n=>{const o=this._getPluginNameForElement(n),l=this._pluginNameToPluginFactoryMap.get(o),h=this._pluginNameToPluginConfigMap.get(o),g=n.dataset.velPluginKey,d=rt(l,this,this._eventBus,this._appEventBus,h,g);this._plugins.push(d);const p=n.dataset.velView,w=this._createNewView(n,p,d);w.isInverseEffectEnabled&&w.setAnimatorsFromParent(),d.notifyAboutViewAdded(w)});const s=i.filter(n=>!!this._getPluginIdForElement(n));s.length!==0&&s.forEach(n=>{const o=this._getPluginIdForElement(n),l=n.dataset.velView;if(!l||!o)return;const h=this._getPluginById(o);if(!h)return;const g=this._getLayoutIdForElement(n,h);let d;g&&this._layoutIdToViewMap.has(g)?(d=this._layoutIdToViewMap.get(g),d.setElement(n),d.setPluginId(h.id),this._createChildrenForView(d,h)):d=this._createNewView(n,l,h),d.isInverseEffectEnabled&&d.setAnimatorsFromParent(),h.notifyAboutViewAdded(d)})}_getLayoutIdForElement(t,e){const i=t.dataset.velLayoutId;if(i)return`${i}-${e.id}`}_createNewView(t,e,i){const s=this._getLayoutIdForElement(t,i),n=this.createView(t,e,s);return i.addView(n),n.layoutId&&this._layoutIdToViewMap.set(n.layoutId,n),this._createChildrenForView(n,i),this._appEventBus.emitPluginReadyEvent(i.pluginName,i.api,!0),requestAnimationFrame(()=>{requestAnimationFrame(()=>{this._appEventBus.emitPluginReadyEvent(i.pluginName,i.api)})}),n}_createChildrenForView(t,e){const i=t.element.querySelectorAll("*");if(i.length){if(Array.from(i).some(s=>this._getPluginNameForElement(s)!==e.pluginName)){console.log(`%c WARNING: The plugin "${e.pluginName}" has view(s) created for a different plugin. Make sure all views inside that plugin don't have data-vel-plugin set or the pluginName is set to "${e.pluginName}"`,"background: #885500");return}Array.from(i).filter(s=>!this._isElementIgnored(s)).forEach(s=>{const n=s,o=n.dataset.velView?n.dataset.velView:`${t.name}-child`,l=this._getLayoutIdForElement(n,e),h=this.createView(n,o,l);l&&!this._layoutIdToViewMap.has(l)&&this._layoutIdToViewMap.set(l,h),e.addView(h),e.notifyAboutViewAdded(h)})}}_handleRemoveView(t){this._plugins.forEach(e=>{if(!this._viewsPerPlugin.get(e.id))return;const i=this._getPluginViewById(e,t);i&&e.removeView(i)})}removeViewById(t,e){this._unassignViewFromPlugin(t,e),this._views=this._views.filter(i=>i.id!==t)}_unassignViewFromPlugin(t,e){const i=this._viewsPerPlugin.get(e);if(!i)return;const s=i.indexOf(t);s!==-1&&i.splice(s,1)}getViewById(t){return this._views.find(e=>e.id===t)}getViewsById(t){return this._views.filter(e=>t.includes(e.id))}_getPluginById(t){return this._plugins.find(e=>e.id===t)}_getPluginViewById(t,e){return this.getViewsForPlugin(t).find(i=>i.id===e)}destroy(t,e){if(!t){this._destroyAll(e);return}let i=[];if(t&&t.length>0){const s=this.getPluginByName(t);if(s){const n=(this._eventPluginsPerPlugin.get(s.id)||[]).map(o=>this._getPluginById(o)).filter(o=>typeof o<"u");i.push(s),i.push(...n)}}else i=this._plugins;i.forEach(s=>{this._destroyPlugin(s)}),requestAnimationFrame(()=>{e==null||e()})}_destroyPlugin(t){const e=this.getViewsForPlugin(t);e.forEach(i=>{i.layoutId&&this._layoutIdToViewMap.delete(i.layoutId),i.destroy()}),this._views=this._views.filter(i=>!e.find(s=>s.id===i.id)),this._viewsPerPlugin.delete(t.id),this._plugins=this._plugins.filter(i=>i.id!==t.id)}_destroyAll(t){this._views.forEach(e=>e.destroy()),requestAnimationFrame(()=>{this._plugins=[],this._views=[],this._viewsPerPlugin.clear(),this._viewsToBeCreated=[],this._viewsToBeRemoved=[],this._viewsCreatedInPreviousFrame=[],this._layoutIdToViewMap.clear(),this._eventPluginsPerPlugin.clear(),t==null||t()})}reset(t,e){let i=[];if(t&&t.length>0){const s=this.getPluginByName(t);if(s){const n=(this._eventPluginsPerPlugin.get(s.id)||[]).map(o=>this._getPluginById(o)).filter(o=>typeof o<"u");i.push(s),i.push(...n)}}else i=this._plugins;requestAnimationFrame(()=>{i.forEach(s=>{this._resetPlugin(s)}),requestAnimationFrame(()=>{e==null||e()})})}_resetPlugin(t){const e=t.config,i=t.pluginFactory,s=t.internalBusEvent,n=!t.isRenderable(),o=this.getViewsForPlugin(t);o.forEach(l=>{l.layoutId&&this._layoutIdToViewMap.delete(l.layoutId),l.destroy()}),this._views=this._views.filter(l=>!o.find(h=>h.id===l.id)),this._viewsPerPlugin.delete(t.id),this._plugins=this._plugins.filter(l=>l.id!==t.id),n||requestAnimationFrame(()=>{this.createPlugin(i,this._eventBus,e).setInternalEventBus(s)})}queueNodeToBeCreated(t){this._viewsToBeCreated.push(t)}queueNodeToBeRemoved(t){this._viewsToBeRemoved.push(t)}notifyPluginAboutDataChange(t){const e=this._plugins.filter(i=>i.id===t.pluginId);!e||!e.length||e.forEach(i=>{i.notifyAboutDataChanged({dataName:t.dataName,dataValue:t.dataValue,viewName:t.viewName})})}getPlugins(){return this._plugins}getRenderablePlugins(){function t(e){return e.isRenderable()}return this._plugins.filter(t)}getPluginByName(t,e){return this._plugins.find(i=>e?i.pluginKey===e&&i.pluginName===t:i.pluginName===t)}getPluginsByName(t,e){return this._plugins.filter(i=>e?i.pluginKey===e&&i.pluginName===t:i.pluginName===t)}hasPlugin(t){return t.pluginName?!!this.getPluginByName(t.pluginName):!1}createPlugin(t,e,i={},s=!1){if(!t.pluginName)throw Error(`Plugin ${t.name} must contain a pluginName field`);let n=[];if(t.scope){const h=s?`[data-vel-plugin=${t.pluginName}][data-vel-view=${t.scope}]:not([data-vel-plugin-id])`:`[data-vel-plugin=${t.pluginName}][data-vel-view=${t.scope}]`,g=document.querySelectorAll(h);this._pluginNameToPluginFactoryMap.has(t.pluginName)||this._pluginNameToPluginFactoryMap.set(t.pluginName,t),this._pluginNameToPluginConfigMap.has(t.pluginName)||this._pluginNameToPluginConfigMap.set(t.pluginName,i),g?n=Array.from(g):n=[document.documentElement]}else n=[document.documentElement];const o=n.map(h=>{const g=h.dataset.velPluginKey,d=rt(t,this,e,this._appEventBus,i,g);this._plugins.push(d);let p=[];h!==document.documentElement&&p.push(h);const w=h.querySelectorAll(`[data-vel-plugin=${d.pluginName}]`);p=[...p,...w];const v=p.filter(y=>{if(this._isElementIgnored(y))return!1;if(!y.parentElement)return!0;const P=this._getPluginNameForElement(y.parentElement);return!(P&&P.length>0)});return v.length&&v.forEach(y=>{const P=y.dataset.velView;if(!P)return;const E=this._createNewView(y,P,d);d.notifyAboutViewAdded(E)}),d});if(o&&o.length>0)return o[0];const l=rt(t,this,e,this._appEventBus,i);return t.scope||console.log(`%c WARNING: The plugin "${l.pluginName}" is created but there are no elements using it on the page`,"background: #885500"),l}updatePlugin(t,e,i={}){return this.createPlugin(t,e,i,!0)}getViews(){return this._views}createView(t,e,i){const s=new Ie(t,e,this,i);return this._views.push(s),this._viewsCreatedInPreviousFrame.push(s),s}_isElementIgnored(t){return t.closest("[data-vel-ignore]")}assignViewToPlugin(t,e){this._viewsPerPlugin.has(e.id)||this._viewsPerPlugin.set(e.id,[]);const i=this._viewsPerPlugin.get(e.id);i.includes(t.id)||i.push(t.id)}getViewsForPlugin(t){const e=this._viewsPerPlugin.get(t.id);return e?e.map(i=>this._views.find(s=>s.id===i)).filter(i=>!!i):[]}getViewsByNameForPlugin(t,e){return this.getViewsForPlugin(t).filter(i=>i.name===e)}}class Nt{constructor(t){a(this,"pluginApi"),this.pluginApi=t.pluginApi}}class St{constructor(t){a(this,"pluginApi"),this.pluginApi=t.pluginApi}}class mt{constructor(){a(this,"previousTime",0),a(this,"registry"),a(this,"eventBus"),a(this,"appEventBus"),this.eventBus=new st,this.appEventBus=new st,this.registry=new Ce(this.appEventBus,this.eventBus),new Ut(this.eventBus)}static create(){return new mt}addPlugin(t,e={}){this.registry.hasPlugin(t)||this.registry.createPlugin(t,this.eventBus,e)}updatePlugin(t,e={}){this.registry.hasPlugin(t)&&this.registry.updatePlugin(t,this.eventBus,e)}reset(t,e){this.registry.reset(t,e)}destroy(t,e){this.registry.destroy(t,e)}getPlugin(t,e){let i=typeof t=="string"?t:t.pluginName;const s=this.registry.getPluginByName(i,e);if(!s)throw new Error(`You can't call getPlugin for ${i} with key: ${e} because it does not exist in your app`);return s.api}getPlugins(t,e){let i=typeof t=="string"?t:t.pluginName;const s=this.registry.getPluginsByName(i,e);if(s.length===0)throw new Error(`You can't call getPlugins for ${i} with key: ${e} because they don't exist in your app`);return s.map(n=>n.api)}onPluginEvent(t,e,i,s){requestAnimationFrame(()=>{const n=this.registry.getPluginByName(t.pluginName,s);n&&n.on(e,i)})}removePluginEventListener(t,e,i){const s=this.registry.getPluginByName(t.pluginName);s&&s.removeListener(e,i)}run(){document.readyState==="loading"?document.addEventListener("DOMContentLoaded",this.start.bind(this)):this.start()}start(){this.setup(),requestAnimationFrame(this.tick.bind(this))}setup(){this.listenToNativeEvents(),this.subscribeToEvents()}listenToNativeEvents(){document.addEventListener("click",t=>{this.eventBus.emitEvent(yt,{x:t.clientX,y:t.clientY,target:t.target})}),document.addEventListener("pointermove",t=>{this.eventBus.emitEvent(Q,{x:t.clientX,y:t.clientY,target:t.target})}),document.addEventListener("pointerdown",t=>{this.eventBus.emitEvent(tt,{x:t.clientX,y:t.clientY,target:t.target})}),document.addEventListener("pointerup",t=>{this.eventBus.emitEvent(et,{x:t.clientX,y:t.clientY,target:t.target})})}tick(t){let e=(t-this.previousTime)/1e3;e>.016&&(e=1/60),this.previousTime=t,this.eventBus.reset(),this.subscribeToEvents(),this.read(),this.update(t,e),this.render(),requestAnimationFrame(this.tick.bind(this))}subscribeToEvents(){this.eventBus.subscribeToEvent(j,this.onNodeAdded.bind(this)),this.eventBus.subscribeToEvent(it,this.onNodeRemoved.bind(this)),this.eventBus.subscribeToEvent(Vt,this.onDataChanged.bind(this)),this.registry.getPlugins().forEach(t=>{t.subscribeToEvents(this.eventBus)})}onNodeAdded({node:t}){this.registry.queueNodeToBeCreated(t)}onNodeRemoved({node:t}){this.registry.queueNodeToBeRemoved(t)}onDataChanged(t){this.registry.notifyPluginAboutDataChange(t)}read(){this.registry.getViews().forEach(t=>{t.read()})}update(t,e){this.registry.update(),this.registry.getPlugins().slice().reverse().forEach(i=>{i.init()}),this.registry.getRenderablePlugins().forEach(i=>{i.update(t,e)}),this.registry.getViews().forEach(i=>{i.update(t,e)}),this.registry.getViews().forEach(i=>{i._updatePreviousRect()})}render(){this.registry.getRenderablePlugins().forEach(t=>{t.render()}),this.registry.getViews().forEach(t=>{t.render()})}}function Le(){return mt.create()}class Bt{constructor(t){a(this,"view"),a(this,"previousX"),a(this,"previousY"),a(this,"x"),a(this,"y"),a(this,"pointerX"),a(this,"pointerY"),a(this,"isDragging"),a(this,"target"),a(this,"directions",[]),a(this,"width"),a(this,"height"),a(this,"distance"),a(this,"stopped"),this.props=t,this.previousX=t.previousX,this.previousY=t.previousY,this.x=t.x,this.y=t.y,this.pointerX=t.pointerX,this.pointerY=t.pointerY,this.width=t.width,this.height=t.height,this.distance=t.distance,this.view=t.view,this.isDragging=t.isDragging,this.stopped=t.stopped,this.target=t.target,this.directions=t.directions}}class Mt extends nt{constructor(){super(...arguments),a(this,"_pointerX",0),a(this,"_pointerY",0),a(this,"_initialPointer",new u(0,0)),a(this,"_initialPointerPerView",new Map),a(this,"_pointerDownPerView",new Map),a(this,"_viewPointerPositionLog",new Map),a(this,"_stopTimer",0)}setup(){document.addEventListener("selectstart",this.onSelect.bind(this))}onSelect(t){this._isDragging&&t.preventDefault()}get _isDragging(){return Array.from(this._pointerDownPerView.values()).some(t=>!!t)}subscribeToEvents(t){t.subscribeToEvent(tt,({x:e,y:i})=>{this._initialPointer=new u(e,i),this.getViews().forEach(s=>{this._pointerDownPerView.set(s.id,s.intersects(e,i));const n=s.isLayoutTransitionEnabled?s.position.initialX:s.position.x,o=s.isLayoutTransitionEnabled?s.position.initialY:s.position.y,l=new u(e-n,i-o);this._pointerX=e,this._pointerY=i,this._initialPointerPerView.set(s.id,l)})}),t.subscribeToEvent(et,()=>{this.getViews().forEach(e=>{this._pointerDownPerView.get(e.id)&&this._initialPointerPerView.get(e.id)&&(this._pointerDownPerView.set(e.id,!1),this._emitEvent(e,[]))})}),t.subscribeToEvent(Q,({x:e,y:i})=>{this._pointerX=e,this._pointerY=i,this.getViews().forEach(s=>{if(this._pointerDownPerView.get(s.id)&&this._initialPointerPerView.get(s.id)){this._viewPointerPositionLog.has(s.id)||this._viewPointerPositionLog.set(s.id,[]);const n=new u(e,i),o=this._viewPointerPositionLog.get(s.id);o&&o.push(new u(e,i));const l=o&&o.length>=2?o[o.length-2]:n.clone(),h=this._calculateDirections(l,n);this._emitEvent(s,h),clearTimeout(this._stopTimer),this._stopTimer=setTimeout(()=>{this._emitEvent(s,h,!0)},120)}})})}_emitEvent(t,e,i=!1){const s=this._viewPointerPositionLog.get(t.id),n=s&&s.length>=2?s[s.length-2]:null,o=this._pointerX-this._initialPointerPerView.get(t.id).x,l=this._pointerY-this._initialPointerPerView.get(t.id).y,h=this._pointerX,g=this._pointerY,d=n?n.x-this._initialPointerPerView.get(t.id).x:o,p=n?n.y-this._initialPointerPerView.get(t.id).y:l,w=this._pointerY-this._initialPointer.y,v=this._pointerX-this._initialPointer.x,y=Jt(this._initialPointer,{x:this._pointerX,y:this._pointerY}),P=this._pointerDownPerView.get(t.id)===!0;P||this._viewPointerPositionLog.clear();const E={view:t,target:t.element,previousX:d,previousY:p,x:o,y:l,pointerX:h,pointerY:g,distance:y,width:v,height:w,isDragging:P,directions:e,stopped:i};this.emit(Bt,E)}_calculateDirections(t,e){const i={up:u.sub(new u(t.x,t.y-1),t),down:u.sub(new u(t.x,t.y+1),t),left:u.sub(new u(t.x-1,t.y),t),right:u.sub(new u(t.x+1,t.y),t)},s=u.sub(e,t).unitVector;return[{direction:"up",projection:s.dot(i.up)},{direction:"down",projection:s.dot(i.down)},{direction:"left",projection:s.dot(i.left)},{direction:"right",projection:s.dot(i.right)}].filter(n=>n.projection>0).map(n=>n.direction)}}a(Mt,"pluginName","DragEventPlugin");class Ne{constructor(t){a(this,"view"),a(this,"direction"),this.props=t,this.view=t.view,this.direction=t.direction}}class Se extends nt{constructor(){super(...arguments),a(this,"_viewIsPointerDownMap",new Map),a(this,"_viewPointerPositionLog",new Map),a(this,"_targetPerView",new Map)}subscribeToEvents(t){t.subscribeToEvent(tt,({x:e,y:i,target:s})=>{this.getViews().forEach(n=>{this._targetPerView.set(n.id,s),n.intersects(e,i)&&this._viewIsPointerDownMap.set(n.id,!0)})}),t.subscribeToEvent(Q,({x:e,y:i})=>{this.getViews().forEach(s=>{this._viewIsPointerDownMap.get(s.id)&&(this._viewPointerPositionLog.has(s.id)||this._viewPointerPositionLog.set(s.id,[]),this._viewPointerPositionLog.get(s.id).push(new u(e,i)))})}),t.subscribeToEvent(et,({x:e,y:i})=>{this.getViews().forEach(n=>{if(!this._viewIsPointerDownMap.get(n.id)||!this._viewPointerPositionLog.has(n.id))return;const o=new u(e,i),l=this._viewPointerPositionLog.get(n.id),h=l[l.length-2]||o.clone(),g=this._targetPerView.get(n.id),d=s(h,o);g&&n.hasElement(g)&&d.hasSwiped&&this.emit(Ne,{view:n,direction:d.direction}),this._viewPointerPositionLog.set(n.id,[]),this._viewIsPointerDownMap.set(n.id,!1)});function s(n,o){const l={up:u.sub(new u(n.x,n.y-1),n),down:u.sub(new u(n.x,n.y+1),n),left:u.sub(new u(n.x-1,n.y),n),right:u.sub(new u(n.x+1,n.y),n)},h=u.sub(o,n).unitVector,g=["up","down","left","right"],d=[h.dot(l.up),h.dot(l.down),h.dot(l.left),h.dot(l.right)],p=Math.max(...d),w=d.indexOf(p),v=g[w],y=u.sub(o,n).magnitude;return{hasSwiped:h.dot(l[v])*y>30,direction:v}}})}}a(Se,"pluginName","SwipeEventPlugin");class Be{constructor(t){a(this,"view"),this.props=t,this.view=t.view}}class Me extends nt{subscribeToEvents(t){t.subscribeToEvent(yt,({x:e,y:i,target:s})=>{this.getViews().forEach(n=>{const o=s,l=n.element===o||n.element.contains(o);n.intersects(e,i)&&l&&this.emit(Be,{view:n})})})}}a(Me,"pluginName","ClickEventPlugin");class vt{constructor(t){T(this,"data");this.data=t.data}}class Ft{constructor(t){T(this,"data");this.data=t.data}}function ft(r){return{map:new Map(r),array:Array.from(r).map(([e,i])=>({slotId:e,itemId:i})),object:Array.from(r).reduce((e,[i,s])=>(e[i]=s,e),{})}}function Fe(r){if(r.map)return{map:new Map(r.map),array:Array.from(r.map).map(([e,i])=>({slotId:e,itemId:i})),object:Array.from(r.map).reduce((e,[i,s])=>(e[i]=s,e),{})};if(r.object){const t={...r.object};return{map:new Map(Object.entries(t)),array:Object.entries(t).map(([e,i])=>({slotId:e,itemId:i})),object:t}}else{const t=[...r.array];return{map:new Map(t.map(({slotId:e,itemId:i})=>[e,i])),array:t,object:t.reduce((e,{slotId:i,itemId:s})=>(e[i]=s,e),{})}}}const B=r=>{const t=r.useEventPlugin(Mt);t.on(Bt,M);let e,i,s,n,o=new Map,l=new Map,h,g,d,p,w=!0,v,y,P,E;r.api({setEnabled(c){w=c},setData(c){const f=Fe(c);o=new Map(f.map),l=new Map(o)}});function $(){return{animation:e.data.configAnimation,continuousMode:typeof e.data.configContinuousMode<"u",manualSwap:typeof e.data.configManualSwap<"u"}}function z(){const c=$().animation;return c==="dynamic"?{animator:"dynamic",config:{}}:c==="spring"?{animator:"spring",config:{damping:.7,stiffness:.62}}:c==="none"?{animator:"instant",config:{}}:{animator:"instant",config:{}}}r.setup(()=>{e=r.getView("root"),i=r.getViews("slot"),s=r.getViews("item"),y=$().continuousMode,P=$().manualSwap,i.forEach(c=>{O(c)}),K(),l=new Map(o),requestAnimationFrame(()=>{r.emit(Ft,{data:ft(o)})})});function O(c){const f=c.getChild("item");f&&wt(f),o.set(c.element.dataset.swapySlot,f?f.element.dataset.swapyItem:null)}function wt(c){const f=z();c.styles.position="relative",c.styles.userSelect="none",c.styles.webkitUserSelect="none",c.position.setAnimator(f.animator,f.config),c.scale.setAnimator(f.animator,f.config),c.layoutTransition(!0),requestAnimationFrame(()=>{const m=c.getChild("handle");m?(t.addView(m),m.styles.touchAction="none"):(t.addView(c),c.styles.touchAction="none")})}r.onViewAdded(c=>{if(r.initialized)if(c.name==="item"){s=r.getViews("item");const f=c.getParent("slot");O(f),K(),l=new Map(o),r.emit(vt,{data:ft(o)})}else c.name==="slot"&&(i=r.getViews("slot"))});function K(){const c=z();r.getViews("root-child").forEach(m=>{m.position.setAnimator(c.animator,c.config),m.scale.setAnimator(c.animator,c.config),m.layoutTransition(!0)})}function L(){if(!v)return;if(!h||!g){const N=n.getScroll();h=v.pointerX-n.position.x+N.x,g=v.pointerY-n.position.y+N.y}(!d||!p)&&(d=n.size.width,p=n.size.height);const c=n.size.width/d,f=n.size.height/p,m=h*(c-1),x=g*(f-1);n.position.set({x:v.x-m,y:v.y-x},n.scale.x!==1||n.scale.y!==1)}function M(c){if(!w)return;n=c.view.name==="handle"?c.view.getParent("item"):c.view,E||(E=n.getParent("slot")),c.isDragging?(v=c,L(),i.forEach(m=>{var q;if(!m.intersects(c.pointerX,c.pointerY)){m!==E&&m.element.removeAttribute("data-swapy-highlighted");return}if(typeof m.element.dataset.swapyHighlighted>"u"&&(m.element.dataset.swapyHighlighted=""),!E||!c.stopped&&!y)return;const x=m.element.dataset.swapySlot,N=(q=m.getChild("item"))==null?void 0:q.element.dataset.swapyItem,D=E.element.dataset.swapySlot,W=n.element.dataset.swapyItem;if(!x||!D||!W)return;const A=new Map(o);A.set(x,W),N?A.set(D,N):A.set(D,null),V(A,l)||(P||(o=A,l=new Map(o)),E=null,r.emit(vt,{data:ft(A)}))}),s.forEach(m=>{m.styles.zIndex=m===n?"2":""})):(i.forEach(m=>{m.element.removeAttribute("data-swapy-highlighted")}),n.position.reset(),E=null,h=null,g=null,d=null,p=null,v=null),requestAnimationFrame(()=>{L()})}};B.pluginName="Swapy",B.scope="root";let C;function ke(){return C?(C.updatePlugin(B),C):(C=Le(),C.addPlugin(B),C.run(),C)}const $e={animation:"dynamic",continuousMode:!0,manualSwap:!1};function ze(r){let t=!0;const e=r.querySelectorAll("[data-swapy-slot]");return e.length===0&&(console.error("There are no slots defined in your root element:",r),t=!1),e.forEach(i=>{const s=i,n=s.dataset.swapySlot;(!n||n.length===0)&&(console.error(i,"does not contain a slotId using data-swapy-slot"),t=!1);const o=s.children;o.length>1&&(console.error("slot:",`"${n}"`,"cannot contain more than one element"),t=!1);const l=o[0];l&&(!l.dataset.swapyItem||l.dataset.swapyItem.length===0)&&(console.error("slot:",`"${n}"`,"does not contain an element with item id using data-swapy-item"),t=!1)}),t}function Oe(r,t={}){const e=Ot();return r.dataset.velPluginKey=e,r.dataset.velPlugin="Swapy",r.dataset.velView="root",r.dataset.velDataConfigAnimation=t.animation,t.continuousMode&&(r.dataset.velDataConfigContinuousMode="true"),t.manualSwap&&(r.dataset.velDataConfigManualSwap="true"),Array.from(r.querySelectorAll("[data-swapy-slot]")).forEach(l=>{l.dataset.velView="slot"}),Array.from(r.querySelectorAll("[data-swapy-item]")).forEach(l=>{l.dataset.velView="item",l.dataset.velLayoutId=l.dataset.swapyItem;const h=l.querySelector("[data-swapy-handle]");h&&(h.dataset.velView="handle")}),Array.from(r.querySelectorAll("[data-swapy-text]")).forEach(l=>{l.dataset.velLayoutPosition=""}),Array.from(r.querySelectorAll("[data-swapy-exclude]")).forEach(l=>{l.dataset.velIgnore=""}),e}function De(r){const t=Array.from(r.querySelectorAll("[data-swapy-slot]:not([data-vel-view])"));t.forEach(i=>{i.dataset.velView="slot"});const e=Array.from(r.querySelectorAll("[data-swapy-item]:not([data-vel-view]"));return e.forEach(i=>{i.dataset.velView="item",i.dataset.velLayoutId=i.dataset.swapyItem;const s=i.querySelector("[data-swapy-handle]");s&&(s.dataset.velView="handle"),Array.from(i.querySelectorAll("[data-swapy-text]")).forEach(l=>{l.dataset.velLayoutPosition=""}),Array.from(i.querySelectorAll("[data-swapy-exclude]")).forEach(l=>{l.dataset.velIgnore=""})}),e.length>0||t.length>0}function We(r,t={}){if(!r)throw new Error("Cannot create a Swapy instance because the element you provided does not exist on the page!");const e={...$e,...t},i=r;if(!ze(i))throw new Error("Cannot create a Swapy instance because your HTML structure is invalid. Fix all above errors and then try!");const s=Oe(i,e),n=new qe(i,s,e);return{onSwap(o){n.setSwapCallback(o)},enable(o){n.setEnabled(o)},destroy(){n.destroy()},setData(o){n.setData(o)}}}class qe{constructor(t,e,i){T(this,"_rootEl");T(this,"_veloxiApp");T(this,"_slotElMap");T(this,"_itemElMap");T(this,"_swapCallback");T(this,"_previousMap");this._rootEl=t,this._veloxiApp=ke(),this._slotElMap=this._createSlotElMap(),this._itemElMap=this._createItemElMap(),this._veloxiApp.onPluginEvent(B,Ft,({data:s})=>{this._previousMap=s.map},e),this._veloxiApp.onPluginEvent(B,vt,s=>{var n;this._previousMap&&V(this._previousMap,s.data.map)||(i.manualSwap||this._applyOrder(s.data.map),this._previousMap=s.data.map,(n=this._swapCallback)==null||n.call(this,s))},e),this.setupMutationObserver()}setupMutationObserver(){new MutationObserver(e=>{e.some(i=>i.type==="childList")&&De(this._rootEl)&&(this._slotElMap=this._createSlotElMap(),this._itemElMap=this._createItemElMap())}).observe(this._rootEl,{childList:!0,subtree:!0})}setData(t){this._veloxiApp.getPlugin("Swapy").setData(t)}destroy(){this._veloxiApp.destroy("Swapy")}setEnabled(t){this._veloxiApp.getPlugin("Swapy").setEnabled(t)}setSwapCallback(t){this._swapCallback=t}_applyOrder(t){Array.from(t.keys()).forEach(e=>{var o;if(t.get(e)===((o=this._previousMap)==null?void 0:o.get(e)))return;const i=t.get(e);if(!i)return;const s=this._slotElMap.get(e),n=this._itemElMap.get(i);!s||!n||(s.innerHTML="",s.appendChild(n))})}_createSlotElMap(){return Array.from(this._rootEl.querySelectorAll("[data-swapy-slot]")).reduce((t,e)=>(t.set(e.dataset.swapySlot,e),t),new Map)}_createItemElMap(){return Array.from(this._rootEl.querySelectorAll("[data-swapy-item]")).reduce((t,e)=>(t.set(e.dataset.swapyItem,e),t),new Map)}}R.createSwapy=We,Object.defineProperty(R,Symbol.toStringTag,{value:"Module"})});
diff --git a/package.json b/package.json
index b646c90..6ab3d43 100644
--- a/package.json
+++ b/package.json
@@ -2,7 +2,7 @@
   "name": "swapy",
   "author": "Taha Shashtari (taha@tahazsh.com)",
   "private": false,
-  "version": "0.1.2",
+  "version": "0.2.0",
   "type": "module",
   "main": "./dist/swapy.min.js",
   "module": "./dist/swapy.js",