lightning-base-components 1.18.4-alpha → 1.18.6-alpha

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (36) hide show
  1. package/metadata/raptor.json +21 -0
  2. package/package.json +4 -2
  3. package/src/lightning/baseCombobox/baseCombobox.js +20 -14
  4. package/src/lightning/button/button.js +3 -2
  5. package/src/lightning/buttonIcon/buttonIcon.js +19 -16
  6. package/src/lightning/combobox/combobox.js +17 -16
  7. package/src/lightning/f6Controller/f6Controller.js +49 -3
  8. package/src/lightning/formattedRichText/formatted-rich-text.slds.css +1 -1
  9. package/src/lightning/formattedRichText/formattedRichText.css +1 -0
  10. package/src/lightning/formattedRichText/formattedRichText.html +1 -1
  11. package/src/lightning/formattedRichText/formattedRichText.js +1 -0
  12. package/src/lightning/layout/layout.js +2 -0
  13. package/src/lightning/layoutItem/layoutItem.js +2 -0
  14. package/src/lightning/primitiveButton/primitiveButton.js +8 -8
  15. package/src/lightning/sldsCommon/sldsCommon.css +14 -6
  16. package/src/lightning/sldsUtilsPosition/sldsUtilsPosition.css +4 -4
  17. package/src/lightning/sldsUtilsThemes/sldsUtilsThemes.css +50 -19
  18. package/src/lightning/spinner/spinner.js +7 -3
  19. package/src/lightning/toast/button-icon.slds.css +909 -0
  20. package/src/lightning/toast/formatted-rich-text.slds.css +230 -0
  21. package/src/lightning/toast/icon.slds.css +209 -0
  22. package/src/lightning/toast/toast.css +22 -6
  23. package/src/lightning/toast/toast.html +1 -1
  24. package/src/lightning/toast/toast.js +9 -7
  25. package/src/lightning/toast/toast.slds.css +97 -0
  26. package/src/lightning/toastContainer/toast.slds.css +97 -0
  27. package/src/lightning/toastContainer/toastContainer.css +17 -6
  28. package/src/lightning/toastContainer/toastContainer.js +4 -0
  29. package/src/lightning/utilsPrivate/url.js +4 -1
  30. package/src/lightning/utilsPrivate/utilsPrivate.js +8 -4
  31. package/src/lightning/button/__wdio__/utam/utam.html +0 -3
  32. package/src/lightning/button/__wdio__/utam/utam.js +0 -3
  33. package/src/lightning/button/__wdio__/utam/utam.spec.js +0 -20
  34. package/src/lightning/datatable/__wdio__/utam/utam.html +0 -32
  35. package/src/lightning/datatable/__wdio__/utam/utam.js +0 -91
  36. package/src/lightning/datatable/__wdio__/utam/utam.spec.js +0 -214
@@ -16,16 +16,16 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
16
16
 
17
17
  /* .slds-theme {} */
18
18
 
