The documentation for WooCommerce Blocks has moved to the WooCommerce monorepo.
Please refer to the documentation in the new location as the files in this repository will no longer be updated and the repository will be archived.
This document provides an overview of the data stores registered with wp.data
for use by various blocks. Store keys are exported as constants on the wc.wcBlocksData
export (externally registered as @woocommerce/block-data
and enqueued via handle wc-blocks-data-store
). For any block using the store, it's recommended to import the store key rather than using the reference directly to ensure dependencies are extracted correctly. It is assumed readers have some familiarity with the wp.data
API. You can read more about that here.
The Cart Store (wc/store/cart) is responsible for handling cart-related data and operations. To access this store using a constant, you can use:
const { CART_STORE_KEY } = window.wc.wcBlocksData;
The Checkout Store (wc/store/checkout) manages the checkout process, ensuring a seamless experience for users. To access this store using a constant, you can use:
const { CHECKOUT_STORE_KEY } = window.wc.wcBlocksData;
The Collections Store (wc/store/collections) holds data indexed by namespace, model name, and query string. To access this store using a constant, you can use:
const { COLLECTIONS_STORE_KEY } = window.wc.wcBlocksData;
The Payment Store (wc/store/payment) deals with all payment-related data and transactions. To access this store using a constant, you can use:
const { PAYMENT_STORE_KEY } = window.wc.wcBlocksData;
The Query-State Store (wc/store/query-state) holds arbitrary values indexed by context and key. It's often used for tracking the state of query objects for a given context. To access this store using a constant, you can use:
const { QUERY_STATE_STORE_KEY } = window.wc.wcBlocksData;
The Schema Store (wc/store/schema) is primarily used for accessing routes and has more of an internal usage. To access this store using a constant, you can use:
const { SCHEMA_STORE_KEY } = window.wc.wcBlocksData;
The Store Notices Store (wc/store/store-notices) is dedicated to handling various store notices and alerts. To access this store using a constant, you can use:
const { STORE_NOTICES_STORE_KEY } = window.wc.wcBlocksData;
The Validation Store (wc/store/validation) holds data relating to validation errors, it is primarily used in the Cart and Checkout flows to ensure the Checkout doesn't continue while invalid data is present. To access this store using a constant, you can use:
const { VALIDATION_STORE_KEY } = window.wc.wcBlocksData;
We're hiring! Come work with us!
🐞 Found a mistake, or have a suggestion? Leave feedback about this document here.