@aurodesignsystem/auro-formkit 2.2.1 → 3.0.1

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 (141) hide show
  1. package/CHANGELOG.md +56 -0
  2. package/components/bibtemplate/dist/auro-bibtemplate.d.ts +1 -0
  3. package/components/bibtemplate/dist/iconVersion.d.ts +1 -1
  4. package/components/bibtemplate/dist/index.js +20 -178
  5. package/components/bibtemplate/dist/registered.js +20 -178
  6. package/components/checkbox/README.md +1 -1
  7. package/components/checkbox/demo/api.html +2 -1
  8. package/components/checkbox/demo/api.md +129 -58
  9. package/components/checkbox/demo/api.min.js +41 -8
  10. package/components/checkbox/demo/index.html +2 -1
  11. package/components/checkbox/demo/index.md +116 -50
  12. package/components/checkbox/demo/index.min.js +41 -8
  13. package/components/checkbox/demo/readme.html +2 -1
  14. package/components/checkbox/demo/readme.md +1 -1
  15. package/components/checkbox/dist/auro-checkbox-group.d.ts +8 -0
  16. package/components/checkbox/dist/auro-checkbox.d.ts +8 -0
  17. package/components/checkbox/dist/index.js +41 -8
  18. package/components/checkbox/dist/registered.js +41 -8
  19. package/components/combobox/README.md +1 -1
  20. package/components/combobox/demo/api.html +2 -1
  21. package/components/combobox/demo/api.md +106 -5
  22. package/components/combobox/demo/api.min.js +266 -1001
  23. package/components/combobox/demo/index.html +2 -4
  24. package/components/combobox/demo/index.md +32 -0
  25. package/components/combobox/demo/index.min.js +266 -1001
  26. package/components/combobox/demo/readme.html +2 -1
  27. package/components/combobox/demo/readme.md +1 -1
  28. package/components/combobox/dist/auro-combobox.d.ts +19 -5
  29. package/components/combobox/dist/index.js +236 -811
  30. package/components/combobox/dist/registered.js +236 -811
  31. package/components/counter/README.md +1 -1
  32. package/components/counter/demo/api.html +2 -1
  33. package/components/counter/demo/api.md +29 -10
  34. package/components/counter/demo/api.min.js +189 -781
  35. package/components/counter/demo/index.html +2 -1
  36. package/components/counter/demo/index.md +104 -8
  37. package/components/counter/demo/index.min.js +189 -781
  38. package/components/counter/demo/readme.html +2 -1
  39. package/components/counter/demo/readme.md +1 -1
  40. package/components/counter/dist/auro-counter-group.d.ts +14 -3
  41. package/components/counter/dist/auro-counter.d.ts +1 -0
  42. package/components/counter/dist/iconVersion.d.ts +1 -1
  43. package/components/counter/dist/index.js +189 -781
  44. package/components/counter/dist/registered.js +189 -781
  45. package/components/datepicker/README.md +1 -1
  46. package/components/datepicker/demo/api.html +2 -4
  47. package/components/datepicker/demo/api.md +17 -16
  48. package/components/datepicker/demo/api.min.js +334 -1067
  49. package/components/datepicker/demo/index.html +2 -4
  50. package/components/datepicker/demo/index.md +38 -0
  51. package/components/datepicker/demo/index.min.js +334 -1067
  52. package/components/datepicker/demo/readme.html +2 -1
  53. package/components/datepicker/demo/readme.md +1 -1
  54. package/components/datepicker/dist/auro-calendar-cell.d.ts +1 -0
  55. package/components/datepicker/dist/auro-calendar-month.d.ts +1 -0
  56. package/components/datepicker/dist/auro-calendar.d.ts +3 -2
  57. package/components/datepicker/dist/auro-datepicker.d.ts +11 -0
  58. package/components/datepicker/dist/index.js +334 -1067
  59. package/components/datepicker/dist/registered.js +334 -1067
  60. package/components/dropdown/README.md +1 -1
  61. package/components/dropdown/demo/api.html +2 -1
  62. package/components/dropdown/demo/api.md +173 -82
  63. package/components/dropdown/demo/api.min.js +41 -183
  64. package/components/dropdown/demo/index.html +2 -1
  65. package/components/dropdown/demo/index.md +86 -4
  66. package/components/dropdown/demo/index.min.js +41 -183
  67. package/components/dropdown/demo/readme.html +2 -1
  68. package/components/dropdown/demo/readme.md +1 -1
  69. package/components/dropdown/dist/auro-dropdown.d.ts +8 -0
  70. package/components/dropdown/dist/auro-dropdownBib.d.ts +2 -2
  71. package/components/dropdown/dist/index.js +41 -183
  72. package/components/dropdown/dist/registered.js +41 -183
  73. package/components/form/README.md +1 -1
  74. package/components/form/demo/api.html +2 -1
  75. package/components/form/demo/api.min.js +1 -1
  76. package/components/form/demo/index.html +2 -1
  77. package/components/form/demo/index.min.js +1 -1
  78. package/components/form/demo/readme.html +2 -1
  79. package/components/form/demo/readme.md +1 -1
  80. package/components/form/demo/working.html +2 -1
  81. package/components/form/dist/index.js +1 -1
  82. package/components/form/dist/registered.js +1 -1
  83. package/components/helptext/dist/auro-helptext.d.ts +8 -0
  84. package/components/helptext/dist/index.js +11 -2
  85. package/components/helptext/dist/registered.js +11 -2
  86. package/components/input/README.md +1 -1
  87. package/components/input/demo/api.html +2 -1
  88. package/components/input/demo/api.js +2 -0
  89. package/components/input/demo/api.md +108 -18
  90. package/components/input/demo/api.min.js +127 -407
  91. package/components/input/demo/index.html +2 -1
  92. package/components/input/demo/index.md +30 -0
  93. package/components/input/demo/index.min.js +113 -407
  94. package/components/input/demo/readme.html +2 -1
  95. package/components/input/demo/readme.md +1 -1
  96. package/components/input/dist/base-input.d.ts +13 -0
  97. package/components/input/dist/buttonVersion.d.ts +1 -1
  98. package/components/input/dist/iconVersion.d.ts +1 -1
  99. package/components/input/dist/index.js +113 -407
  100. package/components/input/dist/registered.js +113 -407
  101. package/components/menu/README.md +1 -1
  102. package/components/menu/demo/api.html +2 -1
  103. package/components/menu/demo/api.md +6 -2
  104. package/components/menu/demo/api.min.js +23 -183
  105. package/components/menu/demo/index.html +2 -1
  106. package/components/menu/demo/index.min.js +23 -183
  107. package/components/menu/demo/readme.html +2 -1
  108. package/components/menu/demo/readme.md +1 -1
  109. package/components/menu/dist/iconVersion.d.ts +1 -1
  110. package/components/menu/dist/index.js +23 -183
  111. package/components/menu/dist/registered.js +23 -183
  112. package/components/radio/README.md +1 -1
  113. package/components/radio/demo/api.html +2 -1
  114. package/components/radio/demo/api.md +160 -56
  115. package/components/radio/demo/api.min.js +35 -8
  116. package/components/radio/demo/index.html +2 -1
  117. package/components/radio/demo/index.md +43 -12
  118. package/components/radio/demo/index.min.js +35 -8
  119. package/components/radio/demo/readme.html +2 -1
  120. package/components/radio/demo/readme.md +1 -1
  121. package/components/radio/dist/auro-radio-group.d.ts +6 -0
  122. package/components/radio/dist/auro-radio.d.ts +6 -0
  123. package/components/radio/dist/index.js +35 -8
  124. package/components/radio/dist/registered.js +35 -8
  125. package/components/select/README.md +1 -1
  126. package/components/select/demo/api.html +2 -1
  127. package/components/select/demo/api.js +0 -2
  128. package/components/select/demo/api.md +112 -35
  129. package/components/select/demo/api.min.js +118 -589
  130. package/components/select/demo/index.html +2 -1
  131. package/components/select/demo/index.md +100 -0
  132. package/components/select/demo/index.min.js +118 -576
  133. package/components/select/demo/readme.html +2 -1
  134. package/components/select/demo/readme.md +1 -1
  135. package/components/select/dist/auro-select.d.ts +8 -0
  136. package/components/select/dist/index.js +93 -391
  137. package/components/select/dist/registered.js +93 -391
  138. package/package.json +23 -23
  139. package/components/counter/dist/styles/counter-button-tokens-css.d.ts +0 -2
  140. package/components/select/dist/styles/color-css.d.ts +0 -2
  141. package/components/select/dist/styles/tokens-css.d.ts +0 -2
