@mobilon-dev/chotto 0.3.33 → 0.3.34

package/dist/components/2_chatinput_elements/StickerPicker/StickerPicker.vue2.js

@@ -0,0 +1,360 @@
+import { defineComponent as Oe, ref as a, inject as Ae, computed as h, watchEffect as Be, watch as j, onMounted as We, onUnmounted as Ne, createElementBlock as n, openBlock as c, Fragment as z, createCommentVNode as E, createVNode as C, unref as P, normalizeClass as se, createElementVNode as L, Transition as le, withCtx as re, withDirectives as Ve, renderList as oe, toDisplayString as ae, vShow as Re, normalizeStyle as He } from "vue";
+import { useMessageDraft as Ie } from "../../../hooks/useMessageDraft.js";
+import "../../../hooks/useSearchModel.js";
+import "../../../hooks/useTheme.js";
+/* empty css                              */
+/* empty css                                              */
+import "../../../node_modules/linkifyjs/dist/linkify.js";
+import "../../../functions/parseMarkdown.js";
+import ne from "./icons/StickerIcon.vue.js";
+import { isAnimatedSticker as F } from "../../2_feed_elements/StickerMessage/utils/stickerUtils.js";
+import "../../2_feed_elements/StickerMessage/utils/suppress-lit-warning.js";
+const Xe = { class: "sticker-picker__container" }, Ye = ["onClick", "onMouseenter", "onMouseleave"], je = ["src"], ze = ["src", "alt"], Ge = {
+  key: 2,
+  class: "sticker-picker__tab-icon-placeholder"
+}, Ke = { class: "sticker-picker__content" }, qe = {
+  key: 0,
+  class: "sticker-picker__empty"
+}, Je = {
+  key: 1,
+  class: "sticker-picker__grid"
+}, Qe = ["onClick", "onMousedown", "onMouseenter", "onTouchstart"], Ze = ["src"], xe = ["src", "alt"], et = ["src"], tt = ["src", "alt"], st = {
+  key: 2,
+  class: "sticker-picker__preview-label"
+}, lt = 500, pt = /* @__PURE__ */ Oe({
+  __name: "StickerPicker",
+  props: {
+    state: { default: "active" },
+    mode: { default: "click" },
+    stickers: { default: () => [] },
+    emptyText: { default: "Нет доступных стикеров" }
+  },
+  setup(U) {
+    const r = U, $ = a(null), D = a(null), O = a(null), A = a(null), v = a(!1), p = a(0), _ = Ae("chatAppId"), { getMessage: ce, setMessageFile: ie, setForceSendMessage: ue } = Ie(_), T = a("#5F5F5F"), M = a("#404040"), B = a(!1);
+    let g = null;
+    const W = () => {
+      if (!_) {
+        T.value = "#5F5F5F", M.value = "#404040";
+        return;
+      }
+      const e = document.getElementById(_);
+      if (!e) {
+        T.value = "#5F5F5F", M.value = "#404040";
+        return;
+      }
+      const t = window.getComputedStyle(e), s = t.getPropertyValue("--chotto-stickerpicker-button-span-color").trim(), l = t.getPropertyValue("--chotto-stickerpicker-button-span-hover-color").trim();
+      T.value = s || "#5F5F5F", M.value = l || "#404040";
+    }, ve = h(() => B.value ? M.value : T.value);
+    Be(() => {
+      W();
+    });
+    const i = a(null), N = a({}), m = a(null), u = a(!1), fe = a(null), f = a(/* @__PURE__ */ new Map()), d = a(/* @__PURE__ */ new Map());
+    let w = !1, S = !1;
+    const k = a(!1), V = a(!1);
+    async function G() {
+      if (!(k.value || V.value)) {
+        V.value = !0;
+        try {
+          await import("../../2_feed_elements/StickerMessage/libs/tgs-player/lottie-player.esm.js"), await import("../../2_feed_elements/StickerMessage/libs/tgs-player/tgs-player.esm.js"), k.value = !0;
+        } catch (e) {
+          console.error("Failed to load TGS libraries:", e);
+        } finally {
+          V.value = !1;
+        }
+      }
+    }
+    const ke = () => {
+      if (!r.stickers || !Array.isArray(r.stickers) || r.stickers.length === 0)
+        return { hasTabs: !1, tabs: [] };
+      const e = r.stickers[0], t = Array.isArray(e), s = e && typeof e == "object" && "stickers" in e;
+      return t ? {
+        hasTabs: !0,
+        tabs: r.stickers.map((l, o) => ({
+          id: `tab-${o}`,
+          label: `Set ${o + 1}`,
+          stickers: l,
+          iconUrl: l && l.length > 0 ? l[0].url : null
+        }))
+      } : s && "stickers" in e ? {
+        hasTabs: !0,
+        tabs: r.stickers.map((l, o) => ({
+          id: l.id || `tab-${o}`,
+          label: l.label || `Set ${o + 1}`,
+          stickers: l.stickers || [],
+          iconUrl: l.iconUrl || (l.stickers && l.stickers.length > 0 ? l.stickers[0].url : null)
+        }))
+      } : {
+        hasTabs: !0,
+        tabs: [{
+          id: "default",
+          label: "Stickers",
+          stickers: r.stickers,
+          iconUrl: r.stickers.length > 0 ? r.stickers[0].url : null
+        }]
+      };
+    }, R = h(() => ke()), de = h(() => R.value.hasTabs && R.value.tabs.length > 0), y = h(() => R.value.tabs), H = h(() => {
+      var e;
+      return y.value.length === 0 ? [] : ((e = y.value[p.value]) == null ? void 0 : e.stickers) || [];
+    }), K = h(() => {
+      const e = H.value.some((s) => F(s.url)), t = y.value.some((s) => s.iconUrl && F(s.iconUrl));
+      return e || t;
+    });
+    j(K, (e) => {
+      e && !k.value && G();
+    }, { immediate: !0 });
+    const I = (e) => F(e.url), pe = (e, t) => {
+      t ? f.value.set(e, t) : f.value.delete(e);
+    }, me = (e, t) => {
+      t ? d.value.set(e, t) : d.value.delete(e);
+    }, he = (e) => {
+      const t = d.value.get(e);
+      t && typeof t.play == "function" && t.play();
+    }, _e = (e) => {
+      const t = d.value.get(e);
+      t && typeof t.pause == "function" && t.pause();
+    };
+    j(p, () => {
+      f.value.clear();
+    }), j(() => r.stickers, () => {
+      p.value >= y.value.length && (p.value = 0);
+    }, { deep: !0 });
+    const ge = (e) => {
+      if (!e) return "image";
+      const t = e.toLowerCase();
+      return t.endsWith(".tgs") || t.endsWith(".webp") ? "sticker" : "image";
+    }, q = (e) => {
+      if (r.state === "disabled") return;
+      const t = ge(e.url);
+      ie({
+        url: e.url,
+        name: e.alt || `sticker.${t === "sticker" ? e.url.toLowerCase().endsWith(".tgs") ? "tgs" : "webp" : "png"}`,
+        type: t
+      }), ue(!0), r.mode === "click" && (v.value = !1);
+    }, J = (e, t) => {
+      fe.value = t.currentTarget, u.value = !1, m.value && clearTimeout(m.value), m.value = setTimeout(() => {
+        u.value = !0, we(e);
+      }, lt);
+    }, Q = () => {
+      if (X(), u.value) {
+        u.value = !1;
+        return;
+      }
+    }, ye = (e, t) => {
+      if (I(e) && k.value) {
+        const s = f.value.get(t);
+        s && typeof s.play == "function" && s.play();
+      }
+    }, be = () => {
+      f.value.forEach((e) => {
+        e && typeof e.pause == "function" && e.pause();
+      }), !(u.value && i.value) && (X(), b());
+    }, Te = (e, t) => {
+      const s = new MouseEvent("mousedown", {
+        bubbles: !0,
+        cancelable: !0,
+        clientX: t.touches[0].clientX,
+        clientY: t.touches[0].clientY
+      });
+      J(e, s);
+    }, Z = () => {
+      Q();
+    }, Me = (e, t) => {
+      if (u.value) {
+        t.preventDefault(), t.stopPropagation(), u.value = !1, b();
+        return;
+      }
+      q(e);
+    }, X = () => {
+      m.value && (clearTimeout(m.value), m.value = null);
+    }, we = (e) => {
+      i.value = e, N.value = {
+        left: "50%",
+        top: "50%",
+        transform: "translate(-50%, -50%)"
+      };
+    }, b = () => {
+      i.value = null, N.value = {};
+    }, Se = () => {
+      i.value && (q(i.value), b());
+    }, x = () => {
+      r.state === "active" && (v.value = !0);
+    }, Y = () => {
+      f.value.forEach((e) => {
+        e && typeof e.pause == "function" && e.pause();
+      }), d.value.forEach((e) => {
+        e && typeof e.pause == "function" && e.pause();
+      }), v.value = !1;
+    }, Ee = () => {
+      r.mode === "click" && (v.value = !v.value, v.value && x());
+    }, Ce = () => {
+      r.mode === "hover" && (w = !0, x());
+    }, Pe = () => {
+      r.mode === "hover" && (w = !1, setTimeout(() => {
+        !S && !w && Y();
+      }, 150));
+    }, Le = () => {
+      B.value = !0, Ce();
+    }, Fe = () => {
+      B.value = !1, Pe();
+    }, Ue = () => {
+      r.mode === "hover" && (S = !0);
+    }, $e = () => {
+      r.mode === "hover" && (S = !1, setTimeout(() => {
+        !w && !S && Y();
+      }, 150));
+    }, De = (e) => {
+      if (!O.value) return;
+      const t = e.shiftKey || Math.abs(e.deltaX) > Math.abs(e.deltaY) ? e.deltaX : e.deltaY;
+      O.value.scrollLeft += t, e.preventDefault();
+    }, ee = (e) => {
+      r.mode === "click" && v.value && D.value && $.value && e.target instanceof Node && !D.value.contains(e.target) && !$.value.contains(e.target) && Y(), i.value && A.value && e.target instanceof Node && !A.value.contains(e.target) && b();
+    }, te = () => {
+      u.value && (u.value = !1);
+    };
+    return We(() => {
+      if (document.addEventListener("click", ee), document.addEventListener("mouseup", te), W(), _) {
+        const e = document.getElementById(_);
+        e && (g = new MutationObserver((t) => {
+          t.forEach((s) => {
+            s.type === "attributes" && s.attributeName === "data-theme" && W();
+          });
+        }), g.observe(e, {
+          attributes: !0,
+          attributeFilter: ["data-theme"]
+        }));
+      }
+      K.value && !k.value && G();
+    }), Ne(() => {
+      document.removeEventListener("click", ee), document.removeEventListener("mouseup", te), X(), b(), g && (g.disconnect(), g = null), f.value.forEach((e) => {
+        e && typeof e.pause == "function" && e.pause();
+      }), f.value.clear(), d.value.forEach((e) => {
+        e && typeof e.pause == "function" && e.pause();
+      }), d.value.clear();
+    }), (e, t) => (c(), n(z, null, [
+      P(ce)().isRecording ? E("", !0) : (c(), n("button", {
+        key: 0,
+        ref_key: "stickerButton",
+        ref: D,
+        class: se(["button", { "button-disabled": U.state === "disabled" }]),
+        onClick: Ee,
+        onMouseenter: Le,
+        onMouseleave: Fe
+      }, [
+        L("span", null, [
+          C(P(ne), { fill: ve.value }, null, 8, ["fill"])
+        ])
+      ], 34)),
+      C(le, null, {
+        default: re(() => [
+          Ve(L("div", {
+            ref_key: "stickerPicker",
+            ref: $,
+            class: "sticker-picker",
+            onMouseenter: Ue,
+            onMouseleave: $e
+          }, [
+            L("div", Xe, [
+              de.value ? (c(), n("div", {
+                key: 0,
+                ref_key: "tabsContainer",
+                ref: O,
+                class: "sticker-picker__tabs",
+                onWheel: De
+              }, [
+                (c(!0), n(z, null, oe(y.value, (s, l) => (c(), n("button", {
+                  key: l,
+                  class: se(["sticker-picker__tab", { "sticker-picker__tab--active": p.value === l }]),
+                  onClick: (o) => p.value = l,
+                  onMouseenter: (o) => he(l),
+                  onMouseleave: (o) => _e(l)
+                }, [
+                  s.iconUrl && P(F)(s.iconUrl) && k.value ? (c(), n("tgs-player", {
+                    key: 0,
+                    ref_for: !0,
+                    ref: (o) => me(l, o),
+                    src: s.iconUrl,
+                    class: "sticker-picker__tab-icon sticker-picker__tab-icon-animated",
+                    loop: "",
+                    mode: "normal"
+                  }, null, 8, je)) : s.iconUrl ? (c(), n("img", {
+                    key: 1,
+                    src: s.iconUrl,
+                    alt: s.label || `Tab ${l + 1}`,
+                    class: "sticker-picker__tab-icon"
+                  }, null, 8, ze)) : (c(), n("span", Ge, [
+                    C(P(ne))
+                  ]))
+                ], 42, Ye))), 128))
+              ], 544)) : E("", !0),
+              L("div", Ke, [
+                H.value.length === 0 ? (c(), n("div", qe, ae(U.emptyText), 1)) : (c(), n("div", Je, [
+                  (c(!0), n(z, null, oe(H.value, (s, l) => (c(), n("button", {
+                    key: l,
+                    class: "sticker-picker__item",
+                    onClick: (o) => Me(s, o),
+                    onMousedown: (o) => J(s, o),
+                    onMouseup: Q,
+                    onMouseenter: (o) => ye(s, l),
+                    onMouseleave: be,
+                    onTouchstart: (o) => Te(s, o),
+                    onTouchend: Z,
+                    onTouchcancel: Z
+                  }, [
+                    I(s) && k.value ? (c(), n("tgs-player", {
+                      key: 0,
+                      ref_for: !0,
+                      ref: (o) => pe(l, o),
+                      src: s.url,
+                      class: "sticker-picker__image sticker-picker__image-animated",
+                      loop: "",
+                      mode: "normal"
+                    }, null, 8, Ze)) : (c(), n("img", {
+                      key: 1,
+                      src: s.url,
+                      alt: s.alt || `Sticker ${l + 1}`,
+                      class: "sticker-picker__image"
+                    }, null, 8, xe))
+                  ], 40, Qe))), 128))
+                ]))
+              ])
+            ])
+          ], 544), [
+            [Re, v.value]
+          ])
+        ]),
+        _: 1
+      }),
+      C(le, { name: "preview" }, {
+        default: re(() => [
+          i.value ? (c(), n("div", {
+            key: 0,
+            ref_key: "previewElement",
+            ref: A,
+            class: "sticker-picker__preview",
+            style: He(N.value),
+            onClick: Se
+          }, [
+            I(i.value) && k.value ? (c(), n("tgs-player", {
+              key: 0,
+              src: i.value.url,
+              class: "sticker-picker__preview-image sticker-picker__preview-image-animated",
+              autoplay: "",
+              loop: "",
+              mode: "normal"
+            }, null, 8, et)) : (c(), n("img", {
+              key: 1,
+              src: i.value.url,
+              alt: i.value.alt || "Preview",
+              class: "sticker-picker__preview-image"
+            }, null, 8, tt)),
+            i.value.alt ? (c(), n("div", st, ae(i.value.alt), 1)) : E("", !0)
+          ], 4)) : E("", !0)
+        ]),
+        _: 1
+      })
+    ], 64));
+  }
+});
+export {
+  pt as default
+};

