@cuemath/leap 3.0.11-j1 → 3.0.11-j3

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"user-item-styled.js","sources":["../../../../../src/features/auth/user-list/user-item/user-item-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport FlexView from '../../../ui/layout/flex-view';\n\nexport const UserItemCard = styled(FlexView)<{\n  index: number;\n  isLastItem?: boolean;\n  maxColumns: number;\n}>`\n  cursor: pointer;\n  transition: background-color 0.3s ease;\n  position: relative;\n  border-left: 1px solid ${({ theme }) => theme.colors.BLACK_5};\n  border-bottom: 1px solid ${({ theme }) => theme.colors.BLACK_5};\n\n  &:hover {\n    background-color: ${({ theme }) => theme.colors.BLACK_2};\n  }\n\n  ${({ index, theme, maxColumns }) =>\n    index < maxColumns && `border-top: 1px solid ${theme.colors.BLACK_5};`}\n\n  ${({ index, isLastItem, theme, maxColumns }) =>\n    ((index + 1) % maxColumns === 0 || isLastItem) &&\n    `border-right: 1px solid ${theme.colors.BLACK_5};`}\n`;\n"],"names":["UserItemCard","styled","FlexView","theme","index","maxColumns","isLastItem"],"mappings":";;AAIa,MAAAA,IAAeC,EAAOC,CAAQ;AAAA;AAAA;AAAA;AAAA,2BAQhB,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA,6BACjC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA;AAAA,wBAGxC,CAAC,EAAE,OAAAA,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA;AAAA,IAGvD,CAAC,EAAE,OAAAC,GAAO,OAAAD,GAAO,YAAAE,EAAW,MAC5BD,IAAQC,KAAc,yBAAyBF,EAAM,OAAO,OAAO,GAAG;AAAA;AAAA,IAEtE,CAAC,EAAE,OAAAC,GAAO,YAAAE,GAAY,OAAAH,GAAO,YAAAE,EAC3B,QAAAD,IAAQ,KAAKC,MAAe,KAAKC,MACnC,2BAA2BH,EAAM,OAAO,OAAO,GAAG;AAAA;"}

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

