@coinbase/cdp-react 0.0.85 → 0.0.87

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 (107) hide show
  1. package/dist/assets/CDPReactProvider.css +1 -1
  2. package/dist/assets/EnrollMfaFlow.css +1 -1
  3. package/dist/assets/VerifyMfaFlow.css +1 -1
  4. package/dist/assets/VerifyMfaFlowBackButton.css +1 -0
  5. package/dist/assets/VerifyMfaInline.css +1 -1
  6. package/dist/assets/VerifyMfaItem.css +1 -0
  7. package/dist/assets/VerifyMfaItems.css +1 -0
  8. package/dist/assets/sms.css +1 -0
  9. package/dist/chunks/CDPReactProvider.C38bKQ2x.js +337 -0
  10. package/dist/chunks/{LinkAuthFlow.BaUSMzGH.js → LinkAuthFlow.CLubKoY0.js} +13 -13
  11. package/dist/chunks/{index.C_DV0Ud7.js → index.BN39qScu.js} +1 -1
  12. package/dist/chunks/index.BX4k-ruQ.js +12 -0
  13. package/dist/chunks/index.Bgx0-QLY.js +12 -0
  14. package/dist/components/CDPReactProvider/index.js +1 -1
  15. package/dist/components/EnrollMfa/EnrollMfaDescription.js +4 -3
  16. package/dist/components/EnrollMfa/EnrollMfaFlow.js +27 -26
  17. package/dist/components/EnrollMfa/EnrollMfaFlowBackButton.js +7 -6
  18. package/dist/components/EnrollMfa/EnrollMfaFlowProvider.d.ts +1 -1
  19. package/dist/components/EnrollMfa/EnrollMfaFlowProvider.js +5 -4
  20. package/dist/components/EnrollMfa/EnrollMfaImage.js +7 -6
  21. package/dist/components/EnrollMfa/EnrollMfaItem.js +7 -6
  22. package/dist/components/EnrollMfa/EnrollMfaItems.js +28 -25
  23. package/dist/components/EnrollMfa/EnrollMfaProvider.js +22 -17
  24. package/dist/components/EnrollMfa/EnrollMfaTitle.js +8 -7
  25. package/dist/components/EnrollMfa/index.js +138 -123
  26. package/dist/components/EnrollMfa/methods/sms.d.ts +6 -0
  27. package/dist/components/EnrollMfa/methods/sms.js +148 -0
  28. package/dist/components/EnrollMfa/methods/totp.js +24 -19
  29. package/dist/components/EnrollMfa/types.d.ts +17 -5
  30. package/dist/components/EnrollMfa/types.js +1 -0
  31. package/dist/components/EnrollMfa/useEnrollMfaReducer.js +51 -38
  32. package/dist/components/EnrollMfaModal/index.js +1 -1
  33. package/dist/components/ExportWallet/index.js +109 -101
  34. package/dist/components/ExportWalletModal/index.js +1 -1
  35. package/dist/components/Fund/index.js +1 -1
  36. package/dist/components/FundModal/index.js +1 -1
  37. package/dist/components/LinkAuth/LinkAuthFlow.js +2 -2
  38. package/dist/components/LinkAuth/LinkAuthFlowBackButton.js +2 -2
  39. package/dist/components/LinkAuth/LinkAuthFlowProvider.js +2 -2
  40. package/dist/components/LinkAuth/LinkAuthItem.js +1 -1
  41. package/dist/components/LinkAuth/LinkAuthItems.js +1 -1
  42. package/dist/components/LinkAuth/LinkAuthProvider.js +1 -1
  43. package/dist/components/LinkAuth/index.js +59 -60
  44. package/dist/components/LinkAuth/types.js +1 -1
  45. package/dist/components/LinkAuth/utils.js +1 -1
  46. package/dist/components/LinkAuthModal/index.js +2 -2
  47. package/dist/components/OAuthStatusModal/index.js +1 -1
  48. package/dist/components/SignIn/SignInAuthMethodButtons.js +1 -1
  49. package/dist/components/SignIn/SignInBackButton.js +12 -12
  50. package/dist/components/SignIn/SignInDescription.js +2 -2
  51. package/dist/components/SignIn/SignInForm.js +2 -2
  52. package/dist/components/SignIn/SignInImage.js +1 -1
  53. package/dist/components/SignIn/SignInProvider.js +1 -1
  54. package/dist/components/SignIn/SignInTitle.js +2 -2
  55. package/dist/components/SignIn/flows/SignInWithEmail.js +1 -1
  56. package/dist/components/SignIn/flows/SignInWithOAuth.js +1 -1
  57. package/dist/components/SignIn/flows/SignInWithSms.js +74 -84
  58. package/dist/components/SignIn/index.js +1 -1
  59. package/dist/components/SignIn/types.d.ts +2 -0
  60. package/dist/components/SignIn/types.js +1 -1
  61. package/dist/components/SignIn/useSignInReducer.js +20 -6
  62. package/dist/components/SignInModal/index.js +1 -1
  63. package/dist/components/VerifyMfa/VerifyMfaDescription.d.ts +1 -1
  64. package/dist/components/VerifyMfa/VerifyMfaDescription.js +24 -14
  65. package/dist/components/VerifyMfa/VerifyMfaFlow.d.ts +5 -4
  66. package/dist/components/VerifyMfa/VerifyMfaFlow.js +52 -13
  67. package/dist/components/VerifyMfa/VerifyMfaFlowBackButton.d.ts +9 -0
  68. package/dist/components/VerifyMfa/VerifyMfaFlowBackButton.js +40 -0
  69. package/dist/components/VerifyMfa/VerifyMfaFlowProvider.d.ts +23 -0
  70. package/dist/components/VerifyMfa/VerifyMfaFlowProvider.js +37 -0
  71. package/dist/components/VerifyMfa/VerifyMfaImage.d.ts +1 -1
  72. package/dist/components/VerifyMfa/VerifyMfaImage.js +25 -13
  73. package/dist/components/VerifyMfa/VerifyMfaItem.d.ts +10 -0
  74. package/dist/components/VerifyMfa/VerifyMfaItem.js +27 -0
  75. package/dist/components/VerifyMfa/VerifyMfaItems.d.ts +9 -0
  76. package/dist/components/VerifyMfa/VerifyMfaItems.js +31 -0
  77. package/dist/components/VerifyMfa/VerifyMfaProvider.js +27 -14
  78. package/dist/components/VerifyMfa/VerifyMfaTitle.d.ts +1 -1
  79. package/dist/components/VerifyMfa/VerifyMfaTitle.js +23 -13
  80. package/dist/components/VerifyMfa/index.d.ts +6 -2
  81. package/dist/components/VerifyMfa/index.js +23 -14
  82. package/dist/components/VerifyMfa/methods/sms.d.ts +6 -0
  83. package/dist/components/VerifyMfa/methods/sms.js +90 -0
  84. package/dist/components/VerifyMfa/methods/totp.js +40 -39
  85. package/dist/components/VerifyMfa/types.d.ts +21 -2
  86. package/dist/components/VerifyMfa/types.js +1 -0
  87. package/dist/components/VerifyMfa/useVerifyMfaReducer.d.ts +2 -1
  88. package/dist/components/VerifyMfa/useVerifyMfaReducer.js +29 -4
  89. package/dist/components/VerifyMfaInline/index.d.ts +1 -1
  90. package/dist/components/VerifyMfaInline/index.js +133 -116
  91. package/dist/components/VerifyMfaModal/index.js +7 -5
  92. package/dist/components/ui/SwitchTransition/index.js +3 -3
  93. package/dist/hooks/usePhoneNumberState.d.ts +15 -0
  94. package/dist/hooks/usePhoneNumberState.js +39 -0
  95. package/dist/hooks/useTimeout.d.ts +4 -0
  96. package/dist/hooks/useTimeout.js +16 -0
  97. package/dist/hooks/useTransitionMap.js +58 -50
  98. package/dist/hooks/useVerifyMfaModal.js +1 -1
  99. package/dist/index.js +59 -51
  100. package/dist/utils/transition.d.ts +3 -3
  101. package/dist/utils/transition.js +21 -20
  102. package/dist/version.d.ts +1 -1
  103. package/dist/version.js +1 -1
  104. package/package.json +6 -6
  105. package/dist/chunks/CDPReactProvider.CIQm4C4z.js +0 -299
  106. package/dist/chunks/index.CKQKBoX2.js +0 -9
  107. package/dist/chunks/index.Dp-lIxM1.js +0 -9
