@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
@@ -9549,7 +9549,7 @@ class AuroBibtemplate extends i$1 {
9549
9549
  }
9550
9550
  }
9551
9551
 
9552
- var formkitVersion$2 = '202604071818';
9552
+ var formkitVersion$2 = '202604072118';
9553
9553
 
9554
9554
  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}
9555
9555
  `,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}}
@@ -11883,19 +11883,11 @@ class AuroFloatingUI {
11883
11883
  * This ensures that the bib content has the same dimensions as the sizer element.
11884
11884
  */
11885
11885
  mirrorSize() {
11886
- const element = this.element;
11887
- if (!element) {
11888
- return;
11889
- }
11890
-
11891
11886
  // mirror the boxsize from bibSizer
11892
- if (element.bibSizer && element.matchWidth && element.bib?.shadowRoot) {
11893
- const sizerStyle = window.getComputedStyle(element.bibSizer);
11894
- const bibContent = element.bib.shadowRoot.querySelector(".container");
11895
- if (!bibContent) {
11896
- return;
11897
- }
11898
-
11887
+ if (this.element.bibSizer && this.element.matchWidth) {
11888
+ const sizerStyle = window.getComputedStyle(this.element.bibSizer);
11889
+ const bibContent =
11890
+ this.element.bib.shadowRoot.querySelector(".container");
11899
11891
  if (sizerStyle.width !== "0px") {
11900
11892
  bibContent.style.width = sizerStyle.width;
11901
11893
  }
@@ -11917,14 +11909,9 @@ class AuroFloatingUI {
11917
11909
  * @returns {String} The positioning strategy, one of 'fullscreen', 'floating', 'cover'.
11918
11910
  */
11919
11911
  getPositioningStrategy() {
11920
- const element = this.element;
11921
- if (!element) {
11922
- return "floating";
11923
- }
11924
-
11925
11912
  const breakpoint =
11926
- element.bib?.mobileFullscreenBreakpoint ||
11927
- element.floaterConfig?.fullscreenBreakpoint;
11913
+ this.element.bib.mobileFullscreenBreakpoint ||
11914
+ this.element.floaterConfig?.fullscreenBreakpoint;
11928
11915
  switch (this.behavior) {
11929
11916
  case "tooltip":
11930
11917
  return "floating";
@@ -11935,9 +11922,9 @@ class AuroFloatingUI {
11935
11922
  `(max-width: ${breakpoint})`,
11936
11923
  ).matches;
11937
11924
 
11938
- element.expanded = smallerThanBreakpoint;
11925
+ this.element.expanded = smallerThanBreakpoint;
11939
11926
  }
11940
- if (element.nested) {
11927
+ if (this.element.nested) {
11941
11928
  return "cover";
11942
11929
  }
11943
11930
  return "fullscreen";
@@ -11967,65 +11954,42 @@ class AuroFloatingUI {
11967
11954
  * and applies the calculated position to the bib's style.
11968
11955
  */
11969
11956
  position() {
11970
- const element = this.element;
11971
- if (!element) {
11972
- return;
11973
- }
11974
-
11975
11957
  const strategy = this.getPositioningStrategy();
11976
11958
  this.configureBibStrategy(strategy);
11977
11959
 
11978
11960
  if (strategy === "floating") {
11979
- if (!element.trigger || !element.bib) {
11980
- return;
11981
- }
11982
-
11983
11961
  this.mirrorSize();
11984
11962
  // Define the middlware for the floater configuration
11985
11963
  const middleware = [
11986
- offset(element.floaterConfig?.offset || 0),
11987
- ...(element.floaterConfig?.shift ? [shift()] : []), // Add shift middleware if shift is enabled.
11988
- ...(element.floaterConfig?.flip ? [flip()] : []), // Add flip middleware if flip is enabled.
11989
- ...(element.floaterConfig?.autoPlacement ? [autoPlacement()] : []), // Add autoPlacement middleware if autoPlacement is enabled.
11964
+ offset(this.element.floaterConfig?.offset || 0),
11965
+ ...(this.element.floaterConfig?.shift ? [shift()] : []), // Add shift middleware if shift is enabled.
11966
+ ...(this.element.floaterConfig?.flip ? [flip()] : []), // Add flip middleware if flip is enabled.
11967
+ ...(this.element.floaterConfig?.autoPlacement ? [autoPlacement()] : []), // Add autoPlacement middleware if autoPlacement is enabled.
11990
11968
  ];
11991
11969
 
11992
11970
  // Compute the position of the bib
11993
- computePosition(element.trigger, element.bib, {
11994
- strategy: element.floaterConfig?.strategy || "fixed",
11995
- placement: element.floaterConfig?.placement,
11971
+ computePosition(this.element.trigger, this.element.bib, {
11972
+ strategy: this.element.floaterConfig?.strategy || "fixed",
11973
+ placement: this.element.floaterConfig?.placement,
11996
11974
  middleware: middleware || [],
11997
11975
  }).then(({ x, y }) => {
11998
11976
  // eslint-disable-line id-length
11999
- const currentElement = this.element;
12000
- if (!currentElement?.bib) {
12001
- return;
12002
- }
12003
-
12004
- Object.assign(currentElement.bib.style, {
11977
+ Object.assign(this.element.bib.style, {
12005
11978
  left: `${x}px`,
12006
11979
  top: `${y}px`,
12007
11980
  });
12008
11981
  });
12009
11982
  } else if (strategy === "cover") {
12010
- if (!element.parentNode || !element.bib) {
12011
- return;
12012
- }
12013
-
12014
11983
  // Compute the position of the bib
12015
- computePosition(element.parentNode, element.bib, {
11984
+ computePosition(this.element.parentNode, this.element.bib, {
12016
11985
  placement: "bottom-start",
12017
11986
  }).then(({ x, y }) => {
12018
11987
  // eslint-disable-line id-length
12019
- const currentElement = this.element;
12020
- if (!currentElement?.bib || !currentElement.parentNode) {
12021
- return;
12022
- }
12023
-
12024
- Object.assign(currentElement.bib.style, {
11988
+ Object.assign(this.element.bib.style, {
12025
11989
  left: `${x}px`,
12026
- top: `${y - currentElement.parentNode.offsetHeight}px`,
12027
- width: `${currentElement.parentNode.offsetWidth}px`,
12028
- height: `${currentElement.parentNode.offsetHeight}px`,
11990
+ top: `${y - this.element.parentNode.offsetHeight}px`,
11991
+ width: `${this.element.parentNode.offsetWidth}px`,
11992
+ height: `${this.element.parentNode.offsetHeight}px`,
12029
11993
  });
12030
11994
  });
12031
11995
  }
@@ -12037,17 +12001,11 @@ class AuroFloatingUI {
12037
12001
  * @param {Boolean} lock - If true, locks the body's scrolling functionlity; otherwise, unlock.
12038
12002
  */
12039
12003
  lockScroll(lock = true) {
12040
- const element = this.element;
12041
-
12042
12004
  if (lock) {
12043
- if (!element?.bib) {
12044
- return;
12045
- }
12046
-
12047
12005
  document.body.style.overflow = "hidden"; // hide body's scrollbar
12048
12006
 
12049
12007
  // Move `bib` by the amount the viewport is shifted to stay aligned in fullscreen.
12050
- element.bib.style.transform = `translateY(${window?.visualViewport?.offsetTop}px)`;
12008
+ this.element.bib.style.transform = `translateY(${window?.visualViewport?.offsetTop}px)`;
12051
12009
  } else {
12052
12010
  document.body.style.overflow = "";
12053
12011
  }
@@ -12063,24 +12021,20 @@ class AuroFloatingUI {
12063
12021
  * @param {string} strategy - The positioning strategy ('fullscreen' or 'floating').
12064
12022
  */
12065
12023
  configureBibStrategy(value) {
12066
- const element = this.element;
12067
- if (!element?.bib) {
12068
- return;
12069
- }
12070
-
12071
12024
  if (value === "fullscreen") {
12072
- element.isBibFullscreen = true;
12025
+ this.element.isBibFullscreen = true;
12073
12026
  // reset the prev position
12074
- element.bib.setAttribute("isfullscreen", "");
12075
- element.bib.style.position = "fixed";
12076
- element.bib.style.top = "0px";
12077
- element.bib.style.left = "0px";
12078
- element.bib.style.width = "";
12079
- element.bib.style.height = "";
12080
- element.style.contain = "";
12027
+ this.element.bib.setAttribute("isfullscreen", "");
12028
+ this.element.bib.style.position = "fixed";
12029
+ this.element.bib.style.top = "0px";
12030
+ this.element.bib.style.left = "0px";
12031
+ this.element.bib.style.width = "";
12032
+ this.element.bib.style.height = "";
12033
+ this.element.style.contain = "";
12081
12034
 
12082
12035
  // reset the size that was mirroring `size` css-part
12083
- const bibContent = element.bib.shadowRoot?.querySelector(".container");
12036
+ const bibContent =
12037
+ this.element.bib.shadowRoot.querySelector(".container");
12084
12038
  if (bibContent) {
12085
12039
  bibContent.style.width = "";
12086
12040
  bibContent.style.height = "";
@@ -12095,14 +12049,14 @@ class AuroFloatingUI {
12095
12049
  }, 0);
12096
12050
  }
12097
12051
 
12098
- if (element.isPopoverVisible) {
12052
+ if (this.element.isPopoverVisible) {
12099
12053
  this.lockScroll(true);
12100
12054
  }
12101
12055
  } else {
12102
- element.bib.style.position = "";
12103
- element.bib.removeAttribute("isfullscreen");
12104
- element.isBibFullscreen = false;
12105
- element.style.contain = "layout";
12056
+ this.element.bib.style.position = "";
12057
+ this.element.bib.removeAttribute("isfullscreen");
12058
+ this.element.isBibFullscreen = false;
12059
+ this.element.style.contain = "layout";
12106
12060
  }
12107
12061
 
12108
12062
  const isChanged = this.strategy && this.strategy !== value;
@@ -12120,21 +12074,16 @@ class AuroFloatingUI {
12120
12074
  },
12121
12075
  );
12122
12076
 
12123
- element.dispatchEvent(event);
12077
+ this.element.dispatchEvent(event);
12124
12078
  }
12125
12079
  }
12126
12080
 
12127
12081
  updateState() {
12128
- const element = this.element;
12129
- if (!element) {
12130
- return;
12131
- }
12132
-
12133
- const isVisible = element.isPopoverVisible;
12082
+ const isVisible = this.element.isPopoverVisible;
12134
12083
  if (!isVisible) {
12135
12084
  this.cleanupHideHandlers();
12136
12085
  try {
12137
- element.cleanup?.();
12086
+ this.element.cleanup?.();
12138
12087
  } catch (error) {
12139
12088
  // Do nothing
12140
12089
  }
@@ -12150,30 +12099,28 @@ class AuroFloatingUI {
12150
12099
  * If not, and if the bib isn't in fullscreen mode with focus lost, it hides the bib.
12151
12100
  */
12152
12101
  handleFocusLoss() {
12153
- const element = this.element;
12154
- if (!element?.bib) {
12155
- return;
12156
- }
12157
-
12158
12102
  // if mouse is being pressed, skip and let click event to handle the action
12159
12103
  if (AuroFloatingUI.isMousePressed) {
12160
12104
  return;
12161
12105
  }
12162
12106
 
12163
12107
  if (
12164
- element.noHideOnThisFocusLoss ||
12165
- element.hasAttribute("noHideOnThisFocusLoss")
12108
+ this.element.noHideOnThisFocusLoss ||
12109
+ this.element.hasAttribute("noHideOnThisFocusLoss")
12166
12110
  ) {
12167
12111
  return;
12168
12112
  }
12169
12113
 
12170
12114
  // if focus is still inside of trigger or bib, do not close
12171
- if (element.matches(":focus") || element.matches(":focus-within")) {
12115
+ if (
12116
+ this.element.matches(":focus") ||
12117
+ this.element.matches(":focus-within")
12118
+ ) {
12172
12119
  return;
12173
12120
  }
12174
12121
 
12175
12122
  // if fullscreen bib is in fullscreen mode, do not close
12176
- if (element.bib.hasAttribute("isfullscreen")) {
12123
+ if (this.element.bib.hasAttribute("isfullscreen")) {
12177
12124
  return;
12178
12125
  }
12179
12126
 
@@ -12181,33 +12128,23 @@ class AuroFloatingUI {
12181
12128
  }
12182
12129
 
12183
12130
  setupHideHandlers() {
12184
- const element = this.element;
12185
- if (!element) {
12186
- return;
12187
- }
12188
-
12189
12131
  // Define handlers & store references
12190
12132
  this.focusHandler = () => this.handleFocusLoss();
12191
12133
 
12192
12134
  this.clickHandler = (evt) => {
12193
- const element = this.element;
12194
- if (!element?.bib) {
12195
- return;
12196
- }
12197
-
12198
12135
  // When the bib is fullscreen (modal dialog), don't close on outside
12199
12136
  // clicks. VoiceOver's synthetic click events inside a top-layer modal
12200
12137
  // <dialog> may not include the bib in composedPath(), causing false
12201
12138
  // positives. This mirrors the fullscreen guard in handleFocusLoss().
12202
- if (element.bib.hasAttribute("isfullscreen")) {
12139
+ if (this.element.bib && this.element.bib.hasAttribute("isfullscreen")) {
12203
12140
  return;
12204
12141
  }
12205
12142
 
12206
12143
  if (
12207
- (!evt.composedPath().includes(element.trigger) &&
12208
- !evt.composedPath().includes(element.bib)) ||
12209
- (element.bib.backdrop &&
12210
- evt.composedPath().includes(element.bib.backdrop))
12144
+ (!evt.composedPath().includes(this.element.trigger) &&
12145
+ !evt.composedPath().includes(this.element.bib)) ||
12146
+ (this.element.bib.backdrop &&
12147
+ evt.composedPath().includes(this.element.bib.backdrop))
12211
12148
  ) {
12212
12149
  const existedVisibleFloatingUI =
12213
12150
  document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
@@ -12228,12 +12165,7 @@ class AuroFloatingUI {
12228
12165
 
12229
12166
  // ESC key handler
12230
12167
  this.keyDownHandler = (evt) => {
12231
- const element = this.element;
12232
- if (!element) {
12233
- return;
12234
- }
12235
-
12236
- if (evt.key === "Escape" && element.isPopoverVisible) {
12168
+ if (evt.key === "Escape" && this.element.isPopoverVisible) {
12237
12169
  const existedVisibleFloatingUI =
12238
12170
  document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
12239
12171
  if (
@@ -12290,10 +12222,6 @@ class AuroFloatingUI {
12290
12222
  }
12291
12223
 
12292
12224
  updateCurrentExpandedDropdown() {
12293
- if (!this.element) {
12294
- return;
12295
- }
12296
-
12297
12225
  // Close any other dropdown that is already open
12298
12226
  const existedVisibleFloatingUI =
12299
12227
  document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
@@ -12310,34 +12238,25 @@ class AuroFloatingUI {
12310
12238
  }
12311
12239
 
12312
12240
  showBib() {
12313
- const element = this.element;
12314
- if (!element) {
12315
- return;
12316
- }
12317
-
12318
- if (!element.bib || (!element.trigger && !element.parentNode)) {
12319
- return;
12320
- }
12321
-
12322
- if (!element.disabled && !this.showing) {
12241
+ if (!this.element.disabled && !this.showing) {
12323
12242
  this.updateCurrentExpandedDropdown();
12324
- element.triggerChevron?.setAttribute("data-expanded", true);
12243
+ this.element.triggerChevron?.setAttribute("data-expanded", true);
12325
12244
 
12326
12245
  // prevent double showing: isPopovervisible gets first and showBib gets called later
12327
12246
  if (!this.showing) {
12328
- if (!element.modal) {
12247
+ if (!this.element.modal) {
12329
12248
  this.setupHideHandlers();
12330
12249
  }
12331
12250
  this.showing = true;
12332
- element.isPopoverVisible = true;
12251
+ this.element.isPopoverVisible = true;
12333
12252
  this.position();
12334
12253
  this.dispatchEventDropdownToggle();
12335
12254
  }
12336
12255
 
12337
12256
  // Setup auto update to handle resize and scroll
12338
- element.cleanup = autoUpdate(
12339
- element.trigger || element.parentNode,
12340
- element.bib,
12257
+ this.element.cleanup = autoUpdate(
12258
+ this.element.trigger || this.element.parentNode,
12259
+ this.element.bib,
12341
12260
  () => {
12342
12261
  this.position();
12343
12262
  },
@@ -12350,27 +12269,22 @@ class AuroFloatingUI {
12350
12269
  * @param {String} eventType - The event type that triggered the hiding action.
12351
12270
  */
12352
12271
  hideBib(eventType = "unknown") {
12353
- const element = this.element;
12354
- if (!element) {
12355
- return;
12356
- }
12357
-
12358
- if (element.disabled) {
12272
+ if (this.element.disabled) {
12359
12273
  return;
12360
12274
  }
12361
12275
 
12362
12276
  // noToggle dropdowns should not close when the trigger is clicked (the
12363
12277
  // "toggle" behavior), but they CAN still close via other interactions like
12364
12278
  // Escape key or focus loss.
12365
- if (element.noToggle && eventType === "click") {
12279
+ if (this.element.noToggle && eventType === "click") {
12366
12280
  return;
12367
12281
  }
12368
12282
 
12369
12283
  this.lockScroll(false);
12370
- element.triggerChevron?.removeAttribute("data-expanded");
12284
+ this.element.triggerChevron?.removeAttribute("data-expanded");
12371
12285
 
12372
- if (element.isPopoverVisible) {
12373
- element.isPopoverVisible = false;
12286
+ if (this.element.isPopoverVisible) {
12287
+ this.element.isPopoverVisible = false;
12374
12288
  }
12375
12289
  if (this.showing) {
12376
12290
  this.cleanupHideHandlers();
@@ -12390,11 +12304,6 @@ class AuroFloatingUI {
12390
12304
  * @param {String} eventType - The event type that triggered the toggle action.
12391
12305
  */
12392
12306
  dispatchEventDropdownToggle(eventType) {
12393
- const element = this.element;
12394
- if (!element) {
12395
- return;
12396
- }
12397
-
12398
12307
  const event = new CustomEvent(
12399
12308
  this.eventPrefix ? `${this.eventPrefix}-toggled` : "toggled",
12400
12309
  {
@@ -12406,16 +12315,11 @@ class AuroFloatingUI {
12406
12315
  },
12407
12316
  );
12408
12317
 
12409
- element.dispatchEvent(event);
12318
+ this.element.dispatchEvent(event);
12410
12319
  }
12411
12320
 
12412
12321
  handleClick() {
12413
- const element = this.element;
12414
- if (!element) {
12415
- return;
12416
- }
12417
-
12418
- if (element.isPopoverVisible) {
12322
+ if (this.element.isPopoverVisible) {
12419
12323
  this.hideBib("click");
12420
12324
  } else {
12421
12325
  this.showBib();
@@ -12426,66 +12330,63 @@ class AuroFloatingUI {
12426
12330
  {
12427
12331
  composed: true,
12428
12332
  detail: {
12429
- expanded: element.isPopoverVisible,
12333
+ expanded: this.element.isPopoverVisible,
12430
12334
  },
12431
12335
  },
12432
12336
  );
12433
12337
 
12434
- element.dispatchEvent(event);
12338
+ this.element.dispatchEvent(event);
12435
12339
  }
12436
12340
 
12437
12341
  handleEvent(event) {
12438
- const element = this.element;
12439
- if (!element || element.disableEventShow) {
12440
- return;
12441
- }
12442
-
12443
- switch (event.type) {
12444
- case "keydown": {
12445
- // Support both Enter and Space keys for accessibility
12446
- // Space is included as it's expected behavior for interactive elements
12447
-
12448
- const origin = event.composedPath()[0];
12449
- if (
12450
- event.key === "Enter" ||
12451
- (event.key === " " && (!origin || origin.tagName !== "INPUT"))
12452
- ) {
12453
- event.preventDefault();
12454
- this.handleClick();
12342
+ if (!this.element.disableEventShow) {
12343
+ switch (event.type) {
12344
+ case "keydown": {
12345
+ // Support both Enter and Space keys for accessibility
12346
+ // Space is included as it's expected behavior for interactive elements
12347
+
12348
+ const origin = event.composedPath()[0];
12349
+ if (
12350
+ event.key === "Enter" ||
12351
+ (event.key === " " && (!origin || origin.tagName !== "INPUT"))
12352
+ ) {
12353
+ event.preventDefault();
12354
+ this.handleClick();
12355
+ }
12356
+ break;
12455
12357
  }
12456
- break;
12358
+ case "mouseenter":
12359
+ if (this.element.hoverToggle) {
12360
+ this.showBib();
12361
+ }
12362
+ break;
12363
+ case "mouseleave":
12364
+ if (this.element.hoverToggle) {
12365
+ this.hideBib("mouseleave");
12366
+ }
12367
+ break;
12368
+ case "focus":
12369
+ if (this.element.focusShow) {
12370
+ /*
12371
+ This needs to better handle clicking that gives focus -
12372
+ currently it shows and then immediately hides the bib
12373
+ */
12374
+ this.showBib();
12375
+ }
12376
+ break;
12377
+ case "blur":
12378
+ // send this task 100ms later queue to
12379
+ // wait a frame in case focus moves within the floating element/bib
12380
+ setTimeout(() => this.handleFocusLoss(), 0);
12381
+ break;
12382
+ case "click":
12383
+ if (document.activeElement === document.body) {
12384
+ event.currentTarget.focus();
12385
+ }
12386
+ this.handleClick();
12387
+ break;
12388
+ // Do nothing
12457
12389
  }
12458
- case "mouseenter":
12459
- if (element.hoverToggle) {
12460
- this.showBib();
12461
- }
12462
- break;
12463
- case "mouseleave":
12464
- if (element.hoverToggle) {
12465
- this.hideBib("mouseleave");
12466
- }
12467
- break;
12468
- case "focus":
12469
- if (element.focusShow) {
12470
- /*
12471
- This needs to better handle clicking that gives focus -
12472
- currently it shows and then immediately hides the bib
12473
- */
12474
- this.showBib();
12475
- }
12476
- break;
12477
- case "blur":
12478
- // send this task 100ms later queue to
12479
- // wait a frame in case focus moves within the floating element/bib
12480
- setTimeout(() => this.handleFocusLoss(), 0);
12481
- break;
12482
- case "click":
12483
- if (document.activeElement === document.body) {
12484
- event.currentTarget.focus();
12485
- }
12486
- this.handleClick();
12487
- break;
12488
- // Do nothing
12489
12390
  }
12490
12391
  }
12491
12392
 
@@ -12496,11 +12397,6 @@ class AuroFloatingUI {
12496
12397
  * This prevents the component itself from being focusable when the trigger element already handles focus.
12497
12398
  */
12498
12399
  handleTriggerTabIndex() {
12499
- const element = this.element;
12500
- if (!element) {
12501
- return;
12502
- }
12503
-
12504
12400
  const focusableElementSelectors = [
12505
12401
  "a",
12506
12402
  "button",
@@ -12513,7 +12409,7 @@ class AuroFloatingUI {
12513
12409
  "auro-hyperlink",
12514
12410
  ];
12515
12411
 
12516
- const triggerNode = element.querySelectorAll('[slot="trigger"]')[0];
12412
+ const triggerNode = this.element.querySelectorAll('[slot="trigger"]')[0];
12517
12413
  if (!triggerNode) {
12518
12414
  return;
12519
12415
  }
@@ -12522,13 +12418,13 @@ class AuroFloatingUI {
12522
12418
  focusableElementSelectors.forEach((selector) => {
12523
12419
  // Check if the trigger node element is focusable
12524
12420
  if (triggerNodeTagName === selector) {
12525
- element.tabIndex = -1;
12421
+ this.element.tabIndex = -1;
12526
12422
  return;
12527
12423
  }
12528
12424
 
12529
12425
  // Check if any child is focusable
12530
12426
  if (triggerNode.querySelector(selector)) {
12531
- element.tabIndex = -1;
12427
+ this.element.tabIndex = -1;
12532
12428
  }
12533
12429
  });
12534
12430
  }
@@ -12538,18 +12434,13 @@ class AuroFloatingUI {
12538
12434
  * @param {*} eventPrefix
12539
12435
  */
12540
12436
  regenerateBibId() {
12541
- const element = this.element;
12542
- if (!element) {
12543
- return;
12544
- }
12545
-
12546
- this.id = element.getAttribute("id");
12437
+ this.id = this.element.getAttribute("id");
12547
12438
  if (!this.id) {
12548
12439
  this.id = window.crypto.randomUUID();
12549
- element.setAttribute("id", this.id);
12440
+ this.element.setAttribute("id", this.id);
12550
12441
  }
12551
12442
 
12552
- element.bib?.setAttribute("id", `${this.id}-floater-bib`);
12443
+ this.element.bib.setAttribute("id", `${this.id}-floater-bib`);
12553
12444
  }
12554
12445
 
12555
12446
  configure(elem, eventPrefix, enableKeyboardHandling = true) {
@@ -12561,69 +12452,67 @@ class AuroFloatingUI {
12561
12452
  this.element = elem;
12562
12453
  }
12563
12454
 
12564
- const element = this.element;
12565
- if (!element) {
12566
- return;
12455
+ if (this.behavior !== this.element.behavior) {
12456
+ this.behavior = this.element.behavior;
12567
12457
  }
12568
12458
 
12569
- if (this.behavior !== element.behavior) {
12570
- this.behavior = element.behavior;
12571
- }
12572
-
12573
- if (element.trigger) {
12459
+ if (this.element.trigger) {
12574
12460
  this.disconnect();
12575
12461
  }
12576
- element.trigger =
12577
- element.triggerElement ||
12578
- element.shadowRoot?.querySelector("#trigger") ||
12579
- element.trigger;
12580
- element.bib = element.shadowRoot?.querySelector("#bib") || element.bib;
12581
- element.bibSizer = element.shadowRoot?.querySelector("#bibSizer");
12582
- element.triggerChevron =
12583
- element.shadowRoot?.querySelector("#showStateIcon");
12462
+ this.element.trigger =
12463
+ this.element.triggerElement ||
12464
+ this.element.shadowRoot.querySelector("#trigger") ||
12465
+ this.element.trigger;
12466
+ this.element.bib =
12467
+ this.element.shadowRoot.querySelector("#bib") || this.element.bib;
12468
+ this.element.bibSizer = this.element.shadowRoot.querySelector("#bibSizer");
12469
+ this.element.triggerChevron =
12470
+ this.element.shadowRoot.querySelector("#showStateIcon");
12584
12471
 
12585
- if (element.floaterConfig) {
12586
- element.hoverToggle = element.floaterConfig.hoverToggle;
12472
+ if (this.element.floaterConfig) {
12473
+ this.element.hoverToggle = this.element.floaterConfig.hoverToggle;
12587
12474
  }
12588
12475
 
12589
12476
  this.regenerateBibId();
12590
12477
  this.handleTriggerTabIndex();
12591
12478
 
12592
12479
  this.handleEvent = this.handleEvent.bind(this);
12593
- if (element.trigger) {
12480
+ if (this.element.trigger) {
12594
12481
  if (this.enableKeyboardHandling) {
12595
- element.trigger.addEventListener("keydown", this.handleEvent);
12482
+ this.element.trigger.addEventListener("keydown", this.handleEvent);
12596
12483
  }
12597
- element.trigger.addEventListener("click", this.handleEvent);
12598
- element.trigger.addEventListener("mouseenter", this.handleEvent);
12599
- element.trigger.addEventListener("mouseleave", this.handleEvent);
12600
- element.trigger.addEventListener("focus", this.handleEvent);
12601
- element.trigger.addEventListener("blur", this.handleEvent);
12484
+ this.element.trigger.addEventListener("click", this.handleEvent);
12485
+ this.element.trigger.addEventListener("mouseenter", this.handleEvent);
12486
+ this.element.trigger.addEventListener("mouseleave", this.handleEvent);
12487
+ this.element.trigger.addEventListener("focus", this.handleEvent);
12488
+ this.element.trigger.addEventListener("blur", this.handleEvent);
12602
12489
  }
12603
12490
  }
12604
12491
 
12605
12492
  disconnect() {
12606
12493
  this.cleanupHideHandlers();
12494
+ if (this.element) {
12495
+ this.element.cleanup?.();
12607
12496
 
12608
- const element = this.element;
12609
- if (!element) {
12610
- return;
12611
- }
12612
-
12613
- element.cleanup?.();
12614
-
12615
- if (element.bib && element.shadowRoot) {
12616
- element.shadowRoot.append(element.bib);
12617
- }
12497
+ if (this.element.bib) {
12498
+ this.element.shadowRoot.append(this.element.bib);
12499
+ }
12618
12500
 
12619
- // Remove event & keyboard listeners
12620
- if (element.trigger) {
12621
- element.trigger.removeEventListener("keydown", this.handleEvent);
12622
- element.trigger.removeEventListener("click", this.handleEvent);
12623
- element.trigger.removeEventListener("mouseenter", this.handleEvent);
12624
- element.trigger.removeEventListener("mouseleave", this.handleEvent);
12625
- element.trigger.removeEventListener("focus", this.handleEvent);
12626
- element.trigger.removeEventListener("blur", this.handleEvent);
12501
+ // Remove event & keyboard listeners
12502
+ if (this.element?.trigger) {
12503
+ this.element.trigger.removeEventListener("keydown", this.handleEvent);
12504
+ this.element.trigger.removeEventListener("click", this.handleEvent);
12505
+ this.element.trigger.removeEventListener(
12506
+ "mouseenter",
12507
+ this.handleEvent,
12508
+ );
12509
+ this.element.trigger.removeEventListener(
12510
+ "mouseleave",
12511
+ this.handleEvent,
12512
+ );
12513
+ this.element.trigger.removeEventListener("focus", this.handleEvent);
12514
+ this.element.trigger.removeEventListener("blur", this.handleEvent);
12515
+ }
12627
12516
  }
12628
12517
  }
12629
12518
  }
@@ -13751,7 +13640,7 @@ let AuroHelpText$2 = class AuroHelpText extends i$1 {
13751
13640
  }
13752
13641
  };
13753
13642
 
13754
- var formkitVersion$1 = '202604071818';
13643
+ var formkitVersion$1 = '202604072118';
13755
13644
 
13756
13645
  let AuroElement$2 = class AuroElement extends i$1 {
13757
13646
  static get properties() {
@@ -21515,7 +21404,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$1 {
21515
21404
  }
21516
21405
  };
21517
21406
 
21518
- var formkitVersion = '202604071818';
21407
+ var formkitVersion = '202604072118';
21519
21408
 
21520
21409
  // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
21521
21410
  // See LICENSE in the project root for license information.