@aurodesignsystem/auro-formkit 2.2.1 → 3.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (137) hide show
  1. package/CHANGELOG.md +49 -0
  2. package/components/bibtemplate/dist/iconVersion.d.ts +1 -1
  3. package/components/bibtemplate/dist/index.js +18 -178
  4. package/components/bibtemplate/dist/registered.js +18 -178
  5. package/components/checkbox/README.md +1 -1
  6. package/components/checkbox/demo/api.html +2 -1
  7. package/components/checkbox/demo/api.md +129 -58
  8. package/components/checkbox/demo/api.min.js +41 -8
  9. package/components/checkbox/demo/index.html +2 -1
  10. package/components/checkbox/demo/index.md +116 -50
  11. package/components/checkbox/demo/index.min.js +41 -8
  12. package/components/checkbox/demo/readme.html +2 -1
  13. package/components/checkbox/demo/readme.md +1 -1
  14. package/components/checkbox/dist/auro-checkbox-group.d.ts +8 -0
  15. package/components/checkbox/dist/auro-checkbox.d.ts +8 -0
  16. package/components/checkbox/dist/index.js +41 -8
  17. package/components/checkbox/dist/registered.js +41 -8
  18. package/components/combobox/README.md +1 -1
  19. package/components/combobox/demo/api.html +2 -1
  20. package/components/combobox/demo/api.md +102 -1
  21. package/components/combobox/demo/api.min.js +238 -988
  22. package/components/combobox/demo/index.html +2 -4
  23. package/components/combobox/demo/index.md +32 -0
  24. package/components/combobox/demo/index.min.js +238 -988
  25. package/components/combobox/demo/readme.html +2 -1
  26. package/components/combobox/demo/readme.md +1 -1
  27. package/components/combobox/dist/auro-combobox.d.ts +8 -0
  28. package/components/combobox/dist/index.js +196 -786
  29. package/components/combobox/dist/registered.js +196 -786
  30. package/components/counter/README.md +1 -1
  31. package/components/counter/demo/api.html +2 -1
  32. package/components/counter/demo/api.md +29 -10
  33. package/components/counter/demo/api.min.js +187 -785
  34. package/components/counter/demo/index.html +2 -1
  35. package/components/counter/demo/index.md +104 -8
  36. package/components/counter/demo/index.min.js +187 -785
  37. package/components/counter/demo/readme.html +2 -1
  38. package/components/counter/demo/readme.md +1 -1
  39. package/components/counter/dist/auro-counter-group.d.ts +10 -2
  40. package/components/counter/dist/auro-counter.d.ts +1 -0
  41. package/components/counter/dist/iconVersion.d.ts +1 -1
  42. package/components/counter/dist/index.js +187 -785
  43. package/components/counter/dist/registered.js +187 -785
  44. package/components/datepicker/README.md +1 -1
  45. package/components/datepicker/demo/api.html +2 -4
  46. package/components/datepicker/demo/api.md +15 -14
  47. package/components/datepicker/demo/api.min.js +286 -1036
  48. package/components/datepicker/demo/index.html +2 -4
  49. package/components/datepicker/demo/index.md +38 -0
  50. package/components/datepicker/demo/index.min.js +286 -1036
  51. package/components/datepicker/demo/readme.html +2 -1
  52. package/components/datepicker/demo/readme.md +1 -1
  53. package/components/datepicker/dist/auro-datepicker.d.ts +8 -0
  54. package/components/datepicker/dist/index.js +286 -1036
  55. package/components/datepicker/dist/registered.js +286 -1036
  56. package/components/dropdown/README.md +1 -1
  57. package/components/dropdown/demo/api.html +2 -1
  58. package/components/dropdown/demo/api.md +173 -82
  59. package/components/dropdown/demo/api.min.js +41 -183
  60. package/components/dropdown/demo/index.html +2 -1
  61. package/components/dropdown/demo/index.md +86 -4
  62. package/components/dropdown/demo/index.min.js +41 -183
  63. package/components/dropdown/demo/readme.html +2 -1
  64. package/components/dropdown/demo/readme.md +1 -1
  65. package/components/dropdown/dist/auro-dropdown.d.ts +8 -0
  66. package/components/dropdown/dist/auro-dropdownBib.d.ts +2 -2
  67. package/components/dropdown/dist/index.js +41 -183
  68. package/components/dropdown/dist/registered.js +41 -183
  69. package/components/form/README.md +1 -1
  70. package/components/form/demo/api.html +2 -1
  71. package/components/form/demo/api.min.js +1 -1
  72. package/components/form/demo/index.html +2 -1
  73. package/components/form/demo/index.min.js +1 -1
  74. package/components/form/demo/readme.html +2 -1
  75. package/components/form/demo/readme.md +1 -1
  76. package/components/form/demo/working.html +2 -1
  77. package/components/form/dist/index.js +1 -1
  78. package/components/form/dist/registered.js +1 -1
  79. package/components/helptext/dist/auro-helptext.d.ts +8 -0
  80. package/components/helptext/dist/index.js +11 -2
  81. package/components/helptext/dist/registered.js +11 -2
  82. package/components/input/README.md +1 -1
  83. package/components/input/demo/api.html +2 -1
  84. package/components/input/demo/api.js +2 -0
  85. package/components/input/demo/api.md +108 -18
  86. package/components/input/demo/api.min.js +117 -402
  87. package/components/input/demo/index.html +2 -1
  88. package/components/input/demo/index.md +30 -0
  89. package/components/input/demo/index.min.js +103 -402
  90. package/components/input/demo/readme.html +2 -1
  91. package/components/input/demo/readme.md +1 -1
  92. package/components/input/dist/base-input.d.ts +8 -0
  93. package/components/input/dist/buttonVersion.d.ts +1 -1
  94. package/components/input/dist/iconVersion.d.ts +1 -1
  95. package/components/input/dist/index.js +103 -402
  96. package/components/input/dist/registered.js +103 -402
  97. package/components/menu/README.md +1 -1
  98. package/components/menu/demo/api.html +2 -1
  99. package/components/menu/demo/api.md +6 -2
  100. package/components/menu/demo/api.min.js +23 -183
  101. package/components/menu/demo/index.html +2 -1
  102. package/components/menu/demo/index.min.js +23 -183
  103. package/components/menu/demo/readme.html +2 -1
  104. package/components/menu/demo/readme.md +1 -1
  105. package/components/menu/dist/iconVersion.d.ts +1 -1
  106. package/components/menu/dist/index.js +23 -183
  107. package/components/menu/dist/registered.js +23 -183
  108. package/components/radio/README.md +1 -1
  109. package/components/radio/demo/api.html +2 -1
  110. package/components/radio/demo/api.md +160 -56
  111. package/components/radio/demo/api.min.js +35 -8
  112. package/components/radio/demo/index.html +2 -1
  113. package/components/radio/demo/index.md +43 -12
  114. package/components/radio/demo/index.min.js +35 -8
  115. package/components/radio/demo/readme.html +2 -1
  116. package/components/radio/demo/readme.md +1 -1
  117. package/components/radio/dist/auro-radio-group.d.ts +6 -0
  118. package/components/radio/dist/auro-radio.d.ts +6 -0
  119. package/components/radio/dist/index.js +35 -8
  120. package/components/radio/dist/registered.js +35 -8
  121. package/components/select/README.md +1 -1
  122. package/components/select/demo/api.html +2 -1
  123. package/components/select/demo/api.js +0 -2
  124. package/components/select/demo/api.md +112 -35
  125. package/components/select/demo/api.min.js +116 -589
  126. package/components/select/demo/index.html +2 -1
  127. package/components/select/demo/index.md +100 -0
  128. package/components/select/demo/index.min.js +116 -576
  129. package/components/select/demo/readme.html +2 -1
  130. package/components/select/demo/readme.md +1 -1
  131. package/components/select/dist/auro-select.d.ts +8 -0
  132. package/components/select/dist/index.js +91 -391
  133. package/components/select/dist/registered.js +91 -391
  134. package/package.json +23 -23
  135. package/components/counter/dist/styles/counter-button-tokens-css.d.ts +0 -2
  136. package/components/select/dist/styles/color-css.d.ts +0 -2
  137. package/components/select/dist/styles/tokens-css.d.ts +0 -2
@@ -8,7 +8,7 @@ import { repeat } from 'lit/directives/repeat.js';
8
8
  // See LICENSE in the project root for license information.
9
9
 
10
10
 