@@ -1,15 +1,16 @@
1
1
  import { jsx as a } from "react/jsx-runtime";
2
2
  import { createContext as u, useContext as i, useMemo as c } from "react";
3
+ import "@coinbase/cdp-core";
3
4
  import "@coinbase/cdp-hooks";
4
5
  const l = u(null), f = () => {
5
6
  const o = i(l);
6
7
  if (!o)
7
8
  throw new Error("useEnrollMfaFlowInternal must be used within a EnrollMfaFlowContext.Provider");
8
9
  return o;
9
- }, E = () => {
10
+ }, M = () => {
10
11
  const { transitionRef: o, ...t } = f();
11
12
  return t;
12
- }, M = ({
13
+ }, F = ({
13
14
  children: o,
14
15
  onBack: t,
15
16
  onStartEnrollment: r,
@@ -28,7 +29,7 @@ const l = u(null), f = () => {
28
29
  return /* @__PURE__ */ a(l.Provider, { value: s, children: o });
29
30
  };
30
31
  export {
31
- M as EnrollMfaFlowProvider,
32
- E as useEnrollMfaFlow,
32
+ F as EnrollMfaFlowProvider,
33
+ M as useEnrollMfaFlow,
33
34
  f as useEnrollMfaFlowInternal
34
35
  };
@@ -1,9 +1,10 @@
1
- import { jsx as m } from "react/jsx-runtime";
1
+ import { jsx as e } from "react/jsx-runtime";
2
2
  import "react";
3
3
  import { useEnrollMfaContext as l } from "./EnrollMfaProvider.js";
4
- import { m as c } from "../../chunks/index.CKQKBoX2.js";
4
+ import { m as c } from "../../chunks/index.Bgx0-QLY.js";
5
+ import "@coinbase/cdp-core";
5
6
  import "@coinbase/cdp-hooks";
6
- const M = ({
7
+ const u = ({
7
8
  as: r = "div",
8
9
  children: t,
9
10
  className: s = "",
@@ -11,9 +12,9 @@ const M = ({
11
12
  step: p,
12
13
  ...a
13
14
  }) => {
14
- const { state: o } = l(), i = p || o.step, e = n || o.method, f = c[e].image;
15
- return /* @__PURE__ */ m(r, { className: s, ...a, children: t || /* @__PURE__ */ m(f, { step: i, method: e }) });
15
+ const { state: o } = l(), i = p || o.step, m = n || o.method, f = c[m].image;
16
+ return /* @__PURE__ */ e(r, { className: s, ...a, children: t || /* @__PURE__ */ e(f, { step: i, method: m }) });
16
17
  };
17
18
  export {
18
- M as EnrollMfaImage
19
+ u as EnrollMfaImage
19
20
  };
@@ -1,21 +1,22 @@
1
- import { jsx as m } from "react/jsx-runtime";
1
+ import { jsx as n } from "react/jsx-runtime";
2
2
  import { useCurrentUser as l } from "@coinbase/cdp-hooks";
3
3
  import "react";
4
4
  import { ToggleListItem as a } from "../ui/ToggleListItem/index.js";
5
- const u = ({ method: e, icon: o, label: s, isPending: n, onSetUp: i }) => {
5
+ import "@coinbase/cdp-core";
6
+ const A = ({ method: e, icon: o, label: s, isPending: i, onSetUp: m }) => {
6
7
  const { currentUser: t } = l(), r = t?.mfaMethods?.[e]?.enrolledAt ? Date.now() > new Date(t.mfaMethods[e].enrolledAt).getTime() : !1;
7
- return /* @__PURE__ */ m(
8
+ return /* @__PURE__ */ n(
8
9
  a,
9
10
  {
10
11
  icon: o,
11
12
  label: s,
12
13
  isActive: r,
13
- isPending: n,
14
- onActivate: i,
14
+ isPending: i,
15
+ onActivate: m,
15
16
  isDisabled: r
16
17
  }
17
18
  );
18
19
  };
19
20
  export {
20
- u as EnrollMfaItem
21
+ A as EnrollMfaItem
21
22
  };
@@ -1,39 +1,42 @@
1
- import { jsx as n } from "react/jsx-runtime";
1
+ import { jsx as t } from "react/jsx-runtime";
2
2
  import { c as u } from "../../chunks/lite.1fxw3LjI.js";
3
- import { useMemo as d } from "react";
4
- import { IconPinCode as I } from "../../icons/IconPinCode.js";
5
- import { EnrollMfaItem as M } from "./EnrollMfaItem.js";
6
- import { useEnrollMfaContext as E } from "./EnrollMfaProvider.js";
3
+ import { useMemo as I } from "react";
4
+ import { IconPhone as M } from "../../icons/IconPhone.js";
5
+ import { IconPinCode as d } from "../../icons/IconPinCode.js";
6
+ import { EnrollMfaItem as E } from "./EnrollMfaItem.js";
7
+ import { useEnrollMfaContext as P } from "./EnrollMfaProvider.js";
8
+ import "@coinbase/cdp-core";
7
9
  import "@coinbase/cdp-hooks";
8
10
  import '../../assets/EnrollMfaItems.css';const _ = "EnrollMfaItems-module__list___5ZZmE", x = {
9
11
  list: _
10
- }, P = {
11
- totp: { Icon: /* @__PURE__ */ n(I, {}), label: "Authenticator app" }
12
- }, w = ({ children: l, className: m = "", onSetUp: s, ...c }) => {
13
- const { state: a } = E(), { methods: r, method: i, isPending: e } = a, p = d(() => r.map((t) => {
14
- const { Icon: o, label: f } = P[t];
12
+ }, b = {
13
+ totp: { Icon: /* @__PURE__ */ t(d, {}), label: "Authenticator app" },
14
+ sms: { Icon: /* @__PURE__ */ t(M, {}), label: "SMS" }
15
+ }, N = ({ children: l, className: m = "", onSetUp: r, ...c }) => {
16
+ const { state: a } = P(), { methods: s, method: i, isPending: e } = a, p = I(() => s.map((o) => {
17
+ const { Icon: n, label: f } = b[o];
15
18
  return {
16
- method: t,
17
- icon: o,
19
+ method: o,
20
+ icon: n,
18
21
  label: f,
19
22
  onSetUp: async () => {
20
- await s?.(t);
23
+ await r?.(o);
21
24
  }
22
25
  };
23
- }), [r, s]);
24
- return /* @__PURE__ */ n("ul", { className: u(x.list, m), ...c, children: p.map(({ method: t, ...o }) => /* @__PURE__ */ n("li", { children: l?.({
25
- ...o,
26
- method: t,
27
- isPending: e && i === t
28
- }) || /* @__PURE__ */ n(
29
- M,
26
+ }), [s, r]);
27
+ return /* @__PURE__ */ t("ul", { className: u(x.list, m), ...c, children: p.map(({ method: o, ...n }) => /* @__PURE__ */ t("li", { children: l?.({
28
+ ...n,
29
+ method: o,
30
+ isPending: e && i === o
31
+ }) || /* @__PURE__ */ t(
32
+ E,
30
33
  {
31
- ...o,
32
- method: t,
33
- isPending: e && i === t
34
+ ...n,
35
+ method: o,
36
+ isPending: e && i === o
34
37
  }
35
- ) }, t)) });
38
+ ) }, o)) });
36
39
  };
37
40
  export {
38
- w as EnrollMfaItems
41
+ N as EnrollMfaItems
39
42
  };
@@ -1,24 +1,29 @@
1
- import { jsx as i } from "react/jsx-runtime";
2
- import { createContext as u, useContext as a, useMemo as f } from "react";
1
+ import { jsx as f } from "react/jsx-runtime";
2
+ import { createContext as s, useContext as a, useEffect as u, useMemo as c } from "react";
3
+ import "@coinbase/cdp-core";
3
4
  import "@coinbase/cdp-hooks";
4
- import { useEnrollMfaReducer as m } from "./useEnrollMfaReducer.js";
5
- const n = u(null), p = () => {
6
- const t = a(n);
7
- if (!t)
5
+ import { useEnrollMfaReducer as p } from "./useEnrollMfaReducer.js";
6
+ const i = s(null), C = () => {
7
+ const o = a(i);
8
+ if (!o)
8
9
  throw new Error("useEnrollMfaContext must be used within EnrollMfaProvider");
9
- return t;
10
- }, E = ({
11
- children: t,
12
- onEnrollSuccess: o,
13
- methods: s
10
+ return o;
11
+ }, v = ({
12
+ children: o,
13
+ onEnrollSuccess: n,
14
+ methods: t
14
15
  }) => {
15
- const [r, e] = m(s), l = f(
16
- () => ({ state: r, dispatch: e, onEnrollSuccess: o }),
17
- [r, e, o]
16
+ const [r, e] = p(t);
17
+ u(() => {
18
+ t && t.join(",") !== r.methods.join(",") && e({ type: "SET_METHODS", payload: { methods: t } });
19
+ }, [t, e, r.methods]);
20
+ const l = c(
21
+ () => ({ state: r, dispatch: e, onEnrollSuccess: n }),
22
+ [r, e, n]
18
23
  );
19
- return /* @__PURE__ */ i(n.Provider, { value: l, children: t });
24
+ return /* @__PURE__ */ f(i.Provider, { value: l, children: o });
20
25
  };
21
26
  export {
22
- E as EnrollMfaProvider,
23
- p as useEnrollMfaContext
27
+ v as EnrollMfaProvider,
28
+ C as useEnrollMfaContext
24
29
  };
@@ -1,21 +1,22 @@
1
1
  import { jsx as t, Fragment as h } from "react/jsx-runtime";
2
2
  import "react";
3
3
  import { useEnrollMfaContext as p } from "./EnrollMfaProvider.js";
4
- import { m as f } from "../../chunks/index.CKQKBoX2.js";
4
+ import { m as f } from "../../chunks/index.Bgx0-QLY.js";
5
+ import "@coinbase/cdp-core";
5
6
  import "@coinbase/cdp-hooks";
6
7
  import '../../assets/EnrollMfaTitle.css';const g = "EnrollMfaTitle-module__heading___ogrZZ", u = {
7
8
  heading: g
8
- }, y = ({
9
- as: s = "h2",
10
- children: i,
11
- className: r = "",
9
+ }, C = ({
10
+ as: i = "h2",
11
+ children: r,
12
+ className: s = "",
12
13
  method: l,
13
14
  step: m,
14
15
  ...a
15
16
  }) => {
16
17
  const { state: o } = p(), e = m || o.step, n = l || o.method, c = f[n].title, d = e === "list" ? /* @__PURE__ */ t(h, { children: "Add multi-factor authentication" }) : /* @__PURE__ */ t(c, { step: e, method: n });
17
- return /* @__PURE__ */ t(s, { className: `${u.heading} ${r}`, ...a, children: i ?? d });
18
+ return /* @__PURE__ */ t(i, { className: `${u.heading} ${s}`, ...a, children: r ?? d });
18
19
  };
19
20
  export {
20
- y as EnrollMfaTitle
21
+ C as EnrollMfaTitle
21
22
  };
@@ -1,171 +1,186 @@
1
- import { jsx as o, jsxs as a, Fragment as d } from "react/jsx-runtime";
2
- import { useIsInitialized as O, useCurrentUser as B, useInitiateMfaEnrollment as P, useSubmitMfaEnrollment as b, useRecordMfaEnrollmentPrompted as D } from "@coinbase/cdp-hooks";
3
- import { u as $ } from "../../chunks/useSendComponentCallOnce.BHZMuo6E.js";
4
- import { useMemo as k, useRef as p, useEffect as L, useCallback as E, useLayoutEffect as V } from "react";
5
- import { c as j } from "../../chunks/lite.1fxw3LjI.js";
6
- import { u as z } from "../../chunks/CDPReactProvider.CIQm4C4z.js";
7
- import { isApiError as J } from "../../utils/isApiError.js";
1
+ import { jsx as r, jsxs as s, Fragment as u } from "react/jsx-runtime";
2
+ import { getEnabledMfaMethods as $, getEnrolledMfaMethods as k } from "@coinbase/cdp-core";
3
+ import { useCurrentUser as w, useIsInitialized as V, useInitiateMfaEnrollment as j, useSubmitMfaEnrollment as z, useRecordMfaEnrollmentPrompted as q } from "@coinbase/cdp-hooks";
4
+ import { u as J } from "../../chunks/useSendComponentCallOnce.BHZMuo6E.js";
5
+ import { useMemo as C, useRef as _, useEffect as v, useCallback as p, useLayoutEffect as K } from "react";
6
+ import { c as G } from "../../chunks/lite.1fxw3LjI.js";
7
+ import { u as X } from "../../chunks/CDPReactProvider.C38bKQ2x.js";
8
+ import { useTimeout as Y } from "../../hooks/useTimeout.js";
9
+ import { isApiError as Z } from "../../utils/isApiError.js";
8
10
  import "libphonenumber-js";
9
- import { EnrollMfaDescription as R } from "./EnrollMfaDescription.js";
10
- import { EnrollMfaFlow as K } from "./EnrollMfaFlow.js";
11
- import { EnrollMfaFlowBackButton as q } from "./EnrollMfaFlowBackButton.js";
12
- import { EnrollMfaFlowProvider as G } from "./EnrollMfaFlowProvider.js";
13
- import { useEnrollMfaFlow as ge } from "./EnrollMfaFlowProvider.js";
14
- import { EnrollMfaFooter as X } from "./EnrollMfaFooter.js";
15
- import { EnrollMfaImage as Y } from "./EnrollMfaImage.js";
16
- import { EnrollMfaItem as Re } from "./EnrollMfaItem.js";
17
- import { EnrollMfaItems as Ce } from "./EnrollMfaItems.js";
18
- import { EnrollMfaProvider as Z, useEnrollMfaContext as C } from "./EnrollMfaProvider.js";
19
- import { EnrollMfaTitle as x } from "./EnrollMfaTitle.js";
20
- import { Banner as H } from "../ui/Banner/index.js";
21
- import '../../assets/EnrollMfa.css';const Q = "EnrollMfa-module__img___JmjV1", W = "EnrollMfa-module__centered___YxB8I", ee = "EnrollMfa-module__footer___Zro3u", l = {
11
+ import { EnrollMfaDescription as O } from "./EnrollMfaDescription.js";
12
+ import { EnrollMfaFlow as H } from "./EnrollMfaFlow.js";
13
+ import { EnrollMfaFlowBackButton as Q } from "./EnrollMfaFlowBackButton.js";
14
+ import { EnrollMfaFlowProvider as W } from "./EnrollMfaFlowProvider.js";
15
+ import { useEnrollMfaFlow as Fe } from "./EnrollMfaFlowProvider.js";
16
+ import { EnrollMfaFooter as ee } from "./EnrollMfaFooter.js";
17
+ import { EnrollMfaImage as te } from "./EnrollMfaImage.js";
18
+ import { EnrollMfaItem as Pe } from "./EnrollMfaItem.js";
19
+ import { EnrollMfaItems as De } from "./EnrollMfaItems.js";
20
+ import { EnrollMfaProvider as oe, useEnrollMfaContext as A } from "./EnrollMfaProvider.js";
21
+ import { EnrollMfaTitle as U } from "./EnrollMfaTitle.js";
22
+ import { m as re } from "../../chunks/index.Bgx0-QLY.js";
23
+ import { Banner as ne } from "../ui/Banner/index.js";
24
+ import '../../assets/EnrollMfa.css';const le = "EnrollMfa-module__img___JmjV1", ae = "EnrollMfa-module__centered___YxB8I", ie = "EnrollMfa-module__footer___Zro3u", a = {
22
25
  "mfa-enrollment": "EnrollMfa-module__mfa-enrollment___80xnL",
23
- img: Q,
26
+ img: le,
24
27
  "flex-container": "EnrollMfa-module__flex-container___9Dazs",
25
28
  "gap-2": "EnrollMfa-module__gap-2___BKEqR",
26
29
  "gap-3": "EnrollMfa-module__gap-3___JKVyF",
27
- centered: W,
28
- footer: ee
29
- }, te = 5 * 60 * 1e3, re = ({ role: c = "alert", ...i }) => {
30
- const { state: s } = C(), { error: m } = s;
31
- return m ? /* @__PURE__ */ o(H, { variant: "error", role: c, ...i, children: J(m) ? m.message : m }) : null;
32
- }, oe = ({
33
- className: c = "",
34
- children: i,
35
- resetOnSuccess: s = !0,
36
- ...m
30
+ centered: ae,
31
+ footer: ie
32
+ }, se = 5 * 60 * 1e3, me = ({ role: d = "alert", ...m }) => {
33
+ const { state: i } = A(), { error: l } = i;
34
+ return l ? /* @__PURE__ */ r(ne, { variant: "error", role: d, ...m, children: Z(l) ? l.message : l }) : null;
35
+ }, ce = ({
36
+ className: d = "",
37
+ children: m,
38
+ resetOnSuccess: i = !0,
39
+ ...l
37
40
  }) => {
38
- const { isInitialized: f } = O(), { currentUser: u } = B(), { state: e, dispatch: n, onEnrollSuccess: _ } = C(), { initiateMfaEnrollment: M } = P(), { submitMfaEnrollment: h } = b(), { recordMfaEnrollmentPrompted: I } = D(), { showCoinbaseFooter: U } = z(), N = p(!1);
39
- L(() => {
40
- !f || !u || N.current || (I(), N.current = !0);
41
- }, [I, f, u]), L(() => {
41
+ const { isInitialized: c } = V(), { currentUser: E } = w(), { state: e, dispatch: o, onEnrollSuccess: M } = A(), { initiateMfaEnrollment: h } = j(), { submitMfaEnrollment: I } = z(), { recordMfaEnrollmentPrompted: S } = q(), { showCoinbaseFooter: F } = X(), g = _(!1), y = !!E;
42
+ v(() => {
43
+ !c || !y || g.current || (S(), g.current = !0);
44
+ }, [S, c, y]), v(() => {
42
45
  if (!e.initiatedAt) return;
43
46
  const t = () => {
44
- e.initiatedAt && Date.now() - e.initiatedAt >= te && n({ type: "ENROLLMENT_SESSION_EXPIRED" });
47
+ e.initiatedAt && Date.now() - e.initiatedAt >= se && o({ type: "ENROLLMENT_SESSION_EXPIRED" });
45
48
  };
46
49
  t();
47
- const r = setInterval(t, 1e3);
48
- return () => clearInterval(r);
49
- }, [e.initiatedAt, n]);
50
- const S = p(e.step), T = p(null), y = E((t) => {
51
- S.current !== t && (S.current = t, T.current?.transition.toggle(t));
52
- }, []), v = E(() => {
53
- n({ type: "GO_TO_PREVIOUS_STEP" });
54
- }, [n]), F = E(
50
+ const n = setInterval(t, 1e3);
51
+ return () => clearInterval(n);
52
+ }, [e.initiatedAt, o]);
53
+ const T = _(e.step), N = _(null), { schedule: L } = Y(), R = p((t) => {
54
+ T.current !== t && (T.current = t, N.current?.transition.toggle(t));
55
+ }, []), B = p(() => {
56
+ o({ type: "GO_TO_PREVIOUS_STEP" });
57
+ }, [o]), P = p(
55
58
  async (t) => {
56
- if (f) {
57
- n({ type: "INITIATE_ENROLLMENT", payload: { method: t } });
58
- try {
59
- const r = await M({ mfaMethod: t });
60
- if ("authUrl" in r && "secret" in r)
61
- n({
62
- type: "INITIATE_ENROLLMENT_SUCCESS",
63
- payload: { authUrl: r.authUrl, secret: r.secret }
64
- });
65
- else
66
- throw new Error("Failed to initiate enrollment");
67
- } catch (r) {
68
- n({
69
- type: "INITIATE_ENROLLMENT_FAILURE",
70
- payload: {
71
- error: r instanceof Error ? r.message : "Failed to initiate enrollment"
72
- }
73
- });
74
- }
59
+ if (!c) return;
60
+ const n = re[t];
61
+ if (n.requiresInput && e.step !== "setup") {
62
+ o({
63
+ type: "SET_STEP",
64
+ payload: { step: "setup", flowDirection: "left", method: t }
65
+ });
66
+ return;
67
+ }
68
+ o({ type: "INITIATE_ENROLLMENT", payload: { method: t } });
69
+ try {
70
+ const f = n.getInitiateOptions(e), D = await h(f);
71
+ o({ type: "INITIATE_ENROLLMENT_SUCCESS", payload: D });
72
+ } catch (f) {
73
+ o({
74
+ type: "INITIATE_ENROLLMENT_FAILURE",
75
+ payload: {
76
+ error: f instanceof Error ? f.message : "Failed to initiate enrollment"
77
+ }
78
+ });
75
79
  }
76
80
  },
77
- [n, M, f]
78
- ), w = E(
81
+ [o, h, c, e]
82
+ ), b = p(
79
83
  async (t) => {
80
- t.preventDefault(), n({ type: "SUBMIT_ENROLLMENT" });
84
+ t.preventDefault(), o({ type: "SUBMIT_ENROLLMENT" });
81
85
  try {
82
- await h({
86
+ await I({
83
87
  mfaMethod: e.method,
84
88
  mfaCode: e.mfaCode
85
- }), n({ type: "SUBMIT_ENROLLMENT_SUCCESS" }), _?.(), s && setTimeout(() => {
86
- n({ type: "SET_STEP", payload: { step: "list", flowDirection: "left" } });
89
+ }), o({ type: "SUBMIT_ENROLLMENT_SUCCESS" }), M?.(), i && L(() => {
90
+ o({ type: "SET_STEP", payload: { step: "list", flowDirection: "left" } });
87
91
  }, 800);
88
- } catch (r) {
89
- n({
92
+ } catch (n) {
93
+ o({
90
94
  type: "SUBMIT_ENROLLMENT_FAILURE",
91
95
  payload: {
92
- error: r instanceof Error ? r.message : "Verification failed"
96
+ error: n instanceof Error ? n.message : "Verification failed"
93
97
  }
94
98
  });
95
99
  }
96
100
  },
97
- [n, e.method, e.mfaCode, h, _, s]
101
+ [
102
+ o,
103
+ e.method,
104
+ e.mfaCode,
105
+ I,
106
+ M,
107
+ i,
108
+ L
109
+ ]
98
110
  );
99
- V(() => {
100
- y(e.step);
101
- }, [e.step, y]);
102
- const g = typeof i == "function" ? i(e) : i;
103
- return /* @__PURE__ */ o(
104
- G,
111
+ K(() => {
112
+ R(e.step);
113
+ }, [e.step, R]);
114
+ const x = typeof m == "function" ? m(e) : m;
115
+ return /* @__PURE__ */ r(
116
+ W,
105
117
  {
106
- onBack: v,
107
- onStartEnrollment: F,
108
- onSubmit: w,
109
- transitionRef: T,
110
- children: /* @__PURE__ */ a("div", { className: `${l["mfa-enrollment"]} ${c}`, ...m, children: [
111
- g,
112
- !g && /* @__PURE__ */ a(d, { children: [
113
- /* @__PURE__ */ a(
118
+ onBack: B,
119
+ onStartEnrollment: P,
120
+ onSubmit: b,
121
+ transitionRef: N,
122
+ children: /* @__PURE__ */ s("div", { className: `${a["mfa-enrollment"]} ${d}`, ...l, children: [
123
+ x,
124
+ !x && /* @__PURE__ */ s(u, { children: [
125
+ /* @__PURE__ */ s(
114
126
  "div",
115
127
  {
116
- className: j(
117
- l["flex-container"],
118
- e.step === "list" ? l["gap-3"] : ""
128
+ className: G(
129
+ a["flex-container"],
130
+ e.step === "list" ? a["gap-3"] : ""
119
131
  ),
120
132
  children: [
121
- e.step === "list" ? /* @__PURE__ */ a(d, { children: [
122
- /* @__PURE__ */ a("div", { children: [
123
- /* @__PURE__ */ o(x, { step: "list", method: e.method }),
124
- /* @__PURE__ */ o(R, { step: "list", method: e.method })
133
+ e.step === "list" ? /* @__PURE__ */ s(u, { children: [
134
+ /* @__PURE__ */ s("div", { children: [
135
+ /* @__PURE__ */ r(U, { step: "list", method: e.method }),
136
+ /* @__PURE__ */ r(O, { step: "list", method: e.method })
125
137
  ] }),
126
- /* @__PURE__ */ o(re, {})
127
- ] }) : /* @__PURE__ */ o("div", { children: /* @__PURE__ */ o(q, { step: e.step }) }),
128
- /* @__PURE__ */ o(K, { children: ({ step: t, method: r, Content: A }) => /* @__PURE__ */ a("div", { className: `${l["flex-container"]} ${l["gap-2"]}`, children: [
129
- t !== "list" && /* @__PURE__ */ a(d, { children: [
130
- /* @__PURE__ */ o(
131
- Y,
138
+ /* @__PURE__ */ r(me, {})
139
+ ] }) : /* @__PURE__ */ r("div", { children: /* @__PURE__ */ r(Q, { step: e.step }) }),
140
+ /* @__PURE__ */ r(H, { children: ({ step: t, method: n, Content: f }) => /* @__PURE__ */ s("div", { className: `${a["flex-container"]} ${a["gap-2"]}`, children: [
141
+ t !== "list" && /* @__PURE__ */ s(u, { children: [
142
+ /* @__PURE__ */ r(
143
+ te,
132
144
  {
133
- className: `${l.img} ${l.centered}`,
145
+ className: `${a.img} ${a.centered}`,
134
146
  step: t,
135
- method: r
147
+ method: n
136
148
  }
137
149
  ),
138
- /* @__PURE__ */ a("div", { className: l.centered, children: [
139
- /* @__PURE__ */ o(x, { step: t, method: r }),
140
- /* @__PURE__ */ o(R, { step: t, method: r })
150
+ /* @__PURE__ */ s("div", { className: a.centered, children: [
151
+ /* @__PURE__ */ r(U, { step: t, method: n }),
152
+ /* @__PURE__ */ r(O, { step: t, method: n })
141
153
  ] })
142
154
  ] }),
143
- A
155
+ f
144
156
  ] }) })
145
157
  ]
146
158
  }
147
159
  ),
148
- U && /* @__PURE__ */ o(X, { className: l.footer })
160
+ F && /* @__PURE__ */ r(ee, { className: a.footer })
149
161
  ] })
150
162
  ] })
151
163
  }
152
164
  );
153
- }, Se = ({ onEnrollSuccess: c, ...i }) => {
154
- $("enroll_mfa");
155
- const s = k(() => ["totp"], []);
156
- return /* @__PURE__ */ o(Z, { methods: s, onEnrollSuccess: c, children: /* @__PURE__ */ o(oe, { ...i }) });
165
+ }, Ue = ({ onEnrollSuccess: d, ...m }) => {
166
+ J("enroll_mfa");
167
+ const { currentUser: i } = w(), l = $(), c = C(
168
+ () => i ? k(i) : [],
169
+ [i]
170
+ ), E = C(() => [.../* @__PURE__ */ new Set([...l, ...c])], [l, c]);
171
+ return /* @__PURE__ */ r(oe, { methods: E, onEnrollSuccess: d, children: /* @__PURE__ */ r(ce, { ...m }) });
157
172
  };
158
173
  export {
159
- Se as EnrollMfa,
160
- R as EnrollMfaDescription,
161
- re as EnrollMfaError,
162
- K as EnrollMfaFlow,
163
- q as EnrollMfaFlowBackButton,
164
- X as EnrollMfaFooter,
165
- Y as EnrollMfaImage,
166
- Re as EnrollMfaItem,
167
- Ce as EnrollMfaItems,
168
- x as EnrollMfaTitle,
169
- C as useEnrollMfaContext,
170
- ge as useEnrollMfaFlow
174
+ Ue as EnrollMfa,
175
+ O as EnrollMfaDescription,
176
+ me as EnrollMfaError,
177
+ H as EnrollMfaFlow,
178
+ Q as EnrollMfaFlowBackButton,
179
+ ee as EnrollMfaFooter,
180
+ te as EnrollMfaImage,
181
+ Pe as EnrollMfaItem,
182
+ De as EnrollMfaItems,
183
+ U as EnrollMfaTitle,
184
+ A as useEnrollMfaContext,
185
+ Fe as useEnrollMfaFlow
171
186
  };
@@ -0,0 +1,6 @@
1
+ import { EnrollMfaMethodConfig, EnrollMfaMethodContentProps, EnrollMfaMethodComponentProps } from '../types';
2
+ export declare const SmsContent: ({ autoFocus, step, onSubmit, children, }: EnrollMfaMethodContentProps) => import("react/jsx-runtime").JSX.Element;
3
+ export declare const SmsTitle: ({ step }: EnrollMfaMethodComponentProps) => import("react/jsx-runtime").JSX.Element | null;
4
+ export declare const SmsDescription: ({ step }: EnrollMfaMethodComponentProps) => import("react/jsx-runtime").JSX.Element | null;
5
+ export declare const SmsImage: ({ step }: EnrollMfaMethodComponentProps) => import("react/jsx-runtime").JSX.Element | null;
6
+ export declare const smsMethodConfig: EnrollMfaMethodConfig;