Product Discovery data & events

The Product Discovery 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.

Auto-generated on 2025-10-21. Do not edit this page directly.

Emits Reference

Note

All emitted events are bidirectional. See Emits and Listens Reference below.

Listens Reference

Note

All events this drop-in listens for are bidirectional. See Emits and Listens Reference below.

Emits and Listens Reference

Bidirectional events that both emit state changes and listen for external updates.

Event	Direction	Description
search/error	Emits and Listens	Triggered when an error occurs
search/loading	Emits and Listens	Triggered when loading state changes
search/result	Emits and Listens	Triggered when results are available

Event Details

The following sections provide detailed information about each event, including its direction, data payload structure, and usage examples.

search/error (emits and listens)

Triggered when an error occurs

Data payload

string

Usage

Listen to this event in your storefront:

import { events } from '@dropins/tools/event-bus.js';

const searchErrorListener = events.on('search/error', (data) => {
  console.log('search/error event received:', data);
  // Add your custom logic here
});

// Later, when you want to stop listening
searchErrorListener.off();

search/loading (emits and listens)

Triggered when loading state changes

Data payload

boolean

Usage

Listen to this event in your storefront:

import { events } from '@dropins/tools/event-bus.js';

const searchLoadingListener = events.on('search/loading', (data) => {
  console.log('search/loading event received:', data);
  // Add your custom logic here
});

// Later, when you want to stop listening
searchLoadingListener.off();

search/result (emits and listens)

Triggered when results are available

Data payload

{
result: ProductSearchResult;
request: SearchVariables;
}

Property	Type	Description
result	ProductSearchResult	See type definition in source code
request	SearchVariables	See type definition in source code

Usage

Listen to this event in your storefront:

import { events } from '@dropins/tools/event-bus.js';

const searchResultListener = events.on('search/result', (data) => {
  console.log('search/result event received:', data);
  // Add your custom logic here
});

// Later, when you want to stop listening
searchResultListener.off();