@aurodesignsystem-dev/auro-formkit 0.0.0-pr1422.2 → 0.0.0-pr1424.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +2 -2
- package/README.md +183 -133
- 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 -276
- package/components/combobox/demo/index.min.js +165 -276
- package/components/combobox/dist/index.js +165 -276
- package/components/combobox/dist/registered.js +165 -276
- package/components/counter/demo/api.min.js +164 -275
- package/components/counter/demo/index.min.js +164 -275
- package/components/counter/dist/index.js +164 -275
- package/components/counter/dist/registered.js +164 -275
- package/components/datepicker/demo/api.min.js +165 -276
- package/components/datepicker/demo/index.min.js +165 -276
- package/components/datepicker/dist/index.js +165 -276
- package/components/datepicker/dist/registered.js +165 -276
- package/components/dropdown/demo/api.min.js +164 -275
- package/components/dropdown/demo/index.min.js +164 -275
- package/components/dropdown/dist/index.js +164 -275
- package/components/dropdown/dist/registered.js +164 -275
- package/components/form/demo/api.md +460 -76
- package/components/form/demo/api.min.js +661 -1105
- package/components/form/demo/index.min.js +661 -1105
- 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 -275
- package/components/select/demo/index.min.js +164 -275
- package/components/select/dist/index.js +164 -275
- package/components/select/dist/registered.js +164 -275
- package/package.json +3 -3
|
@@ -9242,7 +9242,7 @@ class AuroBibtemplate extends LitElement {
|
|
|
9242
9242
|
}
|
|
9243
9243
|
}
|
|
9244
9244
|
|
|
9245
|
-
var formkitVersion$2 = '
|
|
9245
|
+
var formkitVersion$2 = '202604072118';
|
|
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 "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,33 +11797,23 @@ class AuroFloatingUI {
|
|
|
11850
11797
|
}
|
|
11851
11798
|
|
|
11852
11799
|
setupHideHandlers() {
|
|
11853
|
-
const element = this.element;
|
|
11854
|
-
if (!element) {
|
|
11855
|
-
return;
|
|
11856
|
-
}
|
|
11857
|
-
|
|
11858
11800
|
// Define handlers & store references
|
|
11859
11801
|
this.focusHandler = () => this.handleFocusLoss();
|
|
11860
11802
|
|
|
11861
11803
|
this.clickHandler = (evt) => {
|
|
11862
|
-
const element = this.element;
|
|
11863
|
-
if (!element?.bib) {
|
|
11864
|
-
return;
|
|
11865
|
-
}
|
|
11866
|
-
|
|
11867
11804
|
// When the bib is fullscreen (modal dialog), don't close on outside
|
|
11868
11805
|
// clicks. VoiceOver's synthetic click events inside a top-layer modal
|
|
11869
11806
|
// <dialog> may not include the bib in composedPath(), causing false
|
|
11870
11807
|
// positives. This mirrors the fullscreen guard in handleFocusLoss().
|
|
11871
|
-
if (element.bib.hasAttribute("isfullscreen")) {
|
|
11808
|
+
if (this.element.bib && this.element.bib.hasAttribute("isfullscreen")) {
|
|
11872
11809
|
return;
|
|
11873
11810
|
}
|
|
11874
11811
|
|
|
11875
11812
|
if (
|
|
11876
|
-
(!evt.composedPath().includes(element.trigger) &&
|
|
11877
|
-
!evt.composedPath().includes(element.bib)) ||
|
|
11878
|
-
(element.bib.backdrop &&
|
|
11879
|
-
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))
|
|
11880
11817
|
) {
|
|
11881
11818
|
const existedVisibleFloatingUI =
|
|
11882
11819
|
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
@@ -11897,12 +11834,7 @@ class AuroFloatingUI {
|
|
|
11897
11834
|
|
|
11898
11835
|
// ESC key handler
|
|
11899
11836
|
this.keyDownHandler = (evt) => {
|
|
11900
|
-
|
|
11901
|
-
if (!element) {
|
|
11902
|
-
return;
|
|
11903
|
-
}
|
|
11904
|
-
|
|
11905
|
-
if (evt.key === "Escape" && element.isPopoverVisible) {
|
|
11837
|
+
if (evt.key === "Escape" && this.element.isPopoverVisible) {
|
|
11906
11838
|
const existedVisibleFloatingUI =
|
|
11907
11839
|
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
11908
11840
|
if (
|
|
@@ -11959,10 +11891,6 @@ class AuroFloatingUI {
|
|
|
11959
11891
|
}
|
|
11960
11892
|
|
|
11961
11893
|
updateCurrentExpandedDropdown() {
|
|
11962
|
-
if (!this.element) {
|
|
11963
|
-
return;
|
|
11964
|
-
}
|
|
11965
|
-
|
|
11966
11894
|
// Close any other dropdown that is already open
|
|
11967
11895
|
const existedVisibleFloatingUI =
|
|
11968
11896
|
document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
|
|
@@ -11979,34 +11907,25 @@ class AuroFloatingUI {
|
|
|
11979
11907
|
}
|
|
11980
11908
|
|
|
11981
11909
|
showBib() {
|
|
11982
|
-
|
|
11983
|
-
if (!element) {
|
|
11984
|
-
return;
|
|
11985
|
-
}
|
|
11986
|
-
|
|
11987
|
-
if (!element.bib || (!element.trigger && !element.parentNode)) {
|
|
11988
|
-
return;
|
|
11989
|
-
}
|
|
11990
|
-
|
|
11991
|
-
if (!element.disabled && !this.showing) {
|
|
11910
|
+
if (!this.element.disabled && !this.showing) {
|
|
11992
11911
|
this.updateCurrentExpandedDropdown();
|
|
11993
|
-
element.triggerChevron?.setAttribute("data-expanded", true);
|
|
11912
|
+
this.element.triggerChevron?.setAttribute("data-expanded", true);
|
|
11994
11913
|
|
|
11995
11914
|
// prevent double showing: isPopovervisible gets first and showBib gets called later
|
|
11996
11915
|
if (!this.showing) {
|
|
11997
|
-
if (!element.modal) {
|
|
11916
|
+
if (!this.element.modal) {
|
|
11998
11917
|
this.setupHideHandlers();
|
|
11999
11918
|
}
|
|
12000
11919
|
this.showing = true;
|
|
12001
|
-
element.isPopoverVisible = true;
|
|
11920
|
+
this.element.isPopoverVisible = true;
|
|
12002
11921
|
this.position();
|
|
12003
11922
|
this.dispatchEventDropdownToggle();
|
|
12004
11923
|
}
|
|
12005
11924
|
|
|
12006
11925
|
// Setup auto update to handle resize and scroll
|
|
12007
|
-
element.cleanup = autoUpdate(
|
|
12008
|
-
element.trigger || element.parentNode,
|
|
12009
|
-
element.bib,
|
|
11926
|
+
this.element.cleanup = autoUpdate(
|
|
11927
|
+
this.element.trigger || this.element.parentNode,
|
|
11928
|
+
this.element.bib,
|
|
12010
11929
|
() => {
|
|
12011
11930
|
this.position();
|
|
12012
11931
|
},
|
|
@@ -12019,27 +11938,22 @@ class AuroFloatingUI {
|
|
|
12019
11938
|
* @param {String} eventType - The event type that triggered the hiding action.
|
|
12020
11939
|
*/
|
|
12021
11940
|
hideBib(eventType = "unknown") {
|
|
12022
|
-
|
|
12023
|
-
if (!element) {
|
|
12024
|
-
return;
|
|
12025
|
-
}
|
|
12026
|
-
|
|
12027
|
-
if (element.disabled) {
|
|
11941
|
+
if (this.element.disabled) {
|
|
12028
11942
|
return;
|
|
12029
11943
|
}
|
|
12030
11944
|
|
|
12031
11945
|
// noToggle dropdowns should not close when the trigger is clicked (the
|
|
12032
11946
|
// "toggle" behavior), but they CAN still close via other interactions like
|
|
12033
11947
|
// Escape key or focus loss.
|
|
12034
|
-
if (element.noToggle && eventType === "click") {
|
|
11948
|
+
if (this.element.noToggle && eventType === "click") {
|
|
12035
11949
|
return;
|
|
12036
11950
|
}
|
|
12037
11951
|
|
|
12038
11952
|
this.lockScroll(false);
|
|
12039
|
-
element.triggerChevron?.removeAttribute("data-expanded");
|
|
11953
|
+
this.element.triggerChevron?.removeAttribute("data-expanded");
|
|
12040
11954
|
|
|
12041
|
-
if (element.isPopoverVisible) {
|
|
12042
|
-
element.isPopoverVisible = false;
|
|
11955
|
+
if (this.element.isPopoverVisible) {
|
|
11956
|
+
this.element.isPopoverVisible = false;
|
|
12043
11957
|
}
|
|
12044
11958
|
if (this.showing) {
|
|
12045
11959
|
this.cleanupHideHandlers();
|
|
@@ -12059,11 +11973,6 @@ class AuroFloatingUI {
|
|
|
12059
11973
|
* @param {String} eventType - The event type that triggered the toggle action.
|
|
12060
11974
|
*/
|
|
12061
11975
|
dispatchEventDropdownToggle(eventType) {
|
|
12062
|
-
const element = this.element;
|
|
12063
|
-
if (!element) {
|
|
12064
|
-
return;
|
|
12065
|
-
}
|
|
12066
|
-
|
|
12067
11976
|
const event = new CustomEvent(
|
|
12068
11977
|
this.eventPrefix ? `${this.eventPrefix}-toggled` : "toggled",
|
|
12069
11978
|
{
|
|
@@ -12075,16 +11984,11 @@ class AuroFloatingUI {
|
|
|
12075
11984
|
},
|
|
12076
11985
|
);
|
|
12077
11986
|
|
|
12078
|
-
element.dispatchEvent(event);
|
|
11987
|
+
this.element.dispatchEvent(event);
|
|
12079
11988
|
}
|
|
12080
11989
|
|
|
12081
11990
|
handleClick() {
|
|
12082
|
-
|
|
12083
|
-
if (!element) {
|
|
12084
|
-
return;
|
|
12085
|
-
}
|
|
12086
|
-
|
|
12087
|
-
if (element.isPopoverVisible) {
|
|
11991
|
+
if (this.element.isPopoverVisible) {
|
|
12088
11992
|
this.hideBib("click");
|
|
12089
11993
|
} else {
|
|
12090
11994
|
this.showBib();
|
|
@@ -12095,66 +11999,63 @@ class AuroFloatingUI {
|
|
|
12095
11999
|
{
|
|
12096
12000
|
composed: true,
|
|
12097
12001
|
detail: {
|
|
12098
|
-
expanded: element.isPopoverVisible,
|
|
12002
|
+
expanded: this.element.isPopoverVisible,
|
|
12099
12003
|
},
|
|
12100
12004
|
},
|
|
12101
12005
|
);
|
|
12102
12006
|
|
|
12103
|
-
element.dispatchEvent(event);
|
|
12007
|
+
this.element.dispatchEvent(event);
|
|
12104
12008
|
}
|
|
12105
12009
|
|
|
12106
12010
|
handleEvent(event) {
|
|
12107
|
-
|
|
12108
|
-
|
|
12109
|
-
|
|
12110
|
-
|
|
12111
|
-
|
|
12112
|
-
|
|
12113
|
-
|
|
12114
|
-
|
|
12115
|
-
|
|
12116
|
-
|
|
12117
|
-
|
|
12118
|
-
|
|
12119
|
-
|
|
12120
|
-
|
|
12121
|
-
|
|
12122
|
-
event.preventDefault();
|
|
12123
|
-
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;
|
|
12124
12026
|
}
|
|
12125
|
-
|
|
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
|
|
12126
12058
|
}
|
|
12127
|
-
case "mouseenter":
|
|
12128
|
-
if (element.hoverToggle) {
|
|
12129
|
-
this.showBib();
|
|
12130
|
-
}
|
|
12131
|
-
break;
|
|
12132
|
-
case "mouseleave":
|
|
12133
|
-
if (element.hoverToggle) {
|
|
12134
|
-
this.hideBib("mouseleave");
|
|
12135
|
-
}
|
|
12136
|
-
break;
|
|
12137
|
-
case "focus":
|
|
12138
|
-
if (element.focusShow) {
|
|
12139
|
-
/*
|
|
12140
|
-
This needs to better handle clicking that gives focus -
|
|
12141
|
-
currently it shows and then immediately hides the bib
|
|
12142
|
-
*/
|
|
12143
|
-
this.showBib();
|
|
12144
|
-
}
|
|
12145
|
-
break;
|
|
12146
|
-
case "blur":
|
|
12147
|
-
// send this task 100ms later queue to
|
|
12148
|
-
// wait a frame in case focus moves within the floating element/bib
|
|
12149
|
-
setTimeout(() => this.handleFocusLoss(), 0);
|
|
12150
|
-
break;
|
|
12151
|
-
case "click":
|
|
12152
|
-
if (document.activeElement === document.body) {
|
|
12153
|
-
event.currentTarget.focus();
|
|
12154
|
-
}
|
|
12155
|
-
this.handleClick();
|
|
12156
|
-
break;
|
|
12157
|
-
// Do nothing
|
|
12158
12059
|
}
|
|
12159
12060
|
}
|
|
12160
12061
|
|
|
@@ -12165,11 +12066,6 @@ class AuroFloatingUI {
|
|
|
12165
12066
|
* This prevents the component itself from being focusable when the trigger element already handles focus.
|
|
12166
12067
|
*/
|
|
12167
12068
|
handleTriggerTabIndex() {
|
|
12168
|
-
const element = this.element;
|
|
12169
|
-
if (!element) {
|
|
12170
|
-
return;
|
|
12171
|
-
}
|
|
12172
|
-
|
|
12173
12069
|
const focusableElementSelectors = [
|
|
12174
12070
|
"a",
|
|
12175
12071
|
"button",
|
|
@@ -12182,7 +12078,7 @@ class AuroFloatingUI {
|
|
|
12182
12078
|
"auro-hyperlink",
|
|
12183
12079
|
];
|
|
12184
12080
|
|
|
12185
|
-
const triggerNode = element.querySelectorAll('[slot="trigger"]')[0];
|
|
12081
|
+
const triggerNode = this.element.querySelectorAll('[slot="trigger"]')[0];
|
|
12186
12082
|
if (!triggerNode) {
|
|
12187
12083
|
return;
|
|
12188
12084
|
}
|
|
@@ -12191,13 +12087,13 @@ class AuroFloatingUI {
|
|
|
12191
12087
|
focusableElementSelectors.forEach((selector) => {
|
|
12192
12088
|
// Check if the trigger node element is focusable
|
|
12193
12089
|
if (triggerNodeTagName === selector) {
|
|
12194
|
-
element.tabIndex = -1;
|
|
12090
|
+
this.element.tabIndex = -1;
|
|
12195
12091
|
return;
|
|
12196
12092
|
}
|
|
12197
12093
|
|
|
12198
12094
|
// Check if any child is focusable
|
|
12199
12095
|
if (triggerNode.querySelector(selector)) {
|
|
12200
|
-
element.tabIndex = -1;
|
|
12096
|
+
this.element.tabIndex = -1;
|
|
12201
12097
|
}
|
|
12202
12098
|
});
|
|
12203
12099
|
}
|
|
@@ -12207,18 +12103,13 @@ class AuroFloatingUI {
|
|
|
12207
12103
|
* @param {*} eventPrefix
|
|
12208
12104
|
*/
|
|
12209
12105
|
regenerateBibId() {
|
|
12210
|
-
|
|
12211
|
-
if (!element) {
|
|
12212
|
-
return;
|
|
12213
|
-
}
|
|
12214
|
-
|
|
12215
|
-
this.id = element.getAttribute("id");
|
|
12106
|
+
this.id = this.element.getAttribute("id");
|
|
12216
12107
|
if (!this.id) {
|
|
12217
12108
|
this.id = window.crypto.randomUUID();
|
|
12218
|
-
element.setAttribute("id", this.id);
|
|
12109
|
+
this.element.setAttribute("id", this.id);
|
|
12219
12110
|
}
|
|
12220
12111
|
|
|
12221
|
-
element.bib
|
|
12112
|
+
this.element.bib.setAttribute("id", `${this.id}-floater-bib`);
|
|
12222
12113
|
}
|
|
12223
12114
|
|
|
12224
12115
|
configure(elem, eventPrefix, enableKeyboardHandling = true) {
|
|
@@ -12230,69 +12121,67 @@ class AuroFloatingUI {
|
|
|
12230
12121
|
this.element = elem;
|
|
12231
12122
|
}
|
|
12232
12123
|
|
|
12233
|
-
|
|
12234
|
-
|
|
12235
|
-
return;
|
|
12124
|
+
if (this.behavior !== this.element.behavior) {
|
|
12125
|
+
this.behavior = this.element.behavior;
|
|
12236
12126
|
}
|
|
12237
12127
|
|
|
12238
|
-
if (this.
|
|
12239
|
-
this.behavior = element.behavior;
|
|
12240
|
-
}
|
|
12241
|
-
|
|
12242
|
-
if (element.trigger) {
|
|
12128
|
+
if (this.element.trigger) {
|
|
12243
12129
|
this.disconnect();
|
|
12244
12130
|
}
|
|
12245
|
-
element.trigger =
|
|
12246
|
-
element.triggerElement ||
|
|
12247
|
-
element.shadowRoot
|
|
12248
|
-
element.trigger;
|
|
12249
|
-
element.bib =
|
|
12250
|
-
|
|
12251
|
-
element.
|
|
12252
|
-
|
|
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");
|
|
12253
12140
|
|
|
12254
|
-
if (element.floaterConfig) {
|
|
12255
|
-
element.hoverToggle = element.floaterConfig.hoverToggle;
|
|
12141
|
+
if (this.element.floaterConfig) {
|
|
12142
|
+
this.element.hoverToggle = this.element.floaterConfig.hoverToggle;
|
|
12256
12143
|
}
|
|
12257
12144
|
|
|
12258
12145
|
this.regenerateBibId();
|
|
12259
12146
|
this.handleTriggerTabIndex();
|
|
12260
12147
|
|
|
12261
12148
|
this.handleEvent = this.handleEvent.bind(this);
|
|
12262
|
-
if (element.trigger) {
|
|
12149
|
+
if (this.element.trigger) {
|
|
12263
12150
|
if (this.enableKeyboardHandling) {
|
|
12264
|
-
element.trigger.addEventListener("keydown", this.handleEvent);
|
|
12151
|
+
this.element.trigger.addEventListener("keydown", this.handleEvent);
|
|
12265
12152
|
}
|
|
12266
|
-
element.trigger.addEventListener("click", this.handleEvent);
|
|
12267
|
-
element.trigger.addEventListener("mouseenter", this.handleEvent);
|
|
12268
|
-
element.trigger.addEventListener("mouseleave", this.handleEvent);
|
|
12269
|
-
element.trigger.addEventListener("focus", this.handleEvent);
|
|
12270
|
-
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);
|
|
12271
12158
|
}
|
|
12272
12159
|
}
|
|
12273
12160
|
|
|
12274
12161
|
disconnect() {
|
|
12275
12162
|
this.cleanupHideHandlers();
|
|
12163
|
+
if (this.element) {
|
|
12164
|
+
this.element.cleanup?.();
|
|
12276
12165
|
|
|
12277
|
-
|
|
12278
|
-
|
|
12279
|
-
|
|
12280
|
-
}
|
|
12281
|
-
|
|
12282
|
-
element.cleanup?.();
|
|
12283
|
-
|
|
12284
|
-
if (element.bib && element.shadowRoot) {
|
|
12285
|
-
element.shadowRoot.append(element.bib);
|
|
12286
|
-
}
|
|
12166
|
+
if (this.element.bib) {
|
|
12167
|
+
this.element.shadowRoot.append(this.element.bib);
|
|
12168
|
+
}
|
|
12287
12169
|
|
|
12288
|
-
|
|
12289
|
-
|
|
12290
|
-
|
|
12291
|
-
|
|
12292
|
-
|
|
12293
|
-
|
|
12294
|
-
|
|
12295
|
-
|
|
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
|
+
}
|
|
12296
12185
|
}
|
|
12297
12186
|
}
|
|
12298
12187
|
}
|
|
@@ -13420,7 +13309,7 @@ let AuroHelpText$2 = class AuroHelpText extends LitElement {
|
|
|
13420
13309
|
}
|
|
13421
13310
|
};
|
|
13422
13311
|
|
|
13423
|
-
var formkitVersion$1 = '
|
|
13312
|
+
var formkitVersion$1 = '202604072118';
|
|
13424
13313
|
|
|
13425
13314
|
let AuroElement$2 = class AuroElement extends LitElement {
|
|
13426
13315
|
static get properties() {
|
|
@@ -21177,7 +21066,7 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
|
|
|
21177
21066
|
}
|
|
21178
21067
|
};
|
|
21179
21068
|
|
|
21180
|
-
var formkitVersion = '
|
|
21069
|
+
var formkitVersion = '202604072118';
|
|
21181
21070
|
|
|
21182
21071
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
21183
21072
|
// See LICENSE in the project root for license information.
|