woocommerce · psealock · Jun 11, 2020 · Jun 11, 2020 · Jun 11, 2020
diff --git a/client/analytics/settings/historical-data/actions.js b/client/analytics/settings/historical-data/actions.js
@@ -57,7 +57,7 @@ function HistoricalDataActions( {
 						>
 							{ __( 'Start', 'woocommerce-admin' ) }
 						</Button>
-						<Button isDefault onClick={ onDeletePreviousData }>
+						<Button isSecondary onClick={ onDeletePreviousData }>
 							{ __(
 								'Delete Previously Imported Data',
 								'woocommerce-admin'
@@ -83,10 +83,10 @@ function HistoricalDataActions( {
 		// Has imported all possible data
 		return (
 			<Fragment>
-				<Button isDefault onClick={ onReimportData }>
+				<Button isSecondary onClick={ onReimportData }>
 					{ __( 'Re-import Data', 'woocommerce-admin' ) }
 				</Button>
-				<Button isDefault onClick={ onDeletePreviousData }>
+				<Button isSecondary onClick={ onDeletePreviousData }>
 					{ __(
 						'Delete Previously Imported Data',
 						'woocommerce-admin'

diff --git a/client/analytics/settings/index.js b/client/analytics/settings/index.js
@@ -149,7 +149,7 @@ const Settings = ( { createNotice, query } ) => {
 					/>
 				) ) }
 				<div className="woocommerce-settings__actions">
-					<Button isDefault onClick={ resetDefaults }>
+					<Button isSecondary onClick={ resetDefaults }>
 						{ __( 'Reset Defaults', 'woocommerce-admin' ) }
 					</Button>
 					<Button

diff --git a/client/analytics/settings/setting.js b/client/analytics/settings/setting.js
@@ -59,7 +59,7 @@ class Setting extends Component {
 			case 'button':
 				return (
 					<Button
-						isDefault
+						isSecondary
 						onClick={ this.handleInputCallback }
 						disabled={ disabled }
 					>

diff --git a/client/dashboard/components/cart-modal.js b/client/dashboard/components/cart-modal.js
@@ -156,7 +156,6 @@ class CartModal extends Component {
 
 					<Button
 						isPrimary
-						isDefault
 						isBusy={ purchaseNowButtonBusy }
 						onClick={ () => this.onClickPurchaseNow() }
 					>

diff --git a/client/header/activity-panel/activity-card/test/__snapshots__/index.js.snap b/client/header/activity-panel/activity-card/test/__snapshots__/index.js.snap
@@ -156,7 +156,7 @@ exports[`ActivityCard should render an action on a card 1`] = `
     className="woocommerce-activity-card__actions"
   >
     <ForwardRef(Button)
-      isDefault={true}
+      isSecondary={true}
       key="0"
       onClick={[Function]}
     >
@@ -237,7 +237,7 @@ exports[`ActivityCard should render multiple actions on a card 1`] = `
       Action 1
     </ForwardRef(Button)>
     <ForwardRef(Button)
-      isDefault={true}
+      isSecondary={true}
       key="1"
       onClick={[Function]}
     >

diff --git a/client/header/activity-panel/activity-card/test/index.js b/client/header/activity-panel/activity-card/test/index.js
@@ -83,7 +83,7 @@ describe( 'ActivityCard', () => {
 			<ActivityCard
 				title="Inbox message"
 				actions={
-					<Button isDefault onClick={ noop }>
+					<Button isSecondary onClick={ noop }>
 						Action
 					</Button>
 				}
@@ -103,7 +103,7 @@ describe( 'ActivityCard', () => {
 					<Button key="action1" isPrimary onClick={ noop }>
 						Action 1
 					</Button>,
-					<Button key="action2" isDefault onClick={ noop }>
+					<Button key="action2" isSecondary onClick={ noop }>
 						Action 2
 					</Button>,
 				] }

diff --git a/client/header/activity-panel/panels/inbox/action.js b/client/header/activity-panel/panels/inbox/action.js
@@ -60,10 +60,11 @@ class InboxNoteAction extends Component {
 
 	render() {
 		const { action, dismiss, label } = this.props;
+		const isPrimary = dismiss || action.primary;
 		return (
 			<Button
-				isDefault
-				isPrimary={ dismiss || action.primary }
+				isPrimary={ isPrimary }
+				isSecondary={ ! isPrimary }
 				isBusy={ this.state.inAction }
 				disabled={ this.state.inAction }
 				href={ action ? action.url : undefined }

diff --git a/client/header/activity-panel/panels/inbox/card.js b/client/header/activity-panel/panels/inbox/card.js
@@ -233,7 +233,7 @@ class InboxNoteCard extends Component {
 					</p>
 					<div className="woocommerce-inbox-dismiss-confirmation_buttons">
 						<Button
-							isDefault
+							isSecondary
 							onClick={ () => this.closeDismissModal() }
 						>
 							{ __( 'Cancel', 'woocommerce-admin' ) }

diff --git a/client/header/activity-panel/panels/orders.js b/client/header/activity-panel/panels/orders.js
@@ -67,7 +67,7 @@ class OrdersPanel extends Component {
 				actions={
 					<Button
 						href="https://docs.woocommerce.com/document/managing-orders/"
-						isDefault
+						isSecondary
 						target="_blank"
 					>
 						{ __( 'Learn more', 'woocommerce-admin' ) }
@@ -200,7 +200,7 @@ class OrdersPanel extends Component {
 					}
 					actions={
 						<Button
-							isDefault
+							isSecondary
 							href={ getAdminLink(
 								'post.php?action=edit&post=' + order.order_id
 							) }

diff --git a/client/header/activity-panel/panels/reviews.js b/client/header/activity-panel/panels/reviews.js
@@ -111,7 +111,7 @@ class ReviewsPanel extends Component {
 
 		const cardActions = (
 			<Button
-				isDefault
+				isSecondary
 				onClick={ () =>
 					recordEvent( 'review_manage_click', manageReviewEvent )
 				}
@@ -231,7 +231,7 @@ class ReviewsPanel extends Component {
 					<Button
 						href={ buttonUrl }
 						target={ buttonTarget }
-						isDefault
+						isSecondary
 					>
 						{ buttonText }
 					</Button>

diff --git a/client/header/activity-panel/panels/stock/card.js b/client/header/activity-panel/panels/stock/card.js
@@ -96,7 +96,7 @@ class ProductStockCard extends Component {
 		}
 
 		return [
-			<Button key="update" isDefault onClick={ this.beginEdit }>
+			<Button key="update" isSecondary onClick={ this.beginEdit }>
 				{ __( 'Update stock', 'woocommerce-admin' ) }
 			</Button>,
 		];

diff --git a/client/homepage/stats-overview/style.scss b/client/homepage/stats-overview/style.scss
@@ -75,17 +75,8 @@ article.woocommerce-stats-overview__install-jetpack-promo {
 	footer {
 		border-top: 1px solid $promo-actions-border;
 
-		// All of this added specificity is required because styles that
-		// need overriding are already specified at a high level.
-		.woocommerce-layout & button.components-button,
-		.woocommerce-layout & button.components-button.is-button {
-			padding: 8px 16px;
+		.components-button {
 			margin: 16px 4px;
-			height: inherit;
-			color: $theme-color;
-			cursor: pointer;
-			line-height: 2;
-			border-radius: 3px;
 
 			&.is-busy {
 				background-image: linear-gradient(-45deg, lighten($theme-color, 40%) 28%, #fff 0, #fff 72%, lighten($theme-color, 40%) 0);

diff --git a/client/layout/store-alerts/index.js b/client/layout/store-alerts/index.js
@@ -71,7 +71,7 @@ class StoreAlerts extends Component {
 				<Button
 					key={ action.name }
 					isPrimary={ action.primary }
-					isDefault={ ! action.primary }
+					isSecondary={ ! action.primary }
 					href={ action.url || undefined }
 					onClick={ () => triggerNoteAction( alert.id, action.id ) }
 				>

diff --git a/client/marketing/components/button/README.md b/client/marketing/components/button/README.md
@@ -7,7 +7,7 @@ This component creates simple reusable html `<button></button>` element.
 
 ```jsx
 <Button
-	isDefault
+	isSecondary
 	onClick={ this.onActivateClick }
 	disabled={ isLoading }
 >

diff --git a/client/marketing/overview/installed-extensions/row.js b/client/marketing/overview/installed-extensions/row.js
@@ -17,7 +17,6 @@ import { Button, ProductIcon } from '../../components';
 import { recordEvent } from 'lib/tracks';
 
 class InstalledExtensionRow extends Component {
-
 	constructor( props ) {
 		super( props );
 
@@ -71,10 +70,10 @@ class InstalledExtensionRow extends Component {
 								{ link.text }
 							</Link>
 						</li>
-					)
+					);
 				} ) }
 			</ul>
-		)
+		);
 	}
 
 	onLinkClick( link ) {
@@ -98,25 +97,25 @@ class InstalledExtensionRow extends Component {
 
 		return (
 			<Button
-				isDefault
+				isSecondary
 				onClick={ this.onActivateClick }
 				disabled={ isLoading }
 			>
 				{ __( 'Activate', 'woocommerce-admin' ) }
 			</Button>
-		)
+		);
 	}
 
 	getFinishSetupButton() {
 		return (
 			<Button
-				isDefault
+				isSecondary
 				href={ this.props.settingsUrl }
 				onClick={ this.onFinishSetupClick }
 			>
 				{ __( 'Finish setup', 'woocommerce-admin' ) }
 			</Button>
-		)
+		);
 	}
 
 	render() {
@@ -142,15 +141,17 @@ class InstalledExtensionRow extends Component {
 					<div className="woocommerce-marketing-installed-extensions-card__item-text">
 						<h4>{ name }</h4>
 						{ status === 'configured' || (
-							<p className="woocommerce-marketing-installed-extensions-card__item-description">{ description }</p>
+							<p className="woocommerce-marketing-installed-extensions-card__item-description">
+								{ description }
+							</p>
 						) }
 					</div>
 					<div className="woocommerce-marketing-installed-extensions-card__item-actions">
 						{ actions }
 					</div>
 				</div>
 			</div>
-		)
+		);
 	}
 }
 

diff --git a/client/profile-wizard/steps/benefits/index.js b/client/profile-wizard/steps/benefits/index.js
@@ -17,7 +17,7 @@ import {
 	pluginNames,
 	ONBOARDING_STORE_NAME,
 	PLUGINS_STORE_NAME,
-	OPTIONS_STORE_NAME
+	OPTIONS_STORE_NAME,
 } from '@woocommerce/data';
 
 /**
@@ -232,7 +232,7 @@ class Benefits extends Component {
 						{ __( 'Yes please!', 'woocommerce-admin' ) }
 					</Button>
 					<Button
-						isDefault
+						isSecondary
 						isBusy={
 							this.isPending() && ! isInstalling && ! isConnecting
 						}

diff --git a/client/profile-wizard/steps/theme/index.js b/client/profile-wizard/steps/theme/index.js
@@ -241,7 +241,7 @@ class Theme extends Component {
 							</Button>
 						) : (
 							<Button
-								isDefault
+								isSecondary
 								onClick={ () => this.onChoose( theme, 'card' ) }
 								isBusy={ chosen === slug }
 							>

diff --git a/client/profile-wizard/steps/usage-modal.js b/client/profile-wizard/steps/usage-modal.js
@@ -147,7 +147,6 @@ class UsageModal extends Component {
 					</div>
 					<Button
 						isPrimary
-						isDefault
 						isBusy={ isRequesting }
 						onClick={ () => this.updateTracking() }
 					>

diff --git a/client/task-list/index.js b/client/task-list/index.js
@@ -288,7 +288,6 @@ class TaskDashboard extends Component {
 					</div>
 					<Button
 						isPrimary
-						isDefault
 						onClick={ () => this.closeWelcomeModal() }
 					>
 						{ __( 'Continue', 'woocommerce-admin' ) }

diff --git a/client/task-list/tasks/payments/index.js b/client/task-list/tasks/payments/index.js
@@ -298,7 +298,9 @@ class Payments extends Component {
 								{ container && ! isConfigured ? (
 									<Button
 										isPrimary={ key === recommendedMethod }
-										isDefault={ key !== recommendedMethod }
+										isSecondary={
+											key !== recommendedMethod
+										}
 										onClick={ () => {
 											recordEvent(
 												'tasklist_payment_setup',

diff --git a/client/task-list/tasks/payments/klarna.js b/client/task-list/tasks/payments/klarna.js
@@ -71,7 +71,7 @@ class Klarna extends Component {
 		return (
 			<Fragment>
 				<p>{ configureText }</p>
-				<Button isPrimary isDefault onClick={ this.continue }>
+				<Button isPrimary onClick={ this.continue }>
 					{ __( 'Continue', 'woocommerce-admin' ) }
 				</Button>
 			</Fragment>

diff --git a/client/task-list/tasks/payments/paypal.js b/client/task-list/tasks/payments/paypal.js
@@ -109,7 +109,7 @@ class PayPal extends Component {
 	renderConnectButton() {
 		const { connectURL } = this.state;
 		return (
-			<Button isPrimary isDefault href={ connectURL }>
+			<Button isPrimary href={ connectURL }>
 				{ __( 'Connect', 'woocommerce-admin' ) }
 			</Button>
 		);

diff --git a/client/task-list/tasks/payments/square.js b/client/task-list/tasks/payments/square.js
@@ -128,7 +128,6 @@ class Square extends Component {
 							<Fragment>
 								<Button
 									isPrimary
-									isDefault
 									isBusy={ isPending }
 									onClick={ this.connect }
 								>

diff --git a/client/task-list/tasks/payments/stripe.js b/client/task-list/tasks/payments/stripe.js
@@ -127,7 +127,7 @@ class Stripe extends Component {
 	renderConnectButton() {
 		const { connectURL } = this.state;
 		return (
-			<Button isPrimary isDefault href={ connectURL }>
+			<Button isPrimary href={ connectURL }>
 				{ __( 'Connect', 'woocommerce-admin' ) }
 			</Button>
 		);

diff --git a/client/task-list/tasks/payments/wcpay.js b/client/task-list/tasks/payments/wcpay.js
@@ -95,7 +95,6 @@ class WCPay extends Component {
 						content: (
 							<Button
 								isPrimary
-								isDefault
 								isBusy={ isPending }
 								onClick={ this.connect }
 							>

diff --git a/client/wp-admin-scripts/print-shipping-label-banner/dismiss-modal/index.js b/client/wp-admin-scripts/print-shipping-label-banner/dismiss-modal/index.js
@@ -66,7 +66,7 @@ export class DismissModal extends Component {
 					) }
 				</p>
 				<div className="wc-admin-shipping-banner__dismiss-modal-actions">
-					<Button isDefault onClick={ this.remindMeLaterClicked }>
+					<Button isSecondary onClick={ this.remindMeLaterClicked }>
 						{ __( 'Remind me later', 'woocommerce-admin' ) }
 					</Button>
 					<Button isPrimary onClick={ this.closeForeverClicked }>

diff --git a/packages/components/src/date-range-filter-picker/content.js b/packages/components/src/date-range-filter-picker/content.js
@@ -138,7 +138,7 @@ class DatePickerContent extends Component {
 										{ selected.name === 'custom' && (
 											<Button
 												className="woocommerce-filters-date__button"
-												isDefault
+												isSecondary
 												onClick={ resetCustomValues }
 												disabled={
 													! ( after || before )