@blocklet/payment-react/docs/hooks.md

Reusable react components for payment kit v2

# Hooks

The `@blocklet/payment-react` library provides a set of custom React hooks to encapsulate and simplify common logic, such as handling real-time events or adapting to different screen sizes. These hooks allow you to easily integrate advanced functionalities into your components with minimal boilerplate code.

Explore the available hooks to enhance your application's interactivity and responsiveness.

<x-cards>
  <x-card data-title="useSubscription" data-icon="lucide:webhook" data-href="/hooks/use-subscription">
    Subscribe to real-time events from the payment service, such as 'invoice.paid', to create dynamic and responsive user experiences.
  </x-card>
  <x-card data-title="useMobile" data-icon="lucide:smartphone" data-href="/hooks/use-mobile">
    A utility hook for detecting if the application is being viewed on a mobile device, helping you build responsive and mobile-friendly UIs.
  </x-card>
</x-cards>