Skip to content

Commit 1cb43f2

Browse files
fifoosidfifoosid
authoredMay 28, 2021
fix(ui5-messagestrip): rename properties (#3346)
Part of #3107 BREAKING_CHANGE: The property `noIcon` has been renamed to `hideIcon` BREAKING_CHANGE: The property `noCloseButton` has been renamed to `hideCloseButton`
·
v2.10.0-rc.2v0.0.0-7b49a7ff1
1 parent 6630c2a commit 1cb43f2

File tree

5 files changed

+37
-36
lines changed

5 files changed

+37
-36
lines changed
 

‎packages/main/src/MessageStrip.hbs

+2-2
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
aria-labelledby="{{_id}}"
77
>
88

9-
{{#unless noIcon}}
9+
{{#unless hideIcon}}
1010
<div
1111
class="ui5-messagestrip-icon-wrapper"
1212
aria-hidden="true"
@@ -22,7 +22,7 @@
2222
<span class="ui5-hidden-text">{{hiddenText}}</span>
2323
<span class="ui5-messagestrip-text"><slot></slot></span>
2424

25-
{{#unless noCloseButton}}
25+
{{#unless hideCloseButton}}
2626
<ui5-button
2727
icon="decline"
2828
design="Transparent"

‎packages/main/src/MessageStrip.js

+6-5
Original file line numberDiff line numberDiff line change
@@ -46,8 +46,9 @@ const metadata = {
4646
* @type {boolean}
4747
* @defaultvalue false
4848
* @public
49+
* @since 1.0.0-rc.15
4950
*/
50-
noIcon: {
51+
hideIcon: {
5152
type: Boolean,
5253
},
5354

@@ -58,7 +59,7 @@ const metadata = {
5859
* @defaultvalue false
5960
* @public
6061
*/
61-
noCloseButton: {
62+
hideCloseButton: {
6263
type: Boolean,
6364
},
6465
},
@@ -190,7 +191,7 @@ class MessageStrip extends UI5Element {
190191
}
191192

192193
get hiddenText() {
193-
return `Message Strip ${this.design} ${this.noCloseButton ? "" : "closable"}`;
194+
return `Message Strip ${this.design} ${this.hideCloseButton ? "" : "closable"}`;
194195
}
195196

196197
get _closeButtonText() {
@@ -201,8 +202,8 @@ class MessageStrip extends UI5Element {
201202
return {
202203
root: {
203204
"ui5-messagestrip-root": true,
204-
"ui5-messagestrip-root-no-icon": this.noIcon,
205-
"ui5-messagestrip-root-no-close-button": this.noCloseButton,
205+
"ui5-messagestrip-root-hide-icon": this.hideIcon,
206+
"ui5-messagestrip-root-hide-close-button": this.hideCloseButton,
206207
[this.designClasses]: true,
207208
},
208209
};

‎packages/main/src/themes/MessageStrip.css

+4-4
Original file line numberDiff line numberDiff line change
@@ -18,11 +18,11 @@
1818
position: relative;
1919
}
2020

21-
.ui5-messagestrip-root-no-icon {
21+
.ui5-messagestrip-root-hide-icon {
2222
padding: var(--_ui5_messagestrip_padding_no_icon);
2323
}
2424

25-
.ui5-messagestrip-root-no-close-button {
25+
.ui5-messagestrip-root-hide-close-button {
2626
padding-right: 1rem;
2727
}
2828

@@ -107,12 +107,12 @@
107107
padding-left: 2rem;
108108
}
109109

110-
[dir="rtl"] .ui5-messagestrip-root-no-icon {
110+
[dir="rtl"] .ui5-messagestrip-root-hide-icon {
111111
padding-right: 1rem;
112112
padding-left: 2rem;
113113
}
114114

115-
[dir="rtl"] .ui5-messagestrip-root-no-close-button {
115+
[dir="rtl"] .ui5-messagestrip-root-hide-close-button {
116116
padding-left: 1rem;
117117
padding-right: 0;
118118
}

‎packages/main/test/pages/MessageStrip.html

+3-3
Original file line numberDiff line numberDiff line change
@@ -40,9 +40,9 @@
4040
<ui5-messagestrip class="top" design="Information">Information with default icon.</ui5-messagestrip>
4141
<ui5-messagestrip class="top" design="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>
4242

43-
<ui5-messagestrip no-icon class="top" design="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>
44-
<ui5-messagestrip no-icon no-close-button class="top" design="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>
45-
<ui5-messagestrip no-close-button class="top" design="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>
43+
<ui5-messagestrip hide-icon class="top" design="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>
44+
<ui5-messagestrip hide-icon hide-close-button class="top" design="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>
45+
<ui5-messagestrip hide-close-button class="top" design="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>
4646

4747
<ui5-messagestrip design="Warning" class="top"><ui5-icon name="palette" slot="icon"></ui5-icon>Custom icon</ui5-messagestrip>
4848

‎packages/main/test/samples/MessageStrip.sample.html

+22-22
Original file line numberDiff line numberDiff line change
@@ -35,32 +35,32 @@ <h3>MessageStrip</h3>
3535
<section>
3636
<h3>MessageStrip With No Close Button</h3>
3737
<div class="snippet">
38-
<ui5-messagestrip class="samples-margin-bottom" design="Information" no-close-button>Information MessageStrip With No Close Button</ui5-messagestrip>
39-
<ui5-messagestrip class="samples-margin-bottom" design="Positive" no-close-button>Positive MessageStrip With No Close Button</ui5-messagestrip>
40-
<ui5-messagestrip class="samples-margin-bottom" design="Negative" no-close-button>Negative MessageStrip With No Close Button</ui5-messagestrip>
41-
<ui5-messagestrip class="samples-margin-bottom" design="Warning" no-close-button>Warning MessageStrip With No Close Button</ui5-messagestrip>
38+
<ui5-messagestrip class="samples-margin-bottom" design="Information" hide-close-button>Information MessageStrip With No Close Button</ui5-messagestrip>
39+
<ui5-messagestrip class="samples-margin-bottom" design="Positive" hide-close-button>Positive MessageStrip With No Close Button</ui5-messagestrip>
40+
<ui5-messagestrip class="samples-margin-bottom" design="Negative" hide-close-button>Negative MessageStrip With No Close Button</ui5-messagestrip>
41+
<ui5-messagestrip class="samples-margin-bottom" design="Warning" hide-close-button>Warning MessageStrip With No Close Button</ui5-messagestrip>
4242
</div>
4343
<pre class="prettyprint lang-html"><xmp>
44-
<ui5-messagestrip design="Information" no-close-button>Information MessageStrip With No Close Button</ui5-messagestrip>
45-
<ui5-messagestrip design="Positive" no-close-button>Positive MessageStrip With No Close Button</ui5-messagestrip>
46-
<ui5-messagestrip design="Negative" no-close-button>Negative MessageStrip With No Close Button</ui5-messagestrip>
47-
<ui5-messagestrip design="Warning" no-close-button>Warning MessageStrip With No Close Button</ui5-messagestrip>
44+
<ui5-messagestrip design="Information" hide-close-button>Information MessageStrip With No Close Button</ui5-messagestrip>
45+
<ui5-messagestrip design="Positive" hide-close-button>Positive MessageStrip With No Close Button</ui5-messagestrip>
46+
<ui5-messagestrip design="Negative" hide-close-button>Negative MessageStrip With No Close Button</ui5-messagestrip>
47+
<ui5-messagestrip design="Warning" hide-close-button>Warning MessageStrip With No Close Button</ui5-messagestrip>
4848
</xmp></pre>
4949
</section>
5050

5151
<section>
5252
<h3>MessageStrip With No Icon</h3>
5353
<div class="snippet">
54-
<ui5-messagestrip class="samples-margin-bottom" design="Information" no-icon>Information MessageStrip With No Icon</ui5-messagestrip>
55-
<ui5-messagestrip class="samples-margin-bottom" design="Positive" no-icon>Positive MessageStrip With No Icon</ui5-messagestrip>
56-
<ui5-messagestrip class="samples-margin-bottom" design="Negative" no-icon>Negative MessageStrip With No Icon</ui5-messagestrip>
57-
<ui5-messagestrip class="samples-margin-bottom" design="Warning" no-icon>Warning MessageStrip With No Icon</ui5-messagestrip>
54+
<ui5-messagestrip class="samples-margin-bottom" design="Information" hide-icon>Information MessageStrip With No Icon</ui5-messagestrip>
55+
<ui5-messagestrip class="samples-margin-bottom" design="Positive" hide-icon>Positive MessageStrip With No Icon</ui5-messagestrip>
56+
<ui5-messagestrip class="samples-margin-bottom" design="Negative" hide-icon>Negative MessageStrip With No Icon</ui5-messagestrip>
57+
<ui5-messagestrip class="samples-margin-bottom" design="Warning" hide-icon>Warning MessageStrip With No Icon</ui5-messagestrip>
5858
</div>
5959
<pre class="prettyprint lang-html"><xmp>
60-
<ui5-messagestrip design="Information" no-icon>Information MessageStrip With No Icon</ui5-messagestrip>
61-
<ui5-messagestrip design="Positive" no-icon>Positive MessageStrip With No Icon</ui5-messagestrip>
62-
<ui5-messagestrip design="Negative" no-icon>Negative MessageStrip With No Icon</ui5-messagestrip>
63-
<ui5-messagestrip design="Warning" no-icon>Warning MessageStrip With No Icon</ui5-messagestrip>
60+
<ui5-messagestrip design="Information" hide-icon>Information MessageStrip With No Icon</ui5-messagestrip>
61+
<ui5-messagestrip design="Positive" hide-icon>Positive MessageStrip With No Icon</ui5-messagestrip>
62+
<ui5-messagestrip design="Negative" hide-icon>Negative MessageStrip With No Icon</ui5-messagestrip>
63+
<ui5-messagestrip design="Warning" hide-icon>Warning MessageStrip With No Icon</ui5-messagestrip>
6464
<script>
6565
document.querySelectorAll("ui5-messagestrip").forEach(function(messageStrip) {
6666
messageStrip.addEventListener("close", function() {
@@ -74,17 +74,17 @@ <h3>MessageStrip With No Icon</h3>
7474
<section>
7575
<h3>Custom MessageStrip</h3>
7676
<div class="snippet">
77-
<ui5-messagestrip class="samples-margin-bottom samples-vertical-align" style="width: 200px;" design="Information" no-icon no-close-button>You have new message.</ui5-messagestrip>
78-
<ui5-messagestrip class="samples-margin-bottom samples-vertical-align" style="width: 200px;" design="Positive" no-close-button>Successfull login!</ui5-messagestrip>
79-
<ui5-messagestrip class="samples-margin-bottom samples-vertical-align" style="width: 200px;" design="Negative" no-icon>Access denied!</ui5-messagestrip>
77+
<ui5-messagestrip class="samples-margin-bottom samples-vertical-align" style="width: 200px;" design="Information" hide-icon hide-close-button>You have new message.</ui5-messagestrip>
78+
<ui5-messagestrip class="samples-margin-bottom samples-vertical-align" style="width: 200px;" design="Positive" hide-close-button>Successfull login!</ui5-messagestrip>
79+
<ui5-messagestrip class="samples-margin-bottom samples-vertical-align" style="width: 200px;" design="Negative" hide-icon>Access denied!</ui5-messagestrip>
8080
<ui5-messagestrip class="samples-margin-bottom samples-vertical-align" style="width: 200px;" design="Warning">Update is required.</ui5-messagestrip>
8181
<ui5-messagestrip class="samples-margin-bottom samples-vertical-align" style="width: 200px;" design="Warning"><ui5-icon name="palette" slot="icon"></ui5-icon>Custom icon</ui5-messagestrip>
8282
<ui5-messagestrip class="samples-margin-bottom samples-vertical-align" style="width: 200px;" design="Positive"><img src="../../../assets/images/loading.gif" width="16" height="16" slot="icon">Custom animated gif</ui5-messagestrip>
8383
</div>
8484
<pre class="prettyprint lang-html"><xmp>
85-
<ui5-messagestrip design="Information" style="width: 200px;" no-icon no-close-button>You have new message.</ui5-messagestrip>
86-
<ui5-messagestrip design="Positive" style="width: 200px;" no-close-button>Successfull login!</ui5-messagestrip>
87-
<ui5-messagestrip design="Negative" style="width: 200px;" no-icon>Access denied!</ui5-messagestrip>
85+
<ui5-messagestrip design="Information" style="width: 200px;" hide-icon hide-close-button>You have new message.</ui5-messagestrip>
86+
<ui5-messagestrip design="Positive" style="width: 200px;" hide-close-button>Successfull login!</ui5-messagestrip>
87+
<ui5-messagestrip design="Negative" style="width: 200px;" hide-icon>Access denied!</ui5-messagestrip>
8888
<ui5-messagestrip design="Warning" style="width: 200px;">Update is required.</ui5-messagestrip>
8989
<ui5-messagestrip design="Warning" style="width: 200px;"><ui5-icon name="palette" slot="icon"></ui5-icon>Custom icon</ui5-messagestrip>
9090
<ui5-messagestrip design="Positive" style="width: 200px;"><img src="../../../assets/images/loading.gif" width="16" height="16" slot="icon">Custom animated gif</ui5-messagestrip>

0 commit comments

Comments
 (0)
Please sign in to comment.