@coinbase/cdp-react 0.0.2 → 0.0.3

package/README.md

@@ -60,10 +60,10 @@ const appConfig = {
 
 // You can customize the theme by overriding theme variables
 const themeOverrides: Partial<Theme> = {
-  "colors-background": "black";
+  "colors-background": "black",
   "colors-backgroundOverlay": "rgba(0,0,0,0.5)",
-  "colors-text": "white";
-  "colors-textSecondary": "#999999";
+  "colors-text": "white",
+  "colors-textSecondary": "#999999",
 }
 
 ReactDOM.createRoot(document.getElementById('root')!).render(

package/dist/components/AuthButton/index.d.ts

@@ -1 +1 @@
-export declare const AuthButton: () => import("react").JSX.Element;
+export declare const AuthButton: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/CDPReactProvider/index.d.ts

@@ -7,5 +7,5 @@ export interface AppConfig {
 export type CDPReactProviderProps = CDPHooksProviderProps & ThemeProviderProps & {
     app?: AppConfig;
 };
-export declare const CDPReactProvider: ({ children, config, theme, app }: CDPReactProviderProps) => import("react").JSX.Element;
+export declare const CDPReactProvider: ({ children, config, theme, app }: CDPReactProviderProps) => import("react/jsx-runtime").JSX.Element;
 export declare const useAppConfig: () => AppConfig;

package/dist/components/Field/index.d.ts

@@ -1,5 +1,5 @@
 import { FormMessageProps, FormValidityStateProps } from '@radix-ui/react-form';
-import { CSSProperties, ReactNode } from 'react';
+import { CSSProperties, JSX, ReactNode } from 'react';
 export interface FormFieldProps {
     children?: FormValidityStateProps["children"];
     className?: string;

package/dist/components/LoadingSpinner/index.d.ts

@@ -1,3 +1,3 @@
 export declare const LoadingSpinner: ({ className }: {
     className?: string;
-}) => import("react").JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/components/SignIn/SignInDescription.d.ts

@@ -2,4 +2,4 @@ import { ElementType, HTMLAttributes } from 'react';
 export type SignInDescriptionProps = {
     as?: ElementType;
 } & HTMLAttributes<HTMLElement>;
-export declare const SignInDescription: ({ as: Component, children, className, ...props }: SignInDescriptionProps) => import("react").JSX.Element;
+export declare const SignInDescription: ({ as: Component, children, className, ...props }: SignInDescriptionProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/SignIn/SignInForm.d.ts

@@ -3,4 +3,4 @@ export type SignInFormProps = {
     as?: ElementType;
     onSuccess?: () => void;
 } & HTMLAttributes<HTMLElement>;
-export declare const SignInForm: ({ as: Component, className, onSuccess, ...props }: SignInFormProps) => import("react").JSX.Element;
+export declare const SignInForm: ({ as: Component, className, onSuccess, ...props }: SignInFormProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/SignIn/SignInForm.js

@@ -2,9 +2,10 @@ import { jsxs as i, jsx as t } from "react/jsx-runtime";
 import { useSignInWithEmail as N, useVerifyEmailOTP as M } from "@coinbase/cdp-hooks";
 import { Form as I, FormSubmit as P } from "@radix-ui/react-form";
 import { useRef as R, useState as U, useEffect as A } from "react";
+import { Button as b } from "../Button/index.js";
 import { Field as x } from "../Field/index.js";
 import { OTP as F } from "../OTP/index.js";
-import { ServerError as b } from "../ServerError/index.js";
+import { ServerError as C } from "../ServerError/index.js";
 import { IconCoinbaseWordmark as B } from "../../icons/IconCoinbaseWordmark.js";
 import { IconLock as V } from "../../icons/IconLock.js";
 import { isApiError as T } from "../../utils/isApiError.js";
@@ -12,7 +13,6 @@ import { isEmailInvalid as k } from "../../utils/isEmailInvalid.js";
 import { s as a } from "../../chunks/SignIn.module.Dl3CqKQ_.js";
 import { useSignInContext as S } from "./SignInProvider.js";
 import { withValidityState as W } from "../Input/index.js";
-import { Button as C } from "../Button/index.js";
 import { LoadingSpinner as D } from "../LoadingSpinner/index.js";
 import { VisuallyHidden as $ } from "../VisuallyHidden/index.js";
 const j = ({ submit: f }) => {
@@ -45,8 +45,8 @@ const j = ({ submit: f }) => {
             })
           }
         ),
-        n.error && /* @__PURE__ */ t(b, { error: n.error, className: a.serverError }),
-        /* @__PURE__ */ t(P, { asChild: !0, children: /* @__PURE__ */ t(C, { type: "submit", isPending: n.isPending, children: "Continue with email" }) })
+        n.error && /* @__PURE__ */ t(C, { error: n.error, className: a.serverError }),
+        /* @__PURE__ */ t(P, { asChild: !0, children: /* @__PURE__ */ t(b, { type: "submit", isPending: n.isPending, children: "Continue with email" }) })
       ]
     }
   );
@@ -85,11 +85,11 @@ const j = ({ submit: f }) => {
         /* @__PURE__ */ i("div", { className: a.formFooter, children: [
           (e.isPending && !e.canResetOTP || e.error) && /* @__PURE__ */ i("div", { className: a.serverStateWrapper, children: [
             e.isPending && !e.canResetOTP && /* @__PURE__ */ t(D, { className: a.loadingSpinner }),
-            e.error && /* @__PURE__ */ t(b, { error: e.error, className: a.serverError })
+            e.error && /* @__PURE__ */ t(C, { error: e.error, className: a.serverError })
           ] }),
           /* @__PURE__ */ i("div", { children: [
             e.canResetOTP && /* @__PURE__ */ t(P, { asChild: !0, children: /* @__PURE__ */ t(
-              C,
+              b,
               {
                 type: "button",
                 onClick: E,

package/dist/components/SignIn/SignInImage.d.ts

@@ -3,4 +3,4 @@ export type SignInImageProps = {
     alt?: string;
     src?: string;
 };
-export declare const SignInImage: ({ className, alt, src }: SignInImageProps) => import("react").JSX.Element | null;
+export declare const SignInImage: ({ className, alt, src }: SignInImageProps) => import("react/jsx-runtime").JSX.Element | null;

package/dist/components/SignIn/SignInProvider.d.ts

@@ -10,4 +10,4 @@ export declare const useSignInContext: () => {
 };
 export declare const SignInProvider: ({ children }: {
     children: ReactNode;
-}) => import("react").JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/components/SignIn/SignInTitle.d.ts

@@ -2,4 +2,4 @@ import { ElementType, HTMLAttributes } from 'react';
 export type SignInTitleProps = {
     as?: ElementType;
 } & HTMLAttributes<HTMLElement>;
-export declare const SignInTitle: ({ as: Component, children, className, ...props }: SignInTitleProps) => import("react").JSX.Element;
+export declare const SignInTitle: ({ as: Component, children, className, ...props }: SignInTitleProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/SignIn/index.d.ts

@@ -10,5 +10,5 @@ export interface SignInProps {
     className?: string;
     onSuccess?: () => void;
 }
-export declare const SignIn: (props: SignInProps) => import("react").JSX.Element;
+export declare const SignIn: (props: SignInProps) => import("react/jsx-runtime").JSX.Element;
 export { SignInDescription, SignInForm, SignInImage, SignInTitle, useSignInContext, type SignInDescriptionProps, type SignInFormProps, type SignInImageProps, type SignInTitleProps, };

package/dist/components/SignIn/useSignInReducer.d.ts

@@ -55,4 +55,4 @@ export type SignInAction = {
 } | {
     type: "CLEAR_ERROR";
 };
-export declare const useSignInReducer: (initialState: SignInState) => [SignInState, import('react').Dispatch<SignInAction>];
+export declare const useSignInReducer: (initialState: SignInState) => [SignInState, import('react').ActionDispatch<[action: SignInAction]>];

package/dist/components/SignInModal/index.d.ts

@@ -5,4 +5,4 @@ export type SignInModalProps = {
     setIsOpen?: (value: boolean) => void;
     onSuccess?: () => void;
 };
-export declare const SignInModal: ({ children, open, setIsOpen, onSuccess }: SignInModalProps) => import("react").JSX.Element;
+export declare const SignInModal: ({ children, open, setIsOpen, onSuccess }: SignInModalProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/SignInModal/index.js

@@ -2,13 +2,13 @@ import { jsxs as o, jsx as n } from "react/jsx-runtime";
 import { Dialog as g, DialogTrigger as c, DialogPortal as m, DialogOverlay as _, DialogContent as d, DialogClose as I, DialogTitle as p, 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 { SignIn as S } from "../SignIn/index.js";
 import { useTheme as D } from "../ThemeProvider/index.js";
 import { SignInImage as M } from "../SignIn/SignInImage.js";
 import { SignInTitle as f } from "../SignIn/SignInTitle.js";
 import { SignInDescription as v } from "../SignIn/SignInDescription.js";
 import { SignInForm as N } from "../SignIn/SignInForm.js";
-import { Button as r } from "../Button/index.js";
 import '../../assets/SignInModal.css';const y = "SignInModal-module__trigger___IcJ8x", T = "SignInModal-module__modal___PErrT", C = "SignInModal-module__signIn___hQuJk", x = "SignInModal-module__signInForm___6-UdI", B = "SignInModal-module__signInTitle___AF-XA", F = "SignInModal-module__signInDescription___SZjXu", W = "SignInModal-module__signInImage___hMBda", j = "SignInModal-module__closeWrapper___cx8Zq", X = "SignInModal-module__closeButton___yf-ZW", Z = "SignInModal-module__overlay___-0rmi", b = "SignInModal-module__spacer___x-lRH", i = {
   trigger: y,
   modal: T,

package/dist/components/SignOutButton/index.d.ts

@@ -5,4 +5,4 @@ export type SignOutButtonProps = {
     onSuccess?: () => void;
     variant?: ButtonVariant;
 };
-export declare const SignOutButton: ({ children, variant, onSuccess }: SignOutButtonProps) => import("react").JSX.Element;
+export declare const SignOutButton: ({ children, variant, onSuccess }: SignOutButtonProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/SignOutButton/index.js

@@ -1,8 +1,8 @@
 import { jsx as s } from "react/jsx-runtime";
 import { useSignOut as r } from "@coinbase/cdp-hooks";
 import "react";
-import "../../theme/theme.js";
 import { Button as m } from "../Button/index.js";
+import "../../theme/theme.js";
 import '../../assets/SignOutButton.css';const g = "SignOutButton-module__signOutButton___WNhmy", c = {
   signOutButton: g
 }, l = ({ children: t, variant: n = "primary", onSuccess: o }) => {

package/dist/components/ThemeProvider/index.d.ts

@@ -1,4 +1,4 @@
-import { CSSProperties, ReactNode } from 'react';
+import { CSSProperties, ReactNode, JSX } from 'react';
 import { Theme } from '../../theme/theme';
 import { CDPWebCSSVariables } from '../../theme/utils';
 export type ThemeProviderProps = {

package/dist/components/VisuallyHidden/index.d.ts

@@ -1,10 +1,7 @@
-import { ReactElement, ReactNode } from 'react';
-type VisuallyHiddenProps = {
-    asChild?: false;
+import { ElementType, ReactNode } from 'react';
+interface VisuallyHiddenProps {
+    as?: ElementType;
     children?: ReactNode;
-} | {
-    asChild: true;
-    children: ReactElement;
-};
-export declare const VisuallyHidden: ({ asChild, children }: VisuallyHiddenProps) => import("react").JSX.Element | null;
+}
+export declare const VisuallyHidden: ({ as: Component, children }: VisuallyHiddenProps) => import("react/jsx-runtime").JSX.Element | null;
 export {};

package/dist/components/VisuallyHidden/index.js

@@ -1,17 +1,8 @@
-import { jsx as n } from "react/jsx-runtime";
-import { Children as d, cloneElement as a } from "react";
-import '../../assets/VisuallyHidden.css';const o = "VisuallyHidden-module__visuallyHidden___KiAzg", i = {
-  visuallyHidden: o
-}, u = ({ asChild: e, children: l }) => {
-  if (!l)
-    return null;
-  if (!e)
-    return /* @__PURE__ */ n("span", { className: i.visuallyHidden, children: l });
-  const s = d.only(l);
-  return a(s, {
-    className: `${i.visuallyHidden} ${s.props.className || ""}`.trim()
-  });
-};
+import { jsx as i } from "react/jsx-runtime";
+import "react";
+import '../../assets/VisuallyHidden.css';const d = "VisuallyHidden-module__visuallyHidden___KiAzg", n = {
+  visuallyHidden: d
+}, u = ({ as: s = "span", children: l }) => l ? /* @__PURE__ */ i(s, { className: n.visuallyHidden, children: l }) : null;
 export {
   u as VisuallyHidden
 };

package/dist/icons/IconCheckCircle.d.ts

@@ -1,2 +1,2 @@
 import { SVGProps } from 'react';
-export declare const IconCheckCircle: (props: Omit<SVGProps<SVGSVGElement>, "viewBox">) => import("react").JSX.Element;
+export declare const IconCheckCircle: (props: Omit<SVGProps<SVGSVGElement>, "viewBox">) => import("react/jsx-runtime").JSX.Element;

package/dist/icons/IconCoinbaseWordmark.d.ts

@@ -1,2 +1,2 @@
 import { SVGProps } from 'react';
-export declare const IconCoinbaseWordmark: (props: Omit<SVGProps<SVGSVGElement>, "viewBox">) => import("react").JSX.Element;
+export declare const IconCoinbaseWordmark: (props: Omit<SVGProps<SVGSVGElement>, "viewBox">) => import("react/jsx-runtime").JSX.Element;

package/dist/icons/IconExclamationCircle.d.ts

@@ -1,2 +1,2 @@
 import { SVGProps } from 'react';
-export declare const IconExclamationCircle: (props: Omit<SVGProps<SVGSVGElement>, "viewBox">) => import("react").JSX.Element;
+export declare const IconExclamationCircle: (props: Omit<SVGProps<SVGSVGElement>, "viewBox">) => import("react/jsx-runtime").JSX.Element;

package/dist/icons/IconLock.d.ts

@@ -1,2 +1,2 @@
 import { SVGProps } from 'react';
-export declare const IconLock: (props: Omit<SVGProps<SVGSVGElement>, "viewBox">) => import("react").JSX.Element;
+export declare const IconLock: (props: Omit<SVGProps<SVGSVGElement>, "viewBox">) => import("react/jsx-runtime").JSX.Element;

package/dist/icons/IconXMark.d.ts

@@ -1,2 +1,2 @@
 import { SVGProps } from 'react';
-export declare const IconXMark: (props: Omit<SVGProps<SVGSVGElement>, "viewBox">) => import("react").JSX.Element;
+export declare const IconXMark: (props: Omit<SVGProps<SVGSVGElement>, "viewBox">) => import("react/jsx-runtime").JSX.Element;

package/dist/icons/SvgIcon.d.ts

@@ -1,4 +1,4 @@
 import { ReactNode, SVGProps } from 'react';
 export declare const SvgIcon: ({ children, ...props }: SVGProps<SVGSVGElement> & {
     children: ReactNode;
-}) => import("react").JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coinbase/cdp-react",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "type": "module",
   "dependencies": {
     "@radix-ui/react-dialog": "^1.1.14",
@@ -8,9 +8,9 @@
     "@radix-ui/react-one-time-password-field": "^0.1.7"
   },
   "peerDependencies": {
-    "react": "^18.2.0",
-    "@coinbase/cdp-core": "^0.0.2",
-    "@coinbase/cdp-hooks": "^0.0.2"
+    "react": ">=18.2.0",
+    "@coinbase/cdp-hooks": "^0.0.3",
+    "@coinbase/cdp-core": "^0.0.3"
   },
   "devDependencies": {
     "@size-limit/preset-big-lib": "^11.2.0",
@@ -19,23 +19,23 @@
     "@size-limit/webpack-why": "^11.2.0",
     "@testing-library/dom": "^10.0.0",
     "@testing-library/jest-dom": "^6.6.3",
-    "@testing-library/react": "~16.2.0",
+    "@testing-library/react": "^16.3.0",
     "@testing-library/user-event": "^14.6.1",
     "@types/glob": "^9.0.0",
-    "@types/react": "^18.2.0",
-    "@types/react-dom": "^18.2.0",
+    "@types/react": "^19.1.0",
+    "@types/react-dom": "^19.1.0",
     "@vitejs/plugin-react": "^4.6.0",
     "eslint-plugin-react": "^7.37.5",
     "eslint-plugin-react-hooks": "^5.2.0",
     "glob": "^11.0.3",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0",
     "size-limit": "^11.2.0",
     "vite": "^7.0.4",
     "vite-plugin-dts": "^4.5.4",
     "vite-plugin-lib-inject-css": "^2.2.2",
-    "@coinbase/cdp-core": "^0.0.2",
-    "@coinbase/cdp-hooks": "^0.0.2"
+    "@coinbase/cdp-core": "^0.0.3",
+    "@coinbase/cdp-hooks": "^0.0.3"
   },
   "size-limit": [
     {