@aurodesignsystem-dev/auro-formkit 0.0.0-pr1411.0 → 0.0.0-pr1411.2

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 (39) hide show
  1. package/components/checkbox/demo/api.min.js +1 -1
  2. package/components/checkbox/demo/index.min.js +1 -1
  3. package/components/checkbox/dist/index.js +1 -1
  4. package/components/checkbox/dist/registered.js +1 -1
  5. package/components/combobox/demo/api.min.js +27 -7
  6. package/components/combobox/demo/index.min.js +27 -7
  7. package/components/combobox/dist/index.js +27 -7
  8. package/components/combobox/dist/registered.js +27 -7
  9. package/components/counter/demo/api.min.js +26 -6
  10. package/components/counter/demo/index.min.js +26 -6
  11. package/components/counter/dist/index.js +26 -6
  12. package/components/counter/dist/registered.js +26 -6
  13. package/components/datepicker/demo/api.min.js +27 -7
  14. package/components/datepicker/demo/index.min.js +27 -7
  15. package/components/datepicker/dist/index.js +27 -7
  16. package/components/datepicker/dist/registered.js +27 -7
  17. package/components/dropdown/demo/api.md +29 -28
  18. package/components/dropdown/demo/api.min.js +25 -5
  19. package/components/dropdown/demo/index.min.js +25 -5
  20. package/components/dropdown/dist/auro-dropdown.d.ts +8 -0
  21. package/components/dropdown/dist/index.js +25 -5
  22. package/components/dropdown/dist/registered.js +25 -5
  23. package/components/form/demo/api.min.js +159 -54
  24. package/components/form/demo/index.min.js +159 -54
  25. package/components/input/demo/api.min.js +1 -1
  26. package/components/input/demo/index.min.js +1 -1
  27. package/components/input/dist/index.js +1 -1
  28. package/components/input/dist/registered.js +1 -1
  29. package/components/radio/demo/api.min.js +1 -1
  30. package/components/radio/demo/index.min.js +1 -1
  31. package/components/radio/dist/index.js +1 -1
  32. package/components/radio/dist/registered.js +1 -1
  33. package/components/select/demo/api.min.js +76 -31
  34. package/components/select/demo/index.min.js +76 -31
  35. package/components/select/dist/index.js +76 -31
  36. package/components/select/dist/registered.js +76 -31
  37. package/components/select/dist/selectKeyboardStrategy.d.ts +4 -3
  38. package/custom-elements.json +20 -1
  39. package/package.json +5 -5
@@ -1248,41 +1248,48 @@ function navigateArrow(component, direction, options = {}) {
1248
1248
  }
1249
1249
  }
1250
1250
 
