@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.
Files changed (38) hide show
  1. package/CHANGELOG.md +2 -2
  2. package/README.md +183 -133
  3. package/components/checkbox/demo/api.min.js +1 -1
  4. package/components/checkbox/demo/index.min.js +1 -1
  5. package/components/checkbox/dist/index.js +1 -1
  6. package/components/checkbox/dist/registered.js +1 -1
  7. package/components/combobox/demo/api.min.js +165 -276
  8. package/components/combobox/demo/index.min.js +165 -276
  9. package/components/combobox/dist/index.js +165 -276
  10. package/components/combobox/dist/registered.js +165 -276
  11. package/components/counter/demo/api.min.js +164 -275
  12. package/components/counter/demo/index.min.js +164 -275
  13. package/components/counter/dist/index.js +164 -275
  14. package/components/counter/dist/registered.js +164 -275
  15. package/components/datepicker/demo/api.min.js +165 -276
  16. package/components/datepicker/demo/index.min.js +165 -276
  17. package/components/datepicker/dist/index.js +165 -276
  18. package/components/datepicker/dist/registered.js +165 -276
  19. package/components/dropdown/demo/api.min.js +164 -275
  20. package/components/dropdown/demo/index.min.js +164 -275
  21. package/components/dropdown/dist/index.js +164 -275
  22. package/components/dropdown/dist/registered.js +164 -275
  23. package/components/form/demo/api.md +460 -76
  24. package/components/form/demo/api.min.js +661 -1105
  25. package/components/form/demo/index.min.js +661 -1105
  26. package/components/input/demo/api.min.js +1 -1
  27. package/components/input/demo/index.min.js +1 -1
  28. package/components/input/dist/index.js +1 -1
  29. package/components/input/dist/registered.js +1 -1
  30. package/components/radio/demo/api.min.js +1 -1
  31. package/components/radio/demo/index.min.js +1 -1
  32. package/components/radio/dist/index.js +1 -1
  33. package/components/radio/dist/registered.js +1 -1
  34. package/components/select/demo/api.min.js +164 -275
  35. package/components/select/demo/index.min.js +164 -275
  36. package/components/select/dist/index.js +164 -275
  37. package/components/select/dist/registered.js +164 -275
  38. package/package.json +3 -3
@@ -9290,7 +9290,7 @@ class AuroBibtemplate extends i$1 {
9290
9290
  }
9291
9291
  }
9292
9292
 
9293
- var formkitVersion$2 = '202604071818';
9293
+ var formkitVersion$2 = '202604072118';
9294
9294
 
9295
9295
  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=i$5`${s$5(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$4 = 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$3=i$3`: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}
9296
9296
  `,u$6=i$3`.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}}
