Commit 85668ff2289 for woocommerce
commit 85668ff22898560865f67508958c489218c188e4
Author: Kathy <507025+helgatheviking@users.noreply.github.com>
Date: Thu Oct 22 05:32:09 2026 -0400
First pass at a block.json for cart block. Closes #55985. (#56142)
* Add block.json for cart block
* Fix Cart block metadata registration
* Update changelog for Cart block metadata
---------
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
diff --git a/docs/block-development/reference/block-references.md b/docs/block-development/reference/block-references.md
index 4e74d091ec2..29296af0e8a 100644
--- a/docs/block-development/reference/block-references.md
+++ b/docs/block-development/reference/block-references.md
@@ -184,6 +184,15 @@ Enable customers to keep track of their location within the store and navigate b
- **Supports:** align (full, wide), color (link, text, ~~background~~), interactivity (clientNavigation), typography (fontSize, lineHeight), ~~html~~
- **Attributes:** align, contentJustification, fontSize
+## Cart - woocommerce/cart
+
+Shopping cart.
+
+- **Name:** woocommerce/cart
+- **Category:** woocommerce
+- **Supports:** align (wide), ~~html~~, ~~multiple~~
+- **Attributes:** align, checkoutPageId, hasDarkControls, showRateAfterTaxName
+
## Accepted Payment Methods - woocommerce/cart-accepted-payment-methods-block
Display accepted payment methods.
diff --git a/plugins/woocommerce/changelog/issues-55985-cart-block b/plugins/woocommerce/changelog/issues-55985-cart-block
new file mode 100644
index 00000000000..e9986f6552d
--- /dev/null
+++ b/plugins/woocommerce/changelog/issues-55985-cart-block
@@ -0,0 +1,3 @@
+Significance: patch
+Type: dev
+Comment: Register the Cart block from block.json so extensions can filter its metadata.
diff --git a/plugins/woocommerce/client/blocks/assets/js/blocks/cart/block.json b/plugins/woocommerce/client/blocks/assets/js/blocks/cart/block.json
new file mode 100644
index 00000000000..65872ec4597
--- /dev/null
+++ b/plugins/woocommerce/client/blocks/assets/js/blocks/cart/block.json
@@ -0,0 +1,32 @@
+{
+ "name": "woocommerce/cart",
+ "title": "Cart",
+ "description": "Shopping cart.",
+ "category": "woocommerce",
+ "keywords": [ "WooCommerce" ],
+ "supports": {
+ "align": [ "wide" ],
+ "html": false,
+ "multiple": false
+ },
+ "example": {
+ "viewportWidth": 800
+ },
+ "attributes": {
+ "hasDarkControls": {
+ "type": "boolean"
+ },
+ "checkoutPageId": {
+ "type": "number"
+ },
+ "showRateAfterTaxName": {
+ "type": "boolean"
+ },
+ "align": {
+ "type": "string"
+ }
+ },
+ "textdomain": "woocommerce",
+ "apiVersion": 3,
+ "$schema": "https://schemas.wp.org/trunk/block.json"
+}
diff --git a/plugins/woocommerce/client/blocks/assets/js/blocks/cart/frontend.js b/plugins/woocommerce/client/blocks/assets/js/blocks/cart/frontend.js
index 551fc593faa..988027d64d0 100644
--- a/plugins/woocommerce/client/blocks/assets/js/blocks/cart/frontend.js
+++ b/plugins/woocommerce/client/blocks/assets/js/blocks/cart/frontend.js
@@ -14,7 +14,7 @@ import { renderParentBlock } from '@woocommerce/utils/render-parent-block';
import './inner-blocks/register-components';
import Block from './block';
import { blockName, blockAttributes } from './attributes';
-import { metadata } from './metadata';
+import metadata from './block.json';
const getProps = ( el ) => {
return {
diff --git a/plugins/woocommerce/client/blocks/assets/js/blocks/cart/index.js b/plugins/woocommerce/client/blocks/assets/js/blocks/cart/index.js
index 2e86cbd1c61..1bedb16230d 100644
--- a/plugins/woocommerce/client/blocks/assets/js/blocks/cart/index.js
+++ b/plugins/woocommerce/client/blocks/assets/js/blocks/cart/index.js
@@ -2,23 +2,39 @@
* External dependencies
*/
import clsx from 'clsx';
+import { __ } from '@wordpress/i18n';
+import { cart } from '@woocommerce/icons';
+import { Icon } from '@wordpress/icons';
import { InnerBlocks } from '@wordpress/block-editor';
import { registerBlockType, createBlock } from '@wordpress/blocks';
/**
* Internal dependencies
*/
+import metadata from './block.json';
import { Edit, Save } from './edit';
import './style.scss';
-import { blockName, blockAttributes } from './attributes';
+import { blockAttributes } from './attributes';
import './inner-blocks';
-import { metadata } from './metadata';
+
+const registeredAttributes = { ...metadata.attributes, ...blockAttributes };
/**
* Register and run the Cart block.
*/
export const settings = {
- ...metadata,
- attributes: blockAttributes,
+ // Keep the existing gettext context until translation packs include the block.json context.
+ title: __( 'Cart', 'woocommerce' ),
+ description: __( 'Shopping cart.', 'woocommerce' ),
+ keywords: [ __( 'WooCommerce', 'woocommerce' ) ],
+ icon: {
+ src: (
+ <Icon
+ icon={ cart }
+ className="wc-block-editor-components-block-icon"
+ />
+ ),
+ },
+ attributes: registeredAttributes,
edit: Edit,
save: Save,
transforms: {
@@ -42,7 +58,7 @@ export const settings = {
// Migrates v1 to v2 checkout.
deprecated: [
{
- attributes: blockAttributes,
+ attributes: registeredAttributes,
save: ( { attributes } ) => {
return (
<div
@@ -101,4 +117,4 @@ export const settings = {
],
};
-registerBlockType( blockName, settings );
+registerBlockType( metadata, settings );
diff --git a/plugins/woocommerce/client/blocks/assets/js/blocks/cart/metadata.tsx b/plugins/woocommerce/client/blocks/assets/js/blocks/cart/metadata.tsx
deleted file mode 100644
index 40a5779973c..00000000000
--- a/plugins/woocommerce/client/blocks/assets/js/blocks/cart/metadata.tsx
+++ /dev/null
@@ -1,31 +0,0 @@
-/**
- * External dependencies
- */
-import { __ } from '@wordpress/i18n';
-import { BlockConfiguration } from '@wordpress/blocks';
-import { cart } from '@woocommerce/icons';
-import { Icon } from '@wordpress/icons';
-
-export const metadata: BlockConfiguration = {
- title: __( 'Cart', 'woocommerce' ),
- apiVersion: 3,
- icon: {
- src: (
- <Icon
- icon={ cart }
- className="wc-block-editor-components-block-icon"
- />
- ),
- },
- category: 'woocommerce',
- keywords: [ __( 'WooCommerce', 'woocommerce' ) ],
- description: __( 'Shopping cart.', 'woocommerce' ),
- supports: {
- align: [ 'wide' ],
- html: false,
- multiple: false,
- },
- example: {
- viewportWidth: 800,
- },
-};