@ui5/webcomponents 1.9.3 → 1.9.4

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 (207) hide show
  1. package/.dev-server-port +1 -0
  2. package/CHANGELOG.md +11 -0
  3. package/LICENSE.txt +201 -0
  4. package/dist/AvatarGroup.js +2 -19
  5. package/dist/assets/test/pages/72override.html.dda35518.css +1 -0
  6. package/dist/assets/test/pages/AnimanitionOff.html.b7566ecc.css +1 -0
  7. package/dist/assets/test/pages/Avatar.html.62cc0573.css +1 -0
  8. package/dist/assets/test/pages/AvatarGroup.html.20647fe1.css +1 -0
  9. package/dist/assets/test/pages/Badge.html.bcc1c9a3.css +1 -0
  10. package/dist/assets/test/pages/Breadcrumbs.html.5753069f.css +1 -0
  11. package/dist/assets/test/pages/BusyIndicator.html.ce95c23c.css +1 -0
  12. package/dist/assets/test/pages/Button.html.957848f0.css +1 -0
  13. package/dist/assets/test/pages/Calendar.html.9ff42e30.css +1 -0
  14. package/dist/assets/test/pages/Card.html.8c5e4756.css +1 -0
  15. package/dist/assets/test/pages/Carousel.html.fcdd32a7.css +1 -0
  16. package/dist/assets/test/pages/CheckBox.html.08ae630d.css +1 -0
  17. package/dist/assets/test/pages/ColorPalette.html.8c4c4ca3.css +1 -0
  18. package/dist/assets/test/pages/ColorPalettePopover.html.727f90e2.css +1 -0
  19. package/dist/assets/test/pages/ColorPicker.html.cc0c0d29.css +1 -0
  20. package/dist/assets/test/pages/ComboBox.html.14fbc3aa.css +1 -0
  21. package/dist/assets/test/pages/ComboBox.html.2c2a9927.js +1 -0
  22. package/dist/assets/test/pages/Components.html.b41617c5.css +1 -0
  23. package/dist/assets/test/pages/CoreControls.html.dabd050c.css +1 -0
  24. package/dist/assets/test/pages/CoreControls_exp.html.46ab2dc9.css +1 -0
  25. package/dist/assets/test/pages/CustomCSS.html.4d6e9b1f.css +1 -0
  26. package/dist/assets/test/pages/DatePicker.html.e667d0b8.css +1 -0
  27. package/dist/assets/test/pages/DatePicker_test_page.html.882ab55e.css +1 -0
  28. package/dist/assets/test/pages/DateRangePicker.html.1b5072fd.css +1 -0
  29. package/dist/assets/test/pages/DateTimePicker.html.eff0e2e0.css +1 -0
  30. package/dist/assets/test/pages/DayPicker.html.5700622a.css +1 -0
  31. package/dist/assets/test/pages/Dialog.html.329cb1dc.css +1 -0
  32. package/dist/assets/test/pages/DialogLifecycle.html.e4ac6ba2.css +1 -0
  33. package/dist/assets/test/pages/DialogSemantic.html.f61ec13d.css +1 -0
  34. package/dist/assets/test/pages/DurationPicker.html.92ecf486.css +1 -0
  35. package/dist/assets/test/pages/Eventing.html.cd934528.css +1 -0
  36. package/dist/assets/test/pages/FileUploader.html.30b8cbbd.css +1 -0
  37. package/dist/assets/test/pages/FormSupport.html.4e02207b.css +1 -0
  38. package/dist/assets/test/pages/HCB.html.d458990b.css +1 -0
  39. package/dist/assets/test/pages/Icon.html.87536fdd.js +1 -0
  40. package/dist/assets/test/pages/Icon.html.be3b1acc.css +1 -0
  41. package/dist/assets/test/pages/Input.html.85ce57b4.css +1 -0
  42. package/dist/assets/test/pages/Input_quickview.html.86df3de3.css +1 -0
  43. package/dist/assets/test/pages/InputsAlignment.html.5c5593c2.css +1 -0
  44. package/dist/assets/test/pages/ItemNavigation.html.f5758aae.css +1 -0
  45. package/dist/assets/test/pages/Kitchen.html.d0d90fc6.css +1 -0
  46. package/dist/assets/test/pages/Kitchen.openui5.html.910e3d52.css +1 -0
  47. package/dist/assets/test/pages/Label.html.7c2bcd8f.js +4 -0
  48. package/dist/assets/test/pages/Label.html.e994dc8e.css +1 -0
  49. package/dist/assets/test/pages/Link.html.d4c480d9.css +1 -0
  50. package/dist/assets/test/pages/List.html.65a3c4b3.css +1 -0
  51. package/dist/assets/test/pages/ListGrowing_Button.html.49bbaf80.css +1 -0
  52. package/dist/assets/test/pages/ListGrowing_Scroll.html.841dd1ed.css +1 -0
  53. package/dist/assets/test/pages/List_keyboard_support.html.a7297baf.css +1 -0
  54. package/dist/assets/test/pages/List_test_page.html.356d4e16.css +1 -0
  55. package/dist/assets/test/pages/LitKeyFunction.html.f3f9d649.css +1 -0
  56. package/dist/assets/test/pages/MemoryLeak.html.35d77e5e.css +1 -0
  57. package/dist/assets/test/pages/Menu.html.a758a26d.css +1 -0
  58. package/dist/assets/test/pages/MessagePage.html.30ffc162.css +1 -0
  59. package/dist/assets/test/pages/MessageStrip.html.8c2c85d5.css +1 -0
  60. package/dist/assets/test/pages/MultiComboBox.html.f06e18eb.css +1 -0
  61. package/dist/assets/test/pages/MultiInput.html.1c75cdc2.css +1 -0
  62. package/dist/assets/test/pages/MultiInput_Suggestions.html.79cd0348.css +1 -0
  63. package/dist/assets/test/pages/OpenUI5.html.cf1daa05.css +1 -0
  64. package/dist/assets/test/pages/Panel.html.399730d1.css +1 -0
  65. package/dist/assets/test/pages/Popover.html.87315ecf.css +1 -0
  66. package/dist/assets/test/pages/PopoverArrowBounds.html.c1e5feb1.css +1 -0
  67. package/dist/assets/test/pages/Popups.html.80f57dca.js +1 -0
  68. package/dist/assets/test/pages/Popups.html.bb021765.css +1 -0
  69. package/dist/assets/test/pages/ProgressIndicator.html.d61b0c53.css +1 -0
  70. package/dist/assets/test/pages/RTL.html.dbeca857.css +1 -0
  71. package/dist/assets/test/pages/RadioButton.html.ccfd1850.css +1 -0
  72. package/dist/assets/test/pages/RangeSlider.html.437a9174.css +1 -0
  73. package/dist/assets/test/pages/RatingIndicator.html.737cd73b.css +1 -0
  74. package/dist/assets/test/pages/ResizeHandler.html.ed7c5d20.css +1 -0
  75. package/dist/assets/test/pages/ResponsivePopover.html.6f67ae07.css +1 -0
  76. package/dist/assets/test/pages/SegmentedButton.html.8678479b.css +1 -0
  77. package/dist/assets/test/pages/Select.html.9c98a470.css +1 -0
  78. package/dist/assets/test/pages/Simple.html.8f2ddb30.css +1 -0
  79. package/dist/assets/test/pages/Slider.html.8ea10965.css +1 -0
  80. package/dist/assets/test/pages/SplitButton.html.5c992973.css +1 -0
  81. package/dist/assets/test/pages/StepInput.html.f22c112d.css +1 -0
  82. package/dist/assets/test/pages/Switch.html.a4f3262f.css +1 -0
  83. package/dist/assets/test/pages/TabContainer.html.7f2ade15.css +1 -0
  84. package/dist/assets/test/pages/Table-perf-pure.html.fce52e4b.css +1 -0
  85. package/dist/assets/test/pages/Table-perf.html.88634378.css +1 -0
  86. package/dist/assets/test/pages/Table.html.c43386f4.css +1 -0
  87. package/dist/assets/test/pages/Table2.html.aca0c111.css +1 -0
  88. package/dist/assets/test/pages/TableAllPopin.html.ad586de4.css +1 -0
  89. package/dist/assets/test/pages/TableCustomStyling.html.a85167d6.css +1 -0
  90. package/dist/assets/test/pages/TableGrouping.html.602ae2ad.css +1 -0
  91. package/dist/assets/test/pages/TableGrowingWithButton.html.5a39b2bf.css +1 -0
  92. package/dist/assets/test/pages/TableGrowingWithScroll.html.8ef93d31.css +1 -0
  93. package/dist/assets/test/pages/TableSelection.html.dba2d678.css +1 -0
  94. package/dist/assets/test/pages/TextArea.html.f8e10fd6.css +1 -0
  95. package/dist/assets/test/pages/TimePicker.html.9a4bb300.css +1 -0
  96. package/dist/assets/test/pages/TimeSelection.html.8ad57759.css +1 -0
  97. package/dist/assets/test/pages/Title.html.7bb51811.css +1 -0
  98. package/dist/assets/test/pages/Toast.html.47a93be2.css +1 -0
  99. package/dist/assets/test/pages/ToggleButton.html.3b7dbb8c.css +1 -0
  100. package/dist/assets/test/pages/Tree.html.74fe2a1d.css +1 -0
  101. package/dist/assets/test/pages/WheelSlider_Test_Page.html.8a9a5e49.css +1 -0
  102. package/dist/assets/test/pages/form.html.f0f82118.css +1 -0
  103. package/dist/assets/test/pages/i18n-defaultLang.html.b9d79c6b.css +1 -0
  104. package/dist/assets/test/pages/i18n-demo.html.c6751b5c.css +1 -0
  105. package/dist/test/pages/72override.html +33 -0
  106. package/dist/test/pages/AnimanitionOff.html +52 -0
  107. package/dist/test/pages/Avatar.html +265 -0
  108. package/dist/test/pages/AvatarGroup.html +376 -0
  109. package/dist/test/pages/Badge.html +75 -0
  110. package/dist/test/pages/Breadcrumbs.html +239 -0
  111. package/dist/test/pages/BusyIndicator.html +255 -0
  112. package/dist/test/pages/Button.html +267 -0
  113. package/dist/test/pages/Calendar.html +96 -0
  114. package/dist/test/pages/Card.html +347 -0
  115. package/dist/test/pages/Carousel.html +574 -0
  116. package/dist/test/pages/CheckBox.html +76 -0
  117. package/dist/test/pages/ColorPalette.html +126 -0
  118. package/dist/test/pages/ColorPalettePopover.html +141 -0
  119. package/dist/test/pages/ColorPicker.html +66 -0
  120. package/dist/test/pages/ComboBox.html +279 -0
  121. package/dist/test/pages/Components.html +106 -0
  122. package/dist/test/pages/CoreControls.html +203 -0
  123. package/dist/test/pages/CoreControls_exp.html +203 -0
  124. package/dist/test/pages/CustomCSS.html +55 -0
  125. package/dist/test/pages/DatePicker.html +193 -0
  126. package/dist/test/pages/DatePicker_test_page.html +97 -0
  127. package/dist/test/pages/DateRangePicker.html +64 -0
  128. package/dist/test/pages/DateTimePicker.html +190 -0
  129. package/dist/test/pages/DayPicker.html +37 -0
  130. package/dist/test/pages/Dialog.html +667 -0
  131. package/dist/test/pages/DialogLifecycle.html +62 -0
  132. package/dist/test/pages/DialogSemantic.html +59 -0
  133. package/dist/test/pages/DurationPicker.html +76 -0
  134. package/dist/test/pages/Eventing.html +33 -0
  135. package/dist/test/pages/FileUploader.html +138 -0
  136. package/dist/test/pages/FormSupport.html +59 -0
  137. package/dist/test/pages/HCB.html +45 -0
  138. package/dist/test/pages/Icon.html +257 -0
  139. package/dist/test/pages/Icon_custom.html +26 -0
  140. package/dist/test/pages/Input.html +722 -0
  141. package/dist/test/pages/InputFieldMinWidth.html +72 -0
  142. package/dist/test/pages/Input_quickview.html +204 -0
  143. package/dist/test/pages/InputsAlignment.html +131 -0
  144. package/dist/test/pages/InputsLazyLoading.html +244 -0
  145. package/dist/test/pages/ItemNavigation.html +94 -0
  146. package/dist/test/pages/Kitchen.html +638 -0
  147. package/dist/test/pages/Kitchen.openui5.html +570 -0
  148. package/dist/test/pages/Label.html +161 -0
  149. package/dist/test/pages/Link.html +201 -0
  150. package/dist/test/pages/List.html +432 -0
  151. package/dist/test/pages/ListGrowing_Button.html +64 -0
  152. package/dist/test/pages/ListGrowing_Scroll.html +93 -0
  153. package/dist/test/pages/List_keyboard_support.html +132 -0
  154. package/dist/test/pages/List_test_page.html +334 -0
  155. package/dist/test/pages/LitKeyFunction.html +40 -0
  156. package/dist/test/pages/MemoryLeak.html +78 -0
  157. package/dist/test/pages/Menu.html +79 -0
  158. package/dist/test/pages/MessagePage.html +39 -0
  159. package/dist/test/pages/MessageStrip.html +55 -0
  160. package/dist/test/pages/MultiComboBox.html +446 -0
  161. package/dist/test/pages/MultiInput.html +409 -0
  162. package/dist/test/pages/MultiInput_Suggestions.html +161 -0
  163. package/dist/test/pages/OpenUI5.html +83 -0
  164. package/dist/test/pages/Panel.html +227 -0
  165. package/dist/test/pages/Popover.html +614 -0
  166. package/dist/test/pages/PopoverArrowBounds.html +54 -0
  167. package/dist/test/pages/Popups.html +133 -0
  168. package/dist/test/pages/ProgressIndicator.html +151 -0
  169. package/dist/test/pages/RTL.html +118 -0
  170. package/dist/test/pages/RadioButton.html +201 -0
  171. package/dist/test/pages/RangeSlider.html +69 -0
  172. package/dist/test/pages/RatingIndicator.html +97 -0
  173. package/dist/test/pages/ResizeHandler.html +74 -0
  174. package/dist/test/pages/ResponsivePopover.html +204 -0
  175. package/dist/test/pages/SegmentedButton.html +116 -0
  176. package/dist/test/pages/Select.html +240 -0
  177. package/dist/test/pages/Simple.html +34 -0
  178. package/dist/test/pages/Slider.html +79 -0
  179. package/dist/test/pages/SplitButton.html +100 -0
  180. package/dist/test/pages/StepInput.html +164 -0
  181. package/dist/test/pages/Switch.html +88 -0
  182. package/dist/test/pages/TabContainer.html +876 -0
  183. package/dist/test/pages/Table-perf-pure.html +73 -0
  184. package/dist/test/pages/Table-perf.html +76 -0
  185. package/dist/test/pages/Table.html +2808 -0
  186. package/dist/test/pages/Table2.html +53 -0
  187. package/dist/test/pages/TableAllPopin.html +205 -0
  188. package/dist/test/pages/TableCustomStyling.html +89 -0
  189. package/dist/test/pages/TableGrouping.html +109 -0
  190. package/dist/test/pages/TableGrowingWithButton.html +805 -0
  191. package/dist/test/pages/TableGrowingWithScroll.html +801 -0
  192. package/dist/test/pages/TableSelection.html +445 -0
  193. package/dist/test/pages/TextArea.html +212 -0
  194. package/dist/test/pages/TimePicker.html +81 -0
  195. package/dist/test/pages/TimeSelection.html +31 -0
  196. package/dist/test/pages/Title.html +37 -0
  197. package/dist/test/pages/Toast.html +111 -0
  198. package/dist/test/pages/ToggleButton.html +69 -0
  199. package/dist/test/pages/Tree.html +294 -0
  200. package/dist/test/pages/WheelSlider_Test_Page.html +26 -0
  201. package/dist/test/pages/base/DOMObserver.html +20 -0
  202. package/dist/test/pages/base/InvisibleMessage.html +44 -0
  203. package/dist/test/pages/form.html +123 -0
  204. package/dist/test/pages/i18n-defaultLang.html +31 -0
  205. package/dist/test/pages/i18n-demo.html +79 -0
  206. package/package.json +9 -8
  207. package/src/AvatarGroup.js +2 -19