@@ -11624,19 +11624,11 @@ class AuroFloatingUI {
11624
11624
  * This ensures that the bib content has the same dimensions as the sizer element.
11625
11625
  */
11626
11626
  mirrorSize() {
11627
- const element = this.element;
11628
- if (!element) {
11629
- return;
11630
- }
11631
-
11632
11627
  // mirror the boxsize from bibSizer
11633
- if (element.bibSizer && element.matchWidth && element.bib?.shadowRoot) {
11634
- const sizerStyle = window.getComputedStyle(element.bibSizer);
11635
- const bibContent = element.bib.shadowRoot.querySelector(".container");
11636
- if (!bibContent) {
11637
- return;
11638
- }
11639
-
11628
+ if (this.element.bibSizer && this.element.matchWidth) {
11629
+ const sizerStyle = window.getComputedStyle(this.element.bibSizer);
11630
+ const bibContent =
11631
+ this.element.bib.shadowRoot.querySelector(".container");
11640
11632
  if (sizerStyle.width !== "0px") {
11641
11633
  bibContent.style.width = sizerStyle.width;
11642
11634
  }
@@ -11658,14 +11650,9 @@ class AuroFloatingUI {
11658
11650
  * @returns {String} The positioning strategy, one of 'fullscreen', 'floating', 'cover'.
11659
11651
  */
11660
11652
  getPositioningStrategy() {
11661
- const element = this.element;
11662
- if (!element) {
11663
- return "floating";
11664
- }
11665
-
11666
11653
  const breakpoint =
11667
- element.bib?.mobileFullscreenBreakpoint ||
11668
- element.floaterConfig?.fullscreenBreakpoint;
11654
+ this.element.bib.mobileFullscreenBreakpoint ||
11655
+ this.element.floaterConfig?.fullscreenBreakpoint;
11669
11656
  switch (this.behavior) {
11670
11657
  case "tooltip":
11671
11658
  return "floating";
@@ -11676,9 +11663,9 @@ class AuroFloatingUI {
11676
11663
  `(max-width: ${breakpoint})`,
11677
11664
  ).matches;
11678
11665
 
11679
- element.expanded = smallerThanBreakpoint;
11666
+ this.element.expanded = smallerThanBreakpoint;
11680
11667
  }
11681
- if (element.nested) {
11668
+ if (this.element.nested) {
11682
11669
  return "cover";
11683
11670
  }
11684
11671
  return "fullscreen";
@@ -11708,65 +11695,42 @@ class AuroFloatingUI {
11708
11695
  * and applies the calculated position to the bib's style.
11709
11696
  */
11710
11697
  position() {
11711
- const element = this.element;
11712
- if (!element) {
11713
- return;
11714
- }
11715
-
11716
11698
  const strategy = this.getPositioningStrategy();
11717
11699
  this.configureBibStrategy(strategy);
11718
11700
 
11719
11701
  if (strategy === "floating") {
11720
- if (!element.trigger || !element.bib) {
11721
- return;
11722
- }
11723
-
11724
11702
  this.mirrorSize();
11725
11703
  // Define the middlware for the floater configuration
11726
11704
  const middleware = [
11727
- offset(element.floaterConfig?.offset || 0),
11728
- ...(element.floaterConfig?.shift ? [shift()] : []), // Add shift middleware if shift is enabled.
11729
- ...(element.floaterConfig?.flip ? [flip()] : []), // Add flip middleware if flip is enabled.
11730
- ...(element.floaterConfig?.autoPlacement ? [autoPlacement()] : []), // Add autoPlacement middleware if autoPlacement is enabled.
11705
+ offset(this.element.floaterConfig?.offset || 0),
11706
+ ...(this.element.floaterConfig?.shift ? [shift()] : []), // Add shift middleware if shift is enabled.
11707
+ ...(this.element.floaterConfig?.flip ? [flip()] : []), // Add flip middleware if flip is enabled.
11708
+ ...(this.element.floaterConfig?.autoPlacement ? [autoPlacement()] : []), // Add autoPlacement middleware if autoPlacement is enabled.
11731
11709
  ];
11732
11710
 
11733
11711
  // Compute the position of the bib
11734
- computePosition(element.trigger, element.bib, {
11735
- strategy: element.floaterConfig?.strategy || "fixed",
11736
- placement: element.floaterConfig?.placement,
11712
+ computePosition(this.element.trigger, this.element.bib, {
11713
+ strategy: this.element.floaterConfig?.strategy || "fixed",
11714
+ placement: this.element.floaterConfig?.placement,
11737
11715
  middleware: middleware || [],
11738
11716
  }).then(({ x, y }) => {
11739
11717
  // eslint-disable-line id-length
11740
- const currentElement = this.element;
11741
- if (!currentElement?.bib) {
11742
- return;
11743
- }
11744
-
11745
- Object.assign(currentElement.bib.style, {
11718
+ Object.assign(this.element.bib.style, {
11746
11719
  left: `${x}px`,
11747
11720
  top: `${y}px`,
11748
11721
  });
11749
11722
  });
11750
11723
  } else if (strategy === "cover") {
11751
- if (!element.parentNode || !element.bib) {
11752
- return;
11753
- }
11754
-
11755
11724
  // Compute the position of the bib
11756
- computePosition(element.parentNode, element.bib, {
11725
+ computePosition(this.element.parentNode, this.element.bib, {
11757
11726
  placement: "bottom-start",
11758
11727
  }).then(({ x, y }) => {
11759
11728
  // eslint-disable-line id-length
11760
- const currentElement = this.element;
11761
- if (!currentElement?.bib || !currentElement.parentNode) {
11762
- return;
11763
- }
11764
-
11765
- Object.assign(currentElement.bib.style, {
11729
+ Object.assign(this.element.bib.style, {
11766
11730
  left: `${x}px`,
11767
- top: `${y - currentElement.parentNode.offsetHeight}px`,
11768
- width: `${currentElement.parentNode.offsetWidth}px`,
11769
- height: `${currentElement.parentNode.offsetHeight}px`,
11731
+ top: `${y - this.element.parentNode.offsetHeight}px`,
11732
+ width: `${this.element.parentNode.offsetWidth}px`,
11733
+ height: `${this.element.parentNode.offsetHeight}px`,
11770
11734
  });
11771
11735
  });
11772
11736
  }
@@ -11778,17 +11742,11 @@ class AuroFloatingUI {
11778
11742
  * @param {Boolean} lock - If true, locks the body's scrolling functionlity; otherwise, unlock.
11779
11743
  */
11780
11744
  lockScroll(lock = true) {
11781
- const element = this.element;
11782
-
11783
11745
  if (lock) {
11784
- if (!element?.bib) {
11785
- return;
11786
- }
11787
-
11788
11746
  document.body.style.overflow = "hidden"; // hide body's scrollbar
11789
11747
 
11790
11748
  // Move `bib` by the amount the viewport is shifted to stay aligned in fullscreen.
11791
- element.bib.style.transform = `translateY(${window?.visualViewport?.offsetTop}px)`;
11749
+ this.element.bib.style.transform = `translateY(${window?.visualViewport?.offsetTop}px)`;
11792
11750
  } else {
11793
11751
  document.body.style.overflow = "";
11794
11752
  }
@@ -11804,24 +11762,20 @@ class AuroFloatingUI {
11804
11762
  * @param {string} strategy - The positioning strategy ('fullscreen' or 'floating').
11805
11763
  */
11806
11764
  configureBibStrategy(value) {
11807
- const element = this.element;
11808
- if (!element?.bib) {
11809
- return;
11810
- }
11811
-
11812
11765
  if (value === "fullscreen") {
11813
- element.isBibFullscreen = true;
11766
+ this.element.isBibFullscreen = true;
11814
11767
  // reset the prev position
11815
- element.bib.setAttribute("isfullscreen", "");
11816
- element.bib.style.position = "fixed";
11817
- element.bib.style.top = "0px";
11818
- element.bib.style.left = "0px";
11819
- element.bib.style.width = "";
11820
- element.bib.style.height = "";
11821
- element.style.contain = "";
11768
+ this.element.bib.setAttribute("isfullscreen", "");
11769
+ this.element.bib.style.position = "fixed";
11770
+ this.element.bib.style.top = "0px";
11771
+ this.element.bib.style.left = "0px";
11772
+ this.element.bib.style.width = "";
11773
+ this.element.bib.style.height = "";
11774
+ this.element.style.contain = "";
11822
11775
 
11823
11776
  // reset the size that was mirroring `size` css-part
11824
- const bibContent = element.bib.shadowRoot?.querySelector(".container");
11777
+ const bibContent =
11778
+ this.element.bib.shadowRoot.querySelector(".container");
11825
11779
  if (bibContent) {
11826
11780
  bibContent.style.width = "";
11827
11781
  bibContent.style.height = "";
@@ -11836,14 +11790,14 @@ class AuroFloatingUI {
11836
11790
  }, 0);
11837
11791
  }
11838
11792
 
11839
- if (element.isPopoverVisible) {
11793
+ if (this.element.isPopoverVisible) {
11840
11794
  this.lockScroll(true);
11841
11795
  }
11842
11796
  } else {
11843
- element.bib.style.position = "";
11844
- element.bib.removeAttribute("isfullscreen");
11845
- element.isBibFullscreen = false;
11846
- element.style.contain = "layout";
11797
+ this.element.bib.style.position = "";
11798
+ this.element.bib.removeAttribute("isfullscreen");
11799
+ this.element.isBibFullscreen = false;
11800
+ this.element.style.contain = "layout";
11847
11801
  }
11848
11802
 
11849
11803
  const isChanged = this.strategy && this.strategy !== value;
@@ -11861,21 +11815,16 @@ class AuroFloatingUI {
11861
11815
  },
11862
11816
  );
11863
11817
 
11864
- element.dispatchEvent(event);
11818
+ this.element.dispatchEvent(event);
11865
11819
  }
11866
11820
  }
11867
11821
 
11868
11822
  updateState() {
11869
- const element = this.element;
11870
- if (!element) {
11871
- return;
11872
- }
11873
-
11874
- const isVisible = element.isPopoverVisible;
11823
+ const isVisible = this.element.isPopoverVisible;
11875
11824
  if (!isVisible) {
11876
11825
  this.cleanupHideHandlers();
11877
11826
  try {
11878
- element.cleanup?.();
11827
+ this.element.cleanup?.();
11879
11828
  } catch (error) {
11880
11829
  // Do nothing
11881
11830
  }
@@ -11891,30 +11840,28 @@ class AuroFloatingUI {
11891
11840
  * If not, and if the bib isn't in fullscreen mode with focus lost, it hides the bib.
11892
11841
  */
11893
11842
  handleFocusLoss() {
11894
- const element = this.element;
11895
- if (!element?.bib) {
11896
- return;
11897
- }
11898
-
11899
11843
  // if mouse is being pressed, skip and let click event to handle the action
11900
11844
  if (AuroFloatingUI.isMousePressed) {
11901
11845
  return;
11902
11846
  }
11903
11847
 
11904
11848
  if (
11905
- element.noHideOnThisFocusLoss ||
11906
- element.hasAttribute("noHideOnThisFocusLoss")
11849
+ this.element.noHideOnThisFocusLoss ||
11850
+ this.element.hasAttribute("noHideOnThisFocusLoss")
11907
11851
  ) {
11908
11852
  return;
11909
11853
  }
11910
11854
 
11911
11855
  // if focus is still inside of trigger or bib, do not close
11912
- if (element.matches(":focus") || element.matches(":focus-within")) {
11856
+ if (
11857
+ this.element.matches(":focus") ||
11858
+ this.element.matches(":focus-within")
11859
+ ) {
11913
11860
  return;
11914
11861
  }
11915
11862
 
11916
11863
  // if fullscreen bib is in fullscreen mode, do not close
11917
- if (element.bib.hasAttribute("isfullscreen")) {
11864
+ if (this.element.bib.hasAttribute("isfullscreen")) {
11918
11865
  return;
11919
11866
  }
11920
11867
 
@@ -11922,33 +11869,23 @@ class AuroFloatingUI {
11922
11869
  }
11923
11870
 
11924
11871
  setupHideHandlers() {
11925
- const element = this.element;
11926
- if (!element) {
11927
- return;
11928
- }
11929
-
11930
11872
  // Define handlers & store references
11931
11873
  this.focusHandler = () => this.handleFocusLoss();
11932
11874
 
11933
11875
  this.clickHandler = (evt) => {
11934
- const element = this.element;
11935
- if (!element?.bib) {
11936
- return;
11937
- }
11938
-
11939
11876
  // When the bib is fullscreen (modal dialog), don't close on outside
11940
11877
  // clicks. VoiceOver's synthetic click events inside a top-layer modal
11941
11878
  // <dialog> may not include the bib in composedPath(), causing false
11942
11879
  // positives. This mirrors the fullscreen guard in handleFocusLoss().
11943
- if (element.bib.hasAttribute("isfullscreen")) {
11880
+ if (this.element.bib && this.element.bib.hasAttribute("isfullscreen")) {
11944
11881
  return;
11945
11882
  }
11946
11883
 
11947
11884
  if (
11948
- (!evt.composedPath().includes(element.trigger) &&
11949
- !evt.composedPath().includes(element.bib)) ||
11950
- (element.bib.backdrop &&
11951
- evt.composedPath().includes(element.bib.backdrop))
11885
+ (!evt.composedPath().includes(this.element.trigger) &&
11886
+ !evt.composedPath().includes(this.element.bib)) ||
11887
+ (this.element.bib.backdrop &&
11888
+ evt.composedPath().includes(this.element.bib.backdrop))
11952
11889
  ) {
11953
11890
  const existedVisibleFloatingUI =
11954
11891
  document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
@@ -11969,12 +11906,7 @@ class AuroFloatingUI {
11969
11906
 
11970
11907
  // ESC key handler
11971
11908
  this.keyDownHandler = (evt) => {
11972
- const element = this.element;
11973
- if (!element) {
11974
- return;
11975
- }
11976
-
11977
- if (evt.key === "Escape" && element.isPopoverVisible) {
11909
+ if (evt.key === "Escape" && this.element.isPopoverVisible) {
11978
11910
  const existedVisibleFloatingUI =
11979
11911
  document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
11980
11912
  if (
@@ -12031,10 +11963,6 @@ class AuroFloatingUI {
12031
11963
  }
12032
11964
 
12033
11965
  updateCurrentExpandedDropdown() {
12034
- if (!this.element) {
12035
- return;
12036
- }
12037
-
12038
11966
  // Close any other dropdown that is already open
12039
11967
  const existedVisibleFloatingUI =
12040
11968
  document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
@@ -12051,34 +11979,25 @@ class AuroFloatingUI {
12051
11979
  }
12052
11980
 
12053
11981
  showBib() {
12054
- const element = this.element;
12055
- if (!element) {
12056
- return;
12057
- }
12058
-
12059
- if (!element.bib || (!element.trigger && !element.parentNode)) {
12060
- return;
12061
- }
12062
-
12063
- if (!element.disabled && !this.showing) {
11982
+ if (!this.element.disabled && !this.showing) {
12064
11983
  this.updateCurrentExpandedDropdown();
12065
- element.triggerChevron?.setAttribute("data-expanded", true);
11984
+ this.element.triggerChevron?.setAttribute("data-expanded", true);
12066
11985
 
12067
11986
  // prevent double showing: isPopovervisible gets first and showBib gets called later
12068
11987
  if (!this.showing) {
12069
- if (!element.modal) {
11988
+ if (!this.element.modal) {
12070
11989
  this.setupHideHandlers();
12071
11990
  }
12072
11991
  this.showing = true;
12073
- element.isPopoverVisible = true;
11992
+ this.element.isPopoverVisible = true;
12074
11993
  this.position();
12075
11994
  this.dispatchEventDropdownToggle();
12076
11995
  }
12077
11996
 
12078
11997
  // Setup auto update to handle resize and scroll
12079
- element.cleanup = autoUpdate(
12080
- element.trigger || element.parentNode,
12081
- element.bib,
11998
+ this.element.cleanup = autoUpdate(
11999
+ this.element.trigger || this.element.parentNode,
12000
+ this.element.bib,
12082
12001
  () => {
12083
12002
  this.position();
12084
12003
  },
@@ -12091,27 +12010,22 @@ class AuroFloatingUI {
12091
12010
  * @param {String} eventType - The event type that triggered the hiding action.
12092
12011
  */
12093
12012
  hideBib(eventType = "unknown") {
12094
- const element = this.element;
12095
- if (!element) {
12096
- return;
12097
- }
12098
-
12099
- if (element.disabled) {
12013
+ if (this.element.disabled) {
12100
12014
  return;
12101
12015
  }
12102
12016
 
12103
12017
  // noToggle dropdowns should not close when the trigger is clicked (the
12104
12018
  // "toggle" behavior), but they CAN still close via other interactions like
12105
12019
  // Escape key or focus loss.
12106
- if (element.noToggle && eventType === "click") {
12020
+ if (this.element.noToggle && eventType === "click") {
12107
12021
  return;
12108
12022
  }
12109
12023
 
12110
12024
  this.lockScroll(false);
12111
- element.triggerChevron?.removeAttribute("data-expanded");
12025
+ this.element.triggerChevron?.removeAttribute("data-expanded");
12112
12026
 
12113
- if (element.isPopoverVisible) {
12114
- element.isPopoverVisible = false;
12027
+ if (this.element.isPopoverVisible) {
12028
+ this.element.isPopoverVisible = false;
12115
12029
  }
12116
12030
  if (this.showing) {
12117
12031
  this.cleanupHideHandlers();
@@ -12131,11 +12045,6 @@ class AuroFloatingUI {
12131
12045
  * @param {String} eventType - The event type that triggered the toggle action.
12132
12046
  */
12133
12047
  dispatchEventDropdownToggle(eventType) {
12134
- const element = this.element;
12135
- if (!element) {
12136
- return;
12137
- }
12138
-
12139
12048
  const event = new CustomEvent(
12140
12049
  this.eventPrefix ? `${this.eventPrefix}-toggled` : "toggled",
12141
12050
  {
@@ -12147,16 +12056,11 @@ class AuroFloatingUI {
12147
12056
  },
12148
12057
  );
12149
12058
 
12150
- element.dispatchEvent(event);
12059
+ this.element.dispatchEvent(event);
12151
12060
  }
12152
12061
 
12153
12062
  handleClick() {
12154
- const element = this.element;
12155
- if (!element) {
12156
- return;
12157
- }
12158
-
12159
- if (element.isPopoverVisible) {
12063
+ if (this.element.isPopoverVisible) {
12160
12064
  this.hideBib("click");
12161
12065
  } else {
12162
12066
  this.showBib();
@@ -12167,66 +12071,63 @@ class AuroFloatingUI {
12167
12071
  {
12168
12072
  composed: true,
12169
12073
  detail: {
12170
- expanded: element.isPopoverVisible,
12074
+ expanded: this.element.isPopoverVisible,
12171
12075
  },
12172
12076
  },
12173
12077
  );
12174
12078
 
12175
- element.dispatchEvent(event);
12079
+ this.element.dispatchEvent(event);
12176
12080
  }
12177
12081
 
12178
12082
  handleEvent(event) {
12179
- const element = this.element;
12180
- if (!element || element.disableEventShow) {
12181
- return;
12182
- }
12183
-
12184
- switch (event.type) {
12185
- case "keydown": {
12186
- // Support both Enter and Space keys for accessibility
12187
- // Space is included as it's expected behavior for interactive elements
12188
-
12189
- const origin = event.composedPath()[0];
12190
- if (
12191
- event.key === "Enter" ||
12192
- (event.key === " " && (!origin || origin.tagName !== "INPUT"))
12193
- ) {
12194
- event.preventDefault();
12195
- this.handleClick();
12083
+ if (!this.element.disableEventShow) {
12084
+ switch (event.type) {
12085
+ case "keydown": {
12086
+ // Support both Enter and Space keys for accessibility
12087
+ // Space is included as it's expected behavior for interactive elements
12088
+
12089
+ const origin = event.composedPath()[0];
12090
+ if (
12091
+ event.key === "Enter" ||
12092
+ (event.key === " " && (!origin || origin.tagName !== "INPUT"))
12093
+ ) {
12094
+ event.preventDefault();
12095
+ this.handleClick();
12096
+ }
12097
+ break;
12196
12098
  }
12197
- break;
12099
+ case "mouseenter":
12100
+ if (this.element.hoverToggle) {
12101
+ this.showBib();
12102
+ }
12103
+ break;
12104
+ case "mouseleave":
12105
+ if (this.element.hoverToggle) {
12106
+ this.hideBib("mouseleave");
12107
+ }
12108
+ break;
12109
+ case "focus":
12110
+ if (this.element.focusShow) {
12111
+ /*
12112
+ This needs to better handle clicking that gives focus -
12113
+ currently it shows and then immediately hides the bib
12114
+ */
12115
+ this.showBib();
12116
+ }
12117
+ break;
12118
+ case "blur":
12119
+ // send this task 100ms later queue to
12120
+ // wait a frame in case focus moves within the floating element/bib
12121
+ setTimeout(() => this.handleFocusLoss(), 0);
12122
+ break;
12123
+ case "click":
12124
+ if (document.activeElement === document.body) {
12125
+ event.currentTarget.focus();
12126
+ }
12127
+ this.handleClick();
12128
+ break;
12129
+ // Do nothing
12198
12130
  }
12199
- case "mouseenter":
12200
- if (element.hoverToggle) {
12201
- this.showBib();
12202
- }
12203
- break;
12204
- case "mouseleave":
12205
- if (element.hoverToggle) {
12206
- this.hideBib("mouseleave");
12207
- }
12208
- break;
12209
- case "focus":
12210
- if (element.focusShow) {
12211
- /*
12212
- This needs to better handle clicking that gives focus -
12213
- currently it shows and then immediately hides the bib
12214
- */
12215
- this.showBib();
12216
- }
12217
- break;
12218
- case "blur":
12219
- // send this task 100ms later queue to
12220
- // wait a frame in case focus moves within the floating element/bib
12221
- setTimeout(() => this.handleFocusLoss(), 0);
12222
- break;
12223
- case "click":
12224
- if (document.activeElement === document.body) {
12225
- event.currentTarget.focus();
12226
- }
12227
- this.handleClick();
12228
- break;
12229
- // Do nothing
12230
12131
  }
12231
12132
  }
12232
12133
 
@@ -12237,11 +12138,6 @@ class AuroFloatingUI {
12237
12138
  * This prevents the component itself from being focusable when the trigger element already handles focus.
12238
12139
  */
12239
12140
  handleTriggerTabIndex() {
12240
- const element = this.element;
12241
- if (!element) {
12242
- return;
12243
- }
12244
-
12245
12141
  const focusableElementSelectors = [
12246
12142
  "a",
12247
12143
  "button",
@@ -12254,7 +12150,7 @@ class AuroFloatingUI {
12254
12150
  "auro-hyperlink",
12255
12151
  ];
12256
12152
 
12257
- const triggerNode = element.querySelectorAll('[slot="trigger"]')[0];
12153
+ const triggerNode = this.element.querySelectorAll('[slot="trigger"]')[0];
12258
12154
  if (!triggerNode) {
12259
12155
  return;
12260
12156
  }
@@ -12263,13 +12159,13 @@ class AuroFloatingUI {
12263
12159
  focusableElementSelectors.forEach((selector) => {
12264
12160
  // Check if the trigger node element is focusable
12265
12161
  if (triggerNodeTagName === selector) {
12266
- element.tabIndex = -1;
12162
+ this.element.tabIndex = -1;
12267
12163
  return;
12268
12164
  }
12269
12165
 
12270
12166
  // Check if any child is focusable
12271
12167
  if (triggerNode.querySelector(selector)) {
12272
- element.tabIndex = -1;
12168
+ this.element.tabIndex = -1;
12273
12169
  }
12274
12170
  });
12275
12171
  }
@@ -12279,18 +12175,13 @@ class AuroFloatingUI {
12279
12175
  * @param {*} eventPrefix
12280
12176
  */
12281
12177
  regenerateBibId() {
12282
- const element = this.element;
12283
- if (!element) {
12284
- return;
12285
- }
12286
-
12287
- this.id = element.getAttribute("id");
12178
+ this.id = this.element.getAttribute("id");
12288
12179
  if (!this.id) {
12289
12180
  this.id = window.crypto.randomUUID();
12290
- element.setAttribute("id", this.id);
12181
+ this.element.setAttribute("id", this.id);
12291
12182
  }
12292
12183
 
12293
- element.bib?.setAttribute("id", `${this.id}-floater-bib`);
12184
+ this.element.bib.setAttribute("id", `${this.id}-floater-bib`);
12294
12185
  }
12295
12186
 
12296
12187
  configure(elem, eventPrefix, enableKeyboardHandling = true) {
@@ -12302,69 +12193,67 @@ class AuroFloatingUI {
12302
12193
  this.element = elem;
12303
12194
  }
12304
12195
 
12305
- const element = this.element;
12306
- if (!element) {
12307
- return;
12196
+ if (this.behavior !== this.element.behavior) {
12197
+ this.behavior = this.element.behavior;
12308
12198
  }
12309
12199
 
12310
- if (this.behavior !== element.behavior) {
12311
- this.behavior = element.behavior;
12312
- }
12313
-
12314
- if (element.trigger) {
12200
+ if (this.element.trigger) {
12315
12201
  this.disconnect();
12316
12202
  }
12317
- element.trigger =
12318
- element.triggerElement ||
12319
- element.shadowRoot?.querySelector("#trigger") ||
12320
- element.trigger;
12321
- element.bib = element.shadowRoot?.querySelector("#bib") || element.bib;
12322
- element.bibSizer = element.shadowRoot?.querySelector("#bibSizer");
12323
- element.triggerChevron =
12324
- element.shadowRoot?.querySelector("#showStateIcon");
12203
+ this.element.trigger =
12204
+ this.element.triggerElement ||
12205
+ this.element.shadowRoot.querySelector("#trigger") ||
12206
+ this.element.trigger;
12207
+ this.element.bib =
12208
+ this.element.shadowRoot.querySelector("#bib") || this.element.bib;
12209
+ this.element.bibSizer = this.element.shadowRoot.querySelector("#bibSizer");
12210
+ this.element.triggerChevron =
12211
+ this.element.shadowRoot.querySelector("#showStateIcon");
12325
12212
 
12326
- if (element.floaterConfig) {
12327
- element.hoverToggle = element.floaterConfig.hoverToggle;
12213
+ if (this.element.floaterConfig) {
12214
+ this.element.hoverToggle = this.element.floaterConfig.hoverToggle;
12328
12215
  }
12329
12216
 
12330
12217
  this.regenerateBibId();
12331
12218
  this.handleTriggerTabIndex();
12332
12219
 
12333
12220
  this.handleEvent = this.handleEvent.bind(this);
12334
- if (element.trigger) {
12221
+ if (this.element.trigger) {
12335
12222
  if (this.enableKeyboardHandling) {
12336
- element.trigger.addEventListener("keydown", this.handleEvent);
12223
+ this.element.trigger.addEventListener("keydown", this.handleEvent);
12337
12224
  }
12338
- element.trigger.addEventListener("click", this.handleEvent);
12339
- element.trigger.addEventListener("mouseenter", this.handleEvent);
12340
- element.trigger.addEventListener("mouseleave", this.handleEvent);
12341
- element.trigger.addEventListener("focus", this.handleEvent);
12342
- element.trigger.addEventListener("blur", this.handleEvent);
12225
+ this.element.trigger.addEventListener("click", this.handleEvent);
12226
+ this.element.trigger.addEventListener("mouseenter", this.handleEvent);
12227
+ this.element.trigger.addEventListener("mouseleave", this.handleEvent);
12228
+ this.element.trigger.addEventListener("focus", this.handleEvent);
12229
+ this.element.trigger.addEventListener("blur", this.handleEvent);
12343
12230
  }
12344
12231
  }
12345
12232
 
12346
12233
  disconnect() {
12347
12234
  this.cleanupHideHandlers();
12235
+ if (this.element) {
12236
+ this.element.cleanup?.();
12348
12237
 
12349
- const element = this.element;
12350
- if (!element) {
12351
- return;
12352
- }
12353
-
12354
- element.cleanup?.();
12355
-
12356
- if (element.bib && element.shadowRoot) {
12357
- element.shadowRoot.append(element.bib);
12358
- }
12238
+ if (this.element.bib) {
12239
+ this.element.shadowRoot.append(this.element.bib);
12240
+ }
12359
12241
 
12360
- // Remove event & keyboard listeners
12361
- if (element.trigger) {
12362
- element.trigger.removeEventListener("keydown", this.handleEvent);
12363
- element.trigger.removeEventListener("click", this.handleEvent);
12364
- element.trigger.removeEventListener("mouseenter", this.handleEvent);
12365
- element.trigger.removeEventListener("mouseleave", this.handleEvent);
12366
- element.trigger.removeEventListener("focus", this.handleEvent);
12367
- element.trigger.removeEventListener("blur", this.handleEvent);
12242
+ // Remove event & keyboard listeners
12243
+ if (this.element?.trigger) {
12244
+ this.element.trigger.removeEventListener("keydown", this.handleEvent);
12245
+ this.element.trigger.removeEventListener("click", this.handleEvent);
12246
+ this.element.trigger.removeEventListener(
12247
+ "mouseenter",
12248
+ this.handleEvent,
12249
+ );
12250
+ this.element.trigger.removeEventListener(
12251
+ "mouseleave",
12252
+ this.handleEvent,
12253
+ );
12254
+ this.element.trigger.removeEventListener("focus", this.handleEvent);
12255
+ this.element.trigger.removeEventListener("blur", this.handleEvent);
12256
+ }
12368
12257
  }
12369
12258
  }
12370
12259
  }
@@ -13492,7 +13381,7 @@ let AuroHelpText$2 = class AuroHelpText extends i$1 {
13492
13381
  }
13493
13382
  };
13494
13383
 
13495
- var formkitVersion$1 = '202604071818';
13384
+ var formkitVersion$1 = '202604072118';
13496
13385
 
13497
13386
  let AuroElement$2 = class AuroElement extends i$1 {
13498
13387
  static get properties() {
@@ -21256,7 +21145,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$1 {
21256
21145
  }
21257
21146
  };
21258
21147
 
21259
- var formkitVersion = '202604071818';
21148
+ var formkitVersion = '202604072118';
21260
21149
 
21261
21150
  // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
21262
21151
  // See LICENSE in the project root for license information.