@coinbase/cdp-react 0.0.16 → 0.0.17

package/dist/components/OTP/index.js

@@ -1,8 +1,8 @@
 import { jsxs as d, jsx as o } from "react/jsx-runtime";
 import { OneTimePasswordField as _, OneTimePasswordFieldInput as f, OneTimePasswordFieldHiddenInput as P } from "@radix-ui/react-one-time-password-field";
 import { forwardRef as O, useId as T, useRef as h, useEffect as y } from "react";
-import { Error as I } from "../Error/index.js";
-import { Input as v } from "../Input/index.js";
+import { Input as I } from "../Input/index.js";
+import { Error as v } from "../Error/index.js";
 import '../../assets/OTP.css';const w = "OTP-module__otp___EUcSo", N = "OTP-module__input___MEBPV", r = {
   otp: w,
   "group-container": "OTP-module__group-container___rfrCo",
@@ -29,7 +29,7 @@ import '../../assets/OTP.css';const w = "OTP-module__otp___EUcSo", N = "OTP-modu
           },
           children: [
             Array.from({ length: s }, (e, t) => /* @__PURE__ */ o("div", { className: r["input-container"], children: /* @__PURE__ */ o(f, { asChild: !0, children: /* @__PURE__ */ o(
-              v,
+              I,
               {
                 name: `${c.name || "otp"}-${t}`,
                 ref: (m) => p(m, t),
@@ -40,7 +40,7 @@ import '../../assets/OTP.css';const w = "OTP-module__otp___EUcSo", N = "OTP-modu
           ]
         }
       ),
-      i && /* @__PURE__ */ o(I, { id: u, children: i })
+      i && /* @__PURE__ */ o(v, { id: u, children: i })
     ] });
   }
 );

package/dist/components/ServerError/index.js

@@ -1,12 +1,12 @@
 import { jsx as s } from "react/jsx-runtime";
 import "@coinbase/cdp-hooks";
 import { forwardRef as t } from "react";
-import { Error as p } from "../Error/index.js";
-import { isApiError as f } from "../../utils/isApiError.js";
+import { isApiError as p } from "../../utils/isApiError.js";
+import { Error as f } from "../Error/index.js";
 const a = t(
   ({ error: r, id: o, className: e = "" }, m) => {
-    const i = f(r) ? r.errorMessage : r;
-    return /* @__PURE__ */ s(p, { ref: m, id: o, className: e, children: i });
+    const i = p(r) ? r.errorMessage : r;
+    return /* @__PURE__ */ s(f, { ref: m, id: o, className: e, children: i });
   }
 );
 a.displayName = "ServerError";

package/dist/components/SignIn/SignInForm.js

@@ -5,16 +5,16 @@ import { useState as v, useEffect as y, useRef as B } from "react";
 import { Button as C } from "../Button/index.js";
 import { useAppConfig as k } from "../CDPReactProvider/index.js";
 import { Field as x } from "../Field/index.js";
-import { LoadingSpinner as q } from "../LoadingSpinner/index.js";
-import { OTP as D } from "../OTP/index.js";
+import { OTP as q } from "../OTP/index.js";
 import { ServerError as O } from "../ServerError/index.js";
-import { VisuallyHidden as W } from "../VisuallyHidden/index.js";
-import { IconCoinbaseWordmark as Q } from "../../icons/IconCoinbaseWordmark.js";
-import { IconLock as Z } from "../../icons/IconLock.js";
+import { IconCoinbaseWordmark as D } from "../../icons/IconCoinbaseWordmark.js";
+import { IconLock as W } from "../../icons/IconLock.js";
 import { isApiError as T } from "../../utils/isApiError.js";
-import { isEmailInvalid as $ } from "../../utils/isEmailInvalid.js";
+import { isEmailInvalid as Q } from "../../utils/isEmailInvalid.js";
 import { useSignInContext as E } from "./SignInProvider.js";
