@coinbase/cdp-react 0.0.67 → 0.0.69

package/dist/assets/ExportWallet.css

@@ -1 +1 @@
-.ExportWallet-module__export-wallet___EyZys{box-sizing:border-box;font:var(--cdp-web-font-size-base) / 1.5 var(--cdp-web-font-family-body);font-optical-sizing:auto;background-color:var(--cdp-web-colors-page-bg-default);color:var(--cdp-web-colors-page-text-default);display:flex;flex-direction:column;max-width:38.25em;gap:1em;padding:1.5em 1.5em 1em;overflow:hidden;width:100%}.ExportWallet-module__export-wallet___EyZys.ExportWallet-module__no-footer___fzl3R{padding-bottom:1.5em}.ExportWallet-module__export-wallet___EyZys [data-part=iframe-button]{margin:-.25em;width:calc(100% + .5em)}.ExportWallet-module__export-wallet___EyZys *{box-sizing:border-box}.ExportWallet-module__export-wallet-title___MuI09{font-size:1em;line-height:1.1;font-weight:600;margin:0}.ExportWallet-module__footer___NvrFY{padding-left:0;padding-right:0}.ExportWalletModal-module__export-wallet___--L56{height:100%;overflow:hidden;gap:0}.ExportWalletModal-module__trigger___zMk8N{padding-left:2em;padding-right:2em}.ExportWalletModal-module__title-bar___RTPZq{display:flex;justify-content:space-between;align-items:center;margin-bottom:1em;width:100%}.ExportWalletModal-module__content___KzNol{display:flex;flex-direction:column;gap:1em}.ExportWalletModal-module__close-button___ImsDR{padding:0}.ExportWalletModal-module__close-icon___iAfyT{height:1.5em;width:1.5em}.ExportWalletModal-module__footer___byg1T{padding:.75em 0 0}@media (min-width: 450px){.ExportWalletModal-module__modal___pX1AP{max-width:25em}}
+.ExportWallet-module__export-wallet___EyZys{box-sizing:border-box;font:var(--cdp-web-font-size-base) / 1.5 var(--cdp-web-font-family-body);font-optical-sizing:auto;background-color:var(--cdp-web-colors-page-bg-default);color:var(--cdp-web-colors-page-text-default);display:flex;flex-direction:column;max-width:38.25em;gap:1em;padding:1.5em 1.5em 1em;overflow:hidden;width:100%}.ExportWallet-module__export-wallet___EyZys.ExportWallet-module__no-footer___fzl3R{padding-bottom:1.5em}.ExportWallet-module__export-wallet___EyZys [data-part=iframe-button]{margin:-2px;width:calc(100% + 4px)}.ExportWallet-module__export-wallet___EyZys *{box-sizing:border-box}.ExportWallet-module__export-wallet-title___MuI09{font-size:1em;line-height:1.1;font-weight:600;margin:0}.ExportWallet-module__footer___NvrFY{padding-left:0;padding-right:0}.ExportWalletModal-module__export-wallet___--L56{height:100%;overflow:hidden;gap:0}.ExportWalletModal-module__trigger___zMk8N{padding-left:2em;padding-right:2em}.ExportWalletModal-module__title-bar___RTPZq{display:flex;justify-content:space-between;align-items:center;margin-bottom:1em;width:100%}.ExportWalletModal-module__content___KzNol{display:flex;flex-direction:column;gap:1em}.ExportWalletModal-module__close-button___ImsDR{padding:0}.ExportWalletModal-module__close-icon___iAfyT{height:1.5em;width:1.5em}.ExportWalletModal-module__footer___byg1T{padding:.75em 0 0}@media (min-width: 450px){.ExportWalletModal-module__modal___pX1AP{max-width:25em}}

package/dist/assets/IframeButton.css

