Quick Order initialization

The Quick Order initializer configures the Quick Order B2B drop-in for bulk ordering: it sets the GraphQL endpoint (Core Service), loads placeholders from placeholders/quick-order.json, and passes language definitions. The drop-in reads the store configuration (quickOrderActive) to enable or disable the feature.

Version: 1.1.0

Configuration options

Parameter	Type	Req?	Description
langDefinitions	LangDefinitions	No	Language definitions for internationalization (i18n). Override dictionary keys for localization or branding.
quickOrderActive	boolean	No	Override for the Quick Order feature flag. When false, containers show a disabled overlay. By default the drop-in reads this from store config (storeConfig.quickorder_active).

Default configuration

Defaults when no configuration is provided:

import { initializers } from '@dropins/tools/initializer.js';
import { initialize, setEndpoint } from '@dropins/storefront-quick-order/api.js';
import { initializeDropin } from './index.js';
import { CORE_FETCH_GRAPHQL, fetchPlaceholders } from '../commerce.js';

await initializeDropin(async () => {
  setEndpoint(CORE_FETCH_GRAPHQL);
  const labels = await fetchPlaceholders('placeholders/quick-order.json');
  const langDefinitions = {
    default: { ...labels },
  };
  return initializers.mountImmediately(initialize, { langDefinitions });
})();

Note

The boilerplate uses initializeDropin to coordinate initialization order. The labels from placeholders/quick-order.json are spread into langDefinitions.default. The drop-in deep-merges these with its built-in defaults.

Language definitions

Override dictionary keys for localization or branding. The langDefinitions object maps locale keys to custom strings that override default text for the drop-in.

const langDefinitions = {
  default: {
    QuickOrder: {
      QuickOrderItem: {
        addAllToCart: 'Add All to Cart',
        emptyList: 'No products in the list',
        // ... other keys — see Dictionary page
      },
    },
  },
};

return initializers.mountImmediately(initialize, { langDefinitions });

Tip

For the full list of keys and multi-language support, see the Quick Order Dictionary. For patterns and placeholders, see Dictionary customization.

Store configuration

The drop-in reads store config from Adobe Commerce:

Config key	Description
quickorder_active	When false, Quick Order is disabled; all containers show a disabled overlay.

Enable Quick Order in Adobe Commerce Admin: Stores > Settings > Configuration > General > B2B Features > Enable Quick Order. Apply the configuration to both .page and .live when using this drop-in.

Configuration types

LangDefinitions

Maps locale identifiers to dictionaries of key-value pairs. The default locale is used as the fallback when no specific locale matches.

langDefinitions?: {
  [locale: string]: {
    [key: string]: string | Record<string, string>;
  };
};