@ui5/webcomponents 0.0.0-1acdb5da5 → 0.0.0-1b5f0ec39

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 (192) hide show
  1. package/CHANGELOG.md +54 -0
  2. package/dist/Avatar.d.ts +9 -3
  3. package/dist/Avatar.js +29 -10
  4. package/dist/Avatar.js.map +1 -1
  5. package/dist/Carousel.d.ts +1 -0
  6. package/dist/Carousel.js +1 -0
  7. package/dist/Carousel.js.map +1 -1
  8. package/dist/CheckBox.d.ts +10 -0
  9. package/dist/CheckBox.js +10 -0
  10. package/dist/CheckBox.js.map +1 -1
  11. package/dist/Icon.d.ts +11 -0
  12. package/dist/Icon.js +11 -0
  13. package/dist/Icon.js.map +1 -1
  14. package/dist/Menu.d.ts +21 -0
  15. package/dist/Menu.js +26 -6
  16. package/dist/Menu.js.map +1 -1
  17. package/dist/MenuItem.d.ts +23 -1
  18. package/dist/MenuItem.js +10 -3
  19. package/dist/MenuItem.js.map +1 -1
  20. package/dist/Tab.d.ts +1 -1
  21. package/dist/Tab.js.map +1 -1
  22. package/dist/TabContainer.d.ts +10 -10
  23. package/dist/TabContainer.js +10 -10
  24. package/dist/TabContainer.js.map +1 -1
  25. package/dist/Title.d.ts +1 -0
  26. package/dist/Title.js +1 -0
  27. package/dist/Title.js.map +1 -1
  28. package/dist/api.json +1 -1
  29. package/dist/assets/Title.3d358ef7.css +1 -0
  30. package/dist/assets/parameters-bundle.css.067142cc.js +1 -0
  31. package/dist/assets/parameters-bundle.css.0d6c19c9.js +1 -0
  32. package/dist/assets/parameters-bundle.css.217b9808.js +1 -0
  33. package/dist/assets/parameters-bundle.css.2280ce3e.js +1 -0
  34. package/dist/assets/parameters-bundle.css.3e7079bc.js +1 -0
  35. package/dist/assets/parameters-bundle.css.46b7578e.js +1 -0
  36. package/dist/assets/parameters-bundle.css.472c33c9.js +1 -0
  37. package/dist/assets/{parameters-bundle.css.3e7ea7bd.js → parameters-bundle.css.750d2219.js} +1 -1
  38. package/dist/assets/parameters-bundle.css.78ee4829.js +1 -0
  39. package/dist/assets/parameters-bundle.css.7bae430d.js +1 -0
  40. package/dist/assets/parameters-bundle.css.860290a0.js +1 -0
  41. package/dist/assets/parameters-bundle.css.8f1d575d.js +1 -0
  42. package/dist/assets/parameters-bundle.css.91b4958e.js +1 -0
  43. package/dist/assets/parameters-bundle.css.9b175fb5.js +1 -0
  44. package/dist/assets/parameters-bundle.css.a68d7143.js +1 -0
  45. package/dist/assets/parameters-bundle.css.ab21e265.js +1 -0
  46. package/dist/assets/parameters-bundle.css.b7a02c6d.js +1 -0
  47. package/dist/assets/parameters-bundle.css.b8686554.js +1 -0
  48. package/dist/assets/parameters-bundle.css.bdbac4ec.js +1 -0
  49. package/dist/assets/parameters-bundle.css.d6e06337.js +1 -0
  50. package/dist/assets/parameters-bundle.css.d806367c.js +1 -0
  51. package/dist/assets/parameters-bundle.css.ef6e66b9.js +1 -0
  52. package/dist/assets/parameters-bundle.css.f3164b8d.js +1 -0
  53. package/dist/assets/parameters-bundle.css.f65359ec.js +1 -0
  54. package/dist/css/themes/Avatar.css +1 -1
  55. package/dist/css/themes/CheckBox.css +1 -1
  56. package/dist/css/themes/Link.css +1 -1
  57. package/dist/css/themes/Menu.css +1 -1
  58. package/dist/css/themes/Panel.css +1 -1
  59. package/dist/css/themes/Suggestions.css +1 -1
  60. package/dist/css/themes/TabContainer.css +1 -1
  61. package/dist/css/themes/TableCell.css +1 -1
  62. package/dist/css/themes/TableRow.css +1 -1
  63. package/dist/css/themes/Title.css +1 -1
  64. package/dist/css/themes/sap_belize/parameters-bundle.css +1 -1
  65. package/dist/css/themes/sap_belize_hcb/parameters-bundle.css +1 -1
  66. package/dist/css/themes/sap_belize_hcw/parameters-bundle.css +1 -1
  67. package/dist/css/themes/sap_fiori_3/parameters-bundle.css +1 -1
  68. package/dist/css/themes/sap_fiori_3_dark/parameters-bundle.css +1 -1
  69. package/dist/css/themes/sap_fiori_3_hcb/parameters-bundle.css +1 -1
  70. package/dist/css/themes/sap_fiori_3_hcw/parameters-bundle.css +1 -1
  71. package/dist/css/themes/sap_horizon/parameters-bundle.css +1 -1
  72. package/dist/css/themes/sap_horizon_dark/parameters-bundle.css +1 -1
  73. package/dist/css/themes/sap_horizon_exp/parameters-bundle.css +1 -1
  74. package/dist/css/themes/sap_horizon_hcb/parameters-bundle.css +1 -1
  75. package/dist/css/themes/sap_horizon_hcw/parameters-bundle.css +1 -1
  76. package/dist/custom-elements.json +1 -1
  77. package/dist/generated/assets/themes/sap_belize/parameters-bundle.css.json +1 -1
  78. package/dist/generated/assets/themes/sap_belize_hcb/parameters-bundle.css.json +1 -1
  79. package/dist/generated/assets/themes/sap_belize_hcw/parameters-bundle.css.json +1 -1
  80. package/dist/generated/assets/themes/sap_fiori_3/parameters-bundle.css.json +1 -1
  81. package/dist/generated/assets/themes/sap_fiori_3_dark/parameters-bundle.css.json +1 -1
  82. package/dist/generated/assets/themes/sap_fiori_3_hcb/parameters-bundle.css.json +1 -1
  83. package/dist/generated/assets/themes/sap_fiori_3_hcw/parameters-bundle.css.json +1 -1
  84. package/dist/generated/assets/themes/sap_horizon/parameters-bundle.css.json +1 -1
  85. package/dist/generated/assets/themes/sap_horizon_dark/parameters-bundle.css.json +1 -1
  86. package/dist/generated/assets/themes/sap_horizon_exp/parameters-bundle.css.json +1 -1
  87. package/dist/generated/assets/themes/sap_horizon_hcb/parameters-bundle.css.json +1 -1
  88. package/dist/generated/assets/themes/sap_horizon_hcw/parameters-bundle.css.json +1 -1
  89. package/dist/generated/templates/AvatarTemplate.lit.js +2 -3
  90. package/dist/generated/templates/CheckBoxTemplate.lit.js +1 -1
  91. package/dist/generated/templates/IconTemplate.lit.js +1 -1
  92. package/dist/generated/templates/InputPopoverTemplate.lit.js +1 -1
  93. package/dist/generated/templates/MenuTemplate.lit.js +5 -3
  94. package/dist/generated/themes/Avatar.css.js +1 -1
  95. package/dist/generated/themes/Avatar.css.js.map +1 -1
  96. package/dist/generated/themes/CheckBox.css.js +1 -1
  97. package/dist/generated/themes/CheckBox.css.js.map +1 -1
  98. package/dist/generated/themes/Link.css.js +1 -1
  99. package/dist/generated/themes/Link.css.js.map +1 -1
  100. package/dist/generated/themes/Menu.css.js +1 -1
  101. package/dist/generated/themes/Menu.css.js.map +1 -1
  102. package/dist/generated/themes/Panel.css.js +1 -1
  103. package/dist/generated/themes/Panel.css.js.map +1 -1
  104. package/dist/generated/themes/Suggestions.css.js +1 -1
  105. package/dist/generated/themes/Suggestions.css.js.map +1 -1
  106. package/dist/generated/themes/TabContainer.css.js +1 -1
  107. package/dist/generated/themes/TabContainer.css.js.map +1 -1
  108. package/dist/generated/themes/TableCell.css.js +1 -1
  109. package/dist/generated/themes/TableCell.css.js.map +1 -1
  110. package/dist/generated/themes/TableRow.css.js +1 -1
  111. package/dist/generated/themes/TableRow.css.js.map +1 -1
  112. package/dist/generated/themes/Title.css.js +1 -1
  113. package/dist/generated/themes/Title.css.js.map +1 -1
  114. package/dist/generated/themes/sap_belize/parameters-bundle.css.js +1 -1
  115. package/dist/generated/themes/sap_belize/parameters-bundle.css.js.map +1 -1
  116. package/dist/generated/themes/sap_belize_hcb/parameters-bundle.css.js +1 -1
  117. package/dist/generated/themes/sap_belize_hcb/parameters-bundle.css.js.map +1 -1
  118. package/dist/generated/themes/sap_belize_hcw/parameters-bundle.css.js +1 -1
  119. package/dist/generated/themes/sap_belize_hcw/parameters-bundle.css.js.map +1 -1
  120. package/dist/generated/themes/sap_fiori_3/parameters-bundle.css.js +1 -1
  121. package/dist/generated/themes/sap_fiori_3/parameters-bundle.css.js.map +1 -1
  122. package/dist/generated/themes/sap_fiori_3_dark/parameters-bundle.css.js +1 -1
  123. package/dist/generated/themes/sap_fiori_3_dark/parameters-bundle.css.js.map +1 -1
  124. package/dist/generated/themes/sap_fiori_3_hcb/parameters-bundle.css.js +1 -1
  125. package/dist/generated/themes/sap_fiori_3_hcb/parameters-bundle.css.js.map +1 -1
  126. package/dist/generated/themes/sap_fiori_3_hcw/parameters-bundle.css.js +1 -1
  127. package/dist/generated/themes/sap_fiori_3_hcw/parameters-bundle.css.js.map +1 -1
  128. package/dist/generated/themes/sap_horizon/parameters-bundle.css.js +1 -1
  129. package/dist/generated/themes/sap_horizon/parameters-bundle.css.js.map +1 -1
  130. package/dist/generated/themes/sap_horizon_dark/parameters-bundle.css.js +1 -1
  131. package/dist/generated/themes/sap_horizon_dark/parameters-bundle.css.js.map +1 -1
  132. package/dist/generated/themes/sap_horizon_exp/parameters-bundle.css.js +1 -1
  133. package/dist/generated/themes/sap_horizon_exp/parameters-bundle.css.js.map +1 -1
  134. package/dist/generated/themes/sap_horizon_hcb/parameters-bundle.css.js +1 -1
  135. package/dist/generated/themes/sap_horizon_hcb/parameters-bundle.css.js.map +1 -1
  136. package/dist/generated/themes/sap_horizon_hcw/parameters-bundle.css.js +1 -1
  137. package/dist/generated/themes/sap_horizon_hcw/parameters-bundle.css.js.map +1 -1
  138. package/package.json +7 -7
  139. package/src/Avatar.hbs +12 -6
  140. package/src/CheckBox.hbs +1 -0
  141. package/src/Icon.hbs +1 -0
  142. package/src/InputPopover.hbs +1 -1
  143. package/src/Menu.hbs +12 -1
  144. package/src/themes/Avatar.css +16 -0
  145. package/src/themes/CheckBox.css +13 -23
  146. package/src/themes/Link.css +10 -3
  147. package/src/themes/Menu.css +9 -0
  148. package/src/themes/Panel.css +1 -1
  149. package/src/themes/Suggestions.css +12 -0
  150. package/src/themes/TabContainer.css +2 -0
  151. package/src/themes/TableCell.css +1 -1
  152. package/src/themes/TableRow.css +0 -1
  153. package/src/themes/Title.css +8 -1
  154. package/src/themes/base/Link-parameters.css +2 -0
  155. package/src/themes/base/Panel-parameters.css +1 -0
  156. package/src/themes/base/rtl-parameters.css +3 -1
  157. package/src/themes/sap_horizon/CheckBox-parameters.css +4 -9
  158. package/src/themes/sap_horizon/Link-parameters.css +1 -0
  159. package/src/themes/sap_horizon/Panel-parameters.css +1 -0
  160. package/src/themes/sap_horizon_dark/CheckBox-parameters.css +4 -9
  161. package/src/themes/sap_horizon_dark/Link-parameters.css +1 -0
  162. package/src/themes/sap_horizon_dark/Panel-parameters.css +1 -0
  163. package/src/themes/sap_horizon_hcb/CheckBox-parameters.css +2 -7
  164. package/src/themes/sap_horizon_hcb/Link-parameters.css +1 -0
  165. package/src/themes/sap_horizon_hcb/Panel-parameters.css +1 -0
  166. package/src/themes/sap_horizon_hcw/CheckBox-parameters.css +2 -7
  167. package/src/themes/sap_horizon_hcw/Link-parameters.css +1 -0
  168. package/src/themes/sap_horizon_hcw/Panel-parameters.css +1 -0
  169. package/dist/assets/Title.d6aa17aa.css +0 -1
  170. package/dist/assets/parameters-bundle.css.01644757.js +0 -1
  171. package/dist/assets/parameters-bundle.css.09a8d17f.js +0 -1
  172. package/dist/assets/parameters-bundle.css.22c70329.js +0 -1
  173. package/dist/assets/parameters-bundle.css.2c8496aa.js +0 -1
  174. package/dist/assets/parameters-bundle.css.52765351.js +0 -1
  175. package/dist/assets/parameters-bundle.css.699b96c0.js +0 -1
  176. package/dist/assets/parameters-bundle.css.6baa4ec8.js +0 -1
  177. package/dist/assets/parameters-bundle.css.6db4d34a.js +0 -1
  178. package/dist/assets/parameters-bundle.css.6e0935a3.js +0 -1
  179. package/dist/assets/parameters-bundle.css.70a65e3a.js +0 -1
  180. package/dist/assets/parameters-bundle.css.71348be9.js +0 -1
  181. package/dist/assets/parameters-bundle.css.71c92b92.js +0 -1
  182. package/dist/assets/parameters-bundle.css.832a51a3.js +0 -1
  183. package/dist/assets/parameters-bundle.css.8425804e.js +0 -1
  184. package/dist/assets/parameters-bundle.css.9bd22734.js +0 -1
  185. package/dist/assets/parameters-bundle.css.b12ea801.js +0 -1
  186. package/dist/assets/parameters-bundle.css.b429cbbc.js +0 -1
  187. package/dist/assets/parameters-bundle.css.b7a262bf.js +0 -1
  188. package/dist/assets/parameters-bundle.css.c565b624.js +0 -1
  189. package/dist/assets/parameters-bundle.css.cbd268df.js +0 -1
  190. package/dist/assets/parameters-bundle.css.d211215e.js +0 -1
  191. package/dist/assets/parameters-bundle.css.d3b9e3dd.js +0 -1
  192. package/dist/assets/parameters-bundle.css.f552e9e6.js +0 -1
