@cuemath/leap 2.9.2-as2 → 2.9.2-j2

package/dist/features/auth/signup/circular-step-wrapper/circular-step-wrapper.js

@@ -0,0 +1,115 @@
+import { jsxs as i, jsx as e } from "react/jsx-runtime";
+import { forwardRef as v, useRef as d, useState as h, useCallback as k, useImperativeHandle as B, useLayoutEffect as E } from "react";
+import H from "../../../../assets/line-icons/icons/back2.js";
+import W from "../../../../assets/line-icons/icons/next2.js";
+import g from "../../../ui/buttons/icon-button/icon-button.js";
+import j from "../../../ui/layout/flex-view.js";
+import N from "../../../ui/lottie-animation/lottie-animation.js";
+import T from "../../../ui/separator/separator.js";
+import z from "../../../ui/text/text.js";
+import { Container as M, CircularStepContainer as O, InputContainer as P, PrevButtonWrapper as V, NextButtonWrapper as D } from "./circular-step-wrapper-styled.js";
+const K = {
+  autoplay: !1,
+  loop: !1,
+  renderer: "svg",
+  rendererSettings: {
+    preserveAspectRatio: "xMidYMin slice"
+  }
+}, X = v(
+  ({
+    children: C,
+    onGoBack: $,
+    onNext: y,
+    label: c,
+    showNext: x,
+    showPrevious: I,
+    animation: r,
+    introFrames: n,
+    outroFrames: S,
+    isNextLoading: s
+  }, w) => {
+    const t = d(null), o = d(null), [a, A] = h(), [L, l] = h(!1), R = k(() => {
+      r && t.current && n && (t.current.playSegments(n, !0), setTimeout(() => l(!0), 500));
+    }, [r, n]);
+    return B(w, () => ({
+      playOutroAndFadeOut: async () => new Promise((b) => {
+        var p, f;
+        const u = () => {
+          var m;
+          l(!1), b(), (m = t.current) == null || m.removeEventListener("complete", u);
+        };
+        (p = t.current) == null || p.playSegments(S, !0), (f = t.current) == null || f.addEventListener("complete", u);
+      })
+    })), E(() => {
+      o.current && A(o.current.offsetHeight);
+    }, []), /* @__PURE__ */ i(
+      M,
+      {
+        $flex: 1,
+        $flexDirection: "column",
+        $alignItems: "center",
+        $justifyContent: "center",
+        $width: "100%",
+        $height: "100%",
+        ref: o,
+        children: [
+          a && /* @__PURE__ */ e(
+            N,
+            {
+              width: 1280,
+              height: a,
+              src: r,
+              ref: t,
+              onRender: R,
+              settings: K
+            }
+          ),
+          /* @__PURE__ */ i(
+            O,
+            {
+              $width: 400,
+              $height: 400,
+              $background: "REAL_BLACK",
+              $alignItems: "center",
+              $justifyContent: "center",
+              $isVisible: L,
+              children: [
+                c ? /* @__PURE__ */ i(j, { children: [
+                  /* @__PURE__ */ e(z, { $renderAs: "ab2", $color: "WHITE", $align: "center", children: c }),
+                  /* @__PURE__ */ e(T, { heightX: 1 })
+                ] }) : null,
+                /* @__PURE__ */ e(P, { children: C })
+              ]
+            }
+          ),
+          I && /* @__PURE__ */ e(V, { children: /* @__PURE__ */ e(
+            g,
+            {
+              Icon: H,
+              renderAs: "secondary",
+              analyticsLabel: "Next",
+              onClick: $,
+              disabled: s,
+              size: "regular"
+            }
+          ) }),
+          x && /* @__PURE__ */ e(D, { children: /* @__PURE__ */ e(
+            g,
+            {
+              size: "regular",
+              Icon: W,
+              renderAs: "secondary",
+              analyticsLabel: "Next",
+              onClick: y,
+              busy: s
+            }
+          ) })
+        ]
+      }
+    );
+  }
+), te = X;
+export {
+  te as default
+};
+//# sourceMappingURL=circular-step-wrapper.js.map

package/dist/features/auth/signup/circular-step-wrapper/circular-step-wrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"circular-step-wrapper.js","sources":["../../../../../src/features/auth/signup/circular-step-wrapper/circular-step-wrapper.tsx"],"sourcesContent":["import type { ILottieAnimationRef } from '../../../ui/lottie-animation/types';\nimport type { ICircularStepRef, ICircularStepWrapperProps } from './circular-step-wrapper-types';\n\nimport {\n  forwardRef,\n  useCallback,\n  useImperativeHandle,\n  useLayoutEffect,\n  useRef,\n  useState,\n  type Ref,\n} from 'react';\n\nimport Back2Icon from '../../../../assets/line-icons/icons/back2';\nimport Next2Icon from '../../../../assets/line-icons/icons/next2';\nimport IconButton from '../../../ui/buttons/icon-button/icon-button';\nimport FlexView from '../../../ui/layout/flex-view';\nimport LottieAnimation from '../../../ui/lottie-animation/lottie-animation';\nimport Separator from '../../../ui/separator/separator';\nimport Text from '../../../ui/text/text';\nimport * as Styled from './circular-step-wrapper-styled';\n\nconst animationSettings = {\n  autoplay: false,\n  loop: false,\n  renderer: 'svg',\n  rendererSettings: {\n    preserveAspectRatio: 'xMidYMin slice',\n  },\n};\n\nconst CircularStepWrapper = forwardRef<ICircularStepRef, ICircularStepWrapperProps>(\n  (\n    {\n      children,\n      onGoBack,\n      onNext,\n      label,\n      showNext,\n      showPrevious,\n      animation,\n      introFrames,\n      outroFrames,\n      isNextLoading,\n    },\n    ref: Ref<ICircularStepRef>,\n  ) => {\n    const animationRef = useRef<ILottieAnimationRef | null>(null);\n    const containerRef = useRef<HTMLDivElement>(null);\n    const [containerHeight, setContainerHeight] = useState<number | undefined>();\n    const [showContent, setShowContent] = useState(false);\n\n    const onLottieRender = useCallback(() => {\n      if (animation && animationRef.current && introFrames) {\n        animationRef.current.playSegments(introFrames, true);\n        setTimeout(() => setShowContent(true), 500);\n      }\n    }, [animation, introFrames]);\n\n    useImperativeHandle(ref, () => ({\n      playOutroAndFadeOut: async () => {\n        return new Promise<void>(resolve => {\n          const handleComplete = () => {\n            setShowContent(false);\n            resolve();\n            animationRef.current?.removeEventListener('complete', handleComplete);\n          };\n\n          animationRef.current?.playSegments(outroFrames, true);\n          animationRef.current?.addEventListener('complete', handleComplete);\n        });\n      },\n    }));\n\n    useLayoutEffect(() => {\n      if (containerRef.current) {\n        setContainerHeight(containerRef.current.offsetHeight);\n      }\n    }, []);\n\n    return (\n      <Styled.Container\n        $flex={1}\n        $flexDirection=\"column\"\n        $alignItems=\"center\"\n        $justifyContent=\"center\"\n        $width=\"100%\"\n        $height=\"100%\"\n        ref={containerRef}\n      >\n        {containerHeight && (\n          <LottieAnimation\n            width={1280}\n            height={containerHeight}\n            src={animation}\n            ref={animationRef}\n            onRender={onLottieRender}\n            settings={animationSettings}\n          />\n        )}\n        <Styled.CircularStepContainer\n          $width={400}\n          $height={400}\n          $background=\"REAL_BLACK\"\n          $alignItems=\"center\"\n          $justifyContent=\"center\"\n          $isVisible={showContent}\n        >\n          {label ? (\n            <FlexView>\n              <Text $renderAs=\"ab2\" $color=\"WHITE\" $align=\"center\">\n                {label}\n              </Text>\n              <Separator heightX={1} />\n            </FlexView>\n          ) : null}\n          <Styled.InputContainer>{children}</Styled.InputContainer>\n          {/* <Styled.CircularProgressContainer $width=\"100%\" $flex={1} $height=\"100%\">\n          <Styled.CircularProgress>\n            <LottieAnimation\n              ref={animationRef}\n              src={LOTTIE.LEVELUP_RINGS}\n              settings={animationSettings}\n              onRender={onLottieRender}\n            />\n          </Styled.CircularProgress>\n        </Styled.CircularProgressContainer> */}\n        </Styled.CircularStepContainer>\n        {showPrevious && (\n          <Styled.PrevButtonWrapper>\n            <IconButton\n              Icon={Back2Icon}\n              renderAs=\"secondary\"\n              analyticsLabel=\"Next\"\n              onClick={onGoBack}\n              disabled={isNextLoading}\n              size=\"regular\"\n            />\n          </Styled.PrevButtonWrapper>\n        )}\n        {showNext && (\n          <Styled.NextButtonWrapper>\n            <IconButton\n              size=\"regular\"\n              Icon={Next2Icon}\n              renderAs=\"secondary\"\n              analyticsLabel=\"Next\"\n              onClick={onNext}\n              busy={isNextLoading}\n            />\n          </Styled.NextButtonWrapper>\n        )}\n      </Styled.Container>\n    );\n  },\n);\n\nexport default CircularStepWrapper;\n"],"names":["animationSettings","CircularStepWrapper","forwardRef","children","onGoBack","onNext","label","showNext","showPrevious","animation","introFrames","outroFrames","isNextLoading","ref","animationRef","useRef","containerRef","containerHeight","setContainerHeight","useState","showContent","setShowContent","onLottieRender","useCallback","useImperativeHandle","resolve","handleComplete","_a","_b","useLayoutEffect","jsxs","Styled.Container","jsx","LottieAnimation","Styled.CircularStepContainer","FlexView","Text","Separator","Styled.InputContainer","Styled.PrevButtonWrapper","IconButton","Back2Icon","Styled.NextButtonWrapper","Next2Icon","CircularStepWrapper$1"],"mappings":"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"}

