@ui5/webcomponents 0.0.0-49cef2d02 → 0.0.0-4a28ecb24

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 (617) hide show
  1. package/CHANGELOG.md +135 -0
  2. package/dist/Assets-static.d.ts +4 -0
  3. package/dist/Assets-static.js +1 -1
  4. package/dist/Assets-static.js.map +1 -0
  5. package/dist/Assets.d.ts +5 -0
  6. package/dist/Assets.js +1 -1
  7. package/dist/Assets.js.map +1 -0
  8. package/dist/Avatar.d.ts +3 -3
  9. package/dist/Avatar.js +0 -1
  10. package/dist/Avatar.js.map +1 -1
  11. package/dist/AvatarGroup.js +2 -19
  12. package/dist/Badge.d.ts +3 -3
  13. package/dist/Badge.js +0 -1
  14. package/dist/Badge.js.map +1 -1
  15. package/dist/Breadcrumbs.d.ts +13 -13
  16. package/dist/Breadcrumbs.js +2 -5
  17. package/dist/Breadcrumbs.js.map +1 -1
  18. package/dist/BreadcrumbsItem.d.ts +1 -0
  19. package/dist/BreadcrumbsItem.js +1 -0
  20. package/dist/BreadcrumbsItem.js.map +1 -1
  21. package/dist/BusyIndicator.d.ts +136 -0
  22. package/dist/BusyIndicator.js +125 -208
  23. package/dist/BusyIndicator.js.map +1 -0
  24. package/dist/Button.d.ts +3 -3
  25. package/dist/Button.js +0 -1
  26. package/dist/Button.js.map +1 -1
  27. package/dist/Calendar.d.ts +3 -3
  28. package/dist/Calendar.js +1 -1
  29. package/dist/CalendarDate.d.ts +1 -0
  30. package/dist/CalendarDate.js +1 -0
  31. package/dist/CalendarDate.js.map +1 -1
  32. package/dist/CalendarHeader.d.ts +2 -2
  33. package/dist/CalendarHeader.js +1 -3
  34. package/dist/CalendarHeader.js.map +1 -1
  35. package/dist/Card.d.ts +3 -3
  36. package/dist/Card.js +2 -4
  37. package/dist/Card.js.map +1 -1
  38. package/dist/CardHeader.d.ts +8 -8
  39. package/dist/CardHeader.js +1 -3
  40. package/dist/CardHeader.js.map +1 -1
  41. package/dist/Carousel.d.ts +318 -0
  42. package/dist/Carousel.js +444 -642
  43. package/dist/Carousel.js.map +1 -0
  44. package/dist/CheckBox.d.ts +3 -3
  45. package/dist/CheckBox.js +1 -3
  46. package/dist/CheckBox.js.map +1 -1
  47. package/dist/ColorPalette.d.ts +5 -5
  48. package/dist/ColorPalette.js +2 -4
  49. package/dist/ColorPalette.js.map +1 -1
  50. package/dist/ColorPaletteItem.d.ts +3 -2
  51. package/dist/ColorPaletteItem.js +2 -3
  52. package/dist/ColorPaletteItem.js.map +1 -1
  53. package/dist/ColorPalettePopover.d.ts +12 -13
  54. package/dist/ColorPalettePopover.js +5 -4
  55. package/dist/ColorPalettePopover.js.map +1 -1
  56. package/dist/ColorPicker.d.ts +2 -2
  57. package/dist/ColorPicker.js +1 -3
  58. package/dist/ColorPicker.js.map +1 -1
  59. package/dist/ComboBox.js +2 -2
  60. package/dist/ComboBoxGroupItem.js +1 -0
  61. package/dist/ComboBoxItem.js +1 -0
  62. package/dist/CustomListItem.d.ts +1 -1
  63. package/dist/DatePicker.d.ts +10 -6
  64. package/dist/DatePicker.js +3 -5
  65. package/dist/DatePicker.js.map +1 -1
  66. package/dist/DateRangePicker.d.ts +4 -0
  67. package/dist/DateRangePicker.js +4 -1
  68. package/dist/DateRangePicker.js.map +1 -1
  69. package/dist/DateTimePicker.d.ts +3 -8
  70. package/dist/DateTimePicker.js +1 -3
  71. package/dist/DateTimePicker.js.map +1 -1
  72. package/dist/DayPicker.d.ts +2 -2
  73. package/dist/DayPicker.js +1 -3
  74. package/dist/DayPicker.js.map +1 -1
  75. package/dist/Dialog.d.ts +15 -11
  76. package/dist/Dialog.js +14 -7
  77. package/dist/Dialog.js.map +1 -1
  78. package/dist/FileUploader.d.ts +5 -4
  79. package/dist/FileUploader.js +2 -3
  80. package/dist/FileUploader.js.map +1 -1
  81. package/dist/GroupHeaderListItem.d.ts +2 -2
  82. package/dist/GroupHeaderListItem.js +0 -1
  83. package/dist/GroupHeaderListItem.js.map +1 -1
  84. package/dist/Icon.d.ts +2 -2
  85. package/dist/Input.d.ts +20 -10
  86. package/dist/Input.js +20 -14
  87. package/dist/Input.js.map +1 -1
  88. package/dist/Label.d.ts +2 -2
  89. package/dist/Link.d.ts +2 -2
  90. package/dist/Link.js +0 -1
  91. package/dist/Link.js.map +1 -1
  92. package/dist/List.d.ts +4 -3
  93. package/dist/List.js +2 -5
  94. package/dist/List.js.map +1 -1
  95. package/dist/ListItem.d.ts +7 -2
  96. package/dist/ListItem.js +4 -8
  97. package/dist/ListItem.js.map +1 -1
  98. package/dist/Menu.d.ts +18 -14
  99. package/dist/Menu.js +6 -5
  100. package/dist/Menu.js.map +1 -1
  101. package/dist/MenuItem.d.ts +1 -0
  102. package/dist/MenuItem.js +1 -0
  103. package/dist/MenuItem.js.map +1 -1
  104. package/dist/MessageStrip.d.ts +2 -2
  105. package/dist/MessageStrip.js +1 -3
  106. package/dist/MessageStrip.js.map +1 -1
  107. package/dist/MonthPicker.d.ts +2 -2
  108. package/dist/MonthPicker.js +1 -3
  109. package/dist/MonthPicker.js.map +1 -1
  110. package/dist/MultiComboBox.js +6 -2
  111. package/dist/MultiComboBoxGroupItem.js +1 -0
  112. package/dist/MultiComboBoxItem.js +1 -0
  113. package/dist/MultiInput.js +1 -1
  114. package/dist/Option.d.ts +95 -0
  115. package/dist/Option.js +48 -118
  116. package/dist/Option.js.map +1 -0
  117. package/dist/Panel.d.ts +2 -2
  118. package/dist/Panel.js +0 -1
  119. package/dist/Panel.js.map +1 -1
  120. package/dist/Popover.d.ts +8 -6
  121. package/dist/Popover.js +7 -8
  122. package/dist/Popover.js.map +1 -1
  123. package/dist/Popup.d.ts +28 -17
  124. package/dist/Popup.js +13 -3
  125. package/dist/Popup.js.map +1 -1
  126. package/dist/ProgressIndicator.d.ts +2 -2
  127. package/dist/ProgressIndicator.js +1 -3
  128. package/dist/ProgressIndicator.js.map +1 -1
  129. package/dist/RadioButton.d.ts +245 -0
  130. package/dist/RadioButton.js +260 -484
  131. package/dist/RadioButton.js.map +1 -0
  132. package/dist/RadioButtonGroup.d.ts +25 -0
  133. package/dist/RadioButtonGroup.js +188 -202
  134. package/dist/RadioButtonGroup.js.map +1 -0
  135. package/dist/RangeSlider.d.ts +1 -1
  136. package/dist/RangeSlider.js +1 -3
  137. package/dist/RangeSlider.js.map +1 -1
  138. package/dist/ResponsivePopover.d.ts +108 -0
  139. package/dist/ResponsivePopover.js +145 -180
  140. package/dist/ResponsivePopover.js.map +1 -0
  141. package/dist/SegmentedButton.js +3 -3
  142. package/dist/SegmentedButtonItem.js +1 -0
  143. package/dist/Select.d.ts +341 -0
  144. package/dist/Select.js +579 -814
  145. package/dist/Select.js.map +1 -0
  146. package/dist/Slider.d.ts +1 -1
  147. package/dist/Slider.js +1 -3
  148. package/dist/Slider.js.map +1 -1
  149. package/dist/SplitButton.d.ts +2 -2
  150. package/dist/SplitButton.js +1 -3
  151. package/dist/SplitButton.js.map +1 -1
  152. package/dist/StandardListItem.d.ts +4 -2
  153. package/dist/StandardListItem.js +0 -1
  154. package/dist/StandardListItem.js.map +1 -1
  155. package/dist/StepInput.d.ts +3 -3
  156. package/dist/StepInput.js +0 -1
  157. package/dist/StepInput.js.map +1 -1
  158. package/dist/SuggestionGroupItem.d.ts +1 -0
  159. package/dist/SuggestionGroupItem.js +1 -0
  160. package/dist/SuggestionGroupItem.js.map +1 -1
  161. package/dist/SuggestionItem.d.ts +9 -8
  162. package/dist/SuggestionItem.js +1 -0
  163. package/dist/SuggestionItem.js.map +1 -1
  164. package/dist/SuggestionListItem.d.ts +1 -1
  165. package/dist/Switch.d.ts +2 -2
  166. package/dist/TabContainer.js +1 -2
  167. package/dist/Table.d.ts +6 -4
  168. package/dist/Table.js +2 -6
  169. package/dist/Table.js.map +1 -1
  170. package/dist/TableCell.d.ts +2 -2
  171. package/dist/TableColumn.d.ts +2 -2
  172. package/dist/TableGroupRow.d.ts +2 -2
  173. package/dist/TableGroupRow.js +1 -4
  174. package/dist/TableGroupRow.js.map +1 -1
  175. package/dist/TableRow.d.ts +2 -2
  176. package/dist/TableRow.js +1 -4
  177. package/dist/TableRow.js.map +1 -1
  178. package/dist/TimePicker.d.ts +1 -0
  179. package/dist/TimePicker.js +2 -3
  180. package/dist/TimePicker.js.map +1 -1
  181. package/dist/TimePickerBase.d.ts +20 -12
  182. package/dist/TimePickerBase.js +11 -4
  183. package/dist/TimePickerBase.js.map +1 -1
  184. package/dist/TimeSelection.d.ts +2 -2
  185. package/dist/TimeSelection.js +1 -3
  186. package/dist/TimeSelection.js.map +1 -1
  187. package/dist/Title.d.ts +2 -2
  188. package/dist/Tree.js +1 -1
  189. package/dist/WheelSlider.d.ts +2 -2
  190. package/dist/YearPicker.d.ts +2 -2
  191. package/dist/YearPicker.js +1 -3
  192. package/dist/YearPicker.js.map +1 -1
  193. package/dist/api.json +1 -1
  194. package/dist/css/themes/Avatar.css +1 -1
  195. package/dist/custom-elements.json +1 -0
  196. package/dist/features/ColorPaletteMoreColors.d.ts +1 -1
  197. package/dist/features/ColorPaletteMoreColors.js +1 -3
  198. package/dist/features/ColorPaletteMoreColors.js.map +1 -1
  199. package/dist/features/InputSuggestions.d.ts +8 -4
  200. package/dist/features/InputSuggestions.js +1 -4
  201. package/dist/features/InputSuggestions.js.map +1 -1
  202. package/dist/generated/i18n/i18n-defaults.d.ts +142 -0
  203. package/dist/generated/i18n/i18n-defaults.js +142 -2
  204. package/dist/generated/i18n/i18n-defaults.js.map +1 -0
  205. package/dist/generated/templates/CarouselTemplate.lit.js +2 -2
  206. package/dist/generated/templates/RadioButtonTemplate.lit.js +1 -1
  207. package/dist/generated/templates/ResponsivePopoverTemplate.lit.js +1 -1
  208. package/dist/generated/templates/SelectTemplate.lit.js +1 -1
  209. package/dist/generated/themes/Avatar.css.d.ts +3 -0
  210. package/dist/generated/themes/Avatar.css.js +5 -5
  211. package/dist/generated/themes/Avatar.css.js.map +1 -0
  212. package/dist/generated/themes/AvatarGroup.css.d.ts +3 -0
  213. package/dist/generated/themes/AvatarGroup.css.js +5 -5
  214. package/dist/generated/themes/AvatarGroup.css.js.map +1 -0
  215. package/dist/generated/themes/Badge.css.d.ts +3 -0
  216. package/dist/generated/themes/Badge.css.js +5 -5
  217. package/dist/generated/themes/Badge.css.js.map +1 -0
  218. package/dist/generated/themes/Breadcrumbs.css.d.ts +3 -0
  219. package/dist/generated/themes/Breadcrumbs.css.js +5 -5
  220. package/dist/generated/themes/Breadcrumbs.css.js.map +1 -0
  221. package/dist/generated/themes/BreadcrumbsPopover.css.d.ts +3 -0
  222. package/dist/generated/themes/BreadcrumbsPopover.css.js +5 -5
  223. package/dist/generated/themes/BreadcrumbsPopover.css.js.map +1 -0
  224. package/dist/generated/themes/BrowserScrollbar.css.d.ts +3 -0
  225. package/dist/generated/themes/BrowserScrollbar.css.js +5 -5
  226. package/dist/generated/themes/BrowserScrollbar.css.js.map +1 -0
  227. package/dist/generated/themes/BusyIndicator.css.d.ts +3 -0
  228. package/dist/generated/themes/BusyIndicator.css.js +5 -5
  229. package/dist/generated/themes/BusyIndicator.css.js.map +1 -0
  230. package/dist/generated/themes/Button.css.d.ts +3 -0
  231. package/dist/generated/themes/Button.css.js +5 -5
  232. package/dist/generated/themes/Button.css.js.map +1 -0
  233. package/dist/generated/themes/Calendar.css.d.ts +3 -0
  234. package/dist/generated/themes/Calendar.css.js +5 -5
  235. package/dist/generated/themes/Calendar.css.js.map +1 -0
  236. package/dist/generated/themes/CalendarHeader.css.d.ts +3 -0
  237. package/dist/generated/themes/CalendarHeader.css.js +5 -5
  238. package/dist/generated/themes/CalendarHeader.css.js.map +1 -0
  239. package/dist/generated/themes/Card.css.d.ts +3 -0
  240. package/dist/generated/themes/Card.css.js +5 -5
  241. package/dist/generated/themes/Card.css.js.map +1 -0
  242. package/dist/generated/themes/CardHeader.css.d.ts +3 -0
  243. package/dist/generated/themes/CardHeader.css.js +5 -5
  244. package/dist/generated/themes/CardHeader.css.js.map +1 -0
  245. package/dist/generated/themes/Carousel.css.d.ts +3 -0
  246. package/dist/generated/themes/Carousel.css.js +5 -5
  247. package/dist/generated/themes/Carousel.css.js.map +1 -0
  248. package/dist/generated/themes/CheckBox.css.d.ts +3 -0
  249. package/dist/generated/themes/CheckBox.css.js +5 -5
  250. package/dist/generated/themes/CheckBox.css.js.map +1 -0
  251. package/dist/generated/themes/ColorPalette.css.d.ts +3 -0
  252. package/dist/generated/themes/ColorPalette.css.js +5 -5
  253. package/dist/generated/themes/ColorPalette.css.js.map +1 -0
  254. package/dist/generated/themes/ColorPaletteItem.css.d.ts +3 -0
  255. package/dist/generated/themes/ColorPaletteItem.css.js +5 -5
  256. package/dist/generated/themes/ColorPaletteItem.css.js.map +1 -0
  257. package/dist/generated/themes/ColorPalettePopover.css.d.ts +3 -0
  258. package/dist/generated/themes/ColorPalettePopover.css.js +5 -5
  259. package/dist/generated/themes/ColorPalettePopover.css.js.map +1 -0
  260. package/dist/generated/themes/ColorPaletteStaticArea.css.d.ts +3 -0
  261. package/dist/generated/themes/ColorPaletteStaticArea.css.js +5 -5
  262. package/dist/generated/themes/ColorPaletteStaticArea.css.js.map +1 -0
  263. package/dist/generated/themes/ColorPicker.css.d.ts +3 -0
  264. package/dist/generated/themes/ColorPicker.css.js +5 -5
  265. package/dist/generated/themes/ColorPicker.css.js.map +1 -0
  266. package/dist/generated/themes/ComboBox.css.d.ts +3 -0
  267. package/dist/generated/themes/ComboBox.css.js +5 -5
  268. package/dist/generated/themes/ComboBox.css.js.map +1 -0
  269. package/dist/generated/themes/ComboBoxPopover.css.d.ts +3 -0
  270. package/dist/generated/themes/ComboBoxPopover.css.js +5 -5
  271. package/dist/generated/themes/ComboBoxPopover.css.js.map +1 -0
  272. package/dist/generated/themes/CustomListItem.css.d.ts +3 -0
  273. package/dist/generated/themes/CustomListItem.css.js +5 -5
  274. package/dist/generated/themes/CustomListItem.css.js.map +1 -0
  275. package/dist/generated/themes/DatePicker.css.d.ts +3 -0
  276. package/dist/generated/themes/DatePicker.css.js +5 -5
  277. package/dist/generated/themes/DatePicker.css.js.map +1 -0
  278. package/dist/generated/themes/DatePickerPopover.css.d.ts +3 -0
  279. package/dist/generated/themes/DatePickerPopover.css.js +5 -5
  280. package/dist/generated/themes/DatePickerPopover.css.js.map +1 -0
  281. package/dist/generated/themes/DateRangePicker.css.d.ts +3 -0
  282. package/dist/generated/themes/DateRangePicker.css.js +5 -5
  283. package/dist/generated/themes/DateRangePicker.css.js.map +1 -0
  284. package/dist/generated/themes/DateTimePicker.css.d.ts +3 -0
  285. package/dist/generated/themes/DateTimePicker.css.js +5 -5
  286. package/dist/generated/themes/DateTimePicker.css.js.map +1 -0
  287. package/dist/generated/themes/DateTimePickerPopover.css.d.ts +3 -0
  288. package/dist/generated/themes/DateTimePickerPopover.css.js +5 -5
  289. package/dist/generated/themes/DateTimePickerPopover.css.js.map +1 -0
  290. package/dist/generated/themes/DayPicker.css.d.ts +3 -0
  291. package/dist/generated/themes/DayPicker.css.js +5 -5
  292. package/dist/generated/themes/DayPicker.css.js.map +1 -0
  293. package/dist/generated/themes/Dialog.css.d.ts +3 -0
  294. package/dist/generated/themes/Dialog.css.js +5 -5
  295. package/dist/generated/themes/Dialog.css.js.map +1 -0
  296. package/dist/generated/themes/FileUploader.css.d.ts +3 -0
  297. package/dist/generated/themes/FileUploader.css.js +5 -5
  298. package/dist/generated/themes/FileUploader.css.js.map +1 -0
  299. package/dist/generated/themes/GroupHeaderListItem.css.d.ts +3 -0
  300. package/dist/generated/themes/GroupHeaderListItem.css.js +5 -5
  301. package/dist/generated/themes/GroupHeaderListItem.css.js.map +1 -0
  302. package/dist/generated/themes/GrowingButton.css.d.ts +3 -0
  303. package/dist/generated/themes/GrowingButton.css.js +5 -5
  304. package/dist/generated/themes/GrowingButton.css.js.map +1 -0
  305. package/dist/generated/themes/Icon.css.d.ts +3 -0
  306. package/dist/generated/themes/Icon.css.js +5 -5
  307. package/dist/generated/themes/Icon.css.js.map +1 -0
  308. package/dist/generated/themes/Input.css.d.ts +3 -0
  309. package/dist/generated/themes/Input.css.js +5 -5
  310. package/dist/generated/themes/Input.css.js.map +1 -0
  311. package/dist/generated/themes/InputIcon.css.d.ts +3 -0
  312. package/dist/generated/themes/InputIcon.css.js +5 -5
  313. package/dist/generated/themes/InputIcon.css.js.map +1 -0
  314. package/dist/generated/themes/InvisibleTextStyles.css.d.ts +3 -0
  315. package/dist/generated/themes/InvisibleTextStyles.css.js +5 -5
  316. package/dist/generated/themes/InvisibleTextStyles.css.js.map +1 -0
  317. package/dist/generated/themes/Label.css.d.ts +3 -0
  318. package/dist/generated/themes/Label.css.js +5 -5
  319. package/dist/generated/themes/Label.css.js.map +1 -0
  320. package/dist/generated/themes/Link.css.d.ts +3 -0
  321. package/dist/generated/themes/Link.css.js +5 -5
  322. package/dist/generated/themes/Link.css.js.map +1 -0
  323. package/dist/generated/themes/List.css.d.ts +3 -0
  324. package/dist/generated/themes/List.css.js +5 -5
  325. package/dist/generated/themes/List.css.js.map +1 -0
  326. package/dist/generated/themes/ListItem.css.d.ts +3 -0
  327. package/dist/generated/themes/ListItem.css.js +5 -5
  328. package/dist/generated/themes/ListItem.css.js.map +1 -0
  329. package/dist/generated/themes/ListItemBase.css.d.ts +3 -0
  330. package/dist/generated/themes/ListItemBase.css.js +5 -5
  331. package/dist/generated/themes/ListItemBase.css.js.map +1 -0
  332. package/dist/generated/themes/Menu.css.d.ts +3 -0
  333. package/dist/generated/themes/Menu.css.js +5 -5
  334. package/dist/generated/themes/Menu.css.js.map +1 -0
  335. package/dist/generated/themes/MessageStrip.css.d.ts +3 -0
  336. package/dist/generated/themes/MessageStrip.css.js +5 -5
  337. package/dist/generated/themes/MessageStrip.css.js.map +1 -0
  338. package/dist/generated/themes/MonthPicker.css.d.ts +3 -0
  339. package/dist/generated/themes/MonthPicker.css.js +5 -5
  340. package/dist/generated/themes/MonthPicker.css.js.map +1 -0
  341. package/dist/generated/themes/MultiComboBox.css.d.ts +3 -0
  342. package/dist/generated/themes/MultiComboBox.css.js +5 -5
  343. package/dist/generated/themes/MultiComboBox.css.js.map +1 -0
  344. package/dist/generated/themes/MultiComboBoxPopover.css.d.ts +3 -0
  345. package/dist/generated/themes/MultiComboBoxPopover.css.js +5 -5
  346. package/dist/generated/themes/MultiComboBoxPopover.css.js.map +1 -0
  347. package/dist/generated/themes/MultiInput.css.d.ts +3 -0
  348. package/dist/generated/themes/MultiInput.css.js +5 -5
  349. package/dist/generated/themes/MultiInput.css.js.map +1 -0
  350. package/dist/generated/themes/Panel.css.d.ts +3 -0
  351. package/dist/generated/themes/Panel.css.js +5 -5
  352. package/dist/generated/themes/Panel.css.js.map +1 -0
  353. package/dist/generated/themes/Popover.css.d.ts +3 -0
  354. package/dist/generated/themes/Popover.css.js +5 -5
  355. package/dist/generated/themes/Popover.css.js.map +1 -0
  356. package/dist/generated/themes/Popup.css.d.ts +3 -0
  357. package/dist/generated/themes/Popup.css.js +5 -5
  358. package/dist/generated/themes/Popup.css.js.map +1 -0
  359. package/dist/generated/themes/PopupGlobal.css.d.ts +3 -0
  360. package/dist/generated/themes/PopupGlobal.css.js +5 -5
  361. package/dist/generated/themes/PopupGlobal.css.js.map +1 -0
  362. package/dist/generated/themes/PopupStaticAreaStyles.css.d.ts +3 -0
  363. package/dist/generated/themes/PopupStaticAreaStyles.css.js +5 -5
  364. package/dist/generated/themes/PopupStaticAreaStyles.css.js.map +1 -0
  365. package/dist/generated/themes/PopupsCommon.css.d.ts +3 -0
  366. package/dist/generated/themes/PopupsCommon.css.js +5 -5
  367. package/dist/generated/themes/PopupsCommon.css.js.map +1 -0
  368. package/dist/generated/themes/ProgressIndicator.css.d.ts +3 -0
  369. package/dist/generated/themes/ProgressIndicator.css.js +5 -5
  370. package/dist/generated/themes/ProgressIndicator.css.js.map +1 -0
  371. package/dist/generated/themes/RadioButton.css.d.ts +3 -0
  372. package/dist/generated/themes/RadioButton.css.js +5 -5
  373. package/dist/generated/themes/RadioButton.css.js.map +1 -0
  374. package/dist/generated/themes/RangeSlider.css.d.ts +3 -0
  375. package/dist/generated/themes/RangeSlider.css.js +5 -5
  376. package/dist/generated/themes/RangeSlider.css.js.map +1 -0
  377. package/dist/generated/themes/RatingIndicator.css.d.ts +3 -0
  378. package/dist/generated/themes/RatingIndicator.css.js +5 -5
  379. package/dist/generated/themes/RatingIndicator.css.js.map +1 -0
  380. package/dist/generated/themes/ResponsivePopover.css.d.ts +3 -0
  381. package/dist/generated/themes/ResponsivePopover.css.js +5 -5
  382. package/dist/generated/themes/ResponsivePopover.css.js.map +1 -0
  383. package/dist/generated/themes/ResponsivePopoverCommon.css.d.ts +3 -0
  384. package/dist/generated/themes/ResponsivePopoverCommon.css.js +5 -5
  385. package/dist/generated/themes/ResponsivePopoverCommon.css.js.map +1 -0
  386. package/dist/generated/themes/SegmentedButton.css.d.ts +3 -0
  387. package/dist/generated/themes/SegmentedButton.css.js +5 -5
  388. package/dist/generated/themes/SegmentedButton.css.js.map +1 -0
  389. package/dist/generated/themes/Select.css.d.ts +3 -0
  390. package/dist/generated/themes/Select.css.js +5 -5
  391. package/dist/generated/themes/Select.css.js.map +1 -0
  392. package/dist/generated/themes/SelectPopover.css.d.ts +3 -0
  393. package/dist/generated/themes/SelectPopover.css.js +5 -5
  394. package/dist/generated/themes/SelectPopover.css.js.map +1 -0
  395. package/dist/generated/themes/SliderBase.css.d.ts +3 -0
  396. package/dist/generated/themes/SliderBase.css.js +5 -5
  397. package/dist/generated/themes/SliderBase.css.js.map +1 -0
  398. package/dist/generated/themes/SplitButton.css.d.ts +3 -0
  399. package/dist/generated/themes/SplitButton.css.js +5 -5
  400. package/dist/generated/themes/SplitButton.css.js.map +1 -0
  401. package/dist/generated/themes/StepInput.css.d.ts +3 -0
  402. package/dist/generated/themes/StepInput.css.js +5 -5
  403. package/dist/generated/themes/StepInput.css.js.map +1 -0
  404. package/dist/generated/themes/Suggestions.css.d.ts +3 -0
  405. package/dist/generated/themes/Suggestions.css.js +5 -5
  406. package/dist/generated/themes/Suggestions.css.js.map +1 -0
  407. package/dist/generated/themes/Switch.css.d.ts +3 -0
  408. package/dist/generated/themes/Switch.css.js +5 -5
  409. package/dist/generated/themes/Switch.css.js.map +1 -0
  410. package/dist/generated/themes/Tab.css.d.ts +3 -0
  411. package/dist/generated/themes/Tab.css.js +5 -5
  412. package/dist/generated/themes/Tab.css.js.map +1 -0
  413. package/dist/generated/themes/TabContainer.css.d.ts +3 -0
  414. package/dist/generated/themes/TabContainer.css.js +5 -5
  415. package/dist/generated/themes/TabContainer.css.js.map +1 -0
  416. package/dist/generated/themes/TabInOverflow.css.d.ts +3 -0
  417. package/dist/generated/themes/TabInOverflow.css.js +5 -5
  418. package/dist/generated/themes/TabInOverflow.css.js.map +1 -0
  419. package/dist/generated/themes/TabInStrip.css.d.ts +3 -0
  420. package/dist/generated/themes/TabInStrip.css.js +5 -5
  421. package/dist/generated/themes/TabInStrip.css.js.map +1 -0
  422. package/dist/generated/themes/TabSemanticIcon.css.d.ts +3 -0
  423. package/dist/generated/themes/TabSemanticIcon.css.js +5 -5
  424. package/dist/generated/themes/TabSemanticIcon.css.js.map +1 -0
  425. package/dist/generated/themes/TabSeparatorInOverflow.css.d.ts +3 -0
  426. package/dist/generated/themes/TabSeparatorInOverflow.css.js +5 -5
  427. package/dist/generated/themes/TabSeparatorInOverflow.css.js.map +1 -0
  428. package/dist/generated/themes/TabSeparatorInStrip.css.d.ts +3 -0
  429. package/dist/generated/themes/TabSeparatorInStrip.css.js +5 -5
  430. package/dist/generated/themes/TabSeparatorInStrip.css.js.map +1 -0
  431. package/dist/generated/themes/Table.css.d.ts +3 -0
  432. package/dist/generated/themes/Table.css.js +5 -5
  433. package/dist/generated/themes/Table.css.js.map +1 -0
  434. package/dist/generated/themes/TableCell.css.d.ts +3 -0
  435. package/dist/generated/themes/TableCell.css.js +5 -5
  436. package/dist/generated/themes/TableCell.css.js.map +1 -0
  437. package/dist/generated/themes/TableColumn.css.d.ts +3 -0
  438. package/dist/generated/themes/TableColumn.css.js +5 -5
  439. package/dist/generated/themes/TableColumn.css.js.map +1 -0
  440. package/dist/generated/themes/TableGroupRow.css.d.ts +3 -0
  441. package/dist/generated/themes/TableGroupRow.css.js +5 -5
  442. package/dist/generated/themes/TableGroupRow.css.js.map +1 -0
  443. package/dist/generated/themes/TableRow.css.d.ts +3 -0
  444. package/dist/generated/themes/TableRow.css.js +5 -5
  445. package/dist/generated/themes/TableRow.css.js.map +1 -0
  446. package/dist/generated/themes/TapHighlightColor.css.d.ts +3 -0
  447. package/dist/generated/themes/TapHighlightColor.css.js +5 -5
  448. package/dist/generated/themes/TapHighlightColor.css.js.map +1 -0
  449. package/dist/generated/themes/TextArea.css.d.ts +3 -0
  450. package/dist/generated/themes/TextArea.css.js +5 -5
  451. package/dist/generated/themes/TextArea.css.js.map +1 -0
  452. package/dist/generated/themes/TimePicker.css.d.ts +3 -0
  453. package/dist/generated/themes/TimePicker.css.js +5 -5
  454. package/dist/generated/themes/TimePicker.css.js.map +1 -0
  455. package/dist/generated/themes/TimePickerPopover.css.d.ts +3 -0
  456. package/dist/generated/themes/TimePickerPopover.css.js +5 -5
  457. package/dist/generated/themes/TimePickerPopover.css.js.map +1 -0
  458. package/dist/generated/themes/TimeSelection.css.d.ts +3 -0
  459. package/dist/generated/themes/TimeSelection.css.js +5 -5
  460. package/dist/generated/themes/TimeSelection.css.js.map +1 -0
  461. package/dist/generated/themes/Title.css.d.ts +3 -0
  462. package/dist/generated/themes/Title.css.js +5 -5
  463. package/dist/generated/themes/Title.css.js.map +1 -0
  464. package/dist/generated/themes/Toast.css.d.ts +3 -0
  465. package/dist/generated/themes/Toast.css.js +5 -5
  466. package/dist/generated/themes/Toast.css.js.map +1 -0
  467. package/dist/generated/themes/ToggleButton.css.d.ts +3 -0
  468. package/dist/generated/themes/ToggleButton.css.js +5 -5
  469. package/dist/generated/themes/ToggleButton.css.js.map +1 -0
  470. package/dist/generated/themes/Token.css.d.ts +3 -0
  471. package/dist/generated/themes/Token.css.js +5 -5
  472. package/dist/generated/themes/Token.css.js.map +1 -0
  473. package/dist/generated/themes/Tokenizer.css.d.ts +3 -0
  474. package/dist/generated/themes/Tokenizer.css.js +5 -5
  475. package/dist/generated/themes/Tokenizer.css.js.map +1 -0
  476. package/dist/generated/themes/TokenizerPopover.css.d.ts +3 -0
  477. package/dist/generated/themes/TokenizerPopover.css.js +5 -5
  478. package/dist/generated/themes/TokenizerPopover.css.js.map +1 -0
  479. package/dist/generated/themes/Tree.css.d.ts +3 -0
  480. package/dist/generated/themes/Tree.css.js +5 -5
  481. package/dist/generated/themes/Tree.css.js.map +1 -0
  482. package/dist/generated/themes/TreeItem.css.d.ts +3 -0
  483. package/dist/generated/themes/TreeItem.css.js +5 -5
  484. package/dist/generated/themes/TreeItem.css.js.map +1 -0
  485. package/dist/generated/themes/ValueStateMessage.css.d.ts +3 -0
  486. package/dist/generated/themes/ValueStateMessage.css.js +5 -5
  487. package/dist/generated/themes/ValueStateMessage.css.js.map +1 -0
  488. package/dist/generated/themes/WheelSlider.css.d.ts +3 -0
  489. package/dist/generated/themes/WheelSlider.css.js +5 -5
  490. package/dist/generated/themes/WheelSlider.css.js.map +1 -0
  491. package/dist/generated/themes/YearPicker.css.d.ts +3 -0
  492. package/dist/generated/themes/YearPicker.css.js +5 -5
  493. package/dist/generated/themes/YearPicker.css.js.map +1 -0
  494. package/dist/generated/themes/sap_belize/parameters-bundle.css.d.ts +3 -0
  495. package/dist/generated/themes/sap_belize/parameters-bundle.css.js +3 -1
  496. package/dist/generated/themes/sap_belize/parameters-bundle.css.js.map +1 -0
  497. package/dist/generated/themes/sap_belize_hcb/parameters-bundle.css.d.ts +3 -0
  498. package/dist/generated/themes/sap_belize_hcb/parameters-bundle.css.js +3 -1
  499. package/dist/generated/themes/sap_belize_hcb/parameters-bundle.css.js.map +1 -0
  500. package/dist/generated/themes/sap_belize_hcw/parameters-bundle.css.d.ts +3 -0
  501. package/dist/generated/themes/sap_belize_hcw/parameters-bundle.css.js +3 -1
  502. package/dist/generated/themes/sap_belize_hcw/parameters-bundle.css.js.map +1 -0
  503. package/dist/generated/themes/sap_fiori_3/parameters-bundle.css.d.ts +3 -0
  504. package/dist/generated/themes/sap_fiori_3/parameters-bundle.css.js +3 -1
  505. package/dist/generated/themes/sap_fiori_3/parameters-bundle.css.js.map +1 -0
  506. package/dist/generated/themes/sap_fiori_3_dark/parameters-bundle.css.d.ts +3 -0
  507. package/dist/generated/themes/sap_fiori_3_dark/parameters-bundle.css.js +3 -1
  508. package/dist/generated/themes/sap_fiori_3_dark/parameters-bundle.css.js.map +1 -0
  509. package/dist/generated/themes/sap_fiori_3_hcb/parameters-bundle.css.d.ts +3 -0
  510. package/dist/generated/themes/sap_fiori_3_hcb/parameters-bundle.css.js +3 -1
  511. package/dist/generated/themes/sap_fiori_3_hcb/parameters-bundle.css.js.map +1 -0
  512. package/dist/generated/themes/sap_fiori_3_hcw/parameters-bundle.css.d.ts +3 -0
  513. package/dist/generated/themes/sap_fiori_3_hcw/parameters-bundle.css.js +3 -1
  514. package/dist/generated/themes/sap_fiori_3_hcw/parameters-bundle.css.js.map +1 -0
  515. package/dist/generated/themes/sap_horizon/parameters-bundle.css.d.ts +3 -0
  516. package/dist/generated/themes/sap_horizon/parameters-bundle.css.js +3 -1
  517. package/dist/generated/themes/sap_horizon/parameters-bundle.css.js.map +1 -0
  518. package/dist/generated/themes/sap_horizon_dark/parameters-bundle.css.d.ts +3 -0
  519. package/dist/generated/themes/sap_horizon_dark/parameters-bundle.css.js +3 -1
  520. package/dist/generated/themes/sap_horizon_dark/parameters-bundle.css.js.map +1 -0
  521. package/dist/generated/themes/sap_horizon_exp/parameters-bundle.css.d.ts +3 -0
  522. package/dist/generated/themes/sap_horizon_exp/parameters-bundle.css.js +3 -1
  523. package/dist/generated/themes/sap_horizon_exp/parameters-bundle.css.js.map +1 -0
  524. package/dist/generated/themes/sap_horizon_hcb/parameters-bundle.css.d.ts +3 -0
  525. package/dist/generated/themes/sap_horizon_hcb/parameters-bundle.css.js +3 -1
  526. package/dist/generated/themes/sap_horizon_hcb/parameters-bundle.css.js.map +1 -0
  527. package/dist/generated/themes/sap_horizon_hcw/parameters-bundle.css.d.ts +3 -0
  528. package/dist/generated/themes/sap_horizon_hcw/parameters-bundle.css.js +3 -1
  529. package/dist/generated/themes/sap_horizon_hcw/parameters-bundle.css.js.map +1 -0
  530. package/dist/i18n/messagebundle.properties +1 -1
  531. package/dist/types/PopupAccessibleRole.d.ts +30 -0
  532. package/dist/types/PopupAccessibleRole.js +32 -0
  533. package/dist/types/PopupAccessibleRole.js.map +1 -0
  534. package/global.d.ts +2 -2
  535. package/package.json +7 -7
  536. package/src/{Assets-static.js → Assets-static.ts} +0 -0
  537. package/src/{Assets.js → Assets.ts} +0 -0
  538. package/src/Avatar.ts +2 -4
  539. package/src/AvatarGroup.js +2 -19
  540. package/src/Badge.ts +2 -4
  541. package/src/Breadcrumbs.ts +7 -16
  542. package/src/BreadcrumbsItem.ts +1 -0
  543. package/src/{BusyIndicator.js → BusyIndicator.ts} +92 -99
  544. package/src/Button.ts +3 -4
  545. package/src/Calendar.ts +1 -1
  546. package/src/CalendarDate.ts +1 -0
  547. package/src/CalendarHeader.ts +2 -4
  548. package/src/Card.ts +3 -5
  549. package/src/CardHeader.ts +8 -10
  550. package/src/Carousel.hbs +3 -3
  551. package/src/{Carousel.js → Carousel.ts} +236 -230
  552. package/src/CheckBox.ts +4 -6
  553. package/src/ColorPalette.ts +3 -5
  554. package/src/ColorPaletteItem.ts +2 -3
  555. package/src/ColorPalettePopover.ts +8 -16
  556. package/src/ColorPicker.ts +7 -9
  557. package/src/ComboBox.js +2 -2
  558. package/src/ComboBoxGroupItem.js +1 -0
  559. package/src/ComboBoxItem.js +1 -0
  560. package/src/DatePicker.ts +8 -11
  561. package/src/DateRangePicker.ts +5 -3
  562. package/src/DateTimePicker.ts +7 -15
  563. package/src/DayPicker.ts +4 -5
  564. package/src/Dialog.ts +26 -15
  565. package/src/FileUploader.ts +7 -8
  566. package/src/GroupHeaderListItem.ts +1 -3
  567. package/src/Input.ts +47 -30
  568. package/src/Link.ts +0 -1
  569. package/src/List.ts +5 -8
  570. package/src/ListItem.ts +13 -12
  571. package/src/Menu.ts +13 -18
  572. package/src/MenuItem.ts +1 -0
  573. package/src/MessageStrip.ts +6 -7
  574. package/src/MonthPicker.ts +1 -3
  575. package/src/MultiComboBox.js +6 -2
  576. package/src/MultiComboBoxGroupItem.js +1 -0
  577. package/src/MultiComboBoxItem.js +1 -0
  578. package/src/MultiInput.js +1 -1
  579. package/src/Option.ts +119 -0
  580. package/src/Panel.ts +1 -3
  581. package/src/Popover.ts +9 -10
  582. package/src/Popup.ts +34 -19
  583. package/src/ProgressIndicator.ts +4 -6
  584. package/src/RadioButton.hbs +5 -6
  585. package/src/RadioButton.ts +530 -0
  586. package/src/{RadioButtonGroup.js → RadioButtonGroup.ts} +59 -28
  587. package/src/RangeSlider.ts +5 -7
  588. package/src/ResponsivePopover.hbs +1 -0
  589. package/src/{ResponsivePopover.js → ResponsivePopover.ts} +70 -58
  590. package/src/SegmentedButton.js +3 -3
  591. package/src/SegmentedButtonItem.js +1 -0
  592. package/src/Select.hbs +1 -1
  593. package/src/{Select.js → Select.ts} +305 -265
  594. package/src/Slider.ts +1 -3
  595. package/src/SplitButton.ts +3 -5
  596. package/src/StandardListItem.ts +0 -1
  597. package/src/StepInput.ts +3 -5
  598. package/src/SuggestionGroupItem.ts +1 -0
  599. package/src/SuggestionItem.ts +9 -8
  600. package/src/TabContainer.js +1 -2
  601. package/src/Table.ts +5 -9
  602. package/src/TableGroupRow.ts +1 -4
  603. package/src/TableRow.ts +2 -5
  604. package/src/TimePicker.ts +2 -3
  605. package/src/TimePickerBase.ts +13 -13
  606. package/src/TimeSelection.ts +3 -5
  607. package/src/Tree.hbs +1 -1
  608. package/src/Tree.js +1 -1
  609. package/src/YearPicker.ts +2 -6
  610. package/src/features/ColorPaletteMoreColors.ts +3 -5
  611. package/src/features/InputSuggestions.ts +3 -8
  612. package/src/i18n/messagebundle.properties +1 -1
  613. package/src/themes/Avatar.css +11 -11
  614. package/src/types/PopupAccessibleRole.ts +34 -0
  615. package/.dev-server-port +0 -1
  616. package/src/Option.js +0 -136
  617. package/src/RadioButton.js +0 -535
