@openui5/sap.f 1.133.2 → 1.135.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 (153) hide show
  1. package/.reuse/dep5 +0 -7
  2. package/THIRDPARTY.txt +2 -23
  3. package/package.json +4 -4
  4. package/src/sap/f/.library +1 -1
  5. package/src/sap/f/Avatar.js +1 -1
  6. package/src/sap/f/AvatarGroup.js +1 -1
  7. package/src/sap/f/AvatarGroupItem.js +1 -1
  8. package/src/sap/f/CalendarAppointmentInCard.js +1 -1
  9. package/src/sap/f/CalendarInCard.js +1 -1
  10. package/src/sap/f/Card.js +1 -1
  11. package/src/sap/f/CardBase.js +170 -36
  12. package/src/sap/f/CardRenderer.js +16 -8
  13. package/src/sap/f/DynamicPage.js +12 -1
  14. package/src/sap/f/DynamicPageAccessibleLandmarkInfo.js +1 -1
  15. package/src/sap/f/DynamicPageHeader.js +1 -1
  16. package/src/sap/f/DynamicPageRenderer.js +1 -1
  17. package/src/sap/f/DynamicPageTitle.js +34 -1
  18. package/src/sap/f/FlexibleColumnLayout.js +1 -1
  19. package/src/sap/f/FlexibleColumnLayoutAccessibleLandmarkInfo.js +1 -1
  20. package/src/sap/f/FlexibleColumnLayoutData.js +1 -1
  21. package/src/sap/f/FlexibleColumnLayoutDataForDesktop.js +1 -1
  22. package/src/sap/f/FlexibleColumnLayoutDataForTablet.js +1 -1
  23. package/src/sap/f/FlexibleColumnLayoutSemanticHelper.js +1 -1
  24. package/src/sap/f/GridContainer.js +60 -110
  25. package/src/sap/f/GridContainerItemLayoutData.js +1 -1
  26. package/src/sap/f/GridContainerRenderer.js +8 -3
  27. package/src/sap/f/GridContainerSettings.js +2 -2
  28. package/src/sap/f/GridContainerUtils.js +8 -0
  29. package/src/sap/f/GridList.js +1 -1
  30. package/src/sap/f/GridListItem.js +1 -1
  31. package/src/sap/f/IllustratedMessage.js +1 -1
  32. package/src/sap/f/Illustration.js +1 -1
  33. package/src/sap/f/PlanningCalendarInCardLegend.js +1 -1
  34. package/src/sap/f/ProductSwitch.js +1 -1
  35. package/src/sap/f/ProductSwitchItem.js +1 -1
  36. package/src/sap/f/SearchManager.js +1 -1
  37. package/src/sap/f/ShellBar.js +3 -4
  38. package/src/sap/f/ShellBarRenderer.js +1 -0
  39. package/src/sap/f/SidePanel.js +1 -1
  40. package/src/sap/f/SidePanelItem.js +1 -1
  41. package/src/sap/f/cards/BaseHeader.js +61 -32
  42. package/src/sap/f/cards/BaseHeaderRenderer.js +212 -3
  43. package/src/sap/f/cards/Header.js +2 -8
  44. package/src/sap/f/cards/HeaderRenderer.js +0 -161
  45. package/src/sap/f/cards/NumericHeader.js +3 -9
  46. package/src/sap/f/cards/NumericHeaderRenderer.js +54 -126
  47. package/src/sap/f/cards/NumericIndicators.js +1 -1
  48. package/src/sap/f/cards/NumericSideIndicator.js +1 -1
  49. package/src/sap/f/cards/loading/AnalyticalPlaceholder.js +1 -1
  50. package/src/sap/f/cards/loading/CalendarPlaceholder.js +1 -1
  51. package/src/sap/f/cards/loading/GenericPlaceholder.js +1 -1
  52. package/src/sap/f/cards/loading/ListPlaceholder.js +1 -1
  53. package/src/sap/f/cards/loading/ObjectPlaceholder.js +1 -1
  54. package/src/sap/f/cards/loading/PlaceholderBase.js +1 -1
  55. package/src/sap/f/cards/loading/TablePlaceholder.js +1 -1
  56. package/src/sap/f/cards/loading/TimelinePlaceholder.js +1 -1
  57. package/src/sap/f/changeHandler/MoveDynamicPageTitleActions.js +1 -1
  58. package/src/sap/f/delegate/GridContainerItemNavigation.js +24 -202
  59. package/src/sap/f/delegate/GridItemNavigation.js +23 -10
  60. package/src/sap/f/dnd/GridDragOver.js +1 -1
  61. package/src/sap/f/dnd/GridDropInfo.js +1 -1
  62. package/src/sap/f/library.js +36 -2
  63. package/src/sap/f/messagebundle.properties +4 -4
  64. package/src/sap/f/messagebundle_ar.properties +0 -2
  65. package/src/sap/f/messagebundle_bg.properties +0 -2
  66. package/src/sap/f/messagebundle_ca.properties +0 -2
  67. package/src/sap/f/messagebundle_cnr.properties +0 -2
  68. package/src/sap/f/messagebundle_cs.properties +0 -2
  69. package/src/sap/f/messagebundle_cy.properties +0 -2
  70. package/src/sap/f/messagebundle_da.properties +0 -2
  71. package/src/sap/f/messagebundle_de.properties +0 -2
  72. package/src/sap/f/messagebundle_el.properties +0 -2
  73. package/src/sap/f/messagebundle_en.properties +0 -2
  74. package/src/sap/f/messagebundle_en_GB.properties +0 -2
  75. package/src/sap/f/messagebundle_en_US_saprigi.properties +2 -2
  76. package/src/sap/f/messagebundle_es.properties +0 -2
  77. package/src/sap/f/messagebundle_es_MX.properties +0 -2
  78. package/src/sap/f/messagebundle_et.properties +0 -2
  79. package/src/sap/f/messagebundle_fi.properties +0 -2
  80. package/src/sap/f/messagebundle_fr.properties +1 -3
  81. package/src/sap/f/messagebundle_fr_CA.properties +0 -2
  82. package/src/sap/f/messagebundle_hi.properties +0 -2
  83. package/src/sap/f/messagebundle_hr.properties +0 -2
  84. package/src/sap/f/messagebundle_hu.properties +0 -2
  85. package/src/sap/f/messagebundle_id.properties +0 -2
  86. package/src/sap/f/messagebundle_it.properties +0 -2
  87. package/src/sap/f/messagebundle_iw.properties +0 -2
  88. package/src/sap/f/messagebundle_ja.properties +0 -2
  89. package/src/sap/f/messagebundle_kk.properties +0 -2
  90. package/src/sap/f/messagebundle_ko.properties +0 -2
  91. package/src/sap/f/messagebundle_lt.properties +0 -2
  92. package/src/sap/f/messagebundle_lv.properties +0 -2
  93. package/src/sap/f/messagebundle_mk.properties +0 -2
  94. package/src/sap/f/messagebundle_ms.properties +0 -2
  95. package/src/sap/f/messagebundle_nl.properties +0 -2
  96. package/src/sap/f/messagebundle_no.properties +0 -2
  97. package/src/sap/f/messagebundle_pl.properties +0 -2
  98. package/src/sap/f/messagebundle_pt.properties +0 -2
  99. package/src/sap/f/messagebundle_pt_PT.properties +0 -2
  100. package/src/sap/f/messagebundle_ro.properties +1 -3
  101. package/src/sap/f/messagebundle_ru.properties +0 -2
  102. package/src/sap/f/messagebundle_sh.properties +0 -2
  103. package/src/sap/f/messagebundle_sk.properties +0 -2
  104. package/src/sap/f/messagebundle_sl.properties +0 -2
  105. package/src/sap/f/messagebundle_sr.properties +0 -2
  106. package/src/sap/f/messagebundle_sv.properties +0 -2
  107. package/src/sap/f/messagebundle_th.properties +0 -2
  108. package/src/sap/f/messagebundle_tr.properties +0 -2
  109. package/src/sap/f/messagebundle_uk.properties +2 -4
  110. package/src/sap/f/messagebundle_vi.properties +0 -2
  111. package/src/sap/f/messagebundle_zh_CN.properties +0 -2
  112. package/src/sap/f/messagebundle_zh_TW.properties +0 -2
  113. package/src/sap/f/semantic/AddAction.js +1 -1
  114. package/src/sap/f/semantic/CloseAction.js +1 -1
  115. package/src/sap/f/semantic/CopyAction.js +1 -1
  116. package/src/sap/f/semantic/DeleteAction.js +1 -1
  117. package/src/sap/f/semantic/DiscussInJamAction.js +1 -1
  118. package/src/sap/f/semantic/EditAction.js +1 -1
  119. package/src/sap/f/semantic/ExitFullScreenAction.js +1 -1
  120. package/src/sap/f/semantic/FavoriteAction.js +1 -1
  121. package/src/sap/f/semantic/FlagAction.js +1 -1
  122. package/src/sap/f/semantic/FooterMainAction.js +1 -1
  123. package/src/sap/f/semantic/FullScreenAction.js +1 -1
  124. package/src/sap/f/semantic/MainAction.js +1 -1
  125. package/src/sap/f/semantic/MessagesIndicator.js +1 -1
  126. package/src/sap/f/semantic/NegativeAction.js +1 -1
  127. package/src/sap/f/semantic/PositiveAction.js +1 -1
  128. package/src/sap/f/semantic/PrintAction.js +1 -1
  129. package/src/sap/f/semantic/SemanticButton.js +1 -1
  130. package/src/sap/f/semantic/SemanticConfiguration.js +1 -1
  131. package/src/sap/f/semantic/SemanticControl.js +1 -1
  132. package/src/sap/f/semantic/SemanticPage.js +1 -1
  133. package/src/sap/f/semantic/SemanticToggleButton.js +1 -1
  134. package/src/sap/f/semantic/SendEmailAction.js +1 -1
  135. package/src/sap/f/semantic/SendMessageAction.js +1 -1
  136. package/src/sap/f/semantic/ShareInJamAction.js +1 -1
  137. package/src/sap/f/semantic/TitleMainAction.js +1 -1
  138. package/src/sap/f/shellBar/AdditionalContentSupport.js +1 -1
  139. package/src/sap/f/shellBar/CoPilot.js +1 -1
  140. package/src/sap/f/shellBar/ControlSpacer.js +1 -1
  141. package/src/sap/f/shellBar/Factory.js +7 -1
  142. package/src/sap/f/shellBar/Search.js +1 -1
  143. package/src/sap/f/themes/base/CalendarPlaceholder.less +16 -4
  144. package/src/sap/f/themes/base/Card.less +93 -41
  145. package/src/sap/f/themes/base/CardBadge.less +10 -5
  146. package/src/sap/f/themes/base/CardHeaders.less +26 -37
  147. package/src/sap/f/themes/base/CardLoading.less +34 -23
  148. package/src/sap/f/themes/base/DynamicPage.less +5 -0
  149. package/src/sap/f/themes/base/GridContainer.less +16 -18
  150. package/src/sap/f/themes/base/GridListItem.less +14 -13
  151. package/src/sap/f/themes/sap_hcb/base_Card.less +3 -10
  152. package/src/sap/f/themes/sap_hcb/base_GridContainer.less +0 -13
  153. package/LICENSES/LicenseRef-tzdata-PublicDomain.txt +0 -5
