@cuemath/leap 3.1.44-hg4 → 3.1.44
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/dist/features/auth/forgot-password/forgot-password-styled.js +12 -12
- package/dist/features/auth/forgot-password/forgot-password-styled.js.map +1 -1
- package/dist/features/auth/login/identifier-otp-form/identifier-otp-form-styled.js +9 -9
- package/dist/features/auth/login/identifier-otp-form/identifier-otp-form-styled.js.map +1 -1
- package/dist/features/auth/login/login-styled.js +6 -6
- package/dist/features/auth/login/login-styled.js.map +1 -1
- package/dist/features/circle-games/game-launcher/comps/tables-card/tables-card.js +44 -44
- package/dist/features/circle-games/game-launcher/comps/tables-card/tables-card.js.map +1 -1
- package/dist/features/hooks/use-viewport/use-viewport.js +13 -14
- package/dist/features/hooks/use-viewport/use-viewport.js.map +1 -1
- package/dist/features/ui/theme/device.js +5 -0
- package/dist/features/ui/theme/device.js.map +1 -0
- package/dist/features/ui/theme/get-theme.js +23 -25
- package/dist/features/ui/theme/get-theme.js.map +1 -1
- package/dist/features/ui/theme/layout.js +3 -6
- package/dist/features/ui/theme/layout.js.map +1 -1
- package/dist/features/utils/media.js +16 -0
- package/dist/features/utils/media.js.map +1 -0
- package/dist/index.d.ts +9 -14
- package/dist/index.js +34 -32
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/dist/features/ui/theme/constants.js +0 -11
- package/dist/features/ui/theme/constants.js.map +0 -1
- package/dist/features/ui/theme/get-device.js +0 -6
- package/dist/features/ui/theme/get-device.js.map +0 -1
- package/dist/features/ui/theme/media-queries.js +0 -11
- package/dist/features/ui/theme/media-queries.js.map +0 -1
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { styled as t } from "styled-components";
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import {
|
|
5
|
-
const
|
|
2
|
+
import i from "../../ui/buttons/button/button.js";
|
|
3
|
+
import p from "../../ui/layout/flex-view.js";
|
|
4
|
+
import { media as o } from "../../utils/media.js";
|
|
5
|
+
const x = t.form`
|
|
6
6
|
display: flex;
|
|
7
7
|
flex: 1;
|
|
8
8
|
margin-top: 0;
|
|
@@ -11,27 +11,27 @@ const { mediaQueries: i } = p(), x = t.form`
|
|
|
11
11
|
max-width: 336px;
|
|
12
12
|
width: 100%;
|
|
13
13
|
height: 308px;
|
|
14
|
-
${
|
|
14
|
+
${o.minDesktop} {
|
|
15
15
|
margin-top: 8px;
|
|
16
16
|
}
|
|
17
|
-
`, a = t(
|
|
17
|
+
`, a = t(p)`
|
|
18
18
|
margin-top: 0;
|
|
19
19
|
max-width: 336px;
|
|
20
20
|
width: 100%;
|
|
21
|
-
${
|
|
21
|
+
${o.minDesktop} {
|
|
22
22
|
margin-top: 8px;
|
|
23
23
|
}
|
|
24
|
-
`,
|
|
24
|
+
`, h = t(p)`
|
|
25
25
|
min-height: 300px;
|
|
26
|
-
${
|
|
26
|
+
${o.minDesktop} {
|
|
27
27
|
height: 308px;
|
|
28
28
|
}
|
|
29
|
-
`,
|
|
29
|
+
`, s = t(i)`
|
|
30
30
|
width: 100%;
|
|
31
31
|
`;
|
|
32
32
|
export {
|
|
33
|
-
|
|
34
|
-
|
|
33
|
+
s as ButtonWrapper,
|
|
34
|
+
h as Container,
|
|
35
35
|
x as FormWrapper,
|
|
36
36
|
a as OtpFormWrapper
|
|
37
37
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"forgot-password-styled.js","sources":["../../../../src/features/auth/forgot-password/forgot-password-styled.tsx"],"sourcesContent":["import { styled } from 'styled-components';\n\nimport Button from '../../ui/buttons/button/button';\nimport FlexView from '../../ui/layout/flex-view';\nimport {
|
|
1
|
+
{"version":3,"file":"forgot-password-styled.js","sources":["../../../../src/features/auth/forgot-password/forgot-password-styled.tsx"],"sourcesContent":["import { styled } from 'styled-components';\n\nimport Button from '../../ui/buttons/button/button';\nimport FlexView from '../../ui/layout/flex-view';\nimport { media } from '../../utils/media';\n\nexport const FormWrapper = styled.form`\n display: flex;\n flex: 1;\n margin-top: 0;\n flex-direction: column;\n justify-content: space-between;\n max-width: 336px;\n width: 100%;\n height: 308px;\n ${media.minDesktop} {\n margin-top: 8px;\n }\n`;\n\nexport const OtpFormWrapper = styled(FlexView)`\n margin-top: 0;\n max-width: 336px;\n width: 100%;\n ${media.minDesktop} {\n margin-top: 8px;\n }\n`;\n\nexport const Container = styled(FlexView)`\n min-height: 300px;\n ${media.minDesktop} {\n height: 308px;\n }\n`;\n\nexport const ButtonWrapper = styled(Button)`\n width: 100%;\n`;\n"],"names":["FormWrapper","styled","media","OtpFormWrapper","FlexView","Container","ButtonWrapper","Button"],"mappings":";;;;AAMO,MAAMA,IAAcC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAS9BC,EAAM,UAAU;AAAA;AAAA;AAAA,GAKPC,IAAiBF,EAAOG,CAAQ;AAAA;AAAA;AAAA;AAAA,IAIzCF,EAAM,UAAU;AAAA;AAAA;AAAA,GAKPG,IAAYJ,EAAOG,CAAQ;AAAA;AAAA,IAEpCF,EAAM,UAAU;AAAA;AAAA;AAAA,GAKPI,IAAgBL,EAAOM,CAAM;AAAA;AAAA;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import {
|
|
4
|
-
const
|
|
1
|
+
import t from "styled-components";
|
|
2
|
+
import o from "../../../ui/layout/flex-view.js";
|
|
3
|
+
import { media as e } from "../../../utils/media.js";
|
|
4
|
+
const r = t.form`
|
|
5
5
|
display: flex;
|
|
6
6
|
flex-direction: column;
|
|
7
7
|
justify-content: space-between;
|
|
@@ -9,17 +9,17 @@ const { mediaQueries: t } = o(), n = e.form`
|
|
|
9
9
|
flex: 1;
|
|
10
10
|
width: 100%;
|
|
11
11
|
max-width: 336px;
|
|
12
|
-
${
|
|
12
|
+
${e.minDesktop} {
|
|
13
13
|
margin-top: 8px;
|
|
14
14
|
}
|
|
15
|
-
`,
|
|
15
|
+
`, n = t(o)`
|
|
16
16
|
height: 300px;
|
|
17
|
-
${
|
|
17
|
+
${e.minDesktop} {
|
|
18
18
|
height: 308px;
|
|
19
19
|
}
|
|
20
20
|
`;
|
|
21
21
|
export {
|
|
22
|
-
|
|
23
|
-
|
|
22
|
+
n as Container,
|
|
23
|
+
r as FormWrapper
|
|
24
24
|
};
|
|
25
25
|
//# sourceMappingURL=identifier-otp-form-styled.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"identifier-otp-form-styled.js","sources":["../../../../../src/features/auth/login/identifier-otp-form/identifier-otp-form-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\nimport {
|
|
1
|
+
{"version":3,"file":"identifier-otp-form-styled.js","sources":["../../../../../src/features/auth/login/identifier-otp-form/identifier-otp-form-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\nimport { media } from '../../../utils/media';\n\nconst FormWrapper = styled.form`\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n margin-top: 0;\n flex: 1;\n width: 100%;\n max-width: 336px;\n ${media.minDesktop} {\n margin-top: 8px;\n }\n`;\n\nconst Container = styled(FlexView)`\n height: 300px;\n ${media.minDesktop} {\n height: 308px;\n }\n`;\n\nexport { FormWrapper, Container };\n"],"names":["FormWrapper","styled","media","Container","FlexView"],"mappings":";;;AAKA,MAAMA,IAAcC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQvBC,EAAM,UAAU;AAAA;AAAA;AAAA,GAKdC,IAAYF,EAAOG,CAAQ;AAAA;AAAA,IAE7BF,EAAM,UAAU;AAAA;AAAA;AAAA;"}
|
|
@@ -1,21 +1,21 @@
|
|
|
1
1
|
import t from "styled-components";
|
|
2
|
-
import
|
|
2
|
+
import i from "../../ui/buttons/button/button.js";
|
|
3
3
|
import m from "../../ui/layout/flex-view.js";
|
|
4
|
-
import {
|
|
5
|
-
const
|
|
4
|
+
import { media as o } from "../../utils/media.js";
|
|
5
|
+
const x = t.form`
|
|
6
6
|
max-width: 336px;
|
|
7
7
|
width: 100%;
|
|
8
8
|
margin-top: 0;
|
|
9
|
-
${
|
|
9
|
+
${o.minDesktop} {
|
|
10
10
|
margin-top: 8px;
|
|
11
11
|
}
|
|
12
12
|
`;
|
|
13
|
-
t(
|
|
13
|
+
t(i)`
|
|
14
14
|
max-width: 160px;
|
|
15
15
|
`;
|
|
16
16
|
const a = t(m)`
|
|
17
17
|
min-height: 300px;
|
|
18
|
-
${
|
|
18
|
+
${o.minDesktop} {
|
|
19
19
|
height: 308px;
|
|
20
20
|
}
|
|
21
21
|
`;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"login-styled.js","sources":["../../../../src/features/auth/login/login-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport Button from '../../ui/buttons/button/button';\nimport FlexView from '../../ui/layout/flex-view';\nimport {
|
|
1
|
+
{"version":3,"file":"login-styled.js","sources":["../../../../src/features/auth/login/login-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport Button from '../../ui/buttons/button/button';\nimport FlexView from '../../ui/layout/flex-view';\nimport { media } from '../../utils/media';\n\nexport const FormContainer = styled.form`\n max-width: 336px;\n width: 100%;\n margin-top: 0;\n ${media.minDesktop} {\n margin-top: 8px;\n }\n`;\n\nconst ButtonWrapper = styled(Button)`\n max-width: 160px;\n`;\n\nconst Container = styled(FlexView)`\n min-height: 300px;\n ${media.minDesktop} {\n height: 308px;\n }\n`;\n\nexport { ButtonWrapper, Container };\n"],"names":["FormContainer","styled","media","Button","Container","FlexView"],"mappings":";;;;AAMO,MAAMA,IAAgBC,EAAO;AAAA;AAAA;AAAA;AAAA,IAIhCC,EAAM,UAAU;AAAA;AAAA;AAAA;AAKED,EAAOE,CAAM;AAAA;AAAA;AAI7B,MAAAC,IAAYH,EAAOI,CAAQ;AAAA;AAAA,IAE7BH,EAAM,UAAU;AAAA;AAAA;AAAA;"}
|
|
@@ -15,27 +15,27 @@ import { TABLE_REVEAL_ANIMATION as v, TABLE_MODE_LABEL_COLOR as Re, INFINITE_MOD
|
|
|
15
15
|
import $e from "./infinite-button/infinite-mode-launcher-button.js";
|
|
16
16
|
import we from "./table-mode/table-mode.js";
|
|
17
17
|
import ye from "./table-segment-star/table-segment-star.js";
|
|
18
|
-
import { CardWrapper as We, TableSegmentsWrapper as De, TableSegmentCardShadowContainer as ke, TableSegment as Pe, TableNumber as xe, TableModeContainer as Ve, TableModeWrapper as Be, AnimatedView as qe, ModeOverlay as
|
|
19
|
-
const
|
|
18
|
+
import { CardWrapper as We, TableSegmentsWrapper as De, TableSegmentCardShadowContainer as ke, TableSegment as Pe, TableNumber as xe, TableModeContainer as Ve, TableModeWrapper as Be, AnimatedView as qe, ModeOverlay as Ue, AbsoluteView as X, IconWrapper as je } from "./tables-card-styled.js";
|
|
19
|
+
const Me = {
|
|
20
20
|
loop: !1,
|
|
21
21
|
renderer: "svg"
|
|
22
22
|
}, Ze = Ae(
|
|
23
23
|
({
|
|
24
24
|
data: s,
|
|
25
|
-
label:
|
|
25
|
+
label: $,
|
|
26
26
|
onPress: E,
|
|
27
27
|
openModesOfTable: r,
|
|
28
28
|
defaultTable: g,
|
|
29
29
|
onGoBackFromTableLevel: f,
|
|
30
30
|
onPressTableSegment: L
|
|
31
31
|
}, Y) => {
|
|
32
|
-
var
|
|
33
|
-
const { onEvent:
|
|
32
|
+
var M;
|
|
33
|
+
const { onEvent: w } = Ce(), { playButtonSound: a } = pe(), [u, N] = o(!0), [d, h] = o(
|
|
34
34
|
(r == null ? void 0 : r.tableNumber) ?? null
|
|
35
|
-
), [S,
|
|
36
|
-
stars: ((
|
|
35
|
+
), [S, y] = o(null), [W, D] = o(!1), [F, A] = o("WHITE_T_60"), [c, p] = o({
|
|
36
|
+
stars: ((M = s.tableList.find((e) => e.tableNumber === (r == null ? void 0 : r.tableNumber))) == null ? void 0 : M.stars) ?? [],
|
|
37
37
|
tableNumber: (r == null ? void 0 : r.tableNumber) ?? 0
|
|
38
|
-
}),
|
|
38
|
+
}), k = b(null), [J, Q] = o(!0), [I, P] = o(!1), [x, G] = o("WHITE_T_60"), V = b(null), B = b(null), [_, O] = o((r == null ? void 0 : r.rewardStar) ?? []), T = b(null), R = b(
|
|
39
39
|
void 0
|
|
40
40
|
), q = i(
|
|
41
41
|
(e) => {
|
|
@@ -43,41 +43,41 @@ const je = {
|
|
|
43
43
|
L(e);
|
|
44
44
|
return;
|
|
45
45
|
}
|
|
46
|
-
a(), N(!0), h(e.tableNumber), p({ ...e }), O([]),
|
|
46
|
+
a(), N(!0), h(e.tableNumber), p({ ...e }), O([]), w(Ie.TABLE_SELECTED, {
|
|
47
47
|
meta: {
|
|
48
48
|
table_of: e.tableNumber
|
|
49
49
|
}
|
|
50
50
|
});
|
|
51
51
|
},
|
|
52
|
-
[L, a,
|
|
52
|
+
[L, a, w]
|
|
53
53
|
), ee = i(
|
|
54
54
|
(e) => {
|
|
55
|
-
A(I ?
|
|
55
|
+
A(I ? x : "WHITE_T_60"), h(e.tableNumber);
|
|
56
56
|
},
|
|
57
|
-
[
|
|
57
|
+
[x, I]
|
|
58
58
|
), te = i(() => {
|
|
59
|
-
|
|
60
|
-
}, []),
|
|
61
|
-
A("WHITE_T_60"), !c.tableNumber && h(null),
|
|
62
|
-
}, [c.tableNumber]),
|
|
59
|
+
D(!0);
|
|
60
|
+
}, []), U = i(() => {
|
|
61
|
+
A("WHITE_T_60"), !c.tableNumber && h(null), D(!1);
|
|
62
|
+
}, [c.tableNumber]), j = i(() => {
|
|
63
63
|
var n;
|
|
64
64
|
f == null || f(), a(), N(!1), h(null);
|
|
65
65
|
const e = (v.DISAPPEAR[1] - v.DISAPPEAR[0]) / 30;
|
|
66
|
-
(n =
|
|
66
|
+
(n = T.current) == null || n.playSegments(v.DISAPPEAR, !0), R.current = setTimeout(() => {
|
|
67
67
|
p({ stars: [], tableNumber: 0 });
|
|
68
68
|
}, e * 1e3);
|
|
69
69
|
}, [f, a]), re = i(() => {
|
|
70
70
|
var e;
|
|
71
|
-
(e =
|
|
71
|
+
(e = T.current) == null || e.playSegments(v.REVEAL, !0);
|
|
72
72
|
}, []), ie = i((e) => {
|
|
73
73
|
const n = {
|
|
74
74
|
sequence: 1,
|
|
75
75
|
random: 2,
|
|
76
76
|
advance: 3
|
|
77
77
|
};
|
|
78
|
-
A(Re[e] ?? "WHITE_T_60"),
|
|
78
|
+
A(Re[e] ?? "WHITE_T_60"), y(n[e] ?? 0);
|
|
79
79
|
}, []), ne = i(() => {
|
|
80
|
-
|
|
80
|
+
y(null), A("WHITE_T_60");
|
|
81
81
|
}, []), l = z(() => c, [c]), oe = z(() => [
|
|
82
82
|
{
|
|
83
83
|
top: 20,
|
|
@@ -123,27 +123,27 @@ const je = {
|
|
|
123
123
|
});
|
|
124
124
|
},
|
|
125
125
|
[E, c.tableNumber]
|
|
126
|
-
), ce = i(() => S ? `${d}× LEVEL${S}` :
|
|
127
|
-
A(e), G(e),
|
|
128
|
-
}, []), me = i(() =>
|
|
126
|
+
), ce = i(() => S ? `${d}× LEVEL${S}` : W ? He : d ? `${d}× Table` : $, [S, d, W, $]), ae = i((e) => {
|
|
127
|
+
A(e), G(e), P(!0);
|
|
128
|
+
}, []), me = i(() => P(!1), []), ue = i((e) => Q(e), []);
|
|
129
129
|
return be(Y, () => ({
|
|
130
|
-
labelRef:
|
|
131
|
-
segmentedCardWrapperRef:
|
|
132
|
-
infiniteButtonRef:
|
|
130
|
+
labelRef: V,
|
|
131
|
+
segmentedCardWrapperRef: B,
|
|
132
|
+
infiniteButtonRef: k,
|
|
133
133
|
startLabelAnimation: ae,
|
|
134
134
|
stopLabelAnimation: me,
|
|
135
135
|
setLabelVisiblity: ue,
|
|
136
136
|
handleTableSegmentClick: q,
|
|
137
|
-
goBackFromTableLevel:
|
|
137
|
+
goBackFromTableLevel: j
|
|
138
138
|
})), K(() => () => {
|
|
139
|
-
|
|
139
|
+
R.current && clearTimeout(R.current);
|
|
140
140
|
}, []), K(() => {
|
|
141
141
|
g && (a(), N(!0), h(g.tableNumber), p({ ...g }));
|
|
142
142
|
}, [g, a]), /* @__PURE__ */ t(
|
|
143
143
|
_e,
|
|
144
144
|
{
|
|
145
|
-
labelRef:
|
|
146
|
-
ref:
|
|
145
|
+
labelRef: V,
|
|
146
|
+
ref: B,
|
|
147
147
|
strokeColor: "WHITE",
|
|
148
148
|
label: ce(),
|
|
149
149
|
labelColor: F,
|
|
@@ -155,8 +155,8 @@ const je = {
|
|
|
155
155
|
$e,
|
|
156
156
|
{
|
|
157
157
|
onClick: le,
|
|
158
|
-
buttonRef:
|
|
159
|
-
onMouseLeave:
|
|
158
|
+
buttonRef: k,
|
|
159
|
+
onMouseLeave: U,
|
|
160
160
|
onMouseOver: te
|
|
161
161
|
}
|
|
162
162
|
),
|
|
@@ -171,15 +171,15 @@ const je = {
|
|
|
171
171
|
$zIndex: n + 1,
|
|
172
172
|
onClick: () => q(e),
|
|
173
173
|
onMouseOver: () => ee(e),
|
|
174
|
-
onMouseLeave:
|
|
174
|
+
onMouseLeave: U,
|
|
175
175
|
children: /* @__PURE__ */ m(ve, { $flexDirection: "row", $justifyContent: "center", $alignItems: "center", children: [
|
|
176
|
-
["sequence", "random", "advance"].map((
|
|
176
|
+
["sequence", "random", "advance"].map((H) => /* @__PURE__ */ t(
|
|
177
177
|
ye,
|
|
178
178
|
{
|
|
179
|
-
isStarAchieved: e.stars.includes(
|
|
180
|
-
rewardStar: !u && (r == null ? void 0 : r.tableNumber) === e.tableNumber ?
|
|
179
|
+
isStarAchieved: e.stars.includes(H),
|
|
180
|
+
rewardStar: !u && (r == null ? void 0 : r.tableNumber) === e.tableNumber ? _.includes(H) : void 0
|
|
181
181
|
},
|
|
182
|
-
|
|
182
|
+
H
|
|
183
183
|
)),
|
|
184
184
|
/* @__PURE__ */ t(Ne, { width: C * 0.055 }),
|
|
185
185
|
/* @__PURE__ */ t(xe, { $angle: -Z, children: /* @__PURE__ */ t(
|
|
@@ -200,7 +200,7 @@ const je = {
|
|
|
200
200
|
/* @__PURE__ */ m(qe, { animation: u ? "fade-in" : "fade-out", children: [
|
|
201
201
|
oe.map((e, n) => /* @__PURE__ */ m(he.Fragment, { children: [
|
|
202
202
|
/* @__PURE__ */ t(
|
|
203
|
-
|
|
203
|
+
Ue,
|
|
204
204
|
{
|
|
205
205
|
$top: e.semicirclePosiiionTop,
|
|
206
206
|
$left: e.semicirclePosiiionLeft,
|
|
@@ -220,18 +220,18 @@ const je = {
|
|
|
220
220
|
we,
|
|
221
221
|
{
|
|
222
222
|
tableNumber: e.tableNumber,
|
|
223
|
-
isStarAchieved: e.isStarAchieved,
|
|
223
|
+
isStarAchieved: e.isStarAchieved || _.includes(e.type),
|
|
224
224
|
type: e.type,
|
|
225
|
-
rewardStar:
|
|
225
|
+
rewardStar: _.includes(e.type)
|
|
226
226
|
}
|
|
227
227
|
)
|
|
228
228
|
}
|
|
229
229
|
)
|
|
230
230
|
] }, n)),
|
|
231
|
-
/* @__PURE__ */ t(X, { $top: 50, $left: 50, $alignCenter: !0, children: /* @__PURE__ */ t(
|
|
231
|
+
/* @__PURE__ */ t(X, { $top: 50, $left: 50, $alignCenter: !0, children: /* @__PURE__ */ t(je, { children: /* @__PURE__ */ t(
|
|
232
232
|
ge,
|
|
233
233
|
{
|
|
234
|
-
onClick:
|
|
234
|
+
onClick: j,
|
|
235
235
|
height: C * 0.1,
|
|
236
236
|
width: C * 0.1
|
|
237
237
|
}
|
|
@@ -241,8 +241,8 @@ const je = {
|
|
|
241
241
|
Le,
|
|
242
242
|
{
|
|
243
243
|
src: fe.TABLE_MODE_REVEAL,
|
|
244
|
-
ref:
|
|
245
|
-
settings:
|
|
244
|
+
ref: T,
|
|
245
|
+
settings: Me,
|
|
246
246
|
onRender: re,
|
|
247
247
|
animateOnIntersect: !0
|
|
248
248
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tables-card.js","sources":["../../../../../../src/features/circle-games/game-launcher/comps/tables-card/tables-card.tsx"],"sourcesContent":["import type { ILottieAnimationRef } from '../../../../ui/lottie-animation/types';\nimport type { TColorNames } from '../../../../ui/types';\nimport type {\n ITableInfo,\n TTableMode,\n} from '../../dal/use-get-circle-home-details-dal/use-get-circle-home-dal-types';\nimport type { ITableCardRef, ITablesCardProps } from './tables-card-types';\n\nimport React, {\n forwardRef,\n memo,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\n\nimport Back2Icon from '../../../../../assets/line-icons/icons/back2';\nimport { LOTTIE } from '../../../../../assets/lottie/lottie';\nimport { useUIContext } from '../../../../ui/context/context';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport Separator from '../../../../ui/separator/separator';\nimport Text from '../../../../ui/text/text';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport { GAME_LAUNCHER_ANALYTICS_EVENTS } from '../../game-launcher-analytics-events';\nimport { CardContainer } from '../card-container/card-container';\nimport { GAME_LAUNCHER_SIZE, GAME_LAUNCHER_SIZE_LARGE } from '../card-container/constants';\nimport { INFINITE_MODE_TEXT, TABLE_MODE_LABEL_COLOR, TABLE_REVEAL_ANIMATION } from './constants';\nimport InfiniteButtonCard from './infinite-button/infinite-mode-launcher-button';\nimport TableMode from './table-mode/table-mode';\nimport TableSegmentStar from './table-segment-star/table-segment-star';\nimport * as Styled from './tables-card-styled';\n\nconst modeRevealAnimationSettings = {\n loop: false,\n renderer: 'svg',\n};\n\nconst TablesCardComponent = forwardRef<ITableCardRef, ITablesCardProps>(\n (\n {\n data,\n label,\n onPress,\n openModesOfTable,\n defaultTable,\n onGoBackFromTableLevel,\n onPressTableSegment,\n },\n ref,\n ) => {\n const { onEvent: trackEvent } = useUIContext();\n const { playButtonSound } = useCircleSounds();\n const [fadeIn, setFadeIn] = useState(true);\n const [highlightedTable, setHighlightedTable] = useState<number | null>(\n openModesOfTable?.tableNumber ?? null,\n );\n const [highlightedLevel, setHighlightedLevel] = useState<number | null>(null);\n const [highlightedInfiniteModeText, setHighlightedInfiniteModeText] = useState<boolean>(false);\n const [labelColor, setLabelColor] = useState<TColorNames>('WHITE_T_60');\n const [revealTableModes, setRevealTableModes] = useState<ITableInfo>({\n stars:\n data.tableList.find(table => table.tableNumber === openModesOfTable?.tableNumber)?.stars ??\n [],\n tableNumber: openModesOfTable?.tableNumber ?? 0,\n });\n const infiniteButtonRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n const [showLabel, setShowLabel] = useState(true);\n const [isLabelAnimated, setIsLabelAnimated] = useState(false);\n const [animatedColor, setAniimatedColor] = useState<TColorNames>('WHITE_T_60');\n\n const labelRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n const cardRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n\n const [rewardStar, setRewardStar] = useState(openModesOfTable?.rewardStar ?? []);\n const revealAnimationRef = useRef<ILottieAnimationRef | null>(null);\n const disappearAnimationTimer = useRef<ReturnType<typeof setTimeout>>(\n undefined,\n ) as React.RefObject<ReturnType<typeof setTimeout> | undefined>;\n\n const handleTableSegmentClick = useCallback(\n (table: ITableInfo) => {\n if (onPressTableSegment) {\n onPressTableSegment(table);\n\n return;\n }\n playButtonSound();\n setFadeIn(true);\n setHighlightedTable(table.tableNumber);\n setRevealTableModes({ ...table });\n setRewardStar([]);\n trackEvent(GAME_LAUNCHER_ANALYTICS_EVENTS.TABLE_SELECTED, {\n meta: {\n table_of: table.tableNumber,\n },\n });\n },\n [onPressTableSegment, playButtonSound, trackEvent],\n );\n\n const handleTableSegmentMouseOver = useCallback(\n (table: ITableInfo) => {\n setLabelColor(isLabelAnimated ? animatedColor : 'WHITE_T_60');\n setHighlightedTable(table.tableNumber);\n },\n [animatedColor, isLabelAnimated],\n );\n\n const handleInfiniteModeSegmentMouseOver = useCallback(() => {\n setHighlightedInfiniteModeText(true);\n }, []);\n\n const handleTableSegmentMouseLeave = useCallback(() => {\n setLabelColor('WHITE_T_60');\n !revealTableModes.tableNumber && setHighlightedTable(null);\n setHighlightedInfiniteModeText(false);\n }, [revealTableModes.tableNumber]);\n\n const goBack = useCallback(() => {\n onGoBackFromTableLevel?.();\n playButtonSound();\n setFadeIn(false);\n setHighlightedTable(null);\n const time = (TABLE_REVEAL_ANIMATION.DISAPPEAR[1] - TABLE_REVEAL_ANIMATION.DISAPPEAR[0]) / 30;\n\n revealAnimationRef.current?.playSegments(TABLE_REVEAL_ANIMATION.DISAPPEAR, true);\n disappearAnimationTimer.current = setTimeout(() => {\n setRevealTableModes({ stars: [], tableNumber: 0 });\n }, time * 1000);\n }, [onGoBackFromTableLevel, playButtonSound]);\n\n const showTableModes = useCallback(() => {\n revealAnimationRef.current?.playSegments(TABLE_REVEAL_ANIMATION.REVEAL, true);\n }, []);\n\n const handleModeMouseOver = useCallback((type: TTableMode) => {\n const level: Partial<Record<TTableMode, number>> = {\n sequence: 1,\n random: 2,\n advance: 3,\n };\n\n setLabelColor(TABLE_MODE_LABEL_COLOR[type] ?? 'WHITE_T_60');\n setHighlightedLevel(level[type] ?? 0);\n }, []);\n\n const handleModeMouseLeave = useCallback(() => {\n setHighlightedLevel(null);\n setLabelColor('WHITE_T_60');\n }, []);\n\n const revealTableModesMemo = useMemo(() => revealTableModes, [revealTableModes]);\n\n const tableModes = useMemo(() => {\n return [\n {\n top: 20,\n left: 10.5,\n type: 'sequence' as TTableMode,\n tableNumber: revealTableModesMemo.tableNumber,\n isStarAchieved: revealTableModesMemo.stars.includes('sequence'),\n semicirclePosiiionTop: '-19%',\n semicirclePosiiionLeft: '-43%',\n semicircleHoverColor: '#B259004D',\n },\n {\n top: 20,\n left: 65.5,\n type: 'random' as TTableMode,\n tableNumber: revealTableModesMemo.tableNumber,\n isStarAchieved: revealTableModesMemo.stars.includes('random'),\n semicirclePosiiionTop: '-19%',\n semicirclePosiiionLeft: '65%',\n semicircleHoverColor: '#0055CC4D',\n },\n {\n top: 66,\n left: 38,\n type: 'advance' as TTableMode,\n tableNumber: revealTableModesMemo.tableNumber,\n isStarAchieved: revealTableModesMemo.stars.includes('advance'),\n semicirclePosiiionTop: '74%',\n semicirclePosiiionLeft: '11%',\n semicircleHoverColor: '#A9099C4D',\n },\n ];\n }, [revealTableModesMemo.tableNumber, revealTableModesMemo.stars]);\n\n // Disabled infinite mode\n const handleInfiniteModeClick = useCallback(() => {\n onPress({\n mode: 'infinite',\n infiniteModeHighScore: data.infiniteModeHighScore,\n });\n }, [onPress, data.infiniteModeHighScore]);\n\n const handleNormalModeClick = useCallback(\n (mode: TTableMode, isStarRewarded: boolean) => {\n onPress({\n mode,\n tableNumber: revealTableModes.tableNumber,\n isStarRewarded,\n });\n },\n [onPress, revealTableModes.tableNumber],\n );\n\n const getHighlightedText = useCallback(() => {\n if (highlightedLevel) {\n return `${highlightedTable}× LEVEL${highlightedLevel}`;\n }\n\n if (highlightedInfiniteModeText) {\n return INFINITE_MODE_TEXT;\n }\n\n return highlightedTable ? `${highlightedTable}× Table` : label;\n }, [highlightedLevel, highlightedTable, highlightedInfiniteModeText, label]);\n\n const startLabelAnimation = useCallback((color: TColorNames) => {\n setLabelColor(color);\n setAniimatedColor(color);\n setIsLabelAnimated(true);\n }, []);\n\n const stopLabelAnimation = useCallback(() => setIsLabelAnimated(false), []);\n const setLabelVisiblity = useCallback((visible: boolean) => setShowLabel(visible), []);\n\n useImperativeHandle(ref, () => ({\n labelRef: labelRef,\n segmentedCardWrapperRef: cardRef,\n infiniteButtonRef: infiniteButtonRef,\n startLabelAnimation,\n stopLabelAnimation,\n setLabelVisiblity,\n handleTableSegmentClick,\n goBackFromTableLevel: goBack,\n }));\n\n useEffect(() => {\n return () => {\n disappearAnimationTimer.current && clearTimeout(disappearAnimationTimer.current);\n };\n }, []);\n\n // Used in trial journey, to open table levels by default if given in props\n useEffect(() => {\n if (defaultTable) {\n playButtonSound();\n setFadeIn(true);\n setHighlightedTable(defaultTable.tableNumber);\n setRevealTableModes({ ...defaultTable });\n }\n }, [defaultTable, playButtonSound]);\n\n return (\n <CardContainer\n labelRef={labelRef}\n ref={cardRef}\n strokeColor=\"WHITE\"\n label={getHighlightedText()}\n labelColor={labelColor}\n isAnimated={isLabelAnimated}\n showLabel={showLabel}\n >\n <Styled.CardWrapper>\n {/* table selection */}\n <Styled.TableSegmentsWrapper>\n {/* infinite button */}\n <InfiniteButtonCard\n onClick={handleInfiniteModeClick}\n buttonRef={infiniteButtonRef}\n onMouseLeave={handleTableSegmentMouseLeave}\n onMouseOver={handleInfiniteModeSegmentMouseOver}\n />\n {/* card shadow */}\n <Styled.TableSegmentCardShadowContainer />\n\n {/* table segments */}\n {data.tableList.map((table, index) => {\n const segmentAngle = 360 / data.tableList.length;\n const startAngle = -(90 + 360 / (2 * data.tableList.length));\n const currentAngle = startAngle + segmentAngle * (index + 1);\n\n return (\n <Styled.TableSegment\n key={index}\n $angle={currentAngle}\n $totalSegments={data.tableList.length}\n $zIndex={index + 1}\n onClick={() => handleTableSegmentClick(table)}\n onMouseOver={() => handleTableSegmentMouseOver(table)}\n onMouseLeave={handleTableSegmentMouseLeave}\n >\n <FlexView $flexDirection=\"row\" $justifyContent=\"center\" $alignItems=\"center\">\n {['sequence', 'random', 'advance'].map(star => (\n <TableSegmentStar\n key={star}\n isStarAchieved={table.stars.includes(star as TTableMode)}\n rewardStar={\n !fadeIn && openModesOfTable?.tableNumber === table.tableNumber\n ? rewardStar.includes(star as TTableMode)\n : undefined\n }\n />\n ))}\n <Separator width={GAME_LAUNCHER_SIZE * 0.055} />\n\n <Styled.TableNumber $angle={-currentAngle}>\n <Text\n $renderAs={\n GAME_LAUNCHER_SIZE === GAME_LAUNCHER_SIZE_LARGE\n ? 'ac3-black'\n : 'ac4-black'\n }\n $color={highlightedTable === table.tableNumber ? 'BLACK_1' : 'WHITE'}\n >\n {table.tableNumber}\n </Text>\n </Styled.TableNumber>\n </FlexView>\n </Styled.TableSegment>\n );\n })}\n </Styled.TableSegmentsWrapper>\n\n {/* table modes */}\n {revealTableModes.tableNumber > 0 && (\n <Styled.TableModeContainer>\n <Styled.TableModeWrapper>\n {/* tables modes with back button */}\n <Styled.AnimatedView animation={fadeIn ? 'fade-in' : 'fade-out'}>\n {tableModes.map((tableMode, index) => (\n <React.Fragment key={index}>\n <Styled.ModeOverlay\n $top={tableMode.semicirclePosiiionTop}\n $left={tableMode.semicirclePosiiionLeft}\n $hoverColor={tableMode.semicircleHoverColor}\n onClick={() =>\n fadeIn\n ? handleNormalModeClick(tableMode.type, tableMode.isStarAchieved)\n : undefined\n }\n onMouseOver={() =>\n fadeIn ? handleModeMouseOver(tableMode.type as TTableMode) : undefined\n }\n onMouseLeave={fadeIn ? handleModeMouseLeave : undefined}\n />\n <Styled.AbsoluteView\n $top={tableMode.top}\n $left={tableMode.left}\n $isPointerEventsNone={true}\n >\n <TableMode\n tableNumber={tableMode.tableNumber}\n isStarAchieved={tableMode.isStarAchieved}\n type={tableMode.type as TTableMode}\n rewardStar={rewardStar.includes(tableMode.type as TTableMode)}\n />\n </Styled.AbsoluteView>\n </React.Fragment>\n ))}\n {/* back button */}\n <Styled.AbsoluteView $top={50} $left={50} $alignCenter={true}>\n <Styled.IconWrapper>\n <Back2Icon\n onClick={goBack}\n height={GAME_LAUNCHER_SIZE * 0.1}\n width={GAME_LAUNCHER_SIZE * 0.1}\n />\n </Styled.IconWrapper>\n </Styled.AbsoluteView>\n </Styled.AnimatedView>\n\n {/* overlay lottie for modes */}\n <LottieAnimation\n src={LOTTIE.TABLE_MODE_REVEAL}\n ref={revealAnimationRef}\n settings={modeRevealAnimationSettings}\n onRender={showTableModes}\n animateOnIntersect\n />\n </Styled.TableModeWrapper>\n </Styled.TableModeContainer>\n )}\n </Styled.CardWrapper>\n </CardContainer>\n );\n },\n);\n\nexport const TablesCard = memo(TablesCardComponent);\n"],"names":["modeRevealAnimationSettings","TablesCardComponent","forwardRef","data","label","onPress","openModesOfTable","defaultTable","onGoBackFromTableLevel","onPressTableSegment","ref","trackEvent","useUIContext","playButtonSound","useCircleSounds","fadeIn","setFadeIn","useState","highlightedTable","setHighlightedTable","highlightedLevel","setHighlightedLevel","highlightedInfiniteModeText","setHighlightedInfiniteModeText","labelColor","setLabelColor","revealTableModes","setRevealTableModes","_a","table","infiniteButtonRef","useRef","showLabel","setShowLabel","isLabelAnimated","setIsLabelAnimated","animatedColor","setAniimatedColor","labelRef","cardRef","rewardStar","setRewardStar","revealAnimationRef","disappearAnimationTimer","handleTableSegmentClick","useCallback","GAME_LAUNCHER_ANALYTICS_EVENTS","handleTableSegmentMouseOver","handleInfiniteModeSegmentMouseOver","handleTableSegmentMouseLeave","goBack","time","TABLE_REVEAL_ANIMATION","showTableModes","handleModeMouseOver","type","level","TABLE_MODE_LABEL_COLOR","handleModeMouseLeave","revealTableModesMemo","useMemo","tableModes","handleInfiniteModeClick","handleNormalModeClick","mode","isStarRewarded","getHighlightedText","INFINITE_MODE_TEXT","startLabelAnimation","color","stopLabelAnimation","setLabelVisiblity","visible","useImperativeHandle","useEffect","jsx","CardContainer","jsxs","Styled.CardWrapper","Styled.TableSegmentsWrapper","InfiniteButtonCard","Styled.TableSegmentCardShadowContainer","index","segmentAngle","currentAngle","Styled.TableSegment","FlexView","star","TableSegmentStar","Separator","GAME_LAUNCHER_SIZE","Styled.TableNumber","Text","GAME_LAUNCHER_SIZE_LARGE","Styled.TableModeContainer","Styled.TableModeWrapper","Styled.AnimatedView","tableMode","React","Styled.ModeOverlay","Styled.AbsoluteView","TableMode","Styled.IconWrapper","Back2Icon","LottieAnimation","LOTTIE","TablesCard","memo"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"tables-card.js","sources":["../../../../../../src/features/circle-games/game-launcher/comps/tables-card/tables-card.tsx"],"sourcesContent":["import type { ILottieAnimationRef } from '../../../../ui/lottie-animation/types';\nimport type { TColorNames } from '../../../../ui/types';\nimport type {\n ITableInfo,\n TTableMode,\n} from '../../dal/use-get-circle-home-details-dal/use-get-circle-home-dal-types';\nimport type { ITableCardRef, ITablesCardProps } from './tables-card-types';\n\nimport React, {\n forwardRef,\n memo,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\n\nimport Back2Icon from '../../../../../assets/line-icons/icons/back2';\nimport { LOTTIE } from '../../../../../assets/lottie/lottie';\nimport { useUIContext } from '../../../../ui/context/context';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport Separator from '../../../../ui/separator/separator';\nimport Text from '../../../../ui/text/text';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport { GAME_LAUNCHER_ANALYTICS_EVENTS } from '../../game-launcher-analytics-events';\nimport { CardContainer } from '../card-container/card-container';\nimport { GAME_LAUNCHER_SIZE, GAME_LAUNCHER_SIZE_LARGE } from '../card-container/constants';\nimport { INFINITE_MODE_TEXT, TABLE_MODE_LABEL_COLOR, TABLE_REVEAL_ANIMATION } from './constants';\nimport InfiniteButtonCard from './infinite-button/infinite-mode-launcher-button';\nimport TableMode from './table-mode/table-mode';\nimport TableSegmentStar from './table-segment-star/table-segment-star';\nimport * as Styled from './tables-card-styled';\n\nconst modeRevealAnimationSettings = {\n loop: false,\n renderer: 'svg',\n};\n\nconst TablesCardComponent = forwardRef<ITableCardRef, ITablesCardProps>(\n (\n {\n data,\n label,\n onPress,\n openModesOfTable,\n defaultTable,\n onGoBackFromTableLevel,\n onPressTableSegment,\n },\n ref,\n ) => {\n const { onEvent: trackEvent } = useUIContext();\n const { playButtonSound } = useCircleSounds();\n const [fadeIn, setFadeIn] = useState(true);\n const [highlightedTable, setHighlightedTable] = useState<number | null>(\n openModesOfTable?.tableNumber ?? null,\n );\n const [highlightedLevel, setHighlightedLevel] = useState<number | null>(null);\n const [highlightedInfiniteModeText, setHighlightedInfiniteModeText] = useState<boolean>(false);\n const [labelColor, setLabelColor] = useState<TColorNames>('WHITE_T_60');\n const [revealTableModes, setRevealTableModes] = useState<ITableInfo>({\n stars:\n data.tableList.find(table => table.tableNumber === openModesOfTable?.tableNumber)?.stars ??\n [],\n tableNumber: openModesOfTable?.tableNumber ?? 0,\n });\n const infiniteButtonRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n const [showLabel, setShowLabel] = useState(true);\n const [isLabelAnimated, setIsLabelAnimated] = useState(false);\n const [animatedColor, setAniimatedColor] = useState<TColorNames>('WHITE_T_60');\n\n const labelRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n const cardRef = useRef<HTMLDivElement>(null) as React.RefObject<HTMLDivElement>;\n\n const [rewardStar, setRewardStar] = useState(openModesOfTable?.rewardStar ?? []);\n const revealAnimationRef = useRef<ILottieAnimationRef | null>(null);\n const disappearAnimationTimer = useRef<ReturnType<typeof setTimeout>>(\n undefined,\n ) as React.RefObject<ReturnType<typeof setTimeout> | undefined>;\n\n const handleTableSegmentClick = useCallback(\n (table: ITableInfo) => {\n if (onPressTableSegment) {\n onPressTableSegment(table);\n\n return;\n }\n playButtonSound();\n setFadeIn(true);\n setHighlightedTable(table.tableNumber);\n setRevealTableModes({ ...table });\n setRewardStar([]);\n trackEvent(GAME_LAUNCHER_ANALYTICS_EVENTS.TABLE_SELECTED, {\n meta: {\n table_of: table.tableNumber,\n },\n });\n },\n [onPressTableSegment, playButtonSound, trackEvent],\n );\n\n const handleTableSegmentMouseOver = useCallback(\n (table: ITableInfo) => {\n setLabelColor(isLabelAnimated ? animatedColor : 'WHITE_T_60');\n setHighlightedTable(table.tableNumber);\n },\n [animatedColor, isLabelAnimated],\n );\n\n const handleInfiniteModeSegmentMouseOver = useCallback(() => {\n setHighlightedInfiniteModeText(true);\n }, []);\n\n const handleTableSegmentMouseLeave = useCallback(() => {\n setLabelColor('WHITE_T_60');\n !revealTableModes.tableNumber && setHighlightedTable(null);\n setHighlightedInfiniteModeText(false);\n }, [revealTableModes.tableNumber]);\n\n const goBack = useCallback(() => {\n onGoBackFromTableLevel?.();\n playButtonSound();\n setFadeIn(false);\n setHighlightedTable(null);\n const time = (TABLE_REVEAL_ANIMATION.DISAPPEAR[1] - TABLE_REVEAL_ANIMATION.DISAPPEAR[0]) / 30;\n\n revealAnimationRef.current?.playSegments(TABLE_REVEAL_ANIMATION.DISAPPEAR, true);\n disappearAnimationTimer.current = setTimeout(() => {\n setRevealTableModes({ stars: [], tableNumber: 0 });\n }, time * 1000);\n }, [onGoBackFromTableLevel, playButtonSound]);\n\n const showTableModes = useCallback(() => {\n revealAnimationRef.current?.playSegments(TABLE_REVEAL_ANIMATION.REVEAL, true);\n }, []);\n\n const handleModeMouseOver = useCallback((type: TTableMode) => {\n const level: Partial<Record<TTableMode, number>> = {\n sequence: 1,\n random: 2,\n advance: 3,\n };\n\n setLabelColor(TABLE_MODE_LABEL_COLOR[type] ?? 'WHITE_T_60');\n setHighlightedLevel(level[type] ?? 0);\n }, []);\n\n const handleModeMouseLeave = useCallback(() => {\n setHighlightedLevel(null);\n setLabelColor('WHITE_T_60');\n }, []);\n\n const revealTableModesMemo = useMemo(() => revealTableModes, [revealTableModes]);\n\n const tableModes = useMemo(() => {\n return [\n {\n top: 20,\n left: 10.5,\n type: 'sequence' as TTableMode,\n tableNumber: revealTableModesMemo.tableNumber,\n isStarAchieved: revealTableModesMemo.stars.includes('sequence'),\n semicirclePosiiionTop: '-19%',\n semicirclePosiiionLeft: '-43%',\n semicircleHoverColor: '#B259004D',\n },\n {\n top: 20,\n left: 65.5,\n type: 'random' as TTableMode,\n tableNumber: revealTableModesMemo.tableNumber,\n isStarAchieved: revealTableModesMemo.stars.includes('random'),\n semicirclePosiiionTop: '-19%',\n semicirclePosiiionLeft: '65%',\n semicircleHoverColor: '#0055CC4D',\n },\n {\n top: 66,\n left: 38,\n type: 'advance' as TTableMode,\n tableNumber: revealTableModesMemo.tableNumber,\n isStarAchieved: revealTableModesMemo.stars.includes('advance'),\n semicirclePosiiionTop: '74%',\n semicirclePosiiionLeft: '11%',\n semicircleHoverColor: '#A9099C4D',\n },\n ];\n }, [revealTableModesMemo.tableNumber, revealTableModesMemo.stars]);\n\n // Disabled infinite mode\n const handleInfiniteModeClick = useCallback(() => {\n onPress({\n mode: 'infinite',\n infiniteModeHighScore: data.infiniteModeHighScore,\n });\n }, [onPress, data.infiniteModeHighScore]);\n\n const handleNormalModeClick = useCallback(\n (mode: TTableMode, isStarRewarded: boolean) => {\n onPress({\n mode,\n tableNumber: revealTableModes.tableNumber,\n isStarRewarded,\n });\n },\n [onPress, revealTableModes.tableNumber],\n );\n\n const getHighlightedText = useCallback(() => {\n if (highlightedLevel) {\n return `${highlightedTable}× LEVEL${highlightedLevel}`;\n }\n\n if (highlightedInfiniteModeText) {\n return INFINITE_MODE_TEXT;\n }\n\n return highlightedTable ? `${highlightedTable}× Table` : label;\n }, [highlightedLevel, highlightedTable, highlightedInfiniteModeText, label]);\n\n const startLabelAnimation = useCallback((color: TColorNames) => {\n setLabelColor(color);\n setAniimatedColor(color);\n setIsLabelAnimated(true);\n }, []);\n\n const stopLabelAnimation = useCallback(() => setIsLabelAnimated(false), []);\n const setLabelVisiblity = useCallback((visible: boolean) => setShowLabel(visible), []);\n\n useImperativeHandle(ref, () => ({\n labelRef: labelRef,\n segmentedCardWrapperRef: cardRef,\n infiniteButtonRef: infiniteButtonRef,\n startLabelAnimation,\n stopLabelAnimation,\n setLabelVisiblity,\n handleTableSegmentClick,\n goBackFromTableLevel: goBack,\n }));\n\n useEffect(() => {\n return () => {\n disappearAnimationTimer.current && clearTimeout(disappearAnimationTimer.current);\n };\n }, []);\n\n // Used in trial journey, to open table levels by default if given in props\n useEffect(() => {\n if (defaultTable) {\n playButtonSound();\n setFadeIn(true);\n setHighlightedTable(defaultTable.tableNumber);\n setRevealTableModes({ ...defaultTable });\n }\n }, [defaultTable, playButtonSound]);\n\n return (\n <CardContainer\n labelRef={labelRef}\n ref={cardRef}\n strokeColor=\"WHITE\"\n label={getHighlightedText()}\n labelColor={labelColor}\n isAnimated={isLabelAnimated}\n showLabel={showLabel}\n >\n <Styled.CardWrapper>\n {/* table selection */}\n <Styled.TableSegmentsWrapper>\n {/* infinite button */}\n <InfiniteButtonCard\n onClick={handleInfiniteModeClick}\n buttonRef={infiniteButtonRef}\n onMouseLeave={handleTableSegmentMouseLeave}\n onMouseOver={handleInfiniteModeSegmentMouseOver}\n />\n {/* card shadow */}\n <Styled.TableSegmentCardShadowContainer />\n\n {/* table segments */}\n {data.tableList.map((table, index) => {\n const segmentAngle = 360 / data.tableList.length;\n const startAngle = -(90 + 360 / (2 * data.tableList.length));\n const currentAngle = startAngle + segmentAngle * (index + 1);\n\n return (\n <Styled.TableSegment\n key={index}\n $angle={currentAngle}\n $totalSegments={data.tableList.length}\n $zIndex={index + 1}\n onClick={() => handleTableSegmentClick(table)}\n onMouseOver={() => handleTableSegmentMouseOver(table)}\n onMouseLeave={handleTableSegmentMouseLeave}\n >\n <FlexView $flexDirection=\"row\" $justifyContent=\"center\" $alignItems=\"center\">\n {['sequence', 'random', 'advance'].map(star => (\n <TableSegmentStar\n key={star}\n isStarAchieved={table.stars.includes(star as TTableMode)}\n rewardStar={\n !fadeIn && openModesOfTable?.tableNumber === table.tableNumber\n ? rewardStar.includes(star as TTableMode)\n : undefined\n }\n />\n ))}\n <Separator width={GAME_LAUNCHER_SIZE * 0.055} />\n\n <Styled.TableNumber $angle={-currentAngle}>\n <Text\n $renderAs={\n GAME_LAUNCHER_SIZE === GAME_LAUNCHER_SIZE_LARGE\n ? 'ac3-black'\n : 'ac4-black'\n }\n $color={highlightedTable === table.tableNumber ? 'BLACK_1' : 'WHITE'}\n >\n {table.tableNumber}\n </Text>\n </Styled.TableNumber>\n </FlexView>\n </Styled.TableSegment>\n );\n })}\n </Styled.TableSegmentsWrapper>\n\n {/* table modes */}\n {revealTableModes.tableNumber > 0 && (\n <Styled.TableModeContainer>\n <Styled.TableModeWrapper>\n {/* tables modes with back button */}\n <Styled.AnimatedView animation={fadeIn ? 'fade-in' : 'fade-out'}>\n {tableModes.map((tableMode, index) => (\n <React.Fragment key={index}>\n <Styled.ModeOverlay\n $top={tableMode.semicirclePosiiionTop}\n $left={tableMode.semicirclePosiiionLeft}\n $hoverColor={tableMode.semicircleHoverColor}\n onClick={() =>\n fadeIn\n ? handleNormalModeClick(tableMode.type, tableMode.isStarAchieved)\n : undefined\n }\n onMouseOver={() =>\n fadeIn ? handleModeMouseOver(tableMode.type as TTableMode) : undefined\n }\n onMouseLeave={fadeIn ? handleModeMouseLeave : undefined}\n />\n <Styled.AbsoluteView\n $top={tableMode.top}\n $left={tableMode.left}\n $isPointerEventsNone={true}\n >\n <TableMode\n tableNumber={tableMode.tableNumber}\n isStarAchieved={\n tableMode.isStarAchieved || rewardStar.includes(tableMode.type)\n }\n type={tableMode.type as TTableMode}\n rewardStar={rewardStar.includes(tableMode.type as TTableMode)}\n />\n </Styled.AbsoluteView>\n </React.Fragment>\n ))}\n {/* back button */}\n <Styled.AbsoluteView $top={50} $left={50} $alignCenter={true}>\n <Styled.IconWrapper>\n <Back2Icon\n onClick={goBack}\n height={GAME_LAUNCHER_SIZE * 0.1}\n width={GAME_LAUNCHER_SIZE * 0.1}\n />\n </Styled.IconWrapper>\n </Styled.AbsoluteView>\n </Styled.AnimatedView>\n\n {/* overlay lottie for modes */}\n <LottieAnimation\n src={LOTTIE.TABLE_MODE_REVEAL}\n ref={revealAnimationRef}\n settings={modeRevealAnimationSettings}\n onRender={showTableModes}\n animateOnIntersect\n />\n </Styled.TableModeWrapper>\n </Styled.TableModeContainer>\n )}\n </Styled.CardWrapper>\n </CardContainer>\n );\n },\n);\n\nexport const TablesCard = memo(TablesCardComponent);\n"],"names":["modeRevealAnimationSettings","TablesCardComponent","forwardRef","data","label","onPress","openModesOfTable","defaultTable","onGoBackFromTableLevel","onPressTableSegment","ref","trackEvent","useUIContext","playButtonSound","useCircleSounds","fadeIn","setFadeIn","useState","highlightedTable","setHighlightedTable","highlightedLevel","setHighlightedLevel","highlightedInfiniteModeText","setHighlightedInfiniteModeText","labelColor","setLabelColor","revealTableModes","setRevealTableModes","_a","table","infiniteButtonRef","useRef","showLabel","setShowLabel","isLabelAnimated","setIsLabelAnimated","animatedColor","setAniimatedColor","labelRef","cardRef","rewardStar","setRewardStar","revealAnimationRef","disappearAnimationTimer","handleTableSegmentClick","useCallback","GAME_LAUNCHER_ANALYTICS_EVENTS","handleTableSegmentMouseOver","handleInfiniteModeSegmentMouseOver","handleTableSegmentMouseLeave","goBack","time","TABLE_REVEAL_ANIMATION","showTableModes","handleModeMouseOver","type","level","TABLE_MODE_LABEL_COLOR","handleModeMouseLeave","revealTableModesMemo","useMemo","tableModes","handleInfiniteModeClick","handleNormalModeClick","mode","isStarRewarded","getHighlightedText","INFINITE_MODE_TEXT","startLabelAnimation","color","stopLabelAnimation","setLabelVisiblity","visible","useImperativeHandle","useEffect","jsx","CardContainer","jsxs","Styled.CardWrapper","Styled.TableSegmentsWrapper","InfiniteButtonCard","Styled.TableSegmentCardShadowContainer","index","segmentAngle","currentAngle","Styled.TableSegment","FlexView","star","TableSegmentStar","Separator","GAME_LAUNCHER_SIZE","Styled.TableNumber","Text","GAME_LAUNCHER_SIZE_LARGE","Styled.TableModeContainer","Styled.TableModeWrapper","Styled.AnimatedView","tableMode","React","Styled.ModeOverlay","Styled.AbsoluteView","TableMode","Styled.IconWrapper","Back2Icon","LottieAnimation","LOTTIE","TablesCard","memo"],"mappings":"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"}
|
|
@@ -1,22 +1,21 @@
|
|
|
1
|
-
import { useState as
|
|
2
|
-
import {
|
|
3
|
-
const
|
|
4
|
-
const [
|
|
1
|
+
import { useState as n, useEffect as r } from "react";
|
|
2
|
+
import { getDeviceType as c } from "../../utils/media.js";
|
|
3
|
+
const d = () => {
|
|
4
|
+
const [s, o] = n(() => window.innerWidth);
|
|
5
5
|
r(() => {
|
|
6
|
-
function
|
|
7
|
-
|
|
8
|
-
o(n);
|
|
6
|
+
function i() {
|
|
7
|
+
o(window.innerWidth);
|
|
9
8
|
}
|
|
10
|
-
return window.addEventListener("resize",
|
|
9
|
+
return window.addEventListener("resize", i), () => window.removeEventListener("resize", i);
|
|
11
10
|
}, []);
|
|
12
|
-
const s = e === "mobile";
|
|
11
|
+
const e = c(s), t = e === "mobile";
|
|
13
12
|
return {
|
|
14
|
-
isMobile:
|
|
15
|
-
isCompact:
|
|
16
|
-
isDesktop: e === "
|
|
13
|
+
isMobile: t,
|
|
14
|
+
isCompact: t || e === "tablet",
|
|
15
|
+
isDesktop: e === "desktop" || e === "large" || e === "xl"
|
|
17
16
|
};
|
|
18
|
-
},
|
|
17
|
+
}, f = d;
|
|
19
18
|
export {
|
|
20
|
-
|
|
19
|
+
f as default
|
|
21
20
|
};
|
|
22
21
|
//# sourceMappingURL=use-viewport.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-viewport.js","sources":["../../../../src/features/hooks/use-viewport/use-viewport.ts"],"sourcesContent":["import type { IUseViewportReturn } from './use-viewport-types';\n\nimport { useEffect, useState } from 'react';\n\nimport {
|
|
1
|
+
{"version":3,"file":"use-viewport.js","sources":["../../../../src/features/hooks/use-viewport/use-viewport.ts"],"sourcesContent":["import type { IUseViewportReturn } from './use-viewport-types';\n\nimport { useEffect, useState } from 'react';\n\nimport { getDeviceType } from '../../utils/media';\n\nconst useViewport = (): IUseViewportReturn => {\n const [width, setWidth] = useState(() => window.innerWidth);\n\n useEffect(() => {\n function handleResize() {\n setWidth(window.innerWidth);\n }\n\n window.addEventListener('resize', handleResize);\n\n return () => window.removeEventListener('resize', handleResize);\n }, []);\n\n const deviceType = getDeviceType(width);\n const isMobile = deviceType === 'mobile';\n const isTablet = deviceType === 'tablet';\n const isDesktop = deviceType === 'desktop';\n const isLarge = deviceType === 'large';\n const isXL = deviceType === 'xl';\n\n return {\n isMobile: isMobile,\n isCompact: isMobile || isTablet,\n isDesktop: isDesktop || isLarge || isXL,\n };\n};\n\nexport default useViewport;\n"],"names":["useViewport","width","setWidth","useState","useEffect","handleResize","deviceType","getDeviceType","isMobile","useViewport$1"],"mappings":";;AAMA,MAAMA,IAAc,MAA0B;AAC5C,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAAS,MAAM,OAAO,UAAU;AAE1D,EAAAC,EAAU,MAAM;AACd,aAASC,IAAe;AACtB,MAAAH,EAAS,OAAO,UAAU;AAAA,IAC5B;AAEO,kBAAA,iBAAiB,UAAUG,CAAY,GAEvC,MAAM,OAAO,oBAAoB,UAAUA,CAAY;AAAA,EAChE,GAAG,CAAE,CAAA;AAEC,QAAAC,IAAaC,EAAcN,CAAK,GAChCO,IAAWF,MAAe;AAMzB,SAAA;AAAA,IACL,UAAAE;AAAA,IACA,WAAWA,KAPIF,MAAe;AAAA,IAQ9B,WAPgBA,MAAe,aACjBA,MAAe,WAClBA,MAAe;AAAA,EAKS;AAEvC,GAEAG,IAAeT;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"device.js","sources":["../../../../src/features/ui/theme/device.ts"],"sourcesContent":["import type { TSupportedDevices } from '../types';\n\nexport const getDeviceConfig = (): TSupportedDevices => {\n const MOBILE_WIDTH = 600;\n\n return window.innerWidth <= MOBILE_WIDTH ? 'mobile' : 'desktop';\n};\n"],"names":["getDeviceConfig"],"mappings":"AAEO,MAAMA,IAAkB,MAGtB,OAAO,cAAc,MAAe,WAAW;"}
|
|
@@ -1,34 +1,32 @@
|
|
|
1
1
|
import r from "./arrow-tooltip.js";
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import {
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
import
|
|
9
|
-
import
|
|
10
|
-
import
|
|
11
|
-
import
|
|
12
|
-
|
|
13
|
-
const
|
|
14
|
-
const t = u(), { gutter: o, deviceWidth: e } = t;
|
|
2
|
+
import e from "./button.js";
|
|
3
|
+
import i from "./checkbox.js";
|
|
4
|
+
import m, { hues as g } from "./clrs.js";
|
|
5
|
+
import { getDeviceConfig as n } from "./device.js";
|
|
6
|
+
import f from "./input.js";
|
|
7
|
+
import p from "./layout.js";
|
|
8
|
+
import u from "./tab.js";
|
|
9
|
+
import C from "./text.js";
|
|
10
|
+
import c from "./text-button.js";
|
|
11
|
+
import { getZIndexConfig as x } from "./z-index.js";
|
|
12
|
+
const v = () => {
|
|
13
|
+
const t = p(), { gutter: o } = t;
|
|
15
14
|
return {
|
|
16
15
|
arrowTooltip: r(),
|
|
17
|
-
button:
|
|
18
|
-
colors:
|
|
19
|
-
hues:
|
|
20
|
-
input:
|
|
21
|
-
checkbox:
|
|
16
|
+
button: e(o),
|
|
17
|
+
colors: m(),
|
|
18
|
+
hues: g,
|
|
19
|
+
input: f(o),
|
|
20
|
+
checkbox: i(o),
|
|
22
21
|
layout: t,
|
|
23
|
-
tab:
|
|
24
|
-
text:
|
|
25
|
-
textButton:
|
|
26
|
-
zIndex:
|
|
27
|
-
device: n(
|
|
28
|
-
mediaQueries: c()
|
|
22
|
+
tab: u(t.gutter),
|
|
23
|
+
text: C(),
|
|
24
|
+
textButton: c(),
|
|
25
|
+
zIndex: x(),
|
|
26
|
+
device: n()
|
|
29
27
|
};
|
|
30
28
|
};
|
|
31
29
|
export {
|
|
32
|
-
|
|
30
|
+
v as getTheme
|
|
33
31
|
};
|
|
34
32
|
//# sourceMappingURL=get-theme.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-theme.js","sources":["../../../../src/features/ui/theme/get-theme.ts"],"sourcesContent":["import type { DefaultTheme } from 'styled-components';\n\nimport getArrowTooltipConfig from './arrow-tooltip';\nimport getButtonConfig from './button';\nimport getCheckboxConfig from './checkbox';\nimport getColors, { hues } from './clrs';\nimport {
|
|
1
|
+
{"version":3,"file":"get-theme.js","sources":["../../../../src/features/ui/theme/get-theme.ts"],"sourcesContent":["import type { DefaultTheme } from 'styled-components';\n\nimport getArrowTooltipConfig from './arrow-tooltip';\nimport getButtonConfig from './button';\nimport getCheckboxConfig from './checkbox';\nimport getColors, { hues } from './clrs';\nimport { getDeviceConfig } from './device';\nimport getInputConfig from './input';\nimport getLayout from './layout';\nimport getTabConfig from './tab';\nimport getTextTypes from './text';\nimport getTextButtonConfig from './text-button';\nimport { getZIndexConfig } from './z-index';\n\nconst getTheme: () => DefaultTheme = () => {\n const layout = getLayout();\n const { gutter } = layout;\n\n return {\n arrowTooltip: getArrowTooltipConfig(),\n button: getButtonConfig(gutter),\n colors: getColors(),\n hues: hues,\n input: getInputConfig(gutter),\n checkbox: getCheckboxConfig(gutter),\n layout,\n tab: getTabConfig(layout.gutter),\n text: getTextTypes(),\n textButton: getTextButtonConfig(),\n zIndex: getZIndexConfig(),\n device: getDeviceConfig(),\n };\n};\n\nexport { getTheme };\n"],"names":["getTheme","layout","getLayout","gutter","getArrowTooltipConfig","getButtonConfig","getColors","hues","getInputConfig","getCheckboxConfig","getTabConfig","getTextTypes","getTextButtonConfig","getZIndexConfig","getDeviceConfig"],"mappings":";;;;;;;;;;;AAcA,MAAMA,IAA+B,MAAM;AACzC,QAAMC,IAASC,KACT,EAAE,QAAAC,EAAW,IAAAF;AAEZ,SAAA;AAAA,IACL,cAAcG,EAAsB;AAAA,IACpC,QAAQC,EAAgBF,CAAM;AAAA,IAC9B,QAAQG,EAAU;AAAA,IAClB,MAAAC;AAAA,IACA,OAAOC,EAAeL,CAAM;AAAA,IAC5B,UAAUM,EAAkBN,CAAM;AAAA,IAClC,QAAAF;AAAA,IACA,KAAKS,EAAaT,EAAO,MAAM;AAAA,IAC/B,MAAMU,EAAa;AAAA,IACnB,YAAYC,EAAoB;AAAA,IAChC,QAAQC,EAAgB;AAAA,IACxB,QAAQC,EAAgB;AAAA,EAAA;AAE5B;"}
|
|
@@ -1,12 +1,9 @@
|
|
|
1
|
-
function
|
|
2
|
-
const e = window.innerWidth, i = window.innerHeight;
|
|
1
|
+
function e(t = 1) {
|
|
3
2
|
return {
|
|
4
|
-
gutter: 16 * t
|
|
5
|
-
deviceWidth: e,
|
|
6
|
-
deviceHeight: i
|
|
3
|
+
gutter: 16 * t
|
|
7
4
|
};
|
|
8
5
|
}
|
|
9
6
|
export {
|
|
10
|
-
|
|
7
|
+
e as default
|
|
11
8
|
};
|
|
12
9
|
//# sourceMappingURL=layout.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"layout.js","sources":["../../../../src/features/ui/theme/layout.ts"],"sourcesContent":["import type { ILayout } from '../types';\n\nfunction getLayout(multiplier: number = 1): ILayout {\n
|
|
1
|
+
{"version":3,"file":"layout.js","sources":["../../../../src/features/ui/theme/layout.ts"],"sourcesContent":["import type { ILayout } from '../types';\n\nfunction getLayout(multiplier: number = 1): ILayout {\n return {\n gutter: 16 * multiplier,\n };\n}\n\nexport default getLayout;\n"],"names":["getLayout","multiplier"],"mappings":"AAEA,SAASA,EAAUC,IAAqB,GAAY;AAC3C,SAAA;AAAA,IACL,QAAQ,KAAKA;AAAA,EAAA;AAEjB;"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
const e = {
|
|
2
|
+
mobile: 480,
|
|
3
|
+
tablet: 760,
|
|
4
|
+
desktop: 920,
|
|
5
|
+
large: 1200,
|
|
6
|
+
xl: 1424
|
|
7
|
+
}, l = (r) => r < e.mobile || r >= e.mobile && r < e.tablet ? "mobile" : r >= e.tablet && r < e.desktop ? "tablet" : r >= e.desktop && r < e.large ? "desktop" : r >= e.large && r < e.xl ? "large" : (r >= e.xl, "xl"), t = {
|
|
8
|
+
minDesktop: `@media (min-width: ${e.desktop}px)`,
|
|
9
|
+
minLarge: `@media (min-width: ${e.large}px)`
|
|
10
|
+
};
|
|
11
|
+
export {
|
|
12
|
+
e as BREAKPOINTS,
|
|
13
|
+
l as getDeviceType,
|
|
14
|
+
t as media
|
|
15
|
+
};
|
|
16
|
+
//# sourceMappingURL=media.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"media.js","sources":["../../../src/features/utils/media.ts"],"sourcesContent":["export const BREAKPOINTS = {\n mobile: 480,\n tablet: 760,\n desktop: 920,\n large: 1200,\n xl: 1424,\n};\nexport type TDeviceType = 'mobile' | 'tablet' | 'desktop' | 'large' | 'xl';\n\nexport const getDeviceType = (width: number): TDeviceType => {\n if (width < BREAKPOINTS.mobile) return 'mobile';\n\n if (width >= BREAKPOINTS.mobile && width < BREAKPOINTS.tablet) return 'mobile';\n\n if (width >= BREAKPOINTS.tablet && width < BREAKPOINTS.desktop) return 'tablet';\n\n if (width >= BREAKPOINTS.desktop && width < BREAKPOINTS.large) return 'desktop';\n\n if (width >= BREAKPOINTS.large && width < BREAKPOINTS.xl) return 'large';\n\n if (width >= BREAKPOINTS.xl) return 'xl';\n\n return 'xl';\n};\n\nexport const media = {\n minDesktop: `@media (min-width: ${BREAKPOINTS.desktop}px)`,\n minLarge: `@media (min-width: ${BREAKPOINTS.large}px)`,\n};\n"],"names":["BREAKPOINTS","getDeviceType","width","media"],"mappings":"AAAO,MAAMA,IAAc;AAAA,EACzB,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,OAAO;AAAA,EACP,IAAI;AACN,GAGaC,IAAgB,CAACC,MACxBA,IAAQF,EAAY,UAEpBE,KAASF,EAAY,UAAUE,IAAQF,EAAY,SAAe,WAElEE,KAASF,EAAY,UAAUE,IAAQF,EAAY,UAAgB,WAEnEE,KAASF,EAAY,WAAWE,IAAQF,EAAY,QAAc,YAElEE,KAASF,EAAY,SAASE,IAAQF,EAAY,KAAW,WAE7DE,KAASF,EAAY,IAAW,OAKzBG,IAAQ;AAAA,EACnB,YAAY,sBAAsBH,EAAY,OAAO;AAAA,EACrD,UAAU,sBAAsBA,EAAY,KAAK;AACnD;"}
|
package/dist/index.d.ts
CHANGED
|
@@ -510,19 +510,12 @@ declare const getCheckboxConfig: IGetCheckboxConfig;
|
|
|
510
510
|
|
|
511
511
|
declare function getColors(): TColorsMap;
|
|
512
512
|
|
|
513
|
-
declare const
|
|
513
|
+
declare const getDeviceConfig: () => TSupportedDevices;
|
|
514
514
|
|
|
515
515
|
declare const getInputConfig: IGetInputConfig;
|
|
516
516
|
|
|
517
517
|
declare function getLayout(multiplier?: number): ILayout;
|
|
518
518
|
|
|
519
|
-
declare const getMediaQueries: () => {
|
|
520
|
-
minWidthTablet: string;
|
|
521
|
-
minWidthSmallDesktop: string;
|
|
522
|
-
minWidthDesktop: string;
|
|
523
|
-
minWidthLargeDevice: string;
|
|
524
|
-
};
|
|
525
|
-
|
|
526
519
|
declare const getTabConfig: IGetTabConfig;
|
|
527
520
|
|
|
528
521
|
declare const getTextButtonConfig: IGetTextButtonConfig;
|
|
@@ -1693,8 +1686,6 @@ declare interface IJourneyProviderProps {
|
|
|
1693
1686
|
|
|
1694
1687
|
export declare interface ILayout {
|
|
1695
1688
|
gutter: number;
|
|
1696
|
-
deviceWidth: number;
|
|
1697
|
-
deviceHeight: number;
|
|
1698
1689
|
}
|
|
1699
1690
|
|
|
1700
1691
|
export declare interface ILeaderboardDetails {
|
|
@@ -3480,8 +3471,7 @@ export declare interface ITheme {
|
|
|
3480
3471
|
textButton: ReturnType<typeof getTextButtonConfig>;
|
|
3481
3472
|
zIndex: ReturnType<typeof getZIndexConfig>;
|
|
3482
3473
|
checkbox: ReturnType<typeof getCheckboxConfig>;
|
|
3483
|
-
device: ReturnType<typeof
|
|
3484
|
-
mediaQueries: ReturnType<typeof getMediaQueries>;
|
|
3474
|
+
device: ReturnType<typeof getDeviceConfig>;
|
|
3485
3475
|
}
|
|
3486
3476
|
|
|
3487
3477
|
declare interface ITile {
|
|
@@ -4231,6 +4221,11 @@ export declare const Maintenance: React_2.FC<IMaintenanceProps>;
|
|
|
4231
4221
|
|
|
4232
4222
|
declare const MASTERY: "mastery";
|
|
4233
4223
|
|
|
4224
|
+
export declare const media: {
|
|
4225
|
+
minDesktop: string;
|
|
4226
|
+
minLarge: string;
|
|
4227
|
+
};
|
|
4228
|
+
|
|
4234
4229
|
export declare const MilestoneActionWidget: React_2.FC<IMilestoneActionWidgetProps>;
|
|
4235
4230
|
|
|
4236
4231
|
export declare const MilestoneCreate: React.FC<IMileStoneCreateContainerProps>;
|
|
@@ -4942,8 +4937,6 @@ declare type TCueProgramData = {
|
|
|
4942
4937
|
|
|
4943
4938
|
declare type TDefaultSection = Record<string, unknown>;
|
|
4944
4939
|
|
|
4945
|
-
export declare type TDeviceType = 'mobile' | 'tablet' | 'small-desktop' | 'desktop' | 'large-device' | 'xlarge-device';
|
|
4946
|
-
|
|
4947
4940
|
declare type TDrawingData = ITile | IStroke | undefined;
|
|
4948
4941
|
|
|
4949
4942
|
declare type TEnglishSectionSummary = {
|
|
@@ -5757,6 +5750,8 @@ declare type TSubscribe = (id: string, cb: (data: IActionData | IActionData[]) =
|
|
|
5757
5750
|
|
|
5758
5751
|
declare type TSubscribeMouseMove = (id: string, callback: (data: IPointerData) => void) => void;
|
|
5759
5752
|
|
|
5753
|
+
export declare type TSupportedDevices = 'mobile' | 'desktop';
|
|
5754
|
+
|
|
5760
5755
|
export declare type TTableMode = 'random' | 'sequence' | 'advance' | 'infinite';
|
|
5761
5756
|
|
|
5762
5757
|
export declare type TTabSizes = 'xsmall' | 'small' | 'regular' | 'medium';
|
package/dist/index.js
CHANGED
|
@@ -265,20 +265,21 @@ import { WORKSHEET_V3_NODE_TYPES as eu } from "./features/sheets/utils/is-v3-wor
|
|
|
265
265
|
import { COMPLETED_SHEET_STATE as ru, NODE_LABELS as tu, NODE_SUB_GROUP as au, NODE_TYPE as fu, PYTHON_NODE_TYPES as su, REWARDS_LIST as lu, SHEET_ACTIONS as pu, SHEET_ATTEMPT_LOCATION as uu, SHEET_ATTEMPT_LOCATION_MAP as mu, SHEET_ATTEMPT_STATE as du, SHEET_DATA_TYPE as xu, SHEET_STATE as nu } from "./features/sheets/constants/sheet.js";
|
|
266
266
|
import { default as iu } from "./features/student-details/student-details.js";
|
|
267
267
|
import { default as Tu } from "./features/utils/load-script.js";
|
|
268
|
-
import {
|
|
269
|
-
import {
|
|
270
|
-
import {
|
|
271
|
-
import { default as ku } from "./features/worksheet/worksheet
|
|
272
|
-
import { default as Ou } from "./features/worksheet/worksheet-preview/
|
|
273
|
-
import { default as Du } from "./features/worksheet/worksheet/worksheet-
|
|
274
|
-
import { default as gu } from "./features/worksheet/worksheet/worksheet-permissions/
|
|
275
|
-
import { default as Uu } from "./features/worksheet/
|
|
276
|
-
import { default as Bu } from "./features/worksheet/learnosity-preloader/
|
|
277
|
-
import { default as wu } from "./features/worksheet/
|
|
278
|
-
import { default as Vu } from "./features/
|
|
279
|
-
import { default as Yu } from "./features/
|
|
280
|
-
import {
|
|
281
|
-
import {
|
|
268
|
+
import { media as Eu } from "./features/utils/media.js";
|
|
269
|
+
import { ACTION_BAR_HEIGHT as Au, QUESTIONS_GAP as Pu, QUESTION_WIDTH as _u, TOP_NAVIGATION_HEIGHT as hu } from "./features/worksheet/worksheet/constants.js";
|
|
270
|
+
import { isOkayTypeQuestion as Lu } from "./features/worksheet/worksheet/worksheet-helpers.js";
|
|
271
|
+
import { default as ku } from "./features/worksheet/worksheet/worksheet-container.js";
|
|
272
|
+
import { default as Ou } from "./features/worksheet/worksheet-preview/worksheet-preview.js";
|
|
273
|
+
import { default as Du } from "./features/worksheet/worksheet-preview/dynamic-worksheet-preview/dynamic-worksheet-preview.js";
|
|
274
|
+
import { default as gu } from "./features/worksheet/worksheet/worksheet-permissions/sheet-locked.js";
|
|
275
|
+
import { default as Uu } from "./features/worksheet/worksheet/worksheet-permissions/error.js";
|
|
276
|
+
import { default as Bu } from "./features/worksheet/learnosity-preloader/learnosity-preloader.js";
|
|
277
|
+
import { default as wu } from "./features/worksheet/learnosity-preloader/use-is-learnosity-loaded.js";
|
|
278
|
+
import { default as Vu } from "./features/worksheet/worksheet-preview/hooks/use-worksheet-layout.js";
|
|
279
|
+
import { default as Yu } from "./features/hooks/use-viewport/use-viewport.js";
|
|
280
|
+
import { default as Ju } from "./features/puzzles/puzzle-container/puzzle-container.js";
|
|
281
|
+
import { invalidatePuzzleToAssign as Ku, useGetPuzzleToAssign as ju } from "./features/puzzles/api/puzzle-assign.js";
|
|
282
|
+
import { COUNTRY_CODE_MAP as qu } from "./constants/country.js";
|
|
282
283
|
export {
|
|
283
284
|
Ip as ACHIEVEMENT_ACTIONS,
|
|
284
285
|
nf as AUTH_TABS,
|
|
@@ -311,7 +312,7 @@ export {
|
|
|
311
312
|
Cs as CIRCLE_ACTION_IDS,
|
|
312
313
|
Ss as CIRCLE_ONBOARDING_ANALYTICS_STEPS,
|
|
313
314
|
ru as COMPLETED_SHEET_STATE,
|
|
314
|
-
|
|
315
|
+
qu as COUNTRY_CODE_MAP,
|
|
315
316
|
D as CalendarIcon,
|
|
316
317
|
Zt as Callout,
|
|
317
318
|
Pt as CascadingSelectInput,
|
|
@@ -357,7 +358,7 @@ export {
|
|
|
357
358
|
ee as DownIcon,
|
|
358
359
|
re as DraftIcon,
|
|
359
360
|
ae as DragIcon,
|
|
360
|
-
|
|
361
|
+
Du as DynamicPreviewWorksheet,
|
|
361
362
|
al as EClassTimeAlertLevel,
|
|
362
363
|
es as ELeaderboardType,
|
|
363
364
|
cp as EPResourceAssign,
|
|
@@ -408,7 +409,7 @@ export {
|
|
|
408
409
|
Df as LPARChapter,
|
|
409
410
|
gf as LPARMilestoneChapter,
|
|
410
411
|
Ls as Leaderboard,
|
|
411
|
-
|
|
412
|
+
Bu as LearnosityPreloader,
|
|
412
413
|
ge as LeftIcon,
|
|
413
414
|
Be as Lock2Icon,
|
|
414
415
|
we as Lock3Icon,
|
|
@@ -450,12 +451,12 @@ export {
|
|
|
450
451
|
ro as PointerIcon,
|
|
451
452
|
bp as PostGameStats,
|
|
452
453
|
no as PracticeIcon,
|
|
453
|
-
|
|
454
|
+
Ou as PreviewWorksheet,
|
|
454
455
|
io as ProgressIcon,
|
|
455
456
|
ps as ProjectOutcome,
|
|
456
457
|
xs as ProjectType,
|
|
457
458
|
Eo as Puzzle2Icon,
|
|
458
|
-
|
|
459
|
+
Ju as PuzzleCard,
|
|
459
460
|
To as PuzzleIcon,
|
|
460
461
|
Ao as QuestionIcon,
|
|
461
462
|
_o as QuestionLetterIcon,
|
|
@@ -487,10 +488,10 @@ export {
|
|
|
487
488
|
ct as SelectInput,
|
|
488
489
|
kt as SelectionCards,
|
|
489
490
|
ia as Separator,
|
|
490
|
-
|
|
491
|
+
Uu as SheetError,
|
|
491
492
|
Go as SheetIcon,
|
|
492
493
|
Zp as SheetList,
|
|
493
|
-
|
|
494
|
+
gu as SheetLocked,
|
|
494
495
|
Gs as SignUp,
|
|
495
496
|
ja as SignupMethods,
|
|
496
497
|
cr as SketchIcon,
|
|
@@ -536,14 +537,14 @@ export {
|
|
|
536
537
|
tf as UsernamePasswordForm,
|
|
537
538
|
Ta as Video,
|
|
538
539
|
Pf as WHITELIST_EVENTS,
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
|
|
540
|
+
Au as WORKSHEET_ACTION_BAR_HEIGHT,
|
|
541
|
+
Pu as WORKSHEET_QUESTIONS_GAP,
|
|
542
|
+
_u as WORKSHEET_QUESTION_WIDTH,
|
|
543
|
+
hu as WORKSHEET_TOP_NAVIGATION_HEIGHT,
|
|
543
544
|
eu as WORKSHEET_V3_NODE_TYPES,
|
|
544
545
|
ss as WebView,
|
|
545
546
|
ms as WebViewEvent,
|
|
546
|
-
|
|
547
|
+
ku as Worksheet,
|
|
547
548
|
Bf as checkIfPPTNodeType,
|
|
548
549
|
fa as getTheme,
|
|
549
550
|
Vf as invalidateGetChapterDetails,
|
|
@@ -551,10 +552,11 @@ export {
|
|
|
551
552
|
kp as invalidateMilestoneResources,
|
|
552
553
|
Ep as invalidateMilestonesData,
|
|
553
554
|
Pp as invalidatePastMilestoneCount,
|
|
554
|
-
|
|
555
|
+
Ku as invalidatePuzzleToAssign,
|
|
555
556
|
Rp as invalidateTestHelpData,
|
|
556
|
-
|
|
557
|
+
Lu as isOkayTypeQuestion,
|
|
557
558
|
Tu as loadScript,
|
|
559
|
+
Eu as media,
|
|
558
560
|
Il as useAutoPlayPermission,
|
|
559
561
|
Ws as useCanvasSyncBroker,
|
|
560
562
|
gl as useChapterPageJourney,
|
|
@@ -568,13 +570,13 @@ export {
|
|
|
568
570
|
Xf as useGetLeaderboardDal,
|
|
569
571
|
Np as useGetMilestoneResources,
|
|
570
572
|
_p as useGetPastMilestoneCount,
|
|
571
|
-
|
|
573
|
+
ju as useGetPuzzleToAssign,
|
|
572
574
|
Lp as useGetTestHelpData,
|
|
573
575
|
Dl as useHomePageJourney,
|
|
574
576
|
$s as useInClassActionDispatcher,
|
|
575
577
|
el as useInClassActionListener,
|
|
576
578
|
Qs as useInClassMessageBroker,
|
|
577
|
-
|
|
579
|
+
wu as useIsLearnosityLoaded,
|
|
578
580
|
hf as useIsTabBlocked,
|
|
579
581
|
Pl as useJourney,
|
|
580
582
|
Bt as useModalActions,
|
|
@@ -583,8 +585,8 @@ export {
|
|
|
583
585
|
oa as useTrackingContext,
|
|
584
586
|
js as useTrialSessionMessageBroker,
|
|
585
587
|
$t as useUIContext,
|
|
586
|
-
|
|
587
|
-
|
|
588
|
+
Yu as useViewport,
|
|
589
|
+
Vu as useWorksheetLayout,
|
|
588
590
|
Ur as useZoomDisable
|
|
589
591
|
};
|
|
590
592
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/package.json
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"constants.js","sources":["../../../../src/features/ui/theme/constants.ts"],"sourcesContent":["export const BREAKPOINTS = {\n tablet: 760,\n smallDesktop: 920,\n desktop: 1072,\n largeDevice: 1232,\n xlargeDevice: 1424,\n};\n"],"names":["BREAKPOINTS"],"mappings":"AAAO,MAAMA,IAAc;AAAA,EACzB,QAAQ;AAAA,EACR,cAAc;AAAA,EACd,SAAS;AAAA,EACT,aAAa;AAAA,EACb,cAAc;AAChB;"}
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import { BREAKPOINTS as r } from "./constants.js";
|
|
2
|
-
const l = (e) => e >= r.xlargeDevice ? "xlarge-device" : e >= r.largeDevice ? "large-device" : e >= r.smallDesktop ? "small-desktop" : e >= r.desktop ? "desktop" : e >= r.tablet ? "tablet" : "mobile";
|
|
3
|
-
export {
|
|
4
|
-
l as getDevice
|
|
5
|
-
};
|
|
6
|
-
//# sourceMappingURL=get-device.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"get-device.js","sources":["../../../../src/features/ui/theme/get-device.ts"],"sourcesContent":["import type { TDeviceType } from '../types';\n\nimport { BREAKPOINTS } from './constants';\n\nexport const getDevice = (width: number): TDeviceType => {\n if (width >= BREAKPOINTS.xlargeDevice) return 'xlarge-device';\n\n if (width >= BREAKPOINTS.largeDevice) return 'large-device';\n\n if (width >= BREAKPOINTS.smallDesktop) return 'small-desktop';\n\n if (width >= BREAKPOINTS.desktop) return 'desktop';\n\n if (width >= BREAKPOINTS.tablet) return 'tablet';\n\n return 'mobile';\n};\n"],"names":["getDevice","width","BREAKPOINTS"],"mappings":";AAIa,MAAAA,IAAY,CAACC,MACpBA,KAASC,EAAY,eAAqB,kBAE1CD,KAASC,EAAY,cAAoB,iBAEzCD,KAASC,EAAY,eAAqB,kBAE1CD,KAASC,EAAY,UAAgB,YAErCD,KAASC,EAAY,SAAe,WAEjC;"}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { BREAKPOINTS as i } from "./constants.js";
|
|
2
|
-
const t = () => ({
|
|
3
|
-
minWidthTablet: `@media (min-width: ${i.tablet}px)`,
|
|
4
|
-
minWidthSmallDesktop: `@media (min-width: ${i.smallDesktop}px)`,
|
|
5
|
-
minWidthDesktop: `@media (min-width: ${i.desktop}px)`,
|
|
6
|
-
minWidthLargeDevice: `@media (min-width: ${i.largeDevice}px)`
|
|
7
|
-
});
|
|
8
|
-
export {
|
|
9
|
-
t as getMediaQueries
|
|
10
|
-
};
|
|
11
|
-
//# sourceMappingURL=media-queries.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"media-queries.js","sources":["../../../../src/features/ui/theme/media-queries.ts"],"sourcesContent":["import { BREAKPOINTS } from './constants';\n\nexport const getMediaQueries = () => ({\n minWidthTablet: `@media (min-width: ${BREAKPOINTS.tablet}px)`,\n minWidthSmallDesktop: `@media (min-width: ${BREAKPOINTS.smallDesktop}px)`,\n minWidthDesktop: `@media (min-width: ${BREAKPOINTS.desktop}px)`,\n minWidthLargeDevice: `@media (min-width: ${BREAKPOINTS.largeDevice}px)`,\n});\n"],"names":["getMediaQueries","BREAKPOINTS"],"mappings":";AAEO,MAAMA,IAAkB,OAAO;AAAA,EACpC,gBAAgB,sBAAsBC,EAAY,MAAM;AAAA,EACxD,sBAAsB,sBAAsBA,EAAY,YAAY;AAAA,EACpE,iBAAiB,sBAAsBA,EAAY,OAAO;AAAA,EAC1D,qBAAqB,sBAAsBA,EAAY,WAAW;AACpE;"}
|