@cuemath/leap 3.0.11-j → 3.0.11-j2

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

@@ -1,81 +1,81 @@
 import { jsx as i, jsxs as K } from "react/jsx-runtime";
-import { useState as x, useRef as w, useCallback as g, useMemo as C, useEffect as v } from "react";
-import { useTheme as y } from "styled-components";
-import A from "../../../ui/layout/flex-view.js";
-import H from "./country-selector/country-selector.js";
-import { CustomInput as L } from "./custom-input-field-styled.js";
-import { InputWrapper as M } from "./input-wrapper/input-wrapper.js";
-import N from "./password-toggle/password-toggle.js";
-const X = ({
+import { memo as v, useState as x, useRef as w, useCallback as g, useMemo as C, useEffect as y } from "react";
+import { useTheme as A } from "styled-components";
+import H from "../../../ui/layout/flex-view.js";
+import L from "./country-selector/country-selector.js";
+import { CustomInput as M } from "./custom-input-field-styled.js";
+import N from "./input-wrapper/input-wrapper.js";
+import X from "./password-toggle/password-toggle.js";
+const _ = ({
   value: o,
   onChange: I,
   error: c,
   helperText: T,
   onEnter: n,
   isLoading: W,
-  isValid: a,
+  isValid: m,
   type: e = "text",
-  placeholder: $,
-  actionElement: b,
-  maxLength: F,
-  width: R,
+  placeholder: b,
+  actionElement: F,
+  maxLength: R,
+  width: $,
   textTransform: D,
   textAlign: P = "center",
   selectedCountry: S,
   onCountryChange: V,
-  autoSize: m = !1
+  autoSize: a = !1
 }) => {
-  const r = y(), [u, j] = x(!1), [k, p] = x(32), l = w(null), f = w(null), z = g(
+  const r = A(), [u, j] = x(!1), [k, p] = x(32), l = w(null), f = w(null), z = g(
     (t) => {
       t.key === "Enter" && (n == null || n());
     },
     [n]
-  ), E = C(() => e === "password" ? u ? "text" : "password" : e === "phone" ? "number" : e, [e, u]), G = C(() => c ? r.colors.RED : a ? r.colors.GREEN_4 : r.colors.WHITE, [c, a, r.colors]), d = g((t, h) => {
+  ), E = C(() => e === "password" ? u ? "text" : "password" : e === "phone" ? "number" : e, [e, u]), G = C(() => c ? r.colors.RED : m ? r.colors.GREEN_4 : r.colors.WHITE, [c, m, r.colors]), d = g((t, h) => {
     f.current || (f.current = document.createElement("canvas"));
     const s = f.current.getContext("2d");
     return s ? (s.font = h, s.measureText(t).width) : 0;
   }, []);
-  return v(() => {
-    if (!l.current || !o || !m)
+  return y(() => {
+    if (!l.current || !o || !a)
       return;
     const t = l.current.clientWidth;
     d(o, "32px 'Athletics-Light'") > t ? p(24) : p(32);
-  }, [o, d, m]), /* @__PURE__ */ i(
-    M,
+  }, [o, d, a]), /* @__PURE__ */ i(
+    N,
     {
       helperText: c || T,
       isLoading: W,
-      actionElement: b,
+      actionElement: F,
       children: /* @__PURE__ */ K(
-        A,
+        H,
         {
-          $width: R ?? "100%",
+          $width: $ ?? "100%",
           $flex: 1,
           $alignItems: "center",
           $flexDirection: "row",
           $flexGapX: 0.5,
           children: [
-            e === "phone" && /* @__PURE__ */ i(H, { onChange: V, value: S }),
+            e === "phone" && /* @__PURE__ */ i(L, { onChange: V, value: S }),
             /* @__PURE__ */ i(
-              L,
+              M,
               {
                 ref: l,
                 value: o,
                 onChange: (t) => I(t.target.value),
                 autoFocus: !0,
-                placeholder: $,
+                placeholder: b,
                 color: G,
                 autoCapitalize: "none",
                 textTransform: D,
                 type: E,
                 onKeyDown: z,
-                maxLength: F,
+                maxLength: R,
                 align: P,
                 fontSize: k
               }
             ),
             e === "password" && /* @__PURE__ */ i(
-              N,
+              X,
               {
                 isVisible: u,
                 onToggle: () => j((t) => !t)
@@ -86,8 +86,8 @@ const X = ({
       )
     }
   );
-}, Z = X;
+}, tt = v(_);
 export {
-  Z as default
+  tt as default
 };
 //# sourceMappingURL=custom-input-field.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"custom-input-field.js","sources":["../../../../../src/features/auth/signup/custom-input-field/custom-input-field.tsx"],"sourcesContent":["import type { ICustomInputFieldProps } from './custom-input-field-types';\n\nimport {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type FC,\n  type KeyboardEvent,\n} from 'react';\nimport { useTheme } from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\nimport PhoneCountrySelector from './country-selector/country-selector';\nimport * as Styled from './custom-input-field-styled';\nimport { InputWrapper } from './input-wrapper/input-wrapper';\nimport PasswordToggleIcon from './password-toggle/password-toggle';\n\nconst CustomInputField: FC<ICustomInputFieldProps> = ({\n  value,\n  onChange,\n  error,\n  helperText,\n  onEnter,\n  isLoading,\n  isValid,\n  type = 'text',\n  placeholder,\n  actionElement,\n  maxLength,\n  width,\n  textTransform,\n  textAlign = 'center',\n  selectedCountry,\n  onCountryChange,\n  autoSize = false,\n}) => {\n  const theme = useTheme();\n  const [isPasswordVisible, setIsPasswordVisible] = useState(false);\n  const [fontSize, setFontSize] = useState(32);\n  const inputRef = useRef<HTMLInputElement>(null);\n  const canvasRef = useRef<HTMLCanvasElement | null>(null);\n\n  const handleKeyDown = useCallback(\n    (event: KeyboardEvent<HTMLInputElement>) => {\n      if (event.key === 'Enter') {\n        onEnter?.();\n      }\n    },\n    [onEnter],\n  );\n\n  const inputType = useMemo(() => {\n    if (type === 'password') return isPasswordVisible ? 'text' : 'password';\n\n    if (type === 'phone') return 'number';\n\n    return type;\n  }, [type, isPasswordVisible]);\n\n  const inputColor = useMemo(() => {\n    if (error) return theme.colors.RED;\n\n    if (isValid) return theme.colors.GREEN_4;\n\n    return theme.colors.WHITE;\n  }, [error, isValid, theme.colors]);\n\n  const measureTextWidth = useCallback((text: string, font: string): number => {\n    if (!canvasRef.current) {\n      canvasRef.current = document.createElement('canvas');\n    }\n\n    const context = canvasRef.current.getContext('2d');\n\n    if (!context) return 0;\n\n    context.font = font;\n\n    return context.measureText(text).width;\n  }, []);\n\n  useEffect(() => {\n    if (!inputRef.current || !value || !autoSize) {\n      return;\n    }\n\n    const inputWidth = inputRef.current.clientWidth;\n\n    const font32 = \"32px 'Athletics-Light'\";\n\n    const textWidth32 = measureTextWidth(value, font32);\n\n    if (textWidth32 > inputWidth) {\n      setFontSize(24);\n    } else {\n      setFontSize(32);\n    }\n  }, [value, measureTextWidth, autoSize]);\n\n  return (\n    <InputWrapper\n      helperText={error || helperText}\n      isLoading={isLoading}\n      actionElement={actionElement}\n    >\n      <FlexView\n        $width={width ?? '100%'}\n        $flex={1}\n        $alignItems=\"center\"\n        $flexDirection=\"row\"\n        $flexGapX={0.5}\n      >\n        {type === 'phone' && (\n          <PhoneCountrySelector onChange={onCountryChange} value={selectedCountry} />\n        )}\n        <Styled.CustomInput\n          ref={inputRef}\n          value={value}\n          onChange={event => onChange(event.target.value)}\n          autoFocus\n          placeholder={placeholder}\n          color={inputColor}\n          autoCapitalize=\"none\"\n          textTransform={textTransform}\n          type={inputType}\n          onKeyDown={handleKeyDown}\n          maxLength={maxLength}\n          align={textAlign}\n          fontSize={fontSize}\n        />\n        {type === 'password' && (\n          <PasswordToggleIcon\n            isVisible={isPasswordVisible}\n            onToggle={() => setIsPasswordVisible(prev => !prev)}\n          />\n        )}\n      </FlexView>\n    </InputWrapper>\n  );\n};\n\nexport default CustomInputField;\n"],"names":["CustomInputField","value","onChange","error","helperText","onEnter","isLoading","isValid","type","placeholder","actionElement","maxLength","width","textTransform","textAlign","selectedCountry","onCountryChange","autoSize","theme","useTheme","isPasswordVisible","setIsPasswordVisible","useState","fontSize","setFontSize","inputRef","useRef","canvasRef","handleKeyDown","useCallback","event","inputType","useMemo","inputColor","measureTextWidth","text","font","context","useEffect","inputWidth","jsx","InputWrapper","jsxs","FlexView","PhoneCountrySelector","Styled.CustomInput","PasswordToggleIcon","prev","CustomInputField$1"],"mappings":"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"}
+{"version":3,"file":"custom-input-field.js","sources":["../../../../../src/features/auth/signup/custom-input-field/custom-input-field.tsx"],"sourcesContent":["import type { ICustomInputFieldProps } from './custom-input-field-types';\n\nimport {\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  memo,\n  type FC,\n  type KeyboardEvent,\n} from 'react';\nimport { useTheme } from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\nimport PhoneCountrySelector from './country-selector/country-selector';\nimport * as Styled from './custom-input-field-styled';\nimport InputWrapper from './input-wrapper/input-wrapper';\nimport PasswordToggleIcon from './password-toggle/password-toggle';\n\nconst CustomInputField: FC<ICustomInputFieldProps> = ({\n  value,\n  onChange,\n  error,\n  helperText,\n  onEnter,\n  isLoading,\n  isValid,\n  type = 'text',\n  placeholder,\n  actionElement,\n  maxLength,\n  width,\n  textTransform,\n  textAlign = 'center',\n  selectedCountry,\n  onCountryChange,\n  autoSize = false,\n}) => {\n  const theme = useTheme();\n  const [isPasswordVisible, setIsPasswordVisible] = useState(false);\n  const [fontSize, setFontSize] = useState(32);\n  const inputRef = useRef<HTMLInputElement>(null);\n  const canvasRef = useRef<HTMLCanvasElement | null>(null);\n\n  const handleKeyDown = useCallback(\n    (event: KeyboardEvent<HTMLInputElement>) => {\n      if (event.key === 'Enter') {\n        onEnter?.();\n      }\n    },\n    [onEnter],\n  );\n\n  const inputType = useMemo(() => {\n    if (type === 'password') return isPasswordVisible ? 'text' : 'password';\n\n    if (type === 'phone') return 'number';\n\n    return type;\n  }, [type, isPasswordVisible]);\n\n  const inputColor = useMemo(() => {\n    if (error) return theme.colors.RED;\n\n    if (isValid) return theme.colors.GREEN_4;\n\n    return theme.colors.WHITE;\n  }, [error, isValid, theme.colors]);\n\n  const measureTextWidth = useCallback((text: string, font: string): number => {\n    if (!canvasRef.current) {\n      canvasRef.current = document.createElement('canvas');\n    }\n\n    const context = canvasRef.current.getContext('2d');\n\n    if (!context) return 0;\n\n    context.font = font;\n\n    return context.measureText(text).width;\n  }, []);\n\n  useEffect(() => {\n    if (!inputRef.current || !value || !autoSize) {\n      return;\n    }\n\n    const inputWidth = inputRef.current.clientWidth;\n\n    const font32 = \"32px 'Athletics-Light'\";\n\n    const textWidth32 = measureTextWidth(value, font32);\n\n    if (textWidth32 > inputWidth) {\n      setFontSize(24);\n    } else {\n      setFontSize(32);\n    }\n  }, [value, measureTextWidth, autoSize]);\n\n  return (\n    <InputWrapper\n      helperText={error || helperText}\n      isLoading={isLoading}\n      actionElement={actionElement}\n    >\n      <FlexView\n        $width={width ?? '100%'}\n        $flex={1}\n        $alignItems=\"center\"\n        $flexDirection=\"row\"\n        $flexGapX={0.5}\n      >\n        {type === 'phone' && (\n          <PhoneCountrySelector onChange={onCountryChange} value={selectedCountry} />\n        )}\n        <Styled.CustomInput\n          ref={inputRef}\n          value={value}\n          onChange={event => onChange(event.target.value)}\n          autoFocus\n          placeholder={placeholder}\n          color={inputColor}\n          autoCapitalize=\"none\"\n          textTransform={textTransform}\n          type={inputType}\n          onKeyDown={handleKeyDown}\n          maxLength={maxLength}\n          align={textAlign}\n          fontSize={fontSize}\n        />\n        {type === 'password' && (\n          <PasswordToggleIcon\n            isVisible={isPasswordVisible}\n            onToggle={() => setIsPasswordVisible(prev => !prev)}\n          />\n        )}\n      </FlexView>\n    </InputWrapper>\n  );\n};\n\nexport default memo(CustomInputField);\n"],"names":["CustomInputField","value","onChange","error","helperText","onEnter","isLoading","isValid","type","placeholder","actionElement","maxLength","width","textTransform","textAlign","selectedCountry","onCountryChange","autoSize","theme","useTheme","isPasswordVisible","setIsPasswordVisible","useState","fontSize","setFontSize","inputRef","useRef","canvasRef","handleKeyDown","useCallback","event","inputType","useMemo","inputColor","measureTextWidth","text","font","context","useEffect","inputWidth","jsx","InputWrapper","jsxs","FlexView","PhoneCountrySelector","Styled.CustomInput","PasswordToggleIcon","prev","customInputField","memo"],"mappings":"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"}

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"date-picker-input.js","sources":["../../../../../../src/features/auth/signup/custom-input-field/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';\nimport { useTheme } from 'styled-components';\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  const theme = useTheme();\n\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={theme.colors[prevYearButtonDisabled ? 'WHITE_T_10' : '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={theme.colors[nextYearButtonDisabled ? 'WHITE_T_10' : 'WHITE']} />\n              </Clickable>\n            </FlexView>\n          )}\n        />\n      </Styled.StyledDatePickerWrapper>\n    </InputWrapper>\n  );\n};\n\nexport default DatePickerInput;\n"],"names":["DatePickerInput","value","onChange","error","theme","useTheme","InputWrapper","jsx","Styled.StyledDatePickerWrapper","DatePicker","date","subYears","decreaseYear","increaseYear","prevYearButtonDisabled","nextYearButtonDisabled","FlexView","Clickable","LeftIcon","Text","RightIcon","DatePickerInput$1"],"mappings":";;;;;;;;;;;AAeA,MAAMA,IAA6C,CAAC,EAAE,OAAAC,GAAO,UAAAC,GAAU,OAAAC,QAAY;AACjF,QAAMC,IAAQC;AAEd,2BACGC,GAAa,EAAA,YAAYH,GACxB,UAAC,gBAAAI,EAAAC,GAAA,EACC,UAAA,gBAAAD;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,UAAUR;AAAA,MACV,qBAAmB;AAAA,MACnB,iBAAiB;AAAA,MACjB,YAAW;AAAA,MACX,iBAAgB;AAAA,MAChB,UAAU,CAAQS,MAAAR,EAASQ,CAAI;AAAA,MAC/B,SAASC,EAAa,oBAAA,KAAA,GAAQ,EAAE;AAAA,MAChC,SAASA,EAAa,oBAAA,KAAA,GAAQ,CAAC;AAAA,MAC/B,oBAAoB,CAAC;AAAA,QACnB,MAAAD;AAAA,QACA,cAAAE;AAAA,QACA,cAAAC;AAAA,QACA,wBAAAC;AAAA,QACA,wBAAAC;AAAA,MAAA,wBAECC,GAAS,EAAA,aAAY,UAAS,gBAAe,OAAM,iBAAgB,iBAClE,UAAA;AAAA,QAAA,gBAAAT;AAAA,UAACU;AAAA,UAAA;AAAA,YACC,SAASL;AAAA,YACT,OAAM;AAAA,YACN,UAAUE;AAAA,YAEV,UAAA,gBAAAP,EAACW,KAAS,OAAOd,EAAM,OAAOU,IAAyB,eAAe,OAAO,GAAG;AAAA,UAAA;AAAA,QAClF;AAAA,QACA,gBAAAP,EAACY,KAAK,WAAU,YAAW,QAAO,SAC/B,UAAAT,EAAK,eACR;AAAA,QACA,gBAAAH;AAAA,UAACU;AAAA,UAAA;AAAA,YACC,SAASJ;AAAA,YACT,OAAM;AAAA,YACN,UAAUE;AAAA,YAEV,UAAA,gBAAAR,EAACa,KAAU,OAAOhB,EAAM,OAAOW,IAAyB,eAAe,OAAO,GAAG;AAAA,UAAA;AAAA,QACnF;AAAA,MAAA,GACF;AAAA,IAAA;AAAA,EAAA,EAGN,CAAA,EACF,CAAA;AAEJ,GAEAM,IAAerB;"}
+{"version":3,"file":"date-picker-input.js","sources":["../../../../../../src/features/auth/signup/custom-input-field/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, memo } from 'react';\nimport DatePicker from 'react-datepicker';\nimport { useTheme } from 'styled-components';\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  const theme = useTheme();\n\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={theme.colors[prevYearButtonDisabled ? 'WHITE_T_10' : '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={theme.colors[nextYearButtonDisabled ? 'WHITE_T_10' : 'WHITE']} />\n              </Clickable>\n            </FlexView>\n          )}\n        />\n      </Styled.StyledDatePickerWrapper>\n    </InputWrapper>\n  );\n};\n\nexport default memo(DatePickerInput);\n"],"names":["DatePickerInput","value","onChange","error","theme","useTheme","InputWrapper","jsx","Styled.StyledDatePickerWrapper","DatePicker","date","subYears","decreaseYear","increaseYear","prevYearButtonDisabled","nextYearButtonDisabled","FlexView","Clickable","LeftIcon","Text","RightIcon","datePickerInput","memo"],"mappings":";;;;;;;;;;;;AAeA,MAAMA,IAA6C,CAAC,EAAE,OAAAC,GAAO,UAAAC,GAAU,OAAAC,QAAY;AACjF,QAAMC,IAAQC;AAEd,2BACGC,GAAa,EAAA,YAAYH,GACxB,UAAC,gBAAAI,EAAAC,GAAA,EACC,UAAA,gBAAAD;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,UAAUR;AAAA,MACV,qBAAmB;AAAA,MACnB,iBAAiB;AAAA,MACjB,YAAW;AAAA,MACX,iBAAgB;AAAA,MAChB,UAAU,CAAQS,MAAAR,EAASQ,CAAI;AAAA,MAC/B,SAASC,EAAa,oBAAA,KAAA,GAAQ,EAAE;AAAA,MAChC,SAASA,EAAa,oBAAA,KAAA,GAAQ,CAAC;AAAA,MAC/B,oBAAoB,CAAC;AAAA,QACnB,MAAAD;AAAA,QACA,cAAAE;AAAA,QACA,cAAAC;AAAA,QACA,wBAAAC;AAAA,QACA,wBAAAC;AAAA,MAAA,wBAECC,GAAS,EAAA,aAAY,UAAS,gBAAe,OAAM,iBAAgB,iBAClE,UAAA;AAAA,QAAA,gBAAAT;AAAA,UAACU;AAAA,UAAA;AAAA,YACC,SAASL;AAAA,YACT,OAAM;AAAA,YACN,UAAUE;AAAA,YAEV,UAAA,gBAAAP,EAACW,KAAS,OAAOd,EAAM,OAAOU,IAAyB,eAAe,OAAO,GAAG;AAAA,UAAA;AAAA,QAClF;AAAA,QACA,gBAAAP,EAACY,KAAK,WAAU,YAAW,QAAO,SAC/B,UAAAT,EAAK,eACR;AAAA,QACA,gBAAAH;AAAA,UAACU;AAAA,UAAA;AAAA,YACC,SAASJ;AAAA,YACT,OAAM;AAAA,YACN,UAAUE;AAAA,YAEV,UAAA,gBAAAR,EAACa,KAAU,OAAOhB,EAAM,OAAOW,IAAyB,eAAe,OAAO,GAAG;AAAA,UAAA;AAAA,QACnF;AAAA,MAAA,GACF;AAAA,IAAA;AAAA,EAAA,EAGN,CAAA,EACF,CAAA;AAEJ,GAEeM,IAAAC,EAAKtB,CAAe;"}

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

@@ -1,15 +1,16 @@
 import { jsx as r } from "react/jsx-runtime";
-import a from "../../../../ui/text/text.js";
-import { STUDENT_GRADE_OPTIONS as c } from "../../signup-constants.js";
-import { InputWrapper as p } from "../input-wrapper/input-wrapper.js";
+import { memo as m } from "react";
+import p from "../../../../ui/text/text.js";
+import { STUDENT_GRADE_OPTIONS as a } from "../../signup-constants.js";
+import 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(p, { helperText: i, children: /* @__PURE__ */ r($, { $flexDirection: "row", $flexWrap: !0, $flexGapX: 1, children: [...c].map(({ label: o, value: e }) => {
+const s = ({ value: n, onChange: o, error: i }) => /* @__PURE__ */ r(c, { helperText: i, children: /* @__PURE__ */ r($, { $flexDirection: "row", $flexWrap: !0, $flexGapX: 1, children: [...a].map(({ label: d, value: e }) => {
   const t = e === n;
   return /* @__PURE__ */ r(
     l,
     {
       selected: t,
-      onClick: () => d(e),
+      onClick: () => o(e),
       $borderRadius: 48,
       $gutter: 13,
       $gap: 6,
@@ -19,12 +20,12 @@ const m = ({ value: n, onChange: d, error: i }) => /* @__PURE__ */ r(p, { helper
       $borderColor: t ? "WHITE" : "BLACK_5",
       $width: e === "-1" ? 96 : 40,
       $height: 40,
-      children: /* @__PURE__ */ r(a, { $align: "center", $renderAs: "ab1", children: o })
+      children: /* @__PURE__ */ r(p, { $align: "center", $renderAs: "ab1", children: d })
     },
     e
   );
-}) }) }), x = m;
+}) }) }), T = m(s);
 export {
-  x as default
+  T as default
 };
 //# sourceMappingURL=grade-input.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"grade-input.js","sources":["../../../../../../src/features/auth/signup/custom-input-field/grade-input/grade-input.tsx"],"sourcesContent":["import type { ICustomInputFieldProps } from '../custom-input-field-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<ICustomInputFieldProps> = ({ 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 === '-1' ? 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,IAAyC,CAAC,EAAE,OAAAC,GAAO,UAAAC,GAAU,OAAAC,QAE/D,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,OAAO,KAAK;AAAA,MAClC,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;"}
+{"version":3,"file":"grade-input.js","sources":["../../../../../../src/features/auth/signup/custom-input-field/grade-input/grade-input.tsx"],"sourcesContent":["import type { ICustomInputFieldProps } from '../custom-input-field-types';\n\nimport { memo, 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<ICustomInputFieldProps> = ({ 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 === '-1' ? 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 memo(GradeInput);\n"],"names":["GradeInput","value","onChange","error","jsx","InputWrapper","Styled.GradeListWrapper","STUDENT_GRADE_OPTIONS","label","optionVal","isSelected","Styled.GradeItem","Text","gradeInput","memo"],"mappings":";;;;;;AASA,MAAMA,IAAyC,CAAC,EAAE,OAAAC,GAAO,UAAAC,GAAU,OAAAC,QAE/D,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,OAAO,KAAK;AAAA,MAClC,SAAS;AAAA,MAET,4BAACG,GAAK,EAAA,QAAO,UAAS,WAAU,OAC7B,UACHJ,GAAA;AAAA,IAAA;AAAA,IAfKC;AAAA,EAAA;AAgBP,CAEH,GACH,EACF,CAAA,GAIWI,IAAAC,EAAKd,CAAU;"}

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"input-wrapper.js","sources":["../../../../../../src/features/auth/signup/custom-input-field/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  isLoading,\n}: IInputWrapperProps) => {\n  return (\n    <FlexView $flex={1} $gutterX={2} $alignItems=\"center\" $justifyContent=\"center\" $width=\"100%\">\n      {children}\n      <Styled.ContentWrapper $alignItems=\"center\" $justifyContent=\"center\">\n        {helperText && (\n          <FlexView $gutterX={3.5}>\n            <Text $renderAs=\"ub2\" $color=\"WHITE_T_60\" $align=\"center\" $whiteSpace=\"pre-line\">\n              {helperText}\n            </Text>\n            <Separator heightX={0.5} />\n          </FlexView>\n        )}\n        {actionElement && (\n          <FlexView $justifyContent=\"center\" $alignItems=\"center\">\n            {actionElement}\n            <Separator heightX={1} />\n          </FlexView>\n        )}\n        {isLoading && (\n          <FlexView>\n            <Separator heightX={2} />\n            <LottieAnimation src={LOTTIE.SPINNER_WHITE} height={20} width={40} />\n          </FlexView>\n        )}\n      </Styled.ContentWrapper>\n    </FlexView>\n  );\n};\n"],"names":["InputWrapper","children","helperText","actionElement","isLoading","jsxs","FlexView","Styled.ContentWrapper","jsx","Text","Separator","LottieAnimation","LOTTIE"],"mappings":";;;;;;;AASO,MAAMA,IAAe,CAAC;AAAA,EAC3B,UAAAC;AAAA,EACA,YAAAC;AAAA,EACA,eAAAC;AAAA,EACA,WAAAC;AACF,MAEI,gBAAAC,EAACC,GAAS,EAAA,OAAO,GAAG,UAAU,GAAG,aAAY,UAAS,iBAAgB,UAAS,QAAO,QACnF,UAAA;AAAA,EAAAL;AAAA,oBACAM,GAAA,EAAsB,aAAY,UAAS,iBAAgB,UACzD,UAAA;AAAA,IACCL,KAAA,gBAAAG,EAACC,GAAS,EAAA,UAAU,KAClB,UAAA;AAAA,MAAC,gBAAAE,EAAAC,GAAA,EAAK,WAAU,OAAM,QAAO,cAAa,QAAO,UAAS,aAAY,YACnE,UACHP,EAAA,CAAA;AAAA,MACA,gBAAAM,EAACE,GAAU,EAAA,SAAS,IAAK,CAAA;AAAA,IAAA,GAC3B;AAAA,IAEDP,KACE,gBAAAE,EAAAC,GAAA,EAAS,iBAAgB,UAAS,aAAY,UAC5C,UAAA;AAAA,MAAAH;AAAA,MACD,gBAAAK,EAACE,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,IAAA,GACzB;AAAA,IAEDN,uBACEE,GACC,EAAA,UAAA;AAAA,MAAC,gBAAAE,EAAAE,GAAA,EAAU,SAAS,EAAG,CAAA;AAAA,MACvB,gBAAAF,EAACG,KAAgB,KAAKC,EAAO,eAAe,QAAQ,IAAI,OAAO,IAAI;AAAA,IAAA,GACrE;AAAA,EAAA,GAEJ;AACF,EAAA,CAAA;"}
+{"version":3,"file":"input-wrapper.js","sources":["../../../../../../src/features/auth/signup/custom-input-field/input-wrapper/input-wrapper.tsx"],"sourcesContent":["import type { IInputWrapperProps } from './input-wrapper-types';\n\nimport { memo } from 'react';\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\nconst InputWrapper = ({ children, helperText, actionElement, isLoading }: IInputWrapperProps) => {\n  return (\n    <FlexView $flex={1} $gutterX={2} $alignItems=\"center\" $justifyContent=\"center\" $width=\"100%\">\n      {children}\n      <Styled.ContentWrapper $alignItems=\"center\" $justifyContent=\"center\">\n        {helperText && (\n          <FlexView $gutterX={3.5}>\n            <Text $renderAs=\"ub2\" $color=\"WHITE_T_60\" $align=\"center\" $whiteSpace=\"pre-line\">\n              {helperText}\n            </Text>\n            <Separator heightX={0.5} />\n          </FlexView>\n        )}\n        {actionElement && (\n          <FlexView $justifyContent=\"center\" $alignItems=\"center\">\n            {actionElement}\n            <Separator heightX={1} />\n          </FlexView>\n        )}\n        {isLoading && (\n          <FlexView>\n            <Separator heightX={2} />\n            <LottieAnimation src={LOTTIE.SPINNER_WHITE} height={20} width={40} />\n          </FlexView>\n        )}\n      </Styled.ContentWrapper>\n    </FlexView>\n  );\n};\n\nexport default memo(InputWrapper);\n"],"names":["InputWrapper","children","helperText","actionElement","isLoading","jsxs","FlexView","Styled.ContentWrapper","jsx","Text","Separator","LottieAnimation","LOTTIE","InputWrapper$1","memo"],"mappings":";;;;;;;;AAWA,MAAMA,IAAe,CAAC,EAAE,UAAAC,GAAU,YAAAC,GAAY,eAAAC,GAAe,WAAAC,QAEzD,gBAAAC,EAACC,GAAS,EAAA,OAAO,GAAG,UAAU,GAAG,aAAY,UAAS,iBAAgB,UAAS,QAAO,QACnF,UAAA;AAAA,EAAAL;AAAA,oBACAM,GAAA,EAAsB,aAAY,UAAS,iBAAgB,UACzD,UAAA;AAAA,IACCL,KAAA,gBAAAG,EAACC,GAAS,EAAA,UAAU,KAClB,UAAA;AAAA,MAAC,gBAAAE,EAAAC,GAAA,EAAK,WAAU,OAAM,QAAO,cAAa,QAAO,UAAS,aAAY,YACnE,UACHP,EAAA,CAAA;AAAA,MACA,gBAAAM,EAACE,GAAU,EAAA,SAAS,IAAK,CAAA;AAAA,IAAA,GAC3B;AAAA,IAEDP,KACE,gBAAAE,EAAAC,GAAA,EAAS,iBAAgB,UAAS,aAAY,UAC5C,UAAA;AAAA,MAAAH;AAAA,MACD,gBAAAK,EAACE,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,IAAA,GACzB;AAAA,IAEDN,uBACEE,GACC,EAAA,UAAA;AAAA,MAAC,gBAAAE,EAAAE,GAAA,EAAU,SAAS,EAAG,CAAA;AAAA,MACvB,gBAAAF,EAACG,KAAgB,KAAKC,EAAO,eAAe,QAAQ,IAAI,OAAO,IAAI;AAAA,IAAA,GACrE;AAAA,EAAA,GAEJ;AACF,EAAA,CAAA,GAIWC,IAAAC,EAAKd,CAAY;"}

package/dist/features/auth/signup/signup-methods/signup-methods.js

@@ -1,9 +1,10 @@
 import { jsxs as s, jsx as e } from "react/jsx-runtime";
-import p from "../../../../assets/line-icons/icons/apple-icon.js";
-import m from "../../../../assets/line-icons/icons/google-icon.js";
+import { memo as p } from "react";
+import m from "../../../../assets/line-icons/icons/apple-icon.js";
+import f from "../../../../assets/line-icons/icons/google-icon.js";
 import o from "../../../ui/buttons/button/button.js";
 import r from "../../../ui/layout/flex-view.js";
-const f = ({
+const g = ({
   onEmailSignup: t,
   onAppleSignup: a,
   onGoogleSignup: d,
@@ -38,7 +39,7 @@ const f = ({
       o,
       {
         renderAs: "secondary-dark",
-        Icon: m,
+        Icon: f,
         width: 232,
         label: "Signup with Google",
         onClick: d,
@@ -53,7 +54,7 @@ const f = ({
         renderAs: "secondary-dark",
         size: "small",
         width: 232,
-        Icon: p,
+        Icon: m,
         label: "Signup with Apple",
         onClick: a,
         busy: i,
@@ -61,8 +62,8 @@ const f = ({
       }
     )
   ] });
-}, k = f;
+}, y = p(g);
 export {
-  k as default
+  y as default
 };
 //# sourceMappingURL=signup-methods.js.map

package/dist/features/auth/signup/signup-methods/signup-methods.js.map

@@ -1 +1 @@
-{"version":3,"file":"signup-methods.js","sources":["../../../../../src/features/auth/signup/signup-methods/signup-methods.tsx"],"sourcesContent":["import type { ISignupMethodsProps } from './signup-methods-types';\nimport type { FC } from 'react';\n\nimport AppleIcon from '../../../../assets/line-icons/icons/apple-icon';\nimport GoogleIcon from '../../../../assets/line-icons/icons/google-icon';\nimport Button from '../../../ui/buttons/button/button';\nimport FlexView from '../../../ui/layout/flex-view';\n\nconst SignupMethods: FC<ISignupMethodsProps> = ({\n  onEmailSignup,\n  onAppleSignup,\n  onGoogleSignup,\n  onPhoneSignup,\n  loadingProvider,\n}) => {\n  const isLoadingGoogle = loadingProvider === 'google';\n  const isLoadingApple = loadingProvider === 'apple';\n\n  return (\n    <FlexView $flexGapX={1} $flex={1} $justifyContent=\"center\" $alignItems=\"center\">\n      <FlexView $flexGapX={1} $flexDirection=\"row\" $justifyContent=\"space-between\">\n        <Button\n          size=\"small\"\n          renderAs=\"secondary-dark\"\n          width={108}\n          label=\"Email\"\n          onClick={onEmailSignup}\n        />\n        <Button\n          size=\"small\"\n          renderAs=\"secondary-dark\"\n          width={108}\n          label=\"Phone\"\n          onClick={onPhoneSignup}\n        />\n      </FlexView>\n      <Button\n        renderAs=\"secondary-dark\"\n        Icon={GoogleIcon}\n        width={232}\n        label=\"Signup with Google\"\n        onClick={onGoogleSignup}\n        size=\"small\"\n        busy={isLoadingGoogle}\n        disabled={isLoadingGoogle}\n      />\n      <Button\n        renderAs=\"secondary-dark\"\n        size=\"small\"\n        width={232}\n        Icon={AppleIcon}\n        label=\"Signup with Apple\"\n        onClick={onAppleSignup}\n        busy={isLoadingApple}\n        disabled={isLoadingApple}\n      />\n    </FlexView>\n  );\n};\n\nexport default SignupMethods;\n"],"names":["SignupMethods","onEmailSignup","onAppleSignup","onGoogleSignup","onPhoneSignup","loadingProvider","isLoadingGoogle","isLoadingApple","jsxs","FlexView","jsx","Button","GoogleIcon","AppleIcon","SignupMethods$1"],"mappings":";;;;;AAQA,MAAMA,IAAyC,CAAC;AAAA,EAC9C,eAAAC;AAAA,EACA,eAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,iBAAAC;AACF,MAAM;AACJ,QAAMC,IAAkBD,MAAoB,UACtCE,IAAiBF,MAAoB;AAGzC,SAAA,gBAAAG,EAACC,KAAS,WAAW,GAAG,OAAO,GAAG,iBAAgB,UAAS,aAAY,UACrE,UAAA;AAAA,IAAA,gBAAAD,EAACC,KAAS,WAAW,GAAG,gBAAe,OAAM,iBAAgB,iBAC3D,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,UAAS;AAAA,UACT,OAAO;AAAA,UACP,OAAM;AAAA,UACN,SAASV;AAAA,QAAA;AAAA,MACX;AAAA,MACA,gBAAAS;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,UAAS;AAAA,UACT,OAAO;AAAA,UACP,OAAM;AAAA,UACN,SAASP;AAAA,QAAA;AAAA,MACX;AAAA,IAAA,GACF;AAAA,IACA,gBAAAM;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,UAAS;AAAA,QACT,MAAMC;AAAA,QACN,OAAO;AAAA,QACP,OAAM;AAAA,QACN,SAAST;AAAA,QACT,MAAK;AAAA,QACL,MAAMG;AAAA,QACN,UAAUA;AAAA,MAAA;AAAA,IACZ;AAAA,IACA,gBAAAI;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,UAAS;AAAA,QACT,MAAK;AAAA,QACL,OAAO;AAAA,QACP,MAAME;AAAA,QACN,OAAM;AAAA,QACN,SAASX;AAAA,QACT,MAAMK;AAAA,QACN,UAAUA;AAAA,MAAA;AAAA,IACZ;AAAA,EACF,EAAA,CAAA;AAEJ,GAEAO,IAAed;"}
+{"version":3,"file":"signup-methods.js","sources":["../../../../../src/features/auth/signup/signup-methods/signup-methods.tsx"],"sourcesContent":["import type { ISignupMethodsProps } from './signup-methods-types';\n\nimport { memo, type FC } from 'react';\n\nimport AppleIcon from '../../../../assets/line-icons/icons/apple-icon';\nimport GoogleIcon from '../../../../assets/line-icons/icons/google-icon';\nimport Button from '../../../ui/buttons/button/button';\nimport FlexView from '../../../ui/layout/flex-view';\n\nconst SignupMethods: FC<ISignupMethodsProps> = ({\n  onEmailSignup,\n  onAppleSignup,\n  onGoogleSignup,\n  onPhoneSignup,\n  loadingProvider,\n}) => {\n  const isLoadingGoogle = loadingProvider === 'google';\n  const isLoadingApple = loadingProvider === 'apple';\n\n  return (\n    <FlexView $flexGapX={1} $flex={1} $justifyContent=\"center\" $alignItems=\"center\">\n      <FlexView $flexGapX={1} $flexDirection=\"row\" $justifyContent=\"space-between\">\n        <Button\n          size=\"small\"\n          renderAs=\"secondary-dark\"\n          width={108}\n          label=\"Email\"\n          onClick={onEmailSignup}\n        />\n        <Button\n          size=\"small\"\n          renderAs=\"secondary-dark\"\n          width={108}\n          label=\"Phone\"\n          onClick={onPhoneSignup}\n        />\n      </FlexView>\n      <Button\n        renderAs=\"secondary-dark\"\n        Icon={GoogleIcon}\n        width={232}\n        label=\"Signup with Google\"\n        onClick={onGoogleSignup}\n        size=\"small\"\n        busy={isLoadingGoogle}\n        disabled={isLoadingGoogle}\n      />\n      <Button\n        renderAs=\"secondary-dark\"\n        size=\"small\"\n        width={232}\n        Icon={AppleIcon}\n        label=\"Signup with Apple\"\n        onClick={onAppleSignup}\n        busy={isLoadingApple}\n        disabled={isLoadingApple}\n      />\n    </FlexView>\n  );\n};\n\nexport default memo(SignupMethods);\n"],"names":["SignupMethods","onEmailSignup","onAppleSignup","onGoogleSignup","onPhoneSignup","loadingProvider","isLoadingGoogle","isLoadingApple","jsxs","FlexView","jsx","Button","GoogleIcon","AppleIcon","signupMethods","memo"],"mappings":";;;;;;AASA,MAAMA,IAAyC,CAAC;AAAA,EAC9C,eAAAC;AAAA,EACA,eAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,iBAAAC;AACF,MAAM;AACJ,QAAMC,IAAkBD,MAAoB,UACtCE,IAAiBF,MAAoB;AAGzC,SAAA,gBAAAG,EAACC,KAAS,WAAW,GAAG,OAAO,GAAG,iBAAgB,UAAS,aAAY,UACrE,UAAA;AAAA,IAAA,gBAAAD,EAACC,KAAS,WAAW,GAAG,gBAAe,OAAM,iBAAgB,iBAC3D,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,UAAS;AAAA,UACT,OAAO;AAAA,UACP,OAAM;AAAA,UACN,SAASV;AAAA,QAAA;AAAA,MACX;AAAA,MACA,gBAAAS;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,UAAS;AAAA,UACT,OAAO;AAAA,UACP,OAAM;AAAA,UACN,SAASP;AAAA,QAAA;AAAA,MACX;AAAA,IAAA,GACF;AAAA,IACA,gBAAAM;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,UAAS;AAAA,QACT,MAAMC;AAAA,QACN,OAAO;AAAA,QACP,OAAM;AAAA,QACN,SAAST;AAAA,QACT,MAAK;AAAA,QACL,MAAMG;AAAA,QACN,UAAUA;AAAA,MAAA;AAAA,IACZ;AAAA,IACA,gBAAAI;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,UAAS;AAAA,QACT,MAAK;AAAA,QACL,OAAO;AAAA,QACP,MAAME;AAAA,QACN,OAAM;AAAA,QACN,SAASX;AAAA,QACT,MAAMK;AAAA,QACN,UAAUA;AAAA,MAAA;AAAA,IACZ;AAAA,EACF,EAAA,CAAA;AAEJ,GAEeO,IAAAC,EAAKf,CAAa;"}

package/dist/features/auth/signup/user-type-selector/user-type-card/user-type-card.js

@@ -1,23 +1,23 @@
-import { jsxs as o, jsx as r } from "react/jsx-runtime";
-import { useRef as i, useMemo as l } from "react";
+import { jsxs as n, jsx as r } from "react/jsx-runtime";
+import { memo as l, useRef as i, useMemo as A } from "react";
 import { LOTTIE as e } from "../../../../../assets/lottie/lottie.js";
-import A from "../../../../ui/layout/flex-view.js";
+import h from "../../../../ui/layout/flex-view.js";
 import a from "../../../../ui/lottie-animation/lottie-animation.js";
-import h from "../../../../ui/separator/separator.js";
-import T from "../../../../ui/text/text.js";
-import { CardWrapper as g, SelectedAnimationWrapper as u } from "./user-type-card-styled.js";
+import T from "../../../../ui/separator/separator.js";
+import g from "../../../../ui/text/text.js";
+import { CardWrapper as u, SelectedAnimationWrapper as $ } from "./user-type-card-styled.js";
 const m = {
   renderer: "canvas",
   autoplay: !0,
   loop: !1
-}, I = ({ onClick: s, userType: n, isSelected: t }) => {
-  const p = i(null), c = i(null), f = l(
+}, d = ({ onClick: s, userType: o, isSelected: t }) => {
+  const p = i(null), c = i(null), f = A(
     () => ({ ...m, loop: t, autoplay: t }),
     [t]
   );
-  return /* @__PURE__ */ o(A, { $alignItems: "center", $justifyContent: "center", children: [
-    /* @__PURE__ */ o(
-      g,
+  return /* @__PURE__ */ n(h, { $alignItems: "center", $justifyContent: "center", children: [
+    /* @__PURE__ */ n(
+      u,
       {
         $widthX: 11,
         $heightX: 11,
@@ -34,12 +34,12 @@ const m = {
             {
               width: 352,
               height: 352,
-              src: n === "parent" ? e.PARENT_AVATAR : e.STUDENT_AVATAR,
+              src: o === "parent" ? e.PARENT_AVATAR : e.STUDENT_AVATAR,
               settings: f,
               ref: p
             }
           ),
-          t && /* @__PURE__ */ r(u, { children: /* @__PURE__ */ r(
+          t && /* @__PURE__ */ r($, { children: /* @__PURE__ */ r(
             a,
             {
               width: 176,
@@ -52,11 +52,11 @@ const m = {
         ]
       }
     ),
-    /* @__PURE__ */ r(h, { heightX: 1 }),
-    /* @__PURE__ */ r(T, { $renderAs: "ac3", $color: t ? "WHITE" : "WHITE_T_60", children: n })
+    /* @__PURE__ */ r(T, { heightX: 1 }),
+    /* @__PURE__ */ r(g, { $renderAs: "ac3", $color: t ? "WHITE" : "WHITE_T_60", children: o })
   ] });
-};
+}, j = l(d);
 export {
-  I as default
+  j as default
 };
 //# sourceMappingURL=user-type-card.js.map

package/dist/features/auth/signup/user-type-selector/user-type-card/user-type-card.js.map

@@ -1 +1 @@
-{"version":3,"file":"user-type-card.js","sources":["../../../../../../src/features/auth/signup/user-type-selector/user-type-card/user-type-card.tsx"],"sourcesContent":["import type { ILottieAnimationRef } from '../../../../ui/lottie-animation/types';\nimport type { IUserTypeCardProps } from './user-type-card-types';\n\nimport { useMemo, useRef, type FC } from 'react';\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 './user-type-card-styled';\n\nconst animationSettings = {\n  renderer: 'canvas',\n  autoplay: true,\n  loop: false,\n};\n\nconst UserTypeCard: FC<IUserTypeCardProps> = ({ onClick, userType, isSelected }) => {\n  const userTypeAnimationRef = useRef<ILottieAnimationRef | null>(null);\n  const selectedAnimationRef = useRef<ILottieAnimationRef | null>(null);\n\n  const avatarSettings = useMemo(\n    () => ({ ...animationSettings, loop: isSelected, autoplay: isSelected }),\n    [isSelected],\n  );\n\n  return (\n    <FlexView $alignItems=\"center\" $justifyContent=\"center\">\n      <Styled.CardWrapper\n        $widthX={11}\n        $heightX={11}\n        $gutterX={2.375}\n        $gapX={2.375}\n        $alignItems=\"center\"\n        $justifyContent=\"center\"\n        $selected={isSelected}\n        $background=\"BLACK_3\"\n        onClick={onClick}\n      >\n        <LottieAnimation\n          width={352}\n          height={352}\n          src={userType === 'parent' ? LOTTIE.PARENT_AVATAR : LOTTIE.STUDENT_AVATAR}\n          settings={avatarSettings}\n          ref={userTypeAnimationRef}\n        />\n        {isSelected && (\n          <Styled.SelectedAnimationWrapper>\n            <LottieAnimation\n              width={176}\n              height={176}\n              src={LOTTIE.AVATAR_SELECTED}\n              settings={animationSettings}\n              ref={selectedAnimationRef}\n            />\n          </Styled.SelectedAnimationWrapper>\n        )}\n      </Styled.CardWrapper>\n      <Separator heightX={1} />\n      <Text $renderAs=\"ac3\" $color={isSelected ? 'WHITE' : 'WHITE_T_60'}>\n        {userType}\n      </Text>\n    </FlexView>\n  );\n};\n\nexport default UserTypeCard;\n"],"names":["animationSettings","UserTypeCard","onClick","userType","isSelected","userTypeAnimationRef","useRef","selectedAnimationRef","avatarSettings","useMemo","jsxs","FlexView","Styled.CardWrapper","jsx","LottieAnimation","LOTTIE","Styled.SelectedAnimationWrapper","Separator","Text"],"mappings":";;;;;;;;AAYA,MAAMA,IAAoB;AAAA,EACxB,UAAU;AAAA,EACV,UAAU;AAAA,EACV,MAAM;AACR,GAEMC,IAAuC,CAAC,EAAE,SAAAC,GAAS,UAAAC,GAAU,YAAAC,QAAiB;AAC5E,QAAAC,IAAuBC,EAAmC,IAAI,GAC9DC,IAAuBD,EAAmC,IAAI,GAE9DE,IAAiBC;AAAA,IACrB,OAAO,EAAE,GAAGT,GAAmB,MAAMI,GAAY,UAAUA;IAC3D,CAACA,CAAU;AAAA,EAAA;AAGb,SACG,gBAAAM,EAAAC,GAAA,EAAS,aAAY,UAAS,iBAAgB,UAC7C,UAAA;AAAA,IAAA,gBAAAD;AAAA,MAACE;AAAAA,MAAA;AAAA,QACC,SAAS;AAAA,QACT,UAAU;AAAA,QACV,UAAU;AAAA,QACV,OAAO;AAAA,QACP,aAAY;AAAA,QACZ,iBAAgB;AAAA,QAChB,WAAWR;AAAA,QACX,aAAY;AAAA,QACZ,SAAAF;AAAA,QAEA,UAAA;AAAA,UAAA,gBAAAW;AAAA,YAACC;AAAA,YAAA;AAAA,cACC,OAAO;AAAA,cACP,QAAQ;AAAA,cACR,KAAKX,MAAa,WAAWY,EAAO,gBAAgBA,EAAO;AAAA,cAC3D,UAAUP;AAAA,cACV,KAAKH;AAAA,YAAA;AAAA,UACP;AAAA,UACCD,KACC,gBAAAS,EAACG,GAAA,EACC,UAAA,gBAAAH;AAAA,YAACC;AAAA,YAAA;AAAA,cACC,OAAO;AAAA,cACP,QAAQ;AAAA,cACR,KAAKC,EAAO;AAAA,cACZ,UAAUf;AAAA,cACV,KAAKO;AAAA,YAAA;AAAA,UAAA,GAET;AAAA,QAAA;AAAA,MAAA;AAAA,IAEJ;AAAA,IACA,gBAAAM,EAACI,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,IACvB,gBAAAJ,EAACK,KAAK,WAAU,OAAM,QAAQd,IAAa,UAAU,cAClD,UACHD,EAAA,CAAA;AAAA,EACF,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"user-type-card.js","sources":["../../../../../../src/features/auth/signup/user-type-selector/user-type-card/user-type-card.tsx"],"sourcesContent":["import type { ILottieAnimationRef } from '../../../../ui/lottie-animation/types';\nimport type { IUserTypeCardProps } from './user-type-card-types';\n\nimport { useMemo, useRef, type FC, memo } from 'react';\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 './user-type-card-styled';\n\nconst animationSettings = {\n  renderer: 'canvas',\n  autoplay: true,\n  loop: false,\n};\n\nconst UserTypeCard: FC<IUserTypeCardProps> = ({ onClick, userType, isSelected }) => {\n  const userTypeAnimationRef = useRef<ILottieAnimationRef | null>(null);\n  const selectedAnimationRef = useRef<ILottieAnimationRef | null>(null);\n\n  const avatarSettings = useMemo(\n    () => ({ ...animationSettings, loop: isSelected, autoplay: isSelected }),\n    [isSelected],\n  );\n\n  return (\n    <FlexView $alignItems=\"center\" $justifyContent=\"center\">\n      <Styled.CardWrapper\n        $widthX={11}\n        $heightX={11}\n        $gutterX={2.375}\n        $gapX={2.375}\n        $alignItems=\"center\"\n        $justifyContent=\"center\"\n        $selected={isSelected}\n        $background=\"BLACK_3\"\n        onClick={onClick}\n      >\n        <LottieAnimation\n          width={352}\n          height={352}\n          src={userType === 'parent' ? LOTTIE.PARENT_AVATAR : LOTTIE.STUDENT_AVATAR}\n          settings={avatarSettings}\n          ref={userTypeAnimationRef}\n        />\n        {isSelected && (\n          <Styled.SelectedAnimationWrapper>\n            <LottieAnimation\n              width={176}\n              height={176}\n              src={LOTTIE.AVATAR_SELECTED}\n              settings={animationSettings}\n              ref={selectedAnimationRef}\n            />\n          </Styled.SelectedAnimationWrapper>\n        )}\n      </Styled.CardWrapper>\n      <Separator heightX={1} />\n      <Text $renderAs=\"ac3\" $color={isSelected ? 'WHITE' : 'WHITE_T_60'}>\n        {userType}\n      </Text>\n    </FlexView>\n  );\n};\n\nexport default memo(UserTypeCard);\n"],"names":["animationSettings","UserTypeCard","onClick","userType","isSelected","userTypeAnimationRef","useRef","selectedAnimationRef","avatarSettings","useMemo","jsxs","FlexView","Styled.CardWrapper","jsx","LottieAnimation","LOTTIE","Styled.SelectedAnimationWrapper","Separator","Text","UserTypeCard$1","memo"],"mappings":";;;;;;;;AAYA,MAAMA,IAAoB;AAAA,EACxB,UAAU;AAAA,EACV,UAAU;AAAA,EACV,MAAM;AACR,GAEMC,IAAuC,CAAC,EAAE,SAAAC,GAAS,UAAAC,GAAU,YAAAC,QAAiB;AAC5E,QAAAC,IAAuBC,EAAmC,IAAI,GAC9DC,IAAuBD,EAAmC,IAAI,GAE9DE,IAAiBC;AAAA,IACrB,OAAO,EAAE,GAAGT,GAAmB,MAAMI,GAAY,UAAUA;IAC3D,CAACA,CAAU;AAAA,EAAA;AAGb,SACG,gBAAAM,EAAAC,GAAA,EAAS,aAAY,UAAS,iBAAgB,UAC7C,UAAA;AAAA,IAAA,gBAAAD;AAAA,MAACE;AAAAA,MAAA;AAAA,QACC,SAAS;AAAA,QACT,UAAU;AAAA,QACV,UAAU;AAAA,QACV,OAAO;AAAA,QACP,aAAY;AAAA,QACZ,iBAAgB;AAAA,QAChB,WAAWR;AAAA,QACX,aAAY;AAAA,QACZ,SAAAF;AAAA,QAEA,UAAA;AAAA,UAAA,gBAAAW;AAAA,YAACC;AAAA,YAAA;AAAA,cACC,OAAO;AAAA,cACP,QAAQ;AAAA,cACR,KAAKX,MAAa,WAAWY,EAAO,gBAAgBA,EAAO;AAAA,cAC3D,UAAUP;AAAA,cACV,KAAKH;AAAA,YAAA;AAAA,UACP;AAAA,UACCD,KACC,gBAAAS,EAACG,GAAA,EACC,UAAA,gBAAAH;AAAA,YAACC;AAAA,YAAA;AAAA,cACC,OAAO;AAAA,cACP,QAAQ;AAAA,cACR,KAAKC,EAAO;AAAA,cACZ,UAAUf;AAAA,cACV,KAAKO;AAAA,YAAA;AAAA,UAAA,GAET;AAAA,QAAA;AAAA,MAAA;AAAA,IAEJ;AAAA,IACA,gBAAAM,EAACI,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,IACvB,gBAAAJ,EAACK,KAAK,WAAU,OAAM,QAAQd,IAAa,UAAU,cAClD,UACHD,EAAA,CAAA;AAAA,EACF,EAAA,CAAA;AAEJ,GAEegB,IAAAC,EAAKnB,CAAY;"}

package/dist/features/auth/signup/user-type-selector/user-type-selector.js

@@ -70,9 +70,7 @@ const g = ({ onNext: l, onUserTypeChange: c, userType: m }) => /* @__PURE__ */ r
               "By continuing, you agree to our ",
               /* @__PURE__ */ e("br", {}),
               /* @__PURE__ */ e(t, { $inline: !0, $renderAs: "ub2-bold", $color: "WHITE_T_60", children: "Terms of Use" }),
-              " ",
-              "and",
-              " ",
+              "  and  ",
               /* @__PURE__ */ e(t, { $inline: !0, $renderAs: "ub2-bold", $color: "WHITE_T_60", children: "Privacy Policy" })
             ] })
           ]

package/dist/features/auth/signup/user-type-selector/user-type-selector.js.map

@@ -1 +1 @@
-{"version":3,"file":"user-type-selector.js","sources":["../../../../../src/features/auth/signup/user-type-selector/user-type-selector.tsx"],"sourcesContent":["import type { TAuthUserType } from '../signup-types';\nimport type { IUserTypeSelectorProps } from './user-type-selector-types';\n\nimport { memo, type FC } from 'react';\n\nimport { ILLUSTRATIONS } from '../../../../assets/illustrations/illustrations';\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 Separator from '../../../ui/separator/separator';\nimport Text from '../../../ui/text/text';\nimport { USER_TYPES } from '../signup-constants';\nimport UserTypeCard from './user-type-card/user-type-card';\nimport * as Styled from './user-type-selector-styled';\n\nconst UserTypeSelector: FC<IUserTypeSelectorProps> = ({ onNext, onUserTypeChange, userType }) => {\n  return (\n    <Styled.Container\n      $flex={1}\n      $alignItems=\"center\"\n      $justifyContent=\"center\"\n      $width=\"100%\"\n      $height=\"100%\"\n      $background=\"BLACK_1\"\n    >\n      <Styled.Logo src={ILLUSTRATIONS.CIRCLE_CUEMATH_LOGO} alt=\"Parent Signup\" withLoader={false} />\n      <FlexView\n        $flex={1}\n        $alignItems=\"center\"\n        $justifyContent=\"center\"\n        $width=\"100%\"\n        $height=\"100%\"\n      >\n        <Separator heightX={9.5} />\n        <Text $color=\"WHITE\" $renderAs=\"ab1\" $align=\"center\">\n          Ready to explore? <br />\n          First, tell us who you are.\n        </Text>\n        <Separator heightX={2.5} />\n        <FlexView\n          $alignItems=\"center\"\n          $justifyContent=\"center\"\n          $flexDirection=\"row\"\n          $flexColumnGapX={2.5}\n        >\n          {USER_TYPES.map(({ id }: { id: TAuthUserType }) => (\n            <UserTypeCard\n              userType={id}\n              isSelected={userType === id}\n              onClick={() => onUserTypeChange(id)}\n              key={id}\n            />\n          ))}\n          <Styled.NextButton>\n            <IconButton\n              Icon={Next2Icon}\n              renderAs=\"secondary\"\n              analyticsLabel=\"Next\"\n              onClick={onNext}\n            />\n          </Styled.NextButton>\n        </FlexView>\n        <Separator heightX={6} />\n        <Text $renderAs=\"ub2\" $color=\"WHITE_T_60\" $align=\"center\">\n          By continuing, you agree to our <br />\n          <Text $inline $renderAs=\"ub2-bold\" $color=\"WHITE_T_60\">\n            Terms of Use\n          </Text>{' '}\n          and{' '}\n          <Text $inline $renderAs=\"ub2-bold\" $color=\"WHITE_T_60\">\n            Privacy Policy\n          </Text>\n        </Text>\n      </FlexView>\n    </Styled.Container>\n  );\n};\n\nexport default memo(UserTypeSelector);\n"],"names":["UserTypeSelector","onNext","onUserTypeChange","userType","jsxs","Styled.Container","jsx","Styled.Logo","ILLUSTRATIONS","FlexView","Separator","Text","USER_TYPES","id","UserTypeCard","Styled.NextButton","IconButton","Next2Icon","userTypeSelector","memo"],"mappings":";;;;;;;;;;;AAeA,MAAMA,IAA+C,CAAC,EAAE,QAAAC,GAAQ,kBAAAC,GAAkB,UAAAC,QAE9E,gBAAAC;AAAA,EAACC;AAAAA,EAAA;AAAA,IACC,OAAO;AAAA,IACP,aAAY;AAAA,IACZ,iBAAgB;AAAA,IAChB,QAAO;AAAA,IACP,SAAQ;AAAA,IACR,aAAY;AAAA,IAEZ,UAAA;AAAA,MAAC,gBAAAC,EAAAC,GAAA,EAAY,KAAKC,EAAc,qBAAqB,KAAI,iBAAgB,YAAY,IAAO;AAAA,MAC5F,gBAAAJ;AAAA,QAACK;AAAA,QAAA;AAAA,UACC,OAAO;AAAA,UACP,aAAY;AAAA,UACZ,iBAAgB;AAAA,UAChB,QAAO;AAAA,UACP,SAAQ;AAAA,UAER,UAAA;AAAA,YAAC,gBAAAH,EAAAI,GAAA,EAAU,SAAS,IAAK,CAAA;AAAA,8BACxBC,GAAK,EAAA,QAAO,SAAQ,WAAU,OAAM,QAAO,UAAS,UAAA;AAAA,cAAA;AAAA,gCAChC,MAAG,EAAA;AAAA,cAAE;AAAA,YAAA,GAE1B;AAAA,YACA,gBAAAL,EAACI,GAAU,EAAA,SAAS,IAAK,CAAA;AAAA,YACzB,gBAAAN;AAAA,cAACK;AAAA,cAAA;AAAA,gBACC,aAAY;AAAA,gBACZ,iBAAgB;AAAA,gBAChB,gBAAe;AAAA,gBACf,iBAAiB;AAAA,gBAEhB,UAAA;AAAA,kBAAAG,EAAW,IAAI,CAAC,EAAE,IAAAC,EACjB,MAAA,gBAAAP;AAAA,oBAACQ;AAAA,oBAAA;AAAA,sBACC,UAAUD;AAAA,sBACV,YAAYV,MAAaU;AAAA,sBACzB,SAAS,MAAMX,EAAiBW,CAAE;AAAA,oBAAA;AAAA,oBAC7BA;AAAA,kBAAA,CAER;AAAA,kBACD,gBAAAP,EAACS,GAAA,EACC,UAAA,gBAAAT;AAAA,oBAACU;AAAA,oBAAA;AAAA,sBACC,MAAMC;AAAA,sBACN,UAAS;AAAA,sBACT,gBAAe;AAAA,sBACf,SAAShB;AAAA,oBAAA;AAAA,kBAAA,GAEb;AAAA,gBAAA;AAAA,cAAA;AAAA,YACF;AAAA,YACA,gBAAAK,EAACI,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,8BACtBC,GAAK,EAAA,WAAU,OAAM,QAAO,cAAa,QAAO,UAAS,UAAA;AAAA,cAAA;AAAA,gCACvB,MAAG,EAAA;AAAA,cACpC,gBAAAL,EAACK,KAAK,SAAO,IAAC,WAAU,YAAW,QAAO,cAAa,UAEvD,eAAA,CAAA;AAAA,cAAQ;AAAA,cAAI;AAAA,cACR;AAAA,cACJ,gBAAAL,EAACK,KAAK,SAAO,IAAC,WAAU,YAAW,QAAO,cAAa,UAEvD,iBAAA,CAAA;AAAA,YAAA,GACF;AAAA,UAAA;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAAA,GAKSO,IAAAC,EAAKnB,CAAgB;"}
+{"version":3,"file":"user-type-selector.js","sources":["../../../../../src/features/auth/signup/user-type-selector/user-type-selector.tsx"],"sourcesContent":["import type { TAuthUserType } from '../signup-types';\nimport type { IUserTypeSelectorProps } from './user-type-selector-types';\n\nimport { memo, type FC } from 'react';\n\nimport { ILLUSTRATIONS } from '../../../../assets/illustrations/illustrations';\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 Separator from '../../../ui/separator/separator';\nimport Text from '../../../ui/text/text';\nimport { USER_TYPES } from '../signup-constants';\nimport UserTypeCard from './user-type-card/user-type-card';\nimport * as Styled from './user-type-selector-styled';\n\nconst UserTypeSelector: FC<IUserTypeSelectorProps> = ({ onNext, onUserTypeChange, userType }) => {\n  return (\n    <Styled.Container\n      $flex={1}\n      $alignItems=\"center\"\n      $justifyContent=\"center\"\n      $width=\"100%\"\n      $height=\"100%\"\n      $background=\"BLACK_1\"\n    >\n      <Styled.Logo src={ILLUSTRATIONS.CIRCLE_CUEMATH_LOGO} alt=\"Parent Signup\" withLoader={false} />\n      <FlexView\n        $flex={1}\n        $alignItems=\"center\"\n        $justifyContent=\"center\"\n        $width=\"100%\"\n        $height=\"100%\"\n      >\n        <Separator heightX={9.5} />\n        <Text $color=\"WHITE\" $renderAs=\"ab1\" $align=\"center\">\n          Ready to explore? <br />\n          First, tell us who you are.\n        </Text>\n        <Separator heightX={2.5} />\n        <FlexView\n          $alignItems=\"center\"\n          $justifyContent=\"center\"\n          $flexDirection=\"row\"\n          $flexColumnGapX={2.5}\n        >\n          {USER_TYPES.map(({ id }: { id: TAuthUserType }) => (\n            <UserTypeCard\n              userType={id}\n              isSelected={userType === id}\n              onClick={() => onUserTypeChange(id)}\n              key={id}\n            />\n          ))}\n          <Styled.NextButton>\n            <IconButton\n              Icon={Next2Icon}\n              renderAs=\"secondary\"\n              analyticsLabel=\"Next\"\n              onClick={onNext}\n            />\n          </Styled.NextButton>\n        </FlexView>\n        <Separator heightX={6} />\n        <Text $renderAs=\"ub2\" $color=\"WHITE_T_60\" $align=\"center\">\n          By continuing, you agree to our <br />\n          <Text $inline $renderAs=\"ub2-bold\" $color=\"WHITE_T_60\">\n            Terms of Use\n          </Text>\n          &nbsp; and &nbsp;\n          <Text $inline $renderAs=\"ub2-bold\" $color=\"WHITE_T_60\">\n            Privacy Policy\n          </Text>\n        </Text>\n      </FlexView>\n    </Styled.Container>\n  );\n};\n\nexport default memo(UserTypeSelector);\n"],"names":["UserTypeSelector","onNext","onUserTypeChange","userType","jsxs","Styled.Container","jsx","Styled.Logo","ILLUSTRATIONS","FlexView","Separator","Text","USER_TYPES","id","UserTypeCard","Styled.NextButton","IconButton","Next2Icon","userTypeSelector","memo"],"mappings":";;;;;;;;;;;AAeA,MAAMA,IAA+C,CAAC,EAAE,QAAAC,GAAQ,kBAAAC,GAAkB,UAAAC,QAE9E,gBAAAC;AAAA,EAACC;AAAAA,EAAA;AAAA,IACC,OAAO;AAAA,IACP,aAAY;AAAA,IACZ,iBAAgB;AAAA,IAChB,QAAO;AAAA,IACP,SAAQ;AAAA,IACR,aAAY;AAAA,IAEZ,UAAA;AAAA,MAAC,gBAAAC,EAAAC,GAAA,EAAY,KAAKC,EAAc,qBAAqB,KAAI,iBAAgB,YAAY,IAAO;AAAA,MAC5F,gBAAAJ;AAAA,QAACK;AAAA,QAAA;AAAA,UACC,OAAO;AAAA,UACP,aAAY;AAAA,UACZ,iBAAgB;AAAA,UAChB,QAAO;AAAA,UACP,SAAQ;AAAA,UAER,UAAA;AAAA,YAAC,gBAAAH,EAAAI,GAAA,EAAU,SAAS,IAAK,CAAA;AAAA,8BACxBC,GAAK,EAAA,QAAO,SAAQ,WAAU,OAAM,QAAO,UAAS,UAAA;AAAA,cAAA;AAAA,gCAChC,MAAG,EAAA;AAAA,cAAE;AAAA,YAAA,GAE1B;AAAA,YACA,gBAAAL,EAACI,GAAU,EAAA,SAAS,IAAK,CAAA;AAAA,YACzB,gBAAAN;AAAA,cAACK;AAAA,cAAA;AAAA,gBACC,aAAY;AAAA,gBACZ,iBAAgB;AAAA,gBAChB,gBAAe;AAAA,gBACf,iBAAiB;AAAA,gBAEhB,UAAA;AAAA,kBAAAG,EAAW,IAAI,CAAC,EAAE,IAAAC,EACjB,MAAA,gBAAAP;AAAA,oBAACQ;AAAA,oBAAA;AAAA,sBACC,UAAUD;AAAA,sBACV,YAAYV,MAAaU;AAAA,sBACzB,SAAS,MAAMX,EAAiBW,CAAE;AAAA,oBAAA;AAAA,oBAC7BA;AAAA,kBAAA,CAER;AAAA,kBACD,gBAAAP,EAACS,GAAA,EACC,UAAA,gBAAAT;AAAA,oBAACU;AAAA,oBAAA;AAAA,sBACC,MAAMC;AAAA,sBACN,UAAS;AAAA,sBACT,gBAAe;AAAA,sBACf,SAAShB;AAAA,oBAAA;AAAA,kBAAA,GAEb;AAAA,gBAAA;AAAA,cAAA;AAAA,YACF;AAAA,YACA,gBAAAK,EAACI,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,8BACtBC,GAAK,EAAA,WAAU,OAAM,QAAO,cAAa,QAAO,UAAS,UAAA;AAAA,cAAA;AAAA,gCACvB,MAAG,EAAA;AAAA,cACpC,gBAAAL,EAACK,KAAK,SAAO,IAAC,WAAU,YAAW,QAAO,cAAa,UAEvD,eAAA,CAAA;AAAA,cAAO;AAAA,cAEP,gBAAAL,EAACK,KAAK,SAAO,IAAC,WAAU,YAAW,QAAO,cAAa,UAEvD,iBAAA,CAAA;AAAA,YAAA,GACF;AAAA,UAAA;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAAA,GAKSO,IAAAC,EAAKnB,CAAgB;"}

package/dist/features/auth/user-list/user-item/user-item-styled.js

@@ -0,0 +1,21 @@
+import t from "styled-components";
+import l from "../../../ui/layout/flex-view.js";
+const c = t(l)`
+  cursor: pointer;
+  transition: background-color 0.3s ease;
+  position: relative;
+  border-left: 1px solid ${({ theme: o }) => o.colors.BLACK_5};
+  border-bottom: 1px solid ${({ theme: o }) => o.colors.BLACK_5};
+
+  &:hover {
+    background-color: ${({ theme: o }) => o.colors.BLACK_2};
+  }
+
+  ${({ index: o, theme: r, maxColumns: e }) => o < e && `border-top: 1px solid ${r.colors.BLACK_5};`}
+
+  ${({ index: o, isLastItem: r, theme: e, maxColumns: s }) => ((o + 1) % s === 0 || r) && `border-right: 1px solid ${e.colors.BLACK_5};`}
+`;
+export {
+  c as UserItemCard
+};
+//# sourceMappingURL=user-item-styled.js.map