@aurodesignsystem-dev/auro-formkit 0.0.0-pr1424.2 → 0.0.0-pr1424.4

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 (62) hide show
  1. package/CHANGELOG.md +2 -2
  2. package/README.md +133 -183
  3. package/components/checkbox/demo/api.min.js +3 -3
  4. package/components/checkbox/demo/index.min.js +3 -3
  5. package/components/checkbox/dist/index.js +3 -3
  6. package/components/checkbox/dist/registered.js +3 -3
  7. package/components/combobox/demo/api.html +1 -0
  8. package/components/combobox/demo/api.js +3 -1
  9. package/components/combobox/demo/api.md +75 -0
  10. package/components/combobox/demo/api.min.js +314 -172
  11. package/components/combobox/demo/index.min.js +301 -171
  12. package/components/combobox/dist/comboboxKeyboardStrategy.d.ts +1 -1
  13. package/components/combobox/dist/index.js +291 -171
  14. package/components/combobox/dist/registered.js +291 -171
  15. package/components/counter/demo/api.html +3 -0
  16. package/components/counter/demo/api.js +4 -0
  17. package/components/counter/demo/api.md +130 -0
  18. package/components/counter/demo/api.min.js +320 -167
  19. package/components/counter/demo/index.min.js +300 -167
  20. package/components/counter/dist/counterGroupKeyboardStrategy.d.ts +3 -0
  21. package/components/counter/dist/index.js +300 -167
  22. package/components/counter/dist/registered.js +300 -167
  23. package/components/datepicker/demo/api.html +1 -0
  24. package/components/datepicker/demo/api.js +2 -0
  25. package/components/datepicker/demo/api.md +57 -0
  26. package/components/datepicker/demo/api.min.js +376 -171
  27. package/components/datepicker/demo/index.min.js +364 -171
  28. package/components/datepicker/dist/datepickerKeyboardStrategy.d.ts +3 -1
  29. package/components/datepicker/dist/index.js +364 -171
  30. package/components/datepicker/dist/registered.js +364 -171
  31. package/components/dropdown/demo/api.html +1 -0
  32. package/components/dropdown/demo/api.js +2 -0
  33. package/components/dropdown/demo/api.md +95 -0
  34. package/components/dropdown/demo/api.min.js +296 -165
  35. package/components/dropdown/demo/index.min.js +276 -165
  36. package/components/dropdown/dist/index.js +276 -165
  37. package/components/dropdown/dist/registered.js +276 -165
  38. package/components/form/demo/api.min.js +1254 -684
  39. package/components/form/demo/index.min.js +1254 -684
  40. package/components/input/demo/api.min.js +1 -1
  41. package/components/input/demo/index.min.js +1 -1
  42. package/components/input/dist/index.js +1 -1
  43. package/components/input/dist/registered.js +1 -1
  44. package/components/menu/demo/api.md +1 -0
  45. package/components/menu/demo/api.min.js +10 -0
  46. package/components/menu/demo/index.min.js +10 -0
  47. package/components/menu/dist/auro-menuoption.d.ts +9 -0
  48. package/components/menu/dist/index.js +10 -0
  49. package/components/menu/dist/registered.js +10 -0
  50. package/components/radio/demo/api.min.js +2 -2
  51. package/components/radio/demo/index.min.js +2 -2
  52. package/components/radio/dist/index.js +2 -2
  53. package/components/radio/dist/registered.js +2 -2
  54. package/components/select/demo/api.html +1 -0
  55. package/components/select/demo/api.js +2 -0
  56. package/components/select/demo/api.md +76 -0
  57. package/components/select/demo/api.min.js +306 -169
  58. package/components/select/demo/index.min.js +293 -169
  59. package/components/select/dist/index.js +283 -169
  60. package/components/select/dist/registered.js +283 -169
  61. package/custom-elements.json +48 -3
  62. package/package.json +5 -3
@@ -1333,6 +1333,10 @@ const selectKeyboardStrategy = {
1333
1333
  if (!ctx.isExpanded) {
1334
1334
  return;
1335
1335
  }
1336
+
1337
+ // Prevent the Escape key from bubbling up and closing any parent dialogs / drawers / popups
1338
+ evt.stopPropagation();
1339
+
1336
1340
  component.dropdown.hide();
1337
1341
  },
1338
1342
 
