@mobilon-dev/chotto 0.3.86 → 0.3.87

package/dist/components/2_feed_elements/ImageMessage/ImageMessage.vue2.js

@@ -1,38 +1,46 @@
-import { defineComponent as de, inject as fe, ref as f, watch as W, nextTick as A, onMounted as ve, onUnmounted as be, computed as k, createElementBlock as u, openBlock as i, normalizeStyle as $, normalizeClass as v, unref as t, createCommentVNode as n, createElementVNode as l, createBlock as b, createVNode as g, withCtx as d, createTextVNode as ye, toDisplayString as L, Transition as x, withModifiers as P, Teleport as he } from "vue";
-import we from "../../1_atoms/ContextMenu/ContextMenu.vue.js";
-import pe from "../../1_atoms/LinkPreview/LinkPreview.vue.js";
-import ke from "../../1_atoms/EmbedPreview/EmbedPreview.vue.js";
-import xe from "../BaseReplyMessage/BaseReplyMessage.vue.js";
-import Re from "../../2_modals/ModalFullscreen/ModalFullscreen.vue.js";
-import Me from "../MessageReactions/MessageReactions.vue.js";
-import Se from "../MessageStatusIndicator/MessageStatusIndicator.vue.js";
-import Ce from "../MessageSmsInvite/MessageSmsInvite.vue.js";
-import Ie from "../../1_atoms/Tooltip/Tooltip.vue.js";
-import { useMessageActions as Te } from "../../../hooks/messages/useMessageActions.js";
-import { useMessageLinks as je } from "../../../hooks/messages/useMessageLinks.js";
-import { useChannelAccentColor as Ae } from "../../../hooks/messages/useChannelAccentColor.js";
-import { useSubtextTooltip as Le } from "../../../hooks/messages/useSubtextTooltip.js";
+import { defineComponent as Ie, inject as Ae, ref as b, watch as J, nextTick as E, onMounted as Le, onUnmounted as je, computed as p, createElementBlock as m, openBlock as a, normalizeStyle as O, normalizeClass as y, unref as s, createCommentVNode as i, createElementVNode as l, createBlock as f, createVNode as r, withCtx as v, createTextVNode as Ee, toDisplayString as C, Fragment as K, Transition as x, withModifiers as Q, Teleport as X } from "vue";
+import Oe from "../../1_atoms/ContextMenu/ContextMenu.vue.js";
+import Be from "../../1_atoms/LinkPreview/LinkPreview.vue.js";
+import Ue from "../../1_atoms/EmbedPreview/EmbedPreview.vue.js";
+import ze from "../BaseReplyMessage/BaseReplyMessage.vue.js";
+import Fe from "../../2_modals/ModalFullscreen/ModalFullscreen.vue.js";
+import Ne from "../MessageReactions/MessageReactions.vue.js";
+import Y from "../MessageStatusIndicator/MessageStatusIndicator.vue.js";
+import Ve from "../MessageSmsInvite/MessageSmsInvite.vue.js";
+import He from "../DeletedMessageContent/DeletedMessageContent.vue.js";
+import We from "../../1_atoms/Tooltip/Tooltip.vue.js";
+import { useMessageActions as De } from "../../../hooks/messages/useMessageActions.js";
+import { useMessageMenuActions as Pe } from "../../../hooks/messages/useMessageMenuActions.js";
+import { useMessageLinks as $e } from "../../../hooks/messages/useMessageLinks.js";
+import { useChannelAccentColor as qe } from "../../../hooks/messages/useChannelAccentColor.js";
+import { useSubtextTooltip as Ge } from "../../../hooks/messages/useSubtextTooltip.js";
+import { useStartReply as Je } from "../../../hooks/messages/useStartReply.js";
 import "../../../hooks/useMessageDraft.js";
 import "../../../hooks/useSearchModel.js";
-import { useTheme as Ee } from "../../../hooks/useTheme.js";
+import { useTheme as Ke } from "../../../hooks/useTheme.js";
 import "../../../hooks/useEmojiNative.js";
 /* empty css                              */
 /* empty css                                              */
