@aurodesignsystem-dev/auro-formkit 0.0.0-pr1474.3 → 0.0.0-pr1475.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (83) hide show
  1. package/components/bibtemplate/dist/auro-bibtemplate.d.ts +7 -0
  2. package/components/bibtemplate/dist/index.js +9 -1
  3. package/components/bibtemplate/dist/registered.js +9 -1
  4. package/components/checkbox/demo/customize.html +2 -1
  5. package/components/checkbox/demo/customize.min.js +1 -1
  6. package/components/checkbox/demo/getting-started.min.js +1 -1
  7. package/components/checkbox/demo/index.min.js +1 -1
  8. package/components/checkbox/dist/index.js +1 -1
  9. package/components/checkbox/dist/registered.js +1 -1
  10. package/components/combobox/demo/customize.html +2 -1
  11. package/components/combobox/demo/customize.md +130 -106
  12. package/components/combobox/demo/customize.min.js +209 -16
  13. package/components/combobox/demo/getting-started.min.js +209 -16
  14. package/components/combobox/demo/index.min.js +209 -16
  15. package/components/combobox/dist/index.js +209 -16
  16. package/components/combobox/dist/registered.js +209 -16
  17. package/components/counter/demo/customize.min.js +208 -15
  18. package/components/counter/demo/index.min.js +208 -15
  19. package/components/counter/demo/keyboard-behavior.md +1 -0
  20. package/components/counter/dist/index.js +10 -2
  21. package/components/counter/dist/registered.js +10 -2
  22. package/components/datepicker/demo/accessibility.md +51 -3
  23. package/components/datepicker/demo/api.md +9 -0
  24. package/components/datepicker/demo/customize.html +2 -0
  25. package/components/datepicker/demo/customize.js +19 -0
  26. package/components/datepicker/demo/customize.md +72 -8
  27. package/components/datepicker/demo/customize.min.js +25690 -0
  28. package/components/datepicker/demo/design.md +3 -1
  29. package/components/datepicker/demo/index.js +2 -1
  30. package/components/datepicker/demo/index.md +81 -1
  31. package/components/datepicker/demo/index.min.js +1223 -101
  32. package/components/datepicker/demo/keyboard-behavior.md +201 -2
  33. package/components/datepicker/demo/voiceover.md +19 -12
  34. package/components/datepicker/dist/index.js +1155 -104
  35. package/components/datepicker/dist/registered.js +1155 -104
  36. package/components/datepicker/dist/src/auro-calendar-cell.d.ts +59 -0
  37. package/components/datepicker/dist/src/auro-calendar-month.d.ts +28 -0
  38. package/components/datepicker/dist/src/auro-calendar.d.ts +84 -0
  39. package/components/datepicker/dist/src/auro-datepicker.d.ts +80 -0
  40. package/components/datepicker/dist/src/datepickerKeyboardStrategy.d.ts +5 -3
  41. package/components/dropdown/demo/accessibility.md +11 -0
  42. package/components/dropdown/demo/api.md +1 -0
  43. package/components/dropdown/demo/customize.md +3 -0
  44. package/components/dropdown/demo/customize.min.js +198 -13
  45. package/components/dropdown/demo/getting-started.min.js +198 -13
  46. package/components/dropdown/demo/index.min.js +198 -13
  47. package/components/dropdown/demo/keyboard-behavior.md +1 -0
  48. package/components/dropdown/dist/auro-dropdown.d.ts +30 -1
  49. package/components/dropdown/dist/index.js +198 -13
  50. package/components/dropdown/dist/registered.js +198 -13
  51. package/components/form/demo/customize.html +6 -6
  52. package/components/form/demo/customize.js +0 -17
  53. package/components/form/demo/customize.md +51 -125
  54. package/components/form/demo/customize.min.js +1776 -327
  55. package/components/form/demo/getting-started.min.js +1776 -291
  56. package/components/form/demo/index.min.js +1776 -291
  57. package/components/form/demo/registerDemoDeps.min.js +1769 -139
  58. package/components/form/dist/auro-form.d.ts +5 -45
  59. package/components/form/dist/index.js +7 -152
  60. package/components/form/dist/registered.js +7 -152
  61. package/components/input/demo/customize.html +2 -1
  62. package/components/input/demo/customize.min.js +1 -1
  63. package/components/input/demo/getting-started.min.js +1 -1
  64. package/components/input/demo/index.min.js +1 -1
  65. package/components/input/dist/index.js +1 -1
  66. package/components/input/dist/registered.js +1 -1
  67. package/components/radio/demo/customize.min.js +2186 -0
  68. package/components/radio/demo/demo-support.min.js +55807 -0
  69. package/components/radio/demo/getting-started.js +1 -1
  70. package/components/radio/demo/getting-started.md +1 -1
  71. package/components/radio/demo/getting-started.min.js +2205 -0
  72. package/components/radio/demo/index.min.js +1 -1
  73. package/components/radio/dist/index.js +1 -1
  74. package/components/radio/dist/registered.js +1 -1
  75. package/components/select/demo/customize.html +2 -2
  76. package/components/select/demo/customize.min.js +208 -15
  77. package/components/select/demo/getting-started.min.js +208 -15
  78. package/components/select/demo/index.min.js +208 -15
  79. package/components/select/demo/keyboard-behavior.md +1 -0
  80. package/components/select/dist/index.js +208 -15
  81. package/components/select/dist/registered.js +208 -15
  82. package/custom-elements.json +2130 -1518
  83. package/package.json +2 -2