-import { withValidityState as j } from "../Input/index.js";
+import { withValidityState as Z } from "../Input/index.js";
+import { LoadingSpinner as $ } from "../LoadingSpinner/index.js";
+import { VisuallyHidden as j } from "../VisuallyHidden/index.js";
 import '../../assets/SignInForm.css';const J = "SignInForm-module__form___8Mc3V", G = "SignInForm-module__footer___6Lo9w", H = "SignInForm-module__hr___fOcy4", X = "SignInForm-module__icon___qkJnq", n = {
   "form-wrapper": "SignInForm-module__form-wrapper___SlQkZ",
   form: J,
@@ -45,9 +45,9 @@ import '../../assets/SignInForm.css';const J = "SignInForm-module__form___8Mc3V"
             validators: [
               ["valueMissing", "Email is required"],
               ["typeMismatch", "Use a valid email address"],
-              [$, "Use a valid email address"]
+              [Q, "Use a valid email address"]
             ],
-            children: j({
+            children: Z({
               autoComplete: "email",
               type: "email",
               placeholder: "name@example.com",
@@ -82,7 +82,7 @@ import '../../assets/SignInForm.css';const J = "SignInForm-module__form___8Mc3V"
       onSubmit: f,
       children: [
         /* @__PURE__ */ o(
-          D,
+          q,
           {
             ref: l,
             name: "otp",
@@ -98,7 +98,7 @@ import '../../assets/SignInForm.css';const J = "SignInForm-module__form___8Mc3V"
         ),
         /* @__PURE__ */ s("div", { className: n["form-footer"], children: [
           (e.isPending && !e.canResetOTP || e.error) && /* @__PURE__ */ s("div", { className: n["server-state-wrapper"], children: [
-            e.isPending && !e.canResetOTP && /* @__PURE__ */ o(q, { className: n["loading-spinner"] }),
+            e.isPending && !e.canResetOTP && /* @__PURE__ */ o($, { className: n["loading-spinner"] }),
             e.error && /* @__PURE__ */ o(O, { error: e.error, className: n["server-error"] })
           ] }),
           /* @__PURE__ */ s("div", { className: n["resend-wrapper"], children: [
@@ -118,7 +118,7 @@ import '../../assets/SignInForm.css';const J = "SignInForm-module__form___8Mc3V"
                 i,
                 "s"
               ] }),
-              /* @__PURE__ */ s(W, { children: [
+              /* @__PURE__ */ s(j, { children: [
                 i,
                 " ",
                 i === 1 ? "second" : "seconds"
@@ -187,11 +187,11 @@ import '../../assets/SignInForm.css';const J = "SignInForm-module__form___8Mc3V"
     F && /* @__PURE__ */ s(A, { children: [
       /* @__PURE__ */ o("hr", { className: n.hr }),
       /* @__PURE__ */ s("div", { className: n.footer, children: [
-        /* @__PURE__ */ o(Z, { className: n.icon }),
+        /* @__PURE__ */ o(W, { className: n.icon }),
         /* @__PURE__ */ s("p", { children: [
           "Secured by",
           " ",
-          /* @__PURE__ */ o(Q, { className: n["coinbase-icon"], "aria-label": "Coinbase" })
+          /* @__PURE__ */ o(D, { className: n["coinbase-icon"], "aria-label": "Coinbase" })
         ] })
       ] })
     ] })

package/dist/components/SignInModal/index.js

@@ -1,10 +1,11 @@
 import { jsxs as o, jsx as i } from "react/jsx-runtime";
-import { Dialog as g, DialogTrigger as m, DialogPortal as _, DialogOverlay as d, DialogContent as c, DialogClose as p, DialogTitle as I, DialogDescription as u } from "@radix-ui/react-dialog";
+import { Dialog as m, DialogTrigger as g, DialogPortal as _, DialogOverlay as d, DialogContent as c, DialogClose as p, DialogTitle as I, DialogDescription as u } from "@radix-ui/react-dialog";
 import "react";
 import { IconXMark as h } from "../../icons/IconXMark.js";
-import { Button as r } from "../Button/index.js";
-import { useTheme as S } from "../ThemeProvider/index.js";
-import { SignIn as f } from "../SignIn/index.js";
+import { Button as e } from "../Button/index.js";
+import { SignIn as S } from "../SignIn/index.js";
+import "@coinbase/cdp-hooks";
+import { useTheme as f } from "../ThemeProvider/index.js";
 import { SignInImage as M } from "../SignIn/SignInImage.js";
 import { SignInTitle as D } from "../SignIn/SignInTitle.js";
 import { SignInDescription as v } from "../SignIn/SignInDescription.js";
@@ -20,15 +21,15 @@ import '../../assets/SignInModal.css';const y = "SignInModal-module__trigger___I
   "close-button": "SignInModal-module__close-button___k1I5Q",
   overlay: x,
   spacer: b
-}, G = ({ children: l, open: a, setIsOpen: s, onSuccess: e }) => {
-  const { cssVariables: t } = S();
-  return /* @__PURE__ */ o(g, { open: a, onOpenChange: s, children: [
-    /* @__PURE__ */ i(m, { asChild: !0, children: l || /* @__PURE__ */ i(r, { variant: "primary", className: n.trigger, children: "Sign In" }) }),
+}, H = ({ children: l, open: a, setIsOpen: s, onSuccess: r }) => {
+  const { cssVariables: t } = f();
+  return /* @__PURE__ */ o(m, { open: a, onOpenChange: s, children: [
+    /* @__PURE__ */ i(g, { asChild: !0, children: l || /* @__PURE__ */ i(e, { variant: "primary", className: n.trigger, children: "Sign In" }) }),
     /* @__PURE__ */ i(_, { children: /* @__PURE__ */ o(d, { className: n.overlay, style: t, children: [
       /* @__PURE__ */ i("div", { className: n.spacer }),
-      /* @__PURE__ */ i(c, { className: n.modal, children: /* @__PURE__ */ o(f, { onSuccess: e, className: n["sign-in"], children: [
+      /* @__PURE__ */ i(c, { className: n.modal, children: /* @__PURE__ */ o(S, { onSuccess: r, className: n["sign-in"], children: [
         /* @__PURE__ */ i(p, { asChild: !0, children: /* @__PURE__ */ i(
-          r,
+          e,
           {
             "aria-label": "Close",
             variant: "transparentSecondary",
@@ -39,11 +40,11 @@ import '../../assets/SignInModal.css';const y = "SignInModal-module__trigger___I
         /* @__PURE__ */ i("div", { className: n["sign-in-image"], children: /* @__PURE__ */ i(M, {}) }),
         /* @__PURE__ */ i("div", { className: n["sign-in-title"], children: /* @__PURE__ */ i(I, { asChild: !0, children: /* @__PURE__ */ i(D, {}) }) }),
         /* @__PURE__ */ i(u, { asChild: !0, children: /* @__PURE__ */ i(v, { className: n["sign-in-description"] }) }),
-        /* @__PURE__ */ i(N, { className: n["sign-in-form"], onSuccess: e })
+        /* @__PURE__ */ i(N, { className: n["sign-in-form"], onSuccess: r })
       ] }) })
     ] }) })
   ] });
 };
 export {
-  G as SignInModal
+  H as SignInModal
 };

package/dist/index.js

@@ -1,58 +1,58 @@
 import { CDPReactProvider as e, useAppConfig as t } from "./components/CDPReactProvider/index.js";
 import { AuthButton as m } from "./components/AuthButton/index.js";
 import { SendTransactionButton as f } from "./components/SendTransactionButton/index.js";
-import { SignOutButton as x } from "./components/SignOutButton/index.js";
-import { SignInModal as c } from "./components/SignInModal/index.js";
-import { cssVariables as l } from "./theme/cssVariables.js";
-import { theme as g } from "./theme/theme.js";
-import { colors as u, colorsBase as C, colorsComponents as d, colorsSemantic as h, font as k, tokens as T } from "./theme/tokens.js";
-import { flattenTokensObject as E, themeToCssVariables as b } from "./theme/utils.js";
-import { IconCheckCircle as A } from "./icons/IconCheckCircle.js";
-import { IconExclamationCircle as P } from "./icons/IconExclamationCircle.js";
-import { IconLock as F } from "./icons/IconLock.js";
-import { IconXMark as R } from "./icons/IconXMark.js";
-import { getMessageFromUnknownError as j } from "./utils/getMessageFromUnknownError.js";
-import { isApiError as L } from "./utils/isApiError.js";
-import { isEmailInvalid as X } from "./utils/isEmailInvalid.js";
-import { SignIn as y } from "./components/SignIn/index.js";
-import { SignInDescription as G } from "./components/SignIn/SignInDescription.js";
-import { SignInForm as J } from "./components/SignIn/SignInForm.js";
-import { SignInImage as N } from "./components/SignIn/SignInImage.js";
-import { SignInTitle as W } from "./components/SignIn/SignInTitle.js";
-import { useSignInContext as Z } from "./components/SignIn/SignInProvider.js";
-import { useSignInReducer as $ } from "./components/SignIn/useSignInReducer.js";
-import { ThemeProvider as ro, useTheme as eo } from "./components/ThemeProvider/index.js";
+import { SignIn as x } from "./components/SignIn/index.js";
+import { useSignInReducer as c } from "./components/SignIn/useSignInReducer.js";
+import { SignOutButton as l } from "./components/SignOutButton/index.js";
+import { SignInModal as g } from "./components/SignInModal/index.js";
+import { ThemeProvider as u, useTheme as C } from "./components/ThemeProvider/index.js";
+import { cssVariables as h } from "./theme/cssVariables.js";
+import { theme as T } from "./theme/theme.js";
+import { colors as E, colorsBase as b, colorsComponents as v, colorsSemantic as A, font as M, tokens as P } from "./theme/tokens.js";
+import { flattenTokensObject as F, themeToCssVariables as O } from "./theme/utils.js";
+import { IconCheckCircle as V } from "./icons/IconCheckCircle.js";
+import { IconExclamationCircle as w } from "./icons/IconExclamationCircle.js";
+import { IconLock as U } from "./icons/IconLock.js";
+import { IconXMark as q } from "./icons/IconXMark.js";
+import { getMessageFromUnknownError as z } from "./utils/getMessageFromUnknownError.js";
+import { isApiError as H } from "./utils/isApiError.js";
+import { isEmailInvalid as K } from "./utils/isEmailInvalid.js";
+import { SignInDescription as Q } from "./components/SignIn/SignInDescription.js";
+import { SignInForm as Y } from "./components/SignIn/SignInForm.js";
+import { SignInImage as _ } from "./components/SignIn/SignInImage.js";
+import { SignInTitle as oo } from "./components/SignIn/SignInTitle.js";
+import { useSignInContext as eo } from "./components/SignIn/SignInProvider.js";
 export {
   m as AuthButton,
   e as CDPReactProvider,
-  A as IconCheckCircle,
-  P as IconExclamationCircle,
-  F as IconLock,
-  R as IconXMark,
+  V as IconCheckCircle,
+  w as IconExclamationCircle,
+  U as IconLock,
+  q as IconXMark,
   f as SendTransactionButton,
-  y as SignIn,
-  G as SignInDescription,
-  J as SignInForm,
-  N as SignInImage,
-  c as SignInModal,
-  W as SignInTitle,
-  x as SignOutButton,
-  ro as ThemeProvider,
-  u as colors,
-  C as colorsBase,
-  d as colorsComponents,
-  h as colorsSemantic,
-  l as cssVariables,
-  E as flattenTokensObject,
-  k as font,
-  j as getMessageFromUnknownError,
-  L as isApiError,
-  X as isEmailInvalid,
-  g as theme,
-  b as themeToCssVariables,
-  T as tokens,
+  x as SignIn,
+  Q as SignInDescription,
+  Y as SignInForm,
+  _ as SignInImage,
+  g as SignInModal,
+  oo as SignInTitle,
+  l as SignOutButton,
+  u as ThemeProvider,
+  E as colors,
+  b as colorsBase,
+  v as colorsComponents,
+  A as colorsSemantic,
+  h as cssVariables,
+  F as flattenTokensObject,
+  M as font,
+  z as getMessageFromUnknownError,
+  H as isApiError,
+  K as isEmailInvalid,
+  T as theme,
+  O as themeToCssVariables,
+  P as tokens,
   t as useAppConfig,
-  Z as useSignInContext,
-  $ as useSignInReducer,
-  eo as useTheme
+  eo as useSignInContext,
+  c as useSignInReducer,
+  C as useTheme
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coinbase/cdp-react",
-  "version": "0.0.16",
+  "version": "0.0.17",
   "type": "module",
   "dependencies": {
     "@radix-ui/react-dialog": "^1.1.14",
@@ -9,8 +9,8 @@
   },
   "peerDependencies": {
     "react": ">=18.2.0",
-    "@coinbase/cdp-core": "^0.0.16",
-    "@coinbase/cdp-hooks": "^0.0.16"
+    "@coinbase/cdp-core": "^0.0.17",
+    "@coinbase/cdp-hooks": "^0.0.17"
   },
   "devDependencies": {
     "@size-limit/preset-big-lib": "^11.2.0",
@@ -38,8 +38,8 @@
     "vite": "^7.0.4",
     "vite-plugin-dts": "^4.5.4",
     "vite-plugin-lib-inject-css": "^2.2.2",
-    "@coinbase/cdp-core": "^0.0.16",
-    "@coinbase/cdp-hooks": "^0.0.16"
+    "@coinbase/cdp-core": "^0.0.17",
+    "@coinbase/cdp-hooks": "^0.0.17"
   },
   "size-limit": [
     {