package/dist/test/pages/Table2.html ADDED
@@ -0,0 +1,53 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+
4
+ <head>
5
+ <meta charset="utf-8" />
6
+ <title>Web components Table</title>
7
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
8
+ <script data-ui5-config type="application/json">
9
+ {
10
+ "language": "EN"
11
+ }
12
+ </script>
13
+
14
+
15
+
16
+
17
+
18
+
19
+ <script type="module" crossorigin src="/assets/bundle.common.ac7489b0.js"></script>
20
+ <link rel="stylesheet" href="/assets/test/pages/Table2.html.aca0c111.css">
21
+ </head>
22
+
23
+
24
+
25
+ <body class="table21auto">
26
+
27
+ <div></div>
28
+
29
+ <script>
30
+ var domString = '<ui5-table id="table" class="table22auto">' +
31
+ '<ui5-table-column slot="columns" id="col1">' +
32
+ ' <span >Column 1</span>' +
33
+ '</ui5-table-column>' +
34
+ '<ui5-table-column slot="columns" id="col2">' +
35
+ ' <span >Column 1</span>' +
36
+ '</ui5-table-column>' +
37
+ '<ui5-table-row id="roll1">' +
38
+ ' <ui5-table-cell id="cell1">' +
39
+ ' <span>World</span>' +
40
+ ' </ui5-table-cell>' +
41
+ ' <ui5-table-cell id="cell2">' +
42
+ ' <span>World</span>' +
43
+ ' </ui5-table-cell>' +
44
+ '</ui5-table-row>' +
45
+ '</ui5-table>';
46
+
47
+ document.querySelector("body>div").innerHTML = domString;
48
+ </script>
49
+
50
+
51
+ </body>
52
+
53
+ </html>
package/dist/test/pages/TableAllPopin.html ADDED
@@ -0,0 +1,205 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+
4
+ <head>
5
+ <meta charset="utf-8" />
6
+ <title>Web components Table</title>
7
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
8
+ <script data-ui5-config type="application/json">
9
+ {
10
+ "language": "EN"
11
+ }
12
+ </script>
13
+
14
+ <script>
15
+ // delete Document.prototype.adoptedStyleSheets
16
+ </script>
17
+
18
+
19
+
20
+
21
+
22
+
23
+ <script type="module" crossorigin src="/assets/bundle.common.ac7489b0.js"></script>
24
+ <link rel="stylesheet" href="/assets/test/pages/TableAllPopin.html.ad586de4.css">
25
+ </head>
26
+
27
+ <body class="tableallpopin1auto">
28
+
29
+ <ui5-table class="demo-table" id="tbl">
30
+ <!-- Columns -->
31
+ <ui5-table-column class="title-column" slot="columns">
32
+ <ui5-label>Product</ui5-label>
33
+ </ui5-table-column>
34
+
35
+ <ui5-table-column class="supplier-column" slot="columns" min-width="1024" popin-text="Supplier" demand-popin>
36
+ <ui5-label>Supplier</ui5-label>
37
+ </ui5-table-column>
38
+
39
+ <ui5-table-column class="dim-column" slot="columns" min-width="800" popin-text="Dimensions" demand-popin>
40
+ <div class="column-content">
41
+ <ui5-label>Dimensions</ui5-label>
42
+ </div>
43
+ </ui5-table-column>
44
+
45
+ <ui5-table-column class="weight-column" slot="columns" min-width="640" popin-text="Weight" demand-popin>
46
+ <ui5-label>Weight</ui5-label>
47
+ </ui5-table-column>
48
+
49
+ <ui5-table-column class="price-column" slot="columns">
50
+ <ui5-label>Price</ui5-label>
51
+ </ui5-table-column>
52
+
53
+
54
+ <ui5-table-row id="row1">
55
+ <ui5-table-cell class="title-cell">Notebook Basic 15</ui5-table-cell>
56
+ <ui5-table-cell>Very Best Screens</ui5-table-cell>
57
+ <ui5-table-cell>30 x 18 x 3 cm</ui5-table-cell>
58
+ <ui5-table-cell>4.2 KG</ui5-table-cell>
59
+ <ui5-table-cell class="price-cell">956 EUR</ui5-table-cell>
60
+ </ui5-table-row>
61
+
62
+ <ui5-table-row id="row2">
63
+ <ui5-table-cell class="title-cell">Notebook Basic 17</ui5-table-cell>
64
+ <ui5-table-cell>Very Best Screens</ui5-table-cell>
65
+ <ui5-table-cell>40 x 18 x 3 cm</ui5-table-cell>
66
+ <ui5-table-cell>4.6 KG</ui5-table-cell>
67
+ <ui5-table-cell class="price-cell">1956 EUR</ui5-table-cell>
68
+ </ui5-table-row>
69
+
70
+ <ui5-table-row id="row3">
71
+ <ui5-table-cell class="title-cell">Notebook Basic 19</ui5-table-cell>
72
+ <ui5-table-cell>Very Best Screens</ui5-table-cell>
73
+ <ui5-table-cell>50 x 18 x 3 cm</ui5-table-cell>
74
+ <ui5-table-cell>4.9 KG</ui5-table-cell>
75
+ <ui5-table-cell class="price-cell">2956 EUR</ui5-table-cell>
76
+ </ui5-table-row>
77
+
78
+ </ui5-table>
79
+
80
+ <br>
81
+ <br>
82
+ <br>
83
+
84
+ <ui5-table class="demo-table" id="tbl2" mode="SingleSelect">
85
+ <!-- Columns -->
86
+ <ui5-table-column slot="columns" style="width: 12rem">
87
+ <ui5-label>Product</ui5-label>
88
+ </ui5-table-column>
89
+ <ui5-table-column slot="columns" min-width="800" popin-text="Supplier">
90
+ <ui5-label>Supplier</ui5-label>
91
+ </ui5-table-column>
92
+ <ui5-table-column slot="columns" demand-popin min-width="600" popin-text="Dimensions">
93
+ <ui5-label>Dimensions</ui5-label>
94
+ </ui5-table-column>
95
+ <ui5-table-column slot="columns" demand-popin min-width="600" popin-text="Weight">
96
+ <ui5-label>Weight</ui5-label>
97
+ </ui5-table-column>
98
+ <ui5-table-column slot="columns">
99
+ <ui5-label></ui5-label>
100
+ </ui5-table-column>
101
+
102
+ <ui5-table-row>
103
+ <ui5-table-cell>
104
+ <ui5-input id="interactive"></ui5-input>
105
+ </ui5-table-cell>
106
+ <ui5-table-cell>
107
+ <ui5-input></ui5-input>
108
+ </ui5-table-cell>
109
+ <ui5-table-cell>
110
+ <ui5-input id="input-second-focused"></ui5-input>
111
+ </ui5-table-cell>
112
+ <ui5-table-cell>
113
+ <ui5-input></ui5-input>
114
+ </ui5-table-cell>
115
+ <ui5-table-cell>
116
+ <ui5-button icon="delete" id="btn-focused"></ui5-button>
117
+ </ui5-table-cell>
118
+ </ui5-table-row>
119
+ <ui5-table-row>
120
+ <ui5-table-cell>
121
+ <ui5-input></ui5-input>
122
+ </ui5-table-cell>
123
+ <ui5-table-cell>
124
+ <ui5-input></ui5-input>
125
+ </ui5-table-cell>
126
+ <ui5-table-cell>
127
+ <ui5-input></ui5-input>
128
+ </ui5-table-cell>
129
+ <ui5-table-cell>
130
+ <ui5-input></ui5-input>
131
+ </ui5-table-cell>
132
+ <ui5-table-cell>
133
+ <ui5-button icon="delete"></ui5-button>
134
+ </ui5-table-cell>
135
+ </ui5-table-row>
136
+
137
+ </ui5-table>
138
+
139
+ <br>
140
+ <br>
141
+ <br>
142
+
143
+ <h2>SingleSelect table (click on an item to set as navigated)</h2>
144
+ <ui5-table class="demo-table" mode="SingleSelect" id="tbl3">
145
+ <!-- Columns -->
146
+ <ui5-table-column class="title-column" slot="columns">
147
+ <ui5-label>Product</ui5-label>
148
+ </ui5-table-column>
149
+
150
+ <ui5-table-column class="supplier-column" slot="columns" min-width="1024" popin-text="Supplier" demand-popin>
151
+ <ui5-label>Supplier</ui5-label>
152
+ </ui5-table-column>
153
+
154
+ <ui5-table-column class="dim-column" slot="columns" min-width="800" popin-text="Dimensions" demand-popin>
155
+ <div class="column-content">
156
+ <ui5-label>Dimensions</ui5-label>
157
+ </div>
158
+ </ui5-table-column>
159
+
160
+ <ui5-table-column class="weight-column" slot="columns" min-width="640" popin-text="Weight" demand-popin>
161
+ <ui5-label>Weight</ui5-label>
162
+ </ui5-table-column>
163
+
164
+ <ui5-table-column class="price-column" slot="columns">
165
+ <ui5-label>Price</ui5-label>
166
+ </ui5-table-column>
167
+
168
+
169
+ <ui5-table-row id="row1">
170
+ <ui5-table-cell class="title-cell">Notebook Basic 15</ui5-table-cell>
171
+ <ui5-table-cell>Very Best Screens</ui5-table-cell>
172
+ <ui5-table-cell>30 x 18 x 3 cm</ui5-table-cell>
173
+ <ui5-table-cell>4.2 KG</ui5-table-cell>
174
+ <ui5-table-cell class="price-cell">956 EUR</ui5-table-cell>
175
+ </ui5-table-row>
176
+
177
+ <ui5-table-row id="row2">
178
+ <ui5-table-cell class="title-cell">Notebook Basic 17</ui5-table-cell>
179
+ <ui5-table-cell>Very Best Screens</ui5-table-cell>
180
+ <ui5-table-cell>40 x 18 x 3 cm</ui5-table-cell>
181
+ <ui5-table-cell>4.6 KG</ui5-table-cell>
182
+ <ui5-table-cell class="price-cell">1956 EUR</ui5-table-cell>
183
+ </ui5-table-row>
184
+
185
+ <ui5-table-row id="row3">
186
+ <ui5-table-cell class="title-cell">Notebook Basic 19</ui5-table-cell>
187
+ <ui5-table-cell>Very Best Screens</ui5-table-cell>
188
+ <ui5-table-cell>50 x 18 x 3 cm</ui5-table-cell>
189
+ <ui5-table-cell>4.9 KG</ui5-table-cell>
190
+ <ui5-table-cell class="price-cell">2956 EUR</ui5-table-cell>
191
+ </ui5-table-row>
192
+
193
+ </ui5-table>
194
+
195
+ <script>
196
+ document.getElementById("tbl3").addEventListener("ui5-selection-change", function(event) {
197
+ if (event.detail.previouslySelectedRows.length) {
198
+ event.detail.previouslySelectedRows[0].removeAttribute("navigated");
199
+ }
200
+ event.detail.selectedRows[0].setAttribute("navigated", '');
201
+ });
202
+ </script>
203
+ </body>
204
+
205
+ </html>
package/dist/test/pages/TableCustomStyling.html ADDED
@@ -0,0 +1,89 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+
4
+ <head>
5
+ <meta charset="utf-8" />
6
+ <title>Web components Table</title>
7
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
8
+ <script data-ui5-config type="application/json">
9
+ {
10
+ "language": "EN"
11
+ }
12
+ </script>
13
+
14
+ <script>
15
+ // delete Document.prototype.adoptedStyleSheets
16
+ </script>
17
+
18
+
19
+
20
+
21
+
22
+ <script type="module" crossorigin src="/assets/bundle.common.ac7489b0.js"></script>
23
+ <link rel="stylesheet" href="/assets/test/pages/TableCustomStyling.html.a85167d6.css">
24
+ </head>
25
+
26
+
27
+
28
+ <body class="tablecustomstyling1auto">
29
+
30
+ <ui5-table class="demo-table" id="tbl">
31
+ <!-- Columns -->
32
+ <ui5-table-column class="title-column" slot="columns">
33
+ <ui5-label>Product</ui5-label>
34
+ </ui5-table-column>
35
+
36
+ <ui5-table-column class="supplier-column" slot="columns" min-width="1024" popin-text="Supplier">
37
+ <ui5-label>Supplier</ui5-label>
38
+ </ui5-table-column>
39
+
40
+ <ui5-table-column class="dim-column" slot="columns" min-width="800" popin-text="Dimensions" demand-popin>
41
+ <div class="column-content">
42
+ <ui5-label>Dimensions</ui5-label>
43
+ </div>
44
+ </ui5-table-column>
45
+
46
+ <ui5-table-column class="weight-column" slot="columns" min-width="640" popin-text="Weight" demand-popin>
47
+ <ui5-label>Weight</ui5-label>
48
+ </ui5-table-column>
49
+
50
+ <ui5-table-column class="price-column" slot="columns">
51
+ <ui5-label>Price</ui5-label>
52
+ </ui5-table-column>
53
+
54
+
55
+ <ui5-table-row id="row1">
56
+ <ui5-table-cell class="title-cell">Notebook Basic 15</ui5-table-cell>
57
+ <ui5-table-cell>Very Best Screens</ui5-table-cell>
58
+ <ui5-table-cell>30 x 18 x 3 cm</ui5-table-cell>
59
+ <ui5-table-cell>4.2 KG</ui5-table-cell>
60
+ <ui5-table-cell class="price-cell">956 EUR</ui5-table-cell>
61
+ </ui5-table-row>
62
+
63
+ <ui5-table-row id="row2">
64
+ <ui5-table-cell class="title-cell">Notebook Basic 17</ui5-table-cell>
65
+ <ui5-table-cell>Very Best Screens</ui5-table-cell>
66
+ <ui5-table-cell>40 x 18 x 3 cm</ui5-table-cell>
67
+ <ui5-table-cell>4.6 KG</ui5-table-cell>
68
+ <ui5-table-cell class="price-cell">1956 EUR</ui5-table-cell>
69
+ </ui5-table-row>
70
+
71
+ <ui5-table-row id="row3">
72
+ <ui5-table-cell class="title-cell">Notebook Basic 19</ui5-table-cell>
73
+ <ui5-table-cell>Very Best Screens</ui5-table-cell>
74
+ <ui5-table-cell>50 x 18 x 3 cm</ui5-table-cell>
75
+ <ui5-table-cell>4.9 KG</ui5-table-cell>
76
+ <ui5-table-cell class="price-cell">2956 EUR</ui5-table-cell>
77
+ </ui5-table-row>
78
+
79
+ </ui5-table>
80
+
81
+ <script>
82
+ document.getElementById("tbl").addEventListener("rowClick", function(event) {
83
+ console.log("Row click: ", event.detail.row);
84
+ });
85
+ </script>
86
+
87
+ </body>
88
+
89
+ </html>
package/dist/test/pages/TableGrouping.html ADDED
@@ -0,0 +1,109 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+
4
+ <head>
5
+ <meta charset="utf-8" />
6
+ <title>Web components Table</title>
7
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
8
+ <script data-ui5-config type="application/json">
9
+ {
10
+ "language": "EN"
11
+ }
12
+ </script>
13
+
14
+
15
+
16
+
17
+
18
+
19
+ <script type="module" crossorigin src="/assets/bundle.common.ac7489b0.js"></script>
20
+ <link rel="stylesheet" href="/assets/test/pages/TableGrouping.html.602ae2ad.css">
21
+ </head>
22
+
23
+ <body class="tablegrouping1auto">
24
+
25
+ <ui5-title>Table with grouping:</ui5-title>
26
+ <ui5-table class="demo-table-single" id="groupedSingleTable">
27
+ <ui5-table-column id="column-1" slot="columns">
28
+ <ui5-label>City</ui5-label>
29
+ </ui5-table-column>
30
+ <ui5-table-column id="column-2" slot="columns" min-width="500" popin-text="Supplier">
31
+ <ui5-label>Supplier</ui5-label>
32
+ </ui5-table-column>
33
+ <ui5-table-column id="column-3" slot="columns" min-width="500" popin-text="Country" demand-popin>
34
+ <div class="column-content">
35
+ <ui5-label>Country</ui5-label>
36
+ </div>
37
+ </ui5-table-column>
38
+
39
+ <ui5-table-group-row>Country: Bulgaria</ui5-table-group-row>
40
+
41
+ <ui5-table-row>
42
+ <ui5-table-cell><span>Sofia</span></ui5-table-cell>
43
+ <ui5-table-cell><span>Sirenje EOOD</span></ui5-table-cell>
44
+ <ui5-table-cell><span>Bulgaria</span></ui5-table-cell>
45
+ </ui5-table-row>
46
+ <ui5-table-row>
47
+ <ui5-table-cell><span>Plovdiv</span></ui5-table-cell>
48
+ <ui5-table-cell><span>Kashkavali AD</span></ui5-table-cell>
49
+ <ui5-table-cell><span>Bulgaria</span></ui5-table-cell>
50
+ </ui5-table-row>
51
+ <ui5-table-group-row><span>Country: USA</span></ui5-table-group-row>
52
+ <ui5-table-row>
53
+ <ui5-table-cell><span>Dublin</span></ui5-table-cell>
54
+ <ui5-table-cell><span>J.M. Brothers</span></ui5-table-cell>
55
+ <ui5-table-cell><span>USA</span></ui5-table-cell>
56
+ </ui5-table-row>
57
+ <ui5-table-row>
58
+ <ui5-table-cell><span>Boston</span></ui5-table-cell>
59
+ <ui5-table-cell><span>J.M. Brothers</span></ui5-table-cell>
60
+ <ui5-table-cell><span>USA</span></ui5-table-cell>
61
+ </ui5-table-row>
62
+ </ui5-table>
63
+
64
+ <br>
65
+ <hr>
66
+ <br>
67
+
68
+ <ui5-title>MultiSelect Table with grouping:</ui5-title>
69
+ <ui5-table class="demo-table-multi" id="groupedMultiTable" mode="MultiSelect">
70
+ <ui5-table-column id="column-1" slot="columns">
71
+ <ui5-label>City</ui5-label>
72
+ </ui5-table-column>
73
+ <ui5-table-column id="column-2" slot="columns" min-width="500" popin-text="Supplier">
74
+ <ui5-label>Supplier</ui5-label>
75
+ </ui5-table-column>
76
+ <ui5-table-column id="column-3" slot="columns" min-width="500" popin-text="Country" demand-popin>
77
+ <div class="column-content">
78
+ <ui5-label>Country</ui5-label>
79
+ </div>
80
+ </ui5-table-column>
81
+
82
+ <ui5-table-group-row>Country: Bulgaria</ui5-table-group-row>
83
+ <ui5-table-row>
84
+ <ui5-table-cell><span>Sofia</span></ui5-table-cell>
85
+ <ui5-table-cell><span>Sirenje EOOD</span></ui5-table-cell>
86
+ <ui5-table-cell><span>Bulgaria</span></ui5-table-cell>
87
+ </ui5-table-row>
88
+ <ui5-table-row>
89
+ <ui5-table-cell><span>Plovdiv</span></ui5-table-cell>
90
+ <ui5-table-cell><span>Kashkavali AD</span></ui5-table-cell>
91
+ <ui5-table-cell><span>Bulgaria</span></ui5-table-cell>
92
+ </ui5-table-row>
93
+ <ui5-table-group-row>Country: USA</ui5-table-group-row>
94
+ <ui5-table-row>
95
+ <ui5-table-cell><span>Dublin</span></ui5-table-cell>
96
+ <ui5-table-cell><span>J.M. Brothers</span></ui5-table-cell>
97
+ <ui5-table-cell><span>USA</span></ui5-table-cell>
98
+ </ui5-table-row>
99
+ <ui5-table-row>
100
+ <ui5-table-cell><span>Boston</span></ui5-table-cell>
101
+ <ui5-table-cell><span>J.M. Brothers</span></ui5-table-cell>
102
+ <ui5-table-cell><span>USA</span></ui5-table-cell>
103
+ </ui5-table-row>
104
+ </ui5-table>
105
+
106
+
107
+ </body>
108
+
109
+ </html>