@pantograph/vue 0.27.2 → 0.27.4

package/dist/Comment/index.js

@@ -1,45 +1,40 @@
-import { defineComponent as w, ref as b, createElementBlock as j, createCommentVNode as I, unref as n, openBlock as R, normalizeClass as $, createBlock as E, createVNode as y, Fragment as de, renderList as Q, withCtx as T, createTextVNode as ae, toDisplayString as X, useSlots as q, createElementVNode as N, h as B, mergeProps as H, isRef as ie, createSlots as Z, renderSlot as L, normalizeProps as G, guardReactiveProps as W, computed as F, normalizeStyle as ue, onMounted as me, onBeforeUnmount as fe, withModifiers as ne } from "vue";
-import { u as U, g as O, e as Y } from "../Icon.vue_vue_type_script_setup_true_lang-DJv20Efl.js";
-import { a as z } from "../options-J8HfRMSU.js";
-import { omit as he } from "es-toolkit";
-import { createContext as Ce } from "reka-ui";
-import "@vueuse/core";
-import { u as ee } from "../useVmodel-DlyNieM5.js";
-import "@tanstack/vue-virtual";
-import { _ as le } from "../Avatar.vue_vue_type_script_setup_true_lang-CH_6o8dq.js";
-import { _ as ye } from "../Badge.vue_vue_type_script_setup_true_lang-GQnZqeaV.js";
+import { defineComponent as A, ref as R, createElementBlock as F, createCommentVNode as I, unref as n, openBlock as P, normalizeClass as $, createBlock as E, withModifiers as H, createVNode as y, Fragment as de, renderList as q, withCtx as T, createTextVNode as ie, toDisplayString as Y, useSlots as J, createElementVNode as G, h as b, mergeProps as V, isRef as ae, createSlots as ee, renderSlot as U, normalizeProps as W, guardReactiveProps as Q, computed as L, normalizeStyle as ue, onMounted as me, onBeforeUnmount as fe } from "vue";
+import { getComponentOptions as z, useComponentStyle as K, useVModel as oe, isEmptyElement as O, useFormInput as he, useInputDataStates as Ce } from "@pantograph/utils-vue";
+import { _ as le } from "../Avatar.vue_vue_type_script_setup_true_lang-D6M8USW4.js";
+import { _ as ye } from "../Badge.vue_vue_type_script_setup_true_lang-CaAe4Yuz.js";
 import { cva as ge } from "class-variance-authority";
-import { _ as ve } from "../GraphicalObject.vue_vue_type_script_setup_true_lang-Dwf4A9T3.js";
+import { _ as ve } from "../GraphicalObject.vue_vue_type_script_setup_true_lang-C45pbuL2.js";
+import { _ as Z } from "../Icon.vue_vue_type_script_setup_true_lang-DBiBHDqC.js";
 import { normCls as C, getBemElement as m, getBemBlock as _e, generateVariantClassList as Be } from "@pantograph/utils";
