@streamlayer/react-ui 0.98.1 → 0.99.0

package/lib/ui/gamification/vote/vote-option/styles.js

@@ -1,24 +1,22 @@
 import { styled as s } from "@linaria/react";
 import { SvgIcon as o } from "../../../icons/index.js";
-import "react/jsx-runtime";
-import "react";
-const I = /* @__PURE__ */ s("button")({
+const r = /* @__PURE__ */ s("button")({
   name: "ButtonContainer",
   class: "b1b6dl8t",
   propsAsIs: !1
-}), i = /* @__PURE__ */ s("div")({
+}), l = /* @__PURE__ */ s("div")({
   name: "ButtonPct",
   class: "b4iik8i",
   propsAsIs: !1
-}), m = /* @__PURE__ */ s("span")({
+}), I = /* @__PURE__ */ s("span")({
   name: "ButtonBody",
   class: "b1gq1lnf",
   propsAsIs: !1
-}), f = /* @__PURE__ */ s("div")({
+}), i = /* @__PURE__ */ s("div")({
   name: "IconContainer",
   class: "i1j65z51",
   propsAsIs: !1
-}), u = /* @__PURE__ */ s("div")({
+}), m = /* @__PURE__ */ s("div")({
   name: "IconWrap",
   class: "i19tpfua",
   propsAsIs: !1
@@ -26,47 +24,47 @@ const I = /* @__PURE__ */ s("button")({
   name: "Icon",
   class: "i1tubmma",
   propsAsIs: !1
-}), t = () => n, A = /* @__PURE__ */ s(t())({
+}), t = () => n, f = /* @__PURE__ */ s(t())({
   name: "IconDefault",
   class: "i1grrgwj",
   propsAsIs: !0
-}), a = () => n, d = /* @__PURE__ */ s(a())({
+}), a = () => n, u = /* @__PURE__ */ s(a())({
   name: "IconCircle",
   class: "ibemyq8",
   propsAsIs: !0
-}), b = /* @__PURE__ */ s("span")({
+}), A = /* @__PURE__ */ s("span")({
   name: "Title",
   class: "t1dceht",
   propsAsIs: !1
-}), B = /* @__PURE__ */ s("span")({
+}), d = /* @__PURE__ */ s("span")({
   name: "Indicators",
   class: "i116q4vq",
   propsAsIs: !1
-}), C = /* @__PURE__ */ s("span")({
+}), b = /* @__PURE__ */ s("span")({
   name: "Pts",
   class: "p17ajcu2",
   propsAsIs: !1
-}), g = /* @__PURE__ */ s("span")({
+}), B = /* @__PURE__ */ s("span")({
   name: "Percentage",
   class: "pu9kmlb",
   propsAsIs: !1
-}), c = () => o, P = /* @__PURE__ */ s(c())({
+}), c = () => o, C = /* @__PURE__ */ s(c())({
   name: "CheckIcon",
   class: "c1j2j0s0",
   propsAsIs: !0
 });
 export {
-  m as ButtonBody,
-  I as ButtonContainer,
-  i as ButtonPct,
-  P as CheckIcon,
+  I as ButtonBody,
+  r as ButtonContainer,
+  l as ButtonPct,
+  C as CheckIcon,
   n as Icon,
-  d as IconCircle,
-  f as IconContainer,
-  A as IconDefault,
-  u as IconWrap,
-  B as Indicators,
-  g as Percentage,
-  C as Pts,
-  b as Title
+  u as IconCircle,
+  i as IconContainer,
+  f as IconDefault,
+  m as IconWrap,
+  d as Indicators,
+  B as Percentage,
+  b as Pts,
+  A as Title
 };

package/lib/ui/gamification/vote/win-bar/index.js

@@ -1,55 +1,47 @@
-import { jsx as r, jsxs as n, Fragment as C } from "react/jsx-runtime";
-import { QuestionType as t } from "@streamlayer/sdk-web-types";
-import { AnimatedCounter as P } from "../../../animated-counter/index.js";
-import { Timer as s } from "../../../timer/index.js";
-import { ShowInContainer as I, WinBarContainer as f, Content as u, Title as O, WinIcon as T, Points as j, PointsCount as x, PointsUnits as y } from "./styles.js";
-import "react-countup";
-import "@linaria/react";
-import "react";
-import "react-countdown-circle-timer";
-import "../../../theme/constants.js";
-import "../../../icons/index.js";
-import "../../../show-in/index.js";
-import "@linaria/core";
-const F = ({
-  title: e,
-  points: o,
-  isPlayingTimer: m,
-  isTimer: a,
+import { jsx as n, jsxs as e, Fragment as P } from "react/jsx-runtime";
+import { QuestionType as i } from "@streamlayer/sdk-web-types";
+import { AnimatedCounter as s } from "../../../animated-counter/index.js";
+import { Timer as I } from "../../../timer/index.js";
+import { ShowInContainer as f, WinBarContainer as p, Content as u, Title as O, WinIcon as T, Points as j, PointsCount as x, PointsUnits as y } from "./styles.js";
+const b = ({
+  title: o,
+  points: t,
+  isPlayingTimer: a,
+  isTimer: m,
   animatePoints: c,
-  questionType: i,
+  questionType: r,
   timerDuration: d,
   votedInCurrentRender: l,
-  percentsAnimated: p,
-  onTimerExpired: h
-}) => /* @__PURE__ */ r(
-  I,
+  percentsAnimated: h,
+  onTimerExpired: C
+}) => /* @__PURE__ */ n(
+  f,
   {
-    enabled: i === t.PREDICTION && l,
-    animate: p,
-    children: /* @__PURE__ */ n(
-      f,
+    enabled: r === i.PREDICTION && l,
+    animate: h,
+    children: /* @__PURE__ */ e(
+      p,
       {
         style: {
-          justifyContent: i === t.PREDICTION ? "center" : "space-between"
+          justifyContent: r === i.PREDICTION ? "center" : "space-between"
         },
         children: [
-          /* @__PURE__ */ n(u, { children: [
-            e && /* @__PURE__ */ r(O, { children: e }),
-            o !== void 0 && i !== t.POLL && /* @__PURE__ */ n(C, { children: [
-              /* @__PURE__ */ r(T, { name: "icon-trophy" }),
-              /* @__PURE__ */ n(j, { children: [
-                /* @__PURE__ */ r(x, { children: c ? /* @__PURE__ */ r(P, { value: o, delay: 0.3 }) : o }),
-                /* @__PURE__ */ r(y, { children: "PTS" })
+          /* @__PURE__ */ e(u, { children: [
+            o && /* @__PURE__ */ n(O, { children: o }),
+            t !== void 0 && r !== i.POLL && /* @__PURE__ */ e(P, { children: [
+              /* @__PURE__ */ n(T, { name: "icon-trophy" }),
+              /* @__PURE__ */ e(j, { children: [
+                /* @__PURE__ */ n(x, { children: c ? /* @__PURE__ */ n(s, { value: t, delay: 0.3 }) : t }),
+                /* @__PURE__ */ n(y, { children: "PTS" })
               ] })
             ] })
           ] }),
-          a && i !== t.PREDICTION && /* @__PURE__ */ r(s, { isPlaying: m, onTimerExpired: h, duration: d })
+          m && r !== i.PREDICTION && /* @__PURE__ */ n(I, { isPlaying: a, onTimerExpired: C, duration: d })
         ]
       }
     )
   }
 );
 export {
-  F as WinBar
+  b as WinBar
 };

package/lib/ui/gamification/vote/win-bar/styles.js

@@ -1,49 +1,46 @@
 import { styled as s } from "@linaria/react";
 import { SvgIcon as n } from "../../../icons/index.js";
 import { GrowingShowIn as o } from "../../../show-in/index.js";
-import "react/jsx-runtime";
-import "react";
-import "@linaria/core";
-const t = () => o, m = /* @__PURE__ */ s(t())({
+const t = () => o, c = /* @__PURE__ */ s(t())({
   name: "ShowInContainer",
   class: "sie6cqo",
   propsAsIs: !0
-}), I = /* @__PURE__ */ s("div")({
+}), r = /* @__PURE__ */ s("div")({
   name: "WinBarContainer",
   class: "wgizw4u",
   propsAsIs: !1
-}), f = /* @__PURE__ */ s("div")({
+}), l = /* @__PURE__ */ s("div")({
   name: "Content",
   class: "c1l3ucjp",
   propsAsIs: !1
-}), w = /* @__PURE__ */ s("div")({
+}), m = /* @__PURE__ */ s("div")({
   name: "Title",
   class: "tx7j799",
   propsAsIs: !1
-}), i = () => n, A = /* @__PURE__ */ s(i())({
+}), a = () => n, I = /* @__PURE__ */ s(a())({
   name: "WinIcon",
   class: "w4lwuj0",
   propsAsIs: !0
-}), C = /* @__PURE__ */ s("div")({
+}), f = /* @__PURE__ */ s("div")({
   name: "Points",
   class: "po9i64o",
   propsAsIs: !1
-}), u = /* @__PURE__ */ s("span")({
+}), w = /* @__PURE__ */ s("span")({
   name: "PointsCount",
   class: "pe5g05h",
   propsAsIs: !1
-}), d = /* @__PURE__ */ s("span")({
+}), A = /* @__PURE__ */ s("span")({
   name: "PointsUnits",
   class: "p1hdtpmb",
   propsAsIs: !1
 });
 export {
-  f as Content,
-  C as Points,
-  u as PointsCount,
-  d as PointsUnits,
-  m as ShowInContainer,
-  w as Title,
-  I as WinBarContainer,
-  A as WinIcon
+  l as Content,
+  f as Points,
+  w as PointsCount,
+  A as PointsUnits,
+  c as ShowInContainer,
+  m as Title,
+  r as WinBarContainer,
+  I as WinIcon
 };

package/lib/ui/login/demo.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="react" />
 import type { StreamLayerSDK } from '@streamlayer/sdk-web-interfaces';
+import '@streamlayer/sdk-web-anonymous-auth';
 export declare const LoginComponent: React.FC<{
     sdk: StreamLayerSDK;
 }>;

package/lib/ui/login/demo.js

@@ -1,26 +1,14 @@
 import { jsx as r } from "react/jsx-runtime";
-import { useStore as m } from "@nanostores/react";
+import { useStore as e } from "@nanostores/react";
 import "@streamlayer/sdk-web-anonymous-auth";
-import { Login as n } from "./index.js";
-import "react";
-import "react-auth-code-input";
-import "react-phone-number-input";
-import "../timer/index.js";
-import "@linaria/react";
-import "react-countdown-circle-timer";
-import "../theme/constants.js";
-import "../../utils/login.js";
-import "@connectrpc/connect";
-import "@connectrpc/connect-web";
-import "@streamlayer/sl-eslib/users/users_connect";
-import "./styles.js";
-const j = ({ sdk: o }) => m(o.getUserStore()).data ? /* @__PURE__ */ r("button", { onClick: o.logout, children: "logout" }) : /* @__PURE__ */ r(n, { login: async (i) => {
+import { Login as i } from "./index.js";
+const c = ({ sdk: o }) => e(o.getUserStore()).data ? /* @__PURE__ */ r("button", { onClick: o.logout, children: "logout" }) : /* @__PURE__ */ r(i, { login: async (n) => {
   try {
-    await o.authorizationBypass("streamlayer:streamlayer", i);
+    await o.authorizationBypass("streamlayer:streamlayer", n);
   } catch (t) {
     throw console.log("login err", t), t;
   }
 }, anonymousLogin: o.anonymousAuthorization, host: o.host });
 export {
-  j as LoginComponent
+  c as LoginComponent
 };

package/lib/ui/login/index.js

@@ -1,60 +1,54 @@
-import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import { jsxs as r, jsx as e } from "react/jsx-runtime";
 import { useState as a } from "react";
 import w from "react-auth-code-input";
 import P, { isValidPhoneNumber as F, formatPhoneNumberIntl as v } from "react-phone-number-input";
 import { Timer as D } from "../timer/index.js";
 import { requestLoginCode as I, register as k, login as S } from "../../utils/login.js";
-import { Panel as q, Form as u, FormTitle as p, FormDescription as d, FormInputContainer as x, FormSubmit as m, Digits as E } from "./styles.js";
-import "@linaria/react";
-import "react-countdown-circle-timer";
-import "../theme/constants.js";
-import "@connectrpc/connect";
-import "@connectrpc/connect-web";
-import "@streamlayer/sl-eslib/users/users_connect";
-const O = ({ login: s, anonymousLogin: h, host: c }) => {
-  const [n, g] = a(""), [i, b] = a(""), [l, f] = a(""), y = async (o) => {
-    o.preventDefault();
+import { Panel as q, Form as m, FormTitle as p, FormDescription as d, FormInputContainer as x, FormSubmit as s, Digits as E } from "./styles.js";
+const z = ({ login: h, anonymousLogin: u, host: c }) => {
+  const [o, g] = a(""), [i, b] = a(""), [l, f] = a(""), y = async (t) => {
+    t.preventDefault();
     try {
-      const r = n.replaceAll("+", "");
+      const n = o.replaceAll("+", "");
       try {
-        await I(c, r);
+        await I(c, n);
       } catch {
-        await k(c, r);
+        await k(c, n);
       }
-      b(r);
-    } catch (r) {
-      window.alert(r);
+      b(n);
+    } catch (n) {
+      window.alert(n);
     }
-  }, C = async (o) => {
-    if (o.preventDefault(), i && l)
+  }, C = async (t) => {
+    if (t.preventDefault(), i && l)
       try {
-        const r = await S(c, i, l);
-        r && s ? await s(r) : console.log("token", r);
-      } catch (r) {
-        window.alert(r);
+        const n = await S(c, i, l);
+        n && h ? await h(n) : console.log("token", n);
+      } catch (n) {
+        window.alert(n);
       }
   };
-  return /* @__PURE__ */ t(q, { children: [
-    !i && /* @__PURE__ */ t("div", { children: [
-      /* @__PURE__ */ t(u, { onSubmit: y, children: [
+  return /* @__PURE__ */ r(q, { children: [
+    !i && /* @__PURE__ */ r("div", { children: [
+      /* @__PURE__ */ r(m, { onSubmit: y, children: [
         /* @__PURE__ */ e(p, { children: "Enter your phone number" }),
         /* @__PURE__ */ e(d, { children: "Enter your phone up for number to log in or sign an account." }),
-        /* @__PURE__ */ e(x, { children: /* @__PURE__ */ e(P, { value: n, onChange: (o) => g(`${o}`) }) }),
-        /* @__PURE__ */ e(m, { disabled: !F(n), type: "submit", children: "request code" })
+        /* @__PURE__ */ e(x, { children: /* @__PURE__ */ e(P, { value: o, onChange: (t) => g(`${t}`) }) }),
+        /* @__PURE__ */ e(s, { disabled: !F(o), type: "submit", children: "request code" })
       ] }),
-      h && /* @__PURE__ */ e(m, { style: { display: "block", margin: "auto" }, onClick: h, children: "anonymous login" })
+      u && /* @__PURE__ */ e(s, { style: { display: "block", margin: "auto" }, onClick: u, children: "anonymous login" })
     ] }),
-    i && /* @__PURE__ */ t(u, { onSubmit: C, children: [
+    i && /* @__PURE__ */ r(m, { onSubmit: C, children: [
       /* @__PURE__ */ e(p, { children: "Enter Verification Code" }),
-      /* @__PURE__ */ t(d, { children: [
+      /* @__PURE__ */ r(d, { children: [
         "Please enter the verification code ",
         /* @__PURE__ */ e("br", {}),
         "sent to ",
-        /* @__PURE__ */ e("b", { children: v(n) })
+        /* @__PURE__ */ e("b", { children: v(o) })
       ] }),
       /* @__PURE__ */ e(E, { children: /* @__PURE__ */ e(w, { autoFocus: !0, allowedCharacters: "numeric", length: 4, onChange: f }) }),
-      /* @__PURE__ */ e(m, { disabled: l.length !== 4, type: "submit", children: "login" }),
-      /* @__PURE__ */ t(d, { children: [
+      /* @__PURE__ */ e(s, { disabled: l.length !== 4, type: "submit", children: "login" }),
+      /* @__PURE__ */ r(d, { children: [
         "Didn't get 59 the code? ",
         /* @__PURE__ */ e("br", {}),
         "Resend Code in",
@@ -64,5 +58,5 @@ const O = ({ login: s, anonymousLogin: h, host: c }) => {
   ] });
 };
 export {
-  O as Login
+  z as Login
 };

package/lib/ui/modal/index.js

@@ -1,9 +1,8 @@
 import { jsxs as p, jsx as u } from "react/jsx-runtime";
 import { styled as h } from "@linaria/react";
-import { useState as w, useEffect as m } from "react";
-import { r as a } from "../../index-jRXrW6ie.js";
+import { useState as w, useEffect as a } from "react";
+import { r as f } from "../../index-Bicco-Aq.js";
 import { BREAKPOINTS as n } from "../theme/constants.js";
-import "../../index-uEuzH3jr.js";
 const y = /* @__PURE__ */ h("div")({
   name: "StaticContainer",
   class: "svm502q",
@@ -18,17 +17,17 @@ const y = /* @__PURE__ */ h("div")({
   .sl-pill-button {
     display: none !important;
   }
-`, k = ({
+`, W = ({
   children: i,
   container: t,
-  useContainer: f
+  useContainer: m
 }) => {
   const [l] = w(() => {
     var r;
     const e = window.innerWidth >= n.lg && window.innerWidth < n.xl ? 75 : 52;
     return (((r = t.current) == null ? void 0 : r.getBoundingClientRect().y) || 0) - e < 0;
   }), [o, s] = w(!1);
-  return m(() => {
+  return a(() => {
     if (!t.current || !l)
       return s(!0), () => {
       };
@@ -40,21 +39,21 @@ const y = /* @__PURE__ */ h("div")({
         top: e
       });
     };
-  }, []), m(() => {
+  }, []), a(() => {
     if (o && t.current && l) {
       const e = window.innerWidth >= n.lg && window.innerWidth < n.xl ? 75 : 52;
       window.scrollTo({
         top: t.current.offsetTop - e
       });
     }
-  }, [o]), !t.current || !o ? null : f ? a.createPortal(/* @__PURE__ */ p(y, {
+  }, [o]), !t.current || !o ? null : m ? f.createPortal(/* @__PURE__ */ p(y, {
     children: [i, /* @__PURE__ */ u("style", {
       children: g
     }), /* @__PURE__ */ u("style", {
       children: O
     })]
-  }), t.current, "modal-node") : a.createPortal(i, t.current, "modal-node");
+  }), t.current, "modal-node") : f.createPortal(i, t.current, "modal-node");
 };
 export {
-  k as ModalPortal
+  W as ModalPortal
 };

package/lib/ui/navigation/button/Channels.js

@@ -2,26 +2,23 @@ import { jsx as o } from "react/jsx-runtime";
 import { styled as e } from "@linaria/react";
 import { SvgIcon as s } from "../../icons/index.js";
 import { Button as c } from "./index.js";
-import "react";
-import "@linaria/core";
-import "./styles.js";
-const r = () => s, a = /* @__PURE__ */ e(r())({
+const a = () => s, l = /* @__PURE__ */ e(a())({
   name: "ButtonIcon",
   class: "b1whzxvd",
   propsAsIs: !0
-}), B = "channels", I = (n) => {
+}), d = "channels", p = (n) => {
   var t;
   return /* @__PURE__ */ o(c, {
     ...n,
     id: "channels",
     label: "Channels",
-    icon: /* @__PURE__ */ o(a, {
+    icon: /* @__PURE__ */ o(l, {
       name: "icon-btn-channels",
       "data-selected": (t = n.active) == null ? void 0 : t.toString()
     })
   });
 };
 export {
-  I as ChannelsButton,
-  B as ChannelsButtonId
+  p as ChannelsButton,
+  d as ChannelsButtonId
 };

package/lib/ui/navigation/button/FeaturedGroups.js

@@ -2,14 +2,11 @@ import { jsx as e } from "react/jsx-runtime";
 import { styled as r } from "@linaria/react";
 import { SvgIcon as u } from "../../icons/index.js";
 import { Button as n } from "./index.js";
-import "react";
-import "@linaria/core";
-import "./styles.js";
 const s = () => u, a = /* @__PURE__ */ r(s())({
   name: "ButtonIcon",
   class: "b11des7c",
   propsAsIs: !0
-}), G = "featuredGroups", B = (t) => {
+}), i = "featuredGroups", l = (t) => {
   var o;
   return /* @__PURE__ */ e(n, {
     ...t,
@@ -22,6 +19,6 @@ const s = () => u, a = /* @__PURE__ */ r(s())({
   });
 };
 export {
-  B as FeaturedGroupsButton,
-  G as FeaturedGroupsButtonId
+  l as FeaturedGroupsButton,
+  i as FeaturedGroupsButtonId
 };

package/lib/ui/navigation/button/LeaderBoard.js

@@ -1,27 +1,24 @@
-import { jsx as r } from "react/jsx-runtime";
-import { styled as e } from "@linaria/react";
+import { jsx as e } from "react/jsx-runtime";
+import { styled as r } from "@linaria/react";
 import { SvgIcon as a } from "../../icons/index.js";
 import { Button as d } from "./index.js";
-import "react";
-import "@linaria/core";
-import "./styles.js";
-const n = () => a, m = /* @__PURE__ */ e(n())({
+const n = () => a, c = /* @__PURE__ */ r(n())({
   name: "ButtonIcon",
   class: "b180jd7l",
   propsAsIs: !0
-}), u = "leaderboard", I = (o) => {
+}), B = "leaderboard", b = (o) => {
   var t;
-  return /* @__PURE__ */ r(d, {
+  return /* @__PURE__ */ e(d, {
     ...o,
     label: "Leader Board",
     id: "leaderboard",
-    icon: /* @__PURE__ */ r(m, {
+    icon: /* @__PURE__ */ e(c, {
       name: "icon-btn-leaderboard",
       "data-selected": (t = o.active) == null ? void 0 : t.toString()
     })
   });
 };
 export {
-  I as LeaderBoardButton,
-  u as LeaderBoardButtonId
+  b as LeaderBoardButton,
+  B as LeaderBoardButtonId
 };

package/lib/ui/navigation/button/index.js

@@ -1,20 +1,19 @@
-import { jsx as e, jsxs as l, Fragment as m } from "react/jsx-runtime";
-import { cx as d } from "@linaria/core";
-import { SButton as s, SelectedButton as u, HoverIconState as p, HoverIconLeaderboardState as h, ButtonIcon as B, ButtonLabel as f } from "./styles.js";
-import "@linaria/react";
-const I = ({ disabled: n, active: r, onClick: a, label: c, icon: o, id: t }) => /* @__PURE__ */ e(
+import { jsx as t, jsxs as l, Fragment as d } from "react/jsx-runtime";
+import { cx as m } from "@linaria/core";
+import { SButton as s, SelectedButton as u, HoverIconState as h, HoverIconLeaderboardState as p, ButtonIcon as B, ButtonLabel as f } from "./styles.js";
+const I = ({ disabled: n, active: r, onClick: a, label: c, icon: o, id: e }) => /* @__PURE__ */ t(
   s,
   {
     onClick: a,
     disabled: n,
-    className: d(
+    className: m(
       r && u,
-      !r && (t === "channels" || t === "featuredGroups") && p,
-      !r && t === "leaderboard" && h
+      !r && (e === "channels" || e === "featuredGroups") && h,
+      !r && e === "leaderboard" && p
     ),
-    children: /* @__PURE__ */ l(m, { children: [
-      o && /* @__PURE__ */ e(B, { children: o }),
-      /* @__PURE__ */ e(f, { children: c })
+    children: /* @__PURE__ */ l(d, { children: [
+      o && /* @__PURE__ */ t(B, { children: o }),
+      /* @__PURE__ */ t(f, { children: c })
     ] })
   }
 );

package/lib/ui/navigation/masters.js

@@ -1,7 +1,6 @@
 import { styled as a } from "@linaria/react";
 import { Navigation as s } from "./index.js";
-import "react/jsx-runtime";
-const p = /* @__PURE__ */ a("div")({
+const n = /* @__PURE__ */ a("div")({
   name: "Navigation",
   class: "n19lpak2",
   propsAsIs: !1
@@ -11,6 +10,6 @@ const p = /* @__PURE__ */ a("div")({
   propsAsIs: !0
 });
 export {
-  p as Navigation,
+  n as Navigation,
   e as NavigationItems
 };

package/lib/ui/questions/insight/index.js

@@ -1,35 +1,30 @@
-import { jsxs as g, jsx as d } from "react/jsx-runtime";
+import { jsxs as c, jsx as o } from "react/jsx-runtime";
 import { QuestionImages as I } from "@streamlayer/sdk-web-types";
 import { VideoPlayer as e } from "../../video-player/index.js";
 import { Container as v, ImageContainer as C, Image as b, Content as x, Title as D, Description as T } from "./styles.js";
-import "@linaria/core";
-import "react";
-import "../../icons/index.js";
-import "@linaria/react";
-import "../../video-player/styles.js";
-const R = ({
+const M = ({
   instantView: r,
-  isDetail: m,
-  notification: o,
-  controlVideo: c
+  isDetail: l,
+  notification: d,
+  controlVideo: p
 }) => {
-  const l = r == null ? void 0 : r.heading, p = r == null ? void 0 : r.body, h = l || p, u = o == null ? void 0 : o.title, y = o == null ? void 0 : o.body;
-  return /* @__PURE__ */ g(v, { children: [
-    (r == null ? void 0 : r.video) && /* @__PURE__ */ d(
+  const m = r == null ? void 0 : r.heading, h = r == null ? void 0 : r.body, g = m || h, u = d == null ? void 0 : d.title, y = d == null ? void 0 : d.body;
+  return /* @__PURE__ */ c(v, { children: [
+    (r == null ? void 0 : r.video) && /* @__PURE__ */ o(
       e,
       {
         source: r.video.url,
         poster: r.video.thumbnailUrl,
-        controlVideo: c
+        controlVideo: p
       }
     ),
-    (r == null ? void 0 : r.image) && !(r != null && r.video) && /* @__PURE__ */ d(C, { "data-rounded": r.imageMode === I.ROUNDED, children: /* @__PURE__ */ d(b, { src: r == null ? void 0 : r.image }) }),
-    /* @__PURE__ */ g(x, { children: [
-      /* @__PURE__ */ d(D, { children: m && h ? l : u }),
-      /* @__PURE__ */ d(T, { children: m && h ? p : y })
+    (r == null ? void 0 : r.image) && !(r != null && r.video) && /* @__PURE__ */ o(C, { "data-rounded": r.imageMode === I.ROUNDED, children: /* @__PURE__ */ o(b, { src: r == null ? void 0 : r.image }) }),
+    /* @__PURE__ */ c(x, { children: [
+      /* @__PURE__ */ o(D, { children: l && g ? m : u }),
+      /* @__PURE__ */ o(T, { children: l && g ? h : y })
     ] })
   ] });
 };
 export {
-  R as InsightContent
+  M as InsightContent
 };