Purchase Order overview
The Purchase Order B2B drop-in enables full purchase order functionality, including purchase order creation, approval rules, conditional checkout logic for placing purchase orders, the purchase order list, and the purchase order details containers.
Supported Commerce features
The following table provides an overview of the Adobe Commerce features that the Purchase Order drop-in supports:
| Feature | Status |
|---|---|
| Purchase order creation | Supported |
| Purchase order approval rules | Supported |
| Purchase order approval workflows | Supported |
| Purchase order comments and history | Supported |
| Purchase order list views | Supported |
| Purchase order details view | Supported |
| Conditional checkout logic | Supported |
| Company and subordinate views | Supported |
| Bulk approve/reject actions | Supported |
| Convert purchase order to order | Supported |
| ACL permission-based access control | Supported |
| GraphQL API integration | Supported |
Key events
The Purchase Order drop-in exposes the following key events through the boilerplate:
purchase-order/data
Emitted by the purchase order initializer.
Requires passing a poRef (Purchase Order UID) to the initializer.
The event contains the full purchase order payload used by the purchase order details container.
After loading and transforming the purchase order data, it also emits an order/data event, which is required to initialize the following Order drop-in containers (used on the purchase order details page):
- CustomerDetails
- OrderCostSummary
- OrderProductList
purchase-order/refresh
Should be emitted when all purchase order containers need to refresh their data (e.g., when the company context changes).
Section topics
The topics in this section will help you understand how to customize and use the Purchase Order effectively within your storefront.
Quick Start
Provides quick reference information and getting started guide for the Purchase Order drop-in. This topic covers package details, import paths, and basic usage examples to help you integrate Purchase Order functionality into your site.
Initialization
Explains how to initialize the Purchase Order drop-in with configuration options including language definitions for internationalization, custom data models for type transformations, and the poRef parameter for loading specific purchase order details. The initializer emits key events (purchase-order/data and order/data) that are used by containers to display purchase order information.
Containers
Describes the 12 UI containers including: approval rule management (ApprovalRuleDetails, ApprovalRuleForm, ApprovalRulesList), purchase order lists (CompanyPurchaseOrders, CustomerPurchaseOrders, RequireApprovalPurchaseOrders), and purchase order details components (PurchaseOrderStatus, PurchaseOrderApprovalFlow, PurchaseOrderCommentForm, PurchaseOrderCommentsList, PurchaseOrderHistoryLog, PurchaseOrderConfirmation). Each container is optimized for specific user roles and workflows based on ACL permissions.
Functions
Documents the 17 API functions for managing purchase orders including creating and placing purchase orders, managing approval rules (create, update, delete, retrieve), performing purchase order actions (approve, reject, cancel, validate), adding comments, converting purchase orders to orders, and retrieving purchase order data with filtering and pagination support.
Events
Explains the events emitted during purchase order lifecycle: purchase-order/data (emitted by the initializer with full purchase order payload), purchase-order/refresh (triggers data refresh across all containers), and purchase-order/placed (emitted when a new purchase order is created from a cart). The purchase-order/data event also triggers an order/data event to initialize Order drop-in containers on the details page.
Slots
Describes the customization slots available for extending UI functionality, including the PurchaseOrderActions slot in the PurchaseOrderStatus container for customizing action buttons (approve, reject, cancel, place order) or adding additional custom actions with business logic.
Dictionary
Explains the 251 internationalization keys for translating purchase order UI text including approval rule labels, purchase order status messages, form field labels, action button text, validation errors, and empty state messages. Supports full localization for multi-language B2B storefronts.
Styles
Describes how to customize the appearance of purchase order containers including approval rule forms and lists, purchase order tables, status badges, action buttons, comment forms, history logs, and approval flow displays using CSS variables and design tokens. Covers styling for all 12 container components with detailed CSS class references.