@coinbase/cdp-react 0.0.108 → 0.0.110

package/dist/components/SiweStatusView/toSiweProvider.d.ts

@@ -0,0 +1,10 @@
+import { SiweProviderType } from './connectors/siweConnectors';
+/**
+ * Extracts the SIWE provider type from an auth method (e.g. `"siwe:base"` -> `"base"`).
+ *
+ * @param {string} [authMethod] - The auth method to convert.
+ * @returns {SiweProviderType | undefined} The SIWE provider type, or undefined if not a known SIWE provider.
+ *
+ * @group Utilities
+ */
+export declare function toSiweProvider(authMethod?: string): SiweProviderType | undefined;

package/dist/components/SiweStatusView/toSiweProvider.js

@@ -0,0 +1,13 @@
+import { siweConnectors as n } from "./connectors/siweConnectors.js";
+function o(i) {
+  return i in n;
+}
+function s(i) {
+  if (!i)
+    return;
+  const r = i.startsWith("siwe:") ? i.split(":")[1] : i;
+  return o(r) ? r : void 0;
+}
+export {
+  s as toSiweProvider
+};

package/dist/components/SiweStatusView/useSiweFlow.d.ts

@@ -0,0 +1,37 @@
+import { SiweProviderType } from './connectors/siweConnectors';
+/**
+ * Handlers invoked as a SIWE attempt progresses. `onSuccess`/`onError` only fire when the attempt
+ * is still the most recent one, so a stale resolution from an abandoned flow is ignored.
+ */
+export interface SiweFlowHandlers {
+    /** Called when the attempt starts, before the wallet connects. Always fires. */
+    onStart?: () => void;
+    /** Called when the attempt completes successfully and is still the latest attempt. */
+    onSuccess?: () => void;
+    /**
+     * Called when the attempt fails and is still the latest attempt, with a user-facing message
+     * (or `undefined` to fall back to a generic message).
+     */
+    onError?: (message: string | undefined) => void;
+}
+/**
+ * The return type of the useSiweFlow hook.
+ */
+export interface UseSiweFlowReturnType {
+    /** Runs a guarded SIWE attempt, invoking the handlers as it progresses. */
+    start: (handlers?: SiweFlowHandlers) => Promise<void>;
+}
+/**
+ * A generic hook for authenticating with a SIWE provider (e.g. Base) via Sign In With Ethereum.
+ *
+ * It connects the wallet via the provider's connector, runs the SIWE flow, and automatically
+ * links to the current user when already signed in.
+ *
+ * A module-scoped run guard ensures only the most recent attempt's success/error is reported, so a
+ * flow that resolves after the user navigated away cannot update the current UI. Errors are mapped
+ * to user-facing copy via {@link getSiweErrorMessage} and logged once here.
+ *
+ * @param {SiweProviderType} provider - The SIWE provider to authenticate with.
+ * @returns {UseSiweFlowReturnType} A function to start a guarded SIWE attempt.
+ */
+export declare const useSiweFlow: (provider: SiweProviderType) => UseSiweFlowReturnType;

package/dist/components/SiweStatusView/useSiweFlow.js

@@ -0,0 +1,35 @@
+import { useIsSignedIn as p, useSignInWithSiwe as I, useLinkSiwe as y, useVerifySiweSignature as h } from "@coinbase/cdp-hooks";
+import { useCallback as k } from "react";
+import { u as C } from "../../chunks/CDPReactProvider.BWInVuNJ.js";
+import { siweConnectors as v } from "./connectors/siweConnectors.js";
+import { getSiweErrorMessage as E } from "./getSiweErrorMessage.js";
+let i = 0;
+const M = (e) => {
+  const { appName: r } = C(), { isSignedIn: s } = p(), { signInWithSiwe: a } = I(), { linkSiwe: c } = y(), { verifySiweSignature: w } = h();
+  return { start: k(
+    async (o) => {
+      const u = ++i;
+      o?.onStart?.();
+      try {
+        const t = v[e], { provider: n, address: m, chainId: S } = await t.connect(r), g = s ? c : a, { flowId: f, message: d } = await g({
+          address: m,
+          chainId: S,
+          domain: window.location.hostname,
+          uri: window.location.origin
+        }), l = await t.sign(n, d, m);
+        if (await w({ flowId: f, signature: l }), u !== i)
+          return;
+        o?.onSuccess?.();
+      } catch (t) {
+        if (u !== i)
+          return;
+        const n = E(t);
+        o?.onError?.(n), n || console.error(t);
+      }
+    },
+    [e, r, s, a, c, w]
+  ) };
+};
+export {
+  M as useSiweFlow
+};

