sykpcomposer 1.20.124 → 1.20.126

package/dist/{ImageComponent-5923c11d.js → ImageComponent-462c3315.js}

@@ -1,9 +1,9 @@
-import { j as b, u as de, a as se, x as F, $ as T, w as Z, d as V, b as te, c as le, e as ue, f as ge, C as B, g as pe, k as we, h as me, I as fe, r as ye, i as xe, l as Ce, L as ve, P as De, m as be, t as Re } from "./index-fde88807.js";
-import { d as Ee } from "./LexicalNestedComposer.prod-5fe44982.js";
-import C, { useRef as L, PureComponent as Me, createRef as ne, useState as G, useCallback as U, useEffect as q, Suspense as Pe } from "react";
+import { j as b, u as de, a as ae, x as T, $ as G, w as ee, d as q, b as ne, c as le, e as ge, f as ue, C as B, g as pe, k as me, h as we, I as fe, r as xe, i as ye, l as Ce, L as ve, P as De, m as be, t as Re } from "./index-c6d40f36.js";
+import { d as Ee } from "./LexicalNestedComposer.prod-fd8d53c1.js";
+import C, { useRef as j, PureComponent as Me, createRef as re, useState as V, useCallback as F, useEffect as J, Suspense as He } from "react";
 import "react-dom";
