@zanichelli/albe-web-components 13.2.0-rc1 → 13.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (130) hide show
  1. package/CHANGELOG.md +17 -0
  2. package/dist/cjs/loader.cjs.js +1 -1
  3. package/dist/cjs/web-components-library.cjs.js +1 -1
  4. package/dist/cjs/z-app-header_12.cjs.entry.js +16 -12
  5. package/dist/cjs/z-app-header_12.cjs.entry.js.map +1 -1
  6. package/dist/cjs/z-carousel.cjs.entry.js +3 -2
  7. package/dist/cjs/z-carousel.cjs.entry.js.map +1 -1
  8. package/dist/cjs/z-combobox.cjs.entry.js +38 -145
  9. package/dist/cjs/z-combobox.cjs.entry.js.map +1 -1
  10. package/dist/cjs/z-file-upload.cjs.entry.js +25 -14
  11. package/dist/cjs/z-file-upload.cjs.entry.js.map +1 -1
  12. package/dist/cjs/z-popover.cjs.entry.js +3 -3
  13. package/dist/cjs/z-popover.cjs.entry.js.map +1 -1
  14. package/dist/cjs/z-table.cjs.entry.js +3 -2
  15. package/dist/cjs/z-table.cjs.entry.js.map +1 -1
  16. package/dist/collection/components/file-upload/z-file-upload/index.js +63 -13
  17. package/dist/collection/components/file-upload/z-file-upload/index.js.map +1 -1
  18. package/dist/collection/components/file-upload/z-file-upload/styles.css +12 -0
  19. package/dist/collection/components/icons/icons.js +10 -0
  20. package/dist/collection/components/icons/icons.js.map +1 -1
  21. package/dist/collection/components/inputs/z-combobox/index.js +41 -149
  22. package/dist/collection/components/inputs/z-combobox/index.js.map +1 -1
  23. package/dist/collection/components/inputs/z-combobox/index.spec.js +155 -185
  24. package/dist/collection/components/inputs/z-combobox/index.spec.js.map +1 -1
  25. package/dist/collection/components/inputs/z-combobox/styles.css +10 -10
  26. package/dist/collection/components/inputs/z-input/index.js +5 -41
  27. package/dist/collection/components/inputs/z-input/index.js.map +1 -1
  28. package/dist/collection/components/list/z-list-element/index.js +1 -20
  29. package/dist/collection/components/list/z-list-element/index.js.map +1 -1
  30. package/dist/collection/components/table/z-table/index.js +3 -2
  31. package/dist/collection/components/table/z-table/index.js.map +1 -1
  32. package/dist/collection/components/z-carousel/index.js +3 -1
  33. package/dist/collection/components/z-carousel/index.js.map +1 -1
  34. package/dist/collection/components/z-carousel/styles.css +3 -0
  35. package/dist/collection/components/z-popover/index.js +4 -4
  36. package/dist/collection/components/z-popover/index.js.map +1 -1
  37. package/dist/components/icons.js +10 -0
  38. package/dist/components/icons.js.map +1 -1
  39. package/dist/components/index10.js +5 -11
  40. package/dist/components/index10.js.map +1 -1
  41. package/dist/components/index13.js +1 -3
  42. package/dist/components/index13.js.map +1 -1
  43. package/dist/components/index25.js +3 -3
  44. package/dist/components/index25.js.map +1 -1
  45. package/dist/components/z-carousel.js +3 -2
  46. package/dist/components/z-carousel.js.map +1 -1
  47. package/dist/components/z-combobox.js +49 -163
  48. package/dist/components/z-combobox.js.map +1 -1
  49. package/dist/components/z-file-upload.js +28 -15
  50. package/dist/components/z-file-upload.js.map +1 -1
  51. package/dist/components/z-table.js +3 -2
  52. package/dist/components/z-table.js.map +1 -1
  53. package/dist/esm/loader.js +1 -1
  54. package/dist/esm/web-components-library.js +1 -1
  55. package/dist/esm/z-app-header_12.entry.js +16 -12
  56. package/dist/esm/z-app-header_12.entry.js.map +1 -1
  57. package/dist/esm/z-carousel.entry.js +3 -2
  58. package/dist/esm/z-carousel.entry.js.map +1 -1
  59. package/dist/esm/z-combobox.entry.js +40 -147
  60. package/dist/esm/z-combobox.entry.js.map +1 -1
  61. package/dist/esm/z-file-upload.entry.js +25 -14
  62. package/dist/esm/z-file-upload.entry.js.map +1 -1
  63. package/dist/esm/z-popover.entry.js +3 -3
  64. package/dist/esm/z-popover.entry.js.map +1 -1
  65. package/dist/esm/z-table.entry.js +3 -2
  66. package/dist/esm/z-table.entry.js.map +1 -1
  67. package/dist/types/components/file-upload/z-file-upload/index.d.ts +5 -0
  68. package/dist/types/components/icons/icons.d.ts +20 -0
  69. package/dist/types/components/inputs/z-combobox/index.d.ts +1 -14
  70. package/dist/types/components/inputs/z-input/index.d.ts +0 -5
  71. package/dist/types/components/list/z-list-element/index.d.ts +0 -2
  72. package/dist/types/components/z-carousel/index.d.ts +1 -0
  73. package/dist/types/components/z-popover/index.d.ts +1 -0
  74. package/dist/types/components.d.ts +18 -23
  75. package/dist/web-components-library/{p-158b6dda.entry.js → p-3796ca7c.entry.js} +2 -2
  76. package/dist/web-components-library/p-3796ca7c.entry.js.map +1 -0
  77. package/dist/web-components-library/p-9b52dea5.entry.js +2 -0
  78. package/dist/web-components-library/p-9b52dea5.entry.js.map +1 -0
  79. package/dist/web-components-library/p-aa0f32d7.entry.js +2 -0
  80. package/dist/web-components-library/p-aa0f32d7.entry.js.map +1 -0
  81. package/dist/web-components-library/p-ba8e67ee.entry.js +2 -0
  82. package/dist/web-components-library/p-ba8e67ee.entry.js.map +1 -0
  83. package/dist/web-components-library/p-ed1a5ee3.entry.js +2 -0
  84. package/dist/web-components-library/p-ed1a5ee3.entry.js.map +1 -0
  85. package/{www/build/p-2637ab23.entry.js → dist/web-components-library/p-f7607ce7.entry.js} +2 -2
  86. package/dist/web-components-library/p-f7607ce7.entry.js.map +1 -0
  87. package/dist/web-components-library/web-components-library.css +1 -1
  88. package/dist/web-components-library/web-components-library.esm.js +1 -1
  89. package/dist/web-components-library/web-components-library.esm.js.map +1 -1
  90. package/package.json +2 -2
  91. package/www/build/p-22cc270c.css +3 -0
  92. package/www/build/{p-158b6dda.entry.js → p-3796ca7c.entry.js} +2 -2
  93. package/www/build/p-3796ca7c.entry.js.map +1 -0
  94. package/www/build/p-9b52dea5.entry.js +2 -0
  95. package/www/build/p-9b52dea5.entry.js.map +1 -0
  96. package/www/build/p-aa0f32d7.entry.js +2 -0
  97. package/www/build/p-aa0f32d7.entry.js.map +1 -0
  98. package/www/build/p-ba8e67ee.entry.js +2 -0
  99. package/www/build/p-ba8e67ee.entry.js.map +1 -0
  100. package/www/build/p-ddd9a0ea.js +2 -0
  101. package/www/build/p-ed1a5ee3.entry.js +2 -0
  102. package/www/build/p-ed1a5ee3.entry.js.map +1 -0
  103. package/{dist/web-components-library/p-2637ab23.entry.js → www/build/p-f7607ce7.entry.js} +2 -2
  104. package/www/build/p-f7607ce7.entry.js.map +1 -0
  105. package/www/build/web-components-library.css +1 -1
  106. package/www/build/web-components-library.esm.js +1 -1
  107. package/www/build/web-components-library.esm.js.map +1 -1
  108. package/www/index.html +1 -1
  109. package/dist/web-components-library/p-158b6dda.entry.js.map +0 -1
  110. package/dist/web-components-library/p-2637ab23.entry.js.map +0 -1
  111. package/dist/web-components-library/p-2b2cb566.entry.js +0 -2
  112. package/dist/web-components-library/p-2b2cb566.entry.js.map +0 -1
  113. package/dist/web-components-library/p-2df884ef.entry.js +0 -2
  114. package/dist/web-components-library/p-2df884ef.entry.js.map +0 -1
  115. package/dist/web-components-library/p-5023f7d5.entry.js +0 -2
  116. package/dist/web-components-library/p-5023f7d5.entry.js.map +0 -1
  117. package/dist/web-components-library/p-93cb103f.entry.js +0 -2
  118. package/dist/web-components-library/p-93cb103f.entry.js.map +0 -1
  119. package/www/build/p-158b6dda.entry.js.map +0 -1
  120. package/www/build/p-2637ab23.entry.js.map +0 -1
  121. package/www/build/p-2b2cb566.entry.js +0 -2
  122. package/www/build/p-2b2cb566.entry.js.map +0 -1
  123. package/www/build/p-2df884ef.entry.js +0 -2
  124. package/www/build/p-2df884ef.entry.js.map +0 -1
  125. package/www/build/p-32cd9d9b.js +0 -2
  126. package/www/build/p-36aea196.css +0 -3
  127. package/www/build/p-5023f7d5.entry.js +0 -2
  128. package/www/build/p-5023f7d5.entry.js.map +0 -1
  129. package/www/build/p-93cb103f.entry.js +0 -2
  130. package/www/build/p-93cb103f.entry.js.map +0 -1
