diff --git a/.externalized.json b/.externalized.json
index e632780dc7..c1b7cae992 100644
--- a/.externalized.json
+++ b/.externalized.json
@@ -1 +1 @@
-["@woocommerce/components","@woocommerce/customer-effort-score","@woocommerce/data","@woocommerce/navigation","@woocommerce/settings","@wordpress/a11y","@wordpress/api-fetch","@wordpress/data","@wordpress/data-controls","@wordpress/date","@wordpress/deprecated","@wordpress/dom","@wordpress/element","@wordpress/escape-html","@wordpress/hooks","@wordpress/html-entities","@wordpress/i18n","@wordpress/is-shallow-equal","@wordpress/keycodes","@wordpress/primitives","@wordpress/priority-queue","@wordpress/rich-text","@wordpress/url","@wordpress/warning","extracted/@wordpress/components","lodash","moment","react","react-dom"]
\ No newline at end of file
+["@woocommerce/components","@woocommerce/customer-effort-score","@woocommerce/data","@woocommerce/navigation","@woocommerce/settings","@wordpress/api-fetch","@wordpress/data","@wordpress/data-controls","@wordpress/date","@wordpress/deprecated","@wordpress/dom","@wordpress/element","@wordpress/hooks","@wordpress/html-entities","@wordpress/i18n","@wordpress/is-shallow-equal","@wordpress/keycodes","@wordpress/primitives","@wordpress/priority-queue","@wordpress/url","extracted/@wordpress/components","lodash","moment","react","react-dom"]
\ No newline at end of file
diff --git a/js/src/components/app-input-control/index.js b/js/src/components/app-input-control/index.js
index 4cf4b0a9a1..6d3b69f17c 100644
--- a/js/src/components/app-input-control/index.js
+++ b/js/src/components/app-input-control/index.js
@@ -4,7 +4,7 @@
 import classnames from 'classnames';
 import { __, sprintf } from '@wordpress/i18n';
 import { forwardRef } from '@wordpress/element';
-import { __experimentalInputControl as InputControl } from '@wordpress/components';
+import { __experimentalInputControl as InputControl } from 'extracted/@wordpress/components';
 
 /**
  * Internal dependencies
diff --git a/js/src/components/app-radio-content-control/index.js b/js/src/components/app-radio-content-control/index.js
index 829d01c92d..b0f5e763da 100644
--- a/js/src/components/app-radio-content-control/index.js
+++ b/js/src/components/app-radio-content-control/index.js
@@ -2,7 +2,7 @@
  * External dependencies
  */
 import classnames from 'classnames';
