@cuemath/leap 3.2.11-j2 → 3.2.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (119) hide show
  1. package/dist/assets/illustrations/illustrations.js +0 -5
  2. package/dist/assets/illustrations/illustrations.js.map +1 -1
  3. package/dist/assets/lottie/lottie.js +1 -11
  4. package/dist/assets/lottie/lottie.js.map +1 -1
  5. package/dist/features/auth/comps/auth-page-layout/auth-page-layout.js +13 -18
  6. package/dist/features/auth/comps/auth-page-layout/auth-page-layout.js.map +1 -1
  7. package/dist/features/auth/comps/resend-otp/resend-otp.js +47 -54
  8. package/dist/features/auth/comps/resend-otp/resend-otp.js.map +1 -1
  9. package/dist/features/auth/comps/tabs/tab-tem/tab-item.js +17 -29
  10. package/dist/features/auth/comps/tabs/tab-tem/tab-item.js.map +1 -1
  11. package/dist/features/auth/comps/tabs/tabs-styled.js +10 -22
  12. package/dist/features/auth/comps/tabs/tabs-styled.js.map +1 -1
  13. package/dist/features/auth/comps/tabs/tabs.js +5 -5
  14. package/dist/features/auth/comps/tabs/tabs.js.map +1 -1
  15. package/dist/features/journey/comps/coachmark/coachmark.js +29 -28
  16. package/dist/features/journey/comps/coachmark/coachmark.js.map +1 -1
  17. package/dist/features/journey/journey-id/journey-id-student.js +2 -2
  18. package/dist/features/journey/journey-id/journey-id-student.js.map +1 -1
  19. package/dist/features/journey/use-journey/journey-context-provider.js +73 -72
  20. package/dist/features/journey/use-journey/journey-context-provider.js.map +1 -1
  21. package/dist/features/journey/use-journey/journey-styled.js +6 -4
  22. package/dist/features/journey/use-journey/journey-styled.js.map +1 -1
  23. package/dist/features/ui/arrow-tooltip/arrow-tooltip-constants.js +6 -0
  24. package/dist/features/ui/arrow-tooltip/arrow-tooltip-constants.js.map +1 -0
  25. package/dist/features/ui/arrow-tooltip/arrow-tooltip-styled.js +12 -60
  26. package/dist/features/ui/arrow-tooltip/arrow-tooltip-styled.js.map +1 -1
  27. package/dist/features/ui/arrow-tooltip/arrow-tooltip.js +72 -77
  28. package/dist/features/ui/arrow-tooltip/arrow-tooltip.js.map +1 -1
  29. package/dist/features/ui/arrow-tooltip/comps/tooltip-body-styled.js +63 -0
  30. package/dist/features/ui/arrow-tooltip/comps/tooltip-body-styled.js.map +1 -0
  31. package/dist/features/ui/arrow-tooltip/comps/tooltip-body.js +21 -0
  32. package/dist/features/ui/arrow-tooltip/comps/tooltip-body.js.map +1 -0
  33. package/dist/features/ui/image/image.js +1 -1
  34. package/dist/features/ui/image/image.js.map +1 -1
  35. package/dist/features/ui/nudge/nudge-styled.js +14 -7
  36. package/dist/features/ui/nudge/nudge-styled.js.map +1 -1
  37. package/dist/features/ui/nudge/nudge.js +13 -12
  38. package/dist/features/ui/nudge/nudge.js.map +1 -1
  39. package/dist/features/ui/theme/button.js +78 -78
  40. package/dist/features/ui/theme/button.js.map +1 -1
  41. package/dist/index.d.ts +8 -110
  42. package/dist/index.js +436 -458
  43. package/dist/index.js.map +1 -1
  44. package/dist/node_modules/query-string/base.js +1 -1
  45. package/dist/node_modules/query-string/node_modules/decode-uri-component/index.js.map +1 -0
  46. package/dist/node_modules/uuid/dist/esm-browser/regex.js +5 -0
  47. package/dist/node_modules/uuid/dist/esm-browser/regex.js.map +1 -0
  48. package/dist/node_modules/uuid/dist/esm-browser/rng.js +2 -3
  49. package/dist/node_modules/uuid/dist/esm-browser/rng.js.map +1 -1
  50. package/dist/node_modules/uuid/dist/esm-browser/stringify.js +10 -6
  51. package/dist/node_modules/uuid/dist/esm-browser/stringify.js.map +1 -1
  52. package/dist/node_modules/uuid/dist/esm-browser/v4.js +9 -12
  53. package/dist/node_modules/uuid/dist/esm-browser/v4.js.map +1 -1
  54. package/dist/node_modules/uuid/dist/esm-browser/validate.js +8 -0
  55. package/dist/node_modules/uuid/dist/esm-browser/validate.js.map +1 -0
  56. package/dist/static/nudge-tap.0591aef4.json +1 -0
  57. package/package.json +1 -1
  58. package/dist/assets/line-icons/icons/after-noon.js +0 -34
  59. package/dist/assets/line-icons/icons/after-noon.js.map +0 -1
  60. package/dist/assets/line-icons/icons/apple-icon-white.js +0 -42
  61. package/dist/assets/line-icons/icons/apple-icon-white.js.map +0 -1
  62. package/dist/assets/line-icons/icons/evening.js +0 -35
  63. package/dist/assets/line-icons/icons/evening.js.map +0 -1
  64. package/dist/assets/line-icons/icons/morning.js +0 -35
  65. package/dist/assets/line-icons/icons/morning.js.map +0 -1
  66. package/dist/features/auth/comps/animated-avatar-message/animated-avatar-message-constants.js +0 -9
  67. package/dist/features/auth/comps/animated-avatar-message/animated-avatar-message-constants.js.map +0 -1
  68. package/dist/features/auth/comps/animated-avatar-message/animated-avatar-message-styled.js +0 -65
  69. package/dist/features/auth/comps/animated-avatar-message/animated-avatar-message-styled.js.map +0 -1
  70. package/dist/features/auth/comps/animated-avatar-message/animated-avatar-message.js +0 -92
  71. package/dist/features/auth/comps/animated-avatar-message/animated-avatar-message.js.map +0 -1
  72. package/dist/features/auth/comps/linear-progress-bar/linear-progress-bar-styled.js +0 -12
  73. package/dist/features/auth/comps/linear-progress-bar/linear-progress-bar-styled.js.map +0 -1
  74. package/dist/features/auth/comps/linear-progress-bar/linear-progress-bar.js +0 -34
  75. package/dist/features/auth/comps/linear-progress-bar/linear-progress-bar.js.map +0 -1
  76. package/dist/features/auth/comps/otp-input/otp-input-styled.js +0 -22
  77. package/dist/features/auth/comps/otp-input/otp-input-styled.js.map +0 -1
  78. package/dist/features/auth/comps/otp-input/otp-input.js +0 -51
  79. package/dist/features/auth/comps/otp-input/otp-input.js.map +0 -1
  80. package/dist/features/auth/comps/pill-button/pill-button-styled.js +0 -44
  81. package/dist/features/auth/comps/pill-button/pill-button-styled.js.map +0 -1
  82. package/dist/features/auth/comps/pill-button/pill-button.js +0 -75
  83. package/dist/features/auth/comps/pill-button/pill-button.js.map +0 -1
  84. package/dist/features/auth/comps/selectable-info-card/selectable-info-card-styled.js +0 -17
  85. package/dist/features/auth/comps/selectable-info-card/selectable-info-card-styled.js.map +0 -1
  86. package/dist/features/auth/comps/selectable-info-card/selectable-info-card.js +0 -67
  87. package/dist/features/auth/comps/selectable-info-card/selectable-info-card.js.map +0 -1
  88. package/dist/features/auth/signup-v2/onboarding-guide/onboarding-guide-constants.js +0 -19
  89. package/dist/features/auth/signup-v2/onboarding-guide/onboarding-guide-constants.js.map +0 -1
  90. package/dist/features/auth/signup-v2/onboarding-guide/onboarding-guide-styled.js +0 -32
  91. package/dist/features/auth/signup-v2/onboarding-guide/onboarding-guide-styled.js.map +0 -1
  92. package/dist/features/auth/signup-v2/onboarding-guide/onboarding-guide.js +0 -44
  93. package/dist/features/auth/signup-v2/onboarding-guide/onboarding-guide.js.map +0 -1
  94. package/dist/features/auth/signup-v2/signup-header/signup-header.js +0 -54
  95. package/dist/features/auth/signup-v2/signup-header/signup-header.js.map +0 -1
  96. package/dist/features/auth/signup-v2/signup-options/signup-options.js +0 -83
  97. package/dist/features/auth/signup-v2/signup-options/signup-options.js.map +0 -1
  98. package/dist/node_modules/decode-uri-component/index.js.map +0 -1
  99. package/dist/node_modules/uuid/dist/esm-browser/native.js +0 -7
  100. package/dist/node_modules/uuid/dist/esm-browser/native.js.map +0 -1
  101. package/dist/static/animated-avatar.1ad58b1d.json +0 -1
  102. package/dist/static/animated-avatar.69b07505.json +0 -1
  103. package/dist/static/animated-avatar.9c560b46.json +0 -1
  104. package/dist/static/calendar-purple.1a840b41.svg +0 -1
  105. package/dist/static/flying-disk.c7f6ed39.json +0 -1
  106. package/dist/static/graduation-cap.3be3340a.json +0 -1
  107. package/dist/static/handshake.287e7dfb.svg +0 -1
  108. package/dist/static/light-bulb.c6db0b23.json +0 -1
  109. package/dist/static/money.332aacf1.svg +0 -1
  110. package/dist/static/muscle.9bcfb8a7.json +0 -1
  111. package/dist/static/nudge-tap.5cb30093.json +0 -1057
  112. package/dist/static/parent-avatar.822c7b9b.svg +0 -1
  113. package/dist/static/pencil.23df9da0.json +0 -1
  114. package/dist/static/plus-sign.de6af957.json +0 -1
  115. package/dist/static/racing-car.2cbf864e.json +0 -1
  116. package/dist/static/rocket.0a3ccab0.json +0 -1
  117. package/dist/static/shovel.abeec04c.json +0 -1
  118. package/dist/static/trustpilot.bd3d79e1.svg +0 -1
  119. /package/dist/node_modules/{decode-uri-component → query-string/node_modules/decode-uri-component}/index.js +0 -0
