@streamlayer/react 1.23.2 → 1.24.1

package/lib/classic/es/index7.js

@@ -1,8 +1,181 @@
-import { jsx } from "react/jsx-runtime";
-import { c as cx_default } from "./sl-types.js";
-const m = "StreamLayerCSSReset", h$1 = "ttkj0ah";
-const h = ({ children: r, customTheme: m2, themeMode: o, style: a }) => /* @__PURE__ */ jsx("div", { className: "StreamLayerSDKTheme", children: /* @__PURE__ */ jsx("div", { className: cx_default(h$1, o, m2), style: a, children: r }) });
+import { jsx as F } from "react/jsx-runtime";
+import { d as n } from "./index10.js";
+import { useEffect as D, useState as S, useCallback as C } from "react";
+import { s as I } from "./sl-types.js";
+import { CountdownCircleTimer as t } from "react-countdown-circle-timer";
+import { B as a } from "./index6.js";
+const f = {
+  BLUE_QUESTION_ACTION_BTN: "#1589ee",
+  WHITE: "#FFFFFF",
+  BLUE: "#2d6ffd",
+  GREY_PRIMARY: "#909395",
+  GREY_PRIMARY_ONBOARDING_INAPP: "#B5B7B8",
+  PRIMARY_1: "#1D7BFF",
+  // main
+  PRIMARY_2: "#095CD1",
+  // hover, active, ...etc (darken 10%)
+  PRIMARY_TEXT: "#090E13",
+  SECONDARY_TEXT: "rgba(10, 14, 19, 0.70)",
+  QUESTION_TYPE_ICON: "#1D7BFF",
+  QUESTION_BODY_TEXT: "#090E13",
+  PRESENTED_BY_TEXT: "#090E13",
+  SUCCESS: "#107D57",
+  UNSUCCESS: "#DF2F3B",
+  SECONDARY_RED1: "#DF2F3B",
+  NEUTRALS_WHITE: "#FFFFFF",
+  NEUTRALS_WHITE1: "#FFFFFF",
+  NEUTRALS_GRAY1: "#F7F7F7",
+  NEUTRALS_GRAY2: "#F2F2F1",
+  NEUTRALS_GRAY3: "#E8E8E8",
+  NEUTRALS_GRAY4: "#D9D9D6",
+  NEUTRALS_GRAY5: "#B1B3B3",
+  NEUTRALS_GRAY6: "#888B8D",
+  NEUTRALS_GRAY7: "#6B6F73",
+  NEUTRALS_GRAY9: "#25282A",
+  SDK_CONTAINER_BG: "#F7F7F7",
+  SDK_WHITE_CONTAINER_BG: "#fff",
+  SDK_DARK_CONTAINER_BG: "#fff",
+  SDK_PREDICTION_RESULT_SUCCESS_BG: "#fff",
+  SDK_PREDICTION_RESULT_INCORRECT_BG: "#fff",
+  SDK_PREDICTION_RESULT_SUCCESS_TEXT: "#107D57",
+  SDK_PREDICTION_RESULT_ERROR_TITLE: "#090E13",
+  SDK_PREDICTION_RESULT_ERROR_SUBTITLE: "#DF2F3B",
+  SDK_PREDICTION_RESULT_CLOSE_ICON: "#6B6F73",
+  SDK_PREDICTION_FEEDBACK_SUCCESS_ICON: "#107D57",
+  SDK_PREDICTION_FEEDBACK_INCORRECT_RECT1: "#CD2525",
+  SDK_PREDICTION_FEEDBACK_INCORRECT_RECT2: "#fff",
+  PREDICTION_BG_LINES_CORRECT: "#01AB58",
+  PREDICTION_BG_LINES_INCORRECT: "#888B8D",
+  SKELETON_COLOR_1: "#f1efef",
+  SKELETON_COLOR_2: "#f9f8f8",
+  TABS_CONTAINER_BG: "#F2F2F1",
+  TABS_ACTIVE_BG: "#FFFFFF",
+  TABS_COLOR: "#6B6F73",
+  TABS_ACTIVE_COLOR: "#1D7BFF",
+  CARD_BG: "#FFFFFF",
+  CARD_BORDER: "#fff",
+  BORDER: "#E8E8E8",
+  VOTE_BTN_BG: "#F7F7F7",
+  VOTE_BTN_BORDER: "rgb(232, 232, 232)",
+  VOTE_BTN_DISABLED_BORDER: "#B1B3B3",
+  VOTE_BTN_SELECTED_BORDER: "#25282A",
+  VOTE_BTN_NOT_SELECTED_BORDER: "#E8E8E8",
+  VOTE_BTN_SELECTED_BG: "#FFFFFF",
+  VOTE_BTN_SELECTED_BG_AD_UNIT: "#FFFFFF",
+  VOTE_BTN_NOT_SELECTED_BG: "#FFFFFF",
+  VOTE_BTN_NOT_SELECTED_BG_UNSET: "rgb(196, 196, 196)",
+  VOTED_ANSWER_BG: "#FFFFFF",
+  VOTED_BTN_RCT_BG: "#2d5694",
+  IN_APP_BG: "rgba(255, 255, 255, 0.90)",
+  IN_APP_QUESTION_TYPE_ICON: "#1D7BFF",
+  IN_APP_QUESTION_TYPE_LABEL: "#82899E",
+  IN_APP_QUESTION_QUOTE: "rgba(10, 14, 19, 0.70)",
+  IN_APP_QUESTION_RESULT_SUBTITLE_BG: "#1D7BFF",
+  IN_APP_QUESTION_RESULT_LINE: "#babfc5",
+  QUOTE_BORDER: "#E8E8E8",
+  QUOTE_TEXT: "rgba(10, 14, 19, 0.70)"
+}, c = {
+  BG_PRIMARY: "#13212b",
+  BG_SECONDARY: "#152430",
+  BG_SECONDARY1: "#435059",
+  BORDER_PRIMARY: "rgba(255, 255, 255, 0.1)",
+  TEXT_PRIMARY: "#f9f9f9",
+  TEXT_PRIMARY1: "#f9f9f9",
+  TEXT_SECONDARY: "rgba(255, 255, 255, 0.8)",
+  TEXT_SECONDARY1: "#878787",
+  WHITE: "#fff"
+}, l = ["#107D57", "#DF2F3B", "#DF2F3B", "#E8E8E8"], L = "#cee5de", P = "#f9d6d8", U = "#E8E8E8", x = {
+  xs: 324,
+  sm: 576,
+  md: 768,
+  lg: 992,
+  xl: 1200,
+  xxl: 1440
+};
+Object.entries(f).reduce((_, [E, T]) => `
+    ${_}
+    --color-${E.toLowerCase().replaceAll("_", "-")}: ${T};
+  `, "");
+Object.entries(c).reduce((_, [E, T]) => `
+    ${_}
+    --color-adv-${E.toLowerCase().replaceAll("_", "-")}: ${T};
+  `, "");
+const d = (_) => {
+  const { Component: E, options: T, customOptions: e, autoFocus: R, ...O } = _, N = n.useFocusable({
+    ...T,
+    ...e,
+    onEnterPress: () => _.onClick?.({ currentTarget: N.ref.current, stopPropagation: () => {
+    } })
+  });
+  return D(() => {
+    R && N.focusSelf();
+  }, []), /* @__PURE__ */ F(E, { ...O, ...N, "data-is-with-focus": "true" });
+};
+function Q(_, E) {
+  return ({ webos: T, options: e, ...R }) => T ? /* @__PURE__ */ F(d, { Component: _, options: E, customOptions: e, ...R }) : /* @__PURE__ */ F(_, { ...R });
+}
+const m = [10, 10, 1, 0], G = /* @__PURE__ */ I("div")({
+  name: "RemainingTimeCircle",
+  class: "r165427",
+  propsAsIs: !1
+}), p = /* @__PURE__ */ I("div")({
+  name: "RemainingTime",
+  class: "r17garf3",
+  propsAsIs: !1
+}), Y = L, B = P, o = U, X = ({
+  className: _,
+  duration: E = 30,
+  onTimerExpired: T,
+  isPlaying: e = !0
+}) => /* @__PURE__ */ F(t, {
+  isPlaying: e,
+  strokeWidth: 0,
+  duration: E,
+  colors: B,
+  size: 24,
+  onComplete: T,
+  children: ({
+    remainingTime: R
+  }) => /* @__PURE__ */ F(p, {
+    className: _,
+    children: E === 0 ? 0 : R
+  })
+}), M = ({
+  isPlaying: _ = !0,
+  duration: E = 30,
+  onTimerExpired: T
+}) => {
+  const [e, R] = S(E > 10 ? Y : B), [O, N] = S(2);
+  D(() => {
+    E === 0 && (N(0), R(o));
+  }, [E]);
+  const i = ({
+    remainingTime: r
+  }) => /* @__PURE__ */ F(G, {
+    children: E === 0 ? 0 : r
+  }), s = C(() => {
+    T?.(), R(o);
+  }, [T, R]), A = C((r) => {
+    r === 10 && R(B);
+  }, [R]);
+  return /* @__PURE__ */ F(t, {
+    isPlaying: _,
+    duration: E,
+    colors: l,
+    colorsTime: m,
+    size: 32,
+    strokeWidth: O,
+    trailStrokeWidth: 2,
+    trailColor: e,
+    onComplete: s,
+    onUpdate: A,
+    children: i
+  });
+}, W = ({ height: _ = "37px", width: E = "37px" }) => /* @__PURE__ */ F("div", { style: { height: _, width: E }, children: /* @__PURE__ */ F(a, { name: "loader" }) });
 export {
-  h,
-  m
+  x as A,
+  X as G,
+  M as L,
+  Q as b,
+  W as d
 };