package/dist/features/auth/signup/claim-user-account/claim-user-account-styled.js

@@ -0,0 +1,16 @@
+import r from "styled-components";
+import t from "../../../ui/layout/flex-view.js";
+const c = r(t)`
+  border-right: 1px solid ${({ theme: o }) => o.colors.BLACK_5};
+  max-width: 200px;
+  cursor: pointer;
+  transition: background-color 0.3s ease;
+  position: relative;
+  &:hover {
+    background-color: ${({ theme: o }) => o.colors.BLACK_2};
+  }
+`;
+export {
+  c as AccountCard
+};
+//# sourceMappingURL=claim-user-account-styled.js.map

package/dist/features/auth/signup/claim-user-account/claim-user-account-styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"claim-user-account-styled.js","sources":["../../../../../src/features/auth/signup/claim-user-account/claim-user-account-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\n\nexport const AccountCard = styled(FlexView)`\n  border-right: 1px solid ${({ theme }) => theme.colors.BLACK_5};\n  max-width: 200px;\n  cursor: pointer;\n  transition: background-color 0.3s ease;\n  position: relative;\n  &:hover {\n    background-color: ${({ theme }) => theme.colors.BLACK_2};\n  }\n`;\n"],"names":["AccountCard","styled","FlexView","theme"],"mappings":";;AAIa,MAAAA,IAAcC,EAAOC,CAAQ;AAAA,4BACd,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,wBAMvC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA;"}

package/dist/features/auth/signup/claim-user-account/claim-user-account.js

@@ -0,0 +1,71 @@
+import { jsxs as r, jsx as e } from "react/jsx-runtime";
+import { memo as $ } from "react";
+import { ILLUSTRATIONS as f } from "../../../../assets/illustrations/illustrations.js";
+import u from "../../../ui/avatar/avatar.js";
+import p from "../../../ui/buttons/button/button.js";
+import g from "../../../ui/image/image.js";
+import n from "../../../ui/layout/flex-view.js";
+import t from "../../../ui/separator/separator.js";
+import o from "../../../ui/text/text.js";
+import C from "../../comps/overlay-loader/overlay-loader.js";
+import { AccountCard as I } from "./claim-user-account-styled.js";
+const A = ({
+  email: c,
+  onSelectAccount: a,
+  userAccounts: m,
+  onCreateNewAccount: h,
+  isCreatingAccount: i,
+  isLoading: s
+}) => /* @__PURE__ */ r(n, { $flex: 1, $alignItems: "center", $justifyContent: "center", $width: "100%", $height: "100%", children: [
+  /* @__PURE__ */ e(C, { isLoading: s }),
+  /* @__PURE__ */ e(g, { src: f.CIRCLE_CUEMATH_LOGO_WHITE, alt: "Parent Signup", withLoader: !1 }),
+  /* @__PURE__ */ e(t, { heightX: 1 }),
+  /* @__PURE__ */ r(n, { children: [
+    /* @__PURE__ */ r(o, { $renderAs: "ab1", $color: "WHITE", $align: "center", children: [
+      "We found multiple profiles linked to",
+      " ",
+      /* @__PURE__ */ e(o, { $color: "WHITE", $inline: !0, $renderAs: "ab1-bold", children: c })
+    ] }),
+    /* @__PURE__ */ e(o, { $renderAs: "ab1", $color: "WHITE", $align: "center", children: "Which one would you like to proceed with?" })
+  ] }),
+  /* @__PURE__ */ e(t, { heightX: 5 }),
+  /* @__PURE__ */ e(n, { $borderColor: "BLACK_5", $flexWrap: !0, $justifyContent: "center", $flexDirection: "row", children: m.map(({ id: l, phone: d }) => /* @__PURE__ */ r(
+    I,
+    {
+      $gutterX: 2,
+      $gapX: 2.81,
+      $width: 200,
+      $height: 200,
+      $alignItems: "center",
+      $justifyContent: "center",
+      onClick: () => a(l),
+      children: [
+        /* @__PURE__ */ e(u, { size: 80 }),
+        /* @__PURE__ */ e(t, { heightX: 0.5 }),
+        /* @__PURE__ */ e(o, { $color: "WHITE", $renderAs: "ab2", $align: "center", children: d })
+      ]
+    },
+    l
+  )) }),
+  /* @__PURE__ */ e(t, { heightX: 5 }),
+  /* @__PURE__ */ r(n, { $alignItems: "center", $justifyContent: "center", children: [
+    /* @__PURE__ */ e(o, { $renderAs: "ub2", $color: "WHITE", children: "Don't recognise these accounts?" }),
+    /* @__PURE__ */ e(t, { heightX: 1 }),
+    /* @__PURE__ */ e(
+      p,
+      {
+        width: 232,
+        size: "small",
+        label: "Create new account",
+        renderAs: "secondary",
+        onClick: h,
+        busy: i,
+        disabled: i
+      }
+    )
+  ] })
+] }), k = $(A);
+export {
+  k as default
+};
+//# sourceMappingURL=claim-user-account.js.map

