@mobilon-dev/chotto 0.3.106 → 0.3.107

package/dist/components/3_compounds/Feed/composables/useFeedProgressiveRender.js

@@ -1,79 +1,82 @@
-import { ref as y, computed as H, watch as C, onUnmounted as I, nextTick as p } from "vue";
-const K = 28, B = 24;
-function F(a, s) {
-  var t;
-  return ((t = a[s]) == null ? void 0 : t.messageId) ?? "";
+import { ref as C, computed as H, watch as I, nextTick as B, onUnmounted as K } from "vue";
+const M = 28, d = 24;
+function F(u, n) {
+  var l;
+  return ((l = u[n]) == null ? void 0 : l.messageId) ?? "";
 }
-function _({
-  objectsRef: a,
-  feedRef: s
+function b({
+  objectsRef: u,
+  feedRef: n
 }) {
-  const t = y(0);
-  let u = "", g = "", r = 0, v = 0, i = 0;
-  const k = H(() => a.value.slice(t.value)), A = H(() => t.value > 0);
-  function h() {
-    v += 1, i && (cancelAnimationFrame(i), i = 0);
+  const l = C(0);
+  let v = "", p = "", i = 0, h = 0, a = 0;
+  const k = H(() => u.value.slice(l.value)), A = H(() => l.value > 0);
+  function g() {
+    h += 1, a && (cancelAnimationFrame(a), a = 0);
   }
-  function d(e, o, l) {
-    const n = s.value;
-    if (!n) return;
-    const c = n.style.scrollBehavior;
-    n.style.scrollBehavior = "auto", l ? n.scrollTop = n.scrollHeight : n.scrollTop = o + (n.scrollHeight - e), requestAnimationFrame(() => {
-      n.style.scrollBehavior = c;
+  function T(e, o, t) {
+    const r = n.value;
+    if (!r) return;
+    const c = r.style.scrollBehavior;
+    r.style.scrollBehavior = "auto", t ? r.scrollTop = r.scrollHeight : r.scrollTop = o + (r.scrollHeight - e), requestAnimationFrame(() => {
+      r.style.scrollBehavior = c;
     });
   }
   function f() {
-    const e = ++v, o = () => {
-      if (i = 0, e !== v || t.value <= 0) return;
-      const l = s.value, n = (l == null ? void 0 : l.scrollHeight) ?? 0, c = (l == null ? void 0 : l.scrollTop) ?? 0, m = l ? l.scrollHeight - l.scrollTop - l.clientHeight < 140 : !0;
-      t.value = Math.max(0, t.value - B), p(() => {
-        d(n, c, m), e === v && t.value > 0 && (i = requestAnimationFrame(o));
+    const e = ++h, o = () => {
+      if (a = 0, e !== h || l.value <= 0) return;
+      const t = n.value, r = (t == null ? void 0 : t.scrollHeight) ?? 0, c = (t == null ? void 0 : t.scrollTop) ?? 0, m = t ? t.scrollHeight - t.scrollTop - t.clientHeight < 140 : !0;
+      l.value = Math.max(0, l.value - d), B(() => {
+        T(r, c, m), e === h && l.value > 0 && (a = requestAnimationFrame(o));
       });
     };
-    i = requestAnimationFrame(o);
+    a = requestAnimationFrame(o);
   }
-  function T(e) {
-    t.value = Math.max(0, e - K), t.value > 0 && f();
+  function y(e) {
+    l.value = Math.max(0, e - M), l.value > 0 && f();
   }
   function E(e) {
     if (e < 0) return;
     const o = Math.max(0, e - 8);
-    o < t.value && (t.value = o, t.value > 0 && f());
+    o < l.value && (l.value = o, l.value > 0 && f());
   }
   function L() {
-    if (t.value <= 0) return;
-    const e = s.value, o = (e == null ? void 0 : e.scrollHeight) ?? 0, l = (e == null ? void 0 : e.scrollTop) ?? 0, n = e ? e.scrollHeight - e.scrollTop - e.clientHeight < 140 : !1;
-    t.value = Math.max(0, t.value - B * 2), p(() => {
-      d(o, l, n), t.value > 0 && f();
+    if (l.value <= 0) return;
+    const e = n.value, o = (e == null ? void 0 : e.scrollHeight) ?? 0, t = (e == null ? void 0 : e.scrollTop) ?? 0, r = e ? e.scrollHeight - e.scrollTop - e.clientHeight < 140 : !1;
+    l.value = Math.max(0, l.value - d * 2), B(() => {
+      T(o, t, r), l.value > 0 && f();
     });
   }
-  return C(
-    () => a.value,
+  return I(
+    () => u.value,
     (e) => {
-      const o = F(e, 0), l = F(e, e.length - 1), n = r > 0 && e.length > r && l === g && o !== u, c = r > 0 && e.length > r && o === u, m = o === u && l === g && e.length === r;
+      const o = F(e, 0), t = F(e, e.length - 1), r = i > 0 && e.length > i && t === p && o !== v, c = i > 0 && e.length > i && o === v, m = o === v && t === p && e.length === i;
       if (e.length === 0)
-        h(), t.value = 0;
-      else if (!m) if (n) {
-        const q = e.length - r;
-        t.value > 0 && (t.value += q, f());
-      } else c || (r === 0 ? (h(), T(e.length)) : (h(), t.value = e.length, p(() => {
-        requestAnimationFrame(() => {
-          T(a.value.length);
+        g(), l.value = 0;
+      else if (!m) if (r) {
+        const s = e.length - i;
+        l.value > 0 && (l.value += s, f());
+      } else c || (g(), y(e.length), B(() => {
+        const s = n.value;
+        if (!s) return;
+        const q = s.style.scrollBehavior;
+        s.style.scrollBehavior = "auto", s.scrollTop = s.scrollHeight, requestAnimationFrame(() => {
+          s.scrollTop = s.scrollHeight, s.style.scrollBehavior = q;
         });
-      })));
-      u = o, g = l, r = e.length;
+      }));
+      v = o, p = t, i = e.length;
     },
     { immediate: !0 }
-  ), I(h), {
+  ), K(g), {
     visibleObjects: k,
-    renderStart: t,
+    renderStart: l,
     isBackfilling: A,
     revealThroughIndex: E,
     accelerateBackfill: L
   };
 }
 export {
-  B as FEED_BACKFILL_CHUNK,
-  K as FEED_TAIL_CHUNK,
-  _ as useFeedProgressiveRender
+  d as FEED_BACKFILL_CHUNK,
+  M as FEED_TAIL_CHUNK,
+  b as useFeedProgressiveRender
 };

package/dist/components/3_compounds/Feed/composables/useFeedReactionsOverlay.js

@@ -0,0 +1,34 @@
+import { shallowRef as l, computed as v, provide as s, inject as i } from "vue";
+const c = Symbol("feedReactionsConsumer"), f = Symbol("feedReactionsState");
+let e = null;
+function d(n) {
+  e = n;
+}
+function S() {
+  const n = l(null), u = v(() => {
+    var o;
+    return ((o = n.value) == null ? void 0 : o.anchorEl) ?? null;
+  });
+  return s(c, {
+    activate(o) {
+      n.value = o, e == null || e.onMessageEnter();
+    },
+    handlePointerLeave(o, t, r) {
+      if (!n.value || n.value.anchorEl !== t) return;
+      const a = o.relatedTarget;
+      a instanceof Node && (t != null && t.contains(a) || r != null && r.contains(a) || e != null && e.containsNode(a)) || (e == null || e.onMessageLeave(), e != null && e.isPanelOpen() || (n.value = null));
+    }
+  }), s(f, { activeTarget: n, anchorRef: u }), { activeTarget: n, anchorRef: u };
+}
+function F() {
+  return i(c, null);
+}
+function O() {
+  return i(f, null);
+}
+export {
+  S as provideFeedReactionsOverlay,
+  d as registerFeedReactionsPanelBridge,
+  F as useFeedReactionsConsumer,
+  O as useFeedReactionsOverlayState
+};

package/dist/hooks/messages/useMessageActions.js

@@ -1,103 +1,114 @@
-import { ref as u, inject as L, computed as C, watch as P, onMounted as H, onUnmounted as x, nextTick as O } from "vue";
+import { ref as u, inject as P, computed as x, watch as z, onMounted as D, onUnmounted as O, nextTick as S } from "vue";
 import { useConfirmDeleteMessage as j } from "../modals/useConfirmDeleteMessage.js";
 import { useTheme as B } from "../useTheme.js";
-import { calculateMessageMenuPosition as D } from "./calculateMessageMenuPosition.js";
-function m(t) {
-  if (!t) return null;
-  if (t instanceof HTMLElement) return t;
-  const o = t.$el;
-  return o instanceof HTMLElement ? o : null;
+import { calculateMessageMenuPosition as U } from "./calculateMessageMenuPosition.js";
+function g(e) {
+  if (!e) return null;
+  if (e instanceof HTMLElement) return e;
+  const n = e.$el;
+  return n instanceof HTMLElement ? n : null;
 }
-function M(t) {
-  if (!t) return null;
-  if (t instanceof Event) {
-    const o = t.currentTarget;
-    if (o instanceof HTMLElement) {
-      const n = o.getBoundingClientRect();
-      return { top: n.top, right: n.right, bottom: n.bottom, left: n.left, width: n.width, height: n.height };
+const f = /* @__PURE__ */ new Set();
+function w(e) {
+  for (const n of f)
+    n(e);
+}
+function V(e) {
+  return f.size === 0 && document.addEventListener("click", w, !0), f.add(e), () => {
+    f.delete(e), f.size === 0 && document.removeEventListener("click", w, !0);
+  };
+}
+function T(e) {
+  if (!e) return null;
+  if (e instanceof Event) {
+    const n = e.currentTarget;
+    if (n instanceof HTMLElement) {
+      const i = n.getBoundingClientRect();
+      return { top: i.top, right: i.right, bottom: i.bottom, left: i.left, width: i.width, height: i.height };
     }
     return null;
   }
-  return "triggerRect" in t && t.triggerRect ? t.triggerRect : "event" in t && t.event instanceof Event ? M(t.event) : "top" in t && "left" in t && "bottom" in t && "right" in t ? t : null;
+  return "triggerRect" in e && e.triggerRect ? e.triggerRect : "event" in e && e.event instanceof Event ? T(e.event) : "top" in e && "left" in e && "bottom" in e && "right" in e ? e : null;
 }
-const F = (t, o, n = {}) => {
-  const r = u(!1), a = u(!1), d = u(null), c = u(null), g = u({}), f = u(null), w = L("chatAppId", void 0), { getTheme: T } = B(w || ""), R = C(() => T().theme || "light"), y = () => {
-    a.value = !0;
-  }, E = (e) => {
-    const i = m(c.value);
-    e != null && e.relatedTarget && (i != null && i.contains(e.relatedTarget)) || (a.value = !1);
+const N = (e, n, i = {}) => {
+  const r = u(!1), c = u(!1), h = u(null), a = u(null), v = u({}), d = u(null), R = P("chatAppId", void 0), { getTheme: k } = B(R || ""), y = x(() => k().theme || "light"), E = () => {
+    c.value = !0;
+  }, A = (t) => {
+    const o = g(a.value);
+    t != null && t.relatedTarget && (o != null && o.contains(t.relatedTarget)) || (c.value = !1);
   }, s = () => {
-    a.value = !1, r.value = !1, f.value = null;
-  }, k = () => {
-    a.value = !0;
-  }, A = () => {
+    c.value = !1, r.value = !1, d.value = null;
+  }, C = () => {
+    c.value = !0;
+  }, b = () => {
     s();
-  }, h = (e) => {
-    f.value = M(e), r.value = !0;
-  }, b = (e) => {
+  }, M = (t) => {
+    d.value = T(t), r.value = !0;
+  }, I = (t) => {
     if (r.value) {
       s();
       return;
     }
-    h(e);
+    M(t);
   };
-  async function I() {
-    await O();
-    let e = 0;
-    for (; !m(c.value) && e < 20; )
-      await new Promise((l) => setTimeout(l, 10)), e++;
-    const i = m(c.value);
-    for (e = 0; i && i.offsetWidth === 0 && e < 10; )
-      await new Promise((l) => setTimeout(l, 10)), e++;
-    g.value = await D(i, {
-      triggerRect: f.value,
-      boundsElement: d.value
+  async function L() {
+    await S();
+    let t = 0;
+    for (; !g(a.value) && t < 20; )
+      await new Promise((l) => setTimeout(l, 10)), t++;
+    const o = g(a.value);
+    for (t = 0; o && o.offsetWidth === 0 && t < 10; )
+      await new Promise((l) => setTimeout(l, 10)), t++;
+    v.value = await U(o, {
+      triggerRect: d.value,
+      boundsElement: h.value
     });
   }
-  P(r, async (e) => {
-    e ? await I() : (g.value = {}, f.value = null);
+  z(r, async (t) => {
+    t ? await L() : (v.value = {}, d.value = null);
   });
-  function p(e) {
+  function H(t) {
     if (!r.value) return;
-    const i = e.target, l = m(c.value), v = d.value;
-    l != null && l.contains(i) || v != null && v.contains(i) || s();
+    const o = t.target, l = g(a.value), p = h.value;
+    l != null && l.contains(o) || p != null && p.contains(o) || s();
   }
-  return H(() => {
-    document.addEventListener("click", p, !0);
-  }), x(() => {
-    document.removeEventListener("click", p, !0);
+  let m;
+  return D(() => {
+    m = V(H);
+  }), O(() => {
+    m == null || m();
   }), {
     isOpenMenu: r,
-    buttonMenuVisible: a,
-    menuAnchorRef: d,
-    menuRef: c,
-    menuStyle: g,
-    menuTheme: R,
-    showMenu: y,
-    hideMenu: E,
-    openMenu: h,
-    toggleMenu: b,
-    onMenuMouseEnter: k,
-    onMenuMouseLeave: A,
-    clickAction: async (e) => {
-      if (s(), e.action === "reply" && n.onReply) {
-        n.onReply();
+    buttonMenuVisible: c,
+    menuAnchorRef: h,
+    menuRef: a,
+    menuStyle: v,
+    menuTheme: y,
+    showMenu: E,
+    hideMenu: A,
+    openMenu: M,
+    toggleMenu: I,
+    onMenuMouseEnter: C,
+    onMenuMouseLeave: b,
+    clickAction: async (t) => {
+      if (s(), t.action === "reply" && i.onReply) {
+        i.onReply();
         return;
       }
-      if (e.action === "edit" && n.onEdit) {
-        n.onEdit();
+      if (t.action === "edit" && i.onEdit) {
+        i.onEdit();
         return;
       }
-      e.action === "delete" && !await j() || o("action", { messageId: t.messageId, type: "menu", ...e });
+      t.action === "delete" && !await j() || n("action", { messageId: e.messageId, type: "menu", ...t });
     },
     viewsAction: () => {
-      s(), o("action", { messageId: t.messageId, type: "views" });
+      s(), n("action", { messageId: e.messageId, type: "views" });
     },
-    handleClickReplied: (e) => {
-      o("reply", e);
+    handleClickReplied: (t) => {
+      n("reply", t);
     }
   };
 };
 export {
-  F as useMessageActions
+  N as useMessageActions
 };

package/dist/hooks/messages/useMessageReactionsInFeed.js

@@ -0,0 +1,53 @@
+import { provide as l, toValue as t } from "vue";
+import { useFeedReactionsConsumer as m } from "../../components/3_compounds/Feed/composables/useFeedReactionsOverlay.js";
+import { useMessageReactionsMount as d } from "./useMessageReactionsMount.js";
+const f = Symbol(
+  "messageReactionsPatch"
+);
+function E(e) {
+  const { showReactions: s, engageReactionsMount: o } = d(
+    e.reactions,
+    e.reactionsActive
+  ), c = m();
+  function r(a) {
+    const n = t(e.message);
+    n.reactions = a;
+  }
+  l(f, r);
+  function u() {
+    var n;
+    if (!t(e.reactionsActive)) return;
+    o();
+    const a = e.contentRef.value;
+    !a || !c || c.activate({
+      messageId: t(e.messageId),
+      anchorEl: a,
+      chipsEl: ((n = e.chipsRef) == null ? void 0 : n.value) ?? null,
+      reactions: t(e.reactions),
+      reply: t(e.reply),
+      replyEnabled: !0,
+      menuEnabled: t(e.menuEnabled),
+      mode: t(e.reactionsMode),
+      enabled: !0,
+      handlers: e.handlers,
+      patchReactions: r
+    });
+  }
+  function i(a) {
+    var n;
+    c == null || c.handlePointerLeave(
+      a,
+      e.contentRef.value,
+      ((n = e.chipsRef) == null ? void 0 : n.value) ?? void 0
+    );
+  }
+  return {
+    showReactions: s,
+    onContentPointerEnter: u,
+    onContentPointerLeave: i
+  };
+}
+export {
+  f as MESSAGE_REACTIONS_PATCH_KEY,
+  E as useMessageReactionsInFeed
+};

package/dist/hooks/messages/useMessageReactionsMount.js

@@ -0,0 +1,21 @@
+import { ref as g, computed as s, toValue as a } from "vue";
+function m(r, u) {
+  const e = g(!1), t = s(() => {
+    var o;
+    const n = (o = a(r)) == null ? void 0 : o.items;
+    return Array.isArray(n) && n.length > 0;
+  }), c = s(
+    () => a(u) && (t.value || e.value)
+  );
+  function i() {
+    e.value = !0;
+  }
+  return {
+    showReactions: c,
+    engageReactionsMount: i,
+    hasReactionItems: t
+  };
+}
+export {
+  m as useMessageReactionsMount
+};