@cuemath/leap 2.8.37-rj-beta-0.2 → 2.8.38-guru.0

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.
Files changed (148) hide show
  1. package/dist/assets/line-icons/icons/sheet.js +54 -0
  2. package/dist/assets/line-icons/icons/sheet.js.map +1 -0
  3. package/dist/assets/lottie/lottie.js +0 -6
  4. package/dist/assets/lottie/lottie.js.map +1 -1
  5. package/dist/features/analytics-events/whitelist-events.js +15 -13
  6. package/dist/features/analytics-events/whitelist-events.js.map +1 -1
  7. package/dist/features/circle-games/enum/circle-onboarding-steps.js +1 -1
  8. package/dist/features/circle-games/enum/circle-onboarding-steps.js.map +1 -1
  9. package/dist/features/circle-games/game-launcher/comps/card-container/card-container.js +11 -20
  10. package/dist/features/circle-games/game-launcher/comps/card-container/card-container.js.map +1 -1
  11. package/dist/features/circle-games/game-launcher/comps/carousel/carousel.js +47 -53
  12. package/dist/features/circle-games/game-launcher/comps/carousel/carousel.js.map +1 -1
  13. package/dist/features/circle-games/game-launcher/comps/tables-card/table-mode/table-mode-styled.js +3 -3
  14. package/dist/features/circle-games/game-launcher/comps/tables-card/table-mode/table-mode-styled.js.map +1 -1
  15. package/dist/features/circle-games/game-launcher/comps/tables-card/table-mode/table-mode.js +35 -29
  16. package/dist/features/circle-games/game-launcher/comps/tables-card/table-mode/table-mode.js.map +1 -1
  17. package/dist/features/circle-games/game-launcher/comps/tables-card/table-star/table-star-styled.js +11 -0
  18. package/dist/features/circle-games/game-launcher/comps/tables-card/table-star/table-star-styled.js.map +1 -0
  19. package/dist/features/circle-games/game-launcher/comps/tables-card/table-star/table-star.js +16 -0
  20. package/dist/features/circle-games/game-launcher/comps/tables-card/table-star/table-star.js.map +1 -0
  21. package/dist/features/circle-games/game-launcher/comps/tables-card/tables-card-styled.js +42 -35
  22. package/dist/features/circle-games/game-launcher/comps/tables-card/tables-card-styled.js.map +1 -1
  23. package/dist/features/circle-games/game-launcher/comps/tables-card/tables-card.js +212 -252
  24. package/dist/features/circle-games/game-launcher/comps/tables-card/tables-card.js.map +1 -1
  25. package/dist/features/circle-games/game-launcher/dal/use-get-circle-home-details-dal/use-get-circle-home-details-dal.js +13 -14
  26. package/dist/features/circle-games/game-launcher/dal/use-get-circle-home-details-dal/use-get-circle-home-details-dal.js.map +1 -1
  27. package/dist/features/circle-games/game-launcher/game-launcher-analytics-events.js +7 -8
  28. package/dist/features/circle-games/game-launcher/game-launcher-analytics-events.js.map +1 -1
  29. package/dist/features/circle-games/game-launcher/game-launcher.js +69 -80
  30. package/dist/features/circle-games/game-launcher/game-launcher.js.map +1 -1
  31. package/dist/features/circle-games/game-launcher/use-game-launcher-journey/constants.js +7 -0
  32. package/dist/features/circle-games/game-launcher/use-game-launcher-journey/constants.js.map +1 -0
  33. package/dist/features/circle-games/game-launcher/use-game-launcher-journey/use-game-launcher-journey.js +213 -0
  34. package/dist/features/circle-games/game-launcher/use-game-launcher-journey/use-game-launcher-journey.js.map +1 -0
  35. package/dist/features/circle-games/games/web-view/web-view-types.js.map +1 -1
  36. package/dist/features/communication/pub-sub/constants.js +2 -1
  37. package/dist/features/communication/pub-sub/constants.js.map +1 -1
  38. package/dist/features/journey/journey-id/journey-id-student.js +1 -1
  39. package/dist/features/journey/journey-id/journey-id-student.js.map +1 -1
  40. package/dist/features/milestone/create/milestone-create-styled.js +11 -9
  41. package/dist/features/milestone/create/milestone-create-styled.js.map +1 -1
  42. package/dist/features/milestone/edit/comps/milestone-edit-loader/milestone-edit-loader-styled.js +6 -8
  43. package/dist/features/milestone/edit/comps/milestone-edit-loader/milestone-edit-loader-styled.js.map +1 -1
  44. package/dist/features/milestone/milestone-list-container/milestone-list-container.js +130 -117
  45. package/dist/features/milestone/milestone-list-container/milestone-list-container.js.map +1 -1
  46. package/dist/features/milestone/milestone-resources/resources-assign/added-resource-and-filters.js +205 -0
  47. package/dist/features/milestone/milestone-resources/resources-assign/added-resource-and-filters.js.map +1 -0
  48. package/dist/features/milestone/milestone-resources/resources-assign/api/get-resource.js +11 -0
  49. package/dist/features/milestone/milestone-resources/resources-assign/api/get-resource.js.map +1 -0
  50. package/dist/features/milestone/milestone-resources/resources-assign/api/goal-resource-assign.js +9 -0
  51. package/dist/features/milestone/milestone-resources/resources-assign/api/goal-resource-assign.js.map +1 -0
  52. package/dist/features/milestone/milestone-resources/resources-assign/api/lpar-resource-assign.js +9 -0
  53. package/dist/features/milestone/milestone-resources/resources-assign/api/lpar-resource-assign.js.map +1 -0
  54. package/dist/features/milestone/milestone-resources/resources-assign/comps/filter-item/filter-item-styled.js +19 -0
  55. package/dist/features/milestone/milestone-resources/resources-assign/comps/filter-item/filter-item-styled.js.map +1 -0
  56. package/dist/features/milestone/milestone-resources/resources-assign/comps/filter-item/filter-item.js +47 -0
  57. package/dist/features/milestone/milestone-resources/resources-assign/comps/filter-item/filter-item.js.map +1 -0
  58. package/dist/features/milestone/milestone-resources/resources-assign/comps/resource-item/resource-item-styled.js +22 -0
  59. package/dist/features/milestone/milestone-resources/resources-assign/comps/resource-item/resource-item-styled.js.map +1 -0
  60. package/dist/features/milestone/milestone-resources/resources-assign/comps/resource-item/resource-item.js +60 -0
  61. package/dist/features/milestone/milestone-resources/resources-assign/comps/resource-item/resource-item.js.map +1 -0
  62. package/dist/features/milestone/milestone-resources/resources-assign/comps/resource-item/utils.js +6 -0
  63. package/dist/features/milestone/milestone-resources/resources-assign/comps/resource-item/utils.js.map +1 -0
  64. package/dist/features/milestone/milestone-resources/resources-assign/constant.js +6 -0
  65. package/dist/features/milestone/milestone-resources/resources-assign/constant.js.map +1 -0
  66. package/dist/features/milestone/milestone-resources/resources-assign/resource-assign-analytics-events.js +19 -0
  67. package/dist/features/milestone/milestone-resources/resources-assign/resource-assign-analytics-events.js.map +1 -0
  68. package/dist/features/milestone/milestone-resources/resources-assign/resource-items/no-resource-screen.js +32 -0
  69. package/dist/features/milestone/milestone-resources/resources-assign/resource-items/no-resource-screen.js.map +1 -0
  70. package/dist/features/milestone/milestone-resources/resources-assign/resource-items/resource-items-styled.js +19 -0
  71. package/dist/features/milestone/milestone-resources/resources-assign/resource-items/resource-items-styled.js.map +1 -0
  72. package/dist/features/milestone/milestone-resources/resources-assign/resource-items/resource-items.js +85 -0
  73. package/dist/features/milestone/milestone-resources/resources-assign/resource-items/resource-items.js.map +1 -0
  74. package/dist/features/milestone/milestone-resources/resources-assign/resources-assign-styled.js +65 -0
  75. package/dist/features/milestone/milestone-resources/resources-assign/resources-assign-styled.js.map +1 -0
  76. package/dist/features/milestone/milestone-resources/resources-assign/resources-assign.js +233 -0
  77. package/dist/features/milestone/milestone-resources/resources-assign/resources-assign.js.map +1 -0
  78. package/dist/features/milestone/milestone-resources/resources-assign/utils.js +12 -0
  79. package/dist/features/milestone/milestone-resources/resources-assign/utils.js.map +1 -0
  80. package/dist/features/post-game-stats/enums/post-game-stats-enum.js +1 -1
  81. package/dist/features/post-game-stats/enums/post-game-stats-enum.js.map +1 -1
  82. package/dist/features/post-game-stats/points/points.js +10 -15
  83. package/dist/features/post-game-stats/points/points.js.map +1 -1
  84. package/dist/features/post-game-stats/post-game-stats.js +61 -83
  85. package/dist/features/post-game-stats/post-game-stats.js.map +1 -1
  86. package/dist/features/ui/grade-selector/grade-tab.js +15 -15
  87. package/dist/features/ui/grade-selector/grade-tab.js.map +1 -1
  88. package/dist/features/ui/inputs/searchable-input/searchable-input-styled.js +28 -0
  89. package/dist/features/ui/inputs/searchable-input/searchable-input-styled.js.map +1 -0
  90. package/dist/features/ui/inputs/searchable-input/searchable-input.js +101 -0
  91. package/dist/features/ui/inputs/searchable-input/searchable-input.js.map +1 -0
  92. package/dist/features/ui/tab/tab-styled.js +7 -8
  93. package/dist/features/ui/tab/tab-styled.js.map +1 -1
  94. package/dist/features/ui/tab/tab.js +36 -31
  95. package/dist/features/ui/tab/tab.js.map +1 -1
  96. package/dist/features/ui/theme/tab.js +3 -3
  97. package/dist/features/ui/theme/tab.js.map +1 -1
  98. package/dist/index.d.ts +47 -52
  99. package/dist/index.js +345 -343
  100. package/dist/index.js.map +1 -1
  101. package/package.json +1 -1
  102. package/dist/assets/line-icons/icons/carat-left.js +0 -26
  103. package/dist/assets/line-icons/icons/carat-left.js.map +0 -1
  104. package/dist/assets/line-icons/icons/carat-right.js +0 -26
  105. package/dist/assets/line-icons/icons/carat-right.js.map +0 -1
  106. package/dist/features/circle-games/game-launcher/comps/tables-card/table-mode-star/table-mode-star-styled.js +0 -25
  107. package/dist/features/circle-games/game-launcher/comps/tables-card/table-mode-star/table-mode-star-styled.js.map +0 -1
  108. package/dist/features/circle-games/game-launcher/comps/tables-card/table-mode-star/table-mode-star.js +0 -57
  109. package/dist/features/circle-games/game-launcher/comps/tables-card/table-mode-star/table-mode-star.js.map +0 -1
  110. package/dist/features/circle-games/game-launcher/comps/tables-card/table-segment-star/table-segment-star-styled.js +0 -27
  111. package/dist/features/circle-games/game-launcher/comps/tables-card/table-segment-star/table-segment-star-styled.js.map +0 -1
  112. package/dist/features/circle-games/game-launcher/comps/tables-card/table-segment-star/table-segment-star.js +0 -37
  113. package/dist/features/circle-games/game-launcher/comps/tables-card/table-segment-star/table-segment-star.js.map +0 -1
  114. package/dist/features/circle-games/game-launcher/hooks/use-game-launcher-journey/constants.js +0 -9
  115. package/dist/features/circle-games/game-launcher/hooks/use-game-launcher-journey/constants.js.map +0 -1
  116. package/dist/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.js +0 -217
  117. package/dist/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.js.map +0 -1
  118. package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/constants.js +0 -6
  119. package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/constants.js.map +0 -1
  120. package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey-styled.js +0 -13
  121. package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey-styled.js.map +0 -1
  122. package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.js +0 -205
  123. package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.js.map +0 -1
  124. package/dist/features/post-game-stats/digital-meter/comp/animated-arc/animated-arc-styled.js +0 -17
  125. package/dist/features/post-game-stats/digital-meter/comp/animated-arc/animated-arc-styled.js.map +0 -1
  126. package/dist/features/post-game-stats/digital-meter/comp/animated-arc/animated-arc.js +0 -47
  127. package/dist/features/post-game-stats/digital-meter/comp/animated-arc/animated-arc.js.map +0 -1
  128. package/dist/features/post-game-stats/digital-meter/comp/animated-arc/constants.js +0 -6
  129. package/dist/features/post-game-stats/digital-meter/comp/animated-arc/constants.js.map +0 -1
  130. package/dist/features/post-game-stats/digital-meter/constants.js +0 -16
  131. package/dist/features/post-game-stats/digital-meter/constants.js.map +0 -1
  132. package/dist/features/post-game-stats/digital-meter/digital-meter-styled.js +0 -87
  133. package/dist/features/post-game-stats/digital-meter/digital-meter-styled.js.map +0 -1
  134. package/dist/features/post-game-stats/digital-meter/digital-meter.js +0 -185
  135. package/dist/features/post-game-stats/digital-meter/digital-meter.js.map +0 -1
  136. package/dist/features/post-game-stats/digital-meter/helper.js +0 -33
  137. package/dist/features/post-game-stats/digital-meter/helper.js.map +0 -1
  138. package/dist/features/post-game-stats/number-count-animation/number-count-animation-styled.js +0 -29
  139. package/dist/features/post-game-stats/number-count-animation/number-count-animation-styled.js.map +0 -1
  140. package/dist/features/post-game-stats/number-count-animation/number-count-animation.js +0 -20
  141. package/dist/features/post-game-stats/number-count-animation/number-count-animation.js.map +0 -1
  142. package/dist/static/point2.7cec6e24.json +0 -1
  143. package/dist/static/point3.f96fe7aa.json +0 -1
  144. package/dist/static/point4.fe04fb83.json +0 -1
  145. package/dist/static/table-mode-star.b8a1d762.json +0 -1
  146. package/dist/static/table-segment-star.78e851d6.json +0 -1
  147. package/dist/static/target-achieved-text.053bd142.json +0 -2830
  148. package/dist/static/target-achieved-text.10db8475.json +0 -1
