@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
|
@@ -38,7 +38,7 @@ const a=Symbol.for(""),o$2=t=>{if(t?.r===a)return t?._$litStatic$},s$1=t=>({_$li
|
|
|
38
38
|
|
|
39
39
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
40
40
|
|
|
41
|
-
let AuroLibraryRuntimeUtils$
|
|
41
|
+
let AuroLibraryRuntimeUtils$4 = class AuroLibraryRuntimeUtils {
|
|
42
42
|
|
|
43
43
|
/* eslint-disable jsdoc/require-param */
|
|
44
44
|
|
|
@@ -107,7 +107,7 @@ let AuroLibraryRuntimeUtils$9 = class AuroLibraryRuntimeUtils {
|
|
|
107
107
|
|
|
108
108
|
let AuroFormValidation$1 = class AuroFormValidation {
|
|
109
109
|
constructor() {
|
|
110
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
110
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$4();
|
|
111
111
|
}
|
|
112
112
|
|
|
113
113
|
/**
|
|
@@ -416,7 +416,7 @@ let AuroFormValidation$1 = class AuroFormValidation {
|
|
|
416
416
|
// See LICENSE in the project root for license information.
|
|
417
417
|
|
|
418
418
|
|
|
419
|
-
let AuroDependencyVersioning$
|
|
419
|
+
let AuroDependencyVersioning$3 = class AuroDependencyVersioning {
|
|
420
420
|
|
|
421
421
|
/**
|
|
422
422
|
* Generates a unique string to be used for child auro element naming.
|
|
@@ -807,19 +807,19 @@ class UtilitiesCalendarRender {
|
|
|
807
807
|
}
|
|
808
808
|
}
|
|
809
809
|
|
|
810
|
-
var styleCss$d = i$5`.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]::part(iconContainer){top:0;display:flex;height:100%;align-items:center}[auro-input]::part(accentIcon){transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1)}[auro-input]::part(helpText){display:none}[auro-input]::part(wrapper){border-width:0 !important}[auro-input]:not(:first-child)::part(wrapper)::after{position:absolute;left:50%;width:95%;height:1px;background-color:var(--ds-auro-datepicker-range-input-divider-color);content:"";transform:translateX(-50%)}.outerWrapper{position:relative;container:outerwrapper/inline-size}.dpTriggerContent{display:flex;flex-direction:column}.dpTriggerContent [auro-input]{flex:1}:host(:not([stacked])) .dpTriggerContent{flex-direction:row}:host(:not([stacked])) [auro-input]:first-of-type{margin-right:var(--ds-size-150, 0.75rem)}:host(:not([stacked])) [auro-input]:nth-child(2){margin-left:var(--ds-size-150, 0.75rem)}:host(:not([stacked])) [auro-input]:nth-child(2)::part(accentIcon){display:none}:host(:not([stacked])) [auro-input]:nth-child(2)::part(label){left:0;width:100%}:host(:not([stacked])) [auro-input]:nth-child(2)::part(input){padding-left:0}:host(:not([stacked])) [auro-input]:nth-child(2):before{position:absolute;top:13px;left:calc(var(--ds-size-150, 0.75rem)*-1);display:block;width:1px;height:2rem;content:""}:host(:not([stacked])) [auro-input]:not(:first-child)::part(wrapper):after{content:none}:host(:not([stacked])[range]) [auro-input]{max-width:50%}@media screen and (max-width: 576px){::part(popover){position:fixed !important;top:0 !important;left:0 !important;width:100vw !important;height:100vh !important;margin-bottom:var(--ds-size-200, 1rem);transform:unset !important}.calendarWrapper{display:flex;height:100dvh;flex-direction:row;justify-content:center}}`;
|
|
810
|
+
var styleCss$d = i$5`.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]::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:before{border-bottom-width:0 !important;box-shadow:unset !important;outline:unset !important}[auro-input]:not(:first-child)::part(wrapper)::after{position:absolute;left:50%;width:95%;height:1px;background-color:var(--ds-auro-datepicker-range-input-divider-color);content:"";transform:translateX(-50%)}.outerWrapper{position:relative;container:outerwrapper/inline-size}.dpTriggerContent{display:flex;flex-direction:column}.dpTriggerContent [auro-input]{flex:1}:host(:not([stacked])) .dpTriggerContent{flex-direction:row}:host(:not([stacked])) [auro-input]:first-of-type{margin-right:var(--ds-size-150, 0.75rem)}:host(:not([stacked])) [auro-input]:nth-child(2){margin-left:var(--ds-size-150, 0.75rem)}:host(:not([stacked])) [auro-input]:nth-child(2)::part(accentIcon){display:none}:host(:not([stacked])) [auro-input]:nth-child(2)::part(label){left:0;width:100%}:host(:not([stacked])) [auro-input]:nth-child(2)::part(input){padding-left:0}:host(:not([stacked])) [auro-input]:nth-child(2):before{position:absolute;top:13px;left:calc(var(--ds-size-150, 0.75rem)*-1);display:block;width:1px;height:2rem;content:""}:host(:not([stacked])) [auro-input]:not(:first-child)::part(wrapper):after{content:none}:host(:not([stacked])[range]) [auro-input]{max-width:50%}@media screen and (max-width: 576px){::part(popover){position:fixed !important;top:0 !important;left:0 !important;width:100vw !important;height:100vh !important;margin-bottom:var(--ds-size-200, 1rem);transform:unset !important}.calendarWrapper{display:flex;height:100dvh;flex-direction:row;justify-content:center}}`;
|
|
811
811
|
|
|
812
|
-
var colorCss$d = i$5`.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]::part(wrapper){--ds-auro-input-border-color: transparent;--ds-auro-input-container-color: transparent}.dpTriggerContent [auro-input]:nth-child(2):before{background-color:var(--ds-auro-datepicker-range-input-divider-color)}
|
|
812
|
+
var colorCss$d = i$5`.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]::part(wrapper){--ds-auro-input-border-color: transparent;--ds-auro-input-container-color: transparent}.dpTriggerContent [auro-input]:nth-child(2):before{background-color:var(--ds-auro-datepicker-range-input-divider-color)}:host([onDark]){--ds-auro-datepicker-range-input-divider-color: var(--ds-basic-color-border-inverse, #ffffff)}`;
|
|
813
813
|
|
|
814
|
-
var tokensCss$a = i$5`:host{--ds-auro-datepicker-placeholder-color: var(--ds-color-
|
|
814
|
+
var tokensCss$a = i$5`:host{--ds-auro-datepicker-placeholder-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-datepicker-range-input-divider-color: var(--ds-basic-color-border-bold, #585e67);--ds-auro-calendar-mobile-header-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-calendar-mobile-header-divider-color: var(--ds-basic-color-border-divider, rgba(0, 0, 0, 0.15));--ds-auro-calendar-mobile-header-text-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-calendar-nav-btn-border-color: transparent;--ds-auro-calendar-nav-btn-chevron-color: var(--ds-basic-color-brand-primary, #01426a);--ds-auro-calendar-nav-btn-container-color: transparent;--ds-auro-calendar-month-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-calendar-month-divider-color: var(--ds-basic-color-border-divider, rgba(0, 0, 0, 0.15));--ds-auro-calendar-month-header-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-calendar-cell-border-color: transparent;--ds-auro-calendar-cell-container-color: transparent;--ds-auro-calendar-cell-in-range-color: var(--ds-advanced-color-shared-background-muted, #f7f7f7);--ds-auro-calendar-cell-price-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-calendar-cell-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}`;
|
|
815
815
|
|
|
816
816
|
var styleCss$c = i$5`:host{--calendar-width: 336px;--mobile-footer-height: 150px;--mobile-header-height: 68px;height:100vh;height:100dvh}.calendars{display:flex;flex-direction:row}.calendarNavButtons{position:absolute;top:var(--ds-size-200, 1rem);right:var(--ds-size-50, 0.25rem);left:var(--ds-size-50, 0.25rem)}.calendarNavBtn{display:flex;width:var(--ds-size-500, 2.5rem);height:var(--ds-size-500, 2.5rem);align-items:center;justify-content:center;border-width:1px;border-style:solid;border-radius:50%;cursor:pointer}.prevMonth,.nextMonth{position:absolute;top:0}.prevMonth{left:0}.nextMonth{right:0}.headerActions{padding:0 var(--ds-size-200, 1rem)}.mobileHeader{width:100%;height:var(--mobile-header-height);z-index:1;align-items:center;flex-direction:row}.headerDateFrom{display:flex;height:var(--mobile-header-height);flex:1;flex-direction:column;justify-content:center;padding:0 var(--ds-size-150, 0.75rem) 0 var(--ds-size-200, 1rem)}.mobileDateLabel{font-size:var(--ds-text-body-size-xs, 0.75rem)}.headerDateTo{height:calc(var(--mobile-header-height) - var(--ds-size-300, 1.5rem));padding:var(--ds-size-300, 1.5rem) var(--ds-size-100, 0.5rem) 0 var(--ds-size-200, 1rem)}:host(:not([noRange])) .headerDateTo{position:relative;display:flex;flex:1;flex-direction:column;justify-content:center}:host(:not([noRange])) .headerDateTo:after{position:absolute;top:calc(50% + 10px);left:0;display:block;width:1px;height:var(--ds-size-300, 1.5rem);content:"";transform:translateY(-50%)}.mobileFooter{display:none;width:100%;align-items:flex-end;flex-direction:column;justify-content:flex-end}.mobileFooterActions{position:relative;bottom:0;left:50%;display:none;width:calc(100% - var(--ds-size-200, 1rem)*2);align-items:flex-end;flex-direction:column;justify-content:flex-end;padding:var(--ds-size-150) calc(var(--ds-size-200, 1rem));transform:translateX(-50%)}.mobileFooterActions auro-button{width:100%}:host([isfullscreen]){width:100%;max-height:100dvh;overflow:hidden}:host([isfullscreen]) .prevMonth,:host([isfullscreen]) .nextMonth{display:none}:host([isfullscreen]) .mobileHeader,:host([isfullscreen]) .mobileFooter,:host([isfullscreen]) .mobileFooterActions{display:flex}:host([isfullscreen]) .calendarWrapper{display:flex;flex-direction:column}:host([isfullscreen]) .calendars{display:flex;flex-direction:column;flex:1;align-items:center;width:100%;overscroll-behavior:contain}:host([isfullscreen]) .calendars:after{display:block;width:100%;height:var(--mobile-footer-height);content:""}`;
|
|
817
817
|
|
|
818
|
-
var colorCss$c = i$5`.calendarNavBtn{border-color:var(--ds-auro-calendar-nav-btn-border-color);background-color:var(--ds-auro-calendar-nav-btn-container-color);color:var(--ds-auro-calendar-nav-btn-chevron-color)}.calendarNavBtn:hover
|
|
818
|
+
var colorCss$c = i$5`.calendarNavBtn{border-color:var(--ds-auro-calendar-nav-btn-border-color);background-color:var(--ds-auro-calendar-nav-btn-container-color);color:var(--ds-auro-calendar-nav-btn-chevron-color)}.calendarNavBtn:hover{--ds-auro-calendar-nav-btn-container-color: var(--ds-advanced-color-state-background-hover, #f2f2f2);--ds-auro-calendar-nav-btn-border-color: var(--ds-basic-color-brand-primary, #01426a)}.calendarNavBtn:focus{--ds-auro-calendar-nav-btn-border-color: var(--ds-basic-color-brand-primary, #01426a)}.calendarNavBtn:active{--ds-auro-calendar-nav-btn-border-color: var(--ds-basic-color-brand-primary, #01426a);box-shadow:inset 0 0 0 1px var(--ds-auro-calendar-nav-btn-border-color)}.mobileHeader{background-color:var(--ds-auro-calendar-mobile-header-container-color)}.mobileDateLabel{color:var(--ds-auro-calendar-mobile-header-text-color)}:host(:not([noRange])) .headerDateTo:after{background-color:var(--ds-auro-calendar-mobile-header-divider-color)}::slotted([slot="bib.fullscreen.fromStr"]),::slotted([slot=mobileDateToStr]){color:var(--ds-auro-datepicker-placeholder-color)}@media screen and (max-width: 576px){.calendarNavBtn{--ds-auro-calendar-nav-btn-border-color: var(--ds-basic-color-brand-primary, #01426a)}}`;
|
|
819
819
|
|
|
820
|
-
var styleCss$b = i$5
|
|
820
|
+
var styleCss$b = i$5`:focus:not(:focus-visible){outline:3px solid transparent}:host{position:relative;display:block;width:calc(100% - var(--ds-size-200, 1rem) - var(--ds-size-200, 1rem));margin:0 var(--ds-size-200, 1rem)}@media screen and (min-width: 576px){:host{width:336px;padding:var(--ds-size-200, 1rem)}}@media screen and (min-width: 576px){:host(:not(:last-of-type)):after{position:absolute;top:var(--ds-size-200, 1rem);right:calc(-1*var(--ds-size-200, 1rem));height:calc(100% - var(--ds-size-200, 1rem) - var(--ds-size-200, 1rem));display:block;width:1px;content:""}}.header{display:flex;height:var(--ds-size-500, 2.5rem);margin-bottom:var(--ds-size-150, 0.75rem);align-items:center;flex-direction:row;text-align:center}.headerTitle{display:flex;align-items:center;flex:1;flex-direction:row;justify-content:center;font-size:var(--ds-text-heading-400-size, 1.25rem);font-weight:var(--ds-text-heading-400-weight, 300);line-height:var(--ds-text-heading-400-height, 1.625rem)}.headerTitle div:first-child{margin-right:var(--ds-size-100, 0.5rem)}.calendarNavBtn{position:relative;display:flex;width:var(--ds-size-500, 2.5rem);height:var(--ds-size-500, 2.5rem);align-items:center;justify-content:center;border-width:1px;border-style:solid;border-radius:50%;cursor:pointer}.table{width:100%;border-collapse:collapse}.thead{margin-bottom:var(--ds-size-100, 0.5rem)}.th{display:flex;flex:1;align-items:center;justify-content:center;font-weight:700}.tbody{width:100%;transition:all 0ms;transform:translateX(0)}@media screen and (min-width: 576px){.tbody{height:384px}}.td{flex:1;margin:0;padding:0}.tr{display:flex;flex-direction:row;width:100%}`;
|
|
821
821
|
|
|
822
|
-
var colorCss$b = i$5
|
|
822
|
+
var colorCss$b = i$5`:focus:not(:focus-visible){outline:3px solid transparent}:host{background-color:var(--ds-auro-calendar-month-container-color)}@media screen and (min-width: 576px){:host(:not(:last-of-type)):after{background-color:var(--ds-auro-calendar-month-divider-color)}}.header{color:var(--ds-auro-calendar-month-header-color)}`;
|
|
823
823
|
|
|
824
824
|
/******************************************************************************
|
|
825
825
|
Copyright (c) Microsoft Corporation.
|
|
@@ -6811,7 +6811,7 @@ __decorate([n({ type: Array })], RangeDatepickerCell.prototype, "disabledDays",
|
|
|
6811
6811
|
__decorate([n({ type: String })], RangeDatepickerCell.prototype, "hoveredDate", void 0);
|
|
6812
6812
|
__decorate([n({ type: Boolean })], RangeDatepickerCell.prototype, "isCurrentDate", void 0);
|
|
6813
6813
|
__decorate([n({ type: Object })], RangeDatepickerCell.prototype, "locale", null);
|
|
6814
|
-
AuroLibraryRuntimeUtils$
|
|
6814
|
+
AuroLibraryRuntimeUtils$4.prototype.registerComponent('wc-range-datepicker-cell', RangeDatepickerCell);
|
|
6815
6815
|
|
|
6816
6816
|
class Day {
|
|
6817
6817
|
constructor(date) {
|
|
@@ -7329,7 +7329,7 @@ __decorate([n({ type: Array })], RangeDatepickerCalendar.prototype, "yearsList",
|
|
|
7329
7329
|
__decorate([n({ type: Array })], RangeDatepickerCalendar.prototype, "monthsList", void 0);
|
|
7330
7330
|
__decorate([n({ type: Array })], RangeDatepickerCalendar.prototype, "dayNamesOfTheWeek", void 0);
|
|
7331
7331
|
__decorate([n({ type: Array })], RangeDatepickerCalendar.prototype, "daysOfMonth", void 0);
|
|
7332
|
-
AuroLibraryRuntimeUtils$
|
|
7332
|
+
AuroLibraryRuntimeUtils$4.prototype.registerComponent('wc-range-datepicker-calendar', RangeDatepickerCalendar);
|
|
7333
7333
|
|
|
7334
7334
|
/**
|
|
7335
7335
|
* @license
|
|
@@ -7346,7 +7346,7 @@ const t$1={ATTRIBUTE:1,CHILD:2},e$1=t=>(...e)=>({_$litDirective$:t,values:e});cl
|
|
|
7346
7346
|
|
|
7347
7347
|
var styleCss$a = i$5`@media screen and (max-width: 576px){:host{display:flex;justify-content:center}}.day{position:relative;width:var(--ds-size-500, 2.5rem);height:calc(var(--ds-size-700, 3.5rem) - 2px);padding:0;border-width:1px;border-style:solid;border-radius:var(--ds-size-300, 1.5rem);cursor:pointer;font-family:var(--ds-font-family-default, "AS Circular", Helvetica Neue, Arial, sans-serif);font-size:var(--ds-text-body-size-default, 1rem);user-select:none}.day.disabled{cursor:default !important}.day.inRange::before{position:absolute;z-index:-1;top:50%;left:50%;display:block;width:14.2857142857vw;height:var(--ds-size-600, 3rem);content:"";transform:translate(-50%, -50%)}@media screen and (min-width: 576px){.day.inRange::before{width:var(--ds-size-600, 3rem)}}.day.rangeDepartDate::before{position:absolute;z-index:-1;top:50%;left:50%;display:block;width:14.2857142857vw;height:var(--ds-size-600, 3rem);content:"";transform:translate(-50%, -50%);width:7.1428571429vw;transform:translate(0%, -50%)}@media screen and (min-width: 576px){.day.rangeDepartDate::before{width:calc(var(--ds-size-600, 3rem)/2)}}.day.rangeReturnDate::before,.day.lastHoveredDate::before{position:absolute;z-index:-1;top:50%;left:50%;display:block;width:14.2857142857vw;height:var(--ds-size-600, 3rem);content:"";transform:translate(-50%, -50%);width:7.1428571429vw;transform:translate(-100%, -50%)}@media screen and (min-width: 576px){.day.rangeReturnDate::before,.day.lastHoveredDate::before{width:calc(var(--ds-size-600, 3rem)/2)}}.dateSlot{display:flex;flex-direction:column;font-size:var(--ds-text-body-size-xxs, 0.625rem)}::slotted([slot^=date_]){position:absolute;top:80%;left:50%;width:80%;overflow:hidden;white-space:nowrap;transform:translate(-50%, -50%)}::slotted(auro-icon){max-height:24px;max-width:24px}:host([renderForDateSlot]) .buttonWrapper{position:relative;width:100%;top:5px}:host([renderForDateSlot]) .currentDayMarker{position:relative;padding-bottom:5px;top:-8px}@media screen and (min-width: 576px){.day{width:var(--ds-size-600, 3rem);height:var(--ds-size-800, 4rem);font-size:var(--ds-text-body-size-lg, 1.125rem)}.day:hover{cursor:pointer}.dateSlot{font-size:var(--ds-text-body-size-xs, 0.75rem)}}`;
|
|
7348
7348
|
|
|
7349
|
-
var colorCss$a = i$5`:host ::slotted([slot^=date_]){color:var(--ds-auro-calendar-cell-price-text-color)}:host ::slotted([slot^=date_][highlight]){--ds-auro-calendar-cell-price-text-color: var(--ds-color-
|
|
7349
|
+
var colorCss$a = i$5`:host ::slotted([slot^=date_]){color:var(--ds-auro-calendar-cell-price-text-color)}:host ::slotted([slot^=date_][highlight]){--ds-auro-calendar-cell-price-text-color: var(--ds-basic-color-status-success, #447a1f)}:host .day{border-color:var(--ds-auro-calendar-cell-border-color);background-color:var(--ds-auro-calendar-cell-container-color);color:var(--ds-auro-calendar-cell-text-color)}:host .day.selected{--ds-auro-calendar-cell-container-color: var(--ds-advanced-color-state-selected, #01426a);--ds-auro-calendar-cell-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-calendar-cell-price-text-color: var(--ds-basic-color-texticon-inverse, #ffffff)}:host .day.selected ::slotted([slot^=date_][highlight]){--ds-auro-calendar-cell-price-text-color: var(--ds-basic-color-status-success-subtle, #d6eac7)}:host .day.selected:hover{--ds-auro-calendar-cell-container-color: var(--ds-advanced-color-state-selected-hover, #00274a);--ds-auro-calendar-cell-text-color: var(--ds-basic-color-texticon-inverse, #ffffff)}:host .day:hover{--ds-auro-calendar-cell-container-color: var(--ds-advanced-color-state-background-hover, #f2f2f2);--ds-auro-calendar-cell-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}:host .day.disabled{--ds-auro-calendar-cell-container-color: transparent;--ds-auro-calendar-cell-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0);--ds-auro-calendar-cell-price-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host .day.inRange:before,:host .day.rangeDepartDate:before,:host .day.rangeReturnDate:before,:host .day.lastHoveredDate:before{background-color:var(--ds-auro-calendar-cell-in-range-color)}:host .day.sameDateTrip:before{--ds-auro-calendar-cell-in-range-color: transparent}`;
|
|
7350
7350
|
|
|
7351
7351
|
var styleCss$9 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([addSpace]) :host(:not([data-show])) .popover,:host(:not([data-show])) .popover,:host([disabled]) .popover{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.util_insetNone{padding:0}.util_insetXxxs{padding:.125rem}.util_insetXxxs--stretch{padding:.25rem .125rem}.util_insetXxxs--squish{padding:0 .125rem}.util_insetXxs{padding:.25rem}.util_insetXxs--stretch{padding:.375rem .25rem}.util_insetXxs--squish{padding:.125rem .25rem}.util_insetXs{padding:.5rem}.util_insetXs--stretch{padding:.75rem .5rem}.util_insetXs--squish{padding:.25rem .5rem}.util_insetSm{padding:.75rem}.util_insetSm--stretch{padding:1.125rem .75rem}.util_insetSm--squish{padding:.375rem .75rem}.util_insetMd{padding:1rem}.util_insetMd--stretch{padding:1.5rem 1rem}.util_insetMd--squish{padding:.5rem 1rem}.util_insetLg{padding:1.5rem}.util_insetLg--stretch{padding:2.25rem 1.5rem}.util_insetLg--squish{padding:.75rem 1.5rem}.util_insetXl{padding:2rem}.util_insetXl--stretch{padding:3rem 2rem}.util_insetXl--squish{padding:1rem 2rem}.util_insetXxl{padding:3rem}.util_insetXxl--stretch{padding:4.5rem 3rem}.util_insetXxl--squish{padding:1.5rem 3rem}.util_insetXxxl{padding:4rem}.util_insetXxxl--stretch{padding:6rem 4rem}.util_insetXxxl--squish{padding:2rem 4rem}::slotted(*){white-space:normal}::slotted(*:hover){cursor:pointer}[data-trigger-placement]::slotted(*:hover){position:relative}[data-trigger-placement]::slotted(*:hover):before{position:absolute;left:0;display:block;width:100%;height:calc(var(--ds-size-200, 1rem) + var(--ds-size-50, 0.25rem));content:""}[data-trigger-placement^=top]::slotted(*:hover):before{top:calc(-1*(var(--ds-size-200, 1rem) + var(--ds-size-50, 0.25rem)))}[data-trigger-placement^=bottom]::slotted(*:hover):before{bottom:calc(-1*(var(--ds-size-200, 1rem) + var(--ds-size-50, 0.25rem)))}:host([data-show]) .popover{z-index:var(--ds-depth-tooltip, 400)}:host([removeSpace]) .popover{margin:calc(-1*(var(--ds-size-50, 0.25rem) + 1px)) 0 !important}:host([addSpace]) .popover{margin:var(--ds-size-200, 1rem) 0 !important}:host([addSpace]) [data-trigger-placement]::slotted(*:hover):before{height:var(--ds-size-500, 2.5rem)}:host([addSpace]) [data-trigger-placement^=top]::slotted(*:hover):before{top:calc(-1*var(--ds-size-500, 2.5rem))}:host([addSpace]) [data-trigger-placement^=bottom]::slotted(*:hover):before{bottom:calc(-1*var(--ds-size-500, 2.5rem))}.popover{display:inline-block;max-width:calc(100% - var(--ds-size-400, 2rem));border-radius:var(--ds-border-radius, 0.375rem)}@media screen and (min-width: 576px){.popover{max-width:50%}}@media screen and (min-width: 768px){.popover{max-width:40%}}@media screen and (min-width: 1024px){.popover{max-width:27rem}}[data-popper-placement^=top]>.arrow{bottom:calc(-1*(var(--ds-size-100, 0.5rem) + var(--ds-size-25, 0.125rem)))}[data-popper-placement^=top]>.arrow:before{top:calc(-1*var(--ds-size-200, 1rem));left:calc(-1*var(--ds-size-75, 0.375rem));transform:rotate(45deg)}[data-popper-placement^=bottom]>.arrow{top:calc(-1*(var(--ds-size-100, 0.5rem) + var(--ds-size-25, 0.125rem)))}[data-popper-placement^=bottom]>.arrow:before{top:var(--ds-size-50, 0.25rem);right:calc(-1*var(--ds-size-200, 1rem));transform:rotate(-135deg)}.arrow{position:relative;margin-top:-var(--ds-size-100, 0.5rem)}.arrow:before{position:absolute;width:var(--ds-size-150, 0.75rem);height:var(--ds-size-150, 0.75rem);content:""}`;
|
|
7352
7352
|
|
|
@@ -9243,7 +9243,7 @@ class AuroPopover extends r$2 {
|
|
|
9243
9243
|
privateDefaults() {
|
|
9244
9244
|
this.isPopoverVisible = false;
|
|
9245
9245
|
this.id = `popover-${(Math.random() + 1).toString(36).substring(7)}`;
|
|
9246
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
9246
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$4();
|
|
9247
9247
|
}
|
|
9248
9248
|
|
|
9249
9249
|
// function to define props used within the scope of this component
|
|
@@ -9273,7 +9273,7 @@ class AuroPopover extends r$2 {
|
|
|
9273
9273
|
*
|
|
9274
9274
|
*/
|
|
9275
9275
|
static register(name = "auro-popover") {
|
|
9276
|
-
AuroLibraryRuntimeUtils$
|
|
9276
|
+
AuroLibraryRuntimeUtils$4.prototype.registerComponent(name, AuroPopover);
|
|
9277
9277
|
}
|
|
9278
9278
|
|
|
9279
9279
|
connectedCallback() {
|
|
@@ -9441,12 +9441,12 @@ class AuroCalendarCell extends r$2 {
|
|
|
9441
9441
|
this.dateStr = null;
|
|
9442
9442
|
this.renderForDateSlot = false; // When false, the numerical date will render vertically centered. When true, the date will render off-center to the top and leave room below for the slot content.
|
|
9443
9443
|
|
|
9444
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
9444
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$4();
|
|
9445
9445
|
|
|
9446
9446
|
/**
|
|
9447
9447
|
* Generate unique names for dependency components.
|
|
9448
9448
|
*/
|
|
9449
|
-
const versioning = new AuroDependencyVersioning$
|
|
9449
|
+
const versioning = new AuroDependencyVersioning$3();
|
|
9450
9450
|
this.popoverTag = versioning.generateTag('auro-formkit-datepicker-popover', popoverVersion, AuroPopover);
|
|
9451
9451
|
}
|
|
9452
9452
|
|
|
@@ -9464,7 +9464,10 @@ class AuroCalendarCell extends r$2 {
|
|
|
9464
9464
|
month: { type: String },
|
|
9465
9465
|
min: { type: Number },
|
|
9466
9466
|
max: { type: Number },
|
|
9467
|
-
disabled: {
|
|
9467
|
+
disabled: {
|
|
9468
|
+
type: Boolean,
|
|
9469
|
+
reflect: true
|
|
9470
|
+
},
|
|
9468
9471
|
disabledDays: { type: Array },
|
|
9469
9472
|
hoveredDate: { type: String },
|
|
9470
9473
|
isCurrentDate: { type: Boolean },
|
|
@@ -9805,7 +9808,8 @@ class AuroCalendarMonth extends RangeDatepickerCalendar {
|
|
|
9805
9808
|
* @private
|
|
9806
9809
|
*/
|
|
9807
9810
|
monthFirst: {
|
|
9808
|
-
type: Boolean
|
|
9811
|
+
type: Boolean,
|
|
9812
|
+
reflect: true
|
|
9809
9813
|
}
|
|
9810
9814
|
};
|
|
9811
9815
|
}
|
|
@@ -10343,9 +10347,9 @@ class CalendarUtilities {
|
|
|
10343
10347
|
|
|
10344
10348
|
var colorCss$1$2 = i$5`#headerContainer{box-shadow:var(--ds-auro-dropdownbib-header-boxshadow-color)}#footerContainer{background-color:var(--ds-auro-dropdownbib-footer-container-color)}`;
|
|
10345
10349
|
|
|
10346
|
-
var styleCss$2$2 = i$5`#bibTemplate{display:flex;overflow:hidden;height:100%;max-height:100%;flex-direction:column}#headerContainer{display:flex;flex-direction:column}#header{display:flex;width:100%;min-height:var(--ds-size-1000, 5rem);box-sizing:border-box;align-items:end;padding-top:var(--ds-size-400, 2rem);padding-right:var(--ds-size-700, 3.5rem);padding-left:var(--ds-size-200, 1rem);pointer-events:none}#subheader{width:100%}#subheader ::slotted([auro-input]){padding:0 var(--ds-size-200, 1rem)}#closeButton{position:absolute;top:var(--ds-size-400, 2rem);right:var(--ds-size-200, 1rem);border:none;background-color:transparent;cursor:pointer}#closeButton [auro-icon]{--ds-auro-icon-size: var(--ds-size-500,
|
|
10350
|
+
var styleCss$2$2 = i$5`#bibTemplate{display:flex;overflow:hidden;height:100%;max-height:100%;flex-direction:column}#headerContainer{display:flex;flex-direction:column}#header{display:flex;width:100%;min-height:var(--ds-size-1000, 5rem);box-sizing:border-box;align-items:end;padding-top:var(--ds-size-400, 2rem);padding-right:var(--ds-size-700, 3.5rem);padding-left:var(--ds-size-200, 1rem);pointer-events:none}#subheader{width:100%}#subheader ::slotted([auro-input]){padding:0 var(--ds-size-200, 1rem)}#closeButton{position:absolute;top:var(--ds-size-400, 2rem);right:var(--ds-size-200, 1rem);border:none;background-color:transparent;cursor:pointer}#closeButton [auro-icon]{--ds-auro-icon-size: var(--ds-size-500, 2.5rem)}#bodyContainer{position:relative;overflow:auto;flex:1 1 100%}:host([isfullscreen]) #bibTemplate{max-height:100dvh}:host([isfullscreen]) #bodyContainer{margin-top:var(--ds-size-100, 0.5rem)}#footerContainer{position:absolute;right:0;bottom:0;left:0;padding:var(--ds-size-200, 1rem)}`;
|
|
10347
10351
|
|
|
10348
|
-
var tokenCss = i$5`:host{--ds-auro-dropdownbib-header-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-footer-container-color: var(--ds-color-
|
|
10352
|
+
var tokenCss = i$5`:host{--ds-auro-dropdownbib-header-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-footer-container-color: var(--ds-basic-color-surface-default, #ffffff)}`;
|
|
10349
10353
|
|
|
10350
10354
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
10351
10355
|
// See LICENSE in the project root for license information.
|
|
@@ -10354,7 +10358,7 @@ var tokenCss = i$5`:host{--ds-auro-dropdownbib-header-boxshadow-color: var(--ds-
|
|
|
10354
10358
|
|
|
10355
10359
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
10356
10360
|
|
|
10357
|
-
let AuroLibraryRuntimeUtils$
|
|
10361
|
+
let AuroLibraryRuntimeUtils$1$2 = class AuroLibraryRuntimeUtils {
|
|
10358
10362
|
|
|
10359
10363
|
/* eslint-disable jsdoc/require-param */
|
|
10360
10364
|
|
|
@@ -10421,7 +10425,7 @@ let AuroLibraryRuntimeUtils$2$2 = class AuroLibraryRuntimeUtils {
|
|
|
10421
10425
|
// See LICENSE in the project root for license information.
|
|
10422
10426
|
|
|
10423
10427
|
|
|
10424
|
-
let AuroDependencyVersioning$
|
|
10428
|
+
let AuroDependencyVersioning$2 = class AuroDependencyVersioning {
|
|
10425
10429
|
|
|
10426
10430
|
/**
|
|
10427
10431
|
* Generates a unique string to be used for child auro element naming.
|
|
@@ -10523,7 +10527,7 @@ const cacheFetch$2 = (uri, options = {}) => {
|
|
|
10523
10527
|
return _fetchMap$2.get(uri);
|
|
10524
10528
|
};
|
|
10525
10529
|
|
|
10526
|
-
var styleCss$1$2 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.ico_squareLarge{fill:currentColor;height:var(--auro-size-lg, var(--ds-size-300, 1.5rem))}.ico_squareSmall{fill:currentColor;height:.6rem}.ico_squareMed{fill:currentColor;height:var(--auro-size-md, var(--ds-size-200, 1rem))}.ico_squareSml{fill:currentColor;height:var(--auro-size-sm, var(--ds-size-150, 0.75rem))}:host{color:currentColor;vertical-align:middle;line-height:1;display:inline-block}
|
|
10530
|
+
var styleCss$1$2 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.ico_squareLarge{fill:currentColor;height:var(--auro-size-lg, var(--ds-size-300, 1.5rem))}.ico_squareSmall{fill:currentColor;height:.6rem}.ico_squareMed{fill:currentColor;height:var(--auro-size-md, var(--ds-size-200, 1rem))}.ico_squareSml{fill:currentColor;height:var(--auro-size-sm, var(--ds-size-150, 0.75rem))}:host{color:currentColor;vertical-align:middle;line-height:1;display:inline-block}svg{min-width:var(--ds-auro-icon-size, 1.5rem) !important;width:var(--ds-auro-icon-size, 1.5rem) !important;height:var(--ds-auro-icon-size, 1.5rem) !important}.componentWrapper{display:flex}.svgWrapper{height:var(--ds-auro-icon-size);width:var(--ds-auro-icon-size)}.labelWrapper{margin-left:var(--ds-size-50, 0.25rem);line-height:1.8}`;
|
|
10527
10531
|
|
|
10528
10532
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
10529
10533
|
// See LICENSE in the project root for license information.
|
|
@@ -10531,7 +10535,6 @@ var styleCss$1$2 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}
|
|
|
10531
10535
|
|
|
10532
10536
|
// See https://git.io/JJ6SJ for "How to document your components using JSDoc"
|
|
10533
10537
|
/**
|
|
10534
|
-
* @attr {Boolean} onDark - Set value for on-dark version of auro-icon
|
|
10535
10538
|
* @slot - Hidden from visibility, used for a11y if icon description is needed
|
|
10536
10539
|
*/
|
|
10537
10540
|
|
|
@@ -10546,6 +10549,10 @@ let BaseIcon$2 = class BaseIcon extends AuroElement$2 {
|
|
|
10546
10549
|
static get properties() {
|
|
10547
10550
|
return {
|
|
10548
10551
|
...super.properties,
|
|
10552
|
+
|
|
10553
|
+
/**
|
|
10554
|
+
* Set value for on-dark version of auro-icon.
|
|
10555
|
+
*/
|
|
10549
10556
|
onDark: {
|
|
10550
10557
|
type: Boolean,
|
|
10551
10558
|
reflect: true
|
|
@@ -10604,81 +10611,11 @@ let BaseIcon$2 = class BaseIcon extends AuroElement$2 {
|
|
|
10604
10611
|
}
|
|
10605
10612
|
};
|
|
10606
10613
|
|
|
10607
|
-
var tokensCss$8 = i$5`:host{--ds-auro-icon-color:var(--ds-color-
|
|
10608
|
-
|
|
10609
|
-
var colorCss$8 = i$5`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[accent]){--ds-auro-icon-color:var(--ds-color-icon-accent-default, #a2c270)}:host(:not([onDark])[disabled]){--ds-auro-icon-color:var(--ds-color-icon-ui-primary-disabled-default, #adadad)}:host(:not([onDark])[emphasis]){--ds-auro-icon-color:var(--ds-color-icon-emphasis-default, #2a2a2a)}:host(:not([onDark])[error]){--ds-auro-icon-color:var(--ds-color-icon-error-default, #cc1816)}:host(:not([onDark])[info]){--ds-auro-icon-color:var(--ds-color-icon-info-default, #326aa5)}:host(:not([onDark])[secondary]){--ds-auro-icon-color:var(--ds-color-icon-secondary-default, #7e8894)}:host(:not([onDark])[subtle]){--ds-auro-icon-color:var(--ds-color-icon-subtle-default, #a0c9f1)}:host(:not([onDark])[success]){--ds-auro-icon-color:var(--ds-color-icon-success-default, #40a080)}:host(:not([onDark])[tertiary]){--ds-auro-icon-color:var(--ds-color-icon-tertiary-default, #afb9c6)}:host(:not([onDark])[warning]){--ds-auro-icon-color:var(--ds-color-icon-warning-default, #c49432)}:host([onDark]){--ds-auro-icon-color:var(--ds-color-icon-primary-inverse, #f7f7f7)}:host([onDark][accent]){--ds-auro-icon-color:var(--ds-color-icon-accent-inverse, #badd81)}:host([onDark][disabled]){--ds-auro-icon-color:var(--ds-color-icon-ui-primary-disabled-inverse, #7e7e7e)}:host([onDark][emphasis]){--ds-auro-icon-color:var(--ds-color-icon-emphasis-inverse, #ffffff)}:host([onDark][error]){--ds-auro-icon-color:var(--ds-color-icon-error-inverse, #f9aca6)}:host([onDark][info]){--ds-auro-icon-color:var(--ds-color-icon-info-inverse, #89b2d4)}:host([onDark][secondary]){--ds-auro-icon-color:var(--ds-color-icon-secondary-inverse, #ccd2db)}:host([onDark][subtle]){--ds-auro-icon-color:var(--ds-color-icon-subtle-inverse, #326aa5)}:host([onDark][success]){--ds-auro-icon-color:var(--ds-color-icon-success-inverse, #8eceb9)}:host([onDark][tertiary]){--ds-auro-icon-color:var(--ds-color-icon-tertiary-inverse, #939fad)}:host([onDark][warning]){--ds-auro-icon-color:var(--ds-color-icon-warning-inverse, #f2c153)}`;
|
|
10610
|
-
|
|
10611
|
-
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
10612
|
-
// See LICENSE in the project root for license information.
|
|
10613
|
-
|
|
10614
|
-
// ---------------------------------------------------------------------
|
|
10615
|
-
|
|
10616
|
-
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
10617
|
-
|
|
10618
|
-
let AuroLibraryRuntimeUtils$1$2 = class AuroLibraryRuntimeUtils {
|
|
10619
|
-
|
|
10620
|
-
/* eslint-disable jsdoc/require-param */
|
|
10621
|
-
|
|
10622
|
-
/**
|
|
10623
|
-
* This will register a new custom element with the browser.
|
|
10624
|
-
* @param {String} name - The name of the custom element.
|
|
10625
|
-
* @param {Object} componentClass - The class to register as a custom element.
|
|
10626
|
-
* @returns {void}
|
|
10627
|
-
*/
|
|
10628
|
-
registerComponent(name, componentClass) {
|
|
10629
|
-
if (!customElements.get(name)) {
|
|
10630
|
-
customElements.define(name, class extends componentClass {});
|
|
10631
|
-
}
|
|
10632
|
-
}
|
|
10633
|
-
|
|
10634
|
-
/**
|
|
10635
|
-
* Finds and returns the closest HTML Element based on a selector.
|
|
10636
|
-
* @returns {void}
|
|
10637
|
-
*/
|
|
10638
|
-
closestElement(
|
|
10639
|
-
selector, // selector like in .closest()
|
|
10640
|
-
base = this, // extra functionality to skip a parent
|
|
10641
|
-
__Closest = (el, found = el && el.closest(selector)) =>
|
|
10642
|
-
!el || el === document || el === window
|
|
10643
|
-
? null // standard .closest() returns null for non-found selectors also
|
|
10644
|
-
: found
|
|
10645
|
-
? found // found a selector INside this element
|
|
10646
|
-
: __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
|
|
10647
|
-
) {
|
|
10648
|
-
return __Closest(base);
|
|
10649
|
-
}
|
|
10650
|
-
/* eslint-enable jsdoc/require-param */
|
|
10651
|
-
|
|
10652
|
-
/**
|
|
10653
|
-
* 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.
|
|
10654
|
-
* @param {Object} elem - The element to check.
|
|
10655
|
-
* @param {String} tagName - The name of the Auro component to check for or add as an attribute.
|
|
10656
|
-
* @returns {void}
|
|
10657
|
-
*/
|
|
10658
|
-
handleComponentTagRename(elem, tagName) {
|
|
10659
|
-
const tag = tagName.toLowerCase();
|
|
10660
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
10661
|
-
|
|
10662
|
-
if (elemTag !== tag) {
|
|
10663
|
-
elem.setAttribute(tag, true);
|
|
10664
|
-
}
|
|
10665
|
-
}
|
|
10666
|
-
|
|
10667
|
-
/**
|
|
10668
|
-
* Validates if an element is a specific Auro component.
|
|
10669
|
-
* @param {Object} elem - The element to validate.
|
|
10670
|
-
* @param {String} tagName - The name of the Auro component to check against.
|
|
10671
|
-
* @returns {Boolean} - Returns true if the element is the specified Auro component.
|
|
10672
|
-
*/
|
|
10673
|
-
elementMatch(elem, tagName) {
|
|
10674
|
-
const tag = tagName.toLowerCase();
|
|
10675
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
10614
|
+
var tokensCss$8 = i$5`:host{--ds-auro-icon-color:var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-alaska-color:#02426D;--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}`;
|
|
10676
10615
|
|
|
10677
|
-
|
|
10678
|
-
}
|
|
10679
|
-
};
|
|
10616
|
+
var colorCss$8 = i$5`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[variant=accent1]){--ds-auro-icon-color:var(--ds-basic-color-texticon-accent1, #265688)}:host(:not([onDark])[variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:not([onDark])[variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-muted, #676767)}:host(:not([onDark])[variant=statusDefault]){--ds-auro-icon-color:var(--ds-basic-color-status-default, #afb9c6)}:host(:not([onDark])[variant=statusInfo]){--ds-auro-icon-color:var(--ds-basic-color-status-info, #01426a)}:host(:not([onDark])[variant=statusSuccess]){--ds-auro-icon-color:var(--ds-basic-color-status-success, #447a1f)}:host(:not([onDark])[variant=statusWarning]){--ds-auro-icon-color:var(--ds-basic-color-status-warning, #fac200)}:host(:not([onDark])[variant=statusError]){--ds-auro-icon-color:var(--ds-basic-color-status-error, #e31f26)}:host(:not([onDark])[variant=statusInfoSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-info-subtle, #ebf3f9)}:host(:not([onDark])[variant=statusSuccessSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-success-subtle, #d6eac7)}:host(:not([onDark])[variant=statusWarningSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-warning-subtle, #fff0b2)}:host(:not([onDark])[variant=statusErrorSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-error-subtle, #fbc6c6)}:host(:not([onDark])[variant=fareBasicEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-basiceconomy, #97eaf8)}:host(:not([onDark])[variant=fareBusiness]){--ds-auro-icon-color:var(--ds-basic-color-fare-business, #01426a)}:host(:not([onDark])[variant=fareEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-economy, #0074ca)}:host(:not([onDark])[variant=fareFirst]){--ds-auro-icon-color:var(--ds-basic-color-fare-first, #00274a)}:host(:not([onDark])[variant=farePremiumEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-premiumeconomy, #005154)}:host(:not([onDark])[variant=fareOneWorldEmerald]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-emerald, #139142)}:host(:not([onDark])[variant=fareOneWorldSapphire]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-sapphire, #015daa)}:host(:not([onDark])[variant=fareOneWorldRuby]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-ruby, #a41d4a)}:host([onDark]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse, #ffffff)}:host([onDark][variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([onDark][variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}`;
|
|
10680
10617
|
|
|
10681
|
-
// Copyright (c)
|
|
10618
|
+
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
10682
10619
|
// See LICENSE in the project root for license information.
|
|
10683
10620
|
|
|
10684
10621
|
|
|
@@ -10686,6 +10623,7 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
|
|
|
10686
10623
|
constructor() {
|
|
10687
10624
|
super();
|
|
10688
10625
|
|
|
10626
|
+
this.variant = undefined;
|
|
10689
10627
|
this.privateDefaults();
|
|
10690
10628
|
}
|
|
10691
10629
|
|
|
@@ -10695,20 +10633,6 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
|
|
|
10695
10633
|
* @returns {void}
|
|
10696
10634
|
*/
|
|
10697
10635
|
privateDefaults() {
|
|
10698
|
-
this.accent = false;
|
|
10699
|
-
this.customColor = false;
|
|
10700
|
-
this.customSvg = false;
|
|
10701
|
-
this.disabled = false;
|
|
10702
|
-
this.emphasis = false;
|
|
10703
|
-
this.error = false;
|
|
10704
|
-
this.info = false;
|
|
10705
|
-
this.label = false;
|
|
10706
|
-
this.primary = false;
|
|
10707
|
-
this.secondary = false;
|
|
10708
|
-
this.subtle = false;
|
|
10709
|
-
this.success = false;
|
|
10710
|
-
this.tertiary = false;
|
|
10711
|
-
this.warning = false;
|
|
10712
10636
|
this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
|
|
10713
10637
|
this.runtimeUtils = new AuroLibraryRuntimeUtils$1$2();
|
|
10714
10638
|
}
|
|
@@ -10718,14 +10642,6 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
|
|
|
10718
10642
|
return {
|
|
10719
10643
|
...super.properties,
|
|
10720
10644
|
|
|
10721
|
-
/**
|
|
10722
|
-
* Sets the icon to use the accent style.
|
|
10723
|
-
*/
|
|
10724
|
-
accent: {
|
|
10725
|
-
type: Boolean,
|
|
10726
|
-
reflect: true
|
|
10727
|
-
},
|
|
10728
|
-
|
|
10729
10645
|
/**
|
|
10730
10646
|
* Set aria-hidden value. Default is `true`. Option is `false`.
|
|
10731
10647
|
*/
|
|
@@ -10756,38 +10672,6 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
|
|
|
10756
10672
|
type: Boolean
|
|
10757
10673
|
},
|
|
10758
10674
|
|
|
10759
|
-
/**
|
|
10760
|
-
* Sets the icon to use the disabled style.
|
|
10761
|
-
*/
|
|
10762
|
-
disabled: {
|
|
10763
|
-
type: Boolean,
|
|
10764
|
-
reflect: true
|
|
10765
|
-
},
|
|
10766
|
-
|
|
10767
|
-
/**
|
|
10768
|
-
* Sets the icon to use the emphasis style.
|
|
10769
|
-
*/
|
|
10770
|
-
emphasis: {
|
|
10771
|
-
type: Boolean,
|
|
10772
|
-
reflect: true
|
|
10773
|
-
},
|
|
10774
|
-
|
|
10775
|
-
/**
|
|
10776
|
-
* Sets the icon to use the error style.
|
|
10777
|
-
*/
|
|
10778
|
-
error: {
|
|
10779
|
-
type: Boolean,
|
|
10780
|
-
reflect: true
|
|
10781
|
-
},
|
|
10782
|
-
|
|
10783
|
-
/**
|
|
10784
|
-
* Sets the icon to use the info style.
|
|
10785
|
-
*/
|
|
10786
|
-
info: {
|
|
10787
|
-
type: Boolean,
|
|
10788
|
-
reflect: true
|
|
10789
|
-
},
|
|
10790
|
-
|
|
10791
10675
|
/**
|
|
10792
10676
|
* Exposes content in slot as icon label.
|
|
10793
10677
|
*/
|
|
@@ -10805,50 +10689,10 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
|
|
|
10805
10689
|
},
|
|
10806
10690
|
|
|
10807
10691
|
/**
|
|
10808
|
-
*
|
|
10809
|
-
*/
|
|
10810
|
-
primary: {
|
|
10811
|
-
type: Boolean,
|
|
10812
|
-
reflect: true
|
|
10813
|
-
},
|
|
10814
|
-
|
|
10815
|
-
/**
|
|
10816
|
-
* Sets the icon to use the secondary style.
|
|
10817
|
-
*/
|
|
10818
|
-
secondary: {
|
|
10819
|
-
type: Boolean,
|
|
10820
|
-
reflect: true
|
|
10821
|
-
},
|
|
10822
|
-
|
|
10823
|
-
/**
|
|
10824
|
-
* Sets the icon to use the subtle style.
|
|
10825
|
-
*/
|
|
10826
|
-
subtle: {
|
|
10827
|
-
type: Boolean,
|
|
10828
|
-
reflect: true
|
|
10829
|
-
},
|
|
10830
|
-
|
|
10831
|
-
/**
|
|
10832
|
-
* Sets the icon to use the success style.
|
|
10833
|
-
*/
|
|
10834
|
-
success: {
|
|
10835
|
-
type: Boolean,
|
|
10836
|
-
reflect: true
|
|
10837
|
-
},
|
|
10838
|
-
|
|
10839
|
-
/**
|
|
10840
|
-
* Sets the icon to use the tertiary style.
|
|
10841
|
-
*/
|
|
10842
|
-
tertiary: {
|
|
10843
|
-
type: Boolean,
|
|
10844
|
-
reflect: true
|
|
10845
|
-
},
|
|
10846
|
-
|
|
10847
|
-
/**
|
|
10848
|
-
* Sets the icon to use the warning style.
|
|
10692
|
+
* 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`.
|
|
10849
10693
|
*/
|
|
10850
|
-
|
|
10851
|
-
type:
|
|
10694
|
+
variant: {
|
|
10695
|
+
type: String,
|
|
10852
10696
|
reflect: true
|
|
10853
10697
|
}
|
|
10854
10698
|
};
|
|
@@ -10938,7 +10782,7 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
|
|
|
10938
10782
|
}
|
|
10939
10783
|
};
|
|
10940
10784
|
|
|
10941
|
-
var iconVersion$2 = '
|
|
10785
|
+
var iconVersion$2 = '8.0.1';
|
|
10942
10786
|
|
|
10943
10787
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
10944
10788
|
// See LICENSE in the project root for license information.
|
|
@@ -10947,7 +10791,7 @@ var iconVersion$2 = '7.0.1';
|
|
|
10947
10791
|
|
|
10948
10792
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
10949
10793
|
|
|
10950
|
-
let AuroLibraryRuntimeUtils$
|
|
10794
|
+
let AuroLibraryRuntimeUtils$3 = class AuroLibraryRuntimeUtils {
|
|
10951
10795
|
|
|
10952
10796
|
/* eslint-disable jsdoc/require-param */
|
|
10953
10797
|
|
|
@@ -11039,7 +10883,7 @@ class AuroHeader extends r$2 {
|
|
|
11039
10883
|
/**
|
|
11040
10884
|
* @private
|
|
11041
10885
|
*/
|
|
11042
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
10886
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$3();
|
|
11043
10887
|
}
|
|
11044
10888
|
|
|
11045
10889
|
// function to define props used within the scope of this component
|
|
@@ -11069,7 +10913,7 @@ class AuroHeader extends r$2 {
|
|
|
11069
10913
|
*
|
|
11070
10914
|
*/
|
|
11071
10915
|
static register(name = "auro-header") {
|
|
11072
|
-
AuroLibraryRuntimeUtils$
|
|
10916
|
+
AuroLibraryRuntimeUtils$3.prototype.registerComponent(name, AuroHeader);
|
|
11073
10917
|
}
|
|
11074
10918
|
|
|
11075
10919
|
firstUpdated() {
|
|
@@ -11163,9 +11007,11 @@ class AuroBibtemplate extends r$2 {
|
|
|
11163
11007
|
constructor() {
|
|
11164
11008
|
super();
|
|
11165
11009
|
|
|
11166
|
-
|
|
11010
|
+
this.large = false;
|
|
11011
|
+
|
|
11012
|
+
AuroLibraryRuntimeUtils$1$2.prototype.handleComponentTagRename(this, 'auro-bibtemplate');
|
|
11167
11013
|
|
|
11168
|
-
const versioning = new AuroDependencyVersioning$
|
|
11014
|
+
const versioning = new AuroDependencyVersioning$2();
|
|
11169
11015
|
this.iconTag = versioning.generateTag('auro-formkit-bibtemplate-icon', iconVersion$2, AuroIcon$2);
|
|
11170
11016
|
this.headerTag = versioning.generateTag('auro-formkit-bibtemplate-header', headerVersion, AuroHeader);
|
|
11171
11017
|
}
|
|
@@ -11202,7 +11048,7 @@ class AuroBibtemplate extends r$2 {
|
|
|
11202
11048
|
*
|
|
11203
11049
|
*/
|
|
11204
11050
|
static register(name = "auro-bibtemplate") {
|
|
11205
|
-
AuroLibraryRuntimeUtils$
|
|
11051
|
+
AuroLibraryRuntimeUtils$1$2.prototype.registerComponent(name, AuroBibtemplate);
|
|
11206
11052
|
}
|
|
11207
11053
|
|
|
11208
11054
|
/**
|
|
@@ -11274,267 +11120,84 @@ class AuroBibtemplate extends r$2 {
|
|
|
11274
11120
|
|
|
11275
11121
|
var bibTemplateVersion = '1.0.0';
|
|
11276
11122
|
|
|
11277
|
-
|
|
11278
|
-
// See LICENSE in the project root for license information.
|
|
11279
|
-
|
|
11123
|
+
var styleCss$7 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}.util_insetNone{padding:0}.util_insetXxxs{padding:.125rem}.util_insetXxxs--stretch{padding:.25rem .125rem}.util_insetXxxs--squish{padding:0 .125rem}.util_insetXxs{padding:.25rem}.util_insetXxs--stretch{padding:.375rem .25rem}.util_insetXxs--squish{padding:.125rem .25rem}.util_insetXs{padding:.5rem}.util_insetXs--stretch{padding:.75rem .5rem}.util_insetXs--squish{padding:.25rem .5rem}.util_insetSm{padding:.75rem}.util_insetSm--stretch{padding:1.125rem .75rem}.util_insetSm--squish{padding:.375rem .75rem}.util_insetMd{padding:1rem}.util_insetMd--stretch{padding:1.5rem 1rem}.util_insetMd--squish{padding:.5rem 1rem}.util_insetLg{padding:1.5rem}.util_insetLg--stretch{padding:2.25rem 1.5rem}.util_insetLg--squish{padding:.75rem 1.5rem}.util_insetXl{padding:2rem}.util_insetXl--stretch{padding:3rem 2rem}.util_insetXl--squish{padding:1rem 2rem}.util_insetXxl{padding:3rem}.util_insetXxl--stretch{padding:4.5rem 3rem}.util_insetXxl--squish{padding:1.5rem 3rem}.util_insetXxxl{padding:4rem}.util_insetXxxl--stretch{padding:6rem 4rem}.util_insetXxxl--squish{padding:2rem 4rem}:host([fluid]) .auro-button,:host([fluid=true]) .auro-button{min-width:auto;width:100%}:host([variant=flat]){display:inline-block;height:var(--ds-size-300, 1.5rem);width:var(--ds-size-300, 1.5rem)}:host([variant=flat]) .auro-button{height:100%;width:100%}::slotted(svg){vertical-align:middle}slot{pointer-events:none}.auro-button{position:relative;padding:0 var(--ds-size-300, 1.5rem);cursor:pointer;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem);font-family:var(--ds-basic-text-body-default-font-family, AS Circular);font-size:var(--ds-basic-text-body-default-font-size, 16px);font-weight:var(--ds-basic-text-body-default-font-weight, Book);overflow:hidden;text-overflow:ellipsis;user-select:none;white-space:nowrap;min-height:var(--ds-size-600, 3rem);max-height:var(--ds-size-600, 3rem);display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--ds-size-100, 0.5rem);margin:0;-webkit-touch-callout:none;-webkit-user-select:none}.auro-button:active{transform:scale(0.95)}.auro-button:focus-visible{outline:none}.auro-button:focus-visible:not([variant=flat]){outline-style:solid;outline-width:var(--ds-size-50, 0.25rem);outline-offset:calc(var(--ds-size-50, 0.25rem)*-1)}.auro-button:focus-visible:not([variant=flat]):not([variant=secondary]):not([variant=tertiary]){outline-width:calc(var(--ds-size-50, 0.25rem) - 1px)}.auro-button.loading{cursor:not-allowed}.auro-button.loading *:not([auro-loader]){visibility:hidden}@media screen and (min-width: 576px){.auro-button{min-width:8.75rem;width:auto}}.auro-button:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=secondary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=flat]{height:unset;width:unset;min-height:unset;max-height:unset;min-width:unset;max-width:unset;border:0;border-radius:unset;gap:unset;padding:unset}.auro-button[onDark]:disabled{cursor:not-allowed;transform:unset}.auro-button[onDark][variant=secondary]:disabled{cursor:not-allowed;transform:unset}@media(hover: hover){.auro-button[onDark][variant=tertiary]:active,.auro-button[onDark][variant=tertiary]:hover{box-shadow:none}}.auro-button[onDark][variant=tertiary]:active{box-shadow:none}.auro-button[onDark][variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button--slim{padding:var(--ds-size-100, 0.5rem) var(--ds-size-200, 1rem);font-size:var(--ds-basic-text-body-sm-font-size, 14px);min-width:unset;min-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem));max-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem))}.auro-button--iconOnly{padding:0 var(--ds-size-100, 0.5rem);border-radius:100px;min-width:unset;height:var(--ds-size-600, 3rem);width:var(--ds-size-500, 2.5rem)}.auro-button--iconOnly ::slotted(auro-icon),.auro-button--iconOnly ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, $ds-size-300)}.auro-button--iconOnly:not(.auro-button--rounded):focus-visible:not([variant=secondary]):not([variant=tertiary]):not([variant=flat]){outline-width:1px;outline-offset:-2px}.auro-button--iconOnlySlim{padding:0 var(--ds-size-50, 0.25rem);height:calc(var(--ds-size-400, 2rem) + var(--ds-size-50, 0.25rem));width:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-50, 0.25rem))}.auro-button--iconOnlySlim ::slotted(auro-icon),.auro-button--iconOnlySlim ::slotted([auro-icon]){--ds-auro-icon-size:calc(var(--ds-size-200, $ds-size-200) + var(--ds-size-50, $ds-size-50))}.auro-button--rounded{border-radius:100px;box-shadow:var(--ds-elevation-300, 0px 0px 15px rgba(0, 0, 0, 0.2));height:var(--ds-size-500, 2.5rem);min-width:unset;transition:all 300ms ease-out,outline 0ms,outline-offset 0ms}.auro-button--rounded ::slotted(auro-icon),.auro-button--rounded ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, $ds-size-300)}.auro-button--rounded:focus-visible:not([variant=flat]):after{border-radius:100px}:host([rounded]) .textSlot{transition:opacity 300ms ease-in;opacity:1}:host([rounded][iconOnly]) .textSlot{opacity:0}:host([rounded][iconOnly]) .textWrapper{display:none}:host([rounded][iconOnly]) .auro-button{min-width:unset;padding:unset;width:var(--ds-size-600, 3rem)}[auro-loader]{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);pointer-events:none}`;
|
|
11280
11124
|
|
|
11281
|
-
|
|
11125
|
+
var colorCss$7 = i$5`[auro-loader]{color:var(--ds-auro-button-loader-color)}.auro-button{-webkit-tap-highlight-color:var(--ds-auro-button-tap-color);color:var(--ds-auro-button-text-color);background-color:var(--ds-auro-button-container-color);background-image:linear-gradient(var(--ds-auro-button-container-image), var(--ds-auro-button-container-image));border-color:var(--ds-auro-button-border-color)}.auro-button:not([variant=secondary]):not([variant=tertiary]):focus-visible{outline-color:var(--ds-auro-button-border-inset-color)}.auro-button:not([ondark]):active:not(:disabled),.auro-button:not([ondark]):hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-hover, #00274a);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-hover, #00274a);--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-hover, #00274a)}.auro-button:not([ondark]):disabled{--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-disabled, #acc9e2);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-disabled, #acc9e2);--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-disabled, #acc9e2)}.auro-button:not([ondark])[variant=secondary]{--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background, #ffffff);--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background, #ffffff);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border, #01426a);--ds-auro-button-text-color:var(--ds-advanced-color-button-secondary-text, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-secondary-text, #01426a)}.auro-button:not([ondark])[variant=secondary]:active:not(:disabled),.auro-button:not([ondark])[variant=secondary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background-hover, #f2f2f2);--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background-hover, #f2f2f2);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-hover, #00274a);--ds-auro-button-text-color:var(--ds-advanced-color-button-secondary-text-hover, #00274a)}.auro-button:not([ondark])[variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused, #01426a)}.auro-button:not([ondark])[variant=secondary]:disabled{--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background-disabled, #f7f7f7);--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background-disabled, #f7f7f7);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-disabled, #cfe0ef);--ds-auro-button-text-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}.auro-button:not([ondark])[variant=tertiary]{--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background, rgba(0, 0, 0, 0.05));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background, rgba(0, 0, 0, 0.05));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-advanced-color-button-tertiary-text, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-tertiary-text, #01426a)}.auro-button:not([ondark])[variant=tertiary]:active:not(:disabled),.auro-button:not([ondark])[variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background-hover, rgba(0, 0, 0, 0.1));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background-hover, rgba(0, 0, 0, 0.1));--ds-auro-button-border-color:transparent}.auro-button:not([ondark])[variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-advanced-color-state-focused, #01426a);--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused, #01426a)}.auro-button:not([ondark])[variant=tertiary]:disabled{--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}.auro-button:not([ondark])[variant=flat]{color:var(--ds-advanced-color-button-flat-text, #676767);background-color:transparent;background-image:none;border-color:transparent}.auro-button:not([ondark])[variant=flat]:active:not(:disabled),.auro-button:not([ondark])[variant=flat]:hover:not(:disabled){color:var(--ds-advanced-color-button-flat-text-hover, #525252);background-color:transparent;background-image:none;border-color:transparent}.auro-button:not([ondark])[variant=flat]:disabled{color:var(--ds-advanced-color-button-flat-text-disabled, #d0d0d0);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark]{--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-inverse, #ffffff);--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-inverse, #ffffff);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-inverse, #ffffff);--ds-auro-button-text-color:var(--ds-advanced-color-button-primary-text-inverse, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-primary-text-inverse, #01426a)}.auro-button[ondark]:active:not(:disabled),.auro-button[ondark]:hover:not(:disabled){--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-inverse-hover, #ebf3f9);--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-inverse-hover, #ebf3f9);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-inverse-hover, #ebf3f9)}.auro-button[ondark]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused, #01426a)}.auro-button[ondark]:disabled{--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-text-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}.auro-button[ondark][variant=secondary]{--ds-auro-button-container-color:transparent;--ds-auro-button-container-image:transparent;--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-inverse, #ffffff);--ds-auro-button-text-color:var(--ds-advanced-color-button-secondary-text-inverse, #ffffff);--ds-auro-button-loader-color:var(--ds-advanced-color-button-secondary-text-inverse, #ffffff)}.auro-button[ondark][variant=secondary]:active:not(:disabled),.auro-button[ondark][variant=secondary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background-inverse-hover, rgba(255, 255, 255, 0.1));--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background-inverse-hover, rgba(255, 255, 255, 0.1))}.auro-button[ondark][variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused-inverse, #ffffff)}.auro-button[ondark][variant=secondary]:disabled{--ds-auro-button-text-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-inverse-disabled, #dddddd)}.auro-button[ondark][variant=tertiary]{--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background-inverse, rgba(255, 255, 255, 0.05));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background-inverse, rgba(255, 255, 255, 0.05));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-advanced-color-button-tertiary-text-inverse, #ffffff);--ds-auro-button-loader-color:var(--ds-advanced-color-button-tertiary-text-inverse, #ffffff)}.auro-button[ondark][variant=tertiary]:active:not(:disabled),.auro-button[ondark][variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background-inverse-hover, rgba(255, 255, 255, 0.1));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background-inverse-hover, rgba(255, 255, 255, 0.1))}.auro-button[ondark][variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused-inverse, #ffffff)}.auro-button[ondark][variant=tertiary]:disabled{--ds-auro-button-text-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}.auro-button[ondark][variant=flat]{color:var(--ds-advanced-color-button-flat-text-inverse, #ffffff);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark][variant=flat]:active:not(:disabled),.auro-button[ondark][variant=flat]:hover:not(:disabled){color:var(--ds-advanced-color-button-flat-text-inverse-hover, #adadad);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark][variant=flat]:disabled{color:var(--ds-advanced-color-button-flat-text-inverse-disabled, #7e8894);background-color:transparent;background-image:none;border-color:transparent}`;
|
|
11282
11126
|
|
|
11283
|
-
|
|
11284
|
-
* Generates a unique string to be used for child auro element naming.
|
|
11285
|
-
* @private
|
|
11286
|
-
* @param {string} baseName - Defines the first part of the unique element name.
|
|
11287
|
-
* @param {string} version - Version of the component that will be appended to the baseName.
|
|
11288
|
-
* @returns {string} - Unique string to be used for naming.
|
|
11289
|
-
*/
|
|
11290
|
-
generateElementName(baseName, version) {
|
|
11291
|
-
let result = baseName;
|
|
11127
|
+
var tokensCss$7 = i$5`:host{--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border, #01426a);--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background, #01426a);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-primary-text, #ffffff);--ds-auro-button-text-color:var(--ds-advanced-color-button-primary-text, #ffffff);--ds-auro-button-tap-color:transparent}`;
|
|
11292
11128
|
|
|
11293
|
-
|
|
11294
|
-
result += version.replace(/[.]/g, '_');
|
|
11129
|
+
var styleCss$6 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}:host,:host>span{position:relative}:host{width:2rem;height:2rem;display:inline-block;font-size:0}:host>span{position:absolute;display:inline-block;float:none;top:0;left:0;width:2rem;height:2rem;border-radius:100%;border-style:solid;border-width:0}:host([xs]),:host([xs])>span{width:1.2rem;height:1.2rem}:host([sm]),:host([sm])>span{width:3rem;height:3rem}:host([md]),:host([md])>span{width:5rem;height:5rem}:host([lg]),:host([lg])>span{width:8rem;height:8rem}:host{--margin:0.375rem;--margin-xs:0.2rem;--margin-sm:0.5rem;--margin-md:0.75rem;--margin-lg:1rem}:host([pulse]),:host([pulse])>span{position:relative}:host([pulse]){width:calc(3rem + var(--margin)*6);height:1.5rem}:host([pulse])>span{width:1rem;height:1rem;margin:var(--margin);animation:pulse 1.5s ease infinite}:host([pulse][xs]){width:calc(2.55rem + var(--margin-xs)*6);height:1.55rem}:host([pulse][xs])>span{margin:var(--margin-xs);width:.65rem;height:.65rem}:host([pulse][sm]){width:calc(6rem + var(--margin-sm)*6);height:2.5rem}:host([pulse][sm])>span{margin:var(--margin-sm);width:2rem;height:2rem}:host([pulse][md]){width:calc(9rem + var(--margin-md)*6);height:3.5rem}:host([pulse][md])>span{margin:var(--margin-md);width:3rem;height:3rem}:host([pulse][lg]){width:calc(15rem + var(--margin-lg)*6);height:5.5rem}:host([pulse][lg])>span{margin:var(--margin-lg);width:5rem;height:5rem}:host([pulse])>span:nth-child(1){animation-delay:-400ms}:host([pulse])>span:nth-child(2){animation-delay:-200ms}:host([pulse])>span:nth-child(3){animation-delay:0ms}@keyframes pulse{0%,100%{opacity:.1;transform:scale(0.9)}50%{opacity:1;transform:scale(1.1)}}:host([orbit]),:host([orbit])>span{opacity:1}:host([orbit])>span{border-width:5px}:host([orbit])>span:nth-child(2){animation:orbit 2s linear infinite}:host([orbit][sm])>span{border-width:8px}:host([orbit][md])>span{border-width:13px}:host([orbit][lg])>span{border-width:21px}@keyframes orbit{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}:host([ringworm])>svg{animation:rotate 2s linear infinite;height:100%;width:100%;stroke:currentcolor;stroke-width:8}:host([ringworm]) .path{stroke-dashoffset:0;animation:ringworm 1.5s ease-in-out infinite;stroke-linecap:round}@keyframes rotate{100%{transform:rotate(360deg)}}@keyframes ringworm{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}100%{stroke-dasharray:89,200;stroke-dashoffset:-124px}}:host([laser]){position:static;width:100%;display:block;height:0;overflow:hidden;font-size:unset}:host([laser])>span{position:fixed;width:100%;height:.25rem;border-radius:0;z-index:100}:host([laser])>span:nth-child(1){border-color:currentcolor;opacity:.25}:host([laser])>span:nth-child(2){border-color:currentcolor;animation:laser 2s linear infinite;opacity:1;width:50%}:host([laser][sm])>span:nth-child(2){width:20%}:host([laser][md])>span:nth-child(2){width:30%}:host([laser][lg])>span:nth-child(2){width:50%;animation-duration:1.5s}:host([laser][xl])>span:nth-child(2){width:80%;animation-duration:1.5s}@keyframes laser{0%{left:-100%}100%{left:110%}}:host>.no-animation{display:none}@media(prefers-reduced-motion: reduce){:host{display:flex;align-items:center;justify-content:center;font-size:1rem}:host>span{opacity:1}:host>.loader{display:none}:host>.no-animation{display:block}}`;
|
|
11295
11130
|
|
|
11296
|
-
|
|
11297
|
-
}
|
|
11131
|
+
var colorCss$6 = i$5`:host{color:var(--ds-auro-loader-color)}:host>span{background-color:var(--ds-auro-loader-background-color);border-color:var(--ds-auro-loader-border-color)}:host([onlight]){--ds-auro-loader-color:var(--ds-basic-color-brand-primary, #01426a)}:host([ondark]){--ds-auro-loader-color:var(--ds-basic-color-texticon-inverse, #ffffff)}:host([orbit])>span{--ds-auro-loader-background-color:transparent}:host([orbit])>span:nth-child(1){--ds-auro-loader-border-color:currentcolor;opacity:.25}:host([orbit])>span:nth-child(2){--ds-auro-loader-border-color:currentcolor;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent}`;
|
|
11298
11132
|
|
|
11299
|
-
|
|
11300
|
-
* Generates a unique string to be used for child auro element naming.
|
|
11301
|
-
* @param {string} baseName - Defines the first part of the unique element name.
|
|
11302
|
-
* @param {string} version - Version of the component that will be appended to the baseName.
|
|
11303
|
-
* @returns {string} - Unique string to be used for naming.
|
|
11304
|
-
*/
|
|
11305
|
-
generateTag(baseName, version, tagClass) {
|
|
11306
|
-
const elementName = this.generateElementName(baseName, version);
|
|
11307
|
-
const tag = i$1`${s$1(elementName)}`;
|
|
11133
|
+
var tokensCss$6 = i$5`:host{--ds-auro-loader-background-color:currentcolor;--ds-auro-loader-border-color:currentcolor;--ds-auro-loader-color:currentcolor}`;
|
|
11308
11134
|
|
|
11309
|
-
|
|
11310
|
-
|
|
11311
|
-
}
|
|
11135
|
+
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
11136
|
+
// See LICENSE in the project root for license information.
|
|
11312
11137
|
|
|
11313
|
-
return tag;
|
|
11314
|
-
}
|
|
11315
|
-
};
|
|
11316
11138
|
|
|
11317
|
-
|
|
11318
|
-
|
|
11139
|
+
let AuroLoader$1 = class AuroLoader extends r$2 {
|
|
11140
|
+
constructor() {
|
|
11141
|
+
super();
|
|
11319
11142
|
|
|
11320
|
-
|
|
11143
|
+
/**
|
|
11144
|
+
* @private
|
|
11145
|
+
*/
|
|
11146
|
+
this.keys = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
|
|
11321
11147
|
|
|
11322
|
-
|
|
11148
|
+
/**
|
|
11149
|
+
* @private
|
|
11150
|
+
*/
|
|
11151
|
+
this.mdCount = 3;
|
|
11323
11152
|
|
|
11324
|
-
|
|
11153
|
+
/**
|
|
11154
|
+
* @private
|
|
11155
|
+
*/
|
|
11156
|
+
this.smCount = 2;
|
|
11325
11157
|
|
|
11326
|
-
|
|
11158
|
+
/**
|
|
11159
|
+
* @private
|
|
11160
|
+
*/
|
|
11161
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$4();
|
|
11327
11162
|
|
|
11328
|
-
|
|
11329
|
-
|
|
11330
|
-
|
|
11331
|
-
|
|
11332
|
-
* @returns {void}
|
|
11333
|
-
*/
|
|
11334
|
-
registerComponent(name, componentClass) {
|
|
11335
|
-
if (!customElements.get(name)) {
|
|
11336
|
-
customElements.define(name, class extends componentClass {});
|
|
11337
|
-
}
|
|
11163
|
+
this.orbit = false;
|
|
11164
|
+
this.ringworm = false;
|
|
11165
|
+
this.laser = false;
|
|
11166
|
+
this.pulse = false;
|
|
11338
11167
|
}
|
|
11339
11168
|
|
|
11340
|
-
|
|
11341
|
-
|
|
11342
|
-
|
|
11343
|
-
*/
|
|
11344
|
-
closestElement(
|
|
11345
|
-
selector, // selector like in .closest()
|
|
11346
|
-
base = this, // extra functionality to skip a parent
|
|
11347
|
-
__Closest = (el, found = el && el.closest(selector)) =>
|
|
11348
|
-
!el || el === document || el === window
|
|
11349
|
-
? null // standard .closest() returns null for non-found selectors also
|
|
11350
|
-
: found
|
|
11351
|
-
? found // found a selector INside this element
|
|
11352
|
-
: __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
|
|
11353
|
-
) {
|
|
11354
|
-
return __Closest(base);
|
|
11355
|
-
}
|
|
11356
|
-
/* eslint-enable jsdoc/require-param */
|
|
11169
|
+
// function to define props used within the scope of this component
|
|
11170
|
+
static get properties() {
|
|
11171
|
+
return {
|
|
11357
11172
|
|
|
11358
|
-
|
|
11359
|
-
|
|
11360
|
-
|
|
11361
|
-
|
|
11362
|
-
* @returns {void}
|
|
11363
|
-
*/
|
|
11364
|
-
handleComponentTagRename(elem, tagName) {
|
|
11365
|
-
const tag = tagName.toLowerCase();
|
|
11366
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
11367
|
-
|
|
11368
|
-
if (elemTag !== tag) {
|
|
11369
|
-
elem.setAttribute(tag, true);
|
|
11370
|
-
}
|
|
11371
|
-
}
|
|
11372
|
-
|
|
11373
|
-
/**
|
|
11374
|
-
* Validates if an element is a specific Auro component.
|
|
11375
|
-
* @param {Object} elem - The element to validate.
|
|
11376
|
-
* @param {String} tagName - The name of the Auro component to check against.
|
|
11377
|
-
* @returns {Boolean} - Returns true if the element is the specified Auro component.
|
|
11378
|
-
*/
|
|
11379
|
-
elementMatch(elem, tagName) {
|
|
11380
|
-
const tag = tagName.toLowerCase();
|
|
11381
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
11382
|
-
|
|
11383
|
-
return elemTag === tag || elem.hasAttribute(tag);
|
|
11384
|
-
}
|
|
11385
|
-
};
|
|
11386
|
-
|
|
11387
|
-
var styleCss$7 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}.util_insetNone{padding:0}.util_insetXxxs{padding:.125rem}.util_insetXxxs--stretch{padding:.25rem .125rem}.util_insetXxxs--squish{padding:0 .125rem}.util_insetXxs{padding:.25rem}.util_insetXxs--stretch{padding:.375rem .25rem}.util_insetXxs--squish{padding:.125rem .25rem}.util_insetXs{padding:.5rem}.util_insetXs--stretch{padding:.75rem .5rem}.util_insetXs--squish{padding:.25rem .5rem}.util_insetSm{padding:.75rem}.util_insetSm--stretch{padding:1.125rem .75rem}.util_insetSm--squish{padding:.375rem .75rem}.util_insetMd{padding:1rem}.util_insetMd--stretch{padding:1.5rem 1rem}.util_insetMd--squish{padding:.5rem 1rem}.util_insetLg{padding:1.5rem}.util_insetLg--stretch{padding:2.25rem 1.5rem}.util_insetLg--squish{padding:.75rem 1.5rem}.util_insetXl{padding:2rem}.util_insetXl--stretch{padding:3rem 2rem}.util_insetXl--squish{padding:1rem 2rem}.util_insetXxl{padding:3rem}.util_insetXxl--stretch{padding:4.5rem 3rem}.util_insetXxl--squish{padding:1.5rem 3rem}.util_insetXxxl{padding:4rem}.util_insetXxxl--stretch{padding:6rem 4rem}.util_insetXxxl--squish{padding:2rem 4rem}:host([fluid]) .auro-button,:host([fluid=true]) .auro-button{min-width:auto;width:100%}:host([variant=flat]){display:inline-block;height:var(--ds-size-300, 1.5rem);width:var(--ds-size-300, 1.5rem)}:host([variant=flat]) .auro-button{height:100%;width:100%}::slotted(svg){vertical-align:middle}slot{pointer-events:none}.auro-button{position:relative;padding:0 var(--ds-size-300, 1.5rem);cursor:pointer;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem);font-family:var(--ds-font-family-default, "AS Circular", Helvetica Neue, Arial, sans-serif);font-size:var(--ds-text-body-size-default, 1rem);font-weight:var(--ds-text-body-default-weight, 500);overflow:hidden;text-overflow:ellipsis;user-select:none;white-space:nowrap;min-height:var(--ds-size-600, 3rem);max-height:var(--ds-size-600, 3rem);display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--ds-size-100, 0.5rem);margin:0;-webkit-touch-callout:none;-webkit-user-select:none}.auro-button:active{transform:scale(0.95)}.auro-button:focus-visible:not([variant=secondary]):not([variant=tertiary]):not([variant=flat]):after{display:block;content:"";height:calc(100% - 2px);width:calc(100% - 2px);position:absolute;top:1px;left:1px;border-radius:4px;border-style:solid;border-width:2px}.auro-button:focus-visible[variant=secondary]:after,.auro-button:focus-visible[variant=tertiary]:after{display:block;content:"";height:100%;width:100%;position:absolute;top:0;left:0;border-radius:var(--ds-border-radius, 0.375rem);border-style:solid;border-width:2px}.auro-button.loading{cursor:not-allowed}.auro-button.loading *:not([auro-loader]){visibility:hidden}@media screen and (min-width: 576px){.auro-button{min-width:8.75rem;width:auto}}.auro-button:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=secondary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=flat]{height:unset;width:unset;min-height:unset;max-height:unset;min-width:unset;max-width:unset;border:0;border-radius:unset;gap:unset;padding:unset}.auro-button[onDark]:disabled{cursor:not-allowed;transform:unset}.auro-button[onDark][variant=secondary]:disabled{cursor:not-allowed;transform:unset}@media(hover: hover){.auro-button[onDark][variant=tertiary]:active,.auro-button[onDark][variant=tertiary]:hover{box-shadow:none}}.auro-button[onDark][variant=tertiary]:active{box-shadow:none}.auro-button[onDark][variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button--slim{padding:var(--ds-size-100, 0.5rem) var(--ds-size-200, 1rem);font-size:var(--ds-text-body-size-sm, 0.875rem);min-width:unset;min-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem));max-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem))}.auro-button--iconOnly{padding:0 var(--ds-size-100, 0.5rem);border-radius:100px;min-width:unset;height:var(--ds-size-600, 3rem);width:var(--ds-size-500, 2.5rem)}.auro-button--iconOnly ::slotted(auro-icon),.auro-button--iconOnly ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, $ds-size-300)}.auro-button--iconOnlySlim{padding:0 var(--ds-size-50, 0.25rem);height:calc(var(--ds-size-400, 2rem) + var(--ds-size-50, 0.25rem));width:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-50, 0.25rem))}.auro-button--iconOnlySlim ::slotted(auro-icon),.auro-button--iconOnlySlim ::slotted([auro-icon]){--ds-auro-icon-size:calc(var(--ds-size-200, $ds-size-200) + var(--ds-size-50, $ds-size-50))}.auro-button--rounded{border-radius:100px;box-shadow:var(--ds-elevation-300, 0px 0px 15px rgba(0, 0, 0, 0.2));height:var(--ds-size-500, 2.5rem);min-width:unset;transition:all 300ms ease-out}.auro-button--rounded ::slotted(auro-icon),.auro-button--rounded ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, $ds-size-300)}:host([rounded]) .textSlot{transition:opacity 300ms ease-in;opacity:1}:host([rounded][iconOnly]) .textSlot{opacity:0}:host([rounded][iconOnly]) .textWrapper{display:none}:host([rounded][iconOnly]) .auro-button{min-width:unset;padding:unset;width:var(--ds-size-600, 3rem)}[auro-loader]{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);pointer-events:none}`;
|
|
11388
|
-
|
|
11389
|
-
var colorCss$7 = i$5`[auro-loader]{color:var(--ds-auro-button-loader-color)}.auro-button{-webkit-tap-highlight-color:var(--ds-auro-button-tap-color);color:var(--ds-auro-button-text-color);background-color:var(--ds-auro-button-container-color);background-image:linear-gradient(var(--ds-auro-button-container-image), var(--ds-auro-button-container-image));border-color:var(--ds-auro-button-border-color)}.auro-button:not([variant=secondary]):not([variant=tertiary]):focus-visible:after{border-color:var(--ds-auro-button-border-inset-color)}.auro-button:not([ondark]):active{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-active-default, #225296);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-active-default, #225296);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-active-default, #225296)}.auro-button:not([ondark])[disabled]{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-disabled-default, #a0c9f1);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-disabled-default, #a0c9f1);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-disabled-default, #a0c9f1)}@media(hover: hover){.auro-button:not([ondark]):active:not(:disabled),.auro-button:not([ondark]):hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-primary-hover-default, #193d73);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-hover-default, #193d73);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-hover-default, #193d73)}}.auro-button:not([ondark])[variant=secondary]{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-default-default, #ffffff);--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-default-default, #ffffff);--ds-auro-button-border-color:var(--ds-color-border-ui-default-default, #2c67b5);--ds-auro-button-text-color:var(--ds-color-text-ui-default-default, #2c67b5)}@media(hover: hover){.auro-button:not([ondark])[variant=secondary]:active:not(:disabled),.auro-button:not([ondark])[variant=secondary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-hover-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-hover-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color:var(--ds-color-border-ui-hover-default, #193d73);--ds-auro-button-text-color:var(--ds-color-text-ui-hover-default, #193d73)}}.auro-button:not([ondark])[variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-color-border-ui-focus-default, #2c67b5)}.auro-button:not([ondark])[variant=secondary]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-active-default, #f0f7fd);--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-active-default, #f0f7fd);--ds-auro-button-border-color:var(--ds-color-border-ui-active-default, #225296);--ds-auro-button-text-color:var(--ds-color-text-ui-active-default, #225296)}.auro-button:not([ondark])[variant=secondary]:disabled{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-disabled-default, #f7f7f7);--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-disabled-default, #f7f7f7);--ds-auro-button-border-color:var(--ds-color-border-ui-disabled-default, #adadad);--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-default, #adadad)}.auro-button:not([ondark])[variant=tertiary]{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-default-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-default-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-default-default, #2c67b5)}@media(hover: hover){.auro-button:not([ondark])[variant=tertiary]:active:not(:disabled),.auro-button:not([ondark])[variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-hover-default, rgba(0, 0, 0, 0.12));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-hover-default, rgba(0, 0, 0, 0.12));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-hover-default, #193d73)}}.auro-button:not([ondark])[variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-color-border-ui-default-default, #2c67b5);--ds-auro-button-border-inset-color:var(--ds-color-border-ui-default-default, #2c67b5)}.auro-button:not([ondark])[variant=tertiary]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-active-default, rgba(0, 0, 0, 0.06));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-active-default, rgba(0, 0, 0, 0.06));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-active-default, #225296)}.auro-button:not([ondark])[variant=tertiary]:disabled{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-disabled-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-disabled-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-default, #adadad)}.auro-button:not([ondark])[variant=flat]{color:var(--ds-color-icon-ui-secondary-default-default);background-color:transparent;background-image:none;border-color:transparent}@media(hover: hover){.auro-button:not([ondark])[variant=flat]:active:not(:disabled),.auro-button:not([ondark])[variant=flat]:hover:not(:disabled){color:var(--ds-color-icon-ui-secondary-hover-default);background-color:transparent;background-image:none;border-color:transparent}}.auro-button:not([ondark])[variant=flat]:disabled{color:var(--ds-color-icon-ui-secondary-disabled-default);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark]{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-default-inverse, #56bbde);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-default-inverse, #56bbde);--ds-auro-button-text-color:var(--ds-color-text-primary-default, #2a2a2a);--ds-auro-button-loader-color:var(--ds-color-text-primary-inverse, #ffffff);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark]:active:not(:disabled),.auro-button[ondark]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7)}}.auro-button[ondark]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-active-inverse, #6ad5ef);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-active-inverse, #6ad5ef);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-active-inverse, #6ad5ef)}.auro-button[ondark][disabled]{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-disabled-inverse, #275b72);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-disabled-inverse, #275b72);--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-inverse, #7e7e7e);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-disabled-inverse, #275b72)}.auro-button[ondark][variant=secondary]{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-default-inverse, rgba(255, 255, 255, 0.03));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-default-inverse, rgba(255, 255, 255, 0.03));--ds-auro-button-border-color:var(--ds-color-border-ui-default-inverse, #56bbde);--ds-auro-button-text-color:var(--ds-color-text-ui-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark][variant=secondary]:hover{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-hover-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-hover-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color:var(--ds-color-border-ui-hover-inverse, #a8e9f7);--ds-auro-button-text-color:var(--ds-color-text-ui-hover-inverse, #a8e9f7)}}.auro-button[ondark][variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-color-border-ui-focus-inverse, #56bbde)}.auro-button[ondark][variant=secondary]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-border-color:var(--ds-color-border-ui-active-inverse, #6ad5ef);--ds-auro-button-text-color:var(--ds-color-text-ui-active-inverse, #6ad5ef)}.auro-button[ondark][variant=secondary]:disabled{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-disabled-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-disabled-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color:var(--ds-color-border-ui-disabled-inverse, #7e7e7e);--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-inverse, #7e7e7e)}.auro-button[ondark][variant=tertiary]{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-default-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-default-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark][variant=tertiary]:active:not(:disabled),.auro-button[ondark][variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-hover-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-hover-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-hover-inverse, #a8e9f7)}}.auro-button[ondark][variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-color-border-ui-default-inverse, #56bbde);--ds-auro-button-border-inset-color:var(--ds-color-border-ui-default-inverse, #56bbde)}.auro-button[ondark][variant=tertiary]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-active-inverse, #6ad5ef)}.auro-button[ondark][variant=tertiary]:disabled{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-disabled-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-disabled-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-inverse, #7e7e7e)}.auro-button[ondark][variant=flat]{color:var(--ds-color-icon-ui-secondary-default-inverse);background-color:transparent;background-image:none;border-color:transparent}@media(hover: hover){.auro-button[ondark][variant=flat]:active:not(:disabled),.auro-button[ondark][variant=flat]:hover:not(:disabled){color:var(--ds-color-icon-ui-secondary-hover-inverse);background-color:transparent;background-image:none;border-color:transparent}}.auro-button[ondark][variant=flat]:disabled{color:var(--ds-color-icon-ui-disabled-default);background-color:transparent;background-image:none;border-color:transparent}`;
|
|
11390
|
-
|
|
11391
|
-
var tokensCss$7 = i$5`:host{--ds-auro-button-border-color:var(--ds-color-container-ui-primary-default-default, #2c67b5);--ds-auro-button-border-inset-color:var(--ds-color-border-emphasis-inverse, #f2f7fb);--ds-auro-button-container-color:var(--ds-color-container-ui-primary-default-default, #2c67b5);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-default-default, #2c67b5);--ds-auro-button-loader-color:var(--ds-color-utility-navy-default, #265688);--ds-auro-button-text-color:var(--ds-color-text-primary-inverse, #ffffff);--ds-auro-button-tap-color:transparent}`;
|
|
11392
|
-
|
|
11393
|
-
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
11394
|
-
// See LICENSE in the project root for license information.
|
|
11395
|
-
|
|
11396
|
-
// ---------------------------------------------------------------------
|
|
11397
|
-
|
|
11398
|
-
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
11399
|
-
|
|
11400
|
-
let AuroLibraryRuntimeUtils$6 = class AuroLibraryRuntimeUtils {
|
|
11401
|
-
|
|
11402
|
-
/* eslint-disable jsdoc/require-param */
|
|
11403
|
-
|
|
11404
|
-
/**
|
|
11405
|
-
* This will register a new custom element with the browser.
|
|
11406
|
-
* @param {String} name - The name of the custom element.
|
|
11407
|
-
* @param {Object} componentClass - The class to register as a custom element.
|
|
11408
|
-
* @returns {void}
|
|
11409
|
-
*/
|
|
11410
|
-
registerComponent(name, componentClass) {
|
|
11411
|
-
if (!customElements.get(name)) {
|
|
11412
|
-
customElements.define(name, class extends componentClass {});
|
|
11413
|
-
}
|
|
11414
|
-
}
|
|
11415
|
-
|
|
11416
|
-
/**
|
|
11417
|
-
* Finds and returns the closest HTML Element based on a selector.
|
|
11418
|
-
* @returns {void}
|
|
11419
|
-
*/
|
|
11420
|
-
closestElement(
|
|
11421
|
-
selector, // selector like in .closest()
|
|
11422
|
-
base = this, // extra functionality to skip a parent
|
|
11423
|
-
__Closest = (el, found = el && el.closest(selector)) =>
|
|
11424
|
-
!el || el === document || el === window
|
|
11425
|
-
? null // standard .closest() returns null for non-found selectors also
|
|
11426
|
-
: found
|
|
11427
|
-
? found // found a selector INside this element
|
|
11428
|
-
: __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
|
|
11429
|
-
) {
|
|
11430
|
-
return __Closest(base);
|
|
11431
|
-
}
|
|
11432
|
-
/* eslint-enable jsdoc/require-param */
|
|
11433
|
-
|
|
11434
|
-
/**
|
|
11435
|
-
* 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.
|
|
11436
|
-
* @param {Object} elem - The element to check.
|
|
11437
|
-
* @param {String} tagName - The name of the Auro component to check for or add as an attribute.
|
|
11438
|
-
* @returns {void}
|
|
11439
|
-
*/
|
|
11440
|
-
handleComponentTagRename(elem, tagName) {
|
|
11441
|
-
const tag = tagName.toLowerCase();
|
|
11442
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
11443
|
-
|
|
11444
|
-
if (elemTag !== tag) {
|
|
11445
|
-
elem.setAttribute(tag, true);
|
|
11446
|
-
}
|
|
11447
|
-
}
|
|
11448
|
-
|
|
11449
|
-
/**
|
|
11450
|
-
* Validates if an element is a specific Auro component.
|
|
11451
|
-
* @param {Object} elem - The element to validate.
|
|
11452
|
-
* @param {String} tagName - The name of the Auro component to check against.
|
|
11453
|
-
* @returns {Boolean} - Returns true if the element is the specified Auro component.
|
|
11454
|
-
*/
|
|
11455
|
-
elementMatch(elem, tagName) {
|
|
11456
|
-
const tag = tagName.toLowerCase();
|
|
11457
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
11458
|
-
|
|
11459
|
-
return elemTag === tag || elem.hasAttribute(tag);
|
|
11460
|
-
}
|
|
11461
|
-
};
|
|
11462
|
-
|
|
11463
|
-
var styleCss$6 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}:host,:host>span{position:relative}:host{width:2rem;height:2rem;display:inline-block;font-size:0}:host>span{position:absolute;display:inline-block;float:none;top:0;left:0;width:2rem;height:2rem;border-radius:100%;border-style:solid;border-width:0}:host([xs]),:host([xs])>span{width:1.2rem;height:1.2rem}:host([sm]),:host([sm])>span{width:3rem;height:3rem}:host([md]),:host([md])>span{width:5rem;height:5rem}:host([lg]),:host([lg])>span{width:8rem;height:8rem}:host{--margin:0.375rem;--margin-xs:0.2rem;--margin-sm:0.5rem;--margin-md:0.75rem;--margin-lg:1rem}:host([pulse]),:host([pulse])>span{position:relative}:host([pulse]){width:calc(3rem + var(--margin)*6);height:1.5rem}:host([pulse])>span{width:1rem;height:1rem;margin:var(--margin);animation:pulse 1.5s ease infinite}:host([pulse][xs]){width:calc(2.55rem + var(--margin-xs)*6);height:1.55rem}:host([pulse][xs])>span{margin:var(--margin-xs);width:.65rem;height:.65rem}:host([pulse][sm]){width:calc(6rem + var(--margin-sm)*6);height:2.5rem}:host([pulse][sm])>span{margin:var(--margin-sm);width:2rem;height:2rem}:host([pulse][md]){width:calc(9rem + var(--margin-md)*6);height:3.5rem}:host([pulse][md])>span{margin:var(--margin-md);width:3rem;height:3rem}:host([pulse][lg]){width:calc(15rem + var(--margin-lg)*6);height:5.5rem}:host([pulse][lg])>span{margin:var(--margin-lg);width:5rem;height:5rem}:host([pulse])>span:nth-child(1){animation-delay:-400ms}:host([pulse])>span:nth-child(2){animation-delay:-200ms}:host([pulse])>span:nth-child(3){animation-delay:0ms}@keyframes pulse{0%,100%{opacity:.1;transform:scale(0.9)}50%{opacity:1;transform:scale(1.1)}}:host([orbit]),:host([orbit])>span{opacity:1}:host([orbit])>span{border-width:5px}:host([orbit])>span:nth-child(2){animation:orbit 2s linear infinite}:host([orbit][sm])>span{border-width:8px}:host([orbit][md])>span{border-width:13px}:host([orbit][lg])>span{border-width:21px}@keyframes orbit{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}:host([ringworm])>svg{animation:rotate 2s linear infinite;height:100%;width:100%;stroke:currentcolor;stroke-width:8}:host([ringworm]) .path{stroke-dashoffset:0;animation:ringworm 1.5s ease-in-out infinite;stroke-linecap:round}@keyframes rotate{100%{transform:rotate(360deg)}}@keyframes ringworm{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}100%{stroke-dasharray:89,200;stroke-dashoffset:-124px}}:host([laser]){position:static;width:100%;display:block;height:0;overflow:hidden;font-size:unset}:host([laser])>span{position:fixed;width:100%;height:.25rem;border-radius:0;z-index:100}:host([laser])>span:nth-child(1){border-color:currentcolor;opacity:.25}:host([laser])>span:nth-child(2){border-color:currentcolor;animation:laser 2s linear infinite;opacity:1;width:50%}:host([laser][sm])>span:nth-child(2){width:20%}:host([laser][md])>span:nth-child(2){width:30%}:host([laser][lg])>span:nth-child(2){width:50%;animation-duration:1.5s}:host([laser][xl])>span:nth-child(2){width:80%;animation-duration:1.5s}@keyframes laser{0%{left:-100%}100%{left:110%}}:host>.no-animation{display:none}@media(prefers-reduced-motion: reduce){:host{display:flex;align-items:center;justify-content:center;font-size:1rem}:host>span{opacity:1}:host>.loader{display:none}:host>.no-animation{display:block}}`;
|
|
11464
|
-
|
|
11465
|
-
var colorCss$6 = i$5`:host{color:var(--ds-auro-loader-color)}:host>span{background-color:var(--ds-auro-loader-background-color);border-color:var(--ds-auro-loader-border-color)}:host([onlight]){--ds-auro-loader-color:var(--ds-color-utility-navy-default, #265688)}:host([ondark]){--ds-auro-loader-color:var(--ds-color-utility-cyan-inverse, #a8e9f7)}:host([white]){--ds-auro-loader-color:var(--ds-color-utility-neutral-inverse, #ccd2db)}:host([orbit])>span{--ds-auro-loader-background-color:transparent}:host([orbit])>span:nth-child(1){--ds-auro-loader-border-color:currentcolor;opacity:.25}:host([orbit])>span:nth-child(2){--ds-auro-loader-border-color:currentcolor;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent}`;
|
|
11466
|
-
|
|
11467
|
-
var tokensCss$6 = i$5`:host{--ds-auro-loader-background-color:currentcolor;--ds-auro-loader-border-color:currentcolor;--ds-auro-loader-color:currentcolor}`;
|
|
11468
|
-
|
|
11469
|
-
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
11470
|
-
// See LICENSE in the project root for license information.
|
|
11471
|
-
|
|
11472
|
-
|
|
11473
|
-
// See https://git.io/JJ6SJ for "How to document your components using JSDoc"
|
|
11474
|
-
/**
|
|
11475
|
-
* The auro-loader element is an easy to use animated loader component.
|
|
11476
|
-
*
|
|
11477
|
-
* @attr {Boolean} pulse - sets loader type
|
|
11478
|
-
* @attr {Boolean} ringworm - sets loader type
|
|
11479
|
-
* @attr {Boolean} laser - sets loader type
|
|
11480
|
-
* @attr {Boolean} orbit - sets loader type
|
|
11481
|
-
* @attr {Boolean} white - sets color of loader to white
|
|
11482
|
-
* @attr {Boolean} ondark - sets color of loader to auro-color-ui-default-on-dark
|
|
11483
|
-
* @attr {Boolean} onlight - sets color of loader to auro-color-ui-default-on-light
|
|
11484
|
-
* @attr {Boolean} xs - sets size to extra small
|
|
11485
|
-
* @attr {Boolean} sm - sets size to small
|
|
11486
|
-
* @attr {Boolean} md - sets size to medium
|
|
11487
|
-
* @attr {Boolean} lg - sets size to large
|
|
11488
|
-
* @csspart element - apply style to adjust speed of animation
|
|
11489
|
-
*/
|
|
11490
|
-
|
|
11491
|
-
// build the component class
|
|
11492
|
-
let AuroLoader$1 = class AuroLoader extends r$2 {
|
|
11493
|
-
constructor() {
|
|
11494
|
-
super();
|
|
11495
|
-
|
|
11496
|
-
/**
|
|
11497
|
-
* @private
|
|
11498
|
-
*/
|
|
11499
|
-
this.keys = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
|
|
11500
|
-
|
|
11501
|
-
/**
|
|
11502
|
-
* @private
|
|
11503
|
-
*/
|
|
11504
|
-
this.mdCount = 3;
|
|
11505
|
-
|
|
11506
|
-
/**
|
|
11507
|
-
* @private
|
|
11508
|
-
*/
|
|
11509
|
-
this.smCount = 2;
|
|
11510
|
-
|
|
11511
|
-
/**
|
|
11512
|
-
* @private
|
|
11513
|
-
*/
|
|
11514
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$6();
|
|
11515
|
-
|
|
11516
|
-
this.orbit = false;
|
|
11517
|
-
this.ringworm = false;
|
|
11518
|
-
this.laser = false;
|
|
11519
|
-
this.pulse = false;
|
|
11520
|
-
}
|
|
11521
|
-
|
|
11522
|
-
// function to define props used within the scope of this component
|
|
11523
|
-
static get properties() {
|
|
11524
|
-
return {
|
|
11525
|
-
pulse: {
|
|
11173
|
+
/**
|
|
11174
|
+
* Sets loader to laser type.
|
|
11175
|
+
*/
|
|
11176
|
+
laser: {
|
|
11526
11177
|
type: Boolean,
|
|
11527
11178
|
reflect: true
|
|
11528
11179
|
},
|
|
11180
|
+
|
|
11181
|
+
/**
|
|
11182
|
+
* Sets loader to orbit type.
|
|
11183
|
+
*/
|
|
11529
11184
|
orbit: {
|
|
11530
11185
|
type: Boolean,
|
|
11531
11186
|
reflect: true
|
|
11532
11187
|
},
|
|
11533
|
-
|
|
11188
|
+
|
|
11189
|
+
/**
|
|
11190
|
+
* Sets loader to pulse type.
|
|
11191
|
+
*/
|
|
11192
|
+
pulse: {
|
|
11534
11193
|
type: Boolean,
|
|
11535
11194
|
reflect: true
|
|
11536
11195
|
},
|
|
11537
|
-
|
|
11196
|
+
|
|
11197
|
+
/**
|
|
11198
|
+
* Sets loader to ringworm type.
|
|
11199
|
+
*/
|
|
11200
|
+
ringworm: {
|
|
11538
11201
|
type: Boolean,
|
|
11539
11202
|
reflect: true
|
|
11540
11203
|
}
|
|
@@ -11558,7 +11221,7 @@ let AuroLoader$1 = class AuroLoader extends r$2 {
|
|
|
11558
11221
|
*
|
|
11559
11222
|
*/
|
|
11560
11223
|
static register(name = "auro-loader") {
|
|
11561
|
-
AuroLibraryRuntimeUtils$
|
|
11224
|
+
AuroLibraryRuntimeUtils$4.prototype.registerComponent(name, AuroLoader);
|
|
11562
11225
|
}
|
|
11563
11226
|
|
|
11564
11227
|
firstUpdated() {
|
|
@@ -11608,23 +11271,26 @@ let AuroLoader$1 = class AuroLoader extends r$2 {
|
|
|
11608
11271
|
}
|
|
11609
11272
|
};
|
|
11610
11273
|
|
|
11611
|
-
var loaderVersion$1 = '
|
|
11274
|
+
var loaderVersion$1 = '5.0.0';
|
|
11612
11275
|
|
|
11276
|
+
/* eslint-disable max-lines */
|
|
11613
11277
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
11614
11278
|
// See LICENSE in the project root for license information.
|
|
11615
11279
|
|
|
11616
11280
|
|
|
11617
11281
|
/**
|
|
11618
11282
|
* @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
|
|
11619
|
-
* @attr {Boolean} disabled - If set to true button will become disabled and not allow for interactions
|
|
11283
|
+
* @attr {Boolean} disabled - If set to true, button will become disabled and not allow for interactions
|
|
11620
11284
|
* @attr {Boolean} iconOnly - If set to true, the button will contain an icon with no additional content
|
|
11621
11285
|
* @attr {Boolean} loading - If set to true button text will be replaced with `auro-loader` and become disabled
|
|
11286
|
+
* @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.
|
|
11622
11287
|
* @attr {Boolean} onDark - Set value for on-dark version of auro-button
|
|
11623
11288
|
* @attr {Boolean} rounded - If set to true, the button will have a rounded shape
|
|
11624
11289
|
* @attr {Boolean} slim - Set value for slim version of auro-button
|
|
11625
11290
|
* @attr {Boolean} fluid - Alters the shape of the button to be full width of its parent container
|
|
11626
11291
|
* @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.
|
|
11627
11292
|
* @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.
|
|
11293
|
+
* @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.
|
|
11628
11294
|
* @attr {String} id - Set the unique ID of an element.
|
|
11629
11295
|
* @attr {String} title - Sets title attribute. The information is most often shown as a tooltip text when the mouse moves over the element.
|
|
11630
11296
|
* @attr {String} type - The type of the button. Possible values are: `submit`, `reset`, `button`
|
|
@@ -11669,6 +11335,7 @@ let AuroButton$1 = class AuroButton extends r$2 {
|
|
|
11669
11335
|
this.rounded = false;
|
|
11670
11336
|
this.slim = false;
|
|
11671
11337
|
this.fluid = false;
|
|
11338
|
+
this.loadingText = this.loadingText || 'Loading...';
|
|
11672
11339
|
|
|
11673
11340
|
// Support for HTML5 forms
|
|
11674
11341
|
if (typeof this.attachInternals === 'function') {
|
|
@@ -11729,6 +11396,9 @@ let AuroButton$1 = class AuroButton extends r$2 {
|
|
|
11729
11396
|
type: Boolean,
|
|
11730
11397
|
reflect: true
|
|
11731
11398
|
},
|
|
11399
|
+
loadingText: {
|
|
11400
|
+
type: String
|
|
11401
|
+
},
|
|
11732
11402
|
onDark: {
|
|
11733
11403
|
type: Boolean,
|
|
11734
11404
|
reflect: true
|
|
@@ -11749,6 +11419,10 @@ let AuroButton$1 = class AuroButton extends r$2 {
|
|
|
11749
11419
|
type: String,
|
|
11750
11420
|
reflect: true
|
|
11751
11421
|
},
|
|
11422
|
+
ariaexpanded: {
|
|
11423
|
+
type: Boolean,
|
|
11424
|
+
reflect: true
|
|
11425
|
+
},
|
|
11752
11426
|
title: {
|
|
11753
11427
|
type: String,
|
|
11754
11428
|
reflect: true
|
|
@@ -11778,7 +11452,7 @@ let AuroButton$1 = class AuroButton extends r$2 {
|
|
|
11778
11452
|
*
|
|
11779
11453
|
*/
|
|
11780
11454
|
static register(name = "auro-button") {
|
|
11781
|
-
AuroLibraryRuntimeUtils$
|
|
11455
|
+
AuroLibraryRuntimeUtils$4.prototype.registerComponent(name, AuroButton);
|
|
11782
11456
|
}
|
|
11783
11457
|
|
|
11784
11458
|
/**
|
|
@@ -11820,12 +11494,22 @@ let AuroButton$1 = class AuroButton extends r$2 {
|
|
|
11820
11494
|
this.notifyReady();
|
|
11821
11495
|
}
|
|
11822
11496
|
|
|
11497
|
+
/**
|
|
11498
|
+
* Submits the form that this button is associated with.
|
|
11499
|
+
* @private
|
|
11500
|
+
* @returns {void}
|
|
11501
|
+
*/
|
|
11823
11502
|
surfaceSubmitEvent() {
|
|
11824
11503
|
if (this.form) {
|
|
11825
11504
|
this.form.requestSubmit();
|
|
11826
11505
|
}
|
|
11827
11506
|
}
|
|
11828
11507
|
|
|
11508
|
+
/**
|
|
11509
|
+
* Returns the form element that this button is associated with.
|
|
11510
|
+
* @private
|
|
11511
|
+
* @returns {HTMLFormElement|null}
|
|
11512
|
+
*/
|
|
11829
11513
|
get form() {
|
|
11830
11514
|
return this.internals ? this.internals.form : null;
|
|
11831
11515
|
}
|
|
@@ -11845,8 +11529,9 @@ let AuroButton$1 = class AuroButton extends r$2 {
|
|
|
11845
11529
|
return u$2`
|
|
11846
11530
|
<button
|
|
11847
11531
|
part="button"
|
|
11848
|
-
aria-label="${o(this.
|
|
11532
|
+
aria-label="${o(this.loading ? this.loadingText : this.arialabel || undefined)}"
|
|
11849
11533
|
aria-labelledby="${o(this.arialabelledby ? this.arialabelledby : undefined)}"
|
|
11534
|
+
aria-expanded="${o(this.ariaexpanded)}"
|
|
11850
11535
|
?autofocus="${this.autofocus}"
|
|
11851
11536
|
class="${e(classes)}"
|
|
11852
11537
|
?disabled="${this.disabled || this.loading}"
|
|
@@ -11923,6 +11608,10 @@ class AuroCalendar extends RangeDatepicker {
|
|
|
11923
11608
|
this.showPrevMonthBtn = true;
|
|
11924
11609
|
this.showNextMonthBtn = true;
|
|
11925
11610
|
|
|
11611
|
+
this.visible = false;
|
|
11612
|
+
this.largeFullscreenHeadline = false;
|
|
11613
|
+
this.isFullscreen = false;
|
|
11614
|
+
|
|
11926
11615
|
/**
|
|
11927
11616
|
* @private
|
|
11928
11617
|
*/
|
|
@@ -11938,14 +11627,12 @@ class AuroCalendar extends RangeDatepicker {
|
|
|
11938
11627
|
*/
|
|
11939
11628
|
this.numCalendars = undefined;
|
|
11940
11629
|
|
|
11941
|
-
this.visible = false;
|
|
11942
|
-
|
|
11943
11630
|
/**
|
|
11944
11631
|
* @private
|
|
11945
11632
|
*/
|
|
11946
11633
|
this.slots = {};
|
|
11947
11634
|
|
|
11948
|
-
const versioning = new AuroDependencyVersioning$
|
|
11635
|
+
const versioning = new AuroDependencyVersioning$3();
|
|
11949
11636
|
|
|
11950
11637
|
/**
|
|
11951
11638
|
* @private
|
|
@@ -12237,7 +11924,7 @@ if (!customElements.get('auro-formkit-calendar')) {
|
|
|
12237
11924
|
|
|
12238
11925
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
12239
11926
|
|
|
12240
|
-
let AuroLibraryRuntimeUtils$
|
|
11927
|
+
let AuroLibraryRuntimeUtils$1$1 = class AuroLibraryRuntimeUtils {
|
|
12241
11928
|
|
|
12242
11929
|
/* eslint-disable jsdoc/require-param */
|
|
12243
11930
|
|
|
@@ -14436,7 +14123,7 @@ class AuroFloatingUI {
|
|
|
14436
14123
|
// See LICENSE in the project root for license information.
|
|
14437
14124
|
|
|
14438
14125
|
|
|
14439
|
-
let AuroDependencyVersioning$
|
|
14126
|
+
let AuroDependencyVersioning$1 = class AuroDependencyVersioning {
|
|
14440
14127
|
|
|
14441
14128
|
/**
|
|
14442
14129
|
* Generates a unique string to be used for child auro element naming.
|
|
@@ -14538,7 +14225,7 @@ const cacheFetch$1 = (uri, options = {}) => {
|
|
|
14538
14225
|
return _fetchMap$1.get(uri);
|
|
14539
14226
|
};
|
|
14540
14227
|
|
|
14541
|
-
var styleCss$3$1 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.ico_squareLarge{fill:currentColor;height:var(--auro-size-lg, var(--ds-size-300, 1.5rem))}.ico_squareSmall{fill:currentColor;height:.6rem}.ico_squareMed{fill:currentColor;height:var(--auro-size-md, var(--ds-size-200, 1rem))}.ico_squareSml{fill:currentColor;height:var(--auro-size-sm, var(--ds-size-150, 0.75rem))}:host{color:currentColor;vertical-align:middle;line-height:1;display:inline-block}
|
|
14228
|
+
var styleCss$3$1 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.ico_squareLarge{fill:currentColor;height:var(--auro-size-lg, var(--ds-size-300, 1.5rem))}.ico_squareSmall{fill:currentColor;height:.6rem}.ico_squareMed{fill:currentColor;height:var(--auro-size-md, var(--ds-size-200, 1rem))}.ico_squareSml{fill:currentColor;height:var(--auro-size-sm, var(--ds-size-150, 0.75rem))}:host{color:currentColor;vertical-align:middle;line-height:1;display:inline-block}svg{min-width:var(--ds-auro-icon-size, 1.5rem) !important;width:var(--ds-auro-icon-size, 1.5rem) !important;height:var(--ds-auro-icon-size, 1.5rem) !important}.componentWrapper{display:flex}.svgWrapper{height:var(--ds-auro-icon-size);width:var(--ds-auro-icon-size)}.labelWrapper{margin-left:var(--ds-size-50, 0.25rem);line-height:1.8}`;
|
|
14542
14229
|
|
|
14543
14230
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
14544
14231
|
// See LICENSE in the project root for license information.
|
|
@@ -14546,7 +14233,6 @@ var styleCss$3$1 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}
|
|
|
14546
14233
|
|
|
14547
14234
|
// See https://git.io/JJ6SJ for "How to document your components using JSDoc"
|
|
14548
14235
|
/**
|
|
14549
|
-
* @attr {Boolean} onDark - Set value for on-dark version of auro-icon
|
|
14550
14236
|
* @slot - Hidden from visibility, used for a11y if icon description is needed
|
|
14551
14237
|
*/
|
|
14552
14238
|
|
|
@@ -14561,6 +14247,10 @@ let BaseIcon$1 = class BaseIcon extends AuroElement$1 {
|
|
|
14561
14247
|
static get properties() {
|
|
14562
14248
|
return {
|
|
14563
14249
|
...super.properties,
|
|
14250
|
+
|
|
14251
|
+
/**
|
|
14252
|
+
* Set value for on-dark version of auro-icon.
|
|
14253
|
+
*/
|
|
14564
14254
|
onDark: {
|
|
14565
14255
|
type: Boolean,
|
|
14566
14256
|
reflect: true
|
|
@@ -14619,135 +14309,44 @@ let BaseIcon$1 = class BaseIcon extends AuroElement$1 {
|
|
|
14619
14309
|
}
|
|
14620
14310
|
};
|
|
14621
14311
|
|
|
14622
|
-
var tokensCss$2$1 = i$5`:host{--ds-auro-icon-color:var(--ds-color-
|
|
14312
|
+
var tokensCss$2$1 = i$5`:host{--ds-auro-icon-color:var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-alaska-color:#02426D;--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}`;
|
|
14623
14313
|
|
|
14624
|
-
var colorCss$3$1 = i$5`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[
|
|
14314
|
+
var colorCss$3$1 = i$5`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[variant=accent1]){--ds-auro-icon-color:var(--ds-basic-color-texticon-accent1, #265688)}:host(:not([onDark])[variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:not([onDark])[variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-muted, #676767)}:host(:not([onDark])[variant=statusDefault]){--ds-auro-icon-color:var(--ds-basic-color-status-default, #afb9c6)}:host(:not([onDark])[variant=statusInfo]){--ds-auro-icon-color:var(--ds-basic-color-status-info, #01426a)}:host(:not([onDark])[variant=statusSuccess]){--ds-auro-icon-color:var(--ds-basic-color-status-success, #447a1f)}:host(:not([onDark])[variant=statusWarning]){--ds-auro-icon-color:var(--ds-basic-color-status-warning, #fac200)}:host(:not([onDark])[variant=statusError]){--ds-auro-icon-color:var(--ds-basic-color-status-error, #e31f26)}:host(:not([onDark])[variant=statusInfoSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-info-subtle, #ebf3f9)}:host(:not([onDark])[variant=statusSuccessSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-success-subtle, #d6eac7)}:host(:not([onDark])[variant=statusWarningSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-warning-subtle, #fff0b2)}:host(:not([onDark])[variant=statusErrorSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-error-subtle, #fbc6c6)}:host(:not([onDark])[variant=fareBasicEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-basiceconomy, #97eaf8)}:host(:not([onDark])[variant=fareBusiness]){--ds-auro-icon-color:var(--ds-basic-color-fare-business, #01426a)}:host(:not([onDark])[variant=fareEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-economy, #0074ca)}:host(:not([onDark])[variant=fareFirst]){--ds-auro-icon-color:var(--ds-basic-color-fare-first, #00274a)}:host(:not([onDark])[variant=farePremiumEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-premiumeconomy, #005154)}:host(:not([onDark])[variant=fareOneWorldEmerald]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-emerald, #139142)}:host(:not([onDark])[variant=fareOneWorldSapphire]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-sapphire, #015daa)}:host(:not([onDark])[variant=fareOneWorldRuby]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-ruby, #a41d4a)}:host([onDark]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse, #ffffff)}:host([onDark][variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([onDark][variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}`;
|
|
14625
14315
|
|
|
14626
|
-
// Copyright (c) Alaska
|
|
14316
|
+
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
14627
14317
|
// See LICENSE in the project root for license information.
|
|
14628
14318
|
|
|
14629
|
-
// ---------------------------------------------------------------------
|
|
14630
|
-
|
|
14631
|
-
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
14632
|
-
|
|
14633
|
-
let AuroLibraryRuntimeUtils$1$1 = class AuroLibraryRuntimeUtils {
|
|
14634
14319
|
|
|
14635
|
-
|
|
14320
|
+
let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
14321
|
+
constructor() {
|
|
14322
|
+
super();
|
|
14636
14323
|
|
|
14637
|
-
|
|
14638
|
-
|
|
14639
|
-
* @param {String} name - The name of the custom element.
|
|
14640
|
-
* @param {Object} componentClass - The class to register as a custom element.
|
|
14641
|
-
* @returns {void}
|
|
14642
|
-
*/
|
|
14643
|
-
registerComponent(name, componentClass) {
|
|
14644
|
-
if (!customElements.get(name)) {
|
|
14645
|
-
customElements.define(name, class extends componentClass {});
|
|
14646
|
-
}
|
|
14324
|
+
this.variant = undefined;
|
|
14325
|
+
this.privateDefaults();
|
|
14647
14326
|
}
|
|
14648
14327
|
|
|
14649
14328
|
/**
|
|
14650
|
-
*
|
|
14329
|
+
* Internal Defaults.
|
|
14330
|
+
* @private
|
|
14651
14331
|
* @returns {void}
|
|
14652
14332
|
*/
|
|
14653
|
-
|
|
14654
|
-
|
|
14655
|
-
|
|
14656
|
-
__Closest = (el, found = el && el.closest(selector)) =>
|
|
14657
|
-
!el || el === document || el === window
|
|
14658
|
-
? null // standard .closest() returns null for non-found selectors also
|
|
14659
|
-
: found
|
|
14660
|
-
? found // found a selector INside this element
|
|
14661
|
-
: __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
|
|
14662
|
-
) {
|
|
14663
|
-
return __Closest(base);
|
|
14333
|
+
privateDefaults() {
|
|
14334
|
+
this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
|
|
14335
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$1$1();
|
|
14664
14336
|
}
|
|
14665
|
-
/* eslint-enable jsdoc/require-param */
|
|
14666
14337
|
|
|
14667
|
-
|
|
14668
|
-
|
|
14669
|
-
|
|
14670
|
-
|
|
14671
|
-
* @returns {void}
|
|
14672
|
-
*/
|
|
14673
|
-
handleComponentTagRename(elem, tagName) {
|
|
14674
|
-
const tag = tagName.toLowerCase();
|
|
14675
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
14338
|
+
// function to define props used within the scope of this component
|
|
14339
|
+
static get properties() {
|
|
14340
|
+
return {
|
|
14341
|
+
...super.properties,
|
|
14676
14342
|
|
|
14677
|
-
|
|
14678
|
-
|
|
14679
|
-
|
|
14680
|
-
|
|
14681
|
-
|
|
14682
|
-
|
|
14683
|
-
|
|
14684
|
-
* @param {Object} elem - The element to validate.
|
|
14685
|
-
* @param {String} tagName - The name of the Auro component to check against.
|
|
14686
|
-
* @returns {Boolean} - Returns true if the element is the specified Auro component.
|
|
14687
|
-
*/
|
|
14688
|
-
elementMatch(elem, tagName) {
|
|
14689
|
-
const tag = tagName.toLowerCase();
|
|
14690
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
14691
|
-
|
|
14692
|
-
return elemTag === tag || elem.hasAttribute(tag);
|
|
14693
|
-
}
|
|
14694
|
-
};
|
|
14695
|
-
|
|
14696
|
-
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
14697
|
-
// See LICENSE in the project root for license information.
|
|
14698
|
-
|
|
14699
|
-
|
|
14700
|
-
let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
14701
|
-
constructor() {
|
|
14702
|
-
super();
|
|
14703
|
-
|
|
14704
|
-
this.privateDefaults();
|
|
14705
|
-
}
|
|
14706
|
-
|
|
14707
|
-
/**
|
|
14708
|
-
* Internal Defaults.
|
|
14709
|
-
* @private
|
|
14710
|
-
* @returns {void}
|
|
14711
|
-
*/
|
|
14712
|
-
privateDefaults() {
|
|
14713
|
-
this.accent = false;
|
|
14714
|
-
this.customColor = false;
|
|
14715
|
-
this.customSvg = false;
|
|
14716
|
-
this.disabled = false;
|
|
14717
|
-
this.emphasis = false;
|
|
14718
|
-
this.error = false;
|
|
14719
|
-
this.info = false;
|
|
14720
|
-
this.label = false;
|
|
14721
|
-
this.primary = false;
|
|
14722
|
-
this.secondary = false;
|
|
14723
|
-
this.subtle = false;
|
|
14724
|
-
this.success = false;
|
|
14725
|
-
this.tertiary = false;
|
|
14726
|
-
this.warning = false;
|
|
14727
|
-
this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
|
|
14728
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$1$1();
|
|
14729
|
-
}
|
|
14730
|
-
|
|
14731
|
-
// function to define props used within the scope of this component
|
|
14732
|
-
static get properties() {
|
|
14733
|
-
return {
|
|
14734
|
-
...super.properties,
|
|
14735
|
-
|
|
14736
|
-
/**
|
|
14737
|
-
* Sets the icon to use the accent style.
|
|
14738
|
-
*/
|
|
14739
|
-
accent: {
|
|
14740
|
-
type: Boolean,
|
|
14741
|
-
reflect: true
|
|
14742
|
-
},
|
|
14743
|
-
|
|
14744
|
-
/**
|
|
14745
|
-
* Set aria-hidden value. Default is `true`. Option is `false`.
|
|
14746
|
-
*/
|
|
14747
|
-
ariaHidden: {
|
|
14748
|
-
type: String,
|
|
14749
|
-
reflect: true
|
|
14750
|
-
},
|
|
14343
|
+
/**
|
|
14344
|
+
* Set aria-hidden value. Default is `true`. Option is `false`.
|
|
14345
|
+
*/
|
|
14346
|
+
ariaHidden: {
|
|
14347
|
+
type: String,
|
|
14348
|
+
reflect: true
|
|
14349
|
+
},
|
|
14751
14350
|
|
|
14752
14351
|
/**
|
|
14753
14352
|
* The category of the icon you are looking for. See https://auro.alaskaair.com/icons/usage.
|
|
@@ -14771,38 +14370,6 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
|
14771
14370
|
type: Boolean
|
|
14772
14371
|
},
|
|
14773
14372
|
|
|
14774
|
-
/**
|
|
14775
|
-
* Sets the icon to use the disabled style.
|
|
14776
|
-
*/
|
|
14777
|
-
disabled: {
|
|
14778
|
-
type: Boolean,
|
|
14779
|
-
reflect: true
|
|
14780
|
-
},
|
|
14781
|
-
|
|
14782
|
-
/**
|
|
14783
|
-
* Sets the icon to use the emphasis style.
|
|
14784
|
-
*/
|
|
14785
|
-
emphasis: {
|
|
14786
|
-
type: Boolean,
|
|
14787
|
-
reflect: true
|
|
14788
|
-
},
|
|
14789
|
-
|
|
14790
|
-
/**
|
|
14791
|
-
* Sets the icon to use the error style.
|
|
14792
|
-
*/
|
|
14793
|
-
error: {
|
|
14794
|
-
type: Boolean,
|
|
14795
|
-
reflect: true
|
|
14796
|
-
},
|
|
14797
|
-
|
|
14798
|
-
/**
|
|
14799
|
-
* Sets the icon to use the info style.
|
|
14800
|
-
*/
|
|
14801
|
-
info: {
|
|
14802
|
-
type: Boolean,
|
|
14803
|
-
reflect: true
|
|
14804
|
-
},
|
|
14805
|
-
|
|
14806
14373
|
/**
|
|
14807
14374
|
* Exposes content in slot as icon label.
|
|
14808
14375
|
*/
|
|
@@ -14820,50 +14387,10 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
|
14820
14387
|
},
|
|
14821
14388
|
|
|
14822
14389
|
/**
|
|
14823
|
-
*
|
|
14824
|
-
*/
|
|
14825
|
-
primary: {
|
|
14826
|
-
type: Boolean,
|
|
14827
|
-
reflect: true
|
|
14828
|
-
},
|
|
14829
|
-
|
|
14830
|
-
/**
|
|
14831
|
-
* Sets the icon to use the secondary style.
|
|
14832
|
-
*/
|
|
14833
|
-
secondary: {
|
|
14834
|
-
type: Boolean,
|
|
14835
|
-
reflect: true
|
|
14836
|
-
},
|
|
14837
|
-
|
|
14838
|
-
/**
|
|
14839
|
-
* Sets the icon to use the subtle style.
|
|
14840
|
-
*/
|
|
14841
|
-
subtle: {
|
|
14842
|
-
type: Boolean,
|
|
14843
|
-
reflect: true
|
|
14844
|
-
},
|
|
14845
|
-
|
|
14846
|
-
/**
|
|
14847
|
-
* Sets the icon to use the success style.
|
|
14390
|
+
* 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`.
|
|
14848
14391
|
*/
|
|
14849
|
-
|
|
14850
|
-
type:
|
|
14851
|
-
reflect: true
|
|
14852
|
-
},
|
|
14853
|
-
|
|
14854
|
-
/**
|
|
14855
|
-
* Sets the icon to use the tertiary style.
|
|
14856
|
-
*/
|
|
14857
|
-
tertiary: {
|
|
14858
|
-
type: Boolean,
|
|
14859
|
-
reflect: true
|
|
14860
|
-
},
|
|
14861
|
-
|
|
14862
|
-
/**
|
|
14863
|
-
* Sets the icon to use the warning style.
|
|
14864
|
-
*/
|
|
14865
|
-
warning: {
|
|
14866
|
-
type: Boolean,
|
|
14392
|
+
variant: {
|
|
14393
|
+
type: String,
|
|
14867
14394
|
reflect: true
|
|
14868
14395
|
}
|
|
14869
14396
|
};
|
|
@@ -14959,7 +14486,7 @@ var styleCss$2$1 = i$5`:host{position:absolute;z-index:var(--depth-tooltip, 400)
|
|
|
14959
14486
|
|
|
14960
14487
|
var colorCss$2$1 = i$5`.container{background-color:var(--ds-auro-dropdownbib-container-color);box-shadow:var(--ds-auro-dropdownbib-boxshadow-color);color:var(--ds-auro-dropdownbib-text-color)}`;
|
|
14961
14488
|
|
|
14962
|
-
var tokensCss$1$1 = i$5`:host{--ds-auro-dropdown-label-text-color: var(--ds-
|
|
14489
|
+
var tokensCss$1$1 = i$5`:host{--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-dropdown-trigger-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-border-color: transparent;--ds-auro-dropdown-trigger-outline-color: transparent;--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-dropdownbib-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdownbib-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}`;
|
|
14963
14490
|
|
|
14964
14491
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
14965
14492
|
// See LICENSE in the project root for license information.
|
|
@@ -14989,7 +14516,7 @@ class AuroDropdownBib extends r$2 {
|
|
|
14989
14516
|
*/
|
|
14990
14517
|
this._mobileBreakpointValue = undefined;
|
|
14991
14518
|
|
|
14992
|
-
AuroLibraryRuntimeUtils$
|
|
14519
|
+
AuroLibraryRuntimeUtils$1$1.prototype.handleComponentTagRename(this, 'auro-dropdownbib');
|
|
14993
14520
|
}
|
|
14994
14521
|
|
|
14995
14522
|
static get styles() {
|
|
@@ -15082,13 +14609,13 @@ var dropdownVersion$1 = '3.0.0';
|
|
|
15082
14609
|
|
|
15083
14610
|
var styleCss$1$1 = i$5`:host{position:relative;display:inline-block;max-width:100%}:host([fluid]){display:block}#bibSizer{position:absolute;z-index:-1;opacity:0;pointer-events:none}.label{font-size:var(--ds-text-body-size-xs, 0.75rem);line-height:var(--ds-text-body-size-default, 1rem);transition:font-size .3s cubic-bezier(0.215, 0.61, 0.355, 1);white-space:normal}.label[hasTrigger=false]{font-size:var(--ds-text-body-size-default, 1rem)}.trigger{position:relative;display:flex;align-items:center}.trigger[showBorder]{border-width:1px;border-style:solid;cursor:pointer;outline-style:solid;outline-width:1px}@media(hover: hover){.trigger:hover{cursor:pointer}}.triggerContentWrapper{overflow:hidden;flex:1;text-overflow:ellipsis;white-space:nowrap}#showStateIcon{display:flex;overflow:hidden;height:100%;align-items:center;margin-left:var(--ds-size-100, 0.5rem)}#showStateIcon [auro-icon]{height:var(--ds-size-300, 1.5rem);line-height:var(--ds-size-300, 1.5rem)}#showStateIcon[data-expanded=true] [auro-icon]{transform:rotate(-180deg)}:host([matchwidth]) #bibSizer{width:100%}:host([disabled]){pointer-events:none}:host([inset]) .trigger{padding:var(--ds-size-150, 0.75rem) var(--ds-size-200, 1rem)}:host([common]) .trigger,:host([inset][bordered]) .trigger{padding:var(--ds-size-200, 1rem) var(--ds-size-150, 0.75rem)}:host([inset][bordered][labeled]) .trigger{padding:var(--ds-size-100, 0.5rem) var(--ds-size-150, 0.75rem)}:host([common]) .trigger,:host([rounded]) .trigger{border-radius:var(--ds-border-radius, 0.375rem)}`;
|
|
15084
14611
|
|
|
15085
|
-
var colorCss$1$1 = i$5`.label{color:var(--ds-auro-dropdown-label-text-color)}.trigger{border-color:var(--ds-auro-dropdown-trigger-border-color);background-color:var(--ds-auro-dropdown-trigger-container-color);color:var(--ds-auro-dropdown-trigger-text-color);outline-color:var(--ds-auro-dropdown-trigger-outline-color)}.trigger:focus-within,.trigger:active{--ds-auro-dropdown-trigger-border-color: var(--ds-color-
|
|
14612
|
+
var colorCss$1$1 = i$5`.label{color:var(--ds-auro-dropdown-label-text-color)}.trigger{border-color:var(--ds-auro-dropdown-trigger-border-color);background-color:var(--ds-auro-dropdown-trigger-container-color);color:var(--ds-auro-dropdown-trigger-text-color);outline-color:var(--ds-auro-dropdown-trigger-outline-color)}.trigger:focus-within,.trigger:active{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused, #01426a);--ds-auro-dropdown-trigger-outline-color: var(--ds-advanced-color-state-focused, #01426a)}:host([disabled]){--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0);--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host([common]),:host([bordered]){--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-bold, #585e67)}:host([common]) .trigger:active,:host([common]) .trigger:focus-within,:host([bordered]) .trigger:active,:host([bordered]) .trigger:focus-within{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused, #01426a)}:host([error]){--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-status-error, #e31f26)}:host([error]) .trigger{outline:solid 1px var(--ds-auro-dropdown-trigger-border-color)}:host([error]) .trigger:focus-within,:host([error]) .trigger:active{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused, #01426a);--ds-auro-dropdown-trigger-outline-color: var(--ds-advanced-color-state-focused, #01426a)}:host([disabled][common]),:host([disabled][bordered]){--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-subtle, #dddddd)}:host([onDark]){--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db);--ds-auro-dropdown-trigger-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-inverse, #ffffff)}:host([onDark]):focus-within,:host([onDark]):active{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-dropdown-trigger-outline-color: var(--ds-advanced-color-state-focused-inverse, #ffffff)}:host([onDark][disabled]){--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894);--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([onDark][common]),:host([onDark][bordered]){--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-inverse, #ffffff)}:host([onDark][common]) .trigger:focus-within,:host([onDark][common]) .trigger:active,:host([onDark][bordered]) .trigger:focus-within,:host([onDark][bordered]) .trigger:active{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-dropdown-trigger-outline-color: var(--ds-advanced-color-state-focused-inverse, #ffffff)}:host([onDark][error]){--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8)}:host([onDark][error]) .trigger{outline:solid 1px var(--ds-auro-dropdown-trigger-border-color)}:host([onDark][error]) .trigger:focus-within,:host([onDark][error]) .trigger:active{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-dropdown-trigger-outline-color: var(--ds-advanced-color-state-focused-inverse, #ffffff)}:host([onDark][disabled][common]),:host([onDark][disabled][bordered]){--ds-auro-dropdown-trigger-container-color: var(--ds-advanced-color-shared-background-inverse-disabled, rgba(255, 255, 255, 0.1))}`;
|
|
15086
14613
|
|
|
15087
|
-
var colorCss$5 = i$5`:host([error]){--ds-auro-helptext-color: var(--ds-color-
|
|
14614
|
+
var colorCss$5 = i$5`:host([error]){--ds-auro-helptext-color: var(--ds-basic-color-status-error, #e31f26)}:host([onDark]){--ds-auro-helptext-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}:host([onDark][error]){--ds-auro-helptext-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8)}.helptext-wrapper{color:var(--ds-auro-helptext-color)}`;
|
|
15088
14615
|
|
|
15089
14616
|
var styleCss$5 = i$5`.helptext-wrapper{display:none;font-size:var(--ds-text-body-size-xs, 0.75rem);line-height:var(--ds-size-200, 1rem)}:host([large]) .helptext-wrapper{font-size:var(--ds-text-body-size-default, 1rem)}.helptext-wrapper[visible]{display:block}::slotted(*:not(:empty)){margin-top:var(--ds-size-50, 0.25rem);margin-bottom:0}::slotted(p){margin-block:0}`;
|
|
15090
14617
|
|
|
15091
|
-
var tokensCss$5 = i$5`:host{--ds-auro-helptext-color: var(--ds-color-
|
|
14618
|
+
var tokensCss$5 = i$5`:host{--ds-auro-helptext-color: var(--ds-basic-color-texticon-muted, #676767)}`;
|
|
15092
14619
|
|
|
15093
14620
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
15094
14621
|
// See LICENSE in the project root for license information.
|
|
@@ -15097,7 +14624,7 @@ var tokensCss$5 = i$5`:host{--ds-auro-helptext-color: var(--ds-color-text-tertia
|
|
|
15097
14624
|
|
|
15098
14625
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
15099
14626
|
|
|
15100
|
-
let AuroLibraryRuntimeUtils$
|
|
14627
|
+
let AuroLibraryRuntimeUtils$2 = class AuroLibraryRuntimeUtils {
|
|
15101
14628
|
|
|
15102
14629
|
/* eslint-disable jsdoc/require-param */
|
|
15103
14630
|
|
|
@@ -15175,9 +14702,10 @@ let AuroHelpText$1 = class AuroHelpText extends r$2 {
|
|
|
15175
14702
|
super();
|
|
15176
14703
|
|
|
15177
14704
|
this.error = false;
|
|
14705
|
+
this.onDark = false;
|
|
15178
14706
|
this.hasTextContent = false;
|
|
15179
14707
|
|
|
15180
|
-
AuroLibraryRuntimeUtils$
|
|
14708
|
+
AuroLibraryRuntimeUtils$2.prototype.handleComponentTagRename(this, 'auro-helptext');
|
|
15181
14709
|
}
|
|
15182
14710
|
|
|
15183
14711
|
static get styles() {
|
|
@@ -15213,6 +14741,14 @@ let AuroHelpText$1 = class AuroHelpText extends r$2 {
|
|
|
15213
14741
|
type: Boolean,
|
|
15214
14742
|
reflect: true,
|
|
15215
14743
|
},
|
|
14744
|
+
|
|
14745
|
+
/**
|
|
14746
|
+
* If declared, will apply onDark styles.
|
|
14747
|
+
*/
|
|
14748
|
+
onDark: {
|
|
14749
|
+
type: Boolean,
|
|
14750
|
+
reflect: true
|
|
14751
|
+
}
|
|
15216
14752
|
};
|
|
15217
14753
|
}
|
|
15218
14754
|
|
|
@@ -15225,7 +14761,7 @@ let AuroHelpText$1 = class AuroHelpText extends r$2 {
|
|
|
15225
14761
|
*
|
|
15226
14762
|
*/
|
|
15227
14763
|
static register(name = "auro-helptext") {
|
|
15228
|
-
AuroLibraryRuntimeUtils$
|
|
14764
|
+
AuroLibraryRuntimeUtils$2.prototype.registerComponent(name, AuroHelpText);
|
|
15229
14765
|
}
|
|
15230
14766
|
|
|
15231
14767
|
updated() {
|
|
@@ -15344,6 +14880,7 @@ class AuroDropdown extends r$2 {
|
|
|
15344
14880
|
this.tabIndex = 0;
|
|
15345
14881
|
this.noToggle = false;
|
|
15346
14882
|
this.labeled = true;
|
|
14883
|
+
this.onDark = false;
|
|
15347
14884
|
|
|
15348
14885
|
// floaterConfig
|
|
15349
14886
|
this.placement = 'bottom-start';
|
|
@@ -15364,7 +14901,7 @@ class AuroDropdown extends r$2 {
|
|
|
15364
14901
|
/**
|
|
15365
14902
|
* @private
|
|
15366
14903
|
*/
|
|
15367
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
14904
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$1$1();
|
|
15368
14905
|
|
|
15369
14906
|
/**
|
|
15370
14907
|
* @private
|
|
@@ -15374,7 +14911,7 @@ class AuroDropdown extends r$2 {
|
|
|
15374
14911
|
/**
|
|
15375
14912
|
* Generate unique names for dependency components.
|
|
15376
14913
|
*/
|
|
15377
|
-
const versioning = new AuroDependencyVersioning$
|
|
14914
|
+
const versioning = new AuroDependencyVersioning$1();
|
|
15378
14915
|
|
|
15379
14916
|
/**
|
|
15380
14917
|
* @private
|
|
@@ -15600,6 +15137,14 @@ class AuroDropdown extends r$2 {
|
|
|
15600
15137
|
reflect: true
|
|
15601
15138
|
},
|
|
15602
15139
|
|
|
15140
|
+
/**
|
|
15141
|
+
* If declared, onDark styles will be applied.
|
|
15142
|
+
*/
|
|
15143
|
+
onDark: {
|
|
15144
|
+
type: Boolean,
|
|
15145
|
+
reflect: true
|
|
15146
|
+
},
|
|
15147
|
+
|
|
15603
15148
|
onSlotChange: {
|
|
15604
15149
|
type: Function,
|
|
15605
15150
|
reflect: false
|
|
@@ -15653,7 +15198,7 @@ class AuroDropdown extends r$2 {
|
|
|
15653
15198
|
*
|
|
15654
15199
|
*/
|
|
15655
15200
|
static register(name = "auro-dropdown") {
|
|
15656
|
-
AuroLibraryRuntimeUtils$
|
|
15201
|
+
AuroLibraryRuntimeUtils$1$1.prototype.registerComponent(name, AuroDropdown);
|
|
15657
15202
|
}
|
|
15658
15203
|
|
|
15659
15204
|
connectedCallback() {
|
|
@@ -15970,14 +15515,14 @@ class AuroDropdown extends r$2 {
|
|
|
15970
15515
|
<${this.iconTag}
|
|
15971
15516
|
category="interface"
|
|
15972
15517
|
name="chevron-down"
|
|
15973
|
-
|
|
15974
|
-
|
|
15518
|
+
?onDark="${this.onDark}"
|
|
15519
|
+
variant="${this.disabled ? 'disabled' : 'muted'}">
|
|
15975
15520
|
>
|
|
15976
15521
|
</${this.iconTag}>
|
|
15977
15522
|
</div>
|
|
15978
15523
|
` : undefined }
|
|
15979
15524
|
</div>
|
|
15980
|
-
<${this.helpTextTag} part="helpText" ?error="${this.error}">
|
|
15525
|
+
<${this.helpTextTag} part="helpText" ?onDark=${this.onDark} ?error="${this.error}">
|
|
15981
15526
|
<slot name="helpText"></slot>
|
|
15982
15527
|
</${this.helpTextTag}>
|
|
15983
15528
|
<div class="slotContent">
|
|
@@ -16134,11 +15679,11 @@ function stopNotifyingOnLangChange(element) {
|
|
|
16134
15679
|
watchedItems.delete(element);
|
|
16135
15680
|
}
|
|
16136
15681
|
|
|
16137
|
-
var styleCss$4 = i$5
|
|
15682
|
+
var styleCss$4 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.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)}`;
|
|
16138
15683
|
|
|
16139
|
-
var colorCss$4 = i$5`.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-
|
|
15684
|
+
var colorCss$4 = i$5`.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))}`;
|
|
16140
15685
|
|
|
16141
|
-
var tokensCss$4 = i$5`:host{--ds-auro-input-border-color: var(--ds-color-border-
|
|
15686
|
+
var tokensCss$4 = i$5`: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)}`;
|
|
16142
15687
|
|
|
16143
15688
|
/** Checks if value is string */
|
|
16144
15689
|
function isString(str) {
|
|
@@ -19989,7 +19534,7 @@ class AuroInputUtilities {
|
|
|
19989
19534
|
|
|
19990
19535
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
19991
19536
|
|
|
19992
|
-
let AuroLibraryRuntimeUtils$
|
|
19537
|
+
let AuroLibraryRuntimeUtils$1 = class AuroLibraryRuntimeUtils {
|
|
19993
19538
|
|
|
19994
19539
|
/* eslint-disable jsdoc/require-param */
|
|
19995
19540
|
|
|
@@ -20058,7 +19603,7 @@ let AuroLibraryRuntimeUtils$4 = class AuroLibraryRuntimeUtils {
|
|
|
20058
19603
|
|
|
20059
19604
|
class AuroFormValidation {
|
|
20060
19605
|
constructor() {
|
|
20061
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
19606
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$1();
|
|
20062
19607
|
}
|
|
20063
19608
|
|
|
20064
19609
|
/**
|
|
@@ -20398,6 +19943,7 @@ class BaseInput extends r$2 {
|
|
|
20398
19943
|
this.min = undefined;
|
|
20399
19944
|
this.maxLength = undefined;
|
|
20400
19945
|
this.minLength = undefined;
|
|
19946
|
+
this.onDark = false;
|
|
20401
19947
|
this.activeLabel = false;
|
|
20402
19948
|
this.setCustomValidityForType = undefined;
|
|
20403
19949
|
}
|
|
@@ -20499,7 +20045,8 @@ class BaseInput extends r$2 {
|
|
|
20499
20045
|
* If set, disables the input.
|
|
20500
20046
|
*/
|
|
20501
20047
|
disabled: {
|
|
20502
|
-
type: Boolean
|
|
20048
|
+
type: Boolean,
|
|
20049
|
+
reflect: true
|
|
20503
20050
|
},
|
|
20504
20051
|
|
|
20505
20052
|
/**
|
|
@@ -20529,7 +20076,8 @@ class BaseInput extends r$2 {
|
|
|
20529
20076
|
* 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.
|
|
20530
20077
|
*/
|
|
20531
20078
|
icon: {
|
|
20532
|
-
type: Boolean
|
|
20079
|
+
type: Boolean,
|
|
20080
|
+
reflect: true
|
|
20533
20081
|
},
|
|
20534
20082
|
|
|
20535
20083
|
/**
|
|
@@ -20585,7 +20133,16 @@ class BaseInput extends r$2 {
|
|
|
20585
20133
|
* If set, disables auto-validation on blur.
|
|
20586
20134
|
*/
|
|
20587
20135
|
noValidate: {
|
|
20588
|
-
type: Boolean
|
|
20136
|
+
type: Boolean,
|
|
20137
|
+
reflect: true
|
|
20138
|
+
},
|
|
20139
|
+
|
|
20140
|
+
/**
|
|
20141
|
+
* Sets onDark styles on input.
|
|
20142
|
+
*/
|
|
20143
|
+
onDark: {
|
|
20144
|
+
type: Boolean,
|
|
20145
|
+
reflect: true
|
|
20589
20146
|
},
|
|
20590
20147
|
|
|
20591
20148
|
/**
|
|
@@ -20607,14 +20164,16 @@ class BaseInput extends r$2 {
|
|
|
20607
20164
|
* Makes the input read-only, but can be set programmatically.
|
|
20608
20165
|
*/
|
|
20609
20166
|
readonly: {
|
|
20610
|
-
type: Boolean
|
|
20167
|
+
type: Boolean,
|
|
20168
|
+
reflect: true
|
|
20611
20169
|
},
|
|
20612
20170
|
|
|
20613
20171
|
/**
|
|
20614
20172
|
* Populates the `required` attribute on the input. Used for client-side validation.
|
|
20615
20173
|
*/
|
|
20616
20174
|
required: {
|
|
20617
|
-
type: Boolean
|
|
20175
|
+
type: Boolean,
|
|
20176
|
+
reflect: true
|
|
20618
20177
|
},
|
|
20619
20178
|
|
|
20620
20179
|
/**
|
|
@@ -21322,7 +20881,7 @@ class BaseInput extends r$2 {
|
|
|
21322
20881
|
// See LICENSE in the project root for license information.
|
|
21323
20882
|
|
|
21324
20883
|
|
|
21325
|
-
|
|
20884
|
+
class AuroDependencyVersioning {
|
|
21326
20885
|
|
|
21327
20886
|
/**
|
|
21328
20887
|
* Generates a unique string to be used for child auro element naming.
|
|
@@ -21356,7 +20915,7 @@ let AuroDependencyVersioning$1 = class AuroDependencyVersioning {
|
|
|
21356
20915
|
|
|
21357
20916
|
return tag;
|
|
21358
20917
|
}
|
|
21359
|
-
}
|
|
20918
|
+
}
|
|
21360
20919
|
|
|
21361
20920
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
21362
20921
|
// See LICENSE in the project root for license information.
|
|
@@ -21424,7 +20983,7 @@ const cacheFetch = (uri, options = {}) => {
|
|
|
21424
20983
|
return _fetchMap.get(uri);
|
|
21425
20984
|
};
|
|
21426
20985
|
|
|
21427
|
-
var styleCss$3 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.ico_squareLarge{fill:currentColor;height:var(--auro-size-lg, var(--ds-size-300, 1.5rem))}.ico_squareSmall{fill:currentColor;height:.6rem}.ico_squareMed{fill:currentColor;height:var(--auro-size-md, var(--ds-size-200, 1rem))}.ico_squareSml{fill:currentColor;height:var(--auro-size-sm, var(--ds-size-150, 0.75rem))}:host{color:currentColor;vertical-align:middle;line-height:1;display:inline-block}
|
|
20986
|
+
var styleCss$3 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.ico_squareLarge{fill:currentColor;height:var(--auro-size-lg, var(--ds-size-300, 1.5rem))}.ico_squareSmall{fill:currentColor;height:.6rem}.ico_squareMed{fill:currentColor;height:var(--auro-size-md, var(--ds-size-200, 1rem))}.ico_squareSml{fill:currentColor;height:var(--auro-size-sm, var(--ds-size-150, 0.75rem))}:host{color:currentColor;vertical-align:middle;line-height:1;display:inline-block}svg{min-width:var(--ds-auro-icon-size, 1.5rem) !important;width:var(--ds-auro-icon-size, 1.5rem) !important;height:var(--ds-auro-icon-size, 1.5rem) !important}.componentWrapper{display:flex}.svgWrapper{height:var(--ds-auro-icon-size);width:var(--ds-auro-icon-size)}.labelWrapper{margin-left:var(--ds-size-50, 0.25rem);line-height:1.8}`;
|
|
21428
20987
|
|
|
21429
20988
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
21430
20989
|
// See LICENSE in the project root for license information.
|
|
@@ -21432,7 +20991,6 @@ var styleCss$3 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}.u
|
|
|
21432
20991
|
|
|
21433
20992
|
// See https://git.io/JJ6SJ for "How to document your components using JSDoc"
|
|
21434
20993
|
/**
|
|
21435
|
-
* @attr {Boolean} onDark - Set value for on-dark version of auro-icon
|
|
21436
20994
|
* @slot - Hidden from visibility, used for a11y if icon description is needed
|
|
21437
20995
|
*/
|
|
21438
20996
|
|
|
@@ -21447,6 +21005,10 @@ class BaseIcon extends AuroElement {
|
|
|
21447
21005
|
static get properties() {
|
|
21448
21006
|
return {
|
|
21449
21007
|
...super.properties,
|
|
21008
|
+
|
|
21009
|
+
/**
|
|
21010
|
+
* Set value for on-dark version of auro-icon.
|
|
21011
|
+
*/
|
|
21450
21012
|
onDark: {
|
|
21451
21013
|
type: Boolean,
|
|
21452
21014
|
reflect: true
|
|
@@ -21505,81 +21067,11 @@ class BaseIcon extends AuroElement {
|
|
|
21505
21067
|
}
|
|
21506
21068
|
}
|
|
21507
21069
|
|
|
21508
|
-
var tokensCss$3 = i$5`:host{--ds-auro-icon-color:var(--ds-color-
|
|
21509
|
-
|
|
21510
|
-
var colorCss$3 = i$5`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[accent]){--ds-auro-icon-color:var(--ds-color-icon-accent-default, #a2c270)}:host(:not([onDark])[disabled]){--ds-auro-icon-color:var(--ds-color-icon-ui-primary-disabled-default, #adadad)}:host(:not([onDark])[emphasis]){--ds-auro-icon-color:var(--ds-color-icon-emphasis-default, #2a2a2a)}:host(:not([onDark])[error]){--ds-auro-icon-color:var(--ds-color-icon-error-default, #cc1816)}:host(:not([onDark])[info]){--ds-auro-icon-color:var(--ds-color-icon-info-default, #326aa5)}:host(:not([onDark])[secondary]){--ds-auro-icon-color:var(--ds-color-icon-secondary-default, #7e8894)}:host(:not([onDark])[subtle]){--ds-auro-icon-color:var(--ds-color-icon-subtle-default, #a0c9f1)}:host(:not([onDark])[success]){--ds-auro-icon-color:var(--ds-color-icon-success-default, #40a080)}:host(:not([onDark])[tertiary]){--ds-auro-icon-color:var(--ds-color-icon-tertiary-default, #afb9c6)}:host(:not([onDark])[warning]){--ds-auro-icon-color:var(--ds-color-icon-warning-default, #c49432)}:host([onDark]){--ds-auro-icon-color:var(--ds-color-icon-primary-inverse, #f7f7f7)}:host([onDark][accent]){--ds-auro-icon-color:var(--ds-color-icon-accent-inverse, #badd81)}:host([onDark][disabled]){--ds-auro-icon-color:var(--ds-color-icon-ui-primary-disabled-inverse, #7e7e7e)}:host([onDark][emphasis]){--ds-auro-icon-color:var(--ds-color-icon-emphasis-inverse, #ffffff)}:host([onDark][error]){--ds-auro-icon-color:var(--ds-color-icon-error-inverse, #f9aca6)}:host([onDark][info]){--ds-auro-icon-color:var(--ds-color-icon-info-inverse, #89b2d4)}:host([onDark][secondary]){--ds-auro-icon-color:var(--ds-color-icon-secondary-inverse, #ccd2db)}:host([onDark][subtle]){--ds-auro-icon-color:var(--ds-color-icon-subtle-inverse, #326aa5)}:host([onDark][success]){--ds-auro-icon-color:var(--ds-color-icon-success-inverse, #8eceb9)}:host([onDark][tertiary]){--ds-auro-icon-color:var(--ds-color-icon-tertiary-inverse, #939fad)}:host([onDark][warning]){--ds-auro-icon-color:var(--ds-color-icon-warning-inverse, #f2c153)}`;
|
|
21511
|
-
|
|
21512
|
-
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
21513
|
-
// See LICENSE in the project root for license information.
|
|
21514
|
-
|
|
21515
|
-
// ---------------------------------------------------------------------
|
|
21516
|
-
|
|
21517
|
-
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
21518
|
-
|
|
21519
|
-
let AuroLibraryRuntimeUtils$3 = class AuroLibraryRuntimeUtils {
|
|
21520
|
-
|
|
21521
|
-
/* eslint-disable jsdoc/require-param */
|
|
21522
|
-
|
|
21523
|
-
/**
|
|
21524
|
-
* This will register a new custom element with the browser.
|
|
21525
|
-
* @param {String} name - The name of the custom element.
|
|
21526
|
-
* @param {Object} componentClass - The class to register as a custom element.
|
|
21527
|
-
* @returns {void}
|
|
21528
|
-
*/
|
|
21529
|
-
registerComponent(name, componentClass) {
|
|
21530
|
-
if (!customElements.get(name)) {
|
|
21531
|
-
customElements.define(name, class extends componentClass {});
|
|
21532
|
-
}
|
|
21533
|
-
}
|
|
21534
|
-
|
|
21535
|
-
/**
|
|
21536
|
-
* Finds and returns the closest HTML Element based on a selector.
|
|
21537
|
-
* @returns {void}
|
|
21538
|
-
*/
|
|
21539
|
-
closestElement(
|
|
21540
|
-
selector, // selector like in .closest()
|
|
21541
|
-
base = this, // extra functionality to skip a parent
|
|
21542
|
-
__Closest = (el, found = el && el.closest(selector)) =>
|
|
21543
|
-
!el || el === document || el === window
|
|
21544
|
-
? null // standard .closest() returns null for non-found selectors also
|
|
21545
|
-
: found
|
|
21546
|
-
? found // found a selector INside this element
|
|
21547
|
-
: __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
|
|
21548
|
-
) {
|
|
21549
|
-
return __Closest(base);
|
|
21550
|
-
}
|
|
21551
|
-
/* eslint-enable jsdoc/require-param */
|
|
21552
|
-
|
|
21553
|
-
/**
|
|
21554
|
-
* 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.
|
|
21555
|
-
* @param {Object} elem - The element to check.
|
|
21556
|
-
* @param {String} tagName - The name of the Auro component to check for or add as an attribute.
|
|
21557
|
-
* @returns {void}
|
|
21558
|
-
*/
|
|
21559
|
-
handleComponentTagRename(elem, tagName) {
|
|
21560
|
-
const tag = tagName.toLowerCase();
|
|
21561
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
21562
|
-
|
|
21563
|
-
if (elemTag !== tag) {
|
|
21564
|
-
elem.setAttribute(tag, true);
|
|
21565
|
-
}
|
|
21566
|
-
}
|
|
21567
|
-
|
|
21568
|
-
/**
|
|
21569
|
-
* Validates if an element is a specific Auro component.
|
|
21570
|
-
* @param {Object} elem - The element to validate.
|
|
21571
|
-
* @param {String} tagName - The name of the Auro component to check against.
|
|
21572
|
-
* @returns {Boolean} - Returns true if the element is the specified Auro component.
|
|
21573
|
-
*/
|
|
21574
|
-
elementMatch(elem, tagName) {
|
|
21575
|
-
const tag = tagName.toLowerCase();
|
|
21576
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
21070
|
+
var tokensCss$3 = i$5`:host{--ds-auro-icon-color:var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-alaska-color:#02426D;--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}`;
|
|
21577
21071
|
|
|
21578
|
-
|
|
21579
|
-
}
|
|
21580
|
-
};
|
|
21072
|
+
var colorCss$3 = i$5`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[variant=accent1]){--ds-auro-icon-color:var(--ds-basic-color-texticon-accent1, #265688)}:host(:not([onDark])[variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:not([onDark])[variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-muted, #676767)}:host(:not([onDark])[variant=statusDefault]){--ds-auro-icon-color:var(--ds-basic-color-status-default, #afb9c6)}:host(:not([onDark])[variant=statusInfo]){--ds-auro-icon-color:var(--ds-basic-color-status-info, #01426a)}:host(:not([onDark])[variant=statusSuccess]){--ds-auro-icon-color:var(--ds-basic-color-status-success, #447a1f)}:host(:not([onDark])[variant=statusWarning]){--ds-auro-icon-color:var(--ds-basic-color-status-warning, #fac200)}:host(:not([onDark])[variant=statusError]){--ds-auro-icon-color:var(--ds-basic-color-status-error, #e31f26)}:host(:not([onDark])[variant=statusInfoSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-info-subtle, #ebf3f9)}:host(:not([onDark])[variant=statusSuccessSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-success-subtle, #d6eac7)}:host(:not([onDark])[variant=statusWarningSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-warning-subtle, #fff0b2)}:host(:not([onDark])[variant=statusErrorSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-error-subtle, #fbc6c6)}:host(:not([onDark])[variant=fareBasicEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-basiceconomy, #97eaf8)}:host(:not([onDark])[variant=fareBusiness]){--ds-auro-icon-color:var(--ds-basic-color-fare-business, #01426a)}:host(:not([onDark])[variant=fareEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-economy, #0074ca)}:host(:not([onDark])[variant=fareFirst]){--ds-auro-icon-color:var(--ds-basic-color-fare-first, #00274a)}:host(:not([onDark])[variant=farePremiumEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-premiumeconomy, #005154)}:host(:not([onDark])[variant=fareOneWorldEmerald]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-emerald, #139142)}:host(:not([onDark])[variant=fareOneWorldSapphire]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-sapphire, #015daa)}:host(:not([onDark])[variant=fareOneWorldRuby]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-ruby, #a41d4a)}:host([onDark]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse, #ffffff)}:host([onDark][variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([onDark][variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}`;
|
|
21581
21073
|
|
|
21582
|
-
// Copyright (c)
|
|
21074
|
+
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
21583
21075
|
// See LICENSE in the project root for license information.
|
|
21584
21076
|
|
|
21585
21077
|
|
|
@@ -21587,6 +21079,7 @@ class AuroIcon extends BaseIcon {
|
|
|
21587
21079
|
constructor() {
|
|
21588
21080
|
super();
|
|
21589
21081
|
|
|
21082
|
+
this.variant = undefined;
|
|
21590
21083
|
this.privateDefaults();
|
|
21591
21084
|
}
|
|
21592
21085
|
|
|
@@ -21596,22 +21089,8 @@ class AuroIcon extends BaseIcon {
|
|
|
21596
21089
|
* @returns {void}
|
|
21597
21090
|
*/
|
|
21598
21091
|
privateDefaults() {
|
|
21599
|
-
this.accent = false;
|
|
21600
|
-
this.customColor = false;
|
|
21601
|
-
this.customSvg = false;
|
|
21602
|
-
this.disabled = false;
|
|
21603
|
-
this.emphasis = false;
|
|
21604
|
-
this.error = false;
|
|
21605
|
-
this.info = false;
|
|
21606
|
-
this.label = false;
|
|
21607
|
-
this.primary = false;
|
|
21608
|
-
this.secondary = false;
|
|
21609
|
-
this.subtle = false;
|
|
21610
|
-
this.success = false;
|
|
21611
|
-
this.tertiary = false;
|
|
21612
|
-
this.warning = false;
|
|
21613
21092
|
this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
|
|
21614
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
21093
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$1();
|
|
21615
21094
|
}
|
|
21616
21095
|
|
|
21617
21096
|
// function to define props used within the scope of this component
|
|
@@ -21619,14 +21098,6 @@ class AuroIcon extends BaseIcon {
|
|
|
21619
21098
|
return {
|
|
21620
21099
|
...super.properties,
|
|
21621
21100
|
|
|
21622
|
-
/**
|
|
21623
|
-
* Sets the icon to use the accent style.
|
|
21624
|
-
*/
|
|
21625
|
-
accent: {
|
|
21626
|
-
type: Boolean,
|
|
21627
|
-
reflect: true
|
|
21628
|
-
},
|
|
21629
|
-
|
|
21630
21101
|
/**
|
|
21631
21102
|
* Set aria-hidden value. Default is `true`. Option is `false`.
|
|
21632
21103
|
*/
|
|
@@ -21658,99 +21129,27 @@ class AuroIcon extends BaseIcon {
|
|
|
21658
21129
|
},
|
|
21659
21130
|
|
|
21660
21131
|
/**
|
|
21661
|
-
*
|
|
21132
|
+
* Exposes content in slot as icon label.
|
|
21662
21133
|
*/
|
|
21663
|
-
|
|
21134
|
+
label: {
|
|
21664
21135
|
type: Boolean,
|
|
21665
21136
|
reflect: true
|
|
21666
21137
|
},
|
|
21667
21138
|
|
|
21668
21139
|
/**
|
|
21669
|
-
*
|
|
21140
|
+
* The name of the icon you are looking for without the file extension. See https://auro.alaskaair.com/icons/usage.
|
|
21670
21141
|
*/
|
|
21671
|
-
|
|
21672
|
-
type:
|
|
21142
|
+
name: {
|
|
21143
|
+
type: String,
|
|
21673
21144
|
reflect: true
|
|
21674
21145
|
},
|
|
21675
21146
|
|
|
21676
21147
|
/**
|
|
21677
|
-
*
|
|
21148
|
+
* 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`.
|
|
21678
21149
|
*/
|
|
21679
|
-
|
|
21680
|
-
type: Boolean,
|
|
21681
|
-
reflect: true
|
|
21682
|
-
},
|
|
21683
|
-
|
|
21684
|
-
/**
|
|
21685
|
-
* Sets the icon to use the info style.
|
|
21686
|
-
*/
|
|
21687
|
-
info: {
|
|
21688
|
-
type: Boolean,
|
|
21689
|
-
reflect: true
|
|
21690
|
-
},
|
|
21691
|
-
|
|
21692
|
-
/**
|
|
21693
|
-
* Exposes content in slot as icon label.
|
|
21694
|
-
*/
|
|
21695
|
-
label: {
|
|
21696
|
-
type: Boolean,
|
|
21697
|
-
reflect: true
|
|
21698
|
-
},
|
|
21699
|
-
|
|
21700
|
-
/**
|
|
21701
|
-
* The name of the icon you are looking for without the file extension. See https://auro.alaskaair.com/icons/usage.
|
|
21702
|
-
*/
|
|
21703
|
-
name: {
|
|
21150
|
+
variant: {
|
|
21704
21151
|
type: String,
|
|
21705
21152
|
reflect: true
|
|
21706
|
-
},
|
|
21707
|
-
|
|
21708
|
-
/**
|
|
21709
|
-
* DEPRECATED: Sets the icon to use the baseline primary icon style.
|
|
21710
|
-
*/
|
|
21711
|
-
primary: {
|
|
21712
|
-
type: Boolean,
|
|
21713
|
-
reflect: true
|
|
21714
|
-
},
|
|
21715
|
-
|
|
21716
|
-
/**
|
|
21717
|
-
* Sets the icon to use the secondary style.
|
|
21718
|
-
*/
|
|
21719
|
-
secondary: {
|
|
21720
|
-
type: Boolean,
|
|
21721
|
-
reflect: true
|
|
21722
|
-
},
|
|
21723
|
-
|
|
21724
|
-
/**
|
|
21725
|
-
* Sets the icon to use the subtle style.
|
|
21726
|
-
*/
|
|
21727
|
-
subtle: {
|
|
21728
|
-
type: Boolean,
|
|
21729
|
-
reflect: true
|
|
21730
|
-
},
|
|
21731
|
-
|
|
21732
|
-
/**
|
|
21733
|
-
* Sets the icon to use the success style.
|
|
21734
|
-
*/
|
|
21735
|
-
success: {
|
|
21736
|
-
type: Boolean,
|
|
21737
|
-
reflect: true
|
|
21738
|
-
},
|
|
21739
|
-
|
|
21740
|
-
/**
|
|
21741
|
-
* Sets the icon to use the tertiary style.
|
|
21742
|
-
*/
|
|
21743
|
-
tertiary: {
|
|
21744
|
-
type: Boolean,
|
|
21745
|
-
reflect: true
|
|
21746
|
-
},
|
|
21747
|
-
|
|
21748
|
-
/**
|
|
21749
|
-
* Sets the icon to use the warning style.
|
|
21750
|
-
*/
|
|
21751
|
-
warning: {
|
|
21752
|
-
type: Boolean,
|
|
21753
|
-
reflect: true
|
|
21754
21153
|
}
|
|
21755
21154
|
};
|
|
21756
21155
|
}
|
|
@@ -21773,7 +21172,7 @@ class AuroIcon extends BaseIcon {
|
|
|
21773
21172
|
*
|
|
21774
21173
|
*/
|
|
21775
21174
|
static register(name = "auro-icon") {
|
|
21776
|
-
AuroLibraryRuntimeUtils$
|
|
21175
|
+
AuroLibraryRuntimeUtils$1.prototype.registerComponent(name, AuroIcon);
|
|
21777
21176
|
}
|
|
21778
21177
|
|
|
21779
21178
|
connectedCallback() {
|
|
@@ -21839,197 +21238,17 @@ class AuroIcon extends BaseIcon {
|
|
|
21839
21238
|
}
|
|
21840
21239
|
}
|
|
21841
21240
|
|
|
21842
|
-
var iconVersion = '
|
|
21241
|
+
var iconVersion = '8.0.1';
|
|
21843
21242
|
|
|
21844
|
-
|
|
21845
|
-
// See LICENSE in the project root for license information.
|
|
21243
|
+
var styleCss$2 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}.util_insetNone{padding:0}.util_insetXxxs{padding:.125rem}.util_insetXxxs--stretch{padding:.25rem .125rem}.util_insetXxxs--squish{padding:0 .125rem}.util_insetXxs{padding:.25rem}.util_insetXxs--stretch{padding:.375rem .25rem}.util_insetXxs--squish{padding:.125rem .25rem}.util_insetXs{padding:.5rem}.util_insetXs--stretch{padding:.75rem .5rem}.util_insetXs--squish{padding:.25rem .5rem}.util_insetSm{padding:.75rem}.util_insetSm--stretch{padding:1.125rem .75rem}.util_insetSm--squish{padding:.375rem .75rem}.util_insetMd{padding:1rem}.util_insetMd--stretch{padding:1.5rem 1rem}.util_insetMd--squish{padding:.5rem 1rem}.util_insetLg{padding:1.5rem}.util_insetLg--stretch{padding:2.25rem 1.5rem}.util_insetLg--squish{padding:.75rem 1.5rem}.util_insetXl{padding:2rem}.util_insetXl--stretch{padding:3rem 2rem}.util_insetXl--squish{padding:1rem 2rem}.util_insetXxl{padding:3rem}.util_insetXxl--stretch{padding:4.5rem 3rem}.util_insetXxl--squish{padding:1.5rem 3rem}.util_insetXxxl{padding:4rem}.util_insetXxxl--stretch{padding:6rem 4rem}.util_insetXxxl--squish{padding:2rem 4rem}:host([fluid]) .auro-button,:host([fluid=true]) .auro-button{min-width:auto;width:100%}:host([variant=flat]){display:inline-block;height:var(--ds-size-300, 1.5rem);width:var(--ds-size-300, 1.5rem)}:host([variant=flat]) .auro-button{height:100%;width:100%}::slotted(svg){vertical-align:middle}slot{pointer-events:none}.auro-button{position:relative;padding:0 var(--ds-size-300, 1.5rem);cursor:pointer;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem);font-family:var(--ds-basic-text-body-default-font-family, AS Circular);font-size:var(--ds-basic-text-body-default-font-size, 16px);font-weight:var(--ds-basic-text-body-default-font-weight, Book);overflow:hidden;text-overflow:ellipsis;user-select:none;white-space:nowrap;min-height:var(--ds-size-600, 3rem);max-height:var(--ds-size-600, 3rem);display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--ds-size-100, 0.5rem);margin:0;-webkit-touch-callout:none;-webkit-user-select:none}.auro-button:active{transform:scale(0.95)}.auro-button:focus-visible{outline:none}.auro-button:focus-visible:not([variant=flat]){outline-style:solid;outline-width:var(--ds-size-50, 0.25rem);outline-offset:calc(var(--ds-size-50, 0.25rem)*-1)}.auro-button:focus-visible:not([variant=flat]):not([variant=secondary]):not([variant=tertiary]){outline-width:calc(var(--ds-size-50, 0.25rem) - 1px)}.auro-button.loading{cursor:not-allowed}.auro-button.loading *:not([auro-loader]){visibility:hidden}@media screen and (min-width: 576px){.auro-button{min-width:8.75rem;width:auto}}.auro-button:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=secondary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=flat]{height:unset;width:unset;min-height:unset;max-height:unset;min-width:unset;max-width:unset;border:0;border-radius:unset;gap:unset;padding:unset}.auro-button[onDark]:disabled{cursor:not-allowed;transform:unset}.auro-button[onDark][variant=secondary]:disabled{cursor:not-allowed;transform:unset}@media(hover: hover){.auro-button[onDark][variant=tertiary]:active,.auro-button[onDark][variant=tertiary]:hover{box-shadow:none}}.auro-button[onDark][variant=tertiary]:active{box-shadow:none}.auro-button[onDark][variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button--slim{padding:var(--ds-size-100, 0.5rem) var(--ds-size-200, 1rem);font-size:var(--ds-basic-text-body-sm-font-size, 14px);min-width:unset;min-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem));max-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem))}.auro-button--iconOnly{padding:0 var(--ds-size-100, 0.5rem);border-radius:100px;min-width:unset;height:var(--ds-size-600, 3rem);width:var(--ds-size-500, 2.5rem)}.auro-button--iconOnly ::slotted(auro-icon),.auro-button--iconOnly ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, $ds-size-300)}.auro-button--iconOnly:not(.auro-button--rounded):focus-visible:not([variant=secondary]):not([variant=tertiary]):not([variant=flat]){outline-width:1px;outline-offset:-2px}.auro-button--iconOnlySlim{padding:0 var(--ds-size-50, 0.25rem);height:calc(var(--ds-size-400, 2rem) + var(--ds-size-50, 0.25rem));width:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-50, 0.25rem))}.auro-button--iconOnlySlim ::slotted(auro-icon),.auro-button--iconOnlySlim ::slotted([auro-icon]){--ds-auro-icon-size:calc(var(--ds-size-200, $ds-size-200) + var(--ds-size-50, $ds-size-50))}.auro-button--rounded{border-radius:100px;box-shadow:var(--ds-elevation-300, 0px 0px 15px rgba(0, 0, 0, 0.2));height:var(--ds-size-500, 2.5rem);min-width:unset;transition:all 300ms ease-out,outline 0ms,outline-offset 0ms}.auro-button--rounded ::slotted(auro-icon),.auro-button--rounded ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, $ds-size-300)}.auro-button--rounded:focus-visible:not([variant=flat]):after{border-radius:100px}:host([rounded]) .textSlot{transition:opacity 300ms ease-in;opacity:1}:host([rounded][iconOnly]) .textSlot{opacity:0}:host([rounded][iconOnly]) .textWrapper{display:none}:host([rounded][iconOnly]) .auro-button{min-width:unset;padding:unset;width:var(--ds-size-600, 3rem)}[auro-loader]{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);pointer-events:none}`;
|
|
21846
21244
|
|
|
21245
|
+
var colorCss$2 = i$5`[auro-loader]{color:var(--ds-auro-button-loader-color)}.auro-button{-webkit-tap-highlight-color:var(--ds-auro-button-tap-color);color:var(--ds-auro-button-text-color);background-color:var(--ds-auro-button-container-color);background-image:linear-gradient(var(--ds-auro-button-container-image), var(--ds-auro-button-container-image));border-color:var(--ds-auro-button-border-color)}.auro-button:not([variant=secondary]):not([variant=tertiary]):focus-visible{outline-color:var(--ds-auro-button-border-inset-color)}.auro-button:not([ondark]):active:not(:disabled),.auro-button:not([ondark]):hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-hover, #00274a);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-hover, #00274a);--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-hover, #00274a)}.auro-button:not([ondark]):disabled{--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-disabled, #acc9e2);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-disabled, #acc9e2);--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-disabled, #acc9e2)}.auro-button:not([ondark])[variant=secondary]{--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background, #ffffff);--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background, #ffffff);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border, #01426a);--ds-auro-button-text-color:var(--ds-advanced-color-button-secondary-text, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-secondary-text, #01426a)}.auro-button:not([ondark])[variant=secondary]:active:not(:disabled),.auro-button:not([ondark])[variant=secondary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background-hover, #f2f2f2);--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background-hover, #f2f2f2);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-hover, #00274a);--ds-auro-button-text-color:var(--ds-advanced-color-button-secondary-text-hover, #00274a)}.auro-button:not([ondark])[variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused, #01426a)}.auro-button:not([ondark])[variant=secondary]:disabled{--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background-disabled, #f7f7f7);--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background-disabled, #f7f7f7);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-disabled, #cfe0ef);--ds-auro-button-text-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}.auro-button:not([ondark])[variant=tertiary]{--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background, rgba(0, 0, 0, 0.05));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background, rgba(0, 0, 0, 0.05));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-advanced-color-button-tertiary-text, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-tertiary-text, #01426a)}.auro-button:not([ondark])[variant=tertiary]:active:not(:disabled),.auro-button:not([ondark])[variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background-hover, rgba(0, 0, 0, 0.1));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background-hover, rgba(0, 0, 0, 0.1));--ds-auro-button-border-color:transparent}.auro-button:not([ondark])[variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-advanced-color-state-focused, #01426a);--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused, #01426a)}.auro-button:not([ondark])[variant=tertiary]:disabled{--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}.auro-button:not([ondark])[variant=flat]{color:var(--ds-advanced-color-button-flat-text, #676767);background-color:transparent;background-image:none;border-color:transparent}.auro-button:not([ondark])[variant=flat]:active:not(:disabled),.auro-button:not([ondark])[variant=flat]:hover:not(:disabled){color:var(--ds-advanced-color-button-flat-text-hover, #525252);background-color:transparent;background-image:none;border-color:transparent}.auro-button:not([ondark])[variant=flat]:disabled{color:var(--ds-advanced-color-button-flat-text-disabled, #d0d0d0);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark]{--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-inverse, #ffffff);--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-inverse, #ffffff);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-inverse, #ffffff);--ds-auro-button-text-color:var(--ds-advanced-color-button-primary-text-inverse, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-primary-text-inverse, #01426a)}.auro-button[ondark]:active:not(:disabled),.auro-button[ondark]:hover:not(:disabled){--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-inverse-hover, #ebf3f9);--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-inverse-hover, #ebf3f9);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-inverse-hover, #ebf3f9)}.auro-button[ondark]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused, #01426a)}.auro-button[ondark]:disabled{--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-text-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}.auro-button[ondark][variant=secondary]{--ds-auro-button-container-color:transparent;--ds-auro-button-container-image:transparent;--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-inverse, #ffffff);--ds-auro-button-text-color:var(--ds-advanced-color-button-secondary-text-inverse, #ffffff);--ds-auro-button-loader-color:var(--ds-advanced-color-button-secondary-text-inverse, #ffffff)}.auro-button[ondark][variant=secondary]:active:not(:disabled),.auro-button[ondark][variant=secondary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background-inverse-hover, rgba(255, 255, 255, 0.1));--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background-inverse-hover, rgba(255, 255, 255, 0.1))}.auro-button[ondark][variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused-inverse, #ffffff)}.auro-button[ondark][variant=secondary]:disabled{--ds-auro-button-text-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-inverse-disabled, #dddddd)}.auro-button[ondark][variant=tertiary]{--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background-inverse, rgba(255, 255, 255, 0.05));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background-inverse, rgba(255, 255, 255, 0.05));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-advanced-color-button-tertiary-text-inverse, #ffffff);--ds-auro-button-loader-color:var(--ds-advanced-color-button-tertiary-text-inverse, #ffffff)}.auro-button[ondark][variant=tertiary]:active:not(:disabled),.auro-button[ondark][variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background-inverse-hover, rgba(255, 255, 255, 0.1));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background-inverse-hover, rgba(255, 255, 255, 0.1))}.auro-button[ondark][variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused-inverse, #ffffff)}.auro-button[ondark][variant=tertiary]:disabled{--ds-auro-button-text-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}.auro-button[ondark][variant=flat]{color:var(--ds-advanced-color-button-flat-text-inverse, #ffffff);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark][variant=flat]:active:not(:disabled),.auro-button[ondark][variant=flat]:hover:not(:disabled){color:var(--ds-advanced-color-button-flat-text-inverse-hover, #adadad);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark][variant=flat]:disabled{color:var(--ds-advanced-color-button-flat-text-inverse-disabled, #7e8894);background-color:transparent;background-image:none;border-color:transparent}`;
|
|
21847
21246
|
|
|
21848
|
-
|
|
21849
|
-
|
|
21850
|
-
/**
|
|
21851
|
-
* Generates a unique string to be used for child auro element naming.
|
|
21852
|
-
* @private
|
|
21853
|
-
* @param {string} baseName - Defines the first part of the unique element name.
|
|
21854
|
-
* @param {string} version - Version of the component that will be appended to the baseName.
|
|
21855
|
-
* @returns {string} - Unique string to be used for naming.
|
|
21856
|
-
*/
|
|
21857
|
-
generateElementName(baseName, version) {
|
|
21858
|
-
let result = baseName;
|
|
21859
|
-
|
|
21860
|
-
result += '-';
|
|
21861
|
-
result += version.replace(/[.]/g, '_');
|
|
21862
|
-
|
|
21863
|
-
return result;
|
|
21864
|
-
}
|
|
21865
|
-
|
|
21866
|
-
/**
|
|
21867
|
-
* Generates a unique string to be used for child auro element naming.
|
|
21868
|
-
* @param {string} baseName - Defines the first part of the unique element name.
|
|
21869
|
-
* @param {string} version - Version of the component that will be appended to the baseName.
|
|
21870
|
-
* @returns {string} - Unique string to be used for naming.
|
|
21871
|
-
*/
|
|
21872
|
-
generateTag(baseName, version, tagClass) {
|
|
21873
|
-
const elementName = this.generateElementName(baseName, version);
|
|
21874
|
-
const tag = i$1`${s$1(elementName)}`;
|
|
21875
|
-
|
|
21876
|
-
if (!customElements.get(elementName)) {
|
|
21877
|
-
customElements.define(elementName, class extends tagClass {});
|
|
21878
|
-
}
|
|
21879
|
-
|
|
21880
|
-
return tag;
|
|
21881
|
-
}
|
|
21882
|
-
}
|
|
21883
|
-
|
|
21884
|
-
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
21885
|
-
// See LICENSE in the project root for license information.
|
|
21886
|
-
|
|
21887
|
-
// ---------------------------------------------------------------------
|
|
21888
|
-
|
|
21889
|
-
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
21890
|
-
|
|
21891
|
-
let AuroLibraryRuntimeUtils$2 = class AuroLibraryRuntimeUtils {
|
|
21892
|
-
|
|
21893
|
-
/* eslint-disable jsdoc/require-param */
|
|
21894
|
-
|
|
21895
|
-
/**
|
|
21896
|
-
* This will register a new custom element with the browser.
|
|
21897
|
-
* @param {String} name - The name of the custom element.
|
|
21898
|
-
* @param {Object} componentClass - The class to register as a custom element.
|
|
21899
|
-
* @returns {void}
|
|
21900
|
-
*/
|
|
21901
|
-
registerComponent(name, componentClass) {
|
|
21902
|
-
if (!customElements.get(name)) {
|
|
21903
|
-
customElements.define(name, class extends componentClass {});
|
|
21904
|
-
}
|
|
21905
|
-
}
|
|
21906
|
-
|
|
21907
|
-
/**
|
|
21908
|
-
* Finds and returns the closest HTML Element based on a selector.
|
|
21909
|
-
* @returns {void}
|
|
21910
|
-
*/
|
|
21911
|
-
closestElement(
|
|
21912
|
-
selector, // selector like in .closest()
|
|
21913
|
-
base = this, // extra functionality to skip a parent
|
|
21914
|
-
__Closest = (el, found = el && el.closest(selector)) =>
|
|
21915
|
-
!el || el === document || el === window
|
|
21916
|
-
? null // standard .closest() returns null for non-found selectors also
|
|
21917
|
-
: found
|
|
21918
|
-
? found // found a selector INside this element
|
|
21919
|
-
: __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
|
|
21920
|
-
) {
|
|
21921
|
-
return __Closest(base);
|
|
21922
|
-
}
|
|
21923
|
-
/* eslint-enable jsdoc/require-param */
|
|
21924
|
-
|
|
21925
|
-
/**
|
|
21926
|
-
* 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.
|
|
21927
|
-
* @param {Object} elem - The element to check.
|
|
21928
|
-
* @param {String} tagName - The name of the Auro component to check for or add as an attribute.
|
|
21929
|
-
* @returns {void}
|
|
21930
|
-
*/
|
|
21931
|
-
handleComponentTagRename(elem, tagName) {
|
|
21932
|
-
const tag = tagName.toLowerCase();
|
|
21933
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
21934
|
-
|
|
21935
|
-
if (elemTag !== tag) {
|
|
21936
|
-
elem.setAttribute(tag, true);
|
|
21937
|
-
}
|
|
21938
|
-
}
|
|
21939
|
-
|
|
21940
|
-
/**
|
|
21941
|
-
* Validates if an element is a specific Auro component.
|
|
21942
|
-
* @param {Object} elem - The element to validate.
|
|
21943
|
-
* @param {String} tagName - The name of the Auro component to check against.
|
|
21944
|
-
* @returns {Boolean} - Returns true if the element is the specified Auro component.
|
|
21945
|
-
*/
|
|
21946
|
-
elementMatch(elem, tagName) {
|
|
21947
|
-
const tag = tagName.toLowerCase();
|
|
21948
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
21949
|
-
|
|
21950
|
-
return elemTag === tag || elem.hasAttribute(tag);
|
|
21951
|
-
}
|
|
21952
|
-
};
|
|
21953
|
-
|
|
21954
|
-
var styleCss$2 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}.util_insetNone{padding:0}.util_insetXxxs{padding:.125rem}.util_insetXxxs--stretch{padding:.25rem .125rem}.util_insetXxxs--squish{padding:0 .125rem}.util_insetXxs{padding:.25rem}.util_insetXxs--stretch{padding:.375rem .25rem}.util_insetXxs--squish{padding:.125rem .25rem}.util_insetXs{padding:.5rem}.util_insetXs--stretch{padding:.75rem .5rem}.util_insetXs--squish{padding:.25rem .5rem}.util_insetSm{padding:.75rem}.util_insetSm--stretch{padding:1.125rem .75rem}.util_insetSm--squish{padding:.375rem .75rem}.util_insetMd{padding:1rem}.util_insetMd--stretch{padding:1.5rem 1rem}.util_insetMd--squish{padding:.5rem 1rem}.util_insetLg{padding:1.5rem}.util_insetLg--stretch{padding:2.25rem 1.5rem}.util_insetLg--squish{padding:.75rem 1.5rem}.util_insetXl{padding:2rem}.util_insetXl--stretch{padding:3rem 2rem}.util_insetXl--squish{padding:1rem 2rem}.util_insetXxl{padding:3rem}.util_insetXxl--stretch{padding:4.5rem 3rem}.util_insetXxl--squish{padding:1.5rem 3rem}.util_insetXxxl{padding:4rem}.util_insetXxxl--stretch{padding:6rem 4rem}.util_insetXxxl--squish{padding:2rem 4rem}:host([fluid]) .auro-button,:host([fluid=true]) .auro-button{min-width:auto;width:100%}:host([variant=flat]){display:inline-block;height:var(--ds-size-300, 1.5rem);width:var(--ds-size-300, 1.5rem)}:host([variant=flat]) .auro-button{height:100%;width:100%}::slotted(svg){vertical-align:middle}slot{pointer-events:none}.auro-button{position:relative;padding:0 var(--ds-size-300, 1.5rem);cursor:pointer;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem);font-family:var(--ds-font-family-default, "AS Circular", Helvetica Neue, Arial, sans-serif);font-size:var(--ds-text-body-size-default, 1rem);font-weight:var(--ds-text-body-default-weight, 500);overflow:hidden;text-overflow:ellipsis;user-select:none;white-space:nowrap;min-height:var(--ds-size-600, 3rem);max-height:var(--ds-size-600, 3rem);display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--ds-size-100, 0.5rem);margin:0;-webkit-touch-callout:none;-webkit-user-select:none}.auro-button:active{transform:scale(0.95)}.auro-button:focus-visible:not([variant=secondary]):not([variant=tertiary]):not([variant=flat]):after{display:block;content:"";height:calc(100% - 2px);width:calc(100% - 2px);position:absolute;top:1px;left:1px;border-radius:4px;border-style:solid;border-width:2px}.auro-button:focus-visible[variant=secondary]:after,.auro-button:focus-visible[variant=tertiary]:after{display:block;content:"";height:100%;width:100%;position:absolute;top:0;left:0;border-radius:var(--ds-border-radius, 0.375rem);border-style:solid;border-width:2px}.auro-button.loading{cursor:not-allowed}.auro-button.loading *:not([auro-loader]){visibility:hidden}@media screen and (min-width: 576px){.auro-button{min-width:8.75rem;width:auto}}.auro-button:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=secondary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=flat]{height:unset;width:unset;min-height:unset;max-height:unset;min-width:unset;max-width:unset;border:0;border-radius:unset;gap:unset;padding:unset}.auro-button[onDark]:disabled{cursor:not-allowed;transform:unset}.auro-button[onDark][variant=secondary]:disabled{cursor:not-allowed;transform:unset}@media(hover: hover){.auro-button[onDark][variant=tertiary]:active,.auro-button[onDark][variant=tertiary]:hover{box-shadow:none}}.auro-button[onDark][variant=tertiary]:active{box-shadow:none}.auro-button[onDark][variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button--slim{padding:var(--ds-size-100, 0.5rem) var(--ds-size-200, 1rem);font-size:var(--ds-text-body-size-sm, 0.875rem);min-width:unset;min-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem));max-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem))}.auro-button--iconOnly{padding:0 var(--ds-size-100, 0.5rem);border-radius:100px;min-width:unset;height:var(--ds-size-600, 3rem);width:var(--ds-size-500, 2.5rem)}.auro-button--iconOnly ::slotted(auro-icon),.auro-button--iconOnly ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, $ds-size-300)}.auro-button--iconOnlySlim{padding:0 var(--ds-size-50, 0.25rem);height:calc(var(--ds-size-400, 2rem) + var(--ds-size-50, 0.25rem));width:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-50, 0.25rem))}.auro-button--iconOnlySlim ::slotted(auro-icon),.auro-button--iconOnlySlim ::slotted([auro-icon]){--ds-auro-icon-size:calc(var(--ds-size-200, $ds-size-200) + var(--ds-size-50, $ds-size-50))}.auro-button--rounded{border-radius:100px;box-shadow:var(--ds-elevation-300, 0px 0px 15px rgba(0, 0, 0, 0.2));height:var(--ds-size-500, 2.5rem);min-width:unset;transition:all 300ms ease-out}.auro-button--rounded ::slotted(auro-icon),.auro-button--rounded ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, $ds-size-300)}:host([rounded]) .textSlot{transition:opacity 300ms ease-in;opacity:1}:host([rounded][iconOnly]) .textSlot{opacity:0}:host([rounded][iconOnly]) .textWrapper{display:none}:host([rounded][iconOnly]) .auro-button{min-width:unset;padding:unset;width:var(--ds-size-600, 3rem)}[auro-loader]{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);pointer-events:none}`;
|
|
21955
|
-
|
|
21956
|
-
var colorCss$2 = i$5`[auro-loader]{color:var(--ds-auro-button-loader-color)}.auro-button{-webkit-tap-highlight-color:var(--ds-auro-button-tap-color);color:var(--ds-auro-button-text-color);background-color:var(--ds-auro-button-container-color);background-image:linear-gradient(var(--ds-auro-button-container-image), var(--ds-auro-button-container-image));border-color:var(--ds-auro-button-border-color)}.auro-button:not([variant=secondary]):not([variant=tertiary]):focus-visible:after{border-color:var(--ds-auro-button-border-inset-color)}.auro-button:not([ondark]):active{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-active-default, #225296);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-active-default, #225296);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-active-default, #225296)}.auro-button:not([ondark])[disabled]{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-disabled-default, #a0c9f1);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-disabled-default, #a0c9f1);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-disabled-default, #a0c9f1)}@media(hover: hover){.auro-button:not([ondark]):active:not(:disabled),.auro-button:not([ondark]):hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-primary-hover-default, #193d73);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-hover-default, #193d73);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-hover-default, #193d73)}}.auro-button:not([ondark])[variant=secondary]{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-default-default, #ffffff);--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-default-default, #ffffff);--ds-auro-button-border-color:var(--ds-color-border-ui-default-default, #2c67b5);--ds-auro-button-text-color:var(--ds-color-text-ui-default-default, #2c67b5)}@media(hover: hover){.auro-button:not([ondark])[variant=secondary]:active:not(:disabled),.auro-button:not([ondark])[variant=secondary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-hover-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-hover-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color:var(--ds-color-border-ui-hover-default, #193d73);--ds-auro-button-text-color:var(--ds-color-text-ui-hover-default, #193d73)}}.auro-button:not([ondark])[variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-color-border-ui-focus-default, #2c67b5)}.auro-button:not([ondark])[variant=secondary]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-active-default, #f0f7fd);--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-active-default, #f0f7fd);--ds-auro-button-border-color:var(--ds-color-border-ui-active-default, #225296);--ds-auro-button-text-color:var(--ds-color-text-ui-active-default, #225296)}.auro-button:not([ondark])[variant=secondary]:disabled{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-disabled-default, #f7f7f7);--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-disabled-default, #f7f7f7);--ds-auro-button-border-color:var(--ds-color-border-ui-disabled-default, #adadad);--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-default, #adadad)}.auro-button:not([ondark])[variant=tertiary]{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-default-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-default-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-default-default, #2c67b5)}@media(hover: hover){.auro-button:not([ondark])[variant=tertiary]:active:not(:disabled),.auro-button:not([ondark])[variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-hover-default, rgba(0, 0, 0, 0.12));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-hover-default, rgba(0, 0, 0, 0.12));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-hover-default, #193d73)}}.auro-button:not([ondark])[variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-color-border-ui-default-default, #2c67b5);--ds-auro-button-border-inset-color:var(--ds-color-border-ui-default-default, #2c67b5)}.auro-button:not([ondark])[variant=tertiary]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-active-default, rgba(0, 0, 0, 0.06));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-active-default, rgba(0, 0, 0, 0.06));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-active-default, #225296)}.auro-button:not([ondark])[variant=tertiary]:disabled{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-disabled-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-disabled-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-default, #adadad)}.auro-button:not([ondark])[variant=flat]{color:var(--ds-color-icon-ui-secondary-default-default);background-color:transparent;background-image:none;border-color:transparent}@media(hover: hover){.auro-button:not([ondark])[variant=flat]:active:not(:disabled),.auro-button:not([ondark])[variant=flat]:hover:not(:disabled){color:var(--ds-color-icon-ui-secondary-hover-default);background-color:transparent;background-image:none;border-color:transparent}}.auro-button:not([ondark])[variant=flat]:disabled{color:var(--ds-color-icon-ui-secondary-disabled-default);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark]{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-default-inverse, #56bbde);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-default-inverse, #56bbde);--ds-auro-button-text-color:var(--ds-color-text-primary-default, #2a2a2a);--ds-auro-button-loader-color:var(--ds-color-text-primary-inverse, #ffffff);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark]:active:not(:disabled),.auro-button[ondark]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7)}}.auro-button[ondark]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-active-inverse, #6ad5ef);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-active-inverse, #6ad5ef);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-active-inverse, #6ad5ef)}.auro-button[ondark][disabled]{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-disabled-inverse, #275b72);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-disabled-inverse, #275b72);--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-inverse, #7e7e7e);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-disabled-inverse, #275b72)}.auro-button[ondark][variant=secondary]{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-default-inverse, rgba(255, 255, 255, 0.03));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-default-inverse, rgba(255, 255, 255, 0.03));--ds-auro-button-border-color:var(--ds-color-border-ui-default-inverse, #56bbde);--ds-auro-button-text-color:var(--ds-color-text-ui-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark][variant=secondary]:hover{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-hover-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-hover-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color:var(--ds-color-border-ui-hover-inverse, #a8e9f7);--ds-auro-button-text-color:var(--ds-color-text-ui-hover-inverse, #a8e9f7)}}.auro-button[ondark][variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-color-border-ui-focus-inverse, #56bbde)}.auro-button[ondark][variant=secondary]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-border-color:var(--ds-color-border-ui-active-inverse, #6ad5ef);--ds-auro-button-text-color:var(--ds-color-text-ui-active-inverse, #6ad5ef)}.auro-button[ondark][variant=secondary]:disabled{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-disabled-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-disabled-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color:var(--ds-color-border-ui-disabled-inverse, #7e7e7e);--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-inverse, #7e7e7e)}.auro-button[ondark][variant=tertiary]{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-default-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-default-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark][variant=tertiary]:active:not(:disabled),.auro-button[ondark][variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-hover-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-hover-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-hover-inverse, #a8e9f7)}}.auro-button[ondark][variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-color-border-ui-default-inverse, #56bbde);--ds-auro-button-border-inset-color:var(--ds-color-border-ui-default-inverse, #56bbde)}.auro-button[ondark][variant=tertiary]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-active-inverse, #6ad5ef)}.auro-button[ondark][variant=tertiary]:disabled{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-disabled-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-disabled-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-inverse, #7e7e7e)}.auro-button[ondark][variant=flat]{color:var(--ds-color-icon-ui-secondary-default-inverse);background-color:transparent;background-image:none;border-color:transparent}@media(hover: hover){.auro-button[ondark][variant=flat]:active:not(:disabled),.auro-button[ondark][variant=flat]:hover:not(:disabled){color:var(--ds-color-icon-ui-secondary-hover-inverse);background-color:transparent;background-image:none;border-color:transparent}}.auro-button[ondark][variant=flat]:disabled{color:var(--ds-color-icon-ui-disabled-default);background-color:transparent;background-image:none;border-color:transparent}`;
|
|
21957
|
-
|
|
21958
|
-
var tokensCss$2 = i$5`:host{--ds-auro-button-border-color:var(--ds-color-container-ui-primary-default-default, #2c67b5);--ds-auro-button-border-inset-color:var(--ds-color-border-emphasis-inverse, #f2f7fb);--ds-auro-button-container-color:var(--ds-color-container-ui-primary-default-default, #2c67b5);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-default-default, #2c67b5);--ds-auro-button-loader-color:var(--ds-color-utility-navy-default, #265688);--ds-auro-button-text-color:var(--ds-color-text-primary-inverse, #ffffff);--ds-auro-button-tap-color:transparent}`;
|
|
21959
|
-
|
|
21960
|
-
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
21961
|
-
// See LICENSE in the project root for license information.
|
|
21962
|
-
|
|
21963
|
-
// ---------------------------------------------------------------------
|
|
21964
|
-
|
|
21965
|
-
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
21966
|
-
|
|
21967
|
-
let AuroLibraryRuntimeUtils$1 = class AuroLibraryRuntimeUtils {
|
|
21968
|
-
|
|
21969
|
-
/* eslint-disable jsdoc/require-param */
|
|
21970
|
-
|
|
21971
|
-
/**
|
|
21972
|
-
* This will register a new custom element with the browser.
|
|
21973
|
-
* @param {String} name - The name of the custom element.
|
|
21974
|
-
* @param {Object} componentClass - The class to register as a custom element.
|
|
21975
|
-
* @returns {void}
|
|
21976
|
-
*/
|
|
21977
|
-
registerComponent(name, componentClass) {
|
|
21978
|
-
if (!customElements.get(name)) {
|
|
21979
|
-
customElements.define(name, class extends componentClass {});
|
|
21980
|
-
}
|
|
21981
|
-
}
|
|
21982
|
-
|
|
21983
|
-
/**
|
|
21984
|
-
* Finds and returns the closest HTML Element based on a selector.
|
|
21985
|
-
* @returns {void}
|
|
21986
|
-
*/
|
|
21987
|
-
closestElement(
|
|
21988
|
-
selector, // selector like in .closest()
|
|
21989
|
-
base = this, // extra functionality to skip a parent
|
|
21990
|
-
__Closest = (el, found = el && el.closest(selector)) =>
|
|
21991
|
-
!el || el === document || el === window
|
|
21992
|
-
? null // standard .closest() returns null for non-found selectors also
|
|
21993
|
-
: found
|
|
21994
|
-
? found // found a selector INside this element
|
|
21995
|
-
: __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
|
|
21996
|
-
) {
|
|
21997
|
-
return __Closest(base);
|
|
21998
|
-
}
|
|
21999
|
-
/* eslint-enable jsdoc/require-param */
|
|
22000
|
-
|
|
22001
|
-
/**
|
|
22002
|
-
* 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.
|
|
22003
|
-
* @param {Object} elem - The element to check.
|
|
22004
|
-
* @param {String} tagName - The name of the Auro component to check for or add as an attribute.
|
|
22005
|
-
* @returns {void}
|
|
22006
|
-
*/
|
|
22007
|
-
handleComponentTagRename(elem, tagName) {
|
|
22008
|
-
const tag = tagName.toLowerCase();
|
|
22009
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
22010
|
-
|
|
22011
|
-
if (elemTag !== tag) {
|
|
22012
|
-
elem.setAttribute(tag, true);
|
|
22013
|
-
}
|
|
22014
|
-
}
|
|
22015
|
-
|
|
22016
|
-
/**
|
|
22017
|
-
* Validates if an element is a specific Auro component.
|
|
22018
|
-
* @param {Object} elem - The element to validate.
|
|
22019
|
-
* @param {String} tagName - The name of the Auro component to check against.
|
|
22020
|
-
* @returns {Boolean} - Returns true if the element is the specified Auro component.
|
|
22021
|
-
*/
|
|
22022
|
-
elementMatch(elem, tagName) {
|
|
22023
|
-
const tag = tagName.toLowerCase();
|
|
22024
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
22025
|
-
|
|
22026
|
-
return elemTag === tag || elem.hasAttribute(tag);
|
|
22027
|
-
}
|
|
22028
|
-
};
|
|
21247
|
+
var tokensCss$2 = i$5`:host{--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border, #01426a);--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background, #01426a);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-primary-text, #ffffff);--ds-auro-button-text-color:var(--ds-advanced-color-button-primary-text, #ffffff);--ds-auro-button-tap-color:transparent}`;
|
|
22029
21248
|
|
|
22030
21249
|
var styleCss$1 = i$5`:focus:not(:focus-visible){outline:3px solid transparent}:host,:host>span{position:relative}:host{width:2rem;height:2rem;display:inline-block;font-size:0}:host>span{position:absolute;display:inline-block;float:none;top:0;left:0;width:2rem;height:2rem;border-radius:100%;border-style:solid;border-width:0}:host([xs]),:host([xs])>span{width:1.2rem;height:1.2rem}:host([sm]),:host([sm])>span{width:3rem;height:3rem}:host([md]),:host([md])>span{width:5rem;height:5rem}:host([lg]),:host([lg])>span{width:8rem;height:8rem}:host{--margin:0.375rem;--margin-xs:0.2rem;--margin-sm:0.5rem;--margin-md:0.75rem;--margin-lg:1rem}:host([pulse]),:host([pulse])>span{position:relative}:host([pulse]){width:calc(3rem + var(--margin)*6);height:1.5rem}:host([pulse])>span{width:1rem;height:1rem;margin:var(--margin);animation:pulse 1.5s ease infinite}:host([pulse][xs]){width:calc(2.55rem + var(--margin-xs)*6);height:1.55rem}:host([pulse][xs])>span{margin:var(--margin-xs);width:.65rem;height:.65rem}:host([pulse][sm]){width:calc(6rem + var(--margin-sm)*6);height:2.5rem}:host([pulse][sm])>span{margin:var(--margin-sm);width:2rem;height:2rem}:host([pulse][md]){width:calc(9rem + var(--margin-md)*6);height:3.5rem}:host([pulse][md])>span{margin:var(--margin-md);width:3rem;height:3rem}:host([pulse][lg]){width:calc(15rem + var(--margin-lg)*6);height:5.5rem}:host([pulse][lg])>span{margin:var(--margin-lg);width:5rem;height:5rem}:host([pulse])>span:nth-child(1){animation-delay:-400ms}:host([pulse])>span:nth-child(2){animation-delay:-200ms}:host([pulse])>span:nth-child(3){animation-delay:0ms}@keyframes pulse{0%,100%{opacity:.1;transform:scale(0.9)}50%{opacity:1;transform:scale(1.1)}}:host([orbit]),:host([orbit])>span{opacity:1}:host([orbit])>span{border-width:5px}:host([orbit])>span:nth-child(2){animation:orbit 2s linear infinite}:host([orbit][sm])>span{border-width:8px}:host([orbit][md])>span{border-width:13px}:host([orbit][lg])>span{border-width:21px}@keyframes orbit{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}:host([ringworm])>svg{animation:rotate 2s linear infinite;height:100%;width:100%;stroke:currentcolor;stroke-width:8}:host([ringworm]) .path{stroke-dashoffset:0;animation:ringworm 1.5s ease-in-out infinite;stroke-linecap:round}@keyframes rotate{100%{transform:rotate(360deg)}}@keyframes ringworm{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}100%{stroke-dasharray:89,200;stroke-dashoffset:-124px}}:host([laser]){position:static;width:100%;display:block;height:0;overflow:hidden;font-size:unset}:host([laser])>span{position:fixed;width:100%;height:.25rem;border-radius:0;z-index:100}:host([laser])>span:nth-child(1){border-color:currentcolor;opacity:.25}:host([laser])>span:nth-child(2){border-color:currentcolor;animation:laser 2s linear infinite;opacity:1;width:50%}:host([laser][sm])>span:nth-child(2){width:20%}:host([laser][md])>span:nth-child(2){width:30%}:host([laser][lg])>span:nth-child(2){width:50%;animation-duration:1.5s}:host([laser][xl])>span:nth-child(2){width:80%;animation-duration:1.5s}@keyframes laser{0%{left:-100%}100%{left:110%}}:host>.no-animation{display:none}@media(prefers-reduced-motion: reduce){:host{display:flex;align-items:center;justify-content:center;font-size:1rem}:host>span{opacity:1}:host>.loader{display:none}:host>.no-animation{display:block}}`;
|
|
22031
21250
|
|
|
22032
|
-
var colorCss$1 = i$5`:host{color:var(--ds-auro-loader-color)}:host>span{background-color:var(--ds-auro-loader-background-color);border-color:var(--ds-auro-loader-border-color)}:host([onlight]){--ds-auro-loader-color:var(--ds-color-
|
|
21251
|
+
var colorCss$1 = i$5`:host{color:var(--ds-auro-loader-color)}:host>span{background-color:var(--ds-auro-loader-background-color);border-color:var(--ds-auro-loader-border-color)}:host([onlight]){--ds-auro-loader-color:var(--ds-basic-color-brand-primary, #01426a)}:host([ondark]){--ds-auro-loader-color:var(--ds-basic-color-texticon-inverse, #ffffff)}:host([orbit])>span{--ds-auro-loader-background-color:transparent}:host([orbit])>span:nth-child(1){--ds-auro-loader-border-color:currentcolor;opacity:.25}:host([orbit])>span:nth-child(2){--ds-auro-loader-border-color:currentcolor;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent}`;
|
|
22033
21252
|
|
|
22034
21253
|
var tokensCss$1 = i$5`:host{--ds-auro-loader-background-color:currentcolor;--ds-auro-loader-border-color:currentcolor;--ds-auro-loader-color:currentcolor}`;
|
|
22035
21254
|
|
|
@@ -22037,25 +21256,6 @@ var tokensCss$1 = i$5`:host{--ds-auro-loader-background-color:currentcolor;--ds-
|
|
|
22037
21256
|
// See LICENSE in the project root for license information.
|
|
22038
21257
|
|
|
22039
21258
|
|
|
22040
|
-
// See https://git.io/JJ6SJ for "How to document your components using JSDoc"
|
|
22041
|
-
/**
|
|
22042
|
-
* The auro-loader element is an easy to use animated loader component.
|
|
22043
|
-
*
|
|
22044
|
-
* @attr {Boolean} pulse - sets loader type
|
|
22045
|
-
* @attr {Boolean} ringworm - sets loader type
|
|
22046
|
-
* @attr {Boolean} laser - sets loader type
|
|
22047
|
-
* @attr {Boolean} orbit - sets loader type
|
|
22048
|
-
* @attr {Boolean} white - sets color of loader to white
|
|
22049
|
-
* @attr {Boolean} ondark - sets color of loader to auro-color-ui-default-on-dark
|
|
22050
|
-
* @attr {Boolean} onlight - sets color of loader to auro-color-ui-default-on-light
|
|
22051
|
-
* @attr {Boolean} xs - sets size to extra small
|
|
22052
|
-
* @attr {Boolean} sm - sets size to small
|
|
22053
|
-
* @attr {Boolean} md - sets size to medium
|
|
22054
|
-
* @attr {Boolean} lg - sets size to large
|
|
22055
|
-
* @csspart element - apply style to adjust speed of animation
|
|
22056
|
-
*/
|
|
22057
|
-
|
|
22058
|
-
// build the component class
|
|
22059
21259
|
class AuroLoader extends r$2 {
|
|
22060
21260
|
constructor() {
|
|
22061
21261
|
super();
|
|
@@ -22089,19 +21289,35 @@ class AuroLoader extends r$2 {
|
|
|
22089
21289
|
// function to define props used within the scope of this component
|
|
22090
21290
|
static get properties() {
|
|
22091
21291
|
return {
|
|
22092
|
-
|
|
21292
|
+
|
|
21293
|
+
/**
|
|
21294
|
+
* Sets loader to laser type.
|
|
21295
|
+
*/
|
|
21296
|
+
laser: {
|
|
22093
21297
|
type: Boolean,
|
|
22094
21298
|
reflect: true
|
|
22095
21299
|
},
|
|
21300
|
+
|
|
21301
|
+
/**
|
|
21302
|
+
* Sets loader to orbit type.
|
|
21303
|
+
*/
|
|
22096
21304
|
orbit: {
|
|
22097
21305
|
type: Boolean,
|
|
22098
21306
|
reflect: true
|
|
22099
21307
|
},
|
|
22100
|
-
|
|
21308
|
+
|
|
21309
|
+
/**
|
|
21310
|
+
* Sets loader to pulse type.
|
|
21311
|
+
*/
|
|
21312
|
+
pulse: {
|
|
22101
21313
|
type: Boolean,
|
|
22102
21314
|
reflect: true
|
|
22103
21315
|
},
|
|
22104
|
-
|
|
21316
|
+
|
|
21317
|
+
/**
|
|
21318
|
+
* Sets loader to ringworm type.
|
|
21319
|
+
*/
|
|
21320
|
+
ringworm: {
|
|
22105
21321
|
type: Boolean,
|
|
22106
21322
|
reflect: true
|
|
22107
21323
|
}
|
|
@@ -22175,23 +21391,26 @@ class AuroLoader extends r$2 {
|
|
|
22175
21391
|
}
|
|
22176
21392
|
}
|
|
22177
21393
|
|
|
22178
|
-
var loaderVersion = '
|
|
21394
|
+
var loaderVersion = '5.0.0';
|
|
22179
21395
|
|
|
21396
|
+
/* eslint-disable max-lines */
|
|
22180
21397
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
22181
21398
|
// See LICENSE in the project root for license information.
|
|
22182
21399
|
|
|
22183
21400
|
|
|
22184
21401
|
/**
|
|
22185
21402
|
* @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
|
|
22186
|
-
* @attr {Boolean} disabled - If set to true button will become disabled and not allow for interactions
|
|
21403
|
+
* @attr {Boolean} disabled - If set to true, button will become disabled and not allow for interactions
|
|
22187
21404
|
* @attr {Boolean} iconOnly - If set to true, the button will contain an icon with no additional content
|
|
22188
21405
|
* @attr {Boolean} loading - If set to true button text will be replaced with `auro-loader` and become disabled
|
|
21406
|
+
* @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.
|
|
22189
21407
|
* @attr {Boolean} onDark - Set value for on-dark version of auro-button
|
|
22190
21408
|
* @attr {Boolean} rounded - If set to true, the button will have a rounded shape
|
|
22191
21409
|
* @attr {Boolean} slim - Set value for slim version of auro-button
|
|
22192
21410
|
* @attr {Boolean} fluid - Alters the shape of the button to be full width of its parent container
|
|
22193
21411
|
* @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.
|
|
22194
21412
|
* @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.
|
|
21413
|
+
* @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.
|
|
22195
21414
|
* @attr {String} id - Set the unique ID of an element.
|
|
22196
21415
|
* @attr {String} title - Sets title attribute. The information is most often shown as a tooltip text when the mouse moves over the element.
|
|
22197
21416
|
* @attr {String} type - The type of the button. Possible values are: `submit`, `reset`, `button`
|
|
@@ -22236,6 +21455,7 @@ class AuroButton extends r$2 {
|
|
|
22236
21455
|
this.rounded = false;
|
|
22237
21456
|
this.slim = false;
|
|
22238
21457
|
this.fluid = false;
|
|
21458
|
+
this.loadingText = this.loadingText || 'Loading...';
|
|
22239
21459
|
|
|
22240
21460
|
// Support for HTML5 forms
|
|
22241
21461
|
if (typeof this.attachInternals === 'function') {
|
|
@@ -22296,6 +21516,9 @@ class AuroButton extends r$2 {
|
|
|
22296
21516
|
type: Boolean,
|
|
22297
21517
|
reflect: true
|
|
22298
21518
|
},
|
|
21519
|
+
loadingText: {
|
|
21520
|
+
type: String
|
|
21521
|
+
},
|
|
22299
21522
|
onDark: {
|
|
22300
21523
|
type: Boolean,
|
|
22301
21524
|
reflect: true
|
|
@@ -22316,6 +21539,10 @@ class AuroButton extends r$2 {
|
|
|
22316
21539
|
type: String,
|
|
22317
21540
|
reflect: true
|
|
22318
21541
|
},
|
|
21542
|
+
ariaexpanded: {
|
|
21543
|
+
type: Boolean,
|
|
21544
|
+
reflect: true
|
|
21545
|
+
},
|
|
22319
21546
|
title: {
|
|
22320
21547
|
type: String,
|
|
22321
21548
|
reflect: true
|
|
@@ -22345,7 +21572,7 @@ class AuroButton extends r$2 {
|
|
|
22345
21572
|
*
|
|
22346
21573
|
*/
|
|
22347
21574
|
static register(name = "auro-button") {
|
|
22348
|
-
AuroLibraryRuntimeUtils$
|
|
21575
|
+
AuroLibraryRuntimeUtils$1.prototype.registerComponent(name, AuroButton);
|
|
22349
21576
|
}
|
|
22350
21577
|
|
|
22351
21578
|
/**
|
|
@@ -22387,12 +21614,22 @@ class AuroButton extends r$2 {
|
|
|
22387
21614
|
this.notifyReady();
|
|
22388
21615
|
}
|
|
22389
21616
|
|
|
21617
|
+
/**
|
|
21618
|
+
* Submits the form that this button is associated with.
|
|
21619
|
+
* @private
|
|
21620
|
+
* @returns {void}
|
|
21621
|
+
*/
|
|
22390
21622
|
surfaceSubmitEvent() {
|
|
22391
21623
|
if (this.form) {
|
|
22392
21624
|
this.form.requestSubmit();
|
|
22393
21625
|
}
|
|
22394
21626
|
}
|
|
22395
21627
|
|
|
21628
|
+
/**
|
|
21629
|
+
* Returns the form element that this button is associated with.
|
|
21630
|
+
* @private
|
|
21631
|
+
* @returns {HTMLFormElement|null}
|
|
21632
|
+
*/
|
|
22396
21633
|
get form() {
|
|
22397
21634
|
return this.internals ? this.internals.form : null;
|
|
22398
21635
|
}
|
|
@@ -22412,8 +21649,9 @@ class AuroButton extends r$2 {
|
|
|
22412
21649
|
return u$2`
|
|
22413
21650
|
<button
|
|
22414
21651
|
part="button"
|
|
22415
|
-
aria-label="${o(this.
|
|
21652
|
+
aria-label="${o(this.loading ? this.loadingText : this.arialabel || undefined)}"
|
|
22416
21653
|
aria-labelledby="${o(this.arialabelledby ? this.arialabelledby : undefined)}"
|
|
21654
|
+
aria-expanded="${o(this.ariaexpanded)}"
|
|
22417
21655
|
?autofocus="${this.autofocus}"
|
|
22418
21656
|
class="${e(classes)}"
|
|
22419
21657
|
?disabled="${this.disabled || this.loading}"
|
|
@@ -22441,13 +21679,13 @@ class AuroButton extends r$2 {
|
|
|
22441
21679
|
}
|
|
22442
21680
|
}
|
|
22443
21681
|
|
|
22444
|
-
var buttonVersion = '
|
|
21682
|
+
var buttonVersion = '9.3.0';
|
|
22445
21683
|
|
|
22446
|
-
var colorCss = i$5`:host([error]){--ds-auro-helptext-color: var(--ds-color-
|
|
21684
|
+
var colorCss = i$5`:host([error]){--ds-auro-helptext-color: var(--ds-basic-color-status-error, #e31f26)}:host([onDark]){--ds-auro-helptext-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}:host([onDark][error]){--ds-auro-helptext-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8)}.helptext-wrapper{color:var(--ds-auro-helptext-color)}`;
|
|
22447
21685
|
|
|
22448
21686
|
var styleCss = i$5`.helptext-wrapper{display:none;font-size:var(--ds-text-body-size-xs, 0.75rem);line-height:var(--ds-size-200, 1rem)}:host([large]) .helptext-wrapper{font-size:var(--ds-text-body-size-default, 1rem)}.helptext-wrapper[visible]{display:block}::slotted(*:not(:empty)){margin-top:var(--ds-size-50, 0.25rem);margin-bottom:0}::slotted(p){margin-block:0}`;
|
|
22449
21687
|
|
|
22450
|
-
var tokensCss = i$5`:host{--ds-auro-helptext-color: var(--ds-color-
|
|
21688
|
+
var tokensCss = i$5`:host{--ds-auro-helptext-color: var(--ds-basic-color-texticon-muted, #676767)}`;
|
|
22451
21689
|
|
|
22452
21690
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
22453
21691
|
// See LICENSE in the project root for license information.
|
|
@@ -22534,6 +21772,7 @@ class AuroHelpText extends r$2 {
|
|
|
22534
21772
|
super();
|
|
22535
21773
|
|
|
22536
21774
|
this.error = false;
|
|
21775
|
+
this.onDark = false;
|
|
22537
21776
|
this.hasTextContent = false;
|
|
22538
21777
|
|
|
22539
21778
|
AuroLibraryRuntimeUtils.prototype.handleComponentTagRename(this, 'auro-helptext');
|
|
@@ -22572,6 +21811,14 @@ class AuroHelpText extends r$2 {
|
|
|
22572
21811
|
type: Boolean,
|
|
22573
21812
|
reflect: true,
|
|
22574
21813
|
},
|
|
21814
|
+
|
|
21815
|
+
/**
|
|
21816
|
+
* If declared, will apply onDark styles.
|
|
21817
|
+
*/
|
|
21818
|
+
onDark: {
|
|
21819
|
+
type: Boolean,
|
|
21820
|
+
reflect: true
|
|
21821
|
+
}
|
|
22575
21822
|
};
|
|
22576
21823
|
}
|
|
22577
21824
|
|
|
@@ -22654,7 +21901,7 @@ class AuroInput extends BaseInput {
|
|
|
22654
21901
|
/**
|
|
22655
21902
|
* Generate unique names for dependency components.
|
|
22656
21903
|
*/
|
|
22657
|
-
const versioning = new AuroDependencyVersioning
|
|
21904
|
+
const versioning = new AuroDependencyVersioning();
|
|
22658
21905
|
|
|
22659
21906
|
/**
|
|
22660
21907
|
* @private
|
|
@@ -22681,7 +21928,7 @@ class AuroInput extends BaseInput {
|
|
|
22681
21928
|
*
|
|
22682
21929
|
*/
|
|
22683
21930
|
static register(name = "auro-input") {
|
|
22684
|
-
AuroLibraryRuntimeUtils$
|
|
21931
|
+
AuroLibraryRuntimeUtils$1.prototype.registerComponent(name, AuroInput);
|
|
22685
21932
|
}
|
|
22686
21933
|
|
|
22687
21934
|
/**
|
|
@@ -22721,7 +21968,8 @@ class AuroInput extends BaseInput {
|
|
|
22721
21968
|
category="payment"
|
|
22722
21969
|
name="${name}"
|
|
22723
21970
|
part="accentIcon"
|
|
22724
|
-
?
|
|
21971
|
+
?onDark="${this.onDark}"
|
|
21972
|
+
variant="${this.disabled ? 'disabled' : 'muted'}">
|
|
22725
21973
|
</${this.iconTag}>
|
|
22726
21974
|
`) : undefined
|
|
22727
21975
|
}
|
|
@@ -22733,7 +21981,8 @@ class AuroInput extends BaseInput {
|
|
|
22733
21981
|
category="interface"
|
|
22734
21982
|
name="calendar"
|
|
22735
21983
|
part="accentIcon"
|
|
22736
|
-
?
|
|
21984
|
+
?onDark="${this.onDark}"
|
|
21985
|
+
variant="${this.disabled ? 'disabled' : 'muted'}">
|
|
22737
21986
|
</${this.iconTag}>`
|
|
22738
21987
|
: undefined
|
|
22739
21988
|
}
|
|
@@ -22778,7 +22027,7 @@ class AuroInput extends BaseInput {
|
|
|
22778
22027
|
<${this.iconTag}
|
|
22779
22028
|
category="alert"
|
|
22780
22029
|
name="error-stroke"
|
|
22781
|
-
|
|
22030
|
+
customColor
|
|
22782
22031
|
</${this.iconTag}>
|
|
22783
22032
|
</div>
|
|
22784
22033
|
` : undefined}
|
|
@@ -22787,6 +22036,7 @@ class AuroInput extends BaseInput {
|
|
|
22787
22036
|
<div class="notification">
|
|
22788
22037
|
<${this.buttonTag}
|
|
22789
22038
|
variant="flat"
|
|
22039
|
+
?onDark="${this.onDark}"
|
|
22790
22040
|
aria-hidden="true"
|
|
22791
22041
|
tabindex="-1"
|
|
22792
22042
|
@click="${this.handleClickShowPassword}"
|
|
@@ -22810,6 +22060,7 @@ class AuroInput extends BaseInput {
|
|
|
22810
22060
|
<div class="notification">
|
|
22811
22061
|
<${this.buttonTag}
|
|
22812
22062
|
variant="flat"
|
|
22063
|
+
?onDark="${this.onDark}"
|
|
22813
22064
|
class="notificationBtn clearBtn"
|
|
22814
22065
|
aria-label="${i18n(this.lang, 'clearInput')}"
|
|
22815
22066
|
@click="${this.handleClickClear}">
|
|
@@ -22828,14 +22079,14 @@ class AuroInput extends BaseInput {
|
|
|
22828
22079
|
<!-- Help text and error message template -->
|
|
22829
22080
|
${!this.validity || this.validity === undefined || this.validity === 'valid'
|
|
22830
22081
|
? u$2`
|
|
22831
|
-
<${this.helpTextTag}>
|
|
22082
|
+
<${this.helpTextTag} ?onDark="${this.onDark}">
|
|
22832
22083
|
<p id="${this.uniqueId}" part="helpText">
|
|
22833
22084
|
<slot name="helptext">${this.getHelpText()}</slot>
|
|
22834
22085
|
</p>
|
|
22835
22086
|
</${this.helpTextTag}>
|
|
22836
22087
|
`
|
|
22837
22088
|
: u$2`
|
|
22838
|
-
<${this.helpTextTag} error>
|
|
22089
|
+
<${this.helpTextTag} error ?onDark="${this.onDark}">
|
|
22839
22090
|
<p id="${this.uniqueId}" role="alert" aria-live="assertive" part="helpText">
|
|
22840
22091
|
${this.errorMessage}
|
|
22841
22092
|
</p>
|
|
@@ -22900,7 +22151,9 @@ class AuroDatePicker extends r$2 {
|
|
|
22900
22151
|
|
|
22901
22152
|
this.disabled = false;
|
|
22902
22153
|
this.required = false;
|
|
22154
|
+
this.onDark = false;
|
|
22903
22155
|
this.range = false;
|
|
22156
|
+
this.stacked = false;
|
|
22904
22157
|
this.noValidate = false;
|
|
22905
22158
|
this.validity = undefined;
|
|
22906
22159
|
this.value = undefined;
|
|
@@ -22932,6 +22185,8 @@ class AuroDatePicker extends r$2 {
|
|
|
22932
22185
|
this.noFlip = false;
|
|
22933
22186
|
this.autoPlacement = false;
|
|
22934
22187
|
|
|
22188
|
+
this.largeFullscreenHeadline = false;
|
|
22189
|
+
|
|
22935
22190
|
/**
|
|
22936
22191
|
* @private
|
|
22937
22192
|
*/
|
|
@@ -22945,7 +22200,7 @@ class AuroDatePicker extends r$2 {
|
|
|
22945
22200
|
/**
|
|
22946
22201
|
* @private
|
|
22947
22202
|
*/
|
|
22948
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
22203
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$4();
|
|
22949
22204
|
|
|
22950
22205
|
/**
|
|
22951
22206
|
* @private
|
|
@@ -22955,7 +22210,7 @@ class AuroDatePicker extends r$2 {
|
|
|
22955
22210
|
/**
|
|
22956
22211
|
* Generate unique names for dependency components.
|
|
22957
22212
|
*/
|
|
22958
|
-
const versioning = new AuroDependencyVersioning$
|
|
22213
|
+
const versioning = new AuroDependencyVersioning$3();
|
|
22959
22214
|
|
|
22960
22215
|
/**
|
|
22961
22216
|
* @private
|
|
@@ -23097,7 +22352,8 @@ class AuroDatePicker extends r$2 {
|
|
|
23097
22352
|
* If set, disables auto-validation on blur.
|
|
23098
22353
|
*/
|
|
23099
22354
|
noValidate: {
|
|
23100
|
-
type: Boolean
|
|
22355
|
+
type: Boolean,
|
|
22356
|
+
reflect: true
|
|
23101
22357
|
},
|
|
23102
22358
|
|
|
23103
22359
|
/**
|
|
@@ -23109,6 +22365,14 @@ class AuroDatePicker extends r$2 {
|
|
|
23109
22365
|
reflect: true
|
|
23110
22366
|
},
|
|
23111
22367
|
|
|
22368
|
+
/**
|
|
22369
|
+
* If declared, onDark styles will be applied to the trigger.
|
|
22370
|
+
*/
|
|
22371
|
+
onDark: {
|
|
22372
|
+
type: Boolean,
|
|
22373
|
+
reflect: true
|
|
22374
|
+
},
|
|
22375
|
+
|
|
23112
22376
|
/**
|
|
23113
22377
|
* Position where the bib should appear relative to the trigger.
|
|
23114
22378
|
* Accepted values:
|
|
@@ -23223,7 +22487,7 @@ class AuroDatePicker extends r$2 {
|
|
|
23223
22487
|
*
|
|
23224
22488
|
*/
|
|
23225
22489
|
static register(name = "auro-datepicker") {
|
|
23226
|
-
AuroLibraryRuntimeUtils$
|
|
22490
|
+
AuroLibraryRuntimeUtils$4.prototype.registerComponent(name, AuroDatePicker);
|
|
23227
22491
|
}
|
|
23228
22492
|
|
|
23229
22493
|
/**
|
|
@@ -23857,6 +23121,7 @@ class AuroDatePicker extends r$2 {
|
|
|
23857
23121
|
fluid
|
|
23858
23122
|
bordered
|
|
23859
23123
|
rounded
|
|
23124
|
+
?onDark="${this.onDark}"
|
|
23860
23125
|
?disabled="${this.disabled}"
|
|
23861
23126
|
?error="${this.validity !== undefined && this.validity !== 'valid'}"
|
|
23862
23127
|
disableEventShow
|
|
@@ -23871,6 +23136,7 @@ class AuroDatePicker extends r$2 {
|
|
|
23871
23136
|
id="${this.generateRandomString(12)}"
|
|
23872
23137
|
bordered
|
|
23873
23138
|
class="dateFrom"
|
|
23139
|
+
?onDark="${this.onDark}"
|
|
23874
23140
|
?required="${this.required}"
|
|
23875
23141
|
noValidate
|
|
23876
23142
|
type="date"
|
|
@@ -23891,6 +23157,7 @@ class AuroDatePicker extends r$2 {
|
|
|
23891
23157
|
id="${this.generateRandomString(12)}"
|
|
23892
23158
|
bordered
|
|
23893
23159
|
class="dateTo"
|
|
23160
|
+
?onDark="${this.onDark}"
|
|
23894
23161
|
?required="${this.required}"
|
|
23895
23162
|
noValidate
|
|
23896
23163
|
type="date"
|