@@ -0,0 +1,48 @@
+import { jsxs as p, jsx as t } from "react/jsx-runtime";
+import { memo as f, useCallback as h } from "react";
+import g from "../../../ui/avatar/avatar.js";
+import u from "../../../ui/separator/separator.js";
+import C from "../../../ui/text/text.js";
+import { UserItemCard as d } from "./user-item-styled.js";
+const I = ({
+  id: r,
+  phone: m,
+  username: n,
+  avatar: s,
+  index: a,
+  isLastItem: i,
+  onSelect: e,
+  avatarSize: c,
+  maxColumns: $,
+  cardSize: o
+}) => {
+  const l = h(() => {
+    e(r);
+  }, [r, e]);
+  return /* @__PURE__ */ p(
+    d,
+    {
+      onClick: l,
+      maxColumns: $,
+      $gutterX: 2,
+      $gapX: 2.81,
+      $width: o,
+      $height: o,
+      $alignItems: "center",
+      $justifyContent: "center",
+      index: a,
+      isLastItem: i,
+      $background: "BLACK_1",
+      children: [
+        /* @__PURE__ */ t(g, { size: c, avatar: s }),
+        /* @__PURE__ */ t(u, { heightX: 0.5 }),
+        /* @__PURE__ */ t(C, { $color: "WHITE", $renderAs: "ab2", $align: "center", children: n || m })
+      ]
+    },
+    r
+  );
+}, X = f(I);
+export {
+  X as default
+};
+//# sourceMappingURL=user-item.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"user-item.js","sources":["../../../../../src/features/auth/user-list/user-item/user-item.tsx"],"sourcesContent":["import type { IUserItemProps } from './user-item-types';\n\nimport { useCallback, type FC, memo } from 'react';\n\nimport Avatar from '../../../ui/avatar/avatar';\nimport Separator from '../../../ui/separator/separator';\nimport Text from '../../../ui/text/text';\nimport * as Styled from './user-item-styled';\n\nconst UserItem: FC<IUserItemProps> = ({\n  id,\n  phone,\n  username,\n  avatar,\n  index,\n  isLastItem,\n  onSelect,\n  avatarSize,\n  maxColumns,\n  cardSize,\n}) => {\n  const handleClick = useCallback(() => {\n    onSelect(id);\n  }, [id, onSelect]);\n\n  return (\n    <Styled.UserItemCard\n      key={id}\n      onClick={handleClick}\n      maxColumns={maxColumns}\n      $gutterX={2}\n      $gapX={2.81}\n      $width={cardSize}\n      $height={cardSize}\n      $alignItems=\"center\"\n      $justifyContent=\"center\"\n      index={index}\n      isLastItem={isLastItem}\n      $background=\"BLACK_1\"\n    >\n      <Avatar size={avatarSize} avatar={avatar} />\n      <Separator heightX={0.5} />\n      <Text $color=\"WHITE\" $renderAs=\"ab2\" $align=\"center\">\n        {username || phone}\n      </Text>\n    </Styled.UserItemCard>\n  );\n};\n\nexport default memo(UserItem);\n"],"names":["UserItem","id","phone","username","avatar","index","isLastItem","onSelect","avatarSize","maxColumns","cardSize","handleClick","useCallback","jsxs","Styled.UserItemCard","jsx","Avatar","Separator","Text","UserItem$1","memo"],"mappings":";;;;;;AASA,MAAMA,IAA+B,CAAC;AAAA,EACpC,IAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,OAAAC;AAAA,EACA,YAAAC;AAAA,EACA,UAAAC;AAAA,EACA,YAAAC;AAAA,EACA,YAAAC;AAAA,EACA,UAAAC;AACF,MAAM;AACE,QAAAC,IAAcC,EAAY,MAAM;AACpC,IAAAL,EAASN,CAAE;AAAA,EAAA,GACV,CAACA,GAAIM,CAAQ,CAAC;AAGf,SAAA,gBAAAM;AAAA,IAACC;AAAAA,IAAA;AAAA,MAEC,SAASH;AAAA,MACT,YAAAF;AAAA,MACA,UAAU;AAAA,MACV,OAAO;AAAA,MACP,QAAQC;AAAA,MACR,SAASA;AAAA,MACT,aAAY;AAAA,MACZ,iBAAgB;AAAA,MAChB,OAAAL;AAAA,MACA,YAAAC;AAAA,MACA,aAAY;AAAA,MAEZ,UAAA;AAAA,QAAC,gBAAAS,EAAAC,GAAA,EAAO,MAAMR,GAAY,QAAAJ,EAAgB,CAAA;AAAA,QAC1C,gBAAAW,EAACE,GAAU,EAAA,SAAS,IAAK,CAAA;AAAA,QACzB,gBAAAF,EAACG,KAAK,QAAO,SAAQ,WAAU,OAAM,QAAO,UACzC,UAAAf,KAAYD,EACf,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAjBKD;AAAA,EAAA;AAoBX,GAEekB,IAAAC,EAAKpB,CAAQ;"}

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