-function ee(u, t, e) {
-  return Math.min(Math.max(u, t), e);
+function te(g, t, e) {
+  return Math.min(Math.max(g, t), e);
 }
 const v = {
   east: 1,
@@ -11,8 +11,8 @@ const v = {
   south: 2,
   west: 4
 };
-function ke({
-  onResizeStart: u,
+function Pe({
+  onResizeStart: g,
   onResizeEnd: t,
   buttonRef: e,
   imageRef: o,
@@ -22,10 +22,10 @@ function ke({
   setShowCaption: p,
   enableCaptions: s
 }) {
-  const i = L(null), l = L({
+  const i = j(null), l = j({
     priority: "",
     value: "default"
-  }), h = L({
+  }), h = j({
     currentHeight: 0,
     currentWidth: 0,
     direction: 0,
@@ -35,15 +35,15 @@ function ke({
     startWidth: 0,
     startX: 0,
     startY: 0
-  }), d = r.getRootElement(), c = d !== null ? d.getBoundingClientRect().width - 20 : 100, R = d !== null ? d.getBoundingClientRect().height - 20 : 100, M = 100, H = 100, w = (g) => {
-    const m = g === v.east || g === v.west, f = g === v.north || g === v.south, $ = g & v.north && g & v.west || g & v.south && g & v.east, k = m ? "ew" : f ? "ns" : $ ? "nwse" : "nesw";
+  }), d = r.getRootElement(), c = d !== null ? d.getBoundingClientRect().width - 20 : 100, R = d !== null ? d.getBoundingClientRect().height - 20 : 100, H = 100, k = 100, m = (u) => {
+    const f = u === v.east || u === v.west, w = u === v.north || u === v.south, $ = u & v.north && u & v.west || u & v.south && u & v.east, P = f ? "ew" : w ? "ns" : $ ? "nwse" : "nesw";
     d !== null && d.style.setProperty(
       "cursor",
-      `${k}-resize`,
+      `${P}-resize`,
       "important"
     ), document.body !== null && (document.body.style.setProperty(
       "cursor",
-      `${k}-resize`,
+      `${P}-resize`,
       "important"
     ), l.current.value = document.body.style.getPropertyValue(
       "-webkit-user-select"
@@ -54,59 +54,64 @@ function ke({
       "none",
       "important"
     ));
-  }, j = () => {
+  }, A = () => {
     d !== null && d.style.setProperty("cursor", "text"), document.body !== null && (document.body.style.setProperty("cursor", "default"), document.body.style.setProperty(
       "-webkit-user-select",
       l.current.value,
       l.current.priority
     ));
-  }, N = (g, m) => {
+  }, N = (u, f) => {
     if (!r.isEditable())
       return;
-    const f = o.current, $ = i.current;
-    if (f !== null && $ !== null) {
-      g.preventDefault();
-      const { width: k, height: x } = f.getBoundingClientRect(), D = h.current;
-      D.startWidth = k, D.startHeight = x, D.ratio = k / x, D.currentWidth = k, D.currentHeight = x, D.startX = g.clientX, D.startY = g.clientY, D.isResizing = !0, D.direction = m, w(m), u(), $.classList.add("image-control-wrapper--resizing"), f.style.height = `${x}px`, f.style.width = `${k}px`, document.addEventListener("pointermove", S), document.addEventListener("pointerup", P);
+    const w = o.current, $ = i.current;
+    if (w !== null && $ !== null) {
+      u.preventDefault();
+      const { width: P, height: y } = w.getBoundingClientRect(), D = h.current;
+      D.startWidth = P, D.startHeight = y, D.ratio = P / y, D.currentWidth = P, D.currentHeight = y, D.startX = u.clientX, D.startY = u.clientY, D.isResizing = !0, D.direction = f, m(f), g(), $.classList.add("image-control-wrapper--resizing"), w.style.height = `${y}px`, w.style.width = `${P}px`, document.addEventListener("pointermove", S), document.addEventListener("pointerup", E);
     }
-  }, S = (g) => {
-    const m = o.current, f = h.current, $ = f.direction & (v.east | v.west), k = f.direction & (v.south | v.north);
-    if (m !== null && f.isResizing) {
-      if ($ && k) {
-        let x = Math.floor(f.startX - g.clientX);
-        x = f.direction & v.east ? -x : x;
-        const D = ee(
-          f.startWidth + x,
-          M,
-          c
-        ), A = D / f.ratio;
-        m.style.width = `${D}px`, m.style.height = `${A}px`, f.currentHeight = A, f.currentWidth = D;
-      } else if (k) {
-        let x = Math.floor(f.startY - g.clientY);
-        x = f.direction & v.south ? -x : x;
-        const D = ee(
-          f.startHeight + x,
+  }, S = (u) => {
+    const f = o.current, w = h.current, $ = w.direction & (v.east | v.west), P = w.direction & (v.south | v.north);
+    if (f !== null && w.isResizing) {
+      if ($ && P) {
+        let y = Math.floor(w.startX - u.clientX);
+        y = w.direction & v.east ? -y : y;
+        const D = te(
+          w.startWidth + y,
           H,
-          R
-        );
-        m.style.height = `${D}px`, m.style.maxHeight = `${D}px`, f.currentHeight = D;
+          c
+        ), _ = D / w.ratio;
+        if (_ > 600) {
+          alert("Image height cannot be greater than 600px."), E();
+          return;
+        }
+        f.style.width = `${D}px`, f.style.height = `${_}px`, w.currentHeight = _, w.currentWidth = D;
+      } else if (P) {
+        let y = Math.floor(w.startY - u.clientY);
+        y = w.direction & v.south ? -y : y;
+        const D = w.startHeight + y;
+        if (D > w.startHeight && D > 600) {
+          alert("Image height cannot be greater than 600px."), E();
+          return;
+        }
+        const U = te(D, k, R);
+        f.style.height = `${U}px`, f.style.maxHeight = `${U}px`, w.currentHeight = U;
       } else {
-        let x = Math.floor(f.startX - g.clientX);
-        x = f.direction & v.east ? -x : x;
-        const D = ee(
-          f.startWidth + x,
-          M,
+        let y = Math.floor(w.startX - u.clientX);
+        y = w.direction & v.east ? -y : y;
+        const D = te(
+          w.startWidth + y,
+          H,
           c
         );
-        m.style.width = `${D}px`, m.style.maxWidth = `${D}px`, f.currentWidth = D;
+        f.style.width = `${D}px`, f.style.maxWidth = `${D}px`, w.currentWidth = D;
       }
-      m && (m.setAttribute("width", `${f.currentWidth}`), m.setAttribute("height", `${f.currentHeight}`));
+      f && (f.setAttribute("width", `${w.currentWidth}`), f.setAttribute("height", `${w.currentHeight}`));
     }
-  }, P = () => {
-    const g = o.current, m = h.current, f = i.current;
-    if (g !== null && f !== null && m.isResizing) {
-      const $ = m.currentWidth, k = m.currentHeight;
-      m.startWidth = 0, m.startHeight = 0, m.ratio = 0, m.startX = 0, m.startY = 0, m.currentWidth = 0, m.currentHeight = 0, m.isResizing = !1, f.classList.remove("image-control-wrapper--resizing"), j(), t($, k), document.removeEventListener("pointermove", S), document.removeEventListener("pointerup", P);
+  }, E = () => {
+    const u = o.current, f = h.current, w = i.current;
+    if (u !== null && w !== null && f.isResizing) {
+      const $ = f.currentWidth, P = f.currentHeight;
+      f.startWidth = 0, f.startHeight = 0, f.ratio = 0, f.startX = 0, f.startY = 0, f.currentWidth = 0, f.currentHeight = 0, f.isResizing = !1, w.classList.remove("image-control-wrapper--resizing"), A(), t($, P), document.removeEventListener("pointermove", S), document.removeEventListener("pointerup", E);
     }
   };
   return /* @__PURE__ */ b.jsxs("div", { ref: i, children: [
@@ -114,8 +119,8 @@ function ke({
       "div",
       {
         className: "image-resizer image-resizer-n",
-        onPointerDown: (g) => {
-          N(g, v.north);
+        onPointerDown: (u) => {
+          N(u, v.north);
         }
       }
     ),
@@ -123,8 +128,8 @@ function ke({
       "div",
       {
         className: "image-resizer image-resizer-ne",
-        onPointerDown: (g) => {
-          N(g, v.north | v.east);
+        onPointerDown: (u) => {
+          N(u, v.north | v.east);
         }
       }
     ),
@@ -132,8 +137,8 @@ function ke({
       "div",
       {
         className: "image-resizer image-resizer-e",
-        onPointerDown: (g) => {
-          N(g, v.east);
+        onPointerDown: (u) => {
+          N(u, v.east);
         }
       }
     ),
@@ -141,8 +146,8 @@ function ke({
       "div",
       {
         className: "image-resizer image-resizer-se",
-        onPointerDown: (g) => {
-          N(g, v.south | v.east);
+        onPointerDown: (u) => {
+          N(u, v.south | v.east);
         }
       }
     ),
@@ -150,8 +155,8 @@ function ke({
       "div",
       {
         className: "image-resizer image-resizer-s",
-        onPointerDown: (g) => {
-          N(g, v.south);
+        onPointerDown: (u) => {
+          N(u, v.south);
         }
       }
     ),
@@ -159,8 +164,8 @@ function ke({
       "div",
       {
         className: "image-resizer image-resizer-sw",
-        onPointerDown: (g) => {
-          N(g, v.south | v.west);
+        onPointerDown: (u) => {
+          N(u, v.south | v.west);
         }
       }
     ),
@@ -168,8 +173,8 @@ function ke({
       "div",
       {
         className: "image-resizer image-resizer-w",
-        onPointerDown: (g) => {
-          N(g, v.west);
+        onPointerDown: (u) => {
+          N(u, v.west);
         }
       }
     ),
@@ -177,64 +182,64 @@ function ke({
       "div",
       {
         className: "image-resizer image-resizer-nw",
-        onPointerDown: (g) => {
-          N(g, v.north | v.west);
+        onPointerDown: (u) => {
+          N(u, v.north | v.west);
         }
       }
     )
   ] });
 }
-const J = {
+const Q = {
   x: 0,
   y: 0,
   width: 0,
   height: 0,
   unit: "px"
-}, O = (u, t, e) => Math.min(Math.max(u, t), e), He = (...u) => u.filter((t) => t && typeof t == "string").join(" "), re = (u, t) => u === t || u.width === t.width && u.height === t.height && u.x === t.x && u.y === t.y && u.unit === t.unit;
-function W(u, t, e) {
-  return u.unit === "%" ? { ...J, ...u, unit: "%" } : {
+}, O = (g, t, e) => Math.min(Math.max(g, t), e), ke = (...g) => g.filter((t) => t && typeof t == "string").join(" "), ie = (g, t) => g === t || g.width === t.width && g.height === t.height && g.x === t.x && g.y === t.y && g.unit === t.unit;
+function W(g, t, e) {
+  return g.unit === "%" ? { ...Q, ...g, unit: "%" } : {
     unit: "%",
-    x: u.x ? u.x / t * 100 : 0,
-    y: u.y ? u.y / e * 100 : 0,
-    width: u.width ? u.width / t * 100 : 0,
-    height: u.height ? u.height / e * 100 : 0
+    x: g.x ? g.x / t * 100 : 0,
+    y: g.y ? g.y / e * 100 : 0,
+    width: g.width ? g.width / t * 100 : 0,
+    height: g.height ? g.height / e * 100 : 0
   };
 }
-function X(u, t, e) {
-  return u.unit ? u.unit === "px" ? { ...J, ...u, unit: "px" } : {
+function Y(g, t, e) {
+  return g.unit ? g.unit === "px" ? { ...Q, ...g, unit: "px" } : {
     unit: "px",
-    x: u.x ? u.x * t / 100 : 0,
-    y: u.y ? u.y * e / 100 : 0,
-    width: u.width ? u.width * t / 100 : 0,
-    height: u.height ? u.height * e / 100 : 0
-  } : { ...J, ...u, unit: "px" };
+    x: g.x ? g.x * t / 100 : 0,
+    y: g.y ? g.y * e / 100 : 0,
+    width: g.width ? g.width * t / 100 : 0,
+    height: g.height ? g.height * e / 100 : 0
+  } : { ...Q, ...g, unit: "px" };
 }
-function ie(u, t, e, o, n, r = 0, a = 0, p = o, s = n) {
-  const i = { ...u };
+function oe(g, t, e, o, n, r = 0, a = 0, p = o, s = n) {
+  const i = { ...g };
   let l = Math.min(r, o), h = Math.min(a, n), d = Math.min(p, o), c = Math.min(s, n);
   t && (t > 1 ? (l = a ? a * t : l, h = l / t, d = p * t) : (h = r ? r / t : h, l = h * t, c = s / t)), i.y < 0 && (i.height = Math.max(i.height + i.y, h), i.y = 0), i.x < 0 && (i.width = Math.max(i.width + i.x, l), i.x = 0);
   const R = o - (i.x + i.width);
   R < 0 && (i.x = Math.min(i.x, o - l), i.width += R);
-  const M = n - (i.y + i.height);
-  if (M < 0 && (i.y = Math.min(i.y, n - h), i.height += M), i.width < l && ((e === "sw" || e == "nw") && (i.x -= l - i.width), i.width = l), i.height < h && ((e === "nw" || e == "ne") && (i.y -= h - i.height), i.height = h), i.width > d && ((e === "sw" || e == "nw") && (i.x -= d - i.width), i.width = d), i.height > c && ((e === "nw" || e == "ne") && (i.y -= c - i.height), i.height = c), t) {
-    const H = i.width / i.height;
-    if (H < t) {
-      const w = Math.max(i.width / t, h);
-      (e === "nw" || e == "ne") && (i.y -= w - i.height), i.height = w;
-    } else if (H > t) {
-      const w = Math.max(i.height * t, l);
-      (e === "sw" || e == "nw") && (i.x -= w - i.width), i.width = w;
+  const H = n - (i.y + i.height);
+  if (H < 0 && (i.y = Math.min(i.y, n - h), i.height += H), i.width < l && ((e === "sw" || e == "nw") && (i.x -= l - i.width), i.width = l), i.height < h && ((e === "nw" || e == "ne") && (i.y -= h - i.height), i.height = h), i.width > d && ((e === "sw" || e == "nw") && (i.x -= d - i.width), i.width = d), i.height > c && ((e === "nw" || e == "ne") && (i.y -= c - i.height), i.height = c), t) {
+    const k = i.width / i.height;
+    if (k < t) {
+      const m = Math.max(i.width / t, h);
+      (e === "nw" || e == "ne") && (i.y -= m - i.height), i.height = m;
+    } else if (k > t) {
+      const m = Math.max(i.height * t, l);
+      (e === "sw" || e == "nw") && (i.x -= m - i.width), i.width = m;
     }
   }
   return i;
 }
-function Ne(u, t, e, o) {
-  const n = { ...u };
+function Ne(g, t, e, o) {
+  const n = { ...g };
   return t === "ArrowLeft" ? o === "nw" ? (n.x -= e, n.y -= e, n.width += e, n.height += e) : o === "w" ? (n.x -= e, n.width += e) : o === "sw" ? (n.x -= e, n.width += e, n.height += e) : o === "ne" ? (n.y += e, n.width -= e, n.height -= e) : o === "e" ? n.width -= e : o === "se" && (n.width -= e, n.height -= e) : t === "ArrowRight" && (o === "nw" ? (n.x += e, n.y += e, n.width -= e, n.height -= e) : o === "w" ? (n.x += e, n.width -= e) : o === "sw" ? (n.x += e, n.width -= e, n.height -= e) : o === "ne" ? (n.y -= e, n.width += e, n.height += e) : o === "e" ? n.width += e : o === "se" && (n.width += e, n.height += e)), t === "ArrowUp" ? o === "nw" ? (n.x -= e, n.y -= e, n.width += e, n.height += e) : o === "n" ? (n.y -= e, n.height += e) : o === "ne" ? (n.y -= e, n.width += e, n.height += e) : o === "sw" ? (n.x += e, n.width -= e, n.height -= e) : o === "s" ? n.height -= e : o === "se" && (n.width -= e, n.height -= e) : t === "ArrowDown" && (o === "nw" ? (n.x += e, n.y += e, n.width -= e, n.height -= e) : o === "n" ? (n.y += e, n.height -= e) : o === "ne" ? (n.y += e, n.width -= e, n.height -= e) : o === "sw" ? (n.x -= e, n.width += e, n.height += e) : o === "s" ? n.height += e : o === "se" && (n.width += e, n.height += e)), n;
 }
 const K = { capture: !0, passive: !1 };
 let $e = 0;
-const Y = class _ extends Me {
+const L = class I extends Me {
   constructor() {
     super(...arguments), this.docMoveBound = !1, this.mouseDownOnCrop = !1, this.dragStarted = !1, this.evData = {
       startClientX: 0,
@@ -244,14 +249,14 @@ const Y = class _ extends Me {
       clientX: 0,
       clientY: 0,
       isResize: !0
-    }, this.componentRef = ne(), this.mediaRef = ne(), this.initChangeCalled = !1, this.instanceId = `rc-${$e++}`, this.state = {
+    }, this.componentRef = re(), this.mediaRef = re(), this.initChangeCalled = !1, this.instanceId = `rc-${$e++}`, this.state = {
       cropIsActive: !1,
       newCropIsBeingDrawn: !1
     }, this.onCropPointerDown = (t) => {
       const { crop: e, disabled: o } = this.props, n = this.getBox();
       if (!e)
         return;
-      const r = X(e, n.width, n.height);
+      const r = Y(e, n.width, n.height);
       if (o)
         return;
       t.cancelable && t.preventDefault(), this.bindDocMove(), this.componentRef.current.focus({ preventScroll: !0 });
@@ -259,8 +264,8 @@ const Y = class _ extends Me {
       let s = t.clientX, i = t.clientY, l = r.x, h = r.y;
       if (a) {
         const d = t.clientX - n.x, c = t.clientY - n.y;
-        let R = 0, M = 0;
-        a === "ne" || a == "e" ? (R = d - (r.x + r.width), M = c - r.y, l = r.x, h = r.y + r.height) : a === "se" || a === "s" ? (R = d - (r.x + r.width), M = c - (r.y + r.height), l = r.x, h = r.y) : a === "sw" || a == "w" ? (R = d - r.x, M = c - (r.y + r.height), l = r.x + r.width, h = r.y) : (a === "nw" || a == "n") && (R = d - r.x, M = c - r.y, l = r.x + r.width, h = r.y + r.height), s = l + n.x + R, i = h + n.y + M;
+        let R = 0, H = 0;
+        a === "ne" || a == "e" ? (R = d - (r.x + r.width), H = c - r.y, l = r.x, h = r.y + r.height) : a === "se" || a === "s" ? (R = d - (r.x + r.width), H = c - (r.y + r.height), l = r.x, h = r.y) : a === "sw" || a == "w" ? (R = d - r.x, H = c - (r.y + r.height), l = r.x + r.width, h = r.y) : (a === "nw" || a == "n") && (R = d - r.x, H = c - r.y, l = r.x + r.width, h = r.y + r.height), s = l + n.x + R, i = h + n.y + H;
       }
       this.evData = {
         startClientX: s,
@@ -292,7 +297,7 @@ const Y = class _ extends Me {
         clientX: t.clientX,
         clientY: t.clientY,
         isResize: !0
-      }, this.mouseDownOnCrop = !0, a(X(l, p.width, p.height), W(l, p.width, p.height)), this.setState({ cropIsActive: !0, newCropIsBeingDrawn: !0 });
+      }, this.mouseDownOnCrop = !0, a(Y(l, p.width, p.height), W(l, p.width, p.height)), this.setState({ cropIsActive: !0, newCropIsBeingDrawn: !0 });
     }, this.onDocPointerMove = (t) => {
       const { crop: e, disabled: o, onChange: n, onDragStart: r } = this.props, a = this.getBox();
       if (o || !e || !this.mouseDownOnCrop)
@@ -301,8 +306,8 @@ const Y = class _ extends Me {
       const { evData: p } = this;
       p.clientX = t.clientX, p.clientY = t.clientY;
       let s;
-      p.isResize ? s = this.resizeCrop() : s = this.dragCrop(), re(e, s) || n(
-        X(s, a.width, a.height),
+      p.isResize ? s = this.resizeCrop() : s = this.dragCrop(), ie(e, s) || n(
+        Y(s, a.width, a.height),
         W(s, a.width, a.height)
       );
     }, this.onComponentKeyDown = (t) => {
@@ -313,10 +318,10 @@ const Y = class _ extends Me {
       let p = !1;
       if (!e)
         return;
-      const s = this.getBox(), i = this.makePixelCrop(s), l = (navigator.platform.match("Mac") ? t.metaKey : t.ctrlKey) ? _.nudgeStepLarge : t.shiftKey ? _.nudgeStepMedium : _.nudgeStep;
+      const s = this.getBox(), i = this.makePixelCrop(s), l = (navigator.platform.match("Mac") ? t.metaKey : t.ctrlKey) ? I.nudgeStepLarge : t.shiftKey ? I.nudgeStepMedium : I.nudgeStep;
       if (a === "ArrowLeft" ? (i.x -= l, p = !0) : a === "ArrowRight" ? (i.x += l, p = !0) : a === "ArrowUp" ? (i.y -= l, p = !0) : a === "ArrowDown" && (i.y += l, p = !0), p) {
         t.cancelable && t.preventDefault(), i.x = O(i.x, 0, s.width - i.width), i.y = O(i.y, 0, s.height - i.height);
-        const h = X(i, s.width, s.height), d = W(i, s.width, s.height);
+        const h = Y(i, s.width, s.height), d = W(i, s.width, s.height);
         n(h, d), r && r(h, d);
       }
     }, this.onHandlerKeyDown = (t, e) => {
@@ -337,8 +342,8 @@ const Y = class _ extends Me {
         t.stopPropagation(), t.preventDefault();
       else
         return;
-      const c = (navigator.platform.match("Mac") ? t.metaKey : t.ctrlKey) ? _.nudgeStepLarge : t.shiftKey ? _.nudgeStepMedium : _.nudgeStep, R = X(n, d.width, d.height), M = Ne(R, t.key, c, e), H = ie(
-        M,
+      const c = (navigator.platform.match("Mac") ? t.metaKey : t.ctrlKey) ? I.nudgeStepLarge : t.shiftKey ? I.nudgeStepMedium : I.nudgeStep, R = Y(n, d.width, d.height), H = Ne(R, t.key, c, e), k = oe(
+        H,
         o,
         e,
         d.width,
@@ -348,13 +353,13 @@ const Y = class _ extends Me {
         s,
         i
       );
-      if (!re(n, H)) {
-        const w = W(H, d.width, d.height);
-        l(H, w), h && h(H, w);
+      if (!ie(n, k)) {
+        const m = W(k, d.width, d.height);
+        l(k, m), h && h(k, m);
       }
     }, this.onDocPointerDone = (t) => {
       const { crop: e, disabled: o, onComplete: n, onDragEnd: r } = this.props, a = this.getBox();
-      this.unbindDocMove(), !(o || !e) && this.mouseDownOnCrop && (this.mouseDownOnCrop = !1, this.dragStarted = !1, r && r(t), n && n(X(e, a.width, a.height), W(e, a.width, a.height)), this.setState({ cropIsActive: !1, newCropIsBeingDrawn: !1 }));
+      this.unbindDocMove(), !(o || !e) && this.mouseDownOnCrop && (this.mouseDownOnCrop = !1, this.dragStarted = !1, r && r(t), n && n(Y(e, a.width, a.height), W(e, a.width, a.height)), this.setState({ cropIsActive: !1, newCropIsBeingDrawn: !1 }));
     }, this.onDragFocus = () => {
       var t;
       (t = this.componentRef.current) == null || t.scrollTo(0, 0);
@@ -376,7 +381,7 @@ const Y = class _ extends Me {
     const { crop: e, onComplete: o } = this.props;
     if (o && !t.crop && e) {
       const { width: n, height: r } = this.getBox();
-      n && r && o(X(e, n, r), W(e, n, r));
+      n && r && o(Y(e, n, r), W(e, n, r));
     }
   }
   componentWillUnmount() {
@@ -427,7 +432,7 @@ const Y = class _ extends Me {
       height: 0
     };
     i === "ne" ? (c.x = t.startCropX, c.width = h, e ? (c.height = c.width / e, c.y = t.startCropY - c.height) : (c.height = Math.abs(d), c.y = t.startCropY - c.height)) : i === "se" ? (c.x = t.startCropX, c.y = t.startCropY, c.width = h, e ? c.height = c.width / e : c.height = d) : i === "sw" ? (c.x = t.startCropX + h, c.y = t.startCropY, c.width = Math.abs(h), e ? c.height = c.width / e : c.height = d) : i === "nw" && (c.x = t.startCropX + h, c.width = Math.abs(h), e ? (c.height = c.width / e, c.y = t.startCropY - c.height) : (c.height = Math.abs(d), c.y = t.startCropY + d));
-    const R = ie(
+    const R = oe(
       c,
       e,
       i,
@@ -438,11 +443,11 @@ const Y = class _ extends Me {
       o,
       n
     );
-    return e || _.xyOrds.indexOf(l) > -1 ? s = R : _.xOrds.indexOf(l) > -1 ? (s.x = R.x, s.width = R.width) : _.yOrds.indexOf(l) > -1 && (s.y = R.y, s.height = R.height), s.x = O(s.x, 0, r.width - s.width), s.y = O(s.y, 0, r.height - s.height), s;
+    return e || I.xyOrds.indexOf(l) > -1 ? s = R : I.xOrds.indexOf(l) > -1 ? (s.x = R.x, s.width = R.width) : I.yOrds.indexOf(l) > -1 && (s.y = R.y, s.height = R.height), s.x = O(s.x, 0, r.width - s.width), s.y = O(s.y, 0, r.height - s.height), s;
   }
   renderCropSelection() {
     const {
-      ariaLabels: t = _.defaultProps.ariaLabels,
+      ariaLabels: t = I.defaultProps.ariaLabels,
       disabled: e,
       locked: o,
       renderSelectionAddon: n,
@@ -547,11 +552,11 @@ const Y = class _ extends Me {
       );
   }
   makePixelCrop(t) {
-    const e = { ...J, ...this.props.crop || {} };
-    return X(e, t.width, t.height);
+    const e = { ...Q, ...this.props.crop || {} };
+    return Y(e, t.width, t.height);
   }
   render() {
-    const { aspect: t, children: e, circularCrop: o, className: n, crop: r, disabled: a, locked: p, style: s, ruleOfThirds: i } = this.props, { cropIsActive: l, newCropIsBeingDrawn: h } = this.state, d = r ? this.renderCropSelection() : null, c = He(
+    const { aspect: t, children: e, circularCrop: o, className: n, crop: r, disabled: a, locked: p, style: s, ruleOfThirds: i } = this.props, { cropIsActive: l, newCropIsBeingDrawn: h } = this.state, d = r ? this.renderCropSelection() : null, c = ke(
       "ReactCrop",
       n,
       l && "ReactCrop--active",
@@ -585,7 +590,7 @@ const Y = class _ extends Me {
     ))), /* @__PURE__ */ C.createElement("rect", { fill: "black", fillOpacity: 0.5, width: "100%", height: "100%", mask: `url(#hole-${this.instanceId})` })) : void 0, d);
   }
 };
-Y.xOrds = ["e", "w"], Y.yOrds = ["n", "s"], Y.xyOrds = ["nw", "ne", "se", "sw"], Y.nudgeStep = 1, Y.nudgeStepMedium = 10, Y.nudgeStepLarge = 100, Y.defaultProps = {
+L.xOrds = ["e", "w"], L.yOrds = ["n", "s"], L.xyOrds = ["nw", "ne", "se", "sw"], L.nudgeStep = 1, L.nudgeStepMedium = 10, L.nudgeStepLarge = 100, L.defaultProps = {
   ariaLabels: {
     cropArea: "Use the arrow keys to move the crop selection area",
     nwDragHandle: "Use the arrow keys to move the north west drag handle to change the crop selection area",
@@ -598,10 +603,10 @@ Y.xOrds = ["e", "w"], Y.yOrds = ["n", "s"], Y.xyOrds = ["nw", "ne", "se", "sw"],
     wDragHandle: "Use the up and down arrow keys to move the west drag handle to change the crop selection area"
   }
 };
-let ze = Y;
-const oe = Re();
+let ze = L;
+const se = Re();
 function Se({
-  altText: u,
+  altText: g,
   className: t,
   src: e,
   width: o,
@@ -613,7 +618,7 @@ function Se({
   isFocused: i,
   nodeKey: l
 }) {
-  const [h, d] = G(null), [c, R] = G({
+  const [h, d] = V(null), [c, R] = V({
     //@ts-ignore
     unit: "px",
     // Can be 'px' or '%'
@@ -621,69 +626,69 @@ function Se({
     y: 25,
     width: 50,
     height: 50
-  }), [M] = se(), H = () => {
+  }), [H] = ae(), k = () => {
     if (h) {
-      const P = a.current;
-      if (!P || !h)
+      const E = a.current;
+      if (!E || !h)
         return;
-      const g = P.naturalWidth / P.width, m = P.naturalHeight / P.height, f = new OffscreenCanvas(
-        h.width * g,
-        h.height * m
-      ), $ = f.getContext("2d");
+      const u = E.naturalWidth / E.width, f = E.naturalHeight / E.height, w = new OffscreenCanvas(
+        h.width * u,
+        h.height * f
+      ), $ = w.getContext("2d");
       if (!$)
         throw new Error("No 2D context available");
       $.drawImage(
-        P,
-        h.x * g,
-        h.y * m,
-        h.width * g,
-        h.height * m,
+        E,
+        h.x * u,
+        h.y * f,
+        h.width * u,
+        h.height * f,
         0,
         0,
-        h.width * g,
-        h.height * m
-      ), f.convertToBlob({ type: "image/png" }).then((k) => {
+        h.width * u,
+        h.height * f
+      ), w.convertToBlob({ type: "image/png" }).then((P) => {
         s(!1);
-        const x = new FileReader();
-        x.onload = () => {
-          const D = x.result;
+        const y = new FileReader();
+        y.onload = () => {
+          const D = y.result;
           setTimeout(() => {
-            M.update(
+            H.update(
               () => {
-                const A = F(l);
-                T(A) && D && A.setSrc(D);
+                const _ = T(l);
+                G(_) && D && _.setSrc(D);
               },
               { tag: "crop" }
             );
           }, 100);
-        }, x.onerror = () => {
+        }, y.onerror = () => {
           console.error("Error reading the cropped image blob");
-        }, x.readAsDataURL(k);
+        }, y.readAsDataURL(P);
       });
     }
-  }, w = () => {
-    p || s((P) => {
-      if (P === !1) {
-        const g = a.current;
+  }, m = () => {
+    p || s((E) => {
+      if (E === !1) {
+        const u = a.current;
         R({
           unit: "px",
           // Can be 'px' or '%'
           x: 0,
           y: 0,
-          width: g.width,
-          height: g.height
+          width: u.width,
+          height: u.height
         });
       }
-      return !P;
+      return !E;
     });
-  }, j = L(null), N = L(null);
-  q(() => {
-    h && (j.current = h);
+  }, A = j(null), N = j(null);
+  J(() => {
+    h && (A.current = h);
   }, [h]);
-  const S = (P) => {
-    N.current && !N.current.contains(P.target) && s(!1);
+  const S = (E) => {
+    N.current && !N.current.contains(E.target) && s(!1);
   };
-  return q(() => (document.addEventListener("mousedown", S), () => {
+  return J(() => (document.addEventListener("mousedown", S), () => {
     document.removeEventListener("mousedown", S);
   }), []), /* @__PURE__ */ b.jsxs("div", { ref: N, children: [
     i && /* @__PURE__ */ b.jsx(
@@ -691,7 +696,7 @@ function Se({
       {
         style: { zIndex: 999 },
         className: "image-caption-button",
-        onClick: () => w(),
+        onClick: () => m(),
         children: "Crop"
       }
     ),
@@ -700,7 +705,7 @@ function Se({
       {
         style: { zIndex: 999 },
         className: "image-caption-button",
-        onClick: () => H(),
+        onClick: () => k(),
         children: "Apply Crop"
       }
     ),
@@ -708,14 +713,14 @@ function Se({
       ze,
       {
         crop: c,
-        onChange: (P) => R(P),
-        onComplete: (P) => d(P),
+        onChange: (E) => R(E),
+        onComplete: (E) => d(E),
         children: /* @__PURE__ */ b.jsx(
           "img",
           {
             className: t || void 0,
             src: e,
-            alt: u,
+            alt: g,
             ref: a,
             width: typeof o == "number" ? o : void 0,
             height: typeof n == "number" ? n : void 0,
@@ -736,7 +741,7 @@ function Se({
         {
           className: t || void 0,
           src: e,
-          alt: u,
+          alt: g,
           ref: a,
           width: typeof o == "number" ? o : void 0,
           height: typeof n == "number" ? n : void 0,
@@ -753,7 +758,7 @@ function Se({
   ] });
 }
 function Le({
-  src: u,
+  src: g,
   altText: t,
   nodeKey: e,
   width: o,
@@ -764,140 +769,140 @@ function Le({
   caption: s,
   enableCaptions: i
 }) {
-  const l = L(null), h = L(null), [d, c, R] = de(e), [M, H] = G(!1), [w] = se(), [j, N] = G(null), [S, P] = G(!1), g = L(null), m = U((E) => d ? (E.preventDefault(), w.update(() => {
-    const y = F(e);
-    T(y) && y.remove();
-  }), !0) : !1, [d, w, e]), f = U(
-    (E) => {
-      const y = Z(), z = h.current;
-      if (d && V(y) && y.getNodes().length === 1) {
+  const l = j(null), h = j(null), [d, c, R] = de(e), [H, k] = V(!1), [m] = ae(), [A, N] = V(null), [S, E] = V(!1), u = j(null), f = F((M) => d ? (M.preventDefault(), m.update(() => {
+    const x = T(e);
+    G(x) && x.remove();
+  }), !0) : !1, [d, m, e]), w = F(
+    (M) => {
+      const x = ee(), z = h.current;
+      if (d && q(x) && x.getNodes().length === 1) {
         if (p)
-          return te(null), E.preventDefault(), s.focus(), !0;
+          return ne(null), M.preventDefault(), s.focus(), !0;
         if (z !== null && z !== document.activeElement)
-          return E.preventDefault(), z.focus(), !0;
+          return M.preventDefault(), z.focus(), !0;
       }
       return !1;
     },
     [s, d, p]
-  ), $ = U(
-    (E) => g.current === s || h.current === E.target ? (te(null), w.update(() => {
+  ), $ = F(
+    (M) => u.current === s || h.current === M.target ? (ne(null), m.update(() => {
       c(!0);
-      const y = w.getRootElement();
-      y !== null && y.focus();
+      const x = m.getRootElement();
+      x !== null && x.focus();
     }), !0) : !1,
-    [s, w, c]
-  ), k = U(
-    (E) => {
-      const y = E;
-      return M ? !0 : y.target === l.current ? (y.shiftKey ? c(!d) : (R(), c(!0)), !0) : !1;
+    [s, m, c]
+  ), P = F(
+    (M) => {
+      const x = M;
+      return H ? !0 : x.target === l.current ? (x.shiftKey ? c(!d) : (R(), c(!0)), !0) : !1;
     },
-    [M, d, c, R]
-  ), x = U(
-    (E) => {
-      w.getEditorState().read(() => {
-        const y = Z();
-        E.target.tagName === "IMG" && le(y) && y.getNodes().length === 1 && w.dispatchCommand(
-          oe,
-          E
+    [H, d, c, R]
+  ), y = F(
+    (M) => {
+      m.getEditorState().read(() => {
+        const x = ee();
+        M.target.tagName === "IMG" && le(x) && x.getNodes().length === 1 && m.dispatchCommand(
+          se,
+          M
         );
       });
     },
-    [w]
+    [m]
   );
-  q(() => {
-    const E = (z) => {
-      (z.key === "Delete" || z.key === "Backspace") && d && (z.stopPropagation(), z.preventDefault(), w.update(() => {
-        const I = F(e);
-        T(I) && I.remove();
+  J(() => {
+    const M = (z) => {
+      (z.key === "Delete" || z.key === "Backspace") && d && (z.stopPropagation(), z.preventDefault(), m.update(() => {
+        const X = T(e);
+        G(X) && X.remove();
       }));
-    }, y = w.getRootElement();
-    return y == null || y.addEventListener("keydown", E), () => {
-      y == null || y.removeEventListener("keydown", E);
+    }, x = m.getRootElement();
+    return x == null || x.addEventListener("keydown", M), () => {
+      x == null || x.removeEventListener("keydown", M);
     };
-  }, [d, w, e]), q(() => {
-    let E = !0;
-    const y = w.getRootElement(), z = ue(
-      w.registerUpdateListener(({ editorState: I }) => {
-        E && N(I.read(() => Z()));
+  }, [d, m, e]), J(() => {
+    let M = !0;
+    const x = m.getRootElement(), z = ge(
+      m.registerUpdateListener(({ editorState: X }) => {
+        M && N(X.read(() => ee()));
       }),
-      w.registerCommand(
-        xe,
-        (I, ce) => (g.current = ce, !1),
+      m.registerCommand(
+        ye,
+        (X, ce) => (u.current = ce, !1),
         B
       ),
-      w.registerCommand(
-        ye,
-        k,
+      m.registerCommand(
+        xe,
+        P,
         B
       ),
-      w.registerCommand(
-        oe,
-        k,
+      m.registerCommand(
+        se,
+        P,
         B
       ),
-      w.registerCommand(
+      m.registerCommand(
         fe,
-        (I) => I.target === l.current ? (I.preventDefault(), !0) : !1,
+        (X) => X.target === l.current ? (X.preventDefault(), !0) : !1,
         B
       ),
-      w.registerCommand(
-        me,
-        m,
+      m.registerCommand(
+        we,
+        f,
         4
       ),
-      w.registerCommand(
-        we,
-        m,
+      m.registerCommand(
+        me,
+        f,
         4
       ),
-      w.registerCommand(pe, f, B),
-      w.registerCommand(ge, $, B)
+      m.registerCommand(pe, w, B),
+      m.registerCommand(ue, $, B)
     );
-    return y == null || y.addEventListener("contextmenu", x), () => {
-      E = !1, z(), y == null || y.removeEventListener("contextmenu", x);
+    return x == null || x.addEventListener("contextmenu", y), () => {
+      M = !1, z(), x == null || x.removeEventListener("contextmenu", y);
     };
   }, [
     R,
-    w,
-    M,
+    m,
+    H,
     d,
     e,
     // onDelete,
-    f,
+    w,
     $,
-    k,
-    x,
+    P,
+    y,
     c
   ]);
   const D = () => {
-    w.update(() => {
-      const E = F(e);
-      T(E) && E.setShowCaption(!0);
+    m.update(() => {
+      const M = T(e);
+      G(M) && M.setShowCaption(!0);
     });
-  }, A = (E, y) => {
+  }, _ = (M, x) => {
     setTimeout(() => {
-      H(!1);
-    }, 200), w.update(() => {
-      const z = F(e);
-      T(z) && z.setWidthAndHeight(E, y);
+      k(!1);
+    }, 200), m.update(() => {
+      const z = T(e);
+      G(z) && z.setWidthAndHeight(M, x);
     });
-  }, ae = () => {
-    S || H(!0);
-  }, he = d && V(j) && !M, Q = d || M;
-  return /* @__PURE__ */ b.jsx(Pe, { fallback: null, children: /* @__PURE__ */ b.jsxs(b.Fragment, { children: [
+  }, U = () => {
+    S || k(!0);
+  }, he = d && q(A) && !H, Z = d || H;
+  return /* @__PURE__ */ b.jsx(He, { fallback: null, children: /* @__PURE__ */ b.jsxs(b.Fragment, { children: [
     /* @__PURE__ */ b.jsx("div", { draggable: he, children: /* @__PURE__ */ b.jsx(
       Se,
       {
-        className: Q ? `focused ${V(j) ? "draggable" : ""}` : null,
-        src: u,
+        className: Z ? `focused ${q(A) ? "draggable" : ""}` : null,
+        src: g,
         altText: t,
         width: o,
         height: n,
         maxWidth: r,
         imageRef: l,
         startCrop: S,
-        setStartCrop: P,
-        isFocused: Q,
+        setStartCrop: E,
+        isFocused: Z,
         nodeKey: e
       }
     ) }),
@@ -909,18 +914,18 @@ function Le({
         ErrorBoundary: be
       }
     ) }) }),
-    !S && a && V(j) && Q && /* @__PURE__ */ b.jsx(
-      ke,
+    !S && a && q(A) && Z && /* @__PURE__ */ b.jsx(
+      Pe,
       {
         showCaption: p,
         setShowCaption: D,
-        editor: w,
+        editor: m,
         buttonRef: h,
         maxWidth: r,
         onResizeStart: S ? () => {
-        } : ae,
+        } : U,
         onResizeEnd: S ? () => {
-        } : A,
+        } : _,
         enableCaptions: i,
         imageRef: l
       }
@@ -928,7 +933,7 @@ function Le({
   ] }) });
 }
 export {
-  oe as RIGHT_CLICK_IMAGE_COMMAND,
+  se as RIGHT_CLICK_IMAGE_COMMAND,
   Le as default
 };
-//# sourceMappingURL=ImageComponent-5923c11d.js.map
+//# sourceMappingURL=ImageComponent-462c3315.js.map