@@ -3295,11 +3299,19 @@ class AuroFloatingUI {
3295
3299
  * This ensures that the bib content has the same dimensions as the sizer element.
3296
3300
  */
3297
3301
  mirrorSize() {
3302
+ const element = this.element;
3303
+ if (!element) {
3304
+ return;
3305
+ }
3306
+
3298
3307
  // mirror the boxsize from bibSizer
3299
- if (this.element.bibSizer && this.element.matchWidth) {
3300
- const sizerStyle = window.getComputedStyle(this.element.bibSizer);
3301
- const bibContent =
3302
- this.element.bib.shadowRoot.querySelector(".container");
3308
+ if (element.bibSizer && element.matchWidth && element.bib?.shadowRoot) {
3309
+ const sizerStyle = window.getComputedStyle(element.bibSizer);
3310
+ const bibContent = element.bib.shadowRoot.querySelector(".container");
3311
+ if (!bibContent) {
3312
+ return;
3313
+ }
3314
+
3303
3315
  if (sizerStyle.width !== "0px") {
3304
3316
  bibContent.style.width = sizerStyle.width;
3305
3317
  }
@@ -3321,9 +3333,14 @@ class AuroFloatingUI {
3321
3333
  * @returns {String} The positioning strategy, one of 'fullscreen', 'floating', 'cover'.
3322
3334
  */
3323
3335
  getPositioningStrategy() {
3336
+ const element = this.element;
3337
+ if (!element) {
3338
+ return "floating";
3339
+ }
3340
+
3324
3341
  const breakpoint =
3325
- this.element.bib.mobileFullscreenBreakpoint ||
3326
- this.element.floaterConfig?.fullscreenBreakpoint;
3342
+ element.bib?.mobileFullscreenBreakpoint ||
3343
+ element.floaterConfig?.fullscreenBreakpoint;
3327
3344
  switch (this.behavior) {
3328
3345
  case "tooltip":
3329
3346
  return "floating";
@@ -3334,9 +3351,9 @@ class AuroFloatingUI {
3334
3351
  `(max-width: ${breakpoint})`,
3335
3352
  ).matches;
3336
3353
 
3337
- this.element.expanded = smallerThanBreakpoint;
3354
+ element.expanded = smallerThanBreakpoint;
3338
3355
  }
3339
- if (this.element.nested) {
3356
+ if (element.nested) {
3340
3357
  return "cover";
3341
3358
  }
3342
3359
  return "fullscreen";
@@ -3366,42 +3383,65 @@ class AuroFloatingUI {
3366
3383
  * and applies the calculated position to the bib's style.
3367
3384
  */
3368
3385
  position() {
3386
+ const element = this.element;
3387
+ if (!element) {
3388
+ return;
3389
+ }
3390
+
3369
3391
  const strategy = this.getPositioningStrategy();
3370
3392
  this.configureBibStrategy(strategy);
3371
3393
 
3372
3394
  if (strategy === "floating") {
3395
+ if (!element.trigger || !element.bib) {
3396
+ return;
3397
+ }
3398
+
3373
3399
  this.mirrorSize();
3374
3400
  // Define the middlware for the floater configuration
3375
3401
  const middleware = [
3376
- offset(this.element.floaterConfig?.offset || 0),
3377
- ...(this.element.floaterConfig?.shift ? [shift()] : []), // Add shift middleware if shift is enabled.
3378
- ...(this.element.floaterConfig?.flip ? [flip()] : []), // Add flip middleware if flip is enabled.
3379
- ...(this.element.floaterConfig?.autoPlacement ? [autoPlacement()] : []), // Add autoPlacement middleware if autoPlacement is enabled.
3402
+ offset(element.floaterConfig?.offset || 0),
3403
+ ...(element.floaterConfig?.shift ? [shift()] : []), // Add shift middleware if shift is enabled.
3404
+ ...(element.floaterConfig?.flip ? [flip()] : []), // Add flip middleware if flip is enabled.
3405
+ ...(element.floaterConfig?.autoPlacement ? [autoPlacement()] : []), // Add autoPlacement middleware if autoPlacement is enabled.
3380
3406
  ];
3381
3407
 
3382
3408
  // Compute the position of the bib
3383
- computePosition(this.element.trigger, this.element.bib, {
3384
- strategy: this.element.floaterConfig?.strategy || "fixed",
3385
- placement: this.element.floaterConfig?.placement,
3409
+ computePosition(element.trigger, element.bib, {
3410
+ strategy: element.floaterConfig?.strategy || "fixed",
3411
+ placement: element.floaterConfig?.placement,
3386
3412
  middleware: middleware || [],
3387
3413
  }).then(({ x, y }) => {
3388
3414
  // eslint-disable-line id-length
3389
- Object.assign(this.element.bib.style, {
3415
+ const currentElement = this.element;
3416
+ if (!currentElement?.bib) {
3417
+ return;
3418
+ }
3419
+
3420
+ Object.assign(currentElement.bib.style, {
3390
3421
  left: `${x}px`,
3391
3422
  top: `${y}px`,
3392
3423
  });
3393
3424
  });
3394
3425
  } else if (strategy === "cover") {
3426
+ if (!element.parentNode || !element.bib) {
3427
+ return;
3428
+ }
3429
+
3395
3430
  // Compute the position of the bib
3396
- computePosition(this.element.parentNode, this.element.bib, {
3431
+ computePosition(element.parentNode, element.bib, {
3397
3432
  placement: "bottom-start",
3398
3433
  }).then(({ x, y }) => {
3399
3434
  // eslint-disable-line id-length
3400
- Object.assign(this.element.bib.style, {
3435
+ const currentElement = this.element;
3436
+ if (!currentElement?.bib || !currentElement.parentNode) {
3437
+ return;
3438
+ }
3439
+
3440
+ Object.assign(currentElement.bib.style, {
3401
3441
  left: `${x}px`,
3402
- top: `${y - this.element.parentNode.offsetHeight}px`,
3403
- width: `${this.element.parentNode.offsetWidth}px`,
3404
- height: `${this.element.parentNode.offsetHeight}px`,
3442
+ top: `${y - currentElement.parentNode.offsetHeight}px`,
3443
+ width: `${currentElement.parentNode.offsetWidth}px`,
3444
+ height: `${currentElement.parentNode.offsetHeight}px`,
3405
3445
  });
3406
3446
  });
3407
3447
  }
@@ -3413,11 +3453,17 @@ class AuroFloatingUI {
3413
3453
  * @param {Boolean} lock - If true, locks the body's scrolling functionlity; otherwise, unlock.
3414
3454
  */
3415
3455
  lockScroll(lock = true) {
3456
+ const element = this.element;
3457
+
3416
3458
  if (lock) {
3459
+ if (!element?.bib) {
3460
+ return;
3461
+ }
3462
+
3417
3463
  document.body.style.overflow = "hidden"; // hide body's scrollbar
3418
3464
 
3419
3465
  // Move `bib` by the amount the viewport is shifted to stay aligned in fullscreen.
3420
- this.element.bib.style.transform = `translateY(${window?.visualViewport?.offsetTop}px)`;
3466
+ element.bib.style.transform = `translateY(${window?.visualViewport?.offsetTop}px)`;
3421
3467
  } else {
3422
3468
  document.body.style.overflow = "";
3423
3469
  }
@@ -3433,20 +3479,24 @@ class AuroFloatingUI {
3433
3479
  * @param {string} strategy - The positioning strategy ('fullscreen' or 'floating').
3434
3480
  */
3435
3481
  configureBibStrategy(value) {
3482
+ const element = this.element;
3483
+ if (!element?.bib) {
3484
+ return;
3485
+ }
3486
+
3436
3487
  if (value === "fullscreen") {
3437
- this.element.isBibFullscreen = true;
3488
+ element.isBibFullscreen = true;
3438
3489
  // reset the prev position
3439
- this.element.bib.setAttribute("isfullscreen", "");
3440
- this.element.bib.style.position = "fixed";
3441
- this.element.bib.style.top = "0px";
3442
- this.element.bib.style.left = "0px";
3443
- this.element.bib.style.width = "";
3444
- this.element.bib.style.height = "";
3445
- this.element.style.contain = "";
3490
+ element.bib.setAttribute("isfullscreen", "");
3491
+ element.bib.style.position = "fixed";
3492
+ element.bib.style.top = "0px";
3493
+ element.bib.style.left = "0px";
3494
+ element.bib.style.width = "";
3495
+ element.bib.style.height = "";
3496
+ element.style.contain = "";
3446
3497
 
3447
3498
  // reset the size that was mirroring `size` css-part
3448
- const bibContent =
3449
- this.element.bib.shadowRoot.querySelector(".container");
3499
+ const bibContent = element.bib.shadowRoot?.querySelector(".container");
3450
3500
  if (bibContent) {
3451
3501
  bibContent.style.width = "";
3452
3502
  bibContent.style.height = "";
@@ -3461,14 +3511,14 @@ class AuroFloatingUI {
3461
3511
  }, 0);
3462
3512
  }
3463
3513
 
3464
- if (this.element.isPopoverVisible) {
3514
+ if (element.isPopoverVisible) {
3465
3515
  this.lockScroll(true);
3466
3516
  }
3467
3517
  } else {
3468
- this.element.bib.style.position = "";
3469
- this.element.bib.removeAttribute("isfullscreen");
3470
- this.element.isBibFullscreen = false;
3471
- this.element.style.contain = "layout";
3518
+ element.bib.style.position = "";
3519
+ element.bib.removeAttribute("isfullscreen");
3520
+ element.isBibFullscreen = false;
3521
+ element.style.contain = "layout";
3472
3522
  }
3473
3523
 
3474
3524
  const isChanged = this.strategy && this.strategy !== value;
@@ -3486,16 +3536,21 @@ class AuroFloatingUI {
3486
3536
  },
3487
3537
  );
3488
3538
 
3489
- this.element.dispatchEvent(event);
3539
+ element.dispatchEvent(event);
3490
3540
  }
3491
3541
  }
3492
3542
 
3493
3543
  updateState() {
3494
- const isVisible = this.element.isPopoverVisible;
3544
+ const element = this.element;
3545
+ if (!element) {
3546
+ return;
3547
+ }
3548
+
3549
+ const isVisible = element.isPopoverVisible;
3495
3550
  if (!isVisible) {
3496
3551
  this.cleanupHideHandlers();
3497
3552
  try {
3498
- this.element.cleanup?.();
3553
+ element.cleanup?.();
3499
3554
  } catch (error) {
3500
3555
  // Do nothing
3501
3556
  }
@@ -3511,28 +3566,30 @@ class AuroFloatingUI {
3511
3566
  * If not, and if the bib isn't in fullscreen mode with focus lost, it hides the bib.
3512
3567
  */
3513
3568
  handleFocusLoss() {
3569
+ const element = this.element;
3570
+ if (!element?.bib) {
3571
+ return;
3572
+ }
3573
+
3514
3574
  // if mouse is being pressed, skip and let click event to handle the action
3515
3575
  if (AuroFloatingUI.isMousePressed) {
3516
3576
  return;
3517
3577
  }
3518
3578
 
3519
3579
  if (
3520
- this.element.noHideOnThisFocusLoss ||
3521
- this.element.hasAttribute("noHideOnThisFocusLoss")
3580
+ element.noHideOnThisFocusLoss ||
3581
+ element.hasAttribute("noHideOnThisFocusLoss")
3522
3582
  ) {
3523
3583
  return;
3524
3584
  }
3525
3585
 
3526
3586
  // if focus is still inside of trigger or bib, do not close
3527
- if (
3528
- this.element.matches(":focus") ||
3529
- this.element.matches(":focus-within")
3530
- ) {
3587
+ if (element.matches(":focus") || element.matches(":focus-within")) {
3531
3588
  return;
3532
3589
  }
3533
3590
 
3534
3591
  // if fullscreen bib is in fullscreen mode, do not close
3535
- if (this.element.bib.hasAttribute("isfullscreen")) {
3592
+ if (element.bib.hasAttribute("isfullscreen")) {
3536
3593
  return;
3537
3594
  }
3538
3595
 
@@ -3540,23 +3597,33 @@ class AuroFloatingUI {
3540
3597
  }
3541
3598
 
3542
3599
  setupHideHandlers() {
3600
+ const element = this.element;
3601
+ if (!element) {
3602
+ return;
3603
+ }
3604
+
3543
3605
  // Define handlers & store references
3544
3606
  this.focusHandler = () => this.handleFocusLoss();
3545
3607
 
3546
3608
  this.clickHandler = (evt) => {
3609
+ const element = this.element;
3610
+ if (!element?.bib) {
3611
+ return;
3612
+ }
3613
+
3547
3614
  // When the bib is fullscreen (modal dialog), don't close on outside
3548
3615
  // clicks. VoiceOver's synthetic click events inside a top-layer modal
3549
3616
  // <dialog> may not include the bib in composedPath(), causing false
3550
3617
  // positives. This mirrors the fullscreen guard in handleFocusLoss().
3551
- if (this.element.bib && this.element.bib.hasAttribute("isfullscreen")) {
3618
+ if (element.bib.hasAttribute("isfullscreen")) {
3552
3619
  return;
3553
3620
  }
3554
3621
 
3555
3622
  if (
3556
- (!evt.composedPath().includes(this.element.trigger) &&
3557
- !evt.composedPath().includes(this.element.bib)) ||
3558
- (this.element.bib.backdrop &&
3559
- evt.composedPath().includes(this.element.bib.backdrop))
3623
+ (!evt.composedPath().includes(element.trigger) &&
3624
+ !evt.composedPath().includes(element.bib)) ||
3625
+ (element.bib.backdrop &&
3626
+ evt.composedPath().includes(element.bib.backdrop))
3560
3627
  ) {
3561
3628
  const existedVisibleFloatingUI =
3562
3629
  document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
@@ -3577,7 +3644,12 @@ class AuroFloatingUI {
3577
3644
 
3578
3645
  // ESC key handler
3579
3646
  this.keyDownHandler = (evt) => {
3580
- if (evt.key === "Escape" && this.element.isPopoverVisible) {
3647
+ const element = this.element;
3648
+ if (!element) {
3649
+ return;
3650
+ }
3651
+
3652
+ if (evt.key === "Escape" && element.isPopoverVisible) {
3581
3653
  const existedVisibleFloatingUI =
3582
3654
  document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
3583
3655
  if (
@@ -3634,6 +3706,10 @@ class AuroFloatingUI {
3634
3706
  }
3635
3707
 
3636
3708
  updateCurrentExpandedDropdown() {
3709
+ if (!this.element) {
3710
+ return;
3711
+ }
3712
+
3637
3713
  // Close any other dropdown that is already open
3638
3714
  const existedVisibleFloatingUI =
3639
3715
  document.expandedAuroFormkitDropdown || document.expandedAuroFloater;
@@ -3650,25 +3726,34 @@ class AuroFloatingUI {
3650
3726
  }
3651
3727
 
3652
3728
  showBib() {
3653
- if (!this.element.disabled && !this.showing) {
3729
+ const element = this.element;
3730
+ if (!element) {
3731
+ return;
3732
+ }
3733
+
3734
+ if (!element.bib || (!element.trigger && !element.parentNode)) {
3735
+ return;
3736
+ }
3737
+
3738
+ if (!element.disabled && !this.showing) {
3654
3739
  this.updateCurrentExpandedDropdown();
3655
- this.element.triggerChevron?.setAttribute("data-expanded", true);
3740
+ element.triggerChevron?.setAttribute("data-expanded", true);
3656
3741
 
3657
3742
  // prevent double showing: isPopovervisible gets first and showBib gets called later
3658
3743
  if (!this.showing) {
3659
- if (!this.element.modal) {
3744
+ if (!element.modal) {
3660
3745
  this.setupHideHandlers();
3661
3746
  }
3662
3747
  this.showing = true;
3663
- this.element.isPopoverVisible = true;
3748
+ element.isPopoverVisible = true;
3664
3749
  this.position();
3665
3750
  this.dispatchEventDropdownToggle();
3666
3751
  }
3667
3752
 
3668
3753
  // Setup auto update to handle resize and scroll
3669
- this.element.cleanup = autoUpdate(
3670
- this.element.trigger || this.element.parentNode,
3671
- this.element.bib,
3754
+ element.cleanup = autoUpdate(
3755
+ element.trigger || element.parentNode,
3756
+ element.bib,
3672
3757
  () => {
3673
3758
  this.position();
3674
3759
  },
@@ -3681,22 +3766,27 @@ class AuroFloatingUI {
3681
3766
  * @param {String} eventType - The event type that triggered the hiding action.
3682
3767
  */
3683
3768
  hideBib(eventType = "unknown") {
3684
- if (this.element.disabled) {
3769
+ const element = this.element;
3770
+ if (!element) {
3771
+ return;
3772
+ }
3773
+
3774
+ if (element.disabled) {
3685
3775
  return;
3686
3776
  }
3687
3777
 
3688
3778
  // noToggle dropdowns should not close when the trigger is clicked (the
3689
3779
  // "toggle" behavior), but they CAN still close via other interactions like
3690
3780
  // Escape key or focus loss.
3691
- if (this.element.noToggle && eventType === "click") {
3781
+ if (element.noToggle && eventType === "click") {
3692
3782
  return;
3693
3783
  }
3694
3784
 
3695
3785
  this.lockScroll(false);
3696
- this.element.triggerChevron?.removeAttribute("data-expanded");
3786
+ element.triggerChevron?.removeAttribute("data-expanded");
3697
3787
 
3698
- if (this.element.isPopoverVisible) {
3699
- this.element.isPopoverVisible = false;
3788
+ if (element.isPopoverVisible) {
3789
+ element.isPopoverVisible = false;
3700
3790
  }
3701
3791
  if (this.showing) {
3702
3792
  this.cleanupHideHandlers();
@@ -3716,6 +3806,11 @@ class AuroFloatingUI {
3716
3806
  * @param {String} eventType - The event type that triggered the toggle action.
3717
3807
  */
3718
3808
  dispatchEventDropdownToggle(eventType) {
3809
+ const element = this.element;
3810
+ if (!element) {
3811
+ return;
3812
+ }
3813
+
3719
3814
  const event = new CustomEvent(
3720
3815
  this.eventPrefix ? `${this.eventPrefix}-toggled` : "toggled",
3721
3816
  {
@@ -3727,11 +3822,16 @@ class AuroFloatingUI {
3727
3822
  },
3728
3823
  );
3729
3824
 
3730
- this.element.dispatchEvent(event);
3825
+ element.dispatchEvent(event);
3731
3826
  }
3732
3827
 
3733
3828
  handleClick() {
3734
- if (this.element.isPopoverVisible) {
3829
+ const element = this.element;
3830
+ if (!element) {
3831
+ return;
3832
+ }
3833
+
3834
+ if (element.isPopoverVisible) {
3735
3835
  this.hideBib("click");
3736
3836
  } else {
3737
3837
  this.showBib();
@@ -3742,63 +3842,66 @@ class AuroFloatingUI {
3742
3842
  {
3743
3843
  composed: true,
3744
3844
  detail: {
3745
- expanded: this.element.isPopoverVisible,
3845
+ expanded: element.isPopoverVisible,
3746
3846
  },
3747
3847
  },
3748
3848
  );
3749
3849
 
3750
- this.element.dispatchEvent(event);
3850
+ element.dispatchEvent(event);
3751
3851
  }
3752
3852
 
3753
3853
  handleEvent(event) {
3754
- if (!this.element.disableEventShow) {
3755
- switch (event.type) {
3756
- case "keydown": {
3757
- // Support both Enter and Space keys for accessibility
3758
- // Space is included as it's expected behavior for interactive elements
3759
-
3760
- const origin = event.composedPath()[0];
3761
- if (
3762
- event.key === "Enter" ||
3763
- (event.key === " " && (!origin || origin.tagName !== "INPUT"))
3764
- ) {
3765
- event.preventDefault();
3766
- this.handleClick();
3767
- }
3768
- break;
3769
- }
3770
- case "mouseenter":
3771
- if (this.element.hoverToggle) {
3772
- this.showBib();
3773
- }
3774
- break;
3775
- case "mouseleave":
3776
- if (this.element.hoverToggle) {
3777
- this.hideBib("mouseleave");
3778
- }
3779
- break;
3780
- case "focus":
3781
- if (this.element.focusShow) {
3782
- /*
3783
- This needs to better handle clicking that gives focus -
3784
- currently it shows and then immediately hides the bib
3785
- */
3786
- this.showBib();
3787
- }
3788
- break;
3789
- case "blur":
3790
- // send this task 100ms later queue to
3791
- // wait a frame in case focus moves within the floating element/bib
3792
- setTimeout(() => this.handleFocusLoss(), 0);
3793
- break;
3794
- case "click":
3795
- if (document.activeElement === document.body) {
3796
- event.currentTarget.focus();
3797
- }
3854
+ const element = this.element;
3855
+ if (!element || element.disableEventShow) {
3856
+ return;
3857
+ }
3858
+
3859
+ switch (event.type) {
3860
+ case "keydown": {
3861
+ // Support both Enter and Space keys for accessibility
3862
+ // Space is included as it's expected behavior for interactive elements
3863
+
3864
+ const origin = event.composedPath()[0];
3865
+ if (
3866
+ event.key === "Enter" ||
3867
+ (event.key === " " && (!origin || origin.tagName !== "INPUT"))
3868
+ ) {
3869
+ event.preventDefault();
3798
3870
  this.handleClick();
3799
- break;
3800
- // Do nothing
3871
+ }
3872
+ break;
3801
3873
  }
3874
+ case "mouseenter":
3875
+ if (element.hoverToggle) {
3876
+ this.showBib();
3877
+ }
3878
+ break;
3879
+ case "mouseleave":
3880
+ if (element.hoverToggle) {
3881
+ this.hideBib("mouseleave");
3882
+ }
3883
+ break;
3884
+ case "focus":
3885
+ if (element.focusShow) {
3886
+ /*
3887
+ This needs to better handle clicking that gives focus -
3888
+ currently it shows and then immediately hides the bib
3889
+ */
3890
+ this.showBib();
3891
+ }
3892
+ break;
3893
+ case "blur":
3894
+ // send this task 100ms later queue to
3895
+ // wait a frame in case focus moves within the floating element/bib
3896
+ setTimeout(() => this.handleFocusLoss(), 0);
3897
+ break;
3898
+ case "click":
3899
+ if (document.activeElement === document.body) {
3900
+ event.currentTarget.focus();
3901
+ }
3902
+ this.handleClick();
3903
+ break;
3904
+ // Do nothing
3802
3905
  }
3803
3906
  }
3804
3907
 
@@ -3809,6 +3912,11 @@ class AuroFloatingUI {
3809
3912
  * This prevents the component itself from being focusable when the trigger element already handles focus.
3810
3913
  */
3811
3914
  handleTriggerTabIndex() {
3915
+ const element = this.element;
3916
+ if (!element) {
3917
+ return;
3918
+ }
3919
+
3812
3920
  const focusableElementSelectors = [
3813
3921
  "a",
3814
3922
  "button",
@@ -3821,7 +3929,7 @@ class AuroFloatingUI {
3821
3929
  "auro-hyperlink",
3822
3930
  ];
3823
3931
 
3824
- const triggerNode = this.element.querySelectorAll('[slot="trigger"]')[0];
3932
+ const triggerNode = element.querySelectorAll('[slot="trigger"]')[0];
3825
3933
  if (!triggerNode) {
3826
3934
  return;
3827
3935
  }
@@ -3830,13 +3938,13 @@ class AuroFloatingUI {
3830
3938
  focusableElementSelectors.forEach((selector) => {
3831
3939
  // Check if the trigger node element is focusable
3832
3940
  if (triggerNodeTagName === selector) {
3833
- this.element.tabIndex = -1;
3941
+ element.tabIndex = -1;
3834
3942
  return;
3835
3943
  }
3836
3944
 
3837
3945
  // Check if any child is focusable
3838
3946
  if (triggerNode.querySelector(selector)) {
3839
- this.element.tabIndex = -1;
3947
+ element.tabIndex = -1;
3840
3948
  }
3841
3949
  });
3842
3950
  }
@@ -3846,13 +3954,18 @@ class AuroFloatingUI {
3846
3954
  * @param {*} eventPrefix
3847
3955
  */
3848
3956
  regenerateBibId() {
3849
- this.id = this.element.getAttribute("id");
3957
+ const element = this.element;
3958
+ if (!element) {
3959
+ return;
3960
+ }
3961
+
3962
+ this.id = element.getAttribute("id");
3850
3963
  if (!this.id) {
3851
3964
  this.id = window.crypto.randomUUID();
3852
- this.element.setAttribute("id", this.id);
3965
+ element.setAttribute("id", this.id);
3853
3966
  }
3854
3967
 
3855
- this.element.bib.setAttribute("id", `${this.id}-floater-bib`);
3968
+ element.bib?.setAttribute("id", `${this.id}-floater-bib`);
3856
3969
  }
3857
3970
 
3858
3971
  configure(elem, eventPrefix, enableKeyboardHandling = true) {
@@ -3864,67 +3977,69 @@ class AuroFloatingUI {
3864
3977
  this.element = elem;
3865
3978
  }
3866
3979
 
3867
- if (this.behavior !== this.element.behavior) {
3868
- this.behavior = this.element.behavior;
3980
+ const element = this.element;
3981
+ if (!element) {
3982
+ return;
3983
+ }
3984
+
3985
+ if (this.behavior !== element.behavior) {
3986
+ this.behavior = element.behavior;
3869
3987
  }
3870
3988
 
3871
- if (this.element.trigger) {
3989
+ if (element.trigger) {
3872
3990
  this.disconnect();
3873
3991
  }
3874
- this.element.trigger =
3875
- this.element.triggerElement ||
3876
- this.element.shadowRoot.querySelector("#trigger") ||
3877
- this.element.trigger;
3878
- this.element.bib =
3879
- this.element.shadowRoot.querySelector("#bib") || this.element.bib;
3880
- this.element.bibSizer = this.element.shadowRoot.querySelector("#bibSizer");
3881
- this.element.triggerChevron =
3882
- this.element.shadowRoot.querySelector("#showStateIcon");
3992
+ element.trigger =
3993
+ element.triggerElement ||
3994
+ element.shadowRoot?.querySelector("#trigger") ||
3995
+ element.trigger;
3996
+ element.bib = element.shadowRoot?.querySelector("#bib") || element.bib;
3997
+ element.bibSizer = element.shadowRoot?.querySelector("#bibSizer");
3998
+ element.triggerChevron =
3999
+ element.shadowRoot?.querySelector("#showStateIcon");
3883
4000
 
3884
- if (this.element.floaterConfig) {
3885
- this.element.hoverToggle = this.element.floaterConfig.hoverToggle;
4001
+ if (element.floaterConfig) {
4002
+ element.hoverToggle = element.floaterConfig.hoverToggle;
3886
4003
  }
3887
4004
 
3888
4005
  this.regenerateBibId();
3889
4006
  this.handleTriggerTabIndex();
3890
4007
 
3891
4008
  this.handleEvent = this.handleEvent.bind(this);
3892
- if (this.element.trigger) {
4009
+ if (element.trigger) {
3893
4010
  if (this.enableKeyboardHandling) {
3894
- this.element.trigger.addEventListener("keydown", this.handleEvent);
4011
+ element.trigger.addEventListener("keydown", this.handleEvent);
3895
4012
  }
3896
- this.element.trigger.addEventListener("click", this.handleEvent);
3897
- this.element.trigger.addEventListener("mouseenter", this.handleEvent);
3898
- this.element.trigger.addEventListener("mouseleave", this.handleEvent);
3899
- this.element.trigger.addEventListener("focus", this.handleEvent);
3900
- this.element.trigger.addEventListener("blur", this.handleEvent);
4013
+ element.trigger.addEventListener("click", this.handleEvent);
4014
+ element.trigger.addEventListener("mouseenter", this.handleEvent);
4015
+ element.trigger.addEventListener("mouseleave", this.handleEvent);
4016
+ element.trigger.addEventListener("focus", this.handleEvent);
4017
+ element.trigger.addEventListener("blur", this.handleEvent);
3901
4018
  }
3902
4019
  }
3903
4020
 
3904
4021
  disconnect() {
3905
4022
  this.cleanupHideHandlers();
3906
- if (this.element) {
3907
- this.element.cleanup?.();
3908
4023
 
3909
- if (this.element.bib) {
3910
- this.element.shadowRoot.append(this.element.bib);
3911
- }
4024
+ const element = this.element;
4025
+ if (!element) {
4026
+ return;
4027
+ }
3912
4028
 
3913
- // Remove event & keyboard listeners
3914
- if (this.element?.trigger) {
3915
- this.element.trigger.removeEventListener("keydown", this.handleEvent);
3916
- this.element.trigger.removeEventListener("click", this.handleEvent);
3917
- this.element.trigger.removeEventListener(
3918
- "mouseenter",
3919
- this.handleEvent,
3920
- );
3921
- this.element.trigger.removeEventListener(
3922
- "mouseleave",
3923
- this.handleEvent,
3924
- );
3925
- this.element.trigger.removeEventListener("focus", this.handleEvent);
3926
- this.element.trigger.removeEventListener("blur", this.handleEvent);
3927
- }
4029
+ element.cleanup?.();
4030
+
4031
+ if (element.bib && element.shadowRoot) {
4032
+ element.shadowRoot.append(element.bib);
4033
+ }
4034
+
4035
+ // Remove event & keyboard listeners
4036
+ if (element.trigger) {
4037
+ element.trigger.removeEventListener("keydown", this.handleEvent);
4038
+ element.trigger.removeEventListener("click", this.handleEvent);
4039
+ element.trigger.removeEventListener("mouseenter", this.handleEvent);
4040
+ element.trigger.removeEventListener("mouseleave", this.handleEvent);
4041
+ element.trigger.removeEventListener("focus", this.handleEvent);
4042
+ element.trigger.removeEventListener("blur", this.handleEvent);
3928
4043
  }
3929
4044
  }
3930
4045
  }
@@ -5052,7 +5167,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$3 {
5052
5167
  }
5053
5168
  };
5054
5169
 
5055
- var formkitVersion$1 = '202604072212';
5170
+ var formkitVersion$1 = '202604091759';
5056
5171
 
5057
5172
  class AuroElement extends i$3 {
5058
5173
  static get properties() {
@@ -5158,7 +5273,7 @@ class AuroElement extends i$3 {
5158
5273
  }
5159
5274
  }
5160
5275
 
5161
- // Copyright (c) 2026 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
5276
+ // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
5162
5277
  // See LICENSE in the project root for license information.
5163
5278
 
5164
5279
 
@@ -6797,13 +6912,13 @@ class AuroHelpText extends i$3 {
6797
6912
  }
6798
6913
  }
6799
6914
 
6800
- var formkitVersion = '202604072212';
6915
+ var formkitVersion = '202604091759';
6801
6916
 
6802
6917
  var styleCss$2 = 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}.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, 0.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, 0.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, 0.625rem);font-weight:var(--wcss-body-weight, 450);letter-spacing:var(--wcss-body-letter-spacing, 0);line-height:var(--wcss-body-2xs-line-height, 0.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, 0.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, 0.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, 0.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, 0.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, 0.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, 0.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(0.875rem, 1.1666666667vw, 0.875rem));font-weight:var(--wcss-accent-2xs-weight, 450);letter-spacing:var(--wcss-accent-2xs-letter-spacing, 0.1em);line-height:var(--wcss-accent-2xs-line-height, 1.3);text-transform:uppercase}[auro-dropdown]{--ds-auro-dropdown-trigger-border-color: var(--ds-auro-select-border-color);--ds-auro-dropdown-trigger-background-color: var(--ds-auro-select-background-color);--ds-auro-dropdown-trigger-container-color: var(--ds-auro-select-background-color);--ds-auro-dropdown-trigger-outline-color: var(--ds-auro-select-outline-color)}:host{display:inline-block;text-align:left;vertical-align:top}:host([layout*=emphasized]) [auro-dropdown],:host([layout*=snowflake]) [auro-dropdown]{--ds-auro-select-border-color: transparent}:host([layout*=emphasized]) .mainContent,:host([layout*=snowflake]) .mainContent{text-align:center}.mainContent{position:relative;display:flex;overflow:hidden;flex:1;flex-direction:column;align-items:center;justify-content:center}.valueContainer [slot=displayValue]{display:none}.accents{display:flex;flex-direction:row;align-items:center;justify-content:center}::slotted([slot=typeIcon]){margin-right:var(--ds-size-100, 0.5rem)}.displayValue{display:block}.displayValue:not(.force){display:none}.displayValue:not(.force).hasContent:is(.withValue):not(.hasFocus){display:block}.triggerContent{display:flex;width:100%;align-items:center;justify-content:center}:host([layout*=emphasized]) .triggerContent{padding:0 var(--ds-size-100, 0.5rem) 0 var(--ds-size-300, 1.5rem)}:host([layout*=snowflake]) .triggerContent{padding:0 var(--ds-size-100, 0.5rem) 0 var(--ds-size-200, 1rem)}:host([layout*=snowflake]) label{padding-block:var(--ds-size-25, 0.125rem)}:host([layout*=classic]) .triggerContent{padding:0 var(--ds-size-100, 0.5rem)}:host([layout*=classic]) .mainContent{align-items:start}:host([layout*=classic]) label{overflow:hidden;cursor:text;text-overflow:ellipsis;white-space:nowrap}:host([layout*=classic]) .value{height:auto}label{color:var(--ds-auro-select-label-text-color)}:host(:is([validity]:not([validity=valid]))) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-basic-color-status-error, #e31f26);--ds-auro-select-outline-color: var(--ds-basic-color-status-error, #e31f26);--ds-auro-dropdown-helptext-text-color: var(--ds-basic-color-texticon-default, #2a2a2a)}:host([ondark]:is([validity]:not([validity=valid]))) [auro-dropdown],:host([appearance=inverse]:is([validity]:not([validity=valid]))) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8);--ds-auro-select-outline-color: var(--ds-advanced-color-state-error-inverse, #f9a4a8);--ds-auro-dropdown-helptext-text-color: var(--ds-basic-color-texticon-inverse, #ffffff)}#slotHolder{display:none}:host([fluid]){width:100%}:host([disabled]){pointer-events:none;user-select:none}:host([disabled]:not([ondark])) [auro-dropdown],:host([disabled]:not([appearance=inverse])) [auro-dropdown]{--ds-auro-select-border-color: var(--ds-basic-color-border-subtle, #dddddd)}:host(:not([layout*=classic])[disabled][ondark]) [auro-dropdown],:host(:not([layout*=classic])[disabled][appearance=inverse]) [auro-dropdown]{--ds-auro-select-border-color: transparent}`;
6803
6918
 
6804
6919
  var emphasizedColorCss = i$6`:host([layout=emphasized]) [auro-dropdown]{--ds-auro-dropdown-trigger-background-color: var(--ds-advanced-color-dropdown-emphasized-background, rgba(0, 39, 74, 0.1019607843))}:host([layout=emphasized]) [auro-dropdown]:hover{--ds-auro-dropdown-trigger-hover-background-color: var(--ds-advanced-color-dropdown-emphasized-background, rgba(0, 39, 74, 0.1019607843))}:host([layout=emphasized]) [auro-dropdown][layout*=emphasized]::part(wrapper){--ds-auro-dropdown-trigger-background-color: var(--ds-advanced-color-dropdown-emphasized-background, rgba(0, 39, 74, 0.1019607843))}`;
6805
6920
 
6806
- // Copyright (c) 2026 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
6921
+ // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
6807
6922
  // See LICENSE in the project root for license information.
6808
6923
 
6809
6924
 
@@ -7598,6 +7713,7 @@ class AuroSelect extends AuroElement$1 {
7598
7713
  this.scrollActiveOptionIntoView();
7599
7714
  }
7600
7715
  });
7716
+
7601
7717
  this.menu.addEventListener('auroMenu-selectedOption', (event) => {
7602
7718
 
7603
7719
  // Update the displayed value
@@ -7611,6 +7727,7 @@ class AuroSelect extends AuroElement$1 {
7611
7727
 
7612
7728
  if (this.dropdown.isPopoverVisible && !this.multiSelect) {
7613
7729
  this.dropdown.hide();
7730
+ this.dropdown.trigger.focus();
7614
7731
  }
7615
7732
 
7616
7733
  // Announce the selection after the dropdown closes so it isn't
@@ -7872,9 +7989,6 @@ class AuroSelect extends AuroElement$1 {
7872
7989
  if (!this.multiSelect) {
7873
7990
  this.hideBib();
7874
7991
  }
7875
- if (this.dropdown && this.dropdown.trigger) {
7876
- this.dropdown.trigger.focus();
7877
- }
7878
7992
 
7879
7993
  // LEGACY EVENT
7880
7994
  this.dispatchEvent(new CustomEvent('auroSelect-valueSet', {
@@ -8479,6 +8593,7 @@ class AuroMenuOption extends AuroElement$1 {
8479
8593
  this.selected = false;
8480
8594
  this.noCheckmark = false;
8481
8595
  this.disabled = false;
8596
+ this.noMatch = false;
8482
8597
 
8483
8598
  /**
8484
8599
  * @private
@@ -8554,6 +8669,15 @@ class AuroMenuOption extends AuroElement$1 {
8554
8669
  reflect: true
8555
8670
  },
8556
8671
 
8672
+ /**
8673
+ * When true, marks this option as the "no matching results" placeholder shown by combobox when the user's input does not match any available options. Enables distinct styling and prevents the option from being treated as a selectable match.
8674
+ */
8675
+ noMatch: {
8676
+ type: Boolean,
8677
+ reflect: true,
8678
+ attribute: 'nomatch'
8679
+ },
8680
+
8557
8681
  /**
8558
8682
  * Specifies that an option is selected.
8559
8683
  */