@aurodesignsystem/auro-formkit 2.2.1 → 3.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +56 -0
- package/components/bibtemplate/dist/auro-bibtemplate.d.ts +1 -0
- package/components/bibtemplate/dist/iconVersion.d.ts +1 -1
- package/components/bibtemplate/dist/index.js +20 -178
- package/components/bibtemplate/dist/registered.js +20 -178
- package/components/checkbox/README.md +1 -1
- package/components/checkbox/demo/api.html +2 -1
- package/components/checkbox/demo/api.md +129 -58
- package/components/checkbox/demo/api.min.js +41 -8
- package/components/checkbox/demo/index.html +2 -1
- package/components/checkbox/demo/index.md +116 -50
- package/components/checkbox/demo/index.min.js +41 -8
- package/components/checkbox/demo/readme.html +2 -1
- package/components/checkbox/demo/readme.md +1 -1
- package/components/checkbox/dist/auro-checkbox-group.d.ts +8 -0
- package/components/checkbox/dist/auro-checkbox.d.ts +8 -0
- package/components/checkbox/dist/index.js +41 -8
- package/components/checkbox/dist/registered.js +41 -8
- package/components/combobox/README.md +1 -1
- package/components/combobox/demo/api.html +2 -1
- package/components/combobox/demo/api.md +106 -5
- package/components/combobox/demo/api.min.js +266 -1001
- package/components/combobox/demo/index.html +2 -4
- package/components/combobox/demo/index.md +32 -0
- package/components/combobox/demo/index.min.js +266 -1001
- package/components/combobox/demo/readme.html +2 -1
- package/components/combobox/demo/readme.md +1 -1
- package/components/combobox/dist/auro-combobox.d.ts +19 -5
- package/components/combobox/dist/index.js +236 -811
- package/components/combobox/dist/registered.js +236 -811
- package/components/counter/README.md +1 -1
- package/components/counter/demo/api.html +2 -1
- package/components/counter/demo/api.md +29 -10
- package/components/counter/demo/api.min.js +189 -781
- package/components/counter/demo/index.html +2 -1
- package/components/counter/demo/index.md +104 -8
- package/components/counter/demo/index.min.js +189 -781
- package/components/counter/demo/readme.html +2 -1
- package/components/counter/demo/readme.md +1 -1
- package/components/counter/dist/auro-counter-group.d.ts +14 -3
- package/components/counter/dist/auro-counter.d.ts +1 -0
- package/components/counter/dist/iconVersion.d.ts +1 -1
- package/components/counter/dist/index.js +189 -781
- package/components/counter/dist/registered.js +189 -781
- package/components/datepicker/README.md +1 -1
- package/components/datepicker/demo/api.html +2 -4
- package/components/datepicker/demo/api.md +17 -16
- package/components/datepicker/demo/api.min.js +334 -1067
- package/components/datepicker/demo/index.html +2 -4
- package/components/datepicker/demo/index.md +38 -0
- package/components/datepicker/demo/index.min.js +334 -1067
- package/components/datepicker/demo/readme.html +2 -1
- package/components/datepicker/demo/readme.md +1 -1
- package/components/datepicker/dist/auro-calendar-cell.d.ts +1 -0
- package/components/datepicker/dist/auro-calendar-month.d.ts +1 -0
- package/components/datepicker/dist/auro-calendar.d.ts +3 -2
- package/components/datepicker/dist/auro-datepicker.d.ts +11 -0
- package/components/datepicker/dist/index.js +334 -1067
- package/components/datepicker/dist/registered.js +334 -1067
- package/components/dropdown/README.md +1 -1
- package/components/dropdown/demo/api.html +2 -1
- package/components/dropdown/demo/api.md +173 -82
- package/components/dropdown/demo/api.min.js +41 -183
- package/components/dropdown/demo/index.html +2 -1
- package/components/dropdown/demo/index.md +86 -4
- package/components/dropdown/demo/index.min.js +41 -183
- package/components/dropdown/demo/readme.html +2 -1
- package/components/dropdown/demo/readme.md +1 -1
- package/components/dropdown/dist/auro-dropdown.d.ts +8 -0
- package/components/dropdown/dist/auro-dropdownBib.d.ts +2 -2
- package/components/dropdown/dist/index.js +41 -183
- package/components/dropdown/dist/registered.js +41 -183
- package/components/form/README.md +1 -1
- package/components/form/demo/api.html +2 -1
- package/components/form/demo/api.min.js +1 -1
- package/components/form/demo/index.html +2 -1
- package/components/form/demo/index.min.js +1 -1
- package/components/form/demo/readme.html +2 -1
- package/components/form/demo/readme.md +1 -1
- package/components/form/demo/working.html +2 -1
- package/components/form/dist/index.js +1 -1
- package/components/form/dist/registered.js +1 -1
- package/components/helptext/dist/auro-helptext.d.ts +8 -0
- package/components/helptext/dist/index.js +11 -2
- package/components/helptext/dist/registered.js +11 -2
- package/components/input/README.md +1 -1
- package/components/input/demo/api.html +2 -1
- package/components/input/demo/api.js +2 -0
- package/components/input/demo/api.md +108 -18
- package/components/input/demo/api.min.js +127 -407
- package/components/input/demo/index.html +2 -1
- package/components/input/demo/index.md +30 -0
- package/components/input/demo/index.min.js +113 -407
- package/components/input/demo/readme.html +2 -1
- package/components/input/demo/readme.md +1 -1
- package/components/input/dist/base-input.d.ts +13 -0
- package/components/input/dist/buttonVersion.d.ts +1 -1
- package/components/input/dist/iconVersion.d.ts +1 -1
- package/components/input/dist/index.js +113 -407
- package/components/input/dist/registered.js +113 -407
- package/components/menu/README.md +1 -1
- package/components/menu/demo/api.html +2 -1
- package/components/menu/demo/api.md +6 -2
- package/components/menu/demo/api.min.js +23 -183
- package/components/menu/demo/index.html +2 -1
- package/components/menu/demo/index.min.js +23 -183
- package/components/menu/demo/readme.html +2 -1
- package/components/menu/demo/readme.md +1 -1
- package/components/menu/dist/iconVersion.d.ts +1 -1
- package/components/menu/dist/index.js +23 -183
- package/components/menu/dist/registered.js +23 -183
- package/components/radio/README.md +1 -1
- package/components/radio/demo/api.html +2 -1
- package/components/radio/demo/api.md +160 -56
- package/components/radio/demo/api.min.js +35 -8
- package/components/radio/demo/index.html +2 -1
- package/components/radio/demo/index.md +43 -12
- package/components/radio/demo/index.min.js +35 -8
- package/components/radio/demo/readme.html +2 -1
- package/components/radio/demo/readme.md +1 -1
- package/components/radio/dist/auro-radio-group.d.ts +6 -0
- package/components/radio/dist/auro-radio.d.ts +6 -0
- package/components/radio/dist/index.js +35 -8
- package/components/radio/dist/registered.js +35 -8
- package/components/select/README.md +1 -1
- package/components/select/demo/api.html +2 -1
- package/components/select/demo/api.js +0 -2
- package/components/select/demo/api.md +112 -35
- package/components/select/demo/api.min.js +118 -589
- package/components/select/demo/index.html +2 -1
- package/components/select/demo/index.md +100 -0
- package/components/select/demo/index.min.js +118 -576
- package/components/select/demo/readme.html +2 -1
- package/components/select/demo/readme.md +1 -1
- package/components/select/dist/auro-select.d.ts +8 -0
- package/components/select/dist/index.js +93 -391
- package/components/select/dist/registered.js +93 -391
- package/package.json +23 -23
- package/components/counter/dist/styles/counter-button-tokens-css.d.ts +0 -2
- package/components/select/dist/styles/color-css.d.ts +0 -2
- 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$
|
|
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$
|
|
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$
|
|
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$
|
|
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$
|
|
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}
|
|
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-
|
|
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
|
-
|
|
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)
|
|
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
|
-
*
|
|
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
|
-
|
|
3061
|
-
type:
|
|
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-
|
|
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$
|
|
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-
|
|
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-
|
|
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-
|
|
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$
|
|
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$
|
|
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$
|
|
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$
|
|
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$
|
|
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$
|
|
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
|
-
|
|
4169
|
-
|
|
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
|
|
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-
|
|
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-
|
|
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$
|
|
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$
|
|
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
|
}
|
|
@@ -8681,7 +8540,8 @@ class BaseInput extends LitElement {
|
|
|
8681
8540
|
* If set, disables the input.
|
|
8682
8541
|
*/
|
|
8683
8542
|
disabled: {
|
|
8684
|
-
type: Boolean
|
|
8543
|
+
type: Boolean,
|
|
8544
|
+
reflect: true
|
|
8685
8545
|
},
|
|
8686
8546
|
|
|
8687
8547
|
/**
|
|
@@ -8711,7 +8571,8 @@ class BaseInput extends LitElement {
|
|
|
8711
8571
|
* If set, will render an icon inside the input to the left of the value. Support is limited to auro-input instances with credit card format.
|
|
8712
8572
|
*/
|
|
8713
8573
|
icon: {
|
|
8714
|
-
type: Boolean
|
|
8574
|
+
type: Boolean,
|
|
8575
|
+
reflect: true
|
|
8715
8576
|
},
|
|
8716
8577
|
|
|
8717
8578
|
/**
|
|
@@ -8767,7 +8628,16 @@ class BaseInput extends LitElement {
|
|
|
8767
8628
|
* If set, disables auto-validation on blur.
|
|
8768
8629
|
*/
|
|
8769
8630
|
noValidate: {
|
|
8770
|
-
type: Boolean
|
|
8631
|
+
type: Boolean,
|
|
8632
|
+
reflect: true
|
|
8633
|
+
},
|
|
8634
|
+
|
|
8635
|
+
/**
|
|
8636
|
+
* Sets onDark styles on input.
|
|
8637
|
+
*/
|
|
8638
|
+
onDark: {
|
|
8639
|
+
type: Boolean,
|
|
8640
|
+
reflect: true
|
|
8771
8641
|
},
|
|
8772
8642
|
|
|
8773
8643
|
/**
|
|
@@ -8789,14 +8659,16 @@ class BaseInput extends LitElement {
|
|
|
8789
8659
|
* Makes the input read-only, but can be set programmatically.
|
|
8790
8660
|
*/
|
|
8791
8661
|
readonly: {
|
|
8792
|
-
type: Boolean
|
|
8662
|
+
type: Boolean,
|
|
8663
|
+
reflect: true
|
|
8793
8664
|
},
|
|
8794
8665
|
|
|
8795
8666
|
/**
|
|
8796
8667
|
* Populates the `required` attribute on the input. Used for client-side validation.
|
|
8797
8668
|
*/
|
|
8798
8669
|
required: {
|
|
8799
|
-
type: Boolean
|
|
8670
|
+
type: Boolean,
|
|
8671
|
+
reflect: true
|
|
8800
8672
|
},
|
|
8801
8673
|
|
|
8802
8674
|
/**
|
|
@@ -9606,7 +9478,7 @@ const cacheFetch$1 = (uri, options = {}) => {
|
|
|
9606
9478
|
return _fetchMap$1.get(uri);
|
|
9607
9479
|
};
|
|
9608
9480
|
|
|
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}
|
|
9481
|
+
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
9482
|
|
|
9611
9483
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
9612
9484
|
// See LICENSE in the project root for license information.
|
|
@@ -9614,7 +9486,6 @@ var styleCss$3$1 = css`:focus:not(:focus-visible){outline:3px solid transparent}
|
|
|
9614
9486
|
|
|
9615
9487
|
// See https://git.io/JJ6SJ for "How to document your components using JSDoc"
|
|
9616
9488
|
/**
|
|
9617
|
-
* @attr {Boolean} onDark - Set value for on-dark version of auro-icon
|
|
9618
9489
|
* @slot - Hidden from visibility, used for a11y if icon description is needed
|
|
9619
9490
|
*/
|
|
9620
9491
|
|
|
@@ -9629,6 +9500,10 @@ let BaseIcon$1 = class BaseIcon extends AuroElement$1 {
|
|
|
9629
9500
|
static get properties() {
|
|
9630
9501
|
return {
|
|
9631
9502
|
...super.properties,
|
|
9503
|
+
|
|
9504
|
+
/**
|
|
9505
|
+
* Set value for on-dark version of auro-icon.
|
|
9506
|
+
*/
|
|
9632
9507
|
onDark: {
|
|
9633
9508
|
type: Boolean,
|
|
9634
9509
|
reflect: true
|
|
@@ -9687,127 +9562,36 @@ let BaseIcon$1 = class BaseIcon extends AuroElement$1 {
|
|
|
9687
9562
|
}
|
|
9688
9563
|
};
|
|
9689
9564
|
|
|
9690
|
-
var tokensCss$3 = css`:host{--ds-auro-icon-color:var(--ds-color-
|
|
9565
|
+
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)}`;
|
|
9691
9566
|
|
|
9692
|
-
var colorCss$3 = css`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[
|
|
9567
|
+
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)}`;
|
|
9693
9568
|
|
|
9694
|
-
// Copyright (c) Alaska
|
|
9569
|
+
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
9695
9570
|
// See LICENSE in the project root for license information.
|
|
9696
9571
|
|
|
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
9572
|
|
|
9703
|
-
|
|
9573
|
+
let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
9574
|
+
constructor() {
|
|
9575
|
+
super();
|
|
9704
9576
|
|
|
9705
|
-
|
|
9706
|
-
|
|
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
|
-
}
|
|
9577
|
+
this.variant = undefined;
|
|
9578
|
+
this.privateDefaults();
|
|
9715
9579
|
}
|
|
9716
9580
|
|
|
9717
9581
|
/**
|
|
9718
|
-
*
|
|
9582
|
+
* Internal Defaults.
|
|
9583
|
+
* @private
|
|
9719
9584
|
* @returns {void}
|
|
9720
9585
|
*/
|
|
9721
|
-
|
|
9722
|
-
|
|
9723
|
-
|
|
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);
|
|
9586
|
+
privateDefaults() {
|
|
9587
|
+
this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
|
|
9588
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$1$1();
|
|
9732
9589
|
}
|
|
9733
|
-
/* eslint-enable jsdoc/require-param */
|
|
9734
9590
|
|
|
9735
|
-
|
|
9736
|
-
|
|
9737
|
-
|
|
9738
|
-
|
|
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();
|
|
9759
|
-
|
|
9760
|
-
return elemTag === tag || elem.hasAttribute(tag);
|
|
9761
|
-
}
|
|
9762
|
-
};
|
|
9763
|
-
|
|
9764
|
-
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
9765
|
-
// See LICENSE in the project root for license information.
|
|
9766
|
-
|
|
9767
|
-
|
|
9768
|
-
let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
9769
|
-
constructor() {
|
|
9770
|
-
super();
|
|
9771
|
-
|
|
9772
|
-
this.privateDefaults();
|
|
9773
|
-
}
|
|
9774
|
-
|
|
9775
|
-
/**
|
|
9776
|
-
* Internal Defaults.
|
|
9777
|
-
* @private
|
|
9778
|
-
* @returns {void}
|
|
9779
|
-
*/
|
|
9780
|
-
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
|
-
this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
|
|
9796
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$3();
|
|
9797
|
-
}
|
|
9798
|
-
|
|
9799
|
-
// function to define props used within the scope of this component
|
|
9800
|
-
static get properties() {
|
|
9801
|
-
return {
|
|
9802
|
-
...super.properties,
|
|
9803
|
-
|
|
9804
|
-
/**
|
|
9805
|
-
* Sets the icon to use the accent style.
|
|
9806
|
-
*/
|
|
9807
|
-
accent: {
|
|
9808
|
-
type: Boolean,
|
|
9809
|
-
reflect: true
|
|
9810
|
-
},
|
|
9591
|
+
// function to define props used within the scope of this component
|
|
9592
|
+
static get properties() {
|
|
9593
|
+
return {
|
|
9594
|
+
...super.properties,
|
|
9811
9595
|
|
|
9812
9596
|
/**
|
|
9813
9597
|
* Set aria-hidden value. Default is `true`. Option is `false`.
|
|
@@ -9839,38 +9623,6 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
|
9839
9623
|
type: Boolean
|
|
9840
9624
|
},
|
|
9841
9625
|
|
|
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
9626
|
/**
|
|
9875
9627
|
* Exposes content in slot as icon label.
|
|
9876
9628
|
*/
|
|
@@ -9888,50 +9640,10 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
|
9888
9640
|
},
|
|
9889
9641
|
|
|
9890
9642
|
/**
|
|
9891
|
-
*
|
|
9892
|
-
*/
|
|
9893
|
-
primary: {
|
|
9894
|
-
type: Boolean,
|
|
9895
|
-
reflect: true
|
|
9896
|
-
},
|
|
9897
|
-
|
|
9898
|
-
/**
|
|
9899
|
-
* Sets the icon to use the secondary style.
|
|
9900
|
-
*/
|
|
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.
|
|
9643
|
+
* 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`.
|
|
9932
9644
|
*/
|
|
9933
|
-
|
|
9934
|
-
type:
|
|
9645
|
+
variant: {
|
|
9646
|
+
type: String,
|
|
9935
9647
|
reflect: true
|
|
9936
9648
|
}
|
|
9937
9649
|
};
|
|
@@ -9955,7 +9667,7 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
|
9955
9667
|
*
|
|
9956
9668
|
*/
|
|
9957
9669
|
static register(name = "auro-icon") {
|
|
9958
|
-
AuroLibraryRuntimeUtils$
|
|
9670
|
+
AuroLibraryRuntimeUtils$1$1.prototype.registerComponent(name, AuroIcon);
|
|
9959
9671
|
}
|
|
9960
9672
|
|
|
9961
9673
|
connectedCallback() {
|
|
@@ -10021,197 +9733,17 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
|
10021
9733
|
}
|
|
10022
9734
|
};
|
|
10023
9735
|
|
|
10024
|
-
var iconVersion$1 = '
|
|
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 */
|
|
9736
|
+
var iconVersion$1 = '8.0.1';
|
|
10148
9737
|
|
|
10149
|
-
|
|
9738
|
+
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}`;
|
|
10150
9739
|
|
|
10151
|
-
|
|
9740
|
+
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}`;
|
|
10152
9741
|
|
|
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();
|
|
10192
|
-
|
|
10193
|
-
if (elemTag !== tag) {
|
|
10194
|
-
elem.setAttribute(tag, true);
|
|
10195
|
-
}
|
|
10196
|
-
}
|
|
10197
|
-
|
|
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();
|
|
10207
|
-
|
|
10208
|
-
return elemTag === tag || elem.hasAttribute(tag);
|
|
10209
|
-
}
|
|
10210
|
-
};
|
|
9742
|
+
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
9743
|
|
|
10212
9744
|
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
9745
|
|
|
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-
|
|
9746
|
+
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
9747
|
|
|
10216
9748
|
var tokensCss$1 = css`:host{--ds-auro-loader-background-color:currentcolor;--ds-auro-loader-border-color:currentcolor;--ds-auro-loader-color:currentcolor}`;
|
|
10217
9749
|
|
|
@@ -10219,25 +9751,6 @@ var tokensCss$1 = css`:host{--ds-auro-loader-background-color:currentcolor;--ds-
|
|
|
10219
9751
|
// See LICENSE in the project root for license information.
|
|
10220
9752
|
|
|
10221
9753
|
|
|
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
9754
|
class AuroLoader extends LitElement {
|
|
10242
9755
|
constructor() {
|
|
10243
9756
|
super();
|
|
@@ -10271,19 +9784,35 @@ class AuroLoader extends LitElement {
|
|
|
10271
9784
|
// function to define props used within the scope of this component
|
|
10272
9785
|
static get properties() {
|
|
10273
9786
|
return {
|
|
10274
|
-
|
|
9787
|
+
|
|
9788
|
+
/**
|
|
9789
|
+
* Sets loader to laser type.
|
|
9790
|
+
*/
|
|
9791
|
+
laser: {
|
|
10275
9792
|
type: Boolean,
|
|
10276
9793
|
reflect: true
|
|
10277
9794
|
},
|
|
9795
|
+
|
|
9796
|
+
/**
|
|
9797
|
+
* Sets loader to orbit type.
|
|
9798
|
+
*/
|
|
10278
9799
|
orbit: {
|
|
10279
9800
|
type: Boolean,
|
|
10280
9801
|
reflect: true
|
|
10281
9802
|
},
|
|
10282
|
-
|
|
9803
|
+
|
|
9804
|
+
/**
|
|
9805
|
+
* Sets loader to pulse type.
|
|
9806
|
+
*/
|
|
9807
|
+
pulse: {
|
|
10283
9808
|
type: Boolean,
|
|
10284
9809
|
reflect: true
|
|
10285
9810
|
},
|
|
10286
|
-
|
|
9811
|
+
|
|
9812
|
+
/**
|
|
9813
|
+
* Sets loader to ringworm type.
|
|
9814
|
+
*/
|
|
9815
|
+
ringworm: {
|
|
10287
9816
|
type: Boolean,
|
|
10288
9817
|
reflect: true
|
|
10289
9818
|
}
|
|
@@ -10357,23 +9886,26 @@ class AuroLoader extends LitElement {
|
|
|
10357
9886
|
}
|
|
10358
9887
|
}
|
|
10359
9888
|
|
|
10360
|
-
var loaderVersion = '
|
|
9889
|
+
var loaderVersion = '5.0.0';
|
|
10361
9890
|
|
|
9891
|
+
/* eslint-disable max-lines */
|
|
10362
9892
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
10363
9893
|
// See LICENSE in the project root for license information.
|
|
10364
9894
|
|
|
10365
9895
|
|
|
10366
9896
|
/**
|
|
10367
9897
|
* @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
|
|
9898
|
+
* @attr {Boolean} disabled - If set to true, button will become disabled and not allow for interactions
|
|
10369
9899
|
* @attr {Boolean} iconOnly - If set to true, the button will contain an icon with no additional content
|
|
10370
9900
|
* @attr {Boolean} loading - If set to true button text will be replaced with `auro-loader` and become disabled
|
|
9901
|
+
* @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
9902
|
* @attr {Boolean} onDark - Set value for on-dark version of auro-button
|
|
10372
9903
|
* @attr {Boolean} rounded - If set to true, the button will have a rounded shape
|
|
10373
9904
|
* @attr {Boolean} slim - Set value for slim version of auro-button
|
|
10374
9905
|
* @attr {Boolean} fluid - Alters the shape of the button to be full width of its parent container
|
|
10375
9906
|
* @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
9907
|
* @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.
|
|
9908
|
+
* @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
9909
|
* @attr {String} id - Set the unique ID of an element.
|
|
10378
9910
|
* @attr {String} title - Sets title attribute. The information is most often shown as a tooltip text when the mouse moves over the element.
|
|
10379
9911
|
* @attr {String} type - The type of the button. Possible values are: `submit`, `reset`, `button`
|
|
@@ -10418,6 +9950,7 @@ class AuroButton extends LitElement {
|
|
|
10418
9950
|
this.rounded = false;
|
|
10419
9951
|
this.slim = false;
|
|
10420
9952
|
this.fluid = false;
|
|
9953
|
+
this.loadingText = this.loadingText || 'Loading...';
|
|
10421
9954
|
|
|
10422
9955
|
// Support for HTML5 forms
|
|
10423
9956
|
if (typeof this.attachInternals === 'function') {
|
|
@@ -10432,7 +9965,7 @@ class AuroButton extends LitElement {
|
|
|
10432
9965
|
/**
|
|
10433
9966
|
* Generate unique names for dependency components.
|
|
10434
9967
|
*/
|
|
10435
|
-
const versioning = new AuroDependencyVersioning$
|
|
9968
|
+
const versioning = new AuroDependencyVersioning$1();
|
|
10436
9969
|
|
|
10437
9970
|
/**
|
|
10438
9971
|
* @private
|
|
@@ -10478,6 +10011,9 @@ class AuroButton extends LitElement {
|
|
|
10478
10011
|
type: Boolean,
|
|
10479
10012
|
reflect: true
|
|
10480
10013
|
},
|
|
10014
|
+
loadingText: {
|
|
10015
|
+
type: String
|
|
10016
|
+
},
|
|
10481
10017
|
onDark: {
|
|
10482
10018
|
type: Boolean,
|
|
10483
10019
|
reflect: true
|
|
@@ -10498,6 +10034,10 @@ class AuroButton extends LitElement {
|
|
|
10498
10034
|
type: String,
|
|
10499
10035
|
reflect: true
|
|
10500
10036
|
},
|
|
10037
|
+
ariaexpanded: {
|
|
10038
|
+
type: Boolean,
|
|
10039
|
+
reflect: true
|
|
10040
|
+
},
|
|
10501
10041
|
title: {
|
|
10502
10042
|
type: String,
|
|
10503
10043
|
reflect: true
|
|
@@ -10527,7 +10067,7 @@ class AuroButton extends LitElement {
|
|
|
10527
10067
|
*
|
|
10528
10068
|
*/
|
|
10529
10069
|
static register(name = "auro-button") {
|
|
10530
|
-
AuroLibraryRuntimeUtils$
|
|
10070
|
+
AuroLibraryRuntimeUtils$1$1.prototype.registerComponent(name, AuroButton);
|
|
10531
10071
|
}
|
|
10532
10072
|
|
|
10533
10073
|
/**
|
|
@@ -10569,12 +10109,22 @@ class AuroButton extends LitElement {
|
|
|
10569
10109
|
this.notifyReady();
|
|
10570
10110
|
}
|
|
10571
10111
|
|
|
10112
|
+
/**
|
|
10113
|
+
* Submits the form that this button is associated with.
|
|
10114
|
+
* @private
|
|
10115
|
+
* @returns {void}
|
|
10116
|
+
*/
|
|
10572
10117
|
surfaceSubmitEvent() {
|
|
10573
10118
|
if (this.form) {
|
|
10574
10119
|
this.form.requestSubmit();
|
|
10575
10120
|
}
|
|
10576
10121
|
}
|
|
10577
10122
|
|
|
10123
|
+
/**
|
|
10124
|
+
* Returns the form element that this button is associated with.
|
|
10125
|
+
* @private
|
|
10126
|
+
* @returns {HTMLFormElement|null}
|
|
10127
|
+
*/
|
|
10578
10128
|
get form() {
|
|
10579
10129
|
return this.internals ? this.internals.form : null;
|
|
10580
10130
|
}
|
|
@@ -10594,8 +10144,9 @@ class AuroButton extends LitElement {
|
|
|
10594
10144
|
return html`
|
|
10595
10145
|
<button
|
|
10596
10146
|
part="button"
|
|
10597
|
-
aria-label="${ifDefined(this.
|
|
10147
|
+
aria-label="${ifDefined(this.loading ? this.loadingText : this.arialabel || undefined)}"
|
|
10598
10148
|
aria-labelledby="${ifDefined(this.arialabelledby ? this.arialabelledby : undefined)}"
|
|
10149
|
+
aria-expanded="${ifDefined(this.ariaexpanded)}"
|
|
10599
10150
|
?autofocus="${this.autofocus}"
|
|
10600
10151
|
class="${classMap(classes)}"
|
|
10601
10152
|
?disabled="${this.disabled || this.loading}"
|
|
@@ -10623,13 +10174,13 @@ class AuroButton extends LitElement {
|
|
|
10623
10174
|
}
|
|
10624
10175
|
}
|
|
10625
10176
|
|
|
10626
|
-
var buttonVersion = '
|
|
10177
|
+
var buttonVersion = '9.3.0';
|
|
10627
10178
|
|
|
10628
|
-
var colorCss$5 = css`:host([error]){--ds-auro-helptext-color: var(--ds-color-
|
|
10179
|
+
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
10180
|
|
|
10630
10181
|
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
10182
|
|
|
10632
|
-
var tokensCss$5 = css`:host{--ds-auro-helptext-color: var(--ds-color-
|
|
10183
|
+
var tokensCss$5 = css`:host{--ds-auro-helptext-color: var(--ds-basic-color-texticon-muted, #676767)}`;
|
|
10633
10184
|
|
|
10634
10185
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
10635
10186
|
// See LICENSE in the project root for license information.
|
|
@@ -10638,7 +10189,7 @@ var tokensCss$5 = css`:host{--ds-auro-helptext-color: var(--ds-color-text-tertia
|
|
|
10638
10189
|
|
|
10639
10190
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
10640
10191
|
|
|
10641
|
-
let AuroLibraryRuntimeUtils$
|
|
10192
|
+
let AuroLibraryRuntimeUtils$2 = class AuroLibraryRuntimeUtils {
|
|
10642
10193
|
|
|
10643
10194
|
/* eslint-disable jsdoc/require-param */
|
|
10644
10195
|
|
|
@@ -10716,9 +10267,10 @@ class AuroHelpText extends LitElement {
|
|
|
10716
10267
|
super();
|
|
10717
10268
|
|
|
10718
10269
|
this.error = false;
|
|
10270
|
+
this.onDark = false;
|
|
10719
10271
|
this.hasTextContent = false;
|
|
10720
10272
|
|
|
10721
|
-
AuroLibraryRuntimeUtils$
|
|
10273
|
+
AuroLibraryRuntimeUtils$2.prototype.handleComponentTagRename(this, 'auro-helptext');
|
|
10722
10274
|
}
|
|
10723
10275
|
|
|
10724
10276
|
static get styles() {
|
|
@@ -10754,6 +10306,14 @@ class AuroHelpText extends LitElement {
|
|
|
10754
10306
|
type: Boolean,
|
|
10755
10307
|
reflect: true,
|
|
10756
10308
|
},
|
|
10309
|
+
|
|
10310
|
+
/**
|
|
10311
|
+
* If declared, will apply onDark styles.
|
|
10312
|
+
*/
|
|
10313
|
+
onDark: {
|
|
10314
|
+
type: Boolean,
|
|
10315
|
+
reflect: true
|
|
10316
|
+
}
|
|
10757
10317
|
};
|
|
10758
10318
|
}
|
|
10759
10319
|
|
|
@@ -10766,7 +10326,7 @@ class AuroHelpText extends LitElement {
|
|
|
10766
10326
|
*
|
|
10767
10327
|
*/
|
|
10768
10328
|
static register(name = "auro-helptext") {
|
|
10769
|
-
AuroLibraryRuntimeUtils$
|
|
10329
|
+
AuroLibraryRuntimeUtils$2.prototype.registerComponent(name, AuroHelpText);
|
|
10770
10330
|
}
|
|
10771
10331
|
|
|
10772
10332
|
updated() {
|
|
@@ -10863,7 +10423,7 @@ class AuroInput extends BaseInput {
|
|
|
10863
10423
|
*
|
|
10864
10424
|
*/
|
|
10865
10425
|
static register(name = "auro-input") {
|
|
10866
|
-
AuroLibraryRuntimeUtils$
|
|
10426
|
+
AuroLibraryRuntimeUtils$1$1.prototype.registerComponent(name, AuroInput);
|
|
10867
10427
|
}
|
|
10868
10428
|
|
|
10869
10429
|
/**
|
|
@@ -10903,7 +10463,8 @@ class AuroInput extends BaseInput {
|
|
|
10903
10463
|
category="payment"
|
|
10904
10464
|
name="${name}"
|
|
10905
10465
|
part="accentIcon"
|
|
10906
|
-
?
|
|
10466
|
+
?onDark="${this.onDark}"
|
|
10467
|
+
variant="${this.disabled ? 'disabled' : 'muted'}">
|
|
10907
10468
|
</${this.iconTag}>
|
|
10908
10469
|
`) : undefined
|
|
10909
10470
|
}
|
|
@@ -10915,7 +10476,8 @@ class AuroInput extends BaseInput {
|
|
|
10915
10476
|
category="interface"
|
|
10916
10477
|
name="calendar"
|
|
10917
10478
|
part="accentIcon"
|
|
10918
|
-
?
|
|
10479
|
+
?onDark="${this.onDark}"
|
|
10480
|
+
variant="${this.disabled ? 'disabled' : 'muted'}">
|
|
10919
10481
|
</${this.iconTag}>`
|
|
10920
10482
|
: undefined
|
|
10921
10483
|
}
|
|
@@ -10960,7 +10522,7 @@ class AuroInput extends BaseInput {
|
|
|
10960
10522
|
<${this.iconTag}
|
|
10961
10523
|
category="alert"
|
|
10962
10524
|
name="error-stroke"
|
|
10963
|
-
|
|
10525
|
+
customColor
|
|
10964
10526
|
</${this.iconTag}>
|
|
10965
10527
|
</div>
|
|
10966
10528
|
` : undefined}
|
|
@@ -10969,6 +10531,7 @@ class AuroInput extends BaseInput {
|
|
|
10969
10531
|
<div class="notification">
|
|
10970
10532
|
<${this.buttonTag}
|
|
10971
10533
|
variant="flat"
|
|
10534
|
+
?onDark="${this.onDark}"
|
|
10972
10535
|
aria-hidden="true"
|
|
10973
10536
|
tabindex="-1"
|
|
10974
10537
|
@click="${this.handleClickShowPassword}"
|
|
@@ -10992,6 +10555,7 @@ class AuroInput extends BaseInput {
|
|
|
10992
10555
|
<div class="notification">
|
|
10993
10556
|
<${this.buttonTag}
|
|
10994
10557
|
variant="flat"
|
|
10558
|
+
?onDark="${this.onDark}"
|
|
10995
10559
|
class="notificationBtn clearBtn"
|
|
10996
10560
|
aria-label="${i18n(this.lang, 'clearInput')}"
|
|
10997
10561
|
@click="${this.handleClickClear}">
|
|
@@ -11010,14 +10574,14 @@ class AuroInput extends BaseInput {
|
|
|
11010
10574
|
<!-- Help text and error message template -->
|
|
11011
10575
|
${!this.validity || this.validity === undefined || this.validity === 'valid'
|
|
11012
10576
|
? html`
|
|
11013
|
-
<${this.helpTextTag}>
|
|
10577
|
+
<${this.helpTextTag} ?onDark="${this.onDark}">
|
|
11014
10578
|
<p id="${this.uniqueId}" part="helpText">
|
|
11015
10579
|
<slot name="helptext">${this.getHelpText()}</slot>
|
|
11016
10580
|
</p>
|
|
11017
10581
|
</${this.helpTextTag}>
|
|
11018
10582
|
`
|
|
11019
10583
|
: html`
|
|
11020
|
-
<${this.helpTextTag} error>
|
|
10584
|
+
<${this.helpTextTag} error ?onDark="${this.onDark}">
|
|
11021
10585
|
<p id="${this.uniqueId}" role="alert" aria-live="assertive" part="helpText">
|
|
11022
10586
|
${this.errorMessage}
|
|
11023
10587
|
</p>
|
|
@@ -11032,9 +10596,9 @@ var inputVersion = '4.2.0';
|
|
|
11032
10596
|
|
|
11033
10597
|
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
10598
|
|
|
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,
|
|
10599
|
+
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
10600
|
|
|
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-
|
|
10601
|
+
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
10602
|
|
|
11039
10603
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
11040
10604
|
// See LICENSE in the project root for license information.
|
|
@@ -11043,7 +10607,7 @@ var tokenCss = css`:host{--ds-auro-dropdownbib-header-boxshadow-color: var(--ds-
|
|
|
11043
10607
|
|
|
11044
10608
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
11045
10609
|
|
|
11046
|
-
let AuroLibraryRuntimeUtils$
|
|
10610
|
+
let AuroLibraryRuntimeUtils$1 = class AuroLibraryRuntimeUtils {
|
|
11047
10611
|
|
|
11048
10612
|
/* eslint-disable jsdoc/require-param */
|
|
11049
10613
|
|
|
@@ -11212,7 +10776,7 @@ const cacheFetch = (uri, options = {}) => {
|
|
|
11212
10776
|
return _fetchMap.get(uri);
|
|
11213
10777
|
};
|
|
11214
10778
|
|
|
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}
|
|
10779
|
+
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
10780
|
|
|
11217
10781
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
11218
10782
|
// See LICENSE in the project root for license information.
|
|
@@ -11220,7 +10784,6 @@ var styleCss$1 = css`:focus:not(:focus-visible){outline:3px solid transparent}.u
|
|
|
11220
10784
|
|
|
11221
10785
|
// See https://git.io/JJ6SJ for "How to document your components using JSDoc"
|
|
11222
10786
|
/**
|
|
11223
|
-
* @attr {Boolean} onDark - Set value for on-dark version of auro-icon
|
|
11224
10787
|
* @slot - Hidden from visibility, used for a11y if icon description is needed
|
|
11225
10788
|
*/
|
|
11226
10789
|
|
|
@@ -11235,6 +10798,10 @@ class BaseIcon extends AuroElement {
|
|
|
11235
10798
|
static get properties() {
|
|
11236
10799
|
return {
|
|
11237
10800
|
...super.properties,
|
|
10801
|
+
|
|
10802
|
+
/**
|
|
10803
|
+
* Set value for on-dark version of auro-icon.
|
|
10804
|
+
*/
|
|
11238
10805
|
onDark: {
|
|
11239
10806
|
type: Boolean,
|
|
11240
10807
|
reflect: true
|
|
@@ -11293,81 +10860,11 @@ class BaseIcon extends AuroElement {
|
|
|
11293
10860
|
}
|
|
11294
10861
|
}
|
|
11295
10862
|
|
|
11296
|
-
var tokensCss = css`:host{--ds-auro-icon-color:var(--ds-color-
|
|
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 */
|
|
11310
|
-
|
|
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
|
-
}
|
|
10863
|
+
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)}`;
|
|
11322
10864
|
|
|
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 */
|
|
10865
|
+
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)}`;
|
|
11340
10866
|
|
|
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
|
|
10867
|
+
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
11371
10868
|
// See LICENSE in the project root for license information.
|
|
11372
10869
|
|
|
11373
10870
|
|
|
@@ -11375,6 +10872,7 @@ class AuroIcon extends BaseIcon {
|
|
|
11375
10872
|
constructor() {
|
|
11376
10873
|
super();
|
|
11377
10874
|
|
|
10875
|
+
this.variant = undefined;
|
|
11378
10876
|
this.privateDefaults();
|
|
11379
10877
|
}
|
|
11380
10878
|
|
|
@@ -11384,20 +10882,6 @@ class AuroIcon extends BaseIcon {
|
|
|
11384
10882
|
* @returns {void}
|
|
11385
10883
|
*/
|
|
11386
10884
|
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
10885
|
this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
|
|
11402
10886
|
this.runtimeUtils = new AuroLibraryRuntimeUtils$1();
|
|
11403
10887
|
}
|
|
@@ -11407,14 +10891,6 @@ class AuroIcon extends BaseIcon {
|
|
|
11407
10891
|
return {
|
|
11408
10892
|
...super.properties,
|
|
11409
10893
|
|
|
11410
|
-
/**
|
|
11411
|
-
* Sets the icon to use the accent style.
|
|
11412
|
-
*/
|
|
11413
|
-
accent: {
|
|
11414
|
-
type: Boolean,
|
|
11415
|
-
reflect: true
|
|
11416
|
-
},
|
|
11417
|
-
|
|
11418
10894
|
/**
|
|
11419
10895
|
* Set aria-hidden value. Default is `true`. Option is `false`.
|
|
11420
10896
|
*/
|
|
@@ -11445,38 +10921,6 @@ class AuroIcon extends BaseIcon {
|
|
|
11445
10921
|
type: Boolean
|
|
11446
10922
|
},
|
|
11447
10923
|
|
|
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
10924
|
/**
|
|
11481
10925
|
* Exposes content in slot as icon label.
|
|
11482
10926
|
*/
|
|
@@ -11494,50 +10938,10 @@ class AuroIcon extends BaseIcon {
|
|
|
11494
10938
|
},
|
|
11495
10939
|
|
|
11496
10940
|
/**
|
|
11497
|
-
*
|
|
10941
|
+
* 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`.
|
|
11498
10942
|
*/
|
|
11499
|
-
|
|
11500
|
-
type:
|
|
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.
|
|
11538
|
-
*/
|
|
11539
|
-
warning: {
|
|
11540
|
-
type: Boolean,
|
|
10943
|
+
variant: {
|
|
10944
|
+
type: String,
|
|
11541
10945
|
reflect: true
|
|
11542
10946
|
}
|
|
11543
10947
|
};
|
|
@@ -11627,7 +11031,7 @@ class AuroIcon extends BaseIcon {
|
|
|
11627
11031
|
}
|
|
11628
11032
|
}
|
|
11629
11033
|
|
|
11630
|
-
var iconVersion = '
|
|
11034
|
+
var iconVersion = '8.0.1';
|
|
11631
11035
|
|
|
11632
11036
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
11633
11037
|
// See LICENSE in the project root for license information.
|
|
@@ -11852,7 +11256,9 @@ class AuroBibtemplate extends LitElement {
|
|
|
11852
11256
|
constructor() {
|
|
11853
11257
|
super();
|
|
11854
11258
|
|
|
11855
|
-
|
|
11259
|
+
this.large = false;
|
|
11260
|
+
|
|
11261
|
+
AuroLibraryRuntimeUtils$1.prototype.handleComponentTagRename(this, 'auro-bibtemplate');
|
|
11856
11262
|
|
|
11857
11263
|
const versioning = new AuroDependencyVersioning();
|
|
11858
11264
|
this.iconTag = versioning.generateTag('auro-formkit-bibtemplate-icon', iconVersion, AuroIcon);
|
|
@@ -11891,7 +11297,7 @@ class AuroBibtemplate extends LitElement {
|
|
|
11891
11297
|
*
|
|
11892
11298
|
*/
|
|
11893
11299
|
static register(name = "auro-bibtemplate") {
|
|
11894
|
-
AuroLibraryRuntimeUtils$
|
|
11300
|
+
AuroLibraryRuntimeUtils$1.prototype.registerComponent(name, AuroBibtemplate);
|
|
11895
11301
|
}
|
|
11896
11302
|
|
|
11897
11303
|
/**
|
|
@@ -11963,11 +11369,11 @@ class AuroBibtemplate extends LitElement {
|
|
|
11963
11369
|
|
|
11964
11370
|
var bibTemplateVersion = '1.0.0';
|
|
11965
11371
|
|
|
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)}`;
|
|
11372
|
+
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
11373
|
|
|
11968
|
-
css`:host ::slotted(hr){border-top-color:var(--ds-auro-menu-divider-color)
|
|
11374
|
+
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
11375
|
|
|
11970
|
-
css`:host{--ds-auro-menu-divider-color: var(--ds-color-border-divider-
|
|
11376
|
+
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
11377
|
|
|
11972
11378
|
// Copyright (c) 2021 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
11973
11379
|
// See LICENSE in the project root for license information.
|
|
@@ -12071,15 +11477,15 @@ function arrayOrUndefinedHasChanged(newVal, oldVal) {
|
|
|
12071
11477
|
|
|
12072
11478
|
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
11479
|
|
|
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)
|
|
11480
|
+
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
11481
|
|
|
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}
|
|
11482
|
+
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
11483
|
|
|
12078
|
-
css`:host{--ds-auro-icon-color:var(--ds-color-
|
|
11484
|
+
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
11485
|
|
|
12080
|
-
css`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[
|
|
11486
|
+
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
11487
|
|
|
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){
|
|
11488
|
+
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
11489
|
|
|
12084
11490
|
// Copyright (c) 2022 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
12085
11491
|
// See LICENSE in the project root for license information.
|
|
@@ -12100,11 +11506,6 @@ class AuroCombobox extends LitElement {
|
|
|
12100
11506
|
constructor() {
|
|
12101
11507
|
super();
|
|
12102
11508
|
|
|
12103
|
-
this.noFilter = false;
|
|
12104
|
-
this.validity = undefined;
|
|
12105
|
-
this.value = undefined;
|
|
12106
|
-
this.optionSelected = undefined;
|
|
12107
|
-
|
|
12108
11509
|
this.privateDefaults();
|
|
12109
11510
|
}
|
|
12110
11511
|
|
|
@@ -12113,15 +11514,29 @@ class AuroCombobox extends LitElement {
|
|
|
12113
11514
|
* @returns {void} Internal defaults.
|
|
12114
11515
|
*/
|
|
12115
11516
|
privateDefaults() {
|
|
11517
|
+
this.onDark = false;
|
|
11518
|
+
|
|
11519
|
+
this.noFilter = false;
|
|
11520
|
+
this.validity = undefined;
|
|
11521
|
+
this.value = undefined;
|
|
11522
|
+
this.optionSelected = undefined;
|
|
11523
|
+
|
|
11524
|
+
this.checkmark = false;
|
|
11525
|
+
this.disabled = false;
|
|
11526
|
+
this.noValidate = false;
|
|
11527
|
+
this.required = false;
|
|
11528
|
+
this.triggerIcon = false;
|
|
11529
|
+
|
|
12116
11530
|
this.availableOptions = [];
|
|
12117
11531
|
this.optionActive = null;
|
|
12118
11532
|
this.msgSelectionMissing = 'Please select an option.';
|
|
12119
11533
|
|
|
12120
11534
|
this.fullscreenBreakpoint = 'sm';
|
|
11535
|
+
this.largeFullscreenHeadline = false;
|
|
12121
11536
|
|
|
12122
11537
|
this.validation = new AuroFormValidation$1();
|
|
12123
11538
|
|
|
12124
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
11539
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$4();
|
|
12125
11540
|
|
|
12126
11541
|
this.isHiddenWhileLoading = false;
|
|
12127
11542
|
|
|
@@ -12131,11 +11546,11 @@ class AuroCombobox extends LitElement {
|
|
|
12131
11546
|
this.noFlip = false;
|
|
12132
11547
|
this.autoPlacement = false;
|
|
12133
11548
|
|
|
12134
|
-
const versioning = new AuroDependencyVersioning$
|
|
11549
|
+
const versioning = new AuroDependencyVersioning$3();
|
|
12135
11550
|
|
|
12136
|
-
this.dropdownTag = versioning.generateTag('auro-formkit-
|
|
12137
|
-
this.bibtemplateTag = versioning.generateTag('auro-formkit-
|
|
12138
|
-
this.inputTag = versioning.generateTag('auro-formkit-
|
|
11551
|
+
this.dropdownTag = versioning.generateTag('auro-formkit-combobox-dropdown', dropdownVersion, AuroDropdown);
|
|
11552
|
+
this.bibtemplateTag = versioning.generateTag('auro-formkit-combobox-bibtemplate', bibTemplateVersion, AuroBibtemplate);
|
|
11553
|
+
this.inputTag = versioning.generateTag('auro-formkit-combobox-input', inputVersion, AuroInput);
|
|
12139
11554
|
}
|
|
12140
11555
|
|
|
12141
11556
|
// This function is to define props used within the scope of this component
|
|
@@ -12208,7 +11623,8 @@ class AuroCombobox extends LitElement {
|
|
|
12208
11623
|
* If set, disables auto-validation on blur.
|
|
12209
11624
|
*/
|
|
12210
11625
|
noValidate: {
|
|
12211
|
-
type: Boolean
|
|
11626
|
+
type: Boolean,
|
|
11627
|
+
reflect: true
|
|
12212
11628
|
},
|
|
12213
11629
|
|
|
12214
11630
|
/**
|
|
@@ -12220,6 +11636,14 @@ class AuroCombobox extends LitElement {
|
|
|
12220
11636
|
reflect: true
|
|
12221
11637
|
},
|
|
12222
11638
|
|
|
11639
|
+
/**
|
|
11640
|
+
* If declared, onDark styles will be applied to the trigger.
|
|
11641
|
+
*/
|
|
11642
|
+
onDark: {
|
|
11643
|
+
type: Boolean,
|
|
11644
|
+
reflect: true
|
|
11645
|
+
},
|
|
11646
|
+
|
|
12223
11647
|
/**
|
|
12224
11648
|
* Specifies the current selected option.
|
|
12225
11649
|
*/
|
|
@@ -12327,8 +11751,7 @@ class AuroCombobox extends LitElement {
|
|
|
12327
11751
|
* @private
|
|
12328
11752
|
*/
|
|
12329
11753
|
isDropdownFullscreen: {
|
|
12330
|
-
type: Boolean
|
|
12331
|
-
reflect: false
|
|
11754
|
+
type: Boolean
|
|
12332
11755
|
}
|
|
12333
11756
|
};
|
|
12334
11757
|
}
|
|
@@ -12346,7 +11769,7 @@ class AuroCombobox extends LitElement {
|
|
|
12346
11769
|
*
|
|
12347
11770
|
*/
|
|
12348
11771
|
static register(name = 'auro-combobox') {
|
|
12349
|
-
AuroLibraryRuntimeUtils$
|
|
11772
|
+
AuroLibraryRuntimeUtils$4.prototype.registerComponent(name, AuroCombobox);
|
|
12350
11773
|
}
|
|
12351
11774
|
|
|
12352
11775
|
/**
|
|
@@ -12989,6 +12412,7 @@ class AuroCombobox extends LitElement {
|
|
|
12989
12412
|
</div>
|
|
12990
12413
|
<${this.dropdownTag}
|
|
12991
12414
|
for="dropdownMenu"
|
|
12415
|
+
?onDark="${this.onDark}"
|
|
12992
12416
|
fluid
|
|
12993
12417
|
bordered
|
|
12994
12418
|
rounded
|
|
@@ -13005,6 +12429,7 @@ class AuroCombobox extends LitElement {
|
|
|
13005
12429
|
<${this.inputTag}
|
|
13006
12430
|
slot="trigger"
|
|
13007
12431
|
bordered
|
|
12432
|
+
?onDark="${this.onDark}"
|
|
13008
12433
|
?required="${this.required}"
|
|
13009
12434
|
?noValidate="${this.noValidate}"
|
|
13010
12435
|
?disabled="${this.disabled}"
|