sykpcomposer 0.0.252 → 0.0.253

package/dist/{ImageComponent-b85bff9f.js → ImageComponent-8ca7cea7.js}

@@ -1,9 +1,9 @@
-import { j as D, u as ce, a as ae, d as G, w as q, x as J, $ as Q, b as ne, c as de, e as le, f as ge, C as I, g as ue, k as pe, h as we, I as me, r as xe, i as fe, l as ye, m as Ce, t as ve } from "./index-73d1cd2f.js";
-import { d as De, L as be, P as Re } from "./LexicalNestedComposer.prod-2ca6d846.js";
-import f, { useRef as Y, PureComponent as Ee, createRef as re, useState as U, useCallback as V, useEffect as te, Suspense as Me } from "react";
+import { j as b, u as ge, a as de, x as q, $ as J, d as G, w as ee, b as oe, c as ue, e as pe, f as we, C as I, g as me, k as fe, h as xe, I as ye, r as Ce, i as ve, l as De, m as be, t as Re } from "./index-2f6f39c0.js";
+import { d as Ee, L as Me, P as Pe } from "./LexicalNestedComposer.prod-28bafc14.js";
+import x, { useRef as Y, PureComponent as $e, createRef as se, useState as F, useEffect as te, useCallback as V, Suspense as He } from "react";
 import "react-dom";
