@streamlayer/react-ui 1.7.1 → 1.8.1
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/app/Advertisement/index.d.ts +0 -1
- package/lib/app/app/Advertisement/index.js +59 -71
- package/lib/app/app/Insight/index.d.ts +0 -1
- package/lib/app/app/Insight/index.js +37 -53
- package/lib/app/app/story/insight/index.js +31 -34
- package/lib/app/app/story/insight/video.d.ts +0 -1
- package/lib/app/app/story/insight/video.js +14 -14
- package/lib/app/app/story/promotion/content.d.ts +1 -3
- package/lib/app/app/story/promotion/content.js +10 -13
- package/lib/app/app/story/promotion/index.js +2 -3
- package/lib/app/tgl/index.d.ts +11 -0
- package/lib/app/tgl/index.js +54 -0
- package/lib/app/tgl/styles.d.ts +7 -0
- package/lib/app/tgl/styles.js +36 -0
- package/lib/app/tgl/video.d.ts +10 -0
- package/lib/app/tgl/video.js +105 -0
- package/lib/assets/style.css +1 -1
- package/lib/reset.css +9 -0
- package/lib/ui/advertisement/banner/index.js +6 -7
- package/lib/ui/advertisement/banner/styles.d.ts +0 -1
- package/lib/ui/advertisement/banner/styles.js +2 -7
- package/lib/ui/advertisement/index.d.ts +2 -3
- package/lib/ui/advertisement/index.js +25 -27
- package/lib/ui/advertisement/overlay/index.js +38 -38
- package/lib/ui/theme/constants.d.ts +10 -0
- package/lib/ui/theme/constants.js +31 -21
- package/lib/ui/theme/theme.js +46 -24
- package/package.json +15 -15
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { StreamLayerSDK } from '@streamlayer/sdk-web-interfaces';
|
|
2
2
|
export declare const AdvertisementUIWrap: import('@linaria/react').StyledComponent<import('react').ClassAttributes<HTMLDivElement> & import('react').HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
|
|
3
3
|
export type StreamLayerSDKAdvertisementProps = {
|
|
4
|
-
event?: string;
|
|
5
4
|
isMobileScreen?: boolean;
|
|
6
5
|
persistent?: boolean;
|
|
7
6
|
skipTypeCheck?: boolean;
|
|
@@ -1,27 +1,26 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { styled as
|
|
3
|
-
import { useStore as
|
|
4
|
-
import { useAnalyticsListener as
|
|
5
|
-
import {
|
|
6
|
-
import { eventBus as
|
|
7
|
-
import { FeatureType as
|
|
8
|
-
import {
|
|
9
|
-
|
|
10
|
-
const I = /* @__PURE__ */ v("div")({
|
|
1
|
+
import { jsx as s } from "react/jsx-runtime";
|
|
2
|
+
import { styled as p } from "@linaria/react";
|
|
3
|
+
import { useStore as f } from "@nanostores/react";
|
|
4
|
+
import { useAnalyticsListener as v } from "../../../hooks/analytics.js";
|
|
5
|
+
import { useRef as y } from "react";
|
|
6
|
+
import { eventBus as c } from "@streamlayer/sdk-web-interfaces";
|
|
7
|
+
import { FeatureType as A, PromotionType as g } from "@streamlayer/sdk-web-types";
|
|
8
|
+
import { AdvertisementUI as b } from "../../../ui/advertisement/index.js";
|
|
9
|
+
const S = /* @__PURE__ */ p("div")({
|
|
11
10
|
name: "AdvertisementUIWrap",
|
|
12
11
|
class: "aa6pjif",
|
|
13
12
|
propsAsIs: !1
|
|
14
|
-
}),
|
|
15
|
-
const
|
|
16
|
-
if (
|
|
17
|
-
const r =
|
|
18
|
-
|
|
13
|
+
}), h = (n) => {
|
|
14
|
+
const t = n.target;
|
|
15
|
+
if (t instanceof HTMLAnchorElement && t.target === "_blank") {
|
|
16
|
+
const r = t.getAttribute("data-promo-id") || "", i = t.getAttribute("data-promo-type") || g.UNSET;
|
|
17
|
+
t.getAttribute("data-analytics") === "button" && c.emit("advertisement", {
|
|
19
18
|
action: "buttonSelect",
|
|
20
19
|
payload: {
|
|
21
20
|
advertisementId: r,
|
|
22
21
|
advertisementType: i
|
|
23
22
|
}
|
|
24
|
-
}),
|
|
23
|
+
}), t.getAttribute("data-analytics") === "banner" && c.emit("advertisement", {
|
|
25
24
|
action: "bannerSelect",
|
|
26
25
|
payload: {
|
|
27
26
|
advertisementId: r,
|
|
@@ -29,83 +28,72 @@ const I = /* @__PURE__ */ v("div")({
|
|
|
29
28
|
}
|
|
30
29
|
});
|
|
31
30
|
}
|
|
32
|
-
},
|
|
33
|
-
gamification:
|
|
34
|
-
layoutMode:
|
|
31
|
+
}, I = ({
|
|
32
|
+
gamification: n,
|
|
33
|
+
layoutMode: t,
|
|
35
34
|
skipTypeCheck: r,
|
|
36
35
|
sidebar: i,
|
|
37
|
-
banner:
|
|
38
|
-
notification:
|
|
39
|
-
isMobileScreen:
|
|
40
|
-
persistent:
|
|
36
|
+
banner: o,
|
|
37
|
+
notification: m,
|
|
38
|
+
isMobileScreen: l,
|
|
39
|
+
persistent: d
|
|
41
40
|
}) => {
|
|
42
|
-
const
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
46
|
-
[m, a]
|
|
47
|
-
);
|
|
48
|
-
A(s, {
|
|
49
|
-
enabled: !!o,
|
|
41
|
+
const a = y(null), e = f(n.advertisement.$store);
|
|
42
|
+
v(a, {
|
|
43
|
+
enabled: !!e.data,
|
|
50
44
|
event: "click",
|
|
51
|
-
listener:
|
|
45
|
+
listener: h
|
|
52
46
|
});
|
|
53
|
-
const
|
|
54
|
-
return
|
|
55
|
-
ref:
|
|
47
|
+
const u = !o && !i;
|
|
48
|
+
return e.data === void 0 || !d && e.isViewed ? null : /* @__PURE__ */ s(S, {
|
|
49
|
+
ref: a,
|
|
56
50
|
style: {
|
|
57
|
-
height:
|
|
51
|
+
height: u ? "auto" : "100%"
|
|
58
52
|
},
|
|
59
|
-
className:
|
|
60
|
-
children: /* @__PURE__ */
|
|
53
|
+
className: l ? "mobile-view" : "",
|
|
54
|
+
children: /* @__PURE__ */ s(b, {
|
|
61
55
|
skipTypeCheck: r,
|
|
62
56
|
sidebar: i,
|
|
63
|
-
banner:
|
|
64
|
-
advertisement:
|
|
65
|
-
|
|
66
|
-
|
|
57
|
+
banner: o,
|
|
58
|
+
advertisement: e.data,
|
|
59
|
+
close: e.close,
|
|
60
|
+
layoutMode: t,
|
|
61
|
+
isNotification: m
|
|
67
62
|
})
|
|
68
|
-
})
|
|
69
|
-
},
|
|
70
|
-
sdk:
|
|
71
|
-
sidebar:
|
|
63
|
+
});
|
|
64
|
+
}, D = ({
|
|
65
|
+
sdk: n,
|
|
66
|
+
sidebar: t,
|
|
72
67
|
banner: r,
|
|
73
68
|
skipTypeCheck: i,
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
notification: s
|
|
69
|
+
layoutMode: o,
|
|
70
|
+
isMobileScreen: m,
|
|
71
|
+
persistent: l,
|
|
72
|
+
notification: d
|
|
79
73
|
}) => {
|
|
80
|
-
const
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
y(() => {
|
|
84
|
-
n ? t.createEventSession(n) : m();
|
|
85
|
-
}, [n, m, t]);
|
|
86
|
-
const o = p(t.featuresList.getStore());
|
|
87
|
-
if (e && r)
|
|
88
|
-
return /* @__PURE__ */ l("div", {
|
|
74
|
+
const a = f(n.featuresList.getStore());
|
|
75
|
+
if (t && r)
|
|
76
|
+
return /* @__PURE__ */ s("div", {
|
|
89
77
|
style: {
|
|
90
78
|
color: "red"
|
|
91
79
|
},
|
|
92
80
|
children: "define either sidebar or banner, not both."
|
|
93
81
|
});
|
|
94
|
-
if (!
|
|
82
|
+
if (!a)
|
|
95
83
|
return null;
|
|
96
|
-
const
|
|
97
|
-
return
|
|
98
|
-
gamification:
|
|
99
|
-
sidebar:
|
|
84
|
+
const e = n.getFeature(A.GAMES);
|
|
85
|
+
return e ? /* @__PURE__ */ s(I, {
|
|
86
|
+
gamification: e,
|
|
87
|
+
sidebar: t,
|
|
100
88
|
banner: r,
|
|
101
|
-
layoutMode:
|
|
102
|
-
isMobileScreen:
|
|
103
|
-
persistent:
|
|
104
|
-
notification:
|
|
89
|
+
layoutMode: o,
|
|
90
|
+
isMobileScreen: m,
|
|
91
|
+
persistent: l,
|
|
92
|
+
notification: d,
|
|
105
93
|
skipTypeCheck: i
|
|
106
94
|
}) : null;
|
|
107
95
|
};
|
|
108
96
|
export {
|
|
109
|
-
|
|
110
|
-
|
|
97
|
+
S as AdvertisementUIWrap,
|
|
98
|
+
D as StreamLayerSDKAdvertisement
|
|
111
99
|
};
|
|
@@ -1,69 +1,53 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import { styled as
|
|
3
|
-
import { useStore as
|
|
4
|
-
import {
|
|
5
|
-
import { FeatureType as
|
|
6
|
-
import { Question as
|
|
7
|
-
|
|
8
|
-
import { ShowIn as V } from "../../../ui/show-in/index.js";
|
|
9
|
-
const v = () => y, x = /* @__PURE__ */ d(v())({
|
|
1
|
+
import { jsx as c } from "react/jsx-runtime";
|
|
2
|
+
import { styled as Q } from "@linaria/react";
|
|
3
|
+
import { useStore as d } from "@nanostores/react";
|
|
4
|
+
import { useRef as i, useEffect as l } from "react";
|
|
5
|
+
import { FeatureType as m } from "@streamlayer/sdk-web-types";
|
|
6
|
+
import { Question as S } from "../Features/Gamification/Question.js";
|
|
7
|
+
const y = () => S, I = /* @__PURE__ */ Q(y())({
|
|
10
8
|
name: "QuestionWrap",
|
|
11
9
|
class: "q10hhsxv",
|
|
12
10
|
propsAsIs: !0
|
|
13
|
-
}),
|
|
11
|
+
}), b = ({
|
|
14
12
|
gamification: e,
|
|
15
|
-
persistent:
|
|
16
|
-
hideHeader:
|
|
13
|
+
persistent: o,
|
|
14
|
+
hideHeader: p,
|
|
17
15
|
insightId: r
|
|
18
16
|
}) => {
|
|
19
|
-
const
|
|
20
|
-
return l(() => r ? (!
|
|
21
|
-
|
|
17
|
+
const t = i(""), n = d(e.openedQuestion.$store);
|
|
18
|
+
return l(() => r ? (!o || e.isOpenedQuestion(r) || (t.current = r, e.getFeedItem(r).then((u) => {
|
|
19
|
+
var f;
|
|
20
|
+
t.current === r && ((f = u == null ? void 0 : u.attributes) == null ? void 0 : f.attributes.case) === "insight" && e.openQuestion(r, u);
|
|
22
21
|
})), () => {
|
|
23
|
-
|
|
24
|
-
}) : e.
|
|
25
|
-
data:
|
|
22
|
+
t.current = "";
|
|
23
|
+
}) : (e.activeQuestionId.subscribe(({
|
|
24
|
+
data: s
|
|
26
25
|
}) => {
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
}), [e, t, r]), n ? /* @__PURE__ */ i(V, {
|
|
35
|
-
style: {
|
|
36
|
-
height: "100%"
|
|
37
|
-
},
|
|
38
|
-
children: /* @__PURE__ */ i(x, {
|
|
39
|
-
hideHeader: f,
|
|
40
|
-
gamification: e,
|
|
41
|
-
hideSponsor: !0
|
|
42
|
-
})
|
|
26
|
+
var u;
|
|
27
|
+
s && ((u = s.feedItem) == null ? void 0 : u.type) === "insight" && (!o || e.isOpenedQuestion(s.feedItem.id) || (t.current = s.feedItem.id, e.openQuestion(s.feedItem.id, s.feedItem))), !s && t.current && (e.closeQuestion(t.current), t.current = "");
|
|
28
|
+
}), () => {
|
|
29
|
+
}), [e, o, r]), n ? /* @__PURE__ */ c(I, {
|
|
30
|
+
hideHeader: p,
|
|
31
|
+
gamification: e,
|
|
32
|
+
hideSponsor: !0
|
|
43
33
|
}) : null;
|
|
44
|
-
},
|
|
34
|
+
}, h = ({
|
|
45
35
|
sdk: e,
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
hideHeader: s
|
|
36
|
+
persistent: o,
|
|
37
|
+
insightId: p,
|
|
38
|
+
hideHeader: r
|
|
50
39
|
}) => {
|
|
51
|
-
|
|
52
|
-
deactivate: n
|
|
53
|
-
} = A(e);
|
|
54
|
-
if (l(() => {
|
|
55
|
-
t ? e.createEventSession(t) : n();
|
|
56
|
-
}, [t, n, e]), !S(e.featuresList.getStore()))
|
|
40
|
+
if (!d(e.featuresList.getStore()))
|
|
57
41
|
return null;
|
|
58
|
-
const
|
|
59
|
-
return
|
|
60
|
-
insightId:
|
|
61
|
-
persistent:
|
|
62
|
-
hideHeader:
|
|
63
|
-
gamification:
|
|
42
|
+
const n = e.getFeature(m.GAMES);
|
|
43
|
+
return n ? /* @__PURE__ */ c(b, {
|
|
44
|
+
insightId: p,
|
|
45
|
+
persistent: o,
|
|
46
|
+
hideHeader: r,
|
|
47
|
+
gamification: n
|
|
64
48
|
}) : null;
|
|
65
49
|
};
|
|
66
50
|
export {
|
|
67
|
-
|
|
68
|
-
|
|
51
|
+
I as QuestionWrap,
|
|
52
|
+
h as StreamLayerSDKInsight
|
|
69
53
|
};
|
|
@@ -1,58 +1,55 @@
|
|
|
1
|
-
import { jsx as
|
|
1
|
+
import { jsx as r } from "react/jsx-runtime";
|
|
2
2
|
import { styled as d } from "@linaria/react";
|
|
3
3
|
import { StreamLayerProvider as u, useStreamLayer as p } from "@streamlayer/react";
|
|
4
4
|
import { StreamLayerSDKInsight as c } from "../../Insight/index.js";
|
|
5
5
|
import { StreamLayerThemeProvider as y } from "../../../../ui/theme/index.js";
|
|
6
6
|
import { useStreamLayerDebug as f } from "../../../../utils/debug/index.js";
|
|
7
7
|
import { customTheme as l } from "./styles.js";
|
|
8
|
-
import { Video as
|
|
9
|
-
const
|
|
8
|
+
import { Video as h } from "./video.js";
|
|
9
|
+
const v = /* @__PURE__ */ d("div")({
|
|
10
10
|
name: "Body",
|
|
11
11
|
class: "buit6hv",
|
|
12
12
|
propsAsIs: !1
|
|
13
13
|
}), S = ({
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
insightId: n
|
|
14
|
+
hideHeader: t,
|
|
15
|
+
insightId: o
|
|
17
16
|
}) => {
|
|
18
|
-
const
|
|
19
|
-
return
|
|
17
|
+
const e = p();
|
|
18
|
+
return e ? /* @__PURE__ */ r(y, {
|
|
20
19
|
customTheme: l,
|
|
21
|
-
children: /* @__PURE__ */
|
|
22
|
-
hideHeader:
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
insightId: n,
|
|
20
|
+
children: /* @__PURE__ */ r(c, {
|
|
21
|
+
hideHeader: t,
|
|
22
|
+
sdk: e,
|
|
23
|
+
insightId: o,
|
|
26
24
|
persistent: !0
|
|
27
25
|
})
|
|
28
26
|
}) : null;
|
|
29
27
|
}, D = ({
|
|
30
|
-
sdkKey:
|
|
31
|
-
eventId:
|
|
32
|
-
layoutMode:
|
|
33
|
-
insightId:
|
|
34
|
-
production:
|
|
28
|
+
sdkKey: t,
|
|
29
|
+
eventId: o,
|
|
30
|
+
layoutMode: e,
|
|
31
|
+
insightId: s,
|
|
32
|
+
production: n,
|
|
35
33
|
onlyInsight: i,
|
|
36
34
|
hideHeader: a
|
|
37
35
|
}) => {
|
|
38
|
-
const
|
|
39
|
-
sdkKey:
|
|
40
|
-
eventId:
|
|
41
|
-
production:
|
|
36
|
+
const m = f({
|
|
37
|
+
sdkKey: t,
|
|
38
|
+
eventId: o,
|
|
39
|
+
production: n
|
|
42
40
|
});
|
|
43
|
-
return /* @__PURE__ */
|
|
44
|
-
sdkKey:
|
|
45
|
-
|
|
41
|
+
return /* @__PURE__ */ r(u, {
|
|
42
|
+
sdkKey: m.sdkKey,
|
|
43
|
+
event: m.event,
|
|
44
|
+
production: m.env === "production",
|
|
46
45
|
autoEnable: !0,
|
|
47
|
-
children: i ? /* @__PURE__ */
|
|
48
|
-
insightId:
|
|
49
|
-
hideHeader: a
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
layoutMode: n,
|
|
55
|
-
event: t.event
|
|
46
|
+
children: i ? /* @__PURE__ */ r(S, {
|
|
47
|
+
insightId: s,
|
|
48
|
+
hideHeader: a
|
|
49
|
+
}) : /* @__PURE__ */ r(v, {
|
|
50
|
+
children: /* @__PURE__ */ r(h, {
|
|
51
|
+
insightId: s,
|
|
52
|
+
layoutMode: e
|
|
56
53
|
})
|
|
57
54
|
})
|
|
58
55
|
});
|
|
@@ -1,30 +1,30 @@
|
|
|
1
|
-
import { jsxs as
|
|
1
|
+
import { jsxs as o, Fragment as d, jsx as e } from "react/jsx-runtime";
|
|
2
2
|
import { useRef as h } from "react";
|
|
3
|
-
import { useStreamLayer as
|
|
4
|
-
import { StreamLayerSDKInsight as
|
|
5
|
-
import { StreamLayerThemeProvider as
|
|
6
|
-
import { VideoFrame as
|
|
7
|
-
const
|
|
8
|
-
const r =
|
|
9
|
-
return /* @__PURE__ */
|
|
10
|
-
/* @__PURE__ */
|
|
11
|
-
/* @__PURE__ */ e(
|
|
12
|
-
/* @__PURE__ */ e(
|
|
3
|
+
import { useStreamLayer as l } from "@streamlayer/react";
|
|
4
|
+
import { StreamLayerSDKInsight as i } from "../../Insight/index.js";
|
|
5
|
+
import { StreamLayerThemeProvider as n } from "../../../../ui/theme/index.js";
|
|
6
|
+
import { VideoFrame as c, customTheme as s, VideoPlayerWrap as p, InsightContainerMobile as u, InsightContainerOverlay as f, InsightContainerLBar as g } from "./styles.js";
|
|
7
|
+
const x = ({ insightId: t, layoutMode: a }) => {
|
|
8
|
+
const r = l(), m = h(null);
|
|
9
|
+
return /* @__PURE__ */ o(d, { children: [
|
|
10
|
+
/* @__PURE__ */ o(c, { ref: m, "data-testid": "video-frame", children: [
|
|
11
|
+
/* @__PURE__ */ e(a === "cover" ? f : g, { children: r && /* @__PURE__ */ e(n, { customTheme: s, children: /* @__PURE__ */ e(i, { sdk: r, insightId: t, persistent: !0 }) }) }),
|
|
12
|
+
/* @__PURE__ */ e(p, { children: /* @__PURE__ */ e("div", { className: "divAnchor", children: /* @__PURE__ */ e(
|
|
13
13
|
"video",
|
|
14
14
|
{
|
|
15
15
|
src: "https://storage.googleapis.com/cdn.streamlayer.io/assets/sdk-web/Own%20The%20Game%201080p%20RF18.mp4",
|
|
16
16
|
width: "100%",
|
|
17
17
|
height: "100%",
|
|
18
|
-
|
|
18
|
+
autoPlay: !0,
|
|
19
19
|
loop: !0,
|
|
20
20
|
playsInline: !0,
|
|
21
21
|
controls: !0
|
|
22
22
|
}
|
|
23
23
|
) }) })
|
|
24
24
|
] }),
|
|
25
|
-
/* @__PURE__ */ e(
|
|
25
|
+
/* @__PURE__ */ e(u, { children: r && /* @__PURE__ */ e(n, { customTheme: s, children: /* @__PURE__ */ e(i, { sdk: r, insightId: t, persistent: !0 }) }) })
|
|
26
26
|
] });
|
|
27
27
|
};
|
|
28
28
|
export {
|
|
29
|
-
|
|
29
|
+
x as Video
|
|
30
30
|
};
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsxs as e, jsx as t } from "react/jsx-runtime";
|
|
2
2
|
import { styled as r } from "@linaria/react";
|
|
3
|
-
import { useStreamLayer as
|
|
4
|
-
import { StreamLayerSDKAdvertisement as
|
|
5
|
-
import { theme as
|
|
6
|
-
const
|
|
3
|
+
import { useStreamLayer as m } from "@streamlayer/react";
|
|
4
|
+
import { StreamLayerSDKAdvertisement as o } from "../../Advertisement/index.js";
|
|
5
|
+
import { theme as i } from "../../../../ui/theme/theme.js";
|
|
6
|
+
const a = /* @__PURE__ */ r("div")({
|
|
7
7
|
name: "Container",
|
|
8
8
|
class: "c1g3vhjc",
|
|
9
9
|
propsAsIs: !1
|
|
@@ -11,17 +11,14 @@ const d = /* @__PURE__ */ r("div")({
|
|
|
11
11
|
name: "Div",
|
|
12
12
|
class: "d1626h38",
|
|
13
13
|
propsAsIs: !1
|
|
14
|
-
}),
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
return s ? /* @__PURE__ */ e(d, {
|
|
19
|
-
className: a,
|
|
14
|
+
}), c = () => {
|
|
15
|
+
const s = m();
|
|
16
|
+
return s ? /* @__PURE__ */ e(a, {
|
|
17
|
+
className: i,
|
|
20
18
|
"data-testid": "overlay",
|
|
21
19
|
children: [/* @__PURE__ */ e(n, {
|
|
22
20
|
children: ["Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. ", /* @__PURE__ */ t("br", {}), "-------------"]
|
|
23
|
-
}), /* @__PURE__ */ t(
|
|
24
|
-
event: m,
|
|
21
|
+
}), /* @__PURE__ */ t(o, {
|
|
25
22
|
sdk: s,
|
|
26
23
|
persistent: !0
|
|
27
24
|
}), /* @__PURE__ */ e(n, {
|
|
@@ -30,5 +27,5 @@ const d = /* @__PURE__ */ r("div")({
|
|
|
30
27
|
}) : null;
|
|
31
28
|
};
|
|
32
29
|
export {
|
|
33
|
-
|
|
30
|
+
c as Content
|
|
34
31
|
};
|
|
@@ -30,6 +30,7 @@ const b = /* @__PURE__ */ r("div")({
|
|
|
30
30
|
return /* @__PURE__ */ e(f, {
|
|
31
31
|
children: /* @__PURE__ */ p(l, {
|
|
32
32
|
sdkKey: o.sdkKey,
|
|
33
|
+
event: o.event,
|
|
33
34
|
production: o.env === "production",
|
|
34
35
|
autoEnable: !0,
|
|
35
36
|
children: [/* @__PURE__ */ e(b, {
|
|
@@ -43,9 +44,7 @@ const b = /* @__PURE__ */ r("div")({
|
|
|
43
44
|
})
|
|
44
45
|
}), /* @__PURE__ */ e("h3", {
|
|
45
46
|
children: "Overlay View (should appear between two text blocks)"
|
|
46
|
-
}), /* @__PURE__ */ e(u, {
|
|
47
|
-
event: o.event
|
|
48
|
-
})]
|
|
47
|
+
}), /* @__PURE__ */ e(u, {})]
|
|
49
48
|
})
|
|
50
49
|
});
|
|
51
50
|
};
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export declare const TGLStory: React.FC<{
|
|
2
|
+
isMobileScreen?: boolean;
|
|
3
|
+
promotionId?: string;
|
|
4
|
+
insightId?: string;
|
|
5
|
+
sdkKey?: string;
|
|
6
|
+
eventId?: string;
|
|
7
|
+
production?: boolean;
|
|
8
|
+
persistent?: boolean;
|
|
9
|
+
sidebar: 'left' | 'right';
|
|
10
|
+
banner: 'top' | 'bottom';
|
|
11
|
+
}>;
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
import { jsx as r } from "react/jsx-runtime";
|
|
2
|
+
import { styled as o } from "@linaria/react";
|
|
3
|
+
import { StreamLayerProvider as l } from "@streamlayer/react";
|
|
4
|
+
import { useStreamLayerDebug as u } from "../../utils/debug/index.js";
|
|
5
|
+
import { Video as v } from "./video.js";
|
|
6
|
+
const f = /* @__PURE__ */ o("div")({
|
|
7
|
+
name: "Body",
|
|
8
|
+
class: "b1ssmzei",
|
|
9
|
+
propsAsIs: !1
|
|
10
|
+
}), b = /* @__PURE__ */ o("div")({
|
|
11
|
+
name: "Main",
|
|
12
|
+
class: "me6bye3",
|
|
13
|
+
propsAsIs: !1
|
|
14
|
+
}), k = ({
|
|
15
|
+
isMobileScreen: s,
|
|
16
|
+
persistent: t,
|
|
17
|
+
insightId: n,
|
|
18
|
+
promotionId: i,
|
|
19
|
+
sdkKey: d,
|
|
20
|
+
eventId: m,
|
|
21
|
+
sidebar: a,
|
|
22
|
+
production: p,
|
|
23
|
+
banner: c,
|
|
24
|
+
layoutMode: y = "side-by-side"
|
|
25
|
+
}) => {
|
|
26
|
+
const e = u({
|
|
27
|
+
sdkKey: d,
|
|
28
|
+
eventId: m,
|
|
29
|
+
production: p
|
|
30
|
+
});
|
|
31
|
+
return /* @__PURE__ */ r(b, {
|
|
32
|
+
children: /* @__PURE__ */ r(l, {
|
|
33
|
+
sdkKey: e.sdkKey,
|
|
34
|
+
event: e.event,
|
|
35
|
+
production: e.env === "production",
|
|
36
|
+
autoEnable: !0,
|
|
37
|
+
children: /* @__PURE__ */ r(f, {
|
|
38
|
+
children: /* @__PURE__ */ r(v, {
|
|
39
|
+
event: e.event,
|
|
40
|
+
banner: c,
|
|
41
|
+
sidebar: a,
|
|
42
|
+
layoutMode: y,
|
|
43
|
+
promotionId: i,
|
|
44
|
+
isMobileScreen: s,
|
|
45
|
+
persistent: t,
|
|
46
|
+
insightId: n
|
|
47
|
+
})
|
|
48
|
+
})
|
|
49
|
+
})
|
|
50
|
+
});
|
|
51
|
+
};
|
|
52
|
+
export {
|
|
53
|
+
k as TGLStory
|
|
54
|
+
};
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export declare const customTheme: import('@linaria/core').LinariaClassName;
|
|
2
|
+
export declare const VideoPlayerWrap: import('@linaria/react').StyledComponent<import('react').ClassAttributes<HTMLDivElement> & import('react').HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
|
|
3
|
+
export declare const VideoFrame: import('@linaria/react').StyledComponent<import('react').ClassAttributes<HTMLDivElement> & import('react').HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
|
|
4
|
+
export declare const AdvSidebar: import('@linaria/react').StyledComponent<import('react').ClassAttributes<HTMLDivElement> & import('react').HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
|
|
5
|
+
export declare const AdvContent: import('@linaria/react').StyledComponent<import('react').ClassAttributes<HTMLDivElement> & import('react').HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
|
|
6
|
+
export declare const AdvBanner: import('@linaria/react').StyledComponent<import('react').ClassAttributes<HTMLDivElement> & import('react').HTMLAttributes<HTMLDivElement> & Record<never, unknown>>;
|
|
7
|
+
export declare const PromoButton: any;
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import { styled as s } from "@linaria/react";
|
|
2
|
+
import { Button as o } from "../../ui/button/index.js";
|
|
3
|
+
const r = "c2zt16z", t = /* @__PURE__ */ s("div")({
|
|
4
|
+
name: "VideoPlayerWrap",
|
|
5
|
+
class: "v1a2i6l5",
|
|
6
|
+
propsAsIs: !1
|
|
7
|
+
}), p = /* @__PURE__ */ s("div")({
|
|
8
|
+
name: "VideoFrame",
|
|
9
|
+
class: "v11p2oa",
|
|
10
|
+
propsAsIs: !1
|
|
11
|
+
}), d = /* @__PURE__ */ s("div")({
|
|
12
|
+
name: "AdvSidebar",
|
|
13
|
+
class: "a4rnnox",
|
|
14
|
+
propsAsIs: !1
|
|
15
|
+
}), c = /* @__PURE__ */ s("div")({
|
|
16
|
+
name: "AdvContent",
|
|
17
|
+
class: "a1t6jakx",
|
|
18
|
+
propsAsIs: !1
|
|
19
|
+
}), m = /* @__PURE__ */ s("div")({
|
|
20
|
+
name: "AdvBanner",
|
|
21
|
+
class: "ah6jyrg",
|
|
22
|
+
propsAsIs: !1
|
|
23
|
+
}), a = () => o, i = /* @__PURE__ */ s(a())({
|
|
24
|
+
name: "PromoButton",
|
|
25
|
+
class: "p12yifsu",
|
|
26
|
+
propsAsIs: !0
|
|
27
|
+
});
|
|
28
|
+
export {
|
|
29
|
+
m as AdvBanner,
|
|
30
|
+
c as AdvContent,
|
|
31
|
+
d as AdvSidebar,
|
|
32
|
+
i as PromoButton,
|
|
33
|
+
p as VideoFrame,
|
|
34
|
+
t as VideoPlayerWrap,
|
|
35
|
+
r as customTheme
|
|
36
|
+
};
|