@ui5/webcomponents 1.10.0 → 1.10.1

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 (303) hide show
  1. package/CHANGELOG.md +101 -0
  2. package/LICENSE.txt +201 -0
  3. package/dist/Avatar.d.ts +2 -2
  4. package/dist/Badge.d.ts +3 -3
  5. package/dist/Breadcrumbs.d.ts +5 -5
  6. package/dist/Breadcrumbs.js +1 -1
  7. package/dist/BusyIndicator.d.ts +136 -0
  8. package/dist/BusyIndicator.js +126 -208
  9. package/dist/BusyIndicator.js.map +1 -0
  10. package/dist/Button.d.ts +3 -3
  11. package/dist/Calendar.d.ts +3 -3
  12. package/dist/Calendar.js +1 -1
  13. package/dist/CalendarHeader.d.ts +2 -2
  14. package/dist/Card.d.ts +3 -3
  15. package/dist/Card.js +1 -1
  16. package/dist/CardHeader.d.ts +2 -2
  17. package/dist/Carousel.d.ts +318 -0
  18. package/dist/Carousel.js +446 -642
  19. package/dist/Carousel.js.map +1 -0
  20. package/dist/CheckBox.d.ts +3 -3
  21. package/dist/ColorPalette.d.ts +5 -5
  22. package/dist/ColorPalette.js +1 -1
  23. package/dist/ColorPaletteItem.d.ts +2 -2
  24. package/dist/ColorPalettePopover.d.ts +2 -2
  25. package/dist/ColorPicker.d.ts +2 -2
  26. package/dist/ComboBox.js +2 -2
  27. package/dist/CustomListItem.d.ts +1 -1
  28. package/dist/DatePicker.d.ts +2 -2
  29. package/dist/DateTimePicker.d.ts +1 -1
  30. package/dist/DayPicker.d.ts +2 -2
  31. package/dist/Dialog.d.ts +4 -5
  32. package/dist/FileUploader.d.ts +4 -4
  33. package/dist/GroupHeaderListItem.d.ts +1 -1
  34. package/dist/Icon.d.ts +2 -2
  35. package/dist/Input.d.ts +5 -5
  36. package/dist/Input.js +1 -1
  37. package/dist/Label.d.ts +2 -2
  38. package/dist/Link.d.ts +2 -2
  39. package/dist/List.d.ts +4 -3
  40. package/dist/List.js +1 -1
  41. package/dist/ListItem.d.ts +1 -1
  42. package/dist/Menu.d.ts +3 -3
  43. package/dist/Menu.js +1 -1
  44. package/dist/MessageStrip.d.ts +2 -2
  45. package/dist/MonthPicker.d.ts +2 -2
  46. package/dist/MultiComboBox.js +6 -2
  47. package/dist/MultiInput.js +1 -1
  48. package/dist/Panel.d.ts +2 -2
  49. package/dist/Popover.d.ts +1 -1
  50. package/dist/Popup.d.ts +3 -3
  51. package/dist/ProgressIndicator.d.ts +2 -2
  52. package/dist/RangeSlider.d.ts +1 -1
  53. package/dist/ResponsivePopover.d.ts +1 -1
  54. package/dist/SegmentedButton.js +1 -1
  55. package/dist/Select.js +1 -1
  56. package/dist/Slider.d.ts +1 -1
  57. package/dist/SplitButton.d.ts +2 -2
  58. package/dist/StandardListItem.d.ts +2 -2
  59. package/dist/StepInput.d.ts +2 -2
  60. package/dist/SuggestionListItem.d.ts +1 -1
  61. package/dist/Switch.d.ts +2 -2
  62. package/dist/TabContainer.js +1 -2
  63. package/dist/Table.d.ts +6 -4
  64. package/dist/Table.js +1 -1
  65. package/dist/TableCell.d.ts +2 -2
  66. package/dist/TableColumn.d.ts +2 -2
  67. package/dist/TableGroupRow.d.ts +2 -2
  68. package/dist/TableRow.d.ts +2 -2
  69. package/dist/TimePickerBase.d.ts +4 -4
  70. package/dist/TimeSelection.d.ts +2 -2
  71. package/dist/Title.d.ts +2 -2
  72. package/dist/Tree.js +1 -1
  73. package/dist/WheelSlider.d.ts +2 -2
  74. package/dist/YearPicker.d.ts +2 -2
  75. package/dist/api.json +1 -1
  76. package/dist/assets/test/pages/72override.html.dda35518.css +1 -0
  77. package/dist/assets/test/pages/AnimanitionOff.html.b7566ecc.css +1 -0
  78. package/dist/assets/test/pages/Avatar.html.62cc0573.css +1 -0
  79. package/dist/assets/test/pages/AvatarGroup.html.20647fe1.css +1 -0
  80. package/dist/assets/test/pages/Badge.html.bcc1c9a3.css +1 -0
  81. package/dist/assets/test/pages/Breadcrumbs.html.5753069f.css +1 -0
  82. package/dist/assets/test/pages/BusyIndicator.html.ce95c23c.css +1 -0
  83. package/dist/assets/test/pages/Button.html.957848f0.css +1 -0
  84. package/dist/assets/test/pages/Calendar.html.9ff42e30.css +1 -0
  85. package/dist/assets/test/pages/Card.html.8c5e4756.css +1 -0
  86. package/dist/assets/test/pages/Carousel.html.fcdd32a7.css +1 -0
  87. package/dist/assets/test/pages/CheckBox.html.08ae630d.css +1 -0
  88. package/dist/assets/test/pages/ColorPalette.html.8c4c4ca3.css +1 -0
  89. package/dist/assets/test/pages/ColorPalettePopover.html.727f90e2.css +1 -0
  90. package/dist/assets/test/pages/ColorPicker.html.cc0c0d29.css +1 -0
  91. package/dist/assets/test/pages/ComboBox.html.14fbc3aa.css +1 -0
  92. package/dist/assets/test/pages/ComboBox.html.c091a8e7.js +1 -0
  93. package/dist/assets/test/pages/Components.html.b41617c5.css +1 -0
  94. package/dist/assets/test/pages/CoreControls.html.dabd050c.css +1 -0
  95. package/dist/assets/test/pages/CoreControls_exp.html.46ab2dc9.css +1 -0
  96. package/dist/assets/test/pages/CustomCSS.html.4d6e9b1f.css +1 -0
  97. package/dist/assets/test/pages/DatePicker.html.e667d0b8.css +1 -0
  98. package/dist/assets/test/pages/DatePicker_test_page.html.882ab55e.css +1 -0
  99. package/dist/assets/test/pages/DateRangePicker.html.1b5072fd.css +1 -0
  100. package/dist/assets/test/pages/DateTimePicker.html.eff0e2e0.css +1 -0
  101. package/dist/assets/test/pages/DayPicker.html.5700622a.css +1 -0
  102. package/dist/assets/test/pages/Dialog.html.329cb1dc.css +1 -0
  103. package/dist/assets/test/pages/DialogLifecycle.html.e4ac6ba2.css +1 -0
  104. package/dist/assets/test/pages/DialogSemantic.html.f61ec13d.css +1 -0
  105. package/dist/assets/test/pages/DurationPicker.html.92ecf486.css +1 -0
  106. package/dist/assets/test/pages/Eventing.html.cd934528.css +1 -0
  107. package/dist/assets/test/pages/FileUploader.html.30b8cbbd.css +1 -0
  108. package/dist/assets/test/pages/FormSupport.html.4e02207b.css +1 -0
  109. package/dist/assets/test/pages/HCB.html.d458990b.css +1 -0
  110. package/dist/assets/test/pages/Icon.html.5f0fd46d.js +1 -0
  111. package/dist/assets/test/pages/Icon.html.be3b1acc.css +1 -0
  112. package/dist/assets/test/pages/Input.html.85ce57b4.css +1 -0
  113. package/dist/assets/test/pages/Input_quickview.html.86df3de3.css +1 -0
  114. package/dist/assets/test/pages/InputsAlignment.html.5c5593c2.css +1 -0
  115. package/dist/assets/test/pages/ItemNavigation.html.f5758aae.css +1 -0
  116. package/dist/assets/test/pages/Kitchen.html.d0d90fc6.css +1 -0
  117. package/dist/assets/test/pages/Kitchen.openui5.html.910e3d52.css +1 -0
  118. package/dist/assets/test/pages/Label.html.26cf5a3e.js +4 -0
  119. package/dist/assets/test/pages/Label.html.e994dc8e.css +1 -0
  120. package/dist/assets/test/pages/Link.html.d4c480d9.css +1 -0
  121. package/dist/assets/test/pages/List.html.65a3c4b3.css +1 -0
  122. package/dist/assets/test/pages/ListGrowing_Button.html.49bbaf80.css +1 -0
  123. package/dist/assets/test/pages/ListGrowing_Scroll.html.841dd1ed.css +1 -0
  124. package/dist/assets/test/pages/List_keyboard_support.html.a7297baf.css +1 -0
  125. package/dist/assets/test/pages/List_test_page.html.356d4e16.css +1 -0
  126. package/dist/assets/test/pages/LitKeyFunction.html.f3f9d649.css +1 -0
  127. package/dist/assets/test/pages/MemoryLeak.html.35d77e5e.css +1 -0
  128. package/dist/assets/test/pages/Menu.html.a758a26d.css +1 -0
  129. package/dist/assets/test/pages/MessagePage.html.30ffc162.css +1 -0
  130. package/dist/assets/test/pages/MessageStrip.html.8c2c85d5.css +1 -0
  131. package/dist/assets/test/pages/MultiComboBox.html.9ede2c74.css +1 -0
  132. package/dist/assets/test/pages/MultiInput.html.1c75cdc2.css +1 -0
  133. package/dist/assets/test/pages/MultiInput_Suggestions.html.79cd0348.css +1 -0
  134. package/dist/assets/test/pages/OpenUI5.html.cf1daa05.css +1 -0
  135. package/dist/assets/test/pages/Panel.html.399730d1.css +1 -0
  136. package/dist/assets/test/pages/Popover.html.6d4f19ad.css +1 -0
  137. package/dist/assets/test/pages/PopoverArrowBounds.html.c1e5feb1.css +1 -0
  138. package/dist/assets/test/pages/Popups.html.0d7c434f.js +1 -0
  139. package/dist/assets/test/pages/Popups.html.bb021765.css +1 -0
  140. package/dist/assets/test/pages/ProgressIndicator.html.d61b0c53.css +1 -0
  141. package/dist/assets/test/pages/RTL.html.dbeca857.css +1 -0
  142. package/dist/assets/test/pages/RadioButton.html.ccfd1850.css +1 -0
  143. package/dist/assets/test/pages/RangeSlider.html.437a9174.css +1 -0
  144. package/dist/assets/test/pages/RatingIndicator.html.737cd73b.css +1 -0
  145. package/dist/assets/test/pages/ResizeHandler.html.ed7c5d20.css +1 -0
  146. package/dist/assets/test/pages/ResponsivePopover.html.6f67ae07.css +1 -0
  147. package/dist/assets/test/pages/SegmentedButton.html.8678479b.css +1 -0
  148. package/dist/assets/test/pages/Select.html.9c98a470.css +1 -0
  149. package/dist/assets/test/pages/Simple.html.8f2ddb30.css +1 -0
  150. package/dist/assets/test/pages/Slider.html.8ea10965.css +1 -0
  151. package/dist/assets/test/pages/SplitButton.html.5c992973.css +1 -0
  152. package/dist/assets/test/pages/StepInput.html.f22c112d.css +1 -0
  153. package/dist/assets/test/pages/Switch.html.a4f3262f.css +1 -0
  154. package/dist/assets/test/pages/TabContainer.html.7f2ade15.css +1 -0
  155. package/dist/assets/test/pages/Table-perf-pure.html.fce52e4b.css +1 -0
  156. package/dist/assets/test/pages/Table-perf.html.88634378.css +1 -0
  157. package/dist/assets/test/pages/Table.html.c43386f4.css +1 -0
  158. package/dist/assets/test/pages/Table2.html.aca0c111.css +1 -0
  159. package/dist/assets/test/pages/TableAllPopin.html.ad586de4.css +1 -0
  160. package/dist/assets/test/pages/TableCustomStyling.html.a85167d6.css +1 -0
  161. package/dist/assets/test/pages/TableGrouping.html.602ae2ad.css +1 -0
  162. package/dist/assets/test/pages/TableGrowingWithButton.html.5a39b2bf.css +1 -0
  163. package/dist/assets/test/pages/TableGrowingWithScroll.html.8ef93d31.css +1 -0
  164. package/dist/assets/test/pages/TableSelection.html.dba2d678.css +1 -0
  165. package/dist/assets/test/pages/TextArea.html.f8e10fd6.css +1 -0
  166. package/dist/assets/test/pages/TimePicker.html.9a4bb300.css +1 -0
  167. package/dist/assets/test/pages/TimeSelection.html.8ad57759.css +1 -0
  168. package/dist/assets/test/pages/Title.html.7bb51811.css +1 -0
  169. package/dist/assets/test/pages/Toast.html.47a93be2.css +1 -0
  170. package/dist/assets/test/pages/ToggleButton.html.3b7dbb8c.css +1 -0
  171. package/dist/assets/test/pages/Tree.html.74fe2a1d.css +1 -0
  172. package/dist/assets/test/pages/WheelSlider_Test_Page.html.8a9a5e49.css +1 -0
  173. package/dist/assets/test/pages/form.html.f0f82118.css +1 -0
  174. package/dist/assets/test/pages/i18n-defaultLang.html.b9d79c6b.css +1 -0
  175. package/dist/assets/test/pages/i18n-demo.html.c6751b5c.css +1 -0
  176. package/dist/generated/templates/CarouselTemplate.lit.js +2 -2
  177. package/dist/test/pages/72override.html +33 -0
  178. package/dist/test/pages/AnimanitionOff.html +52 -0
  179. package/dist/test/pages/Avatar.html +265 -0
  180. package/dist/test/pages/AvatarGroup.html +376 -0
  181. package/dist/test/pages/Badge.html +75 -0
  182. package/dist/test/pages/Breadcrumbs.html +239 -0
  183. package/dist/test/pages/BusyIndicator.html +255 -0
  184. package/dist/test/pages/Button.html +267 -0
  185. package/dist/test/pages/Calendar.html +96 -0
  186. package/dist/test/pages/Card.html +347 -0
  187. package/dist/test/pages/Carousel.html +584 -0
  188. package/dist/test/pages/CheckBox.html +76 -0
  189. package/dist/test/pages/ColorPalette.html +126 -0
  190. package/dist/test/pages/ColorPalettePopover.html +141 -0
  191. package/dist/test/pages/ColorPicker.html +66 -0
  192. package/dist/test/pages/ComboBox.html +279 -0
  193. package/dist/test/pages/Components.html +106 -0
  194. package/dist/test/pages/CoreControls.html +203 -0
  195. package/dist/test/pages/CoreControls_exp.html +203 -0
  196. package/dist/test/pages/CustomCSS.html +55 -0
  197. package/dist/test/pages/DatePicker.html +193 -0
  198. package/dist/test/pages/DatePicker_test_page.html +97 -0
  199. package/dist/test/pages/DateRangePicker.html +64 -0
  200. package/dist/test/pages/DateTimePicker.html +190 -0
  201. package/dist/test/pages/DayPicker.html +37 -0
  202. package/dist/test/pages/Dialog.html +706 -0
  203. package/dist/test/pages/DialogLifecycle.html +62 -0
  204. package/dist/test/pages/DialogSemantic.html +58 -0
  205. package/dist/test/pages/DurationPicker.html +76 -0
  206. package/dist/test/pages/Eventing.html +33 -0
  207. package/dist/test/pages/FileUploader.html +138 -0
  208. package/dist/test/pages/FormSupport.html +59 -0
  209. package/dist/test/pages/HCB.html +45 -0
  210. package/dist/test/pages/Icon.html +269 -0
  211. package/dist/test/pages/Icon_custom.html +26 -0
  212. package/dist/test/pages/Input.html +722 -0
  213. package/dist/test/pages/InputFieldMinWidth.html +158 -0
  214. package/dist/test/pages/InputIcons.html +80 -0
  215. package/dist/test/pages/Input_quickview.html +204 -0
  216. package/dist/test/pages/InputsAlignment.html +131 -0
  217. package/dist/test/pages/InputsLazyLoading.html +244 -0
  218. package/dist/test/pages/ItemNavigation.html +94 -0
  219. package/dist/test/pages/Kitchen.html +638 -0
  220. package/dist/test/pages/Kitchen.openui5.html +570 -0
  221. package/dist/test/pages/Label.html +161 -0
  222. package/dist/test/pages/Link.html +201 -0
  223. package/dist/test/pages/List.html +465 -0
  224. package/dist/test/pages/ListGrowing_Button.html +64 -0
  225. package/dist/test/pages/ListGrowing_Scroll.html +93 -0
  226. package/dist/test/pages/List_keyboard_support.html +130 -0
  227. package/dist/test/pages/List_test_page.html +356 -0
  228. package/dist/test/pages/LitKeyFunction.html +40 -0
  229. package/dist/test/pages/MemoryLeak.html +78 -0
  230. package/dist/test/pages/Menu.html +145 -0
  231. package/dist/test/pages/MessagePage.html +39 -0
  232. package/dist/test/pages/MessageStrip.html +55 -0
  233. package/dist/test/pages/MultiComboBox.html +477 -0
  234. package/dist/test/pages/MultiInput.html +409 -0
  235. package/dist/test/pages/MultiInput_Suggestions.html +161 -0
  236. package/dist/test/pages/OpenUI5.html +83 -0
  237. package/dist/test/pages/Panel.html +226 -0
  238. package/dist/test/pages/Popover.html +586 -0
  239. package/dist/test/pages/PopoverArrowBounds.html +52 -0
  240. package/dist/test/pages/Popups.html +131 -0
  241. package/dist/test/pages/ProgressIndicator.html +151 -0
  242. package/dist/test/pages/RTL.html +118 -0
  243. package/dist/test/pages/RadioButton.html +201 -0
  244. package/dist/test/pages/RangeSlider.html +85 -0
  245. package/dist/test/pages/RatingIndicator.html +97 -0
  246. package/dist/test/pages/ResizeHandler.html +74 -0
  247. package/dist/test/pages/ResponsivePopover.html +244 -0
  248. package/dist/test/pages/SegmentedButton.html +116 -0
  249. package/dist/test/pages/Select.html +240 -0
  250. package/dist/test/pages/Simple.html +25 -0
  251. package/dist/test/pages/Slider.html +79 -0
  252. package/dist/test/pages/SplitButton.html +100 -0
  253. package/dist/test/pages/StepInput.html +164 -0
  254. package/dist/test/pages/Switch.html +88 -0
  255. package/dist/test/pages/TabContainer.html +904 -0
  256. package/dist/test/pages/Table-perf-pure.html +73 -0
  257. package/dist/test/pages/Table-perf.html +76 -0
  258. package/dist/test/pages/Table.html +2808 -0
  259. package/dist/test/pages/Table2.html +53 -0
  260. package/dist/test/pages/TableAllPopin.html +228 -0
  261. package/dist/test/pages/TableCustomStyling.html +89 -0
  262. package/dist/test/pages/TableGrouping.html +109 -0
  263. package/dist/test/pages/TableGrowingWithButton.html +805 -0
  264. package/dist/test/pages/TableGrowingWithScroll.html +801 -0
  265. package/dist/test/pages/TableSelection.html +445 -0
  266. package/dist/test/pages/TextArea.html +222 -0
  267. package/dist/test/pages/TimePicker.html +81 -0
  268. package/dist/test/pages/TimeSelection.html +31 -0
  269. package/dist/test/pages/Title.html +37 -0
  270. package/dist/test/pages/Toast.html +111 -0
  271. package/dist/test/pages/ToggleButton.html +69 -0
  272. package/dist/test/pages/Tree.html +294 -0
  273. package/dist/test/pages/WheelSlider_Test_Page.html +26 -0
  274. package/dist/test/pages/base/DOMObserver.html +20 -0
  275. package/dist/test/pages/base/InvisibleMessage.html +44 -0
  276. package/dist/test/pages/form.html +123 -0
  277. package/dist/test/pages/i18n-defaultLang.html +31 -0
  278. package/dist/test/pages/i18n-demo.html +79 -0
  279. package/global.d.ts +2 -2
  280. package/package.json +10 -9
  281. package/src/Badge.ts +1 -1
  282. package/src/Breadcrumbs.ts +1 -1
  283. package/src/{BusyIndicator.js → BusyIndicator.ts} +95 -100
  284. package/src/Calendar.ts +1 -1
  285. package/src/Card.ts +1 -1
  286. package/src/Carousel.hbs +3 -3
  287. package/src/{Carousel.js → Carousel.ts} +242 -234
  288. package/src/CheckBox.ts +1 -1
  289. package/src/ColorPalette.ts +1 -1
  290. package/src/ComboBox.js +2 -2
  291. package/src/Dialog.ts +2 -2
  292. package/src/Input.ts +1 -1
  293. package/src/List.ts +1 -1
  294. package/src/ListItem.ts +1 -1
  295. package/src/Menu.ts +1 -1
  296. package/src/MultiComboBox.js +6 -2
  297. package/src/MultiInput.js +1 -1
  298. package/src/SegmentedButton.js +1 -1
  299. package/src/Select.js +1 -1
  300. package/src/TabContainer.js +1 -2
  301. package/src/Table.ts +1 -1
  302. package/src/Tree.hbs +1 -1
  303. package/src/Tree.js +1 -1
