@aurodesignsystem/auro-accordion 5.2.1 → 5.2.2

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 (71) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/README.md +1 -1
  3. package/coverage/lcov-report/index.html +23 -113
  4. package/coverage/lcov-report/{auro-accordion-button.js.html → src/auro-accordion-button.js.html} +89 -20
  5. package/coverage/lcov-report/{auro-accordion-group.js.html → src/auro-accordion-group.js.html} +10 -10
  6. package/coverage/lcov-report/{auro-accordion.js.html → src/auro-accordion.js.html} +127 -52
  7. package/coverage/lcov-report/{iconVersion.js.html → src/iconVersion.js.html} +11 -11
  8. package/coverage/lcov-report/src/index.html +161 -0
  9. package/coverage/lcov-report/{color-css.js.html → src/styles/color-css.js.html} +11 -11
  10. package/coverage/lcov-report/src/styles/index.html +161 -0
  11. package/coverage/lcov-report/{style-button-css.js.html → src/styles/style-button-css.js.html} +11 -11
  12. package/coverage/lcov-report/src/styles/style-css.js.html +91 -0
  13. package/coverage/lcov-report/{tokens-css.js.html → src/styles/tokens-css.js.html} +11 -11
  14. package/coverage/lcov.info +214 -146
  15. package/demo/api.html +18 -10
  16. package/demo/api.md +6 -6
  17. package/demo/api.min.js +967 -175
  18. package/demo/index.html +17 -10
  19. package/demo/index.min.js +967 -175
  20. package/dist/auro-accordion__bundled.js +967 -175
  21. package/dist/{auro-accordion-button.d.ts → src/auro-accordion-button.d.ts} +2 -0
  22. package/dist/src/auro-accordion-button.d.ts.map +1 -0
  23. package/dist/src/auro-accordion-group.d.ts.map +1 -0
  24. package/dist/{auro-accordion.d.ts → src/auro-accordion.d.ts} +4 -4
  25. package/dist/src/auro-accordion.d.ts.map +1 -0
  26. package/dist/src/iconVersion.d.ts +3 -0
  27. package/dist/src/iconVersion.d.ts.map +1 -0
  28. package/dist/{color-css.d.ts.map → src/styles/color-css.d.ts.map} +1 -1
  29. package/dist/src/styles/style-button-css.d.ts.map +1 -0
  30. package/dist/{style-css.d.ts.map → src/styles/style-css.d.ts.map} +1 -1
  31. package/dist/{tokens-css.d.ts.map → src/styles/tokens-css.d.ts.map} +1 -1
  32. package/dist/test/auro-accordion-group.test.d.ts +2 -0
  33. package/dist/test/auro-accordion-group.test.d.ts.map +1 -0
  34. package/dist/test/auro-accordion.test.d.ts +2 -0
  35. package/dist/test/auro-accordion.test.d.ts.map +1 -0
  36. package/package.json +37 -36
  37. package/src/auro-accordion-button.js +25 -2
  38. package/src/auro-accordion.js +49 -24
  39. package/src/iconVersion.js +1 -1
  40. package/src/styles/color-css.js +2 -0
  41. package/src/styles/color.css +43 -0
  42. package/src/{color.scss → styles/color.scss} +11 -7
  43. package/src/styles/style-button-css.js +2 -0
  44. package/src/styles/style-button.css +61 -0
  45. package/src/{style-button.scss → styles/style-button.scss} +16 -11
  46. package/src/styles/style-css.js +2 -0
  47. package/src/styles/style.css +347 -0
  48. package/src/{style.scss → styles/style.scss} +19 -33
  49. package/src/styles/tokens-css.js +2 -0
  50. package/src/styles/tokens.css +7 -0
  51. package/src/{tokens.scss → styles/tokens.scss} +4 -4
  52. package/coverage/lcov-report/style-css.js.html +0 -91
  53. package/dist/auro-accordion-button.d.ts.map +0 -1
  54. package/dist/auro-accordion-group.d.ts.map +0 -1
  55. package/dist/auro-accordion.d.ts.map +0 -1
  56. package/dist/iconVersion.d.ts +0 -3
  57. package/dist/iconVersion.d.ts.map +0 -1
  58. package/dist/style-button-css.d.ts.map +0 -1
  59. package/src/color-css.js +0 -2
  60. package/src/color.css +0 -39
  61. package/src/style-button-css.js +0 -2
  62. package/src/style-button.css +0 -53
  63. package/src/style-css.js +0 -2
  64. package/src/style.css +0 -147
  65. package/src/tokens-css.js +0 -2
  66. package/src/tokens.css +0 -7
  67. /package/dist/{auro-accordion-group.d.ts → src/auro-accordion-group.d.ts} +0 -0
  68. /package/dist/{color-css.d.ts → src/styles/color-css.d.ts} +0 -0
  69. /package/dist/{style-button-css.d.ts → src/styles/style-button-css.d.ts} +0 -0
  70. /package/dist/{style-css.d.ts → src/styles/style-css.d.ts} +0 -0
  71. /package/dist/{tokens-css.d.ts → src/styles/tokens-css.d.ts} +0 -0