package/dist/components/VerifyMfa/index.js

@@ -2,7 +2,7 @@ import "react/jsx-runtime";
 import "@coinbase/cdp-hooks";
 import "../../chunks/useSendComponentCallOnce.BI4daEvm.js";
 import "react";
-import { V as p } from "../../chunks/CDPReactProvider.CFWIUvzR.js";
+import { V as p } from "../../chunks/CDPReactProvider.BWInVuNJ.js";
 import "@coinbase/cdp-core";
 import { VerifyMfaDescription as x } from "./VerifyMfaDescription.js";
 import { VerifyMfaFlow as y } from "./VerifyMfaFlow.js";

package/dist/components/VerifyMfaInline/index.js

@@ -7,7 +7,7 @@ import { c as j } from "../../chunks/lite.1fxw3LjI.js";
 import { Button as H } from "../ui/Button/index.js";
 import { SwitchFadeTransition as J } from "../ui/SwitchFadeTransition/index.js";
 import { SwitchSlideTransition as Q } from "../ui/SwitchSlideTransition/index.js";
-import { V as U } from "../../chunks/CDPReactProvider.CFWIUvzR.js";
+import { V as U } from "../../chunks/CDPReactProvider.BWInVuNJ.js";
 import { IconArrowLeft as Z } from "../../icons/IconArrowLeft.js";
 import "../../theme/theme.js";
 import { useVerifyMfaContext as $ } from "../VerifyMfa/VerifyMfaProvider.js";

package/dist/components/VerifyMfaModal/index.js

@@ -2,7 +2,7 @@ import "react/jsx-runtime";
 import "../../chunks/useSendComponentCallOnce.BI4daEvm.js";
 import "react";
 import "../../chunks/lite.1fxw3LjI.js";
-import { c, d as x, e as C } from "../../chunks/CDPReactProvider.CFWIUvzR.js";
+import { c, d as x, e as C } from "../../chunks/CDPReactProvider.BWInVuNJ.js";
 import "../ui/Button/index.js";
 import "../ui/Modal/index.js";
 import "../ui/VisuallyHidden/index.js";

package/dist/components/ui/StatusView/index.d.ts