package/dist/features/auth/signup/claim-user-account/claim-user-account.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"claim-user-account.js","sources":["../../../../../src/features/auth/signup/claim-user-account/claim-user-account.tsx"],"sourcesContent":["import type { IClaimUserAccountProps } from './claim-user-account-types';\n\nimport { memo } from 'react';\nimport { type FC } from 'react';\n\nimport { ILLUSTRATIONS } from '../../../../assets/illustrations/illustrations';\nimport Avatar from '../../../ui/avatar/avatar';\nimport Button from '../../../ui/buttons/button/button';\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 OverlayLoader from '../../comps/overlay-loader/overlay-loader';\nimport * as Styled from './claim-user-account-styled';\n\nconst ClaimUserAccount: FC<IClaimUserAccountProps> = ({\n  email,\n  onSelectAccount,\n  userAccounts,\n  onCreateNewAccount,\n  isCreatingAccount,\n  isLoading,\n}) => {\n  return (\n    <FlexView $flex={1} $alignItems=\"center\" $justifyContent=\"center\" $width=\"100%\" $height=\"100%\">\n      <OverlayLoader isLoading={isLoading} />\n      <Image src={ILLUSTRATIONS.CIRCLE_CUEMATH_LOGO_WHITE} alt=\"Parent Signup\" withLoader={false} />\n      <Separator heightX={1} />\n      <FlexView>\n        <Text $renderAs=\"ab1\" $color=\"WHITE\" $align=\"center\">\n          We found multiple profiles linked to{' '}\n          <Text $color=\"WHITE\" $inline $renderAs=\"ab1-bold\">\n            {email}\n          </Text>\n        </Text>\n        <Text $renderAs=\"ab1\" $color=\"WHITE\" $align=\"center\">\n          Which one would you like to proceed with?\n        </Text>\n      </FlexView>\n      <Separator heightX={5} />\n      <FlexView $borderColor=\"BLACK_5\" $flexWrap $justifyContent=\"center\" $flexDirection=\"row\">\n        {userAccounts.map(({ id, phone }) => (\n          <Styled.AccountCard\n            $gutterX={2}\n            $gapX={2.81}\n            key={id}\n            $width={200}\n            $height={200}\n            $alignItems=\"center\"\n            $justifyContent=\"center\"\n            onClick={() => onSelectAccount(id)}\n          >\n            <Avatar size={80} />\n            <Separator heightX={0.5} />\n            <Text $color=\"WHITE\" $renderAs=\"ab2\" $align=\"center\">\n              {phone}\n            </Text>\n          </Styled.AccountCard>\n        ))}\n      </FlexView>\n      <Separator heightX={5} />\n      <FlexView $alignItems=\"center\" $justifyContent=\"center\">\n        <Text $renderAs=\"ub2\" $color=\"WHITE\">\n          Don't recognise these accounts?\n        </Text>\n        <Separator heightX={1} />\n        <Button\n          width={232}\n          size=\"small\"\n          label=\"Create new account\"\n          renderAs=\"secondary\"\n          onClick={onCreateNewAccount}\n          busy={isCreatingAccount}\n          disabled={isCreatingAccount}\n        />\n      </FlexView>\n    </FlexView>\n  );\n};\n\nexport default memo(ClaimUserAccount);\n"],"names":["ClaimUserAccount","email","onSelectAccount","userAccounts","onCreateNewAccount","isCreatingAccount","isLoading","jsxs","FlexView","jsx","OverlayLoader","Image","ILLUSTRATIONS","Separator","Text","id","phone","Styled.AccountCard","Avatar","Button","claimUserAccount","memo"],"mappings":";;;;;;;;;;;AAeA,MAAMA,IAA+C,CAAC;AAAA,EACpD,OAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,WAAAC;AACF,MAEI,gBAAAC,EAACC,GAAS,EAAA,OAAO,GAAG,aAAY,UAAS,iBAAgB,UAAS,QAAO,QAAO,SAAQ,QACtF,UAAA;AAAA,EAAA,gBAAAC,EAACC,KAAc,WAAAJ,GAAsB;AAAA,EACrC,gBAAAG,EAACE,KAAM,KAAKC,EAAc,2BAA2B,KAAI,iBAAgB,YAAY,IAAO;AAAA,EAC5F,gBAAAH,EAACI,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,oBACtBL,GACC,EAAA,UAAA;AAAA,IAAA,gBAAAD,EAACO,KAAK,WAAU,OAAM,QAAO,SAAQ,QAAO,UAAS,UAAA;AAAA,MAAA;AAAA,MACd;AAAA,MACrC,gBAAAL,EAACK,KAAK,QAAO,SAAQ,SAAO,IAAC,WAAU,YACpC,UACHb,EAAA,CAAA;AAAA,IAAA,GACF;AAAA,IACA,gBAAAQ,EAACK,KAAK,WAAU,OAAM,QAAO,SAAQ,QAAO,UAAS,UAErD,4CAAA,CAAA;AAAA,EAAA,GACF;AAAA,EACA,gBAAAL,EAACI,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,oBACtBL,GAAS,EAAA,cAAa,WAAU,WAAS,IAAC,iBAAgB,UAAS,gBAAe,OAChF,YAAa,IAAI,CAAC,EAAE,IAAAO,GAAI,OAAAC,QACvB,gBAAAT;AAAA,IAACU;AAAAA,IAAA;AAAA,MACC,UAAU;AAAA,MACV,OAAO;AAAA,MAEP,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,aAAY;AAAA,MACZ,iBAAgB;AAAA,MAChB,SAAS,MAAMf,EAAgBa,CAAE;AAAA,MAEjC,UAAA;AAAA,QAAC,gBAAAN,EAAAS,GAAA,EAAO,MAAM,GAAI,CAAA;AAAA,QAClB,gBAAAT,EAACI,GAAU,EAAA,SAAS,IAAK,CAAA;AAAA,QACzB,gBAAAJ,EAACK,KAAK,QAAO,SAAQ,WAAU,OAAM,QAAO,UACzC,UACHE,EAAA,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAXKD;AAAA,EAaR,CAAA,GACH;AAAA,EACA,gBAAAN,EAACI,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,EACtB,gBAAAN,EAAAC,GAAA,EAAS,aAAY,UAAS,iBAAgB,UAC7C,UAAA;AAAA,IAAA,gBAAAC,EAACK,GAAK,EAAA,WAAU,OAAM,QAAO,SAAQ,UAErC,mCAAA;AAAA,IACA,gBAAAL,EAACI,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,IACvB,gBAAAJ;AAAA,MAACU;AAAA,MAAA;AAAA,QACC,OAAO;AAAA,QACP,MAAK;AAAA,QACL,OAAM;AAAA,QACN,UAAS;AAAA,QACT,SAASf;AAAA,QACT,MAAMC;AAAA,QACN,UAAUA;AAAA,MAAA;AAAA,IACZ;AAAA,EAAA,GACF;AACF,EAAA,CAAA,GAIWe,IAAAC,EAAKrB,CAAgB;"}

