@aurodesignsystem-dev/auro-formkit 0.0.0-pr1422.1 → 0.0.0-pr1423.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 +165 -275
- package/components/combobox/demo/index.min.js +165 -275
- package/components/combobox/dist/index.js +165 -275
- package/components/combobox/dist/registered.js +165 -275
- package/components/counter/demo/api.min.js +164 -274
- package/components/counter/demo/index.min.js +164 -274
- package/components/counter/dist/index.js +164 -274
- package/components/counter/dist/registered.js +164 -274
- package/components/datepicker/demo/api.min.js +165 -275
- package/components/datepicker/demo/index.min.js +165 -275
- package/components/datepicker/dist/index.js +165 -275
- package/components/datepicker/dist/registered.js +165 -275
- package/components/dropdown/demo/api.min.js +164 -274
- package/components/dropdown/demo/index.min.js +164 -274
- package/components/dropdown/dist/index.js +164 -274
- package/components/dropdown/dist/registered.js +164 -274
- package/components/form/demo/api.min.js +661 -1101
- package/components/form/demo/index.min.js +661 -1101
- 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 +164 -274
- package/components/select/demo/index.min.js +164 -274
- package/components/select/dist/index.js +164 -274
- package/components/select/dist/registered.js +164 -274
- package/package.json +2 -2
|
@@ -9242,7 +9242,7 @@ class AuroBibtemplate extends LitElement {
|
|
|
9242
9242
|
}
|
|
9243
9243
|
}
|
|
9244
9244
|
|
|
9245
|
-
var formkitVersion$2 = '
|
|
9245
|
+
var formkitVersion$2 = '202604071525';
|
|
9246
9246
|
|
|
9247
9247
|
let l$1 = 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=literal`${unsafeStatic(r)}`;return customElements.get(r)||customElements.define(r,class extends a{}),i}};let d$1 = 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 = 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=css`:host{color:var(--ds-auro-loader-color)}:host>span{background-color:var(--ds-auro-loader-background-color);border-color:var(--ds-auro-loader-border-color)}:host([onlight]),: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}
|
|
9248
9248
|
`,u$4=css`.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}}
|
|
@@ -11552,19 +11552,11 @@ class AuroFloatingUI {
|
|
|
11552
11552
|
* This ensures that the bib content has the same dimensions as the sizer element.
|
|
11553
11553
|
*/
|
|
11554
11554
|
mirrorSize() {
|
|
11555
|
-
const element = this.element;
|
|
11556
|
-
if (!element) {
|
|
11557
|
-
return;
|
|
11558
|
-
}
|
|
11559
|
-
|
|
11560
11555
|
// mirror the boxsize from bibSizer
|
|
11561
|
-
if (element.bibSizer && element.matchWidth
|
|
11562
|
-
const sizerStyle = window.getComputedStyle(element.bibSizer);
|
|
11563
|
-
const bibContent =
|
|
11564
|
-
|
|
11565
|
-
return;
|
|
11566
|
-
}
|
|
11567
|
-
|
|
11556
|
+
if (this.element.bibSizer && this.element.matchWidth) {
|
|
11557
|
+
const sizerStyle = window.getComputedStyle(this.element.bibSizer);
|
|
11558
|
+
const bibContent =
|
|
11559
|
+
this.element.bib.shadowRoot.querySelector(".container");
|
|
11568
11560
|
if (sizerStyle.width !== "0px") {
|
|
11569
11561
|
bibContent.style.width = sizerStyle.width;
|
|
11570
11562
|
}
|
|
@@ -11586,14 +11578,9 @@ class AuroFloatingUI {
|
|
|
11586
11578
|
* @returns {String} The positioning strategy, one of 'fullscreen', 'floating', 'cover'.
|
|
11587
11579
|
*/
|
|
11588
11580
|
getPositioningStrategy() {
|
|
11589
|
-
const element = this.element;
|
|
11590
|
-
if (!element) {
|
|
11591
|
-
return this.behavior || "floating";
|
|
11592
|
-
}
|
|
11593
|
-
|
|
11594
11581
|
const breakpoint =
|
|
11595
|
-
element.bib
|
|
11596
|
-
element.floaterConfig?.fullscreenBreakpoint;
|
|
11582
|
+
this.element.bib.mobileFullscreenBreakpoint ||
|
|
11583
|
+
this.element.floaterConfig?.fullscreenBreakpoint;
|
|
11597
11584
|
switch (this.behavior) {
|
|
11598
11585
|
case "tooltip":
|
|
11599
11586
|
return "floating";
|
|
@@ -11604,9 +11591,9 @@ class AuroFloatingUI {
|
|
|
11604
11591
|
`(max-width: ${breakpoint})`,
|
|
11605
11592
|
).matches;
|
|
11606
11593
|
|
|
11607
|
-
element.expanded = smallerThanBreakpoint;
|
|
11594
|
+
this.element.expanded = smallerThanBreakpoint;
|
|
11608
11595
|
}
|
|
11609
|
-
if (element.nested) {
|
|
11596
|
+
if (this.element.nested) {
|
|
11610
11597
|
return "cover";
|
|
11611
11598
|
}
|
|
11612
11599
|
return "fullscreen";
|
|
@@ -11636,65 +11623,42 @@ class AuroFloatingUI {
|
|
|
11636
11623
|
* and applies the calculated position to the bib's style.
|
|
11637
11624
|
*/
|
|
11638
11625
|
position() {
|
|
11639
|
-
const element = this.element;
|
|
11640
|
-
if (!element) {
|
|
11641
|
-
return;
|
|
11642
|
-
}
|
|
11643
|
-
|
|
11644
11626
|
const strategy = this.getPositioningStrategy();
|
|
11645
11627
|
this.configureBibStrategy(strategy);
|
|
11646
11628
|
|
|
11647
11629
|
if (strategy === "floating") {
|
|
11648
|
-
if (!element.trigger || !element.bib) {
|
|
11649
|
-
return;
|
|
11650
|
-
}
|
|
11651
|
-
|
|
11652
11630
|
this.mirrorSize();
|
|
11653
11631
|
// Define the middlware for the floater configuration
|
|
11654
11632
|
const middleware = [
|
|
11655
|
-
offset(element.floaterConfig?.offset || 0),
|
|
11656
|
-
...(element.floaterConfig?.shift ? [shift()] : []), // Add shift middleware if shift is enabled.
|
|
11657
|
-
...(element.floaterConfig?.flip ? [flip()] : []), // Add flip middleware if flip is enabled.
|
|
11658
|
-
...(element.floaterConfig?.autoPlacement ? [autoPlacement()] : []), // Add autoPlacement middleware if autoPlacement is enabled.
|
|
11633
|
+
offset(this.element.floaterConfig?.offset || 0),
|
|
11634
|
+
...(this.element.floaterConfig?.shift ? [shift()] : []), // Add shift middleware if shift is enabled.
|
|
11635
|
+
...(this.element.floaterConfig?.flip ? [flip()] : []), // Add flip middleware if flip is enabled.
|
|
11636
|
+
...(this.element.floaterConfig?.autoPlacement ? [autoPlacement()] : []), // Add autoPlacement middleware if autoPlacement is enabled.
|
|
11659
11637
|
];
|
|
11660
11638
|
|
|
11661
11639
|
// Compute the position of the bib
|
|
11662
|
-
computePosition(element.trigger, element.bib, {
|
|
11663
|
-
strategy: element.floaterConfig?.strategy || "fixed",
|
|
11664
|
-
placement: element.floaterConfig?.placement,
|
|
11640
|
+
computePosition(this.element.trigger, this.element.bib, {
|
|
11641
|
+
strategy: this.element.floaterConfig?.strategy || "fixed",
|
|
11642
|
+
placement: this.element.floaterConfig?.placement,
|
|
11665
11643
|
middleware: middleware || [],
|
|
11666
11644
|
}).then(({ x, y }) => {
|
|
11667
11645
|
// eslint-disable-line id-length
|
|
11668
|
-
|
|
11669
|
-
if (!currentElement?.bib) {
|
|
11670
|
-
return;
|
|
11671
|
-
}
|
|
11672
|
-
|
|
11673
|
-
Object.assign(currentElement.bib.style, {
|
|
11646
|
+
Object.assign(this.element.bib.style, {
|
|
11674
11647
|
left: `${x}px`,
|
|
11675
11648
|
top: `${y}px`,
|
|
11676
11649
|
});
|
|
11677
11650
|
});
|
|
11678
11651
|
} else if (strategy === "cover") {
|
|
11679
|
-
if (!element.parentNode || !element.bib) {
|
|
11680
|
-
return;
|
|
11681
|
-
}
|
|
11682
|
-
|
|
11683
11652
|
// Compute the position of the bib
|
|
11684
|
-
computePosition(element.parentNode, element.bib, {
|
|
11653
|
+
computePosition(this.element.parentNode, this.element.bib, {
|
|
11685
11654
|
placement: "bottom-start",
|
|
11686
11655
|
}).then(({ x, y }) => {
|
|
11687
11656
|
// eslint-disable-line id-length
|
|
11688
|
-
|
|
11689
|
-
if (!currentElement?.bib || !currentElement.parentNode) {
|
|
11690
|
-
return;
|
|
11691
|
-
}
|
|
11692
|
-
|
|
11693
|
-
Object.assign(currentElement.bib.style, {
|
|
11657
|
+
Object.assign(this.element.bib.style, {
|
|
11694
11658
|
left: `${x}px`,
|
|
11695
|
-
top: `${y -
|
|
11696
|
-
width: `${
|
|
11697
|
-
height: `${
|
|
11659
|
+
top: `${y - this.element.parentNode.offsetHeight}px`,
|
|
11660
|
+
width: `${this.element.parentNode.offsetWidth}px`,
|
|
11661
|
+
height: `${this.element.parentNode.offsetHeight}px`,
|
|
11698
11662
|
});
|
|
11699
11663
|
});
|
|
11700
11664
|
}
|
|
@@ -11706,17 +11670,11 @@ class AuroFloatingUI {
|
|
|
11706
11670
|
* @param {Boolean} lock - If true, locks the body's scrolling functionlity; otherwise, unlock.
|
|
11707
11671
|
*/
|
|
11708
11672
|
lockScroll(lock = true) {
|
|
11709
|
-
const element = this.element;
|
|
11710
|
-
|
|
11711
11673
|
if (lock) {
|
|
11712
|
-
if (!element?.bib) {
|
|
11713
|
-
return;
|
|
11714
|
-
}
|
|
11715
|
-
|
|
11716
11674
|
document.body.style.overflow = "hidden"; // hide body's scrollbar
|
|
11717
11675
|
|
|
11718
11676
|
// Move `bib` by the amount the viewport is shifted to stay aligned in fullscreen.
|
|
11719
|
-
element.bib.style.transform = `translateY(${window?.visualViewport?.offsetTop}px)`;
|
|
11677
|
+
this.element.bib.style.transform = `translateY(${window?.visualViewport?.offsetTop}px)`;
|
|
11720
11678
|
} else {
|
|
11721
11679
|
document.body.style.overflow = "";
|
|
11722
11680
|
}
|
|
@@ -11732,24 +11690,20 @@ class AuroFloatingUI {
|
|
|
11732
11690
|
* @param {string} strategy - The positioning strategy ('fullscreen' or 'floating').
|
|
11733
11691
|
*/
|
|
11734
11692
|
configureBibStrategy(value) {
|
|
11735
|
-
const element = this.element;
|
|
11736
|
-
if (!element?.bib) {
|
|
11737
|
-
return;
|
|
11738
|
-
}
|
|
11739
|
-
|
|
11740
11693
|
if (value === "fullscreen") {
|
|
11741
|
-
element.isBibFullscreen = true;
|
|
11694
|
+
this.element.isBibFullscreen = true;
|
|
11742
11695
|
// reset the prev position
|
|
11743
|
-
element.bib.setAttribute("isfullscreen", "");
|
|
11744
|
-
element.bib.style.position = "fixed";
|
|
11745
|
-
element.bib.style.top = "0px";
|
|
11746
|
-
element.bib.style.left = "0px";
|
|
11747
|
-
element.bib.style.width = "";
|
|
11748
|
-
element.bib.style.height = "";
|
|
11749
|
-
element.style.contain = "";
|
|
11696
|
+
this.element.bib.setAttribute("isfullscreen", "");
|
|
11697
|
+
this.element.bib.style.position = "fixed";
|
|
11698
|
+
this.element.bib.style.top = "0px";
|
|
11699
|
+
this.element.bib.style.left = "0px";
|
|
11700
|
+
this.element.bib.style.width = "";
|
|
11701
|
+
this.element.bib.style.height = "";
|
|
11702
|
+
this.element.style.contain = "";
|
|
11750
11703
|
|
|
11751
11704
|
// reset the size that was mirroring `size` css-part
|
|
11752
|
-
const bibContent =
|
|
11705
|
+
const bibContent =
|
|
11706
|
+
this.element.bib.shadowRoot.querySelector(".container");
|
|
11753
11707
|
if (bibContent) {
|
|
11754
11708
|
bibContent.style.width = "";
|
|
11755
11709
|
bibContent.style.height = "";
|
|
@@ -11764,14 +11718,14 @@ class AuroFloatingUI {
|
|
|
11764
11718
|
}, 0);
|
|
11765
11719
|
}
|
|
11766
11720
|
|
|
11767
|
-
if (element.isPopoverVisible) {
|
|
11721
|
+
if (this.element.isPopoverVisible) {
|
|
11768
11722
|
this.lockScroll(true);
|
|
11769
11723
|
}
|
|
11770
11724
|
} else {
|
|
11771
|
-
element.bib.style.position = "";
|
|
11772
|
-
element.bib.removeAttribute("isfullscreen");
|
|
11773
|
-
element.isBibFullscreen = false;
|
|
11774
|
-
element.style.contain = "layout";
|
|
11725
|
+
this.element.bib.style.position = "";
|
|
11726
|
+
this.element.bib.removeAttribute("isfullscreen");
|
|
11727
|
+
this.element.isBibFullscreen = false;
|
|
11728
|
+
this.element.style.contain = "layout";
|
|
11775
11729
|
}
|
|
11776
11730
|
|
|
11777
11731
|
const isChanged = this.strategy && this.strategy !== value;
|
|
@@ -11789,21 +11743,16 @@ class AuroFloatingUI {
|
|
|
11789
11743
|
},
|
|
11790
11744
|
);
|
|
11791
11745
|
|
|
11792
|
-
element.dispatchEvent(event);
|
|
11746
|
+
this.element.dispatchEvent(event);
|
|
11793
11747
|
}
|
|
11794
11748
|
}
|
|
11795
11749
|
|
|
11796
11750
|
updateState() {
|
|
11797
|
-
const
|
|
11798
|
-
if (!element) {
|
|
11799
|
-
return;
|
|
11800
|
-
}
|
|
11801
|
-
|
|
11802
|
-
const isVisible = element.isPopoverVisible;
|
|
11751
|
+
const isVisible = this.element.isPopoverVisible;
|
|
11803
11752
|
if (!isVisible) {
|
|
11804
11753
|
this.cleanupHideHandlers();
|
|
11805
11754
|
try {
|
|
11806
|
-
element.cleanup?.();
|
|
11755
|
+
this.element.cleanup?.();
|
|
11807
11756
|
} catch (error) {
|
|
11808
11757
|
// Do nothing
|
|
11809
11758
|
}
|
|
@@ -11819,30 +11768,28 @@ class AuroFloatingUI {
|
|
|
11819
11768
|
* If not, and if the bib isn't in fullscreen mode with focus lost, it hides the bib.
|
|
11820
11769
|
*/
|
|
11821
11770
|
handleFocusLoss() {
|
|
11822
|
-
const element = this.element;
|
|
11823
|
-
if (!element?.bib) {
|
|
11824
|
-
return;
|
|
11825
|
-
}
|
|
11826
|
-
|
|
11827
11771
|
// if mouse is being pressed, skip and let click event to handle the action
|
|
11828
11772
|
if (AuroFloatingUI.isMousePressed) {
|
|
11829
11773
|
return;
|
|
11830
11774
|
}
|
|
11831
11775
|
|
|
11832
11776
|
if (
|
|
11833
|
-
element.noHideOnThisFocusLoss ||
|
|
11834
|
-
element.hasAttribute("noHideOnThisFocusLoss")
|
|
11777
|
+
this.element.noHideOnThisFocusLoss ||
|
|
11778
|
+
this.element.hasAttribute("noHideOnThisFocusLoss")
|
|
11835
11779
|
) {
|
|
11836
11780
|
return;
|
|
11837
11781
|
}
|
|
11838
11782
|
|
|
11839
11783
|
// if focus is still inside of trigger or bib, do not close
|
|
11840
|
-
if (
|
|
11784
|
+
if (
|
|
11785
|
+
this.element.matches(":focus") ||
|
|
11786
|
+
this.element.matches(":focus-within")
|
|
11787
|
+
) {
|
|
11841
11788
|
return;
|
|
11842
11789
|
}
|
|
11843
11790
|
|
|
11844
11791
|
// if fullscreen bib is in fullscreen mode, do not close
|
|
11845
|
-
if (element.bib.hasAttribute("isfullscreen")) {
|
|
11792
|
+
if (this.element.bib.hasAttribute("isfullscreen")) {
|
|
11846
11793
|
return;
|
|
11847
11794
|
}
|
|
11848
11795
|
|
|
@@ -11850,32 +11797,23 @@ class AuroFloatingUI {
|
|
|
11850
11797
|
}
|
|
11851
11798
|
|
|
11852
11799
|
setupHideHandlers() {
|
|
11853
|
-
if (!this.element) {
|
|
11854
|
-
return;
|
|
11855
|
-
}
|
|
11856
|
-
|
|
11857
11800
|
// Define handlers & store references
|
|
11858
11801
|
this.focusHandler = () => this.handleFocusLoss();
|
|
11859
11802
|
|
|
11860
11803
|
this.clickHandler = (evt) => {
|
|
11861
|
-
const element = this.element;
|
|
11862
|
-
if (!element?.bib) {
|
|
11863
|
-
return;
|
|
11864
|
-
}
|
|
11865
|
-
|
|
11866
11804
|
// When the bib is fullscreen (modal dialog), don't close on outside
|
|
11867
11805
|
// clicks. VoiceOver's synthetic click events inside a top-layer modal
|
|
11868
11806
|
// <dialog> may not include the bib in composedPath(), causing false
|
|
11869
11807
|
// positives. This mirrors the fullscreen guard in handleFocusLoss().
|
|
11870
|
-
if (element.bib.hasAttribute("isfullscreen")) {
|
|
11808
|
+
if (this.element.bib && this.element.bib.hasAttribute("isfullscreen")) {
|
|
11871
11809
|
return;
|
|
11872
11810
|
}
|
|
11873
11811
|
|
|
11874
11812
|
if (
|
|
11875
|
-
(!evt.composedPath().includes(element.trigger) &&
|
|
11876
|
-
!evt.composedPath().includes(element.bib)) ||
|
|
11877
|
-
(element.bib.backdrop &&
|
|
11878
|
-
evt.composedPath().includes(element.bib.backdrop))
|
|
11813
|
+
(!evt.composedPath().includes(this.element.trigger) &&
|
|
11814
|
+
!evt.composedPath().includes(this.element.bib)) ||
|
|
11815
|
+
(this.element.bib.backdrop &&
|
|
11816
|
+
evt.composedPath().includes(this.element.bib.backdrop))
|
|
11879
11817
|
) {
|
|
11880
11818
|
const existedVisibleFloatingUI =
|
|
11881
11819
|
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
@@ -11896,12 +11834,7 @@ class AuroFloatingUI {
|
|
|
11896
11834
|
|
|
11897
11835
|
// ESC key handler
|
|
11898
11836
|
this.keyDownHandler = (evt) => {
|
|
11899
|
-
|
|
11900
|
-
if (!element) {
|
|
11901
|
-
return;
|
|
11902
|
-
}
|
|
11903
|
-
|
|
11904
|
-
if (evt.key === "Escape" && element.isPopoverVisible) {
|
|
11837
|
+
if (evt.key === "Escape" && this.element.isPopoverVisible) {
|
|
11905
11838
|
const existedVisibleFloatingUI =
|
|
11906
11839
|
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
11907
11840
|
if (
|
|
@@ -11958,10 +11891,6 @@ class AuroFloatingUI {
|
|
|
11958
11891
|
}
|
|
11959
11892
|
|
|
11960
11893
|
updateCurrentExpandedDropdown() {
|
|
11961
|
-
if (!this.element) {
|
|
11962
|
-
return;
|
|
11963
|
-
}
|
|
11964
|
-
|
|
11965
11894
|
// Close any other dropdown that is already open
|
|
11966
11895
|
const existedVisibleFloatingUI =
|
|
11967
11896
|
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
@@ -11978,34 +11907,25 @@ class AuroFloatingUI {
|
|
|
11978
11907
|
}
|
|
11979
11908
|
|
|
11980
11909
|
showBib() {
|
|
11981
|
-
|
|
11982
|
-
if (!element) {
|
|
11983
|
-
return;
|
|
11984
|
-
}
|
|
11985
|
-
|
|
11986
|
-
if (!element.disabled && !this.showing) {
|
|
11910
|
+
if (!this.element.disabled && !this.showing) {
|
|
11987
11911
|
this.updateCurrentExpandedDropdown();
|
|
11988
|
-
element.triggerChevron?.setAttribute("data-expanded", true);
|
|
11912
|
+
this.element.triggerChevron?.setAttribute("data-expanded", true);
|
|
11989
11913
|
|
|
11990
11914
|
// prevent double showing: isPopovervisible gets first and showBib gets called later
|
|
11991
11915
|
if (!this.showing) {
|
|
11992
|
-
if (!element.modal) {
|
|
11916
|
+
if (!this.element.modal) {
|
|
11993
11917
|
this.setupHideHandlers();
|
|
11994
11918
|
}
|
|
11995
11919
|
this.showing = true;
|
|
11996
|
-
element.isPopoverVisible = true;
|
|
11920
|
+
this.element.isPopoverVisible = true;
|
|
11997
11921
|
this.position();
|
|
11998
11922
|
this.dispatchEventDropdownToggle();
|
|
11999
11923
|
}
|
|
12000
11924
|
|
|
12001
|
-
if (!element.bib || (!element.trigger && !element.parentNode)) {
|
|
12002
|
-
return;
|
|
12003
|
-
}
|
|
12004
|
-
|
|
12005
11925
|
// Setup auto update to handle resize and scroll
|
|
12006
|
-
element.cleanup = autoUpdate(
|
|
12007
|
-
element.trigger || element.parentNode,
|
|
12008
|
-
element.bib,
|
|
11926
|
+
this.element.cleanup = autoUpdate(
|
|
11927
|
+
this.element.trigger || this.element.parentNode,
|
|
11928
|
+
this.element.bib,
|
|
12009
11929
|
() => {
|
|
12010
11930
|
this.position();
|
|
12011
11931
|
},
|
|
@@ -12018,27 +11938,22 @@ class AuroFloatingUI {
|
|
|
12018
11938
|
* @param {String} eventType - The event type that triggered the hiding action.
|
|
12019
11939
|
*/
|
|
12020
11940
|
hideBib(eventType = "unknown") {
|
|
12021
|
-
|
|
12022
|
-
if (!element) {
|
|
12023
|
-
return;
|
|
12024
|
-
}
|
|
12025
|
-
|
|
12026
|
-
if (element.disabled) {
|
|
11941
|
+
if (this.element.disabled) {
|
|
12027
11942
|
return;
|
|
12028
11943
|
}
|
|
12029
11944
|
|
|
12030
11945
|
// noToggle dropdowns should not close when the trigger is clicked (the
|
|
12031
11946
|
// "toggle" behavior), but they CAN still close via other interactions like
|
|
12032
11947
|
// Escape key or focus loss.
|
|
12033
|
-
if (element.noToggle && eventType === "click") {
|
|
11948
|
+
if (this.element.noToggle && eventType === "click") {
|
|
12034
11949
|
return;
|
|
12035
11950
|
}
|
|
12036
11951
|
|
|
12037
11952
|
this.lockScroll(false);
|
|
12038
|
-
element.triggerChevron?.removeAttribute("data-expanded");
|
|
11953
|
+
this.element.triggerChevron?.removeAttribute("data-expanded");
|
|
12039
11954
|
|
|
12040
|
-
if (element.isPopoverVisible) {
|
|
12041
|
-
element.isPopoverVisible = false;
|
|
11955
|
+
if (this.element.isPopoverVisible) {
|
|
11956
|
+
this.element.isPopoverVisible = false;
|
|
12042
11957
|
}
|
|
12043
11958
|
if (this.showing) {
|
|
12044
11959
|
this.cleanupHideHandlers();
|
|
@@ -12058,11 +11973,6 @@ class AuroFloatingUI {
|
|
|
12058
11973
|
* @param {String} eventType - The event type that triggered the toggle action.
|
|
12059
11974
|
*/
|
|
12060
11975
|
dispatchEventDropdownToggle(eventType) {
|
|
12061
|
-
const element = this.element;
|
|
12062
|
-
if (!element) {
|
|
12063
|
-
return;
|
|
12064
|
-
}
|
|
12065
|
-
|
|
12066
11976
|
const event = new CustomEvent(
|
|
12067
11977
|
this.eventPrefix ? `${this.eventPrefix}-toggled` : "toggled",
|
|
12068
11978
|
{
|
|
@@ -12074,16 +11984,11 @@ class AuroFloatingUI {
|
|
|
12074
11984
|
},
|
|
12075
11985
|
);
|
|
12076
11986
|
|
|
12077
|
-
element.dispatchEvent(event);
|
|
11987
|
+
this.element.dispatchEvent(event);
|
|
12078
11988
|
}
|
|
12079
11989
|
|
|
12080
11990
|
handleClick() {
|
|
12081
|
-
|
|
12082
|
-
if (!element) {
|
|
12083
|
-
return;
|
|
12084
|
-
}
|
|
12085
|
-
|
|
12086
|
-
if (element.isPopoverVisible) {
|
|
11991
|
+
if (this.element.isPopoverVisible) {
|
|
12087
11992
|
this.hideBib("click");
|
|
12088
11993
|
} else {
|
|
12089
11994
|
this.showBib();
|
|
@@ -12094,66 +11999,63 @@ class AuroFloatingUI {
|
|
|
12094
11999
|
{
|
|
12095
12000
|
composed: true,
|
|
12096
12001
|
detail: {
|
|
12097
|
-
expanded: element.isPopoverVisible,
|
|
12002
|
+
expanded: this.element.isPopoverVisible,
|
|
12098
12003
|
},
|
|
12099
12004
|
},
|
|
12100
12005
|
);
|
|
12101
12006
|
|
|
12102
|
-
element.dispatchEvent(event);
|
|
12007
|
+
this.element.dispatchEvent(event);
|
|
12103
12008
|
}
|
|
12104
12009
|
|
|
12105
12010
|
handleEvent(event) {
|
|
12106
|
-
|
|
12107
|
-
|
|
12108
|
-
|
|
12109
|
-
|
|
12110
|
-
|
|
12111
|
-
|
|
12112
|
-
|
|
12113
|
-
|
|
12114
|
-
|
|
12115
|
-
|
|
12116
|
-
|
|
12117
|
-
|
|
12118
|
-
|
|
12119
|
-
|
|
12120
|
-
|
|
12121
|
-
event.preventDefault();
|
|
12122
|
-
this.handleClick();
|
|
12011
|
+
if (!this.element.disableEventShow) {
|
|
12012
|
+
switch (event.type) {
|
|
12013
|
+
case "keydown": {
|
|
12014
|
+
// Support both Enter and Space keys for accessibility
|
|
12015
|
+
// Space is included as it's expected behavior for interactive elements
|
|
12016
|
+
|
|
12017
|
+
const origin = event.composedPath()[0];
|
|
12018
|
+
if (
|
|
12019
|
+
event.key === "Enter" ||
|
|
12020
|
+
(event.key === " " && (!origin || origin.tagName !== "INPUT"))
|
|
12021
|
+
) {
|
|
12022
|
+
event.preventDefault();
|
|
12023
|
+
this.handleClick();
|
|
12024
|
+
}
|
|
12025
|
+
break;
|
|
12123
12026
|
}
|
|
12124
|
-
|
|
12027
|
+
case "mouseenter":
|
|
12028
|
+
if (this.element.hoverToggle) {
|
|
12029
|
+
this.showBib();
|
|
12030
|
+
}
|
|
12031
|
+
break;
|
|
12032
|
+
case "mouseleave":
|
|
12033
|
+
if (this.element.hoverToggle) {
|
|
12034
|
+
this.hideBib("mouseleave");
|
|
12035
|
+
}
|
|
12036
|
+
break;
|
|
12037
|
+
case "focus":
|
|
12038
|
+
if (this.element.focusShow) {
|
|
12039
|
+
/*
|
|
12040
|
+
This needs to better handle clicking that gives focus -
|
|
12041
|
+
currently it shows and then immediately hides the bib
|
|
12042
|
+
*/
|
|
12043
|
+
this.showBib();
|
|
12044
|
+
}
|
|
12045
|
+
break;
|
|
12046
|
+
case "blur":
|
|
12047
|
+
// send this task 100ms later queue to
|
|
12048
|
+
// wait a frame in case focus moves within the floating element/bib
|
|
12049
|
+
setTimeout(() => this.handleFocusLoss(), 0);
|
|
12050
|
+
break;
|
|
12051
|
+
case "click":
|
|
12052
|
+
if (document.activeElement === document.body) {
|
|
12053
|
+
event.currentTarget.focus();
|
|
12054
|
+
}
|
|
12055
|
+
this.handleClick();
|
|
12056
|
+
break;
|
|
12057
|
+
// Do nothing
|
|
12125
12058
|
}
|
|
12126
|
-
case "mouseenter":
|
|
12127
|
-
if (element.hoverToggle) {
|
|
12128
|
-
this.showBib();
|
|
12129
|
-
}
|
|
12130
|
-
break;
|
|
12131
|
-
case "mouseleave":
|
|
12132
|
-
if (element.hoverToggle) {
|
|
12133
|
-
this.hideBib("mouseleave");
|
|
12134
|
-
}
|
|
12135
|
-
break;
|
|
12136
|
-
case "focus":
|
|
12137
|
-
if (element.focusShow) {
|
|
12138
|
-
/*
|
|
12139
|
-
This needs to better handle clicking that gives focus -
|
|
12140
|
-
currently it shows and then immediately hides the bib
|
|
12141
|
-
*/
|
|
12142
|
-
this.showBib();
|
|
12143
|
-
}
|
|
12144
|
-
break;
|
|
12145
|
-
case "blur":
|
|
12146
|
-
// send this task 100ms later queue to
|
|
12147
|
-
// wait a frame in case focus moves within the floating element/bib
|
|
12148
|
-
setTimeout(() => this.handleFocusLoss(), 0);
|
|
12149
|
-
break;
|
|
12150
|
-
case "click":
|
|
12151
|
-
if (document.activeElement === document.body) {
|
|
12152
|
-
event.currentTarget.focus();
|
|
12153
|
-
}
|
|
12154
|
-
this.handleClick();
|
|
12155
|
-
break;
|
|
12156
|
-
// Do nothing
|
|
12157
12059
|
}
|
|
12158
12060
|
}
|
|
12159
12061
|
|
|
@@ -12164,11 +12066,6 @@ class AuroFloatingUI {
|
|
|
12164
12066
|
* This prevents the component itself from being focusable when the trigger element already handles focus.
|
|
12165
12067
|
*/
|
|
12166
12068
|
handleTriggerTabIndex() {
|
|
12167
|
-
const element = this.element;
|
|
12168
|
-
if (!element) {
|
|
12169
|
-
return;
|
|
12170
|
-
}
|
|
12171
|
-
|
|
12172
12069
|
const focusableElementSelectors = [
|
|
12173
12070
|
"a",
|
|
12174
12071
|
"button",
|
|
@@ -12181,7 +12078,7 @@ class AuroFloatingUI {
|
|
|
12181
12078
|
"auro-hyperlink",
|
|
12182
12079
|
];
|
|
12183
12080
|
|
|
12184
|
-
const triggerNode = element.querySelectorAll('[slot="trigger"]')[0];
|
|
12081
|
+
const triggerNode = this.element.querySelectorAll('[slot="trigger"]')[0];
|
|
12185
12082
|
if (!triggerNode) {
|
|
12186
12083
|
return;
|
|
12187
12084
|
}
|
|
@@ -12190,13 +12087,13 @@ class AuroFloatingUI {
|
|
|
12190
12087
|
focusableElementSelectors.forEach((selector) => {
|
|
12191
12088
|
// Check if the trigger node element is focusable
|
|
12192
12089
|
if (triggerNodeTagName === selector) {
|
|
12193
|
-
element.tabIndex = -1;
|
|
12090
|
+
this.element.tabIndex = -1;
|
|
12194
12091
|
return;
|
|
12195
12092
|
}
|
|
12196
12093
|
|
|
12197
12094
|
// Check if any child is focusable
|
|
12198
12095
|
if (triggerNode.querySelector(selector)) {
|
|
12199
|
-
element.tabIndex = -1;
|
|
12096
|
+
this.element.tabIndex = -1;
|
|
12200
12097
|
}
|
|
12201
12098
|
});
|
|
12202
12099
|
}
|
|
@@ -12206,18 +12103,13 @@ class AuroFloatingUI {
|
|
|
12206
12103
|
* @param {*} eventPrefix
|
|
12207
12104
|
*/
|
|
12208
12105
|
regenerateBibId() {
|
|
12209
|
-
|
|
12210
|
-
if (!element) {
|
|
12211
|
-
return;
|
|
12212
|
-
}
|
|
12213
|
-
|
|
12214
|
-
this.id = element.getAttribute("id");
|
|
12106
|
+
this.id = this.element.getAttribute("id");
|
|
12215
12107
|
if (!this.id) {
|
|
12216
12108
|
this.id = window.crypto.randomUUID();
|
|
12217
|
-
element.setAttribute("id", this.id);
|
|
12109
|
+
this.element.setAttribute("id", this.id);
|
|
12218
12110
|
}
|
|
12219
12111
|
|
|
12220
|
-
element.bib
|
|
12112
|
+
this.element.bib.setAttribute("id", `${this.id}-floater-bib`);
|
|
12221
12113
|
}
|
|
12222
12114
|
|
|
12223
12115
|
configure(elem, eventPrefix, enableKeyboardHandling = true) {
|
|
@@ -12229,69 +12121,67 @@ class AuroFloatingUI {
|
|
|
12229
12121
|
this.element = elem;
|
|
12230
12122
|
}
|
|
12231
12123
|
|
|
12232
|
-
|
|
12233
|
-
|
|
12234
|
-
return;
|
|
12124
|
+
if (this.behavior !== this.element.behavior) {
|
|
12125
|
+
this.behavior = this.element.behavior;
|
|
12235
12126
|
}
|
|
12236
12127
|
|
|
12237
|
-
if (this.
|
|
12238
|
-
this.behavior = element.behavior;
|
|
12239
|
-
}
|
|
12240
|
-
|
|
12241
|
-
if (element.trigger) {
|
|
12128
|
+
if (this.element.trigger) {
|
|
12242
12129
|
this.disconnect();
|
|
12243
12130
|
}
|
|
12244
|
-
element.trigger =
|
|
12245
|
-
element.triggerElement ||
|
|
12246
|
-
element.shadowRoot
|
|
12247
|
-
element.trigger;
|
|
12248
|
-
element.bib =
|
|
12249
|
-
|
|
12250
|
-
element.
|
|
12251
|
-
|
|
12131
|
+
this.element.trigger =
|
|
12132
|
+
this.element.triggerElement ||
|
|
12133
|
+
this.element.shadowRoot.querySelector("#trigger") ||
|
|
12134
|
+
this.element.trigger;
|
|
12135
|
+
this.element.bib =
|
|
12136
|
+
this.element.shadowRoot.querySelector("#bib") || this.element.bib;
|
|
12137
|
+
this.element.bibSizer = this.element.shadowRoot.querySelector("#bibSizer");
|
|
12138
|
+
this.element.triggerChevron =
|
|
12139
|
+
this.element.shadowRoot.querySelector("#showStateIcon");
|
|
12252
12140
|
|
|
12253
|
-
if (element.floaterConfig) {
|
|
12254
|
-
element.hoverToggle = element.floaterConfig.hoverToggle;
|
|
12141
|
+
if (this.element.floaterConfig) {
|
|
12142
|
+
this.element.hoverToggle = this.element.floaterConfig.hoverToggle;
|
|
12255
12143
|
}
|
|
12256
12144
|
|
|
12257
12145
|
this.regenerateBibId();
|
|
12258
12146
|
this.handleTriggerTabIndex();
|
|
12259
12147
|
|
|
12260
12148
|
this.handleEvent = this.handleEvent.bind(this);
|
|
12261
|
-
if (element.trigger) {
|
|
12149
|
+
if (this.element.trigger) {
|
|
12262
12150
|
if (this.enableKeyboardHandling) {
|
|
12263
|
-
element.trigger.addEventListener("keydown", this.handleEvent);
|
|
12151
|
+
this.element.trigger.addEventListener("keydown", this.handleEvent);
|
|
12264
12152
|
}
|
|
12265
|
-
element.trigger.addEventListener("click", this.handleEvent);
|
|
12266
|
-
element.trigger.addEventListener("mouseenter", this.handleEvent);
|
|
12267
|
-
element.trigger.addEventListener("mouseleave", this.handleEvent);
|
|
12268
|
-
element.trigger.addEventListener("focus", this.handleEvent);
|
|
12269
|
-
element.trigger.addEventListener("blur", this.handleEvent);
|
|
12153
|
+
this.element.trigger.addEventListener("click", this.handleEvent);
|
|
12154
|
+
this.element.trigger.addEventListener("mouseenter", this.handleEvent);
|
|
12155
|
+
this.element.trigger.addEventListener("mouseleave", this.handleEvent);
|
|
12156
|
+
this.element.trigger.addEventListener("focus", this.handleEvent);
|
|
12157
|
+
this.element.trigger.addEventListener("blur", this.handleEvent);
|
|
12270
12158
|
}
|
|
12271
12159
|
}
|
|
12272
12160
|
|
|
12273
12161
|
disconnect() {
|
|
12274
12162
|
this.cleanupHideHandlers();
|
|
12163
|
+
if (this.element) {
|
|
12164
|
+
this.element.cleanup?.();
|
|
12275
12165
|
|
|
12276
|
-
|
|
12277
|
-
|
|
12278
|
-
|
|
12279
|
-
}
|
|
12280
|
-
|
|
12281
|
-
element.cleanup?.();
|
|
12282
|
-
|
|
12283
|
-
if (element.bib && element.shadowRoot) {
|
|
12284
|
-
element.shadowRoot.append(element.bib);
|
|
12285
|
-
}
|
|
12166
|
+
if (this.element.bib) {
|
|
12167
|
+
this.element.shadowRoot.append(this.element.bib);
|
|
12168
|
+
}
|
|
12286
12169
|
|
|
12287
|
-
|
|
12288
|
-
|
|
12289
|
-
|
|
12290
|
-
|
|
12291
|
-
|
|
12292
|
-
|
|
12293
|
-
|
|
12294
|
-
|
|
12170
|
+
// Remove event & keyboard listeners
|
|
12171
|
+
if (this.element?.trigger) {
|
|
12172
|
+
this.element.trigger.removeEventListener("keydown", this.handleEvent);
|
|
12173
|
+
this.element.trigger.removeEventListener("click", this.handleEvent);
|
|
12174
|
+
this.element.trigger.removeEventListener(
|
|
12175
|
+
"mouseenter",
|
|
12176
|
+
this.handleEvent,
|
|
12177
|
+
);
|
|
12178
|
+
this.element.trigger.removeEventListener(
|
|
12179
|
+
"mouseleave",
|
|
12180
|
+
this.handleEvent,
|
|
12181
|
+
);
|
|
12182
|
+
this.element.trigger.removeEventListener("focus", this.handleEvent);
|
|
12183
|
+
this.element.trigger.removeEventListener("blur", this.handleEvent);
|
|
12184
|
+
}
|
|
12295
12185
|
}
|
|
12296
12186
|
}
|
|
12297
12187
|
}
|
|
@@ -13419,7 +13309,7 @@ let AuroHelpText$2 = class AuroHelpText extends LitElement {
|
|
|
13419
13309
|
}
|
|
13420
13310
|
};
|
|
13421
13311
|
|
|
13422
|
-
var formkitVersion$1 = '
|
|
13312
|
+
var formkitVersion$1 = '202604071525';
|
|
13423
13313
|
|
|
13424
13314
|
let AuroElement$2 = class AuroElement extends LitElement {
|
|
13425
13315
|
static get properties() {
|
|
@@ -21176,7 +21066,7 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
|
|
|
21176
21066
|
}
|
|
21177
21067
|
};
|
|
21178
21068
|
|
|
21179
|
-
var formkitVersion = '
|
|
21069
|
+
var formkitVersion = '202604071525';
|
|
21180
21070
|
|
|
21181
21071
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
21182
21072
|
// See LICENSE in the project root for license information.
|