mathlean-canvas 0.1.0 → 0.1.1

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.
Files changed (3) hide show
  1. package/README.md +16 -0
  2. package/dist/index.js +2340 -1444
  3. package/package.json +13 -1
package/dist/index.js CHANGED
@@ -1,16 +1,64 @@
1
1
  import { useEffect as e, useLayoutEffect as t, useRef as n, useState as r } from "react";
2
2
  import i from "katex";
3
- import { Arrow as a, Circle as o, Group as s, Layer as c, Line as l, Rect as u, Stage as ee, Text as te, Transformer as ne } from "react-konva";
4
- import { Fragment as re, jsx as d, jsxs as f } from "react/jsx-runtime";
3
+ import { Arrow as a, Circle as o, Group as s, Layer as c, Line as ee, Rect as l, Stage as te, Text as ne, Transformer as re } from "react-konva";
4
+ import { Fragment as ie, jsx as u, jsxs as d } from "react/jsx-runtime";
5
5
  //#region src/MathCanvas.tsx
6
- var p = 44, m = 56, ie = 24, ae = 96, oe = 2, se = 14, ce = 6, le = 12, ue = 10, de = 14, fe = 34, pe = .9, me = 2.2, he = 56, ge = 56, _e = 48, ve = 48, ye = 160, be = 8, xe = 2, h = 8, Se = 26, Ce = 30, g = 14, we = 8, _ = 16, v = "KaTeX_Main, Computer Modern Serif, Latin Modern Roman, Times New Roman, serif", Te = 24, Ee = 18, De = 180, Oe = 280, ke = 92;
7
- function Ae(e) {
6
+ var f = 44, p = 56, ae = 24, oe = 96, se = 2, ce = 14, le = 6, ue = 12, de = 10, fe = [
7
+ 2,
8
+ 4,
9
+ 6,
10
+ 8,
11
+ 12
12
+ ], pe = "#111111", me = "#ffffff", he = [
13
+ "#d14343",
14
+ "#2f6fed",
15
+ "#2f9e44",
16
+ "#c89b0e",
17
+ "#f2d21b"
18
+ ], ge = 14, _e = 34, ve = .9, ye = 2.2, be = 56, xe = 56, Se = 48, Ce = 48, we = 160, Te = 8, Ee = 2, De = 2, Oe = 10, ke = 50, Ae = 26, m = 30, h = 14, je = 8, Me = 16, Ne = "KaTeX_Main, Computer Modern Serif, Latin Modern Roman, Times New Roman, serif", Pe = "SFMono-Regular, Consolas, Liberation Mono, Menlo, Courier New, monospace", Fe = 24, Ie = 18, Le = 180, Re = 280, ze = 92, Be = {
19
+ bg: "#ffffff",
20
+ bgAlt: "#f7f7f8",
21
+ surface: "#ffffff",
22
+ surfaceHover: "#f5f5f5",
23
+ border: "#d9d9d9",
24
+ text: "#111111",
25
+ textMuted: "#666666",
26
+ danger: "#b42318",
27
+ dangerBorder: "#f5c2c7",
28
+ dangerBg: "#fff5f5",
29
+ edge: "#5f5f5f",
30
+ edgeActive: "#111111",
31
+ node: "#555555",
32
+ nodeHover: "#b8b8b8",
33
+ nodeActive: "#8c8c8c",
34
+ eraser: "#7a7a7a"
35
+ }, Ve = {
36
+ bg: "#0d0d0e",
37
+ bgAlt: "#171719",
38
+ surface: "#111112",
39
+ surfaceHover: "#19191b",
40
+ border: "#2b2b2f",
41
+ text: "#e4e4e7",
42
+ textMuted: "#a1a1aa",
43
+ danger: "#f97066",
44
+ dangerBorder: "#7a2e2b",
45
+ dangerBg: "#241415",
46
+ edge: "#8f8f95",
47
+ edgeActive: "#e4e4e7",
48
+ node: "#6d6d73",
49
+ nodeHover: "#a1a1aa",
50
+ nodeActive: "#d4d4d8",
51
+ eraser: "#a1a1aa"
52
+ }, He = 1.5, Ue = 2, We = (e) => e ? "#d6d6dc" : "#bcbcc4", Ge = (e) => e ? "#efeff4" : "#8f8f96", Ke = (e, t) => e ? "#ffffff" : t.text;
53
+ function g(e) {
8
54
  let t = [], n = /(\$\$[\s\S]+?\$\$|\$[^$]+\$)/g, r = 0, i = n.exec(e), a = 0;
9
55
  for (; i;) {
10
56
  i.index > r && t.push({
11
57
  id: `segment-${a++}`,
12
58
  type: "text",
13
- value: e.slice(r, i.index)
59
+ value: e.slice(r, i.index),
60
+ start: r,
61
+ end: i.index
14
62
  });
15
63
  let o = i[0], s = o.startsWith("$$");
16
64
  t.push({
@@ -18,16 +66,20 @@ function Ae(e) {
18
66
  type: "math",
19
67
  value: o.slice(s ? 2 : 1, s ? -2 : -1),
20
68
  fallback: o,
21
- displayMode: s
69
+ displayMode: s,
70
+ start: i.index,
71
+ end: i.index + o.length
22
72
  }), r = i.index + o.length, i = n.exec(e);
23
73
  }
24
74
  return r < e.length && t.push({
25
75
  id: `segment-${a}`,
26
76
  type: "text",
27
- value: e.slice(r)
77
+ value: e.slice(r),
78
+ start: r,
79
+ end: e.length
28
80
  }), t;
29
81
  }
30
- function y({ expression: t, fallback: r, displayMode: a = !1 }) {
82
+ function qe({ expression: t, fallback: r, displayMode: a = !1 }) {
31
83
  let o = n(null);
32
84
  return e(() => {
33
85
  let e = o.current;
@@ -47,7 +99,7 @@ function y({ expression: t, fallback: r, displayMode: a = !1 }) {
47
99
  a,
48
100
  t,
49
101
  r
50
- ]), /* @__PURE__ */ d("span", {
102
+ ]), /* @__PURE__ */ u("span", {
51
103
  ref: o,
52
104
  style: a ? {
53
105
  display: "block",
@@ -55,120 +107,150 @@ function y({ expression: t, fallback: r, displayMode: a = !1 }) {
55
107
  } : void 0
56
108
  });
57
109
  }
58
- function je({ content: e, renderMode: t }) {
59
- return t === "plain" ? /* @__PURE__ */ d(re, { children: e }) : /* @__PURE__ */ d(re, { children: Ae(e).map((e) => e.type === "math" ? /* @__PURE__ */ d(y, {
110
+ function Je({ content: e, renderMode: t }) {
111
+ return t === "plain" ? /* @__PURE__ */ u(ie, { children: e }) : /* @__PURE__ */ u(ie, { children: g(e).map((e) => e.type === "math" ? /* @__PURE__ */ u(qe, {
60
112
  expression: e.value,
61
113
  fallback: e.fallback,
62
114
  displayMode: e.displayMode
63
- }, e.id) : /* @__PURE__ */ d("span", { children: e.value }, e.id)) });
115
+ }, e.id) : /* @__PURE__ */ u("span", { children: e.value }, e.id)) });
64
116
  }
65
- function Me() {
66
- return /* @__PURE__ */ d("svg", {
117
+ function Ye({ content: e, renderMode: t, activeMathStart: n }) {
118
+ return t === "plain" ? /* @__PURE__ */ u(ie, { children: e || " " }) : /* @__PURE__ */ u(ie, { children: g(e).map((e) => e.type === "math" ? /* @__PURE__ */ u("span", {
119
+ "data-math-start": e.start,
120
+ style: n === e.start ? {
121
+ position: "relative",
122
+ display: "inline-block"
123
+ } : void 0,
124
+ children: /* @__PURE__ */ u(qe, {
125
+ expression: e.value,
126
+ fallback: e.fallback,
127
+ displayMode: e.displayMode
128
+ })
129
+ }, e.id) : /* @__PURE__ */ u("span", { children: e.value || " " }, e.id)) });
130
+ }
131
+ function Xe() {
132
+ return /* @__PURE__ */ u("svg", {
67
133
  width: "14",
68
134
  height: "14",
69
135
  viewBox: "0 0 16 16",
70
136
  "aria-hidden": "true",
71
- children: /* @__PURE__ */ d("path", {
137
+ children: /* @__PURE__ */ u("path", {
72
138
  d: "M4.5 4.5 11.5 11.5M11.5 4.5 4.5 11.5",
73
139
  fill: "none",
74
- stroke: "#b42318",
140
+ stroke: "currentColor",
75
141
  strokeWidth: "1.6",
76
142
  strokeLinecap: "round"
77
143
  })
78
144
  });
79
145
  }
80
- function Ne({ active: e }) {
81
- return /* @__PURE__ */ f("svg", {
146
+ function Ze({ active: e }) {
147
+ return /* @__PURE__ */ d("svg", {
82
148
  width: "16",
83
149
  height: "16",
84
150
  viewBox: "0 0 16 16",
85
151
  "aria-hidden": "true",
86
- children: [/* @__PURE__ */ d("path", {
152
+ children: [/* @__PURE__ */ u("path", {
87
153
  d: "M11.8 1.8a1.6 1.6 0 0 1 2.3 2.3l-7.9 7.9-3.3 1 1-3.3 7.9-7.9Z",
88
154
  fill: "none",
89
- stroke: e ? "#fff" : "#111",
155
+ stroke: "currentColor",
90
156
  strokeWidth: "1.4",
91
157
  strokeLinecap: "round",
92
158
  strokeLinejoin: "round"
93
- }), /* @__PURE__ */ d("path", {
159
+ }), /* @__PURE__ */ u("path", {
94
160
  d: "M9.9 3.7l2.4 2.4",
95
161
  fill: "none",
96
- stroke: e ? "#fff" : "#111",
162
+ stroke: "currentColor",
97
163
  strokeWidth: "1.4",
98
164
  strokeLinecap: "round"
99
165
  })]
100
166
  });
101
167
  }
102
- function Pe({ active: e }) {
103
- return /* @__PURE__ */ f("svg", {
168
+ function Qe({ active: e }) {
169
+ return /* @__PURE__ */ d("svg", {
104
170
  width: "16",
105
171
  height: "16",
106
172
  viewBox: "0 0 16 16",
107
173
  "aria-hidden": "true",
108
- children: [/* @__PURE__ */ d("path", {
174
+ children: [/* @__PURE__ */ u("path", {
109
175
  d: "M6.2 2.5a1.8 1.8 0 0 1 2.5 0l4.8 4.8a1.8 1.8 0 0 1 0 2.5l-3.2 3.2H5.5L2.5 10a1.8 1.8 0 0 1 0-2.5l3.7-5Z",
110
176
  fill: "none",
111
- stroke: e ? "#fff" : "#111",
177
+ stroke: "currentColor",
112
178
  strokeWidth: "1.4",
113
179
  strokeLinejoin: "round"
114
- }), /* @__PURE__ */ d("path", {
180
+ }), /* @__PURE__ */ u("path", {
115
181
  d: "M8.4 13h5.1",
116
182
  fill: "none",
117
- stroke: e ? "#fff" : "#111",
183
+ stroke: "currentColor",
118
184
  strokeWidth: "1.4",
119
185
  strokeLinecap: "round"
120
186
  })]
121
187
  });
122
188
  }
123
- function Fe({ active: e }) {
124
- return /* @__PURE__ */ d("svg", {
189
+ function $e({ active: e }) {
190
+ return /* @__PURE__ */ u("svg", {
125
191
  width: "16",
126
192
  height: "16",
127
193
  viewBox: "0 0 16 16",
128
194
  "aria-hidden": "true",
129
- children: /* @__PURE__ */ d("path", {
195
+ children: /* @__PURE__ */ u("path", {
130
196
  d: "M3 2.5v10.8l2.9-3.1 2.2 3.3 1.8-1.1-2.2-3.3H12L3 2.5Z",
131
197
  fill: "none",
132
- stroke: e ? "#fff" : "#111",
198
+ stroke: "currentColor",
133
199
  strokeWidth: "1.4",
134
200
  strokeLinecap: "round",
135
201
  strokeLinejoin: "round"
136
202
  })
137
203
  });
138
204
  }
139
- function Ie() {
140
- return /* @__PURE__ */ d("svg", {
205
+ function et() {
206
+ return /* @__PURE__ */ u("svg", {
141
207
  width: "16",
142
208
  height: "16",
143
209
  viewBox: "0 0 16 16",
144
210
  "aria-hidden": "true",
145
- children: /* @__PURE__ */ d("path", {
211
+ children: /* @__PURE__ */ u("path", {
146
212
  d: "M3.5 4.5h9M6 4.5V3.4c0-.5.4-.9.9-.9h2.2c.5 0 .9.4.9.9v1.1M5 6.5v5.2M8 6.5v5.2M11 6.5v5.2M4.4 4.5l.5 8c0 .6.5 1 1.1 1h4c.6 0 1.1-.4 1.1-1l.5-8",
147
213
  fill: "none",
148
- stroke: "#111",
214
+ stroke: "currentColor",
149
215
  strokeWidth: "1.4",
150
216
  strokeLinecap: "round",
151
217
  strokeLinejoin: "round"
152
218
  })
153
219
  });
154
220
  }
155
- function Le({ active: e }) {
156
- return /* @__PURE__ */ d("svg", {
221
+ function tt({ active: e }) {
222
+ return /* @__PURE__ */ u("svg", {
157
223
  width: "16",
158
224
  height: "16",
159
225
  viewBox: "0 0 16 16",
160
226
  "aria-hidden": "true",
161
- children: /* @__PURE__ */ d("path", {
227
+ children: /* @__PURE__ */ u("path", {
162
228
  d: "M3 4h10M8 4v8M5.5 12h5",
163
229
  fill: "none",
164
- stroke: e ? "#fff" : "#111",
230
+ stroke: "currentColor",
165
231
  strokeWidth: "1.5",
166
232
  strokeLinecap: "round",
167
233
  strokeLinejoin: "round"
168
234
  })
169
235
  });
170
236
  }
171
- function Re({ expression: t, fallback: r, displayMode: a = !1 }) {
237
+ function nt({ active: e }) {
238
+ return /* @__PURE__ */ u("svg", {
239
+ width: "16",
240
+ height: "16",
241
+ viewBox: "0 0 16 16",
242
+ "aria-hidden": "true",
243
+ children: /* @__PURE__ */ u("path", {
244
+ d: "M8 2.2v11.6M2.2 8h11.6M8 2.2 6 4.3M8 2.2l2 2.1M8 13.8l-2-2.1M8 13.8l2-2.1M2.2 8l2.1-2M2.2 8l2.1 2M13.8 8l-2.1-2M13.8 8l-2.1 2",
245
+ fill: "none",
246
+ stroke: "currentColor",
247
+ strokeWidth: "1.25",
248
+ strokeLinecap: "round",
249
+ strokeLinejoin: "round"
250
+ })
251
+ });
252
+ }
253
+ function rt({ expression: t, fallback: r, displayMode: a = !1 }) {
172
254
  let o = n(null);
173
255
  return e(() => {
174
256
  let e = o.current;
@@ -188,7 +270,7 @@ function Re({ expression: t, fallback: r, displayMode: a = !1 }) {
188
270
  a,
189
271
  t,
190
272
  r
191
- ]), /* @__PURE__ */ d("span", {
273
+ ]), /* @__PURE__ */ u("span", {
192
274
  ref: o,
193
275
  style: a ? {
194
276
  display: "block",
@@ -196,19 +278,21 @@ function Re({ expression: t, fallback: r, displayMode: a = !1 }) {
196
278
  } : void 0
197
279
  });
198
280
  }
199
- function ze(e, t) {
281
+ function it(e, t) {
200
282
  let n = /\$([^$]+)\$/g, r = n.exec(e);
201
283
  for (; r;) {
202
284
  let i = r.index, a = i + r[0].length;
203
- if (t > i && t <= a) return {
285
+ if (t > i + 1 && t < a) return {
204
286
  expression: r[1],
205
- fallback: r[1]
287
+ fallback: r[1],
288
+ caretOffset: Math.max(0, Math.min(r[1].length, t - i - 1)),
289
+ start: i
206
290
  };
207
291
  r = n.exec(e);
208
292
  }
209
293
  return null;
210
294
  }
211
- function Be(e, t) {
295
+ function at(e, t) {
212
296
  let n = window.getComputedStyle(e), r = document.createElement("div"), i = document.createElement("span");
213
297
  r.style.position = "absolute", r.style.visibility = "hidden", r.style.pointerEvents = "none", r.style.whiteSpace = n.whiteSpace, r.style.wordBreak = n.wordBreak, r.style.overflowWrap = n.overflowWrap, r.style.font = n.font, r.style.fontFamily = n.fontFamily, r.style.fontSize = n.fontSize, r.style.fontWeight = n.fontWeight, r.style.fontStyle = n.fontStyle, r.style.letterSpacing = n.letterSpacing, r.style.textTransform = n.textTransform, r.style.textIndent = n.textIndent, r.style.padding = n.padding, r.style.border = n.border, r.style.boxSizing = n.boxSizing, r.style.lineHeight = n.lineHeight, r.style.width = n.width, r.style.minHeight = n.height, r.style.overflow = "hidden", r.textContent = e.value.slice(0, t), i.textContent = e.value.slice(t, t + 1) || " ", r.appendChild(i), document.body.appendChild(r);
214
298
  let a = i.offsetLeft - e.scrollLeft, o = i.offsetTop - e.scrollTop;
@@ -217,151 +301,238 @@ function Be(e, t) {
217
301
  top: o
218
302
  };
219
303
  }
220
- function Ve(e) {
221
- if (typeof document > "u") return ae;
222
- let t = document.createElement("canvas").getContext("2d");
223
- if (!t) return ae;
224
- t.font = `${Te}px ${v}`;
225
- let n = Math.max(...e.split("\n").map((e) => t.measureText(e || " ").width), m);
226
- return Math.ceil(n + oe + se + le);
304
+ function ot(e) {
305
+ return st(e, Ne);
306
+ }
307
+ function st(e, t) {
308
+ if (typeof document > "u") return oe;
309
+ let n = document.createElement("canvas").getContext("2d");
310
+ if (!n) return oe;
311
+ n.font = `${Fe}px ${t}`;
312
+ let r = Math.max(...e.split("\n").map((e) => n.measureText(e || " ").width), p);
313
+ return Math.ceil(r + se + ce + ue);
314
+ }
315
+ function ct(e) {
316
+ if (!e.trim()) return !1;
317
+ try {
318
+ return i.renderToString(e, {
319
+ throwOnError: !0,
320
+ strict: "ignore"
321
+ }), !0;
322
+ } catch {
323
+ return !1;
324
+ }
325
+ }
326
+ function lt({ value: e, valid: t, dataAttributes: n, colors: r, inputRef: i, onChange: a, onBlur: o, onMouseDown: s, onClick: c, onFocus: ee, onKeyDown: l, minWidth: te }) {
327
+ return /* @__PURE__ */ d("div", {
328
+ style: {
329
+ position: "relative",
330
+ width: "100%",
331
+ minWidth: `${te}px`,
332
+ height: `${m}px`,
333
+ background: "transparent"
334
+ },
335
+ children: [t && /* @__PURE__ */ u("div", {
336
+ style: {
337
+ position: "absolute",
338
+ inset: 0,
339
+ display: "flex",
340
+ alignItems: "center",
341
+ justifyContent: "center",
342
+ pointerEvents: "none",
343
+ overflow: "hidden",
344
+ color: r.text
345
+ },
346
+ children: /* @__PURE__ */ u(rt, {
347
+ expression: e,
348
+ fallback: e
349
+ })
350
+ }), /* @__PURE__ */ u("input", {
351
+ ref: i,
352
+ ...n,
353
+ value: e,
354
+ onChange: a,
355
+ onBlur: o,
356
+ onMouseDown: s,
357
+ onClick: c,
358
+ onFocus: ee,
359
+ onKeyDown: l,
360
+ style: {
361
+ width: "100%",
362
+ minWidth: `${te}px`,
363
+ height: `${m}px`,
364
+ border: "none",
365
+ outline: "none",
366
+ textAlign: "center",
367
+ fontSize: 16,
368
+ fontFamily: Ne,
369
+ boxSizing: "border-box",
370
+ background: "transparent",
371
+ color: t ? "transparent" : r.text,
372
+ caretColor: r.text,
373
+ padding: `0 ${je}px`
374
+ }
375
+ })]
376
+ });
227
377
  }
228
- function He({ active: e }) {
229
- let t = e ? "#fff" : "#111";
230
- return /* @__PURE__ */ f("svg", {
378
+ function ut({ active: e }) {
379
+ return /* @__PURE__ */ d("svg", {
231
380
  width: "16",
232
381
  height: "16",
233
382
  viewBox: "0 0 16 16",
234
383
  "aria-hidden": "true",
235
384
  children: [
236
- /* @__PURE__ */ d("path", {
385
+ /* @__PURE__ */ u("path", {
237
386
  d: "M4 4.5h8M4.8 11.2 8 4.8M11.2 11.2 8 4.8",
238
387
  fill: "none",
239
- stroke: t,
388
+ stroke: "currentColor",
240
389
  strokeWidth: "1.25",
241
390
  strokeLinecap: "round"
242
391
  }),
243
- /* @__PURE__ */ d("circle", {
392
+ /* @__PURE__ */ u("circle", {
244
393
  cx: "8",
245
394
  cy: "4",
246
395
  r: "1.8",
247
396
  fill: "none",
248
- stroke: t,
397
+ stroke: "currentColor",
249
398
  strokeWidth: "1.25"
250
399
  }),
251
- /* @__PURE__ */ d("circle", {
400
+ /* @__PURE__ */ u("circle", {
252
401
  cx: "4.5",
253
402
  cy: "11.5",
254
403
  r: "1.8",
255
404
  fill: "none",
256
- stroke: t,
405
+ stroke: "currentColor",
257
406
  strokeWidth: "1.25"
258
407
  }),
259
- /* @__PURE__ */ d("circle", {
408
+ /* @__PURE__ */ u("circle", {
260
409
  cx: "11.5",
261
410
  cy: "11.5",
262
411
  r: "1.8",
263
412
  fill: "none",
264
- stroke: t,
413
+ stroke: "currentColor",
265
414
  strokeWidth: "1.25"
266
415
  })
267
416
  ]
268
417
  });
269
418
  }
270
- function Ue({ active: e }) {
271
- let t = e ? "#fff" : "#111";
272
- return /* @__PURE__ */ f("svg", {
419
+ function dt({ active: e }) {
420
+ return /* @__PURE__ */ d("svg", {
273
421
  width: "16",
274
422
  height: "16",
275
423
  viewBox: "0 0 16 16",
276
424
  "aria-hidden": "true",
277
- children: [/* @__PURE__ */ d("path", {
425
+ children: [/* @__PURE__ */ u("path", {
278
426
  d: "M4 2.5H2.8v11H4M12 2.5h1.2v11H12",
279
427
  fill: "none",
280
- stroke: t,
428
+ stroke: "currentColor",
281
429
  strokeWidth: "1.3",
282
430
  strokeLinecap: "round"
283
- }), /* @__PURE__ */ d("path", {
431
+ }), /* @__PURE__ */ u("path", {
284
432
  d: "M6 5.2h1.6M8.4 5.2H10M6 8h1.6M8.4 8H10M6 10.8h1.6M8.4 10.8H10",
285
433
  fill: "none",
286
- stroke: t,
434
+ stroke: "currentColor",
287
435
  strokeWidth: "1.3",
288
436
  strokeLinecap: "round"
289
437
  })]
290
438
  });
291
439
  }
292
- function We({ active: e }) {
293
- let t = e ? "#fff" : "#111";
294
- return /* @__PURE__ */ f("svg", {
440
+ function ft({ active: e }) {
441
+ return /* @__PURE__ */ d("svg", {
442
+ width: "16",
443
+ height: "16",
444
+ viewBox: "0 0 16 16",
445
+ "aria-hidden": "true",
446
+ children: [/* @__PURE__ */ u("rect", {
447
+ x: "2.5",
448
+ y: "3",
449
+ width: "11",
450
+ height: "10",
451
+ rx: "1.5",
452
+ fill: "none",
453
+ stroke: "currentColor",
454
+ strokeWidth: "1.2"
455
+ }), /* @__PURE__ */ u("path", {
456
+ d: "M2.8 6.3h10.4M2.8 9.7h10.4M6 3.3v9.4M9.9 3.3v9.4",
457
+ fill: "none",
458
+ stroke: "currentColor",
459
+ strokeWidth: "1.2",
460
+ strokeLinecap: "round"
461
+ })]
462
+ });
463
+ }
464
+ function pt({ active: e }) {
465
+ return /* @__PURE__ */ d("svg", {
295
466
  width: "16",
296
467
  height: "16",
297
468
  viewBox: "0 0 16 16",
298
469
  "aria-hidden": "true",
299
- children: [/* @__PURE__ */ d("path", {
470
+ children: [/* @__PURE__ */ u("path", {
300
471
  d: "M3 4.5h10M3 8h5.5M9.8 8h3.2M3 11.5h10",
301
472
  fill: "none",
302
- stroke: t,
473
+ stroke: "currentColor",
303
474
  strokeWidth: "1.3",
304
475
  strokeLinecap: "round"
305
- }), /* @__PURE__ */ d("circle", {
476
+ }), /* @__PURE__ */ u("circle", {
306
477
  cx: "8",
307
478
  cy: "8",
308
479
  r: "0.8",
309
- fill: t
480
+ fill: "currentColor"
310
481
  })]
311
482
  });
312
483
  }
313
- function Ge({ active: e }) {
314
- return /* @__PURE__ */ d("svg", {
484
+ function mt({ active: e }) {
485
+ return /* @__PURE__ */ u("svg", {
315
486
  width: "16",
316
487
  height: "16",
317
488
  viewBox: "0 0 16 16",
318
489
  "aria-hidden": "true",
319
- children: /* @__PURE__ */ d("text", {
490
+ children: /* @__PURE__ */ u("text", {
320
491
  x: "8",
321
492
  y: "11.5",
322
493
  textAnchor: "middle",
323
494
  fontSize: "12",
324
495
  fontStyle: "italic",
325
- fontFamily: v,
326
- fill: e ? "#fff" : "#111",
496
+ fontFamily: Ne,
497
+ fill: "currentColor",
327
498
  children: "x"
328
499
  })
329
500
  });
330
501
  }
331
- function Ke({ active: e }) {
332
- return /* @__PURE__ */ d("svg", {
502
+ function ht({ active: e }) {
503
+ return /* @__PURE__ */ u("svg", {
333
504
  width: "16",
334
505
  height: "16",
335
506
  viewBox: "0 0 16 16",
336
507
  "aria-hidden": "true",
337
- children: /* @__PURE__ */ d("path", {
508
+ children: /* @__PURE__ */ u("path", {
338
509
  d: "M6 4 3 7l3 3M3.5 7H9a3.5 3.5 0 1 1 0 7H7",
339
510
  fill: "none",
340
- stroke: e ? "#fff" : "#111",
511
+ stroke: "currentColor",
341
512
  strokeWidth: "1.4",
342
513
  strokeLinecap: "round",
343
514
  strokeLinejoin: "round"
344
515
  })
345
516
  });
346
517
  }
347
- function qe({ active: e }) {
348
- return /* @__PURE__ */ d("svg", {
518
+ function gt({ active: e }) {
519
+ return /* @__PURE__ */ u("svg", {
349
520
  width: "16",
350
521
  height: "16",
351
522
  viewBox: "0 0 16 16",
352
523
  "aria-hidden": "true",
353
- children: /* @__PURE__ */ d("path", {
524
+ children: /* @__PURE__ */ u("path", {
354
525
  d: "m10 4 3 3-3 3M12.5 7H7a3.5 3.5 0 1 0 0 7h2",
355
526
  fill: "none",
356
- stroke: e ? "#fff" : "#111",
527
+ stroke: "currentColor",
357
528
  strokeWidth: "1.4",
358
529
  strokeLinecap: "round",
359
530
  strokeLinejoin: "round"
360
531
  })
361
532
  });
362
533
  }
363
- function b({ active: e, disabled: t = !1, label: n, onClick: r, children: i }) {
364
- return /* @__PURE__ */ d("button", {
534
+ function _({ active: e, disabled: t = !1, label: n, onClick: r, children: i, colors: a }) {
535
+ return /* @__PURE__ */ u("button", {
365
536
  type: "button",
366
537
  disabled: t,
367
538
  onClick: r,
@@ -369,10 +540,10 @@ function b({ active: e, disabled: t = !1, label: n, onClick: r, children: i }) {
369
540
  title: n,
370
541
  style: {
371
542
  padding: "6px 10px",
372
- border: "1px solid #cfcfcf",
543
+ border: `1px solid ${a.border}`,
373
544
  borderRadius: 6,
374
- background: e ? "#111" : "#fff",
375
- color: e ? "#fff" : "#111",
545
+ background: e ? a.text : a.surface,
546
+ color: e ? a.bg : a.text,
376
547
  cursor: t ? "not-allowed" : "pointer",
377
548
  opacity: t ? .45 : 1,
378
549
  display: "flex",
@@ -382,37 +553,54 @@ function b({ active: e, disabled: t = !1, label: n, onClick: r, children: i }) {
382
553
  children: i
383
554
  });
384
555
  }
385
- function x() {
386
- let [i, Ae] = r([]), [y, x] = r([]), [Je, Ye] = r([]), [Xe, Ze] = r([]), [S, Qe] = r([]), [$e, et] = r([]), [C, tt] = r("pen"), [nt, rt] = r("plain"), [w, T] = r(null), [E, D] = r(null), [O, k] = r(null), [A, j] = r(null), [M, N] = r(null), [P, it] = r(null), [at, ot] = r(""), [st, ct] = r(0), [lt, ut] = r(null), [F, dt] = r(null), [ft, pt] = r(""), [I, mt] = r(null), [ht, L] = r(null), [R, gt] = r(null), [_t, vt] = r(""), [z, B] = r(null), [yt, bt] = r(null), [V, xt] = r({
556
+ function _t({ darkMode: i = !1 }) {
557
+ let g = i ? Ve : Be, qe = i ? me : pe, st = [qe, ...he], [_t, vt] = r([]), [v, yt] = r([]), [bt, xt] = r([]), [St, Ct] = r([]), [y, wt] = r([]), [Tt, Et] = r([]), [Dt, Ot] = r([]), [b, kt] = r("pen"), [At, jt] = r("latex"), [Mt, Nt] = r(4), [Pt, Ft] = r(qe), [It, Lt] = r(!1), [Rt, x] = r(null), [S, C] = r(null), [w, T] = r(null), [E, D] = r(null), [O, k] = r(null), [A, j] = r(null), [M, zt] = r(null), [Bt, Vt] = r(""), [Ht, Ut] = r(0), [N, Wt] = r(null), [Gt, Kt] = r(null), [P, qt] = r(null), [Jt, Yt] = r(""), [F, Xt] = r(null), [Zt, I] = r(null), [L, Qt] = r(null), [$t, R] = r(null), [z, en] = r(null), [tn, nn] = r(""), [rn, an] = r(null), [B, V] = r(null), [on, sn] = r(null), [cn, ln] = r({
558
+ x: 0,
559
+ y: 0
560
+ }), [H, un] = r({
387
561
  width: window.innerWidth,
388
562
  height: window.innerHeight
389
- }), [St, Ct] = r(p), [wt, Tt] = r(ae), [Et, Dt] = r({}), [Ot, kt] = r({}), [At, jt] = r([]), [Mt, Nt] = r([]), [Pt, Ft] = r({
563
+ }), [dn, fn] = r(f), [pn, mn] = r(oe), [hn, gn] = r({}), [_n, vn] = r({}), [yn, bn] = r([]), [xn, Sn] = r([]), [Cn, wn] = r({
390
564
  x: 0,
391
565
  y: 0,
392
- radius: de,
566
+ radius: ge,
393
567
  visible: !1
394
- }), H = n(!1), U = n(!1), It = n(1), Lt = n(null), Rt = n(null), zt = n(null), Bt = n(null), Vt = n(null), Ht = n({}), Ut = n({}), Wt = n({}), Gt = n({}), Kt = n({}), qt = n({}), Jt = n(null), Yt = n(null), Xt = n({}), Zt = n(null);
568
+ }), U = n(!1), W = n(!1), Tn = n(!1), En = n(1), Dn = n(null), On = n(null), kn = n(null), An = n(null), jn = n(null), Mn = n(null), Nn = n(null), Pn = n(null), Fn = n({}), In = n({}), Ln = n({}), Rn = n({}), zn = n({}), Bn = n({}), Vn = n({}), Hn = n({}), Un = n(null), Wn = n(null), Gn = n(null), Kn = n({}), qn = n({}), Jn = n(null);
395
569
  e(() => {
396
570
  let e = () => {
397
- xt({
571
+ un({
398
572
  width: window.innerWidth,
399
573
  height: window.innerHeight
400
574
  });
401
575
  };
402
576
  return window.addEventListener("resize", e), () => window.removeEventListener("resize", e);
577
+ }, []), e(() => {
578
+ Ft((e) => e === pe || e === me ? qe : e);
579
+ }, [qe]), e(() => () => {
580
+ kn.current !== null && window.clearTimeout(kn.current);
403
581
  }, []), t(() => {
582
+ if (!M) return;
583
+ let e = Un.current;
584
+ if (!e) return;
585
+ let t = window.requestAnimationFrame(() => {
586
+ e.focus();
587
+ let t = e.value.length;
588
+ e.setSelectionRange(t, t), Ut(t), fn(Math.max(e.scrollHeight, f));
589
+ });
590
+ return () => window.cancelAnimationFrame(t);
591
+ }, [M]), t(() => {
404
592
  if (!P) return;
405
- let e = Jt.current;
593
+ let e = Gn.current;
406
594
  if (!e) return;
407
595
  let t = window.requestAnimationFrame(() => {
408
596
  e.focus();
409
597
  let t = e.value.length;
410
- e.setSelectionRange(t, t), ct(t), Ct(Math.max(e.scrollHeight, p));
598
+ e.setSelectionRange(t, t);
411
599
  });
412
600
  return () => window.cancelAnimationFrame(t);
413
601
  }, [P]), t(() => {
414
- if (!F) return;
415
- let e = Yt.current;
602
+ if (!F || !Zt) return;
603
+ let e = Kn.current[`${F}-${Zt.row}-${Zt.col}`];
416
604
  if (!e) return;
417
605
  let t = window.requestAnimationFrame(() => {
418
606
  e.focus();
@@ -420,9 +608,9 @@ function x() {
420
608
  e.setSelectionRange(t, t);
421
609
  });
422
610
  return () => window.cancelAnimationFrame(t);
423
- }, [F]), t(() => {
424
- if (!I || !ht) return;
425
- let e = Xt.current[`${I}-${ht.row}-${ht.col}`];
611
+ }, [F, Zt]), t(() => {
612
+ if (!L || !$t) return;
613
+ let e = qn.current[`${L}-${$t.row}-${$t.col}`];
426
614
  if (!e) return;
427
615
  let t = window.requestAnimationFrame(() => {
428
616
  e.focus();
@@ -430,9 +618,9 @@ function x() {
430
618
  e.setSelectionRange(t, t);
431
619
  });
432
620
  return () => window.cancelAnimationFrame(t);
433
- }, [I, ht]), t(() => {
434
- if (!R) return;
435
- let e = Zt.current;
621
+ }, [L, $t]), t(() => {
622
+ if (!z) return;
623
+ let e = Jn.current;
436
624
  if (!e) return;
437
625
  let t = window.requestAnimationFrame(() => {
438
626
  e.focus();
@@ -440,193 +628,323 @@ function x() {
440
628
  e.setSelectionRange(t, t);
441
629
  });
442
630
  return () => window.cancelAnimationFrame(t);
443
- }, [R]), e(() => {
444
- let e = Jt.current;
445
- !e || !P || (Ct(Math.max(e.scrollHeight, p)), Tt(Math.max(m, e.scrollWidth + le)));
446
- }, [at, P]), t(() => {
447
- if (!P || !Jt.current) {
448
- ut(null);
631
+ }, [z]), t(() => {
632
+ if (!z) {
633
+ an(null);
634
+ return;
635
+ }
636
+ let e = or(z);
637
+ if (!e) {
638
+ an(null);
639
+ return;
640
+ }
641
+ let t = {
642
+ ...e,
643
+ content: tn
644
+ }, n = Math.max(1, tn.split("\n").filter((e) => e.trim().length > 0).length), r = Math.max(0, n - 3) * 20;
645
+ an({
646
+ expression: lr(t),
647
+ fallback: tn,
648
+ left: e.x,
649
+ top: Math.max(8, e.y - de - 84 - r)
650
+ });
651
+ }, [
652
+ z,
653
+ tn,
654
+ Dt
655
+ ]), e(() => {
656
+ let e = Un.current;
657
+ !e || !M || (fn(Math.max(e.scrollHeight, f)), mn(Math.max(p, e.scrollWidth + ue)));
658
+ }, [Bt, M]), t(() => {
659
+ if (!M || !Un.current) {
660
+ Wt(null);
449
661
  return;
450
662
  }
451
- let e = y.find((e) => e.id === P);
663
+ let e = v.find((e) => e.id === M);
452
664
  if (!e || e.renderMode !== "latex") {
453
- ut(null);
665
+ Wt(null);
454
666
  return;
455
667
  }
456
- let t = ze(at, st);
668
+ let t = it(Bt, Ht);
457
669
  if (!t) {
458
- ut(null);
670
+ Wt(null);
459
671
  return;
460
672
  }
461
- let n = Be(Jt.current, st);
462
- ut({
673
+ let n = at(Un.current, Ht);
674
+ Wt({
463
675
  expression: t.expression,
464
676
  fallback: t.fallback,
677
+ caretOffset: t.caretOffset,
678
+ start: t.start,
465
679
  left: e.x + Math.max(12, n.left),
466
- top: Math.max(8, e.y - ue)
680
+ top: Math.max(8, e.y - de)
467
681
  });
468
682
  }, [
469
- y,
470
- P,
471
- st,
472
- at
683
+ v,
684
+ M,
685
+ Ht,
686
+ Bt
687
+ ]), t(() => {
688
+ let e = tr(M);
689
+ if (!M || !e || e.renderMode !== "latex" || !N || !Wn.current) {
690
+ Kt(null);
691
+ return;
692
+ }
693
+ let t = Wn.current, n = t.querySelector(`[data-math-start="${N.start ?? -1}"]`);
694
+ if (!n) {
695
+ Kt(null);
696
+ return;
697
+ }
698
+ let r = t.getBoundingClientRect(), i = n.getBoundingClientRect(), a = Math.max(N.fallback.length, 1), o = Math.max(0, Math.min(1, (N.caretOffset ?? 0) / a));
699
+ Kt({
700
+ left: i.left - r.left + i.width * o,
701
+ top: i.top - r.top,
702
+ height: Math.max(18, i.height)
703
+ });
704
+ }, [
705
+ v,
706
+ M,
707
+ N
473
708
  ]), t(() => {
474
709
  let e = {}, t = {};
475
- for (let n of y) {
476
- let r = Math.max(m, V.width - n.x - ie);
477
- if (n.id === P) {
478
- e[n.id] = Math.max(St, p), t[n.id] = Math.min(Math.max(wt, m), r);
710
+ for (let n of v) {
711
+ let r = Math.max(p, H.width - n.x - ae);
712
+ if (n.id === M) {
713
+ e[n.id] = Math.max(dn, f), t[n.id] = Math.min(Math.max(pn, p), r);
479
714
  continue;
480
715
  }
481
- let i = Kt.current[n.id];
482
- e[n.id] = Math.max(i?.offsetHeight ?? p, n.height, p), t[n.id] = Math.min(Math.max((i?.scrollWidth ?? n.width) + le, m), r);
716
+ let i = Bn.current[n.id];
717
+ e[n.id] = Math.max(i?.offsetHeight ?? f, n.height, f), t[n.id] = Math.min(Math.max((i?.scrollWidth ?? n.width) + ue, p), r);
483
718
  }
484
- Dt((t) => Object.keys(t).length === Object.keys(e).length && Object.entries(e).every(([e, n]) => t[e] === n) ? t : e), kt((e) => Object.keys(e).length === Object.keys(t).length && Object.entries(t).every(([t, n]) => e[t] === n) ? e : t);
719
+ gn((t) => Object.keys(t).length === Object.keys(e).length && Object.entries(e).every(([e, n]) => t[e] === n) ? t : e), vn((e) => Object.keys(e).length === Object.keys(t).length && Object.entries(t).every(([t, n]) => e[t] === n) ? e : t);
485
720
  }, [
486
- y,
487
- P,
488
- St,
489
- wt,
490
- V.width
721
+ v,
722
+ M,
723
+ dn,
724
+ pn,
725
+ H.width
491
726
  ]), e(() => {
492
- let e = Rt.current;
727
+ let e = An.current;
493
728
  e && (e.nodes([]), e.getLayer()?.batchDraw());
494
729
  }, [
495
- w,
496
- C,
497
- y,
498
- Et
730
+ Rt,
731
+ b,
732
+ v,
733
+ hn
734
+ ]), e(() => {
735
+ let e = jn.current;
736
+ if (!e) return;
737
+ if (b !== "graph" && b !== "select" || !S) {
738
+ e.nodes([]), e.getLayer()?.batchDraw();
739
+ return;
740
+ }
741
+ let t = In.current[S];
742
+ e.nodes(t ? [t] : []), e.getLayer()?.batchDraw();
743
+ }, [
744
+ bt,
745
+ S,
746
+ b
499
747
  ]), e(() => {
500
- let e = zt.current;
748
+ let e = Mn.current;
501
749
  if (!e) return;
502
- if (C !== "graph" && C !== "select" || !E) {
750
+ if (b !== "matrix" && b !== "select" || !E) {
503
751
  e.nodes([]), e.getLayer()?.batchDraw();
504
752
  return;
505
753
  }
506
- let t = Ut.current[E];
754
+ let t = Ln.current[E];
507
755
  e.nodes(t ? [t] : []), e.getLayer()?.batchDraw();
508
756
  }, [
509
- Je,
757
+ y,
510
758
  E,
511
- C
759
+ b
512
760
  ]), e(() => {
513
- let e = Bt.current;
761
+ let e = Nn.current;
514
762
  if (!e) return;
515
- if (C !== "matrix" && C !== "select" || !A) {
763
+ if (b !== "table" && b !== "select" || !O) {
516
764
  e.nodes([]), e.getLayer()?.batchDraw();
517
765
  return;
518
766
  }
519
- let t = Wt.current[A];
767
+ let t = Rn.current[O];
520
768
  e.nodes(t ? [t] : []), e.getLayer()?.batchDraw();
521
769
  }, [
522
- S,
523
- A,
524
- C
770
+ Tt,
771
+ O,
772
+ b
525
773
  ]), e(() => {
526
- let e = Vt.current;
774
+ let e = Pn.current;
527
775
  if (!e) return;
528
- if (C !== "align" && C !== "select" || !M) {
776
+ if (b !== "align" && b !== "select" || !A) {
529
777
  e.nodes([]), e.getLayer()?.batchDraw();
530
778
  return;
531
779
  }
532
- let t = Gt.current[M];
780
+ let t = zn.current[A];
533
781
  e.nodes(t ? [t] : []), e.getLayer()?.batchDraw();
534
782
  }, [
535
- $e,
536
- M,
537
- C
783
+ Dt,
784
+ A,
785
+ b
538
786
  ]);
539
- let W = () => `block-${It.current++}`, Qt = () => ({
540
- strokes: i,
541
- blocks: y,
542
- graphNodes: Je,
543
- graphEdges: Xe,
544
- matrices: S,
545
- alignBlocks: $e,
546
- renderMode: nt
787
+ let Yn = () => `block-${En.current++}`, Xn = (e) => {
788
+ let t = e?.getPointerPosition();
789
+ return t ? {
790
+ x: t.x - cn.x,
791
+ y: t.y - cn.y
792
+ } : null;
793
+ }, Zn = () => ({
794
+ strokes: _t,
795
+ blocks: v,
796
+ graphNodes: bt,
797
+ graphEdges: St,
798
+ matrices: y,
799
+ tables: Tt,
800
+ alignBlocks: Dt,
801
+ renderMode: At
547
802
  }), G = () => {
548
- dt(null), pt("");
803
+ qt(null), Yt("");
549
804
  }, K = () => {
550
- mt(null), L(null);
805
+ Xt(null), I(null);
806
+ }, Qn = () => {
807
+ Qt(null), R(null);
551
808
  }, q = () => {
552
- gt(null), vt("");
809
+ en(null), nn(""), an(null);
553
810
  }, J = () => {
554
- D(null), k(null), B(null);
811
+ C(null), T(null), V(null);
555
812
  }, Y = () => {
556
- j(null);
813
+ D(null);
814
+ }, $n = () => {
815
+ k(null);
557
816
  }, X = () => {
558
- N(null);
559
- }, $t = (e) => {
560
- Ae(e.strokes), x(e.blocks), Ye(e.graphNodes), Ze(e.graphEdges), Qe(e.matrices), et(e.alignBlocks), rt(e.renderMode), T(null), Q(), G(), J(), K(), Y(), q(), X(), H.current = !1;
817
+ j(null);
818
+ }, er = (e) => {
819
+ vt(e.strokes), yt(e.blocks), xt(e.graphNodes), Ct(e.graphEdges), wt(e.matrices), Et(e.tables), Ot(e.alignBlocks), jt(e.renderMode), x(null), Q(), G(), J(), K(), Y(), Qn(), $n(), q(), X(), U.current = !1;
561
820
  }, Z = () => {
562
- jt((e) => [...e, Qt()]), Nt([]);
563
- }, en = (e) => e ? y.find((t) => t.id === e) ?? null : null, tn = (e, t) => {
564
- x((n) => n.map((n) => n.id === e ? t(n) : n));
565
- }, nn = (e) => e ? Je.find((t) => t.id === e) ?? null : null, rn = (e) => e ? S.find((t) => t.id === e) ?? null : null, an = (e) => e ? $e.find((t) => t.id === e) ?? null : null, on = (e, t) => {
566
- et((n) => n.map((n) => n.id === e ? t(n) : n));
567
- }, sn = (e) => `\\begin{aligned}[t]${e.content.split("\n").map((e) => e.trim()).filter(Boolean).map((t) => {
568
- if (e.alignMode === "token" && e.alignToken) {
569
- let n = t.indexOf(e.alignToken);
570
- if (n >= 0) return `${t.slice(0, n)}&${t.slice(n)}`;
571
- }
572
- return t;
573
- }).join(" \\\\ ") || "\\,"}\\end{aligned}`, cn = (e, t) => Array.from({ length: e }, () => Array.from({ length: t }, () => "")), ln = (e, t, n, r = "") => Array.from({ length: t }, (t, i) => Array.from({ length: n }, (t, n) => e[i]?.[n] ?? r)), un = (e, t) => e.filter((e) => e >= 0 && e < t), dn = (e) => Array.from({ length: e.cols }, (t, n) => {
821
+ bn((e) => [...e, Zn()]), Sn([]);
822
+ }, tr = (e) => e ? v.find((t) => t.id === e) ?? null : null, nr = (e, t) => {
823
+ yt((n) => n.map((n) => n.id === e ? t(n) : n));
824
+ }, rr = (e) => e ? bt.find((t) => t.id === e) ?? null : null, ir = (e) => e ? y.find((t) => t.id === e) ?? null : null, ar = (e) => e ? Tt.find((t) => t.id === e) ?? null : null, or = (e) => e ? Dt.find((t) => t.id === e) ?? null : null, sr = (e, t) => {
825
+ Ot((n) => n.map((n) => n.id === e ? t(n) : n));
826
+ }, cr = (e, t) => {
827
+ Et((n) => n.map((n) => n.id === e ? t(n) : n));
828
+ }, lr = (e) => {
829
+ let t = e.content.split("\n").map((e) => e.trim()).filter(Boolean), n = t.map((t) => {
830
+ if (t.includes("&")) return t;
831
+ if (e.alignMode === "token" && e.alignToken) {
832
+ let n = t.indexOf(e.alignToken);
833
+ if (n >= 0) return `${t.slice(0, n)}&${t.slice(n)}`;
834
+ }
835
+ return t;
836
+ }).join(" \\\\ ");
837
+ return t.some((e) => e.includes("&")) || e.alignMode === "token" ? `\\begin{aligned}${n || "\\,"}\\end{aligned}` : `\\begin{array}{l}${n || "\\,"}\\end{array}`;
838
+ }, ur = (e, t) => Array.from({ length: e }, () => Array.from({ length: t }, () => "")), dr = (e, t, n, r = "") => Array.from({ length: t }, (t, i) => Array.from({ length: n }, (t, n) => e[i]?.[n] ?? r)), fr = (e, t) => e.filter((e) => e >= 0 && e < t), pr = (e) => Array.from({ length: e.cols }, (t, n) => {
574
839
  let r = Math.max(1, ...e.cells.map((e) => e[n]?.trim().length ?? 0));
575
- return Math.max(Se, r * 9 + we * 2);
576
- }), fn = (e) => dn(e).reduce((e, t) => e + t, 0), pn = (e) => `\\left[\\begin{array}{${Array.from({ length: e.cols }, (t, n) => e.colSeparators.includes(n) ? "c|" : "c").join("")}}${e.cells.map((t, n) => {
840
+ return Math.max(Ae, r * 9 + je * 2);
841
+ }), mr = (e) => pr(e).reduce((e, t) => e + t, 0), hr = (e) => `\\left[\\begin{array}{${Array.from({ length: e.cols }, (t, n) => e.colSeparators.includes(n) ? "c|" : "c").join("")}}${e.cells.map((t, n) => {
577
842
  let r = t.map((e) => e.trim() || "\\,").join(" & ");
578
843
  return e.rowSeparators.includes(n) ? `${r} \\\\ \\hline` : r;
579
- }).join(" \\\\ ")}\\end{array}\\right]`, mn = (e) => fn(e) + g * 2, hn = (e) => e.rows * Ce + g * 2, gn = (e) => e.y + hn(e) / 2, _n = (e) => e.renderMode === "latex" ? e.y + Math.max(Et[e.id] ?? p, e.height) / 2 : null, vn = (e, t) => {
580
- for (let n = S.length - 1; n >= 0; --n) {
581
- let r = S[n], i = mn(r), a = hn(r);
844
+ }).join(" \\\\ ")}\\end{array}\\right]`, gr = (e) => mr(e) + h * 2, _r = (e) => e.rows * m + h * 2, vr = (e) => e.y + _r(e) / 2, yr = (e) => Array.from({ length: e.cols }, (t, n) => {
845
+ let r = Math.max(1, ...e.cells.map((e) => e[n]?.trim().length ?? 0));
846
+ return Math.max(Ae, r * 9 + je * 2);
847
+ }), br = (e) => yr(e).reduce((e, t) => e + t, 0) + 2, xr = (e) => e.rows * m + 2, Sr = (e) => e.y + xr(e) / 2, Cr = (e) => e.renderMode === "latex" ? e.y + Math.max(hn[e.id] ?? f, e.height) / 2 : null, wr = (e, t) => {
848
+ for (let n = y.length - 1; n >= 0; --n) {
849
+ let r = y[n], i = gr(r), a = _r(r);
850
+ if (e >= r.x - 12 && e <= r.x + i + 12 && t >= r.y - 12 && t <= r.y + a + 12) return r;
851
+ }
852
+ return null;
853
+ }, Tr = (e, t) => {
854
+ for (let n = Tt.length - 1; n >= 0; --n) {
855
+ let r = Tt[n], i = br(r), a = xr(r);
582
856
  if (e >= r.x - 12 && e <= r.x + i + 12 && t >= r.y - 12 && t <= r.y + a + 12) return r;
583
857
  }
584
858
  return null;
585
- }, yn = (e, t) => {
586
- Qe((n) => n.map((n) => n.id === e ? t(n) : n));
587
- }, bn = (e, t, n) => {
588
- yn(e, (e) => ({
859
+ }, Er = (e, t) => {
860
+ wt((n) => n.map((n) => n.id === e ? t(n) : n));
861
+ }, Dr = (e, t, n) => {
862
+ Er(e, (e) => ({
589
863
  ...e,
590
- rows: Math.max(1, Math.min(h, t)),
591
- cols: Math.max(1, Math.min(h, n)),
592
- cells: ln(e.cells, Math.max(1, Math.min(h, t)), Math.max(1, Math.min(h, n))),
593
- rowSeparators: un(e.rowSeparators, Math.max(1, Math.min(h, t)) - 1),
594
- colSeparators: un(e.colSeparators, Math.max(1, Math.min(h, n)) - 1)
864
+ rows: Math.max(1, Math.min(Oe, t)),
865
+ cols: Math.max(1, Math.min(Oe, n)),
866
+ cells: dr(e.cells, Math.max(1, Math.min(Oe, t)), Math.max(1, Math.min(Oe, n))),
867
+ rowSeparators: fr(e.rowSeparators, Math.max(1, Math.min(Oe, t)) - 1),
868
+ colSeparators: fr(e.colSeparators, Math.max(1, Math.min(Oe, n)) - 1)
595
869
  }));
596
- }, xn = (e, t) => {
597
- Z(), yn(e, (e) => ({
870
+ }, Or = (e, t, n) => {
871
+ cr(e, (e) => ({
872
+ ...e,
873
+ rows: Math.max(1, Math.min(ke, t)),
874
+ cols: Math.max(1, Math.min(ke, n)),
875
+ cells: dr(e.cells, Math.max(1, Math.min(ke, t)), Math.max(1, Math.min(ke, n)))
876
+ }));
877
+ }, kr = (e, t) => {
878
+ Z(), Er(e, (e) => ({
598
879
  ...e,
599
880
  rowSeparators: e.rowSeparators.includes(t) ? e.rowSeparators.filter((e) => e !== t) : [...e.rowSeparators, t].sort((e, t) => e - t)
600
881
  }));
601
- }, Sn = (e, t) => {
602
- Z(), yn(e, (e) => ({
882
+ }, Ar = (e, t) => {
883
+ Z(), Er(e, (e) => ({
603
884
  ...e,
604
885
  colSeparators: e.colSeparators.includes(t) ? e.colSeparators.filter((e) => e !== t) : [...e.colSeparators, t].sort((e, t) => e - t)
605
886
  }));
606
- }, Cn = (e) => {
607
- Z(), yn(e, (e) => ({
887
+ }, jr = (e) => {
888
+ Z(), Er(e, (e) => ({
889
+ ...e,
890
+ cells: e.cells.map((e) => e.map((e) => e.trim() ? e : "0"))
891
+ }));
892
+ }, Mr = (e) => {
893
+ Z(), cr(e, (e) => ({
608
894
  ...e,
609
895
  cells: e.cells.map((e) => e.map((e) => e.trim() ? e : "0"))
610
896
  }));
611
- }, wn = (e, t = {
897
+ }, Nr = (e, t = {
612
898
  row: 0,
613
899
  col: 0
614
900
  }) => {
615
- j(e), T(null), J(), Q(), G(), K(), X(), q(), mt(e), L(t);
616
- }, Tn = () => {
901
+ D(e), x(null), J(), Q(), G(), K(), $n(), Qn(), X(), q(), Xt(e), I(t);
902
+ }, Pr = () => {
617
903
  K();
618
- }, En = (e, t, n) => {
619
- let r = hn(e), i = n + r / 2, a = null, o = Infinity;
620
- for (let n of S) {
621
- if (n.id === e.id || Math.abs(n.x - t) > De) continue;
622
- let r = gn(n), s = Math.abs(r - i);
623
- s <= Ee && s < o && (a = r, o = s);
904
+ }, Fr = (e, t = {
905
+ row: 0,
906
+ col: 0
907
+ }) => {
908
+ k(e), x(null), J(), Q(), G(), Y(), K(), Qn(), X(), q(), Qt(e), R(t);
909
+ }, Ir = () => {
910
+ Qn();
911
+ }, Lr = (e, t, n) => {
912
+ let r = _r(e), i = n + r / 2, a = null, o = Infinity;
913
+ for (let n of y) {
914
+ if (n.id === e.id || Math.abs(n.x - t) > Le) continue;
915
+ let r = vr(n), s = Math.abs(r - i);
916
+ s <= Ie && s < o && (a = r, o = s);
917
+ }
918
+ for (let e of v) {
919
+ let n = Cr(e);
920
+ if (n === null || Math.abs(e.x - t) > Le) continue;
921
+ let r = Math.abs(n - i);
922
+ r <= Ie && r < o && (a = n, o = r);
923
+ }
924
+ return a === null ? {
925
+ x: t,
926
+ y: n
927
+ } : {
928
+ x: t,
929
+ y: a - r / 2
930
+ };
931
+ }, Rr = (e, t, n) => {
932
+ let r = xr(e), i = n + r / 2, a = null, o = Infinity;
933
+ for (let n of Tt) {
934
+ if (n.id === e.id || Math.abs(n.x - t) > Le) continue;
935
+ let r = Sr(n), s = Math.abs(r - i);
936
+ s <= Ie && s < o && (a = r, o = s);
624
937
  }
625
938
  for (let e of y) {
626
- let n = _n(e);
627
- if (n === null || Math.abs(e.x - t) > De) continue;
939
+ if (Math.abs(e.x - t) > Le) continue;
940
+ let n = vr(e), r = Math.abs(n - i);
941
+ r <= Ie && r < o && (a = n, o = r);
942
+ }
943
+ for (let e of v) {
944
+ let n = Cr(e);
945
+ if (n === null || Math.abs(e.x - t) > Le) continue;
628
946
  let r = Math.abs(n - i);
629
- r <= Ee && r < o && (a = n, o = r);
947
+ r <= Ie && r < o && (a = n, o = r);
630
948
  }
631
949
  return a === null ? {
632
950
  x: t,
@@ -635,65 +953,85 @@ function x() {
635
953
  x: t,
636
954
  y: a - r / 2
637
955
  };
638
- }, Dn = (e, t, n = xe, r = xe) => {
639
- let i = W(), a = {
956
+ }, zr = (e, t, n = Ee, r = Ee) => {
957
+ let i = Yn(), a = {
640
958
  id: i,
641
959
  x: e,
642
960
  y: t,
643
961
  rows: n,
644
962
  cols: r,
645
- cells: cn(n, r),
963
+ cells: ur(n, r),
646
964
  rowSeparators: [],
647
965
  colSeparators: []
648
966
  };
649
- Z(), Qe((e) => [...e, a]), T(null), J(), Q(), G(), X(), q(), j(i), mt(i), L({
967
+ Z(), wt((e) => [...e, a]), x(null), J(), Q(), G(), $n(), Qn(), X(), q(), D(i), Xt(i), I({
650
968
  row: 0,
651
969
  col: 0
652
970
  });
653
- }, On = (e, t) => {
654
- let n = W();
655
- Z(), et((r) => [...r, {
971
+ }, Br = (e, t, n = De, r = De) => {
972
+ let i = Yn(), a = {
973
+ id: i,
974
+ x: e,
975
+ y: t,
976
+ rows: n,
977
+ cols: r,
978
+ cells: ur(n, r)
979
+ };
980
+ Z(), Et((e) => [...e, a]), x(null), J(), Q(), G(), Y(), K(), X(), q(), k(i), Qt(i), R({
981
+ row: 0,
982
+ col: 0
983
+ });
984
+ }, Vr = (e, t) => {
985
+ let n = Yn();
986
+ Z(), Ot((r) => [...r, {
656
987
  id: n,
657
988
  x: e,
658
989
  y: t,
659
- width: Oe,
660
- height: ke,
990
+ width: Re,
991
+ height: ze,
661
992
  content: "",
662
993
  alignMode: "left",
663
994
  alignToken: "="
664
- }]), T(null), J(), Y(), Q(), G(), K(), q(), N(n), gt(n), vt("");
665
- }, kn = (e) => {
666
- let t = an(e);
667
- t && (N(e), T(null), J(), Y(), Q(), G(), K(), q(), gt(e), vt(t.content));
668
- }, An = () => {
669
- if (R) {
670
- if (Z(), !_t.trim()) {
671
- et((e) => e.filter((e) => e.id !== R)), M === R && N(null), q();
995
+ }]), x(null), J(), Y(), Q(), G(), K(), q(), j(n), en(n), nn("");
996
+ }, Hr = (e) => {
997
+ let t = or(e);
998
+ t && (j(e), x(null), J(), Y(), Q(), G(), K(), q(), en(e), nn(t.content));
999
+ }, Ur = () => {
1000
+ if (z) {
1001
+ if (Z(), !tn.trim()) {
1002
+ Ot((e) => e.filter((e) => e.id !== z)), A === z && j(null), q();
672
1003
  return;
673
1004
  }
674
- on(R, (e) => ({
1005
+ sr(z, (e) => ({
675
1006
  ...e,
676
- content: _t
1007
+ content: tn
677
1008
  })), q();
678
1009
  }
679
- }, jn = () => {
680
- M && (Z(), et((e) => e.filter((e) => e.id !== M)), R === M && q(), N(null));
681
- }, Mn = (e, t, n, r) => {
682
- yn(e, (e) => ({
1010
+ }, Wr = () => {
1011
+ A && (Z(), Ot((e) => e.filter((e) => e.id !== A)), z === A && q(), j(null));
1012
+ }, Gr = (e, t, n, r) => {
1013
+ Er(e, (e) => ({
1014
+ ...e,
1015
+ cells: e.cells.map((e, i) => i === t ? e.map((e, t) => t === n ? r : e) : e)
1016
+ }));
1017
+ }, Kr = (e, t, n, r) => {
1018
+ cr(e, (e) => ({
683
1019
  ...e,
684
1020
  cells: e.cells.map((e, i) => i === t ? e.map((e, t) => t === n ? r : e) : e)
685
1021
  }));
686
- }, Nn = () => {
687
- A && (Z(), Qe((e) => e.filter((e) => e.id !== A)), I === A && K(), j(null));
688
- }, Pn = (e, t) => {
689
- for (let n = Je.length - 1; n >= 0; --n) {
690
- let r = Je[n], i = r.x + r.width / 2, a = r.y + r.height / 2, o = Math.min(r.width, r.height);
1022
+ }, qr = () => {
1023
+ E && (Z(), wt((e) => e.filter((e) => e.id !== E)), F === E && K(), D(null));
1024
+ }, Jr = () => {
1025
+ O && (Z(), Et((e) => e.filter((e) => e.id !== O)), L === O && Qn(), k(null));
1026
+ }, Yr = (e, t) => {
1027
+ for (let n = bt.length - 1; n >= 0; --n) {
1028
+ let r = bt[n], i = r.x + r.width / 2, a = r.y + r.height / 2, o = Math.min(r.width, r.height);
691
1029
  if (Math.hypot(e - i, t - a) <= o) return r;
692
1030
  }
693
1031
  return null;
694
- }, Fn = (e, t) => {
695
- Ye((n) => n.map((n) => n.id === e ? t(n) : n));
696
- }, In = (e, t) => {
1032
+ }, Xr = (e, t) => {
1033
+ xt((n) => n.map((n) => n.id === e ? t(n) : n));
1034
+ }, Zr = (e, t) => {
697
1035
  let n = e.x + e.width / 2, r = e.y + e.height / 2, i = t.x + t.width / 2, a = t.y + t.height / 2, o = i - n, s = a - r, c = Math.hypot(o, s);
698
1036
  if (c === 0) return [
699
1037
  n,
@@ -701,154 +1039,157 @@ function x() {
701
1039
  i,
702
1040
  a
703
1041
  ];
704
- let l = o / c, u = s / c, ee = Math.min(e.width, e.height) / 2, te = Math.min(t.width, t.height) / 2;
1042
+ let ee = o / c, l = s / c, te = Math.min(e.width, e.height) / 2, ne = Math.min(t.width, t.height) / 2;
705
1043
  return [
706
- n + l * ee,
707
- r + u * ee,
708
- i - l * te,
709
- a - u * te
1044
+ n + ee * te,
1045
+ r + l * te,
1046
+ i - ee * ne,
1047
+ a - l * ne
710
1048
  ];
711
- }, Ln = (e, t) => Xe.some((n) => n.sourceId === e && n.targetId === t || n.sourceId === t && n.targetId === e), Rn = (e) => {
712
- let t = nn(e);
713
- t && (Y(), K(), X(), q(), D(e), k(null), dt(e), pt(t.label));
714
- }, zn = () => {
715
- if (!F) return;
716
- let e = ft.trim();
717
- Z(), Fn(F, (t) => ({
1049
+ }, Qr = (e, t) => St.some((n) => n.sourceId === e && n.targetId === t || n.sourceId === t && n.targetId === e), $r = (e) => {
1050
+ let t = rr(e);
1051
+ t && (Y(), K(), X(), q(), C(e), T(null), qt(e), Yt(t.label));
1052
+ }, ei = () => {
1053
+ if (!P) return;
1054
+ let e = Jt.trim();
1055
+ Z(), Xr(P, (t) => ({
718
1056
  ...t,
719
1057
  label: e
720
1058
  })), G();
721
- }, Bn = () => {
1059
+ }, ti = () => {
722
1060
  G();
723
- }, Vn = (e, t, n) => {
724
- let r = W(), i = {
1061
+ }, ni = (e, t, n) => {
1062
+ let r = Yn(), i = {
725
1063
  id: r,
726
1064
  x: e,
727
1065
  y: t,
728
- width: he,
729
- height: ge,
1066
+ width: be,
1067
+ height: xe,
730
1068
  label: n?.label ?? "",
731
1069
  shape: "circle"
732
1070
  };
733
- Z(), Ye((e) => [...e, i]), n?.connectFromId && n.connectFromId !== r && !Ln(n.connectFromId, r) ? (Ze((e) => [...e, {
734
- id: W(),
1071
+ Z(), xt((e) => [...e, i]), n?.connectFromId && n.connectFromId !== r && !Qr(n.connectFromId, r) ? (Ct((e) => [...e, {
1072
+ id: Yn(),
735
1073
  sourceId: n.connectFromId,
736
1074
  targetId: r
737
- }]), B(n.connectFromId)) : B(r), D(r), k(null), T(null), Y(), K(), X(), q(), Q(), dt(r), pt(i.label);
738
- }, Hn = (e, t) => {
739
- if (e === t || Ln(e, t)) {
740
- D(t), k(null);
1075
+ }]), V(n.connectFromId)) : V(r), C(r), T(null), x(null), Y(), K(), X(), q(), Q(), qt(r), Yt(i.label);
1076
+ }, ri = (e, t) => {
1077
+ if (e === t || Qr(e, t)) {
1078
+ C(t), T(null);
741
1079
  return;
742
1080
  }
743
- Z(), Ze((n) => [...n, {
744
- id: W(),
1081
+ Z(), Ct((n) => [...n, {
1082
+ id: Yn(),
745
1083
  sourceId: e,
746
1084
  targetId: t
747
- }]), D(t), k(null), B(e);
748
- }, Un = () => {
749
- E && (Z(), Ye((e) => e.filter((e) => e.id !== E)), Ze((e) => e.filter((e) => e.sourceId !== E && e.targetId !== E)), F === E && G(), z === E && B(null), D(null), k(null));
750
- }, Wn = () => {
751
- O && (Z(), Ze((e) => e.filter((e) => e.id !== O)), k(null));
752
- }, Gn = (e, t) => {
753
- E && (Z(), Fn(E, (n) => ({
1085
+ }]), C(t), T(null), V(e);
1086
+ }, ii = () => {
1087
+ S && (Z(), xt((e) => e.filter((e) => e.id !== S)), Ct((e) => e.filter((e) => e.sourceId !== S && e.targetId !== S)), P === S && G(), B === S && V(null), C(null), T(null));
1088
+ }, ai = () => {
1089
+ w && (Z(), Ct((e) => e.filter((e) => e.id !== w)), T(null));
1090
+ }, oi = (e, t) => {
1091
+ S && (Z(), Xr(S, (n) => ({
754
1092
  ...n,
755
1093
  x: n.x + e,
756
1094
  y: n.y + t
757
1095
  })));
758
- }, Kn = (e, t) => {
759
- let n = nn(E);
760
- n && Vn(n.x + e, n.y + t, { connectFromId: n.id });
761
- }, qn = (e) => {
762
- let t = nn(E);
1096
+ }, si = (e, t) => {
1097
+ let n = rr(S);
1098
+ n && ni(n.x + e, n.y + t, { connectFromId: n.id });
1099
+ }, ci = (e) => {
1100
+ let t = rr(S);
763
1101
  if (!t) return;
764
- let n = t.x + t.width / 2, r = t.y + t.height / 2, i = Xe.map((e) => e.sourceId === t.id ? nn(e.targetId) : e.targetId === t.id ? nn(e.sourceId) : null).filter((e) => !!e).map((t) => {
1102
+ let n = t.x + t.width / 2, r = t.y + t.height / 2, i = St.map((e) => e.sourceId === t.id ? rr(e.targetId) : e.targetId === t.id ? rr(e.sourceId) : null).filter((e) => !!e).map((t) => {
765
1103
  let i = t.x + t.width / 2, a = t.y + t.height / 2, o = i - n, s = a - r;
766
1104
  if (e === "left" && o >= 0 || e === "right" && o <= 0 || e === "up" && s >= 0 || e === "down" && s <= 0) return null;
767
- let c = Math.abs(e === "left" || e === "right" ? o : s), l = Math.abs(e === "left" || e === "right" ? s : o);
1105
+ let c = Math.abs(e === "left" || e === "right" ? o : s), ee = Math.abs(e === "left" || e === "right" ? s : o);
768
1106
  return {
769
1107
  id: t.id,
770
- score: l * 10 + c
1108
+ score: ee * 10 + c
771
1109
  };
772
1110
  }).filter((e) => !!e).sort((e, t) => e.score - t.score)[0];
773
- i && (D(i.id), k(null), B(i.id));
1111
+ i && (C(i.id), T(null), V(i.id));
774
1112
  }, Q = () => {
775
- it(null), ot(""), ct(0), Ct(p), Tt(ae), ut(null);
776
- }, Jn = (e, t, n, r, i, a) => {
1113
+ zt(null), Vt(""), Ut(0), fn(f), mn(oe), Wt(null), Kt(null);
1114
+ }, li = (e, t, n, r, i, a) => {
777
1115
  let o = i - n, s = a - r;
778
1116
  if (o === 0 && s === 0) return Math.hypot(e - n, t - r);
779
- let c = Math.max(0, Math.min(1, ((e - n) * o + (t - r) * s) / (o * o + s * s))), l = n + c * o, u = r + c * s;
780
- return Math.hypot(e - l, t - u);
781
- }, Yn = (e, t, n) => {
782
- Ae((r) => {
1117
+ let c = Math.max(0, Math.min(1, ((e - n) * o + (t - r) * s) / (o * o + s * s))), ee = n + c * o, l = r + c * s;
1118
+ return Math.hypot(e - ee, t - l);
1119
+ }, ui = (e, t, n) => {
1120
+ vt((r) => {
783
1121
  let i = [];
784
1122
  for (let a of r) {
785
1123
  let r = [], o = [];
786
1124
  for (let i = 0; i < a.points.length; i += 2) {
787
- let s = a.points[i], c = a.points[i + 1], l = Math.hypot(s - e, c - t) <= n;
788
- if (l || o.push(s, c), i < a.points.length - 2) {
789
- let u = a.points[i + 2], ee = a.points[i + 3];
790
- (l || Math.hypot(u - e, ee - t) <= n || Jn(e, t, s, c, u, ee) <= n) && (o.length >= 4 && r.push(o), o = []);
1125
+ let s = a.points[i], c = a.points[i + 1], ee = Math.hypot(s - e, c - t) <= n;
1126
+ if (ee || o.push(s, c), i < a.points.length - 2) {
1127
+ let l = a.points[i + 2], te = a.points[i + 3];
1128
+ (ee || Math.hypot(l - e, te - t) <= n || li(e, t, s, c, l, te) <= n) && (o.length >= 4 && r.push(o), o = []);
791
1129
  }
792
1130
  }
793
1131
  if (o.length >= 4 && r.push(o), r.length !== 0) for (let e of r) i.push({
794
1132
  ...a,
795
- id: W(),
1133
+ id: Yn(),
796
1134
  points: e
797
1135
  });
798
1136
  }
799
1137
  return i;
800
1138
  });
801
- }, Xn = (e, t) => {
802
- let n = performance.now(), r = Lt.current, i = de;
1139
+ }, di = (e, t) => {
1140
+ let n = performance.now(), r = Dn.current, i = ge;
803
1141
  if (r) {
804
1142
  let a = Math.hypot(e - r.x, t - r.y) / Math.max(n - r.time, 1);
805
- i = de + Math.max(0, Math.min(1, (a - pe) / me)) * (fe - de);
1143
+ i = ge + Math.max(0, Math.min(1, (a - ve) / ye)) * (_e - ge);
806
1144
  }
807
- return Lt.current = {
1145
+ return Dn.current = {
808
1146
  x: e,
809
1147
  y: t,
810
1148
  time: n
811
- }, Ft({
1149
+ }, wn({
812
1150
  x: e,
813
1151
  y: t,
814
1152
  radius: i,
815
1153
  visible: !0
816
1154
  }), i;
817
- }, Zn = (e) => {
818
- let t = en(e);
819
- t && (J(), G(), Y(), K(), X(), q(), T(e), rt(t.renderMode), it(e), ot(t.content), ct(t.content.length), Tt(Math.min(Math.max(Ve(t.content), m), Math.max(m, V.width - t.x - ie))));
820
- }, Qn = () => {
821
- if (!P) return;
822
- let e = at.trim();
1155
+ }, fi = (e) => {
1156
+ let t = tr(e);
1157
+ t && (J(), G(), Y(), K(), X(), q(), x(e), jt(t.renderMode), zt(e), Vt(t.content), Ut(t.content.length), mn(Math.min(Math.max(ot(t.content), p), Math.max(p, H.width - t.x - ae))));
1158
+ }, pi = () => {
1159
+ if (!M) return;
1160
+ let e = Bt.trim();
823
1161
  if (Z(), !e) {
824
- x((e) => e.filter((e) => e.id !== P)), w === P && T(null), Q();
1162
+ yt((e) => e.filter((e) => e.id !== M)), Rt === M && x(null), Q();
825
1163
  return;
826
1164
  }
827
- tn(P, (e) => ({
1165
+ nr(M, (e) => ({
828
1166
  ...e,
829
- content: at,
830
- width: e.renderMode === "latex" ? m : Math.min(Math.max(wt, m), Math.max(m, V.width - e.x - ie)),
831
- height: Math.max(e.height, St)
1167
+ content: Bt,
1168
+ renderMode: At,
1169
+ width: At === "latex" ? p : Math.min(Math.max(pn, p), Math.max(p, H.width - e.x - ae)),
1170
+ height: Math.max(e.height, dn)
832
1171
  })), Q();
833
- }, $n = (e, t) => {
834
- let n = W(), r = Math.max(m, Math.min(ae, V.width - e - ie));
835
- Z(), x((i) => [...i, {
1172
+ }, mi = (e, t) => {
1173
+ let n = Yn(), r = Math.max(p, Math.min(oe, H.width - e - ae));
1174
+ Z(), yt((i) => [...i, {
836
1175
  id: n,
837
1176
  x: e,
838
1177
  y: t,
839
1178
  width: r,
840
- height: p,
1179
+ height: f,
841
1180
  content: "",
842
- renderMode: nt
843
- }]), J(), G(), Y(), K(), X(), q(), T(n), it(n), ot(""), ct(0), Ct(p), Tt(r);
844
- }, er = (e, t) => {
845
- C !== "pen" && C !== "eraser" || (Z(), Ae((n) => [...n, {
846
- id: W(),
1181
+ renderMode: At
1182
+ }]), J(), G(), Y(), K(), X(), q(), x(n), zt(n), Vt(""), Ut(0), fn(f), mn(r);
1183
+ }, hi = (e, t) => {
1184
+ b !== "pen" && b !== "eraser" || (Z(), vt((n) => [...n, {
1185
+ id: Yn(),
847
1186
  points: [e, t],
848
- tool: C
1187
+ tool: b,
1188
+ strokeWidth: b === "pen" ? Mt : 14,
1189
+ color: b === "pen" ? Pt : void 0
849
1190
  }]));
850
- }, tr = (e, t) => {
851
- Ae((n) => {
1191
+ }, gi = (e, t) => {
1192
+ vt((n) => {
852
1193
  let r = [...n], i = r[r.length - 1];
853
1194
  return i ? (r[r.length - 1] = {
854
1195
  ...i,
@@ -859,229 +1200,320 @@ function x() {
859
1200
  ]
860
1201
  }, r) : n;
861
1202
  });
862
- }, nr = (e) => {
863
- let t = e.target.getStage(), n = t?.getPointerPosition();
864
- if (!n) return;
865
- let r = e.target === t || e.target.getClassName() === "Rect";
866
- if (C === "text") {
867
- H.current = !1, U.current = !1;
1203
+ }, _i = (e) => {
1204
+ let t = e.target.getStage(), n = t?.getPointerPosition(), r = Xn(t);
1205
+ if (!n || !r) return;
1206
+ let i = e.target === t || e.target.getClassName() === "Rect";
1207
+ if (b === "pan") {
1208
+ M && pi(), P && ei(), F && Pr(), L && Ir(), z && Ur(), U.current = !1, W.current = !1, Tn.current = !0, On.current = n;
1209
+ return;
1210
+ }
1211
+ if (b === "text") {
1212
+ U.current = !1, W.current = !1;
868
1213
  return;
869
1214
  }
870
- if (C === "graph") {
871
- P && Qn(), F && r && zn(), r && (T(null), k(null)), H.current = !1, U.current = !1;
1215
+ if (b === "graph") {
1216
+ M && pi(), P && i && ei(), i && (x(null), T(null)), U.current = !1, W.current = !1;
872
1217
  return;
873
1218
  }
874
- if (C === "matrix") {
875
- P && Qn(), F && r && zn(), I && r && Tn(), r && (T(null), J()), H.current = !1, U.current = !1;
1219
+ if (b === "matrix") {
1220
+ M && pi(), P && i && ei(), F && i && Pr(), i && (x(null), J()), U.current = !1, W.current = !1;
876
1221
  return;
877
1222
  }
878
- if (C === "align") {
879
- P && Qn(), F && r && zn(), I && r && Tn(), R && r && An(), r && (T(null), J(), Y()), H.current = !1, U.current = !1;
1223
+ if (b === "align") {
1224
+ M && pi(), P && i && ei(), F && i && Pr(), z && i && Ur(), i && (x(null), J(), Y()), U.current = !1, W.current = !1;
880
1225
  return;
881
1226
  }
882
- if (P && Qn(), F && zn(), I && Tn(), R && An(), C === "pen" || C === "eraser") {
883
- if (T(null), J(), Y(), X(), C === "pen") H.current = !0, U.current = !1, er(n.x, n.y);
1227
+ if (M && pi(), P && ei(), F && Pr(), L && Ir(), z && Ur(), b === "pen" || b === "eraser") {
1228
+ if (x(null), J(), Y(), $n(), X(), b === "pen") U.current = !0, W.current = !1, hi(r.x, r.y);
884
1229
  else {
885
- Z(), H.current = !1, U.current = !0;
886
- let e = Xn(n.x, n.y);
887
- Yn(n.x, n.y, e);
1230
+ Z(), U.current = !1, W.current = !0;
1231
+ let e = di(r.x, r.y);
1232
+ ui(r.x, r.y, e);
888
1233
  }
889
1234
  return;
890
1235
  }
891
- C === "select" && r && (T(null), J(), Y(), X()), H.current = !1, U.current = !1;
892
- }, rr = (e) => {
893
- if (C !== "text" && C !== "graph" && C !== "matrix" && C !== "align") return;
894
- let t = e.target.getStage(), n = t?.getPointerPosition();
1236
+ b === "select" && i && (x(null), J(), Y(), $n(), X()), U.current = !1, W.current = !1;
1237
+ }, vi = (e) => {
1238
+ if (b !== "text" && b !== "graph" && b !== "matrix" && b !== "table" && b !== "align") return;
1239
+ let t = e.target.getStage(), n = Xn(t);
895
1240
  if (n && (e.target === t || e.target.getClassName() === "Rect")) {
896
- if (C === "text") {
897
- $n(n.x, n.y);
1241
+ if (b === "text") {
1242
+ mi(n.x, n.y);
1243
+ return;
1244
+ }
1245
+ if (b === "graph") {
1246
+ let e = Yr(n.x, n.y);
1247
+ if (e) {
1248
+ S === e.id ? $r(e.id) : (C(e.id), T(null), V(e.id), x(null));
1249
+ return;
1250
+ }
1251
+ ni(n.x - be / 2, n.y - xe / 2);
898
1252
  return;
899
1253
  }
900
- if (C === "graph") {
901
- let e = Pn(n.x, n.y);
1254
+ if (b === "matrix") {
1255
+ let e = wr(n.x, n.y);
902
1256
  if (e) {
903
- E === e.id ? Rn(e.id) : (D(e.id), k(null), B(e.id), T(null));
1257
+ E === e.id ? Nr(e.id) : (D(e.id), x(null), J());
904
1258
  return;
905
1259
  }
906
- Vn(n.x - he / 2, n.y - ge / 2);
1260
+ zr(n.x - (Ee * Ae + h * 2 + 24) / 2, n.y - (Ee * m + h * 2) / 2);
907
1261
  return;
908
1262
  }
909
- if (C === "matrix") {
910
- let e = vn(n.x, n.y);
1263
+ if (b === "table") {
1264
+ let e = Tr(n.x, n.y);
911
1265
  if (e) {
912
- A === e.id ? wn(e.id) : (j(e.id), T(null), J());
1266
+ O === e.id ? Fr(e.id) : (k(e.id), x(null), J(), Y());
913
1267
  return;
914
1268
  }
915
- Dn(n.x - (xe * Se + g * 2 + 24) / 2, n.y - (xe * Ce + g * 2) / 2);
1269
+ Br(n.x - (De * Ae + 2) / 2, n.y - (De * m + 2) / 2);
916
1270
  return;
917
1271
  }
918
- C === "align" && On(n.x, n.y);
1272
+ b === "align" && Vr(n.x, n.y);
919
1273
  }
920
- }, ir = (e) => {
921
- let t = e.target.getStage()?.getPointerPosition();
922
- if (t) {
923
- if (C === "eraser") {
924
- let e = Xn(t.x, t.y);
925
- U.current && Yn(t.x, t.y, e);
1274
+ }, yi = (e) => {
1275
+ let t = e.target.getStage(), n = t?.getPointerPosition(), r = Xn(t);
1276
+ if (!(!n || !r)) {
1277
+ if (b === "pan" && Tn.current) {
1278
+ let e = On.current;
1279
+ if (!e) {
1280
+ On.current = n;
1281
+ return;
1282
+ }
1283
+ ln((t) => ({
1284
+ x: t.x + (n.x - e.x),
1285
+ y: t.y + (n.y - e.y)
1286
+ })), On.current = n;
926
1287
  return;
927
1288
  }
928
- H.current && tr(t.x, t.y);
1289
+ if (b === "eraser") {
1290
+ let e = di(r.x, r.y);
1291
+ W.current && ui(r.x, r.y, e);
1292
+ return;
1293
+ }
1294
+ U.current && gi(r.x, r.y);
929
1295
  }
930
- }, ar = () => {
931
- H.current = !1, U.current = !1, Lt.current = null;
932
- }, or = (e) => {
933
- if (nt !== e) {
934
- if (Z(), rt(e), P) {
935
- tn(P, (t) => ({
1296
+ }, bi = () => {
1297
+ U.current = !1, W.current = !1, Tn.current = !1, Dn.current = null, On.current = null, wn((e) => ({
1298
+ ...e,
1299
+ visible: !1
1300
+ }));
1301
+ }, xi = (e) => {
1302
+ if (At !== e) {
1303
+ if (Z(), jt(e), M) {
1304
+ nr(M, (t) => ({
936
1305
  ...t,
937
1306
  renderMode: e
938
1307
  }));
939
1308
  return;
940
1309
  }
941
- w && tn(w, (t) => ({
1310
+ Rt && nr(Rt, (t) => ({
942
1311
  ...t,
943
1312
  renderMode: e
944
1313
  }));
945
1314
  }
946
- }, sr = () => {
947
- or(nt === "latex" ? "plain" : "latex");
948
- }, cr = () => {
949
- jt((e) => {
1315
+ }, Si = () => {
1316
+ xi(At === "latex" ? "plain" : "latex");
1317
+ }, Ci = () => {
1318
+ bn((e) => {
950
1319
  let t = e[e.length - 1];
951
- return t ? (Nt((e) => [Qt(), ...e]), $t(t), e.slice(0, -1)) : e;
1320
+ return t ? (Sn((e) => [Zn(), ...e]), er(t), e.slice(0, -1)) : e;
952
1321
  });
953
- }, lr = () => {
954
- Nt((e) => {
1322
+ }, wi = () => {
1323
+ Sn((e) => {
955
1324
  let t = e[0];
956
- return t ? (jt((e) => [...e, Qt()]), $t(t), e.slice(1)) : e;
1325
+ return t ? (bn((e) => [...e, Zn()]), er(t), e.slice(1)) : e;
957
1326
  });
1327
+ }, Ti = () => {
1328
+ Lt(!0), kn.current !== null && window.clearTimeout(kn.current), kn.current = window.setTimeout(() => {
1329
+ Lt(!1), kn.current = null;
1330
+ }, 500);
958
1331
  };
959
1332
  e(() => {
960
1333
  let e = (e) => {
961
- let t = e.target, n = t instanceof HTMLInputElement && !!t.dataset.matrixId;
962
- if (!(t instanceof HTMLTextAreaElement || t instanceof HTMLInputElement && !n || t instanceof HTMLElement && t.isContentEditable)) {
963
- if (e.key === "Escape" && B(null), (e.ctrlKey || e.metaKey) && e.key.toLowerCase() === "z" && !e.shiftKey) {
964
- e.preventDefault(), cr();
1334
+ let t = e.target;
1335
+ if (!(t instanceof HTMLTextAreaElement || t instanceof HTMLInputElement || t instanceof HTMLElement && t.isContentEditable)) {
1336
+ if (e.key === "Escape" && V(null), (e.ctrlKey || e.metaKey) && e.key.toLowerCase() === "z" && !e.shiftKey) {
1337
+ e.preventDefault(), Ci();
965
1338
  return;
966
1339
  }
967
1340
  if ((e.ctrlKey || e.metaKey) && (e.key.toLowerCase() === "y" || e.shiftKey && e.key.toLowerCase() === "z")) {
968
- e.preventDefault(), lr();
1341
+ e.preventDefault(), wi();
969
1342
  return;
970
1343
  }
971
- if (C === "matrix") {
972
- if (A && (e.ctrlKey || e.metaKey)) {
973
- let t = rn(A);
1344
+ if (b === "pen") {
1345
+ if (e.repeat && e.key.startsWith("Arrow")) {
1346
+ e.preventDefault();
1347
+ return;
1348
+ }
1349
+ if (e.key === "ArrowUp") {
1350
+ e.preventDefault(), Ti(), Nt((e) => {
1351
+ let t = fe.indexOf(e);
1352
+ return fe[Math.min(fe.length - 1, t + 1)];
1353
+ });
1354
+ return;
1355
+ }
1356
+ if (e.key === "ArrowDown") {
1357
+ e.preventDefault(), Ti(), Nt((e) => {
1358
+ let t = fe.indexOf(e);
1359
+ return fe[Math.max(0, t - 1)];
1360
+ });
1361
+ return;
1362
+ }
1363
+ if (e.key === "ArrowRight") {
1364
+ e.preventDefault(), Ft((e) => st[(st.indexOf(e) + 1) % st.length]);
1365
+ return;
1366
+ }
1367
+ if (e.key === "ArrowLeft") {
1368
+ e.preventDefault(), Ft((e) => st[(st.indexOf(e) - 1 + st.length) % st.length]);
1369
+ return;
1370
+ }
1371
+ }
1372
+ if (b === "matrix") {
1373
+ if (E && (e.ctrlKey || e.metaKey)) {
1374
+ let t = ir(E);
1375
+ if (!t) return;
1376
+ if (e.key === "ArrowUp") {
1377
+ e.preventDefault(), Z(), Dr(E, t.rows - 1, t.cols);
1378
+ return;
1379
+ }
1380
+ if (e.key === "ArrowDown") {
1381
+ e.preventDefault(), Z(), Dr(E, t.rows + 1, t.cols);
1382
+ return;
1383
+ }
1384
+ if (e.key === "ArrowLeft") {
1385
+ e.preventDefault(), Z(), Dr(E, t.rows, t.cols - 1);
1386
+ return;
1387
+ }
1388
+ if (e.key === "ArrowRight") {
1389
+ e.preventDefault(), Z(), Dr(E, t.rows, t.cols + 1);
1390
+ return;
1391
+ }
1392
+ }
1393
+ if (!F && E && (e.key === "Backspace" || e.key === "Delete")) {
1394
+ e.preventDefault(), qr();
1395
+ return;
1396
+ }
1397
+ if (E && e.key === "Enter" && !F) {
1398
+ e.preventDefault(), Nr(E);
1399
+ return;
1400
+ }
1401
+ }
1402
+ if (b === "table") {
1403
+ if (O && (e.ctrlKey || e.metaKey)) {
1404
+ let t = ar(O);
974
1405
  if (!t) return;
975
1406
  if (e.key === "ArrowUp") {
976
- e.preventDefault(), Z(), bn(A, t.rows - 1, t.cols);
1407
+ e.preventDefault(), Z(), Or(O, t.rows - 1, t.cols);
977
1408
  return;
978
1409
  }
979
1410
  if (e.key === "ArrowDown") {
980
- e.preventDefault(), Z(), bn(A, t.rows + 1, t.cols);
1411
+ e.preventDefault(), Z(), Or(O, t.rows + 1, t.cols);
981
1412
  return;
982
1413
  }
983
1414
  if (e.key === "ArrowLeft") {
984
- e.preventDefault(), Z(), bn(A, t.rows, t.cols - 1);
1415
+ e.preventDefault(), Z(), Or(O, t.rows, t.cols - 1);
985
1416
  return;
986
1417
  }
987
1418
  if (e.key === "ArrowRight") {
988
- e.preventDefault(), Z(), bn(A, t.rows, t.cols + 1);
1419
+ e.preventDefault(), Z(), Or(O, t.rows, t.cols + 1);
989
1420
  return;
990
1421
  }
991
1422
  }
992
- if (!I && A && (e.key === "Backspace" || e.key === "Delete")) {
993
- e.preventDefault(), Nn();
1423
+ if (!L && O && (e.key === "Backspace" || e.key === "Delete")) {
1424
+ e.preventDefault(), Jr();
994
1425
  return;
995
1426
  }
996
- if (A && e.key === "Enter" && !I) {
997
- e.preventDefault(), wn(A);
1427
+ if (O && e.key === "Enter" && !L) {
1428
+ e.preventDefault(), Fr(O);
998
1429
  return;
999
1430
  }
1000
1431
  }
1001
- if (C === "align") {
1002
- if (!R && M && (e.key === "Backspace" || e.key === "Delete")) {
1003
- e.preventDefault(), jn();
1432
+ if (b === "align") {
1433
+ if (!z && A && (e.key === "Backspace" || e.key === "Delete")) {
1434
+ e.preventDefault(), Wr();
1004
1435
  return;
1005
1436
  }
1006
- if (M && e.key === "Enter" && !R) {
1007
- e.preventDefault(), kn(M);
1437
+ if (A && e.key === "Enter" && !z) {
1438
+ e.preventDefault(), Hr(A);
1008
1439
  return;
1009
1440
  }
1010
1441
  }
1011
- if (!(C !== "graph" || F)) {
1012
- if ((e.ctrlKey || e.altKey) && E) {
1442
+ if (!(b !== "graph" || P)) {
1443
+ if ((e.ctrlKey || e.altKey) && S) {
1013
1444
  if (e.key === "ArrowLeft") {
1014
- e.preventDefault(), qn("left");
1445
+ e.preventDefault(), ci("left");
1015
1446
  return;
1016
1447
  }
1017
1448
  if (e.key === "ArrowRight") {
1018
- e.preventDefault(), qn("right");
1449
+ e.preventDefault(), ci("right");
1019
1450
  return;
1020
1451
  }
1021
1452
  if (e.key === "ArrowUp") {
1022
- e.preventDefault(), qn("up");
1453
+ e.preventDefault(), ci("up");
1023
1454
  return;
1024
1455
  }
1025
1456
  if (e.key === "ArrowDown") {
1026
- e.preventDefault(), qn("down");
1457
+ e.preventDefault(), ci("down");
1027
1458
  return;
1028
1459
  }
1029
1460
  }
1030
- if (!(!E && !O)) {
1031
- if (e.key === "Enter" && E) {
1032
- e.preventDefault(), Kn(e.shiftKey ? 0 : ye, e.shiftKey ? ye : 0);
1461
+ if (!(!S && !w)) {
1462
+ if (e.key === "Enter" && S) {
1463
+ e.preventDefault(), si(e.shiftKey ? 0 : we, e.shiftKey ? we : 0);
1033
1464
  return;
1034
1465
  }
1035
- if (e.key === "Tab" && E) {
1036
- e.preventDefault(), Kn(ye, 0);
1466
+ if (e.key === "Tab" && S) {
1467
+ e.preventDefault(), si(we, 0);
1037
1468
  return;
1038
1469
  }
1039
1470
  if (e.key === "Backspace" || e.key === "Delete") {
1040
- e.preventDefault(), E ? Un() : O && Wn();
1471
+ e.preventDefault(), S ? ii() : w && ai();
1041
1472
  return;
1042
1473
  }
1043
- if (e.key === "ArrowLeft" && E) {
1044
- e.preventDefault(), Gn(-be, 0);
1474
+ if (e.key === "ArrowLeft" && S) {
1475
+ e.preventDefault(), oi(-Te, 0);
1045
1476
  return;
1046
1477
  }
1047
- if (e.key === "ArrowRight" && E) {
1048
- e.preventDefault(), Gn(be, 0);
1478
+ if (e.key === "ArrowRight" && S) {
1479
+ e.preventDefault(), oi(Te, 0);
1049
1480
  return;
1050
1481
  }
1051
- if (e.key === "ArrowUp" && E) {
1052
- e.preventDefault(), Gn(0, -be);
1482
+ if (e.key === "ArrowUp" && S) {
1483
+ e.preventDefault(), oi(0, -Te);
1053
1484
  return;
1054
1485
  }
1055
- e.key === "ArrowDown" && E && (e.preventDefault(), Gn(0, be));
1486
+ e.key === "ArrowDown" && S && (e.preventDefault(), oi(0, Te));
1056
1487
  }
1057
1488
  }
1058
1489
  }
1059
1490
  };
1060
1491
  return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
1061
1492
  }, [
1493
+ P,
1062
1494
  F,
1063
- I,
1064
- Xe,
1065
- Je,
1495
+ St,
1496
+ bt,
1497
+ y,
1498
+ Dt,
1499
+ z,
1500
+ w,
1066
1501
  S,
1067
- $e,
1068
- R,
1069
- O,
1070
- E,
1071
- M,
1072
1502
  A,
1073
- C
1503
+ E,
1504
+ b
1074
1505
  ]);
1075
- let ur = en(P), dr = en(w), fr = nn(F), pr = nn(E), mr = rn(I), hr = rn(A), $ = an(R), gr = an(M), _r = new Map(Je.map((e) => [e.id, e]));
1076
- return /* @__PURE__ */ f("div", {
1506
+ let $ = tr(M), Ei = tr(Rt), Di = rr(P), Oi = rr(S), ki = ir(F), Ai = ir(E), ji = ar(L), Mi = ar(O), Ni = or(z), Pi = or(A), Fi = new Map(bt.map((e) => [e.id, e]));
1507
+ return /* @__PURE__ */ d("div", {
1077
1508
  style: {
1078
1509
  position: "relative",
1079
- width: V.width,
1080
- height: V.height,
1081
- overflow: "hidden"
1510
+ width: H.width,
1511
+ height: H.height,
1512
+ overflow: "hidden",
1513
+ cursor: b === "pan" ? Tn.current ? "grabbing" : "grab" : "default"
1082
1514
  },
1083
1515
  children: [
1084
- /* @__PURE__ */ f("div", {
1516
+ /* @__PURE__ */ d("div", {
1085
1517
  style: {
1086
1518
  position: "fixed",
1087
1519
  top: 12,
@@ -1089,1108 +1521,1572 @@ function x() {
1089
1521
  zIndex: 30,
1090
1522
  display: "flex",
1091
1523
  gap: 8,
1524
+ alignItems: "flex-start",
1092
1525
  padding: 8,
1093
- background: "rgba(255, 255, 255, 0.96)",
1094
- border: "1px solid #d4d4d4",
1526
+ background: i ? g.surface : "rgba(255, 255, 255, 0.96)",
1527
+ border: `1px solid ${g.border}`,
1095
1528
  borderRadius: 8,
1096
- boxShadow: "0 2px 8px rgba(0, 0, 0, 0.08)"
1529
+ boxShadow: i ? "0 6px 18px rgba(0, 0, 0, 0.35)" : "0 2px 8px rgba(0, 0, 0, 0.08)"
1097
1530
  },
1098
1531
  children: [
1099
- /* @__PURE__ */ d(b, {
1100
- active: C === "select",
1532
+ /* @__PURE__ */ d("div", {
1533
+ style: {
1534
+ position: "relative",
1535
+ paddingBottom: 40,
1536
+ marginBottom: -40
1537
+ },
1538
+ children: [/* @__PURE__ */ u(_, {
1539
+ active: !1,
1540
+ disabled: yn.length === 0,
1541
+ label: "Undo",
1542
+ onClick: Ci,
1543
+ colors: g,
1544
+ children: /* @__PURE__ */ u(ht, { active: !1 })
1545
+ }), /* @__PURE__ */ u("div", {
1546
+ style: {
1547
+ position: "absolute",
1548
+ top: "55%",
1549
+ left: 0,
1550
+ marginTop: 6
1551
+ },
1552
+ children: /* @__PURE__ */ u(_, {
1553
+ active: !1,
1554
+ disabled: xn.length === 0,
1555
+ label: "Redo",
1556
+ onClick: wi,
1557
+ colors: g,
1558
+ children: /* @__PURE__ */ u(gt, { active: !1 })
1559
+ })
1560
+ })]
1561
+ }),
1562
+ /* @__PURE__ */ u(_, {
1563
+ active: b === "select",
1101
1564
  label: "Select",
1102
- onClick: () => tt("select"),
1103
- children: /* @__PURE__ */ d(Fe, { active: C === "select" })
1565
+ onClick: () => kt("select"),
1566
+ colors: g,
1567
+ children: /* @__PURE__ */ u($e, { active: b === "select" })
1104
1568
  }),
1105
- /* @__PURE__ */ d(b, {
1106
- active: C === "pen",
1107
- label: "Pen",
1108
- onClick: () => tt("pen"),
1109
- children: /* @__PURE__ */ d(Ne, { active: C === "pen" })
1569
+ /* @__PURE__ */ u(_, {
1570
+ active: b === "pan",
1571
+ label: "Pan",
1572
+ onClick: () => kt("pan"),
1573
+ colors: g,
1574
+ children: /* @__PURE__ */ u(nt, { active: b === "pan" })
1575
+ }),
1576
+ /* @__PURE__ */ d("div", {
1577
+ style: {
1578
+ position: "relative",
1579
+ paddingBottom: It ? 132 : 0,
1580
+ marginBottom: It ? -132 : 0
1581
+ },
1582
+ onMouseEnter: () => Lt(!0),
1583
+ onMouseLeave: () => Lt(!1),
1584
+ children: [/* @__PURE__ */ u(_, {
1585
+ active: b === "pen",
1586
+ label: "Pen",
1587
+ onClick: () => kt("pen"),
1588
+ colors: g,
1589
+ children: /* @__PURE__ */ u(Ze, { active: b === "pen" })
1590
+ }), It && /* @__PURE__ */ u("div", {
1591
+ style: {
1592
+ position: "absolute",
1593
+ top: "20%",
1594
+ left: 0,
1595
+ marginTop: 0,
1596
+ display: "flex",
1597
+ flexDirection: "column",
1598
+ gap: 6,
1599
+ padding: 4,
1600
+ background: i ? g.surface : "rgba(255, 255, 255, 0.96)",
1601
+ border: `1px solid ${g.border}`,
1602
+ borderRadius: 8,
1603
+ boxShadow: i ? "0 6px 18px rgba(0, 0, 0, 0.35)" : "0 2px 8px rgba(0, 0, 0, 0.08)"
1604
+ },
1605
+ children: fe.map((e) => /* @__PURE__ */ u("button", {
1606
+ type: "button",
1607
+ "aria-label": `Pen size ${e}`,
1608
+ title: `Pen size ${e}`,
1609
+ onClick: () => Nt(e),
1610
+ style: {
1611
+ width: 28,
1612
+ height: 28,
1613
+ border: `1px solid ${g.border}`,
1614
+ borderRadius: "999px",
1615
+ background: Mt === e ? g.surfaceHover : g.surface,
1616
+ color: g.text,
1617
+ cursor: "pointer",
1618
+ display: "flex",
1619
+ alignItems: "center",
1620
+ justifyContent: "center",
1621
+ padding: 0
1622
+ },
1623
+ children: /* @__PURE__ */ u("span", { style: {
1624
+ width: `${e}px`,
1625
+ height: `${e}px`,
1626
+ borderRadius: "50%",
1627
+ background: "currentColor",
1628
+ display: "block"
1629
+ } })
1630
+ }, `pen-size-${e}`))
1631
+ })]
1110
1632
  }),
1111
- /* @__PURE__ */ d(b, {
1112
- active: C === "eraser",
1633
+ /* @__PURE__ */ u(_, {
1634
+ active: b === "eraser",
1113
1635
  label: "Eraser",
1114
- onClick: () => tt("eraser"),
1115
- children: /* @__PURE__ */ d(Pe, { active: C === "eraser" })
1636
+ onClick: () => kt("eraser"),
1637
+ colors: g,
1638
+ children: /* @__PURE__ */ u(Qe, { active: b === "eraser" })
1116
1639
  }),
1117
- /* @__PURE__ */ d(b, {
1118
- active: C === "text",
1640
+ /* @__PURE__ */ u(_, {
1641
+ active: b === "text",
1119
1642
  label: "Text",
1120
- onClick: () => tt("text"),
1121
- children: /* @__PURE__ */ d(Le, { active: C === "text" })
1643
+ onClick: () => kt("text"),
1644
+ colors: g,
1645
+ children: /* @__PURE__ */ u(tt, { active: b === "text" })
1122
1646
  }),
1123
- /* @__PURE__ */ d(b, {
1124
- active: C === "graph",
1647
+ /* @__PURE__ */ u(_, {
1648
+ active: b === "graph",
1125
1649
  label: "Graph",
1126
- onClick: () => tt("graph"),
1127
- children: /* @__PURE__ */ d(He, { active: C === "graph" })
1650
+ onClick: () => kt("graph"),
1651
+ colors: g,
1652
+ children: /* @__PURE__ */ u(ut, { active: b === "graph" })
1128
1653
  }),
1129
- /* @__PURE__ */ d(b, {
1130
- active: C === "matrix",
1654
+ /* @__PURE__ */ u(_, {
1655
+ active: b === "matrix",
1131
1656
  label: "Matrix",
1132
- onClick: () => tt("matrix"),
1133
- children: /* @__PURE__ */ d(Ue, { active: C === "matrix" })
1134
- }),
1135
- /* @__PURE__ */ d(b, {
1136
- active: C === "align",
1137
- label: "Align Math",
1138
- onClick: () => tt("align"),
1139
- children: /* @__PURE__ */ d(We, { active: C === "align" })
1657
+ onClick: () => kt("matrix"),
1658
+ colors: g,
1659
+ children: /* @__PURE__ */ u(dt, { active: b === "matrix" })
1140
1660
  }),
1141
- /* @__PURE__ */ d(b, {
1142
- active: !1,
1143
- disabled: At.length === 0,
1144
- label: "Undo",
1145
- onClick: cr,
1146
- children: /* @__PURE__ */ d(Ke, { active: !1 })
1661
+ /* @__PURE__ */ u(_, {
1662
+ active: b === "table",
1663
+ label: "Table",
1664
+ onClick: () => kt("table"),
1665
+ colors: g,
1666
+ children: /* @__PURE__ */ u(ft, { active: b === "table" })
1147
1667
  }),
1148
- /* @__PURE__ */ d(b, {
1149
- active: !1,
1150
- disabled: Mt.length === 0,
1151
- label: "Redo",
1152
- onClick: lr,
1153
- children: /* @__PURE__ */ d(qe, { active: !1 })
1668
+ /* @__PURE__ */ u(_, {
1669
+ active: b === "align",
1670
+ label: "Align Math",
1671
+ onClick: () => kt("align"),
1672
+ colors: g,
1673
+ children: /* @__PURE__ */ u(pt, { active: b === "align" })
1154
1674
  }),
1155
- /* @__PURE__ */ d(b, {
1156
- active: nt === "latex",
1675
+ /* @__PURE__ */ u(_, {
1676
+ active: At === "latex",
1157
1677
  label: "Toggle LaTeX",
1158
- onClick: sr,
1159
- children: /* @__PURE__ */ d(Ge, { active: nt === "latex" })
1678
+ onClick: Si,
1679
+ colors: g,
1680
+ children: /* @__PURE__ */ u(mt, { active: At === "latex" })
1160
1681
  }),
1161
- /* @__PURE__ */ d(b, {
1682
+ /* @__PURE__ */ u(_, {
1162
1683
  active: !1,
1163
1684
  label: "Clear",
1164
1685
  onClick: () => {
1165
- Z(), Ae([]), x([]), Ye([]), Ze([]), Qe([]), et([]), T(null), J(), Y(), X(), Q(), G(), K(), q(), H.current = !1;
1686
+ Z(), vt([]), yt([]), xt([]), Ct([]), wt([]), Et([]), Ot([]), x(null), J(), Y(), $n(), X(), Q(), G(), K(), Qn(), q(), U.current = !1;
1166
1687
  },
1167
- children: /* @__PURE__ */ d(Ie, {})
1688
+ colors: g,
1689
+ children: /* @__PURE__ */ u(et, {})
1168
1690
  })
1169
1691
  ]
1170
1692
  }),
1171
- /* @__PURE__ */ d(ee, {
1172
- width: V.width,
1173
- height: V.height,
1174
- onMouseDown: nr,
1175
- onClick: rr,
1176
- onMousemove: ir,
1177
- onMouseup: ar,
1178
- onTouchStart: nr,
1179
- onTap: rr,
1180
- onTouchMove: ir,
1181
- onTouchEnd: ar,
1182
- children: /* @__PURE__ */ f(c, { children: [
1183
- /* @__PURE__ */ d(u, {
1184
- x: 0,
1185
- y: 0,
1186
- width: V.width,
1187
- height: V.height,
1188
- fill: "white"
1189
- }),
1190
- i.map((e) => /* @__PURE__ */ d(l, {
1191
- points: e.points,
1192
- stroke: e.tool === "pen" ? "black" : "white",
1193
- strokeWidth: e.tool === "pen" ? 2 : 14,
1194
- tension: .5,
1195
- lineCap: "round",
1196
- lineJoin: "round"
1197
- }, e.id)),
1198
- Xe.map((e) => {
1199
- let t = _r.get(e.sourceId), n = _r.get(e.targetId);
1200
- if (!t || !n) return null;
1201
- let r = In(t, n);
1202
- return e.directed ? /* @__PURE__ */ d(a, {
1203
- points: r,
1204
- stroke: O === e.id ? "#111" : "#5f5f5f",
1205
- fill: O === e.id ? "#111" : "#5f5f5f",
1206
- strokeWidth: O === e.id ? 2.5 : 1.8,
1207
- pointerLength: 8,
1208
- pointerWidth: 8,
1209
- onClick: () => {
1210
- k(e.id), D(null), T(null), Y();
1211
- },
1212
- onTap: () => {
1213
- k(e.id), D(null), T(null), Y();
1214
- }
1215
- }, e.id) : /* @__PURE__ */ d(l, {
1216
- points: r,
1217
- stroke: O === e.id ? "#111" : "#5f5f5f",
1218
- strokeWidth: O === e.id ? 2.5 : 1.8,
1693
+ b === "pen" && /* @__PURE__ */ u("div", {
1694
+ style: {
1695
+ position: "fixed",
1696
+ top: 60,
1697
+ left: 66,
1698
+ zIndex: 29,
1699
+ display: "flex",
1700
+ gap: 6,
1701
+ alignItems: "center",
1702
+ padding: "6px 8px",
1703
+ background: i ? g.surface : "rgba(255, 255, 255, 0.96)",
1704
+ border: `1px solid ${g.border}`,
1705
+ borderRadius: 8,
1706
+ boxShadow: i ? "0 6px 18px rgba(0, 0, 0, 0.35)" : "0 2px 8px rgba(0, 0, 0, 0.08)"
1707
+ },
1708
+ children: st.map((e) => /* @__PURE__ */ u("button", {
1709
+ type: "button",
1710
+ "aria-label": `Pen color ${e}`,
1711
+ title: `Pen color ${e}`,
1712
+ onClick: () => Ft(e),
1713
+ style: {
1714
+ width: 22,
1715
+ height: 22,
1716
+ padding: 0,
1717
+ borderRadius: "999px",
1718
+ border: Pt === e ? `2px solid ${g.text}` : `1px solid ${g.border}`,
1719
+ background: e,
1720
+ cursor: "pointer",
1721
+ boxSizing: "border-box"
1722
+ }
1723
+ }, `pen-color-${e}`))
1724
+ }),
1725
+ /* @__PURE__ */ u(te, {
1726
+ width: H.width,
1727
+ height: H.height,
1728
+ onMouseDown: _i,
1729
+ onClick: vi,
1730
+ onMousemove: yi,
1731
+ onMouseup: bi,
1732
+ onTouchStart: _i,
1733
+ onTap: vi,
1734
+ onTouchMove: yi,
1735
+ onTouchEnd: bi,
1736
+ children: /* @__PURE__ */ d(c, { children: [/* @__PURE__ */ u(l, {
1737
+ x: 0,
1738
+ y: 0,
1739
+ width: H.width,
1740
+ height: H.height,
1741
+ fill: g.bg
1742
+ }), /* @__PURE__ */ d(s, {
1743
+ x: cn.x,
1744
+ y: cn.y,
1745
+ children: [
1746
+ _t.map((e) => /* @__PURE__ */ u(ee, {
1747
+ points: e.points,
1748
+ stroke: e.tool === "pen" ? e.color ?? g.text : g.bg,
1749
+ strokeWidth: e.tool === "pen" ? e.strokeWidth ?? Mt : 14,
1750
+ tension: .5,
1219
1751
  lineCap: "round",
1220
- onClick: () => {
1221
- k(e.id), D(null), T(null), Y();
1222
- },
1223
- onTap: () => {
1224
- k(e.id), D(null), T(null), Y();
1225
- }
1226
- }, e.id);
1227
- }),
1228
- Je.map((e) => {
1229
- let t = E === e.id, n = z === e.id, r = yt === e.id, i = F === e.id, a = n || t || i ? "#8c8c8c" : r ? "#b8b8b8" : "#555";
1230
- return /* @__PURE__ */ f(s, {
1231
- ref: (t) => {
1232
- Ut.current[e.id] = t;
1233
- },
1234
- x: e.x,
1235
- y: e.y,
1236
- draggable: C === "graph" || C === "select",
1237
- onMouseEnter: () => bt(e.id),
1238
- onMouseLeave: () => bt((t) => t === e.id ? null : t),
1239
- onClick: (t) => {
1240
- if (t.cancelBubble = !0, D(e.id), k(null), T(null), Y(), C === "graph") {
1241
- if (z && z !== e.id) {
1242
- Hn(z, e.id);
1243
- return;
1244
- }
1245
- if (E === e.id && z === e.id) {
1246
- Rn(e.id);
1247
- return;
1248
- }
1249
- B(e.id);
1752
+ lineJoin: "round"
1753
+ }, e.id)),
1754
+ St.map((e) => {
1755
+ let t = Fi.get(e.sourceId), n = Fi.get(e.targetId);
1756
+ if (!t || !n) return null;
1757
+ let r = Zr(t, n);
1758
+ return e.directed ? /* @__PURE__ */ u(a, {
1759
+ points: r,
1760
+ stroke: w === e.id ? "#111" : "#5f5f5f",
1761
+ fill: w === e.id ? "#111" : "#5f5f5f",
1762
+ strokeWidth: w === e.id ? 2.5 : 1.8,
1763
+ pointerLength: 8,
1764
+ pointerWidth: 8,
1765
+ onClick: () => {
1766
+ T(e.id), C(null), x(null), Y();
1767
+ },
1768
+ onTap: () => {
1769
+ T(e.id), C(null), x(null), Y();
1250
1770
  }
1251
- },
1252
- onTap: (t) => {
1253
- if (t.cancelBubble = !0, D(e.id), k(null), T(null), Y(), C === "graph") {
1254
- if (z && z !== e.id) {
1255
- Hn(z, e.id);
1256
- return;
1771
+ }, e.id) : /* @__PURE__ */ u(ee, {
1772
+ points: r,
1773
+ stroke: w === e.id ? "#111" : "#5f5f5f",
1774
+ strokeWidth: w === e.id ? 2.5 : 1.8,
1775
+ lineCap: "round",
1776
+ onClick: () => {
1777
+ T(e.id), C(null), x(null), Y();
1778
+ },
1779
+ onTap: () => {
1780
+ T(e.id), C(null), x(null), Y();
1781
+ }
1782
+ }, e.id);
1783
+ }),
1784
+ bt.map((e) => {
1785
+ let t = S === e.id, n = B === e.id, r = on === e.id, i = P === e.id, a = n || t || i ? "#8c8c8c" : r ? "#b8b8b8" : "#555";
1786
+ return /* @__PURE__ */ d(s, {
1787
+ ref: (t) => {
1788
+ In.current[e.id] = t;
1789
+ },
1790
+ x: e.x,
1791
+ y: e.y,
1792
+ draggable: b === "graph" || b === "select",
1793
+ onMouseEnter: () => sn(e.id),
1794
+ onMouseLeave: () => sn((t) => t === e.id ? null : t),
1795
+ onClick: (t) => {
1796
+ if (t.cancelBubble = !0, C(e.id), T(null), x(null), Y(), b === "graph") {
1797
+ if (B && B !== e.id) {
1798
+ ri(B, e.id);
1799
+ return;
1800
+ }
1801
+ if (S === e.id && B === e.id) {
1802
+ $r(e.id);
1803
+ return;
1804
+ }
1805
+ V(e.id);
1257
1806
  }
1258
- if (E === e.id && z === e.id) {
1259
- Rn(e.id);
1260
- return;
1807
+ },
1808
+ onTap: (t) => {
1809
+ if (t.cancelBubble = !0, C(e.id), T(null), x(null), Y(), b === "graph") {
1810
+ if (B && B !== e.id) {
1811
+ ri(B, e.id);
1812
+ return;
1813
+ }
1814
+ if (S === e.id && B === e.id) {
1815
+ $r(e.id);
1816
+ return;
1817
+ }
1818
+ V(e.id);
1261
1819
  }
1262
- B(e.id);
1263
- }
1820
+ },
1821
+ onDblClick: (t) => {
1822
+ t.cancelBubble = !0, $r(e.id);
1823
+ },
1824
+ onDblTap: (t) => {
1825
+ t.cancelBubble = !0, $r(e.id);
1826
+ },
1827
+ onDragStart: (t) => {
1828
+ t.cancelBubble = !0, C(e.id), T(null);
1829
+ },
1830
+ onDragEnd: (t) => {
1831
+ Z(), Xr(e.id, (e) => ({
1832
+ ...e,
1833
+ x: t.target.x(),
1834
+ y: t.target.y()
1835
+ }));
1836
+ },
1837
+ onTransformEnd: (t) => {
1838
+ Z();
1839
+ let n = t.target, r = Math.max(Se, Math.max(e.width * n.scaleX(), e.height * n.scaleY()));
1840
+ n.scaleX(1), n.scaleY(1), Xr(e.id, (e) => ({
1841
+ ...e,
1842
+ x: n.x(),
1843
+ y: n.y(),
1844
+ width: r,
1845
+ height: r
1846
+ }));
1847
+ },
1848
+ children: [/* @__PURE__ */ u(o, {
1849
+ x: e.width / 2,
1850
+ y: e.height / 2,
1851
+ radius: Math.min(e.width, e.height) / 2,
1852
+ fill: "transparent",
1853
+ stroke: a,
1854
+ strokeWidth: t || n ? 2.5 : 1.8
1855
+ }), /* @__PURE__ */ u(ne, {
1856
+ x: 10,
1857
+ y: e.height / 2 - 10,
1858
+ width: Math.max(e.width - 20, 20),
1859
+ align: "center",
1860
+ verticalAlign: "middle",
1861
+ text: e.label || " ",
1862
+ fontSize: 18,
1863
+ fill: g.text,
1864
+ fontFamily: Ne,
1865
+ listening: !1
1866
+ })]
1867
+ }, e.id);
1868
+ }),
1869
+ y.map((e) => /* @__PURE__ */ u(l, {
1870
+ ref: (t) => {
1871
+ Ln.current[e.id] = t;
1264
1872
  },
1265
- onDblClick: (t) => {
1266
- t.cancelBubble = !0, Rn(e.id);
1873
+ x: e.x,
1874
+ y: e.y,
1875
+ width: gr(e),
1876
+ height: _r(e),
1877
+ fill: "transparent",
1878
+ stroke: "transparent",
1879
+ strokeWidth: 1,
1880
+ draggable: b === "matrix" || b === "select",
1881
+ onClick: () => {
1882
+ D(e.id), x(null), J();
1267
1883
  },
1268
- onDblTap: (t) => {
1269
- t.cancelBubble = !0, Rn(e.id);
1884
+ onTap: () => {
1885
+ D(e.id), x(null), J();
1270
1886
  },
1271
- onDragStart: (t) => {
1272
- t.cancelBubble = !0, D(e.id), k(null);
1887
+ onDblClick: () => Nr(e.id),
1888
+ onDblTap: () => Nr(e.id),
1889
+ onDragStart: () => {
1890
+ D(e.id), x(null), J();
1273
1891
  },
1274
1892
  onDragEnd: (t) => {
1275
- Z(), Fn(e.id, (e) => ({
1893
+ Z();
1894
+ let n = Lr(e, t.target.x(), t.target.y());
1895
+ Er(e.id, (e) => ({
1276
1896
  ...e,
1277
- x: t.target.x(),
1278
- y: t.target.y()
1897
+ x: n.x,
1898
+ y: n.y
1279
1899
  }));
1280
1900
  },
1281
1901
  onTransformEnd: (t) => {
1282
1902
  Z();
1283
- let n = t.target, r = Math.max(_e, Math.max(e.width * n.scaleX(), e.height * n.scaleY()));
1284
- n.scaleX(1), n.scaleY(1), Fn(e.id, (e) => ({
1903
+ let n = t.target, r = Math.max(1, Math.min(Oe, Math.round((n.width() * n.scaleX() - h * 2) / (Ae + je * 2)))), i = Math.max(1, Math.min(Oe, Math.round((n.height() * n.scaleY() - h * 2) / m)));
1904
+ n.scaleX(1), n.scaleY(1);
1905
+ let a = Lr(e, n.x(), n.y());
1906
+ Er(e.id, (e) => ({
1285
1907
  ...e,
1286
- x: n.x(),
1908
+ x: a.x,
1909
+ y: a.y,
1910
+ rows: i,
1911
+ cols: r,
1912
+ cells: dr(e.cells, i, r),
1913
+ rowSeparators: fr(e.rowSeparators, i - 1),
1914
+ colSeparators: fr(e.colSeparators, r - 1)
1915
+ }));
1916
+ }
1917
+ }, e.id)),
1918
+ Tt.map((e) => /* @__PURE__ */ u(l, {
1919
+ ref: (t) => {
1920
+ Rn.current[e.id] = t;
1921
+ },
1922
+ x: e.x,
1923
+ y: e.y,
1924
+ width: br(e),
1925
+ height: xr(e),
1926
+ fill: "transparent",
1927
+ stroke: "transparent",
1928
+ strokeWidth: 1,
1929
+ draggable: b === "table" || b === "select",
1930
+ onClick: () => {
1931
+ k(e.id), x(null), J(), Y();
1932
+ },
1933
+ onTap: () => {
1934
+ k(e.id), x(null), J(), Y();
1935
+ },
1936
+ onDblClick: () => Fr(e.id),
1937
+ onDblTap: () => Fr(e.id),
1938
+ onDragStart: () => {
1939
+ k(e.id), x(null), J(), Y();
1940
+ },
1941
+ onDragEnd: (t) => {
1942
+ Z();
1943
+ let n = Rr(e, t.target.x(), t.target.y());
1944
+ cr(e.id, (e) => ({
1945
+ ...e,
1946
+ x: n.x,
1947
+ y: n.y
1948
+ }));
1949
+ },
1950
+ onTransformEnd: (t) => {
1951
+ Z();
1952
+ let n = t.target, r = Math.max(1, Math.min(ke, Math.round(n.width() * n.scaleX() / (Ae + je * 2)))), i = Math.max(1, Math.min(ke, Math.round(n.height() * n.scaleY() / m)));
1953
+ n.scaleX(1), n.scaleY(1);
1954
+ let a = Rr(e, n.x(), n.y());
1955
+ cr(e.id, (e) => ({
1956
+ ...e,
1957
+ x: a.x,
1958
+ y: a.y,
1959
+ rows: i,
1960
+ cols: r,
1961
+ cells: dr(e.cells, i, r)
1962
+ }));
1963
+ }
1964
+ }, e.id)),
1965
+ Dt.map((e) => /* @__PURE__ */ u(l, {
1966
+ ref: (t) => {
1967
+ zn.current[e.id] = t;
1968
+ },
1969
+ x: e.x,
1970
+ y: e.y,
1971
+ width: e.width,
1972
+ height: e.height,
1973
+ fill: "transparent",
1974
+ stroke: "transparent",
1975
+ draggable: b === "align" || b === "select",
1976
+ onClick: () => {
1977
+ j(e.id), x(null), J(), Y();
1978
+ },
1979
+ onTap: () => {
1980
+ j(e.id), x(null), J(), Y();
1981
+ },
1982
+ onDblClick: () => Hr(e.id),
1983
+ onDblTap: () => Hr(e.id),
1984
+ onDragEnd: (t) => {
1985
+ Z(), sr(e.id, (e) => ({
1986
+ ...e,
1987
+ x: t.target.x(),
1988
+ y: t.target.y()
1989
+ }));
1990
+ },
1991
+ onTransformEnd: (t) => {
1992
+ Z();
1993
+ let n = t.target, r = Math.max(180, n.width() * n.scaleX()), i = Math.max(60, n.height() * n.scaleY());
1994
+ n.scaleX(1), n.scaleY(1), sr(e.id, (e) => ({
1995
+ ...e,
1996
+ x: n.x(),
1287
1997
  y: n.y(),
1288
1998
  width: r,
1289
- height: r
1999
+ height: i
1290
2000
  }));
2001
+ }
2002
+ }, e.id)),
2003
+ v.map((e) => /* @__PURE__ */ u(l, {
2004
+ ref: (t) => {
2005
+ Fn.current[e.id] = t;
1291
2006
  },
1292
- children: [/* @__PURE__ */ d(o, {
1293
- x: e.width / 2,
1294
- y: e.height / 2,
1295
- radius: Math.min(e.width, e.height) / 2,
1296
- fill: "transparent",
1297
- stroke: a,
1298
- strokeWidth: t || n ? 2.5 : 1.8
1299
- }), /* @__PURE__ */ d(te, {
1300
- x: 10,
1301
- y: e.height / 2 - 10,
1302
- width: Math.max(e.width - 20, 20),
1303
- align: "center",
1304
- verticalAlign: "middle",
1305
- text: e.label || " ",
1306
- fontSize: 18,
1307
- fill: "#111",
1308
- fontFamily: v,
1309
- listening: !1
1310
- })]
1311
- }, e.id);
1312
- }),
1313
- S.map((e) => /* @__PURE__ */ d(u, {
1314
- ref: (t) => {
1315
- Wt.current[e.id] = t;
1316
- },
1317
- x: e.x,
1318
- y: e.y,
1319
- width: mn(e),
1320
- height: hn(e),
1321
- fill: "transparent",
1322
- stroke: "transparent",
1323
- strokeWidth: 1,
1324
- draggable: C === "matrix" || C === "select",
1325
- onClick: () => {
1326
- j(e.id), T(null), J();
1327
- },
1328
- onTap: () => {
1329
- j(e.id), T(null), J();
1330
- },
1331
- onDblClick: () => wn(e.id),
1332
- onDblTap: () => wn(e.id),
1333
- onDragStart: () => {
1334
- j(e.id), T(null), J();
1335
- },
1336
- onDragEnd: (t) => {
1337
- Z();
1338
- let n = En(e, t.target.x(), t.target.y());
1339
- yn(e.id, (e) => ({
1340
- ...e,
1341
- x: n.x,
1342
- y: n.y
1343
- }));
1344
- },
1345
- onTransformEnd: (t) => {
1346
- Z();
1347
- let n = t.target, r = Math.max(1, Math.min(h, Math.round((n.width() * n.scaleX() - g * 2) / (Se + we * 2)))), i = Math.max(1, Math.min(h, Math.round((n.height() * n.scaleY() - g * 2) / Ce)));
1348
- n.scaleX(1), n.scaleY(1);
1349
- let a = En(e, n.x(), n.y());
1350
- yn(e.id, (e) => ({
1351
- ...e,
1352
- x: a.x,
1353
- y: a.y,
1354
- rows: i,
1355
- cols: r,
1356
- cells: ln(e.cells, i, r),
1357
- rowSeparators: un(e.rowSeparators, i - 1),
1358
- colSeparators: un(e.colSeparators, r - 1)
1359
- }));
1360
- }
1361
- }, e.id)),
1362
- $e.map((e) => /* @__PURE__ */ d(u, {
1363
- ref: (t) => {
1364
- Gt.current[e.id] = t;
1365
- },
1366
- x: e.x,
1367
- y: e.y,
1368
- width: e.width,
1369
- height: e.height,
1370
- fill: "transparent",
1371
- stroke: "transparent",
1372
- draggable: C === "align" || C === "select",
1373
- onClick: () => {
1374
- N(e.id), T(null), J(), Y();
1375
- },
1376
- onTap: () => {
1377
- N(e.id), T(null), J(), Y();
1378
- },
1379
- onDblClick: () => kn(e.id),
1380
- onDblTap: () => kn(e.id),
1381
- onDragEnd: (t) => {
1382
- Z(), on(e.id, (e) => ({
1383
- ...e,
1384
- x: t.target.x(),
1385
- y: t.target.y()
1386
- }));
1387
- },
1388
- onTransformEnd: (t) => {
1389
- Z();
1390
- let n = t.target, r = Math.max(180, n.width() * n.scaleX()), i = Math.max(60, n.height() * n.scaleY());
1391
- n.scaleX(1), n.scaleY(1), on(e.id, (e) => ({
1392
- ...e,
1393
- x: n.x(),
1394
- y: n.y(),
1395
- width: r,
1396
- height: i
1397
- }));
1398
- }
1399
- }, e.id)),
1400
- y.map((e) => /* @__PURE__ */ d(u, {
1401
- ref: (t) => {
1402
- Ht.current[e.id] = t;
1403
- },
1404
- x: e.x,
1405
- y: e.y,
1406
- width: Ot[e.id] ?? e.width,
1407
- height: Math.max(Et[e.id] ?? p, e.height),
1408
- fill: "transparent",
1409
- stroke: "transparent",
1410
- dash: [],
1411
- strokeWidth: 1,
1412
- draggable: C === "select",
1413
- onClick: () => {
1414
- C === "select" && (J(), Y(), T(e.id), rt(e.renderMode));
1415
- },
1416
- onTap: () => {
1417
- C === "select" && (J(), Y(), T(e.id), rt(e.renderMode));
1418
- },
1419
- onDblClick: () => Zn(e.id),
1420
- onDblTap: () => Zn(e.id),
1421
- onDragStart: () => {
1422
- C === "select" && T(e.id);
1423
- },
1424
- onDragEnd: (t) => {
1425
- Z(), tn(e.id, (e) => ({
1426
- ...e,
1427
- x: t.target.x(),
1428
- y: t.target.y()
1429
- }));
1430
- }
1431
- }, e.id)),
1432
- /* @__PURE__ */ d(ne, {
1433
- ref: Rt,
1434
- enabledAnchors: [
1435
- "top-left",
1436
- "top-center",
1437
- "top-right",
1438
- "middle-left",
1439
- "middle-right",
1440
- "bottom-left",
1441
- "bottom-center",
1442
- "bottom-right"
1443
- ],
1444
- rotateEnabled: !1,
1445
- boundBoxFunc: (e, t) => ({
1446
- ...t,
1447
- width: Math.max(m, t.width),
1448
- height: Math.max(p, t.height)
1449
- })
1450
- }),
1451
- /* @__PURE__ */ d(ne, {
1452
- ref: zt,
1453
- enabledAnchors: [
1454
- "top-left",
1455
- "top-center",
1456
- "top-right",
1457
- "middle-left",
1458
- "middle-right",
1459
- "bottom-left",
1460
- "bottom-center",
1461
- "bottom-right"
1462
- ],
1463
- rotateEnabled: !1,
1464
- boundBoxFunc: (e, t) => {
1465
- let n = Math.max(_e, ve, t.width, t.height);
1466
- return {
2007
+ x: e.x,
2008
+ y: e.y,
2009
+ width: _n[e.id] ?? e.width,
2010
+ height: Math.max(hn[e.id] ?? f, e.height),
2011
+ fill: "transparent",
2012
+ stroke: "transparent",
2013
+ dash: [],
2014
+ strokeWidth: 1,
2015
+ draggable: b === "select",
2016
+ onClick: () => {
2017
+ b === "select" && (J(), Y(), x(e.id), jt(e.renderMode));
2018
+ },
2019
+ onTap: () => {
2020
+ b === "select" && (J(), Y(), x(e.id), jt(e.renderMode));
2021
+ },
2022
+ onDblClick: () => fi(e.id),
2023
+ onDblTap: () => fi(e.id),
2024
+ onDragStart: () => {
2025
+ b === "select" && x(e.id);
2026
+ },
2027
+ onDragEnd: (t) => {
2028
+ Z(), nr(e.id, (e) => ({
2029
+ ...e,
2030
+ x: t.target.x(),
2031
+ y: t.target.y()
2032
+ }));
2033
+ }
2034
+ }, e.id)),
2035
+ /* @__PURE__ */ u(re, {
2036
+ ref: An,
2037
+ enabledAnchors: [
2038
+ "top-left",
2039
+ "top-center",
2040
+ "top-right",
2041
+ "middle-left",
2042
+ "middle-right",
2043
+ "bottom-left",
2044
+ "bottom-center",
2045
+ "bottom-right"
2046
+ ],
2047
+ rotateEnabled: !1,
2048
+ boundBoxFunc: (e, t) => ({
1467
2049
  ...t,
1468
- width: n,
1469
- height: n
1470
- };
1471
- }
1472
- }),
1473
- /* @__PURE__ */ d(ne, {
1474
- ref: Bt,
1475
- enabledAnchors: [
1476
- "top-left",
1477
- "top-center",
1478
- "top-right",
1479
- "middle-left",
1480
- "middle-right",
1481
- "bottom-left",
1482
- "bottom-center",
1483
- "bottom-right"
1484
- ],
1485
- rotateEnabled: !1,
1486
- boundBoxFunc: (e, t) => ({
1487
- ...t,
1488
- width: Math.max(Se + we * 2 + g * 2, t.width),
1489
- height: Math.max(Ce + g * 2, t.height)
1490
- })
1491
- }),
1492
- /* @__PURE__ */ d(ne, {
1493
- ref: Vt,
1494
- enabledAnchors: [
1495
- "top-left",
1496
- "top-right",
1497
- "bottom-left",
1498
- "bottom-right",
1499
- "middle-left",
1500
- "middle-right"
1501
- ],
1502
- rotateEnabled: !1,
1503
- boundBoxFunc: (e, t) => ({
1504
- ...t,
1505
- width: Math.max(180, t.width),
1506
- height: Math.max(60, t.height)
2050
+ width: Math.max(p, t.width),
2051
+ height: Math.max(f, t.height)
2052
+ })
2053
+ }),
2054
+ /* @__PURE__ */ u(re, {
2055
+ ref: jn,
2056
+ enabledAnchors: [
2057
+ "top-left",
2058
+ "top-center",
2059
+ "top-right",
2060
+ "middle-left",
2061
+ "middle-right",
2062
+ "bottom-left",
2063
+ "bottom-center",
2064
+ "bottom-right"
2065
+ ],
2066
+ rotateEnabled: !1,
2067
+ boundBoxFunc: (e, t) => {
2068
+ let n = Math.max(Se, Ce, t.width, t.height);
2069
+ return {
2070
+ ...t,
2071
+ width: n,
2072
+ height: n
2073
+ };
2074
+ }
2075
+ }),
2076
+ /* @__PURE__ */ u(re, {
2077
+ ref: Mn,
2078
+ borderStroke: "transparent",
2079
+ borderStrokeWidth: 0,
2080
+ anchorFill: g.surface,
2081
+ anchorStroke: g.border,
2082
+ anchorStrokeWidth: 1,
2083
+ enabledAnchors: [
2084
+ "top-left",
2085
+ "top-center",
2086
+ "top-right",
2087
+ "middle-left",
2088
+ "middle-right",
2089
+ "bottom-left",
2090
+ "bottom-center",
2091
+ "bottom-right"
2092
+ ],
2093
+ rotateEnabled: !1,
2094
+ boundBoxFunc: (e, t) => ({
2095
+ ...t,
2096
+ width: Math.max(Ae + je * 2 + h * 2, t.width),
2097
+ height: Math.max(m + h * 2, t.height)
2098
+ })
2099
+ }),
2100
+ /* @__PURE__ */ u(re, {
2101
+ ref: Nn,
2102
+ borderStroke: "transparent",
2103
+ borderStrokeWidth: 0,
2104
+ anchorFill: g.surface,
2105
+ anchorStroke: g.border,
2106
+ anchorStrokeWidth: 1,
2107
+ enabledAnchors: [
2108
+ "top-left",
2109
+ "top-center",
2110
+ "top-right",
2111
+ "middle-left",
2112
+ "middle-right",
2113
+ "bottom-left",
2114
+ "bottom-center",
2115
+ "bottom-right"
2116
+ ],
2117
+ rotateEnabled: !1,
2118
+ boundBoxFunc: (e, t) => ({
2119
+ ...t,
2120
+ width: Math.max(Ae + je * 2, t.width),
2121
+ height: Math.max(m, t.height)
2122
+ })
2123
+ }),
2124
+ /* @__PURE__ */ u(re, {
2125
+ ref: Pn,
2126
+ enabledAnchors: [
2127
+ "top-left",
2128
+ "top-right",
2129
+ "bottom-left",
2130
+ "bottom-right",
2131
+ "middle-left",
2132
+ "middle-right"
2133
+ ],
2134
+ rotateEnabled: !1,
2135
+ boundBoxFunc: (e, t) => ({
2136
+ ...t,
2137
+ width: Math.max(180, t.width),
2138
+ height: Math.max(60, t.height)
2139
+ })
1507
2140
  })
1508
- })
1509
- ] })
2141
+ ]
2142
+ })] })
1510
2143
  }),
1511
- C === "eraser" && Pt.visible && /* @__PURE__ */ d("div", { style: {
2144
+ b === "eraser" && Cn.visible && /* @__PURE__ */ u("div", { style: {
1512
2145
  position: "absolute",
1513
- left: `${Pt.x - Pt.radius}px`,
1514
- top: `${Pt.y - Pt.radius}px`,
1515
- width: `${Pt.radius * 2}px`,
1516
- height: `${Pt.radius * 2}px`,
1517
- border: "2px dotted #7a7a7a",
2146
+ left: `${Cn.x - Cn.radius}px`,
2147
+ top: `${Cn.y - Cn.radius}px`,
2148
+ width: `${Cn.radius * 2}px`,
2149
+ height: `${Cn.radius * 2}px`,
2150
+ border: `2px dotted ${g.eraser}`,
1518
2151
  borderRadius: "50%",
1519
2152
  pointerEvents: "none",
1520
2153
  boxSizing: "border-box",
1521
2154
  zIndex: 1100
1522
2155
  } }),
1523
- dr && !ur && /* @__PURE__ */ d("button", {
1524
- type: "button",
1525
- "aria-label": "Delete text block",
1526
- title: "Delete text block",
1527
- onClick: () => {
1528
- Z(), x((e) => e.filter((e) => e.id !== dr.id)), T(null);
1529
- },
1530
- style: {
1531
- position: "absolute",
1532
- left: `${dr.x + (Ot[dr.id] ?? dr.width) / 2 - 14}px`,
1533
- top: `${dr.y - 30}px`,
1534
- width: "28px",
1535
- height: "28px",
1536
- display: "flex",
1537
- alignItems: "center",
1538
- justifyContent: "center",
1539
- border: "1px solid #f5c2c7",
1540
- borderRadius: "999px",
1541
- background: "#fff5f5",
1542
- cursor: "pointer",
1543
- zIndex: 1150
1544
- },
1545
- children: /* @__PURE__ */ d(Me, {})
1546
- }),
1547
- pr && !fr && /* @__PURE__ */ d("button", {
1548
- type: "button",
1549
- "aria-label": "Delete graph node",
1550
- title: "Delete graph node",
1551
- onClick: () => {
1552
- Un();
1553
- },
1554
- style: {
1555
- position: "absolute",
1556
- left: `${pr.x + pr.width / 2 - 14}px`,
1557
- top: `${pr.y - 30}px`,
1558
- width: "28px",
1559
- height: "28px",
1560
- display: "flex",
1561
- alignItems: "center",
1562
- justifyContent: "center",
1563
- border: "1px solid #f5c2c7",
1564
- borderRadius: "999px",
1565
- background: "#fff5f5",
1566
- cursor: "pointer",
1567
- zIndex: 1150
1568
- },
1569
- children: /* @__PURE__ */ d(Me, {})
1570
- }),
1571
- hr && !mr && /* @__PURE__ */ f(re, { children: [/* @__PURE__ */ d("button", {
1572
- type: "button",
1573
- "aria-label": "Fill empty matrix cells with zeros",
1574
- title: "Fill empty matrix cells with zeros",
1575
- onClick: () => Cn(hr.id),
1576
- style: {
1577
- position: "absolute",
1578
- left: `${hr.x + mn(hr) / 2 - 64}px`,
1579
- top: `${hr.y - 32}px`,
1580
- height: "28px",
1581
- padding: "0 10px",
1582
- border: "1px solid #d9d9d9",
1583
- borderRadius: "999px",
1584
- background: "#fff",
1585
- cursor: "pointer",
1586
- zIndex: 1150,
1587
- fontSize: 12
1588
- },
1589
- children: "Fill 0s"
1590
- }), /* @__PURE__ */ d("button", {
1591
- type: "button",
1592
- "aria-label": "Delete matrix",
1593
- title: "Delete matrix",
1594
- onClick: () => Nn(),
1595
- style: {
1596
- position: "absolute",
1597
- left: `${hr.x + mn(hr) / 2 + 36}px`,
1598
- top: `${hr.y - 30}px`,
1599
- width: "28px",
1600
- height: "28px",
1601
- display: "flex",
1602
- alignItems: "center",
1603
- justifyContent: "center",
1604
- border: "1px solid #f5c2c7",
1605
- borderRadius: "999px",
1606
- background: "#fff5f5",
1607
- cursor: "pointer",
1608
- zIndex: 1150
1609
- },
1610
- children: /* @__PURE__ */ d(Me, {})
1611
- })] }),
1612
- gr && !$ && /* @__PURE__ */ d("button", {
1613
- type: "button",
1614
- "aria-label": "Delete align block",
1615
- title: "Delete align block",
1616
- onClick: () => jn(),
1617
- style: {
1618
- position: "absolute",
1619
- left: `${gr.x + gr.width / 2 - 14}px`,
1620
- top: `${gr.y - 30}px`,
1621
- width: "28px",
1622
- height: "28px",
1623
- display: "flex",
1624
- alignItems: "center",
1625
- justifyContent: "center",
1626
- border: "1px solid #f5c2c7",
1627
- borderRadius: "999px",
1628
- background: "#fff5f5",
1629
- cursor: "pointer",
1630
- zIndex: 1150
1631
- },
1632
- children: /* @__PURE__ */ d(Me, {})
1633
- }),
1634
- /* @__PURE__ */ f("div", {
2156
+ /* @__PURE__ */ d("div", {
1635
2157
  style: {
1636
2158
  position: "absolute",
1637
2159
  inset: 0,
1638
- zIndex: 1e3,
2160
+ transform: `translate(${cn.x}px, ${cn.y}px)`,
2161
+ transformOrigin: "top left",
1639
2162
  pointerEvents: "none"
1640
2163
  },
1641
2164
  children: [
1642
- lt && /* @__PURE__ */ d("div", {
2165
+ Ei && !$ && /* @__PURE__ */ u("button", {
2166
+ type: "button",
2167
+ "aria-label": "Delete text block",
2168
+ title: "Delete text block",
2169
+ onMouseDown: (e) => {
2170
+ e.preventDefault(), e.stopPropagation();
2171
+ },
2172
+ onClick: () => {
2173
+ Z(), yt((e) => e.filter((e) => e.id !== Ei.id)), x(null);
2174
+ },
1643
2175
  style: {
1644
2176
  position: "absolute",
1645
- left: `${lt.left}px`,
1646
- top: `${lt.top}px`,
1647
- transform: "translate(-10%, -100%)",
1648
- maxWidth: "240px",
1649
- padding: "6px 12px",
2177
+ left: `${Ei.x + (_n[Ei.id] ?? Ei.width) / 2 - 14}px`,
2178
+ top: `${Ei.y - 30}px`,
2179
+ width: "28px",
2180
+ height: "28px",
2181
+ display: "flex",
2182
+ alignItems: "center",
2183
+ justifyContent: "center",
2184
+ border: "1px solid #f5c2c7",
2185
+ borderRadius: "999px",
2186
+ background: "#fff5f5",
2187
+ cursor: "pointer",
2188
+ zIndex: 1150
2189
+ },
2190
+ children: /* @__PURE__ */ u(Xe, {})
2191
+ }),
2192
+ Oi && !Di && /* @__PURE__ */ u("button", {
2193
+ type: "button",
2194
+ "aria-label": "Delete graph node",
2195
+ title: "Delete graph node",
2196
+ onMouseDown: (e) => {
2197
+ e.preventDefault(), e.stopPropagation();
2198
+ },
2199
+ onClick: () => {
2200
+ ii();
2201
+ },
2202
+ style: {
2203
+ position: "absolute",
2204
+ left: `${Oi.x + Oi.width / 2 - 14}px`,
2205
+ top: `${Oi.y - 30}px`,
2206
+ width: "28px",
2207
+ height: "28px",
2208
+ display: "flex",
2209
+ alignItems: "center",
2210
+ justifyContent: "center",
2211
+ border: "1px solid #f5c2c7",
2212
+ borderRadius: "999px",
2213
+ background: "#fff5f5",
2214
+ cursor: "pointer",
2215
+ zIndex: 1150,
2216
+ pointerEvents: "auto"
2217
+ },
2218
+ children: /* @__PURE__ */ u(Xe, {})
2219
+ }),
2220
+ Ai && !ki && /* @__PURE__ */ d(ie, { children: [/* @__PURE__ */ u("button", {
2221
+ type: "button",
2222
+ "aria-label": "Fill empty matrix cells with zeros",
2223
+ title: "Fill empty matrix cells with zeros",
2224
+ onMouseDown: (e) => {
2225
+ e.preventDefault(), e.stopPropagation();
2226
+ },
2227
+ onClick: () => jr(Ai.id),
2228
+ style: {
2229
+ position: "absolute",
2230
+ left: `${Ai.x + gr(Ai) / 2 - 64}px`,
2231
+ top: `${Ai.y - 32}px`,
2232
+ height: "28px",
2233
+ padding: "0 10px",
1650
2234
  border: "1px solid #d9d9d9",
1651
2235
  borderRadius: "999px",
1652
- background: "rgba(255, 255, 255, 0.96)",
1653
- color: "#111",
1654
- boxShadow: "0 2px 8px rgba(0, 0, 0, 0.08)",
1655
- whiteSpace: "nowrap",
1656
- overflow: "hidden",
1657
- textOverflow: "ellipsis",
1658
- pointerEvents: "none"
2236
+ background: "#fff",
2237
+ cursor: "pointer",
2238
+ zIndex: 1150,
2239
+ fontSize: 12,
2240
+ pointerEvents: "auto"
1659
2241
  },
1660
- children: /* @__PURE__ */ d(Re, {
1661
- expression: lt.expression,
1662
- fallback: lt.fallback
1663
- })
2242
+ children: "Fill 0s"
2243
+ }), /* @__PURE__ */ u("button", {
2244
+ type: "button",
2245
+ "aria-label": "Delete matrix",
2246
+ title: "Delete matrix",
2247
+ onMouseDown: (e) => {
2248
+ e.preventDefault(), e.stopPropagation();
2249
+ },
2250
+ onClick: () => qr(),
2251
+ style: {
2252
+ position: "absolute",
2253
+ left: `${Ai.x + gr(Ai) / 2 + 36}px`,
2254
+ top: `${Ai.y - 30}px`,
2255
+ width: "28px",
2256
+ height: "28px",
2257
+ display: "flex",
2258
+ alignItems: "center",
2259
+ justifyContent: "center",
2260
+ border: "1px solid #f5c2c7",
2261
+ borderRadius: "999px",
2262
+ background: "#fff5f5",
2263
+ cursor: "pointer",
2264
+ zIndex: 1150,
2265
+ pointerEvents: "auto"
2266
+ },
2267
+ children: /* @__PURE__ */ u(Xe, {})
2268
+ })] }),
2269
+ Mi && !ji && /* @__PURE__ */ d(ie, { children: [/* @__PURE__ */ u("button", {
2270
+ type: "button",
2271
+ onMouseDown: (e) => {
2272
+ e.preventDefault(), e.stopPropagation();
2273
+ },
2274
+ onClick: () => Mr(Mi.id),
2275
+ style: {
2276
+ position: "absolute",
2277
+ left: `${Mi.x + br(Mi) / 2 - 64}px`,
2278
+ top: `${Mi.y - 30}px`,
2279
+ padding: "6px 10px",
2280
+ border: "1px solid #d9d9d9",
2281
+ borderRadius: "999px",
2282
+ background: "#fff",
2283
+ cursor: "pointer",
2284
+ fontSize: 12,
2285
+ zIndex: 1150,
2286
+ pointerEvents: "auto"
2287
+ },
2288
+ children: "Fill 0s"
2289
+ }), /* @__PURE__ */ u("button", {
2290
+ type: "button",
2291
+ "aria-label": "Delete table",
2292
+ title: "Delete table",
2293
+ onMouseDown: (e) => {
2294
+ e.preventDefault(), e.stopPropagation();
2295
+ },
2296
+ onClick: () => Jr(),
2297
+ style: {
2298
+ position: "absolute",
2299
+ left: `${Mi.x + br(Mi) / 2 + 36}px`,
2300
+ top: `${Mi.y - 30}px`,
2301
+ width: "28px",
2302
+ height: "28px",
2303
+ display: "flex",
2304
+ alignItems: "center",
2305
+ justifyContent: "center",
2306
+ border: "1px solid #f5c2c7",
2307
+ borderRadius: "999px",
2308
+ background: "#fff5f5",
2309
+ cursor: "pointer",
2310
+ zIndex: 1150,
2311
+ pointerEvents: "auto"
2312
+ },
2313
+ children: /* @__PURE__ */ u(Xe, {})
2314
+ })] }),
2315
+ Pi && !Ni && /* @__PURE__ */ u("button", {
2316
+ type: "button",
2317
+ "aria-label": "Delete align block",
2318
+ title: "Delete align block",
2319
+ onMouseDown: (e) => {
2320
+ e.preventDefault(), e.stopPropagation();
2321
+ },
2322
+ onClick: () => Wr(),
2323
+ style: {
2324
+ position: "absolute",
2325
+ left: `${Pi.x + Pi.width / 2 - 14}px`,
2326
+ top: `${Pi.y - 30}px`,
2327
+ width: "28px",
2328
+ height: "28px",
2329
+ display: "flex",
2330
+ alignItems: "center",
2331
+ justifyContent: "center",
2332
+ border: "1px solid #f5c2c7",
2333
+ borderRadius: "999px",
2334
+ background: "#fff5f5",
2335
+ cursor: "pointer",
2336
+ zIndex: 1150,
2337
+ pointerEvents: "auto"
2338
+ },
2339
+ children: /* @__PURE__ */ u(Xe, {})
1664
2340
  }),
1665
- S.map((e) => {
1666
- let t = I === e.id, n = dn(e), r = mn(e), i = hn(e);
1667
- return t ? /* @__PURE__ */ f("div", {
1668
- style: {
1669
- position: "absolute",
1670
- top: `${e.y}px`,
1671
- left: `${e.x}px`,
1672
- width: `${r}px`,
1673
- minHeight: `${i}px`,
1674
- padding: `${g}px ${g}px`,
1675
- border: "1px solid #d9d9d9",
1676
- background: "transparent",
1677
- boxSizing: "border-box",
1678
- pointerEvents: "auto"
1679
- },
1680
- children: [
1681
- /* @__PURE__ */ d("div", { style: {
1682
- position: "absolute",
1683
- top: `${g - 2}px`,
1684
- bottom: `${g - 2}px`,
1685
- left: "4px",
1686
- width: "10px",
1687
- borderLeft: "2px solid #111",
1688
- borderTop: "2px solid #111",
1689
- borderBottom: "2px solid #111",
1690
- boxSizing: "border-box",
1691
- pointerEvents: "none"
1692
- } }),
1693
- /* @__PURE__ */ d("div", { style: {
2341
+ /* @__PURE__ */ d("div", {
2342
+ style: {
2343
+ position: "absolute",
2344
+ inset: 0,
2345
+ zIndex: 1e3,
2346
+ pointerEvents: "none"
2347
+ },
2348
+ children: [
2349
+ N && /* @__PURE__ */ u("div", {
2350
+ style: {
1694
2351
  position: "absolute",
1695
- top: `${g - 2}px`,
1696
- bottom: `${g - 2}px`,
1697
- right: "4px",
1698
- width: "10px",
1699
- borderRight: "2px solid #111",
1700
- borderTop: "2px solid #111",
1701
- borderBottom: "2px solid #111",
1702
- boxSizing: "border-box",
1703
- pointerEvents: "none"
1704
- } }),
1705
- /* @__PURE__ */ f("div", {
2352
+ left: `${N.left}px`,
2353
+ top: `${N.top}px`,
2354
+ transform: "translate(-10%, -100%)",
2355
+ maxWidth: "240px",
2356
+ padding: "6px 12px",
2357
+ border: `1px solid ${g.border}`,
2358
+ borderRadius: "999px",
2359
+ background: i ? "#171719" : "#ffffff",
2360
+ color: g.text,
2361
+ boxShadow: i ? "0 6px 18px rgba(0, 0, 0, 0.35)" : "0 2px 8px rgba(0, 0, 0, 0.08)",
2362
+ whiteSpace: "nowrap",
2363
+ overflow: "hidden",
2364
+ textOverflow: "ellipsis",
2365
+ pointerEvents: "none",
2366
+ zIndex: 20
2367
+ },
2368
+ children: $ && $.renderMode === "latex" ? /* @__PURE__ */ d("span", {
1706
2369
  style: {
1707
- display: "grid",
1708
- gridTemplateColumns: n.map((e) => `${e}px`).join(" "),
1709
- gap: 6,
1710
- alignItems: "center",
1711
- justifyContent: "center",
1712
- position: "relative"
2370
+ fontFamily: Pe,
2371
+ fontSize: 14,
2372
+ whiteSpace: "pre"
1713
2373
  },
1714
2374
  children: [
1715
- e.cols > 1 && Array.from({ length: e.cols - 1 }, (t, r) => {
1716
- let i = n.slice(0, r + 1).reduce((e, t) => e + t, 0) + r * 6 + 3;
1717
- return /* @__PURE__ */ d("button", {
1718
- type: "button",
1719
- onMouseDown: (e) => e.stopPropagation(),
1720
- onClick: (t) => {
1721
- t.stopPropagation(), Sn(e.id, r);
1722
- },
1723
- style: {
1724
- position: "absolute",
1725
- top: `${-_ - 4}px`,
1726
- left: `${i - _ / 2}px`,
1727
- width: `${_}px`,
1728
- height: `${_}px`,
1729
- border: "1px solid #d9d9d9",
1730
- borderRadius: "999px",
1731
- background: e.colSeparators.includes(r) ? "#111" : "transparent",
1732
- color: e.colSeparators.includes(r) ? "#fff" : "#111",
1733
- fontSize: 12,
1734
- lineHeight: 1,
1735
- cursor: "pointer"
1736
- },
1737
- children: "|"
1738
- }, `col-separator-${e.id}-${r}`);
1739
- }),
1740
- e.rowSeparators.map((t) => /* @__PURE__ */ d("div", { style: {
2375
+ N.fallback.slice(0, N.caretOffset ?? N.fallback.length),
2376
+ /* @__PURE__ */ u("span", { style: {
2377
+ display: "inline-block",
2378
+ width: 1,
2379
+ height: "1em",
2380
+ background: "currentColor",
2381
+ verticalAlign: "-0.15em",
2382
+ margin: "0 1px"
2383
+ } }),
2384
+ N.fallback.slice(N.caretOffset ?? N.fallback.length)
2385
+ ]
2386
+ }) : /* @__PURE__ */ u(rt, {
2387
+ expression: N.expression,
2388
+ fallback: N.fallback
2389
+ })
2390
+ }),
2391
+ y.map((e) => {
2392
+ let t = F === e.id, n = pr(e), r = gr(e), a = _r(e), o = Ke(i, g);
2393
+ return t ? /* @__PURE__ */ d("div", {
2394
+ style: {
2395
+ position: "absolute",
2396
+ top: `${e.y}px`,
2397
+ left: `${e.x}px`,
2398
+ width: `${r}px`,
2399
+ minHeight: `${a}px`,
2400
+ padding: `${h}px ${h}px`,
2401
+ border: "none",
2402
+ background: "transparent",
2403
+ boxSizing: "border-box",
2404
+ pointerEvents: "auto"
2405
+ },
2406
+ children: [
2407
+ /* @__PURE__ */ u("div", { style: {
1741
2408
  position: "absolute",
1742
- left: "0",
1743
- right: "0",
1744
- top: `${(t + 1) * Ce + t * 6 + 3}px`,
1745
- borderTop: "1px solid #111",
2409
+ top: `${h - 2}px`,
2410
+ bottom: `${h - 2}px`,
2411
+ left: "4px",
2412
+ width: "10px",
2413
+ borderLeft: `2px solid ${g.text}`,
2414
+ borderTop: `2px solid ${g.text}`,
2415
+ borderBottom: `2px solid ${g.text}`,
2416
+ boxSizing: "border-box",
1746
2417
  pointerEvents: "none"
1747
- } }, `row-line-${e.id}-${t}`)),
1748
- e.colSeparators.map((t) => /* @__PURE__ */ d("div", { style: {
2418
+ } }),
2419
+ /* @__PURE__ */ u("div", { style: {
1749
2420
  position: "absolute",
1750
- top: "0",
1751
- bottom: "0",
1752
- left: `${n.slice(0, t + 1).reduce((e, t) => e + t, 0) + t * 6 + 6}px`,
1753
- borderLeft: "1px solid #111",
2421
+ top: `${h - 2}px`,
2422
+ bottom: `${h - 2}px`,
2423
+ right: "4px",
2424
+ width: "10px",
2425
+ borderRight: `2px solid ${g.text}`,
2426
+ borderTop: `2px solid ${g.text}`,
2427
+ borderBottom: `2px solid ${g.text}`,
2428
+ boxSizing: "border-box",
1754
2429
  pointerEvents: "none"
1755
- } }, `col-line-${e.id}-${t}`)),
1756
- e.cells.map((t, r) => t.map((t, i) => /* @__PURE__ */ d("input", {
1757
- ref: (t) => {
1758
- Xt.current[`${e.id}-${r}-${i}`] = t;
2430
+ } }),
2431
+ /* @__PURE__ */ d("div", {
2432
+ style: {
2433
+ display: "grid",
2434
+ gridTemplateColumns: n.map((e) => `${e}px`).join(" "),
2435
+ gap: 6,
2436
+ alignItems: "center",
2437
+ justifyContent: "center",
2438
+ position: "relative"
1759
2439
  },
1760
- "data-matrix-id": e.id,
1761
- value: t,
1762
- onChange: (t) => {
1763
- Mn(e.id, r, i, t.target.value);
2440
+ children: [
2441
+ e.cols > 1 && Array.from({ length: e.cols - 1 }, (t, r) => {
2442
+ let i = n.slice(0, r + 1).reduce((e, t) => e + t, 0) + r * 6 + 3;
2443
+ return /* @__PURE__ */ u("button", {
2444
+ type: "button",
2445
+ onMouseDown: (e) => {
2446
+ e.preventDefault(), e.stopPropagation();
2447
+ },
2448
+ onClick: (t) => {
2449
+ t.stopPropagation(), Ar(e.id, r);
2450
+ },
2451
+ style: {
2452
+ position: "absolute",
2453
+ top: `${-Me - 4}px`,
2454
+ left: `${i - Me / 2}px`,
2455
+ width: `${Me}px`,
2456
+ height: `${Me}px`,
2457
+ border: `1px solid ${g.border}`,
2458
+ borderRadius: "999px",
2459
+ background: e.colSeparators.includes(r) ? o : "transparent",
2460
+ color: e.colSeparators.includes(r) ? g.bg : o,
2461
+ fontSize: 12,
2462
+ lineHeight: 1,
2463
+ cursor: "pointer"
2464
+ },
2465
+ children: "|"
2466
+ }, `col-separator-${e.id}-${r}`);
2467
+ }),
2468
+ e.rowSeparators.map((t) => /* @__PURE__ */ u("div", { style: {
2469
+ position: "absolute",
2470
+ left: "0",
2471
+ right: "0",
2472
+ top: `${(t + 1) * m + t * 6 + 3}px`,
2473
+ borderTop: `1px solid ${o}`,
2474
+ pointerEvents: "none"
2475
+ } }, `row-line-${e.id}-${t}`)),
2476
+ e.colSeparators.map((t) => /* @__PURE__ */ u("div", { style: {
2477
+ position: "absolute",
2478
+ top: "0",
2479
+ bottom: "0",
2480
+ left: `${n.slice(0, t + 1).reduce((e, t) => e + t, 0) + t * 6 + 6}px`,
2481
+ borderLeft: `1px solid ${o}`,
2482
+ pointerEvents: "none"
2483
+ } }, `col-line-${e.id}-${t}`)),
2484
+ e.cells.map((t, r) => t.map((t, i) => /* @__PURE__ */ u(lt, {
2485
+ dataAttributes: { "data-matrix-id": e.id },
2486
+ colors: g,
2487
+ inputRef: (t) => {
2488
+ Kn.current[`${e.id}-${r}-${i}`] = t;
2489
+ },
2490
+ value: t,
2491
+ valid: ct(t),
2492
+ onChange: (t) => {
2493
+ Gr(e.id, r, i, t.target.value);
2494
+ },
2495
+ onBlur: (t) => {
2496
+ let n = t.relatedTarget;
2497
+ n?.dataset.matrixId !== e.id && (t.currentTarget.parentElement?.contains(n) || Pr());
2498
+ },
2499
+ onMouseDown: (e) => e.stopPropagation(),
2500
+ onClick: (e) => {
2501
+ e.stopPropagation(), I({
2502
+ row: r,
2503
+ col: i
2504
+ });
2505
+ },
2506
+ onFocus: () => I({
2507
+ row: r,
2508
+ col: i
2509
+ }),
2510
+ onKeyDown: (t) => {
2511
+ if ((t.ctrlKey || t.metaKey) && t.key === "ArrowUp") {
2512
+ t.preventDefault(), Z(), Dr(e.id, e.rows - 1, e.cols), I({
2513
+ row: Math.min(r, Math.max(0, e.rows - 2)),
2514
+ col: i
2515
+ });
2516
+ return;
2517
+ }
2518
+ if ((t.ctrlKey || t.metaKey) && t.key === "ArrowDown") {
2519
+ t.preventDefault(), Z(), Dr(e.id, e.rows + 1, e.cols), I({
2520
+ row: r,
2521
+ col: i
2522
+ });
2523
+ return;
2524
+ }
2525
+ if ((t.ctrlKey || t.metaKey) && t.key === "ArrowLeft") {
2526
+ t.preventDefault(), Z(), Dr(e.id, e.rows, e.cols - 1), I({
2527
+ row: r,
2528
+ col: Math.min(i, Math.max(0, e.cols - 2))
2529
+ });
2530
+ return;
2531
+ }
2532
+ if ((t.ctrlKey || t.metaKey) && t.key === "ArrowRight") {
2533
+ t.preventDefault(), Z(), Dr(e.id, e.rows, e.cols + 1), I({
2534
+ row: r,
2535
+ col: i
2536
+ });
2537
+ return;
2538
+ }
2539
+ if (t.key === "ArrowUp") {
2540
+ t.preventDefault(), I({
2541
+ row: Math.max(0, r - 1),
2542
+ col: i
2543
+ });
2544
+ return;
2545
+ }
2546
+ if (t.key === "ArrowDown") {
2547
+ t.preventDefault(), I({
2548
+ row: Math.min(e.rows - 1, r + 1),
2549
+ col: i
2550
+ });
2551
+ return;
2552
+ }
2553
+ if (t.key === "ArrowLeft") {
2554
+ t.preventDefault(), I({
2555
+ row: r,
2556
+ col: Math.max(0, i - 1)
2557
+ });
2558
+ return;
2559
+ }
2560
+ if (t.key === "ArrowRight") {
2561
+ t.preventDefault(), I({
2562
+ row: r,
2563
+ col: Math.min(e.cols - 1, i + 1)
2564
+ });
2565
+ return;
2566
+ }
2567
+ if (t.key === "Escape") {
2568
+ t.preventDefault(), Pr();
2569
+ return;
2570
+ }
2571
+ t.key === "Enter" && (t.preventDefault(), I({
2572
+ row: Math.min(e.rows - 1, r + 1),
2573
+ col: i
2574
+ }));
2575
+ },
2576
+ minWidth: n[i]
2577
+ }, `${e.id}-${r}-${i}`)))
2578
+ ]
2579
+ }),
2580
+ e.rows > 1 && Array.from({ length: e.rows - 1 }, (t, n) => /* @__PURE__ */ u("button", {
2581
+ type: "button",
2582
+ onMouseDown: (e) => {
2583
+ e.preventDefault(), e.stopPropagation();
1764
2584
  },
1765
- onBlur: (e) => {
1766
- e.currentTarget.parentElement?.contains(e.relatedTarget) || Tn();
2585
+ onClick: (t) => {
2586
+ t.stopPropagation(), kr(e.id, n);
1767
2587
  },
1768
- onMouseDown: (e) => e.stopPropagation(),
1769
- onClick: (e) => {
1770
- e.stopPropagation(), L({
1771
- row: r,
1772
- col: i
1773
- });
2588
+ style: {
2589
+ position: "absolute",
2590
+ left: `${-Me / 2 + 2}px`,
2591
+ top: `${h + (n + 1) * m + n * 6 - Me / 2 + 3}px`,
2592
+ width: `${Me}px`,
2593
+ height: `${Me}px`,
2594
+ border: `1px solid ${g.border}`,
2595
+ borderRadius: "999px",
2596
+ background: e.rowSeparators.includes(n) ? o : "transparent",
2597
+ color: e.rowSeparators.includes(n) ? g.bg : o,
2598
+ fontSize: 12,
2599
+ lineHeight: 1,
2600
+ cursor: "pointer"
1774
2601
  },
1775
- onFocus: () => L({
1776
- row: r,
1777
- col: i
1778
- }),
1779
- onKeyDown: (t) => {
1780
- if ((t.ctrlKey || t.metaKey) && t.key === "ArrowUp") {
1781
- t.preventDefault(), Z(), bn(e.id, e.rows - 1, e.cols), L({
1782
- row: Math.min(r, Math.max(0, e.rows - 2)),
1783
- col: i
1784
- });
1785
- return;
1786
- }
1787
- if ((t.ctrlKey || t.metaKey) && t.key === "ArrowDown") {
1788
- t.preventDefault(), Z(), bn(e.id, e.rows + 1, e.cols), L({
1789
- row: r,
1790
- col: i
1791
- });
1792
- return;
1793
- }
1794
- if ((t.ctrlKey || t.metaKey) && t.key === "ArrowLeft") {
1795
- t.preventDefault(), Z(), bn(e.id, e.rows, e.cols - 1), L({
1796
- row: r,
1797
- col: Math.min(i, Math.max(0, e.cols - 2))
1798
- });
1799
- return;
1800
- }
1801
- if ((t.ctrlKey || t.metaKey) && t.key === "ArrowRight") {
1802
- t.preventDefault(), Z(), bn(e.id, e.rows, e.cols + 1), L({
2602
+ children: "-"
2603
+ }, `row-separator-${e.id}-${n}`))
2604
+ ]
2605
+ }, e.id) : /* @__PURE__ */ u("div", {
2606
+ ref: (t) => {
2607
+ Vn.current[e.id] = t;
2608
+ },
2609
+ style: {
2610
+ position: "absolute",
2611
+ top: `${e.y}px`,
2612
+ left: `${e.x}px`,
2613
+ width: `${r}px`,
2614
+ minHeight: `${a}px`,
2615
+ display: "flex",
2616
+ alignItems: "center",
2617
+ justifyContent: "center",
2618
+ boxSizing: "border-box",
2619
+ pointerEvents: b === "select" ? "none" : "auto",
2620
+ cursor: b === "matrix" ? "text" : b === "select" ? "move" : "default",
2621
+ border: "none",
2622
+ background: "transparent",
2623
+ color: g.text
2624
+ },
2625
+ onMouseDown: (e) => e.stopPropagation(),
2626
+ onClick: (t) => {
2627
+ if (t.stopPropagation(), b === "matrix") {
2628
+ E === e.id ? Nr(e.id) : (D(e.id), x(null), J());
2629
+ return;
2630
+ }
2631
+ b === "select" && (D(e.id), x(null), J());
2632
+ },
2633
+ onDoubleClick: (t) => {
2634
+ t.stopPropagation(), Nr(e.id);
2635
+ },
2636
+ children: /* @__PURE__ */ u(rt, {
2637
+ expression: hr(e),
2638
+ fallback: e.cells.map((e) => `[${e.join(", ")}]`).join(" ")
2639
+ })
2640
+ }, e.id);
2641
+ }),
2642
+ Tt.map((e) => {
2643
+ let t = L === e.id, n = yr(e), r = br(e), a = xr(e), o = We(i), s = Ge(i);
2644
+ return t ? /* @__PURE__ */ u("div", {
2645
+ style: {
2646
+ position: "absolute",
2647
+ top: `${e.y}px`,
2648
+ left: `${e.x}px`,
2649
+ width: `${r}px`,
2650
+ minHeight: `${a}px`,
2651
+ border: `${Ue}px solid ${s}`,
2652
+ background: "transparent",
2653
+ boxSizing: "border-box",
2654
+ pointerEvents: "auto",
2655
+ color: g.text
2656
+ },
2657
+ children: /* @__PURE__ */ u("div", {
2658
+ style: {
2659
+ display: "grid",
2660
+ gridTemplateColumns: n.map((e) => `${e}px`).join(" "),
2661
+ gap: 0,
2662
+ alignItems: "stretch",
2663
+ justifyContent: "stretch"
2664
+ },
2665
+ children: e.cells.map((t, r) => t.map((t, i) => /* @__PURE__ */ u("div", {
2666
+ style: {
2667
+ borderRight: i < e.cols - 1 ? `${He}px solid ${o}` : "none",
2668
+ borderBottom: r < e.rows - 1 ? `${He}px solid ${o}` : "none"
2669
+ },
2670
+ children: /* @__PURE__ */ u(lt, {
2671
+ dataAttributes: { "data-table-id": e.id },
2672
+ colors: g,
2673
+ inputRef: (t) => {
2674
+ qn.current[`${e.id}-${r}-${i}`] = t;
2675
+ },
2676
+ value: t,
2677
+ valid: ct(t),
2678
+ onChange: (t) => {
2679
+ Kr(e.id, r, i, t.target.value);
2680
+ },
2681
+ onBlur: (t) => {
2682
+ let n = t.relatedTarget;
2683
+ n?.dataset.tableId !== e.id && (t.currentTarget.parentElement?.parentElement?.contains(n) || Ir());
2684
+ },
2685
+ onMouseDown: (e) => e.stopPropagation(),
2686
+ onClick: (e) => {
2687
+ e.stopPropagation(), R({
1803
2688
  row: r,
1804
2689
  col: i
1805
2690
  });
1806
- return;
1807
- }
1808
- if (t.key === "ArrowUp") {
1809
- t.preventDefault(), L({
1810
- row: Math.max(0, r - 1),
1811
- col: i
1812
- });
1813
- return;
1814
- }
1815
- if (t.key === "ArrowDown") {
1816
- t.preventDefault(), L({
2691
+ },
2692
+ onFocus: () => R({
2693
+ row: r,
2694
+ col: i
2695
+ }),
2696
+ onKeyDown: (t) => {
2697
+ if ((t.ctrlKey || t.metaKey) && t.key === "ArrowUp") {
2698
+ t.preventDefault(), Z(), Or(e.id, e.rows - 1, e.cols), R({
2699
+ row: Math.min(r, Math.max(0, e.rows - 2)),
2700
+ col: i
2701
+ });
2702
+ return;
2703
+ }
2704
+ if ((t.ctrlKey || t.metaKey) && t.key === "ArrowDown") {
2705
+ t.preventDefault(), Z(), Or(e.id, e.rows + 1, e.cols), R({
2706
+ row: r,
2707
+ col: i
2708
+ });
2709
+ return;
2710
+ }
2711
+ if ((t.ctrlKey || t.metaKey) && t.key === "ArrowLeft") {
2712
+ t.preventDefault(), Z(), Or(e.id, e.rows, e.cols - 1), R({
2713
+ row: r,
2714
+ col: Math.min(i, Math.max(0, e.cols - 2))
2715
+ });
2716
+ return;
2717
+ }
2718
+ if ((t.ctrlKey || t.metaKey) && t.key === "ArrowRight") {
2719
+ t.preventDefault(), Z(), Or(e.id, e.rows, e.cols + 1), R({
2720
+ row: r,
2721
+ col: i
2722
+ });
2723
+ return;
2724
+ }
2725
+ if (t.key === "ArrowUp") {
2726
+ t.preventDefault(), R({
2727
+ row: Math.max(0, r - 1),
2728
+ col: i
2729
+ });
2730
+ return;
2731
+ }
2732
+ if (t.key === "ArrowDown") {
2733
+ t.preventDefault(), R({
2734
+ row: Math.min(e.rows - 1, r + 1),
2735
+ col: i
2736
+ });
2737
+ return;
2738
+ }
2739
+ if (t.key === "ArrowLeft") {
2740
+ t.preventDefault(), R({
2741
+ row: r,
2742
+ col: Math.max(0, i - 1)
2743
+ });
2744
+ return;
2745
+ }
2746
+ if (t.key === "ArrowRight") {
2747
+ t.preventDefault(), R({
2748
+ row: r,
2749
+ col: Math.min(e.cols - 1, i + 1)
2750
+ });
2751
+ return;
2752
+ }
2753
+ if (t.key === "Escape") {
2754
+ t.preventDefault(), Ir();
2755
+ return;
2756
+ }
2757
+ t.key === "Enter" && (t.preventDefault(), R({
1817
2758
  row: Math.min(e.rows - 1, r + 1),
1818
2759
  col: i
1819
- });
1820
- return;
1821
- }
1822
- if (t.key === "ArrowLeft") {
1823
- t.preventDefault(), L({
1824
- row: r,
1825
- col: Math.max(0, i - 1)
1826
- });
1827
- return;
1828
- }
1829
- if (t.key === "ArrowRight") {
1830
- t.preventDefault(), L({
1831
- row: r,
1832
- col: Math.min(e.cols - 1, i + 1)
1833
- });
1834
- return;
1835
- }
1836
- if (t.key === "Escape") {
1837
- t.preventDefault(), Tn();
1838
- return;
1839
- }
1840
- t.key === "Enter" && (t.preventDefault(), L({
1841
- row: Math.min(e.rows - 1, r + 1),
1842
- col: i
1843
- }));
1844
- },
1845
- style: {
1846
- width: "100%",
1847
- minWidth: `${n[i]}px`,
1848
- height: `${Ce}px`,
1849
- border: "none",
1850
- outline: "none",
1851
- textAlign: "center",
1852
- fontSize: 16,
1853
- fontFamily: v,
1854
- boxSizing: "border-box",
1855
- background: "transparent",
1856
- padding: `0 ${we}px`
1857
- }
2760
+ }));
2761
+ },
2762
+ minWidth: n[i]
2763
+ })
1858
2764
  }, `${e.id}-${r}-${i}`)))
1859
- ]
1860
- }),
1861
- e.rows > 1 && Array.from({ length: e.rows - 1 }, (t, n) => /* @__PURE__ */ d("button", {
1862
- type: "button",
1863
- onMouseDown: (e) => e.stopPropagation(),
1864
- onClick: (t) => {
1865
- t.stopPropagation(), xn(e.id, n);
2765
+ })
2766
+ }, e.id) : /* @__PURE__ */ u("div", {
2767
+ ref: (t) => {
2768
+ Hn.current[e.id] = t;
1866
2769
  },
1867
2770
  style: {
1868
2771
  position: "absolute",
1869
- left: `${-_ / 2 + 2}px`,
1870
- top: `${g + (n + 1) * Ce + n * 6 - _ / 2 + 3}px`,
1871
- width: `${_}px`,
1872
- height: `${_}px`,
1873
- border: "1px solid #d9d9d9",
1874
- borderRadius: "999px",
1875
- background: e.rowSeparators.includes(n) ? "#111" : "transparent",
1876
- color: e.rowSeparators.includes(n) ? "#fff" : "#111",
1877
- fontSize: 12,
1878
- lineHeight: 1,
1879
- cursor: "pointer"
2772
+ top: `${e.y}px`,
2773
+ left: `${e.x}px`,
2774
+ width: `${r}px`,
2775
+ minHeight: `${a}px`,
2776
+ display: "grid",
2777
+ gridTemplateColumns: n.map((e) => `${e}px`).join(" "),
2778
+ boxSizing: "border-box",
2779
+ pointerEvents: b === "select" ? "none" : "auto",
2780
+ cursor: b === "table" ? "text" : b === "select" ? "move" : "default",
2781
+ border: `${Ue}px solid ${s}`,
2782
+ background: "transparent",
2783
+ color: g.text
1880
2784
  },
1881
- children: "-"
1882
- }, `row-separator-${e.id}-${n}`))
1883
- ]
1884
- }, e.id) : /* @__PURE__ */ d("div", {
1885
- ref: (t) => {
1886
- qt.current[e.id] = t;
1887
- },
1888
- style: {
1889
- position: "absolute",
1890
- top: `${e.y}px`,
1891
- left: `${e.x}px`,
1892
- width: `${r}px`,
1893
- minHeight: `${i}px`,
1894
- display: "flex",
1895
- alignItems: "center",
1896
- justifyContent: "center",
1897
- boxSizing: "border-box",
1898
- pointerEvents: C === "select" ? "none" : "auto",
1899
- cursor: C === "matrix" ? "text" : C === "select" ? "move" : "default",
1900
- border: A === e.id ? "1px solid #d9d9d9" : "none",
1901
- background: "transparent"
1902
- },
1903
- onMouseDown: (e) => e.stopPropagation(),
1904
- onClick: (t) => {
1905
- if (t.stopPropagation(), C === "matrix") {
1906
- A === e.id ? wn(e.id) : (j(e.id), T(null), J());
1907
- return;
1908
- }
1909
- C === "select" && (j(e.id), T(null), J());
1910
- },
1911
- onDoubleClick: (t) => {
1912
- t.stopPropagation(), wn(e.id);
1913
- },
1914
- children: /* @__PURE__ */ d(Re, {
1915
- expression: pn(e),
1916
- fallback: e.cells.map((e) => `[${e.join(", ")}]`).join(" ")
1917
- })
1918
- }, e.id);
1919
- }),
1920
- $e.map((e) => e.id === R ? null : /* @__PURE__ */ d("div", {
1921
- style: {
1922
- position: "absolute",
1923
- top: `${e.y}px`,
1924
- left: `${e.x}px`,
1925
- width: `${e.width}px`,
1926
- minHeight: `${e.height}px`,
1927
- pointerEvents: C === "select" ? "none" : "auto",
1928
- boxSizing: "border-box",
1929
- cursor: C === "align" ? "text" : C === "select" ? "move" : "default",
1930
- border: M === e.id ? "1px solid #d9d9d9" : "none",
1931
- background: "transparent",
1932
- padding: "6px 8px"
1933
- },
1934
- onMouseDown: (e) => e.stopPropagation(),
1935
- onClick: (t) => {
1936
- if (t.stopPropagation(), C === "align") {
1937
- M === e.id ? kn(e.id) : (N(e.id), T(null), J(), Y());
1938
- return;
1939
- }
1940
- C === "select" && (N(e.id), T(null), J(), Y());
1941
- },
1942
- onDoubleClick: (t) => {
1943
- t.stopPropagation(), kn(e.id);
1944
- },
1945
- children: /* @__PURE__ */ d(Re, {
1946
- expression: sn(e),
1947
- fallback: e.content
1948
- })
1949
- }, e.id)),
1950
- fr && /* @__PURE__ */ d("div", {
1951
- style: {
1952
- position: "absolute",
1953
- top: `${fr.y}px`,
1954
- left: `${fr.x}px`,
1955
- width: `${fr.width}px`,
1956
- height: `${fr.height}px`,
1957
- display: "flex",
1958
- alignItems: "center",
1959
- justifyContent: "center",
1960
- pointerEvents: "auto"
1961
- },
1962
- children: /* @__PURE__ */ d("input", {
1963
- ref: Yt,
1964
- autoFocus: !0,
1965
- value: ft,
1966
- placeholder: "",
1967
- onChange: (e) => pt(e.target.value),
1968
- onBlur: zn,
1969
- onMouseDown: (e) => e.stopPropagation(),
1970
- onClick: (e) => e.stopPropagation(),
1971
- onKeyDown: (e) => {
1972
- e.key === "Enter" && (e.preventDefault(), zn()), e.key === "Escape" && (e.preventDefault(), Bn());
1973
- },
1974
- style: {
1975
- width: "100%",
1976
- height: "100%",
1977
- padding: "0 10px",
1978
- border: "1px solid #d9d9d9",
1979
- borderRadius: 999,
1980
- outline: "none",
1981
- background: "transparent",
1982
- color: "#111",
1983
- fontSize: 18,
1984
- textAlign: "center",
1985
- fontFamily: v,
1986
- boxSizing: "border-box"
1987
- }
1988
- })
1989
- }),
1990
- $ && /* @__PURE__ */ f("div", {
1991
- style: {
1992
- position: "absolute",
1993
- top: `${$.y}px`,
1994
- left: `${$.x}px`,
1995
- width: `${$.width}px`,
1996
- minHeight: `${$.height}px`,
1997
- border: "1px solid #d9d9d9",
1998
- background: "transparent",
1999
- boxSizing: "border-box",
2000
- pointerEvents: "auto",
2001
- padding: "6px 8px"
2002
- },
2003
- children: [/* @__PURE__ */ f("div", {
2004
- style: {
2005
- display: "flex",
2006
- gap: 6,
2007
- marginBottom: 6
2008
- },
2009
- children: [
2010
- /* @__PURE__ */ d("button", {
2011
- type: "button",
2012
2785
  onMouseDown: (e) => e.stopPropagation(),
2013
- onClick: () => {
2014
- on($.id, (e) => ({
2015
- ...e,
2016
- alignMode: "left"
2017
- }));
2786
+ onClick: (t) => {
2787
+ if (t.stopPropagation(), b === "table") {
2788
+ O === e.id ? Fr(e.id) : (k(e.id), x(null), J(), Y());
2789
+ return;
2790
+ }
2791
+ b === "select" && (k(e.id), x(null), J(), Y());
2018
2792
  },
2019
- style: {
2020
- border: "1px solid #d9d9d9",
2021
- background: $.alignMode === "left" ? "#111" : "#fff",
2022
- color: $.alignMode === "left" ? "#fff" : "#111",
2023
- borderRadius: 999,
2024
- padding: "2px 8px",
2025
- cursor: "pointer",
2026
- fontSize: 12
2793
+ onDoubleClick: (t) => {
2794
+ t.stopPropagation(), Fr(e.id);
2027
2795
  },
2028
- children: "Left"
2029
- }),
2030
- /* @__PURE__ */ d("button", {
2031
- type: "button",
2796
+ children: e.cells.map((t, r) => t.map((t, i) => /* @__PURE__ */ u("div", {
2797
+ style: {
2798
+ minWidth: `${n[i]}px`,
2799
+ height: `${m}px`,
2800
+ borderRight: i < e.cols - 1 ? `${He}px solid ${o}` : "none",
2801
+ borderBottom: r < e.rows - 1 ? `${He}px solid ${o}` : "none",
2802
+ display: "flex",
2803
+ alignItems: "center",
2804
+ justifyContent: "center",
2805
+ overflow: "hidden",
2806
+ padding: `0 ${je}px`,
2807
+ boxSizing: "border-box"
2808
+ },
2809
+ children: ct(t) ? /* @__PURE__ */ u(rt, {
2810
+ expression: t,
2811
+ fallback: t
2812
+ }) : /* @__PURE__ */ u("span", { children: t || " " })
2813
+ }, `${e.id}-${r}-${i}`)))
2814
+ }, e.id);
2815
+ }),
2816
+ Dt.map((e) => e.id === z ? null : /* @__PURE__ */ u("div", {
2817
+ style: {
2818
+ position: "absolute",
2819
+ top: `${e.y}px`,
2820
+ left: `${e.x}px`,
2821
+ width: `${e.width}px`,
2822
+ minHeight: `${e.height}px`,
2823
+ pointerEvents: b === "select" ? "none" : "auto",
2824
+ boxSizing: "border-box",
2825
+ cursor: b === "align" ? "text" : b === "select" ? "move" : "default",
2826
+ border: A === e.id ? `1px solid ${g.border}` : "none",
2827
+ background: "transparent",
2828
+ padding: "6px 8px",
2829
+ color: g.text
2830
+ },
2831
+ onMouseDown: (e) => e.stopPropagation(),
2832
+ onClick: (t) => {
2833
+ if (t.stopPropagation(), b === "align") {
2834
+ A === e.id ? Hr(e.id) : (j(e.id), x(null), J(), Y());
2835
+ return;
2836
+ }
2837
+ b === "select" && (j(e.id), x(null), J(), Y());
2838
+ },
2839
+ onDoubleClick: (t) => {
2840
+ t.stopPropagation(), Hr(e.id);
2841
+ },
2842
+ children: /* @__PURE__ */ u(rt, {
2843
+ expression: lr(e),
2844
+ fallback: e.content
2845
+ })
2846
+ }, e.id)),
2847
+ Di && /* @__PURE__ */ u("div", {
2848
+ style: {
2849
+ position: "absolute",
2850
+ top: `${Di.y}px`,
2851
+ left: `${Di.x}px`,
2852
+ width: `${Di.width}px`,
2853
+ height: `${Di.height}px`,
2854
+ display: "flex",
2855
+ alignItems: "center",
2856
+ justifyContent: "center",
2857
+ pointerEvents: "auto"
2858
+ },
2859
+ children: /* @__PURE__ */ u("input", {
2860
+ ref: Gn,
2861
+ autoFocus: !0,
2862
+ value: Jt,
2863
+ placeholder: "",
2864
+ onChange: (e) => Yt(e.target.value),
2865
+ onBlur: ei,
2032
2866
  onMouseDown: (e) => e.stopPropagation(),
2033
- onClick: () => {
2034
- on($.id, (e) => ({
2035
- ...e,
2036
- alignMode: "token"
2037
- }));
2867
+ onClick: (e) => e.stopPropagation(),
2868
+ onKeyDown: (e) => {
2869
+ e.key === "Enter" && (e.preventDefault(), ei()), e.key === "Escape" && (e.preventDefault(), ti());
2038
2870
  },
2039
2871
  style: {
2040
- border: "1px solid #d9d9d9",
2041
- background: $.alignMode === "token" ? "#111" : "#fff",
2042
- color: $.alignMode === "token" ? "#fff" : "#111",
2872
+ width: "100%",
2873
+ height: "100%",
2874
+ padding: "0 10px",
2875
+ border: `1px solid ${g.border}`,
2043
2876
  borderRadius: 999,
2044
- padding: "2px 8px",
2045
- cursor: "pointer",
2046
- fontSize: 12
2877
+ outline: "none",
2878
+ background: "transparent",
2879
+ color: g.text,
2880
+ fontSize: 18,
2881
+ textAlign: "center",
2882
+ fontFamily: Ne,
2883
+ boxSizing: "border-box"
2884
+ }
2885
+ })
2886
+ }),
2887
+ rn && Ni && /* @__PURE__ */ u("div", {
2888
+ style: {
2889
+ position: "absolute",
2890
+ left: `${rn.left}px`,
2891
+ top: `${rn.top}px`,
2892
+ maxWidth: `${Math.max(Ni.width, 220)}px`,
2893
+ padding: "10px 16px",
2894
+ border: `1px solid ${g.border}`,
2895
+ borderRadius: 14,
2896
+ background: g.bgAlt,
2897
+ color: g.text,
2898
+ boxSizing: "border-box",
2899
+ pointerEvents: "none",
2900
+ boxShadow: i ? "0 6px 18px rgba(0, 0, 0, 0.35)" : "0 2px 8px rgba(17, 17, 17, 0.08)",
2901
+ zIndex: 5
2902
+ },
2903
+ children: /* @__PURE__ */ u(rt, {
2904
+ expression: rn.expression,
2905
+ fallback: rn.fallback,
2906
+ displayMode: !0
2907
+ })
2908
+ }),
2909
+ Ni && /* @__PURE__ */ u("div", {
2910
+ style: {
2911
+ position: "absolute",
2912
+ top: `${Ni.y}px`,
2913
+ left: `${Ni.x}px`,
2914
+ width: `${Ni.width}px`,
2915
+ minHeight: `${Ni.height}px`,
2916
+ border: `1px solid ${g.border}`,
2917
+ background: "transparent",
2918
+ boxSizing: "border-box",
2919
+ pointerEvents: "auto",
2920
+ padding: "6px 8px"
2921
+ },
2922
+ children: /* @__PURE__ */ u("textarea", {
2923
+ ref: Jn,
2924
+ value: tn,
2925
+ onChange: (e) => nn(e.target.value),
2926
+ onBlur: Ur,
2927
+ onMouseDown: (e) => e.stopPropagation(),
2928
+ onClick: (e) => e.stopPropagation(),
2929
+ onKeyDown: (e) => {
2930
+ e.key === "Escape" && (e.preventDefault(), q()), (e.ctrlKey || e.metaKey) && e.key === "Enter" && (e.preventDefault(), Ur());
2047
2931
  },
2048
- children: "Align Token"
2049
- }),
2050
- /* @__PURE__ */ d("input", {
2051
- value: $.alignToken,
2932
+ style: {
2933
+ width: "100%",
2934
+ minHeight: `${Math.max(Ni.height - 12, 56)}px`,
2935
+ border: "none",
2936
+ outline: "none",
2937
+ resize: "none",
2938
+ fontSize: Fe,
2939
+ lineHeight: 1.4,
2940
+ fontFamily: Pe,
2941
+ color: g.text,
2942
+ background: "transparent",
2943
+ boxSizing: "border-box",
2944
+ whiteSpace: "pre"
2945
+ }
2946
+ })
2947
+ }),
2948
+ v.map((e) => e.id === M ? null : /* @__PURE__ */ u("div", {
2949
+ ref: (t) => {
2950
+ Bn.current[e.id] = t;
2951
+ },
2952
+ style: {
2953
+ position: "absolute",
2954
+ top: `${e.y}px`,
2955
+ left: `${e.x}px`,
2956
+ width: `${_n[e.id] ?? e.width}px`,
2957
+ minHeight: `${e.height}px`,
2958
+ padding: `${le}px ${ce}px ${le}px ${se}px`,
2959
+ color: g.text,
2960
+ fontSize: Fe,
2961
+ lineHeight: 1.35,
2962
+ fontFamily: Ne,
2963
+ whiteSpace: "pre",
2964
+ wordBreak: "normal",
2965
+ pointerEvents: b === "select" ? "none" : "auto",
2966
+ boxSizing: "border-box",
2967
+ overflow: "visible",
2968
+ cursor: b === "text" ? "text" : b === "select" ? "move" : "default",
2969
+ border: Rt === e.id ? `1px solid ${g.border}` : "none",
2970
+ background: "transparent",
2971
+ transition: "border-color 120ms ease"
2972
+ },
2973
+ onMouseDown: (e) => e.stopPropagation(),
2974
+ onClick: (t) => {
2975
+ if (t.stopPropagation(), b === "text") {
2976
+ fi(e.id);
2977
+ return;
2978
+ }
2979
+ b === "select" && (J(), Y(), x(e.id), jt(e.renderMode));
2980
+ },
2981
+ onDoubleClick: (t) => {
2982
+ t.stopPropagation(), fi(e.id);
2983
+ },
2984
+ onMouseEnter: (t) => {
2985
+ Rt !== e.id && (t.currentTarget.style.border = `1px solid ${g.border}`);
2986
+ },
2987
+ onMouseLeave: (t) => {
2988
+ Rt !== e.id && (t.currentTarget.style.border = "none");
2989
+ },
2990
+ children: /* @__PURE__ */ u(Je, {
2991
+ content: e.content,
2992
+ renderMode: e.renderMode
2993
+ })
2994
+ }, e.id)),
2995
+ $ && /* @__PURE__ */ d("div", {
2996
+ style: {
2997
+ position: "absolute",
2998
+ top: `${$.y}px`,
2999
+ left: `${$.x}px`,
3000
+ width: `${Math.min(Math.max(pn, p), Math.max(p, H.width - $.x - ae))}px`,
3001
+ minHeight: `${$.height}px`,
3002
+ pointerEvents: "auto",
3003
+ cursor: "text",
3004
+ border: `1px solid ${g.border}`,
3005
+ boxSizing: "border-box",
3006
+ background: "transparent"
3007
+ },
3008
+ children: [$.renderMode === "latex" && /* @__PURE__ */ d("div", {
3009
+ ref: Wn,
3010
+ "aria-hidden": "true",
3011
+ style: {
3012
+ position: "absolute",
3013
+ inset: 0,
3014
+ padding: `${le}px ${ce}px ${le}px ${se}px`,
3015
+ fontSize: Fe,
3016
+ lineHeight: 1.35,
3017
+ fontFamily: Ne,
3018
+ color: g.text,
3019
+ background: "transparent",
3020
+ boxSizing: "border-box",
3021
+ whiteSpace: "pre",
3022
+ wordBreak: "normal",
3023
+ overflow: "hidden",
3024
+ pointerEvents: "none"
3025
+ },
3026
+ children: [/* @__PURE__ */ u(Ye, {
3027
+ content: Bt,
3028
+ renderMode: $.renderMode,
3029
+ activeMathStart: N?.start ?? null
3030
+ }), Gt && /* @__PURE__ */ u("div", { style: {
3031
+ position: "absolute",
3032
+ left: `${Gt.left}px`,
3033
+ top: `${Gt.top}px`,
3034
+ width: "1px",
3035
+ height: `${Gt.height}px`,
3036
+ background: g.text
3037
+ } })]
3038
+ }), /* @__PURE__ */ u("textarea", {
3039
+ ref: Un,
3040
+ autoFocus: !0,
3041
+ value: Bt,
3042
+ placeholder: "",
2052
3043
  onChange: (e) => {
2053
- on($.id, (t) => ({
2054
- ...t,
2055
- alignToken: e.target.value || "="
2056
- }));
3044
+ Vt(e.target.value), Ut(e.target.selectionStart);
2057
3045
  },
3046
+ onSelect: (e) => Ut(e.currentTarget.selectionStart),
3047
+ onBlur: pi,
2058
3048
  onMouseDown: (e) => e.stopPropagation(),
3049
+ onClick: (e) => {
3050
+ e.stopPropagation(), Ut(e.currentTarget.selectionStart);
3051
+ },
3052
+ onKeyUp: (e) => Ut(e.currentTarget.selectionStart),
3053
+ onKeyDown: (e) => {
3054
+ if ($.renderMode === "latex" && e.key === "$" && !e.ctrlKey && !e.metaKey && !e.altKey) {
3055
+ e.preventDefault();
3056
+ let t = e.currentTarget, n = t.selectionStart, r = t.selectionEnd;
3057
+ Vt(Bt.slice(0, n) + "$$" + Bt.slice(r)), Ut(n + 1), window.requestAnimationFrame(() => {
3058
+ t.focus(), t.setSelectionRange(n + 1, n + 1);
3059
+ });
3060
+ return;
3061
+ }
3062
+ e.key === "Escape" && (e.preventDefault(), Q()), (e.ctrlKey || e.metaKey) && e.key === "Enter" && (e.preventDefault(), pi()), (e.ctrlKey || e.metaKey) && e.key.toLowerCase() === "m" && (e.preventDefault(), Si());
3063
+ },
2059
3064
  style: {
2060
- width: 28,
2061
- border: "1px solid #d9d9d9",
3065
+ width: "100%",
3066
+ minHeight: `${$.height}px`,
3067
+ height: `${Math.max(dn, $.height)}px`,
3068
+ padding: `${le}px ${ce}px ${le}px ${se}px`,
3069
+ border: "none",
3070
+ borderRadius: 0,
3071
+ outline: "none",
3072
+ fontSize: Fe,
3073
+ lineHeight: 1.35,
3074
+ fontFamily: Ne,
3075
+ color: $.renderMode === "latex" ? "transparent" : g.text,
3076
+ caretColor: $.renderMode === "latex" && N ? "transparent" : g.text,
2062
3077
  background: "transparent",
2063
- textAlign: "center"
3078
+ boxSizing: "border-box",
3079
+ resize: "none",
3080
+ overflow: "hidden",
3081
+ whiteSpace: "pre",
3082
+ wordBreak: "normal",
3083
+ boxShadow: "none",
3084
+ appearance: "none",
3085
+ overflowX: "hidden"
2064
3086
  }
2065
- })
2066
- ]
2067
- }), /* @__PURE__ */ d("textarea", {
2068
- ref: Zt,
2069
- value: _t,
2070
- onChange: (e) => vt(e.target.value),
2071
- onBlur: An,
2072
- onMouseDown: (e) => e.stopPropagation(),
2073
- onClick: (e) => e.stopPropagation(),
2074
- onKeyDown: (e) => {
2075
- e.key === "Escape" && (e.preventDefault(), q()), (e.ctrlKey || e.metaKey) && e.key === "Enter" && (e.preventDefault(), An());
2076
- },
2077
- style: {
2078
- width: "100%",
2079
- minHeight: `${Math.max($.height - 36, 56)}px`,
2080
- border: "none",
2081
- outline: "none",
2082
- resize: "none",
2083
- fontSize: Te,
2084
- lineHeight: 1.4,
2085
- fontFamily: v,
2086
- color: "#111",
2087
- background: "transparent",
2088
- boxSizing: "border-box",
2089
- whiteSpace: "pre"
2090
- }
2091
- })]
2092
- }),
2093
- y.map((e) => e.id === P ? null : /* @__PURE__ */ d("div", {
2094
- ref: (t) => {
2095
- Kt.current[e.id] = t;
2096
- },
2097
- style: {
2098
- position: "absolute",
2099
- top: `${e.y}px`,
2100
- left: `${e.x}px`,
2101
- width: `${Ot[e.id] ?? e.width}px`,
2102
- minHeight: `${e.height}px`,
2103
- padding: `${ce}px ${se}px ${ce}px ${oe}px`,
2104
- color: "#111",
2105
- fontSize: Te,
2106
- lineHeight: 1.35,
2107
- fontFamily: v,
2108
- whiteSpace: "pre",
2109
- wordBreak: "normal",
2110
- pointerEvents: C === "select" ? "none" : "auto",
2111
- boxSizing: "border-box",
2112
- overflow: "visible",
2113
- cursor: C === "text" ? "text" : C === "select" ? "move" : "default",
2114
- border: w === e.id ? "1px solid #d9d9d9" : "none",
2115
- background: "transparent",
2116
- transition: "border-color 120ms ease"
2117
- },
2118
- onMouseDown: (e) => e.stopPropagation(),
2119
- onClick: (t) => {
2120
- if (t.stopPropagation(), C === "text") {
2121
- Zn(e.id);
2122
- return;
2123
- }
2124
- C === "select" && (J(), Y(), T(e.id), rt(e.renderMode));
2125
- },
2126
- onDoubleClick: (t) => {
2127
- t.stopPropagation(), Zn(e.id);
2128
- },
2129
- onMouseEnter: (t) => {
2130
- w !== e.id && (t.currentTarget.style.border = "1px solid #d9d9d9");
2131
- },
2132
- onMouseLeave: (t) => {
2133
- w !== e.id && (t.currentTarget.style.border = "none");
2134
- },
2135
- children: /* @__PURE__ */ d(je, {
2136
- content: e.content,
2137
- renderMode: e.renderMode
2138
- })
2139
- }, e.id)),
2140
- ur && /* @__PURE__ */ d("div", {
2141
- style: {
2142
- position: "absolute",
2143
- top: `${ur.y}px`,
2144
- left: `${ur.x}px`,
2145
- width: `${Math.min(Math.max(wt, m), Math.max(m, V.width - ur.x - ie))}px`,
2146
- minHeight: `${ur.height}px`,
2147
- pointerEvents: "auto",
2148
- cursor: "text",
2149
- border: "1px solid #d9d9d9",
2150
- boxSizing: "border-box",
2151
- background: "transparent"
2152
- },
2153
- children: /* @__PURE__ */ d("textarea", {
2154
- ref: Jt,
2155
- autoFocus: !0,
2156
- value: at,
2157
- placeholder: "",
2158
- onChange: (e) => {
2159
- ot(e.target.value), ct(e.target.selectionStart);
2160
- },
2161
- onSelect: (e) => ct(e.currentTarget.selectionStart),
2162
- onBlur: Qn,
2163
- onMouseDown: (e) => e.stopPropagation(),
2164
- onClick: (e) => {
2165
- e.stopPropagation(), ct(e.currentTarget.selectionStart);
2166
- },
2167
- onKeyUp: (e) => ct(e.currentTarget.selectionStart),
2168
- onKeyDown: (e) => {
2169
- e.key === "Escape" && (e.preventDefault(), Q()), (e.ctrlKey || e.metaKey) && e.key === "Enter" && (e.preventDefault(), Qn()), (e.ctrlKey || e.metaKey) && e.key.toLowerCase() === "m" && (e.preventDefault(), sr());
2170
- },
2171
- style: {
2172
- width: "100%",
2173
- minHeight: `${ur.height}px`,
2174
- height: `${Math.max(St, ur.height)}px`,
2175
- padding: `${ce}px ${se}px ${ce}px ${oe}px`,
2176
- border: "none",
2177
- borderRadius: 0,
2178
- outline: "none",
2179
- fontSize: Te,
2180
- lineHeight: 1.35,
2181
- fontFamily: v,
2182
- color: "#111",
2183
- background: "transparent",
2184
- boxSizing: "border-box",
2185
- resize: "none",
2186
- overflow: "hidden",
2187
- whiteSpace: "pre",
2188
- wordBreak: "normal",
2189
- boxShadow: "none",
2190
- appearance: "none",
2191
- overflowX: "hidden"
2192
- }
2193
- })
3087
+ })]
3088
+ })
3089
+ ]
2194
3090
  })
2195
3091
  ]
2196
3092
  })
@@ -2198,4 +3094,4 @@ function x() {
2198
3094
  });
2199
3095
  }
2200
3096
  //#endregion
2201
- export { x as MathCanvas, x as default };
3097
+ export { _t as MathCanvas, _t as default };