@@ -0,0 +1,19 @@
+import t from "styled-components";
+import { UserItemCard as e } from "./user-item/user-item-styled.js";
+const i = t.div`
+  display: inline-grid;
+  grid-template-columns: repeat(
+    ${({ itemCount: r, maxColumns: o }) => r < o ? r : o},
+    ${({ cardWidth: r }) => r}px
+  );
+  grid-auto-rows: ${({ cardWidth: r }) => r}px;
+`, s = t(e)`
+  &:hover {
+    background-color: ${({ theme: r }) => r.colors.BLACK_4};
+  }
+`;
+export {
+  s as AddAccountButton,
+  i as UserListWrapper
+};
+//# sourceMappingURL=user-list-styled.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"user-list-styled.js","sources":["../../../../src/features/auth/user-list/user-list-styled.tsx"],"sourcesContent":["import styled from 'styled-components';\n\nimport { UserItemCard } from './user-item/user-item-styled';\n\nexport const UserListWrapper = styled.div<{\n  itemCount: number;\n  maxColumns: number;\n  cardWidth: number;\n}>`\n  display: inline-grid;\n  grid-template-columns: repeat(\n    ${({ itemCount, maxColumns }) => (itemCount < maxColumns ? itemCount : maxColumns)},\n    ${({ cardWidth }) => cardWidth}px\n  );\n  grid-auto-rows: ${({ cardWidth }) => cardWidth}px;\n`;\n\nexport const AddAccountButton = styled(UserItemCard)`\n  &:hover {\n    background-color: ${({ theme }) => theme.colors.BLACK_4};\n  }\n`;\n"],"names":["UserListWrapper","styled","itemCount","maxColumns","cardWidth","AddAccountButton","UserItemCard","theme"],"mappings":";;AAIO,MAAMA,IAAkBC,EAAO;AAAA;AAAA;AAAA,MAOhC,CAAC,EAAE,WAAAC,GAAW,YAAAC,EAAA,MAAkBD,IAAYC,IAAaD,IAAYC,CAAW;AAAA,MAChF,CAAC,EAAE,WAAAC,EAAU,MAAMA,CAAS;AAAA;AAAA,oBAEd,CAAC,EAAE,WAAAA,EAAU,MAAMA,CAAS;AAAA,GAGnCC,IAAmBJ,EAAOK,CAAY;AAAA;AAAA,wBAE3B,CAAC,EAAE,OAAAC,EAAA,MAAYA,EAAM,OAAO,OAAO;AAAA;AAAA;"}

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

@@ -0,0 +1,56 @@
+import { jsxs as f, jsx as r } from "react/jsx-runtime";
+import { memo as g } from "react";
+import d from "../../../assets/line-icons/icons/plus.js";
+import u from "../../ui/layout/flex-view.js";
+import I from "./user-item/user-item.js";
+import { UserListWrapper as L, AddAccountButton as U } from "./user-list-styled.js";
+const j = ({
+  users: i,
+  onSelect: h,
+  showAddButton: s = !1,
+  onAddNew: c,
+  maxColumns: e = 5,
+  cardSize: t = 200,
+  avatarSize: a = 80
+}) => {
+  const o = i.length + (s ? 1 : 0);
+  return /* @__PURE__ */ f(L, { itemCount: o, maxColumns: e, cardWidth: t, children: [
+    i.map(({ id: m, username: p, user_avatar: l, phone: $ }, n) => /* @__PURE__ */ r(
+      I,
+      {
+        id: m,
+        onSelect: h,
+        cardSize: t,
+        index: n,
+        maxColumns: e,
+        avatarSize: a,
+        avatar: l,
+        phone: $,
+        username: p,
+        isLastItem: n === o - 1
+      },
+      m
+    )),
+    s && /* @__PURE__ */ r(
+      U,
+      {
+        isLastItem: !0,
+        index: o,
+        maxColumns: e,
+        $gutterX: 5,
+        $gapX: 5,
+        $background: "BLACK_3",
+        $width: t,
+        $height: t,
+        $alignItems: "center",
+        $justifyContent: "center",
+        onClick: c,
+        children: /* @__PURE__ */ r(u, { $width: 40, $height: 40, children: /* @__PURE__ */ r(d, { color: "WHITE", width: 40, height: 40 }) })
+      }
+    )
+  ] });
+}, X = g(j);
+export {
+  X as default
+};
+//# sourceMappingURL=user-list.js.map

