@aurodesignsystem/auro-accordion 4.1.0 → 4.2.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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,18 @@
1
1
  # Semantic Release Automated Changelog
2
2
 
3
+ # [4.2.0](https://github.com/AlaskaAirlines/auro-accordion/compare/v4.1.0...v4.2.0) (2024-11-01)
4
+
5
+
6
+ ### Features
7
+
8
+ * apply latest token ds-auro-icon-size [#137](https://github.com/AlaskaAirlines/auro-accordion/issues/137) ([2a2db8c](https://github.com/AlaskaAirlines/auro-accordion/commit/2a2db8cacb2d41e3f73e4a5baae31372f0ec6b8d))
9
+ * update auro-icon package [#137](https://github.com/AlaskaAirlines/auro-accordion/issues/137) ([290612d](https://github.com/AlaskaAirlines/auro-accordion/commit/290612db48525fe62180789011d4fef19cde72dc))
10
+
11
+
12
+ ### Performance Improvements
13
+
14
+ * update dependencies ([9cd201b](https://github.com/AlaskaAirlines/auro-accordion/commit/9cd201b646878aa6ee2d1bf6c678baeb40c652e7))
15
+
3
16
  # [4.1.0](https://github.com/AlaskaAirlines/auro-accordion/compare/v4.0.2...v4.1.0) (2024-10-23)
4
17
 
5
18
 
@@ -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-10-23T23:07:32.416Z
460
+ at 2024-11-01T14:56:23.740Z
461
461
  </div>
462
462
  <script src="prettify.js"></script>
463
463
  <script>
@@ -619,10 +619,10 @@ export class AuroAccordion extends LitElement {
619
619
  aria-expanded="${this.expanded}"
620
620
  @click="${this.toggle}"
621
621
  part="trigger"&gt;
622
- &lt;${this.iconTag} slot="icon" customSvg customSize customColor ?hidden="${!this.expanded}"&gt;
622
+ &lt;${this.iconTag} slot="icon" customSvg customColor ?hidden="${!this.expanded}"&gt;
623
623
  ${this.generateIconHtml(chevronUp.svg)}
624
624
  &lt;/${this.iconTag}&gt;
625
- &lt;${this.iconTag} slot="icon" customSvg customSize customColor ?hidden="${this.expanded}"&gt;
625
+ &lt;${this.iconTag} slot="icon" customSvg customColor ?hidden="${this.expanded}"&gt;
626
626
  ${this.generateIconHtml(chevronDown.svg)}
627
627
  &lt;/${this.iconTag}&gt;
628
628
  &lt;slot name="trigger" part="triggerSlot"&gt;&lt;/slot&gt;
@@ -643,7 +643,7 @@ export class AuroAccordion extends LitElement {
643
643
  <div class='footer quiet pad2 space-top1 center small'>
644
644
  Code coverage generated by
645
645
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
646
- at 2024-10-23T23:07:32.416Z
646
+ at 2024-11-01T14:56:23.740Z
647
647
  </div>
648
648
  <script src="prettify.js"></script>
649
649
  <script>
@@ -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 2024-10-23T23:07:32.416Z
79
+ at 2024-11-01T14:56:23.740Z
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 '5.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 '6.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 2024-10-23T23:07:32.416Z
73
+ at 2024-11-01T14:56:23.740Z
74
74
  </div>
75
75
  <script src="prettify.js"></script>
76
76
  <script>
@@ -176,7 +176,7 @@
176
176
  <div class='footer quiet pad2 space-top1 center small'>
177
177
  Code coverage generated by
178
178
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
179
- at 2024-10-23T23:07:32.416Z
179
+ at 2024-11-01T14:56:23.740Z
180
180
  </div>
181
181
  <script src="prettify.js"></script>
182
182
  <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{interpolate-size:allow-keywords}:host .trigger{position:relative;cursor:pointer;display:flex;flex-direction:row;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem)}:host .trigger:hover{text-decoration:underline}:host ::slotted([slot=trigger]){padding-left:var(--ds-size-100, 0.5rem);padding-right:var(--ds-size-200, 1rem);font-size:var(--ds-text-heading-300-size, 1.125rem)}:host .iconWrapper{height:var(--ds-size-300, 1.5rem);margin-top:-2px}:host [auro-icon]{height:var(--ds-size-300, 1.5rem);width:var(--ds-size-300, 1.5rem)}:host [auro-icon][hidden]{display:none}:host .content{width:100%;transition:all .5s ease-in-out;transition-property:height;font-size:var(--ds-text-body-size-default, 1rem)}:host .componentWrapper{height:100%;overflow:hidden}:host .contentWrapper{padding-left:var(--ds-size-400, 2rem);padding-bottom:var(--ds-size-300, 1.5rem);padding-right:var(--ds-size-200, 1rem)}:host(:focus) .trigger{border-width:1px;border-style:solid}:host([chevron=right]) ::slotted([slot=trigger]){padding-left:0;padding-right:var(--ds-size-50, 0.25rem)}:host([alignRight]) .componentWrapper{display:flex;flex-direction:column;align-items:flex-end}:host([fluid]) .trigger{width:100%}:host([grouped]) .componentWrapper{border-width:1px;border-style:solid}:host(:not([expanded])) .content,:host([expanded=false]) .content{height:0 !important}:host([expanded]) .content{height:auto}:host([emphasis]) .trigger{border-style:solid;border-width:1px;border-left-width:2px;padding-left:var(--ds-size-200, 1rem)}:host([emphasis]) .trigger:before{display:block;position:absolute;top:-1px;left:-2px;width:1px;height:calc(100% + 2px);content:"";border-left-style:solid;border-left-width:2px}:host([emphasis]) .trigger:focus{border-left-width:1px;margin-left:1px}:host([emphasis]) .content{border-left-width:2px;border-left-style:solid;padding:unset}:host([emphasis]) .contentWrapper{padding-left:var(--ds-size-200, 1rem)}:host([emphasis]) .iconWrapper{padding-right:var(--ds-size-200, 1rem)}:host([emphasis]:not([expanded]):hover) .trigger{text-decoration:unset}:host([variant=sm]) ::slotted([slot=trigger]){font-size:var(--ds-text-body-size-default, 1rem)}:host([variant=lg]) ::slotted([slot=trigger]){font-size:var(--ds-text-heading-400-size, 1.25rem)}:host([chevron=none]) ::slotted([slot=trigger]),:host([chevron=none]) .contentWrapper{padding-left:unset}`;
71
+ export default css`:host{interpolate-size:allow-keywords}:host .trigger{position:relative;cursor:pointer;display:flex;flex-direction:row;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem)}:host .trigger:hover{text-decoration:underline}:host ::slotted([slot=trigger]){padding-left:var(--ds-size-100, 0.5rem);padding-right:var(--ds-size-200, 1rem);font-size:var(--ds-text-heading-300-size, 1.125rem)}:host .iconWrapper{height:var(--ds-size-300, 1.5rem);margin-top:-2px}:host [auro-icon]{--ds-auro-icon-size: var(--ds-size-300,$ds-size-300)}:host [auro-icon][hidden]{display:none}:host .content{width:100%;transition:all .5s ease-in-out;transition-property:height;font-size:var(--ds-text-body-size-default, 1rem)}:host .componentWrapper{height:100%;overflow:hidden}:host .contentWrapper{padding-left:var(--ds-size-400, 2rem);padding-bottom:var(--ds-size-300, 1.5rem);padding-right:var(--ds-size-200, 1rem)}:host(:focus) .trigger{border-width:1px;border-style:solid}:host([chevron=right]) ::slotted([slot=trigger]){padding-left:0;padding-right:var(--ds-size-50, 0.25rem)}:host([alignRight]) .componentWrapper{display:flex;flex-direction:column;align-items:flex-end}:host([fluid]) .trigger{width:100%}:host([grouped]) .componentWrapper{border-width:1px;border-style:solid}:host(:not([expanded])) .content,:host([expanded=false]) .content{height:0 !important}:host([expanded]) .content{height:auto}:host([emphasis]) .trigger{border-style:solid;border-width:1px;border-left-width:2px;padding-left:var(--ds-size-200, 1rem)}:host([emphasis]) .trigger:before{display:block;position:absolute;top:-1px;left:-2px;width:1px;height:calc(100% + 2px);content:"";border-left-style:solid;border-left-width:2px}:host([emphasis]) .trigger:focus{border-left-width:1px;margin-left:1px}:host([emphasis]) .content{border-left-width:2px;border-left-style:solid;padding:unset}:host([emphasis]) .contentWrapper{padding-left:var(--ds-size-200, 1rem)}:host([emphasis]) .iconWrapper{padding-right:var(--ds-size-200, 1rem)}:host([emphasis]:not([expanded]):hover) .trigger{text-decoration:unset}:host([variant=sm]) ::slotted([slot=trigger]){font-size:var(--ds-text-body-size-default, 1rem)}:host([variant=lg]) ::slotted([slot=trigger]){font-size:var(--ds-text-heading-400-size, 1.25rem)}:host([chevron=none]) ::slotted([slot=trigger]),:host([chevron=none]) .contentWrapper{padding-left:unset}`;
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{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 2024-10-23T23:07:32.416Z
79
+ at 2024-11-01T14:56:23.740Z
80
80
  </div>
81
81
  <script src="prettify.js"></script>
82
82
  <script>
@@ -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 2024-10-23T23:07:32.416Z
79
+ at 2024-11-01T14:56:23.740Z
80
80
  </div>
81
81
  <script src="prettify.js"></script>
82
82
  <script>
package/demo/api.min.js CHANGED
@@ -22,9 +22,9 @@ function expandedExample() {
22
22
  });
23
23
  }
24
24
 
25
- var iconVersion = '5.0.2';
25
+ var iconVersion = '6.0.1';
26
26
 
27
- var styleCss = css`:host{interpolate-size:allow-keywords}:host .trigger{position:relative;cursor:pointer;display:flex;flex-direction:row;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem)}:host .trigger:hover{text-decoration:underline}:host ::slotted([slot=trigger]){padding-left:var(--ds-size-100, 0.5rem);padding-right:var(--ds-size-200, 1rem);font-size:var(--ds-text-heading-300-size, 1.125rem)}:host .iconWrapper{height:var(--ds-size-300, 1.5rem);margin-top:-2px}:host [auro-icon]{height:var(--ds-size-300, 1.5rem);width:var(--ds-size-300, 1.5rem)}:host [auro-icon][hidden]{display:none}:host .content{width:100%;transition:all .5s ease-in-out;transition-property:height;font-size:var(--ds-text-body-size-default, 1rem)}:host .componentWrapper{height:100%;overflow:hidden}:host .contentWrapper{padding-left:var(--ds-size-400, 2rem);padding-bottom:var(--ds-size-300, 1.5rem);padding-right:var(--ds-size-200, 1rem)}:host(:focus) .trigger{border-width:1px;border-style:solid}:host([chevron=right]) ::slotted([slot=trigger]){padding-left:0;padding-right:var(--ds-size-50, 0.25rem)}:host([alignRight]) .componentWrapper{display:flex;flex-direction:column;align-items:flex-end}:host([fluid]) .trigger{width:100%}:host([grouped]) .componentWrapper{border-width:1px;border-style:solid}:host(:not([expanded])) .content,:host([expanded=false]) .content{height:0 !important}:host([expanded]) .content{height:auto}:host([emphasis]) .trigger{border-style:solid;border-width:1px;border-left-width:2px;padding-left:var(--ds-size-200, 1rem)}:host([emphasis]) .trigger:before{display:block;position:absolute;top:-1px;left:-2px;width:1px;height:calc(100% + 2px);content:"";border-left-style:solid;border-left-width:2px}:host([emphasis]) .trigger:focus{border-left-width:1px;margin-left:1px}:host([emphasis]) .content{border-left-width:2px;border-left-style:solid;padding:unset}:host([emphasis]) .contentWrapper{padding-left:var(--ds-size-200, 1rem)}:host([emphasis]) .iconWrapper{padding-right:var(--ds-size-200, 1rem)}:host([emphasis]:not([expanded]):hover) .trigger{text-decoration:unset}:host([variant=sm]) ::slotted([slot=trigger]){font-size:var(--ds-text-body-size-default, 1rem)}:host([variant=lg]) ::slotted([slot=trigger]){font-size:var(--ds-text-heading-400-size, 1.25rem)}:host([chevron=none]) ::slotted([slot=trigger]),:host([chevron=none]) .contentWrapper{padding-left:unset}`;
27
+ var styleCss = css`:host{interpolate-size:allow-keywords}:host .trigger{position:relative;cursor:pointer;display:flex;flex-direction:row;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem)}:host .trigger:hover{text-decoration:underline}:host ::slotted([slot=trigger]){padding-left:var(--ds-size-100, 0.5rem);padding-right:var(--ds-size-200, 1rem);font-size:var(--ds-text-heading-300-size, 1.125rem)}:host .iconWrapper{height:var(--ds-size-300, 1.5rem);margin-top:-2px}:host [auro-icon]{--ds-auro-icon-size: var(--ds-size-300,$ds-size-300)}:host [auro-icon][hidden]{display:none}:host .content{width:100%;transition:all .5s ease-in-out;transition-property:height;font-size:var(--ds-text-body-size-default, 1rem)}:host .componentWrapper{height:100%;overflow:hidden}:host .contentWrapper{padding-left:var(--ds-size-400, 2rem);padding-bottom:var(--ds-size-300, 1.5rem);padding-right:var(--ds-size-200, 1rem)}:host(:focus) .trigger{border-width:1px;border-style:solid}:host([chevron=right]) ::slotted([slot=trigger]){padding-left:0;padding-right:var(--ds-size-50, 0.25rem)}:host([alignRight]) .componentWrapper{display:flex;flex-direction:column;align-items:flex-end}:host([fluid]) .trigger{width:100%}:host([grouped]) .componentWrapper{border-width:1px;border-style:solid}:host(:not([expanded])) .content,:host([expanded=false]) .content{height:0 !important}:host([expanded]) .content{height:auto}:host([emphasis]) .trigger{border-style:solid;border-width:1px;border-left-width:2px;padding-left:var(--ds-size-200, 1rem)}:host([emphasis]) .trigger:before{display:block;position:absolute;top:-1px;left:-2px;width:1px;height:calc(100% + 2px);content:"";border-left-style:solid;border-left-width:2px}:host([emphasis]) .trigger:focus{border-left-width:1px;margin-left:1px}:host([emphasis]) .content{border-left-width:2px;border-left-style:solid;padding:unset}:host([emphasis]) .contentWrapper{padding-left:var(--ds-size-200, 1rem)}:host([emphasis]) .iconWrapper{padding-right:var(--ds-size-200, 1rem)}:host([emphasis]:not([expanded]):hover) .trigger{text-decoration:unset}:host([variant=sm]) ::slotted([slot=trigger]){font-size:var(--ds-text-body-size-default, 1rem)}:host([variant=lg]) ::slotted([slot=trigger]){font-size:var(--ds-text-heading-400-size, 1.25rem)}:host([chevron=none]) ::slotted([slot=trigger]),:host([chevron=none]) .contentWrapper{padding-left:unset}`;
28
28
 
29
29
  var colorCss = 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-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)}`;
30
30
 
@@ -182,10 +182,10 @@ class AuroAccordion extends LitElement {
182
182
  aria-expanded="${this.expanded}"
183
183
  @click="${this.toggle}"
184
184
  part="trigger">
185
- <${this.iconTag} slot="icon" customSvg customSize customColor ?hidden="${!this.expanded}">
185
+ <${this.iconTag} slot="icon" customSvg customColor ?hidden="${!this.expanded}">
186
186
  ${this.generateIconHtml(chevronUp.svg)}
187
187
  </${this.iconTag}>
188
- <${this.iconTag} slot="icon" customSvg customSize customColor ?hidden="${this.expanded}">
188
+ <${this.iconTag} slot="icon" customSvg customColor ?hidden="${this.expanded}">
189
189
  ${this.generateIconHtml(chevronDown.svg)}
190
190
  </${this.iconTag}>
191
191
  <slot name="trigger" part="triggerSlot"></slot>
package/demo/index.min.js CHANGED
@@ -10,9 +10,9 @@ import chevronDown from '@alaskaairux/icons/dist/icons/interface/chevron-down.mj
10
10
  import styleCssAuroButton from '@aurodesignsystem/auro-button/src/style-css.js';
11
11
  import { AuroButton } from '@aurodesignsystem/auro-button/src/auro-button.js';
12
12
 
13
- var iconVersion = '5.0.2';
13
+ var iconVersion = '6.0.1';
14
14
 
15
- var styleCss = css`:host{interpolate-size:allow-keywords}:host .trigger{position:relative;cursor:pointer;display:flex;flex-direction:row;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem)}:host .trigger:hover{text-decoration:underline}:host ::slotted([slot=trigger]){padding-left:var(--ds-size-100, 0.5rem);padding-right:var(--ds-size-200, 1rem);font-size:var(--ds-text-heading-300-size, 1.125rem)}:host .iconWrapper{height:var(--ds-size-300, 1.5rem);margin-top:-2px}:host [auro-icon]{height:var(--ds-size-300, 1.5rem);width:var(--ds-size-300, 1.5rem)}:host [auro-icon][hidden]{display:none}:host .content{width:100%;transition:all .5s ease-in-out;transition-property:height;font-size:var(--ds-text-body-size-default, 1rem)}:host .componentWrapper{height:100%;overflow:hidden}:host .contentWrapper{padding-left:var(--ds-size-400, 2rem);padding-bottom:var(--ds-size-300, 1.5rem);padding-right:var(--ds-size-200, 1rem)}:host(:focus) .trigger{border-width:1px;border-style:solid}:host([chevron=right]) ::slotted([slot=trigger]){padding-left:0;padding-right:var(--ds-size-50, 0.25rem)}:host([alignRight]) .componentWrapper{display:flex;flex-direction:column;align-items:flex-end}:host([fluid]) .trigger{width:100%}:host([grouped]) .componentWrapper{border-width:1px;border-style:solid}:host(:not([expanded])) .content,:host([expanded=false]) .content{height:0 !important}:host([expanded]) .content{height:auto}:host([emphasis]) .trigger{border-style:solid;border-width:1px;border-left-width:2px;padding-left:var(--ds-size-200, 1rem)}:host([emphasis]) .trigger:before{display:block;position:absolute;top:-1px;left:-2px;width:1px;height:calc(100% + 2px);content:"";border-left-style:solid;border-left-width:2px}:host([emphasis]) .trigger:focus{border-left-width:1px;margin-left:1px}:host([emphasis]) .content{border-left-width:2px;border-left-style:solid;padding:unset}:host([emphasis]) .contentWrapper{padding-left:var(--ds-size-200, 1rem)}:host([emphasis]) .iconWrapper{padding-right:var(--ds-size-200, 1rem)}:host([emphasis]:not([expanded]):hover) .trigger{text-decoration:unset}:host([variant=sm]) ::slotted([slot=trigger]){font-size:var(--ds-text-body-size-default, 1rem)}:host([variant=lg]) ::slotted([slot=trigger]){font-size:var(--ds-text-heading-400-size, 1.25rem)}:host([chevron=none]) ::slotted([slot=trigger]),:host([chevron=none]) .contentWrapper{padding-left:unset}`;
15
+ var styleCss = css`:host{interpolate-size:allow-keywords}:host .trigger{position:relative;cursor:pointer;display:flex;flex-direction:row;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem)}:host .trigger:hover{text-decoration:underline}:host ::slotted([slot=trigger]){padding-left:var(--ds-size-100, 0.5rem);padding-right:var(--ds-size-200, 1rem);font-size:var(--ds-text-heading-300-size, 1.125rem)}:host .iconWrapper{height:var(--ds-size-300, 1.5rem);margin-top:-2px}:host [auro-icon]{--ds-auro-icon-size: var(--ds-size-300,$ds-size-300)}:host [auro-icon][hidden]{display:none}:host .content{width:100%;transition:all .5s ease-in-out;transition-property:height;font-size:var(--ds-text-body-size-default, 1rem)}:host .componentWrapper{height:100%;overflow:hidden}:host .contentWrapper{padding-left:var(--ds-size-400, 2rem);padding-bottom:var(--ds-size-300, 1.5rem);padding-right:var(--ds-size-200, 1rem)}:host(:focus) .trigger{border-width:1px;border-style:solid}:host([chevron=right]) ::slotted([slot=trigger]){padding-left:0;padding-right:var(--ds-size-50, 0.25rem)}:host([alignRight]) .componentWrapper{display:flex;flex-direction:column;align-items:flex-end}:host([fluid]) .trigger{width:100%}:host([grouped]) .componentWrapper{border-width:1px;border-style:solid}:host(:not([expanded])) .content,:host([expanded=false]) .content{height:0 !important}:host([expanded]) .content{height:auto}:host([emphasis]) .trigger{border-style:solid;border-width:1px;border-left-width:2px;padding-left:var(--ds-size-200, 1rem)}:host([emphasis]) .trigger:before{display:block;position:absolute;top:-1px;left:-2px;width:1px;height:calc(100% + 2px);content:"";border-left-style:solid;border-left-width:2px}:host([emphasis]) .trigger:focus{border-left-width:1px;margin-left:1px}:host([emphasis]) .content{border-left-width:2px;border-left-style:solid;padding:unset}:host([emphasis]) .contentWrapper{padding-left:var(--ds-size-200, 1rem)}:host([emphasis]) .iconWrapper{padding-right:var(--ds-size-200, 1rem)}:host([emphasis]:not([expanded]):hover) .trigger{text-decoration:unset}:host([variant=sm]) ::slotted([slot=trigger]){font-size:var(--ds-text-body-size-default, 1rem)}:host([variant=lg]) ::slotted([slot=trigger]){font-size:var(--ds-text-heading-400-size, 1.25rem)}:host([chevron=none]) ::slotted([slot=trigger]),:host([chevron=none]) .contentWrapper{padding-left:unset}`;
16
16
 
17
17
  var colorCss = 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-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)}`;
18
18
 
@@ -170,10 +170,10 @@ class AuroAccordion extends LitElement {
170
170
  aria-expanded="${this.expanded}"
171
171
  @click="${this.toggle}"
172
172
  part="trigger">
173
- <${this.iconTag} slot="icon" customSvg customSize customColor ?hidden="${!this.expanded}">
173
+ <${this.iconTag} slot="icon" customSvg customColor ?hidden="${!this.expanded}">
174
174
  ${this.generateIconHtml(chevronUp.svg)}
175
175
  </${this.iconTag}>
176
- <${this.iconTag} slot="icon" customSvg customSize customColor ?hidden="${this.expanded}">
176
+ <${this.iconTag} slot="icon" customSvg customColor ?hidden="${this.expanded}">
177
177
  ${this.generateIconHtml(chevronDown.svg)}
178
178
  </${this.iconTag}>
179
179
  <slot name="trigger" part="triggerSlot"></slot>
@@ -226,7 +226,7 @@ const cacheFetch = (uri, options = {}) => {
226
226
  return _fetchMap.get(uri);
227
227
  };
228
228
 
229
- var styleCss$2 = i$5`*,*:before,*:after{box-sizing:border-box}@media(prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}*:focus-visible{outline:0}*:focus-visible{outline:0}:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.ico_squareLarge{fill:currentColor;height:var(--auro-size-lg, var(--ds-size-300, 1.5rem))}.ico_squareSmall{fill:currentColor;height:.6rem}.ico_squareMed{fill:currentColor;height:var(--auro-size-md, var(--ds-size-200, 1rem))}.ico_squareSml{fill:currentColor;height:var(--auro-size-sm, var(--ds-size-150, 0.75rem))}:host{color:currentColor;vertical-align:middle;line-height:1;display:inline-block}:host .logo{color:var(--ds-color-brand-midnight-400, #01426a)}:host([customSize]){--auro-size-lg:100%;--ds-size-300: 100%;width:100%;height:100%}.label{display:flex;align-items:flex-start}.label svg{margin:0 var(--ds-size-50, 0.25rem)}.labelContainer{line-height:1.8}`;
229
+ var styleCss$2 = i$5`*,*:before,*:after{box-sizing:border-box}@media(prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}*:focus-visible{outline:0}*:focus-visible{outline:0}:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.ico_squareLarge{fill:currentColor;height:var(--auro-size-lg, var(--ds-size-300, 1.5rem))}.ico_squareSmall{fill:currentColor;height:.6rem}.ico_squareMed{fill:currentColor;height:var(--auro-size-md, var(--ds-size-200, 1rem))}.ico_squareSml{fill:currentColor;height:var(--auro-size-sm, var(--ds-size-150, 0.75rem))}:host{color:currentColor;vertical-align:middle;line-height:1;display:inline-block}:host .logo{color:var(--ds-color-brand-midnight-400, #01426a)}svg{min-width:var(--ds-auro-icon-size, 1.5rem) !important;width:var(--ds-auro-icon-size, 1.5rem) !important;height:var(--ds-auro-icon-size, 1.5rem) !important}.label{display:flex;align-items:flex-start}.label svg{margin:0 var(--ds-size-50, 0.25rem)}.labelContainer{line-height:1.8}`;
230
230
 
231
231
  // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
232
232
  // See LICENSE in the project root for license information.
@@ -307,7 +307,7 @@ class BaseIcon extends AuroElement {
307
307
  }
308
308
  }
309
309
 
310
- var tokensCss$3 = i$5`:host{--ds-auro-icon-color: var(--ds-color-icon-primary-default, $ds-color-icon-primary-default)}`;
310
+ var tokensCss$3 = i$5`:host{--ds-auro-icon-color: var(--ds-color-icon-primary-default, $ds-color-icon-primary-default);--ds-auro-icon-size: var(--ds-size-300, $ds-size-300)}`;
311
311
 
312
312
  var colorCss$3 = i$5`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[accent]){--ds-auro-icon-color: var(--ds-color-icon-accent-default, #a2c270)}:host(:not([onDark])[disabled]){--ds-auro-icon-color: var(--ds-color-icon-ui-primary-disabled-default, #adadad)}:host(:not([onDark])[emphasis]){--ds-auro-icon-color: var(--ds-color-icon-emphasis-default, #2a2a2a)}:host(:not([onDark])[error]){--ds-auro-icon-color: var(--ds-color-icon-error-default, #cc1816)}:host(:not([onDark])[info]){--ds-auro-icon-color: var(--ds-color-icon-info-default, #326aa5)}:host(:not([onDark])[secondary]){--ds-auro-icon-color: var(--ds-color-icon-secondary-default, #7e8894)}:host(:not([onDark])[subtle]){--ds-auro-icon-color: var(--ds-color-icon-subtle-default, #a0c9f1)}:host(:not([onDark])[success]){--ds-auro-icon-color: var(--ds-color-icon-success-default, #40a080)}:host(:not([onDark])[tertiary]){--ds-auro-icon-color: var(--ds-color-icon-tertiary-default, #afb9c6)}:host(:not([onDark])[warning]){--ds-auro-icon-color: var(--ds-color-icon-warning-default, #c49432)}:host([onDark]){--ds-auro-icon-color: var(--ds-color-icon-primary-inverse, #f7f7f7)}:host([onDark][accent]){--ds-auro-icon-color: var(--ds-color-icon-accent-inverse, #badd81)}:host([onDark][disabled]){--ds-auro-icon-color: var(--ds-color-icon-ui-primary-disabled-inverse, #7e7e7e)}:host([onDark][emphasis]){--ds-auro-icon-color: var(--ds-color-icon-emphasis-inverse, #ffffff)}:host([onDark][error]){--ds-auro-icon-color: var(--ds-color-icon-error-inverse, #f9aca6)}:host([onDark][info]){--ds-auro-icon-color: var(--ds-color-icon-info-inverse, #89b2d4)}:host([onDark][secondary]){--ds-auro-icon-color: var(--ds-color-icon-secondary-inverse, #ccd2db)}:host([onDark][subtle]){--ds-auro-icon-color: var(--ds-color-icon-subtle-inverse, #326aa5)}:host([onDark][success]){--ds-auro-icon-color: var(--ds-color-icon-success-inverse, #8eceb9)}:host([onDark][tertiary]){--ds-auro-icon-color: var(--ds-color-icon-tertiary-inverse, #939fad)}:host([onDark][warning]){--ds-auro-icon-color: var(--ds-color-icon-warning-inverse, #f2c153)}`;
313
313
 
@@ -319,7 +319,6 @@ var colorCss$3 = i$5`:host{color:var(--ds-auro-icon-color)}:host([customColor]){
319
319
  /**
320
320
  * auro-icon provides users a way to use the Auro Icons by simply passing in the category and name.
321
321
  *
322
- * @attr {Boolean} customSize - Allows for custom size use.
323
322
  * @attr {String} category - The category of the icon you are looking for. See https://auro.alaskaair.com/icons/usage.
324
323
  * @attr {String} name - The name of the icon you are looking for without the file extension. See https://auro.alaskaair.com/icons/usage
325
324
  * @attr {Boolean} customColor - Removes primary selector.
@@ -460,6 +459,18 @@ class AuroIcon extends BaseIcon {
460
459
  ];
461
460
  }
462
461
 
462
+ /**
463
+ * This will register this element with the browser.
464
+ * @param {string} [name="auro-icon"] - The name of element that you want to register to.
465
+ *
466
+ * @example
467
+ * AuroIcon.register("custom-icon") // this will register this element to <custom-icon/>
468
+ *
469
+ */
470
+ static register(name = "auro-icon") {
471
+ AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroIcon);
472
+ }
473
+
463
474
  connectedCallback() {
464
475
  super.connectedCallback();
465
476
 
@@ -499,18 +510,13 @@ class AuroIcon extends BaseIcon {
499
510
  }
500
511
  }
501
512
 
502
- // default internal definition
503
- if (!customElements.get("auro-icon")) {
504
- customElements.define("auro-icon", AuroIcon);
505
- }
506
-
507
- var iconVersion = '5.0.2';
513
+ var iconVersion = '6.0.1';
508
514
 
509
515
  var chevronUp = {"role":"img","color":"currentColor","title":"","desc":"Directional indicator; up.","width":"var(--auro-size-lg, var(--ds-size-300, 1.5rem))","height":"var(--auro-size-lg, var(--ds-size-300, 1.5rem))","xmlns":"http://www.w3.org/2000/svg","xmlns_xlink":"http://www.w3.org/1999/xlink","viewBox":"0 0 24 24","path":"/icons","style":"ico_squareLarge","type":"icon","name":"chevron-up","category":"interface","svg":"<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" aria-labelledby=\"chevron-up__desc\" class=\"ico_squareLarge\" role=\"img\" style=\"min-width:var(--auro-size-lg, var(--ds-size-300, 1.5rem));height:var(--auro-size-lg, var(--ds-size-300, 1.5rem));fill:currentColor\" viewBox=\"0 0 24 24\" part=\"svg\"><title/><desc id=\"chevron-up__desc\">Directional indicator; up.</desc><path d=\"m17.603 14.343-.073.084a.75.75 0 0 1-.976.073l-.084-.073L12 9.957l-4.47 4.47a.75.75 0 0 1-.976.073l-.084-.073a.75.75 0 0 1-.073-.976l.073-.085 4.823-4.823a1 1 0 0 1 1.414 0l4.823 4.823a.75.75 0 0 1 .073.977\"/></svg>"};
510
516
 
511
517
  var chevronDown = {"role":"img","color":"currentColor","title":"","desc":"Directional indicator; down.","width":"var(--auro-size-lg, var(--ds-size-300, 1.5rem))","height":"var(--auro-size-lg, var(--ds-size-300, 1.5rem))","xmlns":"http://www.w3.org/2000/svg","xmlns_xlink":"http://www.w3.org/1999/xlink","viewBox":"0 0 24 24","path":"/icons","style":"ico_squareLarge","type":"icon","name":"chevron-down","category":"interface","svg":"<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" aria-labelledby=\"chevron-down__desc\" class=\"ico_squareLarge\" role=\"img\" style=\"min-width:var(--auro-size-lg, var(--ds-size-300, 1.5rem));height:var(--auro-size-lg, var(--ds-size-300, 1.5rem));fill:currentColor\" viewBox=\"0 0 24 24\" part=\"svg\"><title/><desc id=\"chevron-down__desc\">Directional indicator; down.</desc><path d=\"m6.397 9.554.073-.084a.75.75 0 0 1 .976-.073l.084.073L12 13.939l4.47-4.47a.75.75 0 0 1 .976-.072l.084.073a.75.75 0 0 1 .073.976l-.073.084L13.061 15l-.354.354a1 1 0 0 1-1.414 0L10.939 15l-4.47-4.47a.75.75 0 0 1-.072-.976l.073-.084z\"/></svg>"};
512
518
 
513
- var styleCss$1 = i$5`:host{interpolate-size:allow-keywords}:host .trigger{position:relative;cursor:pointer;display:flex;flex-direction:row;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem)}:host .trigger:hover{text-decoration:underline}:host ::slotted([slot=trigger]){padding-left:var(--ds-size-100, 0.5rem);padding-right:var(--ds-size-200, 1rem);font-size:var(--ds-text-heading-300-size, 1.125rem)}:host .iconWrapper{height:var(--ds-size-300, 1.5rem);margin-top:-2px}:host [auro-icon]{height:var(--ds-size-300, 1.5rem);width:var(--ds-size-300, 1.5rem)}:host [auro-icon][hidden]{display:none}:host .content{width:100%;transition:all .5s ease-in-out;transition-property:height;font-size:var(--ds-text-body-size-default, 1rem)}:host .componentWrapper{height:100%;overflow:hidden}:host .contentWrapper{padding-left:var(--ds-size-400, 2rem);padding-bottom:var(--ds-size-300, 1.5rem);padding-right:var(--ds-size-200, 1rem)}:host(:focus) .trigger{border-width:1px;border-style:solid}:host([chevron=right]) ::slotted([slot=trigger]){padding-left:0;padding-right:var(--ds-size-50, 0.25rem)}:host([alignRight]) .componentWrapper{display:flex;flex-direction:column;align-items:flex-end}:host([fluid]) .trigger{width:100%}:host([grouped]) .componentWrapper{border-width:1px;border-style:solid}:host(:not([expanded])) .content,:host([expanded=false]) .content{height:0 !important}:host([expanded]) .content{height:auto}:host([emphasis]) .trigger{border-style:solid;border-width:1px;border-left-width:2px;padding-left:var(--ds-size-200, 1rem)}:host([emphasis]) .trigger:before{display:block;position:absolute;top:-1px;left:-2px;width:1px;height:calc(100% + 2px);content:"";border-left-style:solid;border-left-width:2px}:host([emphasis]) .trigger:focus{border-left-width:1px;margin-left:1px}:host([emphasis]) .content{border-left-width:2px;border-left-style:solid;padding:unset}:host([emphasis]) .contentWrapper{padding-left:var(--ds-size-200, 1rem)}:host([emphasis]) .iconWrapper{padding-right:var(--ds-size-200, 1rem)}:host([emphasis]:not([expanded]):hover) .trigger{text-decoration:unset}:host([variant=sm]) ::slotted([slot=trigger]){font-size:var(--ds-text-body-size-default, 1rem)}:host([variant=lg]) ::slotted([slot=trigger]){font-size:var(--ds-text-heading-400-size, 1.25rem)}:host([chevron=none]) ::slotted([slot=trigger]),:host([chevron=none]) .contentWrapper{padding-left:unset}`;
519
+ var styleCss$1 = i$5`:host{interpolate-size:allow-keywords}:host .trigger{position:relative;cursor:pointer;display:flex;flex-direction:row;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem)}:host .trigger:hover{text-decoration:underline}:host ::slotted([slot=trigger]){padding-left:var(--ds-size-100, 0.5rem);padding-right:var(--ds-size-200, 1rem);font-size:var(--ds-text-heading-300-size, 1.125rem)}:host .iconWrapper{height:var(--ds-size-300, 1.5rem);margin-top:-2px}:host [auro-icon]{--ds-auro-icon-size: var(--ds-size-300,$ds-size-300)}:host [auro-icon][hidden]{display:none}:host .content{width:100%;transition:all .5s ease-in-out;transition-property:height;font-size:var(--ds-text-body-size-default, 1rem)}:host .componentWrapper{height:100%;overflow:hidden}:host .contentWrapper{padding-left:var(--ds-size-400, 2rem);padding-bottom:var(--ds-size-300, 1.5rem);padding-right:var(--ds-size-200, 1rem)}:host(:focus) .trigger{border-width:1px;border-style:solid}:host([chevron=right]) ::slotted([slot=trigger]){padding-left:0;padding-right:var(--ds-size-50, 0.25rem)}:host([alignRight]) .componentWrapper{display:flex;flex-direction:column;align-items:flex-end}:host([fluid]) .trigger{width:100%}:host([grouped]) .componentWrapper{border-width:1px;border-style:solid}:host(:not([expanded])) .content,:host([expanded=false]) .content{height:0 !important}:host([expanded]) .content{height:auto}:host([emphasis]) .trigger{border-style:solid;border-width:1px;border-left-width:2px;padding-left:var(--ds-size-200, 1rem)}:host([emphasis]) .trigger:before{display:block;position:absolute;top:-1px;left:-2px;width:1px;height:calc(100% + 2px);content:"";border-left-style:solid;border-left-width:2px}:host([emphasis]) .trigger:focus{border-left-width:1px;margin-left:1px}:host([emphasis]) .content{border-left-width:2px;border-left-style:solid;padding:unset}:host([emphasis]) .contentWrapper{padding-left:var(--ds-size-200, 1rem)}:host([emphasis]) .iconWrapper{padding-right:var(--ds-size-200, 1rem)}:host([emphasis]:not([expanded]):hover) .trigger{text-decoration:unset}:host([variant=sm]) ::slotted([slot=trigger]){font-size:var(--ds-text-body-size-default, 1rem)}:host([variant=lg]) ::slotted([slot=trigger]){font-size:var(--ds-text-heading-400-size, 1.25rem)}:host([chevron=none]) ::slotted([slot=trigger]),:host([chevron=none]) .contentWrapper{padding-left:unset}`;
514
520
 
515
521
  var colorCss$2 = i$5`: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-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)}`;
516
522
 
@@ -668,10 +674,10 @@ class AuroAccordion extends r {
668
674
  aria-expanded="${this.expanded}"
669
675
  @click="${this.toggle}"
670
676
  part="trigger">
671
- <${this.iconTag} slot="icon" customSvg customSize customColor ?hidden="${!this.expanded}">
677
+ <${this.iconTag} slot="icon" customSvg customColor ?hidden="${!this.expanded}">
672
678
  ${this.generateIconHtml(chevronUp.svg)}
673
679
  </${this.iconTag}>
674
- <${this.iconTag} slot="icon" customSvg customSize customColor ?hidden="${this.expanded}">
680
+ <${this.iconTag} slot="icon" customSvg customColor ?hidden="${this.expanded}">
675
681
  ${this.generateIconHtml(chevronDown.svg)}
676
682
  </${this.iconTag}>
677
683
  <slot name="trigger" part="triggerSlot"></slot>
@@ -959,7 +965,7 @@ if (!customElements.get("auro-loader")) {
959
965
  customElements.define("auro-loader", AuroLoader);
960
966
  }
961
967
 
962
- var loaderVersion = '3.0.0';
968
+ var loaderVersion = '3.0.1';
963
969
 
964
970
  // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
965
971
  // See LICENSE in the project root for license information.
@@ -1100,6 +1106,18 @@ class AuroButton extends r {
1100
1106
  };
1101
1107
  }
1102
1108
 
1109
+ /**
1110
+ * This will register this element with the browser.
1111
+ * @param {string} [name="auro-button"] - The name of element that you want to register to.
1112
+ *
1113
+ * @example
1114
+ * AuroButton.register("custom-button") // this will register this element to <custom-button/>
1115
+ *
1116
+ */
1117
+ static register(name = "auro-button") {
1118
+ AuroLibraryRuntimeUtils.prototype.registerComponent(name, AuroButton);
1119
+ }
1120
+
1103
1121
  /**
1104
1122
  * Internal method to apply focus to the HTML5 button.
1105
1123
  * @private
@@ -1182,11 +1200,6 @@ class AuroButton extends r {
1182
1200
  }
1183
1201
  }
1184
1202
 
1185
- // default internal definition
1186
- if (!customElements.get("auro-button")) {
1187
- customElements.define("auro-button", AuroButton);
1188
- }
1189
-
1190
1203
  // Copyright (c) 2022 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
1191
1204
  // See LICENSE in the project root for license information.
1192
1205
 
@@ -1,3 +1,3 @@
1
- declare const _default: "5.0.2";
1
+ declare const _default: "6.0.1";
2
2
  export default _default;
3
3
  //# sourceMappingURL=iconVersion.d.ts.map
package/package.json CHANGED
@@ -7,7 +7,7 @@
7
7
  "================================================================================"
8
8
  ],
9
9
  "name": "@aurodesignsystem/auro-accordion",
10
- "version": "4.1.0",
10
+ "version": "4.2.0",
11
11
  "description": "auro-accordion HTML custom element",
12
12
  "repository": {
13
13
  "type": "git",
@@ -21,8 +21,8 @@
21
21
  },
22
22
  "dependencies": {
23
23
  "@alaskaairux/icons": "^4.44.1",
24
- "@aurodesignsystem/auro-button": "^8.0.1",
25
- "@aurodesignsystem/auro-icon": "^5.0.2",
24
+ "@aurodesignsystem/auro-button": "^8.1.0",
25
+ "@aurodesignsystem/auro-icon": "^6.0.1",
26
26
  "@aurodesignsystem/auro-library": "^2.10.1",
27
27
  "chalk": "^5.3.0",
28
28
  "lit": "^3.2.1"
@@ -32,7 +32,7 @@
32
32
  "@aurodesignsystem/webcorestylesheets": "^5.1.2"
33
33
  },
34
34
  "devDependencies": {
35
- "@aurodesignsystem/design-tokens": "^4.10.0",
35
+ "@aurodesignsystem/design-tokens": "^4.10.1",
36
36
  "@aurodesignsystem/eslint-config": "^1.3.2",
37
37
  "@aurodesignsystem/webcorestylesheets": "^5.1.2",
38
38
  "@commitlint/cli": "^19.5.0",
@@ -60,10 +60,10 @@
60
60
  "postcss": "^8.4.47",
61
61
  "postcss-discard-comments": "^7.0.3",
62
62
  "postcss-selector-replace": "^1.0.2",
63
- "rollup": "^4.24.0",
63
+ "rollup": "^4.24.3",
64
64
  "rollup-plugin-serve": "^2.0.3",
65
- "sass": "^1.80.3",
66
- "semantic-release": "^24.1.3",
65
+ "sass": "^1.80.5",
66
+ "semantic-release": "^24.2.0",
67
67
  "stylelint": "^16.10.0",
68
68
  "stylelint-config-idiomatic-order": "^10.0.0",
69
69
  "stylelint-config-standard": "^36.0.1",
@@ -172,10 +172,10 @@ export class AuroAccordion extends LitElement {
172
172
  aria-expanded="${this.expanded}"
173
173
  @click="${this.toggle}"
174
174
  part="trigger">
175
- <${this.iconTag} slot="icon" customSvg customSize customColor ?hidden="${!this.expanded}">
175
+ <${this.iconTag} slot="icon" customSvg customColor ?hidden="${!this.expanded}">
176
176
  ${this.generateIconHtml(chevronUp.svg)}
177
177
  </${this.iconTag}>
178
- <${this.iconTag} slot="icon" customSvg customSize customColor ?hidden="${this.expanded}">
178
+ <${this.iconTag} slot="icon" customSvg customColor ?hidden="${this.expanded}">
179
179
  ${this.generateIconHtml(chevronDown.svg)}
180
180
  </${this.iconTag}>
181
181
  <slot name="trigger" part="triggerSlot"></slot>
@@ -1 +1 @@
1
- export default '5.0.2'
1
+ export default '6.0.1'
package/src/style-css.js CHANGED
@@ -1,2 +1,2 @@
1
1
  import { css } from 'lit';
2
- export default css`:host{interpolate-size:allow-keywords}:host .trigger{position:relative;cursor:pointer;display:flex;flex-direction:row;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem)}:host .trigger:hover{text-decoration:underline}:host ::slotted([slot=trigger]){padding-left:var(--ds-size-100, 0.5rem);padding-right:var(--ds-size-200, 1rem);font-size:var(--ds-text-heading-300-size, 1.125rem)}:host .iconWrapper{height:var(--ds-size-300, 1.5rem);margin-top:-2px}:host [auro-icon]{height:var(--ds-size-300, 1.5rem);width:var(--ds-size-300, 1.5rem)}:host [auro-icon][hidden]{display:none}:host .content{width:100%;transition:all .5s ease-in-out;transition-property:height;font-size:var(--ds-text-body-size-default, 1rem)}:host .componentWrapper{height:100%;overflow:hidden}:host .contentWrapper{padding-left:var(--ds-size-400, 2rem);padding-bottom:var(--ds-size-300, 1.5rem);padding-right:var(--ds-size-200, 1rem)}:host(:focus) .trigger{border-width:1px;border-style:solid}:host([chevron=right]) ::slotted([slot=trigger]){padding-left:0;padding-right:var(--ds-size-50, 0.25rem)}:host([alignRight]) .componentWrapper{display:flex;flex-direction:column;align-items:flex-end}:host([fluid]) .trigger{width:100%}:host([grouped]) .componentWrapper{border-width:1px;border-style:solid}:host(:not([expanded])) .content,:host([expanded=false]) .content{height:0 !important}:host([expanded]) .content{height:auto}:host([emphasis]) .trigger{border-style:solid;border-width:1px;border-left-width:2px;padding-left:var(--ds-size-200, 1rem)}:host([emphasis]) .trigger:before{display:block;position:absolute;top:-1px;left:-2px;width:1px;height:calc(100% + 2px);content:"";border-left-style:solid;border-left-width:2px}:host([emphasis]) .trigger:focus{border-left-width:1px;margin-left:1px}:host([emphasis]) .content{border-left-width:2px;border-left-style:solid;padding:unset}:host([emphasis]) .contentWrapper{padding-left:var(--ds-size-200, 1rem)}:host([emphasis]) .iconWrapper{padding-right:var(--ds-size-200, 1rem)}:host([emphasis]:not([expanded]):hover) .trigger{text-decoration:unset}:host([variant=sm]) ::slotted([slot=trigger]){font-size:var(--ds-text-body-size-default, 1rem)}:host([variant=lg]) ::slotted([slot=trigger]){font-size:var(--ds-text-heading-400-size, 1.25rem)}:host([chevron=none]) ::slotted([slot=trigger]),:host([chevron=none]) .contentWrapper{padding-left:unset}`;
2
+ export default css`:host{interpolate-size:allow-keywords}:host .trigger{position:relative;cursor:pointer;display:flex;flex-direction:row;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem)}:host .trigger:hover{text-decoration:underline}:host ::slotted([slot=trigger]){padding-left:var(--ds-size-100, 0.5rem);padding-right:var(--ds-size-200, 1rem);font-size:var(--ds-text-heading-300-size, 1.125rem)}:host .iconWrapper{height:var(--ds-size-300, 1.5rem);margin-top:-2px}:host [auro-icon]{--ds-auro-icon-size: var(--ds-size-300,$ds-size-300)}:host [auro-icon][hidden]{display:none}:host .content{width:100%;transition:all .5s ease-in-out;transition-property:height;font-size:var(--ds-text-body-size-default, 1rem)}:host .componentWrapper{height:100%;overflow:hidden}:host .contentWrapper{padding-left:var(--ds-size-400, 2rem);padding-bottom:var(--ds-size-300, 1.5rem);padding-right:var(--ds-size-200, 1rem)}:host(:focus) .trigger{border-width:1px;border-style:solid}:host([chevron=right]) ::slotted([slot=trigger]){padding-left:0;padding-right:var(--ds-size-50, 0.25rem)}:host([alignRight]) .componentWrapper{display:flex;flex-direction:column;align-items:flex-end}:host([fluid]) .trigger{width:100%}:host([grouped]) .componentWrapper{border-width:1px;border-style:solid}:host(:not([expanded])) .content,:host([expanded=false]) .content{height:0 !important}:host([expanded]) .content{height:auto}:host([emphasis]) .trigger{border-style:solid;border-width:1px;border-left-width:2px;padding-left:var(--ds-size-200, 1rem)}:host([emphasis]) .trigger:before{display:block;position:absolute;top:-1px;left:-2px;width:1px;height:calc(100% + 2px);content:"";border-left-style:solid;border-left-width:2px}:host([emphasis]) .trigger:focus{border-left-width:1px;margin-left:1px}:host([emphasis]) .content{border-left-width:2px;border-left-style:solid;padding:unset}:host([emphasis]) .contentWrapper{padding-left:var(--ds-size-200, 1rem)}:host([emphasis]) .iconWrapper{padding-right:var(--ds-size-200, 1rem)}:host([emphasis]:not([expanded]):hover) .trigger{text-decoration:unset}:host([variant=sm]) ::slotted([slot=trigger]){font-size:var(--ds-text-body-size-default, 1rem)}:host([variant=lg]) ::slotted([slot=trigger]){font-size:var(--ds-text-heading-400-size, 1.25rem)}:host([chevron=none]) ::slotted([slot=trigger]),:host([chevron=none]) .contentWrapper{padding-left:unset}`;
package/src/style.css CHANGED
@@ -24,8 +24,7 @@
24
24
  margin-top: -2px;
25
25
  }
26
26
  :host [auro-icon] {
27
- height: var(--ds-size-300, 1.5rem);
28
- width: var(--ds-size-300, 1.5rem);
27
+ --ds-auro-icon-size: var(--ds-size-300,$ds-size-300);
29
28
  }
30
29
  :host [auro-icon][hidden] {
31
30
  display: none;
package/src/style.scss CHANGED
@@ -40,8 +40,7 @@
40
40
  }
41
41
 
42
42
  [auro-icon] {
43
- height: var(--ds-size-300, $ds-size-300);
44
- width: var(--ds-size-300, $ds-size-300);
43
+ --ds-auro-icon-size: var(--ds-size-300,$ds-size-300);
45
44
 
46
45
  &[hidden] { // stylelint-disable-line selector-max-attribute
47
46
  display: none;