image-beautifier 1.0.0 → 1.0.2

package/lib/image-beautifier.es.js

@@ -0,0 +1,2852 @@
+var si = Object.defineProperty;
+var ni = (o, t, n) => t in o ? si(o, t, { enumerable: !0, configurable: !0, writable: !0, value: n }) : o[t] = n;
+var k = (o, t, n) => ni(o, typeof t != "symbol" ? t + "" : t, n);
+import yt, { useState as O, useMemo as me, useEffect as M, Children as it, cloneElement as ot, useRef as ue } from "react";
+import { ColorPicker as ai, Button as T, Dropdown as vt, Popover as ge, Divider as li, InputNumber as rt, Tooltip as F, Modal as ci, Switch as st, Input as di, Radio as L, Segmented as nt, ConfigProvider as fi, Popconfirm as pi, Drawer as ui, Slider as de, Upload as hi, message as mi } from "antd";
+import { observer as Y } from "mobx-react-lite";
+import { Camera as gi, Check as xi, Square as bi, Circle as wi, Slash as yi, MoveDownLeft as vi, Pencil as ji, Smile as Mi, Undo as Ci, Redo as Ai, ChevronRight as Ti, ChevronDown as Ni, ChevronUp as Si, RotateCcw as ki, ZoomIn as Ri, ZoomOut as Di, Hand as Hi, Crop as zi, FlipHorizontal2 as Ei, FlipVertical2 as Oi, Sunset as _i, Box as Yi, LayoutGrid as Ii, ImagePlus as Bi, Type as Pi, CodeXml as Wi, ClipboardPaste as Zi, ImagePlay as Gi, Maximize as Fi, ListCollapse as Li, ArrowUpRight as Ui, ArrowDownRight as Vi, ImageDown as Ji, Copy as qi, Settings2 as Xi, ChevronLeft as Qi, Pipette as $i, Trash2 as Ki, icons as at } from "lucide-react";
+import { TinyColor as eo } from "@ctrl/tinycolor";
+import { clsx as to } from "clsx";
+import { twMerge as io } from "tailwind-merge";
+import { makeAutoObservable as jt, toJS as Mt, action as oo } from "mobx";
+import ro from "@emoji-mart/data";
+import so from "@emoji-mart/react";
+import { Frame as no, Image as ao, Box as lo, Rect as De, Ellipse as co, Line as lt, Text as fo, Cursor as po, App as uo, ZoomEvent as ho, ResizeEvent as mo, DragEvent as ke } from "leafer-ui";
+import { addListener as go, removeListener as xo } from "resize-detector";
+import { Arrow as bo } from "@leafer-in/arrow";
+import { ScrollBar as wo } from "@leafer-in/scroll";
+import { tinykeys as Ct } from "tinykeys";
+import "@leafer-in/editor";
+import "@leafer-in/view";
+import yo from "react-cropper";
+var fe = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
+function vo(o) {
+  return o && o.__esModule && Object.prototype.hasOwnProperty.call(o, "default") ? o.default : o;
+}
+var He = { exports: {} }, oe = {};
+/**
+ * @license React
+ * react-jsx-runtime.production.min.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var ct;
+function jo() {
+  if (ct) return oe;
+  ct = 1;
+  var o = yt, 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 };
+  function d(f, u, h) {
+    var g, y = {}, S = null, N = null;
+    h !== void 0 && (S = "" + h), u.key !== void 0 && (S = "" + u.key), u.ref !== void 0 && (N = u.ref);
+    for (g in u) s.call(u, g) && !l.hasOwnProperty(g) && (y[g] = u[g]);
+    if (f && f.defaultProps) for (g in u = f.defaultProps, u) y[g] === void 0 && (y[g] = u[g]);
+    return { $$typeof: t, type: f, key: S, ref: N, props: y, _owner: a.current };
+  }
+  return oe.Fragment = n, oe.jsx = d, oe.jsxs = d, oe;
+}
+var re = {};
+/**
+ * @license React
+ * react-jsx-runtime.development.js
+ *
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+var dt;
+function Mo() {
+  return dt || (dt = 1, process.env.NODE_ENV !== "production" && function() {
+    var o = yt, 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"), d = Symbol.for("react.provider"), f = Symbol.for("react.context"), u = Symbol.for("react.forward_ref"), h = Symbol.for("react.suspense"), g = Symbol.for("react.suspense_list"), y = Symbol.for("react.memo"), S = Symbol.for("react.lazy"), N = Symbol.for("react.offscreen"), x = Symbol.iterator, v = "@@iterator";
+    function H(i) {
+      if (i === null || typeof i != "object")
+        return null;
+      var c = x && i[x] || i[v];
+      return typeof c == "function" ? c : null;
+    }
+    var _ = o.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
+    function E(i) {
+      {
+        for (var c = arguments.length, p = new Array(c > 1 ? c - 1 : 0), m = 1; m < c; m++)
+          p[m - 1] = arguments[m];
+        be("error", i, p);
+      }
+    }
+    function be(i, c, p) {
+      {
+        var m = _.ReactDebugCurrentFrame, j = m.getStackAddendum();
+        j !== "" && (c += "%s", p = p.concat([j]));
+        var C = p.map(function(w) {
+          return String(w);
+        });
+        C.unshift("Warning: " + c), Function.prototype.apply.call(console[i], console, C);
+      }
+    }
+    var we = !1, $ = !1, R = !1, W = !1, U = !1, K;
+    K = Symbol.for("react.module.reference");
+    function Rt(i) {
+      return !!(typeof i == "string" || typeof i == "function" || i === s || i === l || U || i === a || i === h || i === g || W || i === N || we || $ || R || typeof i == "object" && i !== null && (i.$$typeof === S || i.$$typeof === y || i.$$typeof === d || i.$$typeof === f || i.$$typeof === u || // 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.
+      i.$$typeof === K || i.getModuleId !== void 0));
+    }
+    function Dt(i, c, p) {
+      var m = i.displayName;
+      if (m)
+        return m;
+      var j = c.displayName || c.name || "";
+      return j !== "" ? p + "(" + j + ")" : p;
+    }
+    function ze(i) {
+      return i.displayName || "Context";
+    }
+    function Z(i) {
+      if (i == null)
+        return null;
+      if (typeof i.tag == "number" && E("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."), typeof i == "function")
+        return i.displayName || i.name || null;
+      if (typeof i == "string")
+        return i;
+      switch (i) {
+        case s:
+          return "Fragment";
+        case n:
+          return "Portal";
+        case l:
+          return "Profiler";
+        case a:
+          return "StrictMode";
+        case h:
+          return "Suspense";
+        case g:
+          return "SuspenseList";
+      }
+      if (typeof i == "object")
+        switch (i.$$typeof) {
+          case f:
+            var c = i;
+            return ze(c) + ".Consumer";
+          case d:
+            var p = i;
+            return ze(p._context) + ".Provider";
+          case u:
+            return Dt(i, i.render, "ForwardRef");
+          case y:
+            var m = i.displayName || null;
+            return m !== null ? m : Z(i.type) || "Memo";
+          case S: {
+            var j = i, C = j._payload, w = j._init;
+            try {
+              return Z(w(C));
+            } catch {
+              return null;
+            }
+          }
+        }
+      return null;
+    }
+    var V = Object.assign, ee = 0, Ee, Oe, _e, Ye, Ie, Be, Pe;
+    function We() {
+    }
+    We.__reactDisabledLog = !0;
+    function Ht() {
+      {
+        if (ee === 0) {
+          Ee = console.log, Oe = console.info, _e = console.warn, Ye = console.error, Ie = console.group, Be = console.groupCollapsed, Pe = console.groupEnd;
+          var i = {
+            configurable: !0,
+            enumerable: !0,
+            value: We,
+            writable: !0
+          };
+          Object.defineProperties(console, {
+            info: i,
+            log: i,
+            warn: i,
+            error: i,
+            group: i,
+            groupCollapsed: i,
+            groupEnd: i
+          });
+        }
+        ee++;
+      }
+    }
+    function zt() {
+      {
+        if (ee--, ee === 0) {
+          var i = {
+            configurable: !0,
+            enumerable: !0,
+            writable: !0
+          };
+          Object.defineProperties(console, {
+            log: V({}, i, {
+              value: Ee
+            }),
+            info: V({}, i, {
+              value: Oe
+            }),
+            warn: V({}, i, {
+              value: _e
+            }),
+            error: V({}, i, {
+              value: Ye
+            }),
+            group: V({}, i, {
+              value: Ie
+            }),
+            groupCollapsed: V({}, i, {
+              value: Be
+            }),
+            groupEnd: V({}, i, {
+              value: Pe
+            })
+          });
+        }
+        ee < 0 && E("disabledDepth fell below zero. This is a bug in React. Please file an issue.");
+      }
+    }
+    var ye = _.ReactCurrentDispatcher, ve;
+    function ne(i, c, p) {
+      {
+        if (ve === void 0)
+          try {
+            throw Error();
+          } catch (j) {
+            var m = j.stack.trim().match(/\n( *(at )?)/);
+            ve = m && m[1] || "";
+          }
+        return `
+` + ve + i;
+      }
+    }
+    var je = !1, ae;
+    {
+      var Et = typeof WeakMap == "function" ? WeakMap : Map;
+      ae = new Et();
+    }
+    function Ze(i, c) {
+      if (!i || je)
+        return "";
+      {
+        var p = ae.get(i);
+        if (p !== void 0)
+          return p;
+      }
+      var m;
+      je = !0;
+      var j = Error.prepareStackTrace;
+      Error.prepareStackTrace = void 0;
+      var C;
+      C = ye.current, ye.current = null, Ht();
+      try {
+        if (c) {
+          var w = function() {
+            throw Error();
+          };
+          if (Object.defineProperty(w.prototype, "props", {
+            set: function() {
+              throw Error();
+            }
+          }), typeof Reflect == "object" && Reflect.construct) {
+            try {
+              Reflect.construct(w, []);
+            } catch (B) {
+              m = B;
+            }
+            Reflect.construct(i, [], w);
+          } else {
+            try {
+              w.call();
+            } catch (B) {
+              m = B;
+            }
+            i.call(w.prototype);
+          }
+        } else {
+          try {
+            throw Error();
+          } catch (B) {
+            m = B;
+          }
+          i();
+        }
+      } catch (B) {
+        if (B && m && typeof B.stack == "string") {
+          for (var b = B.stack.split(`
+`), I = m.stack.split(`
+`), D = b.length - 1, z = I.length - 1; D >= 1 && z >= 0 && b[D] !== I[z]; )
+            z--;
+          for (; D >= 1 && z >= 0; D--, z--)
+            if (b[D] !== I[z]) {
+              if (D !== 1 || z !== 1)
+                do
+                  if (D--, z--, z < 0 || b[D] !== I[z]) {
+                    var P = `
+` + b[D].replace(" at new ", " at ");
+                    return i.displayName && P.includes("<anonymous>") && (P = P.replace("<anonymous>", i.displayName)), typeof i == "function" && ae.set(i, P), P;
+                  }
+                while (D >= 1 && z >= 0);
+              break;
+            }
+        }
+      } finally {
+        je = !1, ye.current = C, zt(), Error.prepareStackTrace = j;
+      }
+      var X = i ? i.displayName || i.name : "", J = X ? ne(X) : "";
+      return typeof i == "function" && ae.set(i, J), J;
+    }
+    function Ot(i, c, p) {
+      return Ze(i, !1);
+    }
+    function _t(i) {
+      var c = i.prototype;
+      return !!(c && c.isReactComponent);
+    }
+    function le(i, c, p) {
+      if (i == null)
+        return "";
+      if (typeof i == "function")
+        return Ze(i, _t(i));
+      if (typeof i == "string")
+        return ne(i);
+      switch (i) {
+        case h:
+          return ne("Suspense");
+        case g:
+          return ne("SuspenseList");
+      }
+      if (typeof i == "object")
+        switch (i.$$typeof) {
+          case u:
+            return Ot(i.render);
+          case y:
+            return le(i.type, c, p);
+          case S: {
+            var m = i, j = m._payload, C = m._init;
+            try {
+              return le(C(j), c, p);
+            } catch {
+            }
+          }
+        }
+      return "";
+    }
+    var te = Object.prototype.hasOwnProperty, Ge = {}, Fe = _.ReactDebugCurrentFrame;
+    function ce(i) {
+      if (i) {
+        var c = i._owner, p = le(i.type, i._source, c ? c.type : null);
+        Fe.setExtraStackFrame(p);
+      } else
+        Fe.setExtraStackFrame(null);
+    }
+    function Yt(i, c, p, m, j) {
+      {
+        var C = Function.call.bind(te);
+        for (var w in i)
+          if (C(i, w)) {
+            var b = void 0;
+            try {
+              if (typeof i[w] != "function") {
+                var I = Error((m || "React class") + ": " + p + " type `" + w + "` is invalid; it must be a function, usually from the `prop-types` package, but received `" + typeof i[w] + "`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");
+                throw I.name = "Invariant Violation", I;
+              }
+              b = i[w](c, w, m, p, null, "SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED");
+            } catch (D) {
+              b = D;
+            }
+            b && !(b instanceof Error) && (ce(j), E("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).", m || "React class", p, w, typeof b), ce(null)), b instanceof Error && !(b.message in Ge) && (Ge[b.message] = !0, ce(j), E("Failed %s type: %s", p, b.message), ce(null));
+          }
+      }
+    }
+    var It = Array.isArray;
+    function Me(i) {
+      return It(i);
+    }
+    function Bt(i) {
+      {
+        var c = typeof Symbol == "function" && Symbol.toStringTag, p = c && i[Symbol.toStringTag] || i.constructor.name || "Object";
+        return p;
+      }
+    }
+    function Pt(i) {
+      try {
+        return Le(i), !1;
+      } catch {
+        return !0;
+      }
+    }
+    function Le(i) {
+      return "" + i;
+    }
+    function Ue(i) {
+      if (Pt(i))
+        return E("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.", Bt(i)), Le(i);
+    }
+    var ie = _.ReactCurrentOwner, Wt = {
+      key: !0,
+      ref: !0,
+      __self: !0,
+      __source: !0
+    }, Ve, Je, Ce;
+    Ce = {};
+    function Zt(i) {
+      if (te.call(i, "ref")) {
+        var c = Object.getOwnPropertyDescriptor(i, "ref").get;
+        if (c && c.isReactWarning)
+          return !1;
+      }
+      return i.ref !== void 0;
+    }
+    function Gt(i) {
+      if (te.call(i, "key")) {
+        var c = Object.getOwnPropertyDescriptor(i, "key").get;
+        if (c && c.isReactWarning)
+          return !1;
+      }
+      return i.key !== void 0;
+    }
+    function Ft(i, c) {
+      if (typeof i.ref == "string" && ie.current && c && ie.current.stateNode !== c) {
+        var p = Z(ie.current.type);
+        Ce[p] || (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', Z(ie.current.type), i.ref), Ce[p] = !0);
+      }
+    }
+    function Lt(i, c) {
+      {
+        var p = function() {
+          Ve || (Ve = !0, E("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", c));
+        };
+        p.isReactWarning = !0, Object.defineProperty(i, "key", {
+          get: p,
+          configurable: !0
+        });
+      }
+    }
+    function Ut(i, c) {
+      {
+        var p = function() {
+          Je || (Je = !0, E("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)", c));
+        };
+        p.isReactWarning = !0, Object.defineProperty(i, "ref", {
+          get: p,
+          configurable: !0
+        });
+      }
+    }
+    var Vt = function(i, c, p, m, j, C, w) {
+      var b = {
+        // This tag allows us to uniquely identify this as a React Element
+        $$typeof: t,
+        // Built-in properties that belong on the element
+        type: i,
+        key: c,
+        ref: p,
+        props: w,
+        // Record the component responsible for creating this element.
+        _owner: C
+      };
+      return b._store = {}, Object.defineProperty(b._store, "validated", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: !1
+      }), Object.defineProperty(b, "_self", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !1,
+        value: m
+      }), Object.defineProperty(b, "_source", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !1,
+        value: j
+      }), Object.freeze && (Object.freeze(b.props), Object.freeze(b)), b;
+    };
+    function Jt(i, c, p, m, j) {
+      {
+        var C, w = {}, b = null, I = null;
+        p !== void 0 && (Ue(p), b = "" + p), Gt(c) && (Ue(c.key), b = "" + c.key), Zt(c) && (I = c.ref, Ft(c, j));
+        for (C in c)
+          te.call(c, C) && !Wt.hasOwnProperty(C) && (w[C] = c[C]);
+        if (i && i.defaultProps) {
+          var D = i.defaultProps;
+          for (C in D)
+            w[C] === void 0 && (w[C] = D[C]);
+        }
+        if (b || I) {
+          var z = typeof i == "function" ? i.displayName || i.name || "Unknown" : i;
+          b && Lt(w, z), I && Ut(w, z);
+        }
+        return Vt(i, b, I, j, m, ie.current, w);
+      }
+    }
+    var Ae = _.ReactCurrentOwner, qe = _.ReactDebugCurrentFrame;
+    function q(i) {
+      if (i) {
+        var c = i._owner, p = le(i.type, i._source, c ? c.type : null);
+        qe.setExtraStackFrame(p);
+      } else
+        qe.setExtraStackFrame(null);
+    }
+    var Te;
+    Te = !1;
+    function Ne(i) {
+      return typeof i == "object" && i !== null && i.$$typeof === t;
+    }
+    function Xe() {
+      {
+        if (Ae.current) {
+          var i = Z(Ae.current.type);
+          if (i)
+            return `
+
+Check the render method of \`` + i + "`.";
+        }
+        return "";
+      }
+    }
+    function qt(i) {
+      return "";
+    }
+    var Qe = {};
+    function Xt(i) {
+      {
+        var c = Xe();
+        if (!c) {
+          var p = typeof i == "string" ? i : i.displayName || i.name;
+          p && (c = `
+
+Check the top-level render call using <` + p + ">.");
+        }
+        return c;
+      }
+    }
+    function $e(i, c) {
+      {
+        if (!i._store || i._store.validated || i.key != null)
+          return;
+        i._store.validated = !0;
+        var p = Xt(c);
+        if (Qe[p])
+          return;
+        Qe[p] = !0;
+        var m = "";
+        i && i._owner && i._owner !== Ae.current && (m = " It was passed a child from " + Z(i._owner.type) + "."), q(i), E('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.', p, m), q(null);
+      }
+    }
+    function Ke(i, c) {
+      {
+        if (typeof i != "object")
+          return;
+        if (Me(i))
+          for (var p = 0; p < i.length; p++) {
+            var m = i[p];
+            Ne(m) && $e(m, c);
+          }
+        else if (Ne(i))
+          i._store && (i._store.validated = !0);
+        else if (i) {
+          var j = H(i);
+          if (typeof j == "function" && j !== i.entries)
+            for (var C = j.call(i), w; !(w = C.next()).done; )
+              Ne(w.value) && $e(w.value, c);
+        }
+      }
+    }
+    function Qt(i) {
+      {
+        var c = i.type;
+        if (c == null || typeof c == "string")
+          return;
+        var p;
+        if (typeof c == "function")
+          p = c.propTypes;
+        else if (typeof c == "object" && (c.$$typeof === u || // Note: Memo only checks outer props here.
+        // Inner props are checked in the reconciler.
+        c.$$typeof === y))
+          p = c.propTypes;
+        else
+          return;
+        if (p) {
+          var m = Z(c);
+          Yt(p, i.props, "prop", m, i);
+        } else if (c.PropTypes !== void 0 && !Te) {
+          Te = !0;
+          var j = Z(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.");
+      }
+    }
+    function $t(i) {
+      {
+        for (var c = Object.keys(i.props), p = 0; p < c.length; p++) {
+          var m = c[p];
+          if (m !== "children" && m !== "key") {
+            q(i), E("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.", m), q(null);
+            break;
+          }
+        }
+        i.ref !== null && (q(i), E("Invalid attribute `ref` supplied to `React.Fragment`."), q(null));
+      }
+    }
+    var et = {};
+    function tt(i, c, p, m, j, C) {
+      {
+        var w = Rt(i);
+        if (!w) {
+          var b = "";
+          (i === void 0 || typeof i == "object" && i !== null && Object.keys(i).length === 0) && (b += " You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");
+          var I = qt();
+          I ? b += I : b += Xe();
+          var D;
+          i === null ? D = "null" : Me(i) ? D = "array" : i !== void 0 && i.$$typeof === t ? (D = "<" + (Z(i.type) || "Unknown") + " />", b = " Did you accidentally export a JSX literal instead of a component?") : D = typeof i, E("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s", D, b);
+        }
+        var z = Jt(i, c, p, j, C);
+        if (z == null)
+          return z;
+        if (w) {
+          var P = c.children;
+          if (P !== void 0)
+            if (m)
+              if (Me(P)) {
+                for (var X = 0; X < P.length; X++)
+                  Ke(P[X], i);
+                Object.freeze && Object.freeze(P);
+              } else
+                E("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");
+            else
+              Ke(P, i);
+        }
+        if (te.call(c, "key")) {
+          var J = Z(i), B = Object.keys(c).filter(function(ri) {
+            return ri !== "key";
+          }), Se = B.length > 0 ? "{key: someKey, " + B.join(": ..., ") + ": ...}" : "{key: someKey}";
+          if (!et[J + Se]) {
+            var oi = B.length > 0 ? "{" + B.join(": ..., ") + ": ...}" : "{}";
+            E(`A props object containing a "key" prop is being spread into JSX:
+  let props = %s;
+  <%s {...props} />
+React keys must be passed directly to JSX without using spread:
+  let props = %s;
+  <%s key={someKey} {...props} />`, Se, J, oi, J), et[J + Se] = !0;
+          }
+        }
+        return i === s ? $t(z) : Qt(z), z;
+      }
+    }
+    function Kt(i, c, p) {
+      return tt(i, c, p, !0);
+    }
+    function ei(i, c, p) {
+      return tt(i, c, p, !1);
+    }
+    var ti = ei, ii = Kt;
+    re.Fragment = s, re.jsx = ti, re.jsxs = ii;
+  }()), re;
+}
+process.env.NODE_ENV === "production" ? He.exports = jo() : He.exports = Mo();
+var e = He.exports;
+const A = {
+  Camera: gi,
+  Check: xi,
+  Square: bi,
+  Circle: wi,
+  Slash: yi,
+  MoveDownLeft: vi,
+  Pencil: ji,
+  Smile: Mi,
+  Undo: Ci,
+  Redo: Ai,
+  ChevronRight: Ti,
+  ChevronDown: Ni,
+  ChevronUp: Si,
+  RotateCcw: ki,
+  ZoomIn: Ri,
+  ZoomOut: Di,
+  Hand: Hi,
+  Crop: zi,
+  FlipHorizontal2: Ei,
+  FlipVertical2: Oi,
+  Sunset: _i,
+  Box: Yi,
+  LayoutGrid: Ii,
+  ImagePlus: Bi,
+  Type: Pi,
+  CodeXml: Wi,
+  ClipboardPaste: Zi,
+  ImagePlay: Gi,
+  Maximize: Fi,
+  ListCollapse: Li,
+  ArrowUpRight: Ui,
+  ArrowDownRight: Vi,
+  ImageDown: Ji,
+  Copy: qi,
+  Settings2: Xi,
+  ChevronLeft: Qi,
+  Pipette: $i,
+  Trash2: Ki
+}, xe = (o) => {
+  const t = () => {
+    if (!window.EyeDropper) return;
+    new EyeDropper().open().then((s) => {
+      const a = s.sRGBHex;
+      o != null && o.onChange && o.onChange(new eo(a));
+    }).catch((s) => {
+      console.log(s);
+    });
+  };
+  return /* @__PURE__ */ e.jsx(
+    ai,
+    {
+      ...o,
+      panelRender: (n) => /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+        window.EyeDropper && /* @__PURE__ */ e.jsx("div", { className: "mb-1", children: /* @__PURE__ */ e.jsx(T, { type: "text", shape: "circle", size: "small", icon: /* @__PURE__ */ e.jsx(A.Pipette, { size: 16 }), onClick: t }) }),
+        n
+      ] })
+    }
+  );
+}, Co = [
+  {
+    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
+  },
+  {
+    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-[2px]" }) }),
+    key: 2
+  },
+  {
+    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-[4px]" }) }),
+    key: 4
+  },
+  {
+    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-[6px]" }) }),
+    key: 6
+  },
+  {
+    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
+  }
+], Ao = ({ defaultValue: o, onChange: t }) => {
+  const n = ({ key: s }) => {
+    t(s);
+  };
+  return /* @__PURE__ */ e.jsx(
+    vt,
+    {
+      menu: { items: Co, onClick: n, selectedKeys: [o] },
+      trigger: ["click"],
+      placement: "bottom",
+      children: /* @__PURE__ */ e.jsx(
+        T,
+        {
+          type: "text",
+          shape: "circle",
+          className: "px-1.5 py-0 flex items-center justify-center",
+          children: /* @__PURE__ */ e.jsx("div", { className: "w-4 h-4 flex items-center cursor-pointer", children: /* @__PURE__ */ e.jsx(
+            "i",
+            {
+              className: "block w-full origin-center rounded-lg bg-slate-600 -rotate-45",
+              style: {
+                height: o + "px"
+              }
+            }
+          ) })
+        }
+      )
+    }
+  );
+};
+let To = (o, t = 21) => (n = t) => {
+  let s = "", a = n;
+  for (; a--; )
+    s += o[Math.random() * o.length | 0];
+  return s;
+};
+const No = () => {
+  const o = typeof navigator == "object" ? navigator.platform : "";
+  return /Mac|iPod|iPhone|iPad/.test(o);
+}, ft = No() ? "⌘" : "Ctrl", At = [
+  "image/jpeg",
+  "image/png",
+  "image/bmp",
+  "image/gif",
+  "image/webp"
+];
+function G(...o) {
+  return io(to(o));
+}
+const he = To(
+  "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz",
+  7
+), So = (o, 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;
+}, ko = (o, t, n = 950, s = 450) => {
+  let a = o, l = t;
+  return a > n && (l *= n / a, a = n), l > s && (a *= s / l, l = s), { width: a, height: l };
+}, Ro = (o) => {
+  const t = new Image();
+  return o.startsWith("data") || (t.crossOrigin = "Anonymous"), new Promise(function(n, s) {
+    t.onload = function() {
+      n(t);
+    };
+    const a = function() {
+      return s(
+        new Error("An error occurred attempting to load image")
+      );
+    };
+    t.onerror = a, t.onabort = a, t.src = o;
+  });
+}, Do = (o, t, n) => o === "top-left" ? {
+  x: 0,
+  y: 0
+} : o === "top" ? {
+  x: t / 2,
+  y: 0
+} : o === "top-right" ? {
+  x: t,
+  y: 0
+} : o === "left" ? {
+  x: 0,
+  y: n / 2
+} : o === "right" ? {
+  x: t,
+  y: n / 2
+} : o === "bottom-left" ? {
+  x: 0,
+  y: n
+} : o === "bottom" ? {
+  x: t / 2,
+  y: n
+} : o === "bottom-right" ? {
+  x: t,
+  y: n
+} : { x: t / 2, y: n / 2 }, Ho = (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));
+  return {
+    width: Math.round(a),
+    height: Math.round(l)
+  };
+}, zo = ({ text: o, 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);
+  const { width: l, height: d } = s.getBoundingClientRect();
+  document.body.removeChild(s);
+  const f = Ho(l, d, n), u = `
+        <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>
+        </div>
+    `, h = `<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%">
+                    ${u}
+                </foreignObject>
+            </svg>`, g = new Blob([h], { type: "image/svg+xml;charset=utf-8" });
+  return (window.URL || window.webkitURL || window).createObjectURL(g);
+};
+let pt, Eo = class {
+  constructor() {
+    k(this, "img", {});
+    k(this, "invalid", !1);
+    k(this, "app", null);
+    k(this, "scale", 100);
+    k(this, "useTool", null);
+    k(this, "annotateColor", "#ff0000");
+    k(this, "strokeWidth", 4);
+    k(this, "shapes", /* @__PURE__ */ new Map());
+    k(this, "message", null);
+    jt(this);
+  }
+  get shapesList() {
+    return Array.from(Mt(this.shapes).values());
+  }
+  get cursor() {
+    return this.useTool === "Pencil" ? "pencil" : this.useTool ? "crosshair" : "auto";
+  }
+  get isEditing() {
+    var n;
+    const t = !!((n = this.app) != null && n.tree);
+    return t || (this.message.info("Please add a image"), this.setInvalid()), t;
+  }
+  setInvalid() {
+    clearTimeout(pt), this.invalid = !0, pt = setTimeout(oo(() => {
+      this.invalid = !1;
+    }), 200);
+  }
+  setImg(t) {
+    this.img = t;
+  }
+  setMessage(t) {
+    this.message = t;
+  }
+  getShape(t) {
+    return this.shapes.get(t);
+  }
+  addShape(t) {
+    this.shapes.set(t.id, t);
+  }
+  removeShape(t) {
+    this.shapes.delete(t.id);
+  }
+  setApp(t) {
+    this.app = t;
+  }
+  setScale(t) {
+    this.scale = parseInt(t * 100);
+  }
+  setUseTool(t) {
+    this.useTool = t, t ? this.setSelect(!1) : this.setSelect(!0);
+  }
+  setSelect(t) {
+    this.app && (this.app.editor.app.config.move.drag = !1, this.app.editor.hittable = t);
+  }
+  setAnnotateColor(t) {
+    this.annotateColor = t;
+  }
+  setStrokeWidth(t) {
+    this.strokeWidth = t;
+  }
+  clearImg() {
+    this.img = {};
+  }
+  destroy() {
+    var t;
+    (t = this.app) == null || t.destroy(), this.app = null;
+  }
+};
+const Oo = new Eo(), Q = {
+  default_1: {
+    class: "bg-gradient-to-r from-indigo-500 via-purple-500 to-pink-500",
+    fill: {
+      type: "linear",
+      from: "left",
+      to: "right",
+      stops: ["#6366f1", "#a855f7", "#ec4899"]
+    }
+  },
+  default_2: {
+    class: "bg-gradient-to-r from-red-500 via-pink-500 to-violet-500",
+    fill: {
+      type: "linear",
+      from: "left",
+      to: "right",
+      stops: ["#ef4444", "#ec4899", "#8b5cf6"]
+    }
+  },
+  default_3: {
+    class: "bg-gradient-to-r from-violet-800 via-pink-600 to-orange-500",
+    fill: {
+      type: "linear",
+      from: "left",
+      to: "right",
+      stops: ["#5b21b6", "#db2777", "#f97316"]
+    }
+  },
+  default_4: {
+    class: "bg-gradient-to-r from-orange-400 to-rose-400",
+    fill: {
+      type: "linear",
+      from: "left",
+      to: "right",
+      stops: ["#fb923c", "#fb7185"]
+    }
+  },
+  default_5: {
+    class: "bg-gradient-to-r from-[#4284DB] to-[#29EAC4]",
+    fill: {
+      type: "linear",
+      from: "left",
+      to: "right",
+      stops: ["#4284DB", "#29EAC4"]
+    }
+  },
+  default_6: {
+    class: "bg-gradient-to-r from-[#fc00ff] to-[#00dbde]",
+    fill: {
+      type: "linear",
+      from: "left",
+      to: "right",
+      stops: ["#fc00ff", "#00dbde"]
+    }
+  },
+  default_7: {
+    class: "bg-gradient-to-br from-[#eeddf3] via-[#ee92b1] to-[#6330b4]",
+    fill: {
+      type: "linear",
+      from: "left",
+      to: "right",
+      stops: ["#eeddf3", "#ee92b1", "#6330b4"]
+    }
+  },
+  solid_1: {
+    class: "bg-transparent",
+    fill: {
+      type: "solid",
+      color: "#ffffff00"
+    }
+  },
+  solid_2: {
+    class: "bg-slate-400",
+    fill: {
+      type: "solid",
+      color: "#94a3b8"
+    }
+  },
+  solid_3: {
+    class: "bg-gray-400",
+    fill: {
+      type: "solid",
+      color: "#9ca3af"
+    }
+  },
+  solid_4: {
+    class: "bg-stone-400",
+    fill: {
+      type: "solid",
+      color: "#a8a29e"
+    }
+  },
+  solid_5: {
+    class: "bg-red-400",
+    fill: {
+      type: "solid",
+      color: "#f87171"
+    }
+  },
+  solid_6: {
+    class: "bg-orange-400",
+    fill: {
+      type: "solid",
+      color: "#fb923c"
+    }
+  },
+  solid_7: {
+    class: "bg-amber-400",
+    fill: {
+      type: "solid",
+      color: "#facc15"
+    }
+  },
+  solid_8: {
+    class: "bg-yellow-400",
+    fill: {
+      type: "solid",
+      color: "#fbbf24"
+    }
+  },
+  solid_9: {
+    class: "bg-lime-400",
+    fill: {
+      type: "solid",
+      color: "#a3e635"
+    }
+  },
+  solid_10: {
+    class: "bg-green-400",
+    fill: {
+      type: "solid",
+      color: "#4ade80"
+    }
+  },
+  solid_11: {
+    class: "bg-emerald-400",
+    fill: {
+      type: "solid",
+      color: "#34d399"
+    }
+  },
+  solid_12: {
+    class: "bg-teal-400",
+    fill: {
+      type: "solid",
+      color: "#2dd4bf"
+    }
+  },
+  solid_13: {
+    class: "bg-cyan-400",
+    fill: {
+      type: "solid",
+      color: "#22d3ee"
+    }
+  },
+  solid_14: {
+    class: "bg-sky-400",
+    fill: {
+      type: "solid",
+      color: "#38bdf8"
+    }
+  },
+  solid_15: {
+    class: "bg-blue-400",
+    fill: {
+      type: "solid",
+      color: "#60a5fa"
+    }
+  },
+  solid_16: {
+    class: "bg-indigo-400",
+    fill: {
+      type: "solid",
+      color: "#818cf8"
+    }
+  },
+  solid_17: {
+    class: "bg-violet-400",
+    fill: {
+      type: "solid",
+      color: "#a78bfa"
+    }
+  },
+  solid_18: {
+    class: "bg-purple-400",
+    fill: {
+      type: "solid",
+      color: "#c084fc"
+    }
+  },
+  solid_19: {
+    class: "bg-fuchsia-400",
+    fill: {
+      type: "solid",
+      color: "#e879f9"
+    }
+  },
+  solid_20: {
+    class: "bg-pink-400",
+    fill: {
+      type: "solid",
+      color: "#f472b6"
+    }
+  },
+  solid_21: {
+    class: "bg-rose-400",
+    fill: {
+      type: "solid",
+      color: "#fb7185"
+    }
+  },
+  gradient_1: {
+    class: "bg-gradient-to-br from-[#ff6432] from-12.8% via-[#ff0065] via-43.52% to-[#7b2eff] to-84.34%",
+    fill: {
+      type: "linear",
+      from: "top-left",
+      to: "bottom-right",
+      stops: [
+        { offset: 0.12, color: "#ff6432" },
+        { offset: 0.44, color: "#ff0065" },
+        { offset: 0.84, color: "#7b2eff" }
+      ]
+    }
+  },
+  gradient_2: {
+    class: "bg-gradient-to-br from-[#69eacb] from-0% via-[#eaccf8] via-48% to-[#6654f1] to-100%",
+    fill: {
+      type: "linear",
+      from: "top-left",
+      to: "bottom-right",
+      stops: [
+        { offset: 0, color: "#69eacb" },
+        { offset: 0.48, color: "#eaccf8" },
+        { offset: 1, color: "#6654f1" }
+      ]
+    }
+  },
+  gradient_3: {
+    class: "bg-gradient-to-br from-[#f9f047] to-[#0fd850]",
+    fill: {
+      type: "linear",
+      from: "top-left",
+      to: "bottom-right",
+      stops: ["#f9f047", "#0fd850"]
+    }
+  },
+  cosmic_img_1: {
+    class: "https://images.unsplash.com/photo-1579546929518-9e396f3cc809?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwxfHxncmFkaWVudHxlbnwwfHx8fDE3MDMwNjAzNjh8MA&ixlib=rb-4.0.3&q=80",
+    fill: {
+      type: "image",
+      url: "https://images.unsplash.com/photo-1579546929518-9e396f3cc809?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwxfHxncmFkaWVudHxlbnwwfHx8fDE3MDMwNjAzNjh8MA&ixlib=rb-4.0.3&q=80"
+    }
+  },
+  cosmic_img_2: {
+    class: "https://images.unsplash.com/photo-1604076913837-52ab5629fba9?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwzfHxncmFkaWVudHxlbnwwfHx8fDE3MDMwNjAzNjh8MA&ixlib=rb-4.0.3&q=80",
+    fill: {
+      type: "image",
+      url: "https://images.unsplash.com/photo-1604076913837-52ab5629fba9?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwzfHxncmFkaWVudHxlbnwwfHx8fDE3MDMwNjAzNjh8MA&ixlib=rb-4.0.3&q=80"
+    }
+  },
+  cosmic_img_3: {
+    class: "https://images.unsplash.com/photo-1553356084-58ef4a67b2a7?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwxN3x8Z3JhZGllbnR8ZW58MHx8fHwxNzAzMDYwMzY4fDA&ixlib=rb-4.0.3&q=80",
+    fill: {
+      type: "image",
+      url: "https://images.unsplash.com/photo-1553356084-58ef4a67b2a7?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwxN3x8Z3JhZGllbnR8ZW58MHx8fHwxNzAzMDYwMzY4fDA&ixlib=rb-4.0.3&q=80"
+    }
+  },
+  cosmic_img_4: {
+    class: "https://images.unsplash.com/photo-1618397746666-63405ce5d015?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwyN3x8Z3JhZGllbnR8ZW58MHx8fHwxNzAzMDM3NjcwfDA&ixlib=rb-4.0.3&q=80",
+    fill: {
+      type: "image",
+      url: "https://images.unsplash.com/photo-1618397746666-63405ce5d015?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwyN3x8Z3JhZGllbnR8ZW58MHx8fHwxNzAzMDM3NjcwfDA&ixlib=rb-4.0.3&q=80"
+    }
+  },
+  cosmic_img_5: {
+    class: "https://images.unsplash.com/photo-1579548122080-c35fd6820ecb?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwzNnx8Z3JhZGllbnR8ZW58MHx8fHwxNzAzMDM3NjcwfDA&ixlib=rb-4.0.3&q=80",
+    fill: {
+      type: "image",
+      url: "https://images.unsplash.com/photo-1579548122080-c35fd6820ecb?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwzNnx8Z3JhZGllbnR8ZW58MHx8fHwxNzAzMDM3NjcwfDA&ixlib=rb-4.0.3&q=80"
+    }
+  },
+  cosmic_img_6: {
+    class: "https://images.unsplash.com/photo-1564951434112-64d74cc2a2d7?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHw0Nnx8Z3JhZGllbnR8ZW58MHx8fHwxNzAzMDMyNzM1fDA&ixlib=rb-4.0.3&q=80",
+    fill: {
+      type: "image",
+      url: "https://images.unsplash.com/photo-1564951434112-64d74cc2a2d7?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHw0Nnx8Z3JhZGllbnR8ZW58MHx8fHwxNzAzMDMyNzM1fDA&ixlib=rb-4.0.3&q=80"
+    }
+  },
+  cosmic_img_7: {
+    class: "https://images.unsplash.com/photo-1636990649778-fd699d27c875?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHw1Mnx8Z3JhZGllbnR8ZW58MHx8fHwxNzAzMDMyNzM1fDA&ixlib=rb-4.0.3&q=80",
+    fill: {
+      type: "image",
+      url: "https://images.unsplash.com/photo-1636990649778-fd699d27c875?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHw1Mnx8Z3JhZGllbnR8ZW58MHx8fHwxNzAzMDMyNzM1fDA&ixlib=rb-4.0.3&q=80"
+    }
+  },
+  cosmic_img_8: {
+    class: "https://images.unsplash.com/photo-1640177155742-835de7b2a9a0?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHw5MHx8Z3JhZGllbnR8ZW58MHx8fHwxNzAzMDU0Njg3fDA&ixlib=rb-4.0.3&q=80",
+    fill: {
+      type: "image",
+      url: "https://images.unsplash.com/photo-1640177155742-835de7b2a9a0?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHw5MHx8Z3JhZGllbnR8ZW58MHx8fHwxNzAzMDU0Njg3fDA&ixlib=rb-4.0.3&q=80"
+    }
+  },
+  cosmic_img_9: {
+    class: "https://images.unsplash.com/photo-1523396206913-a003efa7861b?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwxMTh8fGdyYWRpZW50fGVufDB8fHx8MTcwMzEyMDMzOHww&ixlib=rb-4.0.3&q=80",
+    fill: {
+      type: "image",
+      url: "https://images.unsplash.com/photo-1523396206913-a003efa7861b?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwxMTh8fGdyYWRpZW50fGVufDB8fHx8MTcwMzEyMDMzOHww&ixlib=rb-4.0.3&q=80"
+    }
+  },
+  cosmic_img_10: {
+    class: "https://images.unsplash.com/photo-1552152370-fb05b25ff17d?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwxNjJ8fGdyYWRpZW50fGVufDB8fHx8MTcwMzA3ODE5Mnww&ixlib=rb-4.0.3&q=80",
+    fill: {
+      type: "image",
+      url: "https://images.unsplash.com/photo-1552152370-fb05b25ff17d?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwxNjJ8fGdyYWRpZW50fGVufDB8fHx8MTcwMzA3ODE5Mnww&ixlib=rb-4.0.3&q=80"
+    }
+  },
+  cosmic_img_11: {
+    class: "https://images.unsplash.com/photo-1635776063043-ab23b4c226f6?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwyMjZ8fGdyYWRpZW50fGVufDB8fHx8MTcwMzA4MjI2NHww&ixlib=rb-4.0.3&q=80",
+    fill: {
+      type: "image",
+      url: "https://images.unsplash.com/photo-1635776063043-ab23b4c226f6?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwyMjZ8fGdyYWRpZW50fGVufDB8fHx8MTcwMzA4MjI2NHww&ixlib=rb-4.0.3&q=80"
+    }
+  },
+  cosmic_img_12: {
+    class: "https://images.unsplash.com/photo-1640963269654-3fe248c5fba6?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwyNTZ8fGdyYWRpZW50fGVufDB8fHx8MTcwMzA4NDU3Nnww&ixlib=rb-4.0.3&q=80",
+    fill: {
+      type: "image",
+      url: "https://images.unsplash.com/photo-1640963269654-3fe248c5fba6?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwyNTZ8fGdyYWRpZW50fGVufDB8fHx8MTcwMzA4NDU3Nnww&ixlib=rb-4.0.3&q=80"
+    }
+  },
+  cosmic_img_13: {
+    class: "https://images.unsplash.com/photo-1595131264179-84bb2f9e17b9?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwyNjh8fGdyYWRpZW50fGVufDB8fHx8MTcwMzA2NzI3OXww&ixlib=rb-4.0.3&q=80",
+    fill: {
+      type: "image",
+      url: "https://images.unsplash.com/photo-1595131264179-84bb2f9e17b9?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwyNjh8fGdyYWRpZW50fGVufDB8fHx8MTcwMzA2NzI3OXww&ixlib=rb-4.0.3&q=80"
+    }
+  },
+  cosmic_img_14: {
+    class: "https://images.unsplash.com/photo-1642116876554-b17f937ee90b?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwxNzV8fGdyYWRpZW50fGVufDB8fHx8MTcwMzA3ODE5Mnww&ixlib=rb-4.0.3&q=80",
+    fill: {
+      type: "image",
+      url: "https://images.unsplash.com/photo-1642116876554-b17f937ee90b?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHwxNzV8fGdyYWRpZW50fGVufDB8fHx8MTcwMzA3ODE5Mnww&ixlib=rb-4.0.3&q=80"
+    }
+  },
+  cosmic_img_15: {
+    class: "https://images.unsplash.com/photo-1586455122341-927f2dec0691?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHw3MHx8Z3JhZGllbnR8ZW58MHx8fHwxNzAzMDQ3MjE1fDA&ixlib=rb-4.0.3&q=80",
+    fill: {
+      type: "image",
+      url: "https://images.unsplash.com/photo-1586455122341-927f2dec0691?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wxMTY5OTZ8MHwxfHNlYXJjaHw3MHx8Z3JhZGllbnR8ZW58MHx8fHwxNzAzMDQ3MjE1fDA&ixlib=rb-4.0.3&q=80"
+    }
+  },
+  desktop_img_1: {
+    class: "https://images.unsplash.com/photo-1511860810434-a92f84c6f01e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&q=80",
+    fill: {
+      type: "image",
+      url: "https://images.unsplash.com/photo-1511860810434-a92f84c6f01e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&q=80"
+    }
+  },
+  desktop_img_2: {
+    class: "https://images.unsplash.com/photo-1554110397-9bac083977c6?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&q=80",
+    fill: {
+      type: "image",
+      url: "https://images.unsplash.com/photo-1554110397-9bac083977c6?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&q=80"
+    }
+  },
+  desktop_img_3: {
+    class: "https://images.unsplash.com/photo-1671180881490-8af6e9c3eaf1?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&q=80",
+    fill: {
+      type: "image",
+      url: "https://images.unsplash.com/photo-1671180881490-8af6e9c3eaf1?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&q=80"
+    }
+  },
+  desktop_img_4: {
+    class: "https://images.unsplash.com/photo-1671549296089-88b3a6eb347e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&q=80",
+    fill: {
+      type: "image",
+      url: "https://images.unsplash.com/photo-1671549296089-88b3a6eb347e?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&q=80"
+    }
+  },
+  desktop_img_5: {
+    class: "https://images.unsplash.com/photo-1668718031554-9c05b5d03750?&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&q=80",
+    fill: {
+      type: "image",
+      url: "https://images.unsplash.com/photo-1668718031554-9c05b5d03750?&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&q=80"
+    }
+  }
+};
+class _o {
+  constructor() {
+    k(this, "scale", 1);
+    k(this, "scaleX", !1);
+    k(this, "scaleY", !1);
+    k(this, "padding", 0);
+    k(this, "paddingBg", "rgba(255,255,255, 100)");
+    k(this, "round", 10);
+    k(this, "shadow", 3);
+    k(this, "frame", "none");
+    k(this, "background", "default_1");
+    k(this, "align", "center");
+    k(this, "waterImg", null);
+    k(this, "waterIndex", 1);
+    k(this, "size", {
+      type: "auto",
+      title: "Auto"
+    });
+    k(this, "frameConf", {
+      width: 800,
+      height: 600,
+      background: {
+        type: "linear",
+        from: "left",
+        to: "right",
+        stops: ["#6366f1", "#a855f7", "#ec4899"]
+      }
+    });
+    jt(this);
+  }
+  get waterSvg() {
+    return Mt(this.waterImg);
+  }
+  setScale(t) {
+    this.scale = t;
+  }
+  setPadding(t) {
+    this.padding = t;
+  }
+  setPaddingBg(t) {
+    this.paddingBg = t;
+  }
+  setRound(t) {
+    this.round = t;
+  }
+  setShadow(t) {
+    this.shadow = t;
+  }
+  setFrameSize(t, n) {
+    !t || !n || (this.frameConf.width = t, this.frameConf.height = n);
+  }
+  setAlign(t) {
+    this.align = t;
+  }
+  setSize(t) {
+    this.size.type = t.type, this.size.title = t.title, this.setFrameSize(t.width, t.height);
+  }
+  setBackground(t) {
+    this.background = t, this.frameConf.background = Q[t].fill;
+  }
+  toggleFlip(t) {
+    t === "x" && (this.scaleX = !this.scaleX), t === "y" && (this.scaleY = !this.scaleY);
+  }
+  setWaterImg(t) {
+    this.waterImg = t;
+  }
+  setWaterIndex(t) {
+    this.waterIndex = t;
+  }
+}
+const Yo = new _o(), r = {
+  editor: Oo,
+  option: Yo
+}, Io = ({ disabled: o = !1, toSelect: t, locale: n = "en" }) => {
+  const [s, a] = O(!1), l = () => {
+    a(!1);
+  }, d = (u) => {
+    a(u);
+  }, f = (u) => {
+    t(u.native), l();
+  };
+  return /* @__PURE__ */ e.jsx(
+    ge,
+    {
+      content: /* @__PURE__ */ e.jsx(so, { data: ro, locale: n, onEmojiSelect: f, previewPosition: "none" }),
+      title: "",
+      trigger: "click",
+      open: s,
+      onOpenChange: d,
+      children: /* @__PURE__ */ e.jsx(
+        T,
+        {
+          type: "text",
+          shape: "circle",
+          disabled: o,
+          icon: /* @__PURE__ */ e.jsx(A.Smile, { size: 16 })
+        }
+      )
+    }
+  );
+}, Bo = () => /* @__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 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" }),
+      /* @__PURE__ */ e.jsx("path", { d: "M179.201 136.846C173.053 115.627 185.269 93.4418 206.488 87.2932L367.654 40.5909C388.872 34.4423 411.058 46.6588 417.206 67.8773L505.29 371.846C511.438 393.065 499.222 415.25 478.003 421.399L316.837 468.101C295.619 474.25 273.433 462.033 267.285 440.815L179.201 136.846Z", fill: "#0DB7FF" }),
+      /* @__PURE__ */ e.jsx("path", { d: "M206.488 87.2932C185.269 93.4418 173.053 115.627 179.201 136.846L254.874 397.986L303.989 127.432C307.935 105.696 293.513 84.8767 271.777 80.9308L245.134 76.0943L206.488 87.2932Z", fill: "#EC83FD" }),
+      /* @__PURE__ */ e.jsx("path", { d: "M401 404C401 416.703 390.703 427 378 427C365.297 427 355 416.703 355 404C355 391.297 365.297 381 378 381C390.703 381 401 391.297 401 404Z", fill: "#0D97D3" }),
+      /* @__PURE__ */ e.jsx("path", { d: "M144 404C144 416.703 133.703 427 121 427C108.297 427 98 416.703 98 404C98 391.297 108.297 381 121 381C133.703 381 144 391.297 144 404Z", fill: "#6616CB" })
+    ] }),
+    /* @__PURE__ */ e.jsx("defs", { children: /* @__PURE__ */ e.jsxs("filter", { id: "filter0_i_40_60", x: "3", y: "39", width: "503.881", height: "432.679", filterUnits: "userSpaceOnUse", colorInterpolationFilters: "sRGB", children: [
+      /* @__PURE__ */ e.jsx("feFlood", { floodOpacity: "0", result: "BackgroundImageFix" }),
+      /* @__PURE__ */ e.jsx("feBlend", { mode: "normal", in: "SourceGraphic", in2: "BackgroundImageFix", result: "shape" }),
+      /* @__PURE__ */ e.jsx("feColorMatrix", { in: "SourceAlpha", type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0", result: "hardAlpha" }),
+      /* @__PURE__ */ e.jsx("feOffset", { dx: "-2" }),
+      /* @__PURE__ */ e.jsx("feComposite", { in2: "hardAlpha", operator: "arithmetic", k2: "-1", k3: "1" }),
+      /* @__PURE__ */ e.jsx("feColorMatrix", { type: "matrix", values: "0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.7 0" }),
+      /* @__PURE__ */ e.jsx("feBlend", { mode: "normal", in2: "shape", result: "effect1_innerShadow_40_60" })
+    ] }) })
+  ] }),
+  /* @__PURE__ */ e.jsx("span", { children: "ShotEasy" })
+] }) }), Po = () => /* @__PURE__ */ e.jsxs("div", { className: "flex-1 flex justify-end items-end gap-2", children: [
+  /* @__PURE__ */ e.jsx("a", { href: "https://github.com/CH563/image-beautifier", target: "_blank", "aria-label": "GitHub", className: "block rounded-full p-1.5 hover:bg-slate-100", 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-1.5 hover:bg-slate-100", 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" }) }) }) })
+] }), Wo = ["Square", "SquareFill", "Circle", "Slash", "MoveDownLeft", "Pencil", "Smile"], Zo = Y(() => {
+  const [o, t] = O(!1), n = (l) => {
+    if (!r.editor.isEditing) return;
+    const { useTool: d } = r.editor;
+    r.editor.setUseTool(d === l ? null : l), t(!1);
+  }, s = (l) => {
+    if (!r.editor.isEditing) return;
+    const d = r.option.frameConf.width / 2 - 24, f = r.option.frameConf.height / 2 - 24;
+    r.editor.setUseTool(null), t(!1), r.editor.addShape({
+      id: he(),
+      type: "emoji",
+      text: l,
+      zIndex: r.editor.shapes.size + 1,
+      x: d,
+      y: f,
+      editable: !0
+    });
+  }, a = () => {
+    if (!r.editor.isEditing) return;
+    const l = !o;
+    r.editor.setUseTool(null), t(l), r.editor.app.config.move.drag = l;
+  };
+  return /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-center shrink-0 gap-3 bg-white py-2 px-5 border-b border-b-gray-50 shadow-sm relative z-[11] select-none", children: [
+    /* @__PURE__ */ e.jsx("div", { className: "flex-1", children: /* @__PURE__ */ e.jsx(Bo, {}) }),
+    /* @__PURE__ */ e.jsx("div", { className: "flex gap-1 justify-center items-center", children: Wo.map((l) => {
+      if (l === "Smile") return /* @__PURE__ */ e.jsx(Io, { disabled: !1, toSelect: s }, l);
+      let d;
+      if (l.includes("Fill")) {
+        const f = l.replace("Fill", ""), u = at[f];
+        d = /* @__PURE__ */ e.jsx(u, { size: 16, fill: "currentColor" });
+      } else {
+        const f = at[l];
+        d = /* @__PURE__ */ e.jsx(f, { name: l, size: 16 });
+      }
+      return /* @__PURE__ */ e.jsx(
+        T,
+        {
+          type: "text",
+          shape: "circle",
+          icon: d,
+          className: r.editor.useTool === l && "text-[#1677ff] bg-sky-100/50 hover:bg-sky-100 hover:text-[#1677ff]",
+          onClick: () => n(l)
+        },
+        l
+      );
+    }) }),
+    /* @__PURE__ */ e.jsx(li, { type: "vertical" }),
+    /* @__PURE__ */ e.jsxs("div", { className: "flex gap-1 justify-center items-center", children: [
+      /* @__PURE__ */ e.jsx(
+        xe,
+        {
+          size: "small",
+          presets: [
+            {
+              label: "Recommended",
+              colors: [
+                "#ffffff",
+                "#444444",
+                "#df4b26",
+                "#1677ff",
+                "#52C41A",
+                "#FA8C16",
+                "#FADB14",
+                "#EB2F96",
+                "#722ED1"
+              ]
+            }
+          ],
+          value: r.editor.annotateColor,
+          onChange: (l) => r.editor.setAnnotateColor(l.toHexString())
+        }
+      ),
+      /* @__PURE__ */ e.jsx(Ao, { defaultValue: r.editor.strokeWidth, onChange: (l) => r.editor.setStrokeWidth(l) }),
+      /* @__PURE__ */ e.jsx(
+        T,
+        {
+          type: "text",
+          shape: "circle",
+          className: o && "text-[#1677ff] bg-sky-100/50 hover:bg-sky-100 hover:text-[#1677ff]",
+          icon: /* @__PURE__ */ e.jsx(A.Hand, { size: 16 }),
+          onClick: a
+        }
+      )
+    ] }),
+    /* @__PURE__ */ e.jsx(Po, {})
+  ] });
+});
+function Go(o) {
+  var t = typeof o;
+  return o != null && (t == "object" || t == "function");
+}
+var Tt = Go, Fo = typeof fe == "object" && fe && fe.Object === Object && fe, Lo = Fo, Uo = Lo, Vo = typeof self == "object" && self && self.Object === Object && self, Jo = Uo || Vo || Function("return this")(), Nt = Jo, qo = Nt, Xo = function() {
+  return qo.Date.now();
+}, Qo = Xo, $o = /\s/;
+function Ko(o) {
+  for (var t = o.length; t-- && $o.test(o.charAt(t)); )
+    ;
+  return t;
+}
+var er = Ko, tr = er, ir = /^\s+/;
+function or(o) {
+  return o && o.slice(0, tr(o) + 1).replace(ir, "");
+}
+var rr = or, sr = Nt, nr = sr.Symbol, St = nr, ut = St, kt = Object.prototype, ar = kt.hasOwnProperty, lr = kt.toString, se = ut ? ut.toStringTag : void 0;
+function cr(o) {
+  var t = ar.call(o, se), n = o[se];
+  try {
+    o[se] = void 0;
+    var s = !0;
+  } catch {
+  }
+  var a = lr.call(o);
+  return s && (t ? o[se] = n : delete o[se]), a;
+}
+var dr = cr, fr = Object.prototype, pr = fr.toString;
+function ur(o) {
+  return pr.call(o);
+}
+var hr = ur, ht = St, mr = dr, gr = hr, xr = "[object Null]", br = "[object Undefined]", mt = ht ? ht.toStringTag : void 0;
+function wr(o) {
+  return o == null ? o === void 0 ? br : xr : mt && mt in Object(o) ? mr(o) : gr(o);
+}
+var yr = wr;
+function vr(o) {
+  return o != null && typeof o == "object";
+}
+var jr = vr, Mr = yr, Cr = jr, Ar = "[object Symbol]";
+function Tr(o) {
+  return typeof o == "symbol" || Cr(o) && Mr(o) == Ar;
+}
+var Nr = Tr, Sr = rr, gt = Tt, kr = Nr, xt = NaN, Rr = /^[-+]0x[0-9a-f]+$/i, Dr = /^0b[01]+$/i, Hr = /^0o[0-7]+$/i, zr = parseInt;
+function Er(o) {
+  if (typeof o == "number")
+    return o;
+  if (kr(o))
+    return xt;
+  if (gt(o)) {
+    var t = typeof o.valueOf == "function" ? o.valueOf() : o;
+    o = gt(t) ? t + "" : t;
+  }
+  if (typeof o != "string")
+    return o === 0 ? o : +o;
+  o = Sr(o);
+  var n = Dr.test(o);
+  return n || Hr.test(o) ? zr(o.slice(2), n ? 2 : 8) : Rr.test(o) ? xt : +o;
+}
+var Or = Er, _r = Tt, Re = Qo, bt = Or, Yr = "Expected a function", Ir = Math.max, Br = Math.min;
+function Pr(o, t, n) {
+  var s, a, l, d, f, u, h = 0, g = !1, y = !1, S = !0;
+  if (typeof o != "function")
+    throw new TypeError(Yr);
+  t = bt(t) || 0, _r(n) && (g = !!n.leading, y = "maxWait" in n, l = y ? Ir(bt(n.maxWait) || 0, t) : l, S = "trailing" in n ? !!n.trailing : S);
+  function N(R) {
+    var W = s, U = a;
+    return s = a = void 0, h = R, d = o.apply(U, W), d;
+  }
+  function x(R) {
+    return h = R, f = setTimeout(_, t), g ? N(R) : d;
+  }
+  function v(R) {
+    var W = R - u, U = R - h, K = t - W;
+    return y ? Br(K, l - U) : K;
+  }
+  function H(R) {
+    var W = R - u, U = R - h;
+    return u === void 0 || W >= t || W < 0 || y && U >= l;
+  }
+  function _() {
+    var R = Re();
+    if (H(R))
+      return E(R);
+    f = setTimeout(_, v(R));
+  }
+  function E(R) {
+    return f = void 0, S && s ? N(R) : (s = a = void 0, d);
+  }
+  function be() {
+    f !== void 0 && clearTimeout(f), h = 0, s = u = a = f = void 0;
+  }
+  function we() {
+    return f === void 0 ? d : E(Re());
+  }
+  function $() {
+    var R = Re(), W = H(R);
+    if (s = arguments, a = this, u = R, W) {
+      if (f === void 0)
+        return x(u);
+      if (y)
+        return clearTimeout(f), f = setTimeout(_, t), N(u);
+    }
+    return f === void 0 && (f = setTimeout(_, t)), d;
+  }
+  return $.cancel = be, $.flush = we, $;
+}
+var Wr = Pr;
+const Zr = /* @__PURE__ */ vo(Wr), Gr = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAIAAAAlC+aJAAAACXBIWXMAAAsTAAALEwEAmpwYAAAFHGlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDUgNzkuMTYzNDk5LCAyMDE4LzA4LzEzLTE2OjQwOjIyICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxOSAoV2luZG93cykiIHhtcDpDcmVhdGVEYXRlPSIyMDI0LTA0LTE1VDEyOjUwOjI3KzA4OjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAyNC0wNC0xNVQxMjo1MzowOSswODowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAyNC0wNC0xNVQxMjo1MzowOSswODowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHBob3Rvc2hvcDpDb2xvck1vZGU9IjMiIHBob3Rvc2hvcDpJQ0NQcm9maWxlPSJzUkdCIElFQzYxOTY2LTIuMSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDoxNTY3NDQxZC1lYmQxLWIwNGUtOWUwOS0yMWQ1Mjk3NzAxNzMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MTU2NzQ0MWQtZWJkMS1iMDRlLTllMDktMjFkNTI5NzcwMTczIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6MTU2NzQ0MWQtZWJkMS1iMDRlLTllMDktMjFkNTI5NzcwMTczIj4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDoxNTY3NDQxZC1lYmQxLWIwNGUtOWUwOS0yMWQ1Mjk3NzAxNzMiIHN0RXZ0OndoZW49IjIwMjQtMDQtMTVUMTI6NTA6MjcrMDg6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE5IChXaW5kb3dzKSIvPiA8L3JkZjpTZXE+IDwveG1wTU06SGlzdG9yeT4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7YEaJEAAAFqUlEQVRoge2Z709TVxjHT2kpFMpCLdSWdiWYFVK0IAV0yBqNYQ2CI062ie4PcJq9QZAfmRq0UwQmIRjjFBeXOJfAYHEYZ81ixQUmJhbkBb9aSotcpHDbYltbU0t69+LqXQPa9Nyit0v6zXlx2p7v8zyfe0977jmlYRgG/s+KorqAUBUBoFoRAKoVAaBaEQCqFQGgWhEAqsUIfqjZbG5parI7HLV1dRKJZPUAt9uNoqhucvKfgQGTyYRaLAtmMwBAIpGkpqbKsrJy5PLU1NS4uLg1Kx8AgAWtcy0tdADoANTX1vp8Pv+PrFZrT3f3gf37JRs24GPe2AQ83tcHDvx6/brFYgk+b2BBABytqsLr+PbwYY/Hg7/pdDp/6+r6rLQ0hsEIUPqKVlpc/HtPj9frDR0AYgpFRb36wtBoNBqNBgAYGhpSNTTcvn17eXmZGCaRSKRS6YdisSAlZR2HgyCI0WhEEGTk8WOHw4GPUavVmnv3KioqVKdPC4XC9zSF6mpq8OtXVVmJYVhXZ+dHaWnERWUxmV+Vl/9y7dro6OjS0tLy8jJhdLlc8/Pz9/v6TjY05GRn+9+Kop07dTpdKHeADMA3Bw+ebWzkJibiLxk02u6Skr6+PqfTGTiCz+czm82qU6dEKSkEw+asrIeDg+8VQMDjxcfG4v342NiWpqYXL15AZR0YGMiTy/0ZDAYDZOWvRAaAaHExMa3nzpFLPDo6qigsJEJ9vmePy+UiEYc8ADcx8ceLF0mkJDQ9Pb01Px+PxqTTz7e3kwhCHqCstPTp06cGg2HqtfR6/bNnz6DSa7VakUCAB9wklZpMJsj6YQBqqqv9AVLWr5dt3JiZkUE0aXr67pKSmZkZqArOnjlDxGxpboasHwbgu/r6YBapjsuXoSqw2Wxb8vJwr3zzZgRBoOwQD3OFCkVSUlJCQsIHb1duXt6OHTugFiIOh1N55Ai+Mk7p9dPT01B2iJVYqVT+pdHMPnlCrMT+wjCMwWBIMzNFIhFUBQCAjwsKxGLxzMyMy+XS6XQKhQLCDHW/3pGcTmfFvn34LDp86BCUNyz2A2w2WyaT4X2DXg/lDQsAAACfz8c7iygKZQwXgOTkZBaLBQBAFxehjOECwGazmUwmAOD58+dQxnABWFxcdLvdAIB1XC6UMVwAUBT1er0AAF5yMpQxLABevnw5OTGB95PeHQCGYT9duVJYUHD50iVsTf9ZW1hY0Ny9i/ezs7PhzMEvGWNjY2KhkA4Aj8vVarVQy01g/XHjBvEo1dPdDeWFuANxLFYihwMAsFqt59vb8SkbuhwOx4ULF/C+QCBIz8iA80Ph/vD6aIjFZN5Rq6G8b9PZxkb/PYbD4YCywwGYTCZZZiaeLE8un52dhbKv1uPhYWJDw2axujo7YSNAP8y1t7VFR0XhKUt27VpaWoKNQMhsNn+ybRtx+b/cu9ftdsMGgQaw2+3KoiIia7FSqdfrYYNgGIYgyJ6ysv/2dzzePY2GRBwyj9PDQ0NpYjGRe2t+/t/370NF6O/v35Kb63+60dbauuK8NUiR3A/c7O0V8fn+p7Ynjh+fn5/3P5BbLa/Xq9PpGk6cEItEhJdJpx8/doxcGRhpAAzDBh88WHFOmC2T1dfW3lGrjUaj1Wr1eDw+n8/tdttsNsPU1M3e3qrKSuIrizeRQNDS3BwYO7BoWAhr6uTExNHq6j9v3fJ/k8FgbJLJ+AKBSChMSEhAUdRms80hyMjIyAq7QqFoUKm2b99OugAAQt5S2u32n69e9f8xCaZlSCTfq1SwBxBv1Nrsiefm5q50dHxRXr4+KSlw6bk5OadOnhwfH1+TvFiIU2iFXC6X0Wh8ODioffTIYrFYLBar1RodHR0fH89ms3Pk8k+VyvT0dD6fv/pQg7TWEoAShcV+IBRFAKhWBIBqRQCoVgSAakUAqFYEgGr9C1O6hDD/uqSdAAAAAElFTkSuQmCC", Fr = "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=", Lr = (o, t) => t instanceof Array ? t.map((n) => it.toArray(n).map(
+  (s) => ot(s, { ...o })
+)) : it.toArray(t).map(
+  (s) => ot(s, { ...o })
+), Ur = ({ width: o, height: t, background: n, parent: s, children: a, cursor: l }) => {
+  const d = me(() => {
+    const f = new no({
+      width: o,
+      height: t,
+      overflow: "hide",
+      fill: n,
+      cursor: "auto"
+    });
+    return f.name = "frame", f;
+  }, []);
+  return M(() => {
+    d.width = o, d.height = t, d.fill = n;
+  }, [o, t, n]), M(() => {
+    d.cursor = l || "auto";
+  }, [l]), M(() => (s.add(d), () => {
+    d.remove();
+  }), [s]), /* @__PURE__ */ e.jsx(e.Fragment, { children: Lr({ parent: d }, a) });
+}, Vr = Y(({ parent: o }) => {
+  const [t, n] = me(() => {
+    const s = new ao({
+      url: r.editor.img.src,
+      origin: "center"
+    }), a = new lo({
+      overflow: "hide",
+      scale: 1,
+      children: [s]
+    });
+    return [s, a];
+  }, [o]);
+  return M(() => {
+    r.option.padding === 0 ? n.fill = "#ffffff00" : n.fill = r.option.paddingBg;
+  }, [r.option.paddingBg, r.option.padding]), M(() => {
+    n.cornerRadius = r.option.round, t.cornerRadius = r.option.round - 2;
+  }, [r.option.round]), M(() => {
+    const { shadow: s } = r.option;
+    s === 0 ? n.shadow = null : n.shadow = {
+      x: s * 4,
+      y: s * 4,
+      blur: s * 3,
+      color: "#00000045",
+      box: !0
+    };
+  }, [r.option.shadow]), M(() => {
+    n.scale = r.option.scale;
+  }, [r.option.scale]), M(() => {
+    t.url = r.editor.img.src;
+  }, [r.editor.img.src]), M(() => {
+    t.scaleX = r.option.scaleX ? -1 : 1;
+  }, [r.option.scaleX]), M(() => {
+    t.scaleY = r.option.scaleY ? -1 : 1;
+  }, [r.option.scaleY]), M(() => {
+    const s = Math.round(r.option.frameConf.width * 0.2), { width: a, height: l } = ko(r.editor.img.width, r.editor.img.height, r.option.frameConf.width - s, r.option.frameConf.height - s);
+    t.width = a - r.option.padding, t.height = l - r.option.padding, n.width = a, n.height = l, n.origin = r.option.align;
+    const { x: d, y: f } = Do(r.option.align, r.option.frameConf.width - a, r.option.frameConf.height - l);
+    n.x = d, n.y = f, r.option.padding > 0 && (t.x = r.option.padding / 2, t.y = r.option.padding / 2);
+  }, [r.option.frameConf.width, r.option.frameConf.height, r.option.padding, r.option.align]), M(() => (o.add(n), () => {
+    n.remove();
+  }), [o]), null;
+}), Jr = Y(({ parent: o }) => {
+  const t = me(() => new De({
+    x: 0,
+    y: 0
+  }), [o]);
+  return M(() => {
+    t.width = r.option.frameConf.width, t.height = r.option.frameConf.height;
+  }, [r.option.frameConf.width, r.option.frameConf.height]), M(() => {
+    t.zIndex = r.option.waterIndex;
+  }, [r.option.waterIndex]), M(() => {
+    t.fill = {
+      type: "image",
+      url: r.option.waterSvg,
+      mode: "repeat",
+      format: "svg",
+      size: Math.round(r.option.frameConf.width / 6)
+    };
+  }, [r.option.waterSvg, r.option.frameConf.width]), M(() => (o.add(t), () => {
+    t.remove();
+  }), []), null;
+}), qr = ({ parent: o, type: t, id: n, width: s, height: a, x: l, y: d, fill: f, strokeWidth: u, zIndex: h, points: g, editable: y, text: S }) => {
+  const N = me(() => {
+    const x = { id: n, x: l, y: d, zIndex: h };
+    return t === "SquareFill" ? new De({
+      cornerRadius: 8,
+      width: s,
+      height: a,
+      fill: f,
+      ...x
+    }) : t === "Circle" ? new co({
+      stroke: f,
+      strokeWidth: u,
+      width: s,
+      height: a,
+      ...x
+    }) : t === "Slash" ? new lt({
+      id: n,
+      points: g,
+      zIndex: h,
+      stroke: f,
+      strokeWidth: u
+    }) : t === "MoveDownLeft" ? new bo({
+      id: n,
+      points: g,
+      zIndex: h,
+      strokeCap: "round",
+      strokeJoin: "round",
+      stroke: f,
+      strokeWidth: u
+    }) : t === "Pencil" ? new lt({
+      id: n,
+      points: g,
+      zIndex: h,
+      curve: !0,
+      stroke: f,
+      strokeWidth: u
+    }) : t === "emoji" ? new fo({
+      id: n,
+      zIndex: h,
+      text: S,
+      resizeFontSize: !0,
+      fontSize: 48
+    }) : new De({
+      cornerRadius: 8,
+      stroke: f,
+      strokeWidth: u,
+      width: s,
+      height: a,
+      ...x
+    });
+  }, [o]);
+  return M(() => {
+    ["Slash", "MoveDownLeft", "Pencil"].includes(t) ? N.points = g : (N.x = l, N.y = d, N.width = s, N.height = a);
+  }, [l, d, s, a]), M(() => {
+    N.editable = !!y;
+  }, [y]), M(() => (o.add(N), () => {
+    N.remove();
+  }), [o]), null;
+}, Xr = Y(() => (M(() => {
+  const o = (s) => {
+    var l;
+    const { list: a } = (l = r.editor.app) == null ? void 0 : l.editor;
+    if (a != null && a.length) {
+      for (let d of a)
+        d.remove(), r.editor.removeShape(d);
+      r.editor.app.editor.cancel();
+    }
+  }, t = (s) => {
+    var a, l;
+    s === "fit" ? (a = r.editor.app) == null || a.tree.zoom(s, 100) : (l = r.editor.app) == null || l.tree.zoom(s), r.editor.setScale(r.editor.app.tree.scale);
+  }, n = Ct(window, {
+    Backspace: o,
+    Delete: o,
+    "$mod+Minus": (s) => {
+      s.preventDefault(), t("out");
+    },
+    "$mod+Equal": (s) => {
+      s.preventDefault(), t("in");
+    },
+    "$mod+Digit0": (s) => {
+      s.preventDefault(), t("fit");
+    }
+  });
+  return () => {
+    n();
+  };
+}, [window]), null));
+po.set("pencil", { url: Fr });
+const Qr = Y(({ target: o }) => {
+  var t, n;
+  return M(() => {
+    const s = new uo({
+      view: o,
+      editor: {
+        lockRatio: "corner",
+        stroke: "#3f99f7",
+        skewable: !1,
+        hover: !1,
+        middlePoint: { cornerRadius: 100, width: 20, height: 6 },
+        rotatePoint: {
+          width: 20,
+          height: 20,
+          fill: {
+            type: "image",
+            url: Gr
+          }
+        }
+      },
+      tree: {
+        usePartRender: !0
+      },
+      sky: {
+        type: "draw",
+        usePartRender: !0
+      }
+    });
+    new wo(s), r.editor.setApp(s), s.tree.on(ho.ZOOM, () => {
+      r.editor.setScale(s.tree.scale);
+    }), s.tree.on(mo.RESIZE, () => {
+      r.editor.setScale(s.tree.scale);
+    });
+    let a = null;
+    s.tree.on(ke.START, (d) => {
+      if (!r.editor.useTool) return;
+      const { target: f } = d;
+      if (r.editor.getShape(f.id)) return;
+      a = he();
+      const h = d.getPageBounds(), g = r.editor.useTool, y = {
+        id: a,
+        type: g,
+        fill: r.editor.annotateColor,
+        strokeWidth: r.editor.strokeWidth,
+        zIndex: r.editor.shapes.size + 1,
+        ...h
+      };
+      ["Slash", "MoveDownLeft", "Pencil"].includes(g) && (y.points = [h.x, h.y]), r.editor.addShape(y);
+    }), s.tree.on(ke.DRAG, (d) => {
+      if (!r.editor.useTool || !a) return;
+      const f = r.editor.getShape(a);
+      if (!f) return;
+      const u = d.getPageBounds(), h = Object.assign({}, f, u), { points: g, type: y } = h;
+      if (g && g.length) {
+        const { x: S, y: N } = d.getInnerTotal(), x = S > 0 ? u.x + S : u.x, v = N > 0 ? u.y + N : u.y;
+        y === "Pencil" ? h.points = [...g, x, v] : h.points = [g[0], g[1], x, v];
+      }
+      r.editor.addShape(h);
+    }), s.tree.on(ke.END, () => {
+      if (!r.editor.useTool || !a) return;
+      const d = r.editor.getShape(a);
+      d && ((d.width === 0 || d.height === 0) && !["Slash", "MoveDownLeft", "Pencil"].includes(d.type) ? r.editor.removeShape(d) : r.editor.addShape(Object.assign({}, d, { editable: !0 }))), a = null, r.editor.useTool !== "Pencil" && r.editor.setUseTool(null);
+    });
+    const l = Zr(() => {
+      const { width: d, height: f } = o.getBoundingClientRect();
+      s.tree.zoom("fit", 100), r.option.frameConf.width < d && r.option.frameConf.height < f && s.tree.zoom(1);
+    }, 10);
+    return go(o, l), () => {
+      xo(o, l), r.editor.destroy();
+    };
+  }, [o]), M(() => {
+    const s = setTimeout(() => {
+      const { width: a, height: l } = o.getBoundingClientRect();
+      r.editor.app.tree.zoom("fit", 100), r.option.frameConf.width < a && r.option.frameConf.height < l && r.editor.app.tree.zoom(1), r.editor.setScale(r.editor.app.tree.scale);
+    }, 20);
+    return () => {
+      clearTimeout(s);
+    };
+  }, [r.option.frameConf.width, r.option.frameConf.height]), (t = r.editor.app) != null && t.tree ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+    /* @__PURE__ */ e.jsxs(Ur, { parent: r.editor.app.tree, cursor: r.editor.cursor, ...r.option.frameConf, children: [
+      r.editor.shapesList.map((s) => /* @__PURE__ */ e.jsx(qr, { ...s }, s.id)),
+      ((n = r.editor.img) == null ? void 0 : n.src) && /* @__PURE__ */ e.jsx(Vr, {}),
+      r.option.waterImg && /* @__PURE__ */ e.jsx(Jr, {})
+    ] }),
+    /* @__PURE__ */ e.jsx(Xr, {})
+  ] }) : null;
+}), $r = [
+  {
+    key: 0.5,
+    label: "50%"
+  },
+  {
+    key: 1,
+    label: "100%"
+  },
+  {
+    key: 1.5,
+    label: "150%"
+  },
+  {
+    key: 2,
+    label: "200%"
+  }
+], Kr = Y(() => {
+  const o = (n) => {
+    var s;
+    (s = r.editor.app) == null || s.tree.zoom(n), r.editor.setScale(r.editor.app.tree.scale);
+  }, t = (n) => {
+    var a, l;
+    const s = Number(n.key);
+    s === 4 ? (a = r.editor.app) == null || a.tree.zoom("fit", 100) : (l = r.editor.app) == null || l.tree.zoom(s), r.editor.setScale(r.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 overflow-hidden rounded-full shadow-md", children: [
+      /* @__PURE__ */ e.jsx(T, { type: "text", icon: /* @__PURE__ */ e.jsx(A.ZoomIn, { size: 16 }), onClick: () => o("in") }),
+      /* @__PURE__ */ e.jsx(vt, { menu: { items: $r, onClick: t }, placement: "top", children: /* @__PURE__ */ e.jsxs(T, { type: "text", children: [
+        r.editor.scale,
+        "%"
+      ] }) }),
+      /* @__PURE__ */ e.jsx(T, { type: "text", icon: /* @__PURE__ */ e.jsx(A.ZoomOut, { size: 16 }), onClick: () => o("out") })
+    ] }),
+    /* @__PURE__ */ e.jsx("div", { className: "rounded-full bg-white shadow-md overflow-hidden", children: /* @__PURE__ */ e.jsx(T, { type: "text", icon: /* @__PURE__ */ e.jsx(A.Maximize, { size: 16 }), onClick: () => t({ key: 4 }) }) })
+  ] });
+}), es = Y(() => {
+  const [o, 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(Qr, { target: o }) }),
+    /* @__PURE__ */ e.jsx(Kr, {})
+  ] });
+}), ts = [
+  {
+    key: "default",
+    title: "Default",
+    lists: [
+      {
+        width: 1920,
+        height: 1080,
+        w: 16,
+        h: 9
+      },
+      {
+        width: 1920,
+        height: 1280,
+        w: 3,
+        h: 2
+      },
+      {
+        width: 1920,
+        height: 1440,
+        w: 4,
+        h: 3
+      },
+      {
+        width: 1920,
+        height: 1536,
+        w: 5,
+        h: 4
+      },
+      {
+        width: 1920,
+        height: 1920,
+        w: 1,
+        h: 1
+      },
+      {
+        width: 1080,
+        height: 1350,
+        w: 4,
+        h: 5
+      },
+      {
+        width: 1080,
+        height: 1440,
+        w: 3,
+        h: 4
+      },
+      {
+        width: 1080,
+        height: 1620,
+        w: 2,
+        h: 3
+      },
+      {
+        width: 1080,
+        height: 1920,
+        w: 9,
+        h: 16
+      }
+    ]
+  },
+  {
+    key: "instagram",
+    title: "Instagram",
+    lists: [
+      {
+        title: "Post",
+        width: 1080,
+        height: 1080,
+        w: 1,
+        h: 1
+      },
+      {
+        title: "Portrait",
+        width: 1080,
+        height: 1350,
+        w: 4,
+        h: 5
+      },
+      {
+        title: "Stroy",
+        width: 1080,
+        height: 1920,
+        w: 9,
+        h: 16
+      }
+    ]
+  },
+  {
+    key: "x",
+    title: "X",
+    lists: [
+      {
+        title: "Tweet",
+        width: 1200,
+        height: 675,
+        w: 16,
+        h: 9
+      },
+      {
+        title: "Cover",
+        width: 1500,
+        height: 500,
+        w: 3,
+        h: 1
+      }
+    ]
+  },
+  {
+    key: "youtube",
+    title: "YouTube",
+    lists: [
+      {
+        title: "Banner",
+        width: 2560,
+        height: 1440,
+        w: 16,
+        h: 9
+      },
+      {
+        title: "Thumbnail",
+        width: 1280,
+        height: 720,
+        w: 16,
+        h: 9
+      },
+      {
+        title: "Video",
+        width: 1920,
+        height: 1080,
+        w: 16,
+        h: 9
+      }
+    ]
+  },
+  {
+    key: "pinterest",
+    title: "Pinterest",
+    lists: [
+      {
+        title: "Long",
+        width: 1e3,
+        height: 2100,
+        w: 10,
+        h: 21
+      },
+      {
+        title: "Optimal",
+        width: 1e3,
+        height: 1500,
+        w: 2,
+        h: 3
+      },
+      {
+        title: "Square",
+        width: 1e3,
+        height: 1e3,
+        w: 1,
+        h: 1
+      }
+    ]
+  }
+], is = ({ frameWidth: o, frameHeight: t, type: n, onSet: s }) => {
+  const [a, l] = O(""), [d, f] = O(""), u = () => {
+    s({ type: "auto", title: "Auto" });
+  }, h = () => {
+    s({ type: "custom", title: "Custom", width: a, height: d });
+  };
+  return M(() => {
+    n === "custom" ? (l(o), f(t)) : (l(""), f(""));
+  }, [n]), /* @__PURE__ */ e.jsxs("div", { className: "flex gap-2 items-center py-2 font-normal", children: [
+    /* @__PURE__ */ e.jsx(
+      rt,
+      {
+        min: 1,
+        value: a,
+        onChange: l,
+        placeholder: o,
+        prefix: /* @__PURE__ */ e.jsx("span", { className: "opacity-60 mx-1", children: "W" }),
+        className: "flex-1"
+      }
+    ),
+    /* @__PURE__ */ e.jsx("span", { className: "text-xs opacity-50", children: "x" }),
+    /* @__PURE__ */ e.jsx(
+      rt,
+      {
+        min: 1,
+        value: d,
+        onChange: f,
+        placeholder: t,
+        prefix: /* @__PURE__ */ e.jsx("span", { className: "opacity-60 mx-1", children: "H" }),
+        className: "flex-1"
+      }
+    ),
+    /* @__PURE__ */ e.jsx(
+      T,
+      {
+        type: "primary",
+        shape: "circle",
+        icon: /* @__PURE__ */ e.jsx(A.Check, { size: 18 }),
+        disabled: !a || !d,
+        onClick: h
+      }
+    ),
+    /* @__PURE__ */ e.jsx(F, { title: "Auto size", children: /* @__PURE__ */ e.jsx(
+      T,
+      {
+        type: "primary",
+        shape: "circle",
+        icon: /* @__PURE__ */ e.jsx(A.Maximize, { size: 18 }),
+        disabled: n === "auto",
+        onClick: u
+      }
+    ) })
+  ] });
+}, os = Y(() => {
+  var N;
+  const o = ue(null), [t, n] = O(!1), [s, a] = O(500), l = () => {
+    n(!1);
+  }, d = (x) => {
+    if (n(x), x && o.current) {
+      const { height: v, y: H } = o.current.getBoundingClientRect(), _ = document.body.clientHeight - v - H - 80;
+      a(_);
+    }
+  }, f = (x, v) => !(x !== r.option.size.type || v.height !== r.option.frameConf.height || v.width !== r.option.frameConf.width), u = (x) => {
+    if (l(), x.type === "auto" && r.editor.img.width) {
+      const v = Math.round(r.editor.img.width * 0.2);
+      r.option.setSize({ ...x, width: r.editor.img.width + v, height: r.editor.img.height + v });
+      return;
+    }
+    r.option.setSize(x);
+  }, h = (x, v, H) => {
+    l(), r.option.setSize({
+      type: x,
+      title: `${v}${H.title ? ` ${H.title} ` : " "}${H.w} : ${H.h}`,
+      width: H.width,
+      height: H.height
+    });
+  }, g = ((N = r.editor.img) == null ? void 0 : N.src) || r.option.size.type !== "auto", y = /* @__PURE__ */ e.jsx(is, { type: r.option.size.type, frameWidth: r.option.frameConf.width, frameHeight: r.option.frameConf.height, onSet: u }), S = /* @__PURE__ */ e.jsx("div", { className: "border-t border-gray-200 py-2 divide-y", children: ts.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((v, H) => /* @__PURE__ */ e.jsxs(
+      T,
+      {
+        type: "text",
+        className: "flex-[33%] p-3 h-auto flex-col gap-0 disabled:bg-blue-500/5 disabled:border-blue-500 disabled:cursor-default disabled:text-black",
+        disabled: f(x.key, v),
+        onClick: () => h(x.key, x.title, v),
+        children: [
+          /* @__PURE__ */ e.jsx("div", { className: "py-2 px-3 w-full", children: /* @__PURE__ */ e.jsx(
+            "div",
+            {
+              className: "border border-black/50 bg-black/10 w-full flex items-center justify-center rounded-md opacity-75",
+              style: { aspectRatio: v.w / v.h },
+              children: /* @__PURE__ */ e.jsxs("span", { children: [
+                v.w,
+                " : ",
+                v.h
+              ] })
+            }
+          ) }),
+          v.title && /* @__PURE__ */ e.jsx("div", { className: "text-xs", children: v.title }),
+          /* @__PURE__ */ e.jsxs("div", { className: "text-xs overflow-hidden text-gray-500", children: [
+            v.width,
+            " x ",
+            v.height
+          ] })
+        ]
+      },
+      H
+    )) })
+  ] }, x.key)) });
+  return /* @__PURE__ */ e.jsx(
+    ge,
+    {
+      content: S,
+      title: y,
+      trigger: "click",
+      arrow: !1,
+      placement: "bottomRight",
+      open: t,
+      overlayClassName: "[&_.ant-popover-inner]:h-full [&_.ant-popover-inner]:overflow-x-hidden [&_.ant-popover-inner]:overflow-y-auto [&_.ant-popover-content]:h-full",
+      overlayStyle: {
+        width: "400px",
+        height: `${s}px`
+      },
+      onOpenChange: d,
+      children: /* @__PURE__ */ e.jsxs("div", { className: G("px-3 py-1.5 border shrink-0 border-gray-200 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: [
+        /* @__PURE__ */ e.jsx(
+          "div",
+          {
+            className: "border border-black/50 bg-black/10 w-4 rounded-sm",
+            style: { aspectRatio: r.option.frameConf.width / r.option.frameConf.height }
+          }
+        ),
+        /* @__PURE__ */ e.jsxs("div", { className: "text-xs", children: [
+          /* @__PURE__ */ e.jsx("div", { className: "font-semibold leading-3 mb-0.5", children: r.option.size.title }),
+          g ? /* @__PURE__ */ e.jsxs("div", { className: "text-gray-500 leading-3", children: [
+            r.option.frameConf.width,
+            " x ",
+            r.option.frameConf.height,
+            " px"
+          ] }) : /* @__PURE__ */ e.jsx("div", { className: "text-gray-500 leading-3", children: "Adaptive screenshot size" })
+        ] }),
+        /* @__PURE__ */ e.jsx("div", { className: "flex-1" }),
+        t ? /* @__PURE__ */ e.jsx(A.ChevronUp, { size: 16 }) : /* @__PURE__ */ e.jsx(A.ChevronDown, { size: 16 })
+      ] })
+    }
+  );
+}), rs = Y(() => {
+  const o = ue(null), [t, n] = O(!1), s = () => {
+    n(!0);
+  }, a = () => {
+    var d, f;
+    if (typeof ((d = o.current) == null ? void 0 : d.cropper) < "u") {
+      const u = (f = o.current) == null ? void 0 : f.cropper.getCroppedCanvas();
+      if (u) {
+        const { width: h, height: g } = u, y = u.toDataURL();
+        if (r.editor.setImg(Object.assign({}, r.editor.img, {
+          src: y,
+          width: h,
+          height: g
+        })), r.option.size.type === "auto") {
+          const S = Math.round(h * 0.2);
+          r.option.setFrameSize(h + S, g + S);
+        }
+      }
+    }
+    n(!1);
+  }, l = () => {
+    n(!1);
+  };
+  return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+    /* @__PURE__ */ e.jsx(F, { title: "Crop Image", children: /* @__PURE__ */ e.jsx(
+      T,
+      {
+        type: "text",
+        shape: "circle",
+        icon: /* @__PURE__ */ e.jsx(A.Crop, { size: 18 }),
+        onClick: s
+      }
+    ) }),
+    /* @__PURE__ */ e.jsx(
+      ci,
+      {
+        title: "Cropper",
+        open: t,
+        onOk: a,
+        onCancel: l,
+        destroyOnClose: !0,
+        children: /* @__PURE__ */ e.jsx(
+          yo,
+          {
+            ref: o,
+            style: { height: 400, width: "100%" },
+            zoomTo: 0.5,
+            initialAspectRatio: r.editor.img.width / r.editor.img.height,
+            src: r.editor.img.src,
+            dragMode: "move",
+            viewMode: 1,
+            minCropBoxHeight: 10,
+            minCropBoxWidth: 10,
+            background: !1,
+            responsive: !0,
+            autoCropArea: 1,
+            checkOrientation: !1,
+            guides: !0
+          }
+        )
+      }
+    )
+  ] });
+}), ss = ["top-left", "top", "top-right", "left", "center", "right", "bottom-left", "bottom", "bottom-right"], ns = Y(() => {
+  const [o, t] = O(!1), n = (l) => {
+    t(l);
+  }, s = (l) => {
+    r.option.setAlign(l);
+  }, a = /* @__PURE__ */ e.jsx("div", { className: G("flex flex-wrap w-24 position-block", r.option.align), children: ss.map((l) => /* @__PURE__ */ e.jsx("div", { className: "w-8 h-8 border border-gray-200 rounded-sm hover:bg-gray-100 cursor-pointer", onClick: () => s(l) }, l)) });
+  return /* @__PURE__ */ e.jsx(
+    ge,
+    {
+      content: a,
+      trigger: "click",
+      arrow: !1,
+      placement: "bottomRight",
+      open: o,
+      onOpenChange: n,
+      children: /* @__PURE__ */ e.jsx(
+        T,
+        {
+          type: "text",
+          shape: "circle",
+          className: G(o && "shadow-md"),
+          icon: /* @__PURE__ */ e.jsx(A.LayoutGrid, { size: 18 })
+        }
+      )
+    }
+  );
+}), as = Y(() => {
+  const [o, t] = O(!1), [n, s] = O("ShotEasy"), [a, l] = O("#00000030"), [d, f] = O(45), u = (h) => {
+    l(typeof h == "string" ? h : h.toRgbString());
+  };
+  return M(() => {
+    if (o && n.trim()) {
+      const h = zo({
+        text: n,
+        color: a,
+        angleDegrees: d
+      });
+      r.option.setWaterImg(h);
+    } else
+      r.option.setWaterImg(null);
+  }, [o, n, a, d]), /* @__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(st, { defaultChecked: o, 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: [
+      /* @__PURE__ */ e.jsx(di, { defaultValue: n, placeholder: "Watermark content", onChange: (h) => s(h.target.value) }),
+      /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ e.jsx("label", { children: "Color" }),
+        /* @__PURE__ */ e.jsx(xe, { value: a, onChange: u, size: "small" })
+      ] }),
+      /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ e.jsx("label", { children: "Direction" }),
+        /* @__PURE__ */ e.jsx("div", { children: /* @__PURE__ */ e.jsxs(L.Group, { defaultValue: d, onChange: (h) => f(h.target.value), size: "small", children: [
+          /* @__PURE__ */ e.jsx(L.Button, { value: -45, children: /* @__PURE__ */ e.jsx(A.ArrowUpRight, { size: 16, className: "mt-[3px]" }) }),
+          /* @__PURE__ */ e.jsx(L.Button, { value: 45, children: /* @__PURE__ */ e.jsx(A.ArrowDownRight, { size: 16, className: "mt-[3px]" }) })
+        ] }) })
+      ] }),
+      /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-between", children: [
+        /* @__PURE__ */ e.jsx("label", { children: "Only Background" }),
+        /* @__PURE__ */ e.jsx(st, { size: "small", onChange: (h) => r.option.setWaterIndex(h ? -1 : 1), className: "bg-slate-200" })
+      ] })
+    ] })
+  ] });
+});
+function ls(o, t, n) {
+  const s = ue(o), a = ue(t);
+  M(() => {
+    s.current = o, a.current = t;
+  }, [...n]), M(() => {
+    const l = Ct(window, {
+      "$mod+KeyS": (d) => {
+        d.preventDefault(), s.current && s.current();
+      },
+      "$mod+KeyC": (d) => {
+        d.preventDefault(), a && a.current();
+      }
+    });
+    return () => {
+      l();
+    };
+  }, [window]);
+}
+const cs = Y(() => {
+  var N;
+  const [o, t] = O(!1), [n, s] = O(!1), [a, l] = O("png"), [d, f] = O(1), u = (x) => {
+    s(x);
+  }, h = async () => {
+    if (!r.editor.isEditing || o) return;
+    const x = {
+      pixelRatio: d
+    };
+    ["jpg", "webp"].includes(a) && (x.quality = 0.9, x.fill = "#ffffff");
+    const v = he();
+    t(!0), r.editor.message.open({
+      key: v,
+      type: "loading",
+      content: "Downloading..."
+    }), await r.editor.app.tree.export(a, x).then((H) => {
+      let _ = "ShotEasy";
+      d > 1 && (_ += `@${d}`), So(H.data, `${_}.${a}`), r.editor.message.open({
+        key: v,
+        type: "success",
+        content: "Download Success!"
+      });
+    }).catch(() => {
+      r.editor.message.open({
+        key: v,
+        type: "error",
+        content: "Download failed!"
+      });
+    }), t(!1);
+  }, g = async () => {
+    if (!r.editor.isEditing || o) return;
+    const x = he();
+    t(!0), r.editor.message.open({
+      key: x,
+      type: "loading",
+      content: "Copying..."
+    }), await r.editor.app.tree.export("png", { blob: !0, pixelRatio: d }).then(async (v) => {
+      const { data: H } = v;
+      await navigator.clipboard.write([
+        new ClipboardItem({
+          [H.type]: H
+        })
+      ]), r.editor.message.open({
+        key: x,
+        type: "success",
+        content: "Copy Success!"
+      });
+    }).catch(() => {
+      r.editor.message.open({
+        key: x,
+        type: "error",
+        content: "Copy failed!"
+      });
+    }), t(!1);
+  }, y = () => {
+    r.editor.clearImg();
+  };
+  ls(() => h(), () => g(), [h, g]);
+  const S = /* @__PURE__ */ e.jsx("div", { children: /* @__PURE__ */ e.jsxs("div", { className: "p-2 [&_.ant-segmented]:w-full [&_.ant-segmented-item]:w-[33%]", children: [
+    /* @__PURE__ */ e.jsx("div", { className: "text-xs text-gray-400 mb-2", children: "Format" }),
+    /* @__PURE__ */ e.jsx(
+      nt,
+      {
+        options: ["png", "jpg", "webp"],
+        size: "middle",
+        onChange: l
+      }
+    ),
+    /* @__PURE__ */ e.jsx("div", { className: "text-xs text-gray-400 mt-2 mb-2", children: "Pixel Ratio" }),
+    /* @__PURE__ */ e.jsx(
+      nt,
+      {
+        options: [{ value: 1, icon: "1x" }, { value: 2, icon: "2x" }, { value: 3, icon: "3x" }],
+        size: "middle",
+        onChange: f
+      }
+    ),
+    r.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: [
+        r.option.frameConf.width * d,
+        " x ",
+        r.option.frameConf.height * d
+      ] })
+    ] })
+  ] }) });
+  return /* @__PURE__ */ e.jsxs("div", { className: "shrink-0 py-4 px-6 flex gap-2 justify-center items-center", children: [
+    /* @__PURE__ */ e.jsx(
+      fi,
+      {
+        theme: {
+          components: {
+            Button: {
+              colorPrimary: "#000",
+              algorithm: !0
+              // 启用算法
+            }
+          }
+        },
+        children: /* @__PURE__ */ e.jsxs("div", { className: "ant-space-compact flex flex-1", children: [
+          /* @__PURE__ */ e.jsx(F, { placement: "top", title: /* @__PURE__ */ e.jsxs("span", { children: [
+            "Download ",
+            ft,
+            " + S"
+          ] }), children: /* @__PURE__ */ e.jsx(
+            T,
+            {
+              type: "primary",
+              size: "large",
+              loading: o,
+              icon: /* @__PURE__ */ e.jsx(A.ImageDown, { size: 18 }),
+              className: "rounded-se-none flex-1 rounded-ee-none me-[-1px] hover:z-[1] border-r-white/30",
+              onClick: h,
+              children: /* @__PURE__ */ e.jsxs("div", { className: "leading-4 px-2", children: [
+                /* @__PURE__ */ e.jsx("div", { className: "text-sm leading-4 font-semibold", children: "Download" }),
+                /* @__PURE__ */ e.jsxs("div", { className: "text-xs", children: [
+                  d,
+                  "x as ",
+                  a.toLocaleUpperCase()
+                ] })
+              ] })
+            }
+          ) }),
+          /* @__PURE__ */ e.jsx(F, { placement: "top", title: /* @__PURE__ */ e.jsxs("span", { children: [
+            "Copy ",
+            ft,
+            " + C"
+          ] }), children: /* @__PURE__ */ e.jsx(
+            T,
+            {
+              type: "primary",
+              size: "large",
+              icon: /* @__PURE__ */ e.jsx(A.Copy, { size: 18 }),
+              loading: o,
+              className: "rounded-ss-none rounded-es-none border-l-white/30",
+              onClick: g
+            }
+          ) })
+        ] })
+      }
+    ),
+    /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-1", children: [
+      /* @__PURE__ */ e.jsx(
+        ge,
+        {
+          content: S,
+          trigger: "click",
+          arrow: !1,
+          placement: "topRight",
+          open: n,
+          overlayStyle: {
+            width: "320px"
+          },
+          onOpenChange: u,
+          children: /* @__PURE__ */ e.jsx(T, { size: "large", icon: /* @__PURE__ */ e.jsx(A.Settings2, { size: 18 }) })
+        }
+      ),
+      ((N = r.editor.img) == null ? void 0 : N.src) && /* @__PURE__ */ e.jsx(
+        pi,
+        {
+          title: "Delete the screenshot",
+          description: "Are you sure to delete this screenshot?",
+          onConfirm: y,
+          okText: "Yes",
+          cancelText: "No",
+          children: /* @__PURE__ */ e.jsx(T, { size: "large", icon: /* @__PURE__ */ e.jsx(A.Trash2, { size: 18 }) })
+        }
+      )
+    ] })
+  ] });
+}), ds = "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", wt = ["cosmic", "desktop"], pe = ({ type: o, options: t, onChange: n, value: s }) => {
+  let a = [];
+  if (t && t.length)
+    a = t;
+  else {
+    const l = [];
+    Object.keys(Q).map((d) => {
+      d.includes(o) && l.push({
+        key: d,
+        value: Q[d]
+      });
+    }), a = l;
+  }
+  return /* @__PURE__ */ e.jsx(
+    L.Group,
+    {
+      onChange: (l) => n(l.target.value),
+      value: s,
+      rootClassName: G(
+        "grid [&_span]:ps-0",
+        wt.includes(o) ? "grid-cols-5 gap-y-1.5" : "grid-cols-7 gap-y-3"
+      ),
+      children: a.map((l, d) => /* @__PURE__ */ e.jsx(
+        L,
+        {
+          className: "[&_.ant-radio]:hidden [&_span]:p-0 mr-0",
+          value: l.key,
+          children: wt.includes(o) ? /* @__PURE__ */ e.jsx("div", { className: G("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: G("w-8 h-8 rounded-full overflow-hidden", l.value.class) })
+        },
+        d
+      ))
+    }
+  );
+}, fs = Y(({ showMore: o, onChange: t }) => {
+  const n = () => {
+    t(!1);
+  }, s = (l) => {
+    const d = l.toHexString();
+    r.option.frameConf.background = {
+      type: "solid",
+      color: d
+    };
+  }, a = (l) => {
+    r.option.setBackground(l);
+  };
+  return /* @__PURE__ */ e.jsx(
+    ui,
+    {
+      title: "",
+      placement: "right",
+      closable: !1,
+      mask: !1,
+      onClose: n,
+      open: o,
+      getContainer: !1,
+      width: "100%",
+      className: "[&_.ant-drawer-body]:p-0",
+      children: /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-2 h-full overflow-hidden", children: [
+        /* @__PURE__ */ e.jsx("div", { className: "shrink-0 pt-4 px-4", children: /* @__PURE__ */ e.jsx(
+          T,
+          {
+            type: "text",
+            size: "small",
+            className: "text-xs flex items-center opacity-80 m-0",
+            icon: /* @__PURE__ */ e.jsx(A.ChevronLeft, { size: 16 }),
+            onClick: () => t(!1),
+            children: "Back"
+          }
+        ) }),
+        /* @__PURE__ */ e.jsxs("div", { className: "h-0 flex-1 overflow-y-auto px-4 py-2", children: [
+          /* @__PURE__ */ e.jsx("h4", { className: "text-sm font-bold py-2", children: "Custom" }),
+          /* @__PURE__ */ e.jsx("div", { className: "py-1", children: /* @__PURE__ */ e.jsx(xe, { onChange: s, children: /* @__PURE__ */ e.jsx(T, { type: "default", size: "small", shape: "circle", icon: /* @__PURE__ */ e.jsx("img", { src: ds, width: 18 }) }) }) }),
+          /* @__PURE__ */ e.jsx("h4", { className: "text-sm font-bold py-2", children: "Solid Colors" }),
+          /* @__PURE__ */ e.jsx(pe, { type: "solid", onChange: a, value: r.option.background }),
+          /* @__PURE__ */ e.jsx("h4", { className: "text-sm font-bold py-2", children: "Gradients" }),
+          /* @__PURE__ */ e.jsx(pe, { type: "gradient", onChange: a, value: r.option.background }),
+          /* @__PURE__ */ e.jsx("h4", { className: "text-sm font-bold py-2", children: "Cosmic Gradients" }),
+          /* @__PURE__ */ e.jsx(pe, { type: "cosmic", onChange: a, value: r.option.background }),
+          /* @__PURE__ */ e.jsx("h4", { className: "text-sm font-bold py-2", children: "Desktop" }),
+          /* @__PURE__ */ e.jsx(pe, { type: "desktop", onChange: a, value: r.option.background })
+        ] })
+      ] })
+    }
+  );
+}), ps = Y(() => {
+  const [o, t] = O(!1), n = (s) => {
+    const a = s.target.value;
+    r.option.setBackground(a);
+  };
+  return /* @__PURE__ */ e.jsxs("div", { className: "bg-white flex flex-col md:w-[340px] border-l border-l-gray-50 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: [
+      /* @__PURE__ */ e.jsx(os, {}),
+      /* @__PURE__ */ e.jsxs("div", { className: "[&_label]:font-semibold pt-2 [&_label]:text-sm", children: [
+        /* @__PURE__ */ e.jsx("label", { children: "Quick" }),
+        /* @__PURE__ */ e.jsxs("div", { className: "flex gap-4 items-center py-2", children: [
+          /* @__PURE__ */ e.jsx(rs, {}),
+          /* @__PURE__ */ e.jsx(
+            T,
+            {
+              type: "text",
+              shape: "circle",
+              onClick: () => r.option.toggleFlip("x"),
+              icon: /* @__PURE__ */ e.jsx(A.FlipHorizontal2, { size: 18 })
+            }
+          ),
+          /* @__PURE__ */ e.jsx(
+            T,
+            {
+              type: "text",
+              shape: "circle",
+              onClick: () => r.option.toggleFlip("y"),
+              icon: /* @__PURE__ */ e.jsx(A.FlipVertical2, { size: 18 })
+            }
+          ),
+          /* @__PURE__ */ e.jsx(ns, {})
+        ] })
+      ] }),
+      /* @__PURE__ */ e.jsxs("div", { className: "[&_label]:font-semibold [&_label]:text-sm", children: [
+        /* @__PURE__ */ e.jsx("label", { children: "Scale" }),
+        /* @__PURE__ */ e.jsx(
+          de,
+          {
+            min: 0.1,
+            max: 2,
+            step: 0.1,
+            onChange: (s) => r.option.setScale(s),
+            value: typeof r.option.scale == "number" ? r.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(xe, { value: r.option.paddingBg, onChange: (s) => r.option.setPaddingBg(s.toRgbString()), size: "small" })
+        ] }),
+        /* @__PURE__ */ e.jsx(
+          de,
+          {
+            min: 0,
+            max: 60,
+            onChange: (s) => r.option.setPadding(s),
+            value: typeof r.option.padding == "number" ? r.option.padding : 0
+          }
+        )
+      ] }),
+      /* @__PURE__ */ e.jsxs("div", { className: "[&_label]:font-semibold [&_label]:text-sm", children: [
+        /* @__PURE__ */ e.jsx("label", { children: "Rounded" }),
+        /* @__PURE__ */ e.jsx(
+          de,
+          {
+            min: 0,
+            max: 20,
+            onChange: (s) => r.option.setRound(s),
+            value: typeof r.option.round == "number" ? r.option.round : 0
+          }
+        )
+      ] }),
+      /* @__PURE__ */ e.jsxs("div", { className: "[&_label]:font-semibold [&_label]:text-sm", children: [
+        /* @__PURE__ */ e.jsx("label", { children: "Shadow" }),
+        /* @__PURE__ */ e.jsx(
+          de,
+          {
+            min: 0,
+            max: 6,
+            onChange: (s) => r.option.setShadow(s),
+            value: typeof r.option.shadow == "number" ? r.option.shadow : 0
+          }
+        )
+      ] }),
+      /* @__PURE__ */ e.jsxs("div", { className: "[&_label]:font-semibold [&_label]:text-sm", children: [
+        /* @__PURE__ */ e.jsxs("div", { className: "flex justify-between items-center", children: [
+          /* @__PURE__ */ e.jsx("label", { children: "Background" }),
+          /* @__PURE__ */ e.jsxs(
+            T,
+            {
+              type: "text",
+              size: "small",
+              className: "text-xs flex items-center opacity-80 m-0",
+              onClick: () => t(!0),
+              children: [
+                "More ",
+                /* @__PURE__ */ e.jsx(A.ChevronRight, { size: 16 })
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ e.jsx("div", { className: "py-3", children: /* @__PURE__ */ e.jsxs(
+          L.Group,
+          {
+            onChange: n,
+            value: r.option.background,
+            rootClassName: "grid grid-cols-7 [&_span]:ps-0",
+            children: [
+              /* @__PURE__ */ e.jsx(L, { className: "[&_.ant-radio]:hidden [&_span]:p-0 mr-0", value: "default_1", children: /* @__PURE__ */ e.jsx("div", { className: G("w-8 h-8 rounded-full", Q.default_1.class) }) }),
+              Object.keys(Q).map((s) => {
+                if (s.includes("default") && s !== "default_1") return /* @__PURE__ */ e.jsx(L, { className: "[&_.ant-radio]:hidden [&_span]:p-0 mr-0", value: s, children: /* @__PURE__ */ e.jsx("div", { className: G("w-8 h-8 rounded-full", Q[s].class) }) }, s);
+              })
+            ]
+          }
+        ) })
+      ] }),
+      /* @__PURE__ */ e.jsx(as, {})
+    ] }),
+    /* @__PURE__ */ e.jsx(cs, {}),
+    /* @__PURE__ */ e.jsx(fs, { showMore: o, onChange: t })
+  ] });
+}), us = (o, t = []) => {
+  M(() => {
+    const n = async (s) => {
+      const a = s.clipboardData;
+      if (!a || !a.items) return;
+      const l = Array.from(a.items).filter(
+        (f) => At.includes(f.type)
+      );
+      if (!l.length) return;
+      const d = l[0].getAsFile();
+      o && o(d);
+    };
+    return document.addEventListener("paste", n, !1), () => {
+      document.removeEventListener("paste", n);
+    };
+  }, [...t]);
+}, hs = 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 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);
+  }
+}, { Dragger: ms } = hi, gs = Y(() => {
+  const o = async (a, l = "blob") => {
+    const d = window.URL || window.webkitURL || window, f = l === "blob" ? d.createObjectURL(a) : a, u = await Ro(f), h = Math.round(u.width), g = Math.round(u.height);
+    if (r.editor.setImg({
+      src: f,
+      width: h,
+      height: g,
+      type: l === "blob" ? a.type : "image/png",
+      name: l === "blob" ? a.name : "ShotEasy.png"
+    }), r.option.size.type === "auto") {
+      const y = Math.round(h * 0.2);
+      r.option.setFrameSize(h + y, g + y);
+    }
+  }, t = async (a) => (await o(a), Promise.reject()), n = async () => {
+    const a = await hs();
+    a && o(a, "dataURL");
+  }, s = () => {
+    r.editor.message.info("Developing, Coming soon!");
+  };
+  return us((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: G("max-w-[600px]", r.editor.invalid && "invalid"), children: [
+    /* @__PURE__ */ e.jsx(
+      ms,
+      {
+        accept: At.join(","),
+        name: "file",
+        showUploadList: !1,
+        beforeUpload: t,
+        rootClassName: "p-4 rounded-md bg-white block shadow-sm",
+        children: /* @__PURE__ */ e.jsxs("div", { className: "text-center p-10", children: [
+          /* @__PURE__ */ e.jsx("p", { className: "text-2xl my-2 opacity-60", children: /* @__PURE__ */ e.jsx(A.ImagePlus, { className: "mx-auto", size: 36 }) }),
+          /* @__PURE__ */ e.jsxs("p", { className: "text-sm px-4", children: [
+            "Click or Drag image to this area",
+            /* @__PURE__ */ e.jsx("br", {}),
+            "or Paste image"
+          ] })
+        ] })
+      }
+    ),
+    /* @__PURE__ */ e.jsxs("div", { className: "flex justify-between mt-4 py-4 px-6 rounded-md bg-white shadow-sm", children: [
+      /* @__PURE__ */ e.jsx(F, { placement: "top", arrow: !1, title: "Take a screenshot of desktop windows", children: /* @__PURE__ */ e.jsx(T, { shape: "round", type: "default", size: "large", icon: /* @__PURE__ */ e.jsx(A.Camera, { size: 20 }), onClick: n }) }),
+      /* @__PURE__ */ e.jsx(F, { placement: "top", arrow: !1, title: "Beautify text", children: /* @__PURE__ */ e.jsx(T, { shape: "round", type: "default", size: "large", icon: /* @__PURE__ */ e.jsx(A.Type, { size: 20 }), onClick: s }) }),
+      /* @__PURE__ */ e.jsx(F, { placement: "top", arrow: !1, title: "Beautify Code", children: /* @__PURE__ */ e.jsx(T, { shape: "round", type: "default", size: "large", icon: /* @__PURE__ */ e.jsx(A.CodeXml, { size: 20, onClick: s }) }) }),
+      /* @__PURE__ */ e.jsx(F, { placement: "top", arrow: !1, title: "Create gif animate", children: /* @__PURE__ */ e.jsx(T, { shape: "round", type: "default", size: "large", icon: /* @__PURE__ */ e.jsx(A.ImagePlay, { size: 20, onClick: s }) }) })
+    ] })
+  ] }) });
+}), Ys = Y(() => {
+  var s;
+  const o = (s = r.editor.img) != null && s.src ? /* @__PURE__ */ e.jsx(es, {}) : /* @__PURE__ */ e.jsx(gs, {}), [t, n] = mi.useMessage();
+  return M(() => {
+    r.editor.setMessage(t);
+  }, [t]), /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+    n,
+    /* @__PURE__ */ e.jsxs("div", { className: "polka flex flex-col overflow-hidden antialiased w-full h-[100vh]", children: [
+      /* @__PURE__ */ e.jsx(Zo, {}),
+      /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col flex-1 h-0 md:flex-row md:items-stretch", children: [
+        o,
+        /* @__PURE__ */ e.jsx(ps, {})
+      ] })
+    ] })
+  ] });
+});
+export {
+  Ys as ImageBeautifier
+};