@ui5/webcomponents-fiori 2.24.0-rc.3 → 2.24.0

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 (41) hide show
  1. package/CHANGELOG.md +24 -0
  2. package/dist/.tsbuildinfo +1 -1
  3. package/dist/FlexibleColumnLayoutTemplate.js +2 -2
  4. package/dist/FlexibleColumnLayoutTemplate.js.map +1 -1
  5. package/dist/Search.d.ts +2 -0
  6. package/dist/Search.js +7 -6
  7. package/dist/Search.js.map +1 -1
  8. package/dist/SearchPopoverTemplate.js +1 -1
  9. package/dist/SearchPopoverTemplate.js.map +1 -1
  10. package/dist/ShellBar.js +3 -0
  11. package/dist/ShellBar.js.map +1 -1
  12. package/dist/ShellBarBranding.d.ts +3 -1
  13. package/dist/ShellBarBranding.js +16 -9
  14. package/dist/ShellBarBranding.js.map +1 -1
  15. package/dist/ShellBarItem.d.ts +2 -1
  16. package/dist/ShellBarItem.js.map +1 -1
  17. package/dist/ShellBarItemTemplate.js +1 -1
  18. package/dist/ShellBarItemTemplate.js.map +1 -1
  19. package/dist/ShellBarSearch.js +1 -0
  20. package/dist/ShellBarSearch.js.map +1 -1
  21. package/dist/UserMenu.d.ts +15 -0
  22. package/dist/UserMenu.js +20 -0
  23. package/dist/UserMenu.js.map +1 -1
  24. package/dist/UserMenuTemplate.js +1 -1
  25. package/dist/UserMenuTemplate.js.map +1 -1
  26. package/dist/css/themes/DynamicPage.css +1 -1
  27. package/dist/custom-elements-internal.json +26 -6
  28. package/dist/custom-elements.json +25 -6
  29. package/dist/fcl-utils/FCLLayout.js +1 -1
  30. package/dist/fcl-utils/FCLLayout.js.map +1 -1
  31. package/dist/generated/themes/DynamicPage.css.d.ts +1 -1
  32. package/dist/generated/themes/DynamicPage.css.js +1 -1
  33. package/dist/generated/themes/DynamicPage.css.js.map +1 -1
  34. package/dist/vscode.html-custom-data.json +5 -0
  35. package/dist/web-types.json +11 -1
  36. package/package.json +7 -7
  37. package/src/FlexibleColumnLayoutTemplate.tsx +4 -2
  38. package/src/SearchPopoverTemplate.tsx +1 -1
  39. package/src/ShellBarItemTemplate.tsx +1 -0
  40. package/src/UserMenuTemplate.tsx +1 -1
  41. package/src/themes/DynamicPage.css +11 -13
package/src/SearchPopoverTemplate.tsx CHANGED
@@ -40,7 +40,7 @@ export default function SearchPopoverTemplate(this: Search, headerTemplate?: Jsx
40
40
  {isPhone() ? (headerTemplate ? headerTemplate.call(this) : (
41
41
  <>
42
42
  <header slot="header" class="ui5-search-popup-searching-header">
43
- <Input class="ui5-search-popover-search-field" onInput={this._handleMobileInput} showClearIcon={this.showClearIcon} noTypeahead={this.noTypeahead} hint={InputKeyHint.Search} onKeyDown={this._onMobileInputKeydown}>
43
+ <Input value={this.value} class="ui5-search-popover-search-field" onInput={this._handleMobileInput} showClearIcon={this.showClearIcon} noTypeahead={this.noTypeahead} hint={InputKeyHint.Search} onKeyDown={this._onMobileInputKeydown}>
44
44
  {this._flattenItems.map(item => {
45
45
  return (<SuggestionItem text={item.text}></SuggestionItem>);
46
46
  })}
package/src/ShellBarItemTemplate.tsx CHANGED
@@ -12,6 +12,7 @@ export default function ShellBarItemTemplate(this: ShellBarItem) {
12
12
  data-count={this.count}
13
13
  data-ui5-stable={this.stableDomRef}
14
14
  accessibilityAttributes={this.accessibilityAttributes}
15
+ onClick={this.fireClickEvent}
15
16
  >
16
17
  {this.text}
17
18
  </ListItemStandard>
package/src/UserMenuTemplate.tsx CHANGED
@@ -106,7 +106,7 @@ function headerContent(this: UserMenu) {
106
106
  {this._selectedAccount &&
107
107
  <div class="ui5-user-menu-selected-account" aria-label={this._ariaLabelledByAccountInformationText}>
108
108
  <span title={this.showEditButton ? this._editAvatarTooltip : undefined}>
109
- <Avatar size="L" onClick={this._handleAvatarClick} initials={this._selectedAccount._initials} colorScheme={this._selectedAccount.avatarColorScheme} fallbackIcon={personPlaceholder} class="ui5-user-menu-selected-account-avatar" interactive>
109
+ <Avatar size="L" onClick={this._isAvatarInteractive ? this._handleAvatarClick : undefined} initials={this._selectedAccount._initials} colorScheme={this._selectedAccount.avatarColorScheme} fallbackIcon={personPlaceholder} class="ui5-user-menu-selected-account-avatar" mode={this._isAvatarInteractive ? "Interactive" : "Image"}>
110
110
  {this._selectedAccount.avatarSrc &&
111
111
  <img src={this._selectedAccount.avatarSrc}/>
112
112
  }
package/src/themes/DynamicPage.css CHANGED
@@ -83,21 +83,19 @@
83
83
 
84
84
  /* Responsive paddings */
85
85
 
86
- /* S Size */
87
- @container (max-width: 599px) {
88
- .ui5-dynamic-page-fit-content {
89
- padding: var(--_ui5_dynamic_page_content_padding_S);
90
- }
91
- ::slotted([slot="titleArea"]) {
92
- padding: var(--_ui5_dynamic_page_title_padding_S);
93
- }
94
- ::slotted([slot="headerArea"]) {
95
- padding: var(--_ui5_dynamic_page_header_padding_S);
96
- }
86
+ /* S Size (default, no container query needed) */
87
+ .ui5-dynamic-page-fit-content {
88
+ padding: var(--_ui5_dynamic_page_content_padding_S);
89
+ }
90
+ ::slotted([slot="titleArea"]) {
91
+ padding: var(--_ui5_dynamic_page_title_padding_S);
92
+ }
93
+ ::slotted([slot="headerArea"]) {
94
+ padding: var(--_ui5_dynamic_page_header_padding_S);
97
95
  }
98
96
 
99
97
  /* M Size */
100
- @container (min-width: 600px) and (max-width: 1023px) {
98
+ @container (min-width: 600px) {
101
99
  .ui5-dynamic-page-fit-content {
102
100
  padding: var(--_ui5_dynamic_page_content_padding_M);
103
101
  }
@@ -110,7 +108,7 @@
110
108
  }
111
109
 
112
110
  /* L Size */
113
- @container (min-width: 1024px) and (max-width: 1439px) {
111
+ @container (min-width: 1024px) {
114
112
  .ui5-dynamic-page-fit-content {
115
113
  padding: var(--_ui5_dynamic_page_content_padding_L);
116
114
  }