@streamlayer/react 1.24.6 → 1.24.8

package/lib/es/analytics.js

@@ -1,6 +1,6 @@
 import { useEffect as c } from "react";
 import { e as s } from "./index3.js";
-import { A as v } from "./index9.js";
+import { A as v } from "./index8.js";
 let i = [], r = 0;
 const u = 4, d = /* @__NO_SIDE_EFFECTS__ */ (a) => {
   let e = [], t = {

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/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 H } from "./index14.js";
+import { H 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", y = (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"
+  })}`;
+}, L = /* @__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;
+}), D = /* @__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
+}), P = ({ image: r, name: n, userName: c, verified: o, createdTweet: p }) => {
+  const m = p && y(p);
+  return /* @__PURE__ */ t(L, { children: [
+    r && /* @__PURE__ */ t(D, { 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}`
+      ] })
+    ] })
+  ] });
+}, M = /* @__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(M, { children: [
+      /* @__PURE__ */ t(R, { children: [
+        /* @__PURE__ */ s(
+          P,
+          {
+            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(
+        H,
+        {
+          muted: c,
+          source: A,
+          poster: e[0].mediaUrlHttps,
+          controlVideo: v
+        }
+      )
+    ] });
+  }
+);
 export {
-  i as e,
-  a as i
+  P as D,
+  K as I,
+  Z as N,
+  G as e,
+  z as j,
+  J as o,
+  X as s
 };