@aurodesignsystem/auro-accordion 4.3.1 → 4.4.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 (21) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/README.md +2 -3
  3. package/coverage/lcov-report/auro-accordion-button.js.html +184 -0
  4. package/coverage/lcov-report/auro-accordion-group.js.html +75 -75
  5. package/coverage/lcov-report/auro-accordion.js.html +106 -10
  6. package/coverage/lcov-report/color-css.js.html +1 -1
  7. package/coverage/lcov-report/iconVersion.js.html +1 -1
  8. package/coverage/lcov-report/index.html +44 -14
  9. package/coverage/lcov-report/style-button-css.js.html +91 -0
  10. package/coverage/lcov-report/style-css.js.html +1 -1
  11. package/coverage/lcov-report/tokens-css.js.html +1 -1
  12. package/coverage/lcov.info +296 -200
  13. package/demo/api.min.js +878 -851
  14. package/demo/index.min.js +878 -849
  15. package/dist/auro-accordion.d.ts +15 -0
  16. package/dist/auro-accordion.d.ts.map +1 -1
  17. package/dist/auro-accordion__bundled.js +878 -851
  18. package/index.js +0 -4
  19. package/package.json +1 -1
  20. package/src/auro-accordion.js +35 -3
  21. package/test/auro-accordion.test.js +2 -0
package/CHANGELOG.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # Semantic Release Automated Changelog
2
2
 
