@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
|
@@ -12,7 +12,7 @@ import { repeat } from 'lit/directives/repeat.js';
|
|
|
12
12
|
|
|
13
13
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
14
14
|
|
|
15
|
-
let AuroLibraryRuntimeUtils$
|
|
15
|
+
let AuroLibraryRuntimeUtils$4 = class AuroLibraryRuntimeUtils {
|
|
16
16
|
|
|
17
17
|
/* eslint-disable jsdoc/require-param */
|
|
18
18
|
|
|
@@ -81,7 +81,7 @@ let AuroLibraryRuntimeUtils$9 = class AuroLibraryRuntimeUtils {
|
|
|
81
81
|
|
|
82
82
|
let AuroFormValidation$1 = class AuroFormValidation {
|
|
83
83
|
constructor() {
|
|
84
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
84
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$4();
|
|
85
85
|
}
|
|
86
86
|
|
|
87
87
|
/**
|
|
@@ -390,7 +390,7 @@ let AuroFormValidation$1 = class AuroFormValidation {
|
|
|
390
390
|
// See LICENSE in the project root for license information.
|
|
391
391
|
|
|
392
392
|
|
|
393
|
-
let AuroDependencyVersioning$
|
|
393
|
+
let AuroDependencyVersioning$3 = class AuroDependencyVersioning {
|
|
394
394
|
|
|
395
395
|
/**
|
|
396
396
|
* Generates a unique string to be used for child auro element naming.
|
|
@@ -781,19 +781,19 @@ class UtilitiesCalendarRender {
|
|
|
781
781
|
}
|
|
782
782
|
}
|
|
783
783
|
|
|
784
|
-
var styleCss$d = css`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}[auro-input]::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}}`;
|
|
784
|
+
var styleCss$d = css`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}[auro-input]::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}}`;
|
|
785
785
|
|
|
786
|
-
var colorCss$d = css`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}[auro-input]::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)}
|
|
786
|
+
var colorCss$d = css`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}[auro-input]::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)}`;
|
|
787
787
|
|
|
788
|
-
var tokensCss$a = css`:host{--ds-auro-datepicker-placeholder-color: var(--ds-color-
|
|
788
|
+
var tokensCss$a = css`: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)}`;
|
|
789
789
|
|
|
790
790
|
var styleCss$c = css`: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:""}`;
|
|
791
791
|
|
|
792
|
-
var colorCss$c = css`.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
|
|
792
|
+
var colorCss$c = css`.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)}}`;
|
|
793
793
|
|
|
794
|
-
var styleCss$b = css
|
|
794
|
+
var styleCss$b = css`: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%}`;
|
|
795
795
|
|
|
796
|
-
var colorCss$b = css
|
|
796
|
+
var colorCss$b = css`: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)}`;
|
|
797
797
|
|
|
798
798
|
/******************************************************************************
|
|
799
799
|
Copyright (c) Microsoft Corporation.
|
|
@@ -6779,7 +6779,7 @@ __decorate([property({ type: Array })], RangeDatepickerCell.prototype, "disabled
|
|
|
6779
6779
|
__decorate([property({ type: String })], RangeDatepickerCell.prototype, "hoveredDate", void 0);
|
|
6780
6780
|
__decorate([property({ type: Boolean })], RangeDatepickerCell.prototype, "isCurrentDate", void 0);
|
|
6781
6781
|
__decorate([property({ type: Object })], RangeDatepickerCell.prototype, "locale", null);
|
|
6782
|
-
AuroLibraryRuntimeUtils$
|
|
6782
|
+
AuroLibraryRuntimeUtils$4.prototype.registerComponent('wc-range-datepicker-cell', RangeDatepickerCell);
|
|
6783
6783
|
|
|
6784
6784
|
class Day {
|
|
6785
6785
|
constructor(date) {
|
|
@@ -7297,11 +7297,11 @@ __decorate([property({ type: Array })], RangeDatepickerCalendar.prototype, "year
|
|
|
7297
7297
|
__decorate([property({ type: Array })], RangeDatepickerCalendar.prototype, "monthsList", void 0);
|
|
7298
7298
|
__decorate([property({ type: Array })], RangeDatepickerCalendar.prototype, "dayNamesOfTheWeek", void 0);
|
|
7299
7299
|
__decorate([property({ type: Array })], RangeDatepickerCalendar.prototype, "daysOfMonth", void 0);
|
|
7300
|
-
AuroLibraryRuntimeUtils$
|
|
7300
|
+
AuroLibraryRuntimeUtils$4.prototype.registerComponent('wc-range-datepicker-calendar', RangeDatepickerCalendar);
|
|
7301
7301
|
|
|
7302
7302
|
var styleCss$a = css`@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)}}`;
|
|
7303
7303
|
|
|
7304
|
-
var colorCss$a = css`: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-
|
|
7304
|
+
var colorCss$a = css`: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}`;
|
|
7305
7305
|
|
|
7306
7306
|
var styleCss$9 = css`: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:""}`;
|
|
7307
7307
|
|
|
@@ -9198,7 +9198,7 @@ class AuroPopover extends LitElement {
|
|
|
9198
9198
|
privateDefaults() {
|
|
9199
9199
|
this.isPopoverVisible = false;
|
|
9200
9200
|
this.id = `popover-${(Math.random() + 1).toString(36).substring(7)}`;
|
|
9201
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
9201
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$4();
|
|
9202
9202
|
}
|
|
9203
9203
|
|
|
9204
9204
|
// function to define props used within the scope of this component
|
|
@@ -9228,7 +9228,7 @@ class AuroPopover extends LitElement {
|
|
|
9228
9228
|
*
|
|
9229
9229
|
*/
|
|
9230
9230
|
static register(name = "auro-popover") {
|
|
9231
|
-
AuroLibraryRuntimeUtils$
|
|
9231
|
+
AuroLibraryRuntimeUtils$4.prototype.registerComponent(name, AuroPopover);
|
|
9232
9232
|
}
|
|
9233
9233
|
|
|
9234
9234
|
connectedCallback() {
|
|
@@ -9396,12 +9396,12 @@ class AuroCalendarCell extends LitElement {
|
|
|
9396
9396
|
this.dateStr = null;
|
|
9397
9397
|
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.
|
|
9398
9398
|
|
|
9399
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
9399
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$4();
|
|
9400
9400
|
|
|
9401
9401
|
/**
|
|
9402
9402
|
* Generate unique names for dependency components.
|
|
9403
9403
|
*/
|
|
9404
|
-
const versioning = new AuroDependencyVersioning$
|
|
9404
|
+
const versioning = new AuroDependencyVersioning$3();
|
|
9405
9405
|
this.popoverTag = versioning.generateTag('auro-formkit-datepicker-popover', popoverVersion, AuroPopover);
|
|
9406
9406
|
}
|
|
9407
9407
|
|
|
@@ -9419,7 +9419,10 @@ class AuroCalendarCell extends LitElement {
|
|
|
9419
9419
|
month: { type: String },
|
|
9420
9420
|
min: { type: Number },
|
|
9421
9421
|
max: { type: Number },
|
|
9422
|
-
disabled: {
|
|
9422
|
+
disabled: {
|
|
9423
|
+
type: Boolean,
|
|
9424
|
+
reflect: true
|
|
9425
|
+
},
|
|
9423
9426
|
disabledDays: { type: Array },
|
|
9424
9427
|
hoveredDate: { type: String },
|
|
9425
9428
|
isCurrentDate: { type: Boolean },
|
|
@@ -9760,7 +9763,8 @@ class AuroCalendarMonth extends RangeDatepickerCalendar {
|
|
|
9760
9763
|
* @private
|
|
9761
9764
|
*/
|
|
9762
9765
|
monthFirst: {
|
|
9763
|
-
type: Boolean
|
|
9766
|
+
type: Boolean,
|
|
9767
|
+
reflect: true
|
|
9764
9768
|
}
|
|
9765
9769
|
};
|
|
9766
9770
|
}
|
|
@@ -10292,9 +10296,9 @@ class CalendarUtilities {
|
|
|
10292
10296
|
|
|
10293
10297
|
var colorCss$1$2 = css`#headerContainer{box-shadow:var(--ds-auro-dropdownbib-header-boxshadow-color)}#footerContainer{background-color:var(--ds-auro-dropdownbib-footer-container-color)}`;
|
|
10294
10298
|
|
|
10295
|
-
var styleCss$2$2 = css`#bibTemplate{display:flex;overflow:hidden;height:100%;max-height:100%;flex-direction:column}#headerContainer{display:flex;flex-direction:column}#header{display:flex;width:100%;min-height:var(--ds-size-1000, 5rem);box-sizing:border-box;align-items:end;padding-top:var(--ds-size-400, 2rem);padding-right:var(--ds-size-700, 3.5rem);padding-left:var(--ds-size-200, 1rem);pointer-events:none}#subheader{width:100%}#subheader ::slotted([auro-input]){padding:0 var(--ds-size-200, 1rem)}#closeButton{position:absolute;top:var(--ds-size-400, 2rem);right:var(--ds-size-200, 1rem);border:none;background-color:transparent;cursor:pointer}#closeButton [auro-icon]{--ds-auro-icon-size: var(--ds-size-500,
|
|
10299
|
+
var styleCss$2$2 = css`#bibTemplate{display:flex;overflow:hidden;height:100%;max-height:100%;flex-direction:column}#headerContainer{display:flex;flex-direction:column}#header{display:flex;width:100%;min-height:var(--ds-size-1000, 5rem);box-sizing:border-box;align-items:end;padding-top:var(--ds-size-400, 2rem);padding-right:var(--ds-size-700, 3.5rem);padding-left:var(--ds-size-200, 1rem);pointer-events:none}#subheader{width:100%}#subheader ::slotted([auro-input]){padding:0 var(--ds-size-200, 1rem)}#closeButton{position:absolute;top:var(--ds-size-400, 2rem);right:var(--ds-size-200, 1rem);border:none;background-color:transparent;cursor:pointer}#closeButton [auro-icon]{--ds-auro-icon-size: var(--ds-size-500, 2.5rem)}#bodyContainer{position:relative;overflow:auto;flex:1 1 100%}:host([isfullscreen]) #bibTemplate{max-height:100dvh}:host([isfullscreen]) #bodyContainer{margin-top:var(--ds-size-100, 0.5rem)}#footerContainer{position:absolute;right:0;bottom:0;left:0;padding:var(--ds-size-200, 1rem)}`;
|
|
10296
10300
|
|
|
10297
|
-
var tokenCss = css`:host{--ds-auro-dropdownbib-header-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-footer-container-color: var(--ds-color-
|
|
10301
|
+
var tokenCss = css`:host{--ds-auro-dropdownbib-header-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-footer-container-color: var(--ds-basic-color-surface-default, #ffffff)}`;
|
|
10298
10302
|
|
|
10299
10303
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
10300
10304
|
// See LICENSE in the project root for license information.
|
|
@@ -10303,7 +10307,7 @@ var tokenCss = css`:host{--ds-auro-dropdownbib-header-boxshadow-color: var(--ds-
|
|
|
10303
10307
|
|
|
10304
10308
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
10305
10309
|
|
|
10306
|
-
let AuroLibraryRuntimeUtils$
|
|
10310
|
+
let AuroLibraryRuntimeUtils$1$2 = class AuroLibraryRuntimeUtils {
|
|
10307
10311
|
|
|
10308
10312
|
/* eslint-disable jsdoc/require-param */
|
|
10309
10313
|
|
|
@@ -10370,7 +10374,7 @@ let AuroLibraryRuntimeUtils$2$2 = class AuroLibraryRuntimeUtils {
|
|
|
10370
10374
|
// See LICENSE in the project root for license information.
|
|
10371
10375
|
|
|
10372
10376
|
|
|
10373
|
-
let AuroDependencyVersioning$
|
|
10377
|
+
let AuroDependencyVersioning$2 = class AuroDependencyVersioning {
|
|
10374
10378
|
|
|
10375
10379
|
/**
|
|
10376
10380
|
* Generates a unique string to be used for child auro element naming.
|
|
@@ -10472,7 +10476,7 @@ const cacheFetch$2 = (uri, options = {}) => {
|
|
|
10472
10476
|
return _fetchMap$2.get(uri);
|
|
10473
10477
|
};
|
|
10474
10478
|
|
|
10475
|
-
var styleCss$1$2 = css`:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.ico_squareLarge{fill:currentColor;height:var(--auro-size-lg, var(--ds-size-300, 1.5rem))}.ico_squareSmall{fill:currentColor;height:.6rem}.ico_squareMed{fill:currentColor;height:var(--auro-size-md, var(--ds-size-200, 1rem))}.ico_squareSml{fill:currentColor;height:var(--auro-size-sm, var(--ds-size-150, 0.75rem))}:host{color:currentColor;vertical-align:middle;line-height:1;display:inline-block}
|
|
10479
|
+
var styleCss$1$2 = css`:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.ico_squareLarge{fill:currentColor;height:var(--auro-size-lg, var(--ds-size-300, 1.5rem))}.ico_squareSmall{fill:currentColor;height:.6rem}.ico_squareMed{fill:currentColor;height:var(--auro-size-md, var(--ds-size-200, 1rem))}.ico_squareSml{fill:currentColor;height:var(--auro-size-sm, var(--ds-size-150, 0.75rem))}:host{color:currentColor;vertical-align:middle;line-height:1;display:inline-block}svg{min-width:var(--ds-auro-icon-size, 1.5rem) !important;width:var(--ds-auro-icon-size, 1.5rem) !important;height:var(--ds-auro-icon-size, 1.5rem) !important}.componentWrapper{display:flex}.svgWrapper{height:var(--ds-auro-icon-size);width:var(--ds-auro-icon-size)}.labelWrapper{margin-left:var(--ds-size-50, 0.25rem);line-height:1.8}`;
|
|
10476
10480
|
|
|
10477
10481
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
10478
10482
|
// See LICENSE in the project root for license information.
|
|
@@ -10480,7 +10484,6 @@ var styleCss$1$2 = css`:focus:not(:focus-visible){outline:3px solid transparent}
|
|
|
10480
10484
|
|
|
10481
10485
|
// See https://git.io/JJ6SJ for "How to document your components using JSDoc"
|
|
10482
10486
|
/**
|
|
10483
|
-
* @attr {Boolean} onDark - Set value for on-dark version of auro-icon
|
|
10484
10487
|
* @slot - Hidden from visibility, used for a11y if icon description is needed
|
|
10485
10488
|
*/
|
|
10486
10489
|
|
|
@@ -10495,6 +10498,10 @@ let BaseIcon$2 = class BaseIcon extends AuroElement$2 {
|
|
|
10495
10498
|
static get properties() {
|
|
10496
10499
|
return {
|
|
10497
10500
|
...super.properties,
|
|
10501
|
+
|
|
10502
|
+
/**
|
|
10503
|
+
* Set value for on-dark version of auro-icon.
|
|
10504
|
+
*/
|
|
10498
10505
|
onDark: {
|
|
10499
10506
|
type: Boolean,
|
|
10500
10507
|
reflect: true
|
|
@@ -10553,81 +10560,11 @@ let BaseIcon$2 = class BaseIcon extends AuroElement$2 {
|
|
|
10553
10560
|
}
|
|
10554
10561
|
};
|
|
10555
10562
|
|
|
10556
|
-
var tokensCss$8 = css`:host{--ds-auro-icon-color:var(--ds-color-
|
|
10557
|
-
|
|
10558
|
-
var colorCss$8 = css`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[accent]){--ds-auro-icon-color:var(--ds-color-icon-accent-default, #a2c270)}:host(:not([onDark])[disabled]){--ds-auro-icon-color:var(--ds-color-icon-ui-primary-disabled-default, #adadad)}:host(:not([onDark])[emphasis]){--ds-auro-icon-color:var(--ds-color-icon-emphasis-default, #2a2a2a)}:host(:not([onDark])[error]){--ds-auro-icon-color:var(--ds-color-icon-error-default, #cc1816)}:host(:not([onDark])[info]){--ds-auro-icon-color:var(--ds-color-icon-info-default, #326aa5)}:host(:not([onDark])[secondary]){--ds-auro-icon-color:var(--ds-color-icon-secondary-default, #7e8894)}:host(:not([onDark])[subtle]){--ds-auro-icon-color:var(--ds-color-icon-subtle-default, #a0c9f1)}:host(:not([onDark])[success]){--ds-auro-icon-color:var(--ds-color-icon-success-default, #40a080)}:host(:not([onDark])[tertiary]){--ds-auro-icon-color:var(--ds-color-icon-tertiary-default, #afb9c6)}:host(:not([onDark])[warning]){--ds-auro-icon-color:var(--ds-color-icon-warning-default, #c49432)}:host([onDark]){--ds-auro-icon-color:var(--ds-color-icon-primary-inverse, #f7f7f7)}:host([onDark][accent]){--ds-auro-icon-color:var(--ds-color-icon-accent-inverse, #badd81)}:host([onDark][disabled]){--ds-auro-icon-color:var(--ds-color-icon-ui-primary-disabled-inverse, #7e7e7e)}:host([onDark][emphasis]){--ds-auro-icon-color:var(--ds-color-icon-emphasis-inverse, #ffffff)}:host([onDark][error]){--ds-auro-icon-color:var(--ds-color-icon-error-inverse, #f9aca6)}:host([onDark][info]){--ds-auro-icon-color:var(--ds-color-icon-info-inverse, #89b2d4)}:host([onDark][secondary]){--ds-auro-icon-color:var(--ds-color-icon-secondary-inverse, #ccd2db)}:host([onDark][subtle]){--ds-auro-icon-color:var(--ds-color-icon-subtle-inverse, #326aa5)}:host([onDark][success]){--ds-auro-icon-color:var(--ds-color-icon-success-inverse, #8eceb9)}:host([onDark][tertiary]){--ds-auro-icon-color:var(--ds-color-icon-tertiary-inverse, #939fad)}:host([onDark][warning]){--ds-auro-icon-color:var(--ds-color-icon-warning-inverse, #f2c153)}`;
|
|
10559
|
-
|
|
10560
|
-
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
10561
|
-
// See LICENSE in the project root for license information.
|
|
10562
|
-
|
|
10563
|
-
// ---------------------------------------------------------------------
|
|
10564
|
-
|
|
10565
|
-
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
10566
|
-
|
|
10567
|
-
let AuroLibraryRuntimeUtils$1$2 = class AuroLibraryRuntimeUtils {
|
|
10568
|
-
|
|
10569
|
-
/* eslint-disable jsdoc/require-param */
|
|
10570
|
-
|
|
10571
|
-
/**
|
|
10572
|
-
* This will register a new custom element with the browser.
|
|
10573
|
-
* @param {String} name - The name of the custom element.
|
|
10574
|
-
* @param {Object} componentClass - The class to register as a custom element.
|
|
10575
|
-
* @returns {void}
|
|
10576
|
-
*/
|
|
10577
|
-
registerComponent(name, componentClass) {
|
|
10578
|
-
if (!customElements.get(name)) {
|
|
10579
|
-
customElements.define(name, class extends componentClass {});
|
|
10580
|
-
}
|
|
10581
|
-
}
|
|
10582
|
-
|
|
10583
|
-
/**
|
|
10584
|
-
* Finds and returns the closest HTML Element based on a selector.
|
|
10585
|
-
* @returns {void}
|
|
10586
|
-
*/
|
|
10587
|
-
closestElement(
|
|
10588
|
-
selector, // selector like in .closest()
|
|
10589
|
-
base = this, // extra functionality to skip a parent
|
|
10590
|
-
__Closest = (el, found = el && el.closest(selector)) =>
|
|
10591
|
-
!el || el === document || el === window
|
|
10592
|
-
? null // standard .closest() returns null for non-found selectors also
|
|
10593
|
-
: found
|
|
10594
|
-
? found // found a selector INside this element
|
|
10595
|
-
: __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
|
|
10596
|
-
) {
|
|
10597
|
-
return __Closest(base);
|
|
10598
|
-
}
|
|
10599
|
-
/* eslint-enable jsdoc/require-param */
|
|
10600
|
-
|
|
10601
|
-
/**
|
|
10602
|
-
* 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.
|
|
10603
|
-
* @param {Object} elem - The element to check.
|
|
10604
|
-
* @param {String} tagName - The name of the Auro component to check for or add as an attribute.
|
|
10605
|
-
* @returns {void}
|
|
10606
|
-
*/
|
|
10607
|
-
handleComponentTagRename(elem, tagName) {
|
|
10608
|
-
const tag = tagName.toLowerCase();
|
|
10609
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
10610
|
-
|
|
10611
|
-
if (elemTag !== tag) {
|
|
10612
|
-
elem.setAttribute(tag, true);
|
|
10613
|
-
}
|
|
10614
|
-
}
|
|
10615
|
-
|
|
10616
|
-
/**
|
|
10617
|
-
* Validates if an element is a specific Auro component.
|
|
10618
|
-
* @param {Object} elem - The element to validate.
|
|
10619
|
-
* @param {String} tagName - The name of the Auro component to check against.
|
|
10620
|
-
* @returns {Boolean} - Returns true if the element is the specified Auro component.
|
|
10621
|
-
*/
|
|
10622
|
-
elementMatch(elem, tagName) {
|
|
10623
|
-
const tag = tagName.toLowerCase();
|
|
10624
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
10563
|
+
var tokensCss$8 = css`:host{--ds-auro-icon-color:var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-alaska-color:#02426D;--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}`;
|
|
10625
10564
|
|
|
10626
|
-
|
|
10627
|
-
}
|
|
10628
|
-
};
|
|
10565
|
+
var colorCss$8 = css`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[variant=accent1]){--ds-auro-icon-color:var(--ds-basic-color-texticon-accent1, #265688)}:host(:not([onDark])[variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:not([onDark])[variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-muted, #676767)}:host(:not([onDark])[variant=statusDefault]){--ds-auro-icon-color:var(--ds-basic-color-status-default, #afb9c6)}:host(:not([onDark])[variant=statusInfo]){--ds-auro-icon-color:var(--ds-basic-color-status-info, #01426a)}:host(:not([onDark])[variant=statusSuccess]){--ds-auro-icon-color:var(--ds-basic-color-status-success, #447a1f)}:host(:not([onDark])[variant=statusWarning]){--ds-auro-icon-color:var(--ds-basic-color-status-warning, #fac200)}:host(:not([onDark])[variant=statusError]){--ds-auro-icon-color:var(--ds-basic-color-status-error, #e31f26)}:host(:not([onDark])[variant=statusInfoSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-info-subtle, #ebf3f9)}:host(:not([onDark])[variant=statusSuccessSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-success-subtle, #d6eac7)}:host(:not([onDark])[variant=statusWarningSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-warning-subtle, #fff0b2)}:host(:not([onDark])[variant=statusErrorSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-error-subtle, #fbc6c6)}:host(:not([onDark])[variant=fareBasicEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-basiceconomy, #97eaf8)}:host(:not([onDark])[variant=fareBusiness]){--ds-auro-icon-color:var(--ds-basic-color-fare-business, #01426a)}:host(:not([onDark])[variant=fareEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-economy, #0074ca)}:host(:not([onDark])[variant=fareFirst]){--ds-auro-icon-color:var(--ds-basic-color-fare-first, #00274a)}:host(:not([onDark])[variant=farePremiumEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-premiumeconomy, #005154)}:host(:not([onDark])[variant=fareOneWorldEmerald]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-emerald, #139142)}:host(:not([onDark])[variant=fareOneWorldSapphire]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-sapphire, #015daa)}:host(:not([onDark])[variant=fareOneWorldRuby]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-ruby, #a41d4a)}:host([onDark]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse, #ffffff)}:host([onDark][variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([onDark][variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}`;
|
|
10629
10566
|
|
|
10630
|
-
// Copyright (c)
|
|
10567
|
+
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
10631
10568
|
// See LICENSE in the project root for license information.
|
|
10632
10569
|
|
|
10633
10570
|
|
|
@@ -10635,6 +10572,7 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
|
|
|
10635
10572
|
constructor() {
|
|
10636
10573
|
super();
|
|
10637
10574
|
|
|
10575
|
+
this.variant = undefined;
|
|
10638
10576
|
this.privateDefaults();
|
|
10639
10577
|
}
|
|
10640
10578
|
|
|
@@ -10644,20 +10582,6 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
|
|
|
10644
10582
|
* @returns {void}
|
|
10645
10583
|
*/
|
|
10646
10584
|
privateDefaults() {
|
|
10647
|
-
this.accent = false;
|
|
10648
|
-
this.customColor = false;
|
|
10649
|
-
this.customSvg = false;
|
|
10650
|
-
this.disabled = false;
|
|
10651
|
-
this.emphasis = false;
|
|
10652
|
-
this.error = false;
|
|
10653
|
-
this.info = false;
|
|
10654
|
-
this.label = false;
|
|
10655
|
-
this.primary = false;
|
|
10656
|
-
this.secondary = false;
|
|
10657
|
-
this.subtle = false;
|
|
10658
|
-
this.success = false;
|
|
10659
|
-
this.tertiary = false;
|
|
10660
|
-
this.warning = false;
|
|
10661
10585
|
this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
|
|
10662
10586
|
this.runtimeUtils = new AuroLibraryRuntimeUtils$1$2();
|
|
10663
10587
|
}
|
|
@@ -10667,14 +10591,6 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
|
|
|
10667
10591
|
return {
|
|
10668
10592
|
...super.properties,
|
|
10669
10593
|
|
|
10670
|
-
/**
|
|
10671
|
-
* Sets the icon to use the accent style.
|
|
10672
|
-
*/
|
|
10673
|
-
accent: {
|
|
10674
|
-
type: Boolean,
|
|
10675
|
-
reflect: true
|
|
10676
|
-
},
|
|
10677
|
-
|
|
10678
10594
|
/**
|
|
10679
10595
|
* Set aria-hidden value. Default is `true`. Option is `false`.
|
|
10680
10596
|
*/
|
|
@@ -10705,38 +10621,6 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
|
|
|
10705
10621
|
type: Boolean
|
|
10706
10622
|
},
|
|
10707
10623
|
|
|
10708
|
-
/**
|
|
10709
|
-
* Sets the icon to use the disabled style.
|
|
10710
|
-
*/
|
|
10711
|
-
disabled: {
|
|
10712
|
-
type: Boolean,
|
|
10713
|
-
reflect: true
|
|
10714
|
-
},
|
|
10715
|
-
|
|
10716
|
-
/**
|
|
10717
|
-
* Sets the icon to use the emphasis style.
|
|
10718
|
-
*/
|
|
10719
|
-
emphasis: {
|
|
10720
|
-
type: Boolean,
|
|
10721
|
-
reflect: true
|
|
10722
|
-
},
|
|
10723
|
-
|
|
10724
|
-
/**
|
|
10725
|
-
* Sets the icon to use the error style.
|
|
10726
|
-
*/
|
|
10727
|
-
error: {
|
|
10728
|
-
type: Boolean,
|
|
10729
|
-
reflect: true
|
|
10730
|
-
},
|
|
10731
|
-
|
|
10732
|
-
/**
|
|
10733
|
-
* Sets the icon to use the info style.
|
|
10734
|
-
*/
|
|
10735
|
-
info: {
|
|
10736
|
-
type: Boolean,
|
|
10737
|
-
reflect: true
|
|
10738
|
-
},
|
|
10739
|
-
|
|
10740
10624
|
/**
|
|
10741
10625
|
* Exposes content in slot as icon label.
|
|
10742
10626
|
*/
|
|
@@ -10754,50 +10638,10 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
|
|
|
10754
10638
|
},
|
|
10755
10639
|
|
|
10756
10640
|
/**
|
|
10757
|
-
*
|
|
10758
|
-
*/
|
|
10759
|
-
primary: {
|
|
10760
|
-
type: Boolean,
|
|
10761
|
-
reflect: true
|
|
10762
|
-
},
|
|
10763
|
-
|
|
10764
|
-
/**
|
|
10765
|
-
* Sets the icon to use the secondary style.
|
|
10766
|
-
*/
|
|
10767
|
-
secondary: {
|
|
10768
|
-
type: Boolean,
|
|
10769
|
-
reflect: true
|
|
10770
|
-
},
|
|
10771
|
-
|
|
10772
|
-
/**
|
|
10773
|
-
* Sets the icon to use the subtle style.
|
|
10774
|
-
*/
|
|
10775
|
-
subtle: {
|
|
10776
|
-
type: Boolean,
|
|
10777
|
-
reflect: true
|
|
10778
|
-
},
|
|
10779
|
-
|
|
10780
|
-
/**
|
|
10781
|
-
* Sets the icon to use the success style.
|
|
10782
|
-
*/
|
|
10783
|
-
success: {
|
|
10784
|
-
type: Boolean,
|
|
10785
|
-
reflect: true
|
|
10786
|
-
},
|
|
10787
|
-
|
|
10788
|
-
/**
|
|
10789
|
-
* Sets the icon to use the tertiary style.
|
|
10790
|
-
*/
|
|
10791
|
-
tertiary: {
|
|
10792
|
-
type: Boolean,
|
|
10793
|
-
reflect: true
|
|
10794
|
-
},
|
|
10795
|
-
|
|
10796
|
-
/**
|
|
10797
|
-
* Sets the icon to use the warning style.
|
|
10641
|
+
* 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`.
|
|
10798
10642
|
*/
|
|
10799
|
-
|
|
10800
|
-
type:
|
|
10643
|
+
variant: {
|
|
10644
|
+
type: String,
|
|
10801
10645
|
reflect: true
|
|
10802
10646
|
}
|
|
10803
10647
|
};
|
|
@@ -10887,7 +10731,7 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
|
|
|
10887
10731
|
}
|
|
10888
10732
|
};
|
|
10889
10733
|
|
|
10890
|
-
var iconVersion$2 = '
|
|
10734
|
+
var iconVersion$2 = '8.0.1';
|
|
10891
10735
|
|
|
10892
10736
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
10893
10737
|
// See LICENSE in the project root for license information.
|
|
@@ -10896,7 +10740,7 @@ var iconVersion$2 = '7.0.1';
|
|
|
10896
10740
|
|
|
10897
10741
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
10898
10742
|
|
|
10899
|
-
let AuroLibraryRuntimeUtils$
|
|
10743
|
+
let AuroLibraryRuntimeUtils$3 = class AuroLibraryRuntimeUtils {
|
|
10900
10744
|
|
|
10901
10745
|
/* eslint-disable jsdoc/require-param */
|
|
10902
10746
|
|
|
@@ -10988,7 +10832,7 @@ class AuroHeader extends LitElement {
|
|
|
10988
10832
|
/**
|
|
10989
10833
|
* @private
|
|
10990
10834
|
*/
|
|
10991
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
10835
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$3();
|
|
10992
10836
|
}
|
|
10993
10837
|
|
|
10994
10838
|
// function to define props used within the scope of this component
|
|
@@ -11018,7 +10862,7 @@ class AuroHeader extends LitElement {
|
|
|
11018
10862
|
*
|
|
11019
10863
|
*/
|
|
11020
10864
|
static register(name = "auro-header") {
|
|
11021
|
-
AuroLibraryRuntimeUtils$
|
|
10865
|
+
AuroLibraryRuntimeUtils$3.prototype.registerComponent(name, AuroHeader);
|
|
11022
10866
|
}
|
|
11023
10867
|
|
|
11024
10868
|
firstUpdated() {
|
|
@@ -11112,9 +10956,11 @@ class AuroBibtemplate extends LitElement {
|
|
|
11112
10956
|
constructor() {
|
|
11113
10957
|
super();
|
|
11114
10958
|
|
|
11115
|
-
|
|
10959
|
+
this.large = false;
|
|
10960
|
+
|
|
10961
|
+
AuroLibraryRuntimeUtils$1$2.prototype.handleComponentTagRename(this, 'auro-bibtemplate');
|
|
11116
10962
|
|
|
11117
|
-
const versioning = new AuroDependencyVersioning$
|
|
10963
|
+
const versioning = new AuroDependencyVersioning$2();
|
|
11118
10964
|
this.iconTag = versioning.generateTag('auro-formkit-bibtemplate-icon', iconVersion$2, AuroIcon$2);
|
|
11119
10965
|
this.headerTag = versioning.generateTag('auro-formkit-bibtemplate-header', headerVersion, AuroHeader);
|
|
11120
10966
|
}
|
|
@@ -11151,7 +10997,7 @@ class AuroBibtemplate extends LitElement {
|
|
|
11151
10997
|
*
|
|
11152
10998
|
*/
|
|
11153
10999
|
static register(name = "auro-bibtemplate") {
|
|
11154
|
-
AuroLibraryRuntimeUtils$
|
|
11000
|
+
AuroLibraryRuntimeUtils$1$2.prototype.registerComponent(name, AuroBibtemplate);
|
|
11155
11001
|
}
|
|
11156
11002
|
|
|
11157
11003
|
/**
|
|
@@ -11223,267 +11069,84 @@ class AuroBibtemplate extends LitElement {
|
|
|
11223
11069
|
|
|
11224
11070
|
var bibTemplateVersion = '1.0.0';
|
|
11225
11071
|
|
|
11226
|
-
|
|
11227
|
-
// See LICENSE in the project root for license information.
|
|
11228
|
-
|
|
11072
|
+
var styleCss$7 = css`:focus:not(:focus-visible){outline:3px solid transparent}.util_insetNone{padding:0}.util_insetXxxs{padding:.125rem}.util_insetXxxs--stretch{padding:.25rem .125rem}.util_insetXxxs--squish{padding:0 .125rem}.util_insetXxs{padding:.25rem}.util_insetXxs--stretch{padding:.375rem .25rem}.util_insetXxs--squish{padding:.125rem .25rem}.util_insetXs{padding:.5rem}.util_insetXs--stretch{padding:.75rem .5rem}.util_insetXs--squish{padding:.25rem .5rem}.util_insetSm{padding:.75rem}.util_insetSm--stretch{padding:1.125rem .75rem}.util_insetSm--squish{padding:.375rem .75rem}.util_insetMd{padding:1rem}.util_insetMd--stretch{padding:1.5rem 1rem}.util_insetMd--squish{padding:.5rem 1rem}.util_insetLg{padding:1.5rem}.util_insetLg--stretch{padding:2.25rem 1.5rem}.util_insetLg--squish{padding:.75rem 1.5rem}.util_insetXl{padding:2rem}.util_insetXl--stretch{padding:3rem 2rem}.util_insetXl--squish{padding:1rem 2rem}.util_insetXxl{padding:3rem}.util_insetXxl--stretch{padding:4.5rem 3rem}.util_insetXxl--squish{padding:1.5rem 3rem}.util_insetXxxl{padding:4rem}.util_insetXxxl--stretch{padding:6rem 4rem}.util_insetXxxl--squish{padding:2rem 4rem}:host([fluid]) .auro-button,:host([fluid=true]) .auro-button{min-width:auto;width:100%}:host([variant=flat]){display:inline-block;height:var(--ds-size-300, 1.5rem);width:var(--ds-size-300, 1.5rem)}:host([variant=flat]) .auro-button{height:100%;width:100%}::slotted(svg){vertical-align:middle}slot{pointer-events:none}.auro-button{position:relative;padding:0 var(--ds-size-300, 1.5rem);cursor:pointer;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem);font-family:var(--ds-basic-text-body-default-font-family, AS Circular);font-size:var(--ds-basic-text-body-default-font-size, 16px);font-weight:var(--ds-basic-text-body-default-font-weight, Book);overflow:hidden;text-overflow:ellipsis;user-select:none;white-space:nowrap;min-height:var(--ds-size-600, 3rem);max-height:var(--ds-size-600, 3rem);display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--ds-size-100, 0.5rem);margin:0;-webkit-touch-callout:none;-webkit-user-select:none}.auro-button:active{transform:scale(0.95)}.auro-button:focus-visible{outline:none}.auro-button:focus-visible:not([variant=flat]){outline-style:solid;outline-width:var(--ds-size-50, 0.25rem);outline-offset:calc(var(--ds-size-50, 0.25rem)*-1)}.auro-button:focus-visible:not([variant=flat]):not([variant=secondary]):not([variant=tertiary]){outline-width:calc(var(--ds-size-50, 0.25rem) - 1px)}.auro-button.loading{cursor:not-allowed}.auro-button.loading *:not([auro-loader]){visibility:hidden}@media screen and (min-width: 576px){.auro-button{min-width:8.75rem;width:auto}}.auro-button:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=secondary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=flat]{height:unset;width:unset;min-height:unset;max-height:unset;min-width:unset;max-width:unset;border:0;border-radius:unset;gap:unset;padding:unset}.auro-button[onDark]:disabled{cursor:not-allowed;transform:unset}.auro-button[onDark][variant=secondary]:disabled{cursor:not-allowed;transform:unset}@media(hover: hover){.auro-button[onDark][variant=tertiary]:active,.auro-button[onDark][variant=tertiary]:hover{box-shadow:none}}.auro-button[onDark][variant=tertiary]:active{box-shadow:none}.auro-button[onDark][variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button--slim{padding:var(--ds-size-100, 0.5rem) var(--ds-size-200, 1rem);font-size:var(--ds-basic-text-body-sm-font-size, 14px);min-width:unset;min-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem));max-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem))}.auro-button--iconOnly{padding:0 var(--ds-size-100, 0.5rem);border-radius:100px;min-width:unset;height:var(--ds-size-600, 3rem);width:var(--ds-size-500, 2.5rem)}.auro-button--iconOnly ::slotted(auro-icon),.auro-button--iconOnly ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, $ds-size-300)}.auro-button--iconOnly:not(.auro-button--rounded):focus-visible:not([variant=secondary]):not([variant=tertiary]):not([variant=flat]){outline-width:1px;outline-offset:-2px}.auro-button--iconOnlySlim{padding:0 var(--ds-size-50, 0.25rem);height:calc(var(--ds-size-400, 2rem) + var(--ds-size-50, 0.25rem));width:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-50, 0.25rem))}.auro-button--iconOnlySlim ::slotted(auro-icon),.auro-button--iconOnlySlim ::slotted([auro-icon]){--ds-auro-icon-size:calc(var(--ds-size-200, $ds-size-200) + var(--ds-size-50, $ds-size-50))}.auro-button--rounded{border-radius:100px;box-shadow:var(--ds-elevation-300, 0px 0px 15px rgba(0, 0, 0, 0.2));height:var(--ds-size-500, 2.5rem);min-width:unset;transition:all 300ms ease-out,outline 0ms,outline-offset 0ms}.auro-button--rounded ::slotted(auro-icon),.auro-button--rounded ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, $ds-size-300)}.auro-button--rounded:focus-visible:not([variant=flat]):after{border-radius:100px}:host([rounded]) .textSlot{transition:opacity 300ms ease-in;opacity:1}:host([rounded][iconOnly]) .textSlot{opacity:0}:host([rounded][iconOnly]) .textWrapper{display:none}:host([rounded][iconOnly]) .auro-button{min-width:unset;padding:unset;width:var(--ds-size-600, 3rem)}[auro-loader]{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);pointer-events:none}`;
|
|
11229
11073
|
|
|
11230
|
-
|
|
11074
|
+
var colorCss$7 = css`[auro-loader]{color:var(--ds-auro-button-loader-color)}.auro-button{-webkit-tap-highlight-color:var(--ds-auro-button-tap-color);color:var(--ds-auro-button-text-color);background-color:var(--ds-auro-button-container-color);background-image:linear-gradient(var(--ds-auro-button-container-image), var(--ds-auro-button-container-image));border-color:var(--ds-auro-button-border-color)}.auro-button:not([variant=secondary]):not([variant=tertiary]):focus-visible{outline-color:var(--ds-auro-button-border-inset-color)}.auro-button:not([ondark]):active:not(:disabled),.auro-button:not([ondark]):hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-hover, #00274a);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-hover, #00274a);--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-hover, #00274a)}.auro-button:not([ondark]):disabled{--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-disabled, #acc9e2);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-disabled, #acc9e2);--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-disabled, #acc9e2)}.auro-button:not([ondark])[variant=secondary]{--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background, #ffffff);--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background, #ffffff);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border, #01426a);--ds-auro-button-text-color:var(--ds-advanced-color-button-secondary-text, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-secondary-text, #01426a)}.auro-button:not([ondark])[variant=secondary]:active:not(:disabled),.auro-button:not([ondark])[variant=secondary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background-hover, #f2f2f2);--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background-hover, #f2f2f2);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-hover, #00274a);--ds-auro-button-text-color:var(--ds-advanced-color-button-secondary-text-hover, #00274a)}.auro-button:not([ondark])[variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused, #01426a)}.auro-button:not([ondark])[variant=secondary]:disabled{--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background-disabled, #f7f7f7);--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background-disabled, #f7f7f7);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-disabled, #cfe0ef);--ds-auro-button-text-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}.auro-button:not([ondark])[variant=tertiary]{--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background, rgba(0, 0, 0, 0.05));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background, rgba(0, 0, 0, 0.05));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-advanced-color-button-tertiary-text, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-tertiary-text, #01426a)}.auro-button:not([ondark])[variant=tertiary]:active:not(:disabled),.auro-button:not([ondark])[variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background-hover, rgba(0, 0, 0, 0.1));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background-hover, rgba(0, 0, 0, 0.1));--ds-auro-button-border-color:transparent}.auro-button:not([ondark])[variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-advanced-color-state-focused, #01426a);--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused, #01426a)}.auro-button:not([ondark])[variant=tertiary]:disabled{--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}.auro-button:not([ondark])[variant=flat]{color:var(--ds-advanced-color-button-flat-text, #676767);background-color:transparent;background-image:none;border-color:transparent}.auro-button:not([ondark])[variant=flat]:active:not(:disabled),.auro-button:not([ondark])[variant=flat]:hover:not(:disabled){color:var(--ds-advanced-color-button-flat-text-hover, #525252);background-color:transparent;background-image:none;border-color:transparent}.auro-button:not([ondark])[variant=flat]:disabled{color:var(--ds-advanced-color-button-flat-text-disabled, #d0d0d0);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark]{--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-inverse, #ffffff);--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-inverse, #ffffff);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-inverse, #ffffff);--ds-auro-button-text-color:var(--ds-advanced-color-button-primary-text-inverse, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-primary-text-inverse, #01426a)}.auro-button[ondark]:active:not(:disabled),.auro-button[ondark]:hover:not(:disabled){--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-inverse-hover, #ebf3f9);--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-inverse-hover, #ebf3f9);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-inverse-hover, #ebf3f9)}.auro-button[ondark]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused, #01426a)}.auro-button[ondark]:disabled{--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-text-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}.auro-button[ondark][variant=secondary]{--ds-auro-button-container-color:transparent;--ds-auro-button-container-image:transparent;--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-inverse, #ffffff);--ds-auro-button-text-color:var(--ds-advanced-color-button-secondary-text-inverse, #ffffff);--ds-auro-button-loader-color:var(--ds-advanced-color-button-secondary-text-inverse, #ffffff)}.auro-button[ondark][variant=secondary]:active:not(:disabled),.auro-button[ondark][variant=secondary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background-inverse-hover, rgba(255, 255, 255, 0.1));--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background-inverse-hover, rgba(255, 255, 255, 0.1))}.auro-button[ondark][variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused-inverse, #ffffff)}.auro-button[ondark][variant=secondary]:disabled{--ds-auro-button-text-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-inverse-disabled, #dddddd)}.auro-button[ondark][variant=tertiary]{--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background-inverse, rgba(255, 255, 255, 0.05));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background-inverse, rgba(255, 255, 255, 0.05));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-advanced-color-button-tertiary-text-inverse, #ffffff);--ds-auro-button-loader-color:var(--ds-advanced-color-button-tertiary-text-inverse, #ffffff)}.auro-button[ondark][variant=tertiary]:active:not(:disabled),.auro-button[ondark][variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background-inverse-hover, rgba(255, 255, 255, 0.1));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background-inverse-hover, rgba(255, 255, 255, 0.1))}.auro-button[ondark][variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused-inverse, #ffffff)}.auro-button[ondark][variant=tertiary]:disabled{--ds-auro-button-text-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}.auro-button[ondark][variant=flat]{color:var(--ds-advanced-color-button-flat-text-inverse, #ffffff);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark][variant=flat]:active:not(:disabled),.auro-button[ondark][variant=flat]:hover:not(:disabled){color:var(--ds-advanced-color-button-flat-text-inverse-hover, #adadad);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark][variant=flat]:disabled{color:var(--ds-advanced-color-button-flat-text-inverse-disabled, #7e8894);background-color:transparent;background-image:none;border-color:transparent}`;
|
|
11231
11075
|
|
|
11232
|
-
|
|
11233
|
-
* Generates a unique string to be used for child auro element naming.
|
|
11234
|
-
* @private
|
|
11235
|
-
* @param {string} baseName - Defines the first part of the unique element name.
|
|
11236
|
-
* @param {string} version - Version of the component that will be appended to the baseName.
|
|
11237
|
-
* @returns {string} - Unique string to be used for naming.
|
|
11238
|
-
*/
|
|
11239
|
-
generateElementName(baseName, version) {
|
|
11240
|
-
let result = baseName;
|
|
11076
|
+
var tokensCss$7 = css`:host{--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border, #01426a);--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background, #01426a);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-primary-text, #ffffff);--ds-auro-button-text-color:var(--ds-advanced-color-button-primary-text, #ffffff);--ds-auro-button-tap-color:transparent}`;
|
|
11241
11077
|
|
|
11242
|
-
|
|
11243
|
-
result += version.replace(/[.]/g, '_');
|
|
11078
|
+
var styleCss$6 = css`:focus:not(:focus-visible){outline:3px solid transparent}:host,:host>span{position:relative}:host{width:2rem;height:2rem;display:inline-block;font-size:0}:host>span{position:absolute;display:inline-block;float:none;top:0;left:0;width:2rem;height:2rem;border-radius:100%;border-style:solid;border-width:0}:host([xs]),:host([xs])>span{width:1.2rem;height:1.2rem}:host([sm]),:host([sm])>span{width:3rem;height:3rem}:host([md]),:host([md])>span{width:5rem;height:5rem}:host([lg]),:host([lg])>span{width:8rem;height:8rem}:host{--margin:0.375rem;--margin-xs:0.2rem;--margin-sm:0.5rem;--margin-md:0.75rem;--margin-lg:1rem}:host([pulse]),:host([pulse])>span{position:relative}:host([pulse]){width:calc(3rem + var(--margin)*6);height:1.5rem}:host([pulse])>span{width:1rem;height:1rem;margin:var(--margin);animation:pulse 1.5s ease infinite}:host([pulse][xs]){width:calc(2.55rem + var(--margin-xs)*6);height:1.55rem}:host([pulse][xs])>span{margin:var(--margin-xs);width:.65rem;height:.65rem}:host([pulse][sm]){width:calc(6rem + var(--margin-sm)*6);height:2.5rem}:host([pulse][sm])>span{margin:var(--margin-sm);width:2rem;height:2rem}:host([pulse][md]){width:calc(9rem + var(--margin-md)*6);height:3.5rem}:host([pulse][md])>span{margin:var(--margin-md);width:3rem;height:3rem}:host([pulse][lg]){width:calc(15rem + var(--margin-lg)*6);height:5.5rem}:host([pulse][lg])>span{margin:var(--margin-lg);width:5rem;height:5rem}:host([pulse])>span:nth-child(1){animation-delay:-400ms}:host([pulse])>span:nth-child(2){animation-delay:-200ms}:host([pulse])>span:nth-child(3){animation-delay:0ms}@keyframes pulse{0%,100%{opacity:.1;transform:scale(0.9)}50%{opacity:1;transform:scale(1.1)}}:host([orbit]),:host([orbit])>span{opacity:1}:host([orbit])>span{border-width:5px}:host([orbit])>span:nth-child(2){animation:orbit 2s linear infinite}:host([orbit][sm])>span{border-width:8px}:host([orbit][md])>span{border-width:13px}:host([orbit][lg])>span{border-width:21px}@keyframes orbit{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}:host([ringworm])>svg{animation:rotate 2s linear infinite;height:100%;width:100%;stroke:currentcolor;stroke-width:8}:host([ringworm]) .path{stroke-dashoffset:0;animation:ringworm 1.5s ease-in-out infinite;stroke-linecap:round}@keyframes rotate{100%{transform:rotate(360deg)}}@keyframes ringworm{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}100%{stroke-dasharray:89,200;stroke-dashoffset:-124px}}:host([laser]){position:static;width:100%;display:block;height:0;overflow:hidden;font-size:unset}:host([laser])>span{position:fixed;width:100%;height:.25rem;border-radius:0;z-index:100}:host([laser])>span:nth-child(1){border-color:currentcolor;opacity:.25}:host([laser])>span:nth-child(2){border-color:currentcolor;animation:laser 2s linear infinite;opacity:1;width:50%}:host([laser][sm])>span:nth-child(2){width:20%}:host([laser][md])>span:nth-child(2){width:30%}:host([laser][lg])>span:nth-child(2){width:50%;animation-duration:1.5s}:host([laser][xl])>span:nth-child(2){width:80%;animation-duration:1.5s}@keyframes laser{0%{left:-100%}100%{left:110%}}:host>.no-animation{display:none}@media(prefers-reduced-motion: reduce){:host{display:flex;align-items:center;justify-content:center;font-size:1rem}:host>span{opacity:1}:host>.loader{display:none}:host>.no-animation{display:block}}`;
|
|
11244
11079
|
|
|
11245
|
-
|
|
11246
|
-
}
|
|
11080
|
+
var colorCss$6 = css`:host{color:var(--ds-auro-loader-color)}:host>span{background-color:var(--ds-auro-loader-background-color);border-color:var(--ds-auro-loader-border-color)}:host([onlight]){--ds-auro-loader-color:var(--ds-basic-color-brand-primary, #01426a)}:host([ondark]){--ds-auro-loader-color:var(--ds-basic-color-texticon-inverse, #ffffff)}:host([orbit])>span{--ds-auro-loader-background-color:transparent}:host([orbit])>span:nth-child(1){--ds-auro-loader-border-color:currentcolor;opacity:.25}:host([orbit])>span:nth-child(2){--ds-auro-loader-border-color:currentcolor;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent}`;
|
|
11247
11081
|
|
|
11248
|
-
|
|
11249
|
-
* Generates a unique string to be used for child auro element naming.
|
|
11250
|
-
* @param {string} baseName - Defines the first part of the unique element name.
|
|
11251
|
-
* @param {string} version - Version of the component that will be appended to the baseName.
|
|
11252
|
-
* @returns {string} - Unique string to be used for naming.
|
|
11253
|
-
*/
|
|
11254
|
-
generateTag(baseName, version, tagClass) {
|
|
11255
|
-
const elementName = this.generateElementName(baseName, version);
|
|
11256
|
-
const tag = literal`${unsafeStatic(elementName)}`;
|
|
11082
|
+
var tokensCss$6 = css`:host{--ds-auro-loader-background-color:currentcolor;--ds-auro-loader-border-color:currentcolor;--ds-auro-loader-color:currentcolor}`;
|
|
11257
11083
|
|
|
11258
|
-
|
|
11259
|
-
|
|
11260
|
-
}
|
|
11084
|
+
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
11085
|
+
// See LICENSE in the project root for license information.
|
|
11261
11086
|
|
|
11262
|
-
return tag;
|
|
11263
|
-
}
|
|
11264
|
-
};
|
|
11265
11087
|
|
|
11266
|
-
|
|
11267
|
-
|
|
11088
|
+
let AuroLoader$1 = class AuroLoader extends LitElement {
|
|
11089
|
+
constructor() {
|
|
11090
|
+
super();
|
|
11268
11091
|
|
|
11269
|
-
|
|
11092
|
+
/**
|
|
11093
|
+
* @private
|
|
11094
|
+
*/
|
|
11095
|
+
this.keys = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
|
|
11270
11096
|
|
|
11271
|
-
|
|
11097
|
+
/**
|
|
11098
|
+
* @private
|
|
11099
|
+
*/
|
|
11100
|
+
this.mdCount = 3;
|
|
11272
11101
|
|
|
11273
|
-
|
|
11102
|
+
/**
|
|
11103
|
+
* @private
|
|
11104
|
+
*/
|
|
11105
|
+
this.smCount = 2;
|
|
11274
11106
|
|
|
11275
|
-
|
|
11107
|
+
/**
|
|
11108
|
+
* @private
|
|
11109
|
+
*/
|
|
11110
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$4();
|
|
11276
11111
|
|
|
11277
|
-
|
|
11278
|
-
|
|
11279
|
-
|
|
11280
|
-
|
|
11281
|
-
* @returns {void}
|
|
11282
|
-
*/
|
|
11283
|
-
registerComponent(name, componentClass) {
|
|
11284
|
-
if (!customElements.get(name)) {
|
|
11285
|
-
customElements.define(name, class extends componentClass {});
|
|
11286
|
-
}
|
|
11112
|
+
this.orbit = false;
|
|
11113
|
+
this.ringworm = false;
|
|
11114
|
+
this.laser = false;
|
|
11115
|
+
this.pulse = false;
|
|
11287
11116
|
}
|
|
11288
11117
|
|
|
11289
|
-
|
|
11290
|
-
|
|
11291
|
-
|
|
11292
|
-
*/
|
|
11293
|
-
closestElement(
|
|
11294
|
-
selector, // selector like in .closest()
|
|
11295
|
-
base = this, // extra functionality to skip a parent
|
|
11296
|
-
__Closest = (el, found = el && el.closest(selector)) =>
|
|
11297
|
-
!el || el === document || el === window
|
|
11298
|
-
? null // standard .closest() returns null for non-found selectors also
|
|
11299
|
-
: found
|
|
11300
|
-
? found // found a selector INside this element
|
|
11301
|
-
: __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
|
|
11302
|
-
) {
|
|
11303
|
-
return __Closest(base);
|
|
11304
|
-
}
|
|
11305
|
-
/* eslint-enable jsdoc/require-param */
|
|
11118
|
+
// function to define props used within the scope of this component
|
|
11119
|
+
static get properties() {
|
|
11120
|
+
return {
|
|
11306
11121
|
|
|
11307
|
-
|
|
11308
|
-
|
|
11309
|
-
|
|
11310
|
-
|
|
11311
|
-
* @returns {void}
|
|
11312
|
-
*/
|
|
11313
|
-
handleComponentTagRename(elem, tagName) {
|
|
11314
|
-
const tag = tagName.toLowerCase();
|
|
11315
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
11316
|
-
|
|
11317
|
-
if (elemTag !== tag) {
|
|
11318
|
-
elem.setAttribute(tag, true);
|
|
11319
|
-
}
|
|
11320
|
-
}
|
|
11321
|
-
|
|
11322
|
-
/**
|
|
11323
|
-
* Validates if an element is a specific Auro component.
|
|
11324
|
-
* @param {Object} elem - The element to validate.
|
|
11325
|
-
* @param {String} tagName - The name of the Auro component to check against.
|
|
11326
|
-
* @returns {Boolean} - Returns true if the element is the specified Auro component.
|
|
11327
|
-
*/
|
|
11328
|
-
elementMatch(elem, tagName) {
|
|
11329
|
-
const tag = tagName.toLowerCase();
|
|
11330
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
11331
|
-
|
|
11332
|
-
return elemTag === tag || elem.hasAttribute(tag);
|
|
11333
|
-
}
|
|
11334
|
-
};
|
|
11335
|
-
|
|
11336
|
-
var styleCss$7 = css`:focus:not(:focus-visible){outline:3px solid transparent}.util_insetNone{padding:0}.util_insetXxxs{padding:.125rem}.util_insetXxxs--stretch{padding:.25rem .125rem}.util_insetXxxs--squish{padding:0 .125rem}.util_insetXxs{padding:.25rem}.util_insetXxs--stretch{padding:.375rem .25rem}.util_insetXxs--squish{padding:.125rem .25rem}.util_insetXs{padding:.5rem}.util_insetXs--stretch{padding:.75rem .5rem}.util_insetXs--squish{padding:.25rem .5rem}.util_insetSm{padding:.75rem}.util_insetSm--stretch{padding:1.125rem .75rem}.util_insetSm--squish{padding:.375rem .75rem}.util_insetMd{padding:1rem}.util_insetMd--stretch{padding:1.5rem 1rem}.util_insetMd--squish{padding:.5rem 1rem}.util_insetLg{padding:1.5rem}.util_insetLg--stretch{padding:2.25rem 1.5rem}.util_insetLg--squish{padding:.75rem 1.5rem}.util_insetXl{padding:2rem}.util_insetXl--stretch{padding:3rem 2rem}.util_insetXl--squish{padding:1rem 2rem}.util_insetXxl{padding:3rem}.util_insetXxl--stretch{padding:4.5rem 3rem}.util_insetXxl--squish{padding:1.5rem 3rem}.util_insetXxxl{padding:4rem}.util_insetXxxl--stretch{padding:6rem 4rem}.util_insetXxxl--squish{padding:2rem 4rem}:host([fluid]) .auro-button,:host([fluid=true]) .auro-button{min-width:auto;width:100%}:host([variant=flat]){display:inline-block;height:var(--ds-size-300, 1.5rem);width:var(--ds-size-300, 1.5rem)}:host([variant=flat]) .auro-button{height:100%;width:100%}::slotted(svg){vertical-align:middle}slot{pointer-events:none}.auro-button{position:relative;padding:0 var(--ds-size-300, 1.5rem);cursor:pointer;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem);font-family:var(--ds-font-family-default, "AS Circular", Helvetica Neue, Arial, sans-serif);font-size:var(--ds-text-body-size-default, 1rem);font-weight:var(--ds-text-body-default-weight, 500);overflow:hidden;text-overflow:ellipsis;user-select:none;white-space:nowrap;min-height:var(--ds-size-600, 3rem);max-height:var(--ds-size-600, 3rem);display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--ds-size-100, 0.5rem);margin:0;-webkit-touch-callout:none;-webkit-user-select:none}.auro-button:active{transform:scale(0.95)}.auro-button:focus-visible:not([variant=secondary]):not([variant=tertiary]):not([variant=flat]):after{display:block;content:"";height:calc(100% - 2px);width:calc(100% - 2px);position:absolute;top:1px;left:1px;border-radius:4px;border-style:solid;border-width:2px}.auro-button:focus-visible[variant=secondary]:after,.auro-button:focus-visible[variant=tertiary]:after{display:block;content:"";height:100%;width:100%;position:absolute;top:0;left:0;border-radius:var(--ds-border-radius, 0.375rem);border-style:solid;border-width:2px}.auro-button.loading{cursor:not-allowed}.auro-button.loading *:not([auro-loader]){visibility:hidden}@media screen and (min-width: 576px){.auro-button{min-width:8.75rem;width:auto}}.auro-button:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=secondary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=flat]{height:unset;width:unset;min-height:unset;max-height:unset;min-width:unset;max-width:unset;border:0;border-radius:unset;gap:unset;padding:unset}.auro-button[onDark]:disabled{cursor:not-allowed;transform:unset}.auro-button[onDark][variant=secondary]:disabled{cursor:not-allowed;transform:unset}@media(hover: hover){.auro-button[onDark][variant=tertiary]:active,.auro-button[onDark][variant=tertiary]:hover{box-shadow:none}}.auro-button[onDark][variant=tertiary]:active{box-shadow:none}.auro-button[onDark][variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button--slim{padding:var(--ds-size-100, 0.5rem) var(--ds-size-200, 1rem);font-size:var(--ds-text-body-size-sm, 0.875rem);min-width:unset;min-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem));max-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem))}.auro-button--iconOnly{padding:0 var(--ds-size-100, 0.5rem);border-radius:100px;min-width:unset;height:var(--ds-size-600, 3rem);width:var(--ds-size-500, 2.5rem)}.auro-button--iconOnly ::slotted(auro-icon),.auro-button--iconOnly ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, $ds-size-300)}.auro-button--iconOnlySlim{padding:0 var(--ds-size-50, 0.25rem);height:calc(var(--ds-size-400, 2rem) + var(--ds-size-50, 0.25rem));width:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-50, 0.25rem))}.auro-button--iconOnlySlim ::slotted(auro-icon),.auro-button--iconOnlySlim ::slotted([auro-icon]){--ds-auro-icon-size:calc(var(--ds-size-200, $ds-size-200) + var(--ds-size-50, $ds-size-50))}.auro-button--rounded{border-radius:100px;box-shadow:var(--ds-elevation-300, 0px 0px 15px rgba(0, 0, 0, 0.2));height:var(--ds-size-500, 2.5rem);min-width:unset;transition:all 300ms ease-out}.auro-button--rounded ::slotted(auro-icon),.auro-button--rounded ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, $ds-size-300)}:host([rounded]) .textSlot{transition:opacity 300ms ease-in;opacity:1}:host([rounded][iconOnly]) .textSlot{opacity:0}:host([rounded][iconOnly]) .textWrapper{display:none}:host([rounded][iconOnly]) .auro-button{min-width:unset;padding:unset;width:var(--ds-size-600, 3rem)}[auro-loader]{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);pointer-events:none}`;
|
|
11337
|
-
|
|
11338
|
-
var colorCss$7 = css`[auro-loader]{color:var(--ds-auro-button-loader-color)}.auro-button{-webkit-tap-highlight-color:var(--ds-auro-button-tap-color);color:var(--ds-auro-button-text-color);background-color:var(--ds-auro-button-container-color);background-image:linear-gradient(var(--ds-auro-button-container-image), var(--ds-auro-button-container-image));border-color:var(--ds-auro-button-border-color)}.auro-button:not([variant=secondary]):not([variant=tertiary]):focus-visible:after{border-color:var(--ds-auro-button-border-inset-color)}.auro-button:not([ondark]):active{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-active-default, #225296);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-active-default, #225296);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-active-default, #225296)}.auro-button:not([ondark])[disabled]{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-disabled-default, #a0c9f1);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-disabled-default, #a0c9f1);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-disabled-default, #a0c9f1)}@media(hover: hover){.auro-button:not([ondark]):active:not(:disabled),.auro-button:not([ondark]):hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-primary-hover-default, #193d73);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-hover-default, #193d73);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-hover-default, #193d73)}}.auro-button:not([ondark])[variant=secondary]{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-default-default, #ffffff);--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-default-default, #ffffff);--ds-auro-button-border-color:var(--ds-color-border-ui-default-default, #2c67b5);--ds-auro-button-text-color:var(--ds-color-text-ui-default-default, #2c67b5)}@media(hover: hover){.auro-button:not([ondark])[variant=secondary]:active:not(:disabled),.auro-button:not([ondark])[variant=secondary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-hover-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-hover-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color:var(--ds-color-border-ui-hover-default, #193d73);--ds-auro-button-text-color:var(--ds-color-text-ui-hover-default, #193d73)}}.auro-button:not([ondark])[variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-color-border-ui-focus-default, #2c67b5)}.auro-button:not([ondark])[variant=secondary]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-active-default, #f0f7fd);--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-active-default, #f0f7fd);--ds-auro-button-border-color:var(--ds-color-border-ui-active-default, #225296);--ds-auro-button-text-color:var(--ds-color-text-ui-active-default, #225296)}.auro-button:not([ondark])[variant=secondary]:disabled{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-disabled-default, #f7f7f7);--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-disabled-default, #f7f7f7);--ds-auro-button-border-color:var(--ds-color-border-ui-disabled-default, #adadad);--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-default, #adadad)}.auro-button:not([ondark])[variant=tertiary]{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-default-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-default-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-default-default, #2c67b5)}@media(hover: hover){.auro-button:not([ondark])[variant=tertiary]:active:not(:disabled),.auro-button:not([ondark])[variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-hover-default, rgba(0, 0, 0, 0.12));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-hover-default, rgba(0, 0, 0, 0.12));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-hover-default, #193d73)}}.auro-button:not([ondark])[variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-color-border-ui-default-default, #2c67b5);--ds-auro-button-border-inset-color:var(--ds-color-border-ui-default-default, #2c67b5)}.auro-button:not([ondark])[variant=tertiary]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-active-default, rgba(0, 0, 0, 0.06));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-active-default, rgba(0, 0, 0, 0.06));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-active-default, #225296)}.auro-button:not([ondark])[variant=tertiary]:disabled{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-disabled-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-disabled-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-default, #adadad)}.auro-button:not([ondark])[variant=flat]{color:var(--ds-color-icon-ui-secondary-default-default);background-color:transparent;background-image:none;border-color:transparent}@media(hover: hover){.auro-button:not([ondark])[variant=flat]:active:not(:disabled),.auro-button:not([ondark])[variant=flat]:hover:not(:disabled){color:var(--ds-color-icon-ui-secondary-hover-default);background-color:transparent;background-image:none;border-color:transparent}}.auro-button:not([ondark])[variant=flat]:disabled{color:var(--ds-color-icon-ui-secondary-disabled-default);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark]{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-default-inverse, #56bbde);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-default-inverse, #56bbde);--ds-auro-button-text-color:var(--ds-color-text-primary-default, #2a2a2a);--ds-auro-button-loader-color:var(--ds-color-text-primary-inverse, #ffffff);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark]:active:not(:disabled),.auro-button[ondark]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7)}}.auro-button[ondark]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-active-inverse, #6ad5ef);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-active-inverse, #6ad5ef);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-active-inverse, #6ad5ef)}.auro-button[ondark][disabled]{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-disabled-inverse, #275b72);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-disabled-inverse, #275b72);--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-inverse, #7e7e7e);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-disabled-inverse, #275b72)}.auro-button[ondark][variant=secondary]{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-default-inverse, rgba(255, 255, 255, 0.03));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-default-inverse, rgba(255, 255, 255, 0.03));--ds-auro-button-border-color:var(--ds-color-border-ui-default-inverse, #56bbde);--ds-auro-button-text-color:var(--ds-color-text-ui-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark][variant=secondary]:hover{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-hover-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-hover-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color:var(--ds-color-border-ui-hover-inverse, #a8e9f7);--ds-auro-button-text-color:var(--ds-color-text-ui-hover-inverse, #a8e9f7)}}.auro-button[ondark][variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-color-border-ui-focus-inverse, #56bbde)}.auro-button[ondark][variant=secondary]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-border-color:var(--ds-color-border-ui-active-inverse, #6ad5ef);--ds-auro-button-text-color:var(--ds-color-text-ui-active-inverse, #6ad5ef)}.auro-button[ondark][variant=secondary]:disabled{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-disabled-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-disabled-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color:var(--ds-color-border-ui-disabled-inverse, #7e7e7e);--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-inverse, #7e7e7e)}.auro-button[ondark][variant=tertiary]{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-default-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-default-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark][variant=tertiary]:active:not(:disabled),.auro-button[ondark][variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-hover-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-hover-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-hover-inverse, #a8e9f7)}}.auro-button[ondark][variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-color-border-ui-default-inverse, #56bbde);--ds-auro-button-border-inset-color:var(--ds-color-border-ui-default-inverse, #56bbde)}.auro-button[ondark][variant=tertiary]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-active-inverse, #6ad5ef)}.auro-button[ondark][variant=tertiary]:disabled{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-disabled-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-disabled-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-inverse, #7e7e7e)}.auro-button[ondark][variant=flat]{color:var(--ds-color-icon-ui-secondary-default-inverse);background-color:transparent;background-image:none;border-color:transparent}@media(hover: hover){.auro-button[ondark][variant=flat]:active:not(:disabled),.auro-button[ondark][variant=flat]:hover:not(:disabled){color:var(--ds-color-icon-ui-secondary-hover-inverse);background-color:transparent;background-image:none;border-color:transparent}}.auro-button[ondark][variant=flat]:disabled{color:var(--ds-color-icon-ui-disabled-default);background-color:transparent;background-image:none;border-color:transparent}`;
|
|
11339
|
-
|
|
11340
|
-
var tokensCss$7 = css`:host{--ds-auro-button-border-color:var(--ds-color-container-ui-primary-default-default, #2c67b5);--ds-auro-button-border-inset-color:var(--ds-color-border-emphasis-inverse, #f2f7fb);--ds-auro-button-container-color:var(--ds-color-container-ui-primary-default-default, #2c67b5);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-default-default, #2c67b5);--ds-auro-button-loader-color:var(--ds-color-utility-navy-default, #265688);--ds-auro-button-text-color:var(--ds-color-text-primary-inverse, #ffffff);--ds-auro-button-tap-color:transparent}`;
|
|
11341
|
-
|
|
11342
|
-
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
11343
|
-
// See LICENSE in the project root for license information.
|
|
11344
|
-
|
|
11345
|
-
// ---------------------------------------------------------------------
|
|
11346
|
-
|
|
11347
|
-
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
11348
|
-
|
|
11349
|
-
let AuroLibraryRuntimeUtils$6 = class AuroLibraryRuntimeUtils {
|
|
11350
|
-
|
|
11351
|
-
/* eslint-disable jsdoc/require-param */
|
|
11352
|
-
|
|
11353
|
-
/**
|
|
11354
|
-
* This will register a new custom element with the browser.
|
|
11355
|
-
* @param {String} name - The name of the custom element.
|
|
11356
|
-
* @param {Object} componentClass - The class to register as a custom element.
|
|
11357
|
-
* @returns {void}
|
|
11358
|
-
*/
|
|
11359
|
-
registerComponent(name, componentClass) {
|
|
11360
|
-
if (!customElements.get(name)) {
|
|
11361
|
-
customElements.define(name, class extends componentClass {});
|
|
11362
|
-
}
|
|
11363
|
-
}
|
|
11364
|
-
|
|
11365
|
-
/**
|
|
11366
|
-
* Finds and returns the closest HTML Element based on a selector.
|
|
11367
|
-
* @returns {void}
|
|
11368
|
-
*/
|
|
11369
|
-
closestElement(
|
|
11370
|
-
selector, // selector like in .closest()
|
|
11371
|
-
base = this, // extra functionality to skip a parent
|
|
11372
|
-
__Closest = (el, found = el && el.closest(selector)) =>
|
|
11373
|
-
!el || el === document || el === window
|
|
11374
|
-
? null // standard .closest() returns null for non-found selectors also
|
|
11375
|
-
: found
|
|
11376
|
-
? found // found a selector INside this element
|
|
11377
|
-
: __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
|
|
11378
|
-
) {
|
|
11379
|
-
return __Closest(base);
|
|
11380
|
-
}
|
|
11381
|
-
/* eslint-enable jsdoc/require-param */
|
|
11382
|
-
|
|
11383
|
-
/**
|
|
11384
|
-
* 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.
|
|
11385
|
-
* @param {Object} elem - The element to check.
|
|
11386
|
-
* @param {String} tagName - The name of the Auro component to check for or add as an attribute.
|
|
11387
|
-
* @returns {void}
|
|
11388
|
-
*/
|
|
11389
|
-
handleComponentTagRename(elem, tagName) {
|
|
11390
|
-
const tag = tagName.toLowerCase();
|
|
11391
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
11392
|
-
|
|
11393
|
-
if (elemTag !== tag) {
|
|
11394
|
-
elem.setAttribute(tag, true);
|
|
11395
|
-
}
|
|
11396
|
-
}
|
|
11397
|
-
|
|
11398
|
-
/**
|
|
11399
|
-
* Validates if an element is a specific Auro component.
|
|
11400
|
-
* @param {Object} elem - The element to validate.
|
|
11401
|
-
* @param {String} tagName - The name of the Auro component to check against.
|
|
11402
|
-
* @returns {Boolean} - Returns true if the element is the specified Auro component.
|
|
11403
|
-
*/
|
|
11404
|
-
elementMatch(elem, tagName) {
|
|
11405
|
-
const tag = tagName.toLowerCase();
|
|
11406
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
11407
|
-
|
|
11408
|
-
return elemTag === tag || elem.hasAttribute(tag);
|
|
11409
|
-
}
|
|
11410
|
-
};
|
|
11411
|
-
|
|
11412
|
-
var styleCss$6 = css`:focus:not(:focus-visible){outline:3px solid transparent}:host,:host>span{position:relative}:host{width:2rem;height:2rem;display:inline-block;font-size:0}:host>span{position:absolute;display:inline-block;float:none;top:0;left:0;width:2rem;height:2rem;border-radius:100%;border-style:solid;border-width:0}:host([xs]),:host([xs])>span{width:1.2rem;height:1.2rem}:host([sm]),:host([sm])>span{width:3rem;height:3rem}:host([md]),:host([md])>span{width:5rem;height:5rem}:host([lg]),:host([lg])>span{width:8rem;height:8rem}:host{--margin:0.375rem;--margin-xs:0.2rem;--margin-sm:0.5rem;--margin-md:0.75rem;--margin-lg:1rem}:host([pulse]),:host([pulse])>span{position:relative}:host([pulse]){width:calc(3rem + var(--margin)*6);height:1.5rem}:host([pulse])>span{width:1rem;height:1rem;margin:var(--margin);animation:pulse 1.5s ease infinite}:host([pulse][xs]){width:calc(2.55rem + var(--margin-xs)*6);height:1.55rem}:host([pulse][xs])>span{margin:var(--margin-xs);width:.65rem;height:.65rem}:host([pulse][sm]){width:calc(6rem + var(--margin-sm)*6);height:2.5rem}:host([pulse][sm])>span{margin:var(--margin-sm);width:2rem;height:2rem}:host([pulse][md]){width:calc(9rem + var(--margin-md)*6);height:3.5rem}:host([pulse][md])>span{margin:var(--margin-md);width:3rem;height:3rem}:host([pulse][lg]){width:calc(15rem + var(--margin-lg)*6);height:5.5rem}:host([pulse][lg])>span{margin:var(--margin-lg);width:5rem;height:5rem}:host([pulse])>span:nth-child(1){animation-delay:-400ms}:host([pulse])>span:nth-child(2){animation-delay:-200ms}:host([pulse])>span:nth-child(3){animation-delay:0ms}@keyframes pulse{0%,100%{opacity:.1;transform:scale(0.9)}50%{opacity:1;transform:scale(1.1)}}:host([orbit]),:host([orbit])>span{opacity:1}:host([orbit])>span{border-width:5px}:host([orbit])>span:nth-child(2){animation:orbit 2s linear infinite}:host([orbit][sm])>span{border-width:8px}:host([orbit][md])>span{border-width:13px}:host([orbit][lg])>span{border-width:21px}@keyframes orbit{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}:host([ringworm])>svg{animation:rotate 2s linear infinite;height:100%;width:100%;stroke:currentcolor;stroke-width:8}:host([ringworm]) .path{stroke-dashoffset:0;animation:ringworm 1.5s ease-in-out infinite;stroke-linecap:round}@keyframes rotate{100%{transform:rotate(360deg)}}@keyframes ringworm{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}100%{stroke-dasharray:89,200;stroke-dashoffset:-124px}}:host([laser]){position:static;width:100%;display:block;height:0;overflow:hidden;font-size:unset}:host([laser])>span{position:fixed;width:100%;height:.25rem;border-radius:0;z-index:100}:host([laser])>span:nth-child(1){border-color:currentcolor;opacity:.25}:host([laser])>span:nth-child(2){border-color:currentcolor;animation:laser 2s linear infinite;opacity:1;width:50%}:host([laser][sm])>span:nth-child(2){width:20%}:host([laser][md])>span:nth-child(2){width:30%}:host([laser][lg])>span:nth-child(2){width:50%;animation-duration:1.5s}:host([laser][xl])>span:nth-child(2){width:80%;animation-duration:1.5s}@keyframes laser{0%{left:-100%}100%{left:110%}}:host>.no-animation{display:none}@media(prefers-reduced-motion: reduce){:host{display:flex;align-items:center;justify-content:center;font-size:1rem}:host>span{opacity:1}:host>.loader{display:none}:host>.no-animation{display:block}}`;
|
|
11413
|
-
|
|
11414
|
-
var colorCss$6 = css`:host{color:var(--ds-auro-loader-color)}:host>span{background-color:var(--ds-auro-loader-background-color);border-color:var(--ds-auro-loader-border-color)}:host([onlight]){--ds-auro-loader-color:var(--ds-color-utility-navy-default, #265688)}:host([ondark]){--ds-auro-loader-color:var(--ds-color-utility-cyan-inverse, #a8e9f7)}:host([white]){--ds-auro-loader-color:var(--ds-color-utility-neutral-inverse, #ccd2db)}:host([orbit])>span{--ds-auro-loader-background-color:transparent}:host([orbit])>span:nth-child(1){--ds-auro-loader-border-color:currentcolor;opacity:.25}:host([orbit])>span:nth-child(2){--ds-auro-loader-border-color:currentcolor;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent}`;
|
|
11415
|
-
|
|
11416
|
-
var tokensCss$6 = css`:host{--ds-auro-loader-background-color:currentcolor;--ds-auro-loader-border-color:currentcolor;--ds-auro-loader-color:currentcolor}`;
|
|
11417
|
-
|
|
11418
|
-
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
11419
|
-
// See LICENSE in the project root for license information.
|
|
11420
|
-
|
|
11421
|
-
|
|
11422
|
-
// See https://git.io/JJ6SJ for "How to document your components using JSDoc"
|
|
11423
|
-
/**
|
|
11424
|
-
* The auro-loader element is an easy to use animated loader component.
|
|
11425
|
-
*
|
|
11426
|
-
* @attr {Boolean} pulse - sets loader type
|
|
11427
|
-
* @attr {Boolean} ringworm - sets loader type
|
|
11428
|
-
* @attr {Boolean} laser - sets loader type
|
|
11429
|
-
* @attr {Boolean} orbit - sets loader type
|
|
11430
|
-
* @attr {Boolean} white - sets color of loader to white
|
|
11431
|
-
* @attr {Boolean} ondark - sets color of loader to auro-color-ui-default-on-dark
|
|
11432
|
-
* @attr {Boolean} onlight - sets color of loader to auro-color-ui-default-on-light
|
|
11433
|
-
* @attr {Boolean} xs - sets size to extra small
|
|
11434
|
-
* @attr {Boolean} sm - sets size to small
|
|
11435
|
-
* @attr {Boolean} md - sets size to medium
|
|
11436
|
-
* @attr {Boolean} lg - sets size to large
|
|
11437
|
-
* @csspart element - apply style to adjust speed of animation
|
|
11438
|
-
*/
|
|
11439
|
-
|
|
11440
|
-
// build the component class
|
|
11441
|
-
let AuroLoader$1 = class AuroLoader extends LitElement {
|
|
11442
|
-
constructor() {
|
|
11443
|
-
super();
|
|
11444
|
-
|
|
11445
|
-
/**
|
|
11446
|
-
* @private
|
|
11447
|
-
*/
|
|
11448
|
-
this.keys = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
|
|
11449
|
-
|
|
11450
|
-
/**
|
|
11451
|
-
* @private
|
|
11452
|
-
*/
|
|
11453
|
-
this.mdCount = 3;
|
|
11454
|
-
|
|
11455
|
-
/**
|
|
11456
|
-
* @private
|
|
11457
|
-
*/
|
|
11458
|
-
this.smCount = 2;
|
|
11459
|
-
|
|
11460
|
-
/**
|
|
11461
|
-
* @private
|
|
11462
|
-
*/
|
|
11463
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$6();
|
|
11464
|
-
|
|
11465
|
-
this.orbit = false;
|
|
11466
|
-
this.ringworm = false;
|
|
11467
|
-
this.laser = false;
|
|
11468
|
-
this.pulse = false;
|
|
11469
|
-
}
|
|
11470
|
-
|
|
11471
|
-
// function to define props used within the scope of this component
|
|
11472
|
-
static get properties() {
|
|
11473
|
-
return {
|
|
11474
|
-
pulse: {
|
|
11122
|
+
/**
|
|
11123
|
+
* Sets loader to laser type.
|
|
11124
|
+
*/
|
|
11125
|
+
laser: {
|
|
11475
11126
|
type: Boolean,
|
|
11476
11127
|
reflect: true
|
|
11477
11128
|
},
|
|
11129
|
+
|
|
11130
|
+
/**
|
|
11131
|
+
* Sets loader to orbit type.
|
|
11132
|
+
*/
|
|
11478
11133
|
orbit: {
|
|
11479
11134
|
type: Boolean,
|
|
11480
11135
|
reflect: true
|
|
11481
11136
|
},
|
|
11482
|
-
|
|
11137
|
+
|
|
11138
|
+
/**
|
|
11139
|
+
* Sets loader to pulse type.
|
|
11140
|
+
*/
|
|
11141
|
+
pulse: {
|
|
11483
11142
|
type: Boolean,
|
|
11484
11143
|
reflect: true
|
|
11485
11144
|
},
|
|
11486
|
-
|
|
11145
|
+
|
|
11146
|
+
/**
|
|
11147
|
+
* Sets loader to ringworm type.
|
|
11148
|
+
*/
|
|
11149
|
+
ringworm: {
|
|
11487
11150
|
type: Boolean,
|
|
11488
11151
|
reflect: true
|
|
11489
11152
|
}
|
|
@@ -11507,7 +11170,7 @@ let AuroLoader$1 = class AuroLoader extends LitElement {
|
|
|
11507
11170
|
*
|
|
11508
11171
|
*/
|
|
11509
11172
|
static register(name = "auro-loader") {
|
|
11510
|
-
AuroLibraryRuntimeUtils$
|
|
11173
|
+
AuroLibraryRuntimeUtils$4.prototype.registerComponent(name, AuroLoader);
|
|
11511
11174
|
}
|
|
11512
11175
|
|
|
11513
11176
|
firstUpdated() {
|
|
@@ -11557,23 +11220,26 @@ let AuroLoader$1 = class AuroLoader extends LitElement {
|
|
|
11557
11220
|
}
|
|
11558
11221
|
};
|
|
11559
11222
|
|
|
11560
|
-
var loaderVersion$1 = '
|
|
11223
|
+
var loaderVersion$1 = '5.0.0';
|
|
11561
11224
|
|
|
11225
|
+
/* eslint-disable max-lines */
|
|
11562
11226
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
11563
11227
|
// See LICENSE in the project root for license information.
|
|
11564
11228
|
|
|
11565
11229
|
|
|
11566
11230
|
/**
|
|
11567
11231
|
* @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
|
|
11568
|
-
* @attr {Boolean} disabled - If set to true button will become disabled and not allow for interactions
|
|
11232
|
+
* @attr {Boolean} disabled - If set to true, button will become disabled and not allow for interactions
|
|
11569
11233
|
* @attr {Boolean} iconOnly - If set to true, the button will contain an icon with no additional content
|
|
11570
11234
|
* @attr {Boolean} loading - If set to true button text will be replaced with `auro-loader` and become disabled
|
|
11235
|
+
* @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.
|
|
11571
11236
|
* @attr {Boolean} onDark - Set value for on-dark version of auro-button
|
|
11572
11237
|
* @attr {Boolean} rounded - If set to true, the button will have a rounded shape
|
|
11573
11238
|
* @attr {Boolean} slim - Set value for slim version of auro-button
|
|
11574
11239
|
* @attr {Boolean} fluid - Alters the shape of the button to be full width of its parent container
|
|
11575
11240
|
* @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.
|
|
11576
11241
|
* @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.
|
|
11242
|
+
* @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.
|
|
11577
11243
|
* @attr {String} id - Set the unique ID of an element.
|
|
11578
11244
|
* @attr {String} title - Sets title attribute. The information is most often shown as a tooltip text when the mouse moves over the element.
|
|
11579
11245
|
* @attr {String} type - The type of the button. Possible values are: `submit`, `reset`, `button`
|
|
@@ -11618,6 +11284,7 @@ let AuroButton$1 = class AuroButton extends LitElement {
|
|
|
11618
11284
|
this.rounded = false;
|
|
11619
11285
|
this.slim = false;
|
|
11620
11286
|
this.fluid = false;
|
|
11287
|
+
this.loadingText = this.loadingText || 'Loading...';
|
|
11621
11288
|
|
|
11622
11289
|
// Support for HTML5 forms
|
|
11623
11290
|
if (typeof this.attachInternals === 'function') {
|
|
@@ -11678,6 +11345,9 @@ let AuroButton$1 = class AuroButton extends LitElement {
|
|
|
11678
11345
|
type: Boolean,
|
|
11679
11346
|
reflect: true
|
|
11680
11347
|
},
|
|
11348
|
+
loadingText: {
|
|
11349
|
+
type: String
|
|
11350
|
+
},
|
|
11681
11351
|
onDark: {
|
|
11682
11352
|
type: Boolean,
|
|
11683
11353
|
reflect: true
|
|
@@ -11698,6 +11368,10 @@ let AuroButton$1 = class AuroButton extends LitElement {
|
|
|
11698
11368
|
type: String,
|
|
11699
11369
|
reflect: true
|
|
11700
11370
|
},
|
|
11371
|
+
ariaexpanded: {
|
|
11372
|
+
type: Boolean,
|
|
11373
|
+
reflect: true
|
|
11374
|
+
},
|
|
11701
11375
|
title: {
|
|
11702
11376
|
type: String,
|
|
11703
11377
|
reflect: true
|
|
@@ -11727,7 +11401,7 @@ let AuroButton$1 = class AuroButton extends LitElement {
|
|
|
11727
11401
|
*
|
|
11728
11402
|
*/
|
|
11729
11403
|
static register(name = "auro-button") {
|
|
11730
|
-
AuroLibraryRuntimeUtils$
|
|
11404
|
+
AuroLibraryRuntimeUtils$4.prototype.registerComponent(name, AuroButton);
|
|
11731
11405
|
}
|
|
11732
11406
|
|
|
11733
11407
|
/**
|
|
@@ -11769,12 +11443,22 @@ let AuroButton$1 = class AuroButton extends LitElement {
|
|
|
11769
11443
|
this.notifyReady();
|
|
11770
11444
|
}
|
|
11771
11445
|
|
|
11446
|
+
/**
|
|
11447
|
+
* Submits the form that this button is associated with.
|
|
11448
|
+
* @private
|
|
11449
|
+
* @returns {void}
|
|
11450
|
+
*/
|
|
11772
11451
|
surfaceSubmitEvent() {
|
|
11773
11452
|
if (this.form) {
|
|
11774
11453
|
this.form.requestSubmit();
|
|
11775
11454
|
}
|
|
11776
11455
|
}
|
|
11777
11456
|
|
|
11457
|
+
/**
|
|
11458
|
+
* Returns the form element that this button is associated with.
|
|
11459
|
+
* @private
|
|
11460
|
+
* @returns {HTMLFormElement|null}
|
|
11461
|
+
*/
|
|
11778
11462
|
get form() {
|
|
11779
11463
|
return this.internals ? this.internals.form : null;
|
|
11780
11464
|
}
|
|
@@ -11794,8 +11478,9 @@ let AuroButton$1 = class AuroButton extends LitElement {
|
|
|
11794
11478
|
return html$1`
|
|
11795
11479
|
<button
|
|
11796
11480
|
part="button"
|
|
11797
|
-
aria-label="${ifDefined(this.
|
|
11481
|
+
aria-label="${ifDefined(this.loading ? this.loadingText : this.arialabel || undefined)}"
|
|
11798
11482
|
aria-labelledby="${ifDefined(this.arialabelledby ? this.arialabelledby : undefined)}"
|
|
11483
|
+
aria-expanded="${ifDefined(this.ariaexpanded)}"
|
|
11799
11484
|
?autofocus="${this.autofocus}"
|
|
11800
11485
|
class="${classMap(classes)}"
|
|
11801
11486
|
?disabled="${this.disabled || this.loading}"
|
|
@@ -11872,6 +11557,10 @@ class AuroCalendar extends RangeDatepicker {
|
|
|
11872
11557
|
this.showPrevMonthBtn = true;
|
|
11873
11558
|
this.showNextMonthBtn = true;
|
|
11874
11559
|
|
|
11560
|
+
this.visible = false;
|
|
11561
|
+
this.largeFullscreenHeadline = false;
|
|
11562
|
+
this.isFullscreen = false;
|
|
11563
|
+
|
|
11875
11564
|
/**
|
|
11876
11565
|
* @private
|
|
11877
11566
|
*/
|
|
@@ -11887,14 +11576,12 @@ class AuroCalendar extends RangeDatepicker {
|
|
|
11887
11576
|
*/
|
|
11888
11577
|
this.numCalendars = undefined;
|
|
11889
11578
|
|
|
11890
|
-
this.visible = false;
|
|
11891
|
-
|
|
11892
11579
|
/**
|
|
11893
11580
|
* @private
|
|
11894
11581
|
*/
|
|
11895
11582
|
this.slots = {};
|
|
11896
11583
|
|
|
11897
|
-
const versioning = new AuroDependencyVersioning$
|
|
11584
|
+
const versioning = new AuroDependencyVersioning$3();
|
|
11898
11585
|
|
|
11899
11586
|
/**
|
|
11900
11587
|
* @private
|
|
@@ -12186,7 +11873,7 @@ if (!customElements.get('auro-formkit-calendar')) {
|
|
|
12186
11873
|
|
|
12187
11874
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
12188
11875
|
|
|
12189
|
-
let AuroLibraryRuntimeUtils$
|
|
11876
|
+
let AuroLibraryRuntimeUtils$1$1 = class AuroLibraryRuntimeUtils {
|
|
12190
11877
|
|
|
12191
11878
|
/* eslint-disable jsdoc/require-param */
|
|
12192
11879
|
|
|
@@ -14385,7 +14072,7 @@ class AuroFloatingUI {
|
|
|
14385
14072
|
// See LICENSE in the project root for license information.
|
|
14386
14073
|
|
|
14387
14074
|
|
|
14388
|
-
let AuroDependencyVersioning$
|
|
14075
|
+
let AuroDependencyVersioning$1 = class AuroDependencyVersioning {
|
|
14389
14076
|
|
|
14390
14077
|
/**
|
|
14391
14078
|
* Generates a unique string to be used for child auro element naming.
|
|
@@ -14487,7 +14174,7 @@ const cacheFetch$1 = (uri, options = {}) => {
|
|
|
14487
14174
|
return _fetchMap$1.get(uri);
|
|
14488
14175
|
};
|
|
14489
14176
|
|
|
14490
|
-
var styleCss$3$1 = css`:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.ico_squareLarge{fill:currentColor;height:var(--auro-size-lg, var(--ds-size-300, 1.5rem))}.ico_squareSmall{fill:currentColor;height:.6rem}.ico_squareMed{fill:currentColor;height:var(--auro-size-md, var(--ds-size-200, 1rem))}.ico_squareSml{fill:currentColor;height:var(--auro-size-sm, var(--ds-size-150, 0.75rem))}:host{color:currentColor;vertical-align:middle;line-height:1;display:inline-block}
|
|
14177
|
+
var styleCss$3$1 = css`:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.ico_squareLarge{fill:currentColor;height:var(--auro-size-lg, var(--ds-size-300, 1.5rem))}.ico_squareSmall{fill:currentColor;height:.6rem}.ico_squareMed{fill:currentColor;height:var(--auro-size-md, var(--ds-size-200, 1rem))}.ico_squareSml{fill:currentColor;height:var(--auro-size-sm, var(--ds-size-150, 0.75rem))}:host{color:currentColor;vertical-align:middle;line-height:1;display:inline-block}svg{min-width:var(--ds-auro-icon-size, 1.5rem) !important;width:var(--ds-auro-icon-size, 1.5rem) !important;height:var(--ds-auro-icon-size, 1.5rem) !important}.componentWrapper{display:flex}.svgWrapper{height:var(--ds-auro-icon-size);width:var(--ds-auro-icon-size)}.labelWrapper{margin-left:var(--ds-size-50, 0.25rem);line-height:1.8}`;
|
|
14491
14178
|
|
|
14492
14179
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
14493
14180
|
// See LICENSE in the project root for license information.
|
|
@@ -14495,7 +14182,6 @@ var styleCss$3$1 = css`:focus:not(:focus-visible){outline:3px solid transparent}
|
|
|
14495
14182
|
|
|
14496
14183
|
// See https://git.io/JJ6SJ for "How to document your components using JSDoc"
|
|
14497
14184
|
/**
|
|
14498
|
-
* @attr {Boolean} onDark - Set value for on-dark version of auro-icon
|
|
14499
14185
|
* @slot - Hidden from visibility, used for a11y if icon description is needed
|
|
14500
14186
|
*/
|
|
14501
14187
|
|
|
@@ -14510,6 +14196,10 @@ let BaseIcon$1 = class BaseIcon extends AuroElement$1 {
|
|
|
14510
14196
|
static get properties() {
|
|
14511
14197
|
return {
|
|
14512
14198
|
...super.properties,
|
|
14199
|
+
|
|
14200
|
+
/**
|
|
14201
|
+
* Set value for on-dark version of auro-icon.
|
|
14202
|
+
*/
|
|
14513
14203
|
onDark: {
|
|
14514
14204
|
type: Boolean,
|
|
14515
14205
|
reflect: true
|
|
@@ -14568,135 +14258,44 @@ let BaseIcon$1 = class BaseIcon extends AuroElement$1 {
|
|
|
14568
14258
|
}
|
|
14569
14259
|
};
|
|
14570
14260
|
|
|
14571
|
-
var tokensCss$2$1 = css`:host{--ds-auro-icon-color:var(--ds-color-
|
|
14261
|
+
var tokensCss$2$1 = css`:host{--ds-auro-icon-color:var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-alaska-color:#02426D;--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}`;
|
|
14572
14262
|
|
|
14573
|
-
var colorCss$3$1 = css`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[
|
|
14263
|
+
var colorCss$3$1 = css`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[variant=accent1]){--ds-auro-icon-color:var(--ds-basic-color-texticon-accent1, #265688)}:host(:not([onDark])[variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:not([onDark])[variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-muted, #676767)}:host(:not([onDark])[variant=statusDefault]){--ds-auro-icon-color:var(--ds-basic-color-status-default, #afb9c6)}:host(:not([onDark])[variant=statusInfo]){--ds-auro-icon-color:var(--ds-basic-color-status-info, #01426a)}:host(:not([onDark])[variant=statusSuccess]){--ds-auro-icon-color:var(--ds-basic-color-status-success, #447a1f)}:host(:not([onDark])[variant=statusWarning]){--ds-auro-icon-color:var(--ds-basic-color-status-warning, #fac200)}:host(:not([onDark])[variant=statusError]){--ds-auro-icon-color:var(--ds-basic-color-status-error, #e31f26)}:host(:not([onDark])[variant=statusInfoSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-info-subtle, #ebf3f9)}:host(:not([onDark])[variant=statusSuccessSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-success-subtle, #d6eac7)}:host(:not([onDark])[variant=statusWarningSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-warning-subtle, #fff0b2)}:host(:not([onDark])[variant=statusErrorSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-error-subtle, #fbc6c6)}:host(:not([onDark])[variant=fareBasicEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-basiceconomy, #97eaf8)}:host(:not([onDark])[variant=fareBusiness]){--ds-auro-icon-color:var(--ds-basic-color-fare-business, #01426a)}:host(:not([onDark])[variant=fareEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-economy, #0074ca)}:host(:not([onDark])[variant=fareFirst]){--ds-auro-icon-color:var(--ds-basic-color-fare-first, #00274a)}:host(:not([onDark])[variant=farePremiumEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-premiumeconomy, #005154)}:host(:not([onDark])[variant=fareOneWorldEmerald]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-emerald, #139142)}:host(:not([onDark])[variant=fareOneWorldSapphire]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-sapphire, #015daa)}:host(:not([onDark])[variant=fareOneWorldRuby]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-ruby, #a41d4a)}:host([onDark]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse, #ffffff)}:host([onDark][variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([onDark][variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}`;
|
|
14574
14264
|
|
|
14575
|
-
// Copyright (c) Alaska
|
|
14265
|
+
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
14576
14266
|
// See LICENSE in the project root for license information.
|
|
14577
14267
|
|
|
14578
|
-
// ---------------------------------------------------------------------
|
|
14579
|
-
|
|
14580
|
-
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
14581
|
-
|
|
14582
|
-
let AuroLibraryRuntimeUtils$1$1 = class AuroLibraryRuntimeUtils {
|
|
14583
14268
|
|
|
14584
|
-
|
|
14269
|
+
let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
14270
|
+
constructor() {
|
|
14271
|
+
super();
|
|
14585
14272
|
|
|
14586
|
-
|
|
14587
|
-
|
|
14588
|
-
* @param {String} name - The name of the custom element.
|
|
14589
|
-
* @param {Object} componentClass - The class to register as a custom element.
|
|
14590
|
-
* @returns {void}
|
|
14591
|
-
*/
|
|
14592
|
-
registerComponent(name, componentClass) {
|
|
14593
|
-
if (!customElements.get(name)) {
|
|
14594
|
-
customElements.define(name, class extends componentClass {});
|
|
14595
|
-
}
|
|
14273
|
+
this.variant = undefined;
|
|
14274
|
+
this.privateDefaults();
|
|
14596
14275
|
}
|
|
14597
14276
|
|
|
14598
14277
|
/**
|
|
14599
|
-
*
|
|
14278
|
+
* Internal Defaults.
|
|
14279
|
+
* @private
|
|
14600
14280
|
* @returns {void}
|
|
14601
14281
|
*/
|
|
14602
|
-
|
|
14603
|
-
|
|
14604
|
-
|
|
14605
|
-
__Closest = (el, found = el && el.closest(selector)) =>
|
|
14606
|
-
!el || el === document || el === window
|
|
14607
|
-
? null // standard .closest() returns null for non-found selectors also
|
|
14608
|
-
: found
|
|
14609
|
-
? found // found a selector INside this element
|
|
14610
|
-
: __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
|
|
14611
|
-
) {
|
|
14612
|
-
return __Closest(base);
|
|
14282
|
+
privateDefaults() {
|
|
14283
|
+
this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
|
|
14284
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$1$1();
|
|
14613
14285
|
}
|
|
14614
|
-
/* eslint-enable jsdoc/require-param */
|
|
14615
14286
|
|
|
14616
|
-
|
|
14617
|
-
|
|
14618
|
-
|
|
14619
|
-
|
|
14620
|
-
* @returns {void}
|
|
14621
|
-
*/
|
|
14622
|
-
handleComponentTagRename(elem, tagName) {
|
|
14623
|
-
const tag = tagName.toLowerCase();
|
|
14624
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
14287
|
+
// function to define props used within the scope of this component
|
|
14288
|
+
static get properties() {
|
|
14289
|
+
return {
|
|
14290
|
+
...super.properties,
|
|
14625
14291
|
|
|
14626
|
-
|
|
14627
|
-
|
|
14628
|
-
|
|
14629
|
-
|
|
14630
|
-
|
|
14631
|
-
|
|
14632
|
-
|
|
14633
|
-
* @param {Object} elem - The element to validate.
|
|
14634
|
-
* @param {String} tagName - The name of the Auro component to check against.
|
|
14635
|
-
* @returns {Boolean} - Returns true if the element is the specified Auro component.
|
|
14636
|
-
*/
|
|
14637
|
-
elementMatch(elem, tagName) {
|
|
14638
|
-
const tag = tagName.toLowerCase();
|
|
14639
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
14640
|
-
|
|
14641
|
-
return elemTag === tag || elem.hasAttribute(tag);
|
|
14642
|
-
}
|
|
14643
|
-
};
|
|
14644
|
-
|
|
14645
|
-
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
14646
|
-
// See LICENSE in the project root for license information.
|
|
14647
|
-
|
|
14648
|
-
|
|
14649
|
-
let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
14650
|
-
constructor() {
|
|
14651
|
-
super();
|
|
14652
|
-
|
|
14653
|
-
this.privateDefaults();
|
|
14654
|
-
}
|
|
14655
|
-
|
|
14656
|
-
/**
|
|
14657
|
-
* Internal Defaults.
|
|
14658
|
-
* @private
|
|
14659
|
-
* @returns {void}
|
|
14660
|
-
*/
|
|
14661
|
-
privateDefaults() {
|
|
14662
|
-
this.accent = false;
|
|
14663
|
-
this.customColor = false;
|
|
14664
|
-
this.customSvg = false;
|
|
14665
|
-
this.disabled = false;
|
|
14666
|
-
this.emphasis = false;
|
|
14667
|
-
this.error = false;
|
|
14668
|
-
this.info = false;
|
|
14669
|
-
this.label = false;
|
|
14670
|
-
this.primary = false;
|
|
14671
|
-
this.secondary = false;
|
|
14672
|
-
this.subtle = false;
|
|
14673
|
-
this.success = false;
|
|
14674
|
-
this.tertiary = false;
|
|
14675
|
-
this.warning = false;
|
|
14676
|
-
this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
|
|
14677
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$1$1();
|
|
14678
|
-
}
|
|
14679
|
-
|
|
14680
|
-
// function to define props used within the scope of this component
|
|
14681
|
-
static get properties() {
|
|
14682
|
-
return {
|
|
14683
|
-
...super.properties,
|
|
14684
|
-
|
|
14685
|
-
/**
|
|
14686
|
-
* Sets the icon to use the accent style.
|
|
14687
|
-
*/
|
|
14688
|
-
accent: {
|
|
14689
|
-
type: Boolean,
|
|
14690
|
-
reflect: true
|
|
14691
|
-
},
|
|
14692
|
-
|
|
14693
|
-
/**
|
|
14694
|
-
* Set aria-hidden value. Default is `true`. Option is `false`.
|
|
14695
|
-
*/
|
|
14696
|
-
ariaHidden: {
|
|
14697
|
-
type: String,
|
|
14698
|
-
reflect: true
|
|
14699
|
-
},
|
|
14292
|
+
/**
|
|
14293
|
+
* Set aria-hidden value. Default is `true`. Option is `false`.
|
|
14294
|
+
*/
|
|
14295
|
+
ariaHidden: {
|
|
14296
|
+
type: String,
|
|
14297
|
+
reflect: true
|
|
14298
|
+
},
|
|
14700
14299
|
|
|
14701
14300
|
/**
|
|
14702
14301
|
* The category of the icon you are looking for. See https://auro.alaskaair.com/icons/usage.
|
|
@@ -14720,38 +14319,6 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
|
14720
14319
|
type: Boolean
|
|
14721
14320
|
},
|
|
14722
14321
|
|
|
14723
|
-
/**
|
|
14724
|
-
* Sets the icon to use the disabled style.
|
|
14725
|
-
*/
|
|
14726
|
-
disabled: {
|
|
14727
|
-
type: Boolean,
|
|
14728
|
-
reflect: true
|
|
14729
|
-
},
|
|
14730
|
-
|
|
14731
|
-
/**
|
|
14732
|
-
* Sets the icon to use the emphasis style.
|
|
14733
|
-
*/
|
|
14734
|
-
emphasis: {
|
|
14735
|
-
type: Boolean,
|
|
14736
|
-
reflect: true
|
|
14737
|
-
},
|
|
14738
|
-
|
|
14739
|
-
/**
|
|
14740
|
-
* Sets the icon to use the error style.
|
|
14741
|
-
*/
|
|
14742
|
-
error: {
|
|
14743
|
-
type: Boolean,
|
|
14744
|
-
reflect: true
|
|
14745
|
-
},
|
|
14746
|
-
|
|
14747
|
-
/**
|
|
14748
|
-
* Sets the icon to use the info style.
|
|
14749
|
-
*/
|
|
14750
|
-
info: {
|
|
14751
|
-
type: Boolean,
|
|
14752
|
-
reflect: true
|
|
14753
|
-
},
|
|
14754
|
-
|
|
14755
14322
|
/**
|
|
14756
14323
|
* Exposes content in slot as icon label.
|
|
14757
14324
|
*/
|
|
@@ -14769,50 +14336,10 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
|
14769
14336
|
},
|
|
14770
14337
|
|
|
14771
14338
|
/**
|
|
14772
|
-
*
|
|
14773
|
-
*/
|
|
14774
|
-
primary: {
|
|
14775
|
-
type: Boolean,
|
|
14776
|
-
reflect: true
|
|
14777
|
-
},
|
|
14778
|
-
|
|
14779
|
-
/**
|
|
14780
|
-
* Sets the icon to use the secondary style.
|
|
14781
|
-
*/
|
|
14782
|
-
secondary: {
|
|
14783
|
-
type: Boolean,
|
|
14784
|
-
reflect: true
|
|
14785
|
-
},
|
|
14786
|
-
|
|
14787
|
-
/**
|
|
14788
|
-
* Sets the icon to use the subtle style.
|
|
14789
|
-
*/
|
|
14790
|
-
subtle: {
|
|
14791
|
-
type: Boolean,
|
|
14792
|
-
reflect: true
|
|
14793
|
-
},
|
|
14794
|
-
|
|
14795
|
-
/**
|
|
14796
|
-
* Sets the icon to use the success style.
|
|
14339
|
+
* 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`.
|
|
14797
14340
|
*/
|
|
14798
|
-
|
|
14799
|
-
type:
|
|
14800
|
-
reflect: true
|
|
14801
|
-
},
|
|
14802
|
-
|
|
14803
|
-
/**
|
|
14804
|
-
* Sets the icon to use the tertiary style.
|
|
14805
|
-
*/
|
|
14806
|
-
tertiary: {
|
|
14807
|
-
type: Boolean,
|
|
14808
|
-
reflect: true
|
|
14809
|
-
},
|
|
14810
|
-
|
|
14811
|
-
/**
|
|
14812
|
-
* Sets the icon to use the warning style.
|
|
14813
|
-
*/
|
|
14814
|
-
warning: {
|
|
14815
|
-
type: Boolean,
|
|
14341
|
+
variant: {
|
|
14342
|
+
type: String,
|
|
14816
14343
|
reflect: true
|
|
14817
14344
|
}
|
|
14818
14345
|
};
|
|
@@ -14908,7 +14435,7 @@ var styleCss$2$1 = css`:host{position:absolute;z-index:var(--depth-tooltip, 400)
|
|
|
14908
14435
|
|
|
14909
14436
|
var colorCss$2$1 = css`.container{background-color:var(--ds-auro-dropdownbib-container-color);box-shadow:var(--ds-auro-dropdownbib-boxshadow-color);color:var(--ds-auro-dropdownbib-text-color)}`;
|
|
14910
14437
|
|
|
14911
|
-
var tokensCss$1$1 = css`:host{--ds-auro-dropdown-label-text-color: var(--ds-
|
|
14438
|
+
var tokensCss$1$1 = css`:host{--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-dropdown-trigger-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-border-color: transparent;--ds-auro-dropdown-trigger-outline-color: transparent;--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-dropdownbib-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdownbib-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}`;
|
|
14912
14439
|
|
|
14913
14440
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
14914
14441
|
// See LICENSE in the project root for license information.
|
|
@@ -14938,7 +14465,7 @@ class AuroDropdownBib extends LitElement {
|
|
|
14938
14465
|
*/
|
|
14939
14466
|
this._mobileBreakpointValue = undefined;
|
|
14940
14467
|
|
|
14941
|
-
AuroLibraryRuntimeUtils$
|
|
14468
|
+
AuroLibraryRuntimeUtils$1$1.prototype.handleComponentTagRename(this, 'auro-dropdownbib');
|
|
14942
14469
|
}
|
|
14943
14470
|
|
|
14944
14471
|
static get styles() {
|
|
@@ -15031,13 +14558,13 @@ var dropdownVersion$1 = '3.0.0';
|
|
|
15031
14558
|
|
|
15032
14559
|
var styleCss$1$1 = css`:host{position:relative;display:inline-block;max-width:100%}:host([fluid]){display:block}#bibSizer{position:absolute;z-index:-1;opacity:0;pointer-events:none}.label{font-size:var(--ds-text-body-size-xs, 0.75rem);line-height:var(--ds-text-body-size-default, 1rem);transition:font-size .3s cubic-bezier(0.215, 0.61, 0.355, 1);white-space:normal}.label[hasTrigger=false]{font-size:var(--ds-text-body-size-default, 1rem)}.trigger{position:relative;display:flex;align-items:center}.trigger[showBorder]{border-width:1px;border-style:solid;cursor:pointer;outline-style:solid;outline-width:1px}@media(hover: hover){.trigger:hover{cursor:pointer}}.triggerContentWrapper{overflow:hidden;flex:1;text-overflow:ellipsis;white-space:nowrap}#showStateIcon{display:flex;overflow:hidden;height:100%;align-items:center;margin-left:var(--ds-size-100, 0.5rem)}#showStateIcon [auro-icon]{height:var(--ds-size-300, 1.5rem);line-height:var(--ds-size-300, 1.5rem)}#showStateIcon[data-expanded=true] [auro-icon]{transform:rotate(-180deg)}:host([matchwidth]) #bibSizer{width:100%}:host([disabled]){pointer-events:none}:host([inset]) .trigger{padding:var(--ds-size-150, 0.75rem) var(--ds-size-200, 1rem)}:host([common]) .trigger,:host([inset][bordered]) .trigger{padding:var(--ds-size-200, 1rem) var(--ds-size-150, 0.75rem)}:host([inset][bordered][labeled]) .trigger{padding:var(--ds-size-100, 0.5rem) var(--ds-size-150, 0.75rem)}:host([common]) .trigger,:host([rounded]) .trigger{border-radius:var(--ds-border-radius, 0.375rem)}`;
|
|
15033
14560
|
|
|
15034
|
-
var colorCss$1$1 = css`.label{color:var(--ds-auro-dropdown-label-text-color)}.trigger{border-color:var(--ds-auro-dropdown-trigger-border-color);background-color:var(--ds-auro-dropdown-trigger-container-color);color:var(--ds-auro-dropdown-trigger-text-color);outline-color:var(--ds-auro-dropdown-trigger-outline-color)}.trigger:focus-within,.trigger:active{--ds-auro-dropdown-trigger-border-color: var(--ds-color-
|
|
14561
|
+
var colorCss$1$1 = css`.label{color:var(--ds-auro-dropdown-label-text-color)}.trigger{border-color:var(--ds-auro-dropdown-trigger-border-color);background-color:var(--ds-auro-dropdown-trigger-container-color);color:var(--ds-auro-dropdown-trigger-text-color);outline-color:var(--ds-auro-dropdown-trigger-outline-color)}.trigger:focus-within,.trigger:active{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused, #01426a);--ds-auro-dropdown-trigger-outline-color: var(--ds-advanced-color-state-focused, #01426a)}:host([disabled]){--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0);--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host([common]),:host([bordered]){--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-bold, #585e67)}:host([common]) .trigger:active,:host([common]) .trigger:focus-within,:host([bordered]) .trigger:active,:host([bordered]) .trigger:focus-within{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused, #01426a)}:host([error]){--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-status-error, #e31f26)}:host([error]) .trigger{outline:solid 1px var(--ds-auro-dropdown-trigger-border-color)}:host([error]) .trigger:focus-within,:host([error]) .trigger:active{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused, #01426a);--ds-auro-dropdown-trigger-outline-color: var(--ds-advanced-color-state-focused, #01426a)}:host([disabled][common]),:host([disabled][bordered]){--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-subtle, #dddddd)}:host([onDark]){--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db);--ds-auro-dropdown-trigger-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-inverse, #ffffff)}:host([onDark]):focus-within,:host([onDark]):active{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-dropdown-trigger-outline-color: var(--ds-advanced-color-state-focused-inverse, #ffffff)}:host([onDark][disabled]){--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894);--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([onDark][common]),:host([onDark][bordered]){--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-inverse, #ffffff)}:host([onDark][common]) .trigger:focus-within,:host([onDark][common]) .trigger:active,:host([onDark][bordered]) .trigger:focus-within,:host([onDark][bordered]) .trigger:active{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-dropdown-trigger-outline-color: var(--ds-advanced-color-state-focused-inverse, #ffffff)}:host([onDark][error]){--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8)}:host([onDark][error]) .trigger{outline:solid 1px var(--ds-auro-dropdown-trigger-border-color)}:host([onDark][error]) .trigger:focus-within,:host([onDark][error]) .trigger:active{--ds-auro-dropdown-trigger-border-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-dropdown-trigger-outline-color: var(--ds-advanced-color-state-focused-inverse, #ffffff)}:host([onDark][disabled][common]),:host([onDark][disabled][bordered]){--ds-auro-dropdown-trigger-container-color: var(--ds-advanced-color-shared-background-inverse-disabled, rgba(255, 255, 255, 0.1))}`;
|
|
15035
14562
|
|
|
15036
|
-
var colorCss$5 = css`:host([error]){--ds-auro-helptext-color: var(--ds-color-
|
|
14563
|
+
var colorCss$5 = css`:host([error]){--ds-auro-helptext-color: var(--ds-basic-color-status-error, #e31f26)}:host([onDark]){--ds-auro-helptext-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}:host([onDark][error]){--ds-auro-helptext-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8)}.helptext-wrapper{color:var(--ds-auro-helptext-color)}`;
|
|
15037
14564
|
|
|
15038
14565
|
var styleCss$5 = css`.helptext-wrapper{display:none;font-size:var(--ds-text-body-size-xs, 0.75rem);line-height:var(--ds-size-200, 1rem)}:host([large]) .helptext-wrapper{font-size:var(--ds-text-body-size-default, 1rem)}.helptext-wrapper[visible]{display:block}::slotted(*:not(:empty)){margin-top:var(--ds-size-50, 0.25rem);margin-bottom:0}::slotted(p){margin-block:0}`;
|
|
15039
14566
|
|
|
15040
|
-
var tokensCss$5 = css`:host{--ds-auro-helptext-color: var(--ds-color-
|
|
14567
|
+
var tokensCss$5 = css`:host{--ds-auro-helptext-color: var(--ds-basic-color-texticon-muted, #676767)}`;
|
|
15041
14568
|
|
|
15042
14569
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
15043
14570
|
// See LICENSE in the project root for license information.
|
|
@@ -15046,7 +14573,7 @@ var tokensCss$5 = css`:host{--ds-auro-helptext-color: var(--ds-color-text-tertia
|
|
|
15046
14573
|
|
|
15047
14574
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
15048
14575
|
|
|
15049
|
-
let AuroLibraryRuntimeUtils$
|
|
14576
|
+
let AuroLibraryRuntimeUtils$2 = class AuroLibraryRuntimeUtils {
|
|
15050
14577
|
|
|
15051
14578
|
/* eslint-disable jsdoc/require-param */
|
|
15052
14579
|
|
|
@@ -15124,9 +14651,10 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
|
|
|
15124
14651
|
super();
|
|
15125
14652
|
|
|
15126
14653
|
this.error = false;
|
|
14654
|
+
this.onDark = false;
|
|
15127
14655
|
this.hasTextContent = false;
|
|
15128
14656
|
|
|
15129
|
-
AuroLibraryRuntimeUtils$
|
|
14657
|
+
AuroLibraryRuntimeUtils$2.prototype.handleComponentTagRename(this, 'auro-helptext');
|
|
15130
14658
|
}
|
|
15131
14659
|
|
|
15132
14660
|
static get styles() {
|
|
@@ -15162,6 +14690,14 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
|
|
|
15162
14690
|
type: Boolean,
|
|
15163
14691
|
reflect: true,
|
|
15164
14692
|
},
|
|
14693
|
+
|
|
14694
|
+
/**
|
|
14695
|
+
* If declared, will apply onDark styles.
|
|
14696
|
+
*/
|
|
14697
|
+
onDark: {
|
|
14698
|
+
type: Boolean,
|
|
14699
|
+
reflect: true
|
|
14700
|
+
}
|
|
15165
14701
|
};
|
|
15166
14702
|
}
|
|
15167
14703
|
|
|
@@ -15174,7 +14710,7 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
|
|
|
15174
14710
|
*
|
|
15175
14711
|
*/
|
|
15176
14712
|
static register(name = "auro-helptext") {
|
|
15177
|
-
AuroLibraryRuntimeUtils$
|
|
14713
|
+
AuroLibraryRuntimeUtils$2.prototype.registerComponent(name, AuroHelpText);
|
|
15178
14714
|
}
|
|
15179
14715
|
|
|
15180
14716
|
updated() {
|
|
@@ -15293,6 +14829,7 @@ class AuroDropdown extends LitElement {
|
|
|
15293
14829
|
this.tabIndex = 0;
|
|
15294
14830
|
this.noToggle = false;
|
|
15295
14831
|
this.labeled = true;
|
|
14832
|
+
this.onDark = false;
|
|
15296
14833
|
|
|
15297
14834
|
// floaterConfig
|
|
15298
14835
|
this.placement = 'bottom-start';
|
|
@@ -15313,7 +14850,7 @@ class AuroDropdown extends LitElement {
|
|
|
15313
14850
|
/**
|
|
15314
14851
|
* @private
|
|
15315
14852
|
*/
|
|
15316
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
14853
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$1$1();
|
|
15317
14854
|
|
|
15318
14855
|
/**
|
|
15319
14856
|
* @private
|
|
@@ -15323,7 +14860,7 @@ class AuroDropdown extends LitElement {
|
|
|
15323
14860
|
/**
|
|
15324
14861
|
* Generate unique names for dependency components.
|
|
15325
14862
|
*/
|
|
15326
|
-
const versioning = new AuroDependencyVersioning$
|
|
14863
|
+
const versioning = new AuroDependencyVersioning$1();
|
|
15327
14864
|
|
|
15328
14865
|
/**
|
|
15329
14866
|
* @private
|
|
@@ -15549,6 +15086,14 @@ class AuroDropdown extends LitElement {
|
|
|
15549
15086
|
reflect: true
|
|
15550
15087
|
},
|
|
15551
15088
|
|
|
15089
|
+
/**
|
|
15090
|
+
* If declared, onDark styles will be applied.
|
|
15091
|
+
*/
|
|
15092
|
+
onDark: {
|
|
15093
|
+
type: Boolean,
|
|
15094
|
+
reflect: true
|
|
15095
|
+
},
|
|
15096
|
+
|
|
15552
15097
|
onSlotChange: {
|
|
15553
15098
|
type: Function,
|
|
15554
15099
|
reflect: false
|
|
@@ -15602,7 +15147,7 @@ class AuroDropdown extends LitElement {
|
|
|
15602
15147
|
*
|
|
15603
15148
|
*/
|
|
15604
15149
|
static register(name = "auro-dropdown") {
|
|
15605
|
-
AuroLibraryRuntimeUtils$
|
|
15150
|
+
AuroLibraryRuntimeUtils$1$1.prototype.registerComponent(name, AuroDropdown);
|
|
15606
15151
|
}
|
|
15607
15152
|
|
|
15608
15153
|
connectedCallback() {
|
|
@@ -15919,14 +15464,14 @@ class AuroDropdown extends LitElement {
|
|
|
15919
15464
|
<${this.iconTag}
|
|
15920
15465
|
category="interface"
|
|
15921
15466
|
name="chevron-down"
|
|
15922
|
-
|
|
15923
|
-
|
|
15467
|
+
?onDark="${this.onDark}"
|
|
15468
|
+
variant="${this.disabled ? 'disabled' : 'muted'}">
|
|
15924
15469
|
>
|
|
15925
15470
|
</${this.iconTag}>
|
|
15926
15471
|
</div>
|
|
15927
15472
|
` : undefined }
|
|
15928
15473
|
</div>
|
|
15929
|
-
<${this.helpTextTag} part="helpText" ?error="${this.error}">
|
|
15474
|
+
<${this.helpTextTag} part="helpText" ?onDark=${this.onDark} ?error="${this.error}">
|
|
15930
15475
|
<slot name="helpText"></slot>
|
|
15931
15476
|
</${this.helpTextTag}>
|
|
15932
15477
|
<div class="slotContent">
|
|
@@ -16070,11 +15615,11 @@ function stopNotifyingOnLangChange(element) {
|
|
|
16070
15615
|
watchedItems.delete(element);
|
|
16071
15616
|
}
|
|
16072
15617
|
|
|
16073
|
-
var styleCss$4 = css
|
|
15618
|
+
var styleCss$4 = css`:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.typeIcon{display:flex;flex-direction:row;align-items:center}.typeIcon [auro-icon]{--ds-auro-icon-size: var(--ds-size-300, 1.5rem);height:var(--ds-size-300, 1.5rem);margin-right:var(--ds-size-100, 0.5rem)}.notificationIcons{display:flex;flex-direction:row;padding-right:var(--ds-size-100, 0.5rem)}:host([bordered]) .typeIcon{padding-left:var(--ds-size-100, 0.5rem)}:host([bordered]) .notificationIcons{align-items:center}.notification:not(:first-of-type){margin-left:var(--ds-size-100, 0.5rem)}.alertNotification{width:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-25, 0.125rem));height:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-25, 0.125rem))}.passwordBtn{width:calc(var(--ds-size-300, 1.5rem));height:calc(var(--ds-size-300, 1.5rem))}.notificationBtn{display:block;width:var(--ds-size-300, 1.5rem);height:var(--ds-size-300, 1.5rem);padding:0;border:0;background:unset;cursor:pointer}.notificationBtn [auro-icon]{display:block;height:var(--ds-size-300, 1.5rem);--ds-auro-icon-size: var(--ds-size-300, 1.5rem)}.notificationBtn [auro-icon][hidden]{display:none}:host(:not([bordered])) .typeIcon,:host(:not([bordered])) .notificationIcons{align-items:flex-end;padding-bottom:var(--ds-size-50, 0.25rem)}.clearBtn{transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1);overflow:hidden;width:0;opacity:0}:host .wrapper:hover .clearBtn,:host .wrapper:focus-within .clearBtn{width:calc(var(--ds-size-200, 1rem) + var(--ds-size-25, 0.125rem));height:calc(var(--ds-size-200, 1rem) + var(--ds-size-25, 0.125rem));opacity:1}:host(:focus-within[type=password]) .notificationIcons[hasValue] .alertNotification{overflow:hidden;width:0;height:0;padding:0;margin:0;visibility:hidden}input{border:unset}.wrapper{position:relative;overflow:hidden;border-style:solid}:host(:not([bordered],[borderless])) .wrapper{border-width:1px 0}:host([bordered]) .wrapper{border-width:1px;border-radius:var(--ds-border-radius, 0.375rem)}:host(:not([borderless])) .wrapper:focus-within:before{position:absolute;display:block;border-bottom-width:1px;border-bottom-style:solid;content:"";inset:0;pointer-events:none}:host([validity]:not([validity=valid])) .wrapper:before{border-bottom:0}label{transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1);position:absolute;overflow:hidden;pointer-events:none;text-overflow:ellipsis;white-space:nowrap}:host(:not([bordered])) label{top:calc(100% - var(--ds-size-25, 0.125rem));transform:translateY(-100%)}:host(:not([bordered])) label.withIcon{left:var(--ds-size-400, 2rem)}:host([bordered]) label{top:50%;transform:translateY(-50%)}:host([bordered]) label.withIcon{left:var(--ds-size-500, 2.5rem)}:host([bordered]) label:not(label.withIcon){left:var(--ds-size-100, 0.5rem)}:host .wrapper:focus-within label{top:var(--ds-size-100, 0.5rem);font-size:var(--ds-text-body-size-xs, 0.75rem);transform:unset}:host label.withValue{top:var(--ds-size-100, 0.5rem);font-size:var(--ds-text-body-size-xs, 0.75rem);transform:unset}:host([activeLabel]) .wrapper label{top:var(--ds-size-100, 0.5rem);font-size:var(--ds-text-body-size-xs, 0.75rem);transform:unset}:host{position:relative;display:block}.wrapper{display:flex;flex-direction:row}.main{display:flex;flex-direction:row;position:relative;flex:1}input{transition:all .3s cubic-bezier(0.215, 0.61, 0.355, 1);position:relative;overflow:hidden;min-height:var(--ds-size-200, 1rem);max-height:var(--ds-size-200, 1rem);flex:1;padding:var(--ds-size-400, 2rem) 0 var(--ds-size-50, 0.25rem);margin:0;font-family:var(--ds-font-family-default, "AS Circular", Helvetica Neue, Arial, sans-serif);font-size:var(--ds-size-200, 1rem);outline:none;text-overflow:ellipsis;white-space:nowrap}input::-ms-reveal,input::-ms-clear{display:none}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{margin:0;-webkit-appearance:none}input[type=number]{-moz-appearance:textfield;appearance:textfield}input:disabled{background:none;pointer-events:none}:host([bordered]) input{padding:var(--ds-size-400, 2rem) 0 var(--ds-size-100, 0.5rem)}`;
|
|
16074
15619
|
|
|
16075
|
-
var colorCss$4 = css`.wrapper{border-color:transparent}input{background-color:transparent;caret-color:var(--ds-auro-input-caret-color);color:var(--ds-auro-input-text-color)}input::placeholder{color:transparent}input:focus::placeholder{color:var(--ds-auro-input-placeholder-text-color)}input:disabled{--ds-auro-input-
|
|
15620
|
+
var colorCss$4 = css`.wrapper{border-color:transparent}input{background-color:transparent;caret-color:var(--ds-auro-input-caret-color);color:var(--ds-auro-input-text-color)}input::placeholder{color:transparent}input:focus::placeholder{color:var(--ds-auro-input-placeholder-text-color)}input:disabled{--ds-auro-input-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}label{color:var(--ds-auro-input-label-text-color)}.alertNotification{color:var(--ds-auro-input-error-icon-color)}:host(:not([bordered],[borderless])) .wrapper{border-bottom-color:var(--ds-auro-input-border-color)}:host([bordered]) .wrapper{border-color:var(--ds-auro-input-border-color);background-color:var(--ds-auro-input-container-color)}:host([bordered]) .wrapper:focus-within{--ds-auro-input-border-color: var(--ds-advanced-color-state-focused, #01426a);box-shadow:inset 0 0 0 1px var(--ds-auro-input-border-color)}:host([validity]:not([validity=valid])[bordered]) .wrapper{--ds-auro-input-border-color: var(--ds-basic-color-status-error, #e31f26);box-shadow:inset 0 0 0 1px var(--ds-auro-input-border-color)}:host([disabled]){--ds-auro-input-border-color: var(--ds-basic-color-border-subtle, #dddddd);--ds-auro-input-label-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host([onDark][bordered]){--ds-auro-input-caret-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-input-label-text-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db);--ds-auro-input-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-input-placeholder-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-input-border-color: var(--ds-basic-color-border-inverse, #ffffff);--ds-auro-input-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-input-error-icon-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8)}:host([onDark][bordered]) .wrapper:focus-within{--ds-auro-input-border-color: var(--ds-advanced-color-state-focused-inverse, #ffffff);box-shadow:inset 0 0 0 1px var(--ds-auro-input-border-color)}:host([onDark][validity]:not([validity=valid])[bordered]) .wrapper{--ds-auro-input-border-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8);box-shadow:inset 0 0 0 1px var(--ds-auro-input-border-color)}:host([onDark][disabled]){--ds-auro-input-border-color: var(--ds-basic-color-border-inverse, #ffffff);--ds-auro-input-label-text-color: var(--ds-basic-color-texticon-inverse-disabled, #7e8894);--ds-auro-input-container-color: var(--ds-advanced-color-shared-background-inverse-disabled, rgba(255, 255, 255, 0.1))}`;
|
|
16076
15621
|
|
|
16077
|
-
var tokensCss$4 = css`:host{--ds-auro-input-border-color: var(--ds-color-border-
|
|
15622
|
+
var tokensCss$4 = css`:host{--ds-auro-input-border-color: var(--ds-basic-color-border-bold, #585e67);--ds-auro-input-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-input-caret-color: var(--ds-advanced-color-state-focused, #01426a);--ds-auro-input-label-text-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-input-placeholder-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-input-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-input-error-icon-color: var(--ds-basic-color-status-error, #e31f26)}`;
|
|
16078
15623
|
|
|
16079
15624
|
/** Checks if value is string */
|
|
16080
15625
|
function isString(str) {
|
|
@@ -19925,7 +19470,7 @@ class AuroInputUtilities {
|
|
|
19925
19470
|
|
|
19926
19471
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
19927
19472
|
|
|
19928
|
-
let AuroLibraryRuntimeUtils$
|
|
19473
|
+
let AuroLibraryRuntimeUtils$1 = class AuroLibraryRuntimeUtils {
|
|
19929
19474
|
|
|
19930
19475
|
/* eslint-disable jsdoc/require-param */
|
|
19931
19476
|
|
|
@@ -19994,7 +19539,7 @@ let AuroLibraryRuntimeUtils$4 = class AuroLibraryRuntimeUtils {
|
|
|
19994
19539
|
|
|
19995
19540
|
class AuroFormValidation {
|
|
19996
19541
|
constructor() {
|
|
19997
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
19542
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$1();
|
|
19998
19543
|
}
|
|
19999
19544
|
|
|
20000
19545
|
/**
|
|
@@ -20334,6 +19879,7 @@ class BaseInput extends LitElement {
|
|
|
20334
19879
|
this.min = undefined;
|
|
20335
19880
|
this.maxLength = undefined;
|
|
20336
19881
|
this.minLength = undefined;
|
|
19882
|
+
this.onDark = false;
|
|
20337
19883
|
this.activeLabel = false;
|
|
20338
19884
|
this.setCustomValidityForType = undefined;
|
|
20339
19885
|
}
|
|
@@ -20435,7 +19981,8 @@ class BaseInput extends LitElement {
|
|
|
20435
19981
|
* If set, disables the input.
|
|
20436
19982
|
*/
|
|
20437
19983
|
disabled: {
|
|
20438
|
-
type: Boolean
|
|
19984
|
+
type: Boolean,
|
|
19985
|
+
reflect: true
|
|
20439
19986
|
},
|
|
20440
19987
|
|
|
20441
19988
|
/**
|
|
@@ -20465,7 +20012,8 @@ class BaseInput extends LitElement {
|
|
|
20465
20012
|
* 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.
|
|
20466
20013
|
*/
|
|
20467
20014
|
icon: {
|
|
20468
|
-
type: Boolean
|
|
20015
|
+
type: Boolean,
|
|
20016
|
+
reflect: true
|
|
20469
20017
|
},
|
|
20470
20018
|
|
|
20471
20019
|
/**
|
|
@@ -20521,7 +20069,16 @@ class BaseInput extends LitElement {
|
|
|
20521
20069
|
* If set, disables auto-validation on blur.
|
|
20522
20070
|
*/
|
|
20523
20071
|
noValidate: {
|
|
20524
|
-
type: Boolean
|
|
20072
|
+
type: Boolean,
|
|
20073
|
+
reflect: true
|
|
20074
|
+
},
|
|
20075
|
+
|
|
20076
|
+
/**
|
|
20077
|
+
* Sets onDark styles on input.
|
|
20078
|
+
*/
|
|
20079
|
+
onDark: {
|
|
20080
|
+
type: Boolean,
|
|
20081
|
+
reflect: true
|
|
20525
20082
|
},
|
|
20526
20083
|
|
|
20527
20084
|
/**
|
|
@@ -20543,14 +20100,16 @@ class BaseInput extends LitElement {
|
|
|
20543
20100
|
* Makes the input read-only, but can be set programmatically.
|
|
20544
20101
|
*/
|
|
20545
20102
|
readonly: {
|
|
20546
|
-
type: Boolean
|
|
20103
|
+
type: Boolean,
|
|
20104
|
+
reflect: true
|
|
20547
20105
|
},
|
|
20548
20106
|
|
|
20549
20107
|
/**
|
|
20550
20108
|
* Populates the `required` attribute on the input. Used for client-side validation.
|
|
20551
20109
|
*/
|
|
20552
20110
|
required: {
|
|
20553
|
-
type: Boolean
|
|
20111
|
+
type: Boolean,
|
|
20112
|
+
reflect: true
|
|
20554
20113
|
},
|
|
20555
20114
|
|
|
20556
20115
|
/**
|
|
@@ -21258,7 +20817,7 @@ class BaseInput extends LitElement {
|
|
|
21258
20817
|
// See LICENSE in the project root for license information.
|
|
21259
20818
|
|
|
21260
20819
|
|
|
21261
|
-
|
|
20820
|
+
class AuroDependencyVersioning {
|
|
21262
20821
|
|
|
21263
20822
|
/**
|
|
21264
20823
|
* Generates a unique string to be used for child auro element naming.
|
|
@@ -21292,7 +20851,7 @@ let AuroDependencyVersioning$1 = class AuroDependencyVersioning {
|
|
|
21292
20851
|
|
|
21293
20852
|
return tag;
|
|
21294
20853
|
}
|
|
21295
|
-
}
|
|
20854
|
+
}
|
|
21296
20855
|
|
|
21297
20856
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
21298
20857
|
// See LICENSE in the project root for license information.
|
|
@@ -21360,7 +20919,7 @@ const cacheFetch = (uri, options = {}) => {
|
|
|
21360
20919
|
return _fetchMap.get(uri);
|
|
21361
20920
|
};
|
|
21362
20921
|
|
|
21363
|
-
var styleCss$3 = css`:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.ico_squareLarge{fill:currentColor;height:var(--auro-size-lg, var(--ds-size-300, 1.5rem))}.ico_squareSmall{fill:currentColor;height:.6rem}.ico_squareMed{fill:currentColor;height:var(--auro-size-md, var(--ds-size-200, 1rem))}.ico_squareSml{fill:currentColor;height:var(--auro-size-sm, var(--ds-size-150, 0.75rem))}:host{color:currentColor;vertical-align:middle;line-height:1;display:inline-block}
|
|
20922
|
+
var styleCss$3 = css`:focus:not(:focus-visible){outline:3px solid transparent}.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock,:host{display:block}.util_displayFlex{display:flex}.util_displayHidden,:host([hidden]:not(:focus):not(:active)){display:none}.util_displayHiddenVisually,:host([hiddenVisually]:not(:focus):not(:active)){position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}.ico_squareLarge{fill:currentColor;height:var(--auro-size-lg, var(--ds-size-300, 1.5rem))}.ico_squareSmall{fill:currentColor;height:.6rem}.ico_squareMed{fill:currentColor;height:var(--auro-size-md, var(--ds-size-200, 1rem))}.ico_squareSml{fill:currentColor;height:var(--auro-size-sm, var(--ds-size-150, 0.75rem))}:host{color:currentColor;vertical-align:middle;line-height:1;display:inline-block}svg{min-width:var(--ds-auro-icon-size, 1.5rem) !important;width:var(--ds-auro-icon-size, 1.5rem) !important;height:var(--ds-auro-icon-size, 1.5rem) !important}.componentWrapper{display:flex}.svgWrapper{height:var(--ds-auro-icon-size);width:var(--ds-auro-icon-size)}.labelWrapper{margin-left:var(--ds-size-50, 0.25rem);line-height:1.8}`;
|
|
21364
20923
|
|
|
21365
20924
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
21366
20925
|
// See LICENSE in the project root for license information.
|
|
@@ -21368,7 +20927,6 @@ var styleCss$3 = css`:focus:not(:focus-visible){outline:3px solid transparent}.u
|
|
|
21368
20927
|
|
|
21369
20928
|
// See https://git.io/JJ6SJ for "How to document your components using JSDoc"
|
|
21370
20929
|
/**
|
|
21371
|
-
* @attr {Boolean} onDark - Set value for on-dark version of auro-icon
|
|
21372
20930
|
* @slot - Hidden from visibility, used for a11y if icon description is needed
|
|
21373
20931
|
*/
|
|
21374
20932
|
|
|
@@ -21383,6 +20941,10 @@ class BaseIcon extends AuroElement {
|
|
|
21383
20941
|
static get properties() {
|
|
21384
20942
|
return {
|
|
21385
20943
|
...super.properties,
|
|
20944
|
+
|
|
20945
|
+
/**
|
|
20946
|
+
* Set value for on-dark version of auro-icon.
|
|
20947
|
+
*/
|
|
21386
20948
|
onDark: {
|
|
21387
20949
|
type: Boolean,
|
|
21388
20950
|
reflect: true
|
|
@@ -21441,81 +21003,11 @@ class BaseIcon extends AuroElement {
|
|
|
21441
21003
|
}
|
|
21442
21004
|
}
|
|
21443
21005
|
|
|
21444
|
-
var tokensCss$3 = css`:host{--ds-auro-icon-color:var(--ds-color-
|
|
21445
|
-
|
|
21446
|
-
var colorCss$3 = css`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[accent]){--ds-auro-icon-color:var(--ds-color-icon-accent-default, #a2c270)}:host(:not([onDark])[disabled]){--ds-auro-icon-color:var(--ds-color-icon-ui-primary-disabled-default, #adadad)}:host(:not([onDark])[emphasis]){--ds-auro-icon-color:var(--ds-color-icon-emphasis-default, #2a2a2a)}:host(:not([onDark])[error]){--ds-auro-icon-color:var(--ds-color-icon-error-default, #cc1816)}:host(:not([onDark])[info]){--ds-auro-icon-color:var(--ds-color-icon-info-default, #326aa5)}:host(:not([onDark])[secondary]){--ds-auro-icon-color:var(--ds-color-icon-secondary-default, #7e8894)}:host(:not([onDark])[subtle]){--ds-auro-icon-color:var(--ds-color-icon-subtle-default, #a0c9f1)}:host(:not([onDark])[success]){--ds-auro-icon-color:var(--ds-color-icon-success-default, #40a080)}:host(:not([onDark])[tertiary]){--ds-auro-icon-color:var(--ds-color-icon-tertiary-default, #afb9c6)}:host(:not([onDark])[warning]){--ds-auro-icon-color:var(--ds-color-icon-warning-default, #c49432)}:host([onDark]){--ds-auro-icon-color:var(--ds-color-icon-primary-inverse, #f7f7f7)}:host([onDark][accent]){--ds-auro-icon-color:var(--ds-color-icon-accent-inverse, #badd81)}:host([onDark][disabled]){--ds-auro-icon-color:var(--ds-color-icon-ui-primary-disabled-inverse, #7e7e7e)}:host([onDark][emphasis]){--ds-auro-icon-color:var(--ds-color-icon-emphasis-inverse, #ffffff)}:host([onDark][error]){--ds-auro-icon-color:var(--ds-color-icon-error-inverse, #f9aca6)}:host([onDark][info]){--ds-auro-icon-color:var(--ds-color-icon-info-inverse, #89b2d4)}:host([onDark][secondary]){--ds-auro-icon-color:var(--ds-color-icon-secondary-inverse, #ccd2db)}:host([onDark][subtle]){--ds-auro-icon-color:var(--ds-color-icon-subtle-inverse, #326aa5)}:host([onDark][success]){--ds-auro-icon-color:var(--ds-color-icon-success-inverse, #8eceb9)}:host([onDark][tertiary]){--ds-auro-icon-color:var(--ds-color-icon-tertiary-inverse, #939fad)}:host([onDark][warning]){--ds-auro-icon-color:var(--ds-color-icon-warning-inverse, #f2c153)}`;
|
|
21447
|
-
|
|
21448
|
-
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
21449
|
-
// See LICENSE in the project root for license information.
|
|
21450
|
-
|
|
21451
|
-
// ---------------------------------------------------------------------
|
|
21452
|
-
|
|
21453
|
-
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
21454
|
-
|
|
21455
|
-
let AuroLibraryRuntimeUtils$3 = class AuroLibraryRuntimeUtils {
|
|
21456
|
-
|
|
21457
|
-
/* eslint-disable jsdoc/require-param */
|
|
21458
|
-
|
|
21459
|
-
/**
|
|
21460
|
-
* This will register a new custom element with the browser.
|
|
21461
|
-
* @param {String} name - The name of the custom element.
|
|
21462
|
-
* @param {Object} componentClass - The class to register as a custom element.
|
|
21463
|
-
* @returns {void}
|
|
21464
|
-
*/
|
|
21465
|
-
registerComponent(name, componentClass) {
|
|
21466
|
-
if (!customElements.get(name)) {
|
|
21467
|
-
customElements.define(name, class extends componentClass {});
|
|
21468
|
-
}
|
|
21469
|
-
}
|
|
21470
|
-
|
|
21471
|
-
/**
|
|
21472
|
-
* Finds and returns the closest HTML Element based on a selector.
|
|
21473
|
-
* @returns {void}
|
|
21474
|
-
*/
|
|
21475
|
-
closestElement(
|
|
21476
|
-
selector, // selector like in .closest()
|
|
21477
|
-
base = this, // extra functionality to skip a parent
|
|
21478
|
-
__Closest = (el, found = el && el.closest(selector)) =>
|
|
21479
|
-
!el || el === document || el === window
|
|
21480
|
-
? null // standard .closest() returns null for non-found selectors also
|
|
21481
|
-
: found
|
|
21482
|
-
? found // found a selector INside this element
|
|
21483
|
-
: __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
|
|
21484
|
-
) {
|
|
21485
|
-
return __Closest(base);
|
|
21486
|
-
}
|
|
21487
|
-
/* eslint-enable jsdoc/require-param */
|
|
21488
|
-
|
|
21489
|
-
/**
|
|
21490
|
-
* 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.
|
|
21491
|
-
* @param {Object} elem - The element to check.
|
|
21492
|
-
* @param {String} tagName - The name of the Auro component to check for or add as an attribute.
|
|
21493
|
-
* @returns {void}
|
|
21494
|
-
*/
|
|
21495
|
-
handleComponentTagRename(elem, tagName) {
|
|
21496
|
-
const tag = tagName.toLowerCase();
|
|
21497
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
21498
|
-
|
|
21499
|
-
if (elemTag !== tag) {
|
|
21500
|
-
elem.setAttribute(tag, true);
|
|
21501
|
-
}
|
|
21502
|
-
}
|
|
21503
|
-
|
|
21504
|
-
/**
|
|
21505
|
-
* Validates if an element is a specific Auro component.
|
|
21506
|
-
* @param {Object} elem - The element to validate.
|
|
21507
|
-
* @param {String} tagName - The name of the Auro component to check against.
|
|
21508
|
-
* @returns {Boolean} - Returns true if the element is the specified Auro component.
|
|
21509
|
-
*/
|
|
21510
|
-
elementMatch(elem, tagName) {
|
|
21511
|
-
const tag = tagName.toLowerCase();
|
|
21512
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
21006
|
+
var tokensCss$3 = css`:host{--ds-auro-icon-color:var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-alaska-color:#02426D;--ds-auro-icon-size:var(--ds-size-300, 1.5rem)}`;
|
|
21513
21007
|
|
|
21514
|
-
|
|
21515
|
-
}
|
|
21516
|
-
};
|
|
21008
|
+
var colorCss$3 = css`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[variant=accent1]){--ds-auro-icon-color:var(--ds-basic-color-texticon-accent1, #265688)}:host(:not([onDark])[variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:not([onDark])[variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-muted, #676767)}:host(:not([onDark])[variant=statusDefault]){--ds-auro-icon-color:var(--ds-basic-color-status-default, #afb9c6)}:host(:not([onDark])[variant=statusInfo]){--ds-auro-icon-color:var(--ds-basic-color-status-info, #01426a)}:host(:not([onDark])[variant=statusSuccess]){--ds-auro-icon-color:var(--ds-basic-color-status-success, #447a1f)}:host(:not([onDark])[variant=statusWarning]){--ds-auro-icon-color:var(--ds-basic-color-status-warning, #fac200)}:host(:not([onDark])[variant=statusError]){--ds-auro-icon-color:var(--ds-basic-color-status-error, #e31f26)}:host(:not([onDark])[variant=statusInfoSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-info-subtle, #ebf3f9)}:host(:not([onDark])[variant=statusSuccessSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-success-subtle, #d6eac7)}:host(:not([onDark])[variant=statusWarningSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-warning-subtle, #fff0b2)}:host(:not([onDark])[variant=statusErrorSubtle]){--ds-auro-icon-color:var(--ds-basic-color-status-error-subtle, #fbc6c6)}:host(:not([onDark])[variant=fareBasicEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-basiceconomy, #97eaf8)}:host(:not([onDark])[variant=fareBusiness]){--ds-auro-icon-color:var(--ds-basic-color-fare-business, #01426a)}:host(:not([onDark])[variant=fareEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-economy, #0074ca)}:host(:not([onDark])[variant=fareFirst]){--ds-auro-icon-color:var(--ds-basic-color-fare-first, #00274a)}:host(:not([onDark])[variant=farePremiumEconomy]){--ds-auro-icon-color:var(--ds-basic-color-fare-premiumeconomy, #005154)}:host(:not([onDark])[variant=fareOneWorldEmerald]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-emerald, #139142)}:host(:not([onDark])[variant=fareOneWorldSapphire]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-sapphire, #015daa)}:host(:not([onDark])[variant=fareOneWorldRuby]){--ds-auro-icon-color:var(--ds-basic-color-fare-oneworld-ruby, #a41d4a)}:host([onDark]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse, #ffffff)}:host([onDark][variant=disabled]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}:host([onDark][variant=muted]){--ds-auro-icon-color:var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}`;
|
|
21517
21009
|
|
|
21518
|
-
// Copyright (c)
|
|
21010
|
+
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
21519
21011
|
// See LICENSE in the project root for license information.
|
|
21520
21012
|
|
|
21521
21013
|
|
|
@@ -21523,6 +21015,7 @@ class AuroIcon extends BaseIcon {
|
|
|
21523
21015
|
constructor() {
|
|
21524
21016
|
super();
|
|
21525
21017
|
|
|
21018
|
+
this.variant = undefined;
|
|
21526
21019
|
this.privateDefaults();
|
|
21527
21020
|
}
|
|
21528
21021
|
|
|
@@ -21532,22 +21025,8 @@ class AuroIcon extends BaseIcon {
|
|
|
21532
21025
|
* @returns {void}
|
|
21533
21026
|
*/
|
|
21534
21027
|
privateDefaults() {
|
|
21535
|
-
this.accent = false;
|
|
21536
|
-
this.customColor = false;
|
|
21537
|
-
this.customSvg = false;
|
|
21538
|
-
this.disabled = false;
|
|
21539
|
-
this.emphasis = false;
|
|
21540
|
-
this.error = false;
|
|
21541
|
-
this.info = false;
|
|
21542
|
-
this.label = false;
|
|
21543
|
-
this.primary = false;
|
|
21544
|
-
this.secondary = false;
|
|
21545
|
-
this.subtle = false;
|
|
21546
|
-
this.success = false;
|
|
21547
|
-
this.tertiary = false;
|
|
21548
|
-
this.warning = false;
|
|
21549
21028
|
this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
|
|
21550
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
21029
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$1();
|
|
21551
21030
|
}
|
|
21552
21031
|
|
|
21553
21032
|
// function to define props used within the scope of this component
|
|
@@ -21555,14 +21034,6 @@ class AuroIcon extends BaseIcon {
|
|
|
21555
21034
|
return {
|
|
21556
21035
|
...super.properties,
|
|
21557
21036
|
|
|
21558
|
-
/**
|
|
21559
|
-
* Sets the icon to use the accent style.
|
|
21560
|
-
*/
|
|
21561
|
-
accent: {
|
|
21562
|
-
type: Boolean,
|
|
21563
|
-
reflect: true
|
|
21564
|
-
},
|
|
21565
|
-
|
|
21566
21037
|
/**
|
|
21567
21038
|
* Set aria-hidden value. Default is `true`. Option is `false`.
|
|
21568
21039
|
*/
|
|
@@ -21594,99 +21065,27 @@ class AuroIcon extends BaseIcon {
|
|
|
21594
21065
|
},
|
|
21595
21066
|
|
|
21596
21067
|
/**
|
|
21597
|
-
*
|
|
21068
|
+
* Exposes content in slot as icon label.
|
|
21598
21069
|
*/
|
|
21599
|
-
|
|
21070
|
+
label: {
|
|
21600
21071
|
type: Boolean,
|
|
21601
21072
|
reflect: true
|
|
21602
21073
|
},
|
|
21603
21074
|
|
|
21604
21075
|
/**
|
|
21605
|
-
*
|
|
21076
|
+
* The name of the icon you are looking for without the file extension. See https://auro.alaskaair.com/icons/usage.
|
|
21606
21077
|
*/
|
|
21607
|
-
|
|
21608
|
-
type:
|
|
21078
|
+
name: {
|
|
21079
|
+
type: String,
|
|
21609
21080
|
reflect: true
|
|
21610
21081
|
},
|
|
21611
21082
|
|
|
21612
21083
|
/**
|
|
21613
|
-
*
|
|
21084
|
+
* 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`.
|
|
21614
21085
|
*/
|
|
21615
|
-
|
|
21616
|
-
type: Boolean,
|
|
21617
|
-
reflect: true
|
|
21618
|
-
},
|
|
21619
|
-
|
|
21620
|
-
/**
|
|
21621
|
-
* Sets the icon to use the info style.
|
|
21622
|
-
*/
|
|
21623
|
-
info: {
|
|
21624
|
-
type: Boolean,
|
|
21625
|
-
reflect: true
|
|
21626
|
-
},
|
|
21627
|
-
|
|
21628
|
-
/**
|
|
21629
|
-
* Exposes content in slot as icon label.
|
|
21630
|
-
*/
|
|
21631
|
-
label: {
|
|
21632
|
-
type: Boolean,
|
|
21633
|
-
reflect: true
|
|
21634
|
-
},
|
|
21635
|
-
|
|
21636
|
-
/**
|
|
21637
|
-
* The name of the icon you are looking for without the file extension. See https://auro.alaskaair.com/icons/usage.
|
|
21638
|
-
*/
|
|
21639
|
-
name: {
|
|
21086
|
+
variant: {
|
|
21640
21087
|
type: String,
|
|
21641
21088
|
reflect: true
|
|
21642
|
-
},
|
|
21643
|
-
|
|
21644
|
-
/**
|
|
21645
|
-
* DEPRECATED: Sets the icon to use the baseline primary icon style.
|
|
21646
|
-
*/
|
|
21647
|
-
primary: {
|
|
21648
|
-
type: Boolean,
|
|
21649
|
-
reflect: true
|
|
21650
|
-
},
|
|
21651
|
-
|
|
21652
|
-
/**
|
|
21653
|
-
* Sets the icon to use the secondary style.
|
|
21654
|
-
*/
|
|
21655
|
-
secondary: {
|
|
21656
|
-
type: Boolean,
|
|
21657
|
-
reflect: true
|
|
21658
|
-
},
|
|
21659
|
-
|
|
21660
|
-
/**
|
|
21661
|
-
* Sets the icon to use the subtle style.
|
|
21662
|
-
*/
|
|
21663
|
-
subtle: {
|
|
21664
|
-
type: Boolean,
|
|
21665
|
-
reflect: true
|
|
21666
|
-
},
|
|
21667
|
-
|
|
21668
|
-
/**
|
|
21669
|
-
* Sets the icon to use the success style.
|
|
21670
|
-
*/
|
|
21671
|
-
success: {
|
|
21672
|
-
type: Boolean,
|
|
21673
|
-
reflect: true
|
|
21674
|
-
},
|
|
21675
|
-
|
|
21676
|
-
/**
|
|
21677
|
-
* Sets the icon to use the tertiary style.
|
|
21678
|
-
*/
|
|
21679
|
-
tertiary: {
|
|
21680
|
-
type: Boolean,
|
|
21681
|
-
reflect: true
|
|
21682
|
-
},
|
|
21683
|
-
|
|
21684
|
-
/**
|
|
21685
|
-
* Sets the icon to use the warning style.
|
|
21686
|
-
*/
|
|
21687
|
-
warning: {
|
|
21688
|
-
type: Boolean,
|
|
21689
|
-
reflect: true
|
|
21690
21089
|
}
|
|
21691
21090
|
};
|
|
21692
21091
|
}
|
|
@@ -21709,7 +21108,7 @@ class AuroIcon extends BaseIcon {
|
|
|
21709
21108
|
*
|
|
21710
21109
|
*/
|
|
21711
21110
|
static register(name = "auro-icon") {
|
|
21712
|
-
AuroLibraryRuntimeUtils$
|
|
21111
|
+
AuroLibraryRuntimeUtils$1.prototype.registerComponent(name, AuroIcon);
|
|
21713
21112
|
}
|
|
21714
21113
|
|
|
21715
21114
|
connectedCallback() {
|
|
@@ -21775,197 +21174,17 @@ class AuroIcon extends BaseIcon {
|
|
|
21775
21174
|
}
|
|
21776
21175
|
}
|
|
21777
21176
|
|
|
21778
|
-
var iconVersion = '
|
|
21177
|
+
var iconVersion = '8.0.1';
|
|
21779
21178
|
|
|
21780
|
-
|
|
21781
|
-
// See LICENSE in the project root for license information.
|
|
21179
|
+
var styleCss$2 = css`:focus:not(:focus-visible){outline:3px solid transparent}.util_insetNone{padding:0}.util_insetXxxs{padding:.125rem}.util_insetXxxs--stretch{padding:.25rem .125rem}.util_insetXxxs--squish{padding:0 .125rem}.util_insetXxs{padding:.25rem}.util_insetXxs--stretch{padding:.375rem .25rem}.util_insetXxs--squish{padding:.125rem .25rem}.util_insetXs{padding:.5rem}.util_insetXs--stretch{padding:.75rem .5rem}.util_insetXs--squish{padding:.25rem .5rem}.util_insetSm{padding:.75rem}.util_insetSm--stretch{padding:1.125rem .75rem}.util_insetSm--squish{padding:.375rem .75rem}.util_insetMd{padding:1rem}.util_insetMd--stretch{padding:1.5rem 1rem}.util_insetMd--squish{padding:.5rem 1rem}.util_insetLg{padding:1.5rem}.util_insetLg--stretch{padding:2.25rem 1.5rem}.util_insetLg--squish{padding:.75rem 1.5rem}.util_insetXl{padding:2rem}.util_insetXl--stretch{padding:3rem 2rem}.util_insetXl--squish{padding:1rem 2rem}.util_insetXxl{padding:3rem}.util_insetXxl--stretch{padding:4.5rem 3rem}.util_insetXxl--squish{padding:1.5rem 3rem}.util_insetXxxl{padding:4rem}.util_insetXxxl--stretch{padding:6rem 4rem}.util_insetXxxl--squish{padding:2rem 4rem}:host([fluid]) .auro-button,:host([fluid=true]) .auro-button{min-width:auto;width:100%}:host([variant=flat]){display:inline-block;height:var(--ds-size-300, 1.5rem);width:var(--ds-size-300, 1.5rem)}:host([variant=flat]) .auro-button{height:100%;width:100%}::slotted(svg){vertical-align:middle}slot{pointer-events:none}.auro-button{position:relative;padding:0 var(--ds-size-300, 1.5rem);cursor:pointer;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem);font-family:var(--ds-basic-text-body-default-font-family, AS Circular);font-size:var(--ds-basic-text-body-default-font-size, 16px);font-weight:var(--ds-basic-text-body-default-font-weight, Book);overflow:hidden;text-overflow:ellipsis;user-select:none;white-space:nowrap;min-height:var(--ds-size-600, 3rem);max-height:var(--ds-size-600, 3rem);display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--ds-size-100, 0.5rem);margin:0;-webkit-touch-callout:none;-webkit-user-select:none}.auro-button:active{transform:scale(0.95)}.auro-button:focus-visible{outline:none}.auro-button:focus-visible:not([variant=flat]){outline-style:solid;outline-width:var(--ds-size-50, 0.25rem);outline-offset:calc(var(--ds-size-50, 0.25rem)*-1)}.auro-button:focus-visible:not([variant=flat]):not([variant=secondary]):not([variant=tertiary]){outline-width:calc(var(--ds-size-50, 0.25rem) - 1px)}.auro-button.loading{cursor:not-allowed}.auro-button.loading *:not([auro-loader]){visibility:hidden}@media screen and (min-width: 576px){.auro-button{min-width:8.75rem;width:auto}}.auro-button:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=secondary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=flat]{height:unset;width:unset;min-height:unset;max-height:unset;min-width:unset;max-width:unset;border:0;border-radius:unset;gap:unset;padding:unset}.auro-button[onDark]:disabled{cursor:not-allowed;transform:unset}.auro-button[onDark][variant=secondary]:disabled{cursor:not-allowed;transform:unset}@media(hover: hover){.auro-button[onDark][variant=tertiary]:active,.auro-button[onDark][variant=tertiary]:hover{box-shadow:none}}.auro-button[onDark][variant=tertiary]:active{box-shadow:none}.auro-button[onDark][variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button--slim{padding:var(--ds-size-100, 0.5rem) var(--ds-size-200, 1rem);font-size:var(--ds-basic-text-body-sm-font-size, 14px);min-width:unset;min-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem));max-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem))}.auro-button--iconOnly{padding:0 var(--ds-size-100, 0.5rem);border-radius:100px;min-width:unset;height:var(--ds-size-600, 3rem);width:var(--ds-size-500, 2.5rem)}.auro-button--iconOnly ::slotted(auro-icon),.auro-button--iconOnly ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, $ds-size-300)}.auro-button--iconOnly:not(.auro-button--rounded):focus-visible:not([variant=secondary]):not([variant=tertiary]):not([variant=flat]){outline-width:1px;outline-offset:-2px}.auro-button--iconOnlySlim{padding:0 var(--ds-size-50, 0.25rem);height:calc(var(--ds-size-400, 2rem) + var(--ds-size-50, 0.25rem));width:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-50, 0.25rem))}.auro-button--iconOnlySlim ::slotted(auro-icon),.auro-button--iconOnlySlim ::slotted([auro-icon]){--ds-auro-icon-size:calc(var(--ds-size-200, $ds-size-200) + var(--ds-size-50, $ds-size-50))}.auro-button--rounded{border-radius:100px;box-shadow:var(--ds-elevation-300, 0px 0px 15px rgba(0, 0, 0, 0.2));height:var(--ds-size-500, 2.5rem);min-width:unset;transition:all 300ms ease-out,outline 0ms,outline-offset 0ms}.auro-button--rounded ::slotted(auro-icon),.auro-button--rounded ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, $ds-size-300)}.auro-button--rounded:focus-visible:not([variant=flat]):after{border-radius:100px}:host([rounded]) .textSlot{transition:opacity 300ms ease-in;opacity:1}:host([rounded][iconOnly]) .textSlot{opacity:0}:host([rounded][iconOnly]) .textWrapper{display:none}:host([rounded][iconOnly]) .auro-button{min-width:unset;padding:unset;width:var(--ds-size-600, 3rem)}[auro-loader]{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);pointer-events:none}`;
|
|
21782
21180
|
|
|
21181
|
+
var colorCss$2 = css`[auro-loader]{color:var(--ds-auro-button-loader-color)}.auro-button{-webkit-tap-highlight-color:var(--ds-auro-button-tap-color);color:var(--ds-auro-button-text-color);background-color:var(--ds-auro-button-container-color);background-image:linear-gradient(var(--ds-auro-button-container-image), var(--ds-auro-button-container-image));border-color:var(--ds-auro-button-border-color)}.auro-button:not([variant=secondary]):not([variant=tertiary]):focus-visible{outline-color:var(--ds-auro-button-border-inset-color)}.auro-button:not([ondark]):active:not(:disabled),.auro-button:not([ondark]):hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-hover, #00274a);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-hover, #00274a);--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-hover, #00274a)}.auro-button:not([ondark]):disabled{--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-disabled, #acc9e2);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-disabled, #acc9e2);--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-disabled, #acc9e2)}.auro-button:not([ondark])[variant=secondary]{--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background, #ffffff);--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background, #ffffff);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border, #01426a);--ds-auro-button-text-color:var(--ds-advanced-color-button-secondary-text, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-secondary-text, #01426a)}.auro-button:not([ondark])[variant=secondary]:active:not(:disabled),.auro-button:not([ondark])[variant=secondary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background-hover, #f2f2f2);--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background-hover, #f2f2f2);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-hover, #00274a);--ds-auro-button-text-color:var(--ds-advanced-color-button-secondary-text-hover, #00274a)}.auro-button:not([ondark])[variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused, #01426a)}.auro-button:not([ondark])[variant=secondary]:disabled{--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background-disabled, #f7f7f7);--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background-disabled, #f7f7f7);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-disabled, #cfe0ef);--ds-auro-button-text-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}.auro-button:not([ondark])[variant=tertiary]{--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background, rgba(0, 0, 0, 0.05));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background, rgba(0, 0, 0, 0.05));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-advanced-color-button-tertiary-text, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-tertiary-text, #01426a)}.auro-button:not([ondark])[variant=tertiary]:active:not(:disabled),.auro-button:not([ondark])[variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background-hover, rgba(0, 0, 0, 0.1));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background-hover, rgba(0, 0, 0, 0.1));--ds-auro-button-border-color:transparent}.auro-button:not([ondark])[variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-advanced-color-state-focused, #01426a);--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused, #01426a)}.auro-button:not([ondark])[variant=tertiary]:disabled{--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-basic-color-texticon-disabled, #d0d0d0)}.auro-button:not([ondark])[variant=flat]{color:var(--ds-advanced-color-button-flat-text, #676767);background-color:transparent;background-image:none;border-color:transparent}.auro-button:not([ondark])[variant=flat]:active:not(:disabled),.auro-button:not([ondark])[variant=flat]:hover:not(:disabled){color:var(--ds-advanced-color-button-flat-text-hover, #525252);background-color:transparent;background-image:none;border-color:transparent}.auro-button:not([ondark])[variant=flat]:disabled{color:var(--ds-advanced-color-button-flat-text-disabled, #d0d0d0);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark]{--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-inverse, #ffffff);--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-inverse, #ffffff);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-inverse, #ffffff);--ds-auro-button-text-color:var(--ds-advanced-color-button-primary-text-inverse, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-primary-text-inverse, #01426a)}.auro-button[ondark]:active:not(:disabled),.auro-button[ondark]:hover:not(:disabled){--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-inverse-hover, #ebf3f9);--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-inverse-hover, #ebf3f9);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-inverse-hover, #ebf3f9)}.auro-button[ondark]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused, #01426a)}.auro-button[ondark]:disabled{--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background-inverse-disabled, rgba(255, 255, 255, 0.75));--ds-auro-button-text-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}.auro-button[ondark][variant=secondary]{--ds-auro-button-container-color:transparent;--ds-auro-button-container-image:transparent;--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-inverse, #ffffff);--ds-auro-button-text-color:var(--ds-advanced-color-button-secondary-text-inverse, #ffffff);--ds-auro-button-loader-color:var(--ds-advanced-color-button-secondary-text-inverse, #ffffff)}.auro-button[ondark][variant=secondary]:active:not(:disabled),.auro-button[ondark][variant=secondary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-secondary-background-inverse-hover, rgba(255, 255, 255, 0.1));--ds-auro-button-container-image:var(--ds-advanced-color-button-secondary-background-inverse-hover, rgba(255, 255, 255, 0.1))}.auro-button[ondark][variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused-inverse, #ffffff)}.auro-button[ondark][variant=secondary]:disabled{--ds-auro-button-text-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894);--ds-auro-button-border-color:var(--ds-advanced-color-button-secondary-border-inverse-disabled, #dddddd)}.auro-button[ondark][variant=tertiary]{--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background-inverse, rgba(255, 255, 255, 0.05));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background-inverse, rgba(255, 255, 255, 0.05));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-advanced-color-button-tertiary-text-inverse, #ffffff);--ds-auro-button-loader-color:var(--ds-advanced-color-button-tertiary-text-inverse, #ffffff)}.auro-button[ondark][variant=tertiary]:active:not(:disabled),.auro-button[ondark][variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-advanced-color-button-tertiary-background-inverse-hover, rgba(255, 255, 255, 0.1));--ds-auro-button-container-image:var(--ds-advanced-color-button-tertiary-background-inverse-hover, rgba(255, 255, 255, 0.1))}.auro-button[ondark][variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused-inverse, #ffffff)}.auro-button[ondark][variant=tertiary]:disabled{--ds-auro-button-text-color:var(--ds-basic-color-texticon-inverse-disabled, #7e8894)}.auro-button[ondark][variant=flat]{color:var(--ds-advanced-color-button-flat-text-inverse, #ffffff);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark][variant=flat]:active:not(:disabled),.auro-button[ondark][variant=flat]:hover:not(:disabled){color:var(--ds-advanced-color-button-flat-text-inverse-hover, #adadad);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark][variant=flat]:disabled{color:var(--ds-advanced-color-button-flat-text-inverse-disabled, #7e8894);background-color:transparent;background-image:none;border-color:transparent}`;
|
|
21783
21182
|
|
|
21784
|
-
|
|
21785
|
-
|
|
21786
|
-
/**
|
|
21787
|
-
* Generates a unique string to be used for child auro element naming.
|
|
21788
|
-
* @private
|
|
21789
|
-
* @param {string} baseName - Defines the first part of the unique element name.
|
|
21790
|
-
* @param {string} version - Version of the component that will be appended to the baseName.
|
|
21791
|
-
* @returns {string} - Unique string to be used for naming.
|
|
21792
|
-
*/
|
|
21793
|
-
generateElementName(baseName, version) {
|
|
21794
|
-
let result = baseName;
|
|
21795
|
-
|
|
21796
|
-
result += '-';
|
|
21797
|
-
result += version.replace(/[.]/g, '_');
|
|
21798
|
-
|
|
21799
|
-
return result;
|
|
21800
|
-
}
|
|
21801
|
-
|
|
21802
|
-
/**
|
|
21803
|
-
* Generates a unique string to be used for child auro element naming.
|
|
21804
|
-
* @param {string} baseName - Defines the first part of the unique element name.
|
|
21805
|
-
* @param {string} version - Version of the component that will be appended to the baseName.
|
|
21806
|
-
* @returns {string} - Unique string to be used for naming.
|
|
21807
|
-
*/
|
|
21808
|
-
generateTag(baseName, version, tagClass) {
|
|
21809
|
-
const elementName = this.generateElementName(baseName, version);
|
|
21810
|
-
const tag = literal`${unsafeStatic(elementName)}`;
|
|
21811
|
-
|
|
21812
|
-
if (!customElements.get(elementName)) {
|
|
21813
|
-
customElements.define(elementName, class extends tagClass {});
|
|
21814
|
-
}
|
|
21815
|
-
|
|
21816
|
-
return tag;
|
|
21817
|
-
}
|
|
21818
|
-
}
|
|
21819
|
-
|
|
21820
|
-
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
21821
|
-
// See LICENSE in the project root for license information.
|
|
21822
|
-
|
|
21823
|
-
// ---------------------------------------------------------------------
|
|
21824
|
-
|
|
21825
|
-
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
21826
|
-
|
|
21827
|
-
let AuroLibraryRuntimeUtils$2 = class AuroLibraryRuntimeUtils {
|
|
21828
|
-
|
|
21829
|
-
/* eslint-disable jsdoc/require-param */
|
|
21830
|
-
|
|
21831
|
-
/**
|
|
21832
|
-
* This will register a new custom element with the browser.
|
|
21833
|
-
* @param {String} name - The name of the custom element.
|
|
21834
|
-
* @param {Object} componentClass - The class to register as a custom element.
|
|
21835
|
-
* @returns {void}
|
|
21836
|
-
*/
|
|
21837
|
-
registerComponent(name, componentClass) {
|
|
21838
|
-
if (!customElements.get(name)) {
|
|
21839
|
-
customElements.define(name, class extends componentClass {});
|
|
21840
|
-
}
|
|
21841
|
-
}
|
|
21842
|
-
|
|
21843
|
-
/**
|
|
21844
|
-
* Finds and returns the closest HTML Element based on a selector.
|
|
21845
|
-
* @returns {void}
|
|
21846
|
-
*/
|
|
21847
|
-
closestElement(
|
|
21848
|
-
selector, // selector like in .closest()
|
|
21849
|
-
base = this, // extra functionality to skip a parent
|
|
21850
|
-
__Closest = (el, found = el && el.closest(selector)) =>
|
|
21851
|
-
!el || el === document || el === window
|
|
21852
|
-
? null // standard .closest() returns null for non-found selectors also
|
|
21853
|
-
: found
|
|
21854
|
-
? found // found a selector INside this element
|
|
21855
|
-
: __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
|
|
21856
|
-
) {
|
|
21857
|
-
return __Closest(base);
|
|
21858
|
-
}
|
|
21859
|
-
/* eslint-enable jsdoc/require-param */
|
|
21860
|
-
|
|
21861
|
-
/**
|
|
21862
|
-
* 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.
|
|
21863
|
-
* @param {Object} elem - The element to check.
|
|
21864
|
-
* @param {String} tagName - The name of the Auro component to check for or add as an attribute.
|
|
21865
|
-
* @returns {void}
|
|
21866
|
-
*/
|
|
21867
|
-
handleComponentTagRename(elem, tagName) {
|
|
21868
|
-
const tag = tagName.toLowerCase();
|
|
21869
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
21870
|
-
|
|
21871
|
-
if (elemTag !== tag) {
|
|
21872
|
-
elem.setAttribute(tag, true);
|
|
21873
|
-
}
|
|
21874
|
-
}
|
|
21875
|
-
|
|
21876
|
-
/**
|
|
21877
|
-
* Validates if an element is a specific Auro component.
|
|
21878
|
-
* @param {Object} elem - The element to validate.
|
|
21879
|
-
* @param {String} tagName - The name of the Auro component to check against.
|
|
21880
|
-
* @returns {Boolean} - Returns true if the element is the specified Auro component.
|
|
21881
|
-
*/
|
|
21882
|
-
elementMatch(elem, tagName) {
|
|
21883
|
-
const tag = tagName.toLowerCase();
|
|
21884
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
21885
|
-
|
|
21886
|
-
return elemTag === tag || elem.hasAttribute(tag);
|
|
21887
|
-
}
|
|
21888
|
-
};
|
|
21889
|
-
|
|
21890
|
-
var styleCss$2 = css`:focus:not(:focus-visible){outline:3px solid transparent}.util_insetNone{padding:0}.util_insetXxxs{padding:.125rem}.util_insetXxxs--stretch{padding:.25rem .125rem}.util_insetXxxs--squish{padding:0 .125rem}.util_insetXxs{padding:.25rem}.util_insetXxs--stretch{padding:.375rem .25rem}.util_insetXxs--squish{padding:.125rem .25rem}.util_insetXs{padding:.5rem}.util_insetXs--stretch{padding:.75rem .5rem}.util_insetXs--squish{padding:.25rem .5rem}.util_insetSm{padding:.75rem}.util_insetSm--stretch{padding:1.125rem .75rem}.util_insetSm--squish{padding:.375rem .75rem}.util_insetMd{padding:1rem}.util_insetMd--stretch{padding:1.5rem 1rem}.util_insetMd--squish{padding:.5rem 1rem}.util_insetLg{padding:1.5rem}.util_insetLg--stretch{padding:2.25rem 1.5rem}.util_insetLg--squish{padding:.75rem 1.5rem}.util_insetXl{padding:2rem}.util_insetXl--stretch{padding:3rem 2rem}.util_insetXl--squish{padding:1rem 2rem}.util_insetXxl{padding:3rem}.util_insetXxl--stretch{padding:4.5rem 3rem}.util_insetXxl--squish{padding:1.5rem 3rem}.util_insetXxxl{padding:4rem}.util_insetXxxl--stretch{padding:6rem 4rem}.util_insetXxxl--squish{padding:2rem 4rem}:host([fluid]) .auro-button,:host([fluid=true]) .auro-button{min-width:auto;width:100%}:host([variant=flat]){display:inline-block;height:var(--ds-size-300, 1.5rem);width:var(--ds-size-300, 1.5rem)}:host([variant=flat]) .auro-button{height:100%;width:100%}::slotted(svg){vertical-align:middle}slot{pointer-events:none}.auro-button{position:relative;padding:0 var(--ds-size-300, 1.5rem);cursor:pointer;border-width:1px;border-style:solid;border-radius:var(--ds-border-radius, 0.375rem);font-family:var(--ds-font-family-default, "AS Circular", Helvetica Neue, Arial, sans-serif);font-size:var(--ds-text-body-size-default, 1rem);font-weight:var(--ds-text-body-default-weight, 500);overflow:hidden;text-overflow:ellipsis;user-select:none;white-space:nowrap;min-height:var(--ds-size-600, 3rem);max-height:var(--ds-size-600, 3rem);display:inline-flex;flex-direction:row;align-items:center;justify-content:center;gap:var(--ds-size-100, 0.5rem);margin:0;-webkit-touch-callout:none;-webkit-user-select:none}.auro-button:active{transform:scale(0.95)}.auro-button:focus-visible:not([variant=secondary]):not([variant=tertiary]):not([variant=flat]):after{display:block;content:"";height:calc(100% - 2px);width:calc(100% - 2px);position:absolute;top:1px;left:1px;border-radius:4px;border-style:solid;border-width:2px}.auro-button:focus-visible[variant=secondary]:after,.auro-button:focus-visible[variant=tertiary]:after{display:block;content:"";height:100%;width:100%;position:absolute;top:0;left:0;border-radius:var(--ds-border-radius, 0.375rem);border-style:solid;border-width:2px}.auro-button.loading{cursor:not-allowed}.auro-button.loading *:not([auro-loader]){visibility:hidden}@media screen and (min-width: 576px){.auro-button{min-width:8.75rem;width:auto}}.auro-button:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=secondary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button[variant=flat]{height:unset;width:unset;min-height:unset;max-height:unset;min-width:unset;max-width:unset;border:0;border-radius:unset;gap:unset;padding:unset}.auro-button[onDark]:disabled{cursor:not-allowed;transform:unset}.auro-button[onDark][variant=secondary]:disabled{cursor:not-allowed;transform:unset}@media(hover: hover){.auro-button[onDark][variant=tertiary]:active,.auro-button[onDark][variant=tertiary]:hover{box-shadow:none}}.auro-button[onDark][variant=tertiary]:active{box-shadow:none}.auro-button[onDark][variant=tertiary]:disabled{cursor:not-allowed;transform:unset}.auro-button--slim{padding:var(--ds-size-100, 0.5rem) var(--ds-size-200, 1rem);font-size:var(--ds-text-body-size-sm, 0.875rem);min-width:unset;min-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem));max-height:calc(var(--ds-size-500, 2.5rem) - var(--ds-size-50, 0.25rem))}.auro-button--iconOnly{padding:0 var(--ds-size-100, 0.5rem);border-radius:100px;min-width:unset;height:var(--ds-size-600, 3rem);width:var(--ds-size-500, 2.5rem)}.auro-button--iconOnly ::slotted(auro-icon),.auro-button--iconOnly ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, $ds-size-300)}.auro-button--iconOnlySlim{padding:0 var(--ds-size-50, 0.25rem);height:calc(var(--ds-size-400, 2rem) + var(--ds-size-50, 0.25rem));width:calc(var(--ds-size-300, 1.5rem) + var(--ds-size-50, 0.25rem))}.auro-button--iconOnlySlim ::slotted(auro-icon),.auro-button--iconOnlySlim ::slotted([auro-icon]){--ds-auro-icon-size:calc(var(--ds-size-200, $ds-size-200) + var(--ds-size-50, $ds-size-50))}.auro-button--rounded{border-radius:100px;box-shadow:var(--ds-elevation-300, 0px 0px 15px rgba(0, 0, 0, 0.2));height:var(--ds-size-500, 2.5rem);min-width:unset;transition:all 300ms ease-out}.auro-button--rounded ::slotted(auro-icon),.auro-button--rounded ::slotted([auro-icon]){--ds-auro-icon-size:var(--ds-size-300, $ds-size-300)}:host([rounded]) .textSlot{transition:opacity 300ms ease-in;opacity:1}:host([rounded][iconOnly]) .textSlot{opacity:0}:host([rounded][iconOnly]) .textWrapper{display:none}:host([rounded][iconOnly]) .auro-button{min-width:unset;padding:unset;width:var(--ds-size-600, 3rem)}[auro-loader]{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);pointer-events:none}`;
|
|
21891
|
-
|
|
21892
|
-
var colorCss$2 = css`[auro-loader]{color:var(--ds-auro-button-loader-color)}.auro-button{-webkit-tap-highlight-color:var(--ds-auro-button-tap-color);color:var(--ds-auro-button-text-color);background-color:var(--ds-auro-button-container-color);background-image:linear-gradient(var(--ds-auro-button-container-image), var(--ds-auro-button-container-image));border-color:var(--ds-auro-button-border-color)}.auro-button:not([variant=secondary]):not([variant=tertiary]):focus-visible:after{border-color:var(--ds-auro-button-border-inset-color)}.auro-button:not([ondark]):active{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-active-default, #225296);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-active-default, #225296);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-active-default, #225296)}.auro-button:not([ondark])[disabled]{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-disabled-default, #a0c9f1);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-disabled-default, #a0c9f1);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-disabled-default, #a0c9f1)}@media(hover: hover){.auro-button:not([ondark]):active:not(:disabled),.auro-button:not([ondark]):hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-primary-hover-default, #193d73);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-hover-default, #193d73);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-hover-default, #193d73)}}.auro-button:not([ondark])[variant=secondary]{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-default-default, #ffffff);--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-default-default, #ffffff);--ds-auro-button-border-color:var(--ds-color-border-ui-default-default, #2c67b5);--ds-auro-button-text-color:var(--ds-color-text-ui-default-default, #2c67b5)}@media(hover: hover){.auro-button:not([ondark])[variant=secondary]:active:not(:disabled),.auro-button:not([ondark])[variant=secondary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-hover-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-hover-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color:var(--ds-color-border-ui-hover-default, #193d73);--ds-auro-button-text-color:var(--ds-color-text-ui-hover-default, #193d73)}}.auro-button:not([ondark])[variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-color-border-ui-focus-default, #2c67b5)}.auro-button:not([ondark])[variant=secondary]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-active-default, #f0f7fd);--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-active-default, #f0f7fd);--ds-auro-button-border-color:var(--ds-color-border-ui-active-default, #225296);--ds-auro-button-text-color:var(--ds-color-text-ui-active-default, #225296)}.auro-button:not([ondark])[variant=secondary]:disabled{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-disabled-default, #f7f7f7);--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-disabled-default, #f7f7f7);--ds-auro-button-border-color:var(--ds-color-border-ui-disabled-default, #adadad);--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-default, #adadad)}.auro-button:not([ondark])[variant=tertiary]{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-default-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-default-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-default-default, #2c67b5)}@media(hover: hover){.auro-button:not([ondark])[variant=tertiary]:active:not(:disabled),.auro-button:not([ondark])[variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-hover-default, rgba(0, 0, 0, 0.12));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-hover-default, rgba(0, 0, 0, 0.12));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-hover-default, #193d73)}}.auro-button:not([ondark])[variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-color-border-ui-default-default, #2c67b5);--ds-auro-button-border-inset-color:var(--ds-color-border-ui-default-default, #2c67b5)}.auro-button:not([ondark])[variant=tertiary]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-active-default, rgba(0, 0, 0, 0.06));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-active-default, rgba(0, 0, 0, 0.06));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-active-default, #225296)}.auro-button:not([ondark])[variant=tertiary]:disabled{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-disabled-default, rgba(0, 0, 0, 0.03));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-disabled-default, rgba(0, 0, 0, 0.03));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-default, #adadad)}.auro-button:not([ondark])[variant=flat]{color:var(--ds-color-icon-ui-secondary-default-default);background-color:transparent;background-image:none;border-color:transparent}@media(hover: hover){.auro-button:not([ondark])[variant=flat]:active:not(:disabled),.auro-button:not([ondark])[variant=flat]:hover:not(:disabled){color:var(--ds-color-icon-ui-secondary-hover-default);background-color:transparent;background-image:none;border-color:transparent}}.auro-button:not([ondark])[variant=flat]:disabled{color:var(--ds-color-icon-ui-secondary-disabled-default);background-color:transparent;background-image:none;border-color:transparent}.auro-button[ondark]{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-default-inverse, #56bbde);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-default-inverse, #56bbde);--ds-auro-button-text-color:var(--ds-color-text-primary-default, #2a2a2a);--ds-auro-button-loader-color:var(--ds-color-text-primary-inverse, #ffffff);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark]:active:not(:disabled),.auro-button[ondark]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7)}}.auro-button[ondark]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-active-inverse, #6ad5ef);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-active-inverse, #6ad5ef);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-active-inverse, #6ad5ef)}.auro-button[ondark][disabled]{--ds-auro-button-container-color:var(--ds-color-container-ui-primary-disabled-inverse, #275b72);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-disabled-inverse, #275b72);--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-inverse, #7e7e7e);--ds-auro-button-border-color:var(--ds-color-container-ui-primary-disabled-inverse, #275b72)}.auro-button[ondark][variant=secondary]{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-default-inverse, rgba(255, 255, 255, 0.03));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-default-inverse, rgba(255, 255, 255, 0.03));--ds-auro-button-border-color:var(--ds-color-border-ui-default-inverse, #56bbde);--ds-auro-button-text-color:var(--ds-color-text-ui-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark][variant=secondary]:hover{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-hover-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-hover-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color:var(--ds-color-border-ui-hover-inverse, #a8e9f7);--ds-auro-button-text-color:var(--ds-color-text-ui-hover-inverse, #a8e9f7)}}.auro-button[ondark][variant=secondary]:focus-visible{--ds-auro-button-border-inset-color:var(--ds-color-border-ui-focus-inverse, #56bbde)}.auro-button[ondark][variant=secondary]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-border-color:var(--ds-color-border-ui-active-inverse, #6ad5ef);--ds-auro-button-text-color:var(--ds-color-text-ui-active-inverse, #6ad5ef)}.auro-button[ondark][variant=secondary]:disabled{--ds-auro-button-container-color:var(--ds-color-container-ui-secondary-disabled-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image:var(--ds-color-container-ui-secondary-disabled-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color:var(--ds-color-border-ui-disabled-inverse, #7e7e7e);--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-inverse, #7e7e7e)}.auro-button[ondark][variant=tertiary]{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-default-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-default-inverse, rgba(255, 255, 255, 0.12));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-default-inverse, #56bbde)}@media(hover: hover){.auro-button[ondark][variant=tertiary]:active:not(:disabled),.auro-button[ondark][variant=tertiary]:hover:not(:disabled){--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-hover-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-hover-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-hover-inverse, #a8e9f7)}}.auro-button[ondark][variant=tertiary]:focus-visible{--ds-auro-button-border-color:var(--ds-color-border-ui-default-inverse, #56bbde);--ds-auro-button-border-inset-color:var(--ds-color-border-ui-default-inverse, #56bbde)}.auro-button[ondark][variant=tertiary]:active{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-active-inverse, rgba(255, 255, 255, 0.06));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-active-inverse, #6ad5ef)}.auro-button[ondark][variant=tertiary]:disabled{--ds-auro-button-container-color:var(--ds-color-container-ui-tertiary-disabled-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-container-image:var(--ds-color-container-ui-tertiary-disabled-inverse, rgba(255, 255, 255, 0.25));--ds-auro-button-border-color:transparent;--ds-auro-button-text-color:var(--ds-color-text-ui-disabled-inverse, #7e7e7e)}.auro-button[ondark][variant=flat]{color:var(--ds-color-icon-ui-secondary-default-inverse);background-color:transparent;background-image:none;border-color:transparent}@media(hover: hover){.auro-button[ondark][variant=flat]:active:not(:disabled),.auro-button[ondark][variant=flat]:hover:not(:disabled){color:var(--ds-color-icon-ui-secondary-hover-inverse);background-color:transparent;background-image:none;border-color:transparent}}.auro-button[ondark][variant=flat]:disabled{color:var(--ds-color-icon-ui-disabled-default);background-color:transparent;background-image:none;border-color:transparent}`;
|
|
21893
|
-
|
|
21894
|
-
var tokensCss$2 = css`:host{--ds-auro-button-border-color:var(--ds-color-container-ui-primary-default-default, #2c67b5);--ds-auro-button-border-inset-color:var(--ds-color-border-emphasis-inverse, #f2f7fb);--ds-auro-button-container-color:var(--ds-color-container-ui-primary-default-default, #2c67b5);--ds-auro-button-container-image:var(--ds-color-container-ui-primary-default-default, #2c67b5);--ds-auro-button-loader-color:var(--ds-color-utility-navy-default, #265688);--ds-auro-button-text-color:var(--ds-color-text-primary-inverse, #ffffff);--ds-auro-button-tap-color:transparent}`;
|
|
21895
|
-
|
|
21896
|
-
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
21897
|
-
// See LICENSE in the project root for license information.
|
|
21898
|
-
|
|
21899
|
-
// ---------------------------------------------------------------------
|
|
21900
|
-
|
|
21901
|
-
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
21902
|
-
|
|
21903
|
-
let AuroLibraryRuntimeUtils$1 = class AuroLibraryRuntimeUtils {
|
|
21904
|
-
|
|
21905
|
-
/* eslint-disable jsdoc/require-param */
|
|
21906
|
-
|
|
21907
|
-
/**
|
|
21908
|
-
* This will register a new custom element with the browser.
|
|
21909
|
-
* @param {String} name - The name of the custom element.
|
|
21910
|
-
* @param {Object} componentClass - The class to register as a custom element.
|
|
21911
|
-
* @returns {void}
|
|
21912
|
-
*/
|
|
21913
|
-
registerComponent(name, componentClass) {
|
|
21914
|
-
if (!customElements.get(name)) {
|
|
21915
|
-
customElements.define(name, class extends componentClass {});
|
|
21916
|
-
}
|
|
21917
|
-
}
|
|
21918
|
-
|
|
21919
|
-
/**
|
|
21920
|
-
* Finds and returns the closest HTML Element based on a selector.
|
|
21921
|
-
* @returns {void}
|
|
21922
|
-
*/
|
|
21923
|
-
closestElement(
|
|
21924
|
-
selector, // selector like in .closest()
|
|
21925
|
-
base = this, // extra functionality to skip a parent
|
|
21926
|
-
__Closest = (el, found = el && el.closest(selector)) =>
|
|
21927
|
-
!el || el === document || el === window
|
|
21928
|
-
? null // standard .closest() returns null for non-found selectors also
|
|
21929
|
-
: found
|
|
21930
|
-
? found // found a selector INside this element
|
|
21931
|
-
: __Closest(el.getRootNode().host) // recursion!! break out to parent DOM
|
|
21932
|
-
) {
|
|
21933
|
-
return __Closest(base);
|
|
21934
|
-
}
|
|
21935
|
-
/* eslint-enable jsdoc/require-param */
|
|
21936
|
-
|
|
21937
|
-
/**
|
|
21938
|
-
* 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.
|
|
21939
|
-
* @param {Object} elem - The element to check.
|
|
21940
|
-
* @param {String} tagName - The name of the Auro component to check for or add as an attribute.
|
|
21941
|
-
* @returns {void}
|
|
21942
|
-
*/
|
|
21943
|
-
handleComponentTagRename(elem, tagName) {
|
|
21944
|
-
const tag = tagName.toLowerCase();
|
|
21945
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
21946
|
-
|
|
21947
|
-
if (elemTag !== tag) {
|
|
21948
|
-
elem.setAttribute(tag, true);
|
|
21949
|
-
}
|
|
21950
|
-
}
|
|
21951
|
-
|
|
21952
|
-
/**
|
|
21953
|
-
* Validates if an element is a specific Auro component.
|
|
21954
|
-
* @param {Object} elem - The element to validate.
|
|
21955
|
-
* @param {String} tagName - The name of the Auro component to check against.
|
|
21956
|
-
* @returns {Boolean} - Returns true if the element is the specified Auro component.
|
|
21957
|
-
*/
|
|
21958
|
-
elementMatch(elem, tagName) {
|
|
21959
|
-
const tag = tagName.toLowerCase();
|
|
21960
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
21961
|
-
|
|
21962
|
-
return elemTag === tag || elem.hasAttribute(tag);
|
|
21963
|
-
}
|
|
21964
|
-
};
|
|
21183
|
+
var tokensCss$2 = css`:host{--ds-auro-button-border-color:var(--ds-advanced-color-button-primary-border, #01426a);--ds-auro-button-border-inset-color:var(--ds-advanced-color-state-focused-inverse, #ffffff);--ds-auro-button-container-color:var(--ds-advanced-color-button-primary-background, #01426a);--ds-auro-button-container-image:var(--ds-advanced-color-button-primary-background, #01426a);--ds-auro-button-loader-color:var(--ds-advanced-color-button-primary-text, #ffffff);--ds-auro-button-text-color:var(--ds-advanced-color-button-primary-text, #ffffff);--ds-auro-button-tap-color:transparent}`;
|
|
21965
21184
|
|
|
21966
21185
|
var styleCss$1 = css`:focus:not(:focus-visible){outline:3px solid transparent}:host,:host>span{position:relative}:host{width:2rem;height:2rem;display:inline-block;font-size:0}:host>span{position:absolute;display:inline-block;float:none;top:0;left:0;width:2rem;height:2rem;border-radius:100%;border-style:solid;border-width:0}:host([xs]),:host([xs])>span{width:1.2rem;height:1.2rem}:host([sm]),:host([sm])>span{width:3rem;height:3rem}:host([md]),:host([md])>span{width:5rem;height:5rem}:host([lg]),:host([lg])>span{width:8rem;height:8rem}:host{--margin:0.375rem;--margin-xs:0.2rem;--margin-sm:0.5rem;--margin-md:0.75rem;--margin-lg:1rem}:host([pulse]),:host([pulse])>span{position:relative}:host([pulse]){width:calc(3rem + var(--margin)*6);height:1.5rem}:host([pulse])>span{width:1rem;height:1rem;margin:var(--margin);animation:pulse 1.5s ease infinite}:host([pulse][xs]){width:calc(2.55rem + var(--margin-xs)*6);height:1.55rem}:host([pulse][xs])>span{margin:var(--margin-xs);width:.65rem;height:.65rem}:host([pulse][sm]){width:calc(6rem + var(--margin-sm)*6);height:2.5rem}:host([pulse][sm])>span{margin:var(--margin-sm);width:2rem;height:2rem}:host([pulse][md]){width:calc(9rem + var(--margin-md)*6);height:3.5rem}:host([pulse][md])>span{margin:var(--margin-md);width:3rem;height:3rem}:host([pulse][lg]){width:calc(15rem + var(--margin-lg)*6);height:5.5rem}:host([pulse][lg])>span{margin:var(--margin-lg);width:5rem;height:5rem}:host([pulse])>span:nth-child(1){animation-delay:-400ms}:host([pulse])>span:nth-child(2){animation-delay:-200ms}:host([pulse])>span:nth-child(3){animation-delay:0ms}@keyframes pulse{0%,100%{opacity:.1;transform:scale(0.9)}50%{opacity:1;transform:scale(1.1)}}:host([orbit]),:host([orbit])>span{opacity:1}:host([orbit])>span{border-width:5px}:host([orbit])>span:nth-child(2){animation:orbit 2s linear infinite}:host([orbit][sm])>span{border-width:8px}:host([orbit][md])>span{border-width:13px}:host([orbit][lg])>span{border-width:21px}@keyframes orbit{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}:host([ringworm])>svg{animation:rotate 2s linear infinite;height:100%;width:100%;stroke:currentcolor;stroke-width:8}:host([ringworm]) .path{stroke-dashoffset:0;animation:ringworm 1.5s ease-in-out infinite;stroke-linecap:round}@keyframes rotate{100%{transform:rotate(360deg)}}@keyframes ringworm{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}100%{stroke-dasharray:89,200;stroke-dashoffset:-124px}}:host([laser]){position:static;width:100%;display:block;height:0;overflow:hidden;font-size:unset}:host([laser])>span{position:fixed;width:100%;height:.25rem;border-radius:0;z-index:100}:host([laser])>span:nth-child(1){border-color:currentcolor;opacity:.25}:host([laser])>span:nth-child(2){border-color:currentcolor;animation:laser 2s linear infinite;opacity:1;width:50%}:host([laser][sm])>span:nth-child(2){width:20%}:host([laser][md])>span:nth-child(2){width:30%}:host([laser][lg])>span:nth-child(2){width:50%;animation-duration:1.5s}:host([laser][xl])>span:nth-child(2){width:80%;animation-duration:1.5s}@keyframes laser{0%{left:-100%}100%{left:110%}}:host>.no-animation{display:none}@media(prefers-reduced-motion: reduce){:host{display:flex;align-items:center;justify-content:center;font-size:1rem}:host>span{opacity:1}:host>.loader{display:none}:host>.no-animation{display:block}}`;
|
|
21967
21186
|
|
|
21968
|
-
var colorCss$1 = css`:host{color:var(--ds-auro-loader-color)}:host>span{background-color:var(--ds-auro-loader-background-color);border-color:var(--ds-auro-loader-border-color)}:host([onlight]){--ds-auro-loader-color:var(--ds-color-
|
|
21187
|
+
var colorCss$1 = css`:host{color:var(--ds-auro-loader-color)}:host>span{background-color:var(--ds-auro-loader-background-color);border-color:var(--ds-auro-loader-border-color)}:host([onlight]){--ds-auro-loader-color:var(--ds-basic-color-brand-primary, #01426a)}:host([ondark]){--ds-auro-loader-color:var(--ds-basic-color-texticon-inverse, #ffffff)}:host([orbit])>span{--ds-auro-loader-background-color:transparent}:host([orbit])>span:nth-child(1){--ds-auro-loader-border-color:currentcolor;opacity:.25}:host([orbit])>span:nth-child(2){--ds-auro-loader-border-color:currentcolor;border-right-color:transparent;border-bottom-color:transparent;border-left-color:transparent}`;
|
|
21969
21188
|
|
|
21970
21189
|
var tokensCss$1 = css`:host{--ds-auro-loader-background-color:currentcolor;--ds-auro-loader-border-color:currentcolor;--ds-auro-loader-color:currentcolor}`;
|
|
21971
21190
|
|
|
@@ -21973,25 +21192,6 @@ var tokensCss$1 = css`:host{--ds-auro-loader-background-color:currentcolor;--ds-
|
|
|
21973
21192
|
// See LICENSE in the project root for license information.
|
|
21974
21193
|
|
|
21975
21194
|
|
|
21976
|
-
// See https://git.io/JJ6SJ for "How to document your components using JSDoc"
|
|
21977
|
-
/**
|
|
21978
|
-
* The auro-loader element is an easy to use animated loader component.
|
|
21979
|
-
*
|
|
21980
|
-
* @attr {Boolean} pulse - sets loader type
|
|
21981
|
-
* @attr {Boolean} ringworm - sets loader type
|
|
21982
|
-
* @attr {Boolean} laser - sets loader type
|
|
21983
|
-
* @attr {Boolean} orbit - sets loader type
|
|
21984
|
-
* @attr {Boolean} white - sets color of loader to white
|
|
21985
|
-
* @attr {Boolean} ondark - sets color of loader to auro-color-ui-default-on-dark
|
|
21986
|
-
* @attr {Boolean} onlight - sets color of loader to auro-color-ui-default-on-light
|
|
21987
|
-
* @attr {Boolean} xs - sets size to extra small
|
|
21988
|
-
* @attr {Boolean} sm - sets size to small
|
|
21989
|
-
* @attr {Boolean} md - sets size to medium
|
|
21990
|
-
* @attr {Boolean} lg - sets size to large
|
|
21991
|
-
* @csspart element - apply style to adjust speed of animation
|
|
21992
|
-
*/
|
|
21993
|
-
|
|
21994
|
-
// build the component class
|
|
21995
21195
|
class AuroLoader extends LitElement {
|
|
21996
21196
|
constructor() {
|
|
21997
21197
|
super();
|
|
@@ -22025,19 +21225,35 @@ class AuroLoader extends LitElement {
|
|
|
22025
21225
|
// function to define props used within the scope of this component
|
|
22026
21226
|
static get properties() {
|
|
22027
21227
|
return {
|
|
22028
|
-
|
|
21228
|
+
|
|
21229
|
+
/**
|
|
21230
|
+
* Sets loader to laser type.
|
|
21231
|
+
*/
|
|
21232
|
+
laser: {
|
|
22029
21233
|
type: Boolean,
|
|
22030
21234
|
reflect: true
|
|
22031
21235
|
},
|
|
21236
|
+
|
|
21237
|
+
/**
|
|
21238
|
+
* Sets loader to orbit type.
|
|
21239
|
+
*/
|
|
22032
21240
|
orbit: {
|
|
22033
21241
|
type: Boolean,
|
|
22034
21242
|
reflect: true
|
|
22035
21243
|
},
|
|
22036
|
-
|
|
21244
|
+
|
|
21245
|
+
/**
|
|
21246
|
+
* Sets loader to pulse type.
|
|
21247
|
+
*/
|
|
21248
|
+
pulse: {
|
|
22037
21249
|
type: Boolean,
|
|
22038
21250
|
reflect: true
|
|
22039
21251
|
},
|
|
22040
|
-
|
|
21252
|
+
|
|
21253
|
+
/**
|
|
21254
|
+
* Sets loader to ringworm type.
|
|
21255
|
+
*/
|
|
21256
|
+
ringworm: {
|
|
22041
21257
|
type: Boolean,
|
|
22042
21258
|
reflect: true
|
|
22043
21259
|
}
|
|
@@ -22111,23 +21327,26 @@ class AuroLoader extends LitElement {
|
|
|
22111
21327
|
}
|
|
22112
21328
|
}
|
|
22113
21329
|
|
|
22114
|
-
var loaderVersion = '
|
|
21330
|
+
var loaderVersion = '5.0.0';
|
|
22115
21331
|
|
|
21332
|
+
/* eslint-disable max-lines */
|
|
22116
21333
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
22117
21334
|
// See LICENSE in the project root for license information.
|
|
22118
21335
|
|
|
22119
21336
|
|
|
22120
21337
|
/**
|
|
22121
21338
|
* @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
|
|
22122
|
-
* @attr {Boolean} disabled - If set to true button will become disabled and not allow for interactions
|
|
21339
|
+
* @attr {Boolean} disabled - If set to true, button will become disabled and not allow for interactions
|
|
22123
21340
|
* @attr {Boolean} iconOnly - If set to true, the button will contain an icon with no additional content
|
|
22124
21341
|
* @attr {Boolean} loading - If set to true button text will be replaced with `auro-loader` and become disabled
|
|
21342
|
+
* @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.
|
|
22125
21343
|
* @attr {Boolean} onDark - Set value for on-dark version of auro-button
|
|
22126
21344
|
* @attr {Boolean} rounded - If set to true, the button will have a rounded shape
|
|
22127
21345
|
* @attr {Boolean} slim - Set value for slim version of auro-button
|
|
22128
21346
|
* @attr {Boolean} fluid - Alters the shape of the button to be full width of its parent container
|
|
22129
21347
|
* @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.
|
|
22130
21348
|
* @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.
|
|
21349
|
+
* @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.
|
|
22131
21350
|
* @attr {String} id - Set the unique ID of an element.
|
|
22132
21351
|
* @attr {String} title - Sets title attribute. The information is most often shown as a tooltip text when the mouse moves over the element.
|
|
22133
21352
|
* @attr {String} type - The type of the button. Possible values are: `submit`, `reset`, `button`
|
|
@@ -22172,6 +21391,7 @@ class AuroButton extends LitElement {
|
|
|
22172
21391
|
this.rounded = false;
|
|
22173
21392
|
this.slim = false;
|
|
22174
21393
|
this.fluid = false;
|
|
21394
|
+
this.loadingText = this.loadingText || 'Loading...';
|
|
22175
21395
|
|
|
22176
21396
|
// Support for HTML5 forms
|
|
22177
21397
|
if (typeof this.attachInternals === 'function') {
|
|
@@ -22232,6 +21452,9 @@ class AuroButton extends LitElement {
|
|
|
22232
21452
|
type: Boolean,
|
|
22233
21453
|
reflect: true
|
|
22234
21454
|
},
|
|
21455
|
+
loadingText: {
|
|
21456
|
+
type: String
|
|
21457
|
+
},
|
|
22235
21458
|
onDark: {
|
|
22236
21459
|
type: Boolean,
|
|
22237
21460
|
reflect: true
|
|
@@ -22252,6 +21475,10 @@ class AuroButton extends LitElement {
|
|
|
22252
21475
|
type: String,
|
|
22253
21476
|
reflect: true
|
|
22254
21477
|
},
|
|
21478
|
+
ariaexpanded: {
|
|
21479
|
+
type: Boolean,
|
|
21480
|
+
reflect: true
|
|
21481
|
+
},
|
|
22255
21482
|
title: {
|
|
22256
21483
|
type: String,
|
|
22257
21484
|
reflect: true
|
|
@@ -22281,7 +21508,7 @@ class AuroButton extends LitElement {
|
|
|
22281
21508
|
*
|
|
22282
21509
|
*/
|
|
22283
21510
|
static register(name = "auro-button") {
|
|
22284
|
-
AuroLibraryRuntimeUtils$
|
|
21511
|
+
AuroLibraryRuntimeUtils$1.prototype.registerComponent(name, AuroButton);
|
|
22285
21512
|
}
|
|
22286
21513
|
|
|
22287
21514
|
/**
|
|
@@ -22323,12 +21550,22 @@ class AuroButton extends LitElement {
|
|
|
22323
21550
|
this.notifyReady();
|
|
22324
21551
|
}
|
|
22325
21552
|
|
|
21553
|
+
/**
|
|
21554
|
+
* Submits the form that this button is associated with.
|
|
21555
|
+
* @private
|
|
21556
|
+
* @returns {void}
|
|
21557
|
+
*/
|
|
22326
21558
|
surfaceSubmitEvent() {
|
|
22327
21559
|
if (this.form) {
|
|
22328
21560
|
this.form.requestSubmit();
|
|
22329
21561
|
}
|
|
22330
21562
|
}
|
|
22331
21563
|
|
|
21564
|
+
/**
|
|
21565
|
+
* Returns the form element that this button is associated with.
|
|
21566
|
+
* @private
|
|
21567
|
+
* @returns {HTMLFormElement|null}
|
|
21568
|
+
*/
|
|
22332
21569
|
get form() {
|
|
22333
21570
|
return this.internals ? this.internals.form : null;
|
|
22334
21571
|
}
|
|
@@ -22348,8 +21585,9 @@ class AuroButton extends LitElement {
|
|
|
22348
21585
|
return html$1`
|
|
22349
21586
|
<button
|
|
22350
21587
|
part="button"
|
|
22351
|
-
aria-label="${ifDefined(this.
|
|
21588
|
+
aria-label="${ifDefined(this.loading ? this.loadingText : this.arialabel || undefined)}"
|
|
22352
21589
|
aria-labelledby="${ifDefined(this.arialabelledby ? this.arialabelledby : undefined)}"
|
|
21590
|
+
aria-expanded="${ifDefined(this.ariaexpanded)}"
|
|
22353
21591
|
?autofocus="${this.autofocus}"
|
|
22354
21592
|
class="${classMap(classes)}"
|
|
22355
21593
|
?disabled="${this.disabled || this.loading}"
|
|
@@ -22377,13 +21615,13 @@ class AuroButton extends LitElement {
|
|
|
22377
21615
|
}
|
|
22378
21616
|
}
|
|
22379
21617
|
|
|
22380
|
-
var buttonVersion = '
|
|
21618
|
+
var buttonVersion = '9.3.0';
|
|
22381
21619
|
|
|
22382
|
-
var colorCss = css`:host([error]){--ds-auro-helptext-color: var(--ds-color-
|
|
21620
|
+
var colorCss = css`:host([error]){--ds-auro-helptext-color: var(--ds-basic-color-status-error, #e31f26)}:host([onDark]){--ds-auro-helptext-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db)}:host([onDark][error]){--ds-auro-helptext-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8)}.helptext-wrapper{color:var(--ds-auro-helptext-color)}`;
|
|
22383
21621
|
|
|
22384
21622
|
var styleCss = css`.helptext-wrapper{display:none;font-size:var(--ds-text-body-size-xs, 0.75rem);line-height:var(--ds-size-200, 1rem)}:host([large]) .helptext-wrapper{font-size:var(--ds-text-body-size-default, 1rem)}.helptext-wrapper[visible]{display:block}::slotted(*:not(:empty)){margin-top:var(--ds-size-50, 0.25rem);margin-bottom:0}::slotted(p){margin-block:0}`;
|
|
22385
21623
|
|
|
22386
|
-
var tokensCss = css`:host{--ds-auro-helptext-color: var(--ds-color-
|
|
21624
|
+
var tokensCss = css`:host{--ds-auro-helptext-color: var(--ds-basic-color-texticon-muted, #676767)}`;
|
|
22387
21625
|
|
|
22388
21626
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
22389
21627
|
// See LICENSE in the project root for license information.
|
|
@@ -22470,6 +21708,7 @@ class AuroHelpText extends LitElement {
|
|
|
22470
21708
|
super();
|
|
22471
21709
|
|
|
22472
21710
|
this.error = false;
|
|
21711
|
+
this.onDark = false;
|
|
22473
21712
|
this.hasTextContent = false;
|
|
22474
21713
|
|
|
22475
21714
|
AuroLibraryRuntimeUtils.prototype.handleComponentTagRename(this, 'auro-helptext');
|
|
@@ -22508,6 +21747,14 @@ class AuroHelpText extends LitElement {
|
|
|
22508
21747
|
type: Boolean,
|
|
22509
21748
|
reflect: true,
|
|
22510
21749
|
},
|
|
21750
|
+
|
|
21751
|
+
/**
|
|
21752
|
+
* If declared, will apply onDark styles.
|
|
21753
|
+
*/
|
|
21754
|
+
onDark: {
|
|
21755
|
+
type: Boolean,
|
|
21756
|
+
reflect: true
|
|
21757
|
+
}
|
|
22511
21758
|
};
|
|
22512
21759
|
}
|
|
22513
21760
|
|
|
@@ -22590,7 +21837,7 @@ class AuroInput extends BaseInput {
|
|
|
22590
21837
|
/**
|
|
22591
21838
|
* Generate unique names for dependency components.
|
|
22592
21839
|
*/
|
|
22593
|
-
const versioning = new AuroDependencyVersioning
|
|
21840
|
+
const versioning = new AuroDependencyVersioning();
|
|
22594
21841
|
|
|
22595
21842
|
/**
|
|
22596
21843
|
* @private
|
|
@@ -22617,7 +21864,7 @@ class AuroInput extends BaseInput {
|
|
|
22617
21864
|
*
|
|
22618
21865
|
*/
|
|
22619
21866
|
static register(name = "auro-input") {
|
|
22620
|
-
AuroLibraryRuntimeUtils$
|
|
21867
|
+
AuroLibraryRuntimeUtils$1.prototype.registerComponent(name, AuroInput);
|
|
22621
21868
|
}
|
|
22622
21869
|
|
|
22623
21870
|
/**
|
|
@@ -22657,7 +21904,8 @@ class AuroInput extends BaseInput {
|
|
|
22657
21904
|
category="payment"
|
|
22658
21905
|
name="${name}"
|
|
22659
21906
|
part="accentIcon"
|
|
22660
|
-
?
|
|
21907
|
+
?onDark="${this.onDark}"
|
|
21908
|
+
variant="${this.disabled ? 'disabled' : 'muted'}">
|
|
22661
21909
|
</${this.iconTag}>
|
|
22662
21910
|
`) : undefined
|
|
22663
21911
|
}
|
|
@@ -22669,7 +21917,8 @@ class AuroInput extends BaseInput {
|
|
|
22669
21917
|
category="interface"
|
|
22670
21918
|
name="calendar"
|
|
22671
21919
|
part="accentIcon"
|
|
22672
|
-
?
|
|
21920
|
+
?onDark="${this.onDark}"
|
|
21921
|
+
variant="${this.disabled ? 'disabled' : 'muted'}">
|
|
22673
21922
|
</${this.iconTag}>`
|
|
22674
21923
|
: undefined
|
|
22675
21924
|
}
|
|
@@ -22714,7 +21963,7 @@ class AuroInput extends BaseInput {
|
|
|
22714
21963
|
<${this.iconTag}
|
|
22715
21964
|
category="alert"
|
|
22716
21965
|
name="error-stroke"
|
|
22717
|
-
|
|
21966
|
+
customColor
|
|
22718
21967
|
</${this.iconTag}>
|
|
22719
21968
|
</div>
|
|
22720
21969
|
` : undefined}
|
|
@@ -22723,6 +21972,7 @@ class AuroInput extends BaseInput {
|
|
|
22723
21972
|
<div class="notification">
|
|
22724
21973
|
<${this.buttonTag}
|
|
22725
21974
|
variant="flat"
|
|
21975
|
+
?onDark="${this.onDark}"
|
|
22726
21976
|
aria-hidden="true"
|
|
22727
21977
|
tabindex="-1"
|
|
22728
21978
|
@click="${this.handleClickShowPassword}"
|
|
@@ -22746,6 +21996,7 @@ class AuroInput extends BaseInput {
|
|
|
22746
21996
|
<div class="notification">
|
|
22747
21997
|
<${this.buttonTag}
|
|
22748
21998
|
variant="flat"
|
|
21999
|
+
?onDark="${this.onDark}"
|
|
22749
22000
|
class="notificationBtn clearBtn"
|
|
22750
22001
|
aria-label="${i18n(this.lang, 'clearInput')}"
|
|
22751
22002
|
@click="${this.handleClickClear}">
|
|
@@ -22764,14 +22015,14 @@ class AuroInput extends BaseInput {
|
|
|
22764
22015
|
<!-- Help text and error message template -->
|
|
22765
22016
|
${!this.validity || this.validity === undefined || this.validity === 'valid'
|
|
22766
22017
|
? html$1`
|
|
22767
|
-
<${this.helpTextTag}>
|
|
22018
|
+
<${this.helpTextTag} ?onDark="${this.onDark}">
|
|
22768
22019
|
<p id="${this.uniqueId}" part="helpText">
|
|
22769
22020
|
<slot name="helptext">${this.getHelpText()}</slot>
|
|
22770
22021
|
</p>
|
|
22771
22022
|
</${this.helpTextTag}>
|
|
22772
22023
|
`
|
|
22773
22024
|
: html$1`
|
|
22774
|
-
<${this.helpTextTag} error>
|
|
22025
|
+
<${this.helpTextTag} error ?onDark="${this.onDark}">
|
|
22775
22026
|
<p id="${this.uniqueId}" role="alert" aria-live="assertive" part="helpText">
|
|
22776
22027
|
${this.errorMessage}
|
|
22777
22028
|
</p>
|
|
@@ -22836,7 +22087,9 @@ class AuroDatePicker extends LitElement {
|
|
|
22836
22087
|
|
|
22837
22088
|
this.disabled = false;
|
|
22838
22089
|
this.required = false;
|
|
22090
|
+
this.onDark = false;
|
|
22839
22091
|
this.range = false;
|
|
22092
|
+
this.stacked = false;
|
|
22840
22093
|
this.noValidate = false;
|
|
22841
22094
|
this.validity = undefined;
|
|
22842
22095
|
this.value = undefined;
|
|
@@ -22868,6 +22121,8 @@ class AuroDatePicker extends LitElement {
|
|
|
22868
22121
|
this.noFlip = false;
|
|
22869
22122
|
this.autoPlacement = false;
|
|
22870
22123
|
|
|
22124
|
+
this.largeFullscreenHeadline = false;
|
|
22125
|
+
|
|
22871
22126
|
/**
|
|
22872
22127
|
* @private
|
|
22873
22128
|
*/
|
|
@@ -22881,7 +22136,7 @@ class AuroDatePicker extends LitElement {
|
|
|
22881
22136
|
/**
|
|
22882
22137
|
* @private
|
|
22883
22138
|
*/
|
|
22884
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
22139
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$4();
|
|
22885
22140
|
|
|
22886
22141
|
/**
|
|
22887
22142
|
* @private
|
|
@@ -22891,7 +22146,7 @@ class AuroDatePicker extends LitElement {
|
|
|
22891
22146
|
/**
|
|
22892
22147
|
* Generate unique names for dependency components.
|
|
22893
22148
|
*/
|
|
22894
|
-
const versioning = new AuroDependencyVersioning$
|
|
22149
|
+
const versioning = new AuroDependencyVersioning$3();
|
|
22895
22150
|
|
|
22896
22151
|
/**
|
|
22897
22152
|
* @private
|
|
@@ -23033,7 +22288,8 @@ class AuroDatePicker extends LitElement {
|
|
|
23033
22288
|
* If set, disables auto-validation on blur.
|
|
23034
22289
|
*/
|
|
23035
22290
|
noValidate: {
|
|
23036
|
-
type: Boolean
|
|
22291
|
+
type: Boolean,
|
|
22292
|
+
reflect: true
|
|
23037
22293
|
},
|
|
23038
22294
|
|
|
23039
22295
|
/**
|
|
@@ -23045,6 +22301,14 @@ class AuroDatePicker extends LitElement {
|
|
|
23045
22301
|
reflect: true
|
|
23046
22302
|
},
|
|
23047
22303
|
|
|
22304
|
+
/**
|
|
22305
|
+
* If declared, onDark styles will be applied to the trigger.
|
|
22306
|
+
*/
|
|
22307
|
+
onDark: {
|
|
22308
|
+
type: Boolean,
|
|
22309
|
+
reflect: true
|
|
22310
|
+
},
|
|
22311
|
+
|
|
23048
22312
|
/**
|
|
23049
22313
|
* Position where the bib should appear relative to the trigger.
|
|
23050
22314
|
* Accepted values:
|
|
@@ -23159,7 +22423,7 @@ class AuroDatePicker extends LitElement {
|
|
|
23159
22423
|
*
|
|
23160
22424
|
*/
|
|
23161
22425
|
static register(name = "auro-datepicker") {
|
|
23162
|
-
AuroLibraryRuntimeUtils$
|
|
22426
|
+
AuroLibraryRuntimeUtils$4.prototype.registerComponent(name, AuroDatePicker);
|
|
23163
22427
|
}
|
|
23164
22428
|
|
|
23165
22429
|
/**
|
|
@@ -23793,6 +23057,7 @@ class AuroDatePicker extends LitElement {
|
|
|
23793
23057
|
fluid
|
|
23794
23058
|
bordered
|
|
23795
23059
|
rounded
|
|
23060
|
+
?onDark="${this.onDark}"
|
|
23796
23061
|
?disabled="${this.disabled}"
|
|
23797
23062
|
?error="${this.validity !== undefined && this.validity !== 'valid'}"
|
|
23798
23063
|
disableEventShow
|
|
@@ -23807,6 +23072,7 @@ class AuroDatePicker extends LitElement {
|
|
|
23807
23072
|
id="${this.generateRandomString(12)}"
|
|
23808
23073
|
bordered
|
|
23809
23074
|
class="dateFrom"
|
|
23075
|
+
?onDark="${this.onDark}"
|
|
23810
23076
|
?required="${this.required}"
|
|
23811
23077
|
noValidate
|
|
23812
23078
|
type="date"
|
|
@@ -23827,6 +23093,7 @@ class AuroDatePicker extends LitElement {
|
|
|
23827
23093
|
id="${this.generateRandomString(12)}"
|
|
23828
23094
|
bordered
|
|
23829
23095
|
class="dateTo"
|
|
23096
|
+
?onDark="${this.onDark}"
|
|
23830
23097
|
?required="${this.required}"
|
|
23831
23098
|
noValidate
|
|
23832
23099
|
type="date"
|