@streamlayer/react 1.2.0 → 1.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/app/advertisement.d.ts +2 -0
- package/lib/cjs/advertisement.js +1 -1
- package/lib/cjs/auth.js +1 -1
- package/lib/cjs/gamification-feature.js +1 -1
- package/lib/cjs/index.js +1 -1
- package/lib/cjs/index2.js +1 -188
- package/lib/cjs/masters.js +1 -1
- package/lib/cjs/masters2.js +1 -1
- package/lib/cjs/points.js +1 -1
- package/lib/cjs/provider.js +188 -0
- package/lib/cjs/useStreamLayerApp2.js +1 -1
- package/lib/dist/cjs/masters.js +1 -1
- package/lib/dist/es/masters.js +1 -1
- package/lib/es/advertisement.js +142 -137
- package/lib/es/auth.js +1 -1
- package/lib/es/gamification-feature.js +1 -1
- package/lib/es/index.js +8 -5
- package/lib/es/index2.js +902 -23171
- package/lib/es/masters.js +1 -1
- package/lib/es/masters2.js +1 -1
- package/lib/es/points.js +2 -2
- package/lib/es/provider.js +23227 -0
- package/lib/es/useStreamLayerApp2.js +4 -4
- package/lib/index.d.ts +1 -0
- package/package.json +19 -19
- package/lib/cjs/app.js +0 -1
- package/lib/es/app.js +0 -958
|
@@ -17698,7 +17698,7 @@ const K_ = ({
|
|
|
17698
17698
|
m = !0;
|
|
17699
17699
|
};
|
|
17700
17700
|
const u = Q_(e, n, a, {
|
|
17701
|
-
version: "1.
|
|
17701
|
+
version: "1.3.0",
|
|
17702
17702
|
onDeepLinkHandled: s,
|
|
17703
17703
|
videoPlayerController: r,
|
|
17704
17704
|
onContentActivate: o
|
|
@@ -17723,9 +17723,9 @@ export {
|
|
|
17723
17723
|
Y as S,
|
|
17724
17724
|
pm as a,
|
|
17725
17725
|
ft as b,
|
|
17726
|
-
|
|
17727
|
-
|
|
17728
|
-
|
|
17726
|
+
ae as c,
|
|
17727
|
+
Yt as d,
|
|
17728
|
+
ur as e,
|
|
17729
17729
|
Yr as g,
|
|
17730
17730
|
Zc as p,
|
|
17731
17731
|
K_ as u
|
package/lib/index.d.ts
CHANGED
|
@@ -7,5 +7,6 @@ import '@streamlayer/sdk-web-features';
|
|
|
7
7
|
import '@streamlayer/sdk-web-interfaces';
|
|
8
8
|
import '@streamlayer/sdk-web-notifications';
|
|
9
9
|
import '@streamlayer/feature-gamification';
|
|
10
|
+
export { StreamLayerThemeProvider } from '@streamlayer/react-ui';
|
|
10
11
|
export { StreamLayerProvider, type DeepLinkCallback, type VideoPlayerCallback } from './app/provider';
|
|
11
12
|
export { StreamLayerSDKReact, useStreamLayer } from './app/app';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@streamlayer/react",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.3.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"author": "StreamLayer, Inc (https://streamlayer.io)",
|
|
6
6
|
"maintainers": [
|
|
@@ -78,17 +78,17 @@
|
|
|
78
78
|
}
|
|
79
79
|
],
|
|
80
80
|
"dependencies": {
|
|
81
|
-
"@streamlayer/feature-gamification": "^1.4.
|
|
82
|
-
"@streamlayer/sdk-web": "^1.2.
|
|
83
|
-
"@streamlayer/sdk-web-analytics": "^1.2.
|
|
84
|
-
"@streamlayer/sdk-web-api": "^1.3.
|
|
85
|
-
"@streamlayer/sdk-web-core": "^1.2.
|
|
86
|
-
"@streamlayer/sdk-web-features": "^1.0.
|
|
87
|
-
"@streamlayer/sdk-web-interfaces": "^1.1.
|
|
88
|
-
"@streamlayer/sdk-web-logger": "^1.0.
|
|
89
|
-
"@streamlayer/sdk-web-notifications": "^1.1.
|
|
90
|
-
"@streamlayer/sdk-web-storage": "^1.0.
|
|
91
|
-
"@streamlayer/sdk-web-types": "^1.3.
|
|
81
|
+
"@streamlayer/feature-gamification": "^1.4.1",
|
|
82
|
+
"@streamlayer/sdk-web": "^1.2.1",
|
|
83
|
+
"@streamlayer/sdk-web-analytics": "^1.2.1",
|
|
84
|
+
"@streamlayer/sdk-web-api": "^1.3.1",
|
|
85
|
+
"@streamlayer/sdk-web-core": "^1.2.1",
|
|
86
|
+
"@streamlayer/sdk-web-features": "^1.0.10",
|
|
87
|
+
"@streamlayer/sdk-web-interfaces": "^1.1.5",
|
|
88
|
+
"@streamlayer/sdk-web-logger": "^1.0.10",
|
|
89
|
+
"@streamlayer/sdk-web-notifications": "^1.1.5",
|
|
90
|
+
"@streamlayer/sdk-web-storage": "^1.0.10",
|
|
91
|
+
"@streamlayer/sdk-web-types": "^1.3.1"
|
|
92
92
|
},
|
|
93
93
|
"peerDependencies": {
|
|
94
94
|
"@bufbuild/protobuf": "^1.10.0",
|
|
@@ -116,11 +116,11 @@
|
|
|
116
116
|
"@esbuild-plugins/node-modules-polyfill": "^0.2.2",
|
|
117
117
|
"@linaria/babel-preset": "^5.0.4",
|
|
118
118
|
"@nrwl/esbuild": "19.8.0",
|
|
119
|
-
"@size-limit/esbuild": "^11.1.
|
|
120
|
-
"@size-limit/esbuild-why": "^11.1.
|
|
121
|
-
"@size-limit/file": "^11.1.
|
|
119
|
+
"@size-limit/esbuild": "^11.1.6",
|
|
120
|
+
"@size-limit/esbuild-why": "^11.1.6",
|
|
121
|
+
"@size-limit/file": "^11.1.6",
|
|
122
122
|
"@testing-library/react": "16.0.1",
|
|
123
|
-
"@types/react": "18.3.
|
|
123
|
+
"@types/react": "18.3.11",
|
|
124
124
|
"@types/react-dom": "18.3.0",
|
|
125
125
|
"@types/react-infinite-scroller": "^1.2.5",
|
|
126
126
|
"@wyw-in-js/vite": "^0.5.3",
|
|
@@ -141,10 +141,10 @@
|
|
|
141
141
|
"react-dom": "18.3.1",
|
|
142
142
|
"react-refresh": "^0.14.2",
|
|
143
143
|
"rollup-plugin-visualizer": "^5.12.0",
|
|
144
|
-
"size-limit": "^11.1.
|
|
144
|
+
"size-limit": "^11.1.6",
|
|
145
145
|
"url-loader": "^4.1.1",
|
|
146
|
-
"vite-plugin-dts": "^4.2.
|
|
147
|
-
"@streamlayer/react-ui": "^1.
|
|
146
|
+
"vite-plugin-dts": "^4.2.3",
|
|
147
|
+
"@streamlayer/react-ui": "^1.5.0"
|
|
148
148
|
},
|
|
149
149
|
"scripts": {
|
|
150
150
|
"size-limit": "size-limit"
|
package/lib/cjs/app.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
"use strict";var U=Object.defineProperty;var z=(e,t,o)=>t in e?U(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o;var g=(e,t,o)=>z(e,typeof t!="symbol"?t+"":t,o);const n=require("react/jsx-runtime"),s=require("./index2.js"),u=require("react"),m=require("./useStreamLayerApp2.js");window.dispatchEvent(new CustomEvent("grpc_devtools_loaded"));function B(e){return e instanceof DOMException&&(e.code===22||e.code===1014||e.name==="QuotaExceededError"||e.name==="NS_ERROR_DOM_QUOTA_REACHED")}class W{constructor(t="main",o=window.localStorage){g(this,"delimiter",":");g(this,"prefix");g(this,"storage");g(this,"clear",()=>{for(const t in window.localStorage)t.startsWith(this.prefix)&&this.storage.removeItem(t)});g(this,"generateKey",t=>`${this.prefix}${this.delimiter}${t.join(this.delimiter)}`);g(this,"write",(...t)=>{const o=t.pop()||"",i=this.generateKey(t);try{this.storage.setItem(i,o)}catch(a){B(a)&&this.storage===window.sessionStorage&&(window.sessionStorage.removeItem("slstreamlogs"),this.storage.setItem(i,o))}});g(this,"read",(...t)=>{const o=this.storage.getItem(this.generateKey(t));return o===null?void 0:o});g(this,"remove",(...t)=>{this.storage.removeItem(this.generateKey(t))});this.prefix=`sl-sdk${this.delimiter}${t}`,this.storage=o}}var w;(function(e){e.Init="init",e.Ready="ready",e.Connecting="connecting",e.Connected="connected",e.Disconnected="disconnected",e.Failed="failed",e.Reconnect="reconnect",e.Reconnecting="reconnecting"})(w||(w={}));m.Code.Unknown,m.Code.Internal,m.Code.DeadlineExceeded,m.Code.ResourceExhausted,m.Code.FailedPrecondition,m.Code.Unavailable,m.Code.DataLoss;s.createLogger("grpc:retry");m.createContextKey(10,{description:"Number of attempts to retry"}),m.createContextKey(3e4,{description:"Max delay between retries in milliseconds"});var N;(function(e){e.SCHEMA="schema",e.EXTERNAL_TOKEN="eToken",e.TOKEN="token"})(N||(N={}));class G extends W{constructor(){super("user");g(this,"setSchema",o=>{this.write(N.SCHEMA,o)});g(this,"getSchema",()=>this.read(N.SCHEMA));g(this,"setToken",o=>{this.write(N.TOKEN,o)});g(this,"getToken",()=>this.read(N.TOKEN));g(this,"setExternalToken",o=>{this.write(N.EXTERNAL_TOKEN,o)});g(this,"getExternalToken",()=>this.read(N.EXTERNAL_TOKEN));g(this,"removeToken",()=>{this.remove(N.TOKEN)})}}var L;(function(e){e.DISABLED="disabled",e.INITIALIZATION="initialization",e.READY="ready",e.FAILED="failed",e.SUSPENDED="suspended"})(L||(L={}));s.createLogger("deep_link");s.createLogger("bypass");new G;s.createLogger("video_player");var T;(function(e){e.SHOWED="showed"})(T||(T={}));var D;(function(e){e.ALLOWED="allowed",e.DISALLOWED="disallowed"})(D||(D={}));var $;(function(e){e.UNKNOWN="unknown",e.ALREADY_VOTED="already_voted"})($||($={}));var O;(function(e){e.ONBOARDING="onboarding",e.ONBOARDING_IO="onboarding_io"})(O||(O={}));var _;(function(e){e.Unset="unset",e.Required="required",e.Optional="optional",e.Completed="completed",e.Disabled="disabled",e.Unavailable="unavailable"})(_||(_={}));m.QuestionType.POLL,m.QuestionType.PREDICTION,m.QuestionType.TRIVIA;const H={[m.SdkOverlayType.GAMES]:!0},I=s.styled_default("div")({name:"LoadingContainer",class:"lclc0ej",propsAsIs:!1}),X=({feature:e,sdk:t,children:o,className:i,noWait:a})=>{const l=s.useStore(e.status),d=s.useStore(t.sdkStore.slStreamId);if(!a){if(d!=null&&d.loading&&!d.data)return n.jsx(I,{className:i,children:"Event is loading..."});if(!(d!=null&&d.data))return n.jsx(I,{className:i,children:"Event is forbidden..."});if(l!==s.FeatureStatus.Ready)return n.jsx(I,{className:i,children:"Wait feature..."})}return o},F=u.createContext({sdk:null}),C=()=>u.useContext(F),Y=s.styled_default("div")({name:"QuestionContainer",class:"q14ckf9e",propsAsIs:!1}),Z=({openedQuestion:e})=>{var t,o;const{sdk:i}=C();return((t=e==null?void 0:e.attributes)==null?void 0:t.attributes.case)==="insight"?n.jsx(s.p,{...e.attributes.attributes.value,controlVideo:i==null?void 0:i.controlVideoPlayer}):((o=e==null?void 0:e.attributes)==null?void 0:o.attributes.case)==="tweet"?n.jsx(s.a,{...e.attributes.attributes.value,controlVideo:i==null?void 0:i.controlVideoPlayer}):null},J=({extendedQuestion:e,vote:t,close:o})=>{const{loading:i,data:a}=e;return a?n.jsx(s.Nt,{vote:t,close:o,openedQuestion:a,isLoading:!!i}):n.jsx(s.kt,{})},ee=({gamification:e,hideSponsor:t,className:o,hideHeader:i})=>{var a,l,d;const c=s.useStore(e.openedQuestion.$store),r=s.useStore(e.openedQuestion.$extendedStore);if(!c)return null;const p=c.type;return n.jsxs(Y,{className:o,children:[!i&&n.jsx(s.T,{close:e.closeQuestion,type:((a=c.attributes)==null?void 0:a.type)||m.QuestionType.UNSET}),p==="question"&&n.jsx(J,{vote:e.submitAnswer,close:e.closeQuestion,extendedQuestion:r}),p!=="question"&&n.jsx(Z,{openedQuestion:c}),!t&&n.jsx(s.i,{sponsorLogo:(d=(l=r.data)==null?void 0:l.sponsorship)==null?void 0:d.logo})]})},se=s.styled_default("div")({name:"InviteFriendsContainer",class:"i1c9dygq",propsAsIs:!1}),te=({deepLink:e})=>n.jsx(se,{children:n.jsx(s.M,{inviteLink:e,inviteCardTitle:"It’s More Fun With Friends",inviteCardSubtext:"Invite and compete against your friends for the top spot on the leaderboard."})}),ne=s.styled_default("div")({name:"InviteLinkContainer",class:"i1odbhm4",propsAsIs:!1}),oe=({gamification:e,scrollNode:t,scrollStore:o})=>{const i=u.useRef(null),{data:a,hasMore:l,loading:d,key:c}=s.useStore(e.leaderboardList.$store),{data:r}=s.useStore(e.deepLink.$store),[p,v]=s.T$1(i);return!a.length&&!d?n.jsx(te,{deepLink:r}):n.jsxs(n.Fragment,{children:[n.jsx(s.S,{items:a,scrollNode:t,scrollStore:o,fetchMore:e.leaderboardList.fetchMore,hasMore:l,openItemDetail:e.openUser,currentUserId:e.currentUserId.get()},c),r&&n.jsx(ne,{ref:i,children:n.jsx(s.C,{onClick:()=>p(r),title:"Invite Friends",description:"Challenge them now!"})}),v]})},ie=({store:e,openQuestion:t})=>{const{sdk:o}=C(),i=s.useStore(e);return n.jsx(s.k,{openQuestion:t,questions:i.data,controlVideo:o==null?void 0:o.controlVideoPlayer})},re=({userSummary:e})=>{var t;const[o,i]=u.useState(void 0);return u.useEffect(()=>{const a=e.$store.subscribe(l=>{l&&i(l)});return()=>{a()}},[e]),n.jsx(s.O,{loading:!(o!=null&&o.summary),...o==null?void 0:o.summary,successRate:(t=o==null?void 0:o.percentage)==null?void 0:t.correct})},ae=({gamification:e,className:t,scrollStore:o,scrollNode:i,appNode:a,style:l,responsiveStore:d})=>{const{tabsShown:c}=s.useStore(o,{keys:["tabsShown"]}),[r,p]=u.useState(s.m.HOME),[,v]=u.useTransition(),{sdkInDesktopView:h,screen:f}=s.useStore(d,{keys:["sdkInDesktopView"]}),x=k=>{v(()=>{var y;p(k),h===!1&&(((y=a.current)==null?void 0:y.getBoundingClientRect().y)||0)<0&&s.C$2(a,f.size,{behavior:"instant"})})};u.useEffect(()=>o.subscribe(k=>{if(k.scrollPosition===0){o.setKey("tabsShown",!0);return}d.get().sdkInDesktopView?o.setKey("tabsShown",k.scrollDirection==="backward"):o.setKey("tabsShown",k.scrollDirection==="forward")}),[o,d]);let S="0px";return h?S=c?"0px":"calc(8px - var(--header-height) - var(--header-offset))":S=c?"calc(var(--header-height) + var(--header-offset) - 2px)":"0px",n.jsxs(s.l,{className:t,style:l,children:[n.jsx(s.C$1,{style:{top:S},children:n.jsx(s.b,{activePage:r,toggleActivePage:x})}),r===s.m.HOME&&n.jsxs(n.Fragment,{children:[n.jsx(s.n,{style:{paddingTop:"8px"},children:n.jsx(s.m$1,{children:n.jsx(re,{userSummary:e.userSummary})})}),n.jsx(s.a$1,{style:{flex:1},children:n.jsx(ie,{openQuestion:e.openQuestion,store:e.feedList.getStore()})})]}),r===s.m.LEADERBOARD&&n.jsx(s.p$1,{children:n.jsx(oe,{scrollStore:o,scrollNode:i,gamification:e})})]})},le=()=>s.x$1,R=s.styled_default(le())({name:"OpenedContainer",class:"ouvguos",propsAsIs:!0}),de=s.styled_default("div")({name:"UserContainer",class:"u1eu4lbg",propsAsIs:!1}),ce=({correct:e,incorrect:t})=>{const o=e+t;return o===0?0:Math.round(e/o*100)},ue=({gamification:e,scrollStore:t,className:o,appNode:i,scrollNode:a,responsiveStore:l})=>n.jsx(ae,{appNode:i,scrollStore:t,scrollNode:a,className:o,gamification:e,responsiveStore:l}),pe=({gamification:e,className:t,appNode:o,responsiveStore:i})=>{const a=s.useStore(e.openedQuestion.$store),l=s.useStore(e.openedUser),{sdkInDesktopView:d}=s.useStore(i,{keys:["sdkInDesktopView"]}),{hiding:c,onAnimationEnd:r}=s.S$1();if(!o.current||!a&&!l)return null;const p=a?n.jsx(R,{className:t,hiding:c,onAnimationEnd:r,children:n.jsx(ee,{gamification:e})}):l?n.jsx(R,{className:t,hiding:c,onAnimationEnd:r,children:n.jsxs(de,{children:[n.jsx(s.T,{label:"Friend's Rank",close:e.closeUser}),n.jsx(s.n,{children:n.jsx(s.O,{...l,successRate:ce(l)})})]})}):null;return n.jsx(s.x,{container:o,useContainer:!d,children:p})},ve=u.lazy(()=>Promise.resolve().then(()=>require("./gamification-feature.js"))),he=({sdk:e,feature:t,className:o,scrollStore:i,appNode:a,scrollNode:l,responsiveStore:d})=>{const c=u.useMemo(()=>t&&t.featureConfig.get().type===m.SdkOverlayType.GAMES?n.jsx(X,{className:o,sdk:e,feature:t,children:n.jsx(ve,{appNode:a,scrollStore:i,scrollNode:l,className:o,responsiveStore:d,gamification:t})}):null,[e,t,o,d,i,l,a]);return n.jsx(u.Suspense,{fallback:n.jsx("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",width:"100%",height:"100%"},children:"page loading..."}),children:c})},me=({feature:e,className:t,appNode:o,responsiveStore:i})=>e&&e.featureConfig.get().type===m.SdkOverlayType.GAMES?n.jsx(pe,{className:t,appNode:o,responsiveStore:i,gamification:e}):null,ge=()=>s.c1,fe=s.styled_default(ge())({name:"ButtonIcon",class:"b11wpe79",propsAsIs:!0}),ye=u.forwardRef(({sdk:e,className:t},o)=>{const i=s.useStore(e.sdkStore.organizationSettings),a=s.useStore(e.sdkStore.streamSettings),l=s.useStore(e.getActiveFeature()),d=u.useMemo(()=>{const r=(a==null?void 0:a.data)||(i==null?void 0:i.data);return r!=null&&r.overlays?r.overlays:[]},[i,a]),c=u.useMemo(()=>[...d.filter(({enableSdkButton:r,type:p})=>p===m.SdkOverlayType.GAMES||r).map(r=>({id:r.type,onClick:()=>e.openFeature(r.type),disabled:!(r.type in H),label:r.name,icon:n.jsx("img",{src:r.icon,alt:""}),position:r.position*10}))].sort((r,p)=>r.position-p.position),[d,e]);return n.jsxs(s.n$1,{className:t,children:[c.length!==0&&n.jsx(s.e,{children:[n.jsx(s.I,{id:"Channels",onClick:()=>e.closeFeature(),label:"Channels",active:l===0},"Channels"),...c.map(r=>r.id===m.SdkOverlayType.GAMES?n.jsx(s.I,{...r,active:r.id===l,label:"StreamLayer +",id:"featuredGroups",icon:n.jsx(fe,{name:"icon-btn-feature-groups","data-selected":r.id===l})},r.id):n.jsx(s.I,{...r,icon:void 0,active:r.id===l},r.id))]}),!c.length&&n.jsx(s.e,{children:[n.jsx(s.I,{id:"empty",label:"No Features...",active:!1,disabled:!0},"empty")]}),n.jsx("div",{ref:o})]})}),xe=s.styled_default("div")({name:"Container",class:"c1qjj4d4",propsAsIs:!1}),Se=s.styled_default("div")({name:"CloseIconWrap",class:"c1lg6b8a",propsAsIs:!1}),ke=()=>s.c1,Ne=s.styled_default(ke())({name:"CloseIcon",class:"c159el66",propsAsIs:!0}),je=s.styled_default("div")({name:"Title",class:"t16xmufv",propsAsIs:!1}),be=s.styled_default("img")({name:"SponsorLogo",class:"s83lc21",propsAsIs:!1}),Ie=s.styled_default("div")({name:"PresentsTitle",class:"p1p7igia",propsAsIs:!1}),Ee=s.styled_default("div")({name:"Subtitle",class:"s1eftsbu",propsAsIs:!1}),Ce=s.styled_default("div")({name:"Description",class:"d8uezec",propsAsIs:!1}),Ae=s.styled_default("button")({name:"ActionButton",class:"a1h1bk90",propsAsIs:!1}),q=({close:e,action:t,onboarding:o})=>{var i,a,l,d,c,r,p,v;return n.jsxs(xe,{children:[n.jsx(Se,{onClick:e,children:n.jsx(Ne,{name:"icon-cross"})}),((a=(i=o==null?void 0:o.titleCard)==null?void 0:i.media)==null?void 0:a.sponsorLogo)&&n.jsxs(je,{children:[n.jsx(be,{alt:"sponsor-logo",src:(d=(l=o==null?void 0:o.titleCard)==null?void 0:l.media)==null?void 0:d.sponsorLogo}),n.jsx(Ie,{children:"PRESENTS"})]}),((c=o==null?void 0:o.titleCard)==null?void 0:c.title)&&n.jsx(Ee,{children:(r=o==null?void 0:o.titleCard)==null?void 0:r.title}),((p=o==null?void 0:o.titleCard)==null?void 0:p.subtitle)&&n.jsx(Ce,{children:(v=o==null?void 0:o.titleCard)==null?void 0:v.subtitle}),n.jsx(Ae,{onClick:t,children:"Play Now"})]})},E=[{graphicSrc:"https://cdn.streamlayer.io/assets/sdk-web/onboarding-steps/step_0.png",tagline:"",headline:n.jsxs(n.Fragment,{children:["Welcome to ",n.jsx("br",{})," StreamLayer +"]})},{graphicSrc:"https://cdn.streamlayer.io/assets/sdk-web/onboarding-steps/step_2.png",headline:"Get real-time insights"},{graphicSrc:"https://cdn.streamlayer.io/assets/sdk-web/onboarding-steps/step_3.png",headline:"Predictions, trivia & polls synced to match play"},{graphicSrc:"https://cdn.streamlayer.io/assets/sdk-web/onboarding-steps/step_4.png",headline:"Win points for every answer you get right"},{graphicSrc:"https://cdn.streamlayer.io/assets/sdk-web/onboarding-steps/step_5.png",headline:"Compete against friends on the leaderboard"}],we=s.styled_default("div")({name:"OnboardingContainer",class:"o1xni1kr",propsAsIs:!1}),Le=()=>s.x$1,Te=s.styled_default(Le())({name:"OnboardingNotificationContainer",class:"o1vnouv7",propsAsIs:!0}),V=s.styled_default("div")({name:"InnerContainer",class:"i59uefw",propsAsIs:!1}),De=({deepLink:e,onboardingOpts:t,notification:o,gamification:i,loading:a,sdk:l})=>{var d,c,r,p,v,h,f;const x=s.useStore(i.friends.getStore()),[S,k]=u.useState(void 0),y=u.useMemo(()=>{var j,b;const A=l.getInviter();return A?(b=(j=x.data)==null?void 0:j.find(({slId:K})=>K===A))==null?void 0:b.name:""},[x.data,l]);return u.useEffect(()=>{const j=e.$store.subscribe(b=>{b&&k(b.data)});return()=>{j()}},[e.$store]),n.jsx(we,{children:n.jsx(s.rn,{loading:a,rules:[{label:"Answer as many questions as you like.",icon:"icon-btn-feature-groups"},{label:"Win points for each correct trivia or prediction answer.",icon:"icon-thumb-up"},{label:"Top the leader board and best your friends.",icon:"icon-trophy"}],rulesBtnLabel:(d=t.rules)==null?void 0:d.buttonLabel,rulesTitle:(c=t.rules)==null?void 0:c.heading,termsTitle:"Terms and Conditions",termsText:(r=t.rules)==null?void 0:r.terms,steps:E,primaryColor:(p=t.inviteCard)==null?void 0:p.iconColor,inviteLink:S,inviteCardTitle:(v=t.inviteCard)==null?void 0:v.heading,inviteCardSubtext:(h=t.inviteCard)==null?void 0:h.subtext,inviteCardBtnLabel:(f=t.inviteCard)==null?void 0:f.buttonLabel,onClose:()=>{var j;(j=o.close)==null||j.call(o)},gamification:i,sdk:l,inviterName:y})})},$e=({sdk:e,notification:t,saveHeight:o,style:i,appNode:a,sdkInDesktopView:l,responsiveStore:d})=>{const c=u.useRef(null),r=t.data.onboarding,[p,v]=u.useState(r==null?void 0:r.instantOpen),h=e.getFeature(m.SdkOverlayType.GAMES),f=u.useMemo(()=>E==null?void 0:E.map(({graphicSrc:y})=>y),[]),{screen:x}=s.useStore(d,{keys:["screen"]});u.useLayoutEffect(()=>{var y;o(((y=c.current)==null?void 0:y.getBoundingClientRect().height)||0)},[o]);const{loading:S,throttled:k}=s.I$1(f);return p&&h&&r&&a.current&&!k?n.jsx(s.x,{container:a,useContainer:!l,children:n.jsx(De,{notification:t,setOpened:v,gamification:h,onboardingOpts:r,deepLink:h.deepLink,loading:S,renderToNode:a,sdk:e})}):n.jsxs(n.Fragment,{children:[n.jsx(V,{ref:c,style:{position:"absolute",visibility:"hidden"},children:n.jsx(q,{close:()=>{},action:()=>{},onboarding:r})}),n.jsx(Te,{style:i,hiding:t.hiding,children:n.jsx(V,{children:n.jsx(q,{close:t.close,action:()=>{var y;v(!0),(((y=a.current)==null?void 0:y.getBoundingClientRect().y)||0)<0&&s.C$2(a,x.size,{behavior:"smooth"})},onboarding:r})})})]})},Oe=()=>s.x$1,_e=s.styled_default(Oe())({name:"Container",class:"c8ol1ve",propsAsIs:!0}),M=s.styled_default("div")({name:"InnerContainer",class:"iqfywam",propsAsIs:!1}),Re=()=>M,qe=s.styled_default(Re())({name:"HiddenContainer",class:"hokmtod",propsAsIs:!0}),Ve=s.styled_default("div")({name:"NotificationRefreshing",class:"n192d1q8",propsAsIs:!1}),Fe=()=>s.h,Me=s.styled_default(Fe())({name:"Pill",class:"p1lha68t",propsAsIs:!0}),Pe=e=>{const[t,o]=u.useState(0),i=u.useRef(null),a=u.useCallback(d=>{i.current=d},[]);u.useEffect(()=>{var d;const c=(d=i.current)==null?void 0:d.getBoundingClientRect();c&&o(c.height)},[e]);const l=u.useCallback(d=>{o(d)},[]);return[a,t,l]},Qe=({sdk:e,notification:t,appNode:o,responsiveStore:i})=>{var a,l;const{sdkInDesktopView:d}=s.useStore(i,{keys:["sdkInDesktopView"]}),{sdk:c}=C(),[r,p,v]=Pe(t.id);return t.type===s.NotificationType.QUESTION?n.jsxs(n.Fragment,{children:[n.jsx(qe,{ref:r,children:n.jsx(s.k$1,{...t})}),n.jsxs(_e,{style:{height:t.hiding?0:p},hiding:t.hiding,children:[n.jsx(M,{style:{height:"100%"},children:n.jsx(s.k$1,{...t,controlVideo:c==null?void 0:c.controlVideoPlayer})}),n.jsx(Ve,{},t.id)]})]}):t.type===s.NotificationType.QUESTION_RESOLVED&&(l=(a=t.data)==null?void 0:a.question)!=null&&l.predictionResult?n.jsx(s.q,{style:{height:t.hiding?0:p},saveHeight:v,close:t.close,hiding:t.hiding,...t.data.question}):t.type===s.NotificationType.ONBOARDING?n.jsx($e,{style:{height:t.hiding?0:p},saveHeight:v,sdk:e,notification:t,sdkInDesktopView:d,appNode:o,responsiveStore:i}):null},Ke="p7vfi6t",Ue=({pill:e,setPill:t,appNode:o,headerNode:i,scrollNode:a,responsiveStore:l,scrollStore:d})=>{var c,r;const{screen:p}=s.useStore(l,{keys:["screen"]}),{tabsShown:v,scrollPosition:h}=s.useStore(d,{keys:["tabsShown","scrollPosition"]});u.useEffect(()=>{l.get().sdkInDesktopView?h<50&&t(null):h>-50&&t(null)},[h,l,t]);const f=l.get().sdkInDesktopView?o:i;return!e||!f.current?null:s.Ik.createPortal(n.jsx(Me,{title:e.type===s.NotificationType.QUESTION_RESOLVED?"Prediction result":`New ${((r=s.o[(c=e.data)==null?void 0:c.questionType])==null?void 0:r.label)||"notification"}`,onClick:()=>{var x;l.get().sdkInDesktopView?(x=a.current)==null||x.scrollTo({top:0,behavior:"smooth"}):s.C$2(o,p.size,{behavior:"smooth"}),t(null)},className:s.cx_default(v&&Ke,"sl-pill-button")}),f.current)},ze=({sdk:e,headerNode:t,scrollNode:o,responsiveStore:i,appNode:a,scrollStore:l})=>{const[d]=u.useState(e.getNotificationsStore()),c=s.useStore(d),[r,p]=u.useState(null),v=u.useMemo(()=>e.getActiveNotification(),[e,c]);return u.useEffect(()=>{v&&s.eventBus.emit("notification",{action:"rendered",payload:{questionId:v.data.questionId,questionType:v.data.questionType}})},[v]),u.useEffect(()=>{v&&(i.get().sdkInDesktopView||i.get().sdkInView)&&(!i.get().sdkInDesktopView&&i.get().sdkInView&&p(v),i.get().sdkInDesktopView&&window.requestAnimationFrame(()=>{l.get().scrollPosition!==0&&p(v)}))},[v]),u.useEffect(()=>{v||p(null)},[v]),n.jsxs(n.Fragment,{children:[!r&&v&&n.jsx(Qe,{headerNode:t,appNode:a,sdk:e,notification:v,responsiveStore:i}),r&&n.jsx(Ue,{pill:r,setPill:p,appNode:a,notification:v,headerNode:t,scrollNode:o,scrollStore:l,responsiveStore:i})]})},P=e=>{const t=u.useRef(""),[o,i]=u.useState(!1),a=s.useStore(e.status),l=s.useStore(e.sdkStore.slStreamId),d=s.useStore(e.userId()),c=s.useStore(e.getActiveFeature()),r=a==="ready"&&!!l.data;u.useEffect(()=>{const h=e.getFeature(m.SdkOverlayType.GAMES);h&&(h.closeQuestion(),h.closeUser())},[c,e]);const p=u.useCallback(h=>{t.current=h,i(!0),e.initializeApp({skipOrganizationSettings:!0}).then(({enabled:f,err:x})=>{if(!x&&f){e.isUserAuthorized().then(S=>{S||e.disableApp()});return}})},[e]),v=u.useCallback(()=>{i(!1),e.disableApp()},[e]);return u.useEffect(()=>{if(!d){r&&e.disableApp();return}if(d&&t.current&&o){e.initializeApp({skipOrganizationSettings:!0}).then(()=>{e.createEventSession(t.current)});return}},[d]),u.useEffect(()=>()=>{i(!1),e.disableApp()},[i,e]),{sdkEnabled:o,sdkReady:r,activateEventWithId:p,deactivate:v,isLogged:!!d}},Be=({sdk:e,className:t,scrollStore:o,appNode:i,scrollNode:a,responsiveStore:l})=>{const[,d]=s.p$2(e);return n.jsx(he,{className:t,scrollNode:a,appNode:i,scrollStore:o,feature:d,responsiveStore:l,sdk:e})},We=({sdk:e,className:t,appNode:o,responsiveStore:i})=>{const a=s.useStore(e.featuresList.getStore());return a?Array.from(a,l=>{const d=e.getFeature(l);return d?n.jsx(me,{className:t,appNode:o,feature:d,responsiveStore:i,sdk:e},l):null}):null},Ge=({sdk:e,event:t})=>{const o=u.useRef(null),i=u.useRef(null),[a]=s.v(o),[l,d]=s.D(o,a),{sdkEnabled:c,sdkReady:r,activateEventWithId:p,deactivate:v,isLogged:h}=P(e);u.useEffect(()=>{t?(e.createEventSession(t),p(t)):v()},[t,p,v,e]),s.L(o,{enabled:c,event:"click",listener:s.b$1}),s.L(l,{enabled:c,event:"scrollend",listener:s.y,useDomNode:!0}),s.L(l,{enabled:c,event:"click",listener:s.w,useDomNode:!0});const f=u.useMemo(()=>({sdk:e}),[e]);return u.useEffect(()=>{Promise.resolve().then(()=>require("./gamification-feature.js"))},[]),n.jsx(F.Provider,{value:f,children:n.jsxs(s.i$1,{ref:o,children:[c&&n.jsx(ye,{className:s.f,sdk:e,ref:i}),n.jsxs(s.c,{className:"sl-hide-on-modal",ref:l,"data-nav":c.toString(),children:[r&&n.jsx(ze,{sdk:e,scrollNode:l,headerNode:i,appNode:o,scrollStore:d,responsiveStore:a}),r&&n.jsx(Be,{scrollStore:d,responsiveStore:a,scrollNode:l,appNode:o,className:s.f,sdk:e}),r&&n.jsx(We,{responsiveStore:a,appNode:o,className:s.f,sdk:e})]}),c&&!h&&n.jsx("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",width:"100%",height:"100%"},children:"You are not logged in."})]})})},Q=({children:e,customTheme:t,style:o})=>n.jsx("div",{className:"StreamLayerSDKTheme",children:n.jsx("div",{className:s.cx_default(s.v$1,t),style:o,children:e})}),He=()=>{const{sdk:e}=u.useContext(s.StreamLayerContext);return e},Xe=({event:e})=>{const{sdk:t,status:o}=u.useContext(s.StreamLayerContext);if(o===s.StreamLayerStatus.UNSET)throw new Error("Wrap app in `StreamLayerProvider`");return o===s.StreamLayerStatus.CONNECTED?n.jsx("div",{className:"StreamLayerSDK",children:"wait"}):t===null?n.jsx("div",{className:"StreamLayerSDK",children:"sdk not initialized"}):n.jsx("div",{className:"StreamLayerSDK",children:n.jsx(Q,{children:n.jsx(Ge,{sdk:t,event:e})})})};exports.E=ue;exports.F=P;exports.StreamLayerSDKReact=Xe;exports.d=Q;exports.useStreamLayer=He;
|