package/.reuse/dep5 CHANGED
@@ -364,13 +364,6 @@ Copyright:
364
364
  License: Apache-2.0 and ISC
365
365
  Comment: these files contain content from SAP and node-lru-cache: LRUPersistentCache.js is overall written by SAP, but portions ('Least Recently Used' logic) are taken from the node-lru-cache project (see https://github.com/isaacs/node-lru-cache/blob/v2.7.3/README.md) and modified.
366
366
 
367
- Files: src/sap.ui.core/test/sap/ui/core/qunit/i18n/helper/_timezones.js
368
- Copyright:
369
- 2009-2024 SAP SE or an SAP affiliate company and OpenUI5 contributors
370
- Arthur David Olson, Paul Eggert and other contributors
371
- License: Apache-2.0 and LicenseRef-tzdata-PublicDomain
372
- Comment: these files contain content from SAP and Time Zone Database: _timezones.js is overall written by SAP, but the list of IANA timezone IDs is taken from the Timezone Database
373
-
374
367
 
375
368
  # Library: sap.ui.documentation:
376
369
 
package/THIRDPARTY.txt CHANGED
@@ -22,7 +22,7 @@ Contained in: src/sap.m/test/sap/m/qunit/_thirdparty/qunit-composite.css
22
22
 
23
23
  Library: sap.ui.codeeditor:
24
24
 
25
- Component: Ace (Ajax.org Cloud9 Editor), version: 1.31.1
25
+ Component: Ace (Ajax.org Cloud9 Editor), version: 1.36.5
26
26
  Copyright: 2010, Ajax.org B.V.
27
27
  License: BSD-3-Clause
28
28
  License Text: https://github.com/SAP/openui5/blob/master/LICENSES/BSD-3-Clause.txt
@@ -342,12 +342,6 @@ License: ISC
342
342
  License Text: https://github.com/SAP/openui5/blob/master/LICENSES/ISC.txt
343
343
  Contained in: src/sap.ui.core/src/sap/ui/core/cache/LRUPersistentCache.js
344
344
 
345
- Component: Time Zone Database, version: 2024b
346
- Copyright: Arthur David Olson, Paul Eggert and other contributors
347
- License: LicenseRef-tzdata-PublicDomain
348
- License Text: https://github.com/SAP/openui5/blob/master/LICENSES/LicenseRef-tzdata-PublicDomain.txt
349
- Contained in: src/sap.ui.core/test/sap/ui/core/qunit/i18n/helper/_timezones.js
350
-
351
345
 
352
346
  Library: sap.ui.documentation:
353
347
 
@@ -468,7 +462,7 @@ License: Apache-2.0
468
462
  License Text: https://github.com/SAP/openui5/blob/master/LICENSES/Apache-2.0.txt
469
463
  Contained in: lib/jsdoc/ui5/plugin.js
470
464
 
471
- Component: SAP Theming Base Content, version: 11.24.0
465
+ Component: SAP Theming Base Content, version: 11.28.2
472
466
  Copyright: SAP SE or an SAP affiliate company and Theming Base Content contributors
473
467
  License: Apache-2.0
474
468
  License Text: https://github.com/SAP/openui5/blob/master/LICENSES/Apache-2.0.txt
@@ -1015,21 +1009,6 @@ END of license: LicenseRef-Unicode-3.0
1015
1009
  =================================
1016
1010
 
1017
1011
 
1018
- =================================
1019
- BEGIN of license: LicenseRef-tzdata-PublicDomain
1020
- =================================
1021
-
1022
- Unless specified below, all files in the tz code and data (including
1023
- this LICENSE file) are in the public domain.
1024
-
1025
- If the files date.c, newstrftime.3, and strftime.c are present, they
1026
- contain material derived from BSD and use the BSD 3-clause license.
1027
-
1028
- =================================
1029
- END of license: LicenseRef-tzdata-PublicDomain
1030
- =================================
1031
-
1032
-
1033
1012
  =================================
1034
1013
  BEGIN of license: MIT
1035
1014
  =================================
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@openui5/sap.f",
3
- "version": "1.133.2",
3
+ "version": "1.135.0",
4
4
  "description": "OpenUI5 UI Library sap.f",
5
5
  "author": "SAP SE (https://www.sap.com)",
6
6
  "license": "Apache-2.0",
@@ -14,8 +14,8 @@
14
14
  "url": "https://github.com/SAP/openui5.git"
15
15
  },