package/dist/features/auth/user-list/user-list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"user-list.js","sources":["../../../../src/features/auth/user-list/user-list.tsx"],"sourcesContent":["import type { IUserListProps } from './user-list-types';\n\nimport { type FC, memo } from 'react';\n\nimport PlusIcon from '../../../assets/line-icons/icons/plus';\nimport FlexView from '../../ui/layout/flex-view';\nimport UserItem from './user-item/user-item';\nimport * as Styled from './user-list-styled';\n\nconst UserList: FC<IUserListProps> = ({\n  users,\n  onSelect,\n  showAddButton = false,\n  onAddNew,\n  maxColumns = 5,\n  cardSize = 200,\n  avatarSize = 80,\n}) => {\n  const totalCards = users.length + (showAddButton ? 1 : 0);\n\n  return (\n    <Styled.UserListWrapper itemCount={totalCards} maxColumns={maxColumns} cardWidth={cardSize}>\n      {users.map(({ id, username, user_avatar: avatar, phone }, index) => (\n        <UserItem\n          key={id}\n          id={id}\n          onSelect={onSelect}\n          cardSize={cardSize}\n          index={index}\n          maxColumns={maxColumns}\n          avatarSize={avatarSize}\n          avatar={avatar}\n          phone={phone}\n          username={username}\n          isLastItem={index === totalCards - 1}\n        />\n      ))}\n\n      {showAddButton && (\n        <Styled.AddAccountButton\n          isLastItem\n          index={totalCards}\n          maxColumns={maxColumns}\n          $gutterX={5}\n          $gapX={5}\n          $background=\"BLACK_3\"\n          $width={cardSize}\n          $height={cardSize}\n          $alignItems=\"center\"\n          $justifyContent=\"center\"\n          onClick={onAddNew}\n        >\n          <FlexView $width={40} $height={40}>\n            <PlusIcon color=\"WHITE\" width={40} height={40} />\n          </FlexView>\n        </Styled.AddAccountButton>\n      )}\n    </Styled.UserListWrapper>\n  );\n};\n\nexport default memo(UserList);\n"],"names":["UserList","users","onSelect","showAddButton","onAddNew","maxColumns","cardSize","avatarSize","totalCards","jsxs","Styled.UserListWrapper","id","username","avatar","phone","index","jsx","UserItem","Styled.AddAccountButton","FlexView","PlusIcon","UserList$1","memo"],"mappings":";;;;;;AASA,MAAMA,IAA+B,CAAC;AAAA,EACpC,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,UAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,UAAAC,IAAW;AAAA,EACX,YAAAC,IAAa;AACf,MAAM;AACJ,QAAMC,IAAaP,EAAM,UAAUE,IAAgB,IAAI;AAGrD,SAAA,gBAAAM,EAACC,GAAA,EAAuB,WAAWF,GAAY,YAAAH,GAAwB,WAAWC,GAC/E,UAAA;AAAA,IAAML,EAAA,IAAI,CAAC,EAAE,IAAAU,GAAI,UAAAC,GAAU,aAAaC,GAAQ,OAAAC,KAASC,MACxD,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QAEC,IAAAN;AAAA,QACA,UAAAT;AAAA,QACA,UAAAI;AAAA,QACA,OAAAS;AAAA,QACA,YAAAV;AAAA,QACA,YAAAE;AAAA,QACA,QAAAM;AAAA,QACA,OAAAC;AAAA,QACA,UAAAF;AAAA,QACA,YAAYG,MAAUP,IAAa;AAAA,MAAA;AAAA,MAV9BG;AAAA,IAAA,CAYR;AAAA,IAEAR,KACC,gBAAAa;AAAA,MAACE;AAAAA,MAAA;AAAA,QACC,YAAU;AAAA,QACV,OAAOV;AAAA,QACP,YAAAH;AAAA,QACA,UAAU;AAAA,QACV,OAAO;AAAA,QACP,aAAY;AAAA,QACZ,QAAQC;AAAA,QACR,SAASA;AAAA,QACT,aAAY;AAAA,QACZ,iBAAgB;AAAA,QAChB,SAASF;AAAA,QAET,UAAC,gBAAAY,EAAAG,GAAA,EAAS,QAAQ,IAAI,SAAS,IAC7B,UAAA,gBAAAH,EAACI,GAAS,EAAA,OAAM,SAAQ,OAAO,IAAI,QAAQ,GAAI,CAAA,GACjD;AAAA,MAAA;AAAA,IACF;AAAA,EAEJ,EAAA,CAAA;AAEJ,GAEeC,IAAAC,EAAKtB,CAAQ;"}

package/dist/index.d.ts

@@ -41,7 +41,7 @@ import { Substitute } from 'styled-components/dist/types';
  */
 export declare const AccordionSection: FC<IAccordionSectionProps>;
 
