@aurodesignsystem-dev/auro-formkit 0.0.0-pr1398.1 → 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.md +1 -1
- package/components/counter/demo/api.min.js +183 -160
- package/components/counter/demo/index.min.js +183 -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 +11 -8
- package/components/counter/dist/index.js +183 -160
- package/components/counter/dist/keyboardStrategy.d.ts +4 -0
- package/components/counter/dist/registered.js +183 -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 +492 -599
- package/components/form/demo/index.min.js +492 -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 +1598 -1598
- package/package.json +5 -3
|
@@ -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,14 +33899,36 @@ 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
|
|
|
33909
|
+
/**
|
|
33910
|
+
* Gets the current value of the counter.
|
|
33911
|
+
* @returns {number|undefined} The current value of the counter, or undefined if the value is not set or invalid.
|
|
33912
|
+
*/
|
|
33913
|
+
get value() {
|
|
33914
|
+
return this._value;
|
|
33915
|
+
}
|
|
33916
|
+
|
|
33917
|
+
/**
|
|
33918
|
+
* Sets the value of the counter. If the provided value is undefined, null, or cannot be converted to a number, the internal value will be set to undefined.
|
|
33919
|
+
* @param {number|string|undefined|null} val - The value to set for the counter. Can be a number, a string that can be converted to a number, undefined, or null.
|
|
33920
|
+
*/
|
|
33921
|
+
set value(val) {
|
|
33922
|
+
const old = this._value;
|
|
33923
|
+
if (val === undefined || val === null) {
|
|
33924
|
+
this._value = undefined;
|
|
33925
|
+
} else {
|
|
33926
|
+
const num = Number(val);
|
|
33927
|
+
this._value = Number.isNaN(num) ? undefined : num;
|
|
33928
|
+
}
|
|
33929
|
+
this.requestUpdate('value', old);
|
|
33930
|
+
}
|
|
33931
|
+
|
|
33884
33932
|
/**
|
|
33885
33933
|
* Defines reactive properties for the component.
|
|
33886
33934
|
* @returns {Object} Property configuration.
|
|
@@ -34065,29 +34113,6 @@ class AuroCounter extends i$4 {
|
|
|
34065
34113
|
this.validation.validate(this, force);
|
|
34066
34114
|
}
|
|
34067
34115
|
|
|
34068
|
-
/**
|
|
34069
|
-
* Handles the keydown event for the counter component.
|
|
34070
|
-
* @param {KeyboardEvent} event - The keyboard event object.
|
|
34071
|
-
* @returns {void}
|
|
34072
|
-
* @private
|
|
34073
|
-
*/
|
|
34074
|
-
handleKeyDown(event) {
|
|
34075
|
-
if (this.disabled) {
|
|
34076
|
-
return;
|
|
34077
|
-
}
|
|
34078
|
-
|
|
34079
|
-
switch (event.key) {
|
|
34080
|
-
case 'ArrowUp':
|
|
34081
|
-
event.preventDefault();
|
|
34082
|
-
this.increment();
|
|
34083
|
-
break;
|
|
34084
|
-
case 'ArrowDown':
|
|
34085
|
-
event.preventDefault();
|
|
34086
|
-
this.decrement();
|
|
34087
|
-
break;
|
|
34088
|
-
}
|
|
34089
|
-
}
|
|
34090
|
-
|
|
34091
34116
|
firstUpdated() {
|
|
34092
34117
|
this.initValue();
|
|
34093
34118
|
this.setTagAttribute("auro-counter");
|
|
@@ -36290,11 +36315,10 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36290
36315
|
return;
|
|
36291
36316
|
}
|
|
36292
36317
|
|
|
36293
|
-
const { activeElement } = document;
|
|
36294
36318
|
// if focus is still inside of trigger or bib, do not close
|
|
36295
36319
|
if (
|
|
36296
|
-
this.element.
|
|
36297
|
-
this.element.
|
|
36320
|
+
this.element.matches(":focus") ||
|
|
36321
|
+
this.element.matches(":focus-within")
|
|
36298
36322
|
) {
|
|
36299
36323
|
return;
|
|
36300
36324
|
}
|
|
@@ -37133,12 +37157,83 @@ let p$2$2 = class p{registerComponent(t,a){customElements.get(t)||customElements
|
|
|
37133
37157
|
|
|
37134
37158
|
var iconVersion$1$2 = '9.1.2';
|
|
37135
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
|
+
|
|
37136
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}`;
|
|
37137
37212
|
|
|
37138
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)}`;
|
|
37139
37214
|
|
|
37140
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)}`;
|
|
37141
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
|
+
|
|
37142
37237
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
37143
37238
|
// See LICENSE in the project root for license information.
|
|
37144
37239
|
/* eslint-disable max-lines */
|
|
@@ -37263,26 +37358,11 @@ let AuroDropdownBib$2 = class AuroDropdownBib extends i$4 {
|
|
|
37263
37358
|
},
|
|
37264
37359
|
|
|
37265
37360
|
/**
|
|
37266
|
-
*
|
|
37267
|
-
* aria-activedescendant. The dialog keyboard bridge checks this
|
|
37268
|
-
* flag so that Enter selects the highlighted option instead of
|
|
37269
|
-
* activating the focused interactive element (e.g. the trigger
|
|
37270
|
-
* button, or the bibtemplate close button in fullscreen).
|
|
37361
|
+
* Tracks whether a menu option is currently highlighted.
|
|
37271
37362
|
* @private
|
|
37272
37363
|
*/
|
|
37273
37364
|
hasActiveDescendant: {
|
|
37274
37365
|
type: Boolean
|
|
37275
|
-
},
|
|
37276
|
-
|
|
37277
|
-
/**
|
|
37278
|
-
* When true, the keyboard bridge allows native Tab behavior
|
|
37279
|
-
* instead of intercepting it. Set this for bib consumers
|
|
37280
|
-
* (e.g. counter) whose content contains real focusable elements
|
|
37281
|
-
* that need native Tab navigation.
|
|
37282
|
-
* @private
|
|
37283
|
-
*/
|
|
37284
|
-
nativeFocusableContent: {
|
|
37285
|
-
type: Boolean
|
|
37286
37366
|
}
|
|
37287
37367
|
};
|
|
37288
37368
|
}
|
|
@@ -37352,7 +37432,7 @@ let AuroDropdownBib$2 = class AuroDropdownBib extends i$4 {
|
|
|
37352
37432
|
|
|
37353
37433
|
const dialog = this.shadowRoot.querySelector('dialog');
|
|
37354
37434
|
this._setupCancelHandler(dialog);
|
|
37355
|
-
|
|
37435
|
+
applyKeyboardStrategy$3(dialog, createDropdownBibKeyboardStrategy$2());
|
|
37356
37436
|
|
|
37357
37437
|
this.dispatchEvent(new CustomEvent('auro-dropdownbib-connected', {
|
|
37358
37438
|
bubbles: true,
|
|
@@ -37379,98 +37459,6 @@ let AuroDropdownBib$2 = class AuroDropdownBib extends i$4 {
|
|
|
37379
37459
|
});
|
|
37380
37460
|
}
|
|
37381
37461
|
|
|
37382
|
-
/**
|
|
37383
|
-
* showModal() creates a closed focus scope — keyboard events inside
|
|
37384
|
-
* the dialog's shadow DOM do NOT bubble out to the combobox/select
|
|
37385
|
-
* keydown handlers in the parent shadow DOM. This handler bridges
|
|
37386
|
-
* that gap by re-dispatching navigation keys so they cross the
|
|
37387
|
-
* shadow boundary and reach the menu navigation logic in the parent
|
|
37388
|
-
* component.
|
|
37389
|
-
*
|
|
37390
|
-
* The trade-off: intercepting these keys means native keyboard
|
|
37391
|
-
* behaviors that would normally "just work" must be manually
|
|
37392
|
-
* re-implemented here:
|
|
37393
|
-
*
|
|
37394
|
-
* - Enter on buttons: Custom elements (auro-button) don't get the
|
|
37395
|
-
* native Enter→click that <button> provides, so we call .click()
|
|
37396
|
-
* directly when Enter is pressed on a button-like element.
|
|
37397
|
-
*
|
|
37398
|
-
* - Tab: Intercepted and re-dispatched so parent components
|
|
37399
|
-
* (select/combobox) can select the active option and close the
|
|
37400
|
-
* dialog. The <dialog> provides containment and isolation
|
|
37401
|
-
* (inert background, VoiceOver focus trapping, top layer), while
|
|
37402
|
-
* the content inside is a role="listbox" navigated via
|
|
37403
|
-
* aria-activedescendant (options are not focusable). Tab keyboard
|
|
37404
|
-
* behavior follows listbox conventions (select + close) because
|
|
37405
|
-
* the dialog's native Tab trap only cycles between the close
|
|
37406
|
-
* button and browser chrome.
|
|
37407
|
-
*
|
|
37408
|
-
* - Escape: The native <dialog> fires a `cancel` event on ESC
|
|
37409
|
-
* (handled by _setupCancelHandler), so the re-dispatched Escape
|
|
37410
|
-
* is a secondary path for parent components that also listen for
|
|
37411
|
-
* Escape keydown.
|
|
37412
|
-
*
|
|
37413
|
-
* @param {HTMLDialogElement} dialog - The dialog element to attach the keyboard bridge to.
|
|
37414
|
-
* @private
|
|
37415
|
-
*/
|
|
37416
|
-
_setupKeyboardBridge(dialog) {
|
|
37417
|
-
const navKeys = new Set([
|
|
37418
|
-
'ArrowUp',
|
|
37419
|
-
'ArrowDown',
|
|
37420
|
-
'Enter',
|
|
37421
|
-
'Escape',
|
|
37422
|
-
'Tab'
|
|
37423
|
-
]);
|
|
37424
|
-
|
|
37425
|
-
dialog.addEventListener('keydown', (event) => {
|
|
37426
|
-
if (!navKeys.has(event.key)) {
|
|
37427
|
-
return;
|
|
37428
|
-
}
|
|
37429
|
-
|
|
37430
|
-
// Custom elements (auro-button) don't get the native Enter→click
|
|
37431
|
-
// behavior that <button> has. Find the button in the composed path
|
|
37432
|
-
// and click it directly — but only when no menu option is
|
|
37433
|
-
// highlighted. In fullscreen mode focus stays on the close button
|
|
37434
|
-
// while arrow keys move the active-descendant highlight through
|
|
37435
|
-
// the listbox. If the user presses Enter with an option
|
|
37436
|
-
// highlighted, the intent is to select that option, not to click
|
|
37437
|
-
// the close button. In that case we fall through and bridge the
|
|
37438
|
-
// Enter key to the parent component's keyboard strategy.
|
|
37439
|
-
if (event.key === 'Enter') {
|
|
37440
|
-
if (!this.hasActiveDescendant) {
|
|
37441
|
-
const buttonSelector = 'button, [role="button"], auro-button, [auro-button]';
|
|
37442
|
-
const btn = event.composedPath().find((el) => el.matches && el.matches(buttonSelector));
|
|
37443
|
-
if (btn) {
|
|
37444
|
-
event.preventDefault();
|
|
37445
|
-
event.stopPropagation();
|
|
37446
|
-
btn.click();
|
|
37447
|
-
return;
|
|
37448
|
-
}
|
|
37449
|
-
}
|
|
37450
|
-
}
|
|
37451
|
-
|
|
37452
|
-
// Allow native Tab when the bib contains focusable content
|
|
37453
|
-
// (e.g. counter buttons) that needs normal Tab navigation.
|
|
37454
|
-
if (event.key === 'Tab' && this.nativeFocusableContent) {
|
|
37455
|
-
return;
|
|
37456
|
-
}
|
|
37457
|
-
|
|
37458
|
-
event.preventDefault();
|
|
37459
|
-
event.stopPropagation();
|
|
37460
|
-
const newEvent = new KeyboardEvent('keydown', {
|
|
37461
|
-
key: event.key,
|
|
37462
|
-
code: event.code,
|
|
37463
|
-
shiftKey: event.shiftKey,
|
|
37464
|
-
altKey: event.altKey,
|
|
37465
|
-
ctrlKey: event.ctrlKey,
|
|
37466
|
-
metaKey: event.metaKey,
|
|
37467
|
-
bubbles: true,
|
|
37468
|
-
composed: true,
|
|
37469
|
-
cancelable: true
|
|
37470
|
-
});
|
|
37471
|
-
this.dispatchEvent(newEvent);
|
|
37472
|
-
});
|
|
37473
|
-
}
|
|
37474
37462
|
|
|
37475
37463
|
/**
|
|
37476
37464
|
* Blocks touch-driven page scroll while a fullscreen modal dialog is open.
|
|
@@ -37845,7 +37833,7 @@ let AuroHelpText$6 = class AuroHelpText extends i$4 {
|
|
|
37845
37833
|
}
|
|
37846
37834
|
};
|
|
37847
37835
|
|
|
37848
|
-
var formkitVersion$6 = '
|
|
37836
|
+
var formkitVersion$6 = '202604012043';
|
|
37849
37837
|
|
|
37850
37838
|
let AuroElement$1$2 = class AuroElement extends i$4 {
|
|
37851
37839
|
static get properties() {
|
|
@@ -38026,7 +38014,6 @@ let AuroDropdown$2 = class AuroDropdown extends AuroElement$1$2 {
|
|
|
38026
38014
|
this.appearance = 'default';
|
|
38027
38015
|
this.chevron = false;
|
|
38028
38016
|
this.disabled = false;
|
|
38029
|
-
this.disableFocusTrap = false;
|
|
38030
38017
|
this.error = false;
|
|
38031
38018
|
this.tabIndex = 0;
|
|
38032
38019
|
this.noToggle = false;
|
|
@@ -38124,9 +38111,8 @@ let AuroDropdown$2 = class AuroDropdown extends AuroElement$1$2 {
|
|
|
38124
38111
|
// showModal() fires asynchronously via Lit's update cycle, which
|
|
38125
38112
|
// falls outside the user activation window and causes iOS to
|
|
38126
38113
|
// dismiss the keyboard.
|
|
38127
|
-
if (this.
|
|
38128
|
-
|
|
38129
|
-
this.bibElement.value.open(useModal);
|
|
38114
|
+
if (this.bibElement && this.bibElement.value) {
|
|
38115
|
+
this.bibElement.value.open(this.isBibFullscreen);
|
|
38130
38116
|
}
|
|
38131
38117
|
}
|
|
38132
38118
|
|
|
@@ -38239,14 +38225,6 @@ let AuroDropdown$2 = class AuroDropdown extends AuroElement$1$2 {
|
|
|
38239
38225
|
reflect: true
|
|
38240
38226
|
},
|
|
38241
38227
|
|
|
38242
|
-
/**
|
|
38243
|
-
* If declared, the focus trap inside of bib will be turned off.
|
|
38244
|
-
*/
|
|
38245
|
-
disableFocusTrap: {
|
|
38246
|
-
type: Boolean,
|
|
38247
|
-
reflect: true
|
|
38248
|
-
},
|
|
38249
|
-
|
|
38250
38228
|
/**
|
|
38251
38229
|
* @private
|
|
38252
38230
|
*/
|
|
@@ -38520,7 +38498,7 @@ let AuroDropdown$2 = class AuroDropdown extends AuroElement$1$2 {
|
|
|
38520
38498
|
if (this.isPopoverVisible) {
|
|
38521
38499
|
// Fullscreen: use showModal() for native accessibility (inert outside, focus trap)
|
|
38522
38500
|
// Desktop: use show() for Floating UI positioning + FocusTrap for focus management
|
|
38523
|
-
const useModal = this.isBibFullscreen
|
|
38501
|
+
const useModal = this.isBibFullscreen;
|
|
38524
38502
|
this.bibElement.value.open(useModal);
|
|
38525
38503
|
} else {
|
|
38526
38504
|
this.bibElement.value.close();
|
|
@@ -38530,7 +38508,7 @@ let AuroDropdown$2 = class AuroDropdown extends AuroElement$1$2 {
|
|
|
38530
38508
|
// When fullscreen strategy changes while open, re-open dialog with correct mode
|
|
38531
38509
|
// (e.g. resizing from desktop → mobile while dropdown is open)
|
|
38532
38510
|
if (changedProperties.has('isBibFullscreen') && this.isPopoverVisible && this.bibElement.value) {
|
|
38533
|
-
const useModal = this.isBibFullscreen
|
|
38511
|
+
const useModal = this.isBibFullscreen;
|
|
38534
38512
|
this.bibElement.value.close();
|
|
38535
38513
|
this.bibElement.value.open(useModal);
|
|
38536
38514
|
}
|
|
@@ -38642,7 +38620,7 @@ let AuroDropdown$2 = class AuroDropdown extends AuroElement$1$2 {
|
|
|
38642
38620
|
* @private
|
|
38643
38621
|
*/
|
|
38644
38622
|
updateFocusTrap() {
|
|
38645
|
-
if (this.isPopoverVisible
|
|
38623
|
+
if (this.isPopoverVisible) {
|
|
38646
38624
|
if (!this.isBibFullscreen) {
|
|
38647
38625
|
// Desktop: show() doesn't trap focus, so use FocusTrap
|
|
38648
38626
|
this.focusTrap = new FocusTrap$2(this.bibContent);
|
|
@@ -39842,6 +39820,7 @@ class AuroCounterGroup extends AuroElement$4 {
|
|
|
39842
39820
|
counter.addEventListener("input", this.updateValue);
|
|
39843
39821
|
counter.addEventListener("auroFormElement-validated", this.updateValidity);
|
|
39844
39822
|
});
|
|
39823
|
+
this.updateValue();
|
|
39845
39824
|
}
|
|
39846
39825
|
|
|
39847
39826
|
/**
|
|
@@ -39972,6 +39951,8 @@ class AuroCounterGroup extends AuroElement$4 {
|
|
|
39972
39951
|
counter.addEventListener("auroFormElement-validated", this.updateValidity);
|
|
39973
39952
|
});
|
|
39974
39953
|
|
|
39954
|
+
this.updateValue();
|
|
39955
|
+
|
|
39975
39956
|
if (this.isDropdown) {
|
|
39976
39957
|
this.configureBibtemplate();
|
|
39977
39958
|
}
|
|
@@ -39991,11 +39972,6 @@ class AuroCounterGroup extends AuroElement$4 {
|
|
|
39991
39972
|
|
|
39992
39973
|
// Focus close button when fullscreen dialog opens
|
|
39993
39974
|
this.dropdown.addEventListener('auroDropdown-toggled', () => {
|
|
39994
|
-
// Tell the bib's keyboard bridge to allow native Tab so focus
|
|
39995
|
-
// moves between the real focusable counter elements in the bib.
|
|
39996
|
-
if (this.dropdown.bibContent) {
|
|
39997
|
-
this.dropdown.bibContent.nativeFocusableContent = true;
|
|
39998
|
-
}
|
|
39999
39975
|
if (this.dropdown.isPopoverVisible && this.dropdown.isBibFullscreen) {
|
|
40000
39976
|
doubleRaf$2(() => {
|
|
40001
39977
|
this.bibtemplate.focusCloseButton();
|
|
@@ -40192,7 +40168,6 @@ class AuroCounterGroup extends AuroElement$4 {
|
|
|
40192
40168
|
renderCounterDropdown() {
|
|
40193
40169
|
return u$c`
|
|
40194
40170
|
<${this.dropdownTag}
|
|
40195
|
-
noHideOnThisFocusLoss
|
|
40196
40171
|
chevron
|
|
40197
40172
|
part="dropdown"
|
|
40198
40173
|
appearance="${this.onDark ? 'inverse' : this.appearance}"
|
|
@@ -41918,7 +41893,7 @@ let AuroHelpText$5 = class AuroHelpText extends i$4 {
|
|
|
41918
41893
|
}
|
|
41919
41894
|
};
|
|
41920
41895
|
|
|
41921
|
-
var formkitVersion$5 = '
|
|
41896
|
+
var formkitVersion$5 = '202604012043';
|
|
41922
41897
|
|
|
41923
41898
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
41924
41899
|
// See LICENSE in the project root for license information.
|
|
@@ -44087,7 +44062,7 @@ let AuroHelpText$4 = class AuroHelpText extends i$4 {
|
|
|
44087
44062
|
}
|
|
44088
44063
|
};
|
|
44089
44064
|
|
|
44090
|
-
var formkitVersion$4 = '
|
|
44065
|
+
var formkitVersion$4 = '202604012043';
|
|
44091
44066
|
|
|
44092
44067
|
// Copyright (c) 2026 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
44093
44068
|
// See LICENSE in the project root for license information.
|
|
@@ -45624,7 +45599,7 @@ function restoreTriggerAfterClose$1(dropdown, focusTarget) {
|
|
|
45624
45599
|
* @returns {{isExpanded: boolean, isModal: boolean, isPopover: boolean, activeInput: HTMLElement|null}}
|
|
45625
45600
|
* isModal and isPopover reflect the display mode (fullscreen vs not) regardless of expanded state.
|
|
45626
45601
|
*/
|
|
45627
|
-
function createDisplayContext$1(component, options = {}) {
|
|
45602
|
+
function createDisplayContext$1$1(component, options = {}) {
|
|
45628
45603
|
const dd = options.dropdown || component.dropdown;
|
|
45629
45604
|
// isPopoverVisible reflects as the `open` attribute.
|
|
45630
45605
|
// It reports whether the bib is open in any mode (popover or modal).
|
|
@@ -45654,11 +45629,11 @@ function createDisplayContext$1(component, options = {}) {
|
|
|
45654
45629
|
* @param {Object} strategy - Map of key names to handler functions.
|
|
45655
45630
|
* @param {Object} [options] - Optional config passed to createDisplayContext.
|
|
45656
45631
|
*/
|
|
45657
|
-
function applyKeyboardStrategy$1(component, strategy, options = {}) {
|
|
45632
|
+
function applyKeyboardStrategy$1$1(component, strategy, options = {}) {
|
|
45658
45633
|
component.addEventListener('keydown', async (evt) => {
|
|
45659
45634
|
const handler = strategy[evt.key] || strategy.default;
|
|
45660
45635
|
if (typeof handler === 'function') {
|
|
45661
|
-
const ctx = createDisplayContext$1(component, options);
|
|
45636
|
+
const ctx = createDisplayContext$1$1(component, options);
|
|
45662
45637
|
await handler(component, evt, ctx);
|
|
45663
45638
|
}
|
|
45664
45639
|
});
|
|
@@ -47890,11 +47865,10 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
47890
47865
|
return;
|
|
47891
47866
|
}
|
|
47892
47867
|
|
|
47893
|
-
const { activeElement } = document;
|
|
47894
47868
|
// if focus is still inside of trigger or bib, do not close
|
|
47895
47869
|
if (
|
|
47896
|
-
this.element.
|
|
47897
|
-
this.element.
|
|
47870
|
+
this.element.matches(":focus") ||
|
|
47871
|
+
this.element.matches(":focus-within")
|
|
47898
47872
|
) {
|
|
47899
47873
|
return;
|
|
47900
47874
|
}
|
|
@@ -48733,12 +48707,83 @@ let p$3$1 = class p{registerComponent(t,a){customElements.get(t)||customElements
|
|
|
48733
48707
|
|
|
48734
48708
|
var iconVersion$2$1 = '9.1.2';
|
|
48735
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
|
+
|
|
48736
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}`;
|
|
48737
48762
|
|
|
48738
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)}`;
|
|
48739
48764
|
|
|
48740
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)}`;
|
|
48741
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
|
+
|
|
48742
48787
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
48743
48788
|
// See LICENSE in the project root for license information.
|
|
48744
48789
|
/* eslint-disable max-lines */
|
|
@@ -48863,26 +48908,11 @@ let AuroDropdownBib$1 = class AuroDropdownBib extends i$4 {
|
|
|
48863
48908
|
},
|
|
48864
48909
|
|
|
48865
48910
|
/**
|
|
48866
|
-
*
|
|
48867
|
-
* aria-activedescendant. The dialog keyboard bridge checks this
|
|
48868
|
-
* flag so that Enter selects the highlighted option instead of
|
|
48869
|
-
* activating the focused interactive element (e.g. the trigger
|
|
48870
|
-
* button, or the bibtemplate close button in fullscreen).
|
|
48911
|
+
* Tracks whether a menu option is currently highlighted.
|
|
48871
48912
|
* @private
|
|
48872
48913
|
*/
|
|
48873
48914
|
hasActiveDescendant: {
|
|
48874
48915
|
type: Boolean
|
|
48875
|
-
},
|
|
48876
|
-
|
|
48877
|
-
/**
|
|
48878
|
-
* When true, the keyboard bridge allows native Tab behavior
|
|
48879
|
-
* instead of intercepting it. Set this for bib consumers
|
|
48880
|
-
* (e.g. counter) whose content contains real focusable elements
|
|
48881
|
-
* that need native Tab navigation.
|
|
48882
|
-
* @private
|
|
48883
|
-
*/
|
|
48884
|
-
nativeFocusableContent: {
|
|
48885
|
-
type: Boolean
|
|
48886
48916
|
}
|
|
48887
48917
|
};
|
|
48888
48918
|
}
|
|
@@ -48952,7 +48982,7 @@ let AuroDropdownBib$1 = class AuroDropdownBib extends i$4 {
|
|
|
48952
48982
|
|
|
48953
48983
|
const dialog = this.shadowRoot.querySelector('dialog');
|
|
48954
48984
|
this._setupCancelHandler(dialog);
|
|
48955
|
-
|
|
48985
|
+
applyKeyboardStrategy$2(dialog, createDropdownBibKeyboardStrategy$1());
|
|
48956
48986
|
|
|
48957
48987
|
this.dispatchEvent(new CustomEvent('auro-dropdownbib-connected', {
|
|
48958
48988
|
bubbles: true,
|
|
@@ -48979,98 +49009,6 @@ let AuroDropdownBib$1 = class AuroDropdownBib extends i$4 {
|
|
|
48979
49009
|
});
|
|
48980
49010
|
}
|
|
48981
49011
|
|
|
48982
|
-
/**
|
|
48983
|
-
* showModal() creates a closed focus scope — keyboard events inside
|
|
48984
|
-
* the dialog's shadow DOM do NOT bubble out to the combobox/select
|
|
48985
|
-
* keydown handlers in the parent shadow DOM. This handler bridges
|
|
48986
|
-
* that gap by re-dispatching navigation keys so they cross the
|
|
48987
|
-
* shadow boundary and reach the menu navigation logic in the parent
|
|
48988
|
-
* component.
|
|
48989
|
-
*
|
|
48990
|
-
* The trade-off: intercepting these keys means native keyboard
|
|
48991
|
-
* behaviors that would normally "just work" must be manually
|
|
48992
|
-
* re-implemented here:
|
|
48993
|
-
*
|
|
48994
|
-
* - Enter on buttons: Custom elements (auro-button) don't get the
|
|
48995
|
-
* native Enter→click that <button> provides, so we call .click()
|
|
48996
|
-
* directly when Enter is pressed on a button-like element.
|
|
48997
|
-
*
|
|
48998
|
-
* - Tab: Intercepted and re-dispatched so parent components
|
|
48999
|
-
* (select/combobox) can select the active option and close the
|
|
49000
|
-
* dialog. The <dialog> provides containment and isolation
|
|
49001
|
-
* (inert background, VoiceOver focus trapping, top layer), while
|
|
49002
|
-
* the content inside is a role="listbox" navigated via
|
|
49003
|
-
* aria-activedescendant (options are not focusable). Tab keyboard
|
|
49004
|
-
* behavior follows listbox conventions (select + close) because
|
|
49005
|
-
* the dialog's native Tab trap only cycles between the close
|
|
49006
|
-
* button and browser chrome.
|
|
49007
|
-
*
|
|
49008
|
-
* - Escape: The native <dialog> fires a `cancel` event on ESC
|
|
49009
|
-
* (handled by _setupCancelHandler), so the re-dispatched Escape
|
|
49010
|
-
* is a secondary path for parent components that also listen for
|
|
49011
|
-
* Escape keydown.
|
|
49012
|
-
*
|
|
49013
|
-
* @param {HTMLDialogElement} dialog - The dialog element to attach the keyboard bridge to.
|
|
49014
|
-
* @private
|
|
49015
|
-
*/
|
|
49016
|
-
_setupKeyboardBridge(dialog) {
|
|
49017
|
-
const navKeys = new Set([
|
|
49018
|
-
'ArrowUp',
|
|
49019
|
-
'ArrowDown',
|
|
49020
|
-
'Enter',
|
|
49021
|
-
'Escape',
|
|
49022
|
-
'Tab'
|
|
49023
|
-
]);
|
|
49024
|
-
|
|
49025
|
-
dialog.addEventListener('keydown', (event) => {
|
|
49026
|
-
if (!navKeys.has(event.key)) {
|
|
49027
|
-
return;
|
|
49028
|
-
}
|
|
49029
|
-
|
|
49030
|
-
// Custom elements (auro-button) don't get the native Enter→click
|
|
49031
|
-
// behavior that <button> has. Find the button in the composed path
|
|
49032
|
-
// and click it directly — but only when no menu option is
|
|
49033
|
-
// highlighted. In fullscreen mode focus stays on the close button
|
|
49034
|
-
// while arrow keys move the active-descendant highlight through
|
|
49035
|
-
// the listbox. If the user presses Enter with an option
|
|
49036
|
-
// highlighted, the intent is to select that option, not to click
|
|
49037
|
-
// the close button. In that case we fall through and bridge the
|
|
49038
|
-
// Enter key to the parent component's keyboard strategy.
|
|
49039
|
-
if (event.key === 'Enter') {
|
|
49040
|
-
if (!this.hasActiveDescendant) {
|
|
49041
|
-
const buttonSelector = 'button, [role="button"], auro-button, [auro-button]';
|
|
49042
|
-
const btn = event.composedPath().find((el) => el.matches && el.matches(buttonSelector));
|
|
49043
|
-
if (btn) {
|
|
49044
|
-
event.preventDefault();
|
|
49045
|
-
event.stopPropagation();
|
|
49046
|
-
btn.click();
|
|
49047
|
-
return;
|
|
49048
|
-
}
|
|
49049
|
-
}
|
|
49050
|
-
}
|
|
49051
|
-
|
|
49052
|
-
// Allow native Tab when the bib contains focusable content
|
|
49053
|
-
// (e.g. counter buttons) that needs normal Tab navigation.
|
|
49054
|
-
if (event.key === 'Tab' && this.nativeFocusableContent) {
|
|
49055
|
-
return;
|
|
49056
|
-
}
|
|
49057
|
-
|
|
49058
|
-
event.preventDefault();
|
|
49059
|
-
event.stopPropagation();
|
|
49060
|
-
const newEvent = new KeyboardEvent('keydown', {
|
|
49061
|
-
key: event.key,
|
|
49062
|
-
code: event.code,
|
|
49063
|
-
shiftKey: event.shiftKey,
|
|
49064
|
-
altKey: event.altKey,
|
|
49065
|
-
ctrlKey: event.ctrlKey,
|
|
49066
|
-
metaKey: event.metaKey,
|
|
49067
|
-
bubbles: true,
|
|
49068
|
-
composed: true,
|
|
49069
|
-
cancelable: true
|
|
49070
|
-
});
|
|
49071
|
-
this.dispatchEvent(newEvent);
|
|
49072
|
-
});
|
|
49073
|
-
}
|
|
49074
49012
|
|
|
49075
49013
|
/**
|
|
49076
49014
|
* Blocks touch-driven page scroll while a fullscreen modal dialog is open.
|
|
@@ -49445,7 +49383,7 @@ let AuroHelpText$2 = class AuroHelpText extends i$4 {
|
|
|
49445
49383
|
}
|
|
49446
49384
|
};
|
|
49447
49385
|
|
|
49448
|
-
var formkitVersion$2 = '
|
|
49386
|
+
var formkitVersion$2 = '202604012043';
|
|
49449
49387
|
|
|
49450
49388
|
let AuroElement$2$1 = class AuroElement extends i$4 {
|
|
49451
49389
|
static get properties() {
|
|
@@ -49626,7 +49564,6 @@ let AuroDropdown$1 = class AuroDropdown extends AuroElement$2$1 {
|
|
|
49626
49564
|
this.appearance = 'default';
|
|
49627
49565
|
this.chevron = false;
|
|
49628
49566
|
this.disabled = false;
|
|
49629
|
-
this.disableFocusTrap = false;
|
|
49630
49567
|
this.error = false;
|
|
49631
49568
|
this.tabIndex = 0;
|
|
49632
49569
|
this.noToggle = false;
|
|
@@ -49724,9 +49661,8 @@ let AuroDropdown$1 = class AuroDropdown extends AuroElement$2$1 {
|
|
|
49724
49661
|
// showModal() fires asynchronously via Lit's update cycle, which
|
|
49725
49662
|
// falls outside the user activation window and causes iOS to
|
|
49726
49663
|
// dismiss the keyboard.
|
|
49727
|
-
if (this.
|
|
49728
|
-
|
|
49729
|
-
this.bibElement.value.open(useModal);
|
|
49664
|
+
if (this.bibElement && this.bibElement.value) {
|
|
49665
|
+
this.bibElement.value.open(this.isBibFullscreen);
|
|
49730
49666
|
}
|
|
49731
49667
|
}
|
|
49732
49668
|
|
|
@@ -49839,14 +49775,6 @@ let AuroDropdown$1 = class AuroDropdown extends AuroElement$2$1 {
|
|
|
49839
49775
|
reflect: true
|
|
49840
49776
|
},
|
|
49841
49777
|
|
|
49842
|
-
/**
|
|
49843
|
-
* If declared, the focus trap inside of bib will be turned off.
|
|
49844
|
-
*/
|
|
49845
|
-
disableFocusTrap: {
|
|
49846
|
-
type: Boolean,
|
|
49847
|
-
reflect: true
|
|
49848
|
-
},
|
|
49849
|
-
|
|
49850
49778
|
/**
|
|
49851
49779
|
* @private
|
|
49852
49780
|
*/
|
|
@@ -50120,7 +50048,7 @@ let AuroDropdown$1 = class AuroDropdown extends AuroElement$2$1 {
|
|
|
50120
50048
|
if (this.isPopoverVisible) {
|
|
50121
50049
|
// Fullscreen: use showModal() for native accessibility (inert outside, focus trap)
|
|
50122
50050
|
// Desktop: use show() for Floating UI positioning + FocusTrap for focus management
|
|
50123
|
-
const useModal = this.isBibFullscreen
|
|
50051
|
+
const useModal = this.isBibFullscreen;
|
|
50124
50052
|
this.bibElement.value.open(useModal);
|
|
50125
50053
|
} else {
|
|
50126
50054
|
this.bibElement.value.close();
|
|
@@ -50130,7 +50058,7 @@ let AuroDropdown$1 = class AuroDropdown extends AuroElement$2$1 {
|
|
|
50130
50058
|
// When fullscreen strategy changes while open, re-open dialog with correct mode
|
|
50131
50059
|
// (e.g. resizing from desktop → mobile while dropdown is open)
|
|
50132
50060
|
if (changedProperties.has('isBibFullscreen') && this.isPopoverVisible && this.bibElement.value) {
|
|
50133
|
-
const useModal = this.isBibFullscreen
|
|
50061
|
+
const useModal = this.isBibFullscreen;
|
|
50134
50062
|
this.bibElement.value.close();
|
|
50135
50063
|
this.bibElement.value.open(useModal);
|
|
50136
50064
|
}
|
|
@@ -50242,7 +50170,7 @@ let AuroDropdown$1 = class AuroDropdown extends AuroElement$2$1 {
|
|
|
50242
50170
|
* @private
|
|
50243
50171
|
*/
|
|
50244
50172
|
updateFocusTrap() {
|
|
50245
|
-
if (this.isPopoverVisible
|
|
50173
|
+
if (this.isPopoverVisible) {
|
|
50246
50174
|
if (!this.isBibFullscreen) {
|
|
50247
50175
|
// Desktop: show() doesn't trap focus, so use FocusTrap
|
|
50248
50176
|
this.focusTrap = new FocusTrap$1(this.bibContent);
|
|
@@ -57202,7 +57130,7 @@ let AuroHelpText$1$1 = class AuroHelpText extends i$4 {
|
|
|
57202
57130
|
}
|
|
57203
57131
|
};
|
|
57204
57132
|
|
|
57205
|
-
var formkitVersion$1$1 = '
|
|
57133
|
+
var formkitVersion$1$1 = '202604012043';
|
|
57206
57134
|
|
|
57207
57135
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
57208
57136
|
// See LICENSE in the project root for license information.
|
|
@@ -58241,7 +58169,7 @@ let AuroBibtemplate$1 = class AuroBibtemplate extends i$4 {
|
|
|
58241
58169
|
}
|
|
58242
58170
|
};
|
|
58243
58171
|
|
|
58244
|
-
var formkitVersion$3 = '
|
|
58172
|
+
var formkitVersion$3 = '202604012043';
|
|
58245
58173
|
|
|
58246
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}`;
|
|
58247
58175
|
|
|
@@ -59735,7 +59663,7 @@ class AuroCombobox extends AuroElement$3 {
|
|
|
59735
59663
|
* @returns {void}
|
|
59736
59664
|
*/
|
|
59737
59665
|
configureCombobox() {
|
|
59738
|
-
applyKeyboardStrategy$1(this, comboboxKeyboardStrategy, {
|
|
59666
|
+
applyKeyboardStrategy$1$1(this, comboboxKeyboardStrategy, {
|
|
59739
59667
|
// In modal mode the input moves into the bib; route keyboard events to that element instead.
|
|
59740
59668
|
inputResolver: (comp, ctx) => (ctx.isModal && comp.inputInBib ? comp.inputInBib : comp.input),
|
|
59741
59669
|
});
|
|
@@ -61738,10 +61666,10 @@ class AuroMenu extends AuroElement$2 {
|
|
|
61738
61666
|
|
|
61739
61667
|
// Event Bindings
|
|
61740
61668
|
|
|
61741
|
-
/**
|
|
61742
|
-
|
|
61743
|
-
|
|
61744
|
-
this.handleKeyDown = this.handleKeyDown.bind(this);
|
|
61669
|
+
// /**
|
|
61670
|
+
// * @private
|
|
61671
|
+
// */
|
|
61672
|
+
// this.handleKeyDown = this.handleKeyDown.bind(this);
|
|
61745
61673
|
|
|
61746
61674
|
|
|
61747
61675
|
/**
|
|
@@ -61990,6 +61918,13 @@ class AuroMenu extends AuroElement$2 {
|
|
|
61990
61918
|
* @protected
|
|
61991
61919
|
*/
|
|
61992
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
|
+
|
|
61993
61928
|
this.menuService = new MenuService({host: this});
|
|
61994
61929
|
this.menuService.setProperties(this.propertyValues);
|
|
61995
61930
|
this.menuService.subscribe(this.handleMenuChange.bind(this));
|
|
@@ -62083,7 +62018,7 @@ class AuroMenu extends AuroElement$2 {
|
|
|
62083
62018
|
|
|
62084
62019
|
this.provideContext();
|
|
62085
62020
|
|
|
62086
|
-
this.addEventListener('keydown', this.handleKeyDown);
|
|
62021
|
+
// this.addEventListener('keydown', this.handleKeyDown);
|
|
62087
62022
|
this.addEventListener('auroMenuOption-click', this.handleMouseSelect);
|
|
62088
62023
|
this.addEventListener('auroMenuOption-mouseover', this.handleOptionHover);
|
|
62089
62024
|
this.addEventListener('slotchange', this.handleSlotChange);
|
|
@@ -62091,7 +62026,7 @@ class AuroMenu extends AuroElement$2 {
|
|
|
62091
62026
|
}
|
|
62092
62027
|
|
|
62093
62028
|
disconnectedCallback() {
|
|
62094
|
-
this.removeEventListener('keydown', this.handleKeyDown);
|
|
62029
|
+
// this.removeEventListener('keydown', this.handleKeyDown);
|
|
62095
62030
|
this.removeEventListener('auroMenuOption-click', this.handleMouseSelect);
|
|
62096
62031
|
this.removeEventListener('auroMenuOption-mouseover', this.handleOptionHover);
|
|
62097
62032
|
this.removeEventListener('slotchange', this.handleSlotChange);
|
|
@@ -62172,9 +62107,9 @@ class AuroMenu extends AuroElement$2 {
|
|
|
62172
62107
|
if (this.multiSelect) {
|
|
62173
62108
|
this.setAttribute('aria-multiselectable', 'true');
|
|
62174
62109
|
}
|
|
62175
|
-
|
|
62176
|
-
this.handleNestedMenus(this);
|
|
62177
62110
|
}
|
|
62111
|
+
|
|
62112
|
+
this.handleNestedMenus(this);
|
|
62178
62113
|
}
|
|
62179
62114
|
|
|
62180
62115
|
/**
|
|
@@ -62232,26 +62167,33 @@ class AuroMenu extends AuroElement$2 {
|
|
|
62232
62167
|
|
|
62233
62168
|
// Event Handlers
|
|
62234
62169
|
|
|
62235
|
-
/**
|
|
62236
|
-
|
|
62237
|
-
|
|
62238
|
-
|
|
62239
|
-
|
|
62240
|
-
handleKeyDown(event) {
|
|
62241
|
-
|
|
62242
|
-
|
|
62243
|
-
|
|
62244
|
-
|
|
62245
|
-
|
|
62246
|
-
|
|
62247
|
-
|
|
62248
|
-
|
|
62249
|
-
|
|
62250
|
-
|
|
62251
|
-
|
|
62252
|
-
|
|
62253
|
-
|
|
62254
|
-
|
|
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
|
+
// }
|
|
62255
62197
|
|
|
62256
62198
|
/**
|
|
62257
62199
|
* Navigates the menu options in the specified direction.
|
|
@@ -62271,10 +62213,6 @@ class AuroMenu extends AuroElement$2 {
|
|
|
62271
62213
|
* @private
|
|
62272
62214
|
*/
|
|
62273
62215
|
handleSlotChange() {
|
|
62274
|
-
if (this.parentElement && this.parentElement.closest('auro-menu, [auro-menu]')) {
|
|
62275
|
-
this.rootMenu = false;
|
|
62276
|
-
}
|
|
62277
|
-
|
|
62278
62216
|
if (this.rootMenu) {
|
|
62279
62217
|
this.initializeMenu();
|
|
62280
62218
|
}
|
|
@@ -63559,7 +63497,7 @@ function restoreTriggerAfterClose(dropdown, focusTarget) {
|
|
|
63559
63497
|
* @returns {{isExpanded: boolean, isModal: boolean, isPopover: boolean, activeInput: HTMLElement|null}}
|
|
63560
63498
|
* isModal and isPopover reflect the display mode (fullscreen vs not) regardless of expanded state.
|
|
63561
63499
|
*/
|
|
63562
|
-
function createDisplayContext(component, options = {}) {
|
|
63500
|
+
function createDisplayContext$1(component, options = {}) {
|
|
63563
63501
|
const dd = options.dropdown || component.dropdown;
|
|
63564
63502
|
// isPopoverVisible reflects as the `open` attribute.
|
|
63565
63503
|
// It reports whether the bib is open in any mode (popover or modal).
|
|
@@ -63589,11 +63527,11 @@ function createDisplayContext(component, options = {}) {
|
|
|
63589
63527
|
* @param {Object} strategy - Map of key names to handler functions.
|
|
63590
63528
|
* @param {Object} [options] - Optional config passed to createDisplayContext.
|
|
63591
63529
|
*/
|
|
63592
|
-
function applyKeyboardStrategy(component, strategy, options = {}) {
|
|
63530
|
+
function applyKeyboardStrategy$1(component, strategy, options = {}) {
|
|
63593
63531
|
component.addEventListener('keydown', async (evt) => {
|
|
63594
63532
|
const handler = strategy[evt.key] || strategy.default;
|
|
63595
63533
|
if (typeof handler === 'function') {
|
|
63596
|
-
const ctx = createDisplayContext(component, options);
|
|
63534
|
+
const ctx = createDisplayContext$1(component, options);
|
|
63597
63535
|
await handler(component, evt, ctx);
|
|
63598
63536
|
}
|
|
63599
63537
|
});
|
|
@@ -65757,11 +65695,10 @@ class AuroFloatingUI {
|
|
|
65757
65695
|
return;
|
|
65758
65696
|
}
|
|
65759
65697
|
|
|
65760
|
-
const { activeElement } = document;
|
|
65761
65698
|
// if focus is still inside of trigger or bib, do not close
|
|
65762
65699
|
if (
|
|
65763
|
-
this.element.
|
|
65764
|
-
this.element.
|
|
65700
|
+
this.element.matches(":focus") ||
|
|
65701
|
+
this.element.matches(":focus-within")
|
|
65765
65702
|
) {
|
|
65766
65703
|
return;
|
|
65767
65704
|
}
|
|
@@ -66600,12 +66537,83 @@ let p$2 = class p{registerComponent(t,a){customElements.get(t)||customElements.d
|
|
|
66600
66537
|
|
|
66601
66538
|
var iconVersion$1 = '9.1.2';
|
|
66602
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
|
+
|
|
66603
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}`;
|
|
66604
66592
|
|
|
66605
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)}`;
|
|
66606
66594
|
|
|
66607
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)}`;
|
|
66608
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
|
+
|
|
66609
66617
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
66610
66618
|
// See LICENSE in the project root for license information.
|
|
66611
66619
|
/* eslint-disable max-lines */
|
|
@@ -66730,26 +66738,11 @@ class AuroDropdownBib extends i$4 {
|
|
|
66730
66738
|
},
|
|
66731
66739
|
|
|
66732
66740
|
/**
|
|
66733
|
-
*
|
|
66734
|
-
* aria-activedescendant. The dialog keyboard bridge checks this
|
|
66735
|
-
* flag so that Enter selects the highlighted option instead of
|
|
66736
|
-
* activating the focused interactive element (e.g. the trigger
|
|
66737
|
-
* button, or the bibtemplate close button in fullscreen).
|
|
66741
|
+
* Tracks whether a menu option is currently highlighted.
|
|
66738
66742
|
* @private
|
|
66739
66743
|
*/
|
|
66740
66744
|
hasActiveDescendant: {
|
|
66741
66745
|
type: Boolean
|
|
66742
|
-
},
|
|
66743
|
-
|
|
66744
|
-
/**
|
|
66745
|
-
* When true, the keyboard bridge allows native Tab behavior
|
|
66746
|
-
* instead of intercepting it. Set this for bib consumers
|
|
66747
|
-
* (e.g. counter) whose content contains real focusable elements
|
|
66748
|
-
* that need native Tab navigation.
|
|
66749
|
-
* @private
|
|
66750
|
-
*/
|
|
66751
|
-
nativeFocusableContent: {
|
|
66752
|
-
type: Boolean
|
|
66753
66746
|
}
|
|
66754
66747
|
};
|
|
66755
66748
|
}
|
|
@@ -66819,7 +66812,7 @@ class AuroDropdownBib extends i$4 {
|
|
|
66819
66812
|
|
|
66820
66813
|
const dialog = this.shadowRoot.querySelector('dialog');
|
|
66821
66814
|
this._setupCancelHandler(dialog);
|
|
66822
|
-
|
|
66815
|
+
applyKeyboardStrategy(dialog, createDropdownBibKeyboardStrategy());
|
|
66823
66816
|
|
|
66824
66817
|
this.dispatchEvent(new CustomEvent('auro-dropdownbib-connected', {
|
|
66825
66818
|
bubbles: true,
|
|
@@ -66846,98 +66839,6 @@ class AuroDropdownBib extends i$4 {
|
|
|
66846
66839
|
});
|
|
66847
66840
|
}
|
|
66848
66841
|
|
|
66849
|
-
/**
|
|
66850
|
-
* showModal() creates a closed focus scope — keyboard events inside
|
|
66851
|
-
* the dialog's shadow DOM do NOT bubble out to the combobox/select
|
|
66852
|
-
* keydown handlers in the parent shadow DOM. This handler bridges
|
|
66853
|
-
* that gap by re-dispatching navigation keys so they cross the
|
|
66854
|
-
* shadow boundary and reach the menu navigation logic in the parent
|
|
66855
|
-
* component.
|
|
66856
|
-
*
|
|
66857
|
-
* The trade-off: intercepting these keys means native keyboard
|
|
66858
|
-
* behaviors that would normally "just work" must be manually
|
|
66859
|
-
* re-implemented here:
|
|
66860
|
-
*
|
|
66861
|
-
* - Enter on buttons: Custom elements (auro-button) don't get the
|
|
66862
|
-
* native Enter→click that <button> provides, so we call .click()
|
|
66863
|
-
* directly when Enter is pressed on a button-like element.
|
|
66864
|
-
*
|
|
66865
|
-
* - Tab: Intercepted and re-dispatched so parent components
|
|
66866
|
-
* (select/combobox) can select the active option and close the
|
|
66867
|
-
* dialog. The <dialog> provides containment and isolation
|
|
66868
|
-
* (inert background, VoiceOver focus trapping, top layer), while
|
|
66869
|
-
* the content inside is a role="listbox" navigated via
|
|
66870
|
-
* aria-activedescendant (options are not focusable). Tab keyboard
|
|
66871
|
-
* behavior follows listbox conventions (select + close) because
|
|
66872
|
-
* the dialog's native Tab trap only cycles between the close
|
|
66873
|
-
* button and browser chrome.
|
|
66874
|
-
*
|
|
66875
|
-
* - Escape: The native <dialog> fires a `cancel` event on ESC
|
|
66876
|
-
* (handled by _setupCancelHandler), so the re-dispatched Escape
|
|
66877
|
-
* is a secondary path for parent components that also listen for
|
|
66878
|
-
* Escape keydown.
|
|
66879
|
-
*
|
|
66880
|
-
* @param {HTMLDialogElement} dialog - The dialog element to attach the keyboard bridge to.
|
|
66881
|
-
* @private
|
|
66882
|
-
*/
|
|
66883
|
-
_setupKeyboardBridge(dialog) {
|
|
66884
|
-
const navKeys = new Set([
|
|
66885
|
-
'ArrowUp',
|
|
66886
|
-
'ArrowDown',
|
|
66887
|
-
'Enter',
|
|
66888
|
-
'Escape',
|
|
66889
|
-
'Tab'
|
|
66890
|
-
]);
|
|
66891
|
-
|
|
66892
|
-
dialog.addEventListener('keydown', (event) => {
|
|
66893
|
-
if (!navKeys.has(event.key)) {
|
|
66894
|
-
return;
|
|
66895
|
-
}
|
|
66896
|
-
|
|
66897
|
-
// Custom elements (auro-button) don't get the native Enter→click
|
|
66898
|
-
// behavior that <button> has. Find the button in the composed path
|
|
66899
|
-
// and click it directly — but only when no menu option is
|
|
66900
|
-
// highlighted. In fullscreen mode focus stays on the close button
|
|
66901
|
-
// while arrow keys move the active-descendant highlight through
|
|
66902
|
-
// the listbox. If the user presses Enter with an option
|
|
66903
|
-
// highlighted, the intent is to select that option, not to click
|
|
66904
|
-
// the close button. In that case we fall through and bridge the
|
|
66905
|
-
// Enter key to the parent component's keyboard strategy.
|
|
66906
|
-
if (event.key === 'Enter') {
|
|
66907
|
-
if (!this.hasActiveDescendant) {
|
|
66908
|
-
const buttonSelector = 'button, [role="button"], auro-button, [auro-button]';
|
|
66909
|
-
const btn = event.composedPath().find((el) => el.matches && el.matches(buttonSelector));
|
|
66910
|
-
if (btn) {
|
|
66911
|
-
event.preventDefault();
|
|
66912
|
-
event.stopPropagation();
|
|
66913
|
-
btn.click();
|
|
66914
|
-
return;
|
|
66915
|
-
}
|
|
66916
|
-
}
|
|
66917
|
-
}
|
|
66918
|
-
|
|
66919
|
-
// Allow native Tab when the bib contains focusable content
|
|
66920
|
-
// (e.g. counter buttons) that needs normal Tab navigation.
|
|
66921
|
-
if (event.key === 'Tab' && this.nativeFocusableContent) {
|
|
66922
|
-
return;
|
|
66923
|
-
}
|
|
66924
|
-
|
|
66925
|
-
event.preventDefault();
|
|
66926
|
-
event.stopPropagation();
|
|
66927
|
-
const newEvent = new KeyboardEvent('keydown', {
|
|
66928
|
-
key: event.key,
|
|
66929
|
-
code: event.code,
|
|
66930
|
-
shiftKey: event.shiftKey,
|
|
66931
|
-
altKey: event.altKey,
|
|
66932
|
-
ctrlKey: event.ctrlKey,
|
|
66933
|
-
metaKey: event.metaKey,
|
|
66934
|
-
bubbles: true,
|
|
66935
|
-
composed: true,
|
|
66936
|
-
cancelable: true
|
|
66937
|
-
});
|
|
66938
|
-
this.dispatchEvent(newEvent);
|
|
66939
|
-
});
|
|
66940
|
-
}
|
|
66941
66842
|
|
|
66942
66843
|
/**
|
|
66943
66844
|
* Blocks touch-driven page scroll while a fullscreen modal dialog is open.
|
|
@@ -67312,7 +67213,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$4 {
|
|
|
67312
67213
|
}
|
|
67313
67214
|
};
|
|
67314
67215
|
|
|
67315
|
-
var formkitVersion$1 = '
|
|
67216
|
+
var formkitVersion$1 = '202604012043';
|
|
67316
67217
|
|
|
67317
67218
|
class AuroElement extends i$4 {
|
|
67318
67219
|
static get properties() {
|
|
@@ -67493,7 +67394,6 @@ class AuroDropdown extends AuroElement {
|
|
|
67493
67394
|
this.appearance = 'default';
|
|
67494
67395
|
this.chevron = false;
|
|
67495
67396
|
this.disabled = false;
|
|
67496
|
-
this.disableFocusTrap = false;
|
|
67497
67397
|
this.error = false;
|
|
67498
67398
|
this.tabIndex = 0;
|
|
67499
67399
|
this.noToggle = false;
|
|
@@ -67591,9 +67491,8 @@ class AuroDropdown extends AuroElement {
|
|
|
67591
67491
|
// showModal() fires asynchronously via Lit's update cycle, which
|
|
67592
67492
|
// falls outside the user activation window and causes iOS to
|
|
67593
67493
|
// dismiss the keyboard.
|
|
67594
|
-
if (this.
|
|
67595
|
-
|
|
67596
|
-
this.bibElement.value.open(useModal);
|
|
67494
|
+
if (this.bibElement && this.bibElement.value) {
|
|
67495
|
+
this.bibElement.value.open(this.isBibFullscreen);
|
|
67597
67496
|
}
|
|
67598
67497
|
}
|
|
67599
67498
|
|
|
@@ -67706,14 +67605,6 @@ class AuroDropdown extends AuroElement {
|
|
|
67706
67605
|
reflect: true
|
|
67707
67606
|
},
|
|
67708
67607
|
|
|
67709
|
-
/**
|
|
67710
|
-
* If declared, the focus trap inside of bib will be turned off.
|
|
67711
|
-
*/
|
|
67712
|
-
disableFocusTrap: {
|
|
67713
|
-
type: Boolean,
|
|
67714
|
-
reflect: true
|
|
67715
|
-
},
|
|
67716
|
-
|
|
67717
67608
|
/**
|
|
67718
67609
|
* @private
|
|
67719
67610
|
*/
|
|
@@ -67987,7 +67878,7 @@ class AuroDropdown extends AuroElement {
|
|
|
67987
67878
|
if (this.isPopoverVisible) {
|
|
67988
67879
|
// Fullscreen: use showModal() for native accessibility (inert outside, focus trap)
|
|
67989
67880
|
// Desktop: use show() for Floating UI positioning + FocusTrap for focus management
|
|
67990
|
-
const useModal = this.isBibFullscreen
|
|
67881
|
+
const useModal = this.isBibFullscreen;
|
|
67991
67882
|
this.bibElement.value.open(useModal);
|
|
67992
67883
|
} else {
|
|
67993
67884
|
this.bibElement.value.close();
|
|
@@ -67997,7 +67888,7 @@ class AuroDropdown extends AuroElement {
|
|
|
67997
67888
|
// When fullscreen strategy changes while open, re-open dialog with correct mode
|
|
67998
67889
|
// (e.g. resizing from desktop → mobile while dropdown is open)
|
|
67999
67890
|
if (changedProperties.has('isBibFullscreen') && this.isPopoverVisible && this.bibElement.value) {
|
|
68000
|
-
const useModal = this.isBibFullscreen
|
|
67891
|
+
const useModal = this.isBibFullscreen;
|
|
68001
67892
|
this.bibElement.value.close();
|
|
68002
67893
|
this.bibElement.value.open(useModal);
|
|
68003
67894
|
}
|
|
@@ -68109,7 +68000,7 @@ class AuroDropdown extends AuroElement {
|
|
|
68109
68000
|
* @private
|
|
68110
68001
|
*/
|
|
68111
68002
|
updateFocusTrap() {
|
|
68112
|
-
if (this.isPopoverVisible
|
|
68003
|
+
if (this.isPopoverVisible) {
|
|
68113
68004
|
if (!this.isBibFullscreen) {
|
|
68114
68005
|
// Desktop: show() doesn't trap focus, so use FocusTrap
|
|
68115
68006
|
this.focusTrap = new FocusTrap(this.bibContent);
|
|
@@ -69065,7 +68956,7 @@ class AuroHelpText extends i$4 {
|
|
|
69065
68956
|
}
|
|
69066
68957
|
}
|
|
69067
68958
|
|
|
69068
|
-
var formkitVersion = '
|
|
68959
|
+
var formkitVersion = '202604012043';
|
|
69069
68960
|
|
|
69070
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}`;
|
|
69071
68962
|
|
|
@@ -69587,7 +69478,7 @@ class AuroSelect extends AuroElement$1 {
|
|
|
69587
69478
|
|
|
69588
69479
|
// Prevent dropdown from closing on focus loss since menu content is slotted
|
|
69589
69480
|
// from select's light DOM and won't be detected by dropdown's contains() check.
|
|
69590
|
-
// Select handles Tab key closing explicitly,
|
|
69481
|
+
// Select handles Tab key closing explicitly, `Escape` key via dialog cancel, and
|
|
69591
69482
|
// click outside works correctly via composedPath().
|
|
69592
69483
|
this.dropdown.noHideOnThisFocusLoss = true;
|
|
69593
69484
|
|
|
@@ -69600,7 +69491,9 @@ class AuroSelect extends AuroElement$1 {
|
|
|
69600
69491
|
this.dropdown.setActiveDescendant(null);
|
|
69601
69492
|
this.optionActive = null;
|
|
69602
69493
|
|
|
69603
|
-
|
|
69494
|
+
if (this.dropdown.isBibFullscreen) {
|
|
69495
|
+
restoreTriggerAfterClose(this.dropdown, this.dropdown.trigger);
|
|
69496
|
+
}
|
|
69604
69497
|
}
|
|
69605
69498
|
|
|
69606
69499
|
if (this.dropdown.isPopoverVisible) {
|
|
@@ -69874,7 +69767,7 @@ class AuroSelect extends AuroElement$1 {
|
|
|
69874
69767
|
configureSelect() {
|
|
69875
69768
|
this.nativeSelect = this.shadowRoot.querySelector('select');
|
|
69876
69769
|
|
|
69877
|
-
applyKeyboardStrategy(this, selectKeyboardStrategy);
|
|
69770
|
+
applyKeyboardStrategy$1(this, selectKeyboardStrategy);
|
|
69878
69771
|
|
|
69879
69772
|
this.addEventListener('focusin', this.handleFocusin);
|
|
69880
69773
|
|