useSuperwallEvents
Subscribe to any Superwall SDK event in Expo with the useSuperwallEvents hook, from paywall present and dismiss to purchases, custom actions and logs.
Purpose
The useSuperwallEvents hook provides a low-level way to subscribe to any native Superwall event. This is useful for advanced use cases or for events not covered by the more specific hooks. Listeners are automatically cleaned up when the component using this hook unmounts.
Parameters
Prop
Type
SuperwallEventCallbacks
Prop
Type
SuperwallEventInfo
Prop
Type
Customer Center and Teleport events
These events arrive through onSuperwallEvent. Read the event name from
eventInfo.event.event; the event-specific fields are on eventInfo.event. Customer Center
events are available on iOS and Android. Teleport events are iOS only.
| Event | Event fields |
|---|---|
customerCenterOpen | screen ("management" or "noPurchases"); presentation ("sheet" on iOS) |
customerCenterClose | No additional fields |
customerCenterAction | action, pathId, and optional productId |
customerCenterSurveyResponse | surveyId, optionId, action, pathId, and optional productId |
customerCenterRefundRequest | productId and status ("success", "userCancelled" on iOS, or "error") |
teleportOpen | paywallInfo for the paywall that opened a web flow |
teleportReturn | Optional paywallInfo for the paywall left open after a return link |
useSuperwallEvents({
onSuperwallEvent: (eventInfo) => {
const event = eventInfo.event;
if (event.event === "customerCenterAction") {
console.log("Customer Center action:", event.action, event.pathId);
}
if (event.event === "teleportReturn") {
console.log("Returned from a Teleport flow", event.paywallInfo);
}
},
});See the Customer Center guide for presentation callbacks and the deep-link guide for Teleport return links.
PageViewData
Prop
Type
PaywallPageViewEvent
Prop
Type
PaywallInfo
Prop
Type
Product
Prop
Type
CustomerInfo
Prop
Type
SubscriptionTransaction
Prop
Type
NonSubscriptionTransaction
Prop
Type
Returned Values
This hook does not return any values (void). Its purpose is to set up and tear down event listeners.
Example
import { useSuperwallEvents } from "expo-superwall";
function EventLogger() {
useSuperwallEvents({
onSuperwallEvent: (eventInfo) => {
console.log("Superwall Event:", eventInfo.event.event, eventInfo.params);
},
onSubscriptionStatusChange: (newStatus) => {
console.log("Subscription Status Changed:", newStatus.status);
},
onPaywallPresent: (info) => {
console.log("Paywall Presented (via useSuperwallEvents):", info.name);
},
onUserAttributesChange: (newAttributes) => {
console.log("User Attributes Changed:", newAttributes);
// Sync with analytics or update in-memory state
},
});
}How is this guide?
useSuperwall
Read Superwall SDK state and call actions in Expo with the useSuperwall hook, such as registerPlacement, identify, purchase and getCustomerInfo.
Configuring
Set Expo SDK options on SuperwallProvider, such as observer mode, test mode, Customer Center, iOS ad consent and the Android paywall presentation host.