@cuemath/leap 3.0.12-ays8 → 3.0.12-j

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

@@ -0,0 +1,88 @@
+import r from "styled-components";
+const a = r.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-popper {
+    z-index: 1;
+  }
+  .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--disabled {
+    color: ${({ theme: e }) => e.colors.WHITE_T_10};
+    cursor: not-allowed;
+    &:hover {
+      color: ${({ theme: e }) => e.colors.WHITE_T_10};
+    }
+  }
+  .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: o }) => o || 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-field/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-field/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  .react-datepicker-popper {\n    z-index: 1;\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--disabled {\n    color: ${({ theme }) => theme.colors.WHITE_T_10};\n    cursor: not-allowed;\n    &:hover {\n      color: ${({ theme }) => theme.colors.WHITE_T_10};\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;AAAA;AAAA,aAY9C,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,UAAU;AAAA;AAAA;AAAA,eAGpC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,UAAU;AAAA;AAAA;AAAA;AAAA,aAIxC,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-field/date-picker-input/date-picker-input.js

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

package/dist/features/auth/signup/custom-input-field/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-field/date-picker-input/date-picker-input.tsx"],"sourcesContent":["import type { IDatePickerInputProps } from './date-picker-input-types';\nimport type { ReactDatePickerCustomHeaderProps } from 'react-datepicker';\n\nimport { subYears } from 'date-fns';\nimport { type FC, memo, useCallback } 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  const handleChangeDate = useCallback((date: Date | null) => onChange(date), [onChange]);\n\n  const renderHeader = useCallback(\n    (props: ReactDatePickerCustomHeaderProps) => {\n      const { date, decreaseYear, increaseYear, prevYearButtonDisabled, nextYearButtonDisabled } =\n        props;\n\n      return (\n        <FlexView $alignItems=\"center\" $flexDirection=\"row\" $justifyContent=\"space-between\">\n          <Clickable onClick={decreaseYear} label=\"increase-year\" disabled={prevYearButtonDisabled}>\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 onClick={increaseYear} label=\"decrease-year\" disabled={nextYearButtonDisabled}>\n            <RightIcon color={theme.colors[nextYearButtonDisabled ? 'WHITE_T_10' : 'WHITE']} />\n          </Clickable>\n        </FlexView>\n      );\n    },\n\n    [theme.colors],\n  );\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={handleChangeDate}\n          minDate={subYears(new Date(), 22)}\n          maxDate={subYears(new Date(), 2)}\n          renderCustomHeader={renderHeader}\n        />\n      </Styled.StyledDatePickerWrapper>\n    </InputWrapper>\n  );\n};\n\nexport default memo(DatePickerInput);\n"],"names":["DatePickerInput","value","onChange","error","theme","useTheme","handleChangeDate","useCallback","date","renderHeader","props","decreaseYear","increaseYear","prevYearButtonDisabled","nextYearButtonDisabled","FlexView","jsx","Clickable","LeftIcon","Text","RightIcon","InputWrapper","Styled.StyledDatePickerWrapper","DatePicker","subYears","datePickerInput","memo"],"mappings":";;;;;;;;;;;;AAgBA,MAAMA,IAA6C,CAAC,EAAE,OAAAC,GAAO,UAAAC,GAAU,OAAAC,QAAY;AACjF,QAAMC,IAAQC,KAERC,IAAmBC,EAAY,CAACC,MAAsBN,EAASM,CAAI,GAAG,CAACN,CAAQ,CAAC,GAEhFO,IAAeF;AAAA,IACnB,CAACG,MAA4C;AAC3C,YAAM,EAAE,MAAAF,GAAM,cAAAG,GAAc,cAAAC,GAAc,wBAAAC,GAAwB,wBAAAC,EAChE,IAAAJ;AAEF,+BACGK,GAAS,EAAA,aAAY,UAAS,gBAAe,OAAM,iBAAgB,iBAClE,UAAA;AAAA,QAAA,gBAAAC,EAACC,KAAU,SAASN,GAAc,OAAM,iBAAgB,UAAUE,GAChE,UAAA,gBAAAG,EAACE,GAAS,EAAA,OAAOd,EAAM,OAAOS,IAAyB,eAAe,OAAO,EAAG,CAAA,GAClF;AAAA,QACA,gBAAAG,EAACG,KAAK,WAAU,YAAW,QAAO,SAC/B,UAAAX,EAAK,eACR;AAAA,0BACCS,GAAU,EAAA,SAASL,GAAc,OAAM,iBAAgB,UAAUE,GAChE,UAAC,gBAAAE,EAAAI,GAAA,EAAU,OAAOhB,EAAM,OAAOU,IAAyB,eAAe,OAAO,EAAG,CAAA,GACnF;AAAA,MACF,EAAA,CAAA;AAAA,IAEJ;AAAA,IAEA,CAACV,EAAM,MAAM;AAAA,EAAA;AAGf,2BACGiB,GAAa,EAAA,YAAYlB,GACxB,UAAC,gBAAAa,EAAAM,GAAA,EACC,UAAA,gBAAAN;AAAA,IAACO;AAAA,IAAA;AAAA,MACC,UAAUtB;AAAA,MACV,qBAAmB;AAAA,MACnB,iBAAiB;AAAA,MACjB,YAAW;AAAA,MACX,iBAAgB;AAAA,MAChB,UAAUK;AAAA,MACV,SAASkB,EAAa,oBAAA,KAAA,GAAQ,EAAE;AAAA,MAChC,SAASA,EAAa,oBAAA,KAAA,GAAQ,CAAC;AAAA,MAC/B,oBAAoBf;AAAA,IAAA;AAAA,EAAA,EAExB,CAAA,EACF,CAAA;AAEJ,GAEegB,IAAAC,EAAK1B,CAAe;"}

package/dist/features/auth/signup/custom-input-field/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-field/grade-input/grade-input-styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grade-input-styled.js","sources":["../../../../../../src/features/auth/signup/custom-input-field/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-field/grade-input/grade-input.js

@@ -0,0 +1,31 @@
+import { jsx as r } from "react/jsx-runtime";
+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 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: () => o(e),
+      $borderRadius: 48,
+      $gutter: 13,
+      $gap: 6,
+      $alignItems: "center",
+      $justifyContent: "center",
+      $background: t ? "WHITE" : "REAL_BLACK",
+      $borderColor: t ? "WHITE" : "BLACK_5",
+      $width: e === "-1" ? 96 : 40,
+      $height: 40,
+      children: /* @__PURE__ */ r(p, { $align: "center", $renderAs: "ab1", children: d })
+    },
+    e
+  );
+}) }) }), T = m(s);
+export {
+  T as default
+};
+//# sourceMappingURL=grade-input.js.map

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