package/dist/features/auth/signup/custom-input/custom-input-styled.js

@@ -0,0 +1,38 @@
+import o from "styled-components";
+import e from "../../../ui/layout/flex-view.js";
+const r = o.input`
+  width: 100%;
+  max-width: 320px;
+  padding: 0;
+  line-height: 40px;
+  text-transform: ${({ textTransform: t }) => t || "none"};
+  border: none;
+  outline: none;
+  background-color: transparent;
+  font-size: 32px;
+  text-align: ${({ align: t }) => t ?? "center"};
+  caret-color: ${({ theme: t }) => t.colors.WHITE};
+  color: ${({ theme: t }) => t.colors.WHITE};
+  font-family: 'Athletics-Light';
+  color: ${({ color: t }) => t};
+
+  &::placeholder {
+    font-family: 'Athletics-Light';
+    font-size: 32px;
+  }
+  &::-webkit-outer-spin-button,
+  &::-webkit-inner-spin-button {
+    -webkit-appearance: none;
+  }
+`;
+o(e)`
+  width: 100%;
+`;
+const p = o(e)`
+  position: relative;
+`;
+export {
+  r as CustomInput,
+  p as PasswordInputWrapper
+};
+//# sourceMappingURL=custom-input-styled.js.map

package/dist/features/auth/signup/custom-input/custom-input-styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"custom-input-styled.js","sources":["../../../../../src/features/auth/signup/custom-input/custom-input-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\n\nexport const CustomInput = styled.input<{ color: string; align?: string; textTransform?: string }>`\n  width: 100%;\n  max-width: 320px;\n  padding: 0;\n  line-height: 40px;\n  text-transform: ${({ textTransform }) => textTransform || 'none'};\n  border: none;\n  outline: none;\n  background-color: transparent;\n  font-size: 32px;\n  text-align: ${({ align }) => align ?? 'center'};\n  caret-color: ${({ theme }) => theme.colors.WHITE};\n  color: ${({ theme }) => theme.colors.WHITE};\n  font-family: 'Athletics-Light';\n  color: ${({ color }) => color};\n\n  &::placeholder {\n    font-family: 'Athletics-Light';\n    font-size: 32px;\n  }\n  &::-webkit-outer-spin-button,\n  &::-webkit-inner-spin-button {\n    -webkit-appearance: none;\n  }\n`;\n\nexport const CountryCodeSelector = styled(FlexView)`\n  width: 100%;\n`;\n\nexport const PasswordInputWrapper = styled(FlexView)`\n  position: relative;\n`;\n"],"names":["CustomInput","styled","textTransform","align","theme","color","FlexView","PasswordInputWrapper"],"mappings":";;AAIO,MAAMA,IAAcC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA,oBAKd,CAAC,EAAE,eAAAC,QAAoBA,KAAiB,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA,gBAKlD,CAAC,EAAE,OAAAC,QAAYA,KAAS,QAAQ;AAAA,iBAC/B,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA,WACvC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA,WAEjC,CAAC,EAAE,OAAAC,EAAM,MAAMA,CAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYIJ,EAAOK,CAAQ;AAAA;AAAA;AAIrC,MAAAC,IAAuBN,EAAOK,CAAQ;AAAA;AAAA;"}

package/dist/features/auth/signup/custom-input/date-picker-input/date-picker-input-styled.js

@@ -0,0 +1,79 @@
+import o from "styled-components";
+const a = o.div`
+  .react-datepicker {
+    font-family: UntitledSans-Medium;
+    font-size: 14px;
+    background-color: ${({ theme: e }) => e.colors.BLACK_3};
+    border: 1px solid ${({ theme: e }) => e.colors.BLACK_5};
+    padding: 16px;
+    border-radius: 8px;
+    transition: all 0.3s ease-in-out;
+  }
+
+  .react-datepicker__aria-live {
+    display: none;
+  }
+  .react-datepicker__header {
+    color: ${({ theme: e }) => e.colors.WHITE};
+    text-align: center;
+  }
+
+  .react-datepicker__month-wrapper {
+    display: flex;
+  }
+  .react-datepicker__month-text {
+    color: ${({ theme: e }) => e.colors.WHITE_T_38};
+    cursor: pointer;
+    padding: 8px;
+    border-radius: 4px;
+    &:hover {
+      color: ${({ theme: e }) => e.colors.WHITE};
+    }
+  }
+  .react-datepicker__month-text--selected {
+    color: ${({ theme: e }) => e.colors.WHITE};
+  }
+
+  .react-datepicker__navigation--previous {
+    background: url('/path/to/your/custom-left-arrow.svg') no-repeat center;
+    width: 20px;
+    height: 20px;
+    border: none;
+    background-size: contain;
+  }
+
+  .react-datepicker__navigation--next {
+    background: url('/path/to/your/custom-right-arrow.svg') no-repeat center;
+    width: 20px;
+    height: 20px;
+    border: none;
+    background-size: contain;
+  }
+
+  .react-datepicker__navigation-icon::before {
+    content: none;
+  }
+
+  .react-datepicker__input-container input {
+    max-width: 320px;
+    padding: 0;
+    line-height: 40px;
+    border: none;
+    outline: none;
+    background-color: transparent;
+    font-size: 32px;
+    text-align: center;
+    caret-color: ${({ theme: e }) => e.colors.WHITE};
+    color: ${({ theme: e, color: r }) => r || e.colors.WHITE};
+    font-family: 'Athletics-Light';
+
+    &::placeholder {
+      font-family: 'Athletics-Light';
+      font-size: 32px;
+    }
+  }
+`;
+export {
+  a as StyledDatePickerWrapper
+};
+//# sourceMappingURL=date-picker-input-styled.js.map