@@ -31,11 +31,11 @@ const t$1=globalThis,i$3=t$1.trustedTypes,s$1=i$3?i$3.createPolicy("lit-html",{c
31
31
  */
32
32
  const a=Symbol.for(""),o$1=t=>{if(t?.r===a)return t?._$litStatic$},s=t=>({_$litStatic$:t,r:a}),i$1=(t,...r)=>({_$litStatic$:r.reduce(((r,e,a)=>r+(t=>{if(void 0!==t._$litStatic$)return t._$litStatic$;throw Error(`Value passed to 'literal' function must be a 'literal' result: ${t}. Use 'unsafeStatic' to pass non-literal values, but\n take care to ensure page security.`)})(e)+t[a+1]),t[0]),r:a}),l=new Map,n=t=>(r,...e)=>{const a=e.length;let s,i;const n=[],u=[];let c,$=0,f=false;for(;$<a;){for(c=r[$];$<a&&void 0!==(i=e[$],s=o$1(i));)c+=s+r[++$],f=true;$!==a&&u.push(i),n.push(c),$++;}if($===a&&n.push(r[a]),f){const t=n.join("$$lit$$");void 0===(r=l.get(t))&&(n.raw=n,l.set(t,r=n)),e=u;}return t(r,...e)},u=n(x);
33
33
 
34
- var styleButtonTokenCss = i$5`:host{--ds-auro-counter-control-ui-hover: var(--ds-color-ui-bkg-hover-default, rgba(0, 0, 0, 0.06));--ds-auro-counter-control-ui-active: var(--ds-color-ui-active-default, #054687);--ds-auro-counter-control-border-hover: var(--ds-color-ui-bkg-hover-default, rgba(0, 0, 0, 0.06));--ds-auro-counter-control-ui-bkg: var(--ds-color-ui-bkg-default-default, rgba(0, 0, 0, 0.03))}`;
34
+ var tokensCss$7 = i$5`:host{--ds-auro-counter-control-background-color: var(--ds-advanced-color-button-tertiary-background, rgba(0, 0, 0, 0.05));--ds-auro-counter-control-border-color: var(--ds-advanced-color-state-focused, #01426a);--ds-auro-counter-description-text-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-counter-icon-color: var(--ds-advanced-color-button-tertiary-text, #01426a);--ds-auro-counter-label-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-counter-quantity-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-counter-divider-color: var(--ds-basic-color-border-divider, rgba(0, 0, 0, 0.15))}`;
35
35
 
36
- var styleButtonColorCss = i$5`.auroButton{border-color:unset;background-color:var(--ds-auro-counter-control-ui-bkg);color:var(--ds-auro-button-text-color);-webkit-tap-highlight-color:var(--ds-auro-button-tap-color)}@media(hover: hover){.auroButton:active:not(:disabled),.auroButton:hover:not(:disabled){background-color:var(--ds-auro-counter-control-ui-hover)}}`;
36
+ var styleButtonColorCss = i$5`.auroButton{border-color:unset;background-color:var(--ds-auro-counter-control-background-color);-webkit-tap-highlight-color:var(--ds-auro-button-tap-color)}@media(hover: hover){.auroButton:active:not(:disabled),.auroButton:hover:not(:disabled){--ds-auro-counter-control-background-color: var(--ds-advanced-color-button-tertiary-background-hover, rgba(0, 0, 0, 0.1))}}:host([onDark]) .auroButton{--ds-auro-counter-control-background-color: var(--ds-advanced-color-button-tertiary-background-inverse, rgba(255, 255, 255, 0.05))}@media(hover: hover){:host([onDark]) .auroButton:active:not(:disabled),:host([onDark]) .auroButton:hover:not(:disabled){--ds-auro-counter-control-background-color: var(--ds-advanced-color-button-tertiary-background-inverse-hover, rgba(255, 255, 255, 0.1))}}`;
37
37
 
38
- var styleButtonCss = 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_insetNone{padding:0}.util_insetXxxs{padding:.125rem}.util_insetXxxs--stretch{padding:.25rem .125rem}.util_insetXxxs--squish{padding:0 .125rem}.util_insetXxs{padding:.25rem}.util_insetXxs--stretch{padding:.375rem .25rem}.util_insetXxs--squish{padding:.125rem .25rem}.util_insetXs{padding:.5rem}.util_insetXs--stretch{padding:.75rem .5rem}.util_insetXs--squish{padding:.25rem .5rem}.util_insetSm{padding:.75rem}.util_insetSm--stretch{padding:1.125rem .75rem}.util_insetSm--squish{padding:.375rem .75rem}.util_insetMd{padding:1rem}.util_insetMd--stretch{padding:1.5rem 1rem}.util_insetMd--squish{padding:.5rem 1rem}.util_insetLg{padding:1.5rem}.util_insetLg--stretch{padding:2.25rem 1.5rem}.util_insetLg--squish{padding:.75rem 1.5rem}.util_insetXl{padding:2rem}.util_insetXl--stretch{padding:3rem 2rem}.util_insetXl--squish{padding:1rem 2rem}.util_insetXxl{padding:3rem}.util_insetXxl--stretch{padding:4.5rem 3rem}.util_insetXxl--squish{padding:1.5rem 3rem}.util_insetXxxl{padding:4rem}.util_insetXxxl--stretch{padding:6rem 4rem}.util_insetXxxl--squish{padding:2rem 4rem}::slotted(svg){vertical-align:middle}slot{pointer-events:none}.contentWrapper{display:flex;align-items:center}.contentWrapper span{display:block;height:var(--ds-size-300, 1.5rem)}.auroButton{position:relative;display:inline-flex;overflow:visible;width:calc(var(--ds-size-50, 0.25rem) + var(--ds-size-400, 2rem));height:calc(var(--ds-size-25, 0.125rem) + var(--ds-size-400, 2rem));flex-direction:row;align-items:center;justify-content:center;padding:var(--ds-auro-counter-control-padding);border:none;border-radius:var(--ds-auro-counter-control-border-radius);margin:0;cursor:pointer;gap:var(--ds-size-100, 0.5rem);line-height:unset;touch-action:manipulation;-webkit-touch-callout:none;user-select:none;white-space:nowrap}.auroButton:active .contentWrapper{transform:scale(0.95)}.auroButton:disabled{cursor:not-allowed;transform:unset}.auroButton:focus-visible:not(.auroButton:focus-visible:disabled){outline:none;transform:unset}`;
38
+ var styleButtonCss = i$5`:focus:not(:focus-visible){outline:3px solid transparent}.util_insetNone{padding:0}.util_insetXxxs{padding:.125rem}.util_insetXxxs--stretch{padding:.25rem .125rem}.util_insetXxxs--squish{padding:0 .125rem}.util_insetXxs{padding:.25rem}.util_insetXxs--stretch{padding:.375rem .25rem}.util_insetXxs--squish{padding:.125rem .25rem}.util_insetXs{padding:.5rem}.util_insetXs--stretch{padding:.75rem .5rem}.util_insetXs--squish{padding:.25rem .5rem}.util_insetSm{padding:.75rem}.util_insetSm--stretch{padding:1.125rem .75rem}.util_insetSm--squish{padding:.375rem .75rem}.util_insetMd{padding:1rem}.util_insetMd--stretch{padding:1.5rem 1rem}.util_insetMd--squish{padding:.5rem 1rem}.util_insetLg{padding:1.5rem}.util_insetLg--stretch{padding:2.25rem 1.5rem}.util_insetLg--squish{padding:.75rem 1.5rem}.util_insetXl{padding:2rem}.util_insetXl--stretch{padding:3rem 2rem}.util_insetXl--squish{padding:1rem 2rem}.util_insetXxl{padding:3rem}.util_insetXxl--stretch{padding:4.5rem 3rem}.util_insetXxl--squish{padding:1.5rem 3rem}.util_insetXxxl{padding:4rem}.util_insetXxxl--stretch{padding:6rem 4rem}.util_insetXxxl--squish{padding:2rem 4rem}::slotted(svg){vertical-align:middle}slot{pointer-events:none}.contentWrapper{display:flex;align-items:center}.contentWrapper span{display:block;height:var(--ds-size-300, 1.5rem)}.auroButton{position:relative;display:inline-flex;overflow:visible;width:calc(var(--ds-size-50, 0.25rem) + var(--ds-size-400, 2rem));height:calc(var(--ds-size-25, 0.125rem) + var(--ds-size-400, 2rem));flex-direction:row;align-items:center;justify-content:center;padding:var(--ds-auro-counter-control-padding);border:none;border-radius:var(--ds-auro-counter-control-border-radius);margin:0;cursor:pointer;gap:var(--ds-size-100, 0.5rem);line-height:unset;touch-action:manipulation;-webkit-touch-callout:none;user-select:none;white-space:nowrap}.auroButton:active .contentWrapper{transform:scale(0.95)}.auroButton:disabled{cursor:not-allowed;transform:unset}.auroButton:focus-visible:not(.auroButton:focus-visible:disabled){outline:none;transform:unset}`;
39
39
 
40
40
  /**
41
41
  * @license
@@ -60,7 +60,7 @@ const t={ATTRIBUTE:1},e$1=t=>(...e)=>({_$litDirective$:t,values:e});class i{cons
60
60
  // See LICENSE in the project root for license information.
61
61
 
62
62
 
63
- let AuroDependencyVersioning$3 = class AuroDependencyVersioning {
63
+ let AuroDependencyVersioning$2 = class AuroDependencyVersioning {
64
64
 
65
65
  /**
66
66
  * Generates a unique string to be used for child auro element naming.
@@ -103,7 +103,7 @@ let AuroDependencyVersioning$3 = class AuroDependencyVersioning {
103
103
 
104
104
  /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
105
105
 
106
- let AuroLibraryRuntimeUtils$7 = class AuroLibraryRuntimeUtils {
106
+ let AuroLibraryRuntimeUtils$3 = class AuroLibraryRuntimeUtils {
107
107
 
108
108
  /* eslint-disable jsdoc/require-param */
109
109
 
@@ -166,111 +166,22 @@ let AuroLibraryRuntimeUtils$7 = class AuroLibraryRuntimeUtils {
166
166
  }
167
167
  };
168
168
 
169
- var styleCss$9 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}.util_insetNone{padding:0}.util_insetXxxs{padding:.125rem}.util_insetXxxs--stretch{padding:.25rem .125rem}.util_insetXxxs--squish{padding:0 .125rem}.util_insetXxs{padding:.25rem}.util_insetXxs--stretch{padding:.375rem .25rem}.util_insetXxs--squish{padding:.125rem .25rem}.util_insetXs{padding:.5rem}.util_insetXs--stretch{padding:.75rem .5rem}.util_insetXs--squish{padding:.25rem .5rem}.util_insetSm{padding:.75rem}.util_insetSm--stretch{padding:1.125rem .75rem}.util_insetSm--squish{padding:.375rem .75rem}.util_insetMd{padding:1rem}.util_insetMd--stretch{padding:1.5rem 1rem}.util_insetMd--squish{padding:.5rem 1rem}.util_insetLg{padding:1.5rem}.util_insetLg--stretch{padding:2.25rem 1.5rem}.util_insetLg--squish{padding:.75rem 1.5rem}.util_insetXl{padding:2rem}.util_insetXl--stretch{padding:3rem 2rem}.util_insetXl--squish{padding:1rem 2rem}.util_insetXxl{padding:3rem}.util_insetXxl--stretch{padding:4.5rem 3rem}.util_insetXxl--squish{padding:1.5rem 3rem}.util_insetXxxl{padding:4rem}.util_insetXxxl--stretch{padding:6rem 4rem}.util_insetXxxl--squish{padding:2rem 4rem}:host([fluid]) .auro-button,:host([fluid=true]) .auro-button{min-width:auto;width:100%}:host([variant=flat]){display:inline-block;height:var(--ds-size-300, 1.5rem);width:var(--ds-size-300, 1.5rem)}:host([variant=flat]) .auro-button{height:100%;width:100%}::slotted(svg){vertical-align:middle}slot{pointer-events:none}.auro-button{position:relative;padding:0 var(--ds-size-300, 1.5rem);cursor:pointer;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem);font-family:var(--ds-font-family-default, "AS Circular", Helvetica Neue, Arial, sans-serif);font-size:var(--ds-text-body-size-default, 1rem);font-weight:var(--ds-text-body-default-weight, 500);overflow:hidden;text-overflow:ellipsis;user-select:none;white-space:nowrap;min-height:var(--ds-size-600, 3rem);max-height:var(--ds-size-600, 3rem);display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--ds-size-100, 0.5rem);margin:0;-webkit-touch-callout:none;-webkit-user-select:none}.auro-button:active{transform:scale(0.95)}.auro-button:focus-visible:not([variant=secondary]):not([variant=tertiary]):not([variant=flat]):after{display:block;content:"";height:calc(100% - 2px);width:calc(100% - 2px);position:absolute;top:1px;left:1px;border-radius:4px;border-style:solid;border-width:2px}.auro-button:focus-visible[variant=secondary]:after,.auro-button:focus-visible[variant=tertiary]:after{display:block;content:"";height:100%;width:100%;position:absolute;top:0;left:0;border-radius:var(--ds-border-radius, 0.375rem);border-style:solid;border-width:2px}.auro-button.loading{cursor:not-allowed}.auro-button.loading *:not([auro-loader]){visibility:hidden}@media screen and (min-width: 576px){.auro-button{min-width:8.75rem;width:auto}}.auro-button:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=secondary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=flat]{height:unset;width:unset;min-height:unset;max-height:unset;min-width:unset;max-width:unset;border:0;border-radius:unset;gap:unset;padding:unset}.auro-button[onDark]:disabled{cursor:not-allowed;transform:unset}.auro-button[onDark][variant=secondary]:disabled{cursor:not-allowed;transform:unset}@media(hover: hover){.auro-button[onDark][variant=tertiary]:active,.auro-button[onDark][variant=tertiary]:hover{box-shadow:none}}.auro-button[onDark][variant=tertiary]:active{box-shadow:none}.auro-button[onDark][variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button--slim{padding:var(--ds-size-100, 0.5rem) var(--ds-size-200, 1rem);font-size:var(--ds-text-body-size-sm, 0.875rem);min-width:unset;min-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem));max-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem))}.auro-button--iconOnly{padding:0 var(--ds-size-100, 0.5rem);border-radius:100px;min-width:unset;height:var(--ds-size-600, 3rem);width:var(--ds-size-500, 2.5rem)}.auro-button--iconOnly ::slotted(auro-icon),.auro-button--iconOnly ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, $ds-size-300)}.auro-button--iconOnlySlim{padding:0 var(--ds-size-50, 0.25rem);height:calc(var(--ds-size-400, 2rem) + var(--ds-size-50, 0.25rem));width:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-50, 0.25rem))}.auro-button--iconOnlySlim ::slotted(auro-icon),.auro-button--iconOnlySlim ::slotted([auro-icon]){--ds-auro-icon-size:calc(var(--ds-size-200, $ds-size-200) + var(--ds-size-50, $ds-size-50))}.auro-button--rounded{border-radius:100px;box-shadow:var(--ds-elevation-300, 0px 0px 15px rgba(0, 0, 0, 0.2));height:var(--ds-size-500, 2.5rem);min-width:unset;transition:all 300ms ease-out}.auro-button--rounded ::slotted(auro-icon),.auro-button--rounded ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, $ds-size-300)}:host([rounded]) .textSlot{transition:opacity 300ms ease-in;opacity:1}:host([rounded][iconOnly]) .textSlot{opacity:0}:host([rounded][iconOnly]) .textWrapper{display:none}:host([rounded][iconOnly]) .auro-button{min-width:unset;padding:unset;width:var(--ds-size-600, 3rem)}[auro-loader]{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);pointer-events:none}`;
170
-
171
- var colorCss$8 = i$5`[auro-loader]{color:var(--ds-auro-button-loader-color)}.auro-button{-webkit-tap-highlight-color:var(--ds-auro-button-tap-color);color:var(--ds-auro-button-text-color);background-color:var(--ds-auro-button-container-color);background-image:linear-gradient(var(--ds-auro-button-container-image), var(--ds-auro-button-container-image));border-color:var(--ds-auro-button-border-color)}.auro-button:not([variant=secondary]):not([variant=tertiary]):focus-visible:after{border-color:var(--ds-auro-button-border-inset-color)}.auro-button:not([ondark]):active{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-active-default, #225296);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-active-default, #225296);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-active-default, #225296)}.auro-button:not([ondark])[disabled]{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-disabled-default, #a0c9f1);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-disabled-default, #a0c9f1);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-disabled-default, #a0c9f1)}@media(hover: hover){.auro-button:not([ondark]):active:not(:disabled),.auro-button:not([ondark]):hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-primary-hover-default, #193d73);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-hover-default, #193d73);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-hover-default, #193d73)}}.auro-button:not([ondark])[variant=secondary]{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-default-default, #ffffff);--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-default-default, #ffffff);--ds-auro-button-border-color:var(--ds-color-border-ui-default-default, #2c67b5);--ds-auro-button-text-color:var(--ds-color-text-ui-default-default, #2c67b5)}@media(hover: hover){.auro-button:not([ondark])[variant=secondary]:active:not(:disabled),.auro-button:not([ondark])[variant=secondary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-hover-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-hover-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color:var(--ds-color-border-ui-hover-default, #193d73);--ds-auro-button-text-color:var(--ds-color-text-ui-hover-default, #193d73)}}.auro-button:not([ondark])[variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-color-border-ui-focus-default, #2c67b5)}.auro-button:not([ondark])[variant=secondary]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-active-default, #f0f7fd);--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-active-default, #f0f7fd);--ds-auro-button-border-color:var(--ds-color-border-ui-active-default, #225296);--ds-auro-button-text-color:var(--ds-color-text-ui-active-default, #225296)}.auro-button:not([ondark])[variant=secondary]:disabled{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-disabled-default, #f7f7f7);--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-disabled-default, #f7f7f7);--ds-auro-button-border-color:var(--ds-color-border-ui-disabled-default, #adadad);--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-default, #adadad)}.auro-button:not([ondark])[variant=tertiary]{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-default-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-default-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-default-default, #2c67b5)}@media(hover: hover){.auro-button:not([ondark])[variant=tertiary]:active:not(:disabled),.auro-button:not([ondark])[variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-hover-default, rgba(0, 0, 0, 0.12));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-hover-default, rgba(0, 0, 0, 0.12));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-hover-default, #193d73)}}.auro-button:not([ondark])[variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-color-border-ui-default-default, #2c67b5);--ds-auro-button-border-inset-color:var(--ds-color-border-ui-default-default, #2c67b5)}.auro-button:not([ondark])[variant=tertiary]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-active-default, rgba(0, 0, 0, 0.06));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-active-default, rgba(0, 0, 0, 0.06));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-active-default, #225296)}.auro-button:not([ondark])[variant=tertiary]:disabled{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-disabled-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-disabled-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-default, #adadad)}.auro-button:not([ondark])[variant=flat]{color:var(--ds-color-icon-ui-secondary-default-default);background-color:transparent;background-image:none;border-color:transparent}@media(hover: hover){.auro-button:not([ondark])[variant=flat]:active:not(:disabled),.auro-button:not([ondark])[variant=flat]:hover:not(:disabled){color:var(--ds-color-icon-ui-secondary-hover-default);background-color:transparent;background-image:none;border-color:transparent}}.auro-button:not([ondark])[variant=flat]:disabled{color:var(--ds-color-icon-ui-secondary-disabled-default);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark]{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-default-inverse, #56bbde);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-default-inverse, #56bbde);--ds-auro-button-text-color:var(--ds-color-text-primary-default, #2a2a2a);--ds-auro-button-loader-color:var(--ds-color-text-primary-inverse, #ffffff);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark]:active:not(:disabled),.auro-button[ondark]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7)}}.auro-button[ondark]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-active-inverse, #6ad5ef);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-active-inverse, #6ad5ef);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-active-inverse, #6ad5ef)}.auro-button[ondark][disabled]{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-disabled-inverse, #275b72);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-disabled-inverse, #275b72);--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-inverse, #7e7e7e);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-disabled-inverse, #275b72)}.auro-button[ondark][variant=secondary]{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-default-inverse, rgba(255, 255, 255, 0.03));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-default-inverse, rgba(255, 255, 255, 0.03));--ds-auro-button-border-color:var(--ds-color-border-ui-default-inverse, #56bbde);--ds-auro-button-text-color:var(--ds-color-text-ui-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark][variant=secondary]:hover{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-hover-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-hover-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color:var(--ds-color-border-ui-hover-inverse, #a8e9f7);--ds-auro-button-text-color:var(--ds-color-text-ui-hover-inverse, #a8e9f7)}}.auro-button[ondark][variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-color-border-ui-focus-inverse, #56bbde)}.auro-button[ondark][variant=secondary]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-border-color:var(--ds-color-border-ui-active-inverse, #6ad5ef);--ds-auro-button-text-color:var(--ds-color-text-ui-active-inverse, #6ad5ef)}.auro-button[ondark][variant=secondary]:disabled{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-disabled-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-disabled-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color:var(--ds-color-border-ui-disabled-inverse, #7e7e7e);--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-inverse, #7e7e7e)}.auro-button[ondark][variant=tertiary]{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-default-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-default-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark][variant=tertiary]:active:not(:disabled),.auro-button[ondark][variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-hover-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-hover-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-hover-inverse, #a8e9f7)}}.auro-button[ondark][variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-color-border-ui-default-inverse, #56bbde);--ds-auro-button-border-inset-color:var(--ds-color-border-ui-default-inverse, #56bbde)}.auro-button[ondark][variant=tertiary]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-active-inverse, #6ad5ef)}.auro-button[ondark][variant=tertiary]:disabled{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-disabled-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-disabled-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-inverse, #7e7e7e)}.auro-button[ondark][variant=flat]{color:var(--ds-color-icon-ui-secondary-default-inverse);background-color:transparent;background-image:none;border-color:transparent}@media(hover: hover){.auro-button[ondark][variant=flat]:active:not(:disabled),.auro-button[ondark][variant=flat]:hover:not(:disabled){color:var(--ds-color-icon-ui-secondary-hover-inverse);background-color:transparent;background-image:none;border-color:transparent}}.auro-button[ondark][variant=flat]:disabled{color:var(--ds-color-icon-ui-disabled-default);background-color:transparent;background-image:none;border-color:transparent}`;
172
-
173
- var tokensCss$7 = i$5`:host{--ds-auro-button-border-color:var(--ds-color-container-ui-primary-default-default, #2c67b5);--ds-auro-button-border-inset-color:var(--ds-color-border-emphasis-inverse, #f2f7fb);--ds-auro-button-container-color:var(--ds-color-container-ui-primary-default-default, #2c67b5);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-default-default, #2c67b5);--ds-auro-button-loader-color:var(--ds-color-utility-navy-default, #265688);--ds-auro-button-text-color:var(--ds-color-text-primary-inverse, #ffffff);--ds-auro-button-tap-color:transparent}`;
174
-
175
- // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
176
- // See LICENSE in the project root for license information.
177
-
178
- // ---------------------------------------------------------------------
179
-
180
- /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
181
-
182
- let AuroLibraryRuntimeUtils$6 = class AuroLibraryRuntimeUtils {
183
-
184
- /* eslint-disable jsdoc/require-param */
185
-
186
- /**
187
- * This will register a new custom element with the browser.
188
- * @param {String} name - The name of the custom element.
189
- * @param {Object} componentClass - The class to register as a custom element.
190
- * @returns {void}
191
- */
192
- registerComponent(name, componentClass) {
193
- if (!customElements.get(name)) {
194
- customElements.define(name, class extends componentClass {});
195
- }
196
- }
197
-
198
- /**
199
- * Finds and returns the closest HTML Element based on a selector.
200
- * @returns {void}
201
- */
202
- closestElement(
203
- selector, // selector like in .closest()
204
- base = this, // extra functionality to skip a parent
205
- __Closest = (el, found = el && el.closest(selector)) =>
206
- !el || el === document || el === window
207
- ? null // standard .closest() returns null for non-found selectors also
208
- : found
209
- ? found // found a selector INside this element
210
- : __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
211
- ) {
212
- return __Closest(base);
213
- }
214
- /* eslint-enable jsdoc/require-param */
215
-
216
- /**
217
- * If the element passed is registered with a different tag name than what is passed in, the tag name is added as an attribute to the element.
218
- * @param {Object} elem - The element to check.
219
- * @param {String} tagName - The name of the Auro component to check for or add as an attribute.
220
- * @returns {void}
221
- */
222
- handleComponentTagRename(elem, tagName) {
223
- const tag = tagName.toLowerCase();
224
- const elemTag = elem.tagName.toLowerCase();
225
-
226
- if (elemTag !== tag) {
227
- elem.setAttribute(tag, true);
228
- }
229
- }
169
+ var styleCss$9 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}.util_insetNone{padding:0}.util_insetXxxs{padding:.125rem}.util_insetXxxs--stretch{padding:.25rem .125rem}.util_insetXxxs--squish{padding:0 .125rem}.util_insetXxs{padding:.25rem}.util_insetXxs--stretch{padding:.375rem .25rem}.util_insetXxs--squish{padding:.125rem .25rem}.util_insetXs{padding:.5rem}.util_insetXs--stretch{padding:.75rem .5rem}.util_insetXs--squish{padding:.25rem .5rem}.util_insetSm{padding:.75rem}.util_insetSm--stretch{padding:1.125rem .75rem}.util_insetSm--squish{padding:.375rem .75rem}.util_insetMd{padding:1rem}.util_insetMd--stretch{padding:1.5rem 1rem}.util_insetMd--squish{padding:.5rem 1rem}.util_insetLg{padding:1.5rem}.util_insetLg--stretch{padding:2.25rem 1.5rem}.util_insetLg--squish{padding:.75rem 1.5rem}.util_insetXl{padding:2rem}.util_insetXl--stretch{padding:3rem 2rem}.util_insetXl--squish{padding:1rem 2rem}.util_insetXxl{padding:3rem}.util_insetXxl--stretch{padding:4.5rem 3rem}.util_insetXxl--squish{padding:1.5rem 3rem}.util_insetXxxl{padding:4rem}.util_insetXxxl--stretch{padding:6rem 4rem}.util_insetXxxl--squish{padding:2rem 4rem}:host([fluid]) .auro-button,:host([fluid=true]) .auro-button{min-width:auto;width:100%}:host([variant=flat]){display:inline-block;height:var(--ds-size-300, 1.5rem);width:var(--ds-size-300, 1.5rem)}:host([variant=flat]) .auro-button{height:100%;width:100%}::slotted(svg){vertical-align:middle}slot{pointer-events:none}.auro-button{position:relative;padding:0 var(--ds-size-300, 1.5rem);cursor:pointer;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem);font-family:var(--ds-basic-text-body-default-font-family, AS Circular);font-size:var(--ds-basic-text-body-default-font-size, 16px);font-weight:var(--ds-basic-text-body-default-font-weight, Book);overflow:hidden;text-overflow:ellipsis;user-select:none;white-space:nowrap;min-height:var(--ds-size-600, 3rem);max-height:var(--ds-size-600, 3rem);display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--ds-size-100, 0.5rem);margin:0;-webkit-touch-callout:none;-webkit-user-select:none}.auro-button:active{transform:scale(0.95)}.auro-button:focus-visible{outline:none}.auro-button:focus-visible:not([variant=flat]){outline-style:solid;outline-width:var(--ds-size-50, 0.25rem);outline-offset:calc(var(--ds-size-50, 0.25rem)*-1)}.auro-button:focus-visible:not([variant=flat]):not([variant=secondary]):not([variant=tertiary]){outline-width:calc(var(--ds-size-50, 0.25rem) - 1px)}.auro-button.loading{cursor:not-allowed}.auro-button.loading *:not([auro-loader]){visibility:hidden}@media screen and (min-width: 576px){.auro-button{min-width:8.75rem;width:auto}}.auro-button:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=secondary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=flat]{height:unset;width:unset;min-height:unset;max-height:unset;min-width:unset;max-width:unset;border:0;border-radius:unset;gap:unset;padding:unset}.auro-button[onDark]:disabled{cursor:not-allowed;transform:unset}.auro-button[onDark][variant=secondary]:disabled{cursor:not-allowed;transform:unset}@media(hover: hover){.auro-button[onDark][variant=tertiary]:active,.auro-button[onDark][variant=tertiary]:hover{box-shadow:none}}.auro-button[onDark][variant=tertiary]:active{box-shadow:none}.auro-button[onDark][variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button--slim{padding:var(--ds-size-100, 0.5rem) var(--ds-size-200, 1rem);font-size:var(--ds-basic-text-body-sm-font-size, 14px);min-width:unset;min-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem));max-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem))}.auro-button--iconOnly{padding:0 var(--ds-size-100, 0.5rem);border-radius:100px;min-width:unset;height:var(--ds-size-600, 3rem);width:var(--ds-size-500, 2.5rem)}.auro-button--iconOnly ::slotted(auro-icon),.auro-button--iconOnly ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, $ds-size-300)}.auro-button--iconOnly:not(.auro-button--rounded):focus-visible:not([variant=secondary]):not([variant=tertiary]):not([variant=flat]){outline-width:1px;outline-offset:-2px}.auro-button--iconOnlySlim{padding:0 var(--ds-size-50, 0.25rem);height:calc(var(--ds-size-400, 2rem) + var(--ds-size-50, 0.25rem));width:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-50, 0.25rem))}.auro-button--iconOnlySlim ::slotted(auro-icon),.auro-button--iconOnlySlim ::slotted([auro-icon]){--ds-auro-icon-size:calc(var(--ds-size-200, $ds-size-200) + var(--ds-size-50, $ds-size-50))}.auro-button--rounded{border-radius:100px;box-shadow:var(--ds-elevation-300, 0px 0px 15px rgba(0, 0, 0, 0.2));height:var(--ds-size-500, 2.5rem);min-width:unset;transition:all 300ms ease-out,outline 0ms,outline-offset 0ms}.auro-button--rounded ::slotted(auro-icon),.auro-button--rounded ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, $ds-size-300)}.auro-button--rounded:focus-visible:not([variant=flat]):after{border-radius:100px}:host([rounded]) .textSlot{transition:opacity 300ms ease-in;opacity:1}:host([rounded][iconOnly]) .textSlot{opacity:0}:host([rounded][iconOnly]) .textWrapper{display:none}:host([rounded][iconOnly]) .auro-button{min-width:unset;padding:unset;width:var(--ds-size-600, 3rem)}[auro-loader]{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);pointer-events:none}`;
230
170
 
231
- /**
232
- * Validates if an element is a specific Auro component.
233
- * @param {Object} elem - The element to validate.
234
- * @param {String} tagName - The name of the Auro component to check against.
235
- * @returns {Boolean} - Returns true if the element is the specified Auro component.
236
- */
237
- elementMatch(elem, tagName) {
238
- const tag = tagName.toLowerCase();
239
- const elemTag = elem.tagName.toLowerCase();
171
+ var colorCss$8 = i$5`[auro-loader]{color:var(--ds-auro-button-loader-color)}.auro-button{-webkit-tap-highlight-color:var(--ds-auro-button-tap-color);color:var(--ds-auro-button-text-color);background-color:var(--ds-auro-button-container-color);background-image:linear-gradient(var(--ds-auro-button-container-image), var(--ds-auro-button-container-image));border-color:var(--ds-auro-button-border-color)}.auro-button:not([variant=secondary]):not([variant=tertiary]):focus-visible{outline-color:var(--ds-auro-button-border-inset-color)}.auro-button:not([ondark]):active:not(:disabled),.auro-button:not([ondark]):hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-hover, #00274a);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-hover, #00274a);--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-hover, #00274a)}.auro-button:not([ondark]):disabled{--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-disabled, #acc9e2);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-disabled, #acc9e2);--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-disabled, #acc9e2)}.auro-button:not([ondark])[variant=secondary]{--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background, #ffffff);--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background, #ffffff);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border, #01426a);--ds-auro-button-text-color:var(--ds-advanced-color-button-secondary-text, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-secondary-text, #01426a)}.auro-button:not([ondark])[variant=secondary]:active:not(:disabled),.auro-button:not([ondark])[variant=secondary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background-hover, #f2f2f2);--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background-hover, #f2f2f2);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-hover, #00274a);--ds-auro-button-text-color:var(--ds-advanced-color-button-secondary-text-hover, #00274a)}.auro-button:not([ondark])[variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused, #01426a)}.auro-button:not([ondark])[variant=secondary]:disabled{--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background-disabled, #f7f7f7);--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background-disabled, #f7f7f7);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-disabled, #cfe0ef);--ds-auro-button-text-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}.auro-button:not([ondark])[variant=tertiary]{--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background, rgba(0, 0, 0, 0.05));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background, rgba(0, 0, 0, 0.05));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-advanced-color-button-tertiary-text, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-tertiary-text, #01426a)}.auro-button:not([ondark])[variant=tertiary]:active:not(:disabled),.auro-button:not([ondark])[variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background-hover, rgba(0, 0, 0, 0.1));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background-hover, rgba(0, 0, 0, 0.1));--ds-auro-button-border-color:transparent}.auro-button:not([ondark])[variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-advanced-color-state-focused, #01426a);--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused, #01426a)}.auro-button:not([ondark])[variant=tertiary]:disabled{--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}.auro-button:not([ondark])[variant=flat]{color:var(--ds-advanced-color-button-flat-text, #676767);background-color:transparent;background-image:none;border-color:transparent}.auro-button:not([ondark])[variant=flat]:active:not(:disabled),.auro-button:not([ondark])[variant=flat]:hover:not(:disabled){color:var(--ds-advanced-color-button-flat-text-hover, #525252);background-color:transparent;background-image:none;border-color:transparent}.auro-button:not([ondark])[variant=flat]:disabled{color:var(--ds-advanced-color-button-flat-text-disabled, #d0d0d0);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark]{--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-inverse, #ffffff);--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-inverse, #ffffff);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-inverse, #ffffff);--ds-auro-button-text-color:var(--ds-advanced-color-button-primary-text-inverse, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-primary-text-inverse, #01426a)}.auro-button[ondark]:active:not(:disabled),.auro-button[ondark]:hover:not(:disabled){--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-inverse-hover, #ebf3f9);--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-inverse-hover, #ebf3f9);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-inverse-hover, #ebf3f9)}.auro-button[ondark]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused, #01426a)}.auro-button[ondark]:disabled{--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-text-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}.auro-button[ondark][variant=secondary]{--ds-auro-button-container-color:transparent;--ds-auro-button-container-image:transparent;--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-inverse, #ffffff);--ds-auro-button-text-color:var(--ds-advanced-color-button-secondary-text-inverse, #ffffff);--ds-auro-button-loader-color:var(--ds-advanced-color-button-secondary-text-inverse, #ffffff)}.auro-button[ondark][variant=secondary]:active:not(:disabled),.auro-button[ondark][variant=secondary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background-inverse-hover, rgba(255, 255, 255, 0.1));--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background-inverse-hover, rgba(255, 255, 255, 0.1))}.auro-button[ondark][variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused-inverse, #ffffff)}.auro-button[ondark][variant=secondary]:disabled{--ds-auro-button-text-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-inverse-disabled, #dddddd)}.auro-button[ondark][variant=tertiary]{--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background-inverse, rgba(255, 255, 255, 0.05));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background-inverse, rgba(255, 255, 255, 0.05));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-advanced-color-button-tertiary-text-inverse, #ffffff);--ds-auro-button-loader-color:var(--ds-advanced-color-button-tertiary-text-inverse, #ffffff)}.auro-button[ondark][variant=tertiary]:active:not(:disabled),.auro-button[ondark][variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background-inverse-hover, rgba(255, 255, 255, 0.1));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background-inverse-hover, rgba(255, 255, 255, 0.1))}.auro-button[ondark][variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused-inverse, #ffffff)}.auro-button[ondark][variant=tertiary]:disabled{--ds-auro-button-text-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}.auro-button[ondark][variant=flat]{color:var(--ds-advanced-color-button-flat-text-inverse, #ffffff);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark][variant=flat]:active:not(:disabled),.auro-button[ondark][variant=flat]:hover:not(:disabled){color:var(--ds-advanced-color-button-flat-text-inverse-hover, #adadad);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark][variant=flat]:disabled{color:var(--ds-advanced-color-button-flat-text-inverse-disabled, #7e8894);background-color:transparent;background-image:none;border-color:transparent}`;
240
172
 