package/lib/classic/es/index8.js

@@ -1,12 +1,7 @@
-import { jsx } from "react/jsx-runtime";
-import { s as styled_default } from "./sl-types.js";
-const e = /* @__PURE__ */ styled_default("div")({
-  name: "Container",
-  class: "cqg02m",
-  propsAsIs: false
-});
-const i = ({ children: r, style: o, loading: t }) => t ? /* @__PURE__ */ jsx(e, { style: o, children: r }) : r;
+import { jsx as e } from "react/jsx-runtime";
+import { c as a } from "./sl-types.js";
+const l = "StreamLayerCSSReset", c = "ttkj0ah", d = ({ children: t, customTheme: m, themeMode: r, style: s }) => /* @__PURE__ */ e("div", { className: "StreamLayerSDKTheme", children: /* @__PURE__ */ e("div", { className: a(c, r, m), style: s, children: t }) });
 export {
-  e,
-  i
+  d as h,
+  l as m
 };

package/lib/classic/es/index9.js

@@ -1,321 +1,11 @@
-import { jsxs, jsx, Fragment } from "react/jsx-runtime";
-import { s as styled_default, c as cx_default } from "./sl-types.js";
-import { useState, useEffect, useCallback, forwardRef, useRef } from "react";
-import { B as B1 } from "./index4.js";
-import { G, d as d$1, O as O$1 } from "./index10.js";
-import { C as CloseTimerAuto } from "./useStreamLayerApp2.js";
-const g = /* @__PURE__ */ styled_default("div")({
-  name: "CloseIconWrap",
-  class: "c3v6bv6",
-  propsAsIs: false
-}), h = /* @__PURE__ */ styled_default("div")({
-  name: "TimerWrap",
-  class: "teuhmro",
-  propsAsIs: false
-}), A$1 = () => B1, C$1 = /* @__PURE__ */ styled_default(A$1())({
-  name: "Icon",
-  class: "i17rfxv5",
-  propsAsIs: true
-}), y$1 = ({
-  close: r2,
-  className: a2,
-  timerClassName: m,
-  skipIcon: o2,
-  isPlaying: c2 = true,
-  duration: e2 = 0,
-  autoClose: n2
-}) => {
-  const [p2, i2] = useState(e2 === 0);
-  useEffect(() => {
-    i2(!e2);
-  }, [e2]);
-  const l2 = useCallback(() => {
-    n2 === CloseTimerAuto.ENABLED ? r2 == null || r2() : i2(true);
-  }, [n2, r2]);
-  return p2 ? /* @__PURE__ */ jsxs(g, {
-    "data-a": "intr",
-    onClick: r2,
-    className: a2,
-    style: o2 ? {
-      width: "auto"
-    } : {},
-    children: [o2 && /* @__PURE__ */ jsx("span", {
-      "data-a": "intr",
-      children: "Skip"
-    }), /* @__PURE__ */ jsx(C$1, {
-      "data-a": "intr",
-      name: o2 ? "iconSkip" : "icon-cross"
-    })]
-  }) : /* @__PURE__ */ jsx(h, {
-    children: /* @__PURE__ */ jsx(G, {
-      className: m,
-      isPlaying: c2,
-      duration: e2,
-      onTimerExpired: l2
-    })
-  });
-};
-const i = /* @__PURE__ */ styled_default("div")({
+import { jsx as t } from "react/jsx-runtime";
+import { s as l } from "./sl-types.js";
+const i = /* @__PURE__ */ l("div")({
   name: "Container",
-  class: "c1bgb86j",
-  propsAsIs: false
-}), A = /* @__PURE__ */ styled_default("video")({
-  name: "Player",
-  class: "p6703cq",
-  propsAsIs: false
-}), b = /* @__PURE__ */ styled_default("img")({
-  name: "Poster",
-  class: "p12ow7zo",
-  propsAsIs: false
-}), B = /* @__PURE__ */ styled_default("div")({
-  name: "Control",
-  class: "cdpal9o",
-  propsAsIs: false
-}), x = "t1xke4ml", y = "h1yzxv57", P = /* @__PURE__ */ styled_default("div")({
-  name: "VideoControls",
-  class: "vxo8xch",
-  propsAsIs: false
-}), n = /* @__PURE__ */ styled_default("button")({
-  name: "ControlBtn",
-  class: "coyuzu0",
-  propsAsIs: false
-}), t = () => n, O = /* @__PURE__ */ styled_default(t())({
-  name: "MuteIcon",
-  class: "musmi9a",
-  propsAsIs: true
-}), e = () => n, S = /* @__PURE__ */ styled_default(e())({
-  name: "PauseIcon",
-  class: "p1qe7rum",
-  propsAsIs: true
-}), c = () => n, W = /* @__PURE__ */ styled_default(c())({
-  name: "PlayIcon",
-  class: "psevery",
-  propsAsIs: true
-}), a = /* @__PURE__ */ styled_default("button")({
-  name: "WebOSIconButton",
-  class: "w1q3u7py",
-  propsAsIs: false
-}), p = () => a, o = /* @__PURE__ */ styled_default(p())({
-  name: "WebOSIconButtonAnimation",
-  class: "wdlqvum",
-  propsAsIs: true
-}), l = () => o, d = /* @__PURE__ */ styled_default(l())({
-  name: "WebOSIconButtonPlay",
-  class: "w1ylz9ea",
-  propsAsIs: true
-}), r = () => o, C = /* @__PURE__ */ styled_default(r())({
-  name: "WebOSIconButtonPause",
-  class: "w1iylt55",
-  propsAsIs: true
-}), u = () => o, f = /* @__PURE__ */ styled_default(u())({
-  name: "WebOSIconButtonMute",
-  class: "w8h4h7",
-  propsAsIs: true
-}), I = () => o, v = /* @__PURE__ */ styled_default(I())({
-  name: "WebOSIconButtonUnmute",
-  class: "w12l12kt",
-  propsAsIs: true
-});
-const It = (r2) => {
-  for (const s of r2)
-    s.isIntersecting ? s.target instanceof HTMLVideoElement && s.target.autoplay && s.target.play() : s.target instanceof HTMLVideoElement && !s.target.paused && s.target.pause();
-}, $ = new IntersectionObserver(It, { threshold: 0.5 }), D = /* @__PURE__ */ new Set(), Bt = (r2) => {
-  $.observe(r2), D.add(r2);
-}, Ot = (r2) => {
-  $.unobserve(r2), D.delete(r2);
-}, wt = () => {
-  for (const r2 of D)
-    r2 instanceof HTMLVideoElement && !r2.paused && r2.pause();
-};
-function yt(...r2) {
-  return useCallback(
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    (s) => {
-      for (const c2 of r2)
-        c2 !== null && (typeof c2 == "function" ? c2(s) : c2 && (c2.current = s));
-    },
-    // Re-run the callback if the array of refs changes
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [...r2]
-  );
-}
-const Lt = O$1(i), Pt = ({ loading: r2, autoPlay: s, played: c2, playing: i2, isMuted: f2, unmute: d2, mute: h2, togglePlaying: l2 }) => !r2 && !s && !c2 ? /* @__PURE__ */ jsx(B, { children: i2 ? /* @__PURE__ */ jsx(B1, { name: "icon-pause" }) : /* @__PURE__ */ jsx(B1, { name: "icon-play" }) }) : c2 ? /* @__PURE__ */ jsxs(P, { children: [
-  i2 ? /* @__PURE__ */ jsx(S, { onClick: l2 }) : /* @__PURE__ */ jsx(W, { onClick: l2 }),
-  /* @__PURE__ */ jsx(O, { className: cx_default(!f2 && "muted"), onClick: f2 ? d2 : h2 })
-] }) : null, Tt = ({
-  loading: r2,
-  autoPlay: s,
-  playMuted: c2,
-  playing: i2,
-  played: f$1,
-  unmute: d$12,
-  mute: h2,
-  isMuted: l2,
-  hasNotPausedVideo: p2,
-  hasInteractedWithAudio: w
-}) => /* @__PURE__ */ jsxs(Fragment, { children: [
-  !r2 && !(s && c2) && /* @__PURE__ */ jsx(B, { "data-control-btn": "true", children: i2 ? p2 ? null : /* @__PURE__ */ jsx(d, { children: /* @__PURE__ */ jsx(B1, { name: "icon-play" }) }) : f$1 ? /* @__PURE__ */ jsx(C, { children: /* @__PURE__ */ jsx(B1, { name: "icon-pause" }) }) : /* @__PURE__ */ jsx(a, { "data-control-icon": "true", children: /* @__PURE__ */ jsx(B1, { name: "icon-play" }) }) }),
-  !r2 && s && c2 && w && /* @__PURE__ */ jsx(B, { children: l2 ? /* @__PURE__ */ jsx(f, { onClick: d$12, children: /* @__PURE__ */ jsx(B1, { name: "iconMute" }) }) : /* @__PURE__ */ jsx(v, { onClick: h2, children: /* @__PURE__ */ jsx(B1, { name: "iconUnMute" }) }) })
-] }), Et = forwardRef(
-  ({
-    poster: r2,
-    source: s,
-    aspectRatio: c2,
-    controlVideo: i2,
-    onReplay: f2,
-    onPlay: d2,
-    onPause: h2,
-    onEnd: l2,
-    onRender: p2,
-    onMute: w,
-    onQuartile: u2,
-    autoPlay: v2,
-    playMuted: S2,
-    className: K,
-    muted: y$12,
-    webos: T,
-    hasNotPausedVideo: V
-  }, R) => {
-    const n2 = useRef(null), Q = yt(n2, R), x$1 = useRef(false), E = useRef(false), m = useRef(/* @__PURE__ */ new Set()), [z, G2] = useState(false), [W2, k] = useState(false), [j, J] = useState(false), [X, H] = useState(true), [A$12, U] = useState(S2), [q, tt] = useState(false);
-    useEffect(() => {
-      s && (U(S2), G2(false));
-    }, [s]);
-    const C2 = useCallback(() => {
-      i2 == null || i2({ muted: false });
-    }, [i2]), Y = useCallback(() => {
-      i2 == null || i2({ muted: true });
-    }, [i2]), I2 = useCallback((t2) => {
-      t2 == null || t2.stopPropagation(), n2.current && (n2.current.muted = true), U(true);
-    }, []), L = useCallback(
-      (t2) => {
-        t2 == null || t2.stopPropagation(), n2.current && (n2.current.muted = false), U(false), q || tt(true);
-      },
-      [q]
-    );
-    useEffect(() => {
-      y$12 !== void 0 && (y$12 ? I2() : L());
-    }, [I2, y$12, L]);
-    const Z = (t2) => {
-      var b2;
-      (b2 = t2.stopPropagation) == null || b2.call(t2);
-      const o2 = n2 == null ? void 0 : n2.current;
-      if (o2)
-        if (W2)
-          o2.pause();
-        else {
-          const a2 = n2 == null ? void 0 : n2.current;
-          if (!a2)
-            return;
-          wt(), a2.play().catch((rt) => console.log(rt)), H(false);
-        }
-    }, et = () => {
-      var t2;
-      (t2 = n2 == null ? void 0 : n2.current) == null || t2.load(), H(true);
-    };
-    return useEffect(() => () => {
-      C2();
-    }, [C2]), useEffect(() => {
-      const t2 = n2.current;
-      return t2 ? (E.current = t2.muted, U(t2.muted), Bt(t2), () => {
-        Ot(t2);
-      }) : () => {
-      };
-    }, []), useEffect(() => {
-      p2 == null || p2();
-    }, [p2]), useEffect(() => {
-      m.current.clear(), x$1.current = false;
-    }, [s]), /* @__PURE__ */ jsxs(
-      Lt,
-      {
-        webos: T,
-        onClick: v2 && S2 ? A$12 ? L : I2 : Z,
-        "data-a": "intr",
-        autoFocus: true,
-        options: { focusKey: "video-play-btn" },
-        className: cx_default(W2 && !T && x, v2 && y, K),
-        style: c2 ? { aspectRatio: c2 } : {},
-        children: [
-          /* @__PURE__ */ jsx(
-            A,
-            {
-              ref: Q,
-              src: s,
-              autoPlay: v2,
-              onPlay: () => {
-                G2(true), x$1.current && (f2 == null || f2(), m.current.clear()), k(true), H(false), d2 == null || d2(), S2 ? I2() : Y();
-              },
-              onTimeUpdate: (t2) => {
-                const o2 = t2.target.duration, b2 = t2.target.currentTime;
-                if (o2 && b2) {
-                  const a2 = Math.floor(b2 / o2 * 100);
-                  a2 >= 25 && a2 < 50 && !m.current.has(25) ? (u2 == null || u2(25), m.current.add(25)) : a2 >= 50 && a2 < 75 && !m.current.has(50) ? (u2 == null || u2(50), m.current.add(50)) : a2 >= 75 && !m.current.has(75) && (u2 == null || u2(75), m.current.add(75));
-                }
-              },
-              onVolumeChange: (t2) => {
-                const o2 = t2.target.muted;
-                E.current !== o2 && (w == null || w(o2), E.current = o2, (o2 !== y$12 || y$12 === void 0) && (o2 ? C2() : Y()));
-              },
-              onError: async (t2) => {
-                try {
-                  if (t2.target instanceof HTMLVideoElement) {
-                    J(true);
-                    const b2 = await (await fetch(t2.target.src)).blob(), a2 = URL.createObjectURL(b2);
-                    t2.target.src = a2;
-                  }
-                } catch (o2) {
-                  console.error("video fallback fetch failed", o2), k(true), H(true);
-                } finally {
-                  J(false), C2();
-                }
-              },
-              onPause: () => {
-                k(false), h2 == null || h2(), C2();
-              },
-              onEnded: () => {
-                k(false), x$1.current = true, et(), l2 == null || l2(), C2();
-              },
-              style: { visibility: X ? "hidden" : "visible" },
-              controls: false,
-              playsInline: true
-            }
-          ),
-          /* @__PURE__ */ jsx(b, { src: r2, style: { visibility: X ? "visible" : "hidden" } }),
-          !T && /* @__PURE__ */ jsx(
-            Pt,
-            {
-              loading: j,
-              autoPlay: v2,
-              played: z,
-              playing: W2,
-              isMuted: A$12,
-              unmute: L,
-              mute: I2,
-              togglePlaying: Z
-            }
-          ),
-          T && /* @__PURE__ */ jsx(
-            Tt,
-            {
-              loading: j,
-              autoPlay: v2,
-              playMuted: S2,
-              playing: W2,
-              played: z,
-              unmute: L,
-              mute: I2,
-              isMuted: A$12,
-              hasNotPausedVideo: V,
-              hasInteractedWithAudio: q
-            }
-          ),
-          j && /* @__PURE__ */ jsx(B, { children: /* @__PURE__ */ jsx(d$1, {}) })
-        ]
-      }
-    );
-  }
-);
+  class: "cqg02m",
+  propsAsIs: !1
+}), a = ({ children: s, style: e, loading: o }) => o ? /* @__PURE__ */ t(i, { style: e, children: s }) : s;
 export {
-  Et as E,
-  wt as w,
-  y$1 as y
+  i as e,
+  a as i
 };