package/dist/features/auth/signup/custom-input/date-picker-input/date-picker-input-styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-picker-input-styled.js","sources":["../../../../../../src/features/auth/signup/custom-input/date-picker-input/date-picker-input-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nexport const StyledDatePickerWrapper = styled.div`\n  .react-datepicker {\n    font-family: UntitledSans-Medium;\n    font-size: 14px;\n    background-color: ${({ theme }) => theme.colors.BLACK_3};\n    border: 1px solid ${({ theme }) => theme.colors.BLACK_5};\n    padding: 16px;\n    border-radius: 8px;\n    transition: all 0.3s ease-in-out;\n  }\n\n  .react-datepicker__aria-live {\n    display: none;\n  }\n  .react-datepicker__header {\n    color: ${({ theme }) => theme.colors.WHITE};\n    text-align: center;\n  }\n\n  .react-datepicker__month-wrapper {\n    display: flex;\n  }\n  .react-datepicker__month-text {\n    color: ${({ theme }) => theme.colors.WHITE_T_38};\n    cursor: pointer;\n    padding: 8px;\n    border-radius: 4px;\n    &:hover {\n      color: ${({ theme }) => theme.colors.WHITE};\n    }\n  }\n  .react-datepicker__month-text--selected {\n    color: ${({ theme }) => theme.colors.WHITE};\n  }\n\n  .react-datepicker__navigation--previous {\n    background: url('/path/to/your/custom-left-arrow.svg') no-repeat center;\n    width: 20px;\n    height: 20px;\n    border: none;\n    background-size: contain;\n  }\n\n  .react-datepicker__navigation--next {\n    background: url('/path/to/your/custom-right-arrow.svg') no-repeat center;\n    width: 20px;\n    height: 20px;\n    border: none;\n    background-size: contain;\n  }\n\n  .react-datepicker__navigation-icon::before {\n    content: none;\n  }\n\n  .react-datepicker__input-container input {\n    max-width: 320px;\n    padding: 0;\n    line-height: 40px;\n    border: none;\n    outline: none;\n    background-color: transparent;\n    font-size: 32px;\n    text-align: center;\n    caret-color: ${({ theme }) => theme.colors.WHITE};\n    color: ${({ theme, color }) => color || theme.colors.WHITE};\n    font-family: 'Athletics-Light';\n\n    &::placeholder {\n      font-family: 'Athletics-Light';\n      font-size: 32px;\n    }\n  }\n`;\n"],"names":["StyledDatePickerWrapper","styled","theme","color"],"mappings":";AAEO,MAAMA,IAA0BC,EAAO;AAAA;AAAA;AAAA;AAAA,wBAItB,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA,wBACnC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAU9C,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAQjC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,eAKpC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA,aAInC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAgC3B,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,KAAK;AAAA,aACvC,CAAC,EAAE,OAAAA,GAAO,OAAAC,EAAA,MAAYA,KAASD,EAAM,OAAO,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;"}

package/dist/features/auth/signup/custom-input/date-picker-input/date-picker-input.js

@@ -0,0 +1,54 @@
+import { jsx as e, jsxs as s } from "react/jsx-runtime";
+import d from "../../../../../node_modules/react-datepicker/dist/index.es.js";
+import f from "../../../../../assets/line-icons/icons/left.js";
+import h from "../../../../../assets/line-icons/icons/right.js";
+import o from "../../../../ui/buttons/clickable/clickable.js";
+import u from "../../../../ui/layout/flex-view.js";
+import b from "../../../../ui/text/text.js";
+import { InputWrapper as x } from "../input-wrapper/input-wrapper.js";
+import { StyledDatePickerWrapper as D } from "./date-picker-input-styled.js";
+import { subYears as t } from "../../../../../node_modules/date-fns/subYears.js";
+const I = ({ value: i, onChange: a, error: l }) => /* @__PURE__ */ e(x, { helperText: l, children: /* @__PURE__ */ e(D, { children: /* @__PURE__ */ e(
+  d,
+  {
+    selected: i,
+    showMonthYearPicker: !0,
+    showPopperArrow: !1,
+    dateFormat: "MM/yyyy",
+    placeholderText: "MM / YYYY",
+    onChange: (r) => a(r),
+    minDate: t(/* @__PURE__ */ new Date(), 22),
+    maxDate: t(/* @__PURE__ */ new Date(), 2),
+    renderCustomHeader: ({
+      date: r,
+      decreaseYear: n,
+      increaseYear: c,
+      prevYearButtonDisabled: m,
+      nextYearButtonDisabled: p
+    }) => /* @__PURE__ */ s(u, { $alignItems: "center", $flexDirection: "row", $justifyContent: "space-between", children: [
+      /* @__PURE__ */ e(
+        o,
+        {
+          onClick: n,
+          label: "increase-year",
+          disabled: m,
+          children: /* @__PURE__ */ e(f, { color: "WHITE" })
+        }
+      ),
+      /* @__PURE__ */ e(b, { $renderAs: "ub2-bold", $color: "WHITE", children: r.getFullYear() }),
+      /* @__PURE__ */ e(
+        o,
+        {
+          onClick: c,
+          label: "decrease-year",
+          disabled: p,
+          children: /* @__PURE__ */ e(h, { color: "WHITE" })
+        }
+      )
+    ] })
+  }
+) }) }), g = I;
+export {
+  g as default
+};
+//# sourceMappingURL=date-picker-input.js.map

package/dist/features/auth/signup/custom-input/date-picker-input/date-picker-input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-picker-input.js","sources":["../../../../../../src/features/auth/signup/custom-input/date-picker-input/date-picker-input.tsx"],"sourcesContent":["import type { IDatePickerInputProps } from './date-picker-input-types';\n\nimport { subYears } from 'date-fns';\nimport { type FC } from 'react';\nimport DatePicker from 'react-datepicker';\n\nimport LeftIcon from '../../../../../assets/line-icons/icons/left';\nimport RightIcon from '../../../../../assets/line-icons/icons/right';\nimport Clickable from '../../../../ui/buttons/clickable/clickable';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport Text from '../../../../ui/text/text';\nimport { InputWrapper } from '../input-wrapper/input-wrapper';\nimport * as Styled from './date-picker-input-styled';\n\nconst DatePickerInput: FC<IDatePickerInputProps> = ({ value, onChange, error }) => {\n  return (\n    <InputWrapper helperText={error}>\n      <Styled.StyledDatePickerWrapper>\n        <DatePicker\n          selected={value}\n          showMonthYearPicker\n          showPopperArrow={false}\n          dateFormat=\"MM/yyyy\"\n          placeholderText=\"MM / YYYY\"\n          onChange={date => onChange(date)}\n          minDate={subYears(new Date(), 22)}\n          maxDate={subYears(new Date(), 2)}\n          renderCustomHeader={({\n            date,\n            decreaseYear,\n            increaseYear,\n            prevYearButtonDisabled,\n            nextYearButtonDisabled,\n          }) => (\n            <FlexView $alignItems=\"center\" $flexDirection=\"row\" $justifyContent=\"space-between\">\n              <Clickable\n                onClick={decreaseYear}\n                label=\"increase-year\"\n                disabled={prevYearButtonDisabled}\n              >\n                <LeftIcon color=\"WHITE\" />\n              </Clickable>\n              <Text $renderAs=\"ub2-bold\" $color=\"WHITE\">\n                {date.getFullYear()}\n              </Text>\n              <Clickable\n                onClick={increaseYear}\n                label=\"decrease-year\"\n                disabled={nextYearButtonDisabled}\n              >\n                <RightIcon color=\"WHITE\" />\n              </Clickable>\n            </FlexView>\n          )}\n        />\n      </Styled.StyledDatePickerWrapper>\n    </InputWrapper>\n  );\n};\n\nexport default DatePickerInput;\n"],"names":["DatePickerInput","value","onChange","error","InputWrapper","jsx","Styled.StyledDatePickerWrapper","DatePicker","date","subYears","decreaseYear","increaseYear","prevYearButtonDisabled","nextYearButtonDisabled","FlexView","Clickable","LeftIcon","Text","RightIcon","DatePickerInput$1"],"mappings":";;;;;;;;;;AAcA,MAAMA,IAA6C,CAAC,EAAE,OAAAC,GAAO,UAAAC,GAAU,OAAAC,0BAElEC,GAAa,EAAA,YAAYD,GACxB,UAAC,gBAAAE,EAAAC,GAAA,EACC,UAAA,gBAAAD;AAAA,EAACE;AAAA,EAAA;AAAA,IACC,UAAUN;AAAA,IACV,qBAAmB;AAAA,IACnB,iBAAiB;AAAA,IACjB,YAAW;AAAA,IACX,iBAAgB;AAAA,IAChB,UAAU,CAAQO,MAAAN,EAASM,CAAI;AAAA,IAC/B,SAASC,EAAa,oBAAA,KAAA,GAAQ,EAAE;AAAA,IAChC,SAASA,EAAa,oBAAA,KAAA,GAAQ,CAAC;AAAA,IAC/B,oBAAoB,CAAC;AAAA,MACnB,MAAAD;AAAA,MACA,cAAAE;AAAA,MACA,cAAAC;AAAA,MACA,wBAAAC;AAAA,MACA,wBAAAC;AAAA,IAAA,wBAECC,GAAS,EAAA,aAAY,UAAS,gBAAe,OAAM,iBAAgB,iBAClE,UAAA;AAAA,MAAA,gBAAAT;AAAA,QAACU;AAAA,QAAA;AAAA,UACC,SAASL;AAAA,UACT,OAAM;AAAA,UACN,UAAUE;AAAA,UAEV,UAAA,gBAAAP,EAACW,GAAS,EAAA,OAAM,QAAQ,CAAA;AAAA,QAAA;AAAA,MAC1B;AAAA,MACA,gBAAAX,EAACY,KAAK,WAAU,YAAW,QAAO,SAC/B,UAAAT,EAAK,eACR;AAAA,MACA,gBAAAH;AAAA,QAACU;AAAA,QAAA;AAAA,UACC,SAASJ;AAAA,UACT,OAAM;AAAA,UACN,UAAUE;AAAA,UAEV,UAAA,gBAAAR,EAACa,GAAU,EAAA,OAAM,QAAQ,CAAA;AAAA,QAAA;AAAA,MAC3B;AAAA,IAAA,GACF;AAAA,EAAA;AAAA,EAGN,CAAA,EACF,CAAA,GAIJC,IAAenB;"}

