@cuemath/leap 2.9.7-rj-0 → 2.9.7-rj-2
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/hooks/use-game-launcher-journey/use-game-launcher-journey.js +51 -51
- package/dist/features/circle-games/game-launcher/hooks/use-game-launcher-journey/use-game-launcher-journey.js.map +1 -1
- package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.js +33 -33
- package/dist/features/circle-games/game-launcher/hooks/use-table-launcher-journey/use-table-launcher-journey.js.map +1 -1
- package/dist/features/circle-games/games/tutorial/tutorial.js +25 -19
- package/dist/features/circle-games/games/tutorial/tutorial.js.map +1 -1
- package/dist/features/journey/comps/coachmark/coachmark.js +20 -19
- package/dist/features/journey/comps/coachmark/coachmark.js.map +1 -1
- package/dist/features/journey/use-journey/constants.js +2 -4
- package/dist/features/journey/use-journey/constants.js.map +1 -1
- package/dist/features/journey/use-journey/journey-styled.js +3 -4
- package/dist/features/journey/use-journey/journey-styled.js.map +1 -1
- package/dist/features/ui/constants/z-index.js +2 -1
- package/dist/features/ui/constants/z-index.js.map +1 -1
- package/dist/features/ui/theme/breakpoints.js +7 -0
- package/dist/features/ui/theme/breakpoints.js.map +1 -0
- package/dist/features/ui/theme/get-theme.js +20 -18
- package/dist/features/ui/theme/get-theme.js.map +1 -1
- package/dist/index.d.ts +7 -5
- package/dist/index.js +133 -135
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
- package/dist/features/hooks/use-breakpoint/constants.js +0 -7
- package/dist/features/hooks/use-breakpoint/constants.js.map +0 -1
- package/dist/features/hooks/use-breakpoint/use-breakpoint.js +0 -16
- package/dist/features/hooks/use-breakpoint/use-breakpoint.js.map +0 -1
|
@@ -1,26 +1,32 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { forwardRef as I, useState as
|
|
1
|
+
import { jsxs as c, jsx as r } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as I, useState as C, useRef as u, useCallback as V, useImperativeHandle as v } from "react";
|
|
3
3
|
import x from "../../../../assets/line-icons/icons/cross.js";
|
|
4
|
-
import
|
|
5
|
-
import T from "
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
4
|
+
import H from "../../../ui/text/text.js";
|
|
5
|
+
import { GameTutorialWrapper as T, GameTutorialHeader as $, HeaderIconContainer as G, GameTutorialContainer as P, VideoContainer as R, VideoProgressWrapper as W, VideoProgressContainer as b, VideoProgress as j } from "./tutorial-styled.js";
|
|
6
|
+
const U = I(
|
|
7
|
+
({
|
|
8
|
+
src: m,
|
|
9
|
+
title: o,
|
|
10
|
+
onCross: t,
|
|
11
|
+
showProgress: p = !0,
|
|
12
|
+
onTutorialPlayedOnce: e,
|
|
13
|
+
isJourneyActive: f
|
|
14
|
+
}, l) => {
|
|
15
|
+
const [i, h] = C(0), n = u(!1), s = u(null), g = V(
|
|
16
|
+
(a) => {
|
|
17
|
+
const d = (a.target.currentTime || 0) / (a.target.duration || 1) * 100;
|
|
18
|
+
d >= 90 && !n.current && (n.current = !0, e == null || e()), h(d);
|
|
13
19
|
},
|
|
14
20
|
[e]
|
|
15
21
|
);
|
|
16
|
-
return
|
|
22
|
+
return v(l, () => ({
|
|
17
23
|
videoRef: s
|
|
18
|
-
})), /* @__PURE__ */
|
|
19
|
-
(o || t) && /* @__PURE__ */
|
|
20
|
-
o && /* @__PURE__ */ r(
|
|
21
|
-
t && /* @__PURE__ */ r(
|
|
24
|
+
})), /* @__PURE__ */ c(T, { children: [
|
|
25
|
+
(o || t) && /* @__PURE__ */ c($, { children: [
|
|
26
|
+
o && /* @__PURE__ */ r(H, { $renderAs: "ac3", $color: "WHITE", $align: "center", children: o }),
|
|
27
|
+
t && /* @__PURE__ */ r(G, { children: /* @__PURE__ */ r(x, { color: "#fff", onClick: t }) })
|
|
22
28
|
] }),
|
|
23
|
-
/* @__PURE__ */ r(
|
|
29
|
+
/* @__PURE__ */ r(P, { children: /* @__PURE__ */ r(R, { isJourneyActive: f, children: /* @__PURE__ */ r(
|
|
24
30
|
"video",
|
|
25
31
|
{
|
|
26
32
|
ref: s,
|
|
@@ -34,11 +40,11 @@ const q = I(
|
|
|
34
40
|
playsInline: !0
|
|
35
41
|
}
|
|
36
42
|
) }) }),
|
|
37
|
-
p && /* @__PURE__ */ r(
|
|
43
|
+
p && /* @__PURE__ */ r(W, { children: /* @__PURE__ */ r(b, { children: i > 0 && /* @__PURE__ */ r(j, { $width: i }) }) })
|
|
38
44
|
] });
|
|
39
45
|
}
|
|
40
46
|
);
|
|
41
47
|
export {
|
|
42
|
-
|
|
48
|
+
U as Tutorial
|
|
43
49
|
};
|
|
44
50
|
//# sourceMappingURL=tutorial.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tutorial.js","sources":["../../../../../src/features/circle-games/games/tutorial/tutorial.tsx"],"sourcesContent":["import type { ITutorialProps, ITutorialRef } from './tutorial-types';\nimport type { ChangeEvent } from 'react';\n\nimport { forwardRef, useCallback, useImperativeHandle, useRef, useState } from 'react';\n\nimport CrossIcon from '../../../../assets/line-icons/icons/cross';\nimport
|
|
1
|
+
{"version":3,"file":"tutorial.js","sources":["../../../../../src/features/circle-games/games/tutorial/tutorial.tsx"],"sourcesContent":["import type { ITutorialProps, ITutorialRef } from './tutorial-types';\nimport type { ChangeEvent } from 'react';\n\nimport { forwardRef, useCallback, useImperativeHandle, useRef, useState } from 'react';\n\nimport CrossIcon from '../../../../assets/line-icons/icons/cross';\nimport Text from '../../../ui/text/text';\nimport * as Styled from './tutorial-styled';\n\nexport const Tutorial = forwardRef<ITutorialRef, ITutorialProps>(\n (\n {\n src,\n title,\n onCross,\n showProgress = true,\n onTutorialPlayedOnce,\n isJourneyActive,\n }: ITutorialProps,\n ref,\n ) => {\n const [progress, setProgress] = useState(0);\n const hasVideoEnded = useRef(false);\n const videoRef = useRef<HTMLVideoElement>(null);\n\n const onProgress = useCallback(\n (e: ChangeEvent<HTMLVideoElement>) => {\n const p = ((e.target.currentTime || 0) / (e.target.duration || 1)) * 100;\n\n if (p >= 90 && !hasVideoEnded.current) {\n hasVideoEnded.current = true;\n onTutorialPlayedOnce?.();\n }\n\n setProgress(p);\n },\n [onTutorialPlayedOnce],\n );\n\n useImperativeHandle(ref, () => ({\n videoRef,\n }));\n\n return (\n <Styled.GameTutorialWrapper>\n {(title || onCross) && (\n <Styled.GameTutorialHeader>\n {title && (\n <Text $renderAs=\"ac3\" $color=\"WHITE\" $align=\"center\">\n {title}\n </Text>\n )}\n {onCross && (\n <Styled.HeaderIconContainer>\n <CrossIcon color=\"#fff\" onClick={onCross} />\n </Styled.HeaderIconContainer>\n )}\n </Styled.GameTutorialHeader>\n )}\n <Styled.GameTutorialContainer>\n <Styled.VideoContainer isJourneyActive={isJourneyActive}>\n <video\n ref={videoRef}\n loop={true}\n autoPlay={true}\n muted={true}\n src={src}\n onTimeUpdate={onProgress}\n disablePictureInPicture={true}\n itemType=\"video/mp4\"\n playsInline\n />\n </Styled.VideoContainer>\n </Styled.GameTutorialContainer>\n\n {showProgress && (\n <Styled.VideoProgressWrapper>\n <Styled.VideoProgressContainer>\n {progress > 0 && <Styled.VideoProgress $width={progress} />}\n </Styled.VideoProgressContainer>\n </Styled.VideoProgressWrapper>\n )}\n </Styled.GameTutorialWrapper>\n );\n },\n);\n"],"names":["Tutorial","forwardRef","src","title","onCross","showProgress","onTutorialPlayedOnce","isJourneyActive","ref","progress","setProgress","useState","hasVideoEnded","useRef","videoRef","onProgress","useCallback","e","p","useImperativeHandle","jsxs","Styled.GameTutorialWrapper","Styled.GameTutorialHeader","jsx","Text","Styled.HeaderIconContainer","CrossIcon","Styled.GameTutorialContainer","Styled.VideoContainer","Styled.VideoProgressWrapper","Styled.VideoProgressContainer","Styled.VideoProgress"],"mappings":";;;;;AASO,MAAMA,IAAWC;AAAA,EACtB,CACE;AAAA,IACE,KAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,cAAAC,IAAe;AAAA,IACf,sBAAAC;AAAA,IACA,iBAAAC;AAAA,KAEFC,MACG;AACH,UAAM,CAACC,GAAUC,CAAW,IAAIC,EAAS,CAAC,GACpCC,IAAgBC,EAAO,EAAK,GAC5BC,IAAWD,EAAyB,IAAI,GAExCE,IAAaC;AAAA,MACjB,CAACC,MAAqC;AAC9B,cAAAC,KAAMD,EAAE,OAAO,eAAe,MAAMA,EAAE,OAAO,YAAY,KAAM;AAErE,QAAIC,KAAK,MAAM,CAACN,EAAc,YAC5BA,EAAc,UAAU,IACDN,KAAA,QAAAA,MAGzBI,EAAYQ,CAAC;AAAA,MACf;AAAA,MACA,CAACZ,CAAoB;AAAA,IAAA;AAGvB,WAAAa,EAAoBX,GAAK,OAAO;AAAA,MAC9B,UAAAM;AAAA,IACA,EAAA,GAGA,gBAAAM,EAACC,GAAA,EACG,UAAA;AAAA,OAAAlB,KAASC,MACT,gBAAAgB,EAACE,GAAA,EACE,UAAA;AAAA,QACCnB,KAAA,gBAAAoB,EAACC,KAAK,WAAU,OAAM,QAAO,SAAQ,QAAO,UACzC,UACHrB,EAAA,CAAA;AAAA,QAEDC,KACE,gBAAAmB,EAAAE,GAAA,EACC,UAAC,gBAAAF,EAAAG,GAAA,EAAU,OAAM,QAAO,SAAStB,EAAA,CAAS,EAC5C,CAAA;AAAA,MAAA,GAEJ;AAAA,MAEF,gBAAAmB,EAACI,GAAA,EACC,4BAACC,GAAA,EAAsB,iBAAArB,GACrB,UAAA,gBAAAgB;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,KAAKT;AAAA,UACL,MAAM;AAAA,UACN,UAAU;AAAA,UACV,OAAO;AAAA,UACP,KAAAZ;AAAA,UACA,cAAca;AAAA,UACd,yBAAyB;AAAA,UACzB,UAAS;AAAA,UACT,aAAW;AAAA,QAAA;AAAA,SAEf,EACF,CAAA;AAAA,MAECV,KACE,gBAAAkB,EAAAM,GAAA,EACC,UAAA,gBAAAN,EAACO,GAAA,EACE,UAAWrB,IAAA,uBAAMsB,GAAA,EAAqB,QAAQtB,EAAU,CAAA,EAC3D,CAAA,GACF;AAAA,IAEJ,EAAA,CAAA;AAAA,EAEJ;AACF;"}
|
|
@@ -1,21 +1,22 @@
|
|
|
1
|
-
import { jsx as o, jsxs as
|
|
2
|
-
import { useMemo as
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
|
|
9
|
-
|
|
1
|
+
import { jsx as o, jsxs as m, Fragment as f } from "react/jsx-runtime";
|
|
2
|
+
import { useMemo as s } from "react";
|
|
3
|
+
import T from "../../../ui/arrow-tooltip/arrow-tooltip.js";
|
|
4
|
+
import O from "../../../ui/nudge/nudge.js";
|
|
5
|
+
import { getTheme as P } from "../../../ui/theme/get-theme.js";
|
|
6
|
+
import { IndicatorType as d } from "../../use-journey/constants.js";
|
|
7
|
+
import { CoachmarkBody as $, ClonedElementWrapper as u } from "./coachmark-styled.js";
|
|
8
|
+
import { toolTipGetXCoordinates as b } from "./coachmark-utils.js";
|
|
9
|
+
const X = ({ coachmark: t }) => {
|
|
10
|
+
const i = t.originalElementToHighlightRef.current, { top: r = 0, left: n = 0, height: h = 0, width: I = 0 } = (i == null ? void 0 : i.getBoundingClientRect()) || {}, { zIndex: C } = P(), p = C.JOURNEY_OVERLAY, l = s(() => () => i ? window.getComputedStyle(i).position === "absolute" : !1, [i]), g = s(() => {
|
|
10
11
|
const e = t.indicator;
|
|
11
12
|
return {
|
|
12
13
|
width: 264,
|
|
13
14
|
// Can be over ridden
|
|
14
|
-
tooltipXCoOrdinates:
|
|
15
|
+
tooltipXCoOrdinates: b(e.position) + (e.tooltipXCoOrdinates ?? 0),
|
|
15
16
|
// For absolutely positioned elements
|
|
16
|
-
zIndex:
|
|
17
|
+
zIndex: p + 1,
|
|
17
18
|
...e,
|
|
18
|
-
tooltipItem: /* @__PURE__ */ o(
|
|
19
|
+
tooltipItem: /* @__PURE__ */ o($, { children: e.tooltipItem }),
|
|
19
20
|
alwaysVisible: !0,
|
|
20
21
|
renderAs: "primary",
|
|
21
22
|
// Deprecate this
|
|
@@ -25,7 +26,7 @@ const H = ({ coachmark: t }) => {
|
|
|
25
26
|
type: d.TOOLTIP,
|
|
26
27
|
isAnimated: !0
|
|
27
28
|
};
|
|
28
|
-
}, [t.indicator]),
|
|
29
|
+
}, [p, t.indicator]), y = s(() => {
|
|
29
30
|
const e = t.indicator;
|
|
30
31
|
return {
|
|
31
32
|
...e,
|
|
@@ -33,12 +34,12 @@ const H = ({ coachmark: t }) => {
|
|
|
33
34
|
nudgePointerY: r + (e.nudgePointerY ?? 0)
|
|
34
35
|
};
|
|
35
36
|
}, [t.indicator, n, r]);
|
|
36
|
-
return !i || !t.isActive ? null : t.type === d.TOOLTIP ? l() ? /* @__PURE__ */
|
|
37
|
+
return !i || !t.isActive ? null : t.type === d.TOOLTIP ? l() ? /* @__PURE__ */ m(f, { children: [
|
|
37
38
|
t.elementToHighlight,
|
|
38
|
-
/* @__PURE__ */ o(
|
|
39
|
-
] }) : /* @__PURE__ */ o(
|
|
39
|
+
/* @__PURE__ */ o(u, { $position: "absolute", $top: r, $left: n, children: /* @__PURE__ */ o(T, { ...g, children: /* @__PURE__ */ o("div", { style: { height: h, width: I } }) }) })
|
|
40
|
+
] }) : /* @__PURE__ */ o(u, { $position: "absolute", $top: r, $left: n, children: /* @__PURE__ */ o(T, { ...g, children: t.elementToHighlight }) }) : t.type === d.NUDGE ? /* @__PURE__ */ m(f, { children: [
|
|
40
41
|
/* @__PURE__ */ o(
|
|
41
|
-
|
|
42
|
+
u,
|
|
42
43
|
{
|
|
43
44
|
$top: l() ? 0 : r,
|
|
44
45
|
$left: l() ? 0 : n,
|
|
@@ -46,10 +47,10 @@ const H = ({ coachmark: t }) => {
|
|
|
46
47
|
children: t.elementToHighlight
|
|
47
48
|
}
|
|
48
49
|
),
|
|
49
|
-
/* @__PURE__ */ o(
|
|
50
|
+
/* @__PURE__ */ o(O, { zIndex: p + 1, ...y })
|
|
50
51
|
] }) : null;
|
|
51
52
|
};
|
|
52
53
|
export {
|
|
53
|
-
|
|
54
|
+
X as Coachmark
|
|
54
55
|
};
|
|
55
56
|
//# sourceMappingURL=coachmark.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"coachmark.js","sources":["../../../../../src/features/journey/comps/coachmark/coachmark.tsx"],"sourcesContent":["import type { IArrowTooltipProps } from '../../../ui/arrow-tooltip/arrow-tooltip-types';\nimport type { INudgeProps } from '../../../ui/nudge/nudge-types';\nimport type { ICoachmarkProps } from '../../use-journey/journey-context-types';\n\nimport React, { useMemo } from 'react';\n\nimport ArrowTooltip from '../../../ui/arrow-tooltip/arrow-tooltip';\nimport Nudge from '../../../ui/nudge/nudge';\nimport {
|
|
1
|
+
{"version":3,"file":"coachmark.js","sources":["../../../../../src/features/journey/comps/coachmark/coachmark.tsx"],"sourcesContent":["import type { IArrowTooltipProps } from '../../../ui/arrow-tooltip/arrow-tooltip-types';\nimport type { INudgeProps } from '../../../ui/nudge/nudge-types';\nimport type { ICoachmarkProps } from '../../use-journey/journey-context-types';\n\nimport React, { useMemo } from 'react';\n\nimport ArrowTooltip from '../../../ui/arrow-tooltip/arrow-tooltip';\nimport Nudge from '../../../ui/nudge/nudge';\nimport { getTheme } from '../../../ui/theme/get-theme';\nimport { IndicatorType } from '../../use-journey/constants';\nimport * as S from './coachmark-styled';\nimport { toolTipGetXCoordinates } from './coachmark-utils';\n\nexport const Coachmark: React.FC<{ coachmark: ICoachmarkProps }> = ({ coachmark }) => {\n const targetElement = coachmark.originalElementToHighlightRef.current;\n const { top = 0, left = 0, height = 0, width = 0 } = targetElement?.getBoundingClientRect() || {};\n\n const { zIndex } = getTheme();\n const BLUR_OVERLAY_Z_INDEX = zIndex.JOURNEY_OVERLAY;\n\n const isAbsolute = useMemo(() => {\n return () => {\n if (!targetElement) return false;\n\n return window.getComputedStyle(targetElement).position === 'absolute';\n };\n }, [targetElement]);\n\n const tooltipProps = useMemo(() => {\n const arrowToolTipProps = coachmark.indicator as IArrowTooltipProps;\n\n return {\n width: 264, // Can be over ridden\n tooltipXCoOrdinates:\n toolTipGetXCoordinates(arrowToolTipProps.position) +\n (arrowToolTipProps.tooltipXCoOrdinates ?? 0), // For absolutely positioned elements\n zIndex: BLUR_OVERLAY_Z_INDEX + 1,\n ...arrowToolTipProps,\n tooltipItem: <S.CoachmarkBody>{arrowToolTipProps.tooltipItem}</S.CoachmarkBody>,\n alwaysVisible: true,\n renderAs: 'primary', // Deprecate this\n borderWidth: 1,\n arrowColor: 'WHITE',\n borderColor: 'WHITE',\n type: IndicatorType.TOOLTIP,\n isAnimated: true,\n } as IArrowTooltipProps;\n }, [BLUR_OVERLAY_Z_INDEX, coachmark.indicator]);\n\n const nudgeProps = useMemo(() => {\n const props: INudgeProps = coachmark.indicator as INudgeProps;\n\n return {\n ...props,\n nudgePointerX: left + (props.nudgePointerX ?? 0),\n nudgePointerY: top + (props.nudgePointerY ?? 0),\n };\n }, [coachmark.indicator, left, top]);\n\n if (!targetElement || !coachmark.isActive) {\n return null;\n }\n\n if (coachmark.type === IndicatorType.TOOLTIP) {\n if (isAbsolute()) {\n return (\n <>\n {coachmark.elementToHighlight}\n <S.ClonedElementWrapper $position=\"absolute\" $top={top} $left={left}>\n <ArrowTooltip {...tooltipProps}>\n <div style={{ height, width }} />\n </ArrowTooltip>\n </S.ClonedElementWrapper>\n </>\n );\n }\n\n return (\n <S.ClonedElementWrapper $position=\"absolute\" $top={top} $left={left}>\n <ArrowTooltip {...tooltipProps}>{coachmark.elementToHighlight}</ArrowTooltip>\n </S.ClonedElementWrapper>\n );\n }\n\n if (coachmark.type === IndicatorType.NUDGE) {\n return (\n <>\n <S.ClonedElementWrapper\n $top={isAbsolute() ? 0 : top}\n $left={isAbsolute() ? 0 : left}\n $position={isAbsolute() ? 'relative' : 'absolute'}\n >\n {coachmark.elementToHighlight}\n </S.ClonedElementWrapper>\n <Nudge zIndex={BLUR_OVERLAY_Z_INDEX + 1} {...nudgeProps} />\n </>\n );\n }\n\n return null;\n};\n"],"names":["Coachmark","coachmark","targetElement","top","left","height","width","zIndex","getTheme","BLUR_OVERLAY_Z_INDEX","isAbsolute","useMemo","tooltipProps","arrowToolTipProps","toolTipGetXCoordinates","jsx","S.CoachmarkBody","IndicatorType","nudgeProps","props","jsxs","Fragment","S.ClonedElementWrapper","ArrowTooltip","Nudge"],"mappings":";;;;;;;;AAaO,MAAMA,IAAsD,CAAC,EAAE,WAAAC,QAAgB;AAC9E,QAAAC,IAAgBD,EAAU,8BAA8B,SACxD,EAAE,KAAAE,IAAM,GAAG,MAAAC,IAAO,GAAG,QAAAC,IAAS,GAAG,OAAAC,IAAQ,EAAE,KAAIJ,KAAA,gBAAAA,EAAe,4BAA2B,CAAA,GAEzF,EAAE,QAAAK,MAAWC,KACbC,IAAuBF,EAAO,iBAE9BG,IAAaC,EAAQ,MAClB,MACAT,IAEE,OAAO,iBAAiBA,CAAa,EAAE,aAAa,aAFhC,IAI5B,CAACA,CAAa,CAAC,GAEZU,IAAeD,EAAQ,MAAM;AACjC,UAAME,IAAoBZ,EAAU;AAE7B,WAAA;AAAA,MACL,OAAO;AAAA;AAAA,MACP,qBACEa,EAAuBD,EAAkB,QAAQ,KAChDA,EAAkB,uBAAuB;AAAA;AAAA,MAC5C,QAAQJ,IAAuB;AAAA,MAC/B,GAAGI;AAAA,MACH,aAAc,gBAAAE,EAAAC,GAAA,EAAiB,YAAkB,aAAY;AAAA,MAC7D,eAAe;AAAA,MACf,UAAU;AAAA;AAAA,MACV,aAAa;AAAA,MACb,YAAY;AAAA,MACZ,aAAa;AAAA,MACb,MAAMC,EAAc;AAAA,MACpB,YAAY;AAAA,IAAA;AAAA,EAEb,GAAA,CAACR,GAAsBR,EAAU,SAAS,CAAC,GAExCiB,IAAaP,EAAQ,MAAM;AAC/B,UAAMQ,IAAqBlB,EAAU;AAE9B,WAAA;AAAA,MACL,GAAGkB;AAAA,MACH,eAAef,KAAQe,EAAM,iBAAiB;AAAA,MAC9C,eAAehB,KAAOgB,EAAM,iBAAiB;AAAA,IAAA;AAAA,KAE9C,CAAClB,EAAU,WAAWG,GAAMD,CAAG,CAAC;AAEnC,SAAI,CAACD,KAAiB,CAACD,EAAU,WACxB,OAGLA,EAAU,SAASgB,EAAc,UAC/BP,MAGG,gBAAAU,EAAAC,GAAA,EAAA,UAAA;AAAA,IAAUpB,EAAA;AAAA,IACX,gBAAAc,EAACO,GAAA,EAAuB,WAAU,YAAW,MAAMnB,GAAK,OAAOC,GAC7D,UAAA,gBAAAW,EAACQ,KAAc,GAAGX,GAChB,4BAAC,OAAI,EAAA,OAAO,EAAE,QAAAP,GAAQ,OAAAC,EAAA,GAAS,EAAA,CACjC,EACF,CAAA;AAAA,EACF,EAAA,CAAA,sBAKDgB,GAAA,EAAuB,WAAU,YAAW,MAAMnB,GAAK,OAAOC,GAC7D,4BAACmB,GAAc,EAAA,GAAGX,GAAe,UAAAX,EAAU,oBAAmB,EAChE,CAAA,IAIAA,EAAU,SAASgB,EAAc,QAG/B,gBAAAG,EAAAC,GAAA,EAAA,UAAA;AAAA,IAAA,gBAAAN;AAAA,MAACO;AAAAA,MAAA;AAAA,QACC,MAAMZ,MAAe,IAAIP;AAAA,QACzB,OAAOO,MAAe,IAAIN;AAAA,QAC1B,WAAWM,MAAe,aAAa;AAAA,QAEtC,UAAUT,EAAA;AAAA,MAAA;AAAA,IACb;AAAA,sBACCuB,GAAM,EAAA,QAAQf,IAAuB,GAAI,GAAGS,GAAY;AAAA,EAC3D,EAAA,CAAA,IAIG;AACT;"}
|
|
@@ -1,7 +1,5 @@
|
|
|
1
|
-
var
|
|
2
|
-
const o = 1e3;
|
|
1
|
+
var t = /* @__PURE__ */ ((r) => (r.TOOLTIP = "tooltip", r.NUDGE = "nudge", r))(t || {});
|
|
3
2
|
export {
|
|
4
|
-
|
|
5
|
-
e as IndicatorType
|
|
3
|
+
t as IndicatorType
|
|
6
4
|
};
|
|
7
5
|
//# sourceMappingURL=constants.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"constants.js","sources":["../../../../src/features/journey/use-journey/constants.ts"],"sourcesContent":["export enum IndicatorType {\n TOOLTIP = 'tooltip',\n NUDGE = 'nudge',\n}\
|
|
1
|
+
{"version":3,"file":"constants.js","sources":["../../../../src/features/journey/use-journey/constants.ts"],"sourcesContent":["export enum IndicatorType {\n TOOLTIP = 'tooltip',\n NUDGE = 'nudge',\n}\n"],"names":["IndicatorType"],"mappings":"AAAY,IAAAA,sBAAAA,OACVA,EAAA,UAAU,WACVA,EAAA,QAAQ,SAFEA,IAAAA,KAAA,CAAA,CAAA;"}
|
|
@@ -1,14 +1,13 @@
|
|
|
1
1
|
import o from "styled-components";
|
|
2
|
-
|
|
3
|
-
const e = o.div`
|
|
2
|
+
const i = o.div`
|
|
4
3
|
position: fixed;
|
|
5
4
|
top: 0;
|
|
6
5
|
right: 0;
|
|
7
6
|
bottom: 0;
|
|
8
7
|
left: 0;
|
|
9
|
-
z-index: ${t};
|
|
8
|
+
z-index: ${({ theme: t }) => t.zIndex.JOURNEY_OVERLAY};
|
|
10
9
|
`;
|
|
11
10
|
export {
|
|
12
|
-
|
|
11
|
+
i as Overlay
|
|
13
12
|
};
|
|
14
13
|
//# sourceMappingURL=journey-styled.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"journey-styled.js","sources":["../../../../src/features/journey/use-journey/journey-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\
|
|
1
|
+
{"version":3,"file":"journey-styled.js","sources":["../../../../src/features/journey/use-journey/journey-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const Overlay = styled.div`\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: ${({ theme }) => theme.zIndex.JOURNEY_OVERLAY};\n`;\n"],"names":["Overlay","styled","theme"],"mappings":";AAEO,MAAMA,IAAUC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAMjB,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,eAAe;AAAA;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"z-index.js","sources":["../../../../src/features/ui/constants/z-index.ts"],"sourcesContent":["const ZINDEX = {\n CHAPTER_CROWN_ICON: 4,\n CHAPTER_PLUS_ICON: 2,\n CHAPTER_PROGRESS_SVG: 1,\n LPAR_SHEET_ITEM_BOTTOM_DASH_BOX: 1,\n LPAR_SHEET_ITEM_TOP_VERTICAL_ICON: 2,\n MODAL: 20,\n SAT_SUMMARY_SCORE: 25, //* SAT_SUMMARY_SCORE > MODAL\n CANVAS_SCRIBBLING: 26, //* CANVAS_SCRIBBLING > Learnosity\n TILE_CONTAINER: 30, //whiteboard\n QUESTION_TIPS: -1,\n DESMOS_CALCULATOR: 2,\n GOAL_CHAPTER_SHEETS_MENU: 4,\n} as const;\n\nexport { ZINDEX };\n"],"names":["ZINDEX"],"mappings":"AAAA,MAAMA,IAAS;AAAA,EACb,oBAAoB;AAAA,EACpB,mBAAmB;AAAA,EACnB,sBAAsB;AAAA,EACtB,iCAAiC;AAAA,EACjC,mCAAmC;AAAA,EACnC,OAAO;AAAA,EACP,mBAAmB;AAAA;AAAA,EACnB,mBAAmB;AAAA;AAAA,EACnB,gBAAgB;AAAA;AAAA,EAChB,eAAe;AAAA,EACf,mBAAmB;AAAA,EACnB,0BAA0B;
|
|
1
|
+
{"version":3,"file":"z-index.js","sources":["../../../../src/features/ui/constants/z-index.ts"],"sourcesContent":["const ZINDEX = {\n CHAPTER_CROWN_ICON: 4,\n CHAPTER_PLUS_ICON: 2,\n CHAPTER_PROGRESS_SVG: 1,\n LPAR_SHEET_ITEM_BOTTOM_DASH_BOX: 1,\n LPAR_SHEET_ITEM_TOP_VERTICAL_ICON: 2,\n MODAL: 20,\n SAT_SUMMARY_SCORE: 25, //* SAT_SUMMARY_SCORE > MODAL\n CANVAS_SCRIBBLING: 26, //* CANVAS_SCRIBBLING > Learnosity\n TILE_CONTAINER: 30, //whiteboard\n QUESTION_TIPS: -1,\n DESMOS_CALCULATOR: 2,\n GOAL_CHAPTER_SHEETS_MENU: 4,\n JOURNEY_OVERLAY: 1000,\n} as const;\n\nexport { ZINDEX };\n"],"names":["ZINDEX"],"mappings":"AAAA,MAAMA,IAAS;AAAA,EACb,oBAAoB;AAAA,EACpB,mBAAmB;AAAA,EACnB,sBAAsB;AAAA,EACtB,iCAAiC;AAAA,EACjC,mCAAmC;AAAA,EACnC,OAAO;AAAA,EACP,mBAAmB;AAAA;AAAA,EACnB,mBAAmB;AAAA;AAAA,EACnB,gBAAgB;AAAA;AAAA,EAChB,eAAe;AAAA,EACf,mBAAmB;AAAA,EACnB,0BAA0B;AAAA,EAC1B,iBAAiB;AACnB;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"breakpoints.js","sources":["../../../../src/features/ui/theme/breakpoints.ts"],"sourcesContent":["export const getBreakpointsConfig = () => {\n return {\n MOBILE: 600,\n };\n};\n"],"names":["getBreakpointsConfig"],"mappings":"AAAO,MAAMA,IAAuB,OAC3B;AAAA,EACL,QAAQ;AAAA;"}
|
|
@@ -1,30 +1,32 @@
|
|
|
1
1
|
import r from "./arrow-tooltip.js";
|
|
2
|
-
import e from "./
|
|
2
|
+
import { getBreakpointsConfig as e } from "./breakpoints.js";
|
|
3
|
+
import i from "./button.js";
|
|
3
4
|
import m from "./checkbox.js";
|
|
4
|
-
import g, { hues as
|
|
5
|
-
import
|
|
6
|
-
import
|
|
7
|
-
import
|
|
8
|
-
import
|
|
9
|
-
import
|
|
10
|
-
import { getZIndexConfig as
|
|
11
|
-
const
|
|
12
|
-
const t =
|
|
5
|
+
import g, { hues as n } from "./clrs.js";
|
|
6
|
+
import f from "./input.js";
|
|
7
|
+
import p from "./layout.js";
|
|
8
|
+
import u from "./tab.js";
|
|
9
|
+
import C from "./text.js";
|
|
10
|
+
import s from "./text-button.js";
|
|
11
|
+
import { getZIndexConfig as x } from "./z-index.js";
|
|
12
|
+
const w = () => {
|
|
13
|
+
const t = p(), { gutter: o } = t;
|
|
13
14
|
return {
|
|
14
15
|
arrowTooltip: r(),
|
|
15
|
-
button:
|
|
16
|
+
button: i(o),
|
|
16
17
|
colors: g(),
|
|
17
|
-
hues:
|
|
18
|
-
input:
|
|
18
|
+
hues: n,
|
|
19
|
+
input: f(o),
|
|
19
20
|
checkbox: m(o),
|
|
20
21
|
layout: t,
|
|
21
|
-
tab:
|
|
22
|
-
text:
|
|
23
|
-
textButton:
|
|
24
|
-
zIndex:
|
|
22
|
+
tab: u(t.gutter),
|
|
23
|
+
text: C(),
|
|
24
|
+
textButton: s(),
|
|
25
|
+
zIndex: x(),
|
|
26
|
+
breakpoints: e()
|
|
25
27
|
};
|
|
26
28
|
};
|
|
27
29
|
export {
|
|
28
|
-
|
|
30
|
+
w as getTheme
|
|
29
31
|
};
|
|
30
32
|
//# sourceMappingURL=get-theme.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"get-theme.js","sources":["../../../../src/features/ui/theme/get-theme.ts"],"sourcesContent":["import type { DefaultTheme } from 'styled-components';\n\nimport getArrowTooltipConfig from './arrow-tooltip';\nimport getButtonConfig from './button';\nimport getCheckboxConfig from './checkbox';\nimport getColors, { hues } from './clrs';\nimport getInputConfig from './input';\nimport getLayout from './layout';\nimport getTabConfig from './tab';\nimport getTextTypes from './text';\nimport getTextButtonConfig from './text-button';\nimport { getZIndexConfig } from './z-index';\n\nconst getTheme: () => DefaultTheme = () => {\n const layout = getLayout();\n const { gutter } = layout;\n\n return {\n arrowTooltip: getArrowTooltipConfig(),\n button: getButtonConfig(gutter),\n colors: getColors(),\n hues: hues,\n input: getInputConfig(gutter),\n checkbox: getCheckboxConfig(gutter),\n layout,\n tab: getTabConfig(layout.gutter),\n text: getTextTypes(),\n textButton: getTextButtonConfig(),\n zIndex: getZIndexConfig(),\n };\n};\n\nexport { getTheme };\n"],"names":["getTheme","layout","getLayout","gutter","getArrowTooltipConfig","getButtonConfig","getColors","hues","getInputConfig","getCheckboxConfig","getTabConfig","getTextTypes","getTextButtonConfig","getZIndexConfig"],"mappings":"
|
|
1
|
+
{"version":3,"file":"get-theme.js","sources":["../../../../src/features/ui/theme/get-theme.ts"],"sourcesContent":["import type { DefaultTheme } from 'styled-components';\n\nimport getArrowTooltipConfig from './arrow-tooltip';\nimport { getBreakpointsConfig } from './breakpoints';\nimport getButtonConfig from './button';\nimport getCheckboxConfig from './checkbox';\nimport getColors, { hues } from './clrs';\nimport getInputConfig from './input';\nimport getLayout from './layout';\nimport getTabConfig from './tab';\nimport getTextTypes from './text';\nimport getTextButtonConfig from './text-button';\nimport { getZIndexConfig } from './z-index';\n\nconst getTheme: () => DefaultTheme = () => {\n const layout = getLayout();\n const { gutter } = layout;\n\n return {\n arrowTooltip: getArrowTooltipConfig(),\n button: getButtonConfig(gutter),\n colors: getColors(),\n hues: hues,\n input: getInputConfig(gutter),\n checkbox: getCheckboxConfig(gutter),\n layout,\n tab: getTabConfig(layout.gutter),\n text: getTextTypes(),\n textButton: getTextButtonConfig(),\n zIndex: getZIndexConfig(),\n breakpoints: getBreakpointsConfig(),\n };\n};\n\nexport { getTheme };\n"],"names":["getTheme","layout","getLayout","gutter","getArrowTooltipConfig","getButtonConfig","getColors","hues","getInputConfig","getCheckboxConfig","getTabConfig","getTextTypes","getTextButtonConfig","getZIndexConfig","getBreakpointsConfig"],"mappings":";;;;;;;;;;;AAcA,MAAMA,IAA+B,MAAM;AACzC,QAAMC,IAASC,KACT,EAAE,QAAAC,EAAW,IAAAF;AAEZ,SAAA;AAAA,IACL,cAAcG,EAAsB;AAAA,IACpC,QAAQC,EAAgBF,CAAM;AAAA,IAC9B,QAAQG,EAAU;AAAA,IAClB,MAAAC;AAAA,IACA,OAAOC,EAAeL,CAAM;AAAA,IAC5B,UAAUM,EAAkBN,CAAM;AAAA,IAClC,QAAAF;AAAA,IACA,KAAKS,EAAaT,EAAO,MAAM;AAAA,IAC/B,MAAMU,EAAa;AAAA,IACnB,YAAYC,EAAoB;AAAA,IAChC,QAAQC,EAAgB;AAAA,IACxB,aAAaC,EAAqB;AAAA,EAAA;AAEtC;"}
|
package/dist/index.d.ts
CHANGED
|
@@ -425,6 +425,10 @@ declare enum GENDER {
|
|
|
425
425
|
|
|
426
426
|
declare const getArrowTooltipConfig: IGetArrowTooltipConfig;
|
|
427
427
|
|
|
428
|
+
declare const getBreakpointsConfig: () => {
|
|
429
|
+
MOBILE: number;
|
|
430
|
+
};
|
|
431
|
+
|
|
428
432
|
declare const getButtonConfig: IGetButtonConfig;
|
|
429
433
|
|
|
430
434
|
declare const getCheckboxConfig: IGetCheckboxConfig;
|
|
@@ -2872,6 +2876,7 @@ export declare interface ITheme {
|
|
|
2872
2876
|
textButton: ReturnType<typeof getTextButtonConfig>;
|
|
2873
2877
|
zIndex: ReturnType<typeof getZIndexConfig>;
|
|
2874
2878
|
checkbox: ReturnType<typeof getCheckboxConfig>;
|
|
2879
|
+
breakpoints: ReturnType<typeof getBreakpointsConfig>;
|
|
2875
2880
|
}
|
|
2876
2881
|
|
|
2877
2882
|
declare interface ITile {
|
|
@@ -2993,6 +2998,7 @@ export declare interface ITutorialProps {
|
|
|
2993
2998
|
onCross?: () => void;
|
|
2994
2999
|
showProgress?: boolean;
|
|
2995
3000
|
onTutorialPlayedOnce?: () => void;
|
|
3001
|
+
isJourneyActive?: boolean;
|
|
2996
3002
|
}
|
|
2997
3003
|
|
|
2998
3004
|
export declare interface ITutorialRef {
|
|
@@ -4972,11 +4978,6 @@ export declare const UpIcon: React.FC<React.SVGProps<SVGSVGElement>>;
|
|
|
4972
4978
|
|
|
4973
4979
|
export declare const useAutoPlayPermission: () => IAutoPlayPermissionContextType;
|
|
4974
4980
|
|
|
4975
|
-
export declare const useBreakpoint: () => {
|
|
4976
|
-
isMobile: boolean;
|
|
4977
|
-
width: number;
|
|
4978
|
-
};
|
|
4979
|
-
|
|
4980
4981
|
export declare const useCanvasSyncBroker: (channelId: string, logEvent: (type: string, payload?: Record<string, unknown>) => void, initialCanvasData?: Array<IChannelMessage>) => {
|
|
4981
4982
|
publishStrokes: ((message: unknown) => boolean) | undefined;
|
|
4982
4983
|
channelStatus: ChannelStatus | undefined;
|
|
@@ -5182,6 +5183,7 @@ declare const ZINDEX: {
|
|
|
5182
5183
|
readonly QUESTION_TIPS: -1;
|
|
5183
5184
|
readonly DESMOS_CALCULATOR: 2;
|
|
5184
5185
|
readonly GOAL_CHAPTER_SHEETS_MENU: 4;
|
|
5186
|
+
readonly JOURNEY_OVERLAY: 1000;
|
|
5185
5187
|
};
|
|
5186
5188
|
|
|
5187
5189
|
export { }
|