@@ -0,0 +1,35 @@
+import { ReactNode } from 'react';
+/**
+ * The status to display.
+ */
+export type StatusViewStatus = "pending" | "success" | "error";
+/**
+ * Props for the StatusView component.
+ */
+export interface StatusViewProps {
+    /** The status to render (drives the graphic). */
+    status: StatusViewStatus;
+    /** The headline text. */
+    title: ReactNode;
+    /** Optional supporting description text. */
+    description?: ReactNode;
+    /** Visually hide the description while preserving its layout (e.g. before a countdown starts). */
+    descriptionHidden?: boolean;
+    /** An icon overlaid on the pending spinner (e.g. a provider logo). Ignored for success/error. */
+    icon?: ReactNode;
+    /** Additional content rendered below the description (e.g. a retry button). */
+    children?: ReactNode;
+    /** Optional className for the root element. */
+    className?: string;
+}
+/**
+ * A generic, non-auth-specific status view that renders a pending/success/error graphic
+ * with a title, optional description, and optional extra content. Shared by the OAuth
+ * status modal and the inline SIWE flow.
+ *
+ * @param {StatusViewProps} props - The props for the component.
+ * @returns {JSX.Element} The StatusView component.
+ *
+ * @group Components
+ */
+export declare const StatusView: ({ status, title, description, descriptionHidden, icon, children, className, }: StatusViewProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/StatusView/index.js

@@ -0,0 +1,55 @@
+import { jsxs as e, jsx as i } from "react/jsx-runtime";
+import { c as o } from "../../../chunks/lite.1fxw3LjI.js";
+import "react";
+import { LoadingSpinner as u } from "../LoadingSpinner/index.js";
+import { IconCheck as d } from "../../../icons/IconCheck.js";
+import { IconXMark as m } from "../../../icons/IconXMark.js";
+import '../../../assets/StatusView.css';const p = "StatusView-module__graphic___wq1hU", h = "StatusView-module__spinner___icv07", g = "StatusView-module__icon___4B8WP", w = "StatusView-module__subhead___xhgCR", S = "StatusView-module__description___gH-Dw", v = "StatusView-module__ring___fK6w9", V = "StatusView-module__invisible___BQHRn", s = {
+  "status-view": "StatusView-module__status-view___DXdAF",
+  graphic: p,
+  spinner: h,
+  icon: g,
+  "icon-success": "StatusView-module__icon-success___rj7r1",
+  "icon-error": "StatusView-module__icon-error___sjTY6",
+  subhead: w,
+  description: S,
+  ring: v,
+  "ring-success": "StatusView-module__ring-success___UCrQB",
+  "ring-error": "StatusView-module__ring-error___yVzvS",
+  invisible: V
+}, j = ({
+  status: r,
+  title: a,
+  description: c,
+  descriptionHidden: _,
+  icon: n,
+  children: t,
+  className: l
+}) => /* @__PURE__ */ e("div", { className: o(s["status-view"], l), children: [
+  r === "pending" && /* @__PURE__ */ e("div", { className: s.graphic, children: [
+    /* @__PURE__ */ i(
+      u,
+      {
+        strokeWidth: "5%",
+        staticStroke: !0,
+        staticStrokeColor: "var(--cdp-web-colors-line-default)",
+        className: s.spinner
+      }
+    ),
+    n && /* @__PURE__ */ i("span", { className: s.icon, children: n })
+  ] }),
+  r === "success" && /* @__PURE__ */ e("div", { className: s.graphic, children: [
+    /* @__PURE__ */ i("span", { className: `${s.ring} ${s["ring-success"]}` }),
+    /* @__PURE__ */ i("span", { className: `${s.icon} ${s["icon-success"]}`, children: /* @__PURE__ */ i(d, {}) })
+  ] }),
+  r === "error" && /* @__PURE__ */ e("div", { className: `${s.graphic}`, children: [
+    /* @__PURE__ */ i("span", { className: `${s.ring} ${s["ring-error"]}` }),
+    /* @__PURE__ */ i("span", { className: `${s.icon} ${s["icon-error"]}`, children: /* @__PURE__ */ i(m, {}) })
+  ] }),
+  /* @__PURE__ */ i("p", { className: s.subhead, children: a }),
+  c !== void 0 && /* @__PURE__ */ i("p", { className: o(s.description, _ && s.invisible), children: c }),
+  t
+] });
+export {
+  j as StatusView
+};

package/dist/components/ui/SwitchFadeTransition/index.d.ts

@@ -17,4 +17,4 @@ export type SwitchFadeTransitionRef<T extends Key> = SwitchTransitionRef<T>;
  * @param props.direction - The direction of the transition.
  * @returns {JSX.Element} The SwitchFadeTransition component.
  */
-export declare const SwitchFadeTransition: <T extends Key>({ children, className, ...props }: SwitchFadeTransitionProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const SwitchFadeTransition: <T extends Key>({ children, ...props }: SwitchFadeTransitionProps<T>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/SwitchFadeTransition/index.js

@@ -1,24 +1,20 @@
-import { jsx as r } from "react/jsx-runtime";
+import { jsx as n } from "react/jsx-runtime";
 import "react";
-import { SwitchTransition as e } from "../SwitchTransition/index.js";
-import '../../../assets/SwitchFadeTransition.css';const o = {
-  "switch-fade-transition": "SwitchFadeTransition-module__switch-fade-transition___--lbT"
-}, c = ({
+import { SwitchTransition as i } from "../SwitchTransition/index.js";
+const u = ({
   children: t,
-  className: i = "",
-  ...n
-}) => /* @__PURE__ */ r(
-  e,
+  ...r
+}) => /* @__PURE__ */ n(
+  i,
   {
     transitionName: "fade",
-    className: `${o["switch-fade-transition"]} ${i}`,
     preEnter: !0,
     mountOnEnter: !0,
     unmountOnExit: !0,
-    ...n,
+    ...r,
     children: t
   }
 );
 export {
-  c as SwitchFadeTransition
+  u as SwitchFadeTransition
 };

package/dist/components/ui/SwitchSlideTransition/index.d.ts

@@ -20,4 +20,4 @@ export type SwitchSlideTransitionRef<T extends Key> = SwitchTransitionRef<T>;
  * @param props.timeout - The timeout for the transition.
  * @returns {JSX.Element} The SwitchSlideTransition component.
  */
-export declare const SwitchSlideTransition: <T extends Key>({ children, className, direction, timeout, ...props }: SwitchSlideTransitionProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const SwitchSlideTransition: <T extends Key>({ children, direction, timeout, ...props }: SwitchSlideTransitionProps<T>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/SwitchSlideTransition/index.js

@@ -1,27 +1,23 @@
 import { jsx as e } from "react/jsx-runtime";
 import "react";
 import { SwitchTransition as o } from "../SwitchTransition/index.js";
-import '../../../assets/SwitchSlideTransition.css';const a = {
-  "switch-slide-transition": "SwitchSlideTransition-module__switch-slide-transition___FykQG"
-}, u = ({
+const p = ({
   children: t,
-  className: i = "",
-  direction: n = "left",
-  timeout: r = 300,
-  ...s
+  direction: r = "left",
+  timeout: n = 300,
+  ...i
 }) => /* @__PURE__ */ e(
   o,
   {
-    transitionName: `slide-${n}`,
-    className: `${a["switch-slide-transition"]} ${i}`,
+    transitionName: `slide-${r}`,
     preEnter: !0,
     mountOnEnter: !0,
     unmountOnExit: !0,
-    timeout: r,
-    ...s,
+    timeout: n,
+    ...i,
     children: t
   }
 );
 export {
-  u as SwitchSlideTransition
+  p as SwitchSlideTransition
 };

package/dist/components/ui/SwitchTransition/index.d.ts

@@ -1,7 +1,11 @@
 import { ElementType, HTMLAttributes, Key, ReactNode, Ref } from 'react';
 import { TransitionMapOptions, TransitionMapResult } from '../../../hooks/useTransitionMap';
 import { TransitionState } from '../../../utils/transition';
-export { type TransitionMapOptions, type TransitionMapResult, type TransitionState };
+/**
+ * A pre-defined transition name type.
+ */
+type TransitionName = "fade" | "slide-left" | "slide-right";
+export { type TransitionMapOptions, type TransitionMapResult, type TransitionState, type TransitionName, };
 /**
  * TransitionRef type for the SwitchTransition component.
  */
@@ -36,8 +40,10 @@ export interface SwitchTransitionProps<T extends Key> extends Omit<HTMLAttribute
     className?: string;
     /** Item keys to transition between. */
     items: readonly T[] | T[];
+    /** The item to start in the entered state. Defaults to the first item. Only relevant when `initialEntered` is set. */
+    initialItem?: T;
     /** The name of the transition. Use one of the defined values to use a pre-defined transition, or a custom string to use a custom transition. */
-    transitionName: "fade" | "slide-left" | "slide-right" | string;
+    transitionName: TransitionName | string;
     /** A ref to provide access to the transition result. */
     transitionRef?: Ref<SwitchTransitionRef<T>>;
 }
@@ -52,6 +58,7 @@ export interface SwitchTransitionProps<T extends Key> extends Omit<HTMLAttribute
  * @param {(props: { key: T } & Partial<TransitionState>) => ReactNode} props.children - A render function for each child. A child will be rednered for each item in the `items` prop, which will be passed to the render function as the `key` prop. The TransitionState (status, isMounted, isEnter, isResolved) will also be passed to the render function as data-attributes.
  * @param {string} props.className - The class name to apply to the component.
  * @param {T[]} props.items - Item keys to transition between.
+ * @param {T} props.initialItem - The item to start in the entered state (defaults to the first item).
  * @param {TransitionMapOptions["enter"]} props.enter - Enable or disable enter phase transitions.
  * @param {TransitionMapOptions["exit"]} props.exit - Enable or disable exit phase transition.
  * @param {TransitionMapOptions["initialEntered"]} props.initialEntered - Beginning from 'entered' state.
@@ -66,4 +73,4 @@ export interface SwitchTransitionProps<T extends Key> extends Omit<HTMLAttribute
  * @param {CSSProperties} props.style - Styles to apply to the component.
  * @returns {JSX.Element} The component.
  */
-export declare const SwitchTransition: <T extends Key>({ allowMultiple, animateHeight, autoFocus, initialEntered, as: Component, children, className, enter, exit, items, mountOnEnter, onStateChange, preEnter, preExit, style, timeout, transitionName, transitionRef, unmountOnExit, ...props }: SwitchTransitionProps<T>) => import("react/jsx-runtime").JSX.Element;
+export declare const SwitchTransition: <T extends Key>({ allowMultiple, animateHeight, autoFocus, initialEntered, as: Component, children, className, enter, exit, items, initialItem, mountOnEnter, onStateChange, preEnter, preExit, style, timeout, transitionName, transitionRef, unmountOnExit, ...props }: SwitchTransitionProps<T>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/SwitchTransition/index.js

@@ -1,153 +1,154 @@
-import { jsx as b, Fragment as H } from "react/jsx-runtime";
-import { useRef as R, useId as J, useState as _, useImperativeHandle as P, useLayoutEffect as Q, useEffect as j } from "react";
-import { useTransitionMap as U } from "../../../hooks/useTransitionMap.js";
-import '../../../assets/SwitchTransition.css';const V = {
+import { jsx as b, Fragment as J } from "react/jsx-runtime";
+import { useRef as _, useId as P, useState as j, useImperativeHandle as Q, useLayoutEffect as U, useEffect as q } from "react";
+import { useTransitionMap as V } from "../../../hooks/useTransitionMap.js";
+import '../../../assets/SwitchTransition.css';const W = {
   "transition-wrapper": "SwitchTransition-module__transition-wrapper___jrI35"
-}, W = (v) => {
+}, X = (y) => {
   const {
     children: n,
-    index: r,
-    itemKey: i,
-    initialEntered: u,
-    setItem: f,
-    deleteItem: p,
-    stateMap: y,
-    transitionName: I,
-    parentKey: m
-  } = v;
-  j(() => (f(i, { initialEntered: u }), () => {
-    p(i);
-  }), [i, u, f, p]);
-  const { isEnter: h, isMounted: w, isResolved: x, status: g } = y.get(i) || {};
-  return w ? n({
-    "data-index": r,
+    index: i,
+    itemKey: s,
+    initialEntered: r,
+    setItem: p,
+    deleteItem: m,
+    stateMap: I,
+    transitionName: w,
+    parentKey: v
+  } = y;
+  q(() => (p(s, { initialEntered: r }), () => {
+    m(s);
+  }), [s, r, p, m]);
+  const a = I.get(s), x = a?.isMounted ?? !!r, h = a?.isEnter ?? !!r, g = a?.isResolved ?? !!r, E = a?.status ?? (r ? "entered" : void 0);
+  return x ? n({
+    "data-index": i,
     inert: !h,
-    itemKey: i,
-    "data-transition": I,
-    "data-status": g,
+    itemKey: s,
+    "data-transition": w,
+    "data-status": E,
     "data-is-enter": h,
-    "data-is-resolved": x,
-    "data-parent": m
+    "data-is-resolved": g,
+    "data-parent": v
   }) : null;
-}, k = ({
-  allowMultiple: v,
+}, F = ({
+  allowMultiple: y,
   animateHeight: n,
-  autoFocus: r,
-  initialEntered: i,
-  as: u = "div",
-  children: f,
-  className: p = "",
-  enter: y,
-  exit: I,
-  items: m,
-  mountOnEnter: h,
-  onStateChange: w,
-  preEnter: x,
-  preExit: g,
-  style: q,
+  autoFocus: i,
+  initialEntered: s,
+  as: r = "div",
+  children: p,
+  className: m = "",
+  enter: I,
+  exit: w,
+  items: v,
+  initialItem: a,
+  mountOnEnter: x,
+  onStateChange: h,
+  preEnter: g,
+  preExit: E,
+  style: z,
   timeout: e = 200,
   transitionName: $,
-  transitionRef: z,
-  unmountOnExit: L,
-  ...E
+  transitionRef: L,
+  unmountOnExit: N,
+  ...R
 }) => {
-  const N = R(m[0]), O = J(), o = E.id || O, [S, A] = _(null), [C, K] = _(null), T = R(null), a = U({
-    allowMultiple: v,
+  const O = _(a ?? v[0]), A = P(), d = R.id || A, [S, B] = j(null), [M, C] = j(null), T = _(null), c = V({
+    allowMultiple: y,
     initialEntered: !1,
-    mountOnEnter: h,
-    unmountOnExit: L,
-    preEnter: x,
-    preExit: g,
-    enter: y,
-    exit: I,
+    mountOnEnter: x,
+    unmountOnExit: N,
+    preEnter: g,
+    preExit: E,
+    enter: I,
+    exit: w,
     timeout: e,
-    onStateChange: w
+    onStateChange: h
   });
-  P(z, () => ({
-    transition: n || r ? {
-      ...a,
+  Q(L, () => ({
+    transition: n || i ? {
+      ...c,
       toggle: (t) => {
-        a.toggle(t), A(t);
+        c.toggle(t), B(t);
       }
-    } : a
-  })), Q(() => {
+    } : c
+  })), U(() => {
     if (!n)
       return;
     let t = null;
-    const s = T.current;
-    if (!s)
+    const o = T.current;
+    if (!o)
       return;
-    const d = setTimeout(() => {
-      const c = s.querySelector(
-        `[data-is-enter="true"][data-parent="${o}"]`
+    const l = setTimeout(() => {
+      const u = o.querySelector(
+        `[data-is-enter="true"][data-parent="${d}"]`
       );
-      if (!c)
+      if (!u)
         return;
-      const l = c?.scrollHeight ?? null;
-      l !== null && K(l), t = new ResizeObserver((B) => {
-        for (const D of B) {
-          const G = D.contentRect.height;
-          K(G);
+      const f = u?.scrollHeight ?? null;
+      f !== null && C(f), t = new ResizeObserver((D) => {
+        for (const G of D) {
+          const H = G.contentRect.height;
+          C(H);
         }
-      }), t.observe(c);
+      }), t.observe(u);
     }, 0);
     return () => {
-      d && clearTimeout(d), t?.disconnect();
+      l && clearTimeout(l), t?.disconnect();
     };
-  }, [n, S, o]), j(() => {
-    if (!r)
+  }, [n, S, d]), q(() => {
+    if (!i)
       return;
     const t = typeof e == "number" ? e : e.enter;
     if (t === void 0)
       return;
-    const s = setTimeout(() => {
-      const d = T.current?.querySelector(
-        `[data-is-enter="true"][data-parent="${o}"]`
+    const o = setTimeout(() => {
+      const l = T.current?.querySelector(
+        `[data-is-enter="true"][data-parent="${d}"]`
       );
-      if (!d)
+      if (!l)
         return;
-      const c = typeof r == "string" ? r : 'input, textarea, select, button, [tabindex]:not([tabindex="-1"])', l = d.querySelector(c);
-      l && l.focus();
+      const u = typeof i == "string" ? i : 'input, textarea, select, button, [tabindex]:not([tabindex="-1"])', f = l.querySelector(u);
+      f && f.focus();
     }, t);
     return () => {
-      s && clearTimeout(s);
+      o && clearTimeout(o);
     };
-  }, [r, S, o, e]);
-  const M = /* @__PURE__ */ b(H, { children: m.map((t, s) => /* @__PURE__ */ b(
-    W,
+  }, [i, S, d, e]);
+  const K = /* @__PURE__ */ b(J, { children: v.map((t, o) => /* @__PURE__ */ b(
+    X,
     {
-      index: s,
+      index: o,
       itemKey: t,
-      setItem: a.setItem,
-      deleteItem: a.deleteItem,
-      stateMap: a.stateMap,
-      initialEntered: i ? N.current === t : void 0,
+      setItem: c.setItem,
+      deleteItem: c.deleteItem,
+      stateMap: c.stateMap,
+      initialEntered: s ? O.current === t : void 0,
       transitionName: $,
-      parentKey: o,
-      children: f
+      parentKey: d,
+      children: p
     },
     t
   )) });
   return /* @__PURE__ */ b(
-    u,
+    r,
     {
-      ...E,
-      id: o,
+      ...R,
+      id: d,
       ref: T,
       "data-transition": $ || void 0,
       "data-animate-height": n,
-      className: `${V["transition-wrapper"]} ${p}`,
+      className: `${W["transition-wrapper"]} ${m}`,
       style: {
-        ...q,
+        ...z,
         "--cdp-web-transition-enter-timeout": typeof e == "object" ? `${e.enter ?? 200}ms` : void 0,
         "--cdp-web-transition-exit-timeout": typeof e == "object" ? `${e.exit ?? 200}ms` : void 0,
         "--cdp-web-transition-timeout": typeof e == "number" ? `${e}ms` : void 0,
-        "--cdp-web-transition-height": n && C ? `${C}px` : void 0
+        "--cdp-web-transition-height": n && M ? `${M}px` : void 0
       },
-      children: n ? /* @__PURE__ */ b("div", { children: M }) : M
+      children: n ? /* @__PURE__ */ b("div", { children: K }) : K
     }
   );
 };
 export {
-  k as SwitchTransition
+  F as SwitchTransition
 };

package/dist/hooks/useVerifyMfaModal.js

@@ -1,7 +1,7 @@
 import "react/jsx-runtime";
 import "@coinbase/cdp-core";
 import "../chunks/useSendComponentCallOnce.BI4daEvm.js";
-import { g as t, h as m, f as p } from "../chunks/CDPReactProvider.CFWIUvzR.js";
+import { g as t, h as m, f as p } from "../chunks/CDPReactProvider.BWInVuNJ.js";
 import "react";
 export {
   t as VerifyMfaModalProvider,

package/dist/icons/IconBaseColorLogo.d.ts

@@ -0,0 +1,10 @@
+import { SVGProps } from 'react';
+/**
+ * Colored Base logo icon component (Base blue).
+ *
+ * @param {SVGProps<SVGSVGElement>} props - The props for the icon.
+ * @returns {JSX.Element} The Base logo icon.
+ *
+ * @group Components
+ */
+export declare const IconBaseColorLogo: (props: Omit<SVGProps<SVGSVGElement>, "viewBox">) => import("react/jsx-runtime").JSX.Element;

package/dist/icons/IconBaseColorLogo.js

@@ -0,0 +1,13 @@
+import { jsx as o } from "react/jsx-runtime";
+import "react";
+import { SvgIcon as r } from "./SvgIcon.js";
+const h = (C) => /* @__PURE__ */ o(r, { width: "32", height: "32", viewBox: "0 0 249 249", ...C, children: /* @__PURE__ */ o(
+  "path",
+  {
+    d: "M0 19.671C0 12.9332 0 9.56425 1.26956 6.97276C2.48511 4.49151 4.49151 2.48511 6.97276 1.26956C9.56425 0 12.9332 0 19.671 0H229.329C236.067 0 239.436 0 242.027 1.26956C244.508 2.48511 246.515 4.49151 247.73 6.97276C249 9.56425 249 12.9332 249 19.671V229.329C249 236.067 249 239.436 247.73 242.027C246.515 244.508 244.508 246.515 242.027 247.73C239.436 249 236.067 249 229.329 249H19.671C12.9332 249 9.56425 249 6.97276 247.73C4.49151 246.515 2.48511 244.508 1.26956 242.027C0 239.436 0 236.067 0 229.329V19.671Z",
+    fill: "#0000FF"
+  }
+) });
+export {
+  h as IconBaseColorLogo
+};