@coinbase/cdp-react-native 0.0.97 → 0.0.99

package/dist/types/index.d.ts

@@ -3,76 +3,271 @@ import { JSX } from 'react';
 import { Network } from '@coinbase/cdp-api-client';
 import { ReactNode } from 'react';
 
+/**
+ * ApplePayButton component that renders an inline WebView for the Apple Pay payment flow.
+ * The WebView displays Coinbase's Apple Pay button and handles the payment process.
+ * This component is iOS-only and will return null on other platforms.
+ * Available in US only.
+ *
+ * This component must be used within an ApplePayProvider and works in conjunction with
+ * the useApplePay hook. The button automatically reads the payment URL from context
+ * after an order is created.
+ *
+ * @example
+ * ```tsx
+ * function App() {
+ *   return (
+ *     <ApplePayProvider>
+ *       <ApplePayFlow />
+ *     </ApplePayProvider>
+ *   );
+ * }
+ *
+ * function ApplePayFlow() {
+ *   const { data, status, createOrder } = useApplePay();
+ *
+ *   const handleCreateOrder = async () => {
+ *     await createOrder({
+ *       destination: { address: "0x1234567890123456789012345678901234567890", network: "base" },
+ *       purchase: { amount: "100", currency: "usdc" },
+ *       payment: { currency: "usd" },
+ *       isSandbox: true,
+ *     });
+ *   };
+ *
+ *   return (
+ *     <>
+ *       <Button onPress={handleCreateOrder} />
+ *       {data && <ApplePayButton />}
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * @param props - The component props.
+ * @param props.style - Optional style for the container.
+ * @returns An inline WebView with Apple Pay on iOS, or null on other platforms or if no order exists.
+ * @throws Error if used outside of ApplePayProvider.
+ */
 export declare function ApplePayButton({ style }: ApplePayButtonProps): JSX.Element | null;
 
+/**
+ * Props for the ApplePayButton component.
+ */
 export declare interface ApplePayButtonProps {
+    /** Optional style for the container. */
     style?: object;
 }
 
+/**
+ * Context value exposed by ApplePayProvider.
+ */
 export declare interface ApplePayContextValue {
+    /**
+     * Creates an Apple Pay onramp order.
+     *
+     * @param options - The order creation options.
+     */
     createOrder: (options: CreateOrderOptions) => Promise<void>;
+    /** The data for the created order, or undefined. */
     data: EndUserApplePayOnrampOrderCreateResponse | undefined;
+    /** The current status of the onramp flow. */
     status: ApplePayOnrampStatus;
+    /** Any error that occurred, or undefined. */
     error: OnrampError | undefined;
+    /** Resets the hook state to idle. */
     reset: () => void;
+    /** Whether debug mode is enabled. */
     debug: boolean;
+    /**
+     * Internal: Handles payment events from the WebView.
+     * Used by ApplePayButton component.
+     *
+     * @param event - The event from the onramp widget.
+     */
     paymentEventHandler: (event: OnrampEvent) => void;
 }
 
+/**
+ * Status states for the Apple Pay onramp flow.
+ */
 export declare type ApplePayOnrampStatus = "idle" | "pending" | "error" | "success";
 
+/**
+ * Provider component for Apple Pay onramp functionality.
+ * Manages order creation, user verification, and payment status.
+ * Must wrap components that use useApplePay hook or ApplePayButton.
+ *
+ * @example
+ * ```tsx
+ * function App() {
+ *   return (
+ *     <ApplePayProvider>
+ *       <ApplePayFlow />
+ *     </ApplePayProvider>
+ *   );
+ * }
+ *
+ * function ApplePayFlow() {
+ *   const { status, data, createOrder, reset } = useApplePay();
+ *
+ *   return (
+ *     <>
+ *       <Button onPress={() => createOrder({...})} />
+ *       {data && <ApplePayButton />}
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * @param {ApplePayProviderProps} props - The provider props.
+ * @param {ReactNode} props.children - The child components to render within the provider.
+ * @param {boolean} [props.debug] - When true, logs webview events to the console.
+ * @returns {JSX.Element} The provider component.
+ */
 export declare function ApplePayProvider({ children, debug }: ApplePayProviderProps): JSX.Element;
 
+/**
+ * Props for ApplePayProvider.
+ */
 export declare interface ApplePayProviderProps {
+    /** The child components. */
     children: ReactNode;
+    /** When true, logs webview events to the console. Defaults to false. */
     debug?: boolean;
 }
 
+/**
+ * Options for creating an Apple Pay onramp order.
+ */
 export declare interface CreateOrderOptions {
     destination: {
+        /** The blockchain address receiving the purchased crypto. */
         address: string;
+        /** The blockchain network for the destination address. */
         network: Network;
     };
     purchase: {
+        /** The crypto amount to purchase, exclusive of fees (e.g., "10.00"). */
         amount: string;
+        /** The cryptocurrency to purchase (e.g., "usdc"). */
         currency: "usdc" | (string & {});
     };
     payment: {
+        /** The fiat currency to use for payment (e.g., "usd"). */
         currency: "usd" | (string & {});
     };
+    /** Set to true to perform a sandbox transaction for testing. Defaults to false. */
     isSandbox?: boolean;
 }
 