11
- let AuroDependencyVersioning$4 = class AuroDependencyVersioning {
11
+ let AuroDependencyVersioning$3 = class AuroDependencyVersioning {
12
12
 
13
13
  /**
14
14
  * Generates a unique string to be used for child auro element naming.
@@ -51,7 +51,7 @@ let AuroDependencyVersioning$4 = class AuroDependencyVersioning {
51
51
 
52
52
  /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
53
53
 
54
- let AuroLibraryRuntimeUtils$7 = class AuroLibraryRuntimeUtils {
54
+ let AuroLibraryRuntimeUtils$4 = class AuroLibraryRuntimeUtils {
55
55
 
56
56
  /* eslint-disable jsdoc/require-param */
57
57
 
@@ -120,7 +120,7 @@ let AuroLibraryRuntimeUtils$7 = class AuroLibraryRuntimeUtils {
120
120
 
121
121
  let AuroFormValidation$1 = class AuroFormValidation {
122
122
  constructor() {
123
- this.runtimeUtils = new AuroLibraryRuntimeUtils$7();
123
+ this.runtimeUtils = new AuroLibraryRuntimeUtils$4();
124
124
  }
125
125
 
126
126
  /**
@@ -432,7 +432,7 @@ let AuroFormValidation$1 = class AuroFormValidation {
432
432
 
433
433
  /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
434
434
 
435
- let AuroLibraryRuntimeUtils$2$2 = class AuroLibraryRuntimeUtils {
435
+ let AuroLibraryRuntimeUtils$1$2 = class AuroLibraryRuntimeUtils {
436
436
 
437
437
  /* eslint-disable jsdoc/require-param */
438
438
 
@@ -2631,7 +2631,7 @@ class AuroFloatingUI {
2631
2631
  // See LICENSE in the project root for license information.
2632
2632
 
2633
2633
 
2634
- let AuroDependencyVersioning$3 = class AuroDependencyVersioning {
2634
+ let AuroDependencyVersioning$2 = class AuroDependencyVersioning {
2635
2635
 
2636
2636
  /**
2637
2637
  * Generates a unique string to be used for child auro element naming.
@@ -2733,7 +2733,7 @@ const cacheFetch$2 = (uri, options = {}) => {
2733
2733
  return _fetchMap$2.get(uri);
2734
2734
  };
2735
2735
 
2736
- var styleCss$3$2 = css`: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}`;
2736
+ var styleCss$3$2 = css`: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}`;
2737
2737
 
2738
2738
  // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
2739
2739
  // See LICENSE in the project root for license information.
@@ -2741,7 +2741,6 @@ var styleCss$3$2 = css`:focus:not(:focus-visible){outline:3px solid transparent}
2741
2741
 
2742
2742
  // See https://git.io/JJ6SJ for "How to document your components using JSDoc"
2743
2743
  /**
2744
- * @attr {Boolean} onDark - Set value for on-dark version of auro-icon
2745
2744
  * @slot - Hidden from visibility, used for a11y if icon description is needed
2746
2745
  */
2747
2746
 
@@ -2756,6 +2755,10 @@ let BaseIcon$2 = class BaseIcon extends AuroElement$2 {
2756
2755
  static get properties() {
2757
2756
  return {
2758
2757
  ...super.properties,
2758
+
2759
+ /**
2760
+ * Set value for on-dark version of auro-icon.
2761
+ */
2759
2762
  onDark: {
2760
2763
  type: Boolean,
2761
2764
  reflect: true
@@ -2814,81 +2817,11 @@ let BaseIcon$2 = class BaseIcon extends AuroElement$2 {
2814
2817
  }
2815
2818
  };
2816
2819
 
2817
- var tokensCss$2$1 = css`:host{--ds-auro-icon-color:var(--ds-color-icon-primary-default, #676767);--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}`;
2818
-
2819
- var colorCss$3$1 = css`: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)}`;
2820
-
2821
- // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
2822
- // See LICENSE in the project root for license information.
2823
-
2824
- // ---------------------------------------------------------------------
2825
-
2826
- /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
2827
-
2828
- let AuroLibraryRuntimeUtils$1$2 = class AuroLibraryRuntimeUtils {
2829
-
2830
- /* eslint-disable jsdoc/require-param */
2831
-
2832
- /**
2833
- * This will register a new custom element with the browser.
2834
- * @param {String} name - The name of the custom element.
2835
- * @param {Object} componentClass - The class to register as a custom element.
2836
- * @returns {void}
2837
- */
2838
- registerComponent(name, componentClass) {
2839
- if (!customElements.get(name)) {
2840
- customElements.define(name, class extends componentClass {});
2841
- }
2842
- }
2843
-
2844
- /**
2845
- * Finds and returns the closest HTML Element based on a selector.
2846
- * @returns {void}
2847
- */
2848
- closestElement(
2849
- selector, // selector like in .closest()
2850
- base = this, // extra functionality to skip a parent
2851
- __Closest = (el, found = el && el.closest(selector)) =>
2852
- !el || el === document || el === window
2853
- ? null // standard .closest() returns null for non-found selectors also
2854
- : found
2855
- ? found // found a selector INside this element
2856
- : __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
2857
- ) {
2858
- return __Closest(base);
2859
- }
2860
- /* eslint-enable jsdoc/require-param */
2861
-
2862
- /**
2863
- * 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.
2864
- * @param {Object} elem - The element to check.
2865
- * @param {String} tagName - The name of the Auro component to check for or add as an attribute.
2866
- * @returns {void}
2867
- */
2868
- handleComponentTagRename(elem, tagName) {
2869
- const tag = tagName.toLowerCase();
2870
- const elemTag = elem.tagName.toLowerCase();
2871
-
2872
- if (elemTag !== tag) {
2873
- elem.setAttribute(tag, true);
2874
- }
2875
- }
2876
-
2877
- /**
2878
- * Validates if an element is a specific Auro component.
2879
- * @param {Object} elem - The element to validate.
2880
- * @param {String} tagName - The name of the Auro component to check against.
2881
- * @returns {Boolean} - Returns true if the element is the specified Auro component.
2882
- */
2883
- elementMatch(elem, tagName) {
2884
- const tag = tagName.toLowerCase();
2885
- const elemTag = elem.tagName.toLowerCase();
2820
+ var tokensCss$2$1 = css`: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)}`;
2886
2821
 
2887
- return elemTag === tag || elem.hasAttribute(tag);
2888
- }
2889
- };
2822
+ var colorCss$3$1 = css`: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)}`;
2890
2823
 
2891
- // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
2824
+ // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
2892
2825
  // See LICENSE in the project root for license information.
2893
2826
 
2894
2827
 
@@ -2896,6 +2829,7 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
2896
2829
  constructor() {
2897
2830
  super();
2898
2831
 
2832
+ this.variant = undefined;
2899
2833
  this.privateDefaults();
2900
2834
  }
2901
2835
 
@@ -2905,20 +2839,6 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
2905
2839
  * @returns {void}
2906
2840
  */
2907
2841
  privateDefaults() {
2908
- this.accent = false;
2909
- this.customColor = false;
2910
- this.customSvg = false;
2911
- this.disabled = false;
2912
- this.emphasis = false;
2913
- this.error = false;
2914
- this.info = false;
2915
- this.label = false;
2916
- this.primary = false;
2917
- this.secondary = false;
2918
- this.subtle = false;
2919
- this.success = false;
2920
- this.tertiary = false;
2921
- this.warning = false;
2922
2842
  this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
2923
2843
  this.runtimeUtils = new AuroLibraryRuntimeUtils$1$2();
2924
2844
  }
@@ -2928,14 +2848,6 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
2928
2848
  return {
2929
2849
  ...super.properties,
2930
2850
 
2931
- /**
2932
- * Sets the icon to use the accent style.
2933
- */
2934
- accent: {
2935
- type: Boolean,
2936
- reflect: true
2937
- },
2938
-
2939
2851
  /**
2940
2852
  * Set aria-hidden value. Default is `true`. Option is `false`.
2941
2853
  */
@@ -2966,38 +2878,6 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
2966
2878
  type: Boolean
2967
2879
  },
2968
2880
 
2969
- /**
2970
- * Sets the icon to use the disabled style.
2971
- */
2972
- disabled: {
2973
- type: Boolean,
2974
- reflect: true
2975
- },
2976
-
2977
- /**
2978
- * Sets the icon to use the emphasis style.
2979
- */
2980
- emphasis: {
2981
- type: Boolean,
2982
- reflect: true
2983
- },
2984
-
2985
- /**
2986
- * Sets the icon to use the error style.
2987
- */
2988
- error: {
2989
- type: Boolean,
2990
- reflect: true
2991
- },
2992
-
2993
- /**
2994
- * Sets the icon to use the info style.
2995
- */
2996
- info: {
2997
- type: Boolean,
2998
- reflect: true
2999
- },
3000
-
3001
2881
  /**
3002
2882
  * Exposes content in slot as icon label.
3003
2883
  */
@@ -3015,50 +2895,10 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
3015
2895
  },
3016
2896
 
3017
2897
  /**
3018
- * DEPRECATED: Sets the icon to use the baseline primary icon style.
3019
- */
3020
- primary: {
3021
- type: Boolean,
3022
- reflect: true
3023
- },
3024
-
3025
- /**
3026
- * Sets the icon to use the secondary style.
3027
- */
3028
- secondary: {
3029
- type: Boolean,
3030
- reflect: true
3031
- },
3032
-
3033
- /**
3034
- * Sets the icon to use the subtle style.
3035
- */
3036
- subtle: {
3037
- type: Boolean,
3038
- reflect: true
3039
- },
3040
-
3041
- /**
3042
- * Sets the icon to use the success style.
3043
- */
3044
- success: {
3045
- type: Boolean,
3046
- reflect: true
3047
- },
3048
-
3049
- /**
3050
- * Sets the icon to use the tertiary style.
3051
- */
3052
- tertiary: {
3053
- type: Boolean,
3054
- reflect: true
3055
- },
3056
-
3057
- /**
3058
- * Sets the icon to use the warning style.
2898
+ * 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`.
3059
2899
  */
3060
- warning: {
3061
- type: Boolean,
2900
+ variant: {
2901
+ type: String,
3062
2902
  reflect: true
3063
2903
  }
3064
2904
  };
@@ -3154,7 +2994,7 @@ var styleCss$2$2 = css`:host{position:absolute;z-index:var(--depth-tooltip, 400)
3154
2994
 
3155
2995
  var colorCss$2$1 = css`.container{background-color:var(--ds-auro-dropdownbib-container-color);box-shadow:var(--ds-auro-dropdownbib-boxshadow-color);color:var(--ds-auro-dropdownbib-text-color)}`;
3156
2996
 
3157
- var tokensCss$1$1 = css`: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)}`;
2997
+ var tokensCss$1$1 = css`: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)}`;
3158
2998
 
3159
2999
  // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
3160
3000
  // See LICENSE in the project root for license information.
@@ -3184,7 +3024,7 @@ class AuroDropdownBib extends LitElement {
3184
3024
  */
3185
3025
  this._mobileBreakpointValue = undefined;
3186
3026
 
3187
- AuroLibraryRuntimeUtils$2$2.prototype.handleComponentTagRename(this, 'auro-dropdownbib');
3027
+ AuroLibraryRuntimeUtils$1$2.prototype.handleComponentTagRename(this, 'auro-dropdownbib');
3188
3028
  }
3189
3029
 
3190
3030
  static get styles() {
@@ -3277,13 +3117,13 @@ var dropdownVersion$1 = '3.0.0';
3277
3117
 
3278
3118
  var styleCss$1$2 = css`: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)}`;
3279
3119
 
3280
- var colorCss$1$2 = css`.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)}`;
3120
+ var colorCss$1$2 = css`.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))}`;
3281
3121
 
3282
- var colorCss$6 = css`:host([error]){--ds-auro-helptext-color: var(--ds-color-text-error-default, #cc1816)}.helptext-wrapper{color:var(--ds-auro-helptext-color)}`;
3122
+ var colorCss$6 = css`: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)}`;
3283
3123
 
3284
3124
  var styleCss$6 = css`.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}`;
3285
3125
 
3286
- var tokensCss$6 = css`:host{--ds-auro-helptext-color: var(--ds-color-text-tertiary-default, #6a717c)}`;
3126
+ var tokensCss$6 = css`:host{--ds-auro-helptext-color: var(--ds-basic-color-texticon-muted, #676767)}`;
3287
3127
 
3288
3128
  // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
3289
3129
  // See LICENSE in the project root for license information.
@@ -3292,7 +3132,7 @@ var tokensCss$6 = css`:host{--ds-auro-helptext-color: var(--ds-color-text-tertia
3292
3132
 
3293
3133
  /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
3294
3134
 
3295
- let AuroLibraryRuntimeUtils$6 = class AuroLibraryRuntimeUtils {
3135
+ let AuroLibraryRuntimeUtils$3 = class AuroLibraryRuntimeUtils {
3296
3136
 
3297
3137
  /* eslint-disable jsdoc/require-param */
3298
3138
 
@@ -3370,9 +3210,10 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
3370
3210
  super();
3371
3211
 
3372
3212
  this.error = false;
3213
+ this.onDark = false;
3373
3214
  this.hasTextContent = false;
3374
3215
 
3375
- AuroLibraryRuntimeUtils$6.prototype.handleComponentTagRename(this, 'auro-helptext');
3216
+ AuroLibraryRuntimeUtils$3.prototype.handleComponentTagRename(this, 'auro-helptext');
3376
3217
  }
3377
3218
 
3378
3219
  static get styles() {
@@ -3408,6 +3249,14 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
3408
3249
  type: Boolean,
3409
3250
  reflect: true,
3410
3251
  },
3252
+
3253
+ /**
3254
+ * If declared, will apply onDark styles.
3255
+ */
3256
+ onDark: {
3257
+ type: Boolean,
3258
+ reflect: true
3259
+ }
3411
3260
  };
3412
3261
  }
3413
3262
 
@@ -3420,7 +3269,7 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
3420
3269
  *
3421
3270
  */
3422
3271
  static register(name = "auro-helptext") {
3423
- AuroLibraryRuntimeUtils$6.prototype.registerComponent(name, AuroHelpText);
3272
+ AuroLibraryRuntimeUtils$3.prototype.registerComponent(name, AuroHelpText);
3424
3273
  }
3425
3274
 
3426
3275
  updated() {
@@ -3539,6 +3388,7 @@ class AuroDropdown extends LitElement {
3539
3388
  this.tabIndex = 0;
3540
3389
  this.noToggle = false;
3541
3390
  this.labeled = true;
3391
+ this.onDark = false;
3542
3392
 
3543
3393
  // floaterConfig
3544
3394
  this.placement = 'bottom-start';
@@ -3559,7 +3409,7 @@ class AuroDropdown extends LitElement {
3559
3409
  /**
3560
3410
  * @private
3561
3411
  */
3562
- this.runtimeUtils = new AuroLibraryRuntimeUtils$2$2();
3412
+ this.runtimeUtils = new AuroLibraryRuntimeUtils$1$2();
3563
3413
 
3564
3414
  /**
3565
3415
  * @private
@@ -3569,7 +3419,7 @@ class AuroDropdown extends LitElement {
3569
3419
  /**
3570
3420
  * Generate unique names for dependency components.
3571
3421
  */
3572
- const versioning = new AuroDependencyVersioning$3();
3422
+ const versioning = new AuroDependencyVersioning$2();
3573
3423
 
3574
3424
  /**
3575
3425
  * @private
@@ -3795,6 +3645,14 @@ class AuroDropdown extends LitElement {
3795
3645
  reflect: true
3796
3646
  },
3797
3647
 
3648
+ /**
3649
+ * If declared, onDark styles will be applied.
3650
+ */
3651
+ onDark: {
3652
+ type: Boolean,
3653
+ reflect: true
3654
+ },
3655
+
3798
3656
  onSlotChange: {
3799
3657
  type: Function,
3800
3658
  reflect: false
@@ -3848,7 +3706,7 @@ class AuroDropdown extends LitElement {
3848
3706
  *
3849
3707
  */
3850
3708
  static register(name = "auro-dropdown") {
3851
- AuroLibraryRuntimeUtils$2$2.prototype.registerComponent(name, AuroDropdown);
3709
+ AuroLibraryRuntimeUtils$1$2.prototype.registerComponent(name, AuroDropdown);
3852
3710
  }
3853
3711
 
3854
3712
  connectedCallback() {
@@ -4165,14 +4023,14 @@ class AuroDropdown extends LitElement {
4165
4023
  <${this.iconTag}
4166
4024
  category="interface"
4167
4025
  name="chevron-down"
4168
- customColor
4169
- ?disabled=${this.disabled}
4026
+ ?onDark="${this.onDark}"
4027
+ variant="${this.disabled ? 'disabled' : 'muted'}">
4170
4028
  >
4171
4029
  </${this.iconTag}>
4172
4030
  </div>
4173
4031
  ` : undefined }
4174
4032
  </div>
4175
- <${this.helpTextTag} part="helpText" ?error="${this.error}">
4033
+ <${this.helpTextTag} part="helpText" ?onDark=${this.onDark} ?error="${this.error}">
4176
4034
  <slot name="helpText"></slot>
4177
4035
  </${this.helpTextTag}>
4178
4036
  <div class="slotContent">
@@ -4316,11 +4174,11 @@ function stopNotifyingOnLangChange(element) {
4316
4174
  watchedItems.delete(element);
4317
4175
  }
4318
4176
 
4319
- var styleCss$4 = css`*,*:before,*:after{box-sizing:border-box}@media(prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}*:focus-visible{outline:0}*:focus-visible{outline:0}:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.typeIcon{display:flex;flex-direction:row;align-items:center}.typeIcon [auro-icon]{--ds-auro-icon-size: var(--ds-size-300, 1.5rem);height:var(--ds-size-300, 1.5rem);margin-right:var(--ds-size-100, 0.5rem)}.notificationIcons{display:flex;flex-direction:row;padding-right:var(--ds-size-100, 0.5rem)}:host([bordered]) .typeIcon{padding-left:var(--ds-size-100, 0.5rem)}:host([bordered]) .notificationIcons{align-items:center}.notification:not(:first-of-type){margin-left:var(--ds-size-100, 0.5rem)}.alertNotification{width:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-25, 0.125rem));height:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-25, 0.125rem))}.passwordBtn{width:calc(var(--ds-size-300, 1.5rem));height:calc(var(--ds-size-300, 1.5rem))}.notificationBtn{display:block;width:var(--ds-size-300, 1.5rem);height:var(--ds-size-300, 1.5rem);padding:0;border:0;background:unset;cursor:pointer}.notificationBtn [auro-icon]{display:block;height:var(--ds-size-300, 1.5rem);--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}.notificationBtn [auro-icon][hidden]{display:none}:host(:not([bordered])) .typeIcon,:host(:not([bordered])) .notificationIcons{align-items:flex-end;padding-bottom:var(--ds-size-50, 0.25rem)}.clearBtn{transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1);overflow:hidden;width:0;opacity:0}:host .wrapper:hover .clearBtn,:host .wrapper:focus-within .clearBtn{width:calc(var(--ds-size-200, 1rem) + var(--ds-size-25, 0.125rem));height:calc(var(--ds-size-200, 1rem) + var(--ds-size-25, 0.125rem));opacity:1}:host(:focus-within[type=password]) .notificationIcons[hasValue] .alertNotification{overflow:hidden;width:0;height:0;padding:0;margin:0;visibility:hidden}input{border:unset}.wrapper{position:relative;overflow:hidden;border-style:solid}:host(:not([bordered],[borderless])) .wrapper{border-width:1px 0}:host([bordered]) .wrapper{border-width:1px;border-radius:var(--ds-border-radius, 0.375rem)}:host(:not([borderless])) .wrapper:focus-within:before{position:absolute;display:block;border-bottom-width:1px;border-bottom-style:solid;content:"";inset:0;pointer-events:none}:host([validity]:not([validity=valid])) .wrapper:before{border-bottom:0}label{transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1);position:absolute;overflow:hidden;pointer-events:none;text-overflow:ellipsis;white-space:nowrap}:host(:not([bordered])) label{top:calc(100% - var(--ds-size-25, 0.125rem));transform:translateY(-100%)}:host(:not([bordered])) label.withIcon{left:var(--ds-size-400, 2rem)}:host([bordered]) label{top:50%;transform:translateY(-50%)}:host([bordered]) label.withIcon{left:var(--ds-size-500, 2.5rem)}:host([bordered]) label:not(label.withIcon){left:var(--ds-size-100, 0.5rem)}:host .wrapper:focus-within label{top:var(--ds-size-100, 0.5rem);font-size:var(--ds-text-body-size-xs, 0.75rem);transform:unset}:host label.withValue{top:var(--ds-size-100, 0.5rem);font-size:var(--ds-text-body-size-xs, 0.75rem);transform:unset}:host([activeLabel]) .wrapper label{top:var(--ds-size-100, 0.5rem);font-size:var(--ds-text-body-size-xs, 0.75rem);transform:unset}:host{position:relative;display:block}.wrapper{display:flex;flex-direction:row}.main{display:flex;flex-direction:row;position:relative;flex:1}input{transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1);position:relative;overflow:hidden;min-height:var(--ds-size-700, 3.5rem);max-height:var(--ds-size-700, 3.5rem);flex:1;padding:var(--ds-size-400, 2rem) 0 var(--ds-size-50, 0.25rem);margin:0;font-family:var(--ds-font-family-default, "AS Circular", Helvetica Neue, Arial, sans-serif);font-size:var(--ds-size-200, 1rem);outline:none;text-overflow:ellipsis;white-space:nowrap}input::-ms-reveal,input::-ms-clear{display:none}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{margin:0;-webkit-appearance:none}input[type=number]{-moz-appearance:textfield;appearance:textfield}input:disabled{background:none;pointer-events:none}:host([bordered]) input{padding:var(--ds-size-400, 2rem) 0 var(--ds-size-100, 0.5rem)}`;
4177
+ var styleCss$4 = css`: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}.typeIcon{display:flex;flex-direction:row;align-items:center}.typeIcon [auro-icon]{--ds-auro-icon-size: var(--ds-size-300, 1.5rem);height:var(--ds-size-300, 1.5rem);margin-right:var(--ds-size-100, 0.5rem)}.notificationIcons{display:flex;flex-direction:row;padding-right:var(--ds-size-100, 0.5rem)}:host([bordered]) .typeIcon{padding-left:var(--ds-size-100, 0.5rem)}:host([bordered]) .notificationIcons{align-items:center}.notification:not(:first-of-type){margin-left:var(--ds-size-100, 0.5rem)}.alertNotification{width:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-25, 0.125rem));height:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-25, 0.125rem))}.passwordBtn{width:calc(var(--ds-size-300, 1.5rem));height:calc(var(--ds-size-300, 1.5rem))}.notificationBtn{display:block;width:var(--ds-size-300, 1.5rem);height:var(--ds-size-300, 1.5rem);padding:0;border:0;background:unset;cursor:pointer}.notificationBtn [auro-icon]{display:block;height:var(--ds-size-300, 1.5rem);--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}.notificationBtn [auro-icon][hidden]{display:none}:host(:not([bordered])) .typeIcon,:host(:not([bordered])) .notificationIcons{align-items:flex-end;padding-bottom:var(--ds-size-50, 0.25rem)}.clearBtn{transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1);overflow:hidden;width:0;opacity:0}:host .wrapper:hover .clearBtn,:host .wrapper:focus-within .clearBtn{width:calc(var(--ds-size-200, 1rem) + var(--ds-size-25, 0.125rem));height:calc(var(--ds-size-200, 1rem) + var(--ds-size-25, 0.125rem));opacity:1}:host(:focus-within[type=password]) .notificationIcons[hasValue] .alertNotification{overflow:hidden;width:0;height:0;padding:0;margin:0;visibility:hidden}input{border:unset}.wrapper{position:relative;overflow:hidden;border-style:solid}:host(:not([bordered],[borderless])) .wrapper{border-width:1px 0}:host([bordered]) .wrapper{border-width:1px;border-radius:var(--ds-border-radius, 0.375rem)}:host(:not([borderless])) .wrapper:focus-within:before{position:absolute;display:block;border-bottom-width:1px;border-bottom-style:solid;content:"";inset:0;pointer-events:none}:host([validity]:not([validity=valid])) .wrapper:before{border-bottom:0}label{transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1);position:absolute;overflow:hidden;pointer-events:none;text-overflow:ellipsis;white-space:nowrap}:host(:not([bordered])) label{top:calc(100% - var(--ds-size-25, 0.125rem));transform:translateY(-100%)}:host(:not([bordered])) label.withIcon{left:var(--ds-size-400, 2rem)}:host([bordered]) label{top:50%;transform:translateY(-50%)}:host([bordered]) label.withIcon{left:var(--ds-size-500, 2.5rem)}:host([bordered]) label:not(label.withIcon){left:var(--ds-size-100, 0.5rem)}:host .wrapper:focus-within label{top:var(--ds-size-100, 0.5rem);font-size:var(--ds-text-body-size-xs, 0.75rem);transform:unset}:host label.withValue{top:var(--ds-size-100, 0.5rem);font-size:var(--ds-text-body-size-xs, 0.75rem);transform:unset}:host([activeLabel]) .wrapper label{top:var(--ds-size-100, 0.5rem);font-size:var(--ds-text-body-size-xs, 0.75rem);transform:unset}:host{position:relative;display:block}.wrapper{display:flex;flex-direction:row}.main{display:flex;flex-direction:row;position:relative;flex:1}input{transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1);position:relative;overflow:hidden;min-height:var(--ds-size-200, 1rem);max-height:var(--ds-size-200, 1rem);flex:1;padding:var(--ds-size-400, 2rem) 0 var(--ds-size-50, 0.25rem);margin:0;font-family:var(--ds-font-family-default, "AS Circular", Helvetica Neue, Arial, sans-serif);font-size:var(--ds-size-200, 1rem);outline:none;text-overflow:ellipsis;white-space:nowrap}input::-ms-reveal,input::-ms-clear{display:none}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{margin:0;-webkit-appearance:none}input[type=number]{-moz-appearance:textfield;appearance:textfield}input:disabled{background:none;pointer-events:none}:host([bordered]) input{padding:var(--ds-size-400, 2rem) 0 var(--ds-size-100, 0.5rem)}`;
4320
4178
 
4321
- var colorCss$4 = css`.wrapper{border-color:transparent}input{background-color:transparent;caret-color:var(--ds-auro-input-caret-color);color:var(--ds-auro-input-text-color)}input::placeholder{color:transparent}input:focus::placeholder{color:var(--ds-auro-input-placeholder-text-color)}input:disabled{--ds-auro-input-input-text-color: var(--ds-color-text-ui-disabled-default, #adadad)}label{color:var(--ds-auro-input-label-text-color)}:host(:not([bordered],[borderless])) .wrapper{border-bottom-color:var(--ds-auro-input-border-color)}:host([bordered]) .wrapper{border-color:var(--ds-auro-input-border-color);background-color:var(--ds-auro-input-container-color)}:host([bordered]) .wrapper:focus-within{--ds-auro-input-border-color: var(--ds-color-border-ui-focus-default, #2c67b5);box-shadow:inset 0 0 0 1px var(--ds-auro-input-border-color)}:host(:not([borderless])) .wrapper:focus-within{--ds-auro-input-border-color: var(--ds-color-border-ui-focus-default, #2c67b5)}:host(:not([borderless])) .wrapper:focus-within:before{border-bottom-color:transparent}:host([validity]:not([validity=valid])){--ds-auro-input-border-color: var(--ds-color-border-error-default, #cc1816)}:host([validity]:not([validity=valid])[bordered]) .wrapper{--ds-auro-input-border-color: var(--ds-color-border-error-default, #cc1816);box-shadow:inset 0 0 0 1px var(--ds-auro-input-border-color)}:host([disabled]){--ds-auro-input-border-color: var(--ds-color-border-ui-disabled-default, #adadad);--ds-auro-input-label-text-color: var(--ds-color-text-ui-disabled-default, #adadad)}`;
4179
+ var colorCss$4 = css`.wrapper{border-color:transparent}input{background-color:transparent;caret-color:var(--ds-auro-input-caret-color);color:var(--ds-auro-input-text-color)}input::placeholder{color:transparent}input:focus::placeholder{color:var(--ds-auro-input-placeholder-text-color)}input:disabled{--ds-auro-input-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}label{color:var(--ds-auro-input-label-text-color)}.alertNotification{color:var(--ds-auro-input-error-icon-color)}:host(:not([bordered],[borderless])) .wrapper{border-bottom-color:var(--ds-auro-input-border-color)}:host([bordered]) .wrapper{border-color:var(--ds-auro-input-border-color);background-color:var(--ds-auro-input-container-color)}:host([bordered]) .wrapper:focus-within{--ds-auro-input-border-color: var(--ds-advanced-color-state-focused, #01426a);box-shadow:inset 0 0 0 1px var(--ds-auro-input-border-color)}:host([validity]:not([validity=valid])[bordered]) .wrapper{--ds-auro-input-border-color: var(--ds-basic-color-status-error, #e31f26);box-shadow:inset 0 0 0 1px var(--ds-auro-input-border-color)}:host([disabled]){--ds-auro-input-border-color: var(--ds-basic-color-border-subtle, #dddddd);--ds-auro-input-label-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host([onDark][bordered]){--ds-auro-input-caret-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-input-label-text-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db);--ds-auro-input-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-input-placeholder-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-input-border-color: var(--ds-basic-color-border-inverse, #ffffff);--ds-auro-input-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-input-error-icon-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8)}:host([onDark][bordered]) .wrapper:focus-within{--ds-auro-input-border-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);box-shadow:inset 0 0 0 1px var(--ds-auro-input-border-color)}:host([onDark][validity]:not([validity=valid])[bordered]) .wrapper{--ds-auro-input-border-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8);box-shadow:inset 0 0 0 1px var(--ds-auro-input-border-color)}:host([onDark][disabled]){--ds-auro-input-border-color: var(--ds-basic-color-border-inverse, #ffffff);--ds-auro-input-label-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894);--ds-auro-input-container-color: var(--ds-advanced-color-shared-background-inverse-disabled, rgba(255, 255, 255, 0.1))}`;
4322
4180
 
4323
- var tokensCss$4 = css`:host{--ds-auro-input-border-color: var(--ds-color-border-secondary-default, #939fad);--ds-auro-input-container-color: var(--ds-color-container-primary-default, #ffffff);--ds-auro-input-caret-color: var(--ds-color-text-ui-focus-default, #2c67b5);--ds-auro-input-label-text-color: var(--ds-color-text-tertiary-default, #6a717c);--ds-auro-input-placeholder-text-color: var(--ds-color-text-primary-default, #2a2a2a);--ds-auro-input-text-color: var(--ds-color-text-primary-default, #2a2a2a)}`;
4181
+ var tokensCss$4 = css`:host{--ds-auro-input-border-color: var(--ds-basic-color-border-bold, #585e67);--ds-auro-input-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-input-caret-color: var(--ds-advanced-color-state-focused, #01426a);--ds-auro-input-label-text-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-input-placeholder-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-input-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-input-error-icon-color: var(--ds-basic-color-status-error, #e31f26)}`;
4324
4182
 
4325
4183
  /** Checks if value is string */
4326
4184
  function isString(str) {
@@ -8171,7 +8029,7 @@ class AuroInputUtilities {
8171
8029
 
8172
8030
  /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
8173
8031
 
8174
- let AuroLibraryRuntimeUtils$4 = class AuroLibraryRuntimeUtils {
8032
+ let AuroLibraryRuntimeUtils$1$1 = class AuroLibraryRuntimeUtils {
8175
8033
 
8176
8034
  /* eslint-disable jsdoc/require-param */
8177
8035
 
@@ -8240,7 +8098,7 @@ let AuroLibraryRuntimeUtils$4 = class AuroLibraryRuntimeUtils {
8240
8098
 
8241
8099
  class AuroFormValidation {
8242
8100
  constructor() {
8243
- this.runtimeUtils = new AuroLibraryRuntimeUtils$4();
8101
+ this.runtimeUtils = new AuroLibraryRuntimeUtils$1$1();
8244
8102
  }
8245
8103
 
8246
8104
  /**
@@ -8580,6 +8438,7 @@ class BaseInput extends LitElement {
8580
8438
  this.min = undefined;
8581
8439
  this.maxLength = undefined;
8582
8440
  this.minLength = undefined;
8441
+ this.onDark = false;
8583
8442
  this.activeLabel = false;
8584
8443
  this.setCustomValidityForType = undefined;
8585
8444
  }
@@ -8770,6 +8629,14 @@ class BaseInput extends LitElement {
8770
8629
  type: Boolean
8771
8630
  },
8772
8631
 
8632
+ /**
8633
+ * Sets onDark styles on input.
8634
+ */
8635
+ onDark: {
8636
+ type: Boolean,
8637
+ reflect: true
8638
+ },
8639
+
8773
8640
  /**
8774
8641
  * Specifies a regular expression the form control's value should match.
8775
8642
  */
@@ -9606,7 +9473,7 @@ const cacheFetch$1 = (uri, options = {}) => {
9606
9473
  return _fetchMap$1.get(uri);
9607
9474
  };
9608
9475
 
9609
- var styleCss$3$1 = css`: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}`;
9476
+ var styleCss$3$1 = css`: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}`;
9610
9477
 
9611
9478
  // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
9612
9479
  // See LICENSE in the project root for license information.
@@ -9614,7 +9481,6 @@ var styleCss$3$1 = css`:focus:not(:focus-visible){outline:3px solid transparent}
9614
9481
 
9615
9482
  // See https://git.io/JJ6SJ for "How to document your components using JSDoc"
9616
9483
  /**
9617
- * @attr {Boolean} onDark - Set value for on-dark version of auro-icon
9618
9484
  * @slot - Hidden from visibility, used for a11y if icon description is needed
9619
9485
  */
9620
9486
 
@@ -9629,6 +9495,10 @@ let BaseIcon$1 = class BaseIcon extends AuroElement$1 {
9629
9495
  static get properties() {
9630
9496
  return {
9631
9497
  ...super.properties,
9498
+
9499
+ /**
9500
+ * Set value for on-dark version of auro-icon.
9501
+ */
9632
9502
  onDark: {
9633
9503
  type: Boolean,
9634
9504
  reflect: true
@@ -9687,81 +9557,11 @@ let BaseIcon$1 = class BaseIcon extends AuroElement$1 {
9687
9557
  }
9688
9558
  };
9689
9559
 
9690
- var tokensCss$3 = css`:host{--ds-auro-icon-color:var(--ds-color-icon-primary-default, #676767);--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}`;
9691
-
9692
- var colorCss$3 = css`: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)}`;
9693
-
9694
- // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
9695
- // See LICENSE in the project root for license information.
9696
-
9697
- // ---------------------------------------------------------------------
9698
-
9699
- /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
9700
-
9701
- let AuroLibraryRuntimeUtils$3 = class AuroLibraryRuntimeUtils {
9702
-
9703
- /* eslint-disable jsdoc/require-param */
9704
-
9705
- /**
9706
- * This will register a new custom element with the browser.
9707
- * @param {String} name - The name of the custom element.
9708
- * @param {Object} componentClass - The class to register as a custom element.
9709
- * @returns {void}
9710
- */
9711
- registerComponent(name, componentClass) {
9712
- if (!customElements.get(name)) {
9713
- customElements.define(name, class extends componentClass {});
9714
- }
9715
- }
9716
-
9717
- /**
9718
- * Finds and returns the closest HTML Element based on a selector.
9719
- * @returns {void}
9720
- */
9721
- closestElement(
9722
- selector, // selector like in .closest()
9723
- base = this, // extra functionality to skip a parent
9724
- __Closest = (el, found = el && el.closest(selector)) =>
9725
- !el || el === document || el === window
9726
- ? null // standard .closest() returns null for non-found selectors also
9727
- : found
9728
- ? found // found a selector INside this element
9729
- : __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
9730
- ) {
9731
- return __Closest(base);
9732
- }
9733
- /* eslint-enable jsdoc/require-param */
9734
-
9735
- /**
9736
- * 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.
9737
- * @param {Object} elem - The element to check.
9738
- * @param {String} tagName - The name of the Auro component to check for or add as an attribute.
9739
- * @returns {void}
9740
- */
9741
- handleComponentTagRename(elem, tagName) {
9742
- const tag = tagName.toLowerCase();
9743
- const elemTag = elem.tagName.toLowerCase();
9744
-
9745
- if (elemTag !== tag) {
9746
- elem.setAttribute(tag, true);
9747
- }
9748
- }
9749
-
9750
- /**
9751
- * Validates if an element is a specific Auro component.
9752
- * @param {Object} elem - The element to validate.
9753
- * @param {String} tagName - The name of the Auro component to check against.
9754
- * @returns {Boolean} - Returns true if the element is the specified Auro component.
9755
- */
9756
- elementMatch(elem, tagName) {
9757
- const tag = tagName.toLowerCase();
9758
- const elemTag = elem.tagName.toLowerCase();
9560
+ var tokensCss$3 = css`: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)}`;
9759
9561
 
9760
- return elemTag === tag || elem.hasAttribute(tag);
9761
- }
9762
- };
9562
+ var colorCss$3 = css`: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)}`;
9763
9563
 
9764
- // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
9564
+ // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
9765
9565
  // See LICENSE in the project root for license information.
9766
9566
 
9767
9567
 
@@ -9769,6 +9569,7 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
9769
9569
  constructor() {
9770
9570
  super();
9771
9571
 
9572
+ this.variant = undefined;
9772
9573
  this.privateDefaults();
9773
9574
  }
9774
9575
 
@@ -9778,22 +9579,8 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
9778
9579
  * @returns {void}
9779
9580
  */
9780
9581
  privateDefaults() {
9781
- this.accent = false;
9782
- this.customColor = false;
9783
- this.customSvg = false;
9784
- this.disabled = false;
9785
- this.emphasis = false;
9786
- this.error = false;
9787
- this.info = false;
9788
- this.label = false;
9789
- this.primary = false;
9790
- this.secondary = false;
9791
- this.subtle = false;
9792
- this.success = false;
9793
- this.tertiary = false;
9794
- this.warning = false;
9795
9582
  this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
9796
- this.runtimeUtils = new AuroLibraryRuntimeUtils$3();
9583
+ this.runtimeUtils = new AuroLibraryRuntimeUtils$1$1();
9797
9584
  }
9798
9585
 
9799
9586
  // function to define props used within the scope of this component
@@ -9801,14 +9588,6 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
9801
9588
  return {
9802
9589
  ...super.properties,
9803
9590
 
9804
- /**
9805
- * Sets the icon to use the accent style.
9806
- */
9807
- accent: {
9808
- type: Boolean,
9809
- reflect: true
9810
- },
9811
-
9812
9591
  /**
9813
9592
  * Set aria-hidden value. Default is `true`. Option is `false`.
9814
9593
  */
@@ -9839,38 +9618,6 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
9839
9618
  type: Boolean
9840
9619
  },
9841
9620
 
9842
- /**
9843
- * Sets the icon to use the disabled style.
9844
- */
9845
- disabled: {
9846
- type: Boolean,
9847
- reflect: true
9848
- },
9849
-
9850
- /**
9851
- * Sets the icon to use the emphasis style.
9852
- */
9853
- emphasis: {
9854
- type: Boolean,
9855
- reflect: true
9856
- },
9857
-
9858
- /**
9859
- * Sets the icon to use the error style.
9860
- */
9861
- error: {
9862
- type: Boolean,
9863
- reflect: true
9864
- },
9865
-
9866
- /**
9867
- * Sets the icon to use the info style.
9868
- */
9869
- info: {
9870
- type: Boolean,
9871
- reflect: true
9872
- },
9873
-
9874
9621
  /**
9875
9622
  * Exposes content in slot as icon label.
9876
9623
  */
@@ -9888,50 +9635,10 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
9888
9635
  },
9889
9636
 
9890
9637
  /**
9891
- * DEPRECATED: Sets the icon to use the baseline primary icon style.
9892
- */
9893
- primary: {
9894
- type: Boolean,
9895
- reflect: true
9896
- },
9897
-
9898
- /**
9899
- * Sets the icon to use the secondary style.
9638
+ * 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`.
9900
9639
  */
9901
- secondary: {
9902
- type: Boolean,
9903
- reflect: true
9904
- },
9905
-
9906
- /**
9907
- * Sets the icon to use the subtle style.
9908
- */
9909
- subtle: {
9910
- type: Boolean,
9911
- reflect: true
9912
- },
9913
-
9914
- /**
9915
- * Sets the icon to use the success style.
9916
- */
9917
- success: {
9918
- type: Boolean,
9919
- reflect: true
9920
- },
9921
-
9922
- /**
9923
- * Sets the icon to use the tertiary style.
9924
- */
9925
- tertiary: {
9926
- type: Boolean,
9927
- reflect: true
9928
- },
9929
-
9930
- /**
9931
- * Sets the icon to use the warning style.
9932
- */
9933
- warning: {
9934
- type: Boolean,
9640
+ variant: {
9641
+ type: String,
9935
9642
  reflect: true
9936
9643
  }
9937
9644
  };
@@ -9955,7 +9662,7 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
9955
9662
  *
9956
9663
  */
9957
9664
  static register(name = "auro-icon") {
9958
- AuroLibraryRuntimeUtils$3.prototype.registerComponent(name, AuroIcon);
9665
+ AuroLibraryRuntimeUtils$1$1.prototype.registerComponent(name, AuroIcon);
9959
9666
  }
9960
9667
 
9961
9668
  connectedCallback() {
@@ -10021,197 +9728,17 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
10021
9728
  }
10022
9729
  };
10023
9730
 
10024
- var iconVersion$1 = '6.1.2';
10025
-
10026
- // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
10027
- // See LICENSE in the project root for license information.
10028
-
10029
-
10030
- let AuroDependencyVersioning$2 = class AuroDependencyVersioning {
10031
-
10032
- /**
10033
- * Generates a unique string to be used for child auro element naming.
10034
- * @private
10035
- * @param {string} baseName - Defines the first part of the unique element name.
10036
- * @param {string} version - Version of the component that will be appended to the baseName.
10037
- * @returns {string} - Unique string to be used for naming.
10038
- */
10039
- generateElementName(baseName, version) {
10040
- let result = baseName;
10041
-
10042
- result += '-';
10043
- result += version.replace(/[.]/g, '_');
10044
-
10045
- return result;
10046
- }
10047
-
10048
- /**
10049
- * Generates a unique string to be used for child auro element naming.
10050
- * @param {string} baseName - Defines the first part of the unique element name.
10051
- * @param {string} version - Version of the component that will be appended to the baseName.
10052
- * @returns {string} - Unique string to be used for naming.
10053
- */
10054
- generateTag(baseName, version, tagClass) {
10055
- const elementName = this.generateElementName(baseName, version);
10056
- const tag = literal`${unsafeStatic(elementName)}`;
10057
-
10058
- if (!customElements.get(elementName)) {
10059
- customElements.define(elementName, class extends tagClass {});
10060
- }
10061
-
10062
- return tag;
10063
- }
10064
- };
10065
-
10066
- // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
10067
- // See LICENSE in the project root for license information.
10068
-
10069
- // ---------------------------------------------------------------------
10070
-
10071
- /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
10072
-
10073
- let AuroLibraryRuntimeUtils$2$1 = class AuroLibraryRuntimeUtils {
10074
-
10075
- /* eslint-disable jsdoc/require-param */
10076
-
10077
- /**
10078
- * This will register a new custom element with the browser.
10079
- * @param {String} name - The name of the custom element.
10080
- * @param {Object} componentClass - The class to register as a custom element.
10081
- * @returns {void}
10082
- */
10083
- registerComponent(name, componentClass) {
10084
- if (!customElements.get(name)) {
10085
- customElements.define(name, class extends componentClass {});
10086
- }
10087
- }
10088
-
10089
- /**
10090
- * Finds and returns the closest HTML Element based on a selector.
10091
- * @returns {void}
10092
- */
10093
- closestElement(
10094
- selector, // selector like in .closest()
10095
- base = this, // extra functionality to skip a parent
10096
- __Closest = (el, found = el && el.closest(selector)) =>
10097
- !el || el === document || el === window
10098
- ? null // standard .closest() returns null for non-found selectors also
10099
- : found
10100
- ? found // found a selector INside this element
10101
- : __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
10102
- ) {
10103
- return __Closest(base);
10104
- }
10105
- /* eslint-enable jsdoc/require-param */
10106
-
10107
- /**
10108
- * 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.
10109
- * @param {Object} elem - The element to check.
10110
- * @param {String} tagName - The name of the Auro component to check for or add as an attribute.
10111
- * @returns {void}
10112
- */
10113
- handleComponentTagRename(elem, tagName) {
10114
- const tag = tagName.toLowerCase();
10115
- const elemTag = elem.tagName.toLowerCase();
10116
-
10117
- if (elemTag !== tag) {
10118
- elem.setAttribute(tag, true);
10119
- }
10120
- }
10121
-
10122
- /**
10123
- * Validates if an element is a specific Auro component.
10124
- * @param {Object} elem - The element to validate.
10125
- * @param {String} tagName - The name of the Auro component to check against.
10126
- * @returns {Boolean} - Returns true if the element is the specified Auro component.
10127
- */
10128
- elementMatch(elem, tagName) {
10129
- const tag = tagName.toLowerCase();
10130
- const elemTag = elem.tagName.toLowerCase();
10131
-
10132
- return elemTag === tag || elem.hasAttribute(tag);
10133
- }
10134
- };
10135
-
10136
- var styleCss$2$1 = css`: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}`;
10137
-
10138
- var colorCss$2 = css`[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}`;
10139
-
10140
- var tokensCss$2 = css`: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}`;
10141
-
10142
- // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
10143
- // See LICENSE in the project root for license information.
10144
-
10145
- // ---------------------------------------------------------------------
10146
-
10147
- /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
10148
-
10149
- let AuroLibraryRuntimeUtils$1$1 = class AuroLibraryRuntimeUtils {
10150
-
10151
- /* eslint-disable jsdoc/require-param */
10152
-
10153
- /**
10154
- * This will register a new custom element with the browser.
10155
- * @param {String} name - The name of the custom element.
10156
- * @param {Object} componentClass - The class to register as a custom element.
10157
- * @returns {void}
10158
- */
10159
- registerComponent(name, componentClass) {
10160
- if (!customElements.get(name)) {
10161
- customElements.define(name, class extends componentClass {});
10162
- }
10163
- }
10164
-
10165
- /**
10166
- * Finds and returns the closest HTML Element based on a selector.
10167
- * @returns {void}
10168
- */
10169
- closestElement(
10170
- selector, // selector like in .closest()
10171
- base = this, // extra functionality to skip a parent
10172
- __Closest = (el, found = el && el.closest(selector)) =>
10173
- !el || el === document || el === window
10174
- ? null // standard .closest() returns null for non-found selectors also
10175
- : found
10176
- ? found // found a selector INside this element
10177
- : __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
10178
- ) {
10179
- return __Closest(base);
10180
- }
10181
- /* eslint-enable jsdoc/require-param */
10182
-
10183
- /**
10184
- * 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.
10185
- * @param {Object} elem - The element to check.
10186
- * @param {String} tagName - The name of the Auro component to check for or add as an attribute.
10187
- * @returns {void}
10188
- */
10189
- handleComponentTagRename(elem, tagName) {
10190
- const tag = tagName.toLowerCase();
10191
- const elemTag = elem.tagName.toLowerCase();
9731
+ var iconVersion$1 = '8.0.1';
10192
9732
 
10193
- if (elemTag !== tag) {
10194
- elem.setAttribute(tag, true);
10195
- }
10196
- }
9733
+ var styleCss$2$1 = css`: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}`;
10197
9734
 
10198
- /**
10199
- * Validates if an element is a specific Auro component.
10200
- * @param {Object} elem - The element to validate.
10201
- * @param {String} tagName - The name of the Auro component to check against.
10202
- * @returns {Boolean} - Returns true if the element is the specified Auro component.
10203
- */
10204
- elementMatch(elem, tagName) {
10205
- const tag = tagName.toLowerCase();
10206
- const elemTag = elem.tagName.toLowerCase();
9735
+ var colorCss$2 = css`[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}`;
10207
9736
 
10208
- return elemTag === tag || elem.hasAttribute(tag);
10209
- }
10210
- };
9737
+ var tokensCss$2 = css`: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}`;
10211
9738
 
10212
9739
  var styleCss$1$1 = css`: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}}`;
10213
9740
 
10214
- var colorCss$1$1 = css`: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}`;
9741
+ var colorCss$1$1 = css`: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}`;
10215
9742
 
10216
9743
  var tokensCss$1 = css`:host{--ds-auro-loader-background-color:currentcolor;--ds-auro-loader-border-color:currentcolor;--ds-auro-loader-color:currentcolor}`;
10217
9744
 
@@ -10219,25 +9746,6 @@ var tokensCss$1 = css`:host{--ds-auro-loader-background-color:currentcolor;--ds-
10219
9746
  // See LICENSE in the project root for license information.
10220
9747
 
10221
9748
 
10222
- // See https://git.io/JJ6SJ for "How to document your components using JSDoc"
10223
- /**
10224
- * The auro-loader element is an easy to use animated loader component.
10225
- *
10226
- * @attr {Boolean} pulse - sets loader type
10227
- * @attr {Boolean} ringworm - sets loader type
10228
- * @attr {Boolean} laser - sets loader type
10229
- * @attr {Boolean} orbit - sets loader type
10230
- * @attr {Boolean} white - sets color of loader to white
10231
- * @attr {Boolean} ondark - sets color of loader to auro-color-ui-default-on-dark
10232
- * @attr {Boolean} onlight - sets color of loader to auro-color-ui-default-on-light
10233
- * @attr {Boolean} xs - sets size to extra small
10234
- * @attr {Boolean} sm - sets size to small
10235
- * @attr {Boolean} md - sets size to medium
10236
- * @attr {Boolean} lg - sets size to large
10237
- * @csspart element - apply style to adjust speed of animation
10238
- */
10239
-
10240
- // build the component class
10241
9749
  class AuroLoader extends LitElement {
10242
9750
  constructor() {
10243
9751
  super();
@@ -10271,19 +9779,35 @@ class AuroLoader extends LitElement {
10271
9779
  // function to define props used within the scope of this component
10272
9780
  static get properties() {
10273
9781
  return {
10274
- pulse: {
9782
+
9783
+ /**
9784
+ * Sets loader to laser type.
9785
+ */
9786
+ laser: {
10275
9787
  type: Boolean,
10276
9788
  reflect: true
10277
9789
  },
9790
+
9791
+ /**
9792
+ * Sets loader to orbit type.
9793
+ */
10278
9794
  orbit: {
10279
9795
  type: Boolean,
10280
9796
  reflect: true
10281
9797
  },
10282
- ringworm: {
9798
+
9799
+ /**
9800
+ * Sets loader to pulse type.
9801
+ */
9802
+ pulse: {
10283
9803
  type: Boolean,
10284
9804
  reflect: true
10285
9805
  },
10286
- laser: {
9806
+
9807
+ /**
9808
+ * Sets loader to ringworm type.
9809
+ */
9810
+ ringworm: {
10287
9811
  type: Boolean,
10288
9812
  reflect: true
10289
9813
  }
@@ -10357,23 +9881,26 @@ class AuroLoader extends LitElement {
10357
9881
  }
10358
9882
  }
10359
9883
 
10360
- var loaderVersion = '4.0.0';
9884
+ var loaderVersion = '5.0.0';
10361
9885
 
9886
+ /* eslint-disable max-lines */
10362
9887
  // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
10363
9888
  // See LICENSE in the project root for license information.
10364
9889
 
10365
9890
 
10366
9891
  /**
10367
9892
  * @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
10368
- * @attr {Boolean} disabled - If set to true button will become disabled and not allow for interactions
9893
+ * @attr {Boolean} disabled - If set to true, button will become disabled and not allow for interactions
10369
9894
  * @attr {Boolean} iconOnly - If set to true, the button will contain an icon with no additional content
10370
9895
  * @attr {Boolean} loading - If set to true button text will be replaced with `auro-loader` and become disabled
9896
+ * @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.
10371
9897
  * @attr {Boolean} onDark - Set value for on-dark version of auro-button
10372
9898
  * @attr {Boolean} rounded - If set to true, the button will have a rounded shape
10373
9899
  * @attr {Boolean} slim - Set value for slim version of auro-button
10374
9900
  * @attr {Boolean} fluid - Alters the shape of the button to be full width of its parent container
10375
9901
  * @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.
10376
9902
  * @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.
9903
+ * @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.
10377
9904
  * @attr {String} id - Set the unique ID of an element.
10378
9905
  * @attr {String} title - Sets title attribute. The information is most often shown as a tooltip text when the mouse moves over the element.
10379
9906
  * @attr {String} type - The type of the button. Possible values are: `submit`, `reset`, `button`
@@ -10418,6 +9945,7 @@ class AuroButton extends LitElement {
10418
9945
  this.rounded = false;
10419
9946
  this.slim = false;
10420
9947
  this.fluid = false;
9948
+ this.loadingText = this.loadingText || 'Loading...';
10421
9949
 
10422
9950
  // Support for HTML5 forms
10423
9951
  if (typeof this.attachInternals === 'function') {
@@ -10432,7 +9960,7 @@ class AuroButton extends LitElement {
10432
9960
  /**
10433
9961
  * Generate unique names for dependency components.
10434
9962
  */
10435
- const versioning = new AuroDependencyVersioning$2();
9963
+ const versioning = new AuroDependencyVersioning$1();
10436
9964
 
10437
9965
  /**
10438
9966
  * @private
@@ -10478,6 +10006,9 @@ class AuroButton extends LitElement {
10478
10006
  type: Boolean,
10479
10007
  reflect: true
10480
10008
  },
10009
+ loadingText: {
10010
+ type: String
10011
+ },
10481
10012
  onDark: {
10482
10013
  type: Boolean,
10483
10014
  reflect: true
@@ -10498,6 +10029,10 @@ class AuroButton extends LitElement {
10498
10029
  type: String,
10499
10030
  reflect: true
10500
10031
  },
10032
+ ariaexpanded: {
10033
+ type: Boolean,
10034
+ reflect: true
10035
+ },
10501
10036
  title: {
10502
10037
  type: String,
10503
10038
  reflect: true
@@ -10527,7 +10062,7 @@ class AuroButton extends LitElement {
10527
10062
  *
10528
10063
  */
10529
10064
  static register(name = "auro-button") {
10530
- AuroLibraryRuntimeUtils$2$1.prototype.registerComponent(name, AuroButton);
10065
+ AuroLibraryRuntimeUtils$1$1.prototype.registerComponent(name, AuroButton);
10531
10066
  }
10532
10067
 
10533
10068
  /**
@@ -10569,12 +10104,22 @@ class AuroButton extends LitElement {
10569
10104
  this.notifyReady();
10570
10105
  }
10571
10106
 
10107
+ /**
10108
+ * Submits the form that this button is associated with.
10109
+ * @private
10110
+ * @returns {void}
10111
+ */
10572
10112
  surfaceSubmitEvent() {
10573
10113
  if (this.form) {
10574
10114
  this.form.requestSubmit();
10575
10115
  }
10576
10116
  }
10577
10117
 
10118
+ /**
10119
+ * Returns the form element that this button is associated with.
10120
+ * @private
10121
+ * @returns {HTMLFormElement|null}
10122
+ */
10578
10123
  get form() {
10579
10124
  return this.internals ? this.internals.form : null;
10580
10125
  }
@@ -10594,8 +10139,9 @@ class AuroButton extends LitElement {
10594
10139
  return html`
10595
10140
  <button
10596
10141
  part="button"
10597
- aria-label="${ifDefined(this.arialabel ? this.arialabel : undefined)}"
10142
+ aria-label="${ifDefined(this.loading ? this.loadingText : this.arialabel || undefined)}"
10598
10143
  aria-labelledby="${ifDefined(this.arialabelledby ? this.arialabelledby : undefined)}"
10144
+ aria-expanded="${ifDefined(this.ariaexpanded)}"
10599
10145
  ?autofocus="${this.autofocus}"
10600
10146
  class="${classMap(classes)}"
10601
10147
  ?disabled="${this.disabled || this.loading}"
@@ -10623,13 +10169,13 @@ class AuroButton extends LitElement {
10623
10169
  }
10624
10170
  }
10625
10171
 
10626
- var buttonVersion = '8.2.2';
10172
+ var buttonVersion = '9.3.0';
10627
10173
 
10628
- var colorCss$5 = css`:host([error]){--ds-auro-helptext-color: var(--ds-color-text-error-default, #cc1816)}.helptext-wrapper{color:var(--ds-auro-helptext-color)}`;
10174
+ var colorCss$5 = css`: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)}`;
10629
10175
 
10630
10176
  var styleCss$5 = css`.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}`;
10631
10177
 
10632
- var tokensCss$5 = css`:host{--ds-auro-helptext-color: var(--ds-color-text-tertiary-default, #6a717c)}`;
10178
+ var tokensCss$5 = css`:host{--ds-auro-helptext-color: var(--ds-basic-color-texticon-muted, #676767)}`;
10633
10179
 
10634
10180
  // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
10635
10181
  // See LICENSE in the project root for license information.
@@ -10638,7 +10184,7 @@ var tokensCss$5 = css`:host{--ds-auro-helptext-color: var(--ds-color-text-tertia
10638
10184
 
10639
10185
  /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
10640
10186
 
10641
- let AuroLibraryRuntimeUtils$5 = class AuroLibraryRuntimeUtils {
10187
+ let AuroLibraryRuntimeUtils$2 = class AuroLibraryRuntimeUtils {
10642
10188
 
10643
10189
  /* eslint-disable jsdoc/require-param */
10644
10190
 
@@ -10716,9 +10262,10 @@ class AuroHelpText extends LitElement {
10716
10262
  super();
10717
10263
 
10718
10264
  this.error = false;
10265
+ this.onDark = false;
10719
10266
  this.hasTextContent = false;
10720
10267
 
10721
- AuroLibraryRuntimeUtils$5.prototype.handleComponentTagRename(this, 'auro-helptext');
10268
+ AuroLibraryRuntimeUtils$2.prototype.handleComponentTagRename(this, 'auro-helptext');
10722
10269
  }
10723
10270
 
10724
10271
  static get styles() {
@@ -10754,6 +10301,14 @@ class AuroHelpText extends LitElement {
10754
10301
  type: Boolean,
10755
10302
  reflect: true,
10756
10303
  },
10304
+
10305
+ /**
10306
+ * If declared, will apply onDark styles.
10307
+ */
10308
+ onDark: {
10309
+ type: Boolean,
10310
+ reflect: true
10311
+ }
10757
10312
  };
10758
10313
  }
10759
10314
 
@@ -10766,7 +10321,7 @@ class AuroHelpText extends LitElement {
10766
10321
  *
10767
10322
  */
10768
10323
  static register(name = "auro-helptext") {
10769
- AuroLibraryRuntimeUtils$5.prototype.registerComponent(name, AuroHelpText);
10324
+ AuroLibraryRuntimeUtils$2.prototype.registerComponent(name, AuroHelpText);
10770
10325
  }
10771
10326
 
10772
10327
  updated() {
@@ -10863,7 +10418,7 @@ class AuroInput extends BaseInput {
10863
10418
  *
10864
10419
  */
10865
10420
  static register(name = "auro-input") {
10866
- AuroLibraryRuntimeUtils$4.prototype.registerComponent(name, AuroInput);
10421
+ AuroLibraryRuntimeUtils$1$1.prototype.registerComponent(name, AuroInput);
10867
10422
  }
10868
10423
 
10869
10424
  /**
@@ -10903,7 +10458,8 @@ class AuroInput extends BaseInput {
10903
10458
  category="payment"
10904
10459
  name="${name}"
10905
10460
  part="accentIcon"
10906
- ?disabled="${this.disabled}">
10461
+ ?onDark="${this.onDark}"
10462
+ variant="${this.disabled ? 'disabled' : 'muted'}">
10907
10463
  </${this.iconTag}>
10908
10464
  `) : undefined
10909
10465
  }
@@ -10915,7 +10471,8 @@ class AuroInput extends BaseInput {
10915
10471
  category="interface"
10916
10472
  name="calendar"
10917
10473
  part="accentIcon"
10918
- ?disabled="${this.disabled}">
10474
+ ?onDark="${this.onDark}"
10475
+ variant="${this.disabled ? 'disabled' : 'muted'}">
10919
10476
  </${this.iconTag}>`
10920
10477
  : undefined
10921
10478
  }
@@ -10960,7 +10517,7 @@ class AuroInput extends BaseInput {
10960
10517
  <${this.iconTag}
10961
10518
  category="alert"
10962
10519
  name="error-stroke"
10963
- error>
10520
+ customColor
10964
10521
  </${this.iconTag}>
10965
10522
  </div>
10966
10523
  ` : undefined}
@@ -10969,6 +10526,7 @@ class AuroInput extends BaseInput {
10969
10526
  <div class="notification">
10970
10527
  <${this.buttonTag}
10971
10528
  variant="flat"
10529
+ ?onDark="${this.onDark}"
10972
10530
  aria-hidden="true"
10973
10531
  tabindex="-1"
10974
10532
  @click="${this.handleClickShowPassword}"
@@ -10992,6 +10550,7 @@ class AuroInput extends BaseInput {
10992
10550
  <div class="notification">
10993
10551
  <${this.buttonTag}
10994
10552
  variant="flat"
10553
+ ?onDark="${this.onDark}"
10995
10554
  class="notificationBtn clearBtn"
10996
10555
  aria-label="${i18n(this.lang, 'clearInput')}"
10997
10556
  @click="${this.handleClickClear}">
@@ -11010,14 +10569,14 @@ class AuroInput extends BaseInput {
11010
10569
  <!-- Help text and error message template -->
11011
10570
  ${!this.validity || this.validity === undefined || this.validity === 'valid'
11012
10571
  ? html`
11013
- <${this.helpTextTag}>
10572
+ <${this.helpTextTag} ?onDark="${this.onDark}">
11014
10573
  <p id="${this.uniqueId}" part="helpText">
11015
10574
  <slot name="helptext">${this.getHelpText()}</slot>
11016
10575
  </p>
11017
10576
  </${this.helpTextTag}>
11018
10577
  `
11019
10578
  : html`
11020
- <${this.helpTextTag} error>
10579
+ <${this.helpTextTag} error ?onDark="${this.onDark}">
11021
10580
  <p id="${this.uniqueId}" role="alert" aria-live="assertive" part="helpText">
11022
10581
  ${this.errorMessage}
11023
10582
  </p>
@@ -11032,9 +10591,9 @@ var inputVersion = '4.2.0';
11032
10591
 
11033
10592
  var colorCss$1 = css`#headerContainer{box-shadow:var(--ds-auro-dropdownbib-header-boxshadow-color)}#footerContainer{background-color:var(--ds-auro-dropdownbib-footer-container-color)}`;
11034
10593
 
11035
- var styleCss$2 = css`#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)}`;
10594
+ var styleCss$2 = css`#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)}`;
11036
10595
 
11037
- var tokenCss = css`: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)}`;
10596
+ var tokenCss = css`: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)}`;
11038
10597
 
11039
10598
  // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
11040
10599
  // See LICENSE in the project root for license information.
@@ -11043,7 +10602,7 @@ var tokenCss = css`:host{--ds-auro-dropdownbib-header-boxshadow-color: var(--ds-
11043
10602
 
11044
10603
  /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
11045
10604
 
11046
- let AuroLibraryRuntimeUtils$2 = class AuroLibraryRuntimeUtils {
10605
+ let AuroLibraryRuntimeUtils$1 = class AuroLibraryRuntimeUtils {
11047
10606
 
11048
10607
  /* eslint-disable jsdoc/require-param */
11049
10608
 
@@ -11212,7 +10771,7 @@ const cacheFetch = (uri, options = {}) => {
11212
10771
  return _fetchMap.get(uri);
11213
10772
  };
11214
10773
 
11215
- var styleCss$1 = css`: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}`;
10774
+ var styleCss$1 = css`: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}`;
11216
10775
 
11217
10776
  // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
11218
10777
  // See LICENSE in the project root for license information.
@@ -11220,7 +10779,6 @@ var styleCss$1 = css`:focus:not(:focus-visible){outline:3px solid transparent}.u
11220
10779
 
11221
10780
  // See https://git.io/JJ6SJ for "How to document your components using JSDoc"
11222
10781
  /**
11223
- * @attr {Boolean} onDark - Set value for on-dark version of auro-icon
11224
10782
  * @slot - Hidden from visibility, used for a11y if icon description is needed
11225
10783
  */
11226
10784
 
@@ -11235,6 +10793,10 @@ class BaseIcon extends AuroElement {
11235
10793
  static get properties() {
11236
10794
  return {
11237
10795
  ...super.properties,
10796
+
10797
+ /**
10798
+ * Set value for on-dark version of auro-icon.
10799
+ */
11238
10800
  onDark: {
11239
10801
  type: Boolean,
11240
10802
  reflect: true
@@ -11293,81 +10855,11 @@ class BaseIcon extends AuroElement {
11293
10855
  }
11294
10856
  }
11295
10857
 
11296
- var tokensCss = css`:host{--ds-auro-icon-color:var(--ds-color-icon-primary-default, #676767);--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}`;
11297
-
11298
- var colorCss = css`: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)}`;
11299
-
11300
- // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
11301
- // See LICENSE in the project root for license information.
11302
-
11303
- // ---------------------------------------------------------------------
11304
-
11305
- /* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
11306
-
11307
- let AuroLibraryRuntimeUtils$1 = class AuroLibraryRuntimeUtils {
11308
-
11309
- /* eslint-disable jsdoc/require-param */
10858
+ var tokensCss = css`: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)}`;
11310
10859
 
11311
- /**
11312
- * This will register a new custom element with the browser.
11313
- * @param {String} name - The name of the custom element.
11314
- * @param {Object} componentClass - The class to register as a custom element.
11315
- * @returns {void}
11316
- */
11317
- registerComponent(name, componentClass) {
11318
- if (!customElements.get(name)) {
11319
- customElements.define(name, class extends componentClass {});
11320
- }
11321
- }
10860
+ var colorCss = css`: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)}`;
11322
10861
 
11323
- /**
11324
- * Finds and returns the closest HTML Element based on a selector.
11325
- * @returns {void}
11326
- */
11327
- closestElement(
11328
- selector, // selector like in .closest()
11329
- base = this, // extra functionality to skip a parent
11330
- __Closest = (el, found = el && el.closest(selector)) =>
11331
- !el || el === document || el === window
11332
- ? null // standard .closest() returns null for non-found selectors also
11333
- : found
11334
- ? found // found a selector INside this element
11335
- : __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
11336
- ) {
11337
- return __Closest(base);
11338
- }
11339
- /* eslint-enable jsdoc/require-param */
11340
-
11341
- /**
11342
- * 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.
11343
- * @param {Object} elem - The element to check.
11344
- * @param {String} tagName - The name of the Auro component to check for or add as an attribute.
11345
- * @returns {void}
11346
- */
11347
- handleComponentTagRename(elem, tagName) {
11348
- const tag = tagName.toLowerCase();
11349
- const elemTag = elem.tagName.toLowerCase();
11350
-
11351
- if (elemTag !== tag) {
11352
- elem.setAttribute(tag, true);
11353
- }
11354
- }
11355
-
11356
- /**
11357
- * Validates if an element is a specific Auro component.
11358
- * @param {Object} elem - The element to validate.
11359
- * @param {String} tagName - The name of the Auro component to check against.
11360
- * @returns {Boolean} - Returns true if the element is the specified Auro component.
11361
- */
11362
- elementMatch(elem, tagName) {
11363
- const tag = tagName.toLowerCase();
11364
- const elemTag = elem.tagName.toLowerCase();
11365
-
11366
- return elemTag === tag || elem.hasAttribute(tag);
11367
- }
11368
- };
11369
-
11370
- // Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
10862
+ // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
11371
10863
  // See LICENSE in the project root for license information.
11372
10864
 
11373
10865
 
@@ -11375,6 +10867,7 @@ class AuroIcon extends BaseIcon {
11375
10867
  constructor() {
11376
10868
  super();
11377
10869
 
10870
+ this.variant = undefined;
11378
10871
  this.privateDefaults();
11379
10872
  }
11380
10873
 
@@ -11384,20 +10877,6 @@ class AuroIcon extends BaseIcon {
11384
10877
  * @returns {void}
11385
10878
  */
11386
10879
  privateDefaults() {
11387
- this.accent = false;
11388
- this.customColor = false;
11389
- this.customSvg = false;
11390
- this.disabled = false;
11391
- this.emphasis = false;
11392
- this.error = false;
11393
- this.info = false;
11394
- this.label = false;
11395
- this.primary = false;
11396
- this.secondary = false;
11397
- this.subtle = false;
11398
- this.success = false;
11399
- this.tertiary = false;
11400
- this.warning = false;
11401
10880
  this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
11402
10881
  this.runtimeUtils = new AuroLibraryRuntimeUtils$1();
11403
10882
  }
@@ -11407,14 +10886,6 @@ class AuroIcon extends BaseIcon {
11407
10886
  return {
11408
10887
  ...super.properties,
11409
10888
 
11410
- /**
11411
- * Sets the icon to use the accent style.
11412
- */
11413
- accent: {
11414
- type: Boolean,
11415
- reflect: true
11416
- },
11417
-
11418
10889
  /**
11419
10890
  * Set aria-hidden value. Default is `true`. Option is `false`.
11420
10891
  */
@@ -11445,38 +10916,6 @@ class AuroIcon extends BaseIcon {
11445
10916
  type: Boolean
11446
10917
  },
11447
10918
 
11448
- /**
11449
- * Sets the icon to use the disabled style.
11450
- */
11451
- disabled: {
11452
- type: Boolean,
11453
- reflect: true
11454
- },
11455
-
11456
- /**
11457
- * Sets the icon to use the emphasis style.
11458
- */
11459
- emphasis: {
11460
- type: Boolean,
11461
- reflect: true
11462
- },
11463
-
11464
- /**
11465
- * Sets the icon to use the error style.
11466
- */
11467
- error: {
11468
- type: Boolean,
11469
- reflect: true
11470
- },
11471
-
11472
- /**
11473
- * Sets the icon to use the info style.
11474
- */
11475
- info: {
11476
- type: Boolean,
11477
- reflect: true
11478
- },
11479
-
11480
10919
  /**
11481
10920
  * Exposes content in slot as icon label.
11482
10921
  */
@@ -11494,50 +10933,10 @@ class AuroIcon extends BaseIcon {
11494
10933
  },
11495
10934
 
11496
10935
  /**
11497
- * DEPRECATED: Sets the icon to use the baseline primary icon style.
11498
- */
11499
- primary: {
11500
- type: Boolean,
11501
- reflect: true
11502
- },
11503
-
11504
- /**
11505
- * Sets the icon to use the secondary style.
11506
- */
11507
- secondary: {
11508
- type: Boolean,
11509
- reflect: true
11510
- },
11511
-
11512
- /**
11513
- * Sets the icon to use the subtle style.
11514
- */
11515
- subtle: {
11516
- type: Boolean,
11517
- reflect: true
11518
- },
11519
-
11520
- /**
11521
- * Sets the icon to use the success style.
11522
- */
11523
- success: {
11524
- type: Boolean,
11525
- reflect: true
11526
- },
11527
-
11528
- /**
11529
- * Sets the icon to use the tertiary style.
11530
- */
11531
- tertiary: {
11532
- type: Boolean,
11533
- reflect: true
11534
- },
11535
-
11536
- /**
11537
- * Sets the icon to use the warning style.
10936
+ * 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`.
11538
10937
  */
11539
- warning: {
11540
- type: Boolean,
10938
+ variant: {
10939
+ type: String,
11541
10940
  reflect: true
11542
10941
  }
11543
10942
  };
@@ -11627,7 +11026,7 @@ class AuroIcon extends BaseIcon {
11627
11026
  }
11628
11027
  }
11629
11028
 
11630
- var iconVersion = '7.0.1';
11029
+ var iconVersion = '8.0.1';
11631
11030
 
11632
11031
  // Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
11633
11032
  // See LICENSE in the project root for license information.
@@ -11852,7 +11251,7 @@ class AuroBibtemplate extends LitElement {
11852
11251
  constructor() {
11853
11252
  super();
11854
11253
 
11855
- AuroLibraryRuntimeUtils$2.prototype.handleComponentTagRename(this, 'auro-bibtemplate');
11254
+ AuroLibraryRuntimeUtils$1.prototype.handleComponentTagRename(this, 'auro-bibtemplate');
11856
11255
 
11857
11256
  const versioning = new AuroDependencyVersioning();
11858
11257
  this.iconTag = versioning.generateTag('auro-formkit-bibtemplate-icon', iconVersion, AuroIcon);
@@ -11891,7 +11290,7 @@ class AuroBibtemplate extends LitElement {
11891
11290
  *
11892
11291
  */
11893
11292
  static register(name = "auro-bibtemplate") {
11894
- AuroLibraryRuntimeUtils$2.prototype.registerComponent(name, AuroBibtemplate);
11293
+ AuroLibraryRuntimeUtils$1.prototype.registerComponent(name, AuroBibtemplate);
11895
11294
  }
11896
11295
 
11897
11296
  /**
@@ -11963,11 +11362,11 @@ class AuroBibtemplate extends LitElement {
11963
11362
 
11964
11363
  var bibTemplateVersion = '1.0.0';
11965
11364
 
11966
- css`:root{--ds-asset-font-circular-family-name: "AS Circular";--ds-asset-font-circular-filename: "ASCircularWeb";--ds-asset-font-circular-weight-light: "-Light";--ds-asset-font-circular-weight-medium: "-Medium";--ds-asset-font-circular-weight-book: "-Book";--ds-border-radius: 0.375rem;--ds-size-25: 0.125rem;--ds-size-50: 0.25rem;--ds-size-75: 0.375rem;--ds-size-100: 0.5rem;--ds-size-150: 0.75rem;--ds-size-200: 1rem;--ds-size-250: 1.25rem;--ds-size-300: 1.5rem;--ds-size-400: 2rem;--ds-size-500: 2.5rem;--ds-size-600: 3rem;--ds-size-700: 3.5rem;--ds-size-800: 4rem;--ds-size-900: 4.5rem;--ds-size-1000: 5rem;--ds-unitless-scale-20: 0.25;--ds-unitless-scale-50: 0.5;--ds-unitless-scale-100: 1;--ds-unitless-scale-140: 1.4;--ds-unitless-scale-150: 1.5;--ds-unitless-scale-200: 2;--ds-unitless-scale-300: 3;--ds-unitless-scale-350: 3.5;--ds-animation-default-property: all;--ds-animation-default-duration: 0.3s;--ds-animation-default-timing: ease-out;--ds-depth-overlay: 200;--ds-depth-modal: 300;--ds-depth-tooltip: 400;--ds-elevation-100: 0px 0px 5px rgba(0, 0, 0, 0.15);--ds-elevation-200: 0px 0px 10px rgba(0, 0, 0, 0.15);--ds-elevation-300: 0px 0px 15px rgba(0, 0, 0, 0.2);--ds-grid-breakpoint-xs: 320px;--ds-grid-breakpoint-sm: 576px;--ds-grid-breakpoint-md: 768px;--ds-grid-breakpoint-lg: 1024px;--ds-grid-breakpoint-xl: 1232px;--ds-grid-column-xs: 6;--ds-grid-column-sm: 12;--ds-grid-column-md: 12;--ds-grid-column-lg: 12;--ds-grid-column-xl: 12;--ds-grid-gutter-xs: 0.5rem;--ds-grid-gutter-sm: 1rem;--ds-grid-gutter-md: 1.5rem;--ds-grid-gutter-lg: 1.5rem;--ds-grid-gutter-xl: 2rem;--ds-grid-margin-xs: 1rem;--ds-grid-margin-sm: 1rem;--ds-grid-margin-md: 1.5rem;--ds-grid-margin-lg: 2rem;--ds-grid-margin-xl: 2rem;--ds-font-family-default: "AS Circular", Helvetica Neue, Arial, sans-serif;--ds-font-family-mono: Menlo, Monaco, Consolas, "Courier New", monospace;--ds-text-heading-300-weight: 300;--ds-text-heading-300-px: 18px;--ds-text-heading-300-size: 1.125rem;--ds-text-heading-300-height: 1.625rem;--ds-text-heading-300-height-px: 26px;--ds-text-heading-400-weight: 300;--ds-text-heading-400-px: 20px;--ds-text-heading-400-size: 1.25rem;--ds-text-heading-400-height: 1.625rem;--ds-text-heading-400-height-px: 26px;--ds-text-heading-500-weight: 300;--ds-text-heading-500-px-breakpoint-sm: 22px;--ds-text-heading-500-px-breakpoint-md: 24px;--ds-text-heading-500-px-breakpoint-lg: 24px;--ds-text-heading-500-size-breakpoint-sm: 1.375rem;--ds-text-heading-500-size-breakpoint-md: 1.5rem;--ds-text-heading-500-size-breakpoint-lg: 1.5rem;--ds-text-heading-500-height-breakpoint-sm: 1.625rem;--ds-text-heading-500-height-breakpoint-px-sm: 26px;--ds-text-heading-500-height-breakpoint-md: 1.875rem;--ds-text-heading-500-height-breakpoint-px-md: 30px;--ds-text-heading-500-height-breakpoint-lg: 2rem;--ds-text-heading-500-height-breakpoint-px-lg: 32px;--ds-text-heading-600-weight: 300;--ds-text-heading-600-px-breakpoint-sm: 26px;--ds-text-heading-600-px-breakpoint-md: 28px;--ds-text-heading-600-px-breakpoint-lg: 28px;--ds-text-heading-600-size-breakpoint-sm: 1.625rem;--ds-text-heading-600-size-breakpoint-md: 1.75rem;--ds-text-heading-600-size-breakpoint-lg: 1.75rem;--ds-text-heading-600-height-breakpoint-sm: 1.875rem;--ds-text-heading-600-height-breakpoint-px-sm: 30px;--ds-text-heading-600-height-breakpoint-md: 2.125rem;--ds-text-heading-600-height-breakpoint-px-md: 34px;--ds-text-heading-600-height-breakpoint-lg: 2.25rem;--ds-text-heading-600-height-breakpoint-px-lg: 36px;--ds-text-heading-700-weight: 500;--ds-text-heading-700-px-breakpoint-sm: 28px;--ds-text-heading-700-px-breakpoint-md: 32px;--ds-text-heading-700-px-breakpoint-lg: 36px;--ds-text-heading-700-size-breakpoint-sm: 1.75rem;--ds-text-heading-700-size-breakpoint-md: 2rem;--ds-text-heading-700-size-breakpoint-lg: 2.25rem;--ds-text-heading-700-height-breakpoint-sm: 2.125rem;--ds-text-heading-700-height-breakpoint-px-sm: 34px;--ds-text-heading-700-height-breakpoint-md: 2.375rem;--ds-text-heading-700-height-breakpoint-px-md: 38px;--ds-text-heading-700-height-breakpoint-lg: 2.75rem;--ds-text-heading-700-height-breakpoint-px-lg: 44px;--ds-text-heading-800-weight: 500;--ds-text-heading-800-px-breakpoint-sm: 32px;--ds-text-heading-800-px-breakpoint-md: 36px;--ds-text-heading-800-px-breakpoint-lg: 40px;--ds-text-heading-800-size-breakpoint-sm: 2rem;--ds-text-heading-800-size-breakpoint-md: 2.25rem;--ds-text-heading-800-size-breakpoint-lg: 2.5rem;--ds-text-heading-800-height-breakpoint-sm: 2.375rem;--ds-text-heading-800-height-breakpoint-px-sm: 38px;--ds-text-heading-800-height-breakpoint-md: 2.625rem;--ds-text-heading-800-height-breakpoint-px-md: 42px;--ds-text-heading-800-height-breakpoint-lg: 3rem;--ds-text-heading-800-height-breakpoint-px-lg: 48px;--ds-text-heading-default-weight: 500;--ds-text-heading-default-margin: 0;--ds-text-heading-default-spacing: -0.2px;--ds-text-heading-medium-weight: 300;--ds-text-heading-display-weight: 100;--ds-text-heading-display-px-breakpoint-sm: 44px;--ds-text-heading-display-px-breakpoint-md: 48px;--ds-text-heading-display-px-breakpoint-lg: 56px;--ds-text-heading-display-size-breakpoint-sm: 2.75rem;--ds-text-heading-display-size-breakpoint-md: 3rem;--ds-text-heading-display-size-breakpoint-lg: 3.5rem;--ds-text-heading-display-height-breakpoint-sm: 3.375rem;--ds-text-heading-display-height-breakpoint-px-sm: 54px;--ds-text-heading-display-height-breakpoint-md: 3.75rem;--ds-text-heading-display-height-breakpoint-px-md: 60px;--ds-text-heading-display-height-breakpoint-lg: 4.25rem;--ds-text-heading-display-height-breakpoint-px-lg: 68px;--ds-text-body-default-weight: 500;--ds-text-body-size-xxs: 0.625rem;--ds-text-body-size-xs: 0.75rem;--ds-text-body-size-sm: 0.875rem;--ds-text-body-size-default: 1rem;--ds-text-body-size-lg: 1.125rem;--ds-text-body-height-xs: 1rem;--ds-text-body-height-sm: 1.25rem;--ds-text-body-height-default: 1.5rem;--ds-text-body-height-lg: 1.625rem;--ds-color-alert-notification-default: #0074c8;--ds-color-alert-warning-default: #de750c;--ds-color-alert-error-default: #df0b37;--ds-color-alert-success-default: #00805d;--ds-color-alert-advisory-default: #fff0cd;--ds-color-alert-bkg-success-default: #ddf6e8;--ds-color-alert-bkg-error-default: #ffedf1;--ds-color-background-primary-100-default: #ffffff;--ds-color-background-primary-100-inverse: #0e2b4f;--ds-color-background-primary-200-default: #f7f7f7;--ds-color-background-primary-200-inverse: #194069;--ds-color-background-primary-300-default: #e4e8ec;--ds-color-background-primary-300-inverse: #265688;--ds-color-background-primary-400-default: #dddddd;--ds-color-background-primary-400-inverse: #326aa5;--ds-color-background-success-default: #eef8f5;--ds-color-background-success-inverse: #173c30;--ds-color-background-error-default: #fff4f4;--ds-color-background-error-inverse: #74110e;--ds-color-background-warning-default: #fef8e9;--ds-color-background-warning-inverse: #5d4514;--ds-color-background-info-default: #f0f7fd;--ds-color-background-info-inverse: #193d73;--ds-color-background-subtle-default: #f7f8fa;--ds-color-background-subtle-inverse: #2a2a2a;--ds-color-background-accent-default: #ebfafd;--ds-color-background-accent-inverse: #275b72;--ds-color-background-emphasis-default: #c9e0f7;--ds-color-background-emphasis-inverse: #225296;--ds-color-background-scrimmed-default: rgba(0, 0, 0, 0.5);--ds-color-background-lightest: #ffffff;--ds-color-background-lighter: #f7f7f7;--ds-color-background-darker: #01426a;--ds-color-background-darkest: #00274a;--ds-color-background-gradient-default: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5));--ds-color-base-white: #ffffff;--ds-color-base-white-100: rgba(255, 255, 255, 0.03);--ds-color-base-white-200: rgba(255, 255, 255, 0.06);--ds-color-base-white-300: rgba(255, 255, 255, 0.12);--ds-color-base-white-400: rgba(255, 255, 255, 0.25);--ds-color-base-white-500: rgba(255, 255, 255, 0.5);--ds-color-base-white-opacity-50: rgba(255, 255, 255, 0.5);--ds-color-base-white-opacity-40: rgba(255, 255, 255, 0.4);--ds-color-base-white-opacity-0: rgba(255, 255, 255, 0);--ds-color-base-black: #000000;--ds-color-base-black-100: rgba(0, 0, 0, 0.03);--ds-color-base-black-200: rgba(0, 0, 0, 0.06);--ds-color-base-black-300: rgba(0, 0, 0, 0.12);--ds-color-base-black-400: rgba(0, 0, 0, 0.25);--ds-color-base-black-500: rgba(0, 0, 0, 0.5);--ds-color-base-black-opacity-15: rgba(0, 0, 0, 0.15);--ds-color-base-blue-100: #f0f7fd;--ds-color-base-blue-200: #c9e0f7;--ds-color-base-blue-300: #a0c9f1;--ds-color-base-blue-400: #79b2ec;--ds-color-base-blue-500: #5398e6;--ds-color-base-blue-600: #3b7fd2;--ds-color-base-blue-700: #2c67b5;--ds-color-base-blue-800: #225296;--ds-color-base-blue-900: #193d73;--ds-color-base-blue-1000: #102a51;--ds-color-base-cyan-100: #ebfafd;--ds-color-base-cyan-200: #a8e9f7;--ds-color-base-cyan-300: #6ad5ef;--ds-color-base-cyan-400: #56bbde;--ds-color-base-cyan-500: #4aa2c7;--ds-color-base-cyan-600: #3e89aa;--ds-color-base-cyan-700: #32718e;--ds-color-base-cyan-800: #275b72;--ds-color-base-cyan-900: #1d4658;--ds-color-base-cyan-1000: #12303d;--ds-color-base-error-100: #fff4f4;--ds-color-base-error-200: #f9aca6;--ds-color-base-error-300: #f16359;--ds-color-base-error-400: #cc1816;--ds-color-base-error-500: #74110e;--ds-color-base-gray-100: #f7f7f7;--ds-color-base-gray-200: #d4d4d4;--ds-color-base-gray-300: #c5c5c5;--ds-color-base-gray-400: #adadad;--ds-color-base-gray-500: #959595;--ds-color-base-gray-600: #7e7e7e;--ds-color-base-gray-700: #676767;--ds-color-base-gray-800: #525252;--ds-color-base-gray-900: #3d3d3d;--ds-color-base-gray-1000: #2a2a2a;--ds-color-base-green-100: #f3faf7;--ds-color-base-green-200: #000000;--ds-color-base-green-300: #addbca;--ds-color-base-green-400: #7ec6ac;--ds-color-base-green-500: #51ae8c;--ds-color-base-green-600: #459578;--ds-color-base-green-700: #3a7d64;--ds-color-base-green-800: #306854;--ds-color-base-green-900: #285545;--ds-color-base-green-1000: #1f4436;--ds-color-base-lime-100: #f5fbeb;--ds-color-base-lime-200: #d8efb4;--ds-color-base-lime-300: #badd81;--ds-color-base-lime-400: #a2c270;--ds-color-base-lime-500: #8ca761;--ds-color-base-lime-600: #778f53;--ds-color-base-lime-700: #647845;--ds-color-base-lime-800: #53643a;--ds-color-base-lime-900: #44522f;--ds-color-base-lime-1000: #364126;--ds-color-base-navy-100: #f2f7fb;--ds-color-base-navy-200: #cfe0ef;--ds-color-base-navy-300: #acc9e2;--ds-color-base-navy-400: #89b2d4;--ds-color-base-navy-500: #6899c6;--ds-color-base-navy-600: #4a82b7;--ds-color-base-navy-700: #326aa5;--ds-color-base-navy-800: #265688;--ds-color-base-navy-900: #194069;--ds-color-base-navy-1000: #0e2b4f;--ds-color-base-neutral-100: #f7f8fa;--ds-color-base-neutral-200: #e4e8ec;--ds-color-base-neutral-300: #ccd2db;--ds-color-base-neutral-400: #afb9c6;--ds-color-base-neutral-500: #939fad;--ds-color-base-neutral-600: #7e8894;--ds-color-base-neutral-700: #6a717c;--ds-color-base-neutral-800: #585e67;--ds-color-base-neutral-900: #484d55;--ds-color-base-neutral-1000: #393d43;--ds-color-base-pink-100: #fff7f8;--ds-color-base-pink-200: #fde0e6;--ds-color-base-pink-300: #fcc2ce;--ds-color-base-pink-400: #fa9db0;--ds-color-base-pink-500: #f7738e;--ds-color-base-pink-600: #e45472;--ds-color-base-pink-700: #bf475f;--ds-color-base-pink-800: #a03b50;--ds-color-base-pink-900: #833142;--ds-color-base-pink-1000: #692734;--ds-color-base-purple-100: #fbf8fe;--ds-color-base-purple-200: #ede3fd;--ds-color-base-purple-300: #ddc9fb;--ds-color-base-purple-400: #c9a9f8;--ds-color-base-purple-500: #b588f5;--ds-color-base-purple-600: #a268f3;--ds-color-base-purple-700: #8d47f0;--ds-color-base-purple-800: #7633d7;--ds-color-base-purple-900: #622ab2;--ds-color-base-purple-1000: #4e228d;--ds-color-base-red-100: #fef7f5;--ds-color-base-red-200: #fae2da;--ds-color-base-red-300: #f5c7b8;--ds-color-base-red-400: #f0a68d;--ds-color-base-red-500: #e9815e;--ds-color-base-red-600: #e35c2f;--ds-color-base-red-700: #d03a08;--ds-color-base-red-800: #ae3007;--ds-color-base-red-900: #902806;--ds-color-base-red-1000: #732005;--ds-color-base-success-100: #eef8f5;--ds-color-base-success-200: #8eceb9;--ds-color-base-success-300: #40a080;--ds-color-base-success-400: #0b6f4d;--ds-color-base-success-500: #173c30;--ds-color-base-turquoise-100: #f7fafa;--ds-color-base-turquoise-200: #dfe9ea;--ds-color-base-turquoise-300: #c2d5d6;--ds-color-base-turquoise-400: #9fbdbe;--ds-color-base-turquoise-500: #7ba5a6;--ds-color-base-turquoise-600: #5c8f91;--ds-color-base-turquoise-700: #3d7a7d;--ds-color-base-turquoise-800: #21686a;--ds-color-base-turquoise-900: #085659;--ds-color-base-turquoise-1000: #004447;--ds-color-base-yellow-100: #fff9df;--ds-color-base-yellow-200: #ffe87e;--ds-color-base-yellow-300: #f9ce06;--ds-color-base-yellow-400: #d6b622;--ds-color-base-yellow-500: #b49d35;--ds-color-base-yellow-600: #96873e;--ds-color-base-yellow-700: #7c7140;--ds-color-base-yellow-800: #665e3d;--ds-color-base-yellow-900: #524e38;--ds-color-base-yellow-1000: #403d30;--ds-color-base-warning-100: #fef8e9;--ds-color-base-warning-200: #f2c153;--ds-color-base-warning-300: #c49432;--ds-color-base-warning-400: #8e6b22;--ds-color-base-warning-500: #5d4514;--ds-color-state-error-100: #ff999b;--ds-color-state-error-500: #df0b37;--ds-color-state-success-100: #69cf96;--ds-color-state-success-500: #00805d;--ds-color-state-warning-500: #de750c;--ds-color-border-primary-default: #585e67;--ds-color-border-primary-inverse: #afb9c6;--ds-color-border-secondary-default: #939fad;--ds-color-border-secondary-inverse: #7e8894;--ds-color-border-tertiary-default: #dddddd;--ds-color-border-tertiary-inverse: #676767;--ds-color-border-error-default: #cc1816;--ds-color-border-error-inverse: #f9aca6;--ds-color-border-divider-default: rgba(0, 0, 0, 0.12);--ds-color-border-divider-inverse: rgba(255, 255, 255, 0.25);--ds-color-border-subtle-default: #f0f7fd;--ds-color-border-subtle-inverse: #326aa5;--ds-color-border-emphasis-default: #194069;--ds-color-border-emphasis-inverse: #f2f7fb;--ds-color-border-accent-default: #badd81;--ds-color-border-accent-inverse: #a2c270;--ds-color-border-success-default: #0b6f4d;--ds-color-border-success-inverse: #8eceb9;--ds-color-border-warning-default: #c49432;--ds-color-border-warning-inverse: #f2c153;--ds-color-border-info-default: #326aa5;--ds-color-border-info-inverse: #89b2d4;--ds-color-border-ui-default-default: #2c67b5;--ds-color-border-ui-default-inverse: #56bbde;--ds-color-border-ui-hover-default: #193d73;--ds-color-border-ui-hover-inverse: #a8e9f7;--ds-color-border-ui-active-default: #225296;--ds-color-border-ui-active-inverse: #6ad5ef;--ds-color-border-ui-focus-default: #2c67b5;--ds-color-border-ui-focus-inverse: #56bbde;--ds-color-border-ui-disabled-default: #adadad;--ds-color-border-ui-disabled-inverse: #7e7e7e;--ds-color-border-active-default: #0074c8;--ds-color-border-active-inverse: #00cff0;--ds-color-border-disabled-default: #d4d4d4;--ds-color-border-focus-default: #959595;--ds-color-brand-neutral-100: #f7f8fa;--ds-color-brand-neutral-200: #e4e8ec;--ds-color-brand-neutral-300: #ccd2db;--ds-color-brand-neutral-400: #afb9c6;--ds-color-brand-neutral-500: #939fad;--ds-color-brand-neutral-600: #7e8894;--ds-color-brand-neutral-700: #6a717c;--ds-color-brand-neutral-800: #585e67;--ds-color-brand-neutral-900: #484d55;--ds-color-brand-neutral-1000: #393d43;--ds-color-brand-gray-100: #f7f7f7;--ds-color-brand-gray-200: #dddddd;--ds-color-brand-gray-300: #c5c5c5;--ds-color-brand-gray-400: #adadad;--ds-color-brand-gray-500: #959595;--ds-color-brand-gray-600: #7e7e7e;--ds-color-brand-gray-700: #676767;--ds-color-brand-gray-800: #525252;--ds-color-brand-gray-900: #3d3d3d;--ds-color-brand-gray-1000: #2a2a2a;--ds-color-brand-red-100: #fef7f5;--ds-color-brand-red-200: #fae2da;--ds-color-brand-red-300: #f5c7b8;--ds-color-brand-red-400: #f0a68d;--ds-color-brand-red-500: #e9815e;--ds-color-brand-red-600: #e35c2f;--ds-color-brand-red-700: #d03a08;--ds-color-brand-red-800: #ae3007;--ds-color-brand-red-900: #902806;--ds-color-brand-red-1000: #732005;--ds-color-brand-yellow-100: #fff9df;--ds-color-brand-yellow-200: #ffe87e;--ds-color-brand-yellow-300: #f9ce06;--ds-color-brand-yellow-400: #d6b622;--ds-color-brand-yellow-500: #b49d35;--ds-color-brand-yellow-600: #96873e;--ds-color-brand-yellow-700: #7c7140;--ds-color-brand-yellow-800: #665e3d;--ds-color-brand-yellow-900: #524e38;--ds-color-brand-yellow-1000: #403d30;--ds-color-brand-lime-100: #f5fbeb;--ds-color-brand-lime-200: #d8efb4;--ds-color-brand-lime-300: #badd81;--ds-color-brand-lime-400: #a2c270;--ds-color-brand-lime-500: #8ca761;--ds-color-brand-lime-600: #778f53;--ds-color-brand-lime-700: #647845;--ds-color-brand-lime-800: #53643a;--ds-color-brand-lime-900: #44522f;--ds-color-brand-lime-1000: #364126;--ds-color-brand-green-100: #f3faf7;--ds-color-brand-green-200: #d4ece4;--ds-color-brand-green-300: #addbca;--ds-color-brand-green-400: #7ec6ac;--ds-color-brand-green-500: #51ae8c;--ds-color-brand-green-600: #459578;--ds-color-brand-green-700: #3a7d64;--ds-color-brand-green-800: #306854;--ds-color-brand-green-900: #285545;--ds-color-brand-green-1000: #1f4436;--ds-color-brand-turquoise-100: #f7fafa;--ds-color-brand-turquoise-200: #dfe9ea;--ds-color-brand-turquoise-300: #c2d5d6;--ds-color-brand-turquoise-400: #9fbdbe;--ds-color-brand-turquoise-500: #7ba5a6;--ds-color-brand-turquoise-600: #5c8f91;--ds-color-brand-turquoise-700: #3d7a7d;--ds-color-brand-turquoise-800: #21686a;--ds-color-brand-turquoise-900: #085659;--ds-color-brand-turquoise-1000: #004447;--ds-color-brand-cyan-100: #ebfafd;--ds-color-brand-cyan-200: #a8e9f7;--ds-color-brand-cyan-300: #6ad5ef;--ds-color-brand-cyan-400: #56bbde;--ds-color-brand-cyan-500: #4aa2c7;--ds-color-brand-cyan-600: #3e89aa;--ds-color-brand-cyan-700: #32718e;--ds-color-brand-cyan-800: #275b72;--ds-color-brand-cyan-900: #1d4658;--ds-color-brand-cyan-1000: #12303d;--ds-color-brand-blue-100: #f0f7fd;--ds-color-brand-blue-200: #c9e0f7;--ds-color-brand-blue-300: #a0c9f1;--ds-color-brand-blue-400: #79b2ec;--ds-color-brand-blue-500: #5398e6;--ds-color-brand-blue-600: #3b7fd2;--ds-color-brand-blue-700: #2c67b5;--ds-color-brand-blue-800: #225296;--ds-color-brand-blue-900: #193d73;--ds-color-brand-blue-1000: #102a51;--ds-color-brand-navy-100: #f2f7fb;--ds-color-brand-navy-200: #cfe0ef;--ds-color-brand-navy-300: #acc9e2;--ds-color-brand-navy-400: #89b2d4;--ds-color-brand-navy-500: #6899c6;--ds-color-brand-navy-600: #4a82b7;--ds-color-brand-navy-700: #326aa5;--ds-color-brand-navy-800: #265688;--ds-color-brand-navy-900: #194069;--ds-color-brand-navy-1000: #0e2b4f;--ds-color-brand-purple-100: #fbf8fe;--ds-color-brand-purple-200: #ede3fd;--ds-color-brand-purple-300: #ddc9fb;--ds-color-brand-purple-400: #c9a9f8;--ds-color-brand-purple-500: #b588f5;--ds-color-brand-purple-600: #a268f3;--ds-color-brand-purple-700: #8d47f0;--ds-color-brand-purple-800: #7633d7;--ds-color-brand-purple-900: #622ab2;--ds-color-brand-purple-1000: #4e228d;--ds-color-brand-pink-100: #fff7f8;--ds-color-brand-pink-200: #fde0e6;--ds-color-brand-pink-300: #fcc2ce;--ds-color-brand-pink-400: #fa9db0;--ds-color-brand-pink-500: #f7738e;--ds-color-brand-pink-600: #e45472;--ds-color-brand-pink-700: #bf475f;--ds-color-brand-pink-800: #a03b50;--ds-color-brand-pink-900: #833142;--ds-color-brand-pink-1000: #692734;--ds-color-brand-midnight-100: #c1daf0;--ds-color-brand-midnight-200: #569ed7;--ds-color-brand-midnight-300: #156fad;--ds-color-brand-midnight-400: #01426a;--ds-color-brand-midnight-500: #00274a;--ds-color-brand-atlas-100: #cde6ff;--ds-color-brand-atlas-200: #6bb7fb;--ds-color-brand-atlas-300: #2492eb;--ds-color-brand-atlas-400: #0074c8;--ds-color-brand-atlas-500: #054687;--ds-color-brand-atlas-400-opacity-20: rgba(0, 116, 200, 0.2);--ds-color-brand-breeze-100: #c0f7ff;--ds-color-brand-breeze-200: #5de3f7;--ds-color-brand-breeze-300: #00cff0;--ds-color-brand-breeze-400: #099dc5;--ds-color-brand-breeze-500: #0b5575;--ds-color-brand-breeze-300-opacity-30: rgba(0, 207, 240, 0.3);--ds-color-brand-tropical-100: #e2ffcd;--ds-color-brand-tropical-200: #d0fba6;--ds-color-brand-tropical-300: #c0e585;--ds-color-brand-tropical-400: #91be62;--ds-color-brand-tropical-500: #5e8741;--ds-color-brand-alpine-100: #bcaae6;--ds-color-brand-alpine-200: #9e73ea;--ds-color-brand-alpine-300: #8439ef;--ds-color-brand-alpine-400: #631db8;--ds-color-brand-alpine-500: #39115c;--ds-color-brand-flamingo-100: #ffebee;--ds-color-brand-flamingo-200: #ffc0ca;--ds-color-brand-flamingo-300: #ff94a7;--ds-color-brand-flamingo-400: #f65b7b;--ds-color-brand-flamingo-500: #b82b47;--ds-color-brand-canyon-100: #ffcab6;--ds-color-brand-canyon-200: #f99574;--ds-color-brand-canyon-300: #f26135;--ds-color-brand-canyon-400: #de3e09;--ds-color-brand-canyon-500: #b83302;--ds-color-brand-goldcoast-100: #fff0cd;--ds-color-brand-goldcoast-200: #ffdb67;--ds-color-brand-goldcoast-300: #ffd200;--ds-color-brand-goldcoast-400: #e5ad07;--ds-color-brand-goldcoast-500: #b88624;--ds-color-brand-goldgray-100: #c5c1bf;--ds-color-brand-goldgray-200: #726e6c;--ds-color-brand-gold-100: #ccbc94;--ds-color-brand-gold-200: #7f682e;--ds-color-brand-emerald: #139142;--ds-color-brand-sapphire: #015daa;--ds-color-brand-ruby: #a41d4a;--ds-color-brand-lounge: #01426a;--ds-color-brand-loungeplus: #53b390;--ds-color-container-accent-default: #f5fbeb;--ds-color-container-accent-inverse: #badd81;--ds-color-container-emphasis-default: #ebfafd;--ds-color-container-emphasis-inverse: #6ad5ef;--ds-color-container-error-default: #fff4f4;--ds-color-container-error-inverse: #74110e;--ds-color-container-info-default: #f0f7fd;--ds-color-container-info-inverse: #193d73;--ds-color-container-primary-default: #ffffff;--ds-color-container-primary-inverse: #0e2b4f;--ds-color-container-secondary-default: #f7f7f7;--ds-color-container-secondary-inverse: #194069;--ds-color-container-subtle-default: #f7f8fa;--ds-color-container-subtle-inverse: #393d43;--ds-color-container-success-default: #eef8f5;--ds-color-container-success-inverse: #173c30;--ds-color-container-tertiary-default: rgba(0, 0, 0, 0.03);--ds-color-container-tertiary-inverse: rgba(255, 255, 255, 0.06);--ds-color-container-warning-default: #fef8e9;--ds-color-container-warning-inverse: #5d4514;--ds-color-container-ui-primary-active-default: #225296;--ds-color-container-ui-primary-active-inverse: #6ad5ef;--ds-color-container-ui-primary-default-default: #2c67b5;--ds-color-container-ui-primary-default-inverse: #56bbde;--ds-color-container-ui-primary-disabled-default: #a0c9f1;--ds-color-container-ui-primary-disabled-inverse: #275b72;--ds-color-container-ui-primary-focus-default: #2c67b5;--ds-color-container-ui-primary-focus-inverse: #56bbde;--ds-color-container-ui-primary-hover-default: #193d73;--ds-color-container-ui-primary-hover-inverse: #a8e9f7;--ds-color-container-ui-secondary-active-default: #f0f7fd;--ds-color-container-ui-secondary-active-inverse: rgba(255, 255, 255, 0.06);--ds-color-container-ui-secondary-default-default: #ffffff;--ds-color-container-ui-secondary-default-inverse: rgba(255, 255, 255, 0.03);--ds-color-container-ui-secondary-disabled-default: #f7f7f7;--ds-color-container-ui-secondary-disabled-inverse: rgba(255, 255, 255, 0.12);--ds-color-container-ui-secondary-focus-default: #ffffff;--ds-color-container-ui-secondary-focus-inverse: rgba(255, 255, 255, 0.03);--ds-color-container-ui-secondary-hover-default: rgba(0, 0, 0, 0.03);--ds-color-container-ui-secondary-hover-inverse: rgba(255, 255, 255, 0.12);--ds-color-container-ui-tertiary-active-default: rgba(0, 0, 0, 0.06);--ds-color-container-ui-tertiary-active-inverse: rgba(255, 255, 255, 0.06);--ds-color-container-ui-tertiary-default-default: rgba(0, 0, 0, 0.03);--ds-color-container-ui-tertiary-default-inverse: rgba(255, 255, 255, 0.12);--ds-color-container-ui-tertiary-disabled-default: rgba(0, 0, 0, 0.03);--ds-color-container-ui-tertiary-disabled-inverse: rgba(255, 255, 255, 0.25);--ds-color-container-ui-tertiary-focus-default: rgba(0, 0, 0, 0.03);--ds-color-container-ui-tertiary-focus-inverse: rgba(255, 255, 255, 0.12);--ds-color-container-ui-tertiary-hover-default: rgba(0, 0, 0, 0.12);--ds-color-container-ui-tertiary-hover-inverse: rgba(255, 255, 255, 0.25);--ds-color-icon-primary-default: #676767;--ds-color-icon-primary-inverse: #f7f7f7;--ds-color-icon-secondary-default: #7e8894;--ds-color-icon-secondary-inverse: #ccd2db;--ds-color-icon-tertiary-default: #afb9c6;--ds-color-icon-tertiary-inverse: #939fad;--ds-color-icon-emphasis-default: #2a2a2a;--ds-color-icon-emphasis-inverse: #ffffff;--ds-color-icon-accent-default: #a2c270;--ds-color-icon-accent-inverse: #badd81;--ds-color-icon-info-default: #326aa5;--ds-color-icon-info-inverse: #89b2d4;--ds-color-icon-error-default: #cc1816;--ds-color-icon-error-inverse: #f9aca6;--ds-color-icon-warning-default: #c49432;--ds-color-icon-warning-inverse: #f2c153;--ds-color-icon-success-default: #40a080;--ds-color-icon-success-inverse: #8eceb9;--ds-color-icon-subtle-default: #a0c9f1;--ds-color-icon-subtle-inverse: #326aa5;--ds-color-icon-ui-primary-default-default: #2c67b5;--ds-color-icon-ui-primary-default-inverse: #56bbde;--ds-color-icon-ui-primary-hover-default: #193d73;--ds-color-icon-ui-primary-hover-inverse: #a8e9f7;--ds-color-icon-ui-primary-active-default: #225296;--ds-color-icon-ui-primary-active-inverse: #6ad5ef;--ds-color-icon-ui-primary-disabled-default: #adadad;--ds-color-icon-ui-primary-disabled-inverse: #7e7e7e;--ds-color-icon-ui-primary-focus-default: #2c67b5;--ds-color-icon-ui-primary-focus-inverse: #56bbde;--ds-color-icon-ui-secondary-active-default: #676767;--ds-color-icon-ui-secondary-active-inverse: #c5c5c5;--ds-color-icon-ui-secondary-default-default: #7e7e7e;--ds-color-icon-ui-secondary-default-inverse: #adadad;--ds-color-icon-ui-secondary-disabled-default: #adadad;--ds-color-icon-ui-secondary-disabled-inverse: #7e7e7e;--ds-color-icon-ui-secondary-focus-default: #7e7e7e;--ds-color-icon-ui-secondary-focus-inverse: #adadad;--ds-color-icon-ui-secondary-hover-default: #525252;--ds-color-icon-ui-secondary-hover-inverse: #dddddd;--ds-color-icon-brand-red-default: #d03a08;--ds-color-icon-brand-red-inverse: #e9815e;--ds-color-icon-brand-yellow-default: #7c7140;--ds-color-icon-brand-yellow-inverse: #f9ce06;--ds-color-icon-brand-pink-default: #bf475f;--ds-color-icon-brand-pink-inverse: #f7738e;--ds-color-icon-brand-purple-default: #8d47f0;--ds-color-icon-brand-purple-inverse: #b588f5;--ds-color-icon-brand-lime-default: #647845;--ds-color-icon-brand-lime-inverse: #badd81;--ds-color-icon-brand-green-default: #3a7d64;--ds-color-icon-brand-green-inverse: #51ae8c;--ds-color-icon-brand-turquoise-default: #3d7a7d;--ds-color-icon-brand-turquoise-inverse: #7ba5a6;--ds-color-icon-brand-navy-default: #265688;--ds-color-icon-brand-navy-inverse: #6899c6;--ds-color-icon-brand-blue-default: #2c67b5;--ds-color-icon-brand-blue-inverse: #5398e6;--ds-color-icon-brand-cyan-default: #32718e;--ds-color-icon-brand-cyan-inverse: #6ad5ef;--ds-color-icon-brand-gray-default: #676767;--ds-color-icon-brand-gray-inverse: #c5c5c5;--ds-color-icon-brand-neutral-default: #6a717c;--ds-color-icon-brand-neutral-inverse: #afb9c6;--ds-color-icon-disabled-default: rgba(0, 0, 0, 0.15);--ds-color-text-primary-default: #2a2a2a;--ds-color-text-primary-inverse: #ffffff;--ds-color-text-secondary-default: #525252;--ds-color-text-secondary-inverse: #dddddd;--ds-color-text-tertiary-default: #6a717c;--ds-color-text-tertiary-inverse: #adadad;--ds-color-text-error-default: #cc1816;--ds-color-text-error-inverse: #f9aca6;--ds-color-text-emphasis-default: #265688;--ds-color-text-emphasis-inverse: #cfe0ef;--ds-color-text-accent-default: #647845;--ds-color-text-accent-inverse: #badd81;--ds-color-text-info-default: #326aa5;--ds-color-text-info-inverse: #acc9e2;--ds-color-text-subtle-default: #32718e;--ds-color-text-subtle-inverse: #56bbde;--ds-color-text-success-default: #0b6f4d;--ds-color-text-success-inverse: #8eceb9;--ds-color-text-ui-active-default: #225296;--ds-color-text-ui-active-inverse: #6ad5ef;--ds-color-text-ui-default-default: #2c67b5;--ds-color-text-ui-default-inverse: #56bbde;--ds-color-text-ui-disabled-default: #adadad;--ds-color-text-ui-disabled-inverse: #7e7e7e;--ds-color-text-ui-focus-default: #2c67b5;--ds-color-text-ui-focus-inverse: #56bbde;--ds-color-text-ui-hover-default: #193d73;--ds-color-text-ui-hover-inverse: #a8e9f7;--ds-color-text-link-default: #0074c8;--ds-color-text-link-inverse: #00cff0;--ds-color-tier-alaska-mvp-default: #726e6c;--ds-color-tier-alaska-mvp-inverse: #c5c1bf;--ds-color-tier-alaska-mvpgold-default: #7f682e;--ds-color-tier-alaska-mvpgold-inverse: #c5c1bf;--ds-color-tier-alaska-mvpgold75k-default: #7f682e;--ds-color-tier-alaska-mvpgold75k-inverse: #c5c1bf;--ds-color-tier-alaska-mvpgold100k-default: #7f682e;--ds-color-tier-alaska-mvpgold100k-inverse: #c5c1bf;--ds-color-tier-alaska-lounge: #01426a;--ds-color-tier-alaska-loungeplus: #53b390;--ds-color-tier-fare-business-default: #005154;--ds-color-tier-fare-business-inverse: #9fbdbe;--ds-color-tier-fare-economy-default: #2c67b5;--ds-color-tier-fare-economy-inverse: #a0c9f1;--ds-color-tier-fare-first-class-default: #002c4e;--ds-color-tier-fare-first-class-inverse: #89b2d4;--ds-color-tier-fare-saver-default: #4aa2c7;--ds-color-tier-fare-saver-inverse: #a8e9f7;--ds-color-tier-oneworld-emerald: #139142;--ds-color-tier-oneworld-sapphire: #015daa;--ds-color-tier-oneworld-ruby: #a41d4a;--ds-color-ui-default-default: #0074c8;--ds-color-ui-default-inverse: #00cff0;--ds-color-ui-hover-default: #054687;--ds-color-ui-hover-inverse: #5de3f7;--ds-color-ui-active-default: #054687;--ds-color-ui-active-inverse: #5de3f7;--ds-color-ui-disabled-default: rgba(0, 116, 200, 0.2);--ds-color-ui-bkg-default-default: rgba(0, 0, 0, 0.03);--ds-color-ui-bkg-default-inverse: rgba(255, 255, 255, 0.03);--ds-color-ui-bkg-hover-default: rgba(0, 0, 0, 0.06);--ds-color-ui-bkg-hover-inverse: rgba(255, 255, 255, 0.06);--ds-color-utility-blue-default: #79b2ec;--ds-color-utility-blue-inverse: #c9e0f7;--ds-color-utility-cyan-default: #6ad5ef;--ds-color-utility-cyan-inverse: #a8e9f7;--ds-color-utility-green-default: #7ec6ac;--ds-color-utility-green-inverse: #addbca;--ds-color-utility-gray-default: #adadad;--ds-color-utility-gray-inverse: #dddddd;--ds-color-utility-lime-default: #badd81;--ds-color-utility-lime-inverse: #d8efb4;--ds-color-utility-navy-default: #265688;--ds-color-utility-navy-inverse: #acc9e2;--ds-color-utility-neutral-default: #7e8894;--ds-color-utility-neutral-inverse: #ccd2db;--ds-color-utility-pink-default: #f7738e;--ds-color-utility-pink-inverse: #fcc2ce;--ds-color-utility-purple-default: #8d47f0;--ds-color-utility-purple-inverse: #ddc9fb;--ds-color-utility-red-default: #e35c2f;--ds-color-utility-red-inverse: #f0a68d;--ds-color-utility-turquoise-default: #5c8f91;--ds-color-utility-turquoise-inverse: #9fbdbe;--ds-color-utility-yellow-default: #f9ce06;--ds-color-utility-yellow-inverse: #ffe87e;--ds-color-utility-error-default: #cc1816;--ds-color-utility-error-inverse: #f9aca6;--ds-color-utility-warning-default: #f2c153;--ds-color-utility-warning-inverse: #f2c153;--ds-color-utility-success-default: #0b6f4d;--ds-color-utility-success-inverse: #8eceb9}*,*: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}:host{display:inline-block;width:100%;margin:0;padding:0;vertical-align:middle}:host ::slotted(auro-menuoption),:host ::slotted([auro-menuoption]),:host auro-menuoption[loadingplaceholder]{padding-left:calc(var(--ds-size-150, 0.75rem) + 24px + var(--ds-size-100, 0.5rem))}:host ::slotted([selected]){padding-left:0}:host ::slotted(hr){box-sizing:content-box !important;height:0 !important;overflow:visible !important;margin:var(--ds-size-100, 0.5rem) 0 !important;border-width:0 !important;border-top-width:1px !important;border-top-style:solid !important}:host([nocheckmark]) ::slotted(auro-menuoption),:host([nocheckmark]) auro-menuoption[loadingplaceholder]{padding-left:var(--ds-size-200, 1rem)}:host([root]){overflow-y:auto}[loadingplaceholder]{color:var(--ds-color-text-secondary-default, #525252)}[loadingplaceholder].empty{opacity:0;position:absolute}[loadingplaceholder] slot[name=loadingIcon]{vertical-align:middle;line-height:1;display:inline-block}[loadingplaceholder] slot[name=loadingIcon]::slotted(*){margin-right:var(--ds-size-150, 0.75rem)}`;
11365
+ css`:focus:not(:focus-visible){outline:3px solid transparent}:host{display:inline-block;width:100%;margin:0;padding:0;vertical-align:middle}:host ::slotted(auro-menuoption),:host ::slotted([auro-menuoption]),:host auro-menuoption[loadingplaceholder]{padding-left:calc(var(--ds-size-150, 0.75rem) + 24px + var(--ds-size-100, 0.5rem))}:host ::slotted([selected]){padding-left:0}:host ::slotted(hr){box-sizing:content-box !important;height:0 !important;overflow:visible !important;margin:var(--ds-size-100, 0.5rem) 0 !important;border-width:0 !important;border-top-width:1px !important;border-top-style:solid !important}:host([nocheckmark]) ::slotted(auro-menuoption),:host([nocheckmark]) auro-menuoption[loadingplaceholder]{padding-left:var(--ds-size-200, 1rem)}:host([root]){overflow-y:auto}[loadingplaceholder].empty{opacity:0;position:absolute}[loadingplaceholder] slot[name=loadingIcon]{vertical-align:middle;line-height:1;display:inline-block}[loadingplaceholder] slot[name=loadingIcon]::slotted(*){margin-right:var(--ds-size-150, 0.75rem)}`;
11967
11366
 
11968
- css`:host ::slotted(hr){border-top-color:var(--ds-auro-menu-divider-color) !important}`;
11367
+ css`:host ::slotted(hr){border-top-color:var(--ds-auro-menu-divider-color)}[loadingplaceholder] slot[name=loadingIcon]{color:var(--ds-auro-menu-loader-color)}[loadingplaceholder] slot[name=loadingText]{color:var(--ds-auro-menu-loader-text-color)}`;
11969
11368
 
11970
- css`:host{--ds-auro-menu-divider-color: var(--ds-color-border-divider-default, $ds-color-border-divider-default);--ds-auro-menuoption-container-color: transparent;--ds-auro-menuoption-icon-color: transparent;--ds-auro-menuoption-text-color: var(--ds-color-text-primary-default, $ds-color-text-primary-default)}`;
11369
+ css`:host{--ds-auro-menu-divider-color: var(--ds-basic-color-border-divider, rgba(0, 0, 0, 0.15));--ds-auro-menu-loader-color: var(--ds-basic-color-brand-primary, #01426a);--ds-auro-menu-loader-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-menuoption-container-color: transparent;--ds-auro-menuoption-icon-color: transparent;--ds-auro-menuoption-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}`;
11971
11370
 
11972
11371
  // Copyright (c) 2021 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
11973
11372
  // See LICENSE in the project root for license information.
@@ -12071,15 +11470,15 @@ function arrayOrUndefinedHasChanged(newVal, oldVal) {
12071
11470
 
12072
11471
  css`:host{display:flex;align-items:center;padding:var(--ds-size-50, 0.25rem) var(--ds-size-200, 1rem) var(--ds-size-50, 0.25rem) 0;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent}:host slot{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host [auro-icon]{--ds-auro-icon-size: var(--ds-size-300, 1.5rem);margin-right:var(--ds-size-150, 0.75rem);margin-left:var(--ds-size-100, 0.5rem)}:host ::slotted(.nestingSpacer){display:inline-block;width:var(--ds-size-300, 1.5rem)}:host ::slotted(strong){font-weight:700}:host([hidden]){display:none}:host([static]){pointer-events:none}:host([disabled]:hover){cursor:auto}:host([disabled]){user-select:none;pointer-events:none}`;
12073
11472
 
12074
- css`:host{background-color:var(--ds-auro-menuoption-container-color);color:var(--ds-auro-menuoption-text-color)}:host svg{fill:var(--ds-auro-menuoption-icon-color) !important}:host([disabled]){--ds-auro-menuoption-text-color: var(--ds-color-text-ui-disabled-default, #adadad)}:host(:hover),:host(.active){--ds-auro-menuoption-container-color: var(--ds-color-container-ui-secondary-hover-default, rgba(0, 0, 0, 0.03))}:host([selected]){--ds-auro-menuoption-container-color: var(--ds-color-container-ui-primary-default-default, #2c67b5);--ds-auro-menuoption-text-color: var(--ds-color-text-primary-inverse, #ffffff);--ds-auro-menuoption-icon-color: var(--ds-color-icon-emphasis-inverse, #ffffff)}:host([selected]):host(.active){--ds-auro-menuoption-container-color: var(--ds-color-container-ui-primary-active-default, #225296)}`;
11473
+ css`:host{background-color:var(--ds-auro-menuoption-container-color);color:var(--ds-auro-menuoption-text-color)}:host svg{fill:var(--ds-auro-menuoption-icon-color)}:host([disabled]){--ds-auro-menuoption-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:hover),:host(.active){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-neutral-subtle, #f7f7f7)}:host([selected]){--ds-auro-menuoption-container-color: var(--ds-advanced-color-state-selected, #01426a);--ds-auro-menuoption-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-menuoption-icon-color: var(--ds-basic-color-texticon-inverse, #ffffff)}:host([selected]):host(:hover),:host([selected]):host(.active){--ds-auro-menuoption-container-color: var(--ds-advanced-color-state-selected-hover, #00274a)}`;
12075
11474
 
12076
- css`: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}`;
11475
+ css`: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}`;
12077
11476
 
12078
- css`:host{--ds-auro-icon-color:var(--ds-color-icon-primary-default, #676767);--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}`;
11477
+ css`: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)}`;
12079
11478
 
12080
- css`: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)}`;
11479
+ css`: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)}`;
12081
11480
 
12082
- var styleCss = css`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}[auro-input]{min-height:var(--ds-size-700, 3.5rem);max-height:var(--ds-size-700, 3.5rem)}[auro-input]::part(iconContainer){top:0;display:flex;height:100%;align-items:center}[auro-input]::part(accentIcon){transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1)}[auro-input]::part(helpText){display:none}[auro-input]::part(wrapper){border-width:0 !important;box-shadow:unset !important;outline:unset !important;--ds-auro-input-border-color: transparent;--ds-auro-input-container-color: transparent}#slotHolder{display:none}`;
11481
+ var styleCss = css`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}[auro-input]{min-height:var(--ds-size-700, 3.5rem);max-height:var(--ds-size-700, 3.5rem)}[auro-input]::part(iconContainer){top:0;display:flex;height:100%;align-items:center}[auro-input]::part(accentIcon){transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1)}[auro-input]::part(helpText){display:none}[auro-input]::part(wrapper){--ds-auro-input-border-color: transparent;--ds-auro-input-container-color: transparent}[auro-input]::part(wrapper):focus-within{border-bottom-width:0 !important;box-shadow:unset !important;outline:unset !important}#slotHolder{display:none}`;
12083
11482
 
12084
11483
  // Copyright (c) 2022 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
12085
11484
  // See LICENSE in the project root for license information.
@@ -12113,6 +11512,7 @@ class AuroCombobox extends LitElement {
12113
11512
  * @returns {void} Internal defaults.
12114
11513
  */
12115
11514
  privateDefaults() {
11515
+ this.onDark = false;
12116
11516
  this.availableOptions = [];
12117
11517
  this.optionActive = null;
12118
11518
  this.msgSelectionMissing = 'Please select an option.';
@@ -12121,7 +11521,7 @@ class AuroCombobox extends LitElement {
12121
11521
 
12122
11522
  this.validation = new AuroFormValidation$1();
12123
11523
 
12124
- this.runtimeUtils = new AuroLibraryRuntimeUtils$7();
11524
+ this.runtimeUtils = new AuroLibraryRuntimeUtils$4();
12125
11525
 
12126
11526
  this.isHiddenWhileLoading = false;
12127
11527
 
@@ -12131,11 +11531,11 @@ class AuroCombobox extends LitElement {
12131
11531
  this.noFlip = false;
12132
11532
  this.autoPlacement = false;
12133
11533
 
12134
- const versioning = new AuroDependencyVersioning$4();
11534
+ const versioning = new AuroDependencyVersioning$3();
12135
11535
 
12136
- this.dropdownTag = versioning.generateTag('auro-formkit-checkbox-dropdown', dropdownVersion, AuroDropdown);
12137
- this.bibtemplateTag = versioning.generateTag('auro-formkit-checkbox-bibtemplate', bibTemplateVersion, AuroBibtemplate);
12138
- this.inputTag = versioning.generateTag('auro-formkit-checkbox-input', inputVersion, AuroInput);
11536
+ this.dropdownTag = versioning.generateTag('auro-formkit-combobox-dropdown', dropdownVersion, AuroDropdown);
11537
+ this.bibtemplateTag = versioning.generateTag('auro-formkit-combobox-bibtemplate', bibTemplateVersion, AuroBibtemplate);
11538
+ this.inputTag = versioning.generateTag('auro-formkit-combobox-input', inputVersion, AuroInput);
12139
11539
  }
12140
11540
 
12141
11541
  // This function is to define props used within the scope of this component
@@ -12220,6 +11620,14 @@ class AuroCombobox extends LitElement {
12220
11620
  reflect: true
12221
11621
  },
12222
11622
 
11623
+ /**
11624
+ * If declared, onDark styles will be applied to the trigger.
11625
+ */
11626
+ onDark: {
11627
+ type: Boolean,
11628
+ reflect: true
11629
+ },
11630
+
12223
11631
  /**
12224
11632
  * Specifies the current selected option.
12225
11633
  */
@@ -12346,7 +11754,7 @@ class AuroCombobox extends LitElement {
12346
11754
  *
12347
11755
  */
12348
11756
  static register(name = 'auro-combobox') {
12349
- AuroLibraryRuntimeUtils$7.prototype.registerComponent(name, AuroCombobox);
11757
+ AuroLibraryRuntimeUtils$4.prototype.registerComponent(name, AuroCombobox);
12350
11758
  }
12351
11759
 
12352
11760
  /**
@@ -12989,6 +12397,7 @@ class AuroCombobox extends LitElement {
12989
12397
  </div>
12990
12398
  <${this.dropdownTag}
12991
12399
  for="dropdownMenu"
12400
+ ?onDark="${this.onDark}"
12992
12401
  fluid
12993
12402
  bordered
12994
12403
  rounded
@@ -13005,6 +12414,7 @@ class AuroCombobox extends LitElement {
13005
12414
  <${this.inputTag}
13006
12415
  slot="trigger"
13007
12416
  bordered
12417
+ ?onDark="${this.onDark}"
13008
12418
  ?required="${this.required}"
13009
12419
  ?noValidate="${this.noValidate}"
13010
12420
  ?disabled="${this.disabled}"