initial commit

packages/woocommerce-blocks/assets/js/blocks/cart-checkout/cart-i2/inner-blocks/cart-items-block/block.json

@@ -0,0 +1,26 @@
+{
+	"name": "woocommerce/cart-items-block",
+	"version": "1.0.0",
+	"title": "Cart Items block",
+	"description": "Column containing cart items.",
+	"category": "woocommerce",
+	"supports": {
+		"align": false,
+		"html": false,
+		"multiple": false,
+		"reusable": false,
+		"inserter": false
+	},
+	"attributes": {
+		"lock": {
+			"type": "object",
+			"default": {
+				"remove": true,
+				"move": true
+			}
+		}
+	},
+	"parent": [ "woocommerce/filled-cart-block" ],
+	"textdomain": "woo-gutenberg-products-block",
+	"apiVersion": 2
+}

packages/woocommerce-blocks/assets/js/blocks/cart-checkout/cart-i2/inner-blocks/cart-items-block/edit.tsx

@@ -0,0 +1,41 @@
+/**
+ * External dependencies
+ */
+import { useBlockProps, InnerBlocks } from '@wordpress/block-editor';
+import { Main } from '@woocommerce/base-components/sidebar-layout';
+import { innerBlockAreas } from '@woocommerce/blocks-checkout';
+
+/**
+ * Internal dependencies
+ */
+import { useForcedLayout } from '../../use-forced-layout';
+import { getAllowedBlocks } from '../../editor-utils';
+
+export const Edit = ( { clientId }: { clientId: string } ): JSX.Element => {
+	const blockProps = useBlockProps();
+	const allowedBlocks = getAllowedBlocks( innerBlockAreas.CART_ITEMS );
+
+	useForcedLayout( {
+		clientId,
+		template: allowedBlocks,
+	} );
+	return (
+		<Main className="wc-block-cart__main">
+			<div { ...blockProps }>
+				<InnerBlocks
+					allowedBlocks={ allowedBlocks }
+					templateLock={ false }
+					renderAppender={ InnerBlocks.ButtonBlockAppender }
+				/>
+			</div>
+		</Main>
+	);
+};
+
+export const Save = (): JSX.Element => {
+	return (
+		<div { ...useBlockProps.save() }>
+			<InnerBlocks.Content />
+		</div>
+	);
+};

packages/woocommerce-blocks/assets/js/blocks/cart-checkout/cart-i2/inner-blocks/cart-items-block/frontend.tsx

@@ -0,0 +1,14 @@
+/**
+ * External dependencies
+ */
+import { Main } from '@woocommerce/base-components/sidebar-layout';
+
+const FrontendBlock = ( {
+	children,
+}: {
+	children: JSX.Element;
+} ): JSX.Element => {
+	return <Main className="wc-block-cart__main">{ children }</Main>;
+};
+
+export default FrontendBlock;

packages/woocommerce-blocks/assets/js/blocks/cart-checkout/cart-i2/inner-blocks/cart-items-block/index.tsx

@@ -0,0 +1,20 @@
+/**
+ * External dependencies
+ */
+import { Icon, column } from '@wordpress/icons';
+import { registerFeaturePluginBlockType } from '@woocommerce/block-settings';
+
+/**
+ * Internal dependencies
+ */
+import { Edit, Save } from './edit';
+import metadata from './block.json';
+
+registerFeaturePluginBlockType( metadata, {
+	icon: {
+		src: <Icon icon={ column } />,
+		foreground: '#874FB9',
+	},
+	edit: Edit,
+	save: Save,
+} );