@@ -1 +1 @@
-.IframeButton-module__iframe-button___XeAhH{position:relative;width:min-content;height:3.5em;padding-left:2.5em;padding-right:2.5em}.IframeButton-module__iframe-button___XeAhH>*{grid-area:center}.IframeButton-module__iframe-button___XeAhH.IframeButton-module__full-width___lQWpM{width:100%}.IframeButton-module__iframe-button___XeAhH.IframeButton-module__size-lg___HCOiF{height:4em}.IframeButton-module__iframe-button___XeAhH.IframeButton-module__size-md___p44a4{height:3.5em}.IframeButton-module__iframe-button___XeAhH.IframeButton-module__size-sm___U8ILi{padding-left:2em;padding-right:2em;height:3em}.IframeButton-module__iframe-button___XeAhH.IframeButton-module__size-xs___S2jGa{padding-left:1.5em;padding-right:1.5em;height:2.5em}.IframeButton-module__loading-skeleton___fzBol{border-radius:var(--cdp-web-borderRadius-cta);width:calc(100% - .5em);height:calc(100% - .5em);position:absolute;top:50%;left:50%;transform:translate3d(-50%,-50%,0)}.IframeButton-module__label___Vvl8W{visibility:hidden;white-space:nowrap;position:relative}.IframeButton-module__iframe-button___XeAhH.IframeButton-module__with-icon___KBiq1 .IframeButton-module__label___Vvl8W{padding-left:1em}.IframeButton-module__iframe___0RBLL{border:none;width:100%;height:100%;position:absolute;top:50%;left:50%;transform:translate3d(-50%,-50%,0)}.IframeButton-module__iframe___0RBLL.IframeButton-module__hidden___LcF1X{display:none}.IframeButton-module__computed-style___ciB13{position:absolute;visibility:hidden;pointer-events:none;background-color:var(--cdp-web-colors-page-bg-default);border-radius:var(--cdp-web-borderRadius-cta);font-size:var(--cdp-web-font-size-base);font-family:var(--cdp-web-font-family-cta);font-weight:500;top:-999px;left:-999px;width:1px;height:1px}.IframeButton-module__computed-style___ciB13 canvas{width:100%;height:100%}
+.IframeButton-module__iframe-button___XeAhH{position:relative;width:min-content;height:calc(3em + 4px);padding-left:2.5em;padding-right:2.5em}.IframeButton-module__iframe-button___XeAhH>*{grid-area:center}.IframeButton-module__iframe-button___XeAhH.IframeButton-module__full-width___lQWpM{width:100%}.IframeButton-module__iframe-button___XeAhH.IframeButton-module__size-lg___HCOiF{height:calc(3.5em + 4px)}.IframeButton-module__iframe-button___XeAhH.IframeButton-module__size-md___p44a4{height:calc(3em + 4px)}.IframeButton-module__iframe-button___XeAhH.IframeButton-module__size-sm___U8ILi{padding-left:2em;padding-right:2em;height:calc(2.5em + 4px)}.IframeButton-module__iframe-button___XeAhH.IframeButton-module__size-xs___S2jGa{padding-left:1.5em;padding-right:1.5em;height:calc(2em + 4px)}.IframeButton-module__loading-skeleton___fzBol{border-radius:var(--cdp-web-borderRadius-cta);width:calc(100% - 4px);height:calc(100% - 4px);position:absolute;top:50%;left:50%;transform:translate3d(-50%,-50%,0)}.IframeButton-module__label___Vvl8W{visibility:hidden;white-space:nowrap;position:relative}.IframeButton-module__iframe-button___XeAhH.IframeButton-module__with-icon___KBiq1 .IframeButton-module__label___Vvl8W{padding-left:1em}.IframeButton-module__iframe___0RBLL{border:none;width:100%;height:100%;position:absolute;top:50%;left:50%;transform:translate3d(-50%,-50%,0)}.IframeButton-module__iframe___0RBLL.IframeButton-module__hidden___LcF1X{display:none}.IframeButton-module__computed-style___ciB13{position:absolute;visibility:hidden;pointer-events:none;background-color:var(--cdp-web-colors-page-bg-default);border-radius:var(--cdp-web-borderRadius-cta);font-size:var(--cdp-web-font-size-base);font-family:var(--cdp-web-font-family-iframe, var(--cdp-web-font-family-cta));font-weight:500;top:-999px;left:-999px;width:1px;height:1px}.IframeButton-module__computed-style___ciB13 canvas{width:100%;height:100%}

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