package/dist/test/pages/List_keyboard_support.html ADDED
@@ -0,0 +1,130 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
5
+ <meta charset="utf-8">
6
+
7
+ <title>List</title>
8
+
9
+ <script data-ui5-config type="application/json">
10
+ {
11
+ "language": "EN"
12
+ }
13
+ </script>
14
+
15
+
16
+
17
+
18
+
19
+ <script type="module" crossorigin src="/assets/bundle.common.33be618c.js"></script>
20
+ <link rel="stylesheet" href="/assets/test/pages/List_keyboard_support.html.a7297baf.css">
21
+ </head>
22
+
23
+ <body class="list_keyboard_support1auto">
24
+ <h1>UI5 Table Web Component</h1>
25
+ <p>The sample shows the keyboard navigation support of the Table</p>
26
+ <ul>
27
+ <li>To navigate between items use the [UP] and [DOWN] arrow keys</li>
28
+ <li>To navigate within an item use the [TAB] and [SHIFT+TAB] keys</li>
29
+ </ul>
30
+
31
+ <div class="focusable" tabindex="0"></div>
32
+
33
+ <ui5-list id="myList" indent separators="Inner"
34
+ mode="MultiSelect"
35
+ header-text="Text when no header provided"
36
+ footer-text="Copyright"
37
+ no-data-text="No data">
38
+
39
+ <div slot="header" class="header">
40
+ <div>Countries</div>
41
+ <ui5-button design="Accept">Export</ui5-button>
42
+ </div>
43
+
44
+ <!-- Items -->
45
+ <ui5-li>Argentina</ui5-li>
46
+ <ui5-li-custom>
47
+ <ui5-checkbox text="Checkbox"></ui5-checkbox>
48
+ </ui5-li-custom>
49
+ <ui5-li>Bulgaria</ui5-li>
50
+ <ui5-li-custom selected>
51
+ <ui5-button>Click me</ui5-button>
52
+ <ui5-link href="https://www.google.bg" target="_blank">UI5 link</ui5-link>
53
+ <ui5-radio-button text="Option B" disabled="disabled"></ui5-radio-button>
54
+ <ui5-button>Click me</ui5-button>
55
+ </ui5-li-custom>
56
+ <ui5-li>China</ui5-li>
57
+ <ui5-li-custom selected>
58
+ <ui5-radio-button text="Option C" disabled="disabled"></ui5-radio-button>
59
+ </ui5-li-custom>
60
+ </ui5-list>
61
+
62
+ <div class="focusable" tabindex="0"></div>
63
+
64
+ <ui5-list id="myList" indent separators="Inner"
65
+ mode="MultiSelect"
66
+ header-text="Text when no header provided"
67
+ footer-text="Copyright"
68
+ no-data-text="No data">
69
+
70
+ <!-- Items -->
71
+ <ui5-li>Argentina</ui5-li>
72
+ <ui5-li-custom>
73
+ <ui5-checkbox text="Checkbox"></ui5-checkbox>
74
+ </ui5-li-custom>
75
+ <ui5-li>Bulgaria</ui5-li>
76
+ <ui5-li-custom selected>
77
+ <ui5-button>Click me</ui5-button>
78
+ <ui5-link href="https://www.google.bg" target="_blank">UI5 link</ui5-link>
79
+ <ui5-radio-button text="Option B" disabled="disabled"></ui5-radio-button>
80
+ <ui5-button>Click me</ui5-button>
81
+ </ui5-li-custom>
82
+ <ui5-li>China</ui5-li>
83
+ <ui5-li-custom selected>
84
+ <ui5-radio-button text="Option C" disabled="disabled"></ui5-radio-button>
85
+ </ui5-li-custom>
86
+ </ui5-list>
87
+
88
+ <div class="focusable" tabindex="0"></div>
89
+
90
+ <h1>Test PAGE UP/DOWN</h1>
91
+ <br><br>
92
+ <ui5-list>
93
+ <ui5-li>0</ui5-li>
94
+ <ui5-li>1</ui5-li>
95
+ <ui5-li>2</ui5-li>
96
+ <ui5-li>3</ui5-li>
97
+ <ui5-li>4</ui5-li>
98
+ <ui5-li>5</ui5-li>
99
+ <ui5-li>6</ui5-li>
100
+ <ui5-li>7</ui5-li>
101
+ <ui5-li>8</ui5-li>
102
+ <ui5-li>9</ui5-li>
103
+ <ui5-li>10</ui5-li>
104
+
105
+ <ui5-li>11</ui5-li>
106
+ <ui5-li>12</ui5-li>
107
+ <ui5-li>13</ui5-li>
108
+ <ui5-li>14</ui5-li>
109
+ <ui5-li>15</ui5-li>
110
+ <ui5-li>16</ui5-li>
111
+ <ui5-li>17</ui5-li>
112
+ <ui5-li>18</ui5-li>
113
+ <ui5-li>19</ui5-li>
114
+ <ui5-li>20</ui5-li>
115
+
116
+ <ui5-li>21</ui5-li>
117
+ <ui5-li>22</ui5-li>
118
+ <ui5-li>23</ui5-li>
119
+ <ui5-li>24</ui5-li>
120
+ <ui5-li>25</ui5-li>
121
+ <ui5-li>26</ui5-li>
122
+ <ui5-li>27</ui5-li>
123
+ <ui5-li>28</ui5-li>
124
+ <ui5-li>29</ui5-li>
125
+ <ui5-li>30</ui5-li>
126
+ </ui5-list>
127
+
128
+
129
+ </body>
130
+ </html>
package/dist/test/pages/List_test_page.html ADDED
@@ -0,0 +1,356 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
5
+ <meta charset="utf-8">
6
+ <title>ui5-list / ui5-li</title>
7
+
8
+
9
+
10
+
11
+
12
+
13
+ <script type="module" crossorigin src="/assets/bundle.common.33be618c.js"></script>
14
+ <link rel="stylesheet" href="/assets/test/pages/List_test_page.html.356d4e16.css">
15
+ </head>
16
+
17
+ <body class="list_test_page1auto">
18
+ <ui5-title>List growing="Scroll"</ui5-title>
19
+ <ui5-button id="btnTrigger">scroll</ui5-button>
20
+ <ui5-list id="infiniteScrollEx" class="list_test_page2auto" growing="Scroll">
21
+ <ui5-li>Laptop Lenovo</ui5-li>
22
+ <ui5-li>IPhone 3</ui5-li>
23
+ <ui5-li>HP Monitor 24</ui5-li>
24
+ <ui5-li>Audio cabel</ui5-li>
25
+ <ui5-li>DVD set</ui5-li>
26
+ <ui5-li>HP Monitor 24</ui5-li>
27
+ <ui5-li>Audio cabel</ui5-li>
28
+ <ui5-li id="lastItem">Last Item</ui5-li>
29
+ </ui5-list>
30
+ <input id="loadMoreResult" value="0"/>
31
+ <br><br><br>
32
+
33
+ <ui5-title>List growing="Scroll" items don't overflow initially</ui5-title>
34
+
35
+ <ui5-input id="growingScrollTestCounter" value="0"></ui5-input>
36
+ <section class="list_test_page3auto">
37
+ <ui5-list id="growingScrollTest" growing="Scroll">
38
+ <ui5-li-groupheader>New Items</ui5-li-groupheader>
39
+ </ui5-list>
40
+ </section>
41
+
42
+ <br><br><br>
43
+
44
+ <br/>
45
+ <ui5-list id="listEvents" mode="SingleSelectEnd">
46
+ <ui5-li id="country1">Argentina</ui5-li>
47
+ <ui5-li id="country2" selected >Bulgaria</ui5-li>
48
+ <ui5-li id="country3">China</ui5-li>
49
+ <ui5-li id="country4" type="Inactive">Portugal</ui5-li>
50
+ </ui5-list>
51
+ <ui5-input id="itemClickResultField" placeholder="itemClick result"></ui5-input>
52
+ <ui5-input id="selectionChangeResultField" placeholder="selectionChange result"></ui5-input>
53
+ <ui5-input id="selectionChangeResultPreviousItemsParameter" placeholder="selectionChange previousSelection result"></ui5-input>
54
+
55
+ <br><br><br>
56
+
57
+ <br/>
58
+ <ui5-list id="listPreventClickEvent" mode="SingleSelect">
59
+ <ui5-li id="country1">Argentina</ui5-li>
60
+ <ui5-li id="country2" selected >Bulgaria</ui5-li>
61
+ </ui5-list>
62
+ <ui5-input id="itemClickPreventedResultField" placeholder="itemClick prevented result"></ui5-input>
63
+
64
+ <br><br><br>
65
+ <ui5-list id="justList">
66
+ <ui5-li id="justList-country">Argentina</ui5-li>
67
+ </ui5-list>
68
+ <ui5-list id="listDelete" mode="Delete">
69
+ <ui5-li>Argentina</ui5-li>
70
+ </ui5-list>
71
+ <ui5-list id="listMultiSelect" mode="MultiSelect">
72
+ <ui5-li>Argentina</ui5-li>
73
+ </ui5-list>
74
+ <ui5-list id="listSingleSelect" mode="SingleSelect">
75
+ <ui5-li>Argentina</ui5-li>
76
+ </ui5-list>
77
+ <ui5-list id="listSelectedItem" mode="MultiSelect">
78
+ <ui5-li-groupheader id="group-header">New Items</ui5-li-groupheader>
79
+ <ui5-li id="not-selected-country">Argentina</ui5-li>
80
+ <ui5-li id="selected-country" selected >Bulgaria</ui5-li>
81
+ </ui5-list>
82
+ <br><br><br>
83
+ <ui5-list id="listEvents2" mode="MultiSelect">
84
+ <ui5-li id="country11">Argentina</ui5-li>
85
+ <ui5-li id="country22" selected >Bulgaria</ui5-li>
86
+ <ui5-li id="country33">China</ui5-li>
87
+ <ui5-li id="country44">Portugal</ui5-li>
88
+ </ui5-list>
89
+ <ui5-input id="itemClickResultField2" placeholder="itemClick result"></ui5-input>
90
+ <ui5-input id="selectionChangeResultField2" placeholder="selectionChange result"></ui5-input>
91
+
92
+ <br><br><br>
93
+ <ui5-list id="list1" header-text="API: GroupHeaderListItem">
94
+ <ui5-li-groupheader>New Items</ui5-li-groupheader>
95
+ <ui5-li image="./img/HT-1000.jpg" >Laptop HP</ui5-li>
96
+ <ui5-li image="./img/HT-1010.jpg" >Laptop Lenovo</ui5-li>
97
+ <ui5-li image="./img/HT-1022.jpg" >IPhone 3</ui5-li>
98
+
99
+ <ui5-li-groupheader>Discounted Items</ui5-li-groupheader>
100
+ <ui5-li image="./img/HT-1030.jpg" icon="navigation-right-arrow">HP Monitor 24</ui5-li>
101
+ <ui5-li image="./img/HT-2026.jpg" icon="navigation-right-arrow">Audio cabel</ui5-li>
102
+ <ui5-li image="./img/HT-2002.jpg" icon="navigation-right-arrow">DVD set</ui5-li>
103
+ </ui5-list>
104
+
105
+ <label id="lblResult">0</label>
106
+
107
+ <ui5-list id="listWithDesc">
108
+ <ui5-li image="./img/HT-1000.jpg" description="2GB RAM, Intel i7 4.5 GHz">Laptop HP</ui5-li>
109
+ <ui5-li image="./img/HT-2026.jpg" description="2GB RAM, Intel i7 4.5 GHz">Audio cabel</ui5-li>
110
+ <ui5-li image="./img/HT-2002.jpg" description="2GB RAM, Intel i7 4.5 GHz">DVD set</ui5-li>
111
+ </ui5-list>
112
+
113
+ <ui5-list id="listMultiSel" mode="MultiSelect">
114
+ <ui5-li id="option1">Option #1</ui5-li>
115
+ <ui5-li>Option #2</ui5-li>
116
+ <ui5-li>Option #3</ui5-li>
117
+ </ui5-list>
118
+
119
+ <ui5-list id="default-slot-test" mode="SingleSelect">
120
+ <ui5-li>Option #1</ui5-li>
121
+ <ui5-li>Option #2</ui5-li>
122
+ <ui5-li>Option #3</ui5-li>
123
+ </ui5-list>
124
+
125
+ <ui5-input id="fieldMultiSelResult"></ui5-input>
126
+
127
+ <ui5-button id="beforeBtn">Before button</ui5-button>
128
+ <ui5-list id="keyboardTestList" growing="Button">
129
+ <div slot="header" class="header"><ui5-button id="headerBtn" design="Accept">Export</ui5-button></div>
130
+
131
+ <ui5-li class="firstItem">Argentina</ui5-li>
132
+ <ui5-li-custom selected class="item">
133
+ <ui5-button class="itemBtn">Click me</ui5-button>
134
+ <ui5-link href="https://www.google.bg" target="_blank" class="itemLink">UI5 link</ui5-link>
135
+ <ui5-button class="itemBtn" disabled>Disabled</ui5-button>
136
+ <ui5-radio-button text="Option B" class="itemRadio"></ui5-radio-button>
137
+ </ui5-li-custom>
138
+ <ui5-li>China</ui5-li>
139
+ <ui5-li-custom selected>
140
+ <ui5-radio-button text="Option C" disabled="disabled"></ui5-radio-button>
141
+ </ui5-li-custom>
142
+ </ui5-list>
143
+ <ui5-button id="afterBtn">After button</ui5-button>
144
+
145
+ <ui5-list id="no-data-list" header-text="API: noDataText" separators="None" no-data-text="No Data Available"></ui5-list>
146
+
147
+ <ui5-list
148
+ id="header-slot-list"
149
+ mode="MultiSelect"
150
+ header-text="Text when no header provided"
151
+ footer-text="Copyright"
152
+ no-data-text="No data">
153
+
154
+ <div slot="header" class="header">
155
+ <ui5-title id="header-slot-title">List Title Here</ui5-title>
156
+ </div>
157
+
158
+ </ui5-list>
159
+
160
+ <br/><br/>
161
+
162
+ <ui5-list>
163
+ <ui5-li id="imageContent-slot-li"> Avatar inside imageContent slot
164
+ <div slot="imageContent">
165
+ <ui5-avatar id="imageContent-slot-avatar">
166
+ <img src="/assets/woman_avatar_5.7316a316.png" alt="Woman image">
167
+ </ui5-avatar>
168
+ </div>
169
+ </ui5-li>
170
+
171
+ </ui5-list>
172
+
173
+ <br/><br/>
174
+
175
+ <ui5-list id="inactiveMultiSelect" header-text="API: ListItem type='Inactive'" mode="MultiSelect">
176
+ <ui5-li type="Inactive">Inactive item</ui5-li>
177
+ <ui5-li type="Inactive">Inactive item</ui5-li>
178
+ </ui5-list>
179
+
180
+ <br/><br/>
181
+
182
+ <ui5-list id="inactiveSingleSelect" header-text="API: ListItem type='Inactive'" mode="SingleSelectBegin">
183
+ <ui5-li type="Inactive">Inactive item</ui5-li>
184
+ <ui5-li type="Inactive">Inactive item</ui5-li>
185
+ </ui5-list>
186
+
187
+ <br/><br/>
188
+ <span id="detailPressCounter">0</span>
189
+ <ui5-list header-text="API: ListItem type='Detail'">
190
+ <ui5-li id="detailListItem" type="Detail">Detail item</ui5-li>
191
+ <ui5-li >Normal item</ui5-li>
192
+ </ui5-list>
193
+ <br/><br/>
194
+
195
+ <ui5-list id="listWithInternalHeader" header-text="Test aria">
196
+ <ui5-li>item</ui5-li>
197
+ <ui5-li >item</ui5-li>
198
+ </ui5-list>
199
+ <br/><br/>
200
+
201
+ <ui5-list id="listWithCustomHeader" accessible-name-ref="testHeader">
202
+ <div slot="header" class="header">
203
+ <h2 id="testHeader">Test aria</h2>
204
+ </div>
205
+
206
+ <ui5-li>item</ui5-li>
207
+ <ui5-li >item</ui5-li>
208
+ </ui5-list>
209
+
210
+ <ui5-list id="listWithEmptyItem">
211
+ <ui5-li id="emptyItem"></ui5-li>
212
+ <ui5-li>IPhone 3</ui5-li>
213
+ <ui5-li>HP Monitor 24</ui5-li>
214
+ </ui5-list>
215
+ <ui5-button id="changeEmptyItem">Change empty item text</ui5-button>
216
+ <br>
217
+ <ui5-title>Events within ui5-li-custom</ui5-title>
218
+ <br>
219
+
220
+ <ui5-list id="customList" separators="Inner">
221
+ <ui5-li-custom>
222
+ <ui5-button id="liBtn1" design="Transparent">List Button 1</ui5-button>
223
+ <br />
224
+ </ui5-li-custom>
225
+ <ui5-li-custom>
226
+ <ui5-button design="Transparent">List Button 2</ui5-button>
227
+ <br />
228
+ </ui5-li-custom>
229
+ <ui5-li-custom>
230
+ <ui5-button design="Transparent">List Button 2</ui5-button>
231
+ <br />
232
+ </ui5-li-custom>
233
+ </ui5-list>
234
+
235
+ <ui5-input value="0" id="customListItemEvents"></ui5-input>
236
+ <br />
237
+ <br />
238
+ <ui5-button id="btnOpenPopup">Open popup with List</ui5-button>
239
+ <ui5-responsive-popover id="popup" placement-type="Bottom" class="list_test_page5auto">
240
+ <ui5-list>
241
+ <div slot="header">
242
+ <ui5-button id="btnInHeader" icon="refresh" />
243
+ </div>
244
+ </ui5-list>
245
+
246
+ <ui5-list class="list_test_page6auto" growing="Scroll" no-data-text="No data">
247
+ <ui5-li>Test</ui5-li>
248
+ </ui5-list>
249
+ </ui5-responsive-popover>
250
+
251
+ <ui5-list id="basicList">
252
+ <ui5-li>Laptop HP</ui5-li>
253
+ <ui5-li>Audio cabel</ui5-li>
254
+ <ui5-li>DVD set</ui5-li>
255
+ </ui5-list>
256
+
257
+ <ui5-list id="listWithAnchorTag">
258
+ <ui5-li>
259
+ <a id="linkInListItem" tabindex="-1" href="https://sap.github.io/ui5-webcomponents/playground/components" rel="noopener" target="_self">
260
+ Link1</a>
261
+ </ui5-li>
262
+ </ui5-list>
263
+
264
+ <script>
265
+ 'use strict';
266
+
267
+ var itemDeleteCounter = 0;
268
+ var itemClickCounter = 0;
269
+ var itemClickCounter2 = 0;
270
+ var selectionChangeCounter = 0;
271
+ var selectionChangeCounter2 = 0;
272
+
273
+ function deleteItemHandler(e) {
274
+ document.querySelector("#lblResult").innerHTML = e.detail.item.innerHTML + ": " + ++itemDeleteCounter;
275
+ }
276
+
277
+ list1.addEventListener("ui5-itemDelete", deleteItemHandler);
278
+
279
+ listEvents.addEventListener("ui5-itemClick", function (event) {
280
+ itemClickCounter += 1;
281
+ itemClickResultField.value = itemClickCounter;
282
+ });
283
+
284
+ listEvents.addEventListener("ui5-selectionChange", function (event) {
285
+ selectionChangeCounter += 1;
286
+ selectionChangeResultField.value = selectionChangeCounter;
287
+ });
288
+
289
+ listEvents.addEventListener("ui5-selectionChange", function(event) {
290
+ selectionChangeResultPreviousItemsParameter.value = event.detail.previouslySelectedItems[0].id;
291
+ })
292
+
293
+ listEvents2.addEventListener("ui5-itemClick", function (event) {
294
+ itemClickCounter2 += 1;
295
+ itemClickResultField2.value = itemClickCounter2;
296
+ });
297
+
298
+ listEvents2.addEventListener("ui5-selectionChange", function (event) {
299
+ selectionChangeCounter2 += 1;
300
+ selectionChangeResultField2.value = selectionChangeCounter2;
301
+ });
302
+
303
+
304
+ listMultiSel.addEventListener("ui5-selectionChange", function(event) {
305
+ fieldMultiSelResult.value = event.detail.selectionComponentPressed;
306
+ })
307
+
308
+ btnTrigger.addEventListener("click", function(e) {
309
+ var scrollableContiner = infiniteScrollEx.shadowRoot.querySelector(".ui5-list-scroll-container");
310
+ scrollableContiner.scroll(0, scrollableContiner.scrollHeight);
311
+ });
312
+
313
+ changeEmptyItem.addEventListener("click", function(e) {
314
+ emptyItem.textContent = "updated";
315
+ });
316
+
317
+ listPreventClickEvent.addEventListener("ui5-itemClick", function (event) {
318
+ event.preventDefault();
319
+ itemClickPreventedResultField.value = event.detail.item.id;
320
+ });
321
+
322
+ var loadMoreCounter = 0;
323
+ infiniteScrollEx.addEventListener("ui5-loadMore", function(e) {
324
+ for(var i = 0; i < 3; i++) {
325
+ var li = document.createElement("ui5-li");
326
+ li.textContent = "Title" + i;
327
+ infiniteScrollEx.appendChild(li);
328
+ }
329
+ loadMoreResult.value= ++loadMoreCounter;
330
+ });
331
+
332
+ detailListItem.addEventListener("ui5-detailClick", function(e) {
333
+ detailPressCounter.innerHTML = parseInt(detailPressCounter.innerHTML) + 1;
334
+ });
335
+
336
+ var ui5List = document.getElementById("customList"),
337
+ liBtn1 = document.getElementById("liBtn1"),
338
+ customListItemEventsValue = 0,
339
+ customListItemEventsInput = document.getElementById("customListItemEvents");
340
+
341
+ ui5List.addEventListener("ui5-item-click", function(event) {
342
+ customListItemEventsInput.value = ++customListItemEventsValue;
343
+ });
344
+
345
+ btnOpenPopup.addEventListener("click", function() {
346
+ popup.showAt(btnOpenPopup);
347
+ });
348
+
349
+
350
+ var groiwngScrollTestCounter = 0;
351
+ growingScrollTest.addEventListener("ui5-loadMore", function(e) {
352
+ growingScrollTestCounter.value= ++groiwngScrollTestCounter;
353
+ });
354
+ </script>
355
+ </body>
356
+ </html>
package/dist/test/pages/LitKeyFunction.html ADDED
@@ -0,0 +1,40 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+
4
+ <head>
5
+ <meta charset="UTF-8">
6
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
7
+ <title>LitHTML key function test page</title>
8
+ <script>
9
+ // delete Document.prototype.adoptedStyleSheets
10
+ </script>
11
+
12
+ <script data-ui5-config type="application/json">
13
+ {
14
+ "rtl": false
15
+ }
16
+ </script>
17
+
18
+
19
+
20
+
21
+
22
+
23
+
24
+ <script type="module" crossorigin src="/assets/bundle.common.33be618c.js"></script>
25
+ <link rel="stylesheet" href="/assets/test/pages/LitKeyFunction.html.f3f9d649.css">
26
+ </head>
27
+
28
+ <body class="litkeyfunction1auto">
29
+
30
+
31
+ <ui5-multi-combobox id="mcb" >
32
+ <ui5-mcb-item text="<empty>"></ui5-mcb-item>
33
+ <ui5-mcb-item text="Algeria"></ui5-mcb-item>
34
+ <ui5-mcb-item text="China"></ui5-mcb-item>
35
+ <ui5-mcb-item text="USA"></ui5-mcb-item>
36
+ </ui5-multi-combobox>
37
+
38
+ </body>
39
+
40
+ </html>
package/dist/test/pages/MemoryLeak.html ADDED
@@ -0,0 +1,78 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
5
+ <meta charset="utf-8">
6
+
7
+ <title>Button</title>
8
+
9
+
10
+
11
+
12
+
13
+
14
+
15
+
16
+ <script type="module" crossorigin src="/assets/bundle.common.33be618c.js"></script>
17
+ <link rel="stylesheet" href="/assets/test/pages/MemoryLeak.html.35d77e5e.css">
18
+ </head>
19
+
20
+ <body class="memoryleak1auto">
21
+
22
+ <div class="memoryleak2auto">
23
+ <ui5-input id="count" value="100" value-state="Information">
24
+ <div slot="valueStateMessage">How many date pickers to create</div>
25
+ </ui5-input>
26
+ <ui5-button id="everything">Create+Open+Destroy</ui5-button>
27
+ <ui5-button id="create">Create</ui5-button>
28
+ <ui5-button id="open">Open</ui5-button>
29
+ <ui5-button id="destroy">Destroy</ui5-button>
30
+ </div>
31
+
32
+ <div id="test" class="memoryleak3auto"></div>
33
+
34
+ <script>
35
+ const count = document.getElementById("count");
36
+ const everything = document.getElementById("everything");
37
+ const create = document.getElementById("create");
38
+ const open = document.getElementById("open");
39
+ const destroy = document.getElementById("destroy");
40
+ const test = document.getElementById("test");
41
+
42
+ const createAll = () => {
43
+ for (let i=0; i<parseInt(count.value); i++) {
44
+ const d = document.createElement("ui5-date-picker");
45
+ test.appendChild(d);
46
+ }
47
+ };
48
+
49
+ const openAll = () => {
50
+ return Promise.all([...test.children].map(child => {
51
+ return child.openPicker();
52
+ }));
53
+ };
54
+
55
+ const destroyAll = () => {
56
+ [...test.children].forEach(child => {
57
+ test.removeChild(child);
58
+ });
59
+ };
60
+
61
+ create.addEventListener("click", createAll);
62
+
63
+ open.addEventListener("click", openAll);
64
+
65
+ destroy.addEventListener("click", destroyAll);
66
+
67
+ everything.addEventListener("click", async () => {
68
+ createAll();
69
+ await window["sap-ui-webcomponents-bundle"].renderFinished();
70
+ await openAll();
71
+ await window["sap-ui-webcomponents-bundle"].renderFinished();
72
+ destroyAll();
73
+ });
74
+
75
+ </script>
76
+
77
+ </body>
78
+ </html>