3
+ # [4.4.0](https://github.com/AlaskaAirlines/auro-accordion/compare/v4.3.1...v4.4.0) (2025-01-28)
4
+
5
+
6
+ ### Features
7
+
8
+ * simplify registration logic [#156](https://github.com/AlaskaAirlines/auro-accordion/issues/156) ([83c4425](https://github.com/AlaskaAirlines/auro-accordion/commit/83c4425e93817afcce823cb74ad5c4f430deccb9))
9
+
3
10
  ## [4.3.1](https://github.com/AlaskaAirlines/auro-accordion/compare/v4.3.0...v4.3.1) (2024-12-21)
4
11
 
5
12
 
package/README.md CHANGED
@@ -39,8 +39,7 @@ Or, by CDN.
39
39
  ```html
40
40
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@alaskaairux/design-tokens@3.11.0/dist/tokens/CSSCustomProperties.css" />
41
41
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@alaskaairux/webcorestylesheets@3.7.3/dist/bundled/essentials.css" />
42
- <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-accordion@1.6.6/dist/auro-accordion__bundled.js" type="module"></script>
43
- <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-accordion@1.6.6/dist/auro-accordion-group__bundled.js" type="module"></script>
42
+ <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-accordion@1.6.6/dist/auro-accordion__bundled.js" type="module"></script>
44
43
  ```
45
44
  <!-- AURO-GENERATED-CONTENT:END -->
46
45
 
@@ -126,7 +125,7 @@ In cases where the project is not able to process JS assets, there are pre-proce
126
125
  ```html
127
126
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@4.9.2/dist/tokens/CSSCustomProperties.css" />
128
127
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@5.1.2/dist/bundled/essentials.css" />
129
- <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-accordion@4.3.1/dist/auro-accordion__bundled.js" type="module"></script>
128
+ <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-accordion@4.4.0/dist/auro-accordion__bundled.js" type="module"></script>
130
129
  ```
131
130
 
132
131
  <!-- AURO-GENERATED-CONTENT:END -->
package/coverage/lcov-report/auro-accordion-button.js.html ADDED
@@ -0,0 +1,184 @@
1
+
2
+ <!doctype html>
3
+ <html lang="en">
4
+
5
+ <head>
6
+ <title>Code coverage report for auro-accordion-button.js</title>
7
+ <meta charset="utf-8" />
8
+ <link rel="stylesheet" href="prettify.css" />
9
+ <link rel="stylesheet" href="base.css" />
10
+ <link rel="shortcut icon" type="image/x-icon" href="favicon.png" />
11
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
12
+ <style type='text/css'>
13
+ .coverage-summary .sorter {
14
+ background-image: url(sort-arrow-sprite.png);
15
+ }
16
+ </style>
17
+ </head>
18
+
19
+ <body>
20
+ <div class='wrapper'>
21
+ <div class='pad1'>
22
+ <h1><a href="index.html">All files</a> auro-accordion-button.js</h1>
23
+ <div class='clearfix'>
24
+
25
+ <div class='fl pad1y space-right2'>
26
+ <span class="strong">93.93% </span>
27
+ <span class="quiet">Statements</span>
28
+ <span class='fraction'>31/33</span>
29
+ </div>
30
+
31
+
32
+ <div class='fl pad1y space-right2'>
33
+ <span class="strong">100% </span>
34
+ <span class="quiet">Branches</span>
35
+ <span class='fraction'>2/2</span>
36
+ </div>
37
+
38
+
39
+ <div class='fl pad1y space-right2'>
40
+ <span class="strong">50% </span>
41
+ <span class="quiet">Functions</span>
42
+ <span class='fraction'>1/2</span>
43
+ </div>
44
+
45
+
46
+ <div class='fl pad1y space-right2'>
47
+ <span class="strong">93.93% </span>
48
+ <span class="quiet">Lines</span>
49
+ <span class='fraction'>31/33</span>
50
+ </div>
51
+
52
+
53
+ </div>
54
+ <p class="quiet">
55
+ Press <em>n</em> or <em>j</em> to go to the next uncovered block, <em>b</em>, <em>p</em> or <em>k</em> for the previous block.
56
+ </p>
57
+ <template id="filterTemplate">
58
+ <div class="quiet">
59
+ Filter:
60
+ <input type="search" id="fileSearch">
61
+ </div>
62
+ </template>
63
+ </div>
64
+ <div class='status-line high'></div>
65
+ <pre><table class="coverage">
66
+ <tr><td class="line-count quiet"><a name='L1'></a><a href='#L1'>1</a>
67
+ <a name='L2'></a><a href='#L2'>2</a>
68
+ <a name='L3'></a><a href='#L3'>3</a>
69
+ <a name='L4'></a><a href='#L4'>4</a>
70
+ <a name='L5'></a><a href='#L5'>5</a>
71
+ <a name='L6'></a><a href='#L6'>6</a>
72
+ <a name='L7'></a><a href='#L7'>7</a>
73
+ <a name='L8'></a><a href='#L8'>8</a>
74
+ <a name='L9'></a><a href='#L9'>9</a>
75
+ <a name='L10'></a><a href='#L10'>10</a>
76
+ <a name='L11'></a><a href='#L11'>11</a>
77
+ <a name='L12'></a><a href='#L12'>12</a>
78
+ <a name='L13'></a><a href='#L13'>13</a>
79
+ <a name='L14'></a><a href='#L14'>14</a>
80
+ <a name='L15'></a><a href='#L15'>15</a>
81
+ <a name='L16'></a><a href='#L16'>16</a>
82
+ <a name='L17'></a><a href='#L17'>17</a>
83
+ <a name='L18'></a><a href='#L18'>18</a>
84
+ <a name='L19'></a><a href='#L19'>19</a>
85
+ <a name='L20'></a><a href='#L20'>20</a>
86
+ <a name='L21'></a><a href='#L21'>21</a>
87
+ <a name='L22'></a><a href='#L22'>22</a>
88
+ <a name='L23'></a><a href='#L23'>23</a>
89
+ <a name='L24'></a><a href='#L24'>24</a>
90
+ <a name='L25'></a><a href='#L25'>25</a>
91
+ <a name='L26'></a><a href='#L26'>26</a>
92
+ <a name='L27'></a><a href='#L27'>27</a>
93
+ <a name='L28'></a><a href='#L28'>28</a>
94
+ <a name='L29'></a><a href='#L29'>29</a>
95
+ <a name='L30'></a><a href='#L30'>30</a>
96
+ <a name='L31'></a><a href='#L31'>31</a>
97
+ <a name='L32'></a><a href='#L32'>32</a>
98
+ <a name='L33'></a><a href='#L33'>33</a>
99
+ <a name='L34'></a><a href='#L34'>34</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">2x</span>
100
+ <span class="cline-any cline-yes">2x</span>
101
+ <span class="cline-any cline-yes">2x</span>
102
+ <span class="cline-any cline-yes">2x</span>
103
+ <span class="cline-any cline-yes">2x</span>
104
+ <span class="cline-any cline-yes">2x</span>
105
+ <span class="cline-any cline-yes">2x</span>
106
+ <span class="cline-any cline-yes">2x</span>
107
+ <span class="cline-any cline-yes">2x</span>
108
+ <span class="cline-any cline-yes">2x</span>
109
+ <span class="cline-any cline-yes">2x</span>
110
+ <span class="cline-any cline-yes">2x</span>
111
+ <span class="cline-any cline-yes">2x</span>
112
+ <span class="cline-any cline-yes">2x</span>
113
+ <span class="cline-any cline-yes">2x</span>
114
+ <span class="cline-any cline-yes">12x</span>
115
+ <span class="cline-any cline-yes">12x</span>
116
+ <span class="cline-any cline-yes">12x</span>
117
+ <span class="cline-any cline-yes">12x</span>
118
+ <span class="cline-any cline-yes">12x</span>
119
+ <span class="cline-any cline-yes">2x</span>
120
+ <span class="cline-any cline-yes">2x</span>
121
+ <span class="cline-any cline-yes">2x</span>
122
+ <span class="cline-any cline-yes">2x</span>
123
+ <span class="cline-any cline-yes">2x</span>
124
+ <span class="cline-any cline-yes">2x</span>
125
+ <span class="cline-any cline-yes">2x</span>
126
+ <span class="cline-any cline-yes">2x</span>
127
+ <span class="cline-any cline-yes">2x</span>
128
+ <span class="cline-any cline-yes">2x</span>
129
+ <span class="cline-any cline-no">&nbsp;</span>
130
+ <span class="cline-any cline-no">&nbsp;</span>
131
+ <span class="cline-any cline-yes">2x</span>
132
+ <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">// Copyright (c) 2022 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
133
+ // See LICENSE in the project root for license information.
134
+ &nbsp;
135
+ // ---------------------------------------------------------------------
136
+ &nbsp;
137
+ import styleButtonCss from "./style-button-css.js";
138
+ import styleCssAuroButton from "@aurodesignsystem/auro-button/src/style-css.js";
139
+ &nbsp;
140
+ import { AuroButton } from "@aurodesignsystem/auro-button/src/auro-button.js";
141
+ &nbsp;
142
+ import * as RuntimeUtils from '@aurodesignsystem/auro-library/scripts/utils/runtimeUtils.mjs';
143
+ &nbsp;
144
+ // build the component class
145
+ export class AuroAccordionButton extends AuroButton {
146
+ static get styles() {
147
+ return [
148
+ styleCssAuroButton,
149
+ styleButtonCss
150
+ ];
151
+ }
152
+ &nbsp;
153
+ /**
154
+ * This will register this element with the browser.
155
+ * @param {string} [name="auro-accordion-button"] - The name of element that you want to register to.
156
+ *
157
+ * @example
158
+ * AuroAccordionButton.register("custom-accordion-button") // this will register this element to &lt;custom-accordion-button/&gt;
159
+ *
160
+ */
161
+ static <span class="fstat-no" title="function not covered" >register(name = "auro-accordion-button") {</span>
162
+ <span class="cstat-no" title="statement not covered" > RuntimeUtils.default.prototype.registerComponent(name, AuroAccordionButton);</span>
163
+ <span class="cstat-no" title="statement not covered" > }</span>
164
+ }
165
+ &nbsp;</pre></td></tr></table></pre>
166
+
167
+ <div class='push'></div><!-- for sticky footer -->
168
+ </div><!-- /wrapper -->
169
+ <div class='footer quiet pad2 space-top1 center small'>
170
+ Code coverage generated by
171
+ <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
172
+ at 2025-01-28T17:56:08.825Z
173
+ </div>
174
+ <script src="prettify.js"></script>
175
+ <script>
176
+ window.onload = function () {
177
+ prettyPrint();
178
+ };
179
+ </script>
180
+ <script src="sorter.js"></script>
181
+ <script src="block-navigation.js"></script>
182
+ </body>
183
+ </html>
184
+
package/coverage/lcov-report/auro-accordion-group.js.html CHANGED
@@ -192,29 +192,29 @@
192
192
  <a name='L127'></a><a href='#L127'>127</a>
193
193
  <a name='L128'></a><a href='#L128'>128</a>
194
194
  <a name='L129'></a><a href='#L129'>129</a>
195
- <a name='L130'></a><a href='#L130'>130</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">1x</span>
196
- <span class="cline-any cline-yes">1x</span>
197
- <span class="cline-any cline-yes">1x</span>
198
- <span class="cline-any cline-yes">1x</span>
199
- <span class="cline-any cline-yes">1x</span>
200
- <span class="cline-any cline-yes">1x</span>
201
- <span class="cline-any cline-yes">1x</span>
202
- <span class="cline-any cline-yes">1x</span>
203
- <span class="cline-any cline-yes">1x</span>
204
- <span class="cline-any cline-yes">1x</span>
205
- <span class="cline-any cline-yes">1x</span>
206
- <span class="cline-any cline-yes">1x</span>
207
- <span class="cline-any cline-yes">1x</span>
208
- <span class="cline-any cline-yes">1x</span>
209
- <span class="cline-any cline-yes">1x</span>
210
- <span class="cline-any cline-yes">1x</span>
211
- <span class="cline-any cline-yes">1x</span>
212
- <span class="cline-any cline-yes">1x</span>
213
- <span class="cline-any cline-yes">1x</span>
214
- <span class="cline-any cline-yes">1x</span>
215
- <span class="cline-any cline-yes">1x</span>
216
- <span class="cline-any cline-yes">1x</span>
217
- <span class="cline-any cline-yes">1x</span>
195
+ <a name='L130'></a><a href='#L130'>130</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">2x</span>
196
+ <span class="cline-any cline-yes">2x</span>
197
+ <span class="cline-any cline-yes">2x</span>
198
+ <span class="cline-any cline-yes">2x</span>
199
+ <span class="cline-any cline-yes">2x</span>
200
+ <span class="cline-any cline-yes">2x</span>
201
+ <span class="cline-any cline-yes">2x</span>
202
+ <span class="cline-any cline-yes">2x</span>
203
+ <span class="cline-any cline-yes">2x</span>
204
+ <span class="cline-any cline-yes">2x</span>
205
+ <span class="cline-any cline-yes">2x</span>
206
+ <span class="cline-any cline-yes">2x</span>
207
+ <span class="cline-any cline-yes">2x</span>
208
+ <span class="cline-any cline-yes">2x</span>
209
+ <span class="cline-any cline-yes">2x</span>
210
+ <span class="cline-any cline-yes">2x</span>
211
+ <span class="cline-any cline-yes">2x</span>
212
+ <span class="cline-any cline-yes">2x</span>
213
+ <span class="cline-any cline-yes">2x</span>
214
+ <span class="cline-any cline-yes">2x</span>
215
+ <span class="cline-any cline-yes">2x</span>
216
+ <span class="cline-any cline-yes">2x</span>
217
+ <span class="cline-any cline-yes">2x</span>
218
218
  <span class="cline-any cline-yes">6x</span>
219
219
  <span class="cline-any cline-yes">6x</span>
220
220
  <span class="cline-any cline-yes">6x</span>
@@ -222,43 +222,43 @@
222
222
  <span class="cline-any cline-yes">6x</span>
223
223
  <span class="cline-any cline-yes">6x</span>
224
224
  <span class="cline-any cline-yes">6x</span>
225
- <span class="cline-any cline-yes">1x</span>
226
- <span class="cline-any cline-yes">1x</span>
227
- <span class="cline-any cline-yes">1x</span>
228
- <span class="cline-any cline-yes">1x</span>
229
- <span class="cline-any cline-yes">1x</span>
230
- <span class="cline-any cline-yes">1x</span>
231
- <span class="cline-any cline-yes">1x</span>
232
- <span class="cline-any cline-yes">1x</span>
233
- <span class="cline-any cline-yes">1x</span>
234
- <span class="cline-any cline-yes">1x</span>
235
- <span class="cline-any cline-yes">1x</span>
236
- <span class="cline-any cline-yes">1x</span>
237
- <span class="cline-any cline-yes">1x</span>
238
- <span class="cline-any cline-yes">1x</span>
239
- <span class="cline-any cline-yes">1x</span>
240
- <span class="cline-any cline-yes">1x</span>
241
- <span class="cline-any cline-yes">1x</span>
242
- <span class="cline-any cline-yes">1x</span>
243
- <span class="cline-any cline-yes">1x</span>
244
- <span class="cline-any cline-yes">1x</span>
245
- <span class="cline-any cline-yes">1x</span>
246
- <span class="cline-any cline-yes">1x</span>
247
- <span class="cline-any cline-yes">1x</span>
248
- <span class="cline-any cline-yes">1x</span>
249
- <span class="cline-any cline-yes">1x</span>
250
- <span class="cline-any cline-yes">1x</span>
251
- <span class="cline-any cline-yes">1x</span>
252
- <span class="cline-any cline-yes">1x</span>
253
- <span class="cline-any cline-yes">1x</span>
254
- <span class="cline-any cline-yes">1x</span>
255
- <span class="cline-any cline-yes">1x</span>
256
- <span class="cline-any cline-yes">1x</span>
225
+ <span class="cline-any cline-yes">2x</span>
226
+ <span class="cline-any cline-yes">2x</span>
227
+ <span class="cline-any cline-yes">2x</span>
228
+ <span class="cline-any cline-yes">2x</span>
229
+ <span class="cline-any cline-yes">2x</span>
230
+ <span class="cline-any cline-yes">2x</span>
231
+ <span class="cline-any cline-yes">2x</span>
232
+ <span class="cline-any cline-yes">2x</span>
233
+ <span class="cline-any cline-yes">2x</span>
234
+ <span class="cline-any cline-yes">2x</span>
235
+ <span class="cline-any cline-yes">2x</span>
236
+ <span class="cline-any cline-yes">2x</span>
237
+ <span class="cline-any cline-yes">2x</span>
238
+ <span class="cline-any cline-yes">2x</span>
239
+ <span class="cline-any cline-yes">2x</span>
240
+ <span class="cline-any cline-yes">2x</span>
241
+ <span class="cline-any cline-yes">2x</span>
242
+ <span class="cline-any cline-yes">2x</span>
243
+ <span class="cline-any cline-yes">2x</span>
244
+ <span class="cline-any cline-yes">2x</span>
245
+ <span class="cline-any cline-yes">2x</span>
246
+ <span class="cline-any cline-yes">2x</span>
247
+ <span class="cline-any cline-yes">2x</span>
248
+ <span class="cline-any cline-yes">2x</span>
249
+ <span class="cline-any cline-yes">2x</span>
250
+ <span class="cline-any cline-yes">2x</span>
251
+ <span class="cline-any cline-yes">2x</span>
252
+ <span class="cline-any cline-yes">2x</span>
253
+ <span class="cline-any cline-yes">3x</span>
254
+ <span class="cline-any cline-yes">3x</span>
255
+ <span class="cline-any cline-yes">2x</span>
256
+ <span class="cline-any cline-yes">2x</span>
257
257
  <span class="cline-any cline-yes">6x</span>
258
258
  <span class="cline-any cline-yes">6x</span>
259
259
  <span class="cline-any cline-yes">6x</span>
260
- <span class="cline-any cline-yes">1x</span>
261
- <span class="cline-any cline-yes">1x</span>
260
+ <span class="cline-any cline-yes">2x</span>
261
+ <span class="cline-any cline-yes">2x</span>
262
262
  <span class="cline-any cline-yes">6x</span>
263
263
  <span class="cline-any cline-yes">6x</span>
264
264
  <span class="cline-any cline-yes">6x</span>
@@ -280,13 +280,13 @@
280
280
  <span class="cline-any cline-yes">8x</span>
281
281
  <span class="cline-any cline-yes">6x</span>
282
282
  <span class="cline-any cline-yes">6x</span>
283
- <span class="cline-any cline-yes">1x</span>
284
- <span class="cline-any cline-yes">1x</span>
285
- <span class="cline-any cline-yes">1x</span>
286
- <span class="cline-any cline-yes">1x</span>
287
- <span class="cline-any cline-yes">1x</span>
288
- <span class="cline-any cline-yes">1x</span>
289
- <span class="cline-any cline-yes">1x</span>
283
+ <span class="cline-any cline-yes">2x</span>
284
+ <span class="cline-any cline-yes">2x</span>
285
+ <span class="cline-any cline-yes">2x</span>
286
+ <span class="cline-any cline-yes">2x</span>
287
+ <span class="cline-any cline-yes">2x</span>
288
+ <span class="cline-any cline-yes">2x</span>
289
+ <span class="cline-any cline-yes">2x</span>
290
290
  <span class="cline-any cline-yes">2x</span>
291
291
  <span class="cline-any cline-yes">1x</span>
292
292
  <span class="cline-any cline-yes">2x</span>
@@ -300,27 +300,27 @@
300
300
  <span class="cline-any cline-yes">1x</span>
301
301
  <span class="cline-any cline-yes">1x</span>
302
302
  <span class="cline-any cline-yes">2x</span>
303
- <span class="cline-any cline-yes">1x</span>
304
- <span class="cline-any cline-yes">1x</span>
305
- <span class="cline-any cline-yes">1x</span>
306
- <span class="cline-any cline-yes">1x</span>
307
- <span class="cline-any cline-yes">1x</span>
308
- <span class="cline-any cline-yes">1x</span>
303
+ <span class="cline-any cline-yes">2x</span>
304
+ <span class="cline-any cline-yes">2x</span>
305
+ <span class="cline-any cline-yes">2x</span>
306
+ <span class="cline-any cline-yes">2x</span>
307
+ <span class="cline-any cline-yes">2x</span>
308
+ <span class="cline-any cline-yes">2x</span>
309
309
  <span class="cline-any cline-yes">6x</span>
310
310
  <span class="cline-any cline-yes">6x</span>
311
311
  <span class="cline-any cline-yes">6x</span>
312
312
  <span class="cline-any cline-yes">6x</span>
313
313
  <span class="cline-any cline-yes">6x</span>
314
- <span class="cline-any cline-yes">1x</span>
315
- <span class="cline-any cline-yes">1x</span>
316
- <span class="cline-any cline-yes">1x</span>
314
+ <span class="cline-any cline-yes">2x</span>
315
+ <span class="cline-any cline-yes">2x</span>
316
+ <span class="cline-any cline-yes">2x</span>
317
317
  <span class="cline-any cline-yes">6x</span>
318
318
  <span class="cline-any cline-yes">6x</span>
319
319
  <span class="cline-any cline-yes">6x</span>
320
320
  <span class="cline-any cline-yes">6x</span>
321
321
  <span class="cline-any cline-yes">6x</span>
322
322
  <span class="cline-any cline-yes">6x</span>
323
- <span class="cline-any cline-yes">1x</span>
323
+ <span class="cline-any cline-yes">2x</span>
324
324
  <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">// Copyright (c) 2023 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
325
325
  // See LICENSE in the project root for license information.
326
326
  &nbsp;
@@ -457,7 +457,7 @@ export class AuroAccordionGroup extends LitElement {
457
457
  <div class='footer quiet pad2 space-top1 center small'>
458
458
  Code coverage generated by
459
459
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
460
- at 2024-12-21T00:10:49.305Z
460
+ at 2025-01-28T17:56:08.825Z
461
461
  </div>
462
462
  <script src="prettify.js"></script>
463
463
  <script>
package/coverage/lcov-report/auro-accordion.js.html CHANGED
@@ -25,28 +25,28 @@
25
25
  <div class='fl pad1y space-right2'>
26
26
  <span class="strong">100% </span>
27
27
  <span class="quiet">Statements</span>
28
- <span class='fraction'>193/193</span>
28
+ <span class='fraction'>225/225</span>
29
29
  </div>
30
30
 
31
31
 
32
32
  <div class='fl pad1y space-right2'>
33
- <span class="strong">90.9% </span>
33
+ <span class="strong">92.3% </span>
34
34
  <span class="quiet">Branches</span>
35
- <span class='fraction'>10/11</span>
35
+ <span class='fraction'>12/13</span>
36
36
  </div>
37
37
 
38
38
 
39
39
  <div class='fl pad1y space-right2'>
40
40
  <span class="strong">100% </span>
41
41
  <span class="quiet">Functions</span>
42
- <span class='fraction'>8/8</span>
42
+ <span class='fraction'>9/9</span>
43
43
  </div>
44
44
 
45
45
 
46
46
  <div class='fl pad1y space-right2'>
47
47
  <span class="strong">100% </span>
48
48
  <span class="quiet">Lines</span>
49
- <span class='fraction'>193/193</span>
49
+ <span class='fraction'>225/225</span>
50
50
  </div>
51
51
 
52
52
 
@@ -256,7 +256,39 @@
256
256
  <a name='L191'></a><a href='#L191'>191</a>
257
257
  <a name='L192'></a><a href='#L192'>192</a>
258
258
  <a name='L193'></a><a href='#L193'>193</a>
259
- <a name='L194'></a><a href='#L194'>194</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">2x</span>
259
+ <a name='L194'></a><a href='#L194'>194</a>
260
+ <a name='L195'></a><a href='#L195'>195</a>
261
+ <a name='L196'></a><a href='#L196'>196</a>
262
+ <a name='L197'></a><a href='#L197'>197</a>
263
+ <a name='L198'></a><a href='#L198'>198</a>
264
+ <a name='L199'></a><a href='#L199'>199</a>
265
+ <a name='L200'></a><a href='#L200'>200</a>
266
+ <a name='L201'></a><a href='#L201'>201</a>
267
+ <a name='L202'></a><a href='#L202'>202</a>
268
+ <a name='L203'></a><a href='#L203'>203</a>
269
+ <a name='L204'></a><a href='#L204'>204</a>
270
+ <a name='L205'></a><a href='#L205'>205</a>
271
+ <a name='L206'></a><a href='#L206'>206</a>
272
+ <a name='L207'></a><a href='#L207'>207</a>
273
+ <a name='L208'></a><a href='#L208'>208</a>
274
+ <a name='L209'></a><a href='#L209'>209</a>
275
+ <a name='L210'></a><a href='#L210'>210</a>
276
+ <a name='L211'></a><a href='#L211'>211</a>
277
+ <a name='L212'></a><a href='#L212'>212</a>
278
+ <a name='L213'></a><a href='#L213'>213</a>
279
+ <a name='L214'></a><a href='#L214'>214</a>
280
+ <a name='L215'></a><a href='#L215'>215</a>
281
+ <a name='L216'></a><a href='#L216'>216</a>
282
+ <a name='L217'></a><a href='#L217'>217</a>
283
+ <a name='L218'></a><a href='#L218'>218</a>
284
+ <a name='L219'></a><a href='#L219'>219</a>
285
+ <a name='L220'></a><a href='#L220'>220</a>
286
+ <a name='L221'></a><a href='#L221'>221</a>
287
+ <a name='L222'></a><a href='#L222'>222</a>
288
+ <a name='L223'></a><a href='#L223'>223</a>
289
+ <a name='L224'></a><a href='#L224'>224</a>
290
+ <a name='L225'></a><a href='#L225'>225</a>
291
+ <a name='L226'></a><a href='#L226'>226</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">2x</span>
260
292
  <span class="cline-any cline-yes">2x</span>
261
293
  <span class="cline-any cline-yes">2x</span>
262
294
  <span class="cline-any cline-yes">2x</span>
@@ -305,6 +337,19 @@
305
337
  <span class="cline-any cline-yes">2x</span>
306
338
  <span class="cline-any cline-yes">2x</span>
307
339
  <span class="cline-any cline-yes">2x</span>
340
+ <span class="cline-any cline-yes">2x</span>
341
+ <span class="cline-any cline-yes">2x</span>
342
+ <span class="cline-any cline-yes">2x</span>
343
+ <span class="cline-any cline-yes">10x</span>
344
+ <span class="cline-any cline-yes">10x</span>
345
+ <span class="cline-any cline-yes">10x</span>
346
+ <span class="cline-any cline-yes">10x</span>
347
+ <span class="cline-any cline-yes">10x</span>
348
+ <span class="cline-any cline-yes">10x</span>
349
+ <span class="cline-any cline-yes">10x</span>
350
+ <span class="cline-any cline-yes">10x</span>
351
+ <span class="cline-any cline-yes">10x</span>
352
+ <span class="cline-any cline-yes">10x</span>
308
353
  <span class="cline-any cline-yes">10x</span>
309
354
  <span class="cline-any cline-yes">10x</span>
310
355
  <span class="cline-any cline-yes">10x</span>
@@ -377,6 +422,8 @@
377
422
  <span class="cline-any cline-yes">2x</span>
378
423
  <span class="cline-any cline-yes">2x</span>
379
424
  <span class="cline-any cline-yes">2x</span>
425
+ <span class="cline-any cline-yes">2x</span>
426
+ <span class="cline-any cline-yes">2x</span>
380
427
  <span class="cline-any cline-yes">10x</span>
381
428
  <span class="cline-any cline-yes">10x</span>
382
429
  <span class="cline-any cline-yes">10x</span>
@@ -400,6 +447,23 @@
400
447
  <span class="cline-any cline-yes">2x</span>
401
448
  <span class="cline-any cline-yes">2x</span>
402
449
  <span class="cline-any cline-yes">2x</span>
450
+ <span class="cline-any cline-yes">2x</span>
451
+ <span class="cline-any cline-yes">2x</span>
452
+ <span class="cline-any cline-yes">2x</span>
453
+ <span class="cline-any cline-yes">10x</span>
454
+ <span class="cline-any cline-yes">10x</span>
455
+ <span class="cline-any cline-yes">10x</span>
456
+ <span class="cline-any cline-yes">10x</span>
457
+ <span class="cline-any cline-yes">40x</span>
458
+ <span class="cline-any cline-yes">40x</span>
459
+ <span class="cline-any cline-yes">10x</span>
460
+ <span class="cline-any cline-yes">10x</span>
461
+ <span class="cline-any cline-yes">10x</span>
462
+ <span class="cline-any cline-yes">2x</span>
463
+ <span class="cline-any cline-yes">2x</span>
464
+ <span class="cline-any cline-yes">2x</span>
465
+ <span class="cline-any cline-yes">2x</span>
466
+ <span class="cline-any cline-yes">2x</span>
403
467
  <span class="cline-any cline-yes">4x</span>
404
468
  <span class="cline-any cline-yes">4x</span>
405
469
  <span class="cline-any cline-yes">4x</span>
@@ -461,10 +525,13 @@ import { LitElement, nothing } from "lit";
461
525
  import { html } from 'lit/static-html.js';
462
526
  import { classMap } from 'lit/directives/class-map.js';
463
527
  &nbsp;
464
- import AuroLibraryRuntimeUtils from '@aurodesignsystem/auro-library/scripts/utils/runtimeUtils.mjs';
528
+ import { AuroAccordionGroup } from './auro-accordion-group.js';
529
+ import { AuroAccordionButton } from './auro-accordion-button.js';
465
530
  &nbsp;
466
531
  import { AuroDependencyVersioning } from '@aurodesignsystem/auro-library/scripts/runtime/dependencyTagVersioning.mjs';
467
532
  &nbsp;
533
+ import AuroLibraryRuntimeUtils from '@aurodesignsystem/auro-library/scripts/utils/runtimeUtils.mjs';
534
+ &nbsp;
468
535
  import { AuroIcon } from '@aurodesignsystem/auro-icon/src/auro-icon.js';
469
536
  import iconVersion from './iconVersion.js';
470
537
  &nbsp;
@@ -506,6 +573,16 @@ export class AuroAccordion extends LitElement {
506
573
  * @private
507
574
  */
508
575
  this.iconTag = versioning.generateTag('auro-icon', iconVersion, AuroIcon);
576
+ &nbsp;
577
+ /**
578
+ * @private
579
+ */
580
+ this.buttonNameHash = this.generateRandomLetters(4); //eslint-disable-line
581
+ &nbsp;
582
+ /**
583
+ * @private
584
+ */
585
+ this.buttonTag = versioning.generateTag('auro-accordion-button', this.buttonNameHash, AuroAccordionButton);
509
586
  &nbsp;
510
587
  /**
511
588
  * @private
@@ -566,7 +643,9 @@ export class AuroAccordion extends LitElement {
566
643
  *
567
644
  */
568
645
  static register(name = "auro-accordion") {
646
+ const nameGroup = `${name}-group`;
569
647
  AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroAccordion);
648
+ AuroAccordionGroup.register(nameGroup);
570
649
  }
571
650
  &nbsp;
572
651
  firstUpdated() {
@@ -588,6 +667,23 @@ export class AuroAccordion extends LitElement {
588
667
  &nbsp;
589
668
  return html`${svg}`;
590
669
  }
670
+ &nbsp;
671
+ /**
672
+ * Generates a random string of letters.
673
+ * @private
674
+ * @param {number} length - The number of characters to generate in the string.
675
+ * @returns {string} - The generated string.
676
+ */
677
+ generateRandomLetters(length) {
678
+ let result = '';
679
+ const characters = 'abcdefghijklmnopqrstuvwxyz';
680
+ const charactersLength = characters.length;
681
+ for (let index = 0; index &lt; length; index += 1) {
682
+ result += characters.charAt(Math.floor(Math.random() * charactersLength));
683
+ }
684
+ &nbsp;
685
+ return result;
686
+ }
591
687
  &nbsp;
592
688
  /**
593
689
  * Toggles the visibility of the accordion content.
@@ -615,7 +711,7 @@ export class AuroAccordion extends LitElement {
615
711
  &nbsp;
616
712
  return html`
617
713
  &lt;div class="componentWrapper" part="accordion"&gt;
618
- &lt;auro-accordion-button
714
+ &lt;${this.buttonTag}
619
715
  ?fluid="${this.emphasis}"
620
716
  class="${classMap(buttonClasses)}"
621
717
  id="accordionTrigger"
@@ -632,7 +728,7 @@ export class AuroAccordion extends LitElement {
632
728
  &lt;/${this.iconTag}&gt;
633
729
  `}
634
730
  &lt;slot name="trigger" part="triggerSlot"&gt;&lt;/slot&gt;
635
- &lt;/auro-accordion-button&gt;
731
+ &lt;/${this.buttonTag}&gt;
636
732
  &lt;div class="content" id="accordionContent" aria-labelledby="accordionTrigger" inert="${!this.expanded || nothing}" part="content"&gt;
637
733
  &lt;div class="contentWrapper" part="contentWrapper"&gt;
638
734
  &lt;slot&gt;&lt;/slot&gt;
@@ -649,7 +745,7 @@ export class AuroAccordion extends LitElement {
649
745
  <div class='footer quiet pad2 space-top1 center small'>
650
746
  Code coverage generated by
651
747
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
652
- at 2024-12-21T00:10:49.305Z
748
+ at 2025-01-28T17:56:08.825Z
653
749
  </div>
654
750
  <script src="prettify.js"></script>
655
751
  <script>