@pantograph/vue 0.28.1 → 0.28.2

package/dist/Comment/index.js

@@ -1,39 +1,38 @@
-import { defineComponent as D, ref as v, createElementBlock as F, createCommentVNode as A, unref as n, openBlock as R, normalizeClass as E, createBlock as M, withModifiers as I, createVNode as y, Fragment as pe, renderList as Q, withCtx as O, createTextVNode as ne, toDisplayString as X, useSlots as q, createElementVNode as G, h as b, mergeProps as V, isRef as se, createSlots as Z, renderSlot as K, normalizeProps as N, guardReactiveProps as W, computed as U, normalizeStyle as ce, onMounted as de, onBeforeUnmount as ue } from "vue";
-import { getComponentOptions as z, useVModel as ee, isEmptyElement as $, useFormInput as me, useInputDataStates as fe } from "@pantograph/utils-vue";
-import { _ as ie } from "../Avatar.vue_vue_type_style_index_0_lang-D_SXlwkT.js";
-import { _ as Ce } from "../Badge.vue_vue_type_script_setup_true_lang-C1_SBsMO.js";
-import { cva as he } from "class-variance-authority";
-import { _ as ye } from "../GraphicalObject.vue_vue_type_script_setup_true_lang-CeT1O_S8.js";
-import { _ as Y } from "../Icon.vue_vue_type_style_index_0_lang-DPe3mUfh.js";
-import { normCls as h, getBemElement as C, getBemBlock as ge, generateVariantClassList as ve, getPxSize as _e } from "@pantograph/utils";
-import { _ as w } from "../IconButton.vue_vue_type_script_setup_true_lang-BUIJKHGa.js";
-import { _ as Be } from "../ActionButton.vue_vue_type_script_setup_true_lang-C0xZ6m49.js";
-import { createContext as be } from "reka-ui";
-import { _ as Re } from "../Popover.vue_vue_type_style_index_0_lang-CpPisJIC.js";
-import { _ as Pe, a as te } from "../MenuItem.vue_vue_type_style_index_0_lang-DD8kfks-.js";
-import { _ as Se } from "../GOPicker.vue_vue_type_style_index_0_lang-BYuk9Ta8.js";
-import { _ as ke } from "../Combobox.vue_vue_type_style_index_0_lang-R4jyjKx0.js";
-import { _ as xe } from "../Divider.vue_vue_type_style_index_0_lang-Clrzj4R0.js";
-import { _ as Te } from "../ScrollContainer.vue_vue_type_style_index_0_lang-uN8OhXm4.js";
-import { _ as Oe, a as $e } from "../Upload.vue_vue_type_style_index_0_lang-zNnaGyQW.js";
-import { omit as Ee } from "es-toolkit";
-import { _ as Me } from "../Shortcut.vue_vue_type_style_index_0_lang-zXjU0WmT.js";
-const we = /* @__PURE__ */ D({
-  ...z("CommentActions"),
+import { defineComponent as E, ref as v, createElementBlock as j, createCommentVNode as z, unref as n, openBlock as B, normalizeClass as $, createBlock as x, withModifiers as L, createVNode as g, Fragment as ue, renderList as J, withCtx as O, createTextVNode as se, toDisplayString as Q, h as _, useSlots as N, createElementVNode as G, mergeProps as V, isRef as le, createSlots as ie, renderSlot as K, normalizeProps as X, guardReactiveProps as Y, computed as U, normalizeStyle as me, onMounted as fe, onBeforeUnmount as Ce } from "vue";
+import { getComponentOptions as M, useVModel as Z, isEmptyElement as T, useFormInput as he, useInputDataStates as ye } from "@pantograph/utils-vue";
+import { _ as ae } from "../Avatar.vue_vue_type_style_index_0_lang-BKqLMGIV.js";
+import { _ as ge } from "../Badge.vue_vue_type_script_setup_true_lang-C1_SBsMO.js";
+import { cva as ve } from "class-variance-authority";
+import { _ as _e } from "../GraphicalObject.vue_vue_type_script_setup_true_lang-CeT1O_S8.js";
+import { _ as q } from "../Icon.vue_vue_type_style_index_0_lang-DPe3mUfh.js";
+import { normCls as y, getBemElement as h, getBemBlock as Be, generateVariantClassList as be, getPxSize as Re } from "@pantograph/utils";
+import { _ as A } from "../IconButton.vue_vue_type_script_setup_true_lang-BmqsHwgy.js";
+import { _ as Pe } from "../ActionButton.vue_vue_type_script_setup_true_lang-B58mCIDb.js";
+import { a as Se, b as ke } from "../Upload.vue_vue_type_style_index_0_lang-DQiIPST1.js";
+import { createContext as xe } from "reka-ui";
+import { _ as Te } from "../Popover.vue_vue_type_style_index_0_lang-CpPisJIC.js";
+import { _ as Oe, a as ne } from "../MenuItem.vue_vue_type_style_index_0_lang-CW-70qfj.js";
+import { _ as $e } from "../GOPicker.vue_vue_type_style_index_0_lang-nrryxeQq.js";
+import { _ as Ee } from "../Combobox.vue_vue_type_style_index_0_lang-Dz3b5KT0.js";
+import { _ as Me } from "../Divider.vue_vue_type_style_index_0_lang-Clrzj4R0.js";
+import { _ as we } from "../ScrollContainer.vue_vue_type_style_index_0_lang-CzUFQ8vU.js";
+import { _ as De } from "../Shortcut.vue_vue_type_style_index_0_lang-zXjU0WmT.js";
+const ze = /* @__PURE__ */ E({
+  ...M("CommentActions"),
   __name: "CommentActions",
-  setup(m) {
-    const s = ae(), t = v(), e = v(), u = () => {
+  setup(u) {
+    const s = ee(), t = v(), e = v(), p = () => {
       s.emit("openActions", e.value);
-    }, i = () => {
-      s.emit("openReaction", t.value);
     }, l = () => {
+      s.emit("openReaction", t.value);
+    }, i = () => {
       s.emit("reply");
     };
-    return (p, o) => n(s).props.hasReaction || n(s).props.hasEdit || n(s).props.hasDelete ? (R(), F("div", {
+    return (c, o) => n(s).props.hasReaction || n(s).props.hasEdit || n(s).props.hasDelete ? (B(), j("div", {
       key: 0,
-      class: E(n(h)(n(C)(n(k), "actions"), n(s).props.actionsCls))
+      class: $(n(y)(n(h)(n(P), "actions"), n(s).props.actionsCls))
     }, [
-      n(s).props.hasReply ? (R(), M(w, {
+      n(s).props.hasReply ? (B(), x(A, {
         key: 0,
         icon: "tabler:corner-up-left",
         color: "neutral",
@@ -41,72 +40,97 @@ const we = /* @__PURE__ */ D({
         ref_key: "reactionRef",
         ref: t,
         flipOnDir: "rtl",
-        onClick: l
-      }, null, 512)) : A("", !0),
-      n(s).props.hasReaction ? (R(), M(w, {
+        onClick: i
+      }, null, 512)) : z("", !0),
+      n(s).props.hasReaction ? (B(), x(A, {
         key: 1,
         icon: "tabler:mood-plus",
         color: "neutral",
         type: "ghost",
         ref_key: "reactionRef",
         ref: t,
-        onPointerdown: o[0] || (o[0] = I(() => {
+        onPointerdown: o[0] || (o[0] = L(() => {
         }, ["stop"])),
-        onClick: i
-      }, null, 512)) : A("", !0),
-      n(s).props.hasEdit || n(s).props.hasDelete ? (R(), M(w, {
+        onClick: l
+      }, null, 512)) : z("", !0),
+      n(s).props.hasEdit || n(s).props.hasDelete ? (B(), x(A, {
         key: 2,
         icon: "tabler:dots-vertical",
         color: "neutral",
         type: "ghost",
         ref_key: "actionRef",
         ref: e,
-        onPointerdown: o[1] || (o[1] = I(() => {
+        onPointerdown: o[1] || (o[1] = L(() => {
         }, ["stop"])),
-        onClick: u
-      }, null, 512)) : A("", !0)
-    ], 2)) : A("", !0);
+        onClick: p
+      }, null, 512)) : z("", !0)
+    ], 2)) : z("", !0);
   }
-}), De = /* @__PURE__ */ D({
-  ...z("CommentReactions"),
+}), Ae = /* @__PURE__ */ E({
+  ...M("CommentReactions"),
   __name: "CommentReactions",
-  setup(m) {
-    const s = ae(), t = v(), e = () => {
+  setup(u) {
+    const s = ee(), t = v(), e = () => {
       s.emit("openReaction", t.value);
-    }, u = (i) => {
-      i && s.emit("reaction", i);
+    }, p = (l) => {
+      l && s.emit("reaction", l);
     };
-    return (i, l) => {
-      var p;
-      return n(s).props.hasReaction && ((p = n(s).props.reactions) != null && p.some((o) => o.count && o.emoji)) ? (R(), F("div", {
+    return (l, i) => {
+      var c;
+      return n(s).props.hasReaction && ((c = n(s).props.reactions) != null && c.some((o) => o.count && o.emoji)) ? (B(), j("div", {
         key: 0,
-        class: E(n(h)(n(C)(n(k), "reactions"), n(s).props.reactionsCls))
+        class: $(n(y)(n(h)(n(P), "reactions"), n(s).props.reactionsCls))
       }, [
-        (R(!0), F(pe, null, Q(n(s).props.reactions, (o) => (R(), M(Be, {
+        (B(!0), j(ue, null, J(n(s).props.reactions, (o) => (B(), x(Pe, {
           key: o == null ? void 0 : o.emoji,
           active: o == null ? void 0 : o.active,
-          onClick: (_) => u(o)
+          onClick: (b) => p(o)
         }, {
           default: O(() => [
-            ne(X(o == null ? void 0 : o.emoji) + " " + X(o == null ? void 0 : o.count), 1)
+            se(Q(o == null ? void 0 : o.emoji) + " " + Q(o == null ? void 0 : o.count), 1)
           ]),
           _: 2
         }, 1032, ["active", "onClick"]))), 128)),
-        y(w, {
+        g(A, {
           icon: "tabler:mood-plus",
           color: "neutral",
           type: "outline",
           ref_key: "reactionRef",
           ref: t,
-          onPointerdown: l[0] || (l[0] = I(() => {
+          onPointerdown: i[0] || (i[0] = L(() => {
           }, ["stop"])),
           onClick: e
         }, null, 512)
-      ], 2)) : A("", !0);
+      ], 2)) : z("", !0);
+    };
+  }
+}), re = /* @__PURE__ */ E({
+  ...M("CommentFileList"),
+  __name: "CommentFileList",
+  setup(u) {
+    const s = ee(), t = () => {
+      var e;
+      return _(
+        Se,
+        {
+          ...s.props.uploadProps ?? {},
+          ref: s.fileListRef,
+          listType: "card",
+          fileListCls: y(
+            h(P, "file_list"),
+            (e = s.props.uploadProps) == null ? void 0 : e.fileListCls
+          )
+        },
+        s.slots
+      );
+    };
+    return (e, p) => {
+      var l, i;
+      return (i = (l = n(s).props.uploadProps) == null ? void 0 : l.fileList) != null && i.length ? (B(), x(t, { key: 0 })) : z("", !0);
     };
   }
-}), k = ge("comment"), [ae, ze] = be("Comment"), no = /* @__PURE__ */ D({
-  ...z("Comment"),
+}), P = Be("comment"), [ee, pe] = xe("Comment"), no = /* @__PURE__ */ E({
+  ...M("Comment"),
   __name: "Comment",
   props: {
     class: {},
@@ -114,6 +138,7 @@ const we = /* @__PURE__ */ D({
     actionsCls: {},
     bodyCls: {},
     datetimeCls: {},
+    uploadProps: {},
     contentCls: {},
     authorCls: {},
     repliesCls: {},
@@ -137,178 +162,180 @@ const we = /* @__PURE__ */ D({
     reactions: {}
   },
   emits: ["update:open", "openActions", "reaction", "reply", "openReaction"],
-  setup(m, { emit: s }) {
-    const t = m, e = q(), u = s, i = ee(t, "open", u, {
+  setup(u, { emit: s }) {
+    const t = u, e = N(), p = s, l = Z(t, "open", p, {
       passive: t.open === void 0
-    }), l = () => {
-      var P;
+    }), i = () => {
+      var C;
       let r;
-      const f = (P = e.author) == null ? void 0 : P.call(e, {});
-      return !$(f) ? r = f : r = t.author, r ? b(
+      const m = (C = e.author) == null ? void 0 : C.call(e, {});
+      return !T(m) ? r = m : r = t.author, r ? _(
         "div",
         {
-          class: h(C(k, "author"), t.authorCls)
+          class: y(h(P, "author"), t.authorCls)
         },
         r
       ) : null;
-    }, p = () => {
-      var P;
+    }, c = () => {
+      var C;
       let r;
-      const f = (P = e.datetime) == null ? void 0 : P.call(e, {});
-      return !$(f) ? r = f : r = t.datetime, r ? b(
+      const m = (C = e.datetime) == null ? void 0 : C.call(e, {});
+      return !T(m) ? r = m : r = t.datetime, r ? _(
         "div",
         {
-          class: h(C(k, "datetime"), t.datetimeCls)
+          class: y(h(P, "datetime"), t.datetimeCls)
         },
         r
       ) : null;
     }, o = () => {
-      var P, g;
-      const r = (P = e.header) == null ? void 0 : P.call(e, {}), f = !$(r);
-      let d;
-      if (f) d = r;
+      var C, R;
+      const r = (C = e.header) == null ? void 0 : C.call(e, {}), m = !T(r);
+      let f;
+      if (m) f = r;
       else {
-        d = [];
-        const B = (g = e.avatar) == null ? void 0 : g.call(e, {});
-        !$(B) ? d.push(B) : t.avatar && d.push(b(ie, { ...t.avatarProps ?? {}, src: t.avatar }));
-        const a = l(), T = p();
-        (a || T) && d.push(
-          b(
+        f = [];
+        const I = (R = e.avatar) == null ? void 0 : R.call(e, {});
+        !T(I) ? f.push(I) : t.avatar && f.push(_(ae, { ...t.avatarProps ?? {}, src: t.avatar }));
+        const k = i(), D = c();
+        (k || D) && f.push(
+          _(
             "div",
             {
-              class: h(C(k, "header__content"), t.headerContentCls)
+              class: y(h(P, "header__content"), t.headerContentCls)
             },
-            [a, T]
+            [k, D]
           )
-        ), d.length || (d = void 0);
+        ), f.length || (f = void 0);
       }
-      return d ? (d.push(b(we)), b(
+      return f ? (f.push(_(ze)), _(
         "div",
-        { class: h(C(k, "header"), t.headerCls) },
-        d
+        { class: y(h(P, "header"), t.headerCls) },
+        f
       )) : null;
-    }, _ = () => {
-      var d;
-      const r = (d = e.content) == null ? void 0 : d.call(e, {}), f = !$(r);
-      if (f || t.content)
-        return b(
+    }, b = () => {
+      var f;
+      const r = (f = e.content) == null ? void 0 : f.call(e, {}), m = !T(r);
+      if (m || t.content)
+        return _(
           "div",
           {
-            class: h(C(k, "content"), t.contentCls, "paragraph"),
-            innerHTML: f ? void 0 : t.content
+            class: y(h(P, "content"), t.contentCls, "paragraph"),
+            innerHTML: m ? void 0 : t.content
           },
-          f ? r : void 0
+          m ? r : void 0
         );
-    }, c = C(k, "replies"), S = he(c, {
+    }, d = h(P, "replies"), S = ve(d, {
       variants: {
-        open: ve("open", c)
+        open: be("open", d)
       }
-    }), H = () => {
-      var g;
-      const r = (g = e.replies) == null ? void 0 : g.call(e, {}), f = !$(r), d = () => {
-        var a, T, L;
-        const B = (a = e.repliesHeader) == null ? void 0 : a.call(e, { open: !!i.value }), x = [];
-        if (!$(B))
-          x.push(B);
+    }), F = () => {
+      var R;
+      const r = (R = e.replies) == null ? void 0 : R.call(e, {}), m = !T(r), f = () => {
+        var k, D, H;
+        const I = (k = e.repliesHeader) == null ? void 0 : k.call(e, { open: !!l.value }), a = [];
+        if (!T(I))
+          a.push(I);
         else {
-          x.push(
-            b(
-              ye,
+          a.push(
+            _(
+              _e,
               {
                 size: "xsm",
                 bg: "transparent",
                 br: "transparent"
               },
               {
-                default: () => b(Y, {
+                default: () => _(q, {
                   icon: "tabler:chevron-down",
-                  class: C(c, "icon"),
+                  class: h(d, "icon"),
                   size: "2xsm"
                 })
               }
             )
           );
-          const j = (T = e.repliesCount) == null ? void 0 : T.call(e, {}), le = !$(j), oe = (L = e.repliesTitle) == null ? void 0 : L.call(e, {}), re = !$(oe);
-          let J;
-          re ? J = oe : J = t.repliesTitle, x.push(
-            b(
+          const oe = (D = e.repliesCount) == null ? void 0 : D.call(e, {}), ce = !T(oe), te = (H = e.repliesTitle) == null ? void 0 : H.call(e, {}), de = !T(te);
+          let W;
+          de ? W = te : W = t.repliesTitle, a.push(
+            _(
               "div",
               {
-                class: h(C(c, "title"), t.repliesTitleCls)
+                class: y(h(d, "title"), t.repliesTitleCls)
               },
-              J
+              W
             )
-          ), (le || t.repliesCount) && x.push(
-            b(
-              Ce,
+          ), (ce || t.repliesCount) && a.push(
+            _(
+              ge,
               {
                 color: "primary-subtle",
                 text: t.repliesCount,
                 size: "xsm"
               },
               {
-                text: () => j
+                text: () => oe
               }
             )
           );
         }
-        return b(
+        return _(
           "div",
           {
-            class: h(C(c, "header"), t.repliesHeaderCls),
+            class: y(h(d, "header"), t.repliesHeaderCls),
             onClick: () => {
-              i.value = !i.value;
+              l.value = !l.value;
             }
           },
-          x
+          a
         );
-      }, P = () => {
-        if (i.value)
+      }, C = () => {
+        if (l.value)
           return [
-            b(
+            _(
               "div",
               {
-                class: h(C(c, "content"), t.repliesContentCls)
+                class: y(h(d, "content"), t.repliesContentCls)
               },
               r
             ),
-            b("div", {
-              class: C(c, "line")
+            _("div", {
+              class: h(d, "line")
             })
           ];
       };
-      return f ? b(
+      return m ? _(
         "div",
         {
-          class: h(
+          class: y(
             S({
-              open: !!i.value
+              open: !!l.value
             }),
             t.repliesCls
           )
         },
-        [d(), P()]
+        [f(), C()]
       ) : null;
-    };
-    return ze({
-      emit: u,
+    }, w = v();
+    return pe({
+      emit: p,
       props: t,
-      slots: e
-    }), (r, f) => (R(), F("div", {
-      class: E(n(h)(n(k), t.class))
+      slots: e,
+      fileListRef: w
+    }), (r, m) => (B(), j("div", {
+      class: $(n(y)(n(P), t.class))
     }, [
-      y(o),
+      g(o),
       G("div", {
-        class: E(n(h)(n(C)(n(k), "body"), t.bodyCls))
+        class: $(n(y)(n(h)(n(P), "body"), t.bodyCls))
       }, [
-        y(_),
-        y(De),
-        y(H)
+        g(b),
+        g(re),
+        g(Ae),
+        g(F)
       ], 2)
     ], 2));
   }
-}), so = /* @__PURE__ */ D({
-  ...z("CommentAction"),
+}), so = /* @__PURE__ */ E({
+  ...M("CommentAction"),
   __name: "CommentAction",
   props: {
     hasEdit: { type: Boolean, default: !0 },
@@ -353,51 +380,51 @@ const we = /* @__PURE__ */ D({
     noTrigger: { type: Boolean }
   },
   emits: ["edit", "delete", "update:open"],
-  setup(m, { emit: s }) {
-    const t = m, e = s, u = () => {
-      e("edit"), l.value = !1;
-    }, i = () => {
-      e("delete"), l.value = !1;
-    }, l = ee(t, "open", e, {
+  setup(u, { emit: s }) {
+    const t = u, e = s, p = () => {
+      e("edit"), i.value = !1;
+    }, l = () => {
+      e("delete"), i.value = !1;
+    }, i = Z(t, "open", e, {
       passive: t.open === void 0
     });
-    return (p, o) => (R(), M(n(Re), V(t, {
-      open: n(l),
-      "onUpdate:open": o[0] || (o[0] = (_) => se(l) ? l.value = _ : null),
+    return (c, o) => (B(), x(n(Te), V(t, {
+      open: n(i),
+      "onUpdate:open": o[0] || (o[0] = (b) => le(i) ? i.value = b : null),
       placement: "bottom-end",
       sideOffset: 3,
       openDelay: 0
     }), {
       content: O(() => [
-        y(Pe, { style: { width: "114px" } }, {
+        g(Oe, { style: { width: "114px" } }, {
           default: O(() => [
-            p.hasEdit ? (R(), M(te, {
+            c.hasEdit ? (B(), x(ne, {
               key: "edit",
-              title: p.editText,
-              onClick: u
+              title: c.editText,
+              onClick: p
             }, {
-              leading: O(({ iconSize: _ }) => [
-                y(Y, {
+              leading: O(({ iconSize: b }) => [
+                g(q, {
                   icon: "tabler:edit",
-                  size: _
+                  size: b
                 }, null, 8, ["size"])
               ]),
               _: 1
-            }, 8, ["title"])) : A("", !0),
-            p.hasDelete ? (R(), M(te, {
+            }, 8, ["title"])) : z("", !0),
+            c.hasDelete ? (B(), x(ne, {
               key: "delete",
-              title: p.deleteText,
+              title: c.deleteText,
               danger: "",
-              onClick: i
+              onClick: l
             }, {
-              leading: O(({ iconSize: _ }) => [
-                y(Y, {
+              leading: O(({ iconSize: b }) => [
+                g(q, {
                   icon: "tabler:trash",
-                  size: _
+                  size: b
                 }, null, 8, ["size"])
               ]),
               _: 1
-            }, 8, ["title"])) : A("", !0)
+            }, 8, ["title"])) : z("", !0)
           ]),
           _: 1
         })
@@ -405,8 +432,8 @@ const we = /* @__PURE__ */ D({
       _: 1
     }, 16, ["open"]));
   }
-}), io = /* @__PURE__ */ D({
-  ...z("CommentReaction"),
+}), lo = /* @__PURE__ */ E({
+  ...M("CommentReaction"),
   __name: "CommentReaction",
   props: {
     reference: {},
@@ -447,13 +474,13 @@ const we = /* @__PURE__ */ D({
     resetColorsOnChangeType: {}
   },
   emits: ["reaction", "update:open"],
-  setup(m, { emit: s }) {
-    const t = m, e = s, u = (l) => {
-      e("reaction", l.value), i.value = !1;
-    }, i = ee(t, "open", e, {
+  setup(u, { emit: s }) {
+    const t = u, e = s, p = (i) => {
+      e("reaction", i.value), l.value = !1;
+    }, l = Z(t, "open", e, {
       passive: t.open === void 0
     });
-    return (l, p) => (R(), M(n(Se), V(t, {
+    return (i, c) => (B(), x(n($e), V(t, {
       noTrigger: "",
       hideClear: "",
       hideGroup: "",
@@ -461,19 +488,19 @@ const we = /* @__PURE__ */ D({
       hideRandom: "",
       group: "emoji",
       popoverProps: {
-        ...l.popoverProps ?? {},
-        reference: l.reference
+        ...i.popoverProps ?? {},
+        reference: i.reference
       },
       placement: "bottom-end",
       visibleColorPickers: [],
       noModel: "",
-      onSelect: u,
-      open: n(i),
-      "onUpdate:open": p[0] || (p[0] = (o) => se(i) ? i.value = o : null)
+      onSelect: p,
+      open: n(l),
+      "onUpdate:open": c[0] || (c[0] = (o) => le(l) ? l.value = o : null)
     }), null, 16, ["popoverProps", "open"]));
   }
-}), ao = /* @__PURE__ */ D({
-  ...z("CommentMention"),
+}), io = /* @__PURE__ */ E({
+  ...M("CommentMention"),
   __name: "CommentMention",
   props: {
     modelValue: {},
@@ -564,31 +591,31 @@ const we = /* @__PURE__ */ D({
     noTrigger: { type: Boolean }
   },
   emits: ["mention"],
-  setup(m, { expose: s, emit: t }) {
-    const e = m, u = t, i = q(), l = (o, _, c) => {
-      u("mention", o, c);
-    }, p = v();
+  setup(u, { expose: s, emit: t }) {
+    const e = u, p = t, l = N(), i = (o, b, d) => {
+      p("mention", o, d);
+    }, c = v();
     return s({
-      comboboxRef: p
-    }), (o, _) => (R(), M(n(ke), V({
+      comboboxRef: c
+    }), (o, b) => (B(), x(n(Ee), V({
       ref_key: "comboboxRef",
-      ref: p
+      ref: c
     }, e, {
       modelValue: "",
-      onSelect: l,
+      onSelect: i,
       noTrigger: "",
       popupWidth: 200
-    }), Z({ _: 2 }, [
-      Q(Object.keys(i), (c) => ({
-        name: c,
+    }), ie({ _: 2 }, [
+      J(Object.keys(l), (d) => ({
+        name: d,
         fn: O((S) => [
-          K(o.$slots, c, N(W(S)))
+          K(o.$slots, d, X(Y(S)))
         ])
       }))
     ]), 1040));
   }
-}), lo = /* @__PURE__ */ D({
-  ...z("CommentEditor"),
+}), ao = /* @__PURE__ */ E({
+  ...M("CommentEditor"),
   __name: "CommentEditor",
   props: {
     class: {},
@@ -602,95 +629,90 @@ const we = /* @__PURE__ */ D({
     maxHeight: { default: 100 }
   },
   emits: ["openReaction", "openMention", "blur", "focus", "mention", "submit"],
-  setup(m, { emit: s }) {
-    const t = q(), e = m, u = s, i = C(k, "editor"), l = v(), p = () => {
-      u("openReaction", l.value);
-    }, o = v(), _ = () => {
-      u("openMention", o.value);
-    }, { getDisabled: c } = me(), { rootBindings: S, inputBindings: H } = fe({
-      getDisabled: () => c.value,
-      emit: u
-    }), r = () => u("submit"), f = U(() => _e(e.maxHeight, !0)), d = v(), P = (g) => {
-      var B;
-      (B = d.value) != null && B.addFiles && g.length && d.value.addFiles(g);
+  setup(u, { emit: s }) {
+    const t = N(), e = u, p = s, l = h(P, "editor"), i = v(), c = () => {
+      p("openReaction", i.value);
+    }, o = v(), b = () => {
+      p("openMention", o.value);
+    }, { getDisabled: d } = he(), { rootBindings: S, inputBindings: F } = ye({
+      getDisabled: () => d.value,
+      emit: p
+    }), w = () => p("submit"), r = U(() => Re(e.maxHeight, !0)), m = v(), f = (C) => {
+      var R;
+      console.log("uploadRef.value ===>", m.value), (R = m.value) != null && R.addFiles && C.length && m.value.addFiles(C);
     };
-    return (g, B) => (R(), F("div", V({
-      class: n(h)(n(i), e.class)
+    return pe({
+      emit: p,
+      props: e,
+      slots: t,
+      fileListRef: m
+    }), (C, R) => (B(), j("div", V({
+      class: n(y)(n(l), e.class)
     }, n(S)), [
-      y(Te, {
+      g(we, {
         overlay: !1,
         hasMask: !1,
-        class: E(n(h)(n(C)(n(i), "editor"), "paragraph", e.editorCls)),
-        style: ce({ maxHeight: f.value })
+        class: $(n(y)(n(h)(n(l), "editor"), "paragraph", e.editorCls)),
+        style: me({ maxHeight: r.value })
       }, {
         default: O(() => [
-          K(g.$slots, "default", N(W(n(H))))
+          K(C.$slots, "default", X(Y(n(F))))
         ]),
         _: 3
       }, 8, ["class", "style"]),
-      y(Oe, V({ noTrigger: "" }, g.uploadProps, {
-        ref_key: "uploadRef",
-        ref: d
-      }), Z({ _: 2 }, [
-        Q(Object.keys(n(Ee)(t, ["default"])), (x) => ({
-          name: x,
-          fn: O((a) => [
-            K(g.$slots, x, N(W(a)))
-          ])
-        }))
-      ]), 1040),
+      g(re, V(C.uploadProps, { ref: "uploadRef" }), null, 16),
       G("div", {
-        class: E(n(h)(n(C)(n(i), "footer"), e.footerCls))
+        class: $(n(y)(n(h)(n(l), "footer"), e.footerCls))
       }, [
-        y(xe),
+        g(Me),
         G("div", {
-          class: E(n(h)(n(C)(n(i), "actions"), e.actionsCls))
+          class: $(n(y)(n(h)(n(l), "actions"), e.actionsCls))
         }, [
-          y(w, {
+          g(A, {
             icon: "tabler:at",
             color: "neutral",
             type: "ghost",
             ref_key: "mentionRef",
             ref: o,
-            onPointerdown: B[0] || (B[0] = I(() => {
+            onPointerdown: R[0] || (R[0] = L(() => {
             }, ["stop"])),
-            onClick: _
+            onClick: b
           }, null, 512),
-          y($e, {
+          g(ke, {
             accept: "image/*",
             multiple: "",
-            onAddFiles: P
+            onAddFiles: f
           }, {
             default: O(() => [
-              y(w, {
-                icon: "tabler:photo",
+              g(A, {
+                icon: "tabler:paperclip",
                 color: "neutral",
                 type: "ghost"
               })
             ]),
             _: 1
           }),
-          y(w, {
+          g(A, {
             icon: "tabler:mood-plus",
             color: "neutral",
             type: "ghost",
             ref_key: "reactionRef",
-            ref: l,
-            onPointerdown: B[1] || (B[1] = I(() => {
+            ref: i,
+            onPointerdown: R[1] || (R[1] = L(() => {
             }, ["stop"])),
-            onClick: p
+            onClick: c
           }, null, 512)
         ], 2),
-        y(w, {
-          disabled: g.isEmpty,
+        g(A, {
+          disabled: C.isEmpty,
           icon: "tabler:arrow-up",
-          onClick: r
+          onClick: w
         }, null, 8, ["disabled"])
       ], 2)
     ], 16));
   }
-}), Ae = ["tabindex", "disabled"], ro = /* @__PURE__ */ D({
-  ...z("CommentTrigger"),
+}), Ie = ["tabindex", "disabled"], ro = /* @__PURE__ */ E({
+  ...M("CommentTrigger"),
   __name: "CommentTrigger",
   props: {
     class: {},
@@ -703,42 +725,42 @@ const we = /* @__PURE__ */ D({
     shortcutProps: {}
   },
   emits: ["add"],
-  setup(m, { emit: s }) {
-    const t = q(), e = m, u = s, i = C(k, "trigger"), l = (o) => {
-      !e.ignoeShortcut && o.code === "KeyC" && o.altKey && p(o);
+  setup(u, { emit: s }) {
+    const t = N(), e = u, p = s, l = h(P, "trigger"), i = (o) => {
+      !e.ignoeShortcut && o.code === "KeyC" && o.altKey && c(o);
     };
-    de(() => {
-      e.withShortcut && addEventListener("keyup", l);
-    }), ue(() => {
-      e.withShortcut && removeEventListener("keyup", l);
+    fe(() => {
+      e.withShortcut && addEventListener("keyup", i);
+    }), Ce(() => {
+      e.withShortcut && removeEventListener("keyup", i);
     }), e.withShortcut;
-    const p = (o) => u("add", o);
-    return (o, _) => (R(), F("div", {
-      class: E(n(h)(n(i), e.class)),
+    const c = (o) => p("add", o);
+    return (o, b) => (B(), j("div", {
+      class: $(n(y)(n(l), e.class)),
       tabindex: o.disabled ? -1 : 0,
       disabled: o.disabled ? "" : void 0,
-      onPointerdown: I(p, ["stop"]),
-      onKeyup: I(p, ["stop"])
+      onPointerdown: L(c, ["stop"]),
+      onKeyup: L(c, ["stop"])
     }, [
-      y(ie, V(o.avatarProps ?? {}, {
+      g(ae, V(o.avatarProps ?? {}, {
         size: "sm",
         src: o.src
-      }), Z({ _: 2 }, [
-        Q(Object.keys(t), (c) => ({
-          name: c,
+      }), ie({ _: 2 }, [
+        J(Object.keys(t), (d) => ({
+          name: d,
           fn: O((S) => [
-            K(o.$slots, c, N(W(S)))
+            K(o.$slots, d, X(Y(S)))
           ])
         }))
       ]), 1040, ["src"]),
       G("div", {
-        class: E(n(C)(n(i), "text"))
+        class: $(n(h)(n(l), "text"))
       }, [
         K(o.$slots, "text", {}, () => [
-          ne(X(o.text), 1)
+          se(Q(o.text), 1)
         ])
       ], 2),
-      y(Me, V(o.shortcutProps ?? {}, { items: [
+      g(De, V(o.shortcutProps ?? {}, { items: [
         {
           text: "Alt"
         },
@@ -746,81 +768,81 @@ const we = /* @__PURE__ */ D({
           text: "C"
         }
       ] }), null, 16)
-    ], 42, Ae));
+    ], 42, Ie));
   }
-}), po = (m) => {
-  const s = v(!1), t = v(), e = v(!1), u = (a, T = !1) => {
-    s.value = !0, e.value = T, t.value = a;
-  }, i = v(!1), l = v(), p = (a) => {
-    i.value = !0, l.value = a;
+}), po = (u) => {
+  const s = v(!1), t = v(), e = v(!1), p = (a, k = !1) => {
+    s.value = !0, e.value = k, t.value = a;
+  }, l = v(!1), i = v(), c = (a) => {
+    l.value = !0, i.value = a;
   }, o = U(() => ({
     open: s.value,
     reference: t.value,
     "onUpdate:open": (a) => s.value = a,
     onReaction: (a) => {
-      var T, L;
+      var k, D;
       if (e.value)
         try {
-          (T = m.addEmoji) == null || T.call(m, a);
-        } catch (j) {
-          console.log("error on reaction ===>", j);
+          (k = u.addEmoji) == null || k.call(u, a);
+        } catch (H) {
+          console.log("error on reaction ===>", H);
         }
       try {
-        (L = m.onReaction) == null || L.call(m, a);
-      } catch (j) {
-        console.log("error on reaction ===>", j);
+        (D = u.onReaction) == null || D.call(u, a);
+      } catch (H) {
+        console.log("error on reaction ===>", H);
       }
     }
-  })), _ = U(() => ({
-    open: i.value,
-    reference: l.value,
-    "onUpdate:open": (a) => i.value = a
-  })), c = v(!1), S = v(), H = v(), r = v(), f = v(!1), d = U(() => ({
-    ref: H,
-    open: c.value,
-    "onUpdate:open": (a) => c.value = a,
+  })), b = U(() => ({
+    open: l.value,
+    reference: i.value,
+    "onUpdate:open": (a) => l.value = a
+  })), d = v(!1), S = v(), F = v(), w = v(), r = v(!1), m = U(() => ({
+    ref: F,
+    open: d.value,
+    "onUpdate:open": (a) => d.value = a,
     search: S.value,
     "onUpdate:search": (a) => S.value = a,
-    reference: r.value,
+    reference: w.value,
     disableOutsidePointerEvents: !1,
     resetSearchTermOnBlur: !0,
-    headerSearch: f.value,
-    onPointerDownOutside: g,
-    onEscapeKeyDown: g
-  })), P = (a) => {
-    a && (r.value = { getBoundingClientRect: a }, c.value = !0, f.value = !1);
-  }, g = () => {
-    r.value = void 0, c.value = !1, S.value = void 0;
-  }, B = (a) => {
+    headerSearch: r.value,
+    onPointerDownOutside: C,
+    onEscapeKeyDown: C
+  })), f = (a) => {
+    a && (w.value = { getBoundingClientRect: a }, d.value = !0, r.value = !1);
+  }, C = () => {
+    w.value = void 0, d.value = !1, S.value = void 0;
+  }, R = (a) => {
     S.value = a;
-  }, x = U(() => ({
-    onOpenReaction: (a) => u(a, !0),
+  }, I = U(() => ({
+    onOpenReaction: (a) => p(a, !0),
     onOpenMention: (a) => {
-      a && (r.value = a, c.value = !0, f.value = !0);
+      a && (w.value = a, d.value = !0, r.value = !0);
     }
   }));
   return {
-    forwardRefMention: H,
+    forwardRefMention: F,
     reactionBinding: o,
-    actionBinding: _,
-    editorBinding: x,
-    mentionBinding: d,
-    openActions: p,
-    openReaction: u,
-    openMentionInEditor: P,
-    closeMentionInEditor: g,
-    updateMentionQuery: B
+    actionBinding: b,
+    editorBinding: I,
+    mentionBinding: m,
+    openActions: c,
+    openReaction: p,
+    openMentionInEditor: f,
+    closeMentionInEditor: C,
+    updateMentionQuery: R
   };
 };
 export {
   no as Comment,
   so as CommentAction,
-  lo as CommentEditor,
-  ao as CommentMention,
-  io as CommentReaction,
+  ao as CommentEditor,
+  io as CommentMention,
+  lo as CommentReaction,
   ro as CommentTrigger,
-  k as commentPrefix,
-  ae as injectCommentContext,
-  ze as provideCommentContext,
+  P as commentPrefix,
+  ee as injectCommentContext,
+  pe as provideCommentContext,
   po as useComment
 };