package/lib/classic/es/insight.js

@@ -1,86 +1,79 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { h } from "./index7.js";
-import { u as useStore, s as styled_default } from "./sl-types.js";
-import { useRef, useEffect } from "react";
-import { h as ht } from "./Question.js";
-import { S as SdkOverlayType } from "./useStreamLayerApp2.js";
-import { B, z, j } from "./hooks-WfHlJH12.js";
-const b = () => ht, v = /* @__PURE__ */ styled_default(b())({
+import { jsx as u, jsxs as c } from "react/jsx-runtime";
+import { h as p } from "./index8.js";
+import { u as a, s as h } from "./sl-types.js";
+import { useRef as f, useEffect as l } from "react";
+import { _ as I } from "./Question.js";
+import { S as g } from "./useStreamLayerApp2.js";
+import { Y as S, _ as k, g as Q } from "./hooks-n9ax4LRT.js";
+const y = () => I, A = /* @__PURE__ */ h(y())({
   name: "QuestionWrap",
   class: "q10hhsxv",
-  propsAsIs: true
-}), w = ({
+  propsAsIs: !0
+}), b = ({
   gamification: e,
-  sdk: n,
-  persistent: o,
-  skipAutoClose: p,
-  hideHeader: f,
+  sdk: o,
+  persistent: i,
+  skipAutoClose: n,
+  hideHeader: d,
   insightId: t
 }) => {
-  const r = useRef(""), i = useStore(e.openedQuestion.$store);
-  return useEffect(() => t ? (!o || e.isOpenedQuestion(t) || (r.current = t, e.getFeedItem(t).then((u) => {
-    var c;
-    r.current === t && ((c = u == null ? void 0 : u.attributes) == null ? void 0 : c.attributes.case) === "insight" && e.openQuestion(t, u);
+  const r = f(""), m = a(e.openedQuestion.$store);
+  return l(() => t ? (!i || e.isOpenedQuestion(t) || (r.current = t, e.getFeedItem(t).then((s) => {
+    r.current === t && s?.attributes?.attributes.case === "insight" && e.openQuestion(t, s);
   })), () => {
     r.current = "";
   }) : (e.activeQuestionId.subscribe(({
     data: s
   }) => {
-    var u;
-    s && ((u = s.feedItem) == null ? void 0 : u.type) === "insight" && (!o || e.isOpenedQuestion(s.feedItem.id) || (r.current = s.feedItem.id, e.openQuestion(s.feedItem.id, s.feedItem))), !s && r.current && (e.closeQuestion(r.current), r.current = "");
+    s && s.feedItem?.type === "insight" && (!i || e.isOpenedQuestion(s.feedItem.id) || (r.current = s.feedItem.id, e.openQuestion(s.feedItem.id, s.feedItem))), !s && r.current && (e.closeQuestion(r.current), r.current = "");
   }), () => {
-  }), [e, o, t]), i ? /* @__PURE__ */ jsx(v, {
-    sdk: n,
-    skipAutoClose: p,
-    hideHeader: f,
+  }), [e, i, t]), m ? /* @__PURE__ */ u(A, {
+    sdk: o,
+    skipAutoClose: n,
+    hideHeader: d,
     gamification: e,
-    hideSponsor: true
+    hideSponsor: !0
   }) : null;
-}, D = ({
+}, v = ({
   sdk: e,
-  persistent: n,
-  skipAutoClose: o,
-  insightId: p,
-  hideHeader: f
+  persistent: o,
+  skipAutoClose: i,
+  insightId: n,
+  hideHeader: d
 }) => {
-  if (!useStore(e.featuresList.getStore()))
+  if (!a(e.featuresList.getStore()))
     return null;
-  const r = e.getFeature(SdkOverlayType.GAMES);
-  return r ? /* @__PURE__ */ jsx(w, {
-    insightId: p,
+  const t = e.getFeature(g.GAMES);
+  return t ? /* @__PURE__ */ u(b, {
+    insightId: n,
     sdk: e,
-    persistent: n,
-    hideHeader: f,
-    gamification: r,
-    skipAutoClose: o
+    persistent: o,
+    hideHeader: d,
+    gamification: t,
+    skipAutoClose: i
   }) : null;
-};
-const StreamLayerSDKInsight = ({
-  event,
-  theme,
-  hideHeader,
-  skipAutoClose,
-  persistent
+}, M = ({
+  event: e,
+  theme: o,
+  hideHeader: i,
+  skipAutoClose: n,
+  persistent: d
 }) => {
-  const sdk = B();
-  const baseTheme = z();
-  if (!sdk) {
-    return null;
-  }
-  return /* @__PURE__ */ jsxs("div", { className: "StreamLayerSDK", children: [
-    /* @__PURE__ */ jsx(h, { customTheme: theme ?? baseTheme.theme, themeMode: baseTheme.themeMode, children: /* @__PURE__ */ jsx(
-      D,
+  const t = S(), r = k();
+  return t ? /* @__PURE__ */ c("div", { className: "StreamLayerSDK", children: [
+    /* @__PURE__ */ u(p, { customTheme: o ?? r.theme, themeMode: r.themeMode, children: /* @__PURE__ */ u(
+      v,
       {
-        skipAutoClose,
-        sdk,
-        hideHeader,
-        persistent
+        skipAutoClose: n,
+        sdk: t,
+        hideHeader: i,
+        persistent: d
       }
     ) }),
-    event !== void 0 && /* @__PURE__ */ jsx(j, { event })
-  ] });
+    e !== void 0 && /* @__PURE__ */ u(Q, { event: e })
+  ] }) : null;
 };
 export {
-  StreamLayerSDKInsight,
-  D as StreamLayerSDKInsightUI
+  M as StreamLayerSDKInsight,
+  v as StreamLayerSDKInsightUI
 };