@streamlayer/react 1.24.6 → 1.24.8-pre.11da316

package/lib/es/analytics.js

@@ -1,8 +1,11 @@
-import { useEffect as c } from "react";
-import { e as s } from "./index3.js";
-import { A as v } from "./index9.js";
-let i = [], r = 0;
-const u = 4, d = /* @__NO_SIDE_EFFECTS__ */ (a) => {
+import "./feature.js";
+import { a as c } from "./useStreamLayerApp2.js";
+import { useEffect as v } from "react";
+import { e as u } from "./index3.js";
+import { A as m } from "./index9.js";
+const A = (a) => c(a);
+let o = [], r = 0;
+const s = 4, p = /* @__NO_SIDE_EFFECTS__ */ (a) => {
   let e = [], t = {
     get() {
       return t.lc || t.listen(() => {
@@ -11,24 +14,24 @@ const u = 4, d = /* @__NO_SIDE_EFFECTS__ */ (a) => {
     lc: 0,
     listen(n) {
       return t.lc = e.push(n), () => {
-        for (let o = r + u; o < i.length; )
-          i[o] === n ? i.splice(o, u) : o += u;
+        for (let i = r + s; i < o.length; )
+          o[i] === n ? o.splice(i, s) : i += s;
         let l = e.indexOf(n);
         ~l && (e.splice(l, 1), --t.lc || t.off());
       };
     },
     notify(n, l) {
-      let o = !i.length;
+      let i = !o.length;
       for (let f of e)
-        i.push(f, t.value, n, l);
-      if (o) {
-        for (r = 0; r < i.length; r += u)
-          i[r](
-            i[r + 1],
-            i[r + 2],
-            i[r + 3]
+        o.push(f, t.value, n, l);
+      if (i) {
+        for (r = 0; r < o.length; r += s)
+          o[r](
+            o[r + 1],
+            o[r + 2],
+            o[r + 3]
           );
-        i.length = 0;
+        o.length = 0;
       }
     },
     /* It will be called on last listener unsubscribing.
@@ -46,8 +49,8 @@ const u = 4, d = /* @__NO_SIDE_EFFECTS__ */ (a) => {
     value: a
   };
   return t;
-}, b = /* @__NO_SIDE_EFFECTS__ */ (a = {}) => {
-  let e = /* @__PURE__ */ d(a);
+}, E = /* @__NO_SIDE_EFFECTS__ */ (a = {}) => {
+  let e = /* @__PURE__ */ p(a);
   return e.setKey = function(t, n) {
     let l = e.value;
     typeof n > "u" && t in e.value ? (e.value = { ...e.value }, delete e.value[t], e.notify(l, t)) : e.value[t] !== n && (e.value = {
@@ -55,20 +58,20 @@ const u = 4, d = /* @__NO_SIDE_EFFECTS__ */ (a) => {
       [t]: n
     }, e.notify(l, t));
   }, e;
-}, y = (a) => [(e) => (...t) => (a && s.emit(a?.type, a), e ? e(t) : null)], h = (a) => {
+}, w = (a) => [(e) => (...t) => (a && u.emit(a?.type, a), e ? e(t) : null)], x = (a) => {
   const e = a.target;
-  e instanceof HTMLAnchorElement && e.target === "_blank" && e.getAttribute("data-a") === "web-link" && s.emit("poll", {
+  e instanceof HTMLAnchorElement && e.target === "_blank" && e.getAttribute("data-a") === "web-link" && u.emit("poll", {
     action: "navigated",
     payload: {}
-  }), e instanceof Element && e.getAttribute("data-a") === "intr" && s.emit("interactions", {
+  }), e instanceof Element && e.getAttribute("data-a") === "intr" && u.emit("interactions", {
     action: "tap",
     payload: {}
   });
-}, A = (a, e) => {
-  const t = window.innerWidth < v.xl;
-  c(() => {
-    const n = t && e.useDomNode ? document : a.current, l = (o) => {
-      e.listener(o, a);
+}, L = (a, e) => {
+  const t = window.innerWidth < m.xl;
+  v(() => {
+    const n = t && e.useDomNode ? document : a.current, l = (i) => {
+      e.listener(i, a);
     };
     return e.enabled && n?.addEventListener(e.event, l), () => {
       n?.removeEventListener(e.event, l);
@@ -76,9 +79,10 @@ const u = 4, d = /* @__NO_SIDE_EFFECTS__ */ (a) => {
   }, [t, e.enabled, e.listener]);
 };
 export {
-  A,
-  h as a,
-  d as b,
-  b as f,
-  y as u
+  L as A,
+  x as a,
+  p as b,
+  A as c,
+  E as f,
+  w as u
 };

package/lib/es/auth.js

@@ -1,5 +1,5 @@
 import { useEffect as o } from "react";
-import { Y as f } from "./hooks-n9ax4LRT.js";
+import { w as f } from "./hooks-42q2i9Iw.js";
 const p = ({ token: t, schema: i }) => {
   const r = f();
   return o(() => {

package/lib/es/bet-pack.js

@@ -3,7 +3,7 @@ import { e as i } from "./index3.js";
 import { useEffect as n } from "react";
 import "./feature.js";
 import { D as c } from "./index4.js";
-import { Y as m } from "./hooks-n9ax4LRT.js";
+import { w as m } from "./hooks-42q2i9Iw.js";
 const r = (t) => {
   const e = t.target;
   e instanceof Element && e.getAttribute("data-a") === "intr" && i.emit("interactions", {

package/lib/es/feature.js

@@ -1,23 +1,27 @@
 import y, { forwardRef as A, createElement as O } from "react";
-import { listenKeys as _ } from "nanostores";
-import { pino as M } from "pino";
-import { S as g } from "./useStreamLayerApp2.js";
+import { e as _, S as g } from "./useStreamLayerApp2.js";
+function M(e, t, n) {
+  let r = new Set(t).add(void 0);
+  return e.listen((o, a, c) => {
+    r.has(c) && n(o, a, c);
+  });
+}
 var B = function() {
   const t = Array.prototype.slice.call(arguments).filter(Boolean), n = {}, r = [];
   t.forEach((a) => {
-    (a ? a.split(" ") : []).forEach((c) => {
-      if (c.startsWith("atm_")) {
-        const [, p] = c.split("_");
-        n[p] = c;
+    (a ? a.split(" ") : []).forEach((u) => {
+      if (u.startsWith("atm_")) {
+        const [, p] = u.split("_");
+        n[p] = u;
       } else
-        r.push(c);
+        r.push(u);
     });
   });
   const o = [];
   for (const a in n)
     Object.prototype.hasOwnProperty.call(n, a) && o.push(n[a]);
   return o.push(...r), o.join(" ");
-}, R = B;
+}, T = B;
 function D(e) {
   var t = /* @__PURE__ */ Object.create(null);
   return function(n) {
@@ -50,31 +54,31 @@ var V = (e, t) => {
 function F(e) {
   let t = "";
   return (n) => {
-    const r = (a, d) => {
-      const { as: c = e, class: p = t } = a, v = n.propsAsIs === void 0 ? !(typeof c == "string" && c.indexOf("-") === -1 && !j(c[0])) : n.propsAsIs, u = z(v, a, [
+    const r = (a, c) => {
+      const { as: u = e, class: p = t } = a, v = n.propsAsIs === void 0 ? !(typeof u == "string" && u.indexOf("-") === -1 && !j(u[0])) : n.propsAsIs, d = z(v, a, [
         "as",
         "class"
       ]);
-      u.ref = d, u.className = n.atomic ? R(n.class, u.className || p) : R(u.className || p, n.class);
-      const { vars: i } = n;
-      if (i) {
-        const s = {};
-        for (const l in i) {
-          const h = i[l], S = h[0], N = h[1] || "", b = typeof S == "function" ? S(a) : S;
-          V(b, n.name), s[`--${l}`] = `${b}${N}`;
+      d.ref = c, d.className = n.atomic ? T(n.class, d.className || p) : T(d.className || p, n.class);
+      const { vars: s } = n;
+      if (s) {
+        const i = {};
+        for (const l in s) {
+          const h = s[l], S = h[0], N = h[1] || "", b = typeof S == "function" ? S(a) : S;
+          V(b, n.name), i[`--${l}`] = `${b}${N}`;
         }
-        const f = u.style || {}, m = Object.keys(f);
+        const f = d.style || {}, m = Object.keys(f);
         m.length > 0 && m.forEach((l) => {
-          s[l] = f[l];
-        }), u.style = s;
+          i[l] = f[l];
+        }), d.style = i;
       }
-      return e.__wyw_meta && e !== c ? (u.as = c, O(e, u)) : O(c, u);
+      return e.__wyw_meta && e !== u ? (d.as = u, O(e, d)) : O(u, d);
     }, o = A ? A(r) : (
       // React.forwardRef won't available on older React versions and in Preact
       // Fallback to a innerRef prop in that case
       ((a) => {
-        const d = U(a, ["innerRef"]);
-        return r(d, a.innerRef);
+        const c = U(a, ["innerRef"]);
+        return r(c, a.innerRef);
       })
     );
     return o.displayName = n.name, o.__wyw_meta = {
@@ -83,47 +87,47 @@ function F(e) {
     }, o;
   };
 }
-var ae = F, E = { exports: {} }, k = {};
-var T;
+var ne = F, E = { exports: {} }, k = {};
+var R;
 function G() {
-  if (T) return k;
-  T = 1;
+  if (R) return k;
+  R = 1;
   var e = y;
-  function t(i, s) {
-    return i === s && (i !== 0 || 1 / i === 1 / s) || i !== i && s !== s;
+  function t(s, i) {
+    return s === i && (s !== 0 || 1 / s === 1 / i) || s !== s && i !== i;
   }
-  var n = typeof Object.is == "function" ? Object.is : t, r = e.useState, o = e.useEffect, a = e.useLayoutEffect, d = e.useDebugValue;
-  function c(i, s) {
-    var f = s(), m = r({ inst: { value: f, getSnapshot: s } }), l = m[0].inst, h = m[1];
+  var n = typeof Object.is == "function" ? Object.is : t, r = e.useState, o = e.useEffect, a = e.useLayoutEffect, c = e.useDebugValue;
+  function u(s, i) {
+    var f = i(), m = r({ inst: { value: f, getSnapshot: i } }), l = m[0].inst, h = m[1];
     return a(
       function() {
-        l.value = f, l.getSnapshot = s, p(l) && h({ inst: l });
+        l.value = f, l.getSnapshot = i, p(l) && h({ inst: l });
       },
-      [i, f, s]
+      [s, f, i]
     ), o(
       function() {
-        return p(l) && h({ inst: l }), i(function() {
+        return p(l) && h({ inst: l }), s(function() {
           p(l) && h({ inst: l });
         });
       },
-      [i]
-    ), d(f), f;
+      [s]
+    ), c(f), f;
   }
-  function p(i) {
-    var s = i.getSnapshot;
-    i = i.value;
+  function p(s) {
+    var i = s.getSnapshot;
+    s = s.value;
     try {
-      var f = s();
-      return !n(i, f);
+      var f = i();
+      return !n(s, f);
     } catch {
       return !0;
     }
   }
-  function v(i, s) {
-    return s();
+  function v(s, i) {
+    return i();
   }
-  var u = typeof window > "u" || typeof window.document > "u" || typeof window.document.createElement > "u" ? v : c;
-  return k.useSyncExternalStore = e.useSyncExternalStore !== void 0 ? e.useSyncExternalStore : u, k;
+  var d = typeof window > "u" || typeof window.document > "u" || typeof window.document.createElement > "u" ? v : u;
+  return k.useSyncExternalStore = e.useSyncExternalStore !== void 0 ? e.useSyncExternalStore : d, k;
 }
 var C;
 function W() {
@@ -136,15 +140,15 @@ const w = (e, t) => (n) => {
 function X(e, { keys: t, deps: n = [e, t] } = {}) {
   const r = y.useRef();
   r.current = e.get();
-  const o = y.useCallback((d) => (w(r, d)(e.value), t?.length > 0 ? _(e, t, w(r, d)) : e.listen(w(r, d))), n), a = () => r.current;
+  const o = y.useCallback((c) => (w(r, c)(e.value), t?.length > 0 ? M(e, t, w(r, c)) : e.listen(w(r, c))), n), a = () => r.current;
   return y.useSyncExternalStore ? y.useSyncExternalStore(o, a, a) : $.useSyncExternalStore(o, a, a);
 }
-const ie = X, K = () => [
+const re = X, K = () => [
   !1,
   (e) => {
     window.requestAnimationFrame(() => e());
   }
-], se = y.useTransition || K, Y = M({
+], ae = y.useTransition || K, Y = _.pino({
   level: "trace",
   enabled: typeof window < "u" && !!window.localStorage.getItem("SL_DEBUG"),
   browser: {
@@ -160,7 +164,7 @@ class Z extends Event {
   }
 }
 const J = Q("event-bus");
-class oe {
+class se {
   name;
   listeners;
   constructor(t = "sl-event-bus") {
@@ -199,12 +203,12 @@ var L;
   e.Ready = "ready", e.Suspended = "suspended";
 })(L || (L = {}));
 export {
-  oe as E,
+  se as E,
   L as F,
   I as N,
   Q as a,
-  se as b,
-  R as c,
-  ae as s,
-  ie as u
+  ae as b,
+  T as c,
+  ne as s,
+  re as u
 };

package/lib/{classic/es/hooks-n9ax4LRT.js → es/hooks-42q2i9Iw.js}

@@ -1,6 +1,6 @@
-import { useRef as w, useMemo as A, useEffect as r, useContext as l, useState as b, createContext as N } from "react";
+import { useRef as A, useMemo as N, useEffect as r, useContext as l, useState as b, createContext as L } from "react";
 import { jsxs as O, jsx as T } from "react/jsx-runtime";
-import { z as L } from "./useStreamLayerApp2.js";
+import { B } from "./useStreamLayerApp2.js";
 const x = ({
   event: e,
   internal: i
@@ -14,13 +14,13 @@ var M = /* @__PURE__ */ ((e) => (e[e.UNSET = 0] = "UNSET", e[e.CONNECTED = 1] =
 const H = {
   status: 0,
   sdk: null
-}, d = N(H), F = ({
+}, d = L(H), F = ({
   sdkKey: e,
   theme: i,
   themeMode: o,
   plugins: n,
   children: h,
-  event: v,
+  event: k,
   production: y = !0,
   autoEnable: f = !0,
   withAdNotification: C,
@@ -32,11 +32,12 @@ const H = {
   onDeepLinkHandled: s,
   videoPlayerController: a,
   onContentActivate: g,
-  containerId: k,
-  webOS: D,
-  gamification: K
+  mobileBreakpoint: D,
+  containerId: m,
+  webOS: K,
+  gamification: P
 }) => {
-  const t = L({
+  const t = B({
     sdkKey: e,
     plugins: n,
     production: y,
@@ -50,12 +51,13 @@ const H = {
     withAd: E,
     friendsTab: p,
     betPack: u,
-    webOS: D,
-    gamification: K
-  }), m = w(""), P = A(() => t ? { sdk: t, status: 2, event: m } : { status: 1, sdk: null, event: m }, [t]);
+    webOS: K,
+    gamification: P,
+    mobileBreakpoint: D
+  }), v = A(""), w = N(() => t ? { sdk: t, status: 2, event: v } : { status: 1, sdk: null, event: v }, [t]);
   return r(() => {
-    t && (t.options.setKey("friendsTab", p), t.options.setKey("theme", i), t.options.setKey("themeMode", o), t.options.setKey("skipOnboarding", c), t.options.setKey("betPack", u), t.options.setKey("containerId", k));
-  }, [t, p, i, o, c, u, k]), r(() => () => {
+    t && (t.options.setKey("friendsTab", p), t.options.setKey("theme", i), t.options.setKey("themeMode", o), t.options.setKey("skipOnboarding", c), t.options.setKey("betPack", u), t.options.setKey("containerId", m));
+  }, [t, p, i, o, c, u, m]), r(() => () => {
     s && t?.removeDeepLinkHandler(s), a && t?.removeVideoPlayerController(a);
   }, [t]), r(() => {
     localStorage.getItem("SL_DEBUG") && console.log("StreamLayerProvider mounted with props:", {
@@ -63,8 +65,8 @@ const H = {
       onDeepLinkHandled: !!s,
       videoPlayerController: !!a
     });
-  }, [e, s, a]), /* @__PURE__ */ O(d.Provider, { value: P, children: [
-    v !== void 0 && /* @__PURE__ */ T(x, { event: v }),
+  }, [e, s, a]), /* @__PURE__ */ O(d.Provider, { value: w, children: [
+    k !== void 0 && /* @__PURE__ */ T(x, { event: k }),
     h
   ] });
 }, j = () => {
@@ -73,13 +75,13 @@ const H = {
 }, I = () => {
   const { event: e } = l(d);
   return e;
-}, V = () => {
+}, _ = () => {
   const { sdk: e } = l(d), [i, o] = b({});
   return r(() => e?.options ? e?.options?.subscribe((n) => {
     o({ theme: n.theme, themeMode: n.themeMode });
   }) : () => {
   }, [e?.options]), i;
-}, _ = () => {
+}, q = () => {
   const { sdk: e } = l(d), [i, o] = b({});
   return r(() => e?.uiState ? e?.uiState.subscribe((n) => {
     o({ ...n });
@@ -87,11 +89,11 @@ const H = {
   }, [e?.uiState]), i;
 };
 export {
-  F as V,
-  j as Y,
-  V as _,
-  x as g,
+  F as _,
   d as i,
-  M as j,
-  _ as q
+  x as j,
+  M as k,
+  _ as q,
+  j as w,
+  q as z
 };

package/lib/{dist/es/index-CfSdnrfA.js → es/index-sWgEw6jy.js}

@@ -1,4 +1,4 @@
-import { u as ir } from "./masters.js";
+import { T as ir } from "./useStreamLayerApp2.js";
 function sr(A, S) {
   for (var G = 0; G < S.length; G++) {
     const X = S[G];

package/lib/es/index.js

@@ -1,7 +1,7 @@
 import { h as a } from "./index7.js";
 import { D as m } from "./index2.js";
 import { StreamLayerSDKNotification as S, StreamLayerSDKNotificationUI as s } from "./notification.js";
-import { V as L, g as i, Y as f, _ as D, q as p } from "./hooks-n9ax4LRT.js";
+import { _ as L, j as i, w as f, q as D, z as p } from "./hooks-42q2i9Iw.js";
 export {
   L as StreamLayerProvider,
   i as StreamLayerSDKEvent,

package/lib/es/index10.js

@@ -1,11 +1,185 @@
-import { jsx as t } from "react/jsx-runtime";
-import { s as l } from "./feature.js";
-const i = /* @__PURE__ */ l("div")({
+import { s as a } from "./feature.js";
+import { Q as i } from "./useStreamLayerApp2.js";
+import { jsxs as t, jsx as s, Fragment as U } from "react/jsx-runtime";
+import { memo as $, useMemo as w } from "react";
+import { V as y } from "./index14.js";
+import { M as T } from "./index5.js";
+const G = {
+  [i.TWEET]: { label: "Insight", iconName: "icon-insight" },
+  [i.PROMOTION]: { label: "Insight", iconName: "icon-insight" },
+  [i.UNSET]: void 0,
+  [i.FACTOID]: { label: "Insight", iconName: "icon-insight" },
+  [i.POLL]: { label: "Poll", iconName: "icon-poll" },
+  [i.TRIVIA]: { label: "Trivia", iconName: "icon-trivia" },
+  [i.PREDICTION]: { label: "Prediction", iconName: "icon-prediction" }
+}, J = {
+  [i.TWEET]: "Learn more",
+  [i.FACTOID]: "Learn more",
+  [i.POLL]: "Answer",
+  [i.TRIVIA]: "Answer",
+  [i.PREDICTION]: "Answer",
+  [i.PROMOTION]: "",
+  [i.UNSET]: ""
+}, K = (r) => r.split(/\s+/).map((n) => n[0]).join("").toUpperCase(), X = (r) => r ? r.toLocaleString("en-US") : "0", L = (r) => {
+  const n = new Date(r);
+  if (!n)
+    return "";
+  const c = /* @__PURE__ */ new Date(), o = Math.floor(c.getTime() - n.getTime());
+  return o < 6e4 ? `${Math.floor(o / 1e3)}s` : o < 36e5 ? `${Math.floor(o / 6e4)}m` : o < 864e5 ? `${Math.floor(o / 36e5)}h` : n.getFullYear() === c.getFullYear() ? `${n.toLocaleDateString("en-US", {
+    month: "short",
+    day: "numeric"
+  })}` : `${n.toLocaleDateString("en-US", {
+    month: "2-digit",
+    day: "2-digit",
+    year: "2-digit"
+  })}`;
+}, D = /* @__PURE__ */ a("div")({
   name: "Container",
-  class: "cqg02m",
+  class: "cjq447q",
   propsAsIs: !1
-}), a = ({ children: s, style: e, loading: o }) => o ? /* @__PURE__ */ t(i, { style: e, children: s }) : s;
+}), H = /* @__PURE__ */ a("div")({
+  name: "ImageContainer",
+  class: "i14egogb",
+  propsAsIs: !1
+}), S = /* @__PURE__ */ a("img")({
+  name: "Image",
+  class: "i2g9g4l",
+  propsAsIs: !1
+}), O = () => T, E = /* @__PURE__ */ a(O())({
+  name: "TwitterIcon",
+  class: "t1c454nm",
+  propsAsIs: !0
+}), b = /* @__PURE__ */ a("div")({
+  name: "Details",
+  class: "d11nigc3",
+  propsAsIs: !1
+}), x = /* @__PURE__ */ a("div")({
+  name: "Name",
+  class: "nrxa4k8",
+  propsAsIs: !1
+}), C = /* @__PURE__ */ a("div")({
+  name: "UserNameAndDate",
+  class: "u1p051g3",
+  propsAsIs: !1
+}), M = ({ image: r, name: n, userName: c, verified: o, createdTweet: p }) => {
+  const m = p && L(p);
+  return /* @__PURE__ */ t(D, { children: [
+    r && /* @__PURE__ */ t(H, { children: [
+      /* @__PURE__ */ s(S, { className: "SL_AccountImage", src: r }),
+      /* @__PURE__ */ s(E, { name: "twitter" })
+    ] }),
+    /* @__PURE__ */ t(b, { children: [
+      n && /* @__PURE__ */ t(x, { className: "SL_TweetAccountName", children: [
+        n,
+        " ",
+        o && /* @__PURE__ */ s(T, { name: "icon-twitter-verified" })
+      ] }),
+      c && /* @__PURE__ */ t(C, { className: "SL_TweetAccountUserName", children: [
+        "@",
+        c,
+        " ",
+        m && `･ ${m}`
+      ] })
+    ] })
+  ] });
+}, P = /* @__PURE__ */ a("div")({
+  name: "Container",
+  class: "c1kzqw87",
+  propsAsIs: !1
+}), R = /* @__PURE__ */ a("div")({
+  name: "Details",
+  class: "d9r1hf9",
+  propsAsIs: !1
+}), V = /* @__PURE__ */ a("div")({
+  name: "Body",
+  class: "bezygt5",
+  propsAsIs: !1
+}), d = /* @__PURE__ */ a("div")({
+  name: "ImagesContainer",
+  class: "i1y8f7ym",
+  propsAsIs: !1
+}), h = /* @__PURE__ */ a("div")({
+  name: "ImagesBlock",
+  class: "i18gwonx",
+  propsAsIs: !1
+}), N = /* @__PURE__ */ a("img")({
+  name: "Image",
+  class: "i3g0xjd",
+  propsAsIs: !1
+}), j = () => N, l = /* @__PURE__ */ a(j())({
+  name: "ImageFullSize",
+  class: "io8rt7p",
+  propsAsIs: !0
+}), F = () => N, f = /* @__PURE__ */ a(F())({
+  name: "ImageHalfSize",
+  class: "i4hn3ox",
+  propsAsIs: !0
+}), _ = new RegExp("\\s?https?://t.co[^\\s]+(\\s+)?$"), z = (r) => r?.replace(_, ""), Z = $(
+  ({ image: r, body: n, muted: c, account: o, accountVerified: p, tweet: m, isDetail: u, controlVideo: v }) => {
+    const e = m?.meta?.extendedEntities?.media, g = e?.find(
+      ({ type: I }) => I === "photo"
+      /* PHOTO */
+    ), A = w(() => e?.[0]?.videoInfo?.variants?.findLast(
+      ({ contentType: I }) => I === "video/mp4"
+      /* VIDEO */
+    )?.url, [e]);
+    return /* @__PURE__ */ t(P, { children: [
+      /* @__PURE__ */ t(R, { children: [
+        /* @__PURE__ */ s(
+          M,
+          {
+            image: r,
+            name: m?.meta?.accountName,
+            userName: o,
+            verified: p,
+            createdTweet: m?.date
+          }
+        ),
+        /* @__PURE__ */ s(V, { children: z(n) }),
+        !u && g && /* @__PURE__ */ s(d, { children: /* @__PURE__ */ s(l, { src: e?.[0].mediaUrlHttps }) }),
+        u && g && /* @__PURE__ */ t(U, { children: [
+          e?.length === 1 && /* @__PURE__ */ s(d, { children: /* @__PURE__ */ s(l, { src: e[0].mediaUrlHttps }) }),
+          e?.length === 2 && /* @__PURE__ */ t(d, { children: [
+            /* @__PURE__ */ s(f, { src: e[0].mediaUrlHttps }),
+            /* @__PURE__ */ s(f, { src: e[1].mediaUrlHttps })
+          ] }),
+          e?.length === 3 && /* @__PURE__ */ t(d, { children: [
+            /* @__PURE__ */ s(f, { src: e[0].mediaUrlHttps }),
+            /* @__PURE__ */ t(h, { children: [
+              /* @__PURE__ */ s(l, { src: e[1].mediaUrlHttps }),
+              /* @__PURE__ */ s(l, { src: e[2].mediaUrlHttps })
+            ] })
+          ] }),
+          e?.length === 4 && /* @__PURE__ */ t(d, { children: [
+            /* @__PURE__ */ t(h, { children: [
+              /* @__PURE__ */ s(l, { src: e[0].mediaUrlHttps }),
+              /* @__PURE__ */ s(l, { src: e[1].mediaUrlHttps })
+            ] }),
+            /* @__PURE__ */ t(h, { children: [
+              /* @__PURE__ */ s(l, { src: e[2].mediaUrlHttps }),
+              /* @__PURE__ */ s(l, { src: e[3].mediaUrlHttps })
+            ] })
+          ] })
+        ] })
+      ] }),
+      !g && (e?.[0]?.type === "video" || e?.[0]?.type === "animated_gif") && A && /* @__PURE__ */ s(
+        y,
+        {
+          muted: c,
+          source: A,
+          poster: e[0].mediaUrlHttps,
+          controlVideo: v
+        }
+      )
+    ] });
+  }
+);
 export {
-  i as e,
-  a as i
+  M as D,
+  K as I,
+  Z as N,
+  G as e,
+  z as j,
+  J as o,
+  X as s
 };