-import { _ as A } from "../IconButton.vue_vue_type_script_setup_true_lang-CRdinhW6.js";
-import "@pantograph/tokens";
-import { _ as be } from "../ActionButton.vue_vue_type_script_setup_true_lang-D4l05YZz.js";
-import K from "@pantograph/style/comment.css?raw";
-import { _ as Re } from "../Popover.vue_vue_type_script_setup_true_lang-D-Jebwr9.js";
-import { _ as Se, a as se } from "../MenuItem.vue_vue_type_script_setup_true_lang-BhAWfw04.js";
-import { _ as Pe } from "../GOPicker.vue_vue_type_script_setup_true_lang-Cx2WQErE.js";
-import { _ as ke } from "../Combobox.vue_vue_type_script_setup_true_lang-6ZvMvMe_.js";
-import { _ as xe } from "../Divider.vue_vue_type_script_setup_true_lang-BHkXVZCN.js";
-import { u as Te, U as Oe } from "../useInputDataStates-DCxDvkM-.js";
-import { _ as $e } from "../ScrollContainer.vue_vue_type_script_setup_true_lang-BU7qU1LR.js";
-import { _ as Ee, a as Me } from "../Upload.vue_vue_type_script_setup_true_lang-BNiFkx47.js";
-import { _ as De } from "../Shortcut.vue_vue_type_script_setup_true_lang-CPeD8ZFo.js";
-const Ae = /* @__PURE__ */ w({
+import { _ as D } from "../IconButton.vue_vue_type_script_setup_true_lang-DbWKTcZc.js";
+import { _ as be } from "../ActionButton.vue_vue_type_script_setup_true_lang-B7a38s3f.js";
+import N from "@pantograph/style/comment.css?raw";
+import { createContext as Re } from "reka-ui";
+import { _ as Pe } from "../Popover.vue_vue_type_script_setup_true_lang-DhDzrGk6.js";
+import { _ as Se, a as se } from "../MenuItem.vue_vue_type_script_setup_true_lang-CC0ZX8mk.js";
+import { _ as ke } from "../GOPicker.vue_vue_type_script_setup_true_lang-UNRfZ8eW.js";
+import { _ as xe } from "../Combobox.vue_vue_type_script_setup_true_lang-DXwg6ANz.js";
+import { _ as Te } from "../Divider.vue_vue_type_script_setup_true_lang-BZRu0h3n.js";
+import { _ as Oe } from "../ScrollContainer.vue_vue_type_script_setup_true_lang-FKw-Hnvi.js";
+import { _ as $e, a as Ee } from "../Upload.vue_vue_type_script_setup_true_lang-CwSlVjBi.js";
+import { omit as Me } from "es-toolkit";
+import { _ as we } from "../Shortcut.vue_vue_type_script_setup_true_lang-B16kPcKe.js";
+const De = /* @__PURE__ */ A({
   ...z("CommentActions"),
   __name: "CommentActions",
   setup(u) {
-    const s = re(), t = b(), e = b(), d = () => {
+    const s = re(), t = R(), e = R(), d = () => {
       s.emit("openActions", e.value);
-    }, i = () => {
+    }, a = () => {
       s.emit("openReaction", t.value);
     }, l = () => {
       s.emit("reply");
     };
-    return (p, o) => n(s).props.hasReaction || n(s).props.hasEdit || n(s).props.hasDelete ? (R(), j("div", {
+    return (p, o) => n(s).props.hasReaction || n(s).props.hasEdit || n(s).props.hasDelete ? (P(), F("div", {
       key: 0,
-      class: $(n(C)(n(m)(n(P), "actions"), n(s).props.actionsCls))
+      class: $(n(C)(n(m)(n(k), "actions"), n(s).props.actionsCls))
     }, [
-      n(s).props.hasReply ? (R(), E(A, {
+      n(s).props.hasReply ? (P(), E(D, {
         key: 0,
         icon: "tabler:corner-up-left",
         color: "neutral",
@@ -49,63 +44,69 @@ const Ae = /* @__PURE__ */ w({
         flipOnDir: "rtl",
         onClick: l
       }, null, 512)) : I("", !0),
-      n(s).props.hasReaction ? (R(), E(A, {
+      n(s).props.hasReaction ? (P(), E(D, {
         key: 1,
         icon: "tabler:mood-plus",
         color: "neutral",
         type: "ghost",
         ref_key: "reactionRef",
         ref: t,
-        onClick: i
+        onPointerdown: o[0] || (o[0] = H(() => {
+        }, ["stop"])),
+        onClick: a
       }, null, 512)) : I("", !0),
-      n(s).props.hasEdit || n(s).props.hasDelete ? (R(), E(A, {
+      n(s).props.hasEdit || n(s).props.hasDelete ? (P(), E(D, {
         key: 2,
         icon: "tabler:dots-vertical",
         color: "neutral",
         type: "ghost",
         ref_key: "actionRef",
         ref: e,
+        onPointerdown: o[1] || (o[1] = H(() => {
+        }, ["stop"])),
         onClick: d
       }, null, 512)) : I("", !0)
     ], 2)) : I("", !0);
   }
-}), we = /* @__PURE__ */ w({
+}), Ae = /* @__PURE__ */ A({
   ...z("CommentReactions"),
   __name: "CommentReactions",
   setup(u) {
-    const s = re(), t = b(), e = () => {
+    const s = re(), t = R(), e = () => {
       s.emit("openReaction", t.value);
-    }, d = (i) => {
-      i && !i.active && s.emit("reaction", i.emoji);
+    }, d = (a) => {
+      a && !a.active && s.emit("reaction", a.emoji);
     };
-    return (i, l) => {
+    return (a, l) => {
       var p;
-      return n(s).props.hasReaction && ((p = n(s).props.reactions) != null && p.some((o) => o.count && o.emoji)) ? (R(), j("div", {
+      return n(s).props.hasReaction && ((p = n(s).props.reactions) != null && p.some((o) => o.count && o.emoji)) ? (P(), F("div", {
         key: 0,
-        class: $(n(C)(n(m)(n(P), "reactions"), n(s).props.reactionsCls))
+        class: $(n(C)(n(m)(n(k), "reactions"), n(s).props.reactionsCls))
       }, [
-        (R(!0), j(de, null, Q(n(s).props.reactions, (o) => (R(), E(be, {
+        (P(!0), F(de, null, q(n(s).props.reactions, (o) => (P(), E(be, {
           key: o == null ? void 0 : o.emoji,
           active: o == null ? void 0 : o.active,
           onClick: (v) => d(o)
         }, {
           default: T(() => [
-            ae(X(o == null ? void 0 : o.emoji) + " " + X(o == null ? void 0 : o.count), 1)
+            ie(Y(o == null ? void 0 : o.emoji) + " " + Y(o == null ? void 0 : o.count), 1)
           ]),
           _: 2
         }, 1032, ["active", "onClick"]))), 128)),
-        y(A, {
+        y(D, {
           icon: "tabler:mood-plus",
           color: "neutral",
           type: "outline",
           ref_key: "reactionRef",
           ref: t,
+          onPointerdown: l[0] || (l[0] = H(() => {
+          }, ["stop"])),
           onClick: e
         }, null, 512)
       ], 2)) : I("", !0);
     };
   }
-}), P = _e("comment"), [re, ze] = Ce("Comment"), co = /* @__PURE__ */ w({
+}), k = _e("comment"), [re, ze] = Re("Comment"), io = /* @__PURE__ */ A({
   ...z("Comment"),
   __name: "Comment",
   props: {
@@ -138,17 +139,17 @@ const Ae = /* @__PURE__ */ w({
   },
   emits: ["update:open", "openActions", "reaction", "reply", "openReaction"],
   setup(u, { emit: s }) {
-    U("comment", K);
-    const t = u, e = q(), d = s, i = ee(t, "open", d, {
+    K("comment", N);
+    const t = u, e = J(), d = s, a = oe(t, "open", d, {
       passive: t.open === void 0
     }), l = () => {
       var g;
       let r;
       const h = (g = e.author) == null ? void 0 : g.call(e, {});
-      return !O(h) ? r = h : r = t.author, r ? B(
+      return !O(h) ? r = h : r = t.author, r ? b(
         "div",
         {
-          class: C(m(P, "author"), t.authorCls)
+          class: C(m(k, "author"), t.authorCls)
         },
         r
       ) : null;
@@ -156,10 +157,10 @@ const Ae = /* @__PURE__ */ w({
       var g;
       let r;
       const h = (g = e.datetime) == null ? void 0 : g.call(e, {});
-      return !O(h) ? r = h : r = t.datetime, r ? B(
+      return !O(h) ? r = h : r = t.datetime, r ? b(
         "div",
         {
-          class: C(m(P, "datetime"), t.datetimeCls)
+          class: C(m(k, "datetime"), t.datetimeCls)
         },
         r
       ) : null;
@@ -170,50 +171,50 @@ const Ae = /* @__PURE__ */ w({
       if (h) c = r;
       else {
         c = [];
-        const k = (_ = e.avatar) == null ? void 0 : _.call(e, {});
-        !O(k) ? c.push(k) : t.avatar && c.push(B(le, { ...t.avatarProps ?? {}, src: t.avatar }));
-        const S = l(), D = p();
-        (S || D) && c.push(
-          B(
+        const B = (_ = e.avatar) == null ? void 0 : _.call(e, {});
+        !O(B) ? c.push(B) : t.avatar && c.push(b(le, { ...t.avatarProps ?? {}, src: t.avatar }));
+        const S = l(), w = p();
+        (S || w) && c.push(
+          b(
             "div",
             {
-              class: C(m(P, "header__content"), t.headerContentCls)
+              class: C(m(k, "header__content"), t.headerContentCls)
             },
-            [S, D]
+            [S, w]
           )
         ), c.length || (c = void 0);
       }
-      return c ? (c.push(B(Ae)), B(
+      return c ? (c.push(b(De)), b(
         "div",
-        { class: C(m(P, "header"), t.headerCls) },
+        { class: C(m(k, "header"), t.headerCls) },
         c
       )) : null;
     }, v = () => {
       var c;
       const r = (c = e.content) == null ? void 0 : c.call(e, {}), h = !O(r);
       if (h || t.content)
-        return B(
+        return b(
           "div",
           {
-            class: C(m(P, "content"), t.contentCls, "paragraph"),
+            class: C(m(k, "content"), t.contentCls, "paragraph"),
             innerHTML: h ? void 0 : t.content
           },
           h ? r : void 0
         );
-    }, f = m(P, "replies"), x = ge(f, {
+    }, f = m(k, "replies"), x = ge(f, {
       variants: {
         open: Be("open", f)
       }
     }), M = () => {
       var _;
       const r = (_ = e.replies) == null ? void 0 : _.call(e, {}), h = !O(r), c = () => {
-        var S, D, V;
-        const k = (S = e.repliesHeader) == null ? void 0 : S.call(e, { open: !!i.value }), a = [];
-        if (!O(k))
-          a.push(k);
+        var S, w, j;
+        const B = (S = e.repliesHeader) == null ? void 0 : S.call(e, { open: !!a.value }), i = [];
+        if (!O(B))
+          i.push(B);
         else {
-          a.push(
-            B(
+          i.push(
+            b(
               ve,
               {
                 size: "xsm",
@@ -221,7 +222,7 @@ const Ae = /* @__PURE__ */ w({
                 br: "transparent"
               },
               {
-                default: () => B(Y, {
+                default: () => b(Z, {
                   icon: "tabler:chevron-down",
                   class: m(f, "icon"),
                   size: "2xsm"
@@ -229,18 +230,18 @@ const Ae = /* @__PURE__ */ w({
               }
             )
           );
-          const oe = (D = e.repliesCount) == null ? void 0 : D.call(e, {}), pe = !O(oe), te = (V = e.repliesTitle) == null ? void 0 : V.call(e, {}), ce = !O(te);
-          let J;
-          ce ? J = te : J = t.repliesTitle, a.push(
-            B(
+          const te = (w = e.repliesCount) == null ? void 0 : w.call(e, {}), pe = !O(te), ne = (j = e.repliesTitle) == null ? void 0 : j.call(e, {}), ce = !O(ne);
+          let X;
+          ce ? X = ne : X = t.repliesTitle, i.push(
+            b(
               "div",
               {
                 class: C(m(f, "title"), t.repliesTitleCls)
               },
-              J
+              X
             )
-          ), (pe || t.repliesCount) && a.push(
-            B(
+          ), (pe || t.repliesCount) && i.push(
+            b(
               ye,
               {
                 color: "primary-subtle",
@@ -248,42 +249,42 @@ const Ae = /* @__PURE__ */ w({
                 size: "xsm"
               },
               {
-                text: () => oe
+                text: () => te
               }
             )
           );
         }
-        return B(
+        return b(
           "div",
           {
             class: C(m(f, "header"), t.repliesHeaderCls),
             onClick: () => {
-              i.value = !i.value;
+              a.value = !a.value;
             }
           },
-          a
+          i
         );
       }, g = () => {
-        if (i.value)
+        if (a.value)
           return [
-            B(
+            b(
               "div",
               {
                 class: C(m(f, "content"), t.repliesContentCls)
               },
               r
             ),
-            B("div", {
+            b("div", {
               class: m(f, "line")
             })
           ];
       };
-      return h ? B(
+      return h ? b(
         "div",
         {
           class: C(
             x({
-              open: !!i.value
+              open: !!a.value
             }),
             t.repliesCls
           )
@@ -295,20 +296,20 @@ const Ae = /* @__PURE__ */ w({
       emit: d,
       props: t,
       slots: e
-    }), (r, h) => (R(), j("div", {
-      class: $(n(C)(n(P), t.class))
+    }), (r, h) => (P(), F("div", {
+      class: $(n(C)(n(k), t.class))
     }, [
       y(o),
-      N("div", {
-        class: $(n(C)(n(m)(n(P), "body"), t.bodyCls))
+      G("div", {
+        class: $(n(C)(n(m)(n(k), "body"), t.bodyCls))
       }, [
         y(v),
-        y(we),
+        y(Ae),
         y(M)
       ], 2)
     ], 2));
   }
-}), uo = /* @__PURE__ */ w({
+}), ao = /* @__PURE__ */ A({
   ...z("CommentAction"),
   __name: "CommentAction",
   props: {
@@ -354,45 +355,45 @@ const Ae = /* @__PURE__ */ w({
   },
   emits: ["edit", "delete", "update:open"],
   setup(u, { emit: s }) {
-    U("comment", K);
+    K("comment", N);
     const t = u, e = s, d = () => {
       e("edit"), l.value = !1;
-    }, i = () => {
+    }, a = () => {
       e("delete"), l.value = !1;
-    }, l = ee(t, "open", e, {
+    }, l = oe(t, "open", e, {
       passive: t.open === void 0
     });
-    return (p, o) => (R(), E(n(Re), H(t, {
+    return (p, o) => (P(), E(n(Pe), V(t, {
       open: n(l),
-      "onUpdate:open": o[0] || (o[0] = (v) => ie(l) ? l.value = v : null),
+      "onUpdate:open": o[0] || (o[0] = (v) => ae(l) ? l.value = v : null),
       placement: "bottom-end",
       sideOffset: 3,
       openDelay: 0
     }), {
       content: T(() => [
-        y(Se, { style: { width: "116px" } }, {
+        y(Se, { style: { width: "114px" } }, {
           default: T(() => [
-            p.hasEdit ? (R(), E(se, {
+            p.hasEdit ? (P(), E(se, {
               key: "edit",
               title: p.editText,
               onClick: d
             }, {
               leading: T(({ iconSize: v }) => [
-                y(Y, {
+                y(Z, {
                   icon: "tabler:edit",
                   size: v
                 }, null, 8, ["size"])
               ]),
               _: 1
             }, 8, ["title"])) : I("", !0),
-            p.hasDelete ? (R(), E(se, {
+            p.hasDelete ? (P(), E(se, {
               key: "delete",
               title: p.deleteText,
               danger: "",
-              onClick: i
+              onClick: a
             }, {
               leading: T(({ iconSize: v }) => [
-                y(Y, {
+                y(Z, {
                   icon: "tabler:trash",
                   size: v
                 }, null, 8, ["size"])
@@ -406,7 +407,7 @@ const Ae = /* @__PURE__ */ w({
       _: 1
     }, 16, ["open"]));
   }
-}), mo = /* @__PURE__ */ w({
+}), lo = /* @__PURE__ */ A({
   ...z("CommentReaction"),
   __name: "CommentReaction",
   props: {
@@ -449,13 +450,13 @@ const Ae = /* @__PURE__ */ w({
   },
   emits: ["reaction", "update:open"],
   setup(u, { emit: s }) {
-    U("comment", K);
+    K("comment", N);
     const t = u, e = s, d = (l) => {
-      e("reaction", l.value), i.value = !1;
-    }, i = ee(t, "open", e, {
+      e("reaction", l.value), a.value = !1;
+    }, a = oe(t, "open", e, {
       passive: t.open === void 0
     });
-    return (l, p) => (R(), E(n(Pe), H(t, {
+    return (l, p) => (P(), E(n(ke), V(t, {
       noTrigger: "",
       hideClear: "",
       hideGroup: "",
@@ -470,11 +471,11 @@ const Ae = /* @__PURE__ */ w({
       visibleColorPickers: [],
       noModel: "",
       onSelect: d,
-      open: n(i),
-      "onUpdate:open": p[0] || (p[0] = (o) => ie(i) ? i.value = o : null)
+      open: n(a),
+      "onUpdate:open": p[0] || (p[0] = (o) => ae(a) ? a.value = o : null)
     }), null, 16, ["popoverProps", "open"]));
   }
-}), fo = /* @__PURE__ */ w({
+}), ro = /* @__PURE__ */ A({
   ...z("CommentMention"),
   __name: "CommentMention",
   props: {
@@ -567,23 +568,24 @@ const Ae = /* @__PURE__ */ w({
   },
   emits: ["mention"],
   setup(u, { emit: s }) {
-    const t = u, e = s, d = q(), i = (l, p, o) => {
+    const t = u, e = s, d = J(), a = (l, p, o) => {
       e("mention", l, o);
     };
-    return (l, p) => (R(), E(n(ke), H(t, {
+    return (l, p) => (P(), E(n(xe), V(t, {
       modelValue: "",
-      onSelect: i,
-      noTrigger: ""
-    }), Z({ _: 2 }, [
-      Q(Object.keys(d), (o) => ({
+      onSelect: a,
+      noTrigger: "",
+      popupWidth: 200
+    }), ee({ _: 2 }, [
+      q(Object.keys(d), (o) => ({
         name: o,
         fn: T((v) => [
-          L(l.$slots, o, G(W(v)))
+          U(l.$slots, o, W(Q(v)))
         ])
       }))
     ]), 1040));
   }
-}), ho = /* @__PURE__ */ w({
+}), po = /* @__PURE__ */ A({
   ...z("CommentEditor"),
   __name: "CommentEditor",
   props: {
@@ -599,70 +601,72 @@ const Ae = /* @__PURE__ */ w({
   },
   emits: ["openReaction", "openMention", "blur", "focus", "mention", "submit"],
   setup(u, { emit: s }) {
-    U("comment", K);
-    const t = q(), e = u, d = s, i = m(P, "editor"), l = b(), p = () => {
+    K("comment", N);
+    const t = J(), e = u, d = s, a = m(k, "editor"), l = R(), p = () => {
       d("openReaction", l.value);
-    }, o = b(), v = () => {
+    }, o = R(), v = () => {
       d("openMention", o.value);
-    }, { getDisabled: f } = Te(), { rootBindings: x, inputBindings: M } = Oe({
+    }, { getDisabled: f } = he(), { rootBindings: x, inputBindings: M } = Ce({
       getDisabled: () => f.value,
       emit: d
-    }), r = () => d("submit"), h = F(() => {
+    }), r = () => d("submit"), h = L(() => {
       if (Number(e.maxHeight) > 0)
         return `${e.maxHeight}px`;
       if (typeof e.maxHeight == "string")
         return e.maxHeight;
-    }), c = b(), g = (_) => {
-      var k;
-      (k = c.value) != null && k.addFiles && _.length && c.value.addFiles(_);
+    }), c = R(), g = (_) => {
+      var B;
+      (B = c.value) != null && B.addFiles && _.length && c.value.addFiles(_);
     };
-    return (_, k) => (R(), j("div", H({
-      class: n(C)(n(i), e.class)
+    return (_, B) => (P(), F("div", V({
+      class: n(C)(n(a), e.class)
     }, n(x)), [
-      y($e, {
+      y(Oe, {
         overlay: !1,
         hasMask: !1,
-        class: $(n(C)(n(m)(n(i), "editor"), "paragraph", e.editorCls)),
+        class: $(n(C)(n(m)(n(a), "editor"), "paragraph", e.editorCls)),
         style: ue({ maxHeight: h.value })
       }, {
         default: T(() => [
-          L(_.$slots, "default", G(W(n(M))))
+          U(_.$slots, "default", W(Q(n(M))))
         ]),
         _: 3
       }, 8, ["class", "style"]),
-      y(Ee, H({ noTrigger: "" }, _.uploadProps, {
+      y($e, V({ noTrigger: "" }, _.uploadProps, {
         ref_key: "uploadRef",
         ref: c
-      }), Z({ _: 2 }, [
-        Q(Object.keys(n(he)(t, ["default"])), (a) => ({
-          name: a,
+      }), ee({ _: 2 }, [
+        q(Object.keys(n(Me)(t, ["default"])), (i) => ({
+          name: i,
           fn: T((S) => [
-            L(_.$slots, a, G(W(S)))
+            U(_.$slots, i, W(Q(S)))
           ])
         }))
       ]), 1040),
-      N("div", {
-        class: $(n(C)(n(m)(n(i), "footer"), e.footerCls))
+      G("div", {
+        class: $(n(C)(n(m)(n(a), "footer"), e.footerCls))
       }, [
-        y(xe),
-        N("div", {
-          class: $(n(C)(n(m)(n(i), "actions"), e.actionsCls))
+        y(Te),
+        G("div", {
+          class: $(n(C)(n(m)(n(a), "actions"), e.actionsCls))
         }, [
-          y(A, {
+          y(D, {
             icon: "tabler:at",
             color: "neutral",
             type: "ghost",
             ref_key: "mentionRef",
             ref: o,
+            onPointerdown: B[0] || (B[0] = H(() => {
+            }, ["stop"])),
             onClick: v
           }, null, 512),
-          y(Me, {
+          y(Ee, {
             accept: "image/*",
             multiple: "",
             onAddFiles: g
           }, {
             default: T(() => [
-              y(A, {
+              y(D, {
                 icon: "tabler:photo",
                 color: "neutral",
                 type: "ghost"
@@ -670,16 +674,18 @@ const Ae = /* @__PURE__ */ w({
             ]),
             _: 1
           }),
-          y(A, {
+          y(D, {
             icon: "tabler:mood-plus",
             color: "neutral",
             type: "ghost",
             ref_key: "reactionRef",
             ref: l,
+            onPointerdown: B[1] || (B[1] = H(() => {
+            }, ["stop"])),
             onClick: p
           }, null, 512)
         ], 2),
-        y(A, {
+        y(D, {
           disabled: _.isEmpty,
           icon: "tabler:arrow-up",
           onClick: r
@@ -687,7 +693,7 @@ const Ae = /* @__PURE__ */ w({
       ], 2)
     ], 16));
   }
-}), Ie = ["tabindex", "disabled"], Co = /* @__PURE__ */ w({
+}), Ie = ["tabindex", "disabled"], co = /* @__PURE__ */ A({
   ...z("CommentTrigger"),
   __name: "CommentTrigger",
   props: {
@@ -702,8 +708,8 @@ const Ae = /* @__PURE__ */ w({
   },
   emits: ["add"],
   setup(u, { emit: s }) {
-    U("comment", K);
-    const t = q(), e = u, d = s, i = m(P, "trigger"), l = (o) => {
+    K("comment", N);
+    const t = J(), e = u, d = s, a = m(k, "trigger"), l = (o) => {
       !e.ignoeShortcut && o.code === "KeyC" && o.altKey && p(o);
     };
     me(() => {
@@ -712,32 +718,32 @@ const Ae = /* @__PURE__ */ w({
       e.withShortcut && removeEventListener("keyup", l);
     }), e.withShortcut;
     const p = (o) => d("add", o);
-    return (o, v) => (R(), j("div", {
-      class: $(n(C)(n(i), e.class)),
+    return (o, v) => (P(), F("div", {
+      class: $(n(C)(n(a), e.class)),
       tabindex: o.disabled ? -1 : 0,
       disabled: o.disabled ? "" : void 0,
-      onPointerdown: ne(p, ["stop"]),
-      onKeyup: ne(p, ["stop"])
+      onPointerdown: H(p, ["stop"]),
+      onKeyup: H(p, ["stop"])
     }, [
-      y(le, H(o.avatarProps ?? {}, {
+      y(le, V(o.avatarProps ?? {}, {
         size: "sm",
         src: o.src
-      }), Z({ _: 2 }, [
-        Q(Object.keys(t), (f) => ({
+      }), ee({ _: 2 }, [
+        q(Object.keys(t), (f) => ({
           name: f,
           fn: T((x) => [
-            L(o.$slots, f, G(W(x)))
+            U(o.$slots, f, W(Q(x)))
           ])
         }))
       ]), 1040, ["src"]),
-      N("div", {
-        class: $(n(m)(n(i), "text"))
+      G("div", {
+        class: $(n(m)(n(a), "text"))
       }, [
-        L(o.$slots, "text", {}, () => [
-          ae(X(o.text), 1)
+        U(o.$slots, "text", {}, () => [
+          ie(Y(o.text), 1)
         ])
       ], 2),
-      y(De, H(o.shortcutProps ?? {}, { items: [
+      y(we, V(o.shortcutProps ?? {}, { items: [
         {
           text: "Alt"
         },
@@ -747,58 +753,58 @@ const Ae = /* @__PURE__ */ w({
       ] }), null, 16)
     ], 42, Ie));
   }
-}), yo = (u) => {
-  const s = b(!1), t = b(), e = b(!1), d = (a, S = !1) => {
-    s.value = !0, e.value = S, t.value = a;
-  }, i = b(!1), l = b(), p = (a) => {
-    i.value = !0, l.value = a;
-  }, o = F(() => ({
+}), uo = (u) => {
+  const s = R(!1), t = R(), e = R(!1), d = (i, S = !1) => {
+    s.value = !0, e.value = S, t.value = i;
+  }, a = R(!1), l = R(), p = (i) => {
+    a.value = !0, l.value = i;
+  }, o = L(() => ({
     open: s.value,
     reference: t.value,
-    "onUpdate:open": (a) => s.value = a,
-    onReaction: (a) => {
-      var S, D;
+    "onUpdate:open": (i) => s.value = i,
+    onReaction: (i) => {
+      var S, w;
       if (e.value)
         try {
-          (S = u.addEmoji) == null || S.call(u, a);
-        } catch (V) {
-          console.log("error on reaction ===>", V);
+          (S = u.addEmoji) == null || S.call(u, i);
+        } catch (j) {
+          console.log("error on reaction ===>", j);
         }
       try {
-        (D = u.onReaction) == null || D.call(u, a);
-      } catch (V) {
-        console.log("error on reaction ===>", V);
+        (w = u.onReaction) == null || w.call(u, i);
+      } catch (j) {
+        console.log("error on reaction ===>", j);
       }
     }
-  })), v = F(() => ({
-    open: i.value,
+  })), v = L(() => ({
+    open: a.value,
     reference: l.value,
-    "onUpdate:open": (a) => i.value = a
-  })), f = b(!1), x = b(), M = b(), r = b(!1), h = F(() => ({
+    "onUpdate:open": (i) => a.value = i
+  })), f = R(!1), x = R(), M = R(), r = R(!1), h = L(() => ({
     open: f.value,
-    "onUpdate:open": (a) => f.value = a,
+    "onUpdate:open": (i) => f.value = i,
     search: x.value,
-    "onUpdate:search": (a) => x.value = a,
+    "onUpdate:search": (i) => x.value = i,
     reference: M.value,
     headerSearch: r.value,
     onPointerDownOutside: g,
     onEscapeKeyDown: g
-  })), c = (a) => {
-    a && (M.value = { getBoundingClientRect: a }, f.value = !0, r.value = !1);
+  })), c = (i) => {
+    i && (M.value = { getBoundingClientRect: i }, f.value = !0, r.value = !1);
   }, g = () => {
     M.value = void 0, f.value = !1, x.value = void 0;
-  }, _ = (a) => {
-    x.value = a;
-  }, k = F(() => ({
-    onOpenReaction: (a) => d(a, !0),
-    onOpenMention: (a) => {
-      a && (M.value = a, f.value = !0, r.value = !0);
+  }, _ = (i) => {
+    x.value = i;
+  }, B = L(() => ({
+    onOpenReaction: (i) => d(i, !0),
+    onOpenMention: (i) => {
+      i && (M.value = i, f.value = !0, r.value = !0);
     }
   }));
   return {
     reactionBinding: o,
     actionBinding: v,
-    editorBinding: k,
+    editorBinding: B,
     mentionBinding: h,
     openActions: p,
     openReaction: d,
@@ -808,14 +814,14 @@ const Ae = /* @__PURE__ */ w({
   };
 };
 export {
-  co as Comment,
-  uo as CommentAction,
-  ho as CommentEditor,
-  fo as CommentMention,
-  mo as CommentReaction,
-  Co as CommentTrigger,
-  P as commentPrefix,
+  io as Comment,
+  ao as CommentAction,
+  po as CommentEditor,
+  ro as CommentMention,
+  lo as CommentReaction,
+  co as CommentTrigger,
+  k as commentPrefix,
   re as injectCommentContext,
   ze as provideCommentContext,
-  yo as useComment
+  uo as useComment
 };