From 5522384312d8437f93e1e640b44aa827da1beb83 Mon Sep 17 00:00:00 2001
From: Jorge <jorge.costa@developer.pt>
Date: Thu, 27 Dec 2018 16:02:41 +0000
Subject: [PATCH] Fix: Add button styles to notice actions without url. Allow
 custom classes on notice actions.

---
 packages/components/src/notice/index.js       | 39 +++++++++++++------
 packages/components/src/notice/style.scss     |  3 ++
 .../notice/test/__snapshots__/index.js.snap   |  1 +
 3 files changed, 32 insertions(+), 11 deletions(-)

diff --git a/packages/components/src/notice/index.js b/packages/components/src/notice/index.js
index 90b2d908deee9..5aaa5ead7450d 100644
--- a/packages/components/src/notice/index.js
+++ b/packages/components/src/notice/index.js
@@ -36,17 +36,34 @@ function Notice( {
 		<div className={ classes }>
 			<div className="components-notice__content">
 				{ children }
-				{ actions.map( ( { label, url, onClick }, index ) => (
-					<Button
-						key={ index }
-						href={ url }
-						isLink={ !! url }
-						onClick={ onClick }
-						className="components-notice__action"
-					>
-						{ label }
-					</Button>
-				) ) }
+				{ actions.map(
+					(
+						{
+							className: buttonAdditionalClass,
+							label,
+							onClick,
+							url,
+						},
+						index
+					) => {
+						return (
+							<Button
+								key={ index }
+								href={ url }
+								isDefault={ ! url }
+								isLink={ !! url }
+								onClick={ url ? undefined : onClick }
+								className={ classnames(
+									'components-notice__action',
+									buttonAdditionalClass
+								) }
+							>
+								{ label }
+							</Button>
+						);
+					}
+
+				) }
 			</div>
 			{ isDismissible && (
 				<IconButton
diff --git a/packages/components/src/notice/style.scss b/packages/components/src/notice/style.scss
index b9f182374e2e4..69b9c4494a689 100644
--- a/packages/components/src/notice/style.scss
+++ b/packages/components/src/notice/style.scss
@@ -34,6 +34,9 @@
 	&.is-link {
 		margin-left: 4px;
 	}
+	&.is-default {
+		vertical-align: initial;
+	}
 }
 
 .components-notice__dismiss {
diff --git a/packages/components/src/notice/test/__snapshots__/index.js.snap b/packages/components/src/notice/test/__snapshots__/index.js.snap
index 7be3c43c0a1b5..28b35679ceec6 100644
--- a/packages/components/src/notice/test/__snapshots__/index.js.snap
+++ b/packages/components/src/notice/test/__snapshots__/index.js.snap
@@ -11,6 +11,7 @@ exports[`Notice should match snapshot 1`] = `
     <ForwardRef(Button)
       className="components-notice__action"
       href="https://example.com"
+      isDefault={false}
       isLink={true}
     >
       View