package/dist/features/auth/signup/custom-input/email-input/email-input.js

@@ -0,0 +1,30 @@
+import { jsx as m } from "react/jsx-runtime";
+import { useCallback as i } from "react";
+import { useTheme as c } from "styled-components";
+import { CustomInput as s } from "../custom-input-styled.js";
+import { InputWrapper as n } from "../input-wrapper/input-wrapper.js";
+const f = ({ value: l, onChange: r, error: t, onEnter: o }) => {
+  var a;
+  const p = c(), u = i(
+    (e) => {
+      e.key === "Enter" && (o == null || o());
+    },
+    [o]
+  );
+  return /* @__PURE__ */ m(n, { helperText: t, children: /* @__PURE__ */ m(
+    s,
+    {
+      value: l,
+      onChange: (e) => r(e.target.value),
+      autoFocus: !0,
+      placeholder: "your-email@gmail.com",
+      color: (a = p.colors) == null ? void 0 : a[t ? "RED" : "WHITE"],
+      autoCapitalize: "none",
+      onKeyDown: u
+    }
+  ) });
+}, g = f;
+export {
+  g as default
+};
+//# sourceMappingURL=email-input.js.map

package/dist/features/auth/signup/custom-input/email-input/email-input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"email-input.js","sources":["../../../../../../src/features/auth/signup/custom-input/email-input/email-input.tsx"],"sourcesContent":["import type { ICustomInputProps } from '../custom-input-types';\n\nimport { useCallback, type FC, type KeyboardEvent } from 'react';\nimport { useTheme } from 'styled-components';\n\nimport * as Styled from '../custom-input-styled';\nimport { InputWrapper } from '../input-wrapper/input-wrapper';\n\nconst EmailInput: FC<ICustomInputProps> = ({ value, onChange, error, onEnter }) => {\n  const theme = useTheme();\n\n  const handleKeyDown = useCallback(\n    (event: KeyboardEvent<HTMLInputElement>) => {\n      if (event.key === 'Enter') {\n        onEnter?.();\n      }\n    },\n    [onEnter],\n  );\n\n  return (\n    <InputWrapper helperText={error}>\n      <Styled.CustomInput\n        value={value}\n        onChange={event => onChange(event.target.value)}\n        autoFocus\n        placeholder=\"your-email@gmail.com\"\n        color={theme.colors?.[error ? 'RED' : 'WHITE']}\n        autoCapitalize=\"none\"\n        onKeyDown={handleKeyDown}\n      />\n    </InputWrapper>\n  );\n};\n\nexport default EmailInput;\n"],"names":["EmailInput","value","onChange","error","onEnter","theme","useTheme","handleKeyDown","useCallback","event","jsx","InputWrapper","Styled.CustomInput","_a","EmailInput$1"],"mappings":";;;;;AAQA,MAAMA,IAAoC,CAAC,EAAE,OAAAC,GAAO,UAAAC,GAAU,OAAAC,GAAO,SAAAC,QAAc;;AACjF,QAAMC,IAAQC,KAERC,IAAgBC;AAAA,IACpB,CAACC,MAA2C;AACtC,MAAAA,EAAM,QAAQ,YACNL,KAAA,QAAAA;AAAA,IAEd;AAAA,IACA,CAACA,CAAO;AAAA,EAAA;AAIR,SAAA,gBAAAM,EAACC,GAAa,EAAA,YAAYR,GACxB,UAAA,gBAAAO;AAAA,IAACE;AAAAA,IAAA;AAAA,MACC,OAAAX;AAAA,MACA,UAAU,CAAAQ,MAASP,EAASO,EAAM,OAAO,KAAK;AAAA,MAC9C,WAAS;AAAA,MACT,aAAY;AAAA,MACZ,QAAOI,IAAAR,EAAM,WAAN,gBAAAQ,EAAeV,IAAQ,QAAQ;AAAA,MACtC,gBAAe;AAAA,MACf,WAAWI;AAAA,IAAA;AAAA,EAEf,EAAA,CAAA;AAEJ,GAEAO,IAAed;"}

package/dist/features/auth/signup/custom-input/grade-input/grade-input-styled.js

@@ -0,0 +1,31 @@
+import c from "styled-components";
+import s from "../../../../ui/layout/flex-view.js";
+const p = c(s)`
+  max-width: 264px;
+`, x = c(s)(({ selected: r, theme: o }) => {
+  const t = o.colors[r ? "WHITE" : "REAL_BLACK"], l = o.colors[r ? "REAL_BLACK" : "WHITE_T_38"], n = o.colors.WHITE, d = o.colors.REAL_BLACK, i = o.colors.WHITE;
+  return `
+      cursor: pointer;
+      transition: all 0.3s ease;
+      background-color: ${t};
+      border-width: 2px;
+
+      > div {
+        color: ${l};
+      }
+
+      &:hover {
+        background-color: ${n};
+        border-color: ${i};
+
+        > div {
+          color: ${d};
+        }
+      }
+    `;
+});
+export {
+  x as GradeItem,
+  p as GradeListWrapper
+};
+//# sourceMappingURL=grade-input-styled.js.map

