PurchaseOrderStatus Container
Displays the current status and detailed information for a specific purchase order.
Version: 1.0.0-beta3
Configuration
The PurchaseOrderStatus container provides the following configuration options:
| Parameter | Type | Req? | Description |
|---|---|---|---|
className | string | No | Additional CSS classes to apply to the container for custom styling. |
withHeader | boolean | No | When true, displays the header section. Set to false when embedding the container within a layout that provides its own header. |
withWrapper | boolean | No | When true, wraps the container in a styled wrapper. Set to false for custom styling or when the container is embedded within another styled component. |
Slots
This container exposes the following slots for customization:
| Slot | Type | Required | Description |
|---|---|---|---|
PurchaseOrderActions | SlotProps | Yes | Customize action buttons for purchase order operations (approve, reject, cancel, place order). |
Usage
The following example demonstrates how to use the PurchaseOrderStatus container:
import { render as provider } from '@dropins/storefront-purchase-order/render.js';import { PurchaseOrderStatus } from '@dropins/storefront-purchase-order/containers/PurchaseOrderStatus.js';
await provider.render(PurchaseOrderStatus, { className: "Example Name", withHeader: true, withWrapper: true, slots: { // Add custom slot implementations here }})(block);