@streamlayer/react 1.1.2 → 1.1.4
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 +1 -0
- package/lib/app/app.d.ts +0 -1
- package/lib/app/masters.d.ts +0 -1
- package/lib/app/provider.d.ts +0 -1
- package/lib/app/useStreamLayerApp.d.ts +0 -1
- package/lib/cjs/advertisement.js +1 -1
- package/lib/cjs/app.js +1 -1
- package/lib/cjs/index2.js +37 -37
- package/lib/cjs/masters2.js +2 -2
- package/lib/cjs/points.js +1 -1
- package/lib/cjs/useStreamLayerApp2.js +14 -14
- package/lib/dist/cjs/masters.js +75 -75
- package/lib/dist/es/masters.js +14935 -14661
- package/lib/dist/style.css +1 -1
- package/lib/es/advertisement.js +235 -209
- package/lib/es/app.js +323 -311
- package/lib/es/index2.js +2050 -2046
- package/lib/es/masters2.js +11 -11
- package/lib/es/points.js +3 -3
- package/lib/es/useStreamLayerApp2.js +3592 -3329
- package/lib/style.css +1 -1
- package/package.json +28 -28
- package/lib/dist/index.d.ts +0 -2208
package/lib/app/app.d.ts
CHANGED
package/lib/app/masters.d.ts
CHANGED
package/lib/app/provider.d.ts
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import { StreamLayerSDK, StreamLayerPlugin } from '@streamlayer/sdk-web-interfaces';
|
|
2
2
|
import { DeepLinkCallback, VideoPlayerCallback } from '@streamlayer/sdk-web-core';
|
|
3
|
-
|
|
4
3
|
export type { DeepLinkCallback, VideoPlayerCallback } from '@streamlayer/sdk-web-core';
|
|
5
4
|
export declare enum StreamLayerStatus {
|
|
6
5
|
UNSET = 0,
|
package/lib/cjs/advertisement.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),v=require("react"),o=require("./index2.js"),b=require("./app.js"),d=require("./useStreamLayerApp2.js"),D=o.styled_default("div")({name:"Container",class:"c5b6wdg",propsAsIs:!1}),G="a1rlj479",U="s35f1di",F="sj4471g",z="b12050d8",H="b1d5ybek",K=e=>e==="left"||e==="right"?U:z,W=e=>e==="left"||e==="right"?F:H,Q=e=>e==="left"?"avdxyl3":e==="right"?"a1bisd08":e==="top"?"a1u9y2aj":"a1qqaks",w=({children:e,style:l,className:a,enabled:n=!0,hiding:t,direction:i="left",onAnimationEnd:r})=>s.jsx(D,{style:l,className:o.cx_default(a,G,Q(i),n&&!t&&K(i),n&&t&&W(i)),onAnimationEnd:r,children:e}),J=o.styled_default("a")({name:"Link",class:"l1sgte8c",propsAsIs:!1}),V=o.styled_default("div")({name:"BannerContainer",class:"b7yfc72",propsAsIs:!1}),X=()=>J,Y=o.styled_default(X())({name:"BannerLink",class:"bejjq94",propsAsIs:!0}),Z=o.styled_default("img")({name:"BannerImg",class:"b1j94hdr",propsAsIs:!1}),ee=({promotion:e,promotionId:l,hiding:a,direction:n="bottom"})=>{var t;return(t=e.additionalBanner)!=null&&t.imageUrl?s.jsx(w,{direction:n,hiding:a,children:s.jsx(V,{children:s.jsx(Y,{href:e.additionalBanner.url,"data-promo-id":l,"data-promo-type":e.type,"data-analytics":"banner",target:"_blank",children:s.jsx(Z,{src:e.additionalBanner.imageUrl,alt:"promo"})})})}):null},se=o.styled_default("div")({name:"OverlayContainer",class:"okzhq2w",propsAsIs:!1}),oe=o.styled_default("div")({name:"PromoOverlay",class:"pmgz5i",propsAsIs:!1}),te=o.styled_default("div")({name:"Header",class:"hyxi3jt",propsAsIs:!1}),ne=o.styled_default("div")({name:"HeaderContent",class:"h149e3gp",propsAsIs:!1}),le="h10toh7",q=o.styled_default("img")({name:"SponsorLogo",class:"s1jyea6t",propsAsIs:!1}),ae=o.styled_default("div")({name:"SponsorName",class:"szpfa3h",propsAsIs:!1}),de=o.styled_default("div")({name:"Media",class:"m1crmu01",propsAsIs:!1}),ie=o.styled_default("img")({name:"PromoImg",class:"p1l37r8s",propsAsIs:!1}),re="s1nmch9k",O=o.styled_default("div")({name:"Content",class:"c1er0ljd",propsAsIs:!1}),ce=o.styled_default("div")({name:"Description",class:"dydopmr",propsAsIs:!1}),pe=o.styled_default("div")({name:"Sponsor",class:"s1w6nt04",propsAsIs:!1}),ue=o.styled_default("div")({name:"SponsorText",class:"s1evcmtq",propsAsIs:!1}),me=o.styled_default("div")({name:"ADLogo",class:"awodx0x",propsAsIs:!1}),ye=o.styled_default("span")({name:"SponsoredText",class:"s1q3n6oi",propsAsIs:!1}),ve=o.styled_default("div")({name:"CloseIconWrap",class:"c8d4xfk",propsAsIs:!1}),be=()=>o.c1,he=o.styled_default(be())({name:"CloseIcon",class:"ct6oobh",propsAsIs:!0}),ge=o.styled_default("div")({name:"ActionBtnWrap",class:"a1gyg7tt",propsAsIs:!1}),fe=o.styled_default("a")({name:"ActionButton",class:"a17rwbtk",propsAsIs:!1}),xe=o.styled_default("div")({name:"Title",class:"t3vxzaw",propsAsIs:!1}),Ae="h10f3u0j",R=({promotion:e,promotionId:l,onClose:a})=>{var n,t,i,r,p,c,u,h,g,f,x,A,j,I,_,$,S,M,L,B,T,E,k,N,C,P;const m=e.type===d.PromotionType.INGAME_IAB11_LBAR||e.type===d.PromotionType.INGAME_IAB11,y=((n=e.sponsor)==null?void 0:n.logo)&&e.logoMode===d.PromotionLogoMode.CENTER;return s.jsxs(oe,{className:"PromoOverlay",children:[s.jsxs(te,{children:[s.jsxs(ne,{className:o.cx_default(!y&&le),children:[((t=e.sponsor)==null?void 0:t.logo)&&e.logoMode===d.PromotionLogoMode.LEFT&&s.jsx(q,{src:(i=e.sponsor)==null?void 0:i.logo,alt:"promo"}),s.jsxs(pe,{style:{paddingLeft:(r=e.sponsor)!=null&&r.logo&&e.logoMode===d.PromotionLogoMode.LEFT?"0px":"8px"},children:[((p=e.sponsor)==null?void 0:p.logo)&&e.logoMode===d.PromotionLogoMode.LEFT&&s.jsx(ae,{children:(c=e.sponsor)==null?void 0:c.name}),s.jsxs(ue,{children:[s.jsx(me,{children:"AD"}),s.jsx(ye,{children:"SPONSORED"})]})]})]}),s.jsx(ve,{onClick:a,children:s.jsx(he,{name:"icon-cross"})})]}),s.jsxs(de,{children:[y&&s.jsx(q,{className:re,src:(u=e.sponsor)==null?void 0:u.logo,alt:"promo"}),s.jsx(O,{children:(g=(h=e.banner)==null?void 0:h.video)!=null&&g.url?s.jsx(o.Q,{source:(x=(f=e.banner)==null?void 0:f.video)==null?void 0:x.url,poster:(j=(A=e.banner)==null?void 0:A.video)==null?void 0:j.thumbnailUrl,aspectRatio:m?"1/1":"16/9",onPlay:()=>{o.eventBus.emit("advertisement",{action:"videoPlay",payload:{advertisementId:l,advertisementType:e.type}})}}):(I=e.banner)!=null&&I.imageUrl?s.jsx(ie,{style:m?{aspectRatio:"1/1"}:{},src:(_=e.banner)==null?void 0:_.imageUrl,alt:"promo"}):null}),!m&&s.jsxs(O,{children:[(($=e.banner)==null?void 0:$.title)&&s.jsx(xe,{className:o.cx_default(y&&Ae),children:(S=e.banner)==null?void 0:S.title}),((M=e.banner)==null?void 0:M.body)&&s.jsx(ce,{children:(L=e.banner)==null?void 0:L.body})]})]}),s.jsx(ge,{children:s.jsx(fe,{href:(B=e.banner)==null?void 0:B.url,style:{backgroundColor:((E=(T=e.banner)==null?void 0:T.ctaButton)==null?void 0:E.color)||"#009dc4",color:((N=(k=e.banner)==null?void 0:k.ctaButton)==null?void 0:N.textColor)||"#fff"},"data-analytics":"button","data-promo-id":l,"data-promo-type":e.type,target:"_blank",children:(P=(C=e.banner)==null?void 0:C.ctaButton)==null?void 0:P.label})})]})},je=o.styled_default("div")({name:"SidebarContainer",class:"s1abskp8",propsAsIs:!1}),Ie=({children:e,direction:l,style:a,className:n,hiding:t})=>s.jsx(w,{direction:l,style:a,hiding:t,className:n,children:s.jsx(je,{children:e})}),_e=e=>(e==null?void 0:e.type)===d.PromotionType.INGAME_IAB11_LBAR||(e==null?void 0:e.type)===d.PromotionType.INGAME_IAB21_LBAR,$e=e=>(e==null?void 0:e.type)===d.PromotionType.INGAME_IAB11||(e==null?void 0:e.type)===d.PromotionType.INGAME_IAB21,Se=({advertisement:e,layoutMode:l="side-by-side",sidebar:a,banner:n})=>{const t=o.useStore(e.data);return!t.data&&t.loading?null:t.error?s.jsxs("div",{children:["error ",s.jsx("button",{onClick:e.close,children:"close"})]}):t.data?!a&&!n&&$e(t.data)?s.jsx(se,{children:s.jsx(R,{promotionId:e.id,promotion:t.data,onClose:e.close})}):a&&_e(t.data)?s.jsx(Ie,{direction:a,hiding:e.hiding,children:s.jsx(R,{promotionId:e.id,promotion:t.data,onClose:e.close})}):n?s.jsx(ee,{promotionId:e.id,hiding:e.hiding,promotion:t.data,direction:n}):null:s.jsxs("div",{children:["empty promo ",s.jsx("button",{onClick:e.close,children:"close"})]})},Me=o.styled_default("div")({name:"AdvertisementUIWrap",class:"aa6pjif",propsAsIs:!1}),Le=e=>{const l=e.target;if(l instanceof HTMLAnchorElement&&l.target==="_blank"){const a=l.getAttribute("data-promo-id")||"",n=l.getAttribute("data-promo-type")||d.PromotionType.UNSET;l.getAttribute("data-analytics")==="button"&&o.eventBus.emit("advertisement",{action:"buttonSelect",payload:{advertisementId:a,advertisementType:n}}),l.getAttribute("data-analytics")==="banner"&&o.eventBus.emit("advertisement",{action:"bannerSelect",payload:{advertisementId:a,advertisementType:n}})}},Be=({gamification:e,layoutMode:l,sidebar:a,banner:n,isMobileScreen:t,persistent:i})=>{const r=v.useRef(null),p=o.useStore(e.advertisement.$list),c=v.useMemo(()=>e.advertisement.getActiveAdvertisement(i),[p,i]);return o.L(r,{enabled:!!c,event:"click",listener:Le}),c?s.jsx(Me,{ref:r,style:{height:!n&&!a?"auto":"100%"},className:t?"mobile-view":"",children:s.jsx(Se,{sidebar:a,banner:n,advertisement:c,layoutMode:l})}):null},Te=({sdk:e,sidebar:l,banner:a,event:n,layoutMode:t,isMobileScreen:i,persistent:r})=>{const{deactivate:p}=b.F(e);v.useEffect(()=>{n?e.createEventSession(n):p()},[n,p,e]);const c=o.useStore(e.featuresList.getStore());if(l&&a)return s.jsx("div",{style:{color:"red"},children:"define either sidebar or banner, not both."});if(!c)return null;const u=e.getFeature(d.SdkOverlayType.GAMES);return u?s.jsx(Be,{gamification:u,sidebar:l,banner:a,layoutMode:t,isMobileScreen:i,persistent:r}):null},Ee=({event:e,sidebar:l,banner:a,isMobileScreen:n})=>{const t=b.useStreamLayer();return t?s.jsx("div",{className:"StreamLayerSDK",children:s.jsx(b.d,{children:s.jsx(Te,{sdk:t,event:e,sidebar:l,banner:a,isMobileScreen:n,layoutMode:"side-by-side"})})}):null};exports.StreamLayerSDKAdvertisement=Ee;
|
package/lib/cjs/app.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var U=Object.defineProperty;var z=(e,t,n)=>t in e?U(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n;var m=(e,t,n)=>z(e,typeof t!="symbol"?t+"":t,n);const o=require("react/jsx-runtime"),s=require("./index2.js"),c=require("react"),g=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",n=window.localStorage){m(this,"delimiter",":");m(this,"prefix");m(this,"storage");m(this,"clear",()=>{for(const t in window.localStorage)t.startsWith(this.prefix)&&this.storage.removeItem(t)});m(this,"generateKey",t=>`${this.prefix}${this.delimiter}${t.join(this.delimiter)}`);m(this,"write",(...t)=>{const n=t.pop()||"",i=this.generateKey(t);try{this.storage.setItem(i,n)}catch(r){B(r)&&this.storage===window.sessionStorage&&(window.sessionStorage.removeItem("slstreamlogs"),this.storage.setItem(i,n))}});m(this,"read",(...t)=>{const n=this.storage.getItem(this.generateKey(t));return n===null?void 0:n});m(this,"remove",(...t)=>{this.storage.removeItem(this.generateKey(t))});this.prefix=`sl-sdk${this.delimiter}${t}`,this.storage=n}}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={}));g.Code.Unknown,g.Code.Internal,g.Code.DeadlineExceeded,g.Code.ResourceExhausted,g.Code.FailedPrecondition,g.Code.Unavailable,g.Code.DataLoss;s.createLogger("grpc:retry");g.createContextKey(10,{description:"Number of attempts to retry"}),g.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");m(this,"setSchema",n=>{this.write(N.SCHEMA,n)});m(this,"getSchema",()=>this.read(N.SCHEMA));m(this,"setToken",n=>{this.write(N.TOKEN,n)});m(this,"getToken",()=>this.read(N.TOKEN));m(this,"setExternalToken",n=>{this.write(N.EXTERNAL_TOKEN,n)});m(this,"getExternalToken",()=>this.read(N.EXTERNAL_TOKEN));m(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"})(_||(_={}));g.QuestionType.POLL,g.QuestionType.PREDICTION,g.QuestionType.TRIVIA;const H={[g.SdkOverlayType.GAMES]:!0},I=s.styled_default("div")({name:"LoadingContainer",class:"lclc0ej",propsAsIs:!1}),X=({feature:e,sdk:t,children:n,className:i,noWait:r})=>{const l=s.useStore(e.status),d=s.useStore(t.sdkStore.slStreamId);if(!r){if(d!=null&&d.loading&&!d.data)return o.jsx(I,{className:i,children:"Event is loading..."});if(!(d!=null&&d.data))return o.jsx(I,{className:i,children:"Event is forbidden..."});if(l!==s.FeatureStatus.Ready)return o.jsx(I,{className:i,children:"Wait feature..."})}return n},F=c.createContext({sdk:null}),C=()=>c.useContext(F),Y=s.styled_default("div")({name:"QuestionContainer",class:"q14ckf9e",propsAsIs:!1}),Z=({openedQuestion:e})=>{var t,n;const{sdk:i}=C();return((t=e==null?void 0:e.attributes)==null?void 0:t.attributes.case)==="insight"?o.jsx(s.x,{...e.attributes.attributes.value,controlVideo:i==null?void 0:i.controlVideoPlayer}):((n=e==null?void 0:e.attributes)==null?void 0:n.attributes.case)==="tweet"?o.jsx(s.a,{...e.attributes.attributes.value,controlVideo:i==null?void 0:i.controlVideoPlayer}):null},J=({extendedQuestion:e,vote:t,close:n})=>{const{loading:i,data:r}=e;return r?o.jsx(s.Nt,{vote:t,close:n,openedQuestion:r,isLoading:!!i}):o.jsx(s.kt,{})},ee=({gamification:e})=>{var t,n,i;const r=s.useStore(e.openedQuestion.$store),l=s.useStore(e.openedQuestion.$extendedStore);if(!r)return null;const d=r.type;return o.jsxs(Y,{children:[o.jsx(s.T,{close:e.closeQuestion,type:((t=r.attributes)==null?void 0:t.type)||g.QuestionType.UNSET}),d==="question"&&o.jsx(J,{vote:e.submitAnswer,close:e.closeQuestion,extendedQuestion:l}),d!=="question"&&o.jsx(Z,{openedQuestion:r}),o.jsx(s.i,{sponsorLogo:(i=(n=l.data)==null?void 0:n.sponsorship)==null?void 0:i.logo})]})},se=s.styled_default("div")({name:"InviteFriendsContainer",class:"i1c9dygq",propsAsIs:!1}),te=({deepLink:e})=>o.jsx(se,{children:o.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:n})=>{const i=c.useRef(null),{data:r,hasMore:l,loading:d,key:u}=s.useStore(e.leaderboardList.$store),{data:a}=s.useStore(e.deepLink.$store),[v,p]=s.T$1(i);return!r.length&&!d?o.jsx(te,{deepLink:a}):o.jsxs(o.Fragment,{children:[o.jsx(s.S,{items:r,scrollNode:t,scrollStore:n,fetchMore:e.leaderboardList.fetchMore,hasMore:l,openItemDetail:e.openUser,currentUserId:e.currentUserId.get()},u),a&&o.jsx(ne,{ref:i,children:o.jsx(s.C,{onClick:()=>v(a),title:"Invite Friends",description:"Challenge them now!"})}),p]})},ie=({store:e,openQuestion:t})=>{const{sdk:n}=C(),i=s.useStore(e);return o.jsx(s.k,{openQuestion:t,questions:i.data,controlVideo:n==null?void 0:n.controlVideoPlayer})},re=({userSummary:e})=>{var t;const[n,i]=c.useState(void 0);return c.useEffect(()=>{const r=e.$store.subscribe(l=>{l&&i(l)});return()=>{r()}},[e]),o.jsx(s.O,{loading:!(n!=null&&n.summary),...n==null?void 0:n.summary,successRate:(t=n==null?void 0:n.percentage)==null?void 0:t.correct})},ae=({gamification:e,className:t,scrollStore:n,scrollNode:i,appNode:r,style:l,responsiveStore:d})=>{const{tabsShown:u}=s.useStore(n,{keys:["tabsShown"]}),[a,v]=c.useState(s.m.HOME),[,p]=c.useTransition(),{sdkInDesktopView:h,screen:f}=s.useStore(d,{keys:["sdkInDesktopView"]}),x=k=>{p(()=>{var y;v(k),h===!1&&(((y=r.current)==null?void 0:y.getBoundingClientRect().y)||0)<0&&s.C$2(r,f.size,{behavior:"instant"})})};c.useEffect(()=>n.subscribe(k=>{if(k.scrollPosition===0){n.setKey("tabsShown",!0);return}d.get().sdkInDesktopView?n.setKey("tabsShown",k.scrollDirection==="backward"):n.setKey("tabsShown",k.scrollDirection==="forward")}),[n,d]);let S="0px";return h?S=u?"0px":"calc(8px - var(--header-height) - var(--header-offset))":S=u?"calc(var(--header-height) + var(--header-offset) - 2px)":"0px",o.jsxs(s.l,{className:t,style:l,children:[o.jsx(s.C$1,{style:{top:S},children:o.jsx(s.b,{activePage:a,toggleActivePage:x})}),a===s.m.HOME&&o.jsxs(o.Fragment,{children:[o.jsx(s.n,{style:{paddingTop:"8px"},children:o.jsx(s.m$1,{children:o.jsx(re,{userSummary:e.userSummary})})}),o.jsx(s.a$1,{style:{flex:1},children:o.jsx(ie,{openQuestion:e.openQuestion,store:e.feedList.getStore()})})]}),a===s.m.LEADERBOARD&&o.jsx(s.p,{children:o.jsx(oe,{scrollStore:n,scrollNode:i,gamification:e})})]})},le=()=>s.x$2,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 n=e+t;return n===0?0:Math.round(e/n*100)},ue=({gamification:e,scrollStore:t,className:n,appNode:i,scrollNode:r,responsiveStore:l})=>o.jsx(ae,{appNode:i,scrollStore:t,scrollNode:r,className:n,gamification:e,responsiveStore:l}),pe=({gamification:e,className:t,appNode:n,responsiveStore:i})=>{const r=s.useStore(e.openedQuestion.$store),l=s.useStore(e.openedUser),{sdkInDesktopView:d}=s.useStore(i,{keys:["sdkInDesktopView"]}),{hiding:u,onAnimationEnd:a}=s.S$1();if(!n.current||!r&&!l)return null;const v=r?o.jsx(R,{className:t,hiding:u,onAnimationEnd:a,children:o.jsx(ee,{gamification:e})}):l?o.jsx(R,{className:t,hiding:u,onAnimationEnd:a,children:o.jsxs(de,{children:[o.jsx(s.T,{label:"Friend's Rank",close:e.closeUser}),o.jsx(s.n,{children:o.jsx(s.O,{...l,successRate:ce(l)})})]})}):null;return o.jsx(s.x$1,{container:n,useContainer:!d,children:v})},ve=c.lazy(()=>Promise.resolve().then(()=>require("./gamification-feature.js"))),he=({sdk:e,feature:t,className:n,scrollStore:i,appNode:r,scrollNode:l,responsiveStore:d})=>{const u=c.useMemo(()=>t&&t.featureConfig.get().type===g.SdkOverlayType.GAMES?o.jsx(X,{className:n,sdk:e,feature:t,children:o.jsx(ve,{appNode:r,scrollStore:i,scrollNode:l,className:n,responsiveStore:d,gamification:t})}):null,[e,t,n,d,i,l,r]);return o.jsx(c.Suspense,{fallback:o.jsx("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",width:"100%",height:"100%"},children:"page loading..."}),children:u})},ge=({feature:e,className:t,appNode:n,responsiveStore:i})=>e&&e.featureConfig.get().type===g.SdkOverlayType.GAMES?o.jsx(pe,{className:t,appNode:n,responsiveStore:i,gamification:e}):null,me=()=>s.c1,fe=s.styled_default(me())({name:"ButtonIcon",class:"b11wpe79",propsAsIs:!0}),ye=c.forwardRef(({sdk:e,className:t},n)=>{const i=s.useStore(e.sdkStore.organizationSettings),r=s.useStore(e.sdkStore.streamSettings),l=s.useStore(e.getActiveFeature()),d=c.useMemo(()=>{const a=(r==null?void 0:r.data)||(i==null?void 0:i.data);return a!=null&&a.overlays?a.overlays:[]},[i,r]),u=c.useMemo(()=>[...d.filter(({enableSdkButton:a})=>a).map(a=>({id:a.type,onClick:()=>e.openFeature(a.type),disabled:!(a.type in H),label:a.name,icon:o.jsx("img",{src:a.icon,alt:""}),position:a.position*10}))].sort((a,v)=>a.position-v.position),[d,e]);return o.jsxs(s.n$1,{className:t,children:[o.jsx(s.e,{children:[o.jsx(s.I,{id:"Channels",onClick:()=>e.closeFeature(),label:"Channels",active:l===0},"Channels"),...u.map(a=>a.id===g.SdkOverlayType.GAMES?o.jsx(s.I,{...a,active:a.id===l,label:"StreamLayer +",id:"featuredGroups",icon:o.jsx(fe,{name:"icon-btn-feature-groups","data-selected":a.id===l})},a.id):o.jsx(s.I,{...a,icon:void 0,active:a.id===l},a.id))]}),o.jsx("div",{ref:n})]})}),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}),V=({close:e,action:t,onboarding:n})=>{var i,r,l,d,u,a,v,p;return o.jsxs(xe,{children:[o.jsx(Se,{onClick:e,children:o.jsx(Ne,{name:"icon-cross"})}),((r=(i=n==null?void 0:n.titleCard)==null?void 0:i.media)==null?void 0:r.sponsorLogo)&&o.jsxs(je,{children:[o.jsx(be,{alt:"sponsor-logo",src:(d=(l=n==null?void 0:n.titleCard)==null?void 0:l.media)==null?void 0:d.sponsorLogo}),o.jsx(Ie,{children:"PRESENTS"})]}),((u=n==null?void 0:n.titleCard)==null?void 0:u.title)&&o.jsx(Ee,{children:(a=n==null?void 0:n.titleCard)==null?void 0:a.title}),((v=n==null?void 0:n.titleCard)==null?void 0:v.subtitle)&&o.jsx(Ce,{children:(p=n==null?void 0:n.titleCard)==null?void 0:p.subtitle}),o.jsx(Ae,{onClick:t,children:"Play Now"})]})},E=[{graphicSrc:"https://cdn.streamlayer.io/assets/sdk-web/onboarding-steps/step_0.png",tagline:"",headline:o.jsxs(o.Fragment,{children:["Welcome to ",o.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$2,Te=s.styled_default(Le())({name:"OnboardingNotificationContainer",class:"o1vnouv7",propsAsIs:!0}),q=s.styled_default("div")({name:"InnerContainer",class:"i59uefw",propsAsIs:!1}),De=({deepLink:e,onboardingOpts:t,notification:n,gamification:i,loading:r,sdk:l})=>{var d,u,a,v,p,h,f;const x=s.useStore(i.friends.getStore()),[S,k]=c.useState(void 0),y=c.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 c.useEffect(()=>{const j=e.$store.subscribe(b=>{b&&k(b.data)});return()=>{j()}},[e.$store]),o.jsx(we,{children:o.jsx(s.rn,{loading:r,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:(u=t.rules)==null?void 0:u.heading,termsTitle:"Terms and Conditions",termsText:(a=t.rules)==null?void 0:a.terms,steps:E,primaryColor:(v=t.inviteCard)==null?void 0:v.iconColor,inviteLink:S,inviteCardTitle:(p=t.inviteCard)==null?void 0:p.heading,inviteCardSubtext:(h=t.inviteCard)==null?void 0:h.subtext,inviteCardBtnLabel:(f=t.inviteCard)==null?void 0:f.buttonLabel,onClose:()=>{var j;(j=n.close)==null||j.call(n)},gamification:i,sdk:l,inviterName:y})})},$e=({sdk:e,notification:t,saveHeight:n,style:i,appNode:r,sdkInDesktopView:l,responsiveStore:d})=>{const u=c.useRef(null),a=t.data.onboarding,[v,p]=c.useState(a==null?void 0:a.instantOpen),h=e.getFeature(g.SdkOverlayType.GAMES),f=c.useMemo(()=>E==null?void 0:E.map(({graphicSrc:y})=>y),[]),{screen:x}=s.useStore(d,{keys:["screen"]});c.useLayoutEffect(()=>{var y;n(((y=u.current)==null?void 0:y.getBoundingClientRect().height)||0)},[n]);const{loading:S,throttled:k}=s.I$1(f);return v&&h&&a&&r.current&&!k?o.jsx(s.x$1,{container:r,useContainer:!l,children:o.jsx(De,{notification:t,setOpened:p,gamification:h,onboardingOpts:a,deepLink:h.deepLink,loading:S,renderToNode:r,sdk:e})}):o.jsxs(o.Fragment,{children:[o.jsx(q,{ref:u,style:{position:"absolute",visibility:"hidden"},children:o.jsx(V,{close:()=>{},action:()=>{},onboarding:a})}),o.jsx(Te,{style:i,hiding:t.hiding,children:o.jsx(q,{children:o.jsx(V,{close:t.close,action:()=>{var y;p(!0),(((y=r.current)==null?void 0:y.getBoundingClientRect().y)||0)<0&&s.C$2(r,x.size,{behavior:"smooth"})},onboarding:a})})})]})},Oe=()=>s.x$2,_e=s.styled_default(Oe())({name:"Container",class:"c8ol1ve",propsAsIs:!0}),M=s.styled_default("div")({name:"InnerContainer",class:"iqfywam",propsAsIs:!1}),Re=()=>M,Ve=s.styled_default(Re())({name:"HiddenContainer",class:"hokmtod",propsAsIs:!0}),qe=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,n]=c.useState(0),i=c.useRef(null),r=c.useCallback(d=>{i.current=d},[]);c.useEffect(()=>{var d;const u=(d=i.current)==null?void 0:d.getBoundingClientRect();u&&n(u.height)},[e]);const l=c.useCallback(d=>{n(d)},[]);return[r,t,l]},Qe=({sdk:e,notification:t,appNode:n,responsiveStore:i})=>{var r,l;const{sdkInDesktopView:d}=s.useStore(i,{keys:["sdkInDesktopView"]}),{sdk:u}=C(),[a,v,p]=Pe(t.id);return t.type===s.NotificationType.QUESTION?o.jsxs(o.Fragment,{children:[o.jsx(Ve,{ref:a,children:o.jsx(s.k$1,{...t})}),o.jsxs(_e,{style:{height:t.hiding?0:v},hiding:t.hiding,children:[o.jsx(M,{style:{height:"100%"},children:o.jsx(s.k$1,{...t,controlVideo:u==null?void 0:u.controlVideoPlayer})}),o.jsx(qe,{},t.id)]})]}):t.type===s.NotificationType.QUESTION_RESOLVED&&(l=(r=t.data)==null?void 0:r.question)!=null&&l.predictionResult?o.jsx(s.q,{style:{height:t.hiding?0:v},saveHeight:p,close:t.close,hiding:t.hiding,...t.data.question}):t.type===s.NotificationType.ONBOARDING?o.jsx($e,{style:{height:t.hiding?0:v},saveHeight:p,sdk:e,notification:t,sdkInDesktopView:d,appNode:n,responsiveStore:i}):null},Ke="p7vfi6t",Ue=({pill:e,setPill:t,appNode:n,headerNode:i,scrollNode:r,responsiveStore:l,scrollStore:d})=>{var u,a;const{screen:v}=s.useStore(l,{keys:["screen"]}),{tabsShown:p,scrollPosition:h}=s.useStore(d,{keys:["tabsShown","scrollPosition"]});c.useEffect(()=>{l.get().sdkInDesktopView?h<50&&t(null):h>-50&&t(null)},[h,l,t]);const f=l.get().sdkInDesktopView?n:i;return!e||!f.current?null:s.Ik.createPortal(o.jsx(Me,{title:e.type===s.NotificationType.QUESTION_RESOLVED?"Prediction result":`New ${((a=s.o[(u=e.data)==null?void 0:u.questionType])==null?void 0:a.label)||"notification"}`,onClick:()=>{var x;l.get().sdkInDesktopView?(x=r.current)==null||x.scrollTo({top:0,behavior:"smooth"}):s.C$2(n,v.size,{behavior:"smooth"}),t(null)},className:s.cx_default(p&&Ke,"sl-pill-button")}),f.current)},ze=({sdk:e,headerNode:t,scrollNode:n,responsiveStore:i,appNode:r,scrollStore:l})=>{const[d]=c.useState(e.getNotificationsStore()),u=s.useStore(d),[a,v]=c.useState(null),p=c.useMemo(()=>e.getActiveNotification(),[e,u]);return c.useEffect(()=>{p&&s.eventBus.emit("notification",{action:"rendered",payload:{questionId:p.data.questionId,questionType:p.data.questionType}})},[p]),c.useEffect(()=>{p&&(i.get().sdkInDesktopView||i.get().sdkInView)&&(!i.get().sdkInDesktopView&&i.get().sdkInView&&v(p),i.get().sdkInDesktopView&&window.requestAnimationFrame(()=>{l.get().scrollPosition!==0&&v(p)}))},[p]),c.useEffect(()=>{p||v(null)},[p]),o.jsxs(o.Fragment,{children:[!a&&p&&o.jsx(Qe,{headerNode:t,appNode:r,sdk:e,notification:p,responsiveStore:i}),a&&o.jsx(Ue,{pill:a,setPill:v,appNode:r,notification:p,headerNode:t,scrollNode:n,scrollStore:l,responsiveStore:i})]})},P=e=>{const t=c.useRef(""),[n,i]=c.useState(!1),r=s.useStore(e.status),l=s.useStore(e.sdkStore.slStreamId),d=s.useStore(e.userId()),u=s.useStore(e.getActiveFeature()),a=r==="ready"&&!!l.data;c.useEffect(()=>{const h=e.getFeature(g.SdkOverlayType.GAMES);h&&(h.closeQuestion(),h.closeUser())},[u,e]);const v=c.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]),p=c.useCallback(()=>{i(!1),e.disableApp()},[e]);return c.useEffect(()=>{if(!d){a&&e.disableApp();return}if(d&&t.current&&n){e.initializeApp({skipOrganizationSettings:!0}).then(()=>{e.createEventSession(t.current)});return}},[d]),c.useEffect(()=>()=>{i(!1),e.disableApp()},[i,e]),{sdkEnabled:n,sdkReady:a,activateEventWithId:v,deactivate:p,isLogged:!!d}},Be=({sdk:e,className:t,scrollStore:n,appNode:i,scrollNode:r,responsiveStore:l})=>{const[,d]=s.p$1(e);return o.jsx(he,{className:t,scrollNode:r,appNode:i,scrollStore:n,feature:d,responsiveStore:l,sdk:e})},We=({sdk:e,className:t,appNode:n,responsiveStore:i})=>{const r=s.useStore(e.featuresList.getStore());return r?Array.from(r,l=>{const d=e.getFeature(l);return d?o.jsx(ge,{className:t,appNode:n,feature:d,responsiveStore:i,sdk:e},l):null}):null},Ge=({sdk:e,event:t})=>{const n=c.useRef(null),i=c.useRef(null),[r]=s.v(n),[l,d]=s.D(n,r),{sdkEnabled:u,sdkReady:a,activateEventWithId:v,deactivate:p,isLogged:h}=P(e);c.useEffect(()=>{t?(e.createEventSession(t),v(t)):p()},[t,v,p,e]),s.L(n,{enabled:u,event:"click",listener:s.b$1}),s.L(l,{enabled:u,event:"scrollend",listener:s.y,useDomNode:!0}),s.L(l,{enabled:u,event:"click",listener:s.w,useDomNode:!0});const f=c.useMemo(()=>({sdk:e}),[e]);return c.useEffect(()=>{Promise.resolve().then(()=>require("./gamification-feature.js"))},[]),o.jsx(F.Provider,{value:f,children:o.jsxs(s.i$1,{ref:n,children:[u&&o.jsx(ye,{className:s.f,sdk:e,ref:i}),o.jsxs(s.c,{className:"sl-hide-on-modal",ref:l,"data-nav":u.toString(),children:[a&&o.jsx(ze,{sdk:e,scrollNode:l,headerNode:i,appNode:n,scrollStore:d,responsiveStore:r}),a&&o.jsx(Be,{scrollStore:d,responsiveStore:r,scrollNode:l,appNode:n,className:s.f,sdk:e}),a&&o.jsx(We,{responsiveStore:r,appNode:n,className:s.f,sdk:e})]}),u&&!h&&o.jsx("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",width:"100%",height:"100%"},children:"You are not logged in."})]})})},Q=({children:e,style:t})=>o.jsx("div",{className:"StreamLayerSDKTheme",children:o.jsx("div",{className:s.x$3,style:t,children:e})}),He=()=>{const{sdk:e}=c.useContext(s.StreamLayerContext);return e},Xe=({event:e})=>{const{sdk:t,status:n}=c.useContext(s.StreamLayerContext);if(n===s.StreamLayerStatus.UNSET)throw new Error("Wrap app in `StreamLayerProvider`");return n===s.StreamLayerStatus.CONNECTED?o.jsx("div",{className:"StreamLayerSDK",children:"wait"}):t===null?o.jsx("div",{className:"StreamLayerSDK",children:"sdk not initialized"}):o.jsx("div",{className:"StreamLayerSDK",children:o.jsx(Q,{children:o.jsx(Ge,{sdk:t,event:e})})})};exports.E=ue;exports.F=P;exports.StreamLayerSDKReact=Xe;exports.i=Q;exports.useStreamLayer=He;
|
|
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;
|