package/dist/components/2_chatinput_elements/StickerPicker/icons/StickerIcon.vue.js

@@ -1,6 +1,5 @@
-import { createElementBlock as t, openBlock as o, createStaticVNode as c } from "vue";
-import l from "../../../../_virtual/_plugin-vue_export-helper.js";
-const r = {}, n = {
+import { defineComponent as t, createElementBlock as n, openBlock as o, createElementVNode as l } from "vue";
+const i = {
   version: "1.1",
   xmlns: "http://www.w3.org/2000/svg",
   "xmlns:xlink": "http://www.w3.org/1999/xlink",
@@ -8,13 +7,59 @@ const r = {}, n = {
   height: "23px",
   viewBox: "42.67 42.67 170.66 170.66",
   overflow: "visible"
-};
-function i(f, e) {
-  return o(), t("svg", n, [...e[0] || (e[0] = [
-    c('<g fill="none" fill-rule="nonzero" stroke="none" stroke-width="1" stroke-linecap="butt" stroke-linejoin="miter" stroke-miterlimit="10" stroke-dasharray="" stroke-dashoffset="0" font-family="none" font-weight="none" font-size="none" text-anchor="none" style="mix-blend-mode:normal;"><g transform="scale(5.33333,5.33333)"><path d="M28.921,42.016l-14.366,-0.016c-4.717,0 -8.555,-3.838 -8.555,-8.556v-18.888c0,-4.718 3.838,-8.556 8.556,-8.556h18.889c4.717,0 8.555,3.838 8.555,8.556v14.554zM14.556,8c-3.615,0 -6.556,2.94 -6.556,6.556v18.889c0,3.615 2.941,6.555 6.556,6.555l13.546,0.016l11.898,-11.742v-13.718c0,-3.616 -2.941,-6.556 -6.556,-6.556z" fill="#5f5f5f"></path><circle cx="16.047" cy="19.023" r="2" fill="#5f5f5f"></circle><circle cx="31.938" cy="19.023" r="2" fill="#5f5f5f"></circle><path d="M23.984,33.016c-3.042,0 -5.872,-1.326 -7.387,-3.461c-0.32,-0.451 -0.214,-1.075 0.237,-1.395c0.452,-0.32 1.074,-0.213 1.394,0.236c1.146,1.615 3.352,2.619 5.756,2.619c2.428,0 4.643,-1.018 5.781,-2.655c0.316,-0.453 0.939,-0.564 1.392,-0.25c0.454,0.315 0.565,0.938 0.25,1.393c-1.506,2.167 -4.35,3.513 -7.423,3.513z" fill="#5f5f5f"></path><path d="M41.972,26.004h-6.839c-5.034,0 -9.13,4.111 -9.13,9.164l0.013,6.832h3.023l12.933,-12.867z" fill="#5f5f5f"></path></g></g>', 1)
-  ])]);
-}
-const h = /* @__PURE__ */ l(r, [["render", i]]);
+}, c = {
+  fill: "none",
+  "fill-rule": "nonzero",
+  stroke: "none",
+  "stroke-width": "1",
+  "stroke-linecap": "butt",
+  "stroke-linejoin": "miter",
+  "stroke-miterlimit": "10",
+  "stroke-dasharray": "",
+  "stroke-dashoffset": "0",
+  "font-family": "none",
+  "font-weight": "none",
+  "font-size": "none",
+  "text-anchor": "none",
+  style: { "mix-blend-mode": "normal" }
+}, s = { transform: "scale(5.33333,5.33333)" }, r = ["fill"], f = ["fill"], h = ["fill"], a = ["fill"], d = ["fill"], x = /* @__PURE__ */ t({
+  __name: "StickerIcon",
+  props: {
+    fill: { default: "#5F5F5F" }
+  },
+  setup(e) {
+    return (m, _) => (o(), n("svg", i, [
+      l("g", c, [
+        l("g", s, [
+          l("path", {
+            d: "M28.921,42.016l-14.366,-0.016c-4.717,0 -8.555,-3.838 -8.555,-8.556v-18.888c0,-4.718 3.838,-8.556 8.556,-8.556h18.889c4.717,0 8.555,3.838 8.555,8.556v14.554zM14.556,8c-3.615,0 -6.556,2.94 -6.556,6.556v18.889c0,3.615 2.941,6.555 6.556,6.555l13.546,0.016l11.898,-11.742v-13.718c0,-3.616 -2.941,-6.556 -6.556,-6.556z",
+            fill: e.fill
+          }, null, 8, r),
+          l("circle", {
+            cx: "16.047",
+            cy: "19.023",
+            r: "2",
+            fill: e.fill
+          }, null, 8, f),
+          l("circle", {
+            cx: "31.938",
+            cy: "19.023",
+            r: "2",
+            fill: e.fill
+          }, null, 8, h),
+          l("path", {
+            d: "M23.984,33.016c-3.042,0 -5.872,-1.326 -7.387,-3.461c-0.32,-0.451 -0.214,-1.075 0.237,-1.395c0.452,-0.32 1.074,-0.213 1.394,0.236c1.146,1.615 3.352,2.619 5.756,2.619c2.428,0 4.643,-1.018 5.781,-2.655c0.316,-0.453 0.939,-0.564 1.392,-0.25c0.454,0.315 0.565,0.938 0.25,1.393c-1.506,2.167 -4.35,3.513 -7.423,3.513z",
+            fill: e.fill
+          }, null, 8, a),
+          l("path", {
+            d: "M41.972,26.004h-6.839c-5.034,0 -9.13,4.111 -9.13,9.164l0.013,6.832h3.023l12.933,-12.867z",
+            fill: e.fill
+          }, null, 8, d)
+        ])
+      ])
+    ]));
+  }
+});
 export {
-  h as default
+  x as default
 };

package/dist/components/2_chatinput_elements/StickerPicker/icons/StickerIcon.vue2.js

@@ -0,0 +1,4 @@
+import f from "./StickerIcon.vue.js";
+export {
+  f as default
+};

package/dist/components/2_chatlist_elements/ChatItem/ChatItem.vue.js

@@ -1,7 +1,7 @@
 import t from "./ChatItem.vue2.js";
 /* empty css              */
 import o from "../../../_virtual/_plugin-vue_export-helper.js";
-const e = /* @__PURE__ */ o(t, [["__scopeId", "data-v-96cbe09d"]]);
+const a = /* @__PURE__ */ o(t, [["__scopeId", "data-v-f453fe25"]]);
 export {
-  e as default
+  a as default
 };