Fix broken CSS classes and update JS unit snapshots (#45732)

* Fix broken CSS classes and update JS unit snapshots

* Add changefile(s) from automation for the following project(s): woocommerce-blocks

---------

Co-authored-by: github-actions <github-actions@github.com>

plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/footer-item/index.tsx

@@ -85,7 +85,7 @@ const TotalsFooterItem = ( {
 
 	const priceComponent = (
 		<FormattedMonetaryAmount
-			className="wc-block-components-totals-item__value"
+			className="wc-block-components-totals-footer-item-tax-value"
 			currency={ currency }
 			value={ parseInt( totalPrice, 10 ) }
 		/>

plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/totals/footer-item/test/__snapshots__/index.tsx.snap

@@ -10,11 +10,15 @@ exports[`TotalsFooterItem Does not show the "including %s of tax" line if tax is
     >
       Total
     </span>
-    <span
+    <div
-      class="wc-block-formatted-money-amount wc-block-components-formatted-money-amount wc-block-components-totals-item__value"
+      class="wc-block-components-totals-item__value"
     >
-      £85.00
+      <span
-    </span>
+        class="wc-block-formatted-money-amount wc-block-components-formatted-money-amount wc-block-components-totals-footer-item-tax-value"
+      >
+        £85.00
+      </span>
+    </div>
     <div
       class="wc-block-components-totals-item__description"
     />
@@ -32,11 +36,15 @@ exports[`TotalsFooterItem Does not show the "including %s of tax" line if tax is
     >
       Total
     </span>
-    <span
+    <div
-      class="wc-block-formatted-money-amount wc-block-components-formatted-money-amount wc-block-components-totals-item__value"
+      class="wc-block-components-totals-item__value"
     >
-      £85.00
+      <span
-    </span>
+        class="wc-block-formatted-money-amount wc-block-components-formatted-money-amount wc-block-components-totals-footer-item-tax-value"
+      >
+        £85.00
+      </span>
+    </div>
     <div
       class="wc-block-components-totals-item__description"
     />
@@ -54,11 +62,15 @@ exports[`TotalsFooterItem Shows the "including %s TAX LABEL" line with single ta
     >
       Total
     </span>
-    <span
+    <div
-      class="wc-block-formatted-money-amount wc-block-components-formatted-money-amount wc-block-components-totals-item__value"
+      class="wc-block-components-totals-item__value"
     >
-      £85.00
+      <span
-    </span>
+        class="wc-block-formatted-money-amount wc-block-components-formatted-money-amount wc-block-components-totals-footer-item-tax-value"
+      >
+        £85.00
+      </span>
+    </div>
     <div
       class="wc-block-components-totals-item__description"
     >
@@ -82,11 +94,15 @@ exports[`TotalsFooterItem Shows the "including %s TAX LABELS" line with multiple
     >
       Total
     </span>
-    <span
+    <div
-      class="wc-block-formatted-money-amount wc-block-components-formatted-money-amount wc-block-components-totals-item__value"
+      class="wc-block-components-totals-item__value"
     >
-      £85.00
+      <span
-    </span>
+        class="wc-block-formatted-money-amount wc-block-components-formatted-money-amount wc-block-components-totals-footer-item-tax-value"
+      >
+        £85.00
+      </span>
+    </div>
     <div
       class="wc-block-components-totals-item__description"
     >
@@ -110,11 +126,15 @@ exports[`TotalsFooterItem Shows the "including %s of tax" line if tax is greater
     >
       Total
     </span>
-    <span
+    <div
-      class="wc-block-formatted-money-amount wc-block-components-formatted-money-amount wc-block-components-totals-item__value"
+      class="wc-block-components-totals-item__value"
     >
-      £85.00
+      <span
-    </span>
+        class="wc-block-formatted-money-amount wc-block-components-formatted-money-amount wc-block-components-totals-footer-item-tax-value"
+      >
+        £85.00
+      </span>
+    </div>
     <div
       class="wc-block-components-totals-item__description"
     >

plugins/woocommerce-blocks/packages/components/totals/item/index.tsx

@@ -26,7 +26,11 @@ const TotalsItemValue = ( {
 	currency,
 }: Partial< TotalsItemProps > ): ReactElement | null => {
 	if ( isValidElement( value ) ) {
-		return <>{ value }</>;
+		return (
+			<div className="wc-block-components-totals-item__value">
+				{ value }
+			</div>
+		);
 	}
 
 	return Number.isFinite( value ) ? (

plugins/woocommerce/changelog/45732-fix-45170-broken-CSS-styles

@@ -0,0 +1,4 @@
+Significance: minor
+Type: fix
+
+Fix broken CSS styles of the `totalValue` filter.