sykpcomposer 0.0.112 → 0.0.114

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,6 +1,6 @@
1
- import { j as C, u as ae, d as W, w as G, x as q, $ as J, a as te, b as he, c as ce, e as de, C as Y, f as le, k as ge, g as ue, I as pe, r as we, h as me, i as fe, l as xe, t as ye } from "./index-174aeef5.js";
2
- import { u as Ce, d as ve, L as De, P as be } from "./Placeholder-b9109e63.js";
3
- import x, { useRef as I, PureComponent as Re, createRef as ne, useState as K, useCallback as F, useEffect as Z, Suspense as Ee } from "react";
1
+ import { j as C, u as ae, d as U, w as G, x as q, $ as J, a as te, b as he, c as ce, e as de, C as Y, f as le, k as ge, g as ue, I as pe, r as we, h as me, i as xe, l as fe, t as ye } from "./index-f7734e69.js";
2
+ import { u as Ce, d as ve, L as De, P as be } from "./Placeholder-2e2a37c3.js";
3
+ import f, { useRef as I, PureComponent as Re, createRef as ne, useState as K, useCallback as F, useEffect as Z, Suspense as Ee } from "react";
4
4
  import "react-dom";
5
5
  function Q(l, t, e) {
6
6
  return Math.min(Math.max(l, t), e);
@@ -35,8 +35,8 @@ function Me({
35
35
  startWidth: 0,
36
36
  startX: 0,
37
37
  startY: 0
38
- }), d = r.getRootElement(), h = n || (d !== null ? d.getBoundingClientRect().width - 20 : 100), v = d !== null ? d.getBoundingClientRect().height - 20 : 100, D = 100, k = 100, m = (p) => {
39
- const f = p === y.east || p === y.west, w = p === y.north || p === y.south, N = p & y.north && p & y.west || p & y.south && p & y.east, H = f ? "ew" : w ? "ns" : N ? "nwse" : "nesw";
38
+ }), d = r.getRootElement(), h = d !== null ? d.getBoundingClientRect().width - 20 : 100, v = d !== null ? d.getBoundingClientRect().height - 20 : 100, b = 100, k = 100, m = (p) => {
39
+ const x = p === y.east || p === y.west, w = p === y.north || p === y.south, N = p & y.north && p & y.west || p & y.south && p & y.east, H = x ? "ew" : w ? "ns" : N ? "nwse" : "nesw";
40
40
  d !== null && d.style.setProperty(
41
41
  "cursor",
42
42
  `${H}-resize`,
@@ -60,51 +60,51 @@ function Me({
60
60
  c.current.value,
61
61
  c.current.priority
62
62
  ));
63
- }, S = (p, f) => {
63
+ }, $ = (p, x) => {
64
64
  if (!r.isEditable())
65
65
  return;
66
66
  const w = o.current, N = i.current;
67
67
  if (w !== null && N !== null) {
68
68
  p.preventDefault();
69
- const { width: H, height: R } = w.getBoundingClientRect(), E = g.current;
70
- E.startWidth = H, E.startHeight = R, E.ratio = H / R, E.currentWidth = H, E.currentHeight = R, E.startX = p.clientX, E.startY = p.clientY, E.isResizing = !0, E.direction = f, m(f), l(), N.classList.add("image-control-wrapper--resizing"), w.style.height = `${R}px`, w.style.width = `${H}px`, document.addEventListener("pointermove", b), document.addEventListener("pointerup", z);
69
+ const { width: H, height: E } = w.getBoundingClientRect(), D = g.current;
70
+ D.startWidth = H, D.startHeight = E, D.ratio = H / E, D.currentWidth = H, D.currentHeight = E, D.startX = p.clientX, D.startY = p.clientY, D.isResizing = !0, D.direction = x, m(x), l(), N.classList.add("image-control-wrapper--resizing"), w.style.height = `${E}px`, w.style.width = `${H}px`, document.addEventListener("pointermove", R), document.addEventListener("pointerup", z);
71
71
  }
72
- }, b = (p) => {
73
- const f = o.current, w = g.current, N = w.direction & (y.east | y.west), H = w.direction & (y.south | y.north);
74
- if (f !== null && w.isResizing)
72
+ }, R = (p) => {
73
+ const x = o.current, w = g.current, N = w.direction & (y.east | y.west), H = w.direction & (y.south | y.north);
74
+ if (x !== null && w.isResizing)
75
75
  if (N && H) {
76
- let R = Math.floor(w.startX - p.clientX);
77
- R = w.direction & y.east ? -R : R;
78
- const E = Q(
79
- w.startWidth + R,
80
- D,
76
+ let E = Math.floor(w.startX - p.clientX);
77
+ E = w.direction & y.east ? -E : E;
78
+ const D = Q(
79
+ w.startWidth + E,
80
+ b,
81
81
  h
82
- ), T = E / w.ratio;
83
- f.style.width = `${E}px`, f.style.height = `${T}px`, w.currentHeight = T, w.currentWidth = E;
82
+ ), T = D / w.ratio;
83
+ x.style.width = `${D}px`, x.style.height = `${T}px`, w.currentHeight = T, w.currentWidth = D;
84
84
  } else if (H) {
85
- let R = Math.floor(w.startY - p.clientY);
86
- R = w.direction & y.south ? -R : R;
87
- const E = Q(
88
- w.startHeight + R,
85
+ let E = Math.floor(w.startY - p.clientY);
86
+ E = w.direction & y.south ? -E : E;
87
+ const D = Q(
88
+ w.startHeight + E,
89
89
  k,
90
90
  v
91
91
  );
92
- f.style.height = `${E}px`, w.currentHeight = E;
92
+ x.style.height = `${D}px`, w.currentHeight = D;
93
93
  } else {
94
- let R = Math.floor(w.startX - p.clientX);
95
- R = w.direction & y.east ? -R : R;
96
- const E = Q(
97
- w.startWidth + R,
98
- D,
94
+ let E = Math.floor(w.startX - p.clientX);
95
+ E = w.direction & y.east ? -E : E;
96
+ const D = Q(
97
+ w.startWidth + E,
98
+ b,
99
99
  h
100
100
  );
101
- f.style.width = `${E}px`, w.currentWidth = E;
101
+ x.style.width = `${D}px`, x.style.maxWidth = `${D}px`, w.currentWidth = D;
102
102
  }
103
103
  }, z = () => {
104
- const p = o.current, f = g.current, w = i.current;
105
- if (p !== null && w !== null && f.isResizing) {
106
- const N = f.currentWidth, H = f.currentHeight;
107
- 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"), X(), t(N, H), document.removeEventListener("pointermove", b), document.removeEventListener("pointerup", z);
104
+ const p = o.current, x = g.current, w = i.current;
105
+ if (p !== null && w !== null && x.isResizing) {
106
+ const N = x.currentWidth, H = x.currentHeight;
107
+ x.startWidth = 0, x.startHeight = 0, x.ratio = 0, x.startX = 0, x.startY = 0, x.currentWidth = 0, x.currentHeight = 0, x.isResizing = !1, w.classList.remove("image-control-wrapper--resizing"), X(), t(N, H), document.removeEventListener("pointermove", R), document.removeEventListener("pointerup", z);
108
108
  }
109
109
  };
110
110
  return /* @__PURE__ */ C.jsxs("div", { ref: i, children: [
@@ -124,7 +124,7 @@ function Me({
124
124
  {
125
125
  className: "image-resizer image-resizer-n",
126
126
  onPointerDown: (p) => {
127
- S(p, y.north);
127
+ $(p, y.north);
128
128
  }
129
129
  }
130
130
  ),
@@ -133,7 +133,7 @@ function Me({
133
133
  {
134
134
  className: "image-resizer image-resizer-ne",
135
135
  onPointerDown: (p) => {
136
- S(p, y.north | y.east);
136
+ $(p, y.north | y.east);
137
137
  }
138
138
  }
139
139
  ),
@@ -142,7 +142,7 @@ function Me({
142
142
  {
143
143
  className: "image-resizer image-resizer-e",
144
144
  onPointerDown: (p) => {
145
- S(p, y.east);
145
+ $(p, y.east);
146
146
  }
147
147
  }
148
148
  ),
@@ -151,7 +151,7 @@ function Me({
151
151
  {
152
152
  className: "image-resizer image-resizer-se",
153
153
  onPointerDown: (p) => {
154
- S(p, y.south | y.east);
154
+ $(p, y.south | y.east);
155
155
  }
156
156
  }
157
157
  ),
@@ -160,7 +160,7 @@ function Me({
160
160
  {
161
161
  className: "image-resizer image-resizer-s",
162
162
  onPointerDown: (p) => {
163
- S(p, y.south);
163
+ $(p, y.south);
164
164
  }
165
165
  }
166
166
  ),
@@ -169,7 +169,7 @@ function Me({
169
169
  {
170
170
  className: "image-resizer image-resizer-sw",
171
171
  onPointerDown: (p) => {
172
- S(p, y.south | y.west);
172
+ $(p, y.south | y.west);
173
173
  }
174
174
  }
175
175
  ),
@@ -178,7 +178,7 @@ function Me({
178
178
  {
179
179
  className: "image-resizer image-resizer-w",
180
180
  onPointerDown: (p) => {
181
- S(p, y.west);
181
+ $(p, y.west);
182
182
  }
183
183
  }
184
184
  ),
@@ -187,7 +187,7 @@ function Me({
187
187
  {
188
188
  className: "image-resizer image-resizer-nw",
189
189
  onPointerDown: (p) => {
190
- S(p, y.north | y.west);
190
+ $(p, y.north | y.west);
191
191
  }
192
192
  }
193
193
  )
@@ -224,8 +224,8 @@ function ie(l, t, e, o, n, r = 0, a = 0, u = o, s = n) {
224
224
  t && (t > 1 ? (c = a ? a * t : c, g = c / t, d = u * t) : (g = r ? r / t : g, c = g * t, h = s / t)), i.y < 0 && (i.height = Math.max(i.height + i.y, g), i.y = 0), i.x < 0 && (i.width = Math.max(i.width + i.x, c), i.x = 0);
225
225
  const v = o - (i.x + i.width);
226
226
  v < 0 && (i.x = Math.min(i.x, o - c), i.width += v);
227
- const D = n - (i.y + i.height);
228
- if (D < 0 && (i.y = Math.min(i.y, n - g), i.height += D), i.width < c && ((e === "sw" || e == "nw") && (i.x -= c - i.width), i.width = c), i.height < g && ((e === "nw" || e == "ne") && (i.y -= g - i.height), i.height = g), i.width > d && ((e === "sw" || e == "nw") && (i.x -= d - i.width), i.width = d), i.height > h && ((e === "nw" || e == "ne") && (i.y -= h - i.height), i.height = h), t) {
227
+ const b = n - (i.y + i.height);
228
+ if (b < 0 && (i.y = Math.min(i.y, n - g), i.height += b), i.width < c && ((e === "sw" || e == "nw") && (i.x -= c - i.width), i.width = c), i.height < g && ((e === "nw" || e == "ne") && (i.y -= g - i.height), i.height = g), i.width > d && ((e === "sw" || e == "nw") && (i.x -= d - i.width), i.width = d), i.height > h && ((e === "nw" || e == "ne") && (i.y -= h - i.height), i.height = h), t) {
229
229
  const k = i.width / i.height;
230
230
  if (k < t) {
231
231
  const m = Math.max(i.width / t, g);
@@ -268,8 +268,8 @@ const j = class _ extends Re {
268
268
  let s = t.clientX, i = t.clientY, c = r.x, g = r.y;
269
269
  if (a) {
270
270
  const d = t.clientX - n.x, h = t.clientY - n.y;
271
- let v = 0, D = 0;
272
- a === "ne" || a == "e" ? (v = d - (r.x + r.width), D = h - r.y, c = r.x, g = r.y + r.height) : a === "se" || a === "s" ? (v = d - (r.x + r.width), D = h - (r.y + r.height), c = r.x, g = r.y) : a === "sw" || a == "w" ? (v = d - r.x, D = h - (r.y + r.height), c = r.x + r.width, g = r.y) : (a === "nw" || a == "n") && (v = d - r.x, D = h - r.y, c = r.x + r.width, g = r.y + r.height), s = c + n.x + v, i = g + n.y + D;
271
+ let v = 0, b = 0;
272
+ a === "ne" || a == "e" ? (v = d - (r.x + r.width), b = h - r.y, c = r.x, g = r.y + r.height) : a === "se" || a === "s" ? (v = d - (r.x + r.width), b = h - (r.y + r.height), c = r.x, g = r.y) : a === "sw" || a == "w" ? (v = d - r.x, b = h - (r.y + r.height), c = r.x + r.width, g = r.y) : (a === "nw" || a == "n") && (v = d - r.x, b = h - r.y, c = r.x + r.width, g = r.y + r.height), s = c + n.x + v, i = g + n.y + b;
273
273
  }
274
274
  this.evData = {
275
275
  startClientX: s,
@@ -346,8 +346,8 @@ const j = class _ extends Re {
346
346
  t.stopPropagation(), t.preventDefault();
347
347
  else
348
348
  return;
349
- const h = (navigator.platform.match("Mac") ? t.metaKey : t.ctrlKey) ? _.nudgeStepLarge : t.shiftKey ? _.nudgeStepMedium : _.nudgeStep, v = L(n, d.width, d.height), D = He(v, t.key, h, e), k = ie(
350
- D,
349
+ const h = (navigator.platform.match("Mac") ? t.metaKey : t.ctrlKey) ? _.nudgeStepLarge : t.shiftKey ? _.nudgeStepMedium : _.nudgeStep, v = L(n, d.width, d.height), b = He(v, t.key, h, e), k = ie(
350
+ b,
351
351
  o,
352
352
  e,
353
353
  d.width,
@@ -459,7 +459,7 @@ const j = class _ extends Re {
459
459
  crop: a
460
460
  } = this.props, u = this.getCropStyle();
461
461
  if (a)
462
- return /* @__PURE__ */ x.createElement(
462
+ return /* @__PURE__ */ f.createElement(
463
463
  "div",
464
464
  {
465
465
  style: u,
@@ -470,7 +470,7 @@ const j = class _ extends Re {
470
470
  onKeyDown: this.onComponentKeyDown,
471
471
  role: "group"
472
472
  },
473
- !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(
473
+ !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(
474
474
  "div",
475
475
  {
476
476
  className: "ReactCrop__drag-handle ord-nw",
@@ -480,7 +480,7 @@ const j = class _ extends Re {
480
480
  onKeyDown: (s) => this.onHandlerKeyDown(s, "nw"),
481
481
  role: "button"
482
482
  }
483
- ), /* @__PURE__ */ x.createElement(
483
+ ), /* @__PURE__ */ f.createElement(
484
484
  "div",
485
485
  {
486
486
  className: "ReactCrop__drag-handle ord-n",
@@ -490,7 +490,7 @@ const j = class _ extends Re {
490
490
  onKeyDown: (s) => this.onHandlerKeyDown(s, "n"),
491
491
  role: "button"
492
492
  }
493
- ), /* @__PURE__ */ x.createElement(
493
+ ), /* @__PURE__ */ f.createElement(
494
494
  "div",
495
495
  {
496
496
  className: "ReactCrop__drag-handle ord-ne",
@@ -500,7 +500,7 @@ const j = class _ extends Re {
500
500
  onKeyDown: (s) => this.onHandlerKeyDown(s, "ne"),
501
501
  role: "button"
502
502
  }
503
- ), /* @__PURE__ */ x.createElement(
503
+ ), /* @__PURE__ */ f.createElement(
504
504
  "div",
505
505
  {
506
506
  className: "ReactCrop__drag-handle ord-e",
@@ -510,7 +510,7 @@ const j = class _ extends Re {
510
510
  onKeyDown: (s) => this.onHandlerKeyDown(s, "e"),
511
511
  role: "button"
512
512
  }
513
- ), /* @__PURE__ */ x.createElement(
513
+ ), /* @__PURE__ */ f.createElement(
514
514
  "div",
515
515
  {
516
516
  className: "ReactCrop__drag-handle ord-se",
@@ -520,7 +520,7 @@ const j = class _ extends Re {
520
520
  onKeyDown: (s) => this.onHandlerKeyDown(s, "se"),
521
521
  role: "button"
522
522
  }
523
- ), /* @__PURE__ */ x.createElement(
523
+ ), /* @__PURE__ */ f.createElement(
524
524
  "div",
525
525
  {
526
526
  className: "ReactCrop__drag-handle ord-s",
@@ -530,7 +530,7 @@ const j = class _ extends Re {
530
530
  onKeyDown: (s) => this.onHandlerKeyDown(s, "s"),
531
531
  role: "button"
532
532
  }
533
- ), /* @__PURE__ */ x.createElement(
533
+ ), /* @__PURE__ */ f.createElement(
534
534
  "div",
535
535
  {
536
536
  className: "ReactCrop__drag-handle ord-sw",
@@ -540,7 +540,7 @@ const j = class _ extends Re {
540
540
  onKeyDown: (s) => this.onHandlerKeyDown(s, "sw"),
541
541
  role: "button"
542
542
  }
543
- ), /* @__PURE__ */ x.createElement(
543
+ ), /* @__PURE__ */ f.createElement(
544
544
  "div",
545
545
  {
546
546
  className: "ReactCrop__drag-handle ord-w",
@@ -551,8 +551,8 @@ const j = class _ extends Re {
551
551
  role: "button"
552
552
  }
553
553
  )),
554
- n && /* @__PURE__ */ x.createElement("div", { className: "ReactCrop__selection-addon", onPointerDown: (s) => s.stopPropagation() }, n(this.state)),
555
- 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" }))
554
+ n && /* @__PURE__ */ f.createElement("div", { className: "ReactCrop__selection-addon", onPointerDown: (s) => s.stopPropagation() }, n(this.state)),
555
+ 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" }))
556
556
  );
557
557
  }
558
558
  makePixelCrop(t) {
@@ -573,7 +573,7 @@ const j = class _ extends Re {
573
573
  !this.dragStarted && r && !r.width && !r.height && "ReactCrop--invisible-crop",
574
574
  o && "ReactCrop--no-animate"
575
575
  );
576
- return /* @__PURE__ */ x.createElement("div", { ref: this.componentRef, className: h, 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(
576
+ return /* @__PURE__ */ f.createElement("div", { ref: this.componentRef, className: h, 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(
577
577
  "ellipse",
578
578
  {
579
579
  cx: `${r.x + r.width / 2}${r.unit}`,
@@ -582,7 +582,7 @@ const j = class _ extends Re {
582
582
  ry: `${r.height / 2}${r.unit}`,
583
583
  fill: "black"
584
584
  }
585
- ) : /* @__PURE__ */ x.createElement(
585
+ ) : /* @__PURE__ */ f.createElement(
586
586
  "rect",
587
587
  {
588
588
  x: `${r.x}${r.unit}`,
@@ -591,7 +591,7 @@ const j = class _ extends Re {
591
591
  height: `${r.height}${r.unit}`,
592
592
  fill: "black"
593
593
  }
594
- ))), /* @__PURE__ */ x.createElement("rect", { fill: "black", fillOpacity: 0.5, width: "100%", height: "100%", mask: `url(#hole-${this.instanceId})` })) : void 0, d);
594
+ ))), /* @__PURE__ */ f.createElement("rect", { fill: "black", fillOpacity: 0.5, width: "100%", height: "100%", mask: `url(#hole-${this.instanceId})` })) : void 0, d);
595
595
  }
596
596
  };
597
597
  j.xOrds = ["e", "w"], j.yOrds = ["n", "s"], j.xyOrds = ["nw", "ne", "se", "sw"], j.nudgeStep = 1, j.nudgeStepMedium = 10, j.nudgeStepLarge = 100, j.defaultProps = {
@@ -609,7 +609,7 @@ j.xOrds = ["e", "w"], j.yOrds = ["n", "s"], j.xyOrds = ["nw", "ne", "se", "sw"],
609
609
  };
610
610
  let Ne = j;
611
611
  const oe = ye();
612
- function Se({
612
+ function $e({
613
613
  altText: l,
614
614
  className: t,
615
615
  imageRef: e,
@@ -626,31 +626,31 @@ function Se({
626
626
  height: 100
627
627
  }), [i, c] = K(null), [g, d] = K(null), [h, v] = K(!1);
628
628
  I("");
629
- const D = I(null), k = I(null);
629
+ const b = I(null), k = I(null);
630
630
  Z(() => {
631
- i && (D.current = i);
631
+ i && (b.current = i);
632
632
  }, [i]);
633
633
  const m = () => {
634
- v((b) => (b === !1 && s({ aspect: 1, x: 0, y: 0, width: 100, height: 100 }), !b));
635
- }, X = (b) => {
636
- k.current && !k.current.contains(b.target) && (console.log("Outside of the image clicked!"), v(!1));
634
+ v((R) => (R === !1 && s({ aspect: 1, x: 0, y: 0, width: 100, height: 100 }), !R));
635
+ }, X = (R) => {
636
+ k.current && !k.current.contains(R.target) && (console.log("Outside of the image clicked!"), v(!1));
637
637
  };
638
638
  Z(() => (document.addEventListener("mousedown", X), () => {
639
639
  document.removeEventListener("mousedown", X);
640
640
  }), []);
641
- const S = () => {
641
+ const $ = () => {
642
642
  if (i) {
643
- const b = e.current;
644
- if (!b || !i)
643
+ const R = e.current;
644
+ if (!R || !i)
645
645
  return;
646
- const z = b.naturalWidth / b.width, p = b.naturalHeight / b.height, f = new OffscreenCanvas(
646
+ const z = R.naturalWidth / R.width, p = R.naturalHeight / R.height, x = new OffscreenCanvas(
647
647
  i.width * z,
648
648
  i.height * p
649
- ), w = f.getContext("2d");
649
+ ), w = x.getContext("2d");
650
650
  if (!w)
651
651
  throw new Error("No 2D context available");
652
652
  w.drawImage(
653
- b,
653
+ R,
654
654
  i.x * z,
655
655
  i.y * p,
656
656
  i.width * z,
@@ -659,20 +659,20 @@ function Se({
659
659
  0,
660
660
  i.width * z,
661
661
  i.height * p
662
- ), f.convertToBlob({ type: "image/png" }).then((N) => {
662
+ ), x.convertToBlob({ type: "image/png" }).then((N) => {
663
663
  const H = URL.createObjectURL(N);
664
664
  d(H), v(!h), console.log("Updated cropped image:", H);
665
665
  });
666
666
  }
667
667
  };
668
668
  return /* @__PURE__ */ C.jsxs("div", { ref: k, children: [
669
- h ? /* @__PURE__ */ C.jsx("button", { onClick: S, disabled: !i, children: "Apply Crop" }) : /* @__PURE__ */ C.jsx("button", { onClick: m, children: "Enable Crop" }),
669
+ h ? /* @__PURE__ */ C.jsx("button", { onClick: $, disabled: !i, children: "Apply Crop" }) : /* @__PURE__ */ C.jsx("button", { onClick: m, children: "Enable Crop" }),
670
670
  h ? /* @__PURE__ */ C.jsx(
671
671
  Ne,
672
672
  {
673
673
  crop: u,
674
- onChange: (b) => s(b),
675
- onComplete: (b) => c(b),
674
+ onChange: (R) => s(R),
675
+ onComplete: (R) => c(R),
676
676
  children: /* @__PURE__ */ C.jsx(
677
677
  "img",
678
678
  {
@@ -721,31 +721,31 @@ function Xe({
721
721
  caption: s,
722
722
  captionsEnabled: i
723
723
  }) {
724
- const c = I(null), g = I(null), [d, h, v] = Ce(e), [D, k] = K(!1), [m] = ae(), [X, S] = K(null), b = I(null), z = F(
724
+ const c = I(null), g = I(null), [d, h, v] = Ce(e), [b, k] = K(!1), [m] = ae(), [X, $] = K(null), R = I(null), z = F(
725
725
  (P) => {
726
- if (d && W(G())) {
726
+ if (d && U(G())) {
727
727
  P.preventDefault();
728
- const $ = q(e);
729
- if (J($))
730
- return $.remove(), !0;
728
+ const S = q(e);
729
+ if (J(S))
730
+ return S.remove(), !0;
731
731
  }
732
732
  return !1;
733
733
  },
734
734
  [d, e]
735
735
  ), p = F(
736
736
  (P) => {
737
- const M = G(), $ = g.current;
738
- if (d && W(M) && M.getNodes().length === 1) {
737
+ const M = G(), S = g.current;
738
+ if (d && U(M) && M.getNodes().length === 1) {
739
739
  if (u)
740
740
  return te(null), P.preventDefault(), s.focus(), !0;
741
- if ($ !== null && $ !== document.activeElement)
742
- return P.preventDefault(), $.focus(), !0;
741
+ if (S !== null && S !== document.activeElement)
742
+ return P.preventDefault(), S.focus(), !0;
743
743
  }
744
744
  return !1;
745
745
  },
746
746
  [s, d, u]
747
- ), f = F(
748
- (P) => b.current === s || g.current === P.target ? (te(null), m.update(() => {
747
+ ), x = F(
748
+ (P) => R.current === s || g.current === P.target ? (te(null), m.update(() => {
749
749
  h(!0);
750
750
  const M = m.getRootElement();
751
751
  M !== null && M.focus();
@@ -754,9 +754,9 @@ function Xe({
754
754
  ), w = F(
755
755
  (P) => {
756
756
  const M = P;
757
- return D ? !0 : M.target === c.current ? (M.shiftKey ? h(!d) : (v(), h(!0)), !0) : !1;
757
+ return b ? !0 : M.target === c.current ? (M.shiftKey ? h(!d) : (v(), h(!0)), !0) : !1;
758
758
  },
759
- [D, d, h, v]
759
+ [b, d, h, v]
760
760
  ), N = F(
761
761
  (P) => {
762
762
  m.getEditorState().read(() => {
@@ -771,13 +771,13 @@ function Xe({
771
771
  );
772
772
  Z(() => {
773
773
  let P = !0;
774
- const M = m.getRootElement(), $ = ce(
775
- m.registerUpdateListener(({ editorState: U }) => {
776
- P && S(U.read(() => G()));
774
+ const M = m.getRootElement(), S = ce(
775
+ m.registerUpdateListener(({ editorState: W }) => {
776
+ P && $(W.read(() => G()));
777
777
  }),
778
778
  m.registerCommand(
779
779
  me,
780
- (U, se) => (b.current = se, !1),
780
+ (W, se) => (R.current = se, !1),
781
781
  Y
782
782
  ),
783
783
  m.registerCommand(
@@ -792,7 +792,7 @@ function Xe({
792
792
  ),
793
793
  m.registerCommand(
794
794
  pe,
795
- (U) => U.target === c.current ? (U.preventDefault(), !0) : !1,
795
+ (W) => W.target === c.current ? (W.preventDefault(), !0) : !1,
796
796
  Y
797
797
  ),
798
798
  m.registerCommand(
@@ -806,20 +806,20 @@ function Xe({
806
806
  Y
807
807
  ),
808
808
  m.registerCommand(le, p, Y),
809
- m.registerCommand(de, f, Y)
809
+ m.registerCommand(de, x, Y)
810
810
  );
811
811
  return M == null || M.addEventListener("contextmenu", N), () => {
812
- P = !1, $(), M == null || M.removeEventListener("contextmenu", N);
812
+ P = !1, S(), M == null || M.removeEventListener("contextmenu", N);
813
813
  };
814
814
  }, [
815
815
  v,
816
816
  m,
817
- D,
817
+ b,
818
818
  d,
819
819
  e,
820
820
  z,
821
821
  p,
822
- f,
822
+ x,
823
823
  w,
824
824
  N,
825
825
  h
@@ -829,21 +829,21 @@ function Xe({
829
829
  const P = q(e);
830
830
  J(P) && P.setShowCaption(!0);
831
831
  });
832
- }, R = (P, M) => {
832
+ }, E = (P, M) => {
833
833
  setTimeout(() => {
834
834
  k(!1);
835
835
  }, 200), m.update(() => {
836
- const $ = q(e);
837
- J($) && $.setWidthAndHeight(P, M);
836
+ const S = q(e);
837
+ J(S) && S.setWidthAndHeight(P, M);
838
838
  });
839
- }, E = () => {
839
+ }, D = () => {
840
840
  k(!0);
841
- }, T = d && W(X) && !D, ee = d || D;
841
+ }, T = d && U(X) && !b, ee = d || b;
842
842
  return /* @__PURE__ */ C.jsx(Ee, { fallback: null, children: /* @__PURE__ */ C.jsxs(C.Fragment, { children: [
843
843
  /* @__PURE__ */ C.jsx("div", { draggable: T, children: /* @__PURE__ */ C.jsx(
844
- Se,
844
+ $e,
845
845
  {
846
- className: ee ? `focused ${W(X) ? "draggable" : ""}` : null,
846
+ className: ee ? `focused ${U(X) ? "draggable" : ""}` : null,
847
847
  src: l,
848
848
  altText: t,
849
849
  imageRef: c,
@@ -853,14 +853,14 @@ function Xe({
853
853
  }
854
854
  ) }),
855
855
  u && /* @__PURE__ */ C.jsx("div", { className: "image-caption-container", children: /* @__PURE__ */ C.jsx(ve, { initialEditor: s, children: /* @__PURE__ */ C.jsx(
856
- fe,
856
+ xe,
857
857
  {
858
858
  contentEditable: /* @__PURE__ */ C.jsx(De, { className: "ImageNode__contentEditable" }),
859
859
  placeholder: /* @__PURE__ */ C.jsx(be, { className: "ImageNode__placeholder", children: "Enter a caption..." }),
860
- ErrorBoundary: xe
860
+ ErrorBoundary: fe
861
861
  }
862
862
  ) }) }),
863
- a && W(X) && ee && /* @__PURE__ */ C.jsx(
863
+ a && U(X) && ee && /* @__PURE__ */ C.jsx(
864
864
  Me,
865
865
  {
866
866
  showCaption: u,
@@ -869,8 +869,8 @@ function Xe({
869
869
  buttonRef: g,
870
870
  imageRef: c,
871
871
  maxWidth: r,
872
- onResizeStart: E,
873
- onResizeEnd: R,
872
+ onResizeStart: D,
873
+ onResizeEnd: E,
874
874
  captionsEnabled: i
875
875
  }
876
876
  )
@@ -880,4 +880,4 @@ export {
880
880
  oe as RIGHT_CLICK_IMAGE_COMMAND,
881
881
  Xe as default
882
882
  };
883
- //# sourceMappingURL=ImageComponent-a5849aa5.js.map
883
+ //# sourceMappingURL=ImageComponent-3ae69dcc.js.map