19
- .slds-theme_default {
19
+ :host([data-render-mode="shadow"]) .slds-theme_default {
20
20
  background-color: var(--slds-g-color-neutral-base-100, #fff);
21
21
  color: var(--slds-g-color-neutral-base-10, #181818);
22
22
  }
23
23
 
24
- .slds-theme_shade {
24
+ :host([data-render-mode="shadow"]) .slds-theme_shade {
25
25
  background-color: var(--slds-g-color-neutral-base-95, #f3f3f3);
26
26
  }
27
27
 
28
- .slds-theme_inverse {
28
+ :host([data-render-mode="shadow"]) .slds-theme_inverse {
29
29
  color: var(--slds-g-color-neutral-base-100, #fff);
30
30
  background-color: var(--slds-g-color-brand-base-10, #001639);
31
31
  border-color: var(--slds-g-color-brand-base-10, #001639);
@@ -54,7 +54,7 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
54
54
  color: var(--slds-g-color-neutral-100-opacity-10, rgb(255 255 255 / 15%));
55
55
  } */
56
56
 
57
- .slds-theme_alt-inverse {
57
+ :host([data-render-mode="shadow"]) .slds-theme_alt-inverse {
58
58
  color: var(--slds-g-color-neutral-base-100, #fff);
59
59
  background-color: var(--slds-g-color-brand-base-20, #032d60);
60
60
  border-color: var(--slds-g-color-brand-base-20, #032d60);
@@ -83,9 +83,15 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
83
83
  color: var(--slds-g-color-neutral-100-opacity-10, rgb(255 255 255 / 15%));
84
84
  } */
85
85
 
86
- .slds-theme_success {
86
+ :host([data-render-mode="shadow"]) .slds-theme_success {
87
87
  color: var(--slds-g-color-neutral-base-100, #fff);
88
88
  background-color: var(--slds-g-color-success-base-50, #2e844a);
89
+
90
+ --slds-g-link-color: var(--slds-g-color-neutral-base-100, #fff);
91
+ --slds-g-link-color-active: var(--slds-g-color-neutral-100-opacity-50, rgb(255 255 255 / 50%));
92
+ --slds-g-link-color-hover: var(--slds-g-color-neutral-base-100, #fff);
93
+ --_slds-g-font-decoration: underline;
94
+ --_slds-g-font-decoration-hover: none;
89
95
  }
90
96
 
91
97
  /* .slds-theme_success a:not(.slds-button--neutral) {
@@ -111,9 +117,15 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
111
117
  color: var(--slds-g-color-neutral-100-opacity-10, rgb(255 255 255 / 15%));
112
118
  } */
113
119
 
114
- .slds-theme_info {
120
+ :host([data-render-mode="shadow"]) .slds-theme_info {
115
121
  color: var(--slds-g-color-neutral-base-100, #fff);
116
122
  background-color: var(--slds-g-color-neutral-base-50, #747474);
123
+
124
+ --slds-g-link-color: var(--slds-g-color-neutral-base-100, #fff);
125
+ --slds-g-link-color-active: var(--slds-g-color-neutral-100-opacity-50, rgb(255 255 255 / 50%));
126
+ --slds-g-link-color-hover: var(--slds-g-color-neutral-base-100, #fff);
127
+ --_slds-g-font-decoration: underline;
128
+ --_slds-g-font-decoration-hover: none;
117
129
  }
118
130
 
119
131
  /* .slds-theme_info a:not(.slds-button--neutral) {
@@ -139,9 +151,20 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
139
151
  color: var(--slds-g-color-neutral-100-opacity-10, rgb(255 255 255 / 15%));
140
152
  } */
141
153
 
142
- .slds-theme_warning {
154
+ :host([data-render-mode="shadow"]) .slds-theme_warning {
143
155
  background-color: var(--slds-g-color-warning-base-60, #fe9339);
144
156
  color: var(--slds-g-color-neutral-base-10, #181818);
157
+
158
+ --slds-g-link-color: var(--slds-g-color-neutral-base-10, #181818);
159
+ --slds-g-link-color-active: var(--slds-g-color-neutral-base-30, #514f4d);
160
+ --slds-g-link-color-hover: var(--slds-g-color-neutral-base-10, #181818);
161
+ --_slds-g-font-decoration: underline;
162
+ --_slds-g-font-decoration-hover: none;
163
+ --_slds-g-shadow: 0 0 3px var(--slds--g-color-neutral-base-30, #514f4d);
164
+ --_slds-g-style-border: solid;
165
+ --_slds-g-sizing-border: var(--sds-g-sizing-border-1);
166
+ --_slds-g-color-border: var(--slds-g-color-neutral-base-30, #514f4d);
167
+ --_slds-g-color-outline: transparent;
145
168
  }
146
169
 
147
170
  /**
@@ -181,34 +204,42 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
181
204
  .slds-theme_warning a[disabled] {
182
205
  color: var(--slds-g-color-neutral-base-30, #514f4d);
183
206
  }
207
+ */
184
208
 
185
- .slds-theme_warning button {
209
+ :host([data-render-mode="shadow"]) .slds-theme_warning ::part(button) {
186
210
  color: var(--slds-g-color-neutral-base-30, #514f4d);
187
211
  text-decoration: underline;
212
+
213
+ --slds-c-icon-color-foreground: var(--slds-g-color-neutral-base-30, #514f4d);
188
214
  }
189
215
 
190
- .slds-theme_warning button:hover {
216
+ .slds-theme_warning ::part(button):hover {
191
217
  color: var(--slds-g-color-neutral-base-50, #706e6b);
192
218
  }
193
219
 
194
- .slds-theme_warning button:focus {
220
+ :host([data-render-mode="shadow"]) .slds-theme_warning ::part(button):focus {
195
221
  color: var(--slds-g-color-neutral-base-30, #514f4d);
196
222
  box-shadow: 0 0 3px var(--slds-g-color-neutral-base-30, #514f4d);
197
223
  border: 1px solid var(--slds-g-color-neutral-base-30, #514f4d);
198
224
  }
199
225
 
200
- .slds-theme_warning button:active {
226
+ :host([data-render-mode="shadow"]) .slds-theme_warning ::part(button):active {
201
227
  color: var(--slds-g-color-neutral-base-50, #706e6b);
202
228
  }
203
229
 
204
- .slds-theme_warning .slds-icon,
205
- .slds-theme_warning .slds-button__icon {
206
- fill: var(--slds-g-color-neutral-base-30, #514f4d);
207
- } */
230
+ :host([data-render-mode="shadow"]) .slds-theme_warning ::part(boundary) {
231
+ --slds-c-icon-color-foreground: var(--slds-g-color-neutral-base-30, #514f4d);
232
+ }
208
233
 
209
- .slds-theme_error {
234
+ :host([data-render-mode="shadow"]) .slds-theme_error {
210
235
  color: var(--slds-g-color-neutral-base-100, #fff);
211
236
  background-color: var(--slds-g-color-error-base-40, #ea001e);
237
+
238
+ --slds-g-link-color: var(--slds-g-color-neutral-base-100, #fff);
239
+ --slds-g-link-color-active: var(--slds-g-color-neutral-100-opacity-50, rgb(255 255 255 / 50%));
240
+ --slds-g-link-color-hover: var(--slds-g-color-neutral-base-100, #fff);
241
+ --_slds-g-font-decoration: underline;
242
+ --_slds-g-font-decoration-hover: none;
212
243
  }
213
244
 
214
245
  /* .slds-theme_error a:not(.slds-button--neutral) {
@@ -234,7 +265,7 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
234
265
  color: var(--slds-g-color-neutral-100-opacity-10, rgb(255 255 255 / 15%));
235
266
  } */
236
267
 
237
- .slds-theme_offline {
268
+ :host([data-render-mode="shadow"]) .slds-theme_offline {
238
269
  color: var(--slds-g-color-neutral-base-100, #fff);
239
270
  background-color: var(--slds-g-color-neutral-base-30, #444);
240
271
  }
@@ -262,12 +293,12 @@ Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license */
262
293
  color: var(--slds-g-color-neutral-100-opacity-10, rgb(255 255 255 / 15%));
263
294
  } */
264
295
 
265
- .slds-theme_alert-texture {
296
+ :host([data-render-mode="shadow"]) .slds-theme_alert-texture {
266
297
  background-image: linear-gradient(45deg, rgb(0 0 0 / 2.5%) 25%, transparent 25%, transparent 50%, rgb(0 0 0 / 2.5%) 50%, rgb(0 0 0 / 2.5%) 75%, transparent 75%, transparent);
267
298
  background-size: 64px 64px;
268
299
  }
269
300
 
270
- .slds-theme_inverse-text {
301
+ :host([data-render-mode="shadow"]) .slds-theme_inverse-text {
271
302
  color: var(--slds-g-color-neutral-base-100, #fff);
272
303
  }
273
304
 
@@ -1,7 +1,7 @@
1
1
  import { api } from 'lwc';
2
2
  import LightningShadowBaseClass from 'lightning/shadowBaseClassPrivate';
3
3
  import { classSet } from 'lightning/utils';
4
- import { normalizeString as normalize } from 'lightning/utilsPrivate';
4
+ import { normalizeString as normalize, isCSR } from 'lightning/utilsPrivate';
5
5
 
6
6
  const DEFAULT_SIZE = 'medium';
7
7
  const DEFAULT_VARIANT = 'base';
@@ -10,6 +10,8 @@ const DEFAULT_VARIANT = 'base';
10
10
  * Displays an animated spinner.
11
11
  */
12
12
  export default class LightningSpinner extends LightningShadowBaseClass {
13
+ static validationOptOut = ['class'];
14
+
13
15
  /**
14
16
  * The alternative text used to describe the reason for the wait and need for a spinner.
15
17
  * @type {string}
@@ -61,8 +63,10 @@ export default class LightningSpinner extends LightningShadowBaseClass {
61
63
  connectedCallback() {
62
64
  super.connectedCallback();
63
65
  this.classList.add('slds-spinner_container');
64
- this.template.addEventListener('mousewheel', this.stopScrolling);
65
- this.template.addEventListener('touchmove', this.stopScrolling);
66
+ if (isCSR) {
67
+ this.template.addEventListener('mousewheel', this.stopScrolling);
68
+ this.template.addEventListener('touchmove', this.stopScrolling);
69
+ }
66
70
  }
67
71
 
68
72
  renderedCallback() {