@@ -4635,7 +4635,7 @@ function applyKeyboardStrategy(component, strategy, options = {}) {
4635
4635
  });
4636
4636
  }
4637
4637
 
4638
- var styleCss$2$1 = css`:host{position:fixed;z-index:var(--depth-tooltip, 400);display:none;isolation:isolate}:host dialog{width:auto;max-width:none;height:auto;max-height:none;padding:0;border:none;margin:0;outline:none;transform:translateZ(0)}:host dialog::backdrop{background:transparent}:host(:not([isfullscreen])) dialog{position:relative;inset:unset}:host(:not([isfullscreen])) .container.shape-box{border-radius:unset}:host(:not([isfullscreen])) .container[class*=shape-pill],:host(:not([isfullscreen])) .container[class*=shape-snowflake]{border-radius:30px}:host(:not([isfullscreen])) .container[class*=shape-rounded]{border-radius:16px}:host(:not([matchWidth])) .container{min-width:fit-content}:host([isfullscreen]){position:fixed;top:0;left:0}:host([isfullscreen]) .container{width:100dvw;max-width:none;height:100dvh;max-height:none;border-radius:unset;margin-top:0;box-shadow:unset;overscroll-behavior:contain}:host([isfullscreen]) .container::backdrop{background:var(--ds-color-background-primary, #fff)}:host(:popover-open){position:fixed;overflow:visible;padding:0;border:none;margin:0;background:transparent;inset:unset;outline:none}:host([data-show]){display:flex}:host([common]:not([isfullscreen])) .container,:host([rounded]:not([isfullscreen])) .container{border-radius:var(--ds-border-radius, 0.375rem)}:host([common][isfullscreen]) .container,:host([rounded][isfullscreen]) .container{border-radius:unset;box-shadow:unset}.container{display:inline-block;overflow:auto;box-sizing:border-box;border-radius:var(--ds-border-radius, 0.375rem);margin:var(--ds-size-50, 0.25rem) 0}.util_displayHiddenVisually{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;border:0;margin:-1px;clip-path:inset(50%);white-space:nowrap}`;
4638
+ var styleCss$2$1 = css`:host{position:fixed;z-index:var(--depth-tooltip, 400);display:none;isolation:isolate}:host dialog{width:auto;max-width:none;height:auto;max-height:none;padding:0;border:none;margin:0;outline:none;transform:translateZ(0)}:host dialog::backdrop{background:transparent}:host(:not([isfullscreen])) dialog{position:relative;inset:unset}:host(:not([isfullscreen])) .container.shape-box{border-radius:unset}:host(:not([isfullscreen])) .container[class*=shape-pill],:host(:not([isfullscreen])) .container[class*=shape-snowflake]{border-radius:30px}:host(:not([isfullscreen])) .container[class*=shape-rounded]{border-radius:16px}:host([desktopmodal]:popover-open)::backdrop{background:transparent}:host(:not([matchWidth])) .container{min-width:fit-content}:host([isfullscreen]){position:fixed;top:0;left:0}:host([isfullscreen]) .container{width:100dvw;max-width:none;height:100dvh;max-height:none;border-radius:unset;margin-top:0;box-shadow:unset;overscroll-behavior:contain}:host([isfullscreen]) .container::backdrop{background:var(--ds-color-background-primary, #fff)}:host(:popover-open){position:fixed;overflow:visible;padding:0;border:none;margin:0;background:transparent;inset:unset;outline:none}:host([data-show]){display:flex}:host([common]:not([isfullscreen])) .container,:host([rounded]:not([isfullscreen])) .container{border-radius:var(--ds-border-radius, 0.375rem)}:host([common][isfullscreen]) .container,:host([rounded][isfullscreen]) .container{border-radius:unset;box-shadow:unset}.container{display:inline-block;overflow:auto;box-sizing:border-box;border-radius:var(--ds-border-radius, 0.375rem);margin:var(--ds-size-50, 0.25rem) 0}.util_displayHiddenVisually{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;border:0;margin:-1px;clip-path:inset(50%);white-space:nowrap}`;
4639
4639
 