@@ -1,18 +1,19 @@
1
1
  import { jsx as i, jsxs as g, Fragment as m } from "react/jsx-runtime";
2
2
  import L from "../../../../node_modules/lodash.throttle/index.js";
3
- import { useState as O, useEffect as $, useMemo as p } from "react";
4
- import { useTheme as R } from "styled-components";
3
+ import { useState as a, useEffect as O, useMemo as p } from "react";
4
+ import { useTheme as $ } from "styled-components";
5
5
  import c from "../../../ui/arrow-tooltip/arrow-tooltip.js";
6
- import a from "../../../ui/nudge/nudge.js";
7
- import { EDeviceType as A } from "../../../ui/theme/constants.js";
6
+ import R from "../../../ui/nudge/nudge.js";
7
+ import A from "../../../ui/portal/portal.js";
8
+ import { EDeviceType as X } from "../../../ui/theme/constants.js";
8
9
  import { IndicatorType as u } from "../../use-journey/constants.js";
9
- import { CoachmarkBody as X, ClonedElementWrapper as h } from "./coachmark-styled.js";
10
- import { getTooltipXCoordinates as Y } from "./coachmark-utils.js";
11
- const V = ({
10
+ import { CoachmarkBody as Y, ClonedElementWrapper as h } from "./coachmark-styled.js";
11
+ import { getTooltipXCoordinates as x } from "./coachmark-utils.js";
12
+ const S = ({
12
13
  coachmark: e,
13
14
  isInsideScrollView: T
14
15
  }) => {
15
- const t = e.originalElementToHighlightRef.current, { device: C, zIndex: I } = R(), [v, E] = O(() => {
16
+ const t = e.originalElementToHighlightRef.current, { device: C, zIndex: I } = $(), [P, v] = a(() => {
16
17
  const o = t == null ? void 0 : t.getBoundingClientRect();
17
18
  return {
18
19
  top: ((o == null ? void 0 : o.top) ?? 0) + window.scrollY,
@@ -20,32 +21,32 @@ const V = ({
20
21
  width: (o == null ? void 0 : o.width) ?? 0,
21
22
  height: (o == null ? void 0 : o.height) ?? 0
22
23
  };
23
- }), n = L(() => {
24
+ }), r = L(() => {
24
25
  const o = t == null ? void 0 : t.getBoundingClientRect();
25
- o && E({
26
+ o && v({
26
27
  top: o.top + window.scrollY,
27
28
  left: o.left + window.scrollX,
28
29
  width: o.width,
29
30
  height: o.height
30
31
  });
31
32
  }, 100), {
32
- top: r = 0,
33
+ top: n = 0,
33
34
  left: l = 0,
34
- height: P = 0,
35
+ height: E = 0,
35
36
  width: b = 0
36
- } = T ? v : (t == null ? void 0 : t.getBoundingClientRect()) ?? {};
37
- $(() => (window.addEventListener("resize", n), window.addEventListener("scroll", n), () => {
38
- window.removeEventListener("resize", n), window.removeEventListener("scroll", n);
39
- }), [n, t]);
40
- const w = C === A.MOBILE, d = I.JOURNEY_OVERLAY, s = p(() => t ? window.getComputedStyle(t).position === "absolute" : !1, [t]), f = p(() => {
37
+ } = T ? P : (t == null ? void 0 : t.getBoundingClientRect()) ?? {};
38
+ O(() => (window.addEventListener("resize", r), window.addEventListener("scroll", r), () => {
39
+ window.removeEventListener("resize", r), window.removeEventListener("scroll", r);
40
+ }), [r, t]);
41
+ const f = C === X.MOBILE, d = I.JOURNEY_OVERLAY, s = p(() => t ? window.getComputedStyle(t).position === "absolute" : !1, [t]), w = p(() => {
41
42
  const o = e.indicator;
42
43
  return {
43
- width: w ? 246 : 264,
44
+ width: f ? 246 : 264,
44
45
  // Can be over ridden
45
- tooltipXCoOrdinates: Y(o),
46
+ tooltipXCoOrdinates: x(o),
46
47
  zIndex: d + 1,
47
48
  ...o,
48
- tooltipItem: /* @__PURE__ */ i(X, { children: o.tooltipItem }),
49
+ tooltipItem: /* @__PURE__ */ i(Y, { children: o.tooltipItem }),
49
50
  alwaysVisible: !0,
50
51
  renderAs: "primary",
51
52
  // Deprecate this
@@ -55,31 +56,31 @@ const V = ({
55
56
  type: u.TOOLTIP,
56
57
  isAnimated: !0
57
58
  };
58
- }, [d, e.indicator, w]), y = p(() => {
59
+ }, [d, e.indicator, f]), y = p(() => {
59
60
  const o = e.indicator;
60
61
  return {
61
62
  ...o,
62
63
  nudgePointerX: l + (o.nudgePointerX ?? 0),
63
- nudgePointerY: r + (o.nudgePointerY ?? 0)
64
+ nudgePointerY: n + (o.nudgePointerY ?? 0)
64
65
  };
65
- }, [e.indicator, l, r]);
66
+ }, [e.indicator, l, n]);
66
67
  return !t || !e.isActive ? null : e.type === u.TOOLTIP ? s ? /* @__PURE__ */ g(m, { children: [
67
68
  e.elementToHighlight,
68
- /* @__PURE__ */ i(h, { $position: "absolute", $top: r, $left: l, children: /* @__PURE__ */ i(c, { ...f, children: /* @__PURE__ */ i("div", { style: { height: P, width: b } }) }) })
69
- ] }) : /* @__PURE__ */ i(h, { $position: "absolute", $top: r, $left: l, children: /* @__PURE__ */ i(c, { ...f, children: e.elementToHighlight }) }) : e.type === u.NUDGE ? /* @__PURE__ */ g(m, { children: [
69
+ /* @__PURE__ */ i(h, { $position: "absolute", $top: n, $left: l, children: /* @__PURE__ */ i(c, { ...w, children: /* @__PURE__ */ i("div", { style: { height: E, width: b } }) }) })
70
+ ] }) : /* @__PURE__ */ i(h, { $position: "absolute", $top: n, $left: l, children: /* @__PURE__ */ i(c, { ...w, children: e.elementToHighlight }) }) : e.type === u.NUDGE ? /* @__PURE__ */ g(m, { children: [
70
71
  /* @__PURE__ */ i(
71
72
  h,
72
73
  {
73
- $top: s ? 0 : r,
74
+ $top: s ? 0 : n,
74
75
  $left: s ? 0 : l,
75
76
  $position: s ? "relative" : "absolute",
76
77
  children: e.elementToHighlight
77
78
  }
78
79
  ),
79
- /* @__PURE__ */ i(a, { zIndex: d + 1, ...y })
80
+ /* @__PURE__ */ i(A, { portalId: "tooltip-root", children: /* @__PURE__ */ i(R, { zIndex: d + 1, ...y }) })
80
81
  ] }) : null;
81
82
  };
82
83
  export {
83
- V as Coachmark
84
+ S as Coachmark
84
85
  };
85
86
  //# 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 throttle from 'lodash.throttle';\nimport React, { useEffect, useMemo, useState } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport ArrowTooltip from '../../../ui/arrow-tooltip/arrow-tooltip';\nimport Nudge from '../../../ui/nudge/nudge';\nimport { EDeviceType } from '../../../ui/theme/constants';\nimport { IndicatorType } from '../../use-journey/constants';\nimport * as S from './coachmark-styled';\nimport { getTooltipXCoordinates } from './coachmark-utils';\n\nexport const Coachmark: React.FC<{ coachmark: ICoachmarkProps; isInsideScrollView: boolean }> = ({\n coachmark,\n isInsideScrollView,\n}) => {\n const targetElement = coachmark.originalElementToHighlightRef.current;\n const { device, zIndex } = useTheme();\n\n const [position, setPosition] = useState(() => {\n const rect = targetElement?.getBoundingClientRect();\n\n return {\n top: (rect?.top ?? 0) + window.scrollY,\n left: rect?.left ?? 0 + window.scrollX,\n width: rect?.width ?? 0,\n height: rect?.height ?? 0,\n };\n });\n\n const handlePositionChange = throttle(() => {\n const rect = targetElement?.getBoundingClientRect();\n\n if (rect) {\n setPosition({\n top: rect.top + window.scrollY,\n left: rect.left + window.scrollX,\n width: rect.width,\n height: rect.height,\n });\n }\n }, 100);\n\n const {\n top = 0,\n left = 0,\n height = 0,\n width = 0,\n } = isInsideScrollView ? position : targetElement?.getBoundingClientRect() ?? {};\n\n useEffect(() => {\n window.addEventListener('resize', handlePositionChange);\n window.addEventListener('scroll', handlePositionChange);\n\n return () => {\n window.removeEventListener('resize', handlePositionChange);\n window.removeEventListener('scroll', handlePositionChange);\n };\n }, [handlePositionChange, targetElement]);\n\n const isMobile = device === EDeviceType.MOBILE;\n\n const BLUR_OVERLAY_Z_INDEX = zIndex.JOURNEY_OVERLAY;\n\n const isAbsolute = useMemo(() => {\n if (!targetElement) return false;\n\n return window.getComputedStyle(targetElement).position === 'absolute';\n }, [targetElement]);\n\n const tooltipProps = useMemo(() => {\n const arrowToolTipProps = coachmark.indicator as IArrowTooltipProps;\n\n return {\n width: isMobile ? 246 : 264, // Can be over ridden\n tooltipXCoOrdinates: getTooltipXCoordinates(arrowToolTipProps),\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: arrowToolTipProps.arrowColor || 'WHITE',\n borderColor: arrowToolTipProps.borderColor || 'WHITE',\n type: IndicatorType.TOOLTIP,\n isAnimated: true,\n } as IArrowTooltipProps;\n }, [BLUR_OVERLAY_Z_INDEX, coachmark.indicator, isMobile]);\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","isInsideScrollView","targetElement","device","zIndex","useTheme","position","setPosition","useState","rect","handlePositionChange","throttle","top","left","height","width","useEffect","isMobile","EDeviceType","BLUR_OVERLAY_Z_INDEX","isAbsolute","useMemo","tooltipProps","arrowToolTipProps","getTooltipXCoordinates","jsx","S.CoachmarkBody","IndicatorType","nudgeProps","props","jsxs","Fragment","S.ClonedElementWrapper","ArrowTooltip","Nudge"],"mappings":"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"}
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 throttle from 'lodash.throttle';\nimport React, { useEffect, useMemo, useState } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport ArrowTooltip from '../../../ui/arrow-tooltip/arrow-tooltip';\nimport Nudge from '../../../ui/nudge/nudge';\nimport Portal from '../../../ui/portal/portal';\nimport { EDeviceType } from '../../../ui/theme/constants';\nimport { IndicatorType } from '../../use-journey/constants';\nimport * as S from './coachmark-styled';\nimport { getTooltipXCoordinates } from './coachmark-utils';\n\nexport const Coachmark: React.FC<{ coachmark: ICoachmarkProps; isInsideScrollView: boolean }> = ({\n coachmark,\n isInsideScrollView,\n}) => {\n const targetElement = coachmark.originalElementToHighlightRef.current;\n const { device, zIndex } = useTheme();\n\n const [position, setPosition] = useState(() => {\n const rect = targetElement?.getBoundingClientRect();\n\n return {\n top: (rect?.top ?? 0) + window.scrollY,\n left: rect?.left ?? 0 + window.scrollX,\n width: rect?.width ?? 0,\n height: rect?.height ?? 0,\n };\n });\n\n const handlePositionChange = throttle(() => {\n const rect = targetElement?.getBoundingClientRect();\n\n if (rect) {\n setPosition({\n top: rect.top + window.scrollY,\n left: rect.left + window.scrollX,\n width: rect.width,\n height: rect.height,\n });\n }\n }, 100);\n\n const {\n top = 0,\n left = 0,\n height = 0,\n width = 0,\n } = isInsideScrollView ? position : targetElement?.getBoundingClientRect() ?? {};\n\n useEffect(() => {\n window.addEventListener('resize', handlePositionChange);\n window.addEventListener('scroll', handlePositionChange);\n\n return () => {\n window.removeEventListener('resize', handlePositionChange);\n window.removeEventListener('scroll', handlePositionChange);\n };\n }, [handlePositionChange, targetElement]);\n\n const isMobile = device === EDeviceType.MOBILE;\n\n const BLUR_OVERLAY_Z_INDEX = zIndex.JOURNEY_OVERLAY;\n\n const isAbsolute = useMemo(() => {\n if (!targetElement) return false;\n\n return window.getComputedStyle(targetElement).position === 'absolute';\n }, [targetElement]);\n\n const tooltipProps = useMemo(() => {\n const arrowToolTipProps = coachmark.indicator as IArrowTooltipProps;\n\n return {\n width: isMobile ? 246 : 264, // Can be over ridden\n tooltipXCoOrdinates: getTooltipXCoordinates(arrowToolTipProps),\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: arrowToolTipProps.arrowColor || 'WHITE',\n borderColor: arrowToolTipProps.borderColor || 'WHITE',\n type: IndicatorType.TOOLTIP,\n isAnimated: true,\n } as IArrowTooltipProps;\n }, [BLUR_OVERLAY_Z_INDEX, coachmark.indicator, isMobile]);\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 <Portal portalId=\"tooltip-root\">\n <Nudge zIndex={BLUR_OVERLAY_Z_INDEX + 1} {...nudgeProps} />\n </Portal>\n </>\n );\n }\n\n return null;\n};\n"],"names":["Coachmark","coachmark","isInsideScrollView","targetElement","device","zIndex","useTheme","position","setPosition","useState","rect","handlePositionChange","throttle","top","left","height","width","useEffect","isMobile","EDeviceType","BLUR_OVERLAY_Z_INDEX","isAbsolute","useMemo","tooltipProps","arrowToolTipProps","getTooltipXCoordinates","jsx","S.CoachmarkBody","IndicatorType","nudgeProps","props","jsxs","Fragment","S.ClonedElementWrapper","ArrowTooltip","Portal","Nudge"],"mappings":";;;;;;;;;;;AAgBO,MAAMA,IAAmF,CAAC;AAAA,EAC/F,WAAAC;AAAA,EACA,oBAAAC;AACF,MAAM;AACE,QAAAC,IAAgBF,EAAU,8BAA8B,SACxD,EAAE,QAAAG,GAAQ,QAAAC,EAAO,IAAIC,EAAS,GAE9B,CAACC,GAAUC,CAAW,IAAIC,EAAS,MAAM;AACvC,UAAAC,IAAOP,KAAA,gBAAAA,EAAe;AAErB,WAAA;AAAA,MACL,OAAMO,KAAA,gBAAAA,EAAM,QAAO,KAAK,OAAO;AAAA,MAC/B,OAAMA,KAAA,gBAAAA,EAAM,SAAQ,IAAI,OAAO;AAAA,MAC/B,QAAOA,KAAA,gBAAAA,EAAM,UAAS;AAAA,MACtB,SAAQA,KAAA,gBAAAA,EAAM,WAAU;AAAA,IAAA;AAAA,EAC1B,CACD,GAEKC,IAAuBC,EAAS,MAAM;AACpC,UAAAF,IAAOP,KAAA,gBAAAA,EAAe;AAE5B,IAAIO,KACUF,EAAA;AAAA,MACV,KAAKE,EAAK,MAAM,OAAO;AAAA,MACvB,MAAMA,EAAK,OAAO,OAAO;AAAA,MACzB,OAAOA,EAAK;AAAA,MACZ,QAAQA,EAAK;AAAA,IAAA,CACd;AAAA,KAEF,GAAG,GAEA;AAAA,IACJ,KAAAG,IAAM;AAAA,IACN,MAAAC,IAAO;AAAA,IACP,QAAAC,IAAS;AAAA,IACT,OAAAC,IAAQ;AAAA,MACNd,IAAqBK,KAAWJ,KAAA,gBAAAA,EAAe,4BAA2B,CAAA;AAE9E,EAAAc,EAAU,OACD,OAAA,iBAAiB,UAAUN,CAAoB,GAC/C,OAAA,iBAAiB,UAAUA,CAAoB,GAE/C,MAAM;AACJ,WAAA,oBAAoB,UAAUA,CAAoB,GAClD,OAAA,oBAAoB,UAAUA,CAAoB;AAAA,EAAA,IAE1D,CAACA,GAAsBR,CAAa,CAAC;AAElC,QAAAe,IAAWd,MAAWe,EAAY,QAElCC,IAAuBf,EAAO,iBAE9BgB,IAAaC,EAAQ,MACpBnB,IAEE,OAAO,iBAAiBA,CAAa,EAAE,aAAa,aAFhC,IAG1B,CAACA,CAAa,CAAC,GAEZoB,IAAeD,EAAQ,MAAM;AACjC,UAAME,IAAoBvB,EAAU;AAE7B,WAAA;AAAA,MACL,OAAOiB,IAAW,MAAM;AAAA;AAAA,MACxB,qBAAqBO,EAAuBD,CAAiB;AAAA,MAC7D,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,YAAYH,EAAkB,cAAc;AAAA,MAC5C,aAAaA,EAAkB,eAAe;AAAA,MAC9C,MAAMI,EAAc;AAAA,MACpB,YAAY;AAAA,IAAA;AAAA,KAEb,CAACR,GAAsBnB,EAAU,WAAWiB,CAAQ,CAAC,GAElDW,IAAaP,EAAQ,MAAM;AAC/B,UAAMQ,IAAqB7B,EAAU;AAE9B,WAAA;AAAA,MACL,GAAG6B;AAAA,MACH,eAAehB,KAAQgB,EAAM,iBAAiB;AAAA,MAC9C,eAAejB,KAAOiB,EAAM,iBAAiB;AAAA,IAAA;AAAA,KAE9C,CAAC7B,EAAU,WAAWa,GAAMD,CAAG,CAAC;AAEnC,SAAI,CAACV,KAAiB,CAACF,EAAU,WACxB,OAGLA,EAAU,SAAS2B,EAAc,UAC/BP,IAGG,gBAAAU,EAAAC,GAAA,EAAA,UAAA;AAAA,IAAU/B,EAAA;AAAA,IACX,gBAAAyB,EAACO,GAAA,EAAuB,WAAU,YAAW,MAAMpB,GAAK,OAAOC,GAC7D,UAAA,gBAAAY,EAACQ,KAAc,GAAGX,GAChB,4BAAC,OAAI,EAAA,OAAO,EAAE,QAAAR,GAAQ,OAAAC,EAAA,GAAS,EAAA,CACjC,EACF,CAAA;AAAA,EACF,EAAA,CAAA,sBAKDiB,GAAA,EAAuB,WAAU,YAAW,MAAMpB,GAAK,OAAOC,GAC7D,4BAACoB,GAAc,EAAA,GAAGX,GAAe,UAAAtB,EAAU,oBAAmB,EAChE,CAAA,IAIAA,EAAU,SAAS2B,EAAc,QAG/B,gBAAAG,EAAAC,GAAA,EAAA,UAAA;AAAA,IAAA,gBAAAN;AAAA,MAACO;AAAAA,MAAA;AAAA,QACC,MAAMZ,IAAa,IAAIR;AAAA,QACvB,OAAOQ,IAAa,IAAIP;AAAA,QACxB,WAAWO,IAAa,aAAa;AAAA,QAEpC,UAAUpB,EAAA;AAAA,MAAA;AAAA,IACb;AAAA,IACA,gBAAAyB,EAACS,GAAO,EAAA,UAAS,gBACf,UAAA,gBAAAT,EAACU,GAAM,EAAA,QAAQhB,IAAuB,GAAI,GAAGS,EAAA,CAAY,EAC3D,CAAA;AAAA,EACF,EAAA,CAAA,IAIG;AACT;"}
@@ -1,5 +1,5 @@
1
- var E = /* @__PURE__ */ ((R) => (R.CIRCLE_ACTIVITIES_INTRO_JOURNEY = "CIRCLE_ACTIVITIES_INTRO_JOURNEY", R.CIRCLE_LEADERBOARD_INTRO_JOURNEY = "CIRCLE_LEADERBOARD_INTRO_JOURNEY", R.CIRCLE_POINTS_REWARD_JOURNEY = "CIRCLE_POINTS_REWARD_JOURNEY", R.CIRCLE_STREAK_UPDATE_JOURNEY = "CIRCLE_STREAK_UPDATE_JOURNEY", R.CIRCLE_TUTORIAL_JOURNEY = "CIRCLE_TUTORIAL_JOURNEY", R.CIRCLE_TABLES_INTRO_JOURNEY = "CIRCLE_TABLES_INTRO_JOURNEY", R.CIRCLE_TABLES_INFINTE_JOURNEY = "CIRCLE_TABLES_INFINITE_JOURNEY", R.CIRCLE_LESSONS_K_1_INTRO_JOURNEY = "CIRCLE_LESSONS_K_1_INTRO_JOURNEY", R.CIRCLE_STREAK_REDUCTION_JOURNEY = "CIRCLE_STREAK_REDUCTION_JOURNEY", R.HOMEPAGE_JOURNEY = "HOMEPAGE_JOURNEY", R.CHAPTER_PAGE_JOURNEY = "CHAPTER_PAGE_JOURNEY", R.CHALLENGE_ARENA_JOURNEY = "CHALLENGE_ARENA_JOURNEY", R))(E || {});
1
+ var R = /* @__PURE__ */ ((E) => (E.CIRCLE_ACTIVITIES_INTRO_JOURNEY = "CIRCLE_ACTIVITIES_INTRO_JOURNEY", E.CIRCLE_LEADERBOARD_INTRO_JOURNEY = "CIRCLE_LEADERBOARD_INTRO_JOURNEY", E.CIRCLE_POINTS_REWARD_JOURNEY = "CIRCLE_POINTS_REWARD_JOURNEY", E.CIRCLE_STREAK_UPDATE_JOURNEY = "CIRCLE_STREAK_UPDATE_JOURNEY", E.CIRCLE_TUTORIAL_JOURNEY = "CIRCLE_TUTORIAL_JOURNEY", E.CIRCLE_TABLES_INTRO_JOURNEY = "CIRCLE_TABLES_INTRO_JOURNEY", E.CIRCLE_TABLES_INFINTE_JOURNEY = "CIRCLE_TABLES_INFINITE_JOURNEY", E.CIRCLE_LESSONS_K_1_INTRO_JOURNEY = "CIRCLE_LESSONS_K_1_INTRO_JOURNEY", E.HOMEPAGE_JOURNEY = "HOMEPAGE_JOURNEY", E.CHAPTER_PAGE_JOURNEY = "CHAPTER_PAGE_JOURNEY", E.CHALLENGE_ARENA_JOURNEY = "CHALLENGE_ARENA_JOURNEY", E))(R || {});
2
2
  export {
3
- E as JOURNEY_ID_STUDENT
3
+ R as JOURNEY_ID_STUDENT
4
4
  };
5
5
  //# sourceMappingURL=journey-id-student.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"journey-id-student.js","sources":["../../../../src/features/journey/journey-id/journey-id-student.ts"],"sourcesContent":["export enum JOURNEY_ID_STUDENT {\n CIRCLE_ACTIVITIES_INTRO_JOURNEY = 'CIRCLE_ACTIVITIES_INTRO_JOURNEY',\n CIRCLE_LEADERBOARD_INTRO_JOURNEY = 'CIRCLE_LEADERBOARD_INTRO_JOURNEY',\n CIRCLE_POINTS_REWARD_JOURNEY = 'CIRCLE_POINTS_REWARD_JOURNEY',\n CIRCLE_STREAK_UPDATE_JOURNEY = 'CIRCLE_STREAK_UPDATE_JOURNEY',\n CIRCLE_TUTORIAL_JOURNEY = 'CIRCLE_TUTORIAL_JOURNEY',\n CIRCLE_TABLES_INTRO_JOURNEY = 'CIRCLE_TABLES_INTRO_JOURNEY',\n CIRCLE_TABLES_INFINTE_JOURNEY = 'CIRCLE_TABLES_INFINITE_JOURNEY',\n CIRCLE_LESSONS_K_1_INTRO_JOURNEY = 'CIRCLE_LESSONS_K_1_INTRO_JOURNEY',\n\n // TODO: Deprecate bottom journeys, they are not actually journeys\n CIRCLE_STREAK_REDUCTION_JOURNEY = 'CIRCLE_STREAK_REDUCTION_JOURNEY',\n HOMEPAGE_JOURNEY = 'HOMEPAGE_JOURNEY',\n CHAPTER_PAGE_JOURNEY = 'CHAPTER_PAGE_JOURNEY',\n CHALLENGE_ARENA_JOURNEY = 'CHALLENGE_ARENA_JOURNEY',\n}\n"],"names":["JOURNEY_ID_STUDENT"],"mappings":"AAAY,IAAAA,sBAAAA,OACVA,EAAA,kCAAkC,mCAClCA,EAAA,mCAAmC,oCACnCA,EAAA,+BAA+B,gCAC/BA,EAAA,+BAA+B,gCAC/BA,EAAA,0BAA0B,2BAC1BA,EAAA,8BAA8B,+BAC9BA,EAAA,gCAAgC,kCAChCA,EAAA,mCAAmC,oCAGnCA,EAAA,kCAAkC,mCAClCA,EAAA,mBAAmB,oBACnBA,EAAA,uBAAuB,wBACvBA,EAAA,0BAA0B,2BAdhBA,IAAAA,KAAA,CAAA,CAAA;"}
1
+ {"version":3,"file":"journey-id-student.js","sources":["../../../../src/features/journey/journey-id/journey-id-student.ts"],"sourcesContent":["export enum JOURNEY_ID_STUDENT {\n CIRCLE_ACTIVITIES_INTRO_JOURNEY = 'CIRCLE_ACTIVITIES_INTRO_JOURNEY',\n CIRCLE_LEADERBOARD_INTRO_JOURNEY = 'CIRCLE_LEADERBOARD_INTRO_JOURNEY',\n CIRCLE_POINTS_REWARD_JOURNEY = 'CIRCLE_POINTS_REWARD_JOURNEY',\n CIRCLE_STREAK_UPDATE_JOURNEY = 'CIRCLE_STREAK_UPDATE_JOURNEY',\n CIRCLE_TUTORIAL_JOURNEY = 'CIRCLE_TUTORIAL_JOURNEY',\n CIRCLE_TABLES_INTRO_JOURNEY = 'CIRCLE_TABLES_INTRO_JOURNEY',\n CIRCLE_TABLES_INFINTE_JOURNEY = 'CIRCLE_TABLES_INFINITE_JOURNEY',\n CIRCLE_LESSONS_K_1_INTRO_JOURNEY = 'CIRCLE_LESSONS_K_1_INTRO_JOURNEY',\n\n // TODO: Deprecate bottom journeys, they are not actually journeys\n HOMEPAGE_JOURNEY = 'HOMEPAGE_JOURNEY',\n CHAPTER_PAGE_JOURNEY = 'CHAPTER_PAGE_JOURNEY',\n CHALLENGE_ARENA_JOURNEY = 'CHALLENGE_ARENA_JOURNEY',\n}\n"],"names":["JOURNEY_ID_STUDENT"],"mappings":"AAAY,IAAAA,sBAAAA,OACVA,EAAA,kCAAkC,mCAClCA,EAAA,mCAAmC,oCACnCA,EAAA,+BAA+B,gCAC/BA,EAAA,+BAA+B,gCAC/BA,EAAA,0BAA0B,2BAC1BA,EAAA,8BAA8B,+BAC9BA,EAAA,gCAAgC,kCAChCA,EAAA,mCAAmC,oCAGnCA,EAAA,mBAAmB,oBACnBA,EAAA,uBAAuB,wBACvBA,EAAA,0BAA0B,2BAbhBA,IAAAA,KAAA,CAAA,CAAA;"}
@@ -1,55 +1,55 @@
1
- import { jsxs as L, jsx as O } from "react/jsx-runtime";
2
- import { createContext as N, useState as c, useRef as v, useCallback as h, useMemo as R, useEffect as T } from "react";
3
- import { Coachmark as W } from "../comps/coachmark/coachmark.js";
4
- import { usePostUserJourney as M, useGetUserJourney as V } from "../user-journey-api/user-journey-api.js";
5
- import { Overlay as G } from "./journey-styled.js";
6
- const F = N(null), I = ({ children: b, appId: i, userId: u }) => {
7
- const [U, q] = c(!1), [k, p] = c(null), [a, l] = c([]), [f, x] = c(!1), m = v(-1), t = v(void 0), w = v([]), [z, B] = c(!1), [A, D] = c({
1
+ import { jsxs as R, jsx as j } from "react/jsx-runtime";
2
+ import { createContext as W, useState as s, useRef as k, useCallback as h, useMemo as M, useEffect as O } from "react";
3
+ import { Coachmark as V } from "../comps/coachmark/coachmark.js";
4
+ import { usePostUserJourney as G, useGetUserJourney as F } from "../user-journey-api/user-journey-api.js";
5
+ import { Overlay as I } from "./journey-styled.js";
6
+ const K = W(null), re = ({ children: T, appId: a, userId: c }) => {
7
+ const [b, U] = s(!0), [q, z] = s(!1), [v, p] = s(null), [l, y] = s([]), [J, x] = s(!1), m = k(-1), t = k(void 0), f = k([]), [D, H] = s(!1), [A, L] = s({
8
8
  height: window.innerHeight,
9
9
  width: window.innerWidth
10
- }), { post: _ } = M(), { data: C = null, get: $ } = V(), E = h(
11
- (e, r, o) => {
12
- var J, y;
13
- if (a.length > 0) {
10
+ }), { post: $ } = G(), { data: w = null, get: _ } = F(), B = h(
11
+ (e, r, o, C = !0) => {
12
+ var d, n;
13
+ if (l.length > 0) {
14
14
  console.error(
15
15
  `setJourney: Other Journey is already active, Current Journey: ${t.current}, New Journey Request: ${e}`
16
16
  );
17
17
  return;
18
18
  }
19
- x(!0), t.current = e, m.current = -1, l(
20
- r.map((n) => ({
21
- ...n,
19
+ x(!0), U(C), t.current = e, m.current = -1, y(
20
+ r.map((u) => ({
21
+ ...u,
22
22
  isActive: !1
23
23
  // New coachmarks are inactive by default
24
24
  }))
25
- ), o && (D({
26
- height: ((J = o.current) == null ? void 0 : J.clientHeight) || window.innerHeight,
27
- width: ((y = o.current) == null ? void 0 : y.clientWidth) || window.innerWidth
28
- }), B(!0));
25
+ ), o && (L({
26
+ height: ((d = o.current) == null ? void 0 : d.clientHeight) || window.innerHeight,
27
+ width: ((n = o.current) == null ? void 0 : n.clientWidth) || window.innerWidth
28
+ }), H(!0));
29
29
  },
30
- [a.length]
31
- ), s = h(() => {
32
- w.current.forEach((e) => {
30
+ [l.length]
31
+ ), i = h(() => {
32
+ f.current.forEach((e) => {
33
33
  clearTimeout(e);
34
- }), w.current = [], t.current = void 0, m.current = -1, l([]), x(!1);
35
- }, []), P = h(
34
+ }), f.current = [], t.current = void 0, m.current = -1, y([]), x(!1);
35
+ }, []), E = h(
36
36
  (e) => {
37
- s(), p((r) => r && !r.includes(e) ? [...r, e] : r), _({
38
- app_id: i,
39
- user_id: u,
37
+ i(), p((r) => r && !r.includes(e) ? [...r, e] : r), $({
38
+ app_id: a,
39
+ user_id: c,
40
40
  journey_id: e,
41
41
  journey_status: "COMPLETED"
42
42
  });
43
43
  },
44
- [i, s, _, u]
45
- ), S = h((e, r) => {
44
+ [a, i, $, c]
45
+ ), P = h((e, r) => {
46
46
  if (!t.current || e !== t.current) {
47
47
  console.error(
48
48
  t.current ? `A Journey is already active, Current Journey: ${t.current}, New Journey Request: ${e}` : "addCoachmark was called before setJourney and Journey ID is undefined"
49
49
  );
50
50
  return;
51
51
  }
52
- l((o) => [
52
+ y((o) => [
53
53
  ...o,
54
54
  {
55
55
  ...r,
@@ -57,86 +57,87 @@ const F = N(null), I = ({ children: b, appId: i, userId: u }) => {
57
57
  // New coachmarks are inactive by default
58
58
  }
59
59
  ]);
60
- }, []), j = h(
61
- (e, r = !1, o = 0, J = !1) => {
60
+ }, []), S = h(
61
+ (e, r = !1, o = 0, C = !1) => {
62
62
  if (!t.current || e !== t.current) {
63
63
  console.error(
64
64
  t.current ? "nextCoachmark was called before setJourney" : `A Journey is already active, Current Journey: ${t.current}, New Journey Request: ${e}`
65
65
  );
66
66
  return;
67
67
  }
68
- q(J), o !== 0 && l((n) => n.map((d) => ({ ...d, isActive: !1 })));
69
- const y = setTimeout(() => {
70
- clearTimeout(y);
68
+ z(C), o !== 0 && y((n) => n.map((u) => ({ ...u, isActive: !1 })));
69
+ const d = setTimeout(() => {
70
+ clearTimeout(d);
71
71
  const n = m.current + 1;
72
- l((d) => {
73
- if (n >= d.length || d.length === 0)
74
- return s(), [];
72
+ y((u) => {
73
+ if (n >= u.length || u.length === 0)
74
+ return i(), [];
75
75
  m.current = n;
76
- const g = [...d];
76
+ const g = [...u];
77
77
  return g[n].isActive = !0, n > 0 && (g[n - 1].isActive = r), g;
78
78
  });
79
79
  }, o);
80
- w.current.push(y);
80
+ f.current.push(d);
81
81
  },
82
- [s]
83
- ), H = R(
82
+ [i]
83
+ ), N = M(
84
84
  () => ({
85
- nextCoachmark: j,
86
- setJourney: E,
87
- addCoachmark: S,
88
- clearJourney: s,
89
- endJourney: P,
90
- coachmarks: a,
91
- userCompletedJourneyIds: k,
92
- isJourneyActive: f
85
+ nextCoachmark: S,
86
+ setJourney: B,
87
+ addCoachmark: P,
88
+ clearJourney: i,
89
+ endJourney: E,
90
+ coachmarks: l,
91
+ userCompletedJourneyIds: v,
92
+ isJourneyActive: J
93
93
  }),
94
94
  [
95
- j,
96
- E,
97
95
  S,
98
- s,
96
+ B,
99
97
  P,
100
- a,
101
- k,
102
- f
98
+ i,
99
+ E,
100
+ l,
101
+ v,
102
+ J
103
103
  ]
104
104
  );
105
- return T(() => {
106
- i && u && $(u, {
107
- app_id: i,
108
- user_id: u,
105
+ return O(() => {
106
+ a && c && _(c, {
107
+ app_id: a,
108
+ user_id: c,
109
109
  journey_status: "COMPLETED"
110
110
  });
111
- }, [i, $, u]), T(() => {
112
- if (C) {
113
- const e = C.map((r) => r.journey_id);
111
+ }, [a, _, c]), O(() => {
112
+ if (w) {
113
+ const e = w.map((r) => r.journey_id);
114
114
  p(e);
115
115
  }
116
- }, [C]), /* @__PURE__ */ L(F.Provider, { value: H, children: [
117
- f && /* @__PURE__ */ O(
118
- G,
116
+ }, [w]), /* @__PURE__ */ R(K.Provider, { value: N, children: [
117
+ J && /* @__PURE__ */ j(
118
+ I,
119
119
  {
120
120
  about: "journey-overlay",
121
121
  height: A.height,
122
122
  width: A.width,
123
- $isJourneyBlurred: U,
123
+ $isJourneyBlurred: q,
124
+ $isBlockingJourney: b,
124
125
  "data-testid": t.current,
125
- children: a.map((e, r) => /* @__PURE__ */ O(
126
- W,
126
+ children: l.map((e, r) => /* @__PURE__ */ j(
127
+ V,
127
128
  {
128
129
  coachmark: e,
129
- isInsideScrollView: z
130
+ isInsideScrollView: D
130
131
  },
131
132
  `coachmark-${r}`
132
133
  ))
133
134
  }
134
135
  ),
135
- b
136
+ T
136
137
  ] });
137
138
  };
138
139
  export {
139
- F as JourneyContext,
140
- I as JourneyProvider
140
+ K as JourneyContext,
141
+ re as JourneyProvider
141
142
  };
142
143
  //# sourceMappingURL=journey-context-provider.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"journey-context-provider.js","sources":["../../../../src/features/journey/use-journey/journey-context-provider.tsx"],"sourcesContent":["/* eslint-disable no-console */\nimport type { TJourneyId } from '../journey-id/journey-id-types';\nimport type {\n ICoachmarkProps,\n IJourneyContext,\n IJourneyProviderProps,\n TCoachmarkJourneyProps,\n} from './journey-context-types';\nimport type { FC, RefObject } from 'react';\n\nimport { createContext, useCallback, useEffect, useMemo, useRef, useState } from 'react';\n\nimport { Coachmark } from '../comps/coachmark/coachmark';\nimport { useGetUserJourney, usePostUserJourney } from '../user-journey-api/user-journey-api';\nimport * as S from './journey-styled';\n\nexport const JourneyContext = createContext<IJourneyContext | null>(null);\n\nexport const JourneyProvider: FC<IJourneyProviderProps> = ({ children, appId, userId }) => {\n const [isJourneyBlurred, setIsJourneyBlurred] = useState<boolean>(false);\n const [userCompletedJourneyIds, setUserCompletedJourneyIds] = useState<TJourneyId[] | null>(null);\n const [coachmarkList, setCoachmarkList] = useState<ICoachmarkProps[]>([]);\n const [isJourneyActive, setIsJourneyActive] = useState(false);\n const currentIndex = useRef(-1);\n const currentJourneyId = useRef<TJourneyId | undefined>(undefined);\n const timerRefs = useRef<ReturnType<typeof setTimeout>[]>([]);\n\n const [isScrollableJourney, setIsScrollableJourney] = useState<boolean>(false);\n const [overlaySize, setOverlaySize] = useState({\n height: window.innerHeight,\n width: window.innerWidth,\n });\n\n const { post: postJourneyCompletion } = usePostUserJourney();\n const { data: userCompletedJourneys = null, get: getJourneyProgress } = useGetUserJourney();\n\n const setJourney = useCallback(\n (\n id: TJourneyId,\n coachmarks: TCoachmarkJourneyProps[],\n scrollableContRef?: RefObject<HTMLDivElement | null>,\n ) => {\n if (coachmarkList.length > 0) {\n console.error(\n `setJourney: Other Journey is already active, Current Journey: ${currentJourneyId.current}, New Journey Request: ${id}`,\n );\n\n return;\n }\n setIsJourneyActive(true);\n currentJourneyId.current = id;\n currentIndex.current = -1;\n setCoachmarkList(\n coachmarks.map((item: TCoachmarkJourneyProps) => {\n return {\n ...item,\n isActive: false, // New coachmarks are inactive by default\n } as ICoachmarkProps;\n }),\n );\n if (scrollableContRef) {\n setOverlaySize({\n height: scrollableContRef.current?.clientHeight || window.innerHeight,\n width: scrollableContRef.current?.clientWidth || window.innerWidth,\n });\n setIsScrollableJourney(true);\n }\n },\n [coachmarkList.length],\n );\n\n const clearJourney = useCallback(() => {\n // Clear all timers\n timerRefs.current.forEach(timer => {\n clearTimeout(timer);\n });\n timerRefs.current = [];\n currentJourneyId.current = undefined;\n currentIndex.current = -1;\n setCoachmarkList([]);\n setIsJourneyActive(false);\n }, []);\n\n const endJourney = useCallback(\n (journeyId: TJourneyId) => {\n clearJourney();\n setUserCompletedJourneyIds(prev => {\n if (prev && !prev.includes(journeyId)) {\n return [...prev, journeyId];\n }\n\n return prev;\n });\n // fire the API (doesn’t block the UI)\n postJourneyCompletion({\n app_id: appId,\n user_id: userId,\n journey_id: journeyId,\n journey_status: 'COMPLETED',\n });\n },\n [appId, clearJourney, postJourneyCompletion, userId],\n );\n\n const addCoachmark = useCallback((id: TJourneyId, coachmark: TCoachmarkJourneyProps) => {\n if (!currentJourneyId.current || id !== currentJourneyId.current) {\n console.error(\n currentJourneyId.current\n ? `A Journey is already active, Current Journey: ${currentJourneyId.current}, New Journey Request: ${id}`\n : `addCoachmark was called before setJourney and Journey ID is undefined`,\n );\n\n return;\n }\n\n setCoachmarkList(prev => [\n ...prev,\n {\n ...coachmark,\n isActive: false, // New coachmarks are inactive by default\n } as ICoachmarkProps,\n ]);\n }, []);\n\n const nextCoachmark = useCallback(\n (\n id: TJourneyId,\n keepPrevActive: boolean = false,\n delayInMs: number = 0,\n shouldBlurNextJourney: boolean = false,\n ) => {\n if (!currentJourneyId.current || id !== currentJourneyId.current) {\n console.error(\n currentJourneyId.current\n ? `nextCoachmark was called before setJourney`\n : `A Journey is already active, Current Journey: ${currentJourneyId.current}, New Journey Request: ${id}`,\n );\n\n return;\n }\n\n setIsJourneyBlurred(shouldBlurNextJourney);\n\n if (delayInMs !== 0) {\n // If delay is not 0, we will hide all them coachmarks and reveal only after the delay\n setCoachmarkList(prevList => {\n return prevList.map((item: TCoachmarkJourneyProps) => {\n return { ...item, isActive: false };\n });\n });\n }\n\n const timer = setTimeout(() => {\n clearTimeout(timer);\n const currIndex = currentIndex.current + 1;\n\n setCoachmarkList(prevList => {\n // Finish onboarding\n if (currIndex >= prevList.length || prevList.length === 0) {\n clearJourney();\n\n return [];\n }\n\n currentIndex.current = currIndex;\n const updatedCoachmarkList = [...prevList];\n\n (updatedCoachmarkList[currIndex] as ICoachmarkProps).isActive = true;\n\n if (currIndex > 0) {\n (updatedCoachmarkList[currIndex - 1] as ICoachmarkProps).isActive = keepPrevActive;\n }\n\n return updatedCoachmarkList;\n });\n }, delayInMs);\n\n timerRefs.current.push(timer);\n },\n [clearJourney],\n );\n\n const memoizedContextValue: IJourneyContext = useMemo(\n () => ({\n nextCoachmark,\n setJourney,\n addCoachmark,\n clearJourney,\n endJourney,\n coachmarks: coachmarkList,\n userCompletedJourneyIds,\n isJourneyActive,\n }),\n [\n nextCoachmark,\n setJourney,\n addCoachmark,\n clearJourney,\n endJourney,\n coachmarkList,\n userCompletedJourneyIds,\n isJourneyActive,\n ],\n );\n\n // Get the initial state of incompleteJourneys\n useEffect(() => {\n if (appId && userId) {\n getJourneyProgress(userId, {\n app_id: appId,\n user_id: userId,\n journey_status: 'COMPLETED',\n });\n }\n }, [appId, getJourneyProgress, userId]);\n\n // Set the data to context state initially\n useEffect(() => {\n if (userCompletedJourneys) {\n const completedUserJourneysIds = userCompletedJourneys.map(journey => journey.journey_id);\n\n setUserCompletedJourneyIds(completedUserJourneysIds);\n }\n }, [userCompletedJourneys]);\n\n return (\n <JourneyContext.Provider value={memoizedContextValue}>\n {isJourneyActive && (\n <S.Overlay\n about=\"journey-overlay\"\n height={overlaySize.height}\n width={overlaySize.width}\n $isJourneyBlurred={isJourneyBlurred}\n data-testid={currentJourneyId.current}\n >\n {coachmarkList.map((coachmark, index) => (\n <Coachmark\n key={`coachmark-${index}`}\n coachmark={coachmark}\n isInsideScrollView={isScrollableJourney}\n />\n ))}\n </S.Overlay>\n )}\n {children}\n </JourneyContext.Provider>\n );\n};\n"],"names":["JourneyContext","createContext","JourneyProvider","children","appId","userId","isJourneyBlurred","setIsJourneyBlurred","useState","userCompletedJourneyIds","setUserCompletedJourneyIds","coachmarkList","setCoachmarkList","isJourneyActive","setIsJourneyActive","currentIndex","useRef","currentJourneyId","timerRefs","isScrollableJourney","setIsScrollableJourney","overlaySize","setOverlaySize","postJourneyCompletion","usePostUserJourney","userCompletedJourneys","getJourneyProgress","useGetUserJourney","setJourney","useCallback","id","coachmarks","scrollableContRef","item","_a","_b","clearJourney","timer","endJourney","journeyId","prev","addCoachmark","coachmark","nextCoachmark","keepPrevActive","delayInMs","shouldBlurNextJourney","prevList","currIndex","updatedCoachmarkList","memoizedContextValue","useMemo","useEffect","completedUserJourneysIds","journey","jsxs","jsx","S.Overlay","index","Coachmark"],"mappings":"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"}
1
+ {"version":3,"file":"journey-context-provider.js","sources":["../../../../src/features/journey/use-journey/journey-context-provider.tsx"],"sourcesContent":["/* eslint-disable no-console */\nimport type { TJourneyId } from '../journey-id/journey-id-types';\nimport type {\n ICoachmarkProps,\n IJourneyContext,\n IJourneyProviderProps,\n TCoachmarkJourneyProps,\n} from './journey-context-types';\nimport type { FC, RefObject } from 'react';\n\nimport { createContext, useCallback, useEffect, useMemo, useRef, useState } from 'react';\n\nimport { Coachmark } from '../comps/coachmark/coachmark';\nimport { useGetUserJourney, usePostUserJourney } from '../user-journey-api/user-journey-api';\nimport * as S from './journey-styled';\n\nexport const JourneyContext = createContext<IJourneyContext | null>(null);\n\nexport const JourneyProvider: FC<IJourneyProviderProps> = ({ children, appId, userId }) => {\n const [isBlockingJourney, setIsBlockingJourney] = useState<boolean>(true);\n const [isJourneyBlurred, setIsJourneyBlurred] = useState<boolean>(false);\n const [userCompletedJourneyIds, setUserCompletedJourneyIds] = useState<TJourneyId[] | null>(null);\n const [coachmarkList, setCoachmarkList] = useState<ICoachmarkProps[]>([]);\n const [isJourneyActive, setIsJourneyActive] = useState(false);\n const currentIndex = useRef(-1);\n const currentJourneyId = useRef<TJourneyId | undefined>(undefined);\n const timerRefs = useRef<ReturnType<typeof setTimeout>[]>([]);\n\n const [isScrollableJourney, setIsScrollableJourney] = useState<boolean>(false);\n const [overlaySize, setOverlaySize] = useState({\n height: window.innerHeight,\n width: window.innerWidth,\n });\n\n const { post: postJourneyCompletion } = usePostUserJourney();\n const { data: userCompletedJourneys = null, get: getJourneyProgress } = useGetUserJourney();\n\n const setJourney = useCallback(\n (\n id: TJourneyId,\n coachmarks: TCoachmarkJourneyProps[],\n scrollableContRef?: RefObject<HTMLDivElement | null>,\n isBlocking: boolean = true,\n ) => {\n if (coachmarkList.length > 0) {\n console.error(\n `setJourney: Other Journey is already active, Current Journey: ${currentJourneyId.current}, New Journey Request: ${id}`,\n );\n\n return;\n }\n setIsJourneyActive(true);\n setIsBlockingJourney(isBlocking);\n currentJourneyId.current = id;\n currentIndex.current = -1;\n setCoachmarkList(\n coachmarks.map((item: TCoachmarkJourneyProps) => {\n return {\n ...item,\n isActive: false, // New coachmarks are inactive by default\n } as ICoachmarkProps;\n }),\n );\n if (scrollableContRef) {\n setOverlaySize({\n height: scrollableContRef.current?.clientHeight || window.innerHeight,\n width: scrollableContRef.current?.clientWidth || window.innerWidth,\n });\n setIsScrollableJourney(true);\n }\n },\n [coachmarkList.length],\n );\n\n const clearJourney = useCallback(() => {\n // Clear all timers\n timerRefs.current.forEach(timer => {\n clearTimeout(timer);\n });\n timerRefs.current = [];\n currentJourneyId.current = undefined;\n currentIndex.current = -1;\n setCoachmarkList([]);\n setIsJourneyActive(false);\n }, []);\n\n const endJourney = useCallback(\n (journeyId: TJourneyId) => {\n clearJourney();\n setUserCompletedJourneyIds(prev => {\n if (prev && !prev.includes(journeyId)) {\n return [...prev, journeyId];\n }\n\n return prev;\n });\n // fire the API (doesn’t block the UI)\n postJourneyCompletion({\n app_id: appId,\n user_id: userId,\n journey_id: journeyId,\n journey_status: 'COMPLETED',\n });\n },\n [appId, clearJourney, postJourneyCompletion, userId],\n );\n\n const addCoachmark = useCallback((id: TJourneyId, coachmark: TCoachmarkJourneyProps) => {\n if (!currentJourneyId.current || id !== currentJourneyId.current) {\n console.error(\n currentJourneyId.current\n ? `A Journey is already active, Current Journey: ${currentJourneyId.current}, New Journey Request: ${id}`\n : `addCoachmark was called before setJourney and Journey ID is undefined`,\n );\n\n return;\n }\n\n setCoachmarkList(prev => [\n ...prev,\n {\n ...coachmark,\n isActive: false, // New coachmarks are inactive by default\n } as ICoachmarkProps,\n ]);\n }, []);\n\n const nextCoachmark = useCallback(\n (\n id: TJourneyId,\n keepPrevActive: boolean = false,\n delayInMs: number = 0,\n shouldBlurNextJourney: boolean = false,\n ) => {\n if (!currentJourneyId.current || id !== currentJourneyId.current) {\n console.error(\n currentJourneyId.current\n ? `nextCoachmark was called before setJourney`\n : `A Journey is already active, Current Journey: ${currentJourneyId.current}, New Journey Request: ${id}`,\n );\n\n return;\n }\n\n setIsJourneyBlurred(shouldBlurNextJourney);\n\n if (delayInMs !== 0) {\n // If delay is not 0, we will hide all them coachmarks and reveal only after the delay\n setCoachmarkList(prevList => {\n return prevList.map((item: TCoachmarkJourneyProps) => {\n return { ...item, isActive: false };\n });\n });\n }\n\n const timer = setTimeout(() => {\n clearTimeout(timer);\n const currIndex = currentIndex.current + 1;\n\n setCoachmarkList(prevList => {\n // Finish onboarding\n if (currIndex >= prevList.length || prevList.length === 0) {\n clearJourney();\n\n return [];\n }\n\n currentIndex.current = currIndex;\n const updatedCoachmarkList = [...prevList];\n\n (updatedCoachmarkList[currIndex] as ICoachmarkProps).isActive = true;\n\n if (currIndex > 0) {\n (updatedCoachmarkList[currIndex - 1] as ICoachmarkProps).isActive = keepPrevActive;\n }\n\n return updatedCoachmarkList;\n });\n }, delayInMs);\n\n timerRefs.current.push(timer);\n },\n [clearJourney],\n );\n\n const memoizedContextValue: IJourneyContext = useMemo(\n () => ({\n nextCoachmark,\n setJourney,\n addCoachmark,\n clearJourney,\n endJourney,\n coachmarks: coachmarkList,\n userCompletedJourneyIds,\n isJourneyActive,\n }),\n [\n nextCoachmark,\n setJourney,\n addCoachmark,\n clearJourney,\n endJourney,\n coachmarkList,\n userCompletedJourneyIds,\n isJourneyActive,\n ],\n );\n\n // Get the initial state of incompleteJourneys\n useEffect(() => {\n if (appId && userId) {\n getJourneyProgress(userId, {\n app_id: appId,\n user_id: userId,\n journey_status: 'COMPLETED',\n });\n }\n }, [appId, getJourneyProgress, userId]);\n\n // Set the data to context state initially\n useEffect(() => {\n if (userCompletedJourneys) {\n const completedUserJourneysIds = userCompletedJourneys.map(journey => journey.journey_id);\n\n setUserCompletedJourneyIds(completedUserJourneysIds);\n }\n }, [userCompletedJourneys]);\n\n return (\n <JourneyContext.Provider value={memoizedContextValue}>\n {isJourneyActive && (\n <S.Overlay\n about=\"journey-overlay\"\n height={overlaySize.height}\n width={overlaySize.width}\n $isJourneyBlurred={isJourneyBlurred}\n $isBlockingJourney={isBlockingJourney}\n data-testid={currentJourneyId.current}\n >\n {coachmarkList.map((coachmark, index) => (\n <Coachmark\n key={`coachmark-${index}`}\n coachmark={coachmark}\n isInsideScrollView={isScrollableJourney}\n />\n ))}\n </S.Overlay>\n )}\n {children}\n </JourneyContext.Provider>\n );\n};\n"],"names":["JourneyContext","createContext","JourneyProvider","children","appId","userId","isBlockingJourney","setIsBlockingJourney","useState","isJourneyBlurred","setIsJourneyBlurred","userCompletedJourneyIds","setUserCompletedJourneyIds","coachmarkList","setCoachmarkList","isJourneyActive","setIsJourneyActive","currentIndex","useRef","currentJourneyId","timerRefs","isScrollableJourney","setIsScrollableJourney","overlaySize","setOverlaySize","postJourneyCompletion","usePostUserJourney","userCompletedJourneys","getJourneyProgress","useGetUserJourney","setJourney","useCallback","id","coachmarks","scrollableContRef","isBlocking","item","_a","_b","clearJourney","timer","endJourney","journeyId","prev","addCoachmark","coachmark","nextCoachmark","keepPrevActive","delayInMs","shouldBlurNextJourney","prevList","currIndex","updatedCoachmarkList","memoizedContextValue","useMemo","useEffect","completedUserJourneysIds","journey","jsxs","jsx","S.Overlay","index","Coachmark"],"mappings":"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"}
@@ -1,14 +1,16 @@
1
- import r, { css as e } from "styled-components";
2
- const p = r.div`
1
+ import e, { css as r } from "styled-components";
2
+ const p = e.div`
3
3
  position: absolute;
4
4
  top: 0;
5
5
  right: 0;
6
6
  bottom: 0;
7
7
  left: 0;
8
- z-index: ${({ theme: t }) => t.zIndex.JOURNEY_OVERLAY};
8
+ z-index: ${({ $isBlockingJourney: t, theme: o }) => t ? o.zIndex.JOURNEY_OVERLAY : 0};
9
+ pointer-events: ${({ $isBlockingJourney: t }) => t ? "auto" : "none"};
10
+
9
11
  height: ${({ height: t }) => t}px;
10
12
  width: ${({ width: t }) => t}px;
11
- ${({ $isJourneyBlurred: t, theme: o }) => t && e`
13
+ ${({ $isJourneyBlurred: t, theme: o }) => t && r`
12
14
  background: ${o.colors.BLACK_T_38};
13
15
  backdrop-filter: blur(80px);
14
16
  -webkit-backdrop-filter: blur(80px);
@@ -1 +1 @@
1
- {"version":3,"file":"journey-styled.js","sources":["../../../../src/features/journey/use-journey/journey-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { css } from 'styled-components';\n\nexport const Overlay = styled.div<{\n $isJourneyBlurred: boolean;\n height: number;\n width: number;\n}>`\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: ${({ theme }) => theme.zIndex.JOURNEY_OVERLAY};\n height: ${({ height }) => height}px;\n width: ${({ width }) => width}px;\n ${({ $isJourneyBlurred, theme }) =>\n $isJourneyBlurred &&\n css`\n background: ${theme.colors.BLACK_T_38};\n backdrop-filter: blur(80px);\n -webkit-backdrop-filter: blur(80px);\n `}\n`;\n"],"names":["Overlay","styled","theme","height","width","$isJourneyBlurred","css"],"mappings":";AAGO,MAAMA,IAAUC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAUjB,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,eAAe;AAAA,YAC5C,CAAC,EAAE,QAAAC,EAAO,MAAMA,CAAM;AAAA,WACvB,CAAC,EAAE,OAAAC,EAAM,MAAMA,CAAK;AAAA,IAC3B,CAAC,EAAE,mBAAAC,GAAmB,OAAAH,EAAA,MACtBG,KACAC;AAAA,oBACgBJ,EAAM,OAAO,UAAU;AAAA;AAAA;AAAA,KAGtC;AAAA;"}
1
+ {"version":3,"file":"journey-styled.js","sources":["../../../../src/features/journey/use-journey/journey-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\nimport { css } from 'styled-components';\n\nexport const Overlay = styled.div<{\n $isJourneyBlurred: boolean;\n $isBlockingJourney: boolean;\n height: number;\n width: number;\n}>`\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: ${({ $isBlockingJourney, theme }) =>\n $isBlockingJourney ? theme.zIndex.JOURNEY_OVERLAY : 0};\n pointer-events: ${({ $isBlockingJourney }) => ($isBlockingJourney ? 'auto' : 'none')};\n\n height: ${({ height }) => height}px;\n width: ${({ width }) => width}px;\n ${({ $isJourneyBlurred, theme }) =>\n $isJourneyBlurred &&\n css`\n background: ${theme.colors.BLACK_T_38};\n backdrop-filter: blur(80px);\n -webkit-backdrop-filter: blur(80px);\n `}\n`;\n"],"names":["Overlay","styled","$isBlockingJourney","theme","height","width","$isJourneyBlurred","css"],"mappings":";AAGO,MAAMA,IAAUC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAWjB,CAAC,EAAE,oBAAAC,GAAoB,OAAAC,QAChCD,IAAqBC,EAAM,OAAO,kBAAkB,CAAC;AAAA,oBACrC,CAAC,EAAE,oBAAAD,EAAA,MAA0BA,IAAqB,SAAS,MAAO;AAAA;AAAA,YAE1E,CAAC,EAAE,QAAAE,EAAO,MAAMA,CAAM;AAAA,WACvB,CAAC,EAAE,OAAAC,EAAM,MAAMA,CAAK;AAAA,IAC3B,CAAC,EAAE,mBAAAC,GAAmB,OAAAH,EAAA,MACtBG,KACAC;AAAA,oBACgBJ,EAAM,OAAO,UAAU;AAAA;AAAA;AAAA,KAGtC;AAAA;"}
@@ -0,0 +1,6 @@
1
+ const T = 8, R = 100;
2
+ export {
3
+ T as DEFAULT_ARROW_SIZE,
4
+ R as THROTTLE_DURATION
5
+ };
6
+ //# sourceMappingURL=arrow-tooltip-constants.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"arrow-tooltip-constants.js","sources":["../../../../src/features/ui/arrow-tooltip/arrow-tooltip-constants.ts"],"sourcesContent":["export const DEFAULT_ARROW_SIZE = 8;\nexport const THROTTLE_DURATION = 100;\n"],"names":["DEFAULT_ARROW_SIZE","THROTTLE_DURATION"],"mappings":"AAAO,MAAMA,IAAqB,GACrBC,IAAoB;"}
@@ -1,63 +1,15 @@
1
- import w from "styled-components";
2
- import y from "../layout/flex-view.js";
3
- import { arrowPosition as T, tooltipPosition as k, animateToolTip as m } from "./arrow-tooltip-util.js";
4
- const P = w(y)(({
5
- theme: o,
6
- $arrowColor: r,
7
- $arrowSize: t,
8
- $arrowXCoOrdinates: c,
9
- $arrowYCoOrdinates: d,
10
- $borderColor: p,
11
- $isAnimated: x,
12
- $position: n,
13
- $renderAs: s,
14
- $tooltipCoOrdinates: e,
15
- $tooltipOffset: f,
16
- $tooltipXCoOrdinates: g,
17
- $tooltipYCoOrdinates: u,
18
- $zIndex: C,
19
- $backgroundColor: O
20
- }) => {
21
- const { gutter: l } = o.layout, { REAL_BLACK_15: $ } = o.colors, { tooltipVariants: a } = o.arrowTooltip;
22
- let { backgroundColorName: i } = a[s];
23
- const { textColorName: b } = a[s];
24
- return i = O || i, `
25
- position: fixed;
26
- z-index: ${C || 1};
27
- padding: ${l * 0.25}px ${l * 0.5}px;
28
- color: ${b};
29
- box-shadow: 0px 2px 15px 0px ${$};
30
- background-color: ${o.colors[i]};
31
- border: 1px solid ${p ? o.colors[p] : "transparent"};
32
-
33
- &::after {
34
- content: '';
35
- position: absolute;
36
- height: ${t}px;
37
- width: ${t}px;
38
- clip-path: polygon(0% 0%, 100% 100%, 0% 100%);
39
- background-color: ${r ? o.colors[r] : o.colors[i]};
40
- ${T({
41
- position: n,
42
- arrowXCoOrdinates: c,
43
- arrowYCoOrdinates: d,
44
- arrowSize: t
45
- })};
46
- }
47
-
48
- ${k({
49
- position: n,
50
- arrowSize: t,
51
- tooltipCoOrdinates: e,
52
- tooltipOffset: f,
53
- tooltipXCoOrdinates: g,
54
- tooltipYCoOrdinates: u
55
- })};
56
-
57
- ${m(x)};
58
- `;
59
- });
1
+ import o from "styled-components";
2
+ const i = o.div`
3
+ position: absolute;
4
+ top: 0;
5
+ left: 0;
6
+ right: 0;
7
+ bottom: 0;
8
+ width: 100%;
9
+ height: 100%;
10
+ z-index: ${({ theme: t }) => t.zIndex.JOURNEY_OVERLAY};
11
+ `;
60
12
  export {
61
- P as TooltipBody
13
+ i as BackgroundOverlay
62
14
  };
63
15
  //# sourceMappingURL=arrow-tooltip-styled.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"arrow-tooltip-styled.js","sources":["../../../../src/features/ui/arrow-tooltip/arrow-tooltip-styled.tsx"],"sourcesContent":["import type { TArrowTooltipVariants, TColorNames } from '../types';\nimport type { TPositionProps, TTooltipCoOrdinatesProps } from './arrow-tooltip-types';\n\nimport styled from 'styled-components';\n\nimport FlexView from '../layout/flex-view';\nimport { animateToolTip, arrowPosition, tooltipPosition } from './arrow-tooltip-util';\n\ninterface ITooltipBodyProps {\n $arrowSize: number;\n $arrowColor?: TColorNames;\n $arrowXCoOrdinates?: number;\n $arrowYCoOrdinates?: number;\n $backgroundColor?: TColorNames;\n $borderColor?: TColorNames;\n $position: TPositionProps;\n $renderAs: TArrowTooltipVariants;\n $tooltipCoOrdinates: TTooltipCoOrdinatesProps | null;\n $tooltipOffset?: number;\n $tooltipXCoOrdinates?: number | string;\n $tooltipYCoOrdinates?: number | string;\n $zIndex?: number;\n $isAnimated?: boolean;\n}\n\nconst TooltipBody = styled(FlexView)<ITooltipBodyProps>(({\n theme,\n $arrowColor,\n $arrowSize,\n $arrowXCoOrdinates,\n $arrowYCoOrdinates,\n $borderColor,\n $isAnimated,\n $position,\n $renderAs,\n $tooltipCoOrdinates,\n $tooltipOffset,\n $tooltipXCoOrdinates,\n $tooltipYCoOrdinates,\n $zIndex,\n $backgroundColor,\n}) => {\n const { gutter } = theme.layout;\n const { REAL_BLACK_15 } = theme.colors;\n const { tooltipVariants } = theme.arrowTooltip;\n let { backgroundColorName } = tooltipVariants[$renderAs];\n const { textColorName } = tooltipVariants[$renderAs];\n\n backgroundColorName = $backgroundColor || backgroundColorName;\n\n return `\n position: fixed;\n z-index: ${$zIndex || 1};\n padding: ${gutter * 0.25}px ${gutter * 0.5}px;\n color: ${textColorName};\n box-shadow: 0px 2px 15px 0px ${REAL_BLACK_15};\n background-color: ${theme.colors[backgroundColorName]};\n border: 1px solid ${$borderColor ? theme.colors[$borderColor] : 'transparent'};\n\n &::after {\n content: '';\n position: absolute;\n height: ${$arrowSize}px;\n width: ${$arrowSize}px;\n clip-path: polygon(0% 0%, 100% 100%, 0% 100%);\n background-color: ${\n $arrowColor ? theme.colors[$arrowColor] : theme.colors[backgroundColorName]\n };\n ${arrowPosition({\n position: $position,\n arrowXCoOrdinates: $arrowXCoOrdinates,\n arrowYCoOrdinates: $arrowYCoOrdinates,\n arrowSize: $arrowSize,\n })};\n }\n\n ${tooltipPosition({\n position: $position,\n arrowSize: $arrowSize,\n tooltipCoOrdinates: $tooltipCoOrdinates,\n tooltipOffset: $tooltipOffset,\n tooltipXCoOrdinates: $tooltipXCoOrdinates,\n tooltipYCoOrdinates: $tooltipYCoOrdinates,\n })};\n\n ${animateToolTip($isAnimated)};\n `;\n});\n\nexport { TooltipBody };\n"],"names":["TooltipBody","styled","FlexView","theme","$arrowColor","$arrowSize","$arrowXCoOrdinates","$arrowYCoOrdinates","$borderColor","$isAnimated","$position","$renderAs","$tooltipCoOrdinates","$tooltipOffset","$tooltipXCoOrdinates","$tooltipYCoOrdinates","$zIndex","$backgroundColor","gutter","REAL_BLACK_15","tooltipVariants","backgroundColorName","textColorName","arrowPosition","tooltipPosition","animateToolTip"],"mappings":";;;AAyBA,MAAMA,IAAcC,EAAOC,CAAQ,EAAqB,CAAC;AAAA,EACvD,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,YAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,qBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,sBAAAC;AAAA,EACA,sBAAAC;AAAA,EACA,SAAAC;AAAA,EACA,kBAAAC;AACF,MAAM;AACE,QAAA,EAAE,QAAAC,EAAO,IAAIf,EAAM,QACnB,EAAE,eAAAgB,EAAc,IAAIhB,EAAM,QAC1B,EAAE,iBAAAiB,EAAgB,IAAIjB,EAAM;AAClC,MAAI,EAAE,qBAAAkB,EAAA,IAAwBD,EAAgBT,CAAS;AACvD,QAAM,EAAE,eAAAW,EAAA,IAAkBF,EAAgBT,CAAS;AAEnD,SAAAU,IAAsBJ,KAAoBI,GAEnC;AAAA;AAAA,eAEML,KAAW,CAAC;AAAA,eACZE,IAAS,IAAI,MAAMA,IAAS,GAAG;AAAA,aACjCI,CAAa;AAAA,mCACSH,CAAa;AAAA,wBACxBhB,EAAM,OAAOkB,CAAmB,CAAC;AAAA,wBACjCb,IAAeL,EAAM,OAAOK,CAAY,IAAI,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA,gBAKjEH,CAAU;AAAA,eACXA,CAAU;AAAA;AAAA,0BAGjBD,IAAcD,EAAM,OAAOC,CAAW,IAAID,EAAM,OAAOkB,CAAmB,CAC5E;AAAA,QACEE,EAAc;AAAA,IACd,UAAUb;AAAA,IACV,mBAAmBJ;AAAA,IACnB,mBAAmBC;AAAA,IACnB,WAAWF;AAAA,EAAA,CACZ,CAAC;AAAA;AAAA;AAAA,MAGFmB,EAAgB;AAAA,IAChB,UAAUd;AAAA,IACV,WAAWL;AAAA,IACX,oBAAoBO;AAAA,IACpB,eAAeC;AAAA,IACf,qBAAqBC;AAAA,IACrB,qBAAqBC;AAAA,EAAA,CACtB,CAAC;AAAA;AAAA,MAEAU,EAAehB,CAAW,CAAC;AAAA;AAEjC,CAAC;"}
1
+ {"version":3,"file":"arrow-tooltip-styled.js","sources":["../../../../src/features/ui/arrow-tooltip/arrow-tooltip-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const BackgroundOverlay = styled.div`\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n width: 100%;\n height: 100%;\n z-index: ${({ theme }) => theme.zIndex.JOURNEY_OVERLAY};\n`;\n"],"names":["BackgroundOverlay","styled","theme"],"mappings":";AAEO,MAAMA,IAAoBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAQ3B,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,eAAe;AAAA;"}