@@ -1,4 +1,10 @@
1
1
  import UI5Element from "@ui5/webcomponents-base/dist/UI5Element.js";
2
+ import customElement from "@ui5/webcomponents-base/dist/decorators/customElement.js";
3
+ import languageAware from "@ui5/webcomponents-base/dist/decorators/languageAware.js";
4
+ import property from "@ui5/webcomponents-base/dist/decorators/property.js";
5
+ import event from "@ui5/webcomponents-base/dist/decorators/event.js";
6
+ import slot from "@ui5/webcomponents-base/dist/decorators/slot.js";
7
+ import fastNavigation from "@ui5/webcomponents-base/dist/decorators/fastNavigation.js";
2
8
  import litRender from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
3
9
  import Integer from "@ui5/webcomponents-base/dist/types/Integer.js";
4
10
  import {
@@ -9,7 +15,9 @@ import {
9
15
  isF7,
10
16
  } from "@ui5/webcomponents-base/dist/Keys.js";
11
17
  import { getI18nBundle } from "@ui5/webcomponents-base/dist/i18nBundle.js";
18
+ import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
12
19
  import ScrollEnablement from "@ui5/webcomponents-base/dist/delegate/ScrollEnablement.js";
20
+ import type { ScrollEnablementEventListenerParam } from "@ui5/webcomponents-base/dist/delegate/ScrollEnablement.js";
13
21
  import ResizeHandler from "@ui5/webcomponents-base/dist/delegate/ResizeHandler.js";
14
22
  import { renderFinished } from "@ui5/webcomponents-base/dist/Render.js";
15
23
  import { isDesktop } from "@ui5/webcomponents-base/dist/Device.js";
@@ -33,192 +41,9 @@ import Label from "./Label.js";
33
41
  // Styles
34
42
  import CarouselCss from "./generated/themes/Carousel.css.js";
35
43
 
36
- /**
37
- * @public
38
- */
39
- const metadata = {
40
- tag: "ui5-carousel",
41
- languageAware: true,
42
- fastNavigation: true,
43
- properties: /** @lends sap.ui.webc.main.Carousel.prototype */ {
44
- /**
45
- * Defines whether the carousel should loop, i.e show the first page after the last page is reached and vice versa.
46
- * @type {boolean}
47
- * @defaultvalue false
48
- * @public
49
- */
50
- cyclic: {
51
- type: Boolean,
52
- },
53
-
54
- /**
55
- * Defines the number of items per page on small size (up to 640px). One item per page shown by default.
56
- * @type {sap.ui.webc.base.types.Integer}
57
- * @defaultvalue 1
58
- * @public
59
- */
60
- itemsPerPageS: {
61
- type: Integer,
62
- defaultValue: 1,
63
- },
64
-
65
- /**
66
- * Defines the number of items per page on medium size (from 640px to 1024px). One item per page shown by default.
67
- * @type {sap.ui.webc.base.types.Integer}
68
- * @defaultvalue 1
69
- * @public
70
- */
71
- itemsPerPageM: {
72
- type: Integer,
73
- defaultValue: 1,
74
- },
75
-
76
- /**
77
- * Defines the number of items per page on large size (more than 1024px). One item per page shown by default.
78
- * @type {sap.ui.webc.base.types.Integer}
79
- * @defaultvalue 1
80
- * @public
81
- */
82
- itemsPerPageL: {
83
- type: Integer,
84
- defaultValue: 1,
85
- },
86
-
87
- /**
88
- * Defines the visibility of the navigation arrows.
89
- * If set to true the navigation arrows will be hidden.
90
- * <br><br>
91
- * <b>Note:</b> The navigation arrows are never displayed on touch devices.
92
- * In this case, the user can swipe to navigate through the items.
93
- * @type {boolean}
94
- * @since 1.0.0-rc.15
95
- * @defaultvalue false
96
- * @public
97
- */
98
- hideNavigationArrows: {
99
- type: Boolean,
100
- },
101
-
102
- /**
103
- * Defines the visibility of the page indicator.
104
- * If set to true the page indicator will be hidden.
105
- * @type {boolean}
106
- * @since 1.0.0-rc.15
107
- * @defaultvalue false
108
- * @public
109
- */
110
- hidePageIndicator: {
111
- type: Boolean,
112
- },
113
-
114
- /**
115
- * Defines the style of the page indicator.
116
- * Available options are:
117
- * <ul>
118
- * <li><code>Default</code> - The page indicator will be visualized as dots if there are fewer than 9 pages. If there are more pages, the page indicator will switch to displaying the current page and the total number of pages. (e.g. X of Y)</li>
119
- * <li><code>Numeric</code> - The page indicator will display the current page and the total number of pages. (e.g. X of Y)</li>
120
- * </ul>
121
- * @type {sap.ui.webc.main.types.CarouselPageIndicatorStyle}
122
- * @since 1.10
123
- * @defaultvalue "Default"
124
- * @public
125
- */
126
- pageIndicatorStyle: {
127
- type: CarouselPageIndicatorStyle,
128
- defaultValue: CarouselPageIndicatorStyle.Default,
129
- },
130
-
131
- /**
132
- * Defines the index of the initially selected item.
133
- * @type {sap.ui.webc.base.types.Integer}
134
- * @defaultvalue 0
135
- * @private
136
- */
137
- _selectedIndex: {
138
- type: Integer,
139
- defaultValue: 0,
140
- },
141
-
142
- /**
143
- * Defines the position of arrows.
144
- * <br><br>
145
- * Available options are:
146
- * <ul>
147
- * <li><code>Content</code></li>
148
- * <li><code>Navigation</code></li>
149
- * </ul>
150
- * <br>
151
- * When set to "Content", the arrows are placed on the sides of the current page.
152
- * <br>
153
- * When set to "Navigation", the arrows are placed on the sides of the page indicator.
154
- * @type {sap.ui.webc.main.types.CarouselArrowsPlacement}
155
- * @defaultvalue "Content"
156
- * @public
157
- */
158
- arrowsPlacement: {
159
- type: CarouselArrowsPlacement,
160
- defaultValue: CarouselArrowsPlacement.Content,
161
- },
162
-
163
- /**
164
- * Defines the carousel width in pixels.
165
- * @private
166
- */
167
- _width: {
168
- type: Integer,
169
- },
170
-
171
- /**
172
- * Defines the carousel item width in pixels.
173
- * @private
174
- */
175
- _itemWidth: {
176
- type: Integer,
177
- },
178
-
179
- /**
180
- * If set to true navigation arrows are shown.
181
- * @private
182
- * @since 1.0.0-rc.15
183
- */
184
- _visibleNavigationArrows: {
185
- type: Boolean,
186
- noAttribute: true,
187
- },
188
- },
189
- managedSlots: true,
190
- slots: /** @lends sap.ui.webc.main.Carousel.prototype */ {
191
- /**
192
- * Defines the content of the component.
193
- * @type {HTMLElement[]}
194
- * @slot content
195
- * @public
196
- */
197
- "default": {
198
- propertyName: "content",
199
- type: HTMLElement,
200
- individualSlots: true,
201
- },
202
- },
203
- events: /** @lends sap.ui.webc.main.Carousel.prototype */ {
204
-
205
- /**
206
- * Fired whenever the page changes due to user interaction,
207
- * when the user clicks on the navigation arrows or while resizing,
208
- * based on the <code>items-per-page-l</code>, <code>items-per-page-m</code> and <code>items-per-page-s</code> properties.
209
- *
210
- * @event
211
- * @param {Integer} selectedIndex the current selected index
212
- * @public
213
- * @since 1.0.0-rc.7
214
- */
215
- navigate: {
216
- detail: {
217
- selectedIndex: { type: Integer },
218
- },
219
- },
220
- },
221
- };
44
+ type CarouselNavigateEventDetail = {
45
+ selectedIndex: number;
46
+ }
222
47
 
223
48
  /**
224
49
  * @class
@@ -288,10 +113,179 @@ const metadata = {
288
113
  * @since 1.0.0-rc.6
289
114
  * @public
290
115
  */
116
+ @customElement("ui5-carousel")
117
+ @languageAware
118
+ @fastNavigation
119
+
120
+ /**
121
+ * Fired whenever the page changes due to user interaction,
122
+ * when the user clicks on the navigation arrows or while resizing,
123
+ * based on the <code>items-per-page-l</code>, <code>items-per-page-m</code> and <code>items-per-page-s</code> properties.
124
+ *
125
+ * @event sap.ui.webc.main.Carousel#navigate
126
+ * @param {Integer} selectedIndex the current selected index
127
+ * @public
128
+ * @since 1.0.0-rc.7
129
+ */
130
+ @event("navigate", {
131
+ detail: {
132
+ selectedIndex: { type: Integer },
133
+ },
134
+ })
135
+
291
136
  class Carousel extends UI5Element {
292
- static get metadata() {
293
- return metadata;
294
- }
137
+ /**
138
+ * Defines whether the carousel should loop, i.e show the first page after the last page is reached and vice versa.
139
+ * @type {boolean}
140
+ * @name sap.ui.webc.main.Carousel.prototype.cyclic
141
+ * @defaultvalue false
142
+ * @public
143
+ */
144
+ @property({ type: Boolean })
145
+ cyclic!: boolean;
146
+
147
+ /**
148
+ * Defines the number of items per page on small size (up to 640px). One item per page shown by default.
149
+ * @type {sap.ui.webc.base.types.Integer}
150
+ * @name sap.ui.webc.main.Carousel.prototype.itemsPerPageS
151
+ * @defaultvalue 1
152
+ * @public
153
+ */
154
+ @property({ validator: Integer, defaultValue: 1 })
155
+ itemsPerPageS!: number;
156
+
157
+ /**
158
+ * Defines the number of items per page on medium size (from 640px to 1024px). One item per page shown by default.
159
+ * @type {sap.ui.webc.base.types.Integer}
160
+ * @name sap.ui.webc.main.Carousel.prototype.itemsPerPageM
161
+ * @defaultvalue 1
162
+ * @public
163
+ */
164
+ @property({ validator: Integer, defaultValue: 1 })
165
+ itemsPerPageM!: number;
166
+
167
+ /**
168
+ * Defines the number of items per page on large size (more than 1024px). One item per page shown by default.
169
+ * @type {sap.ui.webc.base.types.Integer}
170
+ * @name sap.ui.webc.main.Carousel.prototype.itemsPerPageL
171
+ * @defaultvalue 1
172
+ * @public
173
+ */
174
+ @property({ validator: Integer, defaultValue: 1 })
175
+ itemsPerPageL!: number;
176
+
177
+ /**
178
+ * Defines the visibility of the navigation arrows.
179
+ * If set to true the navigation arrows will be hidden.
180
+ * <br><br>
181
+ * <b>Note:</b> The navigation arrows are never displayed on touch devices.
182
+ * In this case, the user can swipe to navigate through the items.
183
+ * @type {boolean}
184
+ * @name sap.ui.webc.main.Carousel.prototype.hideNavigationArrows
185
+ * @since 1.0.0-rc.15
186
+ * @defaultvalue false
187
+ * @public
188
+ */
189
+ @property({ type: Boolean })
190
+ hideNavigationArrows!: boolean;
191
+
192
+ /**
193
+ * Defines the visibility of the page indicator.
194
+ * If set to true the page indicator will be hidden.
195
+ * @type {boolean}
196
+ * @name sap.ui.webc.main.Carousel.prototype.hidePageIndicator
197
+ * @since 1.0.0-rc.15
198
+ * @defaultvalue false
199
+ * @public
200
+ */
201
+ @property({ type: Boolean })
202
+ hidePageIndicator!: boolean;
203
+
204
+ /**
205
+ * Defines the style of the page indicator.
206
+ * Available options are:
207
+ * <ul>
208
+ * <li><code>Default</code> - The page indicator will be visualized as dots if there are fewer than 9 pages. If there are more pages, the page indicator will switch to displaying the current page and the total number of pages. (e.g. X of Y)</li>
209
+ * <li><code>Numeric</code> - The page indicator will display the current page and the total number of pages. (e.g. X of Y)</li>
210
+ * </ul>
211
+ * @type {sap.ui.webc.main.types.CarouselPageIndicatorStyle}
212
+ * @name sap.ui.webc.main.Carousel.prototype.pageIndicatorStyle
213
+ * @since 1.10
214
+ * @defaultvalue "Default"
215
+ * @public
216
+ */
217
+ @property({ type: CarouselPageIndicatorStyle, defaultValue: CarouselPageIndicatorStyle.Default })
218
+ pageIndicatorStyle!: CarouselPageIndicatorStyle;
219
+
220
+ /**
221
+ * Defines the index of the initially selected item.
222
+ * @type {sap.ui.webc.base.types.Integer}
223
+ * @name sap.ui.webc.main.Carousel.prototype._selectedIndex
224
+ * @defaultvalue 0
225
+ * @private
226
+ */
227
+ @property({ validator: Integer, defaultValue: 0 })
228
+ _selectedIndex!: number;
229
+
230
+ /**
231
+ * Defines the position of arrows.
232
+ * <br><br>
233
+ * Available options are:
234
+ * <ul>
235
+ * <li><code>Content</code></li>
236
+ * <li><code>Navigation</code></li>
237
+ * </ul>
238
+ * <br>
239
+ * When set to "Content", the arrows are placed on the sides of the current page.
240
+ * <br>
241
+ * When set to "Navigation", the arrows are placed on the sides of the page indicator.
242
+ * @type {sap.ui.webc.main.types.CarouselArrowsPlacement}
243
+ * @name sap.ui.webc.main.Carousel.prototype.arrowsPlacement
244
+ * @defaultvalue "Content"
245
+ * @public
246
+ */
247
+ @property({ type: CarouselArrowsPlacement, defaultValue: CarouselArrowsPlacement.Content })
248
+ arrowsPlacement!: CarouselArrowsPlacement;
249
+
250
+ /**
251
+ * Defines the carousel width in pixels.
252
+ * @private
253
+ */
254
+ @property({ validator: Integer })
255
+ _width?: number;
256
+
257
+ /**
258
+ * Defines the carousel item width in pixels.
259
+ * @private
260
+ */
261
+ @property({ validator: Integer })
262
+ _itemWidth?: number;
263
+
264
+ /**
265
+ * If set to true navigation arrows are shown.
266
+ * @private
267
+ * @since 1.0.0-rc.15
268
+ */
269
+ @property({ type: Boolean, noAttribute: true })
270
+ _visibleNavigationArrows!: boolean;
271
+
272
+ _scrollEnablement: ScrollEnablement;
273
+ _onResizeBound: () => void;
274
+ _resizing: boolean;
275
+ _lastFocusedElements: Array<HTMLElement>;
276
+ _orderOfLastFocusedPages: Array<number>;
277
+
278
+ /**
279
+ * Defines the content of the component.
280
+ * @type {HTMLElement[]}
281
+ * @slot
282
+ * @name sap.ui.webc.main.Carousel.prototype.default
283
+ * @public
284
+ */
285
+ @slot({ "default": true, type: HTMLElement, individualSlots: true })
286
+ content!: Array<HTMLElement>;
287
+
288
+ static i18nBundle: I18nBundle;
295
289
 
296
290
  static get render() {
297
291
  return litRender;
@@ -313,8 +307,8 @@ class Carousel extends UI5Element {
313
307
  super();
314
308
 
315
309
  this._scrollEnablement = new ScrollEnablement(this);
316
- this._scrollEnablement.attachEvent("touchend", event => {
317
- this._updateScrolling(event);
310
+ this._scrollEnablement.attachEvent("touchend", e => {
311
+ this._updateScrolling(e);
318
312
  });
319
313
  this._onResizeBound = this._onResize.bind(this);
320
314
  this._resizing = false; // indicates if the carousel is in process of resizing
@@ -332,7 +326,7 @@ class Carousel extends UI5Element {
332
326
  }
333
327
 
334
328
  onAfterRendering() {
335
- this._scrollEnablement.scrollContainer = this.getDomRef();
329
+ this._scrollEnablement.scrollContainer = this.getDomRef()!;
336
330
  this._resizing = false; // not invalidating
337
331
  }
338
332
 
@@ -368,52 +362,53 @@ class Carousel extends UI5Element {
368
362
 
369
363
  if (this._selectedIndex > this.pagesCount - 1) {
370
364
  this._selectedIndex = this.pagesCount - 1;
371
- this.fireEvent("navigate", { selectedIndex: this._selectedIndex });
365
+ this.fireEvent<CarouselNavigateEventDetail>("navigate", { selectedIndex: this._selectedIndex });
372
366
  }
373
367
  }
374
368
 
375
- _updateScrolling(event) {
376
- if (!event) {
369
+ _updateScrolling(e: ScrollEnablementEventListenerParam) {
370
+ if (!e) {
377
371
  return;
378
372
  }
379
373
 
380
- if (event.isLeft) {
374
+ if (e.isLeft) {
381
375
  this.navigateLeft();
382
- } else if (event.isRight) {
376
+ } else if (e.isRight) {
383
377
  this.navigateRight();
384
378
  }
385
379
  }
386
380
 
387
- async _onkeydown(event) {
388
- if (isF7(event)) {
389
- this._handleF7Key(event);
381
+ async _onkeydown(e: KeyboardEvent) {
382
+ if (isF7(e)) {
383
+ this._handleF7Key(e);
390
384
  return;
391
385
  }
392
386
 
393
- if (event.target !== this.getDomRef()) {
387
+ if (e.target !== this.getDomRef()) {
394
388
  return;
395
389
  }
396
390
 
397
- if (isLeft(event) || isDown(event)) {
391
+ if (isLeft(e) || isDown(e)) {
398
392
  this.navigateLeft();
399
393
  await renderFinished();
400
- this.getDomRef().focus();
401
- } else if (isRight(event) || isUp(event)) {
394
+ this.getDomRef()!.focus();
395
+ } else if (isRight(e) || isUp(e)) {
402
396
  this.navigateRight();
403
397
  await renderFinished();
404
- this.getDomRef().focus();
398
+ this.getDomRef()!.focus();
405
399
  }
406
400
  }
407
401
 
408
- _onfocusin(event) {
409
- if (event.target === this.getDomRef()) {
402
+ _onfocusin(e: FocusEvent) {
403
+ const target = e.target as HTMLElement;
404
+
405
+ if (target === this.getDomRef()) {
410
406
  return;
411
407
  }
412
408
 
413
409
  let pageIndex = -1;
414
-
415
410
  for (let i = 0; i < this.content.length; i++) {
416
- if (this.content[i].contains(event.target)) {
411
+ if (this.content[i].contains(target)) {
417
412
  pageIndex = i;
418
413
  break;
419
414
  }
@@ -424,7 +419,7 @@ class Carousel extends UI5Element {
424
419
  }
425
420
 
426
421
  // Save reference of the last focused element for each page
427
- this._lastFocusedElements[pageIndex] = event.target;
422
+ this._lastFocusedElements[pageIndex] = target;
428
423
 
429
424
  const sortedPageIndex = this._orderOfLastFocusedPages.indexOf(pageIndex);
430
425
  if (sortedPageIndex === -1) {
@@ -446,13 +441,13 @@ class Carousel extends UI5Element {
446
441
  }
447
442
  }
448
443
 
449
- _handleF7Key(event) {
444
+ _handleF7Key(e: KeyboardEvent) {
450
445
  const lastFocusedElement = this._lastFocusedElements[this._getLastFocusedActivePageIndex];
451
446
 
452
- if (event.target === this.getDomRef() && lastFocusedElement) {
447
+ if (e.target === this.getDomRef() && lastFocusedElement) {
453
448
  lastFocusedElement.focus();
454
449
  } else {
455
- this.getDomRef().focus();
450
+ this.getDomRef()!.focus();
456
451
  }
457
452
  }
458
453
 
@@ -482,7 +477,7 @@ class Carousel extends UI5Element {
482
477
  }
483
478
 
484
479
  if (previousSelectedIndex !== this._selectedIndex) {
485
- this.fireEvent("navigate", { selectedIndex: this._selectedIndex });
480
+ this.fireEvent<CarouselNavigateEventDetail>("navigate", { selectedIndex: this._selectedIndex });
486
481
  }
487
482
  }
488
483
 
@@ -502,12 +497,13 @@ class Carousel extends UI5Element {
502
497
  }
503
498
 
504
499
  if (previousSelectedIndex !== this._selectedIndex) {
505
- this.fireEvent("navigate", { selectedIndex: this._selectedIndex });
500
+ this.fireEvent<CarouselNavigateEventDetail>("navigate", { selectedIndex: this._selectedIndex });
506
501
  }
507
502
  }
508
503
 
509
- _navButtonClick(event) {
510
- if (event.target.hasAttribute("arrow-forward")) {
504
+ _navButtonClick(e: MouseEvent) {
505
+ const button = e.target as Button;
506
+ if (button.hasAttribute("arrow-forward")) {
511
507
  this.navigateRight();
512
508
  } else {
513
509
  this.navigateLeft();
@@ -520,9 +516,11 @@ class Carousel extends UI5Element {
520
516
  * Changes the currently displayed page.
521
517
  * @param {Integer} itemIndex The index of the target page
522
518
  * @since 1.0.0-rc.15
519
+ * @method
520
+ * @name sap.ui.webc.main.Carousel#navigateTo
523
521
  * @public
524
522
  */
525
- navigateTo(itemIndex) {
523
+ navigateTo(itemIndex: number) {
526
524
  this._resizing = false;
527
525
  this._selectedIndex = itemIndex;
528
526
  }
@@ -538,17 +536,21 @@ class Carousel extends UI5Element {
538
536
  id: `${this._id}-carousel-item-${idx + 1}`,
539
537
  item,
540
538
  tabIndex: visible ? "0" : "-1",
541
- posinset: idx + 1,
542
- setsize: this.content.length,
539
+ posinset: `${idx + 1}`,
540
+ setsize: `${this.content.length}`,
543
541
  styles: {
544
- width: `${this._itemWidth}px`,
542
+ width: `${this._itemWidth || 0}px`,
545
543
  },
546
544
  classes: visible ? "" : "ui5-carousel-item--hidden",
547
545
  };
548
546
  });
549
547
  }
550
548
 
551
- get effectiveItemsPerPage() {
549
+ get effectiveItemsPerPage(): number {
550
+ if (!this._width) {
551
+ return this.itemsPerPageL;
552
+ }
553
+
552
554
  if (this._width <= 640) {
553
555
  return this.itemsPerPageS;
554
556
  }
@@ -560,11 +562,11 @@ class Carousel extends UI5Element {
560
562
  return this.itemsPerPageL;
561
563
  }
562
564
 
563
- isItemInViewport(index) {
565
+ isItemInViewport(index: number): boolean {
564
566
  return index >= this._selectedIndex && index <= this._selectedIndex + this.effectiveItemsPerPage - 1;
565
567
  }
566
568
 
567
- isIndexInRange(index) {
569
+ isIndexInRange(index: number): boolean {
568
570
  return index >= 0 && index <= this.pagesCount - 1;
569
571
  }
570
572
 
@@ -592,9 +594,10 @@ class Carousel extends UI5Element {
592
594
  }
593
595
 
594
596
  get styles() {
597
+ const items = this._itemWidth || 0;
595
598
  return {
596
599
  content: {
597
- transform: `translateX(${this._isRTL ? "" : "-"}${this._selectedIndex * this._itemWidth}px`,
600
+ transform: `translateX(${this._isRTL ? "" : "-"}${this._selectedIndex * items}px`,
598
601
  },
599
602
  };
600
603
  }
@@ -651,12 +654,12 @@ class Carousel extends UI5Element {
651
654
  return dots;
652
655
  }
653
656
 
654
- get arrows() {
655
- const showArrows = this._visibleNavigationArrows && this.hasManyPages && isDesktop();
657
+ get showArrows() {
658
+ const displayArrows = this._visibleNavigationArrows && this.hasManyPages && isDesktop();
656
659
 
657
660
  return {
658
- content: !this.hideNavigationArrows && showArrows && this.arrowsPlacement === CarouselArrowsPlacement.Content,
659
- navigation: !this.hideNavigationArrows && showArrows && this.arrowsPlacement === CarouselArrowsPlacement.Navigation,
661
+ content: !this.hideNavigationArrows && displayArrows && this.arrowsPlacement === CarouselArrowsPlacement.Content,
662
+ navigation: !this.hideNavigationArrows && displayArrows && this.arrowsPlacement === CarouselArrowsPlacement.Navigation,
660
663
  };
661
664
  }
662
665
 
@@ -703,7 +706,7 @@ class Carousel extends UI5Element {
703
706
  * @returns {Integer[]} the indices of the visible items
704
707
  */
705
708
  get visibleItemsIndices() {
706
- const visibleItemsIndices = [];
709
+ const visibleItemsIndices: Array<number> = [];
707
710
 
708
711
  this.items.forEach((item, index) => {
709
712
  if (this.isItemInViewport(index)) {
@@ -729,3 +732,6 @@ class Carousel extends UI5Element {
729
732
  Carousel.define();
730
733
 
731
734
  export default Carousel;
735
+ export type {
736
+ CarouselNavigateEventDetail,
737
+ };
package/src/CheckBox.ts CHANGED
@@ -8,7 +8,6 @@ import event from "@ui5/webcomponents-base/dist/decorators/event.js";
8
8
  import litRender from "@ui5/webcomponents-base/dist/renderer/LitRenderer.js";
9
9
  import { getI18nBundle } from "@ui5/webcomponents-base/dist/i18nBundle.js";
10
10
  import type I18nBundle from "@ui5/webcomponents-base/dist/i18nBundle.js";
11
- import type { I18nText } from "@ui5/webcomponents-base/dist/i18nBundle.js";
12
11
  import ValueState from "@ui5/webcomponents-base/dist/types/ValueState.js";
13
12
  import { getFeature } from "@ui5/webcomponents-base/dist/FeaturesRegistry.js";
14
13
  import { getEffectiveAriaLabelText } from "@ui5/webcomponents-base/dist/util/AriaLabelHelper.js";
@@ -21,7 +20,6 @@ import {
21
20
  VALUE_STATE_ERROR,
22
21
  VALUE_STATE_WARNING,
23
22
  VALUE_STATE_SUCCESS,
24
- // @ts-ignore
25
23
  } from "./generated/i18n/i18n-defaults.js";
26
24
 
27
25
  // Styles
@@ -131,7 +129,7 @@ class CheckBox extends UI5Element implements IFormElement {
131
129
  /**
132
130
  * Defines whether the component is read-only.
133
131
  * <br><br>
134
- * <b>Note:</b> A red-only component is not editable,
132
+ * <b>Note:</b> A read-only component is not editable,
135
133
  * but still provides visual feedback upon user interaction.
136
134
  *
137
135
  * @type {boolean}
@@ -388,9 +386,9 @@ class CheckBox extends UI5Element implements IFormElement {
388
386
 
389
387
  valueStateTextMappings() {
390
388
  return {
391
- "Error": CheckBox.i18nBundle.getText(VALUE_STATE_ERROR as I18nText),
392
- "Warning": CheckBox.i18nBundle.getText(VALUE_STATE_WARNING as I18nText),
393
- "Success": CheckBox.i18nBundle.getText(VALUE_STATE_SUCCESS as I18nText),
389
+ "Error": CheckBox.i18nBundle.getText(VALUE_STATE_ERROR),
390
+ "Warning": CheckBox.i18nBundle.getText(VALUE_STATE_WARNING),
391
+ "Success": CheckBox.i18nBundle.getText(VALUE_STATE_SUCCESS),
394
392
  };
395
393
  }
396
394