@@ -3,15 +3,15 @@
3
3
  <html lang="en">
4
4
 
5
5
  <head>
6
- <title>Code coverage report for auro-accordion.js</title>
6
+ <title>Code coverage report for src/auro-accordion.js</title>
7
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" />
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
11
  <meta name="viewport" content="width=device-width, initial-scale=1" />
12
12
  <style type='text/css'>
13
13
  .coverage-summary .sorter {
14
- background-image: url(sort-arrow-sprite.png);
14
+ background-image: url(../sort-arrow-sprite.png);
15
15
  }
16
16
  </style>
17
17
  </head>
@@ -19,34 +19,34 @@
19
19
  <body>
20
20
  <div class='wrapper'>
21
21
  <div class='pad1'>
22
- <h1><a href="index.html">All files</a> auro-accordion.js</h1>
22
+ <h1><a href="../index.html">All files</a> / <a href="index.html">src</a> auro-accordion.js</h1>
23
23
  <div class='clearfix'>
24
24
 
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'>245/245</span>
28
+ <span class='fraction'>270/270</span>
29
29
  </div>
30
30
 
31
31
 
32
32
  <div class='fl pad1y space-right2'>
33
33
  <span class="strong">100% </span>
34
34
  <span class="quiet">Branches</span>
35
- <span class='fraction'>17/17</span>
35
+ <span class='fraction'>26/26</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'>10/10</span>
42
+ <span class='fraction'>11/11</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'>245/245</span>
49
+ <span class='fraction'>270/270</span>
50
50
  </div>
51
51
 
52
52
 
@@ -308,7 +308,33 @@
308
308
  <a name='L243'></a><a href='#L243'>243</a>
309
309
  <a name='L244'></a><a href='#L244'>244</a>
310
310
  <a name='L245'></a><a href='#L245'>245</a>
311
- <a name='L246'></a><a href='#L246'>246</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">2x</span>
311
+ <a name='L246'></a><a href='#L246'>246</a>
312
+ <a name='L247'></a><a href='#L247'>247</a>
313
+ <a name='L248'></a><a href='#L248'>248</a>
314
+ <a name='L249'></a><a href='#L249'>249</a>
315
+ <a name='L250'></a><a href='#L250'>250</a>
316
+ <a name='L251'></a><a href='#L251'>251</a>
317
+ <a name='L252'></a><a href='#L252'>252</a>
318
+ <a name='L253'></a><a href='#L253'>253</a>
319
+ <a name='L254'></a><a href='#L254'>254</a>
320
+ <a name='L255'></a><a href='#L255'>255</a>
321
+ <a name='L256'></a><a href='#L256'>256</a>
322
+ <a name='L257'></a><a href='#L257'>257</a>
323
+ <a name='L258'></a><a href='#L258'>258</a>
324
+ <a name='L259'></a><a href='#L259'>259</a>
325
+ <a name='L260'></a><a href='#L260'>260</a>
326
+ <a name='L261'></a><a href='#L261'>261</a>
327
+ <a name='L262'></a><a href='#L262'>262</a>
328
+ <a name='L263'></a><a href='#L263'>263</a>
329
+ <a name='L264'></a><a href='#L264'>264</a>
330
+ <a name='L265'></a><a href='#L265'>265</a>
331
+ <a name='L266'></a><a href='#L266'>266</a>
332
+ <a name='L267'></a><a href='#L267'>267</a>
333
+ <a name='L268'></a><a href='#L268'>268</a>
334
+ <a name='L269'></a><a href='#L269'>269</a>
335
+ <a name='L270'></a><a href='#L270'>270</a>
336
+ <a name='L271'></a><a href='#L271'>271</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">2x</span>
337
+ <span class="cline-any cline-yes">2x</span>
312
338
  <span class="cline-any cline-yes">2x</span>
