@aurodesignsystem-dev/auro-formkit 0.0.0-pr1398.2 → 0.0.0-pr1398.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/checkbox/demo/api.min.js +1 -1
- package/components/checkbox/demo/index.min.js +1 -1
- package/components/checkbox/demo/keyboardBehavior.md +0 -0
- package/components/checkbox/dist/index.js +1 -1
- package/components/checkbox/dist/registered.js +1 -1
- package/components/combobox/demo/api.min.js +129 -166
- package/components/combobox/demo/index.min.js +129 -166
- package/components/combobox/demo/keyboardBehavior.html +81 -0
- package/components/combobox/demo/keyboardBehavior.md +308 -0
- package/components/combobox/dist/index.js +87 -134
- package/components/combobox/dist/registered.js +87 -134
- package/components/counter/demo/api.min.js +157 -160
- package/components/counter/demo/index.min.js +157 -160
- package/components/counter/demo/keyboardBehavior.html +81 -0
- package/components/counter/demo/keyboardBehavior.md +127 -0
- package/components/counter/dist/auro-counter.d.ts +0 -7
- package/components/counter/dist/index.js +157 -160
- package/components/counter/dist/keyboardStrategy.d.ts +4 -0
- package/components/counter/dist/registered.js +157 -160
- package/components/datepicker/demo/api.min.js +89 -137
- package/components/datepicker/demo/index.min.js +89 -137
- package/components/datepicker/demo/keyboardBehavior.html +81 -0
- package/components/datepicker/demo/keyboardBehavior.md +24 -0
- package/components/datepicker/dist/index.js +84 -132
- package/components/datepicker/dist/registered.js +84 -132
- package/components/dropdown/demo/api.md +0 -1
- package/components/dropdown/demo/api.min.js +99 -140
- package/components/dropdown/demo/index.md +2 -2
- package/components/dropdown/demo/index.min.js +99 -140
- package/components/dropdown/demo/keyboardBehavior.html +81 -0
- package/components/dropdown/demo/keyboardBehavior.md +77 -0
- package/components/dropdown/dist/auro-dropdown.d.ts +0 -8
- package/components/dropdown/dist/auro-dropdownBib.d.ts +1 -50
- package/components/dropdown/dist/dropdownBibKeyboardStrategy.d.ts +7 -0
- package/components/dropdown/dist/index.js +83 -128
- package/components/dropdown/dist/registered.js +83 -128
- package/components/form/demo/api.min.js +466 -599
- package/components/form/demo/index.min.js +466 -599
- package/components/form/demo/keyboardBehavior.md +0 -0
- package/components/input/demo/api.min.js +1 -1
- package/components/input/demo/index.min.js +1 -1
- package/components/input/demo/keyboardBehavior.md +0 -0
- package/components/input/dist/index.js +1 -1
- package/components/input/dist/registered.js +1 -1
- package/components/menu/demo/api.min.js +42 -32
- package/components/menu/demo/index.min.js +42 -32
- package/components/menu/dist/auro-menu.d.ts +3 -11
- package/components/menu/dist/index.js +42 -32
- package/components/menu/dist/registered.js +42 -32
- 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 +132 -167
- package/components/select/demo/index.min.js +132 -167
- package/components/select/demo/keyboardBehavior.html +81 -0
- package/components/select/demo/keyboardBehavior.md +246 -0
- package/components/select/dist/index.js +90 -135
- package/components/select/dist/registered.js +90 -135
- package/custom-elements.json +61 -89
- package/package.json +2 -2
|
@@ -4,9 +4,9 @@ import { html, css, LitElement } from 'lit';
|
|
|
4
4
|
import { property } from 'lit/decorators.js';
|
|
5
5
|
import { ifDefined } from 'lit/directives/if-defined.js';
|
|
6
6
|
import { createRef, ref } from 'lit/directives/ref.js';
|
|
7
|
-
import { repeat } from 'lit/directives/repeat.js';
|
|
8
7
|
import 'lit-html';
|
|
9
8
|
import 'lit-html/directives/unsafe-html.js';
|
|
9
|
+
import { repeat } from 'lit/directives/repeat.js';
|
|
10
10
|
|
|
11
11
|
let DateFormatter$1 = class DateFormatter {
|
|
12
12
|
|
|
@@ -9242,7 +9242,7 @@ class AuroBibtemplate extends LitElement {
|
|
|
9242
9242
|
}
|
|
9243
9243
|
}
|
|
9244
9244
|
|
|
9245
|
-
var formkitVersion$2 = '
|
|
9245
|
+
var formkitVersion$2 = '202604012043';
|
|
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}}
|
|
@@ -11767,11 +11767,10 @@ class AuroFloatingUI {
|
|
|
11767
11767
|
return;
|
|
11768
11768
|
}
|
|
11769
11769
|
|
|
11770
|
-
const { activeElement } = document;
|
|
11771
11770
|
// if focus is still inside of trigger or bib, do not close
|
|
11772
11771
|
if (
|
|
11773
|
-
this.element.
|
|
11774
|
-
this.element.
|
|
11772
|
+
this.element.matches(":focus") ||
|
|
11773
|
+
this.element.matches(":focus-within")
|
|
11775
11774
|
) {
|
|
11776
11775
|
return;
|
|
11777
11776
|
}
|
|
@@ -12610,12 +12609,83 @@ let p$3 = class p{registerComponent(t,a){customElements.get(t)||customElements.d
|
|
|
12610
12609
|
|
|
12611
12610
|
var iconVersion$2 = '9.1.2';
|
|
12612
12611
|
|
|
12612
|
+
/**
|
|
12613
|
+
* Computes display state once per keydown event.
|
|
12614
|
+
* Centralizes null-safety checks and makes the shared/modal/popover branching explicit.
|
|
12615
|
+
*
|
|
12616
|
+
* @param {HTMLElement} component - The component with a dropdown reference.
|
|
12617
|
+
* @param {Object} [options] - Optional config.
|
|
12618
|
+
* @param {HTMLElement} [options.dropdown] - Explicit dropdown reference. Falls back to component.dropdown.
|
|
12619
|
+
* @param {Function} [options.inputResolver] - Called with (component, ctx) to resolve the active input element.
|
|
12620
|
+
* @returns {{isExpanded: boolean, isModal: boolean, isPopover: boolean, activeInput: HTMLElement|null}}
|
|
12621
|
+
* isModal and isPopover reflect the display mode (fullscreen vs not) regardless of expanded state.
|
|
12622
|
+
*/
|
|
12623
|
+
function createDisplayContext$1(component, options = {}) {
|
|
12624
|
+
const dd = options.dropdown || component.dropdown;
|
|
12625
|
+
// isPopoverVisible reflects as the `open` attribute.
|
|
12626
|
+
// It reports whether the bib is open in any mode (popover or modal).
|
|
12627
|
+
const isExpanded = Boolean(dd && dd.isPopoverVisible);
|
|
12628
|
+
const isFullscreen = Boolean(dd && dd.isBibFullscreen);
|
|
12629
|
+
|
|
12630
|
+
const ctx = {
|
|
12631
|
+
isExpanded,
|
|
12632
|
+
isModal: isFullscreen,
|
|
12633
|
+
isPopover: !isFullscreen,
|
|
12634
|
+
activeInput: null,
|
|
12635
|
+
};
|
|
12636
|
+
|
|
12637
|
+
if (options.inputResolver) {
|
|
12638
|
+
const resolvedInput = options.inputResolver(component, ctx);
|
|
12639
|
+
// Guard against resolvers returning undefined or non-HTMLElement values.
|
|
12640
|
+
ctx.activeInput = resolvedInput instanceof HTMLElement ? resolvedInput : null;
|
|
12641
|
+
}
|
|
12642
|
+
|
|
12643
|
+
return ctx;
|
|
12644
|
+
}
|
|
12645
|
+
|
|
12646
|
+
/**
|
|
12647
|
+
* Wires up a keydown listener that dispatches to strategy[evt.key] or strategy.default.
|
|
12648
|
+
* Handles both sync and async handlers.
|
|
12649
|
+
* @param {HTMLElement} component - The component to attach the listener to.
|
|
12650
|
+
* @param {Object} strategy - Map of key names to handler functions.
|
|
12651
|
+
* @param {Object} [options] - Optional config passed to createDisplayContext.
|
|
12652
|
+
*/
|
|
12653
|
+
function applyKeyboardStrategy$1(component, strategy, options = {}) {
|
|
12654
|
+
component.addEventListener('keydown', async (evt) => {
|
|
12655
|
+
const handler = strategy[evt.key] || strategy.default;
|
|
12656
|
+
if (typeof handler === 'function') {
|
|
12657
|
+
const ctx = createDisplayContext$1(component, options);
|
|
12658
|
+
await handler(component, evt, ctx);
|
|
12659
|
+
}
|
|
12660
|
+
});
|
|
12661
|
+
}
|
|
12662
|
+
|
|
12613
12663
|
var styleCss$2$1 = css`:host{position:fixed;z-index:var(--depth-tooltip, 400);display:none;isolation:isolate}:host dialog{width:auto;max-width:none;height:auto;max-height:none;padding:0;border:none;margin:0;outline:none;transform:translateZ(0)}:host dialog::backdrop{background:transparent}:host(:not([isfullscreen])) dialog{position:relative;inset:unset}:host(:not([isfullscreen])) .container.shape-box{border-radius:unset}:host(:not([isfullscreen])) .container[class*=shape-pill],:host(:not([isfullscreen])) .container[class*=shape-snowflake]{border-radius:30px}:host(:not([isfullscreen])) .container[class*=shape-rounded]{border-radius:16px}:host(:not([matchWidth])) .container{min-width:fit-content}:host([isfullscreen]){position:fixed;top:0;left:0}:host([isfullscreen]) .container{width:100dvw;max-width:none;height:100dvh;max-height:none;border-radius:unset;margin-top:0;box-shadow:unset;overscroll-behavior:contain}:host([isfullscreen]) .container::backdrop{background:var(--ds-color-background-primary, #fff)}:host(:popover-open){position:fixed;overflow:visible;padding:0;border:none;margin:0;background:transparent;inset:unset;outline:none}:host([data-show]){display:flex}:host([common]:not([isfullscreen])) .container,:host([rounded]:not([isfullscreen])) .container{border-radius:var(--ds-border-radius, 0.375rem)}:host([common][isfullscreen]) .container,:host([rounded][isfullscreen]) .container{border-radius:unset;box-shadow:unset}.container{display:inline-block;overflow:auto;box-sizing:border-box;border-radius:var(--ds-border-radius, 0.375rem);margin:var(--ds-size-50, 0.25rem) 0}.util_displayHiddenVisually{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;border:0;margin:-1px;clip-path:inset(50%);white-space:nowrap}`;
|
|
12614
12664
|
|
|
12615
12665
|
var colorCss$2 = css`.container{background-color:var(--ds-auro-dropdownbib-container-color);box-shadow:var(--ds-auro-dropdownbib-boxshadow-color);color:var(--ds-auro-dropdownbib-text-color)}`;
|
|
12616
12666
|
|
|
12617
12667
|
var tokensCss$1$1 = css`:host(:not([ondark])),:host(:not([appearance=inverse])){--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-muted, #676767);--ds-auro-dropdown-trigger-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-hover-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-bold, #585e67);--ds-auro-dropdown-trigger-outline-color: transparent;--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-default, #2a2a2a);--ds-auro-dropdownbib-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-background-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdownbib-container-color: var(--ds-basic-color-surface-default, #ffffff);--ds-auro-dropdownbib-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}:host([ondark]),:host([appearance=inverse]){--ds-auro-dropdown-label-text-color: var(--ds-basic-color-texticon-inverse-muted, #ccd2db);--ds-auro-dropdown-trigger-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-hover-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdown-trigger-border-color: var(--ds-basic-color-border-inverse, #ffffff);--ds-auro-dropdown-trigger-outline-color: transparent;--ds-auro-dropdown-trigger-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-dropdownbib-boxshadow-color: var(--ds-elevation-200, 0px 0px 10px rgba(0, 0, 0, 0.15));--ds-auro-dropdownbib-background-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdownbib-container-color: var(--ds-advanced-color-shared-background-inverse, rgba(255, 255, 255, 0.15));--ds-auro-dropdownbib-text-color: var(--ds-basic-color-texticon-inverse, #ffffff)}`;
|
|
12618
12668
|
|
|
12669
|
+
/**
|
|
12670
|
+
* Creates a keyboard strategy for dialog-specific key handling.
|
|
12671
|
+
* All other keydown behavior is left to the browser's native bubbling path.
|
|
12672
|
+
* @param {HTMLElement} bib - The dropdown bib element.
|
|
12673
|
+
* @returns {Object} Keyboard handlers keyed by `event.key`.
|
|
12674
|
+
*/
|
|
12675
|
+
// eslint-disable-next-line no-unused-vars
|
|
12676
|
+
function createDropdownBibKeyboardStrategy(bib) {
|
|
12677
|
+
return {
|
|
12678
|
+
// eslint-disable-next-line no-unused-vars
|
|
12679
|
+
Enter(_dialog, event) {
|
|
12680
|
+
// Floating UI handles Enter key to open the dropdown
|
|
12681
|
+
},
|
|
12682
|
+
// eslint-disable-next-line no-unused-vars
|
|
12683
|
+
Escape(_dialog, event) {
|
|
12684
|
+
// Floating UI handles Escape key to close the dropdown
|
|
12685
|
+
}
|
|
12686
|
+
};
|
|
12687
|
+
}
|
|
12688
|
+
|
|
12619
12689
|
// Copyright (c) 2020 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
12620
12690
|
// See LICENSE in the project root for license information.
|
|
12621
12691
|
/* eslint-disable max-lines */
|
|
@@ -12740,26 +12810,11 @@ class AuroDropdownBib extends LitElement {
|
|
|
12740
12810
|
},
|
|
12741
12811
|
|
|
12742
12812
|
/**
|
|
12743
|
-
*
|
|
12744
|
-
* aria-activedescendant. The dialog keyboard bridge checks this
|
|
12745
|
-
* flag so that Enter selects the highlighted option instead of
|
|
12746
|
-
* activating the focused interactive element (e.g. the trigger
|
|
12747
|
-
* button, or the bibtemplate close button in fullscreen).
|
|
12813
|
+
* Tracks whether a menu option is currently highlighted.
|
|
12748
12814
|
* @private
|
|
12749
12815
|
*/
|
|
12750
12816
|
hasActiveDescendant: {
|
|
12751
12817
|
type: Boolean
|
|
12752
|
-
},
|
|
12753
|
-
|
|
12754
|
-
/**
|
|
12755
|
-
* When true, the keyboard bridge allows native Tab behavior
|
|
12756
|
-
* instead of intercepting it. Set this for bib consumers
|
|
12757
|
-
* (e.g. counter) whose content contains real focusable elements
|
|
12758
|
-
* that need native Tab navigation.
|
|
12759
|
-
* @private
|
|
12760
|
-
*/
|
|
12761
|
-
nativeFocusableContent: {
|
|
12762
|
-
type: Boolean
|
|
12763
12818
|
}
|
|
12764
12819
|
};
|
|
12765
12820
|
}
|
|
@@ -12829,7 +12884,7 @@ class AuroDropdownBib extends LitElement {
|
|
|
12829
12884
|
|
|
12830
12885
|
const dialog = this.shadowRoot.querySelector('dialog');
|
|
12831
12886
|
this._setupCancelHandler(dialog);
|
|
12832
|
-
|
|
12887
|
+
applyKeyboardStrategy$1(dialog, createDropdownBibKeyboardStrategy());
|
|
12833
12888
|
|
|
12834
12889
|
this.dispatchEvent(new CustomEvent('auro-dropdownbib-connected', {
|
|
12835
12890
|
bubbles: true,
|
|
@@ -12856,98 +12911,6 @@ class AuroDropdownBib extends LitElement {
|
|
|
12856
12911
|
});
|
|
12857
12912
|
}
|
|
12858
12913
|
|
|
12859
|
-
/**
|
|
12860
|
-
* showModal() creates a closed focus scope — keyboard events inside
|
|
12861
|
-
* the dialog's shadow DOM do NOT bubble out to the combobox/select
|
|
12862
|
-
* keydown handlers in the parent shadow DOM. This handler bridges
|
|
12863
|
-
* that gap by re-dispatching navigation keys so they cross the
|
|
12864
|
-
* shadow boundary and reach the menu navigation logic in the parent
|
|
12865
|
-
* component.
|
|
12866
|
-
*
|
|
12867
|
-
* The trade-off: intercepting these keys means native keyboard
|
|
12868
|
-
* behaviors that would normally "just work" must be manually
|
|
12869
|
-
* re-implemented here:
|
|
12870
|
-
*
|
|
12871
|
-
* - Enter on buttons: Custom elements (auro-button) don't get the
|
|
12872
|
-
* native Enter→click that <button> provides, so we call .click()
|
|
12873
|
-
* directly when Enter is pressed on a button-like element.
|
|
12874
|
-
*
|
|
12875
|
-
* - Tab: Intercepted and re-dispatched so parent components
|
|
12876
|
-
* (select/combobox) can select the active option and close the
|
|
12877
|
-
* dialog. The <dialog> provides containment and isolation
|
|
12878
|
-
* (inert background, VoiceOver focus trapping, top layer), while
|
|
12879
|
-
* the content inside is a role="listbox" navigated via
|
|
12880
|
-
* aria-activedescendant (options are not focusable). Tab keyboard
|
|
12881
|
-
* behavior follows listbox conventions (select + close) because
|
|
12882
|
-
* the dialog's native Tab trap only cycles between the close
|
|
12883
|
-
* button and browser chrome.
|
|
12884
|
-
*
|
|
12885
|
-
* - Escape: The native <dialog> fires a `cancel` event on ESC
|
|
12886
|
-
* (handled by _setupCancelHandler), so the re-dispatched Escape
|
|
12887
|
-
* is a secondary path for parent components that also listen for
|
|
12888
|
-
* Escape keydown.
|
|
12889
|
-
*
|
|
12890
|
-
* @param {HTMLDialogElement} dialog - The dialog element to attach the keyboard bridge to.
|
|
12891
|
-
* @private
|
|
12892
|
-
*/
|
|
12893
|
-
_setupKeyboardBridge(dialog) {
|
|
12894
|
-
const navKeys = new Set([
|
|
12895
|
-
'ArrowUp',
|
|
12896
|
-
'ArrowDown',
|
|
12897
|
-
'Enter',
|
|
12898
|
-
'Escape',
|
|
12899
|
-
'Tab'
|
|
12900
|
-
]);
|
|
12901
|
-
|
|
12902
|
-
dialog.addEventListener('keydown', (event) => {
|
|
12903
|
-
if (!navKeys.has(event.key)) {
|
|
12904
|
-
return;
|
|
12905
|
-
}
|
|
12906
|
-
|
|
12907
|
-
// Custom elements (auro-button) don't get the native Enter→click
|
|
12908
|
-
// behavior that <button> has. Find the button in the composed path
|
|
12909
|
-
// and click it directly — but only when no menu option is
|
|
12910
|
-
// highlighted. In fullscreen mode focus stays on the close button
|
|
12911
|
-
// while arrow keys move the active-descendant highlight through
|
|
12912
|
-
// the listbox. If the user presses Enter with an option
|
|
12913
|
-
// highlighted, the intent is to select that option, not to click
|
|
12914
|
-
// the close button. In that case we fall through and bridge the
|
|
12915
|
-
// Enter key to the parent component's keyboard strategy.
|
|
12916
|
-
if (event.key === 'Enter') {
|
|
12917
|
-
if (!this.hasActiveDescendant) {
|
|
12918
|
-
const buttonSelector = 'button, [role="button"], auro-button, [auro-button]';
|
|
12919
|
-
const btn = event.composedPath().find((el) => el.matches && el.matches(buttonSelector));
|
|
12920
|
-
if (btn) {
|
|
12921
|
-
event.preventDefault();
|
|
12922
|
-
event.stopPropagation();
|
|
12923
|
-
btn.click();
|
|
12924
|
-
return;
|
|
12925
|
-
}
|
|
12926
|
-
}
|
|
12927
|
-
}
|
|
12928
|
-
|
|
12929
|
-
// Allow native Tab when the bib contains focusable content
|
|
12930
|
-
// (e.g. counter buttons) that needs normal Tab navigation.
|
|
12931
|
-
if (event.key === 'Tab' && this.nativeFocusableContent) {
|
|
12932
|
-
return;
|
|
12933
|
-
}
|
|
12934
|
-
|
|
12935
|
-
event.preventDefault();
|
|
12936
|
-
event.stopPropagation();
|
|
12937
|
-
const newEvent = new KeyboardEvent('keydown', {
|
|
12938
|
-
key: event.key,
|
|
12939
|
-
code: event.code,
|
|
12940
|
-
shiftKey: event.shiftKey,
|
|
12941
|
-
altKey: event.altKey,
|
|
12942
|
-
ctrlKey: event.ctrlKey,
|
|
12943
|
-
metaKey: event.metaKey,
|
|
12944
|
-
bubbles: true,
|
|
12945
|
-
composed: true,
|
|
12946
|
-
cancelable: true
|
|
12947
|
-
});
|
|
12948
|
-
this.dispatchEvent(newEvent);
|
|
12949
|
-
});
|
|
12950
|
-
}
|
|
12951
12914
|
|
|
12952
12915
|
/**
|
|
12953
12916
|
* Blocks touch-driven page scroll while a fullscreen modal dialog is open.
|
|
@@ -13322,7 +13285,7 @@ let AuroHelpText$2 = class AuroHelpText extends LitElement {
|
|
|
13322
13285
|
}
|
|
13323
13286
|
};
|
|
13324
13287
|
|
|
13325
|
-
var formkitVersion$1 = '
|
|
13288
|
+
var formkitVersion$1 = '202604012043';
|
|
13326
13289
|
|
|
13327
13290
|
let AuroElement$2 = class AuroElement extends LitElement {
|
|
13328
13291
|
static get properties() {
|
|
@@ -13503,7 +13466,6 @@ class AuroDropdown extends AuroElement$2 {
|
|
|
13503
13466
|
this.appearance = 'default';
|
|
13504
13467
|
this.chevron = false;
|
|
13505
13468
|
this.disabled = false;
|
|
13506
|
-
this.disableFocusTrap = false;
|
|
13507
13469
|
this.error = false;
|
|
13508
13470
|
this.tabIndex = 0;
|
|
13509
13471
|
this.noToggle = false;
|
|
@@ -13601,9 +13563,8 @@ class AuroDropdown extends AuroElement$2 {
|
|
|
13601
13563
|
// showModal() fires asynchronously via Lit's update cycle, which
|
|
13602
13564
|
// falls outside the user activation window and causes iOS to
|
|
13603
13565
|
// dismiss the keyboard.
|
|
13604
|
-
if (this.
|
|
13605
|
-
|
|
13606
|
-
this.bibElement.value.open(useModal);
|
|
13566
|
+
if (this.bibElement && this.bibElement.value) {
|
|
13567
|
+
this.bibElement.value.open(this.isBibFullscreen);
|
|
13607
13568
|
}
|
|
13608
13569
|
}
|
|
13609
13570
|
|
|
@@ -13716,14 +13677,6 @@ class AuroDropdown extends AuroElement$2 {
|
|
|
13716
13677
|
reflect: true
|
|
13717
13678
|
},
|
|
13718
13679
|
|
|
13719
|
-
/**
|
|
13720
|
-
* If declared, the focus trap inside of bib will be turned off.
|
|
13721
|
-
*/
|
|
13722
|
-
disableFocusTrap: {
|
|
13723
|
-
type: Boolean,
|
|
13724
|
-
reflect: true
|
|
13725
|
-
},
|
|
13726
|
-
|
|
13727
13680
|
/**
|
|
13728
13681
|
* @private
|
|
13729
13682
|
*/
|
|
@@ -13997,7 +13950,7 @@ class AuroDropdown extends AuroElement$2 {
|
|
|
13997
13950
|
if (this.isPopoverVisible) {
|
|
13998
13951
|
// Fullscreen: use showModal() for native accessibility (inert outside, focus trap)
|
|
13999
13952
|
// Desktop: use show() for Floating UI positioning + FocusTrap for focus management
|
|
14000
|
-
const useModal = this.isBibFullscreen
|
|
13953
|
+
const useModal = this.isBibFullscreen;
|
|
14001
13954
|
this.bibElement.value.open(useModal);
|
|
14002
13955
|
} else {
|
|
14003
13956
|
this.bibElement.value.close();
|
|
@@ -14007,7 +13960,7 @@ class AuroDropdown extends AuroElement$2 {
|
|
|
14007
13960
|
// When fullscreen strategy changes while open, re-open dialog with correct mode
|
|
14008
13961
|
// (e.g. resizing from desktop → mobile while dropdown is open)
|
|
14009
13962
|
if (changedProperties.has('isBibFullscreen') && this.isPopoverVisible && this.bibElement.value) {
|
|
14010
|
-
const useModal = this.isBibFullscreen
|
|
13963
|
+
const useModal = this.isBibFullscreen;
|
|
14011
13964
|
this.bibElement.value.close();
|
|
14012
13965
|
this.bibElement.value.open(useModal);
|
|
14013
13966
|
}
|
|
@@ -14119,7 +14072,7 @@ class AuroDropdown extends AuroElement$2 {
|
|
|
14119
14072
|
* @private
|
|
14120
14073
|
*/
|
|
14121
14074
|
updateFocusTrap() {
|
|
14122
|
-
if (this.isPopoverVisible
|
|
14075
|
+
if (this.isPopoverVisible) {
|
|
14123
14076
|
if (!this.isBibFullscreen) {
|
|
14124
14077
|
// Desktop: show() doesn't trap focus, so use FocusTrap
|
|
14125
14078
|
this.focusTrap = new FocusTrap(this.bibContent);
|
|
@@ -21079,7 +21032,7 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
|
|
|
21079
21032
|
}
|
|
21080
21033
|
};
|
|
21081
21034
|
|
|
21082
|
-
var formkitVersion = '
|
|
21035
|
+
var formkitVersion = '202604012043';
|
|
21083
21036
|
|
|
21084
21037
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
21085
21038
|
// See LICENSE in the project root for license information.
|
|
@@ -24242,7 +24195,6 @@ class AuroDatePicker extends AuroElement {
|
|
|
24242
24195
|
.size="${this.size}"
|
|
24243
24196
|
class="${classMap(dropdownElementClassMap)}"
|
|
24244
24197
|
disableEventShow
|
|
24245
|
-
disableFocusTrap
|
|
24246
24198
|
for="dropdownMenu"
|
|
24247
24199
|
part="dropdown"
|
|
24248
24200
|
>
|
|
@@ -14,7 +14,6 @@ The `auro-dropdown` element provides a way to place content in a bib that can be
|
|
|
14
14
|
| [autoPlacement](#autoPlacement) | `autoPlacement` | `boolean` | | If declared, bib's position will be automatically calculated where to appear. |
|
|
15
15
|
| [chevron](#chevron) | `chevron` | `boolean` | | If declared, the dropdown displays a chevron on the right. |
|
|
16
16
|
| [disableEventShow](#disableEventShow) | `disableEventShow` | `boolean` | | If declared, the dropdown will only show by calling the API .show() public method. |
|
|
17
|
-
| [disableFocusTrap](#disableFocusTrap) | `disableFocusTrap` | `boolean` | | If declared, the focus trap inside of bib will be turned off. |
|
|
18
17
|
| [disabled](#disabled) | `disabled` | `boolean` | | If declared, the dropdown is not interactive. |
|
|
19
18
|
| [error](#error) | `error` | `boolean` | | If declared, will apply error UI to the dropdown. |
|
|
20
19
|
| [errorMessage](#errorMessage) | `errorMessage` | `string` | "undefined" | Contains the help text message for the current validity error. |
|