package/dist/collection/components/inputs/z-combobox/index.spec.js CHANGED
@@ -10,7 +10,7 @@ describe("Suite test ZCombobox", () => {
10
10
  <z-combobox items='[]'>
11
11
  <mock:shadow-root>
12
12
  <div data-action="combo-undefined">
13
- <div aria-expanded="false" class="header" role="button" tabindex="0">
13
+ <div class="header" role="button" tabindex="0">
14
14
  <p class="body-3"><span></span></p>
15
15
  <z-icon class="big" name="caret-down" />
16
16
  </div>
@@ -28,7 +28,7 @@ describe("Suite test ZCombobox", () => {
28
28
  <z-combobox disabled='' items='[]'>
29
29
  <mock:shadow-root>
30
30
  <div class="disabled" data-action="combo-undefined">
31
- <div aria-expanded="false" class="header" role="button" tabindex="0">
31
+ <div class="header" role="button" tabindex="0">
32
32
  <p class="body-3"><span></span></p>
33
33
  <z-icon class="big" name="caret-down" />
34
34
  </div>
@@ -46,7 +46,7 @@ describe("Suite test ZCombobox", () => {
46
46
  <z-combobox items='[]' inputid="combobox" label="label" isfixed>
47
47
  <mock:shadow-root>
48
48
  <div class="fixed" id="combobox" data-action="combo-combobox">
49
- <div aria-expanded="false" class="header" role="button" tabindex="0">
49
+ <div class="header" role="button" tabindex="0">
50
50
  <p class="body-3">
51
51
  label
52
52
  <span></span>
@@ -67,7 +67,7 @@ describe("Suite test ZCombobox", () => {
67
67
  <z-combobox items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]' inputid="combobox" label="label">
68
68
  <mock:shadow-root>
69
69
  <div data-action="combo-combobox" id="combobox">
70
- <div aria-expanded="false" class="header" role="button" tabindex="0">
70
+ <div class="header" role="button" tabindex="0">
71
71
  <p class="body-3">
72
72
  label
73
73
  <span>(1)</span>
@@ -82,24 +82,21 @@ describe("Suite test ZCombobox", () => {
82
82
  it("Test render ZCombobox aperta vuota", async () => {
83
83
  const page = await newSpecPage({
84
84
  components: [ZCombobox],
85
- html: `<z-combobox items='[]' inputid="combobox" noresultslabel='non ci sono risultati'></z-combobox>`,
85
+ html: `<z-combobox items='[]' noresultslabel='non ci sono risultati'></z-combobox>`,
86
86
  });
87
87
  page.rootInstance.isopen = true;
88
88
  await page.waitForChanges();
89
89
  expect(page.root).toEqualHtml(`
90
- <z-combobox items='[]' inputid="combobox" noresultslabel='non ci sono risultati'>
90
+ <z-combobox items='[]' noresultslabel='non ci sono risultati'>
91
91
  <mock:shadow-root>
92
- <div class="open" data-action="combo-combobox" id="combobox">
93
- <div aria-expanded="true" class="header" role="button" tabindex="0">
92
+ <div class="open" data-action="combo-undefined">
93
+ <div class="header" role="button" tabindex="0">
94
94
  <p class="body-3"><span></span></p>
95
95
  <z-icon class="big" name="caret-down" ></z-icon>
96
96
  </div>
97
97
  <div class="open-combo-data">
98
- <span role="combobox" aria-controls="combobox_list" aria-expanded="true"></span>
99
- <div aria-multiselectable="" role="listbox" id="combobox_list" aria-owns="">
100
- <div>
101
- <ul role="none"></ul>
102
- </div>
98
+ <div tabindex="-1">
99
+ <ul></ul>
103
100
  </div>
104
101
  </div>
105
102
  </div>
@@ -110,32 +107,29 @@ describe("Suite test ZCombobox", () => {
110
107
  it("Test render ZCombobox aperta con elementi", async () => {
111
108
  const page = await newSpecPage({
112
109
  components: [ZCombobox],
113
- html: `<z-combobox inputid="combobox" label="combo" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'></z-combobox>`,
110
+ html: `<z-combobox inputid="combo" label="combo" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'></z-combobox>`,
114
111
  });
115
112
  page.rootInstance.isopen = true;
116
113
  await page.waitForChanges();
117
114
  expect(page.root).toEqualHtml(`
118
- <z-combobox inputid="combobox" label="combo" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'>
115
+ <z-combobox inputid="combo" label="combo" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'>
119
116
  <mock:shadow-root>
120
- <div class="open" data-action="combo-combobox" id="combobox">
121
- <div aria-expanded="true" class="header" role="button" tabindex="0">
117
+ <div class="open" data-action="combo-combo" id="combo">
118
+ <div class="header" role="button" tabindex="0">
122
119
  <p class="body-3">combo<span>(1)</span></p>
123
120
  <z-icon class="big" name="caret-down" />
124
121
  </div>
125
- <div class="open-combo-data">
126
- <span role="combobox" aria-controls="combobox_list" aria-expanded="true"></span>
127
- <div aria-multiselectable="" role="listbox" id="combobox_list" aria-owns="combo-checkbox-combobox-item_1 combo-checkbox-combobox-item_2">
128
- <div>
129
- <ul role="none">
130
- <z-list-element dividertype="element" id="item_1" size="large">
131
- <z-input role="option" aria-selected="false" disabled="0" class="combo-item-checkbox-input-combobox" type="checkbox" size="big" htmlid="combo-checkbox-combobox-item_1" innertabindex="0" label="primo elemento"></z-input>
132
- </z-list-element>
133
- <z-list-element dividertype="none" id="item_2" size="large">
134
- <z-input role="option" aria-selected="true" type="checkbox" class="combo-item-checkbox-input-combobox" size="big" htmlid="combo-checkbox-combobox-item_2" innertabindex="-1" label="secondo elemento" checked></z-input>
135
- </z-list-element>
136
- </ul>
137
- </div>
138
- </div>
122
+ <div class="open-combo-data">
123
+ <div tabindex="-1">
124
+ <ul>
125
+ <z-myz-list-item class="big" id="item_1" listitemid="item_1" action="combo-li-combo" underlined="">
126
+ <z-input disabled="0" type="checkbox" size="big" htmlid="combo-checkbox-combo-item_1" label="primo elemento"></z-input>
127
+ </z-myz-list-item>
128
+ <z-myz-list-item class="big" id="item_2" listitemid="item_2" action="combo-li-combo">
129
+ <z-input type="checkbox" size="big" htmlid="combo-checkbox-combo-item_2" label="secondo elemento" checked></z-input>
130
+ </z-myz-list-item>
131
+ </ul>
132
+ </div
139
133
  </div>
140
134
  </div>
141
135
  </mock:shadow-root>
@@ -145,31 +139,29 @@ describe("Suite test ZCombobox", () => {
145
139
  it("Test render ZCombobox aperta con ricerca", async () => {
146
140
  const page = await newSpecPage({
147
141
  components: [ZCombobox],
148
- html: `<z-combobox inputid="combobox" label="combo" hassearch=true searchlabel="cerca" searchplaceholder="placeholder" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'></z-combobox>`,
142
+ html: `<z-combobox inputid="combo" label="combo" hassearch=true searchlabel="cerca" searchplaceholder="placeholder" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'></z-combobox>`,
149
143
  });
150
144
  page.rootInstance.isopen = true;
151
145
  await page.waitForChanges();
152
146
  expect(page.root).toEqualHtml(`
153
- <z-combobox inputid="combobox" label="combo" hassearch=true searchlabel="cerca" searchplaceholder="placeholder" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'>
147
+ <z-combobox inputid="combo" label="combo" hassearch=true searchlabel="cerca" searchplaceholder="placeholder" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'>
154
148
  <mock:shadow-root>
155
- <div class="open" data-action="combo-combobox" id="combobox">
156
- <div aria-expanded="true" class="header" role="button" tabindex="0">
149
+ <div class="open" data-action="combo-combo" id="combo">
150
+ <div class="header" role="button" tabindex="0">
157
151
  <p class="body-3">combo<span>(1)</span></p>
158
152
  <z-icon class="big" name="caret-down" />
159
153
  </div>
160
154
  <div class="open-combo-data">
161
- <z-input aria-autocomplete="list" aria-controls="combobox_list" aria-expanded="true" htmlid="combobox_search" label="cerca" placeholder="placeholder" role="combobox" size="big" type="text"></z-input>
162
- <div aria-multiselectable="" role="listbox" id="combobox_list" aria-owns="combo-checkbox-combobox-item_1 combo-checkbox-combobox-item_2">
163
- <div>
164
- <ul role="none">
165
- <z-list-element dividertype="element" id="item_1" size="large">
166
- <z-input role="option" aria-selected="false" disabled="0" class="combo-item-checkbox-input-combobox" type="checkbox" size="big" htmlid="combo-checkbox-combobox-item_1" innertabindex="0" label="primo elemento"></z-input>
167
- </z-list-element>
168
- <z-list-element dividertype="none" id="item_2" size="large">
169
- <z-input type="checkbox" role="option" aria-selected="true" class="combo-item-checkbox-input-combobox" size="big" htmlid="combo-checkbox-combobox-item_2" innertabindex="-1" label="secondo elemento" checked></z-input>
170
- </z-list-element>
171
- </ul>
172
- </div>
155
+ <z-input size="big" htmlid="combo_search" label="cerca" placeholder="placeholder" type="text"></z-input>
156
+ <div tabindex="-1">
157
+ <ul>
158
+ <z-myz-list-item class="big" id="item_1" listitemid="item_1" action="combo-li-combo" underlined="">
159
+ <z-input disabled="0" type="checkbox" size="big" htmlid="combo-checkbox-combo-item_1" label="primo elemento"></z-input>
160
+ </z-myz-list-item>
161
+ <z-myz-list-item class="big" id="item_2" listitemid="item_2" action="combo-li-combo">
162
+ <z-input type="checkbox" size="big" htmlid="combo-checkbox-combo-item_2" label="secondo elemento" checked></z-input>
163
+ </z-myz-list-item>
164
+ </ul>
173
165
  </div>
174
166
  </div>
175
167
  </div>
@@ -180,31 +172,29 @@ describe("Suite test ZCombobox", () => {
180
172
  it("Test render ZCombobox aperta con ricerca attiva e risultati", async () => {
181
173
  const page = await newSpecPage({
182
174
  components: [ZCombobox],
183
- html: `<z-combobox inputid="combobox" label="combo" hassearch=true searchlabel="cerca" searchplaceholder="placeholder" closesearchtext="CHIUDI" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'></z-combobox>`,
175
+ html: `<z-combobox inputid="combo" label="combo" hassearch=true searchlabel="cerca" searchplaceholder="placeholder" closesearchtext="CHIUDI" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'></z-combobox>`,
184
176
  });
185
177
  page.rootInstance.isopen = true;
186
178
  page.rootInstance.searchValue = "primo";
187
179
  await page.waitForChanges();
188
180
  expect(page.root).toEqualHtml(`
189
- <z-combobox inputid="combobox" label="combo" hassearch=true searchlabel="cerca" searchplaceholder="placeholder" closesearchtext="CHIUDI" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'>
181
+ <z-combobox inputid="combo" label="combo" hassearch=true searchlabel="cerca" searchplaceholder="placeholder" closesearchtext="CHIUDI" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'>
190
182
  <mock:shadow-root>
191
- <div class="open" data-action="combo-combobox" id="combobox">
192
- <div aria-expanded="true" class="header" role="button" tabindex="0">
183
+ <div class="open" data-action="combo-combo" id="combo">
184
+ <div class="header" role="button" tabindex="0">
193
185
  <p class="body-3">combo<span>(1)</span></p>
194
186
  <z-icon class="big" name="caret-down" />
195
187
  </div>
196
188
  <div class="open-combo-data">
197
- <z-input aria-autocomplete="list" aria-controls="combobox_list" aria-expanded="true" htmlid="combobox_search" label="cerca" placeholder="placeholder" role="combobox" size="big" type="text" value="primo"></z-input>
198
- <div aria-multiselectable="" role="listbox" id="combobox_list" aria-owns="combo-checkbox-combobox-item_1 combo-checkbox-combobox-item_2">
199
- <div class="search">
200
- <ul role="none">
201
- <z-list-element dividertype="none" id="item_1" size="large">
202
- <z-input role="option" aria-selected="false" disabled="0" class="combo-item-checkbox-input-combobox" type="checkbox" size="big" htmlid="combo-checkbox-combobox-item_1" innertabindex="0" label="<strong>primo</strong> elemento"></z-input>
203
- </z-list-element>
204
- </ul>
205
- <div>
206
- <a role="button" tabindex="0">CHIUDI</a>
207
- </div>
189
+ <z-input size="big" htmlid="combo_search" label="cerca" placeholder="placeholder" type="text" value="primo"></z-input>
190
+ <div class="search" tabindex="-1">
191
+ <ul>
192
+ <z-myz-list-item class="big" id="item_1" listitemid="item_1" action="combo-li-combo">
193
+ <z-input disabled="0" type="checkbox" size="big" htmlid="combo-checkbox-combo-item_1" label="<b>primo</b> elemento"></z-input>
194
+ </z-myz-list-item>
195
+ </ul>
196
+ <div>
197
+ <a role="button" tabindex="0">CHIUDI</a>
208
198
  </div>
209
199
  </div>
210
200
  </div>
@@ -216,31 +206,29 @@ describe("Suite test ZCombobox", () => {
216
206
  it("Test render ZCombobox aperta con ricerca attiva senza testo di chiusura della ricerca testuale", async () => {
217
207
  const page = await newSpecPage({
218
208
  components: [ZCombobox],
219
- html: `<z-combobox inputid="combobox" label="combo" hassearch=true searchlabel="cerca" searchplaceholder="placeholder" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'></z-combobox>`,
209
+ html: `<z-combobox inputid="combo" label="combo" hassearch=true searchlabel="cerca" searchplaceholder="placeholder" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'></z-combobox>`,
220
210
  });
221
211
  page.rootInstance.isopen = true;
222
212
  page.rootInstance.searchValue = "primo";
223
213
  await page.waitForChanges();
224
214
  expect(page.root).toEqualHtml(`
225
- <z-combobox inputid="combobox" label="combo" hassearch=true searchlabel="cerca" searchplaceholder="placeholder" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'>
215
+ <z-combobox inputid="combo" label="combo" hassearch=true searchlabel="cerca" searchplaceholder="placeholder" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'>
226
216
  <mock:shadow-root>
227
- <div class="open" data-action="combo-combobox" id="combobox">
228
- <div aria-expanded="true" class="header" role="button" tabindex="0">
217
+ <div class="open" data-action="combo-combo" id="combo">
218
+ <div class="header" role="button" tabindex="0">
229
219
  <p class="body-3">combo<span>(1)</span></p>
230
220
  <z-icon class="big" name="caret-down" />
231
221
  </div>
232
222
  <div class="open-combo-data">
233
- <z-input aria-autocomplete="list" aria-controls="combobox_list" aria-expanded="true" htmlid="combobox_search" label="cerca" placeholder="placeholder" role="combobox" size="big" type="text" value="primo"></z-input>
234
- <div aria-multiselectable="" role="listbox" id="combobox_list" aria-owns="combo-checkbox-combobox-item_1 combo-checkbox-combobox-item_2">
235
- <div class="search">
236
- <ul role="none">
237
- <z-list-element dividertype="none" id="item_1" size="large">
238
- <z-input role="option" aria-selected="false" disabled="0" class="combo-item-checkbox-input-combobox" innertabindex="0" type="checkbox" size="big" htmlid="combo-checkbox-combobox-item_1" label="<strong>primo</strong> elemento"></z-input>
239
- </z-list-element>
240
- </ul>
241
- <div>
242
- <a role="button" tabindex="0">Chiudi</a>
243
- </div>
223
+ <z-input size="big" htmlid="combo_search" label="cerca" placeholder="placeholder" type="text" value="primo"></z-input>
224
+ <div class="search" tabindex="-1">
225
+ <ul>
226
+ <z-myz-list-item class="big" id="item_1" listitemid="item_1" action="combo-li-combo">
227
+ <z-input disabled="0" type="checkbox" size="big" htmlid="combo-checkbox-combo-item_1" label="<b>primo</b> elemento"></z-input>
228
+ </z-myz-list-item>
229
+ </ul>
230
+ <div>
231
+ <a role="button" tabindex="0">Chiudi</a>
244
232
  </div>
245
233
  </div>
246
234
  </div>
@@ -252,29 +240,27 @@ describe("Suite test ZCombobox", () => {
252
240
  it("Test render ZCombobox aperta con ricerca attiva senza risultati", async () => {
253
241
  const page = await newSpecPage({
254
242
  components: [ZCombobox],
255
- html: `<z-combobox inputid="combobox" label="combo" hassearch=true searchlabel="cerca" searchplaceholder="placeholder" closesearchtext="CHIUDI" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]' noresultslabel='non ci sono risultati'></z-combobox>`,
243
+ html: `<z-combobox inputid="combo" label="combo" hassearch=true searchlabel="cerca" searchplaceholder="placeholder" closesearchtext="CHIUDI" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]' noresultslabel='non ci sono risultati'></z-combobox>`,
256
244
  });
257
245
  page.rootInstance.isopen = true;
258
246
  page.rootInstance.searchValue = "prova";
259
247
  await page.waitForChanges();
260
248
  expect(page.root).toEqualHtml(`
261
- <z-combobox inputid="combobox" label="combo" hassearch=true searchlabel="cerca" searchplaceholder="placeholder" closesearchtext="CHIUDI" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]' noresultslabel='non ci sono risultati'>
249
+ <z-combobox inputid="combo" label="combo" hassearch=true searchlabel="cerca" searchplaceholder="placeholder" closesearchtext="CHIUDI" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]' noresultslabel='non ci sono risultati'>
262
250
  <mock:shadow-root>
263
- <div class="open" data-action="combo-combobox" id="combobox">
264
- <div aria-expanded="true" class="header" role="button" tabindex="0">
251
+ <div class="open" data-action="combo-combo" id="combo">
252
+ <div class="header" role="button" tabindex="0">
265
253
  <p class="body-3">combo<span>(1)</span></p>
266
254
  <z-icon class="big" name="caret-down" />
267
255
  </div>
268
256
  <div class="open-combo-data">
269
- <z-input aria-autocomplete="list" aria-controls="combobox_list" aria-expanded="true" htmlid="combobox_search" label="cerca" placeholder="placeholder" role="combobox" size="big" type="text" value="prova"></z-input>
270
- <div aria-multiselectable="" role="listbox" id="combobox_list" aria-owns="combo-checkbox-combobox-item_1 combo-checkbox-combobox-item_2">
271
- <div class="search">
272
- <ul role="none">
273
- <z-myz-list-item class="big" id='no-results' text='non ci sono risultati' listitemid='no-results' icon='multiply-circle'></z-myz-list-item>
274
- </ul>
275
- <div>
276
- <a role="button" tabindex="0">CHIUDI</a>
277
- </div>
257
+ <z-input size="big" htmlid="combo_search" label="cerca" placeholder="placeholder" type="text" value="prova"></z-input>
258
+ <div class="search" tabindex="-1">
259
+ <ul>
260
+ <z-myz-list-item class="big" id='no-results' text='non ci sono risultati' listitemid='no-results' icon='multiply-circle'></z-myz-list-item>
261
+ </ul>
262
+ <div>
263
+ <a role="button" tabindex="0">CHIUDI</a>
278
264
  </div>
279
265
  </div>
280
266
  </div>
@@ -286,35 +272,32 @@ describe("Suite test ZCombobox", () => {
286
272
  it("Test render ZCombobox aperta con check all", async () => {
287
273
  const page = await newSpecPage({
288
274
  components: [ZCombobox],
289
- html: `<z-combobox inputid="combobox" label="combo" hascheckall="true" checkalltext="CHECK" uncheckalltext="UNCHECK" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'></z-combobox>`,
275
+ html: `<z-combobox inputid="combo" label="combo" hascheckall="true" checkalltext="CHECK" uncheckalltext="UNCHECK" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'></z-combobox>`,
290
276
  });
291
277
  page.rootInstance.isopen = true;
292
278
  await page.waitForChanges();
293
279
  expect(page.root).toEqualHtml(`
294
- <z-combobox inputid="combobox" label="combo" hascheckall="true" checkalltext="CHECK" uncheckalltext="UNCHECK" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'>
280
+ <z-combobox inputid="combo" label="combo" hascheckall="true" checkalltext="CHECK" uncheckalltext="UNCHECK" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'>
295
281
  <mock:shadow-root>
296
- <div class="open" data-action="combo-combobox" id="combobox">
297
- <div aria-expanded="true" class="header" role="button" tabindex="0">
282
+ <div class="open" data-action="combo-combo" id="combo">
283
+ <div class="header" role="button" tabindex="0">
298
284
  <p class="body-3">combo<span>(1)</span></p>
299
285
  <z-icon class="big" name="caret-down" />
300
286
  </div>
301
287
  <div class="open-combo-data">
302
- <span role="combobox" aria-controls="combobox_list" aria-expanded="true"></span>
303
- <div aria-multiselectable="" role="listbox" id="combobox_list" aria-owns="combo-checkbox-combobox-check-all combo-checkbox-combobox-item_1 combo-checkbox-combobox-item_2">
304
- <div class="check-all-wrapper">
305
- <z-input type="checkbox" aria-selected="false" role="option" size="big" htmlid="combo-checkbox-combobox-check-all" class="combo-item-checkbox-input-combobox" label="CHECK" disabled="0" />
306
- </div>
307
- <div>
308
- <ul role="none">
309
- <z-list-element dividertype="element" id="item_1" size="large">
310
- <z-input role="option" aria-selected="false" disabled="0" class="combo-item-checkbox-input-combobox" type="checkbox" size="big" htmlid="combo-checkbox-combobox-item_1" innertabindex="-1" label="primo elemento"></z-input>
311
- </z-list-element>
312
- <z-list-element dividertype="none" id="item_2" size="large">
313
- <z-input role="option" aria-selected="true" type="checkbox" class="combo-item-checkbox-input-combobox" size="big" htmlid="combo-checkbox-combobox-item_2" innertabindex="-1" label="secondo elemento" checked></z-input>
314
- </z-list-element>
315
- </ul>
316
- </div>
288
+ <div class="check-all-wrapper">
289
+ <z-input type="checkbox" size="big" htmlid="combo-checkbox-combo-check-all" label="CHECK" disabled="0" />
317
290
  </div>
291
+ <div tabindex="-1">
292
+ <ul>
293
+ <z-myz-list-item class="big" id="item_1" listitemid="item_1" action="combo-li-combo" underlined="">
294
+ <z-input disabled="0" type="checkbox" size="big" htmlid="combo-checkbox-combo-item_1" label="primo elemento"></z-input>
295
+ </z-myz-list-item>
296
+ <z-myz-list-item class="big" id="item_2" listitemid="item_2" action="combo-li-combo">
297
+ <z-input type="checkbox" size="big" htmlid="combo-checkbox-combo-item_2" label="secondo elemento" checked></z-input>
298
+ </z-myz-list-item>
299
+ </ul>
300
+ </div
318
301
  </div>
319
302
  </div>
320
303
  </mock:shadow-root>
@@ -324,35 +307,32 @@ describe("Suite test ZCombobox", () => {
324
307
  it("Test render ZCombobox aperta con uncheck all", async () => {
325
308
  const page = await newSpecPage({
326
309
  components: [ZCombobox],
327
- html: `<z-combobox inputid="combobox" label="combo" hascheckall="true" checkalltext="CHECK" uncheckalltext="UNCHECK" items='[{"id":"item_1","name":"primo elemento","checked":true},{"id":"item_2","name":"secondo elemento","checked":true}]'></z-combobox>`,
310
+ html: `<z-combobox inputid="combo" label="combo" hascheckall="true" checkalltext="CHECK" uncheckalltext="UNCHECK" items='[{"id":"item_1","name":"primo elemento","checked":true},{"id":"item_2","name":"secondo elemento","checked":true}]'></z-combobox>`,
328
311
  });
329
312
  page.rootInstance.isopen = true;
330
313
  await page.waitForChanges();
331
314
  expect(page.root).toEqualHtml(`
332
- <z-combobox inputid="combobox" label="combo" hascheckall="true" checkalltext="CHECK" uncheckalltext="UNCHECK" items='[{"id":"item_1","name":"primo elemento","checked":true},{"id":"item_2","name":"secondo elemento","checked":true}]'>
315
+ <z-combobox inputid="combo" label="combo" hascheckall="true" checkalltext="CHECK" uncheckalltext="UNCHECK" items='[{"id":"item_1","name":"primo elemento","checked":true},{"id":"item_2","name":"secondo elemento","checked":true}]'>
333
316
  <mock:shadow-root>
334
- <div class="open" data-action="combo-combobox" id="combobox">
335
- <div aria-expanded="true" class="header" role="button" tabindex="0">
317
+ <div class="open" data-action="combo-combo" id="combo">
318
+ <div class="header" role="button" tabindex="0">
336
319
  <p class="body-3">combo<span>(2)</span></p>
337
320
  <z-icon class="big" name="caret-down" />
338
321
  </div>
339
322
  <div class="open-combo-data">
340
- <span role="combobox" aria-controls="combobox_list" aria-expanded="true"></span>
341
- <div aria-multiselectable="" role="listbox" id="combobox_list" aria-owns="combo-checkbox-combobox-check-all combo-checkbox-combobox-item_1 combo-checkbox-combobox-item_2">
342
- <div class="check-all-wrapper">
343
- <z-input type="checkbox" aria-selected="true" role="option" size="big" htmlid="combo-checkbox-combobox-check-all" class="combo-item-checkbox-input-combobox" label="UNCHECK" checked disabled="0" />
344
- </div>
345
- <div>
346
- <ul role="none">
347
- <z-list-element dividertype="element" id="item_1" size="large">
348
- <z-input type="checkbox" role="option" aria-selected="true" class="combo-item-checkbox-input-combobox" size="big" htmlid="combo-checkbox-combobox-item_1" innertabindex="-1" label="primo elemento" checked></z-input>
349
- </z-list-element>
350
- <z-list-element dividertype="none" id="item_2" size="large">
351
- <z-input type="checkbox" role="option" aria-selected="true" class="combo-item-checkbox-input-combobox" size="big" htmlid="combo-checkbox-combobox-item_2" innertabindex="-1" label="secondo elemento" checked></z-input>
352
- </z-list-element>
353
- </ul>
354
- </div>
323
+ <div class="check-all-wrapper">
324
+ <z-input type="checkbox" size="big" htmlid="combo-checkbox-combo-check-all" label="UNCHECK" checked disabled="0" />
355
325
  </div>
326
+ <div tabindex="-1">
327
+ <ul>
328
+ <z-myz-list-item class="big" id="item_1" listitemid="item_1" action="combo-li-combo" underlined="">
329
+ <z-input type="checkbox" size="big" htmlid="combo-checkbox-combo-item_1" label="primo elemento" checked></z-input>
330
+ </z-myz-list-item>
331
+ <z-myz-list-item class="big" id="item_2" listitemid="item_2" action="combo-li-combo">
332
+ <z-input type="checkbox" size="big" htmlid="combo-checkbox-combo-item_2" label="secondo elemento" checked></z-input>
333
+ </z-myz-list-item>
334
+ </ul>
335
+ </div
356
336
  </div>
357
337
  </div>
358
338
  </mock:shadow-root>
@@ -362,32 +342,29 @@ describe("Suite test ZCombobox", () => {
362
342
  it("Test render ZCombobox aperta con max checkable items", async () => {
363
343
  const page = await newSpecPage({
364
344
  components: [ZCombobox],
365
- html: `<z-combobox inputid="combobox" label="combo" maxcheckableitems="1" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'></z-combobox>`,
345
+ html: `<z-combobox inputid="combo" label="combo" maxcheckableitems="1" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'></z-combobox>`,
366
346
  });
367
347
  page.rootInstance.isopen = true;
368
348
  await page.waitForChanges();
369
349
  expect(page.root).toEqualHtml(`
370
- <z-combobox inputid="combobox" label="combo" maxcheckableitems="1" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'>
350
+ <z-combobox inputid="combo" label="combo" maxcheckableitems="1" items='[{"id":"item_1","name":"primo elemento","checked":false},{"id":"item_2","name":"secondo elemento","checked":true}]'>
371
351
  <mock:shadow-root>
372
- <div class="open" data-action="combo-combobox" id="combobox">
373
- <div aria-expanded="true" class="header" role="button" tabindex="0">
352
+ <div class="open" data-action="combo-combo" id="combo">
353
+ <div class="header" role="button" tabindex="0">
374
354
  <p class="body-3">combo<span>(1)</span></p>
375
355
  <z-icon class="big" name="caret-down" />
376
356
  </div>
377
357
  <div class="open-combo-data">
378
- <span role="combobox" aria-controls="combobox_list" aria-expanded="true"></span>
379
- <div aria-multiselectable="" role="listbox" id="combobox_list" aria-owns="combo-checkbox-combobox-item_1 combo-checkbox-combobox-item_2">
380
- <div>
381
- <ul role="none">
382
- <z-list-element dividertype="element" id="item_1" size="large">
383
- <z-input role="option" aria-selected="false" disabled="" class="combo-item-checkbox-input-combobox" type="checkbox" size="big" htmlid="combo-checkbox-combobox-item_1" innertabindex="0" label="primo elemento"></z-input>
384
- </z-list-element>
385
- <z-list-element dividertype="none" id="item_2" size="large">
386
- <z-input type="checkbox" role="option" aria-selected="true" class="combo-item-checkbox-input-combobox" size="big" htmlid="combo-checkbox-combobox-item_2" innertabindex="-1" label="secondo elemento" checked></z-input>
387
- </z-list-element>
388
- </ul>
389
- </div>
390
- </div>
358
+ <div tabindex="-1">
359
+ <ul>
360
+ <z-myz-list-item class="big" id="item_1" listitemid="item_1" action="combo-li-combo" underlined="">
361
+ <z-input disabled="" type="checkbox" size="big" htmlid="combo-checkbox-combo-item_1" label="primo elemento"></z-input>
362
+ </z-myz-list-item>
363
+ <z-myz-list-item class="big" id="item_2" listitemid="item_2" action="combo-li-combo">
364
+ <z-input type="checkbox" size="big" htmlid="combo-checkbox-combo-item_2" label="secondo elemento" checked></z-input>
365
+ </z-myz-list-item>
366
+ </ul>
367
+ </div
391
368
  </div>
392
369
  </div>
393
370
  </mock:shadow-root>
@@ -397,35 +374,32 @@ describe("Suite test ZCombobox", () => {
397
374
  it("Test render ZCombobox aperta con maxcheckableitems + check all", async () => {
398
375
  const page = await newSpecPage({
399
376
  components: [ZCombobox],
400
- html: `<z-combobox inputid="combobox" label="combo" maxcheckableitems="3" hascheckall="true" checkalltext="CHECK" uncheckalltext="UNCHECK" items='[{"id":"item_1","name":"primo elemento","checked":true},{"id":"item_2","name":"secondo elemento","checked":false}]'></z-combobox>`,
377
+ html: `<z-combobox inputid="combo" label="combo" maxcheckableitems="3" hascheckall="true" checkalltext="CHECK" uncheckalltext="UNCHECK" items='[{"id":"item_1","name":"primo elemento","checked":true},{"id":"item_2","name":"secondo elemento","checked":false}]'></z-combobox>`,
401
378
  });
402
379
  page.rootInstance.isopen = true;
403
380
  await page.waitForChanges();
404
381
  expect(page.root).toEqualHtml(`
405
- <z-combobox inputid="combobox" label="combo" maxcheckableitems="3" hascheckall="true" checkalltext="CHECK" uncheckalltext="UNCHECK" items='[{"id":"item_1","name":"primo elemento","checked":true},{"id":"item_2","name":"secondo elemento","checked":false}]'>
382
+ <z-combobox inputid="combo" label="combo" maxcheckableitems="3" hascheckall="true" checkalltext="CHECK" uncheckalltext="UNCHECK" items='[{"id":"item_1","name":"primo elemento","checked":true},{"id":"item_2","name":"secondo elemento","checked":false}]'>
406
383
  <mock:shadow-root>
407
- <div class="open" data-action="combo-combobox" id="combobox">
408
- <div aria-expanded="true" class="header" role="button" tabindex="0">
384
+ <div class="open" data-action="combo-combo" id="combo">
385
+ <div class="header" role="button" tabindex="0">
409
386
  <p class="body-3">combo<span>(1)</span></p>
410
387
  <z-icon class="big" name="caret-down" />
411
388
  </div>
412
389
  <div class="open-combo-data">
413
- <span role="combobox" aria-controls="combobox_list" aria-expanded="true"></span>
414
- <div aria-multiselectable="" role="listbox" id="combobox_list" aria-owns="combo-checkbox-combobox-check-all combo-checkbox-combobox-item_1 combo-checkbox-combobox-item_2">
415
- <div class="check-all-wrapper">
416
- <z-input aria-selected="false" type="checkbox" role="option" size="big" htmlid="combo-checkbox-combobox-check-all" class="combo-item-checkbox-input-combobox" label="CHECK" />
417
- </div>
418
- <div>
419
- <ul role="none">
420
- <z-list-element dividertype="element" id="item_1" size="large">
421
- <z-input type="checkbox" role="option" aria-selected="true" size="big" class="combo-item-checkbox-input-combobox" htmlid="combo-checkbox-combobox-item_1"innertabindex="-1" label="primo elemento" checked></z-input>
422
- </z-list-element>
423
- <z-list-element dividertype="none" id="item_2" size="large">
424
- <z-input type="checkbox" role="option" aria-selected="false" size="big" class="combo-item-checkbox-input-combobox" htmlid="combo-checkbox-combobox-item_2" innertabindex="-1" label="secondo elemento"></z-input>
425
- </z-list-element>
426
- </ul>
427
- </div>
390
+ <div class="check-all-wrapper">
391
+ <z-input type="checkbox" size="big" htmlid="combo-checkbox-combo-check-all" label="CHECK" />
428
392
  </div>
393
+ <div tabindex="-1">
394
+ <ul>
395
+ <z-myz-list-item id="item_1" class="big" listitemid="item_1" action="combo-li-combo" underlined="">
396
+ <z-input type="checkbox" size="big" htmlid="combo-checkbox-combo-item_1" label="primo elemento" checked></z-input>
397
+ </z-myz-list-item>
398
+ <z-myz-list-item id="item_2" class="big" listitemid="item_2" action="combo-li-combo">
399
+ <z-input type="checkbox" size="big" htmlid="combo-checkbox-combo-item_2" label="secondo elemento"></z-input>
400
+ </z-myz-list-item>
401
+ </ul>
402
+ </div
429
403
  </div>
430
404
  </div>
431
405
  </mock:shadow-root>
@@ -435,36 +409,32 @@ describe("Suite test ZCombobox", () => {
435
409
  it("Test render ZCombobox aperta con maxcheckableitems + check all (disabled)", async () => {
436
410
  const page = await newSpecPage({
437
411
  components: [ZCombobox],
438
- html: `<z-combobox inputid="combobox" label="combo" maxcheckableitems="1" hascheckall="true" checkalltext="CHECK" uncheckalltext="UNCHECK" items='[{"id":"item_1","name":"primo elemento","checked":true},{"id":"item_2","name":"secondo elemento","checked":false}]'></z-combobox>`,
412
+ html: `<z-combobox inputid="combo" label="combo" maxcheckableitems="1" hascheckall="true" checkalltext="CHECK" uncheckalltext="UNCHECK" items='[{"id":"item_1","name":"primo elemento","checked":true},{"id":"item_2","name":"secondo elemento","checked":false}]'></z-combobox>`,
439
413
  });
440
414
  page.rootInstance.isopen = true;
441
415
  await page.waitForChanges();
442
416
  expect(page.root).toEqualHtml(`
443
- <z-combobox inputid="combobox" label="combo" maxcheckableitems="1" hascheckall="true" checkalltext="CHECK" uncheckalltext="UNCHECK" items='[{"id":"item_1","name":"primo elemento","checked":true},{"id":"item_2","name":"secondo elemento","checked":false}]'>
417
+ <z-combobox inputid="combo" label="combo" maxcheckableitems="1" hascheckall="true" checkalltext="CHECK" uncheckalltext="UNCHECK" items='[{"id":"item_1","name":"primo elemento","checked":true},{"id":"item_2","name":"secondo elemento","checked":false}]'>
444
418
  <mock:shadow-root>
445
- <div class="open" data-action="combo-combobox" id="combobox">
446
- <div aria-expanded="true" class="header" role="button" tabindex="0">
419
+ <div class="open" data-action="combo-combo" id="combo">
420
+ <div class="header" role="button" tabindex="0">
447
421
  <p class="body-3">combo<span>(1)</span></p>
448
422
  <z-icon class="big" name="caret-down" />
449
423
  </div>
450
-
451
- <div class="open-combo-data">
452
- <span role="combobox" aria-controls="combobox_list" aria-expanded="true"></span>
453
- <div aria-multiselectable="" role="listbox" id="combobox_list" aria-owns="combo-checkbox-combobox-check-all combo-checkbox-combobox-item_1 combo-checkbox-combobox-item_2">
454
- <div class="check-all-wrapper">
455
- <z-input type="checkbox" aria-selected="false" role="option" size="big" disabled htmlid="combo-checkbox-combobox-check-all" class="combo-item-checkbox-input-combobox" label="CHECK" />
456
- </div>
457
- <div>
458
- <ul role="none">
459
- <z-list-element dividertype="element" id="item_1" size="large">
460
- <z-input type="checkbox" role="option" aria-selected="true" class="combo-item-checkbox-input-combobox" size="big" htmlid="combo-checkbox-combobox-item_1" innertabindex="0" label="primo elemento" checked></z-input>
461
- </z-list-element>
462
- <z-list-element dividertype="none" id="item_2" size="large">
463
- <z-input type="checkbox" role="option" aria-selected="false" class="combo-item-checkbox-input-combobox" size="big" htmlid="combo-checkbox-combobox-item_2" innertabindex="-1" label="secondo elemento" disabled></z-input>
464
- </z-list-element>
465
- </ul>
466
- </div
424
+ <div class="open-combo-data">
425
+ <div class="check-all-wrapper">
426
+ <z-input type="checkbox" size="big" disabled htmlid="combo-checkbox-combo-check-all" label="CHECK" />
467
427
  </div>
428
+ <div tabindex="-1">
429
+ <ul>
430
+ <z-myz-list-item id="item_1" class="big" listitemid="item_1" action="combo-li-combo" underlined="">
431
+ <z-input type="checkbox" size="big" htmlid="combo-checkbox-combo-item_1" label="primo elemento" checked></z-input>
432
+ </z-myz-list-item>
433
+ <z-myz-list-item id="item_2" class="big" listitemid="item_2" action="combo-li-combo">
434
+ <z-input type="checkbox" size="big" htmlid="combo-checkbox-combo-item_2" label="secondo elemento" disabled></z-input>
435
+ </z-myz-list-item>
436
+ </ul>
437
+ </div
468
438
  </div>
469
439
  </div>
470
440
  </mock:shadow-root>