@aurodesignsystem/auro-formkit 2.2.1-beta.3 → 3.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +68 -0
- package/components/bibtemplate/dist/iconVersion.d.ts +1 -1
- package/components/bibtemplate/dist/index.js +18 -178
- package/components/bibtemplate/dist/registered.js +18 -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 +102 -1
- package/components/combobox/demo/api.min.js +238 -988
- package/components/combobox/demo/index.html +2 -4
- package/components/combobox/demo/index.md +32 -0
- package/components/combobox/demo/index.min.js +238 -988
- package/components/combobox/demo/readme.html +2 -1
- package/components/combobox/demo/readme.md +1 -1
- package/components/combobox/dist/auro-combobox.d.ts +8 -0
- package/components/combobox/dist/index.js +196 -786
- package/components/combobox/dist/registered.js +196 -786
- 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 +187 -785
- package/components/counter/demo/index.html +2 -1
- package/components/counter/demo/index.md +104 -8
- package/components/counter/demo/index.min.js +187 -785
- 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 +10 -2
- 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 +187 -785
- package/components/counter/dist/registered.js +187 -785
- package/components/datepicker/README.md +1 -1
- package/components/datepicker/demo/api.html +2 -4
- package/components/datepicker/demo/api.md +15 -14
- package/components/datepicker/demo/api.min.js +286 -1036
- package/components/datepicker/demo/index.html +2 -4
- package/components/datepicker/demo/index.md +38 -0
- package/components/datepicker/demo/index.min.js +286 -1036
- package/components/datepicker/demo/readme.html +2 -1
- package/components/datepicker/demo/readme.md +1 -1
- package/components/datepicker/dist/auro-datepicker.d.ts +8 -0
- package/components/datepicker/dist/index.js +286 -1036
- package/components/datepicker/dist/registered.js +286 -1036
- 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 +117 -402
- package/components/input/demo/index.html +2 -1
- package/components/input/demo/index.md +30 -0
- package/components/input/demo/index.min.js +103 -402
- package/components/input/demo/readme.html +2 -1
- package/components/input/demo/readme.md +1 -1
- package/components/input/dist/base-input.d.ts +8 -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 +103 -402
- package/components/input/dist/registered.js +103 -402
- 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 +116 -589
- package/components/select/demo/index.html +2 -1
- package/components/select/demo/index.md +100 -0
- package/components/select/demo/index.min.js +116 -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 +91 -391
- package/components/select/dist/registered.js +91 -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
|
|
|
@@ -10292,9 +10292,9 @@ class CalendarUtilities {
|
|
|
10292
10292
|
|
|
10293
10293
|
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
10294
|
|
|
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,
|
|
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, 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
10296
|
|
|
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-
|
|
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-basic-color-surface-default, #ffffff)}`;
|
|
10298
10298
|
|
|
10299
10299
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
10300
10300
|
// See LICENSE in the project root for license information.
|
|
@@ -10303,7 +10303,7 @@ var tokenCss = css`:host{--ds-auro-dropdownbib-header-boxshadow-color: var(--ds-
|
|
|
10303
10303
|
|
|
10304
10304
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
10305
10305
|
|
|
10306
|
-
let AuroLibraryRuntimeUtils$
|
|
10306
|
+
let AuroLibraryRuntimeUtils$1$2 = class AuroLibraryRuntimeUtils {
|
|
10307
10307
|
|
|
10308
10308
|
/* eslint-disable jsdoc/require-param */
|
|
10309
10309
|
|
|
@@ -10370,7 +10370,7 @@ let AuroLibraryRuntimeUtils$2$2 = class AuroLibraryRuntimeUtils {
|
|
|
10370
10370
|
// See LICENSE in the project root for license information.
|
|
10371
10371
|
|
|
10372
10372
|
|
|
10373
|
-
let AuroDependencyVersioning$
|
|
10373
|
+
let AuroDependencyVersioning$2 = class AuroDependencyVersioning {
|
|
10374
10374
|
|
|
10375
10375
|
/**
|
|
10376
10376
|
* Generates a unique string to be used for child auro element naming.
|
|
@@ -10472,7 +10472,7 @@ const cacheFetch$2 = (uri, options = {}) => {
|
|
|
10472
10472
|
return _fetchMap$2.get(uri);
|
|
10473
10473
|
};
|
|
10474
10474
|
|
|
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}
|
|
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}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
10476
|
|
|
10477
10477
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
10478
10478
|
// See LICENSE in the project root for license information.
|
|
@@ -10480,7 +10480,6 @@ var styleCss$1$2 = css`:focus:not(:focus-visible){outline:3px solid transparent}
|
|
|
10480
10480
|
|
|
10481
10481
|
// See https://git.io/JJ6SJ for "How to document your components using JSDoc"
|
|
10482
10482
|
/**
|
|
10483
|
-
* @attr {Boolean} onDark - Set value for on-dark version of auro-icon
|
|
10484
10483
|
* @slot - Hidden from visibility, used for a11y if icon description is needed
|
|
10485
10484
|
*/
|
|
10486
10485
|
|
|
@@ -10495,6 +10494,10 @@ let BaseIcon$2 = class BaseIcon extends AuroElement$2 {
|
|
|
10495
10494
|
static get properties() {
|
|
10496
10495
|
return {
|
|
10497
10496
|
...super.properties,
|
|
10497
|
+
|
|
10498
|
+
/**
|
|
10499
|
+
* Set value for on-dark version of auro-icon.
|
|
10500
|
+
*/
|
|
10498
10501
|
onDark: {
|
|
10499
10502
|
type: Boolean,
|
|
10500
10503
|
reflect: true
|
|
@@ -10553,81 +10556,11 @@ let BaseIcon$2 = class BaseIcon extends AuroElement$2 {
|
|
|
10553
10556
|
}
|
|
10554
10557
|
};
|
|
10555
10558
|
|
|
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();
|
|
10559
|
+
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
10560
|
|
|
10626
|
-
|
|
10627
|
-
}
|
|
10628
|
-
};
|
|
10561
|
+
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
10562
|
|
|
10630
|
-
// Copyright (c)
|
|
10563
|
+
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
10631
10564
|
// See LICENSE in the project root for license information.
|
|
10632
10565
|
|
|
10633
10566
|
|
|
@@ -10635,6 +10568,7 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
|
|
|
10635
10568
|
constructor() {
|
|
10636
10569
|
super();
|
|
10637
10570
|
|
|
10571
|
+
this.variant = undefined;
|
|
10638
10572
|
this.privateDefaults();
|
|
10639
10573
|
}
|
|
10640
10574
|
|
|
@@ -10644,20 +10578,6 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
|
|
|
10644
10578
|
* @returns {void}
|
|
10645
10579
|
*/
|
|
10646
10580
|
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
10581
|
this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
|
|
10662
10582
|
this.runtimeUtils = new AuroLibraryRuntimeUtils$1$2();
|
|
10663
10583
|
}
|
|
@@ -10667,14 +10587,6 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
|
|
|
10667
10587
|
return {
|
|
10668
10588
|
...super.properties,
|
|
10669
10589
|
|
|
10670
|
-
/**
|
|
10671
|
-
* Sets the icon to use the accent style.
|
|
10672
|
-
*/
|
|
10673
|
-
accent: {
|
|
10674
|
-
type: Boolean,
|
|
10675
|
-
reflect: true
|
|
10676
|
-
},
|
|
10677
|
-
|
|
10678
10590
|
/**
|
|
10679
10591
|
* Set aria-hidden value. Default is `true`. Option is `false`.
|
|
10680
10592
|
*/
|
|
@@ -10705,38 +10617,6 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
|
|
|
10705
10617
|
type: Boolean
|
|
10706
10618
|
},
|
|
10707
10619
|
|
|
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
10620
|
/**
|
|
10741
10621
|
* Exposes content in slot as icon label.
|
|
10742
10622
|
*/
|
|
@@ -10754,50 +10634,10 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
|
|
|
10754
10634
|
},
|
|
10755
10635
|
|
|
10756
10636
|
/**
|
|
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.
|
|
10637
|
+
* 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
10638
|
*/
|
|
10799
|
-
|
|
10800
|
-
type:
|
|
10639
|
+
variant: {
|
|
10640
|
+
type: String,
|
|
10801
10641
|
reflect: true
|
|
10802
10642
|
}
|
|
10803
10643
|
};
|
|
@@ -10887,7 +10727,7 @@ let AuroIcon$2 = class AuroIcon extends BaseIcon$2 {
|
|
|
10887
10727
|
}
|
|
10888
10728
|
};
|
|
10889
10729
|
|
|
10890
|
-
var iconVersion$2 = '
|
|
10730
|
+
var iconVersion$2 = '8.0.1';
|
|
10891
10731
|
|
|
10892
10732
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
10893
10733
|
// See LICENSE in the project root for license information.
|
|
@@ -10896,7 +10736,7 @@ var iconVersion$2 = '7.0.1';
|
|
|
10896
10736
|
|
|
10897
10737
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
10898
10738
|
|
|
10899
|
-
let AuroLibraryRuntimeUtils$
|
|
10739
|
+
let AuroLibraryRuntimeUtils$3 = class AuroLibraryRuntimeUtils {
|
|
10900
10740
|
|
|
10901
10741
|
/* eslint-disable jsdoc/require-param */
|
|
10902
10742
|
|
|
@@ -10988,7 +10828,7 @@ class AuroHeader extends LitElement {
|
|
|
10988
10828
|
/**
|
|
10989
10829
|
* @private
|
|
10990
10830
|
*/
|
|
10991
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
10831
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$3();
|
|
10992
10832
|
}
|
|
10993
10833
|
|
|
10994
10834
|
// function to define props used within the scope of this component
|
|
@@ -11018,7 +10858,7 @@ class AuroHeader extends LitElement {
|
|
|
11018
10858
|
*
|
|
11019
10859
|
*/
|
|
11020
10860
|
static register(name = "auro-header") {
|
|
11021
|
-
AuroLibraryRuntimeUtils$
|
|
10861
|
+
AuroLibraryRuntimeUtils$3.prototype.registerComponent(name, AuroHeader);
|
|
11022
10862
|
}
|
|
11023
10863
|
|
|
11024
10864
|
firstUpdated() {
|
|
@@ -11112,9 +10952,9 @@ class AuroBibtemplate extends LitElement {
|
|
|
11112
10952
|
constructor() {
|
|
11113
10953
|
super();
|
|
11114
10954
|
|
|
11115
|
-
AuroLibraryRuntimeUtils$
|
|
10955
|
+
AuroLibraryRuntimeUtils$1$2.prototype.handleComponentTagRename(this, 'auro-bibtemplate');
|
|
11116
10956
|
|
|
11117
|
-
const versioning = new AuroDependencyVersioning$
|
|
10957
|
+
const versioning = new AuroDependencyVersioning$2();
|
|
11118
10958
|
this.iconTag = versioning.generateTag('auro-formkit-bibtemplate-icon', iconVersion$2, AuroIcon$2);
|
|
11119
10959
|
this.headerTag = versioning.generateTag('auro-formkit-bibtemplate-header', headerVersion, AuroHeader);
|
|
11120
10960
|
}
|
|
@@ -11151,7 +10991,7 @@ class AuroBibtemplate extends LitElement {
|
|
|
11151
10991
|
*
|
|
11152
10992
|
*/
|
|
11153
10993
|
static register(name = "auro-bibtemplate") {
|
|
11154
|
-
AuroLibraryRuntimeUtils$
|
|
10994
|
+
AuroLibraryRuntimeUtils$1$2.prototype.registerComponent(name, AuroBibtemplate);
|
|
11155
10995
|
}
|
|
11156
10996
|
|
|
11157
10997
|
/**
|
|
@@ -11223,267 +11063,84 @@ class AuroBibtemplate extends LitElement {
|
|
|
11223
11063
|
|
|
11224
11064
|
var bibTemplateVersion = '1.0.0';
|
|
11225
11065
|
|
|
11226
|
-
|
|
11227
|
-
// See LICENSE in the project root for license information.
|
|
11228
|
-
|
|
11066
|
+
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
11067
|
|
|
11230
|
-
|
|
11068
|
+
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
11069
|
|
|
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;
|
|
11070
|
+
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
11071
|
|
|
11242
|
-
|
|
11243
|
-
result += version.replace(/[.]/g, '_');
|
|
11072
|
+
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
11073
|
|
|
11245
|
-
|
|
11246
|
-
}
|
|
11074
|
+
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
11075
|
|
|
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)}`;
|
|
11076
|
+
var tokensCss$6 = css`:host{--ds-auro-loader-background-color:currentcolor;--ds-auro-loader-border-color:currentcolor;--ds-auro-loader-color:currentcolor}`;
|
|
11257
11077
|
|
|
11258
|
-
|
|
11259
|
-
|
|
11260
|
-
}
|
|
11078
|
+
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
11079
|
+
// See LICENSE in the project root for license information.
|
|
11261
11080
|
|
|
11262
|
-
return tag;
|
|
11263
|
-
}
|
|
11264
|
-
};
|
|
11265
11081
|
|
|
11266
|
-
|
|
11267
|
-
|
|
11082
|
+
let AuroLoader$1 = class AuroLoader extends LitElement {
|
|
11083
|
+
constructor() {
|
|
11084
|
+
super();
|
|
11268
11085
|
|
|
11269
|
-
|
|
11086
|
+
/**
|
|
11087
|
+
* @private
|
|
11088
|
+
*/
|
|
11089
|
+
this.keys = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
|
|
11270
11090
|
|
|
11271
|
-
|
|
11091
|
+
/**
|
|
11092
|
+
* @private
|
|
11093
|
+
*/
|
|
11094
|
+
this.mdCount = 3;
|
|
11272
11095
|
|
|
11273
|
-
|
|
11096
|
+
/**
|
|
11097
|
+
* @private
|
|
11098
|
+
*/
|
|
11099
|
+
this.smCount = 2;
|
|
11274
11100
|
|
|
11275
|
-
|
|
11101
|
+
/**
|
|
11102
|
+
* @private
|
|
11103
|
+
*/
|
|
11104
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$4();
|
|
11276
11105
|
|
|
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
|
-
}
|
|
11106
|
+
this.orbit = false;
|
|
11107
|
+
this.ringworm = false;
|
|
11108
|
+
this.laser = false;
|
|
11109
|
+
this.pulse = false;
|
|
11287
11110
|
}
|
|
11288
11111
|
|
|
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 */
|
|
11112
|
+
// function to define props used within the scope of this component
|
|
11113
|
+
static get properties() {
|
|
11114
|
+
return {
|
|
11306
11115
|
|
|
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: {
|
|
11116
|
+
/**
|
|
11117
|
+
* Sets loader to laser type.
|
|
11118
|
+
*/
|
|
11119
|
+
laser: {
|
|
11475
11120
|
type: Boolean,
|
|
11476
11121
|
reflect: true
|
|
11477
11122
|
},
|
|
11123
|
+
|
|
11124
|
+
/**
|
|
11125
|
+
* Sets loader to orbit type.
|
|
11126
|
+
*/
|
|
11478
11127
|
orbit: {
|
|
11479
11128
|
type: Boolean,
|
|
11480
11129
|
reflect: true
|
|
11481
11130
|
},
|
|
11482
|
-
|
|
11131
|
+
|
|
11132
|
+
/**
|
|
11133
|
+
* Sets loader to pulse type.
|
|
11134
|
+
*/
|
|
11135
|
+
pulse: {
|
|
11483
11136
|
type: Boolean,
|
|
11484
11137
|
reflect: true
|
|
11485
11138
|
},
|
|
11486
|
-
|
|
11139
|
+
|
|
11140
|
+
/**
|
|
11141
|
+
* Sets loader to ringworm type.
|
|
11142
|
+
*/
|
|
11143
|
+
ringworm: {
|
|
11487
11144
|
type: Boolean,
|
|
11488
11145
|
reflect: true
|
|
11489
11146
|
}
|
|
@@ -11507,7 +11164,7 @@ let AuroLoader$1 = class AuroLoader extends LitElement {
|
|
|
11507
11164
|
*
|
|
11508
11165
|
*/
|
|
11509
11166
|
static register(name = "auro-loader") {
|
|
11510
|
-
AuroLibraryRuntimeUtils$
|
|
11167
|
+
AuroLibraryRuntimeUtils$4.prototype.registerComponent(name, AuroLoader);
|
|
11511
11168
|
}
|
|
11512
11169
|
|
|
11513
11170
|
firstUpdated() {
|
|
@@ -11557,23 +11214,26 @@ let AuroLoader$1 = class AuroLoader extends LitElement {
|
|
|
11557
11214
|
}
|
|
11558
11215
|
};
|
|
11559
11216
|
|
|
11560
|
-
var loaderVersion$1 = '
|
|
11217
|
+
var loaderVersion$1 = '5.0.0';
|
|
11561
11218
|
|
|
11219
|
+
/* eslint-disable max-lines */
|
|
11562
11220
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
11563
11221
|
// See LICENSE in the project root for license information.
|
|
11564
11222
|
|
|
11565
11223
|
|
|
11566
11224
|
/**
|
|
11567
11225
|
* @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
|
|
11226
|
+
* @attr {Boolean} disabled - If set to true, button will become disabled and not allow for interactions
|
|
11569
11227
|
* @attr {Boolean} iconOnly - If set to true, the button will contain an icon with no additional content
|
|
11570
11228
|
* @attr {Boolean} loading - If set to true button text will be replaced with `auro-loader` and become disabled
|
|
11229
|
+
* @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
11230
|
* @attr {Boolean} onDark - Set value for on-dark version of auro-button
|
|
11572
11231
|
* @attr {Boolean} rounded - If set to true, the button will have a rounded shape
|
|
11573
11232
|
* @attr {Boolean} slim - Set value for slim version of auro-button
|
|
11574
11233
|
* @attr {Boolean} fluid - Alters the shape of the button to be full width of its parent container
|
|
11575
11234
|
* @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
11235
|
* @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.
|
|
11236
|
+
* @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
11237
|
* @attr {String} id - Set the unique ID of an element.
|
|
11578
11238
|
* @attr {String} title - Sets title attribute. The information is most often shown as a tooltip text when the mouse moves over the element.
|
|
11579
11239
|
* @attr {String} type - The type of the button. Possible values are: `submit`, `reset`, `button`
|
|
@@ -11618,6 +11278,7 @@ let AuroButton$1 = class AuroButton extends LitElement {
|
|
|
11618
11278
|
this.rounded = false;
|
|
11619
11279
|
this.slim = false;
|
|
11620
11280
|
this.fluid = false;
|
|
11281
|
+
this.loadingText = this.loadingText || 'Loading...';
|
|
11621
11282
|
|
|
11622
11283
|
// Support for HTML5 forms
|
|
11623
11284
|
if (typeof this.attachInternals === 'function') {
|
|
@@ -11678,6 +11339,9 @@ let AuroButton$1 = class AuroButton extends LitElement {
|
|
|
11678
11339
|
type: Boolean,
|
|
11679
11340
|
reflect: true
|
|
11680
11341
|
},
|
|
11342
|
+
loadingText: {
|
|
11343
|
+
type: String
|
|
11344
|
+
},
|
|
11681
11345
|
onDark: {
|
|
11682
11346
|
type: Boolean,
|
|
11683
11347
|
reflect: true
|
|
@@ -11698,6 +11362,10 @@ let AuroButton$1 = class AuroButton extends LitElement {
|
|
|
11698
11362
|
type: String,
|
|
11699
11363
|
reflect: true
|
|
11700
11364
|
},
|
|
11365
|
+
ariaexpanded: {
|
|
11366
|
+
type: Boolean,
|
|
11367
|
+
reflect: true
|
|
11368
|
+
},
|
|
11701
11369
|
title: {
|
|
11702
11370
|
type: String,
|
|
11703
11371
|
reflect: true
|
|
@@ -11727,7 +11395,7 @@ let AuroButton$1 = class AuroButton extends LitElement {
|
|
|
11727
11395
|
*
|
|
11728
11396
|
*/
|
|
11729
11397
|
static register(name = "auro-button") {
|
|
11730
|
-
AuroLibraryRuntimeUtils$
|
|
11398
|
+
AuroLibraryRuntimeUtils$4.prototype.registerComponent(name, AuroButton);
|
|
11731
11399
|
}
|
|
11732
11400
|
|
|
11733
11401
|
/**
|
|
@@ -11769,12 +11437,22 @@ let AuroButton$1 = class AuroButton extends LitElement {
|
|
|
11769
11437
|
this.notifyReady();
|
|
11770
11438
|
}
|
|
11771
11439
|
|
|
11440
|
+
/**
|
|
11441
|
+
* Submits the form that this button is associated with.
|
|
11442
|
+
* @private
|
|
11443
|
+
* @returns {void}
|
|
11444
|
+
*/
|
|
11772
11445
|
surfaceSubmitEvent() {
|
|
11773
11446
|
if (this.form) {
|
|
11774
11447
|
this.form.requestSubmit();
|
|
11775
11448
|
}
|
|
11776
11449
|
}
|
|
11777
11450
|
|
|
11451
|
+
/**
|
|
11452
|
+
* Returns the form element that this button is associated with.
|
|
11453
|
+
* @private
|
|
11454
|
+
* @returns {HTMLFormElement|null}
|
|
11455
|
+
*/
|
|
11778
11456
|
get form() {
|
|
11779
11457
|
return this.internals ? this.internals.form : null;
|
|
11780
11458
|
}
|
|
@@ -11794,8 +11472,9 @@ let AuroButton$1 = class AuroButton extends LitElement {
|
|
|
11794
11472
|
return html$1`
|
|
11795
11473
|
<button
|
|
11796
11474
|
part="button"
|
|
11797
|
-
aria-label="${ifDefined(this.
|
|
11475
|
+
aria-label="${ifDefined(this.loading ? this.loadingText : this.arialabel || undefined)}"
|
|
11798
11476
|
aria-labelledby="${ifDefined(this.arialabelledby ? this.arialabelledby : undefined)}"
|
|
11477
|
+
aria-expanded="${ifDefined(this.ariaexpanded)}"
|
|
11799
11478
|
?autofocus="${this.autofocus}"
|
|
11800
11479
|
class="${classMap(classes)}"
|
|
11801
11480
|
?disabled="${this.disabled || this.loading}"
|
|
@@ -11894,7 +11573,7 @@ class AuroCalendar extends RangeDatepicker {
|
|
|
11894
11573
|
*/
|
|
11895
11574
|
this.slots = {};
|
|
11896
11575
|
|
|
11897
|
-
const versioning = new AuroDependencyVersioning$
|
|
11576
|
+
const versioning = new AuroDependencyVersioning$3();
|
|
11898
11577
|
|
|
11899
11578
|
/**
|
|
11900
11579
|
* @private
|
|
@@ -12186,7 +11865,7 @@ if (!customElements.get('auro-formkit-calendar')) {
|
|
|
12186
11865
|
|
|
12187
11866
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
12188
11867
|
|
|
12189
|
-
let AuroLibraryRuntimeUtils$
|
|
11868
|
+
let AuroLibraryRuntimeUtils$1$1 = class AuroLibraryRuntimeUtils {
|
|
12190
11869
|
|
|
12191
11870
|
/* eslint-disable jsdoc/require-param */
|
|
12192
11871
|
|
|
@@ -14385,7 +14064,7 @@ class AuroFloatingUI {
|
|
|
14385
14064
|
// See LICENSE in the project root for license information.
|
|
14386
14065
|
|
|
14387
14066
|
|
|
14388
|
-
let AuroDependencyVersioning$
|
|
14067
|
+
let AuroDependencyVersioning$1 = class AuroDependencyVersioning {
|
|
14389
14068
|
|
|
14390
14069
|
/**
|
|
14391
14070
|
* Generates a unique string to be used for child auro element naming.
|
|
@@ -14487,7 +14166,7 @@ const cacheFetch$1 = (uri, options = {}) => {
|
|
|
14487
14166
|
return _fetchMap$1.get(uri);
|
|
14488
14167
|
};
|
|
14489
14168
|
|
|
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}
|
|
14169
|
+
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
14170
|
|
|
14492
14171
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
14493
14172
|
// See LICENSE in the project root for license information.
|
|
@@ -14495,7 +14174,6 @@ var styleCss$3$1 = css`:focus:not(:focus-visible){outline:3px solid transparent}
|
|
|
14495
14174
|
|
|
14496
14175
|
// See https://git.io/JJ6SJ for "How to document your components using JSDoc"
|
|
14497
14176
|
/**
|
|
14498
|
-
* @attr {Boolean} onDark - Set value for on-dark version of auro-icon
|
|
14499
14177
|
* @slot - Hidden from visibility, used for a11y if icon description is needed
|
|
14500
14178
|
*/
|
|
14501
14179
|
|
|
@@ -14510,6 +14188,10 @@ let BaseIcon$1 = class BaseIcon extends AuroElement$1 {
|
|
|
14510
14188
|
static get properties() {
|
|
14511
14189
|
return {
|
|
14512
14190
|
...super.properties,
|
|
14191
|
+
|
|
14192
|
+
/**
|
|
14193
|
+
* Set value for on-dark version of auro-icon.
|
|
14194
|
+
*/
|
|
14513
14195
|
onDark: {
|
|
14514
14196
|
type: Boolean,
|
|
14515
14197
|
reflect: true
|
|
@@ -14568,81 +14250,11 @@ let BaseIcon$1 = class BaseIcon extends AuroElement$1 {
|
|
|
14568
14250
|
}
|
|
14569
14251
|
};
|
|
14570
14252
|
|
|
14571
|
-
var tokensCss$2$1 = css`:host{--ds-auro-icon-color:var(--ds-color-
|
|
14572
|
-
|
|
14573
|
-
var colorCss$3$1 = css`:host{color:var(--ds-auro-icon-color)}:host([customColor]){color:inherit}:host(:not([onDark])[accent]){--ds-auro-icon-color:var(--ds-color-icon-accent-default, #a2c270)}:host(:not([onDark])[disabled]){--ds-auro-icon-color:var(--ds-color-icon-ui-primary-disabled-default, #adadad)}:host(:not([onDark])[emphasis]){--ds-auro-icon-color:var(--ds-color-icon-emphasis-default, #2a2a2a)}:host(:not([onDark])[error]){--ds-auro-icon-color:var(--ds-color-icon-error-default, #cc1816)}:host(:not([onDark])[info]){--ds-auro-icon-color:var(--ds-color-icon-info-default, #326aa5)}:host(:not([onDark])[secondary]){--ds-auro-icon-color:var(--ds-color-icon-secondary-default, #7e8894)}:host(:not([onDark])[subtle]){--ds-auro-icon-color:var(--ds-color-icon-subtle-default, #a0c9f1)}:host(:not([onDark])[success]){--ds-auro-icon-color:var(--ds-color-icon-success-default, #40a080)}:host(:not([onDark])[tertiary]){--ds-auro-icon-color:var(--ds-color-icon-tertiary-default, #afb9c6)}:host(:not([onDark])[warning]){--ds-auro-icon-color:var(--ds-color-icon-warning-default, #c49432)}:host([onDark]){--ds-auro-icon-color:var(--ds-color-icon-primary-inverse, #f7f7f7)}:host([onDark][accent]){--ds-auro-icon-color:var(--ds-color-icon-accent-inverse, #badd81)}:host([onDark][disabled]){--ds-auro-icon-color:var(--ds-color-icon-ui-primary-disabled-inverse, #7e7e7e)}:host([onDark][emphasis]){--ds-auro-icon-color:var(--ds-color-icon-emphasis-inverse, #ffffff)}:host([onDark][error]){--ds-auro-icon-color:var(--ds-color-icon-error-inverse, #f9aca6)}:host([onDark][info]){--ds-auro-icon-color:var(--ds-color-icon-info-inverse, #89b2d4)}:host([onDark][secondary]){--ds-auro-icon-color:var(--ds-color-icon-secondary-inverse, #ccd2db)}:host([onDark][subtle]){--ds-auro-icon-color:var(--ds-color-icon-subtle-inverse, #326aa5)}:host([onDark][success]){--ds-auro-icon-color:var(--ds-color-icon-success-inverse, #8eceb9)}:host([onDark][tertiary]){--ds-auro-icon-color:var(--ds-color-icon-tertiary-inverse, #939fad)}:host([onDark][warning]){--ds-auro-icon-color:var(--ds-color-icon-warning-inverse, #f2c153)}`;
|
|
14574
|
-
|
|
14575
|
-
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
14576
|
-
// See LICENSE in the project root for license information.
|
|
14577
|
-
|
|
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
|
-
|
|
14584
|
-
/* eslint-disable jsdoc/require-param */
|
|
14585
|
-
|
|
14586
|
-
/**
|
|
14587
|
-
* This will register a new custom element with the browser.
|
|
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
|
-
}
|
|
14596
|
-
}
|
|
14597
|
-
|
|
14598
|
-
/**
|
|
14599
|
-
* Finds and returns the closest HTML Element based on a selector.
|
|
14600
|
-
* @returns {void}
|
|
14601
|
-
*/
|
|
14602
|
-
closestElement(
|
|
14603
|
-
selector, // selector like in .closest()
|
|
14604
|
-
base = this, // extra functionality to skip a parent
|
|
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);
|
|
14613
|
-
}
|
|
14614
|
-
/* eslint-enable jsdoc/require-param */
|
|
14615
|
-
|
|
14616
|
-
/**
|
|
14617
|
-
* 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.
|
|
14618
|
-
* @param {Object} elem - The element to check.
|
|
14619
|
-
* @param {String} tagName - The name of the Auro component to check for or add as an attribute.
|
|
14620
|
-
* @returns {void}
|
|
14621
|
-
*/
|
|
14622
|
-
handleComponentTagRename(elem, tagName) {
|
|
14623
|
-
const tag = tagName.toLowerCase();
|
|
14624
|
-
const elemTag = elem.tagName.toLowerCase();
|
|
14625
|
-
|
|
14626
|
-
if (elemTag !== tag) {
|
|
14627
|
-
elem.setAttribute(tag, true);
|
|
14628
|
-
}
|
|
14629
|
-
}
|
|
14630
|
-
|
|
14631
|
-
/**
|
|
14632
|
-
* Validates if an element is a specific Auro component.
|
|
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();
|
|
14253
|
+
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)}`;
|
|
14640
14254
|
|
|
14641
|
-
|
|
14642
|
-
}
|
|
14643
|
-
};
|
|
14255
|
+
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)}`;
|
|
14644
14256
|
|
|
14645
|
-
// Copyright (c)
|
|
14257
|
+
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
14646
14258
|
// See LICENSE in the project root for license information.
|
|
14647
14259
|
|
|
14648
14260
|
|
|
@@ -14650,6 +14262,7 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
|
14650
14262
|
constructor() {
|
|
14651
14263
|
super();
|
|
14652
14264
|
|
|
14265
|
+
this.variant = undefined;
|
|
14653
14266
|
this.privateDefaults();
|
|
14654
14267
|
}
|
|
14655
14268
|
|
|
@@ -14659,20 +14272,6 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
|
14659
14272
|
* @returns {void}
|
|
14660
14273
|
*/
|
|
14661
14274
|
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
14275
|
this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
|
|
14677
14276
|
this.runtimeUtils = new AuroLibraryRuntimeUtils$1$1();
|
|
14678
14277
|
}
|
|
@@ -14683,18 +14282,10 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
|
14683
14282
|
...super.properties,
|
|
14684
14283
|
|
|
14685
14284
|
/**
|
|
14686
|
-
*
|
|
14285
|
+
* Set aria-hidden value. Default is `true`. Option is `false`.
|
|
14687
14286
|
*/
|
|
14688
|
-
|
|
14689
|
-
type:
|
|
14690
|
-
reflect: true
|
|
14691
|
-
},
|
|
14692
|
-
|
|
14693
|
-
/**
|
|
14694
|
-
* Set aria-hidden value. Default is `true`. Option is `false`.
|
|
14695
|
-
*/
|
|
14696
|
-
ariaHidden: {
|
|
14697
|
-
type: String,
|
|
14287
|
+
ariaHidden: {
|
|
14288
|
+
type: String,
|
|
14698
14289
|
reflect: true
|
|
14699
14290
|
},
|
|
14700
14291
|
|
|
@@ -14720,38 +14311,6 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
|
14720
14311
|
type: Boolean
|
|
14721
14312
|
},
|
|
14722
14313
|
|
|
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
14314
|
/**
|
|
14756
14315
|
* Exposes content in slot as icon label.
|
|
14757
14316
|
*/
|
|
@@ -14769,50 +14328,10 @@ let AuroIcon$1 = class AuroIcon extends BaseIcon$1 {
|
|
|
14769
14328
|
},
|
|
14770
14329
|
|
|
14771
14330
|
/**
|
|
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.
|
|
14331
|
+
* 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
14332
|
*/
|
|
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,
|
|
14333
|
+
variant: {
|
|
14334
|
+
type: String,
|
|
14816
14335
|
reflect: true
|
|
14817
14336
|
}
|
|
14818
14337
|
};
|
|
@@ -14908,7 +14427,7 @@ var styleCss$2$1 = css`:host{position:absolute;z-index:var(--depth-tooltip, 400)
|
|
|
14908
14427
|
|
|
14909
14428
|
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
14429
|
|
|
14911
|
-
var tokensCss$1$1 = css`:host{--ds-auro-dropdown-label-text-color: var(--ds-
|
|
14430
|
+
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
14431
|
|
|
14913
14432
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
14914
14433
|
// See LICENSE in the project root for license information.
|
|
@@ -14938,7 +14457,7 @@ class AuroDropdownBib extends LitElement {
|
|
|
14938
14457
|
*/
|
|
14939
14458
|
this._mobileBreakpointValue = undefined;
|
|
14940
14459
|
|
|
14941
|
-
AuroLibraryRuntimeUtils$
|
|
14460
|
+
AuroLibraryRuntimeUtils$1$1.prototype.handleComponentTagRename(this, 'auro-dropdownbib');
|
|
14942
14461
|
}
|
|
14943
14462
|
|
|
14944
14463
|
static get styles() {
|
|
@@ -15031,13 +14550,13 @@ var dropdownVersion$1 = '3.0.0';
|
|
|
15031
14550
|
|
|
15032
14551
|
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
14552
|
|
|
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-
|
|
14553
|
+
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
14554
|
|
|
15036
|
-
var colorCss$5 = css`:host([error]){--ds-auro-helptext-color: var(--ds-color-
|
|
14555
|
+
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
14556
|
|
|
15038
14557
|
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
14558
|
|
|
15040
|
-
var tokensCss$5 = css`:host{--ds-auro-helptext-color: var(--ds-color-
|
|
14559
|
+
var tokensCss$5 = css`:host{--ds-auro-helptext-color: var(--ds-basic-color-texticon-muted, #676767)}`;
|
|
15041
14560
|
|
|
15042
14561
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
15043
14562
|
// See LICENSE in the project root for license information.
|
|
@@ -15046,7 +14565,7 @@ var tokensCss$5 = css`:host{--ds-auro-helptext-color: var(--ds-color-text-tertia
|
|
|
15046
14565
|
|
|
15047
14566
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
15048
14567
|
|
|
15049
|
-
let AuroLibraryRuntimeUtils$
|
|
14568
|
+
let AuroLibraryRuntimeUtils$2 = class AuroLibraryRuntimeUtils {
|
|
15050
14569
|
|
|
15051
14570
|
/* eslint-disable jsdoc/require-param */
|
|
15052
14571
|
|
|
@@ -15124,9 +14643,10 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
|
|
|
15124
14643
|
super();
|
|
15125
14644
|
|
|
15126
14645
|
this.error = false;
|
|
14646
|
+
this.onDark = false;
|
|
15127
14647
|
this.hasTextContent = false;
|
|
15128
14648
|
|
|
15129
|
-
AuroLibraryRuntimeUtils$
|
|
14649
|
+
AuroLibraryRuntimeUtils$2.prototype.handleComponentTagRename(this, 'auro-helptext');
|
|
15130
14650
|
}
|
|
15131
14651
|
|
|
15132
14652
|
static get styles() {
|
|
@@ -15162,6 +14682,14 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
|
|
|
15162
14682
|
type: Boolean,
|
|
15163
14683
|
reflect: true,
|
|
15164
14684
|
},
|
|
14685
|
+
|
|
14686
|
+
/**
|
|
14687
|
+
* If declared, will apply onDark styles.
|
|
14688
|
+
*/
|
|
14689
|
+
onDark: {
|
|
14690
|
+
type: Boolean,
|
|
14691
|
+
reflect: true
|
|
14692
|
+
}
|
|
15165
14693
|
};
|
|
15166
14694
|
}
|
|
15167
14695
|
|
|
@@ -15174,7 +14702,7 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
|
|
|
15174
14702
|
*
|
|
15175
14703
|
*/
|
|
15176
14704
|
static register(name = "auro-helptext") {
|
|
15177
|
-
AuroLibraryRuntimeUtils$
|
|
14705
|
+
AuroLibraryRuntimeUtils$2.prototype.registerComponent(name, AuroHelpText);
|
|
15178
14706
|
}
|
|
15179
14707
|
|
|
15180
14708
|
updated() {
|
|
@@ -15293,6 +14821,7 @@ class AuroDropdown extends LitElement {
|
|
|
15293
14821
|
this.tabIndex = 0;
|
|
15294
14822
|
this.noToggle = false;
|
|
15295
14823
|
this.labeled = true;
|
|
14824
|
+
this.onDark = false;
|
|
15296
14825
|
|
|
15297
14826
|
// floaterConfig
|
|
15298
14827
|
this.placement = 'bottom-start';
|
|
@@ -15313,7 +14842,7 @@ class AuroDropdown extends LitElement {
|
|
|
15313
14842
|
/**
|
|
15314
14843
|
* @private
|
|
15315
14844
|
*/
|
|
15316
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
14845
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$1$1();
|
|
15317
14846
|
|
|
15318
14847
|
/**
|
|
15319
14848
|
* @private
|
|
@@ -15323,7 +14852,7 @@ class AuroDropdown extends LitElement {
|
|
|
15323
14852
|
/**
|
|
15324
14853
|
* Generate unique names for dependency components.
|
|
15325
14854
|
*/
|
|
15326
|
-
const versioning = new AuroDependencyVersioning$
|
|
14855
|
+
const versioning = new AuroDependencyVersioning$1();
|
|
15327
14856
|
|
|
15328
14857
|
/**
|
|
15329
14858
|
* @private
|
|
@@ -15549,6 +15078,14 @@ class AuroDropdown extends LitElement {
|
|
|
15549
15078
|
reflect: true
|
|
15550
15079
|
},
|
|
15551
15080
|
|
|
15081
|
+
/**
|
|
15082
|
+
* If declared, onDark styles will be applied.
|
|
15083
|
+
*/
|
|
15084
|
+
onDark: {
|
|
15085
|
+
type: Boolean,
|
|
15086
|
+
reflect: true
|
|
15087
|
+
},
|
|
15088
|
+
|
|
15552
15089
|
onSlotChange: {
|
|
15553
15090
|
type: Function,
|
|
15554
15091
|
reflect: false
|
|
@@ -15602,7 +15139,7 @@ class AuroDropdown extends LitElement {
|
|
|
15602
15139
|
*
|
|
15603
15140
|
*/
|
|
15604
15141
|
static register(name = "auro-dropdown") {
|
|
15605
|
-
AuroLibraryRuntimeUtils$
|
|
15142
|
+
AuroLibraryRuntimeUtils$1$1.prototype.registerComponent(name, AuroDropdown);
|
|
15606
15143
|
}
|
|
15607
15144
|
|
|
15608
15145
|
connectedCallback() {
|
|
@@ -15919,14 +15456,14 @@ class AuroDropdown extends LitElement {
|
|
|
15919
15456
|
<${this.iconTag}
|
|
15920
15457
|
category="interface"
|
|
15921
15458
|
name="chevron-down"
|
|
15922
|
-
|
|
15923
|
-
|
|
15459
|
+
?onDark="${this.onDark}"
|
|
15460
|
+
variant="${this.disabled ? 'disabled' : 'muted'}">
|
|
15924
15461
|
>
|
|
15925
15462
|
</${this.iconTag}>
|
|
15926
15463
|
</div>
|
|
15927
15464
|
` : undefined }
|
|
15928
15465
|
</div>
|
|
15929
|
-
<${this.helpTextTag} part="helpText" ?error="${this.error}">
|
|
15466
|
+
<${this.helpTextTag} part="helpText" ?onDark=${this.onDark} ?error="${this.error}">
|
|
15930
15467
|
<slot name="helpText"></slot>
|
|
15931
15468
|
</${this.helpTextTag}>
|
|
15932
15469
|
<div class="slotContent">
|
|
@@ -16070,11 +15607,11 @@ function stopNotifyingOnLangChange(element) {
|
|
|
16070
15607
|
watchedItems.delete(element);
|
|
16071
15608
|
}
|
|
16072
15609
|
|
|
16073
|
-
var styleCss$4 = css
|
|
15610
|
+
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
15611
|
|
|
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-
|
|
15612
|
+
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
15613
|
|
|
16077
|
-
var tokensCss$4 = css`:host{--ds-auro-input-border-color: var(--ds-color-border-
|
|
15614
|
+
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
15615
|
|
|
16079
15616
|
/** Checks if value is string */
|
|
16080
15617
|
function isString(str) {
|
|
@@ -19925,7 +19462,7 @@ class AuroInputUtilities {
|
|
|
19925
19462
|
|
|
19926
19463
|
/* eslint-disable line-comment-position, no-inline-comments, no-confusing-arrow, no-nested-ternary, implicit-arrow-linebreak */
|
|
19927
19464
|
|
|
19928
|
-
let AuroLibraryRuntimeUtils$
|
|
19465
|
+
let AuroLibraryRuntimeUtils$1 = class AuroLibraryRuntimeUtils {
|
|
19929
19466
|
|
|
19930
19467
|
/* eslint-disable jsdoc/require-param */
|
|
19931
19468
|
|
|
@@ -19994,7 +19531,7 @@ let AuroLibraryRuntimeUtils$4 = class AuroLibraryRuntimeUtils {
|
|
|
19994
19531
|
|
|
19995
19532
|
class AuroFormValidation {
|
|
19996
19533
|
constructor() {
|
|
19997
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
19534
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$1();
|
|
19998
19535
|
}
|
|
19999
19536
|
|
|
20000
19537
|
/**
|
|
@@ -20334,6 +19871,7 @@ class BaseInput extends LitElement {
|
|
|
20334
19871
|
this.min = undefined;
|
|
20335
19872
|
this.maxLength = undefined;
|
|
20336
19873
|
this.minLength = undefined;
|
|
19874
|
+
this.onDark = false;
|
|
20337
19875
|
this.activeLabel = false;
|
|
20338
19876
|
this.setCustomValidityForType = undefined;
|
|
20339
19877
|
}
|
|
@@ -20524,6 +20062,14 @@ class BaseInput extends LitElement {
|
|
|
20524
20062
|
type: Boolean
|
|
20525
20063
|
},
|
|
20526
20064
|
|
|
20065
|
+
/**
|
|
20066
|
+
* Sets onDark styles on input.
|
|
20067
|
+
*/
|
|
20068
|
+
onDark: {
|
|
20069
|
+
type: Boolean,
|
|
20070
|
+
reflect: true
|
|
20071
|
+
},
|
|
20072
|
+
|
|
20527
20073
|
/**
|
|
20528
20074
|
* Specifies a regular expression the form control's value should match.
|
|
20529
20075
|
*/
|
|
@@ -21258,7 +20804,7 @@ class BaseInput extends LitElement {
|
|
|
21258
20804
|
// See LICENSE in the project root for license information.
|
|
21259
20805
|
|
|
21260
20806
|
|
|
21261
|
-
|
|
20807
|
+
class AuroDependencyVersioning {
|
|
21262
20808
|
|
|
21263
20809
|
/**
|
|
21264
20810
|
* Generates a unique string to be used for child auro element naming.
|
|
@@ -21292,7 +20838,7 @@ let AuroDependencyVersioning$1 = class AuroDependencyVersioning {
|
|
|
21292
20838
|
|
|
21293
20839
|
return tag;
|
|
21294
20840
|
}
|
|
21295
|
-
}
|
|
20841
|
+
}
|
|
21296
20842
|
|
|
21297
20843
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
21298
20844
|
// See LICENSE in the project root for license information.
|
|
@@ -21360,7 +20906,7 @@ const cacheFetch = (uri, options = {}) => {
|
|
|
21360
20906
|
return _fetchMap.get(uri);
|
|
21361
20907
|
};
|
|
21362
20908
|
|
|
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}
|
|
20909
|
+
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
20910
|
|
|
21365
20911
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
21366
20912
|
// See LICENSE in the project root for license information.
|
|
@@ -21368,7 +20914,6 @@ var styleCss$3 = css`:focus:not(:focus-visible){outline:3px solid transparent}.u
|
|
|
21368
20914
|
|
|
21369
20915
|
// See https://git.io/JJ6SJ for "How to document your components using JSDoc"
|
|
21370
20916
|
/**
|
|
21371
|
-
* @attr {Boolean} onDark - Set value for on-dark version of auro-icon
|
|
21372
20917
|
* @slot - Hidden from visibility, used for a11y if icon description is needed
|
|
21373
20918
|
*/
|
|
21374
20919
|
|
|
@@ -21383,6 +20928,10 @@ class BaseIcon extends AuroElement {
|
|
|
21383
20928
|
static get properties() {
|
|
21384
20929
|
return {
|
|
21385
20930
|
...super.properties,
|
|
20931
|
+
|
|
20932
|
+
/**
|
|
20933
|
+
* Set value for on-dark version of auro-icon.
|
|
20934
|
+
*/
|
|
21386
20935
|
onDark: {
|
|
21387
20936
|
type: Boolean,
|
|
21388
20937
|
reflect: true
|
|
@@ -21441,81 +20990,11 @@ class BaseIcon extends AuroElement {
|
|
|
21441
20990
|
}
|
|
21442
20991
|
}
|
|
21443
20992
|
|
|
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
|
-
// ---------------------------------------------------------------------
|
|
20993
|
+
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)}`;
|
|
21452
20994
|
|
|
21453
|
-
|
|
21454
|
-
|
|
21455
|
-
let AuroLibraryRuntimeUtils$3 = class AuroLibraryRuntimeUtils {
|
|
20995
|
+
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)}`;
|
|
21456
20996
|
|
|
21457
|
-
|
|
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();
|
|
21513
|
-
|
|
21514
|
-
return elemTag === tag || elem.hasAttribute(tag);
|
|
21515
|
-
}
|
|
21516
|
-
};
|
|
21517
|
-
|
|
21518
|
-
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
20997
|
+
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
21519
20998
|
// See LICENSE in the project root for license information.
|
|
21520
20999
|
|
|
21521
21000
|
|
|
@@ -21523,6 +21002,7 @@ class AuroIcon extends BaseIcon {
|
|
|
21523
21002
|
constructor() {
|
|
21524
21003
|
super();
|
|
21525
21004
|
|
|
21005
|
+
this.variant = undefined;
|
|
21526
21006
|
this.privateDefaults();
|
|
21527
21007
|
}
|
|
21528
21008
|
|
|
@@ -21532,22 +21012,8 @@ class AuroIcon extends BaseIcon {
|
|
|
21532
21012
|
* @returns {void}
|
|
21533
21013
|
*/
|
|
21534
21014
|
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
21015
|
this.uri = 'https://cdn.jsdelivr.net/npm/@alaskaairux/icons@latest/dist';
|
|
21550
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
21016
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$1();
|
|
21551
21017
|
}
|
|
21552
21018
|
|
|
21553
21019
|
// function to define props used within the scope of this component
|
|
@@ -21555,14 +21021,6 @@ class AuroIcon extends BaseIcon {
|
|
|
21555
21021
|
return {
|
|
21556
21022
|
...super.properties,
|
|
21557
21023
|
|
|
21558
|
-
/**
|
|
21559
|
-
* Sets the icon to use the accent style.
|
|
21560
|
-
*/
|
|
21561
|
-
accent: {
|
|
21562
|
-
type: Boolean,
|
|
21563
|
-
reflect: true
|
|
21564
|
-
},
|
|
21565
|
-
|
|
21566
21024
|
/**
|
|
21567
21025
|
* Set aria-hidden value. Default is `true`. Option is `false`.
|
|
21568
21026
|
*/
|
|
@@ -21593,38 +21051,6 @@ class AuroIcon extends BaseIcon {
|
|
|
21593
21051
|
type: Boolean
|
|
21594
21052
|
},
|
|
21595
21053
|
|
|
21596
|
-
/**
|
|
21597
|
-
* Sets the icon to use the disabled style.
|
|
21598
|
-
*/
|
|
21599
|
-
disabled: {
|
|
21600
|
-
type: Boolean,
|
|
21601
|
-
reflect: true
|
|
21602
|
-
},
|
|
21603
|
-
|
|
21604
|
-
/**
|
|
21605
|
-
* Sets the icon to use the emphasis style.
|
|
21606
|
-
*/
|
|
21607
|
-
emphasis: {
|
|
21608
|
-
type: Boolean,
|
|
21609
|
-
reflect: true
|
|
21610
|
-
},
|
|
21611
|
-
|
|
21612
|
-
/**
|
|
21613
|
-
* Sets the icon to use the error style.
|
|
21614
|
-
*/
|
|
21615
|
-
error: {
|
|
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
21054
|
/**
|
|
21629
21055
|
* Exposes content in slot as icon label.
|
|
21630
21056
|
*/
|
|
@@ -21642,50 +21068,10 @@ class AuroIcon extends BaseIcon {
|
|
|
21642
21068
|
},
|
|
21643
21069
|
|
|
21644
21070
|
/**
|
|
21645
|
-
*
|
|
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.
|
|
21071
|
+
* 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`.
|
|
21662
21072
|
*/
|
|
21663
|
-
|
|
21664
|
-
type:
|
|
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,
|
|
21073
|
+
variant: {
|
|
21074
|
+
type: String,
|
|
21689
21075
|
reflect: true
|
|
21690
21076
|
}
|
|
21691
21077
|
};
|
|
@@ -21709,7 +21095,7 @@ class AuroIcon extends BaseIcon {
|
|
|
21709
21095
|
*
|
|
21710
21096
|
*/
|
|
21711
21097
|
static register(name = "auro-icon") {
|
|
21712
|
-
AuroLibraryRuntimeUtils$
|
|
21098
|
+
AuroLibraryRuntimeUtils$1.prototype.registerComponent(name, AuroIcon);
|
|
21713
21099
|
}
|
|
21714
21100
|
|
|
21715
21101
|
connectedCallback() {
|
|
@@ -21775,197 +21161,17 @@ class AuroIcon extends BaseIcon {
|
|
|
21775
21161
|
}
|
|
21776
21162
|
}
|
|
21777
21163
|
|
|
21778
|
-
var iconVersion = '
|
|
21779
|
-
|
|
21780
|
-
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
21781
|
-
// See LICENSE in the project root for license information.
|
|
21782
|
-
|
|
21783
|
-
|
|
21784
|
-
class AuroDependencyVersioning {
|
|
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();
|
|
21164
|
+
var iconVersion = '8.0.1';
|
|
21946
21165
|
|
|
21947
|
-
|
|
21948
|
-
elem.setAttribute(tag, true);
|
|
21949
|
-
}
|
|
21950
|
-
}
|
|
21166
|
+
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}`;
|
|
21951
21167
|
|
|
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();
|
|
21168
|
+
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}`;
|
|
21961
21169
|
|
|
21962
|
-
|
|
21963
|
-
}
|
|
21964
|
-
};
|
|
21170
|
+
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
21171
|
|
|
21966
21172
|
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
21173
|
|
|
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-
|
|
21174
|
+
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
21175
|
|
|
21970
21176
|
var tokensCss$1 = css`:host{--ds-auro-loader-background-color:currentcolor;--ds-auro-loader-border-color:currentcolor;--ds-auro-loader-color:currentcolor}`;
|
|
21971
21177
|
|
|
@@ -21973,25 +21179,6 @@ var tokensCss$1 = css`:host{--ds-auro-loader-background-color:currentcolor;--ds-
|
|
|
21973
21179
|
// See LICENSE in the project root for license information.
|
|
21974
21180
|
|
|
21975
21181
|
|
|
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
21182
|
class AuroLoader extends LitElement {
|
|
21996
21183
|
constructor() {
|
|
21997
21184
|
super();
|
|
@@ -22025,19 +21212,35 @@ class AuroLoader extends LitElement {
|
|
|
22025
21212
|
// function to define props used within the scope of this component
|
|
22026
21213
|
static get properties() {
|
|
22027
21214
|
return {
|
|
22028
|
-
|
|
21215
|
+
|
|
21216
|
+
/**
|
|
21217
|
+
* Sets loader to laser type.
|
|
21218
|
+
*/
|
|
21219
|
+
laser: {
|
|
22029
21220
|
type: Boolean,
|
|
22030
21221
|
reflect: true
|
|
22031
21222
|
},
|
|
21223
|
+
|
|
21224
|
+
/**
|
|
21225
|
+
* Sets loader to orbit type.
|
|
21226
|
+
*/
|
|
22032
21227
|
orbit: {
|
|
22033
21228
|
type: Boolean,
|
|
22034
21229
|
reflect: true
|
|
22035
21230
|
},
|
|
22036
|
-
|
|
21231
|
+
|
|
21232
|
+
/**
|
|
21233
|
+
* Sets loader to pulse type.
|
|
21234
|
+
*/
|
|
21235
|
+
pulse: {
|
|
22037
21236
|
type: Boolean,
|
|
22038
21237
|
reflect: true
|
|
22039
21238
|
},
|
|
22040
|
-
|
|
21239
|
+
|
|
21240
|
+
/**
|
|
21241
|
+
* Sets loader to ringworm type.
|
|
21242
|
+
*/
|
|
21243
|
+
ringworm: {
|
|
22041
21244
|
type: Boolean,
|
|
22042
21245
|
reflect: true
|
|
22043
21246
|
}
|
|
@@ -22111,23 +21314,26 @@ class AuroLoader extends LitElement {
|
|
|
22111
21314
|
}
|
|
22112
21315
|
}
|
|
22113
21316
|
|
|
22114
|
-
var loaderVersion = '
|
|
21317
|
+
var loaderVersion = '5.0.0';
|
|
22115
21318
|
|
|
21319
|
+
/* eslint-disable max-lines */
|
|
22116
21320
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
22117
21321
|
// See LICENSE in the project root for license information.
|
|
22118
21322
|
|
|
22119
21323
|
|
|
22120
21324
|
/**
|
|
22121
21325
|
* @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
|
|
21326
|
+
* @attr {Boolean} disabled - If set to true, button will become disabled and not allow for interactions
|
|
22123
21327
|
* @attr {Boolean} iconOnly - If set to true, the button will contain an icon with no additional content
|
|
22124
21328
|
* @attr {Boolean} loading - If set to true button text will be replaced with `auro-loader` and become disabled
|
|
21329
|
+
* @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
21330
|
* @attr {Boolean} onDark - Set value for on-dark version of auro-button
|
|
22126
21331
|
* @attr {Boolean} rounded - If set to true, the button will have a rounded shape
|
|
22127
21332
|
* @attr {Boolean} slim - Set value for slim version of auro-button
|
|
22128
21333
|
* @attr {Boolean} fluid - Alters the shape of the button to be full width of its parent container
|
|
22129
21334
|
* @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
21335
|
* @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.
|
|
21336
|
+
* @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
21337
|
* @attr {String} id - Set the unique ID of an element.
|
|
22132
21338
|
* @attr {String} title - Sets title attribute. The information is most often shown as a tooltip text when the mouse moves over the element.
|
|
22133
21339
|
* @attr {String} type - The type of the button. Possible values are: `submit`, `reset`, `button`
|
|
@@ -22172,6 +21378,7 @@ class AuroButton extends LitElement {
|
|
|
22172
21378
|
this.rounded = false;
|
|
22173
21379
|
this.slim = false;
|
|
22174
21380
|
this.fluid = false;
|
|
21381
|
+
this.loadingText = this.loadingText || 'Loading...';
|
|
22175
21382
|
|
|
22176
21383
|
// Support for HTML5 forms
|
|
22177
21384
|
if (typeof this.attachInternals === 'function') {
|
|
@@ -22232,6 +21439,9 @@ class AuroButton extends LitElement {
|
|
|
22232
21439
|
type: Boolean,
|
|
22233
21440
|
reflect: true
|
|
22234
21441
|
},
|
|
21442
|
+
loadingText: {
|
|
21443
|
+
type: String
|
|
21444
|
+
},
|
|
22235
21445
|
onDark: {
|
|
22236
21446
|
type: Boolean,
|
|
22237
21447
|
reflect: true
|
|
@@ -22252,6 +21462,10 @@ class AuroButton extends LitElement {
|
|
|
22252
21462
|
type: String,
|
|
22253
21463
|
reflect: true
|
|
22254
21464
|
},
|
|
21465
|
+
ariaexpanded: {
|
|
21466
|
+
type: Boolean,
|
|
21467
|
+
reflect: true
|
|
21468
|
+
},
|
|
22255
21469
|
title: {
|
|
22256
21470
|
type: String,
|
|
22257
21471
|
reflect: true
|
|
@@ -22281,7 +21495,7 @@ class AuroButton extends LitElement {
|
|
|
22281
21495
|
*
|
|
22282
21496
|
*/
|
|
22283
21497
|
static register(name = "auro-button") {
|
|
22284
|
-
AuroLibraryRuntimeUtils$
|
|
21498
|
+
AuroLibraryRuntimeUtils$1.prototype.registerComponent(name, AuroButton);
|
|
22285
21499
|
}
|
|
22286
21500
|
|
|
22287
21501
|
/**
|
|
@@ -22323,12 +21537,22 @@ class AuroButton extends LitElement {
|
|
|
22323
21537
|
this.notifyReady();
|
|
22324
21538
|
}
|
|
22325
21539
|
|
|
21540
|
+
/**
|
|
21541
|
+
* Submits the form that this button is associated with.
|
|
21542
|
+
* @private
|
|
21543
|
+
* @returns {void}
|
|
21544
|
+
*/
|
|
22326
21545
|
surfaceSubmitEvent() {
|
|
22327
21546
|
if (this.form) {
|
|
22328
21547
|
this.form.requestSubmit();
|
|
22329
21548
|
}
|
|
22330
21549
|
}
|
|
22331
21550
|
|
|
21551
|
+
/**
|
|
21552
|
+
* Returns the form element that this button is associated with.
|
|
21553
|
+
* @private
|
|
21554
|
+
* @returns {HTMLFormElement|null}
|
|
21555
|
+
*/
|
|
22332
21556
|
get form() {
|
|
22333
21557
|
return this.internals ? this.internals.form : null;
|
|
22334
21558
|
}
|
|
@@ -22348,8 +21572,9 @@ class AuroButton extends LitElement {
|
|
|
22348
21572
|
return html$1`
|
|
22349
21573
|
<button
|
|
22350
21574
|
part="button"
|
|
22351
|
-
aria-label="${ifDefined(this.
|
|
21575
|
+
aria-label="${ifDefined(this.loading ? this.loadingText : this.arialabel || undefined)}"
|
|
22352
21576
|
aria-labelledby="${ifDefined(this.arialabelledby ? this.arialabelledby : undefined)}"
|
|
21577
|
+
aria-expanded="${ifDefined(this.ariaexpanded)}"
|
|
22353
21578
|
?autofocus="${this.autofocus}"
|
|
22354
21579
|
class="${classMap(classes)}"
|
|
22355
21580
|
?disabled="${this.disabled || this.loading}"
|
|
@@ -22377,13 +21602,13 @@ class AuroButton extends LitElement {
|
|
|
22377
21602
|
}
|
|
22378
21603
|
}
|
|
22379
21604
|
|
|
22380
|
-
var buttonVersion = '
|
|
21605
|
+
var buttonVersion = '9.3.0';
|
|
22381
21606
|
|
|
22382
|
-
var colorCss = css`:host([error]){--ds-auro-helptext-color: var(--ds-color-
|
|
21607
|
+
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
21608
|
|
|
22384
21609
|
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
21610
|
|
|
22386
|
-
var tokensCss = css`:host{--ds-auro-helptext-color: var(--ds-color-
|
|
21611
|
+
var tokensCss = css`:host{--ds-auro-helptext-color: var(--ds-basic-color-texticon-muted, #676767)}`;
|
|
22387
21612
|
|
|
22388
21613
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
22389
21614
|
// See LICENSE in the project root for license information.
|
|
@@ -22470,6 +21695,7 @@ class AuroHelpText extends LitElement {
|
|
|
22470
21695
|
super();
|
|
22471
21696
|
|
|
22472
21697
|
this.error = false;
|
|
21698
|
+
this.onDark = false;
|
|
22473
21699
|
this.hasTextContent = false;
|
|
22474
21700
|
|
|
22475
21701
|
AuroLibraryRuntimeUtils.prototype.handleComponentTagRename(this, 'auro-helptext');
|
|
@@ -22508,6 +21734,14 @@ class AuroHelpText extends LitElement {
|
|
|
22508
21734
|
type: Boolean,
|
|
22509
21735
|
reflect: true,
|
|
22510
21736
|
},
|
|
21737
|
+
|
|
21738
|
+
/**
|
|
21739
|
+
* If declared, will apply onDark styles.
|
|
21740
|
+
*/
|
|
21741
|
+
onDark: {
|
|
21742
|
+
type: Boolean,
|
|
21743
|
+
reflect: true
|
|
21744
|
+
}
|
|
22511
21745
|
};
|
|
22512
21746
|
}
|
|
22513
21747
|
|
|
@@ -22590,7 +21824,7 @@ class AuroInput extends BaseInput {
|
|
|
22590
21824
|
/**
|
|
22591
21825
|
* Generate unique names for dependency components.
|
|
22592
21826
|
*/
|
|
22593
|
-
const versioning = new AuroDependencyVersioning
|
|
21827
|
+
const versioning = new AuroDependencyVersioning();
|
|
22594
21828
|
|
|
22595
21829
|
/**
|
|
22596
21830
|
* @private
|
|
@@ -22617,7 +21851,7 @@ class AuroInput extends BaseInput {
|
|
|
22617
21851
|
*
|
|
22618
21852
|
*/
|
|
22619
21853
|
static register(name = "auro-input") {
|
|
22620
|
-
AuroLibraryRuntimeUtils$
|
|
21854
|
+
AuroLibraryRuntimeUtils$1.prototype.registerComponent(name, AuroInput);
|
|
22621
21855
|
}
|
|
22622
21856
|
|
|
22623
21857
|
/**
|
|
@@ -22657,7 +21891,8 @@ class AuroInput extends BaseInput {
|
|
|
22657
21891
|
category="payment"
|
|
22658
21892
|
name="${name}"
|
|
22659
21893
|
part="accentIcon"
|
|
22660
|
-
?
|
|
21894
|
+
?onDark="${this.onDark}"
|
|
21895
|
+
variant="${this.disabled ? 'disabled' : 'muted'}">
|
|
22661
21896
|
</${this.iconTag}>
|
|
22662
21897
|
`) : undefined
|
|
22663
21898
|
}
|
|
@@ -22669,7 +21904,8 @@ class AuroInput extends BaseInput {
|
|
|
22669
21904
|
category="interface"
|
|
22670
21905
|
name="calendar"
|
|
22671
21906
|
part="accentIcon"
|
|
22672
|
-
?
|
|
21907
|
+
?onDark="${this.onDark}"
|
|
21908
|
+
variant="${this.disabled ? 'disabled' : 'muted'}">
|
|
22673
21909
|
</${this.iconTag}>`
|
|
22674
21910
|
: undefined
|
|
22675
21911
|
}
|
|
@@ -22714,7 +21950,7 @@ class AuroInput extends BaseInput {
|
|
|
22714
21950
|
<${this.iconTag}
|
|
22715
21951
|
category="alert"
|
|
22716
21952
|
name="error-stroke"
|
|
22717
|
-
|
|
21953
|
+
customColor
|
|
22718
21954
|
</${this.iconTag}>
|
|
22719
21955
|
</div>
|
|
22720
21956
|
` : undefined}
|
|
@@ -22723,6 +21959,7 @@ class AuroInput extends BaseInput {
|
|
|
22723
21959
|
<div class="notification">
|
|
22724
21960
|
<${this.buttonTag}
|
|
22725
21961
|
variant="flat"
|
|
21962
|
+
?onDark="${this.onDark}"
|
|
22726
21963
|
aria-hidden="true"
|
|
22727
21964
|
tabindex="-1"
|
|
22728
21965
|
@click="${this.handleClickShowPassword}"
|
|
@@ -22746,6 +21983,7 @@ class AuroInput extends BaseInput {
|
|
|
22746
21983
|
<div class="notification">
|
|
22747
21984
|
<${this.buttonTag}
|
|
22748
21985
|
variant="flat"
|
|
21986
|
+
?onDark="${this.onDark}"
|
|
22749
21987
|
class="notificationBtn clearBtn"
|
|
22750
21988
|
aria-label="${i18n(this.lang, 'clearInput')}"
|
|
22751
21989
|
@click="${this.handleClickClear}">
|
|
@@ -22764,14 +22002,14 @@ class AuroInput extends BaseInput {
|
|
|
22764
22002
|
<!-- Help text and error message template -->
|
|
22765
22003
|
${!this.validity || this.validity === undefined || this.validity === 'valid'
|
|
22766
22004
|
? html$1`
|
|
22767
|
-
<${this.helpTextTag}>
|
|
22005
|
+
<${this.helpTextTag} ?onDark="${this.onDark}">
|
|
22768
22006
|
<p id="${this.uniqueId}" part="helpText">
|
|
22769
22007
|
<slot name="helptext">${this.getHelpText()}</slot>
|
|
22770
22008
|
</p>
|
|
22771
22009
|
</${this.helpTextTag}>
|
|
22772
22010
|
`
|
|
22773
22011
|
: html$1`
|
|
22774
|
-
<${this.helpTextTag} error>
|
|
22012
|
+
<${this.helpTextTag} error ?onDark="${this.onDark}">
|
|
22775
22013
|
<p id="${this.uniqueId}" role="alert" aria-live="assertive" part="helpText">
|
|
22776
22014
|
${this.errorMessage}
|
|
22777
22015
|
</p>
|
|
@@ -22836,6 +22074,7 @@ class AuroDatePicker extends LitElement {
|
|
|
22836
22074
|
|
|
22837
22075
|
this.disabled = false;
|
|
22838
22076
|
this.required = false;
|
|
22077
|
+
this.onDark = false;
|
|
22839
22078
|
this.range = false;
|
|
22840
22079
|
this.noValidate = false;
|
|
22841
22080
|
this.validity = undefined;
|
|
@@ -22881,7 +22120,7 @@ class AuroDatePicker extends LitElement {
|
|
|
22881
22120
|
/**
|
|
22882
22121
|
* @private
|
|
22883
22122
|
*/
|
|
22884
|
-
this.runtimeUtils = new AuroLibraryRuntimeUtils$
|
|
22123
|
+
this.runtimeUtils = new AuroLibraryRuntimeUtils$4();
|
|
22885
22124
|
|
|
22886
22125
|
/**
|
|
22887
22126
|
* @private
|
|
@@ -22891,7 +22130,7 @@ class AuroDatePicker extends LitElement {
|
|
|
22891
22130
|
/**
|
|
22892
22131
|
* Generate unique names for dependency components.
|
|
22893
22132
|
*/
|
|
22894
|
-
const versioning = new AuroDependencyVersioning$
|
|
22133
|
+
const versioning = new AuroDependencyVersioning$3();
|
|
22895
22134
|
|
|
22896
22135
|
/**
|
|
22897
22136
|
* @private
|
|
@@ -23045,6 +22284,14 @@ class AuroDatePicker extends LitElement {
|
|
|
23045
22284
|
reflect: true
|
|
23046
22285
|
},
|
|
23047
22286
|
|
|
22287
|
+
/**
|
|
22288
|
+
* If declared, onDark styles will be applied to the trigger.
|
|
22289
|
+
*/
|
|
22290
|
+
onDark: {
|
|
22291
|
+
type: Boolean,
|
|
22292
|
+
reflect: true
|
|
22293
|
+
},
|
|
22294
|
+
|
|
23048
22295
|
/**
|
|
23049
22296
|
* Position where the bib should appear relative to the trigger.
|
|
23050
22297
|
* Accepted values:
|
|
@@ -23159,7 +22406,7 @@ class AuroDatePicker extends LitElement {
|
|
|
23159
22406
|
*
|
|
23160
22407
|
*/
|
|
23161
22408
|
static register(name = "auro-datepicker") {
|
|
23162
|
-
AuroLibraryRuntimeUtils$
|
|
22409
|
+
AuroLibraryRuntimeUtils$4.prototype.registerComponent(name, AuroDatePicker);
|
|
23163
22410
|
}
|
|
23164
22411
|
|
|
23165
22412
|
/**
|
|
@@ -23793,6 +23040,7 @@ class AuroDatePicker extends LitElement {
|
|
|
23793
23040
|
fluid
|
|
23794
23041
|
bordered
|
|
23795
23042
|
rounded
|
|
23043
|
+
?onDark="${this.onDark}"
|
|
23796
23044
|
?disabled="${this.disabled}"
|
|
23797
23045
|
?error="${this.validity !== undefined && this.validity !== 'valid'}"
|
|
23798
23046
|
disableEventShow
|
|
@@ -23807,6 +23055,7 @@ class AuroDatePicker extends LitElement {
|
|
|
23807
23055
|
id="${this.generateRandomString(12)}"
|
|
23808
23056
|
bordered
|
|
23809
23057
|
class="dateFrom"
|
|
23058
|
+
?onDark="${this.onDark}"
|
|
23810
23059
|
?required="${this.required}"
|
|
23811
23060
|
noValidate
|
|
23812
23061
|
type="date"
|
|
@@ -23827,6 +23076,7 @@ class AuroDatePicker extends LitElement {
|
|
|
23827
23076
|
id="${this.generateRandomString(12)}"
|
|
23828
23077
|
bordered
|
|
23829
23078
|
class="dateTo"
|
|
23079
|
+
?onDark="${this.onDark}"
|
|
23830
23080
|
?required="${this.required}"
|
|
23831
23081
|
noValidate
|
|
23832
23082
|
type="date"
|