313
339
  <span class="cline-any cline-yes">2x</span>
314
340
  <span class="cline-any cline-yes">2x</span>
@@ -454,19 +480,37 @@
454
480
  <span class="cline-any cline-yes">14x</span>
455
481
  <span class="cline-any cline-yes">2x</span>
456
482
  <span class="cline-any cline-yes">2x</span>
483
+ <span class="cline-any cline-yes">29x</span>
484
+ <span class="cline-any cline-yes">29x</span>
485
+ <span class="cline-any cline-yes">19x</span>
486
+ <span class="cline-any cline-yes">19x</span>
487
+ <span class="cline-any cline-yes">19x</span>
488
+ <span class="cline-any cline-yes">19x</span>
489
+ <span class="cline-any cline-yes">19x</span>
490
+ <span class="cline-any cline-yes">29x</span>
457
491
  <span class="cline-any cline-yes">2x</span>
458
492
  <span class="cline-any cline-yes">2x</span>
459
493
  <span class="cline-any cline-yes">2x</span>
460
494
  <span class="cline-any cline-yes">2x</span>
461
495
  <span class="cline-any cline-yes">2x</span>
462
496
  <span class="cline-any cline-yes">2x</span>
463
- <span class="cline-any cline-yes">56x</span>
464
- <span class="cline-any cline-yes">56x</span>
465
- <span class="cline-any cline-yes">56x</span>
466
- <span class="cline-any cline-yes">56x</span>
467
- <span class="cline-any cline-yes">56x</span>
468
- <span class="cline-any cline-yes">56x</span>
469
- <span class="cline-any cline-yes">56x</span>
497
+ <span class="cline-any cline-yes">2x</span>
498
+ <span class="cline-any cline-yes">29x</span>
499
+ <span class="cline-any cline-yes">1x</span>
500
+ <span class="cline-any cline-yes">1x</span>
501
+ <span class="cline-any cline-yes">28x</span>
502
+ <span class="cline-any cline-yes">29x</span>
503
+ <span class="cline-any cline-yes">29x</span>
504
+ <span class="cline-any cline-yes">29x</span>
505
+ <span class="cline-any cline-yes">29x</span>
506
+ <span class="cline-any cline-yes">29x</span>
507
+ <span class="cline-any cline-yes">29x</span>
508
+ <span class="cline-any cline-yes">29x</span>
509
+ <span class="cline-any cline-yes">29x</span>
510
+ <span class="cline-any cline-yes">29x</span>
511
+ <span class="cline-any cline-yes">29x</span>
512
+ <span class="cline-any cline-yes">29x</span>
513
+ <span class="cline-any cline-yes">29x</span>
470
514
  <span class="cline-any cline-yes">2x</span>
471
515
  <span class="cline-any cline-yes">2x</span>
472
516
  <span class="cline-any cline-yes">2x</span>
@@ -535,12 +579,18 @@
535
579
  <span class="cline-any cline-yes">29x</span>
536
580
  <span class="cline-any cline-yes">29x</span>
537
581
  <span class="cline-any cline-yes">29x</span>
538
- <span class="cline-any cline-yes">28x</span>
539
- <span class="cline-any cline-yes">28x</span>
540
- <span class="cline-any cline-yes">28x</span>
541
- <span class="cline-any cline-yes">28x</span>
542
- <span class="cline-any cline-yes">28x</span>
543
- <span class="cline-any cline-yes">28x</span>
582
+ <span class="cline-any cline-yes">29x</span>
583
+ <span class="cline-any cline-yes">29x</span>
584
+ <span class="cline-any cline-yes">29x</span>
585
+ <span class="cline-any cline-yes">29x</span>
586
+ <span class="cline-any cline-yes">29x</span>
587
+ <span class="cline-any cline-yes">29x</span>
588
+ <span class="cline-any cline-yes">29x</span>
589
+ <span class="cline-any cline-yes">29x</span>
590
+ <span class="cline-any cline-yes">29x</span>
591
+ <span class="cline-any cline-yes">29x</span>
592
+ <span class="cline-any cline-yes">29x</span>
593
+ <span class="cline-any cline-yes">29x</span>
544
594
  <span class="cline-any cline-yes">29x</span>