4640
4640
  var colorCss$2 = css`.container{background-color:var(--ds-auro-dropdownbib-container-color);box-shadow:var(--ds-auro-dropdownbib-boxshadow-color);color:var(--ds-auro-dropdownbib-text-color)}`;
4641
4641
 
@@ -5266,7 +5266,7 @@ let AuroHelpText$1 = class AuroHelpText extends LitElement {
5266
5266
  }
5267
5267
  };
5268
5268
 
5269
- var formkitVersion$1 = '202605122144';
5269
+ var formkitVersion$1 = '202605182147';
5270
5270
 
5271
5271
  class AuroElement extends LitElement {
5272
5272
  static get properties() {
@@ -5446,6 +5446,7 @@ class AuroDropdown extends AuroElement {
5446
5446
  _intializeDefaults() {
5447
5447
  this.appearance = 'default';
5448
5448
  this.chevron = false;
5449
+ this.desktopModal = false;
5449
5450
  this.disabled = false;
5450
5451
  this.disableKeyboardHandling = false;
5451
5452
  this.error = false;
@@ -5626,6 +5627,14 @@ class AuroDropdown extends AuroElement {
5626
5627
  reflect: true
5627
5628
  },
5628
5629
 
5630
+ /**
5631
+ * If declared, the dropdown will behave as a modal dialog when in a desktop viewport size.
5632
+ */
5633
+ desktopModal: {
5634
+ type: Boolean,
5635
+ reflect: true
5636
+ },
5637
+
5629
5638
  /**
5630
5639
  * If declared, the dropdown will only show by calling the API .show() public method.
5631
5640
  */
@@ -5913,6 +5922,15 @@ class AuroDropdown extends AuroElement {
5913
5922
 
5914
5923
  disconnectedCallback() {
5915
5924
  super.disconnectedCallback();
5925
+ this._clearPageInert();
5926
+ if (this._bibTabHandler) {
5927
+ this.removeEventListener('keydown', this._bibTabHandler);
5928
+ this._bibTabHandler = undefined;
5929
+ }
5930
+ if (this.focusTrap) {
5931
+ this.focusTrap.disconnect();
5932
+ this.focusTrap = undefined;
5933
+ }
5916
5934
  if (this.floater) {
5917
5935
  this.floater.hideBib('disconnect');
5918
5936
  this.floater.disconnect();
@@ -5940,19 +5958,34 @@ class AuroDropdown extends AuroElement {
5940
5958
  if (this.isPopoverVisible) {
5941
5959
  // Fullscreen: use showModal() for native accessibility (inert outside, focus trap)
5942
5960
  // Desktop: use show() for Floating UI positioning + FocusTrap for focus management
5943
- const useModal = this.isBibFullscreen;
5944
- this.bibElement.value.open(useModal);
5961
+ this.bibElement.value.open(this.isBibFullscreen);
5962
+ this.updateFocusTrap();
5963
+
5964
+ // Desktop modal: make siblings inert so content outside is not interactive
5965
+ if (this.desktopModal && !this.isBibFullscreen) {
5966
+ this._setPageInert();
5967
+ }
5945
5968
  } else {
5946
5969
  this.bibElement.value.close();
5970
+ this._clearPageInert();
5947
5971
  }
5948
5972
  }
5949
5973
 
5950
5974
  // When fullscreen strategy changes while open, re-open dialog with correct mode
5951
5975
  // (e.g. resizing from desktop → mobile while dropdown is open)
5952
5976
  if (changedProperties.has('isBibFullscreen') && this.isPopoverVisible && this.bibElement.value) {
5953
- const useModal = this.isBibFullscreen;
5954
5977
  this.bibElement.value.close();
5955
- this.bibElement.value.open(useModal);
5978
+ this.bibElement.value.open(this.isBibFullscreen);
5979
+
5980
+ // Re-initialize focus management for the new strategy
5981
+ this.updateFocusTrap();
5982
+
5983
+ // Toggle inert: desktop modal needs it, fullscreen showModal() handles it natively
5984
+ if (this.desktopModal && !this.isBibFullscreen) {
5985
+ this._setPageInert();
5986
+ } else {
5987
+ this._clearPageInert();
5988
+ }
5956
5989
  }
5957
5990
  }
5958
5991
 
@@ -5962,8 +5995,14 @@ class AuroDropdown extends AuroElement {
5962
5995
  * @param {CustomEvent} event - The custom event that contains the dropdown toggle information.
5963
5996
  */
5964
5997
  handleDropdownToggle(event) {
5965
- this.updateFocusTrap();
5966
5998
  this.isPopoverVisible = event.detail.expanded;
5999
+
6000
+ // Tear down FocusTrap when closing. Creation happens in updated()
6001
+ // after the dialog is open so getFocusableElements can find content.
6002
+ if (!this.isPopoverVisible) {
6003
+ this.updateFocusTrap();
6004
+ }
6005
+
5967
6006
  const eventType = event.detail.eventType || "unknown";
5968
6007
  if (!this.isPopoverVisible && this.hasFocus && eventType === "keydown") {
5969
6008
  this.trigger.focus();
@@ -6062,19 +6101,164 @@ class AuroDropdown extends AuroElement {
6062
6101
  * @private
6063
6102
  */
6064
6103
  updateFocusTrap() {
6104
+ // Always clean up existing handlers/traps before setting up new ones
6105
+ // to prevent duplicate listeners on repeated calls.
6106
+ if (this._bibTabHandler) {
6107
+ this.removeEventListener('keydown', this._bibTabHandler);
6108
+ this._bibTabHandler = undefined;
6109
+ }
6110
+
6111
+ if (this.focusTrap) {
6112
+ this.focusTrap.disconnect();
6113
+ this.focusTrap = undefined;
6114
+ }
6115
+
6065
6116
  if (this.isPopoverVisible) {
6066
6117
  if (!this.isBibFullscreen) {
6067
- // Desktop: show() doesn't trap focus, so use FocusTrap
6068
- this.focusTrap = new FocusTrap(this.bibContent);
6069
- this.focusTrap.focusFirstElement();
6118
+ if (this.desktopModal) {
6119
+ // Desktop modal: trap focus only within the bib content.
6120
+ // Can't use FocusTrap on the bib element because keydown events
6121
+ // from slotted content bubble through the dropdown host (light DOM),
6122
+ // not through the bib (shadow projection target). Using FocusTrap
6123
+ // on the dropdown would include the trigger in the tab cycle.
6124
+ // Instead, listen for Tab on the dropdown and manually wrap focus
6125
+ // within the bib's focusable elements.
6126
+ this._bibTabHandler = (event) => {
6127
+ if (event.key !== 'Tab') {
6128
+ return;
6129
+ }
6130
+
6131
+ // Collect focusable elements from the bib content.
6132
+ const focusables = getFocusableElements(this.bibContent);
6133
+
6134
+ // Fallback: try from slotted content directly
6135
+ if (!focusables.length) {
6136
+ const slot = this.shadowRoot.querySelector('.slotContent slot');
6137
+ const assignedNodes = slot ? slot.assignedNodes({ flatten: true }) : [];
6138
+
6139
+ for (const node of assignedNodes) {
6140
+ if (node.nodeType === Node.ELEMENT_NODE) {
6141
+ focusables.push(...getFocusableElements(node));
6142
+ }
6143
+ }
6144
+ }
6145
+
6146
+ if (!focusables.length) {
6147
+ return;
6148
+ }
6149
+
6150
+ event.preventDefault();
6151
+
6152
+ const direction = event.shiftKey ? -1 : 1; // eslint-disable-line no-magic-numbers
6153
+
6154
+ // Walk the active element chain through shadow roots
6155
+ const actives = this._getActiveElements();
6156
+
6157
+ let idx = focusables.findIndex((el) => actives.includes(el));
6158
+
6159
+ if (idx === -1) { // eslint-disable-line no-magic-numbers
6160
+ // Focus is not on a known element — move to first/last
6161
+ idx = direction === 1 ? -1 : focusables.length; // eslint-disable-line no-magic-numbers
6162
+ }
6163
+
6164
+ // Try each element in order, skipping any that can't receive focus
6165
+ // (e.g. hidden elements, elements in collapsed sections)
6166
+ for (let index = 0; index < focusables.length; index++) { // eslint-disable-line no-plusplus
6167
+ let nextIdx = idx + direction;
6168
+
6169
+ // Wrap around
6170
+ if (nextIdx < 0) {
6171
+ nextIdx = focusables.length - 1;
6172
+ } else if (nextIdx >= focusables.length) {
6173
+ nextIdx = 0;
6174
+ }
6175
+
6176
+ focusables[nextIdx].focus();
6177
+
6178
+ // Verify focus actually moved to the target
6179
+ const newActives = this._getActiveElements();
6180
+
6181
+ if (newActives.includes(focusables[nextIdx])) {
6182
+ return;
6183
+ }
6184
+
6185
+ // Focus didn't stick — skip this element and try the next
6186
+ idx = nextIdx;
6187
+ }
6188
+ };
6189
+ this.addEventListener('keydown', this._bibTabHandler);
6190
+ } else {
6191
+ // Normal desktop: use FocusTrap on the bib element
6192
+ this.focusTrap = new FocusTrap(this.bibContent);
6193
+ this.focusTrap.focusFirstElement();
6194
+ }
6070
6195
  }
6071
6196
  // Fullscreen: showModal() provides native focus trapping
6197
+ }
6198
+ }
6199
+
6200
+ /**
6201
+ * Returns the chain of active (focused) elements through shadow roots.
6202
+ * @private
6203
+ * @returns {Array<HTMLElement>}
6204
+ */
6205
+ _getActiveElements() {
6206
+ let { activeElement } = document;
6207
+ const actives = [activeElement];
6208
+
6209
+ while (activeElement?.shadowRoot?.activeElement) {
6210
+ activeElement = activeElement.shadowRoot.activeElement;
6211
+ actives.push(activeElement);
6212
+ }
6213
+
6214
+ return actives;
6215
+ }
6216
+
6217
+ /**
6218
+ * Sets `inert` on sibling elements of the dropdown's top-level host
6219
+ * so that content outside the dropdown is not interactive while the modal is open.
6220
+ * Walks up through shadow DOM boundaries to find the outermost host element
6221
+ * in the light DOM, then sets `inert` on that element's siblings.
6222
+ * @private
6223
+ */
6224
+ _setPageInert() {
6225
+ if (this._inertSiblings) {
6072
6226
  return;
6073
6227
  }
6074
6228
 
6075
- if (this.focusTrap) {
6076
- this.focusTrap.disconnect();
6077
- this.focusTrap = undefined;
6229
+ this._inertSiblings = [];
6230
+
6231
+ // Walk up through shadow DOM boundaries to find the topmost host
6232
+ // element in the light DOM. For example, if this dropdown is inside
6233
+ // auro-datepicker's shadow DOM, we walk up to the datepicker element
6234
+ // so we set inert on its siblings — not on the datepicker itself.
6235
+ let host = this;
6236
+ while (host.getRootNode() instanceof ShadowRoot) {
6237
+ host = host.getRootNode().host;
6238
+ }
6239
+
6240
+ const parent = host.parentElement;
6241
+
6242
+ if (parent) {
6243
+ for (const sibling of parent.children) {
6244
+ if (sibling !== host && !sibling.inert) {
6245
+ sibling.inert = true;
6246
+ this._inertSiblings.push(sibling);
6247
+ }
6248
+ }
6249
+ }
6250
+ }
6251
+
6252
+ /**
6253
+ * Restores `inert` state on siblings that were made inert by `_setPageInert`.
6254
+ * @private
6255
+ */
6256
+ _clearPageInert() {
6257
+ if (this._inertSiblings) {
6258
+ for (const sibling of this._inertSiblings) {
6259
+ sibling.inert = false;
6260
+ }
6261
+ this._inertSiblings = undefined;
6078
6262
  }
6079
6263
  }
6080
6264
 
@@ -6313,6 +6497,7 @@ class AuroDropdown extends AuroElement {
6313
6497
  shape="${this.shape}"
6314
6498
  ?data-show="${this.isPopoverVisible}"
6315
6499
  ?isfullscreen="${this.isBibFullscreen}"
6500
+ ?desktopmodal="${this.desktopModal}"
6316
6501
  .dialogLabel="${this.bibDialogLabel}"
6317
6502
  ${ref(this.bibElement)}
6318
6503
  >
@@ -6680,6 +6865,14 @@ class AuroBibtemplate extends LitElement {
6680
6865
  large: {
6681
6866
  type: Boolean,
6682
6867
  reflect: true
6868
+ },
6869
+
6870
+ /**
6871
+ * If declared, the footer slot will be rendered even when not in fullscreen mode.
6872
+ */
6873
+ showFooter: {
6874
+ type: Boolean,
6875
+ reflect: true
6683
6876
  }
6684
6877
  };
6685
6878
  }
@@ -6782,7 +6975,7 @@ class AuroBibtemplate extends LitElement {
6782
6975
  <slot></slot>
6783
6976
  </div>
6784
6977
 
6785
- ${this.isFullscreen ? html`
6978
+ ${this.isFullscreen || this.showFooter ? html`
6786
6979
  <div id="footerContainer">
6787
6980
  <slot name="footer"></slot>
6788
6981
  </div>` : null}
@@ -7019,7 +7212,7 @@ class AuroHelpText extends LitElement {
7019
7212
  }
7020
7213
  }
7021
7214
 
7022
- var formkitVersion = '202605122144';
7215
+ var formkitVersion = '202605182147';
7023
7216
 
7024
7217
  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);font-weight:var(--wcss-body-default-weight, );line-height:var(--wcss-body-default-line-height, 1.5rem)}.body-default,.body-default-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-default-emphasized{font-size:var(--wcss-body-default-emphasized-font-size, 1rem);font-weight:var(--wcss-body-default-emphasized-weight, );line-height:var(--wcss-body-default-emphasized-line-height, 1.5rem)}.body-lg{font-size:var(--wcss-body-lg-font-size, 1.125rem);font-weight:var(--wcss-body-lg-weight, );line-height:var(--wcss-body-lg-line-height, 1.625rem)}.body-lg,.body-lg-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-lg-emphasized{font-size:var(--wcss-body-lg-emphasized-font-size, 1.125rem);font-weight:var(--wcss-body-lg-emphasized-weight, );line-height:var(--wcss-body-lg-emphasized-line-height, 1.625rem)}.body-sm{font-size:var(--wcss-body-sm-font-size, 0.875rem);font-weight:var(--wcss-body-sm-weight, );line-height:var(--wcss-body-sm-line-height, 1.25rem)}.body-sm,.body-sm-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-sm-emphasized{font-size:var(--wcss-body-sm-emphasized-font-size, 0.875rem);font-weight:var(--wcss-body-sm-emphasized-weight, );line-height:var(--wcss-body-sm-emphasized-line-height, 1.25rem)}.body-xs{font-size:var(--wcss-body-xs-font-size, 0.75rem);font-weight:var(--wcss-body-xs-weight, );line-height:var(--wcss-body-xs-line-height, 1rem)}.body-xs,.body-xs-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-xs-emphasized{font-size:var(--wcss-body-xs-emphasized-font-size, 0.75rem);font-weight:var(--wcss-body-xs-emphasized-weight, );line-height:var(--wcss-body-xs-emphasized-line-height, 1rem)}.body-2xs{font-size:var(--wcss-body-2xs-font-size, 0.625rem);font-weight:var(--wcss-body-2xs-weight, );line-height:var(--wcss-body-2xs-line-height, 0.875rem)}.body-2xs,.body-2xs-emphasized{font-family:var(--wcss-body-family, "AS Circular"),system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;letter-spacing:var(--wcss-body-letter-spacing, 0)}.body-2xs-emphasized{font-size:var(--wcss-body-2xs-emphasized-font-size, 0.625rem);font-weight:var(--wcss-body-2xs-emphasized-weight, );line-height:var(--wcss-body-2xs-emphasized-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, 300);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, 300);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}`;
7025
7218