-import { buildReplyPayload as Oe } from "../../../hooks/messages/buildReplyPayload.js";
-import { getStatus as Be, getStatusTitle as Ue } from "../../../functions/getStatusMessage.js";
-import { getMessageClass as ze } from "../../../functions/getMessageClass.js";
-import { createReactionHandlers as Ne } from "../../../functions/createReactionHandlers.js";
+import "../../../locale/useLocale.js";
+/* empty css                                                            */
+import { buildReplyPayload as Z } from "../../../hooks/messages/buildReplyPayload.js";
+import { getStatus as Qe, getStatusTitle as Xe } from "../../../functions/getStatusMessage.js";
+import { getMessageClass as Ye } from "../../../functions/getMessageClass.js";
+import { createReactionHandlers as Ze } from "../../../functions/createReactionHandlers.js";
 import "../../../functions/parseMarkdown.js";
-const Fe = ["messageId"], Ve = ["src"], He = {
+const _e = ["messageId"], es = ["src"], ss = {
   key: 1,
   class: "image-message__subtext"
-}, We = {
+}, ts = { class: "image-message__info-container" }, as = {
+  key: 0,
+  class: "image-message__time"
+}, ns = {
   key: 0,
   class: "image-message__blur-wrapper"
-}, $e = ["src", "alt"], Pe = ["src", "alt"], De = ["src", "alt"], qe = {
+}, is = ["src", "alt"], ls = ["src", "alt"], ms = ["src", "alt"], os = {
   key: 0,
   class: "image-message__info-container"
-}, Ge = { class: "image-message__time" }, Je = ["innerHTML"], Ke = ["src", "alt"], ps = /* @__PURE__ */ de({
+}, us = { class: "image-message__time" }, rs = ["innerHTML"], gs = ["src", "alt"], Ds = /* @__PURE__ */ Ie({
   __name: "ImageMessage",
   props: {
     message: {
@@ -76,65 +84,77 @@ const Fe = ["messageId"], Ve = ["src"], He = {
     }
   },
   emits: ["action", "reply", "sms-invite"],
-  setup(e, { emit: D }) {
-    const q = fe("chatAppId"), { getTheme: E } = Ee(q), s = e, S = D, C = f(!1), {
-      isOpenMenu: I,
-      buttonMenuVisible: G,
-      showMenu: J,
-      hideMenu: K,
-      clickAction: Q,
-      viewsAction: O,
-      handleClickReplied: X
-    } = Te(s.message, S), R = f(!1), { linkedHtml: B, inNewWindow: U } = je(() => s.message.text), c = f(null), r = f(null), y = f(0), T = f(0);
-    W(
-      () => B.value,
+  setup(e, { emit: _ }) {
+    const B = Ae("chatAppId"), { getTheme: U } = Ke(B || ""), { menuActions: R } = Pe(() => t.message), { startReply: ee } = Je(B || ""), t = e, T = _, I = b(!1), {
+      isOpenMenu: se,
+      buttonMenuVisible: z,
+      menuAnchorRef: te,
+      menuRef: ae,
+      menuStyle: ne,
+      menuTheme: ie,
+      showMenu: le,
+      hideMenu: me,
+      openMenu: oe,
+      toggleMenu: F,
+      onMenuMouseEnter: ue,
+      onMenuMouseLeave: re,
+      clickAction: ge,
+      viewsAction: N,
+      handleClickReplied: ce
+    } = De(t.message, T, {
+      onReply: () => ee(Z(t.message, "message.image"))
+    }), h = b(!1), { linkedHtml: V, inNewWindow: H } = $e(() => t.message.text), c = b(null), g = b(null), M = b(0), A = b(0);
+    J(
+      () => V.value,
       () => {
-        h(), A(() => {
-          o && r.value && o.observe(r.value);
+        w(), E(() => {
+          o && g.value && o.observe(g.value);
         });
       }
     );
-    const h = () => {
-      A(() => {
-        c.value && (y.value = c.value.offsetWidth), r.value && (T.value = r.value.offsetWidth);
+    const w = () => {
+      E(() => {
+        c.value && (M.value = c.value.offsetWidth), g.value && (A.value = g.value.offsetWidth);
       });
     };
-    let o = null, M = null;
-    ve(() => {
-      h(), M = () => h(), window.addEventListener("resize", M), typeof ResizeObserver < "u" && (o = new ResizeObserver(() => {
-        h();
-      }), c.value && o.observe(c.value), r.value && o.observe(r.value));
-    }), be(() => {
-      M && window.removeEventListener("resize", M), o && o.disconnect();
-    }), W(
-      () => [s.message.text, s.message.url],
+    let o = null, S = null;
+    Le(() => {
+      w(), S = () => w(), window.addEventListener("resize", S), typeof ResizeObserver < "u" && (o = new ResizeObserver(() => {
+        w();
+      }), c.value && o.observe(c.value), g.value && o.observe(g.value));
+    }), je(() => {
+      S && window.removeEventListener("resize", S), o && o.disconnect();
+    }), J(
+      () => [t.message.text, t.message.url],
       () => {
-        h(), A(() => {
-          o && (o.disconnect(), c.value && o.observe(c.value), r.value && o.observe(r.value));
+        w(), E(() => {
+          o && (o.disconnect(), c.value && o.observe(c.value), g.value && o.observe(g.value));
         });
       },
       { immediate: !0 }
     );
-    const z = k(() => s.message.text && T.value > y.value && y.value > 0), Y = () => {
-      J(), R.value = !0;
-    }, N = () => {
-      K(), R.value = !1;
-    }, Z = k(() => s.message.reply && s.message.text ? "0" : s.message.text ? T.value > y.value && y.value > 0 ? "0" : "8px 8px 0 0" : s.message.reply ? "0 0 8px 8px" : "8px"), _ = k(() => Be(s.message.status)), ee = k(() => Ue(s.message.status, s.message.statusMsg)), { bubbleStyle: se } = Ae(
-      k(() => s.message),
+    const W = p(() => t.message.text && A.value > M.value && M.value > 0), de = () => {
+      le(), h.value = !0;
+    }, D = (d) => {
+      me(d), z.value || (h.value = !1);
+    }, fe = () => {
+      re(), h.value = !1;
+    }, ve = p(() => t.message.reply && t.message.text ? "0" : t.message.text ? A.value > M.value && M.value > 0 ? "0" : "8px 8px 0 0" : t.message.reply ? "0 0 8px 8px" : "8px"), P = p(() => Qe(t.message.status)), $ = p(() => Xe(t.message.status, t.message.statusMsg)), { bubbleStyle: be } = qe(
+      p(() => t.message),
       { cssVariable: "--chotto-imagemessage-right-bg", position: "right" }
     );
-    function F(w) {
-      return ze(w.position, "image-message");
+    function L(d) {
+      return Ye(d.position, "image-message");
     }
-    const te = () => C.value = !1, ae = async () => {
-      var w, a;
-      if (s.message.url)
+    const ye = () => I.value = !1, he = async () => {
+      var d, n;
+      if (t.message.url)
         try {
-          const m = await fetch(s.message.url, {
+          const u = await fetch(t.message.url, {
             headers: {
               Accept: "image/*"
             }
-          }), re = m.headers.get("content-type") || "", ue = await m.blob(), j = ((a = (w = s.message.url.split(".").pop()) == null ? void 0 : w.split("?")[0]) == null ? void 0 : a.toLowerCase()) || "", ge = {
+          }), Re = u.headers.get("content-type") || "", Se = await u.blob(), j = ((n = (d = t.message.url.split(".").pop()) == null ? void 0 : d.split("?")[0]) == null ? void 0 : n.toLowerCase()) || "", Ce = {
             "image/jpeg": "jpg",
             "image/jpg": "jpg",
             "image/png": "png",
@@ -143,209 +163,236 @@ const Fe = ["messageId"], Ve = ["src"], He = {
             "image/svg+xml": "svg",
             "image/bmp": "bmp"
           };
-          let V = j && ["jpg", "jpeg", "png", "gif", "webp", "svg", "bmp"].includes(j) ? j : ge[re] || "jpg";
-          const ce = s.message.alt ? s.message.alt.includes(".") ? s.message.alt : `${s.message.alt}.${V}` : `image-${s.message.messageId}.${V}`, H = window.URL.createObjectURL(ue), p = document.createElement("a");
-          p.href = H, p.download = ce, document.body.appendChild(p), p.click(), document.body.removeChild(p), window.URL.revokeObjectURL(H);
-        } catch (m) {
-          console.error("Ошибка при скачивании изображения:", m);
+          let q = j && ["jpg", "jpeg", "png", "gif", "webp", "svg", "bmp"].includes(j) ? j : Ce[Re] || "jpg";
+          const Te = t.message.alt ? t.message.alt.includes(".") ? t.message.alt : `${t.message.alt}.${q}` : `image-${t.message.messageId}.${q}`, G = window.URL.createObjectURL(Se), k = document.createElement("a");
+          k.href = G, k.download = Te, document.body.appendChild(k), k.click(), document.body.removeChild(k), window.URL.revokeObjectURL(G);
+        } catch (u) {
+          console.error("Ошибка при скачивании изображения:", u);
         }
-    }, { onToggleReaction: ie, onAddReaction: ne, onRemoveReaction: le } = Ne(S), oe = Le(() => s.message, () => s.subtextTooltipData);
-    function me() {
-      S("sms-invite", s.message);
+    }, { onToggleReaction: Me, onAddReaction: we, onRemoveReaction: ke } = Ze(T), pe = Ge(() => t.message, () => t.subtextTooltipData);
+    function xe() {
+      T("sms-invite", t.message);
     }
-    return (w, a) => (i(), u("div", {
-      class: v(["image-message", [
-        F(e.message),
+    return (d, n) => (a(), m("div", {
+      ref_key: "menuAnchorRef",
+      ref: te,
+      class: y(["image-message", [
+        L(e.message),
         e.applyStyle(e.message)
       ]]),
       messageId: e.message.messageId,
-      style: $(t(se)),
-      onMouseleave: N
+      style: O(s(be)),
+      onMouseleave: D
     }, [
-      e.message.avatar && e.isFirstInSeries ? (i(), u("img", {
+      e.message.avatar && e.isFirstInSeries ? (a(), m("img", {
         key: 0,
         class: "image-message__avatar",
         src: e.message.avatar,
         height: "32",
         width: "32"
-      }, null, 8, Ve)) : n("", !0),
-      e.message.subText && e.isFirstInSeries ? (i(), u("p", He, [
-        g(Ie, {
-          text: t(oe),
+      }, null, 8, es)) : i("", !0),
+      e.message.subText && e.isFirstInSeries ? (a(), m("p", ss, [
+        r(We, {
+          text: s(pe),
           position: e.message.position === "left" ? "right" : "left",
           offset: 8
         }, {
-          default: d(() => [
-            ye(L(e.message.subText), 1)
+          default: v(() => [
+            Ee(C(e.message.subText), 1)
           ]),
           _: 1
         }, 8, ["text", "position"])
-      ])) : n("", !0),
+      ])) : i("", !0),
       l("div", {
-        class: v(["image-message__content", { "is-first": e.isFirstInSeries, "with-avatar-indent": !e.isFirstInSeries && e.message.avatar }])
+        class: y(["image-message__content", { "is-first": e.isFirstInSeries, "with-avatar-indent": !e.isFirstInSeries && e.message.avatar }])
       }, [
-        e.message.reply ? (i(), b(xe, {
-          key: 0,
-          style: { margin: "10px 10px 4px 16px" },
-          class: v(e.message.position),
-          message: e.message.reply,
-          onReply: t(X)
-        }, null, 8, ["class", "message", "onReply"])) : n("", !0),
-        l("div", {
-          class: v(["image-message__preview-button", { "image-message__preview-button--blur-edges": z.value }]),
-          onClick: a[1] || (a[1] = (m) => C.value = !0),
-          onMouseenter: Y,
-          onMouseleave: N
-        }, [
-          z.value ? (i(), u("div", We, [
-            l("img", {
-              class: "image-message__blur-left",
-              src: e.message.url,
-              alt: e.message.alt
-            }, null, 8, $e),
+        e.message.deleted ? (a(), m(K, { key: 0 }, [
+          r(He),
+          l("div", ts, [
+            e.message.time ? (a(), m("span", as, C(e.message.time), 1)) : i("", !0),
+            r(Y, {
+              "base-class": "image-message",
+              "message-class": L(e.message),
+              "message-status": e.message.status,
+              "status-class": P.value,
+              "status-title": $.value
+            }, null, 8, ["message-class", "message-status", "status-class", "status-title"])
+          ])
+        ], 64)) : (a(), m(K, { key: 1 }, [
+          e.message.reply ? (a(), f(ze, {
+            key: 0,
+            style: { margin: "10px 10px 4px 16px" },
+            class: y(e.message.position),
+            message: e.message.reply,
+            onReply: s(ce)
+          }, null, 8, ["class", "message", "onReply"])) : i("", !0),
+          l("div", {
+            class: y(["image-message__preview-button", { "image-message__preview-button--blur-edges": W.value }]),
+            onClick: n[1] || (n[1] = (u) => I.value = !0),
+            onMouseenter: de,
+            onMouseleave: D
+          }, [
+            W.value ? (a(), m("div", ns, [
+              l("img", {
+                class: "image-message__blur-left",
+                src: e.message.url,
+                alt: e.message.alt
+              }, null, 8, is),
+              l("img", {
+                class: "image-message__blur-right",
+                src: e.message.url,
+                alt: e.message.alt
+              }, null, 8, ls)
+            ])) : i("", !0),
             l("img", {
-              class: "image-message__blur-right",
+              ref_key: "imageRef",
+              ref: c,
+              class: "image-message__preview-image",
+              style: O({ borderRadius: ve.value }),
               src: e.message.url,
               alt: e.message.alt
-            }, null, 8, Pe)
-          ])) : n("", !0),
-          l("img", {
-            ref_key: "imageRef",
-            ref: c,
-            class: "image-message__preview-image",
-            style: $({ borderRadius: Z.value }),
-            src: e.message.url,
-            alt: e.message.alt
-          }, null, 12, De),
-          g(x, { name: "modal-fade" }, {
-            default: d(() => [
-              R.value ? (i(), u("div", qe, [
-                e.message.views ? (i(), u("div", {
+            }, null, 12, ms),
+            r(x, { name: "modal-fade" }, {
+              default: v(() => [
+                h.value ? (a(), m("div", os, [
+                  e.message.views ? (a(), m("div", {
+                    key: 0,
+                    class: "image-message__views",
+                    onClick: n[0] || (n[0] = Q(
+                      //@ts-ignore
+                      (...u) => s(N) && s(N)(...u),
+                      ["stop"]
+                    ))
+                  }, [
+                    n[4] || (n[4] = l("span", { class: "pi pi-eye" }, null, -1)),
+                    l("p", null, C(e.message.views), 1)
+                  ])) : i("", !0),
+                  l("span", us, C(e.message.time), 1),
+                  r(Y, {
+                    "base-class": "image-message",
+                    "message-class": L(e.message),
+                    "message-status": e.message.status,
+                    "status-class": P.value,
+                    "status-title": $.value
+                  }, null, 8, ["message-class", "message-status", "status-class", "status-title"])
+                ])) : i("", !0)
+              ]),
+              _: 1
+            }),
+            r(x, { name: "modal-fade" }, {
+              default: v(() => [
+                h.value ? (a(), m("button", {
                   key: 0,
-                  class: "image-message__views",
-                  onClick: a[0] || (a[0] = P(
-                    //@ts-ignore
-                    (...m) => t(O) && t(O)(...m),
-                    ["stop"]
-                  ))
-                }, [
-                  a[4] || (a[4] = l("span", { class: "pi pi-eye" }, null, -1)),
-                  l("p", null, L(e.message.views), 1)
-                ])) : n("", !0),
-                l("span", Ge, L(e.message.time), 1),
-                g(Se, {
-                  "base-class": "image-message",
-                  "message-class": F(e.message),
-                  "message-status": e.message.status,
-                  "status-class": _.value,
-                  "status-title": ee.value
-                }, null, 8, ["message-class", "message-status", "status-class", "status-title"])
-              ])) : n("", !0)
-            ]),
-            _: 1
-          }),
-          g(x, { name: "modal-fade" }, {
-            default: d(() => [
-              R.value ? (i(), u("button", {
+                  class: "image-message__download-button",
+                  onClick: Q(he, ["stop"])
+                }, [...n[5] || (n[5] = [
+                  l("span", { class: "pi pi-download" }, null, -1)
+                ])])) : i("", !0)
+              ]),
+              _: 1
+            })
+          ], 34),
+          r(x, { name: "modal-fade" }, {
+            default: v(() => [
+              s(z) && s(R).length && !e.reactionsEnabled ? (a(), m("button", {
                 key: 0,
-                class: "image-message__download-button",
-                onClick: P(ae, ["stop"])
-              }, [...a[5] || (a[5] = [
-                l("span", { class: "pi pi-download" }, null, -1)
-              ])])) : n("", !0)
+                class: "image-message__menu-button",
+                onClick: n[2] || (n[2] = //@ts-ignore
+                (...u) => s(F) && s(F)(...u))
+              }, [...n[6] || (n[6] = [
+                l("span", { class: "pi pi-ellipsis-h" }, null, -1)
+              ])])) : i("", !0)
             ]),
             _: 1
-          })
-        ], 34),
-        g(x, { name: "modal-fade" }, {
-          default: d(() => [
-            t(G) && e.message.actions ? (i(), u("button", {
-              key: 0,
-              class: "image-message__menu-button",
-              onClick: a[2] || (a[2] = (m) => I.value = !t(I))
-            }, [...a[6] || (a[6] = [
-              l("span", { class: "pi pi-ellipsis-h" }, null, -1)
-            ])])) : n("", !0)
-          ]),
-          _: 1
-        }),
-        g(x, { name: "context-menu" }, {
-          default: d(() => [
-            t(I) && e.message.actions ? (i(), b(we, {
-              key: 0,
-              class: "image-message__context-menu",
-              actions: e.message.actions,
-              onClick: t(Q)
-            }, null, 8, ["actions", "onClick"])) : n("", !0)
-          ]),
-          _: 1
-        }),
-        e.message.text ? (i(), u("div", {
-          key: 1,
-          ref_key: "textRef",
-          ref: r,
-          class: "image-message__text-container"
-        }, [
-          l("p", {
-            onClick: a[3] || (a[3] = //@ts-ignore
-            (...m) => t(U) && t(U)(...m)),
-            innerHTML: t(B)
-          }, null, 8, Je)
-        ], 512)) : n("", !0),
-        g(Ce, {
-          status: e.message.status,
-          "has-messenger-account": e.message.hasMessengerAccount,
-          channel: e.channel,
-          onSmsInvite: me
-        }, null, 8, ["status", "has-messenger-account", "channel"]),
-        e.message.linkPreview ? (i(), b(pe, {
-          key: 2,
-          class: v(["image-message__link-preview", e.message.position]),
-          "link-preview": e.message.linkPreview
-        }, null, 8, ["class", "link-preview"])) : n("", !0),
-        e.message.embed ? (i(), b(ke, {
-          key: 3,
-          class: v(e.message.position),
-          embed: e.message.embed
-        }, null, 8, ["class", "embed"])) : n("", !0),
-        g(Me, {
-          reactions: e.message.reactions,
-          "message-id": e.message.messageId,
-          reply: t(Oe)(e.message, "message.image"),
-          enabled: e.reactionsEnabled,
-          mode: e.reactionsMode,
-          "current-user-id": e.currentUserId,
-          "reaction-user-names": e.reactionUserNames,
-          onToggleReaction: t(ie),
-          onAddReaction: t(ne),
-          onRemoveReaction: t(le)
-        }, null, 8, ["reactions", "message-id", "reply", "enabled", "mode", "current-user-id", "reaction-user-names", "onToggleReaction", "onAddReaction", "onRemoveReaction"])
+          }),
+          (a(), f(X, { to: "body" }, [
+            r(x, { name: "context-menu" }, {
+              default: v(() => [
+                s(se) && s(R).length ? (a(), f(Oe, {
+                  key: 0,
+                  ref_key: "menuRef",
+                  ref: ae,
+                  class: "image-message__context-menu message-actions-menu",
+                  style: O(s(ne)),
+                  "data-theme": s(ie),
+                  actions: s(R),
+                  onClick: s(ge),
+                  onMouseenter: s(ue),
+                  onMouseleave: fe
+                }, null, 8, ["style", "data-theme", "actions", "onClick", "onMouseenter"])) : i("", !0)
+              ]),
+              _: 1
+            })
+          ])),
+          e.message.text ? (a(), m("div", {
+            key: 1,
+            ref_key: "textRef",
+            ref: g,
+            class: "image-message__text-container"
+          }, [
+            l("p", {
+              onClick: n[3] || (n[3] = //@ts-ignore
+              (...u) => s(H) && s(H)(...u)),
+              innerHTML: s(V)
+            }, null, 8, rs)
+          ], 512)) : i("", !0),
+          r(Ve, {
+            status: e.message.status,
+            "has-messenger-account": e.message.hasMessengerAccount,
+            channel: e.channel,
+            onSmsInvite: xe
+          }, null, 8, ["status", "has-messenger-account", "channel"]),
+          e.message.linkPreview ? (a(), f(Be, {
+            key: 2,
+            class: y(["image-message__link-preview", e.message.position]),
+            "link-preview": e.message.linkPreview
+          }, null, 8, ["class", "link-preview"])) : i("", !0),
+          e.message.embed ? (a(), f(Ue, {
+            key: 3,
+            class: y(e.message.position),
+            embed: e.message.embed
+          }, null, 8, ["class", "embed"])) : i("", !0),
+          r(Ne, {
+            reactions: e.message.reactions,
+            "message-id": e.message.messageId,
+            reply: s(Z)(e.message, "message.image"),
+            enabled: e.reactionsEnabled,
+            mode: e.reactionsMode,
+            "current-user-id": e.currentUserId,
+            "reaction-user-names": e.reactionUserNames,
+            "menu-enabled": s(R).length > 0,
+            onToggleReaction: s(Me),
+            onAddReaction: s(we),
+            onRemoveReaction: s(ke),
+            onMenu: s(oe)
+          }, null, 8, ["reactions", "message-id", "reply", "enabled", "mode", "current-user-id", "reaction-user-names", "menu-enabled", "onToggleReaction", "onAddReaction", "onRemoveReaction", "onMenu"])
+        ], 64))
       ], 2),
-      (i(), b(he, { to: "body" }, [
-        g(x, { name: "modal-fade" }, {
-          default: d(() => [
-            C.value ? (i(), b(Re, {
+      (a(), f(X, { to: "body" }, [
+        r(x, { name: "modal-fade" }, {
+          default: v(() => [
+            I.value && !e.message.deleted ? (a(), f(Fe, {
               key: 0,
-              "data-theme": t(E)().theme ? t(E)().theme : "light",
+              "data-theme": s(U)().theme ? s(U)().theme : "light",
               title: e.message.alt,
-              onClose: te
+              onClose: ye
             }, {
-              default: d(() => [
+              default: v(() => [
                 l("img", {
                   class: "image-message__modal-image",
                   src: e.message.url,
                   alt: e.message.alt
-                }, null, 8, Ke)
+                }, null, 8, gs)
               ]),
               _: 1
-            }, 8, ["data-theme", "title"])) : n("", !0)
+            }, 8, ["data-theme", "title"])) : i("", !0)
           ]),
           _: 1
         })
       ]))
-    ], 46, Fe));
+    ], 46, _e));
   }
 });
 export {
-  ps as default
+  Ds as default
 };