@cuemath/leap 3.5.30-as15 → 3.5.30-as16
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/circle-games/game-launcher/comps/carousel/carousel.js +51 -54
- package/dist/features/circle-games/game-launcher/comps/carousel/carousel.js.map +1 -1
- package/dist/features/timeline/monthly-report/comps/achievements/achievements.js +22 -31
- package/dist/features/timeline/monthly-report/comps/achievements/achievements.js.map +1 -1
- package/dist/features/timeline/monthly-report/comps/achievements/constant.js +17 -0
- package/dist/features/timeline/monthly-report/comps/achievements/constant.js.map +1 -0
- package/dist/features/timeline/monthly-report/comps/activities/constants.js +22 -21
- package/dist/features/timeline/monthly-report/comps/activities/constants.js.map +1 -1
- package/dist/features/timeline/monthly-report/comps/activities/utils.js.map +1 -1
- package/dist/features/ui/swipeable-carousel/constants.js +17 -0
- package/dist/features/ui/swipeable-carousel/constants.js.map +1 -0
- package/dist/features/ui/{swipable-carousel/swipable-carousel-styled.js → swipeable-carousel/swipeable-carousel-styled.js} +2 -2
- package/dist/features/ui/swipeable-carousel/swipeable-carousel-styled.js.map +1 -0
- package/dist/features/ui/swipeable-carousel/swipeable-carousel.js +145 -0
- package/dist/features/ui/swipeable-carousel/swipeable-carousel.js.map +1 -0
- package/dist/index.d.ts +6 -6
- package/dist/index.js +2 -2
- package/package.json +1 -1
- package/dist/features/ui/swipable-carousel/swipable-carousel-styled.js.map +0 -1
- package/dist/features/ui/swipable-carousel/swipable-carousel.js +0 -132
- package/dist/features/ui/swipable-carousel/swipable-carousel.js.map +0 -1
|
@@ -1,107 +1,104 @@
|
|
|
1
|
-
import { jsx as o, jsxs as
|
|
2
|
-
import { memo as
|
|
3
|
-
import
|
|
1
|
+
import { jsx as o, jsxs as $ } from "react/jsx-runtime";
|
|
2
|
+
import { memo as j, forwardRef as A, useRef as P, useState as S, useCallback as l, useMemo as E, createRef as D, useImperativeHandle as F, useEffect as v } from "react";
|
|
3
|
+
import u from "../../../../ui/hooks/use-click-handler.js";
|
|
4
4
|
import { useCircleSounds as H } from "../../../hooks/use-circle-sounds/use-circle-sounds.js";
|
|
5
|
-
import { CarouselItemContainer as K, ExtendedFlexView as
|
|
5
|
+
import { CarouselItemContainer as K, ExtendedFlexView as N, CarouselIdicatorContainer as V, AllGreenTickLottieWrapper as W } from "./carousel-styled.js";
|
|
6
6
|
import { CarouselIndicator as U } from "./carousel-indicator/carousel-indicator.js";
|
|
7
7
|
import Y from "../../../../ui/lottie-animation/lottie-animation.js";
|
|
8
8
|
import { LOTTIE as q } from "../../../../../assets/lottie/lottie.js";
|
|
9
9
|
import { allGreenTickLottienAimationSettings as z } from "./constants.js";
|
|
10
10
|
import { CircleSoundKey as B } from "../../../hooks/use-circle-sounds/use-circle-sounds-enums.js";
|
|
11
|
-
import G from "../../../../ui/
|
|
11
|
+
import G from "../../../../ui/swipeable-carousel/swipeable-carousel.js";
|
|
12
12
|
const J = ({
|
|
13
|
-
items:
|
|
14
|
-
defaultIndex:
|
|
15
|
-
analyticsSwipeLeft:
|
|
16
|
-
analyticsSwipeRight:
|
|
13
|
+
items: r,
|
|
14
|
+
defaultIndex: p = 0,
|
|
15
|
+
analyticsSwipeLeft: f,
|
|
16
|
+
analyticsSwipeRight: m,
|
|
17
17
|
analyticsIndicatorClick: d,
|
|
18
|
-
playAllGreenTickAnimation:
|
|
19
|
-
onAllGreenTickAnimationComplete:
|
|
18
|
+
playAllGreenTickAnimation: C,
|
|
19
|
+
onAllGreenTickAnimationComplete: n
|
|
20
20
|
}, w) => {
|
|
21
|
-
var
|
|
22
|
-
const { playSwipeSound:
|
|
23
|
-
analyticsLabel: C.analyticsLabel,
|
|
24
|
-
analyticsProps: C.analyticsProps
|
|
25
|
-
}), { handleClick: _ } = f({
|
|
21
|
+
var g;
|
|
22
|
+
const { playSwipeSound: y, play: L } = H(), c = P(!0), i = P(null), [a, I] = S(((g = i.current) == null ? void 0 : g.currentIndex) ?? p), [R, h] = S(!1), { handleClick: O } = u({
|
|
26
23
|
analyticsLabel: m.analyticsLabel,
|
|
27
24
|
analyticsProps: m.analyticsProps
|
|
28
|
-
}), { handleClick:
|
|
25
|
+
}), { handleClick: _ } = u({
|
|
26
|
+
analyticsLabel: f.analyticsLabel,
|
|
27
|
+
analyticsProps: f.analyticsProps
|
|
28
|
+
}), { handleClick: T } = u({
|
|
29
29
|
analyticsLabel: d.analyticsLabel,
|
|
30
30
|
analyticsProps: d.analyticsProps
|
|
31
|
-
}), k =
|
|
32
|
-
h(!1),
|
|
33
|
-
}, [
|
|
31
|
+
}), k = l(() => {
|
|
32
|
+
h(!1), n == null || n();
|
|
33
|
+
}, [n]), x = E(
|
|
34
34
|
() => ({
|
|
35
35
|
name: "complete",
|
|
36
36
|
callback: k
|
|
37
37
|
}),
|
|
38
38
|
[k]
|
|
39
|
-
), b =
|
|
39
|
+
), b = E(() => r.map(() => D()), [r]), s = l(
|
|
40
40
|
(e) => {
|
|
41
|
-
var
|
|
42
|
-
e < 0 || e >=
|
|
41
|
+
var t;
|
|
42
|
+
e < 0 || e >= r.length || e === a || ((t = i.current) == null || t.goToIndex(e), I(e));
|
|
43
43
|
},
|
|
44
|
-
[
|
|
45
|
-
),
|
|
44
|
+
[a, r.length]
|
|
45
|
+
), M = l(
|
|
46
46
|
(e) => {
|
|
47
|
-
|
|
47
|
+
y(), T(), I(e), s(e);
|
|
48
48
|
},
|
|
49
|
-
[T,
|
|
49
|
+
[T, y, s]
|
|
50
50
|
);
|
|
51
51
|
return F(w, () => ({
|
|
52
52
|
indicatorRefs: b,
|
|
53
|
-
currentIndex:
|
|
54
|
-
goToIndex:
|
|
55
|
-
})),
|
|
56
|
-
|
|
57
|
-
}, []),
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
}, [
|
|
61
|
-
const e = t.every((r) => r.indicatorType === "green-tick");
|
|
62
|
-
y && e && (I(B.ALL_ACTIVITIES_COMPLETE), h(!0));
|
|
63
|
-
}, [y, I, t]), /* @__PURE__ */ o(
|
|
53
|
+
currentIndex: a,
|
|
54
|
+
goToIndex: s
|
|
55
|
+
})), v(() => {
|
|
56
|
+
c.current && (c.current = !1);
|
|
57
|
+
}, []), v(() => {
|
|
58
|
+
const e = r.every((t) => t.indicatorType === "green-tick");
|
|
59
|
+
C && e && (L(B.ALL_ACTIVITIES_COMPLETE), h(!0));
|
|
60
|
+
}, [C, L, r]), /* @__PURE__ */ o(
|
|
64
61
|
G,
|
|
65
62
|
{
|
|
66
|
-
ref:
|
|
67
|
-
items:
|
|
68
|
-
defaultIndex:
|
|
69
|
-
transitionDuration:
|
|
63
|
+
ref: i,
|
|
64
|
+
items: r.map((e, t) => /* @__PURE__ */ o(K, { children: e.element }, t)),
|
|
65
|
+
defaultIndex: p,
|
|
66
|
+
transitionDuration: c.current ? 0 : 300,
|
|
70
67
|
onSwipeLeft: _,
|
|
71
68
|
onSwipeRight: O,
|
|
72
|
-
|
|
73
|
-
|
|
69
|
+
customNavigation: /* @__PURE__ */ o(
|
|
70
|
+
N,
|
|
74
71
|
{
|
|
75
72
|
$flexDirection: "row",
|
|
76
73
|
$alignItems: "center",
|
|
77
74
|
$justifyContent: "center",
|
|
78
75
|
$position: "absolute",
|
|
79
|
-
children: /* @__PURE__ */
|
|
80
|
-
R && /* @__PURE__ */ o(
|
|
76
|
+
children: /* @__PURE__ */ $(V, { children: [
|
|
77
|
+
R && /* @__PURE__ */ o(W, { children: /* @__PURE__ */ o(
|
|
81
78
|
Y,
|
|
82
79
|
{
|
|
83
80
|
src: q.DAILY_WORK_OUT_COMPLETE,
|
|
84
81
|
settings: z,
|
|
85
|
-
eventListener:
|
|
82
|
+
eventListener: x
|
|
86
83
|
}
|
|
87
84
|
) }),
|
|
88
|
-
|
|
85
|
+
r.map((e, t) => /* @__PURE__ */ o(
|
|
89
86
|
U,
|
|
90
87
|
{
|
|
91
|
-
ref: b[
|
|
88
|
+
ref: b[t],
|
|
92
89
|
indicatorType: e.indicatorType,
|
|
93
|
-
isActive:
|
|
94
|
-
textToShowInsideIndicator: (
|
|
95
|
-
onClick: () =>
|
|
90
|
+
isActive: t === a,
|
|
91
|
+
textToShowInsideIndicator: (t + 1).toString(),
|
|
92
|
+
onClick: () => M(t)
|
|
96
93
|
},
|
|
97
|
-
|
|
94
|
+
t
|
|
98
95
|
))
|
|
99
96
|
] })
|
|
100
97
|
}
|
|
101
98
|
)
|
|
102
99
|
}
|
|
103
100
|
);
|
|
104
|
-
}, se =
|
|
101
|
+
}, se = j(A(J));
|
|
105
102
|
export {
|
|
106
103
|
se as Carousel
|
|
107
104
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"carousel.js","sources":["../../../../../../src/features/circle-games/game-launcher/comps/carousel/carousel.tsx"],"sourcesContent":["import {\n type ForwardRefRenderFunction,\n memo,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n forwardRef,\n useImperativeHandle,\n createRef,\n} from 'react';\nimport { type AnimationEventName } from 'lottie-web';\n\nimport useClickHandler from '../../../../ui/hooks/use-click-handler';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport * as Styled from './carousel-styled';\nimport type { ICarouselProps, ICarouselRefs } from './carousel-types';\nimport { CarouselIndicator } from './carousel-indicator/carousel-indicator';\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport { LOTTIE } from '../../../../../assets/lottie/lottie';\nimport { allGreenTickLottienAimationSettings } from './constants';\nimport { CircleSoundKey } from '../../../hooks/use-circle-sounds/use-circle-sounds-enums';\nimport type {
|
|
1
|
+
{"version":3,"file":"carousel.js","sources":["../../../../../../src/features/circle-games/game-launcher/comps/carousel/carousel.tsx"],"sourcesContent":["import {\n type ForwardRefRenderFunction,\n memo,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n forwardRef,\n useImperativeHandle,\n createRef,\n} from 'react';\nimport { type AnimationEventName } from 'lottie-web';\n\nimport useClickHandler from '../../../../ui/hooks/use-click-handler';\nimport { useCircleSounds } from '../../../hooks/use-circle-sounds/use-circle-sounds';\nimport * as Styled from './carousel-styled';\nimport type { ICarouselProps, ICarouselRefs } from './carousel-types';\nimport { CarouselIndicator } from './carousel-indicator/carousel-indicator';\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport { LOTTIE } from '../../../../../assets/lottie/lottie';\nimport { allGreenTickLottienAimationSettings } from './constants';\nimport { CircleSoundKey } from '../../../hooks/use-circle-sounds/use-circle-sounds-enums';\nimport type { ISwipeableCarouselRefs } from '../../../../ui/swipeable-carousel/swipeable-carousel-types';\nimport SwipeableCarousel from '../../../../ui/swipeable-carousel/swipeable-carousel';\n\nconst CarouselComponent: ForwardRefRenderFunction<ICarouselRefs, ICarouselProps> = (\n {\n items,\n defaultIndex = 0,\n analyticsSwipeLeft,\n analyticsSwipeRight,\n analyticsIndicatorClick,\n playAllGreenTickAnimation,\n onAllGreenTickAnimationComplete,\n },\n ref,\n) => {\n const { playSwipeSound, play } = useCircleSounds();\n const isFirstMount = useRef(true);\n const carousalRef = useRef<ISwipeableCarouselRefs>(null);\n const [currIndex, setCurrIndex] = useState(carousalRef.current?.currentIndex ?? defaultIndex);\n const [playAllGreenTickAnimationLottie, setPlayAllGreenTickAnimationLottie] = useState(false);\n\n const { handleClick: handlePrevClick } = useClickHandler({\n analyticsLabel: analyticsSwipeRight.analyticsLabel,\n analyticsProps: analyticsSwipeRight.analyticsProps,\n });\n\n const { handleClick: handleNextClick } = useClickHandler({\n analyticsLabel: analyticsSwipeLeft.analyticsLabel,\n analyticsProps: analyticsSwipeLeft.analyticsProps,\n });\n\n const { handleClick: handleItemClick } = useClickHandler({\n analyticsLabel: analyticsIndicatorClick.analyticsLabel,\n analyticsProps: analyticsIndicatorClick.analyticsProps,\n });\n\n const onAllGreenTickLottieAnimationComplete = useCallback(() => {\n setPlayAllGreenTickAnimationLottie(false);\n onAllGreenTickAnimationComplete?.();\n }, [onAllGreenTickAnimationComplete]);\n\n const allGreenTickAnimationEvent = useMemo(\n () => ({\n name: 'complete' as AnimationEventName,\n callback: onAllGreenTickLottieAnimationComplete,\n }),\n [onAllGreenTickLottieAnimationComplete],\n );\n\n const indicatorRefs = useMemo(() => items.map(() => createRef<HTMLDivElement>()), [items]);\n\n const goToIndex = useCallback(\n (index: number) => {\n if (index < 0 || index >= items.length || index === currIndex) return;\n carousalRef.current?.goToIndex(index);\n setCurrIndex(index);\n },\n [currIndex, items.length],\n );\n\n const handleCarouselIndicatorClick = useCallback(\n (index: number) => {\n playSwipeSound();\n handleItemClick();\n setCurrIndex(index);\n goToIndex(index);\n },\n [handleItemClick, playSwipeSound, goToIndex],\n );\n\n useImperativeHandle(ref, () => ({\n indicatorRefs,\n currentIndex: currIndex,\n goToIndex,\n }));\n\n useEffect(() => {\n if (isFirstMount.current) {\n isFirstMount.current = false;\n }\n }, []);\n\n useEffect(() => {\n const playAnimation = items.every(item => item.indicatorType === 'green-tick');\n\n if (playAllGreenTickAnimation && playAnimation) {\n play(CircleSoundKey.ALL_ACTIVITIES_COMPLETE);\n setPlayAllGreenTickAnimationLottie(true);\n }\n }, [playAllGreenTickAnimation, play, items]);\n\n return (\n <SwipeableCarousel\n ref={carousalRef}\n items={items.map((item, index) => (\n <Styled.CarouselItemContainer key={index}>{item.element}</Styled.CarouselItemContainer>\n ))}\n defaultIndex={defaultIndex}\n transitionDuration={isFirstMount.current ? 0 : 300}\n onSwipeLeft={handleNextClick}\n onSwipeRight={handlePrevClick}\n customNavigation={\n <Styled.ExtendedFlexView\n $flexDirection=\"row\"\n $alignItems=\"center\"\n $justifyContent=\"center\"\n $position=\"absolute\"\n >\n <Styled.CarouselIdicatorContainer>\n {playAllGreenTickAnimationLottie && (\n <Styled.AllGreenTickLottieWrapper>\n <LottieAnimation\n src={LOTTIE.DAILY_WORK_OUT_COMPLETE}\n settings={allGreenTickLottienAimationSettings}\n eventListener={allGreenTickAnimationEvent}\n />\n </Styled.AllGreenTickLottieWrapper>\n )}\n {items.map((item, index) => (\n <CarouselIndicator\n ref={indicatorRefs[index]}\n key={index}\n indicatorType={item.indicatorType}\n isActive={index === currIndex}\n textToShowInsideIndicator={(index + 1).toString()}\n onClick={() => handleCarouselIndicatorClick(index)}\n />\n ))}\n </Styled.CarouselIdicatorContainer>\n </Styled.ExtendedFlexView>\n }\n />\n );\n};\n\nexport const Carousel = memo(forwardRef(CarouselComponent));\n"],"names":["CarouselComponent","items","defaultIndex","analyticsSwipeLeft","analyticsSwipeRight","analyticsIndicatorClick","playAllGreenTickAnimation","onAllGreenTickAnimationComplete","ref","playSwipeSound","play","useCircleSounds","isFirstMount","useRef","carousalRef","currIndex","setCurrIndex","useState","_a","playAllGreenTickAnimationLottie","setPlayAllGreenTickAnimationLottie","handlePrevClick","useClickHandler","handleNextClick","handleItemClick","onAllGreenTickLottieAnimationComplete","useCallback","allGreenTickAnimationEvent","useMemo","indicatorRefs","createRef","goToIndex","index","handleCarouselIndicatorClick","useImperativeHandle","useEffect","playAnimation","item","CircleSoundKey","jsx","SwipeableCarousel","Styled.CarouselItemContainer","Styled.ExtendedFlexView","jsxs","Styled.CarouselIdicatorContainer","Styled.AllGreenTickLottieWrapper","LottieAnimation","LOTTIE","allGreenTickLottienAimationSettings","CarouselIndicator","Carousel","memo","forwardRef"],"mappings":"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"}
|
|
@@ -1,13 +1,14 @@
|
|
|
1
|
-
import { jsx as r, jsxs as
|
|
2
|
-
import { useRef as
|
|
3
|
-
import { CarousalItem as u, CarouselWrapper as
|
|
4
|
-
import
|
|
1
|
+
import { jsx as r, jsxs as g } from "react/jsx-runtime";
|
|
2
|
+
import { useRef as f, useMemo as l } from "react";
|
|
3
|
+
import { CarousalItem as u, CarouselWrapper as x } from "./achievements.styled.js";
|
|
4
|
+
import a from "../../../../ui/text/text.js";
|
|
5
5
|
import n from "../../../../ui/separator/separator.js";
|
|
6
|
-
import
|
|
7
|
-
import
|
|
6
|
+
import h from "../../../../ui/layout/flex-view.js";
|
|
7
|
+
import c from "../../../../ui/swipeable-carousel/swipeable-carousel.js";
|
|
8
8
|
import { IS_APP_RUNNING_IN_RN as t } from "../../../../../constants/app-config.js";
|
|
9
|
-
|
|
10
|
-
|
|
9
|
+
import { dotsConfig as w, navigationConfig as _ } from "./constant.js";
|
|
10
|
+
const L = ({ achievements: o, studentName: e }) => {
|
|
11
|
+
const m = f(null), s = l(
|
|
11
12
|
() => o.map((i) => /* @__PURE__ */ r(
|
|
12
13
|
u,
|
|
13
14
|
{
|
|
@@ -20,41 +21,31 @@ const S = ({ achievements: o, studentName: e }) => {
|
|
|
20
21
|
i.asset_id
|
|
21
22
|
)),
|
|
22
23
|
[o]
|
|
23
|
-
),
|
|
24
|
+
), p = l(
|
|
24
25
|
() => o.length >= 2 ? `Outstanding month! ${e} earned several achievements showing excellent progress across different areas.` : `Great work! ${e} earned new achievements this month, demonstrating growth in their skills.`,
|
|
25
26
|
[o.length, e]
|
|
26
|
-
),
|
|
27
|
-
return o != null && o.length ? /* @__PURE__ */
|
|
28
|
-
/* @__PURE__ */ r(
|
|
27
|
+
), d = !t && s.length > 1;
|
|
28
|
+
return o != null && o.length ? /* @__PURE__ */ g(h, { children: [
|
|
29
|
+
/* @__PURE__ */ r(a, { $renderAs: "ab1-bold", color: "BLACK_1", children: "Achievements" }),
|
|
29
30
|
/* @__PURE__ */ r(n, { heightX: 0.125 }),
|
|
30
|
-
/* @__PURE__ */ r(
|
|
31
|
+
/* @__PURE__ */ r(h, { $marginBottom: -24, children: /* @__PURE__ */ r(a, { $renderAs: "ub2", color: "BLUE_6", children: p }) }),
|
|
31
32
|
t && /* @__PURE__ */ r(n, { heightX: 1 }),
|
|
32
33
|
/* @__PURE__ */ r(
|
|
33
|
-
|
|
34
|
+
x,
|
|
34
35
|
{
|
|
35
36
|
$height: t ? "380px" : "580px",
|
|
36
37
|
$marginBottomX: t ? -0.5 : -1,
|
|
37
38
|
children: /* @__PURE__ */ r(
|
|
38
|
-
|
|
39
|
+
c,
|
|
39
40
|
{
|
|
40
|
-
ref:
|
|
41
|
+
ref: m,
|
|
41
42
|
items: s,
|
|
42
43
|
defaultIndex: 0,
|
|
43
44
|
transitionDuration: 300,
|
|
44
|
-
|
|
45
|
-
dotsConfig:
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
activeIndicatorSize: "8px",
|
|
49
|
-
inactiveIndicatorSize: "8px",
|
|
50
|
-
spacing: "8px"
|
|
51
|
-
},
|
|
52
|
-
showNavigationButtons: g,
|
|
53
|
-
navigationConfig: {
|
|
54
|
-
buttonVariant: "secondary",
|
|
55
|
-
buttonSize: "xsmall",
|
|
56
|
-
spacing: 8
|
|
57
|
-
}
|
|
45
|
+
showIndicators: !0,
|
|
46
|
+
dotsConfig: w,
|
|
47
|
+
showNavigationButtons: d,
|
|
48
|
+
navigationConfig: _
|
|
58
49
|
}
|
|
59
50
|
)
|
|
60
51
|
}
|
|
@@ -63,6 +54,6 @@ const S = ({ achievements: o, studentName: e }) => {
|
|
|
63
54
|
] }) : null;
|
|
64
55
|
};
|
|
65
56
|
export {
|
|
66
|
-
|
|
57
|
+
L as default
|
|
67
58
|
};
|
|
68
59
|
//# sourceMappingURL=achievements.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"achievements.js","sources":["../../../../../../src/features/timeline/monthly-report/comps/achievements/achievements.tsx"],"sourcesContent":["import { useMemo, useRef, type FC } from 'react';\n\nimport { type IAchievementsProps } from './achievements-types';\nimport
|
|
1
|
+
{"version":3,"file":"achievements.js","sources":["../../../../../../src/features/timeline/monthly-report/comps/achievements/achievements.tsx"],"sourcesContent":["import { useMemo, useRef, type FC } from 'react';\n\nimport { type IAchievementsProps } from './achievements-types';\nimport * as Styled from './achievements.styled';\nimport Text from '../../../../ui/text/text';\nimport Separator from '../../../../ui/separator/separator';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport SwipeableCarousel from '../../../../ui/swipeable-carousel/swipeable-carousel';\nimport { IS_APP_RUNNING_IN_RN } from '../../../../../constants/app-config';\nimport type { ISwipeableCarouselRefs } from '../../../../ui/swipeable-carousel/swipeable-carousel-types';\nimport { dotsConfig, navigationConfig } from './constant';\n\nconst Achievements: FC<IAchievementsProps> = ({ achievements, studentName }) => {\n const carouselRef = useRef<ISwipeableCarouselRefs>(null);\n\n const carouselItems = useMemo(\n () =>\n achievements.map(achievement => (\n <Styled.CarousalItem\n key={achievement.asset_id}\n src={achievement.url}\n alt={`Achievement ${achievement.asset_id}`}\n withLoader\n height={IS_APP_RUNNING_IN_RN ? '343px' : '480px'}\n width={IS_APP_RUNNING_IN_RN ? '343px' : '480px'}\n />\n )),\n [achievements],\n );\n\n const tipText = useMemo(\n () =>\n achievements.length >= 2\n ? `Outstanding month! ${studentName} earned several achievements showing excellent progress across different areas.`\n : `Great work! ${studentName} earned new achievements this month, demonstrating growth in their skills.`,\n [achievements.length, studentName],\n );\n\n const showNavigationButtons = !IS_APP_RUNNING_IN_RN && carouselItems.length > 1;\n\n if (!achievements?.length) {\n return null;\n }\n\n return (\n <FlexView>\n <Text $renderAs=\"ab1-bold\" color=\"BLACK_1\">\n Achievements\n </Text>\n <Separator heightX={0.125} />\n <FlexView $marginBottom={-24}>\n <Text $renderAs=\"ub2\" color=\"BLUE_6\">\n {tipText}\n </Text>\n </FlexView>\n {IS_APP_RUNNING_IN_RN && <Separator heightX={1} />}\n <Styled.CarouselWrapper\n $height={IS_APP_RUNNING_IN_RN ? '380px' : '580px'}\n $marginBottomX={IS_APP_RUNNING_IN_RN ? -0.5 : -1}\n >\n <SwipeableCarousel\n ref={carouselRef}\n items={carouselItems}\n defaultIndex={0}\n transitionDuration={300}\n showIndicators={true}\n dotsConfig={dotsConfig}\n showNavigationButtons={showNavigationButtons}\n navigationConfig={navigationConfig}\n />\n </Styled.CarouselWrapper>\n <Separator heightX={0.75} />\n </FlexView>\n );\n};\n\nexport default Achievements;\n"],"names":["Achievements","achievements","studentName","carouselRef","useRef","carouselItems","useMemo","achievement","jsx","Styled.CarousalItem","IS_APP_RUNNING_IN_RN","tipText","showNavigationButtons","FlexView","Text","Separator","Styled.CarouselWrapper","SwipeableCarousel","dotsConfig","navigationConfig"],"mappings":";;;;;;;;;AAYA,MAAMA,IAAuC,CAAC,EAAE,cAAAC,GAAc,aAAAC,QAAkB;AACxE,QAAAC,IAAcC,EAA+B,IAAI,GAEjDC,IAAgBC;AAAA,IACpB,MACEL,EAAa,IAAI,CACfM,MAAA,gBAAAC;AAAA,MAACC;AAAAA,MAAA;AAAA,QAEC,KAAKF,EAAY;AAAA,QACjB,KAAK,eAAeA,EAAY,QAAQ;AAAA,QACxC,YAAU;AAAA,QACV,QAAQG,IAAuB,UAAU;AAAA,QACzC,OAAOA,IAAuB,UAAU;AAAA,MAAA;AAAA,MALnCH,EAAY;AAAA,IAAA,CAOpB;AAAA,IACH,CAACN,CAAY;AAAA,EAAA,GAGTU,IAAUL;AAAA,IACd,MACEL,EAAa,UAAU,IACnB,sBAAsBC,CAAW,oFACjC,eAAeA,CAAW;AAAA,IAChC,CAACD,EAAa,QAAQC,CAAW;AAAA,EAAA,GAG7BU,IAAwB,CAACF,KAAwBL,EAAc,SAAS;AAE1E,SAACJ,KAAA,QAAAA,EAAc,2BAKhBY,GACC,EAAA,UAAA;AAAA,IAAA,gBAAAL,EAACM,GAAK,EAAA,WAAU,YAAW,OAAM,WAAU,UAE3C,gBAAA;AAAA,IACA,gBAAAN,EAACO,GAAU,EAAA,SAAS,MAAO,CAAA;AAAA,IAC3B,gBAAAP,EAACK,GAAS,EAAA,eAAe,KACvB,UAAA,gBAAAL,EAACM,GAAK,EAAA,WAAU,OAAM,OAAM,UACzB,UAAAH,EACH,CAAA,GACF;AAAA,IACCD,KAAwB,gBAAAF,EAACO,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,IAChD,gBAAAP;AAAA,MAACQ;AAAAA,MAAA;AAAA,QACC,SAASN,IAAuB,UAAU;AAAA,QAC1C,gBAAgBA,IAAuB,OAAO;AAAA,QAE9C,UAAA,gBAAAF;AAAA,UAACS;AAAA,UAAA;AAAA,YACC,KAAKd;AAAA,YACL,OAAOE;AAAA,YACP,cAAc;AAAA,YACd,oBAAoB;AAAA,YACpB,gBAAgB;AAAA,YAChB,YAAAa;AAAA,YACA,uBAAAN;AAAA,YACA,kBAAAO;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IACF;AAAA,IACA,gBAAAX,EAACO,GAAU,EAAA,SAAS,KAAM,CAAA;AAAA,EAC5B,EAAA,CAAA,IA/BO;AAiCX;"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
const i = {
|
|
2
|
+
dotColor: "BLACK_1",
|
|
3
|
+
inactiveDotColor: "WHITE_1",
|
|
4
|
+
activeIndicatorSize: "8px",
|
|
5
|
+
inactiveIndicatorSize: "8px",
|
|
6
|
+
spacing: "8px"
|
|
7
|
+
}, o = {
|
|
8
|
+
buttonVariant: "secondary",
|
|
9
|
+
buttonSize: "xsmall",
|
|
10
|
+
spacing: 8,
|
|
11
|
+
hideOnMobile: !0
|
|
12
|
+
};
|
|
13
|
+
export {
|
|
14
|
+
i as dotsConfig,
|
|
15
|
+
o as navigationConfig
|
|
16
|
+
};
|
|
17
|
+
//# sourceMappingURL=constant.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"constant.js","sources":["../../../../../../src/features/timeline/monthly-report/comps/achievements/constant.ts"],"sourcesContent":["const dotsConfig = {\n dotColor: 'BLACK_1',\n inactiveDotColor: 'WHITE_1',\n activeIndicatorSize: '8px',\n inactiveIndicatorSize: '8px',\n spacing: '8px',\n} as const;\n\nconst navigationConfig = {\n buttonVariant: 'secondary',\n buttonSize: 'xsmall',\n spacing: 8,\n hideOnMobile: true,\n} as const;\n\nexport { dotsConfig, navigationConfig };\n"],"names":["dotsConfig","navigationConfig"],"mappings":"AAAA,MAAMA,IAAa;AAAA,EACjB,UAAU;AAAA,EACV,kBAAkB;AAAA,EAClB,qBAAqB;AAAA,EACrB,uBAAuB;AAAA,EACvB,SAAS;AACX,GAEMC,IAAmB;AAAA,EACvB,eAAe;AAAA,EACf,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,cAAc;AAChB;"}
|
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
import { jsx as
|
|
1
|
+
import { jsx as t } from "react/jsx-runtime";
|
|
2
2
|
import { LOTTIE as r } from "../../../../../assets/lottie/lottie.js";
|
|
3
|
-
import
|
|
3
|
+
import e from "../../../../../assets/line-icons/icons/check2.js";
|
|
4
4
|
import T from "../../../../../assets/line-icons/icons/status.js";
|
|
5
|
-
import
|
|
5
|
+
import a from "../../../../../assets/line-icons/icons/exclamation.js";
|
|
6
6
|
import { NODE_STATE as c } from "../../../daily-timeline-types.js";
|
|
7
|
-
import { ILLUSTRATIONS as
|
|
7
|
+
import { ILLUSTRATIONS as E } from "../../../../../assets/illustrations/illustrations.js";
|
|
8
8
|
import { CARD_TYPE as o } from "../../monthly-report-types.js";
|
|
9
|
-
function R(
|
|
10
|
-
switch (
|
|
9
|
+
function R(_) {
|
|
10
|
+
switch (_) {
|
|
11
11
|
case o.learn:
|
|
12
12
|
return {
|
|
13
13
|
lottie: r.LEARN,
|
|
14
14
|
color: "YELLOW_2",
|
|
15
|
-
background:
|
|
15
|
+
background: E.NODE_LEARN_BG
|
|
16
16
|
};
|
|
17
17
|
case o.practice:
|
|
18
18
|
case o.smart_practice:
|
|
@@ -20,38 +20,38 @@ function R(a) {
|
|
|
20
20
|
return {
|
|
21
21
|
lottie: r.PRACTICE,
|
|
22
22
|
color: "PURPLE_2",
|
|
23
|
-
background:
|
|
23
|
+
background: E.NODE_PRACTICE_BG
|
|
24
24
|
};
|
|
25
25
|
case o.puzzle:
|
|
26
26
|
return {
|
|
27
27
|
lottie: r.PUZZLE,
|
|
28
28
|
color: "PURPLE_2",
|
|
29
|
-
background:
|
|
29
|
+
background: E.NODE_PUZZLE_BG
|
|
30
30
|
};
|
|
31
31
|
case o.test:
|
|
32
32
|
case o.diagnostic:
|
|
33
33
|
return {
|
|
34
34
|
lottie: r.TEST,
|
|
35
35
|
color: "ORANGE_2",
|
|
36
|
-
background:
|
|
36
|
+
background: E.NODE_CUSTOM_TEST_BG
|
|
37
37
|
};
|
|
38
38
|
case o.challenge:
|
|
39
39
|
return {
|
|
40
40
|
lottie: r.COMPETITIVE_ARENA,
|
|
41
41
|
color: "ORANGE_2",
|
|
42
|
-
background:
|
|
42
|
+
background: E.NODE_TEST_PREP_BG
|
|
43
43
|
};
|
|
44
44
|
case o.advanced:
|
|
45
45
|
return {
|
|
46
46
|
lottie: r.TEST,
|
|
47
47
|
color: "GREEN_2",
|
|
48
|
-
background:
|
|
48
|
+
background: E.NODE_TEST_PREP_BG
|
|
49
49
|
};
|
|
50
50
|
case o.subjective:
|
|
51
51
|
return {
|
|
52
52
|
lottie: r.SUBJECTIVE,
|
|
53
53
|
color: "BLUE_2",
|
|
54
|
-
background:
|
|
54
|
+
background: E.NODE_SUBJECTIVE_BG
|
|
55
55
|
};
|
|
56
56
|
case o.recap:
|
|
57
57
|
case o.remedial:
|
|
@@ -59,34 +59,35 @@ function R(a) {
|
|
|
59
59
|
return {
|
|
60
60
|
lottie: r.RECAP,
|
|
61
61
|
color: "BLUE_2",
|
|
62
|
-
background:
|
|
62
|
+
background: E.NODE_RECAP_BG
|
|
63
63
|
};
|
|
64
64
|
case o.activity:
|
|
65
65
|
case o.wb_activity:
|
|
66
66
|
return {
|
|
67
67
|
lottie: r.ACTIVITY,
|
|
68
68
|
color: "ORANGE_2",
|
|
69
|
-
background:
|
|
69
|
+
background: E.NODE_ACTIVITY_BG
|
|
70
70
|
};
|
|
71
71
|
case o.video:
|
|
72
72
|
return {
|
|
73
73
|
lottie: r.VIDEO,
|
|
74
74
|
color: "GREEN_2",
|
|
75
|
-
background:
|
|
75
|
+
background: E.NODE_VIDEO_BG
|
|
76
76
|
};
|
|
77
77
|
default:
|
|
78
78
|
return {
|
|
79
79
|
lottie: r.PROJECT,
|
|
80
80
|
color: "GREEN_2",
|
|
81
|
-
background:
|
|
81
|
+
background: E.NODE_PROJECT_BG
|
|
82
82
|
};
|
|
83
83
|
}
|
|
84
84
|
}
|
|
85
85
|
const P = {
|
|
86
|
-
[c.COMPLETED]: /* @__PURE__ */
|
|
87
|
-
[c.IN_PROGRESS]: /* @__PURE__ */
|
|
88
|
-
[c.PENDING]: /* @__PURE__ */
|
|
89
|
-
[c.NOT_STARTED]: /* @__PURE__ */
|
|
86
|
+
[c.COMPLETED]: /* @__PURE__ */ t(e, { color: "WHITE" }),
|
|
87
|
+
[c.IN_PROGRESS]: /* @__PURE__ */ t(T, { color: "WHITE" }),
|
|
88
|
+
[c.PENDING]: /* @__PURE__ */ t(a, { color: "WHITE" }),
|
|
89
|
+
[c.NOT_STARTED]: /* @__PURE__ */ t(a, { color: "WHITE" }),
|
|
90
|
+
[c.WAIT_FOR_REVIEW]: /* @__PURE__ */ t(e, { color: "WHITE" })
|
|
90
91
|
};
|
|
91
92
|
export {
|
|
92
93
|
R as getCardTypeIconMap,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"constants.js","sources":["../../../../../../src/features/timeline/monthly-report/comps/activities/constants.tsx"],"sourcesContent":["import { LOTTIE } from '../../../../../assets/lottie/lottie';\nimport Check2Icon from '../../../../../assets/line-icons/icons/check2';\nimport StatusIcon from '../../../../../assets/line-icons/icons/status';\nimport ExclamationIcon from '../../../../../assets/line-icons/icons/exclamation';\nimport { NODE_STATE } from '../../../daily-timeline-types';\nimport { ILLUSTRATIONS } from '../../../../../assets/illustrations/illustrations';\nimport { CARD_TYPE } from '../../monthly-report-types';\n\nexport function getCardTypeIconMap(cardType: CARD_TYPE) {\n switch (cardType) {\n case CARD_TYPE.learn:\n return {\n lottie: LOTTIE.LEARN,\n color: 'YELLOW_2',\n background: ILLUSTRATIONS.NODE_LEARN_BG,\n };\n case CARD_TYPE.practice:\n case CARD_TYPE.smart_practice:\n case CARD_TYPE.sat_mock_test:\n return {\n lottie: LOTTIE.PRACTICE,\n color: 'PURPLE_2',\n background: ILLUSTRATIONS.NODE_PRACTICE_BG,\n };\n case CARD_TYPE.puzzle:\n return {\n lottie: LOTTIE.PUZZLE,\n color: 'PURPLE_2',\n background: ILLUSTRATIONS.NODE_PUZZLE_BG,\n };\n case CARD_TYPE.test:\n case CARD_TYPE.diagnostic:\n return {\n lottie: LOTTIE.TEST,\n color: 'ORANGE_2',\n background: ILLUSTRATIONS.NODE_CUSTOM_TEST_BG,\n };\n case CARD_TYPE.challenge:\n return {\n lottie: LOTTIE.COMPETITIVE_ARENA,\n color: 'ORANGE_2',\n background: ILLUSTRATIONS.NODE_TEST_PREP_BG,\n };\n case CARD_TYPE.advanced:\n return {\n lottie: LOTTIE.TEST,\n color: 'GREEN_2',\n background: ILLUSTRATIONS.NODE_TEST_PREP_BG,\n };\n case CARD_TYPE.subjective:\n return {\n lottie: LOTTIE.SUBJECTIVE,\n color: 'BLUE_2',\n background: ILLUSTRATIONS.NODE_SUBJECTIVE_BG,\n };\n case CARD_TYPE.recap:\n case CARD_TYPE.remedial:\n case CARD_TYPE.revision:\n return {\n lottie: LOTTIE.RECAP,\n color: 'BLUE_2',\n background: ILLUSTRATIONS.NODE_RECAP_BG,\n };\n\n case CARD_TYPE.activity:\n case CARD_TYPE.wb_activity:\n return {\n lottie: LOTTIE.ACTIVITY,\n color: 'ORANGE_2',\n background: ILLUSTRATIONS.NODE_ACTIVITY_BG,\n };\n\n case CARD_TYPE.video:\n return {\n lottie: LOTTIE.VIDEO,\n color: 'GREEN_2',\n background: ILLUSTRATIONS.NODE_VIDEO_BG,\n };\n\n default:\n return {\n lottie: LOTTIE.PROJECT,\n color: 'GREEN_2',\n background: ILLUSTRATIONS.NODE_PROJECT_BG,\n };\n }\n}\n\nexport const stateIcon = {\n [NODE_STATE.COMPLETED]: <Check2Icon color=\"WHITE\" />,\n [NODE_STATE.IN_PROGRESS]: <StatusIcon color=\"WHITE\" />,\n [NODE_STATE.PENDING]: <ExclamationIcon color=\"WHITE\" />,\n [NODE_STATE.NOT_STARTED]: <ExclamationIcon color=\"WHITE\" />,\n};\n"],"names":["getCardTypeIconMap","cardType","CARD_TYPE","LOTTIE","ILLUSTRATIONS","stateIcon","NODE_STATE","jsx","Check2Icon","StatusIcon","ExclamationIcon"],"mappings":";;;;;;;;AAQO,SAASA,EAAmBC,GAAqB;AACtD,UAAQA,GAAU;AAAA,IAChB,KAAKC,EAAU;AACN,aAAA;AAAA,QACL,QAAQC,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,IAE9B,KAAKF,EAAU;AAAA,IACf,KAAKA,EAAU;AAAA,IACf,KAAKA,EAAU;AACN,aAAA;AAAA,QACL,QAAQC,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,IAE9B,KAAKF,EAAU;AACN,aAAA;AAAA,QACL,QAAQC,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,IAE9B,KAAKF,EAAU;AAAA,IACf,KAAKA,EAAU;AACN,aAAA;AAAA,QACL,QAAQC,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,IAE9B,KAAKF,EAAU;AACN,aAAA;AAAA,QACL,QAAQC,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,IAE9B,KAAKF,EAAU;AACN,aAAA;AAAA,QACL,QAAQC,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,IAE9B,KAAKF,EAAU;AACN,aAAA;AAAA,QACL,QAAQC,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,IAE9B,KAAKF,EAAU;AAAA,IACf,KAAKA,EAAU;AAAA,IACf,KAAKA,EAAU;AACN,aAAA;AAAA,QACL,QAAQC,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,IAG9B,KAAKF,EAAU;AAAA,IACf,KAAKA,EAAU;AACN,aAAA;AAAA,QACL,QAAQC,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,IAG9B,KAAKF,EAAU;AACN,aAAA;AAAA,QACL,QAAQC,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,IAG9B;AACS,aAAA;AAAA,QACL,QAAQD,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,EAEhC;AACF;AAEO,MAAMC,IAAY;AAAA,EACvB,CAACC,EAAW,SAAS,GAAI,gBAAAC,EAAAC,GAAA,EAAW,OAAM,SAAQ;AAAA,EAClD,CAACF,EAAW,WAAW,GAAI,gBAAAC,EAAAE,GAAA,EAAW,OAAM,SAAQ;AAAA,EACpD,CAACH,EAAW,OAAO,GAAI,gBAAAC,EAAAG,GAAA,EAAgB,OAAM,SAAQ;AAAA,EACrD,CAACJ,EAAW,WAAW,GAAI,gBAAAC,EAAAG,GAAA,EAAgB,OAAM,SAAQ;
|
|
1
|
+
{"version":3,"file":"constants.js","sources":["../../../../../../src/features/timeline/monthly-report/comps/activities/constants.tsx"],"sourcesContent":["import { LOTTIE } from '../../../../../assets/lottie/lottie';\nimport Check2Icon from '../../../../../assets/line-icons/icons/check2';\nimport StatusIcon from '../../../../../assets/line-icons/icons/status';\nimport ExclamationIcon from '../../../../../assets/line-icons/icons/exclamation';\nimport { NODE_STATE } from '../../../daily-timeline-types';\nimport { ILLUSTRATIONS } from '../../../../../assets/illustrations/illustrations';\nimport { CARD_TYPE } from '../../monthly-report-types';\n\nexport function getCardTypeIconMap(cardType: CARD_TYPE) {\n switch (cardType) {\n case CARD_TYPE.learn:\n return {\n lottie: LOTTIE.LEARN,\n color: 'YELLOW_2',\n background: ILLUSTRATIONS.NODE_LEARN_BG,\n };\n case CARD_TYPE.practice:\n case CARD_TYPE.smart_practice:\n case CARD_TYPE.sat_mock_test:\n return {\n lottie: LOTTIE.PRACTICE,\n color: 'PURPLE_2',\n background: ILLUSTRATIONS.NODE_PRACTICE_BG,\n };\n case CARD_TYPE.puzzle:\n return {\n lottie: LOTTIE.PUZZLE,\n color: 'PURPLE_2',\n background: ILLUSTRATIONS.NODE_PUZZLE_BG,\n };\n case CARD_TYPE.test:\n case CARD_TYPE.diagnostic:\n return {\n lottie: LOTTIE.TEST,\n color: 'ORANGE_2',\n background: ILLUSTRATIONS.NODE_CUSTOM_TEST_BG,\n };\n case CARD_TYPE.challenge:\n return {\n lottie: LOTTIE.COMPETITIVE_ARENA,\n color: 'ORANGE_2',\n background: ILLUSTRATIONS.NODE_TEST_PREP_BG,\n };\n case CARD_TYPE.advanced:\n return {\n lottie: LOTTIE.TEST,\n color: 'GREEN_2',\n background: ILLUSTRATIONS.NODE_TEST_PREP_BG,\n };\n case CARD_TYPE.subjective:\n return {\n lottie: LOTTIE.SUBJECTIVE,\n color: 'BLUE_2',\n background: ILLUSTRATIONS.NODE_SUBJECTIVE_BG,\n };\n case CARD_TYPE.recap:\n case CARD_TYPE.remedial:\n case CARD_TYPE.revision:\n return {\n lottie: LOTTIE.RECAP,\n color: 'BLUE_2',\n background: ILLUSTRATIONS.NODE_RECAP_BG,\n };\n\n case CARD_TYPE.activity:\n case CARD_TYPE.wb_activity:\n return {\n lottie: LOTTIE.ACTIVITY,\n color: 'ORANGE_2',\n background: ILLUSTRATIONS.NODE_ACTIVITY_BG,\n };\n\n case CARD_TYPE.video:\n return {\n lottie: LOTTIE.VIDEO,\n color: 'GREEN_2',\n background: ILLUSTRATIONS.NODE_VIDEO_BG,\n };\n\n default:\n return {\n lottie: LOTTIE.PROJECT,\n color: 'GREEN_2',\n background: ILLUSTRATIONS.NODE_PROJECT_BG,\n };\n }\n}\n\nexport const stateIcon = {\n [NODE_STATE.COMPLETED]: <Check2Icon color=\"WHITE\" />,\n [NODE_STATE.IN_PROGRESS]: <StatusIcon color=\"WHITE\" />,\n [NODE_STATE.PENDING]: <ExclamationIcon color=\"WHITE\" />,\n [NODE_STATE.NOT_STARTED]: <ExclamationIcon color=\"WHITE\" />,\n [NODE_STATE.WAIT_FOR_REVIEW]: <Check2Icon color=\"WHITE\" />,\n};\n"],"names":["getCardTypeIconMap","cardType","CARD_TYPE","LOTTIE","ILLUSTRATIONS","stateIcon","NODE_STATE","jsx","Check2Icon","StatusIcon","ExclamationIcon"],"mappings":";;;;;;;;AAQO,SAASA,EAAmBC,GAAqB;AACtD,UAAQA,GAAU;AAAA,IAChB,KAAKC,EAAU;AACN,aAAA;AAAA,QACL,QAAQC,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,IAE9B,KAAKF,EAAU;AAAA,IACf,KAAKA,EAAU;AAAA,IACf,KAAKA,EAAU;AACN,aAAA;AAAA,QACL,QAAQC,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,IAE9B,KAAKF,EAAU;AACN,aAAA;AAAA,QACL,QAAQC,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,IAE9B,KAAKF,EAAU;AAAA,IACf,KAAKA,EAAU;AACN,aAAA;AAAA,QACL,QAAQC,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,IAE9B,KAAKF,EAAU;AACN,aAAA;AAAA,QACL,QAAQC,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,IAE9B,KAAKF,EAAU;AACN,aAAA;AAAA,QACL,QAAQC,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,IAE9B,KAAKF,EAAU;AACN,aAAA;AAAA,QACL,QAAQC,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,IAE9B,KAAKF,EAAU;AAAA,IACf,KAAKA,EAAU;AAAA,IACf,KAAKA,EAAU;AACN,aAAA;AAAA,QACL,QAAQC,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,IAG9B,KAAKF,EAAU;AAAA,IACf,KAAKA,EAAU;AACN,aAAA;AAAA,QACL,QAAQC,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,IAG9B,KAAKF,EAAU;AACN,aAAA;AAAA,QACL,QAAQC,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,IAG9B;AACS,aAAA;AAAA,QACL,QAAQD,EAAO;AAAA,QACf,OAAO;AAAA,QACP,YAAYC,EAAc;AAAA,MAAA;AAAA,EAEhC;AACF;AAEO,MAAMC,IAAY;AAAA,EACvB,CAACC,EAAW,SAAS,GAAI,gBAAAC,EAAAC,GAAA,EAAW,OAAM,SAAQ;AAAA,EAClD,CAACF,EAAW,WAAW,GAAI,gBAAAC,EAAAE,GAAA,EAAW,OAAM,SAAQ;AAAA,EACpD,CAACH,EAAW,OAAO,GAAI,gBAAAC,EAAAG,GAAA,EAAgB,OAAM,SAAQ;AAAA,EACrD,CAACJ,EAAW,WAAW,GAAI,gBAAAC,EAAAG,GAAA,EAAgB,OAAM,SAAQ;AAAA,EACzD,CAACJ,EAAW,eAAe,GAAI,gBAAAC,EAAAC,GAAA,EAAW,OAAM,SAAQ;AAC1D;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.js","sources":["../../../../../../src/features/timeline/monthly-report/comps/activities/utils.ts"],"sourcesContent":["import { type IMonthlyActivity } from '../../monthly-report-types';\nimport { NODE_STATE } from '../../../daily-timeline-types';\n\nexport const countActivitiesByState = (activitiesList: IMonthlyActivity[]) => {\n const totalDone = activitiesList.filter(\n activity
|
|
1
|
+
{"version":3,"file":"utils.js","sources":["../../../../../../src/features/timeline/monthly-report/comps/activities/utils.ts"],"sourcesContent":["import { type IMonthlyActivity } from '../../monthly-report-types';\nimport { NODE_STATE } from '../../../daily-timeline-types';\n\nexport const countActivitiesByState = (activitiesList: IMonthlyActivity[]) => {\n const totalDone = activitiesList.filter(\n activity =>\n activity.state === NODE_STATE.COMPLETED || activity.state === NODE_STATE.WAIT_FOR_REVIEW,\n ).length;\n const totalPending = activitiesList.filter(\n activity => activity.state === NODE_STATE.IN_PROGRESS,\n ).length;\n const totalOverdue = activitiesList.filter(\n activity => activity.state === NODE_STATE.PENDING || activity.state === NODE_STATE.NOT_STARTED,\n ).length;\n\n return { totalDone, totalPending, totalOverdue };\n};\n"],"names":["countActivitiesByState","activitiesList","totalDone","activity","NODE_STATE","totalPending","totalOverdue"],"mappings":";AAGa,MAAAA,IAAyB,CAACC,MAAuC;AAC5E,QAAMC,IAAYD,EAAe;AAAA,IAC/B,OACEE,EAAS,UAAUC,EAAW,aAAaD,EAAS,UAAUC,EAAW;AAAA,EAC3E,EAAA,QACIC,IAAeJ,EAAe;AAAA,IAClC,CAAAE,MAAYA,EAAS,UAAUC,EAAW;AAAA,EAC1C,EAAA,QACIE,IAAeL,EAAe;AAAA,IAClC,OAAYE,EAAS,UAAUC,EAAW,WAAWD,EAAS,UAAUC,EAAW;AAAA,EACnF,EAAA;AAEK,SAAA,EAAE,WAAAF,GAAW,cAAAG,GAAc,cAAAC;AACpC;"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
const t = {
|
|
2
|
+
dotColor: "BLACK_1",
|
|
3
|
+
inactiveDotColor: "WHITE_1",
|
|
4
|
+
activeIndicatorSize: "8px",
|
|
5
|
+
inactiveIndicatorSize: "8px",
|
|
6
|
+
spacing: "8px"
|
|
7
|
+
}, i = {
|
|
8
|
+
buttonVariant: "secondary",
|
|
9
|
+
buttonSize: "xsmall",
|
|
10
|
+
spacing: 8,
|
|
11
|
+
hideOnMobile: !0
|
|
12
|
+
};
|
|
13
|
+
export {
|
|
14
|
+
t as defaultDotConfig,
|
|
15
|
+
i as defaultNavigationConfig
|
|
16
|
+
};
|
|
17
|
+
//# sourceMappingURL=constants.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"constants.js","sources":["../../../../src/features/ui/swipeable-carousel/constants.ts"],"sourcesContent":["const defaultDotConfig = {\n dotColor: 'BLACK_1' as const,\n inactiveDotColor: 'WHITE_1' as const,\n activeIndicatorSize: '8px',\n inactiveIndicatorSize: '8px',\n spacing: '8px',\n};\n\nconst defaultNavigationConfig = {\n buttonVariant: 'secondary' as const,\n buttonSize: 'xsmall' as const,\n spacing: 8,\n hideOnMobile: true,\n};\n\nexport { defaultDotConfig, defaultNavigationConfig };\n"],"names":["defaultDotConfig","defaultNavigationConfig"],"mappings":"AAAA,MAAMA,IAAmB;AAAA,EACvB,UAAU;AAAA,EACV,kBAAkB;AAAA,EAClB,qBAAqB;AAAA,EACrB,uBAAuB;AAAA,EACvB,SAAS;AACX,GAEMC,IAA0B;AAAA,EAC9B,eAAe;AAAA,EACf,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,cAAc;AAChB;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"swipeable-carousel-styled.js","sources":["../../../../src/features/ui/swipeable-carousel/swipeable-carousel-styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport type { TColorNames } from '../types';\n\nexport const Carousel = styled.div`\n width: 100%;\n height: 100%;\n position: relative;\n display: flex;\n justify-content: center;\n touch-action: none;\n`;\n\nexport const CarouselContent = styled.div`\n width: 100%;\n height: 100%;\n position: relative;\n display: flex;\n justify-content: center;\n touch-action: none;\n`;\n\nexport const CarouselWrapper = styled.div<{ $translate?: number; $translateDuration?: number }>`\n display: flex;\n width: 100%;\n flex-grow: 1;\n transform: ${({ $translate = 0 }) => `translateX(${-$translate}%)`};\n transition: ${({ $translateDuration }) => `all ${$translateDuration}ms ease-in`};\n touch-action: none;\n`;\n\nexport const CarouselItemContainer = styled.div`\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-grow: 1;\n flex-shrink: 0;\n touch-action: none;\n`;\n\ninterface IDotProps {\n $isCurrent: boolean;\n $dotColor: TColorNames;\n $inactiveDotColor: TColorNames;\n $activeIndicatorSize: string;\n $inactiveIndicatorSize: string;\n}\n\nexport const Dot = styled.span<IDotProps>`\n background: ${({ theme, $isCurrent, $dotColor, $inactiveDotColor }) =>\n $isCurrent ? theme.colors[$dotColor] : theme.colors[$inactiveDotColor]};\n border: 1px solid ${({ theme, $dotColor }) => theme.colors[$dotColor]};\n width: ${({ $isCurrent, $activeIndicatorSize, $inactiveIndicatorSize }) =>\n $isCurrent ? $activeIndicatorSize : $inactiveIndicatorSize};\n height: ${({ $isCurrent, $activeIndicatorSize, $inactiveIndicatorSize }) =>\n $isCurrent ? $activeIndicatorSize : $inactiveIndicatorSize};\n border-radius: 50%;\n display: inline-block;\n transition: all 0.3s ease;\n cursor: pointer;\n\n &:hover {\n opacity: 0.8;\n }\n`;\n\nexport const NavigationContainer = styled.div<{ $bottom?: string }>`\n position: absolute;\n bottom: ${({ $bottom }) => $bottom || '-48px'};\n`;\n"],"names":["Carousel","styled","CarouselWrapper","$translate","$translateDuration","CarouselItemContainer","Dot","theme","$isCurrent","$dotColor","$inactiveDotColor","$activeIndicatorSize","$inactiveIndicatorSize","NavigationContainer","$bottom"],"mappings":";AAIO,MAAMA,IAAWC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASAA,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAS/B,MAAMC,IAAkBD,EAAO;AAAA;AAAA;AAAA;AAAA,eAIvB,CAAC,EAAE,YAAAE,IAAa,QAAQ,cAAc,CAACA,CAAU,IAAI;AAAA,gBACpD,CAAC,EAAE,oBAAAC,EAAyB,MAAA,OAAOA,CAAkB,YAAY;AAAA;AAAA,GAIpEC,IAAwBJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAkB/BK,IAAML,EAAO;AAAA,gBACV,CAAC,EAAE,OAAAM,GAAO,YAAAC,GAAY,WAAAC,GAAW,mBAAAC,EAAkB,MAC/DF,IAAaD,EAAM,OAAOE,CAAS,IAAIF,EAAM,OAAOG,CAAiB,CAAC;AAAA,sBACpD,CAAC,EAAE,OAAAH,GAAO,WAAAE,EAAA,MAAgBF,EAAM,OAAOE,CAAS,CAAC;AAAA,WAC5D,CAAC,EAAE,YAAAD,GAAY,sBAAAG,GAAsB,wBAAAC,QAC5CJ,IAAaG,IAAuBC,CAAsB;AAAA,YAClD,CAAC,EAAE,YAAAJ,GAAY,sBAAAG,GAAsB,wBAAAC,QAC7CJ,IAAaG,IAAuBC,CAAsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAWjDC,IAAsBZ,EAAO;AAAA;AAAA,YAE9B,CAAC,EAAE,SAAAa,QAAcA,KAAW,OAAO;AAAA;"}
|
|
@@ -0,0 +1,145 @@
|
|
|
1
|
+
import { jsx as o, jsxs as j } from "react/jsx-runtime";
|
|
2
|
+
import { memo as k, forwardRef as q, useState as C, useMemo as z, useCallback as n, useImperativeHandle as J, useEffect as K } from "react";
|
|
3
|
+
import L from "../swipeable-component/swipeable-component.js";
|
|
4
|
+
import M from "../buttons/icon-button/icon-button.js";
|
|
5
|
+
import { Dot as O, NavigationContainer as A, Carousel as Q, CarouselWrapper as U, CarouselItemContainer as Y } from "./swipeable-carousel-styled.js";
|
|
6
|
+
import Z from "../../../assets/line-icons/icons/chevron-left.js";
|
|
7
|
+
import R from "../../../assets/line-icons/icons/chevron-right.js";
|
|
8
|
+
import h from "../layout/flex-view.js";
|
|
9
|
+
import x from "../separator/separator.js";
|
|
10
|
+
import { defaultDotConfig as B, defaultNavigationConfig as g } from "./constants.js";
|
|
11
|
+
const w = ({
|
|
12
|
+
items: l,
|
|
13
|
+
customNavigation: E,
|
|
14
|
+
defaultIndex: S = 0,
|
|
15
|
+
transitionDuration: F = 300,
|
|
16
|
+
onSwipeLeft: s,
|
|
17
|
+
onSwipeRight: m,
|
|
18
|
+
onIndexChange: e,
|
|
19
|
+
showIndicators: p = !1,
|
|
20
|
+
dotsConfig: y,
|
|
21
|
+
showNavigationButtons: f = !1,
|
|
22
|
+
navigationConfig: G,
|
|
23
|
+
onCarouselIndicatorClick: $
|
|
24
|
+
}, H) => {
|
|
25
|
+
const T = Math.max(0, Math.min(S, l.length - 1)), [r, b] = C(T), v = r > 0, D = r < l.length - 1, i = z(() => ({ ...B, ...y }), [y]), a = z(
|
|
26
|
+
() => ({ ...g, ...G }),
|
|
27
|
+
[G]
|
|
28
|
+
), c = n(
|
|
29
|
+
(t) => {
|
|
30
|
+
t < 0 || t >= l.length || t === r || (b(t), e == null || e(t));
|
|
31
|
+
},
|
|
32
|
+
[r, l.length, e]
|
|
33
|
+
);
|
|
34
|
+
J(H, () => ({
|
|
35
|
+
currentIndex: r,
|
|
36
|
+
goToIndex: c
|
|
37
|
+
}));
|
|
38
|
+
const W = n(() => {
|
|
39
|
+
if (!D) return;
|
|
40
|
+
const t = r + 1;
|
|
41
|
+
b(t), e == null || e(t), s == null || s();
|
|
42
|
+
}, [D, r, s, e]), X = n(() => {
|
|
43
|
+
if (!v) return;
|
|
44
|
+
const t = r - 1;
|
|
45
|
+
b(t), e == null || e(t), m == null || m();
|
|
46
|
+
}, [v, r, m, e]), N = n(
|
|
47
|
+
(t) => {
|
|
48
|
+
c(t), $ == null || $(t);
|
|
49
|
+
},
|
|
50
|
+
[c, $]
|
|
51
|
+
), P = n(() => {
|
|
52
|
+
c(r - 1);
|
|
53
|
+
}, [c, r]), V = n(() => {
|
|
54
|
+
c(r + 1);
|
|
55
|
+
}, [c, r]), d = z(() => !p || l.length <= 1 ? null : /* @__PURE__ */ o(h, { $flexDirection: "row", $alignItems: "center", $justifyContent: "center", $flexGap: 8, children: l.map((t, u) => /* @__PURE__ */ o(
|
|
56
|
+
O,
|
|
57
|
+
{
|
|
58
|
+
onClick: () => N(u),
|
|
59
|
+
$isCurrent: u === r,
|
|
60
|
+
$dotColor: i.dotColor,
|
|
61
|
+
$inactiveDotColor: i.inactiveDotColor,
|
|
62
|
+
$activeIndicatorSize: i.activeIndicatorSize,
|
|
63
|
+
$inactiveIndicatorSize: i.inactiveIndicatorSize
|
|
64
|
+
},
|
|
65
|
+
u
|
|
66
|
+
)) }), [
|
|
67
|
+
r,
|
|
68
|
+
i.activeIndicatorSize,
|
|
69
|
+
i.dotColor,
|
|
70
|
+
i.inactiveDotColor,
|
|
71
|
+
i.inactiveIndicatorSize,
|
|
72
|
+
N,
|
|
73
|
+
l,
|
|
74
|
+
p
|
|
75
|
+
]), _ = z(() => !f || l.length <= 1 ? null : /* @__PURE__ */ j(A, { $bottom: "-48px", children: [
|
|
76
|
+
/* @__PURE__ */ o(x, { heightX: 1 }),
|
|
77
|
+
/* @__PURE__ */ j(
|
|
78
|
+
h,
|
|
79
|
+
{
|
|
80
|
+
$flexDirection: "row",
|
|
81
|
+
$alignItems: "center",
|
|
82
|
+
$justifyContent: "center",
|
|
83
|
+
$flex: 1,
|
|
84
|
+
$flexGap: a.spacing || 8,
|
|
85
|
+
children: [
|
|
86
|
+
/* @__PURE__ */ o(
|
|
87
|
+
M,
|
|
88
|
+
{
|
|
89
|
+
Icon: Z,
|
|
90
|
+
renderAs: a.buttonVariant,
|
|
91
|
+
analyticsLabel: "Previous",
|
|
92
|
+
size: a.buttonSize,
|
|
93
|
+
onClick: P,
|
|
94
|
+
disabled: !v,
|
|
95
|
+
"aria-label": "Previous item"
|
|
96
|
+
}
|
|
97
|
+
),
|
|
98
|
+
d,
|
|
99
|
+
/* @__PURE__ */ o(
|
|
100
|
+
M,
|
|
101
|
+
{
|
|
102
|
+
Icon: R,
|
|
103
|
+
renderAs: a.buttonVariant,
|
|
104
|
+
analyticsLabel: "Next",
|
|
105
|
+
size: a.buttonSize,
|
|
106
|
+
onClick: V,
|
|
107
|
+
disabled: !D,
|
|
108
|
+
"aria-label": "Next item"
|
|
109
|
+
}
|
|
110
|
+
)
|
|
111
|
+
]
|
|
112
|
+
}
|
|
113
|
+
)
|
|
114
|
+
] }), [
|
|
115
|
+
D,
|
|
116
|
+
v,
|
|
117
|
+
a.buttonSize,
|
|
118
|
+
a.buttonVariant,
|
|
119
|
+
a.spacing,
|
|
120
|
+
V,
|
|
121
|
+
P,
|
|
122
|
+
l.length,
|
|
123
|
+
d,
|
|
124
|
+
f
|
|
125
|
+
]);
|
|
126
|
+
return K(() => {
|
|
127
|
+
b(S);
|
|
128
|
+
}, [S]), /* @__PURE__ */ o(L, { onSwipeLeft: W, onSwipeRight: X, children: /* @__PURE__ */ j(Q, { children: [
|
|
129
|
+
/* @__PURE__ */ o(
|
|
130
|
+
U,
|
|
131
|
+
{
|
|
132
|
+
$translate: r * 100,
|
|
133
|
+
$translateDuration: F,
|
|
134
|
+
children: l.map((t, u) => /* @__PURE__ */ o(Y, { children: t }, u))
|
|
135
|
+
}
|
|
136
|
+
),
|
|
137
|
+
!p && !f && l.length > 1 && E,
|
|
138
|
+
p && !f && /* @__PURE__ */ o(A, { $bottom: "-8px", children: d }),
|
|
139
|
+
f && _
|
|
140
|
+
] }) });
|
|
141
|
+
}, ft = k(q(w));
|
|
142
|
+
export {
|
|
143
|
+
ft as default
|
|
144
|
+
};
|
|
145
|
+
//# sourceMappingURL=swipeable-carousel.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"swipeable-carousel.js","sources":["../../../../src/features/ui/swipeable-carousel/swipeable-carousel.tsx"],"sourcesContent":["import {\n type ForwardRefRenderFunction,\n memo,\n useCallback,\n useEffect,\n useState,\n forwardRef,\n useImperativeHandle,\n useMemo,\n} from 'react';\n\nimport SwipeableComponent from '../swipeable-component/swipeable-component';\nimport IconButton from '../buttons/icon-button/icon-button';\nimport * as Styled from './swipeable-carousel-styled';\nimport type { ISwipeableCarousel, ISwipeableCarouselRefs } from './swipeable-carousel-types';\nimport ChevronLeft from '../../../assets/line-icons/icons/chevron-left';\nimport ChevronRight from '../../../assets/line-icons/icons/chevron-right';\nimport FlexView from '../layout/flex-view';\nimport Separator from '../separator/separator';\nimport { defaultDotConfig, defaultNavigationConfig } from './constants';\n\nconst SwipeableCarousel: ForwardRefRenderFunction<ISwipeableCarouselRefs, ISwipeableCarousel> = (\n {\n items,\n customNavigation,\n defaultIndex = 0,\n transitionDuration = 300,\n onSwipeLeft,\n onSwipeRight,\n onIndexChange,\n showIndicators = false,\n dotsConfig,\n showNavigationButtons = false,\n navigationConfig,\n onCarouselIndicatorClick,\n },\n ref,\n) => {\n const validDefaultIndex = Math.max(0, Math.min(defaultIndex, items.length - 1));\n const [currIndex, setCurrIndex] = useState(validDefaultIndex);\n const canGoPrevious = currIndex > 0;\n const canGoNext = currIndex < items.length - 1;\n const finalDotConfig = useMemo(() => ({ ...defaultDotConfig, ...dotsConfig }), [dotsConfig]);\n const finalNavigationConfig = useMemo(\n () => ({ ...defaultNavigationConfig, ...navigationConfig }),\n [navigationConfig],\n );\n\n const goToIndex = useCallback(\n (index: number) => {\n if (index < 0 || index >= items.length || index === currIndex) return;\n setCurrIndex(index);\n onIndexChange?.(index);\n },\n [currIndex, items.length, onIndexChange],\n );\n\n useImperativeHandle(ref, () => ({\n currentIndex: currIndex,\n goToIndex,\n }));\n\n const handleSwipeLeft = useCallback(() => {\n if (!canGoNext) return;\n\n const newIndex = currIndex + 1;\n\n setCurrIndex(newIndex);\n onIndexChange?.(newIndex);\n onSwipeLeft?.();\n }, [canGoNext, currIndex, onSwipeLeft, onIndexChange]);\n\n const handleSwipeRight = useCallback(() => {\n if (!canGoPrevious) return;\n\n const newIndex = currIndex - 1;\n\n setCurrIndex(newIndex);\n onIndexChange?.(newIndex);\n onSwipeRight?.();\n }, [canGoPrevious, currIndex, onSwipeRight, onIndexChange]);\n\n const handleDotClick = useCallback(\n (index: number) => {\n goToIndex(index);\n onCarouselIndicatorClick?.(index);\n },\n [goToIndex, onCarouselIndicatorClick],\n );\n\n const handlePrevious = useCallback(() => {\n goToIndex(currIndex - 1);\n }, [goToIndex, currIndex]);\n\n const handleNext = useCallback(() => {\n goToIndex(currIndex + 1);\n }, [goToIndex, currIndex]);\n\n const renderDots = useMemo(() => {\n if (!showIndicators || items.length <= 1) return null;\n\n return (\n <FlexView $flexDirection=\"row\" $alignItems=\"center\" $justifyContent=\"center\" $flexGap={8}>\n {items.map((_, index) => (\n <Styled.Dot\n key={index}\n onClick={() => handleDotClick(index)}\n $isCurrent={index === currIndex}\n $dotColor={finalDotConfig.dotColor}\n $inactiveDotColor={finalDotConfig.inactiveDotColor}\n $activeIndicatorSize={finalDotConfig.activeIndicatorSize}\n $inactiveIndicatorSize={finalDotConfig.inactiveIndicatorSize}\n />\n ))}\n </FlexView>\n );\n }, [\n currIndex,\n finalDotConfig.activeIndicatorSize,\n finalDotConfig.dotColor,\n finalDotConfig.inactiveDotColor,\n finalDotConfig.inactiveIndicatorSize,\n handleDotClick,\n items,\n showIndicators,\n ]);\n\n const renderNavigation = useMemo(() => {\n if (!showNavigationButtons || items.length <= 1) return null;\n\n return (\n <Styled.NavigationContainer $bottom=\"-48px\">\n <Separator heightX={1} />\n <FlexView\n $flexDirection=\"row\"\n $alignItems=\"center\"\n $justifyContent=\"center\"\n $flex={1}\n $flexGap={finalNavigationConfig.spacing || 8}\n >\n <IconButton\n Icon={ChevronLeft}\n renderAs={finalNavigationConfig.buttonVariant}\n analyticsLabel=\"Previous\"\n size={finalNavigationConfig.buttonSize}\n onClick={handlePrevious}\n disabled={!canGoPrevious}\n aria-label=\"Previous item\"\n />\n {renderDots}\n <IconButton\n Icon={ChevronRight}\n renderAs={finalNavigationConfig.buttonVariant}\n analyticsLabel=\"Next\"\n size={finalNavigationConfig.buttonSize}\n onClick={handleNext}\n disabled={!canGoNext}\n aria-label=\"Next item\"\n />\n </FlexView>\n </Styled.NavigationContainer>\n );\n }, [\n canGoNext,\n canGoPrevious,\n finalNavigationConfig.buttonSize,\n finalNavigationConfig.buttonVariant,\n finalNavigationConfig.spacing,\n handleNext,\n handlePrevious,\n items.length,\n renderDots,\n showNavigationButtons,\n ]);\n\n useEffect(() => {\n setCurrIndex(defaultIndex);\n }, [defaultIndex]);\n\n return (\n <SwipeableComponent onSwipeLeft={handleSwipeLeft} onSwipeRight={handleSwipeRight}>\n <Styled.Carousel>\n <Styled.CarouselWrapper\n $translate={currIndex * 100}\n $translateDuration={transitionDuration}\n >\n {items.map((item, index) => (\n <Styled.CarouselItemContainer key={index}>{item}</Styled.CarouselItemContainer>\n ))}\n </Styled.CarouselWrapper>\n {!showIndicators && !showNavigationButtons && items.length > 1 && customNavigation}\n {showIndicators && !showNavigationButtons && (\n <Styled.NavigationContainer $bottom=\"-8px\">{renderDots}</Styled.NavigationContainer>\n )}\n {showNavigationButtons && renderNavigation}\n </Styled.Carousel>\n </SwipeableComponent>\n );\n};\n\nexport default memo(forwardRef(SwipeableCarousel));\n"],"names":["SwipeableCarousel","items","customNavigation","defaultIndex","transitionDuration","onSwipeLeft","onSwipeRight","onIndexChange","showIndicators","dotsConfig","showNavigationButtons","navigationConfig","onCarouselIndicatorClick","ref","validDefaultIndex","currIndex","setCurrIndex","useState","canGoPrevious","canGoNext","finalDotConfig","useMemo","defaultDotConfig","finalNavigationConfig","defaultNavigationConfig","goToIndex","useCallback","index","useImperativeHandle","handleSwipeLeft","newIndex","handleSwipeRight","handleDotClick","handlePrevious","handleNext","renderDots","jsx","FlexView","_","Styled.Dot","renderNavigation","jsxs","Styled.NavigationContainer","Separator","IconButton","ChevronLeft","ChevronRight","useEffect","SwipeableComponent","Styled.Carousel","Styled.CarouselWrapper","item","Styled.CarouselItemContainer","SwipeableCarousel$1","memo","forwardRef"],"mappings":";;;;;;;;;;AAqBA,MAAMA,IAA0F,CAC9F;AAAA,EACE,OAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,oBAAAC,IAAqB;AAAA,EACrB,aAAAC;AAAA,EACA,cAAAC;AAAA,EACA,eAAAC;AAAA,EACA,gBAAAC,IAAiB;AAAA,EACjB,YAAAC;AAAA,EACA,uBAAAC,IAAwB;AAAA,EACxB,kBAAAC;AAAA,EACA,0BAAAC;AACF,GACAC,MACG;AACG,QAAAC,IAAoB,KAAK,IAAI,GAAG,KAAK,IAAIX,GAAcF,EAAM,SAAS,CAAC,CAAC,GACxE,CAACc,GAAWC,CAAY,IAAIC,EAASH,CAAiB,GACtDI,IAAgBH,IAAY,GAC5BI,IAAYJ,IAAYd,EAAM,SAAS,GACvCmB,IAAiBC,EAAQ,OAAO,EAAE,GAAGC,GAAkB,GAAGb,MAAe,CAACA,CAAU,CAAC,GACrFc,IAAwBF;AAAA,IAC5B,OAAO,EAAE,GAAGG,GAAyB,GAAGb;IACxC,CAACA,CAAgB;AAAA,EAAA,GAGbc,IAAYC;AAAA,IAChB,CAACC,MAAkB;AACjB,MAAIA,IAAQ,KAAKA,KAAS1B,EAAM,UAAU0B,MAAUZ,MACpDC,EAAaW,CAAK,GAClBpB,KAAA,QAAAA,EAAgBoB;AAAA,IAClB;AAAA,IACA,CAACZ,GAAWd,EAAM,QAAQM,CAAa;AAAA,EAAA;AAGzC,EAAAqB,EAAoBf,GAAK,OAAO;AAAA,IAC9B,cAAcE;AAAA,IACd,WAAAU;AAAA,EACA,EAAA;AAEI,QAAAI,IAAkBH,EAAY,MAAM;AACxC,QAAI,CAACP,EAAW;AAEhB,UAAMW,IAAWf,IAAY;AAE7B,IAAAC,EAAac,CAAQ,GACrBvB,KAAA,QAAAA,EAAgBuB,IACFzB,KAAA,QAAAA;AAAA,KACb,CAACc,GAAWJ,GAAWV,GAAaE,CAAa,CAAC,GAE/CwB,IAAmBL,EAAY,MAAM;AACzC,QAAI,CAACR,EAAe;AAEpB,UAAMY,IAAWf,IAAY;AAE7B,IAAAC,EAAac,CAAQ,GACrBvB,KAAA,QAAAA,EAAgBuB,IACDxB,KAAA,QAAAA;AAAA,KACd,CAACY,GAAeH,GAAWT,GAAcC,CAAa,CAAC,GAEpDyB,IAAiBN;AAAA,IACrB,CAACC,MAAkB;AACjB,MAAAF,EAAUE,CAAK,GACff,KAAA,QAAAA,EAA2Be;AAAA,IAC7B;AAAA,IACA,CAACF,GAAWb,CAAwB;AAAA,EAAA,GAGhCqB,IAAiBP,EAAY,MAAM;AACvC,IAAAD,EAAUV,IAAY,CAAC;AAAA,EAAA,GACtB,CAACU,GAAWV,CAAS,CAAC,GAEnBmB,IAAaR,EAAY,MAAM;AACnC,IAAAD,EAAUV,IAAY,CAAC;AAAA,EAAA,GACtB,CAACU,GAAWV,CAAS,CAAC,GAEnBoB,IAAad,EAAQ,MACrB,CAACb,KAAkBP,EAAM,UAAU,IAAU,OAG9C,gBAAAmC,EAAAC,GAAA,EAAS,gBAAe,OAAM,aAAY,UAAS,iBAAgB,UAAS,UAAU,GACpF,UAAApC,EAAM,IAAI,CAACqC,GAAGX,MACb,gBAAAS;AAAA,IAACG;AAAAA,IAAA;AAAA,MAEC,SAAS,MAAMP,EAAeL,CAAK;AAAA,MACnC,YAAYA,MAAUZ;AAAA,MACtB,WAAWK,EAAe;AAAA,MAC1B,mBAAmBA,EAAe;AAAA,MAClC,sBAAsBA,EAAe;AAAA,MACrC,wBAAwBA,EAAe;AAAA,IAAA;AAAA,IANlCO;AAAA,EAQR,CAAA,EACH,CAAA,GAED;AAAA,IACDZ;AAAA,IACAK,EAAe;AAAA,IACfA,EAAe;AAAA,IACfA,EAAe;AAAA,IACfA,EAAe;AAAA,IACfY;AAAA,IACA/B;AAAA,IACAO;AAAA,EAAA,CACD,GAEKgC,IAAmBnB,EAAQ,MAC3B,CAACX,KAAyBT,EAAM,UAAU,IAAU,OAGrD,gBAAAwC,EAAAC,GAAA,EAA2B,SAAQ,SAClC,UAAA;AAAA,IAAC,gBAAAN,EAAAO,GAAA,EAAU,SAAS,EAAG,CAAA;AAAA,IACvB,gBAAAF;AAAA,MAACJ;AAAA,MAAA;AAAA,QACC,gBAAe;AAAA,QACf,aAAY;AAAA,QACZ,iBAAgB;AAAA,QAChB,OAAO;AAAA,QACP,UAAUd,EAAsB,WAAW;AAAA,QAE3C,UAAA;AAAA,UAAA,gBAAAa;AAAA,YAACQ;AAAA,YAAA;AAAA,cACC,MAAMC;AAAAA,cACN,UAAUtB,EAAsB;AAAA,cAChC,gBAAe;AAAA,cACf,MAAMA,EAAsB;AAAA,cAC5B,SAASU;AAAA,cACT,UAAU,CAACf;AAAA,cACX,cAAW;AAAA,YAAA;AAAA,UACb;AAAA,UACCiB;AAAA,UACD,gBAAAC;AAAA,YAACQ;AAAA,YAAA;AAAA,cACC,MAAME;AAAAA,cACN,UAAUvB,EAAsB;AAAA,cAChC,gBAAe;AAAA,cACf,MAAMA,EAAsB;AAAA,cAC5B,SAASW;AAAA,cACT,UAAU,CAACf;AAAA,cACX,cAAW;AAAA,YAAA;AAAA,UACb;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EACF,EAAA,CAAA,GAED;AAAA,IACDA;AAAA,IACAD;AAAA,IACAK,EAAsB;AAAA,IACtBA,EAAsB;AAAA,IACtBA,EAAsB;AAAA,IACtBW;AAAA,IACAD;AAAA,IACAhC,EAAM;AAAA,IACNkC;AAAA,IACAzB;AAAA,EAAA,CACD;AAED,SAAAqC,EAAU,MAAM;AACd,IAAA/B,EAAab,CAAY;AAAA,EAAA,GACxB,CAACA,CAAY,CAAC,GAGf,gBAAAiC,EAACY,KAAmB,aAAanB,GAAiB,cAAcE,GAC9D,UAAA,gBAAAU,EAACQ,GAAA,EACC,UAAA;AAAA,IAAA,gBAAAb;AAAA,MAACc;AAAAA,MAAA;AAAA,QACC,YAAYnC,IAAY;AAAA,QACxB,oBAAoBX;AAAA,QAEnB,UAAAH,EAAM,IAAI,CAACkD,GAAMxB,MACf,gBAAAS,EAAAgB,GAAA,EAA0C,UAARD,EAAA,GAAAxB,CAAa,CACjD;AAAA,MAAA;AAAA,IACH;AAAA,IACC,CAACnB,KAAkB,CAACE,KAAyBT,EAAM,SAAS,KAAKC;AAAA,IACjEM,KAAkB,CAACE,KAClB,gBAAA0B,EAACM,GAAA,EAA2B,SAAQ,QAAQ,UAAWP,GAAA;AAAA,IAExDzB,KAAyB8B;AAAA,EAAA,EAC5B,CAAA,EACF,CAAA;AAEJ,GAEAa,KAAeC,EAAKC,EAAWvD,CAAiB,CAAC;"}
|
package/dist/index.d.ts
CHANGED
|
@@ -4091,22 +4091,22 @@ declare interface ISubmitModalProps_2 {
|
|
|
4091
4091
|
courseStream: TCourseStream;
|
|
4092
4092
|
}
|
|
4093
4093
|
|
|
4094
|
-
export declare interface
|
|
4094
|
+
export declare interface ISwipeableCarousel {
|
|
4095
4095
|
items: ReactNode[];
|
|
4096
|
-
|
|
4096
|
+
customNavigation?: ReactNode;
|
|
4097
4097
|
defaultIndex?: number;
|
|
4098
4098
|
transitionDuration?: number;
|
|
4099
4099
|
onSwipeLeft?: () => void;
|
|
4100
4100
|
onSwipeRight?: () => void;
|
|
4101
4101
|
onIndexChange?: (index: number) => void;
|
|
4102
|
-
|
|
4102
|
+
showIndicators?: boolean;
|
|
4103
4103
|
dotsConfig?: IDotConfig;
|
|
4104
4104
|
showNavigationButtons?: boolean;
|
|
4105
4105
|
navigationConfig?: INavigationConfig;
|
|
4106
|
-
|
|
4106
|
+
onCarouselIndicatorClick?: (index: number) => void;
|
|
4107
4107
|
}
|
|
4108
4108
|
|
|
4109
|
-
export declare interface
|
|
4109
|
+
export declare interface ISwipeableCarouselRefs {
|
|
4110
4110
|
currentIndex: number;
|
|
4111
4111
|
goToIndex: (index: number) => void;
|
|
4112
4112
|
}
|
|
@@ -6036,7 +6036,7 @@ export declare const StudentTrialReportModal: MemoExoticComponent<() => JSX.Elem
|
|
|
6036
6036
|
|
|
6037
6037
|
export declare const SubmitMilestoneModal: FC<ISubmitModalProps>;
|
|
6038
6038
|
|
|
6039
|
-
export declare const
|
|
6039
|
+
export declare const SwipeableCarousel: NamedExoticComponent<ISwipeableCarousel & RefAttributes<ISwipeableCarouselRefs>>;
|
|
6040
6040
|
|
|
6041
6041
|
export declare const SwipeableComponent: React.FC<ISwipeableComponentProps>;
|
|
6042
6042
|
|
package/dist/index.js
CHANGED
|
@@ -174,7 +174,7 @@ import { default as Rf } from "./features/ui/dot-lottie-animations/dot-lottie-an
|
|
|
174
174
|
import { default as Df } from "./features/ui/tabs/tabs.js";
|
|
175
175
|
import { default as Nf } from "./features/ui/linear-progress-bar/linear-progress-bar.js";
|
|
176
176
|
import { default as Of } from "./features/ui/swipeable-component/swipeable-component.js";
|
|
177
|
-
import { default as yf } from "./features/ui/
|
|
177
|
+
import { default as yf } from "./features/ui/swipeable-carousel/swipeable-carousel.js";
|
|
178
178
|
import { PLATFORM_EVENTS_STUDENT as Uf } from "./features/analytics-events/platform-events-student.js";
|
|
179
179
|
import { PLATFORM_EVENTS_TEACHER as vf } from "./features/analytics-events/platform-events-teacher.js";
|
|
180
180
|
import { WHITELIST_EVENTS as zf } from "./features/analytics-events/whitelist-events.js";
|
|
@@ -684,7 +684,7 @@ export {
|
|
|
684
684
|
xn as StudentProfileSummaryModal,
|
|
685
685
|
cn as StudentTrialReportModal,
|
|
686
686
|
sm as SubmitMilestoneModal,
|
|
687
|
-
yf as
|
|
687
|
+
yf as SwipeableCarousel,
|
|
688
688
|
Of as SwipeableComponent,
|
|
689
689
|
pr as SwitchIcon,
|
|
690
690
|
Rp as TRACKING_ID_STUDENT,
|
package/package.json
CHANGED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"swipable-carousel-styled.js","sources":["../../../../src/features/ui/swipable-carousel/swipable-carousel-styled.ts"],"sourcesContent":["import styled from 'styled-components';\n\nimport type { TColorNames } from '../types';\n\nexport const Carousel = styled.div`\n width: 100%;\n height: 100%;\n position: relative;\n display: flex;\n justify-content: center;\n touch-action: none;\n`;\n\nexport const CarouselContent = styled.div`\n width: 100%;\n height: 100%;\n position: relative;\n display: flex;\n justify-content: center;\n touch-action: none;\n`;\n\nexport const CarouselWrapper = styled.div<{ $translate?: number; $translateDuration?: number }>`\n display: flex;\n width: 100%;\n flex-grow: 1;\n transform: ${({ $translate = 0 }) => `translateX(${-$translate}%)`};\n transition: ${({ $translateDuration }) => `all ${$translateDuration}ms ease-in`};\n touch-action: none;\n`;\n\nexport const CarouselItemContainer = styled.div`\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-grow: 1;\n flex-shrink: 0;\n touch-action: none;\n`;\n\ninterface IDotProps {\n $isCurrent: boolean;\n $dotColor: TColorNames;\n $inactiveDotColor: TColorNames;\n $activeIndicatorSize: string;\n $inactiveIndicatorSize: string;\n}\n\nexport const Dot = styled.span<IDotProps>`\n background: ${({ theme, $isCurrent, $dotColor, $inactiveDotColor }) =>\n $isCurrent ? theme.colors[$dotColor] : theme.colors[$inactiveDotColor]};\n border: 1px solid ${({ theme, $dotColor }) => theme.colors[$dotColor]};\n width: ${({ $isCurrent, $activeIndicatorSize, $inactiveIndicatorSize }) =>\n $isCurrent ? $activeIndicatorSize : $inactiveIndicatorSize};\n height: ${({ $isCurrent, $activeIndicatorSize, $inactiveIndicatorSize }) =>\n $isCurrent ? $activeIndicatorSize : $inactiveIndicatorSize};\n border-radius: 50%;\n display: inline-block;\n transition: all 0.3s ease;\n cursor: pointer;\n\n &:hover {\n opacity: 0.8;\n }\n`;\n\nexport const NavigationConatainer = styled.div<{ $bottom?: string }>`\n position: absolute;\n bottom: ${({ $bottom }) => $bottom || '-48px'};\n`;\n"],"names":["Carousel","styled","CarouselWrapper","$translate","$translateDuration","CarouselItemContainer","Dot","theme","$isCurrent","$dotColor","$inactiveDotColor","$activeIndicatorSize","$inactiveIndicatorSize","NavigationConatainer","$bottom"],"mappings":";AAIO,MAAMA,IAAWC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASAA,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAS/B,MAAMC,IAAkBD,EAAO;AAAA;AAAA;AAAA;AAAA,eAIvB,CAAC,EAAE,YAAAE,IAAa,QAAQ,cAAc,CAACA,CAAU,IAAI;AAAA,gBACpD,CAAC,EAAE,oBAAAC,EAAyB,MAAA,OAAOA,CAAkB,YAAY;AAAA;AAAA,GAIpEC,IAAwBJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAkB/BK,IAAML,EAAO;AAAA,gBACV,CAAC,EAAE,OAAAM,GAAO,YAAAC,GAAY,WAAAC,GAAW,mBAAAC,EAAkB,MAC/DF,IAAaD,EAAM,OAAOE,CAAS,IAAIF,EAAM,OAAOG,CAAiB,CAAC;AAAA,sBACpD,CAAC,EAAE,OAAAH,GAAO,WAAAE,EAAA,MAAgBF,EAAM,OAAOE,CAAS,CAAC;AAAA,WAC5D,CAAC,EAAE,YAAAD,GAAY,sBAAAG,GAAsB,wBAAAC,QAC5CJ,IAAaG,IAAuBC,CAAsB;AAAA,YAClD,CAAC,EAAE,YAAAJ,GAAY,sBAAAG,GAAsB,wBAAAC,QAC7CJ,IAAaG,IAAuBC,CAAsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAWjDC,IAAuBZ,EAAO;AAAA;AAAA,YAE/B,CAAC,EAAE,SAAAa,QAAcA,KAAW,OAAO;AAAA;"}
|
|
@@ -1,132 +0,0 @@
|
|
|
1
|
-
import { jsx as i, jsxs as z } from "react/jsx-runtime";
|
|
2
|
-
import { memo as W, forwardRef as x, useState as F, useCallback as l, useImperativeHandle as K, useEffect as L } from "react";
|
|
3
|
-
import O from "../swipeable-component/swipeable-component.js";
|
|
4
|
-
import D from "../buttons/icon-button/icon-button.js";
|
|
5
|
-
import { Carousel as X, CarouselWrapper as g, CarouselItemContainer as k, NavigationConatainer as N, Dot as q } from "./swipable-carousel-styled.js";
|
|
6
|
-
import w from "../../../assets/line-icons/icons/chevron-left.js";
|
|
7
|
-
import B from "../../../assets/line-icons/icons/chevron-right.js";
|
|
8
|
-
import y from "../layout/flex-view.js";
|
|
9
|
-
import J from "../separator/separator.js";
|
|
10
|
-
const Q = {
|
|
11
|
-
dotColor: "BLACK_1",
|
|
12
|
-
inactiveDotColor: "WHITE_1",
|
|
13
|
-
activeIndicatorSize: "8px",
|
|
14
|
-
inactiveIndicatorSize: "8px",
|
|
15
|
-
spacing: "8px"
|
|
16
|
-
}, U = {
|
|
17
|
-
buttonVariant: "secondary",
|
|
18
|
-
buttonSize: "xsmall",
|
|
19
|
-
spacing: 8,
|
|
20
|
-
hideOnMobile: !0
|
|
21
|
-
}, Y = ({
|
|
22
|
-
items: o,
|
|
23
|
-
children: h,
|
|
24
|
-
defaultIndex: b = 0,
|
|
25
|
-
transitionDuration: j = 300,
|
|
26
|
-
onSwipeLeft: s,
|
|
27
|
-
onSwipeRight: u,
|
|
28
|
-
onIndexChange: e,
|
|
29
|
-
showDots: C = !1,
|
|
30
|
-
dotsConfig: G,
|
|
31
|
-
showNavigationButtons: v = !1,
|
|
32
|
-
navigationConfig: I,
|
|
33
|
-
onDotClick: f
|
|
34
|
-
}, P) => {
|
|
35
|
-
const V = Math.max(0, Math.min(b, o.length - 1)), [r, m] = F(V), $ = r > 0, d = r < o.length - 1, p = { ...Q, ...G }, c = { ...U, ...I }, a = l(
|
|
36
|
-
(t) => {
|
|
37
|
-
t < 0 || t >= o.length || t === r || (m(t), e == null || e(t));
|
|
38
|
-
},
|
|
39
|
-
[r, o.length, e]
|
|
40
|
-
), A = l(() => {
|
|
41
|
-
if (!d) return;
|
|
42
|
-
const t = r + 1;
|
|
43
|
-
m(t), e == null || e(t), s == null || s();
|
|
44
|
-
}, [d, r, s, e]), M = l(() => {
|
|
45
|
-
if (!$) return;
|
|
46
|
-
const t = r - 1;
|
|
47
|
-
m(t), e == null || e(t), u == null || u();
|
|
48
|
-
}, [$, r, u, e]), _ = l(
|
|
49
|
-
(t) => {
|
|
50
|
-
a(t), f == null || f(t);
|
|
51
|
-
},
|
|
52
|
-
[a, f]
|
|
53
|
-
), E = l(() => {
|
|
54
|
-
a(r - 1);
|
|
55
|
-
}, [a, r]), H = l(() => {
|
|
56
|
-
a(r + 1);
|
|
57
|
-
}, [a, r]);
|
|
58
|
-
K(P, () => ({
|
|
59
|
-
currentIndex: r,
|
|
60
|
-
goToIndex: a
|
|
61
|
-
})), L(() => {
|
|
62
|
-
m(b);
|
|
63
|
-
}, [b]);
|
|
64
|
-
const S = () => !C || o.length <= 1 ? null : /* @__PURE__ */ i(y, { $flexDirection: "row", $alignItems: "center", $justifyContent: "center", $flexGap: 8, children: o.map((t, n) => /* @__PURE__ */ i(
|
|
65
|
-
q,
|
|
66
|
-
{
|
|
67
|
-
onClick: () => _(n),
|
|
68
|
-
$isCurrent: n === r,
|
|
69
|
-
$dotColor: p.dotColor,
|
|
70
|
-
$inactiveDotColor: p.inactiveDotColor,
|
|
71
|
-
$activeIndicatorSize: p.activeIndicatorSize,
|
|
72
|
-
$inactiveIndicatorSize: p.inactiveIndicatorSize
|
|
73
|
-
},
|
|
74
|
-
n
|
|
75
|
-
)) }), T = () => !v || o.length <= 1 ? null : /* @__PURE__ */ z(N, { $bottom: "-48px", children: [
|
|
76
|
-
/* @__PURE__ */ i(J, { heightX: 1 }),
|
|
77
|
-
/* @__PURE__ */ z(
|
|
78
|
-
y,
|
|
79
|
-
{
|
|
80
|
-
$flexDirection: "row",
|
|
81
|
-
$alignItems: "center",
|
|
82
|
-
$justifyContent: "center",
|
|
83
|
-
$flex: 1,
|
|
84
|
-
$flexGap: c.spacing || 8,
|
|
85
|
-
children: [
|
|
86
|
-
/* @__PURE__ */ i(
|
|
87
|
-
D,
|
|
88
|
-
{
|
|
89
|
-
Icon: w,
|
|
90
|
-
renderAs: c.buttonVariant,
|
|
91
|
-
analyticsLabel: "Previous",
|
|
92
|
-
size: c.buttonSize,
|
|
93
|
-
onClick: E,
|
|
94
|
-
disabled: !$,
|
|
95
|
-
"aria-label": "Previous item"
|
|
96
|
-
}
|
|
97
|
-
),
|
|
98
|
-
S(),
|
|
99
|
-
/* @__PURE__ */ i(
|
|
100
|
-
D,
|
|
101
|
-
{
|
|
102
|
-
Icon: B,
|
|
103
|
-
renderAs: c.buttonVariant,
|
|
104
|
-
analyticsLabel: "Next",
|
|
105
|
-
size: c.buttonSize,
|
|
106
|
-
onClick: H,
|
|
107
|
-
disabled: !d,
|
|
108
|
-
"aria-label": "Next item"
|
|
109
|
-
}
|
|
110
|
-
)
|
|
111
|
-
]
|
|
112
|
-
}
|
|
113
|
-
)
|
|
114
|
-
] });
|
|
115
|
-
return /* @__PURE__ */ i(O, { onSwipeLeft: A, onSwipeRight: M, children: /* @__PURE__ */ z(X, { children: [
|
|
116
|
-
/* @__PURE__ */ i(
|
|
117
|
-
g,
|
|
118
|
-
{
|
|
119
|
-
$translate: r * 100,
|
|
120
|
-
$translateDuration: j,
|
|
121
|
-
children: o.map((t, n) => /* @__PURE__ */ i(k, { children: t }, n))
|
|
122
|
-
}
|
|
123
|
-
),
|
|
124
|
-
h,
|
|
125
|
-
C && !v && /* @__PURE__ */ i(N, { $bottom: "-18px", children: S() }),
|
|
126
|
-
v && T()
|
|
127
|
-
] }) });
|
|
128
|
-
}, ct = W(x(Y));
|
|
129
|
-
export {
|
|
130
|
-
ct as default
|
|
131
|
-
};
|
|
132
|
-
//# sourceMappingURL=swipable-carousel.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"swipable-carousel.js","sources":["../../../../src/features/ui/swipable-carousel/swipable-carousel.tsx"],"sourcesContent":["import {\n type ForwardRefRenderFunction,\n memo,\n useCallback,\n useEffect,\n useState,\n forwardRef,\n useImperativeHandle,\n} from 'react';\n\nimport SwipeableComponent from '../swipeable-component/swipeable-component';\nimport IconButton from '../buttons/icon-button/icon-button';\nimport * as Styled from './swipable-carousel-styled';\nimport type { ISwipableCarouselRefs, ISwipableCarousel } from './swipable-carousel-types';\nimport ChevronLeft from '../../../assets/line-icons/icons/chevron-left';\nimport ChevronRight from '../../../assets/line-icons/icons/chevron-right';\nimport FlexView from '../layout/flex-view';\nimport Separator from '../separator/separator';\n\n// Default dot configuration\nconst defaultDotConfig = {\n dotColor: 'BLACK_1' as const,\n inactiveDotColor: 'WHITE_1' as const,\n activeIndicatorSize: '8px',\n inactiveIndicatorSize: '8px',\n spacing: '8px',\n};\n\n// Default navigation configuration\nconst defaultNavigationConfig = {\n buttonVariant: 'secondary' as const,\n buttonSize: 'xsmall' as const,\n spacing: 8,\n hideOnMobile: true,\n};\n\nconst SwipableCarousel: ForwardRefRenderFunction<ISwipableCarouselRefs, ISwipableCarousel> = (\n {\n items,\n children,\n defaultIndex = 0,\n transitionDuration = 300,\n onSwipeLeft,\n onSwipeRight,\n onIndexChange,\n showDots = false,\n dotsConfig,\n showNavigationButtons = false,\n navigationConfig,\n onDotClick,\n },\n ref,\n) => {\n const validDefaultIndex = Math.max(0, Math.min(defaultIndex, items.length - 1));\n const [currIndex, setCurrIndex] = useState(validDefaultIndex);\n const canGoPrevious = currIndex > 0;\n const canGoNext = currIndex < items.length - 1;\n const finalDotConfig = { ...defaultDotConfig, ...dotsConfig };\n const finalNavigationConfig = { ...defaultNavigationConfig, ...navigationConfig };\n\n const goToIndex = useCallback(\n (index: number) => {\n if (index < 0 || index >= items.length || index === currIndex) return;\n setCurrIndex(index);\n onIndexChange?.(index);\n },\n [currIndex, items.length, onIndexChange],\n );\n\n const handleSwipeLeft = useCallback(() => {\n if (!canGoNext) return;\n\n const newIndex = currIndex + 1;\n\n setCurrIndex(newIndex);\n onIndexChange?.(newIndex);\n onSwipeLeft?.();\n }, [canGoNext, currIndex, onSwipeLeft, onIndexChange]);\n\n const handleSwipeRight = useCallback(() => {\n if (!canGoPrevious) return;\n\n const newIndex = currIndex - 1;\n\n setCurrIndex(newIndex);\n onIndexChange?.(newIndex);\n onSwipeRight?.();\n }, [canGoPrevious, currIndex, onSwipeRight, onIndexChange]);\n\n const handleDotClick = useCallback(\n (index: number) => {\n goToIndex(index);\n onDotClick?.(index);\n },\n [goToIndex, onDotClick],\n );\n\n const handlePrevious = useCallback(() => {\n goToIndex(currIndex - 1);\n }, [goToIndex, currIndex]);\n\n const handleNext = useCallback(() => {\n goToIndex(currIndex + 1);\n }, [goToIndex, currIndex]);\n\n useImperativeHandle(ref, () => ({\n currentIndex: currIndex,\n goToIndex,\n }));\n\n useEffect(() => {\n setCurrIndex(defaultIndex);\n }, [defaultIndex]);\n\n const renderDots = () => {\n if (!showDots || items.length <= 1) return null;\n\n return (\n <FlexView $flexDirection=\"row\" $alignItems=\"center\" $justifyContent=\"center\" $flexGap={8}>\n {items.map((_, index) => (\n <Styled.Dot\n key={index}\n onClick={() => handleDotClick(index)}\n $isCurrent={index === currIndex}\n $dotColor={finalDotConfig.dotColor}\n $inactiveDotColor={finalDotConfig.inactiveDotColor}\n $activeIndicatorSize={finalDotConfig.activeIndicatorSize}\n $inactiveIndicatorSize={finalDotConfig.inactiveIndicatorSize}\n />\n ))}\n </FlexView>\n );\n };\n\n const renderNavigation = () => {\n if (!showNavigationButtons || items.length <= 1) return null;\n\n return (\n <Styled.NavigationConatainer $bottom=\"-48px\">\n <Separator heightX={1} />\n <FlexView\n $flexDirection=\"row\"\n $alignItems=\"center\"\n $justifyContent=\"center\"\n $flex={1}\n $flexGap={finalNavigationConfig.spacing || 8}\n >\n <IconButton\n Icon={ChevronLeft}\n renderAs={finalNavigationConfig.buttonVariant}\n analyticsLabel=\"Previous\"\n size={finalNavigationConfig.buttonSize}\n onClick={handlePrevious}\n disabled={!canGoPrevious}\n aria-label=\"Previous item\"\n />\n {renderDots()}\n <IconButton\n Icon={ChevronRight}\n renderAs={finalNavigationConfig.buttonVariant}\n analyticsLabel=\"Next\"\n size={finalNavigationConfig.buttonSize}\n onClick={handleNext}\n disabled={!canGoNext}\n aria-label=\"Next item\"\n />\n </FlexView>\n </Styled.NavigationConatainer>\n );\n };\n\n return (\n <SwipeableComponent onSwipeLeft={handleSwipeLeft} onSwipeRight={handleSwipeRight}>\n <Styled.Carousel>\n <Styled.CarouselWrapper\n $translate={currIndex * 100}\n $translateDuration={transitionDuration}\n >\n {items.map((item, index) => (\n <Styled.CarouselItemContainer key={index}>{item}</Styled.CarouselItemContainer>\n ))}\n </Styled.CarouselWrapper>\n {children}\n {showDots && !showNavigationButtons && (\n <Styled.NavigationConatainer $bottom=\"-18px\">{renderDots()}</Styled.NavigationConatainer>\n )}\n {showNavigationButtons && renderNavigation()}\n </Styled.Carousel>\n </SwipeableComponent>\n );\n};\n\nexport default memo(forwardRef(SwipableCarousel));\n"],"names":["defaultDotConfig","defaultNavigationConfig","SwipableCarousel","items","children","defaultIndex","transitionDuration","onSwipeLeft","onSwipeRight","onIndexChange","showDots","dotsConfig","showNavigationButtons","navigationConfig","onDotClick","ref","validDefaultIndex","currIndex","setCurrIndex","useState","canGoPrevious","canGoNext","finalDotConfig","finalNavigationConfig","goToIndex","useCallback","index","handleSwipeLeft","newIndex","handleSwipeRight","handleDotClick","handlePrevious","handleNext","useImperativeHandle","useEffect","renderDots","jsx","FlexView","_","Styled.Dot","renderNavigation","jsxs","Styled.NavigationConatainer","Separator","IconButton","ChevronLeft","ChevronRight","SwipeableComponent","Styled.Carousel","Styled.CarouselWrapper","item","Styled.CarouselItemContainer","SwipableCarousel$1","memo","forwardRef"],"mappings":"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"}
|