diff --git a/js/src/dashboard/index.js b/js/src/dashboard/index.js
index 892cab4469..969b341982 100644
--- a/js/src/dashboard/index.js
+++ b/js/src/dashboard/index.js
@@ -1,7 +1,6 @@
/**
* External dependencies
*/
-import { Button } from '@wordpress/components';
import { useState, useCallback } from '@wordpress/element';
import { __ } from '@wordpress/i18n';
import { Link } from '@woocommerce/components';
@@ -11,6 +10,7 @@ import { recordEvent } from '@woocommerce/tracks';
/**
* Internal dependencies
*/
+import AppButton from '.~/components/app-button';
import DifferentCurrencyNotice from '.~/components/different-currency-notice';
import CampaignConversionDashboardNotice from '.~/components/campaign-conversion-notice';
import NavigationClassic from '.~/components/navigation-classic';
@@ -73,9 +73,9 @@ const Dashboard = () => {
const ReportsLink = () => {
return (
-
+
);
};
diff --git a/js/src/external-components/woocommerce/compare-filter/index.js b/js/src/external-components/woocommerce/compare-filter/index.js
index 385648bca5..1a1fa6fa4e 100644
--- a/js/src/external-components/woocommerce/compare-filter/index.js
+++ b/js/src/external-components/woocommerce/compare-filter/index.js
@@ -9,13 +9,8 @@
*/
import { __ } from '@wordpress/i18n';
import { Component } from '@wordpress/element';
-import {
- Button,
- Card,
- CardBody,
- CardFooter,
- CardHeader,
-} from '@wordpress/components';
+import { Card, CardBody, CardFooter, CardHeader } from '@wordpress/components';
+import { Button } from 'extracted/@wordpress/components';
import { isEqual, isFunction } from 'lodash';
import PropTypes from 'prop-types';
import { getIdsFromQuery, updateQueryString } from '@woocommerce/navigation';
diff --git a/js/src/external-components/woocommerce/filter-picker/index.js b/js/src/external-components/woocommerce/filter-picker/index.js
index 723eb90146..a43723b362 100644
--- a/js/src/external-components/woocommerce/filter-picker/index.js
+++ b/js/src/external-components/woocommerce/filter-picker/index.js
@@ -8,7 +8,8 @@
* External dependencies
*/
import { __ } from '@wordpress/i18n';
-import { Button, Dropdown } from '@wordpress/components';
+import { Dropdown } from '@wordpress/components';
+import { Button } from 'extracted/@wordpress/components';
import { focus } from '@wordpress/dom';
import classnames from 'classnames';
import { Component } from '@wordpress/element';
diff --git a/js/src/external-components/wordpress/guide/finish-button.js b/js/src/external-components/wordpress/guide/finish-button.js
index d2dc41f448..05c0dabf30 100644
--- a/js/src/external-components/wordpress/guide/finish-button.js
+++ b/js/src/external-components/wordpress/guide/finish-button.js
@@ -9,7 +9,7 @@
* External dependencies
*/
import { useRef, useLayoutEffect } from '@wordpress/element';
-import { Button } from '@wordpress/components';
+import { Button } from 'extracted/@wordpress/components';
export default function FinishButton( props ) {
const ref = useRef();
diff --git a/js/src/external-components/wordpress/guide/index.js b/js/src/external-components/wordpress/guide/index.js
index 7bdc75771c..ca428d7661 100644
--- a/js/src/external-components/wordpress/guide/index.js
+++ b/js/src/external-components/wordpress/guide/index.js
@@ -11,7 +11,8 @@
import classnames from 'classnames';
import { useState } from '@wordpress/element';
import { __ } from '@wordpress/i18n';
-import { Modal, KeyboardShortcuts, Button } from '@wordpress/components';
+import { Modal, KeyboardShortcuts } from '@wordpress/components';
+import { Button } from 'extracted/@wordpress/components';
/**
* Internal dependencies
diff --git a/js/src/external-components/wordpress/guide/page-control.js b/js/src/external-components/wordpress/guide/page-control.js
index af52611431..26cc9f0d29 100644
--- a/js/src/external-components/wordpress/guide/page-control.js
+++ b/js/src/external-components/wordpress/guide/page-control.js
@@ -10,7 +10,7 @@
*/
import { times } from 'lodash';
import { __, sprintf } from '@wordpress/i18n';
-import { Button } from '@wordpress/components';
+import { Button } from 'extracted/@wordpress/components';
/**
* Internal dependencies
diff --git a/js/src/product-feed/product-feed-table-card/edit-visibility-action.js b/js/src/product-feed/product-feed-table-card/edit-visibility-action.js
index 84ef1a4204..9681d44f29 100644
--- a/js/src/product-feed/product-feed-table-card/edit-visibility-action.js
+++ b/js/src/product-feed/product-feed-table-card/edit-visibility-action.js
@@ -3,13 +3,14 @@
*/
import { __, sprintf } from '@wordpress/i18n';
import { useState, useEffect } from '@wordpress/element';
-import { Button, Icon } from '@wordpress/components';
+import { Icon } from '@wordpress/components';
import { SelectControl } from '@woocommerce/components';
import { edit as editIcon } from '@wordpress/icons';
/**
* Internal dependencies
*/
+import AppButton from '.~/components/app-button';
import AppTooltip from '.~/components/app-tooltip';
const tipText = __( 'Select channel visibility', 'google-listings-and-ads' );
@@ -90,7 +91,7 @@ export default function EditVisibilityAction( {
position="top center"
text={ tipText }
>
-
+
}
isLoading={ isLoading }
headers={ getHeaders( data ) }
diff --git a/js/src/settings/disconnect-modal/confirm-modal.js b/js/src/settings/disconnect-modal/confirm-modal.js
index 3d1b8181c3..a6c4dd4480 100644
--- a/js/src/settings/disconnect-modal/confirm-modal.js
+++ b/js/src/settings/disconnect-modal/confirm-modal.js
@@ -2,7 +2,7 @@
* External dependencies
*/
import { __ } from '@wordpress/i18n';
-import { Button, CheckboxControl } from '@wordpress/components';
+import { CheckboxControl } from '@wordpress/components';
import { useState } from '@wordpress/element';
/**
@@ -116,14 +116,14 @@ export default function ConfirmModal( {
}
isDismissible={ ! isDisconnecting }
buttons={ [
-
{ __( 'Never mind', 'google-listings-and-ads' ) }
- ,
+ ,
-
+
) }
-
+
) }
diff --git a/js/src/setup-ads/ads-stepper/setup-accounts/index.js b/js/src/setup-ads/ads-stepper/setup-accounts/index.js
index 7fd935c739..09ad6cbea9 100644
--- a/js/src/setup-ads/ads-stepper/setup-accounts/index.js
+++ b/js/src/setup-ads/ads-stepper/setup-accounts/index.js
@@ -1,12 +1,12 @@
/**
* External dependencies
*/
-import { Button } from '@wordpress/components';
import { __ } from '@wordpress/i18n';
/**
* Internal dependencies
*/
+import AppButton from '.~/components/app-button';
import StepContent from '.~/components/stepper/step-content';
import StepContentHeader from '.~/components/stepper/step-content-header';
import StepContentFooter from '.~/components/stepper/step-content-footer';
@@ -65,13 +65,13 @@ const SetupAccounts = ( props ) => {
-
{ __( 'Continue', 'google-listings-and-ads' ) }
-
+
);
diff --git a/js/src/setup-mc/setup-stepper/setup-accounts/index.js b/js/src/setup-mc/setup-stepper/setup-accounts/index.js
index 4437415e1d..2d030d85db 100644
--- a/js/src/setup-mc/setup-stepper/setup-accounts/index.js
+++ b/js/src/setup-mc/setup-stepper/setup-accounts/index.js
@@ -1,7 +1,6 @@
/**
* External dependencies
*/
-import { Button } from '@wordpress/components';
import { __ } from '@wordpress/i18n';
import { createInterpolateElement } from '@wordpress/element';
@@ -11,6 +10,7 @@ import { createInterpolateElement } from '@wordpress/element';
import useJetpackAccount from '.~/hooks/useJetpackAccount';
import useGoogleAccount from '.~/hooks/useGoogleAccount';
import useGoogleMCAccount from '.~/hooks/useGoogleMCAccount';
+import AppButton from '.~/components/app-button';
import AppSpinner from '.~/components/app-spinner';
import StepContent from '.~/components/stepper/step-content';
import StepContentHeader from '.~/components/stepper/step-content-header';
@@ -142,13 +142,13 @@ const SetupAccounts = ( props ) => {
-
{ __( 'Continue', 'google-listings-and-ads' ) }
-
+
);