@cuemath/leap 2.9.12-j4 → 2.9.12-j5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/features/auth/login/identifier-otp-form/identifier-otp-form.js +7 -7
  2. package/dist/features/auth/login/identifier-otp-form/identifier-otp-form.js.map +1 -1
  3. package/dist/features/auth/login/username-password-form/username-password-form.js +21 -19
  4. package/dist/features/auth/login/username-password-form/username-password-form.js.map +1 -1
  5. package/dist/index.d.ts +1 -1
  6. package/package.json +1 -1
package/dist/features/auth/login/identifier-otp-form/identifier-otp-form.js CHANGED
@@ -1,4 +1,4 @@
1
- import { jsx as e, jsxs as d, Fragment as k } from "react/jsx-runtime";
1
+ import { jsx as e, jsxs as o, Fragment as k } from "react/jsx-runtime";
2
2
  import y from "../../../ui/buttons/button/button.js";
3
3
  import c from "../../../ui/inputs/text-input/text-input.js";
4
4
  import n from "../../../ui/layout/flex-view.js";
@@ -19,8 +19,8 @@ const C = ({
19
19
  onSendOtp: p
20
20
  }) => {
21
21
  const b = t ? "success-dark" : "primary-dark", $ = i ? "success-dark" : "primary-dark";
22
- return /* @__PURE__ */ e(n, { $gutterX: 2, $gapX: 1.5, $background: "BLACK_2", $height: 308, children: /* @__PURE__ */ d(F, { onSubmit: h, children: [
23
- /* @__PURE__ */ d(n, { $alignItems: "center", $justifyContent: "center", children: [
22
+ return /* @__PURE__ */ e(n, { $gutterX: 2, $gapX: 1.5, $background: "BLACK_2", $height: 308, children: /* @__PURE__ */ o(F, { onSubmit: h, children: [
23
+ /* @__PURE__ */ o(n, { $alignItems: "center", $justifyContent: "center", children: [
24
24
  /* @__PURE__ */ e(
25
25
  c,
26
26
  {
@@ -28,7 +28,7 @@ const C = ({
28
28
  autoFocus: !0,
29
29
  label: "Email or Phone",
30
30
  value: f,
31
- onChange: (o) => m("identifier", o.target.value),
31
+ onChange: (d) => m("identifier", d.target.value),
32
32
  width: 330,
33
33
  required: !0,
34
34
  shape: "borderLess",
@@ -37,17 +37,17 @@ const C = ({
37
37
  siblingElement: /* @__PURE__ */ e(u, { isValid: t, isError: !!r.identifier })
38
38
  }
39
39
  ),
40
- t && /* @__PURE__ */ d(k, { children: [
40
+ t && /* @__PURE__ */ o(k, { children: [
41
41
  /* @__PURE__ */ e(s, { height: 36 }),
42
42
  /* @__PURE__ */ e(
43
43
  c,
44
44
  {
45
45
  type: "password",
46
- renderAs: r.otp ? "error" : $,
46
+ renderAs: r.otp ? "error-dark" : $,
47
47
  autoComplete: "password",
48
48
  label: "Verification code",
49
49
  value: l,
50
- onChange: (o) => m("otp", o.target.value),
50
+ onChange: (d) => m("otp", d.target.value),
51
51
  width: 330,
52
52
  required: !0,
53
53
  shape: "borderLess",
package/dist/features/auth/login/identifier-otp-form/identifier-otp-form.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"identifier-otp-form.js","sources":["../../../../../src/features/auth/login/identifier-otp-form/identifier-otp-form.tsx"],"sourcesContent":["// In @cuemath/leap/src/components/IdentifierOtpForm.tsx\n\nimport type { IIdentifierOtpFormProps } from './identifier-otp-form-types';\n\nimport React, { type ChangeEvent } from 'react';\n\nimport Button from '../../../ui/buttons/button/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 ResendOTP from '../../comps/resend-otp/resend-otp';\nimport * as Styled from './identifier-otp-form-styled';\n\nconst IdentifierOtpForm: React.FC<IIdentifierOtpFormProps> = ({\n identifier,\n otp,\n errors,\n isOtpVerified,\n isLoading,\n isSubmitDisabled,\n showOtpInput,\n onChange,\n onSubmit,\n onSendOtp,\n}) => {\n const identifierStatusVariant = showOtpInput ? 'success-dark' : 'primary-dark';\n const otpStatusVariant = isOtpVerified ? 'success-dark' : 'primary-dark';\n\n return (\n <FlexView $gutterX={2} $gapX={1.5} $background=\"BLACK_2\" $height={308}>\n <Styled.FormWrapper onSubmit={onSubmit}>\n <FlexView $alignItems=\"center\" $justifyContent=\"center\">\n <TextInput\n renderAs={errors.identifier ? 'error-dark' : identifierStatusVariant}\n autoFocus\n label=\"Email or Phone\"\n value={identifier}\n onChange={(e: ChangeEvent<HTMLInputElement>) => onChange('identifier', e.target.value)}\n width={330}\n required\n shape=\"borderLess\"\n errorMessage={errors.identifier}\n disabled={showOtpInput}\n siblingElement={\n <InputStatusIcon isValid={showOtpInput} isError={!!errors.identifier} />\n }\n />\n {showOtpInput && (\n <>\n <Separator height={36} />\n <TextInput\n type=\"password\"\n renderAs={errors.otp ? 'error' : otpStatusVariant}\n autoComplete=\"password\"\n label=\"Verification code\"\n value={otp}\n onChange={(e: ChangeEvent<HTMLInputElement>) => onChange('otp', e.target.value)}\n width={330}\n required\n shape=\"borderLess\"\n errorMessage={errors.otp}\n disabled={isOtpVerified || (otp.length === 4 && isLoading)}\n siblingElement={\n <InputStatusIcon\n isLoading={isLoading}\n isValid={isOtpVerified}\n isError={!!errors.otp}\n />\n }\n />\n <Separator heightX={1.25} />\n <FlexView $alignItems=\"flex-end\" $width=\"100%\">\n <ResendOTP onResendOTP={onSendOtp} disabled={isOtpVerified} />\n </FlexView>\n <Separator heightX={2} />\n </>\n )}\n </FlexView>\n <Button\n size=\"small\"\n renderAs=\"secondary-dark\"\n type=\"submit\"\n label={showOtpInput ? 'Log In' : 'Get Verification Code'}\n width={336}\n busy={!showOtpInput && isLoading}\n disabled={isSubmitDisabled}\n />\n </Styled.FormWrapper>\n </FlexView>\n );\n};\n\nexport default IdentifierOtpForm;\n"],"names":["IdentifierOtpForm","identifier","otp","errors","isOtpVerified","isLoading","isSubmitDisabled","showOtpInput","onChange","onSubmit","onSendOtp","identifierStatusVariant","otpStatusVariant","jsx","FlexView","jsxs","Styled.FormWrapper","TextInput","e","InputStatusIcon","Fragment","Separator","ResendOTP","Button","IdentifierOtpForm$1"],"mappings":";;;;;;;;AAcA,MAAMA,IAAuD,CAAC;AAAA,EAC5D,YAAAC;AAAA,EACA,KAAAC;AAAA,EACA,QAAAC;AAAA,EACA,eAAAC;AAAA,EACA,WAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AACF,MAAM;AACE,QAAAC,IAA0BJ,IAAe,iBAAiB,gBAC1DK,IAAmBR,IAAgB,iBAAiB;AAE1D,SACG,gBAAAS,EAAAC,GAAA,EAAS,UAAU,GAAG,OAAO,KAAK,aAAY,WAAU,SAAS,KAChE,UAAA,gBAAAC,EAACC,GAAA,EAAmB,UAAAP,GAClB,UAAA;AAAA,IAAA,gBAAAM,EAACD,GAAS,EAAA,aAAY,UAAS,iBAAgB,UAC7C,UAAA;AAAA,MAAA,gBAAAD;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,UAAUd,EAAO,aAAa,eAAeQ;AAAA,UAC7C,WAAS;AAAA,UACT,OAAM;AAAA,UACN,OAAOV;AAAA,UACP,UAAU,CAACiB,MAAqCV,EAAS,cAAcU,EAAE,OAAO,KAAK;AAAA,UACrF,OAAO;AAAA,UACP,UAAQ;AAAA,UACR,OAAM;AAAA,UACN,cAAcf,EAAO;AAAA,UACrB,UAAUI;AAAA,UACV,kCACGY,GAAgB,EAAA,SAASZ,GAAc,SAAS,CAAC,CAACJ,EAAO,YAAY;AAAA,QAAA;AAAA,MAE1E;AAAA,MACCI,KAEG,gBAAAQ,EAAAK,GAAA,EAAA,UAAA;AAAA,QAAC,gBAAAP,EAAAQ,GAAA,EAAU,QAAQ,GAAI,CAAA;AAAA,QACvB,gBAAAR;AAAA,UAACI;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,UAAUd,EAAO,MAAM,UAAUS;AAAA,YACjC,cAAa;AAAA,YACb,OAAM;AAAA,YACN,OAAOV;AAAA,YACP,UAAU,CAACgB,MAAqCV,EAAS,OAAOU,EAAE,OAAO,KAAK;AAAA,YAC9E,OAAO;AAAA,YACP,UAAQ;AAAA,YACR,OAAM;AAAA,YACN,cAAcf,EAAO;AAAA,YACrB,UAAUC,KAAkBF,EAAI,WAAW,KAAKG;AAAA,YAChD,gBACE,gBAAAQ;AAAA,cAACM;AAAA,cAAA;AAAA,gBACC,WAAAd;AAAA,gBACA,SAASD;AAAA,gBACT,SAAS,CAAC,CAACD,EAAO;AAAA,cAAA;AAAA,YACpB;AAAA,UAAA;AAAA,QAEJ;AAAA,QACA,gBAAAU,EAACQ,GAAU,EAAA,SAAS,KAAM,CAAA;AAAA,QACzB,gBAAAR,EAAAC,GAAA,EAAS,aAAY,YAAW,QAAO,QACtC,UAAC,gBAAAD,EAAAS,GAAA,EAAU,aAAaZ,GAAW,UAAUN,EAAe,CAAA,GAC9D;AAAA,QACA,gBAAAS,EAACQ,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,MAAA,GACzB;AAAA,IAAA,GAEJ;AAAA,IACA,gBAAAR;AAAA,MAACU;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,UAAS;AAAA,QACT,MAAK;AAAA,QACL,OAAOhB,IAAe,WAAW;AAAA,QACjC,OAAO;AAAA,QACP,MAAM,CAACA,KAAgBF;AAAA,QACvB,UAAUC;AAAA,MAAA;AAAA,IACZ;AAAA,EAAA,EACF,CAAA,EACF,CAAA;AAEJ,GAEAkB,IAAexB;"}
1
+ {"version":3,"file":"identifier-otp-form.js","sources":["../../../../../src/features/auth/login/identifier-otp-form/identifier-otp-form.tsx"],"sourcesContent":["// In @cuemath/leap/src/components/IdentifierOtpForm.tsx\n\nimport type { IIdentifierOtpFormProps } from './identifier-otp-form-types';\n\nimport React, { type ChangeEvent } from 'react';\n\nimport Button from '../../../ui/buttons/button/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 ResendOTP from '../../comps/resend-otp/resend-otp';\nimport * as Styled from './identifier-otp-form-styled';\n\nconst IdentifierOtpForm: React.FC<IIdentifierOtpFormProps> = ({\n identifier,\n otp,\n errors,\n isOtpVerified,\n isLoading,\n isSubmitDisabled,\n showOtpInput,\n onChange,\n onSubmit,\n onSendOtp,\n}) => {\n const identifierStatusVariant = showOtpInput ? 'success-dark' : 'primary-dark';\n const otpStatusVariant = isOtpVerified ? 'success-dark' : 'primary-dark';\n\n return (\n <FlexView $gutterX={2} $gapX={1.5} $background=\"BLACK_2\" $height={308}>\n <Styled.FormWrapper onSubmit={onSubmit}>\n <FlexView $alignItems=\"center\" $justifyContent=\"center\">\n <TextInput\n renderAs={errors.identifier ? 'error-dark' : identifierStatusVariant}\n autoFocus\n label=\"Email or Phone\"\n value={identifier}\n onChange={(e: ChangeEvent<HTMLInputElement>) => onChange('identifier', e.target.value)}\n width={330}\n required\n shape=\"borderLess\"\n errorMessage={errors.identifier}\n disabled={showOtpInput}\n siblingElement={\n <InputStatusIcon isValid={showOtpInput} isError={!!errors.identifier} />\n }\n />\n {showOtpInput && (\n <>\n <Separator height={36} />\n <TextInput\n type=\"password\"\n renderAs={errors.otp ? 'error-dark' : otpStatusVariant}\n autoComplete=\"password\"\n label=\"Verification code\"\n value={otp}\n onChange={(e: ChangeEvent<HTMLInputElement>) => onChange('otp', e.target.value)}\n width={330}\n required\n shape=\"borderLess\"\n errorMessage={errors.otp}\n disabled={isOtpVerified || (otp.length === 4 && isLoading)}\n siblingElement={\n <InputStatusIcon\n isLoading={isLoading}\n isValid={isOtpVerified}\n isError={!!errors.otp}\n />\n }\n />\n <Separator heightX={1.25} />\n <FlexView $alignItems=\"flex-end\" $width=\"100%\">\n <ResendOTP onResendOTP={onSendOtp} disabled={isOtpVerified} />\n </FlexView>\n <Separator heightX={2} />\n </>\n )}\n </FlexView>\n <Button\n size=\"small\"\n renderAs=\"secondary-dark\"\n type=\"submit\"\n label={showOtpInput ? 'Log In' : 'Get Verification Code'}\n width={336}\n busy={!showOtpInput && isLoading}\n disabled={isSubmitDisabled}\n />\n </Styled.FormWrapper>\n </FlexView>\n );\n};\n\nexport default IdentifierOtpForm;\n"],"names":["IdentifierOtpForm","identifier","otp","errors","isOtpVerified","isLoading","isSubmitDisabled","showOtpInput","onChange","onSubmit","onSendOtp","identifierStatusVariant","otpStatusVariant","jsx","FlexView","jsxs","Styled.FormWrapper","TextInput","e","InputStatusIcon","Fragment","Separator","ResendOTP","Button","IdentifierOtpForm$1"],"mappings":";;;;;;;;AAcA,MAAMA,IAAuD,CAAC;AAAA,EAC5D,YAAAC;AAAA,EACA,KAAAC;AAAA,EACA,QAAAC;AAAA,EACA,eAAAC;AAAA,EACA,WAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,cAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AACF,MAAM;AACE,QAAAC,IAA0BJ,IAAe,iBAAiB,gBAC1DK,IAAmBR,IAAgB,iBAAiB;AAE1D,SACG,gBAAAS,EAAAC,GAAA,EAAS,UAAU,GAAG,OAAO,KAAK,aAAY,WAAU,SAAS,KAChE,UAAA,gBAAAC,EAACC,GAAA,EAAmB,UAAAP,GAClB,UAAA;AAAA,IAAA,gBAAAM,EAACD,GAAS,EAAA,aAAY,UAAS,iBAAgB,UAC7C,UAAA;AAAA,MAAA,gBAAAD;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,UAAUd,EAAO,aAAa,eAAeQ;AAAA,UAC7C,WAAS;AAAA,UACT,OAAM;AAAA,UACN,OAAOV;AAAA,UACP,UAAU,CAACiB,MAAqCV,EAAS,cAAcU,EAAE,OAAO,KAAK;AAAA,UACrF,OAAO;AAAA,UACP,UAAQ;AAAA,UACR,OAAM;AAAA,UACN,cAAcf,EAAO;AAAA,UACrB,UAAUI;AAAA,UACV,kCACGY,GAAgB,EAAA,SAASZ,GAAc,SAAS,CAAC,CAACJ,EAAO,YAAY;AAAA,QAAA;AAAA,MAE1E;AAAA,MACCI,KAEG,gBAAAQ,EAAAK,GAAA,EAAA,UAAA;AAAA,QAAC,gBAAAP,EAAAQ,GAAA,EAAU,QAAQ,GAAI,CAAA;AAAA,QACvB,gBAAAR;AAAA,UAACI;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,UAAUd,EAAO,MAAM,eAAeS;AAAA,YACtC,cAAa;AAAA,YACb,OAAM;AAAA,YACN,OAAOV;AAAA,YACP,UAAU,CAACgB,MAAqCV,EAAS,OAAOU,EAAE,OAAO,KAAK;AAAA,YAC9E,OAAO;AAAA,YACP,UAAQ;AAAA,YACR,OAAM;AAAA,YACN,cAAcf,EAAO;AAAA,YACrB,UAAUC,KAAkBF,EAAI,WAAW,KAAKG;AAAA,YAChD,gBACE,gBAAAQ;AAAA,cAACM;AAAA,cAAA;AAAA,gBACC,WAAAd;AAAA,gBACA,SAASD;AAAA,gBACT,SAAS,CAAC,CAACD,EAAO;AAAA,cAAA;AAAA,YACpB;AAAA,UAAA;AAAA,QAEJ;AAAA,QACA,gBAAAU,EAACQ,GAAU,EAAA,SAAS,KAAM,CAAA;AAAA,QACzB,gBAAAR,EAAAC,GAAA,EAAS,aAAY,YAAW,QAAO,QACtC,UAAC,gBAAAD,EAAAS,GAAA,EAAU,aAAaZ,GAAW,UAAUN,EAAe,CAAA,GAC9D;AAAA,QACA,gBAAAS,EAACQ,GAAU,EAAA,SAAS,EAAG,CAAA;AAAA,MAAA,GACzB;AAAA,IAAA,GAEJ;AAAA,IACA,gBAAAR;AAAA,MAACU;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,UAAS;AAAA,QACT,MAAK;AAAA,QACL,OAAOhB,IAAe,WAAW;AAAA,QACjC,OAAO;AAAA,QACP,MAAM,CAACA,KAAgBF;AAAA,QACvB,UAAUC;AAAA,MAAA;AAAA,IACZ;AAAA,EAAA,EACF,CAAA,EACF,CAAA;AAEJ,GAEAkB,IAAexB;"}
package/dist/features/auth/login/username-password-form/username-password-form.js CHANGED
@@ -1,20 +1,21 @@
1
- import { jsxs as o, jsx as e } from "react/jsx-runtime";
1
+ import { jsxs as a, jsx as e } from "react/jsx-runtime";
2
2
  import c from "../../../ui/buttons/button/button.js";
3
3
  import g from "../../../ui/buttons/text-button/text-button.js";
4
4
  import l from "../../../ui/inputs/text-input/text-input.js";
5
5
  import t from "../../../ui/layout/flex-view.js";
6
- import a from "../../../ui/separator/separator.js";
7
- const b = ({
6
+ import s from "../../../ui/separator/separator.js";
7
+ import b from "../../comps/input-status-icon/input-status-icon.js";
8
+ const f = ({
8
9
  username: n,
9
10
  password: i,
10
11
  errors: r,
11
- isProcessing: d,
12
- onChange: m,
12
+ isLoading: m,
13
+ onChange: d,
13
14
  onSubmit: u,
14
15
  onForgotPassword: p
15
16
  }) => {
16
- const h = d || !n.trim() || !i.trim();
17
- return /* @__PURE__ */ o(
17
+ const h = m || !n.trim() || !i.trim();
18
+ return /* @__PURE__ */ a(
18
19
  t,
19
20
  {
20
21
  $gutterX: 2,
@@ -24,9 +25,9 @@ const b = ({
24
25
  $background: "BLACK_2",
25
26
  $height: 308,
26
27
  children: [
27
- /* @__PURE__ */ e(a, { heightX: 0.5 }),
28
- /* @__PURE__ */ o("form", { onSubmit: u, children: [
29
- /* @__PURE__ */ o(t, { $alignItems: "center", $justifyContent: "center", children: [
28
+ /* @__PURE__ */ e(s, { heightX: 0.5 }),
29
+ /* @__PURE__ */ a("form", { onSubmit: u, children: [
30
+ /* @__PURE__ */ a(t, { $alignItems: "center", $justifyContent: "center", children: [
30
31
  /* @__PURE__ */ e(
31
32
  l,
32
33
  {
@@ -35,14 +36,14 @@ const b = ({
35
36
  autoComplete: "username",
36
37
  label: "Username",
37
38
  value: n,
38
- onChange: (s) => m("username", s.target.value),
39
+ onChange: (o) => d("username", o.target.value),
39
40
  width: 330,
40
41
  required: !0,
41
42
  shape: "borderLess",
42
43
  errorMessage: r.username
43
44
  }
44
45
  ),
45
- /* @__PURE__ */ e(a, { height: 36 }),
46
+ /* @__PURE__ */ e(s, { height: 36 }),
46
47
  /* @__PURE__ */ e(
47
48
  l,
48
49
  {
@@ -51,17 +52,18 @@ const b = ({
51
52
  autoComplete: "password",
52
53
  label: "Password",
53
54
  value: i,
54
- onChange: (s) => m("password", s.target.value),
55
+ onChange: (o) => d("password", o.target.value),
55
56
  width: 330,
56
57
  required: !0,
57
58
  shape: "borderLess",
58
- errorMessage: r.password
59
+ errorMessage: r.password,
60
+ siblingElement: /* @__PURE__ */ e(b, { isError: !!r.password })
59
61
  }
60
62
  )
61
63
  ] }),
62
- /* @__PURE__ */ e(a, { heightX: 1.25 }),
64
+ /* @__PURE__ */ e(s, { heightX: 1.25 }),
63
65
  /* @__PURE__ */ e(t, { $alignItems: "flex-end", children: /* @__PURE__ */ e(g, { label: "Forgot Password?", onClick: p, color: "WHITE_T_60" }) }),
64
- /* @__PURE__ */ e(a, { heightX: 2 }),
66
+ /* @__PURE__ */ e(s, { heightX: 2 }),
65
67
  /* @__PURE__ */ e(t, { $justifyContent: "center", children: /* @__PURE__ */ e(
66
68
  c,
67
69
  {
@@ -70,7 +72,7 @@ const b = ({
70
72
  type: "submit",
71
73
  label: "Log in",
72
74
  width: 336,
73
- busy: d,
75
+ busy: m,
74
76
  disabled: h
75
77
  }
76
78
  ) })
@@ -78,8 +80,8 @@ const b = ({
78
80
  ]
79
81
  }
80
82
  );
81
- }, x = b;
83
+ }, j = f;
82
84
  export {
83
- x as default
85
+ j as default
84
86
  };
85
87
  //# sourceMappingURL=username-password-form.js.map
package/dist/features/auth/login/username-password-form/username-password-form.js.map CHANGED
@@ -1 +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 } 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';\n\nconst UsernamePasswordForm: FC<IUsernamePasswordFormProps> = ({\n username,\n password,\n errors,\n isProcessing,\n onChange,\n onSubmit,\n onForgotPassword,\n}) => {\n const isSubmitDisabled = isProcessing || !username.trim() || !password.trim();\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={(e: ChangeEvent<HTMLInputElement>) => onChange('username', e.target.value)}\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={(e: ChangeEvent<HTMLInputElement>) => onChange('password', e.target.value)}\n width={330}\n required\n shape=\"borderLess\"\n errorMessage={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={isProcessing}\n disabled={isSubmitDisabled}\n />\n </FlexView>\n </form>\n </FlexView>\n );\n};\n\nexport default UsernamePasswordForm;\n"],"names":["UsernamePasswordForm","username","password","errors","isProcessing","onChange","onSubmit","onForgotPassword","isSubmitDisabled","jsxs","FlexView","jsx","Separator","TextInput","e","TextButton","Button","UsernamePasswordForm$1"],"mappings":";;;;;;AAUA,MAAMA,IAAuD,CAAC;AAAA,EAC5D,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,cAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,kBAAAC;AACF,MAAM;AACE,QAAAC,IAAmBJ,KAAgB,CAACH,EAAS,UAAU,CAACC,EAAS;AAGrE,SAAA,gBAAAO;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,UAAAH,GACJ,UAAA;AAAA,UAAA,gBAAAG,EAACC,GAAS,EAAA,aAAY,UAAS,iBAAgB,UAC7C,UAAA;AAAA,YAAA,gBAAAC;AAAA,cAACE;AAAA,cAAA;AAAA,gBACC,UAAUV,EAAO,WAAW,eAAe;AAAA,gBAC3C,WAAS;AAAA,gBACT,cAAa;AAAA,gBACb,OAAM;AAAA,gBACN,OAAOF;AAAA,gBACP,UAAU,CAACa,MAAqCT,EAAS,YAAYS,EAAE,OAAO,KAAK;AAAA,gBACnF,OAAO;AAAA,gBACP,UAAQ;AAAA,gBACR,OAAM;AAAA,gBACN,cAAcX,EAAO;AAAA,cAAA;AAAA,YACvB;AAAA,YACA,gBAAAQ,EAACC,GAAU,EAAA,QAAQ,GAAI,CAAA;AAAA,YACvB,gBAAAD;AAAA,cAACE;AAAA,cAAA;AAAA,gBACC,MAAK;AAAA,gBACL,UAAUV,EAAO,WAAW,eAAe;AAAA,gBAC3C,cAAa;AAAA,gBACb,OAAM;AAAA,gBACN,OAAOD;AAAA,gBACP,UAAU,CAACY,MAAqCT,EAAS,YAAYS,EAAE,OAAO,KAAK;AAAA,gBACnF,OAAO;AAAA,gBACP,UAAQ;AAAA,gBACR,OAAM;AAAA,gBACN,cAAcX,EAAO;AAAA,cAAA;AAAA,YACvB;AAAA,UAAA,GACF;AAAA,UACA,gBAAAQ,EAACC,GAAU,EAAA,SAAS,KAAM,CAAA;AAAA,UACzB,gBAAAD,EAAAD,GAAA,EAAS,aAAY,YACpB,UAAC,gBAAAC,EAAAI,GAAA,EAAW,OAAM,oBAAmB,SAASR,GAAkB,OAAM,aAAa,CAAA,GACrF;AAAA,UACA,gBAAAI,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,MAAMZ;AAAA,cACN,UAAUI;AAAA,YAAA;AAAA,UAAA,GAEd;AAAA,QAAA,GACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN,GAEAS,IAAejB;"}
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 } 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 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={(e: ChangeEvent<HTMLInputElement>) => onChange('username', e.target.value)}\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={(e: ChangeEvent<HTMLInputElement>) => onChange('password', e.target.value)}\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 UsernamePasswordForm;\n"],"names":["UsernamePasswordForm","username","password","errors","isLoading","onChange","onSubmit","onForgotPassword","isSubmitDisabled","jsxs","FlexView","jsx","Separator","TextInput","e","InputStatusIcon","TextButton","Button","UsernamePasswordForm$1"],"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;AAGlE,SAAA,gBAAAO;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,UAAAH,GACJ,UAAA;AAAA,UAAA,gBAAAG,EAACC,GAAS,EAAA,aAAY,UAAS,iBAAgB,UAC7C,UAAA;AAAA,YAAA,gBAAAC;AAAA,cAACE;AAAA,cAAA;AAAA,gBACC,UAAUV,EAAO,WAAW,eAAe;AAAA,gBAC3C,WAAS;AAAA,gBACT,cAAa;AAAA,gBACb,OAAM;AAAA,gBACN,OAAOF;AAAA,gBACP,UAAU,CAACa,MAAqCT,EAAS,YAAYS,EAAE,OAAO,KAAK;AAAA,gBACnF,OAAO;AAAA,gBACP,UAAQ;AAAA,gBACR,OAAM;AAAA,gBACN,cAAcX,EAAO;AAAA,cAAA;AAAA,YACvB;AAAA,YACA,gBAAAQ,EAACC,GAAU,EAAA,QAAQ,GAAI,CAAA;AAAA,YACvB,gBAAAD;AAAA,cAACE;AAAA,cAAA;AAAA,gBACC,MAAK;AAAA,gBACL,UAAUV,EAAO,WAAW,eAAe;AAAA,gBAC3C,cAAa;AAAA,gBACb,OAAM;AAAA,gBACN,OAAOD;AAAA,gBACP,UAAU,CAACY,MAAqCT,EAAS,YAAYS,EAAE,OAAO,KAAK;AAAA,gBACnF,OAAO;AAAA,gBACP,UAAQ;AAAA,gBACR,OAAM;AAAA,gBACN,cAAcX,EAAO;AAAA,gBACrB,gBAAiB,gBAAAQ,EAAAI,GAAA,EAAgB,SAAS,CAAC,CAACZ,EAAO,UAAU;AAAA,cAAA;AAAA,YAC/D;AAAA,UAAA,GACF;AAAA,UACA,gBAAAQ,EAACC,GAAU,EAAA,SAAS,KAAM,CAAA;AAAA,UACzB,gBAAAD,EAAAD,GAAA,EAAS,aAAY,YACpB,UAAC,gBAAAC,EAAAK,GAAA,EAAW,OAAM,oBAAmB,SAAST,GAAkB,OAAM,aAAa,CAAA,GACrF;AAAA,UACA,gBAAAI,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,OAAO;AAAA,cACP,MAAMb;AAAA,cACN,UAAUI;AAAA,YAAA;AAAA,UAAA,GAEd;AAAA,QAAA,GACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN,GAEAU,IAAelB;"}
package/dist/index.d.ts CHANGED
@@ -3328,7 +3328,7 @@ declare interface IUsernamePasswordFormProps {
3328
3328
  username: string;
3329
3329
  password: string;
3330
3330
  };
3331
- isProcessing: boolean;
3331
+ isLoading: boolean;
3332
3332
  onChange: (key: 'username' | 'password', value: string) => void;
3333
3333
  onSubmit: (e: FormEvent<HTMLFormElement>) => void;
3334
3334
  onForgotPassword: () => void;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cuemath/leap",
3
- "version": "2.9.12-j4",
3
+ "version": "2.9.12-j5",
4
4
  "type": "module",
5
5
  "files": [
6
6
  "dist"