16
16
  "dependencies": {
17
- "@openui5/sap.m": "1.133.2",
18
- "@openui5/sap.ui.core": "1.133.2",
19
- "@openui5/sap.ui.layout": "1.133.2"
17
+ "@openui5/sap.m": "1.135.0",
18
+ "@openui5/sap.ui.core": "1.135.0",
19
+ "@openui5/sap.ui.layout": "1.135.0"
20
20
  }
21
21
  }
@@ -6,7 +6,7 @@
6
6
  <copyright>OpenUI5
7
7
  * (c) Copyright 2009-2025 SAP SE or an SAP affiliate company.
8
8
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.</copyright>
9
- <version>1.133.2</version>
9
+ <version>1.135.0</version>
10
10
 
11
11
  <documentation>SAPUI5 library with Fiori controls.</documentation>
12
12
 
@@ -41,7 +41,7 @@ sap.ui.define([
41
41
  * @extends sap.m.Avatar
42
42
  *
43
43
  * @author SAP SE
44
- * @version 1.133.2
44
+ * @version 1.135.0
45
45
  *
46
46
  * @constructor
47
47
  * @public
@@ -100,7 +100,7 @@ sap.ui.define([
100
100
  * @extends sap.ui.core.Control
101
101
  *
102
102
  * @author SAP SE
103
- * @version 1.133.2
103
+ * @version 1.135.0
104
104
  *
105
105
  * @constructor
106
106
  * @public
@@ -32,7 +32,7 @@ sap.ui.define([
32
32
  * @extends sap.ui.core.Control
33
33
  *
34
34
  * @author SAP SE
35
- * @version 1.133.2
35
+ * @version 1.135.0
36
36
  *
37
37
  * @constructor
38
38
  * @public
@@ -21,7 +21,7 @@ sap.ui.define([
21
21
  * This calendar appointment is used in card content of type Calendar.
22
22
  *
23
23
  * @extends sap.ui.unified.CalendarAppointment
24
- * @version 1.133.2
24
+ * @version 1.135.0
25
25
  *
26
26
  * @constructor
27
27
  * @private
@@ -45,7 +45,7 @@ sap.ui.define([
45
45
  * <code>sap.m.Toolbar</code> with <code>sap.m.Buttons</code>.
46
46
  *
47
47
  * @extends sap.ui.unified.Calendar
48
- * @version 1.133.2
48
+ * @version 1.135.0
49
49
  *
50
50
  * @constructor
51
51
  * @private
package/src/sap/f/Card.js CHANGED
@@ -71,7 +71,7 @@ sap.ui.define([
71
71
  * @extends sap.f.CardBase
72
72
  *
73
73
  * @author SAP SE
74
- * @version 1.133.2
74
+ * @version 1.135.0
75
75
  *
76
76
  * @constructor
77
77
  * @public
@@ -10,7 +10,10 @@ sap.ui.define([
10
10
  "sap/ui/core/Lib",
11
11
  "sap/f/cards/util/CardBadgeEnabler",
12
12
  "sap/f/library",
13
- "sap/base/Log"
13
+ "sap/base/Log",
14
+ "sap/ui/events/KeyCodes",
15
+ // jQuery Plugin "firstFocusableDomRef", "lastFocusableDomRef"
16
+ "sap/ui/dom/jquery/Focusable"
14
17
  ], function (
15
18
  Control,
16
19
  InvisibleText,
@@ -18,7 +21,8 @@ sap.ui.define([
18
21
  Library,
19
22
  CardBadgeEnabler,
20
23
  library,
21
- Log
24
+ Log,
25
+ KeyCodes
22
26
  ) {
23
27
  "use strict";
24
28
 
@@ -37,7 +41,7 @@ sap.ui.define([
37
41
  * @extends sap.ui.core.Control
38
42
  *
39
43
  * @author SAP SE
40
- * @version 1.133.2
44
+ * @version 1.135.0
41
45
  *
42
46
  * @constructor
43
47
  * @public
@@ -48,7 +52,8 @@ sap.ui.define([
48
52
  library: "sap.f",
49
53
  interfaces: [
50
54
  "sap.f.ICard",
51
- "sap.m.IBadge"
55
+ "sap.m.IBadge",
56
+ "sap.f.IGridContainerItem"
52
57
  ],
53
58
  properties: {
54
59
 
@@ -63,7 +68,10 @@ sap.ui.define([
63
68
  height: {type: "sap.ui.core.CSSSize", group: "Appearance", defaultValue: "auto"},
64
69
 
65
70
  /**
66
- * Defines the role of the Card Header.
71
+ * Defines the accessibility role of the control.
72
+ *
73
+ * **Note:** When the control is placed inside a <code>sap.f.GridContainer</code>,
74
+ * its accessibility role is overridden by the accessibility role specified by the <code>sap.f.GridContainer</code>.
67
75
  *
68
76
  * @experimental since 1.131
69
77
  */
@@ -92,7 +100,9 @@ sap.ui.define([
92
100
  events: {
93
101
  /**
94
102
  * Fired when action is added on card level.
95
- * Note: Can be used only if <code>semanticRole</code> is <code>sap.f.cards.SemanticRole.ListItem</code>.
103
+ *
104
+ * **Note**: Can be used only if <code>semanticRole</code> is <code>sap.f.cards.SemanticRole.ListItem</code>
105
+ * or the control is placed inside a <code>sap.f.GridContainer</code>.
96
106
  * @experimental since 1.131
97
107
  */
98
108
  press: {}
@@ -118,6 +128,14 @@ sap.ui.define([
118
128
  this._ariaText = new InvisibleText({id: this.getId() + "-ariaText"});
119
129
  this._ariaText.setText(this._oRb.getText("ARIA_ROLEDESCRIPTION_CARD"));
120
130
 
131
+ this._describedByInteractiveText = new InvisibleText({ id: this.getId() + "-describedByInteractive" });
132
+ this._describedByInteractiveText.setText(this._oRb.getText("ARIA_ACTIVATE_CARD"));
133
+
134
+ this._describedByCardTypeText = new InvisibleText({ id: this.getId() + "-describedByCardTypeText"});
135
+ this._describedByCardTypeText.setText(this._oRb.getText("ARIA_ROLEDESCRIPTION_CARD"));
136
+
137
+ this._sGridItemRole = null;
138
+
121
139
  this.initCardBadgeEnablement();
122
140
  };
123
141
 
@@ -135,6 +153,17 @@ sap.ui.define([
135
153
  this._ariaText = null;
136
154
  }
137
155
 
156
+ this._describedByInteractiveText.destroy();
157
+ this._describedByInteractiveText = null;
158
+
159
+ this._describedByCardTypeText.destroy();
160
+ this._describedByCardTypeText = null;
161
+
162
+ if (this._invisibleTitle) {
163
+ this._invisibleTitle.destroy();
164
+ this._invisibleTitle = null;
165
+ }
166
+
138
167
  this.destroyCardBadgeEnablement();
139
168
  };
140
169
 
@@ -205,7 +234,7 @@ sap.ui.define([
205
234
  * @protected
206
235
  */
207
236
  CardBase.prototype.getFocusDomRef = function () {
208
- if (this.isInteractive() && this.getSemanticRole() === SemanticRole.ListItem) {
237
+ if (this.isRoleListItem()) {
209
238
  return this.getDomRef();
210
239
  }
211
240
 
@@ -228,7 +257,10 @@ sap.ui.define([
228
257
  this._hideBadge();
229
258
  };
230
259
 
231
- CardBase.prototype.onfocusin = function () {
260
+ CardBase.prototype.onfocusin = function (oEvent) {
261
+ if (oEvent.target !== this.getDomRef()) {
262
+ this.oLastFocusedElement = oEvent.target;
263
+ }
232
264
  this._startBadgeHiding();
233
265
  };
234
266
 
@@ -259,26 +291,42 @@ sap.ui.define([
259
291
  CardBase.prototype._getAriaLabelledIds = function () {
260
292
  var oHeader = this.getCardHeader();
261
293
  const sBlockingMessageAriaLabelsIds = this._getBlockingMessageAriaLabelledByIds();
262
-
263
- if (oHeader) {
264
- if (this._isInsideGridContainer()) {
265
- if (sBlockingMessageAriaLabelsIds) {
266
- return oHeader._getAriaLabelledBy() + " " + sBlockingMessageAriaLabelsIds;
267
- }
268
- return oHeader._getAriaLabelledBy();
269
- }
270
-
294
+ if (oHeader && oHeader.getVisible()) {
271
295
  if (oHeader._getTitle && oHeader._getTitle()) {
272
296
  if (sBlockingMessageAriaLabelsIds) {
273
297
  return oHeader._getTitle().getId() + " " + sBlockingMessageAriaLabelsIds;
274
298
  }
275
299
  return oHeader._getTitle().getId();
276
300
  }
301
+ } else if (oHeader?.getTitle()) {
302
+ if (!this._invisibleTitle) {
303
+ this._invisibleTitle = new InvisibleText({ id: this.getId() + "-invisibleTitle" });
304
+ }
305
+ this._invisibleTitle.setText(oHeader.getTitle());
306
+
307
+ return this._invisibleTitle.getId();
277
308
  }
278
309
 
279
310
  return this._ariaText.getId();
280
311
  };
281
312
 
313
+ CardBase.prototype._getAriaDescribedByIds = function () {
314
+ const bHasCardBadgeCustomData = this._getCardBadgeCustomData().length > 0;
315
+ const aIds = [];
316
+
317
+ aIds.push(this._describedByCardTypeText.getId());
318
+
319
+ if (this.isInteractive() && this.isRoleListItem()) {
320
+ aIds.push(this._describedByInteractiveText.getId());
321
+ }
322
+
323
+ if (bHasCardBadgeCustomData) {
324
+ aIds.push(this._getInvisibleCardBadgeText().getId());
325
+ }
326
+
327
+ return aIds.join(" ");
328
+ };
329
+
282
330
  /**
283
331
  * Gets the ids of the elements in the illustrated message that have to be labelled.
284
332
  *
@@ -299,22 +347,45 @@ sap.ui.define([
299
347
  return sTitleId;
300
348
  };
301
349
 
302
- /**
303
- * Listens for ontap event
304
- *
305
- * @param {object} oEvent event
306
- */
307
- CardBase.prototype.ontap = function (oEvent) {
308
- this._handleTapOrSelect(oEvent);
350
+ CardBase.prototype.onkeydown = function (oEvent) {
351
+
352
+ if (oEvent.code === "F7") {
353
+ this._handleF7Key(oEvent);
354
+ return;
355
+ }
356
+
357
+ if (oEvent.target === this.getDomRef() && !oEvent.ctrlKey && !oEvent.metaKey) {
358
+ if (oEvent.which === KeyCodes.ENTER) {
359
+ this._handleTap(oEvent);
360
+ } else if (oEvent.which === KeyCodes.SPACE) {
361
+ // To prevent the browser scrolling.
362
+ oEvent.preventDefault();
363
+ } else if (oEvent.which === KeyCodes.SHIFT || oEvent.which === KeyCodes.ESCAPE) {
364
+ this._bPressedEscapeOrShift = true;
365
+ }
366
+ }
367
+ };
368
+
369
+ CardBase.prototype.onkeyup = function (oEvent) {
370
+ if (oEvent.target === this.getDomRef()) {
371
+ if (oEvent.which === KeyCodes.SPACE && !this._bPressedEscapeOrShift) {
372
+ this._handleTap(oEvent);
373
+ } else if (oEvent.which === KeyCodes.SHIFT || oEvent.which === KeyCodes.ESCAPE) {
374
+ this._bPressedEscapeOrShift = false;
375
+ }
376
+ }
309
377
  };
310
378
 
311
379
  /**
312
- * Listens for onsapselect event
380
+ * Listens for ontap event
313
381
  *
314
382
  * @param {object} oEvent event
315
383
  */
316
- CardBase.prototype.onsapselect = function (oEvent) {
317
- this._handleTapOrSelect(oEvent);
384
+ CardBase.prototype.ontap = function (oEvent) {
385
+ if (this.isMouseInteractionDisabled()) {
386
+ return;
387
+ }
388
+ this._handleTap(oEvent);
318
389
  };
319
390
 
320
391
  /**
@@ -322,8 +393,10 @@ sap.ui.define([
322
393
  *
323
394
  * @param {object} oEvent event
324
395
  */
325
- CardBase.prototype._handleTapOrSelect = function (oEvent) {
326
- if (!this.isInteractive() || oEvent.isMarked() || this.getSemanticRole() !== SemanticRole.ListItem) {
396
+ CardBase.prototype._handleTap = function (oEvent) {
397
+ if (!this.isInteractive() ||
398
+ oEvent.isMarked() ||
399
+ !this.isRoleListItem()) {
327
400
  return;
328
401
  }
329
402
 
@@ -334,17 +407,34 @@ sap.ui.define([
334
407
  this.firePress({
335
408
  originalEvent: oEvent
336
409
  });
410
+
337
411
  oEvent.preventDefault();
412
+ oEvent.stopPropagation();
338
413
  };
339
414
 
340
415
  /**
341
- * Returns if the control is inside a sap.f.GridContainer
342
- *
416
+ * Handler for F7 key
417
+ * @param {Object} oEvent - key object
343
418
  * @private
344
419
  */
345
- CardBase.prototype._isInsideGridContainer = function() {
346
- var oParent = this.getParent();
347
- return oParent && oParent.isA("sap.f.GridContainer");
420
+ CardBase.prototype._handleF7Key = function (oEvent) {
421
+ if (!this.isInteractive() || !this.isRoleListItem()) {
422
+ return;
423
+ }
424
+
425
+ const oTarget = oEvent.target;
426
+ const $FirstFocusableItem = this.$().firstFocusableDomRef();
427
+
428
+ if (oTarget !== this.getDomRef()) {
429
+ this.getDomRef().focus();
430
+ } else if (this.oLastFocusedElement && !$FirstFocusableItem.classList.contains("sapMListUl")) { // to prevent the list from getting the F7 event and trap the focus
431
+ this.oLastFocusedElement.focus();
432
+ } else if ($FirstFocusableItem) {
433
+ $FirstFocusableItem.focus();
434
+ }
435
+
436
+ oEvent.preventDefault();
437
+ oEvent.stopPropagation();
348
438
  };
349
439
 
350
440
  /**
@@ -360,14 +450,58 @@ sap.ui.define([
360
450
  return null;
361
451
  };
362
452
 
453
+ /**
454
+ * Checks if the card is interactive.
455
+ * @private
456
+ * @ui5-restricted sap.f.CardRenderer
457
+ * @returns {boolean} Whether the card is interactive.
458
+ */
363
459
  CardBase.prototype.isInteractive = function() {
364
460
  const bIsInteractive = this.hasListeners("press");
365
461
 
366
- if (bIsInteractive && this.getSemanticRole() !== SemanticRole.ListItem) {
367
- Log.error("The full card cannot be interactive if the 'semanticRole' is not 'ListItem'", this);
462
+ if (bIsInteractive && !this.isRoleListItem()) {
463
+ Log.error("The full card cannot be interactive if the 'semanticRole' is not 'ListItem' or the control is not placed inside a sap.f.GridContainer", this);
368
464
  }
369
465
  return bIsInteractive;
370
466
  };
371
467
 
468
+ /**
469
+ * Checks if the card should be fully interactive with the mouse.
470
+ * @private
471
+ * @ui5-restricted sap.f.CardRenderer
472
+ * @returns {boolean} False if the card should not be fully interactive with the mouse.
473
+ */
474
+ CardBase.prototype.isMouseInteractionDisabled = function() {
475
+ return false;
476
+ };
477
+
478
+ /**
479
+ * Sets the accessibility role for the <code>sap.f.GridContainer</code> item.
480
+ *
481
+ * **Note:** This method is automatically called by the <code>sap.f.GridContainer</code> control.
482
+ *
483
+ * @param {string} sRole The accessibility role for the <code>sap.f.GridContainer</code> item
484
+ * @private
485
+ * @ui5-restricted sap.f.GridContainer
486
+ *
487
+ */
488
+ CardBase.prototype.setGridItemRole = function (sRole) {
489
+ this._sGridItemRole = sRole;
490
+ };
491
+
492
+ /**
493
+ * Returns the accessibility role for the <code>sap.f.GridContainer</code> item.
494
+ *
495
+ * @returns {string} The accessibility role for the <code>sap.f.GridContainer</code> item
496
+ * @public
497
+ */
498
+ CardBase.prototype.getGridItemRole = function () {
499
+ return this._sGridItemRole;
500
+ };
501
+
502
+ CardBase.prototype.isRoleListItem = function () {
503
+ return (this.getSemanticRole() === SemanticRole.ListItem) || this.getGridItemRole();
504
+ };
505
+
372
506
  return CardBase;
373
507
  });
@@ -13,8 +13,7 @@ sap.ui.define([
13
13
  library
14
14
  ) {
15
15
  "use strict";
16
- var HeaderPosition = library.cards.HeaderPosition,
17
- SemanticRole = library.cards.SemanticRole;
16
+ var HeaderPosition = library.cards.HeaderPosition;
18
17
 
19
18
  /**
20
19
  * <code>Card</code> renderer.
@@ -62,6 +61,13 @@ sap.ui.define([
62
61
 
63
62
  oRm.renderControl(oCard._ariaText);
64
63
  oRm.renderControl(oCard._ariaContentText);
64
+
65
+ oRm.renderControl(oCard._describedByCardTypeText);
66
+ oRm.renderControl(oCard._describedByInteractiveText);
67
+ if (oCard._invisibleTitle) {
68
+ oRm.renderControl(oCard._invisibleTitle);
69
+ }
70
+
65
71
  if (bHasCardBadgeCustomData) {
66
72
  oRm.renderControl(oCard._getInvisibleCardBadgeText());
67
73
  }
@@ -84,7 +90,7 @@ sap.ui.define([
84
90
  bHasContent = !!oContent,
85
91
  bCardHeaderBottom = bHasHeader && oCard.getCardHeaderPosition() === HeaderPosition.Bottom,
86
92
  sTooltip = oCard.getTooltip_AsString(),
87
- bHasCardBadgeCustomData = oCard._getCardBadgeCustomData().length > 0;
93
+ sAriaRole = oCard.getGridItemRole() || oCard.getSemanticRole().toLowerCase();
88
94
 
89
95
  oRm.class("sapFCard")
90
96
  .style("width", oCard.getWidth());
@@ -102,13 +108,16 @@ sap.ui.define([
102
108
  oRm.class("sapFCardSectionInteractive");
103
109
  }
104
110
 
105
-
106
- if (oCard.getSemanticRole() === SemanticRole.ListItem) {
111
+ if (oCard.isRoleListItem()) {
107
112
  oRm.class("sapFCardFocus");
108
113
  oRm.attr("tabindex", "0");
109
114
 
110
115
  if (bIsInteractive) {
111
116
  oRm.class("sapFCardInteractive");
117
+
118
+ if (oCard.isMouseInteractionDisabled()) {
119
+ oRm.class("sapFCardDisableMouseInteraction");
120
+ }
112
121
  }
113
122
  }
114
123
 
@@ -126,10 +135,9 @@ sap.ui.define([
126
135
 
127
136
  //Accessibility state
128
137
  oRm.accessibilityState(oCard, {
129
- // TODO if role is not only used with accessibility values, this should be changed
130
- role: oCard.getSemanticRole().toLowerCase(),
138
+ role: sAriaRole,
131
139
  labelledby: { value: oCard._getAriaLabelledIds(), append: true },
132
- describedby: {value: bHasCardBadgeCustomData ? oCard._getInvisibleCardBadgeText().getId() : undefined}
140
+ describedby: { value: oCard._getAriaDescribedByIds(), append: true }
133
141
  });
134
142
  };
135
143
 
@@ -118,7 +118,7 @@ sap.ui.define([
118
118
  * @extends sap.ui.core.Control
119
119
  *
120
120
  * @author SAP SE
121
- * @version 1.133.2
121
+ * @version 1.135.0
122
122
  *
123
123
  * @constructor
124
124
  * @public
@@ -2502,6 +2502,17 @@ sap.ui.define([
2502
2502
  return {};
2503
2503
  };
2504
2504
 
2505
+ DynamicPage.prototype._getAccessibilityStateTitle = function () {
2506
+ var oInfo = this._formatLandmarkInfo(this.getLandmarkInfo(), "Header"),
2507
+ oTitle = this.getTitle();
2508
+
2509
+ if (oTitle) {
2510
+ oInfo.label = oTitle._getTitleText() || oInfo.label;
2511
+ }
2512
+
2513
+ return oInfo;
2514
+ };
2515
+
2505
2516
  /**
2506
2517
  * Returns HTML tag of the page header.
2507
2518
  *
@@ -23,7 +23,7 @@ sap.ui.define(['sap/ui/core/Element', './library'],
23
23
  * @extends sap.ui.core.Element
24
24
  *
25
25
  * @author SAP SE
26
- * @version 1.133.2
26
+ * @version 1.135.0
27
27
  *
28
28
  * @constructor
29
29
  * @public
@@ -64,7 +64,7 @@ sap.ui.define([
64
64
  * @extends sap.ui.core.Control
65
65
  *
66
66
  * @author SAP SE
67
- * @version 1.133.2
67
+ * @version 1.135.0
68
68
  *
69
69
  * @constructor
70
70
  * @public
@@ -60,7 +60,7 @@ sap.ui.define(["sap/ui/Device"], function (Device) {
60
60
  if (!bHeaderHasContent) {
61
61
  oRm.class("sapFDynamicPageTitleOnly");
62
62
  }
63
- oRm.accessibilityState(oDynamicPage, oDynamicPage._formatLandmarkInfo(oLandmarkInfo, "Header"));
63
+ oRm.accessibilityState(oDynamicPage, oDynamicPage._getAccessibilityStateTitle());
64
64
  oRm.attr("data-sap-ui-customfastnavgroup", true);
65
65
 
66
66
  oRm.openEnd();
@@ -95,7 +95,7 @@ sap.ui.define([
95
95
  * @extends sap.ui.core.Control
96
96
  *
97
97
  * @author SAP SE
98
- * @version 1.133.2
98
+ * @version 1.135.0
99
99
  *
100
100
  * @constructor
101
101
  * @public
@@ -378,6 +378,8 @@ sap.ui.define([
378
378
  DynamicPageTitle.TOGGLE_HEADER_TEXT_ID = InvisibleText.getStaticId("sap.f", "TOGGLE_HEADER");
379
379
  DynamicPageTitle.DEFAULT_HEADER_TEXT_ID = InvisibleText.getStaticId("sap.f", "DEFAULT_HEADER_TEXT");
380
380
 
381
+ DynamicPageTitle.KNOWN_HEADING_CONTROL_CLASS_NAMES = ["sap.m.Title", "sap.m.Text", "sap.m.FormattedText", "sap.m.Label"];
382
+
381
383
  /**
382
384
  * Retrieves the resource bundle for the <code>sap.f</code> library.
383
385
  * @returns {Object} the resource bundle object
@@ -414,6 +416,20 @@ sap.ui.define([
414
416
  return typeof oObject === "function";
415
417
  }
416
418
 
419
+ function findTitleInFlexBox(oHeading) {
420
+ var oTitle = null;
421
+
422
+ for (var item of oHeading.getItems()) {
423
+ if (item.isA("sap.m.Title")) {
424
+ return item;
425
+ } else if (item.isA("sap.m.FlexBox")) {
426
+ oTitle = findTitleInFlexBox(item);
427
+ }
428
+ }
429
+
430
+ return oTitle;
431
+ }
432
+
417
433
  /* ========== LIFECYCLE METHODS ========== */
418
434
  DynamicPageTitle.prototype.init = function () {
419
435
  this._bExpandedState = true;
@@ -704,6 +720,23 @@ sap.ui.define([
704
720
 
705
721
  /* ========== PRIVATE METHODS ========== */
706
722
 
723
+ DynamicPageTitle.prototype._getTitleText = function() {
724
+ var oHeading = this.getHeading(),
725
+ sClassName = oHeading && oHeading.getMetadata().getName(),
726
+ oTitle,
727
+ sTitleText;
728
+
729
+ if (DynamicPageTitle.KNOWN_HEADING_CONTROL_CLASS_NAMES.indexOf(sClassName) > -1) {
730
+ sTitleText = oHeading.getText();
731
+ } else if (oHeading?.isA("sap.m.FlexBox")) {
732
+ oTitle = findTitleInFlexBox(oHeading);
733
+ sTitleText = oTitle?.getText();
734
+ }
735
+
736
+ return sTitleText;
737
+ };
738
+
739
+
707
740
  /**
708
741
  * Creates and caches an instance of the {@link sap.ui.core.InvisibleText} control for the specified aria label.
709
742
  * @param {string} sId The ID for the invisible text control.
@@ -108,7 +108,7 @@ sap.ui.define([
108
108
  *
109
109
  * @extends sap.ui.core.Control
110
110
  * @author SAP SE
111
- * @version 1.133.2
111
+ * @version 1.135.0
112
112
  *
113
113
  * @constructor
114
114
  * @public