@cuemath/leap 3.1.2-j3 → 3.1.2

package/dist/features/auth/login/social-account-not-found/social-account-not-found.js

@@ -1,28 +1,22 @@
-import { jsxs as o, Fragment as i, jsx as e } from "react/jsx-runtime";
-import { memo as c } from "react";
-import r from "../../../ui/buttons/button/button.js";
-import l from "../../../ui/layout/flex-view.js";
-import m from "../../../ui/separator/separator.js";
-const s = ({
-  onRetryLogin: t,
-  onGoToSignup: n,
-  showSignupButton: a = !0
-}) => /* @__PURE__ */ o(l, { $alignItems: "center", $justifyContent: "center", children: [
-  !!a && /* @__PURE__ */ o(i, { children: [
-    /* @__PURE__ */ e(
-      r,
-      {
-        size: "small",
-        renderAs: "secondary-dark",
-        label: "Create a new account",
-        width: 232,
-        onClick: n
-      }
-    ),
-    /* @__PURE__ */ e(m, { heightX: 1 })
-  ] }),
-  /* @__PURE__ */ e(
-    r,
+import { jsxs as n, jsx as o } from "react/jsx-runtime";
+import { memo as a } from "react";
+import e from "../../../ui/buttons/button/button.js";
+import i from "../../../ui/layout/flex-view.js";
+import c from "../../../ui/separator/separator.js";
+const s = ({ onRetryLogin: t, onGoToSignup: r }) => /* @__PURE__ */ n(i, { $alignItems: "center", $justifyContent: "center", children: [
+  /* @__PURE__ */ o(
+    e,
+    {
+      size: "small",
+      renderAs: "secondary-dark",
+      label: "Create a new account",
+      width: 232,
+      onClick: r
+    }
+  ),
+  /* @__PURE__ */ o(c, { heightX: 1 }),
+  /* @__PURE__ */ o(
+    e,
     {
       size: "small",
       renderAs: "secondary-dark",
@@ -31,8 +25,8 @@ const s = ({
       onClick: t
     }
   )
-] }), g = c(s);
+] }), h = a(s);
 export {
-  g as default
+  h as default
 };
 //# sourceMappingURL=social-account-not-found.js.map

package/dist/features/auth/login/social-account-not-found/social-account-not-found.js.map

@@ -1 +1 @@
-{"version":3,"file":"social-account-not-found.js","sources":["../../../../../src/features/auth/login/social-account-not-found/social-account-not-found.tsx"],"sourcesContent":["import type { ISocialAccountNotFoundProps } from './social-account-not-found-types';\n\nimport { memo } from 'react';\n\nimport Button from '../../../ui/buttons/button/button';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Separator from '../../../ui/separator/separator';\n\nconst SocialAccountNotFound = ({\n  onRetryLogin,\n  onGoToSignup,\n  showSignupButton = true,\n}: ISocialAccountNotFoundProps) => {\n  return (\n    <FlexView $alignItems=\"center\" $justifyContent=\"center\">\n      {!!showSignupButton && (\n        <>\n          <Button\n            size=\"small\"\n            renderAs=\"secondary-dark\"\n            label=\"Create a new account\"\n            width={232}\n            onClick={onGoToSignup}\n          />\n          <Separator heightX={1} />\n        </>\n      )}\n\n      <Button\n        size=\"small\"\n        renderAs=\"secondary-dark\"\n        label=\"Try another Login method\"\n        width={232}\n        onClick={onRetryLogin}\n      />\n    </FlexView>\n  );\n};\n\nexport default memo(SocialAccountNotFound);\n"],"names":["SocialAccountNotFound","onRetryLogin","onGoToSignup","showSignupButton","jsxs","FlexView","Fragment","jsx","Button","Separator","socialAccountNotFound","memo"],"mappings":";;;;;AAQA,MAAMA,IAAwB,CAAC;AAAA,EAC7B,cAAAC;AAAA,EACA,cAAAC;AAAA,EACA,kBAAAC,IAAmB;AACrB,MAEK,gBAAAC,EAAAC,GAAA,EAAS,aAAY,UAAS,iBAAgB,UAC5C,UAAA;AAAA,EAAC,CAAA,CAACF,KAEC,gBAAAC,EAAAE,GAAA,EAAA,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,UAAS;AAAA,QACT,OAAM;AAAA,QACN,OAAO;AAAA,QACP,SAASN;AAAA,MAAA;AAAA,IACX;AAAA,IACA,gBAAAK,EAACE,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,EAAA,GACzB;AAAA,EAGF,gBAAAF;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,UAAS;AAAA,MACT,OAAM;AAAA,MACN,OAAO;AAAA,MACP,SAASP;AAAA,IAAA;AAAA,EACX;AACF,EAAA,CAAA,GAIWS,IAAAC,EAAKX,CAAqB;"}
+{"version":3,"file":"social-account-not-found.js","sources":["../../../../../src/features/auth/login/social-account-not-found/social-account-not-found.tsx"],"sourcesContent":["import type { ISocialAccountNotFoundProps } from './social-account-not-found-types';\n\nimport { memo } from 'react';\n\nimport Button from '../../../ui/buttons/button/button';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Separator from '../../../ui/separator/separator';\n\nconst SocialAccountNotFound = ({ onRetryLogin, onGoToSignup }: ISocialAccountNotFoundProps) => {\n  return (\n    <FlexView $alignItems=\"center\" $justifyContent=\"center\">\n      <Button\n        size=\"small\"\n        renderAs=\"secondary-dark\"\n        label=\"Create a new account\"\n        width={232}\n        onClick={onGoToSignup}\n      />\n      <Separator heightX={1} />\n      <Button\n        size=\"small\"\n        renderAs=\"secondary-dark\"\n        label=\"Try another Login method\"\n        width={232}\n        onClick={onRetryLogin}\n      />\n    </FlexView>\n  );\n};\n\nexport default memo(SocialAccountNotFound);\n"],"names":["SocialAccountNotFound","onRetryLogin","onGoToSignup","jsxs","FlexView","jsx","Button","Separator","socialAccountNotFound","memo"],"mappings":";;;;;AAQA,MAAMA,IAAwB,CAAC,EAAE,cAAAC,GAAc,cAAAC,QAE1C,gBAAAC,EAAAC,GAAA,EAAS,aAAY,UAAS,iBAAgB,UAC7C,UAAA;AAAA,EAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,UAAS;AAAA,MACT,OAAM;AAAA,MACN,OAAO;AAAA,MACP,SAASJ;AAAA,IAAA;AAAA,EACX;AAAA,EACA,gBAAAG,EAACE,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,EACvB,gBAAAF;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,UAAS;AAAA,MACT,OAAM;AAAA,MACN,OAAO;AAAA,MACP,SAASL;AAAA,IAAA;AAAA,EACX;AACF,EAAA,CAAA,GAIWO,IAAAC,EAAKT,CAAqB;"}

package/dist/features/auth/login/social-login-methods/social-login-methods.js

@@ -1,56 +1,47 @@
 import { jsxs as a, jsx as i } from "react/jsx-runtime";
 import { memo as r } from "react";
 import c from "../../../../assets/line-icons/icons/apple-icon.js";
-import p from "../../../../assets/line-icons/icons/google-icon.js";
+import d from "../../../../assets/line-icons/icons/google-icon.js";
 import s from "../../../ui/buttons/button/button.js";
-import { Wrapper as d } from "./social-login-methods-styled.js";
+import p from "../../../ui/layout/flex-view.js";
 const m = ({
   onGoogleLogin: n,
   onAppleLogin: t,
   loadingProvider: o
 }) => {
   const e = o === "google", l = o === "apple";
-  return /* @__PURE__ */ a(
-    d,
-    {
-      $flexGapX: 1,
-      $flexDirection: "row",
-      $justifyContent: "space-between",
-      $width: "100%",
-      children: [
-        /* @__PURE__ */ i(
-          s,
-          {
-            renderAs: "secondary-dark",
-            Icon: p,
-            label: "",
-            analyticsLabel: "google_login",
-            onClick: n,
-            size: "small",
-            width: "100%",
-            busy: e,
-            disabled: e
-          }
-        ),
-        /* @__PURE__ */ i(
-          s,
-          {
-            renderAs: "secondary-dark",
-            size: "small",
-            Icon: c,
-            width: "100%",
-            label: "",
-            analyticsLabel: "apple_login",
-            onClick: t,
-            busy: l,
-            disabled: l
-          }
-        )
-      ]
-    }
-  );
-}, L = r(m);
+  return /* @__PURE__ */ a(p, { $flexGapX: 1, $flexDirection: "row", $justifyContent: "space-between", $width: 336, children: [
+    /* @__PURE__ */ i(
+      s,
+      {
+        renderAs: "secondary-dark",
+        Icon: d,
+        width: 160,
+        label: "",
+        analyticsLabel: "google_login",
+        onClick: n,
+        size: "small",
+        busy: e,
+        disabled: e
+      }
+    ),
+    /* @__PURE__ */ i(
+      s,
+      {
+        renderAs: "secondary-dark",
+        size: "small",
+        width: 160,
+        Icon: c,
+        label: "",
+        analyticsLabel: "apple_login",
+        onClick: t,
+        busy: l,
+        disabled: l
+      }
+    )
+  ] });
+}, w = r(m);
 export {
-  L as default
+  w as default
 };
 //# sourceMappingURL=social-login-methods.js.map

package/dist/features/auth/login/social-login-methods/social-login-methods.js.map

@@ -1 +1 @@
-{"version":3,"file":"social-login-methods.js","sources":["../../../../../src/features/auth/login/social-login-methods/social-login-methods.tsx"],"sourcesContent":["import type { ISocialLoginMethodsProps } from './social-login-methods-types';\nimport type { FC } from 'react';\n\nimport { memo } 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 * as Styled from './social-login-methods-styled';\n\nconst SocialLoginMethods: FC<ISocialLoginMethodsProps> = ({\n  onGoogleLogin,\n  onAppleLogin,\n  loadingProvider,\n}) => {\n  const isLoadingGoogle = loadingProvider === 'google';\n  const isLoadingApple = loadingProvider === 'apple';\n\n  return (\n    <Styled.Wrapper\n      $flexGapX={1}\n      $flexDirection=\"row\"\n      $justifyContent=\"space-between\"\n      $width=\"100%\"\n    >\n      <Button\n        renderAs=\"secondary-dark\"\n        Icon={GoogleIcon}\n        label=\"\"\n        analyticsLabel=\"google_login\"\n        onClick={onGoogleLogin}\n        size=\"small\"\n        width=\"100%\"\n        busy={isLoadingGoogle}\n        disabled={isLoadingGoogle}\n      />\n      <Button\n        renderAs=\"secondary-dark\"\n        size=\"small\"\n        Icon={AppleIcon}\n        width=\"100%\"\n        label=\"\"\n        analyticsLabel=\"apple_login\"\n        onClick={onAppleLogin}\n        busy={isLoadingApple}\n        disabled={isLoadingApple}\n      />\n    </Styled.Wrapper>\n  );\n};\n\nexport default memo(SocialLoginMethods);\n"],"names":["SocialLoginMethods","onGoogleLogin","onAppleLogin","loadingProvider","isLoadingGoogle","isLoadingApple","jsxs","Styled.Wrapper","jsx","Button","GoogleIcon","AppleIcon","socialLoginMethods","memo"],"mappings":";;;;;;AAUA,MAAMA,IAAmD,CAAC;AAAA,EACxD,eAAAC;AAAA,EACA,cAAAC;AAAA,EACA,iBAAAC;AACF,MAAM;AACJ,QAAMC,IAAkBD,MAAoB,UACtCE,IAAiBF,MAAoB;AAGzC,SAAA,gBAAAG;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,WAAW;AAAA,MACX,gBAAe;AAAA,MACf,iBAAgB;AAAA,MAChB,QAAO;AAAA,MAEP,UAAA;AAAA,QAAA,gBAAAC;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,UAAS;AAAA,YACT,MAAMC;AAAA,YACN,OAAM;AAAA,YACN,gBAAe;AAAA,YACf,SAAST;AAAA,YACT,MAAK;AAAA,YACL,OAAM;AAAA,YACN,MAAMG;AAAA,YACN,UAAUA;AAAA,UAAA;AAAA,QACZ;AAAA,QACA,gBAAAI;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,UAAS;AAAA,YACT,MAAK;AAAA,YACL,MAAME;AAAA,YACN,OAAM;AAAA,YACN,OAAM;AAAA,YACN,gBAAe;AAAA,YACf,SAAST;AAAA,YACT,MAAMG;AAAA,YACN,UAAUA;AAAA,UAAA;AAAA,QACZ;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN,GAEeO,IAAAC,EAAKb,CAAkB;"}
+{"version":3,"file":"social-login-methods.js","sources":["../../../../../src/features/auth/login/social-login-methods/social-login-methods.tsx"],"sourcesContent":["import type { ISocialLoginMethodsProps } from './social-login-methods-types';\nimport type { FC } from 'react';\n\nimport { memo } 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 SocialLoginMethods: FC<ISocialLoginMethodsProps> = ({\n  onGoogleLogin,\n  onAppleLogin,\n  loadingProvider,\n}) => {\n  const isLoadingGoogle = loadingProvider === 'google';\n  const isLoadingApple = loadingProvider === 'apple';\n\n  return (\n    <FlexView $flexGapX={1} $flexDirection=\"row\" $justifyContent=\"space-between\" $width={336}>\n      <Button\n        renderAs=\"secondary-dark\"\n        Icon={GoogleIcon}\n        width={160}\n        label=\"\"\n        analyticsLabel=\"google_login\"\n        onClick={onGoogleLogin}\n        size=\"small\"\n        busy={isLoadingGoogle}\n        disabled={isLoadingGoogle}\n      />\n      <Button\n        renderAs=\"secondary-dark\"\n        size=\"small\"\n        width={160}\n        Icon={AppleIcon}\n        label=\"\"\n        analyticsLabel=\"apple_login\"\n        onClick={onAppleLogin}\n        busy={isLoadingApple}\n        disabled={isLoadingApple}\n      />\n    </FlexView>\n  );\n};\n\nexport default memo(SocialLoginMethods);\n"],"names":["SocialLoginMethods","onGoogleLogin","onAppleLogin","loadingProvider","isLoadingGoogle","isLoadingApple","jsxs","FlexView","jsx","Button","GoogleIcon","AppleIcon","socialLoginMethods","memo"],"mappings":";;;;;;AAUA,MAAMA,IAAmD,CAAC;AAAA,EACxD,eAAAC;AAAA,EACA,cAAAC;AAAA,EACA,iBAAAC;AACF,MAAM;AACJ,QAAMC,IAAkBD,MAAoB,UACtCE,IAAiBF,MAAoB;AAGzC,SAAA,gBAAAG,EAACC,KAAS,WAAW,GAAG,gBAAe,OAAM,iBAAgB,iBAAgB,QAAQ,KACnF,UAAA;AAAA,IAAA,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,UAAS;AAAA,QACT,MAAMC;AAAA,QACN,OAAO;AAAA,QACP,OAAM;AAAA,QACN,gBAAe;AAAA,QACf,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,gBAAe;AAAA,QACf,SAAST;AAAA,QACT,MAAMG;AAAA,QACN,UAAUA;AAAA,MAAA;AAAA,IACZ;AAAA,EACF,EAAA,CAAA;AAEJ,GAEeO,IAAAC,EAAKb,CAAkB;"}

package/dist/features/auth/login/username-password-form/username-password-form.js

@@ -1,13 +1,12 @@
 import { jsxs as n, jsx as e } from "react/jsx-runtime";
 import { memo as f, useCallback as l } from "react";
 import w from "../../../ui/buttons/button/button.js";
-import C from "../../../ui/buttons/text-button/text-button.js";
+import $ from "../../../ui/buttons/text-button/text-button.js";
 import u from "../../../ui/inputs/text-input/text-input.js";
 import s from "../../../ui/layout/flex-view.js";
-import o from "../../../ui/separator/separator.js";
-import $ from "../../comps/input-status-icon/input-status-icon.js";
-import { FormContainer as y } from "../login-styled.js";
-const k = ({
+import a from "../../../ui/separator/separator.js";
+import y from "../../comps/input-status-icon/input-status-icon.js";
+const C = ({
   username: i,
   password: m,
   errors: r,
@@ -17,28 +16,28 @@ const k = ({
   onForgotPassword: h
 }) => {
   const c = d || !i.trim() || !m.trim(), g = l(
-    (a) => {
-      t("username", a.target.value);
+    (o) => {
+      t("username", o.target.value);
     },
     [t]
   ), b = l(
-    (a) => {
-      t("password", a.target.value);
+    (o) => {
+      t("password", o.target.value);
     },
     [t]
   );
   return /* @__PURE__ */ n(
     s,
     {
-      $gutterX: 1.5,
+      $gutterX: 2,
       $gapX: 1.5,
       $alignItems: "center",
       $justifyContent: "center",
       $background: "BLACK_2",
       $height: 308,
       children: [
-        /* @__PURE__ */ e(o, { heightX: 0.5 }),
-        /* @__PURE__ */ n(y, { onSubmit: p, children: [
+        /* @__PURE__ */ e(a, { heightX: 0.5 }),
+        /* @__PURE__ */ n("form", { onSubmit: p, children: [
           /* @__PURE__ */ n(s, { $alignItems: "center", $justifyContent: "center", children: [
             /* @__PURE__ */ e(
               u,
@@ -48,14 +47,14 @@ const k = ({
                 autoComplete: "username",
                 label: "Username",
                 value: i,
-                width: "100%",
                 onChange: g,
+                width: 330,
                 required: !0,
                 shape: "borderLess",
                 errorMessage: r.username
               }
             ),
-            /* @__PURE__ */ e(o, { height: 36 }),
+            /* @__PURE__ */ e(a, { height: 36 }),
             /* @__PURE__ */ e(
               u,
               {
@@ -64,18 +63,18 @@ const k = ({
                 autoComplete: "password",
                 label: "Password",
                 value: m,
-                width: "100%",
                 onChange: b,
+                width: 330,
                 required: !0,
                 shape: "borderLess",
                 errorMessage: r.password,
-                siblingElement: /* @__PURE__ */ e($, { isError: !!r.password })
+                siblingElement: /* @__PURE__ */ e(y, { isError: !!r.password })
               }
             )
           ] }),
-          /* @__PURE__ */ e(o, { heightX: 1.25 }),
-          /* @__PURE__ */ e(s, { $alignItems: "flex-end", children: /* @__PURE__ */ e(C, { label: "Forgot Password?", onClick: h, color: "WHITE_T_60" }) }),
-          /* @__PURE__ */ e(o, { heightX: 2 }),
+          /* @__PURE__ */ e(a, { heightX: 1.25 }),
+          /* @__PURE__ */ e(s, { $alignItems: "flex-end", children: /* @__PURE__ */ e($, { label: "Forgot Password?", onClick: h, color: "WHITE_T_60" }) }),
+          /* @__PURE__ */ e(a, { heightX: 2 }),
           /* @__PURE__ */ e(s, { $justifyContent: "center", children: /* @__PURE__ */ e(
             w,
             {
@@ -83,7 +82,7 @@ const k = ({
               renderAs: "secondary-dark",
               type: "submit",
               label: "Log in",
-              width: "100%",
+              width: 336,
               busy: d,
               disabled: c
             }
@@ -92,8 +91,8 @@ const k = ({
       ]
     }
   );
-}, B = f(k);
+}, A = f(C);
 export {
-  B as default
+  A as default
 };
 //# sourceMappingURL=username-password-form.js.map

package/dist/features/auth/login/username-password-form/username-password-form.js.map

@@ -1 +1 @@
-{"version":3,"file":"username-password-form.js","sources":["../../../../../src/features/auth/login/username-password-form/username-password-form.tsx"],"sourcesContent":["import type { IUsernamePasswordFormProps } from './username-password-form-types';\n\nimport { type ChangeEvent, type FC, memo, useCallback } from 'react';\n\nimport Button from '../../../ui/buttons/button/button';\nimport TextButton from '../../../ui/buttons/text-button/text-button';\nimport TextInput from '../../../ui/inputs/text-input/text-input';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Separator from '../../../ui/separator/separator';\nimport InputStatusIcon from '../../comps/input-status-icon/input-status-icon';\nimport * as Styled from '../login-styled';\n\nconst UsernamePasswordForm: FC<IUsernamePasswordFormProps> = ({\n  username,\n  password,\n  errors,\n  isLoading,\n  onChange,\n  onSubmit,\n  onForgotPassword,\n}) => {\n  const isSubmitDisabled = isLoading || !username.trim() || !password.trim();\n\n  const handleUsernameChange = useCallback(\n    (e: ChangeEvent<HTMLInputElement>) => {\n      onChange('username', e.target.value);\n    },\n    [onChange],\n  );\n\n  const handlePasswordChange = useCallback(\n    (e: ChangeEvent<HTMLInputElement>) => {\n      onChange('password', e.target.value);\n    },\n    [onChange],\n  );\n\n  return (\n    <FlexView\n      $gutterX={1.5}\n      $gapX={1.5}\n      $alignItems=\"center\"\n      $justifyContent=\"center\"\n      $background=\"BLACK_2\"\n      $height={308}\n    >\n      <Separator heightX={0.5} />\n      <Styled.FormContainer onSubmit={onSubmit}>\n        <FlexView $alignItems=\"center\" $justifyContent=\"center\">\n          <TextInput\n            renderAs={errors.username ? 'error-dark' : 'primary-dark'}\n            autoFocus\n            autoComplete=\"username\"\n            label=\"Username\"\n            value={username}\n            width=\"100%\"\n            onChange={handleUsernameChange}\n            required\n            shape=\"borderLess\"\n            errorMessage={errors.username}\n          />\n          <Separator height={36} />\n          <TextInput\n            type=\"password\"\n            renderAs={errors.password ? 'error-dark' : 'primary-dark'}\n            autoComplete=\"password\"\n            label=\"Password\"\n            value={password}\n            width=\"100%\"\n            onChange={handlePasswordChange}\n            required\n            shape=\"borderLess\"\n            errorMessage={errors.password}\n            siblingElement={<InputStatusIcon isError={!!errors.password} />}\n          />\n        </FlexView>\n        <Separator heightX={1.25} />\n        <FlexView $alignItems=\"flex-end\">\n          <TextButton label=\"Forgot Password?\" onClick={onForgotPassword} color=\"WHITE_T_60\" />\n        </FlexView>\n        <Separator heightX={2} />\n        <FlexView $justifyContent=\"center\">\n          <Button\n            size=\"small\"\n            renderAs=\"secondary-dark\"\n            type=\"submit\"\n            label=\"Log in\"\n            width=\"100%\"\n            busy={isLoading}\n            disabled={isSubmitDisabled}\n          />\n        </FlexView>\n      </Styled.FormContainer>\n    </FlexView>\n  );\n};\n\nexport default memo(UsernamePasswordForm);\n"],"names":["UsernamePasswordForm","username","password","errors","isLoading","onChange","onSubmit","onForgotPassword","isSubmitDisabled","handleUsernameChange","useCallback","e","handlePasswordChange","jsxs","FlexView","jsx","Separator","Styled.FormContainer","TextInput","InputStatusIcon","TextButton","Button","usernamePasswordForm","memo"],"mappings":";;;;;;;;;AAYA,MAAMA,IAAuD,CAAC;AAAA,EAC5D,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,kBAAAC;AACF,MAAM;AACE,QAAAC,IAAmBJ,KAAa,CAACH,EAAS,UAAU,CAACC,EAAS,QAE9DO,IAAuBC;AAAA,IAC3B,CAACC,MAAqC;AAC3B,MAAAN,EAAA,YAAYM,EAAE,OAAO,KAAK;AAAA,IACrC;AAAA,IACA,CAACN,CAAQ;AAAA,EAAA,GAGLO,IAAuBF;AAAA,IAC3B,CAACC,MAAqC;AAC3B,MAAAN,EAAA,YAAYM,EAAE,OAAO,KAAK;AAAA,IACrC;AAAA,IACA,CAACN,CAAQ;AAAA,EAAA;AAIT,SAAA,gBAAAQ;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,UAAU;AAAA,MACV,OAAO;AAAA,MACP,aAAY;AAAA,MACZ,iBAAgB;AAAA,MAChB,aAAY;AAAA,MACZ,SAAS;AAAA,MAET,UAAA;AAAA,QAAC,gBAAAC,EAAAC,GAAA,EAAU,SAAS,IAAK,CAAA;AAAA,QACxB,gBAAAH,EAAAI,GAAA,EAAqB,UAAAX,GACpB,UAAA;AAAA,UAAA,gBAAAO,EAACC,GAAS,EAAA,aAAY,UAAS,iBAAgB,UAC7C,UAAA;AAAA,YAAA,gBAAAC;AAAA,cAACG;AAAA,cAAA;AAAA,gBACC,UAAUf,EAAO,WAAW,eAAe;AAAA,gBAC3C,WAAS;AAAA,gBACT,cAAa;AAAA,gBACb,OAAM;AAAA,gBACN,OAAOF;AAAA,gBACP,OAAM;AAAA,gBACN,UAAUQ;AAAA,gBACV,UAAQ;AAAA,gBACR,OAAM;AAAA,gBACN,cAAcN,EAAO;AAAA,cAAA;AAAA,YACvB;AAAA,YACA,gBAAAY,EAACC,GAAU,EAAA,QAAQ,GAAI,CAAA;AAAA,YACvB,gBAAAD;AAAA,cAACG;AAAA,cAAA;AAAA,gBACC,MAAK;AAAA,gBACL,UAAUf,EAAO,WAAW,eAAe;AAAA,gBAC3C,cAAa;AAAA,gBACb,OAAM;AAAA,gBACN,OAAOD;AAAA,gBACP,OAAM;AAAA,gBACN,UAAUU;AAAA,gBACV,UAAQ;AAAA,gBACR,OAAM;AAAA,gBACN,cAAcT,EAAO;AAAA,gBACrB,gBAAiB,gBAAAY,EAAAI,GAAA,EAAgB,SAAS,CAAC,CAAChB,EAAO,UAAU;AAAA,cAAA;AAAA,YAC/D;AAAA,UAAA,GACF;AAAA,UACA,gBAAAY,EAACC,GAAU,EAAA,SAAS,KAAM,CAAA;AAAA,UACzB,gBAAAD,EAAAD,GAAA,EAAS,aAAY,YACpB,UAAC,gBAAAC,EAAAK,GAAA,EAAW,OAAM,oBAAmB,SAASb,GAAkB,OAAM,aAAa,CAAA,GACrF;AAAA,UACA,gBAAAQ,EAACC,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,UACvB,gBAAAD,EAACD,GAAS,EAAA,iBAAgB,UACxB,UAAA,gBAAAC;AAAA,YAACM;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,UAAS;AAAA,cACT,MAAK;AAAA,cACL,OAAM;AAAA,cACN,OAAM;AAAA,cACN,MAAMjB;AAAA,cACN,UAAUI;AAAA,YAAA;AAAA,UAAA,GAEd;AAAA,QAAA,GACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN,GAEec,IAAAC,EAAKvB,CAAoB;"}
+{"version":3,"file":"username-password-form.js","sources":["../../../../../src/features/auth/login/username-password-form/username-password-form.tsx"],"sourcesContent":["import type { IUsernamePasswordFormProps } from './username-password-form-types';\n\nimport { type ChangeEvent, type FC, memo, useCallback } from 'react';\n\nimport Button from '../../../ui/buttons/button/button';\nimport TextButton from '../../../ui/buttons/text-button/text-button';\nimport TextInput from '../../../ui/inputs/text-input/text-input';\nimport FlexView from '../../../ui/layout/flex-view';\nimport Separator from '../../../ui/separator/separator';\nimport InputStatusIcon from '../../comps/input-status-icon/input-status-icon';\n\nconst UsernamePasswordForm: FC<IUsernamePasswordFormProps> = ({\n  username,\n  password,\n  errors,\n  isLoading,\n  onChange,\n  onSubmit,\n  onForgotPassword,\n}) => {\n  const isSubmitDisabled = isLoading || !username.trim() || !password.trim();\n\n  const handleUsernameChange = useCallback(\n    (e: ChangeEvent<HTMLInputElement>) => {\n      onChange('username', e.target.value);\n    },\n    [onChange],\n  );\n\n  const handlePasswordChange = useCallback(\n    (e: ChangeEvent<HTMLInputElement>) => {\n      onChange('password', e.target.value);\n    },\n    [onChange],\n  );\n\n  return (\n    <FlexView\n      $gutterX={2}\n      $gapX={1.5}\n      $alignItems=\"center\"\n      $justifyContent=\"center\"\n      $background=\"BLACK_2\"\n      $height={308}\n    >\n      <Separator heightX={0.5} />\n      <form onSubmit={onSubmit}>\n        <FlexView $alignItems=\"center\" $justifyContent=\"center\">\n          <TextInput\n            renderAs={errors.username ? 'error-dark' : 'primary-dark'}\n            autoFocus\n            autoComplete=\"username\"\n            label=\"Username\"\n            value={username}\n            onChange={handleUsernameChange}\n            width={330}\n            required\n            shape=\"borderLess\"\n            errorMessage={errors.username}\n          />\n          <Separator height={36} />\n          <TextInput\n            type=\"password\"\n            renderAs={errors.password ? 'error-dark' : 'primary-dark'}\n            autoComplete=\"password\"\n            label=\"Password\"\n            value={password}\n            onChange={handlePasswordChange}\n            width={330}\n            required\n            shape=\"borderLess\"\n            errorMessage={errors.password}\n            siblingElement={<InputStatusIcon isError={!!errors.password} />}\n          />\n        </FlexView>\n        <Separator heightX={1.25} />\n        <FlexView $alignItems=\"flex-end\">\n          <TextButton label=\"Forgot Password?\" onClick={onForgotPassword} color=\"WHITE_T_60\" />\n        </FlexView>\n        <Separator heightX={2} />\n        <FlexView $justifyContent=\"center\">\n          <Button\n            size=\"small\"\n            renderAs=\"secondary-dark\"\n            type=\"submit\"\n            label=\"Log in\"\n            width={336}\n            busy={isLoading}\n            disabled={isSubmitDisabled}\n          />\n        </FlexView>\n      </form>\n    </FlexView>\n  );\n};\n\nexport default memo(UsernamePasswordForm);\n"],"names":["UsernamePasswordForm","username","password","errors","isLoading","onChange","onSubmit","onForgotPassword","isSubmitDisabled","handleUsernameChange","useCallback","e","handlePasswordChange","jsxs","FlexView","jsx","Separator","TextInput","InputStatusIcon","TextButton","Button","usernamePasswordForm","memo"],"mappings":";;;;;;;;AAWA,MAAMA,IAAuD,CAAC;AAAA,EAC5D,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,kBAAAC;AACF,MAAM;AACE,QAAAC,IAAmBJ,KAAa,CAACH,EAAS,UAAU,CAACC,EAAS,QAE9DO,IAAuBC;AAAA,IAC3B,CAACC,MAAqC;AAC3B,MAAAN,EAAA,YAAYM,EAAE,OAAO,KAAK;AAAA,IACrC;AAAA,IACA,CAACN,CAAQ;AAAA,EAAA,GAGLO,IAAuBF;AAAA,IAC3B,CAACC,MAAqC;AAC3B,MAAAN,EAAA,YAAYM,EAAE,OAAO,KAAK;AAAA,IACrC;AAAA,IACA,CAACN,CAAQ;AAAA,EAAA;AAIT,SAAA,gBAAAQ;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,UAAU;AAAA,MACV,OAAO;AAAA,MACP,aAAY;AAAA,MACZ,iBAAgB;AAAA,MAChB,aAAY;AAAA,MACZ,SAAS;AAAA,MAET,UAAA;AAAA,QAAC,gBAAAC,EAAAC,GAAA,EAAU,SAAS,IAAK,CAAA;AAAA,QACzB,gBAAAH,EAAC,UAAK,UAAAP,GACJ,UAAA;AAAA,UAAA,gBAAAO,EAACC,GAAS,EAAA,aAAY,UAAS,iBAAgB,UAC7C,UAAA;AAAA,YAAA,gBAAAC;AAAA,cAACE;AAAA,cAAA;AAAA,gBACC,UAAUd,EAAO,WAAW,eAAe;AAAA,gBAC3C,WAAS;AAAA,gBACT,cAAa;AAAA,gBACb,OAAM;AAAA,gBACN,OAAOF;AAAA,gBACP,UAAUQ;AAAA,gBACV,OAAO;AAAA,gBACP,UAAQ;AAAA,gBACR,OAAM;AAAA,gBACN,cAAcN,EAAO;AAAA,cAAA;AAAA,YACvB;AAAA,YACA,gBAAAY,EAACC,GAAU,EAAA,QAAQ,GAAI,CAAA;AAAA,YACvB,gBAAAD;AAAA,cAACE;AAAA,cAAA;AAAA,gBACC,MAAK;AAAA,gBACL,UAAUd,EAAO,WAAW,eAAe;AAAA,gBAC3C,cAAa;AAAA,gBACb,OAAM;AAAA,gBACN,OAAOD;AAAA,gBACP,UAAUU;AAAA,gBACV,OAAO;AAAA,gBACP,UAAQ;AAAA,gBACR,OAAM;AAAA,gBACN,cAAcT,EAAO;AAAA,gBACrB,gBAAiB,gBAAAY,EAAAG,GAAA,EAAgB,SAAS,CAAC,CAACf,EAAO,UAAU;AAAA,cAAA;AAAA,YAC/D;AAAA,UAAA,GACF;AAAA,UACA,gBAAAY,EAACC,GAAU,EAAA,SAAS,KAAM,CAAA;AAAA,UACzB,gBAAAD,EAAAD,GAAA,EAAS,aAAY,YACpB,UAAC,gBAAAC,EAAAI,GAAA,EAAW,OAAM,oBAAmB,SAASZ,GAAkB,OAAM,aAAa,CAAA,GACrF;AAAA,UACA,gBAAAQ,EAACC,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,UACvB,gBAAAD,EAACD,GAAS,EAAA,iBAAgB,UACxB,UAAA,gBAAAC;AAAA,YAACK;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,UAAS;AAAA,cACT,MAAK;AAAA,cACL,OAAM;AAAA,cACN,OAAO;AAAA,cACP,MAAMhB;AAAA,cACN,UAAUI;AAAA,YAAA;AAAA,UAAA,GAEd;AAAA,QAAA,GACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN,GAEea,IAAAC,EAAKtB,CAAoB;"}

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

@@ -1,33 +1,32 @@
-import { jsxs as u, jsx as t } from "react/jsx-runtime";
-import { memo as A, useCallback as C } from "react";
-import I from "../../../hooks/use-device-type.js";
-import b from "../../../ui/avatar/avatar.js";
-import T from "../../../ui/separator/separator.js";
-import d from "../../../ui/text/text.js";
+import { jsxs as h, jsx as t } from "react/jsx-runtime";
+import { memo as g, useCallback as u } from "react";
+import A from "../../../ui/avatar/avatar.js";
+import C from "../../../ui/separator/separator.js";
+import I from "../../../ui/text/text.js";
 import { AVATAR_CONFIGURATIONS as m } from "../user-list-constants.js";
-import { UserItemCard as k } from "./user-item-styled.js";
-const v = ({
+import { UserItemCard as d } from "./user-item-styled.js";
+const k = ({
   id: r,
-  phone: s,
-  username: i,
-  avatar: n,
+  phone: n,
+  username: s,
+  avatar: i,
   index: e,
   isLastItem: c,
   onSelect: o,
   avatarSize: l,
-  maxColumns: p,
+  maxColumns: $,
   cardSize: a
 }) => {
-  const { isMobile: $, isTablet: f } = I(), h = C(() => {
+  const p = u(() => {
     o(r);
-  }, [r, o]), g = n ?? m[e % m.length];
-  return /* @__PURE__ */ u(
-    k,
+  }, [r, o]), f = i ?? m[e % m.length];
+  return /* @__PURE__ */ h(
+    d,
     {
-      onClick: h,
-      maxColumns: p,
-      $gutterX: 1.5,
-      $gapX: 1.5,
+      onClick: p,
+      maxColumns: $,
+      $gutterX: 2,
+      $gapX: 2.81,
       $width: a,
       $height: a,
       $alignItems: "center",
@@ -36,15 +35,15 @@ const v = ({
       isLastItem: c,
       $background: "BLACK_1",
       children: [
-        /* @__PURE__ */ t(b, { size: l, avatar: g }),
-        /* @__PURE__ */ t(T, { heightX: 0.5 }),
-        /* @__PURE__ */ t(d, { $color: "WHITE", $renderAs: $ || f ? "ab3" : "ab2", $align: "center", children: i || s })
+        /* @__PURE__ */ t(A, { size: l, avatar: f }),
+        /* @__PURE__ */ t(C, { heightX: 0.5 }),
+        /* @__PURE__ */ t(I, { $color: "WHITE", $renderAs: "ab2", $align: "center", children: s || n })
       ]
     },
     r
   );
-}, _ = A(v);
+}, N = g(k);
 export {
-  _ as default
+  N as default
 };
 //# sourceMappingURL=user-item.js.map

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

@@ -1 +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 useDeviceType from '../../../hooks/use-device-type';\nimport Avatar from '../../../ui/avatar/avatar';\nimport Separator from '../../../ui/separator/separator';\nimport Text from '../../../ui/text/text';\nimport { AVATAR_CONFIGURATIONS } from '../user-list-constants';\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 { isMobile, isTablet } = useDeviceType();\n  const handleClick = useCallback(() => {\n    onSelect(id);\n  }, [id, onSelect]);\n\n  const avatarSource = avatar ?? AVATAR_CONFIGURATIONS[index % AVATAR_CONFIGURATIONS.length];\n\n  return (\n    <Styled.UserItemCard\n      key={id}\n      onClick={handleClick}\n      maxColumns={maxColumns}\n      $gutterX={1.5}\n      $gapX={1.5}\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={avatarSource} />\n      <Separator heightX={0.5} />\n      <Text $color=\"WHITE\" $renderAs={isMobile || isTablet ? 'ab3' : '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","isMobile","isTablet","useDeviceType","handleClick","useCallback","avatarSource","AVATAR_CONFIGURATIONS","jsxs","Styled.UserItemCard","jsx","Avatar","Separator","Text","UserItem$1","memo"],"mappings":";;;;;;;;AAWA,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;AACJ,QAAM,EAAE,UAAAC,GAAU,UAAAC,EAAS,IAAIC,EAAc,GACvCC,IAAcC,EAAY,MAAM;AACpC,IAAAR,EAASN,CAAE;AAAA,EAAA,GACV,CAACA,GAAIM,CAAQ,CAAC,GAEXS,IAAeZ,KAAUa,EAAsBZ,IAAQY,EAAsB,MAAM;AAGvF,SAAA,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MAEC,SAASL;AAAA,MACT,YAAAL;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,QAAA,gBAAAc,EAACC,GAAO,EAAA,MAAMb,GAAY,QAAQQ,GAAc;AAAA,QAChD,gBAAAI,EAACE,GAAU,EAAA,SAAS,IAAK,CAAA;AAAA,QACxB,gBAAAF,EAAAG,GAAA,EAAK,QAAO,SAAQ,WAAWZ,KAAYC,IAAW,QAAQ,OAAO,QAAO,UAC1E,UAAAT,KAAYD,GACf;AAAA,MAAA;AAAA,IAAA;AAAA,IAjBKD;AAAA,EAAA;AAoBX,GAEeuB,IAAAC,EAAKzB,CAAQ;"}
+{"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 { AVATAR_CONFIGURATIONS } from '../user-list-constants';\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  const avatarSource = avatar ?? AVATAR_CONFIGURATIONS[index % AVATAR_CONFIGURATIONS.length];\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={avatarSource} />\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","avatarSource","AVATAR_CONFIGURATIONS","jsxs","Styled.UserItemCard","jsx","Avatar","Separator","Text","UserItem$1","memo"],"mappings":";;;;;;;AAUA,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,GAEXM,IAAeT,KAAUU,EAAsBT,IAAQS,EAAsB,MAAM;AAGvF,SAAA,gBAAAC;AAAA,IAACC;AAAAA,IAAA;AAAA,MAEC,SAASL;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,QAAA,gBAAAW,EAACC,GAAO,EAAA,MAAMV,GAAY,QAAQK,GAAc;AAAA,QAChD,gBAAAI,EAACE,GAAU,EAAA,SAAS,IAAK,CAAA;AAAA,QACzB,gBAAAF,EAACG,KAAK,QAAO,SAAQ,WAAU,OAAM,QAAO,UACzC,UAAAjB,KAAYD,EACf,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,IAjBKD;AAAA,EAAA;AAoBX,GAEeoB,IAAAC,EAAKtB,CAAQ;"}

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

@@ -1,64 +1,55 @@
-import { jsxs as x, jsx as e } from "react/jsx-runtime";
-import { memo as I } from "react";
-import L from "../../../assets/line-icons/icons/plus.js";
-import v from "../../hooks/use-device-type.js";
-import U from "../../ui/layout/flex-view.js";
-import b from "./user-item/user-item.js";
-import { UserListWrapper as j, AddAccountButton as w } from "./user-list-styled.js";
-const S = ({
-  users: s,
-  onSelect: c,
-  showAddButton: i = !1,
-  onAddNew: l,
-  maxColumns: p = 5,
-  cardSize: u = 200,
-  avatarSize: h = 80
+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 = s.length + (i ? 1 : 0), { isMobile: d, isTablet: f } = v(), m = d || f, r = m ? 2 : p, t = m ? 180 : u;
-  return /* @__PURE__ */ x(
-    j,
-    {
-      itemCount: o,
-      maxColumns: r,
-      cardWidth: t,
-      children: [
-        s.map(({ id: n, username: C, user_avatar: $, phone: g }, a) => /* @__PURE__ */ e(
-          b,
-          {
-            id: n,
-            onSelect: c,
-            cardSize: t,
-            index: a,
-            maxColumns: r,
-            avatarSize: h,
-            avatar: $,
-            phone: g,
-            username: C,
-            isLastItem: a === o - 1
-          },
-          n
-        )),
-        i && /* @__PURE__ */ e(
-          w,
-          {
-            isLastItem: !0,
-            index: o,
-            maxColumns: r,
-            $gutterX: 5,
-            $gapX: 5,
-            $background: "BLACK_3",
-            $width: t,
-            $height: t,
-            $alignItems: "center",
-            $justifyContent: "center",
-            onClick: l,
-            children: /* @__PURE__ */ e(U, { $width: 40, $height: 40, children: /* @__PURE__ */ e(L, { color: "WHITE", width: 40, height: 40 }) })
-          }
-        )
-      ]
-    }
-  );
-}, X = I(S);
+  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
 };

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

@@ -1 +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 useDeviceType from '../../hooks/use-device-type';\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  const { isMobile, isTablet } = useDeviceType();\n  const isSmallDevice = isMobile || isTablet;\n\n  const responsiveColumnNos = isSmallDevice ? 2 : maxColumns;\n  const responsiveCardSize = isSmallDevice ? 180 : cardSize;\n\n  return (\n    <Styled.UserListWrapper\n      itemCount={totalCards}\n      maxColumns={responsiveColumnNos}\n      cardWidth={responsiveCardSize}\n    >\n      {users.map(({ id, username, user_avatar: avatar, phone }, index) => (\n        <UserItem\n          key={id}\n          id={id}\n          onSelect={onSelect}\n          cardSize={responsiveCardSize}\n          index={index}\n          maxColumns={responsiveColumnNos}\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={responsiveColumnNos}\n          $gutterX={5}\n          $gapX={5}\n          $background=\"BLACK_3\"\n          $width={responsiveCardSize}\n          $height={responsiveCardSize}\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","isMobile","isTablet","useDeviceType","isSmallDevice","responsiveColumnNos","responsiveCardSize","jsxs","Styled.UserListWrapper","id","username","avatar","phone","index","jsx","UserItem","Styled.AddAccountButton","FlexView","PlusIcon","UserList$1","memo"],"mappings":";;;;;;;AAUA,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,IACjD,EAAE,UAAAM,GAAU,UAAAC,EAAS,IAAIC,EAAc,GACvCC,IAAgBH,KAAYC,GAE5BG,IAAsBD,IAAgB,IAAIP,GAC1CS,IAAqBF,IAAgB,MAAMN;AAG/C,SAAA,gBAAAS;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,WAAWR;AAAA,MACX,YAAYK;AAAA,MACZ,WAAWC;AAAA,MAEV,UAAA;AAAA,QAAMb,EAAA,IAAI,CAAC,EAAE,IAAAgB,GAAI,UAAAC,GAAU,aAAaC,GAAQ,OAAAC,KAASC,MACxD,gBAAAC;AAAA,UAACC;AAAA,UAAA;AAAA,YAEC,IAAAN;AAAA,YACA,UAAAf;AAAA,YACA,UAAUY;AAAA,YACV,OAAAO;AAAA,YACA,YAAYR;AAAA,YACZ,YAAAN;AAAA,YACA,QAAAY;AAAA,YACA,OAAAC;AAAA,YACA,UAAAF;AAAA,YACA,YAAYG,MAAUb,IAAa;AAAA,UAAA;AAAA,UAV9BS;AAAA,QAAA,CAYR;AAAA,QAEAd,KACC,gBAAAmB;AAAA,UAACE;AAAAA,UAAA;AAAA,YACC,YAAU;AAAA,YACV,OAAOhB;AAAA,YACP,YAAYK;AAAA,YACZ,UAAU;AAAA,YACV,OAAO;AAAA,YACP,aAAY;AAAA,YACZ,QAAQC;AAAA,YACR,SAASA;AAAA,YACT,aAAY;AAAA,YACZ,iBAAgB;AAAA,YAChB,SAASV;AAAA,YAET,UAAC,gBAAAkB,EAAAG,GAAA,EAAS,QAAQ,IAAI,SAAS,IAC7B,UAAA,gBAAAH,EAACI,GAAS,EAAA,OAAM,SAAQ,OAAO,IAAI,QAAQ,GAAI,CAAA,GACjD;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIR,GAEeC,IAAAC,EAAK5B,CAAQ;"}
+{"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;"}