@aurodesignsystem-dev/auro-formkit 0.0.0-pr1425.0 → 0.0.0-pr1428.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/checkbox/demo/api.min.js +1 -1
- package/components/checkbox/demo/index.min.js +1 -1
- package/components/checkbox/dist/index.js +1 -1
- package/components/checkbox/dist/registered.js +1 -1
- package/components/combobox/demo/api.min.js +276 -165
- package/components/combobox/demo/index.min.js +276 -165
- package/components/combobox/dist/index.js +276 -165
- package/components/combobox/dist/registered.js +276 -165
- package/components/counter/demo/api.min.js +275 -164
- package/components/counter/demo/index.min.js +275 -164
- package/components/counter/dist/index.js +275 -164
- package/components/counter/dist/registered.js +275 -164
- package/components/datepicker/demo/api.min.js +276 -165
- package/components/datepicker/demo/index.min.js +276 -165
- package/components/datepicker/dist/index.js +276 -165
- package/components/datepicker/dist/registered.js +276 -165
- package/components/dropdown/demo/api.min.js +275 -164
- package/components/dropdown/demo/index.min.js +275 -164
- package/components/dropdown/dist/index.js +275 -164
- package/components/dropdown/dist/registered.js +275 -164
- package/components/form/demo/api.min.js +1105 -661
- package/components/form/demo/index.min.js +1105 -661
- package/components/input/demo/api.min.js +1 -1
- package/components/input/demo/index.min.js +1 -1
- package/components/input/dist/index.js +1 -1
- package/components/input/dist/registered.js +1 -1
- 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 +275 -164
- package/components/select/demo/index.min.js +275 -164
- package/components/select/dist/index.js +275 -164
- package/components/select/dist/registered.js +275 -164
- package/custom-elements.json +244 -244
- package/package.json +2 -2
|
@@ -7470,7 +7470,7 @@ let AuroHelpText$8 = class AuroHelpText extends i$4 {
|
|
|
7470
7470
|
}
|
|
7471
7471
|
};
|
|
7472
7472
|
|
|
7473
|
-
var formkitVersion$8 = '
|
|
7473
|
+
var formkitVersion$8 = '202604081417';
|
|
7474
7474
|
|
|
7475
7475
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
7476
7476
|
// See LICENSE in the project root for license information.
|
|
@@ -17392,7 +17392,7 @@ let AuroBibtemplate$3 = class AuroBibtemplate extends i$4 {
|
|
|
17392
17392
|
}
|
|
17393
17393
|
};
|
|
17394
17394
|
|
|
17395
|
-
var formkitVersion$2$1 = '
|
|
17395
|
+
var formkitVersion$2$1 = '202604081417';
|
|
17396
17396
|
|
|
17397
17397
|
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}
|
|
17398
17398
|
`,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}}
|
|
@@ -19702,11 +19702,19 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
19702
19702
|
* This ensures that the bib content has the same dimensions as the sizer element.
|
|
19703
19703
|
*/
|
|
19704
19704
|
mirrorSize() {
|
|
19705
|
+
const element = this.element;
|
|
19706
|
+
if (!element) {
|
|
19707
|
+
return;
|
|
19708
|
+
}
|
|
19709
|
+
|
|
19705
19710
|
// mirror the boxsize from bibSizer
|
|
19706
|
-
if (
|
|
19707
|
-
const sizerStyle = window.getComputedStyle(
|
|
19708
|
-
const bibContent =
|
|
19709
|
-
|
|
19711
|
+
if (element.bibSizer && element.matchWidth && element.bib?.shadowRoot) {
|
|
19712
|
+
const sizerStyle = window.getComputedStyle(element.bibSizer);
|
|
19713
|
+
const bibContent = element.bib.shadowRoot.querySelector(".container");
|
|
19714
|
+
if (!bibContent) {
|
|
19715
|
+
return;
|
|
19716
|
+
}
|
|
19717
|
+
|
|
19710
19718
|
if (sizerStyle.width !== "0px") {
|
|
19711
19719
|
bibContent.style.width = sizerStyle.width;
|
|
19712
19720
|
}
|
|
@@ -19728,9 +19736,14 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
19728
19736
|
* @returns {String} The positioning strategy, one of 'fullscreen', 'floating', 'cover'.
|
|
19729
19737
|
*/
|
|
19730
19738
|
getPositioningStrategy() {
|
|
19739
|
+
const element = this.element;
|
|
19740
|
+
if (!element) {
|
|
19741
|
+
return "floating";
|
|
19742
|
+
}
|
|
19743
|
+
|
|
19731
19744
|
const breakpoint =
|
|
19732
|
-
|
|
19733
|
-
|
|
19745
|
+
element.bib?.mobileFullscreenBreakpoint ||
|
|
19746
|
+
element.floaterConfig?.fullscreenBreakpoint;
|
|
19734
19747
|
switch (this.behavior) {
|
|
19735
19748
|
case "tooltip":
|
|
19736
19749
|
return "floating";
|
|
@@ -19741,9 +19754,9 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
19741
19754
|
`(max-width: ${breakpoint})`,
|
|
19742
19755
|
).matches;
|
|
19743
19756
|
|
|
19744
|
-
|
|
19757
|
+
element.expanded = smallerThanBreakpoint;
|
|
19745
19758
|
}
|
|
19746
|
-
if (
|
|
19759
|
+
if (element.nested) {
|
|
19747
19760
|
return "cover";
|
|
19748
19761
|
}
|
|
19749
19762
|
return "fullscreen";
|
|
@@ -19773,42 +19786,65 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
19773
19786
|
* and applies the calculated position to the bib's style.
|
|
19774
19787
|
*/
|
|
19775
19788
|
position() {
|
|
19789
|
+
const element = this.element;
|
|
19790
|
+
if (!element) {
|
|
19791
|
+
return;
|
|
19792
|
+
}
|
|
19793
|
+
|
|
19776
19794
|
const strategy = this.getPositioningStrategy();
|
|
19777
19795
|
this.configureBibStrategy(strategy);
|
|
19778
19796
|
|
|
19779
19797
|
if (strategy === "floating") {
|
|
19798
|
+
if (!element.trigger || !element.bib) {
|
|
19799
|
+
return;
|
|
19800
|
+
}
|
|
19801
|
+
|
|
19780
19802
|
this.mirrorSize();
|
|
19781
19803
|
// Define the middlware for the floater configuration
|
|
19782
19804
|
const middleware = [
|
|
19783
|
-
offset$4(
|
|
19784
|
-
...(
|
|
19785
|
-
...(
|
|
19786
|
-
...(
|
|
19805
|
+
offset$4(element.floaterConfig?.offset || 0),
|
|
19806
|
+
...(element.floaterConfig?.shift ? [shift$4()] : []), // Add shift middleware if shift is enabled.
|
|
19807
|
+
...(element.floaterConfig?.flip ? [flip$4()] : []), // Add flip middleware if flip is enabled.
|
|
19808
|
+
...(element.floaterConfig?.autoPlacement ? [autoPlacement$4()] : []), // Add autoPlacement middleware if autoPlacement is enabled.
|
|
19787
19809
|
];
|
|
19788
19810
|
|
|
19789
19811
|
// Compute the position of the bib
|
|
19790
|
-
computePosition$4(
|
|
19791
|
-
strategy:
|
|
19792
|
-
placement:
|
|
19812
|
+
computePosition$4(element.trigger, element.bib, {
|
|
19813
|
+
strategy: element.floaterConfig?.strategy || "fixed",
|
|
19814
|
+
placement: element.floaterConfig?.placement,
|
|
19793
19815
|
middleware: middleware || [],
|
|
19794
19816
|
}).then(({ x, y }) => {
|
|
19795
19817
|
// eslint-disable-line id-length
|
|
19796
|
-
|
|
19818
|
+
const currentElement = this.element;
|
|
19819
|
+
if (!currentElement?.bib) {
|
|
19820
|
+
return;
|
|
19821
|
+
}
|
|
19822
|
+
|
|
19823
|
+
Object.assign(currentElement.bib.style, {
|
|
19797
19824
|
left: `${x}px`,
|
|
19798
19825
|
top: `${y}px`,
|
|
19799
19826
|
});
|
|
19800
19827
|
});
|
|
19801
19828
|
} else if (strategy === "cover") {
|
|
19829
|
+
if (!element.parentNode || !element.bib) {
|
|
19830
|
+
return;
|
|
19831
|
+
}
|
|
19832
|
+
|
|
19802
19833
|
// Compute the position of the bib
|
|
19803
|
-
computePosition$4(
|
|
19834
|
+
computePosition$4(element.parentNode, element.bib, {
|
|
19804
19835
|
placement: "bottom-start",
|
|
19805
19836
|
}).then(({ x, y }) => {
|
|
19806
19837
|
// eslint-disable-line id-length
|
|
19807
|
-
|
|
19838
|
+
const currentElement = this.element;
|
|
19839
|
+
if (!currentElement?.bib || !currentElement.parentNode) {
|
|
19840
|
+
return;
|
|
19841
|
+
}
|
|
19842
|
+
|
|
19843
|
+
Object.assign(currentElement.bib.style, {
|
|
19808
19844
|
left: `${x}px`,
|
|
19809
|
-
top: `${y -
|
|
19810
|
-
width: `${
|
|
19811
|
-
height: `${
|
|
19845
|
+
top: `${y - currentElement.parentNode.offsetHeight}px`,
|
|
19846
|
+
width: `${currentElement.parentNode.offsetWidth}px`,
|
|
19847
|
+
height: `${currentElement.parentNode.offsetHeight}px`,
|
|
19812
19848
|
});
|
|
19813
19849
|
});
|
|
19814
19850
|
}
|
|
@@ -19820,11 +19856,17 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
19820
19856
|
* @param {Boolean} lock - If true, locks the body's scrolling functionlity; otherwise, unlock.
|
|
19821
19857
|
*/
|
|
19822
19858
|
lockScroll(lock = true) {
|
|
19859
|
+
const element = this.element;
|
|
19860
|
+
|
|
19823
19861
|
if (lock) {
|
|
19862
|
+
if (!element?.bib) {
|
|
19863
|
+
return;
|
|
19864
|
+
}
|
|
19865
|
+
|
|
19824
19866
|
document.body.style.overflow = "hidden"; // hide body's scrollbar
|
|
19825
19867
|
|
|
19826
19868
|
// Move `bib` by the amount the viewport is shifted to stay aligned in fullscreen.
|
|
19827
|
-
|
|
19869
|
+
element.bib.style.transform = `translateY(${window?.visualViewport?.offsetTop}px)`;
|
|
19828
19870
|
} else {
|
|
19829
19871
|
document.body.style.overflow = "";
|
|
19830
19872
|
}
|
|
@@ -19840,20 +19882,24 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
19840
19882
|
* @param {string} strategy - The positioning strategy ('fullscreen' or 'floating').
|
|
19841
19883
|
*/
|
|
19842
19884
|
configureBibStrategy(value) {
|
|
19885
|
+
const element = this.element;
|
|
19886
|
+
if (!element?.bib) {
|
|
19887
|
+
return;
|
|
19888
|
+
}
|
|
19889
|
+
|
|
19843
19890
|
if (value === "fullscreen") {
|
|
19844
|
-
|
|
19891
|
+
element.isBibFullscreen = true;
|
|
19845
19892
|
// reset the prev position
|
|
19846
|
-
|
|
19847
|
-
|
|
19848
|
-
|
|
19849
|
-
|
|
19850
|
-
|
|
19851
|
-
|
|
19852
|
-
|
|
19893
|
+
element.bib.setAttribute("isfullscreen", "");
|
|
19894
|
+
element.bib.style.position = "fixed";
|
|
19895
|
+
element.bib.style.top = "0px";
|
|
19896
|
+
element.bib.style.left = "0px";
|
|
19897
|
+
element.bib.style.width = "";
|
|
19898
|
+
element.bib.style.height = "";
|
|
19899
|
+
element.style.contain = "";
|
|
19853
19900
|
|
|
19854
19901
|
// reset the size that was mirroring `size` css-part
|
|
19855
|
-
const bibContent =
|
|
19856
|
-
this.element.bib.shadowRoot.querySelector(".container");
|
|
19902
|
+
const bibContent = element.bib.shadowRoot?.querySelector(".container");
|
|
19857
19903
|
if (bibContent) {
|
|
19858
19904
|
bibContent.style.width = "";
|
|
19859
19905
|
bibContent.style.height = "";
|
|
@@ -19868,14 +19914,14 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
19868
19914
|
}, 0);
|
|
19869
19915
|
}
|
|
19870
19916
|
|
|
19871
|
-
if (
|
|
19917
|
+
if (element.isPopoverVisible) {
|
|
19872
19918
|
this.lockScroll(true);
|
|
19873
19919
|
}
|
|
19874
19920
|
} else {
|
|
19875
|
-
|
|
19876
|
-
|
|
19877
|
-
|
|
19878
|
-
|
|
19921
|
+
element.bib.style.position = "";
|
|
19922
|
+
element.bib.removeAttribute("isfullscreen");
|
|
19923
|
+
element.isBibFullscreen = false;
|
|
19924
|
+
element.style.contain = "layout";
|
|
19879
19925
|
}
|
|
19880
19926
|
|
|
19881
19927
|
const isChanged = this.strategy && this.strategy !== value;
|
|
@@ -19893,16 +19939,21 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
19893
19939
|
},
|
|
19894
19940
|
);
|
|
19895
19941
|
|
|
19896
|
-
|
|
19942
|
+
element.dispatchEvent(event);
|
|
19897
19943
|
}
|
|
19898
19944
|
}
|
|
19899
19945
|
|
|
19900
19946
|
updateState() {
|
|
19901
|
-
const
|
|
19947
|
+
const element = this.element;
|
|
19948
|
+
if (!element) {
|
|
19949
|
+
return;
|
|
19950
|
+
}
|
|
19951
|
+
|
|
19952
|
+
const isVisible = element.isPopoverVisible;
|
|
19902
19953
|
if (!isVisible) {
|
|
19903
19954
|
this.cleanupHideHandlers();
|
|
19904
19955
|
try {
|
|
19905
|
-
|
|
19956
|
+
element.cleanup?.();
|
|
19906
19957
|
} catch (error) {
|
|
19907
19958
|
// Do nothing
|
|
19908
19959
|
}
|
|
@@ -19918,28 +19969,30 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
19918
19969
|
* If not, and if the bib isn't in fullscreen mode with focus lost, it hides the bib.
|
|
19919
19970
|
*/
|
|
19920
19971
|
handleFocusLoss() {
|
|
19972
|
+
const element = this.element;
|
|
19973
|
+
if (!element?.bib) {
|
|
19974
|
+
return;
|
|
19975
|
+
}
|
|
19976
|
+
|
|
19921
19977
|
// if mouse is being pressed, skip and let click event to handle the action
|
|
19922
19978
|
if (AuroFloatingUI.isMousePressed) {
|
|
19923
19979
|
return;
|
|
19924
19980
|
}
|
|
19925
19981
|
|
|
19926
19982
|
if (
|
|
19927
|
-
|
|
19928
|
-
|
|
19983
|
+
element.noHideOnThisFocusLoss ||
|
|
19984
|
+
element.hasAttribute("noHideOnThisFocusLoss")
|
|
19929
19985
|
) {
|
|
19930
19986
|
return;
|
|
19931
19987
|
}
|
|
19932
19988
|
|
|
19933
19989
|
// if focus is still inside of trigger or bib, do not close
|
|
19934
|
-
if (
|
|
19935
|
-
this.element.matches(":focus") ||
|
|
19936
|
-
this.element.matches(":focus-within")
|
|
19937
|
-
) {
|
|
19990
|
+
if (element.matches(":focus") || element.matches(":focus-within")) {
|
|
19938
19991
|
return;
|
|
19939
19992
|
}
|
|
19940
19993
|
|
|
19941
19994
|
// if fullscreen bib is in fullscreen mode, do not close
|
|
19942
|
-
if (
|
|
19995
|
+
if (element.bib.hasAttribute("isfullscreen")) {
|
|
19943
19996
|
return;
|
|
19944
19997
|
}
|
|
19945
19998
|
|
|
@@ -19947,23 +20000,33 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
19947
20000
|
}
|
|
19948
20001
|
|
|
19949
20002
|
setupHideHandlers() {
|
|
20003
|
+
const element = this.element;
|
|
20004
|
+
if (!element) {
|
|
20005
|
+
return;
|
|
20006
|
+
}
|
|
20007
|
+
|
|
19950
20008
|
// Define handlers & store references
|
|
19951
20009
|
this.focusHandler = () => this.handleFocusLoss();
|
|
19952
20010
|
|
|
19953
20011
|
this.clickHandler = (evt) => {
|
|
20012
|
+
const element = this.element;
|
|
20013
|
+
if (!element?.bib) {
|
|
20014
|
+
return;
|
|
20015
|
+
}
|
|
20016
|
+
|
|
19954
20017
|
// When the bib is fullscreen (modal dialog), don't close on outside
|
|
19955
20018
|
// clicks. VoiceOver's synthetic click events inside a top-layer modal
|
|
19956
20019
|
// <dialog> may not include the bib in composedPath(), causing false
|
|
19957
20020
|
// positives. This mirrors the fullscreen guard in handleFocusLoss().
|
|
19958
|
-
if (
|
|
20021
|
+
if (element.bib.hasAttribute("isfullscreen")) {
|
|
19959
20022
|
return;
|
|
19960
20023
|
}
|
|
19961
20024
|
|
|
19962
20025
|
if (
|
|
19963
|
-
(!evt.composedPath().includes(
|
|
19964
|
-
!evt.composedPath().includes(
|
|
19965
|
-
(
|
|
19966
|
-
evt.composedPath().includes(
|
|
20026
|
+
(!evt.composedPath().includes(element.trigger) &&
|
|
20027
|
+
!evt.composedPath().includes(element.bib)) ||
|
|
20028
|
+
(element.bib.backdrop &&
|
|
20029
|
+
evt.composedPath().includes(element.bib.backdrop))
|
|
19967
20030
|
) {
|
|
19968
20031
|
const existedVisibleFloatingUI =
|
|
19969
20032
|
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
@@ -19984,7 +20047,12 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
19984
20047
|
|
|
19985
20048
|
// ESC key handler
|
|
19986
20049
|
this.keyDownHandler = (evt) => {
|
|
19987
|
-
|
|
20050
|
+
const element = this.element;
|
|
20051
|
+
if (!element) {
|
|
20052
|
+
return;
|
|
20053
|
+
}
|
|
20054
|
+
|
|
20055
|
+
if (evt.key === "Escape" && element.isPopoverVisible) {
|
|
19988
20056
|
const existedVisibleFloatingUI =
|
|
19989
20057
|
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
19990
20058
|
if (
|
|
@@ -20041,6 +20109,10 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
20041
20109
|
}
|
|
20042
20110
|
|
|
20043
20111
|
updateCurrentExpandedDropdown() {
|
|
20112
|
+
if (!this.element) {
|
|
20113
|
+
return;
|
|
20114
|
+
}
|
|
20115
|
+
|
|
20044
20116
|
// Close any other dropdown that is already open
|
|
20045
20117
|
const existedVisibleFloatingUI =
|
|
20046
20118
|
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
@@ -20057,25 +20129,34 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
20057
20129
|
}
|
|
20058
20130
|
|
|
20059
20131
|
showBib() {
|
|
20060
|
-
|
|
20132
|
+
const element = this.element;
|
|
20133
|
+
if (!element) {
|
|
20134
|
+
return;
|
|
20135
|
+
}
|
|
20136
|
+
|
|
20137
|
+
if (!element.bib || (!element.trigger && !element.parentNode)) {
|
|
20138
|
+
return;
|
|
20139
|
+
}
|
|
20140
|
+
|
|
20141
|
+
if (!element.disabled && !this.showing) {
|
|
20061
20142
|
this.updateCurrentExpandedDropdown();
|
|
20062
|
-
|
|
20143
|
+
element.triggerChevron?.setAttribute("data-expanded", true);
|
|
20063
20144
|
|
|
20064
20145
|
// prevent double showing: isPopovervisible gets first and showBib gets called later
|
|
20065
20146
|
if (!this.showing) {
|
|
20066
|
-
if (!
|
|
20147
|
+
if (!element.modal) {
|
|
20067
20148
|
this.setupHideHandlers();
|
|
20068
20149
|
}
|
|
20069
20150
|
this.showing = true;
|
|
20070
|
-
|
|
20151
|
+
element.isPopoverVisible = true;
|
|
20071
20152
|
this.position();
|
|
20072
20153
|
this.dispatchEventDropdownToggle();
|
|
20073
20154
|
}
|
|
20074
20155
|
|
|
20075
20156
|
// Setup auto update to handle resize and scroll
|
|
20076
|
-
|
|
20077
|
-
|
|
20078
|
-
|
|
20157
|
+
element.cleanup = autoUpdate$3(
|
|
20158
|
+
element.trigger || element.parentNode,
|
|
20159
|
+
element.bib,
|
|
20079
20160
|
() => {
|
|
20080
20161
|
this.position();
|
|
20081
20162
|
},
|
|
@@ -20088,22 +20169,27 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
20088
20169
|
* @param {String} eventType - The event type that triggered the hiding action.
|
|
20089
20170
|
*/
|
|
20090
20171
|
hideBib(eventType = "unknown") {
|
|
20091
|
-
|
|
20172
|
+
const element = this.element;
|
|
20173
|
+
if (!element) {
|
|
20174
|
+
return;
|
|
20175
|
+
}
|
|
20176
|
+
|
|
20177
|
+
if (element.disabled) {
|
|
20092
20178
|
return;
|
|
20093
20179
|
}
|
|
20094
20180
|
|
|
20095
20181
|
// noToggle dropdowns should not close when the trigger is clicked (the
|
|
20096
20182
|
// "toggle" behavior), but they CAN still close via other interactions like
|
|
20097
20183
|
// Escape key or focus loss.
|
|
20098
|
-
if (
|
|
20184
|
+
if (element.noToggle && eventType === "click") {
|
|
20099
20185
|
return;
|
|
20100
20186
|
}
|
|
20101
20187
|
|
|
20102
20188
|
this.lockScroll(false);
|
|
20103
|
-
|
|
20189
|
+
element.triggerChevron?.removeAttribute("data-expanded");
|
|
20104
20190
|
|
|
20105
|
-
if (
|
|
20106
|
-
|
|
20191
|
+
if (element.isPopoverVisible) {
|
|
20192
|
+
element.isPopoverVisible = false;
|
|
20107
20193
|
}
|
|
20108
20194
|
if (this.showing) {
|
|
20109
20195
|
this.cleanupHideHandlers();
|
|
@@ -20123,6 +20209,11 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
20123
20209
|
* @param {String} eventType - The event type that triggered the toggle action.
|
|
20124
20210
|
*/
|
|
20125
20211
|
dispatchEventDropdownToggle(eventType) {
|
|
20212
|
+
const element = this.element;
|
|
20213
|
+
if (!element) {
|
|
20214
|
+
return;
|
|
20215
|
+
}
|
|
20216
|
+
|
|
20126
20217
|
const event = new CustomEvent(
|
|
20127
20218
|
this.eventPrefix ? `${this.eventPrefix}-toggled` : "toggled",
|
|
20128
20219
|
{
|
|
@@ -20134,11 +20225,16 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
20134
20225
|
},
|
|
20135
20226
|
);
|
|
20136
20227
|
|
|
20137
|
-
|
|
20228
|
+
element.dispatchEvent(event);
|
|
20138
20229
|
}
|
|
20139
20230
|
|
|
20140
20231
|
handleClick() {
|
|
20141
|
-
|
|
20232
|
+
const element = this.element;
|
|
20233
|
+
if (!element) {
|
|
20234
|
+
return;
|
|
20235
|
+
}
|
|
20236
|
+
|
|
20237
|
+
if (element.isPopoverVisible) {
|
|
20142
20238
|
this.hideBib("click");
|
|
20143
20239
|
} else {
|
|
20144
20240
|
this.showBib();
|
|
@@ -20149,63 +20245,66 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
20149
20245
|
{
|
|
20150
20246
|
composed: true,
|
|
20151
20247
|
detail: {
|
|
20152
|
-
expanded:
|
|
20248
|
+
expanded: element.isPopoverVisible,
|
|
20153
20249
|
},
|
|
20154
20250
|
},
|
|
20155
20251
|
);
|
|
20156
20252
|
|
|
20157
|
-
|
|
20253
|
+
element.dispatchEvent(event);
|
|
20158
20254
|
}
|
|
20159
20255
|
|
|
20160
20256
|
handleEvent(event) {
|
|
20161
|
-
|
|
20162
|
-
|
|
20163
|
-
|
|
20164
|
-
|
|
20165
|
-
|
|
20166
|
-
|
|
20167
|
-
|
|
20168
|
-
|
|
20169
|
-
|
|
20170
|
-
|
|
20171
|
-
|
|
20172
|
-
|
|
20173
|
-
|
|
20174
|
-
|
|
20175
|
-
|
|
20176
|
-
|
|
20177
|
-
case "mouseenter":
|
|
20178
|
-
if (this.element.hoverToggle) {
|
|
20179
|
-
this.showBib();
|
|
20180
|
-
}
|
|
20181
|
-
break;
|
|
20182
|
-
case "mouseleave":
|
|
20183
|
-
if (this.element.hoverToggle) {
|
|
20184
|
-
this.hideBib("mouseleave");
|
|
20185
|
-
}
|
|
20186
|
-
break;
|
|
20187
|
-
case "focus":
|
|
20188
|
-
if (this.element.focusShow) {
|
|
20189
|
-
/*
|
|
20190
|
-
This needs to better handle clicking that gives focus -
|
|
20191
|
-
currently it shows and then immediately hides the bib
|
|
20192
|
-
*/
|
|
20193
|
-
this.showBib();
|
|
20194
|
-
}
|
|
20195
|
-
break;
|
|
20196
|
-
case "blur":
|
|
20197
|
-
// send this task 100ms later queue to
|
|
20198
|
-
// wait a frame in case focus moves within the floating element/bib
|
|
20199
|
-
setTimeout(() => this.handleFocusLoss(), 0);
|
|
20200
|
-
break;
|
|
20201
|
-
case "click":
|
|
20202
|
-
if (document.activeElement === document.body) {
|
|
20203
|
-
event.currentTarget.focus();
|
|
20204
|
-
}
|
|
20257
|
+
const element = this.element;
|
|
20258
|
+
if (!element || element.disableEventShow) {
|
|
20259
|
+
return;
|
|
20260
|
+
}
|
|
20261
|
+
|
|
20262
|
+
switch (event.type) {
|
|
20263
|
+
case "keydown": {
|
|
20264
|
+
// Support both Enter and Space keys for accessibility
|
|
20265
|
+
// Space is included as it's expected behavior for interactive elements
|
|
20266
|
+
|
|
20267
|
+
const origin = event.composedPath()[0];
|
|
20268
|
+
if (
|
|
20269
|
+
event.key === "Enter" ||
|
|
20270
|
+
(event.key === " " && (!origin || origin.tagName !== "INPUT"))
|
|
20271
|
+
) {
|
|
20272
|
+
event.preventDefault();
|
|
20205
20273
|
this.handleClick();
|
|
20206
|
-
|
|
20207
|
-
|
|
20274
|
+
}
|
|
20275
|
+
break;
|
|
20208
20276
|
}
|
|
20277
|
+
case "mouseenter":
|
|
20278
|
+
if (element.hoverToggle) {
|
|
20279
|
+
this.showBib();
|
|
20280
|
+
}
|
|
20281
|
+
break;
|
|
20282
|
+
case "mouseleave":
|
|
20283
|
+
if (element.hoverToggle) {
|
|
20284
|
+
this.hideBib("mouseleave");
|
|
20285
|
+
}
|
|
20286
|
+
break;
|
|
20287
|
+
case "focus":
|
|
20288
|
+
if (element.focusShow) {
|
|
20289
|
+
/*
|
|
20290
|
+
This needs to better handle clicking that gives focus -
|
|
20291
|
+
currently it shows and then immediately hides the bib
|
|
20292
|
+
*/
|
|
20293
|
+
this.showBib();
|
|
20294
|
+
}
|
|
20295
|
+
break;
|
|
20296
|
+
case "blur":
|
|
20297
|
+
// send this task 100ms later queue to
|
|
20298
|
+
// wait a frame in case focus moves within the floating element/bib
|
|
20299
|
+
setTimeout(() => this.handleFocusLoss(), 0);
|
|
20300
|
+
break;
|
|
20301
|
+
case "click":
|
|
20302
|
+
if (document.activeElement === document.body) {
|
|
20303
|
+
event.currentTarget.focus();
|
|
20304
|
+
}
|
|
20305
|
+
this.handleClick();
|
|
20306
|
+
break;
|
|
20307
|
+
// Do nothing
|
|
20209
20308
|
}
|
|
20210
20309
|
}
|
|
20211
20310
|
|
|
@@ -20216,6 +20315,11 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
20216
20315
|
* This prevents the component itself from being focusable when the trigger element already handles focus.
|
|
20217
20316
|
*/
|
|
20218
20317
|
handleTriggerTabIndex() {
|
|
20318
|
+
const element = this.element;
|
|
20319
|
+
if (!element) {
|
|
20320
|
+
return;
|
|
20321
|
+
}
|
|
20322
|
+
|
|
20219
20323
|
const focusableElementSelectors = [
|
|
20220
20324
|
"a",
|
|
20221
20325
|
"button",
|
|
@@ -20228,7 +20332,7 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
20228
20332
|
"auro-hyperlink",
|
|
20229
20333
|
];
|
|
20230
20334
|
|
|
20231
|
-
const triggerNode =
|
|
20335
|
+
const triggerNode = element.querySelectorAll('[slot="trigger"]')[0];
|
|
20232
20336
|
if (!triggerNode) {
|
|
20233
20337
|
return;
|
|
20234
20338
|
}
|
|
@@ -20237,13 +20341,13 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
20237
20341
|
focusableElementSelectors.forEach((selector) => {
|
|
20238
20342
|
// Check if the trigger node element is focusable
|
|
20239
20343
|
if (triggerNodeTagName === selector) {
|
|
20240
|
-
|
|
20344
|
+
element.tabIndex = -1;
|
|
20241
20345
|
return;
|
|
20242
20346
|
}
|
|
20243
20347
|
|
|
20244
20348
|
// Check if any child is focusable
|
|
20245
20349
|
if (triggerNode.querySelector(selector)) {
|
|
20246
|
-
|
|
20350
|
+
element.tabIndex = -1;
|
|
20247
20351
|
}
|
|
20248
20352
|
});
|
|
20249
20353
|
}
|
|
@@ -20253,13 +20357,18 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
20253
20357
|
* @param {*} eventPrefix
|
|
20254
20358
|
*/
|
|
20255
20359
|
regenerateBibId() {
|
|
20256
|
-
|
|
20360
|
+
const element = this.element;
|
|
20361
|
+
if (!element) {
|
|
20362
|
+
return;
|
|
20363
|
+
}
|
|
20364
|
+
|
|
20365
|
+
this.id = element.getAttribute("id");
|
|
20257
20366
|
if (!this.id) {
|
|
20258
20367
|
this.id = window.crypto.randomUUID();
|
|
20259
|
-
|
|
20368
|
+
element.setAttribute("id", this.id);
|
|
20260
20369
|
}
|
|
20261
20370
|
|
|
20262
|
-
|
|
20371
|
+
element.bib?.setAttribute("id", `${this.id}-floater-bib`);
|
|
20263
20372
|
}
|
|
20264
20373
|
|
|
20265
20374
|
configure(elem, eventPrefix, enableKeyboardHandling = true) {
|
|
@@ -20271,67 +20380,69 @@ let AuroFloatingUI$3 = class AuroFloatingUI {
|
|
|
20271
20380
|
this.element = elem;
|
|
20272
20381
|
}
|
|
20273
20382
|
|
|
20274
|
-
|
|
20275
|
-
|
|
20383
|
+
const element = this.element;
|
|
20384
|
+
if (!element) {
|
|
20385
|
+
return;
|
|
20276
20386
|
}
|
|
20277
20387
|
|
|
20278
|
-
if (this.element.
|
|
20388
|
+
if (this.behavior !== element.behavior) {
|
|
20389
|
+
this.behavior = element.behavior;
|
|
20390
|
+
}
|
|
20391
|
+
|
|
20392
|
+
if (element.trigger) {
|
|
20279
20393
|
this.disconnect();
|
|
20280
20394
|
}
|
|
20281
|
-
|
|
20282
|
-
|
|
20283
|
-
|
|
20284
|
-
|
|
20285
|
-
|
|
20286
|
-
|
|
20287
|
-
|
|
20288
|
-
|
|
20289
|
-
this.element.shadowRoot.querySelector("#showStateIcon");
|
|
20395
|
+
element.trigger =
|
|
20396
|
+
element.triggerElement ||
|
|
20397
|
+
element.shadowRoot?.querySelector("#trigger") ||
|
|
20398
|
+
element.trigger;
|
|
20399
|
+
element.bib = element.shadowRoot?.querySelector("#bib") || element.bib;
|
|
20400
|
+
element.bibSizer = element.shadowRoot?.querySelector("#bibSizer");
|
|
20401
|
+
element.triggerChevron =
|
|
20402
|
+
element.shadowRoot?.querySelector("#showStateIcon");
|
|
20290
20403
|
|
|
20291
|
-
if (
|
|
20292
|
-
|
|
20404
|
+
if (element.floaterConfig) {
|
|
20405
|
+
element.hoverToggle = element.floaterConfig.hoverToggle;
|
|
20293
20406
|
}
|
|
20294
20407
|
|
|
20295
20408
|
this.regenerateBibId();
|
|
20296
20409
|
this.handleTriggerTabIndex();
|
|
20297
20410
|
|
|
20298
20411
|
this.handleEvent = this.handleEvent.bind(this);
|
|
20299
|
-
if (
|
|
20412
|
+
if (element.trigger) {
|
|
20300
20413
|
if (this.enableKeyboardHandling) {
|
|
20301
|
-
|
|
20414
|
+
element.trigger.addEventListener("keydown", this.handleEvent);
|
|
20302
20415
|
}
|
|
20303
|
-
|
|
20304
|
-
|
|
20305
|
-
|
|
20306
|
-
|
|
20307
|
-
|
|
20416
|
+
element.trigger.addEventListener("click", this.handleEvent);
|
|
20417
|
+
element.trigger.addEventListener("mouseenter", this.handleEvent);
|
|
20418
|
+
element.trigger.addEventListener("mouseleave", this.handleEvent);
|
|
20419
|
+
element.trigger.addEventListener("focus", this.handleEvent);
|
|
20420
|
+
element.trigger.addEventListener("blur", this.handleEvent);
|
|
20308
20421
|
}
|
|
20309
20422
|
}
|
|
20310
20423
|
|
|
20311
20424
|
disconnect() {
|
|
20312
20425
|
this.cleanupHideHandlers();
|
|
20313
|
-
if (this.element) {
|
|
20314
|
-
this.element.cleanup?.();
|
|
20315
20426
|
|
|
20316
|
-
|
|
20317
|
-
|
|
20318
|
-
|
|
20427
|
+
const element = this.element;
|
|
20428
|
+
if (!element) {
|
|
20429
|
+
return;
|
|
20430
|
+
}
|
|
20319
20431
|
|
|
20320
|
-
|
|
20321
|
-
|
|
20322
|
-
|
|
20323
|
-
|
|
20324
|
-
|
|
20325
|
-
|
|
20326
|
-
|
|
20327
|
-
|
|
20328
|
-
|
|
20329
|
-
|
|
20330
|
-
|
|
20331
|
-
|
|
20332
|
-
|
|
20333
|
-
|
|
20334
|
-
}
|
|
20432
|
+
element.cleanup?.();
|
|
20433
|
+
|
|
20434
|
+
if (element.bib && element.shadowRoot) {
|
|
20435
|
+
element.shadowRoot.append(element.bib);
|
|
20436
|
+
}
|
|
20437
|
+
|
|
20438
|
+
// Remove event & keyboard listeners
|
|
20439
|
+
if (element.trigger) {
|
|
20440
|
+
element.trigger.removeEventListener("keydown", this.handleEvent);
|
|
20441
|
+
element.trigger.removeEventListener("click", this.handleEvent);
|
|
20442
|
+
element.trigger.removeEventListener("mouseenter", this.handleEvent);
|
|
20443
|
+
element.trigger.removeEventListener("mouseleave", this.handleEvent);
|
|
20444
|
+
element.trigger.removeEventListener("focus", this.handleEvent);
|
|
20445
|
+
element.trigger.removeEventListener("blur", this.handleEvent);
|
|
20335
20446
|
}
|
|
20336
20447
|
}
|
|
20337
20448
|
};
|
|
@@ -21459,7 +21570,7 @@ let AuroHelpText$2$1 = class AuroHelpText extends i$4 {
|
|
|
21459
21570
|
}
|
|
21460
21571
|
};
|
|
21461
21572
|
|
|
21462
|
-
var formkitVersion$1$3 = '
|
|
21573
|
+
var formkitVersion$1$3 = '202604081417';
|
|
21463
21574
|
|
|
21464
21575
|
let AuroElement$2$2 = class AuroElement extends i$4 {
|
|
21465
21576
|
static get properties() {
|
|
@@ -29216,7 +29327,7 @@ let AuroHelpText$1$3 = class AuroHelpText extends i$4 {
|
|
|
29216
29327
|
}
|
|
29217
29328
|
};
|
|
29218
29329
|
|
|
29219
|
-
var formkitVersion$7 = '
|
|
29330
|
+
var formkitVersion$7 = '202604081417';
|
|
29220
29331
|
|
|
29221
29332
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
29222
29333
|
// See LICENSE in the project root for license information.
|
|
@@ -33791,7 +33902,7 @@ let AuroHelpText$1$2 = class AuroHelpText extends i$4 {
|
|
|
33791
33902
|
}
|
|
33792
33903
|
};
|
|
33793
33904
|
|
|
33794
|
-
var formkitVersion$1$2 = '
|
|
33905
|
+
var formkitVersion$1$2 = '202604081417';
|
|
33795
33906
|
|
|
33796
33907
|
// Copyright (c) 2026 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
33797
33908
|
// See LICENSE in the project root for license information.
|
|
@@ -36089,11 +36200,19 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36089
36200
|
* This ensures that the bib content has the same dimensions as the sizer element.
|
|
36090
36201
|
*/
|
|
36091
36202
|
mirrorSize() {
|
|
36203
|
+
const element = this.element;
|
|
36204
|
+
if (!element) {
|
|
36205
|
+
return;
|
|
36206
|
+
}
|
|
36207
|
+
|
|
36092
36208
|
// mirror the boxsize from bibSizer
|
|
36093
|
-
if (
|
|
36094
|
-
const sizerStyle = window.getComputedStyle(
|
|
36095
|
-
const bibContent =
|
|
36096
|
-
|
|
36209
|
+
if (element.bibSizer && element.matchWidth && element.bib?.shadowRoot) {
|
|
36210
|
+
const sizerStyle = window.getComputedStyle(element.bibSizer);
|
|
36211
|
+
const bibContent = element.bib.shadowRoot.querySelector(".container");
|
|
36212
|
+
if (!bibContent) {
|
|
36213
|
+
return;
|
|
36214
|
+
}
|
|
36215
|
+
|
|
36097
36216
|
if (sizerStyle.width !== "0px") {
|
|
36098
36217
|
bibContent.style.width = sizerStyle.width;
|
|
36099
36218
|
}
|
|
@@ -36115,9 +36234,14 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36115
36234
|
* @returns {String} The positioning strategy, one of 'fullscreen', 'floating', 'cover'.
|
|
36116
36235
|
*/
|
|
36117
36236
|
getPositioningStrategy() {
|
|
36237
|
+
const element = this.element;
|
|
36238
|
+
if (!element) {
|
|
36239
|
+
return "floating";
|
|
36240
|
+
}
|
|
36241
|
+
|
|
36118
36242
|
const breakpoint =
|
|
36119
|
-
|
|
36120
|
-
|
|
36243
|
+
element.bib?.mobileFullscreenBreakpoint ||
|
|
36244
|
+
element.floaterConfig?.fullscreenBreakpoint;
|
|
36121
36245
|
switch (this.behavior) {
|
|
36122
36246
|
case "tooltip":
|
|
36123
36247
|
return "floating";
|
|
@@ -36128,9 +36252,9 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36128
36252
|
`(max-width: ${breakpoint})`,
|
|
36129
36253
|
).matches;
|
|
36130
36254
|
|
|
36131
|
-
|
|
36255
|
+
element.expanded = smallerThanBreakpoint;
|
|
36132
36256
|
}
|
|
36133
|
-
if (
|
|
36257
|
+
if (element.nested) {
|
|
36134
36258
|
return "cover";
|
|
36135
36259
|
}
|
|
36136
36260
|
return "fullscreen";
|
|
@@ -36160,42 +36284,65 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36160
36284
|
* and applies the calculated position to the bib's style.
|
|
36161
36285
|
*/
|
|
36162
36286
|
position() {
|
|
36287
|
+
const element = this.element;
|
|
36288
|
+
if (!element) {
|
|
36289
|
+
return;
|
|
36290
|
+
}
|
|
36291
|
+
|
|
36163
36292
|
const strategy = this.getPositioningStrategy();
|
|
36164
36293
|
this.configureBibStrategy(strategy);
|
|
36165
36294
|
|
|
36166
36295
|
if (strategy === "floating") {
|
|
36296
|
+
if (!element.trigger || !element.bib) {
|
|
36297
|
+
return;
|
|
36298
|
+
}
|
|
36299
|
+
|
|
36167
36300
|
this.mirrorSize();
|
|
36168
36301
|
// Define the middlware for the floater configuration
|
|
36169
36302
|
const middleware = [
|
|
36170
|
-
offset$3(
|
|
36171
|
-
...(
|
|
36172
|
-
...(
|
|
36173
|
-
...(
|
|
36303
|
+
offset$3(element.floaterConfig?.offset || 0),
|
|
36304
|
+
...(element.floaterConfig?.shift ? [shift$3()] : []), // Add shift middleware if shift is enabled.
|
|
36305
|
+
...(element.floaterConfig?.flip ? [flip$3()] : []), // Add flip middleware if flip is enabled.
|
|
36306
|
+
...(element.floaterConfig?.autoPlacement ? [autoPlacement$3()] : []), // Add autoPlacement middleware if autoPlacement is enabled.
|
|
36174
36307
|
];
|
|
36175
36308
|
|
|
36176
36309
|
// Compute the position of the bib
|
|
36177
|
-
computePosition$3(
|
|
36178
|
-
strategy:
|
|
36179
|
-
placement:
|
|
36310
|
+
computePosition$3(element.trigger, element.bib, {
|
|
36311
|
+
strategy: element.floaterConfig?.strategy || "fixed",
|
|
36312
|
+
placement: element.floaterConfig?.placement,
|
|
36180
36313
|
middleware: middleware || [],
|
|
36181
36314
|
}).then(({ x, y }) => {
|
|
36182
36315
|
// eslint-disable-line id-length
|
|
36183
|
-
|
|
36316
|
+
const currentElement = this.element;
|
|
36317
|
+
if (!currentElement?.bib) {
|
|
36318
|
+
return;
|
|
36319
|
+
}
|
|
36320
|
+
|
|
36321
|
+
Object.assign(currentElement.bib.style, {
|
|
36184
36322
|
left: `${x}px`,
|
|
36185
36323
|
top: `${y}px`,
|
|
36186
36324
|
});
|
|
36187
36325
|
});
|
|
36188
36326
|
} else if (strategy === "cover") {
|
|
36327
|
+
if (!element.parentNode || !element.bib) {
|
|
36328
|
+
return;
|
|
36329
|
+
}
|
|
36330
|
+
|
|
36189
36331
|
// Compute the position of the bib
|
|
36190
|
-
computePosition$3(
|
|
36332
|
+
computePosition$3(element.parentNode, element.bib, {
|
|
36191
36333
|
placement: "bottom-start",
|
|
36192
36334
|
}).then(({ x, y }) => {
|
|
36193
36335
|
// eslint-disable-line id-length
|
|
36194
|
-
|
|
36336
|
+
const currentElement = this.element;
|
|
36337
|
+
if (!currentElement?.bib || !currentElement.parentNode) {
|
|
36338
|
+
return;
|
|
36339
|
+
}
|
|
36340
|
+
|
|
36341
|
+
Object.assign(currentElement.bib.style, {
|
|
36195
36342
|
left: `${x}px`,
|
|
36196
|
-
top: `${y -
|
|
36197
|
-
width: `${
|
|
36198
|
-
height: `${
|
|
36343
|
+
top: `${y - currentElement.parentNode.offsetHeight}px`,
|
|
36344
|
+
width: `${currentElement.parentNode.offsetWidth}px`,
|
|
36345
|
+
height: `${currentElement.parentNode.offsetHeight}px`,
|
|
36199
36346
|
});
|
|
36200
36347
|
});
|
|
36201
36348
|
}
|
|
@@ -36207,11 +36354,17 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36207
36354
|
* @param {Boolean} lock - If true, locks the body's scrolling functionlity; otherwise, unlock.
|
|
36208
36355
|
*/
|
|
36209
36356
|
lockScroll(lock = true) {
|
|
36357
|
+
const element = this.element;
|
|
36358
|
+
|
|
36210
36359
|
if (lock) {
|
|
36360
|
+
if (!element?.bib) {
|
|
36361
|
+
return;
|
|
36362
|
+
}
|
|
36363
|
+
|
|
36211
36364
|
document.body.style.overflow = "hidden"; // hide body's scrollbar
|
|
36212
36365
|
|
|
36213
36366
|
// Move `bib` by the amount the viewport is shifted to stay aligned in fullscreen.
|
|
36214
|
-
|
|
36367
|
+
element.bib.style.transform = `translateY(${window?.visualViewport?.offsetTop}px)`;
|
|
36215
36368
|
} else {
|
|
36216
36369
|
document.body.style.overflow = "";
|
|
36217
36370
|
}
|
|
@@ -36227,20 +36380,24 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36227
36380
|
* @param {string} strategy - The positioning strategy ('fullscreen' or 'floating').
|
|
36228
36381
|
*/
|
|
36229
36382
|
configureBibStrategy(value) {
|
|
36383
|
+
const element = this.element;
|
|
36384
|
+
if (!element?.bib) {
|
|
36385
|
+
return;
|
|
36386
|
+
}
|
|
36387
|
+
|
|
36230
36388
|
if (value === "fullscreen") {
|
|
36231
|
-
|
|
36389
|
+
element.isBibFullscreen = true;
|
|
36232
36390
|
// reset the prev position
|
|
36233
|
-
|
|
36234
|
-
|
|
36235
|
-
|
|
36236
|
-
|
|
36237
|
-
|
|
36238
|
-
|
|
36239
|
-
|
|
36391
|
+
element.bib.setAttribute("isfullscreen", "");
|
|
36392
|
+
element.bib.style.position = "fixed";
|
|
36393
|
+
element.bib.style.top = "0px";
|
|
36394
|
+
element.bib.style.left = "0px";
|
|
36395
|
+
element.bib.style.width = "";
|
|
36396
|
+
element.bib.style.height = "";
|
|
36397
|
+
element.style.contain = "";
|
|
36240
36398
|
|
|
36241
36399
|
// reset the size that was mirroring `size` css-part
|
|
36242
|
-
const bibContent =
|
|
36243
|
-
this.element.bib.shadowRoot.querySelector(".container");
|
|
36400
|
+
const bibContent = element.bib.shadowRoot?.querySelector(".container");
|
|
36244
36401
|
if (bibContent) {
|
|
36245
36402
|
bibContent.style.width = "";
|
|
36246
36403
|
bibContent.style.height = "";
|
|
@@ -36255,14 +36412,14 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36255
36412
|
}, 0);
|
|
36256
36413
|
}
|
|
36257
36414
|
|
|
36258
|
-
if (
|
|
36415
|
+
if (element.isPopoverVisible) {
|
|
36259
36416
|
this.lockScroll(true);
|
|
36260
36417
|
}
|
|
36261
36418
|
} else {
|
|
36262
|
-
|
|
36263
|
-
|
|
36264
|
-
|
|
36265
|
-
|
|
36419
|
+
element.bib.style.position = "";
|
|
36420
|
+
element.bib.removeAttribute("isfullscreen");
|
|
36421
|
+
element.isBibFullscreen = false;
|
|
36422
|
+
element.style.contain = "layout";
|
|
36266
36423
|
}
|
|
36267
36424
|
|
|
36268
36425
|
const isChanged = this.strategy && this.strategy !== value;
|
|
@@ -36280,16 +36437,21 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36280
36437
|
},
|
|
36281
36438
|
);
|
|
36282
36439
|
|
|
36283
|
-
|
|
36440
|
+
element.dispatchEvent(event);
|
|
36284
36441
|
}
|
|
36285
36442
|
}
|
|
36286
36443
|
|
|
36287
36444
|
updateState() {
|
|
36288
|
-
const
|
|
36445
|
+
const element = this.element;
|
|
36446
|
+
if (!element) {
|
|
36447
|
+
return;
|
|
36448
|
+
}
|
|
36449
|
+
|
|
36450
|
+
const isVisible = element.isPopoverVisible;
|
|
36289
36451
|
if (!isVisible) {
|
|
36290
36452
|
this.cleanupHideHandlers();
|
|
36291
36453
|
try {
|
|
36292
|
-
|
|
36454
|
+
element.cleanup?.();
|
|
36293
36455
|
} catch (error) {
|
|
36294
36456
|
// Do nothing
|
|
36295
36457
|
}
|
|
@@ -36305,28 +36467,30 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36305
36467
|
* If not, and if the bib isn't in fullscreen mode with focus lost, it hides the bib.
|
|
36306
36468
|
*/
|
|
36307
36469
|
handleFocusLoss() {
|
|
36470
|
+
const element = this.element;
|
|
36471
|
+
if (!element?.bib) {
|
|
36472
|
+
return;
|
|
36473
|
+
}
|
|
36474
|
+
|
|
36308
36475
|
// if mouse is being pressed, skip and let click event to handle the action
|
|
36309
36476
|
if (AuroFloatingUI.isMousePressed) {
|
|
36310
36477
|
return;
|
|
36311
36478
|
}
|
|
36312
36479
|
|
|
36313
36480
|
if (
|
|
36314
|
-
|
|
36315
|
-
|
|
36481
|
+
element.noHideOnThisFocusLoss ||
|
|
36482
|
+
element.hasAttribute("noHideOnThisFocusLoss")
|
|
36316
36483
|
) {
|
|
36317
36484
|
return;
|
|
36318
36485
|
}
|
|
36319
36486
|
|
|
36320
36487
|
// if focus is still inside of trigger or bib, do not close
|
|
36321
|
-
if (
|
|
36322
|
-
this.element.matches(":focus") ||
|
|
36323
|
-
this.element.matches(":focus-within")
|
|
36324
|
-
) {
|
|
36488
|
+
if (element.matches(":focus") || element.matches(":focus-within")) {
|
|
36325
36489
|
return;
|
|
36326
36490
|
}
|
|
36327
36491
|
|
|
36328
36492
|
// if fullscreen bib is in fullscreen mode, do not close
|
|
36329
|
-
if (
|
|
36493
|
+
if (element.bib.hasAttribute("isfullscreen")) {
|
|
36330
36494
|
return;
|
|
36331
36495
|
}
|
|
36332
36496
|
|
|
@@ -36334,23 +36498,33 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36334
36498
|
}
|
|
36335
36499
|
|
|
36336
36500
|
setupHideHandlers() {
|
|
36501
|
+
const element = this.element;
|
|
36502
|
+
if (!element) {
|
|
36503
|
+
return;
|
|
36504
|
+
}
|
|
36505
|
+
|
|
36337
36506
|
// Define handlers & store references
|
|
36338
36507
|
this.focusHandler = () => this.handleFocusLoss();
|
|
36339
36508
|
|
|
36340
36509
|
this.clickHandler = (evt) => {
|
|
36510
|
+
const element = this.element;
|
|
36511
|
+
if (!element?.bib) {
|
|
36512
|
+
return;
|
|
36513
|
+
}
|
|
36514
|
+
|
|
36341
36515
|
// When the bib is fullscreen (modal dialog), don't close on outside
|
|
36342
36516
|
// clicks. VoiceOver's synthetic click events inside a top-layer modal
|
|
36343
36517
|
// <dialog> may not include the bib in composedPath(), causing false
|
|
36344
36518
|
// positives. This mirrors the fullscreen guard in handleFocusLoss().
|
|
36345
|
-
if (
|
|
36519
|
+
if (element.bib.hasAttribute("isfullscreen")) {
|
|
36346
36520
|
return;
|
|
36347
36521
|
}
|
|
36348
36522
|
|
|
36349
36523
|
if (
|
|
36350
|
-
(!evt.composedPath().includes(
|
|
36351
|
-
!evt.composedPath().includes(
|
|
36352
|
-
(
|
|
36353
|
-
evt.composedPath().includes(
|
|
36524
|
+
(!evt.composedPath().includes(element.trigger) &&
|
|
36525
|
+
!evt.composedPath().includes(element.bib)) ||
|
|
36526
|
+
(element.bib.backdrop &&
|
|
36527
|
+
evt.composedPath().includes(element.bib.backdrop))
|
|
36354
36528
|
) {
|
|
36355
36529
|
const existedVisibleFloatingUI =
|
|
36356
36530
|
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
@@ -36371,7 +36545,12 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36371
36545
|
|
|
36372
36546
|
// ESC key handler
|
|
36373
36547
|
this.keyDownHandler = (evt) => {
|
|
36374
|
-
|
|
36548
|
+
const element = this.element;
|
|
36549
|
+
if (!element) {
|
|
36550
|
+
return;
|
|
36551
|
+
}
|
|
36552
|
+
|
|
36553
|
+
if (evt.key === "Escape" && element.isPopoverVisible) {
|
|
36375
36554
|
const existedVisibleFloatingUI =
|
|
36376
36555
|
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
36377
36556
|
if (
|
|
@@ -36428,6 +36607,10 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36428
36607
|
}
|
|
36429
36608
|
|
|
36430
36609
|
updateCurrentExpandedDropdown() {
|
|
36610
|
+
if (!this.element) {
|
|
36611
|
+
return;
|
|
36612
|
+
}
|
|
36613
|
+
|
|
36431
36614
|
// Close any other dropdown that is already open
|
|
36432
36615
|
const existedVisibleFloatingUI =
|
|
36433
36616
|
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
@@ -36444,25 +36627,34 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36444
36627
|
}
|
|
36445
36628
|
|
|
36446
36629
|
showBib() {
|
|
36447
|
-
|
|
36630
|
+
const element = this.element;
|
|
36631
|
+
if (!element) {
|
|
36632
|
+
return;
|
|
36633
|
+
}
|
|
36634
|
+
|
|
36635
|
+
if (!element.bib || (!element.trigger && !element.parentNode)) {
|
|
36636
|
+
return;
|
|
36637
|
+
}
|
|
36638
|
+
|
|
36639
|
+
if (!element.disabled && !this.showing) {
|
|
36448
36640
|
this.updateCurrentExpandedDropdown();
|
|
36449
|
-
|
|
36641
|
+
element.triggerChevron?.setAttribute("data-expanded", true);
|
|
36450
36642
|
|
|
36451
36643
|
// prevent double showing: isPopovervisible gets first and showBib gets called later
|
|
36452
36644
|
if (!this.showing) {
|
|
36453
|
-
if (!
|
|
36645
|
+
if (!element.modal) {
|
|
36454
36646
|
this.setupHideHandlers();
|
|
36455
36647
|
}
|
|
36456
36648
|
this.showing = true;
|
|
36457
|
-
|
|
36649
|
+
element.isPopoverVisible = true;
|
|
36458
36650
|
this.position();
|
|
36459
36651
|
this.dispatchEventDropdownToggle();
|
|
36460
36652
|
}
|
|
36461
36653
|
|
|
36462
36654
|
// Setup auto update to handle resize and scroll
|
|
36463
|
-
|
|
36464
|
-
|
|
36465
|
-
|
|
36655
|
+
element.cleanup = autoUpdate$2(
|
|
36656
|
+
element.trigger || element.parentNode,
|
|
36657
|
+
element.bib,
|
|
36466
36658
|
() => {
|
|
36467
36659
|
this.position();
|
|
36468
36660
|
},
|
|
@@ -36475,22 +36667,27 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36475
36667
|
* @param {String} eventType - The event type that triggered the hiding action.
|
|
36476
36668
|
*/
|
|
36477
36669
|
hideBib(eventType = "unknown") {
|
|
36478
|
-
|
|
36670
|
+
const element = this.element;
|
|
36671
|
+
if (!element) {
|
|
36672
|
+
return;
|
|
36673
|
+
}
|
|
36674
|
+
|
|
36675
|
+
if (element.disabled) {
|
|
36479
36676
|
return;
|
|
36480
36677
|
}
|
|
36481
36678
|
|
|
36482
36679
|
// noToggle dropdowns should not close when the trigger is clicked (the
|
|
36483
36680
|
// "toggle" behavior), but they CAN still close via other interactions like
|
|
36484
36681
|
// Escape key or focus loss.
|
|
36485
|
-
if (
|
|
36682
|
+
if (element.noToggle && eventType === "click") {
|
|
36486
36683
|
return;
|
|
36487
36684
|
}
|
|
36488
36685
|
|
|
36489
36686
|
this.lockScroll(false);
|
|
36490
|
-
|
|
36687
|
+
element.triggerChevron?.removeAttribute("data-expanded");
|
|
36491
36688
|
|
|
36492
|
-
if (
|
|
36493
|
-
|
|
36689
|
+
if (element.isPopoverVisible) {
|
|
36690
|
+
element.isPopoverVisible = false;
|
|
36494
36691
|
}
|
|
36495
36692
|
if (this.showing) {
|
|
36496
36693
|
this.cleanupHideHandlers();
|
|
@@ -36510,6 +36707,11 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36510
36707
|
* @param {String} eventType - The event type that triggered the toggle action.
|
|
36511
36708
|
*/
|
|
36512
36709
|
dispatchEventDropdownToggle(eventType) {
|
|
36710
|
+
const element = this.element;
|
|
36711
|
+
if (!element) {
|
|
36712
|
+
return;
|
|
36713
|
+
}
|
|
36714
|
+
|
|
36513
36715
|
const event = new CustomEvent(
|
|
36514
36716
|
this.eventPrefix ? `${this.eventPrefix}-toggled` : "toggled",
|
|
36515
36717
|
{
|
|
@@ -36521,11 +36723,16 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36521
36723
|
},
|
|
36522
36724
|
);
|
|
36523
36725
|
|
|
36524
|
-
|
|
36726
|
+
element.dispatchEvent(event);
|
|
36525
36727
|
}
|
|
36526
36728
|
|
|
36527
36729
|
handleClick() {
|
|
36528
|
-
|
|
36730
|
+
const element = this.element;
|
|
36731
|
+
if (!element) {
|
|
36732
|
+
return;
|
|
36733
|
+
}
|
|
36734
|
+
|
|
36735
|
+
if (element.isPopoverVisible) {
|
|
36529
36736
|
this.hideBib("click");
|
|
36530
36737
|
} else {
|
|
36531
36738
|
this.showBib();
|
|
@@ -36536,63 +36743,66 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36536
36743
|
{
|
|
36537
36744
|
composed: true,
|
|
36538
36745
|
detail: {
|
|
36539
|
-
expanded:
|
|
36746
|
+
expanded: element.isPopoverVisible,
|
|
36540
36747
|
},
|
|
36541
36748
|
},
|
|
36542
36749
|
);
|
|
36543
36750
|
|
|
36544
|
-
|
|
36751
|
+
element.dispatchEvent(event);
|
|
36545
36752
|
}
|
|
36546
36753
|
|
|
36547
36754
|
handleEvent(event) {
|
|
36548
|
-
|
|
36549
|
-
|
|
36550
|
-
|
|
36551
|
-
|
|
36552
|
-
|
|
36553
|
-
|
|
36554
|
-
|
|
36555
|
-
|
|
36556
|
-
|
|
36557
|
-
|
|
36558
|
-
|
|
36559
|
-
|
|
36560
|
-
|
|
36561
|
-
|
|
36562
|
-
|
|
36563
|
-
|
|
36564
|
-
case "mouseenter":
|
|
36565
|
-
if (this.element.hoverToggle) {
|
|
36566
|
-
this.showBib();
|
|
36567
|
-
}
|
|
36568
|
-
break;
|
|
36569
|
-
case "mouseleave":
|
|
36570
|
-
if (this.element.hoverToggle) {
|
|
36571
|
-
this.hideBib("mouseleave");
|
|
36572
|
-
}
|
|
36573
|
-
break;
|
|
36574
|
-
case "focus":
|
|
36575
|
-
if (this.element.focusShow) {
|
|
36576
|
-
/*
|
|
36577
|
-
This needs to better handle clicking that gives focus -
|
|
36578
|
-
currently it shows and then immediately hides the bib
|
|
36579
|
-
*/
|
|
36580
|
-
this.showBib();
|
|
36581
|
-
}
|
|
36582
|
-
break;
|
|
36583
|
-
case "blur":
|
|
36584
|
-
// send this task 100ms later queue to
|
|
36585
|
-
// wait a frame in case focus moves within the floating element/bib
|
|
36586
|
-
setTimeout(() => this.handleFocusLoss(), 0);
|
|
36587
|
-
break;
|
|
36588
|
-
case "click":
|
|
36589
|
-
if (document.activeElement === document.body) {
|
|
36590
|
-
event.currentTarget.focus();
|
|
36591
|
-
}
|
|
36755
|
+
const element = this.element;
|
|
36756
|
+
if (!element || element.disableEventShow) {
|
|
36757
|
+
return;
|
|
36758
|
+
}
|
|
36759
|
+
|
|
36760
|
+
switch (event.type) {
|
|
36761
|
+
case "keydown": {
|
|
36762
|
+
// Support both Enter and Space keys for accessibility
|
|
36763
|
+
// Space is included as it's expected behavior for interactive elements
|
|
36764
|
+
|
|
36765
|
+
const origin = event.composedPath()[0];
|
|
36766
|
+
if (
|
|
36767
|
+
event.key === "Enter" ||
|
|
36768
|
+
(event.key === " " && (!origin || origin.tagName !== "INPUT"))
|
|
36769
|
+
) {
|
|
36770
|
+
event.preventDefault();
|
|
36592
36771
|
this.handleClick();
|
|
36593
|
-
|
|
36594
|
-
|
|
36772
|
+
}
|
|
36773
|
+
break;
|
|
36595
36774
|
}
|
|
36775
|
+
case "mouseenter":
|
|
36776
|
+
if (element.hoverToggle) {
|
|
36777
|
+
this.showBib();
|
|
36778
|
+
}
|
|
36779
|
+
break;
|
|
36780
|
+
case "mouseleave":
|
|
36781
|
+
if (element.hoverToggle) {
|
|
36782
|
+
this.hideBib("mouseleave");
|
|
36783
|
+
}
|
|
36784
|
+
break;
|
|
36785
|
+
case "focus":
|
|
36786
|
+
if (element.focusShow) {
|
|
36787
|
+
/*
|
|
36788
|
+
This needs to better handle clicking that gives focus -
|
|
36789
|
+
currently it shows and then immediately hides the bib
|
|
36790
|
+
*/
|
|
36791
|
+
this.showBib();
|
|
36792
|
+
}
|
|
36793
|
+
break;
|
|
36794
|
+
case "blur":
|
|
36795
|
+
// send this task 100ms later queue to
|
|
36796
|
+
// wait a frame in case focus moves within the floating element/bib
|
|
36797
|
+
setTimeout(() => this.handleFocusLoss(), 0);
|
|
36798
|
+
break;
|
|
36799
|
+
case "click":
|
|
36800
|
+
if (document.activeElement === document.body) {
|
|
36801
|
+
event.currentTarget.focus();
|
|
36802
|
+
}
|
|
36803
|
+
this.handleClick();
|
|
36804
|
+
break;
|
|
36805
|
+
// Do nothing
|
|
36596
36806
|
}
|
|
36597
36807
|
}
|
|
36598
36808
|
|
|
@@ -36603,6 +36813,11 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36603
36813
|
* This prevents the component itself from being focusable when the trigger element already handles focus.
|
|
36604
36814
|
*/
|
|
36605
36815
|
handleTriggerTabIndex() {
|
|
36816
|
+
const element = this.element;
|
|
36817
|
+
if (!element) {
|
|
36818
|
+
return;
|
|
36819
|
+
}
|
|
36820
|
+
|
|
36606
36821
|
const focusableElementSelectors = [
|
|
36607
36822
|
"a",
|
|
36608
36823
|
"button",
|
|
@@ -36615,7 +36830,7 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36615
36830
|
"auro-hyperlink",
|
|
36616
36831
|
];
|
|
36617
36832
|
|
|
36618
|
-
const triggerNode =
|
|
36833
|
+
const triggerNode = element.querySelectorAll('[slot="trigger"]')[0];
|
|
36619
36834
|
if (!triggerNode) {
|
|
36620
36835
|
return;
|
|
36621
36836
|
}
|
|
@@ -36624,13 +36839,13 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36624
36839
|
focusableElementSelectors.forEach((selector) => {
|
|
36625
36840
|
// Check if the trigger node element is focusable
|
|
36626
36841
|
if (triggerNodeTagName === selector) {
|
|
36627
|
-
|
|
36842
|
+
element.tabIndex = -1;
|
|
36628
36843
|
return;
|
|
36629
36844
|
}
|
|
36630
36845
|
|
|
36631
36846
|
// Check if any child is focusable
|
|
36632
36847
|
if (triggerNode.querySelector(selector)) {
|
|
36633
|
-
|
|
36848
|
+
element.tabIndex = -1;
|
|
36634
36849
|
}
|
|
36635
36850
|
});
|
|
36636
36851
|
}
|
|
@@ -36640,13 +36855,18 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36640
36855
|
* @param {*} eventPrefix
|
|
36641
36856
|
*/
|
|
36642
36857
|
regenerateBibId() {
|
|
36643
|
-
|
|
36858
|
+
const element = this.element;
|
|
36859
|
+
if (!element) {
|
|
36860
|
+
return;
|
|
36861
|
+
}
|
|
36862
|
+
|
|
36863
|
+
this.id = element.getAttribute("id");
|
|
36644
36864
|
if (!this.id) {
|
|
36645
36865
|
this.id = window.crypto.randomUUID();
|
|
36646
|
-
|
|
36866
|
+
element.setAttribute("id", this.id);
|
|
36647
36867
|
}
|
|
36648
36868
|
|
|
36649
|
-
|
|
36869
|
+
element.bib?.setAttribute("id", `${this.id}-floater-bib`);
|
|
36650
36870
|
}
|
|
36651
36871
|
|
|
36652
36872
|
configure(elem, eventPrefix, enableKeyboardHandling = true) {
|
|
@@ -36658,67 +36878,69 @@ let AuroFloatingUI$2 = class AuroFloatingUI {
|
|
|
36658
36878
|
this.element = elem;
|
|
36659
36879
|
}
|
|
36660
36880
|
|
|
36661
|
-
|
|
36662
|
-
|
|
36881
|
+
const element = this.element;
|
|
36882
|
+
if (!element) {
|
|
36883
|
+
return;
|
|
36663
36884
|
}
|
|
36664
36885
|
|
|
36665
|
-
if (this.element.
|
|
36886
|
+
if (this.behavior !== element.behavior) {
|
|
36887
|
+
this.behavior = element.behavior;
|
|
36888
|
+
}
|
|
36889
|
+
|
|
36890
|
+
if (element.trigger) {
|
|
36666
36891
|
this.disconnect();
|
|
36667
36892
|
}
|
|
36668
|
-
|
|
36669
|
-
|
|
36670
|
-
|
|
36671
|
-
|
|
36672
|
-
|
|
36673
|
-
|
|
36674
|
-
|
|
36675
|
-
|
|
36676
|
-
this.element.shadowRoot.querySelector("#showStateIcon");
|
|
36893
|
+
element.trigger =
|
|
36894
|
+
element.triggerElement ||
|
|
36895
|
+
element.shadowRoot?.querySelector("#trigger") ||
|
|
36896
|
+
element.trigger;
|
|
36897
|
+
element.bib = element.shadowRoot?.querySelector("#bib") || element.bib;
|
|
36898
|
+
element.bibSizer = element.shadowRoot?.querySelector("#bibSizer");
|
|
36899
|
+
element.triggerChevron =
|
|
36900
|
+
element.shadowRoot?.querySelector("#showStateIcon");
|
|
36677
36901
|
|
|
36678
|
-
if (
|
|
36679
|
-
|
|
36902
|
+
if (element.floaterConfig) {
|
|
36903
|
+
element.hoverToggle = element.floaterConfig.hoverToggle;
|
|
36680
36904
|
}
|
|
36681
36905
|
|
|
36682
36906
|
this.regenerateBibId();
|
|
36683
36907
|
this.handleTriggerTabIndex();
|
|
36684
36908
|
|
|
36685
36909
|
this.handleEvent = this.handleEvent.bind(this);
|
|
36686
|
-
if (
|
|
36910
|
+
if (element.trigger) {
|
|
36687
36911
|
if (this.enableKeyboardHandling) {
|
|
36688
|
-
|
|
36912
|
+
element.trigger.addEventListener("keydown", this.handleEvent);
|
|
36689
36913
|
}
|
|
36690
|
-
|
|
36691
|
-
|
|
36692
|
-
|
|
36693
|
-
|
|
36694
|
-
|
|
36914
|
+
element.trigger.addEventListener("click", this.handleEvent);
|
|
36915
|
+
element.trigger.addEventListener("mouseenter", this.handleEvent);
|
|
36916
|
+
element.trigger.addEventListener("mouseleave", this.handleEvent);
|
|
36917
|
+
element.trigger.addEventListener("focus", this.handleEvent);
|
|
36918
|
+
element.trigger.addEventListener("blur", this.handleEvent);
|
|
36695
36919
|
}
|
|
36696
36920
|
}
|
|
36697
36921
|
|
|
36698
36922
|
disconnect() {
|
|
36699
36923
|
this.cleanupHideHandlers();
|
|
36700
|
-
if (this.element) {
|
|
36701
|
-
this.element.cleanup?.();
|
|
36702
36924
|
|
|
36703
|
-
|
|
36704
|
-
|
|
36705
|
-
|
|
36925
|
+
const element = this.element;
|
|
36926
|
+
if (!element) {
|
|
36927
|
+
return;
|
|
36928
|
+
}
|
|
36706
36929
|
|
|
36707
|
-
|
|
36708
|
-
|
|
36709
|
-
|
|
36710
|
-
|
|
36711
|
-
|
|
36712
|
-
|
|
36713
|
-
|
|
36714
|
-
|
|
36715
|
-
|
|
36716
|
-
|
|
36717
|
-
|
|
36718
|
-
|
|
36719
|
-
|
|
36720
|
-
|
|
36721
|
-
}
|
|
36930
|
+
element.cleanup?.();
|
|
36931
|
+
|
|
36932
|
+
if (element.bib && element.shadowRoot) {
|
|
36933
|
+
element.shadowRoot.append(element.bib);
|
|
36934
|
+
}
|
|
36935
|
+
|
|
36936
|
+
// Remove event & keyboard listeners
|
|
36937
|
+
if (element.trigger) {
|
|
36938
|
+
element.trigger.removeEventListener("keydown", this.handleEvent);
|
|
36939
|
+
element.trigger.removeEventListener("click", this.handleEvent);
|
|
36940
|
+
element.trigger.removeEventListener("mouseenter", this.handleEvent);
|
|
36941
|
+
element.trigger.removeEventListener("mouseleave", this.handleEvent);
|
|
36942
|
+
element.trigger.removeEventListener("focus", this.handleEvent);
|
|
36943
|
+
element.trigger.removeEventListener("blur", this.handleEvent);
|
|
36722
36944
|
}
|
|
36723
36945
|
}
|
|
36724
36946
|
};
|
|
@@ -37846,7 +38068,7 @@ let AuroHelpText$6 = class AuroHelpText extends i$4 {
|
|
|
37846
38068
|
}
|
|
37847
38069
|
};
|
|
37848
38070
|
|
|
37849
|
-
var formkitVersion$6 = '
|
|
38071
|
+
var formkitVersion$6 = '202604081417';
|
|
37850
38072
|
|
|
37851
38073
|
let AuroElement$1$2 = class AuroElement extends i$4 {
|
|
37852
38074
|
static get properties() {
|
|
@@ -41916,7 +42138,7 @@ let AuroHelpText$5 = class AuroHelpText extends i$4 {
|
|
|
41916
42138
|
}
|
|
41917
42139
|
};
|
|
41918
42140
|
|
|
41919
|
-
var formkitVersion$5 = '
|
|
42141
|
+
var formkitVersion$5 = '202604081417';
|
|
41920
42142
|
|
|
41921
42143
|
// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
|
|
41922
42144
|
// See LICENSE in the project root for license information.
|
|
@@ -44085,7 +44307,7 @@ let AuroHelpText$4 = class AuroHelpText extends i$4 {
|
|
|
44085
44307
|
}
|
|
44086
44308
|
};
|
|
44087
44309
|
|
|
44088
|
-
var formkitVersion$4 = '
|
|
44310
|
+
var formkitVersion$4 = '202604081417';
|
|
44089
44311
|
|
|
44090
44312
|
// Copyright (c) 2026 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
44091
44313
|
// See LICENSE in the project root for license information.
|
|
@@ -47668,11 +47890,19 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
47668
47890
|
* This ensures that the bib content has the same dimensions as the sizer element.
|
|
47669
47891
|
*/
|
|
47670
47892
|
mirrorSize() {
|
|
47893
|
+
const element = this.element;
|
|
47894
|
+
if (!element) {
|
|
47895
|
+
return;
|
|
47896
|
+
}
|
|
47897
|
+
|
|
47671
47898
|
// mirror the boxsize from bibSizer
|
|
47672
|
-
if (
|
|
47673
|
-
const sizerStyle = window.getComputedStyle(
|
|
47674
|
-
const bibContent =
|
|
47675
|
-
|
|
47899
|
+
if (element.bibSizer && element.matchWidth && element.bib?.shadowRoot) {
|
|
47900
|
+
const sizerStyle = window.getComputedStyle(element.bibSizer);
|
|
47901
|
+
const bibContent = element.bib.shadowRoot.querySelector(".container");
|
|
47902
|
+
if (!bibContent) {
|
|
47903
|
+
return;
|
|
47904
|
+
}
|
|
47905
|
+
|
|
47676
47906
|
if (sizerStyle.width !== "0px") {
|
|
47677
47907
|
bibContent.style.width = sizerStyle.width;
|
|
47678
47908
|
}
|
|
@@ -47694,9 +47924,14 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
47694
47924
|
* @returns {String} The positioning strategy, one of 'fullscreen', 'floating', 'cover'.
|
|
47695
47925
|
*/
|
|
47696
47926
|
getPositioningStrategy() {
|
|
47927
|
+
const element = this.element;
|
|
47928
|
+
if (!element) {
|
|
47929
|
+
return "floating";
|
|
47930
|
+
}
|
|
47931
|
+
|
|
47697
47932
|
const breakpoint =
|
|
47698
|
-
|
|
47699
|
-
|
|
47933
|
+
element.bib?.mobileFullscreenBreakpoint ||
|
|
47934
|
+
element.floaterConfig?.fullscreenBreakpoint;
|
|
47700
47935
|
switch (this.behavior) {
|
|
47701
47936
|
case "tooltip":
|
|
47702
47937
|
return "floating";
|
|
@@ -47707,9 +47942,9 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
47707
47942
|
`(max-width: ${breakpoint})`,
|
|
47708
47943
|
).matches;
|
|
47709
47944
|
|
|
47710
|
-
|
|
47945
|
+
element.expanded = smallerThanBreakpoint;
|
|
47711
47946
|
}
|
|
47712
|
-
if (
|
|
47947
|
+
if (element.nested) {
|
|
47713
47948
|
return "cover";
|
|
47714
47949
|
}
|
|
47715
47950
|
return "fullscreen";
|
|
@@ -47739,42 +47974,65 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
47739
47974
|
* and applies the calculated position to the bib's style.
|
|
47740
47975
|
*/
|
|
47741
47976
|
position() {
|
|
47977
|
+
const element = this.element;
|
|
47978
|
+
if (!element) {
|
|
47979
|
+
return;
|
|
47980
|
+
}
|
|
47981
|
+
|
|
47742
47982
|
const strategy = this.getPositioningStrategy();
|
|
47743
47983
|
this.configureBibStrategy(strategy);
|
|
47744
47984
|
|
|
47745
47985
|
if (strategy === "floating") {
|
|
47986
|
+
if (!element.trigger || !element.bib) {
|
|
47987
|
+
return;
|
|
47988
|
+
}
|
|
47989
|
+
|
|
47746
47990
|
this.mirrorSize();
|
|
47747
47991
|
// Define the middlware for the floater configuration
|
|
47748
47992
|
const middleware = [
|
|
47749
|
-
offset$2(
|
|
47750
|
-
...(
|
|
47751
|
-
...(
|
|
47752
|
-
...(
|
|
47993
|
+
offset$2(element.floaterConfig?.offset || 0),
|
|
47994
|
+
...(element.floaterConfig?.shift ? [shift$2()] : []), // Add shift middleware if shift is enabled.
|
|
47995
|
+
...(element.floaterConfig?.flip ? [flip$2()] : []), // Add flip middleware if flip is enabled.
|
|
47996
|
+
...(element.floaterConfig?.autoPlacement ? [autoPlacement$2()] : []), // Add autoPlacement middleware if autoPlacement is enabled.
|
|
47753
47997
|
];
|
|
47754
47998
|
|
|
47755
47999
|
// Compute the position of the bib
|
|
47756
|
-
computePosition$2(
|
|
47757
|
-
strategy:
|
|
47758
|
-
placement:
|
|
48000
|
+
computePosition$2(element.trigger, element.bib, {
|
|
48001
|
+
strategy: element.floaterConfig?.strategy || "fixed",
|
|
48002
|
+
placement: element.floaterConfig?.placement,
|
|
47759
48003
|
middleware: middleware || [],
|
|
47760
48004
|
}).then(({ x, y }) => {
|
|
47761
48005
|
// eslint-disable-line id-length
|
|
47762
|
-
|
|
48006
|
+
const currentElement = this.element;
|
|
48007
|
+
if (!currentElement?.bib) {
|
|
48008
|
+
return;
|
|
48009
|
+
}
|
|
48010
|
+
|
|
48011
|
+
Object.assign(currentElement.bib.style, {
|
|
47763
48012
|
left: `${x}px`,
|
|
47764
48013
|
top: `${y}px`,
|
|
47765
48014
|
});
|
|
47766
48015
|
});
|
|
47767
48016
|
} else if (strategy === "cover") {
|
|
48017
|
+
if (!element.parentNode || !element.bib) {
|
|
48018
|
+
return;
|
|
48019
|
+
}
|
|
48020
|
+
|
|
47768
48021
|
// Compute the position of the bib
|
|
47769
|
-
computePosition$2(
|
|
48022
|
+
computePosition$2(element.parentNode, element.bib, {
|
|
47770
48023
|
placement: "bottom-start",
|
|
47771
48024
|
}).then(({ x, y }) => {
|
|
47772
48025
|
// eslint-disable-line id-length
|
|
47773
|
-
|
|
48026
|
+
const currentElement = this.element;
|
|
48027
|
+
if (!currentElement?.bib || !currentElement.parentNode) {
|
|
48028
|
+
return;
|
|
48029
|
+
}
|
|
48030
|
+
|
|
48031
|
+
Object.assign(currentElement.bib.style, {
|
|
47774
48032
|
left: `${x}px`,
|
|
47775
|
-
top: `${y -
|
|
47776
|
-
width: `${
|
|
47777
|
-
height: `${
|
|
48033
|
+
top: `${y - currentElement.parentNode.offsetHeight}px`,
|
|
48034
|
+
width: `${currentElement.parentNode.offsetWidth}px`,
|
|
48035
|
+
height: `${currentElement.parentNode.offsetHeight}px`,
|
|
47778
48036
|
});
|
|
47779
48037
|
});
|
|
47780
48038
|
}
|
|
@@ -47786,11 +48044,17 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
47786
48044
|
* @param {Boolean} lock - If true, locks the body's scrolling functionlity; otherwise, unlock.
|
|
47787
48045
|
*/
|
|
47788
48046
|
lockScroll(lock = true) {
|
|
48047
|
+
const element = this.element;
|
|
48048
|
+
|
|
47789
48049
|
if (lock) {
|
|
48050
|
+
if (!element?.bib) {
|
|
48051
|
+
return;
|
|
48052
|
+
}
|
|
48053
|
+
|
|
47790
48054
|
document.body.style.overflow = "hidden"; // hide body's scrollbar
|
|
47791
48055
|
|
|
47792
48056
|
// Move `bib` by the amount the viewport is shifted to stay aligned in fullscreen.
|
|
47793
|
-
|
|
48057
|
+
element.bib.style.transform = `translateY(${window?.visualViewport?.offsetTop}px)`;
|
|
47794
48058
|
} else {
|
|
47795
48059
|
document.body.style.overflow = "";
|
|
47796
48060
|
}
|
|
@@ -47806,20 +48070,24 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
47806
48070
|
* @param {string} strategy - The positioning strategy ('fullscreen' or 'floating').
|
|
47807
48071
|
*/
|
|
47808
48072
|
configureBibStrategy(value) {
|
|
48073
|
+
const element = this.element;
|
|
48074
|
+
if (!element?.bib) {
|
|
48075
|
+
return;
|
|
48076
|
+
}
|
|
48077
|
+
|
|
47809
48078
|
if (value === "fullscreen") {
|
|
47810
|
-
|
|
48079
|
+
element.isBibFullscreen = true;
|
|
47811
48080
|
// reset the prev position
|
|
47812
|
-
|
|
47813
|
-
|
|
47814
|
-
|
|
47815
|
-
|
|
47816
|
-
|
|
47817
|
-
|
|
47818
|
-
|
|
48081
|
+
element.bib.setAttribute("isfullscreen", "");
|
|
48082
|
+
element.bib.style.position = "fixed";
|
|
48083
|
+
element.bib.style.top = "0px";
|
|
48084
|
+
element.bib.style.left = "0px";
|
|
48085
|
+
element.bib.style.width = "";
|
|
48086
|
+
element.bib.style.height = "";
|
|
48087
|
+
element.style.contain = "";
|
|
47819
48088
|
|
|
47820
48089
|
// reset the size that was mirroring `size` css-part
|
|
47821
|
-
const bibContent =
|
|
47822
|
-
this.element.bib.shadowRoot.querySelector(".container");
|
|
48090
|
+
const bibContent = element.bib.shadowRoot?.querySelector(".container");
|
|
47823
48091
|
if (bibContent) {
|
|
47824
48092
|
bibContent.style.width = "";
|
|
47825
48093
|
bibContent.style.height = "";
|
|
@@ -47834,14 +48102,14 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
47834
48102
|
}, 0);
|
|
47835
48103
|
}
|
|
47836
48104
|
|
|
47837
|
-
if (
|
|
48105
|
+
if (element.isPopoverVisible) {
|
|
47838
48106
|
this.lockScroll(true);
|
|
47839
48107
|
}
|
|
47840
48108
|
} else {
|
|
47841
|
-
|
|
47842
|
-
|
|
47843
|
-
|
|
47844
|
-
|
|
48109
|
+
element.bib.style.position = "";
|
|
48110
|
+
element.bib.removeAttribute("isfullscreen");
|
|
48111
|
+
element.isBibFullscreen = false;
|
|
48112
|
+
element.style.contain = "layout";
|
|
47845
48113
|
}
|
|
47846
48114
|
|
|
47847
48115
|
const isChanged = this.strategy && this.strategy !== value;
|
|
@@ -47859,16 +48127,21 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
47859
48127
|
},
|
|
47860
48128
|
);
|
|
47861
48129
|
|
|
47862
|
-
|
|
48130
|
+
element.dispatchEvent(event);
|
|
47863
48131
|
}
|
|
47864
48132
|
}
|
|
47865
48133
|
|
|
47866
48134
|
updateState() {
|
|
47867
|
-
const
|
|
48135
|
+
const element = this.element;
|
|
48136
|
+
if (!element) {
|
|
48137
|
+
return;
|
|
48138
|
+
}
|
|
48139
|
+
|
|
48140
|
+
const isVisible = element.isPopoverVisible;
|
|
47868
48141
|
if (!isVisible) {
|
|
47869
48142
|
this.cleanupHideHandlers();
|
|
47870
48143
|
try {
|
|
47871
|
-
|
|
48144
|
+
element.cleanup?.();
|
|
47872
48145
|
} catch (error) {
|
|
47873
48146
|
// Do nothing
|
|
47874
48147
|
}
|
|
@@ -47884,28 +48157,30 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
47884
48157
|
* If not, and if the bib isn't in fullscreen mode with focus lost, it hides the bib.
|
|
47885
48158
|
*/
|
|
47886
48159
|
handleFocusLoss() {
|
|
48160
|
+
const element = this.element;
|
|
48161
|
+
if (!element?.bib) {
|
|
48162
|
+
return;
|
|
48163
|
+
}
|
|
48164
|
+
|
|
47887
48165
|
// if mouse is being pressed, skip and let click event to handle the action
|
|
47888
48166
|
if (AuroFloatingUI.isMousePressed) {
|
|
47889
48167
|
return;
|
|
47890
48168
|
}
|
|
47891
48169
|
|
|
47892
48170
|
if (
|
|
47893
|
-
|
|
47894
|
-
|
|
48171
|
+
element.noHideOnThisFocusLoss ||
|
|
48172
|
+
element.hasAttribute("noHideOnThisFocusLoss")
|
|
47895
48173
|
) {
|
|
47896
48174
|
return;
|
|
47897
48175
|
}
|
|
47898
48176
|
|
|
47899
48177
|
// if focus is still inside of trigger or bib, do not close
|
|
47900
|
-
if (
|
|
47901
|
-
this.element.matches(":focus") ||
|
|
47902
|
-
this.element.matches(":focus-within")
|
|
47903
|
-
) {
|
|
48178
|
+
if (element.matches(":focus") || element.matches(":focus-within")) {
|
|
47904
48179
|
return;
|
|
47905
48180
|
}
|
|
47906
48181
|
|
|
47907
48182
|
// if fullscreen bib is in fullscreen mode, do not close
|
|
47908
|
-
if (
|
|
48183
|
+
if (element.bib.hasAttribute("isfullscreen")) {
|
|
47909
48184
|
return;
|
|
47910
48185
|
}
|
|
47911
48186
|
|
|
@@ -47913,23 +48188,33 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
47913
48188
|
}
|
|
47914
48189
|
|
|
47915
48190
|
setupHideHandlers() {
|
|
48191
|
+
const element = this.element;
|
|
48192
|
+
if (!element) {
|
|
48193
|
+
return;
|
|
48194
|
+
}
|
|
48195
|
+
|
|
47916
48196
|
// Define handlers & store references
|
|
47917
48197
|
this.focusHandler = () => this.handleFocusLoss();
|
|
47918
48198
|
|
|
47919
48199
|
this.clickHandler = (evt) => {
|
|
48200
|
+
const element = this.element;
|
|
48201
|
+
if (!element?.bib) {
|
|
48202
|
+
return;
|
|
48203
|
+
}
|
|
48204
|
+
|
|
47920
48205
|
// When the bib is fullscreen (modal dialog), don't close on outside
|
|
47921
48206
|
// clicks. VoiceOver's synthetic click events inside a top-layer modal
|
|
47922
48207
|
// <dialog> may not include the bib in composedPath(), causing false
|
|
47923
48208
|
// positives. This mirrors the fullscreen guard in handleFocusLoss().
|
|
47924
|
-
if (
|
|
48209
|
+
if (element.bib.hasAttribute("isfullscreen")) {
|
|
47925
48210
|
return;
|
|
47926
48211
|
}
|
|
47927
48212
|
|
|
47928
48213
|
if (
|
|
47929
|
-
(!evt.composedPath().includes(
|
|
47930
|
-
!evt.composedPath().includes(
|
|
47931
|
-
(
|
|
47932
|
-
evt.composedPath().includes(
|
|
48214
|
+
(!evt.composedPath().includes(element.trigger) &&
|
|
48215
|
+
!evt.composedPath().includes(element.bib)) ||
|
|
48216
|
+
(element.bib.backdrop &&
|
|
48217
|
+
evt.composedPath().includes(element.bib.backdrop))
|
|
47933
48218
|
) {
|
|
47934
48219
|
const existedVisibleFloatingUI =
|
|
47935
48220
|
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
@@ -47950,7 +48235,12 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
47950
48235
|
|
|
47951
48236
|
// ESC key handler
|
|
47952
48237
|
this.keyDownHandler = (evt) => {
|
|
47953
|
-
|
|
48238
|
+
const element = this.element;
|
|
48239
|
+
if (!element) {
|
|
48240
|
+
return;
|
|
48241
|
+
}
|
|
48242
|
+
|
|
48243
|
+
if (evt.key === "Escape" && element.isPopoverVisible) {
|
|
47954
48244
|
const existedVisibleFloatingUI =
|
|
47955
48245
|
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
47956
48246
|
if (
|
|
@@ -48007,6 +48297,10 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
48007
48297
|
}
|
|
48008
48298
|
|
|
48009
48299
|
updateCurrentExpandedDropdown() {
|
|
48300
|
+
if (!this.element) {
|
|
48301
|
+
return;
|
|
48302
|
+
}
|
|
48303
|
+
|
|
48010
48304
|
// Close any other dropdown that is already open
|
|
48011
48305
|
const existedVisibleFloatingUI =
|
|
48012
48306
|
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
@@ -48023,25 +48317,34 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
48023
48317
|
}
|
|
48024
48318
|
|
|
48025
48319
|
showBib() {
|
|
48026
|
-
|
|
48320
|
+
const element = this.element;
|
|
48321
|
+
if (!element) {
|
|
48322
|
+
return;
|
|
48323
|
+
}
|
|
48324
|
+
|
|
48325
|
+
if (!element.bib || (!element.trigger && !element.parentNode)) {
|
|
48326
|
+
return;
|
|
48327
|
+
}
|
|
48328
|
+
|
|
48329
|
+
if (!element.disabled && !this.showing) {
|
|
48027
48330
|
this.updateCurrentExpandedDropdown();
|
|
48028
|
-
|
|
48331
|
+
element.triggerChevron?.setAttribute("data-expanded", true);
|
|
48029
48332
|
|
|
48030
48333
|
// prevent double showing: isPopovervisible gets first and showBib gets called later
|
|
48031
48334
|
if (!this.showing) {
|
|
48032
|
-
if (!
|
|
48335
|
+
if (!element.modal) {
|
|
48033
48336
|
this.setupHideHandlers();
|
|
48034
48337
|
}
|
|
48035
48338
|
this.showing = true;
|
|
48036
|
-
|
|
48339
|
+
element.isPopoverVisible = true;
|
|
48037
48340
|
this.position();
|
|
48038
48341
|
this.dispatchEventDropdownToggle();
|
|
48039
48342
|
}
|
|
48040
48343
|
|
|
48041
48344
|
// Setup auto update to handle resize and scroll
|
|
48042
|
-
|
|
48043
|
-
|
|
48044
|
-
|
|
48345
|
+
element.cleanup = autoUpdate$1(
|
|
48346
|
+
element.trigger || element.parentNode,
|
|
48347
|
+
element.bib,
|
|
48045
48348
|
() => {
|
|
48046
48349
|
this.position();
|
|
48047
48350
|
},
|
|
@@ -48054,22 +48357,27 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
48054
48357
|
* @param {String} eventType - The event type that triggered the hiding action.
|
|
48055
48358
|
*/
|
|
48056
48359
|
hideBib(eventType = "unknown") {
|
|
48057
|
-
|
|
48360
|
+
const element = this.element;
|
|
48361
|
+
if (!element) {
|
|
48362
|
+
return;
|
|
48363
|
+
}
|
|
48364
|
+
|
|
48365
|
+
if (element.disabled) {
|
|
48058
48366
|
return;
|
|
48059
48367
|
}
|
|
48060
48368
|
|
|
48061
48369
|
// noToggle dropdowns should not close when the trigger is clicked (the
|
|
48062
48370
|
// "toggle" behavior), but they CAN still close via other interactions like
|
|
48063
48371
|
// Escape key or focus loss.
|
|
48064
|
-
if (
|
|
48372
|
+
if (element.noToggle && eventType === "click") {
|
|
48065
48373
|
return;
|
|
48066
48374
|
}
|
|
48067
48375
|
|
|
48068
48376
|
this.lockScroll(false);
|
|
48069
|
-
|
|
48377
|
+
element.triggerChevron?.removeAttribute("data-expanded");
|
|
48070
48378
|
|
|
48071
|
-
if (
|
|
48072
|
-
|
|
48379
|
+
if (element.isPopoverVisible) {
|
|
48380
|
+
element.isPopoverVisible = false;
|
|
48073
48381
|
}
|
|
48074
48382
|
if (this.showing) {
|
|
48075
48383
|
this.cleanupHideHandlers();
|
|
@@ -48089,6 +48397,11 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
48089
48397
|
* @param {String} eventType - The event type that triggered the toggle action.
|
|
48090
48398
|
*/
|
|
48091
48399
|
dispatchEventDropdownToggle(eventType) {
|
|
48400
|
+
const element = this.element;
|
|
48401
|
+
if (!element) {
|
|
48402
|
+
return;
|
|
48403
|
+
}
|
|
48404
|
+
|
|
48092
48405
|
const event = new CustomEvent(
|
|
48093
48406
|
this.eventPrefix ? `${this.eventPrefix}-toggled` : "toggled",
|
|
48094
48407
|
{
|
|
@@ -48100,11 +48413,16 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
48100
48413
|
},
|
|
48101
48414
|
);
|
|
48102
48415
|
|
|
48103
|
-
|
|
48416
|
+
element.dispatchEvent(event);
|
|
48104
48417
|
}
|
|
48105
48418
|
|
|
48106
48419
|
handleClick() {
|
|
48107
|
-
|
|
48420
|
+
const element = this.element;
|
|
48421
|
+
if (!element) {
|
|
48422
|
+
return;
|
|
48423
|
+
}
|
|
48424
|
+
|
|
48425
|
+
if (element.isPopoverVisible) {
|
|
48108
48426
|
this.hideBib("click");
|
|
48109
48427
|
} else {
|
|
48110
48428
|
this.showBib();
|
|
@@ -48115,63 +48433,66 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
48115
48433
|
{
|
|
48116
48434
|
composed: true,
|
|
48117
48435
|
detail: {
|
|
48118
|
-
expanded:
|
|
48436
|
+
expanded: element.isPopoverVisible,
|
|
48119
48437
|
},
|
|
48120
48438
|
},
|
|
48121
48439
|
);
|
|
48122
48440
|
|
|
48123
|
-
|
|
48441
|
+
element.dispatchEvent(event);
|
|
48124
48442
|
}
|
|
48125
48443
|
|
|
48126
48444
|
handleEvent(event) {
|
|
48127
|
-
|
|
48128
|
-
|
|
48129
|
-
|
|
48130
|
-
|
|
48131
|
-
|
|
48132
|
-
|
|
48133
|
-
|
|
48134
|
-
|
|
48135
|
-
|
|
48136
|
-
|
|
48137
|
-
|
|
48138
|
-
|
|
48139
|
-
|
|
48140
|
-
|
|
48141
|
-
|
|
48142
|
-
|
|
48143
|
-
case "mouseenter":
|
|
48144
|
-
if (this.element.hoverToggle) {
|
|
48145
|
-
this.showBib();
|
|
48146
|
-
}
|
|
48147
|
-
break;
|
|
48148
|
-
case "mouseleave":
|
|
48149
|
-
if (this.element.hoverToggle) {
|
|
48150
|
-
this.hideBib("mouseleave");
|
|
48151
|
-
}
|
|
48152
|
-
break;
|
|
48153
|
-
case "focus":
|
|
48154
|
-
if (this.element.focusShow) {
|
|
48155
|
-
/*
|
|
48156
|
-
This needs to better handle clicking that gives focus -
|
|
48157
|
-
currently it shows and then immediately hides the bib
|
|
48158
|
-
*/
|
|
48159
|
-
this.showBib();
|
|
48160
|
-
}
|
|
48161
|
-
break;
|
|
48162
|
-
case "blur":
|
|
48163
|
-
// send this task 100ms later queue to
|
|
48164
|
-
// wait a frame in case focus moves within the floating element/bib
|
|
48165
|
-
setTimeout(() => this.handleFocusLoss(), 0);
|
|
48166
|
-
break;
|
|
48167
|
-
case "click":
|
|
48168
|
-
if (document.activeElement === document.body) {
|
|
48169
|
-
event.currentTarget.focus();
|
|
48170
|
-
}
|
|
48445
|
+
const element = this.element;
|
|
48446
|
+
if (!element || element.disableEventShow) {
|
|
48447
|
+
return;
|
|
48448
|
+
}
|
|
48449
|
+
|
|
48450
|
+
switch (event.type) {
|
|
48451
|
+
case "keydown": {
|
|
48452
|
+
// Support both Enter and Space keys for accessibility
|
|
48453
|
+
// Space is included as it's expected behavior for interactive elements
|
|
48454
|
+
|
|
48455
|
+
const origin = event.composedPath()[0];
|
|
48456
|
+
if (
|
|
48457
|
+
event.key === "Enter" ||
|
|
48458
|
+
(event.key === " " && (!origin || origin.tagName !== "INPUT"))
|
|
48459
|
+
) {
|
|
48460
|
+
event.preventDefault();
|
|
48171
48461
|
this.handleClick();
|
|
48172
|
-
|
|
48173
|
-
|
|
48462
|
+
}
|
|
48463
|
+
break;
|
|
48174
48464
|
}
|
|
48465
|
+
case "mouseenter":
|
|
48466
|
+
if (element.hoverToggle) {
|
|
48467
|
+
this.showBib();
|
|
48468
|
+
}
|
|
48469
|
+
break;
|
|
48470
|
+
case "mouseleave":
|
|
48471
|
+
if (element.hoverToggle) {
|
|
48472
|
+
this.hideBib("mouseleave");
|
|
48473
|
+
}
|
|
48474
|
+
break;
|
|
48475
|
+
case "focus":
|
|
48476
|
+
if (element.focusShow) {
|
|
48477
|
+
/*
|
|
48478
|
+
This needs to better handle clicking that gives focus -
|
|
48479
|
+
currently it shows and then immediately hides the bib
|
|
48480
|
+
*/
|
|
48481
|
+
this.showBib();
|
|
48482
|
+
}
|
|
48483
|
+
break;
|
|
48484
|
+
case "blur":
|
|
48485
|
+
// send this task 100ms later queue to
|
|
48486
|
+
// wait a frame in case focus moves within the floating element/bib
|
|
48487
|
+
setTimeout(() => this.handleFocusLoss(), 0);
|
|
48488
|
+
break;
|
|
48489
|
+
case "click":
|
|
48490
|
+
if (document.activeElement === document.body) {
|
|
48491
|
+
event.currentTarget.focus();
|
|
48492
|
+
}
|
|
48493
|
+
this.handleClick();
|
|
48494
|
+
break;
|
|
48495
|
+
// Do nothing
|
|
48175
48496
|
}
|
|
48176
48497
|
}
|
|
48177
48498
|
|
|
@@ -48182,6 +48503,11 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
48182
48503
|
* This prevents the component itself from being focusable when the trigger element already handles focus.
|
|
48183
48504
|
*/
|
|
48184
48505
|
handleTriggerTabIndex() {
|
|
48506
|
+
const element = this.element;
|
|
48507
|
+
if (!element) {
|
|
48508
|
+
return;
|
|
48509
|
+
}
|
|
48510
|
+
|
|
48185
48511
|
const focusableElementSelectors = [
|
|
48186
48512
|
"a",
|
|
48187
48513
|
"button",
|
|
@@ -48194,7 +48520,7 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
48194
48520
|
"auro-hyperlink",
|
|
48195
48521
|
];
|
|
48196
48522
|
|
|
48197
|
-
const triggerNode =
|
|
48523
|
+
const triggerNode = element.querySelectorAll('[slot="trigger"]')[0];
|
|
48198
48524
|
if (!triggerNode) {
|
|
48199
48525
|
return;
|
|
48200
48526
|
}
|
|
@@ -48203,13 +48529,13 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
48203
48529
|
focusableElementSelectors.forEach((selector) => {
|
|
48204
48530
|
// Check if the trigger node element is focusable
|
|
48205
48531
|
if (triggerNodeTagName === selector) {
|
|
48206
|
-
|
|
48532
|
+
element.tabIndex = -1;
|
|
48207
48533
|
return;
|
|
48208
48534
|
}
|
|
48209
48535
|
|
|
48210
48536
|
// Check if any child is focusable
|
|
48211
48537
|
if (triggerNode.querySelector(selector)) {
|
|
48212
|
-
|
|
48538
|
+
element.tabIndex = -1;
|
|
48213
48539
|
}
|
|
48214
48540
|
});
|
|
48215
48541
|
}
|
|
@@ -48219,13 +48545,18 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
48219
48545
|
* @param {*} eventPrefix
|
|
48220
48546
|
*/
|
|
48221
48547
|
regenerateBibId() {
|
|
48222
|
-
|
|
48548
|
+
const element = this.element;
|
|
48549
|
+
if (!element) {
|
|
48550
|
+
return;
|
|
48551
|
+
}
|
|
48552
|
+
|
|
48553
|
+
this.id = element.getAttribute("id");
|
|
48223
48554
|
if (!this.id) {
|
|
48224
48555
|
this.id = window.crypto.randomUUID();
|
|
48225
|
-
|
|
48556
|
+
element.setAttribute("id", this.id);
|
|
48226
48557
|
}
|
|
48227
48558
|
|
|
48228
|
-
|
|
48559
|
+
element.bib?.setAttribute("id", `${this.id}-floater-bib`);
|
|
48229
48560
|
}
|
|
48230
48561
|
|
|
48231
48562
|
configure(elem, eventPrefix, enableKeyboardHandling = true) {
|
|
@@ -48237,67 +48568,69 @@ let AuroFloatingUI$1 = class AuroFloatingUI {
|
|
|
48237
48568
|
this.element = elem;
|
|
48238
48569
|
}
|
|
48239
48570
|
|
|
48240
|
-
|
|
48241
|
-
|
|
48571
|
+
const element = this.element;
|
|
48572
|
+
if (!element) {
|
|
48573
|
+
return;
|
|
48242
48574
|
}
|
|
48243
48575
|
|
|
48244
|
-
if (this.element.
|
|
48576
|
+
if (this.behavior !== element.behavior) {
|
|
48577
|
+
this.behavior = element.behavior;
|
|
48578
|
+
}
|
|
48579
|
+
|
|
48580
|
+
if (element.trigger) {
|
|
48245
48581
|
this.disconnect();
|
|
48246
48582
|
}
|
|
48247
|
-
|
|
48248
|
-
|
|
48249
|
-
|
|
48250
|
-
|
|
48251
|
-
|
|
48252
|
-
|
|
48253
|
-
|
|
48254
|
-
|
|
48255
|
-
this.element.shadowRoot.querySelector("#showStateIcon");
|
|
48583
|
+
element.trigger =
|
|
48584
|
+
element.triggerElement ||
|
|
48585
|
+
element.shadowRoot?.querySelector("#trigger") ||
|
|
48586
|
+
element.trigger;
|
|
48587
|
+
element.bib = element.shadowRoot?.querySelector("#bib") || element.bib;
|
|
48588
|
+
element.bibSizer = element.shadowRoot?.querySelector("#bibSizer");
|
|
48589
|
+
element.triggerChevron =
|
|
48590
|
+
element.shadowRoot?.querySelector("#showStateIcon");
|
|
48256
48591
|
|
|
48257
|
-
if (
|
|
48258
|
-
|
|
48592
|
+
if (element.floaterConfig) {
|
|
48593
|
+
element.hoverToggle = element.floaterConfig.hoverToggle;
|
|
48259
48594
|
}
|
|
48260
48595
|
|
|
48261
48596
|
this.regenerateBibId();
|
|
48262
48597
|
this.handleTriggerTabIndex();
|
|
48263
48598
|
|
|
48264
48599
|
this.handleEvent = this.handleEvent.bind(this);
|
|
48265
|
-
if (
|
|
48600
|
+
if (element.trigger) {
|
|
48266
48601
|
if (this.enableKeyboardHandling) {
|
|
48267
|
-
|
|
48602
|
+
element.trigger.addEventListener("keydown", this.handleEvent);
|
|
48268
48603
|
}
|
|
48269
|
-
|
|
48270
|
-
|
|
48271
|
-
|
|
48272
|
-
|
|
48273
|
-
|
|
48604
|
+
element.trigger.addEventListener("click", this.handleEvent);
|
|
48605
|
+
element.trigger.addEventListener("mouseenter", this.handleEvent);
|
|
48606
|
+
element.trigger.addEventListener("mouseleave", this.handleEvent);
|
|
48607
|
+
element.trigger.addEventListener("focus", this.handleEvent);
|
|
48608
|
+
element.trigger.addEventListener("blur", this.handleEvent);
|
|
48274
48609
|
}
|
|
48275
48610
|
}
|
|
48276
48611
|
|
|
48277
48612
|
disconnect() {
|
|
48278
48613
|
this.cleanupHideHandlers();
|
|
48279
|
-
if (this.element) {
|
|
48280
|
-
this.element.cleanup?.();
|
|
48281
48614
|
|
|
48282
|
-
|
|
48283
|
-
|
|
48284
|
-
|
|
48615
|
+
const element = this.element;
|
|
48616
|
+
if (!element) {
|
|
48617
|
+
return;
|
|
48618
|
+
}
|
|
48285
48619
|
|
|
48286
|
-
|
|
48287
|
-
|
|
48288
|
-
|
|
48289
|
-
|
|
48290
|
-
|
|
48291
|
-
|
|
48292
|
-
|
|
48293
|
-
|
|
48294
|
-
|
|
48295
|
-
|
|
48296
|
-
|
|
48297
|
-
|
|
48298
|
-
|
|
48299
|
-
|
|
48300
|
-
}
|
|
48620
|
+
element.cleanup?.();
|
|
48621
|
+
|
|
48622
|
+
if (element.bib && element.shadowRoot) {
|
|
48623
|
+
element.shadowRoot.append(element.bib);
|
|
48624
|
+
}
|
|
48625
|
+
|
|
48626
|
+
// Remove event & keyboard listeners
|
|
48627
|
+
if (element.trigger) {
|
|
48628
|
+
element.trigger.removeEventListener("keydown", this.handleEvent);
|
|
48629
|
+
element.trigger.removeEventListener("click", this.handleEvent);
|
|
48630
|
+
element.trigger.removeEventListener("mouseenter", this.handleEvent);
|
|
48631
|
+
element.trigger.removeEventListener("mouseleave", this.handleEvent);
|
|
48632
|
+
element.trigger.removeEventListener("focus", this.handleEvent);
|
|
48633
|
+
element.trigger.removeEventListener("blur", this.handleEvent);
|
|
48301
48634
|
}
|
|
48302
48635
|
}
|
|
48303
48636
|
};
|
|
@@ -49425,7 +49758,7 @@ let AuroHelpText$2 = class AuroHelpText extends i$4 {
|
|
|
49425
49758
|
}
|
|
49426
49759
|
};
|
|
49427
49760
|
|
|
49428
|
-
var formkitVersion$2 = '
|
|
49761
|
+
var formkitVersion$2 = '202604081417';
|
|
49429
49762
|
|
|
49430
49763
|
let AuroElement$2$1 = class AuroElement extends i$4 {
|
|
49431
49764
|
static get properties() {
|
|
@@ -57182,7 +57515,7 @@ let AuroHelpText$1$1 = class AuroHelpText extends i$4 {
|
|
|
57182
57515
|
}
|
|
57183
57516
|
};
|
|
57184
57517
|
|
|
57185
|
-
var formkitVersion$1$1 = '
|
|
57518
|
+
var formkitVersion$1$1 = '202604081417';
|
|
57186
57519
|
|
|
57187
57520
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
57188
57521
|
// See LICENSE in the project root for license information.
|
|
@@ -58247,7 +58580,7 @@ let AuroBibtemplate$1 = class AuroBibtemplate extends i$4 {
|
|
|
58247
58580
|
}
|
|
58248
58581
|
};
|
|
58249
58582
|
|
|
58250
|
-
var formkitVersion$3 = '
|
|
58583
|
+
var formkitVersion$3 = '202604081417';
|
|
58251
58584
|
|
|
58252
58585
|
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}`;
|
|
58253
58586
|
|
|
@@ -65674,11 +66007,19 @@ class AuroFloatingUI {
|
|
|
65674
66007
|
* This ensures that the bib content has the same dimensions as the sizer element.
|
|
65675
66008
|
*/
|
|
65676
66009
|
mirrorSize() {
|
|
66010
|
+
const element = this.element;
|
|
66011
|
+
if (!element) {
|
|
66012
|
+
return;
|
|
66013
|
+
}
|
|
66014
|
+
|
|
65677
66015
|
// mirror the boxsize from bibSizer
|
|
65678
|
-
if (
|
|
65679
|
-
const sizerStyle = window.getComputedStyle(
|
|
65680
|
-
const bibContent =
|
|
65681
|
-
|
|
66016
|
+
if (element.bibSizer && element.matchWidth && element.bib?.shadowRoot) {
|
|
66017
|
+
const sizerStyle = window.getComputedStyle(element.bibSizer);
|
|
66018
|
+
const bibContent = element.bib.shadowRoot.querySelector(".container");
|
|
66019
|
+
if (!bibContent) {
|
|
66020
|
+
return;
|
|
66021
|
+
}
|
|
66022
|
+
|
|
65682
66023
|
if (sizerStyle.width !== "0px") {
|
|
65683
66024
|
bibContent.style.width = sizerStyle.width;
|
|
65684
66025
|
}
|
|
@@ -65700,9 +66041,14 @@ class AuroFloatingUI {
|
|
|
65700
66041
|
* @returns {String} The positioning strategy, one of 'fullscreen', 'floating', 'cover'.
|
|
65701
66042
|
*/
|
|
65702
66043
|
getPositioningStrategy() {
|
|
66044
|
+
const element = this.element;
|
|
66045
|
+
if (!element) {
|
|
66046
|
+
return "floating";
|
|
66047
|
+
}
|
|
66048
|
+
|
|
65703
66049
|
const breakpoint =
|
|
65704
|
-
|
|
65705
|
-
|
|
66050
|
+
element.bib?.mobileFullscreenBreakpoint ||
|
|
66051
|
+
element.floaterConfig?.fullscreenBreakpoint;
|
|
65706
66052
|
switch (this.behavior) {
|
|
65707
66053
|
case "tooltip":
|
|
65708
66054
|
return "floating";
|
|
@@ -65713,9 +66059,9 @@ class AuroFloatingUI {
|
|
|
65713
66059
|
`(max-width: ${breakpoint})`,
|
|
65714
66060
|
).matches;
|
|
65715
66061
|
|
|
65716
|
-
|
|
66062
|
+
element.expanded = smallerThanBreakpoint;
|
|
65717
66063
|
}
|
|
65718
|
-
if (
|
|
66064
|
+
if (element.nested) {
|
|
65719
66065
|
return "cover";
|
|
65720
66066
|
}
|
|
65721
66067
|
return "fullscreen";
|
|
@@ -65745,42 +66091,65 @@ class AuroFloatingUI {
|
|
|
65745
66091
|
* and applies the calculated position to the bib's style.
|
|
65746
66092
|
*/
|
|
65747
66093
|
position() {
|
|
66094
|
+
const element = this.element;
|
|
66095
|
+
if (!element) {
|
|
66096
|
+
return;
|
|
66097
|
+
}
|
|
66098
|
+
|
|
65748
66099
|
const strategy = this.getPositioningStrategy();
|
|
65749
66100
|
this.configureBibStrategy(strategy);
|
|
65750
66101
|
|
|
65751
66102
|
if (strategy === "floating") {
|
|
66103
|
+
if (!element.trigger || !element.bib) {
|
|
66104
|
+
return;
|
|
66105
|
+
}
|
|
66106
|
+
|
|
65752
66107
|
this.mirrorSize();
|
|
65753
66108
|
// Define the middlware for the floater configuration
|
|
65754
66109
|
const middleware = [
|
|
65755
|
-
offset(
|
|
65756
|
-
...(
|
|
65757
|
-
...(
|
|
65758
|
-
...(
|
|
66110
|
+
offset(element.floaterConfig?.offset || 0),
|
|
66111
|
+
...(element.floaterConfig?.shift ? [shift()] : []), // Add shift middleware if shift is enabled.
|
|
66112
|
+
...(element.floaterConfig?.flip ? [flip()] : []), // Add flip middleware if flip is enabled.
|
|
66113
|
+
...(element.floaterConfig?.autoPlacement ? [autoPlacement()] : []), // Add autoPlacement middleware if autoPlacement is enabled.
|
|
65759
66114
|
];
|
|
65760
66115
|
|
|
65761
66116
|
// Compute the position of the bib
|
|
65762
|
-
computePosition(
|
|
65763
|
-
strategy:
|
|
65764
|
-
placement:
|
|
66117
|
+
computePosition(element.trigger, element.bib, {
|
|
66118
|
+
strategy: element.floaterConfig?.strategy || "fixed",
|
|
66119
|
+
placement: element.floaterConfig?.placement,
|
|
65765
66120
|
middleware: middleware || [],
|
|
65766
66121
|
}).then(({ x, y }) => {
|
|
65767
66122
|
// eslint-disable-line id-length
|
|
65768
|
-
|
|
66123
|
+
const currentElement = this.element;
|
|
66124
|
+
if (!currentElement?.bib) {
|
|
66125
|
+
return;
|
|
66126
|
+
}
|
|
66127
|
+
|
|
66128
|
+
Object.assign(currentElement.bib.style, {
|
|
65769
66129
|
left: `${x}px`,
|
|
65770
66130
|
top: `${y}px`,
|
|
65771
66131
|
});
|
|
65772
66132
|
});
|
|
65773
66133
|
} else if (strategy === "cover") {
|
|
66134
|
+
if (!element.parentNode || !element.bib) {
|
|
66135
|
+
return;
|
|
66136
|
+
}
|
|
66137
|
+
|
|
65774
66138
|
// Compute the position of the bib
|
|
65775
|
-
computePosition(
|
|
66139
|
+
computePosition(element.parentNode, element.bib, {
|
|
65776
66140
|
placement: "bottom-start",
|
|
65777
66141
|
}).then(({ x, y }) => {
|
|
65778
66142
|
// eslint-disable-line id-length
|
|
65779
|
-
|
|
66143
|
+
const currentElement = this.element;
|
|
66144
|
+
if (!currentElement?.bib || !currentElement.parentNode) {
|
|
66145
|
+
return;
|
|
66146
|
+
}
|
|
66147
|
+
|
|
66148
|
+
Object.assign(currentElement.bib.style, {
|
|
65780
66149
|
left: `${x}px`,
|
|
65781
|
-
top: `${y -
|
|
65782
|
-
width: `${
|
|
65783
|
-
height: `${
|
|
66150
|
+
top: `${y - currentElement.parentNode.offsetHeight}px`,
|
|
66151
|
+
width: `${currentElement.parentNode.offsetWidth}px`,
|
|
66152
|
+
height: `${currentElement.parentNode.offsetHeight}px`,
|
|
65784
66153
|
});
|
|
65785
66154
|
});
|
|
65786
66155
|
}
|
|
@@ -65792,11 +66161,17 @@ class AuroFloatingUI {
|
|
|
65792
66161
|
* @param {Boolean} lock - If true, locks the body's scrolling functionlity; otherwise, unlock.
|
|
65793
66162
|
*/
|
|
65794
66163
|
lockScroll(lock = true) {
|
|
66164
|
+
const element = this.element;
|
|
66165
|
+
|
|
65795
66166
|
if (lock) {
|
|
66167
|
+
if (!element?.bib) {
|
|
66168
|
+
return;
|
|
66169
|
+
}
|
|
66170
|
+
|
|
65796
66171
|
document.body.style.overflow = "hidden"; // hide body's scrollbar
|
|
65797
66172
|
|
|
65798
66173
|
// Move `bib` by the amount the viewport is shifted to stay aligned in fullscreen.
|
|
65799
|
-
|
|
66174
|
+
element.bib.style.transform = `translateY(${window?.visualViewport?.offsetTop}px)`;
|
|
65800
66175
|
} else {
|
|
65801
66176
|
document.body.style.overflow = "";
|
|
65802
66177
|
}
|
|
@@ -65812,20 +66187,24 @@ class AuroFloatingUI {
|
|
|
65812
66187
|
* @param {string} strategy - The positioning strategy ('fullscreen' or 'floating').
|
|
65813
66188
|
*/
|
|
65814
66189
|
configureBibStrategy(value) {
|
|
66190
|
+
const element = this.element;
|
|
66191
|
+
if (!element?.bib) {
|
|
66192
|
+
return;
|
|
66193
|
+
}
|
|
66194
|
+
|
|
65815
66195
|
if (value === "fullscreen") {
|
|
65816
|
-
|
|
66196
|
+
element.isBibFullscreen = true;
|
|
65817
66197
|
// reset the prev position
|
|
65818
|
-
|
|
65819
|
-
|
|
65820
|
-
|
|
65821
|
-
|
|
65822
|
-
|
|
65823
|
-
|
|
65824
|
-
|
|
66198
|
+
element.bib.setAttribute("isfullscreen", "");
|
|
66199
|
+
element.bib.style.position = "fixed";
|
|
66200
|
+
element.bib.style.top = "0px";
|
|
66201
|
+
element.bib.style.left = "0px";
|
|
66202
|
+
element.bib.style.width = "";
|
|
66203
|
+
element.bib.style.height = "";
|
|
66204
|
+
element.style.contain = "";
|
|
65825
66205
|
|
|
65826
66206
|
// reset the size that was mirroring `size` css-part
|
|
65827
|
-
const bibContent =
|
|
65828
|
-
this.element.bib.shadowRoot.querySelector(".container");
|
|
66207
|
+
const bibContent = element.bib.shadowRoot?.querySelector(".container");
|
|
65829
66208
|
if (bibContent) {
|
|
65830
66209
|
bibContent.style.width = "";
|
|
65831
66210
|
bibContent.style.height = "";
|
|
@@ -65840,14 +66219,14 @@ class AuroFloatingUI {
|
|
|
65840
66219
|
}, 0);
|
|
65841
66220
|
}
|
|
65842
66221
|
|
|
65843
|
-
if (
|
|
66222
|
+
if (element.isPopoverVisible) {
|
|
65844
66223
|
this.lockScroll(true);
|
|
65845
66224
|
}
|
|
65846
66225
|
} else {
|
|
65847
|
-
|
|
65848
|
-
|
|
65849
|
-
|
|
65850
|
-
|
|
66226
|
+
element.bib.style.position = "";
|
|
66227
|
+
element.bib.removeAttribute("isfullscreen");
|
|
66228
|
+
element.isBibFullscreen = false;
|
|
66229
|
+
element.style.contain = "layout";
|
|
65851
66230
|
}
|
|
65852
66231
|
|
|
65853
66232
|
const isChanged = this.strategy && this.strategy !== value;
|
|
@@ -65865,16 +66244,21 @@ class AuroFloatingUI {
|
|
|
65865
66244
|
},
|
|
65866
66245
|
);
|
|
65867
66246
|
|
|
65868
|
-
|
|
66247
|
+
element.dispatchEvent(event);
|
|
65869
66248
|
}
|
|
65870
66249
|
}
|
|
65871
66250
|
|
|
65872
66251
|
updateState() {
|
|
65873
|
-
const
|
|
66252
|
+
const element = this.element;
|
|
66253
|
+
if (!element) {
|
|
66254
|
+
return;
|
|
66255
|
+
}
|
|
66256
|
+
|
|
66257
|
+
const isVisible = element.isPopoverVisible;
|
|
65874
66258
|
if (!isVisible) {
|
|
65875
66259
|
this.cleanupHideHandlers();
|
|
65876
66260
|
try {
|
|
65877
|
-
|
|
66261
|
+
element.cleanup?.();
|
|
65878
66262
|
} catch (error) {
|
|
65879
66263
|
// Do nothing
|
|
65880
66264
|
}
|
|
@@ -65890,28 +66274,30 @@ class AuroFloatingUI {
|
|
|
65890
66274
|
* If not, and if the bib isn't in fullscreen mode with focus lost, it hides the bib.
|
|
65891
66275
|
*/
|
|
65892
66276
|
handleFocusLoss() {
|
|
66277
|
+
const element = this.element;
|
|
66278
|
+
if (!element?.bib) {
|
|
66279
|
+
return;
|
|
66280
|
+
}
|
|
66281
|
+
|
|
65893
66282
|
// if mouse is being pressed, skip and let click event to handle the action
|
|
65894
66283
|
if (AuroFloatingUI.isMousePressed) {
|
|
65895
66284
|
return;
|
|
65896
66285
|
}
|
|
65897
66286
|
|
|
65898
66287
|
if (
|
|
65899
|
-
|
|
65900
|
-
|
|
66288
|
+
element.noHideOnThisFocusLoss ||
|
|
66289
|
+
element.hasAttribute("noHideOnThisFocusLoss")
|
|
65901
66290
|
) {
|
|
65902
66291
|
return;
|
|
65903
66292
|
}
|
|
65904
66293
|
|
|
65905
66294
|
// if focus is still inside of trigger or bib, do not close
|
|
65906
|
-
if (
|
|
65907
|
-
this.element.matches(":focus") ||
|
|
65908
|
-
this.element.matches(":focus-within")
|
|
65909
|
-
) {
|
|
66295
|
+
if (element.matches(":focus") || element.matches(":focus-within")) {
|
|
65910
66296
|
return;
|
|
65911
66297
|
}
|
|
65912
66298
|
|
|
65913
66299
|
// if fullscreen bib is in fullscreen mode, do not close
|
|
65914
|
-
if (
|
|
66300
|
+
if (element.bib.hasAttribute("isfullscreen")) {
|
|
65915
66301
|
return;
|
|
65916
66302
|
}
|
|
65917
66303
|
|
|
@@ -65919,23 +66305,33 @@ class AuroFloatingUI {
|
|
|
65919
66305
|
}
|
|
65920
66306
|
|
|
65921
66307
|
setupHideHandlers() {
|
|
66308
|
+
const element = this.element;
|
|
66309
|
+
if (!element) {
|
|
66310
|
+
return;
|
|
66311
|
+
}
|
|
66312
|
+
|
|
65922
66313
|
// Define handlers & store references
|
|
65923
66314
|
this.focusHandler = () => this.handleFocusLoss();
|
|
65924
66315
|
|
|
65925
66316
|
this.clickHandler = (evt) => {
|
|
66317
|
+
const element = this.element;
|
|
66318
|
+
if (!element?.bib) {
|
|
66319
|
+
return;
|
|
66320
|
+
}
|
|
66321
|
+
|
|
65926
66322
|
// When the bib is fullscreen (modal dialog), don't close on outside
|
|
65927
66323
|
// clicks. VoiceOver's synthetic click events inside a top-layer modal
|
|
65928
66324
|
// <dialog> may not include the bib in composedPath(), causing false
|
|
65929
66325
|
// positives. This mirrors the fullscreen guard in handleFocusLoss().
|
|
65930
|
-
if (
|
|
66326
|
+
if (element.bib.hasAttribute("isfullscreen")) {
|
|
65931
66327
|
return;
|
|
65932
66328
|
}
|
|
65933
66329
|
|
|
65934
66330
|
if (
|
|
65935
|
-
(!evt.composedPath().includes(
|
|
65936
|
-
!evt.composedPath().includes(
|
|
65937
|
-
(
|
|
65938
|
-
evt.composedPath().includes(
|
|
66331
|
+
(!evt.composedPath().includes(element.trigger) &&
|
|
66332
|
+
!evt.composedPath().includes(element.bib)) ||
|
|
66333
|
+
(element.bib.backdrop &&
|
|
66334
|
+
evt.composedPath().includes(element.bib.backdrop))
|
|
65939
66335
|
) {
|
|
65940
66336
|
const existedVisibleFloatingUI =
|
|
65941
66337
|
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
@@ -65956,7 +66352,12 @@ class AuroFloatingUI {
|
|
|
65956
66352
|
|
|
65957
66353
|
// ESC key handler
|
|
65958
66354
|
this.keyDownHandler = (evt) => {
|
|
65959
|
-
|
|
66355
|
+
const element = this.element;
|
|
66356
|
+
if (!element) {
|
|
66357
|
+
return;
|
|
66358
|
+
}
|
|
66359
|
+
|
|
66360
|
+
if (evt.key === "Escape" && element.isPopoverVisible) {
|
|
65960
66361
|
const existedVisibleFloatingUI =
|
|
65961
66362
|
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
65962
66363
|
if (
|
|
@@ -66013,6 +66414,10 @@ class AuroFloatingUI {
|
|
|
66013
66414
|
}
|
|
66014
66415
|
|
|
66015
66416
|
updateCurrentExpandedDropdown() {
|
|
66417
|
+
if (!this.element) {
|
|
66418
|
+
return;
|
|
66419
|
+
}
|
|
66420
|
+
|
|
66016
66421
|
// Close any other dropdown that is already open
|
|
66017
66422
|
const existedVisibleFloatingUI =
|
|
66018
66423
|
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
@@ -66029,25 +66434,34 @@ class AuroFloatingUI {
|
|
|
66029
66434
|
}
|
|
66030
66435
|
|
|
66031
66436
|
showBib() {
|
|
66032
|
-
|
|
66437
|
+
const element = this.element;
|
|
66438
|
+
if (!element) {
|
|
66439
|
+
return;
|
|
66440
|
+
}
|
|
66441
|
+
|
|
66442
|
+
if (!element.bib || (!element.trigger && !element.parentNode)) {
|
|
66443
|
+
return;
|
|
66444
|
+
}
|
|
66445
|
+
|
|
66446
|
+
if (!element.disabled && !this.showing) {
|
|
66033
66447
|
this.updateCurrentExpandedDropdown();
|
|
66034
|
-
|
|
66448
|
+
element.triggerChevron?.setAttribute("data-expanded", true);
|
|
66035
66449
|
|
|
66036
66450
|
// prevent double showing: isPopovervisible gets first and showBib gets called later
|
|
66037
66451
|
if (!this.showing) {
|
|
66038
|
-
if (!
|
|
66452
|
+
if (!element.modal) {
|
|
66039
66453
|
this.setupHideHandlers();
|
|
66040
66454
|
}
|
|
66041
66455
|
this.showing = true;
|
|
66042
|
-
|
|
66456
|
+
element.isPopoverVisible = true;
|
|
66043
66457
|
this.position();
|
|
66044
66458
|
this.dispatchEventDropdownToggle();
|
|
66045
66459
|
}
|
|
66046
66460
|
|
|
66047
66461
|
// Setup auto update to handle resize and scroll
|
|
66048
|
-
|
|
66049
|
-
|
|
66050
|
-
|
|
66462
|
+
element.cleanup = autoUpdate(
|
|
66463
|
+
element.trigger || element.parentNode,
|
|
66464
|
+
element.bib,
|
|
66051
66465
|
() => {
|
|
66052
66466
|
this.position();
|
|
66053
66467
|
},
|
|
@@ -66060,22 +66474,27 @@ class AuroFloatingUI {
|
|
|
66060
66474
|
* @param {String} eventType - The event type that triggered the hiding action.
|
|
66061
66475
|
*/
|
|
66062
66476
|
hideBib(eventType = "unknown") {
|
|
66063
|
-
|
|
66477
|
+
const element = this.element;
|
|
66478
|
+
if (!element) {
|
|
66479
|
+
return;
|
|
66480
|
+
}
|
|
66481
|
+
|
|
66482
|
+
if (element.disabled) {
|
|
66064
66483
|
return;
|
|
66065
66484
|
}
|
|
66066
66485
|
|
|
66067
66486
|
// noToggle dropdowns should not close when the trigger is clicked (the
|
|
66068
66487
|
// "toggle" behavior), but they CAN still close via other interactions like
|
|
66069
66488
|
// Escape key or focus loss.
|
|
66070
|
-
if (
|
|
66489
|
+
if (element.noToggle && eventType === "click") {
|
|
66071
66490
|
return;
|
|
66072
66491
|
}
|
|
66073
66492
|
|
|
66074
66493
|
this.lockScroll(false);
|
|
66075
|
-
|
|
66494
|
+
element.triggerChevron?.removeAttribute("data-expanded");
|
|
66076
66495
|
|
|
66077
|
-
if (
|
|
66078
|
-
|
|
66496
|
+
if (element.isPopoverVisible) {
|
|
66497
|
+
element.isPopoverVisible = false;
|
|
66079
66498
|
}
|
|
66080
66499
|
if (this.showing) {
|
|
66081
66500
|
this.cleanupHideHandlers();
|
|
@@ -66095,6 +66514,11 @@ class AuroFloatingUI {
|
|
|
66095
66514
|
* @param {String} eventType - The event type that triggered the toggle action.
|
|
66096
66515
|
*/
|
|
66097
66516
|
dispatchEventDropdownToggle(eventType) {
|
|
66517
|
+
const element = this.element;
|
|
66518
|
+
if (!element) {
|
|
66519
|
+
return;
|
|
66520
|
+
}
|
|
66521
|
+
|
|
66098
66522
|
const event = new CustomEvent(
|
|
66099
66523
|
this.eventPrefix ? `${this.eventPrefix}-toggled` : "toggled",
|
|
66100
66524
|
{
|
|
@@ -66106,11 +66530,16 @@ class AuroFloatingUI {
|
|
|
66106
66530
|
},
|
|
66107
66531
|
);
|
|
66108
66532
|
|
|
66109
|
-
|
|
66533
|
+
element.dispatchEvent(event);
|
|
66110
66534
|
}
|
|
66111
66535
|
|
|
66112
66536
|
handleClick() {
|
|
66113
|
-
|
|
66537
|
+
const element = this.element;
|
|
66538
|
+
if (!element) {
|
|
66539
|
+
return;
|
|
66540
|
+
}
|
|
66541
|
+
|
|
66542
|
+
if (element.isPopoverVisible) {
|
|
66114
66543
|
this.hideBib("click");
|
|
66115
66544
|
} else {
|
|
66116
66545
|
this.showBib();
|
|
@@ -66121,63 +66550,66 @@ class AuroFloatingUI {
|
|
|
66121
66550
|
{
|
|
66122
66551
|
composed: true,
|
|
66123
66552
|
detail: {
|
|
66124
|
-
expanded:
|
|
66553
|
+
expanded: element.isPopoverVisible,
|
|
66125
66554
|
},
|
|
66126
66555
|
},
|
|
66127
66556
|
);
|
|
66128
66557
|
|
|
66129
|
-
|
|
66558
|
+
element.dispatchEvent(event);
|
|
66130
66559
|
}
|
|
66131
66560
|
|
|
66132
66561
|
handleEvent(event) {
|
|
66133
|
-
|
|
66134
|
-
|
|
66135
|
-
|
|
66136
|
-
|
|
66137
|
-
|
|
66138
|
-
|
|
66139
|
-
|
|
66140
|
-
|
|
66141
|
-
|
|
66142
|
-
|
|
66143
|
-
|
|
66144
|
-
|
|
66145
|
-
|
|
66146
|
-
|
|
66147
|
-
|
|
66148
|
-
|
|
66149
|
-
case "mouseenter":
|
|
66150
|
-
if (this.element.hoverToggle) {
|
|
66151
|
-
this.showBib();
|
|
66152
|
-
}
|
|
66153
|
-
break;
|
|
66154
|
-
case "mouseleave":
|
|
66155
|
-
if (this.element.hoverToggle) {
|
|
66156
|
-
this.hideBib("mouseleave");
|
|
66157
|
-
}
|
|
66158
|
-
break;
|
|
66159
|
-
case "focus":
|
|
66160
|
-
if (this.element.focusShow) {
|
|
66161
|
-
/*
|
|
66162
|
-
This needs to better handle clicking that gives focus -
|
|
66163
|
-
currently it shows and then immediately hides the bib
|
|
66164
|
-
*/
|
|
66165
|
-
this.showBib();
|
|
66166
|
-
}
|
|
66167
|
-
break;
|
|
66168
|
-
case "blur":
|
|
66169
|
-
// send this task 100ms later queue to
|
|
66170
|
-
// wait a frame in case focus moves within the floating element/bib
|
|
66171
|
-
setTimeout(() => this.handleFocusLoss(), 0);
|
|
66172
|
-
break;
|
|
66173
|
-
case "click":
|
|
66174
|
-
if (document.activeElement === document.body) {
|
|
66175
|
-
event.currentTarget.focus();
|
|
66176
|
-
}
|
|
66562
|
+
const element = this.element;
|
|
66563
|
+
if (!element || element.disableEventShow) {
|
|
66564
|
+
return;
|
|
66565
|
+
}
|
|
66566
|
+
|
|
66567
|
+
switch (event.type) {
|
|
66568
|
+
case "keydown": {
|
|
66569
|
+
// Support both Enter and Space keys for accessibility
|
|
66570
|
+
// Space is included as it's expected behavior for interactive elements
|
|
66571
|
+
|
|
66572
|
+
const origin = event.composedPath()[0];
|
|
66573
|
+
if (
|
|
66574
|
+
event.key === "Enter" ||
|
|
66575
|
+
(event.key === " " && (!origin || origin.tagName !== "INPUT"))
|
|
66576
|
+
) {
|
|
66577
|
+
event.preventDefault();
|
|
66177
66578
|
this.handleClick();
|
|
66178
|
-
|
|
66179
|
-
|
|
66579
|
+
}
|
|
66580
|
+
break;
|
|
66180
66581
|
}
|
|
66582
|
+
case "mouseenter":
|
|
66583
|
+
if (element.hoverToggle) {
|
|
66584
|
+
this.showBib();
|
|
66585
|
+
}
|
|
66586
|
+
break;
|
|
66587
|
+
case "mouseleave":
|
|
66588
|
+
if (element.hoverToggle) {
|
|
66589
|
+
this.hideBib("mouseleave");
|
|
66590
|
+
}
|
|
66591
|
+
break;
|
|
66592
|
+
case "focus":
|
|
66593
|
+
if (element.focusShow) {
|
|
66594
|
+
/*
|
|
66595
|
+
This needs to better handle clicking that gives focus -
|
|
66596
|
+
currently it shows and then immediately hides the bib
|
|
66597
|
+
*/
|
|
66598
|
+
this.showBib();
|
|
66599
|
+
}
|
|
66600
|
+
break;
|
|
66601
|
+
case "blur":
|
|
66602
|
+
// send this task 100ms later queue to
|
|
66603
|
+
// wait a frame in case focus moves within the floating element/bib
|
|
66604
|
+
setTimeout(() => this.handleFocusLoss(), 0);
|
|
66605
|
+
break;
|
|
66606
|
+
case "click":
|
|
66607
|
+
if (document.activeElement === document.body) {
|
|
66608
|
+
event.currentTarget.focus();
|
|
66609
|
+
}
|
|
66610
|
+
this.handleClick();
|
|
66611
|
+
break;
|
|
66612
|
+
// Do nothing
|
|
66181
66613
|
}
|
|
66182
66614
|
}
|
|
66183
66615
|
|
|
@@ -66188,6 +66620,11 @@ class AuroFloatingUI {
|
|
|
66188
66620
|
* This prevents the component itself from being focusable when the trigger element already handles focus.
|
|
66189
66621
|
*/
|
|
66190
66622
|
handleTriggerTabIndex() {
|
|
66623
|
+
const element = this.element;
|
|
66624
|
+
if (!element) {
|
|
66625
|
+
return;
|
|
66626
|
+
}
|
|
66627
|
+
|
|
66191
66628
|
const focusableElementSelectors = [
|
|
66192
66629
|
"a",
|
|
66193
66630
|
"button",
|
|
@@ -66200,7 +66637,7 @@ class AuroFloatingUI {
|
|
|
66200
66637
|
"auro-hyperlink",
|
|
66201
66638
|
];
|
|
66202
66639
|
|
|
66203
|
-
const triggerNode =
|
|
66640
|
+
const triggerNode = element.querySelectorAll('[slot="trigger"]')[0];
|
|
66204
66641
|
if (!triggerNode) {
|
|
66205
66642
|
return;
|
|
66206
66643
|
}
|
|
@@ -66209,13 +66646,13 @@ class AuroFloatingUI {
|
|
|
66209
66646
|
focusableElementSelectors.forEach((selector) => {
|
|
66210
66647
|
// Check if the trigger node element is focusable
|
|
66211
66648
|
if (triggerNodeTagName === selector) {
|
|
66212
|
-
|
|
66649
|
+
element.tabIndex = -1;
|
|
66213
66650
|
return;
|
|
66214
66651
|
}
|
|
66215
66652
|
|
|
66216
66653
|
// Check if any child is focusable
|
|
66217
66654
|
if (triggerNode.querySelector(selector)) {
|
|
66218
|
-
|
|
66655
|
+
element.tabIndex = -1;
|
|
66219
66656
|
}
|
|
66220
66657
|
});
|
|
66221
66658
|
}
|
|
@@ -66225,13 +66662,18 @@ class AuroFloatingUI {
|
|
|
66225
66662
|
* @param {*} eventPrefix
|
|
66226
66663
|
*/
|
|
66227
66664
|
regenerateBibId() {
|
|
66228
|
-
|
|
66665
|
+
const element = this.element;
|
|
66666
|
+
if (!element) {
|
|
66667
|
+
return;
|
|
66668
|
+
}
|
|
66669
|
+
|
|
66670
|
+
this.id = element.getAttribute("id");
|
|
66229
66671
|
if (!this.id) {
|
|
66230
66672
|
this.id = window.crypto.randomUUID();
|
|
66231
|
-
|
|
66673
|
+
element.setAttribute("id", this.id);
|
|
66232
66674
|
}
|
|
66233
66675
|
|
|
66234
|
-
|
|
66676
|
+
element.bib?.setAttribute("id", `${this.id}-floater-bib`);
|
|
66235
66677
|
}
|
|
66236
66678
|
|
|
66237
66679
|
configure(elem, eventPrefix, enableKeyboardHandling = true) {
|
|
@@ -66243,67 +66685,69 @@ class AuroFloatingUI {
|
|
|
66243
66685
|
this.element = elem;
|
|
66244
66686
|
}
|
|
66245
66687
|
|
|
66246
|
-
|
|
66247
|
-
|
|
66688
|
+
const element = this.element;
|
|
66689
|
+
if (!element) {
|
|
66690
|
+
return;
|
|
66248
66691
|
}
|
|
66249
66692
|
|
|
66250
|
-
if (this.element.
|
|
66693
|
+
if (this.behavior !== element.behavior) {
|
|
66694
|
+
this.behavior = element.behavior;
|
|
66695
|
+
}
|
|
66696
|
+
|
|
66697
|
+
if (element.trigger) {
|
|
66251
66698
|
this.disconnect();
|
|
66252
66699
|
}
|
|
66253
|
-
|
|
66254
|
-
|
|
66255
|
-
|
|
66256
|
-
|
|
66257
|
-
|
|
66258
|
-
|
|
66259
|
-
|
|
66260
|
-
|
|
66261
|
-
this.element.shadowRoot.querySelector("#showStateIcon");
|
|
66700
|
+
element.trigger =
|
|
66701
|
+
element.triggerElement ||
|
|
66702
|
+
element.shadowRoot?.querySelector("#trigger") ||
|
|
66703
|
+
element.trigger;
|
|
66704
|
+
element.bib = element.shadowRoot?.querySelector("#bib") || element.bib;
|
|
66705
|
+
element.bibSizer = element.shadowRoot?.querySelector("#bibSizer");
|
|
66706
|
+
element.triggerChevron =
|
|
66707
|
+
element.shadowRoot?.querySelector("#showStateIcon");
|
|
66262
66708
|
|
|
66263
|
-
if (
|
|
66264
|
-
|
|
66709
|
+
if (element.floaterConfig) {
|
|
66710
|
+
element.hoverToggle = element.floaterConfig.hoverToggle;
|
|
66265
66711
|
}
|
|
66266
66712
|
|
|
66267
66713
|
this.regenerateBibId();
|
|
66268
66714
|
this.handleTriggerTabIndex();
|
|
66269
66715
|
|
|
66270
66716
|
this.handleEvent = this.handleEvent.bind(this);
|
|
66271
|
-
if (
|
|
66717
|
+
if (element.trigger) {
|
|
66272
66718
|
if (this.enableKeyboardHandling) {
|
|
66273
|
-
|
|
66719
|
+
element.trigger.addEventListener("keydown", this.handleEvent);
|
|
66274
66720
|
}
|
|
66275
|
-
|
|
66276
|
-
|
|
66277
|
-
|
|
66278
|
-
|
|
66279
|
-
|
|
66721
|
+
element.trigger.addEventListener("click", this.handleEvent);
|
|
66722
|
+
element.trigger.addEventListener("mouseenter", this.handleEvent);
|
|
66723
|
+
element.trigger.addEventListener("mouseleave", this.handleEvent);
|
|
66724
|
+
element.trigger.addEventListener("focus", this.handleEvent);
|
|
66725
|
+
element.trigger.addEventListener("blur", this.handleEvent);
|
|
66280
66726
|
}
|
|
66281
66727
|
}
|
|
66282
66728
|
|
|
66283
66729
|
disconnect() {
|
|
66284
66730
|
this.cleanupHideHandlers();
|
|
66285
|
-
if (this.element) {
|
|
66286
|
-
this.element.cleanup?.();
|
|
66287
66731
|
|
|
66288
|
-
|
|
66289
|
-
|
|
66290
|
-
|
|
66732
|
+
const element = this.element;
|
|
66733
|
+
if (!element) {
|
|
66734
|
+
return;
|
|
66735
|
+
}
|
|
66291
66736
|
|
|
66292
|
-
|
|
66293
|
-
|
|
66294
|
-
|
|
66295
|
-
|
|
66296
|
-
|
|
66297
|
-
|
|
66298
|
-
|
|
66299
|
-
|
|
66300
|
-
|
|
66301
|
-
|
|
66302
|
-
|
|
66303
|
-
|
|
66304
|
-
|
|
66305
|
-
|
|
66306
|
-
}
|
|
66737
|
+
element.cleanup?.();
|
|
66738
|
+
|
|
66739
|
+
if (element.bib && element.shadowRoot) {
|
|
66740
|
+
element.shadowRoot.append(element.bib);
|
|
66741
|
+
}
|
|
66742
|
+
|
|
66743
|
+
// Remove event & keyboard listeners
|
|
66744
|
+
if (element.trigger) {
|
|
66745
|
+
element.trigger.removeEventListener("keydown", this.handleEvent);
|
|
66746
|
+
element.trigger.removeEventListener("click", this.handleEvent);
|
|
66747
|
+
element.trigger.removeEventListener("mouseenter", this.handleEvent);
|
|
66748
|
+
element.trigger.removeEventListener("mouseleave", this.handleEvent);
|
|
66749
|
+
element.trigger.removeEventListener("focus", this.handleEvent);
|
|
66750
|
+
element.trigger.removeEventListener("blur", this.handleEvent);
|
|
66307
66751
|
}
|
|
66308
66752
|
}
|
|
66309
66753
|
}
|
|
@@ -67431,7 +67875,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$4 {
|
|
|
67431
67875
|
}
|
|
67432
67876
|
};
|
|
67433
67877
|
|
|
67434
|
-
var formkitVersion$1 = '
|
|
67878
|
+
var formkitVersion$1 = '202604081417';
|
|
67435
67879
|
|
|
67436
67880
|
class AuroElement extends i$4 {
|
|
67437
67881
|
static get properties() {
|
|
@@ -69184,7 +69628,7 @@ class AuroHelpText extends i$4 {
|
|
|
69184
69628
|
}
|
|
69185
69629
|
}
|
|
69186
69630
|
|
|
69187
|
-
var formkitVersion = '
|
|
69631
|
+
var formkitVersion = '202604081417';
|
|
69188
69632
|
|
|
69189
69633
|
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}`;
|
|
69190
69634
|
|