@aurodesignsystem/auro-accordion 5.0.2 → 5.1.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.
@@ -2,6 +2,7 @@
2
2
  "cSpell.words": [
3
3
  "csspart",
4
4
  "labelledby",
5
- "slotchange"
5
+ "slotchange",
6
+ "texticon"
6
7
  ]
7
8
  }
package/CHANGELOG.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # Semantic Release Automated Changelog
2
2
 
3
+ # [5.1.0](https://github.com/AlaskaAirlines/auro-accordion/compare/v5.0.2...v5.1.0) (2025-04-23)
4
+
5
+
6
+ ### Features
7
+
8
+ * support new component themes [#171](https://github.com/AlaskaAirlines/auro-accordion/issues/171) ([e28dba7](https://github.com/AlaskaAirlines/auro-accordion/commit/e28dba784d568075c2f6679949fc0487ca535588))
9
+
3
10
  ## [5.0.2](https://github.com/AlaskaAirlines/auro-accordion/compare/v5.0.1...v5.0.2) (2025-04-14)
4
11
 
5
12
 
package/README.md CHANGED
@@ -125,7 +125,7 @@ In cases where the project is not able to process JS assets, there are pre-proce
125
125
  ```html
126
126
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@/dist/auro-classic/CSSCustomProperties.css" />
127
127
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@/dist/bundled/essentials.css" />
128
- <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-accordion@5.0.2/dist/auro-accordion__bundled.js" type="module"></script>
128
+ <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-accordion@5.1.0/dist/auro-accordion__bundled.js" type="module"></script>
129
129
  ```
130
130
 
131
131
  <!-- AURO-GENERATED-CONTENT:END -->
@@ -199,7 +199,7 @@ export class AuroAccordionButton extends AuroButton {
199
199
  <div class='footer quiet pad2 space-top1 center small'>
200
200
  Code coverage generated by
201
201
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
202
- at 2025-04-14T23:37:20.783Z
202
+ at 2025-04-23T19:21:10.256Z
203
203
  </div>
204
204
  <script src="prettify.js"></script>
205
205
  <script>
@@ -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 2025-04-14T23:37:20.783Z
460
+ at 2025-04-23T19:21:10.256Z
461
461
  </div>
462
462
  <script src="prettify.js"></script>
463
463
  <script>
@@ -745,7 +745,7 @@ export class AuroAccordion extends LitElement {
745
745
  <div class='footer quiet pad2 space-top1 center small'>
746
746
  Code coverage generated by
747
747
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
748
- at 2025-04-14T23:37:20.783Z
748
+ at 2025-04-23T19:21:10.256Z
749
749
  </div>
750
750
  <script src="prettify.js"></script>
751
751
  <script>
@@ -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(:focus){--ds-auro-accordion-trigger-border-color:var(--ds-color-border-active-default, #0074c8);--ds-auro-accordion-trigger-icon-color:var(--ds-color-icon-ui-secondary-focus-default, #7e7e7e)}:host(:hover){--ds-auro-accordion-trigger-icon-color:var(--ds-color-icon-ui-secondary-hover-default, #525252)}: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-color-border-active-default, #0074c8)}:host([emphasis]) .trigger:focus{--ds-auro-accordion-trigger-border-color:var(--ds-color-border-active-default, #0074c8)}: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-color-border-active-default, #0074c8)}:host([emphasis][expanded]) .content{--ds-auro-accordion-content-border-color:var(--ds-color-border-subtle-default, #f0f7fd)}`;
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(: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,7 +76,7 @@ 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-04-14T23:37:20.783Z
79
+ at 2025-04-23T19:21:10.256Z
80
80
  </div>
81
81
  <script src="prettify.js"></script>
82
82
  <script>
@@ -63,14 +63,14 @@
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 '7.0.1'</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.0.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-04-14T23:37:20.783Z
73
+ at 2025-04-23T19:21:10.256Z
74
74
  </div>
75
75
  <script src="prettify.js"></script>
76
76
  <script>
@@ -206,7 +206,7 @@
206
206
  <div class='footer quiet pad2 space-top1 center small'>
207
207
  Code coverage generated by
208
208
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
209
- at 2025-04-14T23:37:20.783Z
209
+ at 2025-04-23T19:21:10.256Z
210
210
  </div>
211
211
  <script src="prettify.js"></script>
212
212
  <script>
@@ -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`:focus:not(:focus-visible){outline:3px solid transparent}:host{border:unset}:host .auro-button{all:unset;width:100%;padding:var(--ds-size-200, 1rem) 0;cursor:pointer;pointer-events:none}:host .auro-button:after{border-color:transparent}:host .contentWrapper{display:flex;flex-direction:row-reverse}:host .textSlot{display:flex;flex:1}:host(.sm) .auro-button{padding:var(--ds-size-100, 0.5rem) 0}:host(.lg) .auro-button{padding:calc(var(--ds-size-200, 1rem) + var(--ds-size-50, 0.25rem)) 0}:host([fluid]) .contentWrapper{width:100%}:host(.iconRight) .contentWrapper{display:flex;flex-direction:row}`;
71
+ export default css`:focus:not(:focus-visible){outline:3px solid transparent}:host{border:unset}:host .auroButton{all:unset;width:100%;padding:var(--ds-size-200, 1rem) 0;cursor:pointer;pointer-events:none}:host .auroButton:focus,:host .auroButton:focus-visible,:host .auroButton:focus-within{outline:0}:host .auroButton:after{border-color:transparent}:host .contentWrapper{display:flex;flex-direction:row-reverse}:host .textSlot{display:flex;flex:1}:host(.sm) .auro-button{padding:var(--ds-size-100, 0.5rem) 0}:host(.lg) .auro-button{padding:calc(var(--ds-size-200, 1rem) + var(--ds-size-50, 0.25rem)) 0}:host([fluid]) .contentWrapper{width:100%}:host(.iconRight) .contentWrapper{display:flex;flex-direction:row}`;
72
72
  &nbsp;</pre></td></tr></table></pre>
73
73
 
74
74
  <div class='push'></div><!-- for sticky footer -->
@@ -76,7 +76,7 @@ export default css`:focus:not(:focus-visible){outline:3px solid transparent}:hos
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-04-14T23:37:20.783Z
79
+ at 2025-04-23T19:21:10.256Z
80
80
  </div>
81
81
  <script src="prettify.js"></script>
82
82
  <script>
@@ -76,7 +76,7 @@ export default css`:host{interpolate-size:allow-keywords}:host .trigger{position
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-04-14T23:37:20.783Z
79
+ at 2025-04-23T19:21:10.256Z
80
80
  </div>
81
81
  <script src="prettify.js"></script>
82
82
  <script>
@@ -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{--ds-auro-accordion-content-border-color:transparent;--ds-auro-accordion-group-border-color:var(--ds-color-border-divider-default, rgba(0, 0, 0, 0.12));--ds-auro-accordion-trigger-border-color:transparent;--ds-auro-accordion-trigger-color:var(--ds-color-text-primary-default, #2a2a2a);--ds-auro-accordion-trigger-icon-color:var(--ds-color-icon-ui-secondary-default-default, #7e7e7e)}`;
71
+ export default css`:host{--ds-auro-accordion-content-border-color:transparent;--ds-auro-accordion-group-border-color:var(--ds-basic-color-border-divider, rgba(0, 0, 0, 0.15));--ds-auro-accordion-trigger-border-color:transparent;--ds-auro-accordion-trigger-color:var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-accordion-trigger-icon-color:var(--ds-basic-color-texticon-default, #2a2a2a)}`;
72
72
  &nbsp;</pre></td></tr></table></pre>
73
73
 
74
74
  <div class='push'></div><!-- for sticky footer -->
@@ -76,7 +76,7 @@ export default css`:host{--ds-auro-accordion-content-border-color:transparent;--
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-04-14T23:37:20.783Z
79
+ at 2025-04-23T19:21:10.256Z
80
80
  </div>
81
81
  <script src="prettify.js"></script>
82
82
  <script>
package/demo/api.md CHANGED
@@ -933,14 +933,14 @@ The component may be restyled using the following code sample and changing the v
933
933
  <!-- The below code snippet is automatically added from ./../src/tokens.scss -->
934
934
 
935
935
  ```scss
936
- @import "./../node_modules/@aurodesignsystem/design-tokens/dist/auro-classic/SCSSVariables";
936
+ @import "./../node_modules/@aurodesignsystem/design-tokens/dist/alaska/SCSSVariables--alaska";
937
937
 
938
938
  :host {
939
939
  --ds-auro-accordion-content-border-color: transparent;
940
- --ds-auro-accordion-group-border-color: var(--ds-color-border-divider-default, #{$ds-color-border-divider-default});
940
+ --ds-auro-accordion-group-border-color: var(--ds-basic-color-border-divider, #{$ds-basic-color-border-divider});
941
941
  --ds-auro-accordion-trigger-border-color: transparent;
942
- --ds-auro-accordion-trigger-color: var(--ds-color-text-primary-default, #{$ds-color-text-primary-default});
943
- --ds-auro-accordion-trigger-icon-color: var(--ds-color-icon-ui-secondary-default-default, #{$ds-color-icon-ui-secondary-default-default});
942
+ --ds-auro-accordion-trigger-color: var(--ds-basic-color-texticon-default, #{$ds-basic-color-texticon-default});
943
+ --ds-auro-accordion-trigger-icon-color: var(--ds-basic-color-texticon-default, #{$ds-basic-color-texticon-default});
944
944
  }
945
945
  ```
946
946
  <!-- AURO-GENERATED-CONTENT:END -->