import { defineComponent as Y, inject as Z, ref as y, computed as b, watch as E, onMounted as _, createElementBlock as i, openBlock as t, unref as a, normalizeStyle as ee, normalizeClass as w, createCommentVNode as l, createElementVNode as r, createBlock as g, toDisplayString as I, createVNode as u, Transition as h, withCtx as d, withModifiers as V, Teleport as se } from "vue";
import te from "../../1_atoms/ContextMenu/ContextMenu.vue.js";
import ae from "../../1_atoms/LinkPreview/LinkPreview.vue.js";
import ie from "../../1_atoms/EmbedPreview/EmbedPreview.vue.js";
import le from "../BaseReplyMessage/BaseReplyMessage.vue.js";
import ne from "../../2_modals/ModalFullscreen/ModalFullscreen.vue.js";
import oe from "../MessageReactions/MessageReactions.vue.js";
import me from "../MessageStatusIndicator/MessageStatusIndicator.vue.js";
import re from "../MessageSmsInvite/MessageSmsInvite.vue.js";
import { useMessageActions as ue } from "../../../hooks/messages/useMessageActions.js";
import { useMessageLinks as ce } from "../../../hooks/messages/useMessageLinks.js";
import { useChannelAccentColor as ge } from "../../../hooks/messages/useChannelAccentColor.js";
import { getStatus as de, getStatusTitle as ve } from "../../../functions/getStatusMessage.js";
import { getMessageClass as ke } from "../../../functions/getMessageClass.js";
import { createReactionHandlers as fe } from "../../../functions/createReactionHandlers.js";
import "../../../functions/parseMarkdown.js";
import "../../../hooks/useMessageDraft.js";
import "../../../hooks/useSearchModel.js";
import { useTheme as ye } from "../../../hooks/useTheme.js";
/* empty css                              */
/* empty css                                              */
import { isAnimatedSticker as be } from "./utils/stickerUtils.js";
import "./utils/suppress-lit-warning.js";
const we = ["messageId"], he = ["src"], Me = {
  key: 1,
  class: "sticker-message__subtext"
}, Se = ["src"], Ce = ["src"], Re = ["src", "alt"], Ie = {
  key: 0,
  class: "sticker-message__info-container"
}, Te = { class: "sticker-message__time" }, xe = ["href"], pe = {
  key: 1,
  class: "sticker-message__text-container"
}, Le = ["innerHTML"], Ae = ["src"], Fe = ["src"], Be = ["src", "alt"], ts = /* @__PURE__ */ Y({
  __name: "StickerMessage",
  props: {
    message: {
      type: Object,
      required: !0
    },
    applyStyle: {
      type: Function,
      default: () => null
    },
    isFirstInSeries: {
      type: Boolean,
      default: !0
    },
    reactionsEnabled: {
      type: Boolean,
      default: !0
    },
    channel: {
      type: String,
      required: !1,
      default: void 0
    }
  },
  emits: ["action", "reply", "sms-invite"],
  setup(e, { emit: $ }) {
    const H = Z("chatAppId"), { getTheme: T } = ye(H), c = y(!1), M = y(!1);
    async function x() {
      if (!(c.value || M.value)) {
        M.value = !0;
        try {
          await import("./libs/tgs-player/lottie-player.esm.js"), await import("./libs/tgs-player/tgs-player.esm.js"), c.value = !0;
        } catch (m) {
          console.error("Failed to load TGS libraries:", m);
        } finally {
          M.value = !1;
        }
      }
    }
    const n = e, S = $, C = y(!1), {
      isOpenMenu: R,
      buttonMenuVisible: N,
      showMenu: P,
      hideMenu: p,
      clickAction: j,
      viewsAction: L,
      handleClickReplied: O
    } = ue(n.message, S), v = y(!1), { linkedHtml: q, inNewWindow: A } = ce(() => n.message.text), z = () => {
      P(), v.value = !0;
    }, D = b(() => de(n.message.status)), G = b(() => ve(n.message.status, n.message.statusMsg)), { bubbleStyle: W } = ge(
      b(() => n.message),
      { cssVariable: "--chotto-stickermessage-right-bg", position: "right" }
    ), k = b(() => be(n.message.url, n.message.isAnimated)), f = y(!1), F = b(() => {
      if (k.value) return !1;
      const m = String(n.message.url || "").toLowerCase();
      return !/\.(webp|png|jpe?g|gif|bmp|svg)(\?|#|$)/.test(m);
    });
    E(
      () => n.message.url,
      () => {
        f.value = !1;
      },
      { immediate: !0 }
    ), E(k, (m) => {
      m && !c.value && x();
    }, { immediate: !0 }), _(() => {
      k.value && !c.value && x();
    });
    function B(m) {
      return ke(m.position, "sticker-message");
    }
    const J = () => C.value = !1, { onToggleReaction: K, onAddReaction: Q, onRemoveReaction: U } = fe(S);
    function X() {
      S("sms-invite", n.message);
    }
    return (m, s) => (t(), i("div", {
      class: w(["sticker-message", [
        B(e.message),
        e.applyStyle(e.message)
      ]]),
      messageId: e.message.messageId,
      style: ee(a(W)),
      onMouseleave: s[7] || (s[7] = //@ts-ignore
      (...o) => a(p) && a(p)(...o))
    }, [
      e.message.avatar && e.isFirstInSeries ? (t(), i("img", {
        key: 0,
        class: "sticker-message__avatar",
        src: e.message.avatar,
        height: "32",
        width: "32"
      }, null, 8, he)) : l("", !0),
      e.message.subText && e.isFirstInSeries ? (t(), i("p", Me, I(e.message.subText), 1)) : l("", !0),
      r("div", {
        class: w(["sticker-message__content", { "is-first": e.isFirstInSeries, "with-avatar-indent": !e.isFirstInSeries && e.message.avatar }])
      }, [
        e.message.reply ? (t(), g(le, {
          key: 0,
          style: { margin: "10px 10px 4px 16px" },
          class: w(e.message.position),
          message: e.message.reply,
          onReply: a(O)
        }, null, 8, ["class", "message", "onReply"])) : l("", !0),
        r("div", {
          class: "sticker-message__preview-button",
          onClick: s[2] || (s[2] = (o) => C.value = !0),
          onMouseenter: z,
          onMouseleave: s[3] || (s[3] = (o) => v.value = !v.value)
        }, [
          k.value && c.value ? (t(), i("tgs-player", {
            key: 0,
            class: "sticker-message__preview-image-animated",
            src: e.message.url,
            autoplay: "",
            loop: "",
            mode: "normal"
          }, null, 8, Se)) : F.value && !f.value ? (t(), i("video", {
            key: 1,
            class: "sticker-message__preview-image",
            src: e.message.url,
            autoplay: "",
            loop: "",
            muted: "",
            playsinline: "",
            preload: "metadata",
            onError: s[0] || (s[0] = (o) => f.value = !0)
          }, null, 40, Ce)) : (t(), i("img", {
            key: 2,
            class: "sticker-message__preview-image",
            src: e.message.url,
            alt: e.message.alt
          }, null, 8, Re)),
          u(h, { name: "modal-fade" }, {
            default: d(() => [
              v.value ? (t(), i("div", Ie, [
                e.message.views ? (t(), i("div", {
                  key: 0,
                  class: "sticker-message__views",
                  onClick: s[1] || (s[1] = V(
                    //@ts-ignore
                    (...o) => a(L) && a(L)(...o),
                    ["stop"]
                  ))
                }, [
                  s[8] || (s[8] = r("span", { class: "pi pi-eye" }, null, -1)),
                  r("p", null, I(e.message.views), 1)
                ])) : l("", !0),
                r("span", Te, I(e.message.time), 1),
                u(me, {
                  "base-class": "sticker-message",
                  "message-class": B(e.message),
                  "message-status": e.message.status,
                  "status-class": D.value,
                  "status-title": G.value
                }, null, 8, ["message-class", "message-status", "status-class", "status-title"])
              ])) : l("", !0)
            ]),
            _: 1
          }),
          u(h, { name: "modal-fade" }, {
            default: d(() => [
              v.value ? (t(), i("a", {
                key: 0,
                class: "sticker-message__download-button",
                href: e.message.url,
                download: "",
                target: "_blank",
                onClick: V(() => "//Предотвращаем всплытие события клика", ["stop"])
              }, [...s[9] || (s[9] = [
                r("span", { class: "pi pi-download" }, null, -1)
              ])], 8, xe)) : l("", !0)
            ]),
            _: 1
          })
        ], 32),
        u(h, { name: "modal-fade" }, {
          default: d(() => [
            a(N) && e.message.actions ? (t(), i("button", {
              key: 0,
              class: "sticker-message__menu-button",
              onClick: s[4] || (s[4] = (o) => R.value = !a(R))
            }, [...s[10] || (s[10] = [
              r("span", { class: "pi pi-ellipsis-h" }, null, -1)
            ])])) : l("", !0)
          ]),
          _: 1
        }),
        u(h, { name: "context-menu" }, {
          default: d(() => [
            a(R) && e.message.actions ? (t(), g(te, {
              key: 0,
              class: "sticker-message__context-menu",
              actions: e.message.actions,
              onClick: a(j)
            }, null, 8, ["actions", "onClick"])) : l("", !0)
          ]),
          _: 1
        }),
        e.message.text ? (t(), i("div", pe, [
          r("p", {
            onClick: s[5] || (s[5] = //@ts-ignore
            (...o) => a(A) && a(A)(...o)),
            innerHTML: a(q)
          }, null, 8, Le)
        ])) : l("", !0),
        u(re, {
          status: e.message.status,
          "has-messenger-account": e.message.hasMessengerAccount,
          channel: e.channel,
          onSmsInvite: X
        }, null, 8, ["status", "has-messenger-account", "channel"]),
        e.message.linkPreview ? (t(), g(ae, {
          key: 2,
          class: w(["sticker-message__link-preview", e.message.position]),
          "link-preview": e.message.linkPreview
        }, null, 8, ["class", "link-preview"])) : l("", !0),
        e.message.embed ? (t(), g(ie, {
          key: 3,
          class: w(e.message.position),
          embed: e.message.embed
        }, null, 8, ["class", "embed"])) : l("", !0),
        u(oe, {
          reactions: e.message.reactions,
          "message-id": e.message.messageId,
          enabled: e.reactionsEnabled,
          onToggleReaction: a(K),
          onAddReaction: a(Q),
          onRemoveReaction: a(U)
        }, null, 8, ["reactions", "message-id", "enabled", "onToggleReaction", "onAddReaction", "onRemoveReaction"])
      ], 2),
      (t(), g(se, { to: "body" }, [
        u(h, { name: "modal-fade" }, {
          default: d(() => [
            C.value ? (t(), g(ne, {
              key: 0,
              "data-theme": a(T)().theme ? a(T)().theme : "light",
              title: e.message.alt,
              onClose: J
            }, {
              default: d(() => [
                k.value && c.value ? (t(), i("tgs-player", {
                  key: 0,
                  class: "sticker-message__modal-image-animated",
                  src: e.message.url,
                  autoplay: "",
                  loop: "",
                  mode: "normal"
                }, null, 8, Ae)) : F.value && !f.value ? (t(), i("video", {
                  key: 1,
                  class: "sticker-message__modal-image",
                  src: e.message.url,
                  autoplay: "",
                  loop: "",
                  muted: "",
                  playsinline: "",
                  preload: "metadata",
                  onError: s[6] || (s[6] = (o) => f.value = !0)
                }, null, 40, Fe)) : (t(), i("img", {
                  key: 2,
                  class: "sticker-message__modal-image",
                  src: e.message.url,
                  alt: e.message.alt
                }, null, 8, Be))
              ]),
              _: 1
            }, 8, ["data-theme", "title"])) : l("", !0)
          ]),
          _: 1
        })
      ]))
    ], 46, we));
  }
});
export {
  ts as default
};