545
595
  <span class="cline-any cline-yes">29x</span>
546
596
  <span class="cline-any cline-yes">29x</span>
@@ -564,6 +614,7 @@
564
614
  import { LitElement, nothing } from "lit";
565
615
  import { html } from 'lit/static-html.js';
566
616
  import { classMap } from 'lit/directives/class-map.js';
617
+ import { unsafeHTML } from 'lit/directives/unsafe-html.js';
567
618
  &nbsp;
568
619
  import { AuroAccordionGroup } from './auro-accordion-group.js';
569
620
  import { AuroAccordionButton } from './auro-accordion-button.js';
@@ -578,9 +629,9 @@ import iconVersion from './iconVersion.js';
578
629
  import chevronUp from "@alaskaairux/icons/dist/icons/interface/chevron-up.mjs";
579
630
  import chevronDown from "@alaskaairux/icons/dist/icons/interface/chevron-down.mjs";
580
631
  &nbsp;
581
- import styleCss from "./style-css.js";
582
- import colorCss from "./color-css.js";
583
- import tokensCss from "./tokens-css.js";
632
+ import styleCss from "./styles/style-css.js";
633
+ import colorCss from "./styles/color-css.js";
634
+ import tokensCss from "./styles/tokens-css.js";
584
635
  &nbsp;
585
636
  // See https://git.io/JJ6SJ for "How to document your components using JSDoc"
586
637
  /**
@@ -697,20 +748,38 @@ export class AuroAccordion extends LitElement {
697
748
  // Add the tag name as an attribute if it is different than the component name
698
749
  this.runtimeUtils.handleComponentTagRename(this, 'auro-accordion');
699
750
  }
751
+ &nbsp;
752
+ updated(changedProperties) {
753
+ // Update button when ariaexpanded changes
754
+ if (changedProperties.has('expanded')) {
755
+ const button = this.shadowRoot.querySelector('#accordionTrigger');
756
+ if (button) {
757
+ button.ariaexpanded = this.expanded;
758
+ }
759
+ }
760
+ }
700
761
  &nbsp;
701
762
  /**
702
- * Internal function to generate the HTML for the icon to use.
763
+ * Renders the chevron icons.
703
764
  * @private
704
- * @param {string} svgContent - The imported svg icon.
705
- * @returns {TemplateResult} - The html template for the icon.
765
+ * @returns {TemplateResult} - The html template for the chevron icons.
706
766
  */