1251
+ /* eslint-disable new-cap */
1252
+
1251
1253
  const selectKeyboardStrategy = {
1252
1254
  ArrowUp(component, evt, ctx) {
1253
- // Navigate menu only if the bib is open, otherwise open the bib
1254
1255
  evt.preventDefault();
1255
- if (evt.altKey || evt.metaKey) ; else if (component.dropdown.isPopoverVisible) {
1256
- navigateArrow(component, 'up', {
1257
- ctx,
1258
- showFn: () => component.dropdown.show(),
1259
- });
1260
- } else {
1261
- component.dropdown.show();
1256
+ if (evt.altKey || evt.metaKey) {
1257
+ // navigate to first enabled option
1258
+ selectKeyboardStrategy.Home(component, evt, ctx);
1259
+ return;
1262
1260
  }
1261
+ navigateArrow(component, 'up', {
1262
+ ctx,
1263
+ showFn: () => component.dropdown.show(),
1264
+ });
1263
1265
  },
1264
1266
 
1265
1267
  ArrowDown(component, evt, ctx) {
1266
- // Navigate menu only if the bib is open, otherwise open the bib
1267
1268
  evt.preventDefault();
1268
- if (evt.altKey || evt.metaKey) ; else if (component.dropdown.isPopoverVisible) {
1269
- navigateArrow(component, 'down', {
1270
- ctx,
1271
- showFn: () => component.dropdown.show(),
1272
- });
1273
- } else {
1274
- component.dropdown.show();
1269
+ if (evt.altKey || evt.metaKey) {
1270
+ // navigate to last enabled option
1271
+ selectKeyboardStrategy.End(component, evt, ctx);
1272
+ return;
1275
1273
  }
1274
+ navigateArrow(component, 'down', {
1275
+ ctx,
1276
+ showFn: () => component.dropdown.show(),
1277
+ });
1276
1278
  },
1277
1279
 
1278
1280
  Enter(component, evt, ctx) {
1279
- if (!ctx.isExpanded && ctx.isPopover) {
1280
- component.menu.makeSelection();
1281
- } else if (ctx.isModal && !evt.defaultPrevented) {
1282
- // for modal, isExpanded is always true
1283
- // defaultPrevented will be true if Floating UI has already handled the event to open the dropdown
1284
- component.menu.makeSelection();
1281
+ if (!ctx.isExpanded) {
1282
+ component.dropdown.show();
1283
+ return;
1285
1284
  }
1285
+ component.menu.makeSelection();
1286
+ },
1287
+
1288
+ Escape(component, evt, ctx) {
1289
+ if (!ctx.isExpanded) {
1290
+ return;
1291
+ }
1292
+ component.dropdown.hide();
1286
1293
  },
1287
1294
 
1288
1295
  Tab(component, evt, ctx) {
@@ -1297,7 +1304,10 @@ const selectKeyboardStrategy = {
1297
1304
  }
1298
1305
  component.dropdown.hide();
1299
1306
  },
1300
- Home(component, evt) {
1307
+ Home(component, evt, ctx) {
1308
+ if (!ctx.isExpanded) {
1309
+ return;
1310
+ }
1301
1311
  evt.preventDefault();
1302
1312
  evt.stopPropagation();
1303
1313
  const firstOption = component.menu.menuService.menuOptions.find((option) => !option.disabled);
@@ -1306,7 +1316,10 @@ const selectKeyboardStrategy = {
1306
1316
  }
1307
1317
  },
1308
1318
 
1309
- End(component, evt) {
1319
+ End(component, evt, ctx) {
1320
+ if (!ctx.isExpanded) {
1321
+ return;
1322
+ }
1310
1323
  evt.preventDefault();
1311
1324
  evt.stopPropagation();
1312
1325
  const lastOption = [...component.menu.menuService.menuOptions].reverse().find((option) => !option.disabled);
@@ -1315,8 +1328,17 @@ const selectKeyboardStrategy = {
1315
1328
  }
1316
1329
  },
1317
1330
 
1318
- default(component, evt) {
1331
+ default(component, evt, ctx) {
1319
1332
  component.updateActiveOptionBasedOnKey(evt.key);
1333
+ if (evt.key === ' ') {
1334
+ evt.preventDefault();
1335
+ evt.stopPropagation();
1336
+ if (ctx.isExpanded) {
1337
+ component.dropdown.hide();
1338
+ return;
1339
+ }
1340
+ component.dropdown.show();
1341
+ }
1320
1342
  },
1321
1343
  };
1322
1344
 
@@ -3149,6 +3171,11 @@ class AuroFloatingUI {
3149
3171
  this.clickHandler = null;
3150
3172
  this.keyDownHandler = null;
3151
3173
 
3174
+ /**
3175
+ * @private
3176
+ */
3177
+ this.enableKeyboardHandling = true;
3178
+
3152
3179
  /**
3153
3180
  * @private
3154
3181
  */
@@ -3483,7 +3510,9 @@ class AuroFloatingUI {
3483
3510
  document.addEventListener("focusin", this.focusHandler);
3484
3511
  }
3485
3512
 
3486
- document.addEventListener("keydown", this.keyDownHandler);
3513
+ if (this.enableKeyboardHandling) {
3514
+ document.addEventListener("keydown", this.keyDownHandler);
3515
+ }
3487
3516
 
3488
3517
  // send this task to the end of queue to prevent conflicting
3489
3518
  // it conflicts if showBib gets call from a button that's not this.element.trigger
@@ -3739,8 +3768,9 @@ class AuroFloatingUI {
3739
3768
  this.element.bib.setAttribute("id", `${this.id}-floater-bib`);
3740
3769
  }
3741
3770
 
3742
- configure(elem, eventPrefix) {
3771
+ configure(elem, eventPrefix, enableKeyboardHandling = true) {
3743
3772
  AuroFloatingUI.setupMousePressChecker();
3773
+ this.enableKeyboardHandling = enableKeyboardHandling;
3744
3774
 
3745
3775
  this.eventPrefix = eventPrefix;
3746
3776
  if (this.element !== elem) {
@@ -3773,7 +3803,9 @@ class AuroFloatingUI {
3773
3803
 
3774
3804
  this.handleEvent = this.handleEvent.bind(this);
3775
3805
  if (this.element.trigger) {
3776
- this.element.trigger.addEventListener("keydown", this.handleEvent);
3806
+ if (this.enableKeyboardHandling) {
3807
+ this.element.trigger.addEventListener("keydown", this.handleEvent);
3808
+ }
3777
3809
  this.element.trigger.addEventListener("click", this.handleEvent);
3778
3810
  this.element.trigger.addEventListener("mouseenter", this.handleEvent);
3779
3811
  this.element.trigger.addEventListener("mouseleave", this.handleEvent);
@@ -4927,7 +4959,7 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
4927
4959
  }
4928
4960
  };
4929
4961
 
4930
- var formkitVersion$1 = '202604021512';
4962
+ var formkitVersion$1 = '202604021752';
4931
4963
 
4932
4964
  class AuroElement extends LitElement {
4933
4965
  static get properties() {
@@ -5108,6 +5140,7 @@ class AuroDropdown extends AuroElement {
5108
5140
  this.appearance = 'default';
5109
5141
  this.chevron = false;
5110
5142
  this.disabled = false;
5143
+ this.disableKeyboardHandling = false;
5111
5144
  this.error = false;
5112
5145
  this.tabIndex = 0;
5113
5146
  this.noToggle = false;
@@ -5319,6 +5352,14 @@ class AuroDropdown extends AuroElement {
5319
5352
  reflect: true
5320
5353
  },
5321
5354
 
5355
+ /**
5356
+ * If declared, the dropdown will not handle keyboard events and will require the consumer to manage this behavior.
5357
+ */
5358
+ disableKeyboardHandling: {
5359
+ type: Boolean,
5360
+ reflect: true
5361
+ },
5362
+
5322
5363
  /**
5323
5364
  * @private
5324
5365
  */
@@ -5624,7 +5665,7 @@ class AuroDropdown extends AuroElement {
5624
5665
 
5625
5666
  firstUpdated() {
5626
5667
  // Configure the floater to, this will generate the ID for the bib
5627
- this.floater.configure(this, 'auroDropdown');
5668
+ this.floater.configure(this, 'auroDropdown', !this.disableKeyboardHandling);
5628
5669
 
5629
5670
  // Prevent `contain: layout` on the dropdown host. Layout containment
5630
5671
  // creates a containing block for position:fixed descendants (the bib),
@@ -5932,6 +5973,7 @@ class AuroDropdown extends AuroElement {
5932
5973
  aria-expanded="${ifDefined(this.a11yRole === 'button' || this.triggerContentFocusable ? undefined : this.isPopoverVisible)}"
5933
5974
  aria-controls="${ifDefined(this.a11yRole === 'button' || this.triggerContentFocusable ? undefined : this.dropdownId)}"
5934
5975
  aria-labelledby="${ifDefined(this.triggerContentFocusable ? undefined : 'triggerLabel')}"
5976
+ aria-disabled="${ifDefined(this.disabled ? 'true' : undefined)}"
5935
5977
  @focusin="${this.handleFocusin}"
5936
5978
  @blur="${this.handleFocusOut}">
5937
5979
  <div class="triggerContentWrapper" id="triggerLabel">
@@ -6670,7 +6712,7 @@ class AuroHelpText extends LitElement {
6670
6712
  }
6671
6713
  }
6672
6714
 
6673
- var formkitVersion = '202604021512';
6715
+ var formkitVersion = '202604021752';
6674
6716
 
6675
6717
  var styleCss = css`.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}`;
6676
6718
 
@@ -7923,6 +7965,7 @@ class AuroSelect extends AuroElement$1 {
7923
7965
  <slot name="bib.fullscreen.headline" @slotchange="${this.handleSlotChange}"></slot>
7924
7966
  </div>
7925
7967
  <${this.dropdownTag}
7968
+ disableKeyboardHandling
7926
7969
  appearance="${this.onDark ? 'inverse' : this.appearance}"
7927
7970
  .a11yRole=${"combobox"}
7928
7971
  ?autoPlacement="${this.autoPlacement}"
@@ -8002,6 +8045,7 @@ class AuroSelect extends AuroElement$1 {
8002
8045
  <slot name="bib.fullscreen.headline" @slotchange="${this.handleSlotChange}"></slot>
8003
8046
  </div>
8004
8047
  <${this.dropdownTag}
8048
+ disableKeyboardHandling
8005
8049
  appearance="${this.onDark ? 'inverse' : this.appearance}"
8006
8050
  .a11yRole=${"combobox"}
8007
8051
  ?autoPlacement="${this.autoPlacement}"
@@ -8087,6 +8131,7 @@ class AuroSelect extends AuroElement$1 {
8087
8131
  <slot name="bib.fullscreen.headline" @slotchange="${this.handleSlotChange}"></slot>
8088
8132
  </div>
8089
8133
  <${this.dropdownTag}
8134
+ disableKeyboardHandling
8090
8135
  appearance="${this.onDark ? 'inverse' : this.appearance}"
8091
8136
  .a11yRole=${"combobox"}
8092
8137
  ?autoPlacement="${this.autoPlacement}"
@@ -1248,41 +1248,48 @@ function navigateArrow(component, direction, options = {}) {
1248
1248
  }
1249
1249
  }
1250
1250
 
1251
+ /* eslint-disable new-cap */
1252
+
1251
1253
  const selectKeyboardStrategy = {
1252
1254
  ArrowUp(component, evt, ctx) {
1253
- // Navigate menu only if the bib is open, otherwise open the bib
1254
1255
  evt.preventDefault();
1255
- if (evt.altKey || evt.metaKey) ; else if (component.dropdown.isPopoverVisible) {
1256
- navigateArrow(component, 'up', {
1257
- ctx,
1258
- showFn: () => component.dropdown.show(),
1259
- });
1260
- } else {
1261
- component.dropdown.show();
1256
+ if (evt.altKey || evt.metaKey) {
1257
+ // navigate to first enabled option
1258
+ selectKeyboardStrategy.Home(component, evt, ctx);
1259
+ return;
1262
1260
  }
1261
+ navigateArrow(component, 'up', {
1262
+ ctx,
1263
+ showFn: () => component.dropdown.show(),
1264
+ });
1263
1265
  },
1264
1266
 
1265
1267
  ArrowDown(component, evt, ctx) {
1266
- // Navigate menu only if the bib is open, otherwise open the bib
1267
1268
  evt.preventDefault();
1268
- if (evt.altKey || evt.metaKey) ; else if (component.dropdown.isPopoverVisible) {
1269
- navigateArrow(component, 'down', {
1270
- ctx,
1271
- showFn: () => component.dropdown.show(),
1272
- });
1273
- } else {
1274
- component.dropdown.show();
1269
+ if (evt.altKey || evt.metaKey) {
1270
+ // navigate to last enabled option
1271
+ selectKeyboardStrategy.End(component, evt, ctx);
1272
+ return;
1275
1273
  }
1274
+ navigateArrow(component, 'down', {
1275
+ ctx,
1276
+ showFn: () => component.dropdown.show(),
1277
+ });
1276
1278
  },
1277
1279
 
1278
1280
  Enter(component, evt, ctx) {
1279
- if (!ctx.isExpanded && ctx.isPopover) {
1280
- component.menu.makeSelection();
1281
- } else if (ctx.isModal && !evt.defaultPrevented) {
1282
- // for modal, isExpanded is always true
1283
- // defaultPrevented will be true if Floating UI has already handled the event to open the dropdown
1284
- component.menu.makeSelection();
1281
+ if (!ctx.isExpanded) {
1282
+ component.dropdown.show();
1283
+ return;
1285
1284
  }
1285
+ component.menu.makeSelection();
1286
+ },
1287
+
1288
+ Escape(component, evt, ctx) {
1289
+ if (!ctx.isExpanded) {
1290
+ return;
1291
+ }
1292
+ component.dropdown.hide();
1286
1293
  },
1287
1294
 
1288
1295
  Tab(component, evt, ctx) {
@@ -1297,7 +1304,10 @@ const selectKeyboardStrategy = {
1297
1304
  }
1298
1305
  component.dropdown.hide();
1299
1306
  },
1300
- Home(component, evt) {
1307
+ Home(component, evt, ctx) {
1308
+ if (!ctx.isExpanded) {
1309
+ return;
1310
+ }
1301
1311
  evt.preventDefault();
1302
1312
  evt.stopPropagation();
1303
1313
  const firstOption = component.menu.menuService.menuOptions.find((option) => !option.disabled);
@@ -1306,7 +1316,10 @@ const selectKeyboardStrategy = {
1306
1316
  }
1307
1317
  },
1308
1318
 
1309
- End(component, evt) {
1319
+ End(component, evt, ctx) {
1320
+ if (!ctx.isExpanded) {
1321
+ return;
1322
+ }
1310
1323
  evt.preventDefault();
1311
1324
  evt.stopPropagation();
1312
1325
  const lastOption = [...component.menu.menuService.menuOptions].reverse().find((option) => !option.disabled);
@@ -1315,8 +1328,17 @@ const selectKeyboardStrategy = {
1315
1328
  }
1316
1329
  },
1317
1330
 
1318
- default(component, evt) {
1331
+ default(component, evt, ctx) {
1319
1332
  component.updateActiveOptionBasedOnKey(evt.key);
1333
+ if (evt.key === ' ') {
1334
+ evt.preventDefault();
1335
+ evt.stopPropagation();
1336
+ if (ctx.isExpanded) {
1337
+ component.dropdown.hide();
1338
+ return;
1339
+ }
1340
+ component.dropdown.show();
1341
+ }
1320
1342
  },
1321
1343
  };
1322
1344
 
@@ -3149,6 +3171,11 @@ class AuroFloatingUI {
3149
3171
  this.clickHandler = null;
3150
3172
  this.keyDownHandler = null;
3151
3173
 
3174
+ /**
3175
+ * @private
3176
+ */
3177
+ this.enableKeyboardHandling = true;
3178
+
3152
3179
  /**
3153
3180
  * @private
3154
3181
  */
@@ -3483,7 +3510,9 @@ class AuroFloatingUI {
3483
3510
  document.addEventListener("focusin", this.focusHandler);
3484
3511
  }
3485
3512
 
3486
- document.addEventListener("keydown", this.keyDownHandler);
3513
+ if (this.enableKeyboardHandling) {
3514
+ document.addEventListener("keydown", this.keyDownHandler);
3515
+ }
3487
3516
 
3488
3517
  // send this task to the end of queue to prevent conflicting
3489
3518
  // it conflicts if showBib gets call from a button that's not this.element.trigger
@@ -3739,8 +3768,9 @@ class AuroFloatingUI {
3739
3768
  this.element.bib.setAttribute("id", `${this.id}-floater-bib`);
3740
3769
  }
3741
3770
 
3742
- configure(elem, eventPrefix) {
3771
+ configure(elem, eventPrefix, enableKeyboardHandling = true) {
3743
3772
  AuroFloatingUI.setupMousePressChecker();
3773
+ this.enableKeyboardHandling = enableKeyboardHandling;
3744
3774
 
3745
3775
  this.eventPrefix = eventPrefix;
3746
3776
  if (this.element !== elem) {
@@ -3773,7 +3803,9 @@ class AuroFloatingUI {
3773
3803
 
3774
3804
  this.handleEvent = this.handleEvent.bind(this);
3775
3805
  if (this.element.trigger) {
3776
- this.element.trigger.addEventListener("keydown", this.handleEvent);
3806
+ if (this.enableKeyboardHandling) {
3807
+ this.element.trigger.addEventListener("keydown", this.handleEvent);
3808
+ }
3777
3809
  this.element.trigger.addEventListener("click", this.handleEvent);
3778
3810
  this.element.trigger.addEventListener("mouseenter", this.handleEvent);
3779
3811
  this.element.trigger.addEventListener("mouseleave", this.handleEvent);
@@ -4927,7 +4959,7 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
4927
4959
  }
4928
4960
  };
4929
4961
 
4930
- var formkitVersion$1 = '202604021512';
4962
+ var formkitVersion$1 = '202604021752';
4931
4963
 
4932
4964
  class AuroElement extends LitElement {
4933
4965
  static get properties() {
@@ -5108,6 +5140,7 @@ class AuroDropdown extends AuroElement {
5108
5140
  this.appearance = 'default';
5109
5141
  this.chevron = false;
5110
5142
  this.disabled = false;
5143
+ this.disableKeyboardHandling = false;
5111
5144
  this.error = false;
5112
5145
  this.tabIndex = 0;
5113
5146
  this.noToggle = false;
@@ -5319,6 +5352,14 @@ class AuroDropdown extends AuroElement {
5319
5352
  reflect: true
5320
5353
  },
5321
5354
 
5355
+ /**
5356
+ * If declared, the dropdown will not handle keyboard events and will require the consumer to manage this behavior.
5357
+ */
5358
+ disableKeyboardHandling: {
5359
+ type: Boolean,
5360
+ reflect: true
5361
+ },
5362
+
5322
5363
  /**
5323
5364
  * @private
5324
5365
  */
@@ -5624,7 +5665,7 @@ class AuroDropdown extends AuroElement {
5624
5665
 
5625
5666
  firstUpdated() {
5626
5667
  // Configure the floater to, this will generate the ID for the bib
5627
- this.floater.configure(this, 'auroDropdown');
5668
+ this.floater.configure(this, 'auroDropdown', !this.disableKeyboardHandling);
5628
5669
 
5629
5670
  // Prevent `contain: layout` on the dropdown host. Layout containment
5630
5671
  // creates a containing block for position:fixed descendants (the bib),
@@ -5932,6 +5973,7 @@ class AuroDropdown extends AuroElement {
5932
5973
  aria-expanded="${ifDefined(this.a11yRole === 'button' || this.triggerContentFocusable ? undefined : this.isPopoverVisible)}"
5933
5974
  aria-controls="${ifDefined(this.a11yRole === 'button' || this.triggerContentFocusable ? undefined : this.dropdownId)}"
5934
5975
  aria-labelledby="${ifDefined(this.triggerContentFocusable ? undefined : 'triggerLabel')}"
5976
+ aria-disabled="${ifDefined(this.disabled ? 'true' : undefined)}"
5935
5977
  @focusin="${this.handleFocusin}"
5936
5978
  @blur="${this.handleFocusOut}">
5937
5979
  <div class="triggerContentWrapper" id="triggerLabel">
@@ -6670,7 +6712,7 @@ class AuroHelpText extends LitElement {
6670
6712
  }
6671
6713
  }
6672
6714
 
6673
- var formkitVersion = '202604021512';
6715
+ var formkitVersion = '202604021752';
6674
6716
 
6675
6717
  var styleCss = css`.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}`;
6676
6718
 
@@ -7923,6 +7965,7 @@ class AuroSelect extends AuroElement$1 {
7923
7965
  <slot name="bib.fullscreen.headline" @slotchange="${this.handleSlotChange}"></slot>
7924
7966
  </div>
7925
7967
  <${this.dropdownTag}
7968
+ disableKeyboardHandling
7926
7969
  appearance="${this.onDark ? 'inverse' : this.appearance}"
7927
7970
  .a11yRole=${"combobox"}
7928
7971
  ?autoPlacement="${this.autoPlacement}"
@@ -8002,6 +8045,7 @@ class AuroSelect extends AuroElement$1 {
8002
8045
  <slot name="bib.fullscreen.headline" @slotchange="${this.handleSlotChange}"></slot>
8003
8046
  </div>
8004
8047
  <${this.dropdownTag}
8048
+ disableKeyboardHandling
8005
8049
  appearance="${this.onDark ? 'inverse' : this.appearance}"
8006
8050
  .a11yRole=${"combobox"}
8007
8051
  ?autoPlacement="${this.autoPlacement}"
@@ -8087,6 +8131,7 @@ class AuroSelect extends AuroElement$1 {
8087
8131
  <slot name="bib.fullscreen.headline" @slotchange="${this.handleSlotChange}"></slot>
8088
8132
  </div>
8089
8133
  <${this.dropdownTag}
8134
+ disableKeyboardHandling
8090
8135
  appearance="${this.onDark ? 'inverse' : this.appearance}"
8091
8136
  .a11yRole=${"combobox"}
8092
8137
  ?autoPlacement="${this.autoPlacement}"
@@ -2,9 +2,10 @@ export namespace selectKeyboardStrategy {
2
2
  export function ArrowUp(component: any, evt: any, ctx: any): void;
3
3
  export function ArrowDown(component: any, evt: any, ctx: any): void;
4
4
  export function Enter(component: any, evt: any, ctx: any): void;
5
+ export function Escape(component: any, evt: any, ctx: any): void;
5
6
  export function Tab(component: any, evt: any, ctx: any): void;
6
- export function Home(component: any, evt: any): void;
7
- export function End(component: any, evt: any): void;
8
- function _default(component: any, evt: any): void;
7
+ export function Home(component: any, evt: any, ctx: any): void;
8
+ export function End(component: any, evt: any, ctx: any): void;
9
+ function _default(component: any, evt: any, ctx: any): void;
9
10
  export { _default as default };
10
11
  }
@@ -8285,6 +8285,17 @@
8285
8285
  "attribute": "disabled",
8286
8286
  "reflects": true
8287
8287
  },
8288
+ {
8289
+ "kind": "field",
8290
+ "name": "disableKeyboardHandling",
8291
+ "privacy": "public",
8292
+ "type": {
8293
+ "text": "boolean"
8294
+ },
8295
+ "description": "If declared, the dropdown will not handle keyboard events and will require the consumer to manage this behavior.",
8296
+ "attribute": "disableKeyboardHandling",
8297
+ "reflects": true
8298
+ },
8288
8299
  {
8289
8300
  "kind": "field",
8290
8301
  "name": "dropdownWidth",
@@ -8568,6 +8579,14 @@
8568
8579
  "description": "If declared, the dropdown is not interactive.",
8569
8580
  "fieldName": "disabled"
8570
8581
  },
8582
+ {
8583
+ "name": "disableKeyboardHandling",
8584
+ "type": {
8585
+ "text": "boolean"
8586
+ },
8587
+ "description": "If declared, the dropdown will not handle keyboard events and will require the consumer to manage this behavior.",
8588
+ "fieldName": "disableKeyboardHandling"
8589
+ },
8571
8590
  {
8572
8591
  "name": "dropdownWidth",
8573
8592
  "type": {
@@ -18692,7 +18711,7 @@
18692
18711
  "type": {
18693
18712
  "text": "object"
18694
18713
  },
18695
- "default": "{ ArrowUp(component, evt, ctx) { // Navigate menu only if the bib is open, otherwise open the bib evt.preventDefault(); if (evt.altKey || evt.metaKey) { // navigate to first enabled option } else if (component.dropdown.isPopoverVisible) { navigateArrow(component, 'up', { ctx, showFn: () => component.dropdown.show(), }); } else { component.dropdown.show(); } }, ArrowDown(component, evt, ctx) { // Navigate menu only if the bib is open, otherwise open the bib evt.preventDefault(); if (evt.altKey || evt.metaKey) { // navigate to last enabled option } else if (component.dropdown.isPopoverVisible) { navigateArrow(component, 'down', { ctx, showFn: () => component.dropdown.show(), }); } else { component.dropdown.show(); } }, Enter(component, evt, ctx) { if (!ctx.isExpanded && ctx.isPopover) { component.menu.makeSelection(); } else if (ctx.isModal && !evt.defaultPrevented) { // for modal, isExpanded is always true // defaultPrevented will be true if Floating UI has already handled the event to open the dropdown component.menu.makeSelection(); } }, Tab(component, evt, ctx) { if (!ctx.isExpanded) { return; } // Tab selects the focused option and closes the popup per the // WAI-ARIA APG select-only combobox / listbox pattern. if (component.optionActive && !component.multiSelect) { component.menu.makeSelection(); } component.dropdown.hide(); }, Home(component, evt) { evt.preventDefault(); evt.stopPropagation(); const firstOption = component.menu.menuService.menuOptions.find((option) => !option.disabled); if (firstOption) { component.menu.updateActiveOption(firstOption); } }, End(component, evt) { evt.preventDefault(); evt.stopPropagation(); const lastOption = [...component.menu.menuService.menuOptions].reverse().find((option) => !option.disabled); if (lastOption) { component.menu.updateActiveOption(lastOption); } }, default(component, evt) { component.updateActiveOptionBasedOnKey(evt.key); }, }"
18714
+ "default": "{ ArrowUp(component, evt, ctx) { evt.preventDefault(); if (evt.altKey || evt.metaKey) { // navigate to first enabled option selectKeyboardStrategy.Home(component, evt, ctx); return; } navigateArrow(component, 'up', { ctx, showFn: () => component.dropdown.show(), }); }, ArrowDown(component, evt, ctx) { evt.preventDefault(); if (evt.altKey || evt.metaKey) { // navigate to last enabled option selectKeyboardStrategy.End(component, evt, ctx); return; } navigateArrow(component, 'down', { ctx, showFn: () => component.dropdown.show(), }); }, Enter(component, evt, ctx) { if (!ctx.isExpanded) { component.dropdown.show(); return; } component.menu.makeSelection(); }, Escape(component, evt, ctx) { if (!ctx.isExpanded) { return; } component.dropdown.hide(); }, Tab(component, evt, ctx) { if (!ctx.isExpanded) { return; } // Tab selects the focused option and closes the popup per the // WAI-ARIA APG select-only combobox / listbox pattern. if (component.optionActive && !component.multiSelect) { component.menu.makeSelection(); } component.dropdown.hide(); }, Home(component, evt, ctx) { if (!ctx.isExpanded) { return; } evt.preventDefault(); evt.stopPropagation(); const firstOption = component.menu.menuService.menuOptions.find((option) => !option.disabled); if (firstOption) { component.menu.updateActiveOption(firstOption); } }, End(component, evt, ctx) { if (!ctx.isExpanded) { return; } evt.preventDefault(); evt.stopPropagation(); const lastOption = [...component.menu.menuService.menuOptions].reverse().find((option) => !option.disabled); if (lastOption) { component.menu.updateActiveOption(lastOption); } }, default(component, evt, ctx) { component.updateActiveOptionBasedOnKey(evt.key); if (evt.key === ' ') { evt.preventDefault(); evt.stopPropagation(); if (ctx.isExpanded) { component.dropdown.hide(); return; } component.dropdown.show(); } }, }"
18696
18715
  }
18697
18716
  ],
18698
18717
  "exports": [
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@aurodesignsystem-dev/auro-formkit",
3
- "version": "0.0.0-pr1411.0",
3
+ "version": "0.0.0-pr1411.2",
4
4
  "description": "A collection of web components used to build forms.",
5
5
  "homepage": "https://github.com/AlaskaAirlines/auro-formkit#readme",
6
6
  "bugs": {
@@ -76,13 +76,14 @@
76
76
  "lit": "^3.3.1"
77
77
  },
78
78
  "optionalDependencies": {
79
- "@rollup/rollup-linux-x64-gnu": "*",
80
- "@rolldown/binding-linux-x64-gnu": "*"
79
+ "@rolldown/binding-linux-x64-gnu": "*",
80
+ "@rollup/rollup-linux-x64-gnu": "*"
81
81
  },
82
82
  "devDependencies": {
83
83
  "@aurodesignsystem/auro-accordion": "^6.1.1",
84
84
  "@aurodesignsystem/auro-button": "^12.3.2",
85
- "@aurodesignsystem/auro-library": "^5.11.3",
85
+ "@aurodesignsystem/auro-library": "^5.12.0",
86
+ "@aurodesignsystem/auro-loader": "^6.2.0",
86
87
  "@aurodesignsystem/build-tools": "*",
87
88
  "@aurodesignsystem/config": "*",
88
89
  "@aurodesignsystem/design-tokens": "^8.15.1",
@@ -92,7 +93,6 @@
92
93
  "@aurodesignsystem/utils": "*",
93
94
  "@aurodesignsystem/version": "*",
94
95
  "@aurodesignsystem/webcorestylesheets": "^10.1.4",
95
- "@aurodesignsystem/auro-loader": "^6.2.0",
96
96
  "@chromatic-com/storybook": "^5.0.0",
97
97
  "@commitlint/cli": "^19.8.1",
98
98
  "@commitlint/config-conventional": "^19.8.1",