241
- return elemTag === tag || elem.hasAttribute(tag);
242
- }
243
- };
173
+ var tokensCss$6 = i$5`:host{--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border, #01426a);--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background, #01426a);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-primary-text, #ffffff);--ds-auro-button-text-color:var(--ds-advanced-color-button-primary-text, #ffffff);--ds-auro-button-tap-color:transparent}`;
244
174
 
245
175
  var styleCss$8 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}:host,:host>span{position:relative}:host{width:2rem;height:2rem;display:inline-block;font-size:0}:host>span{position:absolute;display:inline-block;float:none;top:0;left:0;width:2rem;height:2rem;border-radius:100%;border-style:solid;border-width:0}:host([xs]),:host([xs])>span{width:1.2rem;height:1.2rem}:host([sm]),:host([sm])>span{width:3rem;height:3rem}:host([md]),:host([md])>span{width:5rem;height:5rem}:host([lg]),:host([lg])>span{width:8rem;height:8rem}:host{--margin:0.375rem;--margin-xs:0.2rem;--margin-sm:0.5rem;--margin-md:0.75rem;--margin-lg:1rem}:host([pulse]),:host([pulse])>span{position:relative}:host([pulse]){width:calc(3rem + var(--margin)*6);height:1.5rem}:host([pulse])>span{width:1rem;height:1rem;margin:var(--margin);animation:pulse 1.5s ease infinite}:host([pulse][xs]){width:calc(2.55rem + var(--margin-xs)*6);height:1.55rem}:host([pulse][xs])>span{margin:var(--margin-xs);width:.65rem;height:.65rem}:host([pulse][sm]){width:calc(6rem + var(--margin-sm)*6);height:2.5rem}:host([pulse][sm])>span{margin:var(--margin-sm);width:2rem;height:2rem}:host([pulse][md]){width:calc(9rem + var(--margin-md)*6);height:3.5rem}:host([pulse][md])>span{margin:var(--margin-md);width:3rem;height:3rem}:host([pulse][lg]){width:calc(15rem + var(--margin-lg)*6);height:5.5rem}:host([pulse][lg])>span{margin:var(--margin-lg);width:5rem;height:5rem}:host([pulse])>span:nth-child(1){animation-delay:-400ms}:host([pulse])>span:nth-child(2){animation-delay:-200ms}:host([pulse])>span:nth-child(3){animation-delay:0ms}@keyframes pulse{0%,100%{opacity:.1;transform:scale(0.9)}50%{opacity:1;transform:scale(1.1)}}:host([orbit]),:host([orbit])>span{opacity:1}:host([orbit])>span{border-width:5px}:host([orbit])>span:nth-child(2){animation:orbit 2s linear infinite}:host([orbit][sm])>span{border-width:8px}:host([orbit][md])>span{border-width:13px}:host([orbit][lg])>span{border-width:21px}@keyframes orbit{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}:host([ringworm])>svg{animation:rotate 2s linear infinite;height:100%;width:100%;stroke:currentcolor;stroke-width:8}:host([ringworm]) .path{stroke-dashoffset:0;animation:ringworm 1.5s ease-in-out infinite;stroke-linecap:round}@keyframes rotate{100%{transform:rotate(360deg)}}@keyframes ringworm{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}100%{stroke-dasharray:89,200;stroke-dashoffset:-124px}}:host([laser]){position:static;width:100%;display:block;height:0;overflow:hidden;font-size:unset}:host([laser])>span{position:fixed;width:100%;height:.25rem;border-radius:0;z-index:100}:host([laser])>span:nth-child(1){border-color:currentcolor;opacity:.25}:host([laser])>span:nth-child(2){border-color:currentcolor;animation:laser 2s linear infinite;opacity:1;width:50%}:host([laser][sm])>span:nth-child(2){width:20%}:host([laser][md])>span:nth-child(2){width:30%}:host([laser][lg])>span:nth-child(2){width:50%;animation-duration:1.5s}:host([laser][xl])>span:nth-child(2){width:80%;animation-duration:1.5s}@keyframes laser{0%{left:-100%}100%{left:110%}}:host>.no-animation{display:none}@media(prefers-reduced-motion: reduce){:host{display:flex;align-items:center;justify-content:center;font-size:1rem}:host>span{opacity:1}:host>.loader{display:none}:host>.no-animation{display:block}}`;
246
176
 
247
- var colorCss$7 = i$5`:host{color:var(--ds-auro-loader-color)}:host>span{background-color:var(--ds-auro-loader-background-color);border-color:var(--ds-auro-loader-border-color)}:host([onlight]){--ds-auro-loader-color:var(--ds-color-utility-navy-default, #265688)}:host([ondark]){--ds-auro-loader-color:var(--ds-color-utility-cyan-inverse, #a8e9f7)}:host([white]){--ds-auro-loader-color:var(--ds-color-utility-neutral-inverse, #ccd2db)}:host([orbit])>span{--ds-auro-loader-background-color:transparent}:host([orbit])>span:nth-child(1){--ds-auro-loader-border-color:currentcolor;opacity:.25}:host([orbit])>span:nth-child(2){--ds-auro-loader-border-color:currentcolor;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent}`;
177
+ var colorCss$7 = i$5`:host{color:var(--ds-auro-loader-color)}:host>span{background-color:var(--ds-auro-loader-background-color);border-color:var(--ds-auro-loader-border-color)}:host([onlight]){--ds-auro-loader-color:var(--ds-basic-color-brand-primary, #01426a)}:host([ondark]){--ds-auro-loader-color:var(--ds-basic-color-texticon-inverse, #ffffff)}:host([orbit])>span{--ds-auro-loader-background-color:transparent}:host([orbit])>span:nth-child(1){--ds-auro-loader-border-color:currentcolor;opacity:.25}:host([orbit])>span:nth-child(2){--ds-auro-loader-border-color:currentcolor;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent}`;
248
178
 
249
- var tokensCss$6 = i$5`:host{--ds-auro-loader-background-color:currentcolor;--ds-auro-loader-border-color:currentcolor;--ds-auro-loader-color:currentcolor}`;
179
+ var tokensCss$5 = i$5`:host{--ds-auro-loader-background-color:currentcolor;--ds-auro-loader-border-color:currentcolor;--ds-auro-loader-color:currentcolor}`;
250
180
 
251
181
  // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
252
182
  // See LICENSE in the project root for license information.
253
183
 
254
184
 
255
- // See https://git.io/JJ6SJ for "How to document your components using JSDoc"
256
- /**
257
- * The auro-loader element is an easy to use animated loader component.
258
- *
259
- * @attr {Boolean} pulse - sets loader type
260
- * @attr {Boolean} ringworm - sets loader type
261
- * @attr {Boolean} laser - sets loader type
262
- * @attr {Boolean} orbit - sets loader type
263
- * @attr {Boolean} white - sets color of loader to white
264
- * @attr {Boolean} ondark - sets color of loader to auro-color-ui-default-on-dark
265
- * @attr {Boolean} onlight - sets color of loader to auro-color-ui-default-on-light
266
- * @attr {Boolean} xs - sets size to extra small
267
- * @attr {Boolean} sm - sets size to small
268
- * @attr {Boolean} md - sets size to medium
269
- * @attr {Boolean} lg - sets size to large
270
- * @csspart element - apply style to adjust speed of animation
271
- */
272
-
273
- // build the component class
274
185
  class AuroLoader extends r {
275
186
  constructor() {
276
187
  super();
@@ -293,7 +204,7 @@ class AuroLoader extends r {
293
204
  /**
294
205
  * @private
295
206
  */
296
- this.runtimeUtils = new AuroLibraryRuntimeUtils$6();
207
+ this.runtimeUtils = new AuroLibraryRuntimeUtils$3();
297
208
 
298
209
  this.orbit = false;
299
210
  this.ringworm = false;
@@ -304,19 +215,35 @@ class AuroLoader extends r {
304
215
  // function to define props used within the scope of this component
305
216
  static get properties() {
306
217
  return {
307
- pulse: {
218
+
219
+ /**
220
+ * Sets loader to laser type.
221
+ */
222
+ laser: {
308
223
  type: Boolean,
309
224
  reflect: true
310
225
  },
226
+
227
+ /**
228
+ * Sets loader to orbit type.
229
+ */
311
230
  orbit: {
312
231
  type: Boolean,
313
232
  reflect: true
314
233
  },
315
- ringworm: {
234
+
235
+ /**
236
+ * Sets loader to pulse type.
237
+ */
238
+ pulse: {
316
239
  type: Boolean,
317
240
  reflect: true
318
241
  },
319
- laser: {
242
+
243
+ /**
244
+ * Sets loader to ringworm type.
245
+ */
246
+ ringworm: {
320
247
  type: Boolean,
321
248
  reflect: true
322
249
  }
@@ -327,7 +254,7 @@ class AuroLoader extends r {
327
254
  return [
328
255
  i$5`${styleCss$8}`,
329
256
  i$5`${colorCss$7}`,
330
- i$5`${tokensCss$6}`
257
+ i$5`${tokensCss$5}`
331
258
  ];
332
259
  }
333
260
 
@@ -340,7 +267,7 @@ class AuroLoader extends r {
340
267
  *
341
268
  */
342
269
  static register(name = "auro-loader") {
343
- AuroLibraryRuntimeUtils$6.prototype.registerComponent(name, AuroLoader);
270
+ AuroLibraryRuntimeUtils$3.prototype.registerComponent(name, AuroLoader);
344
271
  }
345
272
 
346
273
  firstUpdated() {
@@ -390,23 +317,26 @@ class AuroLoader extends r {
390
317
  }
391
318
  }
392
319
 
393
- var loaderVersion = '4.0.0';
320
+ var loaderVersion = '5.0.0';
394
321
 
322
+ /* eslint-disable max-lines */
395
323
  // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
396
324
  // See LICENSE in the project root for license information.
397
325
 
398
326
 
399
327
  /**
400
328
  * @attr {Boolean} autofocus - This Boolean attribute lets you specify that the button should have input focus when the page loads, unless overridden by the user
401
- * @attr {Boolean} disabled - If set to true button will become disabled and not allow for interactions
329
+ * @attr {Boolean} disabled - If set to true, button will become disabled and not allow for interactions
402
330
  * @attr {Boolean} iconOnly - If set to true, the button will contain an icon with no additional content
403
331
  * @attr {Boolean} loading - If set to true button text will be replaced with `auro-loader` and become disabled
332
+ * @attr {String} loadingText - Sets custom loading text for the `aria-label` on a button in loading state. If not set, the default value of "Loading..." will be used.
404
333
  * @attr {Boolean} onDark - Set value for on-dark version of auro-button
405
334
  * @attr {Boolean} rounded - If set to true, the button will have a rounded shape
406
335
  * @attr {Boolean} slim - Set value for slim version of auro-button
407
336
  * @attr {Boolean} fluid - Alters the shape of the button to be full width of its parent container
408
337
  * @attr {String} arialabel - Populates the `aria-label` attribute that is used to define a string that labels the current element. Use it in cases where a text label is not visible on the screen. If there is visible text labeling the element, use `aria-labelledby` instead.
409
338
  * @attr {String} arialabelledby - Populates the `aria-labelledby` attribute that establishes relationships between objects and their label(s), and its value should be one or more element IDs, which refer to elements that have the text needed for labeling. List multiple element IDs in a space delimited fashion.
339
+ * @attr {Boolean} ariaexpanded - Populates the `aria-expanded` attribute that indicates whether the element, or another grouping element it controls, is currently expanded or collapsed. This is an optional attribute for buttons.
410
340
  * @attr {String} id - Set the unique ID of an element.
411
341
  * @attr {String} title - Sets title attribute. The information is most often shown as a tooltip text when the mouse moves over the element.
412
342
  * @attr {String} type - The type of the button. Possible values are: `submit`, `reset`, `button`
@@ -451,6 +381,7 @@ class AuroButton extends r {
451
381
  this.rounded = false;
452
382
  this.slim = false;
453
383
  this.fluid = false;
384
+ this.loadingText = this.loadingText || 'Loading...';
454
385
 
455
386
  // Support for HTML5 forms
456
387
  if (typeof this.attachInternals === 'function') {
@@ -465,7 +396,7 @@ class AuroButton extends r {
465
396
  /**
466
397
  * Generate unique names for dependency components.
467
398
  */
468
- const versioning = new AuroDependencyVersioning$3();
399
+ const versioning = new AuroDependencyVersioning$2();
469
400
 
470
401
  /**
471
402
  * @private
@@ -475,7 +406,7 @@ class AuroButton extends r {
475
406
 
476
407
  static get styles() {
477
408
  return [
478
- tokensCss$7,
409
+ tokensCss$6,
479
410
  styleCss$9,
480
411
  colorCss$8
481
412
  ];
@@ -511,6 +442,9 @@ class AuroButton extends r {
511
442
  type: Boolean,
512
443
  reflect: true
513
444
  },
445
+ loadingText: {
446
+ type: String
447
+ },
514
448
  onDark: {
515
449
  type: Boolean,
516
450
  reflect: true
@@ -531,6 +465,10 @@ class AuroButton extends r {
531
465
  type: String,
532
466
  reflect: true
533
467
  },
468
+ ariaexpanded: {
469
+ type: Boolean,
470
+ reflect: true
471
+ },
534
472
  title: {
535
473
  type: String,
536
474
  reflect: true
@@ -560,7 +498,7 @@ class AuroButton extends r {
560
498
  *
561
499
  */
562
500
  static register(name = "auro-button") {
563
- AuroLibraryRuntimeUtils$7.prototype.registerComponent(name, AuroButton);
501
+ AuroLibraryRuntimeUtils$3.prototype.registerComponent(name, AuroButton);
564
502
  }
565
503
 
566
504
  /**
@@ -602,12 +540,22 @@ class AuroButton extends r {
602
540
  this.notifyReady();
603
541
  }
604
542
 
543
+ /**
544
+ * Submits the form that this button is associated with.
545
+ * @private
546
+ * @returns {void}
547
+ */
605
548
  surfaceSubmitEvent() {
606
549
  if (this.form) {
607
550
  this.form.requestSubmit();
608
551
  }
609
552
  }
610
553
 
554
+ /**
555
+ * Returns the form element that this button is associated with.
556
+ * @private
557
+ * @returns {HTMLFormElement|null}
558
+ */
611
559
  get form() {
612
560
  return this.internals ? this.internals.form : null;
613
561
  }
@@ -627,8 +575,9 @@ class AuroButton extends r {
627
575
  return u`
628
576
  <button
629
577
  part="button"
630
- aria-label="${o(this.arialabel ? this.arialabel : undefined)}"
578
+ aria-label="${o(this.loading ? this.loadingText : this.arialabel || undefined)}"
631
579
  aria-labelledby="${o(this.arialabelledby ? this.arialabelledby : undefined)}"
580
+ aria-expanded="${o(this.ariaexpanded)}"
632
581
  ?autofocus="${this.autofocus}"
633
582
  class="${e(classes)}"
634
583
  ?disabled="${this.disabled || this.loading}"
@@ -656,76 +605,6 @@ class AuroButton extends r {
656
605
  }
657
606
  }
658
607
 
659
- // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
660
- // See LICENSE in the project root for license information.
661
-
662
- // ---------------------------------------------------------------------
663
-
664
- /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
665
-
666
- let AuroLibraryRuntimeUtils$5 = class AuroLibraryRuntimeUtils {
667
-
668
- /* eslint-disable jsdoc/require-param */
669
-
670
- /**
671
- * This will register a new custom element with the browser.
672
- * @param {String} name - The name of the custom element.
673
- * @param {Object} componentClass - The class to register as a custom element.
674
- * @returns {void}
675
- */
676
- registerComponent(name, componentClass) {
677
- if (!customElements.get(name)) {
678
- customElements.define(name, class extends componentClass {});
679
- }
680
- }
681
-
682
- /**
683
- * Finds and returns the closest HTML Element based on a selector.
684
- * @returns {void}
685
- */
686
- closestElement(
687
- selector, // selector like in .closest()
688
- base = this, // extra functionality to skip a parent
689
- __Closest = (el, found = el && el.closest(selector)) =>
690
- !el || el === document || el === window
691
- ? null // standard .closest() returns null for non-found selectors also
692
- : found
693
- ? found // found a selector INside this element
694
- : __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
695
- ) {
696
- return __Closest(base);
697
- }
698
- /* eslint-enable jsdoc/require-param */
699
-
700
- /**
701
- * If the element passed is registered with a different tag name than what is passed in, the tag name is added as an attribute to the element.
702
- * @param {Object} elem - The element to check.
703
- * @param {String} tagName - The name of the Auro component to check for or add as an attribute.
704
- * @returns {void}
705
- */
706
- handleComponentTagRename(elem, tagName) {
707
- const tag = tagName.toLowerCase();
708
- const elemTag = elem.tagName.toLowerCase();
709
-
710
- if (elemTag !== tag) {
711
- elem.setAttribute(tag, true);
712
- }
713
- }
714
-
715
- /**
716
- * Validates if an element is a specific Auro component.
717
- * @param {Object} elem - The element to validate.
718
- * @param {String} tagName - The name of the Auro component to check against.
719
- * @returns {Boolean} - Returns true if the element is the specified Auro component.
720
- */
721
- elementMatch(elem, tagName) {
722
- const tag = tagName.toLowerCase();
723
- const elemTag = elem.tagName.toLowerCase();
724
-
725
- return elemTag === tag || elem.hasAttribute(tag);
726
- }
727
- };
728
-
729
608
  // Copyright (c) 2022 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
730
609
  // See LICENSE in the project root for license information.
731
610
 
@@ -737,7 +616,7 @@ class AuroCounterButton extends AuroButton {
737
616
  return [
738
617
  styleButtonCss,
739
618
  styleButtonColorCss,
740
- styleButtonTokenCss
619
+ tokensCss$7
741
620
  ];
742
621
  }
743
622
 
@@ -750,7 +629,7 @@ class AuroCounterButton extends AuroButton {
750
629
  *
751
630
  */
752
631
  static register(name = "auro-counter-button") {
753
- AuroLibraryRuntimeUtils$5.prototype.registerComponent(name, AuroCounterButton);
632
+ AuroLibraryRuntimeUtils$3.prototype.registerComponent(name, AuroCounterButton);
754
633
  }
755
634
  }
756
635
 
@@ -760,46 +639,6 @@ if (!customElements.get("auro-counter-button")) {
760
639
  customElements.define("auro-counter-button", AuroCounterButton);
761
640
  }
762
641
 
763
- // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
764
- // See LICENSE in the project root for license information.
765
-
766
-
767
- let AuroDependencyVersioning$2 = class AuroDependencyVersioning {
768
-
769
- /**
770
- * Generates a unique string to be used for child auro element naming.
771
- * @private
772
- * @param {string} baseName - Defines the first part of the unique element name.
773
- * @param {string} version - Version of the component that will be appended to the baseName.
774
- * @returns {string} - Unique string to be used for naming.
775
- */
776
- generateElementName(baseName, version) {
777
- let result = baseName;
778
-
779
- result += '-';
780
- result += version.replace(/[.]/g, '_');
781
-
782
- return result;
783
- }
784
-
785
- /**
786
- * Generates a unique string to be used for child auro element naming.
787
- * @param {string} baseName - Defines the first part of the unique element name.
788
- * @param {string} version - Version of the component that will be appended to the baseName.
789
- * @returns {string} - Unique string to be used for naming.
790
- */
791
- generateTag(baseName, version, tagClass) {
792
- const elementName = this.generateElementName(baseName, version);
793
- const tag = i$1`${s(elementName)}`;
794
-
795
- if (!customElements.get(elementName)) {
796
- customElements.define(elementName, class extends tagClass {});
797
- }
798
-
799
- return tag;
800
- }
801
- };
802
-
803
642
  // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
804
643
  // See LICENSE in the project root for license information.
805
644
 
@@ -866,7 +705,7 @@ const cacheFetch$2 = (uri, options = {}) => {
866
705
  return _fetchMap$2.get(uri);
867
706
  };
868
707
 
869
- var styleCss$7 = i$5`: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}.componentWrapper{display:flex}.svgWrapper{height:var(--ds-auro-icon-size);width:var(--ds-auro-icon-size)}.labelWrapper{margin-left:var(--ds-size-50, 0.25rem);line-height:1.8}`;
708
+ var styleCss$7 = i$5`: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}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}.componentWrapper{display:flex}.svgWrapper{height:var(--ds-auro-icon-size);width:var(--ds-auro-icon-size)}.labelWrapper{margin-left:var(--ds-size-50, 0.25rem);line-height:1.8}`;
870
709
 
871
710
  // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
872
711
  // See LICENSE in the project root for license information.
@@ -874,7 +713,6 @@ var styleCss$7 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}.u
874
713
 
875
714
  // See https://git.io/JJ6SJ for "How to document your components using JSDoc"
876
715
  /**
877
- * @attr {Boolean} onDark - Set value for on-dark version of auro-icon
878
716
  * @slot - Hidden from visibility, used for a11y if icon description is needed
879
717
  */
880
718
 
@@ -889,6 +727,10 @@ let BaseIcon$2 = class BaseIcon extends AuroElement$2 {
889
727
  static get properties() {
890
728
  return {
891
729
  ...super.properties,
730
+
731
+ /**
732
+ * Set value for on-dark version of auro-icon.
733
+ */
892
734
  onDark: {
893
735
  type: Boolean,
894
736
  reflect: true
@@ -947,81 +789,11 @@ let BaseIcon$2 = class BaseIcon extends AuroElement$2 {
947
789
  }
948
790
  };
949
791
 
950
- var tokensCss$5 = i$5`:host{--ds-auro-icon-color:var(--ds-color-icon-primary-default, #676767);--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}`;
951
-
952
- var colorCss$6 = 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)}`;
953
-
954
- // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
955
- // See LICENSE in the project root for license information.
956
-
957
- // ---------------------------------------------------------------------
958
-
959
- /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
960
-
961
- let AuroLibraryRuntimeUtils$4 = class AuroLibraryRuntimeUtils {
962
-
963
- /* eslint-disable jsdoc/require-param */
964
-
965
- /**
966
- * This will register a new custom element with the browser.
967
- * @param {String} name - The name of the custom element.
968
- * @param {Object} componentClass - The class to register as a custom element.
969
- * @returns {void}
970
- */
971
- registerComponent(name, componentClass) {
972
- if (!customElements.get(name)) {
973
- customElements.define(name, class extends componentClass {});
974
- }
975
- }
976
-
977
- /**
978
- * Finds and returns the closest HTML Element based on a selector.
979
- * @returns {void}
980
- */
981
- closestElement(
982
- selector, // selector like in .closest()
983
- base = this, // extra functionality to skip a parent
984
- __Closest = (el, found = el && el.closest(selector)) =>
985
- !el || el === document || el === window
986
- ? null // standard .closest() returns null for non-found selectors also
987
- : found
988
- ? found // found a selector INside this element
989
- : __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
990
- ) {
991
- return __Closest(base);
992
- }
993
- /* eslint-enable jsdoc/require-param */
994
-
995
- /**
996
- * If the element passed is registered with a different tag name than what is passed in, the tag name is added as an attribute to the element.
997
- * @param {Object} elem - The element to check.
998
- * @param {String} tagName - The name of the Auro component to check for or add as an attribute.
999
- * @returns {void}
1000
- */
1001
- handleComponentTagRename(elem, tagName) {
1002
- const tag = tagName.toLowerCase();
1003
- const elemTag = elem.tagName.toLowerCase();
1004
-
1005
- if (elemTag !== tag) {
1006
- elem.setAttribute(tag, true);
1007
- }
1008
- }
1009
-
1010
- /**
1011
- * Validates if an element is a specific Auro component.
1012
- * @param {Object} elem - The element to validate.
1013
- * @param {String} tagName - The name of the Auro component to check against.
1014
- * @returns {Boolean} - Returns true if the element is the specified Auro component.
1015
- */
1016
- elementMatch(elem, tagName) {
1017
- const tag = tagName.toLowerCase();
1018
- const elemTag = elem.tagName.toLowerCase();
792
+ var tokensCss$4 = i$5`:host{--ds-auro-icon-color:var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-alaska-color:#02426D;--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}`;
1019
793
 
1020
- return elemTag === tag || elem.hasAttribute(tag);
1021
- }
1022
- };
794
+ var colorCss$6 = i$5`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[variant=accent1]){--ds-auro-icon-color:var(--ds-basic-color-texticon-accent1, #265688)}:host(:not([onDark])[variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:not([onDark])[variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-muted, #676767)}:host(:not([onDark])[variant=statusDefault]){--ds-auro-icon-color:var(--ds-basic-color-status-default, #afb9c6)}:host(:not([onDark])[variant=statusInfo]){--ds-auro-icon-color:var(--ds-basic-color-status-info, #01426a)}:host(:not([onDark])[variant=statusSuccess]){--ds-auro-icon-color:var(--ds-basic-color-status-success, #447a1f)}:host(:not([onDark])[variant=statusWarning]){--ds-auro-icon-color:var(--ds-basic-color-status-warning, #fac200)}:host(:not([onDark])[variant=statusError]){--ds-auro-icon-color:var(--ds-basic-color-status-error, #e31f26)}:host(:not([onDark])[variant=statusInfoSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-info-subtle, #ebf3f9)}:host(:not([onDark])[variant=statusSuccessSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-success-subtle, #d6eac7)}:host(:not([onDark])[variant=statusWarningSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-warning-subtle, #fff0b2)}:host(:not([onDark])[variant=statusErrorSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-error-subtle, #fbc6c6)}:host(:not([onDark])[variant=fareBasicEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-basiceconomy, #97eaf8)}:host(:not([onDark])[variant=fareBusiness]){--ds-auro-icon-color:var(--ds-basic-color-fare-business, #01426a)}:host(:not([onDark])[variant=fareEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-economy, #0074ca)}:host(:not([onDark])[variant=fareFirst]){--ds-auro-icon-color:var(--ds-basic-color-fare-first, #00274a)}:host(:not([onDark])[variant=farePremiumEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-premiumeconomy, #005154)}:host(:not([onDark])[variant=fareOneWorldEmerald]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-emerald, #139142)}:host(:not([onDark])[variant=fareOneWorldSapphire]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-sapphire, #015daa)}:host(:not([onDark])[variant=fareOneWorldRuby]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-ruby, #a41d4a)}:host([onDark]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse, #ffffff)}:host([onDark][variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([onDark][variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}`;
1023
795
 
1024
- // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
796
+ // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
1025
797
  // See LICENSE in the project root for license information.
1026
798
 
1027
799
 
@@ -1029,6 +801,7 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
1029
801
  constructor() {
1030
802
  super();
1031
803
 
804
+ this.variant = undefined;
1032
805
  this.privateDefaults();
1033
806
  }
1034
807
 
@@ -1038,22 +811,8 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
1038
811
  * @returns {void}
1039
812
  */
1040
813
  privateDefaults() {
1041
- this.accent = false;
1042
- this.customColor = false;
1043
- this.customSvg = false;
1044
- this.disabled = false;
1045
- this.emphasis = false;
1046
- this.error = false;
1047
- this.info = false;
1048
- this.label = false;
1049
- this.primary = false;
1050
- this.secondary = false;
1051
- this.subtle = false;
1052
- this.success = false;
1053
- this.tertiary = false;
1054
- this.warning = false;
1055
814
  this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
1056
- this.runtimeUtils = new AuroLibraryRuntimeUtils$4();
815
+ this.runtimeUtils = new AuroLibraryRuntimeUtils$3();
1057
816
  }
1058
817
 
1059
818
  // function to define props used within the scope of this component
@@ -1061,14 +820,6 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
1061
820
  return {
1062
821
  ...super.properties,
1063
822
 
1064
- /**
1065
- * Sets the icon to use the accent style.
1066
- */
1067
- accent: {
1068
- type: Boolean,
1069
- reflect: true
1070
- },
1071
-
1072
823
  /**
1073
824
  * Set aria-hidden value. Default is `true`. Option is `false`.
1074
825
  */
@@ -1099,38 +850,6 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
1099
850
  type: Boolean
1100
851
  },
1101
852
 
1102
- /**
1103
- * Sets the icon to use the disabled style.
1104
- */
1105
- disabled: {
1106
- type: Boolean,
1107
- reflect: true
1108
- },
1109
-
1110
- /**
1111
- * Sets the icon to use the emphasis style.
1112
- */
1113
- emphasis: {
1114
- type: Boolean,
1115
- reflect: true
1116
- },
1117
-
1118
- /**
1119
- * Sets the icon to use the error style.
1120
- */
1121
- error: {
1122
- type: Boolean,
1123
- reflect: true
1124
- },
1125
-
1126
- /**
1127
- * Sets the icon to use the info style.
1128
- */
1129
- info: {
1130
- type: Boolean,
1131
- reflect: true
1132
- },
1133
-
1134
853
  /**
1135
854
  * Exposes content in slot as icon label.
1136
855
  */
@@ -1148,50 +867,10 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
1148
867
  },
1149
868
 
1150
869
  /**
1151
- * DEPRECATED: Sets the icon to use the baseline primary icon style.
1152
- */
1153
- primary: {
1154
- type: Boolean,
1155
- reflect: true
1156
- },
1157
-
1158
- /**
1159
- * Sets the icon to use the secondary style.
870
+ * The style of the icon. The accepted variants are `accent1`, `disabled`, `muted`, `statusDefault`, `statusInfo`, `statusSuccess`, `statusWarning`, `statusError`, `statusInfoSubtle`, `statusSuccessSubtle`, `statusWarningSubtle`, `statusErrorSubtle`, `fareBasicEconomy`, `fareBusiness`, `fareEconomy`, `fareFirst`, `farePremiumEconomy`, `fareOneWorldEmerald`, `fareOneWorldSapphire`, `fareOneWorldRuby`.
1160
871
  */
1161
- secondary: {
1162
- type: Boolean,
1163
- reflect: true
1164
- },
1165
-
1166
- /**
1167
- * Sets the icon to use the subtle style.
1168
- */
1169
- subtle: {
1170
- type: Boolean,
1171
- reflect: true
1172
- },
1173
-
1174
- /**
1175
- * Sets the icon to use the success style.
1176
- */
1177
- success: {
1178
- type: Boolean,
1179
- reflect: true
1180
- },
1181
-
1182
- /**
1183
- * Sets the icon to use the tertiary style.
1184
- */
1185
- tertiary: {
1186
- type: Boolean,
1187
- reflect: true
1188
- },
1189
-
1190
- /**
1191
- * Sets the icon to use the warning style.
1192
- */
1193
- warning: {
1194
- type: Boolean,
872
+ variant: {
873
+ type: String,
1195
874
  reflect: true
1196
875
  }
1197
876
  };
@@ -1200,7 +879,7 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
1200
879
  static get styles() {
1201
880
  return [
1202
881
  super.styles,
1203
- i$5`${tokensCss$5}`,
882
+ i$5`${tokensCss$4}`,
1204
883
  i$5`${styleCss$7}`,
1205
884
  i$5`${colorCss$6}`
1206
885
  ];
@@ -1215,7 +894,7 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
1215
894
  *
1216
895
  */
1217
896
  static register(name = "auro-icon") {
1218
- AuroLibraryRuntimeUtils$4.prototype.registerComponent(name, AuroIcon);
897
+ AuroLibraryRuntimeUtils$3.prototype.registerComponent(name, AuroIcon);
1219
898
  }
1220
899
 
1221
900
  connectedCallback() {
@@ -1281,7 +960,7 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
1281
960
  }
1282
961
  };
1283
962
 
1284
- var iconVersion$2 = '7.0.1';
963
+ var iconVersion$2 = '8.0.1';
1285
964
 
1286
965
  // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
1287
966
  // See LICENSE in the project root for license information.
@@ -1289,7 +968,7 @@ var iconVersion$2 = '7.0.1';
1289
968
 
1290
969
  class AuroFormValidation {
1291
970
  constructor() {
1292
- this.runtimeUtils = new AuroLibraryRuntimeUtils$5();
971
+ this.runtimeUtils = new AuroLibraryRuntimeUtils$3();
1293
972
  }
1294
973
 
1295
974
  /**
@@ -1621,11 +1300,9 @@ var plusIcon = {"role":"img","color":"currentColor","title":"","desc":"","width"
1621
1300
 
1622
1301
  var minusIcon = {"role":"img","color":"currentColor","title":"","desc":"","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":"minus-lg","category":"interface","deprecated":true,"svg":"<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" aria-hidden=\"true\" class=\"ico_squareLarge\" data-deprecated=\"true\" 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/><path d=\"M5.75 12.75h12.5a.75.75 0 1 0 0-1.5H5.75a.75.75 0 1 0 0 1.5\"/></svg>"};
1623
1302
 
1624
- var tokensCss$4 = i$5`:host{--ds-auro-counter-text-default: var(--ds-color-text-primary-default, #2a2a2a);--ds-auro-counter-text-secondary: var(--ds-color-text-secondary-default, #525252);--ds-auro-counter-text-disabled: var(--ds-color-text-ui-disabled-default, #adadad);--ds-auro-counter-control-ui-active: var(--ds-color-ui-active-default, #054687);--ds-auro-counter-control-ui-hover: var(--ds-color-ui-hover-default, #054687);--ds-auro-counter-control-ui-disabled: var(--ds-color-ui-disabled-default, rgba(0, 116, 200, 0.2));--ds-auro-counter-control-ui-bkg: var(--ds-color-ui-bkg-default-default, rgba(0, 0, 0, 0.03));--ds-auro-counter-control-line-height: var(--ds-text-body-size-sm, 0.875rem);--ds-auro-counter-icon-color-default: var(--ds-color-ui-default-default, #0074c8);--ds-auro-counter-control-border-active: var(--ds-color-border-active-default, #0074c8)}`;
1625
-
1626
- var colorCss$5 = i$5`.counter{color:var(--ds-auro-counter-text-default)}[name=description]::slotted(*){color:var(--ds-auro-counter-text-secondary)}.controlIcon{color:var(--ds-auro-counter-icon-color-default)}.quantityWrapper{background-color:var(--ds-auro-counter-control-ui-bkg)}:host::part(counterControl):focus-visible{outline-color:var(--ds-auro-counter-control-border-active)}[disabled] .controlIcon,:host([disabled]) .controlIcon{color:var(--ds-auro-counter-control-ui-disabled)}[disabled] label,[disabled] [name=description]::slotted(*),[disabled]::part(counterControl),:host([disabled]) label,:host([disabled]) [name=description]::slotted(*),:host([disabled])::part(counterControl){color:var(--ds-auro-counter-text-disabled)}`;
1303
+ var colorCss$5 = i$5`.label{color:var(--ds-auro-counter-label-text-color)}[name=description]::slotted(*){color:var(--ds-auro-counter-description-text-color)}.controlIcon{color:var(--ds-auro-counter-icon-color)}.quantityWrapper{background-color:var(--ds-auro-counter-control-background-color);color:var(--ds-auro-counter-quantity-text-color)}:host::part(counterControl):focus-visible{outline-color:var(--ds-auro-counter-control-border-color)}[disabled],:host([disabled]){--ds-auro-counter-icon-color: var(--ds-basic-color-texticon-disabled, #d0d0d0);--ds-auro-counter-description-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0);--ds-auro-counter-label-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0);--ds-auro-counter-quantity-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}[onDark],:host([onDark]){--ds-auro-counter-description-text-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db);--ds-auro-counter-label-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-counter-quantity-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-counter-control-border-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-counter-control-background-color: var(--ds-advanced-color-button-tertiary-background-inverse, rgba(255, 255, 255, 0.05));--ds-auro-counter-icon-color: var(--ds-advanced-color-button-tertiary-text-inverse, #ffffff)}[onDark][disabled],:host([onDark][disabled]){--ds-auro-counter-label-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894);--ds-auro-counter-quantity-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894);--ds-auro-counter-icon-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}`;
1627
1304
 
1628
- var styleCss$6 = i$5`.counter{display:flex;align-items:center;justify-content:space-between;column-gap:var(--ds-size-150, 0.75rem)}.content{display:flex;flex-flow:column}[name=description]::slotted(*){display:block;font-size:var(--ds-text-body-size-xs, 0.75rem);line-height:var(--ds-size-200, 1rem)}.quantityWrapper{width:var(--ds-size-400, 2rem);height:calc(var(--ds-size-25, 0.125rem) + var(--ds-size-400, 2rem));align-content:center;cursor:default;font-size:var(--ds-size-250, 1.25rem);text-align:center}:host{position:relative}:host::part(counterControl){display:flex;border-radius:var(--ds-size-500, 2.5rem);line-height:0;touch-action:manipulation}:host::part(counterControl):focus-visible{outline-offset:0;outline-style:solid;outline-width:var(--ds-size-25, 0.125rem)}:host::part(controlMinus){--ds-auro-counter-control-border-radius: var(--ds-size-500, 2.5rem) 0 0 var(--ds-size-500, 2.5rem);--ds-auro-counter-control-padding: var(--ds-size-50, 0.25rem) var(--ds-size-50, 0.25rem) var(--ds-size-50, 0.25rem) var(--ds-size-100, 0.5rem)}:host::part(controlPlus){--ds-auro-counter-control-border-radius: 0 var(--ds-size-500, 2.5rem) var(--ds-size-500, 2.5rem) 0;--ds-auro-counter-control-padding: var(--ds-size-50, 0.25rem) var(--ds-size-100, 0.5rem) var(--ds-size-50, 0.25rem) var(--ds-size-50, 0.25rem)}auro-counter-button{display:flex}`;
1305
+ var styleCss$6 = i$5`.counter{display:flex;align-items:center;justify-content:space-between;column-gap:var(--ds-size-150, 0.75rem)}.content{display:flex;flex-flow:column}[name=description]::slotted(*){display:block;font-size:var(--ds-text-body-size-xs, 0.75rem);line-height:var(--ds-size-200, 1rem)}.quantityWrapper{width:var(--ds-size-400, 2rem);height:calc(var(--ds-size-25, 0.125rem) + var(--ds-size-400, 2rem));align-content:center;cursor:default;font-size:var(--ds-size-250, 1.25rem);text-align:center}:host{position:relative}:host::part(counterControl){display:flex;border-radius:var(--ds-size-500, 2.5rem);line-height:0;touch-action:manipulation}:host::part(counterControl):focus-visible{outline-offset:0;outline-style:solid;outline-width:var(--ds-size-25, 0.125rem)}:host::part(controlMinus){--ds-auro-counter-control-border-radius: var(--ds-size-500, $ds-size-500) 0 0 var(--ds-size-500, $ds-size-500);--ds-auro-counter-control-padding: var(--ds-size-50, $ds-size-50) var(--ds-size-50, $ds-size-50) var(--ds-size-50, $ds-size-50) var(--ds-size-100, $ds-size-100)}:host::part(controlPlus){--ds-auro-counter-control-border-radius: 0 var(--ds-size-500, $ds-size-500) var(--ds-size-500, $ds-size-500) 0;--ds-auro-counter-control-padding: var(--ds-size-50, $ds-size-50) var(--ds-size-100, $ds-size-100) var(--ds-size-50, $ds-size-50) var(--ds-size-50, $ds-size-50)}auro-counter-button{display:flex}`;
1629
1306
 
1630
1307
  /* eslint-disable lit/binding-positions, lit/no-invalid-html, max-lines */
1631
1308
  // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
@@ -1653,6 +1330,7 @@ class AuroCounter extends r {
1653
1330
  this.disableMin = false;
1654
1331
  this.max = 9;
1655
1332
  this.min = 0;
1333
+ this.onDark = false;
1656
1334
  this.validity = undefined;
1657
1335
  this.value = undefined;
1658
1336
 
@@ -1750,6 +1428,14 @@ class AuroCounter extends r {
1750
1428
  reflect: true,
1751
1429
  },
1752
1430
 
1431
+ /**
1432
+ * If declared, the counter will be rendered with onDark styles.
1433
+ */
1434
+ onDark: {
1435
+ type: Boolean,
1436
+ reflect: true
1437
+ },
1438
+
1753
1439
  /**
1754
1440
  * The validity state of the counter.
1755
1441
  */
@@ -1774,12 +1460,12 @@ class AuroCounter extends r {
1774
1460
  * AuroCounter.register("custom-counter") // registers <custom-counter/>
1775
1461
  */
1776
1462
  static register(name = "auro-counter") {
1777
- AuroLibraryRuntimeUtils$5.prototype.registerComponent(name, AuroCounter);
1463
+ AuroLibraryRuntimeUtils$3.prototype.registerComponent(name, AuroCounter);
1778
1464
  }
1779
1465
 
1780
1466
  static get styles() {
1781
1467
  return [
1782
- tokensCss$4,
1468
+ tokensCss$7,
1783
1469
  colorCss$5,
1784
1470
  styleCss$6
1785
1471
  ];
@@ -1924,6 +1610,7 @@ class AuroCounter extends r {
1924
1610
  tabindex="-1"
1925
1611
  part="controlMinus"
1926
1612
  @click="${() => this.decrement()}"
1613
+ ?onDark="${this.onDark}"
1927
1614
  ?disabled="${this.disabled || this.disableMin || this.isIncrementDisabled(this.min)}"
1928
1615
  >
1929
1616
  <${this.iconTag} class="controlIcon" slot="icon" customSvg> ${IconUtil.generateSvgHtml(minusIcon)} </${this.iconTag}>
@@ -1939,6 +1626,7 @@ class AuroCounter extends r {
1939
1626
  tabindex="-1"
1940
1627
  part="controlPlus"
1941
1628
  @click="${() => this.increment()}"
1629
+ ?onDark="${this.onDark}"
1942
1630
  ?disabled="${this.disabled || this.disableMax || this.isIncrementDisabled(this.max)}"
1943
1631
  >
1944
1632
  <${this.iconTag} class="controlIcon" slot="icon" customSvg> ${IconUtil.generateSvgHtml(plusIcon)} </${this.iconTag}>
@@ -1958,7 +1646,7 @@ var styleCss$5 = i$5`:host{position:relative;display:block}[slot=trigger],::slot
1958
1646
 
1959
1647
  /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
1960
1648
 
1961
- let AuroLibraryRuntimeUtils$2$1 = class AuroLibraryRuntimeUtils {
1649
+ let AuroLibraryRuntimeUtils$1$1 = class AuroLibraryRuntimeUtils {
1962
1650
 
1963
1651
  /* eslint-disable jsdoc/require-param */
1964
1652
 
@@ -4259,7 +3947,7 @@ const cacheFetch$1 = (uri, options = {}) => {
4259
3947
  return _fetchMap$1.get(uri);
4260
3948
  };
4261
3949
 
4262
- var styleCss$3$1 = i$5`: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}.componentWrapper{display:flex}.svgWrapper{height:var(--ds-auro-icon-size);width:var(--ds-auro-icon-size)}.labelWrapper{margin-left:var(--ds-size-50, 0.25rem);line-height:1.8}`;
3950
+ var styleCss$3$1 = i$5`: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}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}.componentWrapper{display:flex}.svgWrapper{height:var(--ds-auro-icon-size);width:var(--ds-auro-icon-size)}.labelWrapper{margin-left:var(--ds-size-50, 0.25rem);line-height:1.8}`;
4263
3951
 
4264
3952
  // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
4265
3953
  // See LICENSE in the project root for license information.
@@ -4267,7 +3955,6 @@ var styleCss$3$1 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}
4267
3955
 
4268
3956
  // See https://git.io/JJ6SJ for "How to document your components using JSDoc"
4269
3957
  /**
4270
- * @attr {Boolean} onDark - Set value for on-dark version of auro-icon
4271
3958
  * @slot - Hidden from visibility, used for a11y if icon description is needed
4272
3959
  */
4273
3960
 
@@ -4282,6 +3969,10 @@ let BaseIcon$1 = class BaseIcon extends AuroElement$1 {
4282
3969
  static get properties() {
4283
3970
  return {
4284
3971
  ...super.properties,
3972
+
3973
+ /**
3974
+ * Set value for on-dark version of auro-icon.
3975
+ */
4285
3976
  onDark: {
4286
3977
  type: Boolean,
4287
3978
  reflect: true
@@ -4336,85 +4027,15 @@ let BaseIcon$1 = class BaseIcon extends AuroElement$1 {
4336
4027
 
4337
4028
  this.svg = penDOM.body.firstChild;
4338
4029
  }
4339
- }
4340
- }
4341
- };
4342
-
4343
- var tokensCss$2 = i$5`:host{--ds-auro-icon-color:var(--ds-color-icon-primary-default, #676767);--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}`;
4344
-
4345
- 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)}`;
4346
-
4347
- // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
4348
- // See LICENSE in the project root for license information.
4349
-
4350
- // ---------------------------------------------------------------------
4351
-
4352
- /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
4353
-
4354
- let AuroLibraryRuntimeUtils$1$1 = class AuroLibraryRuntimeUtils {
4355
-
4356
- /* eslint-disable jsdoc/require-param */
4357
-
4358
- /**
4359
- * This will register a new custom element with the browser.
4360
- * @param {String} name - The name of the custom element.
4361
- * @param {Object} componentClass - The class to register as a custom element.
4362
- * @returns {void}
4363
- */
4364
- registerComponent(name, componentClass) {
4365
- if (!customElements.get(name)) {
4366
- customElements.define(name, class extends componentClass {});
4367
- }
4368
- }
4369
-
4370
- /**
4371
- * Finds and returns the closest HTML Element based on a selector.
4372
- * @returns {void}
4373
- */
4374
- closestElement(
4375
- selector, // selector like in .closest()
4376
- base = this, // extra functionality to skip a parent
4377
- __Closest = (el, found = el && el.closest(selector)) =>
4378
- !el || el === document || el === window
4379
- ? null // standard .closest() returns null for non-found selectors also
4380
- : found
4381
- ? found // found a selector INside this element
4382
- : __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
4383
- ) {
4384
- return __Closest(base);
4385
- }
4386
- /* eslint-enable jsdoc/require-param */
4387
-
4388
- /**
4389
- * If the element passed is registered with a different tag name than what is passed in, the tag name is added as an attribute to the element.
4390
- * @param {Object} elem - The element to check.
4391
- * @param {String} tagName - The name of the Auro component to check for or add as an attribute.
4392
- * @returns {void}
4393
- */
4394
- handleComponentTagRename(elem, tagName) {
4395
- const tag = tagName.toLowerCase();
4396
- const elemTag = elem.tagName.toLowerCase();
4397
-
4398
- if (elemTag !== tag) {
4399
- elem.setAttribute(tag, true);
4400
- }
4401
- }
4402
-
4403
- /**
4404
- * Validates if an element is a specific Auro component.
4405
- * @param {Object} elem - The element to validate.
4406
- * @param {String} tagName - The name of the Auro component to check against.
4407
- * @returns {Boolean} - Returns true if the element is the specified Auro component.
4408
- */
4409
- elementMatch(elem, tagName) {
4410
- const tag = tagName.toLowerCase();
4411
- const elemTag = elem.tagName.toLowerCase();
4412
-
4413
- return elemTag === tag || elem.hasAttribute(tag);
4030
+ }
4414
4031
  }
4415
4032
  };
4416
4033
 
4417
- // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
4034
+ var tokensCss$2 = i$5`:host{--ds-auro-icon-color:var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-alaska-color:#02426D;--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}`;
4035
+
4036
+ var colorCss$3 = i$5`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[variant=accent1]){--ds-auro-icon-color:var(--ds-basic-color-texticon-accent1, #265688)}:host(:not([onDark])[variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:not([onDark])[variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-muted, #676767)}:host(:not([onDark])[variant=statusDefault]){--ds-auro-icon-color:var(--ds-basic-color-status-default, #afb9c6)}:host(:not([onDark])[variant=statusInfo]){--ds-auro-icon-color:var(--ds-basic-color-status-info, #01426a)}:host(:not([onDark])[variant=statusSuccess]){--ds-auro-icon-color:var(--ds-basic-color-status-success, #447a1f)}:host(:not([onDark])[variant=statusWarning]){--ds-auro-icon-color:var(--ds-basic-color-status-warning, #fac200)}:host(:not([onDark])[variant=statusError]){--ds-auro-icon-color:var(--ds-basic-color-status-error, #e31f26)}:host(:not([onDark])[variant=statusInfoSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-info-subtle, #ebf3f9)}:host(:not([onDark])[variant=statusSuccessSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-success-subtle, #d6eac7)}:host(:not([onDark])[variant=statusWarningSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-warning-subtle, #fff0b2)}:host(:not([onDark])[variant=statusErrorSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-error-subtle, #fbc6c6)}:host(:not([onDark])[variant=fareBasicEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-basiceconomy, #97eaf8)}:host(:not([onDark])[variant=fareBusiness]){--ds-auro-icon-color:var(--ds-basic-color-fare-business, #01426a)}:host(:not([onDark])[variant=fareEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-economy, #0074ca)}:host(:not([onDark])[variant=fareFirst]){--ds-auro-icon-color:var(--ds-basic-color-fare-first, #00274a)}:host(:not([onDark])[variant=farePremiumEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-premiumeconomy, #005154)}:host(:not([onDark])[variant=fareOneWorldEmerald]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-emerald, #139142)}:host(:not([onDark])[variant=fareOneWorldSapphire]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-sapphire, #015daa)}:host(:not([onDark])[variant=fareOneWorldRuby]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-ruby, #a41d4a)}:host([onDark]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse, #ffffff)}:host([onDark][variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([onDark][variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}`;
4037
+
4038
+ // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
4418
4039
  // See LICENSE in the project root for license information.
4419
4040
 
4420
4041
 
@@ -4422,6 +4043,7 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
4422
4043
  constructor() {
4423
4044
  super();
4424
4045
 
4046
+ this.variant = undefined;
4425
4047
  this.privateDefaults();
4426
4048
  }
4427
4049
 
@@ -4431,20 +4053,6 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
4431
4053
  * @returns {void}
4432
4054
  */
4433
4055
  privateDefaults() {
4434
- this.accent = false;
4435
- this.customColor = false;
4436
- this.customSvg = false;
4437
- this.disabled = false;
4438
- this.emphasis = false;
4439
- this.error = false;
4440
- this.info = false;
4441
- this.label = false;
4442
- this.primary = false;
4443
- this.secondary = false;
4444
- this.subtle = false;
4445
- this.success = false;
4446
- this.tertiary = false;
4447
- this.warning = false;
4448
4056
  this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
4449
4057
  this.runtimeUtils = new AuroLibraryRuntimeUtils$1$1();
4450
4058
  }
@@ -4454,14 +4062,6 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
4454
4062
  return {
4455
4063
  ...super.properties,
4456
4064
 
4457
- /**
4458
- * Sets the icon to use the accent style.
4459
- */
4460
- accent: {
4461
- type: Boolean,
4462
- reflect: true
4463
- },
4464
-
4465
4065
  /**
4466
4066
  * Set aria-hidden value. Default is `true`. Option is `false`.
4467
4067
  */
@@ -4492,38 +4092,6 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
4492
4092
  type: Boolean
4493
4093
  },
4494
4094
 
4495
- /**
4496
- * Sets the icon to use the disabled style.
4497
- */
4498
- disabled: {
4499
- type: Boolean,
4500
- reflect: true
4501
- },
4502
-
4503
- /**
4504
- * Sets the icon to use the emphasis style.
4505
- */
4506
- emphasis: {
4507
- type: Boolean,
4508
- reflect: true
4509
- },
4510
-
4511
- /**
4512
- * Sets the icon to use the error style.
4513
- */
4514
- error: {
4515
- type: Boolean,
4516
- reflect: true
4517
- },
4518
-
4519
- /**
4520
- * Sets the icon to use the info style.
4521
- */
4522
- info: {
4523
- type: Boolean,
4524
- reflect: true
4525
- },
4526
-
4527
4095
  /**
4528
4096
  * Exposes content in slot as icon label.
4529
4097
  */
@@ -4541,50 +4109,10 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
4541
4109
  },
4542
4110
 
4543
4111
  /**
4544
- * DEPRECATED: Sets the icon to use the baseline primary icon style.
4545
- */
4546
- primary: {
4547
- type: Boolean,
4548
- reflect: true
4549
- },
4550
-
4551
- /**
4552
- * Sets the icon to use the secondary style.
4553
- */
4554
- secondary: {
4555
- type: Boolean,
4556
- reflect: true
4557
- },
4558
-
4559
- /**
4560
- * Sets the icon to use the subtle style.
4561
- */
4562
- subtle: {
4563
- type: Boolean,
4564
- reflect: true
4565
- },
4566
-
4567
- /**
4568
- * Sets the icon to use the success style.
4569
- */
4570
- success: {
4571
- type: Boolean,
4572
- reflect: true
4573
- },
4574
-
4575
- /**
4576
- * Sets the icon to use the tertiary style.
4577
- */
4578
- tertiary: {
4579
- type: Boolean,
4580
- reflect: true
4581
- },
4582
-
4583
- /**
4584
- * Sets the icon to use the warning style.
4112
+ * The style of the icon. The accepted variants are `accent1`, `disabled`, `muted`, `statusDefault`, `statusInfo`, `statusSuccess`, `statusWarning`, `statusError`, `statusInfoSubtle`, `statusSuccessSubtle`, `statusWarningSubtle`, `statusErrorSubtle`, `fareBasicEconomy`, `fareBusiness`, `fareEconomy`, `fareFirst`, `farePremiumEconomy`, `fareOneWorldEmerald`, `fareOneWorldSapphire`, `fareOneWorldRuby`.
4585
4113
  */
4586
- warning: {
4587
- type: Boolean,
4114
+ variant: {
4115
+ type: String,
4588
4116
  reflect: true
4589
4117
  }
4590
4118
  };
@@ -4680,7 +4208,7 @@ var styleCss$2$1 = i$5`:host{position:absolute;z-index:var(--depth-tooltip, 400)
4680
4208
 
4681
4209
  var colorCss$2$1 = i$5`.container{background-color:var(--ds-auro-dropdownbib-container-color);box-shadow:var(--ds-auro-dropdownbib-boxshadow-color);color:var(--ds-auro-dropdownbib-text-color)}`;
4682
4210
 
4683
- var tokensCss$1 = i$5`:host{--ds-auro-dropdown-label-text-color: var(--ds-color-text-secondary-default, #525252);--ds-auro-dropdown-popover-container-color: var(--ds-color-container-primary-default, #ffffff);--ds-auro-dropdown-popover-border-color: transparent;--ds-auro-dropdown-popover-text-color: var(--ds-color-text-primary-default, #2a2a2a);--ds-auro-dropdown-trigger-container-color: var(--ds-color-container-primary-default, #ffffff);--ds-auro-dropdown-trigger-border-color: transparent;--ds-auro-dropdown-trigger-outline-color: transparent;--ds-auro-dropdown-trigger-text-color: var(--ds-color-text-primary-default, #2a2a2a);--ds-auro-dropdownbib-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-container-color: var(--ds-color-container-primary-default, #ffffff);--ds-auro-dropdownbib-text-color: var(--ds-color-text-primary-default, #2a2a2a)}`;
4211
+ var tokensCss$1 = i$5`:host{--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-dropdown-trigger-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-border-color: transparent;--ds-auro-dropdown-trigger-outline-color: transparent;--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-dropdownbib-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdownbib-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}`;
4684
4212
 
4685
4213
  // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
4686
4214
  // See LICENSE in the project root for license information.
@@ -4710,7 +4238,7 @@ class AuroDropdownBib extends r {
4710
4238
  */
4711
4239
  this._mobileBreakpointValue = undefined;
4712
4240
 
4713
- AuroLibraryRuntimeUtils$2$1.prototype.handleComponentTagRename(this, 'auro-dropdownbib');
4241
+ AuroLibraryRuntimeUtils$1$1.prototype.handleComponentTagRename(this, 'auro-dropdownbib');
4714
4242
  }
4715
4243
 
4716
4244
  static get styles() {
@@ -4803,13 +4331,13 @@ var dropdownVersion$1 = '3.0.0';
4803
4331
 
4804
4332
  var styleCss$1$1 = i$5`:host{position:relative;display:inline-block;max-width:100%}:host([fluid]){display:block}#bibSizer{position:absolute;z-index:-1;opacity:0;pointer-events:none}.label{font-size:var(--ds-text-body-size-xs, 0.75rem);line-height:var(--ds-text-body-size-default, 1rem);transition:font-size .3s cubic-bezier(0.215, 0.61, 0.355, 1);white-space:normal}.label[hasTrigger=false]{font-size:var(--ds-text-body-size-default, 1rem)}.trigger{position:relative;display:flex;align-items:center}.trigger[showBorder]{border-width:1px;border-style:solid;cursor:pointer;outline-style:solid;outline-width:1px}@media(hover: hover){.trigger:hover{cursor:pointer}}.triggerContentWrapper{overflow:hidden;flex:1;text-overflow:ellipsis;white-space:nowrap}#showStateIcon{display:flex;overflow:hidden;height:100%;align-items:center;margin-left:var(--ds-size-100, 0.5rem)}#showStateIcon [auro-icon]{height:var(--ds-size-300, 1.5rem);line-height:var(--ds-size-300, 1.5rem)}#showStateIcon[data-expanded=true] [auro-icon]{transform:rotate(-180deg)}:host([matchwidth]) #bibSizer{width:100%}:host([disabled]){pointer-events:none}:host([inset]) .trigger{padding:var(--ds-size-150, 0.75rem) var(--ds-size-200, 1rem)}:host([common]) .trigger,:host([inset][bordered]) .trigger{padding:var(--ds-size-200, 1rem) var(--ds-size-150, 0.75rem)}:host([inset][bordered][labeled]) .trigger{padding:var(--ds-size-100, 0.5rem) var(--ds-size-150, 0.75rem)}:host([common]) .trigger,:host([rounded]) .trigger{border-radius:var(--ds-border-radius, 0.375rem)}`;
4805
4333
 
4806
- var colorCss$1$1 = i$5`.label{color:var(--ds-auro-dropdown-label-text-color)}.trigger{border-color:var(--ds-auro-dropdown-trigger-border-color);background-color:var(--ds-auro-dropdown-trigger-container-color);color:var(--ds-auro-dropdown-trigger-text-color);outline-color:var(--ds-auro-dropdown-trigger-outline-color)}.trigger:focus-within,.trigger:active{--ds-auro-dropdown-trigger-border-color: var(--ds-color-border-active-default, #0074c8);--ds-auro-dropdown-trigger-outline-color: var(--ds-color-border-active-default, #0074c8)}.trigger:focus-within:not(:active){--ds-auro-dropdown-trigger-border-color: var(--ds-color-border-ui-focus-default, #2c67b5);--ds-auro-dropdown-trigger-outline-color: var(--ds-color-border-ui-focus-default, #2c67b5)}.trigger:hover{--ds-auro-dropdown-trigger-container-color: var(--ds-color-container-ui-secondary-hover-default, rgba(0, 0, 0, 0.03))}:host([disabled]){--ds-auro-dropdown-trigger-text-color: var(--ds-color-text-ui-disabled-default, #adadad);--ds-auro-dropdown-label-text-color: var(--ds-color-text-ui-disabled-default, #adadad)}:host([common]),:host([bordered]){--ds-auro-dropdown-trigger-border-color: var(--ds-color-border-primary-default, #585e67)}:host([common]) .trigger:active,:host([common]) .trigger:focus-within,:host([bordered]) .trigger:active,:host([bordered]) .trigger:focus-within{--ds-auro-dropdown-trigger-border-color: var(--ds-color-border-ui-focus-default, #2c67b5)}:host([error]){--ds-auro-dropdown-trigger-border-color: var(--ds-color-border-error-default, #cc1816)}:host([error]) .trigger{outline:solid 1px var(--ds-auro-dropdown-trigger-border-color)}:host([error]) .trigger:focus-within,:host([error]) .trigger:active{--ds-auro-dropdown-trigger-border-color: var(--ds-color-border-active-default, #0074c8)}:host([error]) .trigger:active{box-shadow:none;outline:none}:host([disabled][common]),:host([disabled][bordered]){--ds-auro-dropdown-trigger-border-color: var(--ds-color-border-ui-disabled-default, #adadad)}`;
4334
+ var colorCss$1$1 = i$5`.label{color:var(--ds-auro-dropdown-label-text-color)}.trigger{border-color:var(--ds-auro-dropdown-trigger-border-color);background-color:var(--ds-auro-dropdown-trigger-container-color);color:var(--ds-auro-dropdown-trigger-text-color);outline-color:var(--ds-auro-dropdown-trigger-outline-color)}.trigger:focus-within,.trigger:active{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused, #01426a);--ds-auro-dropdown-trigger-outline-color: var(--ds-advanced-color-state-focused, #01426a)}:host([disabled]){--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0);--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host([common]),:host([bordered]){--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-bold, #585e67)}:host([common]) .trigger:active,:host([common]) .trigger:focus-within,:host([bordered]) .trigger:active,:host([bordered]) .trigger:focus-within{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused, #01426a)}:host([error]){--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-status-error, #e31f26)}:host([error]) .trigger{outline:solid 1px var(--ds-auro-dropdown-trigger-border-color)}:host([error]) .trigger:focus-within,:host([error]) .trigger:active{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused, #01426a);--ds-auro-dropdown-trigger-outline-color: var(--ds-advanced-color-state-focused, #01426a)}:host([disabled][common]),:host([disabled][bordered]){--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-subtle, #dddddd)}:host([onDark]){--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db);--ds-auro-dropdown-trigger-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-inverse, #ffffff)}:host([onDark]):focus-within,:host([onDark]):active{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-dropdown-trigger-outline-color: var(--ds-advanced-color-state-focused-inverse, #ffffff)}:host([onDark][disabled]){--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894);--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([onDark][common]),:host([onDark][bordered]){--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-inverse, #ffffff)}:host([onDark][common]) .trigger:focus-within,:host([onDark][common]) .trigger:active,:host([onDark][bordered]) .trigger:focus-within,:host([onDark][bordered]) .trigger:active{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-dropdown-trigger-outline-color: var(--ds-advanced-color-state-focused-inverse, #ffffff)}:host([onDark][error]){--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8)}:host([onDark][error]) .trigger{outline:solid 1px var(--ds-auro-dropdown-trigger-border-color)}:host([onDark][error]) .trigger:focus-within,:host([onDark][error]) .trigger:active{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-dropdown-trigger-outline-color: var(--ds-advanced-color-state-focused-inverse, #ffffff)}:host([onDark][disabled][common]),:host([onDark][disabled][bordered]){--ds-auro-dropdown-trigger-container-color: var(--ds-advanced-color-shared-background-inverse-disabled, rgba(255, 255, 255, 0.1))}`;
4807
4335
 
4808
- var colorCss$4 = i$5`:host([error]){--ds-auro-helptext-color: var(--ds-color-text-error-default, #cc1816)}.helptext-wrapper{color:var(--ds-auro-helptext-color)}`;
4336
+ var colorCss$4 = i$5`:host([error]){--ds-auro-helptext-color: var(--ds-basic-color-status-error, #e31f26)}:host([onDark]){--ds-auro-helptext-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}:host([onDark][error]){--ds-auro-helptext-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8)}.helptext-wrapper{color:var(--ds-auro-helptext-color)}`;
4809
4337
 
4810
4338
  var styleCss$4 = i$5`.helptext-wrapper{display:none;font-size:var(--ds-text-body-size-xs, 0.75rem);line-height:var(--ds-size-200, 1rem)}:host([large]) .helptext-wrapper{font-size:var(--ds-text-body-size-default, 1rem)}.helptext-wrapper[visible]{display:block}::slotted(*:not(:empty)){margin-top:var(--ds-size-50, 0.25rem);margin-bottom:0}::slotted(p){margin-block:0}`;
4811
4339
 
4812
- var tokensCss$3 = i$5`:host{--ds-auro-helptext-color: var(--ds-color-text-tertiary-default, #6a717c)}`;
4340
+ var tokensCss$3 = i$5`:host{--ds-auro-helptext-color: var(--ds-basic-color-texticon-muted, #676767)}`;
4813
4341
 
4814
4342
  // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
4815
4343
  // See LICENSE in the project root for license information.
@@ -4818,7 +4346,7 @@ var tokensCss$3 = i$5`:host{--ds-auro-helptext-color: var(--ds-color-text-tertia
4818
4346
 
4819
4347
  /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
4820
4348
 
4821
- let AuroLibraryRuntimeUtils$3 = class AuroLibraryRuntimeUtils {
4349
+ let AuroLibraryRuntimeUtils$2 = class AuroLibraryRuntimeUtils {
4822
4350
 
4823
4351
  /* eslint-disable jsdoc/require-param */
4824
4352
 
@@ -4896,9 +4424,10 @@ class AuroHelpText extends r {
4896
4424
  super();
4897
4425
 
4898
4426
  this.error = false;
4427
+ this.onDark = false;
4899
4428
  this.hasTextContent = false;
4900
4429
 
4901
- AuroLibraryRuntimeUtils$3.prototype.handleComponentTagRename(this, 'auro-helptext');
4430
+ AuroLibraryRuntimeUtils$2.prototype.handleComponentTagRename(this, 'auro-helptext');
4902
4431
  }
4903
4432
 
4904
4433
  static get styles() {
@@ -4934,6 +4463,14 @@ class AuroHelpText extends r {
4934
4463
  type: Boolean,
4935
4464
  reflect: true,
4936
4465
  },
4466
+
4467
+ /**
4468
+ * If declared, will apply onDark styles.
4469
+ */
4470
+ onDark: {
4471
+ type: Boolean,
4472
+ reflect: true
4473
+ }
4937
4474
  };
4938
4475
  }
4939
4476
 
@@ -4946,7 +4483,7 @@ class AuroHelpText extends r {
4946
4483
  *
4947
4484
  */
4948
4485
  static register(name = "auro-helptext") {
4949
- AuroLibraryRuntimeUtils$3.prototype.registerComponent(name, AuroHelpText);
4486
+ AuroLibraryRuntimeUtils$2.prototype.registerComponent(name, AuroHelpText);
4950
4487
  }
4951
4488
 
4952
4489
  updated() {
@@ -5065,6 +4602,7 @@ class AuroDropdown extends r {
5065
4602
  this.tabIndex = 0;
5066
4603
  this.noToggle = false;
5067
4604
  this.labeled = true;
4605
+ this.onDark = false;
5068
4606
 
5069
4607
  // floaterConfig
5070
4608
  this.placement = 'bottom-start';
@@ -5085,7 +4623,7 @@ class AuroDropdown extends r {
5085
4623
  /**
5086
4624
  * @private
5087
4625
  */
5088
- this.runtimeUtils = new AuroLibraryRuntimeUtils$2$1();
4626
+ this.runtimeUtils = new AuroLibraryRuntimeUtils$1$1();
5089
4627
 
5090
4628
  /**
5091
4629
  * @private
@@ -5321,6 +4859,14 @@ class AuroDropdown extends r {
5321
4859
  reflect: true
5322
4860
  },
5323
4861
 
4862
+ /**
4863
+ * If declared, onDark styles will be applied.
4864
+ */
4865
+ onDark: {
4866
+ type: Boolean,
4867
+ reflect: true
4868
+ },
4869
+
5324
4870
  onSlotChange: {
5325
4871
  type: Function,
5326
4872
  reflect: false
@@ -5374,7 +4920,7 @@ class AuroDropdown extends r {
5374
4920
  *
5375
4921
  */
5376
4922
  static register(name = "auro-dropdown") {
5377
- AuroLibraryRuntimeUtils$2$1.prototype.registerComponent(name, AuroDropdown);
4923
+ AuroLibraryRuntimeUtils$1$1.prototype.registerComponent(name, AuroDropdown);
5378
4924
  }
5379
4925
 
5380
4926
  connectedCallback() {
@@ -5691,14 +5237,14 @@ class AuroDropdown extends r {
5691
5237
  <${this.iconTag}
5692
5238
  category="interface"
5693
5239
  name="chevron-down"
5694
- customColor
5695
- ?disabled=${this.disabled}
5240
+ ?onDark="${this.onDark}"
5241
+ variant="${this.disabled ? 'disabled' : 'muted'}">
5696
5242
  >
5697
5243
  </${this.iconTag}>
5698
5244
  </div>
5699
5245
  ` : undefined }
5700
5246
  </div>
5701
- <${this.helpTextTag} part="helpText" ?error="${this.error}">
5247
+ <${this.helpTextTag} part="helpText" ?onDark=${this.onDark} ?error="${this.error}">
5702
5248
  <slot name="helpText"></slot>
5703
5249
  </${this.helpTextTag}>
5704
5250
  <div class="slotContent">
@@ -5723,9 +5269,9 @@ var dropdownVersion = '3.0.0';
5723
5269
 
5724
5270
  var colorCss$1 = i$5`#headerContainer{box-shadow:var(--ds-auro-dropdownbib-header-boxshadow-color)}#footerContainer{background-color:var(--ds-auro-dropdownbib-footer-container-color)}`;
5725
5271
 
5726
- var styleCss$2 = i$5`#bibTemplate{display:flex;overflow:hidden;height:100%;max-height:100%;flex-direction:column}#headerContainer{display:flex;flex-direction:column}#header{display:flex;width:100%;min-height:var(--ds-size-1000, 5rem);box-sizing:border-box;align-items:end;padding-top:var(--ds-size-400, 2rem);padding-right:var(--ds-size-700, 3.5rem);padding-left:var(--ds-size-200, 1rem);pointer-events:none}#subheader{width:100%}#subheader ::slotted([auro-input]){padding:0 var(--ds-size-200, 1rem)}#closeButton{position:absolute;top:var(--ds-size-400, 2rem);right:var(--ds-size-200, 1rem);border:none;background-color:transparent;cursor:pointer}#closeButton [auro-icon]{--ds-auro-icon-size: var(--ds-size-500, $ds-size-500)}#bodyContainer{position:relative;overflow:auto;flex:1 1 100%}:host([isfullscreen]) #bibTemplate{max-height:100dvh}:host([isfullscreen]) #bodyContainer{margin-top:var(--ds-size-100, 0.5rem)}#footerContainer{position:absolute;right:0;bottom:0;left:0;padding:var(--ds-size-200, 1rem)}`;
5272
+ var styleCss$2 = i$5`#bibTemplate{display:flex;overflow:hidden;height:100%;max-height:100%;flex-direction:column}#headerContainer{display:flex;flex-direction:column}#header{display:flex;width:100%;min-height:var(--ds-size-1000, 5rem);box-sizing:border-box;align-items:end;padding-top:var(--ds-size-400, 2rem);padding-right:var(--ds-size-700, 3.5rem);padding-left:var(--ds-size-200, 1rem);pointer-events:none}#subheader{width:100%}#subheader ::slotted([auro-input]){padding:0 var(--ds-size-200, 1rem)}#closeButton{position:absolute;top:var(--ds-size-400, 2rem);right:var(--ds-size-200, 1rem);border:none;background-color:transparent;cursor:pointer}#closeButton [auro-icon]{--ds-auro-icon-size: var(--ds-size-500, 2.5rem)}#bodyContainer{position:relative;overflow:auto;flex:1 1 100%}:host([isfullscreen]) #bibTemplate{max-height:100dvh}:host([isfullscreen]) #bodyContainer{margin-top:var(--ds-size-100, 0.5rem)}#footerContainer{position:absolute;right:0;bottom:0;left:0;padding:var(--ds-size-200, 1rem)}`;
5727
5273
 
5728
- var tokenCss = i$5`:host{--ds-auro-dropdownbib-header-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-footer-container-color: var(--ds-color-container-primary-default, #ffffff)}`;
5274
+ var tokenCss = i$5`:host{--ds-auro-dropdownbib-header-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-footer-container-color: var(--ds-basic-color-surface-default, #ffffff)}`;
5729
5275
 
5730
5276
  // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
5731
5277
  // See LICENSE in the project root for license information.
@@ -5734,7 +5280,7 @@ var tokenCss = i$5`:host{--ds-auro-dropdownbib-header-boxshadow-color: var(--ds-
5734
5280
 
5735
5281
  /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
5736
5282
 
5737
- let AuroLibraryRuntimeUtils$2 = class AuroLibraryRuntimeUtils {
5283
+ let AuroLibraryRuntimeUtils$1 = class AuroLibraryRuntimeUtils {
5738
5284
 
5739
5285
  /* eslint-disable jsdoc/require-param */
5740
5286
 
@@ -5903,7 +5449,7 @@ const cacheFetch = (uri, options = {}) => {
5903
5449
  return _fetchMap.get(uri);
5904
5450
  };
5905
5451
 
5906
- var styleCss$1 = i$5`: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}.componentWrapper{display:flex}.svgWrapper{height:var(--ds-auro-icon-size);width:var(--ds-auro-icon-size)}.labelWrapper{margin-left:var(--ds-size-50, 0.25rem);line-height:1.8}`;
5452
+ var styleCss$1 = i$5`: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}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}.componentWrapper{display:flex}.svgWrapper{height:var(--ds-auro-icon-size);width:var(--ds-auro-icon-size)}.labelWrapper{margin-left:var(--ds-size-50, 0.25rem);line-height:1.8}`;
5907
5453
 
5908
5454
  // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
5909
5455
  // See LICENSE in the project root for license information.
@@ -5911,7 +5457,6 @@ var styleCss$1 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}.u
5911
5457
 
5912
5458
  // See https://git.io/JJ6SJ for "How to document your components using JSDoc"
5913
5459
  /**
5914
- * @attr {Boolean} onDark - Set value for on-dark version of auro-icon
5915
5460
  * @slot - Hidden from visibility, used for a11y if icon description is needed
5916
5461
  */
5917
5462
 
@@ -5926,6 +5471,10 @@ class BaseIcon extends AuroElement {
5926
5471
  static get properties() {
5927
5472
  return {
5928
5473
  ...super.properties,
5474
+
5475
+ /**
5476
+ * Set value for on-dark version of auro-icon.
5477
+ */
5929
5478
  onDark: {
5930
5479
  type: Boolean,
5931
5480
  reflect: true
@@ -5984,81 +5533,11 @@ class BaseIcon extends AuroElement {
5984
5533
  }
5985
5534
  }
5986
5535
 
5987
- var tokensCss = i$5`:host{--ds-auro-icon-color:var(--ds-color-icon-primary-default, #676767);--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}`;
5988
-
5989
- var colorCss$2 = 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)}`;
5990
-
5991
- // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
5992
- // See LICENSE in the project root for license information.
5993
-
5994
- // ---------------------------------------------------------------------
5995
-
5996
- /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
5997
-
5998
- let AuroLibraryRuntimeUtils$1 = class AuroLibraryRuntimeUtils {
5999
-
6000
- /* eslint-disable jsdoc/require-param */
6001
-
6002
- /**
6003
- * This will register a new custom element with the browser.
6004
- * @param {String} name - The name of the custom element.
6005
- * @param {Object} componentClass - The class to register as a custom element.
6006
- * @returns {void}
6007
- */
6008
- registerComponent(name, componentClass) {
6009
- if (!customElements.get(name)) {
6010
- customElements.define(name, class extends componentClass {});
6011
- }
6012
- }
6013
-
6014
- /**
6015
- * Finds and returns the closest HTML Element based on a selector.
6016
- * @returns {void}
6017
- */
6018
- closestElement(
6019
- selector, // selector like in .closest()
6020
- base = this, // extra functionality to skip a parent
6021
- __Closest = (el, found = el && el.closest(selector)) =>
6022
- !el || el === document || el === window
6023
- ? null // standard .closest() returns null for non-found selectors also
6024
- : found
6025
- ? found // found a selector INside this element
6026
- : __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
6027
- ) {
6028
- return __Closest(base);
6029
- }
6030
- /* eslint-enable jsdoc/require-param */
6031
-
6032
- /**
6033
- * If the element passed is registered with a different tag name than what is passed in, the tag name is added as an attribute to the element.
6034
- * @param {Object} elem - The element to check.
6035
- * @param {String} tagName - The name of the Auro component to check for or add as an attribute.
6036
- * @returns {void}
6037
- */
6038
- handleComponentTagRename(elem, tagName) {
6039
- const tag = tagName.toLowerCase();
6040
- const elemTag = elem.tagName.toLowerCase();
6041
-
6042
- if (elemTag !== tag) {
6043
- elem.setAttribute(tag, true);
6044
- }
6045
- }
6046
-
6047
- /**
6048
- * Validates if an element is a specific Auro component.
6049
- * @param {Object} elem - The element to validate.
6050
- * @param {String} tagName - The name of the Auro component to check against.
6051
- * @returns {Boolean} - Returns true if the element is the specified Auro component.
6052
- */
6053
- elementMatch(elem, tagName) {
6054
- const tag = tagName.toLowerCase();
6055
- const elemTag = elem.tagName.toLowerCase();
5536
+ var tokensCss = i$5`:host{--ds-auro-icon-color:var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-alaska-color:#02426D;--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}`;
6056
5537
 
6057
- return elemTag === tag || elem.hasAttribute(tag);
6058
- }
6059
- };
5538
+ var colorCss$2 = i$5`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[variant=accent1]){--ds-auro-icon-color:var(--ds-basic-color-texticon-accent1, #265688)}:host(:not([onDark])[variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:not([onDark])[variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-muted, #676767)}:host(:not([onDark])[variant=statusDefault]){--ds-auro-icon-color:var(--ds-basic-color-status-default, #afb9c6)}:host(:not([onDark])[variant=statusInfo]){--ds-auro-icon-color:var(--ds-basic-color-status-info, #01426a)}:host(:not([onDark])[variant=statusSuccess]){--ds-auro-icon-color:var(--ds-basic-color-status-success, #447a1f)}:host(:not([onDark])[variant=statusWarning]){--ds-auro-icon-color:var(--ds-basic-color-status-warning, #fac200)}:host(:not([onDark])[variant=statusError]){--ds-auro-icon-color:var(--ds-basic-color-status-error, #e31f26)}:host(:not([onDark])[variant=statusInfoSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-info-subtle, #ebf3f9)}:host(:not([onDark])[variant=statusSuccessSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-success-subtle, #d6eac7)}:host(:not([onDark])[variant=statusWarningSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-warning-subtle, #fff0b2)}:host(:not([onDark])[variant=statusErrorSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-error-subtle, #fbc6c6)}:host(:not([onDark])[variant=fareBasicEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-basiceconomy, #97eaf8)}:host(:not([onDark])[variant=fareBusiness]){--ds-auro-icon-color:var(--ds-basic-color-fare-business, #01426a)}:host(:not([onDark])[variant=fareEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-economy, #0074ca)}:host(:not([onDark])[variant=fareFirst]){--ds-auro-icon-color:var(--ds-basic-color-fare-first, #00274a)}:host(:not([onDark])[variant=farePremiumEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-premiumeconomy, #005154)}:host(:not([onDark])[variant=fareOneWorldEmerald]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-emerald, #139142)}:host(:not([onDark])[variant=fareOneWorldSapphire]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-sapphire, #015daa)}:host(:not([onDark])[variant=fareOneWorldRuby]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-ruby, #a41d4a)}:host([onDark]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse, #ffffff)}:host([onDark][variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([onDark][variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}`;
6060
5539
 
6061
- // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
5540
+ // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
6062
5541
  // See LICENSE in the project root for license information.
6063
5542
 
6064
5543
 
@@ -6066,6 +5545,7 @@ class AuroIcon extends BaseIcon {
6066
5545
  constructor() {
6067
5546
  super();
6068
5547
 
5548
+ this.variant = undefined;
6069
5549
  this.privateDefaults();
6070
5550
  }
6071
5551
 
@@ -6075,20 +5555,6 @@ class AuroIcon extends BaseIcon {
6075
5555
  * @returns {void}
6076
5556
  */
6077
5557
  privateDefaults() {
6078
- this.accent = false;
6079
- this.customColor = false;
6080
- this.customSvg = false;
6081
- this.disabled = false;
6082
- this.emphasis = false;
6083
- this.error = false;
6084
- this.info = false;
6085
- this.label = false;
6086
- this.primary = false;
6087
- this.secondary = false;
6088
- this.subtle = false;
6089
- this.success = false;
6090
- this.tertiary = false;
6091
- this.warning = false;
6092
5558
  this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
6093
5559
  this.runtimeUtils = new AuroLibraryRuntimeUtils$1();
6094
5560
  }
@@ -6098,14 +5564,6 @@ class AuroIcon extends BaseIcon {
6098
5564
  return {
6099
5565
  ...super.properties,
6100
5566
 
6101
- /**
6102
- * Sets the icon to use the accent style.
6103
- */
6104
- accent: {
6105
- type: Boolean,
6106
- reflect: true
6107
- },
6108
-
6109
5567
  /**
6110
5568
  * Set aria-hidden value. Default is `true`. Option is `false`.
6111
5569
  */
@@ -6136,38 +5594,6 @@ class AuroIcon extends BaseIcon {
6136
5594
  type: Boolean
6137
5595
  },
6138
5596
 
6139
- /**
6140
- * Sets the icon to use the disabled style.
6141
- */
6142
- disabled: {
6143
- type: Boolean,
6144
- reflect: true
6145
- },
6146
-
6147
- /**
6148
- * Sets the icon to use the emphasis style.
6149
- */
6150
- emphasis: {
6151
- type: Boolean,
6152
- reflect: true
6153
- },
6154
-
6155
- /**
6156
- * Sets the icon to use the error style.
6157
- */
6158
- error: {
6159
- type: Boolean,
6160
- reflect: true
6161
- },
6162
-
6163
- /**
6164
- * Sets the icon to use the info style.
6165
- */
6166
- info: {
6167
- type: Boolean,
6168
- reflect: true
6169
- },
6170
-
6171
5597
  /**
6172
5598
  * Exposes content in slot as icon label.
6173
5599
  */
@@ -6185,50 +5611,10 @@ class AuroIcon extends BaseIcon {
6185
5611
  },
6186
5612
 
6187
5613
  /**
6188
- * DEPRECATED: Sets the icon to use the baseline primary icon style.
6189
- */
6190
- primary: {
6191
- type: Boolean,
6192
- reflect: true
6193
- },
6194
-
6195
- /**
6196
- * Sets the icon to use the secondary style.
6197
- */
6198
- secondary: {
6199
- type: Boolean,
6200
- reflect: true
6201
- },
6202
-
6203
- /**
6204
- * Sets the icon to use the subtle style.
6205
- */
6206
- subtle: {
6207
- type: Boolean,
6208
- reflect: true
6209
- },
6210
-
6211
- /**
6212
- * Sets the icon to use the success style.
6213
- */
6214
- success: {
6215
- type: Boolean,
6216
- reflect: true
6217
- },
6218
-
6219
- /**
6220
- * Sets the icon to use the tertiary style.
6221
- */
6222
- tertiary: {
6223
- type: Boolean,
6224
- reflect: true
6225
- },
6226
-
6227
- /**
6228
- * Sets the icon to use the warning style.
5614
+ * The style of the icon. The accepted variants are `accent1`, `disabled`, `muted`, `statusDefault`, `statusInfo`, `statusSuccess`, `statusWarning`, `statusError`, `statusInfoSubtle`, `statusSuccessSubtle`, `statusWarningSubtle`, `statusErrorSubtle`, `fareBasicEconomy`, `fareBusiness`, `fareEconomy`, `fareFirst`, `farePremiumEconomy`, `fareOneWorldEmerald`, `fareOneWorldSapphire`, `fareOneWorldRuby`.
6229
5615
  */
6230
- warning: {
6231
- type: Boolean,
5616
+ variant: {
5617
+ type: String,
6232
5618
  reflect: true
6233
5619
  }
6234
5620
  };
@@ -6318,7 +5704,7 @@ class AuroIcon extends BaseIcon {
6318
5704
  }
6319
5705
  }
6320
5706
 
6321
- var iconVersion = '7.0.1';
5707
+ var iconVersion = '8.0.1';
6322
5708
 
6323
5709
  // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
6324
5710
  // See LICENSE in the project root for license information.
@@ -6543,7 +5929,9 @@ class AuroBibtemplate extends r {
6543
5929
  constructor() {
6544
5930
  super();
6545
5931
 
6546
- AuroLibraryRuntimeUtils$2.prototype.handleComponentTagRename(this, 'auro-bibtemplate');
5932
+ this.large = false;
5933
+
5934
+ AuroLibraryRuntimeUtils$1.prototype.handleComponentTagRename(this, 'auro-bibtemplate');
6547
5935
 
6548
5936
  const versioning = new AuroDependencyVersioning();
6549
5937
  this.iconTag = versioning.generateTag('auro-formkit-bibtemplate-icon', iconVersion, AuroIcon);
@@ -6582,7 +5970,7 @@ class AuroBibtemplate extends r {
6582
5970
  *
6583
5971
  */
6584
5972
  static register(name = "auro-bibtemplate") {
6585
- AuroLibraryRuntimeUtils$2.prototype.registerComponent(name, AuroBibtemplate);
5973
+ AuroLibraryRuntimeUtils$1.prototype.registerComponent(name, AuroBibtemplate);
6586
5974
  }
6587
5975
 
6588
5976
  /**
@@ -6656,7 +6044,7 @@ var bibTemplateVersion = '1.0.0';
6656
6044
 
6657
6045
  var styleCss = i$5`.wrapper{display:flex;flex-direction:column;gap:var(--ds-size-300, 1.5rem)}.wrapper ::slotted(*:not(:first-child)){padding-top:var(--ds-size-300, 1.5rem);border-top-width:1px;border-top-style:solid}:host([isindropdown]) .wrapper{padding:var(--ds-size-300, 1.5rem)}`;
6658
6046
 
6659
- var colorCss = i$5`:host ::slotted(*:not(:first-child)){border-color:var(--ds-color-border-divider-default, rgba(0, 0, 0, 0.12))}`;
6047
+ var colorCss = i$5`:host ::slotted(*:not(:first-child)){border-color:var(--ds-auro-counter-divider-color)}`;
6660
6048
 
6661
6049
  // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
6662
6050
  // See LICENSE in the project root for license information.
@@ -6677,7 +6065,8 @@ class AuroCounterWrapper extends r {
6677
6065
  static get styles() {
6678
6066
  return [
6679
6067
  colorCss,
6680
- styleCss
6068
+ styleCss,
6069
+ tokensCss$7
6681
6070
  ];
6682
6071
  }
6683
6072
 
@@ -6688,7 +6077,7 @@ class AuroCounterWrapper extends r {
6688
6077
  * AuroCounterWrapper.register("custom-counter-wrapper") // registers <custom-counter-wrapper/>
6689
6078
  */
6690
6079
  static register(name = "auro-counter-wrapper") {
6691
- AuroLibraryRuntimeUtils$5.prototype.registerComponent(name, AuroCounterWrapper);
6080
+ AuroLibraryRuntimeUtils$3.prototype.registerComponent(name, AuroCounterWrapper);
6692
6081
  }
6693
6082
 
6694
6083
  // function that renders the HTML and CSS into the scope of the component
@@ -6725,13 +6114,18 @@ class AuroCounterGroup extends r {
6725
6114
  constructor() {
6726
6115
  super();
6727
6116
 
6728
- this.isDropdown = false;
6729
6117
  this.max = undefined;
6730
6118
  this.min = undefined;
6119
+ this.onDark = false;
6731
6120
  this.total = undefined;
6732
6121
  this.validity = undefined;
6733
6122
  this.value = undefined;
6123
+
6124
+ this.isDropdown = false;
6734
6125
  this.fullscreenBreakpoint = 'sm';
6126
+ this.largeFullscreenHeadline = false;
6127
+ this.autoPlacement = false;
6128
+ this.noFlip = false;
6735
6129
 
6736
6130
  /**
6737
6131
  * @private
@@ -6825,7 +6219,7 @@ class AuroCounterGroup extends r {
6825
6219
 
6826
6220
  /**
6827
6221
  * If declared, make bib.fullscreen.headline in HeadingDisplay.
6828
- * Otherwise, Heading 600
6222
+ * Otherwise, Heading 600.
6829
6223
  */
6830
6224
  largeFullscreenHeadline: {
6831
6225
  type: Boolean,
@@ -6851,6 +6245,14 @@ class AuroCounterGroup extends r {
6851
6245
  reflect: true
6852
6246
  },
6853
6247
 
6248
+ /**
6249
+ * If declared, counters and dropdown will be rendered with onDark styles.
6250
+ */
6251
+ onDark: {
6252
+ type: Boolean,
6253
+ reflect: true
6254
+ },
6255
+
6854
6256
  /**
6855
6257
  * Position where the bib should appear relative to the trigger.
6856
6258
  * Accepted values:
@@ -6962,6 +6364,7 @@ class AuroCounterGroup extends r {
6962
6364
  configureCounters() {
6963
6365
  this.counters = this.querySelectorAll("auro-counter, [auro-counter]");
6964
6366
  this.counters.forEach((counter) => {
6367
+ counter.onDark = this.onDark;
6965
6368
  counter.addEventListener("input", () => this.updateValue());
6966
6369
  });
6967
6370
  }
@@ -7011,11 +6414,11 @@ class AuroCounterGroup extends r {
7011
6414
  }
7012
6415
 
7013
6416
  /**
7014
- * @private
7015
6417
  * This sets up a close event listener and moves any slotted `bib.fullscreen.headline` and `bib.fullscreen.footer` content into the bibtemplate.
6418
+ * @private
7016
6419
  */
7017
6420
  configureBibtemplate() {
7018
- this.bibtemplate = this.dropdown.querySelector(this.bibtemplateTag._$litStatic$); // eslint-disable-line no-underscore-dangle
6421
+ this.bibtemplate = this.dropdown.querySelector(this.bibtemplateTag._$litStatic$);
7019
6422
  this.bibtemplate.addEventListener('close-click', () => {
7020
6423
  if (this.dropdown.isPopoverVisible) {
7021
6424
  this.dropdown.hide();
@@ -7112,6 +6515,10 @@ class AuroCounterGroup extends r {
7112
6515
  }
7113
6516
  );
7114
6517
  }
6518
+
6519
+ if (changedProperties.has("onDark") && !this.isDropdown) {
6520
+ this.configureCounters();
6521
+ }
7115
6522
  }
7116
6523
 
7117
6524
  /**
@@ -7121,7 +6528,7 @@ class AuroCounterGroup extends r {
7121
6528
  * AuroCounterGroup.register("custom-counter-group") // registers <custom-counter-group/>
7122
6529
  */
7123
6530
  static register(name = "auro-counter-group") {
7124
- AuroLibraryRuntimeUtils$5.prototype.registerComponent(name, AuroCounterGroup);
6531
+ AuroLibraryRuntimeUtils$3.prototype.registerComponent(name, AuroCounterGroup);
7125
6532
  }
7126
6533
 
7127
6534
  // function that renders the HTML and CSS into the scope of the component
@@ -7132,6 +6539,7 @@ class AuroCounterGroup extends r {
7132
6539
  .fullscreenBreakpoint="${this.fullscreenBreakpoint}"
7133
6540
  .placement="${this.placement}"
7134
6541
  .offset="${this.offset}"
6542
+ ?onDark="${this.onDark}"
7135
6543
  ?autoPlacement="${this.autoPlacement}"
7136
6544
  ?noFlip="${this.noFlip}">
7137
6545
  <div slot="trigger"><slot name="valueText">