@streamlayer/web-os 0.4.2 → 0.4.4

package/lib/cjs/gamification-feature.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index2.js");exports.default=e.Ff;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),e=require("./index2.js");require("@noriginmedia/norigin-spatial-navigation");const u=require("react");require("react-countdown-circle-timer");const S=require("react-dom");require("react-countup");require("nanostores");require("lodash.throttle");const q=require("react-infinite-scroller"),L=(t,a,n)=>{const r=a>=e.A.lg&&a<e.A.xl?75:52;t.current&&window.scrollTo({top:t.current.offsetTop-r,...n})},T=e.styled_default("div")({name:"Container",class:"c1zy8a",propsAsIs:!1}),R=e.styled_default("div")({name:"Title",class:"t1vih9p5",propsAsIs:!1}),N=e.styled_default("div")({name:"Indicator",class:"i1fbnvpb",propsAsIs:!1}),C=({indicator:t,title:a})=>s.jsxs(T,{children:[s.jsx(R,{children:a}),s.jsx(N,{children:t})]}),M=e.styled_default("div")({name:"Container",class:"ctmhwyc",propsAsIs:!1}),V=e.styled_default("div")({name:"Indicator",class:"i1jri200",propsAsIs:!1}),B=e.styled_default("div")({name:"Title",class:"t8s05oq",propsAsIs:!1}),f=({indicator:t,title:a})=>s.jsxs(M,{children:[s.jsx(V,{children:t}),s.jsx(B,{children:a})]}),D=e.styled_default("div")({name:"Container",class:"c1yrpn9o",propsAsIs:!1}),F=e.styled_default("div")({name:"TopInfo",class:"t17fwahh",propsAsIs:!1}),E=e.styled_default("div")({name:"BottomInfo",class:"by6w7e9",propsAsIs:!1}),U=e.styled_default("div")({name:"User",class:"u1g7arbm",propsAsIs:!1}),P=e.styled_default("img")({name:"Avatar",class:"a1ldeata",propsAsIs:!1}),H=e.styled_default("div")({name:"UserInfo",class:"u10d4koz",propsAsIs:!1}),z=e.styled_default("div")({name:"UserName",class:"u1q6roj0",propsAsIs:!1}),O=e.styled_default("div")({name:"UserRating",class:"ui0m425",propsAsIs:!1}),Q=e.styled_default("img")({name:"TrophyIcon",class:"t1el3mrn",propsAsIs:!1}),W=e.styled_default("div")({name:"RtsContainer",class:"r2vgnxv",propsAsIs:!1}),Z=e.styled_default("div")({name:"RtsDivider",class:"roqn06j",propsAsIs:!1}),K=e.styled_default("div")({name:"Rts",class:"r15adx7c",propsAsIs:!1}),A=e.styled_default("div")({name:"RtsIndicator",class:"rv59lta",propsAsIs:!1}),g=e.styled_default("div")({name:"RtsLabel",class:"r55lotb",propsAsIs:!1}),G=e.styled_default("div")({name:"Divider",class:"d1knfgqt",propsAsIs:!1}),J=e.styled_default("div")({name:"Ranks",class:"r1mqo824",propsAsIs:!1}),X=e.styled_default("div")({name:"Statistics",class:"sxareh6",propsAsIs:!1}),Y=e.styled_default("div")({name:"AvatarPlaceholder",class:"amcu48h",propsAsIs:!1}),ss=e.styled_default("button")({name:"UserAccountBtn",class:"u32nfkp",propsAsIs:!1}),es="data:image/svg+xml,%3csvg%20width='16'%20height='16'%20viewBox='0%200%2016%2016'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20id='Trophy'%3e%3cpath%20id='Combined%20Shape'%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M3.69197%204.66662C3.69197%205.99705%203.92914%207.17787%204.4035%208.20912C3.49966%208.02451%202.74487%207.66486%202.1391%207.13014C1.53333%206.59542%201.23046%206.0798%201.23046%205.58328V4.66662H3.69197ZM14.7686%204.66662V5.58328C14.7686%206.0798%2014.4658%206.59542%2013.86%207.13014C13.2542%207.66486%2012.4994%208.02451%2011.5956%208.20912C12.0699%207.17787%2012.3071%205.99705%2012.3071%204.66662H14.7686ZM15.9998%205.58329V4.36108C15.9998%204.10645%2015.9101%203.89002%2015.7306%203.71178C15.5511%203.53354%2015.3332%203.44442%2015.0768%203.44442H12.3076V2.52776C12.3076%202.10763%2012.1569%201.74797%2011.8556%201.44878C11.5544%201.14959%2011.1922%201%2010.7691%201H5.23072C4.80764%201%204.44547%201.14959%204.14419%201.44878C3.84291%201.74797%203.69227%202.10763%203.69227%202.52776V3.44442H0.923068C0.666659%203.44442%200.448714%203.53354%200.269228%203.71178C0.0897418%203.89002%200%204.10645%200%204.36108V5.58329C0%206.03525%200.13301%206.49039%200.399034%206.94872C0.665059%207.40705%201.02403%207.82082%201.47595%208.19003C1.92787%208.55924%202.48234%208.86957%203.13939%209.12101C3.79644%209.37246%204.48713%209.51409%205.21149%209.54592C5.48071%209.88967%205.7852%2010.192%206.12494%2010.453C6.36853%2010.6695%206.53679%2010.9002%206.62974%2011.1453C6.72269%2011.3904%206.76916%2011.6752%206.76916%2011.9999C6.76916%2012.3436%206.67141%2012.6333%206.4759%2012.8688C6.28038%2013.1043%205.96789%2013.2221%205.53841%2013.2221C5.05764%2013.2221%204.62976%2013.3669%204.25476%2013.6566C3.87977%2013.9462%203.69227%2014.3106%203.69227%2014.7499V15.361C3.69227%2015.4501%203.72112%2015.5233%203.77881%2015.5806C3.8365%2015.6379%203.91022%2015.6665%203.99996%2015.6665H11.9999C12.0896%2015.6665%2012.1633%2015.6379%2012.221%2015.5806C12.2787%2015.5233%2012.3076%2015.4501%2012.3076%2015.361V14.7499C12.3076%2014.3106%2012.1201%2013.9462%2011.7451%2013.6566C11.3701%2013.3669%2010.9422%2013.2221%2010.4614%2013.2221C10.0319%2013.2221%209.71945%2013.1043%209.52394%2012.8688C9.32843%2012.6333%209.23068%2012.3436%209.23068%2011.9999C9.23068%2011.6752%209.27715%2011.3904%209.3701%2011.1453C9.46305%2010.9002%209.63131%2010.6695%209.8749%2010.453C10.2146%2010.192%2010.5191%209.88967%2010.7884%209.54592C11.5127%209.51409%2012.2034%209.37246%2012.8604%209.12101C13.5175%208.86957%2014.072%208.55924%2014.5239%208.19003C14.9758%207.82082%2015.3348%207.40705%2015.6008%206.94872C15.8668%206.49039%2015.9998%206.03525%2015.9998%205.58329ZM6.76047%207.1798L8.05109%206.49997L9.3417%207.1798L9.09521%205.73989L10.1393%204.72015L8.69639%204.51007L8.05109%203.2L7.40578%204.51007L5.96283%204.72015L7.00696%205.73989L6.76047%207.1798Z'%20fill='%23F2C94C'/%3e%3c/g%3e%3c/svg%3e",ts=({loading:t,hideFriendsRank:a,avatar:n,name:r,points:l,friendsRank:i,rank:d,streak:c,correct:o,incorrect:p,inTop:m,successRate:v})=>s.jsxs(D,{"data-loading":t,children:[s.jsx(F,{children:s.jsx(e.i,{loading:t,children:s.jsxs(U,{children:[s.jsxs(ss,{children:[n&&s.jsx(P,{alt:"avatar",src:n}),!n&&s.jsx(Y,{children:e.I(r||"")})]}),s.jsxs(H,{children:[s.jsx(z,{children:r}),s.jsxs(O,{children:[s.jsxs(W,{children:[s.jsxs(K,{children:[s.jsx(Q,{alt:"rank-icon",src:es}),s.jsxs(A,{children:[e.s(l),s.jsx(g,{children:"PTS"})]})]}),a&&s.jsxs(A,{children:[s.jsx(Z,{}),d||0,s.jsx(g,{children:"global rank"})]})]}),!a&&s.jsxs(s.Fragment,{children:[s.jsx(G,{}),s.jsxs("div",{children:["TOP ",m||0,"%"]})]})]})]})]})})}),s.jsxs(E,{children:[!a&&s.jsxs(J,{children:[s.jsx(e.i,{loading:t,style:{width:"100%"},children:s.jsx(C,{indicator:i||0,title:"Friends rank"})}),s.jsx(e.i,{loading:t,style:{width:"100%"},children:s.jsx(C,{indicator:d||0,title:"Global rank"})})]}),s.jsx(e.i,{loading:t,children:s.jsxs(X,{children:[s.jsx(f,{indicator:c||0,title:"Win streak"}),s.jsx(f,{indicator:o||0,title:"Correct"}),s.jsx(f,{indicator:p||0,title:"Incorrect"}),s.jsx(f,{indicator:`${v||0}%`,title:"Succ. rate"})]})})]})]}),as=e.styled_default("div")({name:"Container",class:"c115qtkr",propsAsIs:!1}),ns=e.styled_default("div")({name:"STabs",class:"sxnslc8",propsAsIs:!1}),ls=e.styled_default("button")({name:"Button",class:"b1umzux0",propsAsIs:!1}),rs=e.styled_default("span")({name:"Title",class:"tspsaas",propsAsIs:!1});var x=(t=>(t.HOME="home",t.LEADERBOARD="leaderboard",t))(x||{});const b=({title:t,active:a,onClick:n})=>s.jsx(ls,{"data-a":"intr",onClick:n,"data-selected":a,children:s.jsx(rs,{"data-a":"intr",children:t})}),is=({activePage:t="home",toggleActivePage:a})=>s.jsx(as,{children:s.jsxs(ns,{"data-position":t==="home"?"left":"right",children:[s.jsx(b,{title:"Home",active:t==="home",onClick:()=>a("home")}),s.jsx(b,{title:"Friends",active:t==="leaderboard",onClick:()=>a("leaderboard")})]})}),os=e.styled_default("button")({name:"Container",class:"cpjnajb",propsAsIs:!1}),ds=e.styled_default("div")({name:"Content",class:"c4m6kaz",propsAsIs:!1}),cs=e.styled_default("span")({name:"Title",class:"t1h8t9cc",propsAsIs:!1}),us=()=>s.jsx(os,{children:s.jsxs(ds,{children:[s.jsx(e.B1,{name:"iconCopySuccess"}),s.jsx(cs,{children:"Link Copied to Clipboard"})]})}),_=t=>{const a=u.useRef(),[n,r]=u.useState(null),l=u.useCallback(async i=>{var d;if(i&&(d=navigator==null?void 0:navigator.clipboard)!=null&&d.writeText){a.current&&(clearTimeout(a.current),r(null));try{await navigator.clipboard.writeText(i),t.current&&(r(S.createPortal(s.jsx(us,{}),t.current)),a.current=setTimeout(()=>{r(null)},1e3))}catch(c){console.error("Unable to copy to clipboard",c)}}},[t]);return u.useEffect(()=>()=>{clearTimeout(a.current)},[]),[l,n]},ps=e.styled_default("div")({name:"Container",class:"c1ux29ft",propsAsIs:!1}),ms=()=>e.B1,hs=e.styled_default(ms())({name:"FriendsIcon",class:"f10ncfg2",propsAsIs:!0}),xs=e.styled_default("div")({name:"Content",class:"c1yc07bd",propsAsIs:!1}),fs=e.styled_default("div")({name:"Title",class:"tj6cq7w",propsAsIs:!1}),vs=e.styled_default("div")({name:"Description",class:"d1ag78xo",propsAsIs:!1}),js=()=>e.B1,Is=e.styled_default(js())({name:"ArrowInviteIcon",class:"awohrz6",propsAsIs:!0}),ys=({title:t,description:a,onClick:n,className:r})=>{const[l]=e.f({type:"invitation",action:"sent",payload:{from:e.InvitationFrom.TITLE_CARD}});return s.jsxs(ps,{"data-a":"intr",onClick:l(n),className:r,children:[s.jsx(hs,{name:"icon-friends"}),s.jsxs(xs,{children:[s.jsx(fs,{children:t}),s.jsx(vs,{children:a})]}),s.jsx(Is,{name:"icon-copy"})]})},Cs=e.styled_default("div")({name:"Container",class:"culdu4a",propsAsIs:!1}),As=e.styled_default("div")({name:"Position",class:"pwf8e69",propsAsIs:!1}),gs=e.styled_default("img")({name:"Avatar",class:"atf4yh4",propsAsIs:!1}),bs=e.styled_default("div")({name:"AvatarPlaceholder",class:"a1dg29ja",propsAsIs:!1}),$s=e.styled_default("div")({name:"Content",class:"c10a68rc",propsAsIs:!1}),_s=e.styled_default("div")({name:"NameContainer",class:"nc4kck5",propsAsIs:!1}),ks=e.styled_default("span")({name:"Name",class:"njsrqgr",propsAsIs:!1}),ws=()=>e.B1,Ss=e.styled_default(ws())({name:"CurrentUserBadge",class:"c17uc4zr",propsAsIs:!0}),qs=({friendsRank:t,avatar:a,name:n,userId:r,points:l,isCurrentUser:i,style:d})=>s.jsxs(Cs,{"data-name":r,style:d,children:[s.jsx(As,{children:t||0}),s.jsxs($s,{children:[a?s.jsx(gs,{alt:"leaderboard-item-avatar",src:a}):s.jsx(bs,{children:e.I(n||"")}),s.jsxs(_s,{children:[s.jsx(ks,{children:n||""}),i&&s.jsx(Ss,{name:"icon-star"})]})]}),s.jsx("div",{children:e.s(l)})]}),Ls=e.styled_default("div")({name:"Container",class:"c16btbfp",propsAsIs:!1}),Ts=({items:t,currentUserId:a,openItemDetail:n,fetchMore:r,scrollNode:l,hasMore:i})=>{const d=u.useCallback(c=>{const o=c.target.getAttribute("data-name");o&&n(o)},[n]);return s.jsx(q,{loadMore:r,initialLoad:!1,hasMore:i,useWindow:!1,getScrollParent:()=>l.current,children:s.jsx(Ls,{"data-a":"intr",onClick:d,children:t.map(c=>s.jsx(qs,{...c,isCurrentUser:!!a&&a===c.userId},c.userId))})})},Rs=e.styled_default("div")({name:"Container",class:"c1itm4k7",propsAsIs:!1}),Ns=e.styled_default("div")({name:"IconContainer",class:"i1w4fsni",propsAsIs:!1}),Ms=()=>e.B1,Vs=e.styled_default(Ms())({name:"InviteGameIcon",class:"i19m85r1",propsAsIs:!0}),Bs=e.styled_default("div")({name:"Content",class:"c1mbu204",propsAsIs:!1}),Ds=e.styled_default("div")({name:"Heading",class:"h1amdqtv",propsAsIs:!1}),Fs=e.styled_default("div")({name:"Subtext",class:"s1lhlj9j",propsAsIs:!1}),Es=e.styled_default("div")({name:"LinkContainer",class:"l1wot35e",propsAsIs:!1}),Us=e.styled_default("div")({name:"LinkInfo",class:"l1jdw39q",propsAsIs:!1}),Ps=e.styled_default("span")({name:"LinkTitle",class:"l1cr5mk",propsAsIs:!1}),Hs=e.styled_default("span")({name:"LinkAddress",class:"lvi87q4",propsAsIs:!1}),zs=()=>e.B1,Os=e.styled_default(zs())({name:"LinkIcon",class:"l1pqlvw3",propsAsIs:!0}),Qs=({inviteLink:t,inviteCardTitle:a,inviteCardSubtext:n,primaryColor:r,className:l})=>{const i=u.useRef(null),[d,c]=_(i),[o]=e.f({type:"invitation",action:"sent",payload:{from:e.InvitationFrom.MENU}});return s.jsxs(Rs,{className:l,children:[s.jsx(Ns,{style:{backgroundColor:r},children:s.jsx(Vs,{name:"invite-game-icon"})}),s.jsxs(Bs,{children:[s.jsx(Ds,{children:a||""}),s.jsx(Fs,{children:n||""})]}),t&&s.jsxs(Es,{ref:i,"data-a":"intr",onClick:o(()=>d(t)),children:[s.jsxs(Us,{children:[s.jsx(Ps,{children:"Invite link"}),s.jsx(Hs,{children:t})]}),s.jsx(Os,{name:"icon-copy"})]}),c]})},Ws=e.styled_default("div")({name:"InviteFriendsContainer",class:"i1c9dygq",propsAsIs:!1}),Zs=({deepLink:t})=>s.jsx(Ws,{children:s.jsx(Qs,{inviteLink:t,inviteCardTitle:"It’s More Fun With Friends",inviteCardSubtext:"Invite and compete against your friends for the top spot on the leaderboard."})}),Ks=e.styled_default("div")({name:"InviteLinkContainer",class:"i1odbhm4",propsAsIs:!1}),Gs=({gamification:t,scrollNode:a,scrollStore:n})=>{const r=u.useRef(null),{data:l,hasMore:i,loading:d,key:c}=e.useStore(t.leaderboardList.$store),{data:o}=e.useStore(t.deepLink.$store),[p,m]=_(r);return!l.length&&!d?s.jsx(Zs,{deepLink:o}):s.jsxs(s.Fragment,{children:[s.jsx(Ts,{items:l,scrollNode:a,scrollStore:n,fetchMore:t.leaderboardList.fetchMore,hasMore:i,openItemDetail:t.openUser,currentUserId:t.currentUserId.get()},c),o&&s.jsx(Ks,{ref:r,children:s.jsx(ys,{"data-a":"intr",onClick:()=>p(o),title:"Invite Friends",description:"Challenge them now!"})}),m]})},Js=()=>e.r,Xs=e.styled_default(Js())({name:"Container",class:"cll3md7",propsAsIs:!0}),Ys=()=>e.S,se=e.styled_default(Ys())({name:"ActionBtn",class:"a10g1iik",propsAsIs:!0}),ee=({questionId:t,...a})=>s.jsxs(Xs,{"data-a":"intr","data-name":t,children:[s.jsx(e.O,{questionId:t,...a}),s.jsx(se,{"data-a":"intr","data-name":t,children:"View Insight"})]}),te=()=>e.r,ae=e.styled_default(te())({name:"Container",class:"cl56x6b",propsAsIs:!0}),ne=e.styled_default("button")({name:"ActionButton",class:"a11pzf92",propsAsIs:!1}),le=e.styled_default("blockquote")({name:"Quote",class:"q1hbaleq",propsAsIs:!1}),re=({...t})=>s.jsxs(ae,{"data-a":"intr","data-name":t.tweetId,children:[t.title&&s.jsx(le,{children:t.title}),s.jsx(e.b,{...t}),s.jsx(ne,{"data-a":"intr","data-name":t.tweetId,children:"View Insight"})]}),$=e.styled_default("div")({name:"QuestionsContainer",class:"qvghv3l",propsAsIs:!1}),ie=({questions:t,openQuestion:a,controlVideo:n})=>{const r=l=>{const i=l.target.getAttribute("data-name");i&&(e.wt(),a(i,{openedFrom:"list"}))};return t?s.jsx($,{"data-a":"intr",onClick:r,children:t==null?void 0:t.map(l=>{var i,d,c;if(l.type==="question"&&((i=l.attributes)==null?void 0:i.attributes.case)==="question"){const o=l.attributes.attributes.value;return s.jsx(e.R,{...o},o.questionId)}if(l.type==="insight"&&((d=l.attributes)==null?void 0:d.attributes.case)==="insight"){const o=l.attributes.attributes.value;return s.jsx(ee,{controlVideo:n,...o},o.questionId)}if(l.type==="tweet"&&((c=l.attributes)==null?void 0:c.attributes.case)==="tweet"){const o=l.attributes.attributes.value,p=l.attributes.id;return s.jsx(re,{controlVideo:n,...o,tweetId:p},p)}return null})}):s.jsx($,{children:Array.from({length:5}).map((l,i)=>s.jsx(e.D,{},i))})},oe=({store:t,openQuestion:a})=>{const{sdk:n}=e.p(),r=e.useStore(t);return s.jsx(ie,{openQuestion:a,questions:r.data,controlVideo:n==null?void 0:n.controlVideoPlayer})},de=({userSummary:t})=>{var a;const[n,r]=u.useState(void 0);return u.useEffect(()=>{const l=t.$store.subscribe(i=>{i&&r(i)});return()=>{l()}},[t]),s.jsx(ts,{loading:!(n!=null&&n.summary),...n==null?void 0:n.summary,successRate:(a=n==null?void 0:n.percentage)==null?void 0:a.correct})},ce=({gamification:t,className:a,scrollStore:n,scrollNode:r,appNode:l,style:i,responsiveStore:d})=>{const{tabsShown:c}=e.useStore(n,{keys:["tabsShown"]}),o=e.useStore(t.friendsTabEnabled),[p,m]=u.useState(x.HOME),[,v]=e.useTransition(),{sdkInDesktopView:I,screen:k}=e.useStore(d,{keys:["sdkInDesktopView"]}),w=h=>{v(()=>{var y;m(h),I===!1&&(((y=l.current)==null?void 0:y.getBoundingClientRect().y)||0)<0&&L(l,k.size,{behavior:"instant"})})};u.useEffect(()=>n.subscribe(h=>{if(h.scrollPosition===0){n.setKey("tabsShown",!0);return}d.get().sdkInDesktopView?n.setKey("tabsShown",h.scrollDirection==="backward"):n.setKey("tabsShown",h.scrollDirection==="forward")}),[n,d]),u.useEffect(()=>{o||m(x.HOME)},[o]);let j="0px";return I?j=c?"0px":"calc(0px - var(--header-height))":j=c?"var(--header-height)":"0px",s.jsxs(e.l,{className:e.cx_default(a,"SL-Tabs","sl-hide-on-modal"),style:i,children:[o&&s.jsx(e.S$1,{style:{top:j},children:s.jsx(is,{activePage:p,toggleActivePage:w})}),p===x.HOME&&s.jsxs(s.Fragment,{children:[s.jsx(e.m,{children:s.jsx(e.d,{children:s.jsx(de,{userSummary:t.userSummary})})}),s.jsx(e.n,{style:{flex:1},children:s.jsx(oe,{openQuestion:t.openQuestion,store:t.feedList.getStore()})})]}),p===x.LEADERBOARD&&s.jsx(e.C,{children:s.jsx(Gs,{scrollStore:n,scrollNode:r,gamification:t})})]})},ue=({gamification:t,scrollStore:a,className:n,appNode:r,scrollNode:l,responsiveStore:i})=>s.jsx(ce,{appNode:r,scrollStore:a,scrollNode:l,className:n,gamification:t,responsiveStore:i});exports.default=ue;

package/lib/cjs/index.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("react/jsx-runtime");const e=require("./index2.js");require("nanostores");require("react");require("lodash.throttle");require("react-dom");require("react-countup");exports.StreamLayerProvider=e.StreamLayerProvider;exports.StreamLayerSDKTv=e.StreamLayerSDKTv;exports.StreamLayerSDKTvContent=e.StreamLayerSDKTvContent;exports.StreamLayerSDKTvPauseAd=e.StreamLayerSDKTvPauseAd;exports.useStreamLayer=e.uf;exports.useStreamLayerUI=e.hf;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("react/jsx-runtime");const e=require("./index2.js");require("react");require("nanostores");require("lodash.throttle");require("react-dom");require("react-countup");exports.StreamLayerProvider=e.StreamLayerProvider;exports.StreamLayerSDKTv=e.StreamLayerSDKTv;exports.StreamLayerSDKTvContent=e.StreamLayerSDKTvContent;exports.StreamLayerSDKTvPauseAd=e.StreamLayerSDKTvPauseAd;exports.useStreamLayer=e.useStreamLayer;exports.useStreamLayerUI=e.useStreamLayerUI;