mce 0.2.3 → 0.2.5

package/dist/index.js

@@ -1,15 +1,15 @@
-import { ref as V, computed as O, watch as pe, markRaw as fe, warn as Bt, shallowRef as Je, reactive as Ce, nextTick as Pe, inject as Se, provide as De, defineComponent as X, createVNode as H, mergeProps as Ne, createElementVNode as F, toValue as yn, getCurrentInstance as Ze, onScopeDispose as gn, createElementBlock as R, openBlock as I, Fragment as ne, renderList as _e, unref as S, normalizeStyle as q, normalizeClass as be, onBeforeUnmount as we, readonly as bn, toRef as Ee, onMounted as He, useId as Lt, onDeactivated as wn, onActivated as xn, useAttrs as Dt, createBlock as le, resolveDynamicComponent as Vt, useTemplateRef as ue, renderSlot as te, Teleport as _n, createCommentVNode as Q, mergeModels as Re, useModel as Ae, resolveComponent as kn, withCtx as re, createTextVNode as Cn, toDisplayString as K, createSlots as ht, normalizeProps as ft, guardReactiveProps as pt, withDirectives as ze, vShow as Xe, vModelText as En, withModifiers as We, onBeforeMount as vt, isRef as Tn } from "vue";
-import { useFileDialog as jt, useEventListener as Ut, isClient as An, useResizeObserver as Xt, useLocalStorage as Sn, onClickOutside as Mn, useMouse as zn, useDebounceFn as Ht } from "@vueuse/core";
-import { Timeline as On, Engine as $n, Camera2D as In, DrawboardEffect as Fn, Element2D as G, IN_BROWSER as yt, clamp as Pn, assets as Yt, TimelineNode as Nn, Transform2D as Rn, DEG_TO_RAD as Bn, Node as kt, render as Qe, Animation as Ln } from "modern-canvas";
-import { getObjectValueByPath as Dn, setObjectValueByPath as Vn, normalizeTextContent as jn, idGenerator as gt, normalizeElement as qt, Observable as Gt, Reactivable as Un, property as Ye } from "modern-idoc";
-import { saveAs as Wt } from "file-saver";
+import { ref as V, computed as $, watch as pe, markRaw as fe, warn as Lt, shallowRef as Ze, reactive as Ee, nextTick as Re, inject as Se, provide as De, defineComponent as X, createVNode as H, mergeProps as $e, createElementVNode as F, toValue as yn, getCurrentInstance as Qe, onScopeDispose as gn, createElementBlock as R, openBlock as O, Fragment as se, renderList as _e, unref as S, normalizeStyle as q, normalizeClass as be, onBeforeUnmount as we, readonly as bn, toRef as Te, onMounted as He, useId as Dt, onDeactivated as wn, onActivated as xn, useAttrs as Vt, createBlock as oe, resolveDynamicComponent as jt, useTemplateRef as ce, renderSlot as Q, Teleport as _n, createCommentVNode as ee, mergeModels as Oe, useModel as ke, resolveComponent as kn, withCtx as ne, createTextVNode as Cn, toDisplayString as K, createSlots as pt, normalizeProps as vt, guardReactiveProps as yt, withDirectives as ze, vShow as Xe, vModelText as En, withModifiers as Ke, onBeforeMount as gt, isRef as Tn } from "vue";
+import { useFileDialog as Ut, useEventListener as Xt, isClient as An, useResizeObserver as Ht, useLocalStorage as Sn, onClickOutside as Mn, useMouse as zn, useDebounceFn as Yt } from "@vueuse/core";
+import { Timeline as $n, Engine as On, Camera2D as In, DrawboardEffect as Fn, Element2D as G, IN_BROWSER as bt, clamp as Pn, assets as qt, TimelineNode as Nn, Transform2D as Rn, DEG_TO_RAD as Bn, Node as Ct, render as et, Animation as Ln } from "modern-canvas";
+import { getObjectValueByPath as Dn, setObjectValueByPath as Vn, normalizeTextContent as jn, idGenerator as wt, normalizeElement as Gt, Observable as Wt, Reactivable as Un, property as Ye } from "modern-idoc";
+import { saveAs as Kt } from "file-saver";
 import { Fonts as Xn } from "modern-font";
-import { merge as Kt, throttle as Hn, cloneDeep as Yn } from "lodash-es";
-import { measureText as rt } from "modern-text";
+import { merge as Jt, throttle as Hn, cloneDeep as Yn } from "lodash-es";
+import { measureText as lt } from "modern-text";
 import { TextEditor as qn } from "modern-text/web-components";
-import * as ie from "yjs";
+import * as le from "yjs";
 import { useFloating as Gn, offset as Wn, flip as Kn, shift as Jn, autoUpdate as Zn } from "@floating-ui/vue";
