@devalok/shilp-sutra 0.8.4 → 0.9.1

package/dist/composed/rich-text-editor.js

@@ -1,24 +1,237 @@
 "use client";
-import { jsxs as b, jsx as e } from "react/jsx-runtime";
+import { jsx as t, jsxs as g } from "react/jsx-runtime";
 import * as c from "react";
-import { useEditor as S, EditorContent as H } from "@tiptap/react";
-import B from "@tiptap/starter-kit";
-import G from "@tiptap/extension-placeholder";
-import P from "@tiptap/extension-underline";
-import M from "@tiptap/extension-highlight";
-import j from "@tiptap/extension-task-list";
-import D from "@tiptap/extension-task-item";
-import z from "@tiptap/extension-text-align";
-import q from "@tiptap/extension-link";
-import U from "@tiptap/extension-image";
-import O from "@tiptap/extension-mention";
-import { FileAttachment as K } from "./extensions/file-attachment.js";
-import { createSuggestionRenderer as J } from "./extensions/mention-suggestion.js";
-import { EmojiSuggestion as Q } from "./extensions/emoji-suggestion.js";
-import { useColorMode as X } from "../hooks/use-color-mode.js";
-import { cn as k } from "../ui/lib/utils.js";
-import { IconBold as Y, IconItalic as Z, IconUnderline as $, IconStrikethrough as F, IconHighlight as ee, IconH2 as te, IconH3 as ie, IconBlockquote as se, IconList as re, IconListNumbers as oe, IconListCheck as ne, IconCode as ce, IconPhoto as le, IconPaperclip as ae, IconLineDashed as de, IconAlignLeft as ue, IconAlignCenter as me, IconAlignRight as fe, IconMoodSmile as he, IconArrowBackUp as ge, IconArrowForwardUp as pe, IconLink as ke } from "@tabler/icons-react";
-const V = [
+import { N as Q, R as X, m as Y, a as Z, E as ee, S as te, u as M, U as D, T as B, b as P, P as ne, H as z, c as U, d as K, L as $, I as O, M as V, e as q } from "../_chunks/tiptap.js";
+import { IconFile as ie, IconDownload as re, IconBold as se, IconItalic as le, IconUnderline as oe, IconStrikethrough as ae, IconHighlight as ce, IconH2 as de, IconH3 as ue, IconBlockquote as me, IconList as fe, IconListNumbers as he, IconListCheck as ge, IconCode as be, IconPhoto as pe, IconPaperclip as xe, IconLineDashed as ke, IconAlignLeft as ve, IconAlignCenter as we, IconAlignRight as ye, IconMoodSmile as Ae, IconArrowBackUp as _e, IconArrowForwardUp as Ne, IconLink as Ie } from "@tabler/icons-react";
+import { createRoot as F } from "react-dom/client";
+import { c as p } from "../_chunks/utils.js";
+import { useColorMode as Le } from "../hooks/use-color-mode.js";
+function Ce(e) {
+  return e < 1024 ? `${e} B` : e < 1024 * 1024 ? `${(e / 1024).toFixed(1)} KB` : `${(e / (1024 * 1024)).toFixed(1)} MB`;
+}
+function Ee({ node: e }) {
+  const n = /^https?:\/\//.test(e.attrs.url) ? e.attrs.url : "#";
+  return /* @__PURE__ */ t(Z, { className: "my-ds-02", children: /* @__PURE__ */ g(
+    "a",
+    {
+      href: n,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      className: "inline-flex items-center gap-ds-03 rounded-ds-md border border-border bg-layer-02 px-ds-04 py-ds-03 text-ds-sm text-text-primary transition-colors hover:border-border-strong hover:bg-layer-03",
+      contentEditable: !1,
+      children: [
+        /* @__PURE__ */ t(ie, { className: "h-ico-sm w-ico-sm shrink-0 text-text-placeholder" }),
+        /* @__PURE__ */ t("span", { className: "truncate", children: e.attrs.name }),
+        /* @__PURE__ */ g("span", { className: "shrink-0 text-text-placeholder", children: [
+          "(",
+          Ce(e.attrs.size),
+          ")"
+        ] }),
+        /* @__PURE__ */ t(re, { className: "h-ico-sm w-ico-sm shrink-0 text-text-placeholder" })
+      ]
+    }
+  ) });
+}
+const W = Q.create({
+  name: "fileAttachment",
+  group: "block",
+  atom: !0,
+  addAttributes() {
+    return {
+      url: { default: null },
+      name: { default: "Untitled" },
+      size: { default: 0 }
+    };
+  },
+  parseHTML() {
+    return [{ tag: "div[data-file-attachment]" }];
+  },
+  renderHTML({ HTMLAttributes: e }) {
+    return ["div", Y({ "data-file-attachment": "" }, e)];
+  },
+  addNodeView() {
+    return X(Ee);
+  }
+}), R = c.forwardRef(
+  ({ items: e, command: n }, s) => {
+    const [i, l] = c.useState(0);
+    return c.useEffect(() => l(0), [e]), c.useImperativeHandle(s, () => ({
+      onKeyDown: ({ event: r }) => r.key === "ArrowUp" ? (l((o) => (o + e.length - 1) % e.length), !0) : r.key === "ArrowDown" ? (l((o) => (o + 1) % e.length), !0) : r.key === "Enter" ? (e[i] && n(e[i]), !0) : !1
+    })), e.length ? /* @__PURE__ */ t("div", { role: "listbox", "aria-label": "Mention suggestions", className: "z-popover overflow-hidden rounded-ds-md border border-border bg-layer-01 shadow-02", children: e.map((r, o) => /* @__PURE__ */ g(
+      "button",
+      {
+        type: "button",
+        role: "option",
+        "aria-selected": o === i,
+        onClick: () => n(r),
+        className: p(
+          "flex w-full items-center gap-ds-03 px-ds-04 py-ds-02b text-left text-ds-sm",
+          o === i ? "bg-layer-02 text-text-primary" : "text-text-secondary hover:bg-layer-02"
+        ),
+        children: [
+          r.avatar ? /* @__PURE__ */ t("img", { src: r.avatar, alt: "", className: "h-ico-md w-ico-md rounded-ds-full object-cover" }) : /* @__PURE__ */ t("span", { className: "flex h-ico-md w-ico-md items-center justify-center rounded-ds-full bg-interactive/10 text-[10px] font-semibold text-interactive", children: r.label.charAt(0).toUpperCase() }),
+          /* @__PURE__ */ t("span", { children: r.label })
+        ]
+      },
+      r.id
+    )) }) : null;
+  }
+);
+R.displayName = "MentionList";
+function Re() {
+  return () => {
+    let e = null, n = null, s = null;
+    return {
+      onStart: (i) => {
+        var r;
+        n = document.createElement("div"), n.style.position = "absolute", n.style.zIndex = "1400";
+        const l = (r = i.clientRect) == null ? void 0 : r.call(i);
+        l && (n.style.left = `${l.left}px`, n.style.top = `${l.bottom + 4}px`), document.body.appendChild(n), e = F(n), e.render(
+          /* @__PURE__ */ t(
+            R,
+            {
+              ref: (o) => {
+                s = o;
+              },
+              items: i.items,
+              command: (o) => i.command({ id: o.id, label: o.label })
+            }
+          )
+        );
+      },
+      onUpdate: (i) => {
+        var r;
+        if (!e || !n) return;
+        const l = (r = i.clientRect) == null ? void 0 : r.call(i);
+        l && (n.style.left = `${l.left}px`, n.style.top = `${l.bottom + 4}px`), e.render(
+          /* @__PURE__ */ t(
+            R,
+            {
+              ref: (o) => {
+                s = o;
+              },
+              items: i.items,
+              command: (o) => i.command({ id: o.id, label: o.label })
+            }
+          )
+        );
+      },
+      onKeyDown: (i) => i.event.key === "Escape" ? (n && (e == null || e.unmount(), n.remove(), n = null, e = null), !0) : (s == null ? void 0 : s.onKeyDown(i)) ?? !1,
+      onExit: () => {
+        n && (e == null || e.unmount(), n.remove(), n = null, e = null);
+      }
+    };
+  };
+}
+let A = null;
+async function Se() {
+  if (A) return A;
+  const e = await import("@emoji-mart/data"), n = e.default ?? e;
+  return A = Object.values(n.emojis).map((s) => {
+    var i;
+    return {
+      id: s.id,
+      name: s.name,
+      native: ((i = s.skins[0]) == null ? void 0 : i.native) ?? ""
+    };
+  }), A;
+}
+const S = c.forwardRef(
+  ({ items: e, command: n }, s) => {
+    const [i, l] = c.useState(0);
+    return c.useEffect(() => l(0), [e]), c.useImperativeHandle(s, () => ({
+      onKeyDown: ({ event: r }) => r.key === "ArrowUp" ? (l((o) => (o + e.length - 1) % e.length), !0) : r.key === "ArrowDown" ? (l((o) => (o + 1) % e.length), !0) : r.key === "Enter" ? (e[i] && n(e[i]), !0) : !1
+    })), e.length ? /* @__PURE__ */ t("div", { role: "listbox", "aria-label": "Emoji suggestions", className: "z-popover max-h-[200px] overflow-x-hidden overflow-y-auto rounded-ds-md border border-border bg-layer-01 shadow-02", children: e.map((r, o) => /* @__PURE__ */ g(
+      "button",
+      {
+        type: "button",
+        role: "option",
+        "aria-selected": o === i,
+        onClick: () => n(r),
+        className: p(
+          "flex w-full items-center gap-ds-03 px-ds-04 py-ds-02b text-left text-ds-sm",
+          o === i ? "bg-layer-02 text-text-primary" : "text-text-secondary hover:bg-layer-02"
+        ),
+        children: [
+          /* @__PURE__ */ t("span", { className: "text-ds-base", children: r.native }),
+          /* @__PURE__ */ g("span", { className: "truncate", children: [
+            ":",
+            r.id,
+            ":"
+          ] })
+        ]
+      },
+      r.id
+    )) }) : null;
+  }
+);
+S.displayName = "EmojiList";
+function Te() {
+  return () => {
+    let e = null, n = null, s = null;
+    return {
+      onStart: (i) => {
+        var r;
+        n = document.createElement("div"), n.style.position = "absolute", n.style.zIndex = "1400";
+        const l = (r = i.clientRect) == null ? void 0 : r.call(i);
+        l && (n.style.left = `${l.left}px`, n.style.top = `${l.bottom + 4}px`), document.body.appendChild(n), e = F(n), e.render(
+          /* @__PURE__ */ t(
+            S,
+            {
+              ref: (o) => {
+                s = o;
+              },
+              items: i.items,
+              command: (o) => i.command(o)
+            }
+          )
+        );
+      },
+      onUpdate: (i) => {
+        var r;
+        if (!e || !n) return;
+        const l = (r = i.clientRect) == null ? void 0 : r.call(i);
+        l && (n.style.left = `${l.left}px`, n.style.top = `${l.bottom + 4}px`), e.render(
+          /* @__PURE__ */ t(
+            S,
+            {
+              ref: (o) => {
+                s = o;
+              },
+              items: i.items,
+              command: (o) => i.command(o)
+            }
+          )
+        );
+      },
+      onKeyDown: (i) => i.event.key === "Escape" ? (n && (e == null || e.unmount(), n.remove(), n = null, e = null), !0) : (s == null ? void 0 : s.onKeyDown(i)) ?? !1,
+      onExit: () => {
+        n && (e == null || e.unmount(), n.remove(), n = null, e = null);
+      }
+    };
+  };
+}
+const He = ee.create({
+  name: "emojiSuggestion",
+  addProseMirrorPlugins() {
+    return [
+      te({
+        editor: this.editor,
+        char: ":",
+        items: async ({ query: e }) => {
+          const n = await Se();
+          return e ? n.filter(
+            (s) => s.id.includes(e.toLowerCase()) || s.name.toLowerCase().includes(e.toLowerCase())
+          ).slice(0, 8) : n.slice(0, 8);
+        },
+        command: ({ editor: e, range: n, props: s }) => {
+          e.chain().focus().deleteRange(n).insertContent(s.native).run();
+        },
+        render: Te()
+      })
+    ];
+  }
+}), G = [
   "prose prose-sm max-w-none",
   "font-body text-ds-md leading-relaxed text-text-primary",
   "[&_h2]:text-ds-xl [&_h2]:mb-ds-03 [&_h2]:mt-ds-05 [&_h2]:text-text-primary",
@@ -37,264 +250,264 @@ const V = [
   "[&_img]:max-w-full [&_img]:rounded-ds-md [&_img]:my-ds-03",
   "[&_.mention]:rounded-ds-sm [&_.mention]:bg-interactive/10 [&_.mention]:px-ds-02 [&_.mention]:py-[1px] [&_.mention]:font-medium [&_.mention]:text-interactive"
 ];
-function r({
-  onClick: t,
+function u({
+  onClick: e,
   isActive: n = !1,
-  disabled: a = !1,
-  title: l,
-  children: d
+  disabled: s = !1,
+  title: i,
+  children: l
 }) {
-  return /* @__PURE__ */ e(
+  return /* @__PURE__ */ t(
     "button",
     {
       type: "button",
-      onClick: t,
-      disabled: a,
-      title: l,
+      onClick: e,
+      disabled: s,
+      title: i,
       "aria-pressed": n,
-      className: k(
+      className: p(
         "inline-flex h-ds-xs-plus w-ds-xs-plus items-center justify-center rounded-ds-md transition-colors",
         "hover:bg-field",
         "disabled:pointer-events-none disabled:opacity-[0.38]",
         n ? "bg-field text-interactive" : "text-text-placeholder"
       ),
-      children: d
+      children: l
     }
   );
 }
-function be({ editor: t }) {
-  const [n, a] = c.useState(!1), [l, d] = c.useState(""), u = c.useRef(null), x = () => {
-    if (t.isActive("link")) {
-      t.chain().focus().unsetLink().run();
+function je({ editor: e }) {
+  const [n, s] = c.useState(!1), [i, l] = c.useState(""), r = c.useRef(null), o = () => {
+    if (e.isActive("link")) {
+      e.chain().focus().unsetLink().run();
       return;
     }
-    const m = t.getAttributes("link").href || "";
-    d(m), a(!0), setTimeout(() => {
-      var A;
-      return (A = u.current) == null ? void 0 : A.focus();
+    const f = e.getAttributes("link").href || "";
+    l(f), s(!0), setTimeout(() => {
+      var _;
+      return (_ = r.current) == null ? void 0 : _.focus();
     }, 0);
-  }, h = (m) => {
-    m.preventDefault(), l.trim() && t.chain().focus().setLink({ href: l.trim() }).run(), a(!1), d("");
-  }, g = (m) => {
-    m.key === "Escape" && (a(!1), d(""), t.commands.focus());
+  }, b = (f) => {
+    f.preventDefault(), i.trim() && e.chain().focus().setLink({ href: i.trim() }).run(), s(!1), l("");
+  }, x = (f) => {
+    f.key === "Escape" && (s(!1), l(""), e.commands.focus());
   };
-  return /* @__PURE__ */ b("div", { className: "relative", children: [
-    /* @__PURE__ */ e(r, { onClick: x, isActive: t.isActive("link"), title: "Link", children: /* @__PURE__ */ e(ke, { className: "h-ico-sm w-ico-sm", stroke: 2 }) }),
-    n && /* @__PURE__ */ b(
+  return /* @__PURE__ */ g("div", { className: "relative", children: [
+    /* @__PURE__ */ t(u, { onClick: o, isActive: e.isActive("link"), title: "Link", children: /* @__PURE__ */ t(Ie, { className: "h-ico-sm w-ico-sm", stroke: 2 }) }),
+    n && /* @__PURE__ */ g(
       "form",
       {
-        onSubmit: h,
+        onSubmit: b,
         "aria-label": "Edit link URL",
         className: "absolute left-0 top-full z-popover mt-ds-01 flex items-center gap-ds-02 rounded-ds-md border border-border bg-layer-01 p-ds-02 shadow-02",
         children: [
-          /* @__PURE__ */ e(
+          /* @__PURE__ */ t(
             "input",
             {
-              ref: u,
+              ref: r,
               type: "url",
-              value: l,
-              onChange: (m) => d(m.target.value),
-              onKeyDown: g,
+              value: i,
+              onChange: (f) => l(f.target.value),
+              onKeyDown: x,
               placeholder: "https://...",
               className: "h-ds-sm w-[240px] rounded-ds-sm border border-border bg-layer-01 px-ds-03 text-ds-sm text-text-primary focus:border-interactive focus:outline-none"
             }
           ),
-          /* @__PURE__ */ e("button", { type: "submit", className: "h-ds-sm rounded-ds-sm bg-interactive px-ds-03 text-ds-sm text-text-on-color hover:bg-interactive/90", children: "Apply" })
+          /* @__PURE__ */ t("button", { type: "submit", className: "h-ds-sm rounded-ds-sm bg-interactive px-ds-03 text-ds-sm text-text-on-color hover:bg-interactive/90", children: "Apply" })
         ]
       }
     )
   ] });
 }
-function p() {
-  return /* @__PURE__ */ e("div", { className: "mx-ds-02 h-[16px] w-px bg-border" });
+function k() {
+  return /* @__PURE__ */ t("div", { className: "mx-ds-02 h-[16px] w-px bg-border" });
 }
-function xe({ editor: t, onImageClick: n, onFileClick: a, onEmojiClick: l }) {
-  return /* @__PURE__ */ b("div", { className: "flex flex-wrap items-center gap-ds-01 border-b border-border px-ds-04 py-ds-02b", children: [
-    /* @__PURE__ */ e(r, { onClick: () => t.chain().focus().toggleBold().run(), isActive: t.isActive("bold"), title: "Bold", children: /* @__PURE__ */ e(Y, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
-    /* @__PURE__ */ e(r, { onClick: () => t.chain().focus().toggleItalic().run(), isActive: t.isActive("italic"), title: "Italic", children: /* @__PURE__ */ e(Z, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
-    /* @__PURE__ */ e(r, { onClick: () => t.chain().focus().toggleUnderline().run(), isActive: t.isActive("underline"), title: "Underline", children: /* @__PURE__ */ e($, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
-    /* @__PURE__ */ e(r, { onClick: () => t.chain().focus().toggleStrike().run(), isActive: t.isActive("strike"), title: "Strikethrough", children: /* @__PURE__ */ e(F, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
-    /* @__PURE__ */ e(r, { onClick: () => t.chain().focus().toggleHighlight().run(), isActive: t.isActive("highlight"), title: "Highlight", children: /* @__PURE__ */ e(ee, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
-    /* @__PURE__ */ e(p, {}),
-    /* @__PURE__ */ e(r, { onClick: () => t.chain().focus().toggleHeading({ level: 2 }).run(), isActive: t.isActive("heading", { level: 2 }), title: "Heading 2", children: /* @__PURE__ */ e(te, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
-    /* @__PURE__ */ e(r, { onClick: () => t.chain().focus().toggleHeading({ level: 3 }).run(), isActive: t.isActive("heading", { level: 3 }), title: "Heading 3", children: /* @__PURE__ */ e(ie, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
-    /* @__PURE__ */ e(r, { onClick: () => t.chain().focus().toggleBlockquote().run(), isActive: t.isActive("blockquote"), title: "Blockquote", children: /* @__PURE__ */ e(se, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
-    /* @__PURE__ */ e(p, {}),
-    /* @__PURE__ */ e(r, { onClick: () => t.chain().focus().toggleBulletList().run(), isActive: t.isActive("bulletList"), title: "Bullet list", children: /* @__PURE__ */ e(re, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
-    /* @__PURE__ */ e(r, { onClick: () => t.chain().focus().toggleOrderedList().run(), isActive: t.isActive("orderedList"), title: "Ordered list", children: /* @__PURE__ */ e(oe, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
-    /* @__PURE__ */ e(r, { onClick: () => t.chain().focus().toggleTaskList().run(), isActive: t.isActive("taskList"), title: "Task list", children: /* @__PURE__ */ e(ne, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
-    /* @__PURE__ */ e(r, { onClick: () => t.chain().focus().toggleCodeBlock().run(), isActive: t.isActive("codeBlock"), title: "Code block", children: /* @__PURE__ */ e(ce, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
-    /* @__PURE__ */ e(p, {}),
-    /* @__PURE__ */ e(be, { editor: t }),
-    n && /* @__PURE__ */ e(r, { onClick: n, title: "Insert image", children: /* @__PURE__ */ e(le, { className: "h-ico-sm w-ico-sm", stroke: 2 }) }),
-    a && /* @__PURE__ */ e(r, { onClick: a, title: "Attach file", children: /* @__PURE__ */ e(ae, { className: "h-ico-sm w-ico-sm", stroke: 2 }) }),
-    /* @__PURE__ */ e(r, { onClick: () => t.chain().focus().setHorizontalRule().run(), title: "Horizontal rule", children: /* @__PURE__ */ e(de, { className: "h-ico-sm w-ico-sm", stroke: 2 }) }),
-    /* @__PURE__ */ e(p, {}),
-    /* @__PURE__ */ e(r, { onClick: () => t.chain().focus().setTextAlign("left").run(), isActive: t.isActive({ textAlign: "left" }), title: "Align left", children: /* @__PURE__ */ e(ue, { className: "h-ico-sm w-ico-sm", stroke: 2 }) }),
-    /* @__PURE__ */ e(r, { onClick: () => t.chain().focus().setTextAlign("center").run(), isActive: t.isActive({ textAlign: "center" }), title: "Align center", children: /* @__PURE__ */ e(me, { className: "h-ico-sm w-ico-sm", stroke: 2 }) }),
-    /* @__PURE__ */ e(r, { onClick: () => t.chain().focus().setTextAlign("right").run(), isActive: t.isActive({ textAlign: "right" }), title: "Align right", children: /* @__PURE__ */ e(fe, { className: "h-ico-sm w-ico-sm", stroke: 2 }) }),
-    /* @__PURE__ */ e(p, {}),
-    l && /* @__PURE__ */ e(r, { onClick: l, title: "Emoji", children: /* @__PURE__ */ e(he, { className: "h-ico-sm w-ico-sm", stroke: 2 }) }),
-    /* @__PURE__ */ e(r, { onClick: () => t.chain().focus().undo().run(), disabled: !t.can().undo(), title: "Undo", children: /* @__PURE__ */ e(ge, { className: "h-ico-sm w-ico-sm", stroke: 2 }) }),
-    /* @__PURE__ */ e(r, { onClick: () => t.chain().focus().redo().run(), disabled: !t.can().redo(), title: "Redo", children: /* @__PURE__ */ e(pe, { className: "h-ico-sm w-ico-sm", stroke: 2 }) })
+function Me({ editor: e, onImageClick: n, onFileClick: s, onEmojiClick: i }) {
+  return /* @__PURE__ */ g("div", { className: "flex flex-wrap items-center gap-ds-01 border-b border-border px-ds-04 py-ds-02b", children: [
+    /* @__PURE__ */ t(u, { onClick: () => e.chain().focus().toggleBold().run(), isActive: e.isActive("bold"), title: "Bold", children: /* @__PURE__ */ t(se, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
+    /* @__PURE__ */ t(u, { onClick: () => e.chain().focus().toggleItalic().run(), isActive: e.isActive("italic"), title: "Italic", children: /* @__PURE__ */ t(le, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
+    /* @__PURE__ */ t(u, { onClick: () => e.chain().focus().toggleUnderline().run(), isActive: e.isActive("underline"), title: "Underline", children: /* @__PURE__ */ t(oe, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
+    /* @__PURE__ */ t(u, { onClick: () => e.chain().focus().toggleStrike().run(), isActive: e.isActive("strike"), title: "Strikethrough", children: /* @__PURE__ */ t(ae, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
+    /* @__PURE__ */ t(u, { onClick: () => e.chain().focus().toggleHighlight().run(), isActive: e.isActive("highlight"), title: "Highlight", children: /* @__PURE__ */ t(ce, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
+    /* @__PURE__ */ t(k, {}),
+    /* @__PURE__ */ t(u, { onClick: () => e.chain().focus().toggleHeading({ level: 2 }).run(), isActive: e.isActive("heading", { level: 2 }), title: "Heading 2", children: /* @__PURE__ */ t(de, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
+    /* @__PURE__ */ t(u, { onClick: () => e.chain().focus().toggleHeading({ level: 3 }).run(), isActive: e.isActive("heading", { level: 3 }), title: "Heading 3", children: /* @__PURE__ */ t(ue, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
+    /* @__PURE__ */ t(u, { onClick: () => e.chain().focus().toggleBlockquote().run(), isActive: e.isActive("blockquote"), title: "Blockquote", children: /* @__PURE__ */ t(me, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
+    /* @__PURE__ */ t(k, {}),
+    /* @__PURE__ */ t(u, { onClick: () => e.chain().focus().toggleBulletList().run(), isActive: e.isActive("bulletList"), title: "Bullet list", children: /* @__PURE__ */ t(fe, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
+    /* @__PURE__ */ t(u, { onClick: () => e.chain().focus().toggleOrderedList().run(), isActive: e.isActive("orderedList"), title: "Ordered list", children: /* @__PURE__ */ t(he, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
+    /* @__PURE__ */ t(u, { onClick: () => e.chain().focus().toggleTaskList().run(), isActive: e.isActive("taskList"), title: "Task list", children: /* @__PURE__ */ t(ge, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
+    /* @__PURE__ */ t(u, { onClick: () => e.chain().focus().toggleCodeBlock().run(), isActive: e.isActive("codeBlock"), title: "Code block", children: /* @__PURE__ */ t(be, { className: "h-ico-sm w-ico-sm", stroke: 2.5 }) }),
+    /* @__PURE__ */ t(k, {}),
+    /* @__PURE__ */ t(je, { editor: e }),
+    n && /* @__PURE__ */ t(u, { onClick: n, title: "Insert image", children: /* @__PURE__ */ t(pe, { className: "h-ico-sm w-ico-sm", stroke: 2 }) }),
+    s && /* @__PURE__ */ t(u, { onClick: s, title: "Attach file", children: /* @__PURE__ */ t(xe, { className: "h-ico-sm w-ico-sm", stroke: 2 }) }),
+    /* @__PURE__ */ t(u, { onClick: () => e.chain().focus().setHorizontalRule().run(), title: "Horizontal rule", children: /* @__PURE__ */ t(ke, { className: "h-ico-sm w-ico-sm", stroke: 2 }) }),
+    /* @__PURE__ */ t(k, {}),
+    /* @__PURE__ */ t(u, { onClick: () => e.chain().focus().setTextAlign("left").run(), isActive: e.isActive({ textAlign: "left" }), title: "Align left", children: /* @__PURE__ */ t(ve, { className: "h-ico-sm w-ico-sm", stroke: 2 }) }),
+    /* @__PURE__ */ t(u, { onClick: () => e.chain().focus().setTextAlign("center").run(), isActive: e.isActive({ textAlign: "center" }), title: "Align center", children: /* @__PURE__ */ t(we, { className: "h-ico-sm w-ico-sm", stroke: 2 }) }),
+    /* @__PURE__ */ t(u, { onClick: () => e.chain().focus().setTextAlign("right").run(), isActive: e.isActive({ textAlign: "right" }), title: "Align right", children: /* @__PURE__ */ t(ye, { className: "h-ico-sm w-ico-sm", stroke: 2 }) }),
+    /* @__PURE__ */ t(k, {}),
+    i && /* @__PURE__ */ t(u, { onClick: i, title: "Emoji", children: /* @__PURE__ */ t(Ae, { className: "h-ico-sm w-ico-sm", stroke: 2 }) }),
+    /* @__PURE__ */ t(u, { onClick: () => e.chain().focus().undo().run(), disabled: !e.can().undo(), title: "Undo", children: /* @__PURE__ */ t(_e, { className: "h-ico-sm w-ico-sm", stroke: 2 }) }),
+    /* @__PURE__ */ t(u, { onClick: () => e.chain().focus().redo().run(), disabled: !e.can().redo(), title: "Redo", children: /* @__PURE__ */ t(Ne, { className: "h-ico-sm w-ico-sm", stroke: 2 }) })
   ] });
 }
-const ve = c.lazy(() => import("../node_modules/.pnpm/@emoji-mart_react@1.1.1_emoji-mart@5.6.0_react@19.2.4/node_modules/@emoji-mart/react/dist/module.js"));
-function we({ onSelect: t }) {
-  const [n, a] = c.useState(null), { colorMode: l } = X();
+const De = c.lazy(() => import("@emoji-mart/react"));
+function Be({ onSelect: e }) {
+  const [n, s] = c.useState(null), { colorMode: i } = Le();
   c.useEffect(() => {
-    import("../node_modules/.pnpm/@emoji-mart_data@1.2.1/node_modules/@emoji-mart/data/sets/15/native.json.js").then((u) => a(u.default));
+    import("@emoji-mart/data").then((r) => s(r.default));
   }, []);
-  const d = /* @__PURE__ */ e("div", { className: "flex h-[350px] w-[352px] items-center justify-center rounded-ds-lg border border-border bg-layer-01 shadow-02", children: /* @__PURE__ */ e("span", { className: "text-ds-sm text-text-placeholder", children: "Loading..." }) });
-  return n ? /* @__PURE__ */ e(c.Suspense, { fallback: d, children: /* @__PURE__ */ e(
-    ve,
+  const l = /* @__PURE__ */ t("div", { className: "flex h-[350px] w-[352px] items-center justify-center rounded-ds-lg border border-border bg-layer-01 shadow-02", children: /* @__PURE__ */ t("span", { className: "text-ds-sm text-text-placeholder", children: "Loading..." }) });
+  return n ? /* @__PURE__ */ t(c.Suspense, { fallback: l, children: /* @__PURE__ */ t(
+    De,
     {
       data: n,
-      onEmojiSelect: (u) => t(u.native),
-      theme: l === "dark" ? "dark" : "light",
+      onEmojiSelect: (r) => e(r.native),
+      theme: i === "dark" ? "dark" : "light",
       previewPosition: "none",
       skinTonePosition: "none"
     }
-  ) }) : d;
+  ) }) : l;
 }
-const _e = c.forwardRef(
+const Pe = c.forwardRef(
   function({
     content: n = "",
-    placeholder: a = "Start writing...",
-    onChange: l,
-    className: d,
-    editable: u = !0,
-    onImageUpload: x,
-    onFileUpload: h,
-    mentions: g,
-    onMentionSearch: m,
-    onMentionSelect: A
-  }, W) {
-    const y = c.useRef(null), [I, v] = c.useState(!1), N = c.useRef(null), T = c.useRef(null), R = c.useRef(null), C = async (i) => {
-      const o = y.current;
-      if (o)
-        if (x) {
-          const s = await x(i);
-          s && /^https?:\/\//i.test(s) && o.chain().focus().setImage({ src: s }).run();
+    placeholder: s = "Start writing...",
+    onChange: i,
+    className: l,
+    editable: r = !0,
+    onImageUpload: o,
+    onFileUpload: b,
+    mentions: x,
+    onMentionSearch: f,
+    onMentionSelect: _
+  }, J) {
+    const N = c.useRef(null), [I, v] = c.useState(!1), L = c.useRef(null), T = c.useRef(null), H = c.useRef(null), C = async (a) => {
+      const m = N.current;
+      if (m)
+        if (o) {
+          const d = await o(a);
+          d && /^https?:\/\//i.test(d) && m.chain().focus().setImage({ src: d }).run();
         } else {
-          const s = new FileReader();
-          s.onload = () => {
-            o.chain().focus().setImage({ src: s.result }).run();
-          }, s.readAsDataURL(i);
+          const d = new FileReader();
+          d.onload = () => {
+            m.chain().focus().setImage({ src: d.result }).run();
+          }, d.readAsDataURL(a);
         }
-    }, L = async (i) => {
-      const o = y.current;
-      if (!o || !h) return;
-      const s = await h(i);
-      o.chain().focus().insertContent({
+    }, E = async (a) => {
+      const m = N.current;
+      if (!m || !b) return;
+      const d = await b(a);
+      m.chain().focus().insertContent({
         type: "fileAttachment",
-        attrs: { url: s.url, name: s.name, size: s.size }
+        attrs: { url: d.url, name: d.name, size: d.size }
       }).run();
-    }, f = S({
+    }, h = M({
       extensions: [
-        B.configure({
+        P.configure({
           heading: { levels: [2, 3] }
         }),
-        G.configure({
-          placeholder: a,
+        ne.configure({
+          placeholder: s,
           emptyEditorClass: "before:content-[attr(data-placeholder)] before:text-text-placeholder before:float-left before:h-0 before:pointer-events-none"
         }),
-        P,
-        M.configure({ multicolor: !1 }),
-        j,
-        D.configure({ nested: !0 }),
-        z.configure({ types: ["heading", "paragraph"] }),
-        q.configure({
+        D,
+        z.configure({ multicolor: !1 }),
+        B,
+        U.configure({ nested: !0 }),
+        K.configure({ types: ["heading", "paragraph"] }),
+        $.configure({
           openOnClick: !1,
           protocols: ["http", "https", "mailto"],
-          validate: (i) => /^(https?:\/\/|mailto:)/i.test(i),
+          validate: (a) => /^(https?:\/\/|mailto:)/i.test(a),
           HTMLAttributes: {
             rel: "noopener noreferrer",
             target: "_blank"
           }
         }),
-        U.configure({
+        O.configure({
           allowBase64: !0,
           HTMLAttributes: {
             class: "max-w-full rounded-ds-md"
           }
         }),
-        K,
-        ...g || m ? [
-          O.configure({
+        W,
+        ...x || f ? [
+          V.configure({
             HTMLAttributes: { class: "mention" },
             suggestion: {
-              items: async ({ query: i }) => m ? await m(i) : g ? g.filter((o) => o.label.toLowerCase().includes(i.toLowerCase())).slice(0, 8) : [],
-              render: J()
+              items: async ({ query: a }) => f ? await f(a) : x ? x.filter((m) => m.label.toLowerCase().includes(a.toLowerCase())).slice(0, 8) : [],
+              render: Re()
             }
           })
         ] : [],
-        Q
+        He
       ],
       content: n,
-      editable: u,
+      editable: r,
       editorProps: {
-        handleDrop: (i, o, s, w) => {
-          var E;
-          if (w || !((E = o.dataTransfer) != null && E.files.length)) return !1;
-          const _ = o.dataTransfer.files[0];
-          return _ ? _.type.startsWith("image/") ? (C(_), !0) : h ? (L(_), !0) : !1 : !1;
+        handleDrop: (a, m, d, w) => {
+          var j;
+          if (w || !((j = m.dataTransfer) != null && j.files.length)) return !1;
+          const y = m.dataTransfer.files[0];
+          return y ? y.type.startsWith("image/") ? (C(y), !0) : b ? (E(y), !0) : !1 : !1;
         },
-        handlePaste: (i, o) => {
+        handlePaste: (a, m) => {
           var w;
-          const s = (w = o.clipboardData) == null ? void 0 : w.files[0];
-          return s ? s.type.startsWith("image/") ? (C(s), !0) : h ? (L(s), !0) : !1 : !1;
+          const d = (w = m.clipboardData) == null ? void 0 : w.files[0];
+          return d ? d.type.startsWith("image/") ? (C(d), !0) : b ? (E(d), !0) : !1 : !1;
         },
         attributes: {
-          class: k(
-            ...V,
+          class: p(
+            ...G,
             "focus:outline-none",
             "min-h-[120px] px-ds-04 py-ds-04"
           )
         }
       },
-      onUpdate: ({ editor: i }) => {
-        l == null || l(i.getHTML());
+      onUpdate: ({ editor: a }) => {
+        i == null || i(a.getHTML());
       }
     });
     return c.useEffect(() => {
-      y.current = f;
-    }, [f]), c.useEffect(() => {
+      N.current = h;
+    }, [h]), c.useEffect(() => {
       if (!I) return;
-      const i = (o) => {
-        N.current && !N.current.contains(o.target) && v(!1);
+      const a = (m) => {
+        L.current && !L.current.contains(m.target) && v(!1);
       };
-      return document.addEventListener("mousedown", i), () => document.removeEventListener("mousedown", i);
+      return document.addEventListener("mousedown", a), () => document.removeEventListener("mousedown", a);
     }, [I]), c.useEffect(() => {
-      f && n !== f.getHTML() && f.commands.setContent(n, !1);
-    }, [f, n]), f ? /* @__PURE__ */ b("div", { ref: W, className: k("relative", d), children: [
-      I && /* @__PURE__ */ e(
+      h && n !== h.getHTML() && h.commands.setContent(n, !1);
+    }, [h, n]), h ? /* @__PURE__ */ g("div", { ref: J, className: p("relative", l), children: [
+      I && /* @__PURE__ */ t(
         "div",
         {
-          ref: N,
+          ref: L,
           className: "absolute bottom-full right-0 z-popover mb-ds-02",
-          onKeyDown: (i) => {
-            i.key === "Escape" && (i.stopPropagation(), v(!1));
+          onKeyDown: (a) => {
+            a.key === "Escape" && (a.stopPropagation(), v(!1));
           },
-          children: /* @__PURE__ */ e(
-            we,
+          children: /* @__PURE__ */ t(
+            Be,
             {
-              onSelect: (i) => {
-                f.chain().focus().insertContent(i).run(), v(!1);
+              onSelect: (a) => {
+                h.chain().focus().insertContent(a).run(), v(!1);
               }
             }
           )
         }
       ),
-      /* @__PURE__ */ b(
+      /* @__PURE__ */ g(
         "div",
         {
-          className: k(
+          className: p(
             "overflow-hidden rounded-ds-lg border border-border bg-layer-01",
             "transition-colors focus-within:border-border-strong"
           ),
           children: [
-            /* @__PURE__ */ e(
+            /* @__PURE__ */ t(
               "input",
               {
                 ref: T,
@@ -302,79 +515,79 @@ const _e = c.forwardRef(
                 accept: "image/*",
                 "aria-label": "Upload image",
                 className: "hidden",
-                onChange: (i) => {
-                  var s;
-                  const o = (s = i.target.files) == null ? void 0 : s[0];
-                  o && C(o), i.target.value = "";
+                onChange: (a) => {
+                  var d;
+                  const m = (d = a.target.files) == null ? void 0 : d[0];
+                  m && C(m), a.target.value = "";
                 }
               }
             ),
-            h && /* @__PURE__ */ e(
+            b && /* @__PURE__ */ t(
               "input",
               {
-                ref: R,
+                ref: H,
                 type: "file",
                 "aria-label": "Upload file",
                 className: "hidden",
-                onChange: (i) => {
-                  var s;
-                  const o = (s = i.target.files) == null ? void 0 : s[0];
-                  o && L(o), i.target.value = "";
+                onChange: (a) => {
+                  var d;
+                  const m = (d = a.target.files) == null ? void 0 : d[0];
+                  m && E(m), a.target.value = "";
                 }
               }
             ),
-            u && /* @__PURE__ */ e(
-              xe,
+            r && /* @__PURE__ */ t(
+              Me,
               {
-                editor: f,
+                editor: h,
                 onImageClick: () => {
-                  var i;
-                  return (i = T.current) == null ? void 0 : i.click();
+                  var a;
+                  return (a = T.current) == null ? void 0 : a.click();
                 },
-                onFileClick: h ? () => {
-                  var i;
-                  return (i = R.current) == null ? void 0 : i.click();
+                onFileClick: b ? () => {
+                  var a;
+                  return (a = H.current) == null ? void 0 : a.click();
                 } : void 0,
-                onEmojiClick: () => v((i) => !i)
+                onEmojiClick: () => v((a) => !a)
               }
             ),
-            /* @__PURE__ */ e(H, { editor: f })
+            /* @__PURE__ */ t(q, { editor: h })
           ]
         }
       )
     ] }) : null;
   }
 );
-_e.displayName = "RichTextEditor";
-const Ae = c.forwardRef(
-  function({ content: n, className: a }, l) {
-    const d = S({
+Pe.displayName = "RichTextEditor";
+const ze = c.forwardRef(
+  function({ content: n, className: s }, i) {
+    const l = M({
       extensions: [
-        B.configure({
+        P.configure({
           heading: { levels: [2, 3] }
         }),
-        P,
-        M.configure({ multicolor: !1 }),
-        j,
-        D.configure({ nested: !0 }),
-        z.configure({ types: ["heading", "paragraph"] }),
-        q.configure({
+        D,
+        z.configure({ multicolor: !1 }),
+        B,
+        U.configure({ nested: !0 }),
+        K.configure({ types: ["heading", "paragraph"] }),
+        $.configure({
           openOnClick: !0,
           protocols: ["http", "https", "mailto"],
-          validate: (u) => /^(https?:\/\/|mailto:)/i.test(u),
+          validate: (r) => /^(https?:\/\/|mailto:)/i.test(r),
           HTMLAttributes: {
             rel: "noopener noreferrer",
             target: "_blank"
           }
         }),
-        U.configure({
+        O.configure({
           allowBase64: !0,
           HTMLAttributes: {
             class: "max-w-full rounded-ds-md"
           }
         }),
-        K,
-        O.configure({
+        W,
+        V.configure({
           HTMLAttributes: { class: "mention" }
         })
       ],
@@ -382,15 +595,15 @@ const Ae = c.forwardRef(
       editable: !1,
       editorProps: {
         attributes: {
-          class: k(...V)
+          class: p(...G)
         }
       }
     });
-    return d ? /* @__PURE__ */ e("div", { ref: l, className: a, children: /* @__PURE__ */ e(H, { editor: d }) }) : null;
+    return l ? /* @__PURE__ */ t("div", { ref: i, className: s, children: /* @__PURE__ */ t(q, { editor: l }) }) : null;
   }
 );
-Ae.displayName = "RichTextViewer";
+ze.displayName = "RichTextViewer";
 export {
-  _e as RichTextEditor,
-  Ae as RichTextViewer
+  Pe as RichTextEditor,
+  ze as RichTextViewer
 };