npm - image-beautifier - Versions diffs - 1.0.3 → 1.0.4 - Mend

image-beautifier 1.0.3 → 1.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2) hide show

package/lib/image-beautifier.es.js +437 -433
package/package.json +1 -1

package/lib/image-beautifier.es.js CHANGED Viewed

@@ -1,31 +1,31 @@
 var hr = Object.defineProperty;
-var pr = (o, t, n) => t in o ? hr(o, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : o[t] = n;
-var R = (o, t, n) => pr(o, typeof t != "symbol" ? t + "" : t, n);
-import kt, { useState as O, useMemo as le, useEffect as N, Children as it, cloneElement as st, useRef as ne } from "react";
+var pr = (i, t, n) => t in i ? hr(i, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : i[t] = n;
+var R = (i, t, n) => pr(i, typeof t != "symbol" ? t + "" : t, n);
+import kt, { useState as O, useMemo as le, useEffect as N, Children as ot, cloneElement as st, useRef as ne } from "react";
 import { ColorPicker as ur, Button as k, Dropdown as At, Popover as xe, Divider as mr, InputNumber as nt, Tooltip as L, Modal as gr, Switch as at, Input as xr, Radio as P, Segmented as lt, ConfigProvider as Nt, Popconfirm as br, Drawer as wr, Slider as pe, Upload as yr, message as vr, theme as ct } from "antd";
 import { observer as B } from "mobx-react-lite";
-import { Camera as jr, Check as Mr, Square as Cr, Circle as kr, Slash as Ar, MoveDownLeft as Nr, Pencil as Tr, Smile as Sr, Undo as Rr, Redo as Dr, ChevronRight as Hr, ChevronDown as zr, ChevronUp as _r, RotateCcw as Er, ZoomIn as Or, ZoomOut as Br, Hand as Yr, Crop as Ir, FlipHorizontal2 as Pr, FlipVertical2 as Wr, Sunset as Zr, Box as Gr, LayoutGrid as Fr, ImagePlus as Lr, Type as Ur, CodeXml as Vr, ClipboardPaste as Jr, ImagePlay as qr, Maximize as Xr, ListCollapse as Qr, ArrowUpRight as $r, ArrowDownRight as Kr, ImageDown as eo, Copy as to, Settings2 as ro, ChevronLeft as oo, Pipette as io, Trash2 as so, Sun as no, Moon as ao, icons as dt } from "lucide-react";
-import { TinyColor as lo } from "@ctrl/tinycolor";
-import { clsx as co } from "clsx";
-import { twMerge as fo } from "tailwind-merge";
-import { makeAutoObservable as Tt, toJS as St, runInAction as ho, action as po } from "mobx";
-import { maxBy as uo } from "lodash";
-import mo from "@emoji-mart/data";
-import go from "@emoji-mart/react";
-import { Frame as xo, Rect as ae, Box as ft, Ellipse as ht, Line as pt, Text as bo, Cursor as wo, App as yo, ZoomEvent as vo, ResizeEvent as jo, PointerEvent as Mo, DragEvent as De } from "leafer-ui";
-import { addListener as Co, removeListener as ko } from "resize-detector";
-import { Arrow as Ao } from "@leafer-in/arrow";
-import { ScrollBar as No } from "@leafer-in/scroll";
+import { Camera as jr, Check as Mr, Square as Cr, Circle as kr, Slash as Ar, MoveDownLeft as Nr, Pencil as Tr, Smile as Sr, Undo as Rr, Redo as Dr, ChevronRight as Hr, ChevronDown as zr, ChevronUp as _r, RotateCcw as Er, ZoomIn as Or, ZoomOut as Br, Hand as Yr, Crop as Ir, FlipHorizontal2 as Pr, FlipVertical2 as Wr, Sunset as Zr, Box as Fr, LayoutGrid as Gr, ImagePlus as Lr, Type as Ur, CodeXml as Vr, ClipboardPaste as Jr, ImagePlay as qr, Maximize as Xr, ListCollapse as Qr, ArrowUpRight as $r, ArrowDownRight as Kr, ImageDown as ei, Copy as ti, Settings2 as ri, ChevronLeft as ii, Pipette as oi, Trash2 as si, Sun as ni, Moon as ai, icons as dt } from "lucide-react";
+import { TinyColor as li } from "@ctrl/tinycolor";
+import { clsx as ci } from "clsx";
+import { twMerge as di } from "tailwind-merge";
+import { makeAutoObservable as Tt, toJS as St, runInAction as fi, action as hi } from "mobx";
+import { maxBy as pi } from "lodash";
+import ui from "@emoji-mart/data";
+import mi from "@emoji-mart/react";
+import { Frame as gi, Rect as ae, Box as ft, Ellipse as ht, Line as pt, Text as xi, Cursor as bi, App as wi, ZoomEvent as yi, ResizeEvent as vi, PointerEvent as ji, DragEvent as De } from "leafer-ui";
+import { addListener as Mi, removeListener as Ci } from "resize-detector";
+import { Arrow as ki } from "@leafer-in/arrow";
+import { ScrollBar as Ai } from "@leafer-in/scroll";
 import { tinykeys as Rt } from "tinykeys";
 import "@leafer-in/editor";
 import "@leafer-in/view";
-import { StyleProvider as To } from "@ant-design/cssinjs";
-import So from "react-cropper";
+import { StyleProvider as Ni } from "@ant-design/cssinjs";
+import Ti from "react-cropper";
 var ue = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
-function Ro(o) {
-  return o && o.__esModule && Object.prototype.hasOwnProperty.call(o, "default") ? o.default : o;
+function Si(i) {
+  return i && i.__esModule && Object.prototype.hasOwnProperty.call(i, "default") ? i.default : i;
 }
-var ze = { exports: {} }, oe = {};
+var ze = { exports: {} }, ie = {};
 /**
  * @license React
  * react-jsx-runtime.production.min.js
@@ -36,10 +36,10 @@ var ze = { exports: {} }, oe = {};
  * LICENSE file in the root directory of this source tree.
  */
 var ut;
-function Do() {
-  if (ut) return oe;
+function Ri() {
+  if (ut) return ie;
   ut = 1;
-  var o = kt, t = Symbol.for("react.element"), n = Symbol.for("react.fragment"), s = Object.prototype.hasOwnProperty, a = o.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, l = { key: !0, ref: !0, __self: !0, __source: !0 };
+  var i = kt, t = Symbol.for("react.element"), n = Symbol.for("react.fragment"), s = Object.prototype.hasOwnProperty, a = i.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, l = { key: !0, ref: !0, __self: !0, __source: !0 };
   function h(f, d, p) {
     var m, b = {}, C = null, A = null;
     p !== void 0 && (C = "" + p), d.key !== void 0 && (C = "" + d.key), d.ref !== void 0 && (A = d.ref);
@@ -47,9 +47,9 @@ function Do() {
     if (f && f.defaultProps) for (m in d = f.defaultProps, d) b[m] === void 0 && (b[m] = d[m]);
     return { $$typeof: t, type: f, key: C, ref: A, props: b, _owner: a.current };
   }
-  return oe.Fragment = n, oe.jsx = h, oe.jsxs = h, oe;
+  return ie.Fragment = n, ie.jsx = h, ie.jsxs = h, ie;
 }
-var ie = {};
+var oe = {};
 /**
  * @license React
  * react-jsx-runtime.development.js
@@ -60,16 +60,16 @@ var ie = {};
  * LICENSE file in the root directory of this source tree.
  */
 var mt;
-function Ho() {
+function Di() {
   return mt || (mt = 1, process.env.NODE_ENV !== "production" && function() {
-    var o = kt, t = Symbol.for("react.element"), n = Symbol.for("react.portal"), s = Symbol.for("react.fragment"), a = Symbol.for("react.strict_mode"), l = Symbol.for("react.profiler"), h = Symbol.for("react.provider"), f = Symbol.for("react.context"), d = Symbol.for("react.forward_ref"), p = Symbol.for("react.suspense"), m = Symbol.for("react.suspense_list"), b = Symbol.for("react.memo"), C = Symbol.for("react.lazy"), A = Symbol.for("react.offscreen"), x = Symbol.iterator, w = "@@iterator";
+    var i = kt, t = Symbol.for("react.element"), n = Symbol.for("react.portal"), s = Symbol.for("react.fragment"), a = Symbol.for("react.strict_mode"), l = Symbol.for("react.profiler"), h = Symbol.for("react.provider"), f = Symbol.for("react.context"), d = Symbol.for("react.forward_ref"), p = Symbol.for("react.suspense"), m = Symbol.for("react.suspense_list"), b = Symbol.for("react.memo"), C = Symbol.for("react.lazy"), A = Symbol.for("react.offscreen"), x = Symbol.iterator, w = "@@iterator";
     function S(r) {
       if (r === null || typeof r != "object")
         return null;
       var c = x && r[x] || r[w];
       return typeof c == "function" ? c : null;
     }
-    var _ = o.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+    var _ = i.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
     function E(r) {
       {
         for (var c = arguments.length, u = new Array(c > 1 ? c - 1 : 0), g = 1; g < c; g++)
@@ -87,10 +87,10 @@ function Ho() {
         T.unshift("Warning: " + c), Function.prototype.apply.call(console[r], console, T);
       }
     }
-    var ve = !1, $ = !1, D = !1, G = !1, U = !1, K;
+    var ve = !1, $ = !1, D = !1, F = !1, U = !1, K;
     K = Symbol.for("react.module.reference");
     function Bt(r) {
-      return !!(typeof r == "string" || typeof r == "function" || r === s || r === l || U || r === a || r === p || r === m || G || r === A || ve || $ || D || typeof r == "object" && r !== null && (r.$$typeof === C || r.$$typeof === b || r.$$typeof === h || r.$$typeof === f || r.$$typeof === d || // This needs to include all possible module reference object
+      return !!(typeof r == "string" || typeof r == "function" || r === s || r === l || U || r === a || r === p || r === m || F || r === A || ve || $ || D || typeof r == "object" && r !== null && (r.$$typeof === C || r.$$typeof === b || r.$$typeof === h || r.$$typeof === f || r.$$typeof === d || // This needs to include all possible module reference object
       // types supported by any Flight configuration anywhere since
       // we don't know which Flight build this will end up being used
       // with.
@@ -106,7 +106,7 @@ function Ho() {
     function Ee(r) {
       return r.displayName || "Context";
     }
-    function F(r) {
+    function G(r) {
       if (r == null)
         return null;
       if (typeof r.tag == "number" && E("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), typeof r == "function")
@@ -139,11 +139,11 @@ function Ho() {
             return Yt(r, r.render, "ForwardRef");
           case b:
             var g = r.displayName || null;
-            return g !== null ? g : F(r.type) || "Memo";
+            return g !== null ? g : G(r.type) || "Memo";
           case C: {
             var j = r, T = j._payload, v = j._init;
             try {
-              return F(v(T));
+              return G(v(T));
             } catch {
               return null;
             }
@@ -152,9 +152,9 @@ function Ho() {
       return null;
     }
     var V = Object.assign, ee = 0, Oe, Be, Ye, Ie, Pe, We, Ze;
-    function Ge() {
+    function Fe() {
     }
-    Ge.__reactDisabledLog = !0;
+    Fe.__reactDisabledLog = !0;
     function It() {
       {
         if (ee === 0) {
@@ -162,7 +162,7 @@ function Ho() {
           var r = {
             configurable: !0,
             enumerable: !0,
-            value: Ge,
+            value: Fe,
             writable: !0
           };
           Object.defineProperties(console, {
@@ -232,7 +232,7 @@ function Ho() {
       var Wt = typeof WeakMap == "function" ? WeakMap : Map;
       de = new Wt();
     }
-    function Fe(r, c) {
+    function Ge(r, c) {
       if (!r || Ce)
         return "";
       {
@@ -304,9 +304,9 @@ function Ho() {
       return typeof r == "function" && de.set(r, J), J;
     }
     function Zt(r, c, u) {
-      return Fe(r, !1);
+      return Ge(r, !1);
     }
-    function Gt(r) {
+    function Ft(r) {
       var c = r.prototype;
       return !!(c && c.isReactComponent);
     }
@@ -314,7 +314,7 @@ function Ho() {
       if (r == null)
         return "";
       if (typeof r == "function")
-        return Fe(r, Gt(r));
+        return Ge(r, Ft(r));
       if (typeof r == "string")
         return ce(r);
       switch (r) {
@@ -347,7 +347,7 @@ function Ho() {
       } else
         Ue.setExtraStackFrame(null);
     }
-    function Ft(r, c, u, g, j) {
+    function Gt(r, c, u, g, j) {
       {
         var T = Function.call.bind(te);
         for (var v in r)
@@ -415,8 +415,8 @@ function Ho() {
     }
     function Qt(r, c) {
       if (typeof r.ref == "string" && re.current && c && re.current.stateNode !== c) {
-        var u = F(re.current.type);
-        Ae[u] || (E('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref', F(re.current.type), r.ref), Ae[u] = !0);
+        var u = G(re.current.type);
+        Ae[u] || (E('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref', G(re.current.type), r.ref), Ae[u] = !0);
       }
     }
     function $t(r, c) {
@@ -504,7 +504,7 @@ function Ho() {
     function $e() {
       {
         if (Ne.current) {
-          var r = F(Ne.current.type);
+          var r = G(Ne.current.type);
           if (r)
             return `
@@ -517,7 +517,7 @@ Check the render method of \`` + r + "`.";
       return "";
     }
     var Ke = {};
-    function or(r) {
+    function ir(r) {
       {
         var c = $e();
         if (!c) {
@@ -534,12 +534,12 @@ Check the top-level render call using <` + u + ">.");
         if (!r._store || r._store.validated || r.key != null)
           return;
         r._store.validated = !0;
-        var u = or(c);
+        var u = ir(c);
         if (Ke[u])
           return;
         Ke[u] = !0;
         var g = "";
-        r && r._owner && r._owner !== Ne.current && (g = " It was passed a child from " + F(r._owner.type) + "."), q(r), E('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', u, g), q(null);
+        r && r._owner && r._owner !== Ne.current && (g = " It was passed a child from " + G(r._owner.type) + "."), q(r), E('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', u, g), q(null);
       }
     }
     function tt(r, c) {
@@ -561,7 +561,7 @@ Check the top-level render call using <` + u + ">.");
         }
       }
     }
-    function ir(r) {
+    function or(r) {
       {
         var c = r.type;
         if (c == null || typeof c == "string")
@@ -576,11 +576,11 @@ Check the top-level render call using <` + u + ">.");
         else
           return;
         if (u) {
-          var g = F(c);
-          Ft(u, r.props, "prop", g, r);
+          var g = G(c);
+          Gt(u, r.props, "prop", g, r);
         } else if (c.PropTypes !== void 0 && !Te) {
           Te = !0;
-          var j = F(c);
+          var j = G(c);
           E("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?", j || "Unknown");
         }
         typeof c.getDefaultProps == "function" && !c.getDefaultProps.isReactClassApproved && E("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.");
@@ -599,7 +599,7 @@ Check the top-level render call using <` + u + ">.");
       }
     }
     var rt = {};
-    function ot(r, c, u, g, j, T) {
+    function it(r, c, u, g, j, T) {
       {
         var v = Bt(r);
         if (!v) {
@@ -608,7 +608,7 @@ Check the top-level render call using <` + u + ">.");
           var Y = rr();
           Y ? y += Y : y += $e();
           var H;
-          r === null ? H = "null" : ke(r) ? H = "array" : r !== void 0 && r.$$typeof === t ? (H = "<" + (F(r.type) || "Unknown") + " />", y = " Did you accidentally export a JSX literal instead of a component?") : H = typeof r, E("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", H, y);
+          r === null ? H = "null" : ke(r) ? H = "array" : r !== void 0 && r.$$typeof === t ? (H = "<" + (G(r.type) || "Unknown") + " />", y = " Did you accidentally export a JSX literal instead of a component?") : H = typeof r, E("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", H, y);
         }
         var z = tr(r, c, u, j, T);
         if (z == null)
@@ -627,7 +627,7 @@ Check the top-level render call using <` + u + ">.");
               tt(W, r);
         }
         if (te.call(c, "key")) {
-          var J = F(r), I = Object.keys(c).filter(function(fr) {
+          var J = G(r), I = Object.keys(c).filter(function(fr) {
             return fr !== "key";
           }), Re = I.length > 0 ? "{key: someKey, " + I.join(": ..., ") + ": ...}" : "{key: someKey}";
           if (!rt[J + Re]) {
@@ -640,20 +640,20 @@ React keys must be passed directly to JSX without using spread:
   <%s key={someKey} {...props} />`, Re, J, dr, J), rt[J + Re] = !0;
           }
         }
-        return r === s ? sr(z) : ir(z), z;
+        return r === s ? sr(z) : or(z), z;
       }
     }
     function nr(r, c, u) {
-      return ot(r, c, u, !0);
+      return it(r, c, u, !0);
     }
     function ar(r, c, u) {
-      return ot(r, c, u, !1);
+      return it(r, c, u, !1);
     }
     var lr = ar, cr = nr;
-    ie.Fragment = s, ie.jsx = lr, ie.jsxs = cr;
-  }()), ie;
+    oe.Fragment = s, oe.jsx = lr, oe.jsxs = cr;
+  }()), oe;
 }
-process.env.NODE_ENV === "production" ? ze.exports = Do() : ze.exports = Ho();
+process.env.NODE_ENV === "production" ? ze.exports = Ri() : ze.exports = Di();
 var e = ze.exports;
 const M = {
   Camera: jr,
@@ -677,8 +677,8 @@ const M = {
   FlipHorizontal2: Pr,
   FlipVertical2: Wr,
   Sunset: Zr,
-  Box: Gr,
-  LayoutGrid: Fr,
+  Box: Fr,
+  LayoutGrid: Gr,
   ImagePlus: Lr,
   Type: Ur,
   CodeXml: Vr,
@@ -688,20 +688,20 @@ const M = {
   ListCollapse: Qr,
   ArrowUpRight: $r,
   ArrowDownRight: Kr,
-  ImageDown: eo,
-  Copy: to,
-  Settings2: ro,
-  ChevronLeft: oo,
-  Pipette: io,
-  Trash2: so,
-  Sun: no,
-  Moon: ao
-}, be = (o) => {
+  ImageDown: ei,
+  Copy: ti,
+  Settings2: ri,
+  ChevronLeft: ii,
+  Pipette: oi,
+  Trash2: si,
+  Sun: ni,
+  Moon: ai
+}, be = (i) => {
   const t = () => {
     if (!window.EyeDropper) return;
     new EyeDropper().open().then((s) => {
       const a = s.sRGBHex;
-      o != null && o.onChange && o.onChange(new lo(a));
+      i != null && i.onChange && i.onChange(new li(a));
     }).catch((s) => {
       console.log(s);
     });
@@ -709,14 +709,14 @@ const M = {
   return /* @__PURE__ */ e.jsx(
     ur,
     {
-      ...o,
+      ...i,
       panelRender: (n) => /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
         window.EyeDropper && /* @__PURE__ */ e.jsx("div", { className: "mb-1", children: /* @__PURE__ */ e.jsx(k, { type: "text", shape: "circle", size: "small", icon: /* @__PURE__ */ e.jsx(M.Pipette, { size: 16 }), onClick: t }) }),
         n
       ] })
     }
   );
-}, zo = [
+}, Hi = [
   {
     label: /* @__PURE__ */ e.jsx("div", { className: "w-4 h-3 mt-1.5 items-center cursor-pointer", children: /* @__PURE__ */ e.jsx("i", { className: "block w-full origin-center rounded-lg bg-slate-600 -rotate-45 h-[1px]" }) }),
     key: 1
@@ -737,14 +737,14 @@ const M = {
     label: /* @__PURE__ */ e.jsx("div", { className: "w-4 h-3 mt-1.5 items-center cursor-pointer", children: /* @__PURE__ */ e.jsx("i", { className: "block w-full origin-center rounded-lg bg-slate-600 -rotate-45 h-[8px]" }) }),
     key: 8
   }
-], _o = ({ defaultValue: o, onChange: t }) => {
+], zi = ({ defaultValue: i, onChange: t }) => {
   const n = ({ key: s }) => {
     t(s);
   };
   return /* @__PURE__ */ e.jsx(
     At,
     {
-      menu: { items: zo, onClick: n, selectedKeys: [o] },
+      menu: { items: Hi, onClick: n, selectedKeys: [i] },
       trigger: ["click"],
       placement: "bottom",
       children: /* @__PURE__ */ e.jsx(
@@ -758,7 +758,7 @@ const M = {
             {
               className: "block w-full origin-center rounded-lg bg-slate-600 -rotate-45",
               style: {
-                height: o + "px"
+                height: i + "px"
               }
             }
           ) })
@@ -767,37 +767,37 @@ const M = {
     }
   );
 };
-let Eo = (o, t = 21) => (n = t) => {
+let _i = (i, t = 21) => (n = t) => {
   let s = "", a = n;
   for (; a--; )
-    s += o[Math.random() * o.length | 0];
+    s += i[Math.random() * i.length | 0];
   return s;
 };
-const Oo = () => {
-  const o = typeof navigator == "object" ? navigator.platform : "";
-  return /Mac|iPod|iPhone|iPad/.test(o);
-}, gt = Oo() ? "⌘" : "Ctrl", Dt = [
+const Ei = () => {
+  const i = typeof navigator == "object" ? navigator.platform : "";
+  return /Mac|iPod|iPhone|iPad/.test(i);
+}, gt = Ei() ? "⌘" : "Ctrl", Dt = [
   "image/jpeg",
   "image/png",
   "image/bmp",
   "image/gif",
   "image/webp"
 ];
-function Z(...o) {
-  return fo(co(o));
+function Z(...i) {
+  return di(ci(i));
 }
-const ge = Eo(
+const ge = _i(
   "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz",
   7
-), Bo = (o, t) => {
+), Oi = (i, t) => {
   let n = document.createElement("a");
-  n.href = o, n.download = t, n.style = "position: absolute; z-index: -111; visibility: none;", document.body.appendChild(n), n.click(), document.body.removeChild(n), n = null;
-}, Yo = (o, t, n = 950, s = 450) => {
-  let a = o, l = t;
+  n.href = i, n.download = t, n.style = "position: absolute; z-index: -111; visibility: none;", document.body.appendChild(n), n.click(), document.body.removeChild(n), n = null;
+}, Bi = (i, t, n = 950, s = 450) => {
+  let a = i, l = t;
   return a > n && (l *= n / a, a = n), l > s && (a *= s / l, l = s), { width: Math.round(a), height: Math.round(l) };
-}, Io = (o) => {
+}, Yi = (i) => {
   const t = new Image();
-  return o.startsWith("data") || (t.crossOrigin = "Anonymous"), new Promise(function(n, s) {
+  return i.startsWith("data") || (t.crossOrigin = "Anonymous"), new Promise(function(n, s) {
     t.onload = function() {
       n(t);
     };
@@ -806,51 +806,51 @@ const ge = Eo(
         new Error("An error occurred attempting to load image")
       );
     };
-    t.onerror = a, t.onabort = a, t.src = o;
+    t.onerror = a, t.onabort = a, t.src = i;
   });
-}, we = (o, t, n = 0.15) => {
-  const s = Math.min(o, t);
+}, we = (i, t, n = 0.15) => {
+  const s = Math.min(i, t);
   return Math.round(s * n);
-}, Po = (o, t, n) => o === "top-left" ? {
+}, Ii = (i, t, n) => i === "top-left" ? {
   x: 0,
   y: 0
-} : o === "top" ? {
+} : i === "top" ? {
   x: t / 2,
   y: 0
-} : o === "top-right" ? {
+} : i === "top-right" ? {
   x: t,
   y: 0
-} : o === "left" ? {
+} : i === "left" ? {
   x: 0,
   y: n / 2
-} : o === "right" ? {
+} : i === "right" ? {
   x: t,
   y: n / 2
-} : o === "bottom-left" ? {
+} : i === "bottom-left" ? {
   x: 0,
   y: n
-} : o === "bottom" ? {
+} : i === "bottom" ? {
   x: t / 2,
   y: n
-} : o === "bottom-right" ? {
+} : i === "bottom-right" ? {
   x: t,
   y: n
-} : { x: t / 2, y: n / 2 }, Wo = (o, t, n) => {
-  const s = n * (Math.PI / 180), a = Math.abs(o * Math.cos(s)) + Math.abs(t * Math.sin(s)), l = Math.abs(o * Math.sin(s)) + Math.abs(t * Math.cos(s));
+} : { x: t / 2, y: n / 2 }, Pi = (i, t, n) => {
+  const s = n * (Math.PI / 180), a = Math.abs(i * Math.cos(s)) + Math.abs(t * Math.sin(s)), l = Math.abs(i * Math.sin(s)) + Math.abs(t * Math.cos(s));
   return {
     width: Math.round(a),
     height: Math.round(l)
   };
-}, _e = (o) => "data:image/svg+xml," + encodeURIComponent(o).replace(/'/g, "%27").replace(/"/g, "%22"), Zo = ({ text: o, color: t, angleDegrees: n }) => {
+}, _e = (i) => "data:image/svg+xml," + encodeURIComponent(i).replace(/'/g, "%27").replace(/"/g, "%22"), Wi = ({ text: i, color: t, angleDegrees: n }) => {
   const s = document.createElement("div");
   s.style = `text-align:center;white-space:nowrap;line-height:100px;transform: rotate(${n}deg);position: absolute;top:0;left:0;opacity: 0;`;
   const a = document.createElement("span");
-  a.style.color = t, a.style.fontSize = "36px", a.innerText = o, s.append(a), document.body.append(s);
+  a.style.color = t, a.style.fontSize = "36px", a.innerText = i, s.append(a), document.body.append(s);
   const { width: l, height: h } = s.getBoundingClientRect();
   document.body.removeChild(s);
-  const f = Wo(l, h, n), d = `
+  const f = Pi(l, h, n), d = `
         <div xmlns="http://www.w3.org/1999/xhtml" style="text-align:center;white-space:nowrap;line-height:${f.height}px;transform:rotate(${n}deg);">
-            <span style="color:${t};font-size:36px;">${o}</span>
+            <span style="color:${t};font-size:36px;">${i}</span>
         </div>
     `, p = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 ${f.width} ${f.height}" width="${f.width}" height="${f.height}">
                 <foreignObject width="100%" height="100%">
@@ -858,17 +858,17 @@ const ge = Eo(
                 </foreignObject>
             </svg>`;
   return _e(p);
-}, Go = (o) => {
+}, Zi = (i) => {
   const t = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32" height="32">
                 <foreignObject width="100%" height="100%">
                     <div xmlns="http://www.w3.org/1999/xhtml" style="text-align:center;white-space:nowrap;line-height:32px;">
-                        <span style="color:#ffffff;font-size:18px;">${o}</span>
+                        <span style="color:#ffffff;font-size:18px;">${i}</span>
                     </div>
                 </foreignObject>
             </svg>`;
   return _e(t);
 };
-let xt, Fo = class {
+let xt, Fi = class {
   constructor() {
     R(this, "img", {});
     R(this, "invalid", !1);
@@ -880,6 +880,7 @@ let xt, Fo = class {
     R(this, "shapes", /* @__PURE__ */ new Map());
     R(this, "message", null);
     R(this, "theme", "light");
+    R(this, "clearFun", null);
     Tt(this);
   }
   get shapesList() {
@@ -894,19 +895,19 @@ let xt, Fo = class {
     return t || (this.message.info("Please add a image"), this.setInvalid()), t;
   }
   get nextStep() {
-    const t = this.shapesList.filter((s) => s.type === "Step"), n = uo(t, (s) => Number(s.text));
+    const t = this.shapesList.filter((s) => s.type === "Step"), n = pi(t, (s) => Number(s.text));
     return n != null && n.text ? Number(n.text) + 1 : 1;
   }
   get isDark() {
     return this.theme === "dark";
   }
   setTheme(t) {
-    t !== this.theme && ho(() => {
+    t !== this.theme && fi(() => {
       t ? this.theme = t : this.theme = this.isDark ? "light" : "dark";
     });
   }
   setInvalid() {
-    clearTimeout(xt), this.invalid = !0, xt = setTimeout(po(() => {
+    clearTimeout(xt), this.invalid = !0, xt = setTimeout(hi(() => {
       this.invalid = !1;
     }), 200);
   }
@@ -943,6 +944,9 @@ let xt, Fo = class {
   setStrokeWidth(t) {
     this.strokeWidth = t;
   }
+  setClearFun(t) {
+    this.clearFun = t;
+  }
   clearImg() {
     this.img = {};
   }
@@ -951,7 +955,7 @@ let xt, Fo = class {
     (t = this.app) == null || t.destroy(!0), this.app = null, this.shapes.clear(), this.setUseTool(null);
   }
 };
-const Lo = new Fo(), Q = {
+const Gi = new Fi(), Q = {
   default_1: {
     class: "bg-gradient-to-r from-indigo-500 via-purple-500 to-pink-500",
     fill: {
@@ -1338,7 +1342,7 @@ const Lo = new Fo(), Q = {
     }
   }
 };
-class Uo {
+class Li {
   constructor() {
     R(this, "scale", 1);
     R(this, "scaleX", !1);
@@ -1411,10 +1415,10 @@ class Uo {
     this.waterIndex = t;
   }
 }
-const Vo = new Uo(), i = {
-  editor: Lo,
-  option: Vo
-}, Jo = ({ disabled: o = !1, toSelect: t, locale: n = "en", theme: s = "auto" }) => {
+const Ui = new Li(), o = {
+  editor: Gi,
+  option: Ui
+}, Vi = ({ disabled: i = !1, toSelect: t, locale: n = "en", theme: s = "auto" }) => {
   const [a, l] = O(!1), h = () => {
     l(!1);
   }, f = (p) => {
@@ -1425,7 +1429,7 @@ const Vo = new Uo(), i = {
   return /* @__PURE__ */ e.jsx(
     xe,
     {
-      content: /* @__PURE__ */ e.jsx(go, { data: mo, locale: n, onEmojiSelect: d, previewPosition: "none", theme: s }),
+      content: /* @__PURE__ */ e.jsx(mi, { data: ui, locale: n, onEmojiSelect: d, previewPosition: "none", theme: s }),
       title: "",
       trigger: "click",
       open: a,
@@ -1435,13 +1439,13 @@ const Vo = new Uo(), i = {
         {
           type: "text",
           shape: "circle",
-          disabled: o,
+          disabled: i,
           icon: /* @__PURE__ */ e.jsx(M.Smile, { size: 16 })
         }
       )
     }
   );
-}, qo = () => /* @__PURE__ */ e.jsx("h1", { children: /* @__PURE__ */ e.jsxs("a", { href: "https://shoteasy.fun", target: "_blank", "aria-label": "ShotEasy", className: "flex gap-1 text-gray-700 dark:text-gray-300 items-center text-xs font-semibold", children: [
+}, Ji = () => /* @__PURE__ */ e.jsx("h1", { children: /* @__PURE__ */ e.jsxs("a", { href: "https://shoteasy.fun", target: "_blank", "aria-label": "ShotEasy", className: "flex gap-1 text-gray-700 dark:text-gray-300 items-center text-xs font-semibold", children: [
   /* @__PURE__ */ e.jsxs("svg", { width: "20", height: "20", viewBox: "0 0 510 510", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
     /* @__PURE__ */ e.jsxs("g", { filter: "url(#filter0_i_40_60)", children: [
       /* @__PURE__ */ e.jsx("path", { d: "M60.1774 83.172C64.1232 61.4358 84.9426 47.0139 106.679 50.9598L271.777 80.9308C293.513 84.8767 307.935 105.696 303.989 127.432L247.462 438.817C243.516 460.553 222.696 474.975 200.96 471.029L35.8623 441.058C14.1261 437.112 -0.295702 416.293 3.65017 394.557L60.1774 83.172Z", fill: "#812BED" }),
@@ -1461,44 +1465,44 @@ const Vo = new Uo(), i = {
     ] }) })
   ] }),
   /* @__PURE__ */ e.jsx("span", { children: "ShotEasy" })
-] }) }), Xo = ({ children: o }) => /* @__PURE__ */ e.jsxs("div", { className: "flex-1 flex justify-end items-end gap-2 dark:text-gray-300", children: [
-  o,
+] }) }), qi = ({ children: i }) => /* @__PURE__ */ e.jsxs("div", { className: "flex-1 flex justify-end items-end gap-2 dark:text-gray-300", children: [
+  i,
   /* @__PURE__ */ e.jsx("a", { href: "https://github.com/CH563/image-beautifier", target: "_blank", "aria-label": "GitHub", className: "block rounded-full p-2 hover:bg-slate-100 dark:hover:bg-slate-700", children: /* @__PURE__ */ e.jsx("svg", { viewBox: "64 64 896 896", focusable: "false", "data-icon": "github", width: "16", height: "16", fill: "currentColor", "aria-hidden": "true", children: /* @__PURE__ */ e.jsx("path", { d: "M511.6 76.3C264.3 76.2 64 276.4 64 523.5 64 718.9 189.3 885 363.8 946c23.5 5.9 19.9-10.8 19.9-22.2v-77.5c-135.7 15.9-141.2-73.9-150.3-88.9C215 726 171.5 718 184.5 703c30.9-15.9 62.4 4 98.9 57.9 26.4 39.1 77.9 32.5 104 26 5.7-23.5 17.9-44.5 34.7-60.8-140.6-25.2-199.2-111-199.2-213 0-49.5 16.3-95 48.3-131.7-20.4-60.5 1.9-112.3 4.9-120 58.1-5.2 118.5 41.6 123.2 45.3 33-8.9 70.7-13.6 112.9-13.6 42.4 0 80.2 4.9 113.5 13.9 11.3-8.6 67.3-48.8 121.3-43.9 2.9 7.7 24.7 58.3 5.5 118 32.4 36.8 48.9 82.7 48.9 132.3 0 102.2-59 188.1-200 212.9a127.5 127.5 0 0138.1 91v112.5c.8 9 0 17.9 15 17.9 177.1-59.7 304.6-227 304.6-424.1 0-247.2-200.4-447.3-447.5-447.3z" }) }) }),
   /* @__PURE__ */ e.jsx("a", { href: "https://twitter.com/LiWen563", target: "_blank", "aria-label": "twitter:@LiWen563", className: "block rounded-full p-2 dark:hover:bg-slate-700", children: /* @__PURE__ */ e.jsx("svg", { fill: "currentColor", viewBox: "0 0 24 24", width: "16", height: "16", "aria-hidden": "true", children: /* @__PURE__ */ e.jsx("g", { children: /* @__PURE__ */ e.jsx("path", { d: "M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z" }) }) }) })
-] }), Qo = ["Square", "SquareFill", "Circle", "Slash", "MoveDownLeft", "Pencil", "Step", "Smile"], $o = B(({ headLeft: o, headRight: t }) => {
+] }), Xi = ["Square", "SquareFill", "Circle", "Slash", "MoveDownLeft", "Pencil", "Step", "Smile"], Qi = B(({ headLeft: i, headRight: t }) => {
   const [n, s] = O(!1), a = (d) => {
-    if (!i.editor.isEditing) return;
-    const { useTool: p } = i.editor;
-    i.editor.setUseTool(p === d ? null : d), s(!1);
+    if (!o.editor.isEditing) return;
+    const { useTool: p } = o.editor;
+    o.editor.setUseTool(p === d ? null : d), s(!1);
   }, l = (d) => {
-    if (!i.editor.isEditing) return;
-    const p = i.option.frameConf.width / 2 - 24, m = i.option.frameConf.height / 2 - 24;
-    i.editor.setUseTool(null), s(!1), i.editor.addShape({
+    if (!o.editor.isEditing) return;
+    const p = o.option.frameConf.width / 2 - 24, m = o.option.frameConf.height / 2 - 24;
+    o.editor.setUseTool(null), s(!1), o.editor.addShape({
       id: ge(),
       type: "emoji",
       text: d,
-      zIndex: i.editor.shapes.size + 1,
+      zIndex: o.editor.shapes.size + 1,
       x: p,
       y: m,
       editable: !0
     });
   }, h = () => {
-    if (!i.editor.isEditing) return;
+    if (!o.editor.isEditing) return;
     const d = !n;
-    i.editor.setUseTool(null), s(d), i.editor.app.config.move.drag = d;
+    o.editor.setUseTool(null), s(d), o.editor.app.config.move.drag = d;
   }, f = () => {
-    i.editor.setTheme(), localStorage.setItem("SHOTEASY_BEAUTIFIER_THEME", i.editor.theme);
+    o.editor.setTheme(), localStorage.setItem("SHOTEASY_BEAUTIFIER_THEME", o.editor.theme);
   };
   return /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-center shrink-0 gap-3 bg-white dark:bg-black py-2 px-5 border-b border-b-gray-50 dark:border-b-gray-700 shadow-sm relative z-[11] select-none", children: [
-    /* @__PURE__ */ e.jsx("div", { className: "flex-1", children: o || /* @__PURE__ */ e.jsx(qo, {}) }),
-    /* @__PURE__ */ e.jsx("div", { className: "flex gap-1 justify-center items-center", children: Qo.map((d) => {
-      if (d === "Smile") return /* @__PURE__ */ e.jsx(Jo, { disabled: !1, theme: i.editor.isDark ? "dark" : "light", toSelect: l }, d);
+    /* @__PURE__ */ e.jsx("div", { className: "flex-1", children: i || /* @__PURE__ */ e.jsx(Ji, {}) }),
+    /* @__PURE__ */ e.jsx("div", { className: "flex gap-1 justify-center items-center", children: Xi.map((d) => {
+      if (d === "Smile") return /* @__PURE__ */ e.jsx(Vi, { disabled: !1, theme: o.editor.isDark ? "dark" : "light", toSelect: l }, d);
       let p;
       if (d.includes("Fill")) {
         const m = d.replace("Fill", ""), b = dt[m];
         p = /* @__PURE__ */ e.jsx(b, { size: 16, fill: "currentColor" });
       } else if (d === "Step")
-        p = /* @__PURE__ */ e.jsx("div", { className: "border text-xs border-black dark:border-white w-4 h-4 rounded-full text-center leading-4", children: i.editor.nextStep }, d);
+        p = /* @__PURE__ */ e.jsx("div", { className: "border text-xs border-black dark:border-white w-4 h-4 rounded-full text-center leading-4", children: o.editor.nextStep }, d);
       else {
         const m = dt[d];
         p = /* @__PURE__ */ e.jsx(m, { name: d, size: 16 });
@@ -1509,7 +1513,7 @@ const Vo = new Uo(), i = {
           type: "text",
           shape: "circle",
           icon: p,
-          className: i.editor.useTool === d && "text-[#1a79ff] [&_.border]:border-[#1a79ff] bg-sky-100/50 hover:bg-sky-100 hover:text-[#1a79ff] [&_.border]:hover:text-[#1a79ff]",
+          className: o.editor.useTool === d && "text-[#1a79ff] [&_.border]:border-[#1a79ff] bg-sky-100/50 hover:bg-sky-100 hover:text-[#1a79ff] [&_.border]:hover:text-[#1a79ff]",
           onClick: () => a(d)
         },
         d
@@ -1537,11 +1541,11 @@ const Vo = new Uo(), i = {
               ]
             }
           ],
-          value: i.editor.annotateColor,
-          onChange: (d) => i.editor.setAnnotateColor(d.toHexString())
+          value: o.editor.annotateColor,
+          onChange: (d) => o.editor.setAnnotateColor(d.toHexString())
         }
       ),
-      /* @__PURE__ */ e.jsx(_o, { defaultValue: i.editor.strokeWidth, onChange: (d) => i.editor.setStrokeWidth(d) }),
+      /* @__PURE__ */ e.jsx(zi, { defaultValue: o.editor.strokeWidth, onChange: (d) => o.editor.setStrokeWidth(d) }),
       /* @__PURE__ */ e.jsx(
         k,
         {
@@ -1553,96 +1557,96 @@ const Vo = new Uo(), i = {
         }
       )
     ] }),
-    t || /* @__PURE__ */ e.jsx(Xo, { children: /* @__PURE__ */ e.jsx(
+    t || /* @__PURE__ */ e.jsx(qi, { children: /* @__PURE__ */ e.jsx(
       k,
       {
         type: "text",
         shape: "circle",
-        icon: i.editor.isDark ? /* @__PURE__ */ e.jsx(M.Sun, { size: 16 }) : /* @__PURE__ */ e.jsx(M.Moon, { size: 16 }),
+        icon: o.editor.isDark ? /* @__PURE__ */ e.jsx(M.Sun, { size: 16 }) : /* @__PURE__ */ e.jsx(M.Moon, { size: 16 }),
         onClick: f
       }
     ) })
   ] });
 });
-function Ko(o) {
-  var t = typeof o;
-  return o != null && (t == "object" || t == "function");
+function $i(i) {
+  var t = typeof i;
+  return i != null && (t == "object" || t == "function");
 }
-var Ht = Ko, ei = typeof ue == "object" && ue && ue.Object === Object && ue, ti = ei, ri = ti, oi = typeof self == "object" && self && self.Object === Object && self, ii = ri || oi || Function("return this")(), zt = ii, si = zt, ni = function() {
-  return si.Date.now();
-}, ai = ni, li = /\s/;
-function ci(o) {
-  for (var t = o.length; t-- && li.test(o.charAt(t)); )
+var Ht = $i, Ki = typeof ue == "object" && ue && ue.Object === Object && ue, eo = Ki, to = eo, ro = typeof self == "object" && self && self.Object === Object && self, io = to || ro || Function("return this")(), zt = io, oo = zt, so = function() {
+  return oo.Date.now();
+}, no = so, ao = /\s/;
+function lo(i) {
+  for (var t = i.length; t-- && ao.test(i.charAt(t)); )
     ;
   return t;
 }
-var di = ci, fi = di, hi = /^\s+/;
-function pi(o) {
-  return o && o.slice(0, fi(o) + 1).replace(hi, "");
+var co = lo, fo = co, ho = /^\s+/;
+function po(i) {
+  return i && i.slice(0, fo(i) + 1).replace(ho, "");
 }
-var ui = pi, mi = zt, gi = mi.Symbol, _t = gi, bt = _t, Et = Object.prototype, xi = Et.hasOwnProperty, bi = Et.toString, se = bt ? bt.toStringTag : void 0;
-function wi(o) {
-  var t = xi.call(o, se), n = o[se];
+var uo = po, mo = zt, go = mo.Symbol, _t = go, bt = _t, Et = Object.prototype, xo = Et.hasOwnProperty, bo = Et.toString, se = bt ? bt.toStringTag : void 0;
+function wo(i) {
+  var t = xo.call(i, se), n = i[se];
   try {
-    o[se] = void 0;
+    i[se] = void 0;
     var s = !0;
   } catch {
   }
-  var a = bi.call(o);
-  return s && (t ? o[se] = n : delete o[se]), a;
+  var a = bo.call(i);
+  return s && (t ? i[se] = n : delete i[se]), a;
 }
-var yi = wi, vi = Object.prototype, ji = vi.toString;
-function Mi(o) {
-  return ji.call(o);
+var yo = wo, vo = Object.prototype, jo = vo.toString;
+function Mo(i) {
+  return jo.call(i);
 }
-var Ci = Mi, wt = _t, ki = yi, Ai = Ci, Ni = "[object Null]", Ti = "[object Undefined]", yt = wt ? wt.toStringTag : void 0;
-function Si(o) {
-  return o == null ? o === void 0 ? Ti : Ni : yt && yt in Object(o) ? ki(o) : Ai(o);
+var Co = Mo, wt = _t, ko = yo, Ao = Co, No = "[object Null]", To = "[object Undefined]", yt = wt ? wt.toStringTag : void 0;
+function So(i) {
+  return i == null ? i === void 0 ? To : No : yt && yt in Object(i) ? ko(i) : Ao(i);
 }
-var Ri = Si;
-function Di(o) {
-  return o != null && typeof o == "object";
+var Ro = So;
+function Do(i) {
+  return i != null && typeof i == "object";
 }
-var Hi = Di, zi = Ri, _i = Hi, Ei = "[object Symbol]";
-function Oi(o) {
-  return typeof o == "symbol" || _i(o) && zi(o) == Ei;
+var Ho = Do, zo = Ro, _o = Ho, Eo = "[object Symbol]";
+function Oo(i) {
+  return typeof i == "symbol" || _o(i) && zo(i) == Eo;
 }
-var Bi = Oi, Yi = ui, vt = Ht, Ii = Bi, jt = NaN, Pi = /^[-+]0x[0-9a-f]+$/i, Wi = /^0b[01]+$/i, Zi = /^0o[0-7]+$/i, Gi = parseInt;
-function Fi(o) {
-  if (typeof o == "number")
-    return o;
-  if (Ii(o))
+var Bo = Oo, Yo = uo, vt = Ht, Io = Bo, jt = NaN, Po = /^[-+]0x[0-9a-f]+$/i, Wo = /^0b[01]+$/i, Zo = /^0o[0-7]+$/i, Fo = parseInt;
+function Go(i) {
+  if (typeof i == "number")
+    return i;
+  if (Io(i))
     return jt;
-  if (vt(o)) {
-    var t = typeof o.valueOf == "function" ? o.valueOf() : o;
-    o = vt(t) ? t + "" : t;
+  if (vt(i)) {
+    var t = typeof i.valueOf == "function" ? i.valueOf() : i;
+    i = vt(t) ? t + "" : t;
   }
-  if (typeof o != "string")
-    return o === 0 ? o : +o;
-  o = Yi(o);
-  var n = Wi.test(o);
-  return n || Zi.test(o) ? Gi(o.slice(2), n ? 2 : 8) : Pi.test(o) ? jt : +o;
+  if (typeof i != "string")
+    return i === 0 ? i : +i;
+  i = Yo(i);
+  var n = Wo.test(i);
+  return n || Zo.test(i) ? Fo(i.slice(2), n ? 2 : 8) : Po.test(i) ? jt : +i;
 }
-var Li = Fi, Ui = Ht, He = ai, Mt = Li, Vi = "Expected a function", Ji = Math.max, qi = Math.min;
-function Xi(o, t, n) {
+var Lo = Go, Uo = Ht, He = no, Mt = Lo, Vo = "Expected a function", Jo = Math.max, qo = Math.min;
+function Xo(i, t, n) {
   var s, a, l, h, f, d, p = 0, m = !1, b = !1, C = !0;
-  if (typeof o != "function")
-    throw new TypeError(Vi);
-  t = Mt(t) || 0, Ui(n) && (m = !!n.leading, b = "maxWait" in n, l = b ? Ji(Mt(n.maxWait) || 0, t) : l, C = "trailing" in n ? !!n.trailing : C);
+  if (typeof i != "function")
+    throw new TypeError(Vo);
+  t = Mt(t) || 0, Uo(n) && (m = !!n.leading, b = "maxWait" in n, l = b ? Jo(Mt(n.maxWait) || 0, t) : l, C = "trailing" in n ? !!n.trailing : C);
   function A(D) {
-    var G = s, U = a;
-    return s = a = void 0, p = D, h = o.apply(U, G), h;
+    var F = s, U = a;
+    return s = a = void 0, p = D, h = i.apply(U, F), h;
   }
   function x(D) {
     return p = D, f = setTimeout(_, t), m ? A(D) : h;
   }
   function w(D) {
-    var G = D - d, U = D - p, K = t - G;
-    return b ? qi(K, l - U) : K;
+    var F = D - d, U = D - p, K = t - F;
+    return b ? qo(K, l - U) : K;
   }
   function S(D) {
-    var G = D - d, U = D - p;
-    return d === void 0 || G >= t || G < 0 || b && U >= l;
+    var F = D - d, U = D - p;
+    return d === void 0 || F >= t || F < 0 || b && U >= l;
   }
   function _() {
     var D = He();
@@ -1660,8 +1664,8 @@ function Xi(o, t, n) {
     return f === void 0 ? h : E(He());
   }
   function $() {
-    var D = He(), G = S(D);
-    if (s = arguments, a = this, d = D, G) {
+    var D = He(), F = S(D);
+    if (s = arguments, a = this, d = D, F) {
       if (f === void 0)
         return x(d);
       if (b)
@@ -1671,15 +1675,15 @@ function Xi(o, t, n) {
   }
   return $.cancel = ye, $.flush = ve, $;
 }
-var Qi = Xi;
-const $i = /* @__PURE__ */ Ro(Qi), Ki = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAIAAAAlC+aJAAAACXBIWXMAAAsTAAALEwEAmpwYAAAFHGlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDUgNzkuMTYzNDk5LCAyMDE4LzA4LzEzLTE2OjQwOjIyICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxOSAoV2luZG93cykiIHhtcDpDcmVhdGVEYXRlPSIyMDI0LTA0LTE1VDEyOjUwOjI3KzA4OjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAyNC0wNC0xNVQxMjo1MzowOSswODowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAyNC0wNC0xNVQxMjo1MzowOSswODowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHBob3Rvc2hvcDpDb2xvck1vZGU9IjMiIHBob3Rvc2hvcDpJQ0NQcm9maWxlPSJzUkdCIElFQzYxOTY2LTIuMSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDoxNTY3NDQxZC1lYmQx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", es = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAOxAAADsQBlSsOGwAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAPqSURBVFiFxdZ/TFVlGMDx7/seLnjFewE3B1xwM62tlGJYSCIBBbv2g8JMakaptZpzi2T2Y/lPqzblnzYG/cVG2tJ+mavl1qZm05rSykEO0QDBgIvA5e4yvRe4F7ic0x90b5d7D4JwWM9f55w9z57P+7xn7zmkHRj4Ie3AQBH/U8SgUrPCohx/97z3aFqiqQ20YdCGhSpvTSqqB5ThSx3t7oOl9zsXAyAAPrkwUptqlRV6CT6fv6dye1HqePL63d6G+sNGAySAzapc023u9/dWbtuY7u5sMo00Hfs09a0L+YsC0ITm0W1elmdz97RKACVppVCWrzmRfnAgx3iApnl1m3ddkcFn5nvtAAlonDISMbU6ZAjg8/t7K5/bOK05QGx6VvDSUMTUBFTVG2q+bVNo7NMSLSnht4YhpgAxije08u6rUc1zcvN446kMMm0mwxESoKWt1bX3hUeT9Vaek5vHiVPn2FOYwqGyJErXmSMRJ1dW9WcvCPDB1szBMVvOTmlO0CITHil4DCmnXFLA+8WWSESipoqf5juJ0IpHztd9Zc4q2yGXWKchfjl7BlVV/yvQR8x7O5TwmwlHU/PSh3e1T7o6tmqBMQHQ1+vgRq+DzU8+gxACACGgYE0cQ6MqV52BYPkSoMxa/PZZz88f35gXAGCip7ElEtHSfIn+oWHsdjv/GhBA3l0LR0QBQogNL3dOujqeDSIuN/6G954yCteuMBShCwD97bjS2o5n9RYKVscZhpgRANHbEXBfp2vZQ7hi0g1D3BYQQoRtx7ijEUd6KU5frCGIWQEwfTsmPf1iou8yDlsJzhHIj0BsWhXHX4MBem5OzgkxJ0DkJCYG20XA/TfdywtxjsrpCAGxMYLT7WPh5TMioo7e28VIQ/3RZdnlO6Q5QRtt/p7BuhK+a+jkozNe1LDjq9Md0CtPQOPkkeoj68MfijsBBCM+b/d2X+PXX6i+W0KaE7DkV/BEeQVbMq1cdweovzjKeCDqVKdeOX5us7iWhWSzeKfm93kDAOJzX3vJ13Tsc9XvEQBKYhrxD76I+b7HMaWui8r/TPn21yLREfylu4mqFYv9tY3zBughgqEkphFrewDFmoqIXcqXhSl/lMS7NkSU96GOZ8z5JdQLvcMKQPN7Cbg6GO/9kzp7RtfzKYHokYAFIX0LAoD+tyMYh19/tWvX3ZZVMxYLEb9gwEyIWZtPhWYIIBJx6JXy7jk0B0Hbgl5CvXhvZ4W9aq38BkicPVt8aDgAQKvam43k9CyIfkwy445OwrmG2F9zEVUrBvpmbK5qT4t91UOLMoFgaFV7kpCmN0GUAMmAE8SPmESt2Fc9BPAP1KEkwmzcLhwAAAAASUVORK5CYII=", ts = (o, t) => t instanceof Array ? t.map((n) => it.toArray(n).map(
-  (s) => st(s, { ...o })
-)) : it.toArray(t).map(
-  (s) => st(s, { ...o })
-), rs = ({ width: o, height: t, background: n, parent: s, children: a, cursor: l }) => {
+var Qo = Xo;
+const $o = /* @__PURE__ */ Si(Qo), Ko = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAIAAAAlC+aJAAAACXBIWXMAAAsTAAALEwEAmpwYAAAFHGlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDUgNzkuMTYzNDk5LCAyMDE4LzA4LzEzLTE2OjQwOjIyICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxOSAoV2luZG93cykiIHhtcDpDcmVhdGVEYXRlPSIyMDI0LTA0LTE1VDEyOjUwOjI3KzA4OjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAyNC0wNC0xNVQxMjo1MzowOSswODowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAyNC0wNC0xNVQxMjo1MzowOSswODowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHBob3Rvc2hvcDpDb2xvck1vZGU9IjMiIHBob3Rvc2hvcDpJQ0NQcm9maWxlPSJzUkdCIElFQzYxOTY2LTIuMSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDoxNTY3NDQxZC1lYmQx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", es = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAOxAAADsQBlSsOGwAAABl0RVh0U29mdHdhcmUAd3d3Lmlua3NjYXBlLm9yZ5vuPBoAAAPqSURBVFiFxdZ/TFVlGMDx7/seLnjFewE3B1xwM62tlGJYSCIBBbv2g8JMakaptZpzi2T2Y/lPqzblnzYG/cVG2tJ+mavl1qZm05rSykEO0QDBgIvA5e4yvRe4F7ic0x90b5d7D4JwWM9f55w9z57P+7xn7zmkHRj4Ie3AQBH/U8SgUrPCohx/97z3aFqiqQ20YdCGhSpvTSqqB5ThSx3t7oOl9zsXAyAAPrkwUptqlRV6CT6fv6dye1HqePL63d6G+sNGAySAzapc023u9/dWbtuY7u5sMo00Hfs09a0L+YsC0ITm0W1elmdz97RKACVppVCWrzmRfnAgx3iApnl1m3ddkcFn5nvtAAlonDISMbU6ZAjg8/t7K5/bOK05QGx6VvDSUMTUBFTVG2q+bVNo7NMSLSnht4YhpgAxije08u6rUc1zcvN446kMMm0mwxESoKWt1bX3hUeT9Vaek5vHiVPn2FOYwqGyJErXmSMRJ1dW9WcvCPDB1szBMVvOTmlO0CITHil4DCmnXFLA+8WWSESipoqf5juJ0IpHztd9Zc4q2yGXWKchfjl7BlVV/yvQR8x7O5TwmwlHU/PSh3e1T7o6tmqBMQHQ1+vgRq+DzU8+gxACACGgYE0cQ6MqV52BYPkSoMxa/PZZz88f35gXAGCip7ElEtHSfIn+oWHsdjv/GhBA3l0LR0QBQogNL3dOujqeDSIuN/6G954yCteuMBShCwD97bjS2o5n9RYKVscZhpgRANHbEXBfp2vZQ7hi0g1D3BYQQoRtx7ijEUd6KU5frCGIWQEwfTsmPf1iou8yDlsJzhHIj0BsWhXHX4MBem5OzgkxJ0DkJCYG20XA/TfdywtxjsrpCAGxMYLT7WPh5TMioo7e28VIQ/3RZdnlO6Q5QRtt/p7BuhK+a+jkozNe1LDjq9Md0CtPQOPkkeoj68MfijsBBCM+b/d2X+PXX6i+W0KaE7DkV/BEeQVbMq1cdweovzjKeCDqVKdeOX5us7iWhWSzeKfm93kDAOJzX3vJ13Tsc9XvEQBKYhrxD76I+b7HMaWui8r/TPn21yLREfylu4mqFYv9tY3zBughgqEkphFrewDFmoqIXcqXhSl/lMS7NkSU96GOZ8z5JdQLvcMKQPN7Cbg6GO/9kzp7RtfzKYHokYAFIX0LAoD+tyMYh19/tWvX3ZZVMxYLEb9gwEyIWZtPhWYIIBJx6JXy7jk0B0Hbgl5CvXhvZ4W9aq38BkicPVt8aDgAQKvam43k9CyIfkwy445OwrmG2F9zEVUrBvpmbK5qT4t91UOLMoFgaFV7kpCmN0GUAMmAE8SPmESt2Fc9BPAP1KEkwmzcLhwAAAAASUVORK5CYII=", ts = (i, t) => t instanceof Array ? t.map((n) => ot.toArray(n).map(
+  (s) => st(s, { ...i })
+)) : ot.toArray(t).map(
+  (s) => st(s, { ...i })
+), rs = ({ width: i, height: t, background: n, parent: s, children: a, cursor: l }) => {
   const h = le(() => {
-    const f = new xo({
-      width: o,
+    const f = new gi({
+      width: i,
       height: t,
       overflow: "hide",
       fill: n,
@@ -1688,21 +1692,21 @@ const $i = /* @__PURE__ */ Ro(Qi), Ki = "data:image/png;base64,iVBORw0KGgoAAAANS
     return f.name = "frame", f;
   }, []);
   return N(() => {
-    h.width = o, h.height = t, h.fill = n;
-  }, [o, t, n]), N(() => {
+    h.width = i, h.height = t, h.fill = n;
+  }, [i, t, n]), N(() => {
     h.cursor = l || "auto";
   }, [l]), N(() => (s.add(h), () => {
     h.remove();
   }), [s]), /* @__PURE__ */ e.jsx(e.Fragment, { children: ts({ parent: h }, a) });
-}, os = `
+}, is = `
 <svg width="43" height="32" viewBox="0 0 52 38" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6 24.75C9.17564 24.75 11.75 22.1756 11.75 19C11.75 15.8244 9.17564 13.25 6 13.25C2.82436 13.25 0.25 15.8244 0.25 19C0.25 22.1756 2.82436 24.75 6 24.75Z" fill="#FF5F57" stroke="black" stroke-opacity="0.2" stroke-width="0.5"></path><path d="M26 24.75C29.1756 24.75 31.75 22.1756 31.75 19C31.75 15.8244 29.1756 13.25 26 13.25C22.8244 13.25 20.25 15.8244 20.25 19C20.25 22.1756 22.8244 24.75 26 24.75Z" fill="#FEBC2E" stroke="black" stroke-opacity="0.2" stroke-width="0.5"></path><path d="M46 24.75C49.1756 24.75 51.75 22.1756 51.75 19C51.75 15.8244 49.1756 13.25 46 13.25C42.8244 13.25 40.25 15.8244 40.25 19C40.25 22.1756 42.8244 24.75 46 24.75Z" fill="#28C840" stroke="black" stroke-opacity="0.2" stroke-width="0.5"></path></svg>
-`, is = _e(os), ss = B(({ parent: o }) => {
+`, os = _e(is), ss = B(({ parent: i }) => {
   const t = ne(null), [n, s, a] = le(() => {
     const l = new ae({
       origin: "center",
       fill: {
         type: "image",
-        url: i.editor.img.src
+        url: o.editor.img.src
       }
     }), h = new ft({
       overflow: "hide",
@@ -1715,14 +1719,14 @@ const $i = /* @__PURE__ */ Ro(Qi), Ki = "data:image/png;base64,iVBORw0KGgoAAAANS
       children: [h]
     });
     return [l, h, f];
-  }, [o]);
+  }, [i]);
   return N(() => {
-    i.option.padding === 0 ? s.fill = "#ffffff00" : s.fill = i.option.paddingBg;
-  }, [i.option.paddingBg, i.option.padding]), N(() => {
-    const { round: l } = i.option;
+    o.option.padding === 0 ? s.fill = "#ffffff00" : s.fill = o.option.paddingBg;
+  }, [o.option.paddingBg, o.option.padding]), N(() => {
+    const { round: l } = o.option;
     a.cornerRadius = l, t.current ? (t.current.cornerRadius = [l, l, 0, 0], s.cornerRadius = [0, 0, l, l], n.cornerRadius = [0, 0, l, l]) : (s.cornerRadius = l, n.cornerRadius = l);
-  }, [i.option.round]), N(() => {
-    const { shadow: l } = i.option;
+  }, [o.option.round]), N(() => {
+    const { shadow: l } = o.option;
     l === 0 ? a.shadow = null : a.shadow = {
       x: l * 4,
       y: l * 4,
@@ -1730,16 +1734,16 @@ const $i = /* @__PURE__ */ Ro(Qi), Ki = "data:image/png;base64,iVBORw0KGgoAAAANS
       color: "#00000045",
       box: !0
     };
-  }, [i.option.shadow]), N(() => {
-    a.scale = i.option.scale;
-  }, [i.option.scale]), N(() => {
-    n.url = i.editor.img.src;
-  }, [i.editor.img.src]), N(() => {
-    n.scaleX = i.option.scaleX ? -1 : 1;
-  }, [i.option.scaleX]), N(() => {
-    n.scaleY = i.option.scaleY ? -1 : 1;
-  }, [i.option.scaleY]), N(() => {
-    const { align: l, round: h, frame: f, frameConf: d } = i.option, p = we(d.width, d.height), { width: m, height: b } = Yo(i.editor.img.width, i.editor.img.height, d.width - p, d.height - p);
+  }, [o.option.shadow]), N(() => {
+    a.scale = o.option.scale;
+  }, [o.option.scale]), N(() => {
+    n.url = o.editor.img.src;
+  }, [o.editor.img.src]), N(() => {
+    n.scaleX = o.option.scaleX ? -1 : 1;
+  }, [o.option.scaleX]), N(() => {
+    n.scaleY = o.option.scaleY ? -1 : 1;
+  }, [o.option.scaleY]), N(() => {
+    const { align: l, round: h, frame: f, frameConf: d } = o.option, p = we(d.width, d.height), { width: m, height: b } = Bi(o.editor.img.width, o.editor.img.height, d.width - p, d.height - p);
     let C = b;
     switch (f) {
       case "light":
@@ -1759,44 +1763,44 @@ const $i = /* @__PURE__ */ Ro(Qi), Ki = "data:image/png;base64,iVBORw0KGgoAAAANS
           draggable: !0,
           fill: [
             { type: "solid", color: f.includes("Dark") ? "#3a3a3b" : "#ffffff" },
-            { type: "image", url: is, format: "svg", mode: "clip", offset: { x: 10, y: 0 } }
+            { type: "image", url: os, format: "svg", mode: "clip", offset: { x: 10, y: 0 } }
           ]
         }), a.addAfter(t.current, s), s.cornerRadius = [0, 0, h, h], n.cornerRadius = [0, 0, h, h];
         break;
       default:
         a.strokeWidth = null, a.stroke = null;
     }
-    const { x: A, y: x } = Po(l, d.width - m, d.height - C);
+    const { x: A, y: x } = Ii(l, d.width - m, d.height - C);
     a.width = m, a.height = C, a.origin = l, a.x = A, a.y = x, s.width = m, s.height = b, s.x = 0, s.y = C - b;
-    const w = m - i.option.padding, S = Math.round(w * b / m);
-    return n.width = w + 2, n.height = S + 2, n.x = i.option.padding / 2 - 1, n.y = (b - S) / 2 - 1, () => {
+    const w = m - o.option.padding, S = Math.round(w * b / m);
+    return n.width = w + 2, n.height = S + 2, n.x = o.option.padding / 2 - 1, n.y = (b - S) / 2 - 1, () => {
       var _;
-      a.strokeWidth = null, a.stroke = null, (_ = t.current) == null || _.remove(), t.current = null, s.cornerRadius = i.option.round, n.cornerRadius = i.option.round;
+      a.strokeWidth = null, a.stroke = null, (_ = t.current) == null || _.remove(), t.current = null, s.cornerRadius = o.option.round, n.cornerRadius = o.option.round;
     };
-  }, [i.option.frameConf.width, i.option.frameConf.height, i.option.padding, i.option.align, i.option.frame]), N(() => (o.add(a), () => {
+  }, [o.option.frameConf.width, o.option.frameConf.height, o.option.padding, o.option.align, o.option.frame]), N(() => (i.add(a), () => {
     a.remove();
-  }), [o]), null;
-}), ns = B(({ parent: o }) => {
+  }), [i]), null;
+}), ns = B(({ parent: i }) => {
   const t = le(() => new ae({
     x: 0,
     y: 0
-  }), [o]);
+  }), [i]);
   return N(() => {
-    t.width = i.option.frameConf.width, t.height = i.option.frameConf.height;
-  }, [i.option.frameConf.width, i.option.frameConf.height]), N(() => {
-    t.zIndex = i.option.waterIndex;
-  }, [i.option.waterIndex]), N(() => {
+    t.width = o.option.frameConf.width, t.height = o.option.frameConf.height;
+  }, [o.option.frameConf.width, o.option.frameConf.height]), N(() => {
+    t.zIndex = o.option.waterIndex;
+  }, [o.option.waterIndex]), N(() => {
     t.fill = {
       type: "image",
-      url: i.option.waterSvg,
+      url: o.option.waterSvg,
       mode: "repeat",
       format: "svg",
-      size: Math.round(i.option.frameConf.width / 6)
+      size: Math.round(o.option.frameConf.width / 6)
     };
-  }, [i.option.waterSvg, i.option.frameConf.width]), N(() => (o.add(t), () => {
+  }, [o.option.waterSvg, o.option.frameConf.width]), N(() => (i.add(t), () => {
     t.remove();
   }), []), null;
-}), as = ({ parent: o, type: t, id: n, width: s, height: a, x: l, y: h, fill: f, strokeWidth: d, zIndex: p, points: m, editable: b, text: C }) => {
+}), as = ({ parent: i, type: t, id: n, width: s, height: a, x: l, y: h, fill: f, strokeWidth: d, zIndex: p, points: m, editable: b, text: C }) => {
   const A = le(() => {
     const x = { id: n, x: l, y: h, zIndex: p };
     return t === "SquareFill" ? new ae({
@@ -1817,7 +1821,7 @@ const $i = /* @__PURE__ */ Ro(Qi), Ki = "data:image/png;base64,iVBORw0KGgoAAAANS
       zIndex: p,
       stroke: f,
       strokeWidth: d
-    }) : t === "MoveDownLeft" ? new Ao({
+    }) : t === "MoveDownLeft" ? new ki({
       id: n,
       points: m,
       zIndex: p,
@@ -1854,12 +1858,12 @@ const $i = /* @__PURE__ */ Ro(Qi), Ki = "data:image/png;base64,iVBORw0KGgoAAAANS
         },
         {
           type: "image",
-          url: Go(C),
+          url: Zi(C),
           format: "svg",
           align: "center"
         }
       ]
-    }) : t === "emoji" ? new bo({
+    }) : t === "emoji" ? new xi({
       id: n,
       zIndex: p,
       text: C,
@@ -1873,29 +1877,29 @@ const $i = /* @__PURE__ */ Ro(Qi), Ki = "data:image/png;base64,iVBORw0KGgoAAAANS
       height: a,
       ...x
     });
-  }, [o]);
+  }, [i]);
   return N(() => {
     ["Slash", "MoveDownLeft", "Pencil"].includes(t) ? A.points = m : t === "Step" || (A.x = l, A.y = h, A.width = s, A.height = a);
   }, [l, h, s, a]), N(() => {
     A.editable = !!b;
-  }, [b]), N(() => (o.add(A), () => {
+  }, [b]), N(() => (i.add(A), () => {
     A.remove();
-  }), [o]), null;
+  }), [i]), null;
 }, ls = B(() => (N(() => {
-  const o = (s) => {
+  const i = (s) => {
     var l;
-    const { list: a } = (l = i.editor.app) == null ? void 0 : l.editor;
+    const { list: a } = (l = o.editor.app) == null ? void 0 : l.editor;
     if (a != null && a.length) {
       for (let h of a)
-        h.remove(), i.editor.removeShape(h);
-      i.editor.app.editor.cancel();
+        h.remove(), o.editor.removeShape(h);
+      o.editor.app.editor.cancel();
     }
   }, t = (s) => {
     var a, l;
-    s === "fit" ? (a = i.editor.app) == null || a.tree.zoom(s, 100) : (l = i.editor.app) == null || l.tree.zoom(s), i.editor.setScale(i.editor.app.tree.scale);
+    s === "fit" ? (a = o.editor.app) == null || a.tree.zoom(s, 100) : (l = o.editor.app) == null || l.tree.zoom(s), o.editor.setScale(o.editor.app.tree.scale);
   }, n = Rt(window, {
-    Backspace: o,
-    Delete: o,
+    Backspace: i,
+    Delete: i,
     "$mod+Minus": (s) => {
       s.preventDefault(), t("out");
     },
@@ -1910,12 +1914,12 @@ const $i = /* @__PURE__ */ Ro(Qi), Ki = "data:image/png;base64,iVBORw0KGgoAAAANS
     n();
   };
 }, [window]), null));
-wo.set("pencil", { url: es });
-const cs = B(({ target: o }) => {
+bi.set("pencil", { url: es });
+const cs = B(({ target: i }) => {
   var t, n;
   return N(() => {
-    const s = new yo({
-      view: o,
+    const s = new wi({
+      view: i,
       editor: {
         lockRatio: "corner",
         stroke: "#3f99f7",
@@ -1927,7 +1931,7 @@ const cs = B(({ target: o }) => {
           height: 20,
           fill: {
             type: "image",
-            url: Ki
+            url: Ko
           }
         }
       },
@@ -1939,71 +1943,71 @@ const cs = B(({ target: o }) => {
         usePartRender: !0
       }
     });
-    new No(s), i.editor.setApp(s), s.tree.on(vo.ZOOM, () => {
-      i.editor.setScale(s.tree.scale);
-    }), s.tree.on(jo.RESIZE, () => {
-      i.editor.setScale(s.tree.scale);
+    new Ai(s), o.editor.setApp(s), s.tree.on(yi.ZOOM, () => {
+      o.editor.setScale(s.tree.scale);
+    }), s.tree.on(vi.RESIZE, () => {
+      o.editor.setScale(s.tree.scale);
     });
     let a = null;
     const l = (f) => {
-      if (!i.editor.useTool) return;
+      if (!o.editor.useTool) return;
       const { target: d } = f;
-      if (i.editor.getShape(d.id)) return;
+      if (o.editor.getShape(d.id)) return;
       a = ge();
-      const m = f.getPageBounds ? f.getPageBounds() : f.getPage(), b = i.editor.useTool;
+      const m = f.getPageBounds ? f.getPageBounds() : f.getPage(), b = o.editor.useTool;
       return {
         id: a,
         type: b,
-        fill: i.editor.annotateColor,
-        strokeWidth: i.editor.strokeWidth,
-        zIndex: i.editor.shapes.size + 1,
+        fill: o.editor.annotateColor,
+        strokeWidth: o.editor.strokeWidth,
+        zIndex: o.editor.shapes.size + 1,
         ...m
       };
     };
-    s.tree.on(Mo.DOWN, (f) => {
-      if (i.editor.useTool !== "Step") return;
+    s.tree.on(ji.DOWN, (f) => {
+      if (o.editor.useTool !== "Step") return;
       const p = l(f);
-      p && (p.text = i.editor.nextStep, p.editable = !0, i.editor.addShape(p), a = null, i.editor.setUseTool(null));
+      p && (p.text = o.editor.nextStep, p.editable = !0, o.editor.addShape(p), a = null, o.editor.setUseTool(null));
     }), s.tree.on(De.START, (f) => {
-      const d = i.editor.useTool;
+      const d = o.editor.useTool;
       if (d === "Step") return;
       const p = l(f);
-      p && (["Slash", "MoveDownLeft", "Pencil"].includes(d) && (p.points = [p.x, p.y]), i.editor.addShape(p));
+      p && (["Slash", "MoveDownLeft", "Pencil"].includes(d) && (p.points = [p.x, p.y]), o.editor.addShape(p));
     }), s.tree.on(De.DRAG, (f) => {
-      if (!i.editor.useTool || !a) return;
-      const d = i.editor.getShape(a);
+      if (!o.editor.useTool || !a) return;
+      const d = o.editor.getShape(a);
       if (!d) return;
       const p = f.getPageBounds(), m = Object.assign({}, d, p), { points: b, type: C } = m;
       if (b && b.length) {
         const { x: A, y: x } = f.getInnerTotal(), w = A > 0 ? p.x + A : p.x, S = x > 0 ? p.y + x : p.y;
         C === "Pencil" ? m.points = [...b, w, S] : m.points = [b[0], b[1], w, S];
       }
-      i.editor.addShape(m);
+      o.editor.addShape(m);
     }), s.tree.on(De.END, () => {
-      if (!i.editor.useTool || !a) return;
-      const f = i.editor.getShape(a);
-      f && ((f.width === 0 || f.height === 0) && !["Slash", "MoveDownLeft", "Pencil"].includes(f.type) ? i.editor.removeShape(f) : i.editor.addShape(Object.assign({}, f, { editable: !0 }))), a = null, i.editor.useTool !== "Pencil" && i.editor.setUseTool(null);
+      if (!o.editor.useTool || !a) return;
+      const f = o.editor.getShape(a);
+      f && ((f.width === 0 || f.height === 0) && !["Slash", "MoveDownLeft", "Pencil"].includes(f.type) ? o.editor.removeShape(f) : o.editor.addShape(Object.assign({}, f, { editable: !0 }))), a = null, o.editor.useTool !== "Pencil" && o.editor.setUseTool(null);
     });
-    const h = $i(() => {
-      const { width: f, height: d } = o.getBoundingClientRect();
-      s.tree.zoom("fit", 100), i.option.frameConf.width < f && i.option.frameConf.height < d && s.tree.zoom(1);
+    const h = $o(() => {
+      const { width: f, height: d } = i.getBoundingClientRect();
+      s.tree.zoom("fit", 100), o.option.frameConf.width < f && o.option.frameConf.height < d && s.tree.zoom(1);
     }, 10);
-    return Co(o, h), () => {
-      ko(o, h), i.editor.destroy();
+    return Mi(i, h), () => {
+      Ci(i, h), o.editor.destroy();
     };
-  }, [o]), N(() => {
+  }, [i]), N(() => {
     const s = setTimeout(() => {
-      const { width: a, height: l } = o.getBoundingClientRect();
-      i.editor.app.tree.zoom("fit", 100), i.option.frameConf.width < a && i.option.frameConf.height < l && i.editor.app.tree.zoom(1), i.editor.setScale(i.editor.app.tree.scale);
+      const { width: a, height: l } = i.getBoundingClientRect();
+      o.editor.app.tree.zoom("fit", 100), o.option.frameConf.width < a && o.option.frameConf.height < l && o.editor.app.tree.zoom(1), o.editor.setScale(o.editor.app.tree.scale);
     }, 20);
     return () => {
       clearTimeout(s);
     };
-  }, [i.option.frameConf.width, i.option.frameConf.height]), (t = i.editor.app) != null && t.tree ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-    /* @__PURE__ */ e.jsxs(rs, { parent: i.editor.app.tree, cursor: i.editor.cursor, ...i.option.frameConf, children: [
-      i.editor.shapesList.map((s) => /* @__PURE__ */ e.jsx(as, { ...s }, s.id)),
-      ((n = i.editor.img) == null ? void 0 : n.src) && /* @__PURE__ */ e.jsx(ss, {}),
-      i.option.waterImg && /* @__PURE__ */ e.jsx(ns, {})
+  }, [o.option.frameConf.width, o.option.frameConf.height]), (t = o.editor.app) != null && t.tree ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+    /* @__PURE__ */ e.jsxs(rs, { parent: o.editor.app.tree, cursor: o.editor.cursor, ...o.option.frameConf, children: [
+      o.editor.shapesList.map((s) => /* @__PURE__ */ e.jsx(as, { ...s }, s.id)),
+      ((n = o.editor.img) == null ? void 0 : n.src) && /* @__PURE__ */ e.jsx(ss, {}),
+      o.option.waterImg && /* @__PURE__ */ e.jsx(ns, {})
     ] }),
     /* @__PURE__ */ e.jsx(ls, {})
   ] }) : null;
@@ -2025,29 +2029,29 @@ const cs = B(({ target: o }) => {
     label: "200%"
   }
 ], fs = B(() => {
-  const o = (n) => {
+  const i = (n) => {
     var s;
-    (s = i.editor.app) == null || s.tree.zoom(n), i.editor.setScale(i.editor.app.tree.scale);
+    (s = o.editor.app) == null || s.tree.zoom(n), o.editor.setScale(o.editor.app.tree.scale);
   }, t = (n) => {
     var a, l;
     const s = Number(n.key);
-    s === 4 ? (a = i.editor.app) == null || a.tree.zoom("fit", 100) : (l = i.editor.app) == null || l.tree.zoom(s), i.editor.setScale(i.editor.app.tree.scale);
+    s === 4 ? (a = o.editor.app) == null || a.tree.zoom("fit", 100) : (l = o.editor.app) == null || l.tree.zoom(s), o.editor.setScale(o.editor.app.tree.scale);
   };
   return /* @__PURE__ */ e.jsxs("div", { className: "absolute z-10 bottom-4 gap-2 right-4 flex items-center ", children: [
     /* @__PURE__ */ e.jsxs("div", { className: "flex bg-white dark:bg-black overflow-hidden rounded-full shadow-md", children: [
-      /* @__PURE__ */ e.jsx(k, { type: "text", icon: /* @__PURE__ */ e.jsx(M.ZoomIn, { size: 16 }), onClick: () => o("in") }),
+      /* @__PURE__ */ e.jsx(k, { type: "text", icon: /* @__PURE__ */ e.jsx(M.ZoomIn, { size: 16 }), onClick: () => i("in") }),
       /* @__PURE__ */ e.jsx(At, { menu: { items: ds, onClick: t }, placement: "top", children: /* @__PURE__ */ e.jsxs(k, { type: "text", children: [
-        i.editor.scale,
+        o.editor.scale,
         "%"
       ] }) }),
-      /* @__PURE__ */ e.jsx(k, { type: "text", icon: /* @__PURE__ */ e.jsx(M.ZoomOut, { size: 16 }), onClick: () => o("out") })
+      /* @__PURE__ */ e.jsx(k, { type: "text", icon: /* @__PURE__ */ e.jsx(M.ZoomOut, { size: 16 }), onClick: () => i("out") })
     ] }),
     /* @__PURE__ */ e.jsx("div", { className: "rounded-full bg-white dark:bg-black shadow-md overflow-hidden", children: /* @__PURE__ */ e.jsx(k, { type: "text", icon: /* @__PURE__ */ e.jsx(M.Maximize, { size: 16 }), onClick: () => t({ key: 4 }) }) })
   ] });
 }), hs = B(() => {
-  const [o, t] = O(null);
+  const [i, t] = O(null);
   return /* @__PURE__ */ e.jsxs("div", { className: "md:w-0 md:flex-1 overflow-hidden select-none relative", children: [
-    /* @__PURE__ */ e.jsx("div", { className: "w-full h-full relative z-0", ref: (n) => t(n), children: o && /* @__PURE__ */ e.jsx(cs, { target: o }) }),
+    /* @__PURE__ */ e.jsx("div", { className: "w-full h-full relative z-0", ref: (n) => t(n), children: i && /* @__PURE__ */ e.jsx(cs, { target: i }) }),
     /* @__PURE__ */ e.jsx(fs, {})
   ] });
 }), ps = [
@@ -2212,14 +2216,14 @@ const cs = B(({ target: o }) => {
       }
     ]
   }
-], us = ({ frameWidth: o, frameHeight: t, type: n, onSet: s }) => {
+], us = ({ frameWidth: i, frameHeight: t, type: n, onSet: s }) => {
   const [a, l] = O(""), [h, f] = O(""), d = () => {
     s({ type: "auto", title: "Auto" });
   }, p = () => {
     s({ type: "custom", title: "Custom", width: a, height: h });
   };
   return N(() => {
-    n === "custom" ? (l(o), f(t)) : (l(""), f(""));
+    n === "custom" ? (l(i), f(t)) : (l(""), f(""));
   }, [n]), /* @__PURE__ */ e.jsxs("div", { className: "flex gap-2 items-center py-2 font-normal", children: [
     /* @__PURE__ */ e.jsx(
       nt,
@@ -2227,7 +2231,7 @@ const cs = B(({ target: o }) => {
         min: 1,
         value: a,
         onChange: l,
-        placeholder: o,
+        placeholder: i,
         prefix: /* @__PURE__ */ e.jsx("span", { className: "opacity-60 mx-1", children: "W" }),
         className: "flex-1"
       }
@@ -2267,28 +2271,28 @@ const cs = B(({ target: o }) => {
   ] });
 }, ms = B(() => {
   var A;
-  const o = ne(null), [t, n] = O(!1), [s, a] = O(500), l = () => {
+  const i = ne(null), [t, n] = O(!1), [s, a] = O(500), l = () => {
     n(!1);
   }, h = (x) => {
-    if (n(x), x && o.current) {
-      const { height: w, y: S } = o.current.getBoundingClientRect(), _ = document.body.clientHeight - w - S - 80;
+    if (n(x), x && i.current) {
+      const { height: w, y: S } = i.current.getBoundingClientRect(), _ = document.body.clientHeight - w - S - 80;
       a(_);
     }
-  }, f = (x, w) => !(x !== i.option.size.type || w.height !== i.option.frameConf.height || w.width !== i.option.frameConf.width), d = (x) => {
-    if (l(), x.type === "auto" && i.editor.img.width) {
-      const w = we(i.editor.img.width, i.editor.img.height);
-      i.option.setSize({ ...x, width: i.editor.img.width + w, height: i.editor.img.height + w });
+  }, f = (x, w) => !(x !== o.option.size.type || w.height !== o.option.frameConf.height || w.width !== o.option.frameConf.width), d = (x) => {
+    if (l(), x.type === "auto" && o.editor.img.width) {
+      const w = we(o.editor.img.width, o.editor.img.height);
+      o.option.setSize({ ...x, width: o.editor.img.width + w, height: o.editor.img.height + w });
       return;
     }
-    i.option.setSize(x);
+    o.option.setSize(x);
   }, p = (x, w, S) => {
-    l(), i.option.setSize({
+    l(), o.option.setSize({
       type: x,
       title: `${w}${S.title ? ` ${S.title} ` : " "}${S.w} : ${S.h}`,
       width: S.width,
       height: S.height
     });
-  }, m = ((A = i.editor.img) == null ? void 0 : A.src) || i.option.size.type !== "auto", b = /* @__PURE__ */ e.jsx(us, { type: i.option.size.type, frameWidth: i.option.frameConf.width, frameHeight: i.option.frameConf.height, onSet: d }), C = /* @__PURE__ */ e.jsx("div", { className: "border-t border-gray-200 dark:border-gray-800 py-2 divide-y dark:divide-gray-700", "data-mode": i.editor.isDark ? "dark" : "light", children: ps.map((x) => /* @__PURE__ */ e.jsxs("div", { children: [
+  }, m = ((A = o.editor.img) == null ? void 0 : A.src) || o.option.size.type !== "auto", b = /* @__PURE__ */ e.jsx(us, { type: o.option.size.type, frameWidth: o.option.frameConf.width, frameHeight: o.option.frameConf.height, onSet: d }), C = /* @__PURE__ */ e.jsx("div", { className: "border-t border-gray-200 dark:border-gray-800 py-2 divide-y dark:divide-gray-700", "data-mode": o.editor.isDark ? "dark" : "light", children: ps.map((x) => /* @__PURE__ */ e.jsxs("div", { children: [
     x.key !== "default" && /* @__PURE__ */ e.jsx("div", { className: "font-semibold pt-2", children: x.title }),
     /* @__PURE__ */ e.jsx("section", { className: "flex flex-wrap items-end pb-2", children: x.lists.map((w, S) => /* @__PURE__ */ e.jsxs(
       k,
@@ -2330,26 +2334,26 @@ const cs = B(({ target: o }) => {
       arrow: !1,
       placement: "bottomRight",
       open: t,
-      overlayClassName: Z("shoteasy-components [&_.ant-popover-inner]:h-full [&_.ant-popover-inner]:overflow-x-hidden [&_.ant-popover-inner]:overflow-y-auto [&_.ant-popover-content]:h-full", i.editor.isDark && "dark-mode"),
+      overlayClassName: Z("shoteasy-components [&_.ant-popover-inner]:h-full [&_.ant-popover-inner]:overflow-x-hidden [&_.ant-popover-inner]:overflow-y-auto [&_.ant-popover-content]:h-full", o.editor.isDark && "dark-mode"),
       overlayStyle: {
         width: "400px",
         height: `${s}px`
       },
       onOpenChange: h,
-      children: /* @__PURE__ */ e.jsxs("div", { className: Z("px-3 py-1.5 border shrink-0 border-gray-200 dark:border-gray-700 gap-3 shadow-sm overflow-hidden max-h-12 rounded-md hover:border-blue-500 [&_svg]:hover:text-blue-500 cursor-pointer flex items-center", t && "shadow-md"), ref: o, children: [
+      children: /* @__PURE__ */ e.jsxs("div", { className: Z("px-3 py-1.5 border shrink-0 border-gray-200 dark:border-gray-700 gap-3 shadow-sm overflow-hidden max-h-12 rounded-md hover:border-blue-500 [&_svg]:hover:text-blue-500 cursor-pointer flex items-center", t && "shadow-md"), ref: i, children: [
         /* @__PURE__ */ e.jsx(
           "div",
           {
             className: "border border-black/50 bg-black/10 dark:bg-white/20 dark:border-white/40 w-4 rounded-sm",
-            style: { aspectRatio: i.option.frameConf.width / i.option.frameConf.height }
+            style: { aspectRatio: o.option.frameConf.width / o.option.frameConf.height }
           }
         ),
         /* @__PURE__ */ e.jsxs("div", { className: "text-xs", children: [
-          /* @__PURE__ */ e.jsx("div", { className: "font-semibold leading-3 mb-0.5", children: i.option.size.title }),
+          /* @__PURE__ */ e.jsx("div", { className: "font-semibold leading-3 mb-0.5", children: o.option.size.title }),
           m ? /* @__PURE__ */ e.jsxs("div", { className: "text-gray-500 leading-3", children: [
-            i.option.frameConf.width,
+            o.option.frameConf.width,
             " x ",
-            i.option.frameConf.height,
+            o.option.frameConf.height,
             " px"
           ] }) : /* @__PURE__ */ e.jsx("div", { className: "text-gray-500 leading-3", children: "Adaptive screenshot size" })
         ] }),
@@ -2359,21 +2363,21 @@ const cs = B(({ target: o }) => {
     }
   );
 }), gs = B(() => {
-  const o = ne(null), [t, n] = O(!1), s = () => {
+  const i = ne(null), [t, n] = O(!1), s = () => {
     n(!0);
   }, a = () => {
     var h, f;
-    if (typeof ((h = o.current) == null ? void 0 : h.cropper) < "u") {
-      const d = (f = o.current) == null ? void 0 : f.cropper.getCroppedCanvas();
+    if (typeof ((h = i.current) == null ? void 0 : h.cropper) < "u") {
+      const d = (f = i.current) == null ? void 0 : f.cropper.getCroppedCanvas();
       if (d) {
         const { width: p, height: m } = d, b = d.toDataURL();
-        if (i.editor.setImg(Object.assign({}, i.editor.img, {
+        if (o.editor.setImg(Object.assign({}, o.editor.img, {
           src: b,
           width: p,
           height: m
-        })), i.option.size.type === "auto") {
+        })), o.option.size.type === "auto") {
           const C = we(p, m);
-          i.option.setFrameSize(p + C, m + C);
+          o.option.setFrameSize(p + C, m + C);
         }
       }
     }
@@ -2400,13 +2404,13 @@ const cs = B(({ target: o }) => {
         onCancel: l,
         destroyOnClose: !0,
         children: /* @__PURE__ */ e.jsx(
-          So,
+          Ti,
           {
-            ref: o,
+            ref: i,
             style: { height: 400, width: "100%" },
             zoomTo: 0.5,
-            initialAspectRatio: i.editor.img.width / i.editor.img.height,
-            src: i.editor.img.src,
+            initialAspectRatio: o.editor.img.width / o.editor.img.height,
+            src: o.editor.img.src,
             dragMode: "move",
             viewMode: 1,
             minCropBoxHeight: 10,
@@ -2422,11 +2426,11 @@ const cs = B(({ target: o }) => {
     )
   ] });
 }), xs = ["top-left", "top", "top-right", "left", "center", "right", "bottom-left", "bottom", "bottom-right"], bs = B(() => {
-  const [o, t] = O(!1), n = (l) => {
+  const [i, t] = O(!1), n = (l) => {
     t(l);
   }, s = (l) => {
-    i.option.setAlign(l);
-  }, a = /* @__PURE__ */ e.jsx("div", { className: Z("flex flex-wrap w-24 position-block", i.option.align), children: xs.map((l) => /* @__PURE__ */ e.jsx("div", { className: "w-8 h-8 border border-[var(--c-br)] rounded-sm hover:bg-[var(--c-wb)] cursor-pointer", onClick: () => s(l) }, l)) });
+    o.option.setAlign(l);
+  }, a = /* @__PURE__ */ e.jsx("div", { className: Z("flex flex-wrap w-24 position-block", o.option.align), children: xs.map((l) => /* @__PURE__ */ e.jsx("div", { className: "w-8 h-8 border border-[var(--c-br)] rounded-sm hover:bg-[var(--c-wb)] cursor-pointer", onClick: () => s(l) }, l)) });
   return /* @__PURE__ */ e.jsx(
     xe,
     {
@@ -2434,40 +2438,40 @@ const cs = B(({ target: o }) => {
       trigger: "click",
       arrow: !1,
       placement: "bottomRight",
-      overlayClassName: Z("shoteasy-components", i.editor.isDark && "dark-mode"),
-      open: o,
+      overlayClassName: Z("shoteasy-components", o.editor.isDark && "dark-mode"),
+      open: i,
       onOpenChange: n,
       children: /* @__PURE__ */ e.jsx(
         k,
         {
           type: "text",
           shape: "circle",
-          className: Z(o && "shadow-md"),
+          className: Z(i && "shadow-md"),
           icon: /* @__PURE__ */ e.jsx(M.LayoutGrid, { size: 18 })
         }
       )
     }
   );
 }), ws = B(() => {
-  const [o, t] = O(!1), [n, s] = O("ShotEasy"), [a, l] = O("#00000030"), [h, f] = O(45), d = (p) => {
+  const [i, t] = O(!1), [n, s] = O("ShotEasy"), [a, l] = O("#00000030"), [h, f] = O(45), d = (p) => {
     l(typeof p == "string" ? p : p.toRgbString());
   };
   return N(() => {
-    if (o && n.trim()) {
-      const p = Zo({
+    if (i && n.trim()) {
+      const p = Wi({
         text: n,
         color: a,
         angleDegrees: h
       });
-      i.option.setWaterImg(p);
+      o.option.setWaterImg(p);
     } else
-      i.option.setWaterImg(null);
-  }, [o, n, a, h]), /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+      o.option.setWaterImg(null);
+  }, [i, n, a, h]), /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
     /* @__PURE__ */ e.jsxs("div", { className: "[&_label]:font-semibold [&_label]:text-sm flex gap-4 items-center justify-between", children: [
       /* @__PURE__ */ e.jsx("label", { children: "Watermark" }),
-      /* @__PURE__ */ e.jsx(at, { defaultChecked: o, onChange: t, size: "small", className: "bg-slate-200" })
+      /* @__PURE__ */ e.jsx(at, { defaultChecked: i, onChange: t, size: "small", className: "bg-slate-200" })
     ] }),
-    o && /* @__PURE__ */ e.jsxs("div", { className: "[&_label]:font-semibold [&_label]:text-xs grid gap-3 pl-2 pt-2", children: [
+    i && /* @__PURE__ */ e.jsxs("div", { className: "[&_label]:font-semibold [&_label]:text-xs grid gap-3 pl-2 pt-2", children: [
       /* @__PURE__ */ e.jsx(xr, { defaultValue: n, placeholder: "Watermark content", onChange: (p) => s(p.target.value) }),
       /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-between", children: [
         /* @__PURE__ */ e.jsx("label", { children: "Color" }),
@@ -2482,15 +2486,15 @@ const cs = B(({ target: o }) => {
       ] }),
       /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-between", children: [
         /* @__PURE__ */ e.jsx("label", { children: "Only Background" }),
-        /* @__PURE__ */ e.jsx(at, { size: "small", onChange: (p) => i.option.setWaterIndex(p ? -1 : 1), className: "bg-slate-200" })
+        /* @__PURE__ */ e.jsx(at, { size: "small", onChange: (p) => o.option.setWaterIndex(p ? -1 : 1), className: "bg-slate-200" })
       ] })
     ] })
   ] });
 });
-function ys(o, t, n) {
-  const s = ne(o), a = ne(t);
+function ys(i, t, n) {
+  const s = ne(i), a = ne(t);
   N(() => {
-    s.current = o, a.current = t;
+    s.current = i, a.current = t;
   }, [...n]), N(() => {
     const l = Rt(window, {
       "$mod+KeyS": (h) => {
@@ -2507,60 +2511,60 @@ function ys(o, t, n) {
 }
 const vs = B(() => {
   var A;
-  const [o, t] = O(!1), [n, s] = O(!1), [a, l] = O("png"), [h, f] = O(1), d = (x) => {
+  const [i, t] = O(!1), [n, s] = O(!1), [a, l] = O("png"), [h, f] = O(1), d = (x) => {
     s(x);
   }, p = async () => {
-    if (!i.editor.isEditing || o) return;
+    if (!o.editor.isEditing || i) return;
     const x = {
       pixelRatio: h
     };
     ["jpg", "webp"].includes(a) && (x.quality = 0.9, x.fill = "#ffffff");
     const w = ge();
-    t(!0), i.editor.message.open({
+    t(!0), o.editor.message.open({
       key: w,
       type: "loading",
       content: "Downloading..."
-    }), await i.editor.app.tree.export(a, x).then((S) => {
+    }), await o.editor.app.tree.export(a, x).then((S) => {
       let _ = "ShotEasy";
-      h > 1 && (_ += `@${h}`), Bo(S.data, `${_}.${a}`), i.editor.message.open({
+      h > 1 && (_ += `@${h}`), Oi(S.data, `${_}.${a}`), o.editor.message.open({
         key: w,
         type: "success",
         content: "Download Success!"
       });
     }).catch(() => {
-      i.editor.message.open({
+      o.editor.message.open({
         key: w,
         type: "error",
         content: "Download failed!"
       });
     }), t(!1);
   }, m = async () => {
-    if (!i.editor.isEditing || o) return;
+    if (!o.editor.isEditing || i) return;
     const x = ge();
-    t(!0), i.editor.message.open({
+    t(!0), o.editor.message.open({
       key: x,
       type: "loading",
       content: "Copying..."
-    }), await i.editor.app.tree.export("png", { blob: !0, pixelRatio: h }).then(async (w) => {
+    }), await o.editor.app.tree.export("png", { blob: !0, pixelRatio: h }).then(async (w) => {
       const { data: S } = w;
       await navigator.clipboard.write([
         new ClipboardItem({
           [S.type]: S
         })
-      ]), i.editor.message.open({
+      ]), o.editor.message.open({
         key: x,
         type: "success",
         content: "Copy Success!"
       });
     }).catch(() => {
-      i.editor.message.open({
+      o.editor.message.open({
         key: x,
         type: "error",
         content: "Copy failed!"
       });
     }), t(!1);
   }, b = () => {
-    i.editor.destroy(), i.editor.clearImg();
+    o.editor.destroy(), o.editor.clearImg(), o.editor.clearFun && o.editor.clearFun();
   };
   ys(() => p(), () => m(), [p, m]);
   const C = /* @__PURE__ */ e.jsx("div", { children: /* @__PURE__ */ e.jsxs("div", { className: "p-2 [&_.ant-segmented]:w-full [&_.ant-segmented-item]:w-[33%]", children: [
@@ -2582,12 +2586,12 @@ const vs = B(() => {
         onChange: f
       }
     ),
-    i.option.frameConf.width && /* @__PURE__ */ e.jsxs("div", { className: "text-xs p-3 mt-4 flex justify-between bg-black/5 rounded-md", children: [
+    o.option.frameConf.width && /* @__PURE__ */ e.jsxs("div", { className: "text-xs p-3 mt-4 flex justify-between bg-black/5 rounded-md", children: [
       /* @__PURE__ */ e.jsx("span", { className: "text-gray-400", children: "Download Size" }),
       /* @__PURE__ */ e.jsxs("span", { className: "text-gray-700", children: [
-        i.option.frameConf.width * h,
+        o.option.frameConf.width * h,
         " x ",
-        i.option.frameConf.height * h
+        o.option.frameConf.height * h
       ] })
     ] })
   ] }) });
@@ -2598,7 +2602,7 @@ const vs = B(() => {
         theme: {
           components: {
             Button: {
-              colorPrimary: i.editor.isDark ? "#2b4acb" : "#000",
+              colorPrimary: o.editor.isDark ? "#2b4acb" : "#000",
               algorithm: !0
               // 启用算法
             }
@@ -2614,7 +2618,7 @@ const vs = B(() => {
             {
               type: "primary",
               size: "large",
-              loading: o,
+              loading: i,
               icon: /* @__PURE__ */ e.jsx(M.ImageDown, { size: 18 }),
               className: "rounded-se-none flex-1 rounded-ee-none me-[-1px] hover:z-[1] border-r-white/30",
               onClick: p,
@@ -2638,7 +2642,7 @@ const vs = B(() => {
               type: "primary",
               size: "large",
               icon: /* @__PURE__ */ e.jsx(M.Copy, { size: 18 }),
-              loading: o,
+              loading: i,
               className: "rounded-ss-none rounded-es-none border-l-white/30",
               onClick: m
             }
@@ -2662,7 +2666,7 @@ const vs = B(() => {
           children: /* @__PURE__ */ e.jsx(k, { size: "large", icon: /* @__PURE__ */ e.jsx(M.Settings2, { size: 18 }) })
         }
       ),
-      ((A = i.editor.img) == null ? void 0 : A.src) && /* @__PURE__ */ e.jsx(
+      ((A = o.editor.img) == null ? void 0 : A.src) && /* @__PURE__ */ e.jsx(
         br,
         {
           title: "Delete the screenshot",
@@ -2676,14 +2680,14 @@ const vs = B(() => {
       )
     ] })
   ] });
-}), js = "data:image/svg+xml,%3csvg%20viewBox='0%200%201024%201024'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20width='22'%20height='22'%3e%3cpath%20d='M311.296%20428.544V40.96C186.368%2094.208%2087.552%20195.072%2036.864%20321.024l274.432%20274.432V428.544z'%20fill='%2337C15C'%3e%3c/path%3e%3cpath%20d='M428.544%20311.296l274.432-274.432C642.048%2012.288%20577.536%200%20512%200%20440.832%200%20372.736%2014.848%20311.296%2040.96v387.584l117.248-117.248z'%20fill='%23A9E247'%3e%3c/path%3e%3cpath%20d='M983.04%20311.296h-387.584l117.248%20117.248%20274.432%20274.432c24.576-60.416%2036.864-125.44%2036.864-190.976%200-71.168-14.848-139.264-40.96-200.704z'%20fill='%23FF7D12'%3e%3c/path%3e%3cpath%20d='M712.704%20595.456V983.04c124.928-53.248%20223.744-154.112%20274.432-280.064l-274.432-274.432v166.912z'%20fill='%23F93B21'%3e%3c/path%3e%3cpath%20d='M595.456%20712.704l-274.432%20274.432c60.928%2024.576%20125.44%2036.864%20190.976%2036.864%2071.168%200%20139.264-14.848%20200.704-40.96v-387.584l-117.248%20117.248z'%20fill='%23846FEF'%3e%3c/path%3e%3cpath%20d='M428.544%20712.704H40.96c53.248%20124.928%20154.112%20223.744%20280.064%20274.432l274.432-274.432H428.544z'%20fill='%231E95FF'%3e%3c/path%3e%3cpath%20d='M311.296%20595.456L36.864%20321.024C12.288%20381.952%200%20446.464%200%20512c0%2071.168%2014.848%20139.264%2040.96%20200.704h387.584l-117.248-117.248z'%20fill='%2314EFEF'%3e%3c/path%3e%3cpath%20d='M595.456%20311.296H983.04c-53.248-124.928-154.112-223.744-280.064-274.432L428.544%20311.296h166.912z'%20fill='%23FFC931'%3e%3c/path%3e%3c/svg%3e", Ct = ["cosmic", "desktop"], me = ({ type: o, options: t, onChange: n, value: s }) => {
+}), js = "data:image/svg+xml,%3csvg%20viewBox='0%200%201024%201024'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%20width='22'%20height='22'%3e%3cpath%20d='M311.296%20428.544V40.96C186.368%2094.208%2087.552%20195.072%2036.864%20321.024l274.432%20274.432V428.544z'%20fill='%2337C15C'%3e%3c/path%3e%3cpath%20d='M428.544%20311.296l274.432-274.432C642.048%2012.288%20577.536%200%20512%200%20440.832%200%20372.736%2014.848%20311.296%2040.96v387.584l117.248-117.248z'%20fill='%23A9E247'%3e%3c/path%3e%3cpath%20d='M983.04%20311.296h-387.584l117.248%20117.248%20274.432%20274.432c24.576-60.416%2036.864-125.44%2036.864-190.976%200-71.168-14.848-139.264-40.96-200.704z'%20fill='%23FF7D12'%3e%3c/path%3e%3cpath%20d='M712.704%20595.456V983.04c124.928-53.248%20223.744-154.112%20274.432-280.064l-274.432-274.432v166.912z'%20fill='%23F93B21'%3e%3c/path%3e%3cpath%20d='M595.456%20712.704l-274.432%20274.432c60.928%2024.576%20125.44%2036.864%20190.976%2036.864%2071.168%200%20139.264-14.848%20200.704-40.96v-387.584l-117.248%20117.248z'%20fill='%23846FEF'%3e%3c/path%3e%3cpath%20d='M428.544%20712.704H40.96c53.248%20124.928%20154.112%20223.744%20280.064%20274.432l274.432-274.432H428.544z'%20fill='%231E95FF'%3e%3c/path%3e%3cpath%20d='M311.296%20595.456L36.864%20321.024C12.288%20381.952%200%20446.464%200%20512c0%2071.168%2014.848%20139.264%2040.96%20200.704h387.584l-117.248-117.248z'%20fill='%2314EFEF'%3e%3c/path%3e%3cpath%20d='M595.456%20311.296H983.04c-53.248-124.928-154.112-223.744-280.064-274.432L428.544%20311.296h166.912z'%20fill='%23FFC931'%3e%3c/path%3e%3c/svg%3e", Ct = ["cosmic", "desktop"], me = ({ type: i, options: t, onChange: n, value: s }) => {
   let a = [];
   if (t && t.length)
     a = t;
   else {
     const l = [];
     Object.keys(Q).map((h) => {
-      h.includes(o) && l.push({
+      h.includes(i) && l.push({
         key: h,
         value: Q[h]
       });
@@ -2696,30 +2700,30 @@ const vs = B(() => {
       value: s,
       rootClassName: Z(
         "grid [&_span]:ps-0",
-        Ct.includes(o) ? "grid-cols-5 gap-y-1.5" : "grid-cols-7 gap-y-3"
+        Ct.includes(i) ? "grid-cols-5 gap-y-1.5" : "grid-cols-7 gap-y-3"
       ),
       children: a.map((l, h) => /* @__PURE__ */ e.jsx(
         P,
         {
           className: "[&_.ant-radio]:hidden [&_span]:p-0 mr-0",
           value: l.key,
-          children: Ct.includes(o) ? /* @__PURE__ */ e.jsx("div", { className: Z("w-12 h-8 rounded-md overflow-hidden"), children: /* @__PURE__ */ e.jsx("img", { src: `${l.value.class}&w=48`, className: "w-full h-full object-cover object-center" }) }) : /* @__PURE__ */ e.jsx("div", { className: Z("w-8 h-8 rounded-full overflow-hidden", l.value.class) })
+          children: Ct.includes(i) ? /* @__PURE__ */ e.jsx("div", { className: Z("w-12 h-8 rounded-md overflow-hidden"), children: /* @__PURE__ */ e.jsx("img", { src: `${l.value.class}&w=48`, className: "w-full h-full object-cover object-center" }) }) : /* @__PURE__ */ e.jsx("div", { className: Z("w-8 h-8 rounded-full overflow-hidden", l.value.class) })
         },
         h
       ))
     }
   );
-}, Ms = B(({ showMore: o, onChange: t }) => {
+}, Ms = B(({ showMore: i, onChange: t }) => {
   const n = () => {
     t(!1);
   }, s = (l) => {
     const h = l.toHexString();
-    i.option.frameConf.background = {
+    o.option.frameConf.background = {
       type: "solid",
       color: h
     };
   }, a = (l) => {
-    i.option.setBackground(l);
+    o.option.setBackground(l);
   };
   return /* @__PURE__ */ e.jsx(
     wr,
@@ -2729,7 +2733,7 @@ const vs = B(() => {
       closable: !1,
       mask: !1,
       onClose: n,
-      open: o,
+      open: i,
       getContainer: !1,
       width: "100%",
       className: "[&_.ant-drawer-body]:p-0",
@@ -2750,20 +2754,20 @@ const vs = B(() => {
           /* @__PURE__ */ e.jsx("h4", { className: "text-sm font-bold py-2", children: "Custom" }),
           /* @__PURE__ */ e.jsx("div", { className: "py-1", children: /* @__PURE__ */ e.jsx(be, { onChange: s, children: /* @__PURE__ */ e.jsx(k, { type: "default", size: "small", shape: "circle", icon: /* @__PURE__ */ e.jsx("img", { src: js, width: 18 }) }) }) }),
           /* @__PURE__ */ e.jsx("h4", { className: "text-sm font-bold py-2", children: "Solid Colors" }),
-          /* @__PURE__ */ e.jsx(me, { type: "solid", onChange: a, value: i.option.background }),
+          /* @__PURE__ */ e.jsx(me, { type: "solid", onChange: a, value: o.option.background }),
           /* @__PURE__ */ e.jsx("h4", { className: "text-sm font-bold py-2", children: "Gradients" }),
-          /* @__PURE__ */ e.jsx(me, { type: "gradient", onChange: a, value: i.option.background }),
+          /* @__PURE__ */ e.jsx(me, { type: "gradient", onChange: a, value: o.option.background }),
           /* @__PURE__ */ e.jsx("h4", { className: "text-sm font-bold py-2", children: "Cosmic Gradients" }),
-          /* @__PURE__ */ e.jsx(me, { type: "cosmic", onChange: a, value: i.option.background }),
+          /* @__PURE__ */ e.jsx(me, { type: "cosmic", onChange: a, value: o.option.background }),
           /* @__PURE__ */ e.jsx("h4", { className: "text-sm font-bold py-2", children: "Desktop" }),
-          /* @__PURE__ */ e.jsx(me, { type: "desktop", onChange: a, value: i.option.background })
+          /* @__PURE__ */ e.jsx(me, { type: "desktop", onChange: a, value: o.option.background })
         ] })
       ] })
     }
   );
 }), Cs = B(() => {
-  const [o, t] = O(!1), n = (s) => {
-    i.option.setFrame(s.target.value);
+  const [i, t] = O(!1), n = (s) => {
+    o.option.setFrame(s.target.value);
   };
   return /* @__PURE__ */ e.jsxs("div", { className: "[&_label]:font-semibold [&_label]:text-sm", children: [
     /* @__PURE__ */ e.jsxs("div", { className: "flex justify-between items-center", children: [
@@ -2788,7 +2792,7 @@ const vs = B(() => {
       {
         rootClassName: "grid grid-cols-5",
         onChange: n,
-        value: i.option.frame,
+        value: o.option.frame,
         children: [
           /* @__PURE__ */ e.jsx(P, { className: "[&_.ant-radio]:hidden [&_span]:mr-0 [&_span]:block [&_span]:w-full", value: "none", children: /* @__PURE__ */ e.jsx("div", { className: "bg-gray-300/30 rounded-md h-8 overflow-hidden", children: /* @__PURE__ */ e.jsx("div", { className: "bg-slate-300/40 h-7 w-[85%] rounded-md shadow-md -mt-1 -ml-1" }) }) }),
           /* @__PURE__ */ e.jsx(P, { className: "[&_.ant-radio]:hidden [&_span]:mr-0 [&_span]:block [&_span]:w-full", value: "light", children: /* @__PURE__ */ e.jsx("div", { className: "bg-gray-300/30 rounded-md h-8 overflow-hidden", children: /* @__PURE__ */ e.jsx("div", { className: "bg-slate-300/40 border-2 border-white/80 h-7 w-[85%] rounded-md shadow-md -mt-1 -ml-1" }) }) }),
@@ -2812,9 +2816,9 @@ const vs = B(() => {
     ) })
   ] });
 }), ks = B(() => {
-  const [o, t] = O(!1), n = (s) => {
+  const [i, t] = O(!1), n = (s) => {
     const a = s.target.value;
-    i.option.setBackground(a);
+    o.option.setBackground(a);
   };
   return /* @__PURE__ */ e.jsxs("div", { className: "bg-white dark:bg-black flex flex-col md:w-[340px] border-l border-l-gray-50 dark:border-l-gray-700 dark:text-gray-400 shadow-lg relative z-10 select-none", children: [
     /* @__PURE__ */ e.jsxs("div", { className: "flex-1 flex-col gap-2 p-4 overflow-y-auto overflow-x-hidden", children: [
@@ -2828,7 +2832,7 @@ const vs = B(() => {
             {
               type: "text",
               shape: "circle",
-              onClick: () => i.option.toggleFlip("x"),
+              onClick: () => o.option.toggleFlip("x"),
               icon: /* @__PURE__ */ e.jsx(M.FlipHorizontal2, { size: 18 })
             }
           ),
@@ -2837,7 +2841,7 @@ const vs = B(() => {
             {
               type: "text",
               shape: "circle",
-              onClick: () => i.option.toggleFlip("y"),
+              onClick: () => o.option.toggleFlip("y"),
               icon: /* @__PURE__ */ e.jsx(M.FlipVertical2, { size: 18 })
             }
           ),
@@ -2852,23 +2856,23 @@ const vs = B(() => {
             min: 0.1,
             max: 2,
             step: 0.1,
-            onChange: (s) => i.option.setScale(s),
-            value: typeof i.option.scale == "number" ? i.option.scale : 1
+            onChange: (s) => o.option.setScale(s),
+            value: typeof o.option.scale == "number" ? o.option.scale : 1
           }
         )
       ] }),
       /* @__PURE__ */ e.jsxs("div", { className: "[&_label]:font-semibold [&_label]:text-sm", children: [
         /* @__PURE__ */ e.jsxs("div", { className: "flex justify-between", children: [
           /* @__PURE__ */ e.jsx("label", { children: "Padding" }),
-          /* @__PURE__ */ e.jsx(be, { value: i.option.paddingBg, onChange: (s) => i.option.setPaddingBg(s.toRgbString()), size: "small" })
+          /* @__PURE__ */ e.jsx(be, { value: o.option.paddingBg, onChange: (s) => o.option.setPaddingBg(s.toRgbString()), size: "small" })
         ] }),
         /* @__PURE__ */ e.jsx(
           pe,
           {
             min: 0,
             max: 60,
-            onChange: (s) => i.option.setPadding(s),
-            value: typeof i.option.padding == "number" ? i.option.padding : 0
+            onChange: (s) => o.option.setPadding(s),
+            value: typeof o.option.padding == "number" ? o.option.padding : 0
           }
         )
       ] }),
@@ -2879,8 +2883,8 @@ const vs = B(() => {
           {
             min: 0,
             max: 20,
-            onChange: (s) => i.option.setRound(s),
-            value: typeof i.option.round == "number" ? i.option.round : 0
+            onChange: (s) => o.option.setRound(s),
+            value: typeof o.option.round == "number" ? o.option.round : 0
           }
         )
       ] }),
@@ -2891,8 +2895,8 @@ const vs = B(() => {
           {
             min: 0,
             max: 6,
-            onChange: (s) => i.option.setShadow(s),
-            value: typeof i.option.shadow == "number" ? i.option.shadow : 0
+            onChange: (s) => o.option.setShadow(s),
+            value: typeof o.option.shadow == "number" ? o.option.shadow : 0
           }
         )
       ] }),
@@ -2918,7 +2922,7 @@ const vs = B(() => {
           P.Group,
           {
             onChange: n,
-            value: i.option.background,
+            value: o.option.background,
             rootClassName: "grid grid-cols-7 [&_span]:ps-0",
             children: [
               /* @__PURE__ */ e.jsx(P, { className: "[&_.ant-radio]:hidden [&_span]:p-0 mr-0", value: "default_1", children: /* @__PURE__ */ e.jsx("div", { className: Z("w-8 h-8 rounded-full", Q.default_1.class) }) }),
@@ -2932,9 +2936,9 @@ const vs = B(() => {
       /* @__PURE__ */ e.jsx(ws, {})
     ] }),
     /* @__PURE__ */ e.jsx(vs, {}),
-    /* @__PURE__ */ e.jsx(Ms, { showMore: o, onChange: t })
+    /* @__PURE__ */ e.jsx(Ms, { showMore: i, onChange: t })
   ] });
-}), As = (o, t = []) => {
+}), As = (i, t = []) => {
   N(() => {
     const n = async (s) => {
       const a = s.clipboardData;
@@ -2944,45 +2948,45 @@ const vs = B(() => {
       );
       if (!l.length) return;
       const h = l[0].getAsFile();
-      o && o(h);
+      i && i(h);
     };
     return document.addEventListener("paste", n, !1), () => {
       document.removeEventListener("paste", n);
     };
   }, [...t]);
-}, Ot = (o) => async (n, s = "blob") => {
-  const a = window.URL || window.webkitURL || window, l = s === "blob" ? a.createObjectURL(n) : n, h = await Io(l), f = Math.round(h.width), d = Math.round(h.height);
-  if (o.editor.setImg({
+}, Ot = (i) => async (n, s = "blob") => {
+  const a = window.URL || window.webkitURL || window, l = s === "blob" ? a.createObjectURL(n) : n, h = await Yi(l), f = Math.round(h.width), d = Math.round(h.height);
+  if (i.editor.setImg({
     src: l,
     width: f,
     height: d,
     type: s === "blob" ? n.type : "image/png",
     name: s === "blob" ? n.name : "ShotEasy.png"
-  }), o.option.size.type === "auto") {
+  }), i.option.size.type === "auto") {
     const p = we(f, d);
-    o.option.setFrameSize(f + p, d + p);
+    i.option.setFrameSize(f + p, d + p);
   }
 }, Ns = async () => {
   try {
-    const o = await navigator.mediaDevices.getDisplayMedia(), t = document.createElement("video");
-    t.srcObject = o, t.play(), await new Promise((l) => t.onplaying = l);
+    const i = await navigator.mediaDevices.getDisplayMedia(), t = document.createElement("video");
+    t.srcObject = i, t.play(), await new Promise((l) => t.onplaying = l);
     const n = document.createElement("canvas");
     n.width = t.videoWidth, n.height = t.videoHeight, n.getContext("2d").drawImage(t, 0, 0);
     const a = n.toDataURL("image/png");
     return t.srcObject.getTracks().forEach((l) => l.stop()), a;
-  } catch (o) {
-    console.log("Error capturing screen:", o);
+  } catch (i) {
+    console.log("Error capturing screen:", i);
   }
 }, { Dragger: Ts } = yr, Ss = B(() => {
-  const o = Ot(i), t = async (a) => (await o(a), Promise.reject()), n = async () => {
+  const i = Ot(o), t = async (a) => (await i(a), Promise.reject()), n = async () => {
     const a = await Ns();
-    a && o(a, "dataURL");
+    a && i(a, "dataURL");
   }, s = () => {
-    i.editor.message.info("Developing, Coming soon!");
+    o.editor.message.info("Developing, Coming soon!");
   };
   return As((a) => {
-    o(a);
-  }), /* @__PURE__ */ e.jsx("div", { className: "md:w-0 md:flex-1 flex flex-col justify-center items-center overflow-hidden select-none relative", children: /* @__PURE__ */ e.jsxs("div", { className: Z("max-w-[600px]", i.editor.invalid && "invalid"), children: [
+    i(a);
+  }), /* @__PURE__ */ e.jsx("div", { className: "md:w-0 md:flex-1 flex flex-col justify-center items-center overflow-hidden select-none relative", children: /* @__PURE__ */ e.jsxs("div", { className: Z("max-w-[600px]", o.editor.invalid && "invalid"), children: [
     /* @__PURE__ */ e.jsx(
       Ts,
       {
@@ -3008,26 +3012,26 @@ const vs = B(() => {
       /* @__PURE__ */ e.jsx(L, { placement: "top", arrow: !1, title: "Create gif animate", children: /* @__PURE__ */ e.jsx(k, { shape: "round", type: "default", size: "large", icon: /* @__PURE__ */ e.jsx(M.ImagePlay, { size: 20, onClick: s }) }) })
     ] })
   ] }) });
-}), $s = B(({ defaultImg: o, headLeft: t, headRight: n, isDark: s, boxClassName: a = "" }) => {
-  var p;
-  const l = Ot(i), h = (p = i.editor.img) != null && p.src ? /* @__PURE__ */ e.jsx(hs, {}) : /* @__PURE__ */ e.jsx(Ss, {}), [f, d] = vr.useMessage();
-  return i.editor.setMessage(f), le(() => {
-    const m = s || localStorage.getItem("SHOTEASY_BEAUTIFIER_THEME") === "dark" ? "dark" : "light";
-    i.editor.setTheme(m);
+}), $s = B(({ defaultImg: i, headLeft: t, headRight: n, isDark: s, boxClassName: a = "", onClear: l }) => {
+  var m;
+  const h = Ot(o), f = (m = o.editor.img) != null && m.src ? /* @__PURE__ */ e.jsx(hs, {}) : /* @__PURE__ */ e.jsx(Ss, {}), [d, p] = vr.useMessage();
+  return o.editor.setMessage(d), o.editor.setClearFun(l), le(() => {
+    const b = s || localStorage.getItem("SHOTEASY_BEAUTIFIER_THEME") === "dark" ? "dark" : "light";
+    o.editor.setTheme(b);
   }, [s]), N(() => {
-    o && l(o, "dataURL");
-  }, [o]), /* @__PURE__ */ e.jsx(To, { children: /* @__PURE__ */ e.jsxs(
+    i && h(i, "dataURL");
+  }, [i]), /* @__PURE__ */ e.jsx(Ni, { children: /* @__PURE__ */ e.jsxs(
     Nt,
     {
       theme: {
-        algorithm: i.editor.isDark ? ct.darkAlgorithm : ct.defaultAlgorithm
+        algorithm: o.editor.isDark ? ct.darkAlgorithm : ct.defaultAlgorithm
       },
       children: [
-        d,
-        /* @__PURE__ */ e.jsxs("div", { id: "shoteasy-container", className: Z("polka flex flex-col overflow-hidden antialiased w-full h-[100vh] dark:bg-black", a), "data-mode": i.editor.isDark ? "dark" : "light", children: [
-          /* @__PURE__ */ e.jsx($o, { headLeft: t, headRight: n }),
+        p,
+        /* @__PURE__ */ e.jsxs("div", { id: "shoteasy-container", className: Z("polka flex flex-col overflow-hidden antialiased w-full h-[100vh] dark:bg-black", a), "data-mode": o.editor.isDark ? "dark" : "light", children: [
+          /* @__PURE__ */ e.jsx(Qi, { headLeft: t, headRight: n }),
           /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col flex-1 h-0 md:flex-row md:items-stretch", children: [
-            h,
+            f,
             /* @__PURE__ */ e.jsx(ks, {})
           ] })
         ] })