> ## Documentation Index
> Fetch the complete documentation index at: https://docs.crovver.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Paywall

> Block content behind an active subscription requirement.

`<Paywall>` renders its children only when the tenant has an active subscription. Otherwise it shows a customizable upgrade prompt.

## Usage

```tsx theme={null}
import { Paywall } from 'crovver-react';

<Paywall>
  <PremiumDashboard />
</Paywall>
```

## Props

| Prop               | Type                                            | Default                 | Description                                                         |
| ------------------ | ----------------------------------------------- | ----------------------- | ------------------------------------------------------------------- |
| `children`         | `ReactNode`                                     | —                       | Content shown when subscribed                                       |
| `fallback`         | `(redirectToCheckout: () => void) => ReactNode` | Built-in upgrade prompt | Render prop called with `redirectToCheckout` when not subscribed    |
| `loadingComponent` | `ReactNode`                                     | `null`                  | Content shown while loading                                         |
| `autoRedirect`     | `boolean`                                       | `true`                  | Automatically redirect to checkout when no subscription is detected |
| `style`            | `CSSProperties`                                 | —                       | Inline styles applied to the default paywall card                   |

## Custom Fallback

`fallback` is a **render prop** — it receives `redirectToCheckout` so you can wire your own CTA:

```tsx theme={null}
<Paywall
  fallback={(redirectToCheckout) => (
    <div className="upgrade-banner">
      <h2>Subscribe to access this feature</h2>
      <button onClick={redirectToCheckout}>Upgrade</button>
    </div>
  )}
>
  <AnalyticsDashboard />
</Paywall>
```

## Behavior

| Subscription Status                       | What renders       |
| ----------------------------------------- | ------------------ |
| Loading                                   | `loadingComponent` |
| `active` or `trial`                       | `children`         |
| `past_due`, `canceled`, `expired`, `none` | `fallback`         |