-function ee(l, t, e) {
-  return Math.min(Math.max(l, t), e);
+function ie(d, t, e) {
+  return Math.min(Math.max(d, t), e);
 }
 const y = {
   east: 1,
@@ -11,8 +11,8 @@ const y = {
   south: 2,
   west: 4
 };
-function Pe({
-  onResizeStart: l,
+function ze({
+  onResizeStart: d,
   onResizeEnd: t,
   buttonRef: e,
   imageRef: o,
@@ -22,7 +22,7 @@ function Pe({
   setShowCaption: p,
   captionsEnabled: s
 }) {
-  const i = Y(null), d = Y({
+  const i = Y(null), l = Y({
     priority: "",
     value: "default"
   }), a = Y({
@@ -35,8 +35,8 @@ function Pe({
     startWidth: 0,
     startX: 0,
     startY: 0
-  }), g = r.getRootElement(), c = g !== null ? g.getBoundingClientRect().width - 20 : 100, C = g !== null ? g.getBoundingClientRect().height - 20 : 100, P = 100, x = 100, $ = (w) => {
-    const u = w === y.east || w === y.west, m = w === y.north || w === y.south, H = w & y.north && w & y.west || w & y.south && w & y.east, M = u ? "ew" : m ? "ns" : H ? "nwse" : "nesw";
+  }), g = r.getRootElement(), c = g !== null ? g.getBoundingClientRect().width - 20 : 100, C = g !== null ? g.getBoundingClientRect().height - 20 : 100, P = 100, f = 100, H = (m) => {
+    const u = m === y.east || m === y.west, w = m === y.north || m === y.south, N = m & y.north && m & y.west || m & y.south && m & y.east, M = u ? "ew" : w ? "ns" : N ? "nwse" : "nesw";
     g !== null && g.style.setProperty(
       "cursor",
       `${M}-resize`,
@@ -45,196 +45,196 @@ function Pe({
       "cursor",
       `${M}-resize`,
       "important"
-    ), d.current.value = document.body.style.getPropertyValue(
+    ), l.current.value = document.body.style.getPropertyValue(
       "-webkit-user-select"
-    ), d.current.priority = document.body.style.getPropertyPriority(
+    ), l.current.priority = document.body.style.getPropertyPriority(
       "-webkit-user-select"
     ), document.body.style.setProperty(
       "-webkit-user-select",
       "none",
       "important"
     ));
-  }, F = () => {
+  }, T = () => {
     g !== null && g.style.setProperty("cursor", "text"), document.body !== null && (document.body.style.setProperty("cursor", "default"), document.body.style.setProperty(
       "-webkit-user-select",
-      d.current.value,
-      d.current.priority
+      l.current.value,
+      l.current.priority
     ));
-  }, z = (w, u) => {
+  }, z = (m, u) => {
     if (!r.isEditable())
       return;
-    const m = o.current, H = i.current;
-    if (m !== null && H !== null) {
-      w.preventDefault();
-      const { width: M, height: b } = m.getBoundingClientRect(), v = a.current;
-      v.startWidth = M, v.startHeight = b, v.ratio = M / b, v.currentWidth = M, v.currentHeight = b, v.startX = w.clientX, v.startY = w.clientY, v.isResizing = !0, v.direction = u, $(u), l(), H.classList.add("image-control-wrapper--resizing"), m.style.height = `${b}px`, m.style.width = `${M}px`, document.addEventListener("pointermove", L), document.addEventListener("pointerup", k);
+    const w = o.current, N = i.current;
+    if (w !== null && N !== null) {
+      m.preventDefault();
+      const { width: M, height: v } = w.getBoundingClientRect(), D = a.current;
+      D.startWidth = M, D.startHeight = v, D.ratio = M / v, D.currentWidth = M, D.currentHeight = v, D.startX = m.clientX, D.startY = m.clientY, D.isResizing = !0, D.direction = u, H(u), d(), N.classList.add("image-control-wrapper--resizing"), w.style.height = `${v}px`, w.style.width = `${M}px`, document.addEventListener("pointermove", j), document.addEventListener("pointerup", k);
     }
-  }, L = (w) => {
-    const u = o.current, m = a.current, H = m.direction & (y.east | y.west), M = m.direction & (y.south | y.north);
-    if (u !== null && m.isResizing) {
-      if (H && M) {
-        let b = Math.floor(m.startX - w.clientX);
-        b = m.direction & y.east ? -b : b;
-        const v = ee(
-          m.startWidth + b,
+  }, j = (m) => {
+    const u = o.current, w = a.current, N = w.direction & (y.east | y.west), M = w.direction & (y.south | y.north);
+    if (u !== null && w.isResizing) {
+      if (N && M) {
+        let v = Math.floor(w.startX - m.clientX);
+        v = w.direction & y.east ? -v : v;
+        const D = ie(
+          w.startWidth + v,
           P,
           c
-        ), j = v / m.ratio;
-        u.style.width = `${v}px`, u.style.height = `${j}px`, m.currentHeight = j, m.currentWidth = v;
+        ), A = D / w.ratio;
+        u.style.width = `${D}px`, u.style.height = `${A}px`, w.currentHeight = A, w.currentWidth = D;
       } else if (M) {
-        let b = Math.floor(m.startY - w.clientY);
-        b = m.direction & y.south ? -b : b;
-        const v = ee(
-          m.startHeight + b,
-          x,
+        let v = Math.floor(w.startY - m.clientY);
+        v = w.direction & y.south ? -v : v;
+        const D = ie(
+          w.startHeight + v,
+          f,
           C
         );
-        u.style.height = `${v}px`, u.style.maxHeight = `${v}px`, m.currentHeight = v;
+        u.style.height = `${D}px`, u.style.maxHeight = `${D}px`, w.currentHeight = D;
       } else {
-        let b = Math.floor(m.startX - w.clientX);
-        b = m.direction & y.east ? -b : b;
-        const v = ee(
-          m.startWidth + b,
+        let v = Math.floor(w.startX - m.clientX);
+        v = w.direction & y.east ? -v : v;
+        const D = ie(
+          w.startWidth + v,
           P,
           c
         );
-        u.style.width = `${v}px`, u.style.maxWidth = `${v}px`, m.currentWidth = v;
+        u.style.width = `${D}px`, u.style.maxWidth = `${D}px`, w.currentWidth = D;
       }
-      u && (u.setAttribute("width", `${m.currentWidth}`), u.setAttribute("height", `${m.currentHeight}`));
+      u && (u.setAttribute("width", `${w.currentWidth}`), u.setAttribute("height", `${w.currentHeight}`));
     }
   }, k = () => {
-    const w = o.current, u = a.current, m = i.current;
-    if (w !== null && m !== null && u.isResizing) {
-      const H = u.currentWidth, M = u.currentHeight;
-      u.startWidth = 0, u.startHeight = 0, u.ratio = 0, u.startX = 0, u.startY = 0, u.currentWidth = 0, u.currentHeight = 0, u.isResizing = !1, m.classList.remove("image-control-wrapper--resizing"), F(), t(H, M), document.removeEventListener("pointermove", L), document.removeEventListener("pointerup", k);
+    const m = o.current, u = a.current, w = i.current;
+    if (m !== null && w !== null && u.isResizing) {
+      const N = u.currentWidth, M = u.currentHeight;
+      u.startWidth = 0, u.startHeight = 0, u.ratio = 0, u.startX = 0, u.startY = 0, u.currentWidth = 0, u.currentHeight = 0, u.isResizing = !1, w.classList.remove("image-control-wrapper--resizing"), T(), t(N, M), document.removeEventListener("pointermove", j), document.removeEventListener("pointerup", k);
     }
   };
-  return /* @__PURE__ */ D.jsxs("div", { ref: i, children: [
-    /* @__PURE__ */ D.jsx(
+  return /* @__PURE__ */ b.jsxs("div", { ref: i, children: [
+    /* @__PURE__ */ b.jsx(
       "div",
       {
         className: "image-resizer image-resizer-n",
-        onPointerDown: (w) => {
-          z(w, y.north);
+        onPointerDown: (m) => {
+          z(m, y.north);
         }
       }
     ),
-    /* @__PURE__ */ D.jsx(
+    /* @__PURE__ */ b.jsx(
       "div",
       {
         className: "image-resizer image-resizer-ne",
-        onPointerDown: (w) => {
-          z(w, y.north | y.east);
+        onPointerDown: (m) => {
+          z(m, y.north | y.east);
         }
       }
     ),
-    /* @__PURE__ */ D.jsx(
+    /* @__PURE__ */ b.jsx(
       "div",
       {
         className: "image-resizer image-resizer-e",
-        onPointerDown: (w) => {
-          z(w, y.east);
+        onPointerDown: (m) => {
+          z(m, y.east);
         }
       }
     ),
-    /* @__PURE__ */ D.jsx(
+    /* @__PURE__ */ b.jsx(
       "div",
       {
         className: "image-resizer image-resizer-se",
-        onPointerDown: (w) => {
-          z(w, y.south | y.east);
+        onPointerDown: (m) => {
+          z(m, y.south | y.east);
         }
       }
     ),
-    /* @__PURE__ */ D.jsx(
+    /* @__PURE__ */ b.jsx(
       "div",
       {
         className: "image-resizer image-resizer-s",
-        onPointerDown: (w) => {
-          z(w, y.south);
+        onPointerDown: (m) => {
+          z(m, y.south);
         }
       }
     ),
-    /* @__PURE__ */ D.jsx(
+    /* @__PURE__ */ b.jsx(
       "div",
       {
         className: "image-resizer image-resizer-sw",
-        onPointerDown: (w) => {
-          z(w, y.south | y.west);
+        onPointerDown: (m) => {
+          z(m, y.south | y.west);
         }
       }
     ),
-    /* @__PURE__ */ D.jsx(
+    /* @__PURE__ */ b.jsx(
       "div",
       {
         className: "image-resizer image-resizer-w",
-        onPointerDown: (w) => {
-          z(w, y.west);
+        onPointerDown: (m) => {
+          z(m, y.west);
         }
       }
     ),
-    /* @__PURE__ */ D.jsx(
+    /* @__PURE__ */ b.jsx(
       "div",
       {
         className: "image-resizer image-resizer-nw",
-        onPointerDown: (w) => {
-          z(w, y.north | y.west);
+        onPointerDown: (m) => {
+          z(m, y.north | y.west);
         }
       }
     )
   ] });
 }
-const Z = {
+const ne = {
   x: 0,
   y: 0,
   width: 0,
   height: 0,
   unit: "px"
-}, O = (l, t, e) => Math.min(Math.max(l, t), e), He = (...l) => l.filter((t) => t && typeof t == "string").join(" "), ie = (l, t) => l === t || l.width === t.width && l.height === t.height && l.x === t.x && l.y === t.y && l.unit === t.unit;
-function W(l, t, e) {
-  return l.unit === "%" ? { ...Z, ...l, unit: "%" } : {
+}, W = (d, t, e) => Math.min(Math.max(d, t), e), Ne = (...d) => d.filter((t) => t && typeof t == "string").join(" "), ae = (d, t) => d === t || d.width === t.width && d.height === t.height && d.x === t.x && d.y === t.y && d.unit === t.unit;
+function U(d, t, e) {
+  return d.unit === "%" ? { ...ne, ...d, unit: "%" } : {
     unit: "%",
-    x: l.x ? l.x / t * 100 : 0,
-    y: l.y ? l.y / e * 100 : 0,
-    width: l.width ? l.width / t * 100 : 0,
-    height: l.height ? l.height / e * 100 : 0
+    x: d.x ? d.x / t * 100 : 0,
+    y: d.y ? d.y / e * 100 : 0,
+    width: d.width ? d.width / t * 100 : 0,
+    height: d.height ? d.height / e * 100 : 0
   };
 }
-function _(l, t, e) {
-  return l.unit ? l.unit === "px" ? { ...Z, ...l, unit: "px" } : {
+function _(d, t, e) {
+  return d.unit ? d.unit === "px" ? { ...ne, ...d, unit: "px" } : {
     unit: "px",
-    x: l.x ? l.x * t / 100 : 0,
-    y: l.y ? l.y * e / 100 : 0,
-    width: l.width ? l.width * t / 100 : 0,
-    height: l.height ? l.height * e / 100 : 0
-  } : { ...Z, ...l, unit: "px" };
+    x: d.x ? d.x * t / 100 : 0,
+    y: d.y ? d.y * e / 100 : 0,
+    width: d.width ? d.width * t / 100 : 0,
+    height: d.height ? d.height * e / 100 : 0
+  } : { ...ne, ...d, unit: "px" };
 }
-function oe(l, t, e, o, n, r = 0, h = 0, p = o, s = n) {
-  const i = { ...l };
-  let d = Math.min(r, o), a = Math.min(h, n), g = Math.min(p, o), c = Math.min(s, n);
-  t && (t > 1 ? (d = h ? h * t : d, a = d / t, g = p * t) : (a = r ? r / t : a, d = a * t, c = s / t)), i.y < 0 && (i.height = Math.max(i.height + i.y, a), i.y = 0), i.x < 0 && (i.width = Math.max(i.width + i.x, d), i.x = 0);
+function he(d, t, e, o, n, r = 0, h = 0, p = o, s = n) {
+  const i = { ...d };
+  let l = Math.min(r, o), a = Math.min(h, n), g = Math.min(p, o), c = Math.min(s, n);
+  t && (t > 1 ? (l = h ? h * t : l, a = l / t, g = p * t) : (a = r ? r / t : a, l = a * t, c = s / t)), i.y < 0 && (i.height = Math.max(i.height + i.y, a), i.y = 0), i.x < 0 && (i.width = Math.max(i.width + i.x, l), i.x = 0);
   const C = o - (i.x + i.width);
-  C < 0 && (i.x = Math.min(i.x, o - d), i.width += C);
+  C < 0 && (i.x = Math.min(i.x, o - l), i.width += C);
   const P = n - (i.y + i.height);
-  if (P < 0 && (i.y = Math.min(i.y, n - a), i.height += P), i.width < d && ((e === "sw" || e == "nw") && (i.x -= d - i.width), i.width = d), i.height < a && ((e === "nw" || e == "ne") && (i.y -= a - i.height), i.height = a), i.width > g && ((e === "sw" || e == "nw") && (i.x -= g - i.width), i.width = g), i.height > c && ((e === "nw" || e == "ne") && (i.y -= c - i.height), i.height = c), t) {
-    const x = i.width / i.height;
-    if (x < t) {
-      const $ = Math.max(i.width / t, a);
-      (e === "nw" || e == "ne") && (i.y -= $ - i.height), i.height = $;
-    } else if (x > t) {
-      const $ = Math.max(i.height * t, d);
-      (e === "sw" || e == "nw") && (i.x -= $ - i.width), i.width = $;
+  if (P < 0 && (i.y = Math.min(i.y, n - a), i.height += P), i.width < l && ((e === "sw" || e == "nw") && (i.x -= l - i.width), i.width = l), i.height < a && ((e === "nw" || e == "ne") && (i.y -= a - i.height), i.height = a), i.width > g && ((e === "sw" || e == "nw") && (i.x -= g - i.width), i.width = g), i.height > c && ((e === "nw" || e == "ne") && (i.y -= c - i.height), i.height = c), t) {
+    const f = i.width / i.height;
+    if (f < t) {
+      const H = Math.max(i.width / t, a);
+      (e === "nw" || e == "ne") && (i.y -= H - i.height), i.height = H;
+    } else if (f > t) {
+      const H = Math.max(i.height * t, l);
+      (e === "sw" || e == "nw") && (i.x -= H - i.width), i.width = H;
     }
   }
   return i;
 }
-function $e(l, t, e, o) {
-  const n = { ...l };
+function Se(d, t, e, o) {
+  const n = { ...d };
   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 ze = 0;
-const X = class S extends Ee {
+let ke = 0;
+const X = class S extends $e {
   constructor() {
     super(...arguments), this.docMoveBound = !1, this.mouseDownOnCrop = !1, this.dragStarted = !1, this.evData = {
       startClientX: 0,
@@ -244,7 +244,7 @@ const X = class S extends Ee {
       clientX: 0,
       clientY: 0,
       isResize: !0
-    }, this.componentRef = re(), this.mediaRef = re(), this.initChangeCalled = !1, this.instanceId = `rc-${ze++}`, this.state = {
+    }, this.componentRef = se(), this.mediaRef = se(), this.initChangeCalled = !1, this.instanceId = `rc-${ke++}`, this.state = {
       cropIsActive: !1,
       newCropIsBeingDrawn: !1
     }, this.onCropPointerDown = (t) => {
@@ -256,16 +256,16 @@ const X = class S extends Ee {
         return;
       t.cancelable && t.preventDefault(), this.bindDocMove(), this.componentRef.current.focus({ preventScroll: !0 });
       const h = t.target.dataset.ord, p = !!h;
-      let s = t.clientX, i = t.clientY, d = r.x, a = r.y;
+      let s = t.clientX, i = t.clientY, l = r.x, a = r.y;
       if (h) {
         const g = t.clientX - n.x, c = t.clientY - n.y;
         let C = 0, P = 0;
-        h === "ne" || h == "e" ? (C = g - (r.x + r.width), P = c - r.y, d = r.x, a = r.y + r.height) : h === "se" || h === "s" ? (C = g - (r.x + r.width), P = c - (r.y + r.height), d = r.x, a = r.y) : h === "sw" || h == "w" ? (C = g - r.x, P = c - (r.y + r.height), d = r.x + r.width, a = r.y) : (h === "nw" || h == "n") && (C = g - r.x, P = c - r.y, d = r.x + r.width, a = r.y + r.height), s = d + n.x + C, i = a + n.y + P;
+        h === "ne" || h == "e" ? (C = g - (r.x + r.width), P = c - r.y, l = r.x, a = r.y + r.height) : h === "se" || h === "s" ? (C = g - (r.x + r.width), P = c - (r.y + r.height), l = r.x, a = r.y) : h === "sw" || h == "w" ? (C = g - r.x, P = c - (r.y + r.height), l = r.x + r.width, a = r.y) : (h === "nw" || h == "n") && (C = g - r.x, P = c - r.y, l = r.x + r.width, a = r.y + r.height), s = l + n.x + C, i = a + n.y + P;
       }
       this.evData = {
         startClientX: s,
         startClientY: i,
-        startCropX: d,
+        startCropX: l,
         startCropY: a,
         clientX: t.clientX,
         clientY: t.clientY,
@@ -277,7 +277,7 @@ const X = class S extends Ee {
       if (o || n || r && e)
         return;
       t.cancelable && t.preventDefault(), this.bindDocMove(), this.componentRef.current.focus({ preventScroll: !0 });
-      const s = t.clientX - p.x, i = t.clientY - p.y, d = {
+      const s = t.clientX - p.x, i = t.clientY - p.y, l = {
         unit: "px",
         x: s,
         y: i,
@@ -292,7 +292,7 @@ const X = class S extends Ee {
         clientX: t.clientX,
         clientY: t.clientY,
         isResize: !0
-      }, this.mouseDownOnCrop = !0, h(_(d, p.width, p.height), W(d, p.width, p.height)), this.setState({ cropIsActive: !0, newCropIsBeingDrawn: !0 });
+      }, this.mouseDownOnCrop = !0, h(_(l, p.width, p.height), U(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, h = this.getBox();
       if (o || !e || !this.mouseDownOnCrop)
@@ -301,9 +301,9 @@ const X = class S extends Ee {
       const { evData: p } = this;
       p.clientX = t.clientX, p.clientY = t.clientY;
       let s;
-      p.isResize ? s = this.resizeCrop() : s = this.dragCrop(), ie(e, s) || n(
+      p.isResize ? s = this.resizeCrop() : s = this.dragCrop(), ae(e, s) || n(
         _(s, h.width, h.height),
-        W(s, h.width, h.height)
+        U(s, h.width, h.height)
       );
     }, this.onComponentKeyDown = (t) => {
       const { crop: e, disabled: o, onChange: n, onComplete: r } = this.props;
@@ -313,10 +313,10 @@ const X = class S extends Ee {
       let p = !1;
       if (!e)
         return;
-      const s = this.getBox(), i = this.makePixelCrop(s), d = (navigator.platform.match("Mac") ? t.metaKey : t.ctrlKey) ? S.nudgeStepLarge : t.shiftKey ? S.nudgeStepMedium : S.nudgeStep;
-      if (h === "ArrowLeft" ? (i.x -= d, p = !0) : h === "ArrowRight" ? (i.x += d, p = !0) : h === "ArrowUp" ? (i.y -= d, p = !0) : h === "ArrowDown" && (i.y += d, 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 a = _(i, s.width, s.height), g = W(i, s.width, s.height);
+      const s = this.getBox(), i = this.makePixelCrop(s), l = (navigator.platform.match("Mac") ? t.metaKey : t.ctrlKey) ? S.nudgeStepLarge : t.shiftKey ? S.nudgeStepMedium : S.nudgeStep;
+      if (h === "ArrowLeft" ? (i.x -= l, p = !0) : h === "ArrowRight" ? (i.x += l, p = !0) : h === "ArrowUp" ? (i.y -= l, p = !0) : h === "ArrowDown" && (i.y += l, p = !0), p) {
+        t.cancelable && t.preventDefault(), i.x = W(i.x, 0, s.width - i.width), i.y = W(i.y, 0, s.height - i.height);
+        const a = _(i, s.width, s.height), g = U(i, s.width, s.height);
         n(a, g), r && r(a, g);
       }
     }, this.onHandlerKeyDown = (t, e) => {
@@ -328,7 +328,7 @@ const X = class S extends Ee {
         minHeight: p = 0,
         maxWidth: s,
         maxHeight: i,
-        onChange: d,
+        onChange: l,
         onComplete: a
       } = this.props, g = this.getBox();
       if (r || !n)
@@ -337,7 +337,7 @@ const X = class S extends Ee {
         t.stopPropagation(), t.preventDefault();
       else
         return;
-      const c = (navigator.platform.match("Mac") ? t.metaKey : t.ctrlKey) ? S.nudgeStepLarge : t.shiftKey ? S.nudgeStepMedium : S.nudgeStep, C = _(n, g.width, g.height), P = $e(C, t.key, c, e), x = oe(
+      const c = (navigator.platform.match("Mac") ? t.metaKey : t.ctrlKey) ? S.nudgeStepLarge : t.shiftKey ? S.nudgeStepMedium : S.nudgeStep, C = _(n, g.width, g.height), P = Se(C, t.key, c, e), f = he(
         P,
         o,
         e,
@@ -348,13 +348,13 @@ const X = class S extends Ee {
         s,
         i
       );
-      if (!ie(n, x)) {
-        const $ = W(x, g.width, g.height);
-        d(x, $), a && a(x, $);
+      if (!ae(n, f)) {
+        const H = U(f, g.width, g.height);
+        l(f, H), a && a(f, H);
       }
     }, this.onDocPointerDone = (t) => {
       const { crop: e, disabled: o, onComplete: n, onDragEnd: r } = this.props, h = this.getBox();
-      this.unbindDocMove(), !(o || !e) && this.mouseDownOnCrop && (this.mouseDownOnCrop = !1, this.dragStarted = !1, r && r(t), n && n(_(e, h.width, h.height), W(e, h.width, h.height)), this.setState({ cropIsActive: !1, newCropIsBeingDrawn: !1 }));
+      this.unbindDocMove(), !(o || !e) && this.mouseDownOnCrop && (this.mouseDownOnCrop = !1, this.dragStarted = !1, r && r(t), n && n(_(e, h.width, h.height), U(e, h.width, h.height)), this.setState({ cropIsActive: !1, newCropIsBeingDrawn: !1 }));
     }, this.onDragFocus = () => {
       var t;
       (t = this.componentRef.current) == null || t.scrollTo(0, 0);
@@ -376,7 +376,7 @@ const X = class S extends Ee {
     const { crop: e, onComplete: o } = this.props;
     if (o && !t.crop && e) {
       const { width: n, height: r } = this.getBox();
-      n && r && o(_(e, n, r), W(e, n, r));
+      n && r && o(_(e, n, r), U(e, n, r));
     }
   }
   componentWillUnmount() {
@@ -400,7 +400,7 @@ const X = class S extends Ee {
   }
   dragCrop() {
     const { evData: t } = this, e = this.getBox(), o = this.makePixelCrop(e), n = t.clientX - t.startClientX, r = t.clientY - t.startClientY;
-    return o.x = O(t.startCropX + n, 0, e.width - o.width), o.y = O(t.startCropY + r, 0, e.height - o.height), o;
+    return o.x = W(t.startCropX + n, 0, e.width - o.width), o.y = W(t.startCropY + r, 0, e.height - o.height), o;
   }
   getPointRegion(t, e, o, n) {
     const { evData: r } = this, h = r.clientX - t.x, p = r.clientY - t.y;
@@ -416,9 +416,9 @@ const X = class S extends Ee {
   resizeCrop() {
     const { evData: t } = this, { aspect: e = 0, maxWidth: o, maxHeight: n } = this.props, r = this.getBox(), [h, p] = this.resolveMinDimensions(r, e, this.props.minWidth, this.props.minHeight);
     let s = this.makePixelCrop(r);
-    const i = this.getPointRegion(r, t.ord, h, p), d = t.ord || i;
+    const i = this.getPointRegion(r, t.ord, h, p), l = t.ord || i;
     let a = t.clientX - t.startClientX, g = t.clientY - t.startClientY;
-    (h && d === "nw" || d === "w" || d === "sw") && (a = Math.min(a, -h)), (p && d === "nw" || d === "n" || d === "ne") && (g = Math.min(g, -p));
+    (h && l === "nw" || l === "w" || l === "sw") && (a = Math.min(a, -h)), (p && l === "nw" || l === "n" || l === "ne") && (g = Math.min(g, -p));
     const c = {
       unit: "px",
       x: 0,
@@ -427,7 +427,7 @@ const X = class S extends Ee {
       height: 0
     };
     i === "ne" ? (c.x = t.startCropX, c.width = a, e ? (c.height = c.width / e, c.y = t.startCropY - c.height) : (c.height = Math.abs(g), c.y = t.startCropY - c.height)) : i === "se" ? (c.x = t.startCropX, c.y = t.startCropY, c.width = a, e ? c.height = c.width / e : c.height = g) : i === "sw" ? (c.x = t.startCropX + a, c.y = t.startCropY, c.width = Math.abs(a), e ? c.height = c.width / e : c.height = g) : i === "nw" && (c.x = t.startCropX + a, c.width = Math.abs(a), e ? (c.height = c.width / e, c.y = t.startCropY - c.height) : (c.height = Math.abs(g), c.y = t.startCropY + g));
-    const C = oe(
+    const C = he(
       c,
       e,
       i,
@@ -438,7 +438,7 @@ const X = class S extends Ee {
       o,
       n
     );
-    return e || S.xyOrds.indexOf(d) > -1 ? s = C : S.xOrds.indexOf(d) > -1 ? (s.x = C.x, s.width = C.width) : S.yOrds.indexOf(d) > -1 && (s.y = C.y, s.height = C.height), s.x = O(s.x, 0, r.width - s.width), s.y = O(s.y, 0, r.height - s.height), s;
+    return e || S.xyOrds.indexOf(l) > -1 ? s = C : S.xOrds.indexOf(l) > -1 ? (s.x = C.x, s.width = C.width) : S.yOrds.indexOf(l) > -1 && (s.y = C.y, s.height = C.height), s.x = W(s.x, 0, r.width - s.width), s.y = W(s.y, 0, r.height - s.height), s;
   }
   renderCropSelection() {
     const {
@@ -450,7 +450,7 @@ const X = class S extends Ee {
       crop: h
     } = this.props, p = this.getCropStyle();
     if (h)
-      return /* @__PURE__ */ f.createElement(
+      return /* @__PURE__ */ x.createElement(
         "div",
         {
           style: p,
@@ -461,7 +461,7 @@ const X = class S extends Ee {
           onKeyDown: this.onComponentKeyDown,
           role: "group"
         },
-        !e && !o && /* @__PURE__ */ f.createElement("div", { className: "ReactCrop__drag-elements", onFocus: this.onDragFocus }, /* @__PURE__ */ f.createElement("div", { className: "ReactCrop__drag-bar ord-n", "data-ord": "n" }), /* @__PURE__ */ f.createElement("div", { className: "ReactCrop__drag-bar ord-e", "data-ord": "e" }), /* @__PURE__ */ f.createElement("div", { className: "ReactCrop__drag-bar ord-s", "data-ord": "s" }), /* @__PURE__ */ f.createElement("div", { className: "ReactCrop__drag-bar ord-w", "data-ord": "w" }), /* @__PURE__ */ f.createElement(
+        !e && !o && /* @__PURE__ */ x.createElement("div", { className: "ReactCrop__drag-elements", onFocus: this.onDragFocus }, /* @__PURE__ */ x.createElement("div", { className: "ReactCrop__drag-bar ord-n", "data-ord": "n" }), /* @__PURE__ */ x.createElement("div", { className: "ReactCrop__drag-bar ord-e", "data-ord": "e" }), /* @__PURE__ */ x.createElement("div", { className: "ReactCrop__drag-bar ord-s", "data-ord": "s" }), /* @__PURE__ */ x.createElement("div", { className: "ReactCrop__drag-bar ord-w", "data-ord": "w" }), /* @__PURE__ */ x.createElement(
           "div",
           {
             className: "ReactCrop__drag-handle ord-nw",
@@ -471,7 +471,7 @@ const X = class S extends Ee {
             onKeyDown: (s) => this.onHandlerKeyDown(s, "nw"),
             role: "button"
           }
-        ), /* @__PURE__ */ f.createElement(
+        ), /* @__PURE__ */ x.createElement(
           "div",
           {
             className: "ReactCrop__drag-handle ord-n",
@@ -481,7 +481,7 @@ const X = class S extends Ee {
             onKeyDown: (s) => this.onHandlerKeyDown(s, "n"),
             role: "button"
           }
-        ), /* @__PURE__ */ f.createElement(
+        ), /* @__PURE__ */ x.createElement(
           "div",
           {
             className: "ReactCrop__drag-handle ord-ne",
@@ -491,7 +491,7 @@ const X = class S extends Ee {
             onKeyDown: (s) => this.onHandlerKeyDown(s, "ne"),
             role: "button"
           }
-        ), /* @__PURE__ */ f.createElement(
+        ), /* @__PURE__ */ x.createElement(
           "div",
           {
             className: "ReactCrop__drag-handle ord-e",
@@ -501,7 +501,7 @@ const X = class S extends Ee {
             onKeyDown: (s) => this.onHandlerKeyDown(s, "e"),
             role: "button"
           }
-        ), /* @__PURE__ */ f.createElement(
+        ), /* @__PURE__ */ x.createElement(
           "div",
           {
             className: "ReactCrop__drag-handle ord-se",
@@ -511,7 +511,7 @@ const X = class S extends Ee {
             onKeyDown: (s) => this.onHandlerKeyDown(s, "se"),
             role: "button"
           }
-        ), /* @__PURE__ */ f.createElement(
+        ), /* @__PURE__ */ x.createElement(
           "div",
           {
             className: "ReactCrop__drag-handle ord-s",
@@ -521,7 +521,7 @@ const X = class S extends Ee {
             onKeyDown: (s) => this.onHandlerKeyDown(s, "s"),
             role: "button"
           }
-        ), /* @__PURE__ */ f.createElement(
+        ), /* @__PURE__ */ x.createElement(
           "div",
           {
             className: "ReactCrop__drag-handle ord-sw",
@@ -531,7 +531,7 @@ const X = class S extends Ee {
             onKeyDown: (s) => this.onHandlerKeyDown(s, "sw"),
             role: "button"
           }
-        ), /* @__PURE__ */ f.createElement(
+        ), /* @__PURE__ */ x.createElement(
           "div",
           {
             className: "ReactCrop__drag-handle ord-w",
@@ -542,19 +542,19 @@ const X = class S extends Ee {
             role: "button"
           }
         )),
-        n && /* @__PURE__ */ f.createElement("div", { className: "ReactCrop__selection-addon", onPointerDown: (s) => s.stopPropagation() }, n(this.state)),
-        r && /* @__PURE__ */ f.createElement(f.Fragment, null, /* @__PURE__ */ f.createElement("div", { className: "ReactCrop__rule-of-thirds-hz" }), /* @__PURE__ */ f.createElement("div", { className: "ReactCrop__rule-of-thirds-vt" }))
+        n && /* @__PURE__ */ x.createElement("div", { className: "ReactCrop__selection-addon", onPointerDown: (s) => s.stopPropagation() }, n(this.state)),
+        r && /* @__PURE__ */ x.createElement(x.Fragment, null, /* @__PURE__ */ x.createElement("div", { className: "ReactCrop__rule-of-thirds-hz" }), /* @__PURE__ */ x.createElement("div", { className: "ReactCrop__rule-of-thirds-vt" }))
       );
   }
   makePixelCrop(t) {
-    const e = { ...Z, ...this.props.crop || {} };
+    const e = { ...ne, ...this.props.crop || {} };
     return _(e, t.width, t.height);
   }
   render() {
-    const { aspect: t, children: e, circularCrop: o, className: n, crop: r, disabled: h, locked: p, style: s, ruleOfThirds: i } = this.props, { cropIsActive: d, newCropIsBeingDrawn: a } = this.state, g = r ? this.renderCropSelection() : null, c = He(
+    const { aspect: t, children: e, circularCrop: o, className: n, crop: r, disabled: h, locked: p, style: s, ruleOfThirds: i } = this.props, { cropIsActive: l, newCropIsBeingDrawn: a } = this.state, g = r ? this.renderCropSelection() : null, c = Ne(
       "ReactCrop",
       n,
-      d && "ReactCrop--active",
+      l && "ReactCrop--active",
       h && "ReactCrop--disabled",
       p && "ReactCrop--locked",
       a && "ReactCrop--new-crop",
@@ -564,7 +564,7 @@ const X = class S extends Ee {
       !this.dragStarted && r && !r.width && !r.height && "ReactCrop--invisible-crop",
       o && "ReactCrop--no-animate"
     );
-    return /* @__PURE__ */ f.createElement("div", { ref: this.componentRef, className: c, style: s }, /* @__PURE__ */ f.createElement("div", { ref: this.mediaRef, className: "ReactCrop__child-wrapper", onPointerDown: this.onComponentPointerDown }, e), r ? /* @__PURE__ */ f.createElement("svg", { className: "ReactCrop__crop-mask", width: "100%", height: "100%" }, /* @__PURE__ */ f.createElement("defs", null, /* @__PURE__ */ f.createElement("mask", { id: `hole-${this.instanceId}` }, /* @__PURE__ */ f.createElement("rect", { width: "100%", height: "100%", fill: "white" }), o ? /* @__PURE__ */ f.createElement(
+    return /* @__PURE__ */ x.createElement("div", { ref: this.componentRef, className: c, style: s }, /* @__PURE__ */ x.createElement("div", { ref: this.mediaRef, className: "ReactCrop__child-wrapper", onPointerDown: this.onComponentPointerDown }, e), r ? /* @__PURE__ */ x.createElement("svg", { className: "ReactCrop__crop-mask", width: "100%", height: "100%" }, /* @__PURE__ */ x.createElement("defs", null, /* @__PURE__ */ x.createElement("mask", { id: `hole-${this.instanceId}` }, /* @__PURE__ */ x.createElement("rect", { width: "100%", height: "100%", fill: "white" }), o ? /* @__PURE__ */ x.createElement(
       "ellipse",
       {
         cx: `${r.x + r.width / 2}${r.unit}`,
@@ -573,7 +573,7 @@ const X = class S extends Ee {
         ry: `${r.height / 2}${r.unit}`,
         fill: "black"
       }
-    ) : /* @__PURE__ */ f.createElement(
+    ) : /* @__PURE__ */ x.createElement(
       "rect",
       {
         x: `${r.x}${r.unit}`,
@@ -582,7 +582,7 @@ const X = class S extends Ee {
         height: `${r.height}${r.unit}`,
         fill: "black"
       }
-    ))), /* @__PURE__ */ f.createElement("rect", { fill: "black", fillOpacity: 0.5, width: "100%", height: "100%", mask: `url(#hole-${this.instanceId})` })) : void 0, g);
+    ))), /* @__PURE__ */ x.createElement("rect", { fill: "black", fillOpacity: 0.5, width: "100%", height: "100%", mask: `url(#hole-${this.instanceId})` })) : void 0, g);
   }
 };
 X.xOrds = ["e", "w"], X.yOrds = ["n", "s"], X.xyOrds = ["nw", "ne", "se", "sw"], X.nudgeStep = 1, X.nudgeStepMedium = 10, X.nudgeStepLarge = 100, X.defaultProps = {
@@ -598,10 +598,10 @@ X.xOrds = ["e", "w"], X.yOrds = ["n", "s"], X.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 Ne = X;
-const se = ve();
-function Se({
-  altText: l,
+let Ie = X;
+const ce = Re();
+function _e({
+  altText: d,
   className: t,
   src: e,
   width: o,
@@ -611,9 +611,9 @@ function Se({
   startCrop: p,
   setStartCrop: s,
   isFocused: i,
-  nodeKey: d
+  nodeKey: l
 }) {
-  const [a, g] = U(null), [c, C] = U(null), [P, x] = U({
+  const [a, g] = F(null), [c, C] = F(null), [P, f] = F({
     //@ts-ignore
     unit: "px",
     // Can be 'px' or '%'
@@ -621,68 +621,68 @@ function Se({
     y: 25,
     width: 50,
     height: 50
-  }), [$] = ae(), F = () => {
+  }), [H] = de(), T = () => {
     if (a) {
       const u = h.current;
       if (!u || !a)
         return;
-      const m = u.naturalWidth / u.width, H = u.naturalHeight / u.height, M = new OffscreenCanvas(
-        a.width * m,
-        a.height * H
-      ), b = M.getContext("2d");
-      if (!b)
+      const w = u.naturalWidth / u.width, N = u.naturalHeight / u.height, M = new OffscreenCanvas(
+        a.width * w,
+        a.height * N
+      ), v = M.getContext("2d");
+      if (!v)
         throw new Error("No 2D context available");
-      b.drawImage(
+      v.drawImage(
         u,
-        a.x * m,
-        a.y * H,
-        a.width * m,
-        a.height * H,
+        a.x * w,
+        a.y * N,
+        a.width * w,
+        a.height * N,
         0,
         0,
-        a.width * m,
-        a.height * H
-      ), M.convertToBlob({ type: "image/png" }).then((v) => {
-        const j = URL.createObjectURL(v);
-        C(j), s(!1);
-        const A = new FileReader();
-        A.onload = () => {
-          const B = A.result;
-          $.update(() => {
-            const R = J(d);
-            Q(R) && B && R.setSrc(B);
+        a.width * w,
+        a.height * N
+      ), M.convertToBlob({ type: "image/png" }).then((D) => {
+        const A = URL.createObjectURL(D);
+        C(A), s(!1);
+        const B = new FileReader();
+        B.onload = () => {
+          const Q = B.result;
+          H.update(() => {
+            const O = q(l);
+            J(O) && Q && O.setSrc(Q);
           });
-        }, A.onerror = () => {
+        }, B.onerror = () => {
           console.log("error");
-        }, A.readAsDataURL(v);
+        }, B.readAsDataURL(D);
       });
     }
   }, z = () => {
     p || s((u) => {
       if (u === !1) {
-        const m = h.current;
-        x({
+        const w = h.current;
+        f({
           unit: "px",
           // Can be 'px' or '%'
           x: 0,
           y: 0,
-          width: m.width,
-          height: m.height
+          width: w.width,
+          height: w.height
         });
       }
       return !u;
     });
-  }, L = Y(null), k = Y(null);
+  }, j = Y(null), k = Y(null);
   te(() => {
-    a && (L.current = a);
+    a && (j.current = a);
   }, [a]);
-  const w = (u) => {
+  const m = (u) => {
     k.current && !k.current.contains(u.target) && s(!1);
   };
-  return te(() => (document.addEventListener("mousedown", w), () => {
-    document.removeEventListener("mousedown", w);
-  }), []), /* @__PURE__ */ D.jsxs("div", { ref: k, children: [
-    i && /* @__PURE__ */ D.jsx(
+  return te(() => (document.addEventListener("mousedown", m), () => {
+    document.removeEventListener("mousedown", m);
+  }), []), /* @__PURE__ */ b.jsxs("div", { ref: k, children: [
+    i && /* @__PURE__ */ b.jsx(
       "button",
       {
         style: { zIndex: 999 },
@@ -691,27 +691,27 @@ function Se({
         children: "Crop"
       }
     ),
-    p && /* @__PURE__ */ D.jsx(
+    p && /* @__PURE__ */ b.jsx(
       "button",
       {
         style: { zIndex: 999 },
         className: "image-caption-button",
-        onClick: () => F(),
+        onClick: () => T(),
         children: "Apply Crop"
       }
     ),
-    p ? /* @__PURE__ */ D.jsx(
-      Ne,
+    p ? /* @__PURE__ */ b.jsx(
+      Ie,
       {
         crop: P,
-        onChange: (u) => x(u),
+        onChange: (u) => f(u),
         onComplete: (u) => g(u),
-        children: /* @__PURE__ */ D.jsx(
+        children: /* @__PURE__ */ b.jsx(
           "img",
           {
             className: t || void 0,
             src: c || e,
-            alt: l,
+            alt: d,
             ref: h,
             style: {
               height: n,
@@ -724,12 +724,12 @@ function Se({
       }
     ) : (
       // When startCrop is false, show the cropped image or original image
-      /* @__PURE__ */ D.jsx(
+      /* @__PURE__ */ b.jsx(
         "img",
         {
           className: t || void 0,
           src: c || e,
-          alt: l,
+          alt: d,
           ref: h,
           style: {
             height: n,
@@ -742,8 +742,8 @@ function Se({
     )
   ] });
 }
-function Ye({
-  src: l,
+function Ae({
+  src: d,
   altText: t,
   nodeKey: e,
   width: o,
@@ -753,161 +753,179 @@ function Ye({
   showCaption: p,
   caption: s
 }) {
-  const i = Y(null), d = Y(null), [a, g, c] = ce(e), [C, P] = U(!1), [x] = ae(), [$, F] = U(null), [z, L] = U(!1), k = Y(null), w = V(
-    (R) => {
-      if (a && G(q())) {
-        R.preventDefault();
-        const N = J(e);
-        if (Q(N))
-          return N.remove(), !0;
+  const i = Y(null), l = Y(null), [a, g, c] = ge(e), [C, P] = F(!1), [f] = de(), [H, T] = F(null), [z, j] = F(!1), k = Y(null), m = async (E) => {
+    const $ = await (await fetch(E)).blob();
+    return new Promise((L, re) => {
+      const Z = new FileReader();
+      Z.readAsDataURL($), Z.onloadend = () => {
+        const le = Z.result;
+        L(le);
+      }, Z.onerror = re;
+    });
+  };
+  te(() => {
+    /^(https?|ftp):\/\/[^\s/$.?#].[^\s]*$/i.test(d) && m(d).then((R) => {
+      f.update(() => {
+        const $ = q(e);
+        J($) && R && $.setSrc(R);
+      });
+    });
+  }, [d]);
+  const u = V(
+    (E) => {
+      if (a && G(ee())) {
+        E.preventDefault();
+        const $ = q(e);
+        if (J($))
+          return $.remove(), !0;
       }
       return !1;
     },
     [a, e]
-  ), u = V(
-    (R) => {
-      const E = q(), N = d.current;
-      if (a && G(E) && E.getNodes().length === 1) {
+  ), w = V(
+    (E) => {
+      const R = ee(), $ = l.current;
+      if (a && G(R) && R.getNodes().length === 1) {
         if (p)
-          return ne(null), R.preventDefault(), s.focus(), !0;
-        if (N !== null && N !== document.activeElement)
-          return R.preventDefault(), N.focus(), !0;
+          return oe(null), E.preventDefault(), s.focus(), !0;
+        if ($ !== null && $ !== document.activeElement)
+          return E.preventDefault(), $.focus(), !0;
       }
       return !1;
     },
     [s, a, p]
-  ), m = V(
-    (R) => k.current === s || d.current === R.target ? (ne(null), x.update(() => {
+  ), N = V(
+    (E) => k.current === s || l.current === E.target ? (oe(null), f.update(() => {
       g(!0);
-      const E = x.getRootElement();
-      E !== null && E.focus();
+      const R = f.getRootElement();
+      R !== null && R.focus();
     }), !0) : !1,
-    [s, x, g]
-  ), H = V(
-    (R) => {
-      const E = R;
-      return C ? !0 : E.target === i.current ? (E.shiftKey ? g(!a) : (c(), g(!0)), !0) : !1;
+    [s, f, g]
+  ), M = V(
+    (E) => {
+      const R = E;
+      return C ? !0 : R.target === i.current ? (R.shiftKey ? g(!a) : (c(), g(!0)), !0) : !1;
     },
     [C, a, g, c]
-  ), M = V(
-    (R) => {
-      x.getEditorState().read(() => {
-        const E = q();
-        R.target.tagName === "IMG" && de(E) && E.getNodes().length === 1 && x.dispatchCommand(
-          se,
-          R
+  ), v = V(
+    (E) => {
+      f.getEditorState().read(() => {
+        const R = ee();
+        E.target.tagName === "IMG" && ue(R) && R.getNodes().length === 1 && f.dispatchCommand(
+          ce,
+          E
         );
       });
     },
-    [x]
+    [f]
   );
   te(() => {
-    let R = !0;
-    const E = x.getRootElement(), N = le(
-      x.registerUpdateListener(({ editorState: T }) => {
-        R && F(T.read(() => q()));
+    let E = !0;
+    const R = f.getRootElement(), $ = pe(
+      f.registerUpdateListener(({ editorState: L }) => {
+        E && T(L.read(() => ee()));
       }),
-      x.registerCommand(
-        fe,
-        (T, he) => (k.current = he, !1),
+      f.registerCommand(
+        ve,
+        (L, re) => (k.current = re, !1),
         I
       ),
-      x.registerCommand(
-        xe,
-        H,
+      f.registerCommand(
+        Ce,
+        M,
         I
       ),
-      x.registerCommand(
-        se,
-        H,
+      f.registerCommand(
+        ce,
+        M,
         I
       ),
-      x.registerCommand(
-        me,
-        (T) => T.target === i.current ? (T.preventDefault(), !0) : !1,
+      f.registerCommand(
+        ye,
+        (L) => L.target === i.current ? (L.preventDefault(), !0) : !1,
         I
       ),
-      x.registerCommand(
-        we,
-        w,
+      f.registerCommand(
+        xe,
+        u,
         I
       ),
-      x.registerCommand(
-        pe,
-        w,
+      f.registerCommand(
+        fe,
+        u,
         I
       ),
-      x.registerCommand(ue, u, I),
-      x.registerCommand(ge, m, I)
+      f.registerCommand(me, w, I),
+      f.registerCommand(we, N, I)
     );
-    return E == null || E.addEventListener("contextmenu", M), () => {
-      R = !1, N(), E == null || E.removeEventListener("contextmenu", M);
+    return R == null || R.addEventListener("contextmenu", v), () => {
+      E = !1, $(), R == null || R.removeEventListener("contextmenu", v);
     };
   }, [
     c,
-    x,
+    f,
     C,
     a,
     e,
-    w,
     u,
-    m,
-    H,
+    w,
+    N,
     M,
+    v,
     g
   ]);
-  const b = () => {
-    x.update(() => {
-      const R = J(e);
-      Q(R) && R.setShowCaption(!0);
+  const D = () => {
+    f.update(() => {
+      const E = q(e);
+      J(E) && E.setShowCaption(!0);
     });
-  }, v = (R, E) => {
+  }, A = (E, R) => {
     setTimeout(() => {
       P(!1);
-    }, 200), x.update(() => {
-      const N = J(e);
-      console.log(N, "node"), Q(N) && N.setWidthAndHeight(R, E);
+    }, 200), f.update(() => {
+      const $ = q(e);
+      console.log($, "node"), J($) && $.setWidthAndHeight(E, R);
     });
-  }, j = () => {
+  }, B = () => {
     z || P(!0);
-  }, A = a && G($) && !C, B = a || C;
-  return /* @__PURE__ */ D.jsx(Me, { fallback: null, children: /* @__PURE__ */ D.jsxs(D.Fragment, { children: [
-    /* @__PURE__ */ D.jsx("div", { draggable: A, children: /* @__PURE__ */ D.jsx(
-      Se,
+  }, Q = a && G(H) && !C, O = a || C;
+  return /* @__PURE__ */ b.jsx(He, { fallback: null, children: /* @__PURE__ */ b.jsxs(b.Fragment, { children: [
+    /* @__PURE__ */ b.jsx("div", { draggable: Q, children: /* @__PURE__ */ b.jsx(
+      _e,
       {
-        className: B ? `focused ${G($) ? "draggable" : ""}` : null,
-        src: l,
+        className: O ? `focused ${G(H) ? "draggable" : ""}` : null,
+        src: d,
         altText: t,
         width: o,
         height: n,
         maxWidth: r,
         imageRef: i,
         startCrop: z,
-        setStartCrop: L,
-        isFocused: B,
+        setStartCrop: j,
+        isFocused: O,
         nodeKey: e
       }
     ) }),
-    p && /* @__PURE__ */ D.jsx("div", { className: "image-caption-container", children: /* @__PURE__ */ D.jsx(De, { initialEditor: s, children: /* @__PURE__ */ D.jsx(
-      ye,
+    p && /* @__PURE__ */ b.jsx("div", { className: "image-caption-container", children: /* @__PURE__ */ b.jsx(Ee, { initialEditor: s, children: /* @__PURE__ */ b.jsx(
+      De,
       {
-        contentEditable: /* @__PURE__ */ D.jsx(be, { className: "ImageNode__contentEditable" }),
-        placeholder: /* @__PURE__ */ D.jsx(Re, { className: "ImageNode__placeholder", children: "Enter a caption..." }),
-        ErrorBoundary: Ce
+        contentEditable: /* @__PURE__ */ b.jsx(Me, { className: "ImageNode__contentEditable" }),
+        placeholder: /* @__PURE__ */ b.jsx(Pe, { className: "ImageNode__placeholder", children: "Enter a caption..." }),
+        ErrorBoundary: be
       }
     ) }) }),
-    !z && h && G($) && B && /* @__PURE__ */ D.jsx(
-      Pe,
+    !z && h && G(H) && O && /* @__PURE__ */ b.jsx(
+      ze,
       {
         showCaption: p,
-        setShowCaption: b,
-        editor: x,
-        buttonRef: d,
+        setShowCaption: D,
+        editor: f,
+        buttonRef: l,
         maxWidth: r,
         onResizeStart: z ? () => {
-        } : j,
+        } : B,
         onResizeEnd: z ? () => {
-        } : v,
+        } : A,
         captionsEnabled: !1,
         imageRef: i
       }
@@ -915,7 +933,7 @@ function Ye({
   ] }) });
 }
 export {
-  se as RIGHT_CLICK_IMAGE_COMMAND,
-  Ye as default
+  ce as RIGHT_CLICK_IMAGE_COMMAND,
+  Ae as default
 };
-//# sourceMappingURL=ImageComponent-b85bff9f.js.map
+//# sourceMappingURL=ImageComponent-8ca7cea7.js.map