-import { RadioControl } from '@wordpress/components';
+import { RadioControl } from 'extracted/@wordpress/components';
 
 /**
  * Internal dependencies
diff --git a/js/src/components/app-radio-content-control/index.scss b/js/src/components/app-radio-content-control/index.scss
index c611fa6025..3f016e69cd 100644
--- a/js/src/components/app-radio-content-control/index.scss
+++ b/js/src/components/app-radio-content-control/index.scss
@@ -10,6 +10,7 @@
 	// by placing them on the same brid.
 	.components-radio-control,
 	.components-base-control__field,
+	.components-base-control__field .components-flex,
 	.components-radio-control__option {
 		display: contents;
 	}
diff --git a/js/src/components/app-select-control/index.js b/js/src/components/app-select-control/index.js
index a0233d4905..5db4748de9 100644
--- a/js/src/components/app-select-control/index.js
+++ b/js/src/components/app-select-control/index.js
@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { SelectControl } from '@wordpress/components';
+import { SelectControl } from 'extracted/@wordpress/components';
 import classNames from 'classnames';
 
 /**
diff --git a/js/src/components/app-standalone-toggle-control/index.js b/js/src/components/app-standalone-toggle-control/index.js
index 75ecd2a8c7..debeee575d 100644
--- a/js/src/components/app-standalone-toggle-control/index.js
+++ b/js/src/components/app-standalone-toggle-control/index.js
@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { ToggleControl } from '@wordpress/components';
+import { ToggleControl } from 'extracted/@wordpress/components';
 
 /**
  * Internal dependencies
diff --git a/js/src/components/app-standalone-toggle-control/index.scss b/js/src/components/app-standalone-toggle-control/index.scss
index 79aa17ecc2..4b2fe3e4f5 100644
--- a/js/src/components/app-standalone-toggle-control/index.scss
+++ b/js/src/components/app-standalone-toggle-control/index.scss
@@ -4,10 +4,12 @@
 	display: inline-block;
 
 	// remove the margins specified in ToggleControl component.
+	.components-base-control {
+		margin-bottom: 0;
+	}
+
 	.components-toggle-control {
 		.components-base-control__field {
-			margin-bottom: 0;
-
 			.components-form-toggle {
 				margin-right: 0;
 
diff --git a/js/src/components/contact-information/phone-number-card/edit-phone-number-content.js b/js/src/components/contact-information/phone-number-card/edit-phone-number-content.js
index 9f8733492b..2a2bc5e71f 100644
--- a/js/src/components/contact-information/phone-number-card/edit-phone-number-content.js
+++ b/js/src/components/contact-information/phone-number-card/edit-phone-number-content.js
@@ -4,8 +4,12 @@
 import { parsePhoneNumberFromString as parsePhoneNumber } from 'libphonenumber-js';
 import { __ } from '@wordpress/i18n';
 import { useState, useEffect } from '@wordpress/element';
-import { RadioControl } from '@wordpress/components';
-import { Flex, FlexItem, FlexBlock } from 'extracted/@wordpress/components';
+import {
+	Flex,
+	FlexItem,
+	FlexBlock,
+	RadioControl,
+} from 'extracted/@wordpress/components';
 
 /**
  * Internal dependencies
diff --git a/js/src/components/free-listings/choose-audience-section/choose-audience-section.js b/js/src/components/free-listings/choose-audience-section/choose-audience-section.js
index cd74fb6085..a302d44f1a 100644
--- a/js/src/components/free-listings/choose-audience-section/choose-audience-section.js
+++ b/js/src/components/free-listings/choose-audience-section/choose-audience-section.js
@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { RadioControl } from '@wordpress/components';
+import { RadioControl } from 'extracted/@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { createInterpolateElement } from '@wordpress/element';
 
diff --git a/js/src/components/google-ads-account-card/terms-modal/index.js b/js/src/components/google-ads-account-card/terms-modal/index.js
index f187d4f389..dd4692ffe2 100644
--- a/js/src/components/google-ads-account-card/terms-modal/index.js
+++ b/js/src/components/google-ads-account-card/terms-modal/index.js
@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { CheckboxControl } from '@wordpress/components';
+import { CheckboxControl } from 'extracted/@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { createInterpolateElement, useState } from '@wordpress/element';
 
diff --git a/js/src/components/google-mc-account-card/terms-modal/index.js b/js/src/components/google-mc-account-card/terms-modal/index.js
index c73b781bd9..9023672c27 100644
--- a/js/src/components/google-mc-account-card/terms-modal/index.js
+++ b/js/src/components/google-mc-account-card/terms-modal/index.js
@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { CheckboxControl } from '@wordpress/components';
+import { CheckboxControl } from 'extracted/@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { createInterpolateElement, useState } from '@wordpress/element';
 
diff --git a/js/src/components/paid-ads/asset-group/asset-group-card.js b/js/src/components/paid-ads/asset-group/asset-group-card.js
index 486e5667c0..4db479f87b 100644
--- a/js/src/components/paid-ads/asset-group/asset-group-card.js
+++ b/js/src/components/paid-ads/asset-group/asset-group-card.js
@@ -3,7 +3,7 @@
  */
 import { __ } from '@wordpress/i18n';
 import { useRef, useEffect, Fragment } from '@wordpress/element';
-import { SelectControl } from '@wordpress/components';
+import { SelectControl } from 'extracted/@wordpress/components';
 
 /**
  * Internal dependencies
diff --git a/js/src/components/paid-ads/audience-section.js b/js/src/components/paid-ads/audience-section.js
index f5ce860dc4..f24be8d216 100644
--- a/js/src/components/paid-ads/audience-section.js
+++ b/js/src/components/paid-ads/audience-section.js
@@ -2,7 +2,7 @@
  * External dependencies
  */
 import { __ } from '@wordpress/i18n';