@@ -7,10 +7,11 @@ interface CopyEvmKeyButtonProps extends Pick<ButtonProps, "size" | "fullWidth">
     icon?: boolean;
     label?: string;
     onReady?: () => void;
+    onSessionExpired?: () => void;
     onSuccess?: () => void;
     onError?: (error?: string) => void;
     theme?: Partial<IframeTheme>;
     variant?: Extract<ButtonProps["variant"], "primary" | "secondary">;
 }
-declare const CopyEvmKeyButton: ({ address, className, copiedLabel, icon, fullWidth, label, onReady, onSuccess, onError, size, theme: themeOverrides, variant, }: CopyEvmKeyButtonProps) => import("react/jsx-runtime").JSX.Element;
+declare const CopyEvmKeyButton: ({ address, className, copiedLabel, icon, fullWidth, label, onReady, onSessionExpired, onSuccess, onError, size, theme: themeOverrides, variant, }: CopyEvmKeyButtonProps) => import("react/jsx-runtime").JSX.Element | null;
 export { CopyEvmKeyButton, type CopyEvmKeyButtonProps };

package/dist/components/CopyEvmKeyButton/index.js

@@ -1,57 +1,72 @@
 import { jsx as B } from "react/jsx-runtime";
-import { useConfig as I } from "@coinbase/cdp-hooks";
-import { useRef as T, useState as j, useCallback as k, useEffect as w } from "react";
+import { useConfig as S } from "@coinbase/cdp-hooks";
+import { u as _ } from "../../chunks/useSendComponentCallOnce.BHZMuo6E.js";
+import { useRef as j, useState as i, useCallback as E } from "react";
 import "../ui/Button/index.js";