@@ -1,205 +0,0 @@
1
- import { jsx as r, Fragment as L } from "react/jsx-runtime";
2
- import { useRef as R, useCallback as b } from "react";
3
- import x from "../../../../../assets/line-icons/icons/carat-right.js";
4
- import { PLATFORM_EVENTS_STUDENT as W } from "../../../../analytics-events/platform-events-student.js";
5
- import { JOURNEY_ID_STUDENT as G } from "../../../../journey/journey-id/journey-id-student.js";
6
- import { IndicatorType as d } from "../../../../journey/use-journey/constants.js";
7
- import { useJourney as w } from "../../../../journey/use-journey/use-journey.js";
8
- import J from "../../../../ui/buttons/icon-button/icon-button.js";
9
- import { useUIContext as X } from "../../../../ui/context/context.js";
10
- import I from "../../../../ui/layout/flex-view.js";
11
- import u from "../../../../ui/text/text.js";
12
- import { CIRCLE_ONBOARDING_ANALYTICS_STEPS as S } from "../../../enum/circle-onboarding-steps.js";
13
- import { useCircleSounds as V } from "../../../hooks/use-circle-sounds/use-circle-sounds.js";
14
- import { TablesCard as B } from "../../comps/tables-card/tables-card.js";
15
- import { GAME_LAUNCHER_ANALYTICS_EVENTS as F } from "../../game-launcher-analytics-events.js";
16
- import { TABLE_CARD_INDEX as v, PUZZLE_CARD_INDEX as M } from "./constants.js";
17
- import { Indicator as j } from "./use-table-launcher-journey-styled.js";
18
- const me = ({
19
- carouselRefs: s,
20
- onTableSegmentClick: O,
21
- onJourneyComplete: _
22
- }) => {
23
- const e = G.CIRCLE_TABLES_INTRO_JOURNEY, t = R(null), p = R(null), N = R(!1), { playButtonSound: P } = V(), { nextCoachmark: i, setJourney: y, addCoachmark: c } = w(), { onEvent: T } = X(), C = b(
24
- (o) => {
25
- var l, a;
26
- o && O(o), T(W.ONBOARDING_STEP_COMPLETED, {
27
- step: S.TABLES
28
- }), (l = t == null ? void 0 : t.current) == null || l.setLabelVisiblity(!0), (a = t == null ? void 0 : t.current) == null || a.stopLabelAnimation(), _(e), i(e, !1);
29
- },
30
- [e, i, _, O, T]
31
- ), H = b(
32
- (o, l) => {
33
- var m, g, h;
34
- if (!((m = t.current) != null && m.segmentedCardWrapperRef.current) || !((g = t.current) != null && g.labelRef.current))
35
- return;
36
- const a = t.current.labelRef.current.getBoundingClientRect(), n = (h = t.current) == null ? void 0 : h.segmentedCardWrapperRef.current.getBoundingClientRect();
37
- c(e, {
38
- originalElementToHighlightRef: t.current.segmentedCardWrapperRef,
39
- isActive: !1,
40
- type: d.TOOLTIP,
41
- elementToHighlight: /* @__PURE__ */ r(
42
- B,
43
- {
44
- ref: p,
45
- defaultTable: l,
46
- label: o.label,
47
- data: o.data,
48
- onPress: C,
49
- onGoBackFromTableLevel: C
50
- }
51
- ),
52
- indicator: {
53
- position: "left",
54
- backgroundColor: "YELLOW_4",
55
- width: 236,
56
- tooltipItem: /* @__PURE__ */ r(I, { children: /* @__PURE__ */ r(u, { $renderAs: "ab2-bold", children: "Each table has 3 levels—clear them and earn 3 stars!" }) }),
57
- tooltipXCoOrdinates: 0,
58
- tooltipYCoOrdinates: a.height * 0.35
59
- }
60
- }), c(e, {
61
- originalElementToHighlightRef: t.current.segmentedCardWrapperRef,
62
- isActive: !1,
63
- type: d.NUDGE,
64
- indicator: {
65
- nudge: "click",
66
- content: /* @__PURE__ */ r(u, { $renderAs: "ab1", $color: "WHITE", children: "Pick a level" }),
67
- nudgePointerX: n.width / 2 + 50,
68
- nudgePointerY: n.height * 0.4
69
- },
70
- elementToHighlight: /* @__PURE__ */ r(L, {})
71
- }), i(e, !1, 100), i(e, !0, 2e3);
72
- const E = setTimeout(() => {
73
- var f;
74
- clearTimeout(E), (f = p.current) == null || f.startLabelAnimation("YELLOW_4");
75
- }, 3e3);
76
- },
77
- [c, C, e, i]
78
- ), A = b(() => {
79
- var a;
80
- P(), (a = s.current) == null || a.goToIndex(v), i(e, !1, 1e3), T(W.ONBOARDING_STEP_VIEWED, {
81
- step: S.TABLES
82
- });
83
- const o = setTimeout(() => {
84
- var n;
85
- clearTimeout(o), (n = t.current) == null || n.setLabelVisiblity(!1), i(e, !0);
86
- }, 3e3), l = setTimeout(() => {
87
- var n;
88
- clearTimeout(l), (n = p.current) == null || n.startLabelAnimation("YELLOW_4");
89
- }, 3100);
90
- }, [s, e, i, P, T]), U = b(
91
- (o) => {
92
- var g, h, f, Y, k, D;
93
- if (N.current)
94
- return;
95
- const l = (g = s.current) == null ? void 0 : g.indicatorRefs, a = (h = s.current) == null ? void 0 : h.nextBtnRef, n = l == null ? void 0 : l[v];
96
- if (!((f = t.current) != null && f.segmentedCardWrapperRef.current) || !((Y = t.current) != null && Y.labelRef.current) || !l || !(a != null && a.current) || !n || !n.current)
97
- return;
98
- N.current = !0;
99
- const E = t.current.labelRef.current.getBoundingClientRect(), m = (k = t.current) == null ? void 0 : k.segmentedCardWrapperRef.current.getBoundingClientRect();
100
- y(e, []), s.current.currentIndex === M ? (c(e, {
101
- originalElementToHighlightRef: (D = s.current) == null ? void 0 : D.nextBtnRef,
102
- isActive: !1,
103
- type: d.NUDGE,
104
- indicator: {
105
- nudge: "click",
106
- content: /* @__PURE__ */ r(u, { $renderAs: "ab1", $color: "WHITE", children: "Click to proceed" }),
107
- nudgePointerX: 0,
108
- nudgePointerY: 0
109
- },
110
- elementToHighlight: /* @__PURE__ */ r(
111
- J,
112
- {
113
- renderAs: "secondary",
114
- Icon: x,
115
- onClick: A,
116
- analyticsLabel: F.JOURNEY_NEXT_ACTIVITY
117
- }
118
- )
119
- }), i(e, !1, 500)) : (c(e, {
120
- originalElementToHighlightRef: n,
121
- isActive: !1,
122
- type: d.TOOLTIP,
123
- elementToHighlight: /* @__PURE__ */ r(j, { $isActive: !1 }),
124
- indicator: {
125
- position: "bottom",
126
- backgroundColor: "YELLOW_4",
127
- width: 52,
128
- tooltipItem: /* @__PURE__ */ r(
129
- I,
130
- {
131
- $position: "absolute",
132
- $flexDirection: "row",
133
- style: { top: 6, left: 8, cursor: "pointer" },
134
- onClick: A,
135
- children: /* @__PURE__ */ r(u, { $renderAs: "ab2-bold", children: "NEW" })
136
- }
137
- ),
138
- tooltipYCoOrdinates: 14
139
- // Need some offset in Y direction from top
140
- }
141
- }), c(e, {
142
- originalElementToHighlightRef: n,
143
- isActive: !1,
144
- type: d.NUDGE,
145
- indicator: {
146
- nudge: "click",
147
- content: "",
148
- nudgePointerY: 20
149
- },
150
- elementToHighlight: /* @__PURE__ */ r(L, {})
151
- }), i(e, !1, 500), i(e, !0, 1500)), c(e, {
152
- originalElementToHighlightRef: t.current.labelRef,
153
- isActive: !1,
154
- type: d.TOOLTIP,
155
- elementToHighlight: /* @__PURE__ */ r(L, {}),
156
- indicator: {
157
- position: "right",
158
- backgroundColor: "YELLOW_4",
159
- width: 264,
160
- tooltipItem: /* @__PURE__ */ r(I, { children: /* @__PURE__ */ r(u, { $renderAs: "ab2-bold", children: "Get faster at multiplication! Practice everyday and become a Tables champ." }) }),
161
- tooltipXCoOrdinates: E.width + 50,
162
- tooltipYCoOrdinates: E.height / 2
163
- }
164
- }), c(e, {
165
- originalElementToHighlightRef: t.current.segmentedCardWrapperRef,
166
- isActive: !1,
167
- type: d.NUDGE,
168
- indicator: {
169
- nudge: "click",
170
- content: /* @__PURE__ */ r(u, { $renderAs: "ab1", $color: "WHITE", children: "Pick a table to start" }),
171
- nudgePointerX: m.width / 2 + 50,
172
- nudgePointerY: m.height / 2
173
- },
174
- elementToHighlight: /* @__PURE__ */ r(
175
- B,
176
- {
177
- ref: p,
178
- label: o.label,
179
- data: o.data,
180
- onPress: () => {
181
- },
182
- onPressTableSegment: ($) => H(o, $)
183
- }
184
- )
185
- });
186
- },
187
- [
188
- c,
189
- s,
190
- A,
191
- H,
192
- e,
193
- i,
194
- y
195
- ]
196
- );
197
- return {
198
- tableRef: t,
199
- startJourney: U
200
- };
201
- };
202
- export {
203
- me as useTableLauncherJourney
204
- };
205
- //# sourceMappingURL=use-table-launcher-journey.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"use-table-launcher-journey.js","sources":["../../../../../../src/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.tsx"],"sourcesContent":["/* eslint-disable react-native/no-inline-styles */\nimport type { IArrowTooltipProps } from '../../../../ui/arrow-tooltip/arrow-tooltip-types';\nimport type { INudgeProps } from '../../../../ui/nudge/nudge-types';\nimport type { ITableCardRef, ITableDetails } from '../../comps/tables-card/tables-card-types';\nimport type {\n ITableInfo,\n ITables,\n} from '../../dal/use-get-circle-home-details-dal/use-get-circle-home-dal-types';\nimport type { IUseTableJourneyProps } from './use-table-launcher-journey-types';\n\nimport { useCallback, useRef } from 'react';\n\nimport CaratRightIcon from '../../../../../assets/line-icons/icons/carat-right';\nimport { PLATFORM_EVENTS_STUDENT } from '../../../../analytics-events/platform-events-student';\nimport { JOURNEY_ID_STUDENT } from '../../../../journey/journey-id/journey-id-student';\nimport { IndicatorType } from '../../../../journey/use-journey/constants';\nimport { useJourney } from '../../../../journey/use-journey/use-journey';\nimport IconButton from '../../../../ui/buttons/icon-button/icon-button';\nimport { useUIContext } from '../../../../ui/context/context';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport Text from '../../../../ui/text/text';\nimport { CIRCLE_ONBOARDING_ANALYTICS_STEPS as Action } from '../../../enum/circle-onboarding-steps';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport { TablesCard } from '../../comps/tables-card/tables-card';\nimport { GAME_LAUNCHER_ANALYTICS_EVENTS } from '../../game-launcher-analytics-events';\nimport { PUZZLE_CARD_INDEX, TABLE_CARD_INDEX } from './constants';\nimport * as S from './use-table-launcher-journey-styled';\n\nexport const useTableLauncherJourney = ({\n carouselRefs,\n onTableSegmentClick,\n onJourneyComplete,\n}: IUseTableJourneyProps) => {\n const journeyId = JOURNEY_ID_STUDENT.CIRCLE_TABLES_INTRO_JOURNEY;\n const originalTableRef = useRef<ITableCardRef>(null);\n const highlightedTableRef = useRef<ITableCardRef>(null);\n const isJourneyInProgress = useRef(false);\n\n const { playButtonSound } = useCircleSounds();\n const { nextCoachmark, setJourney, addCoachmark } = useJourney();\n const { onEvent: trackAnalytics } = useUIContext();\n\n const endJourney = useCallback(\n (tableDetails?: ITableDetails) => {\n // Only when User clicked on play\n if (tableDetails) {\n onTableSegmentClick(tableDetails);\n }\n trackAnalytics(PLATFORM_EVENTS_STUDENT.ONBOARDING_STEP_COMPLETED, {\n step: Action.TABLES,\n });\n\n // Reset original table card ref label\n originalTableRef?.current?.setLabelVisiblity(true);\n originalTableRef?.current?.stopLabelAnimation();\n onJourneyComplete(journeyId);\n nextCoachmark(journeyId, false);\n },\n [journeyId, nextCoachmark, onJourneyComplete, onTableSegmentClick, trackAnalytics],\n );\n\n const handleTableSegmentClick = useCallback(\n (launcherData: ITables, tableData: ITableInfo) => {\n if (\n !originalTableRef.current?.segmentedCardWrapperRef.current ||\n !originalTableRef.current?.labelRef.current\n ) {\n return;\n }\n\n const segmentedCardDims = originalTableRef.current.labelRef.current.getBoundingClientRect();\n const tableCardDims =\n originalTableRef.current?.segmentedCardWrapperRef.current.getBoundingClientRect();\n\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: (\n <TablesCard\n ref={highlightedTableRef}\n defaultTable={tableData}\n label={launcherData.label}\n data={launcherData.data}\n onPress={endJourney}\n onGoBackFromTableLevel={endJourney}\n />\n ),\n indicator: {\n position: 'left',\n backgroundColor: 'YELLOW_4',\n width: 236,\n tooltipItem: (\n <FlexView>\n <Text $renderAs=\"ab2-bold\">Each table has 3 levels—clear them and earn 3 stars!</Text>\n </FlexView>\n ),\n tooltipXCoOrdinates: 0,\n tooltipYCoOrdinates: segmentedCardDims.height * 0.35,\n } as IArrowTooltipProps,\n });\n\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n indicator: {\n nudge: 'click',\n content: (\n <Text $renderAs=\"ab1\" $color=\"WHITE\">\n Pick a level\n </Text>\n ),\n nudgePointerX: tableCardDims.width / 2 + 50,\n nudgePointerY: tableCardDims.height * 0.4,\n } as INudgeProps,\n elementToHighlight: <></>,\n });\n\n nextCoachmark(journeyId, false, 100); // Show coachmark => Each table has 3... and Hide the previous two\n nextCoachmark(journeyId, true, 2000); // Show nudge => Pick a level\n\n const startAnimationOnLabelAgain = setTimeout(() => {\n clearTimeout(startAnimationOnLabelAgain);\n highlightedTableRef.current?.startLabelAnimation('YELLOW_4');\n }, 3000);\n },\n [addCoachmark, endJourney, journeyId, nextCoachmark],\n );\n\n const goToTableLauncher = useCallback(() => {\n playButtonSound();\n carouselRefs.current?.goToIndex(TABLE_CARD_INDEX);\n nextCoachmark(journeyId, false, 1000);\n\n trackAnalytics(PLATFORM_EVENTS_STUDENT.ONBOARDING_STEP_VIEWED, {\n step: Action.TABLES,\n });\n\n const showNudge = setTimeout(() => {\n clearTimeout(showNudge);\n originalTableRef.current?.setLabelVisiblity(false);\n nextCoachmark(journeyId, true);\n }, 3000);\n\n const animateLabel = setTimeout(() => {\n clearTimeout(animateLabel);\n highlightedTableRef.current?.startLabelAnimation('YELLOW_4');\n }, 3100);\n }, [carouselRefs, journeyId, nextCoachmark, playButtonSound, trackAnalytics]);\n\n const startJourney = useCallback(\n (tablesData: ITables) => {\n if (isJourneyInProgress.current) {\n return;\n }\n\n const paginationList = carouselRefs.current?.indicatorRefs;\n const carouselNextBtnRef = carouselRefs.current?.nextBtnRef;\n const tablePaginationRef = paginationList?.[TABLE_CARD_INDEX];\n\n if (\n !originalTableRef.current?.segmentedCardWrapperRef.current ||\n !originalTableRef.current?.labelRef.current ||\n !paginationList ||\n !carouselNextBtnRef?.current ||\n !tablePaginationRef ||\n !tablePaginationRef.current\n ) {\n return;\n }\n\n isJourneyInProgress.current = true;\n\n const labelDims = originalTableRef.current.labelRef.current.getBoundingClientRect();\n const tableCardDims =\n originalTableRef.current?.segmentedCardWrapperRef.current.getBoundingClientRect();\n\n setJourney(journeyId, []);\n\n // TAKE THE USER TO THE TABLE CARD\n if (carouselRefs.current.currentIndex === PUZZLE_CARD_INDEX) {\n addCoachmark(journeyId, {\n originalElementToHighlightRef: carouselRefs.current?.nextBtnRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n indicator: {\n nudge: 'click',\n content: (\n <Text $renderAs=\"ab1\" $color=\"WHITE\">\n Click to proceed\n </Text>\n ),\n nudgePointerX: 0,\n nudgePointerY: 0,\n } as INudgeProps,\n elementToHighlight: (\n <IconButton\n renderAs=\"secondary\"\n Icon={CaratRightIcon}\n onClick={goToTableLauncher}\n analyticsLabel={GAME_LAUNCHER_ANALYTICS_EVENTS.JOURNEY_NEXT_ACTIVITY}\n />\n ),\n });\n nextCoachmark(journeyId, false, 500); // Show nudge => Click to proceed\n } else {\n addCoachmark(journeyId, {\n originalElementToHighlightRef: tablePaginationRef as React.RefObject<HTMLDivElement>,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: <S.Indicator $isActive={false} />,\n indicator: {\n position: 'bottom',\n backgroundColor: 'YELLOW_4',\n width: 52,\n tooltipItem: (\n <FlexView\n $position=\"absolute\"\n $flexDirection=\"row\"\n style={{ top: 6, left: 8, cursor: 'pointer' }}\n onClick={goToTableLauncher}\n >\n <Text $renderAs=\"ab2-bold\">NEW</Text>\n </FlexView>\n ),\n tooltipYCoOrdinates: 14, // Need some offset in Y direction from top\n } as IArrowTooltipProps,\n });\n addCoachmark(journeyId, {\n originalElementToHighlightRef: tablePaginationRef as React.RefObject<HTMLDivElement>,\n isActive: false,\n type: IndicatorType.NUDGE,\n indicator: {\n nudge: 'click',\n content: '',\n nudgePointerY: 20,\n } as INudgeProps,\n elementToHighlight: <></>,\n });\n nextCoachmark(journeyId, false, 500); // Show Coachmark => NEW\n nextCoachmark(journeyId, true, 1500); // Show Nudge over Coachmark\n }\n\n // SHOW THE USER SELECT A TABLE\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.labelRef,\n isActive: false,\n type: IndicatorType.TOOLTIP,\n elementToHighlight: <></>,\n indicator: {\n position: 'right',\n backgroundColor: 'YELLOW_4',\n width: 264,\n tooltipItem: (\n <FlexView>\n <Text $renderAs=\"ab2-bold\">\n Get faster at multiplication! Practice everyday and become a Tables champ.\n </Text>\n </FlexView>\n ),\n tooltipXCoOrdinates: labelDims.width + 50,\n tooltipYCoOrdinates: labelDims.height / 2,\n } as IArrowTooltipProps,\n });\n\n addCoachmark(journeyId, {\n originalElementToHighlightRef: originalTableRef.current.segmentedCardWrapperRef,\n isActive: false,\n type: IndicatorType.NUDGE,\n indicator: {\n nudge: 'click',\n content: (\n <Text $renderAs=\"ab1\" $color=\"WHITE\">\n {'Pick a table to start'}\n </Text>\n ),\n nudgePointerX: tableCardDims.width / 2 + 50,\n nudgePointerY: tableCardDims.height / 2,\n } as INudgeProps,\n elementToHighlight: (\n <TablesCard\n ref={highlightedTableRef}\n label={tablesData.label}\n data={tablesData.data}\n onPress={() => {}}\n onPressTableSegment={tableInfo => handleTableSegmentClick(tablesData, tableInfo)}\n />\n ),\n });\n },\n [\n addCoachmark,\n carouselRefs,\n goToTableLauncher,\n handleTableSegmentClick,\n journeyId,\n nextCoachmark,\n setJourney,\n ],\n );\n\n return {\n tableRef: originalTableRef,\n startJourney,\n };\n};\n"],"names":["useTableLauncherJourney","carouselRefs","onTableSegmentClick","onJourneyComplete","journeyId","JOURNEY_ID_STUDENT","originalTableRef","useRef","highlightedTableRef","isJourneyInProgress","playButtonSound","useCircleSounds","nextCoachmark","setJourney","addCoachmark","useJourney","trackAnalytics","useUIContext","endJourney","useCallback","tableDetails","PLATFORM_EVENTS_STUDENT","Action","_a","_b","handleTableSegmentClick","launcherData","tableData","segmentedCardDims","tableCardDims","_c","IndicatorType","jsx","TablesCard","FlexView","Text","Fragment","startAnimationOnLabelAgain","goToTableLauncher","TABLE_CARD_INDEX","showNudge","animateLabel","startJourney","tablesData","paginationList","carouselNextBtnRef","tablePaginationRef","_d","labelDims","_e","PUZZLE_CARD_INDEX","_f","IconButton","CaratRightIcon","GAME_LAUNCHER_ANALYTICS_EVENTS","S.Indicator","tableInfo"],"mappings":"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"}
@@ -1,17 +0,0 @@
1
- import i from "styled-components";
2
- import { RAINBOW_COLOR_ANIMATION_DURATION as r } from "../../constants.js";
3
- import { rainbowColorAnimation as n } from "../../helper.js";
4
- import { ARC_Z_INDEX as s } from "./constants.js";
5
- const p = i.svg`
6
- position: absolute;
7
- z-index: ${s};
8
- `, A = i.path`
9
- stroke: ${({ theme: o, stroke: t }) => o.colors[t]};
10
- animation: ${({ $playRainbowColors: o }) => o ? n : "undefined"}
11
- ${r}s ease infinite forwards;
12
- `;
13
- export {
14
- A as Path,
15
- p as Svg
16
- };
17
- //# sourceMappingURL=animated-arc-styled.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"animated-arc-styled.js","sources":["../../../../../../src/features/post-game-stats/digital-meter/comp/animated-arc/animated-arc-styled.tsx"],"sourcesContent":["import type { TColorNames } from '../../../../ui/types';\n\nimport styled from 'styled-components';\n\nimport { RAINBOW_COLOR_ANIMATION_DURATION } from '../../constants';\nimport { rainbowColorAnimation } from '../../helper';\nimport { ARC_Z_INDEX } from './constants';\n\nexport const Svg = styled.svg`\n position: absolute;\n z-index: ${ARC_Z_INDEX};\n`;\n\nexport const Path = styled.path<{ stroke: TColorNames; $playRainbowColors: boolean }>`\n stroke: ${({ theme, stroke }) => theme.colors[stroke]};\n animation: ${({ $playRainbowColors }) =>\n $playRainbowColors ? rainbowColorAnimation : 'undefined'}\n ${RAINBOW_COLOR_ANIMATION_DURATION}s ease infinite forwards;\n`;\n"],"names":["Svg","styled","ARC_Z_INDEX","Path","theme","stroke","$playRainbowColors","rainbowColorAnimation","RAINBOW_COLOR_ANIMATION_DURATION"],"mappings":";;;;AAQO,MAAMA,IAAMC,EAAO;AAAA;AAAA,aAEbC,CAAW;AAAA,GAGXC,IAAOF,EAAO;AAAA,YACf,CAAC,EAAE,OAAAG,GAAO,QAAAC,EAAA,MAAaD,EAAM,OAAOC,CAAM,CAAC;AAAA,eACxC,CAAC,EAAE,oBAAAC,EAAA,MACZA,IAAqBC,IAAwB,WAAW;AAAA,MACxDC,CAAgC;AAAA;"}
@@ -1,47 +0,0 @@
1
- import { jsx as l } from "react/jsx-runtime";
2
- import { useRef as A, useLayoutEffect as $ } from "react";
3
- import { describeArc as R } from "../../helper.js";
4
- import { Svg as k, Path as w } from "./animated-arc-styled.js";
5
- import { ADJUSTED_START_ANGLE as D } from "./constants.js";
6
- const x = ({
7
- radius: e,
8
- strokeWidth: n,
9
- color: h,
10
- targetAngle: m,
11
- startAngle: p = 0,
12
- duration: r = 2,
13
- mode: o = "draw",
14
- delay: s = 0,
15
- playRainbowColors: y = !1
16
- }) => {
17
- const a = A(null), g = -D + p, i = e, u = e - n / 2, c = R(i, i, u, g, m);
18
- return $(() => {
19
- const t = a.current;
20
- if (t) {
21
- if (o === "draw") {
22
- const f = t.getTotalLength();
23
- t.style.strokeDasharray = `${f}`, t.style.strokeDashoffset = `${f}`, t.getBoundingClientRect(), requestAnimationFrame(() => {
24
- t.style.transition = `stroke-dashoffset ${r}s linear ${s}s`, t.style.strokeDashoffset = "0";
25
- });
26
- }
27
- o === "fade" && (t.style.opacity = "0", t.getBoundingClientRect(), requestAnimationFrame(() => {
28
- t.style.transition = `opacity 0s ease-in-out ${s}s`, t.style.opacity = "1";
29
- }));
30
- }
31
- }, [c, o, r, s]), /* @__PURE__ */ l(k, { width: 2 * e, height: 2 * e, viewBox: `0 0 ${2 * e} ${2 * e}`, children: /* @__PURE__ */ l(
32
- w,
33
- {
34
- ref: a,
35
- d: c,
36
- fill: "none",
37
- stroke: h,
38
- strokeWidth: n,
39
- strokeLinecap: "butt",
40
- $playRainbowColors: y
41
- }
42
- ) });
43
- };
44
- export {
45
- x as AnimatedArc
46
- };
47
- //# sourceMappingURL=animated-arc.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"animated-arc.js","sources":["../../../../../../src/features/post-game-stats/digital-meter/comp/animated-arc/animated-arc.tsx"],"sourcesContent":["import type { IAnimatedArcProps } from './animated-arc-types';\n\nimport React, { useRef, useLayoutEffect } from 'react';\n\nimport { describeArc } from '../../helper';\nimport * as Styled from './animated-arc-styled';\nimport { ADJUSTED_START_ANGLE } from './constants';\n\nexport const AnimatedArc: React.FC<IAnimatedArcProps> = ({\n radius,\n strokeWidth,\n color,\n targetAngle,\n startAngle = 0,\n duration = 2,\n mode = 'draw',\n delay = 0,\n playRainbowColors = false,\n}) => {\n const pathRef = useRef<SVGPathElement>(null);\n\n const adjustedStartAngle = -ADJUSTED_START_ANGLE + startAngle;\n const center = radius;\n const arcRadius = radius - strokeWidth / 2; // draw arc inside the visible bounds\n const arcPath = describeArc(center, center, arcRadius, adjustedStartAngle, targetAngle);\n\n useLayoutEffect(() => {\n const path = pathRef.current;\n\n if (!path) return;\n\n if (mode === 'draw') {\n const length = path.getTotalLength();\n\n path.style.strokeDasharray = `${length}`;\n path.style.strokeDashoffset = `${length}`;\n path.getBoundingClientRect();\n\n requestAnimationFrame(() => {\n path.style.transition = `stroke-dashoffset ${duration}s linear ${delay}s`;\n path.style.strokeDashoffset = '0';\n });\n }\n\n if (mode === 'fade') {\n path.style.opacity = '0';\n path.getBoundingClientRect();\n\n requestAnimationFrame(() => {\n path.style.transition = `opacity 0s ease-in-out ${delay}s`;\n path.style.opacity = '1';\n });\n }\n }, [arcPath, mode, duration, delay]);\n\n return (\n <Styled.Svg width={2 * radius} height={2 * radius} viewBox={`0 0 ${2 * radius} ${2 * radius}`}>\n <Styled.Path\n ref={pathRef}\n d={arcPath}\n fill=\"none\"\n stroke={color}\n strokeWidth={strokeWidth}\n strokeLinecap=\"butt\"\n $playRainbowColors={playRainbowColors}\n />\n </Styled.Svg>\n );\n};\n"],"names":["AnimatedArc","radius","strokeWidth","color","targetAngle","startAngle","duration","mode","delay","playRainbowColors","pathRef","useRef","adjustedStartAngle","ADJUSTED_START_ANGLE","center","arcRadius","arcPath","describeArc","useLayoutEffect","path","length","Styled.Svg","jsx","Styled.Path"],"mappings":";;;;;AAQO,MAAMA,IAA2C,CAAC;AAAA,EACvD,QAAAC;AAAA,EACA,aAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,UAAAC,IAAW;AAAA,EACX,MAAAC,IAAO;AAAA,EACP,OAAAC,IAAQ;AAAA,EACR,mBAAAC,IAAoB;AACtB,MAAM;AACE,QAAAC,IAAUC,EAAuB,IAAI,GAErCC,IAAqB,CAACC,IAAuBR,GAC7CS,IAASb,GACTc,IAAYd,IAASC,IAAc,GACnCc,IAAUC,EAAYH,GAAQA,GAAQC,GAAWH,GAAoBR,CAAW;AAEtF,SAAAc,EAAgB,MAAM;AACpB,UAAMC,IAAOT,EAAQ;AAErB,QAAKS,GAEL;AAAA,UAAIZ,MAAS,QAAQ;AACb,cAAAa,IAASD,EAAK;AAEf,QAAAA,EAAA,MAAM,kBAAkB,GAAGC,CAAM,IACjCD,EAAA,MAAM,mBAAmB,GAAGC,CAAM,IACvCD,EAAK,sBAAsB,GAE3B,sBAAsB,MAAM;AAC1B,UAAAA,EAAK,MAAM,aAAa,qBAAqBb,CAAQ,YAAYE,CAAK,KACtEW,EAAK,MAAM,mBAAmB;AAAA,QAAA,CAC/B;AAAA,MACH;AAEA,MAAIZ,MAAS,WACXY,EAAK,MAAM,UAAU,KACrBA,EAAK,sBAAsB,GAE3B,sBAAsB,MAAM;AACrB,QAAAA,EAAA,MAAM,aAAa,0BAA0BX,CAAK,KACvDW,EAAK,MAAM,UAAU;AAAA,MAAA,CACtB;AAAA;AAAA,KAEF,CAACH,GAAST,GAAMD,GAAUE,CAAK,CAAC,qBAGhCa,GAAA,EAAW,OAAO,IAAIpB,GAAQ,QAAQ,IAAIA,GAAQ,SAAS,OAAO,IAAIA,CAAM,IAAI,IAAIA,CAAM,IACzF,UAAA,gBAAAqB;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,KAAKb;AAAA,MACL,GAAGM;AAAA,MACH,MAAK;AAAA,MACL,QAAQb;AAAA,MACR,aAAAD;AAAA,MACA,eAAc;AAAA,MACd,oBAAoBO;AAAA,IAAA;AAAA,EAExB,EAAA,CAAA;AAEJ;"}
@@ -1,6 +0,0 @@
1
- const A = 1, _ = 150;
2
- export {
3
- _ as ADJUSTED_START_ANGLE,
4
- A as ARC_Z_INDEX
5
- };
6
- //# sourceMappingURL=constants.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"constants.js","sources":["../../../../../../src/features/post-game-stats/digital-meter/comp/animated-arc/constants.ts"],"sourcesContent":["export const ARC_Z_INDEX = 1;\n\nexport const ADJUSTED_START_ANGLE = 150;\n"],"names":["ARC_Z_INDEX","ADJUSTED_START_ANGLE"],"mappings":"AAAO,MAAMA,IAAc,GAEdC,IAAuB;"}
@@ -1,16 +0,0 @@
1
- import { ARC_Z_INDEX as _ } from "./comp/animated-arc/constants.js";
2
- const I = 300, N = 2, A = _ + 1, E = A + 1, T = E + 1, O = 99 / 30, o = 2 / 30, L = 56 / 30, t = 12 / 30, D = 20 / 30, c = 43 / 30;
3
- export {
4
- N as BORDER_OFFSET,
5
- E as CONTENT_CONTAINER_Z_INDEX,
6
- A as LINE_MARKING_Z_INDEX,
7
- T as NUMBER_MARKING_Z_INDEX,
8
- t as PROGRESS_FILL_DELAY,
9
- D as PROGRESS_FILL_DURATION,
10
- c as RAINBOW_COLOR_ANIMATION_DURATION,
11
- L as TARGET_ACHIEVED_DELAY,
12
- o as TARGET_HELPER_TEXT_APPEAR_DELAY,
13
- O as TOTAL_ANIMATION_DURATION,
14
- I as TOTAL_ARC_AVAILABLE
15
- };
16
- //# sourceMappingURL=constants.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"constants.js","sources":["../../../../src/features/post-game-stats/digital-meter/constants.ts"],"sourcesContent":["import { ARC_Z_INDEX } from './comp/animated-arc/constants';\n\nexport const TOTAL_ARC_AVAILABLE = 300;\n\nexport const BORDER_OFFSET = 2;\nexport const LINE_MARKING_Z_INDEX = ARC_Z_INDEX + 1;\nexport const CONTENT_CONTAINER_Z_INDEX = LINE_MARKING_Z_INDEX + 1;\nexport const NUMBER_MARKING_Z_INDEX = CONTENT_CONTAINER_Z_INDEX + 1;\n\n// animation details\nexport const TOTAL_ANIMATION_DURATION = 99 / 30; // in 99 frames\nexport const TARGET_HELPER_TEXT_APPEAR_DELAY = 2 / 30; // delay of 2 frames\nexport const TARGET_ACHIEVED_DELAY = 56 / 30; // 56 frames\nexport const PROGRESS_FILL_DELAY = 12 / 30; // delay of 12 frames\nexport const PROGRESS_FILL_DURATION = 20 / 30; // in 20 frames\nexport const RAINBOW_COLOR_ANIMATION_DURATION = 43 / 30; // 43 frames;\n"],"names":["TOTAL_ARC_AVAILABLE","BORDER_OFFSET","LINE_MARKING_Z_INDEX","ARC_Z_INDEX","CONTENT_CONTAINER_Z_INDEX","NUMBER_MARKING_Z_INDEX","TOTAL_ANIMATION_DURATION","TARGET_HELPER_TEXT_APPEAR_DELAY","TARGET_ACHIEVED_DELAY","PROGRESS_FILL_DELAY","PROGRESS_FILL_DURATION","RAINBOW_COLOR_ANIMATION_DURATION"],"mappings":";AAEO,MAAMA,IAAsB,KAEtBC,IAAgB,GAChBC,IAAuBC,IAAc,GACrCC,IAA4BF,IAAuB,GACnDG,IAAyBD,IAA4B,GAGrDE,IAA2B,KAAK,IAChCC,IAAkC,IAAI,IACtCC,IAAwB,KAAK,IAC7BC,IAAsB,KAAK,IAC3BC,IAAyB,KAAK,IAC9BC,IAAmC,KAAK;"}
@@ -1,87 +0,0 @@
1
- import o, { keyframes as e } from "styled-components";
2
- import { GAME_LAUNCHER_SIZE as r, GAME_LAUNCHER_SIZE_LARGE as s } from "../../circle-games/game-launcher/comps/card-container/constants.js";
3
- import i from "../../ui/text/text.js";
4
- import { ADJUSTED_START_ANGLE as n } from "./comp/animated-arc/constants.js";
5
- import { CONTENT_CONTAINER_Z_INDEX as l, LINE_MARKING_Z_INDEX as d, NUMBER_MARKING_Z_INDEX as m, TARGET_HELPER_TEXT_APPEAR_DELAY as a, RAINBOW_COLOR_ANIMATION_DURATION as p } from "./constants.js";
6
- import { rainbowColorAnimation as f } from "./helper.js";
7
- const g = o.div`
8
- height: ${r}px;
9
- width: ${r}px;
10
- background-color: ${({ theme: t }) => t.colors.BLACK_2};
11
- display: flex;
12
- align-items: center;
13
- justify-content: center;
14
- position: relative;
15
- border-radius: 100%;
16
- border: 1px solid ${({ theme: t }) => t.colors.WHITE};
17
- animation: ${({ $isTargetAchieved: t }) => t ? e`100%{transform: scale(1.02)}` : "unset"}
18
- 0.133s ease alternate;
19
- `, N = o.div`
20
- display: flex;
21
- justify-content: center;
22
- align-items: center;
23
- position: absolute;
24
- z-index: ${l};
25
- height: 92%;
26
- width: 92%;
27
- border-radius: 100%;
28
- background-color: ${({ theme: t }) => t.colors.BLACK_2};
29
- `, b = o.div`
30
- position: relative;
31
- flex-grow: 1;
32
- bottom: ${r === s ? -8 : -6}px;
33
- `;
34
- o.div`
35
- position: absolute;
36
- `;
37
- const u = o.div`
38
- width: ${r / 2}px;
39
- height: 2px;
40
- position: absolute;
41
- background-color: ${({ theme: t }) => t.colors.BLACK_2};
42
- transform-style: preserve-3d;
43
- backface-visibility: hidden;
44
- transform-origin: left;
45
- transform: rotate(${({ $angle: t }) => -240 + t}deg);
46
- left: ${r / 2}px;
47
- top: ${r / 2}px;
48
- z-index: ${d};
49
- `, T = o.div`
50
- position: absolute;
51
- height: ${r - r * 0.0625 - 10}px;
52
- transform: rotate(${({ $angle: t }) => -n + t}deg);
53
- z-index: ${m};
54
- `, h = o.div`
55
- transform: rotate(${({ $angle: t }) => n - t}deg);
56
- `, C = o.div`
57
- position: absolute;
58
- top: 0;
59
- transform: ${({ top: t }) => `translateY(${t}px)`};
60
- `, R = o(i)`
61
- animation: ${e`from{transform: translateY(-6px)} to{transform: translateY(0)}`} 0.133s
62
- ease-in-out ${a}s forwards;
63
- `, I = o(i)`
64
- animation: ${e`from{transform: translateY(-6px)} to{transform: translateY(0)}`} 0.133s
65
- ease ${a}s forwards;
66
- `;
67
- o.div`
68
- height: 100%;
69
- width: 100%;
70
- `;
71
- const v = o(i)`
72
- animation: ${({ $isTargetAchieved: t }) => t ? f : "unset"}
73
- ${p}s ease infinite forwards;
74
- `;
75
- export {
76
- C as BottomAbsoluteView,
77
- N as ContentContainer,
78
- g as DigitalMeter,
79
- R as HelperTextPrimary,
80
- I as HelperTextSecondary,
81
- u as LineMarking,
82
- T as MarkingContainer,
83
- h as MarkingText,
84
- b as NumberCountContainer,
85
- v as RainboxColorText
86
- };
87
- //# sourceMappingURL=digital-meter-styled.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"digital-meter-styled.js","sources":["../../../../src/features/post-game-stats/digital-meter/digital-meter-styled.tsx"],"sourcesContent":["import styled, { keyframes } from 'styled-components';\n\nimport {\n GAME_LAUNCHER_SIZE,\n GAME_LAUNCHER_SIZE_LARGE,\n} from '../../circle-games/game-launcher/comps/card-container/constants';\nimport Text from '../../ui/text/text';\nimport { ADJUSTED_START_ANGLE } from './comp/animated-arc/constants';\nimport {\n CONTENT_CONTAINER_Z_INDEX,\n LINE_MARKING_Z_INDEX,\n NUMBER_MARKING_Z_INDEX,\n RAINBOW_COLOR_ANIMATION_DURATION,\n TARGET_HELPER_TEXT_APPEAR_DELAY,\n} from './constants';\nimport { rainbowColorAnimation } from './helper';\n\nexport const DigitalMeter = styled.div<{ $isTargetAchieved: boolean }>`\n height: ${GAME_LAUNCHER_SIZE}px;\n width: ${GAME_LAUNCHER_SIZE}px;\n background-color: ${({ theme }) => theme.colors.BLACK_2};\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n border-radius: 100%;\n border: 1px solid ${({ theme }) => theme.colors.WHITE};\n animation: ${({ $isTargetAchieved }) =>\n $isTargetAchieved ? keyframes`100%{transform: scale(1.02)}` : 'unset'}\n 0.133s ease alternate;\n`;\n\nexport const ContentContainer = styled.div`\n display: flex;\n justify-content: center;\n align-items: center;\n position: absolute;\n z-index: ${CONTENT_CONTAINER_Z_INDEX};\n height: 92%;\n width: 92%;\n border-radius: 100%;\n background-color: ${({ theme }) => theme.colors.BLACK_2};\n`;\n\nexport const NumberCountContainer = styled.div`\n position: relative;\n flex-grow: 1;\n bottom: ${GAME_LAUNCHER_SIZE === GAME_LAUNCHER_SIZE_LARGE ? -8 : -6}px;\n`;\n\nexport const AbsoluteView = styled.div`\n position: absolute;\n`;\n\nexport const LineMarking = styled.div<{\n $angle: number;\n}>`\n width: ${GAME_LAUNCHER_SIZE / 2}px;\n height: 2px;\n position: absolute;\n background-color: ${({ theme }) => theme.colors.BLACK_2};\n transform-style: preserve-3d;\n backface-visibility: hidden;\n transform-origin: left;\n transform: rotate(${({ $angle }) => -240 + $angle}deg);\n left: ${GAME_LAUNCHER_SIZE / 2}px;\n top: ${GAME_LAUNCHER_SIZE / 2}px;\n z-index: ${LINE_MARKING_Z_INDEX};\n`;\n\nexport const MarkingContainer = styled.div<{ $angle: number }>`\n position: absolute;\n height: ${GAME_LAUNCHER_SIZE - GAME_LAUNCHER_SIZE * 0.0625 - 10}px;\n transform: rotate(${({ $angle }) => -ADJUSTED_START_ANGLE + $angle}deg);\n z-index: ${NUMBER_MARKING_Z_INDEX};\n`;\n\nexport const MarkingText = styled.div<{ $angle: number }>`\n transform: rotate(${({ $angle }) => ADJUSTED_START_ANGLE - $angle}deg);\n`;\n\nexport const BottomAbsoluteView = styled.div<{ top: number }>`\n position: absolute;\n top: 0;\n transform: ${({ top }) => `translateY(${top}px)`};\n`;\n\nexport const HelperTextPrimary = styled(Text)`\n animation: ${keyframes`from{transform: translateY(-6px)} to{transform: translateY(0)}`} 0.133s\n ease-in-out ${TARGET_HELPER_TEXT_APPEAR_DELAY}s forwards;\n`;\n\nexport const HelperTextSecondary = styled(Text)`\n animation: ${keyframes`from{transform: translateY(-6px)} to{transform: translateY(0)}`} 0.133s\n ease ${TARGET_HELPER_TEXT_APPEAR_DELAY}s forwards;\n`;\n\nexport const TargetAchievedTextLottie = styled.div`\n height: 100%;\n width: 100%;\n`;\n\nexport const RainboxColorText = styled(Text)<{ $isTargetAchieved: boolean }>`\n animation: ${({ $isTargetAchieved }) => ($isTargetAchieved ? rainbowColorAnimation : 'unset')}\n ${RAINBOW_COLOR_ANIMATION_DURATION}s ease infinite forwards;\n`;\n"],"names":["DigitalMeter","styled","GAME_LAUNCHER_SIZE","theme","$isTargetAchieved","keyframes","ContentContainer","CONTENT_CONTAINER_Z_INDEX","NumberCountContainer","GAME_LAUNCHER_SIZE_LARGE","LineMarking","$angle","LINE_MARKING_Z_INDEX","MarkingContainer","ADJUSTED_START_ANGLE","NUMBER_MARKING_Z_INDEX","MarkingText","BottomAbsoluteView","top","HelperTextPrimary","Text","TARGET_HELPER_TEXT_APPEAR_DELAY","HelperTextSecondary","RainboxColorText","rainbowColorAnimation","RAINBOW_COLOR_ANIMATION_DURATION"],"mappings":";;;;;;AAiBO,MAAMA,IAAeC,EAAO;AAAA,YACvBC,CAAkB;AAAA,WACnBA,CAAkB;AAAA,sBACP,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAMnC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA,eACxC,CAAC,EAAE,mBAAAC,QACZA,IAAoBC,kCAA0C,OAAO;AAAA;AAAA,GAI9DC,IAAmBL,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,aAK1BM,CAAyB;AAAA;AAAA;AAAA;AAAA,sBAIhB,CAAC,EAAE,OAAAJ,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA,GAG5CK,IAAuBP,EAAO;AAAA;AAAA;AAAA,YAG/BC,MAAuBO,IAA2B,KAAK,EAAE;AAAA;AAGzCR,EAAO;AAAA;AAAA;AAI5B,MAAMS,IAAcT,EAAO;AAAA,WAGvBC,IAAqB,CAAC;AAAA;AAAA;AAAA,sBAGX,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA,sBAInC,CAAC,EAAE,QAAAQ,EAAO,MAAM,OAAOA,CAAM;AAAA,UACzCT,IAAqB,CAAC;AAAA,SACvBA,IAAqB,CAAC;AAAA,aAClBU,CAAoB;AAAA,GAGpBC,IAAmBZ,EAAO;AAAA;AAAA,YAE3BC,IAAqBA,IAAqB,SAAS,EAAE;AAAA,sBAC3C,CAAC,EAAE,QAAAS,EAAA,MAAa,CAACG,IAAuBH,CAAM;AAAA,aACvDI,CAAsB;AAAA,GAGtBC,IAAcf,EAAO;AAAA,sBACZ,CAAC,EAAE,QAAAU,QAAaG,IAAuBH,CAAM;AAAA,GAGtDM,IAAqBhB,EAAO;AAAA;AAAA;AAAA,eAG1B,CAAC,EAAE,KAAAiB,EAAU,MAAA,cAAcA,CAAG,KAAK;AAAA,GAGrCC,IAAoBlB,EAAOmB,CAAI;AAAA,eAC7Bf,iEAAyE;AAAA,kBACtEgB,CAA+B;AAAA,GAGpCC,IAAsBrB,EAAOmB,CAAI;AAAA,eAC/Bf,iEAAyE;AAAA,WAC7EgB,CAA+B;AAAA;AAGFpB,EAAO;AAAA;AAAA;AAAA;AAKlC,MAAAsB,IAAmBtB,EAAOmB,CAAI;AAAA,eAC5B,CAAC,EAAE,mBAAAhB,EAAA,MAAyBA,IAAoBoB,IAAwB,OAAQ;AAAA,MACzFC,CAAgC;AAAA;"}
@@ -1,185 +0,0 @@
1
- import { jsxs as c, jsx as r, Fragment as E } from "react/jsx-runtime";
2
- import { memo as M, useState as O, useEffect as W } from "react";
3
- import { LOTTIE as y } from "../../../assets/lottie/lottie.js";
4
- import { GAME_LAUNCHER_SIZE as i, GAME_LAUNCHER_SIZE_LARGE as l } from "../../circle-games/game-launcher/comps/card-container/constants.js";
5
- import _ from "../../ui/layout/flex-view.js";
6
- import w from "../../ui/lottie-animation/lottie-animation.js";
7
- import $ from "../../ui/separator/separator.js";
8
- import L from "../../ui/text/text.js";
9
- import { NumberCountAnimation as B } from "../number-count-animation/number-count-animation.js";
10
- import { AnimatedArc as f } from "./comp/animated-arc/animated-arc.js";
11
- import { TARGET_ACHIEVED_DELAY as b, TOTAL_ARC_AVAILABLE as m, BORDER_OFFSET as g, PROGRESS_FILL_DURATION as s, PROGRESS_FILL_DELAY as I, TOTAL_ANIMATION_DURATION as U } from "./constants.js";
12
- import { DigitalMeter as u, ContentContainer as P, NumberCountContainer as j, RainboxColorText as R, LineMarking as k, MarkingContainer as C, MarkingText as D, BottomAbsoluteView as N, HelperTextPrimary as Y, HelperTextSecondary as Z } from "./digital-meter-styled.js";
13
- const tr = M(
14
- ({
15
- show: T,
16
- value: a,
17
- maxValue: n,
18
- targetValue: o = 0,
19
- displayText: S,
20
- progressType: d,
21
- helperTextPrimary: G,
22
- helperTextSecondary: H,
23
- onComplete: p
24
- }) => {
25
- const [h, F] = O(!1);
26
- return W(() => {
27
- let t, e;
28
- const A = !!(o && a >= o);
29
- return T && (A && (t = setTimeout(() => {
30
- F(!0);
31
- }, b * 1e3)), e = setTimeout(() => {
32
- p();
33
- }, (A ? U : b) * 1e3)), () => {
34
- t && clearTimeout(t), e && clearTimeout(e);
35
- };
36
- }, [T, a, o, p]), T ? /* @__PURE__ */ c(u, { $isTargetAchieved: h, children: [
37
- /* @__PURE__ */ r(
38
- f,
39
- {
40
- targetAngle: m,
41
- strokeWidth: i === l ? 16 : 12,
42
- color: "BLACK_5",
43
- radius: (i - g) / 2,
44
- duration: 0
45
- }
46
- ),
47
- /* @__PURE__ */ r(P, { children: /* @__PURE__ */ c(_, { $flexDirection: "column", $alignItems: "center", children: [
48
- /* @__PURE__ */ c(_, { $flexDirection: "row", $alignItems: "flex-end", children: [
49
- /* @__PURE__ */ r(j, { children: /* @__PURE__ */ r(
50
- R,
51
- {
52
- $renderAs: i === l ? "ah1" : "ah2",
53
- $color: "GREEN_4",
54
- $isTargetAchieved: h,
55
- children: /* @__PURE__ */ r(
56
- B,
57
- {
58
- initialValue: 0,
59
- targetValue: Math.floor(a),
60
- durationInSec: s,
61
- delayInSec: I
62
- }
63
- )
64
- }
65
- ) }),
66
- d === "stepper" && /* @__PURE__ */ c(
67
- L,
68
- {
69
- $renderAs: i === l ? "ah4" : "ab1",
70
- $color: "WHITE",
71
- children: [
72
- "/",
73
- n
74
- ]
75
- }
76
- )
77
- ] }),
78
- /* @__PURE__ */ r($, { height: 8 }),
79
- /* @__PURE__ */ r(
80
- L,
81
- {
82
- $renderAs: i === l ? "ac3-black" : "ac4-black",
83
- $color: "WHITE_T_60",
84
- children: S
85
- }
86
- )
87
- ] }) }),
88
- d === "stepper" && Array.from({ length: a }, (t, e) => {
89
- const A = m / n;
90
- return /* @__PURE__ */ r(
91
- f,
92
- {
93
- startAngle: A * e,
94
- targetAngle: A,
95
- strokeWidth: i === l ? 16 : 12,
96
- color: "GREEN_4",
97
- radius: (i - g) / 2,
98
- mode: "fade",
99
- duration: s / n,
100
- delay: I + s / n * e,
101
- playRainbowColors: h
102
- },
103
- e
104
- );
105
- }),
106
- d === "stepper" && Array.from({ length: n + 1 }, (t, e) => {
107
- const A = m / n;
108
- return /* @__PURE__ */ c(E, { children: [
109
- /* @__PURE__ */ r(k, { $angle: A * e }, e + "linemarking"),
110
- /* @__PURE__ */ r(C, { $angle: A * e, children: /* @__PURE__ */ r(D, { $angle: A * e, children: /* @__PURE__ */ r(
111
- R,
112
- {
113
- $renderAs: i === l ? "ac3-black" : "ac4-black",
114
- $isTargetAchieved: e === o && h,
115
- $color: o && e === o ? "GREEN_4" : "WHITE_T_60",
116
- children: e
117
- }
118
- ) }) }, e)
119
- ] });
120
- }),
121
- d === "linear" && /* @__PURE__ */ c(E, { children: [
122
- /* @__PURE__ */ r(
123
- f,
124
- {
125
- targetAngle: a * m / n,
126
- strokeWidth: i === l ? 16 : 12,
127
- color: "GREEN_4",
128
- radius: (i - g) / 2,
129
- duration: s,
130
- delay: I,
131
- playRainbowColors: h
132
- }
133
- ),
134
- /* @__PURE__ */ c(E, { children: [
135
- o && /* @__PURE__ */ r(k, { $angle: o * m / n }),
136
- Array.from(/* @__PURE__ */ new Set([0, o, n])).map((t, e) => /* @__PURE__ */ r(
137
- C,
138
- {
139
- $angle: t * m / n,
140
- children: /* @__PURE__ */ r(D, { $angle: t * m / n, children: /* @__PURE__ */ r(
141
- R,
142
- {
143
- $renderAs: i === l ? "ac3-black" : "ac4-black",
144
- $color: o && t === o ? "GREEN_4" : "WHITE_T_60",
145
- $isTargetAchieved: a >= t && h && t === o,
146
- children: t
147
- }
148
- ) })
149
- },
150
- e
151
- ))
152
- ] })
153
- ] }),
154
- h && /* @__PURE__ */ r(N, { top: i, children: /* @__PURE__ */ r(w, { src: y.TARGET_ACHIEVED_TEXT }) }),
155
- !h && /* @__PURE__ */ c(N, { top: i, children: [
156
- /* @__PURE__ */ r($, { height: 25 }),
157
- /* @__PURE__ */ c(_, { $flexDirection: "column", $alignItems: "center", children: [
158
- /* @__PURE__ */ c(
159
- Y,
160
- {
161
- $renderAs: i === l ? "ac3-black" : "ac4-black",
162
- $color: "WHITE_T_60",
163
- children: [
164
- G,
165
- /* @__PURE__ */ r($, { height: i * 0.03 })
166
- ]
167
- }
168
- ),
169
- /* @__PURE__ */ r(
170
- Z,
171
- {
172
- $renderAs: i === l ? "ah4" : "ab1",
173
- $color: "WHITE",
174
- children: H
175
- }
176
- )
177
- ] })
178
- ] })
179
- ] }) : null;
180
- }
181
- );
182
- export {
183
- tr as DigitalMeter
184
- };
185
- //# sourceMappingURL=digital-meter.js.map