+/**
+ * Valid onramp event types.
+ */
 declare const ONRAMP_EVENT_TYPES: readonly ["onramp_api.load_pending", "onramp_api.load_success", "onramp_api.load_error", "onramp_api.polling_start", "onramp_api.polling_success", "onramp_api.polling_error", "onramp_api.commit_success", "onramp_api.commit_error", "onramp_api.cancel"];
 
+/**
+ * An error that occurred during the onramp process.
+ */
 export declare interface OnrampError {
+    /** A unique identifier for the request that generated the error. This can be used to help debug issues with the API. */
     correlationId?: string;
+    /** The error message. */
     message?: string;
+    /** The error code. This is a code returned by the webview when rendering the payment link. */
     code?: string;
 }
 
+/**
+ * An error event emitted by the onramp widget.
+ */
 declare type OnrampErrorEvent = {
     type: Extract<OnrampEventType, "onramp_api.load_error" | "onramp_api.commit_error" | "onramp_api.polling_error">;
     error: {
+        /** Optional error code. */
         code?: string;
+        /** Optional error message. */
         message?: string;
     };
 };
 
+/**
+ * Event emitted by the onramp widget.
+ */
 declare type OnrampEvent = {
+    /** The type of event. */
     type: Exclude<OnrampEventType, "onramp_api.load_error" | "onramp_api.commit_error" | "onramp_api.polling_error">;
+    /** Optional message with additional details. */
     message?: string;
 } | OnrampErrorEvent;
 
+/**
+ * Event types emitted by the onramp widget.
+ * These match the event types from the Coinbase Pay API.
+ */
 declare type OnrampEventType = (typeof ONRAMP_EVENT_TYPES)[number];
 
+/**
+ * Hook for managing Apple Pay onramp flow on iOS.
+ * Provides access to order creation and payment status from ApplePayProvider context.
+ * Must be used within an ApplePayProvider.
+ *
+ * You can get started testing the Apple Pay Onramp API using sandbox mode.
+ * When you're ready to test with real funds contact us to get production access.
+ *
+ * @example
+ * ```tsx
+ * function App() {
+ *   return (
+ *     <ApplePayProvider>
+ *       <ApplePayFlow />
+ *     </ApplePayProvider>
+ *   );
+ * }
+ *
+ * function ApplePayFlow() {
+ *   const { status, data, createOrder, reset } = useApplePay();
+ *
+ *   const handleCreateOrder = async () => {
+ *     await createOrder({
+ *       destination: { address: "0x1234567890123456789012345678901234567890", network: "base" },
+ *       purchase: { amount: "100", currency: "usdc" },
+ *       payment: { currency: "usd" },
+ *       isSandbox: true,
+ *     });
+ *   };
+ *
+ *   return (
+ *     <>
+ *       <Button onPress={handleCreateOrder} />
+ *       {data && <ApplePayButton />}
+ *     </>
+ *   );
+ * }
+ * ```
+ *
+ * @returns An object with functions and state for managing the onramp flow.
+ * @throws Error if used outside of ApplePayProvider.
+ */
 export declare function useApplePay(): UseApplePayReturn;
 
+/**
+ * Return type for the useApplePay hook.
+ */
 export declare interface UseApplePayReturn {
+    /**
+     * Creates an Apple Pay onramp order.
+     *
+     * @param options - The order creation options.
+     */
     createOrder: (options: CreateOrderOptions) => Promise<void>;
+    /** The data for the created order, or undefined. */
     data: EndUserApplePayOnrampOrderCreateResponse | undefined;
+    /** The current status of the onramp flow. */
     status: ApplePayOnrampStatus;
+    /** Any error that occurred, or undefined. */
     error: OnrampError | undefined;
+    /** Resets the hook state to idle. */
     reset: () => void;
 }
 

package/package.json

@@ -1,15 +1,15 @@
 {
   "name": "@coinbase/cdp-react-native",
-  "version": "0.0.97",
+  "version": "0.0.99",
   "type": "module",
   "peerDependencies": {
     "expo-apple-authentication": ">=4.0.0",
     "react": ">=18.2.0",
     "react-native": ">=0.70.0",
     "react-native-webview": ">=13.0.0",
-    "@coinbase/cdp-hooks": "^0.0.97",
-    "@coinbase/cdp-api-client": "^0.0.97",
-    "@coinbase/cdp-core": "^0.0.97"
+    "@coinbase/cdp-api-client": "^0.0.99",
+    "@coinbase/cdp-core": "^0.0.99",
+    "@coinbase/cdp-hooks": "^0.0.99"
   },
   "peerDependenciesMeta": {
     "expo-apple-authentication": {
@@ -23,9 +23,9 @@
     "react-dom": "^19.1.2",
     "react-native": "^0.79.6",
     "react-native-webview": "^13.13.5",
-    "@coinbase/cdp-core": "0.0.97",
-    "@coinbase/cdp-hooks": "0.0.97",
-    "@coinbase/cdp-api-client": "0.0.97"
+    "@coinbase/cdp-api-client": "0.0.99",
+    "@coinbase/cdp-core": "0.0.99",
+    "@coinbase/cdp-hooks": "0.0.99"
   },
   "files": [
     "dist/**",