package/src/Menu.hbs CHANGED
@@ -50,9 +50,12 @@
50
50
  <ui5-list
51
51
  id="{{_id}}-menu-list"
52
52
  mode="None"
53
+ ?busy="{{busy}}"
54
+ busy-delay="{{busyDelay}}"
53
55
  separators="None"
54
56
  accessible-role="menu"
55
57
  @ui5-item-click={{_itemClick}}
58
+ @mouseover="{{_busyMouseOver}}"
56
59
  >
57
60
  {{#each _currentItems}}
58
61
  <ui5-li
@@ -79,7 +82,7 @@
79
82
  </div>
80
83
  {{/if}}
81
84
  {{this.item.text}}
82
- {{#if this.item.hasChildren}}
85
+ {{#if this.item.hasSubmenu}}
83
86
  <ui5-icon
84
87
  part="icon"
85
88
  name="slim-arrow-right"
@@ -95,6 +98,14 @@
95
98
  </ui5-li>
96
99
  {{/each}}
97
100
  </ui5-list>
101
+ {{else if busy}}
102
+ <ui5-busy-indicator
103
+ id="{{_id}}-menu-busy-indicator"
104
+ delay="{{busyDelay}}"
105
+ class="ui5-menu-busy-indicator"
106
+ @mouseover="{{_busyMouseOver}}"
107
+ active>
108
+ </ui5-busy-indicator>
98
109
  {{/if}}
99
110
  </div>
100
111
  </ui5-responsive-popover>
@@ -216,6 +216,22 @@
216
216
  color: inherit;
217
217
  }
218
218
 
219
+ .ui5-avatar-icon ~ .ui5-avatar-initials,
220
+ .ui5-avatar-icon ~ .ui5-avatar-icon-fallback {
221
+ display: none;
222
+ }
223
+
224
+ .ui5-avatar-initials:not(.ui5-avatar-initials-hidden) + .ui5-avatar-icon-fallback {
225
+ display: none;
226
+ }
227
+
228
+ .ui5-avatar-initials-hidden {
229
+ position: absolute;
230
+ visibility: hidden;
231
+ z-index: 0;
232
+ pointer-events: none;
233
+ }
234
+
219
235
  /* Slotted Badge */
220
236
  ::slotted([slot="badge"]) {
221
237
  position: absolute;
@@ -35,7 +35,7 @@
35
35
  :host([readonly]:not([value-state="Warning"]):not([value-state="Error"])) .ui5-checkbox-inner {
36
36
  background: var(--sapField_ReadOnly_Background);
37
37
  border: var(--_ui5_checkbox_inner_readonly_border);
38
- color: var(--sapContent_NonInteractiveIconColor);
38
+ color: var(--sapField_TextColor);
39
39
  }
40
40
 
41
41
  /* wrap */
@@ -63,59 +63,50 @@
63
63
 
64
64
  /* value states */
65
65
  :host([value-state="Error"]) .ui5-checkbox-inner,
66
- :host([value-state="Error"]) .ui5-checkbox--hoverable .ui5-checkbox-inner:hover {
66
+ :host([value-state="Error"]) .ui5-checkbox--hoverable:hover .ui5-checkbox-inner {
67
67
  background: var(--sapField_InvalidBackground);
68
68
  border: var(--_ui5_checkbox_inner_error_border);
69
69
  color: var(--sapField_InvalidColor);
70
70
  }
71
71
 
72
- :host([value-state="Error"]) .ui5-checkbox--hoverable .ui5-checkbox-inner:hover {
73
- box-shadow: var(--_ui5_checkbox_inner_error_box_shadow);
72
+ :host([value-state="Error"]) .ui5-checkbox--hoverable:hover .ui5-checkbox-inner {
74
73
  background: var(--_ui5_checkbox_inner_error_background_hover);
75
74
  }
76
75
 
77
76
  :host([value-state="Warning"]) .ui5-checkbox-inner,
78
- :host([value-state="Warning"]) .ui5-checkbox--hoverable .ui5-checkbox-inner:hover {
77
+ :host([value-state="Warning"]) .ui5-checkbox--hoverable:hover .ui5-checkbox-inner {
79
78
  background: var(--sapField_WarningBackground);
80
79
  border: var(--_ui5_checkbox_inner_warning_border);
81
80
  color: var(--_ui5_checkbox_inner_warning_color);
82
81
  }
83
82
 
84
- :host([value-state="Warning"]) .ui5-checkbox--hoverable .ui5-checkbox-inner:hover {
85
- box-shadow: var(--_ui5_checkbox_inner_warning_box_shadow);
83
+ :host([value-state="Warning"]) .ui5-checkbox--hoverable:hover .ui5-checkbox-inner {
86
84
  background: var(--_ui5_checkbox_inner_warning_background_hover);
87
85
  }
88
86
 
89
87
  :host([value-state="Information"]) .ui5-checkbox-inner,
90
- :host([value-state="Information"]) .ui5-checkbox--hoverable .ui5-checkbox-inner:hover {
88
+ :host([value-state="Information"]) .ui5-checkbox--hoverable:hover .ui5-checkbox-inner {
91
89
  background: var(--sapField_InformationBackground);
92
90
  border: var(--_ui5_checkbox_inner_information_border);
93
91
  color: var(--_ui5_checkbox_inner_information_color);
94
92
  }
95
93
 
96
- :host([value-state="Information"]) .ui5-checkbox--hoverable .ui5-checkbox-inner:hover {
97
- box-shadow: var(--_ui5_checkbox_inner_information_box_shadow);
94
+ :host([value-state="Information"]) .ui5-checkbox--hoverable:hover .ui5-checkbox-inner {
98
95
  background: var(--_ui5_checkbox_inner_information_background_hover);
99
96
  }
100
97
 
101
98
 
102
99
  :host([value-state="Success"]) .ui5-checkbox-inner,
103
- :host([value-state="Success"]) .ui5-checkbox--hoverable .ui5-checkbox-inner:hover {
100
+ :host([value-state="Success"]) .ui5-checkbox--hoverable:hover .ui5-checkbox-inner {
104
101
  background: var(--sapField_SuccessBackground);
105
102
  border: var(--_ui5_checkbox_inner_success_border);
106
103
  color: var(--sapField_SuccessColor);
107
104
  }
108
105
 
109
- :host([value-state="Success"]) .ui5-checkbox--hoverable .ui5-checkbox-inner:hover {
110
- box-shadow: var(--_ui5_checkbox_inner_success_box_shadow);
106
+ :host([value-state="Success"]) .ui5-checkbox--hoverable:hover .ui5-checkbox-inner {
111
107
  background: var(--_ui5_checkbox_inner_success_background_hover);
112
108
  }
113
109
 
114
- :host(:not([value-state])) .ui5-checkbox--hoverable .ui5-checkbox-inner:hover,
115
- :host([value-state="None"]) .ui5-checkbox--hoverable .ui5-checkbox-inner:hover {
116
- box-shadow: var(--_ui5_checkbox_inner_default_box_shadow);
117
- }
118
-
119
110
  :host([value-state="Warning"]) .ui5-checkbox-icon,
120
111
  :host([value-state="Warning"][indeterminate]) .ui5-checkbox-inner::after {
121
112
  color: var(--_ui5_checkbox_checkmark_warning_color);
@@ -164,7 +155,6 @@
164
155
  /* hover */
165
156
  :host(:hover:not([disabled])) {
166
157
  background: var(--_ui5_checkbox_outer_hover_background);
167
- box-shadow: var(--_ui5_checkbox_box_shadow);
168
158
  }
169
159
 
170
160
  .ui5-checkbox--hoverable .ui5-checkbox-label:hover {
@@ -172,15 +162,15 @@
172
162
  }
173
163
 
174
164
  /* hover, not active, not checked */
175
- :host(:not([active]):not([checked]):not([value-state])) .ui5-checkbox--hoverable .ui5-checkbox-inner:hover,
176
- :host(:not([active]):not([checked])[value-state="None"]) .ui5-checkbox--hoverable .ui5-checkbox-inner:hover {
165
+ :host(:not([active]):not([checked]):not([value-state])) .ui5-checkbox--hoverable:hover .ui5-checkbox-inner,
166
+ :host(:not([active]):not([checked])[value-state="None"]) .ui5-checkbox--hoverable:hover .ui5-checkbox-inner {
177
167
  background: var(--_ui5_checkbox_hover_background);
178
168
  border-color: var(--_ui5_checkbox_inner_hover_border_color);
179
169
  }
180
170
 
181
171
  /* hover, not active, checked */
182
- :host(:not([active])[checked]:not([value-state])) .ui5-checkbox--hoverable .ui5-checkbox-inner:hover,
183
- :host(:not([active])[checked][value-state="None"]) .ui5-checkbox--hoverable .ui5-checkbox-inner:hover {
172
+ :host(:not([active])[checked]:not([value-state])) .ui5-checkbox--hoverable:hover .ui5-checkbox-inner,
173
+ :host(:not([active])[checked][value-state="None"]) .ui5-checkbox--hoverable:hover .ui5-checkbox-inner {
184
174
  background: var(--_ui5_checkbox_hover_background);
185
175
  border-color: var(--_ui5_checkbox_inner_hover_checked_border_color);
186
176
  }
@@ -13,6 +13,8 @@
13
13
  outline: none;
14
14
  text-decoration: var(--_ui5_link_text_decoration);
15
15
  text-shadow: var(--sapContent_TextShadow);
16
+ white-space: nowrap;
17
+ overflow-wrap: normal;
16
18
  }
17
19
 
18
20
  :host([disabled]) {
@@ -40,7 +42,7 @@
40
42
  color: var(--sapLinkColor);
41
43
  }
42
44
 
43
- :host([wrapping-type="Normal"]) .ui5-link-root {
45
+ :host([wrapping-type="Normal"]) {
44
46
  white-space: normal;
45
47
  overflow-wrap: break-word;
46
48
  }
@@ -49,11 +51,11 @@
49
51
  width: 100%;
50
52
  display: inline-block;
51
53
  position: relative;
52
- white-space: nowrap;
53
54
  overflow: hidden;
54
55
  text-overflow: ellipsis;
55
- overflow-wrap: normal;
56
56
  outline: none;
57
+ white-space: inherit;
58
+ overflow-wrap: inherit;
57
59
  text-decoration: inherit;
58
60
  color: inherit;
59
61
  }
@@ -83,6 +85,11 @@
83
85
  text-decoration: var(--_ui5_link_hover_text_decoration);
84
86
  }
85
87
 
88
+ :host([design="Subtle"]:hover) {
89
+ color: var(--sapLink_SubtleColor);
90
+ text-decoration: var(--_ui5_link_subtle_text_decoration_hover);
91
+ }
92
+
86
93
  :host([focused]:hover) {
87
94
  text-decoration: var(--_ui5_link_focused_hover_text_decoration);
88
95
  }
@@ -43,6 +43,10 @@
43
43
  pointer-events: none;
44
44
  }
45
45
 
46
+ .ui5-menu-busy-indicator {
47
+ width: 100%;
48
+ }
49
+
46
50
  .ui5-menu-dialog-header {
47
51
  display: flex;
48
52
  height: var(--_ui5-responsive_popover_header_height);
@@ -105,6 +109,11 @@
105
109
  margin-inline: var(--_ui5_menu_submenu_margin_offset);
106
110
  }
107
111
 
112
+ .ui5-menu-rp[sub-menu][actual-placement-type="Left"] {
113
+ margin-top: 0.25rem;
114
+ margin-inline: var(--_ui5_menu_submenu_placement_type_left_margin_offset);
115
+ }
116
+
108
117
  .ui5-menu-item::part(additional-text) {
109
118
  margin-inline-start: var(--_ui5_menu_item_additional_text_start_margin);
110
119
  color: var(--sapContent_LabelColor);
@@ -81,7 +81,7 @@
81
81
  }
82
82
 
83
83
  .ui5-panel-content {
84
- padding: 0.625rem 1rem 1.375rem 1rem;
84
+ padding: var(--_ui5_panel_content_padding);
85
85
  background-color: var(--sapGroup_ContentBackground);
86
86
  outline: none;
87
87
  border-bottom-left-radius: var(--_ui5_panel_border_radius);
@@ -20,3 +20,15 @@
20
20
  .ui5-suggestions-popover [ui5-li-suggestion-item]::part(icon) {
21
21
  color: var(--sapList_TextColor);
22
22
  }
23
+
24
+ .input-root-phone.native-input-wrapper {
25
+ display: contents;
26
+ }
27
+
28
+ .input-root-phone.native-input-wrapper::before {
29
+ display: none;
30
+ }
31
+
32
+ .native-input-wrapper .ui5-input-inner-phone {
33
+ margin: 0;
34
+ }
@@ -81,6 +81,8 @@
81
81
 
82
82
  .ui5-tc__overflow > [ui5-button][focused] {
83
83
  outline-offset: 0.125rem;
84
+ --_ui5_button_focused_border: none;
85
+ outline: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);
84
86
  }
85
87
 
86
88
  .ui5-tc-root.ui5-tc--textOnly .ui5-tc__content {
@@ -2,7 +2,7 @@
2
2
  display: table-cell;
3
3
  font-family: "72override", var(--sapFontFamily);
4
4
  font-size: 0.875rem;
5
- height: 100%;
5
+ height: var(--ui5_table_row_height);
6
6
  box-sizing: border-box;
7
7
  color: var(--sapContent_LabelColor);
8
8
  word-break: break-word;
@@ -11,7 +11,6 @@
11
11
  background-color: var(--sapList_Background);
12
12
  color: var(--sapList_TextColor);
13
13
  border-top: 1px solid var(--sapList_BorderColor);
14
- height: var(--ui5_table_row_height);
15
14
  }
16
15
 
17
16
  .ui5-table-row-root:focus {
@@ -30,10 +30,17 @@
30
30
  cursor: inherit;
31
31
  }
32
32
 
33
- :host([wrapping-type="Normal"]) .ui5-title-root {
33
+ :host([wrapping-type="Normal"]) .ui5-title-root,
34
+ :host([wrapping-type="Normal"]) ::slotted(*) {
34
35
  white-space: pre-line;
35
36
  }
36
37
 
38
+ ::slotted(*) {
39
+ font-size: inherit;
40
+ font-family: inherit;
41
+ text-shadow: inherit;
42
+ }
43
+
37
44
  /* Level H1 */
38
45
  :host([level="H1"]) {
39
46
  font-size: var(--sapFontHeader1Size);
@@ -11,4 +11,6 @@
11
11
  --_ui5_link_focus_color: inherit;
12
12
  --_ui5_link_focus_text_decoration: underline;
13
13
  --_ui5_link_subtle_text_decoration: none;
14
+ --_ui5_link_subtle_text_decoration_hover: underline;
15
+
14
16
  }
@@ -10,6 +10,7 @@
10
10
  --_ui5_panel_header_padding_right: 0.5rem;
11
11
  --_ui5_panel_header_button_wrapper_padding: .25rem;
12
12
  --_ui5_panel_focus_offset: 1px;
13
+ --_ui5_panel_content_padding: 0.625rem 1rem 1.375rem 1rem
13
14
  }
14
15
 
15
16
  [data-ui5-compact-size],
@@ -18,6 +18,7 @@
18
18
  --_ui5_progress_indicator_bar_border_radius: 0.5rem 0 0 0.5rem;
19
19
  --_ui5_progress_indicator_remaining_bar_border_radius: 0 0.5rem 0.5rem 0;
20
20
  --_ui5_menu_submenu_margin_offset: -0.25rem 0;
21
+ --_ui5_menu_submenu_placement_type_left_margin_offset: 0.25rem 0;
21
22
  --_ui5-menu_item_icon_float: right;
22
23
  }
23
24
 
@@ -38,6 +39,7 @@
38
39
  --_ui5_progress_indicator_bar_border_radius: 0 0.5rem 0.5rem 0;
39
40
  --_ui5_progress_indicator_remaining_bar_border_radius: 0.5rem 0 0 0.5rem;
40
41
 
41
- --_ui5_menu_submenu_margin_offset: 0 0.25rem;
42
+ --_ui5_menu_submenu_margin_offset: 0 -0.25rem;
43
+ --_ui5_menu_submenu_placement_type_left_margin_offset: 0 0.25rem;
42
44
  --_ui5-menu_item_icon_float: left;
43
45
  }
@@ -11,34 +11,29 @@
11
11
  --_ui5_checkbox_inner_border_radius: var(--sapField_BorderCornerRadius);
12
12
  --_ui5_checkbox_checkmark_color: var(--sapContent_Selected_ForegroundColor);
13
13
  /* hover & active */
14
- --_ui5_checkbox_inner_default_box_shadow: var(--sapContent_Interaction_Shadow);
15
- --_ui5_checkbox_hover_background: var(--sapField_Hover_Background);
14
+ --_ui5_checkbox_hover_background: var(--sapContent_Selected_Hover_Background);
16
15
  --_ui5_checkbox_inner_hover_border_color: var(--sapField_Hover_BorderColor);
17
- --_ui5_checkbox_hover_background: var(--sapField_Hover_Background);
18
16
  --_ui5_checkbox_inner_hover_checked_border_color: var(--sapField_Hover_BorderColor);
19
17
  --_ui5_checkbox_inner_selected_border_color: var(--sapField_Hover_BorderColor);
20
18
  --_ui5_checkbox_inner_active_border_color: var(--sapField_Hover_BorderColor);
21
- --_ui5_checkbox_active_background: var(--sapField_Hover_Background);
19
+ --_ui5_checkbox_active_background: var(--sapContent_Selected_Hover_Background);
22
20
  --_ui5_checkbox_inner_selected_border_color: var(--sapField_Hover_BorderColor);
23
21
  /* readonly */
24
22
  --_ui5_checkbox_inner_readonly_border: var(--sapElement_BorderWidth) var(--sapField_ReadOnly_BorderColor) dashed;
25
23
  /* error state */
26
24
  --_ui5_checkbox_inner_error_border: var(--sapField_InvalidBorderWidth) solid var(--sapField_InvalidColor);
27
- --_ui5_checkbox_inner_error_box_shadow: var(--sapContent_Negative_Shadow);
28
25
  --_ui5_checkbox_inner_error_background_hover: var(--sapField_Hover_Background);
29
26
  /* warning state */
30
27
  --_ui5_checkbox_inner_warning_border: var(--sapField_WarningBorderWidth) solid var(--sapField_WarningColor);
31
- --_ui5_checkbox_inner_warning_color: var(--sapField_TextColor);
32
- --_ui5_checkbox_inner_warning_box_shadow: var(--sapContent_Critical_Shadow);
28
+ --_ui5_checkbox_inner_warning_color: var(--sapField_WarningColor);
33
29
  --_ui5_checkbox_inner_warning_background_hover: var(--sapField_Hover_Background);
30
+ --_ui5_checkbox_checkmark_warning_color: var(--sapField_WarningColor);
34
31
  /* success state */
35
32
  --_ui5_checkbox_inner_success_border: var(--sapField_SuccessBorderWidth) solid var(--sapField_SuccessColor);
36
- --_ui5_checkbox_inner_success_box_shadow: var(--sapContent_Positive_Shadow);
37
33
  --_ui5_checkbox_inner_success_background_hover: var(--sapField_Hover_Background);
38
34
  /* information state */
39
35
  --_ui5_checkbox_inner_information_color: var(--sapField_InformationColor);
40
36
  --_ui5_checkbox_inner_information_border: var(--sapField_InformationBorderWidth) solid var(--sapField_InformationColor);
41
- --_ui5_checkbox_inner_information_box_shadow: var(--sapContent_Informative_Shadow);
42
37
  --_ui5_checkbox_inner_information_background_hover: var(--sapField_Hover_Background);
43
38
  /* disabled */
44
39
  --_ui5_checkbox_disabled_opacity: var(--sapContent_DisabledOpacity);
@@ -11,4 +11,5 @@
11
11
  --_ui5_link_focus_background_color: var(--sapContent_FocusColor);
12
12
  --_ui5_link_focus_color: var(--sapContent_ContrastTextColor);
13
13
  --_ui5_link_subtle_text_decoration: underline;
14
+ --_ui5_link_subtle_text_decoration_hover: none;
14
15
  }
@@ -9,4 +9,5 @@
9
9
  --_ui5_panel_border_radius_expanded: var(--sapElement_BorderCornerRadius) var(--sapElement_BorderCornerRadius) 0 0;
10
10
  --_ui5_panel_icon_color: var(--sapButton_Lite_TextColor);
11
11
  --_ui5_panel_focus_offset: -1px;
12
+ --_ui5_panel_content_padding: 0.625rem 1rem;
12
13
  }
@@ -11,34 +11,29 @@
11
11
  --_ui5_checkbox_inner_border_radius: var(--sapField_BorderCornerRadius);
12
12
  --_ui5_checkbox_checkmark_color: var(--sapContent_Selected_ForegroundColor);
13
13
  /* hover & active */
14
- --_ui5_checkbox_inner_default_box_shadow: var(--sapContent_Interaction_Shadow);
15
- --_ui5_checkbox_hover_background: var(--sapField_Hover_Background);
14
+ --_ui5_checkbox_hover_background: var(--sapContent_Selected_Hover_Background);
16
15
  --_ui5_checkbox_inner_hover_border_color: var(--sapField_Hover_BorderColor);
17
- --_ui5_checkbox_hover_background: var(--sapField_Hover_Background);
18
16
  --_ui5_checkbox_inner_hover_checked_border_color: var(--sapField_Hover_BorderColor);
19
17
  --_ui5_checkbox_inner_selected_border_color: var(--sapField_Hover_BorderColor);
20
18
  --_ui5_checkbox_inner_active_border_color: var(--sapField_Hover_BorderColor);
21
- --_ui5_checkbox_active_background: var(--sapField_Hover_Background);
19
+ --_ui5_checkbox_active_background: var(--sapContent_Selected_Hover_Background);
22
20
  --_ui5_checkbox_inner_selected_border_color: var(--sapField_Hover_BorderColor);
23
21
  /* readonly */
24
22
  --_ui5_checkbox_inner_readonly_border: var(--sapElement_BorderWidth) var(--sapField_ReadOnly_BorderColor) dashed;
25
23
  /* error state */
26
24
  --_ui5_checkbox_inner_error_border: var(--sapField_InvalidBorderWidth) solid var(--sapField_InvalidColor);
27
- --_ui5_checkbox_inner_error_box_shadow: var(--sapContent_Negative_Shadow);
28
25
  --_ui5_checkbox_inner_error_background_hover: var(--sapField_Hover_Background);
29
26
  /* warning state */
30
27
  --_ui5_checkbox_inner_warning_border: var(--sapField_WarningBorderWidth) solid var(--sapField_WarningColor);
31
- --_ui5_checkbox_inner_warning_color: var(--sapField_TextColor);
32
- --_ui5_checkbox_inner_warning_box_shadow: var(--sapContent_Critical_Shadow);
28
+ --_ui5_checkbox_inner_warning_color: var(--sapField_WarningColor);
33
29
  --_ui5_checkbox_inner_warning_background_hover: var(--sapField_Hover_Background);
30
+ --_ui5_checkbox_checkmark_warning_color: var(--sapField_WarningColor);
34
31
  /* success state */
35
32
  --_ui5_checkbox_inner_success_border: var(--sapField_SuccessBorderWidth) solid var(--sapField_SuccessColor);
36
- --_ui5_checkbox_inner_success_box_shadow: var(--sapContent_Positive_Shadow);
37
33
  --_ui5_checkbox_inner_success_background_hover: var(--sapField_Hover_Background);
38
34
  /* information state */
39
35
  --_ui5_checkbox_inner_information_color: var(--sapField_InformationColor);
40
36
  --_ui5_checkbox_inner_information_border: var(--sapField_InformationBorderWidth) solid var(--sapField_InformationColor);
41
- --_ui5_checkbox_inner_information_box_shadow: var(--sapContent_Informative_Shadow);
42
37
  --_ui5_checkbox_inner_information_background_hover: var(--sapField_Hover_Background);
43
38
  /* disabled */
44
39
  --_ui5_checkbox_disabled_opacity: var(--sapContent_DisabledOpacity);
@@ -11,4 +11,5 @@
11
11
  --_ui5_link_focus_background_color: var(--sapContent_FocusColor);
12
12
  --_ui5_link_focus_color: var(--sapContent_ContrastTextColor);
13
13
  --_ui5_link_subtle_text_decoration: underline;
14
+ --_ui5_link_subtle_text_decoration_hover: none;
14
15
  }
@@ -9,4 +9,5 @@
9
9
  --_ui5_panel_border_radius_expanded: var(--sapElement_BorderCornerRadius) var(--sapElement_BorderCornerRadius) 0 0;
10
10
  --_ui5_panel_icon_color: var(--sapButton_Lite_TextColor);
11
11
  --_ui5_panel_focus_offset: -1px;
12
+ --_ui5_panel_content_padding: 0.625rem 1rem;
12
13
  }
@@ -12,10 +12,8 @@
12
12
  --_ui5_checkbox_inner_border_radius: var(--sapField_BorderCornerRadius);
13
13
  --_ui5_checkbox_checkmark_color: var(--sapContent_Selected_ForegroundColor);
14
14
  /* hover & active */
15
- --_ui5_checkbox_inner_default_box_shadow: var(--sapContent_Interaction_Shadow);
16
15
  --_ui5_checkbox_hover_background: var(--sapSelectedColor);
17
16
  --_ui5_checkbox_inner_hover_border_color: var(--sapField_Hover_BorderColor);
18
- --_ui5_checkbox_hover_background: var(--sapSelectedColor);
19
17
  --_ui5_checkbox_inner_hover_checked_border_color: var(--sapField_Hover_BorderColor);
20
18
  --_ui5_checkbox_inner_selected_border_color: var(--sapField_Hover_BorderColor);
21
19
  --_ui5_checkbox_inner_active_border_color: var(--sapField_Hover_BorderColor);
@@ -25,21 +23,18 @@
25
23
  --_ui5_checkbox_inner_readonly_border: var(--sapElement_BorderWidth) var(--sapField_ReadOnly_BorderColor) solid;
26
24
  /* error state */
27
25
  --_ui5_checkbox_inner_error_border: var(--sapField_InvalidBorderWidth) dashed var(--sapField_InvalidColor);
28
- --_ui5_checkbox_inner_error_box_shadow: var(--sapContent_Negative_Shadow);
29
26
  --_ui5_checkbox_inner_error_background_hover: var(--sapField_Hover_Background);
30
27
  /* warning state */
31
28
  --_ui5_checkbox_inner_warning_border: var(--sapField_WarningBorderWidth) dashed var(--sapField_WarningColor);
32
- --_ui5_checkbox_inner_warning_color: var(--sapField_TextColor);
33
- --_ui5_checkbox_inner_warning_box_shadow: var(--sapContent_Critical_Shadow);
29
+ --_ui5_checkbox_inner_warning_color: var(--sapField_WarningColor);
34
30
  --_ui5_checkbox_inner_warning_background_hover: var(--sapField_Hover_Background);
31
+ --_ui5_checkbox_checkmark_warning_color: var(--sapField_WarningColor);
35
32
  /* success state */
36
33
  --_ui5_checkbox_inner_success_border: var(--sapField_SuccessBorderWidth) solid var(--sapField_SuccessColor);
37
- --_ui5_checkbox_inner_success_box_shadow: var(--sapContent_Positive_Shadow);
38
34
  --_ui5_checkbox_inner_success_background_hover: var(--sapField_Hover_Background);
39
35
  /* information state */
40
36
  --_ui5_checkbox_inner_information_color: var(--sapField_InformationColor);
41
37
  --_ui5_checkbox_inner_information_border: var(--sapField_InformationBorderWidth) dashed var(--sapField_InformationColor);
42
- --_ui5_checkbox_inner_information_box_shadow: var(--sapContent_Informative_Shadow);
43
38
  --_ui5_checkbox_inner_information_background_hover: var(--sapField_Hover_Background);
44
39
  /* disabled */
45
40
  --_ui5_checkbox_disabled_opacity: var(--sapContent_DisabledOpacity);
@@ -5,6 +5,7 @@
5
5
  --_ui5_link_hover_text_decoration: none;
6
6
  --_ui5_link_active_text_decoration: none;
7
7
  --_ui5_link_subtle_text_decoration: underline;
8
+ --_ui5_link_subtle_text_decoration_hover: none;
8
9
  --_ui5_link_border: 0.125rem dotted transparent;
9
10
  --_ui5_link_border_focus: 0.125rem dotted var(--sapContent_FocusColor);
10
11
  }
@@ -5,4 +5,5 @@
5
5
  --_ui5_panel_default_header_border: 0.0625rem solid var(--sapGroup_TitleBorderColor);
6
6
  --_ui5_panel_outline_offset: -0.125rem;
7
7
  --_ui5_panel_icon_color: var(--sapButton_Lite_TextColor);
8
+ --_ui5_panel_content_padding: 0.625rem 1rem;
8
9
  }
@@ -12,10 +12,8 @@
12
12
  --_ui5_checkbox_inner_border_radius: var(--sapField_BorderCornerRadius);
13
13
  --_ui5_checkbox_checkmark_color: var(--sapContent_Selected_ForegroundColor);
14
14
  /* hover & active */
15
- --_ui5_checkbox_inner_default_box_shadow: var(--sapContent_Interaction_Shadow);
16
15
  --_ui5_checkbox_hover_background: var(--sapSelectedColor);
17
16
  --_ui5_checkbox_inner_hover_border_color: var(--sapField_Hover_BorderColor);
18
- --_ui5_checkbox_hover_background: var(--sapSelectedColor);
19
17
  --_ui5_checkbox_inner_hover_checked_border_color: var(--sapField_Hover_BorderColor);
20
18
  --_ui5_checkbox_inner_selected_border_color: var(--sapField_Hover_BorderColor);
21
19
  --_ui5_checkbox_inner_active_border_color: var(--sapField_Hover_BorderColor);
@@ -25,21 +23,18 @@
25
23
  --_ui5_checkbox_inner_readonly_border: var(--sapElement_BorderWidth) var(--sapField_ReadOnly_BorderColor) solid;
26
24
  /* error state */
27
25
  --_ui5_checkbox_inner_error_border: var(--sapField_InvalidBorderWidth) dashed var(--sapField_InvalidColor);
28
- --_ui5_checkbox_inner_error_box_shadow: var(--sapContent_Negative_Shadow);
29
26
  --_ui5_checkbox_inner_error_background_hover: var(--sapField_Hover_Background);
30
27
  /* warning state */
31
28
  --_ui5_checkbox_inner_warning_border: var(--sapField_WarningBorderWidth) dashed var(--sapField_WarningColor);
32
- --_ui5_checkbox_inner_warning_color: var(--sapField_TextColor);
33
- --_ui5_checkbox_inner_warning_box_shadow: var(--sapContent_Critical_Shadow);
29
+ --_ui5_checkbox_inner_warning_color: var(--sapField_WarningColor);
34
30
  --_ui5_checkbox_inner_warning_background_hover: var(--sapField_Hover_Background);
31
+ --_ui5_checkbox_checkmark_warning_color: var(--sapField_WarningColor);
35
32
  /* success state */
36
33
  --_ui5_checkbox_inner_success_border: var(--sapField_SuccessBorderWidth) solid var(--sapField_SuccessColor);
37
- --_ui5_checkbox_inner_success_box_shadow: var(--sapContent_Positive_Shadow);
38
34
  --_ui5_checkbox_inner_success_background_hover: var(--sapField_Hover_Background);
39
35
  /* information state */
40
36
  --_ui5_checkbox_inner_information_color: var(--sapField_InformationColor);
41
37
  --_ui5_checkbox_inner_information_border: var(--sapField_InformationBorderWidth) dashed var(--sapField_InformationColor);
42
- --_ui5_checkbox_inner_information_box_shadow: var(--sapContent_Informative_Shadow);
43
38
  --_ui5_checkbox_inner_information_background_hover: var(--sapField_Hover_Background);
44
39
  /* disabled */
45
40
  --_ui5_checkbox_disabled_opacity: var(--sapContent_DisabledOpacity);
@@ -5,6 +5,7 @@
5
5
  --_ui5_link_hover_text_decoration: none;
6
6
  --_ui5_link_active_text_decoration: none;
7
7
  --_ui5_link_subtle_text_decoration: underline;
8
+ --_ui5_link_subtle_text_decoration_hover: none;
8
9
  --_ui5_link_border: 0.125rem dotted transparent;
9
10
  --_ui5_link_border_focus: 0.125rem dotted var(--sapContent_FocusColor);
10
11
  }
@@ -6,4 +6,5 @@
6
6
  --_ui5_panel_default_header_border: 0.0625rem solid var(--sapGroup_TitleBorderColor);
7
7
  --_ui5_panel_outline_offset: -0.125rem;
8
8
  --_ui5_panel_icon_color: var(--sapButton_Lite_TextColor);
9
+ --_ui5_panel_content_padding: 0.625rem 1rem;
9
10
  }
@@ -1 +0,0 @@
1
- .title1auto{background-color:var(--sapBackgroundColor)}.title2auto{width:200px;border:1px solid #ccc}.title3auto{margin-bottom:1rem}