@cuemath/leap 3.2.15-beta-0.1 → 3.2.15-link.1

package/dist/features/auth/comps/resend-otp/resend-otp.js

@@ -1,65 +1,72 @@
-import { jsx as e, jsxs as n, Fragment as _ } from "react/jsx-runtime";
-import { memo as x, useCallback as a } from "react";
-import k from "../../../ui/buttons/button/button.js";
-import u from "../../../ui/buttons/text-button/text-button.js";
-import i from "../../../ui/layout/flex-view.js";
-import c from "../../../ui/text/text.js";
-import { useResendTimer as C } from "./hooks/use-resend-timer.js";
+import { jsx as r, jsxs as n, Fragment as C } from "react/jsx-runtime";
+import { memo as g, useCallback as f } from "react";
+import w from "../../../ui/buttons/button/button.js";
+import $ from "../../../ui/buttons/text-button/text-button.js";
+import m from "../../../ui/layout/flex-view.js";
+import a from "../../../ui/text/text.js";
+import { useResendTimer as A } from "./hooks/use-resend-timer.js";
 const I = ({
-  onResendOTP: r,
-  onResendVoiceOTP: l,
-  timerSeconds: f = 15,
-  showVoiceOTP: $ = !1,
-  disabled: m,
-  renderAs: h = "text",
-  width: p
+  onResendOTP: l,
+  onResendVoiceOTP: i,
+  timerSeconds: h = 15,
+  showVoiceOTP: p = !1,
+  disabled: o,
+  renderAs: x = "text",
+  width: k,
+  textButtonColor: s = "WHITE_T_60",
+  size: d = "small"
 }) => {
-  const { canResend: o, resetTimer: t, timeLeft: s } = C({
-    initialSeconds: f
-  }), d = a(() => {
-    r == null || r(), t();
-  }, [r, t]), b = a(() => {
+  const { canResend: c, resetTimer: t, timeLeft: u } = A({
+    initialSeconds: h
+  }), b = f(() => {
     l == null || l(), t();
-  }, [l, t]);
-  return h === "submit" ? /* @__PURE__ */ e(
-    k,
-    {
-      size: "small",
-      renderAs: "secondary-dark",
-      type: "submit",
-      label: o ? "Resend" : `Resend in ${s}`,
-      width: p,
-      onClick: d,
-      disabled: !o || m
-    }
-  ) : /* @__PURE__ */ e(i, { children: o ? /* @__PURE__ */ n(i, { $flexDirection: "row", $alignItems: "center", $flexColumnGapX: 0.5, children: [
-    /* @__PURE__ */ e(
-      u,
+  }, [l, t]), _ = f(() => {
+    i == null || i(), t();
+  }, [i, t]);
+  if (x === "submit")
+    return /* @__PURE__ */ r(
+      w,
       {
-        disabled: m,
+        size: d,
+        renderAs: "secondary-dark",
+        type: "submit",
+        label: c ? "Resend" : `Resend in ${u}`,
+        width: k,
+        onClick: b,
+        disabled: !c || o
+      }
+    );
+  const e = d === "xsmall";
+  return /* @__PURE__ */ r(m, { children: c ? /* @__PURE__ */ n(m, { $flexDirection: "row", $alignItems: "center", $flexColumnGapX: 0.5, children: [
+    /* @__PURE__ */ r(
+      $,
+      {
+        disabled: o,
         label: "Resend",
-        color: "WHITE_T_60",
-        onClick: d
+        size: e ? "small" : "regular",
+        color: s,
+        onClick: b
       }
     ),
-    $ && /* @__PURE__ */ n(_, { children: [
-      /* @__PURE__ */ e(c, { $renderAs: "ub2", $color: "WHITE_T_60", children: "or" }),
-      /* @__PURE__ */ e(i, { $width: 116, children: /* @__PURE__ */ e(
-        u,
+    p && /* @__PURE__ */ n(C, { children: [
+      /* @__PURE__ */ r(a, { $renderAs: e ? "ub3" : "ub2", $color: s, children: "or" }),
+      /* @__PURE__ */ r(m, { $width: 116, children: /* @__PURE__ */ r(
+        $,
         {
           label: "Get code via call",
-          color: "WHITE_T_60",
-          onClick: b
+          size: e ? "small" : "regular",
+          color: s,
+          onClick: _
         }
       ) })
     ] })
-  ] }) : /* @__PURE__ */ e(i, { $width: 105, children: /* @__PURE__ */ n(c, { $renderAs: "ub2", $color: "WHITE_T_60", children: [
+  ] }) : /* @__PURE__ */ r(m, { $width: 105, children: /* @__PURE__ */ n(a, { $renderAs: e ? "ub3" : "ub2", $color: "WHITE_T_60", children: [
     "Resend in",
     " ",
-    /* @__PURE__ */ e(c, { $renderAs: "ub2-bold", $inline: !0, $color: "WHITE_T_60", children: s })
+    /* @__PURE__ */ r(a, { $renderAs: e ? "ub3-bold" : "ub2-bold", $inline: !0, $color: "WHITE_T_60", children: u })
   ] }) }) });
-}, j = x(I);
+}, F = g(I);
 export {
-  j as default
+  F as default
 };
 //# sourceMappingURL=resend-otp.js.map

package/dist/features/auth/comps/resend-otp/resend-otp.js.map

@@ -1 +1 @@
-{"version":3,"file":"resend-otp.js","sources":["../../../../../src/features/auth/comps/resend-otp/resend-otp.tsx"],"sourcesContent":["import type { IOTPResendProps } from './resend-otp-types';\n\nimport { useCallback, memo } from 'react';\n\nimport Button from '../../../ui/buttons/button/button';\nimport TextButton from '../../../ui/buttons/text-button/text-button';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\nimport { useResendTimer } from './hooks/use-resend-timer';\n\nconst ResendOTP: React.FC<IOTPResendProps> = ({\n  onResendOTP,\n  onResendVoiceOTP,\n  timerSeconds = 15,\n  showVoiceOTP = false,\n  disabled,\n  renderAs = 'text',\n  width,\n}) => {\n  const { canResend, resetTimer, timeLeft } = useResendTimer({\n    initialSeconds: timerSeconds,\n  });\n\n  const handleResendClick = useCallback(() => {\n    onResendOTP?.();\n    resetTimer();\n  }, [onResendOTP, resetTimer]);\n\n  const handleVoiceResendClick = useCallback(() => {\n    onResendVoiceOTP?.();\n    resetTimer();\n  }, [onResendVoiceOTP, resetTimer]);\n\n  if (renderAs === 'submit') {\n    return (\n      <Button\n        size=\"small\"\n        renderAs=\"secondary-dark\"\n        type=\"submit\"\n        label={canResend ? 'Resend' : `Resend in ${timeLeft}`}\n        width={width}\n        onClick={handleResendClick}\n        disabled={!canResend || disabled}\n      />\n    );\n  }\n\n  return (\n    <FlexView>\n      {!canResend ? (\n        <FlexView $width={105}>\n          <Text $renderAs=\"ub2\" $color=\"WHITE_T_60\">\n            Resend in{' '}\n            <Text $renderAs=\"ub2-bold\" $inline $color=\"WHITE_T_60\">\n              {timeLeft}\n            </Text>\n          </Text>\n        </FlexView>\n      ) : (\n        <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexColumnGapX={0.5}>\n          <TextButton\n            disabled={disabled}\n            label=\"Resend\"\n            color=\"WHITE_T_60\"\n            onClick={handleResendClick}\n          />\n          {showVoiceOTP && (\n            <>\n              <Text $renderAs=\"ub2\" $color=\"WHITE_T_60\">\n                or\n              </Text>\n              <FlexView $width={116}>\n                <TextButton\n                  label=\"Get code via call\"\n                  color=\"WHITE_T_60\"\n                  onClick={handleVoiceResendClick}\n                />\n              </FlexView>\n            </>\n          )}\n        </FlexView>\n      )}\n    </FlexView>\n  );\n};\n\nexport default memo(ResendOTP);\n"],"names":["ResendOTP","onResendOTP","onResendVoiceOTP","timerSeconds","showVoiceOTP","disabled","renderAs","width","canResend","resetTimer","timeLeft","useResendTimer","handleResendClick","useCallback","handleVoiceResendClick","jsx","Button","FlexView","jsxs","TextButton","Fragment","Text","ResendOtp","memo"],"mappings":";;;;;;;AAUA,MAAMA,IAAuC,CAAC;AAAA,EAC5C,aAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,cAAAC,IAAe;AAAA,EACf,UAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,OAAAC;AACF,MAAM;AACJ,QAAM,EAAE,WAAAC,GAAW,YAAAC,GAAY,UAAAC,EAAA,IAAaC,EAAe;AAAA,IACzD,gBAAgBR;AAAA,EAAA,CACjB,GAEKS,IAAoBC,EAAY,MAAM;AAC5B,IAAAZ,KAAA,QAAAA,KACHQ;EAAA,GACV,CAACR,GAAaQ,CAAU,CAAC,GAEtBK,IAAyBD,EAAY,MAAM;AAC5B,IAAAX,KAAA,QAAAA,KACRO;EAAA,GACV,CAACP,GAAkBO,CAAU,CAAC;AAEjC,SAAIH,MAAa,WAEb,gBAAAS;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,UAAS;AAAA,MACT,MAAK;AAAA,MACL,OAAOR,IAAY,WAAW,aAAaE,CAAQ;AAAA,MACnD,OAAAH;AAAA,MACA,SAASK;AAAA,MACT,UAAU,CAACJ,KAAaH;AAAA,IAAA;AAAA,EAAA,IAM3B,gBAAAU,EAAAE,GAAA,EACE,UAACT,IAUC,gBAAAU,EAAAD,GAAA,EAAS,gBAAe,OAAM,aAAY,UAAS,iBAAiB,KACnE,UAAA;AAAA,IAAA,gBAAAF;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,UAAAd;AAAA,QACA,OAAM;AAAA,QACN,OAAM;AAAA,QACN,SAASO;AAAA,MAAA;AAAA,IACX;AAAA,IACCR,KAEG,gBAAAc,EAAAE,GAAA,EAAA,UAAA;AAAA,MAAA,gBAAAL,EAACM,GAAK,EAAA,WAAU,OAAM,QAAO,cAAa,UAE1C,MAAA;AAAA,MACA,gBAAAN,EAACE,GAAS,EAAA,QAAQ,KAChB,UAAA,gBAAAF;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,OAAM;AAAA,UACN,OAAM;AAAA,UACN,SAASL;AAAA,QAAA;AAAA,MAAA,GAEb;AAAA,IAAA,GACF;AAAA,EAAA,EAEJ,CAAA,IA9BC,gBAAAC,EAAAE,GAAA,EAAS,QAAQ,KAChB,UAAC,gBAAAC,EAAAG,GAAA,EAAK,WAAU,OAAM,QAAO,cAAa,UAAA;AAAA,IAAA;AAAA,IAC9B;AAAA,IACV,gBAAAN,EAACM,KAAK,WAAU,YAAW,SAAO,IAAC,QAAO,cACvC,UACHX,EAAA,CAAA;AAAA,EACF,EAAA,CAAA,EACF,CAAA,EAyBJ,CAAA;AAEJ,GAEeY,IAAAC,EAAKvB,CAAS;"}
+{"version":3,"file":"resend-otp.js","sources":["../../../../../src/features/auth/comps/resend-otp/resend-otp.tsx"],"sourcesContent":["import type { IOTPResendProps } from './resend-otp-types';\n\nimport { useCallback, memo } from 'react';\n\nimport Button from '../../../ui/buttons/button/button';\nimport TextButton from '../../../ui/buttons/text-button/text-button';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Text from '../../../ui/text/text';\nimport { useResendTimer } from './hooks/use-resend-timer';\n\nconst ResendOTP: React.FC<IOTPResendProps> = ({\n  onResendOTP,\n  onResendVoiceOTP,\n  timerSeconds = 15,\n  showVoiceOTP = false,\n  disabled,\n  renderAs = 'text',\n  width,\n  textButtonColor = 'WHITE_T_60',\n  size = 'small',\n}) => {\n  const { canResend, resetTimer, timeLeft } = useResendTimer({\n    initialSeconds: timerSeconds,\n  });\n\n  const handleResendClick = useCallback(() => {\n    onResendOTP?.();\n    resetTimer();\n  }, [onResendOTP, resetTimer]);\n\n  const handleVoiceResendClick = useCallback(() => {\n    onResendVoiceOTP?.();\n    resetTimer();\n  }, [onResendVoiceOTP, resetTimer]);\n\n  if (renderAs === 'submit') {\n    return (\n      <Button\n        size={size}\n        renderAs=\"secondary-dark\"\n        type=\"submit\"\n        label={canResend ? 'Resend' : `Resend in ${timeLeft}`}\n        width={width}\n        onClick={handleResendClick}\n        disabled={!canResend || disabled}\n      />\n    );\n  }\n\n  const isXSmallSize = size === 'xsmall';\n\n  return (\n    <FlexView>\n      {!canResend ? (\n        <FlexView $width={105}>\n          <Text $renderAs={isXSmallSize ? 'ub3' : 'ub2'} $color=\"WHITE_T_60\">\n            Resend in{' '}\n            <Text $renderAs={isXSmallSize ? 'ub3-bold' : 'ub2-bold'} $inline $color=\"WHITE_T_60\">\n              {timeLeft}\n            </Text>\n          </Text>\n        </FlexView>\n      ) : (\n        <FlexView $flexDirection=\"row\" $alignItems=\"center\" $flexColumnGapX={0.5}>\n          <TextButton\n            disabled={disabled}\n            label=\"Resend\"\n            size={isXSmallSize ? 'small' : 'regular'}\n            color={textButtonColor}\n            onClick={handleResendClick}\n          />\n          {showVoiceOTP && (\n            <>\n              <Text $renderAs={isXSmallSize ? 'ub3' : 'ub2'} $color={textButtonColor}>\n                or\n              </Text>\n              <FlexView $width={116}>\n                <TextButton\n                  label=\"Get code via call\"\n                  size={isXSmallSize ? 'small' : 'regular'}\n                  color={textButtonColor}\n                  onClick={handleVoiceResendClick}\n                />\n              </FlexView>\n            </>\n          )}\n        </FlexView>\n      )}\n    </FlexView>\n  );\n};\n\nexport default memo(ResendOTP);\n"],"names":["ResendOTP","onResendOTP","onResendVoiceOTP","timerSeconds","showVoiceOTP","disabled","renderAs","width","textButtonColor","size","canResend","resetTimer","timeLeft","useResendTimer","handleResendClick","useCallback","handleVoiceResendClick","jsx","Button","isXSmallSize","FlexView","jsxs","TextButton","Fragment","Text","ResendOtp","memo"],"mappings":";;;;;;;AAUA,MAAMA,IAAuC,CAAC;AAAA,EAC5C,aAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,cAAAC,IAAe;AAAA,EACf,UAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,OAAAC;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,MAAAC,IAAO;AACT,MAAM;AACJ,QAAM,EAAE,WAAAC,GAAW,YAAAC,GAAY,UAAAC,EAAA,IAAaC,EAAe;AAAA,IACzD,gBAAgBV;AAAA,EAAA,CACjB,GAEKW,IAAoBC,EAAY,MAAM;AAC5B,IAAAd,KAAA,QAAAA,KACHU;EAAA,GACV,CAACV,GAAaU,CAAU,CAAC,GAEtBK,IAAyBD,EAAY,MAAM;AAC5B,IAAAb,KAAA,QAAAA,KACRS;EAAA,GACV,CAACT,GAAkBS,CAAU,CAAC;AAEjC,MAAIL,MAAa;AAEb,WAAA,gBAAAW;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,MAAAT;AAAA,QACA,UAAS;AAAA,QACT,MAAK;AAAA,QACL,OAAOC,IAAY,WAAW,aAAaE,CAAQ;AAAA,QACnD,OAAAL;AAAA,QACA,SAASO;AAAA,QACT,UAAU,CAACJ,KAAaL;AAAA,MAAA;AAAA,IAAA;AAK9B,QAAMc,IAAeV,MAAS;AAE9B,SACG,gBAAAQ,EAAAG,GAAA,EACE,UAACV,IAUC,gBAAAW,EAAAD,GAAA,EAAS,gBAAe,OAAM,aAAY,UAAS,iBAAiB,KACnE,UAAA;AAAA,IAAA,gBAAAH;AAAA,MAACK;AAAA,MAAA;AAAA,QACC,UAAAjB;AAAA,QACA,OAAM;AAAA,QACN,MAAMc,IAAe,UAAU;AAAA,QAC/B,OAAOX;AAAA,QACP,SAASM;AAAA,MAAA;AAAA,IACX;AAAA,IACCV,KAEG,gBAAAiB,EAAAE,GAAA,EAAA,UAAA;AAAA,MAAA,gBAAAN,EAACO,KAAK,WAAWL,IAAe,QAAQ,OAAO,QAAQX,GAAiB,UAExE,KAAA,CAAA;AAAA,MACA,gBAAAS,EAACG,GAAS,EAAA,QAAQ,KAChB,UAAA,gBAAAH;AAAA,QAACK;AAAA,QAAA;AAAA,UACC,OAAM;AAAA,UACN,MAAMH,IAAe,UAAU;AAAA,UAC/B,OAAOX;AAAA,UACP,SAASQ;AAAA,QAAA;AAAA,MAAA,GAEb;AAAA,IAAA,GACF;AAAA,EAAA,EAEJ,CAAA,sBAhCCI,GAAS,EAAA,QAAQ,KAChB,UAAA,gBAAAC,EAACG,KAAK,WAAWL,IAAe,QAAQ,OAAO,QAAO,cAAa,UAAA;AAAA,IAAA;AAAA,IACvD;AAAA,IACV,gBAAAF,EAACO,GAAK,EAAA,WAAWL,IAAe,aAAa,YAAY,SAAO,IAAC,QAAO,cACrE,UACHP,EAAA,CAAA;AAAA,EACF,EAAA,CAAA,EACF,CAAA,EA2BJ,CAAA;AAEJ,GAEea,IAAAC,EAAK1B,CAAS;"}

package/dist/features/auth/comps/selectable-info-card/selectable-info-card-styled.js

@@ -0,0 +1,17 @@
+import e from "styled-components";
+import t from "../../../ui/layout/flex-view.js";
+const s = e(t)`
+  ${({ selected: r, theme: o }) => `
+    cursor: pointer;
+    transition: all 0.3s ease;
+    border-width: 2px;
+
+    &:hover {
+        background-color: ${r ? void 0 : o.colors.BLACK_5};
+    }
+  `}
+`;
+export {
+  s as Wrapper
+};
+//# sourceMappingURL=selectable-info-card-styled.js.map

package/dist/features/auth/comps/selectable-info-card/selectable-info-card-styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"selectable-info-card-styled.js","sources":["../../../../../src/features/auth/comps/selectable-info-card/selectable-info-card-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\n\nexport const Wrapper = styled(FlexView)<{ selected: boolean }>`\n  ${({ selected, theme }) => {\n    return `\n    cursor: pointer;\n    transition: all 0.3s ease;\n    border-width: 2px;\n\n    &:hover {\n        background-color: ${!selected ? theme.colors.BLACK_5 : undefined};\n    }\n  `;\n  }}\n`;\n"],"names":["Wrapper","styled","FlexView","selected","theme"],"mappings":";;AAIa,MAAAA,IAAUC,EAAOC,CAAQ;AAAA,IAClC,CAAC,EAAE,UAAAC,GAAU,OAAAC,QACN;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,4BAMkBD,IAAkC,SAAvBC,EAAM,OAAO,OAAmB;AAAA;AAAA,GAGrE;AAAA;"}

package/dist/features/auth/comps/selectable-info-card/selectable-info-card.js

@@ -0,0 +1,67 @@
+import { jsxs as s, jsx as n } from "react/jsx-runtime";
+import { memo as d, useRef as C, useCallback as t, useMemo as b } from "react";
+import g from "../../../ui/layout/flex-view.js";
+import x from "../../../ui/lottie-animation/lottie-animation.js";
+import m from "../../../ui/text/text.js";
+import { Wrapper as I } from "./selectable-info-card-styled.js";
+const T = ({
+  id: a,
+  title: u,
+  description: c,
+  icon: i,
+  selected: r,
+  onClick: l
+}) => {
+  const e = C(null), f = t(() => {
+    l(a);
+  }, [a, l]), p = t(() => {
+    var o;
+    (o = e.current) == null || o.play();
+  }, []), $ = t(() => {
+    var o;
+    r || (o = e.current) == null || o.stop();
+  }, [r]), h = b(
+    () => ({
+      autoplay: r,
+      loop: !0,
+      renderer: "canvas"
+    }),
+    [r]
+  );
+  return /* @__PURE__ */ s(
+    I,
+    {
+      $gutterX: 1,
+      $gapX: 1,
+      $borderColor: "WHITE",
+      $flexDirection: "row",
+      $background: r ? "WHITE_1" : "BLACK_1",
+      onMouseEnter: p,
+      onMouseLeave: $,
+      onClick: f,
+      $flexColumnGapX: 0.5,
+      selected: r,
+      $alignItems: "center",
+      children: [
+        i && /* @__PURE__ */ n(
+          x,
+          {
+            src: i,
+            ref: e,
+            settings: h,
+            width: 40,
+            height: 40
+          }
+        ),
+        /* @__PURE__ */ s(g, { children: [
+          /* @__PURE__ */ n(m, { $renderAs: "ab3", $color: r ? "BLACK_1" : "WHITE", children: u }),
+          /* @__PURE__ */ n(m, { $renderAs: "ub3", $color: r ? "BLACK_T_60" : "WHITE_T_60", children: c })
+        ] })
+      ]
+    }
+  );
+}, H = d(T);
+export {
+  H as default
+};
+//# sourceMappingURL=selectable-info-card.js.map

package/dist/features/auth/comps/selectable-info-card/selectable-info-card.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"selectable-info-card.js","sources":["../../../../../src/features/auth/comps/selectable-info-card/selectable-info-card.tsx"],"sourcesContent":["import type { ILottieAnimationRef } from '../../../ui/lottie-animation/types';\nimport type { ISelectableInfoCardProps } from './selectable-info-card-types';\n\nimport { useCallback, useMemo, useRef, memo } from 'react';\n\nimport FlexView from '../../../ui/layout/flex-view';\nimport LottieAnimation from '../../../ui/lottie-animation/lottie-animation';\nimport Text from '../../../ui/text/text';\nimport * as Styled from './selectable-info-card-styled';\n\nconst SelectableInfoCard = ({\n  id,\n  title,\n  description,\n  icon,\n  selected,\n  onClick,\n}: ISelectableInfoCardProps) => {\n  const animationRef = useRef<ILottieAnimationRef | null>(null);\n\n  const handleClick = useCallback(() => {\n    onClick(id);\n  }, [id, onClick]);\n\n  const handleOnMouseEnter = useCallback(() => {\n    animationRef.current?.play();\n  }, []);\n\n  const handleOnMouseLeave = useCallback(() => {\n    if (selected) return;\n    animationRef.current?.stop();\n  }, [selected]);\n\n  const renderSettings = useMemo(\n    () => ({\n      autoplay: selected,\n      loop: true,\n      renderer: 'canvas',\n    }),\n    [selected],\n  );\n\n  return (\n    <Styled.Wrapper\n      $gutterX={1}\n      $gapX={1}\n      $borderColor=\"WHITE\"\n      $flexDirection=\"row\"\n      $background={selected ? 'WHITE_1' : 'BLACK_1'}\n      onMouseEnter={handleOnMouseEnter}\n      onMouseLeave={handleOnMouseLeave}\n      onClick={handleClick}\n      $flexColumnGapX={0.5}\n      selected={selected}\n      $alignItems=\"center\"\n    >\n      {icon && (\n        <LottieAnimation\n          src={icon}\n          ref={animationRef}\n          settings={renderSettings}\n          width={40}\n          height={40}\n        />\n      )}\n\n      <FlexView>\n        <Text $renderAs=\"ab3\" $color={selected ? 'BLACK_1' : 'WHITE'}>\n          {title}\n        </Text>\n        <Text $renderAs=\"ub3\" $color={selected ? 'BLACK_T_60' : 'WHITE_T_60'}>\n          {description}\n        </Text>\n      </FlexView>\n    </Styled.Wrapper>\n  );\n};\n\nexport default memo(SelectableInfoCard);\n"],"names":["SelectableInfoCard","id","title","description","icon","selected","onClick","animationRef","useRef","handleClick","useCallback","handleOnMouseEnter","_a","handleOnMouseLeave","renderSettings","useMemo","jsxs","Styled.Wrapper","jsx","LottieAnimation","FlexView","Text","selectableInfoCard","memo"],"mappings":";;;;;;AAUA,MAAMA,IAAqB,CAAC;AAAA,EAC1B,IAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AACF,MAAgC;AACxB,QAAAC,IAAeC,EAAmC,IAAI,GAEtDC,IAAcC,EAAY,MAAM;AACpC,IAAAJ,EAAQL,CAAE;AAAA,EAAA,GACT,CAACA,GAAIK,CAAO,CAAC,GAEVK,IAAqBD,EAAY,MAAM;;AAC3C,KAAAE,IAAAL,EAAa,YAAb,QAAAK,EAAsB;AAAA,EACxB,GAAG,CAAE,CAAA,GAECC,IAAqBH,EAAY,MAAM;;AAC3C,IAAIL,MACJO,IAAAL,EAAa,YAAb,QAAAK,EAAsB;AAAA,EAAK,GAC1B,CAACP,CAAQ,CAAC,GAEPS,IAAiBC;AAAA,IACrB,OAAO;AAAA,MACL,UAAUV;AAAA,MACV,MAAM;AAAA,MACN,UAAU;AAAA,IAAA;AAAA,IAEZ,CAACA,CAAQ;AAAA,EAAA;AAIT,SAAA,gBAAAW;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,UAAU;AAAA,MACV,OAAO;AAAA,MACP,cAAa;AAAA,MACb,gBAAe;AAAA,MACf,aAAaZ,IAAW,YAAY;AAAA,MACpC,cAAcM;AAAA,MACd,cAAcE;AAAA,MACd,SAASJ;AAAA,MACT,iBAAiB;AAAA,MACjB,UAAAJ;AAAA,MACA,aAAY;AAAA,MAEX,UAAA;AAAA,QACCD,KAAA,gBAAAc;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,KAAKf;AAAA,YACL,KAAKG;AAAA,YACL,UAAUO;AAAA,YACV,OAAO;AAAA,YACP,QAAQ;AAAA,UAAA;AAAA,QACV;AAAA,0BAGDM,GACC,EAAA,UAAA;AAAA,UAAA,gBAAAF,EAACG,KAAK,WAAU,OAAM,QAAQhB,IAAW,YAAY,SAClD,UACHH,EAAA,CAAA;AAAA,UACA,gBAAAgB,EAACG,KAAK,WAAU,OAAM,QAAQhB,IAAW,eAAe,cACrD,UACHF,EAAA,CAAA;AAAA,QAAA,GACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN,GAEemB,IAAAC,EAAKvB,CAAkB;"}

package/dist/features/auth/comps/tabs/tab-tem/tab-item.js

@@ -1,23 +1,35 @@
-import { jsx as t } from "react/jsx-runtime";
-import { memo as m, useCallback as c } from "react";
-import { TabsText as i } from "../tabs-styled.js";
-const n = ({ tab: e, isSelected: o, onChange: r }) => {
-  const l = c(() => {
-    r(e.id);
-  }, [e.id, r]);
-  return /* @__PURE__ */ t(
-    i,
+import { jsxs as l, jsx as n } from "react/jsx-runtime";
+import { memo as s, useCallback as m } from "react";
+import $ from "../../../../ui/text/text.js";
+import { TabWrapper as d, Icon as a } from "../tabs-styled.js";
+const f = ({ tab: o, isSelected: e, onChange: r }) => {
+  const { Icon: t, iconPosition: i = "left" } = o, c = m(() => {
+    r(o.id);
+  }, [o.id, r]);
+  return /* @__PURE__ */ l(
+    d,
     {
-      $renderAs: o ? "ub2-bold" : "ub2",
-      $align: "center",
-      $selected: o,
-      onClick: l,
-      $color: "WHITE",
-      children: e.label
+      $selected: e,
+      $flexDirection: "row",
+      $alignItems: "center",
+      $justifyContent: "center",
+      children: [
+        t ? /* @__PURE__ */ n(a, { $selected: e, $iconPosition: i, children: /* @__PURE__ */ n(t, {}) }) : void 0,
+        /* @__PURE__ */ n(
+          $,
+          {
+            $renderAs: e ? "ub2-bold" : "ub2",
+            $align: "center",
+            onClick: c,
+            $color: "WHITE",
+            children: o.label
+          }
+        )
+      ]
     }
   );
-}, b = m(n);
+}, x = s(f);
 export {
-  b as default
+  x as default
 };
 //# sourceMappingURL=tab-item.js.map

package/dist/features/auth/comps/tabs/tab-tem/tab-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab-item.js","sources":["../../../../../../src/features/auth/comps/tabs/tab-tem/tab-item.tsx"],"sourcesContent":["import type { ITabItemProps } from '../tabs-types';\n\nimport { memo, useCallback } from 'react';\n\nimport * as Styled from '../tabs-styled';\n\nconst TabItem = ({ tab, isSelected, onChange }: ITabItemProps) => {\n  const handleClick = useCallback(() => {\n    onChange(tab.id);\n  }, [tab.id, onChange]);\n\n  return (\n    <Styled.TabsText\n      $renderAs={isSelected ? 'ub2-bold' : 'ub2'}\n      $align=\"center\"\n      $selected={isSelected}\n      onClick={handleClick}\n      $color=\"WHITE\"\n    >\n      {tab.label}\n    </Styled.TabsText>\n  );\n};\n\nexport default memo(TabItem);\n"],"names":["TabItem","tab","isSelected","onChange","handleClick","useCallback","jsx","Styled.TabsText","TabItem$1","memo"],"mappings":";;;AAMA,MAAMA,IAAU,CAAC,EAAE,KAAAC,GAAK,YAAAC,GAAY,UAAAC,QAA8B;AAC1D,QAAAC,IAAcC,EAAY,MAAM;AACpC,IAAAF,EAASF,EAAI,EAAE;AAAA,EACd,GAAA,CAACA,EAAI,IAAIE,CAAQ,CAAC;AAGnB,SAAA,gBAAAG;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,WAAWL,IAAa,aAAa;AAAA,MACrC,QAAO;AAAA,MACP,WAAWA;AAAA,MACX,SAASE;AAAA,MACT,QAAO;AAAA,MAEN,UAAIH,EAAA;AAAA,IAAA;AAAA,EAAA;AAGX,GAEeO,IAAAC,EAAKT,CAAO;"}
+{"version":3,"file":"tab-item.js","sources":["../../../../../../src/features/auth/comps/tabs/tab-tem/tab-item.tsx"],"sourcesContent":["import type { ITabItemProps } from '../tabs-types';\n\nimport { memo, useCallback } from 'react';\n\nimport Text from '../../../../ui/text/text';\nimport * as Styled from '../tabs-styled';\n\nconst TabItem = ({ tab, isSelected, onChange }: ITabItemProps) => {\n  const { Icon, iconPosition = 'left' } = tab;\n\n  const handleClick = useCallback(() => {\n    onChange(tab.id);\n  }, [tab.id, onChange]);\n\n  return (\n    <Styled.TabWrapper\n      $selected={isSelected}\n      $flexDirection=\"row\"\n      $alignItems=\"center\"\n      $justifyContent=\"center\"\n    >\n      {Icon ? (\n        <Styled.Icon $selected={isSelected} $iconPosition={iconPosition}>\n          <Icon />\n        </Styled.Icon>\n      ) : undefined}\n      <Text\n        $renderAs={isSelected ? 'ub2-bold' : 'ub2'}\n        $align=\"center\"\n        onClick={handleClick}\n        $color=\"WHITE\"\n      >\n        {tab.label}\n      </Text>\n    </Styled.TabWrapper>\n  );\n};\n\nexport default memo(TabItem);\n"],"names":["TabItem","tab","isSelected","onChange","Icon","iconPosition","handleClick","useCallback","jsxs","Styled.TabWrapper","jsx","Styled.Icon","Text","TabItem$1","memo"],"mappings":";;;;AAOA,MAAMA,IAAU,CAAC,EAAE,KAAAC,GAAK,YAAAC,GAAY,UAAAC,QAA8B;AAChE,QAAM,EAAEC,MAAAA,GAAM,cAAAC,IAAe,OAAA,IAAWJ,GAElCK,IAAcC,EAAY,MAAM;AACpC,IAAAJ,EAASF,EAAI,EAAE;AAAA,EACd,GAAA,CAACA,EAAI,IAAIE,CAAQ,CAAC;AAGnB,SAAA,gBAAAK;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,WAAWP;AAAA,MACX,gBAAe;AAAA,MACf,aAAY;AAAA,MACZ,iBAAgB;AAAA,MAEf,UAAA;AAAA,QACCE,IAAA,gBAAAM,EAACC,GAAA,EAAY,WAAWT,GAAY,eAAeG,GACjD,UAAA,gBAAAK,EAACN,GAAK,CAAA,CAAA,EACR,CAAA,IACE;AAAA,QACJ,gBAAAM;AAAA,UAACE;AAAA,UAAA;AAAA,YACC,WAAWV,IAAa,aAAa;AAAA,YACrC,QAAO;AAAA,YACP,SAASI;AAAA,YACT,QAAO;AAAA,YAEN,UAAIL,EAAA;AAAA,UAAA;AAAA,QACP;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN,GAEeY,IAAAC,EAAKd,CAAO;"}

package/dist/features/auth/comps/tabs/tabs-styled.js

@@ -1,23 +1,35 @@
 import s from "styled-components";
-import p from "../../../ui/text/text.js";
-const d = s.div(({ theme: r, $tabsCount: o }) => {
-  const { colors: t } = r;
+import i from "../../../ui/layout/flex-view.js";
+const d = s.div(({ theme: o, $tabsCount: r, $background: t }) => {
+  const { colors: e } = o;
   return `
     display: grid;
-    background: ${t.BLACK_4};
-    grid-template-columns: repeat(${o}, 1fr);
+    background: ${e[t]};
+    grid-template-columns: repeat(${r}, 1fr);
   `;
-}), l = s(p)(({ theme: r, $selected: o }) => {
-  const { layout: t, colors: e } = r, { WHITE_T_15: n, WHITE: a } = e;
+}), c = s(i)(({ theme: o, $selected: r }) => {
+  const { layout: t, colors: e } = o, { WHITE_T_15: n, WHITE: p } = e;
   return `
     cursor: pointer;
     padding: ${t.gutter * 0.875}px 0;
-    border-bottom: 1.5px solid ${o ? a : n};
+    border-bottom: 1.5px solid ${r ? p : n};
     transition: all 0.3s ease;
   `;
-});
+}), g = s.div(({ theme: o, $iconPosition: r, $selected: t }) => `
+    ${r === "left" ? "padding-right" : "padding-left"}: 4px;
+    order: ${r === "left" ? -1 : 1};
+    
+    & svg {
+      display: ${t ? "block" : "none"};
+      width: 16px;
+      height: 16px;
+      color: ${o.colors.WHITE_1};
+      transition: color 0.2s ease-in-out;
+    }
+      `);
 export {
-  l as TabsText,
+  g as Icon,
+  c as TabWrapper,
   d as TabsWrapper
 };
 //# sourceMappingURL=tabs-styled.js.map

package/dist/features/auth/comps/tabs/tabs-styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs-styled.js","sources":["../../../../../src/features/auth/comps/tabs/tabs-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport Text from '../../../ui/text/text';\n\ninterface TabsWrapperProps {\n  $tabsCount: number;\n}\n\nconst TabsWrapper = styled.div<TabsWrapperProps>(({ theme, $tabsCount }) => {\n  const { colors } = theme;\n\n  return `\n    display: grid;\n    background: ${colors.BLACK_4};\n    grid-template-columns: repeat(${$tabsCount}, 1fr);\n  `;\n});\n\ninterface ITabsText {\n  $selected?: boolean;\n}\n\nconst TabsText = styled(Text)<ITabsText>(({ theme, $selected }) => {\n  const { layout, colors } = theme;\n  const { WHITE_T_15, WHITE } = colors;\n\n  return `\n    cursor: pointer;\n    padding: ${layout.gutter * 0.875}px 0;\n    border-bottom: 1.5px solid ${$selected ? WHITE : WHITE_T_15};\n    transition: all 0.3s ease;\n  `;\n});\n\nexport { TabsWrapper, TabsText };\n"],"names":["TabsWrapper","styled","theme","$tabsCount","colors","TabsText","Text","$selected","layout","WHITE_T_15","WHITE"],"mappings":";;AAQA,MAAMA,IAAcC,EAAO,IAAsB,CAAC,EAAE,OAAAC,GAAO,YAAAC,QAAiB;AACpE,QAAA,EAAE,QAAAC,EAAW,IAAAF;AAEZ,SAAA;AAAA;AAAA,kBAESE,EAAO,OAAO;AAAA,oCACID,CAAU;AAAA;AAE9C,CAAC,GAMKE,IAAWJ,EAAOK,CAAI,EAAa,CAAC,EAAE,OAAAJ,GAAO,WAAAK,QAAgB;AAC3D,QAAA,EAAE,QAAAC,GAAQ,QAAAJ,EAAW,IAAAF,GACrB,EAAE,YAAAO,GAAY,OAAAC,EAAU,IAAAN;AAEvB,SAAA;AAAA;AAAA,eAEMI,EAAO,SAAS,KAAK;AAAA,iCACHD,IAAYG,IAAQD,CAAU;AAAA;AAAA;AAG/D,CAAC;"}
+{"version":3,"file":"tabs-styled.js","sources":["../../../../../src/features/auth/comps/tabs/tabs-styled.tsx"],"sourcesContent":["import type { TColorNames } from '../../../ui/types';\nimport type { ITabItem } from './tabs-types';\n\nimport styled from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\n\ninterface TabsWrapperProps {\n  $tabsCount: number;\n  $background: TColorNames;\n}\n\nconst TabsWrapper = styled.div<TabsWrapperProps>(({ theme, $tabsCount, $background }) => {\n  const { colors } = theme;\n\n  return `\n    display: grid;\n    background: ${colors[$background]};\n    grid-template-columns: repeat(${$tabsCount}, 1fr);\n  `;\n});\n\ninterface ITabsText {\n  $selected?: boolean;\n}\n\nconst TabWrapper = styled(FlexView)<ITabsText>(({ theme, $selected }) => {\n  const { layout, colors } = theme;\n  const { WHITE_T_15, WHITE } = colors;\n\n  return `\n    cursor: pointer;\n    padding: ${layout.gutter * 0.875}px 0;\n    border-bottom: 1.5px solid ${$selected ? WHITE : WHITE_T_15};\n    transition: all 0.3s ease;\n  `;\n});\n\ninterface IStyledIconProps {\n  $iconPosition: NonNullable<ITabItem['iconPosition']>;\n  $selected: boolean;\n}\n\nconst Icon = styled.div<IStyledIconProps>(({ theme, $iconPosition, $selected }) => {\n  return `\n    ${$iconPosition === 'left' ? 'padding-right' : 'padding-left'}: 4px;\n    order: ${$iconPosition === 'left' ? -1 : 1};\n    \n    & svg {\n      display: ${$selected ? 'block' : 'none'};\n      width: 16px;\n      height: 16px;\n      color: ${theme.colors.WHITE_1};\n      transition: color 0.2s ease-in-out;\n    }\n      `;\n});\n\nexport { TabsWrapper, Icon, TabWrapper };\n"],"names":["TabsWrapper","styled","theme","$tabsCount","$background","colors","TabWrapper","FlexView","$selected","layout","WHITE_T_15","WHITE","Icon","$iconPosition"],"mappings":";;AAYM,MAAAA,IAAcC,EAAO,IAAsB,CAAC,EAAE,OAAAC,GAAO,YAAAC,GAAY,aAAAC,QAAkB;AACjF,QAAA,EAAE,QAAAC,EAAW,IAAAH;AAEZ,SAAA;AAAA;AAAA,kBAESG,EAAOD,CAAW,CAAC;AAAA,oCACDD,CAAU;AAAA;AAE9C,CAAC,GAMKG,IAAaL,EAAOM,CAAQ,EAAa,CAAC,EAAE,OAAAL,GAAO,WAAAM,QAAgB;AACjE,QAAA,EAAE,QAAAC,GAAQ,QAAAJ,EAAW,IAAAH,GACrB,EAAE,YAAAQ,GAAY,OAAAC,EAAU,IAAAN;AAEvB,SAAA;AAAA;AAAA,eAEMI,EAAO,SAAS,KAAK;AAAA,iCACHD,IAAYG,IAAQD,CAAU;AAAA;AAAA;AAG/D,CAAC,GAOKE,IAAOX,EAAO,IAAsB,CAAC,EAAE,OAAAC,GAAO,eAAAW,GAAe,WAAAL,QAC1D;AAAA,MACHK,MAAkB,SAAS,kBAAkB,cAAc;AAAA,aACpDA,MAAkB,SAAS,KAAK,CAAC;AAAA;AAAA;AAAA,iBAG7BL,IAAY,UAAU,MAAM;AAAA;AAAA;AAAA,eAG9BN,EAAM,OAAO,OAAO;AAAA;AAAA;AAAA,OAIlC;"}

package/dist/features/auth/comps/tabs/tabs.js

@@ -1,9 +1,9 @@
 import { jsx as m } from "react/jsx-runtime";
-import { memo as i } from "react";
-import p from "./tab-tem/tab-item.js";
-import { TabsWrapper as s } from "./tabs-styled.js";
-const a = ({ selectedTab: t, onChange: e, tabs: o }) => /* @__PURE__ */ m(s, { $tabsCount: o.length, children: o.map((r) => /* @__PURE__ */ m(p, { tab: r, isSelected: r.id === t, onChange: e }, r.id)) }), l = i(a);
+import { memo as p } from "react";
+import s from "./tab-tem/tab-item.js";
+import { TabsWrapper as a } from "./tabs-styled.js";
+const n = ({ selectedTab: t, onChange: e, tabs: o, background: i = "BLACK_4" }) => /* @__PURE__ */ m(a, { $tabsCount: o.length, $background: i, children: o.map((r) => /* @__PURE__ */ m(s, { tab: r, isSelected: r.id === t, onChange: e }, r.id)) }), u = p(n);
 export {
-  l as default
+  u as default
 };
 //# sourceMappingURL=tabs.js.map

package/dist/features/auth/comps/tabs/tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.js","sources":["../../../../../src/features/auth/comps/tabs/tabs.tsx"],"sourcesContent":["import type { ITabsProps } from './tabs-types';\n\nimport { memo } from 'react';\n\nimport TabItem from './tab-tem/tab-item';\nimport * as Styled from './tabs-styled';\n\nconst Tabs = ({ selectedTab, onChange, tabs }: ITabsProps) => {\n  return (\n    <Styled.TabsWrapper $tabsCount={tabs.length}>\n      {tabs.map(tab => (\n        <TabItem key={tab.id} tab={tab} isSelected={tab.id === selectedTab} onChange={onChange} />\n      ))}\n    </Styled.TabsWrapper>\n  );\n};\n\nexport default memo(Tabs);\n"],"names":["Tabs","selectedTab","onChange","tabs","jsx","Styled.TabsWrapper","tab","TabItem","memo"],"mappings":";;;;AAOA,MAAMA,IAAO,CAAC,EAAE,aAAAC,GAAa,UAAAC,GAAU,MAAAC,QAEnC,gBAAAC,EAACC,GAAA,EAAmB,YAAYF,EAAK,QAClC,YAAK,IAAI,CAAAG,wBACPC,GAAqB,EAAA,KAAAD,GAAU,YAAYA,EAAI,OAAOL,GAAa,UAAAC,EAAtD,GAAAI,EAAI,EAAsE,CACzF,EACH,CAAA,GAIWH,IAAAK,EAAKR,CAAI;"}
+{"version":3,"file":"tabs.js","sources":["../../../../../src/features/auth/comps/tabs/tabs.tsx"],"sourcesContent":["import type { ITabsProps } from './tabs-types';\n\nimport { memo } from 'react';\n\nimport TabItem from './tab-tem/tab-item';\nimport * as Styled from './tabs-styled';\n\nconst Tabs = ({ selectedTab, onChange, tabs, background = 'BLACK_4' }: ITabsProps) => {\n  return (\n    <Styled.TabsWrapper $tabsCount={tabs.length} $background={background}>\n      {tabs.map(tab => (\n        <TabItem key={tab.id} tab={tab} isSelected={tab.id === selectedTab} onChange={onChange} />\n      ))}\n    </Styled.TabsWrapper>\n  );\n};\n\nexport default memo(Tabs);\n"],"names":["Tabs","selectedTab","onChange","tabs","background","jsx","Styled.TabsWrapper","TabItem","tab","memo"],"mappings":";;;;AAOA,MAAMA,IAAO,CAAC,EAAE,aAAAC,GAAa,UAAAC,GAAU,MAAAC,GAAM,YAAAC,IAAa,gBAEtD,gBAAAC,EAACC,GAAA,EAAmB,YAAYH,EAAK,QAAQ,aAAaC,GACvD,UAAKD,EAAA,IAAI,OACP,gBAAAE,EAAAE,GAAA,EAAqB,KAAAC,GAAU,YAAYA,EAAI,OAAOP,GAAa,UAAAC,EAAtD,GAAAM,EAAI,EAAsE,CACzF,EACH,CAAA,GAIWL,IAAAM,EAAKT,CAAI;"}

package/dist/features/auth/signup-v2/onboarding-guide/onboarding-guide-constants.js

@@ -0,0 +1,19 @@
+import { ILLUSTRATIONS as t } from "../../../../assets/illustrations/illustrations.js";
+const o = [
+  {
+    icon: t.HANDSHAKE,
+    title: "Help us find the right tutor for your child"
+  },
+  {
+    icon: t.CALENDAR_PURPLE,
+    title: "Schedule your FREE class with the tutor"
+  },
+  {
+    icon: t.MONEY,
+    title: "Pay & continue with our flexible classes"
+  }
+];
+export {
+  o as onboardingGuideSteps
+};
+//# sourceMappingURL=onboarding-guide-constants.js.map

package/dist/features/auth/signup-v2/onboarding-guide/onboarding-guide-constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"onboarding-guide-constants.js","sources":["../../../../../src/features/auth/signup-v2/onboarding-guide/onboarding-guide-constants.ts"],"sourcesContent":["import { ILLUSTRATIONS } from '../../../../assets/illustrations/illustrations';\n\nexport const onboardingGuideSteps = [\n  {\n    icon: ILLUSTRATIONS.HANDSHAKE,\n    title: `Help us find the right tutor for your child`,\n  },\n  {\n    icon: ILLUSTRATIONS.CALENDAR_PURPLE,\n    title: `Schedule your FREE class with the tutor`,\n  },\n  {\n    icon: ILLUSTRATIONS.MONEY,\n    title: `Pay & continue with our flexible classes`,\n  },\n];\n"],"names":["onboardingGuideSteps","ILLUSTRATIONS"],"mappings":";AAEO,MAAMA,IAAuB;AAAA,EAClC;AAAA,IACE,MAAMC,EAAc;AAAA,IACpB,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,MAAMA,EAAc;AAAA,IACpB,OAAO;AAAA,EACT;AAAA,EACA;AAAA,IACE,MAAMA,EAAc;AAAA,IACpB,OAAO;AAAA,EACT;AACF;"}

package/dist/features/auth/signup-v2/onboarding-guide/onboarding-guide-styled.js

@@ -0,0 +1,32 @@
+import e from "styled-components";
+import i from "../../../ui/layout/flex-view.js";
+const l = e(i)(({ theme: { colors: t, mediaQueries: o } }) => `
+  position: relative;
+  &:not(:last-child)::after {
+    content: '';
+    width: 37px;
+    height: 2px;
+    right: -32px;
+    top: 25px;
+    position: absolute;
+    background-color: ${t.WHITE_T_15};
+  }
+  &:last-child {
+    margin-bottom: 0;
+  }
+  ${o.minWidthSmallDesktop} {
+    margin-bottom: 48px;
+    &:not(:last-child)::after {
+      left: 28px;
+      bottom: -36px;
+      right: unset;
+      top: unset;
+      width: 2px;
+      height: 24px;
+    }
+  }
+`);
+export {
+  l as StepItem
+};
+//# sourceMappingURL=onboarding-guide-styled.js.map

package/dist/features/auth/signup-v2/onboarding-guide/onboarding-guide-styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"onboarding-guide-styled.js","sources":["../../../../../src/features/auth/signup-v2/onboarding-guide/onboarding-guide-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\n\nexport const StepItem = styled(FlexView)(({ theme: { colors, mediaQueries } }) => {\n  return `\n  position: relative;\n  &:not(:last-child)::after {\n    content: '';\n    width: 37px;\n    height: 2px;\n    right: -32px;\n    top: 25px;\n    position: absolute;\n    background-color: ${colors.WHITE_T_15};\n  }\n  &:last-child {\n    margin-bottom: 0;\n  }\n  ${mediaQueries.minWidthSmallDesktop} {\n    margin-bottom: 48px;\n    &:not(:last-child)::after {\n      left: 28px;\n      bottom: -36px;\n      right: unset;\n      top: unset;\n      width: 2px;\n      height: 24px;\n    }\n  }\n`;\n});\n"],"names":["StepItem","styled","FlexView","colors","mediaQueries"],"mappings":";;AAIa,MAAAA,IAAWC,EAAOC,CAAQ,EAAE,CAAC,EAAE,OAAO,EAAE,QAAAC,GAAQ,cAAAC,EAAa,QACjE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBASeD,EAAO,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,IAKrCC,EAAa,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAYpC;"}

package/dist/features/auth/signup-v2/onboarding-guide/onboarding-guide.js

@@ -0,0 +1,44 @@
+import { jsxs as n, jsx as e } from "react/jsx-runtime";
+import { useTheme as m } from "styled-components";
+import t from "../../../ui/layout/flex-view.js";
+import a from "../../../ui/separator/separator.js";
+import l from "../../../ui/text/text.js";
+import { EDeviceType as p } from "../../../ui/theme/constants.js";
+import { onboardingGuideSteps as s } from "./onboarding-guide-constants.js";
+import { StepItem as $ } from "./onboarding-guide-styled.js";
+const d = () => {
+  const { device: c } = m(), r = c <= p.TABLET;
+  return /* @__PURE__ */ n(t, { $flex: 1, $alignItems: "center", $justifyContent: "center", children: [
+    /* @__PURE__ */ e(l, { $whiteSpace: "pre-line", $renderAs: "ah4", $color: "WHITE", $renderOnTabletAs: "ab1", children: "Get started in 3 easy steps!" }),
+    /* @__PURE__ */ e(a, { heightX: r ? 1 : 2.75 }),
+    /* @__PURE__ */ e(t, { $flexDirection: r ? "row" : "column", $flexColumnGapX: 1.5, children: s.map((i, o) => /* @__PURE__ */ n(
+      $,
+      {
+        $flex: 1,
+        $flexDirection: r ? "column" : "row",
+        $flexColumnGapX: 1.5,
+        $flexRowGapX: 0.5,
+        $alignItems: "center",
+        children: [
+          /* @__PURE__ */ e("img", { src: i.icon, alt: `Step ${o + 1}`, width: 56, height: 56 }),
+          /* @__PURE__ */ e(t, { $width: r ? 101 : 210, children: /* @__PURE__ */ e(
+            l,
+            {
+              $whiteSpace: "pre-line",
+              $renderAs: "ab2",
+              $renderOnTabletAs: "ab3",
+              $color: "WHITE",
+              $align: r ? "center" : "left",
+              children: i.title
+            }
+          ) })
+        ]
+      },
+      o
+    )) })
+  ] });
+}, G = d;
+export {
+  G as default
+};
+//# sourceMappingURL=onboarding-guide.js.map

package/dist/features/auth/signup-v2/onboarding-guide/onboarding-guide.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"onboarding-guide.js","sources":["../../../../../src/features/auth/signup-v2/onboarding-guide/onboarding-guide.tsx"],"sourcesContent":["import { useTheme } from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\nimport Separator from '../../../ui/separator/separator';\nimport Text from '../../../ui/text/text';\nimport { EDeviceType } from '../../../ui/theme/constants';\nimport { onboardingGuideSteps } from './onboarding-guide-constants';\nimport * as Styled from './onboarding-guide-styled';\n\nconst OnboardingGuide = () => {\n  const { device } = useTheme();\n  const isCompact = device <= EDeviceType.TABLET;\n\n  return (\n    <FlexView $flex={1} $alignItems=\"center\" $justifyContent=\"center\">\n      <Text $whiteSpace=\"pre-line\" $renderAs=\"ah4\" $color=\"WHITE\" $renderOnTabletAs=\"ab1\">\n        Get started in 3 easy steps!\n      </Text>\n      <Separator heightX={isCompact ? 1 : 2.75} />\n      <FlexView $flexDirection={isCompact ? 'row' : 'column'} $flexColumnGapX={1.5}>\n        {onboardingGuideSteps.map((step, index) => (\n          <Styled.StepItem\n            key={index}\n            $flex={1}\n            $flexDirection={isCompact ? 'column' : 'row'}\n            $flexColumnGapX={1.5}\n            $flexRowGapX={0.5}\n            $alignItems={'center'}\n          >\n            <img src={step.icon} alt={`Step ${index + 1}`} width={56} height={56} />\n            <FlexView $width={isCompact ? 101 : 210}>\n              <Text\n                $whiteSpace=\"pre-line\"\n                $renderAs=\"ab2\"\n                $renderOnTabletAs=\"ab3\"\n                $color=\"WHITE\"\n                $align={isCompact ? 'center' : 'left'}\n              >\n                {step.title}\n              </Text>\n            </FlexView>\n          </Styled.StepItem>\n        ))}\n      </FlexView>\n    </FlexView>\n  );\n};\n\nexport default OnboardingGuide;\n"],"names":["OnboardingGuide","device","useTheme","isCompact","EDeviceType","FlexView","jsx","Text","Separator","onboardingGuideSteps","step","index","jsxs","Styled.StepItem","OnboardingGuide$1"],"mappings":";;;;;;;;AASA,MAAMA,IAAkB,MAAM;AACtB,QAAA,EAAE,QAAAC,MAAWC,KACbC,IAAYF,KAAUG,EAAY;AAExC,2BACGC,GAAS,EAAA,OAAO,GAAG,aAAY,UAAS,iBAAgB,UACvD,UAAA;AAAA,IAAC,gBAAAC,EAAAC,GAAA,EAAK,aAAY,YAAW,WAAU,OAAM,QAAO,SAAQ,mBAAkB,OAAM,UAEpF,+BAAA,CAAA;AAAA,IACC,gBAAAD,EAAAE,GAAA,EAAU,SAASL,IAAY,IAAI,MAAM;AAAA,IACzC,gBAAAG,EAAAD,GAAA,EAAS,gBAAgBF,IAAY,QAAQ,UAAU,iBAAiB,KACtE,UAAqBM,EAAA,IAAI,CAACC,GAAMC,MAC/B,gBAAAC;AAAA,MAACC;AAAAA,MAAA;AAAA,QAEC,OAAO;AAAA,QACP,gBAAgBV,IAAY,WAAW;AAAA,QACvC,iBAAiB;AAAA,QACjB,cAAc;AAAA,QACd,aAAa;AAAA,QAEb,UAAA;AAAA,UAAA,gBAAAG,EAAC,OAAI,EAAA,KAAKI,EAAK,MAAM,KAAK,QAAQC,IAAQ,CAAC,IAAI,OAAO,IAAI,QAAQ,IAAI;AAAA,UACrE,gBAAAL,EAAAD,GAAA,EAAS,QAAQF,IAAY,MAAM,KAClC,UAAA,gBAAAG;AAAA,YAACC;AAAA,YAAA;AAAA,cACC,aAAY;AAAA,cACZ,WAAU;AAAA,cACV,mBAAkB;AAAA,cAClB,QAAO;AAAA,cACP,QAAQJ,IAAY,WAAW;AAAA,cAE9B,UAAKO,EAAA;AAAA,YAAA;AAAA,UAAA,GAEV;AAAA,QAAA;AAAA,MAAA;AAAA,MAlBKC;AAAA,IAoBR,CAAA,GACH;AAAA,EACF,EAAA,CAAA;AAEJ,GAEAG,IAAed;"}

package/dist/features/auth/signup-v2/signup-header/signup-header.js

@@ -0,0 +1,54 @@
+import { jsxs as t, jsx as r } from "react/jsx-runtime";
+import { useTheme as s } from "styled-components";
+import { ILLUSTRATIONS as o } from "../../../../assets/illustrations/illustrations.js";
+import i from "../../../ui/image/image.js";
+import n from "../../../ui/layout/flex-view.js";
+import c from "../../../ui/separator/separator.js";
+import l from "../../../ui/text/text.js";
+import { EDeviceType as a } from "../../../ui/theme/constants.js";
+const d = () => {
+  const { device: m } = s(), e = m <= a.TABLET;
+  return /* @__PURE__ */ t(
+    n,
+    {
+      $flexDirection: e ? "row" : "column",
+      $alignItems: e ? "center" : "flex-start",
+      $width: "100%",
+      $flexColumnGapX: 1,
+      $justifyContent: e ? "space-between" : "flex-start",
+      children: [
+        /* @__PURE__ */ r(
+          i,
+          {
+            width: e ? 80 : 107,
+            src: o.CIRCLE_CUEMATH_LOGO_WHITE,
+            height: e ? 12 : 16
+          }
+        ),
+        !e && /* @__PURE__ */ r(c, { heightX: 1 }),
+        /* @__PURE__ */ t(n, { $flexDirection: "row", $alignItems: "flex-end", children: [
+          /* @__PURE__ */ t(l, { $renderAs: "ab2", $renderOnTabletAs: "ub3", $color: "WHITE", children: [
+            "Rated",
+            " ",
+            /* @__PURE__ */ r(l, { $inline: !0, $renderAs: "ab2-bold", $renderOnTabletAs: "ub3-bold", $color: "WHITE", children: "4.8+" }),
+            " ",
+            "on"
+          ] }),
+          " ",
+          /* @__PURE__ */ r(
+            i,
+            {
+              src: o.TRUSTPILOT,
+              width: e ? 80 : 99,
+              height: e ? 20 : 25
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}, b = d;
+export {
+  b as default
+};
+//# sourceMappingURL=signup-header.js.map

package/dist/features/auth/signup-v2/signup-header/signup-header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"signup-header.js","sources":["../../../../../src/features/auth/signup-v2/signup-header/signup-header.tsx"],"sourcesContent":["import { useTheme } from 'styled-components';\n\nimport { ILLUSTRATIONS } from '../../../../assets/illustrations/illustrations';\nimport Image from '../../../ui/image/image';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Separator from '../../../ui/separator/separator';\nimport Text from '../../../ui/text/text';\nimport { EDeviceType } from '../../../ui/theme/constants';\n\nconst SignupHeader = () => {\n  const { device } = useTheme();\n  const isCompact = device <= EDeviceType.TABLET;\n\n  return (\n    <FlexView\n      $flexDirection={isCompact ? 'row' : 'column'}\n      $alignItems={isCompact ? 'center' : 'flex-start'}\n      $width=\"100%\"\n      $flexColumnGapX={1}\n      $justifyContent={isCompact ? 'space-between' : 'flex-start'}\n    >\n      <Image\n        width={isCompact ? 80 : 107}\n        src={ILLUSTRATIONS.CIRCLE_CUEMATH_LOGO_WHITE}\n        height={isCompact ? 12 : 16}\n      />\n      {!isCompact && <Separator heightX={1} />}\n      <FlexView $flexDirection=\"row\" $alignItems=\"flex-end\">\n        <Text $renderAs=\"ab2\" $renderOnTabletAs=\"ub3\" $color=\"WHITE\">\n          Rated{' '}\n          <Text $inline $renderAs=\"ab2-bold\" $renderOnTabletAs=\"ub3-bold\" $color=\"WHITE\">\n            4.8+\n          </Text>{' '}\n          on\n        </Text>\n        &nbsp;\n        <Image\n          src={ILLUSTRATIONS.TRUSTPILOT}\n          width={isCompact ? 80 : 99}\n          height={isCompact ? 20 : 25}\n        />\n      </FlexView>\n    </FlexView>\n  );\n};\n\nexport default SignupHeader;\n"],"names":["SignupHeader","device","useTheme","isCompact","EDeviceType","jsxs","FlexView","jsx","Image","ILLUSTRATIONS","Separator","Text","SignupHeader$1"],"mappings":";;;;;;;;AASA,MAAMA,IAAe,MAAM;AACnB,QAAA,EAAE,QAAAC,MAAWC,KACbC,IAAYF,KAAUG,EAAY;AAGtC,SAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,gBAAgBH,IAAY,QAAQ;AAAA,MACpC,aAAaA,IAAY,WAAW;AAAA,MACpC,QAAO;AAAA,MACP,iBAAiB;AAAA,MACjB,iBAAiBA,IAAY,kBAAkB;AAAA,MAE/C,UAAA;AAAA,QAAA,gBAAAI;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,OAAOL,IAAY,KAAK;AAAA,YACxB,KAAKM,EAAc;AAAA,YACnB,QAAQN,IAAY,KAAK;AAAA,UAAA;AAAA,QAC3B;AAAA,QACC,CAACA,KAAc,gBAAAI,EAAAG,GAAA,EAAU,SAAS,EAAG,CAAA;AAAA,QACrC,gBAAAL,EAAAC,GAAA,EAAS,gBAAe,OAAM,aAAY,YACzC,UAAA;AAAA,UAAA,gBAAAD,EAACM,KAAK,WAAU,OAAM,mBAAkB,OAAM,QAAO,SAAQ,UAAA;AAAA,YAAA;AAAA,YACrD;AAAA,YACN,gBAAAJ,EAACI,GAAK,EAAA,SAAO,IAAC,WAAU,YAAW,mBAAkB,YAAW,QAAO,SAAQ,UAE/E,OAAA,CAAA;AAAA,YAAQ;AAAA,YAAI;AAAA,UAAA,GAEd;AAAA,UAAO;AAAA,UAEP,gBAAAJ;AAAA,YAACC;AAAA,YAAA;AAAA,cACC,KAAKC,EAAc;AAAA,cACnB,OAAON,IAAY,KAAK;AAAA,cACxB,QAAQA,IAAY,KAAK;AAAA,YAAA;AAAA,UAC3B;AAAA,QAAA,GACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN,GAEAS,IAAeZ;"}