replace old props with variant prop (https://github.com/woocommerce/woocommerce-blocks/pull/11933)

Co-authored-by: Daniel Dudzic <daniel.dudzic@automattic.com>

plugins/woocommerce-blocks/assets/js/atomic/blocks/product-elements/shared/product-selector.tsx

@@ -45,7 +45,7 @@ export const ProductSelector = ( {
 							} }
 						/>
 						<Button
-							isSecondary
+							variant="secondary"
 							disabled={ ! productId }
 							onClick={ () => {
 								setIsEditing( false );

plugins/woocommerce-blocks/assets/js/atomic/blocks/product-elements/shared/with-product-selector.js

@@ -58,7 +58,7 @@ const withProductSelector = ( selectorArgs ) => ( OriginalComponent ) => {
 								} }
 							/>
 							<Button
-								isSecondary
+								variant="secondary"
 								disabled={ ! productId }
 								onClick={ () => {
 									setIsEditing( false );

plugins/woocommerce-blocks/assets/js/blocks/attribute-filter/edit.tsx

@@ -348,7 +348,7 @@ const Edit = ( {
 			</p>
 			<Button
 				className="wc-block-attribute-filter__add-attribute-button"
-				isSecondary
+				variant="secondary"
 				href={ getAdminLink(
 					'edit.php?post_type=product&page=product_attributes'
 				) }
@@ -360,7 +360,7 @@ const Edit = ( {
 			</Button>
 			<Button
 				className="wc-block-attribute-filter__read_more_button"
-				isTertiary
+				variant="tertiary"
 				href="https://docs.woocommerce.com/document/managing-product-taxonomies/"
 				target="_blank"
 			>
@@ -397,7 +397,7 @@ const Edit = ( {
 				</div>
 				<div className="wc-block-attribute-filter__selection">
 					{ renderAttributeControl( { isCompact: false } ) }
-					<Button isPrimary onClick={ onDone }>
+					<Button variant="primary" onClick={ onDone }>
 						{ __( 'Done', 'woo-gutenberg-products-block' ) }
 					</Button>
 				</div>

plugins/woocommerce-blocks/assets/js/blocks/checkout/inner-blocks/checkout-shipping-methods-block/no-shipping-placeholder/index.js

@@ -25,7 +25,7 @@ const NoShippingPlaceholder = () => {
 				) }
 			</span>
 			<Button
-				isSecondary
+				variant="secondary"
 				href={ `${ ADMIN_URL }admin.php?page=wc-settings&tab=shipping` }
 				target="_blank"
 				rel="noopener noreferrer"

plugins/woocommerce-blocks/assets/js/blocks/classic-template/index.tsx

@@ -103,7 +103,7 @@ const ConvertTemplate = ( { blockifyConfig, clientId, attributes } ) => {
 	return (
 		<div className="wp-block-woocommerce-classic-template__placeholder-migration-button-container">
 			<Button
-				isPrimary
+				variant="primary"
 				onClick={ () => {
 					onClickCallback( {
 						clientId,

plugins/woocommerce-blocks/assets/js/blocks/collection-filters/inner-blocks/attribute-filter/components/placeholder.tsx

@@ -34,7 +34,7 @@ export const NoAttributesPlaceholder = () => (
 		</p>
 		<Button
 			className="wc-block-attribute-filter__add-attribute-button"
-			isSecondary
+			variant="secondary"
 			href={ getAdminLink(
 				'edit.php?post_type=product&page=product_attributes'
 			) }
@@ -45,7 +45,7 @@ export const NoAttributesPlaceholder = () => (
 		</Button>
 		<Button
 			className="wc-block-attribute-filter__read_more_button"
-			isTertiary
+			variant="tertiary"
 			href="https://docs.woocommerce.com/document/managing-product-taxonomies/"
 			target="_blank"
 		>

plugins/woocommerce-blocks/assets/js/blocks/collection-filters/inner-blocks/attribute-filter/edit.tsx

@@ -156,7 +156,7 @@ const Edit = ( props: EditProps ) => {
 					}
 				/>
 				<Button
-					isPrimary
+					variant="primary"
 					onClick={ () => {
 						setIsEditing( false );
 						debouncedSpeak(

plugins/woocommerce-blocks/assets/js/blocks/featured-items/with-edit-mode.tsx

@@ -112,7 +112,7 @@ export const withEditMode =
 								} }
 							/>
 						) }
-						<Button isPrimary onClick={ onDone }>
+						<Button variant="primary" onClick={ onDone }>
 							{ __( 'Done', 'woo-gutenberg-products-block' ) }
 						</Button>
 					</div>

plugins/woocommerce-blocks/assets/js/blocks/handpicked-products/edit-mode.tsx

@@ -57,7 +57,7 @@ export const HandpickedProductsEditMode = (
 						setAttributes( { products: ids } );
 					} }
 				/>
-				<Button isPrimary onClick={ onDone }>
+				<Button variant="primary" onClick={ onDone }>
 					{ __( 'Done', 'woo-gutenberg-products-block' ) }
 				</Button>
 			</div>

plugins/woocommerce-blocks/assets/js/blocks/price-filter/edit.tsx

@@ -134,7 +134,7 @@ export default function ( {
 			</p>
 			<Button
 				className="wc-block-price-slider__add-product-button"
-				isSecondary
+				variant="secondary"
 				href={ getAdminLink( 'post-new.php?post_type=product' ) }
 				target="_top"
 			>
@@ -144,7 +144,7 @@ export default function ( {
 			</Button>
 			<Button
 				className="wc-block-price-slider__read_more_button"
-				isTertiary
+				variant="tertiary"
 				href="https://docs.woocommerce.com/document/managing-products/"
 				target="_blank"
 			>

plugins/woocommerce-blocks/assets/js/blocks/product-category/edit-mode.tsx

@@ -88,12 +88,12 @@ export const ProductsByCategoryEditMode = (
 						setChangedAttributes( { catOperator: value } )
 					}
 				/>
-				<Button isPrimary onClick={ onDone }>
+				<Button variant="primary" onClick={ onDone }>
 					{ __( 'Done', 'woo-gutenberg-products-block' ) }
 				</Button>
 				<Button
 					className="wc-block-products-category__cancel-button"
-					isTertiary
+					variant="tertiary"
 					onClick={ onCancel }
 				>
 					{ __( 'Cancel', 'woo-gutenberg-products-block' ) }

plugins/woocommerce-blocks/assets/js/blocks/product-tag/block.tsx

@@ -219,12 +219,12 @@ const ProductsByTagBlock = ( {
 							} )
 						}
 					/>
-					<Button isPrimary onClick={ onDone }>
+					<Button variant="primary" onClick={ onDone }>
 						{ __( 'Done', 'woo-gutenberg-products-block' ) }
 					</Button>
 					<Button
 						className="wc-block-product-tag__cancel-button"
-						isTertiary
+						variant="tertiary"
 						onClick={ onCancel }
 					>
 						{ __( 'Cancel', 'woo-gutenberg-products-block' ) }

plugins/woocommerce-blocks/assets/js/blocks/products-by-attribute/edit-mode.tsx

@@ -67,7 +67,7 @@ export const ProductsByAttributeEditMode = (
 						setAttributes( { attrOperator: value } )
 					}
 				/>
-				<Button isPrimary onClick={ onDone }>
+				<Button variant="primary" onClick={ onDone }>
 					{ __( 'Done', 'woo-gutenberg-products-block' ) }
 				</Button>
 			</div>

plugins/woocommerce-blocks/assets/js/blocks/products/all-products/edit.js

@@ -231,14 +231,14 @@ class Editor extends Component {
 					<div className="wc-block-all-products__actions">
 						<Button
 							className="wc-block-all-products__done-button"
-							isPrimary
+							variant="primary"
 							onClick={ onDone }
 						>
 							{ __( 'Done', 'woo-gutenberg-products-block' ) }
 						</Button>
 						<Button
 							className="wc-block-all-products__cancel-button"
-							isTertiary
+							variant="tertiary"
 							onClick={ onCancel }
 						>
 							{ __( 'Cancel', 'woo-gutenberg-products-block' ) }

plugins/woocommerce-blocks/assets/js/blocks/products/edit-utils.js

@@ -20,7 +20,7 @@ export const renderNoProductsPlaceholder = ( blockTitle, blockIcon ) => (
 		</p>
 		<Button
 			className="wc-block-products__add-product-button"
-			isSecondary
+			variant="secondary"
 			href={ ADMIN_URL + 'post-new.php?post_type=product' }
 			target="_top"
 		>
@@ -29,7 +29,7 @@ export const renderNoProductsPlaceholder = ( blockTitle, blockIcon ) => (
 		</Button>
 		<Button
 			className="wc-block-products__read_more_button"
-			isTertiary
+			variant="tertiary"
 			href="https://docs.woocommerce.com/document/managing-products/"
 			target="_blank"
 		>

plugins/woocommerce-blocks/assets/js/blocks/reviews/reviews-by-category/block.tsx

@@ -127,7 +127,7 @@ const ReviewsByCategoryEditor = ( {
 						} }
 						showReviewCount={ true }
 					/>
-					<Button isPrimary onClick={ onDone }>
+					<Button variant="primary" onClick={ onDone }>
 						{ __( 'Done', 'woo-gutenberg-products-block' ) }
 					</Button>
 				</div>

plugins/woocommerce-blocks/assets/js/blocks/reviews/reviews-by-product/edit.tsx

@@ -146,7 +146,7 @@ const ReviewsByProductEditor = ( {
 						} }
 						renderItem={ renderProductControlItem }
 					/>
-					<Button isPrimary onClick={ onDone }>
+					<Button variant="primary" onClick={ onDone }>
 						{ __( 'Done', 'woo-gutenberg-products-block' ) }
 					</Button>
 				</div>

plugins/woocommerce-blocks/assets/js/blocks/single-product/edit/index.tsx

@@ -115,7 +115,7 @@ const Editor = ( {
 								setAttributes={ setAttributes }
 							/>
 							<Button
-								isSecondary
+								variant="secondary"
 								onClick={ () => {
 									setIsEditing( false );
 								} }

plugins/woocommerce-blocks/assets/js/blocks/single-product/edit/layout-editor.tsx

@@ -69,7 +69,7 @@ const LayoutEditor = ( {
 								'woo-gutenberg-products-block'
 							) }
 							onClick={ resetInnerBlocks }
-							isTertiary
+							variant="tertiary"
 							className="wc-block-editor-single-product__reset-layout"
 							icon={ backup }
 						>

plugins/woocommerce-blocks/assets/js/editor-components/error-placeholder/index.tsx

@@ -63,7 +63,7 @@ const ErrorPlaceholder = ( {
 				{ isLoading ? (
 					<Spinner />
 				) : (
-					<Button isSecondary onClick={ onRetry }>
+					<Button variant="secondary" onClick={ onRetry }>
 						{ __( 'Retry', 'woo-gutenberg-products-block' ) }
 					</Button>
 				) }

plugins/woocommerce-blocks/assets/js/editor-components/search-list-control/search-list-control.tsx

@@ -122,7 +122,7 @@ const SelectedListItems = < T extends object = object >( {
 				<strong>{ messages.selected( selectedCount ) }</strong>
 				{ selectedCount > 0 ? (
 					<Button
-						isLink
+						variant="link"
 						isDestructive
 						onClick={ () => onChange( [] ) }
 						aria-label={ messages.clear }