@ui5/webcomponents 2.7.0-rc.2 → 2.7.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 (524) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/cypress/specs/{Button.cy.ts → Button.cy.tsx} +42 -37
  3. package/cypress/specs/CalendarLegend.cy.tsx +77 -0
  4. package/cypress/specs/{Card.cy.ts → Card.cy.tsx} +28 -28
  5. package/cypress/specs/ColorPalette.cy.tsx +213 -0
  6. package/cypress/specs/{ColorPicker.cy.ts → ColorPicker.cy.tsx} +7 -9
  7. package/cypress/specs/{ComboBox.cy.ts → ComboBox.cy.tsx} +9 -10
  8. package/cypress/specs/{Dialog.cy.ts → Dialog.cy.tsx} +15 -13
  9. package/cypress/specs/{ExpandableText.cy.ts → ExpandableText.cy.tsx} +25 -22
  10. package/cypress/specs/{F6.cy.ts → F6.cy.tsx} +346 -301
  11. package/cypress/specs/{Form.cy.ts → Form.cy.tsx} +326 -324
  12. package/cypress/specs/{FormSupport.cy.ts → FormSupport.cy.tsx} +270 -285
  13. package/cypress/specs/{Input.cy.ts → Input.cy.tsx} +38 -40
  14. package/cypress/specs/{Label.cy.ts → Label.cy.tsx} +62 -46
  15. package/cypress/specs/{Link.cy.ts → Link.cy.tsx} +2 -3
  16. package/cypress/specs/{List.cy.ts → List.cy.tsx} +34 -36
  17. package/cypress/specs/{LitKeyFunction.cy.ts → LitKeyFunction.cy.tsx} +10 -9
  18. package/cypress/specs/{Menu.cy.ts → Menu.cy.tsx} +182 -102
  19. package/cypress/specs/MessageStrip.cy.tsx +164 -0
  20. package/cypress/specs/{MultiComboBox.cy.ts → MultiComboBox.cy.tsx} +16 -18
  21. package/cypress/specs/{MultiInput.cy.ts → MultiInput.cy.tsx} +15 -14
  22. package/cypress/specs/{Popover.cy.ts → Popover.cy.tsx} +28 -25
  23. package/cypress/specs/RTL.cy.tsx +18 -0
  24. package/cypress/specs/{RatingIndicator.cy.ts → RatingIndicator.cy.tsx} +28 -16
  25. package/cypress/specs/{ResponsivePopover.mobile.cy.ts → ResponsivePopover.mobile.cy.tsx} +35 -16
  26. package/cypress/specs/{Select.cy.ts → Select.cy.tsx} +14 -16
  27. package/cypress/specs/{StepInput.cy.ts → StepInput.cy.tsx} +4 -6
  28. package/cypress/specs/Table.cy.tsx +665 -0
  29. package/cypress/specs/{TableDragAndDrop.cy.ts → TableDragAndDrop.cy.tsx} +27 -24
  30. package/cypress/specs/{TableGrowing.cy.ts → TableGrowing.cy.tsx} +83 -75
  31. package/cypress/specs/TableLoading.cy.tsx +48 -0
  32. package/cypress/specs/{TableRowActions.cy.ts → TableRowActions.cy.tsx} +67 -61
  33. package/cypress/specs/{TableVirtualizer.cy.ts → TableVirtualizer.cy.tsx} +12 -15
  34. package/cypress/specs/{Tag.cy.ts → Tag.cy.tsx} +53 -31
  35. package/cypress/specs/{Text.cy.ts → Text.cy.tsx} +6 -7
  36. package/cypress/specs/{TextArea.cy.ts → TextArea.cy.tsx} +62 -49
  37. package/cypress/specs/Title.cy.tsx +36 -0
  38. package/cypress/specs/{Toast.cy.ts → Toast.cy.tsx} +17 -16
  39. package/cypress/specs/Tokenizer.cy.tsx +173 -0
  40. package/cypress/specs/{Toolbar.cy.ts → Toolbar.cy.tsx} +61 -63
  41. package/cypress/specs/{Tree.cy.ts → Tree.cy.tsx} +13 -12
  42. package/cypress/specs/base/{AccessibilityTextsHelper.cy.ts → AccessibilityTextsHelper.cy.tsx} +52 -41
  43. package/cypress/specs/base/{Events.cy.ts → Events.cy.tsx} +59 -57
  44. package/cypress/specs/base/{IconCollection.cy.ts → IconCollection.cy.tsx} +4 -4
  45. package/cypress/specs/base/{IgnoreCustomElements.cy.ts → IgnoreCustomElements.cy.tsx} +15 -12
  46. package/cypress/specs/base/Tooltips.cy.tsx +62 -0
  47. package/cypress/support/commands/ColorPalette.commands.ts +21 -3
  48. package/cypress/support/commands/Menu.commands.ts +7 -7
  49. package/cypress/support/commands.ts +1 -0
  50. package/cypress/tsconfig.json +2 -0
  51. package/dist/.tsbuildinfo +1 -1
  52. package/dist/Calendar.d.ts +1 -0
  53. package/dist/Calendar.js +8 -3
  54. package/dist/Calendar.js.map +1 -1
  55. package/dist/DayPicker.d.ts +2 -0
  56. package/dist/DayPicker.js +12 -3
  57. package/dist/DayPicker.js.map +1 -1
  58. package/dist/DayPickerTemplate.js +1 -1
  59. package/dist/DayPickerTemplate.js.map +1 -1
  60. package/dist/FileUploader.js +1 -1
  61. package/dist/FileUploader.js.map +1 -1
  62. package/dist/List.js +4 -0
  63. package/dist/List.js.map +1 -1
  64. package/dist/MenuItem.d.ts +5 -5
  65. package/dist/MenuItem.js.map +1 -1
  66. package/dist/MenuItemTemplate.js +1 -1
  67. package/dist/MenuItemTemplate.js.map +1 -1
  68. package/dist/MessageStrip.js +1 -3
  69. package/dist/MessageStrip.js.map +1 -1
  70. package/dist/Select.d.ts +1 -0
  71. package/dist/Select.js +3 -0
  72. package/dist/Select.js.map +1 -1
  73. package/dist/SelectPopoverTemplate.js +1 -1
  74. package/dist/SelectPopoverTemplate.js.map +1 -1
  75. package/dist/SpecialCalendarDate.d.ts +6 -0
  76. package/dist/SpecialCalendarDate.js +9 -0
  77. package/dist/SpecialCalendarDate.js.map +1 -1
  78. package/dist/TableVirtualizer.js +4 -2
  79. package/dist/TableVirtualizer.js.map +1 -1
  80. package/dist/Tokenizer.js +1 -1
  81. package/dist/Tokenizer.js.map +1 -1
  82. package/dist/YearPicker.js +2 -2
  83. package/dist/YearPicker.js.map +1 -1
  84. package/dist/css/themes/Avatar.css +1 -1
  85. package/dist/css/themes/AvatarGroup.css +1 -1
  86. package/dist/css/themes/Bar.css +1 -1
  87. package/dist/css/themes/Breadcrumbs.css +1 -1
  88. package/dist/css/themes/BusyIndicator.css +1 -1
  89. package/dist/css/themes/Button.css +1 -1
  90. package/dist/css/themes/ButtonBadge.css +1 -1
  91. package/dist/css/themes/Calendar.css +1 -1
  92. package/dist/css/themes/CalendarHeader.css +1 -1
  93. package/dist/css/themes/CalendarLegend.css +1 -1
  94. package/dist/css/themes/CalendarLegendItem.css +1 -1
  95. package/dist/css/themes/Card.css +1 -1
  96. package/dist/css/themes/CardHeader.css +1 -1
  97. package/dist/css/themes/Carousel.css +1 -1
  98. package/dist/css/themes/CheckBox.css +1 -1
  99. package/dist/css/themes/ColorPalette.css +1 -1
  100. package/dist/css/themes/ColorPaletteItem.css +1 -1
  101. package/dist/css/themes/ColorPalettePopover.css +1 -1
  102. package/dist/css/themes/ColorPicker.css +1 -1
  103. package/dist/css/themes/ComboBox.css +1 -1
  104. package/dist/css/themes/ComboBoxItem.css +1 -1
  105. package/dist/css/themes/DatePicker.css +1 -1
  106. package/dist/css/themes/DateTimePickerPopover.css +1 -1
  107. package/dist/css/themes/DayPicker.css +1 -1
  108. package/dist/css/themes/Dialog.css +1 -1
  109. package/dist/css/themes/FileUploader.css +1 -1
  110. package/dist/css/themes/Form.css +1 -1
  111. package/dist/css/themes/FormItem.css +1 -1
  112. package/dist/css/themes/FormItemSpan.css +1 -1
  113. package/dist/css/themes/GrowingButton.css +1 -1
  114. package/dist/css/themes/Icon.css +1 -1
  115. package/dist/css/themes/Input.css +1 -1
  116. package/dist/css/themes/InputIcon.css +1 -1
  117. package/dist/css/themes/InputSharedStyles.css +1 -1
  118. package/dist/css/themes/Link.css +1 -1
  119. package/dist/css/themes/List.css +1 -1
  120. package/dist/css/themes/ListItem.css +1 -1
  121. package/dist/css/themes/ListItemBase.css +1 -1
  122. package/dist/css/themes/ListItemCustom.css +1 -1
  123. package/dist/css/themes/ListItemGroup.css +1 -1
  124. package/dist/css/themes/ListItemGroupHeader.css +1 -1
  125. package/dist/css/themes/ListItemIcon.css +1 -1
  126. package/dist/css/themes/Menu.css +1 -1
  127. package/dist/css/themes/MenuItem.css +1 -1
  128. package/dist/css/themes/MessageStrip.css +1 -1
  129. package/dist/css/themes/MonthPicker.css +1 -1
  130. package/dist/css/themes/MultiComboBox.css +1 -1
  131. package/dist/css/themes/MultiComboBoxItem.css +1 -1
  132. package/dist/css/themes/MultiComboBoxPopover.css +1 -1
  133. package/dist/css/themes/MultiInput.css +1 -1
  134. package/dist/css/themes/OptionBase.css +1 -1
  135. package/dist/css/themes/Panel.css +1 -1
  136. package/dist/css/themes/Popover.css +1 -1
  137. package/dist/css/themes/PopupsCommon.css +1 -1
  138. package/dist/css/themes/ProgressIndicator.css +1 -1
  139. package/dist/css/themes/RadioButton.css +1 -1
  140. package/dist/css/themes/RangeSlider.css +1 -1
  141. package/dist/css/themes/RatingIndicator.css +1 -1
  142. package/dist/css/themes/ResponsivePopover.css +1 -1
  143. package/dist/css/themes/ResponsivePopoverCommon.css +1 -1
  144. package/dist/css/themes/SegmentedButton.css +1 -1
  145. package/dist/css/themes/SegmentedButtonItem.css +1 -1
  146. package/dist/css/themes/Select.css +1 -1
  147. package/dist/css/themes/SliderBase.css +1 -1
  148. package/dist/css/themes/SplitButton.css +1 -1
  149. package/dist/css/themes/StepInput.css +1 -1
  150. package/dist/css/themes/SuggestionItem.css +1 -1
  151. package/dist/css/themes/SuggestionItemCustom.css +1 -1
  152. package/dist/css/themes/Switch.css +1 -1
  153. package/dist/css/themes/TabContainer.css +1 -1
  154. package/dist/css/themes/TabInOverflow.css +1 -1
  155. package/dist/css/themes/TabInStrip.css +1 -1
  156. package/dist/css/themes/TabSemanticIcon.css +1 -1
  157. package/dist/css/themes/TabSeparatorInOverflow.css +1 -1
  158. package/dist/css/themes/Table.css +1 -1
  159. package/dist/css/themes/TableCellBase.css +1 -1
  160. package/dist/css/themes/TableHeaderRow.css +1 -1
  161. package/dist/css/themes/TableRow.css +1 -1
  162. package/dist/css/themes/TableRowActionBase.css +1 -1
  163. package/dist/css/themes/TableRowBase.css +1 -1
  164. package/dist/css/themes/Tag.css +1 -1
  165. package/dist/css/themes/Text.css +1 -1
  166. package/dist/css/themes/TextArea.css +1 -1
  167. package/dist/css/themes/TimePicker.css +1 -1
  168. package/dist/css/themes/Toast.css +1 -1
  169. package/dist/css/themes/ToggleButton.css +1 -1
  170. package/dist/css/themes/Token.css +1 -1
  171. package/dist/css/themes/Tokenizer.css +1 -1
  172. package/dist/css/themes/TokenizerPopover.css +1 -1
  173. package/dist/css/themes/Toolbar.css +1 -1
  174. package/dist/css/themes/ToolbarPopover.css +1 -1
  175. package/dist/css/themes/TreeItem.css +1 -1
  176. package/dist/css/themes/ValueStateMessage.css +1 -1
  177. package/dist/css/themes/YearPicker.css +1 -1
  178. package/dist/css/themes/sap_fiori_3/parameters-bundle.css +1 -1
  179. package/dist/css/themes/sap_fiori_3_dark/parameters-bundle.css +1 -1
  180. package/dist/css/themes/sap_fiori_3_hcb/parameters-bundle.css +1 -1
  181. package/dist/css/themes/sap_fiori_3_hcw/parameters-bundle.css +1 -1
  182. package/dist/css/themes/sap_horizon/parameters-bundle.css +1 -1
  183. package/dist/css/themes/sap_horizon_dark/parameters-bundle.css +1 -1
  184. package/dist/css/themes/sap_horizon_hcb/parameters-bundle.css +1 -1
  185. package/dist/css/themes/sap_horizon_hcw/parameters-bundle.css +1 -1
  186. package/dist/custom-elements-internal.json +2 -2
  187. package/dist/custom-elements.json +1 -1
  188. package/dist/generated/assets/i18n/messagebundle_en_US_saprigi.json +1 -1
  189. package/dist/generated/assets/themes/sap_fiori_3/parameters-bundle.css.json +1 -1
  190. package/dist/generated/assets/themes/sap_fiori_3_dark/parameters-bundle.css.json +1 -1
  191. package/dist/generated/assets/themes/sap_fiori_3_hcb/parameters-bundle.css.json +1 -1
  192. package/dist/generated/assets/themes/sap_fiori_3_hcw/parameters-bundle.css.json +1 -1
  193. package/dist/generated/assets/themes/sap_horizon/parameters-bundle.css.json +1 -1
  194. package/dist/generated/assets/themes/sap_horizon_dark/parameters-bundle.css.json +1 -1
  195. package/dist/generated/assets/themes/sap_horizon_hcb/parameters-bundle.css.json +1 -1
  196. package/dist/generated/assets/themes/sap_horizon_hcw/parameters-bundle.css.json +1 -1
  197. package/dist/generated/templates/TableGrowingTemplate.lit.js +2 -3
  198. package/dist/generated/templates/TableGrowingTemplate.lit.js.map +1 -1
  199. package/dist/generated/themes/Avatar.css.d.ts +1 -1
  200. package/dist/generated/themes/Avatar.css.js +1 -1
  201. package/dist/generated/themes/Avatar.css.js.map +1 -1
  202. package/dist/generated/themes/AvatarGroup.css.d.ts +1 -1
  203. package/dist/generated/themes/AvatarGroup.css.js +1 -1
  204. package/dist/generated/themes/AvatarGroup.css.js.map +1 -1
  205. package/dist/generated/themes/Bar.css.d.ts +1 -1
  206. package/dist/generated/themes/Bar.css.js +1 -1
  207. package/dist/generated/themes/Bar.css.js.map +1 -1
  208. package/dist/generated/themes/Breadcrumbs.css.d.ts +1 -1
  209. package/dist/generated/themes/Breadcrumbs.css.js +1 -1
  210. package/dist/generated/themes/Breadcrumbs.css.js.map +1 -1
  211. package/dist/generated/themes/BusyIndicator.css.d.ts +1 -1
  212. package/dist/generated/themes/BusyIndicator.css.js +1 -1
  213. package/dist/generated/themes/BusyIndicator.css.js.map +1 -1
  214. package/dist/generated/themes/Button.css.d.ts +1 -1
  215. package/dist/generated/themes/Button.css.js +1 -1
  216. package/dist/generated/themes/Button.css.js.map +1 -1
  217. package/dist/generated/themes/ButtonBadge.css.d.ts +1 -1
  218. package/dist/generated/themes/ButtonBadge.css.js +1 -1
  219. package/dist/generated/themes/ButtonBadge.css.js.map +1 -1
  220. package/dist/generated/themes/Calendar.css.d.ts +1 -1
  221. package/dist/generated/themes/Calendar.css.js +1 -1
  222. package/dist/generated/themes/Calendar.css.js.map +1 -1
  223. package/dist/generated/themes/CalendarHeader.css.d.ts +1 -1
  224. package/dist/generated/themes/CalendarHeader.css.js +1 -1
  225. package/dist/generated/themes/CalendarHeader.css.js.map +1 -1
  226. package/dist/generated/themes/CalendarLegend.css.d.ts +1 -1
  227. package/dist/generated/themes/CalendarLegend.css.js +1 -1
  228. package/dist/generated/themes/CalendarLegend.css.js.map +1 -1
  229. package/dist/generated/themes/CalendarLegendItem.css.d.ts +1 -1
  230. package/dist/generated/themes/CalendarLegendItem.css.js +1 -1
  231. package/dist/generated/themes/CalendarLegendItem.css.js.map +1 -1
  232. package/dist/generated/themes/Card.css.d.ts +1 -1
  233. package/dist/generated/themes/Card.css.js +1 -1
  234. package/dist/generated/themes/Card.css.js.map +1 -1
  235. package/dist/generated/themes/CardHeader.css.d.ts +1 -1
  236. package/dist/generated/themes/CardHeader.css.js +1 -1
  237. package/dist/generated/themes/CardHeader.css.js.map +1 -1
  238. package/dist/generated/themes/Carousel.css.d.ts +1 -1
  239. package/dist/generated/themes/Carousel.css.js +1 -1
  240. package/dist/generated/themes/Carousel.css.js.map +1 -1
  241. package/dist/generated/themes/CheckBox.css.d.ts +1 -1
  242. package/dist/generated/themes/CheckBox.css.js +1 -1
  243. package/dist/generated/themes/CheckBox.css.js.map +1 -1
  244. package/dist/generated/themes/ColorPalette.css.d.ts +1 -1
  245. package/dist/generated/themes/ColorPalette.css.js +1 -1
  246. package/dist/generated/themes/ColorPalette.css.js.map +1 -1
  247. package/dist/generated/themes/ColorPaletteItem.css.d.ts +1 -1
  248. package/dist/generated/themes/ColorPaletteItem.css.js +1 -1
  249. package/dist/generated/themes/ColorPaletteItem.css.js.map +1 -1
  250. package/dist/generated/themes/ColorPalettePopover.css.d.ts +1 -1
  251. package/dist/generated/themes/ColorPalettePopover.css.js +1 -1
  252. package/dist/generated/themes/ColorPalettePopover.css.js.map +1 -1
  253. package/dist/generated/themes/ColorPicker.css.d.ts +1 -1
  254. package/dist/generated/themes/ColorPicker.css.js +1 -1
  255. package/dist/generated/themes/ColorPicker.css.js.map +1 -1
  256. package/dist/generated/themes/ComboBox.css.d.ts +1 -1
  257. package/dist/generated/themes/ComboBox.css.js +1 -1
  258. package/dist/generated/themes/ComboBox.css.js.map +1 -1
  259. package/dist/generated/themes/ComboBoxItem.css.d.ts +1 -1
  260. package/dist/generated/themes/ComboBoxItem.css.js +1 -1
  261. package/dist/generated/themes/ComboBoxItem.css.js.map +1 -1
  262. package/dist/generated/themes/DatePicker.css.d.ts +1 -1
  263. package/dist/generated/themes/DatePicker.css.js +1 -1
  264. package/dist/generated/themes/DatePicker.css.js.map +1 -1
  265. package/dist/generated/themes/DateTimePickerPopover.css.d.ts +1 -1
  266. package/dist/generated/themes/DateTimePickerPopover.css.js +1 -1
  267. package/dist/generated/themes/DateTimePickerPopover.css.js.map +1 -1
  268. package/dist/generated/themes/DayPicker.css.d.ts +1 -1
  269. package/dist/generated/themes/DayPicker.css.js +1 -1
  270. package/dist/generated/themes/DayPicker.css.js.map +1 -1
  271. package/dist/generated/themes/Dialog.css.d.ts +1 -1
  272. package/dist/generated/themes/Dialog.css.js +1 -1
  273. package/dist/generated/themes/Dialog.css.js.map +1 -1
  274. package/dist/generated/themes/FileUploader.css.d.ts +1 -1
  275. package/dist/generated/themes/FileUploader.css.js +1 -1
  276. package/dist/generated/themes/FileUploader.css.js.map +1 -1
  277. package/dist/generated/themes/Form.css.d.ts +1 -1
  278. package/dist/generated/themes/Form.css.js +1 -1
  279. package/dist/generated/themes/Form.css.js.map +1 -1
  280. package/dist/generated/themes/FormItem.css.d.ts +1 -1
  281. package/dist/generated/themes/FormItem.css.js +1 -1
  282. package/dist/generated/themes/FormItem.css.js.map +1 -1
  283. package/dist/generated/themes/FormItemSpan.css.d.ts +1 -1
  284. package/dist/generated/themes/FormItemSpan.css.js +1 -1
  285. package/dist/generated/themes/FormItemSpan.css.js.map +1 -1
  286. package/dist/generated/themes/GrowingButton.css.d.ts +1 -1
  287. package/dist/generated/themes/GrowingButton.css.js +1 -1
  288. package/dist/generated/themes/GrowingButton.css.js.map +1 -1
  289. package/dist/generated/themes/Icon.css.d.ts +1 -1
  290. package/dist/generated/themes/Icon.css.js +1 -1
  291. package/dist/generated/themes/Icon.css.js.map +1 -1
  292. package/dist/generated/themes/Input.css.d.ts +1 -1
  293. package/dist/generated/themes/Input.css.js +1 -1
  294. package/dist/generated/themes/Input.css.js.map +1 -1
  295. package/dist/generated/themes/InputIcon.css.d.ts +1 -1
  296. package/dist/generated/themes/InputIcon.css.js +1 -1
  297. package/dist/generated/themes/InputIcon.css.js.map +1 -1
  298. package/dist/generated/themes/InputSharedStyles.css.d.ts +1 -1
  299. package/dist/generated/themes/InputSharedStyles.css.js +1 -1
  300. package/dist/generated/themes/InputSharedStyles.css.js.map +1 -1
  301. package/dist/generated/themes/Link.css.d.ts +1 -1
  302. package/dist/generated/themes/Link.css.js +1 -1
  303. package/dist/generated/themes/Link.css.js.map +1 -1
  304. package/dist/generated/themes/List.css.d.ts +1 -1
  305. package/dist/generated/themes/List.css.js +1 -1
  306. package/dist/generated/themes/List.css.js.map +1 -1
  307. package/dist/generated/themes/ListItem.css.d.ts +1 -1
  308. package/dist/generated/themes/ListItem.css.js +1 -1
  309. package/dist/generated/themes/ListItem.css.js.map +1 -1
  310. package/dist/generated/themes/ListItemBase.css.d.ts +1 -1
  311. package/dist/generated/themes/ListItemBase.css.js +1 -1
  312. package/dist/generated/themes/ListItemBase.css.js.map +1 -1
  313. package/dist/generated/themes/ListItemCustom.css.d.ts +1 -1
  314. package/dist/generated/themes/ListItemCustom.css.js +1 -1
  315. package/dist/generated/themes/ListItemCustom.css.js.map +1 -1
  316. package/dist/generated/themes/ListItemGroup.css.d.ts +1 -1
  317. package/dist/generated/themes/ListItemGroup.css.js +1 -1
  318. package/dist/generated/themes/ListItemGroup.css.js.map +1 -1
  319. package/dist/generated/themes/ListItemGroupHeader.css.d.ts +1 -1
  320. package/dist/generated/themes/ListItemGroupHeader.css.js +1 -1
  321. package/dist/generated/themes/ListItemGroupHeader.css.js.map +1 -1
  322. package/dist/generated/themes/ListItemIcon.css.d.ts +1 -1
  323. package/dist/generated/themes/ListItemIcon.css.js +1 -1
  324. package/dist/generated/themes/ListItemIcon.css.js.map +1 -1
  325. package/dist/generated/themes/Menu.css.d.ts +1 -1
  326. package/dist/generated/themes/Menu.css.js +1 -1
  327. package/dist/generated/themes/Menu.css.js.map +1 -1
  328. package/dist/generated/themes/MenuItem.css.d.ts +1 -1
  329. package/dist/generated/themes/MenuItem.css.js +1 -1
  330. package/dist/generated/themes/MenuItem.css.js.map +1 -1
  331. package/dist/generated/themes/MessageStrip.css.d.ts +1 -1
  332. package/dist/generated/themes/MessageStrip.css.js +1 -1
  333. package/dist/generated/themes/MessageStrip.css.js.map +1 -1
  334. package/dist/generated/themes/MonthPicker.css.d.ts +1 -1
  335. package/dist/generated/themes/MonthPicker.css.js +1 -1
  336. package/dist/generated/themes/MonthPicker.css.js.map +1 -1
  337. package/dist/generated/themes/MultiComboBox.css.d.ts +1 -1
  338. package/dist/generated/themes/MultiComboBox.css.js +1 -1
  339. package/dist/generated/themes/MultiComboBox.css.js.map +1 -1
  340. package/dist/generated/themes/MultiComboBoxItem.css.d.ts +1 -1
  341. package/dist/generated/themes/MultiComboBoxItem.css.js +1 -1
  342. package/dist/generated/themes/MultiComboBoxItem.css.js.map +1 -1
  343. package/dist/generated/themes/MultiComboBoxPopover.css.d.ts +1 -1
  344. package/dist/generated/themes/MultiComboBoxPopover.css.js +1 -1
  345. package/dist/generated/themes/MultiComboBoxPopover.css.js.map +1 -1
  346. package/dist/generated/themes/MultiInput.css.d.ts +1 -1
  347. package/dist/generated/themes/MultiInput.css.js +1 -1
  348. package/dist/generated/themes/MultiInput.css.js.map +1 -1
  349. package/dist/generated/themes/OptionBase.css.d.ts +1 -1
  350. package/dist/generated/themes/OptionBase.css.js +1 -1
  351. package/dist/generated/themes/OptionBase.css.js.map +1 -1
  352. package/dist/generated/themes/Panel.css.d.ts +1 -1
  353. package/dist/generated/themes/Panel.css.js +1 -1
  354. package/dist/generated/themes/Panel.css.js.map +1 -1
  355. package/dist/generated/themes/Popover.css.d.ts +1 -1
  356. package/dist/generated/themes/Popover.css.js +1 -1
  357. package/dist/generated/themes/Popover.css.js.map +1 -1
  358. package/dist/generated/themes/PopupsCommon.css.d.ts +1 -1
  359. package/dist/generated/themes/PopupsCommon.css.js +1 -1
  360. package/dist/generated/themes/PopupsCommon.css.js.map +1 -1
  361. package/dist/generated/themes/ProgressIndicator.css.d.ts +1 -1
  362. package/dist/generated/themes/ProgressIndicator.css.js +1 -1
  363. package/dist/generated/themes/ProgressIndicator.css.js.map +1 -1
  364. package/dist/generated/themes/RadioButton.css.d.ts +1 -1
  365. package/dist/generated/themes/RadioButton.css.js +1 -1
  366. package/dist/generated/themes/RadioButton.css.js.map +1 -1
  367. package/dist/generated/themes/RangeSlider.css.d.ts +1 -1
  368. package/dist/generated/themes/RangeSlider.css.js +1 -1
  369. package/dist/generated/themes/RangeSlider.css.js.map +1 -1
  370. package/dist/generated/themes/RatingIndicator.css.d.ts +1 -1
  371. package/dist/generated/themes/RatingIndicator.css.js +1 -1
  372. package/dist/generated/themes/RatingIndicator.css.js.map +1 -1
  373. package/dist/generated/themes/ResponsivePopover.css.d.ts +1 -1
  374. package/dist/generated/themes/ResponsivePopover.css.js +1 -1
  375. package/dist/generated/themes/ResponsivePopover.css.js.map +1 -1
  376. package/dist/generated/themes/ResponsivePopoverCommon.css.d.ts +1 -1
  377. package/dist/generated/themes/ResponsivePopoverCommon.css.js +1 -1
  378. package/dist/generated/themes/ResponsivePopoverCommon.css.js.map +1 -1
  379. package/dist/generated/themes/SegmentedButton.css.d.ts +1 -1
  380. package/dist/generated/themes/SegmentedButton.css.js +1 -1
  381. package/dist/generated/themes/SegmentedButton.css.js.map +1 -1
  382. package/dist/generated/themes/SegmentedButtonItem.css.d.ts +1 -1
  383. package/dist/generated/themes/SegmentedButtonItem.css.js +1 -1
  384. package/dist/generated/themes/SegmentedButtonItem.css.js.map +1 -1
  385. package/dist/generated/themes/Select.css.d.ts +1 -1
  386. package/dist/generated/themes/Select.css.js +1 -1
  387. package/dist/generated/themes/Select.css.js.map +1 -1
  388. package/dist/generated/themes/SliderBase.css.d.ts +1 -1
  389. package/dist/generated/themes/SliderBase.css.js +1 -1
  390. package/dist/generated/themes/SliderBase.css.js.map +1 -1
  391. package/dist/generated/themes/SplitButton.css.d.ts +1 -1
  392. package/dist/generated/themes/SplitButton.css.js +1 -1
  393. package/dist/generated/themes/SplitButton.css.js.map +1 -1
  394. package/dist/generated/themes/StepInput.css.d.ts +1 -1
  395. package/dist/generated/themes/StepInput.css.js +1 -1
  396. package/dist/generated/themes/StepInput.css.js.map +1 -1
  397. package/dist/generated/themes/SuggestionItem.css.d.ts +1 -1
  398. package/dist/generated/themes/SuggestionItem.css.js +1 -1
  399. package/dist/generated/themes/SuggestionItem.css.js.map +1 -1
  400. package/dist/generated/themes/SuggestionItemCustom.css.d.ts +1 -1
  401. package/dist/generated/themes/SuggestionItemCustom.css.js +1 -1
  402. package/dist/generated/themes/SuggestionItemCustom.css.js.map +1 -1
  403. package/dist/generated/themes/Switch.css.d.ts +1 -1
  404. package/dist/generated/themes/Switch.css.js +1 -1
  405. package/dist/generated/themes/Switch.css.js.map +1 -1
  406. package/dist/generated/themes/TabContainer.css.d.ts +1 -1
  407. package/dist/generated/themes/TabContainer.css.js +1 -1
  408. package/dist/generated/themes/TabContainer.css.js.map +1 -1
  409. package/dist/generated/themes/TabInOverflow.css.d.ts +1 -1
  410. package/dist/generated/themes/TabInOverflow.css.js +1 -1
  411. package/dist/generated/themes/TabInOverflow.css.js.map +1 -1
  412. package/dist/generated/themes/TabInStrip.css.d.ts +1 -1
  413. package/dist/generated/themes/TabInStrip.css.js +1 -1
  414. package/dist/generated/themes/TabInStrip.css.js.map +1 -1
  415. package/dist/generated/themes/TabSemanticIcon.css.d.ts +1 -1
  416. package/dist/generated/themes/TabSemanticIcon.css.js +1 -1
  417. package/dist/generated/themes/TabSemanticIcon.css.js.map +1 -1
  418. package/dist/generated/themes/TabSeparatorInOverflow.css.d.ts +1 -1
  419. package/dist/generated/themes/TabSeparatorInOverflow.css.js +1 -1
  420. package/dist/generated/themes/TabSeparatorInOverflow.css.js.map +1 -1
  421. package/dist/generated/themes/Table.css.d.ts +1 -1
  422. package/dist/generated/themes/Table.css.js +1 -1
  423. package/dist/generated/themes/Table.css.js.map +1 -1
  424. package/dist/generated/themes/TableCellBase.css.d.ts +1 -1
  425. package/dist/generated/themes/TableCellBase.css.js +1 -1
  426. package/dist/generated/themes/TableCellBase.css.js.map +1 -1
  427. package/dist/generated/themes/TableHeaderRow.css.d.ts +1 -1
  428. package/dist/generated/themes/TableHeaderRow.css.js +1 -1
  429. package/dist/generated/themes/TableHeaderRow.css.js.map +1 -1
  430. package/dist/generated/themes/TableRow.css.d.ts +1 -1
  431. package/dist/generated/themes/TableRow.css.js +1 -1
  432. package/dist/generated/themes/TableRow.css.js.map +1 -1
  433. package/dist/generated/themes/TableRowActionBase.css.d.ts +1 -1
  434. package/dist/generated/themes/TableRowActionBase.css.js +1 -1
  435. package/dist/generated/themes/TableRowActionBase.css.js.map +1 -1
  436. package/dist/generated/themes/TableRowBase.css.d.ts +1 -1
  437. package/dist/generated/themes/TableRowBase.css.js +1 -1
  438. package/dist/generated/themes/TableRowBase.css.js.map +1 -1
  439. package/dist/generated/themes/Tag.css.d.ts +1 -1
  440. package/dist/generated/themes/Tag.css.js +1 -1
  441. package/dist/generated/themes/Tag.css.js.map +1 -1
  442. package/dist/generated/themes/Text.css.d.ts +1 -1
  443. package/dist/generated/themes/Text.css.js +1 -1
  444. package/dist/generated/themes/Text.css.js.map +1 -1
  445. package/dist/generated/themes/TextArea.css.d.ts +1 -1
  446. package/dist/generated/themes/TextArea.css.js +1 -1
  447. package/dist/generated/themes/TextArea.css.js.map +1 -1
  448. package/dist/generated/themes/TimePicker.css.d.ts +1 -1
  449. package/dist/generated/themes/TimePicker.css.js +1 -1
  450. package/dist/generated/themes/TimePicker.css.js.map +1 -1
  451. package/dist/generated/themes/Toast.css.d.ts +1 -1
  452. package/dist/generated/themes/Toast.css.js +1 -1
  453. package/dist/generated/themes/Toast.css.js.map +1 -1
  454. package/dist/generated/themes/ToggleButton.css.d.ts +1 -1
  455. package/dist/generated/themes/ToggleButton.css.js +1 -1
  456. package/dist/generated/themes/ToggleButton.css.js.map +1 -1
  457. package/dist/generated/themes/Token.css.d.ts +1 -1
  458. package/dist/generated/themes/Token.css.js +1 -1
  459. package/dist/generated/themes/Token.css.js.map +1 -1
  460. package/dist/generated/themes/Tokenizer.css.d.ts +1 -1
  461. package/dist/generated/themes/Tokenizer.css.js +1 -1
  462. package/dist/generated/themes/Tokenizer.css.js.map +1 -1
  463. package/dist/generated/themes/TokenizerPopover.css.d.ts +1 -1
  464. package/dist/generated/themes/TokenizerPopover.css.js +1 -1
  465. package/dist/generated/themes/TokenizerPopover.css.js.map +1 -1
  466. package/dist/generated/themes/Toolbar.css.d.ts +1 -1
  467. package/dist/generated/themes/Toolbar.css.js +1 -1
  468. package/dist/generated/themes/Toolbar.css.js.map +1 -1
  469. package/dist/generated/themes/ToolbarPopover.css.d.ts +1 -1
  470. package/dist/generated/themes/ToolbarPopover.css.js +1 -1
  471. package/dist/generated/themes/ToolbarPopover.css.js.map +1 -1
  472. package/dist/generated/themes/TreeItem.css.d.ts +1 -1
  473. package/dist/generated/themes/TreeItem.css.js +1 -1
  474. package/dist/generated/themes/TreeItem.css.js.map +1 -1
  475. package/dist/generated/themes/ValueStateMessage.css.d.ts +1 -1
  476. package/dist/generated/themes/ValueStateMessage.css.js +1 -1
  477. package/dist/generated/themes/ValueStateMessage.css.js.map +1 -1
  478. package/dist/generated/themes/YearPicker.css.d.ts +1 -1
  479. package/dist/generated/themes/YearPicker.css.js +1 -1
  480. package/dist/generated/themes/YearPicker.css.js.map +1 -1
  481. package/dist/generated/themes/sap_fiori_3/parameters-bundle.css.d.ts +1 -1
  482. package/dist/generated/themes/sap_fiori_3/parameters-bundle.css.js +1 -1
  483. package/dist/generated/themes/sap_fiori_3/parameters-bundle.css.js.map +1 -1
  484. package/dist/generated/themes/sap_fiori_3_dark/parameters-bundle.css.d.ts +1 -1
  485. package/dist/generated/themes/sap_fiori_3_dark/parameters-bundle.css.js +1 -1
  486. package/dist/generated/themes/sap_fiori_3_dark/parameters-bundle.css.js.map +1 -1
  487. package/dist/generated/themes/sap_fiori_3_hcb/parameters-bundle.css.d.ts +1 -1
  488. package/dist/generated/themes/sap_fiori_3_hcb/parameters-bundle.css.js +1 -1
  489. package/dist/generated/themes/sap_fiori_3_hcb/parameters-bundle.css.js.map +1 -1
  490. package/dist/generated/themes/sap_fiori_3_hcw/parameters-bundle.css.d.ts +1 -1
  491. package/dist/generated/themes/sap_fiori_3_hcw/parameters-bundle.css.js +1 -1
  492. package/dist/generated/themes/sap_fiori_3_hcw/parameters-bundle.css.js.map +1 -1
  493. package/dist/generated/themes/sap_horizon/parameters-bundle.css.d.ts +1 -1
  494. package/dist/generated/themes/sap_horizon/parameters-bundle.css.js +1 -1
  495. package/dist/generated/themes/sap_horizon/parameters-bundle.css.js.map +1 -1
  496. package/dist/generated/themes/sap_horizon_dark/parameters-bundle.css.d.ts +1 -1
  497. package/dist/generated/themes/sap_horizon_dark/parameters-bundle.css.js +1 -1
  498. package/dist/generated/themes/sap_horizon_dark/parameters-bundle.css.js.map +1 -1
  499. package/dist/generated/themes/sap_horizon_hcb/parameters-bundle.css.d.ts +1 -1
  500. package/dist/generated/themes/sap_horizon_hcb/parameters-bundle.css.js +1 -1
  501. package/dist/generated/themes/sap_horizon_hcb/parameters-bundle.css.js.map +1 -1
  502. package/dist/generated/themes/sap_horizon_hcw/parameters-bundle.css.d.ts +1 -1
  503. package/dist/generated/themes/sap_horizon_hcw/parameters-bundle.css.js +1 -1
  504. package/dist/generated/themes/sap_horizon_hcw/parameters-bundle.css.js.map +1 -1
  505. package/dist/vscode.html-custom-data.json +1 -1
  506. package/dist/web-types.json +4 -4
  507. package/package.json +12 -10
  508. package/src/DayPickerTemplate.tsx +1 -0
  509. package/src/MenuItemTemplate.tsx +0 -10
  510. package/src/SelectPopoverTemplate.tsx +1 -1
  511. package/src/TableGrowing.hbs +17 -19
  512. package/src/i18n/messagebundle_en_US_saprigi.properties +0 -2
  513. package/src/themes/DayPicker.css +1 -0
  514. package/src/themes/MenuItem.css +5 -1
  515. package/cypress/specs/ColorPalette.cy.ts +0 -46
  516. package/cypress/specs/MessageStrip.cy.ts +0 -91
  517. package/cypress/specs/RTL.cy.ts +0 -17
  518. package/cypress/specs/Table.cy.ts +0 -636
  519. package/cypress/specs/TableLoading.cy.ts +0 -44
  520. package/cypress/specs/Title.cy.ts +0 -37
  521. package/cypress/specs/Tokenizer.cy.ts +0 -114
  522. package/cypress/specs/base/Tooltips.cy.ts +0 -55
  523. /package/cypress/specs/{TableUtils.cy.ts → TableUtils.cy.tsx} +0 -0
  524. /package/cypress/specs/base/{InvisibleMessage.cy.ts → InvisibleMessage.cy.tsx} +0 -0