-import { vResizeObserver as Jt, vOnLongPress as Qn } from "@vueuse/components";
+import { vResizeObserver as Zt, vOnLongPress as Qn } from "@vueuse/components";
 const eo = (o) => {
   const {
     emit: e
@@ -43,7 +43,7 @@ const eo = (o) => {
     Vn(e.value, c, u);
   }
   function s(c) {
-    return O({
+    return $({
       get: () => t(c),
       set: (u) => n(c, u)
     });
@@ -54,7 +54,7 @@ const eo = (o) => {
   }
   function r() {
     return new Promise((c) => {
-      const { onChange: u, open: d } = jt({
+      const { onChange: u, open: d } = Ut({
         accept: ".json",
         reset: !0,
         multiple: !1
@@ -69,7 +69,7 @@ const eo = (o) => {
     return new Blob([JSON.stringify(e.value)], { type: "application/json" });
   }
   function l(c = "settings.json") {
-    Wt(
+    Kt(
       i(),
       c
     );
@@ -114,7 +114,7 @@ const eo = (o) => {
 }, oo = (o) => {
   const {
     emit: e
-  } = o, t = fe(new Xn()), n = V(new On({ startTime: 0, endTime: 0, loop: !0, paused: !0 })), s = new $n({
+  } = o, t = fe(new Xn()), n = V(new $n({ startTime: 0, endTime: 0, loop: !0, paused: !0 })), s = new On({
     pixelRatio: 2,
     fonts: t,
     timeline: n.value,
@@ -126,9 +126,9 @@ const eo = (o) => {
   s.root.append(a.value), s.root.append(r.value);
   const i = V(s);
   i.value.start();
-  const l = V(), c = V({ left: 0, top: 0, width: 0, height: 0 }), u = V(), d = V(), g = O(() => d.value?.root), h = V(), v = V(), y = V();
-  function f(z, $) {
-    switch (v.value = z, y.value = $, z) {
+  const l = V(), c = V({ left: 0, top: 0, width: 0, height: 0 }), u = V(), d = V(), g = $(() => d.value?.root), h = V(), v = V(), y = V();
+  function f(z, I) {
+    switch (v.value = z, y.value = I, z) {
       case "drawing":
         p("crosshair");
         break;
@@ -139,10 +139,10 @@ const eo = (o) => {
     i.value.input.setCursor(z);
   }
   function _() {
-    const { x: z = 0, y: $ = 0 } = h.value ?? {};
+    const { x: z = 0, y: I = 0 } = h.value ?? {};
     return a.value.toGlobal({
       x: z - c.value.left,
-      y: $ - c.value.top
+      y: I - c.value.top
     }, { x: 0, y: 0 });
   }
   Object.assign(o, {
@@ -231,7 +231,6 @@ const eo = (o) => {
   file: "File",
   new: "New",
   open: "Open",
-  preferences: "Preferences",
   import: "Import",
   export: "Export",
   "saveAs:png": "Save as PNG",
@@ -289,16 +288,17 @@ const eo = (o) => {
   alignRight: "Align right",
   alignTop: "Align top",
   alignVerticalCenter: "Align vertical center",
-  alignBottom: "Align bottom"
+  alignBottom: "Align bottom",
+  exporting: "Exporting"
 }, ro = (o, e) => {
   const {
     locale: t
-  } = e, n = O(() => {
+  } = e, n = $(() => {
     const {
       locale: a,
       fallback: r,
       messages: i = {}
-    } = Kt({
+    } = Jt({
       locale: "en",
       fallback: "en",
       messages: {
@@ -322,7 +322,7 @@ const eo = (o) => {
   const {
     root: e,
     getAncestor: t
-  } = o, n = O(() => e.value?.children.filter(l) ?? []), s = V(-1), a = O(() => n.value[s.value]), r = O(() => {
+  } = o, n = $(() => e.value?.children.filter(l) ?? []), s = V(-1), a = $(() => n.value[s.value]), r = $(() => {
     const { left: u = 0, top: d = 0, width: g = 0, height: h = 0 } = a.value?.style ?? {};
     return { left: u, top: d, width: g, height: h };
   }), i = V([]);
@@ -359,7 +359,7 @@ function Me(o) {
   };
   return o.rotate && (e.transform = `rotate(${o.rotate}deg)`), e;
 }
-function Ct(o, e) {
+function Et(o, e) {
   const t = e.left + e.width, n = e.top + e.height;
   return o.x >= e.left && o.x <= t && o.y >= e.top && o.y <= n;
 }
@@ -394,7 +394,7 @@ function co(o, e) {
     return !0;
   }
 }
-function Qi(o) {
+function Zi(o) {
   if (o.length < 2)
     return {
       left: o[0]?.left ?? 0,
@@ -414,12 +414,12 @@ function Qi(o) {
   return { left: e.x1, top: e.y1, width: e.x2 - e.x1, height: e.y2 - e.y1 };
 }
 function uo(o) {
-  Bt(`mce: ${o}`);
+  Lt(`mce: ${o}`);
 }
-function er(o) {
-  Bt(`mce error: ${o}`);
+function Qi(o) {
+  Lt(`mce error: ${o}`);
 }
-const Et = yt && window.navigator && "clipboard" in navigator, Zt = yt ? window.navigator?.userAgent : "", $e = /Macintosh|Mac OS X/i.test(Zt), mo = /Windows/i.test(Zt);
+const Tt = bt && window.navigator && "clipboard" in navigator, Qt = bt ? window.navigator?.userAgent : "", Fe = /Macintosh|Mac OS X/i.test(Qt), mo = /Windows/i.test(Qt);
 function ho(o, e = {}) {
   const { useCrossOrigin: t = !1, timeout: n } = e;
   return new Promise((s, a) => {
@@ -452,11 +452,11 @@ const fo = {
   "image/heif": [".heif"],
   "image/heic": [".heic"],
   "image/avif": [".avif"]
-}, Qt = Object.values(fo).flat(), en = new RegExp(`\\.(?:${Qt.map((o) => o.substring(1)).join("|")})`, "i");
-function lt(o, e) {
-  const t = rt({ style: e, content: o }).boundingBox;
+}, en = Object.values(fo).flat(), ct = new RegExp(`\\.(?:${en.map((o) => o.substring(1)).join("|")})`, "i");
+function ut(o, e) {
+  const t = lt({ style: e, content: o }).boundingBox;
   return {
-    id: gt(),
+    id: wt(),
     style: {
       ...e,
       width: t.width,
@@ -466,9 +466,9 @@ function lt(o, e) {
     meta: { inPptIs: "Shape" }
   };
 }
-async function ct(o) {
+async function dt(o) {
   return {
-    id: gt(),
+    id: wt(),
     style: {
       ...await ho(o)
     },
@@ -487,14 +487,14 @@ function vo(o) {
   }
   return o;
 }
-function qe(o, e = "px") {
+function Ge(o, e = "px") {
   if (o == null || o === "")
     return;
   const t = Number(o);
   return Number.isNaN(t) ? String(o) : Number.isFinite(t) ? `${t}${e}` : void 0;
 }
 function yo() {
-  const o = Je(), e = (t) => {
+  const o = Ze(), e = (t) => {
     o.value = t;
   };
   return Object.defineProperty(e, "value", {
@@ -533,7 +533,7 @@ function tn(o, e) {
   }, {});
 }
 const go = crypto.getRandomValues.bind(crypto), bo = () => go(new Uint32Array(1))[0], wo = "10000000-1000-4000-8000" + -1e11;
-function tr() {
+function er() {
   return wo.replace(/[018]/g, (o) => (o ^ bo() & 15 >> o / 4).toString(16));
 }
 const xo = [
@@ -602,18 +602,18 @@ const ko = (o) => {
     return u ? c = Array.isArray(u.key) ? u.key : [u.key] : c = [l], c[0].split("+").map((d) => {
       switch (d) {
         case "Control":
-          return $e ? "⌃" : "Ctrl";
+          return Fe ? "⌃" : "Ctrl";
         case "Ctrl":
-          return $e ? "⌃" : "Ctrl";
+          return Fe ? "⌃" : "Ctrl";
         case "Command":
-          return $e ? "⌘" : mo ? "Win" : "Super";
+          return Fe ? "⌘" : mo ? "Win" : "Super";
         case "Alt":
-          return $e ? "⌥" : "Alt";
+          return Fe ? "⌥" : "Alt";
         case "Shift":
-          return $e ? "⇧" : "Shift";
+          return Fe ? "⇧" : "Shift";
         case "CommandOrControl":
         case "CmdOrCtrl":
-          return $e ? "⌘" : "Ctrl";
+          return Fe ? "⌘" : "Ctrl";
         default:
           return r[d] ?? d.charAt(0).toUpperCase() + d.slice(1);
       }
@@ -629,7 +629,7 @@ const ko = (o) => {
     const {
       exec: l
     } = o;
-    Ut(
+    Xt(
       An ? window : void 0,
       "keydown",
       (c) => {
@@ -666,13 +666,13 @@ const ko = (o) => {
     root: e,
     timeline: t,
     renderEngine: n
-  } = o, s = V(10), a = O({
+  } = o, s = V(10), a = $({
     get: () => t.value.currentTime,
     set: (c) => {
       const { startTime: u, endTime: d } = t.value;
       t.value.currentTime = Pn(c, u, d);
     }
-  }), r = O(() => t.value.startTime), i = O(() => t.value.endTime), l = (c) => {
+  }), r = $(() => t.value.startTime), i = $(() => t.value.endTime), l = (c) => {
     const u = { startTime: 0, endTime: 0 };
     function d(h) {
       return h instanceof Nn && (u.startTime = Math.min(u.startTime, h.globalStartTime), u.endTime = Math.max(u.endTime, h.globalEndTime)), h instanceof G && (h.background.animatedTexture && (u.endTime = Math.max(u.endTime, h.globalStartTime + h.background.animatedTexture.duration)), h.foreground.animatedTexture && (u.endTime = Math.max(u.endTime, h.globalStartTime + h.foreground.animatedTexture.duration)), h.fill.animatedTexture && (u.endTime = Math.max(u.endTime, h.globalStartTime + h.fill.animatedTexture.duration)), h.outline.animatedTexture && (u.endTime = Math.max(u.endTime, h.globalStartTime + h.outline.animatedTexture.duration))), !1;
@@ -692,14 +692,14 @@ const ko = (o) => {
     async function u() {
       await n.value.nextTick(), t.value.endTime = e.value ? l(e.value).endTime : 0;
     }
-    Yt.on("loaded", u), c("setDoc", u);
+    qt.on("loaded", u), c("setDoc", u);
   };
 }, Eo = (o, e) => {
   Object.assign(o, {
     upload: async (n) => e.upload ? await e.upload(n) : URL.createObjectURL(n)
   });
 };
-function Tt(...o) {
+function At(...o) {
 }
 const To = (o) => {
   const {
@@ -733,9 +733,9 @@ const To = (o) => {
       }), h.style.left += f.left, h.style.top += f.top, h.style.width = f.width, h.style.height = f.height, h.updateGlobalTransform(), h.children.forEach((_, z) => {
         if (_ instanceof G) {
           _.updateGlobalTransform();
-          const $ = p[z], E = _.toLocal({
-            x: $.left + $.width / 2,
-            y: $.top + $.height / 2
+          const I = p[z], E = _.toLocal({
+            x: I.left + I.width / 2,
+            y: I.top + I.height / 2
           }), C = _.pivot, m = _.style, b = [
             E.x - C.x,
             E.y - C.y
@@ -751,7 +751,7 @@ const To = (o) => {
       h.length === 1 ? y = r(h[0]) : y = { ...l(h), rotate: 0 };
     else if (h instanceof G) {
       const f = h.style;
-      Tt([f.left, f.top, f.width, f.height, f.rotate]);
+      At([f.left, f.top, f.width, f.height, f.rotate]);
       const { rect: p, rotation: _ } = h.getGlobalObb();
       y = {
         left: p.left,
@@ -803,7 +803,7 @@ const To = (o) => {
       }
     else if (h instanceof G) {
       const f = h.style;
-      Tt([f.left, f.top, f.width, f.height, f.rotate]);
+      At([f.left, f.top, f.width, f.height, f.rotate]);
       const p = h.getGlobalAabb();
       y = {
         left: p.left,
@@ -831,7 +831,7 @@ const To = (o) => {
     const v = { ...h }, y = e.value.zoom, f = e.value.position;
     return v.left *= y.x, v.top *= y.y, v.width *= y.x, v.height *= y.y, v.left += f.x, v.top += f.y, v;
   }
-  const d = O(() => l(t.value?.children ?? [])), g = O(() => l(n.value));
+  const d = $(() => l(t.value?.children ?? [])), g = $(() => l(n.value));
   Object.assign(o, {
     obbToFit: a,
     getObb: r,
@@ -940,7 +940,7 @@ const To = (o) => {
         const u = [];
         for (const v of t.value.values())
           v.accept && u.push(v.accept);
-        const d = u.join(","), { onChange: g, open: h } = jt({
+        const d = u.join(","), { onChange: g, open: h } = Ut({
           accept: d,
           reset: !0,
           multiple: l
@@ -962,13 +962,13 @@ const To = (o) => {
       return "version" in s && "elements" in s && console.log(s), s;
     }
   });
-}, Oo = (o) => {
+}, $o = (o) => {
   const {
     renderEngine: e,
     rootAabb: t,
     currentFrameAabb: n,
     config: s
-  } = o, a = O(() => s.value.viewMode === "frame" ? n.value : t.value);
+  } = o, a = $(() => s.value.viewMode === "frame" ? n.value : t.value);
   function r(i, l) {
     function c() {
       const g = e.value.view;
@@ -1009,7 +1009,7 @@ const To = (o) => {
     }
     pe(() => s.value.viewMode, d), c("setCurrentFrame", d), c("setDoc", d);
   };
-}, $o = (o) => {
+}, Oo = (o) => {
   const {
     config: e
   } = o;
@@ -1025,7 +1025,7 @@ const To = (o) => {
         u,
         { ...f.parent.style },
         { ...f.parent.parent.style }
-      ), f.content)).join(""), { boundingBox: g } = rt({
+      ), f.content)).join(""), { boundingBox: g } = lt({
         style: {
           ...r.style.toJSON(),
           width: "auto"
@@ -1069,7 +1069,7 @@ const To = (o) => {
           c.height = "auto";
           break;
       }
-      const { boundingBox: u } = rt({
+      const { boundingBox: u } = lt({
         style: c,
         content: l.text.content
       });
@@ -1140,20 +1140,20 @@ const To = (o) => {
       const W = (j ? b : [b]).map((he) => {
         const Y = e.value.addElement(he, { parentId: x?.id, regenId: A });
         if (x) {
-          const { width: xe, height: oe } = x.style, ve = xe / 2, ye = oe / 2;
+          const { width: xe, height: ae } = x.style, ve = xe / 2, ye = ae / 2;
           if (Y.style.width || (Y.style.width = ve), Y.style.height || (Y.style.height = ye), T) {
-            const J = Y.style.width / Y.style.height, me = J > 1 ? ve : ye * J, ce = J > 1 ? ve / J : ye;
+            const J = Y.style.width / Y.style.height, me = J > 1 ? ve : ye * J, ue = J > 1 ? ve / J : ye;
             E(
               Y,
               me / Y.style.width,
-              ce / Y.style.height,
+              ue / Y.style.height,
               {
                 deep: !0,
                 textFontSizeToFit: !0
               }
             );
           }
-          w && (Y.style.left = Math.round(xe - Y.style.width) / 2, Y.style.top = Math.round(oe - Y.style.height) / 2);
+          w && (Y.style.left = Math.round(xe - Y.style.width) / 2, Y.style.top = Math.round(ae - Y.style.height) / 2);
         } else
           w && (Y.style.top = Math.round(N), Y.style.left = Math.round(L), N += Y.style.height + g.value.frameGap);
         return Y;
@@ -1175,9 +1175,9 @@ const To = (o) => {
     b === f.value[0]?.id && (f.value = []), e.value?.deleteElement(b);
   }
   function z(b, k) {
-    $(b)?.setProperties(k);
+    I(b)?.setProperties(k);
   }
-  function $(b) {
+  function I(b) {
     return e.value?.nodeMap?.get(b);
   }
   function E(b, k, x, w = {}) {
@@ -1209,7 +1209,7 @@ const To = (o) => {
     addElement: p,
     deleteElement: _,
     updateElement: z,
-    getElement: $,
+    getElement: I,
     resizeElement: E,
     pointerActivateElement: C,
     selectArea: m
@@ -1227,7 +1227,7 @@ const To = (o) => {
     config: c
   } = o;
   function u(y = {}, f) {
-    const p = qt({
+    const p = Gt({
       ...y,
       id: void 0,
       name: "Frame",
@@ -1274,7 +1274,7 @@ const To = (o) => {
     setCurrentFrame: v
   });
 };
-function Oe(o) {
+function Ie(o) {
   return new Promise((e, t) => {
     o.onerror = (n) => t(new Error(n.target.error)), o.onsuccess = (n) => e(n.target.result);
   });
@@ -1291,7 +1291,7 @@ function No(o, e) {
   });
 }
 function Ro(o) {
-  return Oe(indexedDB.deleteDatabase(o));
+  return Ie(indexedDB.deleteDatabase(o));
 }
 function Bo(o, e) {
   return e.forEach((t) => o.createObjectStore.apply(o, t));
@@ -1301,22 +1301,22 @@ function Ue(o, e, t = "readwrite") {
   return e.map((s) => Yo(n, s));
 }
 function nn(o, e) {
-  return Oe(o.count(e));
+  return Ie(o.count(e));
 }
 function Lo(o, e) {
-  return Oe(o.get(e));
+  return Ie(o.get(e));
 }
 function on(o, e) {
-  return Oe(o.delete(e));
+  return Ie(o.delete(e));
 }
 function Do(o, e, t) {
-  return Oe(o.put(e, t));
+  return Ie(o.put(e, t));
 }
-function ut(o, e) {
-  return Oe(o.add(e));
+function mt(o, e) {
+  return Ie(o.add(e));
 }
 function Vo(o, e, t) {
-  return Oe(o.getAll(e, t));
+  return Ie(o.getAll(e, t));
 }
 function jo(o, e, t) {
   let n = null;
@@ -1355,15 +1355,15 @@ function qo(o, e) {
 function Go(o, e) {
   return IDBKeyRange.lowerBound(o, e);
 }
-const st = "custom", sn = "updates", an = 500;
+const at = "custom", sn = "updates", an = 500;
 function rn(o, e, t) {
   const [n] = Ue(
     o.db,
     [sn]
   ), s = Go(o._dbref, !1);
   return Vo(n, s).then((a) => {
-    o._destroyed || (e?.(n), ie.transact(o.doc, () => {
-      a.forEach((r) => ie.applyUpdate(o.doc, r));
+    o._destroyed || (e?.(n), le.transact(o.doc, () => {
+      a.forEach((r) => le.applyUpdate(o.doc, r));
     }, o, !1), t?.(n));
   }).then(() => Uo(n).then((a) => {
     o._dbref = a + 1;
@@ -1373,7 +1373,7 @@ function rn(o, e, t) {
 }
 function Wo(o, e = !0) {
   return rn(o).then((t) => {
-    (e || o._dbsize >= an) && ut(t, ie.encodeStateAsUpdate(o.doc)).then(() => on(
+    (e || o._dbsize >= an) && mt(t, le.encodeStateAsUpdate(o.doc)).then(() => on(
       t,
       qo(o._dbref, !0)
     )).then(() => nn(t).then((n) => {
@@ -1381,7 +1381,7 @@ function Wo(o, e = !0) {
     }));
   });
 }
-class Ko extends Gt {
+class Ko extends Wt {
   constructor(e, t) {
     super(), this.name = e, this.doc = t, this._db = No(e, (n) => {
       Bo(n, [
@@ -1391,7 +1391,7 @@ class Ko extends Gt {
     }), this.whenSynced = new Promise((n) => this.on("synced", () => n(this))), this._db.then((n) => {
       this.db = n, rn(
         this,
-        (s) => ut(s, ie.encodeStateAsUpdate(t)),
+        (s) => mt(s, le.encodeStateAsUpdate(t)),
         () => {
           this._destroyed || (this.synced = !0, this.emit("synced", this));
         }
@@ -1399,7 +1399,7 @@ class Ko extends Gt {
     }), this._storeUpdate = (n, s) => {
       if (this.db && s !== this) {
         const [a] = Ue(this.db, [sn]);
-        ut(a, n), ++this._dbsize >= an && (this._storeTimeoutId !== null && clearTimeout(this._storeTimeoutId), this._storeTimeoutId = setTimeout(() => {
+        mt(a, n), ++this._dbsize >= an && (this._storeTimeoutId !== null && clearTimeout(this._storeTimeoutId), this._storeTimeoutId = setTimeout(() => {
           Wo(this, !1), this._storeTimeoutId = null;
         }, this._storeTimeout));
       }
@@ -1427,26 +1427,26 @@ class Ko extends Gt {
   }
   get(e) {
     return this._db.then((t) => {
-      const [n] = Ue(t, [st], "readonly");
+      const [n] = Ue(t, [at], "readonly");
       return Lo(n, e);
     });
   }
   set(e, t) {
     return this._db.then((n) => {
-      const [s] = Ue(n, [st]);
+      const [s] = Ue(n, [at]);
       return Do(s, t, e);
     });
   }
   del(e) {
     return this._db.then((t) => {
-      const [n] = Ue(t, [st]);
+      const [n] = Ue(t, [at]);
       return on(n, e);
     });
   }
 }
 class ln extends Un {
-  constructor(e = gt()) {
-    super(), this.id = e, this._yDoc = fe(new ie.Doc({ guid: this.id })), this._yDoc.on("update", (...t) => this.emit("update", ...t)), this._yProps = fe(this._yDoc.getMap("props")), this._propertyAccessor = {
+  constructor(e = wt()) {
+    super(), this.id = e, this._yDoc = fe(new le.Doc({ guid: this.id })), this._yDoc.on("update", (...t) => this.emit("update", ...t)), this._yProps = fe(this._yDoc.getMap("props")), this._propertyAccessor = {
       getProperty: (t) => this._yProps.doc ? this._yProps.get(t) : void 0,
       setProperty: (t, n) => {
         this.transact(() => this._yProps.set(t, n));
@@ -1459,7 +1459,7 @@ class ln extends Un {
   indexeddb;
   _ready = !1;
   _setupUndoManager(e = []) {
-    const t = fe(new ie.UndoManager([
+    const t = fe(new le.UndoManager([
       this._yProps,
       ...e
     ], {
@@ -1521,23 +1521,23 @@ var Jo = Object.defineProperty, Zo = (o, e, t, n) => {
   return s && Jo(e, t, s), s;
 };
 function Qo(o, e = {}, t, n = !1) {
-  const s = qt({
+  const s = Gt({
     ...e,
     id: n ? void 0 : e.id,
     meta: {
       inCanvasIs: "Element2D",
       ...e?.meta ?? {}
     }
-  }), a = s.id, r = new ie.Array();
+  }), a = s.id, r = new le.Array();
   for (const i in s)
     o.set(i, s[i]);
-  return o.set("id", a), o.set("parentId", t), o.set("name", s.name ?? a), o.set("childrenIds", r), o.set("meta", new ie.Map(Object.entries(s.meta ?? {}))), s?.meta?.inCanvasIs === "Element2D" && (o.set("style", new ie.Map(Object.entries(s.style ?? {}))), o.set("background", new ie.Map(Object.entries(s.background ?? {}))), o.set("shape", new ie.Map(Object.entries(s.shape ?? {}))), o.set("fill", new ie.Map(Object.entries(s.fill ?? {}))), o.set("outline", new ie.Map(Object.entries(s.outline ?? {}))), o.set("text", new ie.Map(Object.entries(s.text ?? {}))), o.set("foreground", new ie.Map(Object.entries(s.foreground ?? {}))), o.set("shadow", new ie.Map(Object.entries(s.shadow ?? {})))), {
+  return o.set("id", a), o.set("parentId", t), o.set("name", s.name ?? a), o.set("childrenIds", r), o.set("meta", new le.Map(Object.entries(s.meta ?? {}))), s?.meta?.inCanvasIs === "Element2D" && (o.set("style", new le.Map(Object.entries(s.style ?? {}))), o.set("background", new le.Map(Object.entries(s.background ?? {}))), o.set("shape", new le.Map(Object.entries(s.shape ?? {}))), o.set("fill", new le.Map(Object.entries(s.fill ?? {}))), o.set("outline", new le.Map(Object.entries(s.outline ?? {}))), o.set("text", new le.Map(Object.entries(s.text ?? {}))), o.set("foreground", new le.Map(Object.entries(s.foreground ?? {}))), o.set("shadow", new le.Map(Object.entries(s.shadow ?? {})))), {
     normalized: s,
     yChildrenIds: r
   };
 }
 function cn(o, e, t = !1) {
-  const n = [], s = new ie.Map(), { normalized: a, yChildrenIds: r } = Qo(s, o, e, t), i = a.id;
+  const n = [], s = new le.Map(), { normalized: a, yChildrenIds: r } = Qo(s, o, e, t), i = a.id;
   return n.push({ id: i, element: s }), a.children?.forEach((l) => {
     const c = cn(l, i, t);
     r.push([c[0].id]), n.push(...c);
@@ -1546,7 +1546,7 @@ function cn(o, e, t = !1) {
 class un extends ln {
   _yChildren;
   _yChildrenIds;
-  root = Ce(new kt());
+  root = Ee(new Ct());
   nodeMap = /* @__PURE__ */ new Map();
   get meta() {
     return this.root.meta;
@@ -1572,7 +1572,7 @@ class un extends ln {
   }
   async load(e) {
     return super.load(async () => {
-      await e?.(), this._yChildren.size || (this.init(), await Pe()), this._proxyProps(this.root, this._yProps);
+      await e?.(), this._yChildren.size || (this.init(), await Re()), this._proxyProps(this.root, this._yProps);
       const t = this._yProps.get("meta");
       t && this._proxyProps(this.root.meta, t, !0), this._proxyChildren(this.root, this._yChildrenIds), this._yChildrenIds.forEach((n) => {
         const s = this._yChildren.get(n);
@@ -1583,9 +1583,12 @@ class un extends ln {
   _isSelfTransaction(e) {
     return !e.origin || e.origin === this._yDoc.clientID;
   }
+  _debug(...e) {
+  }
   _onChildrenChange(e, t) {
     if (this._isSelfTransaction(t))
       return;
+    this._debug("_onChildrenChange", e);
     const { keysChanged: n, changes: s } = e;
     n.forEach((a) => {
       const r = s.keys.get(a), i = this._yChildren.get(a);
@@ -1633,7 +1636,7 @@ class un extends ln {
   }
   set(e) {
     const { children: t = [], meta: n = {}, ...s } = e;
-    return this.reset(), this.addElements(t), this.setProperties(s), this._yProps.set("meta", new ie.Map(Object.entries(n))), this;
+    return this.reset(), this.addElements(t), this.setProperties(s), this._yProps.set("meta", new le.Map(Object.entries(n))), this;
   }
   _deleteElement(e) {
     const t = this.nodeMap.get(e), n = this._yChildren.get(e);
@@ -1678,7 +1681,7 @@ class un extends ln {
     }
     e.setPropertyAccessor(s);
     const a = (r, i) => {
-      this._isSelfTransaction(i) || this.transact(() => {
+      this._isSelfTransaction(i) || (this._debug("_proxyProps", r, e), this.transact(() => {
         const { keysChanged: l, changes: c } = r;
         l.forEach((u) => {
           const d = c.keys.get(u), g = d?.oldValue;
@@ -1688,11 +1691,11 @@ class un extends ln {
               this.undoManager.stopCapturing(), e[u] = t.get(u), e.requestUpdate(u, t.get(u), g);
               break;
             case "delete":
-              this.undoManager.stopCapturing(), e[u] = void 0, e.requestUpdate(u, void 0, g);
+              this.undoManager.stopCapturing(), e[u] = void 0, e.requestUpdate(u, e[u], g);
               break;
           }
         });
-      }, !1);
+      }, !1));
     };
     e._yMap = fe(t), e._yMapObserveFn && t.unobserve(e._yMapObserveFn), e._yMapObserveFn = fe(a), t.observe(a);
   }
@@ -1704,6 +1707,7 @@ class un extends ln {
     const n = (s, a) => {
       if (this._isSelfTransaction(a))
         return;
+      this._debug("_proxyChildren", s, e);
       const r = e.children;
       let i = 0;
       s.changes.delta.forEach((l) => {
@@ -1746,8 +1750,8 @@ class un extends ln {
   _getOrCreateNode(e) {
     const t = e.get("id");
     let n = this.nodeMap.get(t);
-    return n || (this.undoManager.addToScope(e), n = Ce(
-      kt.parse({
+    return n || (this.undoManager.addToScope(e), n = Ee(
+      Ct.parse({
         meta: {
           inCanvasIs: e.get("meta")?.get("inCanvasIs")
         }
@@ -1764,12 +1768,12 @@ class un extends ln {
 Zo([
   Ye({ default: "doc" })
 ], un.prototype, "name");
-var es = Object.defineProperty, et = (o, e, t, n) => {
+var es = Object.defineProperty, tt = (o, e, t, n) => {
   for (var s = void 0, a = o.length - 1, r; a >= 0; a--)
     (r = o[a]) && (s = r(e, t, s) || s);
   return s && es(e, t, s), s;
 };
-class tt extends ln {
+class nt extends ln {
   docs = /* @__PURE__ */ new Map();
   set(e = {}) {
     return super.reset(), this.setProperties(e), this;
@@ -1780,18 +1784,18 @@ class tt extends ln {
     return this.docs.set(e.id, e), e;
   }
 }
-et([
+tt([
   Ye()
-], tt.prototype, "name");
-et([
+], nt.prototype, "name");
+tt([
   Ye()
-], tt.prototype, "type");
-et([
+], nt.prototype, "type");
+tt([
   Ye()
-], tt.prototype, "createdAt");
-et([
+], nt.prototype, "createdAt");
+tt([
   Ye()
-], tt.prototype, "updatedAt");
+], nt.prototype, "updatedAt");
 const ts = (o, e) => {
   const {
     workspace: t,
@@ -1819,7 +1823,7 @@ const ts = (o, e) => {
             console.error(z);
           }
         typeof p != "string" && _.set(p);
-      }), _.on("update", Hn((z, $) => a("updateDoc", z, $), 200)), t.value?.addDoc(_), n.value?.destroy(), n.value = _, s.value.root.appendChild(_.root), i(0), a("setDoc", _);
+      }), _.on("update", Hn((z, I) => a("updateDoc", z, I), 200)), t.value?.addDoc(_), n.value?.destroy(), n.value = _, s.value.root.appendChild(_.root), i(0), a("setDoc", _);
     } finally {
       l.value = void 0;
     }
@@ -1859,7 +1863,7 @@ const ts = (o, e) => {
   async function u(h) {
     await o.waitUntilFontLoad();
     let v;
-    return h instanceof G ? v = h.toJSON() : v = { ...h }, v.style ??= {}, v.style.top = 0, v.style.left = 0, await Qe({
+    return h instanceof G ? v = h.toJSON() : v = { ...h }, v.style ??= {}, v.style.top = 0, v.style.left = 0, await et({
       width: v.style.width,
       height: v.style.height,
       fonts: i,
@@ -1887,12 +1891,12 @@ const ts = (o, e) => {
     p.fillStyle = "rgba(0, 0, 0, 0)", p.clearRect(0, 0, h.width, h.height);
     const { zoom: _, position: z } = s.value;
     h.width = y.width, h.height = y.height;
-    const $ = y.width * _.x, E = y.height * _.y;
+    const I = y.width * _.x, E = y.height * _.y;
     p.drawImage(
       v,
       (y.left * _.x + z.x) * f,
       (y.top * _.x + z.y) * f,
-      $ * f,
+      I * f,
       E * f,
       0,
       0,
@@ -1944,8 +1948,8 @@ const ts = (o, e) => {
   So,
   Mo,
   zo,
-  Oo,
   $o,
+  Oo,
   Io,
   Fo,
   Po,
@@ -1955,13 +1959,13 @@ const ts = (o, e) => {
 function ss(o, e) {
   return o < e ? -1 : o === e ? 0 : 1;
 }
-function at(o, e) {
+function it(o, e) {
   return o === e;
 }
-function Fe(o) {
+function Ne(o) {
   return typeof o > "u";
 }
-class bt {
+class xt {
   /**
    * First node in the list
    * @type {Object}
@@ -1997,7 +2001,7 @@ class bt {
    * or if the element is undefined.
    */
   add(e, t) {
-    if (Fe(t) && (t = this.nElements), t < 0 || t > this.nElements || Fe(e))
+    if (Ne(t) && (t = this.nElements), t < 0 || t > this.nElements || Ne(e))
       return !1;
     const n = this.createNode(e);
     if (this.nElements === 0 || this.lastNode === null)
@@ -2064,8 +2068,8 @@ class bt {
    * element.
    */
   indexOf(e, t) {
-    const n = t || at;
-    if (Fe(e))
+    const n = t || it;
+    if (Ne(e))
       return -1;
     let s = this.firstNode, a = 0;
     for (; s !== null; ) {
@@ -2112,8 +2116,8 @@ class bt {
    * @return {boolean} true if the list contained the specified element.
    */
   remove(e, t) {
-    const n = t || at;
-    if (this.nElements < 1 || Fe(e))
+    const n = t || it;
+    if (this.nElements < 1 || Ne(e))
       return !1;
     let s = null, a = this.firstNode;
     for (; a !== null; ) {
@@ -2140,8 +2144,8 @@ class bt {
    * @return {boolean} true if this list is equal to the given list.
    */
   equals(e, t) {
-    const n = t || at;
-    return !(e instanceof bt) || this.size() !== e.size() ? !1 : this.equalsAux(this.firstNode, e.firstNode, n);
+    const n = t || it;
+    return !(e instanceof xt) || this.size() !== e.size() ? !1 : this.equalsAux(this.firstNode, e.firstNode, n);
   }
   /**
    * @private
@@ -2260,7 +2264,7 @@ class as {
    * @constructor
    */
   constructor() {
-    this.list = new bt();
+    this.list = new xt();
   }
   /**
    * Inserts the specified element into the end of this queue.
@@ -2397,7 +2401,7 @@ class is {
    * @return {boolean} true if this tree did not already contain the specified element.
    */
   add(e) {
-    return Fe(e) ? !1 : this.insertNode(this.createNode(e)) !== null ? (this.nElements++, !0) : !1;
+    return Ne(e) ? !1 : this.insertNode(this.createNode(e)) !== null ? (this.nElements++, !0) : !1;
   }
   /**
    * Removes all of the elements from this tree.
@@ -2426,7 +2430,7 @@ class is {
    * false otherwise.
    */
   contains(e) {
-    return Fe(e) ? !1 : this.searchNode(this.root, e) !== null;
+    return Ne(e) ? !1 : this.searchNode(this.root, e) !== null;
   }
   /**
    * 搜索元素
@@ -2663,12 +2667,12 @@ class is {
     };
   }
 }
-class At extends is {
+class St extends is {
 }
-function Ie(o, e, t) {
+function Pe(o, e, t) {
   return { pos: o, type: e, box: t };
 }
-function Ge(o) {
+function We(o) {
   const e = "box" in o ? o.box : o;
   return {
     left: e.hl.pos,
@@ -2677,10 +2681,10 @@ function Ge(o) {
     height: e.vb.pos - e.vt.pos
   };
 }
-function St(o) {
+function Mt(o) {
   return o === "vt" ? "vb" : o === "vb" ? "vt" : o === "hl" ? "hr" : o === "hr" ? "hl" : o;
 }
-function it(o) {
+function rt(o) {
   return ["vt", "hl"].includes(o.type);
 }
 const rs = (o) => {
@@ -2696,38 +2700,38 @@ const rs = (o) => {
       return;
     const C = {};
     let m, b, k, x;
-    return E.instanceId ? (C.id = E.instanceId, { top: m, left: b, height: k, width: x } = s(E)) : (C.id = Math.random(), { top: m, left: b, height: k, width: x } = E), C.vt = Ie(m, "vt", C), C.vm = Ie(m + k / 2, "vm", C), C.vb = Ie(m + k, "vb", C), C.hl = Ie(b, "hl", C), C.hm = Ie(b + x / 2, "hm", C), C.hr = Ie(b + x, "hr", C), C;
+    return E.instanceId ? (C.id = E.instanceId, { top: m, left: b, height: k, width: x } = s(E)) : (C.id = Math.random(), { top: m, left: b, height: k, width: x } = E), C.vt = Pe(m, "vt", C), C.vm = Pe(m + k / 2, "vm", C), C.vb = Pe(m + k, "vb", C), C.hl = Pe(b, "hl", C), C.hm = Pe(b + x / 2, "hm", C), C.hr = Pe(b + x, "hr", C), C;
   }
-  const i = O(() => 4), l = O(() => new Set(
+  const i = $(() => 4), l = $(() => new Set(
     [
       t.value[0]?.instanceId
     ].filter(Boolean)
-  )), c = O(() => {
+  )), c = $(() => {
     if (t.value[0])
       return r(t.value[0]);
-  }), u = O(() => {
+  }), u = $(() => {
     const E = t.value[0].parent;
     return E instanceof G ? E : void 0;
-  }), d = O(() => r(
+  }), d = $(() => r(
     u.value ?? { left: 0, top: 0, width: 0, height: 0 }
-  )), g = O(() => {
+  )), g = $(() => {
     const E = [
       ...u.value?.children ?? a.value?.children ?? []
     ];
     return e.value && u.value?.equal(e.value) && E.push(u.value), E.filter((C) => !l.value.has(C.instanceId)).map((C) => r(C)).filter(Boolean);
-  }), h = O(() => g.value.reduce(
+  }), h = $(() => g.value.reduce(
     (E, C) => ([C.vt, C.vm, C.vb].forEach((m) => E.vLines.add(m)), [C.hl, C.hm, C.hr].forEach((m) => E.hLines.add(m)), E),
     {
-      vLines: new At((E, C) => E.pos - C.pos),
-      hLines: new At((E, C) => E.pos - C.pos)
+      vLines: new St((E, C) => E.pos - C.pos),
+      hLines: new St((E, C) => E.pos - C.pos)
     }
   ));
   function v(E) {
     return E.box?.id === -1;
   }
   function y(E, C) {
-    const m = ["vt", "vb"].includes(C.type) ? "vertical" : "horizontal", b = m === "vertical" ? "horizontal" : "vertical", k = it(C);
-    let x = St(C.type);
+    const m = ["vt", "vb"].includes(C.type) ? "vertical" : "horizontal", b = m === "vertical" ? "horizontal" : "vertical", k = rt(C);
+    let x = Mt(C.type);
     if (k) {
       if (C.pos > d.value[x].pos)
         return [];
@@ -2744,14 +2748,14 @@ const rs = (o) => {
       } else if (C.pos > P.pos)
         return;
       const B = v(P);
-      x !== P.type && !B || Be(Ge(C), Ge(P), b) && (!B && T && T.box.id !== P.box.id && Be(Ge(T), Ge(P), m) || (T = P, w.push(P), x = St(x)));
+      x !== P.type && !B || Be(We(C), We(P), b) && (!B && T && T.box.id !== P.box.id && Be(We(T), We(P), m) || (T = P, w.push(P), x = Mt(x)));
     };
     return k ? E.outorderTraversal(M) : E.inorderTraversal(M), w;
   }
   function f(E, C) {
     if (!E.length)
       return [];
-    const m = it(C), b = E[0].pos;
+    const m = rt(C), b = E[0].pos;
     let k = Math.abs(C.pos - b);
     const x = [];
     E = [C].concat(E);
@@ -2773,7 +2777,7 @@ const rs = (o) => {
       pos: m ? b + k : b - k
     }, x);
   }
-  const p = O(() => {
+  const p = $(() => {
     if (!c.value)
       return [];
     const { vLines: E, hLines: C } = h.value, m = c.value, b = { vt: [], vb: [], hl: [], hr: [] }, k = [];
@@ -2802,7 +2806,7 @@ const rs = (o) => {
       if (T && P && (!v(T) || !v(P))) {
         const A = Math.abs(M.pos - T.pos), N = Math.abs(B.pos - P.pos);
         if (Math.abs(A - N) < i.value) {
-          const L = it(M);
+          const L = rt(M);
           k.push({
             target: T,
             source: M,
@@ -2829,7 +2833,7 @@ const rs = (o) => {
         }
       }
     }), k;
-  }), _ = (E) => E, z = O(() => {
+  }), _ = (E) => E, z = $(() => {
     if (n.value !== "transforming")
       return [];
     const E = { left: 0, top: 0 };
@@ -2880,7 +2884,7 @@ const rs = (o) => {
       return M;
     });
   });
-  function $(E = !1) {
+  function I(E = !1) {
     const C = [], m = [];
     for (const b of p.value) {
       const { target: k, source: x, type: w } = b, T = k.box, M = x.box;
@@ -2901,7 +2905,7 @@ const rs = (o) => {
   }
   return Object.assign(o, {
     auxiliaryLines: z,
-    getAdsorptionPoints: $
+    getAdsorptionPoints: I
   }), {
     name: "mce:auxiliary"
   };
@@ -2914,7 +2918,7 @@ const rs = (o) => {
   } = o, a = V();
   async function r() {
     const u = e.value.length === 1 ? [e.value[0].toJSON()] : e.value.map((d) => d.toJSON());
-    if (Et) {
+    if (Tt) {
       const d = "text/html";
       await navigator.clipboard.write([
         new ClipboardItem({
@@ -2930,7 +2934,7 @@ const rs = (o) => {
     await r(), t("delete");
   }
   async function l() {
-    if (Et) {
+    if (Tt) {
       const u = await navigator.clipboard.read(), d = [];
       for (const g of u)
         for (const h of g.types) {
@@ -2940,7 +2944,7 @@ const rs = (o) => {
           else
             switch (v.type) {
               case "text/plain":
-                d.push(lt(await v.text()));
+                d.push(ut(await v.text()));
                 break;
               case "text/html": {
                 const y = new DOMParser().parseFromString(await v.text(), "text/html"), f = y.querySelector("mce-clipboard");
@@ -2955,7 +2959,7 @@ const rs = (o) => {
                       new Uint8Array(
                         atob(
                           p.getAttribute("data-clipboard")?.replace(/\s+/g, "") ?? ""
-                        ).split("").map(($) => $.charCodeAt(0))
+                        ).split("").map((I) => I.charCodeAt(0))
                       )
                     )
                   ), z = new Blob([_], {
@@ -3114,14 +3118,14 @@ const rs = (o) => {
     fonts: t,
     to: n
   } = o, s = e.gifWorkerUrl;
-  return Yt.gifWorkerUrl = s, {
+  return qt.gifWorkerUrl = s, {
     name: "mce:gif",
     exporters: [
       {
         name: "gif",
         handle: async (a) => {
           const { Encoder: r } = await import("modern-gif"), { onProgress: i, ...l } = a, c = n("json", l), { startTime: u, endTime: d } = c.meta, g = Math.floor(c.style.width), h = Math.floor(c.style.height), v = new r({ width: g, height: h, workerUrl: s });
-          return await Qe({
+          return await et({
             data: c,
             width: g,
             height: h,
@@ -3233,7 +3237,7 @@ const rs = (o) => {
     to: s,
     fonts: a,
     upload: r
-  } = o, i = async (u, d) => n(await ct(u), {
+  } = o, i = async (u, d) => n(await dt(u), {
     sizeToFit: !0,
     positionToFit: !0,
     ...d
@@ -3249,7 +3253,7 @@ const rs = (o) => {
     return {
       name: u,
       handle: async (d) => {
-        const g = await s("json", d), h = await Qe({
+        const g = await s("json", d), h = await et({
           data: g,
           fonts: a,
           width: g.style.width,
@@ -3278,9 +3282,9 @@ const rs = (o) => {
     loaders: [
       {
         name: "image",
-        accept: Qt.join(","),
-        test: (u) => !!(u instanceof Blob && u.type.startsWith("image/") || u instanceof File && en.test(u.name)),
-        load: async (u) => await ct(await r(u))
+        accept: en.join(","),
+        test: (u) => !!(u instanceof Blob && u.type.startsWith("image/") || u instanceof File && ct.test(u.name)),
+        load: async (u) => await dt(await r(u))
       }
     ]
   };
@@ -3444,7 +3448,7 @@ const rs = (o) => {
     selection: s,
     textSelection: a,
     config: r
-  } = o, i = O(() => s.value.length > 0), l = O(() => ({
+  } = o, i = $(() => s.value.length > 0), l = $(() => ({
     key: "export",
     children: [
       { key: "saveAs:png" },
@@ -3457,27 +3461,25 @@ const rs = (o) => {
       { key: "saveAs:pptx" },
       { key: "saveAs:json" }
     ]
-  })), c = O(() => ({
+  })), c = $(() => ({
     key: "file",
     children: [
       { key: "new" },
       { key: "open" },
       { type: "divider" },
       { key: "import" },
-      l.value,
-      { type: "divider" },
-      { key: "preferences" }
+      l.value
     ]
-  })), u = O(() => [
+  })), u = $(() => [
     { key: "undo", disabled: !e.value },
     { key: "redo", disabled: !t.value }
-  ]), d = O(() => [
+  ]), d = $(() => [
     { key: "copy", disabled: !i.value },
     { key: "cut", disabled: !i.value },
     { key: "paste", disabled: !n.value },
     { key: "duplicate", disabled: !i.value },
     { key: "delete", disabled: !i.value }
-  ]), g = O(() => ({
+  ]), g = $(() => ({
     key: "select",
     children: [
       { key: "selectAll" },
@@ -3486,7 +3488,7 @@ const rs = (o) => {
       { key: "previousSelection", disabled: !i.value },
       { key: "nextSelection", disabled: !i.value }
     ]
-  })), h = O(() => ({
+  })), h = $(() => ({
     key: "edit",
     children: [
       ...u.value,
@@ -3495,7 +3497,7 @@ const rs = (o) => {
       { type: "divider" },
       ...g.value.children
     ]
-  })), v = O(() => ({
+  })), v = $(() => ({
     key: "zoom",
     children: [
       { key: "zoomIn" },
@@ -3504,7 +3506,7 @@ const rs = (o) => {
       { key: "zoomToFit" },
       { key: "zoomToSelection", disabled: !i.value }
     ]
-  })), y = O(() => ({
+  })), y = $(() => ({
     key: "view",
     children: [
       { key: "view:checkerboard", checked: r.value.checkerboard },
@@ -3517,10 +3519,10 @@ const rs = (o) => {
       { type: "divider" },
       ...v.value.children
     ]
-  })), f = O(() => [
+  })), f = $(() => [
     { key: "group/ungroup", disabled: !i.value },
     { key: "frame/unframe", disabled: !i.value }
-  ]), p = O(() => ({
+  ]), p = $(() => ({
     key: "layerOrder",
     children: [
       { key: "bringToFront", disabled: !i.value },
@@ -3528,16 +3530,16 @@ const rs = (o) => {
       { key: "sendBackward", disabled: !i.value },
       { key: "sendToBack", disabled: !i.value }
     ]
-  })), _ = O(() => ({
+  })), _ = $(() => ({
     key: "flip",
     children: [
       { key: "flipHorizontal", disabled: !i.value },
       { key: "flipVertical", disabled: !i.value }
     ]
-  })), z = O(() => [
+  })), z = $(() => [
     { key: "hide/show", disabled: !i.value },
     { key: "lock/unlock", disabled: !i.value }
-  ]), $ = O(() => ({
+  ]), I = $(() => ({
     key: "object",
     children: [
       ...f.value,
@@ -3548,25 +3550,25 @@ const rs = (o) => {
       { type: "divider" },
       ...z.value
     ]
-  })), E = O(() => [
+  })), E = $(() => [
     { key: "alignLeft", disabled: !i.value },
     { key: "alignHorizontalCenter", disabled: !i.value },
     { key: "alignRight", disabled: !i.value },
     { key: "alignTop", disabled: !i.value },
     { key: "alignVerticalCenter", disabled: !i.value },
     { key: "alignBottom", disabled: !i.value }
-  ]), C = O(() => ({
+  ]), C = $(() => ({
     key: "layerPosition",
     children: [
       ...E.value
     ]
-  })), m = O(() => [
+  })), m = $(() => [
     c.value,
     h.value,
     y.value,
-    $.value,
+    I.value,
     C.value
-  ]), b = O(() => s.value.length > 0 ? a.value ? [
+  ]), b = $(() => s.value.length > 0 ? a.value ? [
     ...d.value
   ] : [
     ...d.value,
@@ -3663,20 +3665,20 @@ const rs = (o) => {
             throw new Error("Failed to parse encoding configuration");
           const _ = new s(h);
           let z = 1;
-          return await Qe({
+          return await et({
             data: i,
             width: u,
             height: d,
             fonts: e,
-            onFrame: async ($, { duration: E, progress: C }) => {
-              const m = await createImageBitmap(new ImageData($, u, d));
+            onFrame: async (I, { duration: E, progress: C }) => {
+              const m = await createImageBitmap(new ImageData(I, u, d));
               await _.encode({
                 data: m,
                 timestamp: z,
                 duration: E
               }), m.close(), z += E, a?.(C);
             },
-            keyframes: Array.from({ length: ~~((c - l) / v) }, ($, E) => l + E * v)
+            keyframes: Array.from({ length: ~~((c - l) / v) }, (I, E) => l + E * v)
           }), await _.flush();
         }
       }
@@ -3792,11 +3794,11 @@ const rs = (o) => {
             presetShapeDefinitions: c,
             upload: async (d, g) => {
               const h = g.image;
-              let v = zt(g.image);
+              let v = $t(g.image);
               const y = As(d);
               if (!v) {
                 const f = Ss(y);
-                f && (v = zt(f));
+                f && (v = $t(f));
               }
               return await t(
                 new File([y], h, {
@@ -3815,7 +3817,7 @@ const rs = (o) => {
       }
     ]
   };
-}, Mt = {
+}, zt = {
   jpeg: "image/jpeg",
   jpg: "image/jpeg",
   png: "image/png",
@@ -3826,9 +3828,9 @@ const rs = (o) => {
   emf: "image/emf",
   wmf: "image/wmf"
 };
-function zt(o) {
+function $t(o) {
   const e = o.split("."), t = e[e.length - 1].toLowerCase();
-  return t in Mt ? Mt[t] : null;
+  return t in zt ? zt[t] : null;
 }
 function As(o) {
   const e = atob(o), t = e.length, n = new ArrayBuffer(t), s = new Uint8Array(n);
@@ -3867,42 +3869,27 @@ function Ss(o) {
   }
 }
 const Ms = (o) => {
-  const e = V(!1);
-  function t() {
-    e.value = !e.value;
-  }
-  return Object.assign(o, {
-    preferencesVisible: e
-  }), {
-    name: "mce:preferences",
-    commands: [
-      { command: "preferences", handle: t }
-    ],
-    hotkeys: [
-      { command: "preferences", key: "CmdOrCtrl+,", editable: !1, system: !0 }
-    ]
-  };
-}, zs = (o) => {
   const {
-    to: e
+    to: e,
+    root: t
   } = o;
   return {
     name: "mce:saveAs",
     commands: [
-      { command: "saveAs", handle: async (n, s = {}) => {
+      { command: "saveAs", handle: async (s, a = {}) => {
         const {
-          filename: a = "download",
-          ...r
-        } = s;
-        let i = await e(n, {
+          filename: r = t.value?.meta.name ?? "download",
+          ...i
+        } = a;
+        let l = await e(s, {
           selected: !0,
-          ...r
+          ...i
         });
-        i instanceof Blob || (i = new Blob([JSON.stringify(i)], { type: "application/json" })), Wt(i, `${a}.${n}`);
+        l instanceof Blob || (l = new Blob([JSON.stringify(l)], { type: "application/json" })), Kt(l, `${r}.${s}`);
       } }
     ]
   };
-}, Os = (o) => {
+}, zs = (o) => {
   const {
     selection: e,
     root: t
@@ -3956,7 +3943,7 @@ const Ms = (o) => {
     addElement: s
   } = o, a = (l = t("clickEditText"), c = {}) => {
     const { style: u, ...d } = c;
-    return s(lt(l, u), {
+    return s(ut(l, u), {
       sizeToFit: !0,
       positionToFit: !0,
       ...d
@@ -3980,11 +3967,11 @@ const Ms = (o) => {
         name: "txt",
         accept: ".txt",
         test: (l) => !!(l instanceof Blob && l.type.startsWith("text/plain") || l instanceof File && i.test(l.name)),
-        load: async (l) => lt(await l.text())
+        load: async (l) => ut(await l.text())
       }
     ]
   };
-}, Is = (o) => {
+}, Os = (o) => {
   const {
     selection: e,
     getAabbInDrawboard: t,
@@ -4000,7 +3987,7 @@ const Ms = (o) => {
       );
     }
   };
-}, Fs = () => {
+}, Is = () => {
   async function o(e) {
     try {
       const n = (await fetch(e, { method: "HEAD" })).headers.get("Content-Type");
@@ -4014,16 +4001,16 @@ const Ms = (o) => {
     loaders: [
       {
         name: "url",
-        test: (e) => typeof e == "string" && e.startsWith("http"),
+        test: (e) => typeof e == "string" && (e.startsWith("http") || ct.test(e)),
         load: async (e) => {
-          if (en.test(e) || await o(e))
-            return await ct(e);
+          if (ct.test(e) || await o(e))
+            return await dt(e);
           throw new Error(`Failed to load url, ${e}`);
         }
       }
     ]
   };
-}, Ps = (o) => {
+}, Fs = (o) => {
   const {
     config: e
   } = o;
@@ -4037,7 +4024,7 @@ const Ms = (o) => {
       { command: "view:ruler", key: "Shift+R" }
     ]
   };
-}, Ns = (o) => {
+}, Ps = (o) => {
   const {
     selection: e
   } = o;
@@ -4067,7 +4054,7 @@ const Ms = (o) => {
       { command: "hide/show", key: "Shift+CmdOrCtrl+h" }
     ]
   };
-}, Ot = { left: 0, top: 0, bottom: 0, right: 0 }, Rs = (o) => {
+}, Ot = { left: 0, top: 0, bottom: 0, right: 0 }, Ns = (o) => {
   const {
     camera: e,
     drawboardAabb: t,
@@ -4093,15 +4080,15 @@ const Ms = (o) => {
       ...s.value.zoomToFitOffset
     };
     s.value.scrollbar && (_.right += 8, _.bottom += 8), s.value.ruler && (_.left += 16, _.top += 16);
-    const z = t.value.width - (_.left + _.right), $ = t.value.height - (_.top + _.bottom), E = p.left, C = p.top, m = p.width, b = p.height;
+    const z = t.value.width - (_.left + _.right), I = t.value.height - (_.top + _.bottom), E = p.left, C = p.top, m = p.width, b = p.height;
     if (m && b) {
-      const k = z / m, x = $ / b;
+      const k = z / m, x = I / b;
       e.value.setZoom(
         y === "contain" ? Math.min(k, x) : Math.max(k, x)
       );
       const w = e.value.zoom.x;
       let T = _.left, M = _.top;
-      k < x ? M += ($ - b * w) / 2 : T += (z - m * w) / 2, e.value.position.set(
+      k < x ? M += (I - b * w) / 2 : T += (z - m * w) / 2, e.value.position.set(
         -E * w + T,
         -C * w + M
       );
@@ -4144,13 +4131,13 @@ const Ms = (o) => {
         drawboardDom: y,
         config: f
       } = o;
-      pe(() => f.value.viewMode, g), Xt(y, (p) => {
-        const { left: _, top: z, width: $, height: E } = p[0].contentRect, { left: C = _, top: m = z } = y.value?.getBoundingClientRect() ?? {};
-        t.value = { left: C, top: m, width: $, height: E }, g();
+      pe(() => f.value.viewMode, g), Ht(y, (p) => {
+        const { left: _, top: z, width: I, height: E } = p[0].contentRect, { left: C = _, top: m = z } = y.value?.getBoundingClientRect() ?? {};
+        t.value = { left: C, top: m, width: I, height: E }, g();
       });
     }
   };
-}, Bs = [
+}, Rs = [
   rs,
   ls,
   cs,
@@ -4173,15 +4160,14 @@ const Ms = (o) => {
   Ts,
   Ms,
   zs,
-  Os,
   $s,
+  Os,
   Is,
   Fs,
   Ps,
-  Ns,
-  Rs
+  Ns
 ];
-class Le extends Gt {
+class Le extends Wt {
   static injectionKey = Symbol.for("EditorKey");
   debug = V(!1);
   onEmit;
@@ -4207,7 +4193,7 @@ class Le extends Gt {
       os,
       e
     ), this.use([
-      ...Bs,
+      ...Rs,
       ...n
     ], e);
   }
@@ -4272,19 +4258,19 @@ class Le extends Gt {
     e.provide(Le.injectionKey, this);
   };
 }
-function nr(o) {
+function tr(o) {
   return o;
 }
-function or(o) {
+function nr(o) {
   return o;
 }
 function de() {
   return Se(Le.injectionKey);
 }
-function Ls(o = new Le()) {
+function Bs(o = new Le()) {
   return De(Le.injectionKey, o), o;
 }
-function wt() {
+function _t() {
   return {
     icon: {
       type: [String, Function, Object, Array]
@@ -4298,9 +4284,9 @@ function wt() {
 const dn = X({
   name: "MceSvgIcon",
   inheritAttrs: !1,
-  props: wt(),
+  props: _t(),
   setup(o, { attrs: e }) {
-    return () => H(o.tag, Ne(e, { style: null }), {
+    return () => H(o.tag, $e(e, { style: null }), {
       default: () => [
         F("svg", {
           class: "mce-icon__svg",
@@ -4321,9 +4307,9 @@ const dn = X({
       ]
     });
   }
-}), $t = X({
+}), It = X({
   name: "MceComponentIcon",
-  props: wt(),
+  props: _t(),
   setup(o, { slots: e }) {
     return () => H(o.tag, null, {
       default: () => [
@@ -4332,16 +4318,16 @@ const dn = X({
     });
   }
 });
-function Ds(o) {
+function Ls(o) {
   const e = Se(mn);
   if (!e)
     throw new Error("Missing Mce Icons provide!");
   return {
-    iconData: O(() => {
+    iconData: $(() => {
       const n = yn(o);
       if (!n)
         return {
-          component: $t
+          component: It
         };
       let s = n;
       if (typeof s == "string" && (s = s.trim(), s.startsWith("$") && (s = e.aliases?.[s.slice(1)])), s || console.warn(`Could not find aliased icon "${n}"`), Array.isArray(s))
@@ -4351,7 +4337,7 @@ function Ds(o) {
         };
       if (typeof s != "string")
         return {
-          component: $t,
+          component: It,
           icon: s
         };
       const a = Object.keys(e.sets).find((l) => typeof s == "string" && s.startsWith(`${l}:`)), r = a ? s.slice(a.length + 1) : s;
@@ -4362,7 +4348,7 @@ function Ds(o) {
     })
   };
 }
-const Vs = {
+const Ds = {
   play: "M8 5.14v14l11-7z",
   pause: "M14 19h4V5h-4M6 19h4V5H6z",
   gps: "M12 8a4 4 0 0 1 4 4a4 4 0 0 1-4 4a4 4 0 0 1-4-4a4 4 0 0 1 4-4m-8.95 5H1v-2h2.05C3.5 6.83 6.83 3.5 11 3.05V1h2v2.05c4.17.45 7.5 3.78 7.95 7.95H23v2h-2.05c-.45 4.17-3.78 7.5-7.95 7.95V23h-2v-2.05C6.83 20.5 3.5 17.17 3.05 13M12 5a7 7 0 0 0-7 7a7 7 0 0 0 7 7a7 7 0 0 0 7-7a7 7 0 0 0-7-7",
@@ -4370,19 +4356,19 @@ const Vs = {
   mouseLeftClick: "M13 9V1.07A8.01 8.01 0 0 1 19.75 7c.16.64.25 1.31.25 2zm4.66-2c-.48-1.35-1.43-2.5-2.66-3.19V7zM6 15v-2h12v2c0 1.59-.63 3.12-1.76 4.24A5.97 5.97 0 0 1 12 21a5.97 5.97 0 0 1-4.24-1.76A5.97 5.97 0 0 1 6 15m-2 0c0 2.12.84 4.16 2.34 5.66S9.88 23 12 23s4.16-.84 5.66-2.34S20 17.12 20 15v-4H4zm7-6V1.07C7.06 1.56 4 4.92 4 9z",
   mouseRightClick: "M13 9V1.07c3.94.49 7 3.85 7 7.93zm-2 0V1.07A8.01 8.01 0 0 0 4.25 7C4.09 7.64 4 8.31 4 9zM6.34 7C6.82 5.65 7.78 4.5 9 3.81V7zM6 15v-2h12v2c0 1.59-.63 3.12-1.76 4.24A5.97 5.97 0 0 1 12 21a5.97 5.97 0 0 1-4.24-1.76A5.97 5.97 0 0 1 6 15m-2 0c0 2.12.84 4.16 2.34 5.66S9.88 23 12 23s4.16-.84 5.66-2.34S20 17.12 20 15v-4H4z",
   check: "M21 7L9 19l-5.5-5.5l1.41-1.41L9 16.17L19.59 5.59z"
-}, js = {
+}, Vs = {
   component: dn
 }, mn = Symbol.for("mce:icons");
-function Us(o = {}) {
-  return Kt({
+function js(o = {}) {
+  return Jt({
     defaultSet: "svg",
-    aliases: Vs,
+    aliases: Ds,
     sets: {
-      svg: js
+      svg: Vs
     }
   }, o);
 }
-const dt = Symbol.for("MceOverlaySymbol"), nt = tn({
+const ht = Symbol.for("MceOverlaySymbol"), qe = tn({
   location: String,
   offset: Number,
   target: Object,
@@ -4391,9 +4377,9 @@ const dt = Symbol.for("MceOverlaySymbol"), nt = tn({
     default: void 0
   }
 }, "makeMceOverlayProps");
-let Xs;
-function Hs() {
-  return Xs ??= hn();
+let Us;
+function Xs() {
+  return Us ??= hn();
 }
 function hn(o = {}) {
   const e = V([]);
@@ -4401,19 +4387,19 @@ function hn(o = {}) {
     register: (t) => {
       const n = e.value.push(t);
       return {
-        index: O(() => n),
+        index: $(() => n),
         attach: o.attach
       };
     },
     unregister: (t) => e.value.splice(e.value.indexOf(t), 1)
   };
 }
-function Ys(o = {}) {
-  let e = Se(dt, null);
-  return e || (e = hn(o), De(dt, e)), e;
+function Hs(o = {}) {
+  let e = Se(ht, null);
+  return e || (e = hn(o), De(ht, e)), e;
 }
-function qs() {
-  const o = Se(dt, Hs()), e = Ze();
+function Ys() {
+  const o = Se(ht, Xs()), e = Qe();
   if (!e)
     throw new Error("Failed to useOverlayRoot, vm is null");
   const t = o.register(e.uid);
@@ -4421,36 +4407,36 @@ function qs() {
     o.unregister(e.uid);
   }), t;
 }
-const Gs = tn({
+const qs = tn({
   resizeStrategy: Function,
   activeStrategy: Function,
   hoverStrategy: Function
-}, "makeMceStrategyProps"), Ws = (o) => {
+}, "makeMceStrategyProps"), Gs = (o) => {
   switch (o.meta?.inPptIs) {
     case "Picture":
       return "diagonalAspectRatio";
   }
   return o.foreground.isValid() ? "diagonalAspectRatio" : "free";
-}, Ks = (o) => {
+}, Ws = (o) => {
   const { element: e, oldElement: t, isExcluded: n } = o;
   if (e && !n(e))
     return e.equal(t) && e.text.isValid() ? {
       element: e,
       state: "typing"
     } : e;
-}, Js = (o) => {
+}, Ks = (o) => {
   const { element: e, isExcluded: t, oldElement: n } = o;
   if (e && !t(e))
     return e.equal(n) ? {
       element: e,
       cursor: "move"
     } : e;
-}, Zs = { class: "mce-auxiliary" }, Qs = /* @__PURE__ */ X({
+}, Js = { class: "mce-auxiliary" }, Zs = /* @__PURE__ */ X({
   __name: "Auxiliary",
   setup(o) {
     const { auxiliaryLines: e } = de();
-    return (t, n) => (I(), R("div", Zs, [
-      (I(!0), R(ne, null, _e(S(e), (s, a) => (I(), R("div", {
+    return (t, n) => (O(), R("div", Js, [
+      (O(!0), R(se, null, _e(S(e), (s, a) => (O(), R("div", {
         key: a,
         class: be(s.class),
         style: q({
@@ -4463,9 +4449,9 @@ const Gs = tn({
     ]));
   }
 });
-function ea(o, e = "content") {
+function Qs(o, e = "content") {
   const t = yo(), n = V();
-  if (yt) {
+  if (bt) {
     const s = new ResizeObserver((a) => {
       o?.(a, s), a.length && (e === "content" ? n.value = a[0].contentRect : n.value = a[0].target.getBoundingClientRect());
     });
@@ -4482,8 +4468,8 @@ function ea(o, e = "content") {
     contentRect: bn(n)
   };
 }
-const Ke = Symbol.for("mce:layout"), fn = Symbol.for("mce:layout-item"), It = 1e3;
-function ta() {
+const Je = Symbol.for("mce:layout"), fn = Symbol.for("mce:layout-item"), Ft = 1e3;
+function ea() {
   return {
     overlaps: {
       type: Array,
@@ -4492,7 +4478,7 @@ function ta() {
     fullHeight: Boolean
   };
 }
-function na() {
+function ta() {
   return {
     name: {
       type: String
@@ -4504,8 +4490,8 @@ function na() {
     absolute: Boolean
   };
 }
-function oa() {
-  const o = Se(Ke);
+function na() {
+  const o = Se(Je);
   if (!o)
     throw new Error("[mce] Could not find injected layout");
   return {
@@ -4514,25 +4500,25 @@ function oa() {
     mainStyles: o.mainStyles
   };
 }
-function sa(o) {
-  const e = Se(Ke);
+function oa(o) {
+  const e = Se(Je);
   if (!e)
     throw new Error("[mce] Could not find injected layout");
-  const t = o.id ?? `layout-item-${Lt()}`, n = Ze();
+  const t = o.id ?? `layout-item-${Dt()}`, n = Qe();
   De(fn, { id: t });
-  const s = Je(!1);
+  const s = Ze(!1);
   wn(() => s.value = !0), xn(() => s.value = !1);
   const {
     layoutItemStyles: a,
     layoutItemScrimStyles: r
   } = e.register(n, {
     ...o,
-    active: O(() => s.value ? !1 : o.active.value),
+    active: $(() => s.value ? !1 : o.active.value),
     id: t
   });
   return we(() => e.unregister(t)), { layoutItemStyles: a, layoutRect: e.layoutRect, layoutItemScrimStyles: r };
 }
-function aa(o, e, t, n) {
+function sa(o, e, t, n) {
   let s = { top: 0, left: 0, right: 0, bottom: 0 };
   const a = [{ id: "", layer: { ...s } }];
   for (const r of o) {
@@ -4550,8 +4536,8 @@ function aa(o, e, t, n) {
   }
   return a;
 }
-function ia(o) {
-  const e = Se(Ke, null), t = O(() => e ? e.rootZIndex.value - 100 : It), n = V([]), s = Ce(/* @__PURE__ */ new Map()), a = Ce(/* @__PURE__ */ new Map()), r = Ce(/* @__PURE__ */ new Map()), i = Ce(/* @__PURE__ */ new Map()), l = Ce(/* @__PURE__ */ new Map()), { resizeRef: c, contentRect: u } = ea(), d = O(() => {
+function aa(o) {
+  const e = Se(Je, null), t = $(() => e ? e.rootZIndex.value - 100 : Ft), n = V([]), s = Ee(/* @__PURE__ */ new Map()), a = Ee(/* @__PURE__ */ new Map()), r = Ee(/* @__PURE__ */ new Map()), i = Ee(/* @__PURE__ */ new Map()), l = Ee(/* @__PURE__ */ new Map()), { resizeRef: c, contentRect: u } = Qs(), d = $(() => {
     const C = /* @__PURE__ */ new Map(), m = o.overlaps ?? [];
     for (const b of m.filter((k) => k.includes(":"))) {
       const [k, x] = b.split(":");
@@ -4561,20 +4547,20 @@ function ia(o) {
       !w || !T || !M || !P || (C.set(x, { position: w.value, amount: Number.parseInt(String(M.value), 10) }), C.set(k, { position: T.value, amount: -Number.parseInt(String(P.value), 10) }));
     }
     return C;
-  }), g = O(() => {
+  }), g = $(() => {
     const C = [...new Set([...r.values()].map((b) => b.value))].sort((b, k) => b - k), m = [];
     for (const b of C) {
       const k = n.value.filter((x) => r.get(x)?.value === b);
       m.push(...k);
     }
-    return aa(m, s, a, i);
-  }), h = O(() => !Array.from(l.values()).some((C) => C.value)), v = O(() => g.value[g.value.length - 1].layer), y = Ee(() => ({
-    "--mce-layout-left": qe(v.value.left),
-    "--mce-layout-right": qe(v.value.right),
-    "--mce-layout-top": qe(v.value.top),
-    "--mce-layout-bottom": qe(v.value.bottom),
+    return sa(m, s, a, i);
+  }), h = $(() => !Array.from(l.values()).some((C) => C.value)), v = $(() => g.value[g.value.length - 1].layer), y = Te(() => ({
+    "--mce-layout-left": Ge(v.value.left),
+    "--mce-layout-right": Ge(v.value.right),
+    "--mce-layout-top": Ge(v.value.top),
+    "--mce-layout-bottom": Ge(v.value.bottom),
     ...h.value ? void 0 : { transition: "none" }
-  })), f = O(() => g.value.slice(1).map(({ id: C }, m) => {
+  })), f = $(() => g.value.slice(1).map(({ id: C }, m) => {
     const { layer: b } = g.value[m], k = a.get(C), x = s.get(C);
     return {
       id: C,
@@ -4582,10 +4568,10 @@ function ia(o) {
       size: Number(k.value),
       position: x.value
     };
-  })), p = (C) => f.value.find((m) => m.id === C), _ = Ze(), z = Je(!1);
+  })), p = (C) => f.value.find((m) => m.id === C), _ = Qe(), z = Ze(!1);
   He(() => {
     z.value = !0;
-  }), De(Ke, {
+  }), De(Je, {
     register: (C, {
       id: m,
       order: b,
@@ -4599,29 +4585,29 @@ function ia(o) {
       r.set(m, b), s.set(m, k), a.set(m, x), i.set(m, T), M && l.set(m, M);
       const A = je(fn, _?.vnode).indexOf(C);
       A > -1 ? n.value.splice(A, 0, m) : n.value.push(m);
-      const N = O(() => f.value.findIndex((U) => U.id === m)), L = O(() => t.value + g.value.length * 2 - N.value * 2), j = O(() => {
+      const N = $(() => f.value.findIndex((U) => U.id === m)), L = $(() => t.value + g.value.length * 2 - N.value * 2), j = $(() => {
         const U = k.value === "left" || k.value === "right", W = k.value === "right", Z = k.value === "bottom", he = w.value ?? x.value, Y = he === 0 ? "%" : "px", xe = {
           [k.value]: 0,
           zIndex: L.value,
           transform: `translate${U ? "X" : "Y"}(${(T.value ? 0 : -(he === 0 ? 100 : he)) * (W || Z ? -1 : 1)}${Y})`,
-          position: P.value || t.value !== It ? "absolute" : "fixed",
+          position: P.value || t.value !== Ft ? "absolute" : "fixed",
           ...h.value ? void 0 : { transition: "none" }
         };
         if (!z.value)
           return xe;
-        const oe = f.value[N.value];
-        oe || uo(`[mce] Could not find layout item "${m}"`);
+        const ae = f.value[N.value];
+        ae || uo(`[mce] Could not find layout item "${m}"`);
         const ve = d.value.get(m);
-        return ve && (oe[ve.position] += ve.amount), {
+        return ve && (ae[ve.position] += ve.amount), {
           ...xe,
-          height: U ? `calc(100% - ${oe.top}px - ${oe.bottom}px)` : w.value ? `${w.value}px` : void 0,
-          left: W ? void 0 : `${oe.left}px`,
-          right: W ? `${oe.right}px` : void 0,
-          top: k.value !== "bottom" ? `${oe.top}px` : void 0,
-          bottom: k.value !== "top" ? `${oe.bottom}px` : void 0,
-          width: U ? w.value ? `${w.value}px` : void 0 : `calc(100% - ${oe.left}px - ${oe.right}px)`
+          height: U ? `calc(100% - ${ae.top}px - ${ae.bottom}px)` : w.value ? `${w.value}px` : void 0,
+          left: W ? void 0 : `${ae.left}px`,
+          right: W ? `${ae.right}px` : void 0,
+          top: k.value !== "bottom" ? `${ae.top}px` : void 0,
+          bottom: k.value !== "top" ? `${ae.bottom}px` : void 0,
+          width: U ? w.value ? `${w.value}px` : void 0 : `calc(100% - ${ae.left}px - ${ae.right}px)`
         };
-      }), D = O(() => ({
+      }), D = $(() => ({
         zIndex: L.value - 1
       }));
       return { layoutItemStyles: j, layoutItemScrimStyles: D, zIndex: L };
@@ -4636,16 +4622,16 @@ function ia(o) {
     layoutRect: u,
     rootZIndex: t
   });
-  const $ = Ee(() => [
+  const I = Te(() => [
     "mce-layout",
     { "mce-layout--full-height": o.fullHeight }
-  ]), E = Ee(() => ({
+  ]), E = Te(() => ({
     zIndex: e ? t.value : void 0,
     position: e ? "relative" : void 0,
     overflow: e ? "hidden" : void 0
   }));
   return {
-    layoutClasses: $,
+    layoutClasses: I,
     layoutStyles: E,
     getLayoutItem: p,
     items: f,
@@ -4653,15 +4639,15 @@ function ia(o) {
     layoutRef: c
   };
 }
-const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
+const Pt = Symbol.for("MceMenuSymbol"), Ae = /* @__PURE__ */ X({
   __name: "Icon",
   props: {
     disabled: Boolean,
-    ...wt()
+    ..._t()
   },
   setup(o) {
-    const e = o, t = Dt(), { iconData: n } = Ds(O(() => e.icon)), s = !!(t.onClick || t.onClickOnce);
-    return (a, r) => (I(), le(Vt(S(n).component), {
+    const e = o, t = Vt(), { iconData: n } = Ls($(() => e.icon)), s = !!(t.onClick || t.onClickOnce);
+    return (a, r) => (O(), oe(jt(S(n).component), {
       icon: S(n).icon,
       tag: e.tag,
       class: be(["mce-icon", {
@@ -4672,7 +4658,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       tabindex: s ? e.disabled ? -1 : 0 : void 0
     }, null, 8, ["icon", "tag", "class", "role", "aria-hidden", "tabindex"]));
   }
-}), xt = /* @__PURE__ */ X({
+}), ot = /* @__PURE__ */ X({
   inheritAttrs: !1,
   __name: "Overlay",
   props: {
@@ -4680,11 +4666,11 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       type: Boolean,
       default: !1
     },
-    ...nt()
+    ...qe()
   },
   emits: ["click:outside", "update:modelValue"],
   setup(o, { expose: e, emit: t }) {
-    const n = o, s = t, a = qs(), r = O({
+    const n = o, s = t, a = Ys(), r = $({
       get: () => n.modelValue,
       set: (p) => s("update:modelValue", p)
     }), i = V(), l = {
@@ -4701,18 +4687,18 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
           height: 0
         };
       }
-    }, c = O(() => typeof n.target == "object" && !(n.target instanceof Element) && "x" in n.target && "y" in n.target ? l : n.target ?? i.value), u = ue("contentElTpl"), d = O(() => n.attach ?? a.attach?.value ?? "body"), { floatingStyles: g, update: h } = Gn(c, u, {
-      placement: O(() => n.location),
+    }, c = $(() => typeof n.target == "object" && !(n.target instanceof Element) && "x" in n.target && "y" in n.target ? l : n.target ?? i.value), u = ce("contentElTpl"), d = $(() => n.attach ?? a.attach?.value ?? "body"), { floatingStyles: g, update: h } = Gn(c, u, {
+      placement: $(() => n.location),
       whileElementsMounted: Zn,
       middleware: [
         Wn(() => n.offset ?? 0),
         Kn(),
         Jn({ padding: 20 })
       ]
-    }), v = O(() => ({
+    }), v = $(() => ({
       ...g.value,
       zIndex: 2e3 + a.index.value
-    })), y = O(() => ({
+    })), y = $(() => ({
       ref: (p) => i.value = p
     }));
     let f = [];
@@ -4726,41 +4712,41 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       );
       f = [
         _,
-        Ut("pointerdown", p, { passive: !0, capture: !0 })
+        Xt("pointerdown", p, { passive: !0, capture: !0 })
       ];
     }), we(() => f.forEach((p) => p())), e({
       activatorEl: i,
       target: c,
       contentEl: u,
       updateLocation: h
-    }), (p, _) => (I(), R(ne, null, [
-      te(p.$slots, "activator", {
+    }), (p, _) => (O(), R(se, null, [
+      Q(p.$slots, "activator", {
         props: y.value,
         isActive: r.value
       }),
-      (I(), le(_n, {
+      (O(), oe(_n, {
         disabled: d.value === !1,
         to: typeof d.value == "boolean" ? void 0 : d.value
       }, [
-        r.value ? (I(), R("div", Ne({
+        r.value ? (O(), R("div", $e({
           key: 0,
           ref: "contentElTpl",
           class: "mce-overlay",
           style: v.value
         }, p.$attrs), [
-          te(p.$slots, "default")
-        ], 16)) : Q("", !0)
+          Q(p.$slots, "default")
+        ], 16)) : ee("", !0)
       ], 8, ["disabled", "to"]))
     ], 64));
   }
-}), ra = ["onMouseenter"], la = ["onClick"], ca = { class: "mce-list-item__prepend" }, ua = { class: "mce-list-item__title" }, da = {
+}), ia = ["onMouseenter"], ra = ["onClick"], la = { class: "mce-list-item__prepend" }, ca = { class: "mce-list-item__title" }, ua = {
   key: 0,
   class: "mce-list-item__append"
-}, ma = /* @__PURE__ */ X({
+}, da = /* @__PURE__ */ X({
   name: "MceMenu",
   __name: "Menu",
-  props: /* @__PURE__ */ Re({
-    ...nt(),
+  props: /* @__PURE__ */ Oe({
+    ...qe(),
     items: Object,
     openOnHover: Boolean,
     persistent: Boolean
@@ -4768,10 +4754,10 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
     modelValue: { type: Boolean },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ Re(["click:item"], ["update:modelValue"]),
+  emits: /* @__PURE__ */ Oe(["click:item"], ["update:modelValue"]),
   setup(o, { expose: e, emit: t }) {
-    const n = o, s = t, a = Ae(o, "modelValue"), r = V(-1), i = ue("overlayTpl"), l = ue("menuItemTplRefs"), c = Lt(), u = Se(Ft, null), d = Je(/* @__PURE__ */ new Set());
-    De(Ft, {
+    const n = o, s = t, a = ke(o, "modelValue"), r = V(-1), i = ce("overlayTpl"), l = ce("menuItemTplRefs"), c = Dt(), u = Se(Pt, null), d = Ze(/* @__PURE__ */ new Set());
+    De(Pt, {
       register: () => d.value.add(c),
       unregister: () => d.value.delete(c),
       closeParents(p) {
@@ -4780,7 +4766,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
     }), we(() => {
       u?.unregister();
     });
-    const g = O(() => {
+    const g = $(() => {
       const p = {};
       return n.openOnHover && (p.onMouseenter = () => a.value = !0), p;
     });
@@ -4801,10 +4787,10 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       updateLocation: v
     }), (p, _) => {
       const z = kn("MceMenu");
-      return I(), le(xt, {
+      return O(), oe(ot, {
         ref: "overlayTpl",
         modelValue: a.value,
-        "onUpdate:modelValue": _[2] || (_[2] = ($) => a.value = $),
+        "onUpdate:modelValue": _[2] || (_[2] = (I) => a.value = I),
         location: n.location,
         offset: n.offset,
         target: n.target,
@@ -4812,55 +4798,55 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
         class: "mce-menu",
         "onClick:outside": h
       }, {
-        activator: re(($) => [
-          te(p.$slots, "activator", Ne($, {
-            props: { ...$.props, ...g.value }
+        activator: ne((I) => [
+          Q(p.$slots, "activator", $e(I, {
+            props: { ...I.props, ...g.value }
           }))
         ]),
-        default: re(() => [
-          o.items?.length ? (I(), R("div", {
+        default: ne(() => [
+          o.items?.length ? (O(), R("div", {
             key: 0,
             class: "mce-list",
             onMouseleave: f
           }, [
-            (I(!0), R(ne, null, _e(o.items, ($, E) => (I(), R(ne, { key: E }, [
-              $.type === "divider" ? (I(), R("div", {
+            (O(!0), R(se, null, _e(o.items, (I, E) => (O(), R(se, { key: E }, [
+              I.type === "divider" ? (O(), R("div", {
                 key: 0,
                 ref_for: !0,
                 ref: "menuItemTplRefs",
                 class: "mce-list__divider"
-              }, null, 512)) : (I(), R("div", {
+              }, null, 512)) : (O(), R("div", {
                 key: 1,
                 ref_for: !0,
                 ref: "menuItemTplRefs",
                 class: "mce-list__item",
-                onMouseenter: (C) => $.disabled ? r.value = -1 : r.value = E
+                onMouseenter: (C) => I.disabled ? r.value = -1 : r.value = E
               }, [
                 F("div", {
                   class: be(["mce-list-item", [
-                    $.disabled && "mce-list-item--disabled",
+                    I.disabled && "mce-list-item--disabled",
                     r.value === E && "mce-list-item--opened"
                   ]]),
-                  onClick: (C) => y($, E, C)
+                  onClick: (C) => y(I, E, C)
                 }, [
-                  F("div", ca, [
-                    $.checked ? (I(), le(Te, {
+                  F("div", la, [
+                    I.checked ? (O(), oe(Ae, {
                       key: 0,
                       icon: "$check"
-                    })) : Q("", !0)
+                    })) : ee("", !0)
                   ]),
-                  F("div", ua, [
-                    te(p.$slots, "title", { item: $ }, () => [
-                      Cn(K($.key), 1)
+                  F("div", ca, [
+                    Q(p.$slots, "title", { item: I }, () => [
+                      Cn(K(I.key), 1)
                     ])
                   ]),
-                  $.children?.length ? (I(), R("div", da, [
-                    H(Te, { icon: "$menuRight" })
-                  ])) : Q("", !0)
-                ], 10, la)
-              ], 40, ra))
+                  I.children?.length ? (O(), R("div", ua, [
+                    H(Ae, { icon: "$menuRight" })
+                  ])) : ee("", !0)
+                ], 10, ra)
+              ], 40, ia))
             ], 64))), 128)),
-            r.value > -1 && o.items?.[r.value]?.children?.length ? (I(), le(z, {
+            r.value > -1 && o.items?.[r.value]?.children?.length ? (O(), oe(z, {
               key: 0,
               "open-on-hover": "",
               items: o.items?.[r.value]?.children,
@@ -4869,27 +4855,27 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
               target: l.value?.[r.value],
               attach: !1,
               offset: 16,
-              "onUpdate:modelValue": _[0] || (_[0] = ($) => r.value = -1),
-              "onClick:item": _[1] || (_[1] = ($, E) => s("click:item", $, E))
-            }, ht({ _: 2 }, [
+              "onUpdate:modelValue": _[0] || (_[0] = (I) => r.value = -1),
+              "onClick:item": _[1] || (_[1] = (I, E) => s("click:item", I, E))
+            }, pt({ _: 2 }, [
               p.$slots.title ? {
                 name: "title",
-                fn: re(($) => [
-                  te(p.$slots, "title", ft(pt($)))
+                fn: ne((I) => [
+                  Q(p.$slots, "title", vt(yt(I)))
                 ]),
                 key: "0"
               } : void 0
-            ]), 1032, ["items", "model-value", "target"])) : Q("", !0)
-          ], 32)) : Q("", !0)
+            ]), 1032, ["items", "model-value", "target"])) : ee("", !0)
+          ], 32)) : ee("", !0)
         ]),
         _: 3
       }, 8, ["modelValue", "location", "offset", "target", "attach"]);
     };
   }
-}), ha = { class: "mce-context-menu__title" }, fa = {
+}), ma = { class: "mce-context-menu__title" }, ha = {
   key: 0,
   class: "mce-context-menu__kbd"
-}, pa = /* @__PURE__ */ X({
+}, fa = /* @__PURE__ */ X({
   __name: "ContextMenu",
   props: {
     modelValue: { type: Boolean },
@@ -4909,7 +4895,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       getKbd: r,
       t: i,
       hotkeys: l
-    } = de(), c = Ae(o, "modelValue"), u = Ae(o, "position"), d = ue("menuTplRef");
+    } = de(), c = ke(o, "modelValue"), u = ke(o, "position"), d = ce("menuTplRef");
     function g() {
       d.value?.updateLocation();
     }
@@ -4929,7 +4915,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
     }
     return e({
       updateLocation: g
-    }), (y, f) => (I(), le(ma, {
+    }), (y, f) => (O(), oe(da, {
       ref: "menuTplRef",
       modelValue: c.value,
       "onUpdate:modelValue": f[0] || (f[0] = (p) => c.value = p),
@@ -4943,17 +4929,17 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       }),
       "onClick:item": v
     }, {
-      title: re(({ item: p }) => [
-        F("span", ha, K(S(i)(p.key)), 1),
-        S(l).has(p.key) ? (I(), R("span", fa, K(S(r)(p.key)), 1)) : Q("", !0)
+      title: ne(({ item: p }) => [
+        F("span", ma, K(S(i)(p.key)), 1),
+        S(l).has(p.key) ? (O(), R("span", ha, K(S(r)(p.key)), 1)) : ee("", !0)
       ]),
       _: 1
     }, 8, ["modelValue", "target", "items", "style"]));
   }
-}), va = {
+}), pa = {
   key: 0,
   class: "mce-drawing__content"
-}, ya = /* @__PURE__ */ X({
+}, va = /* @__PURE__ */ X({
   __name: "Drawing",
   setup(o) {
     const {
@@ -4971,7 +4957,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       });
       t.value?.callback?.(d), r(void 0);
     }
-    return (u, d) => S(e) === "drawing" ? (I(), R("div", {
+    return (u, d) => S(e) === "drawing" ? (O(), R("div", {
       key: 0,
       class: "mce-drawing",
       style: q({
@@ -4980,13 +4966,13 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       }),
       onMousedown: c
     }, [
-      S(t)?.content ? (I(), R("div", va, K(S(n)(S(t).content)), 1)) : Q("", !0)
-    ], 36)) : Q("", !0);
+      S(t)?.content ? (O(), R("div", pa, K(S(n)(S(t).content)), 1)) : ee("", !0)
+    ], 36)) : ee("", !0);
   }
-}), ga = /* @__PURE__ */ X({
+}), ya = /* @__PURE__ */ X({
   __name: "Floatbar",
   props: {
-    ...nt({
+    ...qe({
       location: "top-start",
       offset: 8
     })
@@ -4996,7 +4982,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       getAabbInDrawboard: n,
       selection: s,
       isFrame: a
-    } = de(), r = ue("overlayTpl");
+    } = de(), r = ce("overlayTpl");
     function i() {
       r.value?.updateLocation();
     }
@@ -5004,7 +4990,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       deep: !0
     }), e({
       updateLocation: i
-    }), (l, c) => (I(), le(xt, {
+    }), (l, c) => (O(), oe(ot, {
       ref: "overlayTpl",
       class: "mce-floatbar",
       location: t.location,
@@ -5013,13 +4999,13 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       attach: !1,
       "model-value": !0
     }, {
-      default: re(() => [
-        S(s).length > 0 ? te(l.$slots, "default", { key: 0 }) : Q("", !0)
+      default: ne(() => [
+        S(s).length > 0 ? Q(l.$slots, "default", { key: 0 }) : ee("", !0)
       ]),
       _: 3
     }, 8, ["location", "offset", "target"]));
   }
-}), ba = /* @__PURE__ */ X({
+}), ga = /* @__PURE__ */ X({
   __name: "Frame",
   props: {
     modelValue: { required: !0 },
@@ -5027,7 +5013,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
   },
   emits: ["update:modelValue"],
   setup(o) {
-    const e = Ae(o, "modelValue"), t = ue("inputTpl"), {
+    const e = ke(o, "modelValue"), t = ce("inputTpl"), {
       getObbInDrawboard: n,
       hoverElement: s,
       selection: a,
@@ -5036,12 +5022,12 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       exec: l
     } = de(), c = V(!1);
     async function u() {
-      c.value = !0, await Pe(), t.value && (t.value.focus(), t.value.select());
+      c.value = !0, await Re(), t.value && (t.value.focus(), t.value.select());
     }
     async function d(g) {
-      c.value || (a.value = [e.value], await Pe(), l("startTransform", g));
+      c.value || (a.value = [e.value], await Re(), l("startTransform", g));
     }
-    return (g, h) => ze((I(), R("div", {
+    return (g, h) => ze((O(), R("div", {
       style: q(S(Me)(S(n)(e.value))),
       class: be(["mce-frame", [
         S(i).frameOutline && "mce-frame--outline"
@@ -5070,18 +5056,18 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       [Xe, e.value.visible]
     ]);
   }
-}), wa = /* @__PURE__ */ X({
+}), ba = /* @__PURE__ */ X({
   __name: "Frames",
   setup(o) {
     const {
       frames: e
     } = de();
-    return (t, n) => (I(!0), R(ne, null, _e(S(e), (s, a) => (I(), le(ba, {
+    return (t, n) => (O(!0), R(se, null, _e(S(e), (s, a) => (O(), oe(ga, {
       key: a,
       "model-value": s
     }, null, 8, ["model-value"]))), 128));
   }
-}), xa = /* @__PURE__ */ X({
+}), wa = /* @__PURE__ */ X({
   __name: "GoBackSelectedArea",
   setup(o) {
     const {
@@ -5090,28 +5076,28 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       aabbToDrawboardAabb: n,
       exec: s,
       t: a
-    } = de(), r = O(() => e.value.width && e.value.height && !Be(
+    } = de(), r = $(() => e.value.width && e.value.height && !Be(
       t.value,
       n(e.value)
     ));
-    return (i, l) => r.value ? (I(), R("div", {
+    return (i, l) => r.value ? (O(), R("div", {
       key: 0,
       class: "mce-back-selected-aera",
-      onClick: l[0] || (l[0] = We((c) => S(s)("zoomToSelection"), ["prevent"]))
+      onClick: l[0] || (l[0] = Ke((c) => S(s)("zoomToSelection"), ["prevent"]))
     }, [
-      H(Te, { icon: "$gps" }),
+      H(Ae, { icon: "$gps" }),
       F("span", null, K(S(a)("goBackSelectedArea")), 1)
-    ])) : Q("", !0);
+    ])) : ee("", !0);
   }
-}), _a = ["data-name"], ka = /* @__PURE__ */ X({
+}), xa = ["data-name"], _a = /* @__PURE__ */ X({
   __name: "Hover",
   setup(o) {
     const {
       selection: e,
       hoverElement: t,
       getObbInDrawboard: n
-    } = de(), s = O(() => n(t.value));
-    return (a, r) => S(t) && !S(t).equal(S(e)[0]) ? (I(), R("div", {
+    } = de(), s = $(() => n(t.value));
+    return (a, r) => S(t) && !S(t).equal(S(e)[0]) ? (O(), R("div", {
       key: 0,
       class: "mce-hover",
       "data-name": S(t).name,
@@ -5119,12 +5105,12 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
         borderColor: "currentcolor",
         ...S(Me)(s.value)
       })
-    }, null, 12, _a)) : Q("", !0);
+    }, null, 12, xa)) : ee("", !0);
   }
-}), Ca = /* @__PURE__ */ X({
+}), ka = /* @__PURE__ */ X({
   __name: "Tooltip",
-  props: /* @__PURE__ */ Re({
-    ...nt({
+  props: /* @__PURE__ */ Oe({
+    ...qe({
       location: "right",
       offset: 8
     })
@@ -5134,13 +5120,13 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
   }),
   emits: ["update:modelValue"],
   setup(o, { expose: e }) {
-    const t = o, n = Ae(o, "modelValue"), s = ue("overlayTpl");
+    const t = o, n = ke(o, "modelValue"), s = ce("overlayTpl");
     function a() {
       s.value?.updateLocation();
     }
     return e({
       updateLocation: a
-    }), (r, i) => (I(), le(xt, {
+    }), (r, i) => (O(), oe(ot, {
       ref: "overlayTpl",
       modelValue: n.value,
       "onUpdate:modelValue": i[0] || (i[0] = (l) => n.value = l),
@@ -5149,22 +5135,22 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       offset: t.offset,
       target: t.target,
       attach: t.attach
-    }, ht({
-      default: re(() => [
-        n.value ? te(r.$slots, "default", { key: 0 }) : Q("", !0)
+    }, pt({
+      default: ne(() => [
+        n.value ? Q(r.$slots, "default", { key: 0 }) : ee("", !0)
       ]),
       _: 2
     }, [
       r.$slots.activator ? {
         name: "activator",
-        fn: re((l) => [
-          te(r.$slots, "activator", ft(pt(l)))
+        fn: ne((l) => [
+          Q(r.$slots, "activator", vt(yt(l)))
         ]),
         key: "0"
       } : void 0
     ]), 1032, ["modelValue", "location", "offset", "target", "attach"]));
   }
-}), Ea = ["width", "height"], Ta = ["onDblclick", "onMousedown", "onMousemove"], Aa = { style: { "font-size": "12px", "text-wrap": "nowrap" } }, mt = /* @__PURE__ */ X({
+}), Ca = ["width", "height"], Ea = ["onDblclick", "onMousedown", "onMousemove"], Ta = { style: { "font-size": "12px", "text-wrap": "nowrap" } }, ft = /* @__PURE__ */ X({
   inheritAttrs: !1,
   __name: "Ruler",
   props: {
@@ -5181,7 +5167,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
     labelFormat: { type: Function, default: (o) => String(o) }
   },
   setup(o, { expose: e }) {
-    const t = o, n = Dt(), s = O(() => t.pixelRatio), a = V(), r = V({ x: 0, y: 0 }), i = ue("canvasTpl"), l = "OffscreenCanvas" in window ? new OffscreenCanvas(t.size, t.size) : document.createElement("canvas"), c = l.getContext("2d"), u = V(), d = Ce({
+    const t = o, n = Vt(), s = $(() => t.pixelRatio), a = V(), r = V({ x: 0, y: 0 }), i = ce("canvasTpl"), l = "OffscreenCanvas" in window ? new OffscreenCanvas(t.size, t.size) : document.createElement("canvas"), c = l.getContext("2d"), u = V(), d = Ee({
       text: "#000",
       border: "#000"
     });
@@ -5204,7 +5190,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       const D = N, U = t.size - L;
       c.save(), t.vertical && (c.translate(0, t.size), c.scale(1, -1)), c.fillText(A, D, U), c.restore();
     }
-    const f = O(() => {
+    const f = $(() => {
       const A = Math.max(t.unit / t.zoom, 1), N = t.unitFractions, L = Math.floor(Math.log10(A)), j = A / 10 ** L;
       let D = N[N.length - 1];
       for (const U of N)
@@ -5213,17 +5199,17 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
           break;
         }
       return D * 10 ** L;
-    }), p = O(() => {
+    }), p = $(() => {
       const A = -t.position / t.zoom;
       return Math.floor(A / f.value) * f.value;
-    }), _ = O(() => {
+    }), _ = $(() => {
       const N = ((t.vertical ? u.value?.height : u.value?.width) ?? 0) / t.zoom;
       return p.value + Math.ceil(N / f.value) * f.value;
     });
     function z(A) {
       return Math.round(A * t.zoom + t.position);
     }
-    function $(A) {
+    function I(A) {
       return Math.round((A - t.position) / t.zoom);
     }
     function E() {
@@ -5260,7 +5246,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       },
       { immediate: !0, deep: !0 }
     );
-    const C = Ht(() => {
+    const C = Yt(() => {
       if (!i.value)
         return;
       const A = i.value.parentElement.getBoundingClientRect();
@@ -5276,12 +5262,12 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
     }), we(() => {
       l.width = 0, l.height = 0;
     });
-    const m = V([]), b = V(), k = O(() => {
+    const m = V([]), b = V(), k = $(() => {
       const A = [...m.value];
       return typeof b.value == "number" && A.unshift(b.value), A;
     });
     function x(A) {
-      return $(
+      return I(
         t.vertical ? A.clientY - u.value.top : A.clientX - u.value.left
       );
     }
@@ -5310,8 +5296,8 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
     }
     return e({
       box: u
-    }), (A, N) => (I(), R(ne, null, [
-      ze((I(), R("div", Ne({
+    }), (A, N) => (O(), R(se, null, [
+      ze((O(), R("div", $e({
         class: ["mce-ruler", [
           `mce-ruler--${t.vertical ? "vertical" : "horizontal"}`
         ]],
@@ -5326,11 +5312,11 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
           class: "mce-ruler__canvas",
           width: t.size,
           height: t.size
-        }, null, 8, Ea)
+        }, null, 8, Ca)
       ], 16)), [
-        [S(Jt), S(C)]
+        [S(Zt), S(C)]
       ]),
-      (I(!0), R(ne, null, _e(k.value, (L, j) => (I(), R("div", {
+      (O(!0), R(se, null, _e(k.value, (L, j) => (O(), R("div", {
         key: j,
         class: be(["mce-ruler-refline", {
           "mce-ruler-refline--vertical": t.vertical,
@@ -5347,20 +5333,20 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
         onMousedown: (D) => B(D, j),
         onMousemove: () => a.value = `${L}`,
         onMouseleave: M
-      }, null, 46, Ta))), 128)),
-      H(Ca, {
+      }, null, 46, Ea))), 128)),
+      H(ka, {
         "model-value": !!a.value,
         target: r.value,
         offset: 24
       }, {
-        default: re(() => [
-          F("div", Aa, K(a.value), 1)
+        default: ne(() => [
+          F("div", Ta, K(a.value), 1)
         ]),
         _: 1
       }, 8, ["model-value", "target"])
     ], 64));
   }
-}), Sa = { class: "mce-rulers" }, Ma = /* @__PURE__ */ X({
+}), Aa = { class: "mce-rulers" }, Sa = /* @__PURE__ */ X({
   inheritAttrs: !1,
   __name: "Rulers",
   setup(o) {
@@ -5368,9 +5354,9 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       camera: e,
       getAabbInDrawboard: t,
       selection: n
-    } = de(), s = O(() => t(n.value));
-    return (a, r) => (I(), R("div", Sa, [
-      H(mt, {
+    } = de(), s = $(() => t(n.value));
+    return (a, r) => (O(), R("div", Aa, [
+      H(ft, {
         refline: "",
         zoom: S(e).zoom.x,
         position: S(e).position.x,
@@ -5378,7 +5364,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
         axis: "",
         size: 16
       }, null, 8, ["zoom", "position", "selected"]),
-      H(mt, {
+      H(ft, {
         refline: "",
         zoom: S(e).zoom.y,
         position: S(e).position.y,
@@ -5390,12 +5376,12 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       r[0] || (r[0] = F("div", { class: "mce-rulers__left-top" }, null, -1))
     ]));
   }
-}), za = {
+}), Ma = {
   ref: "trackTplRef",
   class: "mce-scrollbar__track"
-}, Oa = 50, Pt = 50, Nt = /* @__PURE__ */ X({
+}, za = 50, Nt = 50, Rt = /* @__PURE__ */ X({
   __name: "Scrollbar",
-  props: /* @__PURE__ */ Re({
+  props: /* @__PURE__ */ Oe({
     zoom: {},
     length: {},
     vertical: { type: Boolean },
@@ -5406,16 +5392,16 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
     modelValue: { required: !0 },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ Re(["scroll"], ["update:modelValue"]),
+  emits: /* @__PURE__ */ Oe(["scroll"], ["update:modelValue"]),
   setup(o, { emit: e }) {
-    const t = o, n = e, s = (w, T, M) => w * (1 - M) + T * M, a = (w, T) => s(w / 2, 1 - w / 2, T), r = Ae(o, "modelValue"), i = ue("trackTplRef"), l = ue("thumbTplRef"), c = V(0), u = O(
+    const t = o, n = e, s = (w, T, M) => w * (1 - M) + T * M, a = (w, T) => s(w / 2, 1 - w / 2, T), r = ke(o, "modelValue"), i = ce("trackTplRef"), l = ce("thumbTplRef"), c = V(0), u = $(
       () => t.infinite ? t.length * t.zoom + c.value + Math.abs(r.value) * 2 : r.value > 0 ? r.value + t.length * t.zoom : Math.max(c.value - r.value, t.length * t.zoom)
-    ), d = O(
+    ), d = $(
       () => t.infinite ? Math.abs(r.value) - r.value : r.value > 0 ? 0 : -r.value
-    ), g = O(() => Math.max(0.05, Math.min(1, c.value / u.value))), h = O(() => d.value / (u.value - c.value) * (1 - g.value)), v = Ht(() => {
+    ), g = $(() => Math.max(0.05, Math.min(1, c.value / u.value))), h = $(() => d.value / (u.value - c.value) * (1 - g.value)), v = Yt(() => {
       const w = i.value?.getBoundingClientRect() ?? { width: 0, height: 0 };
       c.value = t.vertical ? w.height : w.width;
-    }, 50), y = O(() => t.infinite ? a(g.value, h.value) : h.value), f = O(() => 1 - y.value - g.value), p = O(() => t.vertical ? `${y.value * 100}%` : "0%"), _ = O(() => t.vertical ? `${f.value * 100}%` : "50%"), z = O(() => t.vertical ? "0%" : `${y.value * 100}%`), $ = O(() => t.vertical ? "50%" : `${f.value * 100}%`);
+    }, 50), y = $(() => t.infinite ? a(g.value, h.value) : h.value), f = $(() => 1 - y.value - g.value), p = $(() => t.vertical ? `${y.value * 100}%` : "0%"), _ = $(() => t.vertical ? `${f.value * 100}%` : "50%"), z = $(() => t.vertical ? "0%" : `${y.value * 100}%`), I = $(() => t.vertical ? "50%" : `${f.value * 100}%`);
     function E(w) {
       n("scroll", w - r.value), r.value = w;
     }
@@ -5441,14 +5427,14 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
           return;
         }
       }
-      C(Oa * M), b = setTimeout(() => k(w), Pt);
+      C(za * M), b = setTimeout(() => k(w), Nt);
     }
     function x() {
       clearTimeout(b);
     }
     return we(() => {
       x();
-    }), (w, T) => ze((I(), R("div", {
+    }), (w, T) => ze((O(), R("div", {
       class: be(["mce-scrollbar", {
         "mce-scrollbar--vertical": t.vertical,
         "mce-scrollbar--horizontal": !t.vertical
@@ -5459,7 +5445,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
         [t.vertical ? "top" : "left"]: `${t.offset}px`
       })
     }, [
-      F("div", za, [
+      F("div", Ma, [
         ze(F("div", {
           ref: "thumbTplRef",
           class: be(["mce-scrollbar__thumb", {
@@ -5469,15 +5455,15 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
             top: p.value,
             bottom: _.value,
             left: z.value,
-            right: $.value
+            right: I.value
           })
         }, null, 6), [
           [Xe, t.infinite || g.value < 1]
         ])
       ], 512)
     ], 6)), [
-      [S(Jt), S(v)],
-      [S(Qn), [k, { delay: Pt, onMouseUp: x }]]
+      [S(Zt), S(v)],
+      [S(Qn), [k, { delay: Nt, onMouseUp: x }]]
     ]);
   }
 }), $a = /* @__PURE__ */ X({
@@ -5493,15 +5479,15 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       camera: t,
       viewAabb: n
     } = de();
-    return (s, a) => (I(), R(ne, null, [
-      H(Nt, Ne(e, {
+    return (s, a) => (O(), R(se, null, [
+      H(Rt, $e(e, {
         modelValue: S(t).position.y,
         "onUpdate:modelValue": a[0] || (a[0] = (r) => S(t).position.y = r),
         zoom: S(t).zoom.y,
         vertical: "",
         length: S(n).height
       }), null, 16, ["modelValue", "zoom", "length"]),
-      H(Nt, Ne(e, {
+      H(Rt, $e(e, {
         modelValue: S(t).position.x,
         "onUpdate:modelValue": a[1] || (a[1] = (r) => S(t).position.x = r),
         zoom: S(t).zoom.x,
@@ -5509,10 +5495,10 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       }), null, 16, ["modelValue", "zoom", "length"])
     ], 64));
   }
-}), Ia = { class: "mce-transformable__svg" }, Fa = { "pointer-events": "all" }, Pa = ["x", "y", "width", "height", "aria-label", "fill"], Na = ["cx", "cy", "r", "aria-label", "fill"], Ra = ["x", "y", "width", "height", "aria-label", "cursor", "onPointerdown"], Ba = {
+}), Oa = { class: "mce-transformable__svg" }, Ia = { "pointer-events": "all" }, Fa = ["x", "y", "width", "height", "aria-label", "fill"], Pa = ["cx", "cy", "r", "aria-label", "fill"], Na = ["x", "y", "width", "height", "aria-label", "cursor", "onPointerdown"], Ra = {
   key: 0,
   class: "mce-transformable__tip"
-}, La = /* @__PURE__ */ X({
+}, Ba = /* @__PURE__ */ X({
   __name: "Transformable",
   props: {
     tag: { default: "div" },
@@ -5561,13 +5547,13 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       "resize-top-right": (m) => _("resizeBevel", 180 + m),
       "resize-bottom-right": (m) => _("resizeBevel", 90 + m),
       "resize-bottom-left": (m) => _("resizeBevel", 180 + m)
-    }, r = Ae(n, "modelValue"), i = O({
+    }, r = ke(n, "modelValue"), i = $({
       get: () => {
         let { left: m = 0, top: b = 0, width: k = 0, height: x = 0, rotate: w = 0 } = r.value ?? {};
         return Number.isNaN(Number(k)) && (k = 0), Number.isNaN(Number(x)) && (x = 0), { left: m, top: b, width: k, height: x, rotate: w };
       },
       set: (m) => r.value = m
-    }), l = V(!1), c = V(), u = O(() => {
+    }), l = V(!1), c = V(), u = $(() => {
       const { width: m = 0, height: b = 0 } = i.value, k = 6, x = k / 2, w = 8, T = w / 2, M = 12;
       let P;
       return n.handleStrategy === "point" ? P = [
@@ -5607,19 +5593,19 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
         { type: "rotate-bottom-left", x: -M - T, y: b + T, width: M, height: M },
         { type: "rotate-bottom-right", x: m + T, y: b + T, width: M, height: M }
       ], P.filter((B) => n.handles.includes(B.type)).map((B) => (B.width = Math.max(B.width, 0), B.height = Math.max(B.height, 0), B));
-    }), d = V(), g = O(() => {
+    }), d = V(), g = $(() => {
       const { width: m = 0, height: b = 0 } = i.value;
       return {
         width: n.initialSize && !m ? void 0 : `${m}px`,
         height: n.initialSize && !b ? void 0 : `${b}px`
       };
-    }), h = O(() => {
+    }), h = $(() => {
       const { left: m = 0, top: b = 0, rotate: k = 0 } = i.value, x = k * Math.PI / 180, w = Math.cos(x), T = Math.sin(x);
       return {
         ...g.value,
         transform: `matrix(${w}, ${T}, ${-T}, ${w}, ${m}, ${b})`
       };
-    }), v = O(() => n.visibility === "auto" && l.value), y = O(() => n.tipFormat?.("size"));
+    }), v = $(() => n.visibility === "auto" && l.value), y = $(() => n.tipFormat?.("size"));
     function f(m, b) {
       if (m && m.button !== void 0 && m.button !== 0)
         return !1;
@@ -5634,7 +5620,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
         y: x
       };
       A || (U.x += B.x + B.width / 2, U.y += B.y + B.height / 2);
-      const W = $(
+      const W = I(
         U,
         D,
         A ? 0 : M
@@ -5650,7 +5636,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
         l.value = !0, s("start", i.value);
       }
       !n.threshold && !l.value && xe();
-      function oe(ye) {
+      function ae(ye) {
         const J = {};
         Y || (Y = { x: ye.clientX, y: ye.clientY });
         const me = {
@@ -5662,56 +5648,56 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
             return;
           xe();
         }
-        const ce = {
+        const ue = {
           x: W.x + me.x,
           y: W.y + me.y
         };
         if (A) {
           if (!n.moveable)
             return;
-          J.left = ce.x, J.top = ce.y;
+          J.left = ue.x, J.top = ue.y;
         } else if (N) {
           const ge = Math.atan2(
-            ce.y - D.y,
-            ce.x - D.x
+            ue.y - D.y,
+            ue.x - D.x
           ) / (Math.PI / 180);
           J.rotate = (M + ge - he + 360) % 360;
         } else if (j) {
-          const ge = $(ce, W, -M), ae = $(
+          const ge = I(ue, W, -M), re = I(
             L ? { x: ge.x, y: W.y } : { x: W.x, y: ge.y },
             W,
             M
           ), Ve = {
-            x: ae.x - (ae.x - Z.x) / 2,
-            y: ae.y + (Z.y - ae.y) / 2
-          }, ke = C(ae, Z);
-          L ? (J.width = ke, P && n.resizeStrategy === "aspectRatio" && (J.height = ke / P)) : (J.height = ke, P && n.resizeStrategy === "aspectRatio" && (J.width = ke * P)), J.left = Ve.x - (L ? ke : w) / 2, J.top = Ve.y - (L ? T : ke) / 2;
+            x: re.x - (re.x - Z.x) / 2,
+            y: re.y + (Z.y - re.y) / 2
+          }, Ce = C(re, Z);
+          L ? (J.width = Ce, P && n.resizeStrategy === "aspectRatio" && (J.height = Ce / P)) : (J.height = Ce, P && n.resizeStrategy === "aspectRatio" && (J.width = Ce * P)), J.left = Ve.x - (L ? Ce : w) / 2, J.top = Ve.y - (L ? T : Ce) / 2;
         } else {
           if (P && (n.resizeStrategy === "aspectRatio" || n.resizeStrategy === "diagonalAspectRatio")) {
-            let ot = 1;
+            let st = 1;
             switch (B.type) {
               case "resize-top-right":
               case "resize-bottom-left":
-                ot = -1;
+                st = -1;
                 break;
             }
-            me.x > me.y ? (ce.x = W.x + me.x, ce.y = W.y + ot * me.x / P) : (ce.x = W.x + ot * me.y * P, ce.y = W.y + me.y);
+            me.x > me.y ? (ue.x = W.x + me.x, ue.y = W.y + st * me.x / P) : (ue.x = W.x + st * me.y * P, ue.y = W.y + me.y);
           }
-          const ge = E(ce, Z), ae = [
-            $(ce, ge, -M),
-            $(Z, ge, -M)
-          ], [Ve, ke] = ae[0].x > ae[1].x ? [ae[1].x, ae[0].x] : [ae[0].x, ae[1].x], [_t, vn] = ae[0].y > ae[1].y ? [ae[1].y, ae[0].y] : [ae[0].y, ae[1].y];
-          J.width = ke - Ve, J.height = vn - _t, J.left = Ve, J.top = _t;
+          const ge = E(ue, Z), re = [
+            I(ue, ge, -M),
+            I(Z, ge, -M)
+          ], [Ve, Ce] = re[0].x > re[1].x ? [re[1].x, re[0].x] : [re[0].x, re[1].x], [kt, vn] = re[0].y > re[1].y ? [re[1].y, re[0].y] : [re[0].y, re[1].y];
+          J.width = Ce - Ve, J.height = vn - kt, J.left = Ve, J.top = kt;
         }
         if ("width" in J && J.width <= 0 || "height" in J && J.height <= 0)
           return;
-        const ee = { ...i.value }, se = { ...i.value, ...J };
-        i.value = se, s("move", se, ee);
+        const te = { ...i.value }, ie = { ...i.value, ...J };
+        i.value = ie, s("move", ie, te);
       }
       function ve() {
-        window.removeEventListener("pointermove", oe), window.removeEventListener("pointerup", ve, !0), l.value = !1, s("end", i.value);
+        window.removeEventListener("pointermove", ae), window.removeEventListener("pointerup", ve, !0), l.value = !1, s("end", i.value);
       }
-      return window.addEventListener("pointermove", oe), window.addEventListener("pointerup", ve, !0), !0;
+      return window.addEventListener("pointermove", ae), window.addEventListener("pointerup", ve, !0), !0;
     }
     const p = {
       rotate: '<path d="M22.4789 9.45728L25.9935 12.9942L22.4789 16.5283V14.1032C18.126 14.1502 14.6071 17.6737 14.5675 22.0283H17.05L13.513 25.543L9.97889 22.0283H12.5674C12.6071 16.5691 17.0214 12.1503 22.4789 12.1031L22.4789 9.45728Z" fill="black"/><path fill-rule="evenodd" clip-rule="evenodd" d="M21.4789 7.03223L27.4035 12.9945L21.4789 18.9521V15.1868C18.4798 15.6549 16.1113 18.0273 15.649 21.0284H19.475L13.5128 26.953L7.55519 21.0284H11.6189C12.1243 15.8155 16.2679 11.6677 21.4789 11.1559L21.4789 7.03223ZM22.4789 12.1031C17.0214 12.1503 12.6071 16.5691 12.5674 22.0284H9.97889L13.513 25.543L17.05 22.0284H14.5675C14.5705 21.6896 14.5947 21.3558 14.6386 21.0284C15.1157 17.4741 17.9266 14.6592 21.4789 14.1761C21.8063 14.1316 22.1401 14.1069 22.4789 14.1032V16.5284L25.9935 12.9942L22.4789 9.45729L22.4789 12.1031Z" fill="white"/>',
@@ -5725,7 +5711,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
     function z(m) {
       return m === "move" ? "move" : `url("data:image/svg+xml,${a[m](i.value.rotate ?? 0)}") 16 16, pointer`;
     }
-    function $(m, b, k) {
+    function I(m, b, k) {
       const x = k * Math.PI / 180, w = Math.cos(x), T = Math.sin(x);
       return {
         x: (m.x - b.x) * w - (m.y - b.y) * T + b.x,
@@ -5742,9 +5728,9 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       return Math.sqrt((m.x - b.x) ** 2 + (m.y - b.y) ** 2);
     }
     return He(async () => {
-      const b = Ze()?.proxy?.$el;
+      const b = Qe()?.proxy?.$el;
       if (b && n.initialSize) {
-        await Pe();
+        await Re();
         let k, x;
         const w = getComputedStyle(b);
         if (w.width.endsWith("px") && w.height.endsWith("px") ? (k = Number(w.width.replace("px", "")), x = Number(w.height.replace("px", ""))) : { width: k, height: x } = b.getBoundingClientRect(), k && x)
@@ -5764,12 +5750,12 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       start: f,
       activeHandle: c,
       transforming: l
-    }), (m, b) => (I(), le(Vt(o.tag), {
+    }), (m, b) => (O(), oe(jt(o.tag), {
       class: "mce-transformable",
       style: q(h.value)
     }, {
-      default: re(() => [
-        te(m.$slots, "default", {
+      default: ne(() => [
+        Q(m.$slots, "default", {
           value: S(r),
           moveProps: {
             onPointerdown: f,
@@ -5777,7 +5763,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
           },
           start: f
         }),
-        (I(), R("svg", Ia, [
+        (O(), R("svg", Oa, [
           F("rect", {
             width: "100%",
             height: "100%",
@@ -5789,10 +5775,10 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
               strokeWidth: v.value ? "0.5px" : void 0
             })
           }, null, 4),
-          F("g", Fa, [
-            (I(!0), R(ne, null, _e(u.value.filter((k) => !(!o.resizable && k.type.startsWith("resize") || !o.rotatable && k.type.startsWith("rotate") || !o.moveable && k.type === "move")), (k, x) => (I(), R(ne, { key: x }, [
-              (o.handleStrategy === "point" ? k.type.startsWith("resize") : k.type === "resize-top-left" || k.type === "resize-top-right" || k.type === "resize-bottom-left" || k.type === "resize-bottom-right") ? (I(), R(ne, { key: 0 }, [
-                n.handleShape === "rect" ? (I(), R("rect", {
+          F("g", Ia, [
+            (O(!0), R(se, null, _e(u.value.filter((k) => !(!o.resizable && k.type.startsWith("resize") || !o.rotatable && k.type.startsWith("rotate") || !o.moveable && k.type === "move")), (k, x) => (O(), R(se, { key: x }, [
+              (o.handleStrategy === "point" ? k.type.startsWith("resize") : k.type === "resize-top-left" || k.type === "resize-top-right" || k.type === "resize-bottom-left" || k.type === "resize-bottom-right") ? (O(), R(se, { key: 0 }, [
+                n.handleShape === "rect" ? (O(), R("rect", {
                   key: 0,
                   x: k.x,
                   y: k.y,
@@ -5804,7 +5790,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
                   style: q({
                     opacity: o.visibility === "none" || l.value && o.visibility !== "visible" ? 0 : void 0
                   })
-                }, null, 12, Pa)) : (I(), R("circle", {
+                }, null, 12, Fa)) : (O(), R("circle", {
                   key: 1,
                   cx: k.x + k.width / 2,
                   cy: k.y + k.width / 2,
@@ -5815,8 +5801,8 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
                   style: q({
                     opacity: o.visibility === "none" || l.value && o.visibility !== "visible" ? 0 : void 0
                   })
-                }, null, 12, Na))
-              ], 64)) : Q("", !0),
+                }, null, 12, Pa))
+              ], 64)) : ee("", !0),
               F("rect", {
                 ref_for: !0,
                 ref_key: "handlesRef",
@@ -5832,22 +5818,22 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
                 }),
                 cursor: l.value ? "auto" : z(k.type),
                 onPointerdown: (w) => f(w, x)
-              }, null, 44, Ra)
+              }, null, 44, Na)
             ], 64))), 128))
           ]),
           F("g", {
             "pointer-events": "all",
             style: q(v.value ? { opacity: ".4", strokeWidth: "0.5px" } : void 0)
           }, [
-            te(m.$slots, "svg", { box: i.value })
+            Q(m.$slots, "svg", { box: i.value })
           ], 4)
         ])),
-        y.value ? (I(), R("div", Ba, K(y.value), 1)) : Q("", !0)
+        y.value ? (O(), R("div", Ra, K(y.value), 1)) : ee("", !0)
       ]),
       _: 3
     }, 8, ["style"]));
   }
-}), Da = /* @__PURE__ */ X({
+}), La = /* @__PURE__ */ X({
   inheritAttrs: !1,
   __name: "Selector",
   props: {
@@ -5868,21 +5854,21 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       isFrame: g,
       isLock: h,
       config: v
-    } = de(), y = ue("transformableRef");
-    vt(() => {
+    } = de(), y = ce("transformableRef");
+    gt(() => {
       u({ command: "startTransform", handle: (E) => !!y.value?.start(E) });
     }), we(() => {
       d("startTransform");
     });
-    const f = O(() => {
+    const f = $(() => {
       if (a.value.length !== 1)
         return [];
       const E = [];
       return a.value[0]?.findAncestor((C) => (C instanceof G && E.push(l(C)), !1)), E;
-    }), p = O(() => n.value !== "selecting" && a.value.length === 1 ? [] : a.value.map((E) => ({
+    }), p = $(() => n.value !== "selecting" && a.value.length === 1 ? [] : a.value.map((E) => ({
       name: E.name,
       box: l(E)
-    }))), _ = O(() => l(a.value)), z = O({
+    }))), _ = $(() => l(a.value)), z = $({
       get: () => _.value,
       set: (E) => {
         const C = r.value.zoom, m = _.value, b = {
@@ -5909,14 +5895,14 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
         });
       }
     });
-    function $() {
+    function I() {
       const E = a.value.length === 1 ? a.value[0].style : c(a.value);
       return `${Number(E.width.toFixed(2))} × ${Number(E.height.toFixed(2))}`;
     }
     return e({
       transformable: y
-    }), (E, C) => (I(), R(ne, null, [
-      (I(!0), R(ne, null, _e(f.value, (m, b) => (I(), R("div", {
+    }), (E, C) => (O(), R(se, null, [
+      (O(!0), R(se, null, _e(f.value, (m, b) => (O(), R("div", {
         key: b,
         class: "mce-parent-element-obb",
         style: q({
@@ -5924,15 +5910,15 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
           ...S(Me)(m)
         })
       }, null, 4))), 128)),
-      S(n) === "selecting" ? (I(), R("div", {
+      S(n) === "selecting" ? (O(), R("div", {
         key: 0,
         class: "mce-selected-area",
         style: q({
           borderColor: "currentcolor",
           ...S(Me)(t.selectedArea)
         })
-      }, null, 4)) : Q("", !0),
-      (I(!0), R(ne, null, _e(p.value, (m, b) => (I(), R("div", {
+      }, null, 4)) : ee("", !0),
+      (O(!0), R(se, null, _e(p.value, (m, b) => (O(), R("div", {
         key: b,
         class: "mce-element-obb",
         style: q({
@@ -5940,7 +5926,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
           ...S(Me)(m.box)
         })
       }, null, 4))), 128)),
-      z.value.width && z.value.height ? (I(), le(La, {
+      z.value.width && z.value.height ? (O(), oe(Ba, {
         key: 1,
         ref: "transformableRef",
         modelValue: z.value,
@@ -5951,35 +5937,35 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
         "handle-shape": S(v).handleShape,
         class: "mce-selection-obb",
         "border-style": S(a).length > 1 ? "dashed" : "solid",
-        "tip-format": $,
+        "tip-format": I,
         onMove: C[1] || (C[1] = () => !S(n) && (n.value = "transforming")),
         onEnd: C[2] || (C[2] = () => S(n) === "transforming" && (n.value = void 0))
-      }, ht({ _: 2 }, [
+      }, pt({ _: 2 }, [
         E.$slots.transformable ? {
           name: "svg",
-          fn: re((m) => [
-            te(E.$slots, "transformable", ft(pt(m)))
+          fn: ne((m) => [
+            Q(E.$slots, "transformable", vt(yt(m)))
           ]),
           key: "0"
         } : void 0
-      ]), 1032, ["modelValue", "visibility", "moveable", "resize-strategy", "handle-shape", "border-style"])) : Q("", !0),
-      z.value.width && z.value.height && E.$slots.default ? (I(), R("div", {
+      ]), 1032, ["modelValue", "visibility", "moveable", "resize-strategy", "handle-shape", "border-style"])) : ee("", !0),
+      z.value.width && z.value.height && E.$slots.default ? (O(), R("div", {
         key: 2,
         style: q([{ position: "absolute" }, S(Me)(z.value)])
       }, [
-        te(E.$slots, "default", { box: z.value })
-      ], 4)) : Q("", !0)
+        Q(E.$slots, "default", { box: z.value })
+      ], 4)) : ee("", !0)
     ], 64));
   }
-}), Va = /* @__PURE__ */ X({
+}), Da = /* @__PURE__ */ X({
   __name: "Setup",
   setup(o) {
     return de().setup(), (e, t) => null;
   }
-}), ja = /* @__PURE__ */ X({
+}), Va = /* @__PURE__ */ X({
   __name: "Layout",
   props: {
-    ...ta()
+    ...ea()
   },
   setup(o, { expose: e }) {
     const t = o, {
@@ -5988,19 +5974,19 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       items: a,
       getLayoutItem: r,
       layoutRef: i
-    } = ia(t);
+    } = aa(t);
     return e({
       items: a,
       getLayoutItem: r
-    }), (l, c) => (I(), R("div", {
+    }), (l, c) => (O(), R("div", {
       ref: S(i),
       class: be([S(n)]),
       style: q([S(s)])
     }, [
-      te(l.$slots, "default")
+      Q(l.$slots, "default")
     ], 6));
   }
-}), Rt = /* @__PURE__ */ X({
+}), Bt = /* @__PURE__ */ X({
   __name: "LayoutItem",
   props: {
     position: {
@@ -6012,57 +5998,57 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       default: 300
     },
     modelValue: Boolean,
-    ...na()
+    ...ta()
   },
   setup(o) {
-    const e = o, { layoutItemStyles: t } = sa({
+    const e = o, { layoutItemStyles: t } = oa({
       id: e.name,
-      order: O(() => Number.parseInt(String(e.order), 10)),
-      position: Ee(() => e.position),
-      elementSize: Ee(() => e.size),
-      layoutSize: Ee(() => e.size),
-      active: Ee(() => e.modelValue),
-      absolute: Ee(() => e.absolute)
+      order: $(() => Number.parseInt(String(e.order), 10)),
+      position: Te(() => e.position),
+      elementSize: Te(() => e.size),
+      layoutSize: Te(() => e.size),
+      active: Te(() => e.modelValue),
+      absolute: Te(() => e.absolute)
     });
-    return (n, s) => (I(), R("div", {
+    return (n, s) => (O(), R("div", {
       class: be(["mce-layout-item", [
         `mce-layout-item--${e.position}`
       ]]),
       style: q([S(t)])
     }, [
-      te(n.$slots, "default")
+      Q(n.$slots, "default")
     ], 6));
   }
-}), Ua = {
+}), ja = {
   key: 0,
   class: "mce-main__scroller"
-}, Xa = /* @__PURE__ */ X({
+}, Ua = /* @__PURE__ */ X({
   __name: "Main",
   props: {
     scrollable: Boolean
   },
   setup(o) {
-    const e = o, { mainStyles: t } = oa();
-    return (n, s) => (I(), R("main", {
+    const e = o, { mainStyles: t } = na();
+    return (n, s) => (O(), R("main", {
       class: be(["mce-main", [
         { "mce-main--scrollable": e.scrollable }
       ]]),
       style: q([S(t)])
     }, [
-      e.scrollable ? (I(), R("div", Ua, [
-        te(n.$slots, "default")
-      ])) : te(n.$slots, "default", { key: 1 })
+      e.scrollable ? (O(), R("div", ja, [
+        Q(n.$slots, "default")
+      ])) : Q(n.$slots, "default", { key: 1 })
     ], 6));
   }
-}), Ha = { class: "progress-indicator" }, Ya = {
+}), Xa = { class: "progress-indicator" }, Ha = {
   key: 0,
   class: "progress-indicator__status"
-}, qa = { class: "progress-indicator__bar" }, Ga = {
+}, Ya = { class: "progress-indicator__bar" }, qa = {
   key: 1,
   class: "progress-indicator__bar-indeterminate"
-}, Wa = /* @__PURE__ */ X({
+}, Ga = /* @__PURE__ */ X({
   __name: "ProgressIndicator",
-  props: /* @__PURE__ */ Re({
+  props: /* @__PURE__ */ Oe({
     label: {},
     indeterminate: { type: Boolean }
   }, {
@@ -6071,11 +6057,11 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
   }),
   emits: ["update:modelValue"],
   setup(o) {
-    const e = Ae(o, "modelValue");
-    return (t, n) => (I(), R("div", Ha, [
-      o.label ? (I(), R("span", Ya, K(o.label), 1)) : Q("", !0),
-      F("div", qa, [
-        o.indeterminate ? (I(), R("div", Ga)) : (I(), R("div", {
+    const e = ke(o, "modelValue");
+    return (t, n) => (O(), R("div", Xa, [
+      o.label ? (O(), R("span", Ha, K(o.label), 1)) : ee("", !0),
+      F("div", Ya, [
+        o.indeterminate ? (O(), R("div", qa)) : (O(), R("div", {
           key: 0,
           class: "progress-indicator__bar-fill",
           style: q({ width: `${e.value * 100}%` })
@@ -6088,7 +6074,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
   for (const [n, s] of e)
     t[n] = s;
   return t;
-}, Ka = /* @__PURE__ */ pn(Wa, [["__scopeId", "data-v-c4234331"]]), Ja = { class: "mce-statusbar" }, Za = { class: "mce-statusbar__main" }, Qa = { class: "mce-statusbar__item" }, ei = { class: "mce-statusbar__kbd" }, ti = { class: "mce-statusbar__kbd" }, ni = { class: "mce-statusbar__item" }, oi = { class: "mce-statusbar__kbd" }, si = { class: "mce-statusbar__item" }, ai = { class: "mce-statusbar__item" }, ii = { class: "mce-statusbar__kbd" }, ri = { class: "mce-statusbar__item" }, li = { class: "mce-statusbar__kbd" }, ci = { key: 2 }, ui = { class: "mce-statusbar__item" }, di = { class: "mce-statusbar__item" }, mi = { class: "mce-statusbar__kbd" }, hi = { class: "mce-statusbar__item" }, fi = { class: "mce-statusbar__item" }, pi = { class: "mce-statusbar__kbd" }, vi = { class: "mce-statusbar__item" }, yi = { class: "mce-statusbar__progress" }, gi = /* @__PURE__ */ X({
+}, Wa = /* @__PURE__ */ pn(Ga, [["__scopeId", "data-v-c4234331"]]), Ka = { class: "mce-statusbar" }, Ja = { class: "mce-statusbar__main" }, Za = { class: "mce-statusbar__item" }, Qa = { class: "mce-statusbar__kbd" }, ei = { class: "mce-statusbar__kbd" }, ti = { class: "mce-statusbar__item" }, ni = { class: "mce-statusbar__kbd" }, oi = { class: "mce-statusbar__item" }, si = { class: "mce-statusbar__item" }, ai = { class: "mce-statusbar__kbd" }, ii = { class: "mce-statusbar__item" }, ri = { class: "mce-statusbar__kbd" }, li = { key: 2 }, ci = { class: "mce-statusbar__item" }, ui = { class: "mce-statusbar__item" }, di = { class: "mce-statusbar__kbd" }, mi = { class: "mce-statusbar__item" }, hi = { class: "mce-statusbar__item" }, fi = { class: "mce-statusbar__kbd" }, pi = { class: "mce-statusbar__item" }, vi = { class: "mce-statusbar__progress" }, yi = /* @__PURE__ */ X({
   __name: "Statusbar",
   setup(o) {
     const {
@@ -6098,70 +6084,70 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       exporting: s,
       exportProgress: a
     } = de();
-    return (r, i) => (I(), R("div", Ja, [
-      F("div", Za, [
-        S(e) === "typing" ? (I(), R(ne, { key: 0 }, [
-          F("div", Qa, [
-            F("span", ei, K(S(n)("Command")), 1),
-            F("span", ti, K(S(n)("Enter")), 1)
+    return (r, i) => (O(), R("div", Ka, [
+      F("div", Ja, [
+        S(e) === "typing" ? (O(), R(se, { key: 0 }, [
+          F("div", Za, [
+            F("span", Qa, K(S(n)("Command")), 1),
+            F("span", ei, K(S(n)("Enter")), 1)
           ]),
           i[1] || (i[1] = F("span", null, "/", -1)),
-          F("div", ni, [
-            F("span", oi, K(S(n)("Escape")), 1),
+          F("div", ti, [
+            F("span", ni, K(S(n)("Escape")), 1),
             F("span", null, K(S(t)("commitChanges")), 1)
           ])
-        ], 64)) : S(e) === "transforming" ? (I(), R(ne, { key: 1 }, [
-          F("div", si, [
-            H(Te, { icon: "$mouseRightClick" })
+        ], 64)) : S(e) === "transforming" ? (O(), R(se, { key: 1 }, [
+          F("div", oi, [
+            H(Ae, { icon: "$mouseRightClick" })
           ]),
           i[2] || (i[2] = F("span", null, " / ", -1)),
-          F("div", ai, [
-            F("span", ii, K(S(n)("Escape")), 1),
+          F("div", si, [
+            F("span", ai, K(S(n)("Escape")), 1),
             F("span", null, K(S(t)("cancel")), 1)
           ]),
           i[3] || (i[3] = F("div", { class: "mce-statusbar__divider" }, null, -1)),
-          F("div", ri, [
-            F("span", li, K(S(n)("Shift")), 1),
+          F("div", ii, [
+            F("span", ri, K(S(n)("Shift")), 1),
             F("span", null, K(S(t)("constrainToAxis")), 1)
           ])
-        ], 64)) : S(e) ? (I(), R("span", ci, K(S(t)(S(e))), 1)) : (I(), R(ne, { key: 3 }, [
-          F("div", ui, [
-            H(Te, { icon: "$mouseLeftClick" }),
+        ], 64)) : S(e) ? (O(), R("span", li, K(S(t)(S(e))), 1)) : (O(), R(se, { key: 3 }, [
+          F("div", ci, [
+            H(Ae, { icon: "$mouseLeftClick" }),
             F("span", null, K(S(t)("selectObject")), 1)
           ]),
           i[4] || (i[4] = F("span", null, " + ", -1)),
-          F("div", di, [
-            F("span", mi, K(S(n)("Shift")), 1),
+          F("div", ui, [
+            F("span", di, K(S(n)("Shift")), 1),
             F("span", null, K(S(t)("extend")), 1)
           ]),
           i[5] || (i[5] = F("div", { class: "mce-statusbar__divider" }, null, -1)),
-          F("div", hi, [
-            H(Te, { icon: "$mouseLeftClick" }),
+          F("div", mi, [
+            H(Ae, { icon: "$mouseLeftClick" }),
             F("span", null, K(S(t)("selectArea")), 1)
           ]),
           i[6] || (i[6] = F("span", null, " + ", -1)),
-          F("div", fi, [
-            F("span", pi, K(S(n)("Shift")), 1),
+          F("div", hi, [
+            F("span", fi, K(S(n)("Shift")), 1),
             F("span", null, K(S(t)("extend")), 1)
           ]),
           i[7] || (i[7] = F("div", { class: "mce-statusbar__divider" }, null, -1)),
-          F("div", vi, [
-            H(Te, { icon: "$mouseLeftClick" }),
+          F("div", pi, [
+            H(Ae, { icon: "$mouseLeftClick" }),
             F("span", null, K(S(t)("dragSelected")), 1)
           ])
         ], 64))
       ]),
-      F("div", yi, [
-        S(s) ? (I(), le(Ka, {
+      F("div", vi, [
+        S(s) ? (O(), oe(Wa, {
           key: 0,
           modelValue: S(a),
           "onUpdate:modelValue": i[0] || (i[0] = (l) => Tn(a) ? a.value = l : null),
           label: S(t)("exporting")
-        }, null, 8, ["modelValue", "label"])) : Q("", !0)
+        }, null, 8, ["modelValue", "label"])) : ee("", !0)
       ])
     ]));
   }
-}), bi = /* @__PURE__ */ pn(gi, [["__scopeId", "data-v-36c89bd7"]]), wi = /* @__PURE__ */ X({
+}), gi = /* @__PURE__ */ pn(yi, [["__scopeId", "data-v-36c89bd7"]]), bi = /* @__PURE__ */ X({
   __name: "TextEditor",
   setup(o, { expose: e }) {
     const {
@@ -6173,13 +6159,13 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       registerCommand: i,
       unregisterCommand: l,
       camera: c
-    } = de(), u = V(), d = O(() => {
+    } = de(), u = V(), d = $(() => {
       const { zoom: f, position: p } = c.value;
       return {
         transformOrigin: "left top",
         transform: `translate(${p.x}px, ${p.y}px) scale(${f.x}, ${f.y})`
       };
-    }), g = O(() => {
+    }), g = $(() => {
       const f = t.value[0], p = r(f), _ = f?.text.base?.boundingBox;
       return _ && (p.left += _.left, p.top += _.top), {
         ...Me(p)
@@ -6198,11 +6184,11 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
         return !1;
       p.text.isValid() || p.text.setContent(" "), p.text.update(), n.value = "typing";
       const _ = u.value;
-      return _.set(p.text.base), await Pe(), _.pointerdown(f);
+      return _.set(p.text.base), await Re(), _.pointerdown(f);
     }
-    return vt(() => i({ command: "startTyping", handle: y })), we(() => l("startTyping")), e({
+    return gt(() => i({ command: "startTyping", handle: y })), we(() => l("startTyping")), e({
       textEditor: u
-    }), (f, p) => ze((I(), R("div", {
+    }), (f, p) => ze((O(), R("div", {
       class: "mce-text-editor",
       style: q({
         ...d.value
@@ -6230,24 +6216,24 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       [Xe, S(t)[0] && S(n) === "typing"]
     ]);
   }
-}), xi = { class: "mce-payhead" }, _i = /* @__PURE__ */ X({
+}), wi = { class: "mce-payhead" }, xi = /* @__PURE__ */ X({
   __name: "Playhead",
   setup(o) {
-    return (e, t) => (I(), R("div", xi, [...t[0] || (t[0] = [
+    return (e, t) => (O(), R("div", wi, [...t[0] || (t[0] = [
       F("header", { class: "mce-payhead__header" }, null, -1),
       F("main", { class: "mce-payhead__main" }, null, -1)
     ])]));
   }
-}), ki = {
+}), _i = {
   key: 0,
   class: "mce-segment__edge mce-segment__edge--front"
-}, Ci = {
+}, ki = {
   class: "mce-segment__node",
   style: { overflow: "hidden" }
-}, Ei = {
+}, Ci = {
   key: 1,
   class: "mce-segment__edge mce-segment__edge--end"
-}, Ti = /* @__PURE__ */ X({
+}, Ei = /* @__PURE__ */ X({
   __name: "Segment",
   props: {
     node: {},
@@ -6255,46 +6241,46 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
     active: { type: Boolean }
   },
   setup(o) {
-    const e = o, t = O(() => {
+    const e = o, t = $(() => {
       const n = { left: 0, top: 0, width: 0 };
       return n.left = e.node.delay / e.msPerPx, n.width = e.node.duration / e.msPerPx, n.width ? n.width = `${n.width}px` : n.width = "100%", {
         width: n.width,
         transform: `matrix(1, 0, 0, 1, ${n.left}, ${n.top})`
       };
     });
-    return (n, s) => (I(), R("div", {
+    return (n, s) => (O(), R("div", {
       class: be(["mce-segment", [
         `mce-segment--${o.node.meta.inEditorIs}`,
         o.active && "mce-segment--active"
       ]]),
       style: q(t.value)
     }, [
-      o.active ? (I(), R("div", ki)) : Q("", !0),
-      F("span", Ci, K(e.node.name), 1),
-      o.active ? (I(), R("div", Ei)) : Q("", !0)
+      o.active ? (O(), R("div", _i)) : ee("", !0),
+      F("span", ki, K(e.node.name), 1),
+      o.active ? (O(), R("div", Ci)) : ee("", !0)
     ], 6));
   }
-}), Ai = { class: "mce-track" }, Si = /* @__PURE__ */ X({
+}), Ti = { class: "mce-track" }, Ai = /* @__PURE__ */ X({
   __name: "Track",
   setup(o) {
-    return (e, t) => (I(), R("div", Ai, [
-      te(e.$slots, "default")
+    return (e, t) => (O(), R("div", Ti, [
+      Q(e.$slots, "default")
     ]));
   }
-}), Mi = /* @__PURE__ */ X({
+}), Si = /* @__PURE__ */ X({
   __name: "Trackhead",
   props: {
     node: {}
   },
   setup(o) {
-    return (e, t) => (I(), R("div", {
+    return (e, t) => (O(), R("div", {
       class: "mce-trackhead",
       style: q({
         height: `var(--timeline-track-height__${o.node.meta.inEditorIs}, 22px)`
       })
     }, K(o.node.meta.inEditorIs), 5));
   }
-}), zi = { class: "mce-timeline__toolbar" }, Oi = { class: "mce-timeline__main" }, $i = { class: "mce-timeline__left" }, Ii = { class: "mce-timeline__left-wrapper" }, Fi = { class: "mce-timeline__right-wrapper" }, Pi = { class: "mce-timeline__ruler" }, Ni = { class: "mce-timeline__track" }, Ri = 0.02, Bi = /* @__PURE__ */ X({
+}), Mi = { class: "mce-timeline__toolbar" }, zi = { class: "mce-timeline__main" }, $i = { class: "mce-timeline__left" }, Oi = { class: "mce-timeline__left-wrapper" }, Ii = { class: "mce-timeline__right-wrapper" }, Fi = { class: "mce-timeline__ruler" }, Pi = { class: "mce-timeline__track" }, Ni = 0.02, Ri = /* @__PURE__ */ X({
   __name: "Timeline",
   setup(o) {
     const {
@@ -6304,12 +6290,12 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       timeline: s,
       endTime: a,
       selection: r
-    } = de(), i = V(1e3 / 30), l = ue("rulerTpl"), c = V(!0), u = V([0, 0]), d = O(() => e.value?.findAll((z) => !!(z instanceof G && z.children.some(($) => $ instanceof Ln))) ?? []);
+    } = de(), i = V(1e3 / 30), l = ce("rulerTpl"), c = V(!0), u = V([0, 0]), d = $(() => e.value?.findAll((z) => !!(z instanceof G && z.children.some((I) => I instanceof Ln))) ?? []);
     function g(z) {
       if (z.ctrlKey) {
         if (!(z.wheelDeltaY ? Math.abs(Math.abs(z.wheelDeltaY) - Math.abs(3 * z.deltaY)) < 3 : z.deltaMode === 0)) {
           z.preventDefault();
-          const E = t.value, C = Math.log(E), m = -z.deltaY * Ri, b = C + m;
+          const E = t.value, C = Math.log(E), m = -z.deltaY * Ni, b = C + m;
           t.value = Math.exp(b);
         }
       } else
@@ -6319,11 +6305,11 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
         ];
     }
     function h(z) {
-      const $ = l.value?.box;
-      if ($) {
-        n.value = (z.clientX - $.left + u.value[0]) * t.value;
+      const I = l.value?.box;
+      if (I) {
+        n.value = (z.clientX - I.left + u.value[0]) * t.value;
         const E = (m) => {
-          n.value = (m.clientX - $.left + u.value[0]) * t.value;
+          n.value = (m.clientX - I.left + u.value[0]) * t.value;
         }, C = () => {
           window.removeEventListener("mousemove", E), window.removeEventListener("mouseup", C);
         };
@@ -6332,7 +6318,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
     }
     function v(z) {
       if (z % 30 === 0) {
-        const $ = Math.floor(z / 30 / 60), E = Math.floor(z / 30) % 60, C = String($).padStart(2, "0"), m = String(E).padStart(2, "0");
+        const I = Math.floor(z / 30 / 60), E = Math.floor(z / 30) % 60, C = String(I).padStart(2, "0"), m = String(E).padStart(2, "0");
         return `${C}:${m}`;
       }
       return `${Math.floor(z % 30)}f`;
@@ -6341,10 +6327,10 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
     function f() {
       c.value = !1;
       let z;
-      function $(E) {
-        z !== void 0 && E !== void 0 && s.value.addTime(E - z), z = E, y = requestAnimationFrame($);
+      function I(E) {
+        z !== void 0 && E !== void 0 && s.value.addTime(E - z), z = E, y = requestAnimationFrame(I);
       }
-      $();
+      I();
     }
     function p() {
       c.value = !0, y !== void 0 && (cancelAnimationFrame(y), y = void 0);
@@ -6352,30 +6338,30 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
     function _() {
       c.value ? f() : p();
     }
-    return we(p), (z, $) => (I(), R("div", {
+    return we(p), (z, I) => (O(), R("div", {
       class: "mce-timeline",
-      onWheel: $[0] || ($[0] = We(() => {
+      onWheel: I[0] || (I[0] = Ke(() => {
       }, ["prevent"]))
     }, [
-      F("div", zi, [
+      F("div", Mi, [
         F("div", {
           class: "mce-timeline__play",
           onClick: _
         }, [
-          H(Te, {
+          H(Ae, {
             icon: c.value ? "$play" : "$pause"
           }, null, 8, ["icon"])
         ])
       ]),
-      F("div", Oi, [
+      F("div", zi, [
         F("div", $i, [
-          F("div", Ii, [
+          F("div", Oi, [
             F("div", {
               style: q({
                 transform: `translateY(${u.value[1]}px)`
               })
             }, [
-              (I(!0), R(ne, null, _e(d.value, (E, C) => (I(), le(Mi, {
+              (O(!0), R(se, null, _e(d.value, (E, C) => (O(), oe(Si, {
                 key: C,
                 node: E
               }, null, 8, ["node"]))), 128))
@@ -6387,9 +6373,9 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
           onWheel: g,
           onMousedown: h
         }, [
-          F("div", Fi, [
-            F("div", Pi, [
-              H(mt, {
+          F("div", Ii, [
+            F("div", Fi, [
+              H(ft, {
                 ref: "rulerTpl",
                 zoom: 1 / S(t) * i.value,
                 unit: 100,
@@ -6399,27 +6385,27 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
                 "label-format": v
               }, null, 8, ["zoom", "position"])
             ]),
-            F("div", Ni, [
+            F("div", Pi, [
               F("div", {
                 style: q({
                   width: `${S(a) / S(t)}px`,
                   transform: `translate(${u.value[0]}px, ${u.value[1]}px)`
                 })
               }, [
-                (I(!0), R(ne, null, _e(d.value, (E, C) => (I(), le(Si, { key: C }, {
-                  default: re(() => [
-                    H(Ti, {
+                (O(!0), R(se, null, _e(d.value, (E, C) => (O(), oe(Ai, { key: C }, {
+                  default: ne(() => [
+                    H(Ei, {
                       node: E,
                       "ms-per-px": S(t),
                       active: S(r).some((m) => m.equal(E)),
-                      onMousedown: We((m) => r.value = [E], ["stop"])
+                      onMousedown: Ke((m) => r.value = [E], ["stop"])
                     }, null, 8, ["node", "ms-per-px", "active", "onMousedown"])
                   ]),
                   _: 2
                 }, 1024))), 128))
               ], 4)
             ]),
-            H(_i, {
+            H(xi, {
               style: q({
                 transform: `translate(${u.value[0] + Math.ceil(S(n) / S(t))}px, 0px)`
               })
@@ -6429,19 +6415,19 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       ])
     ], 32));
   }
-}), Li = ["data-pixel-ratio"], Di = {
+}), Bi = ["data-pixel-ratio"], Li = {
   ref: "canvasTpl",
   class: "mce-editor__canvas"
-}, Vi = {
+}, Di = {
   ref: "overlayContainerTpl",
   class: "mce-editor__overlay-container"
-}, sr = /* @__PURE__ */ X({
+}, or = /* @__PURE__ */ X({
   __name: "EditorLayout",
   props: {
-    ...Gs({
-      resizeStrategy: Ws,
-      activeStrategy: Ks,
-      hoverStrategy: Js
+    ...qs({
+      resizeStrategy: Gs,
+      activeStrategy: Ws,
+      hoverStrategy: Ks
     }),
     editor: Le
   },
@@ -6449,7 +6435,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
   setup(o, { emit: e }) {
     const t = o, n = e;
     let s;
-    t.editor ? s = Ls(t.editor) : s = de(), De(mn, Us());
+    t.editor ? s = Bs(t.editor) : s = de(), De(mn, js());
     const {
       config: a,
       drawboardDom: r,
@@ -6466,14 +6452,14 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
       selection: p,
       getAabbInDrawboard: _,
       drawboardAabb: z,
-      drawboardPointer: $
-    } = s, E = ue("overlayContainerTpl"), C = ue("canvasTpl"), m = ue("selectorTpl"), b = ue("textEditorTpl"), k = V({ left: 0, top: 0, width: 0, height: 0 });
-    Ys({
-      attach: O(() => E.value)
-    }), Xt(C, (A) => {
+      drawboardPointer: I
+    } = s, E = ce("overlayContainerTpl"), C = ce("canvasTpl"), m = ce("selectorTpl"), b = ce("textEditorTpl"), k = V({ left: 0, top: 0, width: 0, height: 0 });
+    Hs({
+      attach: $(() => E.value)
+    }), Ht(C, (A) => {
       const { width: N, height: L } = A[0].contentRect;
       i.value.resize(N, L);
-    }), vt(() => {
+    }), gt(() => {
       i.value.on("pointerdown", T), i.value.on("pointermove", M), i.value.on("pointerover", P);
     }), He(() => {
       c(C.value, r.value);
@@ -6485,7 +6471,7 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
     }
     function w(A) {
       let N, L;
-      if (Ct(
+      if (Et(
         { x: A.clientX, y: A.clientY },
         _(p.value)
       ))
@@ -6506,32 +6492,32 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
         return;
       const N = p.value[0], L = A.target, j = { x: A.clientX, y: A.clientY };
       let D = { ...j }, U = !1, W = !1, Z = [], he;
-      const Y = Ct({
+      const Y = Et({
         x: j.x + -z.value.left,
         y: j.y + -z.value.top
       }, _(p.value));
       if (A.button === 2) {
         if (!Y) {
-          const ee = t.activeStrategy({
+          const te = t.activeStrategy({
             element: L,
             oldElement: N,
             event: A,
             isExcluded: x
           });
-          ee && !(ee instanceof G) ? Z = ee.element ? [ee.element] : [] : Z = ee ? [ee] : [], p.value = Z;
+          te && !(te instanceof G) ? Z = te.element ? [te.element] : [] : Z = te ? [te] : [], p.value = Z;
         }
         return;
       }
-      function xe(ee) {
-        const se = t.activeStrategy({
+      function xe(te) {
+        const ie = t.activeStrategy({
           element: L,
           oldElement: N,
-          event: ee,
+          event: te,
           isExcluded: x
         });
-        se && !(se instanceof G) ? Z = se.element ? [se.element] : [] : Z = se ? [se] : [], p.value = Z;
+        ie && !(ie instanceof G) ? Z = ie.element ? [ie.element] : [] : Z = ie ? [ie] : [], p.value = Z;
       }
-      function oe() {
+      function ae() {
         d.value !== "selecting" && (d.value = "selecting"), k.value = {
           left: Math.min(j.x, D.x) - z.value.left,
           top: Math.min(j.y, D.y) - z.value.top,
@@ -6540,55 +6526,55 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
         }, Z = v(k.value);
       }
       function ve() {
-        const ee = t.activeStrategy({
+        const te = t.activeStrategy({
           element: L,
           oldElement: N,
           event: A,
           isExcluded: () => !1
         });
-        let se;
-        ee && !(ee instanceof G) ? (se = ee.element, he = ee.state) : se = ee, se && (A?.ctrlKey || A?.shiftKey || A?.metaKey) ? p.value.findIndex((ge) => ge.equal(se)) > -1 ? Z = p.value.filter((ge) => !ge.equal(se)) : Z = [...p.value, se] : Z = se ? [se] : [];
+        let ie;
+        te && !(te instanceof G) ? (ie = te.element, he = te.state) : ie = te, ie && (A?.ctrlKey || A?.shiftKey || A?.metaKey) ? p.value.findIndex((ge) => ge.equal(ie)) > -1 ? Z = p.value.filter((ge) => !ge.equal(ie)) : Z = [...p.value, ie] : Z = ie ? [ie] : [];
       }
       function ye() {
         return !U && (Math.abs(D.x - j.x) >= 3 || Math.abs(D.y - j.y) >= 3);
       }
-      function J(ee) {
-        Y ? ye() && (U = !0, y("startTransform")) : L && !h(L) && ye() && (U = !0, xe(ee), Pe(() => {
+      function J(te) {
+        Y ? ye() && (U = !0, y("startTransform")) : L && !h(L) && ye() && (U = !0, xe(te), Re(() => {
           W || y("startTransform");
         }));
       }
-      function me(ee) {
-        D = { x: ee.clientX, y: ee.clientY }, Y || (!L || h(L)) && oe();
+      function me(te) {
+        D = { x: te.clientX, y: te.clientY }, Y || (!L || h(L)) && ae();
       }
-      async function ce(ee) {
+      async function ue(te) {
         if (d.value && (d.value = void 0), !U) {
           if (L && ve(), p.value = Z, he && Z[0] && !f(Z[0]))
             switch (he) {
               case "typing": {
-                await y("startTyping", ee);
+                await y("startTyping", te);
                 break;
               }
             }
           w(A);
         }
-        i.value.off("pointermove", J), document.removeEventListener("pointermove", me), document.removeEventListener("pointerup", ce), W = !0;
+        i.value.off("pointermove", J), document.removeEventListener("pointermove", me), document.removeEventListener("pointerup", ue), W = !0;
       }
-      i.value.on("pointermove", J), document.addEventListener("pointermove", me), document.addEventListener("pointerup", ce);
+      i.value.on("pointermove", J), document.addEventListener("pointermove", me), document.addEventListener("pointerup", ue);
     }
     function M(A) {
-      A.srcElement === r.value && ($.value = { x: A.clientX, y: A.clientY }, !(l.value.grabbing || A.button === 1 || d.value && d.value !== "typing") && w(A));
+      A.srcElement === r.value && (I.value = { x: A.clientX, y: A.clientY }, !(l.value.grabbing || A.button === 1 || d.value && d.value !== "typing") && w(A));
     }
     function P() {
-      $.value = void 0, u.value = void 0, g(void 0);
+      I.value = void 0, u.value = void 0, g(void 0);
     }
     function B() {
       r.value && (r.value.scrollLeft && (r.value.scrollLeft = 0), r.value.scrollTop && (r.value.scrollTop = 0));
     }
-    return (A, N) => (I(), le(ja, { class: "mce-editor" }, {
-      default: re(() => [
-        H(Va),
-        H(Xa, null, {
-          default: re(() => [
+    return (A, N) => (O(), oe(Va, { class: "mce-editor" }, {
+      default: ne(() => [
+        H(Da),
+        H(Ua, null, {
+          default: ne(() => [
             F("div", {
               ref_key: "drawboardDom",
               ref: r,
@@ -6596,137 +6582,181 @@ const Ft = Symbol.for("MceMenuSymbol"), Te = /* @__PURE__ */ X({
               "data-pixel-ratio": S(i).pixelRatio,
               onDblclick: N[0] || (N[0] = (L) => n("dblclick:drawboard", L)),
               onScroll: B,
-              onWheel: N[1] || (N[1] = We(() => {
+              onWheel: N[1] || (N[1] = Ke(() => {
               }, ["prevent"]))
             }, [
-              F("canvas", Di, null, 512),
-              H(wi, { ref: "textEditorTpl" }, null, 512),
-              H(Qs),
-              H(ka),
-              H(wa),
-              H(ya),
-              H(Da, {
+              F("canvas", Li, null, 512),
+              H(bi, { ref: "textEditorTpl" }, null, 512),
+              H(Zs),
+              H(_a),
+              H(ba),
+              H(va),
+              H(La, {
                 ref: "selectorTpl",
                 "selected-area": k.value,
                 "resize-strategy": S(p)[0] ? t.resizeStrategy(S(p)[0]) : void 0
               }, {
-                transformable: re(({ box: L }) => [
-                  te(A.$slots, "transformer", { box: L })
+                transformable: ne(({ box: L }) => [
+                  Q(A.$slots, "transformer", { box: L })
                 ]),
-                default: re(({ box: L }) => [
-                  te(A.$slots, "selector", { box: L })
+                default: ne(({ box: L }) => [
+                  Q(A.$slots, "selector", { box: L })
                 ]),
                 _: 3
               }, 8, ["selected-area", "resize-strategy"]),
-              S(a).scrollbar ? (I(), le($a, { key: 0 })) : Q("", !0),
-              A.$slots.floatbar ? (I(), le(ga, {
+              S(a).scrollbar ? (O(), oe($a, { key: 0 })) : ee("", !0),
+              A.$slots.floatbar ? (O(), oe(ya, {
                 key: 1,
                 target: S(d) === "typing" ? b.value?.textEditor : m.value?.transformable?.$el
               }, {
-                default: re(() => [
-                  te(A.$slots, "floatbar")
+                default: ne(() => [
+                  Q(A.$slots, "floatbar")
                 ]),
                 _: 3
-              }, 8, ["target"])) : Q("", !0),
-              H(pa),
-              H(xa),
-              S(a).ruler ? (I(), le(Ma, { key: 2 })) : Q("", !0),
-              te(A.$slots, "drawboard")
-            ], 40, Li)
+              }, 8, ["target"])) : ee("", !0),
+              H(fa),
+              H(wa),
+              S(a).ruler ? (O(), oe(Sa, { key: 2 })) : ee("", !0),
+              Q(A.$slots, "drawboard")
+            ], 40, Bi)
           ]),
           _: 3
         }),
-        te(A.$slots, "default"),
-        H(Rt, {
+        Q(A.$slots, "default"),
+        H(Bt, {
           modelValue: S(a).statusbar,
           "onUpdate:modelValue": N[2] || (N[2] = (L) => S(a).statusbar = L),
           position: "bottom",
           size: 24
         }, {
-          default: re(() => [
-            H(bi)
+          default: ne(() => [
+            H(gi)
           ]),
           _: 1
         }, 8, ["modelValue"]),
-        H(Rt, {
+        H(Bt, {
           modelValue: S(a).timeline,
           "onUpdate:modelValue": N[3] || (N[3] = (L) => S(a).timeline = L),
           position: "bottom",
           size: 160
         }, {
-          default: re(() => [
-            H(Bi)
+          default: ne(() => [
+            H(Ri)
           ]),
           _: 1
         }, 8, ["modelValue"]),
-        F("div", Vi, null, 512)
+        F("div", Di, null, 512)
       ]),
       _: 3
     }));
   }
+}), sr = /* @__PURE__ */ X({
+  __name: "Dialog",
+  props: /* @__PURE__ */ Oe({
+    ...qe()
+  }, {
+    modelValue: { type: Boolean },
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(o, { expose: e }) {
+    const t = o, n = ke(o, "modelValue"), s = ce("overlayTpl"), a = $(() => ({
+      onClick: () => n.value = !0
+    }));
+    function r() {
+      s.value?.updateLocation();
+    }
+    return e({
+      isActive: n,
+      updateLocation: r
+    }), (i, l) => (O(), oe(ot, {
+      ref: "overlayTpl",
+      modelValue: n.value,
+      "onUpdate:modelValue": l[0] || (l[0] = (c) => n.value = c),
+      location: t.location,
+      offset: t.offset,
+      target: t.target,
+      attach: t.attach,
+      class: "mce-dialog"
+    }, {
+      activator: ne((c) => [
+        Q(i.$slots, "activator", $e(c, {
+          props: { ...c.props, ...a.value }
+        }))
+      ]),
+      default: ne(() => [
+        Q(i.$slots, "default")
+      ]),
+      _: 3
+    }, 8, ["modelValue", "location", "offset", "target", "attach"]));
+  }
 });
 export {
+  sr as Dialog,
   un as Doc,
   Le as Editor,
-  sr as EditorLayout,
-  Rt as EditorLayoutItem,
+  or as EditorLayout,
+  Bt as EditorLayoutItem,
   mn as IconsSymbol,
-  $t as MceComponentIcon,
+  It as MceComponentIcon,
   fn as MceLayoutItemKey,
-  Ke as MceLayoutKey,
-  Ft as MceMenuSymbol,
-  dt as MceOverlaySymbol,
+  Je as MceLayoutKey,
+  Pt as MceMenuSymbol,
+  ht as MceOverlaySymbol,
   dn as MceSvgIcon,
+  da as Menu,
   ln as Model,
-  Et as SUPPORTS_CLIPBOARD,
-  La as Transformable,
-  Zt as USER_AGENT,
-  tt as Workspace,
+  ft as Ruler,
+  Tt as SUPPORTS_CLIPBOARD,
+  Rt as Scrollbar,
+  Ba as Transformable,
+  Qt as USER_AGENT,
+  nt as Workspace,
   Me as boundingBoxToStyle,
-  er as consoleError,
+  Qi as consoleError,
   uo as consoleWarn,
-  qe as convertToUnit,
-  Us as createIcons,
-  ct as createImageElement,
-  ia as createLayout,
-  lt as createTextElement,
-  Ks as defaultActiveStrategy,
-  Js as defaultHoverStrategy,
-  Ws as defaultResizeStrategy,
-  or as defineMixin,
-  nr as definePlugin,
+  Ge as convertToUnit,
+  js as createIcons,
+  dt as createImageElement,
+  aa as createLayout,
+  ut as createTextElement,
+  Ws as defaultActiveStrategy,
+  Ks as defaultHoverStrategy,
+  Gs as defaultResizeStrategy,
+  nr as defineMixin,
+  tr as definePlugin,
   je as findChildrenWithProvide,
   ho as getImageSizeFromUrl,
   go as getRandomValues,
   cn as iElementToYElements,
-  en as imageExtRe,
-  Qt as imageExts,
+  ct as imageExtRe,
+  en as imageExts,
   fo as imageMimeTypeExtMap,
   po as isClickInsideElement,
-  $e as isMac,
+  Fe as isMac,
   Be as isOverlappingAabb,
   co as isOverlappingObb,
-  Ct as isPointInsideAabb,
+  Et as isPointInsideAabb,
   mo as isWindows,
-  wt as makeIconProps,
-  na as makeLayoutItemProps,
-  ta as makeLayoutProps,
-  nt as makeMceOverlayProps,
-  Gs as makeMceStrategyProps,
-  Qi as minBoundingBox,
+  _t as makeIconProps,
+  ta as makeLayoutItemProps,
+  ea as makeLayoutProps,
+  qe as makeMceOverlayProps,
+  qs as makeMceStrategyProps,
+  Zi as minBoundingBox,
   os as mixins,
-  Bs as plugins,
+  Rs as plugins,
   tn as propsFactory,
-  Ls as provideEditor,
-  Ys as provideOverlay,
+  Bs as provideEditor,
+  Hs as provideOverlay,
   vo as refElement,
   yo as templateRef,
   bo as uint32,
   de as useEditor,
-  Ds as useIcon,
-  oa as useLayout,
-  sa as useLayoutItem,
-  qs as useOverlay,
-  ea as useResizeObserver,
-  tr as uuidv4
+  Ls as useIcon,
+  na as useLayout,
+  oa as useLayoutItem,
+  Ys as useOverlay,
+  Qs as useResizeObserver,
+  er as uuidv4
 };