The Cart dialog block can display a button to the WooCommerce mini cart widget in a Dialog, which is a light-weight alternative for the WC “Mini-cart” block.
When WooCommerce isn’t activated the block renders nothing.
The inner block for the Cart dialog block is a button that will open the dialog – the button can be customized using any blocks, how ever the main element should remain a <button>
(or use the x-bind="trigger"
attribute to work with the Dialog module) and the element that should display the cart item count should have the .ska-cart-item-count
class.
The block comes with a [&_.woocommerce-mini-cart]
selector that can contain Tailwind classes for styling the contents of the dialog. If you plan to use the mini cart in multiple places it would be a good idea to turn it into a preset.