@streamlayer/react 0.29.3 → 0.29.5

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.
@@ -1,400 +0,0 @@
1
- import { jsx as e, jsxs as m, Fragment as T } from "react/jsx-runtime";
2
- import { f as $, S as L, a as R, b as z, p as F } from "./index-0d23b24e.js";
3
- import { lazy as j, useMemo as C, Suspense as q, useRef as D, useState as g, useCallback as G, useEffect as O, useContext as P } from "react";
4
- import { FeatureType as w, QuestionType as d } from "@streamlayer/sdk-web-types";
5
- import { useStore as f } from "@nanostores/react";
6
- import { FeatureStatus as b } from "@streamlayer/sdk-web-interfaces";
7
- import { s as l, t as y, c as M } from "./index-0ee221fc.js";
8
- import { NotificationType as A } from "@streamlayer/sdk-web-notifications";
9
- const U = ({ feature: s, sdk: a, children: n, className: t }) => {
10
- const r = f(s.status), { slStreamId: i } = f(a.sdkStore);
11
- return i != null && i.loading ? /* @__PURE__ */ e("div", { className: t, children: "event is loading..." }) : i != null && i.data ? r !== b.Ready ? /* @__PURE__ */ e("div", { className: t, children: "wait feature..." }) : n : /* @__PURE__ */ e("div", { className: t, children: "event is forbidden..." });
12
- }, B = j(() => import("./index-ffb81042.js")), Q = ({
13
- sdk: s,
14
- feature: a,
15
- className: n
16
- }) => {
17
- const t = C(() => a && a.featureConfig.get().type === w.GAMES ? /* @__PURE__ */ e(U, { className: n, sdk: s, feature: a, children: /* @__PURE__ */ e(B, { className: n, gamification: a, sdk: s }) }) : null, [s, a, n]);
18
- return /* @__PURE__ */ e(
19
- q,
20
- {
21
- fallback: /* @__PURE__ */ e("div", { style: { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: "100%" }, children: "page loading..." }),
22
- children: t
23
- }
24
- );
25
- };
26
- const V = /* @__PURE__ */ l("button")({
27
- name: "e",
28
- class: "enu64b2",
29
- propsAsIs: !1
30
- }), K = /* @__PURE__ */ l("span")({
31
- name: "t",
32
- class: "tw2meku",
33
- propsAsIs: !1
34
- }), W = /* @__PURE__ */ l("span")({
35
- name: "a",
36
- class: "aka8vam",
37
- propsAsIs: !1
38
- }), S = ({ disabled: s, active: a, onClick: n, label: t, icon: r }) => /* @__PURE__ */ e(V, { onClick: n, disabled: s, "data-selected": a, children: /* @__PURE__ */ m(T, { children: [
39
- r && /* @__PURE__ */ e(K, { children: r }),
40
- /* @__PURE__ */ e(W, { children: t })
41
- ] }) });
42
- const Y = () => y, H = /* @__PURE__ */ l(Y())({
43
- name: "a",
44
- class: "a10lggiw",
45
- propsAsIs: !0
46
- }), k = "channels", J = (s) => {
47
- var a;
48
- return /* @__PURE__ */ e(S, {
49
- ...s,
50
- id: "channels",
51
- label: "Channels",
52
- icon: /* @__PURE__ */ e(H, {
53
- name: "icon-btn-channels",
54
- "data-selected": (a = s.active) == null ? void 0 : a.toString()
55
- })
56
- });
57
- };
58
- const X = () => y, Z = /* @__PURE__ */ l(X())({
59
- name: "d",
60
- class: "d1x5s8ie",
61
- propsAsIs: !0
62
- }), u = "featuredGroups", ss = (s) => {
63
- var a;
64
- return /* @__PURE__ */ e(S, {
65
- ...s,
66
- label: "FG+",
67
- id: "featuredGroups",
68
- icon: /* @__PURE__ */ e(Z, {
69
- name: "icon-btn-feature-groups",
70
- "data-selected": (a = s.active) == null ? void 0 : a.toString()
71
- })
72
- });
73
- };
74
- const es = () => y, as = /* @__PURE__ */ l(es())({
75
- name: "n",
76
- class: "ntav86o",
77
- propsAsIs: !0
78
- }), I = "leaderboard", ns = (s) => {
79
- var a;
80
- return /* @__PURE__ */ e(S, {
81
- ...s,
82
- label: "Leader Board",
83
- id: "leaderboard",
84
- icon: /* @__PURE__ */ e(as, {
85
- name: "icon-btn-leaderboard",
86
- "data-selected": (a = s.active) == null ? void 0 : a.toString()
87
- })
88
- });
89
- };
90
- const ts = /* @__PURE__ */ l("div")({
91
- name: "n",
92
- class: "n1rlvhvz",
93
- propsAsIs: !1
94
- }), ls = ({
95
- children: s,
96
- className: a
97
- }) => /* @__PURE__ */ e(ts, {
98
- className: a,
99
- children: s
100
- });
101
- const is = () => ls, rs = /* @__PURE__ */ l(is())({
102
- name: "n",
103
- class: "n9bnom",
104
- propsAsIs: !0
105
- }), cs = ({ activeOverlay: s, setActiveOverlay: a, sdkReady: n, className: t }) => /* @__PURE__ */ m(rs, { className: t, children: [
106
- /* @__PURE__ */ e(J, { active: s === k, onClick: () => a(k) }),
107
- /* @__PURE__ */ e(
108
- ss,
109
- {
110
- active: s === u,
111
- disabled: !n,
112
- onClick: () => {
113
- a(u);
114
- }
115
- }
116
- ),
117
- /* @__PURE__ */ e(
118
- ns,
119
- {
120
- active: s === I,
121
- onClick: () => a(I)
122
- }
123
- )
124
- ] }), os = {
125
- [d.TWEET]: { label: "Insight", iconName: "icon-insight" },
126
- [d.PROMOTION]: { label: "Insight", iconName: "icon-insight" },
127
- [d.UNSET]: void 0,
128
- [d.FACTOID]: { label: "Insight", iconName: "icon-insight" },
129
- [d.POLL]: { label: "Poll", iconName: "icon-poll" },
130
- [d.TRIVIA]: { label: "Trivia", iconName: "icon-trivia" },
131
- [d.PREDICTION]: { label: "Prediction", iconName: "icon-prediction" }
132
- };
133
- const ds = /* @__PURE__ */ l("div")({
134
- name: "i",
135
- class: "i1bwjtdb",
136
- propsAsIs: !1
137
- }), ps = /* @__PURE__ */ l("video")({
138
- name: "e",
139
- class: "enb7moc",
140
- propsAsIs: !1
141
- }), us = /* @__PURE__ */ l("img")({
142
- name: "r",
143
- class: "r1ws5lyh",
144
- propsAsIs: !1
145
- }), ms = /* @__PURE__ */ l("div")({
146
- name: "s",
147
- class: "soibf55",
148
- propsAsIs: !1
149
- }), vs = ({ poster: s, source: a }) => {
150
- const n = D(null), [t, r] = g(!1), [i, o] = g(!0);
151
- return /* @__PURE__ */ m(ds, { onClick: () => {
152
- const c = n == null ? void 0 : n.current;
153
- c && r((v) => v ? (c.pause(), !1) : (c.play(), o(!1), !0));
154
- }, children: [
155
- /* @__PURE__ */ e(
156
- ps,
157
- {
158
- ref: n,
159
- src: a,
160
- onEnded: () => {
161
- var c;
162
- (c = n == null ? void 0 : n.current) == null || c.load(), r(!1), o(!0);
163
- },
164
- style: { visibility: i ? "hidden" : "visible" }
165
- }
166
- ),
167
- /* @__PURE__ */ e(us, { src: s, style: { visibility: i ? "visible" : "hidden" } }),
168
- /* @__PURE__ */ e(ms, { children: !t && /* @__PURE__ */ e(y, { name: "icon-play" }) })
169
- ] });
170
- };
171
- const fs = /* @__PURE__ */ l("div")({
172
- name: "r",
173
- class: "rcr31jh",
174
- propsAsIs: !1
175
- }), hs = /* @__PURE__ */ l("div")({
176
- name: "i",
177
- class: "ihj4z8w",
178
- propsAsIs: !1
179
- }), ys = /* @__PURE__ */ l("h3")({
180
- name: "t",
181
- class: "t1oks4sz",
182
- propsAsIs: !1
183
- }), bs = /* @__PURE__ */ l("div")({
184
- name: "n",
185
- class: "n18s3mno",
186
- propsAsIs: !1
187
- }), gs = /* @__PURE__ */ l("button")({
188
- name: "l",
189
- class: "lc8mqwv",
190
- propsAsIs: !1
191
- }), ks = ({
192
- video: s,
193
- heading: a,
194
- body: n,
195
- action: t
196
- }) => /* @__PURE__ */ m(fs, { children: [
197
- (s == null ? void 0 : s.url) && /* @__PURE__ */ e(vs, { source: s.url, poster: s.thumbnailUrl }),
198
- /* @__PURE__ */ m(hs, { children: [
199
- /* @__PURE__ */ e(ys, { children: a }),
200
- /* @__PURE__ */ e(bs, { children: n }),
201
- t && /* @__PURE__ */ e(gs, { onClick: t, children: "View Insight" })
202
- ] })
203
- ] });
204
- const Is = () => y, As = () => y, Ss = /* @__PURE__ */ l("div")({
205
- name: "p",
206
- class: "p16oo5uk",
207
- propsAsIs: !1
208
- }), $s = /* @__PURE__ */ l("div")({
209
- name: "a",
210
- class: "a18c5k3h",
211
- propsAsIs: !1
212
- }), Ns = /* @__PURE__ */ l(Is())({
213
- name: "c",
214
- class: "czv5t8k",
215
- propsAsIs: !0
216
- }), xs = /* @__PURE__ */ l("div")({
217
- name: "s",
218
- class: "s1wp1emp",
219
- propsAsIs: !1
220
- }), _s = /* @__PURE__ */ l(As())({
221
- name: "l",
222
- class: "l1nz0q6x",
223
- propsAsIs: !0
224
- }), Cs = /* @__PURE__ */ l("span")({
225
- name: "g",
226
- class: "g1jhb9lu",
227
- propsAsIs: !1
228
- }), Os = /* @__PURE__ */ l("div")({
229
- name: "d",
230
- class: "ds6gfsv",
231
- propsAsIs: !1
232
- }), ws = /* @__PURE__ */ l("button")({
233
- name: "x",
234
- class: "xkzz16s",
235
- propsAsIs: !1
236
- }), N = ({
237
- close: s,
238
- action: a,
239
- data: { questionType: n, question: t, insight: r }
240
- }) => {
241
- const i = os[n];
242
- return i ? /* @__PURE__ */ m(Ss, { children: [
243
- /* @__PURE__ */ e($s, { onClick: s, children: /* @__PURE__ */ e(Ns, { name: "icon-cross" }) }),
244
- /* @__PURE__ */ m(xs, { children: [
245
- /* @__PURE__ */ e(_s, { name: i.iconName }),
246
- /* @__PURE__ */ e(Cs, { children: i.label })
247
- ] }),
248
- n === d.FACTOID ? /* @__PURE__ */ e(ks, { ...r, action: a }) : /* @__PURE__ */ e(Os, { children: t == null ? void 0 : t.title }),
249
- n !== d.FACTOID && /* @__PURE__ */ e(ws, { onClick: a, children: "Answer" })
250
- ] }) : null;
251
- };
252
- const Es = /* @__PURE__ */ l("div")({
253
- name: "s",
254
- class: "s1aopxp8",
255
- propsAsIs: !1
256
- }), Ts = "c1t0h6s", Ls = ({
257
- children: s,
258
- style: a,
259
- className: n,
260
- hiding: t
261
- }) => /* @__PURE__ */ e(Es, {
262
- style: a,
263
- className: M(n, t && Ts),
264
- children: s
265
- });
266
- const Rs = () => Ls, x = /* @__PURE__ */ l(Rs())({
267
- name: "d",
268
- class: "d1qqtt3e",
269
- propsAsIs: !0
270
- }), zs = ({ sdk: s }) => {
271
- const a = s.getNotificationsStore(), n = f(a), t = C(() => {
272
- if (!(n != null && n.size))
273
- return null;
274
- for (const r of n.values())
275
- if (r.type === A.ONBOARDING)
276
- return r;
277
- return n.values().next().value;
278
- }, [n]);
279
- return (t == null ? void 0 : t.type) === A.QUESTION ? /* @__PURE__ */ e(x, { hiding: t.hiding, children: /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(N, { ...t }) }) }) : (t == null ? void 0 : t.type) === A.QUESTION_RESOLVED ? /* @__PURE__ */ e(x, { hiding: t.hiding, children: /* @__PURE__ */ e("div", { children: /* @__PURE__ */ e(N, { ...t }) }) }) : null;
280
- };
281
- const Fs = () => qs, js = /* @__PURE__ */ l("div")({
282
- name: "i",
283
- class: "idhrx8x",
284
- propsAsIs: !1
285
- }), _ = /* @__PURE__ */ l("div")({
286
- name: "r",
287
- class: "r1k6v4ep",
288
- propsAsIs: !1
289
- }), qs = /* @__PURE__ */ l("div")({
290
- name: "n",
291
- class: "n1v8kucd",
292
- propsAsIs: !1
293
- }), Js = /* @__PURE__ */ l(Fs())({
294
- name: "e",
295
- class: "e16yw7z1",
296
- propsAsIs: !0
297
- }), Ds = (s) => {
298
- const [a, n] = g(!1), t = f(s.status), { data: r } = f(s.getUserStore()), i = t === "ready", [o, c] = g(u), v = G(
299
- (p, h) => {
300
- c(h), h === u ? (p && s.createEventSession(p), s.openFeature(w.GAMES)) : s.closeFeature();
301
- },
302
- [s]
303
- );
304
- return O(() => {
305
- !i && o === u && (c(k), s.closeFeature());
306
- }, [i, o, s]), {
307
- sdkEnabled: a,
308
- sdkReady: i,
309
- activeOverlay: o,
310
- activateAndLoadOverlay: v,
311
- enableSdk: (p) => {
312
- s.initializeApp().then(({ enabled: h, err: E }) => {
313
- if (n(!0), E) {
314
- v(p, k);
315
- return;
316
- }
317
- if (h) {
318
- v(p, u);
319
- return;
320
- }
321
- });
322
- },
323
- disableSdk: () => {
324
- n(!1), s.disableApp();
325
- },
326
- isLogged: !!r
327
- };
328
- }, Gs = (s) => {
329
- const a = f(s.getActiveFeature()), n = f(s.streamStore()), [t, r] = g(null);
330
- return O(() => {
331
- const i = s.getFeatures();
332
- if (a)
333
- for (const [o, c] of i)
334
- o === a ? c.status.get() === b.Suspended && (c.enable(), r(c)) : c.status.get() === b.Ready && c.disable();
335
- else {
336
- for (const [, o] of i)
337
- o.status.get() === b.Ready && o.disable();
338
- r(null);
339
- }
340
- return () => {
341
- for (const [, o] of i)
342
- o.status.get() === b.Ready && o.disable();
343
- };
344
- }, [a, s, n]), [a, t];
345
- }, Ps = ({ sdk: s, className: a }) => {
346
- const [, n] = Gs(s);
347
- return /* @__PURE__ */ e(Q, { className: a, feature: n, sdk: s });
348
- }, Ms = ({ sdk: s, overlays: a, children: n }) => {
349
- const { sdkEnabled: t, sdkReady: r, activeOverlay: i, activateAndLoadOverlay: o, enableSdk: c, disableSdk: v, isLogged: p } = Ds(s);
350
- return /* @__PURE__ */ m(js, { children: [
351
- t && /* @__PURE__ */ e(
352
- cs,
353
- {
354
- sdkReady: r,
355
- activeOverlay: i,
356
- className: $,
357
- setActiveOverlay: (h) => o("", h)
358
- }
359
- ),
360
- t && /* @__PURE__ */ e(zs, { sdk: s }),
361
- /* @__PURE__ */ e(
362
- _,
363
- {
364
- "data-nav": t.toString(),
365
- style: { display: !t || i === k ? "block" : "none" },
366
- children: n && n({ enableSdk: c, disableSdk: v })
367
- }
368
- ),
369
- /* @__PURE__ */ e(
370
- _,
371
- {
372
- "data-nav": t.toString(),
373
- style: { display: i === I ? "block" : "none" },
374
- children: a && i === I && a[i]
375
- }
376
- ),
377
- p && t && i === u && /* @__PURE__ */ e(Ps, { className: $, sdk: s }),
378
- !p && t && i === u && /* @__PURE__ */ e("div", { style: { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: "100%" }, children: "You are not logged in." })
379
- ] });
380
- }, Xs = ({
381
- sdkKey: s,
382
- plugins: a,
383
- children: n,
384
- production: t = !0
385
- }) => /* @__PURE__ */ e(L, { sdkKey: s, plugins: a, production: t, autoEnable: !1, children: n }), Zs = ({ children: s, overlays: a }) => {
386
- const { sdk: n, status: t } = P(R);
387
- if (t === z.UNSET)
388
- throw new Error("Wrap app in `StreamLayerProvider`");
389
- return n ? /* @__PURE__ */ e("div", { className: "StreamLayerSDK", children: /* @__PURE__ */ e(F, { style: { height: "100%" }, children: /* @__PURE__ */ e(Ms, { sdk: n, overlays: a, children: s }) }) }) : s({});
390
- };
391
- export {
392
- Xs as M,
393
- Zs as a,
394
- Js as e,
395
- Ls as f,
396
- qs as n,
397
- os as o,
398
- _ as r,
399
- vs as w
400
- };