@@ -0,0 +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';\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-styled.js

@@ -0,0 +1,11 @@
+import o from "styled-components";
+import t from "../../../../ui/layout/flex-view.js";
+const r = o(t)`
+  position: absolute;
+  top: 56px;
+  max-width: 100%;
+`;
+export {
+  r as ContentWrapper
+};
+//# sourceMappingURL=input-wrapper-styled.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"input-wrapper-styled.js","sources":["../../../../../../src/features/auth/signup/custom-input-field/input-wrapper/input-wrapper-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../../../ui/layout/flex-view';\n\nexport const ContentWrapper = styled(FlexView)`\n  position: absolute;\n  top: 56px;\n  max-width: 100%;\n`;\n"],"names":["ContentWrapper","styled","FlexView"],"mappings":";;AAIa,MAAAA,IAAiBC,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA;"}

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

@@ -0,0 +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 $ from "../../../../ui/lottie-animation/lottie-animation.js";
+import i from "../../../../ui/separator/separator.js";
+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(f, { $alignItems: "center", $justifyContent: "center", children: [
+    n && /* @__PURE__ */ t(r, { $gutterX: 3.5, children: [
+      /* @__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 })
+    ] }),
+    p && /* @__PURE__ */ t(r, { children: [
+      /* @__PURE__ */ e(i, { heightX: 2 }),
+      /* @__PURE__ */ e($, { src: h.SPINNER_WHITE, height: 20, width: 40 })
+    ] })
+  ] })
+] }), W = c(l);
+export {
+  W as default
+};
+//# sourceMappingURL=input-wrapper.js.map

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

@@ -0,0 +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 { 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/custom-input-field/password-toggle/password-toggle.js

@@ -0,0 +1,9 @@
+import { jsx as o } from "react/jsx-runtime";
+import t from "../../../../../assets/line-icons/icons/eye.js";
+import e from "../../../../../assets/line-icons/icons/striked-eye.js";
+import l from "../../../../ui/buttons/clickable/clickable.js";
+const h = ({ isVisible: i, onToggle: r }) => /* @__PURE__ */ o(l, { label: "toggle-password-visibility", onClick: r, children: i ? /* @__PURE__ */ o(t, { color: "WHITE", width: 24, height: 24 }) : /* @__PURE__ */ o(e, { color: "WHITE", width: 24, height: 24 }) });
+export {
+  h as default
+};
+//# sourceMappingURL=password-toggle.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"password-toggle.js","sources":["../../../../../../src/features/auth/signup/custom-input-field/password-toggle/password-toggle.tsx"],"sourcesContent":["import type { IPasswordToggleProps } from './password-toggle-types';\nimport type { FC } from 'react';\n\nimport EyeIcon from '../../../../../assets/line-icons/icons/eye';\nimport StrikedEyeIcon from '../../../../../assets/line-icons/icons/striked-eye';\nimport Clickable from '../../../../ui/buttons/clickable/clickable';\n\nconst PasswordToggleIcon: FC<IPasswordToggleProps> = ({ isVisible, onToggle }) => (\n  <Clickable label=\"toggle-password-visibility\" onClick={onToggle}>\n    {isVisible ? (\n      <EyeIcon color=\"WHITE\" width={24} height={24} />\n    ) : (\n      <StrikedEyeIcon color=\"WHITE\" width={24} height={24} />\n    )}\n  </Clickable>\n);\n\nexport default PasswordToggleIcon;\n"],"names":["PasswordToggleIcon","isVisible","onToggle","jsx","Clickable","EyeIcon","StrikedEyeIcon"],"mappings":";;;;AAOA,MAAMA,IAA+C,CAAC,EAAE,WAAAC,GAAW,UAAAC,EAAS,MACzE,gBAAAC,EAAAC,GAAA,EAAU,OAAM,8BAA6B,SAASF,GACpD,cACE,gBAAAC,EAAAE,GAAA,EAAQ,OAAM,SAAQ,OAAO,IAAI,QAAQ,GAAA,CAAI,IAE9C,gBAAAF,EAACG,GAAe,EAAA,OAAM,SAAQ,OAAO,IAAI,QAAQ,IAAI,EAEzD,CAAA;"}