package/cypress/specs/{F6.cy.ts → F6.cy.tsx} RENAMED
@@ -1,33 +1,34 @@
1
- import { html } from "lit";
2
1
  import "@ui5/webcomponents-base/dist/features/F6Navigation.js";
3
- import "../../src/Button.js";
2
+ import Button from "../../src/Button.js";
4
3
 
5
4
  describe("F6 navigation", () => {
6
5
  describe("F6 Forward navigation", () => {
7
6
  it("tests navigation", () => {
8
- cy.mount(html`<div>
9
- <div class="section">
10
- <button id="before">Before element</button>
11
- </div>
12
- <div class="section" data-sap-ui-fastnavgroup="true">
13
- <ui5-button id="first">First focusable</ui5-button>
14
- </div>
15
- <div class="section">
16
- <ui5-button>Something focusable</ui5-button>
17
- </div>
18
- <div class="section" data-sap-ui-fastnavgroup="true">
19
- <ui5-button id="second">Second focusable</ui5-button>
20
- </div>
21
- <div class="section">
22
- <ui5-button>Something focusable</ui5-button>
23
- </div>
24
- <div class="section" data-sap-ui-fastnavgroup="true">
25
- <ui5-button id="third">Third focusable</ui5-button>
26
- </div>
27
- <div class="section">
28
- <ui5-button>After Element</ui5-button>
29
- </div>
30
- </div>`);
7
+ cy.mount(
8
+ <div>
9
+ <div class="section">
10
+ <button id="before">Before element</button>
11
+ </div>
12
+ <div class="section" data-sap-ui-fastnavgroup="true">
13
+ <Button id="first">First focusable</Button>
14
+ </div>
15
+ <div class="section">
16
+ <Button>Something focusable</Button>
17
+ </div>
18
+ <div class="section" data-sap-ui-fastnavgroup="true">
19
+ <Button id="second">Second focusable</Button>
20
+ </div>
21
+ <div class="section">
22
+ <Button>Something focusable</Button>
23
+ </div>
24
+ <div class="section" data-sap-ui-fastnavgroup="true">
25
+ <Button id="third">Third focusable</Button>
26
+ </div>
27
+ <div class="section">
28
+ <Button>After Element</Button>
29
+ </div>
30
+ </div>
31
+ );
31
32
 
32
33
  // act
33
34
  cy.get("#before").focus();
@@ -60,41 +61,41 @@ describe("F6 navigation", () => {
60
61
  });
61
62
 
62
63
  it("tests navigation with hidden elements", () => {
63
- cy.mount(html`<div>
64
+ cy.mount(<div>
64
65
  <div class="section">
65
66
  <button id="before">Before element</button>
66
67
  </div>
67
68
  <div class="section" data-sap-ui-fastnavgroup="true">
68
- <ui5-button id="first">First focusable</ui5-button>
69
+ <Button id="first">First focusable</Button>
69
70
  </div>
70
71
  <div class="section" data-sap-ui-fastnavgroup="true">
71
- <ui5-button style="visibility: hidden;">Hidden</ui5-button>
72
+ <Button style={{ visibility: "hidden" }}>Hidden</Button>
72
73
  </div>
73
- <div class="section" data-sap-ui-fastnavgroup="true" style="visibility: hidden;">
74
- <ui5-button>Hidden</ui5-button>
74
+ <div class="section" data-sap-ui-fastnavgroup="true" style={{ visibility: "hidden" }}>
75
+ <Button>Hidden</Button>
75
76
  </div>
76
77
  <div class="section" data-sap-ui-fastnavgroup="true">
77
- <ui5-button style="display: none;">Hidden</ui5-button>
78
+ <Button style={{ display: "none" }}>Hidden</Button>
78
79
  </div>
79
- <div class="section" data-sap-ui-fastnavgroup="true" style="display: none;">
80
- <ui5-button>Hidden</ui5-button>
80
+ <div class="section" data-sap-ui-fastnavgroup="true" style={{ display: "none" }}>
81
+ <Button>Hidden</Button>
81
82
  </div>
82
83
  <div class="section">
83
- <ui5-button>Something focusable</ui5-button>
84
+ <Button>Something focusable</Button>
84
85
  </div>
85
86
  <div class="section" data-sap-ui-fastnavgroup="true">
86
- <ui5-button id="second">Second focusable</ui5-button>
87
+ <Button id="second">Second focusable</Button>
87
88
  </div>
88
89
  <div class="section">
89
- <ui5-button>Something focusable</ui5-button>
90
+ <Button>Something focusable</Button>
90
91
  </div>
91
92
  <div class="section" data-sap-ui-fastnavgroup="true">
92
- <ui5-button id="third">Third focusable</ui5-button>
93
+ <Button id="third">Third focusable</Button>
93
94
  </div>
94
95
  <div class="section">
95
- <ui5-button>After Element</ui5-button>
96
+ <Button>After Element</Button>
96
97
  </div>
97
- </div>`);
98
+ </div>);
98
99
 
99
100
  // act
100
101
  cy.get("#before").focus();
@@ -127,29 +128,29 @@ describe("F6 navigation", () => {
127
128
  });
128
129
 
129
130
  it("tests navigation with empty group", () => {
130
- cy.mount(html`<div>
131
+ cy.mount(<div>
131
132
  <div class="section">
132
133
  <button id="before">Before element</button>
133
134
  </div>
134
135
  <div class="section" data-sap-ui-fastnavgroup="true">
135
- <ui5-button id="first">First focusable</ui5-button>
136
+ <Button id="first">First focusable</Button>
136
137
  </div>
137
138
  <div class="section">
138
- <ui5-button>Something focusable</ui5-button>
139
+ <Button>Something focusable</Button>
139
140
  </div>
140
141
  <div class="section" data-sap-ui-fastnavgroup="true">
141
142
  Group without focusable element
142
143
  </div>
143
144
  <div class="section">
144
- <ui5-button>Something focusable</ui5-button>
145
+ <Button>Something focusable</Button>
145
146
  </div>
146
147
  <div class="section" data-sap-ui-fastnavgroup="true">
147
- <ui5-button id="second">Second focusable</ui5-button>
148
+ <Button id="second">Second focusable</Button>
148
149
  </div>
149
150
  <div class="section">
150
- <ui5-button>After Element</ui5-button>
151
+ <Button>After Element</Button>
151
152
  </div>
152
- </div>`);
153
+ </div>);
153
154
 
154
155
  // act
155
156
  cy.get("#before").focus();
@@ -175,24 +176,28 @@ describe("F6 navigation", () => {
175
176
  });
176
177
 
177
178
  it("tests navigation with nested groups", () => {
178
- cy.mount(html`<div class="section">
179
- <button id="before">Before element</button>
180
- </div>
181
- <div class="section" data-sap-ui-fastnavgroup="true">
182
- <ui5-button id="first">First focusable</ui5-button>
183
- <div class="section" data-sap-ui-fastnavgroup="true">
184
- <ui5-button id="second">Second focusable</ui5-button>
185
- </div>
186
- </div>
187
- <div class="section">
188
- <ui5-button>Something focusable</ui5-button>
189
- </div>
190
- <div class="section" data-sap-ui-fastnavgroup="true">
191
- <ui5-button id="third">Third focusable</ui5-button>
192
- </div>
193
- <div class="section">
194
- <ui5-button>After Element</ui5-button>
195
- </div>`);
179
+ cy.mount(
180
+ <>
181
+ <div class="section">
182
+ <button id="before">Before element</button>
183
+ </div>
184
+ <div class="section" data-sap-ui-fastnavgroup="true">
185
+ <Button id="first">First focusable</Button>
186
+ <div class="section" data-sap-ui-fastnavgroup="true">
187
+ <Button id="second">Second focusable</Button>
188
+ </div>
189
+ </div>
190
+ <div class="section">
191
+ <Button>Something focusable</Button>
192
+ </div>
193
+ <div class="section" data-sap-ui-fastnavgroup="true">
194
+ <Button id="third">Third focusable</Button>
195
+ </div>
196
+ <div class="section">
197
+ <Button>After Element</Button>
198
+ </div>
199
+ </>
200
+ );
196
201
 
197
202
  // act
198
203
  cy.get("#before").focus();
@@ -225,31 +230,35 @@ describe("F6 navigation", () => {
225
230
  });
226
231
 
227
232
  it("tests navigation with nesting inside empty fastnav-group parent", () => {
228
- cy.mount(html`<div class="section">
229
- <button id="before">Before element</button>
230
- </div>
231
- <div class="section" data-sap-ui-fastnavgroup="true">
232
- <div class="section" data-sap-ui-fastnavgroup="true">
233
- <ui5-button id="first">First focusable</ui5-button>
234
- </div>
235
- </div>
236
- <div class="section">
237
- <ui5-button>Something focusable</ui5-button>
238
- </div>
239
- <div class="section" data-sap-ui-fastnavgroup="true">
240
- <div class="section" data-sap-ui-fastnavgroup="true">
241
- <ui5-button id="second">First focusable</ui5-button>
242
- </div>
243
- </div>
244
- <div class="section">
245
- <ui5-button>Something focusable</ui5-button>
246
- </div>
247
- <div class="section" data-sap-ui-fastnavgroup="true">
248
- <ui5-button id="third">Second focusable</ui5-button>
249
- </div>
250
- <div class="section">
251
- <ui5-button>After Element</ui5-button>
252
- </div>`);
233
+ cy.mount(
234
+ <>
235
+ <div class="section">
236
+ <button id="before">Before element</button>
237
+ </div>
238
+ <div class="section" data-sap-ui-fastnavgroup="true">
239
+ <div class="section" data-sap-ui-fastnavgroup="true">
240
+ <Button id="first">First focusable</Button>
241
+ </div>
242
+ </div>
243
+ <div class="section">
244
+ <Button>Something focusable</Button>
245
+ </div>
246
+ <div class="section" data-sap-ui-fastnavgroup="true">
247
+ <div class="section" data-sap-ui-fastnavgroup="true">
248
+ <Button id="second">First focusable</Button>
249
+ </div>
250
+ </div>
251
+ <div class="section">
252
+ <Button>Something focusable</Button>
253
+ </div>
254
+ <div class="section" data-sap-ui-fastnavgroup="true">
255
+ <Button id="third">Second focusable</Button>
256
+ </div>
257
+ <div class="section">
258
+ <Button>After Element</Button>
259
+ </div>
260
+ </>
261
+ );
253
262
 
254
263
  // act
255
264
  cy.get("#before").focus();
@@ -282,27 +291,31 @@ describe("F6 navigation", () => {
282
291
  });
283
292
 
284
293
  it("tests navigation with group as a focusable element", () => {
285
- cy.mount(html`<div class="section">
286
- <button id="before">Before element</button>
287
- </div>
288
- <div class="section" data-sap-ui-fastnavgroup="true">
289
- <ui5-button id="first">First focusable</ui5-button>
290
- </div>
291
- <div class="section">
292
- <ui5-button>Something focusable</ui5-button>
293
- </div>
294
- <div class="section" tabindex="0" id="second" data-sap-ui-fastnavgroup="true">
295
- Second focusable
296
- </div>
297
- <div class="section">
298
- <ui5-button>Something focusable</ui5-button>
299
- </div>
300
- <div class="section" data-sap-ui-fastnavgroup="true">
301
- <ui5-button id="third">Third focusable</ui5-button>
302
- </div>
303
- <div class="section">
304
- <ui5-button>After Element</ui5-button>
305
- </div>`);
294
+ cy.mount(
295
+ <>
296
+ <div class="section">
297
+ <button id="before">Before element</button>
298
+ </div>
299
+ <div class="section" data-sap-ui-fastnavgroup="true">
300
+ <Button id="first">First focusable</Button>
301
+ </div>
302
+ <div class="section">
303
+ <Button>Something focusable</Button>
304
+ </div>
305
+ <div class="section" tabindex={0} id="second" data-sap-ui-fastnavgroup="true">
306
+ Second focusable
307
+ </div>
308
+ <div class="section">
309
+ <Button>Something focusable</Button>
310
+ </div>
311
+ <div class="section" data-sap-ui-fastnavgroup="true">
312
+ <Button id="third">Third focusable</Button>
313
+ </div>
314
+ <div class="section">
315
+ <Button>After Element</Button>
316
+ </div>
317
+ </>
318
+ );
306
319
 
307
320
  // act
308
321
  cy.get("#before").focus();
@@ -335,24 +348,28 @@ describe("F6 navigation", () => {
335
348
  });
336
349
 
337
350
  it("tests navigation without a focusable element", () => {
338
- cy.mount(html`<div class="section">
339
- <ui5-button id="first">Before element</ui5-button>
340
- </div>
341
- <div class="section" data-sap-ui-fastnavgroup="true">
342
- Group without focusable element
343
- </div>
344
- <div class="section">
345
- <ui5-button>Something focusable</ui5-button>
346
- </div>
347
- <div class="section" data-sap-ui-fastnavgroup="true">
348
- Group without focusable element
349
- </div>
350
- <div class="section">
351
- <ui5-button>Something focusable</ui5-button>
352
- </div>
353
- <div class="section">
354
- <ui5-button>After Element</ui5-button>
355
- </div>`);
351
+ cy.mount(
352
+ <>
353
+ <div class="section">
354
+ <Button id="first">Before element</Button>
355
+ </div>
356
+ <div class="section" data-sap-ui-fastnavgroup="true">
357
+ Group without focusable element
358
+ </div>
359
+ <div class="section">
360
+ <Button>Something focusable</Button>
361
+ </div>
362
+ <div class="section" data-sap-ui-fastnavgroup="true">
363
+ Group without focusable element
364
+ </div>
365
+ <div class="section">
366
+ <Button>Something focusable</Button>
367
+ </div>
368
+ <div class="section">
369
+ <Button>After Element</Button>
370
+ </div>
371
+ </>
372
+ );
356
373
 
357
374
  // act
358
375
  cy.get("#first")
@@ -371,21 +388,25 @@ describe("F6 navigation", () => {
371
388
  });
372
389
 
373
390
  it("tests navigation with a single group", () => {
374
- cy.mount(html`<div class="section">
375
- <button id="before">Before element</button>
376
- </div>
377
- <div class="section" data-sap-ui-fastnavgroup="true">
378
- <ui5-button id="first">Before element</ui5-button>
379
- </div>
380
- <div class="section">
381
- <ui5-button>Something focusable</ui5-button>
382
- </div>
383
- <div class="section">
384
- <ui5-button>Something focusable</ui5-button>
385
- </div>
386
- <div class="section">
387
- <ui5-button>After Element</ui5-button>
388
- </div>`);
391
+ cy.mount(
392
+ <>
393
+ <div class="section">
394
+ <button id="before">Before element</button>
395
+ </div>
396
+ <div class="section" data-sap-ui-fastnavgroup="true">
397
+ <Button id="first">Before element</Button>
398
+ </div>
399
+ <div class="section">
400
+ <Button>Something focusable</Button>
401
+ </div>
402
+ <div class="section">
403
+ <Button>Something focusable</Button>
404
+ </div>
405
+ <div class="section">
406
+ <Button>After Element</Button>
407
+ </div>
408
+ </>
409
+ );
389
410
 
390
411
  // act
391
412
  cy.get("#before").focus();
@@ -399,29 +420,29 @@ describe("F6 navigation", () => {
399
420
 
400
421
  describe("F6 Backward navigation", () => {
401
422
  it("tests navigation", () => {
402
- cy.mount(html`<div>
423
+ cy.mount(<div>
403
424
  <div class="section">
404
425
  <button id="before">Before element</button>
405
426
  </div>
406
427
  <div class="section" data-sap-ui-fastnavgroup="true">
407
- <ui5-button id="first">First focusable</ui5-button>
428
+ <Button id="first">First focusable</Button>
408
429
  </div>
409
430
  <div class="section">
410
- <ui5-button>Something focusable</ui5-button>
431
+ <Button>Something focusable</Button>
411
432
  </div>
412
433
  <div class="section" data-sap-ui-fastnavgroup="true">
413
- <ui5-button id="second">Second focusable</ui5-button>
434
+ <Button id="second">Second focusable</Button>
414
435
  </div>
415
436
  <div class="section">
416
- <ui5-button>Something focusable</ui5-button>
437
+ <Button>Something focusable</Button>
417
438
  </div>
418
439
  <div class="section" data-sap-ui-fastnavgroup="true">
419
- <ui5-button id="third">Third focusable</ui5-button>
440
+ <Button id="third">Third focusable</Button>
420
441
  </div>
421
442
  <div class="section">
422
- <ui5-button>After Element</ui5-button>
443
+ <Button>After Element</Button>
423
444
  </div>
424
- </div>`);
445
+ </div>);
425
446
 
426
447
  // act
427
448
  cy.get("#before").focus();
@@ -454,41 +475,41 @@ describe("F6 navigation", () => {
454
475
  });
455
476
 
456
477
  it("tests navigation with hidden elements", () => {
457
- cy.mount(html`<div>
478
+ cy.mount(<div>
458
479
  <div class="section">
459
480
  <button id="before">Before element</button>
460
481
  </div>
461
482
  <div class="section" data-sap-ui-fastnavgroup="true">
462
- <ui5-button id="first">First focusable</ui5-button>
483
+ <Button id="first">First focusable</Button>
463
484
  </div>
464
485
  <div class="section" data-sap-ui-fastnavgroup="true">
465
- <ui5-button style="visibility: hidden;">Hidden</ui5-button>
486
+ <Button style={{ visibility: "hidden" }}>Hidden</Button>
466
487
  </div>
467
- <div class="section" data-sap-ui-fastnavgroup="true" style="visibility: hidden;">
468
- <ui5-button>Hidden</ui5-button>
488
+ <div class="section" data-sap-ui-fastnavgroup="true" style={{ visibility: "hidden" }}>
489
+ <Button>Hidden</Button>
469
490
  </div>
470
491
  <div class="section" data-sap-ui-fastnavgroup="true">
471
- <ui5-button style="display: none;">Hidden</ui5-button>
492
+ <Button style={{ display: "none" }}>Hidden</Button>
472
493
  </div>
473
- <div class="section" data-sap-ui-fastnavgroup="true" style="display: none;">
474
- <ui5-button>Hidden</ui5-button>
494
+ <div class="section" data-sap-ui-fastnavgroup="true" style={{ display: "none" }}>
495
+ <Button>Hidden</Button>
475
496
  </div>
476
497
  <div class="section">
477
- <ui5-button>Something focusable</ui5-button>
498
+ <Button>Something focusable</Button>
478
499
  </div>
479
500
  <div class="section" data-sap-ui-fastnavgroup="true">
480
- <ui5-button id="second">Second focusable</ui5-button>
501
+ <Button id="second">Second focusable</Button>
481
502
  </div>
482
503
  <div class="section">
483
- <ui5-button>Something focusable</ui5-button>
504
+ <Button>Something focusable</Button>
484
505
  </div>
485
506
  <div class="section" data-sap-ui-fastnavgroup="true">
486
- <ui5-button id="third">Third focusable</ui5-button>
507
+ <Button id="third">Third focusable</Button>
487
508
  </div>
488
509
  <div class="section">
489
- <ui5-button>After Element</ui5-button>
510
+ <Button>After Element</Button>
490
511
  </div>
491
- </div>`);
512
+ </div>);
492
513
 
493
514
  // act
494
515
  cy.get("#before").focus();
@@ -521,29 +542,29 @@ describe("F6 navigation", () => {
521
542
  });
522
543
 
523
544
  it("tests navigation with empty group", () => {
524
- cy.mount(html`<div>
545
+ cy.mount(<div>
525
546
  <div class="section">
526
547
  <button id="before">Before element</button>
527
548
  </div>
528
549
  <div class="section" data-sap-ui-fastnavgroup="true">
529
- <ui5-button id="first">First focusable</ui5-button>
550
+ <Button id="first">First focusable</Button>
530
551
  </div>
531
552
  <div class="section">
532
- <ui5-button>Something focusable</ui5-button>
553
+ <Button>Something focusable</Button>
533
554
  </div>
534
555
  <div class="section" data-sap-ui-fastnavgroup="true">
535
556
  Group without focusable element
536
557
  </div>
537
558
  <div class="section">
538
- <ui5-button>Something focusable</ui5-button>
559
+ <Button>Something focusable</Button>
539
560
  </div>
540
561
  <div class="section" data-sap-ui-fastnavgroup="true">
541
- <ui5-button id="second">Second focusable</ui5-button>
562
+ <Button id="second">Second focusable</Button>
542
563
  </div>
543
564
  <div class="section">
544
- <ui5-button>After Element</ui5-button>
565
+ <Button>After Element</Button>
545
566
  </div>
546
- </div>`);
567
+ </div>);
547
568
 
548
569
  // act
549
570
  cy.get("#before").focus();
@@ -569,24 +590,28 @@ describe("F6 navigation", () => {
569
590
  });
570
591
 
571
592
  it("tests navigation with nested groups", () => {
572
- cy.mount(html`<div class="section">
573
- <button id="before">Before element</button>
574
- </div>
575
- <div class="section" data-sap-ui-fastnavgroup="true">
576
- <ui5-button id="first">First focusable</ui5-button>
577
- <div class="section" data-sap-ui-fastnavgroup="true">
578
- <ui5-button id="second">Second focusable</ui5-button>
579
- </div>
580
- </div>
581
- <div class="section">
582
- <ui5-button>Something focusable</ui5-button>
583
- </div>
584
- <div class="section" data-sap-ui-fastnavgroup="true">
585
- <ui5-button id="third">Third focusable</ui5-button>
586
- </div>
587
- <div class="section">
588
- <ui5-button>After Element</ui5-button>
589
- </div>`);
593
+ cy.mount(
594
+ <>
595
+ <div class="section">
596
+ <button id="before">Before element</button>
597
+ </div>
598
+ <div class="section" data-sap-ui-fastnavgroup="true">
599
+ <Button id="first">First focusable</Button>
600
+ <div class="section" data-sap-ui-fastnavgroup="true">
601
+ <Button id="second">Second focusable</Button>
602
+ </div>
603
+ </div>
604
+ <div class="section">
605
+ <Button>Something focusable</Button>
606
+ </div>
607
+ <div class="section" data-sap-ui-fastnavgroup="true">
608
+ <Button id="third">Third focusable</Button>
609
+ </div>
610
+ <div class="section">
611
+ <Button>After Element</Button>
612
+ </div>
613
+ </>
614
+ );
590
615
 
591
616
  // act
592
617
  cy.get("#before").focus();
@@ -619,31 +644,35 @@ describe("F6 navigation", () => {
619
644
  });
620
645
 
621
646
  it("tests navigation with nesting inside empty fastnav-group parent", () => {
622
- cy.mount(html`<div class="section">
623
- <button id="before">Before element</button>
624
- </div>
625
- <div class="section" data-sap-ui-fastnavgroup="true">
626
- <div class="section" data-sap-ui-fastnavgroup="true">
627
- <ui5-button id="first">First focusable</ui5-button>
628
- </div>
629
- </div>
630
- <div class="section">
631
- <ui5-button>Something focusable</ui5-button>
632
- </div>
633
- <div class="section" data-sap-ui-fastnavgroup="true">
634
- <div class="section" data-sap-ui-fastnavgroup="true">
635
- <ui5-button id="second">First focusable</ui5-button>
636
- </div>
637
- </div>
638
- <div class="section">
639
- <ui5-button>Something focusable</ui5-button>
640
- </div>
641
- <div class="section" data-sap-ui-fastnavgroup="true">
642
- <ui5-button id="third">Second focusable</ui5-button>
643
- </div>
644
- <div class="section">
645
- <ui5-button>After Element</ui5-button>
646
- </div>`);
647
+ cy.mount(
648
+ <>
649
+ <div class="section">
650
+ <button id="before">Before element</button>
651
+ </div>
652
+ <div class="section" data-sap-ui-fastnavgroup="true">
653
+ <div class="section" data-sap-ui-fastnavgroup="true">
654
+ <Button id="first">First focusable</Button>
655
+ </div>
656
+ </div>
657
+ <div class="section">
658
+ <Button>Something focusable</Button>
659
+ </div>
660
+ <div class="section" data-sap-ui-fastnavgroup="true">
661
+ <div class="section" data-sap-ui-fastnavgroup="true">
662
+ <Button id="second">First focusable</Button>
663
+ </div>
664
+ </div>
665
+ <div class="section">
666
+ <Button>Something focusable</Button>
667
+ </div>
668
+ <div class="section" data-sap-ui-fastnavgroup="true">
669
+ <Button id="third">Second focusable</Button>
670
+ </div>
671
+ <div class="section">
672
+ <Button>After Element</Button>
673
+ </div>
674
+ </>
675
+ );
647
676
 
648
677
  // act
649
678
  cy.get("#before").focus();
@@ -676,27 +705,31 @@ describe("F6 navigation", () => {
676
705
  });
677
706
 
678
707
  it("tests navigation with group as a focusable element", () => {
679
- cy.mount(html`<div class="section">
680
- <button id="before">Before element</button>
681
- </div>
682
- <div class="section" data-sap-ui-fastnavgroup="true">
683
- <ui5-button id="first">First focusable</ui5-button>
684
- </div>
685
- <div class="section">
686
- <ui5-button>Something focusable</ui5-button>
687
- </div>
688
- <div class="section" tabindex="0" id="second" data-sap-ui-fastnavgroup="true">
689
- Second focusable
690
- </div>
691
- <div class="section">
692
- <ui5-button>Something focusable</ui5-button>
693
- </div>
694
- <div class="section" data-sap-ui-fastnavgroup="true">
695
- <ui5-button id="third">Third focusable</ui5-button>
696
- </div>
697
- <div class="section">
698
- <ui5-button>After Element</ui5-button>
699
- </div>`);
708
+ cy.mount(
709
+ <>
710
+ <div class="section">
711
+ <button id="before">Before element</button>
712
+ </div>
713
+ <div class="section" data-sap-ui-fastnavgroup="true">
714
+ <Button id="first">First focusable</Button>
715
+ </div>
716
+ <div class="section">
717
+ <Button>Something focusable</Button>
718
+ </div>
719
+ <div class="section" tabindex={0} id="second" data-sap-ui-fastnavgroup="true">
720
+ Second focusable
721
+ </div>
722
+ <div class="section">
723
+ <Button>Something focusable</Button>
724
+ </div>
725
+ <div class="section" data-sap-ui-fastnavgroup="true">
726
+ <Button id="third">Third focusable</Button>
727
+ </div>
728
+ <div class="section">
729
+ <Button>After Element</Button>
730
+ </div>
731
+ </>
732
+ );
700
733
 
701
734
  // act
702
735
  cy.get("#before").focus();
@@ -729,24 +762,28 @@ describe("F6 navigation", () => {
729
762
  });
730
763
 
731
764
  it("tests navigation without a focusable element", () => {
732
- cy.mount(html`<div class="section">
733
- <ui5-button id="first">Before element</ui5-button>
734
- </div>
735
- <div class="section" data-sap-ui-fastnavgroup="true">
736
- Group without focusable element
737
- </div>
738
- <div class="section">
739
- <ui5-button>Something focusable</ui5-button>
740
- </div>
741
- <div class="section" data-sap-ui-fastnavgroup="true">
742
- Group without focusable element
743
- </div>
744
- <div class="section">
745
- <ui5-button>Something focusable</ui5-button>
746
- </div>
747
- <div class="section">
748
- <ui5-button>After Element</ui5-button>
749
- </div>`);
765
+ cy.mount(
766
+ <>
767
+ <div class="section">
768
+ <Button id="first">Before element</Button>
769
+ </div>
770
+ <div class="section" data-sap-ui-fastnavgroup="true">
771
+ Group without focusable element
772
+ </div>
773
+ <div class="section">
774
+ <Button>Something focusable</Button>
775
+ </div>
776
+ <div class="section" data-sap-ui-fastnavgroup="true">
777
+ Group without focusable element
778
+ </div>
779
+ <div class="section">
780
+ <Button>Something focusable</Button>
781
+ </div>
782
+ <div class="section">
783
+ <Button>After Element</Button>
784
+ </div>
785
+ </>
786
+ );
750
787
 
751
788
  // act
752
789
  cy.get("#first")
@@ -765,21 +802,25 @@ describe("F6 navigation", () => {
765
802
  });
766
803
 
767
804
  it("tests navigation with a single group", () => {
768
- cy.mount(html`<div class="section">
769
- <button id="before">Before element</button>
770
- </div>
771
- <div class="section" data-sap-ui-fastnavgroup="true">
772
- <ui5-button id="first">Before element</ui5-button>
773
- </div>
774
- <div class="section">
775
- <ui5-button>Something focusable</ui5-button>
776
- </div>
777
- <div class="section">
778
- <ui5-button>Something focusable</ui5-button>
779
- </div>
780
- <div class="section">
781
- <ui5-button>After Element</ui5-button>
782
- </div>`);
805
+ cy.mount(
806
+ <>
807
+ <div class="section">
808
+ <button id="before">Before element</button>
809
+ </div>
810
+ <div class="section" data-sap-ui-fastnavgroup="true">
811
+ <Button id="first">Before element</Button>
812
+ </div>
813
+ <div class="section">
814
+ <Button>Something focusable</Button>
815
+ </div>
816
+ <div class="section">
817
+ <Button>Something focusable</Button>
818
+ </div>
819
+ <div class="section">
820
+ <Button>After Element</Button>
821
+ </div>
822
+ </>
823
+ );
783
824
 
784
825
  // act
785
826
  cy.get("#before").focus();
@@ -793,22 +834,24 @@ describe("F6 navigation", () => {
793
834
 
794
835
  describe("Groups in container", () => {
795
836
  it("tests forward navigation", () => {
796
- cy.mount(html`<div>
797
- <div class="section" data-sap-ui-fastnavgroup="true">
798
- <ui5-button>Non group focusable</ui5-button>
799
- </div>
800
- <div data-sap-ui-fastnavgroup-container="true" data-sap-ui-fastnavgroup="true">
801
- <div class="section" data-sap-ui-fastnavgroup="true">
802
- <ui5-button id="first">First group focusable</ui5-button>
803
- </div>
804
- <div class="section" data-sap-ui-fastnavgroup="true">
805
- <ui5-button id="second">Second group focusable</ui5-button>
806
- </div>
807
- </div>
808
- <div class="section" data-sap-ui-fastnavgroup="true">
809
- <ui5-button>Non group focusable</ui5-button>
810
- </div>
811
- </div>`);
837
+ cy.mount(
838
+ <div>
839
+ <div class="section" data-sap-ui-fastnavgroup="true">
840
+ <Button>Non group focusable</Button>
841
+ </div>
842
+ <div data-sap-ui-fastnavgroup-container="true" data-sap-ui-fastnavgroup="true">
843
+ <div class="section" data-sap-ui-fastnavgroup="true">
844
+ <Button id="first">First group focusable</Button>
845
+ </div>
846
+ <div class="section" data-sap-ui-fastnavgroup="true">
847
+ <Button id="second">Second group focusable</Button>
848
+ </div>
849
+ </div>
850
+ <div class="section" data-sap-ui-fastnavgroup="true">
851
+ <Button>Non group focusable</Button>
852
+ </div>
853
+ </div>
854
+ );
812
855
 
813
856
  // act
814
857
  cy.get("#first")
@@ -826,22 +869,24 @@ describe("F6 navigation", () => {
826
869
  });
827
870
 
828
871
  it("tests backward navigation", () => {
829
- cy.mount(html`<div>
830
- <div class="section" data-sap-ui-fastnavgroup="true">
831
- <ui5-button>Non group focusable</ui5-button>
832
- </div>
833
- <div data-sap-ui-fastnavgroup-container="true">
834
- <div class="section" data-sap-ui-fastnavgroup="true">
835
- <ui5-button id="first">First group focusable</ui5-button>
836
- </div>
837
- <div class="section" data-sap-ui-fastnavgroup="true">
838
- <ui5-button id="second">Second group focusable</ui5-button>
839
- </div>
840
- </div>
841
- <div class="section" data-sap-ui-fastnavgroup="true">
842
- <ui5-button>Non group focusable</ui5-button>
843
- </div>
844
- </div>`);
872
+ cy.mount(
873
+ <div>
874
+ <div class="section" data-sap-ui-fastnavgroup="true">
875
+ <ui5-button>Non group focusable</ui5-button>
876
+ </div>
877
+ <div data-sap-ui-fastnavgroup-container="true">
878
+ <div class="section" data-sap-ui-fastnavgroup="true">
879
+ <ui5-button id="first">First group focusable</ui5-button>
880
+ </div>
881
+ <div class="section" data-sap-ui-fastnavgroup="true">
882
+ <ui5-button id="second">Second group focusable</ui5-button>
883
+ </div>
884
+ </div>
885
+ <div class="section" data-sap-ui-fastnavgroup="true">
886
+ <ui5-button>Non group focusable</ui5-button>
887
+ </div>
888
+ </div>
889
+ );
845
890
 
846
891
  // act
847
892
  cy.get("#first")