Company Switcher Events and Data

The Company Switcher drop-in uses the event bus to emit and listen to events for communication between drop-ins and external integrations.

Version: 1.0.0

Events reference

Event	Direction	Description
checkout/initialized	Listens	Fired by Checkout (checkout) when the component completes initialization.
checkout/updated	Listens	Fired by Checkout (checkout) when the component state is updated.
company/updated	Listens	Fired by Company (company) when the component state is updated.
companyContext/changed	Emits and listens	Triggered when a change occurs.

Event details

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

checkout/initialized

Fired by Checkout (checkout) when the component completes initialization. It listen

Event payload

Cart | NegotiableQuote | null

See Cart, NegotiableQuote for full type definitions.

Example

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

events.on('checkout/initialized', (payload) => {
  console.log('checkout/initialized event received:', payload);
  // Add your custom logic here
});

checkout/updated

Fired by Checkout (checkout) when the component state is updated. It listens for updates.

Event payload

Cart | NegotiableQuote | null

See Cart, NegotiableQuote for full type definitions.

Example

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

events.on('checkout/updated', (payload) => {
  console.log('checkout/updated event received:', payload);
  // Add your custom logic here
});

company/updated

Fired by Company (company) when the component state is updated. It listens for updates to company data.

Event payload

{
  company: {
  id: string;
  name: string;
  email: string;
  legalAddress: {
  street: string[];
  city: string;
  region: {
  region: string;
  regionCode: string;
  regionId: number;
}
  countryCode: string;
  postcode: string;
  telephone: string;
}
  companyAdmin: {
  id: string;
  firstname: string;
  lastname: string;
  email: string;
}
  salesRepresentative: {
  firstname: string;
  lastname: string;
  email: string;
}
  availablePaymentMethods: Array<{
  code: string;
  title: string;
  }>;
  availableShippingMethods: Array<{
  code: string;
  title: string;
  }>;
  canEditAccount: boolean;
  canEditAddress: boolean;
  permissionsFlags: {
  canViewAccount: boolean;
  canEditAccount: boolean;
  canViewAddress: boolean;
  canEditAddress: boolean;
  canViewContacts: boolean;
  canViewPaymentInformation: boolean;
  canViewShippingInformation: boolean;
}
  customerRole: {
  id: string;
  name: string;
  permissions: any[];
}
  customerStatus: string;
}
}

Example

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

events.on('company/updated', (payload) => {
  console.log('company/updated event received:', payload);
  // Add your custom logic here
});

companyContext/changed

Triggered when a change occurs. It both emits and listens for changes in company context.

When triggered

• After user selects a different company from the switcher
• On initial page load when company context is established
• After successful company context update
• When company headers are set via setCompanyHeaders()
• When company headers are removed by passing null to setCompanyHeaders()

Usage scenarios

• Refresh company-specific data across the application.
• Update user permissions for the new company context.
• Reload company-dependent drop-ins (Purchase Order, Quote Management, and so on).
• Clear cached data from previous company.
• Update navigation and menu items based on new company.
• Track company switching behavior in analytics.
• Update session storage or cookies.
• Refresh company structure and hierarchy displays.
• Update approval rules and workflows.
• Reload requisition lists for new company.

Event payload

string | null

Example

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

events.on('companyContext/changed', (companyId) => {
  if (companyId) {
    console.log(`Company context changed to: ${companyId}`);

    // Refresh all company-specific data
    refreshCompanyData(companyId);

    // Update permissions for new company
    refreshUserPermissions();

    // Reload company-specific UI components
    reloadCompanyDependentData();

    // Track analytics
    trackCompanySwitch(companyId);
  } else {
    console.log('Company context removed');

    // Clear company-specific caches
    clearCompanyCache();
  }
});

Integration with other drop-ins

The companyContext/changed event is critical for coordinating multiple B2B drop-ins. When this event fires, other drop-ins should refresh their data: