@aurodesignsystem-dev/auro-formkit 0.0.0-pr1398.2 → 0.0.0-pr1398.3
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/components/checkbox/demo/api.min.js +1 -1
- package/components/checkbox/demo/index.min.js +1 -1
- package/components/checkbox/demo/keyboardBehavior.md +0 -0
- package/components/checkbox/dist/index.js +1 -1
- package/components/checkbox/dist/registered.js +1 -1
- package/components/combobox/demo/api.min.js +129 -166
- package/components/combobox/demo/index.min.js +129 -166
- package/components/combobox/demo/keyboardBehavior.html +81 -0
- package/components/combobox/demo/keyboardBehavior.md +308 -0
- package/components/combobox/dist/index.js +87 -134
- package/components/combobox/dist/registered.js +87 -134
- package/components/counter/demo/api.min.js +157 -160
- package/components/counter/demo/index.min.js +157 -160
- package/components/counter/demo/keyboardBehavior.html +81 -0
- package/components/counter/demo/keyboardBehavior.md +127 -0
- package/components/counter/dist/auro-counter.d.ts +0 -7
- package/components/counter/dist/index.js +157 -160
- package/components/counter/dist/keyboardStrategy.d.ts +4 -0
- package/components/counter/dist/registered.js +157 -160
- package/components/datepicker/demo/api.min.js +89 -137
- package/components/datepicker/demo/index.min.js +89 -137
- package/components/datepicker/demo/keyboardBehavior.html +81 -0
- package/components/datepicker/demo/keyboardBehavior.md +24 -0
- package/components/datepicker/dist/index.js +84 -132
- package/components/datepicker/dist/registered.js +84 -132
- package/components/dropdown/demo/api.md +0 -1
- package/components/dropdown/demo/api.min.js +99 -140
- package/components/dropdown/demo/index.md +2 -2
- package/components/dropdown/demo/index.min.js +99 -140
- package/components/dropdown/demo/keyboardBehavior.html +81 -0
- package/components/dropdown/demo/keyboardBehavior.md +77 -0
- package/components/dropdown/dist/auro-dropdown.d.ts +0 -8
- package/components/dropdown/dist/auro-dropdownBib.d.ts +1 -50
- package/components/dropdown/dist/dropdownBibKeyboardStrategy.d.ts +7 -0
- package/components/dropdown/dist/index.js +83 -128
- package/components/dropdown/dist/registered.js +83 -128
- package/components/form/demo/api.min.js +466 -599
- package/components/form/demo/index.min.js +466 -599
- package/components/form/demo/keyboardBehavior.md +0 -0
- package/components/input/demo/api.min.js +1 -1
- package/components/input/demo/index.min.js +1 -1
- package/components/input/demo/keyboardBehavior.md +0 -0
- package/components/input/dist/index.js +1 -1
- package/components/input/dist/registered.js +1 -1
- package/components/menu/demo/api.min.js +42 -32
- package/components/menu/demo/index.min.js +42 -32
- package/components/menu/dist/auro-menu.d.ts +3 -11
- package/components/menu/dist/index.js +42 -32
- package/components/menu/dist/registered.js +42 -32
- package/components/radio/demo/api.min.js +1 -1
- package/components/radio/demo/index.min.js +1 -1
- package/components/radio/dist/index.js +1 -1
- package/components/radio/dist/registered.js +1 -1
- package/components/select/demo/api.min.js +132 -167
- package/components/select/demo/index.min.js +132 -167
- package/components/select/demo/keyboardBehavior.html +81 -0
- package/components/select/demo/keyboardBehavior.md +246 -0
- package/components/select/dist/index.js +90 -135
- package/components/select/dist/registered.js +90 -135
- package/custom-elements.json +61 -89
- package/package.json +2 -2
|
@@ -7458,7 +7458,7 @@ let AuroHelpText$8 = class AuroHelpText extends i$4 {
|
|
|
7458
7458
|
}
|
|
7459
7459
|
};
|
|
7460
7460
|
|
|
7461
|
-
var formkitVersion$8 = '
|
|
7461
|
+
var formkitVersion$8 = '202604012043';
|
|
7462
7462
|
|
|
7463
7463
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
7464
7464
|
// See LICENSE in the project root for license information.
|
|
@@ -17366,7 +17366,7 @@ let AuroBibtemplate$3 = class AuroBibtemplate extends i$4 {
|
|
|
17366
17366
|
}
|
|
17367
17367
|
};
|
|
17368
17368
|
|
|
17369
|
-
var formkitVersion$2$1 = '
|
|
17369
|
+
var formkitVersion$2$1 = '202604012043';
|
|
17370
17370
|
|
|
17371
17371
|
let l$1$2 = class l{generateElementName(t,e){let o=t;return o+="-",o+=e.replace(/[.]/g,"_"),o}generateTag(o,s,a){const r=this.generateElementName(o,s),i=i$3`${s$6(r)}`;return customElements.get(r)||customElements.define(r,class extends a{}),i}};let d$1$2 = class d{registerComponent(t,e){customElements.get(t)||customElements.define(t,class extends e{});}closestElement(t,e=this,o=(e,s=e&&e.closest(t))=>e&&e!==document&&e!==window?s||o(e.getRootNode().host):null){return o(e)}handleComponentTagRename(t,e){const o=e.toLowerCase();t.tagName.toLowerCase()!==o&&t.setAttribute(o,true);}elementMatch(t,e){const o=e.toLowerCase();return t.tagName.toLowerCase()===o||t.hasAttribute(o)}getSlotText(t,e){const o=t.shadowRoot?.querySelector(`slot[name="${e}"]`),s=(o?.assignedNodes({flatten:true})||[]).map(t=>t.textContent?.trim()).join(" ").trim();return s||null}};let h$1$2 = class h{registerComponent(t,e){customElements.get(t)||customElements.define(t,class extends e{});}closestElement(t,e=this,o=(e,s=e&&e.closest(t))=>e&&e!==document&&e!==window?s||o(e.getRootNode().host):null){return o(e)}handleComponentTagRename(t,e){const o=e.toLowerCase();t.tagName.toLowerCase()!==o&&t.setAttribute(o,true);}elementMatch(t,e){const o=e.toLowerCase();return t.tagName.toLowerCase()===o||t.hasAttribute(o)}};var c$1$3=i$7`: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]),:host([appearance=brand]){--ds-auro-loader-color: var(--ds-basic-color-brand-primary, #01426a)}:host([ondark]),:host([appearance=inverse]){--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}
|
|
17372
17372
|
`,u$4$2=i$7`.body-default{font-size:var(--wcss-body-default-font-size, 1rem);line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default,.body-lg{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-lg{font-size:var(--wcss-body-lg-font-size, 1.125rem);line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-sm{font-size:var(--wcss-body-sm-font-size, .875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.body-xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs{font-size:var(--wcss-body-xs-font-size, .75rem);line-height:var(--wcss-body-xs-line-height, 1rem)}.body-2xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:var(--wcss-body-2xs-font-size, .625rem);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0);line-height:var(--wcss-body-2xs-line-height, .875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 450);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 450);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, .05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, .05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, .05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, .05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, .05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, .1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xs-font-size, clamp(.875rem, 1.1666666667vw, .875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, .1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}: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;box-sizing:border-box}: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: .375rem;--margin-xs: .2rem;--margin-sm: .5rem;--margin-md: .75rem;--margin-lg: 1rem}:host([pulse]),:host([pulse])>span{position:relative}:host([pulse]){width:calc(3rem + var(--margin) * 6);height:calc(1rem + var(--margin) * 2)}:host([pulse])>span{width:1rem;height:1rem;margin:var(--margin);animation:pulse 1.5s ease infinite}:host([pulse][xs]){width:calc(1.95rem + var(--margin-xs) * 6);height:calc(.65rem + var(--margin-xs) * 2)}:host([pulse][xs])>span{margin:var(--margin-xs);width:.65rem;height:.65rem}:host([pulse][sm]){width:calc(6rem + var(--margin-sm) * 6);height:calc(2rem + var(--margin-sm) * 2)}:host([pulse][sm])>span{margin:var(--margin-sm);width:2rem;height:2rem}:host([pulse][md]){width:calc(9rem + var(--margin-md) * 6);height:calc(3rem + var(--margin-md) * 2)}:host([pulse][md])>span{margin:var(--margin-md);width:3rem;height:3rem}:host([pulse][lg]){width:calc(15rem + var(--margin-lg) * 6);height:calc(5rem + var(--margin-lg) * 2)}:host([pulse][lg])>span{margin:var(--margin-lg);width:5rem;height:5rem}:host([pulse])>span:nth-child(1){animation-delay:-.4s}:host([pulse])>span:nth-child(2){animation-delay:-.2s}:host([pulse])>span:nth-child(3){animation-delay:0ms}@keyframes pulse{0%,to{opacity:.1;transform:scale(.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(0)}to{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{to{transform:rotate(360deg)}}@keyframes ringworm{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35px}to{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%}to{left:110%}}:host>.no-animation{display:none}@media (prefers-reduced-motion: reduce){:host{display:flex;align-items:center;justify-content:center}:host>span{opacity:1}:host>.loader{display:none}:host>svg{display:none}:host>.no-animation{display:block}}
|
|
@@ -19891,11 +19891,10 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
19891
19891
|
return;
|
|
19892
19892
|
}
|
|
19893
19893
|
|
|
19894
|
-
const { activeElement } = document;
|
|
19895
19894
|
// if focus is still inside of trigger or bib, do not close
|
|
19896
19895
|
if (
|
|
19897
|
-
this.element.
|
|
19898
|
-
this.element.
|
|
19896
|
+
this.element.matches(":focus") ||
|
|
19897
|
+
this.element.matches(":focus-within")
|
|
19899
19898
|
) {
|
|
19900
19899
|
return;
|
|
19901
19900
|
}
|
|
@@ -20734,12 +20733,83 @@ let p$3$3 = class p{registerComponent(t,a){customElements.get(t)||customElements
|
|
|
20734
20733
|
|
|
20735
20734
|
var iconVersion$2$3 = '9.1.2';
|
|
20736
20735
|
|
|
20736
|
+
/**
|
|
20737
|
+
* Computes display state once per keydown event.
|
|
20738
|
+
* Centralizes null-safety checks and makes the shared/modal/popover branching explicit.
|
|
20739
|
+
*
|
|
20740
|
+
* @param {HTMLElement} component - The component with a dropdown reference.
|
|
20741
|
+
* @param {Object} [options] - Optional config.
|
|
20742
|
+
* @param {HTMLElement} [options.dropdown] - Explicit dropdown reference. Falls back to component.dropdown.
|
|
20743
|
+
* @param {Function} [options.inputResolver] - Called with (component, ctx) to resolve the active input element.
|
|
20744
|
+
* @returns {{isExpanded: boolean, isModal: boolean, isPopover: boolean, activeInput: HTMLElement|null}}
|
|
20745
|
+
* isModal and isPopover reflect the display mode (fullscreen vs not) regardless of expanded state.
|
|
20746
|
+
*/
|
|
20747
|
+
function createDisplayContext$1$3(component, options = {}) {
|
|
20748
|
+
const dd = options.dropdown || component.dropdown;
|
|
20749
|
+
// isPopoverVisible reflects as the `open` attribute.
|
|
20750
|
+
// It reports whether the bib is open in any mode (popover or modal).
|
|
20751
|
+
const isExpanded = Boolean(dd && dd.isPopoverVisible);
|
|
20752
|
+
const isFullscreen = Boolean(dd && dd.isBibFullscreen);
|
|
20753
|
+
|
|
20754
|
+
const ctx = {
|
|
20755
|
+
isExpanded,
|
|
20756
|
+
isModal: isFullscreen,
|
|
20757
|
+
isPopover: !isFullscreen,
|
|
20758
|
+
activeInput: null,
|
|
20759
|
+
};
|
|
20760
|
+
|
|
20761
|
+
if (options.inputResolver) {
|
|
20762
|
+
const resolvedInput = options.inputResolver(component, ctx);
|
|
20763
|
+
// Guard against resolvers returning undefined or non-HTMLElement values.
|
|
20764
|
+
ctx.activeInput = resolvedInput instanceof HTMLElement ? resolvedInput : null;
|
|
20765
|
+
}
|
|
20766
|
+
|
|
20767
|
+
return ctx;
|
|
20768
|
+
}
|
|
20769
|
+
|
|
20770
|
+
/**
|
|
20771
|
+
* Wires up a keydown listener that dispatches to strategy[evt.key] or strategy.default.
|
|
20772
|
+
* Handles both sync and async handlers.
|
|
20773
|
+
* @param {HTMLElement} component - The component to attach the listener to.
|
|
20774
|
+
* @param {Object} strategy - Map of key names to handler functions.
|
|
20775
|
+
* @param {Object} [options] - Optional config passed to createDisplayContext.
|
|
20776
|
+
*/
|
|
20777
|
+
function applyKeyboardStrategy$1$3(component, strategy, options = {}) {
|
|
20778
|
+
component.addEventListener('keydown', async (evt) => {
|
|
20779
|
+
const handler = strategy[evt.key] || strategy.default;
|
|
20780
|
+
if (typeof handler === 'function') {
|
|
20781
|
+
const ctx = createDisplayContext$1$3(component, options);
|
|
20782
|
+
await handler(component, evt, ctx);
|
|
20783
|
+
}
|
|
20784
|
+
});
|
|
20785
|
+
}
|
|
20786
|
+
|
|
20737
20787
|
var styleCss$2$1$2 = i$7`:host{position:fixed;z-index:var(--depth-tooltip, 400);display:none;isolation:isolate}:host dialog{width:auto;max-width:none;height:auto;max-height:none;padding:0;border:none;margin:0;outline:none;transform:translateZ(0)}:host dialog::backdrop{background:transparent}:host(:not([isfullscreen])) dialog{position:relative;inset:unset}:host(:not([isfullscreen])) .container.shape-box{border-radius:unset}:host(:not([isfullscreen])) .container[class*=shape-pill],:host(:not([isfullscreen])) .container[class*=shape-snowflake]{border-radius:30px}:host(:not([isfullscreen])) .container[class*=shape-rounded]{border-radius:16px}:host(:not([matchWidth])) .container{min-width:fit-content}:host([isfullscreen]){position:fixed;top:0;left:0}:host([isfullscreen]) .container{width:100dvw;max-width:none;height:100dvh;max-height:none;border-radius:unset;margin-top:0;box-shadow:unset;overscroll-behavior:contain}:host([isfullscreen]) .container::backdrop{background:var(--ds-color-background-primary, #fff)}:host(:popover-open){position:fixed;overflow:visible;padding:0;border:none;margin:0;background:transparent;inset:unset;outline:none}:host([data-show]){display:flex}:host([common]:not([isfullscreen])) .container,:host([rounded]:not([isfullscreen])) .container{border-radius:var(--ds-border-radius, 0.375rem)}:host([common][isfullscreen]) .container,:host([rounded][isfullscreen]) .container{border-radius:unset;box-shadow:unset}.container{display:inline-block;overflow:auto;box-sizing:border-box;border-radius:var(--ds-border-radius, 0.375rem);margin:var(--ds-size-50, 0.25rem) 0}.util_displayHiddenVisually{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;border:0;margin:-1px;clip-path:inset(50%);white-space:nowrap}`;
|
|
20738
20788
|
|
|
20739
20789
|
var colorCss$2$6 = i$7`.container{background-color:var(--ds-auro-dropdownbib-container-color);box-shadow:var(--ds-auro-dropdownbib-boxshadow-color);color:var(--ds-auro-dropdownbib-text-color)}`;
|
|
20740
20790
|
|
|
20741
20791
|
var tokensCss$1$1$1 = i$7`:host(:not([ondark])),:host(:not([appearance=inverse])){--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-dropdown-trigger-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-hover-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-bold, #585e67);--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-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdownbib-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdownbib-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}:host([ondark]),:host([appearance=inverse]){--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db);--ds-auro-dropdown-trigger-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-hover-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-inverse, #ffffff);--ds-auro-dropdown-trigger-outline-color: transparent;--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-dropdownbib-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdownbib-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdownbib-text-color: var(--ds-basic-color-texticon-inverse, #ffffff)}`;
|
|
20742
20792
|
|
|
20793
|
+
/**
|
|
20794
|
+
* Creates a keyboard strategy for dialog-specific key handling.
|
|
20795
|
+
* All other keydown behavior is left to the browser's native bubbling path.
|
|
20796
|
+
* @param {HTMLElement} bib - The dropdown bib element.
|
|
20797
|
+
* @returns {Object} Keyboard handlers keyed by `event.key`.
|
|
20798
|
+
*/
|
|
20799
|
+
// eslint-disable-next-line no-unused-vars
|
|
20800
|
+
function createDropdownBibKeyboardStrategy$3(bib) {
|
|
20801
|
+
return {
|
|
20802
|
+
// eslint-disable-next-line no-unused-vars
|
|
20803
|
+
Enter(_dialog, event) {
|
|
20804
|
+
// Floating UI handles Enter key to open the dropdown
|
|
20805
|
+
},
|
|
20806
|
+
// eslint-disable-next-line no-unused-vars
|
|
20807
|
+
Escape(_dialog, event) {
|
|
20808
|
+
// Floating UI handles Escape key to close the dropdown
|
|
20809
|
+
}
|
|
20810
|
+
};
|
|
20811
|
+
}
|
|
20812
|
+
|
|
20743
20813
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
20744
20814
|
// See LICENSE in the project root for license information.
|
|
20745
20815
|
/* eslint-disable max-lines */
|
|
@@ -20864,26 +20934,11 @@ let AuroDropdownBib$3 = class AuroDropdownBib extends i$4 {
|
|
|
20864
20934
|
},
|
|
20865
20935
|
|
|
20866
20936
|
/**
|
|
20867
|
-
*
|
|
20868
|
-
* aria-activedescendant. The dialog keyboard bridge checks this
|
|
20869
|
-
* flag so that Enter selects the highlighted option instead of
|
|
20870
|
-
* activating the focused interactive element (e.g. the trigger
|
|
20871
|
-
* button, or the bibtemplate close button in fullscreen).
|
|
20937
|
+
* Tracks whether a menu option is currently highlighted.
|
|
20872
20938
|
* @private
|
|
20873
20939
|
*/
|
|
20874
20940
|
hasActiveDescendant: {
|
|
20875
20941
|
type: Boolean
|
|
20876
|
-
},
|
|
20877
|
-
|
|
20878
|
-
/**
|
|
20879
|
-
* When true, the keyboard bridge allows native Tab behavior
|
|
20880
|
-
* instead of intercepting it. Set this for bib consumers
|
|
20881
|
-
* (e.g. counter) whose content contains real focusable elements
|
|
20882
|
-
* that need native Tab navigation.
|
|
20883
|
-
* @private
|
|
20884
|
-
*/
|
|
20885
|
-
nativeFocusableContent: {
|
|
20886
|
-
type: Boolean
|
|
20887
20942
|
}
|
|
20888
20943
|
};
|
|
20889
20944
|
}
|
|
@@ -20953,7 +21008,7 @@ let AuroDropdownBib$3 = class AuroDropdownBib extends i$4 {
|
|
|
20953
21008
|
|
|
20954
21009
|
const dialog = this.shadowRoot.querySelector('dialog');
|
|
20955
21010
|
this._setupCancelHandler(dialog);
|
|
20956
|
-
|
|
21011
|
+
applyKeyboardStrategy$1$3(dialog, createDropdownBibKeyboardStrategy$3());
|
|
20957
21012
|
|
|
20958
21013
|
this.dispatchEvent(new CustomEvent('auro-dropdownbib-connected', {
|
|
20959
21014
|
bubbles: true,
|
|
@@ -20980,98 +21035,6 @@ let AuroDropdownBib$3 = class AuroDropdownBib extends i$4 {
|
|
|
20980
21035
|
});
|
|
20981
21036
|
}
|
|
20982
21037
|
|
|
20983
|
-
/**
|
|
20984
|
-
* showModal() creates a closed focus scope — keyboard events inside
|
|
20985
|
-
* the dialog's shadow DOM do NOT bubble out to the combobox/select
|
|
20986
|
-
* keydown handlers in the parent shadow DOM. This handler bridges
|
|
20987
|
-
* that gap by re-dispatching navigation keys so they cross the
|
|
20988
|
-
* shadow boundary and reach the menu navigation logic in the parent
|
|
20989
|
-
* component.
|
|
20990
|
-
*
|
|
20991
|
-
* The trade-off: intercepting these keys means native keyboard
|
|
20992
|
-
* behaviors that would normally "just work" must be manually
|
|
20993
|
-
* re-implemented here:
|
|
20994
|
-
*
|
|
20995
|
-
* - Enter on buttons: Custom elements (auro-button) don't get the
|
|
20996
|
-
* native Enter→click that <button> provides, so we call .click()
|
|
20997
|
-
* directly when Enter is pressed on a button-like element.
|
|
20998
|
-
*
|
|
20999
|
-
* - Tab: Intercepted and re-dispatched so parent components
|
|
21000
|
-
* (select/combobox) can select the active option and close the
|
|
21001
|
-
* dialog. The <dialog> provides containment and isolation
|
|
21002
|
-
* (inert background, VoiceOver focus trapping, top layer), while
|
|
21003
|
-
* the content inside is a role="listbox" navigated via
|
|
21004
|
-
* aria-activedescendant (options are not focusable). Tab keyboard
|
|
21005
|
-
* behavior follows listbox conventions (select + close) because
|
|
21006
|
-
* the dialog's native Tab trap only cycles between the close
|
|
21007
|
-
* button and browser chrome.
|
|
21008
|
-
*
|
|
21009
|
-
* - Escape: The native <dialog> fires a `cancel` event on ESC
|
|
21010
|
-
* (handled by _setupCancelHandler), so the re-dispatched Escape
|
|
21011
|
-
* is a secondary path for parent components that also listen for
|
|
21012
|
-
* Escape keydown.
|
|
21013
|
-
*
|
|
21014
|
-
* @param {HTMLDialogElement} dialog - The dialog element to attach the keyboard bridge to.
|
|
21015
|
-
* @private
|
|
21016
|
-
*/
|
|
21017
|
-
_setupKeyboardBridge(dialog) {
|
|
21018
|
-
const navKeys = new Set([
|
|
21019
|
-
'ArrowUp',
|
|
21020
|
-
'ArrowDown',
|
|
21021
|
-
'Enter',
|
|
21022
|
-
'Escape',
|
|
21023
|
-
'Tab'
|
|
21024
|
-
]);
|
|
21025
|
-
|
|
21026
|
-
dialog.addEventListener('keydown', (event) => {
|
|
21027
|
-
if (!navKeys.has(event.key)) {
|
|
21028
|
-
return;
|
|
21029
|
-
}
|
|
21030
|
-
|
|
21031
|
-
// Custom elements (auro-button) don't get the native Enter→click
|
|
21032
|
-
// behavior that <button> has. Find the button in the composed path
|
|
21033
|
-
// and click it directly — but only when no menu option is
|
|
21034
|
-
// highlighted. In fullscreen mode focus stays on the close button
|
|
21035
|
-
// while arrow keys move the active-descendant highlight through
|
|
21036
|
-
// the listbox. If the user presses Enter with an option
|
|
21037
|
-
// highlighted, the intent is to select that option, not to click
|
|
21038
|
-
// the close button. In that case we fall through and bridge the
|
|
21039
|
-
// Enter key to the parent component's keyboard strategy.
|
|
21040
|
-
if (event.key === 'Enter') {
|
|
21041
|
-
if (!this.hasActiveDescendant) {
|
|
21042
|
-
const buttonSelector = 'button, [role="button"], auro-button, [auro-button]';
|
|
21043
|
-
const btn = event.composedPath().find((el) => el.matches && el.matches(buttonSelector));
|
|
21044
|
-
if (btn) {
|
|
21045
|
-
event.preventDefault();
|
|
21046
|
-
event.stopPropagation();
|
|
21047
|
-
btn.click();
|
|
21048
|
-
return;
|
|
21049
|
-
}
|
|
21050
|
-
}
|
|
21051
|
-
}
|
|
21052
|
-
|
|
21053
|
-
// Allow native Tab when the bib contains focusable content
|
|
21054
|
-
// (e.g. counter buttons) that needs normal Tab navigation.
|
|
21055
|
-
if (event.key === 'Tab' && this.nativeFocusableContent) {
|
|
21056
|
-
return;
|
|
21057
|
-
}
|
|
21058
|
-
|
|
21059
|
-
event.preventDefault();
|
|
21060
|
-
event.stopPropagation();
|
|
21061
|
-
const newEvent = new KeyboardEvent('keydown', {
|
|
21062
|
-
key: event.key,
|
|
21063
|
-
code: event.code,
|
|
21064
|
-
shiftKey: event.shiftKey,
|
|
21065
|
-
altKey: event.altKey,
|
|
21066
|
-
ctrlKey: event.ctrlKey,
|
|
21067
|
-
metaKey: event.metaKey,
|
|
21068
|
-
bubbles: true,
|
|
21069
|
-
composed: true,
|
|
21070
|
-
cancelable: true
|
|
21071
|
-
});
|
|
21072
|
-
this.dispatchEvent(newEvent);
|
|
21073
|
-
});
|
|
21074
|
-
}
|
|
21075
21038
|
|
|
21076
21039
|
/**
|
|
21077
21040
|
* Blocks touch-driven page scroll while a fullscreen modal dialog is open.
|
|
@@ -21446,7 +21409,7 @@ let AuroHelpText$2$1 = class AuroHelpText extends i$4 {
|
|
|
21446
21409
|
}
|
|
21447
21410
|
};
|
|
21448
21411
|
|
|
21449
|
-
var formkitVersion$1$3 = '
|
|
21412
|
+
var formkitVersion$1$3 = '202604012043';
|
|
21450
21413
|
|
|
21451
21414
|
let AuroElement$2$2 = class AuroElement extends i$4 {
|
|
21452
21415
|
static get properties() {
|
|
@@ -21627,7 +21590,6 @@ let AuroDropdown$3 = class AuroDropdown extends AuroElement$2$2 {
|
|
|
21627
21590
|
this.appearance = 'default';
|
|
21628
21591
|
this.chevron = false;
|
|
21629
21592
|
this.disabled = false;
|
|
21630
|
-
this.disableFocusTrap = false;
|
|
21631
21593
|
this.error = false;
|
|
21632
21594
|
this.tabIndex = 0;
|
|
21633
21595
|
this.noToggle = false;
|
|
@@ -21725,9 +21687,8 @@ let AuroDropdown$3 = class AuroDropdown extends AuroElement$2$2 {
|
|
|
21725
21687
|
// showModal() fires asynchronously via Lit's update cycle, which
|
|
21726
21688
|
// falls outside the user activation window and causes iOS to
|
|
21727
21689
|
// dismiss the keyboard.
|
|
21728
|
-
if (this.
|
|
21729
|
-
|
|
21730
|
-
this.bibElement.value.open(useModal);
|
|
21690
|
+
if (this.bibElement && this.bibElement.value) {
|
|
21691
|
+
this.bibElement.value.open(this.isBibFullscreen);
|
|
21731
21692
|
}
|
|
21732
21693
|
}
|
|
21733
21694
|
|
|
@@ -21840,14 +21801,6 @@ let AuroDropdown$3 = class AuroDropdown extends AuroElement$2$2 {
|
|
|
21840
21801
|
reflect: true
|
|
21841
21802
|
},
|
|
21842
21803
|
|
|
21843
|
-
/**
|
|
21844
|
-
* If declared, the focus trap inside of bib will be turned off.
|
|
21845
|
-
*/
|
|
21846
|
-
disableFocusTrap: {
|
|
21847
|
-
type: Boolean,
|
|
21848
|
-
reflect: true
|
|
21849
|
-
},
|
|
21850
|
-
|
|
21851
21804
|
/**
|
|
21852
21805
|
* @private
|
|
21853
21806
|
*/
|
|
@@ -22121,7 +22074,7 @@ let AuroDropdown$3 = class AuroDropdown extends AuroElement$2$2 {
|
|
|
22121
22074
|
if (this.isPopoverVisible) {
|
|
22122
22075
|
// Fullscreen: use showModal() for native accessibility (inert outside, focus trap)
|
|
22123
22076
|
// Desktop: use show() for Floating UI positioning + FocusTrap for focus management
|
|
22124
|
-
const useModal = this.isBibFullscreen
|
|
22077
|
+
const useModal = this.isBibFullscreen;
|
|
22125
22078
|
this.bibElement.value.open(useModal);
|
|
22126
22079
|
} else {
|
|
22127
22080
|
this.bibElement.value.close();
|
|
@@ -22131,7 +22084,7 @@ let AuroDropdown$3 = class AuroDropdown extends AuroElement$2$2 {
|
|
|
22131
22084
|
// When fullscreen strategy changes while open, re-open dialog with correct mode
|
|
22132
22085
|
// (e.g. resizing from desktop → mobile while dropdown is open)
|
|
22133
22086
|
if (changedProperties.has('isBibFullscreen') && this.isPopoverVisible && this.bibElement.value) {
|
|
22134
|
-
const useModal = this.isBibFullscreen
|
|
22087
|
+
const useModal = this.isBibFullscreen;
|
|
22135
22088
|
this.bibElement.value.close();
|
|
22136
22089
|
this.bibElement.value.open(useModal);
|
|
22137
22090
|
}
|
|
@@ -22243,7 +22196,7 @@ let AuroDropdown$3 = class AuroDropdown extends AuroElement$2$2 {
|
|
|
22243
22196
|
* @private
|
|
22244
22197
|
*/
|
|
22245
22198
|
updateFocusTrap() {
|
|
22246
|
-
if (this.isPopoverVisible
|
|
22199
|
+
if (this.isPopoverVisible) {
|
|
22247
22200
|
if (!this.isBibFullscreen) {
|
|
22248
22201
|
// Desktop: show() doesn't trap focus, so use FocusTrap
|
|
22249
22202
|
this.focusTrap = new FocusTrap$3(this.bibContent);
|
|
@@ -29203,7 +29156,7 @@ let AuroHelpText$1$3 = class AuroHelpText extends i$4 {
|
|
|
29203
29156
|
}
|
|
29204
29157
|
};
|
|
29205
29158
|
|
|
29206
|
-
var formkitVersion$7 = '
|
|
29159
|
+
var formkitVersion$7 = '202604012043';
|
|
29207
29160
|
|
|
29208
29161
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
29209
29162
|
// See LICENSE in the project root for license information.
|
|
@@ -30409,7 +30362,7 @@ function restoreTriggerAfterClose$2(dropdown, focusTarget) {
|
|
|
30409
30362
|
* @returns {{isExpanded: boolean, isModal: boolean, isPopover: boolean, activeInput: HTMLElement|null}}
|
|
30410
30363
|
* isModal and isPopover reflect the display mode (fullscreen vs not) regardless of expanded state.
|
|
30411
30364
|
*/
|
|
30412
|
-
function createDisplayContext$
|
|
30365
|
+
function createDisplayContext$4(component, options = {}) {
|
|
30413
30366
|
const dd = options.dropdown || component.dropdown;
|
|
30414
30367
|
// isPopoverVisible reflects as the `open` attribute.
|
|
30415
30368
|
// It reports whether the bib is open in any mode (popover or modal).
|
|
@@ -30439,11 +30392,11 @@ function createDisplayContext$2(component, options = {}) {
|
|
|
30439
30392
|
* @param {Object} strategy - Map of key names to handler functions.
|
|
30440
30393
|
* @param {Object} [options] - Optional config passed to createDisplayContext.
|
|
30441
30394
|
*/
|
|
30442
|
-
function applyKeyboardStrategy$
|
|
30395
|
+
function applyKeyboardStrategy$4(component, strategy, options = {}) {
|
|
30443
30396
|
component.addEventListener('keydown', async (evt) => {
|
|
30444
30397
|
const handler = strategy[evt.key] || strategy.default;
|
|
30445
30398
|
if (typeof handler === 'function') {
|
|
30446
|
-
const ctx = createDisplayContext$
|
|
30399
|
+
const ctx = createDisplayContext$4(component, options);
|
|
30447
30400
|
await handler(component, evt, ctx);
|
|
30448
30401
|
}
|
|
30449
30402
|
});
|
|
@@ -31281,7 +31234,7 @@ class AuroDatePicker extends AuroElement$5 {
|
|
|
31281
31234
|
// The dialog event bridge intercepts Tab and re-dispatches it as a
|
|
31282
31235
|
// composed keydown; this listener catches the re-dispatched event.
|
|
31283
31236
|
// Enter opens the bib when it is closed.
|
|
31284
|
-
applyKeyboardStrategy$
|
|
31237
|
+
applyKeyboardStrategy$4(this, datepickerKeyboardStrategy);
|
|
31285
31238
|
|
|
31286
31239
|
this.dropdown.addEventListener('auroDropdown-triggerClick', () => {
|
|
31287
31240
|
if (!this.isPopoverVisible) {
|
|
@@ -32366,7 +32319,6 @@ class AuroDatePicker extends AuroElement$5 {
|
|
|
32366
32319
|
.size="${this.size}"
|
|
32367
32320
|
class="${e$3(dropdownElementClassMap)}"
|
|
32368
32321
|
disableEventShow
|
|
32369
|
-
disableFocusTrap
|
|
32370
32322
|
for="dropdownMenu"
|
|
32371
32323
|
part="dropdown"
|
|
32372
32324
|
>
|
|
@@ -33563,6 +33515,57 @@ class IconUtil {
|
|
|
33563
33515
|
}
|
|
33564
33516
|
}
|
|
33565
33517
|
|
|
33518
|
+
/**
|
|
33519
|
+
* Computes display state once per keydown event.
|
|
33520
|
+
* Centralizes null-safety checks and makes the shared/modal/popover branching explicit.
|
|
33521
|
+
*
|
|
33522
|
+
* @param {HTMLElement} component - The component with a dropdown reference.
|
|
33523
|
+
* @param {Object} [options] - Optional config.
|
|
33524
|
+
* @param {HTMLElement} [options.dropdown] - Explicit dropdown reference. Falls back to component.dropdown.
|
|
33525
|
+
* @param {Function} [options.inputResolver] - Called with (component, ctx) to resolve the active input element.
|
|
33526
|
+
* @returns {{isExpanded: boolean, isModal: boolean, isPopover: boolean, activeInput: HTMLElement|null}}
|
|
33527
|
+
* isModal and isPopover reflect the display mode (fullscreen vs not) regardless of expanded state.
|
|
33528
|
+
*/
|
|
33529
|
+
function createDisplayContext$1$2(component, options = {}) {
|
|
33530
|
+
const dd = options.dropdown || component.dropdown;
|
|
33531
|
+
// isPopoverVisible reflects as the `open` attribute.
|
|
33532
|
+
// It reports whether the bib is open in any mode (popover or modal).
|
|
33533
|
+
const isExpanded = Boolean(dd && dd.isPopoverVisible);
|
|
33534
|
+
const isFullscreen = Boolean(dd && dd.isBibFullscreen);
|
|
33535
|
+
|
|
33536
|
+
const ctx = {
|
|
33537
|
+
isExpanded,
|
|
33538
|
+
isModal: isFullscreen,
|
|
33539
|
+
isPopover: !isFullscreen,
|
|
33540
|
+
activeInput: null,
|
|
33541
|
+
};
|
|
33542
|
+
|
|
33543
|
+
if (options.inputResolver) {
|
|
33544
|
+
const resolvedInput = options.inputResolver(component, ctx);
|
|
33545
|
+
// Guard against resolvers returning undefined or non-HTMLElement values.
|
|
33546
|
+
ctx.activeInput = resolvedInput instanceof HTMLElement ? resolvedInput : null;
|
|
33547
|
+
}
|
|
33548
|
+
|
|
33549
|
+
return ctx;
|
|
33550
|
+
}
|
|
33551
|
+
|
|
33552
|
+
/**
|
|
33553
|
+
* Wires up a keydown listener that dispatches to strategy[evt.key] or strategy.default.
|
|
33554
|
+
* Handles both sync and async handlers.
|
|
33555
|
+
* @param {HTMLElement} component - The component to attach the listener to.
|
|
33556
|
+
* @param {Object} strategy - Map of key names to handler functions.
|
|
33557
|
+
* @param {Object} [options] - Optional config passed to createDisplayContext.
|
|
33558
|
+
*/
|
|
33559
|
+
function applyKeyboardStrategy$1$2(component, strategy, options = {}) {
|
|
33560
|
+
component.addEventListener('keydown', async (evt) => {
|
|
33561
|
+
const handler = strategy[evt.key] || strategy.default;
|
|
33562
|
+
if (typeof handler === 'function') {
|
|
33563
|
+
const ctx = createDisplayContext$1$2(component, options);
|
|
33564
|
+
await handler(component, evt, ctx);
|
|
33565
|
+
}
|
|
33566
|
+
});
|
|
33567
|
+
}
|
|
33568
|
+
|
|
33566
33569
|
var plusIcon = {"role":"img","color":"currentColor","title":"","desc":"","width":"var(--auro-size-lg, var(--ds-size-300, 1.5rem))","height":"var(--auro-size-lg, var(--ds-size-300, 1.5rem))","xmlns":"http://www.w3.org/2000/svg","xmlns_xlink":"http://www.w3.org/1999/xlink","viewBox":"0 0 24 24","path":"/icons","style":"ico_squareLarge","type":"icon","name":"plus-lg","category":"interface","svg":"<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" aria-hidden=\"true\" class=\"ico_squareLarge\" role=\"img\" style=\"min-width:var(--auro-size-lg, var(--ds-size-300, 1.5rem));height:var(--auro-size-lg, var(--ds-size-300, 1.5rem));fill:currentColor\" viewBox=\"0 0 24 24\" part=\"svg\"><title/><path d=\"M11.898 5.007 12 5a.75.75 0 0 1 .743.648l.007.102v5.5h5.5a.75.75 0 0 1 .743.648L19 12a.75.75 0 0 1-.648.743l-.102.007h-5.501l.001 5.5a.75.75 0 0 1-.648.743L12 19a.75.75 0 0 1-.743-.648l-.007-.102-.001-5.5H5.75a.75.75 0 0 1-.743-.648L5 12a.75.75 0 0 1 .648-.743l.102-.007h5.5v-5.5a.75.75 0 0 1 .648-.743L12 5z\"/></svg>"};
|
|
33567
33570
|
|
|
33568
33571
|
var minusIcon = {"role":"img","color":"currentColor","title":"","desc":"","width":"var(--auro-size-lg, var(--ds-size-300, 1.5rem))","height":"var(--auro-size-lg, var(--ds-size-300, 1.5rem))","xmlns":"http://www.w3.org/2000/svg","xmlns_xlink":"http://www.w3.org/1999/xlink","viewBox":"0 0 24 24","path":"/icons","style":"ico_squareLarge","type":"icon","name":"minus-lg","category":"interface","deprecated":true,"svg":"<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" aria-hidden=\"true\" class=\"ico_squareLarge\" data-deprecated=\"true\" role=\"img\" style=\"min-width:var(--auro-size-lg, var(--ds-size-300, 1.5rem));height:var(--auro-size-lg, var(--ds-size-300, 1.5rem));fill:currentColor\" viewBox=\"0 0 24 24\" part=\"svg\"><title/><path d=\"M5.75 12.75h12.5a.75.75 0 1 0 0-1.5H5.75a.75.75 0 1 0 0 1.5\"/></svg>"};
|
|
@@ -33799,7 +33802,30 @@ let AuroHelpText$1$2 = class AuroHelpText extends i$4 {
|
|
|
33799
33802
|
}
|
|
33800
33803
|
};
|
|
33801
33804
|
|
|
33802
|
-
var formkitVersion$1$2 = '
|
|
33805
|
+
var formkitVersion$1$2 = '202604012043';
|
|
33806
|
+
|
|
33807
|
+
// Copyright (c) 2026 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
33808
|
+
// See LICENSE in the project root for license information.
|
|
33809
|
+
|
|
33810
|
+
const keyboardStrategy = {
|
|
33811
|
+
ArrowUp(component, _evt) {
|
|
33812
|
+
if (component.disabled) {
|
|
33813
|
+
return;
|
|
33814
|
+
}
|
|
33815
|
+
|
|
33816
|
+
_evt.preventDefault();
|
|
33817
|
+
component.increment();
|
|
33818
|
+
},
|
|
33819
|
+
|
|
33820
|
+
ArrowDown(component, _evt) {
|
|
33821
|
+
if (component.disabled) {
|
|
33822
|
+
return;
|
|
33823
|
+
}
|
|
33824
|
+
|
|
33825
|
+
_evt.preventDefault();
|
|
33826
|
+
component.decrement();
|
|
33827
|
+
}
|
|
33828
|
+
};
|
|
33803
33829
|
|
|
33804
33830
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
33805
33831
|
// See LICENSE in the project root for license information.
|
|
@@ -33873,11 +33899,10 @@ class AuroCounter extends i$4 {
|
|
|
33873
33899
|
|
|
33874
33900
|
connectedCallback() {
|
|
33875
33901
|
super.connectedCallback();
|
|
33876
|
-
this
|
|
33902
|
+
applyKeyboardStrategy$1$2(this, keyboardStrategy);
|
|
33877
33903
|
}
|
|
33878
33904
|
|
|
33879
33905
|
disconnectedCallback() {
|
|
33880
|
-
this.removeEventListener('keydown', this.handleKeyDown);
|
|
33881
33906
|
super.disconnectedCallback();
|
|
33882
33907
|
}
|
|
33883
33908
|
|
|
@@ -34088,29 +34113,6 @@ class AuroCounter extends i$4 {
|
|
|
34088
34113
|
this.validation.validate(this, force);
|
|
34089
34114
|
}
|
|
34090
34115
|
|
|
34091
|
-
/**
|
|
34092
|
-
* Handles the keydown event for the counter component.
|
|
34093
|
-
* @param {KeyboardEvent} event - The keyboard event object.
|
|
34094
|
-
* @returns {void}
|
|
34095
|
-
* @private
|
|
34096
|
-
*/
|
|
34097
|
-
handleKeyDown(event) {
|
|
34098
|
-
if (this.disabled) {
|
|
34099
|
-
return;
|
|
34100
|
-
}
|
|
34101
|
-
|
|
34102
|
-
switch (event.key) {
|
|
34103
|
-
case 'ArrowUp':
|
|
34104
|
-
event.preventDefault();
|
|
34105
|
-
this.increment();
|
|
34106
|
-
break;
|
|
34107
|
-
case 'ArrowDown':
|
|
34108
|
-
event.preventDefault();
|
|
34109
|
-
this.decrement();
|
|
34110
|
-
break;
|
|
34111
|
-
}
|
|
34112
|
-
}
|
|
34113
|
-
|
|
34114
34116
|
firstUpdated() {
|
|
34115
34117
|
this.initValue();
|
|
34116
34118
|
this.setTagAttribute("auro-counter");
|
|
@@ -36313,11 +36315,10 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36313
36315
|
return;
|
|
36314
36316
|
}
|
|
36315
36317
|
|
|
36316
|
-
const { activeElement } = document;
|
|
36317
36318
|
// if focus is still inside of trigger or bib, do not close
|
|
36318
36319
|
if (
|
|
36319
|
-
this.element.
|
|
36320
|
-
this.element.
|
|
36320
|
+
this.element.matches(":focus") ||
|
|
36321
|
+
this.element.matches(":focus-within")
|
|
36321
36322
|
) {
|
|
36322
36323
|
return;
|
|
36323
36324
|
}
|
|
@@ -37156,12 +37157,83 @@ let p$2$2 = class p{registerComponent(t,a){customElements.get(t)||customElements
|
|
|
37156
37157
|
|
|
37157
37158
|
var iconVersion$1$2 = '9.1.2';
|
|
37158
37159
|
|
|
37160
|
+
/**
|
|
37161
|
+
* Computes display state once per keydown event.
|
|
37162
|
+
* Centralizes null-safety checks and makes the shared/modal/popover branching explicit.
|
|
37163
|
+
*
|
|
37164
|
+
* @param {HTMLElement} component - The component with a dropdown reference.
|
|
37165
|
+
* @param {Object} [options] - Optional config.
|
|
37166
|
+
* @param {HTMLElement} [options.dropdown] - Explicit dropdown reference. Falls back to component.dropdown.
|
|
37167
|
+
* @param {Function} [options.inputResolver] - Called with (component, ctx) to resolve the active input element.
|
|
37168
|
+
* @returns {{isExpanded: boolean, isModal: boolean, isPopover: boolean, activeInput: HTMLElement|null}}
|
|
37169
|
+
* isModal and isPopover reflect the display mode (fullscreen vs not) regardless of expanded state.
|
|
37170
|
+
*/
|
|
37171
|
+
function createDisplayContext$3(component, options = {}) {
|
|
37172
|
+
const dd = options.dropdown || component.dropdown;
|
|
37173
|
+
// isPopoverVisible reflects as the `open` attribute.
|
|
37174
|
+
// It reports whether the bib is open in any mode (popover or modal).
|
|
37175
|
+
const isExpanded = Boolean(dd && dd.isPopoverVisible);
|
|
37176
|
+
const isFullscreen = Boolean(dd && dd.isBibFullscreen);
|
|
37177
|
+
|
|
37178
|
+
const ctx = {
|
|
37179
|
+
isExpanded,
|
|
37180
|
+
isModal: isFullscreen,
|
|
37181
|
+
isPopover: !isFullscreen,
|
|
37182
|
+
activeInput: null,
|
|
37183
|
+
};
|
|
37184
|
+
|
|
37185
|
+
if (options.inputResolver) {
|
|
37186
|
+
const resolvedInput = options.inputResolver(component, ctx);
|
|
37187
|
+
// Guard against resolvers returning undefined or non-HTMLElement values.
|
|
37188
|
+
ctx.activeInput = resolvedInput instanceof HTMLElement ? resolvedInput : null;
|
|
37189
|
+
}
|
|
37190
|
+
|
|
37191
|
+
return ctx;
|
|
37192
|
+
}
|
|
37193
|
+
|
|
37194
|
+
/**
|
|
37195
|
+
* Wires up a keydown listener that dispatches to strategy[evt.key] or strategy.default.
|
|
37196
|
+
* Handles both sync and async handlers.
|
|
37197
|
+
* @param {HTMLElement} component - The component to attach the listener to.
|
|
37198
|
+
* @param {Object} strategy - Map of key names to handler functions.
|
|
37199
|
+
* @param {Object} [options] - Optional config passed to createDisplayContext.
|
|
37200
|
+
*/
|
|
37201
|
+
function applyKeyboardStrategy$3(component, strategy, options = {}) {
|
|
37202
|
+
component.addEventListener('keydown', async (evt) => {
|
|
37203
|
+
const handler = strategy[evt.key] || strategy.default;
|
|
37204
|
+
if (typeof handler === 'function') {
|
|
37205
|
+
const ctx = createDisplayContext$3(component, options);
|
|
37206
|
+
await handler(component, evt, ctx);
|
|
37207
|
+
}
|
|
37208
|
+
});
|
|
37209
|
+
}
|
|
37210
|
+
|
|
37159
37211
|
var styleCss$2$5 = i$7`:host{position:fixed;z-index:var(--depth-tooltip, 400);display:none;isolation:isolate}:host dialog{width:auto;max-width:none;height:auto;max-height:none;padding:0;border:none;margin:0;outline:none;transform:translateZ(0)}:host dialog::backdrop{background:transparent}:host(:not([isfullscreen])) dialog{position:relative;inset:unset}:host(:not([isfullscreen])) .container.shape-box{border-radius:unset}:host(:not([isfullscreen])) .container[class*=shape-pill],:host(:not([isfullscreen])) .container[class*=shape-snowflake]{border-radius:30px}:host(:not([isfullscreen])) .container[class*=shape-rounded]{border-radius:16px}:host(:not([matchWidth])) .container{min-width:fit-content}:host([isfullscreen]){position:fixed;top:0;left:0}:host([isfullscreen]) .container{width:100dvw;max-width:none;height:100dvh;max-height:none;border-radius:unset;margin-top:0;box-shadow:unset;overscroll-behavior:contain}:host([isfullscreen]) .container::backdrop{background:var(--ds-color-background-primary, #fff)}:host(:popover-open){position:fixed;overflow:visible;padding:0;border:none;margin:0;background:transparent;inset:unset;outline:none}:host([data-show]){display:flex}:host([common]:not([isfullscreen])) .container,:host([rounded]:not([isfullscreen])) .container{border-radius:var(--ds-border-radius, 0.375rem)}:host([common][isfullscreen]) .container,:host([rounded][isfullscreen]) .container{border-radius:unset;box-shadow:unset}.container{display:inline-block;overflow:auto;box-sizing:border-box;border-radius:var(--ds-border-radius, 0.375rem);margin:var(--ds-size-50, 0.25rem) 0}.util_displayHiddenVisually{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;border:0;margin:-1px;clip-path:inset(50%);white-space:nowrap}`;
|
|
37160
37212
|
|
|
37161
37213
|
var colorCss$2$5 = i$7`.container{background-color:var(--ds-auro-dropdownbib-container-color);box-shadow:var(--ds-auro-dropdownbib-boxshadow-color);color:var(--ds-auro-dropdownbib-text-color)}`;
|
|
37162
37214
|
|
|
37163
37215
|
var tokensCss$1$4 = i$7`:host(:not([ondark])),:host(:not([appearance=inverse])){--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-dropdown-trigger-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-hover-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-bold, #585e67);--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-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdownbib-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdownbib-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}:host([ondark]),:host([appearance=inverse]){--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db);--ds-auro-dropdown-trigger-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-hover-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-inverse, #ffffff);--ds-auro-dropdown-trigger-outline-color: transparent;--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-dropdownbib-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdownbib-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdownbib-text-color: var(--ds-basic-color-texticon-inverse, #ffffff)}`;
|
|
37164
37216
|
|
|
37217
|
+
/**
|
|
37218
|
+
* Creates a keyboard strategy for dialog-specific key handling.
|
|
37219
|
+
* All other keydown behavior is left to the browser's native bubbling path.
|
|
37220
|
+
* @param {HTMLElement} bib - The dropdown bib element.
|
|
37221
|
+
* @returns {Object} Keyboard handlers keyed by `event.key`.
|
|
37222
|
+
*/
|
|
37223
|
+
// eslint-disable-next-line no-unused-vars
|
|
37224
|
+
function createDropdownBibKeyboardStrategy$2(bib) {
|
|
37225
|
+
return {
|
|
37226
|
+
// eslint-disable-next-line no-unused-vars
|
|
37227
|
+
Enter(_dialog, event) {
|
|
37228
|
+
// Floating UI handles Enter key to open the dropdown
|
|
37229
|
+
},
|
|
37230
|
+
// eslint-disable-next-line no-unused-vars
|
|
37231
|
+
Escape(_dialog, event) {
|
|
37232
|
+
// Floating UI handles Escape key to close the dropdown
|
|
37233
|
+
}
|
|
37234
|
+
};
|
|
37235
|
+
}
|
|
37236
|
+
|
|
37165
37237
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
37166
37238
|
// See LICENSE in the project root for license information.
|
|
37167
37239
|
/* eslint-disable max-lines */
|
|
@@ -37286,26 +37358,11 @@ let AuroDropdownBib$2 = class AuroDropdownBib extends i$4 {
|
|
|
37286
37358
|
},
|
|
37287
37359
|
|
|
37288
37360
|
/**
|
|
37289
|
-
*
|
|
37290
|
-
* aria-activedescendant. The dialog keyboard bridge checks this
|
|
37291
|
-
* flag so that Enter selects the highlighted option instead of
|
|
37292
|
-
* activating the focused interactive element (e.g. the trigger
|
|
37293
|
-
* button, or the bibtemplate close button in fullscreen).
|
|
37361
|
+
* Tracks whether a menu option is currently highlighted.
|
|
37294
37362
|
* @private
|
|
37295
37363
|
*/
|
|
37296
37364
|
hasActiveDescendant: {
|
|
37297
37365
|
type: Boolean
|
|
37298
|
-
},
|
|
37299
|
-
|
|
37300
|
-
/**
|
|
37301
|
-
* When true, the keyboard bridge allows native Tab behavior
|
|
37302
|
-
* instead of intercepting it. Set this for bib consumers
|
|
37303
|
-
* (e.g. counter) whose content contains real focusable elements
|
|
37304
|
-
* that need native Tab navigation.
|
|
37305
|
-
* @private
|
|
37306
|
-
*/
|
|
37307
|
-
nativeFocusableContent: {
|
|
37308
|
-
type: Boolean
|
|
37309
37366
|
}
|
|
37310
37367
|
};
|
|
37311
37368
|
}
|
|
@@ -37375,7 +37432,7 @@ let AuroDropdownBib$2 = class AuroDropdownBib extends i$4 {
|
|
|
37375
37432
|
|
|
37376
37433
|
const dialog = this.shadowRoot.querySelector('dialog');
|
|
37377
37434
|
this._setupCancelHandler(dialog);
|
|
37378
|
-
|
|
37435
|
+
applyKeyboardStrategy$3(dialog, createDropdownBibKeyboardStrategy$2());
|
|
37379
37436
|
|
|
37380
37437
|
this.dispatchEvent(new CustomEvent('auro-dropdownbib-connected', {
|
|
37381
37438
|
bubbles: true,
|
|
@@ -37402,98 +37459,6 @@ let AuroDropdownBib$2 = class AuroDropdownBib extends i$4 {
|
|
|
37402
37459
|
});
|
|
37403
37460
|
}
|
|
37404
37461
|
|
|
37405
|
-
/**
|
|
37406
|
-
* showModal() creates a closed focus scope — keyboard events inside
|
|
37407
|
-
* the dialog's shadow DOM do NOT bubble out to the combobox/select
|
|
37408
|
-
* keydown handlers in the parent shadow DOM. This handler bridges
|
|
37409
|
-
* that gap by re-dispatching navigation keys so they cross the
|
|
37410
|
-
* shadow boundary and reach the menu navigation logic in the parent
|
|
37411
|
-
* component.
|
|
37412
|
-
*
|
|
37413
|
-
* The trade-off: intercepting these keys means native keyboard
|
|
37414
|
-
* behaviors that would normally "just work" must be manually
|
|
37415
|
-
* re-implemented here:
|
|
37416
|
-
*
|
|
37417
|
-
* - Enter on buttons: Custom elements (auro-button) don't get the
|
|
37418
|
-
* native Enter→click that <button> provides, so we call .click()
|
|
37419
|
-
* directly when Enter is pressed on a button-like element.
|
|
37420
|
-
*
|
|
37421
|
-
* - Tab: Intercepted and re-dispatched so parent components
|
|
37422
|
-
* (select/combobox) can select the active option and close the
|
|
37423
|
-
* dialog. The <dialog> provides containment and isolation
|
|
37424
|
-
* (inert background, VoiceOver focus trapping, top layer), while
|
|
37425
|
-
* the content inside is a role="listbox" navigated via
|
|
37426
|
-
* aria-activedescendant (options are not focusable). Tab keyboard
|
|
37427
|
-
* behavior follows listbox conventions (select + close) because
|
|
37428
|
-
* the dialog's native Tab trap only cycles between the close
|
|
37429
|
-
* button and browser chrome.
|
|
37430
|
-
*
|
|
37431
|
-
* - Escape: The native <dialog> fires a `cancel` event on ESC
|
|
37432
|
-
* (handled by _setupCancelHandler), so the re-dispatched Escape
|
|
37433
|
-
* is a secondary path for parent components that also listen for
|
|
37434
|
-
* Escape keydown.
|
|
37435
|
-
*
|
|
37436
|
-
* @param {HTMLDialogElement} dialog - The dialog element to attach the keyboard bridge to.
|
|
37437
|
-
* @private
|
|
37438
|
-
*/
|
|
37439
|
-
_setupKeyboardBridge(dialog) {
|
|
37440
|
-
const navKeys = new Set([
|
|
37441
|
-
'ArrowUp',
|
|
37442
|
-
'ArrowDown',
|
|
37443
|
-
'Enter',
|
|
37444
|
-
'Escape',
|
|
37445
|
-
'Tab'
|
|
37446
|
-
]);
|
|
37447
|
-
|
|
37448
|
-
dialog.addEventListener('keydown', (event) => {
|
|
37449
|
-
if (!navKeys.has(event.key)) {
|
|
37450
|
-
return;
|
|
37451
|
-
}
|
|
37452
|
-
|
|
37453
|
-
// Custom elements (auro-button) don't get the native Enter→click
|
|
37454
|
-
// behavior that <button> has. Find the button in the composed path
|
|
37455
|
-
// and click it directly — but only when no menu option is
|
|
37456
|
-
// highlighted. In fullscreen mode focus stays on the close button
|
|
37457
|
-
// while arrow keys move the active-descendant highlight through
|
|
37458
|
-
// the listbox. If the user presses Enter with an option
|
|
37459
|
-
// highlighted, the intent is to select that option, not to click
|
|
37460
|
-
// the close button. In that case we fall through and bridge the
|
|
37461
|
-
// Enter key to the parent component's keyboard strategy.
|
|
37462
|
-
if (event.key === 'Enter') {
|
|
37463
|
-
if (!this.hasActiveDescendant) {
|
|
37464
|
-
const buttonSelector = 'button, [role="button"], auro-button, [auro-button]';
|
|
37465
|
-
const btn = event.composedPath().find((el) => el.matches && el.matches(buttonSelector));
|
|
37466
|
-
if (btn) {
|
|
37467
|
-
event.preventDefault();
|
|
37468
|
-
event.stopPropagation();
|
|
37469
|
-
btn.click();
|
|
37470
|
-
return;
|
|
37471
|
-
}
|
|
37472
|
-
}
|
|
37473
|
-
}
|
|
37474
|
-
|
|
37475
|
-
// Allow native Tab when the bib contains focusable content
|
|
37476
|
-
// (e.g. counter buttons) that needs normal Tab navigation.
|
|
37477
|
-
if (event.key === 'Tab' && this.nativeFocusableContent) {
|
|
37478
|
-
return;
|
|
37479
|
-
}
|
|
37480
|
-
|
|
37481
|
-
event.preventDefault();
|
|
37482
|
-
event.stopPropagation();
|
|
37483
|
-
const newEvent = new KeyboardEvent('keydown', {
|
|
37484
|
-
key: event.key,
|
|
37485
|
-
code: event.code,
|
|
37486
|
-
shiftKey: event.shiftKey,
|
|
37487
|
-
altKey: event.altKey,
|
|
37488
|
-
ctrlKey: event.ctrlKey,
|
|
37489
|
-
metaKey: event.metaKey,
|
|
37490
|
-
bubbles: true,
|
|
37491
|
-
composed: true,
|
|
37492
|
-
cancelable: true
|
|
37493
|
-
});
|
|
37494
|
-
this.dispatchEvent(newEvent);
|
|
37495
|
-
});
|
|
37496
|
-
}
|
|
37497
37462
|
|
|
37498
37463
|
/**
|
|
37499
37464
|
* Blocks touch-driven page scroll while a fullscreen modal dialog is open.
|
|
@@ -37868,7 +37833,7 @@ let AuroHelpText$6 = class AuroHelpText extends i$4 {
|
|
|
37868
37833
|
}
|
|
37869
37834
|
};
|
|
37870
37835
|
|
|
37871
|
-
var formkitVersion$6 = '
|
|
37836
|
+
var formkitVersion$6 = '202604012043';
|
|
37872
37837
|
|
|
37873
37838
|
let AuroElement$1$2 = class AuroElement extends i$4 {
|
|
37874
37839
|
static get properties() {
|
|
@@ -38049,7 +38014,6 @@ let AuroDropdown$2 = class AuroDropdown extends AuroElement$1$2 {
|
|
|
38049
38014
|
this.appearance = 'default';
|
|
38050
38015
|
this.chevron = false;
|
|
38051
38016
|
this.disabled = false;
|
|
38052
|
-
this.disableFocusTrap = false;
|
|
38053
38017
|
this.error = false;
|
|
38054
38018
|
this.tabIndex = 0;
|
|
38055
38019
|
this.noToggle = false;
|
|
@@ -38147,9 +38111,8 @@ let AuroDropdown$2 = class AuroDropdown extends AuroElement$1$2 {
|
|
|
38147
38111
|
// showModal() fires asynchronously via Lit's update cycle, which
|
|
38148
38112
|
// falls outside the user activation window and causes iOS to
|
|
38149
38113
|
// dismiss the keyboard.
|
|
38150
|
-
if (this.
|
|
38151
|
-
|
|
38152
|
-
this.bibElement.value.open(useModal);
|
|
38114
|
+
if (this.bibElement && this.bibElement.value) {
|
|
38115
|
+
this.bibElement.value.open(this.isBibFullscreen);
|
|
38153
38116
|
}
|
|
38154
38117
|
}
|
|
38155
38118
|
|
|
@@ -38262,14 +38225,6 @@ let AuroDropdown$2 = class AuroDropdown extends AuroElement$1$2 {
|
|
|
38262
38225
|
reflect: true
|
|
38263
38226
|
},
|
|
38264
38227
|
|
|
38265
|
-
/**
|
|
38266
|
-
* If declared, the focus trap inside of bib will be turned off.
|
|
38267
|
-
*/
|
|
38268
|
-
disableFocusTrap: {
|
|
38269
|
-
type: Boolean,
|
|
38270
|
-
reflect: true
|
|
38271
|
-
},
|
|
38272
|
-
|
|
38273
38228
|
/**
|
|
38274
38229
|
* @private
|
|
38275
38230
|
*/
|
|
@@ -38543,7 +38498,7 @@ let AuroDropdown$2 = class AuroDropdown extends AuroElement$1$2 {
|
|
|
38543
38498
|
if (this.isPopoverVisible) {
|
|
38544
38499
|
// Fullscreen: use showModal() for native accessibility (inert outside, focus trap)
|
|
38545
38500
|
// Desktop: use show() for Floating UI positioning + FocusTrap for focus management
|
|
38546
|
-
const useModal = this.isBibFullscreen
|
|
38501
|
+
const useModal = this.isBibFullscreen;
|
|
38547
38502
|
this.bibElement.value.open(useModal);
|
|
38548
38503
|
} else {
|
|
38549
38504
|
this.bibElement.value.close();
|
|
@@ -38553,7 +38508,7 @@ let AuroDropdown$2 = class AuroDropdown extends AuroElement$1$2 {
|
|
|
38553
38508
|
// When fullscreen strategy changes while open, re-open dialog with correct mode
|
|
38554
38509
|
// (e.g. resizing from desktop → mobile while dropdown is open)
|
|
38555
38510
|
if (changedProperties.has('isBibFullscreen') && this.isPopoverVisible && this.bibElement.value) {
|
|
38556
|
-
const useModal = this.isBibFullscreen
|
|
38511
|
+
const useModal = this.isBibFullscreen;
|
|
38557
38512
|
this.bibElement.value.close();
|
|
38558
38513
|
this.bibElement.value.open(useModal);
|
|
38559
38514
|
}
|
|
@@ -38665,7 +38620,7 @@ let AuroDropdown$2 = class AuroDropdown extends AuroElement$1$2 {
|
|
|
38665
38620
|
* @private
|
|
38666
38621
|
*/
|
|
38667
38622
|
updateFocusTrap() {
|
|
38668
|
-
if (this.isPopoverVisible
|
|
38623
|
+
if (this.isPopoverVisible) {
|
|
38669
38624
|
if (!this.isBibFullscreen) {
|
|
38670
38625
|
// Desktop: show() doesn't trap focus, so use FocusTrap
|
|
38671
38626
|
this.focusTrap = new FocusTrap$2(this.bibContent);
|
|
@@ -40017,11 +39972,6 @@ class AuroCounterGroup extends AuroElement$4 {
|
|
|
40017
39972
|
|
|
40018
39973
|
// Focus close button when fullscreen dialog opens
|
|
40019
39974
|
this.dropdown.addEventListener('auroDropdown-toggled', () => {
|
|
40020
|
-
// Tell the bib's keyboard bridge to allow native Tab so focus
|
|
40021
|
-
// moves between the real focusable counter elements in the bib.
|
|
40022
|
-
if (this.dropdown.bibContent) {
|
|
40023
|
-
this.dropdown.bibContent.nativeFocusableContent = true;
|
|
40024
|
-
}
|
|
40025
39975
|
if (this.dropdown.isPopoverVisible && this.dropdown.isBibFullscreen) {
|
|
40026
39976
|
doubleRaf$2(() => {
|
|
40027
39977
|
this.bibtemplate.focusCloseButton();
|
|
@@ -40218,7 +40168,6 @@ class AuroCounterGroup extends AuroElement$4 {
|
|
|
40218
40168
|
renderCounterDropdown() {
|
|
40219
40169
|
return u$c`
|
|
40220
40170
|
<${this.dropdownTag}
|
|
40221
|
-
noHideOnThisFocusLoss
|
|
40222
40171
|
chevron
|
|
40223
40172
|
part="dropdown"
|
|
40224
40173
|
appearance="${this.onDark ? 'inverse' : this.appearance}"
|
|
@@ -41944,7 +41893,7 @@ let AuroHelpText$5 = class AuroHelpText extends i$4 {
|
|
|
41944
41893
|
}
|
|
41945
41894
|
};
|
|
41946
41895
|
|
|
41947
|
-
var formkitVersion$5 = '
|
|
41896
|
+
var formkitVersion$5 = '202604012043';
|
|
41948
41897
|
|
|
41949
41898
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
41950
41899
|
// See LICENSE in the project root for license information.
|
|
@@ -44113,7 +44062,7 @@ let AuroHelpText$4 = class AuroHelpText extends i$4 {
|
|
|
44113
44062
|
}
|
|
44114
44063
|
};
|
|
44115
44064
|
|
|
44116
|
-
var formkitVersion$4 = '
|
|
44065
|
+
var formkitVersion$4 = '202604012043';
|
|
44117
44066
|
|
|
44118
44067
|
// Copyright (c) 2026 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
44119
44068
|
// See LICENSE in the project root for license information.
|
|
@@ -45650,7 +45599,7 @@ function restoreTriggerAfterClose$1(dropdown, focusTarget) {
|
|
|
45650
45599
|
* @returns {{isExpanded: boolean, isModal: boolean, isPopover: boolean, activeInput: HTMLElement|null}}
|
|
45651
45600
|
* isModal and isPopover reflect the display mode (fullscreen vs not) regardless of expanded state.
|
|
45652
45601
|
*/
|
|
45653
|
-
function createDisplayContext$1(component, options = {}) {
|
|
45602
|
+
function createDisplayContext$1$1(component, options = {}) {
|
|
45654
45603
|
const dd = options.dropdown || component.dropdown;
|
|
45655
45604
|
// isPopoverVisible reflects as the `open` attribute.
|
|
45656
45605
|
// It reports whether the bib is open in any mode (popover or modal).
|
|
@@ -45680,11 +45629,11 @@ function createDisplayContext$1(component, options = {}) {
|
|
|
45680
45629
|
* @param {Object} strategy - Map of key names to handler functions.
|
|
45681
45630
|
* @param {Object} [options] - Optional config passed to createDisplayContext.
|
|
45682
45631
|
*/
|
|
45683
|
-
function applyKeyboardStrategy$1(component, strategy, options = {}) {
|
|
45632
|
+
function applyKeyboardStrategy$1$1(component, strategy, options = {}) {
|
|
45684
45633
|
component.addEventListener('keydown', async (evt) => {
|
|
45685
45634
|
const handler = strategy[evt.key] || strategy.default;
|
|
45686
45635
|
if (typeof handler === 'function') {
|
|
45687
|
-
const ctx = createDisplayContext$1(component, options);
|
|
45636
|
+
const ctx = createDisplayContext$1$1(component, options);
|
|
45688
45637
|
await handler(component, evt, ctx);
|
|
45689
45638
|
}
|
|
45690
45639
|
});
|
|
@@ -47916,11 +47865,10 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
47916
47865
|
return;
|
|
47917
47866
|
}
|
|
47918
47867
|
|
|
47919
|
-
const { activeElement } = document;
|
|
47920
47868
|
// if focus is still inside of trigger or bib, do not close
|
|
47921
47869
|
if (
|
|
47922
|
-
this.element.
|
|
47923
|
-
this.element.
|
|
47870
|
+
this.element.matches(":focus") ||
|
|
47871
|
+
this.element.matches(":focus-within")
|
|
47924
47872
|
) {
|
|
47925
47873
|
return;
|
|
47926
47874
|
}
|
|
@@ -48759,12 +48707,83 @@ let p$3$1 = class p{registerComponent(t,a){customElements.get(t)||customElements
|
|
|
48759
48707
|
|
|
48760
48708
|
var iconVersion$2$1 = '9.1.2';
|
|
48761
48709
|
|
|
48710
|
+
/**
|
|
48711
|
+
* Computes display state once per keydown event.
|
|
48712
|
+
* Centralizes null-safety checks and makes the shared/modal/popover branching explicit.
|
|
48713
|
+
*
|
|
48714
|
+
* @param {HTMLElement} component - The component with a dropdown reference.
|
|
48715
|
+
* @param {Object} [options] - Optional config.
|
|
48716
|
+
* @param {HTMLElement} [options.dropdown] - Explicit dropdown reference. Falls back to component.dropdown.
|
|
48717
|
+
* @param {Function} [options.inputResolver] - Called with (component, ctx) to resolve the active input element.
|
|
48718
|
+
* @returns {{isExpanded: boolean, isModal: boolean, isPopover: boolean, activeInput: HTMLElement|null}}
|
|
48719
|
+
* isModal and isPopover reflect the display mode (fullscreen vs not) regardless of expanded state.
|
|
48720
|
+
*/
|
|
48721
|
+
function createDisplayContext$2(component, options = {}) {
|
|
48722
|
+
const dd = options.dropdown || component.dropdown;
|
|
48723
|
+
// isPopoverVisible reflects as the `open` attribute.
|
|
48724
|
+
// It reports whether the bib is open in any mode (popover or modal).
|
|
48725
|
+
const isExpanded = Boolean(dd && dd.isPopoverVisible);
|
|
48726
|
+
const isFullscreen = Boolean(dd && dd.isBibFullscreen);
|
|
48727
|
+
|
|
48728
|
+
const ctx = {
|
|
48729
|
+
isExpanded,
|
|
48730
|
+
isModal: isFullscreen,
|
|
48731
|
+
isPopover: !isFullscreen,
|
|
48732
|
+
activeInput: null,
|
|
48733
|
+
};
|
|
48734
|
+
|
|
48735
|
+
if (options.inputResolver) {
|
|
48736
|
+
const resolvedInput = options.inputResolver(component, ctx);
|
|
48737
|
+
// Guard against resolvers returning undefined or non-HTMLElement values.
|
|
48738
|
+
ctx.activeInput = resolvedInput instanceof HTMLElement ? resolvedInput : null;
|
|
48739
|
+
}
|
|
48740
|
+
|
|
48741
|
+
return ctx;
|
|
48742
|
+
}
|
|
48743
|
+
|
|
48744
|
+
/**
|
|
48745
|
+
* Wires up a keydown listener that dispatches to strategy[evt.key] or strategy.default.
|
|
48746
|
+
* Handles both sync and async handlers.
|
|
48747
|
+
* @param {HTMLElement} component - The component to attach the listener to.
|
|
48748
|
+
* @param {Object} strategy - Map of key names to handler functions.
|
|
48749
|
+
* @param {Object} [options] - Optional config passed to createDisplayContext.
|
|
48750
|
+
*/
|
|
48751
|
+
function applyKeyboardStrategy$2(component, strategy, options = {}) {
|
|
48752
|
+
component.addEventListener('keydown', async (evt) => {
|
|
48753
|
+
const handler = strategy[evt.key] || strategy.default;
|
|
48754
|
+
if (typeof handler === 'function') {
|
|
48755
|
+
const ctx = createDisplayContext$2(component, options);
|
|
48756
|
+
await handler(component, evt, ctx);
|
|
48757
|
+
}
|
|
48758
|
+
});
|
|
48759
|
+
}
|
|
48760
|
+
|
|
48762
48761
|
var styleCss$2$1$1 = i$7`:host{position:fixed;z-index:var(--depth-tooltip, 400);display:none;isolation:isolate}:host dialog{width:auto;max-width:none;height:auto;max-height:none;padding:0;border:none;margin:0;outline:none;transform:translateZ(0)}:host dialog::backdrop{background:transparent}:host(:not([isfullscreen])) dialog{position:relative;inset:unset}:host(:not([isfullscreen])) .container.shape-box{border-radius:unset}:host(:not([isfullscreen])) .container[class*=shape-pill],:host(:not([isfullscreen])) .container[class*=shape-snowflake]{border-radius:30px}:host(:not([isfullscreen])) .container[class*=shape-rounded]{border-radius:16px}:host(:not([matchWidth])) .container{min-width:fit-content}:host([isfullscreen]){position:fixed;top:0;left:0}:host([isfullscreen]) .container{width:100dvw;max-width:none;height:100dvh;max-height:none;border-radius:unset;margin-top:0;box-shadow:unset;overscroll-behavior:contain}:host([isfullscreen]) .container::backdrop{background:var(--ds-color-background-primary, #fff)}:host(:popover-open){position:fixed;overflow:visible;padding:0;border:none;margin:0;background:transparent;inset:unset;outline:none}:host([data-show]){display:flex}:host([common]:not([isfullscreen])) .container,:host([rounded]:not([isfullscreen])) .container{border-radius:var(--ds-border-radius, 0.375rem)}:host([common][isfullscreen]) .container,:host([rounded][isfullscreen]) .container{border-radius:unset;box-shadow:unset}.container{display:inline-block;overflow:auto;box-sizing:border-box;border-radius:var(--ds-border-radius, 0.375rem);margin:var(--ds-size-50, 0.25rem) 0}.util_displayHiddenVisually{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;border:0;margin:-1px;clip-path:inset(50%);white-space:nowrap}`;
|
|
48763
48762
|
|
|
48764
48763
|
var colorCss$2$1 = i$7`.container{background-color:var(--ds-auro-dropdownbib-container-color);box-shadow:var(--ds-auro-dropdownbib-boxshadow-color);color:var(--ds-auro-dropdownbib-text-color)}`;
|
|
48765
48764
|
|
|
48766
48765
|
var tokensCss$1$1 = i$7`:host(:not([ondark])),:host(:not([appearance=inverse])){--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-dropdown-trigger-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-hover-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-bold, #585e67);--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-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdownbib-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdownbib-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}:host([ondark]),:host([appearance=inverse]){--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db);--ds-auro-dropdown-trigger-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-hover-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-inverse, #ffffff);--ds-auro-dropdown-trigger-outline-color: transparent;--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-dropdownbib-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdownbib-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdownbib-text-color: var(--ds-basic-color-texticon-inverse, #ffffff)}`;
|
|
48767
48766
|
|
|
48767
|
+
/**
|
|
48768
|
+
* Creates a keyboard strategy for dialog-specific key handling.
|
|
48769
|
+
* All other keydown behavior is left to the browser's native bubbling path.
|
|
48770
|
+
* @param {HTMLElement} bib - The dropdown bib element.
|
|
48771
|
+
* @returns {Object} Keyboard handlers keyed by `event.key`.
|
|
48772
|
+
*/
|
|
48773
|
+
// eslint-disable-next-line no-unused-vars
|
|
48774
|
+
function createDropdownBibKeyboardStrategy$1(bib) {
|
|
48775
|
+
return {
|
|
48776
|
+
// eslint-disable-next-line no-unused-vars
|
|
48777
|
+
Enter(_dialog, event) {
|
|
48778
|
+
// Floating UI handles Enter key to open the dropdown
|
|
48779
|
+
},
|
|
48780
|
+
// eslint-disable-next-line no-unused-vars
|
|
48781
|
+
Escape(_dialog, event) {
|
|
48782
|
+
// Floating UI handles Escape key to close the dropdown
|
|
48783
|
+
}
|
|
48784
|
+
};
|
|
48785
|
+
}
|
|
48786
|
+
|
|
48768
48787
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
48769
48788
|
// See LICENSE in the project root for license information.
|
|
48770
48789
|
/* eslint-disable max-lines */
|
|
@@ -48889,26 +48908,11 @@ let AuroDropdownBib$1 = class AuroDropdownBib extends i$4 {
|
|
|
48889
48908
|
},
|
|
48890
48909
|
|
|
48891
48910
|
/**
|
|
48892
|
-
*
|
|
48893
|
-
* aria-activedescendant. The dialog keyboard bridge checks this
|
|
48894
|
-
* flag so that Enter selects the highlighted option instead of
|
|
48895
|
-
* activating the focused interactive element (e.g. the trigger
|
|
48896
|
-
* button, or the bibtemplate close button in fullscreen).
|
|
48911
|
+
* Tracks whether a menu option is currently highlighted.
|
|
48897
48912
|
* @private
|
|
48898
48913
|
*/
|
|
48899
48914
|
hasActiveDescendant: {
|
|
48900
48915
|
type: Boolean
|
|
48901
|
-
},
|
|
48902
|
-
|
|
48903
|
-
/**
|
|
48904
|
-
* When true, the keyboard bridge allows native Tab behavior
|
|
48905
|
-
* instead of intercepting it. Set this for bib consumers
|
|
48906
|
-
* (e.g. counter) whose content contains real focusable elements
|
|
48907
|
-
* that need native Tab navigation.
|
|
48908
|
-
* @private
|
|
48909
|
-
*/
|
|
48910
|
-
nativeFocusableContent: {
|
|
48911
|
-
type: Boolean
|
|
48912
48916
|
}
|
|
48913
48917
|
};
|
|
48914
48918
|
}
|
|
@@ -48978,7 +48982,7 @@ let AuroDropdownBib$1 = class AuroDropdownBib extends i$4 {
|
|
|
48978
48982
|
|
|
48979
48983
|
const dialog = this.shadowRoot.querySelector('dialog');
|
|
48980
48984
|
this._setupCancelHandler(dialog);
|
|
48981
|
-
|
|
48985
|
+
applyKeyboardStrategy$2(dialog, createDropdownBibKeyboardStrategy$1());
|
|
48982
48986
|
|
|
48983
48987
|
this.dispatchEvent(new CustomEvent('auro-dropdownbib-connected', {
|
|
48984
48988
|
bubbles: true,
|
|
@@ -49005,98 +49009,6 @@ let AuroDropdownBib$1 = class AuroDropdownBib extends i$4 {
|
|
|
49005
49009
|
});
|
|
49006
49010
|
}
|
|
49007
49011
|
|
|
49008
|
-
/**
|
|
49009
|
-
* showModal() creates a closed focus scope — keyboard events inside
|
|
49010
|
-
* the dialog's shadow DOM do NOT bubble out to the combobox/select
|
|
49011
|
-
* keydown handlers in the parent shadow DOM. This handler bridges
|
|
49012
|
-
* that gap by re-dispatching navigation keys so they cross the
|
|
49013
|
-
* shadow boundary and reach the menu navigation logic in the parent
|
|
49014
|
-
* component.
|
|
49015
|
-
*
|
|
49016
|
-
* The trade-off: intercepting these keys means native keyboard
|
|
49017
|
-
* behaviors that would normally "just work" must be manually
|
|
49018
|
-
* re-implemented here:
|
|
49019
|
-
*
|
|
49020
|
-
* - Enter on buttons: Custom elements (auro-button) don't get the
|
|
49021
|
-
* native Enter→click that <button> provides, so we call .click()
|
|
49022
|
-
* directly when Enter is pressed on a button-like element.
|
|
49023
|
-
*
|
|
49024
|
-
* - Tab: Intercepted and re-dispatched so parent components
|
|
49025
|
-
* (select/combobox) can select the active option and close the
|
|
49026
|
-
* dialog. The <dialog> provides containment and isolation
|
|
49027
|
-
* (inert background, VoiceOver focus trapping, top layer), while
|
|
49028
|
-
* the content inside is a role="listbox" navigated via
|
|
49029
|
-
* aria-activedescendant (options are not focusable). Tab keyboard
|
|
49030
|
-
* behavior follows listbox conventions (select + close) because
|
|
49031
|
-
* the dialog's native Tab trap only cycles between the close
|
|
49032
|
-
* button and browser chrome.
|
|
49033
|
-
*
|
|
49034
|
-
* - Escape: The native <dialog> fires a `cancel` event on ESC
|
|
49035
|
-
* (handled by _setupCancelHandler), so the re-dispatched Escape
|
|
49036
|
-
* is a secondary path for parent components that also listen for
|
|
49037
|
-
* Escape keydown.
|
|
49038
|
-
*
|
|
49039
|
-
* @param {HTMLDialogElement} dialog - The dialog element to attach the keyboard bridge to.
|
|
49040
|
-
* @private
|
|
49041
|
-
*/
|
|
49042
|
-
_setupKeyboardBridge(dialog) {
|
|
49043
|
-
const navKeys = new Set([
|
|
49044
|
-
'ArrowUp',
|
|
49045
|
-
'ArrowDown',
|
|
49046
|
-
'Enter',
|
|
49047
|
-
'Escape',
|
|
49048
|
-
'Tab'
|
|
49049
|
-
]);
|
|
49050
|
-
|
|
49051
|
-
dialog.addEventListener('keydown', (event) => {
|
|
49052
|
-
if (!navKeys.has(event.key)) {
|
|
49053
|
-
return;
|
|
49054
|
-
}
|
|
49055
|
-
|
|
49056
|
-
// Custom elements (auro-button) don't get the native Enter→click
|
|
49057
|
-
// behavior that <button> has. Find the button in the composed path
|
|
49058
|
-
// and click it directly — but only when no menu option is
|
|
49059
|
-
// highlighted. In fullscreen mode focus stays on the close button
|
|
49060
|
-
// while arrow keys move the active-descendant highlight through
|
|
49061
|
-
// the listbox. If the user presses Enter with an option
|
|
49062
|
-
// highlighted, the intent is to select that option, not to click
|
|
49063
|
-
// the close button. In that case we fall through and bridge the
|
|
49064
|
-
// Enter key to the parent component's keyboard strategy.
|
|
49065
|
-
if (event.key === 'Enter') {
|
|
49066
|
-
if (!this.hasActiveDescendant) {
|
|
49067
|
-
const buttonSelector = 'button, [role="button"], auro-button, [auro-button]';
|
|
49068
|
-
const btn = event.composedPath().find((el) => el.matches && el.matches(buttonSelector));
|
|
49069
|
-
if (btn) {
|
|
49070
|
-
event.preventDefault();
|
|
49071
|
-
event.stopPropagation();
|
|
49072
|
-
btn.click();
|
|
49073
|
-
return;
|
|
49074
|
-
}
|
|
49075
|
-
}
|
|
49076
|
-
}
|
|
49077
|
-
|
|
49078
|
-
// Allow native Tab when the bib contains focusable content
|
|
49079
|
-
// (e.g. counter buttons) that needs normal Tab navigation.
|
|
49080
|
-
if (event.key === 'Tab' && this.nativeFocusableContent) {
|
|
49081
|
-
return;
|
|
49082
|
-
}
|
|
49083
|
-
|
|
49084
|
-
event.preventDefault();
|
|
49085
|
-
event.stopPropagation();
|
|
49086
|
-
const newEvent = new KeyboardEvent('keydown', {
|
|
49087
|
-
key: event.key,
|
|
49088
|
-
code: event.code,
|
|
49089
|
-
shiftKey: event.shiftKey,
|
|
49090
|
-
altKey: event.altKey,
|
|
49091
|
-
ctrlKey: event.ctrlKey,
|
|
49092
|
-
metaKey: event.metaKey,
|
|
49093
|
-
bubbles: true,
|
|
49094
|
-
composed: true,
|
|
49095
|
-
cancelable: true
|
|
49096
|
-
});
|
|
49097
|
-
this.dispatchEvent(newEvent);
|
|
49098
|
-
});
|
|
49099
|
-
}
|
|
49100
49012
|
|
|
49101
49013
|
/**
|
|
49102
49014
|
* Blocks touch-driven page scroll while a fullscreen modal dialog is open.
|
|
@@ -49471,7 +49383,7 @@ let AuroHelpText$2 = class AuroHelpText extends i$4 {
|
|
|
49471
49383
|
}
|
|
49472
49384
|
};
|
|
49473
49385
|
|
|
49474
|
-
var formkitVersion$2 = '
|
|
49386
|
+
var formkitVersion$2 = '202604012043';
|
|
49475
49387
|
|
|
49476
49388
|
let AuroElement$2$1 = class AuroElement extends i$4 {
|
|
49477
49389
|
static get properties() {
|
|
@@ -49652,7 +49564,6 @@ let AuroDropdown$1 = class AuroDropdown extends AuroElement$2$1 {
|
|
|
49652
49564
|
this.appearance = 'default';
|
|
49653
49565
|
this.chevron = false;
|
|
49654
49566
|
this.disabled = false;
|
|
49655
|
-
this.disableFocusTrap = false;
|
|
49656
49567
|
this.error = false;
|
|
49657
49568
|
this.tabIndex = 0;
|
|
49658
49569
|
this.noToggle = false;
|
|
@@ -49750,9 +49661,8 @@ let AuroDropdown$1 = class AuroDropdown extends AuroElement$2$1 {
|
|
|
49750
49661
|
// showModal() fires asynchronously via Lit's update cycle, which
|
|
49751
49662
|
// falls outside the user activation window and causes iOS to
|
|
49752
49663
|
// dismiss the keyboard.
|
|
49753
|
-
if (this.
|
|
49754
|
-
|
|
49755
|
-
this.bibElement.value.open(useModal);
|
|
49664
|
+
if (this.bibElement && this.bibElement.value) {
|
|
49665
|
+
this.bibElement.value.open(this.isBibFullscreen);
|
|
49756
49666
|
}
|
|
49757
49667
|
}
|
|
49758
49668
|
|
|
@@ -49865,14 +49775,6 @@ let AuroDropdown$1 = class AuroDropdown extends AuroElement$2$1 {
|
|
|
49865
49775
|
reflect: true
|
|
49866
49776
|
},
|
|
49867
49777
|
|
|
49868
|
-
/**
|
|
49869
|
-
* If declared, the focus trap inside of bib will be turned off.
|
|
49870
|
-
*/
|
|
49871
|
-
disableFocusTrap: {
|
|
49872
|
-
type: Boolean,
|
|
49873
|
-
reflect: true
|
|
49874
|
-
},
|
|
49875
|
-
|
|
49876
49778
|
/**
|
|
49877
49779
|
* @private
|
|
49878
49780
|
*/
|
|
@@ -50146,7 +50048,7 @@ let AuroDropdown$1 = class AuroDropdown extends AuroElement$2$1 {
|
|
|
50146
50048
|
if (this.isPopoverVisible) {
|
|
50147
50049
|
// Fullscreen: use showModal() for native accessibility (inert outside, focus trap)
|
|
50148
50050
|
// Desktop: use show() for Floating UI positioning + FocusTrap for focus management
|
|
50149
|
-
const useModal = this.isBibFullscreen
|
|
50051
|
+
const useModal = this.isBibFullscreen;
|
|
50150
50052
|
this.bibElement.value.open(useModal);
|
|
50151
50053
|
} else {
|
|
50152
50054
|
this.bibElement.value.close();
|
|
@@ -50156,7 +50058,7 @@ let AuroDropdown$1 = class AuroDropdown extends AuroElement$2$1 {
|
|
|
50156
50058
|
// When fullscreen strategy changes while open, re-open dialog with correct mode
|
|
50157
50059
|
// (e.g. resizing from desktop → mobile while dropdown is open)
|
|
50158
50060
|
if (changedProperties.has('isBibFullscreen') && this.isPopoverVisible && this.bibElement.value) {
|
|
50159
|
-
const useModal = this.isBibFullscreen
|
|
50061
|
+
const useModal = this.isBibFullscreen;
|
|
50160
50062
|
this.bibElement.value.close();
|
|
50161
50063
|
this.bibElement.value.open(useModal);
|
|
50162
50064
|
}
|
|
@@ -50268,7 +50170,7 @@ let AuroDropdown$1 = class AuroDropdown extends AuroElement$2$1 {
|
|
|
50268
50170
|
* @private
|
|
50269
50171
|
*/
|
|
50270
50172
|
updateFocusTrap() {
|
|
50271
|
-
if (this.isPopoverVisible
|
|
50173
|
+
if (this.isPopoverVisible) {
|
|
50272
50174
|
if (!this.isBibFullscreen) {
|
|
50273
50175
|
// Desktop: show() doesn't trap focus, so use FocusTrap
|
|
50274
50176
|
this.focusTrap = new FocusTrap$1(this.bibContent);
|
|
@@ -57228,7 +57130,7 @@ let AuroHelpText$1$1 = class AuroHelpText extends i$4 {
|
|
|
57228
57130
|
}
|
|
57229
57131
|
};
|
|
57230
57132
|
|
|
57231
|
-
var formkitVersion$1$1 = '
|
|
57133
|
+
var formkitVersion$1$1 = '202604012043';
|
|
57232
57134
|
|
|
57233
57135
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
57234
57136
|
// See LICENSE in the project root for license information.
|
|
@@ -58267,7 +58169,7 @@ let AuroBibtemplate$1 = class AuroBibtemplate extends i$4 {
|
|
|
58267
58169
|
}
|
|
58268
58170
|
};
|
|
58269
58171
|
|
|
58270
|
-
var formkitVersion$3 = '
|
|
58172
|
+
var formkitVersion$3 = '202604012043';
|
|
58271
58173
|
|
|
58272
58174
|
var styleCss$1$3 = i$7`.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}:host{display:block;text-align:left}:host [auro-dropdown]{--ds-auro-dropdown-trigger-background-color: transparent}:host #inputInBib::part(wrapper){box-shadow:none}:host #inputInBib::part(accent-left){display:none}:host([layout*=classic]) [auro-input]{width:100%}:host([layout*=classic]) [auro-input]::part(helpText){display:none}:host([layout*=classic]) #slotHolder{display:none}`;
|
|
58273
58175
|
|
|
@@ -59761,7 +59663,7 @@ class AuroCombobox extends AuroElement$3 {
|
|
|
59761
59663
|
* @returns {void}
|
|
59762
59664
|
*/
|
|
59763
59665
|
configureCombobox() {
|
|
59764
|
-
applyKeyboardStrategy$1(this, comboboxKeyboardStrategy, {
|
|
59666
|
+
applyKeyboardStrategy$1$1(this, comboboxKeyboardStrategy, {
|
|
59765
59667
|
// In modal mode the input moves into the bib; route keyboard events to that element instead.
|
|
59766
59668
|
inputResolver: (comp, ctx) => (ctx.isModal && comp.inputInBib ? comp.inputInBib : comp.input),
|
|
59767
59669
|
});
|
|
@@ -61764,10 +61666,10 @@ class AuroMenu extends AuroElement$2 {
|
|
|
61764
61666
|
|
|
61765
61667
|
// Event Bindings
|
|
61766
61668
|
|
|
61767
|
-
/**
|
|
61768
|
-
|
|
61769
|
-
|
|
61770
|
-
this.handleKeyDown = this.handleKeyDown.bind(this);
|
|
61669
|
+
// /**
|
|
61670
|
+
// * @private
|
|
61671
|
+
// */
|
|
61672
|
+
// this.handleKeyDown = this.handleKeyDown.bind(this);
|
|
61771
61673
|
|
|
61772
61674
|
|
|
61773
61675
|
/**
|
|
@@ -62016,6 +61918,13 @@ class AuroMenu extends AuroElement$2 {
|
|
|
62016
61918
|
* @protected
|
|
62017
61919
|
*/
|
|
62018
61920
|
provideContext() {
|
|
61921
|
+
if (this.parentElement && this.parentElement.closest('auro-menu, [auro-menu]')) {
|
|
61922
|
+
this.rootMenu = false;
|
|
61923
|
+
this.menuService = this.parentElement.menuService;
|
|
61924
|
+
this._contextProvider = this.parentElement._contextProvider;
|
|
61925
|
+
return;
|
|
61926
|
+
}
|
|
61927
|
+
|
|
62019
61928
|
this.menuService = new MenuService({host: this});
|
|
62020
61929
|
this.menuService.setProperties(this.propertyValues);
|
|
62021
61930
|
this.menuService.subscribe(this.handleMenuChange.bind(this));
|
|
@@ -62109,7 +62018,7 @@ class AuroMenu extends AuroElement$2 {
|
|
|
62109
62018
|
|
|
62110
62019
|
this.provideContext();
|
|
62111
62020
|
|
|
62112
|
-
this.addEventListener('keydown', this.handleKeyDown);
|
|
62021
|
+
// this.addEventListener('keydown', this.handleKeyDown);
|
|
62113
62022
|
this.addEventListener('auroMenuOption-click', this.handleMouseSelect);
|
|
62114
62023
|
this.addEventListener('auroMenuOption-mouseover', this.handleOptionHover);
|
|
62115
62024
|
this.addEventListener('slotchange', this.handleSlotChange);
|
|
@@ -62117,7 +62026,7 @@ class AuroMenu extends AuroElement$2 {
|
|
|
62117
62026
|
}
|
|
62118
62027
|
|
|
62119
62028
|
disconnectedCallback() {
|
|
62120
|
-
this.removeEventListener('keydown', this.handleKeyDown);
|
|
62029
|
+
// this.removeEventListener('keydown', this.handleKeyDown);
|
|
62121
62030
|
this.removeEventListener('auroMenuOption-click', this.handleMouseSelect);
|
|
62122
62031
|
this.removeEventListener('auroMenuOption-mouseover', this.handleOptionHover);
|
|
62123
62032
|
this.removeEventListener('slotchange', this.handleSlotChange);
|
|
@@ -62198,9 +62107,9 @@ class AuroMenu extends AuroElement$2 {
|
|
|
62198
62107
|
if (this.multiSelect) {
|
|
62199
62108
|
this.setAttribute('aria-multiselectable', 'true');
|
|
62200
62109
|
}
|
|
62201
|
-
|
|
62202
|
-
this.handleNestedMenus(this);
|
|
62203
62110
|
}
|
|
62111
|
+
|
|
62112
|
+
this.handleNestedMenus(this);
|
|
62204
62113
|
}
|
|
62205
62114
|
|
|
62206
62115
|
/**
|
|
@@ -62258,26 +62167,33 @@ class AuroMenu extends AuroElement$2 {
|
|
|
62258
62167
|
|
|
62259
62168
|
// Event Handlers
|
|
62260
62169
|
|
|
62261
|
-
/**
|
|
62262
|
-
|
|
62263
|
-
|
|
62264
|
-
|
|
62265
|
-
|
|
62266
|
-
handleKeyDown(event) {
|
|
62267
|
-
|
|
62268
|
-
|
|
62269
|
-
|
|
62270
|
-
|
|
62271
|
-
|
|
62272
|
-
|
|
62273
|
-
|
|
62274
|
-
|
|
62275
|
-
|
|
62276
|
-
|
|
62277
|
-
|
|
62278
|
-
|
|
62279
|
-
|
|
62280
|
-
|
|
62170
|
+
// /**
|
|
62171
|
+
// * Handles keyboard navigation.
|
|
62172
|
+
// * @private
|
|
62173
|
+
// * @param {KeyboardEvent} event - Event object from the browser.
|
|
62174
|
+
// */
|
|
62175
|
+
// handleKeyDown(event) {
|
|
62176
|
+
// // Update to Chris keyboard handler
|
|
62177
|
+
// // We have a new "navigateArrow" function in that handler, maybe that replaces those keys here?
|
|
62178
|
+
// event.preventDefault();
|
|
62179
|
+
// switch (event.key) {
|
|
62180
|
+
// case "ArrowDown":
|
|
62181
|
+
// console.warn("ArrowDown key is pressed and heard from menu");
|
|
62182
|
+
// this.menuService.highlightNext();
|
|
62183
|
+
// break;
|
|
62184
|
+
// case "ArrowUp":
|
|
62185
|
+
// console.warn("ArrowUp key is pressed and heard from menu");
|
|
62186
|
+
// this.menuService.highlightPrevious();
|
|
62187
|
+
// break;
|
|
62188
|
+
// case "Tab":
|
|
62189
|
+
// case "Enter":
|
|
62190
|
+
// this.menuService.selectHighlightedOption();
|
|
62191
|
+
// // Does this need to get separated into two cases to handle the different expected behavior of tab vs enter?
|
|
62192
|
+
// break;
|
|
62193
|
+
// default:
|
|
62194
|
+
// break;
|
|
62195
|
+
// }
|
|
62196
|
+
// }
|
|
62281
62197
|
|
|
62282
62198
|
/**
|
|
62283
62199
|
* Navigates the menu options in the specified direction.
|
|
@@ -62297,10 +62213,6 @@ class AuroMenu extends AuroElement$2 {
|
|
|
62297
62213
|
* @private
|
|
62298
62214
|
*/
|
|
62299
62215
|
handleSlotChange() {
|
|
62300
|
-
if (this.parentElement && this.parentElement.closest('auro-menu, [auro-menu]')) {
|
|
62301
|
-
this.rootMenu = false;
|
|
62302
|
-
}
|
|
62303
|
-
|
|
62304
62216
|
if (this.rootMenu) {
|
|
62305
62217
|
this.initializeMenu();
|
|
62306
62218
|
}
|
|
@@ -63585,7 +63497,7 @@ function restoreTriggerAfterClose(dropdown, focusTarget) {
|
|
|
63585
63497
|
* @returns {{isExpanded: boolean, isModal: boolean, isPopover: boolean, activeInput: HTMLElement|null}}
|
|
63586
63498
|
* isModal and isPopover reflect the display mode (fullscreen vs not) regardless of expanded state.
|
|
63587
63499
|
*/
|
|
63588
|
-
function createDisplayContext(component, options = {}) {
|
|
63500
|
+
function createDisplayContext$1(component, options = {}) {
|
|
63589
63501
|
const dd = options.dropdown || component.dropdown;
|
|
63590
63502
|
// isPopoverVisible reflects as the `open` attribute.
|
|
63591
63503
|
// It reports whether the bib is open in any mode (popover or modal).
|
|
@@ -63615,11 +63527,11 @@ function createDisplayContext(component, options = {}) {
|
|
|
63615
63527
|
* @param {Object} strategy - Map of key names to handler functions.
|
|
63616
63528
|
* @param {Object} [options] - Optional config passed to createDisplayContext.
|
|
63617
63529
|
*/
|
|
63618
|
-
function applyKeyboardStrategy(component, strategy, options = {}) {
|
|
63530
|
+
function applyKeyboardStrategy$1(component, strategy, options = {}) {
|
|
63619
63531
|
component.addEventListener('keydown', async (evt) => {
|
|
63620
63532
|
const handler = strategy[evt.key] || strategy.default;
|
|
63621
63533
|
if (typeof handler === 'function') {
|
|
63622
|
-
const ctx = createDisplayContext(component, options);
|
|
63534
|
+
const ctx = createDisplayContext$1(component, options);
|
|
63623
63535
|
await handler(component, evt, ctx);
|
|
63624
63536
|
}
|
|
63625
63537
|
});
|
|
@@ -65783,11 +65695,10 @@ class AuroFloatingUI {
|
|
|
65783
65695
|
return;
|
|
65784
65696
|
}
|
|
65785
65697
|
|
|
65786
|
-
const { activeElement } = document;
|
|
65787
65698
|
// if focus is still inside of trigger or bib, do not close
|
|
65788
65699
|
if (
|
|
65789
|
-
this.element.
|
|
65790
|
-
this.element.
|
|
65700
|
+
this.element.matches(":focus") ||
|
|
65701
|
+
this.element.matches(":focus-within")
|
|
65791
65702
|
) {
|
|
65792
65703
|
return;
|
|
65793
65704
|
}
|
|
@@ -66626,12 +66537,83 @@ let p$2 = class p{registerComponent(t,a){customElements.get(t)||customElements.d
|
|
|
66626
66537
|
|
|
66627
66538
|
var iconVersion$1 = '9.1.2';
|
|
66628
66539
|
|
|
66540
|
+
/**
|
|
66541
|
+
* Computes display state once per keydown event.
|
|
66542
|
+
* Centralizes null-safety checks and makes the shared/modal/popover branching explicit.
|
|
66543
|
+
*
|
|
66544
|
+
* @param {HTMLElement} component - The component with a dropdown reference.
|
|
66545
|
+
* @param {Object} [options] - Optional config.
|
|
66546
|
+
* @param {HTMLElement} [options.dropdown] - Explicit dropdown reference. Falls back to component.dropdown.
|
|
66547
|
+
* @param {Function} [options.inputResolver] - Called with (component, ctx) to resolve the active input element.
|
|
66548
|
+
* @returns {{isExpanded: boolean, isModal: boolean, isPopover: boolean, activeInput: HTMLElement|null}}
|
|
66549
|
+
* isModal and isPopover reflect the display mode (fullscreen vs not) regardless of expanded state.
|
|
66550
|
+
*/
|
|
66551
|
+
function createDisplayContext(component, options = {}) {
|
|
66552
|
+
const dd = options.dropdown || component.dropdown;
|
|
66553
|
+
// isPopoverVisible reflects as the `open` attribute.
|
|
66554
|
+
// It reports whether the bib is open in any mode (popover or modal).
|
|
66555
|
+
const isExpanded = Boolean(dd && dd.isPopoverVisible);
|
|
66556
|
+
const isFullscreen = Boolean(dd && dd.isBibFullscreen);
|
|
66557
|
+
|
|
66558
|
+
const ctx = {
|
|
66559
|
+
isExpanded,
|
|
66560
|
+
isModal: isFullscreen,
|
|
66561
|
+
isPopover: !isFullscreen,
|
|
66562
|
+
activeInput: null,
|
|
66563
|
+
};
|
|
66564
|
+
|
|
66565
|
+
if (options.inputResolver) {
|
|
66566
|
+
const resolvedInput = options.inputResolver(component, ctx);
|
|
66567
|
+
// Guard against resolvers returning undefined or non-HTMLElement values.
|
|
66568
|
+
ctx.activeInput = resolvedInput instanceof HTMLElement ? resolvedInput : null;
|
|
66569
|
+
}
|
|
66570
|
+
|
|
66571
|
+
return ctx;
|
|
66572
|
+
}
|
|
66573
|
+
|
|
66574
|
+
/**
|
|
66575
|
+
* Wires up a keydown listener that dispatches to strategy[evt.key] or strategy.default.
|
|
66576
|
+
* Handles both sync and async handlers.
|
|
66577
|
+
* @param {HTMLElement} component - The component to attach the listener to.
|
|
66578
|
+
* @param {Object} strategy - Map of key names to handler functions.
|
|
66579
|
+
* @param {Object} [options] - Optional config passed to createDisplayContext.
|
|
66580
|
+
*/
|
|
66581
|
+
function applyKeyboardStrategy(component, strategy, options = {}) {
|
|
66582
|
+
component.addEventListener('keydown', async (evt) => {
|
|
66583
|
+
const handler = strategy[evt.key] || strategy.default;
|
|
66584
|
+
if (typeof handler === 'function') {
|
|
66585
|
+
const ctx = createDisplayContext(component, options);
|
|
66586
|
+
await handler(component, evt, ctx);
|
|
66587
|
+
}
|
|
66588
|
+
});
|
|
66589
|
+
}
|
|
66590
|
+
|
|
66629
66591
|
var styleCss$2$1 = i$7`:host{position:fixed;z-index:var(--depth-tooltip, 400);display:none;isolation:isolate}:host dialog{width:auto;max-width:none;height:auto;max-height:none;padding:0;border:none;margin:0;outline:none;transform:translateZ(0)}:host dialog::backdrop{background:transparent}:host(:not([isfullscreen])) dialog{position:relative;inset:unset}:host(:not([isfullscreen])) .container.shape-box{border-radius:unset}:host(:not([isfullscreen])) .container[class*=shape-pill],:host(:not([isfullscreen])) .container[class*=shape-snowflake]{border-radius:30px}:host(:not([isfullscreen])) .container[class*=shape-rounded]{border-radius:16px}:host(:not([matchWidth])) .container{min-width:fit-content}:host([isfullscreen]){position:fixed;top:0;left:0}:host([isfullscreen]) .container{width:100dvw;max-width:none;height:100dvh;max-height:none;border-radius:unset;margin-top:0;box-shadow:unset;overscroll-behavior:contain}:host([isfullscreen]) .container::backdrop{background:var(--ds-color-background-primary, #fff)}:host(:popover-open){position:fixed;overflow:visible;padding:0;border:none;margin:0;background:transparent;inset:unset;outline:none}:host([data-show]){display:flex}:host([common]:not([isfullscreen])) .container,:host([rounded]:not([isfullscreen])) .container{border-radius:var(--ds-border-radius, 0.375rem)}:host([common][isfullscreen]) .container,:host([rounded][isfullscreen]) .container{border-radius:unset;box-shadow:unset}.container{display:inline-block;overflow:auto;box-sizing:border-box;border-radius:var(--ds-border-radius, 0.375rem);margin:var(--ds-size-50, 0.25rem) 0}.util_displayHiddenVisually{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;border:0;margin:-1px;clip-path:inset(50%);white-space:nowrap}`;
|
|
66630
66592
|
|
|
66631
66593
|
var colorCss$2 = i$7`.container{background-color:var(--ds-auro-dropdownbib-container-color);box-shadow:var(--ds-auro-dropdownbib-boxshadow-color);color:var(--ds-auro-dropdownbib-text-color)}`;
|
|
66632
66594
|
|
|
66633
66595
|
var tokensCss$1 = i$7`:host(:not([ondark])),:host(:not([appearance=inverse])){--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-dropdown-trigger-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-hover-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-bold, #585e67);--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-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdownbib-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdownbib-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}:host([ondark]),:host([appearance=inverse]){--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db);--ds-auro-dropdown-trigger-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-hover-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-inverse, #ffffff);--ds-auro-dropdown-trigger-outline-color: transparent;--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-dropdownbib-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdownbib-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdownbib-text-color: var(--ds-basic-color-texticon-inverse, #ffffff)}`;
|
|
66634
66596
|
|
|
66597
|
+
/**
|
|
66598
|
+
* Creates a keyboard strategy for dialog-specific key handling.
|
|
66599
|
+
* All other keydown behavior is left to the browser's native bubbling path.
|
|
66600
|
+
* @param {HTMLElement} bib - The dropdown bib element.
|
|
66601
|
+
* @returns {Object} Keyboard handlers keyed by `event.key`.
|
|
66602
|
+
*/
|
|
66603
|
+
// eslint-disable-next-line no-unused-vars
|
|
66604
|
+
function createDropdownBibKeyboardStrategy(bib) {
|
|
66605
|
+
return {
|
|
66606
|
+
// eslint-disable-next-line no-unused-vars
|
|
66607
|
+
Enter(_dialog, event) {
|
|
66608
|
+
// Floating UI handles Enter key to open the dropdown
|
|
66609
|
+
},
|
|
66610
|
+
// eslint-disable-next-line no-unused-vars
|
|
66611
|
+
Escape(_dialog, event) {
|
|
66612
|
+
// Floating UI handles Escape key to close the dropdown
|
|
66613
|
+
}
|
|
66614
|
+
};
|
|
66615
|
+
}
|
|
66616
|
+
|
|
66635
66617
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
66636
66618
|
// See LICENSE in the project root for license information.
|
|
66637
66619
|
/* eslint-disable max-lines */
|
|
@@ -66756,26 +66738,11 @@ class AuroDropdownBib extends i$4 {
|
|
|
66756
66738
|
},
|
|
66757
66739
|
|
|
66758
66740
|
/**
|
|
66759
|
-
*
|
|
66760
|
-
* aria-activedescendant. The dialog keyboard bridge checks this
|
|
66761
|
-
* flag so that Enter selects the highlighted option instead of
|
|
66762
|
-
* activating the focused interactive element (e.g. the trigger
|
|
66763
|
-
* button, or the bibtemplate close button in fullscreen).
|
|
66741
|
+
* Tracks whether a menu option is currently highlighted.
|
|
66764
66742
|
* @private
|
|
66765
66743
|
*/
|
|
66766
66744
|
hasActiveDescendant: {
|
|
66767
66745
|
type: Boolean
|
|
66768
|
-
},
|
|
66769
|
-
|
|
66770
|
-
/**
|
|
66771
|
-
* When true, the keyboard bridge allows native Tab behavior
|
|
66772
|
-
* instead of intercepting it. Set this for bib consumers
|
|
66773
|
-
* (e.g. counter) whose content contains real focusable elements
|
|
66774
|
-
* that need native Tab navigation.
|
|
66775
|
-
* @private
|
|
66776
|
-
*/
|
|
66777
|
-
nativeFocusableContent: {
|
|
66778
|
-
type: Boolean
|
|
66779
66746
|
}
|
|
66780
66747
|
};
|
|
66781
66748
|
}
|
|
@@ -66845,7 +66812,7 @@ class AuroDropdownBib extends i$4 {
|
|
|
66845
66812
|
|
|
66846
66813
|
const dialog = this.shadowRoot.querySelector('dialog');
|
|
66847
66814
|
this._setupCancelHandler(dialog);
|
|
66848
|
-
|
|
66815
|
+
applyKeyboardStrategy(dialog, createDropdownBibKeyboardStrategy());
|
|
66849
66816
|
|
|
66850
66817
|
this.dispatchEvent(new CustomEvent('auro-dropdownbib-connected', {
|
|
66851
66818
|
bubbles: true,
|
|
@@ -66872,98 +66839,6 @@ class AuroDropdownBib extends i$4 {
|
|
|
66872
66839
|
});
|
|
66873
66840
|
}
|
|
66874
66841
|
|
|
66875
|
-
/**
|
|
66876
|
-
* showModal() creates a closed focus scope — keyboard events inside
|
|
66877
|
-
* the dialog's shadow DOM do NOT bubble out to the combobox/select
|
|
66878
|
-
* keydown handlers in the parent shadow DOM. This handler bridges
|
|
66879
|
-
* that gap by re-dispatching navigation keys so they cross the
|
|
66880
|
-
* shadow boundary and reach the menu navigation logic in the parent
|
|
66881
|
-
* component.
|
|
66882
|
-
*
|
|
66883
|
-
* The trade-off: intercepting these keys means native keyboard
|
|
66884
|
-
* behaviors that would normally "just work" must be manually
|
|
66885
|
-
* re-implemented here:
|
|
66886
|
-
*
|
|
66887
|
-
* - Enter on buttons: Custom elements (auro-button) don't get the
|
|
66888
|
-
* native Enter→click that <button> provides, so we call .click()
|
|
66889
|
-
* directly when Enter is pressed on a button-like element.
|
|
66890
|
-
*
|
|
66891
|
-
* - Tab: Intercepted and re-dispatched so parent components
|
|
66892
|
-
* (select/combobox) can select the active option and close the
|
|
66893
|
-
* dialog. The <dialog> provides containment and isolation
|
|
66894
|
-
* (inert background, VoiceOver focus trapping, top layer), while
|
|
66895
|
-
* the content inside is a role="listbox" navigated via
|
|
66896
|
-
* aria-activedescendant (options are not focusable). Tab keyboard
|
|
66897
|
-
* behavior follows listbox conventions (select + close) because
|
|
66898
|
-
* the dialog's native Tab trap only cycles between the close
|
|
66899
|
-
* button and browser chrome.
|
|
66900
|
-
*
|
|
66901
|
-
* - Escape: The native <dialog> fires a `cancel` event on ESC
|
|
66902
|
-
* (handled by _setupCancelHandler), so the re-dispatched Escape
|
|
66903
|
-
* is a secondary path for parent components that also listen for
|
|
66904
|
-
* Escape keydown.
|
|
66905
|
-
*
|
|
66906
|
-
* @param {HTMLDialogElement} dialog - The dialog element to attach the keyboard bridge to.
|
|
66907
|
-
* @private
|
|
66908
|
-
*/
|
|
66909
|
-
_setupKeyboardBridge(dialog) {
|
|
66910
|
-
const navKeys = new Set([
|
|
66911
|
-
'ArrowUp',
|
|
66912
|
-
'ArrowDown',
|
|
66913
|
-
'Enter',
|
|
66914
|
-
'Escape',
|
|
66915
|
-
'Tab'
|
|
66916
|
-
]);
|
|
66917
|
-
|
|
66918
|
-
dialog.addEventListener('keydown', (event) => {
|
|
66919
|
-
if (!navKeys.has(event.key)) {
|
|
66920
|
-
return;
|
|
66921
|
-
}
|
|
66922
|
-
|
|
66923
|
-
// Custom elements (auro-button) don't get the native Enter→click
|
|
66924
|
-
// behavior that <button> has. Find the button in the composed path
|
|
66925
|
-
// and click it directly — but only when no menu option is
|
|
66926
|
-
// highlighted. In fullscreen mode focus stays on the close button
|
|
66927
|
-
// while arrow keys move the active-descendant highlight through
|
|
66928
|
-
// the listbox. If the user presses Enter with an option
|
|
66929
|
-
// highlighted, the intent is to select that option, not to click
|
|
66930
|
-
// the close button. In that case we fall through and bridge the
|
|
66931
|
-
// Enter key to the parent component's keyboard strategy.
|
|
66932
|
-
if (event.key === 'Enter') {
|
|
66933
|
-
if (!this.hasActiveDescendant) {
|
|
66934
|
-
const buttonSelector = 'button, [role="button"], auro-button, [auro-button]';
|
|
66935
|
-
const btn = event.composedPath().find((el) => el.matches && el.matches(buttonSelector));
|
|
66936
|
-
if (btn) {
|
|
66937
|
-
event.preventDefault();
|
|
66938
|
-
event.stopPropagation();
|
|
66939
|
-
btn.click();
|
|
66940
|
-
return;
|
|
66941
|
-
}
|
|
66942
|
-
}
|
|
66943
|
-
}
|
|
66944
|
-
|
|
66945
|
-
// Allow native Tab when the bib contains focusable content
|
|
66946
|
-
// (e.g. counter buttons) that needs normal Tab navigation.
|
|
66947
|
-
if (event.key === 'Tab' && this.nativeFocusableContent) {
|
|
66948
|
-
return;
|
|
66949
|
-
}
|
|
66950
|
-
|
|
66951
|
-
event.preventDefault();
|
|
66952
|
-
event.stopPropagation();
|
|
66953
|
-
const newEvent = new KeyboardEvent('keydown', {
|
|
66954
|
-
key: event.key,
|
|
66955
|
-
code: event.code,
|
|
66956
|
-
shiftKey: event.shiftKey,
|
|
66957
|
-
altKey: event.altKey,
|
|
66958
|
-
ctrlKey: event.ctrlKey,
|
|
66959
|
-
metaKey: event.metaKey,
|
|
66960
|
-
bubbles: true,
|
|
66961
|
-
composed: true,
|
|
66962
|
-
cancelable: true
|
|
66963
|
-
});
|
|
66964
|
-
this.dispatchEvent(newEvent);
|
|
66965
|
-
});
|
|
66966
|
-
}
|
|
66967
66842
|
|
|
66968
66843
|
/**
|
|
66969
66844
|
* Blocks touch-driven page scroll while a fullscreen modal dialog is open.
|
|
@@ -67338,7 +67213,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$4 {
|
|
|
67338
67213
|
}
|
|
67339
67214
|
};
|
|
67340
67215
|
|
|
67341
|
-
var formkitVersion$1 = '
|
|
67216
|
+
var formkitVersion$1 = '202604012043';
|
|
67342
67217
|
|
|
67343
67218
|
class AuroElement extends i$4 {
|
|
67344
67219
|
static get properties() {
|
|
@@ -67519,7 +67394,6 @@ class AuroDropdown extends AuroElement {
|
|
|
67519
67394
|
this.appearance = 'default';
|
|
67520
67395
|
this.chevron = false;
|
|
67521
67396
|
this.disabled = false;
|
|
67522
|
-
this.disableFocusTrap = false;
|
|
67523
67397
|
this.error = false;
|
|
67524
67398
|
this.tabIndex = 0;
|
|
67525
67399
|
this.noToggle = false;
|
|
@@ -67617,9 +67491,8 @@ class AuroDropdown extends AuroElement {
|
|
|
67617
67491
|
// showModal() fires asynchronously via Lit's update cycle, which
|
|
67618
67492
|
// falls outside the user activation window and causes iOS to
|
|
67619
67493
|
// dismiss the keyboard.
|
|
67620
|
-
if (this.
|
|
67621
|
-
|
|
67622
|
-
this.bibElement.value.open(useModal);
|
|
67494
|
+
if (this.bibElement && this.bibElement.value) {
|
|
67495
|
+
this.bibElement.value.open(this.isBibFullscreen);
|
|
67623
67496
|
}
|
|
67624
67497
|
}
|
|
67625
67498
|
|
|
@@ -67732,14 +67605,6 @@ class AuroDropdown extends AuroElement {
|
|
|
67732
67605
|
reflect: true
|
|
67733
67606
|
},
|
|
67734
67607
|
|
|
67735
|
-
/**
|
|
67736
|
-
* If declared, the focus trap inside of bib will be turned off.
|
|
67737
|
-
*/
|
|
67738
|
-
disableFocusTrap: {
|
|
67739
|
-
type: Boolean,
|
|
67740
|
-
reflect: true
|
|
67741
|
-
},
|
|
67742
|
-
|
|
67743
67608
|
/**
|
|
67744
67609
|
* @private
|
|
67745
67610
|
*/
|
|
@@ -68013,7 +67878,7 @@ class AuroDropdown extends AuroElement {
|
|
|
68013
67878
|
if (this.isPopoverVisible) {
|
|
68014
67879
|
// Fullscreen: use showModal() for native accessibility (inert outside, focus trap)
|
|
68015
67880
|
// Desktop: use show() for Floating UI positioning + FocusTrap for focus management
|
|
68016
|
-
const useModal = this.isBibFullscreen
|
|
67881
|
+
const useModal = this.isBibFullscreen;
|
|
68017
67882
|
this.bibElement.value.open(useModal);
|
|
68018
67883
|
} else {
|
|
68019
67884
|
this.bibElement.value.close();
|
|
@@ -68023,7 +67888,7 @@ class AuroDropdown extends AuroElement {
|
|
|
68023
67888
|
// When fullscreen strategy changes while open, re-open dialog with correct mode
|
|
68024
67889
|
// (e.g. resizing from desktop → mobile while dropdown is open)
|
|
68025
67890
|
if (changedProperties.has('isBibFullscreen') && this.isPopoverVisible && this.bibElement.value) {
|
|
68026
|
-
const useModal = this.isBibFullscreen
|
|
67891
|
+
const useModal = this.isBibFullscreen;
|
|
68027
67892
|
this.bibElement.value.close();
|
|
68028
67893
|
this.bibElement.value.open(useModal);
|
|
68029
67894
|
}
|
|
@@ -68135,7 +68000,7 @@ class AuroDropdown extends AuroElement {
|
|
|
68135
68000
|
* @private
|
|
68136
68001
|
*/
|
|
68137
68002
|
updateFocusTrap() {
|
|
68138
|
-
if (this.isPopoverVisible
|
|
68003
|
+
if (this.isPopoverVisible) {
|
|
68139
68004
|
if (!this.isBibFullscreen) {
|
|
68140
68005
|
// Desktop: show() doesn't trap focus, so use FocusTrap
|
|
68141
68006
|
this.focusTrap = new FocusTrap(this.bibContent);
|
|
@@ -69091,7 +68956,7 @@ class AuroHelpText extends i$4 {
|
|
|
69091
68956
|
}
|
|
69092
68957
|
}
|
|
69093
68958
|
|
|
69094
|
-
var formkitVersion = '
|
|
68959
|
+
var formkitVersion = '202604012043';
|
|
69095
68960
|
|
|
69096
68961
|
var styleCss = i$7`.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}.body-default{font-size:var(--wcss-body-default-font-size, 1rem);line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default,.body-lg{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-lg{font-size:var(--wcss-body-lg-font-size, 1.125rem);line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-sm{font-size:var(--wcss-body-sm-font-size, 0.875rem);line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.body-xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs{font-size:var(--wcss-body-xs-font-size, 0.75rem);line-height:var(--wcss-body-xs-line-height, 1rem)}.body-2xs{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;font-size:var(--wcss-body-2xs-font-size, 0.625rem);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0);line-height:var(--wcss-body-2xs-line-height, 0.875rem)}.display-2xl{font-family:var(--wcss-display-2xl-family, "AS Circular"),var(--wcss-display-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-2xl-font-size, clamp(3.5rem, 6vw, 5.375rem));font-weight:var(--wcss-display-2xl-weight, 300);letter-spacing:var(--wcss-display-2xl-letter-spacing, 0);line-height:var(--wcss-display-2xl-line-height, 1.3)}.display-xl{font-family:var(--wcss-display-xl-family, "AS Circular"),var(--wcss-display-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xl-font-size, clamp(3rem, 5.3333333333vw, 4.5rem));font-weight:var(--wcss-display-xl-weight, 300);letter-spacing:var(--wcss-display-xl-letter-spacing, 0);line-height:var(--wcss-display-xl-line-height, 1.3)}.display-lg{font-family:var(--wcss-display-lg-family, "AS Circular"),var(--wcss-display-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-lg-font-size, clamp(2.75rem, 4.6666666667vw, 4rem));font-weight:var(--wcss-display-lg-weight, 300);letter-spacing:var(--wcss-display-lg-letter-spacing, 0);line-height:var(--wcss-display-lg-line-height, 1.3)}.display-md{font-family:var(--wcss-display-md-family, "AS Circular"),var(--wcss-display-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-md-font-size, clamp(2.5rem, 4vw, 3.5rem));font-weight:var(--wcss-display-md-weight, 300);letter-spacing:var(--wcss-display-md-letter-spacing, 0);line-height:var(--wcss-display-md-line-height, 1.3)}.display-sm{font-family:var(--wcss-display-sm-family, "AS Circular"),var(--wcss-display-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-sm-font-size, clamp(2rem, 3.6666666667vw, 3rem));font-weight:var(--wcss-display-sm-weight, 300);letter-spacing:var(--wcss-display-sm-letter-spacing, 0);line-height:var(--wcss-display-sm-line-height, 1.3)}.display-xs{font-family:var(--wcss-display-xs-family, "AS Circular"),var(--wcss-display-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-display-xs-font-size, clamp(1.75rem, 3vw, 2.375rem));font-weight:var(--wcss-display-xs-weight, 300);letter-spacing:var(--wcss-display-xs-letter-spacing, 0);line-height:var(--wcss-display-xs-line-height, 1.3)}.heading-xl{font-family:var(--wcss-heading-xl-family, "AS Circular"),var(--wcss-heading-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xl-font-size, clamp(2rem, 3vw, 2.5rem));font-weight:var(--wcss-heading-xl-weight, 300);letter-spacing:var(--wcss-heading-xl-letter-spacing, 0);line-height:var(--wcss-heading-xl-line-height, 1.3)}.heading-lg{font-family:var(--wcss-heading-lg-family, "AS Circular"),var(--wcss-heading-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-lg-font-size, clamp(1.75rem, 2.6666666667vw, 2.25rem));font-weight:var(--wcss-heading-lg-weight, 300);letter-spacing:var(--wcss-heading-lg-letter-spacing, 0);line-height:var(--wcss-heading-lg-line-height, 1.3)}.heading-md{font-family:var(--wcss-heading-md-family, "AS Circular"),var(--wcss-heading-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-md-font-size, clamp(1.625rem, 2.3333333333vw, 1.75rem));font-weight:var(--wcss-heading-md-weight, 300);letter-spacing:var(--wcss-heading-md-letter-spacing, 0);line-height:var(--wcss-heading-md-line-height, 1.3)}.heading-sm{font-family:var(--wcss-heading-sm-family, "AS Circular"),var(--wcss-heading-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-sm-font-size, clamp(1.375rem, 2vw, 1.5rem));font-weight:var(--wcss-heading-sm-weight, 300);letter-spacing:var(--wcss-heading-sm-letter-spacing, 0);line-height:var(--wcss-heading-sm-line-height, 1.3)}.heading-xs{font-family:var(--wcss-heading-xs-family, "AS Circular"),var(--wcss-heading-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-xs-font-size, clamp(1.25rem, 1.6666666667vw, 1.25rem));font-weight:var(--wcss-heading-xs-weight, 450);letter-spacing:var(--wcss-heading-xs-letter-spacing, 0);line-height:var(--wcss-heading-xs-line-height, 1.3)}.heading-2xs{font-family:var(--wcss-heading-2xs-family, "AS Circular"),var(--wcss-heading-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-heading-2xs-font-size, clamp(1.125rem, 1.5vw, 1.125rem));font-weight:var(--wcss-heading-2xs-weight, 450);letter-spacing:var(--wcss-heading-2xs-letter-spacing, 0);line-height:var(--wcss-heading-2xs-line-height, 1.3)}.accent-2xl{font-family:var(--wcss-accent-2xl-family, "Good OT"),var(--wcss-accent-2xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xl-font-size, clamp(2rem, 3.1666666667vw, 2.375rem));font-weight:var(--wcss-accent-2xl-weight, 450);letter-spacing:var(--wcss-accent-2xl-letter-spacing, 0.05em);line-height:var(--wcss-accent-2xl-line-height, 1)}.accent-2xl,.accent-xl{text-transform:uppercase}.accent-xl{font-family:var(--wcss-accent-xl-family, "Good OT"),var(--wcss-accent-xl-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xl-font-size, clamp(1.625rem, 2.3333333333vw, 2rem));font-weight:var(--wcss-accent-xl-weight, 450);letter-spacing:var(--wcss-accent-xl-letter-spacing, 0.05em);line-height:var(--wcss-accent-xl-line-height, 1.3)}.accent-lg{font-family:var(--wcss-accent-lg-family, "Good OT"),var(--wcss-accent-lg-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-lg-font-size, clamp(1.5rem, 2.1666666667vw, 1.75rem));font-weight:var(--wcss-accent-lg-weight, 450);letter-spacing:var(--wcss-accent-lg-letter-spacing, 0.05em);line-height:var(--wcss-accent-lg-line-height, 1.3)}.accent-lg,.accent-md{text-transform:uppercase}.accent-md{font-family:var(--wcss-accent-md-family, "Good OT"),var(--wcss-accent-md-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-md-font-size, clamp(1.375rem, 1.8333333333vw, 1.5rem));font-weight:var(--wcss-accent-md-weight, 500);letter-spacing:var(--wcss-accent-md-letter-spacing, 0.05em);line-height:var(--wcss-accent-md-line-height, 1.3)}.accent-sm{font-family:var(--wcss-accent-sm-family, "Good OT"),var(--wcss-accent-sm-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-sm-font-size, clamp(1.125rem, 1.5vw, 1.25rem));font-weight:var(--wcss-accent-sm-weight, 500);letter-spacing:var(--wcss-accent-sm-letter-spacing, 0.05em);line-height:var(--wcss-accent-sm-line-height, 1.3)}.accent-sm,.accent-xs{text-transform:uppercase}.accent-xs{font-family:var(--wcss-accent-xs-family, "Good OT"),var(--wcss-accent-xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-xs-font-size, clamp(1rem, 1.3333333333vw, 1rem));font-weight:var(--wcss-accent-xs-weight, 500);letter-spacing:var(--wcss-accent-xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-xs-line-height, 1.3)}.accent-2xs{font-family:var(--wcss-accent-2xs-family, "Good OT"),var(--wcss-accent-2xs-family-fallback, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);font-size:var(--wcss-accent-2xs-font-size, clamp(0.875rem, 1.1666666667vw, 0.875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}[auro-dropdown]{--ds-auro-dropdown-trigger-border-color: var(--ds-auro-select-border-color);--ds-auro-dropdown-trigger-background-color: var(--ds-auro-select-background-color);--ds-auro-dropdown-trigger-container-color: var(--ds-auro-select-background-color);--ds-auro-dropdown-trigger-outline-color: var(--ds-auro-select-outline-color)}:host{display:inline-block;text-align:left;vertical-align:top}:host([layout*=emphasized]) [auro-dropdown],:host([layout*=snowflake]) [auro-dropdown]{--ds-auro-select-border-color: transparent}:host([layout*=emphasized]) .mainContent,:host([layout*=snowflake]) .mainContent{text-align:center}.mainContent{position:relative;display:flex;overflow:hidden;flex:1;flex-direction:column;align-items:center;justify-content:center}.valueContainer [slot=displayValue]{display:none}.accents{display:flex;flex-direction:row;align-items:center;justify-content:center}::slotted([slot=typeIcon]){margin-right:var(--ds-size-100, 0.5rem)}.displayValue{display:block}.displayValue:not(.force){display:none}.displayValue:not(.force).hasContent:is(.withValue):not(.hasFocus){display:block}.triggerContent{display:flex;width:100%;align-items:center;justify-content:center}:host([layout*=emphasized]) .triggerContent{padding:0 var(--ds-size-100, 0.5rem) 0 var(--ds-size-300, 1.5rem)}:host([layout*=snowflake]) .triggerContent{padding:0 var(--ds-size-100, 0.5rem) 0 var(--ds-size-200, 1rem)}:host([layout*=snowflake]) label{padding-block:var(--ds-size-25, 0.125rem)}:host([layout*=classic]) .triggerContent{padding:0 var(--ds-size-100, 0.5rem)}:host([layout*=classic]) .mainContent{align-items:start}:host([layout*=classic]) label{overflow:hidden;cursor:text;text-overflow:ellipsis;white-space:nowrap}:host([layout*=classic]) .value{height:auto}label{color:var(--ds-auro-select-label-text-color)}:host(:is([validity]:not([validity=valid]))) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-basic-color-status-error, #e31f26);--ds-auro-select-outline-color: var(--ds-basic-color-status-error, #e31f26);--ds-auro-dropdown-helptext-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}:host([ondark]:is([validity]:not([validity=valid]))) [auro-dropdown],:host([appearance=inverse]:is([validity]:not([validity=valid]))) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8);--ds-auro-select-outline-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8);--ds-auro-dropdown-helptext-text-color: var(--ds-basic-color-texticon-inverse, #ffffff)}#slotHolder{display:none}:host([fluid]){width:100%}:host([disabled]){pointer-events:none;user-select:none}:host([disabled]:not([ondark])) [auro-dropdown],:host([disabled]:not([appearance=inverse])) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-basic-color-border-subtle, #dddddd)}:host(:not([layout*=classic])[disabled][ondark]) [auro-dropdown],:host(:not([layout*=classic])[disabled][appearance=inverse]) [auro-dropdown]{--ds-auro-select-border-color: transparent}`;
|
|
69097
68962
|
|
|
@@ -69613,7 +69478,7 @@ class AuroSelect extends AuroElement$1 {
|
|
|
69613
69478
|
|
|
69614
69479
|
// Prevent dropdown from closing on focus loss since menu content is slotted
|
|
69615
69480
|
// from select's light DOM and won't be detected by dropdown's contains() check.
|
|
69616
|
-
// Select handles Tab key closing explicitly,
|
|
69481
|
+
// Select handles Tab key closing explicitly, `Escape` key via dialog cancel, and
|
|
69617
69482
|
// click outside works correctly via composedPath().
|
|
69618
69483
|
this.dropdown.noHideOnThisFocusLoss = true;
|
|
69619
69484
|
|
|
@@ -69626,7 +69491,9 @@ class AuroSelect extends AuroElement$1 {
|
|
|
69626
69491
|
this.dropdown.setActiveDescendant(null);
|
|
69627
69492
|
this.optionActive = null;
|
|
69628
69493
|
|
|
69629
|
-
|
|
69494
|
+
if (this.dropdown.isBibFullscreen) {
|
|
69495
|
+
restoreTriggerAfterClose(this.dropdown, this.dropdown.trigger);
|
|
69496
|
+
}
|
|
69630
69497
|
}
|
|
69631
69498
|
|
|
69632
69499
|
if (this.dropdown.isPopoverVisible) {
|
|
@@ -69900,7 +69767,7 @@ class AuroSelect extends AuroElement$1 {
|
|
|
69900
69767
|
configureSelect() {
|
|
69901
69768
|
this.nativeSelect = this.shadowRoot.querySelector('select');
|
|
69902
69769
|
|
|
69903
|
-
applyKeyboardStrategy(this, selectKeyboardStrategy);
|
|
69770
|
+
applyKeyboardStrategy$1(this, selectKeyboardStrategy);
|
|
69904
69771
|
|
|
69905
69772
|
this.addEventListener('focusin', this.handleFocusin);
|
|
69906
69773
|
|