@aurodesignsystem-dev/auro-formkit 0.0.0-pr1603.4 → 0.0.0-pr1604.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/checkbox/demo/customize.min.js +1 -1
- package/components/checkbox/demo/getting-started.min.js +1 -1
- package/components/checkbox/demo/index.min.js +1 -1
- package/components/checkbox/dist/index.js +1 -1
- package/components/checkbox/dist/registered.js +1 -1
- package/components/combobox/demo/customize.min.js +4 -102
- package/components/combobox/demo/getting-started.md +49 -0
- package/components/combobox/demo/getting-started.min.js +23 -102
- package/components/combobox/demo/index.min.js +4 -102
- package/components/combobox/dist/auro-combobox.d.ts +0 -22
- package/components/combobox/dist/index.js +4 -86
- package/components/combobox/dist/registered.js +4 -86
- package/components/counter/demo/api.md +2 -0
- package/components/counter/demo/customize.min.js +26 -2
- package/components/counter/demo/getting-started.html +3 -1
- package/components/counter/demo/getting-started.md +49 -0
- package/components/counter/demo/getting-started.min.js +8492 -0
- package/components/counter/demo/index.min.js +26 -2
- package/components/counter/dist/auro-counter-group.d.ts +6 -0
- package/components/counter/dist/auro-counter.d.ts +6 -0
- package/components/counter/dist/index.js +26 -2
- package/components/counter/dist/registered.js +26 -2
- package/components/datepicker/demo/customize.min.js +3 -3
- package/components/datepicker/demo/getting-started.html +3 -1
- package/components/datepicker/demo/getting-started.md +39 -0
- package/components/datepicker/demo/getting-started.min.js +37626 -0
- package/components/datepicker/demo/index.min.js +3 -3
- package/components/datepicker/dist/index.js +3 -3
- package/components/datepicker/dist/registered.js +3 -3
- package/components/dropdown/demo/customize.min.js +1 -1
- package/components/dropdown/demo/getting-started.min.js +2 -2
- package/components/dropdown/demo/index.min.js +1 -1
- package/components/dropdown/dist/index.js +1 -1
- package/components/dropdown/dist/registered.js +1 -1
- package/components/form/demo/customize.min.js +44 -113
- package/components/form/demo/getting-started.min.js +44 -113
- package/components/form/demo/index.min.js +44 -113
- package/components/form/demo/registerDemoDeps.min.js +38 -112
- package/components/form/dist/index.js +6 -1
- package/components/form/dist/registered.js +6 -1
- package/components/input/demo/customize.md +0 -37
- package/components/input/demo/customize.min.js +1 -10
- package/components/input/demo/getting-started.md +33 -0
- package/components/input/demo/getting-started.min.js +21 -1
- package/components/input/demo/index.min.js +1 -1
- package/components/input/dist/index.js +1 -1
- package/components/input/dist/registered.js +1 -1
- package/components/menu/demo/index.min.js +0 -16
- package/components/menu/dist/index.js +0 -16
- package/components/menu/dist/registered.js +0 -16
- package/components/radio/demo/customize.min.js +1 -1
- package/components/radio/demo/getting-started.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/customize.min.js +2 -18
- package/components/select/demo/getting-started.md +49 -0
- package/components/select/demo/getting-started.min.js +24 -19
- package/components/select/demo/index.min.js +2 -18
- package/components/select/dist/index.js +2 -2
- package/components/select/dist/registered.js +2 -2
- package/custom-elements.json +1492 -1492
- package/package.json +1 -1
|
@@ -1284,7 +1284,7 @@ class AuroHelpText extends i$2 {
|
|
|
1284
1284
|
}
|
|
1285
1285
|
}
|
|
1286
1286
|
|
|
1287
|
-
var formkitVersion = '
|
|
1287
|
+
var formkitVersion = '202609011830';
|
|
1288
1288
|
|
|
1289
1289
|
// Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
|
|
1290
1290
|
// See LICENSE in the project root for license information.
|
|
@@ -1284,7 +1284,7 @@ class AuroHelpText extends i$2 {
|
|
|
1284
1284
|
}
|
|
1285
1285
|
}
|
|
1286
1286
|
|
|
1287
|
-
var formkitVersion = '
|
|
1287
|
+
var formkitVersion = '202609011830';
|
|
1288
1288
|
|
|
1289
1289
|
// Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
|
|
1290
1290
|
// See LICENSE in the project root for license information.
|
|
@@ -1284,7 +1284,7 @@ class AuroHelpText extends i$2 {
|
|
|
1284
1284
|
}
|
|
1285
1285
|
}
|
|
1286
1286
|
|
|
1287
|
-
var formkitVersion = '
|
|
1287
|
+
var formkitVersion = '202609011830';
|
|
1288
1288
|
|
|
1289
1289
|
// Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
|
|
1290
1290
|
// See LICENSE in the project root for license information.
|
|
@@ -1237,7 +1237,7 @@ class AuroHelpText extends LitElement {
|
|
|
1237
1237
|
}
|
|
1238
1238
|
}
|
|
1239
1239
|
|
|
1240
|
-
var formkitVersion = '
|
|
1240
|
+
var formkitVersion = '202609011830';
|
|
1241
1241
|
|
|
1242
1242
|
// Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
|
|
1243
1243
|
// See LICENSE in the project root for license information.
|
|
@@ -1237,7 +1237,7 @@ class AuroHelpText extends LitElement {
|
|
|
1237
1237
|
}
|
|
1238
1238
|
}
|
|
1239
1239
|
|
|
1240
|
-
var formkitVersion = '
|
|
1240
|
+
var formkitVersion = '202609011830';
|
|
1241
1241
|
|
|
1242
1242
|
// Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
|
|
1243
1243
|
// See LICENSE in the project root for license information.
|
|
@@ -5066,7 +5066,7 @@ let AuroHelpText$2 = class AuroHelpText extends i$3 {
|
|
|
5066
5066
|
}
|
|
5067
5067
|
};
|
|
5068
5068
|
|
|
5069
|
-
var formkitVersion$2 = '
|
|
5069
|
+
var formkitVersion$2 = '202609011830';
|
|
5070
5070
|
|
|
5071
5071
|
/**
|
|
5072
5072
|
* AuroElement is the shared base class for layout-aware Auro form components.
|
|
@@ -18935,7 +18935,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$3 {
|
|
|
18935
18935
|
}
|
|
18936
18936
|
};
|
|
18937
18937
|
|
|
18938
|
-
var formkitVersion$1 = '
|
|
18938
|
+
var formkitVersion$1 = '202609011830';
|
|
18939
18939
|
|
|
18940
18940
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
18941
18941
|
// See LICENSE in the project root for license information.
|
|
@@ -20127,7 +20127,7 @@ class AuroBibtemplate extends i$3 {
|
|
|
20127
20127
|
}
|
|
20128
20128
|
}
|
|
20129
20129
|
|
|
20130
|
-
var formkitVersion = '
|
|
20130
|
+
var formkitVersion = '202609011830';
|
|
20131
20131
|
|
|
20132
20132
|
var styleCss$3 = i$6`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}:host{display:block;text-align:left}:host [auro-dropdown]{--ds-auro-dropdown-trigger-background-color: transparent}:host #inputInBib::part(wrapper){box-shadow:none}:host #inputInBib::part(accent-left){display:none}:host([layout*=classic]) [auro-input]{width:100%}:host([layout*=classic]) [auro-input]::part(helpText){display:none}:host([layout*=classic]) #slotHolder{display:none}`;
|
|
20133
20133
|
|
|
@@ -20568,11 +20568,6 @@ class AuroCombobox extends AuroElement {
|
|
|
20568
20568
|
this.behavior = "suggestion";
|
|
20569
20569
|
this.clearBtnFocused = false;
|
|
20570
20570
|
|
|
20571
|
-
// One-shot: set when the input's clear button is activated so the
|
|
20572
|
-
// SPA-preselect guard in handleInputValueChange doesn't swallow the
|
|
20573
|
-
// genuine clear (AB#1634257).
|
|
20574
|
-
this._clearBtnActivated = false;
|
|
20575
|
-
|
|
20576
20571
|
// Defaults that effect the overall layout of the combobox
|
|
20577
20572
|
this.checkmark = false;
|
|
20578
20573
|
this.dvInputOnly = false;
|
|
@@ -21530,13 +21525,6 @@ class AuroCombobox extends AuroElement {
|
|
|
21530
21525
|
this.bibtemplate = this.dropdown.querySelector(this.bibtemplateTag._$litStatic$);
|
|
21531
21526
|
this.inputInBib = this.bibtemplate.querySelector(this.inputTag._$litStatic$);
|
|
21532
21527
|
|
|
21533
|
-
// Mirror the trigger's clear-button tracking onto the fullscreen bib input
|
|
21534
|
-
// so clearing there also fully resets the combobox (AB#1634257). See
|
|
21535
|
-
// trackClearBtnActivation for why this must run in the capture phase.
|
|
21536
|
-
if (this.inputInBib && this.inputInBib !== this.input) {
|
|
21537
|
-
this.trackClearBtnActivation(this.inputInBib);
|
|
21538
|
-
}
|
|
21539
|
-
|
|
21540
21528
|
// Pass label text to the dropdown bib for accessible dialog naming
|
|
21541
21529
|
const labelElement = this.querySelector('[slot="label"]');
|
|
21542
21530
|
if (labelElement) {
|
|
@@ -21922,52 +21910,6 @@ class AuroCombobox extends AuroElement {
|
|
|
21922
21910
|
this.clearBtnFocused = false;
|
|
21923
21911
|
}
|
|
21924
21912
|
});
|
|
21925
|
-
|
|
21926
|
-
this.trackClearBtnActivation(this.input);
|
|
21927
|
-
}
|
|
21928
|
-
|
|
21929
|
-
/**
|
|
21930
|
-
* Flags genuine clear-button activations on an auro-input so the SPA-preselect
|
|
21931
|
-
* guard in handleInputValueChange doesn't swallow them.
|
|
21932
|
-
*
|
|
21933
|
-
* The auro-input clear button fires an `isProgrammatic` input event (via
|
|
21934
|
-
* notifyValueChanged) that is indistinguishable in shape from the
|
|
21935
|
-
* SPA-preselect echo that guard bails on (isProgrammatic + set value + empty
|
|
21936
|
-
* input). Without this one-shot flag, clicking clear would leave
|
|
21937
|
-
* this.value/optionSelected stale (AB#1634257).
|
|
21938
|
-
*
|
|
21939
|
-
* Delegated on the shadow root so it works regardless of when .clearBtn
|
|
21940
|
-
* renders (it only exists after a value is set), and covers both real clicks
|
|
21941
|
-
* and programmatic clearBtn.click() (which no focusin precedes). Registered in
|
|
21942
|
-
* the CAPTURE phase so the flag is set BEFORE the button's own @click
|
|
21943
|
-
* (handleClickClear) fires its synchronous input event — which is when
|
|
21944
|
-
* handleInputValueChange reads the flag.
|
|
21945
|
-
* @private
|
|
21946
|
-
* @param {Element} inputEl - The auro-input whose clear button to track.
|
|
21947
|
-
* @returns {void}
|
|
21948
|
-
*/
|
|
21949
|
-
trackClearBtnActivation(inputEl) {
|
|
21950
|
-
if (!inputEl || !inputEl.shadowRoot) {
|
|
21951
|
-
return;
|
|
21952
|
-
}
|
|
21953
|
-
inputEl.shadowRoot.addEventListener('click', (event) => {
|
|
21954
|
-
if (event.target.closest('.clearBtn')) {
|
|
21955
|
-
this._clearBtnActivated = true;
|
|
21956
|
-
|
|
21957
|
-
// Bound the flag's lifetime to this synchronous clear -> input window.
|
|
21958
|
-
// auro-input's handleClickClear fires its input event synchronously
|
|
21959
|
-
// (before any macrotask runs), so handleInputValueChange consumes the
|
|
21960
|
-
// flag first and this reset is a harmless no-op. It only does real work
|
|
21961
|
-
// if that input event never arrives (e.g. auro-input throws mid-clear),
|
|
21962
|
-
// guaranteeing the flag can't survive to be misread as a genuine clear
|
|
21963
|
-
// by a later unrelated event such as an SPA-preselect echo (AB#1634257).
|
|
21964
|
-
// Scheduled via _scheduleTimer so disconnectedCallback cancels it if the
|
|
21965
|
-
// component tears down inside that window.
|
|
21966
|
-
this._scheduleTimer(() => {
|
|
21967
|
-
this._clearBtnActivated = false;
|
|
21968
|
-
}, 0);
|
|
21969
|
-
}
|
|
21970
|
-
}, true);
|
|
21971
21913
|
}
|
|
21972
21914
|
|
|
21973
21915
|
/**
|
|
@@ -22009,17 +21951,6 @@ class AuroCombobox extends AuroElement {
|
|
|
22009
21951
|
* @returns {void}
|
|
22010
21952
|
*/
|
|
22011
21953
|
handleInputValueChange(event) {
|
|
22012
|
-
// Consume the one-shot clear-button flag on EVERY entry, before any branch
|
|
22013
|
-
// below can early-return. trackClearBtnActivation sets it in the capture
|
|
22014
|
-
// phase right before auro-input's clear button fires its synchronous input
|
|
22015
|
-
// event; reading and immediately clearing it here guarantees the flag never
|
|
22016
|
-
// survives a handleInputValueChange call to leak into a later event (e.g.
|
|
22017
|
-
// the bib branch bailing at _syncingDisplayValue, or an SPA-preselect echo)
|
|
22018
|
-
// where it would defeat the guard below. Held in a local so that guard can
|
|
22019
|
-
// still tell a genuine clear from the init-render echo (AB#1634257).
|
|
22020
|
-
const clearBtnActivated = this._clearBtnActivated;
|
|
22021
|
-
this._clearBtnActivated = false;
|
|
22022
|
-
|
|
22023
21954
|
// When the event comes from the fullscreen bib input, sync the value to
|
|
22024
21955
|
// the trigger input. Setting trigger.value triggers Lit's updated()
|
|
22025
21956
|
// (async, microtask) which fires notifyValueChanged() → another 'input'
|
|
@@ -22067,12 +21998,7 @@ class AuroCombobox extends AuroElement {
|
|
|
22067
21998
|
// to the exact shape of that echo (isProgrammatic + non-empty combobox
|
|
22068
21999
|
// value + empty input.value) so it doesn't affect the swap/typed paths
|
|
22069
22000
|
// where value/input already track each other through the sync helpers.
|
|
22070
|
-
|
|
22071
|
-
// empty input) but is a genuine user clear that MUST reset this.value and
|
|
22072
|
-
// optionSelected below. clearBtnActivated (consumed at the top of this
|
|
22073
|
-
// method) is true only for that genuine clear, so only the real
|
|
22074
|
-
// SPA-preselect echo bails (AB#1634257).
|
|
22075
|
-
if (event && event.isProgrammatic && this.value && !this.input.value && !clearBtnActivated) {
|
|
22001
|
+
if (event && event.isProgrammatic && this.value && !this.input.value) {
|
|
22076
22002
|
return;
|
|
22077
22003
|
}
|
|
22078
22004
|
|
|
@@ -22315,14 +22241,6 @@ class AuroCombobox extends AuroElement {
|
|
|
22315
22241
|
}
|
|
22316
22242
|
if (this.menu.value || this.menu.optionSelected) {
|
|
22317
22243
|
this.menu.reset();
|
|
22318
|
-
} else {
|
|
22319
|
-
// The menu's selection properties are already cleared, but option
|
|
22320
|
-
// elements can still carry a stale `selected` attribute (e.g. the menu
|
|
22321
|
-
// options were rebuilt after the value was set, orphaning the DOM from
|
|
22322
|
-
// the now-null optionSelected). reset() is skipped above in that case,
|
|
22323
|
-
// so re-sync the option DOM directly to guarantee no option renders as
|
|
22324
|
-
// selected once the field is cleared (AB#1634259).
|
|
22325
|
-
this.menu.clearSelection();
|
|
22326
22244
|
}
|
|
22327
22245
|
} finally {
|
|
22328
22246
|
this._clearing = false;
|
|
@@ -23774,22 +23692,6 @@ class AuroMenu extends AuroElement {
|
|
|
23774
23692
|
this.value = undefined;
|
|
23775
23693
|
this._selectedKey = undefined;
|
|
23776
23694
|
this._index = -1;
|
|
23777
|
-
|
|
23778
|
-
// Eagerly sync the option DOM to the now-empty selection. Nulling the
|
|
23779
|
-
// reactive properties above normally schedules updated() → updateItemsState,
|
|
23780
|
-
// but that only runs when a property actually changes. If an option still
|
|
23781
|
-
// carries a stale `selected`/`aria-selected` attribute while these
|
|
23782
|
-
// properties are already undefined (e.g. options were rebuilt after a value
|
|
23783
|
-
// was set), no re-render fires and the option keeps rendering as selected.
|
|
23784
|
-
// Strip that state now so no option looks selected after a clear (AB#1634259).
|
|
23785
|
-
// Intentionally leaves `active`/`optionActive` untouched so a highlighted
|
|
23786
|
-
// option remains keyboard-re-selectable after emptying the value (AB#1606433).
|
|
23787
|
-
this.updateItemsState(new Map([
|
|
23788
|
-
[
|
|
23789
|
-
'optionSelected',
|
|
23790
|
-
true
|
|
23791
|
-
]
|
|
23792
|
-
]));
|
|
23793
23695
|
}
|
|
23794
23696
|
|
|
23795
23697
|
/**
|
|
@@ -394,6 +394,55 @@ Ensure your `tsconfig.json` uses `"moduleResolution": "bundler"` so TypeScript c
|
|
|
394
394
|
<p>Programmatically moves focus to the combobox trigger input.</p>
|
|
395
395
|
<auro-header level="3" id="reset">reset()</auro-header>
|
|
396
396
|
<p>Resets the component to its initial state, clearing the value, input text, and validation state.</p>
|
|
397
|
+
<div class="exampleWrapper">
|
|
398
|
+
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/reset-state.html) -->
|
|
399
|
+
<!-- The below content is automatically added from ./../apiExamples/reset-state.html -->
|
|
400
|
+
<auro-button id="resetStateBtn">Reset</auro-button>
|
|
401
|
+
<br /><br />
|
|
402
|
+
<auro-combobox id="resetStateExample" required>
|
|
403
|
+
<span slot="bib.fullscreen.headline">Bib Header</span>
|
|
404
|
+
<span slot="label">Name</span>
|
|
405
|
+
<auro-menu>
|
|
406
|
+
<auro-menuoption value="Apples" id="option-0">Apples</auro-menuoption>
|
|
407
|
+
<auro-menuoption value="Oranges" id="option-1">Oranges</auro-menuoption>
|
|
408
|
+
<auro-menuoption value="Peaches" id="option-2">Peaches</auro-menuoption>
|
|
409
|
+
<auro-menuoption value="Grapes" id="option-3">Grapes</auro-menuoption>
|
|
410
|
+
<auro-menuoption value="Cherries" id="option-4">Cherries</auro-menuoption>
|
|
411
|
+
<auro-menuoption static nomatch>No matching option</auro-menuoption>
|
|
412
|
+
</auro-menu>
|
|
413
|
+
</auro-combobox>
|
|
414
|
+
<!-- AURO-GENERATED-CONTENT:END -->
|
|
415
|
+
</div>
|
|
416
|
+
<auro-accordion alignRight>
|
|
417
|
+
<span slot="trigger">See code</span>
|
|
418
|
+
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/reset-state.html) -->
|
|
419
|
+
<!-- The below code snippet is automatically added from ./../apiExamples/reset-state.html -->
|
|
420
|
+
<pre class="language-html"><code class="language-html"><auro-button id="resetStateBtn">Reset</auro-button>
|
|
421
|
+
<br /><br />
|
|
422
|
+
<auro-combobox id="resetStateExample" required>
|
|
423
|
+
<span slot="bib.fullscreen.headline">Bib Header</span>
|
|
424
|
+
<span slot="label">Name</span>
|
|
425
|
+
<auro-menu>
|
|
426
|
+
<auro-menuoption value="Apples" id="option-0">Apples</auro-menuoption>
|
|
427
|
+
<auro-menuoption value="Oranges" id="option-1">Oranges</auro-menuoption>
|
|
428
|
+
<auro-menuoption value="Peaches" id="option-2">Peaches</auro-menuoption>
|
|
429
|
+
<auro-menuoption value="Grapes" id="option-3">Grapes</auro-menuoption>
|
|
430
|
+
<auro-menuoption value="Cherries" id="option-4">Cherries</auro-menuoption>
|
|
431
|
+
<auro-menuoption static nomatch>No matching option</auro-menuoption>
|
|
432
|
+
</auro-menu>
|
|
433
|
+
</auro-combobox></code></pre>
|
|
434
|
+
<!-- AURO-GENERATED-CONTENT:END -->
|
|
435
|
+
<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/reset-state.js) -->
|
|
436
|
+
<!-- The below code snippet is automatically added from ./../apiExamples/reset-state.js -->
|
|
437
|
+
<pre class="language-js"><code class="language-js">export function resetStateExample() {
|
|
438
|
+
const elem = document.querySelector('#resetStateExample');
|
|
439
|
+
|
|
440
|
+
document.querySelector('#resetStateBtn').addEventListener('click', () => {
|
|
441
|
+
elem.reset();
|
|
442
|
+
});
|
|
443
|
+
}</code></pre>
|
|
444
|
+
<!-- AURO-GENERATED-CONTENT:END -->
|
|
445
|
+
</auro-accordion>
|
|
397
446
|
<auro-header level="3" id="validate">validate()</auro-header>
|
|
398
447
|
<p>Triggers validation on the component. Pass <code>true</code> to force validation even when <code>noValidate</code> is set.</p>
|
|
399
448
|
<auro-header level="3" id="hideBib">hideBib()</auro-header>
|
|
@@ -5066,7 +5066,7 @@ let AuroHelpText$2 = class AuroHelpText extends i$3 {
|
|
|
5066
5066
|
}
|
|
5067
5067
|
};
|
|
5068
5068
|
|
|
5069
|
-
var formkitVersion$2 = '
|
|
5069
|
+
var formkitVersion$2 = '202609011830';
|
|
5070
5070
|
|
|
5071
5071
|
/**
|
|
5072
5072
|
* AuroElement is the shared base class for layout-aware Auro form components.
|
|
@@ -18935,7 +18935,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$3 {
|
|
|
18935
18935
|
}
|
|
18936
18936
|
};
|
|
18937
18937
|
|
|
18938
|
-
var formkitVersion$1 = '
|
|
18938
|
+
var formkitVersion$1 = '202609011830';
|
|
18939
18939
|
|
|
18940
18940
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
18941
18941
|
// See LICENSE in the project root for license information.
|
|
@@ -20127,7 +20127,7 @@ class AuroBibtemplate extends i$3 {
|
|
|
20127
20127
|
}
|
|
20128
20128
|
}
|
|
20129
20129
|
|
|
20130
|
-
var formkitVersion = '
|
|
20130
|
+
var formkitVersion = '202609011830';
|
|
20131
20131
|
|
|
20132
20132
|
var styleCss$3 = i$6`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}:host{display:block;text-align:left}:host [auro-dropdown]{--ds-auro-dropdown-trigger-background-color: transparent}:host #inputInBib::part(wrapper){box-shadow:none}:host #inputInBib::part(accent-left){display:none}:host([layout*=classic]) [auro-input]{width:100%}:host([layout*=classic]) [auro-input]::part(helpText){display:none}:host([layout*=classic]) #slotHolder{display:none}`;
|
|
20133
20133
|
|
|
@@ -20568,11 +20568,6 @@ class AuroCombobox extends AuroElement {
|
|
|
20568
20568
|
this.behavior = "suggestion";
|
|
20569
20569
|
this.clearBtnFocused = false;
|
|
20570
20570
|
|
|
20571
|
-
// One-shot: set when the input's clear button is activated so the
|
|
20572
|
-
// SPA-preselect guard in handleInputValueChange doesn't swallow the
|
|
20573
|
-
// genuine clear (AB#1634257).
|
|
20574
|
-
this._clearBtnActivated = false;
|
|
20575
|
-
|
|
20576
20571
|
// Defaults that effect the overall layout of the combobox
|
|
20577
20572
|
this.checkmark = false;
|
|
20578
20573
|
this.dvInputOnly = false;
|
|
@@ -21530,13 +21525,6 @@ class AuroCombobox extends AuroElement {
|
|
|
21530
21525
|
this.bibtemplate = this.dropdown.querySelector(this.bibtemplateTag._$litStatic$);
|
|
21531
21526
|
this.inputInBib = this.bibtemplate.querySelector(this.inputTag._$litStatic$);
|
|
21532
21527
|
|
|
21533
|
-
// Mirror the trigger's clear-button tracking onto the fullscreen bib input
|
|
21534
|
-
// so clearing there also fully resets the combobox (AB#1634257). See
|
|
21535
|
-
// trackClearBtnActivation for why this must run in the capture phase.
|
|
21536
|
-
if (this.inputInBib && this.inputInBib !== this.input) {
|
|
21537
|
-
this.trackClearBtnActivation(this.inputInBib);
|
|
21538
|
-
}
|
|
21539
|
-
|
|
21540
21528
|
// Pass label text to the dropdown bib for accessible dialog naming
|
|
21541
21529
|
const labelElement = this.querySelector('[slot="label"]');
|
|
21542
21530
|
if (labelElement) {
|
|
@@ -21922,52 +21910,6 @@ class AuroCombobox extends AuroElement {
|
|
|
21922
21910
|
this.clearBtnFocused = false;
|
|
21923
21911
|
}
|
|
21924
21912
|
});
|
|
21925
|
-
|
|
21926
|
-
this.trackClearBtnActivation(this.input);
|
|
21927
|
-
}
|
|
21928
|
-
|
|
21929
|
-
/**
|
|
21930
|
-
* Flags genuine clear-button activations on an auro-input so the SPA-preselect
|
|
21931
|
-
* guard in handleInputValueChange doesn't swallow them.
|
|
21932
|
-
*
|
|
21933
|
-
* The auro-input clear button fires an `isProgrammatic` input event (via
|
|
21934
|
-
* notifyValueChanged) that is indistinguishable in shape from the
|
|
21935
|
-
* SPA-preselect echo that guard bails on (isProgrammatic + set value + empty
|
|
21936
|
-
* input). Without this one-shot flag, clicking clear would leave
|
|
21937
|
-
* this.value/optionSelected stale (AB#1634257).
|
|
21938
|
-
*
|
|
21939
|
-
* Delegated on the shadow root so it works regardless of when .clearBtn
|
|
21940
|
-
* renders (it only exists after a value is set), and covers both real clicks
|
|
21941
|
-
* and programmatic clearBtn.click() (which no focusin precedes). Registered in
|
|
21942
|
-
* the CAPTURE phase so the flag is set BEFORE the button's own @click
|
|
21943
|
-
* (handleClickClear) fires its synchronous input event — which is when
|
|
21944
|
-
* handleInputValueChange reads the flag.
|
|
21945
|
-
* @private
|
|
21946
|
-
* @param {Element} inputEl - The auro-input whose clear button to track.
|
|
21947
|
-
* @returns {void}
|
|
21948
|
-
*/
|
|
21949
|
-
trackClearBtnActivation(inputEl) {
|
|
21950
|
-
if (!inputEl || !inputEl.shadowRoot) {
|
|
21951
|
-
return;
|
|
21952
|
-
}
|
|
21953
|
-
inputEl.shadowRoot.addEventListener('click', (event) => {
|
|
21954
|
-
if (event.target.closest('.clearBtn')) {
|
|
21955
|
-
this._clearBtnActivated = true;
|
|
21956
|
-
|
|
21957
|
-
// Bound the flag's lifetime to this synchronous clear -> input window.
|
|
21958
|
-
// auro-input's handleClickClear fires its input event synchronously
|
|
21959
|
-
// (before any macrotask runs), so handleInputValueChange consumes the
|
|
21960
|
-
// flag first and this reset is a harmless no-op. It only does real work
|
|
21961
|
-
// if that input event never arrives (e.g. auro-input throws mid-clear),
|
|
21962
|
-
// guaranteeing the flag can't survive to be misread as a genuine clear
|
|
21963
|
-
// by a later unrelated event such as an SPA-preselect echo (AB#1634257).
|
|
21964
|
-
// Scheduled via _scheduleTimer so disconnectedCallback cancels it if the
|
|
21965
|
-
// component tears down inside that window.
|
|
21966
|
-
this._scheduleTimer(() => {
|
|
21967
|
-
this._clearBtnActivated = false;
|
|
21968
|
-
}, 0);
|
|
21969
|
-
}
|
|
21970
|
-
}, true);
|
|
21971
21913
|
}
|
|
21972
21914
|
|
|
21973
21915
|
/**
|
|
@@ -22009,17 +21951,6 @@ class AuroCombobox extends AuroElement {
|
|
|
22009
21951
|
* @returns {void}
|
|
22010
21952
|
*/
|
|
22011
21953
|
handleInputValueChange(event) {
|
|
22012
|
-
// Consume the one-shot clear-button flag on EVERY entry, before any branch
|
|
22013
|
-
// below can early-return. trackClearBtnActivation sets it in the capture
|
|
22014
|
-
// phase right before auro-input's clear button fires its synchronous input
|
|
22015
|
-
// event; reading and immediately clearing it here guarantees the flag never
|
|
22016
|
-
// survives a handleInputValueChange call to leak into a later event (e.g.
|
|
22017
|
-
// the bib branch bailing at _syncingDisplayValue, or an SPA-preselect echo)
|
|
22018
|
-
// where it would defeat the guard below. Held in a local so that guard can
|
|
22019
|
-
// still tell a genuine clear from the init-render echo (AB#1634257).
|
|
22020
|
-
const clearBtnActivated = this._clearBtnActivated;
|
|
22021
|
-
this._clearBtnActivated = false;
|
|
22022
|
-
|
|
22023
21954
|
// When the event comes from the fullscreen bib input, sync the value to
|
|
22024
21955
|
// the trigger input. Setting trigger.value triggers Lit's updated()
|
|
22025
21956
|
// (async, microtask) which fires notifyValueChanged() → another 'input'
|
|
@@ -22067,12 +21998,7 @@ class AuroCombobox extends AuroElement {
|
|
|
22067
21998
|
// to the exact shape of that echo (isProgrammatic + non-empty combobox
|
|
22068
21999
|
// value + empty input.value) so it doesn't affect the swap/typed paths
|
|
22069
22000
|
// where value/input already track each other through the sync helpers.
|
|
22070
|
-
|
|
22071
|
-
// empty input) but is a genuine user clear that MUST reset this.value and
|
|
22072
|
-
// optionSelected below. clearBtnActivated (consumed at the top of this
|
|
22073
|
-
// method) is true only for that genuine clear, so only the real
|
|
22074
|
-
// SPA-preselect echo bails (AB#1634257).
|
|
22075
|
-
if (event && event.isProgrammatic && this.value && !this.input.value && !clearBtnActivated) {
|
|
22001
|
+
if (event && event.isProgrammatic && this.value && !this.input.value) {
|
|
22076
22002
|
return;
|
|
22077
22003
|
}
|
|
22078
22004
|
|
|
@@ -22315,14 +22241,6 @@ class AuroCombobox extends AuroElement {
|
|
|
22315
22241
|
}
|
|
22316
22242
|
if (this.menu.value || this.menu.optionSelected) {
|
|
22317
22243
|
this.menu.reset();
|
|
22318
|
-
} else {
|
|
22319
|
-
// The menu's selection properties are already cleared, but option
|
|
22320
|
-
// elements can still carry a stale `selected` attribute (e.g. the menu
|
|
22321
|
-
// options were rebuilt after the value was set, orphaning the DOM from
|
|
22322
|
-
// the now-null optionSelected). reset() is skipped above in that case,
|
|
22323
|
-
// so re-sync the option DOM directly to guarantee no option renders as
|
|
22324
|
-
// selected once the field is cleared (AB#1634259).
|
|
22325
|
-
this.menu.clearSelection();
|
|
22326
22244
|
}
|
|
22327
22245
|
} finally {
|
|
22328
22246
|
this._clearing = false;
|
|
@@ -23774,22 +23692,6 @@ class AuroMenu extends AuroElement {
|
|
|
23774
23692
|
this.value = undefined;
|
|
23775
23693
|
this._selectedKey = undefined;
|
|
23776
23694
|
this._index = -1;
|
|
23777
|
-
|
|
23778
|
-
// Eagerly sync the option DOM to the now-empty selection. Nulling the
|
|
23779
|
-
// reactive properties above normally schedules updated() → updateItemsState,
|
|
23780
|
-
// but that only runs when a property actually changes. If an option still
|
|
23781
|
-
// carries a stale `selected`/`aria-selected` attribute while these
|
|
23782
|
-
// properties are already undefined (e.g. options were rebuilt after a value
|
|
23783
|
-
// was set), no re-render fires and the option keeps rendering as selected.
|
|
23784
|
-
// Strip that state now so no option looks selected after a clear (AB#1634259).
|
|
23785
|
-
// Intentionally leaves `active`/`optionActive` untouched so a highlighted
|
|
23786
|
-
// option remains keyboard-re-selectable after emptying the value (AB#1606433).
|
|
23787
|
-
this.updateItemsState(new Map([
|
|
23788
|
-
[
|
|
23789
|
-
'optionSelected',
|
|
23790
|
-
true
|
|
23791
|
-
]
|
|
23792
|
-
]));
|
|
23793
23695
|
}
|
|
23794
23696
|
|
|
23795
23697
|
/**
|
|
@@ -24585,6 +24487,14 @@ class AuroMenuOption extends AuroElement {
|
|
|
24585
24487
|
AuroMenu.register();
|
|
24586
24488
|
AuroMenuOption.register();
|
|
24587
24489
|
|
|
24490
|
+
function resetStateExample() {
|
|
24491
|
+
const elem = document.querySelector('#resetStateExample');
|
|
24492
|
+
|
|
24493
|
+
document.querySelector('#resetStateBtn').addEventListener('click', () => {
|
|
24494
|
+
elem.reset();
|
|
24495
|
+
});
|
|
24496
|
+
}
|
|
24497
|
+
|
|
24588
24498
|
/* eslint-disable jsdoc/require-jsdoc, no-magic-numbers, no-param-reassign */
|
|
24589
24499
|
|
|
24590
24500
|
|
|
@@ -24592,6 +24502,17 @@ AuroCombobox.register();
|
|
|
24592
24502
|
AuroCombobox.register('custom-combobox');
|
|
24593
24503
|
|
|
24594
24504
|
function initExamples(initCount) {
|
|
24505
|
+
initCount = initCount || 0;
|
|
24506
|
+
|
|
24507
|
+
try {
|
|
24508
|
+
resetStateExample();
|
|
24509
|
+
} catch (err) {
|
|
24510
|
+
if (initCount <= 20) {
|
|
24511
|
+
setTimeout(() => {
|
|
24512
|
+
initExamples(initCount + 1);
|
|
24513
|
+
}, 100);
|
|
24514
|
+
}
|
|
24515
|
+
}
|
|
24595
24516
|
}
|
|
24596
24517
|
|
|
24597
24518
|
export { initExamples };
|
|
@@ -5081,7 +5081,7 @@ let AuroHelpText$2 = class AuroHelpText extends i$3 {
|
|
|
5081
5081
|
}
|
|
5082
5082
|
};
|
|
5083
5083
|
|
|
5084
|
-
var formkitVersion$2 = '
|
|
5084
|
+
var formkitVersion$2 = '202609011830';
|
|
5085
5085
|
|
|
5086
5086
|
/**
|
|
5087
5087
|
* AuroElement is the shared base class for layout-aware Auro form components.
|
|
@@ -18950,7 +18950,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$3 {
|
|
|
18950
18950
|
}
|
|
18951
18951
|
};
|
|
18952
18952
|
|
|
18953
|
-
var formkitVersion$1 = '
|
|
18953
|
+
var formkitVersion$1 = '202609011830';
|
|
18954
18954
|
|
|
18955
18955
|
// Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
|
|
18956
18956
|
// See LICENSE in the project root for license information.
|
|
@@ -20142,7 +20142,7 @@ class AuroBibtemplate extends i$3 {
|
|
|
20142
20142
|
}
|
|
20143
20143
|
}
|
|
20144
20144
|
|
|
20145
|
-
var formkitVersion = '
|
|
20145
|
+
var formkitVersion = '202609011830';
|
|
20146
20146
|
|
|
20147
20147
|
var styleCss$3 = i$6`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}:host{display:block;text-align:left}:host [auro-dropdown]{--ds-auro-dropdown-trigger-background-color: transparent}:host #inputInBib::part(wrapper){box-shadow:none}:host #inputInBib::part(accent-left){display:none}:host([layout*=classic]) [auro-input]{width:100%}:host([layout*=classic]) [auro-input]::part(helpText){display:none}:host([layout*=classic]) #slotHolder{display:none}`;
|
|
20148
20148
|
|
|
@@ -20583,11 +20583,6 @@ class AuroCombobox extends AuroElement {
|
|
|
20583
20583
|
this.behavior = "suggestion";
|
|
20584
20584
|
this.clearBtnFocused = false;
|
|
20585
20585
|
|
|
20586
|
-
// One-shot: set when the input's clear button is activated so the
|
|
20587
|
-
// SPA-preselect guard in handleInputValueChange doesn't swallow the
|
|
20588
|
-
// genuine clear (AB#1634257).
|
|
20589
|
-
this._clearBtnActivated = false;
|
|
20590
|
-
|
|
20591
20586
|
// Defaults that effect the overall layout of the combobox
|
|
20592
20587
|
this.checkmark = false;
|
|
20593
20588
|
this.dvInputOnly = false;
|
|
@@ -21545,13 +21540,6 @@ class AuroCombobox extends AuroElement {
|
|
|
21545
21540
|
this.bibtemplate = this.dropdown.querySelector(this.bibtemplateTag._$litStatic$);
|
|
21546
21541
|
this.inputInBib = this.bibtemplate.querySelector(this.inputTag._$litStatic$);
|
|
21547
21542
|
|
|
21548
|
-
// Mirror the trigger's clear-button tracking onto the fullscreen bib input
|
|
21549
|
-
// so clearing there also fully resets the combobox (AB#1634257). See
|
|
21550
|
-
// trackClearBtnActivation for why this must run in the capture phase.
|
|
21551
|
-
if (this.inputInBib && this.inputInBib !== this.input) {
|
|
21552
|
-
this.trackClearBtnActivation(this.inputInBib);
|
|
21553
|
-
}
|
|
21554
|
-
|
|
21555
21543
|
// Pass label text to the dropdown bib for accessible dialog naming
|
|
21556
21544
|
const labelElement = this.querySelector('[slot="label"]');
|
|
21557
21545
|
if (labelElement) {
|
|
@@ -21937,52 +21925,6 @@ class AuroCombobox extends AuroElement {
|
|
|
21937
21925
|
this.clearBtnFocused = false;
|
|
21938
21926
|
}
|
|
21939
21927
|
});
|
|
21940
|
-
|
|
21941
|
-
this.trackClearBtnActivation(this.input);
|
|
21942
|
-
}
|
|
21943
|
-
|
|
21944
|
-
/**
|
|
21945
|
-
* Flags genuine clear-button activations on an auro-input so the SPA-preselect
|
|
21946
|
-
* guard in handleInputValueChange doesn't swallow them.
|
|
21947
|
-
*
|
|
21948
|
-
* The auro-input clear button fires an `isProgrammatic` input event (via
|
|
21949
|
-
* notifyValueChanged) that is indistinguishable in shape from the
|
|
21950
|
-
* SPA-preselect echo that guard bails on (isProgrammatic + set value + empty
|
|
21951
|
-
* input). Without this one-shot flag, clicking clear would leave
|
|
21952
|
-
* this.value/optionSelected stale (AB#1634257).
|
|
21953
|
-
*
|
|
21954
|
-
* Delegated on the shadow root so it works regardless of when .clearBtn
|
|
21955
|
-
* renders (it only exists after a value is set), and covers both real clicks
|
|
21956
|
-
* and programmatic clearBtn.click() (which no focusin precedes). Registered in
|
|
21957
|
-
* the CAPTURE phase so the flag is set BEFORE the button's own @click
|
|
21958
|
-
* (handleClickClear) fires its synchronous input event — which is when
|
|
21959
|
-
* handleInputValueChange reads the flag.
|
|
21960
|
-
* @private
|
|
21961
|
-
* @param {Element} inputEl - The auro-input whose clear button to track.
|
|
21962
|
-
* @returns {void}
|
|
21963
|
-
*/
|
|
21964
|
-
trackClearBtnActivation(inputEl) {
|
|
21965
|
-
if (!inputEl || !inputEl.shadowRoot) {
|
|
21966
|
-
return;
|
|
21967
|
-
}
|
|
21968
|
-
inputEl.shadowRoot.addEventListener('click', (event) => {
|
|
21969
|
-
if (event.target.closest('.clearBtn')) {
|
|
21970
|
-
this._clearBtnActivated = true;
|
|
21971
|
-
|
|
21972
|
-
// Bound the flag's lifetime to this synchronous clear -> input window.
|
|
21973
|
-
// auro-input's handleClickClear fires its input event synchronously
|
|
21974
|
-
// (before any macrotask runs), so handleInputValueChange consumes the
|
|
21975
|
-
// flag first and this reset is a harmless no-op. It only does real work
|
|
21976
|
-
// if that input event never arrives (e.g. auro-input throws mid-clear),
|
|
21977
|
-
// guaranteeing the flag can't survive to be misread as a genuine clear
|
|
21978
|
-
// by a later unrelated event such as an SPA-preselect echo (AB#1634257).
|
|
21979
|
-
// Scheduled via _scheduleTimer so disconnectedCallback cancels it if the
|
|
21980
|
-
// component tears down inside that window.
|
|
21981
|
-
this._scheduleTimer(() => {
|
|
21982
|
-
this._clearBtnActivated = false;
|
|
21983
|
-
}, 0);
|
|
21984
|
-
}
|
|
21985
|
-
}, true);
|
|
21986
21928
|
}
|
|
21987
21929
|
|
|
21988
21930
|
/**
|
|
@@ -22024,17 +21966,6 @@ class AuroCombobox extends AuroElement {
|
|
|
22024
21966
|
* @returns {void}
|
|
22025
21967
|
*/
|
|
22026
21968
|
handleInputValueChange(event) {
|
|
22027
|
-
// Consume the one-shot clear-button flag on EVERY entry, before any branch
|
|
22028
|
-
// below can early-return. trackClearBtnActivation sets it in the capture
|
|
22029
|
-
// phase right before auro-input's clear button fires its synchronous input
|
|
22030
|
-
// event; reading and immediately clearing it here guarantees the flag never
|
|
22031
|
-
// survives a handleInputValueChange call to leak into a later event (e.g.
|
|
22032
|
-
// the bib branch bailing at _syncingDisplayValue, or an SPA-preselect echo)
|
|
22033
|
-
// where it would defeat the guard below. Held in a local so that guard can
|
|
22034
|
-
// still tell a genuine clear from the init-render echo (AB#1634257).
|
|
22035
|
-
const clearBtnActivated = this._clearBtnActivated;
|
|
22036
|
-
this._clearBtnActivated = false;
|
|
22037
|
-
|
|
22038
21969
|
// When the event comes from the fullscreen bib input, sync the value to
|
|
22039
21970
|
// the trigger input. Setting trigger.value triggers Lit's updated()
|
|
22040
21971
|
// (async, microtask) which fires notifyValueChanged() → another 'input'
|
|
@@ -22082,12 +22013,7 @@ class AuroCombobox extends AuroElement {
|
|
|
22082
22013
|
// to the exact shape of that echo (isProgrammatic + non-empty combobox
|
|
22083
22014
|
// value + empty input.value) so it doesn't affect the swap/typed paths
|
|
22084
22015
|
// where value/input already track each other through the sync helpers.
|
|
22085
|
-
|
|
22086
|
-
// empty input) but is a genuine user clear that MUST reset this.value and
|
|
22087
|
-
// optionSelected below. clearBtnActivated (consumed at the top of this
|
|
22088
|
-
// method) is true only for that genuine clear, so only the real
|
|
22089
|
-
// SPA-preselect echo bails (AB#1634257).
|
|
22090
|
-
if (event && event.isProgrammatic && this.value && !this.input.value && !clearBtnActivated) {
|
|
22016
|
+
if (event && event.isProgrammatic && this.value && !this.input.value) {
|
|
22091
22017
|
return;
|
|
22092
22018
|
}
|
|
22093
22019
|
|
|
@@ -22330,14 +22256,6 @@ class AuroCombobox extends AuroElement {
|
|
|
22330
22256
|
}
|
|
22331
22257
|
if (this.menu.value || this.menu.optionSelected) {
|
|
22332
22258
|
this.menu.reset();
|
|
22333
|
-
} else {
|
|
22334
|
-
// The menu's selection properties are already cleared, but option
|
|
22335
|
-
// elements can still carry a stale `selected` attribute (e.g. the menu
|
|
22336
|
-
// options were rebuilt after the value was set, orphaning the DOM from
|
|
22337
|
-
// the now-null optionSelected). reset() is skipped above in that case,
|
|
22338
|
-
// so re-sync the option DOM directly to guarantee no option renders as
|
|
22339
|
-
// selected once the field is cleared (AB#1634259).
|
|
22340
|
-
this.menu.clearSelection();
|
|
22341
22259
|
}
|
|
22342
22260
|
} finally {
|
|
22343
22261
|
this._clearing = false;
|
|
@@ -23789,22 +23707,6 @@ class AuroMenu extends AuroElement {
|
|
|
23789
23707
|
this.value = undefined;
|
|
23790
23708
|
this._selectedKey = undefined;
|
|
23791
23709
|
this._index = -1;
|
|
23792
|
-
|
|
23793
|
-
// Eagerly sync the option DOM to the now-empty selection. Nulling the
|
|
23794
|
-
// reactive properties above normally schedules updated() → updateItemsState,
|
|
23795
|
-
// but that only runs when a property actually changes. If an option still
|
|
23796
|
-
// carries a stale `selected`/`aria-selected` attribute while these
|
|
23797
|
-
// properties are already undefined (e.g. options were rebuilt after a value
|
|
23798
|
-
// was set), no re-render fires and the option keeps rendering as selected.
|
|
23799
|
-
// Strip that state now so no option looks selected after a clear (AB#1634259).
|
|
23800
|
-
// Intentionally leaves `active`/`optionActive` untouched so a highlighted
|
|
23801
|
-
// option remains keyboard-re-selectable after emptying the value (AB#1606433).
|
|
23802
|
-
this.updateItemsState(new Map([
|
|
23803
|
-
[
|
|
23804
|
-
'optionSelected',
|
|
23805
|
-
true
|
|
23806
|
-
]
|
|
23807
|
-
]));
|
|
23808
23710
|
}
|
|
23809
23711
|
|
|
23810
23712
|
/**
|