package/dist/features/auth/signup/custom-input/grade-input/grade-input-styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grade-input-styled.js","sources":["../../../../../../src/features/auth/signup/custom-input/grade-input/grade-input-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../../../ui/layout/flex-view';\n\nexport const GradeListWrapper = styled(FlexView)`\n  max-width: 264px;\n`;\n\nexport const GradeItem = styled(FlexView)<{ selected: boolean }>(({ selected, theme }) => {\n  const bgColor = theme.colors[selected ? 'WHITE' : 'REAL_BLACK'];\n  const textColor = theme.colors[selected ? 'REAL_BLACK' : 'WHITE_T_38'];\n  const hoverBg = theme.colors.WHITE;\n  const hoverText = theme.colors.REAL_BLACK;\n  const hoverBorder = theme.colors.WHITE;\n\n  return `\n      cursor: pointer;\n      transition: all 0.3s ease;\n      background-color: ${bgColor};\n      border-width: 2px;\n\n      > div {\n        color: ${textColor};\n      }\n\n      &:hover {\n        background-color: ${hoverBg};\n        border-color: ${hoverBorder};\n\n        > div {\n          color: ${hoverText};\n        }\n      }\n    `;\n});\n"],"names":["GradeListWrapper","styled","FlexView","GradeItem","selected","theme","bgColor","textColor","hoverBg","hoverText","hoverBorder"],"mappings":";;AAIa,MAAAA,IAAmBC,EAAOC,CAAQ;AAAA;AAAA,GAIlCC,IAAYF,EAAOC,CAAQ,EAAyB,CAAC,EAAE,UAAAE,GAAU,OAAAC,QAAY;AACxF,QAAMC,IAAUD,EAAM,OAAOD,IAAW,UAAU,YAAY,GACxDG,IAAYF,EAAM,OAAOD,IAAW,eAAe,YAAY,GAC/DI,IAAUH,EAAM,OAAO,OACvBI,IAAYJ,EAAM,OAAO,YACzBK,IAAcL,EAAM,OAAO;AAE1B,SAAA;AAAA;AAAA;AAAA,0BAGiBC,CAAO;AAAA;AAAA;AAAA;AAAA,iBAIhBC,CAAS;AAAA;AAAA;AAAA;AAAA,4BAIEC,CAAO;AAAA,wBACXE,CAAW;AAAA;AAAA;AAAA,mBAGhBD,CAAS;AAAA;AAAA;AAAA;AAI5B,CAAC;"}

package/dist/features/auth/signup/custom-input/grade-input/grade-input.js

@@ -0,0 +1,30 @@
+import { jsx as r } from "react/jsx-runtime";
+import p from "../../../../ui/text/text.js";
+import { STUDENT_GRADE_OPTIONS as a } from "../../signup-constants.js";
+import { InputWrapper as c } from "../input-wrapper/input-wrapper.js";
+import { GradeListWrapper as $, GradeItem as l } from "./grade-input-styled.js";
+const m = ({ value: n, onChange: d, error: i }) => /* @__PURE__ */ r(c, { helperText: i, children: /* @__PURE__ */ r($, { $flexDirection: "row", $flexWrap: !0, $flexGapX: 1, children: [...a].map(({ label: o, value: e }) => {
+  const t = e === n;
+  return /* @__PURE__ */ r(
+    l,
+    {
+      selected: t,
+      onClick: () => d(e),
+      $borderRadius: 48,
+      $gutter: 13,
+      $gap: 6,
+      $alignItems: "center",
+      $justifyContent: "center",
+      $background: t ? "WHITE" : "REAL_BLACK",
+      $borderColor: t ? "WHITE" : "BLACK_5",
+      $width: e === "pre" ? 96 : 40,
+      $height: 40,
+      children: /* @__PURE__ */ r(p, { $align: "center", $renderAs: "ab1", children: o })
+    },
+    e
+  );
+}) }) }), x = m;
+export {
+  x as default
+};
+//# sourceMappingURL=grade-input.js.map

package/dist/features/auth/signup/custom-input/grade-input/grade-input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grade-input.js","sources":["../../../../../../src/features/auth/signup/custom-input/grade-input/grade-input.tsx"],"sourcesContent":["import type { ICustomInputProps } from '../custom-input-types';\nimport type { FC } from 'react';\n\nimport Text from '../../../../ui/text/text';\nimport { STUDENT_GRADE_OPTIONS } from '../../signup-constants';\nimport { InputWrapper } from '../input-wrapper/input-wrapper';\nimport * as Styled from './grade-input-styled';\n\nconst GradeInput: FC<ICustomInputProps> = ({ value, onChange, error }) => {\n  return (\n    <InputWrapper helperText={error}>\n      <Styled.GradeListWrapper $flexDirection=\"row\" $flexWrap $flexGapX={1}>\n        {[...STUDENT_GRADE_OPTIONS].map(({ label, value: optionVal }) => {\n          const isSelected = optionVal === value;\n\n          return (\n            <Styled.GradeItem\n              key={optionVal}\n              selected={isSelected}\n              onClick={() => onChange(optionVal)}\n              $borderRadius={48}\n              $gutter={13}\n              $gap={6}\n              $alignItems=\"center\"\n              $justifyContent=\"center\"\n              $background={isSelected ? 'WHITE' : 'REAL_BLACK'}\n              $borderColor={isSelected ? 'WHITE' : 'BLACK_5'}\n              $width={optionVal === 'pre' ? 96 : 40}\n              $height={40}\n            >\n              <Text $align=\"center\" $renderAs=\"ab1\">\n                {label}\n              </Text>\n            </Styled.GradeItem>\n          );\n        })}\n      </Styled.GradeListWrapper>\n    </InputWrapper>\n  );\n};\n\nexport default GradeInput;\n"],"names":["GradeInput","value","onChange","error","jsx","InputWrapper","Styled.GradeListWrapper","STUDENT_GRADE_OPTIONS","label","optionVal","isSelected","Styled.GradeItem","Text","GradeInput$1"],"mappings":";;;;;AAQA,MAAMA,IAAoC,CAAC,EAAE,OAAAC,GAAO,UAAAC,GAAU,OAAAC,QAE1D,gBAAAC,EAACC,GAAa,EAAA,YAAYF,GACxB,UAAA,gBAAAC,EAACE,GAAA,EAAwB,gBAAe,OAAM,WAAS,IAAC,WAAW,GAChE,UAAA,CAAC,GAAGC,CAAqB,EAAE,IAAI,CAAC,EAAE,OAAAC,GAAO,OAAOC,EAAA,MAAgB;AAC/D,QAAMC,IAAaD,MAAcR;AAG/B,SAAA,gBAAAG;AAAA,IAACO;AAAAA,IAAA;AAAA,MAEC,UAAUD;AAAA,MACV,SAAS,MAAMR,EAASO,CAAS;AAAA,MACjC,eAAe;AAAA,MACf,SAAS;AAAA,MACT,MAAM;AAAA,MACN,aAAY;AAAA,MACZ,iBAAgB;AAAA,MAChB,aAAaC,IAAa,UAAU;AAAA,MACpC,cAAcA,IAAa,UAAU;AAAA,MACrC,QAAQD,MAAc,QAAQ,KAAK;AAAA,MACnC,SAAS;AAAA,MAET,4BAACG,GAAK,EAAA,QAAO,UAAS,WAAU,OAC7B,UACHJ,GAAA;AAAA,IAAA;AAAA,IAfKC;AAAA,EAAA;AAgBP,CAEH,GACH,EACF,CAAA,GAIJI,IAAeb;"}

