# PaywallOptions

Options for configuring the appearance and behavior of paywalls.

> **Warning**

**Deprecated SDK**We strongly recommend migrating to the new [Superwall Expo SDK](/docs/expo), see our [migration guide](/docs/expo/guides/migrating-react-native) for details.



Purpose [#purpose]

Options for configuring the appearance and behavior of paywalls. Use this to customize how paywalls are presented and how purchase failures are handled.

> **Note**

`PaywallOptions` (and its `RestoreFailed` helper) do not take constructor arguments. Create an instance, then set properties directly.



Signature [#signature]

```typescript
export class PaywallOptions {
  isHapticFeedbackEnabled = true
  restoreFailed: RestoreFailed = new RestoreFailed()
  shouldShowPurchaseFailureAlert = true
  shouldPreload = false
  automaticallyDismiss = true
  transactionBackgroundView: TransactionBackgroundView = TransactionBackgroundView.spinner
}
```

Properties [#properties]

<TypeTable
  type="{
  isHapticFeedbackEnabled: {
    type: &#x22;boolean&#x22;,
    description: &#x22;Whether haptic feedback is enabled when interacting with paywalls.&#x22;,
    default: &#x22;true&#x22;,
  },
  restoreFailed: {
    type: &#x22;RestoreFailed&#x22;,
    description: &#x22;Configuration for the alert shown when restore purchases fails.&#x22;,
    required: true,
  },
  shouldShowPurchaseFailureAlert: {
    type: &#x22;boolean&#x22;,
    description: &#x22;Whether to show an alert when a purchase fails.&#x22;,
    default: &#x22;true&#x22;,
  },
  shouldPreload: {
    type: &#x22;boolean&#x22;,
    description: &#x22;Whether paywalls should be preloaded. If `false`, you can manually preload using `preloadAllPaywalls()` or `preloadPaywalls()`.&#x22;,
    default: &#x22;false&#x22;,
  },
  automaticallyDismiss: {
    type: &#x22;boolean&#x22;,
    description: &#x22;Whether paywalls should automatically dismiss after a successful purchase.&#x22;,
    default: &#x22;true&#x22;,
  },
  transactionBackgroundView: {
    type: &#x22;TransactionBackgroundView&#x22;,
    description: &#x22;The view to show behind Apple's payment sheet during a transaction. Options: `spinner`, `none`.&#x22;,
    default: &#x22;spinner&#x22;,
  },
}"
/>

Usage [#usage]

Create paywall options:

```typescript
import { PaywallOptions, TransactionBackgroundView, RestoreFailed } from "@superwall/react-native-superwall"

const paywallOptions = new PaywallOptions()
paywallOptions.isHapticFeedbackEnabled = true
paywallOptions.shouldShowPurchaseFailureAlert = false
paywallOptions.shouldPreload = true
paywallOptions.automaticallyDismiss = true
paywallOptions.transactionBackgroundView = TransactionBackgroundView.spinner

const restoreFailed = new RestoreFailed()
restoreFailed.title = "No Subscription Found"
restoreFailed.message = "We couldn't find an active subscription for your account."
restoreFailed.closeButtonTitle = "Okay"

paywallOptions.restoreFailed = restoreFailed

const superwallOptions = new SuperwallOptions({
  paywalls: paywallOptions
})

await Superwall.configure({
  apiKey: "pk_your_api_key",
  options: superwallOptions
})
```

RestoreFailed [#restorefailed]

Customize the alert shown when restore purchases fails:

```typescript
const restoreFailed = new RestoreFailed()
restoreFailed.title = "No Subscription Found"
restoreFailed.message = "We couldn't find an active subscription for your account."
restoreFailed.closeButtonTitle = "Okay"

const paywallOptions = new PaywallOptions()
paywallOptions.restoreFailed = restoreFailed
```

Transaction Background View [#transaction-background-view]

Control what appears behind Apple's payment sheet:

```typescript
// Show a spinner (default)
const options1 = new PaywallOptions({
  transactionBackgroundView: TransactionBackgroundView.spinner
})

// Show nothing
const options2 = new PaywallOptions({
  transactionBackgroundView: TransactionBackgroundView.none
})
```

Related [#related]

* [`SuperwallOptions`](/docs/react-native/sdk-reference/SuperwallOptions) - Main SDK configuration options
* [`preloadAllPaywalls()`](/docs/react-native/sdk-reference/Superwall) - Manually preload all paywalls
* [`preloadPaywalls()`](/docs/react-native/sdk-reference/Superwall) - Manually preload specific paywalls