@techzyapp/ui-library 1.0.29 → 1.0.30

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.
@@ -0,0 +1,916 @@
1
+ import { jsx as n, jsxs as R, Fragment as We } from "react/jsx-runtime";
2
+ import { useRef as O, useState as y, useCallback as xe, useEffect as A, forwardRef as Je } from "react";
3
+ import { clsx as Qe } from "clsx";
4
+ import { DecoratorNode as ke, $applyNodeReplacement as Ae, $getSelection as z, $isRangeSelection as G, $isElementNode as Xe, SELECTION_CHANGE_COMMAND as Ye, COMMAND_PRIORITY_LOW as le, CAN_UNDO_COMMAND as Ze, CAN_REDO_COMMAND as et, UNDO_COMMAND as tt, REDO_COMMAND as rt, $createParagraphNode as Oe, FORMAT_ELEMENT_COMMAND as ot, FORMAT_TEXT_COMMAND as nt, TextNode as it, $isTextNode as lt, getStyleObjectFromCSS as ct, $getRoot as Re, $insertNodes as at, $setSelection as st, $isParagraphNode as dt } from "lexical";
5
+ import { LexicalComposer as ut } from "@lexical/react/LexicalComposer";
6
+ import { useLexicalComposerContext as De } from "@lexical/react/LexicalComposerContext";
7
+ import { RichTextPlugin as mt } from "@lexical/react/LexicalRichTextPlugin";
8
+ import { ContentEditable as pt } from "@lexical/react/LexicalContentEditable";
9
+ import { LexicalErrorBoundary as ht } from "@lexical/react/LexicalErrorBoundary";
10
+ import { HistoryPlugin as ft } from "@lexical/react/LexicalHistoryPlugin";
11
+ import { ListPlugin as _t } from "@lexical/react/LexicalListPlugin";
12
+ import { CheckListPlugin as gt } from "@lexical/react/LexicalCheckListPlugin";
13
+ import { LinkPlugin as yt } from "@lexical/react/LexicalLinkPlugin";
14
+ import { MarkdownShortcutPlugin as Nt } from "@lexical/react/LexicalMarkdownShortcutPlugin";
15
+ import { ELEMENT_TRANSFORMERS as Tt, TEXT_FORMAT_TRANSFORMERS as bt, TEXT_MATCH_TRANSFORMERS as vt } from "@lexical/markdown";
16
+ import { $isHeadingNode as Et, $isQuoteNode as Ct, $createQuoteNode as St, $createHeadingNode as Lt, HeadingNode as Mt, QuoteNode as xt } from "@lexical/rich-text";
17
+ import { ListNode as Ie, REMOVE_LIST_COMMAND as kt, INSERT_UNORDERED_LIST_COMMAND as At, INSERT_ORDERED_LIST_COMMAND as Ot, INSERT_CHECK_LIST_COMMAND as Rt, ListItemNode as Dt } from "@lexical/list";
18
+ import { $isLinkNode as Te, TOGGLE_LINK_COMMAND as It, LinkNode as je } from "@lexical/link";
19
+ import { $generateNodesFromDOM as jt, $generateHtmlFromNodes as Ut } from "@lexical/html";
20
+ import { u as wt } from "./formContext-B7ln1Miy.js";
21
+ import { T as be } from "./Typography-CJv5AnRP.js";
22
+ import { t as Ft } from "./toastStore-Cx_JOKwS.js";
23
+ import { $getSelectionStyleValueForProperty as ve, $patchStyleText as Ee, $setBlocksType as ce } from "@lexical/selection";
24
+ import { $findMatchingParent as $t, $getNearestNodeOfType as Bt, mergeRegister as Ht, $insertNodeToNearestRoot as ae } from "@lexical/utils";
25
+ import { B as K } from "./Button-CWMNNiia.js";
26
+ import { C as Pt, D as qt } from "./ColorPickerPanel-DZjN8NNn.js";
27
+ import { D as j } from "./Divider-LtH3dLgw.js";
28
+ import { D as se } from "./Dropdown--1mNTVZJ.js";
29
+ import { F as Vt } from "./FloatingPanel-CeSOtE_D.js";
30
+ import { I as _ } from "./Icon-DaTvzLBu.js";
31
+ import { I as U } from "./IconButton-GU3Ud4Zg.js";
32
+ import { a as W } from "./List-CZwNGxuP.js";
33
+ import { M as zt } from "./Modal-DHP2R3K3.js";
34
+ import { T as Gt } from "./TextField-SGYWviFf.js";
35
+ import { a as ue } from "./ConfigProvider-BbsI15b-.js";
36
+ const Kt = /^(?:https?:|mailto:|tel:|ftp:|#|\/|\?|\.)/i, Wt = /^[a-z][a-z0-9+.-]*:/i;
37
+ function me(o) {
38
+ const e = o.trim();
39
+ return e === "" ? "" : Kt.test(e) || !Wt.test(e) ? e : "#";
40
+ }
41
+ function Ue(o) {
42
+ const e = o.trim();
43
+ if (/^data:(?:image|video)\//i.test(e) || /^blob:/i.test(e)) return e;
44
+ const i = me(e);
45
+ return i === "#" ? "" : i;
46
+ }
47
+ function Jt(o) {
48
+ return o instanceof HTMLImageElement && o.src ? { node: J(o.getAttribute("src") ?? o.src, o.alt) } : null;
49
+ }
50
+ class Q extends ke {
51
+ static getType() {
52
+ return "tz-image";
53
+ }
54
+ static clone(e) {
55
+ return new Q(e.__src, e.__alt, e.__key);
56
+ }
57
+ constructor(e, i = "", r) {
58
+ super(r), this.__src = Ue(e), this.__alt = i;
59
+ }
60
+ static importJSON(e) {
61
+ return J(e.src, e.alt);
62
+ }
63
+ exportJSON() {
64
+ return { ...super.exportJSON(), type: "tz-image", version: 1, src: this.__src, alt: this.__alt };
65
+ }
66
+ static importDOM() {
67
+ return { img: () => ({ conversion: Jt, priority: 0 }) };
68
+ }
69
+ exportDOM() {
70
+ const e = document.createElement("img");
71
+ return e.setAttribute("src", this.__src), e.setAttribute("alt", this.__alt), { element: e };
72
+ }
73
+ /** A block wrapper; the actual `<img>` is rendered by {@link decorate}. */
74
+ createDOM() {
75
+ const e = document.createElement("div");
76
+ return e.style.display = "contents", e;
77
+ }
78
+ updateDOM() {
79
+ return !1;
80
+ }
81
+ getSrc() {
82
+ return this.__src;
83
+ }
84
+ getAltText() {
85
+ return this.__alt;
86
+ }
87
+ decorate() {
88
+ return /* @__PURE__ */ n("img", { src: this.__src, alt: this.__alt, draggable: !1 });
89
+ }
90
+ }
91
+ function J(o, e = "") {
92
+ return Ae(new Q(o, e));
93
+ }
94
+ function Ce(o) {
95
+ return /\.(mp4|webm|ogg|ogv|mov|m4v)(\?.*)?$/i.test(o);
96
+ }
97
+ function Qt(o) {
98
+ const e = o.match(
99
+ /(?:youtube\.com\/(?:watch\?(?:.*&)?v=|embed\/|shorts\/)|youtu\.be\/)([\w-]{11})/
100
+ );
101
+ if (e) return `https://www.youtube.com/embed/${e[1]}`;
102
+ const i = o.match(/vimeo\.com\/(?:video\/)?(\d+)/);
103
+ return i ? `https://player.vimeo.com/video/${i[1]}` : o;
104
+ }
105
+ function Se(o) {
106
+ var i;
107
+ const e = o.getAttribute("src") || ((i = o.querySelector("source")) == null ? void 0 : i.getAttribute("src"));
108
+ return e ? { node: pe(e) } : null;
109
+ }
110
+ class X extends ke {
111
+ static getType() {
112
+ return "tz-video";
113
+ }
114
+ static clone(e) {
115
+ return new X(e.__src, e.__key);
116
+ }
117
+ constructor(e, i) {
118
+ super(i), this.__src = Ue(e);
119
+ }
120
+ static importJSON(e) {
121
+ return pe(e.src);
122
+ }
123
+ exportJSON() {
124
+ return { ...super.exportJSON(), type: "tz-video", version: 1, src: this.__src };
125
+ }
126
+ static importDOM() {
127
+ return {
128
+ iframe: () => ({ conversion: Se, priority: 0 }),
129
+ video: () => ({ conversion: Se, priority: 0 })
130
+ };
131
+ }
132
+ exportDOM() {
133
+ if (Ce(this.__src)) {
134
+ const i = document.createElement("video");
135
+ return i.setAttribute("src", this.__src), i.setAttribute("controls", "true"), { element: i };
136
+ }
137
+ const e = document.createElement("iframe");
138
+ return e.setAttribute("src", this.__src), e.setAttribute("frameborder", "0"), e.setAttribute("allowfullscreen", "true"), e.setAttribute(
139
+ "allow",
140
+ "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
141
+ ), { element: e };
142
+ }
143
+ /** A block wrapper; the actual media element is rendered by {@link decorate}. */
144
+ createDOM() {
145
+ const e = document.createElement("div");
146
+ return e.style.display = "contents", e;
147
+ }
148
+ updateDOM() {
149
+ return !1;
150
+ }
151
+ getSrc() {
152
+ return this.__src;
153
+ }
154
+ decorate() {
155
+ return Ce(this.__src) ? /* @__PURE__ */ n("video", { src: this.__src, controls: !0 }) : /* @__PURE__ */ n(Xt, { src: this.__src });
156
+ }
157
+ }
158
+ function Xt({ src: o }) {
159
+ const e = ue();
160
+ return /* @__PURE__ */ n("div", { className: "tz-rte-embed", children: /* @__PURE__ */ n(
161
+ "iframe",
162
+ {
163
+ src: o,
164
+ title: e("rte.embeddedVideo"),
165
+ frameBorder: 0,
166
+ allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",
167
+ allowFullScreen: !0
168
+ }
169
+ ) });
170
+ }
171
+ function pe(o) {
172
+ return Ae(new X(Qt(o)));
173
+ }
174
+ const Yt = "_editor_16j1l_1", Zt = "_label_16j1l_9", er = "_required_16j1l_15", tr = "_helper_16j1l_18", rr = "_control_16j1l_24", or = "_error_16j1l_38", nr = "_disabled_16j1l_45", ir = "_toolbar_16j1l_51", lr = "_sm_16j1l_67", cr = "_md_16j1l_71", ar = "_lg_16j1l_75", sr = "_colorGlyph_16j1l_81", dr = "_colorBar_16j1l_89", ur = "_shell_16j1l_107", mr = "_content_16j1l_110", pr = "_placeholder_16j1l_123", hr = "_paragraph_16j1l_146", fr = "_h1_16j1l_152", _r = "_h2_16j1l_153", gr = "_h3_16j1l_154", yr = "_h4_16j1l_155", Nr = "_h5_16j1l_156", Tr = "_h6_16j1l_157", br = "_quote_16j1l_176", vr = "_ul_16j1l_183", Er = "_ol_16j1l_188", Cr = "_li_16j1l_193", Sr = "_nestedLi_16j1l_196", Lr = "_liChecked_16j1l_200", Mr = "_liUnchecked_16j1l_201", xr = "_link_16j1l_238", kr = "_bold_16j1l_245", Ar = "_italic_16j1l_248", Or = "_underline_16j1l_251", Rr = "_strike_16j1l_254", Dr = "_codeInline_16j1l_260", c = {
175
+ editor: Yt,
176
+ label: Zt,
177
+ required: er,
178
+ helper: tr,
179
+ control: rr,
180
+ error: or,
181
+ disabled: nr,
182
+ toolbar: ir,
183
+ sm: lr,
184
+ md: cr,
185
+ lg: ar,
186
+ colorGlyph: sr,
187
+ colorBar: dr,
188
+ shell: ur,
189
+ content: mr,
190
+ placeholder: pr,
191
+ paragraph: hr,
192
+ h1: fr,
193
+ h2: _r,
194
+ h3: gr,
195
+ h4: yr,
196
+ h5: Nr,
197
+ h6: Tr,
198
+ quote: br,
199
+ ul: vr,
200
+ ol: Er,
201
+ li: Cr,
202
+ nestedLi: Sr,
203
+ liChecked: Lr,
204
+ liUnchecked: Mr,
205
+ link: xr,
206
+ bold: kr,
207
+ italic: Ar,
208
+ underline: Or,
209
+ strike: Rr,
210
+ codeInline: Dr
211
+ }, Ir = {
212
+ paragraph: "Paragraph",
213
+ h1: "Heading 1",
214
+ h2: "Heading 2",
215
+ h3: "Heading 3",
216
+ quote: "Quote",
217
+ bullet: "Bullet List",
218
+ number: "Numbered List",
219
+ check: "Check List"
220
+ }, jr = [
221
+ { type: "paragraph", icon: "Text" },
222
+ { type: "h1", icon: "Hashtag" },
223
+ { type: "h2", icon: "Hashtag" },
224
+ { type: "h3", icon: "Hashtag" }
225
+ ], Ur = [
226
+ { value: "left", labelKey: "rte.alignLeft", icon: "TextalignLeft" },
227
+ { value: "center", labelKey: "rte.alignCenter", icon: "TextalignCenter" },
228
+ { value: "right", labelKey: "rte.alignRight", icon: "TextalignRight" }
229
+ ], wr = ["10px", "12px", "14px", "16px", "18px", "20px"], Fr = { sm: "12px", md: "14px", lg: "16px" };
230
+ function $r({ color: o, size: e }) {
231
+ return /* @__PURE__ */ R("span", { className: c.colorGlyph, children: [
232
+ /* @__PURE__ */ n(_, { name: "Brush", size: e }),
233
+ /* @__PURE__ */ n(
234
+ "span",
235
+ {
236
+ className: c.colorBar,
237
+ style: { borderColor: `transparent transparent ${o || "currentColor"} transparent` },
238
+ "aria-hidden": "true"
239
+ }
240
+ )
241
+ ] });
242
+ }
243
+ function Br({ size: o, disabled: e, onImageUpload: i }) {
244
+ const r = ue(), u = (t) => Ir[t] ?? t, [l] = De(), d = O(null), [g, s] = y(!1), [p, b] = y(!1), [h, f] = y(!1), [N, E] = y(!1), [Y, Z] = y(""), [S, D] = y("paragraph"), [ee, C] = y("left"), [v, I] = y(""), [w, $] = y(""), [B, H] = y(!1), F = O(null), [P, te] = y(!1), [T, we] = y(!1), [m, re] = y(null), [he, fe] = y(""), oe = xe(() => {
245
+ const t = z();
246
+ if (!G(t)) return;
247
+ s(t.hasFormat("bold")), b(t.hasFormat("italic")), f(t.hasFormat("underline")), $(ve(t, "color", "")), I(ve(t, "font-size", ""));
248
+ const a = t.anchor.getNode(), x = a.getParent(), M = Te(a) ? a : Te(x) ? x : null;
249
+ E(M !== null), Z((M == null ? void 0 : M.getURL()) ?? "");
250
+ const k = a.getKey() === "root" ? a : $t(a, (Ke) => {
251
+ const Ne = Ke.getParent();
252
+ return Ne === null || Ne.getKey() === "root";
253
+ }) ?? a.getTopLevelElement();
254
+ C(Xe(k) && k.getFormatType() || "left");
255
+ const V = Bt(a, Ie);
256
+ V ? D(V.getListType()) : Et(k) ? D(k.getTag()) : Ct(k) ? D("quote") : D("paragraph");
257
+ }, []);
258
+ A(() => Ht(
259
+ l.registerUpdateListener(({ editorState: t }) => t.read(oe)),
260
+ l.registerCommand(
261
+ Ye,
262
+ () => (oe(), !1),
263
+ le
264
+ ),
265
+ l.registerCommand(
266
+ Ze,
267
+ (t) => (te(t), !1),
268
+ le
269
+ ),
270
+ l.registerCommand(
271
+ et,
272
+ (t) => (we(t), !1),
273
+ le
274
+ )
275
+ ), [l, oe]);
276
+ const ne = (t) => l.dispatchCommand(nt, t), Fe = (t) => l.dispatchCommand(ot, t), $e = (t) => {
277
+ $(t), l.update(() => {
278
+ const a = z();
279
+ G(a) && Ee(a, { color: t || null });
280
+ });
281
+ }, Be = (t) => {
282
+ I(t), l.update(() => {
283
+ const a = z();
284
+ G(a) && Ee(a, { "font-size": t || null });
285
+ });
286
+ }, q = (t) => {
287
+ if (t === "bullet" || t === "number" || t === "check") {
288
+ if (S === t)
289
+ l.dispatchCommand(kt, void 0);
290
+ else {
291
+ const a = t === "bullet" ? At : t === "number" ? Ot : Rt;
292
+ l.dispatchCommand(a, void 0);
293
+ }
294
+ return;
295
+ }
296
+ l.update(() => {
297
+ const a = z();
298
+ G(a) && (t === "paragraph" ? ce(a, () => Oe()) : t === "quote" ? ce(a, () => St()) : ce(a, () => Lt(t)));
299
+ });
300
+ }, He = () => q(S === "quote" ? "paragraph" : "quote"), ie = (t, a = "") => {
301
+ fe(a), re(t);
302
+ }, _e = () => re(null), Pe = () => {
303
+ m == null || m.onConfirm(he.trim()), re(null);
304
+ }, qe = () => ie(
305
+ {
306
+ icon: "Link2",
307
+ title: r("rte.linkTitle"),
308
+ label: r("rte.linkUrl"),
309
+ placeholder: "https://example.com",
310
+ confirmLabel: r(N ? "common.update" : "common.insert"),
311
+ // an empty value removes the link (matches the old prompt behavior); sanitize the scheme
312
+ onConfirm: (t) => l.dispatchCommand(It, t === "" ? null : me(t))
313
+ },
314
+ Y
315
+ // prefill the current link's URL when the cursor sits in one
316
+ ), Ve = () => ie({
317
+ icon: "GalleryAdd",
318
+ title: r("rte.imageTitle"),
319
+ label: r("rte.imageUrl"),
320
+ placeholder: "https://example.com/image.jpg",
321
+ confirmLabel: r("common.insert"),
322
+ onConfirm: (t) => {
323
+ t && l.update(() => ae(J(t)));
324
+ }
325
+ }), ze = async (t) => {
326
+ var x;
327
+ const a = (x = t.target.files) == null ? void 0 : x[0];
328
+ if (t.target.value = "", !!a)
329
+ try {
330
+ const M = i ? await i(a) : await Hr(a);
331
+ l.update(() => ae(J(M, a.name)));
332
+ } catch {
333
+ Ft.error(r("rte.imageError"));
334
+ }
335
+ }, Ge = () => ie({
336
+ icon: "VideoSquare",
337
+ title: r("rte.videoTitle"),
338
+ label: r("rte.videoUrl"),
339
+ placeholder: r("rte.videoUrlPlaceholder"),
340
+ confirmLabel: r("common.insert"),
341
+ onConfirm: (t) => {
342
+ t && l.update(() => ae(pe(t)));
343
+ }
344
+ }), L = (t, a, x, M, k) => /* @__PURE__ */ n(
345
+ U,
346
+ {
347
+ variant: t ? "filled" : "text",
348
+ color: "primary",
349
+ size: o,
350
+ disabled: e,
351
+ "aria-label": a,
352
+ "aria-pressed": t,
353
+ onMouseDown: (V) => V.preventDefault(),
354
+ onClick: x,
355
+ children: M
356
+ },
357
+ k
358
+ ), ge = S.startsWith("h") ? S : "paragraph", ye = v || Fr[o];
359
+ return /* @__PURE__ */ R(
360
+ "div",
361
+ {
362
+ className: c.toolbar,
363
+ role: "toolbar",
364
+ "aria-label": r("rte.formatting"),
365
+ "aria-orientation": "horizontal",
366
+ children: [
367
+ /* @__PURE__ */ n(
368
+ U,
369
+ {
370
+ variant: "text",
371
+ color: "primary",
372
+ size: o,
373
+ disabled: e || !P,
374
+ "aria-label": r("rte.undo"),
375
+ onMouseDown: (t) => t.preventDefault(),
376
+ onClick: () => l.dispatchCommand(tt, void 0),
377
+ children: /* @__PURE__ */ n(_, { name: "UndoArrow" })
378
+ }
379
+ ),
380
+ /* @__PURE__ */ n(
381
+ U,
382
+ {
383
+ variant: "text",
384
+ color: "primary",
385
+ size: o,
386
+ disabled: e || !T,
387
+ "aria-label": r("rte.redo"),
388
+ onMouseDown: (t) => t.preventDefault(),
389
+ onClick: () => l.dispatchCommand(rt, void 0),
390
+ children: /* @__PURE__ */ n(_, { name: "RedoArrow" })
391
+ }
392
+ ),
393
+ /* @__PURE__ */ n(j, { orientation: "vertical" }),
394
+ /* @__PURE__ */ n(
395
+ se,
396
+ {
397
+ size: o,
398
+ disabled: e,
399
+ minWidth: !1,
400
+ trigger: /* @__PURE__ */ n(
401
+ K,
402
+ {
403
+ variant: "text",
404
+ color: "primary",
405
+ size: o,
406
+ disabled: e,
407
+ endIcon: /* @__PURE__ */ n(_, { name: "ArrowDown4" }),
408
+ "aria-label": r("rte.fontSize"),
409
+ onMouseDown: (t) => t.preventDefault(),
410
+ children: ye
411
+ }
412
+ ),
413
+ children: wr.map((t) => /* @__PURE__ */ n(
414
+ W,
415
+ {
416
+ clickable: !0,
417
+ selected: t === ye,
418
+ onClick: () => Be(t),
419
+ children: t
420
+ },
421
+ t
422
+ ))
423
+ }
424
+ ),
425
+ /* @__PURE__ */ n(j, { orientation: "vertical" }),
426
+ /* @__PURE__ */ n(
427
+ se,
428
+ {
429
+ size: o,
430
+ disabled: e,
431
+ trigger: /* @__PURE__ */ n(
432
+ K,
433
+ {
434
+ variant: "text",
435
+ color: "primary",
436
+ size: o,
437
+ disabled: e,
438
+ endIcon: /* @__PURE__ */ n(_, { name: "ArrowDown4" }),
439
+ onMouseDown: (t) => t.preventDefault(),
440
+ children: u(ge)
441
+ }
442
+ ),
443
+ children: jr.map((t) => /* @__PURE__ */ n(
444
+ W,
445
+ {
446
+ clickable: !0,
447
+ selected: ge === t.type,
448
+ icon: t.icon,
449
+ onClick: () => q(t.type),
450
+ children: u(t.type)
451
+ },
452
+ t.type
453
+ ))
454
+ }
455
+ ),
456
+ /* @__PURE__ */ n(j, { orientation: "vertical" }),
457
+ L(g, r("rte.bold"), () => ne("bold"), /* @__PURE__ */ n(_, { name: "TextBold" })),
458
+ L(p, r("rte.italic"), () => ne("italic"), /* @__PURE__ */ n(_, { name: "TextItalic" })),
459
+ L(
460
+ h,
461
+ r("rte.underline"),
462
+ () => ne("underline"),
463
+ /* @__PURE__ */ n(_, { name: "TextUnderline" })
464
+ ),
465
+ /* @__PURE__ */ n(j, { orientation: "vertical" }),
466
+ L(
467
+ S === "bullet",
468
+ r("rte.bulletList"),
469
+ () => q("bullet"),
470
+ /* @__PURE__ */ n(_, { name: "ListBullet" })
471
+ ),
472
+ L(
473
+ S === "number",
474
+ r("rte.numberedList"),
475
+ () => q("number"),
476
+ /* @__PURE__ */ n(_, { name: "ListNumber" })
477
+ ),
478
+ L(S === "quote", r("rte.quote"), He, /* @__PURE__ */ n(_, { name: "QuoteUp" })),
479
+ /* @__PURE__ */ n(j, { orientation: "vertical" }),
480
+ Ur.map(
481
+ (t) => L(
482
+ ee === t.value,
483
+ r(t.labelKey),
484
+ () => Fe(t.value),
485
+ /* @__PURE__ */ n(_, { name: t.icon }),
486
+ t.value
487
+ )
488
+ ),
489
+ /* @__PURE__ */ n(j, { orientation: "vertical" }),
490
+ /* @__PURE__ */ n(
491
+ U,
492
+ {
493
+ ref: F,
494
+ variant: "text",
495
+ color: "primary",
496
+ size: o,
497
+ disabled: e,
498
+ "aria-label": r("rte.textColor"),
499
+ "aria-expanded": B,
500
+ onMouseDown: (t) => t.preventDefault(),
501
+ onClick: () => H((t) => !t),
502
+ children: /* @__PURE__ */ n($r, { color: w })
503
+ }
504
+ ),
505
+ /* @__PURE__ */ n(
506
+ Vt,
507
+ {
508
+ open: B,
509
+ triggerRef: F,
510
+ onClose: (t) => {
511
+ var a;
512
+ H(!1), t && ((a = F.current) == null || a.focus());
513
+ },
514
+ role: "dialog",
515
+ ariaLabel: r("rte.textColor"),
516
+ width: 232,
517
+ children: /* @__PURE__ */ n(
518
+ Pt,
519
+ {
520
+ value: w || qt[0],
521
+ onChange: $e,
522
+ clearable: !1
523
+ }
524
+ )
525
+ }
526
+ ),
527
+ L(N, r("rte.link"), qe, /* @__PURE__ */ n(_, { name: "Link2" })),
528
+ /* @__PURE__ */ R(
529
+ se,
530
+ {
531
+ size: o,
532
+ disabled: e,
533
+ minWidth: !1,
534
+ trigger: /* @__PURE__ */ n(
535
+ U,
536
+ {
537
+ variant: "text",
538
+ color: "primary",
539
+ size: o,
540
+ disabled: e,
541
+ "aria-label": r("rte.insertImage"),
542
+ children: /* @__PURE__ */ n(_, { name: "GalleryAdd" })
543
+ }
544
+ ),
545
+ children: [
546
+ /* @__PURE__ */ n(W, { clickable: !0, icon: "GalleryImport", onClick: () => {
547
+ var t;
548
+ return (t = d.current) == null ? void 0 : t.click();
549
+ }, children: r("rte.uploadImage") }),
550
+ /* @__PURE__ */ n(W, { clickable: !0, icon: "Link", onClick: Ve, children: r("rte.imageByUrl") })
551
+ ]
552
+ }
553
+ ),
554
+ /* @__PURE__ */ n(
555
+ U,
556
+ {
557
+ variant: "text",
558
+ color: "primary",
559
+ size: o,
560
+ disabled: e,
561
+ "aria-label": r("rte.insertVideo"),
562
+ onClick: Ge,
563
+ children: /* @__PURE__ */ n(_, { name: "VideoSquare" })
564
+ }
565
+ ),
566
+ /* @__PURE__ */ n(
567
+ "input",
568
+ {
569
+ ref: d,
570
+ type: "file",
571
+ accept: "image/*",
572
+ hidden: !0,
573
+ onChange: ze,
574
+ "aria-hidden": "true",
575
+ tabIndex: -1
576
+ }
577
+ ),
578
+ /* @__PURE__ */ n(
579
+ zt,
580
+ {
581
+ open: m !== null,
582
+ onClose: _e,
583
+ size: "sm",
584
+ icon: m == null ? void 0 : m.icon,
585
+ title: m == null ? void 0 : m.title,
586
+ footer: /* @__PURE__ */ R(We, { children: [
587
+ /* @__PURE__ */ n(K, { variant: "text", size: "sm", onClick: _e, children: r("common.cancel") }),
588
+ /* @__PURE__ */ n(K, { type: "submit", size: "sm", form: "rte-url-form", children: (m == null ? void 0 : m.confirmLabel) ?? r("common.insert") })
589
+ ] }),
590
+ children: /* @__PURE__ */ n(
591
+ "form",
592
+ {
593
+ id: "rte-url-form",
594
+ onSubmit: (t) => {
595
+ t.preventDefault(), Pe();
596
+ },
597
+ children: /* @__PURE__ */ n(
598
+ Gt,
599
+ {
600
+ label: m == null ? void 0 : m.label,
601
+ placeholder: m == null ? void 0 : m.placeholder,
602
+ value: he,
603
+ onChange: (t) => fe(t.target.value)
604
+ }
605
+ )
606
+ }
607
+ )
608
+ }
609
+ )
610
+ ]
611
+ }
612
+ );
613
+ }
614
+ function Hr(o) {
615
+ return new Promise((e, i) => {
616
+ const r = new FileReader();
617
+ r.onload = () => e(r.result), r.onerror = () => i(r.error), r.readAsDataURL(o);
618
+ });
619
+ }
620
+ const Pr = {
621
+ paragraph: c.paragraph,
622
+ heading: {
623
+ h1: c.h1,
624
+ h2: c.h2,
625
+ h3: c.h3,
626
+ h4: c.h4,
627
+ h5: c.h5,
628
+ h6: c.h6
629
+ },
630
+ quote: c.quote,
631
+ list: {
632
+ ul: c.ul,
633
+ ol: c.ol,
634
+ listitem: c.li,
635
+ listitemChecked: c.liChecked,
636
+ listitemUnchecked: c.liUnchecked,
637
+ nested: { listitem: c.nestedLi }
638
+ },
639
+ link: c.link,
640
+ text: {
641
+ bold: c.bold,
642
+ italic: c.italic,
643
+ underline: c.underline,
644
+ strikethrough: c.strike,
645
+ code: c.codeInline
646
+ }
647
+ }, qr = [
648
+ Mt,
649
+ xt,
650
+ Ie,
651
+ Dt,
652
+ je,
653
+ Q,
654
+ X
655
+ ], Vr = [
656
+ ...Tt,
657
+ ...bt,
658
+ ...vt
659
+ ], zr = ["color", "font-size"], Gr = {
660
+ span: (o) => {
661
+ var i, r;
662
+ const e = (r = (i = it.importDOM()) == null ? void 0 : i.span) == null ? void 0 : r.call(i, o);
663
+ return {
664
+ priority: 1,
665
+ conversion: (u) => {
666
+ const l = (e == null ? void 0 : e.conversion(u)) ?? { node: null }, d = zr.flatMap((s) => {
667
+ const p = u.style.getPropertyValue(s);
668
+ return p ? [[s, p]] : [];
669
+ });
670
+ if (d.length === 0) return l;
671
+ const g = l.forChild;
672
+ return {
673
+ ...l,
674
+ forChild: (s, p) => {
675
+ const b = g ? g(s, p) : s;
676
+ if (lt(b)) {
677
+ const h = {
678
+ ...ct(b.getStyle())
679
+ };
680
+ for (const [f, N] of d) h[f] = N;
681
+ b.setStyle(
682
+ Object.entries(h).map(([f, N]) => `${f}: ${N};`).join(" ")
683
+ );
684
+ }
685
+ return b;
686
+ }
687
+ };
688
+ }
689
+ };
690
+ }
691
+ }, Kr = /* @__PURE__ */ new Set([
692
+ "A",
693
+ "B",
694
+ "CODE",
695
+ "EM",
696
+ "I",
697
+ "MARK",
698
+ "S",
699
+ "SPAN",
700
+ "STRONG",
701
+ "SUB",
702
+ "SUP",
703
+ "U"
704
+ ]);
705
+ function Wr(o) {
706
+ const e = o.split(";").map((i) => i.trim()).filter((i) => i && !/^white-space\s*:\s*pre-wrap$/i.test(i));
707
+ return e.length ? `${e.join("; ")};` : null;
708
+ }
709
+ function Jr(o) {
710
+ const e = document.createTreeWalker(o, NodeFilter.SHOW_ELEMENT | NodeFilter.SHOW_TEXT);
711
+ let i = !0, r = !1, u = null;
712
+ const l = () => {
713
+ u && u.data.endsWith(" ") && (u.data = `${u.data.slice(0, -1)} `), u = null, i = !0, r = !1;
714
+ };
715
+ for (let d = e.nextNode(); d; d = e.nextNode()) {
716
+ if (d.nodeType === Node.ELEMENT_NODE) {
717
+ Kr.has(d.tagName) || l();
718
+ continue;
719
+ }
720
+ const g = d;
721
+ if (!g.data) continue;
722
+ let s = "";
723
+ for (const p of g.data)
724
+ p === " " && (i || r) ? (s += " ", r = !1) : (s += p, r = p === " "), i = !1;
725
+ g.data = s, u = g;
726
+ }
727
+ l();
728
+ }
729
+ function Qr(o) {
730
+ if (typeof document > "u") return o;
731
+ const e = document.createElement("template");
732
+ e.innerHTML = o;
733
+ const i = e.content;
734
+ return i.querySelectorAll("[class]").forEach((r) => r.removeAttribute("class")), i.querySelectorAll("[style]").forEach((r) => {
735
+ var l;
736
+ if ((l = r.textContent) != null && l.includes(" ")) return;
737
+ const u = Wr(r.getAttribute("style") ?? "");
738
+ u ? r.setAttribute("style", u) : r.removeAttribute("style");
739
+ }), i.querySelectorAll("span").forEach((r) => {
740
+ r.attributes.length === 0 && r.replaceWith(...r.childNodes);
741
+ }), i.normalize(), Jr(i), e.innerHTML;
742
+ }
743
+ function Xr() {
744
+ const o = Re(), e = o.getFirstChild();
745
+ return o.getChildrenSize() <= 1 && (e === null || dt(e) && e.getChildrenSize() === 0);
746
+ }
747
+ function Le(o, e) {
748
+ const i = Re();
749
+ if (i.clear(), e) {
750
+ const r = new DOMParser().parseFromString(e, "text/html"), u = jt(o, r);
751
+ i.select(), at(u);
752
+ }
753
+ i.getChildrenSize() === 0 && i.append(Oe()), st(null);
754
+ }
755
+ const de = "tz-external-value";
756
+ function Me(o) {
757
+ return Xr() ? "" : Qr(Ut(o, null));
758
+ }
759
+ function Yr({ value: o, defaultValue: e, onChange: i, onReady: r, disabled: u }) {
760
+ const [l] = De(), d = O(void 0), g = O(i);
761
+ g.current = i;
762
+ const s = O(r);
763
+ s.current = r;
764
+ const p = O(!1), b = (h) => {
765
+ var f;
766
+ p.current || (p.current = !0, (f = s.current) == null || f.call(s, h));
767
+ };
768
+ return A(() => l.setEditable(!u), [l, u]), A(
769
+ () => l.registerNodeTransform(je, (h) => {
770
+ const f = h.getURL(), N = me(f);
771
+ N !== f && h.setURL(N);
772
+ }),
773
+ [l]
774
+ ), A(() => {
775
+ if (o === void 0) {
776
+ if (!e) {
777
+ d.current = "", b("");
778
+ return;
779
+ }
780
+ d.current = e, l.update(() => Le(l, e), {
781
+ tag: ["history-merge", de]
782
+ });
783
+ }
784
+ }, []), A(() => {
785
+ o === void 0 || o === d.current || (d.current = o, l.update(() => Le(l, o), {
786
+ tag: ["history-merge", de]
787
+ }));
788
+ }, [l, o]), A(
789
+ () => l.registerUpdateListener(({ dirtyElements: h, dirtyLeaves: f, tags: N }) => {
790
+ if (N.has(de)) {
791
+ l.read(() => {
792
+ const E = Me(l);
793
+ d.current = E, b(E);
794
+ });
795
+ return;
796
+ }
797
+ h.size === 0 && f.size === 0 || l.read(() => {
798
+ const E = Me(l);
799
+ E !== d.current && (d.current = E, g.current(E));
800
+ });
801
+ }),
802
+ // eslint-disable-next-line react-hooks/exhaustive-deps
803
+ [l]
804
+ ), null;
805
+ }
806
+ const jo = Je(
807
+ function({
808
+ label: e,
809
+ size: i = "md",
810
+ error: r,
811
+ helperText: u,
812
+ required: l = !1,
813
+ disabled: d = !1,
814
+ placeholder: g,
815
+ name: s,
816
+ value: p,
817
+ defaultValue: b,
818
+ onChange: h,
819
+ onReady: f,
820
+ onImageUpload: N,
821
+ minHeight: E = 220,
822
+ "aria-label": Y = "Rich text editor",
823
+ className: Z,
824
+ style: S
825
+ }, D) {
826
+ const ee = ue(), C = wt(), v = C && s ? C.field(s) : void 0, I = r ?? (v == null ? void 0 : v.error) ?? !1, w = u ?? (v == null ? void 0 : v.helperText), $ = C && s ? C.values[s] : void 0, B = p !== void 0 ? p : C && s ? String($ ?? "") : void 0, H = xe(
827
+ (T) => {
828
+ C && s && C.setValue(s, T), h == null || h(T);
829
+ },
830
+ [C, s, h]
831
+ ), F = (T) => v == null ? void 0 : v.onBlur(T), P = O(null);
832
+ A(() => {
833
+ const T = P.current;
834
+ T && (s ? T.setAttribute("name", s) : T.removeAttribute("name"));
835
+ }, [s]);
836
+ const te = {
837
+ namespace: "tz-rich-text-editor",
838
+ theme: Pr,
839
+ nodes: qr,
840
+ html: { import: Gr },
841
+ editable: !d,
842
+ onError: (T) => {
843
+ throw T;
844
+ }
845
+ };
846
+ return /* @__PURE__ */ R(
847
+ "div",
848
+ {
849
+ ref: D,
850
+ className: Qe(
851
+ c.editor,
852
+ c[i],
853
+ I && c.error,
854
+ d && c.disabled,
855
+ Z
856
+ ),
857
+ style: { "--tz-rte-min-height": `${E}px`, ...S },
858
+ children: [
859
+ e != null && /* @__PURE__ */ R("div", { className: c.label, children: [
860
+ /* @__PURE__ */ n(be, { as: "span", variant: "bodySmall", color: "muted", children: e }),
861
+ l && /* @__PURE__ */ n("span", { className: c.required, "aria-hidden": "true", children: "*" })
862
+ ] }),
863
+ /* @__PURE__ */ n("div", { className: c.control, children: /* @__PURE__ */ R(ut, { initialConfig: te, children: [
864
+ /* @__PURE__ */ n(Br, { size: i, disabled: d, onImageUpload: N }),
865
+ /* @__PURE__ */ n("div", { className: c.shell, children: /* @__PURE__ */ n(
866
+ mt,
867
+ {
868
+ contentEditable: /* @__PURE__ */ n(
869
+ pt,
870
+ {
871
+ ref: P,
872
+ className: c.content,
873
+ "aria-label": Y,
874
+ "aria-invalid": I || void 0,
875
+ onBlur: F
876
+ }
877
+ ),
878
+ placeholder: /* @__PURE__ */ n("div", { className: c.placeholder, children: g ?? ee("rte.placeholder") }),
879
+ ErrorBoundary: ht
880
+ }
881
+ ) }),
882
+ /* @__PURE__ */ n(ft, {}),
883
+ /* @__PURE__ */ n(_t, {}),
884
+ /* @__PURE__ */ n(gt, {}),
885
+ /* @__PURE__ */ n(yt, {}),
886
+ /* @__PURE__ */ n(Nt, { transformers: Vr }),
887
+ /* @__PURE__ */ n(
888
+ Yr,
889
+ {
890
+ value: B,
891
+ defaultValue: b,
892
+ onChange: H,
893
+ onReady: f,
894
+ disabled: d
895
+ }
896
+ )
897
+ ] }) }),
898
+ w != null && /* @__PURE__ */ n(
899
+ be,
900
+ {
901
+ as: "span",
902
+ variant: "bodySmall",
903
+ color: I ? "error" : "muted",
904
+ className: c.helper,
905
+ children: w
906
+ }
907
+ )
908
+ ]
909
+ }
910
+ );
911
+ }
912
+ );
913
+ export {
914
+ jo as R
915
+ };
916
+ //# sourceMappingURL=RichTextEditor-BFeJn2lr.js.map