package/dist/features/auth/signup/custom-input/input-wrapper/input-wrapper-styled.js

@@ -0,0 +1,19 @@
+import t from "styled-components";
+import e from "../../../../ui/layout/flex-view.js";
+const n = t.div`
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+`, p = t(e)`
+  position: absolute;
+  top: 56px;
+  max-width: 100%;
+`;
+export {
+  p as ContentWrapper,
+  n as InputWrapper
+};
+//# sourceMappingURL=input-wrapper-styled.js.map

package/dist/features/auth/signup/custom-input/input-wrapper/input-wrapper-styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-wrapper-styled.js","sources":["../../../../../../src/features/auth/signup/custom-input/input-wrapper/input-wrapper-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../../../ui/layout/flex-view';\n\nexport const InputWrapper = styled.div`\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  width: 100%;\n`;\n\nexport const ContentWrapper = styled(FlexView)`\n  position: absolute;\n  top: 56px;\n  max-width: 100%;\n`;\n"],"names":["InputWrapper","styled","ContentWrapper","FlexView"],"mappings":";;AAIO,MAAMA,IAAeC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAStBC,IAAiBD,EAAOE,CAAQ;AAAA;AAAA;AAAA;AAAA;"}

package/dist/features/auth/signup/custom-input/input-wrapper/input-wrapper.js

@@ -0,0 +1,33 @@
+import { jsxs as r, Fragment as h, jsx as e } from "react/jsx-runtime";
+import { LOTTIE as c } from "../../../../../assets/lottie/lottie.js";
+import o from "../../../../ui/layout/flex-view.js";
+import a from "../../../../ui/lottie-animation/lottie-animation.js";
+import t from "../../../../ui/separator/separator.js";
+import s from "../../../../ui/text/text.js";
+import { InputWrapper as l, ContentWrapper as f } from "./input-wrapper-styled.js";
+const j = ({
+  children: p,
+  helperText: i,
+  actionElement: n,
+  showLoading: m
+}) => /* @__PURE__ */ r(l, { children: [
+  p,
+  /* @__PURE__ */ r(f, { $alignItems: "center", $justifyContent: "center", children: [
+    i && /* @__PURE__ */ r(h, { children: [
+      /* @__PURE__ */ e(s, { $renderAs: "ub3", $color: "WHITE_T_60", $align: "center", $whiteSpace: "pre-line", children: i }),
+      /* @__PURE__ */ e(t, { heightX: 0.5 })
+    ] }),
+    n && /* @__PURE__ */ r(o, { $justifyContent: "center", $alignItems: "center", children: [
+      n,
+      /* @__PURE__ */ e(t, { heightX: 1 })
+    ] }),
+    m && /* @__PURE__ */ r(o, { children: [
+      /* @__PURE__ */ e(t, { heightX: 2 }),
+      /* @__PURE__ */ e(a, { src: c.SPINNER_WHITE, height: 20, width: 40 })
+    ] })
+  ] })
+] });
+export {
+  j as InputWrapper
+};
+//# sourceMappingURL=input-wrapper.js.map

package/dist/features/auth/signup/custom-input/input-wrapper/input-wrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-wrapper.js","sources":["../../../../../../src/features/auth/signup/custom-input/input-wrapper/input-wrapper.tsx"],"sourcesContent":["import type { IInputWrapperProps } from './input-wrapper-types';\n\nimport { LOTTIE } from '../../../../../assets/lottie/lottie';\nimport FlexView from '../../../../ui/layout/flex-view';\nimport LottieAnimation from '../../../../ui/lottie-animation/lottie-animation';\nimport Separator from '../../../../ui/separator/separator';\nimport Text from '../../../../ui/text/text';\nimport * as Styled from './input-wrapper-styled';\n\nexport const InputWrapper = ({\n  children,\n  helperText,\n  actionElement,\n  showLoading,\n}: IInputWrapperProps) => {\n  return (\n    <Styled.InputWrapper>\n      {children}\n      <Styled.ContentWrapper $alignItems=\"center\" $justifyContent=\"center\">\n        {helperText && (\n          <>\n            <Text $renderAs=\"ub3\" $color=\"WHITE_T_60\" $align=\"center\" $whiteSpace=\"pre-line\">\n              {helperText}\n            </Text>\n            <Separator heightX={0.5} />\n          </>\n        )}\n        {actionElement && (\n          <FlexView $justifyContent=\"center\" $alignItems=\"center\">\n            {actionElement}\n            <Separator heightX={1} />\n          </FlexView>\n        )}\n        {showLoading && (\n          <FlexView>\n            <Separator heightX={2} />\n            <LottieAnimation src={LOTTIE.SPINNER_WHITE} height={20} width={40} />\n          </FlexView>\n        )}\n      </Styled.ContentWrapper>\n    </Styled.InputWrapper>\n  );\n};\n"],"names":["InputWrapper","children","helperText","actionElement","showLoading","jsxs","Styled.InputWrapper","Styled.ContentWrapper","Fragment","jsx","Text","Separator","FlexView","LottieAnimation","LOTTIE"],"mappings":";;;;;;;AASO,MAAMA,IAAe,CAAC;AAAA,EAC3B,UAAAC;AAAA,EACA,YAAAC;AAAA,EACA,eAAAC;AAAA,EACA,aAAAC;AACF,MAEI,gBAAAC,EAACC,GAAA,EACE,UAAA;AAAA,EAAAL;AAAA,oBACAM,GAAA,EAAsB,aAAY,UAAS,iBAAgB,UACzD,UAAA;AAAA,IAAAL,KAEG,gBAAAG,EAAAG,GAAA,EAAA,UAAA;AAAA,MAAC,gBAAAC,EAAAC,GAAA,EAAK,WAAU,OAAM,QAAO,cAAa,QAAO,UAAS,aAAY,YACnE,UACHR,EAAA,CAAA;AAAA,MACA,gBAAAO,EAACE,GAAU,EAAA,SAAS,IAAK,CAAA;AAAA,IAAA,GAC3B;AAAA,IAEDR,KACE,gBAAAE,EAAAO,GAAA,EAAS,iBAAgB,UAAS,aAAY,UAC5C,UAAA;AAAA,MAAAT;AAAA,MACD,gBAAAM,EAACE,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,IAAA,GACzB;AAAA,IAEDP,uBACEQ,GACC,EAAA,UAAA;AAAA,MAAC,gBAAAH,EAAAE,GAAA,EAAU,SAAS,EAAG,CAAA;AAAA,MACvB,gBAAAF,EAACI,KAAgB,KAAKC,EAAO,eAAe,QAAQ,IAAI,OAAO,IAAI;AAAA,IAAA,GACrE;AAAA,EAAA,GAEJ;AACF,EAAA,CAAA;"}