-export declare const AccountSelector: ({ userAccounts, onSelect, onAddNew, isLoading, }: IAccountSelectorViewProps) => JSX_2.Element;
+export declare const AccountSelector: MemoExoticComponent<({ userAccounts, onSelect, onAddNew, isLoading, }: IAccountSelectorViewProps) => JSX_2.Element>;
 
 export declare const ACHIEVEMENT_ACTIONS: {
     SHARE: string;
@@ -64,7 +64,7 @@ export declare const ArcButton: MemoExoticComponent<ForwardRefExoticComponent<IA
 
 export declare const ArrowTooltip: FC<IArrowTooltipProps>;
 
-export declare const AUTH_TABS: ITabConfig<TAuthTabKeys>;
+export declare const AUTH_TABS: IAuthTab[];
 
 export declare const AuthApiErrorCode: {
     readonly USER_NOT_FOUND: 8000;
@@ -76,9 +76,9 @@ export declare const AuthApiErrorCode: {
     readonly SOCIAL_SIGNUP_EMAIL_MISSING: 8006;
 };
 
-export declare const AuthPageLayout: FC<IAuthPageLayoutProps>;
+export declare const AuthPageLayout: NamedExoticComponent<IAuthPageLayoutProps>;
 
-export declare const AuthStaticPanel: FC<IAuthStaticPanelProps>;
+export declare const AuthStaticPanel: NamedExoticComponent<IAuthStaticPanelProps>;
 
 export declare const AutoPlayPermissionProvider: FC<{
     children: ReactNode;
@@ -250,7 +250,7 @@ export declare const CircularLoader: () => JSX_2.Element;
 
 export declare const CircularSteps: FC<ICircularStepsProps>;
 
-export declare const CircularStepWrapper: ForwardRefExoticComponent<ICircularStepWrapperProps & RefAttributes<ICircularStepRef>>;
+export declare const CircularStepWrapper: MemoExoticComponent<ForwardRefExoticComponent<ICircularStepWrapperProps & RefAttributes<ICircularStepRef>>>;
 
 export declare const ClaimUserAccount: NamedExoticComponent<IClaimUserAccountProps>;
 
@@ -302,11 +302,11 @@ export declare const CuemathLogo: React_2.FC<React_2.SVGProps<SVGSVGElement>>;
 
 export declare const CueRocket: React.FC<React.SVGProps<SVGSVGElement>>;
 
-export declare const CustomInputField: FC<ICustomInputFieldProps>;
+export declare const CustomInputField: NamedExoticComponent<ICustomInputFieldProps>;
 
 export declare const DashArrowIcon: React.FC<React.SVGProps<SVGSVGElement>>;
 
-export declare const DatePickerInput: FC<IDatePickerInputProps>;
+export declare const DatePickerInput: NamedExoticComponent<IDatePickerInputProps>;
 
 export declare const DesmosCalculator: FC<IDesmosCalculatorProps>;
 
@@ -514,7 +514,7 @@ export declare const GoalEdit: React.FC<IMileStoneEditContainerProps>;
 
 export declare const GooglePlacesSearchInput: ComponentType<Omit_2<IGooglePlacesSearchInputProps, IProvidedProps>>;
 
-export declare const GradeInput: FC<ICustomInputFieldProps>;
+export declare const GradeInput: NamedExoticComponent<ICustomInputFieldProps>;
 
 export declare function GradeSelector({ selectedValue, onSelect, tabsWidth, width, grades, renderAs, size, layoutAlignment, }: IGradeSelectorProps): JSX.Element;
 
@@ -630,8 +630,8 @@ declare interface IAttempt {
 }
 
 declare interface IAuthPageLayoutProps {
-    leftBlock: ReactNode;
-    rightBlock?: ReactNode;
+    leftBlock: JSX.Element;
+    rightBlock?: JSX.Element;
     isFullWidth?: boolean;
 }
 
@@ -640,6 +640,11 @@ declare interface IAuthStaticPanelProps {
     description?: string;
 }
 
+declare interface IAuthTab {
+    id: TAuthTabKeys;
+    label: string;
+}
+
 declare interface IAutoPlayPermissionContextType {
     canAutoPlayAudio: boolean;
     canAutoPlayVideo: boolean;
@@ -1044,7 +1049,7 @@ declare interface ICircularStepsProps {
 }
 
 declare interface ICircularStepWrapperProps {
-    children: ReactNode;
+    children: JSX.Element;
     animation: string;
     introFrames: [number, number];
     outroFrames: [number, number];
@@ -1064,7 +1069,6 @@ declare interface IClaimUserAccountProps {
     userAccounts: TUserAccount[];
     isCreatingAccount: boolean;
     isLoading: boolean;
-    showCreateNewAccount?: boolean;
 }
 
 declare interface IClassStatus {
@@ -1224,7 +1228,7 @@ declare interface ICustomInputFieldProps {
     onEnter?: () => void;
     error?: string;
     helperText?: string;
-    actionElement?: ReactNode;
+    actionElement?: JSX.Element;
     isLoading?: boolean;
     isValid?: boolean;
     type?: 'text' | 'password' | 'number' | 'phone';
@@ -1250,7 +1254,7 @@ declare interface IDatePickerInputProps extends Omit<ICustomInputFieldProps, 'va
     onChange: (date: Date | null) => void;
 }
 
-export declare const IdentifierOtpForm: React_2.FC<IIdentifierOtpFormProps>;
+export declare const IdentifierOtpForm: React_2.NamedExoticComponent<IIdentifierOtpFormProps>;
 
 declare interface IDesmosCalculatorProps {
     onClose: () => void;
@@ -2408,7 +2412,7 @@ declare interface INodePermissions {
     can_unassign: boolean;
 }
 
-export declare const InputStatusIcon: React.FC<IInputStatusIconProps>;
+export declare const InputStatusIcon: NamedExoticComponent<IInputStatusIconProps>;
 
 export declare interface INudgeProps {
     nudge: 'click';
@@ -3098,11 +3102,9 @@ declare interface ISyncableWebGameProps {
     enableSync?: boolean;
 }
 
-export declare type ITabConfig<T extends string = string> = Record<T, ITabItem>;
-
 declare interface ITabItem {
+    id: string;
     label: string;
-    component?: JSX.Element;
 }
 
 export declare interface ITable {
@@ -3170,10 +3172,10 @@ export declare interface ITabSizeConfig {
     textVariant: TTextVariants;
 }
 
-declare interface ITabsProps<T extends string> {
-    selectedTab: T;
-    onChange: (tab: T) => void;
-    tabs: ITabConfig<T>;
+declare interface ITabsProps {
+    selectedTab: string;
+    onChange: (tab: string) => void;
+    tabs: ITabItem[];
 }
 
 export declare interface ITabVariantConfig {
@@ -4203,13 +4205,13 @@ declare interface NumRangeInputProps {
     endPlaceholder?: string;
 }
 
-export declare const OTPForm: ({ onSubmit, onChange, value, error, isProcessing, isValid, }: ISingleFieldFormProps) => JSX_2.Element;
+export declare const OTPForm: MemoExoticComponent<({ onSubmit, onChange, value, error, isProcessing, isValid, }: ISingleFieldFormProps) => JSX_2.Element>;
 
 export declare type OutcomeStage = keyof typeof STAGES;
 
-export declare const OverlayLoader: ({ isLoading }: {
+export declare const OverlayLoader: MemoExoticComponent<({ isLoading }: {
     isLoading?: boolean | undefined;
-}) => JSX_2.Element | null;
+}) => JSX_2.Element | null>;
 
 export declare const PencilIcon: React.FC<React.SVGProps<SVGSVGElement>>;
 
@@ -4349,9 +4351,9 @@ export declare const ReferenceSheet: FC<IReferenceSheetProps>;
 
 export declare const RemotePeerPointer: MemoExoticComponent<({ containerRef, onPublish, onSubscribe, responseId }: IPointerProps) => JSX_2.Element>;
 
-export declare const ResendOTP: React.FC<IOTPResendProps>;
+export declare const ResendOTP: NamedExoticComponent<IOTPResendProps>;
 
-export declare const ResetPasswordForm: ({ onSubmit, onChange, formData, errors, isSubmitDisabled, isProcessing, isValid, }: IResetPasswordFormProps) => JSX_2.Element;
+export declare const ResetPasswordForm: MemoExoticComponent<({ onSubmit, onChange, formData, errors, isSubmitDisabled, isProcessing, isValid, }: IResetPasswordFormProps) => JSX_2.Element>;
 
 export declare const REWARDS_LIST: string[];
 
@@ -4442,7 +4444,7 @@ export declare const SheetLocked: MemoExoticComponent<({ onHomeClick }: {
 
 export declare const SignUp: ({ mathGymEnrolledUser, circleEnrolledUser, circleOnLeapPremiumDays, circleUsername, countryCode, grade: defaultGrade, state, circleOnLeapPremiumEnabled, studentId, isSignUpProcessing, onCreateUser, onUpdateUser, onSignupStepsComplete, }: ISignUpProps) => JSX_2.Element;
 
-export declare const SignupMethods: FC<ISignupMethodsProps>;
+export declare const SignupMethods: NamedExoticComponent<ISignupMethodsProps>;
 
 declare const SketchIcon: React.FC<React.SVGProps<SVGSVGElement>>;
 export { SketchIcon as ScribbleIcon }
@@ -4454,9 +4456,9 @@ export declare const SkipColoredIcon: React.FC<React.SVGProps<SVGSVGElement>>;
 
 export declare const SkipIcon: React.FC<React.SVGProps<SVGSVGElement>>;
 
-export declare const SocialAccountNotFound: ({ onRetryLogin, onGoToSignup }: ISocialAccountNotFoundProps) => JSX_2.Element;
+export declare const SocialAccountNotFound: MemoExoticComponent<({ onRetryLogin, onGoToSignup }: ISocialAccountNotFoundProps) => JSX_2.Element>;
 
-export declare const SocialLoginMethods: FC<ISocialLoginMethodsProps>;
+export declare const SocialLoginMethods: NamedExoticComponent<ISocialLoginMethodsProps>;
 
 export declare const SplashScreen: ({ animationCompleted }: {
     animationCompleted: () => void;
@@ -4525,7 +4527,7 @@ declare const TAB_CODES: {
 
 export declare const TabComponent: React_2.FC<ITabProps>;
 
-export declare function Tabs<T extends string>({ selectedTab, onChange, tabs }: ITabsProps<T>): JSX_2.Element;
+export declare const Tabs: MemoExoticComponent<({ selectedTab, onChange, tabs }: ITabsProps) => JSX_2.Element>;
 
 export declare type TAction = EventToPayload<TInclassMessage>;
 
@@ -5544,6 +5546,7 @@ export declare type TTrialSessionMessage = {
 declare type TUserAccount = {
     id: string;
     phone: string;
+    user_avatar?: IAvatarLayer[] | null;
 };
 
 declare type TUserChapterStates = 'MASTERED' | 'PROFICIENT' | 'FAMILIAR' | 'STARTED';
@@ -5729,9 +5732,9 @@ export declare const User2Icon: React.FC<React.SVGProps<SVGSVGElement>>;
 
 export declare const UserIcon: React.FC<React.SVGProps<SVGSVGElement>>;
 
-export declare const UserIdentifierForm: ({ onSubmit, onChange, value, error, isSubmitDisabled, isProcessing, isValid, label, field, }: ISingleFieldFormProps) => JSX_2.Element;
+export declare const UserIdentifierForm: MemoExoticComponent<({ onSubmit, onChange, value, error, isSubmitDisabled, isProcessing, isValid, label, field, }: ISingleFieldFormProps) => JSX_2.Element>;
 
-export declare const UsernamePasswordForm: FC<IUsernamePasswordFormProps>;
+export declare const UsernamePasswordForm: NamedExoticComponent<IUsernamePasswordFormProps>;
 
 export declare const UserTypeSelector: NamedExoticComponent<IUserTypeSelectorProps>;