@alfadocs/ui-kit 0.63.0 → 0.65.0

package/dist/_chunks/rich-text-editor-u36FqSWz.js

@@ -0,0 +1,1190 @@
+import { jsx as e, jsxs as w, Fragment as Pe } from "react/jsx-runtime";
+import { useId as he, useState as _, useRef as x, useCallback as f, useEffect as P, forwardRef as De, useMemo as Se, useImperativeHandle as Be } from "react";
+import { c as ke } from "./index-D2ZczOXr.js";
+import { useTranslation as xe } from "react-i18next";
+import { SafeHtml as Ve, sanitiseHtml as Fe } from "../safe-html/index.js";
+import { u as We } from "./registry-nPAVE19X.js";
+import { I } from "./icon-button-LqoiKcUN.js";
+import { S as Ge } from "./spinner-hbwuKwMf.js";
+import { T as Qe } from "./text-area-BIx0tZ05.js";
+import { E as Ze } from "./editor-overlay-wYm22wZK.js";
+import { R as Je } from "./rotate-ccw-BWANpitO.js";
+import { C as Xe } from "./check-DPdL_Sm7.js";
+import { S as pe } from "./square-CZoGU14v.js";
+import { M as ve } from "./mic-B4Gog3Gi.js";
+import { S as Ye } from "./send-CySZIRPJ.js";
+import { S as ye } from "./sparkles-CuYXqQLg.js";
+import { P as me } from "./popover-DTbfAuR0.js";
+import { D as A } from "./dropdown-menu-DwwPovMZ.js";
+import { T as Ue, I as Ke } from "./type-DZ5OMRA2.js";
+import { c as C } from "./createLucideIcon-CrFbzy84.js";
+/**
+ * @license lucide-react v1.8.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const et = [
+  [
+    "path",
+    { d: "M6 12h9a4 4 0 0 1 0 8H7a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h7a4 4 0 0 1 0 8", key: "mg9rjx" }
+  ]
+], tt = C("bold", et);
+/**
+ * @license lucide-react v1.8.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const rt = [
+  ["path", { d: "M4 12h8", key: "17cfdx" }],
+  ["path", { d: "M4 18V6", key: "1rz3zl" }],
+  ["path", { d: "M12 18V6", key: "zqpxq5" }],
+  ["path", { d: "M21 18h-4c0-4 4-3 4-6 0-1.5-2-2.5-4-1", key: "9jr5yi" }]
+], ot = C("heading-2", rt);
+/**
+ * @license lucide-react v1.8.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const at = [
+  ["path", { d: "M4 12h8", key: "17cfdx" }],
+  ["path", { d: "M4 18V6", key: "1rz3zl" }],
+  ["path", { d: "M12 18V6", key: "zqpxq5" }],
+  ["path", { d: "M17.5 10.5c1.7-1 3.5 0 3.5 1.5a2 2 0 0 1-2 2", key: "68ncm8" }],
+  ["path", { d: "M17 17.5c2 1.5 4 .3 4-1.5a2 2 0 0 0-2-2", key: "1ejuhz" }]
+], nt = C("heading-3", at);
+/**
+ * @license lucide-react v1.8.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const it = [
+  ["line", { x1: "19", x2: "10", y1: "4", y2: "4", key: "15jd3p" }],
+  ["line", { x1: "14", x2: "5", y1: "20", y2: "20", key: "bu0au3" }],
+  ["line", { x1: "15", x2: "9", y1: "4", y2: "20", key: "uljnxc" }]
+], lt = C("italic", it);
+/**
+ * @license lucide-react v1.8.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const st = [
+  ["path", { d: "M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71", key: "1cjeqo" }],
+  ["path", { d: "M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71", key: "19qd67" }]
+], dt = C("link", st);
+/**
+ * @license lucide-react v1.8.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const ct = [
+  ["path", { d: "M11 5h10", key: "1cz7ny" }],
+  ["path", { d: "M11 12h10", key: "1438ji" }],
+  ["path", { d: "M11 19h10", key: "11t30w" }],
+  ["path", { d: "M4 4h1v5", key: "10yrso" }],
+  ["path", { d: "M4 9h2", key: "r1h2o0" }],
+  ["path", { d: "M6.5 20H3.4c0-1 2.6-1.925 2.6-3.5a1.5 1.5 0 0 0-2.6-1.02", key: "xtkcd5" }]
+], ut = C("list-ordered", ct);
+/**
+ * @license lucide-react v1.8.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const mt = [
+  ["path", { d: "M3 5h.01", key: "18ugdj" }],
+  ["path", { d: "M3 12h.01", key: "nlz23k" }],
+  ["path", { d: "M3 19h.01", key: "noohij" }],
+  ["path", { d: "M8 5h13", key: "1pao27" }],
+  ["path", { d: "M8 12h13", key: "1za7za" }],
+  ["path", { d: "M8 19h13", key: "m83p4d" }]
+], ft = C("list", mt);
+/**
+ * @license lucide-react v1.8.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const gt = [["path", { d: "M5 12h14", key: "1ays0h" }]], bt = C("minus", gt);
+/**
+ * @license lucide-react v1.8.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const ht = [
+  [
+    "path",
+    {
+      d: "M12 22a1 1 0 0 1 0-20 10 9 0 0 1 10 9 5 5 0 0 1-5 5h-2.25a1.75 1.75 0 0 0-1.4 2.8l.3.4a1.75 1.75 0 0 1-1.4 2.8z",
+      key: "e79jfc"
+    }
+  ],
+  ["circle", { cx: "13.5", cy: "6.5", r: ".5", fill: "currentColor", key: "1okk4w" }],
+  ["circle", { cx: "17.5", cy: "10.5", r: ".5", fill: "currentColor", key: "f64h9f" }],
+  ["circle", { cx: "6.5", cy: "12.5", r: ".5", fill: "currentColor", key: "qy21gx" }],
+  ["circle", { cx: "8.5", cy: "7.5", r: ".5", fill: "currentColor", key: "fotxhn" }]
+], pt = C("palette", ht);
+/**
+ * @license lucide-react v1.8.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const vt = [
+  ["path", { d: "M13 4v16", key: "8vvj80" }],
+  ["path", { d: "M17 4v16", key: "7dpous" }],
+  ["path", { d: "M19 4H9.5a4.5 4.5 0 0 0 0 9H13", key: "sh4n9v" }]
+], yt = C("pilcrow", vt);
+/**
+ * @license lucide-react v1.8.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const kt = [
+  [
+    "path",
+    {
+      d: "M16 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z",
+      key: "rib7q0"
+    }
+  ],
+  [
+    "path",
+    {
+      d: "M5 3a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2 1 1 0 0 1 1 1v1a2 2 0 0 1-2 2 1 1 0 0 0-1 1v2a1 1 0 0 0 1 1 6 6 0 0 0 6-6V5a2 2 0 0 0-2-2z",
+      key: "1ymkrd"
+    }
+  ]
+], xt = C("quote", kt);
+/**
+ * @license lucide-react v1.8.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const wt = [
+  ["path", { d: "M16 4H9a3 3 0 0 0-2.83 4", key: "43sutm" }],
+  ["path", { d: "M14 12a4 4 0 0 1 0 8H6", key: "nlfj13" }],
+  ["line", { x1: "4", x2: "20", y1: "12", y2: "12", key: "1e0a9i" }]
+], Ct = C("strikethrough", wt);
+/**
+ * @license lucide-react v1.8.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const Mt = [
+  ["path", { d: "M12 3v18", key: "108xh3" }],
+  ["rect", { width: "18", height: "18", x: "3", y: "3", rx: "2", key: "afitv7" }],
+  ["path", { d: "M3 9h18", key: "1pudct" }],
+  ["path", { d: "M3 15h18", key: "5xshup" }]
+], zt = C("table", Mt), Nt = {
+  id: "rich-text-editor",
+  capabilities: ["edit_inline"],
+  state: {
+    html: {
+      type: "string",
+      description: "Sanitised HTML representation of the editor content.",
+      read: (o) => o.getHTML()
+    },
+    text: {
+      type: "string",
+      description: "Plain-text content of the editor (tags stripped).",
+      read: (o) => o.getText()
+    },
+    markdown: {
+      type: "string",
+      description: "Markdown representation of the editor content. The Redactor engine has no native Markdown serialiser, so this is always empty — read `html` instead.",
+      read: (o) => o.getMarkdown()
+    }
+  },
+  actions: {
+    set_content: {
+      safety: "destructive",
+      argsType: "{ html: string }",
+      description: "Replace the editor content. Loses unsaved input.",
+      invoke: (o, n) => {
+        o.setContent(n.html);
+      }
+    },
+    insert_at_cursor: {
+      safety: "destructive",
+      argsType: "{ content: string; asHtml?: boolean }",
+      description: "Insert content at the caret (replacing any selection). HTML is sanitised; pass asHtml:false for plain text. Seam for merge/template variables and AI-generated drafts.",
+      invoke: (o, n) => {
+        o.insertAtCursor(n.content, { asHtml: n.asHtml });
+      }
+    },
+    apply_format: {
+      safety: "destructive",
+      argsType: "{ format: 'bold' | 'italic' | 'strikethrough' | 'bulletedList' | 'numberedList' | 'heading' | 'quote' | 'paragraph' }",
+      description: "Toggle/apply a block or inline format on the current selection (bold, italic, strikethrough, bulleted/numbered list, heading, quote, paragraph).",
+      invoke: (o, n) => {
+        o.applyFormat(n.format);
+      }
+    },
+    clear: {
+      safety: "destructive",
+      description: "Empty the editor. Loses unsaved input.",
+      invoke: (o) => {
+        o.clear();
+      }
+    },
+    focus: {
+      safety: "read",
+      description: "Move keyboard focus to the editor surface.",
+      invoke: (o) => {
+        o.focus();
+      }
+    }
+  },
+  domHooks: {
+    root: { attr: "data-component", value: "rich-text-editor" },
+    instanceId: {
+      attr: "data-component-id",
+      sourceProp: "id",
+      description: "Sourced from the id prop."
+    }
+  }
+}, Rt = "ds:aria-pressed:!bg-[var(--destructive)] ds:aria-pressed:!text-[var(--destructive-foreground)]", St = "ds:text-[length:var(--font-size-sm)] ds:text-[color:var(--muted-foreground)]", Tt = "ds:text-[length:var(--font-size-sm)] ds:text-[color:var(--destructive)]", Te = [
+  "ds:rounded-[var(--radius-md)] ds:border ds:border-[color:var(--border)]",
+  "ds:bg-[color-mix(in_srgb,var(--background)_70%,transparent)]",
+  "ds:p-[var(--spacing-sm)] ds:[max-block-size:10rem] ds:overflow-y-auto",
+  "ds:text-[length:var(--font-size-sm)] ds:text-[color:var(--foreground)]"
+].join(" ");
+function _e(o, n) {
+  return n ? o ? /\s$/.test(o) ? `${o}${n}` : `${o} ${n}` : n : o;
+}
+function _t({
+  open: o,
+  onClose: n,
+  onRequestAiDraft: g,
+  onInsert: L,
+  previewAsHtml: Q = !0,
+  privacyNotice: j,
+  onDictate: l
+}) {
+  const { t: b } = xe(), R = he(), s = he(), [h, p] = _(""), [k, Z] = _(!1), [D, B] = _(!1), [S, J] = _(null), V = x(null), [u, ne] = _(!1), [M, F] = _(""), E = x(null), W = f(() => {
+    var i;
+    (i = E.current) == null || i.abort();
+  }, []), m = f(() => {
+    if (!l) return;
+    const i = new AbortController();
+    E.current = i, ne(!0), F(""), l({
+      signal: i.signal,
+      onPartialTranscript: (d) => {
+        i.signal.aborted || F(d);
+      },
+      onFinalTranscript: (d) => {
+        if (i.signal.aborted) return;
+        const G = d.trim();
+        F(""), G && p((N) => _e(N, G));
+      }
+    }).catch(() => {
+    }).finally(() => {
+      F(""), E.current === i && (E.current = null, ne(!1));
+    });
+  }, [l]), z = f(() => {
+    u ? W() : m();
+  }, [u, m, W]);
+  P(() => {
+    var i, d;
+    o ? (p(""), Z(!1), B(!1), J(null), F("")) : ((i = V.current) == null || i.abort(), V.current = null, (d = E.current) == null || d.abort());
+  }, [o]), P(
+    () => () => {
+      var i, d;
+      (i = V.current) == null || i.abort(), (d = E.current) == null || d.abort();
+    },
+    []
+  );
+  const $ = f(() => {
+    var G;
+    const i = h.trim();
+    if (!i || k) return;
+    W(), (G = V.current) == null || G.abort();
+    const d = new AbortController();
+    V.current = d, B(!1), Z(!0), g({ prompt: i, signal: d.signal }).then((N) => {
+      d.signal.aborted || (J(N), Z(!1));
+    }).catch((N) => {
+      d.signal.aborted || N && typeof N == "object" && "name" in N && N.name === "AbortError" || (B(!0), Z(!1));
+    });
+  }, [h, k, g, W]), U = f(() => {
+    S != null && (L(S), n());
+  }, [S, L, n]), ie = S != null, K = u ? _e(h, M) : h;
+  return /* @__PURE__ */ e(
+    Ze,
+    {
+      open: o,
+      onClose: n,
+      title: /* @__PURE__ */ w("span", { className: "ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]", children: [
+        /* @__PURE__ */ e(ye, { "aria-hidden": "true", className: "ds:size-4" }),
+        b("editor.ai.dialogTitle")
+      ] }),
+      ariaLabel: b("editor.ai.dialogTitle"),
+      children: ie ? /* @__PURE__ */ w("div", { className: "ds:flex ds:items-end ds:gap-[var(--spacing-xs)]", children: [
+        /* @__PURE__ */ e("div", { className: "ds:min-w-0 ds:flex-1", children: Q ? /* @__PURE__ */ e(
+          Ve,
+          {
+            html: S,
+            profile: "rich-text",
+            className: Te,
+            tabIndex: 0,
+            "aria-label": b("editor.ai.dialogTitle")
+          }
+        ) : (
+          // Focusable so a keyboard user can scroll a long draft preview
+          // (mirrors the SafeHtml preview branch above). The lint rule's
+          // tabIndex allowlist doesn't cover a scrollable, non-interactive
+          // text region.
+          // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
+          /* @__PURE__ */ e("p", { className: Te, tabIndex: 0, children: S })
+        ) }),
+        /* @__PURE__ */ e(
+          I,
+          {
+            size: "sm",
+            intent: "ghost",
+            className: "ds:rounded-full",
+            icon: /* @__PURE__ */ e(Je, {}),
+            "aria-label": b("editor.ai.retry"),
+            onClick: () => J(null)
+          }
+        ),
+        /* @__PURE__ */ e(
+          I,
+          {
+            size: "sm",
+            intent: "primary",
+            className: "ds:rounded-full",
+            icon: /* @__PURE__ */ e(Xe, {}),
+            "aria-label": b("common.confirm"),
+            onClick: U
+          }
+        )
+      ] }) : /* @__PURE__ */ w(Pe, { children: [
+        /* @__PURE__ */ w("div", { className: "ds:flex ds:items-end ds:gap-[var(--spacing-xs)]", children: [
+          /* @__PURE__ */ e("div", { className: "ds:min-w-0 ds:flex-1", children: /* @__PURE__ */ e(
+            Qe,
+            {
+              id: R,
+              size: "md",
+              value: K,
+              onChange: (i) => p(i.target.value),
+              placeholder: b("editor.ai.promptPlaceholder"),
+              "aria-label": b("editor.ai.promptLabel"),
+              autoResize: !0,
+              minRows: 1,
+              maxRows: 3,
+              readOnly: u,
+              tone: D ? "error" : "default",
+              "aria-describedby": D ? s : void 0
+            }
+          ) }),
+          l ? /* @__PURE__ */ e(
+            I,
+            {
+              size: "sm",
+              intent: "ghost",
+              className: u ? Rt : void 0,
+              icon: u ? /* @__PURE__ */ e(pe, { className: "ds:fill-current" }) : /* @__PURE__ */ e(ve, {}),
+              "aria-pressed": u,
+              "aria-label": b(u ? "editor.ai.dictateStop" : "editor.ai.dictateStart"),
+              onClick: z
+            }
+          ) : null,
+          /* @__PURE__ */ e(
+            I,
+            {
+              size: "sm",
+              intent: "primary",
+              icon: k ? /* @__PURE__ */ e(Ge, { size: "sm", variant: "pulse" }) : /* @__PURE__ */ e(Ye, {}),
+              className: "ds:rounded-full",
+              disabled: k || !h.trim(),
+              "aria-busy": k || void 0,
+              "aria-label": b("editor.ai.generate"),
+              onClick: $
+            }
+          )
+        ] }),
+        D ? /* @__PURE__ */ e("p", { id: s, role: "alert", className: Tt, children: b("editor.ai.error") }) : j ? /* @__PURE__ */ e("p", { className: St, children: j }) : null
+      ] })
+    }
+  );
+}
+const It = {
+  bold: {
+    id: "bold",
+    icon: /* @__PURE__ */ e(tt, {}),
+    label: ["editor.bold", "Bold"],
+    command: ["module.inline.format", { tag: "b" }],
+    toggle: "bold"
+  },
+  italic: {
+    id: "italic",
+    icon: /* @__PURE__ */ e(lt, {}),
+    label: ["editor.italic", "Italic"],
+    command: ["module.inline.format", { tag: "i" }],
+    toggle: "italic"
+  },
+  strike: {
+    id: "strike",
+    icon: /* @__PURE__ */ e(Ct, {}),
+    label: ["editor.strike", "Strikethrough"],
+    command: ["module.inline.format", { tag: "del" }],
+    toggle: "strike"
+  },
+  ul: {
+    id: "ul",
+    icon: /* @__PURE__ */ e(ft, {}),
+    label: ["editor.list.bullet", "Bulleted list"],
+    command: ["module.list.toggle", "ul"],
+    toggle: "ul"
+  },
+  ol: {
+    id: "ol",
+    icon: /* @__PURE__ */ e(ut, {}),
+    label: ["editor.list.ordered", "Numbered list"],
+    command: ["module.list.toggle", "ol"],
+    toggle: "ol"
+  },
+  link: {
+    id: "link",
+    icon: /* @__PURE__ */ e(dt, {}),
+    label: ["editor.link.insert", "Insert link"],
+    command: ["module.link.open"]
+  },
+  rule: {
+    id: "rule",
+    icon: /* @__PURE__ */ e(bt, {}),
+    label: ["editor.horizontalRule", "Horizontal rule"],
+    command: ["module.line.insert"]
+  }
+}, Ht = [
+  {
+    id: "paragraph",
+    tag: "p",
+    icon: /* @__PURE__ */ e(yt, {}),
+    label: ["editor.paragraph", "Paragraph"]
+  },
+  {
+    id: "h2",
+    tag: "h2",
+    icon: /* @__PURE__ */ e(ot, {}),
+    label: ["editor.heading2", "Heading 2"]
+  },
+  {
+    id: "h3",
+    tag: "h3",
+    icon: /* @__PURE__ */ e(nt, {}),
+    label: ["editor.heading3", "Heading 3"]
+  },
+  {
+    id: "quote",
+    tag: "blockquote",
+    icon: /* @__PURE__ */ e(xt, {}),
+    label: ["editor.quote", "Quote"]
+  }
+], At = {
+  minimal: ["bold", "italic", "link"],
+  standard: ["format", "bold", "italic", "strike", "ul", "ol", "link"],
+  full: ["format", "bold", "italic", "strike", "ul", "ol", "link", "rule"]
+}, Lt = [
+  {
+    token: "--foreground",
+    bg: "ds:bg-[var(--foreground)]",
+    label: ["editor.color.default", "Default"]
+  },
+  {
+    token: "--color-violet-700",
+    bg: "ds:bg-[var(--color-violet-700)]",
+    label: ["editor.color.violet", "Violet"]
+  },
+  {
+    token: "--color-magenta-700",
+    bg: "ds:bg-[var(--color-magenta-700)]",
+    label: ["editor.color.magenta", "Magenta"]
+  },
+  {
+    token: "--color-blue-700",
+    bg: "ds:bg-[var(--color-blue-700)]",
+    label: ["editor.color.blue", "Blue"]
+  },
+  {
+    token: "--color-green-700",
+    bg: "ds:bg-[var(--color-green-700)]",
+    label: ["editor.color.green", "Green"]
+  },
+  {
+    token: "--color-orange-700",
+    bg: "ds:bg-[var(--color-orange-700)]",
+    label: ["editor.color.orange", "Orange"]
+  },
+  {
+    token: "--color-red-700",
+    bg: "ds:bg-[var(--color-red-700)]",
+    label: ["editor.color.red", "Red"]
+  }
+], Et = [
+  {
+    id: "rowAbove",
+    command: "plugin.table.addRowAbove",
+    label: ["editor.table.rowAbove", "Add row above"]
+  },
+  {
+    id: "rowBelow",
+    command: "plugin.table.addRowBelow",
+    label: ["editor.table.rowBelow", "Add row below"]
+  },
+  {
+    id: "colLeft",
+    command: "plugin.table.addColumnLeft",
+    label: ["editor.table.columnLeft", "Add column left"]
+  },
+  {
+    id: "colRight",
+    command: "plugin.table.addColumnRight",
+    label: ["editor.table.columnRight", "Add column right"]
+  },
+  {
+    id: "deleteRow",
+    command: "plugin.table.deleteRow",
+    label: ["editor.table.deleteRow", "Delete row"]
+  },
+  {
+    id: "deleteColumn",
+    command: "plugin.table.deleteColumn",
+    label: ["editor.table.deleteColumn", "Delete column"]
+  },
+  {
+    id: "deleteTable",
+    command: "plugin.table.deleteTable",
+    label: ["editor.table.deleteTable", "Delete table"]
+  }
+], $t = ke(
+  [
+    "ds:flex ds:flex-wrap ds:items-center ds:gap-[var(--spacing-xs)]",
+    "ds:rounded-[var(--radius-md)] ds:border ds:border-[color:var(--border)]",
+    "ds:bg-[var(--background)] ds:p-[var(--spacing-xs)]",
+    "ds:shadow-[var(--shadow-md)]"
+  ].join(" ")
+), qt = "ds:self-stretch ds:[inline-size:var(--border-width-sm)] ds:bg-[var(--border)] ds:[margin-inline:var(--spacing-2xs)]", jt = "ds:size-6 ds:rounded-[var(--radius-sm)] ds:border ds:border-[color-mix(in_srgb,var(--foreground)_15%,transparent)] ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid ds:focus-visible:outline-[var(--ring)] ds:focus-visible:[outline-offset:var(--focus-ring-offset)]";
+function Ot(o) {
+  return typeof window > "u" ? "" : getComputedStyle(document.documentElement).getPropertyValue(o).trim();
+}
+function Pt({
+  run: o,
+  active: n,
+  preset: g,
+  enableColor: L = !1,
+  enableImage: Q = !1,
+  enableTable: j = !1
+}) {
+  const { t: l } = xe(), b = L || Q || j, R = (s) => s.preventDefault();
+  return /* @__PURE__ */ w(
+    "div",
+    {
+      role: "toolbar",
+      "aria-label": l("editor.toolbarLabel"),
+      className: $t(),
+      "data-component": "editor-toolbar",
+      children: [
+        At[g].map((s) => {
+          if (s === "format")
+            return /* @__PURE__ */ w(A.Root, { children: [
+              /* @__PURE__ */ e(A.Trigger, { asChild: !0, children: /* @__PURE__ */ e(
+                I,
+                {
+                  size: "sm",
+                  intent: "ghost",
+                  icon: /* @__PURE__ */ e(Ue, {}),
+                  "aria-label": l("editor.format", "Paragraph style"),
+                  onMouseDown: R
+                }
+              ) }),
+              /* @__PURE__ */ e(A.Content, { align: "start", children: Ht.map((p) => /* @__PURE__ */ e(
+                A.Item,
+                {
+                  startIcon: p.icon,
+                  onSelect: () => o("module.block.format", { tag: p.tag }),
+                  children: l(p.label[0], p.label[1])
+                },
+                p.id
+              )) })
+            ] }, "format");
+          const h = It[s];
+          return /* @__PURE__ */ e(
+            I,
+            {
+              size: "sm",
+              intent: "ghost",
+              icon: h.icon,
+              "aria-label": l(h.label[0], h.label[1]),
+              "aria-pressed": h.toggle ? n.has(h.toggle) : void 0,
+              onMouseDown: R,
+              onClick: () => o(...h.command)
+            },
+            h.id
+          );
+        }),
+        b ? /* @__PURE__ */ e("span", { "aria-hidden": "true", className: qt }) : null,
+        L ? /* @__PURE__ */ w(me, { children: [
+          /* @__PURE__ */ e(me.Trigger, { asChild: !0, children: /* @__PURE__ */ e(
+            I,
+            {
+              size: "sm",
+              intent: "ghost",
+              icon: /* @__PURE__ */ e(pt, {}),
+              "aria-label": l("editor.textColor", "Text colour"),
+              onMouseDown: R
+            }
+          ) }),
+          /* @__PURE__ */ w(me.Content, { side: "bottom", align: "start", children: [
+            /* @__PURE__ */ e(me.Heading, { children: l("editor.textColor", "Text colour") }),
+            /* @__PURE__ */ e("div", { className: "ds:flex ds:flex-wrap ds:gap-[var(--spacing-xs)] ds:pt-[var(--spacing-xs)]", children: Lt.map((s) => /* @__PURE__ */ e(
+              "button",
+              {
+                type: "button",
+                "aria-label": l(s.label[0], s.label[1]),
+                className: `${jt} ${s.bg}`,
+                onMouseDown: R,
+                onClick: () => o("plugin.fontcolor.set", {
+                  rule: "color",
+                  value: Ot(s.token)
+                })
+              },
+              s.token
+            )) }),
+            /* @__PURE__ */ e(
+              "button",
+              {
+                type: "button",
+                className: "ds:mt-[var(--spacing-sm)] ds:text-[length:var(--font-size-sm)] ds:text-[color:var(--muted-foreground)] ds:underline",
+                onMouseDown: R,
+                onClick: () => o("plugin.fontcolor.remove", { rule: "color" }),
+                children: l("editor.color.remove", "Remove colour")
+              }
+            )
+          ] })
+        ] }) : null,
+        Q ? /* @__PURE__ */ e(
+          I,
+          {
+            size: "sm",
+            intent: "ghost",
+            icon: /* @__PURE__ */ e(Ke, {}),
+            "aria-label": l("editor.image.insert", "Insert image"),
+            onMouseDown: R,
+            onClick: () => o("module.image.open")
+          }
+        ) : null,
+        j ? /* @__PURE__ */ w(A.Root, { children: [
+          /* @__PURE__ */ e(A.Trigger, { asChild: !0, children: /* @__PURE__ */ e(
+            I,
+            {
+              size: "sm",
+              intent: "ghost",
+              icon: /* @__PURE__ */ e(zt, {}),
+              "aria-label": l("editor.table.insert", "Insert table"),
+              onMouseDown: R
+            }
+          ) }),
+          /* @__PURE__ */ w(A.Content, { align: "start", children: [
+            /* @__PURE__ */ e(A.Item, { onSelect: () => o("plugin.table.insert"), children: l("editor.table.insert", "Insert table") }),
+            /* @__PURE__ */ e(A.Separator, {}),
+            Et.map((s) => /* @__PURE__ */ e(A.Item, { onSelect: () => o(s.command), children: l(s.label[0], s.label[1]) }, s.id))
+          ] })
+        ] }) : null
+      ]
+    }
+  );
+}
+function O(o) {
+  return Fe(o, "rich-text");
+}
+function be(o = "") {
+  const n = String(o).trim();
+  if (n === "" || n === "<p><br></p>" || n === "<p>&nbsp;</p>")
+    return "";
+  const g = n.replace(/<br\s*\/?>/gi, "").replace(/&nbsp;/gi, "").replace(/<[^>]+>/g, "").trim();
+  return g === "" && /<img\b[^>]*>/i.test(n) ? n : g === "" ? "" : n;
+}
+function Dt(o) {
+  return o.replace(
+    /<img(?![^>]*\sloading=)([^>]*)>/gi,
+    '<img loading="lazy"$1>'
+  );
+}
+function Bt(o) {
+  if (o) return o;
+  if (typeof window > "u") return null;
+  const n = window;
+  return n.$R ?? n.Redactor ?? null;
+}
+const Vt = {
+  bold: ["module.inline.format", { tag: "b" }],
+  italic: ["module.inline.format", { tag: "i" }],
+  strikethrough: ["module.inline.format", { tag: "del" }],
+  bulletedList: ["module.list.toggle", "ul"],
+  numberedList: ["module.list.toggle", "ol"],
+  heading: ["module.block.format", { tag: "h2" }],
+  quote: ["module.block.format", { tag: "blockquote" }],
+  paragraph: ["module.block.format", { tag: "p" }]
+}, Ft = {
+  zh: "zh_cn",
+  pt: "pt_br"
+};
+function Wt(o) {
+  const n = o.split("-")[0];
+  return Ft[n] ?? n ?? "en";
+}
+const Gt = ke(
+  "redactor-theme-alfadocs ds:flex ds:flex-col ds:gap-[var(--spacing-sm)]"
+), Qt = ke(
+  [
+    "ds:block ds:[inline-size:100%]",
+    "ds:rounded-[var(--radius-md)] ds:border ds:border-[color:var(--border)]",
+    "ds:bg-[var(--background)] ds:text-[var(--foreground)]",
+    "ds:shadow-[var(--shadow-md)]",
+    "ds:font-[family-name:var(--font-sans)] ds:text-[length:var(--font-size-base)]",
+    "ds:p-[var(--spacing-md)] ds:[min-block-size:var(--rich-text-editor-min-block-size)]",
+    "ds:focus-visible:outline-[length:var(--focus-ring-width)]",
+    "ds:focus-visible:outline-solid",
+    "ds:focus-visible:outline-[var(--ring)]",
+    "ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
+    "ds:forced-colors:focus-visible:outline-[CanvasText]"
+  ].join(" ")
+), He = [
+  "ds:inline-flex ds:items-center ds:justify-center",
+  "ds:[min-block-size:var(--min-target-size)] ds:[min-inline-size:var(--min-target-size)]",
+  "ds:text-[color:var(--primary-foreground)]",
+  "ds:transition-colors",
+  "ds:focus-visible:outline-[length:var(--focus-ring-width)]",
+  "ds:focus-visible:outline-solid",
+  "ds:focus-visible:outline-[var(--primary-foreground)]",
+  "ds:focus-visible:[outline-offset:calc(var(--focus-ring-width)*-1)]"
+].join(" "), Ie = `${He} ds:hover:bg-[color-mix(in_srgb,var(--primary-foreground)_15%,transparent)]`, Zt = `${He} ds:bg-[var(--destructive)] ds:hover:bg-[color-mix(in_srgb,var(--destructive)_88%,var(--primary-foreground))]`, Jt = "ds:aria-pressed:!bg-[var(--destructive)] ds:aria-pressed:!text-[var(--destructive-foreground)]", Xt = De(
+  ({
+    id: o,
+    defaultValue: n,
+    value: g,
+    onChange: L,
+    toolbar: Q = "standard",
+    placeholder: j,
+    readOnly: l = !1,
+    ariaLabel: b,
+    minHeight: R,
+    className: s,
+    redactor: h,
+    options: p,
+    plugins: k,
+    lang: Z,
+    imageUploadUrl: D,
+    onKeyDown: B,
+    onRequestAiDraft: S,
+    aiDraftFormat: J = "html",
+    aiPrivacyNotice: V,
+    onDictate: u
+  }, ne) => {
+    const { t: M, i18n: F } = xe(), E = he(), W = Se(
+      () => `rte-${E.replace(/[^a-zA-Z0-9-_]/g, "")}`,
+      [E]
+    ), m = `#${W}`, z = x(null), $ = x(null), U = x(!1), ie = x(l), K = x(null), [i, d] = _(!1), [G, N] = _(!1), [Ae, Le] = _(
+      () => /* @__PURE__ */ new Set()
+    ), ee = x(null), T = x(L), le = x(B);
+    P(() => {
+      T.current = L, le.current = B;
+    }, [L, B]);
+    const Ee = x(
+      (() => {
+        const t = g ?? n ?? "";
+        return t ? O(t) : "";
+      })()
+    ), te = f(() => {
+      var r;
+      const t = $.current;
+      if (t)
+        try {
+          const a = t(m, "source.getCode");
+          if (typeof a == "string") return a;
+        } catch {
+        }
+      return ((r = z.current) == null ? void 0 : r.value) ?? "";
+    }, [m]), q = f(
+      (t, ...r) => {
+        const a = $.current;
+        if (!a) return !1;
+        const v = ie.current;
+        if (v)
+          try {
+            a(m, "disableReadOnly");
+          } catch {
+          }
+        try {
+          return a(m, t, ...r), !0;
+        } catch {
+          return !1;
+        } finally {
+          if (v)
+            try {
+              a(m, "enableReadOnly");
+            } catch {
+            }
+        }
+      },
+      [m]
+    ), re = f(
+      (t, r) => {
+        var ae;
+        const a = (r == null ? void 0 : r.asHtml) ?? !0, v = a ? O(t) : t;
+        if (q(a ? "insertion.insertHtml" : "insertion.insertText", v)) return;
+        const c = z.current;
+        if (!c) return;
+        const X = c.selectionStart ?? c.value.length, Y = c.selectionEnd ?? c.value.length;
+        c.value = c.value.slice(0, X) + v + c.value.slice(Y);
+        const ue = X + v.length;
+        try {
+          c.setSelectionRange(ue, ue);
+        } catch {
+        }
+        (ae = T.current) == null || ae.call(T, { html: O(c.value), markdown: "" });
+      },
+      [q]
+    ), se = f(() => {
+      var v;
+      const t = (v = K.current) == null ? void 0 : v.querySelector(".redactor-in"), r = typeof window < "u" ? window.getSelection() : null, a = /* @__PURE__ */ new Set();
+      if (t && r && r.anchorNode && t.contains(r.anchorNode) && typeof document.queryCommandState == "function")
+        try {
+          document.queryCommandState("bold") && a.add("bold"), document.queryCommandState("italic") && a.add("italic"), document.queryCommandState("strikeThrough") && a.add("strike"), document.queryCommandState("insertUnorderedList") && a.add("ul"), document.queryCommandState("insertOrderedList") && a.add("ol");
+          const y = String(
+            document.queryCommandValue("formatBlock") || ""
+          ).toLowerCase();
+          /^h[1-6]$/.test(y) ? a.add("heading") : y === "blockquote" && a.add("quote");
+        } catch {
+        }
+      Le(
+        (y) => y.size === a.size && [...a].every((c) => y.has(c)) ? y : a
+      );
+    }, []), fe = f(
+      (t, ...r) => {
+        q(t, ...r), typeof window < "u" ? window.requestAnimationFrame(() => se()) : se();
+      },
+      [q, se]
+    ), oe = x(null), de = x(null), [H, we] = _(!1), [$e, Ce] = _(!1), ce = f(() => {
+      const t = de.current;
+      t != null && t.parentNode && t.parentNode.removeChild(t), de.current = null;
+    }, []), Me = f((t) => {
+      var v;
+      const r = (v = K.current) == null ? void 0 : v.querySelector(
+        ".redactor-in"
+      );
+      if (!r) return;
+      let a = de.current;
+      if (!a || !r.contains(a)) {
+        a = document.createElement("span"), a.setAttribute("data-rte-interim", ""), a.setAttribute("contenteditable", "false");
+        const y = window.getSelection();
+        if (y && y.rangeCount > 0 && r.contains(y.anchorNode)) {
+          const c = y.getRangeAt(0);
+          c.collapse(!1), c.insertNode(a);
+        } else
+          r.appendChild(a);
+        de.current = a;
+      }
+      a.textContent = t;
+    }, []), ze = f(() => {
+      var t;
+      (t = oe.current) == null || t.abort();
+    }, []), Ne = f(() => {
+      if (!u) return;
+      const t = new AbortController();
+      oe.current = t, Ce(!1), we(!0), ce(), u({
+        signal: t.signal,
+        // Interim text shows live in the editor (grey + caret); each final
+        // replaces it with committed text at the caret.
+        onPartialTranscript: (r) => {
+          t.signal.aborted || Me(r);
+        },
+        onFinalTranscript: (r) => {
+          if (t.signal.aborted) return;
+          ce();
+          const a = r.trim();
+          a && re(`${a} `, { asHtml: !1 });
+        }
+      }).catch((r) => {
+        t.signal.aborted || r && typeof r == "object" && "name" in r && r.name === "AbortError" || Ce(!0);
+      }).finally(() => {
+        ce(), oe.current === t && (oe.current = null, we(!1));
+      });
+    }, [u, re, ce, Me]), Re = f(() => {
+      H ? ze() : Ne();
+    }, [H, Ne, ze]);
+    P(() => () => {
+      var t;
+      return (t = oe.current) == null ? void 0 : t.abort();
+    }, []), P(() => {
+      const t = z.current;
+      if (!t) return;
+      t.value = Ee.current;
+      const r = Bt(h);
+      if (!r) {
+        d(!0);
+        return;
+      }
+      $.current = r;
+      const a = {
+        lang: Z ?? Wt(F.language || "en"),
+        // The kit renders its OWN toolbar (EditorToolbar) and drives Redactor
+        // via the command API, so Redactor's native toolbar is suppressed.
+        toolbar: !1,
+        plugins: k ?? [],
+        placeholder: j ?? M("editor.placeholder"),
+        toolbarFixed: !1,
+        // Platform parity (RedactorWysiwyg.js:84): no inline shortcode expansion.
+        shortcodes: !1,
+        imageEditable: !1,
+        imageResizable: !0
+      }, v = D ? { imageUpload: D } : {}, y = (p == null ? void 0 : p.callbacks) ?? {}, c = {
+        ...a,
+        ...v,
+        ...p ?? {},
+        // Re-pin safety-critical keys LAST so consumer `options` can't override
+        // the sanitising change handler, re-enable image editing, or turn off
+        // drag-resize (platform re-pins both image flags — RedactorWysiwyg.js:115-116).
+        imageEditable: !1,
+        imageResizable: !0,
+        callbacks: {
+          ...y,
+          changed(X) {
+            const Y = be(Dt(X)), ue = O(Y);
+            U.current = !0, T.current && (ee.current && clearTimeout(ee.current), ee.current = setTimeout(() => {
+              var ae;
+              (ae = T.current) == null || ae.call(T, { html: ue, markdown: "" });
+            }, 100));
+          },
+          keydown(X) {
+            var Y;
+            (Y = le.current) == null || Y.call(le, X);
+          },
+          observe() {
+            se();
+          }
+        }
+      };
+      try {
+        if (r(m, c), l)
+          try {
+            r(m, "enableReadOnly");
+          } catch {
+          }
+      } catch {
+        d(!0);
+      }
+      return () => {
+        ee.current && clearTimeout(ee.current);
+        try {
+          r(m, "destroy");
+        } catch {
+        }
+        $.current = null;
+      };
+    }, []), P(() => {
+      if (!$.current || g === void 0) return;
+      if (U.current) {
+        U.current = !1;
+        return;
+      }
+      const t = O(be(g));
+      be(te()) !== t && q("source.setCode", t);
+    }, [g, te, q]), P(() => {
+      ie.current = l;
+      const t = $.current;
+      if (t)
+        try {
+          t(m, l ? "enableReadOnly" : "disableReadOnly");
+        } catch {
+        }
+    }, [l, m]), P(() => {
+      if (!i || g === void 0) return;
+      const t = z.current;
+      if (!t) return;
+      const r = O(g);
+      t.value !== r && document.activeElement !== t && (t.value = r);
+    }, [i, g]);
+    const ge = Se(
+      () => ({
+        getHTML() {
+          return te();
+        },
+        getText() {
+          return te().replace(/<[^>]*>/g, " ").replace(/&nbsp;/gi, " ").replace(/\s+/g, " ").trim();
+        },
+        getMarkdown() {
+          return "";
+        },
+        setContent(t) {
+          const r = O(t);
+          q("source.setCode", r) || z.current && (z.current.value = r);
+        },
+        insertAtCursor: re,
+        applyFormat(t) {
+          const r = Vt[t];
+          r && fe(...r);
+        },
+        focus() {
+          var r;
+          const t = $.current;
+          if (t)
+            try {
+              t(m, "editor.focus");
+              return;
+            } catch {
+            }
+          (r = z.current) == null || r.focus();
+        },
+        clear() {
+          q("source.setCode", "") || z.current && (z.current.value = "");
+        }
+      }),
+      [m, te, q, re, fe]
+    );
+    Be(ne, () => ge, [ge]), We(Nt, ge, o);
+    const qe = f(
+      (t) => {
+        var r;
+        (r = T.current) == null || r.call(T, {
+          html: O(t.target.value),
+          markdown: ""
+        });
+      },
+      []
+    ), je = b ?? M("editor.regionLabel"), Oe = j ?? M("editor.placeholder");
+    return /* @__PURE__ */ w(
+      "div",
+      {
+        ref: K,
+        className: [Gt(), s].filter(Boolean).join(" "),
+        "data-component": "rich-text-editor",
+        "data-component-id": o,
+        "data-min-height": R,
+        children: [
+          !i && !l ? /* @__PURE__ */ e(
+            Pt,
+            {
+              run: fe,
+              active: Ae,
+              preset: Q,
+              enableColor: (k == null ? void 0 : k.includes("fontcolor")) ?? !1,
+              enableImage: !!D,
+              enableTable: (k == null ? void 0 : k.includes("table")) ?? !1
+            }
+          ) : null,
+          /* @__PURE__ */ w("div", { className: "ds:relative", children: [
+            /* @__PURE__ */ e(
+              "textarea",
+              {
+                ref: z,
+                id: W,
+                "aria-label": je,
+                "aria-multiline": "true",
+                placeholder: Oe,
+                onChange: i ? qe : void 0,
+                readOnly: i ? l : void 0,
+                className: i ? Qt() : void 0
+              }
+            ),
+            S && u ? /* @__PURE__ */ w("div", { className: "ds:absolute ds:[inset-block-end:var(--spacing-md)] ds:[inset-inline-end:var(--spacing-md)] ds:z-10 ds:flex ds:items-center ds:overflow-hidden ds:rounded-full ds:bg-[var(--primary)] ds:shadow-[var(--shadow-lg)]", children: [
+              /* @__PURE__ */ e(
+                "button",
+                {
+                  type: "button",
+                  onClick: Re,
+                  "aria-pressed": H,
+                  "aria-label": M(H ? "editor.ai.dictateStop" : "editor.ai.dictateStart"),
+                  className: H ? Zt : Ie,
+                  children: H ? /* @__PURE__ */ e(
+                    pe,
+                    {
+                      "aria-hidden": "true",
+                      className: "ds:size-5 ds:fill-current"
+                    }
+                  ) : /* @__PURE__ */ e(ve, { "aria-hidden": "true", className: "ds:size-5" })
+                }
+              ),
+              /* @__PURE__ */ e(
+                "span",
+                {
+                  "aria-hidden": "true",
+                  className: "ds:self-stretch ds:[inline-size:var(--border-width-sm)] ds:bg-[color-mix(in_srgb,var(--primary-foreground)_35%,transparent)]"
+                }
+              ),
+              /* @__PURE__ */ e(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => N(!0),
+                  "aria-label": M("editor.ai.helpMeWrite"),
+                  className: Ie,
+                  children: /* @__PURE__ */ e(ye, { "aria-hidden": "true", className: "ds:size-5" })
+                }
+              )
+            ] }) : u ? /* @__PURE__ */ e("div", { className: "ds:absolute ds:[inset-block-end:var(--spacing-md)] ds:[inset-inline-end:var(--spacing-md)] ds:z-10", children: /* @__PURE__ */ e(
+              I,
+              {
+                size: "lg",
+                intent: "primary",
+                icon: H ? /* @__PURE__ */ e(pe, { className: "ds:fill-current" }) : /* @__PURE__ */ e(ve, {}),
+                "aria-pressed": H,
+                "aria-label": M(H ? "editor.ai.dictateStop" : "editor.ai.dictateStart"),
+                onClick: Re,
+                className: H ? `${Jt} ds:rounded-full ds:shadow-[var(--shadow-lg)]` : "ds:rounded-full ds:shadow-[var(--shadow-lg)]"
+              }
+            ) }) : S ? /* @__PURE__ */ e("div", { className: "ds:absolute ds:[inset-block-end:var(--spacing-md)] ds:[inset-inline-end:var(--spacing-md)] ds:z-10", children: /* @__PURE__ */ e(
+              I,
+              {
+                size: "lg",
+                intent: "primary",
+                icon: /* @__PURE__ */ e(ye, {}),
+                "aria-label": M("editor.ai.helpMeWrite"),
+                onClick: () => N(!0),
+                className: "ds:rounded-full ds:shadow-[var(--shadow-lg)]"
+              }
+            ) }) : null,
+            S ? /* @__PURE__ */ e(
+              _t,
+              {
+                open: G,
+                onClose: () => N(!1),
+                onRequestAiDraft: S,
+                onInsert: (t) => re(t, { asHtml: J !== "text" }),
+                previewAsHtml: J !== "text",
+                privacyNotice: V,
+                onDictate: u
+              }
+            ) : null
+          ] }),
+          u && $e ? /* @__PURE__ */ e(
+            "p",
+            {
+              role: "alert",
+              className: "ds:text-[length:var(--font-size-sm)] ds:text-[color:var(--destructive)]",
+              children: M("editor.ai.dictationError")
+            }
+          ) : null
+        ]
+      }
+    );
+  }
+);
+Xt.displayName = "RichTextEditor";
+export {
+  Xt as R,
+  Nt as r,
+  Gt as w
+};
+//# sourceMappingURL=rich-text-editor-u36FqSWz.js.map