-import { SelectControl } from '@wordpress/components';
+import { SelectControl } from 'extracted/@wordpress/components';
 
 /**
  * Internal dependencies
diff --git a/js/src/components/paid-ads/audience-section.scss b/js/src/components/paid-ads/audience-section.scss
index d32c842c4d..565a4bc70f 100644
--- a/js/src/components/paid-ads/audience-section.scss
+++ b/js/src/components/paid-ads/audience-section.scss
@@ -3,20 +3,10 @@
 	// Repeat selector to make it higher priority.
 	.components-input-control__container.components-input-control__container {
 		.components-select-control__input {
-			min-height: $gla-size-control-height;
 			padding-left: $grid-unit-20;
 		}
 	}
 
-	// Adjust labels of <SelectControl> imported from @wordpress/components.
-	// Repeat selector to make it higher priority.
-	.components-base-control .components-select-control {
-		.components-input-control__label {
-			padding-bottom: 0;
-			margin-bottom: $grid-unit-10;
-		}
-	}
-
 	// Adjust help text of <SelectControl> imported from @wordpress/components.
 	.components-base-control__help {
 		margin: 0;
diff --git a/js/src/components/pre-launch-check-item/index.js b/js/src/components/pre-launch-check-item/index.js
index e4fde4de0d..30d635737a 100644
--- a/js/src/components/pre-launch-check-item/index.js
+++ b/js/src/components/pre-launch-check-item/index.js
@@ -2,8 +2,12 @@
  * External dependencies
  */
 import { __ } from '@wordpress/i18n';
-import { CheckboxControl } from '@wordpress/components';
-import { Panel, PanelBody, PanelRow } from 'extracted/@wordpress/components';
+import {
+	Panel,
+	PanelBody,
+	PanelRow,
+	CheckboxControl,
+} from 'extracted/@wordpress/components';
 import { recordEvent } from '@woocommerce/tracks';
 import { useRef } from '@wordpress/element';
 
diff --git a/js/src/css/shared/_gutenberg-components.scss b/js/src/css/shared/_gutenberg-components.scss
index b2109d7908..b0c8285d1c 100644
--- a/js/src/css/shared/_gutenberg-components.scss
+++ b/js/src/css/shared/_gutenberg-components.scss
@@ -51,14 +51,9 @@
 			font-size: inherit;
 		}
 	}
-}
-
-// hack to fix radio button selected style bug caused by woocommerce-admin.
-.components-radio-control__input[type="radio"]:checked::before {
-	border: none;
-}
 
-// hack to fix InputControl suffix's empty right margin.
-.components-input-control__suffix {
-	margin-right: $grid-unit;
+	// Adjust InputControl suffix's empty right margin.
+	.components-input-control__suffix {
+		margin-right: $grid-unit;
+	}
 }
diff --git a/js/src/product-feed/product-feed-table-card/index.js b/js/src/product-feed/product-feed-table-card/index.js
index cff7bda694..e69667c3f3 100644
--- a/js/src/product-feed/product-feed-table-card/index.js
+++ b/js/src/product-feed/product-feed-table-card/index.js
@@ -3,8 +3,8 @@
  */
 import { __, _n, sprintf } from '@wordpress/i18n';
 import { useState } from '@wordpress/element';
-import { CheckboxControl } from '@wordpress/components';
 import {
+	CheckboxControl,
 	Card,
 	CardHeader,
 	CardBody,
diff --git a/js/src/product-feed/review-request/review-request-modal.js b/js/src/product-feed/review-request/review-request-modal.js
index c8bb7b0890..3818ca57cb 100644
--- a/js/src/product-feed/review-request/review-request-modal.js
+++ b/js/src/product-feed/review-request/review-request-modal.js
@@ -2,8 +2,7 @@
  * External dependencies
  */
 import { __ } from '@wordpress/i18n';
-import { CheckboxControl } from '@wordpress/components';
-import { Notice } from 'extracted/@wordpress/components';
+import { CheckboxControl, Notice } from 'extracted/@wordpress/components';
 import { createInterpolateElement, useState } from '@wordpress/element';
 import { recordEvent } from '@woocommerce/tracks';
 
diff --git a/js/src/reports/compare-table-card.js b/js/src/reports/compare-table-card.js
index d16381e5ea..dfd7b13484 100644
--- a/js/src/reports/compare-table-card.js
+++ b/js/src/reports/compare-table-card.js
@@ -3,7 +3,7 @@
  */
 import { __ } from '@wordpress/i18n';
 import { useState, useMemo } from '@wordpress/element';
-import { CheckboxControl } from '@wordpress/components';
+import { CheckboxControl } from 'extracted/@wordpress/components';
 import { onQueryChange } from '@woocommerce/navigation';
 
 /**
diff --git a/js/src/settings/disconnect-modal/confirm-modal.js b/js/src/settings/disconnect-modal/confirm-modal.js
index a6c4dd4480..599a063c8f 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 { CheckboxControl } from '@wordpress/components';
+import { CheckboxControl } from 'extracted/@wordpress/components';
 import { useState } from '@wordpress/element';
 
 /**