reacthub-pixitweenjs 0.2.107-alpha.109 → 0.2.107-alpha.110

package/dist/index.es.js

@@ -108,7 +108,8 @@ const GsapPixieContext = React.createContext({}), Events = {
   TRANSFORMER_DRAG_START: "TRANSFORMER_DRAG_START",
   TRANSFORMER_DRAG_END: "TRANSFORMER_DRAG_END",
   REVERSE_MODE_START: "REVERSE_MODE_START",
-  REVERSE_MODE_END: "REVERSE_MODE_END"
+  REVERSE_MODE_END: "REVERSE_MODE_END",
+  FONTS_LOADED: "FONTS_LOADED"
 }, GsapPixieContextProvider = ({
   children: C
 }) => {
@@ -223,7 +224,7 @@ const GsapPixieContext = React.createContext({}), Events = {
     isDragging: !1
   }), _e = useApp(), Se = _e.screen.width, Ee = _e.screen.height, Ae = React.useMemo(() => {
     const Le = Math.min(Se, Ee) / 800;
-    return 1.5 * Le < 2 ? 2 : 1.5 * Le;
+    return 1.5 * Le < 6 ? 6 : 1.5 * Le;
   }, [Se, Ee]), Ie = 300, Te = React.useRef(0), we = React.useCallback(() => {
     V && !Z.current.isDragging && V(!0);
   }, [V]), Pe = React.useCallback(() => {
@@ -971,11 +972,11 @@ function arcToSegment(C, E, I, B, U, V, X, Y, K) {
     Le < 0 && (Le = 0);
     var De = (V === X ? -1 : 1) * _sqrt(Le), Ve = De * (I * Te / B), Xe = De * -(B * Ie / I), Ue = (C + Y) / 2, We = (E + K) / 2, je = Ue + (xe * Ve - Z * Xe), ze = We + (Z * Ve + xe * Xe), He = (Ie - Ve) / I, $e = (Te - Xe) / B, Ne = (-Ie - Ve) / I, Me = (-Te - Xe) / B, ke = He * He + $e * $e, Ge = ($e < 0 ? -1 : 1) * Math.acos(He / _sqrt(ke)), Be = (He * Me - $e * Ne < 0 ? -1 : 1) * Math.acos((He * Ne + $e * Me) / _sqrt(ke * (Ne * Ne + Me * Me)));
     isNaN(Be) && (Be = _e), !X && Be > 0 ? Be -= Se : X && Be < 0 && (Be += Se), Ge %= Se, Be %= Se;
-    var qe = Math.ceil(_abs(Be) / (Se / 4)), Ke = [], Ye = Be / qe, et = 4 / 3 * _sin(Ye / 2) / (1 + _cos(Ye / 2)), Qe = xe * I, it = Z * I, nt = Z * -B, ot = xe * B, Ze;
+    var qe = Math.ceil(_abs(Be) / (Se / 4)), Ke = [], Ye = Be / qe, tt = 4 / 3 * _sin(Ye / 2) / (1 + _cos(Ye / 2)), et = xe * I, it = Z * I, nt = Z * -B, ot = xe * B, Ze;
     for (Ze = 0; Ze < qe; Ze++)
-      U = Ge + Ze * Ye, Ie = _cos(U), Te = _sin(U), He = _cos(U += Ye), $e = _sin(U), Ke.push(Ie - et * Te, Te + et * Ie, He + et * $e, $e - et * He, He, $e);
+      U = Ge + Ze * Ye, Ie = _cos(U), Te = _sin(U), He = _cos(U += Ye), $e = _sin(U), Ke.push(Ie - tt * Te, Te + tt * Ie, He + tt * $e, $e - tt * He, He, $e);
     for (Ze = 0; Ze < Ke.length; Ze += 2)
-      Ie = Ke[Ze], Te = Ke[Ze + 1], Ke[Ze] = Ie * Qe + Te * nt + je, Ke[Ze + 1] = Ie * it + Te * ot + ze;
+      Ie = Ke[Ze], Te = Ke[Ze + 1], Ke[Ze] = Ie * et + Te * nt + je, Ke[Ze + 1] = Ie * it + Te * ot + ze;
     return Ke[Ze - 2] = Y, Ke[Ze - 1] = K, Ke;
   }
 }
@@ -1602,9 +1603,12 @@ const CYAN = [1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1, 0], inita
   scale: 1,
   rotation: 0,
   effect: Effects.Normal,
-  overlay: OverlayTypes.NONE
+  overlay: OverlayTypes.NONE,
+  fontSize: 10
 }, AbstractContainer = React.forwardRef((C, E) => {
-  const [I, B] = React.useState(!1), [U, V] = useState(!1), [X, Y] = useState(!1), [K, J] = useState(), xe = useDebounce(K, 300), Z = useRef(null), _e = useRef(null), Se = useRef(null), Ee = useRef(null), Ae = useRef(null), Ie = useRef(null), { tl: Te } = useContext(GsapPixieContext), we = useApp(), Pe = we.screen.width, Re = we.screen.height, {
+  const [I, B] = React.useState(!1), [U] = useState(!1), [V, X] = useState(!1), [Y, K] = useState(), J = useDebounce(Y, 300), xe = useRef(null), Z = useRef(null), _e = useRef(null), Se = useRef(null), Ee = useRef(null), Ae = useRef(null), Ie = useRef({
+    isDragging: !1
+  }), { tl: Te } = useContext(GsapPixieContext), we = useApp(), Pe = we.screen.width, Re = we.screen.height, {
     uniqueId: Fe,
     visible: Oe,
     startAt: Le,
@@ -1618,89 +1622,117 @@ const CYAN = [1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1, 0], inita
     isDragging: He,
     isGif: $e,
     onDoubleClick: Ne,
-    isTextEditMode: Me
+    isTextEditMode: Me,
+    handleDragFontSize: ke,
+    handleDragWordWrap: Ge
   } = C, {
-    x: ke = 0,
-    y: Ge = 0,
-    width: Be,
-    height: qe,
-    scale: Ke = [1, 1],
-    rotation: Ye = 0,
-    effect: et,
-    overlay: Qe,
-    animation: it = Animations.NONE
-  } = De, nt = useGsapEffect();
+    x: Be = 0,
+    y: qe = 0,
+    width: Ke,
+    height: Ye,
+    scale: tt = [1, 1],
+    rotation: et = 0,
+    effect: it,
+    overlay: nt,
+    animation: ot = Animations.NONE,
+    fontSize: Ze = 16
+  } = De, Je = useGsapEffect();
   useCustomEventListener(Events.COMPLETE, () => {
-    Z.current;
+    xe.current;
   }), React.useImperativeHandle(
     E,
     () => ({
       getIsTransformerDragging: () => U,
-      getIsMouseOverTransformer: () => X
+      getIsMouseOverTransformer: () => V
     }),
-    [U, X]
+    [U, V]
   ), React.useEffect(() => {
-    Z.current && B(!0);
+    xe.current && B(!0);
   }, []), React.useEffect(() => {
-    J({
-      x: ke,
-      y: Ge,
-      width: Be,
-      height: qe,
-      animation: it,
+    K({
+      x: Be,
+      y: qe,
+      width: Ke,
+      height: Ye,
+      animation: ot,
       maxX: Pe,
       maxY: Re
     });
-  }, [it, ke, Ge, Be, qe, Pe, Re]), React.useEffect(() => {
-    if (!_e.current)
+  }, [ot, Be, qe, Ke, Ye, Pe, Re]), React.useEffect(() => {
+    if (!Z.current)
       return;
-    const rt = gsap$2.context(() => {
-      if (Te.current && xe) {
-        const { x: tt, y: at, animation: ut, maxX: mt, maxY: pt } = xe || {}, yt = Te.current.progress(), gt = nt.updateEffect(
-          Z.current,
-          ut,
+    const ct = gsap$2.context(() => {
+      if (Te.current && J) {
+        const { x: ft, y: xt, animation: pt, maxX: mt, maxY: bt } = J || {}, _t = Te.current.progress(), vt = Je.updateEffect(
+          xe.current,
+          pt,
           {
             immediateRender: !1,
-            x: tt,
-            y: at,
+            x: ft,
+            y: xt,
             overwrite: !0,
             maxX: mt,
-            maxY: pt
+            maxY: bt
           }
         );
-        Ae.current && (Te.current.remove(Ae.current), Ae.current.progress(0).kill()), yt > 0.1 ? (gt.eventCallback("onComplete", () => {
-          gt.remove("onComplete"), Te.current.add(gt, Le), Ae.current = gt;
-        }), gt.play()) : (gt.progress(1), Te.current.add(gt, Le), Ae.current = gt);
+        Ee.current && (Te.current.remove(Ee.current), Ee.current.progress(0).kill()), _t > 0.1 ? (vt.eventCallback("onComplete", () => {
+          vt.remove("onComplete"), Te.current.add(vt, Le), Ee.current = vt;
+        }), vt.play()) : (vt.progress(1), Te.current.add(vt, Le), Ee.current = vt);
       } else
-        Ae.current && Ae.current.progress(0).kill();
-    }, _e.current);
+        Ee.current && Ee.current.progress(0).kill();
+    }, Z.current);
     return () => {
-      rt.revert();
+      ct.revert();
+    };
+  }, [Le, J]);
+  const st = React.useCallback(() => {
+    X(!0), je && !Ie.current.isDragging && je();
+  }, []), rt = (ct) => parseFloat(ct.toFixed(2)), Qe = React.useCallback(() => {
+    var xt, pt;
+    Ie.current.isDragging = !0;
+    const { width: ct } = xe.current, ft = {
+      x: rt(Number((xt = xe.current) == null ? void 0 : xt.scale.x)),
+      y: rt(Number((pt = xe.current) == null ? void 0 : pt.scale.y))
     };
-  }, [Le, xe]);
-  const ot = React.useCallback(() => {
-    Y(!0), je && je();
-  }, []), Ze = React.useCallback(() => {
-    V(!0);
-  }, []), Je = React.useCallback(
-    (rt) => {
-      C.onAnchorTransformationEnd && C.onAnchorTransformationEnd(rt), V(!1);
+    if (ze) {
+      if (ft.x !== 1 && ft.y !== 1 && _e.current) {
+        const mt = Ze * ft.x;
+        ke && ke(ct, mt, ft);
+      } else if (ft.x !== 1)
+        Ge && Ge(ct, ft);
+      else if (ft.y !== 1) {
+        const mt = Ze * ft.x;
+        ke && ke(ct, mt, ft);
+      }
+    }
+  }, [ze, Ze, ke, Ge]), at = React.useCallback(
+    (ct) => {
+      var Rt, At;
+      const { x: ft, y: xt, width: pt, height: mt, rotation: bt } = xe.current, _t = {
+        x: rt(Number((Rt = xe.current) == null ? void 0 : Rt.scale.x)),
+        y: rt(Number((At = xe.current) == null ? void 0 : At.scale.y))
+      };
+      let vt = Ze;
+      ze && _t.x !== 1 && _t.y !== 1 ? (vt = Ze * _t.x, ke && ke(pt, vt, _t)) : ze && _t.x !== 1 && Ge && Ge(pt, _t), C.onAnchorTransformationEnd && C.onAnchorTransformationEnd({
+        uniqueId: Fe,
+        transformation: { ...ct.transformation, fontSize: vt }
+      }), Ie.current.isDragging = !1;
     },
-    []
-  ), st = withFilters(Container$1, {
+    [ze, Fe, Ze, ke, Ge]
+  ), ht = withFilters(Container$1, {
     matrix: PIXI.filters.ColorMatrixFilter
   });
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs(Container$1, { ref: _e, children: [
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(Container$1, { ref: Z, children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(
       Container$1,
       {
-        ref: Z,
-        position: [ke, Ge],
-        pivot: [ke, Ge],
-        width: Be,
-        height: qe,
-        scale: Ke,
-        rotation: Ye,
+        ref: xe,
+        position: [Be, qe],
+        pivot: [Be, qe],
+        width: Ke,
+        height: Ye,
+        scale: tt,
+        rotation: et,
         ...!Xe && Oe && !U && !He && {
           interactive: !0,
           buttonMode: !0,
@@ -1708,31 +1740,44 @@ const CYAN = [1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1, 0], inita
           pointerover: je,
           pointerout: We
         },
-        children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Container$1, { ref: Ie, children: [
+        children: /* @__PURE__ */ jsxRuntimeExports.jsxs(Container$1, { ref: Ae, children: [
           !$e && /* @__PURE__ */ jsxRuntimeExports.jsx(
-            st,
+            ht,
             {
               scale: 1,
-              apply: ({ matrix: rt }) => {
-                et === Effects.BlackAndWhite ? rt.desaturate() : et === Effects.Sepia ? rt.sepia() : et === Effects.RetroVintage || et === Effects.NightVision ? rt.negative() : et === Effects.Normal && rt.reset();
+              apply: ({ matrix: ct }) => {
+                it === Effects.BlackAndWhite ? ct.desaturate() : it === Effects.Sepia ? ct.sepia() : it === Effects.RetroVintage || it === Effects.NightVision ? ct.negative() : it === Effects.Normal && ct.reset();
               },
               matrix: {
                 enabled: !0,
                 // @ts-ignore
                 matrix: CYAN
               },
-              children: /* @__PURE__ */ jsxRuntimeExports.jsx(Container$1, { ref: Se, children: C.children })
+              children: /* @__PURE__ */ jsxRuntimeExports.jsx(Container$1, { ref: _e, children: C.children })
             }
           ),
-          $e && /* @__PURE__ */ jsxRuntimeExports.jsx(Container$1, { ref: Se, children: C.children }),
-          !isEmpty$1(Qe) && Qe !== OverlayTypes.NONE && Qe !== OverlayTypes.NORMAL && /* @__PURE__ */ jsxRuntimeExports.jsx(
+          $e && /* @__PURE__ */ jsxRuntimeExports.jsx(Container$1, { ref: _e, children: C.children }),
+          !isEmpty$1(nt) && nt !== OverlayTypes.NONE && nt !== OverlayTypes.NORMAL && /* @__PURE__ */ jsxRuntimeExports.jsx(
             PixiOverlayTilingSprite,
             {
-              overlay: Qe,
-              width: Be,
-              height: qe,
-              x: ke,
-              y: Ge
+              overlay: nt,
+              width: Ke,
+              height: Ye,
+              x: Be,
+              y: qe
+            }
+          ),
+          /* @__PURE__ */ jsxRuntimeExports.jsx(
+            Sprite,
+            {
+              texture: PIXI.Texture.WHITE,
+              alpha: 0,
+              x: Be,
+              y: qe,
+              width: Ke,
+              height: Ye,
+              scale: tt,
+              rotation: et
             }
           )
         ] })
@@ -1741,12 +1786,12 @@ const CYAN = [1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1, 0], inita
     Ve && Oe && !Me && /* @__PURE__ */ jsxRuntimeExports.jsx(
       PixiTransformer,
       {
-        pixiTransformerRef: Ee,
-        imageRef: Z,
+        pixiTransformerRef: Se,
+        imageRef: xe,
         isMounted: I,
-        transformCommit: Je,
-        transformChange: Ze,
-        mouseoverEvent: ot,
+        transformCommit: at,
+        transformChange: Qe,
+        mouseoverEvent: st,
         uniqueId: Fe,
         isText: ze,
         onDoubleClick: Ne
@@ -2246,12 +2291,12 @@ punycode$1.exports;
     function Xe(Ge, Be) {
       var qe = Ge.split("@"), Ke = "";
       qe.length > 1 && (Ke = qe[0] + "@", Ge = qe[1]), Ge = Ge.replace(we, ".");
-      var Ye = Ge.split("."), et = Ve(Ye, Be).join(".");
-      return Ke + et;
+      var Ye = Ge.split("."), tt = Ve(Ye, Be).join(".");
+      return Ke + tt;
     }
     function Ue(Ge) {
-      for (var Be = [], qe = 0, Ke = Ge.length, Ye, et; qe < Ke; )
-        Ye = Ge.charCodeAt(qe++), Ye >= 55296 && Ye <= 56319 && qe < Ke ? (et = Ge.charCodeAt(qe++), (et & 64512) == 56320 ? Be.push(((Ye & 1023) << 10) + (et & 1023) + 65536) : (Be.push(Ye), qe--)) : Be.push(Ye);
+      for (var Be = [], qe = 0, Ke = Ge.length, Ye, tt; qe < Ke; )
+        Ye = Ge.charCodeAt(qe++), Ye >= 55296 && Ye <= 56319 && qe < Ke ? (tt = Ge.charCodeAt(qe++), (tt & 64512) == 56320 ? Be.push(((Ye & 1023) << 10) + (tt & 1023) + 65536) : (Be.push(Ye), qe--)) : Be.push(Ye);
       return Be;
     }
     function We(Ge) {
@@ -2273,30 +2318,30 @@ punycode$1.exports;
       return Fe(Ke + (Re + 1) * Ge / (Ge + Z));
     }
     function $e(Ge) {
-      var Be = [], qe = Ge.length, Ke, Ye = 0, et = Ee, Qe = Se, it, nt, ot, Ze, Je, st, rt, tt, at;
+      var Be = [], qe = Ge.length, Ke, Ye = 0, tt = Ee, et = Se, it, nt, ot, Ze, Je, st, rt, Qe, at;
       for (it = Ge.lastIndexOf(Ae), it < 0 && (it = 0), nt = 0; nt < it; ++nt)
         Ge.charCodeAt(nt) >= 128 && De("not-basic"), Be.push(Ge.charCodeAt(nt));
       for (ot = it > 0 ? it + 1 : 0; ot < qe; ) {
-        for (Ze = Ye, Je = 1, st = K; ot >= qe && De("invalid-input"), rt = je(Ge.charCodeAt(ot++)), (rt >= K || rt > Fe((Y - Ye) / Je)) && De("overflow"), Ye += rt * Je, tt = st <= Qe ? J : st >= Qe + xe ? xe : st - Qe, !(rt < tt); st += K)
-          at = K - tt, Je > Fe(Y / at) && De("overflow"), Je *= at;
-        Ke = Be.length + 1, Qe = He(Ye - Ze, Ke, Ze == 0), Fe(Ye / Ke) > Y - et && De("overflow"), et += Fe(Ye / Ke), Ye %= Ke, Be.splice(Ye++, 0, et);
+        for (Ze = Ye, Je = 1, st = K; ot >= qe && De("invalid-input"), rt = je(Ge.charCodeAt(ot++)), (rt >= K || rt > Fe((Y - Ye) / Je)) && De("overflow"), Ye += rt * Je, Qe = st <= et ? J : st >= et + xe ? xe : st - et, !(rt < Qe); st += K)
+          at = K - Qe, Je > Fe(Y / at) && De("overflow"), Je *= at;
+        Ke = Be.length + 1, et = He(Ye - Ze, Ke, Ze == 0), Fe(Ye / Ke) > Y - tt && De("overflow"), tt += Fe(Ye / Ke), Ye %= Ke, Be.splice(Ye++, 0, tt);
       }
       return We(Be);
     }
     function Ne(Ge) {
-      var Be, qe, Ke, Ye, et, Qe, it, nt, ot, Ze, Je, st = [], rt, tt, at, ut;
-      for (Ge = Ue(Ge), rt = Ge.length, Be = Ee, qe = 0, et = Se, Qe = 0; Qe < rt; ++Qe)
-        Je = Ge[Qe], Je < 128 && st.push(Oe(Je));
+      var Be, qe, Ke, Ye, tt, et, it, nt, ot, Ze, Je, st = [], rt, Qe, at, ht;
+      for (Ge = Ue(Ge), rt = Ge.length, Be = Ee, qe = 0, tt = Se, et = 0; et < rt; ++et)
+        Je = Ge[et], Je < 128 && st.push(Oe(Je));
       for (Ke = Ye = st.length, Ye && st.push(Ae); Ke < rt; ) {
-        for (it = Y, Qe = 0; Qe < rt; ++Qe)
-          Je = Ge[Qe], Je >= Be && Je < it && (it = Je);
-        for (tt = Ke + 1, it - Be > Fe((Y - qe) / tt) && De("overflow"), qe += (it - Be) * tt, Be = it, Qe = 0; Qe < rt; ++Qe)
-          if (Je = Ge[Qe], Je < Be && ++qe > Y && De("overflow"), Je == Be) {
-            for (nt = qe, ot = K; Ze = ot <= et ? J : ot >= et + xe ? xe : ot - et, !(nt < Ze); ot += K)
-              ut = nt - Ze, at = K - Ze, st.push(
-                Oe(ze(Ze + ut % at, 0))
-              ), nt = Fe(ut / at);
-            st.push(Oe(ze(nt, 0))), et = He(qe, tt, Ke == Ye), qe = 0, ++Ke;
+        for (it = Y, et = 0; et < rt; ++et)
+          Je = Ge[et], Je >= Be && Je < it && (it = Je);
+        for (Qe = Ke + 1, it - Be > Fe((Y - qe) / Qe) && De("overflow"), qe += (it - Be) * Qe, Be = it, et = 0; et < rt; ++et)
+          if (Je = Ge[et], Je < Be && ++qe > Y && De("overflow"), Je == Be) {
+            for (nt = qe, ot = K; Ze = ot <= tt ? J : ot >= tt + xe ? xe : ot - tt, !(nt < Ze); ot += K)
+              ht = nt - Ze, at = K - Ze, st.push(
+                Oe(ze(Ze + ht % at, 0))
+              ), nt = Fe(ht / at);
+            st.push(Oe(ze(nt, 0))), tt = He(qe, Qe, Ke == Ye), qe = 0, ++Ke;
           }
         ++qe, ++Be;
       }
@@ -12472,10 +12517,10 @@ function buildNonNativeLine(C, E) {
       xe.push(Pe - Le * je, Re - De * je, Pe + Le * ze, Re + De * ze), qe >= 0 && (V.join === LINE_JOIN.ROUND ? _e += round(Pe, Re, Pe - Le * je, Re - De * je, Pe - Ve * je, Re - Xe * je, xe, !1) + 4 : _e += 2, xe.push(Pe - Ve * ze, Re - Xe * ze, Pe + Ve * je, Re + Xe * je));
       continue;
     }
-    const et = (-Le + Te) * (-De + Re) - (-Le + Pe) * (-De + we), Qe = (-Ve + Fe) * (-Xe + Re) - (-Ve + Pe) * (-Xe + Oe), it = (Me * Qe - Ge * et) / Ke, nt = (Be * et - ke * Qe) / Ke, ot = (it - Pe) * (it - Pe) + (nt - Re) * (nt - Re), Ze = Pe + (it - Pe) * je, Je = Re + (nt - Re) * je, st = Pe - (it - Pe) * ze, rt = Re - (nt - Re) * ze, tt = Math.min(Me * Me + ke * ke, Ge * Ge + Be * Be), at = Ye ? je : ze, ut = tt + at * at * Ae, mt = ot <= ut;
-    let pt = V.join;
-    if (pt === LINE_JOIN.MITER && ot / Ae > Ie && (pt = LINE_JOIN.BEVEL), mt)
-      switch (pt) {
+    const tt = (-Le + Te) * (-De + Re) - (-Le + Pe) * (-De + we), et = (-Ve + Fe) * (-Xe + Re) - (-Ve + Pe) * (-Xe + Oe), it = (Me * et - Ge * tt) / Ke, nt = (Be * tt - ke * et) / Ke, ot = (it - Pe) * (it - Pe) + (nt - Re) * (nt - Re), Ze = Pe + (it - Pe) * je, Je = Re + (nt - Re) * je, st = Pe - (it - Pe) * ze, rt = Re - (nt - Re) * ze, Qe = Math.min(Me * Me + ke * ke, Ge * Ge + Be * Be), at = Ye ? je : ze, ht = Qe + at * at * Ae, ct = ot <= ht;
+    let ft = V.join;
+    if (ft === LINE_JOIN.MITER && ot / Ae > Ie && (ft = LINE_JOIN.BEVEL), ct)
+      switch (ft) {
         case LINE_JOIN.MITER: {
           xe.push(Ze, Je, st, rt);
           break;
@@ -12490,7 +12535,7 @@ function buildNonNativeLine(C, E) {
         }
       }
     else {
-      switch (xe.push(Pe - Le * je, Re - De * je, Pe + Le * ze, Re + De * ze), pt) {
+      switch (xe.push(Pe - Le * je, Re - De * je, Pe + Le * ze, Re + De * ze), ft) {
         case LINE_JOIN.MITER: {
           Ye ? xe.push(st, rt, st, rt) : xe.push(Ze, Je, Ze, Je), _e += 2;
           break;
@@ -17076,51 +17121,51 @@ class AudioMotionAnalyzer {
       return;
     }
     const { _ansiBands: I, _barSpace: B, canvas: U, _chLayout: V, _maxFreq: X, _minFreq: Y, _mirror: K, _mode: J, _radial: xe, _reflexRatio: Z } = this, _e = U.width >> 1, Se = U.height >> 1, Ee = V == CHANNEL_VERTICAL && !xe, Ae = V == CHANNEL_HORIZONTAL, Ie = J % 10 != 0, Te = Ie && this._frequencyScale == SCALE_LOG, we = this._showLeds && Ie && !xe, Pe = this._lumiBars && Ie && !xe, Re = this._alphaBars && !Pe && J != MODE_GRAPH, Fe = this._outlineBars && Ie && !Pe && !we, Oe = this._roundBars && Ie && !Pe && !we, Le = V != CHANNEL_VERTICAL || Z > 0 && !Pe, De = U.height - (Ee && !we ? 0.5 : 0) >> Ee, Ve = De * (Pe || xe ? 1 : 1 - Z) | 0, Xe = U.width - _e * (Ae || K != 0), Ue = Ee ? U.height - De * 2 : 0, We = _e * (K == -1 && !Ae && !xe), je = Math.min(U.width, U.height) * (V == CHANNEL_VERTICAL ? 0.375 : 0.125) | 0, ze = Math.min(_e, Se), He = (Ye) => E.push({ ...Ye, peak: [0, 0], hold: [0], value: [0] }), $e = (Ye) => {
-      const et = this._freqToBin(Ye, "floor"), Qe = this._binToFreq(et), it = this._binToFreq(et + 1), nt = Math.log2(Ye / Qe) / Math.log2(it / Qe);
-      return [et, nt];
+      const tt = this._freqToBin(Ye, "floor"), et = this._binToFreq(tt), it = this._binToFreq(tt + 1), nt = Math.log2(Ye / et) / Math.log2(it / et);
+      return [tt, nt];
     };
     let Ne, Me, ke;
     if (Te) {
-      const Ye = (st, rt, tt) => +st.toPrecision(tt ? Math.max(rt, 1 + Math.log10(st) | 0) : rt), et = (st) => {
-        const rt = [1, 1.12, 1.25, 1.4, 1.6, 1.8, 2, 2.24, 2.5, 2.8, 3.15, 3.55, 4, 4.5, 5, 5.6, 6.3, 7.1, 8, 9, 10], tt = Math.log10(st) | 0, at = st / 10 ** tt;
-        let ut = 1;
-        for (; ut < rt.length && at > rt[ut]; )
-          ut++;
-        return at - rt[ut - 1] < rt[ut] - at && ut--, (rt[ut] * 10 ** (tt + 5) | 0) / 1e5;
-      }, Qe = [0, 24, 12, 8, 6, 4, 3, 2, 1][J], it = I ? 10 ** (3 / (Qe * 10)) : 2 ** (1 / Qe), nt = it ** 0.5;
-      let ot = I ? 7.94328235 / (Qe % 2 ? 1 : nt) : C_1;
+      const Ye = (st, rt, Qe) => +st.toPrecision(Qe ? Math.max(rt, 1 + Math.log10(st) | 0) : rt), tt = (st) => {
+        const rt = [1, 1.12, 1.25, 1.4, 1.6, 1.8, 2, 2.24, 2.5, 2.8, 3.15, 3.55, 4, 4.5, 5, 5.6, 6.3, 7.1, 8, 9, 10], Qe = Math.log10(st) | 0, at = st / 10 ** Qe;
+        let ht = 1;
+        for (; ht < rt.length && at > rt[ht]; )
+          ht++;
+        return at - rt[ht - 1] < rt[ht] - at && ht--, (rt[ht] * 10 ** (Qe + 5) | 0) / 1e5;
+      }, et = [0, 24, 12, 8, 6, 4, 3, 2, 1][J], it = I ? 10 ** (3 / (et * 10)) : 2 ** (1 / et), nt = it ** 0.5;
+      let ot = I ? 7.94328235 / (et % 2 ? 1 : nt) : C_1;
       do {
         let st = ot;
-        const rt = Ye(st / nt, 4, !0), tt = Ye(st * nt, 4, !0), [at, ut] = $e(rt), [mt, pt] = $e(tt);
-        I ? st = Qe < 4 ? et(st) : Ye(st, st.toString()[0] < 5 ? 3 : 2) : st = Ye(st, 4, !0), st >= Y && He({ posX: 0, freq: st, freqLo: rt, freqHi: tt, binLo: at, binHi: mt, ratioLo: ut, ratioHi: pt }), ot *= it;
+        const rt = Ye(st / nt, 4, !0), Qe = Ye(st * nt, 4, !0), [at, ht] = $e(rt), [ct, ft] = $e(Qe);
+        I ? st = et < 4 ? tt(st) : Ye(st, st.toString()[0] < 5 ? 3 : 2) : st = Ye(st, 4, !0), st >= Y && He({ posX: 0, freq: st, freqLo: rt, freqHi: Qe, binLo: at, binHi: ct, ratioLo: ht, ratioHi: ft }), ot *= it;
       } while (ot <= X);
       Ne = Xe / E.length, E.forEach((st, rt) => st.posX = We + rt * Ne);
       const Ze = E[0], Je = E[E.length - 1];
       Me = this._freqScaling(Ze.freqLo), ke = Xe / (this._freqScaling(Je.freqHi) - Me), Ze.freqLo < Y && (Ze.freqLo = Y, [Ze.binLo, Ze.ratioLo] = $e(Y)), Je.freqHi > X && (Je.freqHi = X, [Je.binHi, Je.ratioHi] = $e(X));
     } else if (Ie) {
-      const Ye = [0, 24, 12, 8, 6, 4, 3, 2, 1][J] * 10, et = (Qe) => {
+      const Ye = [0, 24, 12, 8, 6, 4, 3, 2, 1][J] * 10, tt = (et) => {
         switch (this._frequencyScale) {
           case SCALE_BARK:
-            return 1960 / (26.81 / (Qe + 0.53) - 1);
+            return 1960 / (26.81 / (et + 0.53) - 1);
           case SCALE_MEL:
-            return 700 * (2 ** Qe - 1);
+            return 700 * (2 ** et - 1);
           case SCALE_LINEAR:
-            return Qe;
+            return et;
         }
       };
       Ne = Xe / Ye, Me = this._freqScaling(Y), ke = Xe / (this._freqScaling(X) - Me);
-      for (let Qe = 0, it = 0; Qe < Ye; Qe++, it += Ne) {
-        const nt = et(Me + it / ke), ot = et(Me + (it + Ne / 2) / ke), Ze = et(Me + (it + Ne) / ke), [Je, st] = $e(nt), [rt, tt] = $e(Ze);
-        He({ posX: We + it, freq: ot, freqLo: nt, freqHi: Ze, binLo: Je, binHi: rt, ratioLo: st, ratioHi: tt });
+      for (let et = 0, it = 0; et < Ye; et++, it += Ne) {
+        const nt = tt(Me + it / ke), ot = tt(Me + (it + Ne / 2) / ke), Ze = tt(Me + (it + Ne) / ke), [Je, st] = $e(nt), [rt, Qe] = $e(Ze);
+        He({ posX: We + it, freq: ot, freqLo: nt, freqHi: Ze, binLo: Je, binHi: rt, ratioLo: st, ratioHi: Qe });
       }
     } else {
       Ne = 1, Me = this._freqScaling(Y), ke = Xe / (this._freqScaling(X) - Me);
-      const Ye = this._freqToBin(Y, "floor"), et = this._freqToBin(X);
-      let Qe = -999;
-      for (let it = Ye; it <= et; it++) {
+      const Ye = this._freqToBin(Y, "floor"), tt = this._freqToBin(X);
+      let et = -999;
+      for (let it = Ye; it <= tt; it++) {
         const nt = this._binToFreq(it), ot = We + Math.round(ke * (this._freqScaling(nt) - Me));
-        if (ot > Qe)
-          He({ posX: ot, freq: nt, freqLo: nt, freqHi: nt, binLo: it, binHi: it, ratioLo: 0, ratioHi: 0 }), Qe = ot;
+        if (ot > et)
+          He({ posX: ot, freq: nt, freqLo: nt, freqHi: nt, binLo: it, binHi: it, ratioLo: 0, ratioHi: 0 }), et = ot;
         else if (E.length) {
           const Ze = E[E.length - 1];
           Ze.binHi = it, Ze.freqHi = nt, Ze.freq = (Ze.freqLo * nt) ** 0.5;
@@ -17129,7 +17174,7 @@ class AudioMotionAnalyzer {
     }
     let Ge = 0, Be = 0;
     if (we) {
-      const Ye = this._pixelRatio / (window.devicePixelRatio > 1 && window.screen.height <= 540 ? 2 : 1), et = [
+      const Ye = this._pixelRatio / (window.devicePixelRatio > 1 && window.screen.height <= 540 ? 2 : 1), tt = [
         [],
         [128, 3, 0.45],
         // mode 1
@@ -17147,9 +17192,9 @@ class AudioMotionAnalyzer {
         // mode 7
         [24, 16, 0.125]
         // mode 8
-      ], Qe = this._ledParams, [it, nt, ot] = Qe || et[J];
+      ], et = this._ledParams, [it, nt, ot] = et || tt[J];
       let Ze, Je = Ve;
-      if (Qe) {
+      if (et) {
         const st = 2 * Ye;
         let rt;
         Ze = it + 1;
@@ -17160,7 +17205,7 @@ class AudioMotionAnalyzer {
         const st = 540 / nt;
         Be = Math.min(nt * Ye, Math.max(2, Je / st + 0.1 | 0));
       }
-      Le && (Je += Be), Qe || (Ze = Math.min(it, Je / (Be * 2) | 0)), Ge = ot >= 1 ? ot : Ne * ot, this._leds = [
+      Le && (Je += Be), et || (Ze = Math.min(it, Je / (Be * 2) | 0)), Ge = ot >= 1 ? ot : Ne * ot, this._leds = [
         Ze,
         Ge,
         Be,
@@ -17169,14 +17214,14 @@ class AudioMotionAnalyzer {
       ];
     }
     const qe = Math.min(Ne - 1, B * (B > 0 && B < 1 ? Ne : 1));
-    Ie && (Ne -= Math.max(we ? Ge : 0, qe)), E.forEach((Ye, et) => {
-      let Qe = Ye.posX, it = Ne;
-      Ie && (B == 0 && !we ? (Qe |= 0, it |= 0, et > 0 && Qe > E[et - 1].posX + E[et - 1].width && (Qe--, it++)) : Qe += Math.max(we ? Ge : 0, qe) / 2, Ye.posX = Qe), Ye.barCenter = Qe + (Ne == 1 ? 0 : it / 2), Ye.width = it;
+    Ie && (Ne -= Math.max(we ? Ge : 0, qe)), E.forEach((Ye, tt) => {
+      let et = Ye.posX, it = Ne;
+      Ie && (B == 0 && !we ? (et |= 0, it |= 0, tt > 0 && et > E[tt - 1].posX + E[tt - 1].width && (et--, it++)) : et += Math.max(we ? Ge : 0, qe) / 2, Ye.posX = et), Ye.barCenter = et + (Ne == 1 ? 0 : it / 2), Ye.width = it;
     });
     const Ke = [];
     for (const Ye of [0, 1]) {
-      const et = V == CHANNEL_VERTICAL ? (De + Ue) * Ye : 0, Qe = et + De, it = et + Ve - (!we || Le ? 0 : Be);
-      Ke.push({ channelTop: et, channelBottom: Qe, analyzerBottom: it });
+      const tt = V == CHANNEL_VERTICAL ? (De + Ue) * Ye : 0, et = tt + De, it = tt + Ve - (!we || Le ? 0 : Be);
+      Ke.push({ channelTop: tt, channelBottom: et, analyzerBottom: it });
     }
     this._aux = { analyzerHeight: Ve, analyzerWidth: Xe, centerX: _e, centerY: Se, channelCoords: Ke, channelHeight: De, channelGap: Ue, initialX: We, innerRadius: je, outerRadius: ze, scaleMin: Me, unitWidth: ke }, this._flg = { isAlpha: Re, isBands: Ie, isLeds: we, isLumi: Pe, isOctaves: Te, isOutline: Fe, isRound: Oe, noLedGap: Le }, this._createScales();
   }
@@ -17267,195 +17312,195 @@ class AudioMotionAnalyzer {
       _radial: qe,
       showBgColor: Ke,
       showPeaks: Ye,
-      useCanvas: et,
-      _weightingFilter: Qe
-    } = this, it = this._scaleX.canvas, nt = this._scaleR.canvas, ot = ze >> 1, Ze = Ve == CHANNEL_COMBINED, Je = Ve == CHANNEL_HORIZONTAL, st = Ve == CHANNEL_VERTICAL, rt = Ve == CHANNEL_SINGLE, tt = Y && this._trueLeds && Xe == COLOR_GRADIENT, at = qe ? Le.width : this._aux.analyzerWidth, ut = Pe + at, mt = Ye && this._peakLine && Ge == MODE_GRAPH, pt = qe ? Fe - Re : Se, [yt, gt, _t, Pt] = this._leds || [];
+      useCanvas: tt,
+      _weightingFilter: et
+    } = this, it = this._scaleX.canvas, nt = this._scaleR.canvas, ot = ze >> 1, Ze = Ve == CHANNEL_COMBINED, Je = Ve == CHANNEL_HORIZONTAL, st = Ve == CHANNEL_VERTICAL, rt = Ve == CHANNEL_SINGLE, Qe = Y && this._trueLeds && Xe == COLOR_GRADIENT, at = qe ? Le.width : this._aux.analyzerWidth, ht = Pe + at, ct = Ye && this._peakLine && Ge == MODE_GRAPH, ft = qe ? Fe - Re : Se, [xt, pt, mt, bt] = this._leds || [];
     We.val > 0 && (this._spinAngle += this._spinSpeed * TAU / (60 * ze));
-    const Rt = (lt) => {
+    const _t = (lt) => {
       if (this._reflexRatio > 0 && !K && !qe) {
-        let dt, $t;
-        this.reflexFit || st ? (dt = st && lt == 0 ? Te + we : 0, $t = Te - Se) : (dt = Le.height - Se * 2, $t = Se), Ue.save(), Ue.globalAlpha = this.reflexAlpha, this.reflexBright != 1 && (Ue.filter = `brightness(${this.reflexBright})`), Ue.setTransform(1, 0, 0, -1, 0, Le.height), Ue.drawImage(Le, 0, Ie[lt].channelTop, Le.width, Se, 0, dt, Le.width, $t), Ue.restore();
+        let yt, $t;
+        this.reflexFit || st ? (yt = st && lt == 0 ? Te + we : 0, $t = Te - Se) : (yt = Le.height - Se * 2, $t = Se), Ue.save(), Ue.globalAlpha = this.reflexAlpha, this.reflexBright != 1 && (Ue.filter = `brightness(${this.reflexBright})`), Ue.setTransform(1, 0, 0, -1, 0, Le.height), Ue.drawImage(Le, 0, Ie[lt].channelTop, Le.width, Se, 0, yt, Le.width, $t), Ue.restore();
       }
-    }, St = () => {
+    }, vt = () => {
       this.showScaleX && (qe ? (Ue.save(), Ue.translate(Ee, Ae), this._spinSpeed && Ue.rotate(this._spinAngle + HALF_PI), Ue.drawImage(nt, -nt.width >> 1, -nt.width >> 1), Ue.restore()) : Ue.drawImage(it, 0, Le.height - it.height));
-    }, Lt = (lt) => {
-      const dt = lt ** 2, $t = 424.36, Et = 11599.29, Qt = 25122.25, Bt = 544496.41, Nt = 148693636, zt = (Ht) => 20 * Math.log10(Ht);
-      switch (Qe) {
+    }, Rt = (lt) => {
+      const yt = lt ** 2, $t = 424.36, Ct = 11599.29, Qt = 25122.25, Bt = 544496.41, Nt = 148693636, zt = (Ht) => 20 * Math.log10(Ht);
+      switch (et) {
         case FILTER_A:
-          const Ht = Nt * dt ** 2 / ((dt + $t) * Math.sqrt((dt + Et) * (dt + Bt)) * (dt + Nt));
+          const Ht = Nt * yt ** 2 / ((yt + $t) * Math.sqrt((yt + Ct) * (yt + Bt)) * (yt + Nt));
           return 2 + zt(Ht);
         case FILTER_B:
-          const jt = Nt * dt * lt / ((dt + $t) * Math.sqrt(dt + Qt) * (dt + Nt));
+          const jt = Nt * yt * lt / ((yt + $t) * Math.sqrt(yt + Qt) * (yt + Nt));
           return 0.17 + zt(jt);
         case FILTER_C:
-          const rr = Nt * dt / ((dt + $t) * (dt + Nt));
+          const rr = Nt * yt / ((yt + $t) * (yt + Nt));
           return 0.06 + zt(rr);
         case FILTER_D:
-          const Jt = ((103791848e-2 - dt) ** 2 + 108076816e-2 * dt) / ((9837328 - dt) ** 2 + 11723776 * dt), ir = lt / 68966888496476e-18 * Math.sqrt(Jt / ((dt + 79919.29) * (dt + 1345600)));
+          const Jt = ((103791848e-2 - yt) ** 2 + 108076816e-2 * yt) / ((9837328 - yt) ** 2 + 11723776 * yt), ir = lt / 68966888496476e-18 * Math.sqrt(Jt / ((yt + 79919.29) * (yt + 1345600)));
           return zt(ir);
         case FILTER_468:
-          const er = -4737338981378384e-39 * lt ** 6 + 2043828333606125e-30 * lt ** 4 - 1363894795463638e-22 * dt + 1, Xt = 1306612257412824e-34 * lt ** 5 - 2118150887518656e-26 * lt ** 3 + 5559488023498642e-19 * lt, It = 1246332637532143e-19 * lt / Math.hypot(er, Xt);
-          return 18.2 + zt(It);
+          const er = -4737338981378384e-39 * lt ** 6 + 2043828333606125e-30 * lt ** 4 - 1363894795463638e-22 * yt + 1, Xt = 1306612257412824e-34 * lt ** 5 - 2118150887518656e-26 * lt ** 3 + 5559488023498642e-19 * lt, Mt = 1246332637532143e-19 * lt / Math.hypot(er, Xt);
+          return 18.2 + zt(Mt);
       }
       return 0;
-    }, At = (lt, dt, $t) => {
-      Ue.beginPath(), Ue.moveTo(lt, dt), Ue.lineTo(lt, $t), Ue.stroke();
-    }, kt = (lt) => {
+    }, At = (lt, yt, $t) => {
+      Ue.beginPath(), Ue.moveTo(lt, yt), Ue.lineTo(lt, $t), Ue.stroke();
+    }, Ft = (lt) => {
       if (lt && $e) {
-        const dt = Ue.globalAlpha;
-        Ue.globalAlpha = 1, Ue.stroke(), Ue.globalAlpha = dt;
+        const yt = Ue.globalAlpha;
+        Ue.globalAlpha = 1, Ue.stroke(), Ue.globalAlpha = yt;
       }
-    }, Mt = (lt) => Math.max(0, (lt * yt | 0) * (Pt + _t) - _t), qt = (lt) => {
+    }, kt = (lt) => Math.max(0, (lt * xt | 0) * (bt + mt) - mt), qt = (lt) => {
       We.val = lt, We.peak > 0 && (We.hold--, We.hold < 0 && (We.peak += We.hold / (ot * ot / 2))), lt >= We.peak && (We.peak = lt, We.hold = ot);
     };
     Be && Ue.clearRect(0, 0, Le.width, Le.height);
     let Vt = 0;
     const ar = Oe.length, or = rt ? 1 : 2;
     for (let lt = 0; lt < or; lt++) {
-      const { channelTop: dt, channelBottom: $t, analyzerBottom: Et } = Ie[lt], Qt = this._gradients[this._selectedGrads[lt]], Bt = Qt.colorStops, Nt = Bt.length, zt = !Ke || Y && !Be ? "#000" : Qt.bgColor, Ht = st && qe && lt ? -1 : 1, jt = !lt && ke == -1 || lt && ke == 1, rr = !Je || lt && ke != 1 ? 0 : at >> (lt || !jt), Jt = Je && jt ? -1 : 1, ir = () => {
-        const ht = it.height, ft = ht >> 1, ct = He ? 100 : Ne, vt = He ? 0 : Me, bt = He ? 20 : 5, wt = Se / (ct - vt), Dt = ke != -1 && (!Je || lt == 0 || ke == 1), Gt = ke != 1 && (!Je || lt != ke);
-        Ue.save(), Ue.fillStyle = SCALEY_LABEL_COLOR, Ue.font = `${ft}px ${FONT_FAMILY}`, Ue.textAlign = "right", Ue.lineWidth = 1;
-        for (let Ut = ct; Ut > vt; Ut -= bt) {
-          const Yt = dt + (ct - Ut) * wt, Tt = Ut % 2 == 0 | 0;
-          if (Tt) {
-            const Ct = Yt + ft * (Yt == dt ? 0.8 : 0.35);
-            Dt && Ue.fillText(Ut, ht * 0.85, Ct), Gt && Ue.fillText(Ut, (Je ? at : Le.width) - ht * 0.1, Ct), Ue.strokeStyle = SCALEY_LABEL_COLOR, Ue.setLineDash([2, 4]), Ue.lineDashOffset = 0;
+      const { channelTop: yt, channelBottom: $t, analyzerBottom: Ct } = Ie[lt], Qt = this._gradients[this._selectedGrads[lt]], Bt = Qt.colorStops, Nt = Bt.length, zt = !Ke || Y && !Be ? "#000" : Qt.bgColor, Ht = st && qe && lt ? -1 : 1, jt = !lt && ke == -1 || lt && ke == 1, rr = !Je || lt && ke != 1 ? 0 : at >> (lt || !jt), Jt = Je && jt ? -1 : 1, ir = () => {
+        const ut = it.height, gt = ut >> 1, dt = He ? 100 : Ne, St = He ? 0 : Me, Tt = He ? 20 : 5, It = Se / (dt - St), Dt = ke != -1 && (!Je || lt == 0 || ke == 1), Gt = ke != 1 && (!Je || lt != ke);
+        Ue.save(), Ue.fillStyle = SCALEY_LABEL_COLOR, Ue.font = `${gt}px ${FONT_FAMILY}`, Ue.textAlign = "right", Ue.lineWidth = 1;
+        for (let Ut = dt; Ut > St; Ut -= Tt) {
+          const Yt = yt + (dt - Ut) * It, Pt = Ut % 2 == 0 | 0;
+          if (Pt) {
+            const wt = Yt + gt * (Yt == yt ? 0.8 : 0.35);
+            Dt && Ue.fillText(Ut, ut * 0.85, wt), Gt && Ue.fillText(Ut, (Je ? at : Le.width) - ut * 0.1, wt), Ue.strokeStyle = SCALEY_LABEL_COLOR, Ue.setLineDash([2, 4]), Ue.lineDashOffset = 0;
           } else
             Ue.strokeStyle = SCALEY_MIDLINE_COLOR, Ue.setLineDash([2, 8]), Ue.lineDashOffset = 1;
-          Ue.beginPath(), Ue.moveTo(Pe + ht * Tt * Dt, ~~Yt + 0.5), Ue.lineTo(ut - ht * Tt * Gt, ~~Yt + 0.5), Ue.stroke();
+          Ue.beginPath(), Ue.moveTo(Pe + ut * Pt * Dt, ~~Yt + 0.5), Ue.lineTo(ht - ut * Pt * Gt, ~~Yt + 0.5), Ue.stroke();
         }
         Ue.restore();
-      }, er = (ht, ft) => {
-        const ct = Ot[ht] + (ht < Ot.length - 1 ? (Ot[ht + 1] - Ot[ht]) * ft : 0);
-        return isNaN(ct) ? -1 / 0 : ct;
-      }, Xt = (ht, ft = Jt) => ft * TAU * ((ht + rr) / Le.width) + this._spinAngle, It = (ht, ft, ct) => {
-        const vt = Re + ft * Ht, bt = Xt(ht, ct);
-        return [Ee + vt * Math.cos(bt), Ae + vt * Math.sin(bt)];
-      }, sr = (ht, ft, ct, vt, bt) => {
+      }, er = (ut, gt) => {
+        const dt = Lt[ut] + (ut < Lt.length - 1 ? (Lt[ut + 1] - Lt[ut]) * gt : 0);
+        return isNaN(dt) ? -1 / 0 : dt;
+      }, Xt = (ut, gt = Jt) => gt * TAU * ((ut + rr) / Le.width) + this._spinAngle, Mt = (ut, gt, dt) => {
+        const St = Re + gt * Ht, Tt = Xt(ut, dt);
+        return [Ee + St * Math.cos(Tt), Ae + St * Math.sin(Tt)];
+      }, sr = (ut, gt, dt, St, Tt) => {
         Ue.beginPath();
-        for (const wt of ke && !Je ? [1, -1] : [Jt]) {
-          const [Dt, Gt] = Z ? [Xt(ht, wt), Xt(ht + ct, wt)] : [];
-          Ue.moveTo(...It(ht, ft, wt)), Ue.lineTo(...It(ht, ft + vt, wt)), Z ? Ue.arc(Ee, Ae, Re + (ft + vt) * Ht, Dt, Gt, wt != 1) : Ue.lineTo(...It(ht + ct, ft + vt, wt)), Ue.lineTo(...It(ht + ct, ft, wt)), Z && !bt && Ue.arc(Ee, Ae, Re + ft * Ht, Gt, Dt, wt == 1);
-        }
-        kt(bt), Ue.fill();
-      }, nr = (ht = 0, ft = 0) => {
-        let ct;
-        if (Xe == COLOR_GRADIENT && !tt || Ge == MODE_GRAPH)
-          ct = De[lt];
+        for (const It of ke && !Je ? [1, -1] : [Jt]) {
+          const [Dt, Gt] = Z ? [Xt(ut, It), Xt(ut + dt, It)] : [];
+          Ue.moveTo(...Mt(ut, gt, It)), Ue.lineTo(...Mt(ut, gt + St, It)), Z ? Ue.arc(Ee, Ae, Re + (gt + St) * Ht, Dt, Gt, It != 1) : Ue.lineTo(...Mt(ut + dt, gt + St, It)), Ue.lineTo(...Mt(ut + dt, gt, It)), Z && !Tt && Ue.arc(Ee, Ae, Re + gt * Ht, Gt, Dt, It == 1);
+        }
+        Ft(Tt), Ue.fill();
+      }, nr = (ut = 0, gt = 0) => {
+        let dt;
+        if (Xe == COLOR_GRADIENT && !Qe || Ge == MODE_GRAPH)
+          dt = De[lt];
         else {
-          const vt = Xe == COLOR_BAR_INDEX ? ft % Nt : Bt.findLastIndex((bt) => Y ? Mt(ht) <= Mt(bt.level) : ht <= bt.level);
-          ct = Bt[vt].color;
+          const St = Xe == COLOR_BAR_INDEX ? gt % Nt : Bt.findLastIndex((Tt) => Y ? kt(ut) <= kt(Tt.level) : ut <= Tt.level);
+          dt = Bt[St].color;
         }
-        Ue.fillStyle = Ue.strokeStyle = ct;
+        Ue.fillStyle = Ue.strokeStyle = dt;
       };
-      if (et) {
+      if (tt) {
         if (Je && !qe) {
-          const ht = at * (lt + jt), ft = jt ? -1 : 1;
-          Ue.setTransform(ft, 0, 0, 1, ht, 0);
+          const ut = at * (lt + jt), gt = jt ? -1 : 1;
+          Ue.setTransform(gt, 0, 0, 1, ut, 0);
         }
-        if ((!Be || Ke) && (Be && (Ue.globalAlpha = this.bgAlpha), Ue.fillStyle = zt, (lt == 0 || !qe && !Ze) && Ue.fillRect(Pe, dt - we, at, (Be && this.reflexAlpha == 1 ? Se : Te) + we), Ue.globalAlpha = 1), this.showScaleY && !K && !qe && (lt == 0 || !Ze) && ir(), Y ? (Ue.setLineDash([Pt, _t]), Ue.lineWidth = Oe[0].width) : Ue.lineWidth = xe ? Math.min($e, Oe[0].width / 2) : $e, Ue.save(), !qe) {
-          const ht = new Path2D();
-          ht.rect(0, dt, Le.width, Se), Ue.clip(ht);
+        if ((!Be || Ke) && (Be && (Ue.globalAlpha = this.bgAlpha), Ue.fillStyle = zt, (lt == 0 || !qe && !Ze) && Ue.fillRect(Pe, yt - we, at, (Be && this.reflexAlpha == 1 ? Se : Te) + we), Ue.globalAlpha = 1), this.showScaleY && !K && !qe && (lt == 0 || !Ze) && ir(), Y ? (Ue.setLineDash([bt, mt]), Ue.lineWidth = Oe[0].width) : Ue.lineWidth = xe ? Math.min($e, Oe[0].width / 2) : $e, Ue.save(), !qe) {
+          const ut = new Path2D();
+          ut.rect(0, yt, Le.width, Se), Ue.clip(ut);
         }
       }
-      let Ot = this._fftData[lt];
-      this._analyzer[lt].getFloatFrequencyData(Ot), Qe && (Ot = Ot.map((ht, ft) => ht + Lt(this._binToFreq(ft)))), Ue.beginPath();
+      let Lt = this._fftData[lt];
+      this._analyzer[lt].getFloatFrequencyData(Lt), et && (Lt = Lt.map((ut, gt) => ut + Rt(this._binToFreq(gt)))), Ue.beginPath();
       let Zt = [];
-      for (let ht = 0; ht < ar; ht++) {
-        const ft = Oe[ht], { posX: ct, barCenter: vt, width: bt, freq: wt, binLo: Dt, binHi: Gt, ratioLo: Ut, ratioHi: Yt } = ft;
-        let Tt = Math.max(er(Dt, Ut), er(Gt, Yt));
-        for (let xt = Dt + 1; xt < Gt; xt++)
-          Ot[xt] > Tt && (Tt = Ot[xt]);
-        if (Tt = this._normalizedB(Tt), ft.value[lt] = Tt, Vt += Tt, ft.peak[lt] > 0 && (ft.hold[lt]--, ft.hold[lt] < 0 && (ft.peak[lt] += ft.hold[lt] / (ot * ot / 2))), Tt >= ft.peak[lt] && (ft.peak[lt] = Tt, ft.hold[lt] = ot), !et)
+      for (let ut = 0; ut < ar; ut++) {
+        const gt = Oe[ut], { posX: dt, barCenter: St, width: Tt, freq: It, binLo: Dt, binHi: Gt, ratioLo: Ut, ratioHi: Yt } = gt;
+        let Pt = Math.max(er(Dt, Ut), er(Gt, Yt));
+        for (let Et = Dt + 1; Et < Gt; Et++)
+          Lt[Et] > Pt && (Pt = Lt[Et]);
+        if (Pt = this._normalizedB(Pt), gt.value[lt] = Pt, Vt += Pt, gt.peak[lt] > 0 && (gt.hold[lt]--, gt.hold[lt] < 0 && (gt.peak[lt] += gt.hold[lt] / (ot * ot / 2))), Pt >= gt.peak[lt] && (gt.peak[lt] = Pt, gt.hold[lt] = ot), !tt)
           continue;
-        K || V ? Ue.globalAlpha = Tt : xe && (Ue.globalAlpha = je), nr(Tt, ht);
-        const Ct = K ? pt : Y ? Mt(Tt) : Tt * pt | 0;
+        K || V ? Ue.globalAlpha = Pt : xe && (Ue.globalAlpha = je), nr(Pt, ut);
+        const wt = K ? ft : Y ? kt(Pt) : Pt * ft | 0;
         if (Ge == MODE_GRAPH) {
-          const xt = ht ? 0 : (this._normalizedB(Ot[Oe[1].binLo]) * pt + Ct) / 2;
+          const Et = ut ? 0 : (this._normalizedB(Lt[Oe[1].binLo]) * ft + wt) / 2;
           if (qe) {
-            if (ht == 0 && (Je && Ue.moveTo(...It(0, 0)), Ue.lineTo(...It(0, ct < 0 ? xt : Ct))), ct >= 0) {
-              const Ft = [ct, Ct];
-              Ue.lineTo(...It(...Ft)), Zt.push(Ft);
+            if (ut == 0 && (Je && Ue.moveTo(...Mt(0, 0)), Ue.lineTo(...Mt(0, dt < 0 ? Et : wt))), dt >= 0) {
+              const Ot = [dt, wt];
+              Ue.lineTo(...Mt(...Ot)), Zt.push(Ot);
             }
           } else {
-            if (ht == 0)
+            if (ut == 0)
               if (ke == -1 && !Je)
-                Ue.moveTo(Pe, Et - (ct < Pe ? xt : Ct));
+                Ue.moveTo(Pe, Ct - (dt < Pe ? Et : wt));
               else {
-                const Ft = Dt ? this._normalizedB(Ot[Dt - 1]) * pt : Ct;
-                Ue.moveTo(Pe - $e, Et - Ft);
+                const Ot = Dt ? this._normalizedB(Lt[Dt - 1]) * ft : wt;
+                Ue.moveTo(Pe - $e, Ct - Ot);
               }
-            (Je || ke != -1 || ct >= Pe) && Ue.lineTo(ct, Et - Ct);
+            (Je || ke != -1 || dt >= Pe) && Ue.lineTo(dt, Ct - wt);
           }
         } else if (Y) {
           if (Ke && !Be && (lt == 0 || !Ze)) {
-            const xt = Ue.globalAlpha;
-            Ue.strokeStyle = LEDS_UNLIT_COLOR, Ue.globalAlpha = 1, At(vt, dt, Et), Ue.strokeStyle = Ue.fillStyle, Ue.globalAlpha = xt;
+            const Et = Ue.globalAlpha;
+            Ue.strokeStyle = LEDS_UNLIT_COLOR, Ue.globalAlpha = 1, At(St, yt, Ct), Ue.strokeStyle = Ue.fillStyle, Ue.globalAlpha = Et;
           }
-          if (tt) {
-            const xt = K ? 0 : Bt.findLastIndex((Wt) => Mt(Tt) <= Mt(Wt.level));
-            let Ft = Et;
-            for (let Wt = Nt - 1; Wt >= xt; Wt--) {
+          if (Qe) {
+            const Et = K ? 0 : Bt.findLastIndex((Wt) => kt(Pt) <= kt(Wt.level));
+            let Ot = Ct;
+            for (let Wt = Nt - 1; Wt >= Et; Wt--) {
               Ue.strokeStyle = Bt[Wt].color;
-              let lr = Et - (Wt == xt ? Ct : Mt(Bt[Wt].level));
-              At(vt, Ft, lr), Ft = lr - _t;
+              let lr = Ct - (Wt == Et ? wt : kt(Bt[Wt].level));
+              At(St, Ot, lr), Ot = lr - mt;
             }
           } else
-            At(vt, Et, Et - Ct);
-        } else if (ct >= Pe)
+            At(St, Ct, Ct - wt);
+        } else if (dt >= Pe)
           if (qe)
-            sr(ct, 0, bt, Ct, xe);
+            sr(dt, 0, Tt, wt, xe);
           else if (Z) {
-            const xt = bt / 2, Ft = Et + xt;
-            Ue.beginPath(), Ue.moveTo(ct, Ft), Ue.lineTo(ct, Ft - Ct), Ue.arc(vt, Ft - Ct, xt, PI, TAU), Ue.lineTo(ct + bt, Ft), kt(xe), Ue.fill();
+            const Et = Tt / 2, Ot = Ct + Et;
+            Ue.beginPath(), Ue.moveTo(dt, Ot), Ue.lineTo(dt, Ot - wt), Ue.arc(St, Ot - wt, Et, PI, TAU), Ue.lineTo(dt + Tt, Ot), Ft(xe), Ue.fill();
           } else {
-            const xt = xe ? Ue.lineWidth : 0;
-            Ue.beginPath(), Ue.rect(ct, Et + xt, bt, -Ct - xt), kt(xe), Ue.fill();
+            const Et = xe ? Ue.lineWidth : 0;
+            Ue.beginPath(), Ue.rect(dt, Ct + Et, Tt, -wt - Et), Ft(xe), Ue.fill();
           }
-        const Kt = ft.peak[lt];
-        if (Kt > 0 && Ye && !mt && !K && ct >= Pe && ct < ut)
-          if (xe && $e > 0 ? Ue.globalAlpha = 1 : V && (Ue.globalAlpha = Kt), (Xe == COLOR_BAR_LEVEL || tt) && nr(Kt), Y) {
-            const xt = Mt(Kt);
-            xt >= _t && Ue.fillRect(ct, Et - xt, bt, Pt);
+        const Kt = gt.peak[lt];
+        if (Kt > 0 && Ye && !ct && !K && dt >= Pe && dt < ht)
+          if (xe && $e > 0 ? Ue.globalAlpha = 1 : V && (Ue.globalAlpha = Kt), (Xe == COLOR_BAR_LEVEL || Qe) && nr(Kt), Y) {
+            const Et = kt(Kt);
+            Et >= mt && Ue.fillRect(dt, Ct - Et, Tt, bt);
           } else
-            qe ? Ge != MODE_GRAPH && sr(ct, Kt * pt, bt, -2) : Ue.fillRect(ct, Et - Kt * pt, bt, 2);
+            qe ? Ge != MODE_GRAPH && sr(dt, Kt * ft, Tt, -2) : Ue.fillRect(dt, Ct - Kt * ft, Tt, 2);
       }
-      if (et) {
+      if (tt) {
         if (Ue.globalAlpha = 1, Ge == MODE_GRAPH) {
           if (nr(), qe && !Je) {
             if (ke) {
-              let ht;
-              for (; ht = Zt.pop(); )
-                Ue.lineTo(...It(...ht, -1));
+              let ut;
+              for (; ut = Zt.pop(); )
+                Ue.lineTo(...Mt(...ut, -1));
             }
             Ue.closePath();
           }
           if ($e > 0 && Ue.stroke(), je > 0) {
             if (qe) {
-              const ht = Je ? Xt(at >> 1) : 0, ft = Je ? Xt(at) : TAU;
-              Ue.moveTo(...It(Je ? at >> 1 : 0, 0)), Ue.arc(Ee, Ae, Re, ht, ft, Je ? !jt : !0);
+              const ut = Je ? Xt(at >> 1) : 0, gt = Je ? Xt(at) : TAU;
+              Ue.moveTo(...Mt(Je ? at >> 1 : 0, 0)), Ue.arc(Ee, Ae, Re, ut, gt, Je ? !jt : !0);
             } else
-              Ue.lineTo(ut, Et), Ue.lineTo(Pe, Et);
+              Ue.lineTo(ht, Ct), Ue.lineTo(Pe, Ct);
             Ue.globalAlpha = je, Ue.fill(), Ue.globalAlpha = 1;
           }
-          if ((mt || qe && Ye) && (Zt = [], Ue.beginPath(), Oe.forEach((ht, ft) => {
-            let ct = ht.posX, vt = ht.peak[lt], bt = ft ? "lineTo" : "moveTo";
-            if (qe && ct < 0) {
-              const wt = Oe[ft + 1];
-              vt = findY(ct, vt, wt.posX, wt.peak[lt], 0), ct = 0;
+          if ((ct || qe && Ye) && (Zt = [], Ue.beginPath(), Oe.forEach((ut, gt) => {
+            let dt = ut.posX, St = ut.peak[lt], Tt = gt ? "lineTo" : "moveTo";
+            if (qe && dt < 0) {
+              const It = Oe[gt + 1];
+              St = findY(dt, St, It.posX, It.peak[lt], 0), dt = 0;
             }
-            vt *= pt, mt ? (Ue[bt](...qe ? It(ct, vt) : [ct, Et - vt]), qe && ke && !Je && Zt.push([ct, vt])) : vt > 0 && sr(ct, vt, 1, -2);
-          }), mt)) {
-            let ht;
-            for (; ht = Zt.pop(); )
-              Ue.lineTo(...It(...ht, -1));
+            St *= ft, ct ? (Ue[Tt](...qe ? Mt(dt, St) : [dt, Ct - St]), qe && ke && !Je && Zt.push([dt, St])) : St > 0 && sr(dt, St, 1, -2);
+          }), ct)) {
+            let ut;
+            for (; ut = Zt.pop(); )
+              Ue.lineTo(...Mt(...ut, -1));
             Ue.lineWidth = 1, Ue.stroke();
           }
         }
-        Ue.restore(), Je && !qe && Ue.setTransform(1, 0, 0, 1, 0, 0), (!Je && !Ze || lt) && Rt(lt);
+        Ue.restore(), Je && !qe && Ue.setTransform(1, 0, 0, 1, 0, 0), (!Je && !Ze || lt) && _t(lt);
       }
     }
-    if (qt(Vt / (ar << or - 1)), et && (ke && !qe && !Je && (Ue.setTransform(-1, 0, 0, 1, Le.width - Pe, 0), Ue.drawImage(Le, Pe, 0, Ee, Le.height, 0, 0, Ee, Le.height), Ue.setTransform(1, 0, 0, 1, 0, 0)), Ue.setLineDash([]), St()), this.showFPS) {
+    if (qt(Vt / (ar << or - 1)), tt && (ke && !qe && !Je && (Ue.setTransform(-1, 0, 0, 1, Le.width - Pe, 0), Ue.drawImage(Le, Pe, 0, Ee, Le.height, 0, 0, Ee, Le.height), Ue.setTransform(1, 0, 0, 1, 0, 0)), Ue.setLineDash([]), vt()), this.showFPS) {
       const lt = it.height;
       Ue.font = `bold ${lt}px ${FONT_FAMILY}`, Ue.fillStyle = FPS_COLOR, Ue.textAlign = "right", Ue.fillText(Math.round(ze), Le.width - lt, lt * 2);
     }
@@ -18663,12 +18708,12 @@ const genearate = (C) => ({
     adjustmentFilter: ke,
     vignetteFilter: Ge,
     noiseFilter: Be
-  } = withFiltersHook(Ue), { blurRadius: qe = 0, vignette: Ke = 0, noise: Ye = 0 } = Ue, et = 0.1;
+  } = withFiltersHook(Ue), { blurRadius: qe = 0, vignette: Ke = 0, noise: Ye = 0 } = Ue, tt = 0.1;
   React.useEffect(() => {
     if (!isEmpty$1(je)) {
       const Ze = map$1(je, (st) => {
-        const { data: rt, width: tt, height: at } = st, ut = new Uint8Array(rt);
-        return PIXI.Texture.fromBuffer(ut, tt, at);
+        const { data: rt, width: Qe, height: at } = st, ht = new Uint8Array(rt);
+        return PIXI.Texture.fromBuffer(ht, Qe, at);
       }).map(
         (st, rt) => ({
           texture: st,
@@ -18682,12 +18727,12 @@ const genearate = (C) => ({
       }), B(Je / 1e3), J.current.totalDuration = Je, J.current.totalFrames = je.length;
     }
   }, [Ae, je, ze]);
-  const Qe = () => {
+  const et = () => {
     Y.current && (Y.current.stop(), J.current.isPlaying = !1);
   }, it = () => {
     if (Y.current && xe.current) {
       const ot = xe.current.time();
-      let Ze = ot === 0 ? 0 : ot / et;
+      let Ze = ot === 0 ? 0 : ot / tt;
       Ze = isNaN(Ze) ? 0 : Ze;
       const Je = J.current.totalFrames;
       Ze = Ze > Je ? Je : Ze, Ze = Math.round(Ze), Ze >= Je ? (Y.current.gotoAndStop(0), J.current.isPlaying = !1) : (Y.current.currentFrame = Ze, J.current.isPlaying = !0);
@@ -18701,7 +18746,7 @@ const genearate = (C) => ({
     if (K.current && Se.current && I > 0) {
       const Ze = {
         duration: Number(I),
-        onInterrupt: Qe,
+        onInterrupt: et,
         onUpdate: it,
         onUpdateParams: [we, Pe]
       }, Je = Number(Te) - Number(Ie), st = Math.max(
@@ -18768,155 +18813,227 @@ const genearate = (C) => ({
     }
   );
 }), PixiTextSprite = React.forwardRef((C, E) => {
-  const B = useRef(null), U = useRef(0), V = useRef(null), X = useRef(null), Y = useRef(16), K = useRef(null), {
+  const B = useRef(0), U = useRef(null), V = useRef(16), X = useRef(null), Y = useRef(null), K = useApp(), {
     visible: J,
     text: xe,
     disabled: Z,
     transformation: _e,
     pointerdown: Se,
-    onDobuleClick: Ee
+    onDobuleClick: Ee,
+    uniqueId: Ae,
+    startAt: Ie,
+    endAt: Te
   } = C, {
-    x: Ae,
-    y: Ie,
+    x: we,
+    y: Pe,
     /// font
-    fontFamily: Te = "Arial",
-    fontWeight: we = "normal",
-    fontStyle: Pe = "normal",
-    fontSize: Re = 16,
-    fontVariant: Fe = "normal",
+    fontFamily: Re = "Arial",
+    fontWeight: Fe = "normal",
+    fontStyle: Oe = "normal",
+    fontSize: Le = 16,
+    fontVariant: De = "normal",
     // fill
-    fill: Oe = "black",
+    fill: Ve = "black",
     // stroke
-    stroke: Le,
-    strokeThickness: De = 0,
+    stroke: Xe,
+    strokeThickness: Ue = 0,
     // drop shadow
-    blurRadius: Ve = 0,
-    blurEnabled: Xe = !1,
-    dropShadowColor: Ue = null,
-    dropShadow: We = !1,
-    dropShadowBlur: je = 0,
+    blurRadius: We = 0,
+    blurEnabled: je = !1,
+    dropShadowColor: ze = null,
+    dropShadow: He = !1,
+    dropShadowBlur: $e = 0,
     // multiline
-    wordWrapWidth: ze = 5e7,
-    leading: He = 0,
-    letterSpacing: $e,
-    colorCorrection: Ne = {}
+    wordWrapWidth: Ne = 5e7,
+    leading: Me = 0,
+    letterSpacing: ke,
+    colorCorrection: Ge = {},
+    backgroundColor: Be = "transparent",
+    width: qe,
+    height: Ke
   } = _e, {
-    temperatureFilter: Me,
-    sharpnessFilter: ke,
-    hueFilter: Ge,
-    blurFilter: Be,
-    adjustmentFilter: qe
-  } = withFiltersHook(Ne), { blurRadius: Ke = 0 } = Ne;
-  React.useEffect(() => {
-    Y.current = Number(Re);
-  }, [Re]);
-  const Ye = ["italic", "oblique"].includes(Pe) ? Pe : void 0, et = ["small-caps"].includes(Fe), Qe = [
+    temperatureFilter: Ye,
+    sharpnessFilter: tt,
+    hueFilter: et,
+    blurFilter: it,
+    adjustmentFilter: nt
+  } = withFiltersHook(Ge), { blurRadius: ot = 0 } = Ge;
+  useCustomEventListener(Events.FONTS_LOADED, () => {
+    U.current && U.current.updateText && U.current.updateText(!0);
+  }), React.useEffect(() => {
+    V.current = Number(Le);
+  }, [Le]);
+  const Ze = ["italic", "oblique"].includes(Oe) ? Oe : void 0, Je = ["small-caps"].includes(De), st = [
     "bold",
     "bolder",
     "lighter",
     "100",
     "200",
     "300"
-  ].includes(we) ? we : void 0, it = Number($e) > 0 ? $e : void 0, nt = React.useMemo(() => new PIXI.TextStyle({
-    fontFamily: Te,
-    fontSize: Re,
-    fill: Oe || "white",
+  ].includes(Fe) ? Fe : void 0, rt = Number(ke) > 0 ? ke : void 0, Qe = Be === "transparent" ? null : PIXI.utils.string2hex(Be), at = React.useMemo(() => new PIXI.TextStyle({
+    fontFamily: Re,
+    fontSize: Le,
+    fill: Ve || "white",
     //[color, '#00ff99'], // gradient
-    ...Le && De > 0 && {
-      stroke: Le,
-      strokeThickness: De
+    ...Xe && Ue > 0 && {
+      stroke: Xe,
+      strokeThickness: Ue
     },
-    ...Ye && {
-      fontStyle: Ye
+    ...Ze && {
+      fontStyle: Ze
     },
-    ...et && {
-      fontVariant: et
+    ...Je && {
+      fontVariant: Je
     },
-    ...Qe && {
-      fontWeight: Qe
+    ...st && {
+      fontWeight: st
     },
-    ...it && { letterSpacing: it },
-    ...Xe && {
+    ...rt && { letterSpacing: rt },
+    ...je && {
       dropShadow: !0,
-      dropShadowBlur: Number(Ve),
-      dropShadowColor: (Ue == null ? void 0 : Ue.toString()) || "black",
+      dropShadowBlur: Number(We),
+      dropShadowColor: (ze == null ? void 0 : ze.toString()) || "black",
       dropShadowAngle: 0.5235987755982988,
       dropShadowDistance: 5
     },
-    ...We && {
+    ...He && {
       dropShadow: !0,
-      dropShadowBlur: Number(je),
-      dropShadowColor: (Ue == null ? void 0 : Ue.toString()) || "black",
+      dropShadowBlur: Number($e),
+      dropShadowColor: (ze == null ? void 0 : ze.toString()) || "black",
       dropShadowAngle: 0.5235987755982988,
       dropShadowDistance: 5
     },
     wordWrap: !0,
     breakWords: !0,
-    wordWrapWidth: ze || 500,
-    leading: He || 0
+    wordWrapWidth: Ne || 500,
+    leading: Me || 0
     // lineHeight: lineHeight,
   }), [
-    Xe,
+    je,
+    We,
     Ve,
-    Oe,
-    Te,
     Re,
-    Pe,
-    He,
-    Ye,
-    Qe,
-    et,
-    it,
-    Ue,
     Le,
-    De,
+    Oe,
+    Me,
+    Ze,
+    st,
+    Je,
+    rt,
     ze,
-    We,
-    je
+    Xe,
+    Ue,
+    Ne,
+    He,
+    $e
   ]);
   React.useEffect(() => {
-    K.current = {
+    X.current = {
       ..._e
     };
-  }, [_e]);
-  const ot = () => {
-    const Je = (/* @__PURE__ */ new Date()).getTime();
-    Je - U.current < 300 && Ee ? Ee() : Se && Se(), U.current = Je;
-  }, Ze = () => {
+  }, [_e]), React.useImperativeHandle(
+    E,
+    () => ({
+      setWordWrap: (pt, mt = { x: 1, y: 1 }) => {
+        if (U.current) {
+          U.current.style.wordWrapWidth = pt, U.current.dirty = !0;
+          const bt = 1 / mt.x, _t = 1 / mt.y;
+          U.current.scale.set(bt, _t), U.current.updateText(!0);
+        }
+      },
+      setFontSizeAndTransform: (pt, mt, bt = { x: 1, y: 1 }) => {
+        if (U.current) {
+          U.current.style.wordWrapWidth = pt, U.current.style.fontSize = mt, U.current.dirty = !0;
+          const _t = 1 / bt.x, vt = 1 / bt.y;
+          U.current.scale.set(_t, vt), U.current.updateText(!0);
+        }
+      },
+      resetScale: () => {
+        U.current && U.current.scale.set(1, 1);
+      }
+    }),
+    [Ae, Ie, Te]
+  );
+  const ht = React.useCallback(
+    (pt, mt = { x: 1, y: 1 }) => {
+      if (U.current) {
+        U.current.style.wordWrapWidth = pt, U.current.dirty = !0;
+        const bt = 1 / mt.x, _t = 1 / mt.y;
+        U.current.scale.set(bt, _t), U.current.updateText(!0);
+      }
+    },
+    [U.current]
+  ), ct = React.useCallback(
+    (pt, mt, bt = { x: 1, y: 1 }) => {
+      if (U.current) {
+        U.current.style.wordWrapWidth = pt, U.current.style.fontSize = mt, U.current.dirty = !0;
+        const _t = 1 / bt.x, vt = 1 / bt.y;
+        U.current.scale.set(_t, vt), U.current.updateText(!0);
+      }
+    },
+    [U.current, X.current]
+  );
+  React.useEffect(() => {
+    if (Qe === null || Qe === 0)
+      return;
+    const pt = new PIXI.Graphics();
+    pt.beginFill(Qe || 16724736), pt.drawRect(0, 0, qe, Ke), pt.endFill(), Y.current && (Y.current.texture = K.renderer.generateTexture(pt), Y.current.texture.update());
+  }, [Qe, qe, Ke]);
+  const ft = () => {
+    const pt = (/* @__PURE__ */ new Date()).getTime();
+    pt - B.current < 300 && Ee ? Ee() : Se && Se(), B.current = pt;
+  }, xt = () => {
     !Z && Ee && Ee();
   };
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs(
     AbstractContainer,
     {
       ...C,
       ref: E,
       isText: !0,
-      onDoubleClick: Ze,
-      children: /* @__PURE__ */ jsxRuntimeExports.jsx(Container$1, { ref: B, children: /* @__PURE__ */ jsxRuntimeExports.jsx(Container$1, { alpha: 1, ref: X, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-        Text,
-        {
-          style: nt,
-          x: Ae,
-          y: Ie,
-          anchor: 0.5,
-          text: xe,
-          alpha: J ? 1 : 0,
-          ...J && !Z && {
-            interactive: !0,
-            buttonMode: !0,
-            pointerdown: ot
-          },
-          ref: V,
-          filters: [
-            Me,
-            ke,
-            Ge,
-            qe,
-            // conditionally add blur filter
-            ...Ke > 0 ? [Be] : []
-          ]
-        }
-      ) }) })
+      onDoubleClick: xt,
+      handleDragWordWrap: ht,
+      handleDragFontSize: ct,
+      children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          Sprite,
+          {
+            texture: PIXI.Texture.WHITE,
+            x: we,
+            y: Pe,
+            width: qe || 100,
+            height: Ke || 100,
+            anchor: 0.5,
+            alpha: J && Qe ? 1 : 0,
+            ref: Y
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          Text,
+          {
+            style: at,
+            x: we,
+            y: Pe,
+            anchor: 0.5,
+            text: xe,
+            alpha: J ? 1 : 0,
+            ...J && !Z && {
+              interactive: !0,
+              buttonMode: !0,
+              pointerdown: ft
+            },
+            ref: U,
+            filters: [
+              Ye,
+              tt,
+              et,
+              nt,
+              // conditionally add blur filter
+              ...ot > 0 ? [it] : []
+            ]
+          }
+        )
+      ]
     }
   );
 });
@@ -19053,8 +19170,8 @@ const debounce$1 = /* @__PURE__ */ getDefaultExportFromCjs(debounce_1), useDebou
     temperatureFilter: qe,
     sharpnessFilter: Ke,
     hueFilter: Ye,
-    blurFilter: et,
-    adjustmentFilter: Qe,
+    blurFilter: tt,
+    adjustmentFilter: et,
     vignetteFilter: it,
     noiseFilter: nt
   } = withFiltersHook(De), ot = _e || "", Ze = React.useMemo(() => {
@@ -19071,8 +19188,8 @@ const debounce$1 = /* @__PURE__ */ getDefaultExportFromCjs(debounce_1), useDebou
   const Je = (at) => {
     if (Y.current) {
       if (Y.current.currentTime = Number(at), !ze.current) {
-        const ut = Y.current, mt = ut.currentTime > 0 && !ut.paused && !ut.ended && ut.readyState > ut.HAVE_CURRENT_DATA;
-        je.current && je.current.isActive() && J.current && J.current.isActive() && (mt || Y.current.play(), K.current.isPlaying = !0);
+        const ht = Y.current, ct = ht.currentTime > 0 && !ht.paused && !ht.ended && ht.readyState > ht.HAVE_CURRENT_DATA;
+        je.current && je.current.isActive() && J.current && J.current.isActive() && (ct || Y.current.play(), K.current.isPlaying = !0);
       }
       K.current.progress = 0;
     }
@@ -19082,27 +19199,27 @@ const debounce$1 = /* @__PURE__ */ getDefaultExportFromCjs(debounce_1), useDebou
       at.currentTime > 0 && !at.paused && !at.ended && at.readyState > at.HAVE_CURRENT_DATA && Y.current.pause(), K.current.isPlaying = !1, J.current && (K.current.progress = J.current.progress());
     }
   }, rt = () => {
-  }, tt = () => {
-    var at, ut;
+  }, Qe = () => {
+    var at, ht;
     if (J.current && (K.current.progress = J.current.progress()), Y.current && J.current) {
-      const mt = Ae + ((at = J == null ? void 0 : J.current) == null ? void 0 : at.time()), pt = Math.abs(
-        Y.current.currentTime - mt
-      ), yt = Y.current, gt = yt.currentTime > 0 && !yt.paused && !yt.ended && yt.readyState > yt.HAVE_CURRENT_DATA;
-      ze.current && U.current ? (Y.current.currentTime = mt, U.current.update(), K.current.isPlaying = !1) : (gt !== K.current.isPlaying || !gt) && K.current.progress > 0.01 && K.current.progress < 0.99 ? (ut = je.current) != null && ut.isActive() && J.current && J.current.isActive() && (gt || Y.current.play(), K.current.isPlaying = !0) : pt > 0.3 && K.current.progress > 0.01 && K.current.progress < 0.99 && (Y.current.currentTime = mt);
+      const ct = Ae + ((at = J == null ? void 0 : J.current) == null ? void 0 : at.time()), ft = Math.abs(
+        Y.current.currentTime - ct
+      ), xt = Y.current, pt = xt.currentTime > 0 && !xt.paused && !xt.ended && xt.readyState > xt.HAVE_CURRENT_DATA;
+      ze.current && U.current ? (Y.current.currentTime = ct, U.current.update(), K.current.isPlaying = !1) : (pt !== K.current.isPlaying || !pt) && K.current.progress > 0.01 && K.current.progress < 0.99 ? (ht = je.current) != null && ht.isActive() && J.current && J.current.isActive() && (pt || Y.current.play(), K.current.isPlaying = !0) : ft > 0.3 && K.current.progress > 0.01 && K.current.progress < 0.99 && (Y.current.currentTime = ct);
     }
   };
   return useEffect(() => {
     let at = gsap$2.context(() => {
     });
     if (X.current && je.current) {
-      const ut = {
+      const ht = {
         duration: Number(Ee) - Number(Se),
         onStart: Je,
         onComplete: st,
         onStartParams: [Ae, Ie],
         onCompleteParams: [],
         onInterrupt: rt,
-        onUpdate: tt,
+        onUpdate: Qe,
         onUpdateParams: [Ae, Ie],
         onPause: () => {
           console.log("onPause video sprite pause", xe);
@@ -19124,7 +19241,7 @@ const debounce$1 = /* @__PURE__ */ getDefaultExportFromCjs(debounce_1), useDebou
         J.current = gsap$2.to(
           X.current,
           // @ts-ignore
-          ut,
+          ht,
           Ae
         ), je.current.add(J.current, Se);
       });
@@ -19141,31 +19258,31 @@ const debounce$1 = /* @__PURE__ */ getDefaultExportFromCjs(debounce_1), useDebou
       clearTimeout(at);
     };
   }, [Z]), React.useEffect(() => {
-    const at = Math.round((Number(Ae) + Number.EPSILON) * 100) / 100, ut = function() {
+    const at = Math.round((Number(Ae) + Number.EPSILON) * 100) / 100, ht = function() {
       Y.current && (Y.current.currentTime = at, Y.current.muted = Z);
-    }, mt = function() {
+    }, ct = function() {
       K.current.isWaiting = !1, K.current.isStalled = !1;
-    }, pt = function() {
+    }, ft = function() {
       K.current.isWaiting = !0, K.current.isStalled = !1;
-    }, yt = function() {
+    }, xt = function() {
       K.current.isWaiting = !1, K.current.isStalled = !1;
-    }, gt = function() {
+    }, pt = function() {
       K.current.isWaiting = !1, K.current.isStalled = !0;
-    }, _t = Math.round((Number(Ae) + Number.EPSILON) * 100) / 100, Pt = Math.round((Number(Ie) + Number.EPSILON) * 100) / 100, Rt = `${ot}#t=${_t},${Pt}`;
-    return PIXI.Texture.fromLoader(Ze, Rt, xe, {
+    }, mt = Math.round((Number(Ae) + Number.EPSILON) * 100) / 100, bt = Math.round((Number(Ie) + Number.EPSILON) * 100) / 100, _t = `${ot}#t=${mt},${bt}`;
+    return PIXI.Texture.fromLoader(Ze, _t, xe, {
       pixiIdPrefix: xe,
       resourceOptions: {
         autoPlay: !1,
         crossorigin: "Anonymus",
         updateFPS: We ? Math.max(120, Number(We)) : 30
       }
-    }).then((St) => {
-      St && (U.current = St, B(!0), Y.current = St.baseTexture.resource.source, Y.current.id = xe, Y.current.addEventListener("loadedmetadata", ut), Y.current.addEventListener("ended", mt), Y.current.addEventListener("loadstart", pt), Y.current.addEventListener("canplaythrough", yt), Y.current.addEventListener("stalled", gt));
+    }).then((vt) => {
+      vt && (U.current = vt, B(!0), Y.current = vt.baseTexture.resource.source, Y.current.id = xe, Y.current.addEventListener("loadedmetadata", ht), Y.current.addEventListener("ended", ct), Y.current.addEventListener("loadstart", ft), Y.current.addEventListener("canplaythrough", xt), Y.current.addEventListener("stalled", pt));
     }), () => {
-      Y.current && (Y.current.pause(), Y.current.removeEventListener("loadedmetadata", ut), Y.current.removeEventListener("ended", mt), Y.current.removeEventListener("loadstart", pt), Y.current.removeEventListener(
+      Y.current && (Y.current.pause(), Y.current.removeEventListener("loadedmetadata", ht), Y.current.removeEventListener("ended", ct), Y.current.removeEventListener("loadstart", ft), Y.current.removeEventListener(
         "canplaythrough",
-        yt
-      ), Y.current.removeEventListener("stalled", gt));
+        xt
+      ), Y.current.removeEventListener("stalled", pt));
     };
   }, [ot, xe, Ae, Ie, Ze]), React.useEffect(() => {
     const at = setTimeout(() => {
@@ -19199,9 +19316,9 @@ const debounce$1 = /* @__PURE__ */ getDefaultExportFromCjs(debounce_1), useDebou
             qe,
             Ke,
             Ye,
-            Qe,
+            et,
             // conditionally add blur filter
-            ...ke > 0 ? [et] : [],
+            ...ke > 0 ? [tt] : [],
             // conditionally add vignette filter
             ...Ge > 0 ? [it] : [],
             // conditionally add noise filter
@@ -19900,16 +20017,16 @@ var lottie$1 = { exports: {} };
                     Me[ke].ty === "gr" && $e(Me[ke].it);
               }
               function Ne(Me) {
-                var ke, Ge, Be = Me.length, qe, Ke, Ye, et;
+                var ke, Ge, Be = Me.length, qe, Ke, Ye, tt;
                 for (Ge = 0; Ge < Be; Ge += 1) {
                   if (ke = Me[Ge], ke.hasMask) {
-                    var Qe = ke.masksProperties;
-                    for (Ke = Qe.length, qe = 0; qe < Ke; qe += 1)
-                      if (Qe[qe].pt.k.i)
-                        Qe[qe].pt.k.c = Qe[qe].cl;
+                    var et = ke.masksProperties;
+                    for (Ke = et.length, qe = 0; qe < Ke; qe += 1)
+                      if (et[qe].pt.k.i)
+                        et[qe].pt.k.c = et[qe].cl;
                       else
-                        for (et = Qe[qe].pt.k.length, Ye = 0; Ye < et; Ye += 1)
-                          Qe[qe].pt.k[Ye].s && (Qe[qe].pt.k[Ye].s[0].c = Qe[qe].cl), Qe[qe].pt.k[Ye].e && (Qe[qe].pt.k[Ye].e[0].c = Qe[qe].cl);
+                        for (tt = et[qe].pt.k.length, Ye = 0; Ye < tt; Ye += 1)
+                          et[qe].pt.k[Ye].s && (et[qe].pt.k[Ye].s[0].c = et[qe].cl), et[qe].pt.k[Ye].e && (et[qe].pt.k[Ye].e[0].c = et[qe].cl);
                   }
                   ke.ty === 4 && $e(ke.shapes);
                 }
@@ -21296,18 +21413,18 @@ var lottie$1 = { exports: {} };
       function _e(Me, ke, Ge) {
         return !Ge && Ge !== 0 && (Ge = 1), Me === 1 && ke === 1 && Ge === 1 ? this : this._t(Me, 0, 0, 0, 0, ke, 0, 0, 0, 0, Ge, 0, 0, 0, 0, 1);
       }
-      function Se(Me, ke, Ge, Be, qe, Ke, Ye, et, Qe, it, nt, ot, Ze, Je, st, rt) {
-        return this.props[0] = Me, this.props[1] = ke, this.props[2] = Ge, this.props[3] = Be, this.props[4] = qe, this.props[5] = Ke, this.props[6] = Ye, this.props[7] = et, this.props[8] = Qe, this.props[9] = it, this.props[10] = nt, this.props[11] = ot, this.props[12] = Ze, this.props[13] = Je, this.props[14] = st, this.props[15] = rt, this;
+      function Se(Me, ke, Ge, Be, qe, Ke, Ye, tt, et, it, nt, ot, Ze, Je, st, rt) {
+        return this.props[0] = Me, this.props[1] = ke, this.props[2] = Ge, this.props[3] = Be, this.props[4] = qe, this.props[5] = Ke, this.props[6] = Ye, this.props[7] = tt, this.props[8] = et, this.props[9] = it, this.props[10] = nt, this.props[11] = ot, this.props[12] = Ze, this.props[13] = Je, this.props[14] = st, this.props[15] = rt, this;
       }
       function Ee(Me, ke, Ge) {
         return Ge = Ge || 0, Me !== 0 || ke !== 0 || Ge !== 0 ? this._t(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, Me, ke, Ge, 1) : this;
       }
-      function Ae(Me, ke, Ge, Be, qe, Ke, Ye, et, Qe, it, nt, ot, Ze, Je, st, rt) {
-        var tt = this.props;
-        if (Me === 1 && ke === 0 && Ge === 0 && Be === 0 && qe === 0 && Ke === 1 && Ye === 0 && et === 0 && Qe === 0 && it === 0 && nt === 1 && ot === 0)
-          return tt[12] = tt[12] * Me + tt[15] * Ze, tt[13] = tt[13] * Ke + tt[15] * Je, tt[14] = tt[14] * nt + tt[15] * st, tt[15] *= rt, this._identityCalculated = !1, this;
-        var at = tt[0], ut = tt[1], mt = tt[2], pt = tt[3], yt = tt[4], gt = tt[5], _t = tt[6], Pt = tt[7], Rt = tt[8], St = tt[9], Lt = tt[10], At = tt[11], kt = tt[12], Mt = tt[13], qt = tt[14], Vt = tt[15];
-        return tt[0] = at * Me + ut * qe + mt * Qe + pt * Ze, tt[1] = at * ke + ut * Ke + mt * it + pt * Je, tt[2] = at * Ge + ut * Ye + mt * nt + pt * st, tt[3] = at * Be + ut * et + mt * ot + pt * rt, tt[4] = yt * Me + gt * qe + _t * Qe + Pt * Ze, tt[5] = yt * ke + gt * Ke + _t * it + Pt * Je, tt[6] = yt * Ge + gt * Ye + _t * nt + Pt * st, tt[7] = yt * Be + gt * et + _t * ot + Pt * rt, tt[8] = Rt * Me + St * qe + Lt * Qe + At * Ze, tt[9] = Rt * ke + St * Ke + Lt * it + At * Je, tt[10] = Rt * Ge + St * Ye + Lt * nt + At * st, tt[11] = Rt * Be + St * et + Lt * ot + At * rt, tt[12] = kt * Me + Mt * qe + qt * Qe + Vt * Ze, tt[13] = kt * ke + Mt * Ke + qt * it + Vt * Je, tt[14] = kt * Ge + Mt * Ye + qt * nt + Vt * st, tt[15] = kt * Be + Mt * et + qt * ot + Vt * rt, this._identityCalculated = !1, this;
+      function Ae(Me, ke, Ge, Be, qe, Ke, Ye, tt, et, it, nt, ot, Ze, Je, st, rt) {
+        var Qe = this.props;
+        if (Me === 1 && ke === 0 && Ge === 0 && Be === 0 && qe === 0 && Ke === 1 && Ye === 0 && tt === 0 && et === 0 && it === 0 && nt === 1 && ot === 0)
+          return Qe[12] = Qe[12] * Me + Qe[15] * Ze, Qe[13] = Qe[13] * Ke + Qe[15] * Je, Qe[14] = Qe[14] * nt + Qe[15] * st, Qe[15] *= rt, this._identityCalculated = !1, this;
+        var at = Qe[0], ht = Qe[1], ct = Qe[2], ft = Qe[3], xt = Qe[4], pt = Qe[5], mt = Qe[6], bt = Qe[7], _t = Qe[8], vt = Qe[9], Rt = Qe[10], At = Qe[11], Ft = Qe[12], kt = Qe[13], qt = Qe[14], Vt = Qe[15];
+        return Qe[0] = at * Me + ht * qe + ct * et + ft * Ze, Qe[1] = at * ke + ht * Ke + ct * it + ft * Je, Qe[2] = at * Ge + ht * Ye + ct * nt + ft * st, Qe[3] = at * Be + ht * tt + ct * ot + ft * rt, Qe[4] = xt * Me + pt * qe + mt * et + bt * Ze, Qe[5] = xt * ke + pt * Ke + mt * it + bt * Je, Qe[6] = xt * Ge + pt * Ye + mt * nt + bt * st, Qe[7] = xt * Be + pt * tt + mt * ot + bt * rt, Qe[8] = _t * Me + vt * qe + Rt * et + At * Ze, Qe[9] = _t * ke + vt * Ke + Rt * it + At * Je, Qe[10] = _t * Ge + vt * Ye + Rt * nt + At * st, Qe[11] = _t * Be + vt * tt + Rt * ot + At * rt, Qe[12] = Ft * Me + kt * qe + qt * et + Vt * Ze, Qe[13] = Ft * ke + kt * Ke + qt * it + Vt * Je, Qe[14] = Ft * Ge + kt * Ye + qt * nt + Vt * st, Qe[15] = Ft * Be + kt * tt + qt * ot + Vt * rt, this._identityCalculated = !1, this;
       }
       function Ie(Me) {
         var ke = Me.props;
@@ -21352,8 +21469,8 @@ var lottie$1 = { exports: {} };
         return Me * this.props[2] + ke * this.props[6] + Ge * this.props[10] + this.props[14];
       }
       function Ve() {
-        var Me = this.props[0] * this.props[5] - this.props[1] * this.props[4], ke = this.props[5] / Me, Ge = -this.props[1] / Me, Be = -this.props[4] / Me, qe = this.props[0] / Me, Ke = (this.props[4] * this.props[13] - this.props[5] * this.props[12]) / Me, Ye = -(this.props[0] * this.props[13] - this.props[1] * this.props[12]) / Me, et = new Matrix();
-        return et.props[0] = ke, et.props[1] = Ge, et.props[4] = Be, et.props[5] = qe, et.props[12] = Ke, et.props[13] = Ye, et;
+        var Me = this.props[0] * this.props[5] - this.props[1] * this.props[4], ke = this.props[5] / Me, Ge = -this.props[1] / Me, Be = -this.props[4] / Me, qe = this.props[0] / Me, Ke = (this.props[4] * this.props[13] - this.props[5] * this.props[12]) / Me, Ye = -(this.props[0] * this.props[13] - this.props[1] * this.props[12]) / Me, tt = new Matrix();
+        return tt.props[0] = ke, tt.props[1] = Ge, tt.props[4] = Be, tt.props[5] = qe, tt.props[12] = Ke, tt.props[13] = Ye, tt;
       }
       function Xe(Me) {
         var ke = this.getInverseMatrix();
@@ -21370,8 +21487,8 @@ var lottie$1 = { exports: {} };
         if (this.isIdentity())
           Be[0] = Me[0], Be[1] = Me[1], Be[2] = ke[0], Be[3] = ke[1], Be[4] = Ge[0], Be[5] = Ge[1];
         else {
-          var qe = this.props[0], Ke = this.props[1], Ye = this.props[4], et = this.props[5], Qe = this.props[12], it = this.props[13];
-          Be[0] = Me[0] * qe + Me[1] * Ye + Qe, Be[1] = Me[0] * Ke + Me[1] * et + it, Be[2] = ke[0] * qe + ke[1] * Ye + Qe, Be[3] = ke[0] * Ke + ke[1] * et + it, Be[4] = Ge[0] * qe + Ge[1] * Ye + Qe, Be[5] = Ge[0] * Ke + Ge[1] * et + it;
+          var qe = this.props[0], Ke = this.props[1], Ye = this.props[4], tt = this.props[5], et = this.props[12], it = this.props[13];
+          Be[0] = Me[0] * qe + Me[1] * Ye + et, Be[1] = Me[0] * Ke + Me[1] * tt + it, Be[2] = ke[0] * qe + ke[1] * Ye + et, Be[3] = ke[0] * Ke + ke[1] * tt + it, Be[4] = Ge[0] * qe + Ge[1] * Ye + et, Be[5] = Ge[0] * Ke + Ge[1] * tt + it;
         }
         return Be;
       }
@@ -22294,15 +22411,15 @@ var lottie$1 = { exports: {} };
             Me[ke].loaded = !0, Be -= 1;
           else if (Me[ke].fOrigin === "p" || Me[ke].origin === 3) {
             if (Ke = document.querySelectorAll('style[f-forigin="p"][f-family="' + Me[ke].fFamily + '"], style[f-origin="3"][f-family="' + Me[ke].fFamily + '"]'), Ke.length > 0 && (qe = !1), qe) {
-              var et = createTag("style");
-              et.setAttribute("f-forigin", Me[ke].fOrigin), et.setAttribute("f-origin", Me[ke].origin), et.setAttribute("f-family", Me[ke].fFamily), et.type = "text/css", et.innerText = "@font-face {font-family: " + Me[ke].fFamily + "; font-style: normal; src: url('" + Me[ke].fPath + "');}", Ne.appendChild(et);
+              var tt = createTag("style");
+              tt.setAttribute("f-forigin", Me[ke].fOrigin), tt.setAttribute("f-origin", Me[ke].origin), tt.setAttribute("f-family", Me[ke].fFamily), tt.type = "text/css", tt.innerText = "@font-face {font-family: " + Me[ke].fFamily + "; font-style: normal; src: url('" + Me[ke].fPath + "');}", Ne.appendChild(tt);
             }
           } else if (Me[ke].fOrigin === "g" || Me[ke].origin === 1) {
             for (Ke = document.querySelectorAll('link[f-forigin="g"], link[f-origin="1"]'), Ye = 0; Ye < Ke.length; Ye += 1)
               Ke[Ye].href.indexOf(Me[ke].fPath) !== -1 && (qe = !1);
             if (qe) {
-              var Qe = createTag("link");
-              Qe.setAttribute("f-forigin", Me[ke].fOrigin), Qe.setAttribute("f-origin", Me[ke].origin), Qe.type = "text/css", Qe.rel = "stylesheet", Qe.href = Me[ke].fPath, document.body.appendChild(Qe);
+              var et = createTag("link");
+              et.setAttribute("f-forigin", Me[ke].fOrigin), et.setAttribute("f-origin", Me[ke].origin), et.type = "text/css", et.rel = "stylesheet", et.href = Me[ke].fPath, document.body.appendChild(et);
             }
           } else if (Me[ke].fOrigin === "t" || Me[ke].origin === 2) {
             for (Ke = document.querySelectorAll('script[f-forigin="t"], script[f-origin="2"]'), Ye = 0; Ye < Ke.length; Ye += 1)
@@ -23815,25 +23932,25 @@ var lottie$1 = { exports: {} };
         Z = _e.length, K = 0, J = 0;
         var ze = C.finalSize * 1.2 * 0.714, He = !0, $e, Ne, Me, ke, Ge;
         ke = B.length;
-        var Be, qe = -1, Ke, Ye, et, Qe = Ee, it = Pe, nt = we, ot = -1, Ze, Je, st, rt, tt, at, ut, mt, pt = "", yt = this.defaultPropsArray, gt;
+        var Be, qe = -1, Ke, Ye, tt, et = Ee, it = Pe, nt = we, ot = -1, Ze, Je, st, rt, Qe, at, ht, ct, ft = "", xt = this.defaultPropsArray, pt;
         if (C.j === 2 || C.j === 1) {
-          var _t = 0, Pt = 0, Rt = C.j === 2 ? -0.5 : -1, St = 0, Lt = !0;
+          var mt = 0, bt = 0, _t = C.j === 2 ? -0.5 : -1, vt = 0, Rt = !0;
           for (xe = 0; xe < Z; xe += 1)
             if (_e[xe].n) {
-              for (_t && (_t += Pt); St < xe; )
-                _e[St].animatorJustifyOffset = _t, St += 1;
-              _t = 0, Lt = !0;
+              for (mt && (mt += bt); vt < xe; )
+                _e[vt].animatorJustifyOffset = mt, vt += 1;
+              mt = 0, Rt = !0;
             } else {
               for (Me = 0; Me < ke; Me += 1)
-                $e = B[Me].a, $e.t.propType && (Lt && C.j === 2 && (Pt += $e.t.v * Rt), Ne = B[Me].s, Be = Ne.getMult(_e[xe].anIndexes[Me], U.a[Me].s.totalChars), Be.length ? _t += $e.t.v * Be[0] * Rt : _t += $e.t.v * Be * Rt);
-              Lt = !1;
+                $e = B[Me].a, $e.t.propType && (Rt && C.j === 2 && (bt += $e.t.v * _t), Ne = B[Me].s, Be = Ne.getMult(_e[xe].anIndexes[Me], U.a[Me].s.totalChars), Be.length ? mt += $e.t.v * Be[0] * _t : mt += $e.t.v * Be * _t);
+              Rt = !1;
             }
-          for (_t && (_t += Pt); St < xe; )
-            _e[St].animatorJustifyOffset = _t, St += 1;
+          for (mt && (mt += bt); vt < xe; )
+            _e[vt].animatorJustifyOffset = mt, vt += 1;
         }
         for (xe = 0; xe < Z; xe += 1) {
           if (V.reset(), Ze = 1, _e[xe].n)
-            K = 0, J += C.yOffset, J += He ? 1 : 0, Ee = Qe, He = !1, this._hasMaskedPath && (Pe = it, we = nt, Fe = Oe[Pe].points, Re = Fe[we - 1], Ae = Fe[we], Le = Ae.partialLength, Ie = 0), pt = "", mt = "", at = "", gt = "", yt = this.defaultPropsArray;
+            K = 0, J += C.yOffset, J += He ? 1 : 0, Ee = et, He = !1, this._hasMaskedPath && (Pe = it, we = nt, Fe = Oe[Pe].points, Re = Fe[we - 1], Ae = Fe[we], Le = Ae.partialLength, Ie = 0), ft = "", ct = "", at = "", pt = "", xt = this.defaultPropsArray;
           else {
             if (this._hasMaskedPath) {
               if (ot !== _e[xe].line) {
@@ -23852,7 +23969,7 @@ var lottie$1 = { exports: {} };
               for (Me = 0; Me < ke; Me += 1)
                 $e = B[Me].a, $e.p.propType && (Ne = B[Me].s, Be = Ne.getMult(_e[xe].anIndexes[Me], U.a[Me].s.totalChars), Be.length ? At += $e.p.v[0] * Be[0] : At += $e.p.v[0] * Be), $e.a.propType && (Ne = B[Me].s, Be = Ne.getMult(_e[xe].anIndexes[Me], U.a[Me].s.totalChars), Be.length ? At += $e.a.v[0] * Be[0] : At += $e.a.v[0] * Be);
               for (Te = !0, this._pathData.a.v && (Ee = _e[0].an * 0.5 + (De - this._pathData.f.v - _e[0].an * 0.5 - _e[_e.length - 1].an * 0.5) * qe / (Z - 1), Ee += this._pathData.f.v); Te; )
-                Ie + Le >= Ee + At || !Fe ? (Ve = (Ee + At - Ie) / Ae.partialLength, Ye = Re.point[0] + (Ae.point[0] - Re.point[0]) * Ve, et = Re.point[1] + (Ae.point[1] - Re.point[1]) * Ve, V.translate(-I[0] * _e[xe].an * 5e-3, -(I[1] * ze) * 0.01), Te = !1) : Fe && (Ie += Ae.partialLength, we += 1, we >= Fe.length && (we = 0, Pe += 1, Oe[Pe] ? Fe = Oe[Pe].points : Ue.v.c ? (we = 0, Pe = 0, Fe = Oe[Pe].points) : (Ie -= Ae.partialLength, Fe = null)), Fe && (Re = Ae, Ae = Fe[we], Le = Ae.partialLength));
+                Ie + Le >= Ee + At || !Fe ? (Ve = (Ee + At - Ie) / Ae.partialLength, Ye = Re.point[0] + (Ae.point[0] - Re.point[0]) * Ve, tt = Re.point[1] + (Ae.point[1] - Re.point[1]) * Ve, V.translate(-I[0] * _e[xe].an * 5e-3, -(I[1] * ze) * 0.01), Te = !1) : Fe && (Ie += Ae.partialLength, we += 1, we >= Fe.length && (we = 0, Pe += 1, Oe[Pe] ? Fe = Oe[Pe].points : Ue.v.c ? (we = 0, Pe = 0, Fe = Oe[Pe].points) : (Ie -= Ae.partialLength, Fe = null)), Fe && (Re = Ae, Ae = Fe[we], Le = Ae.partialLength));
               Ke = _e[xe].an / 2 - _e[xe].add, V.translate(-Ke, 0, 0);
             } else
               Ke = _e[xe].an / 2 - _e[xe].add, V.translate(-Ke, 0, 0), V.translate(-I[0] * _e[xe].an * 5e-3, -I[1] * ze * 0.01, 0);
@@ -23864,24 +23981,24 @@ var lottie$1 = { exports: {} };
               $e = B[Me].a, $e.s.propType && (Ne = B[Me].s, Be = Ne.getMult(_e[xe].anIndexes[Me], U.a[Me].s.totalChars), Be.length ? V.scale(1 + ($e.s.v[0] - 1) * Be[0], 1 + ($e.s.v[1] - 1) * Be[1], 1) : V.scale(1 + ($e.s.v[0] - 1) * Be, 1 + ($e.s.v[1] - 1) * Be, 1));
             for (Me = 0; Me < ke; Me += 1) {
               if ($e = B[Me].a, Ne = B[Me].s, Be = Ne.getMult(_e[xe].anIndexes[Me], U.a[Me].s.totalChars), $e.sk.propType && (Be.length ? V.skewFromAxis(-$e.sk.v * Be[0], $e.sa.v * Be[1]) : V.skewFromAxis(-$e.sk.v * Be, $e.sa.v * Be)), $e.r.propType && (Be.length ? V.rotateZ(-$e.r.v * Be[2]) : V.rotateZ(-$e.r.v * Be)), $e.ry.propType && (Be.length ? V.rotateY($e.ry.v * Be[1]) : V.rotateY($e.ry.v * Be)), $e.rx.propType && (Be.length ? V.rotateX($e.rx.v * Be[0]) : V.rotateX($e.rx.v * Be)), $e.o.propType && (Be.length ? Ze += ($e.o.v * Be[0] - Ze) * Be[0] : Ze += ($e.o.v * Be - Ze) * Be), C.strokeWidthAnim && $e.sw.propType && (Be.length ? st += $e.sw.v * Be[0] : st += $e.sw.v * Be), C.strokeColorAnim && $e.sc.propType)
-                for (tt = 0; tt < 3; tt += 1)
-                  Be.length ? Je[tt] += ($e.sc.v[tt] - Je[tt]) * Be[0] : Je[tt] += ($e.sc.v[tt] - Je[tt]) * Be;
+                for (Qe = 0; Qe < 3; Qe += 1)
+                  Be.length ? Je[Qe] += ($e.sc.v[Qe] - Je[Qe]) * Be[0] : Je[Qe] += ($e.sc.v[Qe] - Je[Qe]) * Be;
               if (C.fillColorAnim && C.fc) {
                 if ($e.fc.propType)
-                  for (tt = 0; tt < 3; tt += 1)
-                    Be.length ? rt[tt] += ($e.fc.v[tt] - rt[tt]) * Be[0] : rt[tt] += ($e.fc.v[tt] - rt[tt]) * Be;
+                  for (Qe = 0; Qe < 3; Qe += 1)
+                    Be.length ? rt[Qe] += ($e.fc.v[Qe] - rt[Qe]) * Be[0] : rt[Qe] += ($e.fc.v[Qe] - rt[Qe]) * Be;
                 $e.fh.propType && (Be.length ? rt = addHueToRGB(rt, $e.fh.v * Be[0]) : rt = addHueToRGB(rt, $e.fh.v * Be)), $e.fs.propType && (Be.length ? rt = addSaturationToRGB(rt, $e.fs.v * Be[0]) : rt = addSaturationToRGB(rt, $e.fs.v * Be)), $e.fb.propType && (Be.length ? rt = addBrightnessToRGB(rt, $e.fb.v * Be[0]) : rt = addBrightnessToRGB(rt, $e.fb.v * Be));
               }
             }
             for (Me = 0; Me < ke; Me += 1)
               $e = B[Me].a, $e.p.propType && (Ne = B[Me].s, Be = Ne.getMult(_e[xe].anIndexes[Me], U.a[Me].s.totalChars), this._hasMaskedPath ? Be.length ? V.translate(0, $e.p.v[1] * Be[0], -$e.p.v[2] * Be[1]) : V.translate(0, $e.p.v[1] * Be, -$e.p.v[2] * Be) : Be.length ? V.translate($e.p.v[0] * Be[0], $e.p.v[1] * Be[1], -$e.p.v[2] * Be[2]) : V.translate($e.p.v[0] * Be, $e.p.v[1] * Be, -$e.p.v[2] * Be));
-            if (C.strokeWidthAnim && (at = st < 0 ? 0 : st), C.strokeColorAnim && (ut = "rgb(" + Math.round(Je[0] * 255) + "," + Math.round(Je[1] * 255) + "," + Math.round(Je[2] * 255) + ")"), C.fillColorAnim && C.fc && (mt = "rgb(" + Math.round(rt[0] * 255) + "," + Math.round(rt[1] * 255) + "," + Math.round(rt[2] * 255) + ")"), this._hasMaskedPath) {
+            if (C.strokeWidthAnim && (at = st < 0 ? 0 : st), C.strokeColorAnim && (ht = "rgb(" + Math.round(Je[0] * 255) + "," + Math.round(Je[1] * 255) + "," + Math.round(Je[2] * 255) + ")"), C.fillColorAnim && C.fc && (ct = "rgb(" + Math.round(rt[0] * 255) + "," + Math.round(rt[1] * 255) + "," + Math.round(rt[2] * 255) + ")"), this._hasMaskedPath) {
               if (V.translate(0, -C.ls), V.translate(0, I[1] * ze * 0.01 + J, 0), this._pathData.p.v) {
                 Xe = (Ae.point[1] - Re.point[1]) / (Ae.point[0] - Re.point[0]);
-                var kt = Math.atan(Xe) * 180 / Math.PI;
-                Ae.point[0] < Re.point[0] && (kt += 180), V.rotate(-kt * Math.PI / 180);
+                var Ft = Math.atan(Xe) * 180 / Math.PI;
+                Ae.point[0] < Re.point[0] && (Ft += 180), V.rotate(-Ft * Math.PI / 180);
               }
-              V.translate(Ye, et, 0), Ee -= I[0] * _e[xe].an * 5e-3, _e[xe + 1] && qe !== _e[xe + 1].ind && (Ee += _e[xe].an / 2, Ee += C.tr * 1e-3 * C.finalSize);
+              V.translate(Ye, tt, 0), Ee -= I[0] * _e[xe].an * 5e-3, _e[xe + 1] && qe !== _e[xe + 1].ind && (Ee += _e[xe].an / 2, Ee += C.tr * 1e-3 * C.finalSize);
             } else {
               switch (V.translate(K, J, 0), C.ps && V.translate(C.ps[0], C.ps[1] + C.ascent, 0), C.j) {
                 case 1:
@@ -23893,9 +24010,9 @@ var lottie$1 = { exports: {} };
               }
               V.translate(0, -C.ls), V.translate(Ke, 0, 0), V.translate(I[0] * _e[xe].an * 5e-3, I[1] * ze * 0.01, 0), K += _e[xe].l + C.tr * 1e-3 * C.finalSize;
             }
-            X === "html" ? pt = V.toCSS() : X === "svg" ? pt = V.to2dCSS() : yt = [V.props[0], V.props[1], V.props[2], V.props[3], V.props[4], V.props[5], V.props[6], V.props[7], V.props[8], V.props[9], V.props[10], V.props[11], V.props[12], V.props[13], V.props[14], V.props[15]], gt = Ze;
+            X === "html" ? ft = V.toCSS() : X === "svg" ? ft = V.to2dCSS() : xt = [V.props[0], V.props[1], V.props[2], V.props[3], V.props[4], V.props[5], V.props[6], V.props[7], V.props[8], V.props[9], V.props[10], V.props[11], V.props[12], V.props[13], V.props[14], V.props[15]], pt = Ze;
           }
-          Y <= xe ? (Ge = new LetterProps(gt, at, ut, mt, pt, yt), this.renderedLetters.push(Ge), Y += 1, this.lettersChangedFlag = !0) : (Ge = this.renderedLetters[xe], this.lettersChangedFlag = Ge.update(gt, at, ut, mt, pt, yt) || this.lettersChangedFlag);
+          Y <= xe ? (Ge = new LetterProps(pt, at, ht, ct, ft, xt), this.renderedLetters.push(Ge), Y += 1, this.lettersChangedFlag = !0) : (Ge = this.renderedLetters[xe], this.lettersChangedFlag = Ge.update(pt, at, ht, ct, ft, xt) || this.lettersChangedFlag);
         }
       }
     }, TextAnimatorProperty.prototype.getValue = function() {
@@ -27107,8 +27224,8 @@ const lottie = /* @__PURE__ */ getDefaultExportFromCjs(lottieExports), initialSt
     temperatureFilter: qe,
     sharpnessFilter: Ke,
     hueFilter: Ye,
-    blurFilter: et,
-    adjustmentFilter: Qe,
+    blurFilter: tt,
+    adjustmentFilter: et,
     vignetteFilter: it,
     noiseFilter: nt
   } = withFiltersHook(Ue);
@@ -27140,8 +27257,8 @@ const lottie = /* @__PURE__ */ getDefaultExportFromCjs(lottieExports), initialSt
           Z.current.totalFrames = Je;
           const st = J.current.getDuration();
           Z.current.totalDuration = st;
-          const rt = J.current.renderer.canvasContext.canvas, tt = PIXI.Texture.from(rt);
-          _e.current = tt, V(!0), B(st);
+          const rt = J.current.renderer.canvasContext.canvas, Qe = PIXI.Texture.from(rt);
+          _e.current = Qe, V(!0), B(st);
         }
       }), J.current.addEventListener("loaded_images", () => {
       }), J.current.addEventListener("complete", () => {
@@ -27161,8 +27278,8 @@ const lottie = /* @__PURE__ */ getDefaultExportFromCjs(lottieExports), initialSt
   const ot = (Ze) => {
     if (J.current && X.current && xe.current) {
       const st = Ze(xe.current.time()) / xe.current.duration() * Z.current.totalFrames, rt = Z.current.totalFrames;
-      let tt = st;
-      tt = Math.round(Math.floor(tt)), tt >= rt ? (J.current.goToAndStop(0, !0), _e.current && _e.current.update(), Z.current.isPlaying = !1) : (J.current.goToAndStop(tt, !0), _e.current && _e.current.update(), Z.current.isPlaying = !0);
+      let Qe = st;
+      Qe = Math.round(Math.floor(Qe)), Qe >= rt ? (J.current.goToAndStop(0, !0), _e.current && _e.current.update(), Z.current.isPlaying = !1) : (J.current.goToAndStop(Qe, !0), _e.current && _e.current.update(), Z.current.isPlaying = !0);
     }
   };
   return React.useEffect(() => {
@@ -27219,9 +27336,9 @@ const lottie = /* @__PURE__ */ getDefaultExportFromCjs(lottieExports), initialSt
             qe,
             Ke,
             Ye,
-            Qe,
+            et,
             // conditionally add blur filter
-            ...ke > 0 ? [et] : [],
+            ...ke > 0 ? [tt] : [],
             // conditionally add vignette filter
             ...Ge > 0 ? [it] : [],
             // conditionally add noise filter