-import { IframeButton as E } from "../ui/IframeButton/index.js";
-import { useKeyExportPostMessage as K } from "../../hooks/useKeyExportPostMessage.js";
-import "@coinbase/cdp-core";
-const D = ({
+import { IframeButton as K } from "../ui/IframeButton/index.js";
+import { useKeyExportPostMessage as T } from "../../hooks/useKeyExportPostMessage.js";
+import "../../types/secureIframe.js";
+const F = ({
   address: p,
   className: n = "",
   copiedLabel: c = "Copied",
-  icon: r = !0,
+  icon: e = !0,
   fullWidth: u,
-  label: o = "Copy key",
-  onReady: m,
-  onSuccess: i,
-  onError: f,
-  size: h,
+  label: t = "Copy key",
+  onReady: r,
+  onSessionExpired: o,
+  onSuccess: s,
+  onError: a,
+  size: f,
   theme: d,
   variant: l
 }) => {
+  _("copy_evm_key_button");
   const {
-    config: { projectId: C, secureIframeBasePath: g }
-  } = I(), s = T(null), [e, y] = j(void 0), P = k(
-    (t, x) => {
-      t === "ready" && m?.(), t === "success" && i?.(), t === "error" && f?.(x);
+    config: { projectId: y, secureIframeBasePath: b }
+  } = S(), m = j(null), [h, k] = i(void 0), [C, g] = i(!1), v = E(
+    (P, w) => {
+      switch (P) {
+        case "ready":
+          r?.();
+          break;
+        case "success":
+          s?.();
+          break;
+        case "error":
+          a?.(w);
+          break;
+        case "expired":
+          g(!0), o?.();
+          break;
+      }
     },
-    [m, i, f]
-  ), { iframeUrl: b, isPending: v, onThemeChange: a } = K({
+    [r, s, a, o]
+  ), { iframeUrl: x, isPending: I } = T({
     address: p,
     type: "evm",
-    projectId: C,
-    label: o,
-    basePath: g,
+    projectId: y,
+    label: t,
+    basePath: b,
     copiedLabel: c,
-    icon: r,
-    iframeRef: s,
-    onStatusUpdate: P,
-    theme: e
+    icon: e,
+    iframeRef: m,
+    onStatusUpdate: v,
+    theme: h
   });
-  return w(() => {
-    e && a(e);
-  }, [e, a]), /* @__PURE__ */ B(
-    E,
+  return C ? null : /* @__PURE__ */ B(
+    K,
     {
-      ref: s,
-      src: b,
+      "data-testid": "copy-evm-key-button",
+      ref: m,
+      src: x,
       allow: "clipboard-read; clipboard-write",
-      isPending: v,
-      label: o,
-      icon: r,
+      isPending: I,
+      label: t,
+      icon: e,
       fullWidth: u,
-      onThemeChange: y,
-      size: h,
+      onThemeChange: k,
+      size: f,
       theme: d,
       variant: l,
       className: n
@@ -59,5 +74,5 @@ const D = ({
   );
 };
 export {
-  D as CopyEvmKeyButton
+  F as CopyEvmKeyButton
 };

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

@@ -7,10 +7,11 @@ interface CopySolanaKeyButtonProps extends Pick<ButtonProps, "size" | "fullWidth
     icon?: boolean;
     label?: string;
     onReady?: () => void;
+    onSessionExpired?: () => void;
     onSuccess?: () => void;
     onError?: (error?: string) => void;
     theme?: Partial<IframeTheme>;
     variant?: Extract<ButtonProps["variant"], "primary" | "secondary">;
 }
-declare const CopySolanaKeyButton: ({ address, className, copiedLabel, icon, fullWidth, label, onReady, onSuccess, onError, size, theme: themeOverrides, variant, }: CopySolanaKeyButtonProps) => import("react/jsx-runtime").JSX.Element;
+declare const CopySolanaKeyButton: ({ address, className, copiedLabel, icon, fullWidth, label, onReady, onSessionExpired, onSuccess, onError, size, theme: themeOverrides, variant, }: CopySolanaKeyButtonProps) => import("react/jsx-runtime").JSX.Element | null;
 export { CopySolanaKeyButton, type CopySolanaKeyButtonProps };

package/dist/components/CopySolanaKeyButton/index.js

@@ -1,57 +1,72 @@
-import { jsx as I } from "react/jsx-runtime";
-import { useConfig as T } from "@coinbase/cdp-hooks";
-import { useRef as j, useState as k, useCallback as w, useEffect as K } from "react";
+import { jsx as B } from "react/jsx-runtime";
+import { useConfig as _ } from "@coinbase/cdp-hooks";
+import { u as j } from "../../chunks/useSendComponentCallOnce.BHZMuo6E.js";
+import { useRef as K, useState as i, useCallback as T } from "react";
 import "../ui/Button/index.js";
-import { IframeButton as S } from "../ui/IframeButton/index.js";
-import { useKeyExportPostMessage as U } from "../../hooks/useKeyExportPostMessage.js";
-import "@coinbase/cdp-core";
-const D = ({
-  address: n,
+import { IframeButton as U } from "../ui/IframeButton/index.js";
+import { useKeyExportPostMessage as v } from "../../hooks/useKeyExportPostMessage.js";
+import "../../types/secureIframe.js";
+const F = ({
+  address: m,
   className: p = "",
   copiedLabel: c = "Copied",
-  icon: t = !0,
+  icon: e = !0,
   fullWidth: u,
-  label: r = "Copy key",
-  onReady: m,
-  onSuccess: a,
-  onError: i,
-  size: h,
+  label: t = "Copy key",
+  onReady: o,
+  onSessionExpired: r,
+  onSuccess: s,
+  onError: a,
+  size: f,
   theme: l,
   variant: d
 }) => {
+  j("copy_solana_key_button");
   const {
-    config: { projectId: C, secureIframeBasePath: g }
-  } = T(), s = j(null), [e, y] = k(void 0), P = w(
-    (o, B) => {
-      o === "ready" && m?.(), o === "success" && a?.(), o === "error" && i?.(B);
+    config: { projectId: y, secureIframeBasePath: b }
+  } = _(), n = K(null), [h, k] = i(void 0), [C, g] = i(!1), x = T(
+    (S, w) => {
+      switch (S) {
+        case "ready":
+          o?.();
+          break;
+        case "success":
+          s?.();
+          break;
+        case "error":
+          a?.(w);
+          break;
+        case "expired":
+          g(!0), r?.();
+          break;
+      }
     },
-    [m, a, i]
-  ), { iframeUrl: b, isPending: x, onThemeChange: f } = U({
-    address: n,
+    [o, s, a, r]
+  ), { iframeUrl: I, isPending: P } = v({
+    address: m,
     type: "solana",
-    projectId: C,
-    label: r,
-    basePath: g,
+    projectId: y,
+    label: t,
+    basePath: b,
     copiedLabel: c,
-    icon: t,
-    iframeRef: s,
-    onStatusUpdate: P,
-    theme: e
+    icon: e,
+    iframeRef: n,
+    onStatusUpdate: x,
+    theme: h
   });
-  return K(() => {
-    e && f(e);
-  }, [e, f]), /* @__PURE__ */ I(
-    S,
+  return C ? null : /* @__PURE__ */ B(
+    U,
     {
-      ref: s,
-      src: b,
+      "data-testid": "copy-solana-key-button",
+      ref: n,
+      src: I,
       allow: "clipboard-read; clipboard-write",
-      isPending: x,
-      label: r,
-      icon: t,
+      isPending: P,
+      label: t,
+      icon: e,
       fullWidth: u,
-      onThemeChange: y,
-      size: h,
+      onThemeChange: k,
+      size: f,
       theme: l,
       variant: d,
       className: p
@@ -59,5 +74,5 @@ const D = ({
   );
 };
 export {
-  D as CopySolanaKeyButton
+  F as CopySolanaKeyButton
 };

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

@@ -1,21 +1,31 @@
-import { ElementType, HTMLAttributes } from 'react';
+import { ElementType, HTMLAttributes, ReactNode } from 'react';
 import { CopyAddressProps } from '../CopyAddress';
 import { CopyEvmKeyButtonProps } from '../CopyEvmKeyButton';
 interface ExportWalletTitleProps extends HTMLAttributes<HTMLElement> {
     as?: ElementType;
 }
-interface ExportWalletProps extends HTMLAttributes<HTMLDivElement> {
+interface ExportWalletProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
+    children?: ReactNode | ((props: {
+        type: ExportWalletContext["type"];
+        isSessionExpired: ExportWalletContext["isSessionExpired"];
+    }) => ReactNode);
     address: string;
     onIframeReady?: () => void;
     onCopySuccess?: () => void;
     onIframeError?: (error?: string) => void;
+    onIframeSessionExpired?: () => void;
+}
+interface ExportWalletContext extends Pick<ExportWalletProps, "address" | "onIframeReady" | "onCopySuccess" | "onIframeError" | "onIframeSessionExpired"> {
+    type: "evm-eoa" | "evm-smart" | "solana";
+    isSessionExpired: boolean;
 }
 type ExportWalletCopyAddressProps = Omit<CopyAddressProps, "address">;
 type ExportWalletCopyKeyButtonProps = Omit<CopyEvmKeyButtonProps, "address" | "onError" | "onReady" | "onSuccess">;
+declare const ExportWalletContext: import('react').Context<ExportWalletContext>;
 declare const ExportWalletTitle: ({ children, className, as: Component, ...props }: ExportWalletTitleProps) => import("react/jsx-runtime").JSX.Element;
 declare const ExportWalletWarning: (props: HTMLAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
 declare const ExportWalletCopyAddress: ({ label, ...props }: ExportWalletCopyAddressProps) => import("react/jsx-runtime").JSX.Element;
 declare const ExportWalletCopyKeyButton: ({ fullWidth, ...props }: ExportWalletCopyKeyButtonProps) => import("react/jsx-runtime").JSX.Element | null;
 declare const ExportWalletFooter: (props: HTMLAttributes<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element;
-declare const ExportWallet: ({ address, children, className, onIframeError, onIframeReady, onCopySuccess, ...props }: ExportWalletProps) => import("react/jsx-runtime").JSX.Element;
+declare const ExportWallet: ({ address, children, className, onIframeError, onIframeReady, onIframeSessionExpired, onCopySuccess, ...props }: ExportWalletProps) => import("react/jsx-runtime").JSX.Element;
 export { ExportWallet, ExportWalletCopyAddress, ExportWalletCopyKeyButton, ExportWalletFooter, ExportWalletTitle, ExportWalletWarning, type ExportWalletProps, type ExportWalletCopyAddressProps, type ExportWalletCopyKeyButtonProps, type ExportWalletTitleProps, };