707
- generateIconHtml(svgContent) {
708
- const dom = new DOMParser().parseFromString(svgContent, 'text/html');
709
- const svg = dom.body.firstChild;
710
- &nbsp;
711
- svg.setAttribute('slot', 'svg');
712
- &nbsp;
713
- return html`${svg}`;
767
+ renderChevronIcons() {
768
+ if (this.chevron === 'none') {
769
+ return nothing;
770
+ }
771
+
772
+ const iconSvg = this.expanded ? chevronUp.svg : chevronDown.svg;
773
+
774
+ return html`
775
+ &lt;${this.iconTag}
776
+ customSvg
777
+ customColor
778
+ ?disabled="${this.disabled}"
779
+ part="chevron"&gt;
780
+ &lt;div slot="svg"&gt;${unsafeHTML(iconSvg)}&lt;/div&gt;
781
+ &lt;/${this.iconTag}&gt;
782
+ `;
714
783
  }
715
784
  &nbsp;
716
785
  /**
@@ -763,9 +832,20 @@ export class AuroAccordion extends LitElement {
763
832
  const buttonClasses = {
764
833
  "trigger": true,
765
834
  "iconRight": this.getAttribute('chevron') === 'right',
835
+ "iconNone": this.getAttribute('chevron') === 'none',
766
836
  "sm": this.getAttribute('variant') === 'sm',
767
837
  "lg": this.getAttribute('variant') === 'lg',
768
838
  };
839
+ &nbsp;
840
+ const variantClassMap = {
841
+ 'sm': 'body-default',
842
+ 'lg': 'heading-xs'
843
+ };
844
+ &nbsp;
845
+ const triggerSlotClass = variantClassMap[this.variant] || 'heading-2xs';
846
+ &nbsp;
847
+ // Generate unique ID &amp; apply aria-controls
848
+ const accordionContentId = `accordionContent-${this.buttonNameHash}`;
769
849
  &nbsp;
770
850
  return html`
771
851
  &lt;div class="componentWrapper" part="accordion"&gt;
@@ -773,23 +853,18 @@ export class AuroAccordion extends LitElement {
773
853
  ?fluid="${this.emphasis}"
774
854
  class="${classMap(buttonClasses)}"
775
855
  id="accordionTrigger"
776
- aria-controls="accordionContent"
856
+ aria-controls="${accordionContentId}"
777
857
  ?ariaexpanded="${this.expanded}"
778
858
  ?aria-disabled="${this.disabled}"
779
859
  ?disabled="${this.disabled}"
780
860
  @click="${this.handleButtonClick}"
781
861
  part="trigger"&gt;
782
- ${this.chevron === 'none' ? undefined : html`
783
- &lt;${this.iconTag} slot="icon" customSvg customColor ?hidden="${!this.expanded}"&gt;
784
- ${this.generateIconHtml(chevronUp.svg)}
785
- &lt;/${this.iconTag}&gt;
786
- &lt;${this.iconTag} slot="icon" customSvg customColor ?hidden="${this.expanded}"&gt;
787
- ${this.generateIconHtml(chevronDown.svg)}
788
- &lt;/${this.iconTag}&gt;
789
- `}
790
- &lt;slot name="trigger" part="triggerSlot"&gt;&lt;/slot&gt;
862
+ ${this.chevron === 'right' ? nothing : this.renderChevronIcons()}
863
+ &lt;slot name="trigger" part="triggerSlot" class="${triggerSlotClass}"&gt;&lt;/slot&gt;
864
+ ${this.chevron === 'right' ? this.renderChevronIcons() : nothing}
791
865
  &lt;/${this.buttonTag}&gt;
792
- &lt;div class="content" id="accordionContent" aria-labelledby="accordionTrigger" inert="${!this.expanded || nothing}" part="content"&gt;
866
+
867
+ &lt;div class="content body-default" id="${accordionContentId}" aria-labelledby="accordionTrigger" inert="${!this.expanded || nothing}" part="content"&gt;
793
868
  &lt;div class="contentWrapper" part="contentWrapper"&gt;
794
869
  &lt;slot&gt;&lt;/slot&gt;
795
870
  &lt;/div&gt;
@@ -805,16 +880,16 @@ export class AuroAccordion extends LitElement {
805
880
  <div class='footer quiet pad2 space-top1 center small'>
806
881
  Code coverage generated by
807
882
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
808
- at 2025-05-20T02:31:15.245Z
883
+ at 2025-07-31T20:37:59.492Z
809
884
  </div>
810
- <script src="prettify.js"></script>
885
+ <script src="../prettify.js"></script>
811
886
  <script>
812
887
  window.onload = function () {
813
888
  prettyPrint();
814
889
  };
815
890
  </script>
816
- <script src="sorter.js"></script>
817
- <script src="block-navigation.js"></script>
891
+ <script src="../sorter.js"></script>
892
+ <script src="../block-navigation.js"></script>
818
893
  </body>
819
894
  </html>
820
895
 
@@ -3,15 +3,15 @@
3
3
  <html lang="en">
4
4
 
5
5
  <head>
6
- <title>Code coverage report for iconVersion.js</title>
6
+ <title>Code coverage report for src/iconVersion.js</title>
7
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" />
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
11
  <meta name="viewport" content="width=device-width, initial-scale=1" />
12
12
  <style type='text/css'>
13
13
  .coverage-summary .sorter {
14
- background-image: url(sort-arrow-sprite.png);
14
+ background-image: url(../sort-arrow-sprite.png);
15
15
  }
16
16
  </style>
17
17
  </head>
@@ -19,7 +19,7 @@
19
19
  <body>
20
20
  <div class='wrapper'>
21
21
  <div class='pad1'>
22
- <h1><a href="index.html">All files</a> iconVersion.js</h1>
22
+ <h1><a href="../index.html">All files</a> / <a href="index.html">src</a> iconVersion.js</h1>
23
23
  <div class='clearfix'>
24
24
 
25
25
  <div class='fl pad1y space-right2'>
@@ -63,23 +63,23 @@
63
63
  </div>
64
64
  <div class='status-line high'></div>
65
65
  <pre><table class="coverage">
66
- <tr><td class="line-count quiet"><a name='L1'></a><a href='#L1'>1</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">2x</span></td><td class="text"><pre class="prettyprint lang-js">export default '8.0.2'</pre></td></tr></table></pre>
66
+ <tr><td class="line-count quiet"><a name='L1'></a><a href='#L1'>1</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">2x</span></td><td class="text"><pre class="prettyprint lang-js">export default '8.1.1'</pre></td></tr></table></pre>
67
67
 
68
68
  <div class='push'></div><!-- for sticky footer -->
69
69
  </div><!-- /wrapper -->
70
70
  <div class='footer quiet pad2 space-top1 center small'>
71
71
  Code coverage generated by
72
72
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
73
- at 2025-05-20T02:31:15.245Z
73
+ at 2025-07-31T20:37:59.492Z
74
74
  </div>
75
- <script src="prettify.js"></script>
75
+ <script src="../prettify.js"></script>
76
76
  <script>
77
77
  window.onload = function () {
78
78
  prettyPrint();
79
79
  };
80
80
  </script>
81
- <script src="sorter.js"></script>
82
- <script src="block-navigation.js"></script>
81
+ <script src="../sorter.js"></script>
82
+ <script src="../block-navigation.js"></script>
83
83
  </body>
84
84
  </html>
85
85
 
@@ -0,0 +1,161 @@
1
+
2
+ <!doctype html>
3
+ <html lang="en">
4
+
5
+ <head>
6
+ <title>Code coverage report for src</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> src</h1>
23
+ <div class='clearfix'>
24
+
25
+ <div class='fl pad1y space-right2'>
26
+ <span class="strong">99.59% </span>
27
+ <span class="quiet">Statements</span>
28
+ <span class='fraction'>486/488</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'>58/58</span>
36
+ </div>
37
+
38
+
39
+ <div class='fl pad1y space-right2'>
40
+ <span class="strong">96.15% </span>
41
+ <span class="quiet">Functions</span>
42
+ <span class='fraction'>25/26</span>
43
+ </div>
44
+
45
+
46
+ <div class='fl pad1y space-right2'>
47
+ <span class="strong">99.59% </span>
48
+ <span class="quiet">Lines</span>
49
+ <span class='fraction'>486/488</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
+ <div class="pad1">
66
+ <table class="coverage-summary">
67
+ <thead>
68
+ <tr>
69
+ <th data-col="file" data-fmt="html" data-html="true" class="file">File</th>
70
+ <th data-col="pic" data-type="number" data-fmt="html" data-html="true" class="pic"></th>
71
+ <th data-col="statements" data-type="number" data-fmt="pct" class="pct">Statements</th>
72
+ <th data-col="statements_raw" data-type="number" data-fmt="html" class="abs"></th>
73
+ <th data-col="branches" data-type="number" data-fmt="pct" class="pct">Branches</th>
74
+ <th data-col="branches_raw" data-type="number" data-fmt="html" class="abs"></th>
75
+ <th data-col="functions" data-type="number" data-fmt="pct" class="pct">Functions</th>
76
+ <th data-col="functions_raw" data-type="number" data-fmt="html" class="abs"></th>
77
+ <th data-col="lines" data-type="number" data-fmt="pct" class="pct">Lines</th>
78
+ <th data-col="lines_raw" data-type="number" data-fmt="html" class="abs"></th>
79
+ </tr>
80
+ </thead>
81
+ <tbody><tr>
82
+ <td class="file high" data-value="auro-accordion-button.js"><a href="auro-accordion-button.js.html">auro-accordion-button.js</a></td>
83
+ <td data-value="96.96" class="pic high">
84
+ <div class="chart"><div class="cover-fill" style="width: 96%"></div><div class="cover-empty" style="width: 4%"></div></div>
85
+ </td>
86
+ <td data-value="96.96" class="pct high">96.96%</td>
87
+ <td data-value="66" class="abs high">64/66</td>
88
+ <td data-value="100" class="pct high">100%</td>
89
+ <td data-value="8" class="abs high">8/8</td>
90
+ <td data-value="80" class="pct high">80%</td>
91
+ <td data-value="5" class="abs high">4/5</td>
92
+ <td data-value="96.96" class="pct high">96.96%</td>
93
+ <td data-value="66" class="abs high">64/66</td>
94
+ </tr>
95
+
96
+ <tr>
97
+ <td class="file high" data-value="auro-accordion-group.js"><a href="auro-accordion-group.js.html">auro-accordion-group.js</a></td>
98
+ <td data-value="100" class="pic high">
99
+ <div class="chart"><div class="cover-fill cover-full" style="width: 100%"></div><div class="cover-empty" style="width: 0%"></div></div>
100
+ </td>
101
+ <td data-value="100" class="pct high">100%</td>
102
+ <td data-value="151" class="abs high">151/151</td>
103
+ <td data-value="100" class="pct high">100%</td>
104
+ <td data-value="23" class="abs high">23/23</td>
105
+ <td data-value="100" class="pct high">100%</td>
106
+ <td data-value="10" class="abs high">10/10</td>
107
+ <td data-value="100" class="pct high">100%</td>
108
+ <td data-value="151" class="abs high">151/151</td>
109
+ </tr>
110
+
111
+ <tr>
112
+ <td class="file high" data-value="auro-accordion.js"><a href="auro-accordion.js.html">auro-accordion.js</a></td>
113
+ <td data-value="100" class="pic high">
114
+ <div class="chart"><div class="cover-fill cover-full" style="width: 100%"></div><div class="cover-empty" style="width: 0%"></div></div>
115
+ </td>
116
+ <td data-value="100" class="pct high">100%</td>
117
+ <td data-value="270" class="abs high">270/270</td>
118
+ <td data-value="100" class="pct high">100%</td>
119
+ <td data-value="26" class="abs high">26/26</td>
120
+ <td data-value="100" class="pct high">100%</td>
121
+ <td data-value="11" class="abs high">11/11</td>
122
+ <td data-value="100" class="pct high">100%</td>
123
+ <td data-value="270" class="abs high">270/270</td>
124
+ </tr>
125
+
126
+ <tr>
127
+ <td class="file high" data-value="iconVersion.js"><a href="iconVersion.js.html">iconVersion.js</a></td>
128
+ <td data-value="100" class="pic high">
129
+ <div class="chart"><div class="cover-fill cover-full" style="width: 100%"></div><div class="cover-empty" style="width: 0%"></div></div>
130
+ </td>
131
+ <td data-value="100" class="pct high">100%</td>
132
+ <td data-value="1" class="abs high">1/1</td>
133
+ <td data-value="100" class="pct high">100%</td>
134
+ <td data-value="1" class="abs high">1/1</td>
135
+ <td data-value="100" class="pct high">100%</td>
136
+ <td data-value="0" class="abs high">0/0</td>
137
+ <td data-value="100" class="pct high">100%</td>
138
+ <td data-value="1" class="abs high">1/1</td>
139
+ </tr>
140
+
141
+ </tbody>
142
+ </table>
143
+ </div>
144
+ <div class='push'></div><!-- for sticky footer -->
145
+ </div><!-- /wrapper -->
146
+ <div class='footer quiet pad2 space-top1 center small'>
147
+ Code coverage generated by
148
+ <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
149
+ at 2025-07-31T20:37:59.492Z
150
+ </div>
151
+ <script src="../prettify.js"></script>
152
+ <script>
153
+ window.onload = function () {
154
+ prettyPrint();
155
+ };
156
+ </script>
157
+ <script src="../sorter.js"></script>
158
+ <script src="../block-navigation.js"></script>
159
+ </body>
160
+ </html>
161
+
@@ -3,15 +3,15 @@
3
3
  <html lang="en">
4
4
 
5
5
  <head>
6
- <title>Code coverage report for color-css.js</title>
6
+ <title>Code coverage report for src/styles/color-css.js</title>
7
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" />
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
11
  <meta name="viewport" content="width=device-width, initial-scale=1" />
12
12
  <style type='text/css'>
13
13
  .coverage-summary .sorter {
14
- background-image: url(sort-arrow-sprite.png);
14
+ background-image: url(../../sort-arrow-sprite.png);
15
15
  }
16
16
  </style>
17
17
  </head>
@@ -19,7 +19,7 @@
19
19
  <body>
20
20
  <div class='wrapper'>
21
21
  <div class='pad1'>
22
- <h1><a href="index.html">All files</a> color-css.js</h1>
22
+ <h1><a href="../../index.html">All files</a> / <a href="index.html">src/styles</a> color-css.js</h1>
23
23
  <div class='clearfix'>
24
24
 
25
25
  <div class='fl pad1y space-right2'>
@@ -68,7 +68,7 @@
68
68
  <a name='L3'></a><a href='#L3'>3</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">2x</span>
69
69
  <span class="cline-any cline-yes">2x</span>
70
70
  <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import { css } from 'lit';
71
- export default css`:host .trigger{color:var(--ds-auro-accordion-trigger-color);border-color:var(--ds-auro-accordion-trigger-border-color)}:host [auro-icon]{color:var(--ds-auro-accordion-trigger-icon-color)}:host([disabled]){--ds-auro-accordion-trigger-color:var(--ds-basic-color-texticon-disabled, $ds-basic-color-texticon-disabled)}:host(:focus){--ds-auro-accordion-trigger-border-color:var(--ds-advanced-color-state-focused, #01426a)}:host([grouped]) .componentWrapper{border-bottom-color:var(--ds-auro-accordion-group-border-color)}:host([emphasis]) .trigger:before{border-color:var(--ds-auro-accordion-trigger-border-color)}:host([emphasis]) .trigger:focus:before,:host([emphasis]) .trigger:hover:before{--ds-auro-accordion-trigger-border-color:var(--ds-advanced-color-state-selected, #01426a)}:host([emphasis]) .trigger:focus{--ds-auro-accordion-trigger-border-color:var(--ds-advanced-color-state-focused, #01426a)}:host([emphasis]) .content{border-left-color:var(--ds-auro-accordion-content-border-color)}:host([emphasis][expanded]) .trigger:before{--ds-auro-accordion-trigger-border-color:var(--ds-advanced-color-state-selected, #01426a)}:host([emphasis][expanded]) .content{--ds-auro-accordion-content-border-color:var(--ds-basic-color-border-subtle, #dddddd)}`;
71
+ export default css`:host .trigger{color:var(--ds-auro-accordion-trigger-color);border-color:var(--ds-auro-accordion-trigger-border-color)}:host [auro-icon]{color:var(--ds-auro-accordion-trigger-icon-color)}:host([disabled]){--ds-auro-accordion-trigger-color: var(--ds-basic-color-texticon-disabled, v.$ds-basic-color-texticon-disabled)}:host([disabled]) [auro-icon]{color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:focus){--ds-auro-accordion-trigger-border-color: var(--ds-advanced-color-state-focused, #01426a)}:host([grouped]) .componentWrapper{border-bottom-color:var(--ds-auro-accordion-group-border-color)}:host([emphasis]) .trigger:before{border-color:var(--ds-auro-accordion-trigger-border-color)}:host([emphasis]) .trigger:focus:before,:host([emphasis]) .trigger:hover:before{--ds-auro-accordion-trigger-border-color: var(--ds-advanced-color-state-selected, #01426a)}:host([emphasis]) .trigger:focus{--ds-auro-accordion-trigger-border-color: var(--ds-advanced-color-state-focused, #01426a)}:host([emphasis]) .content{border-left-color:var(--ds-auro-accordion-content-border-color)}:host([emphasis][expanded]) .trigger:before{--ds-auro-accordion-trigger-border-color: var(--ds-advanced-color-state-selected, #01426a)}:host([emphasis][expanded]) .content{--ds-auro-accordion-content-border-color: var(--ds-basic-color-border-subtle, #dddddd)}`;
72
72
  &nbsp;</pre></td></tr></table></pre>
73
73
 
74
74
  <div class='push'></div><!-- for sticky footer -->
@@ -76,16 +76,16 @@ export default css`:host .trigger{color:var(--ds-auro-accordion-trigger-color);b
76
76
  <div class='footer quiet pad2 space-top1 center small'>
77
77
  Code coverage generated by
78
78
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
79
- at 2025-05-20T02:31:15.245Z
79
+ at 2025-07-31T20:37:59.492Z
80
80
  </div>
81
- <script src="prettify.js"></script>
81
+ <script src="../../prettify.js"></script>
82
82
  <script>
83
83
  window.onload = function () {
84
84
  prettyPrint();
85
85
  };
86
86
  </script>
87
- <script src="sorter.js"></script>
88
- <script src="block-navigation.js"></script>
87
+ <script src="../../sorter.js"></script>
88
+ <script src="../../block-navigation.js"></script>
89
89
  </body>
90
90
  </html>
91
91