From 0d6253825f661e11bf95d646172f269b4697c605 Mon Sep 17 00:00:00 2001
From: Filip Siderov <filip.siderov@sap.com>
Date: Fri, 28 May 2021 15:21:34 +0300
Subject: [PATCH] fix(ui5-messagestrip): rename properties

---
 packages/main/src/MessageStrip.hbs            |  4 +-
 packages/main/src/MessageStrip.js             | 11 ++---
 packages/main/src/themes/MessageStrip.css     |  8 ++--
 packages/main/test/pages/MessageStrip.html    |  6 +--
 .../test/samples/MessageStrip.sample.html     | 44 +++++++++----------
 5 files changed, 37 insertions(+), 36 deletions(-)

diff --git a/packages/main/src/MessageStrip.hbs b/packages/main/src/MessageStrip.hbs
index c622fdaceb27..ea867da235f8 100644
--- a/packages/main/src/MessageStrip.hbs
+++ b/packages/main/src/MessageStrip.hbs
@@ -6,7 +6,7 @@
 	aria-labelledby="{{_id}}"
 >
 
-	{{#unless noIcon}}
+	{{#unless hideIcon}}
 		<div
 		class="ui5-messagestrip-icon-wrapper"
 		aria-hidden="true"
@@ -22,7 +22,7 @@
 	<span class="ui5-hidden-text">{{hiddenText}}</span>
 	<span class="ui5-messagestrip-text"><slot></slot></span>
 
-	{{#unless noCloseButton}}
+	{{#unless hideCloseButton}}
 		<ui5-button
 			icon="decline"
 			design="Transparent"
diff --git a/packages/main/src/MessageStrip.js b/packages/main/src/MessageStrip.js
index c0bee7b0a651..f00c494234e8 100644
--- a/packages/main/src/MessageStrip.js
+++ b/packages/main/src/MessageStrip.js
@@ -45,8 +45,9 @@ const metadata = {
 		 * @type {boolean}
 		 * @defaultvalue false
 		 * @public
+		 * @since 1.0.0-rc.15
 		 */
-		noIcon: {
+		hideIcon: {
 			type: Boolean,
 		},
 
@@ -57,7 +58,7 @@ const metadata = {
 		 * @defaultvalue false
 		 * @public
 		 */
-		noCloseButton: {
+		hideCloseButton: {
 			type: Boolean,
 		},
 	},
@@ -189,7 +190,7 @@ class MessageStrip extends UI5Element {
 	}
 
 	get hiddenText() {
-		return `Message Strip ${this.type} ${this.noCloseButton ? "" : "closable"}`;
+		return `Message Strip ${this.type} ${this.hideCloseButton ? "" : "closable"}`;
 	}
 
 	get _closeButtonText() {
@@ -200,8 +201,8 @@ class MessageStrip extends UI5Element {
 		return {
 			root: {
 				"ui5-messagestrip-root": true,
-				"ui5-messagestrip-root-no-icon": this.noIcon,
-				"ui5-messagestrip-root-no-close-button": this.noCloseButton,
+				"ui5-messagestrip-root-hide-icon": this.hideIcon,
+				"ui5-messagestrip-root-hide-close-button": this.hideCloseButton,
 				[this.typeClasses]: true,
 			},
 		};
diff --git a/packages/main/src/themes/MessageStrip.css b/packages/main/src/themes/MessageStrip.css
index aaa63256b436..82300492d2ff 100644
--- a/packages/main/src/themes/MessageStrip.css
+++ b/packages/main/src/themes/MessageStrip.css
@@ -18,11 +18,11 @@
 	position: relative;
 }
 
-.ui5-messagestrip-root-no-icon {
+.ui5-messagestrip-root-hide-icon {
 	padding: var(--_ui5_messagestrip_padding_no_icon);
 }
 
-.ui5-messagestrip-root-no-close-button {
+.ui5-messagestrip-root-hide-close-button {
 	padding-right: 1rem;
 }
 
@@ -107,12 +107,12 @@
 	padding-left: 2rem;
 }
 
-[dir="rtl"] .ui5-messagestrip-root-no-icon {
+[dir="rtl"] .ui5-messagestrip-root-hide-icon {
 	padding-right: 1rem;
 	padding-left: 2rem;
 }
 
-[dir="rtl"] .ui5-messagestrip-root-no-close-button {
+[dir="rtl"] .ui5-messagestrip-root-hide-close-button {
 	padding-left: 1rem;
 	padding-right: 0;
 }
diff --git a/packages/main/test/pages/MessageStrip.html b/packages/main/test/pages/MessageStrip.html
index 039c60113183..319485d0188d 100644
--- a/packages/main/test/pages/MessageStrip.html
+++ b/packages/main/test/pages/MessageStrip.html
@@ -40,9 +40,9 @@
 	<ui5-messagestrip class="top" type="Information">Information with default icon.</ui5-messagestrip>
 	<ui5-messagestrip class="top" type="Information">Ea mollit nulla laborum et fugiat nulla excepteur ea. Duis et dolor enim Lorem laboris adipisicing cillum quis proident dolor veniam voluptate. Nostrud dolore ipsum anim voluptate enim dolore eiusmod aliqua et. Est eu ex dolor ea ipsum. Adipisicing duis aliquip ullamco culpa dolore exercitation ullamco cillum irure.</ui5-messagestrip>
 
-	<ui5-messagestrip no-icon class="top" type="Information">Ea mollit nulla laborum et fugiat nulla excepteur ea. Duis et dolor enim Lorem laboris adipisicing cillum quis proident dolor veniam voluptate. Nostrud dolore ipsum anim voluptate enim dolore eiusmod aliqua et. Est eu ex dolor ea ipsum. Adipisicing duis aliquip ullamco culpa dolore exercitation ullamco cillum irure.</ui5-messagestrip>
-	<ui5-messagestrip no-icon no-close-button class="top" type="Information">Ea mollit nulla laborum et fugiat nulla excepteur ea. Duis et dolor enim Lorem laboris adipisicing cillum quis proident dolor veniam voluptate. Nostrud dolore ipsum anim voluptate enim dolore eiusmod aliqua et. Est eu ex dolor ea ipsum. Adipisicing duis aliquip ullamco culpa dolore exercitation ullamco cillum irure.</ui5-messagestrip>
-	<ui5-messagestrip no-close-button class="top" type="Information">Ea mollit nulla laborum et fugiat nulla excepteur ea. Duis et dolor enim Lorem laboris adipisicing cillum quis proident dolor veniam voluptate. Nostrud dolore ipsum anim voluptate enim dolore eiusmod aliqua et. Est eu ex dolor ea ipsum. Adipisicing duis aliquip ullamco culpa dolore exercitation ullamco cillum irure.</ui5-messagestrip>
+	<ui5-messagestrip hide-icon class="top" type="Information">Ea mollit nulla laborum et fugiat nulla excepteur ea. Duis et dolor enim Lorem laboris adipisicing cillum quis proident dolor veniam voluptate. Nostrud dolore ipsum anim voluptate enim dolore eiusmod aliqua et. Est eu ex dolor ea ipsum. Adipisicing duis aliquip ullamco culpa dolore exercitation ullamco cillum irure.</ui5-messagestrip>
+	<ui5-messagestrip hide-icon hide-close-button class="top" type="Information">Ea mollit nulla laborum et fugiat nulla excepteur ea. Duis et dolor enim Lorem laboris adipisicing cillum quis proident dolor veniam voluptate. Nostrud dolore ipsum anim voluptate enim dolore eiusmod aliqua et. Est eu ex dolor ea ipsum. Adipisicing duis aliquip ullamco culpa dolore exercitation ullamco cillum irure.</ui5-messagestrip>
+	<ui5-messagestrip hide-close-button class="top" type="Information">Ea mollit nulla laborum et fugiat nulla excepteur ea. Duis et dolor enim Lorem laboris adipisicing cillum quis proident dolor veniam voluptate. Nostrud dolore ipsum anim voluptate enim dolore eiusmod aliqua et. Est eu ex dolor ea ipsum. Adipisicing duis aliquip ullamco culpa dolore exercitation ullamco cillum irure.</ui5-messagestrip>
 
     <ui5-messagestrip type="Warning" class="top"><ui5-icon name="palette" slot="icon"></ui5-icon>Custom icon</ui5-messagestrip>
 
diff --git a/packages/main/test/samples/MessageStrip.sample.html b/packages/main/test/samples/MessageStrip.sample.html
index 4876ec0ae6f6..d3bc09b7d0ca 100644
--- a/packages/main/test/samples/MessageStrip.sample.html
+++ b/packages/main/test/samples/MessageStrip.sample.html
@@ -35,32 +35,32 @@ <h3>MessageStrip</h3>
 <section>
 	<h3>MessageStrip With No Close Button</h3>
 	<div class="snippet">
-		<ui5-messagestrip class="samples-margin-bottom" type="Information" no-close-button>Information MessageStrip With No Close Button</ui5-messagestrip>
-		<ui5-messagestrip class="samples-margin-bottom" type="Positive" no-close-button>Positive MessageStrip With No Close Button</ui5-messagestrip>
-		<ui5-messagestrip class="samples-margin-bottom" type="Negative" no-close-button>Negative MessageStrip With No Close Button</ui5-messagestrip>
-		<ui5-messagestrip class="samples-margin-bottom" type="Warning" no-close-button>Warning MessageStrip With No Close Button</ui5-messagestrip>
+		<ui5-messagestrip class="samples-margin-bottom" type="Information" hide-close-button>Information MessageStrip With No Close Button</ui5-messagestrip>
+		<ui5-messagestrip class="samples-margin-bottom" type="Positive" hide-close-button>Positive MessageStrip With No Close Button</ui5-messagestrip>
+		<ui5-messagestrip class="samples-margin-bottom" type="Negative" hide-close-button>Negative MessageStrip With No Close Button</ui5-messagestrip>
+		<ui5-messagestrip class="samples-margin-bottom" type="Warning" hide-close-button>Warning MessageStrip With No Close Button</ui5-messagestrip>
 	</div>
 	<pre class="prettyprint lang-html"><xmp>
-<ui5-messagestrip type="Information" no-close-button>Information MessageStrip With No Close Button</ui5-messagestrip>
-<ui5-messagestrip type="Positive" no-close-button>Positive MessageStrip With No Close Button</ui5-messagestrip>
-<ui5-messagestrip type="Negative" no-close-button>Negative MessageStrip With No Close Button</ui5-messagestrip>
-<ui5-messagestrip type="Warning" no-close-button>Warning MessageStrip With No Close Button</ui5-messagestrip>
+<ui5-messagestrip type="Information" hide-close-button>Information MessageStrip With No Close Button</ui5-messagestrip>
+<ui5-messagestrip type="Positive" hide-close-button>Positive MessageStrip With No Close Button</ui5-messagestrip>
+<ui5-messagestrip type="Negative" hide-close-button>Negative MessageStrip With No Close Button</ui5-messagestrip>
+<ui5-messagestrip type="Warning" hide-close-button>Warning MessageStrip With No Close Button</ui5-messagestrip>
 	</xmp></pre>
 </section>
 
 <section>
 	<h3>MessageStrip With No Icon</h3>
 	<div class="snippet">
-		<ui5-messagestrip class="samples-margin-bottom" type="Information" no-icon>Information MessageStrip With No Icon</ui5-messagestrip>
-		<ui5-messagestrip class="samples-margin-bottom" type="Positive" no-icon>Positive MessageStrip With No Icon</ui5-messagestrip>
-		<ui5-messagestrip class="samples-margin-bottom" type="Negative" no-icon>Negative MessageStrip With No Icon</ui5-messagestrip>
-		<ui5-messagestrip class="samples-margin-bottom" type="Warning" no-icon>Warning MessageStrip With No Icon</ui5-messagestrip>
+		<ui5-messagestrip class="samples-margin-bottom" type="Information" hide-icon>Information MessageStrip With No Icon</ui5-messagestrip>
+		<ui5-messagestrip class="samples-margin-bottom" type="Positive" hide-icon>Positive MessageStrip With No Icon</ui5-messagestrip>
+		<ui5-messagestrip class="samples-margin-bottom" type="Negative" hide-icon>Negative MessageStrip With No Icon</ui5-messagestrip>
+		<ui5-messagestrip class="samples-margin-bottom" type="Warning" hide-icon>Warning MessageStrip With No Icon</ui5-messagestrip>
 	</div>
 	<pre class="prettyprint lang-html"><xmp>
-<ui5-messagestrip type="Information" no-icon>Information MessageStrip With No Icon</ui5-messagestrip>
-<ui5-messagestrip type="Positive" no-icon>Positive MessageStrip With No Icon</ui5-messagestrip>
-<ui5-messagestrip type="Negative" no-icon>Negative MessageStrip With No Icon</ui5-messagestrip>
-<ui5-messagestrip type="Warning" no-icon>Warning MessageStrip With No Icon</ui5-messagestrip>
+<ui5-messagestrip type="Information" hide-icon>Information MessageStrip With No Icon</ui5-messagestrip>
+<ui5-messagestrip type="Positive" hide-icon>Positive MessageStrip With No Icon</ui5-messagestrip>
+<ui5-messagestrip type="Negative" hide-icon>Negative MessageStrip With No Icon</ui5-messagestrip>
+<ui5-messagestrip type="Warning" hide-icon>Warning MessageStrip With No Icon</ui5-messagestrip>
 <script>
 	document.querySelectorAll("ui5-messagestrip").forEach(function(messageStrip) {
 		messageStrip.addEventListener("close", function() {
@@ -74,17 +74,17 @@ <h3>MessageStrip With No Icon</h3>
 <section>
 	<h3>Custom MessageStrip</h3>
 	<div class="snippet">
-		<ui5-messagestrip class="samples-margin-bottom samples-vertical-align" style="width: 200px;" type="Information" no-icon no-close-button>You have new message.</ui5-messagestrip>
-		<ui5-messagestrip class="samples-margin-bottom samples-vertical-align" style="width: 200px;" type="Positive" no-close-button>Successfull login!</ui5-messagestrip>
-		<ui5-messagestrip class="samples-margin-bottom samples-vertical-align" style="width: 200px;" type="Negative" no-icon>Access denied!</ui5-messagestrip>
+		<ui5-messagestrip class="samples-margin-bottom samples-vertical-align" style="width: 200px;" type="Information" hide-icon hide-close-button>You have new message.</ui5-messagestrip>
+		<ui5-messagestrip class="samples-margin-bottom samples-vertical-align" style="width: 200px;" type="Positive" hide-close-button>Successfull login!</ui5-messagestrip>
+		<ui5-messagestrip class="samples-margin-bottom samples-vertical-align" style="width: 200px;" type="Negative" hide-icon>Access denied!</ui5-messagestrip>
 		<ui5-messagestrip class="samples-margin-bottom samples-vertical-align" style="width: 200px;" type="Warning">Update is required.</ui5-messagestrip>
         <ui5-messagestrip class="samples-margin-bottom samples-vertical-align" style="width: 200px;" type="Warning"><ui5-icon name="palette" slot="icon"></ui5-icon>Custom icon</ui5-messagestrip>
         <ui5-messagestrip class="samples-margin-bottom samples-vertical-align" style="width: 200px;" type="Positive"><img src="../../../assets/images/loading.gif" width="16" height="16" slot="icon">Custom animated gif</ui5-messagestrip>
 	</div>
 	<pre class="prettyprint lang-html"><xmp>
-<ui5-messagestrip type="Information" style="width: 200px;" no-icon no-close-button>You have new message.</ui5-messagestrip>
-<ui5-messagestrip type="Positive" style="width: 200px;" no-close-button>Successfull login!</ui5-messagestrip>
-<ui5-messagestrip type="Negative" style="width: 200px;" no-icon>Access denied!</ui5-messagestrip>
+<ui5-messagestrip type="Information" style="width: 200px;" hide-icon hide-close-button>You have new message.</ui5-messagestrip>
+<ui5-messagestrip type="Positive" style="width: 200px;" hide-close-button>Successfull login!</ui5-messagestrip>
+<ui5-messagestrip type="Negative" style="width: 200px;" hide-icon>Access denied!</ui5-messagestrip>
 <ui5-messagestrip type="Warning" style="width: 200px;">Update is required.</ui5-messagestrip>
 <ui5-messagestrip type="Warning" style="width: 200px;"><ui5-icon name="palette" slot="icon"></ui5-icon>Custom icon</ui5-messagestrip>
 <ui5-messagestrip type="Positive" style="width: 200px;"><img src="../../../assets/images/loading.gif" width="16" height="16" slot="icon">Custom animated gif</ui5-messagestrip>