Wishlist data & events
The Wishlist drop-in uses the Event Bus to emit and listen to events for communication between drop-ins and external integrations. For common events shared across multiple drop-ins (such as locale
, error
, authenticated
, etc.), see the Common Events Reference.
Emits Reference
Events produced by this drop-in that you can subscribe to.
Event | Direction | Description |
---|---|---|
wishlist/initialized | Emits | Emitted when the component completes initialization |
Listens Reference
Emits and Listens Reference
Bidirectional events that both emit state changes and listen for external updates.
Event | Direction | Description |
---|---|---|
wishlist/alert | Emits and Listens | Triggered when an alert or notification is triggered |
wishlist/data | Emits and Listens | Triggered when data is available or changes |
wishlist/reset | Emits and Listens | Triggered when the component state is reset |
Event Details
The following sections provide detailed information about each event, including its direction, data payload structure, and usage examples.
wishlist/initialized (emits)
Emitted when the component completes initialization
Data payload
Wishlist | null
Usage
Listen to this event in your storefront:
import { events } from '@dropins/tools/event-bus.js';
const wishlistInitializedListener = events.on('wishlist/initialized', (data) => { console.log('wishlist/initialized event received:', data); // Add your custom logic here});
// Later, when you want to stop listeningwishlistInitializedListener.off();
wishlist/alert (emits and listens)
Triggered when an alert or notification is triggered
Data payload
WishlistActionPayload | null
Usage
Listen to this event in your storefront:
import { events } from '@dropins/tools/event-bus.js';
const wishlistAlertListener = events.on('wishlist/alert', (data) => { console.log('wishlist/alert event received:', data); // Add your custom logic here});
// Later, when you want to stop listeningwishlistAlertListener.off();
wishlist/data (emits and listens)
Triggered when data is available or changes
Data payload
Wishlist | null
Usage
Listen to this event in your storefront:
import { events } from '@dropins/tools/event-bus.js';
const wishlistDataListener = events.on('wishlist/data', (data) => { console.log('wishlist/data event received:', data); // Add your custom logic here});
// Later, when you want to stop listeningwishlistDataListener.off();
wishlist/reset (emits and listens)
Triggered when the component state is reset
Data payload
void
Usage
Listen to this event in your storefront:
import { events } from '@dropins/tools/event-bus.js';
const wishlistResetListener = events.on('wishlist/reset', (data) => { console.log('wishlist/reset event received:', data); // Add your custom logic here});
// Later, when you want to stop listeningwishlistResetListener.off();