Fix wide appender buttons overlap in Cart & Checkout blocks in the Ed…

…itor (#5801)

* Add the correct appender button for non empty groups

* Revert "Add the correct appender button for non empty groups"

This reverts commit 4b41d7d.

* Force position relative for custom InnerBlocks.ButtonBlockAppender  appenders.

Removing InnerBlocks.ButtonBlockAppender  from renderAppender = {InnerBlocks.ButtonBlockAppender } results in the black appender button beeing shown only when the block is selected, and we need the appender to be visible by default.

assets/js/blocks/cart-checkout/cart/editor.scss

@@ -20,3 +20,12 @@ body.wc-lock-selected-block--remove {
 	}
 }
 
+.wp-block-woocommerce-cart-items-block,
+.wp-block-woocommerce-cart-totals-block,
+.wp-block-woocommerce-empty-cart-block {
+	// Temporary fix after the appender button was positioned absolute
+	// See https://github.com/woocommerce/woocommerce-gutenberg-products-block/issues/5742#issuecomment-1032804168
+	.block-list-appender {
+		position: relative;
+	}
+}

assets/js/blocks/cart-checkout/mini-cart-contents/editor.scss

@@ -21,6 +21,13 @@
 			flex-direction: column;
 			height: 100%;
 		}
+
+		// Temporary fix after the appender button was positioned absolute
+		// See https://github.com/woocommerce/woocommerce-gutenberg-products-block/issues/5742#issuecomment-1032804168
+		.block-list-appender {
+			position: relative;
+		}
+
 	}
 
 	.wp-block-woocommerce-mini-cart-products-table-block {
@@ -52,5 +59,11 @@
 			box-sizing: border-box;
 			padding: $gap-largest $gap $gap;
 		}
+
+		// Temporary fix after the appender button was positioned absolute
+		// See https://github.com/woocommerce/woocommerce-gutenberg-products-block/issues/5742#issuecomment-1032804168
+		.block-list-appender {
+			position: relative;
+		}
 	}
 }

assets/js/blocks/checkout/styles/editor.scss

@@ -23,6 +23,12 @@
 		.block-editor-block-list__layout {
 			display: block;
 		}
+
+		// Temporary fix after the appender button was positioned absolute
+		// See https://github.com/woocommerce/woocommerce-gutenberg-products-block/issues/5742#issuecomment-1032804168
+		.block-list-appender {
+			position: relative;
+		}
 	}
 }