@aurodesignsystem-dev/auro-formkit 0.0.0-pr624.24 → 0.0.0-pr624.26

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.md +39 -5
  2. package/components/checkbox/demo/api.min.js +5 -5
  3. package/components/checkbox/demo/index.min.js +5 -5
  4. package/components/checkbox/dist/auro-checkbox-group.d.ts +1 -1
  5. package/components/checkbox/dist/index.js +5 -5
  6. package/components/checkbox/dist/registered.js +5 -5
  7. package/components/combobox/demo/api.md +46 -1
  8. package/components/combobox/demo/api.min.js +10 -3
  9. package/components/combobox/demo/index.min.js +10 -3
  10. package/components/combobox/dist/auro-combobox.d.ts +1 -0
  11. package/components/combobox/dist/index.js +9 -2
  12. package/components/combobox/dist/registered.js +9 -2
  13. package/components/datepicker/demo/api.min.js +4 -2
  14. package/components/datepicker/demo/index.min.js +4 -2
  15. package/components/datepicker/dist/index.js +4 -2
  16. package/components/datepicker/dist/registered.js +4 -2
  17. package/components/input/demo/api.md +34 -5
  18. package/components/input/demo/api.min.js +4 -2
  19. package/components/input/demo/index.min.js +4 -2
  20. package/components/input/dist/base-input.d.ts +1 -0
  21. package/components/input/dist/index.js +4 -2
  22. package/components/input/dist/registered.js +4 -2
  23. package/components/menu/demo/api.min.js +1 -1
  24. package/components/menu/demo/index.min.js +1 -1
  25. package/components/menu/dist/index.js +1 -1
  26. package/components/menu/dist/registered.js +1 -1
  27. package/components/radio/demo/api.md +5 -5
  28. package/components/radio/demo/api.min.js +5 -5
  29. package/components/radio/demo/index.min.js +5 -5
  30. package/components/radio/dist/auro-radio-group.d.ts +1 -1
  31. package/components/radio/dist/index.js +5 -5
  32. package/components/radio/dist/registered.js +5 -5
  33. package/components/select/demo/api.md +45 -0
  34. package/components/select/demo/api.min.js +7 -2
  35. package/components/select/demo/index.min.js +7 -2
  36. package/components/select/dist/auro-select.d.ts +1 -0
  37. package/components/select/dist/index.js +6 -1
  38. package/components/select/dist/registered.js +6 -1
  39. package/package.json +1 -1
@@ -7282,7 +7282,7 @@ function arrayConverter(value) {
7282
7282
  throw new Error('Invalid value: Input must be an array or undefined');
7283
7283
  }
7284
7284
 
7285
- css`:host{cursor:pointer;user-select:none}:host .wrapper{display:flex;align-items:center;padding-right:var(--ds-size-200, 1rem);padding-left:calc(var(--ds-size-150, 0.75rem) + 24px + var(--ds-size-100, 0.5rem));padding-top:var(--ds-size-50, 0.25rem);padding-bottom:var(--ds-size-50, 0.25rem);-webkit-tap-highlight-color:transparent}:host .wrapper[class*=shape-box],:host .wrapper[class*=shape-snowflake]{border-radius:unset}:host .wrapper[class*=shape-pill]{border-radius:30px}:host .wrapper[class*=-lg]{font-size:var(--ds-text-body-size-lg, 1.125rem);line-height:var(--ds-text-body-height-lg, 1.625rem);padding-top:var(--ds-size-75, 0.375rem);padding-bottom:var(--ds-size-75, 0.375rem);padding-right:var(--ds-size-150, 0.75rem);margin-bottom:var(--ds-size-50, 0.25rem)}:host .wrapper[class*=-xl]{font-size:var(--ds-text-body-size-lg, 1.125rem);line-height:var(--ds-text-body-height-lg, 1.625rem);padding-top:var(--ds-size-100, 0.5rem);padding-bottom:var(--ds-size-100, 0.5rem);padding-right:var(--ds-size-200, 1rem);margin-bottom:var(--ds-size-100, 0.5rem)}:host slot{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host [auro-icon]{--ds-auro-icon-size: var(--ds-size-300, 1.5rem);margin-right:var(--ds-size-150, 0.75rem);margin-left:var(--ds-size-100, 0.5rem)}:host ::slotted(.nestingSpacer){display:inline-block;width:var(--ds-size-300, 1.5rem)}:host ::slotted(strong){font-weight:700}:host([loadingplaceholder]) .wrapper{padding-left:calc(var(--ds-size-150, 0.75rem) + 24px + var(--ds-size-100, 0.5rem))}:host([selected]) .wrapper{padding-left:0}:host([nocheckmark]) .wrapper{padding-left:var(--ds-size-150, 0.75rem)}:host([nocheckmark]) .wrapper[class*=-lg]{padding-left:var(--ds-size-150, 0.75rem)}:host([nocheckmark]) .wrapper[class*=-xl]{padding-left:var(--ds-size-200, 1rem)}:host([hidden]){display:none}:host([static]){pointer-events:none}:host([disabled]:hover){cursor:auto}:host([disabled]){user-select:none;pointer-events:none}`;
7285
+ css`:host{cursor:pointer;user-select:none}:host .wrapper{display:flex;align-items:center;padding-right:var(--ds-size-200, 1rem);padding-left:calc(var(--ds-size-150, 0.75rem) + 24px + var(--ds-size-100, 0.5rem));padding-top:var(--ds-size-50, 0.25rem);padding-bottom:var(--ds-size-50, 0.25rem);-webkit-tap-highlight-color:transparent}:host .wrapper[class*=shape-box],:host .wrapper[class*=shape-snowflake]{border-radius:unset}:host .wrapper[class*=shape-pill]{border-radius:30px}:host .wrapper[class*=-lg]{font-size:var(--ds-text-body-size-lg, 1.125rem);line-height:var(--ds-text-body-height-lg, 1.625rem);padding-top:var(--ds-size-75, 0.375rem);padding-bottom:var(--ds-size-75, 0.375rem);padding-right:var(--ds-size-150, 0.75rem)}:host .wrapper[class*=-lg]:not(:last-child){margin-bottom:var(--ds-size-50, 0.25rem)}:host .wrapper[class*=-xl]{font-size:var(--ds-text-body-size-lg, 1.125rem);line-height:var(--ds-text-body-height-lg, 1.625rem);padding-top:var(--ds-size-100, 0.5rem);padding-bottom:var(--ds-size-100, 0.5rem);padding-right:var(--ds-size-200, 1rem)}:host .wrapper[class*=-xl]:not(:last-child){margin-bottom:var(--ds-size-100, 0.5rem)}:host slot{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host [auro-icon]{--ds-auro-icon-size: var(--ds-size-300, 1.5rem);margin-right:var(--ds-size-150, 0.75rem);margin-left:var(--ds-size-100, 0.5rem)}:host ::slotted(.nestingSpacer){display:inline-block;width:var(--ds-size-300, 1.5rem)}:host ::slotted(strong){font-weight:700}:host([loadingplaceholder]) .wrapper{padding-left:calc(var(--ds-size-150, 0.75rem) + 24px + var(--ds-size-100, 0.5rem))}:host([selected]) .wrapper{padding-left:0}:host([nocheckmark]) .wrapper{padding-left:var(--ds-size-150, 0.75rem)}:host([nocheckmark]) .wrapper[class*=-lg]{padding-left:var(--ds-size-150, 0.75rem)}:host([nocheckmark]) .wrapper[class*=-xl]{padding-left:var(--ds-size-200, 1rem)}:host([hidden]){display:none}:host([static]){pointer-events:none}:host([disabled]:hover){cursor:auto}:host([disabled]){user-select:none;pointer-events:none}`;
7286
7286
 
7287
7287
  css`:host .wrapper{border:1px solid var(--ds-auro-menuoption-container-border-color);background-color:var(--ds-auro-menuoption-container-color);color:var(--ds-auro-menuoption-text-color)}:host svg{fill:var(--ds-auro-menuoption-icon-color)}:host([disabled]){--ds-auro-menuoption-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:hover),:host(.active){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-neutral-subtle, #f7f7f7)}:host([selected]){--ds-auro-menuoption-container-color: var(--ds-advanced-color-state-selected, #01426a);--ds-auro-menuoption-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-menuoption-icon-color: var(--ds-basic-color-texticon-inverse, #ffffff)}:host([selected]):host(:hover),:host([selected]):host(.active){--ds-auro-menuoption-container-color: var(--ds-advanced-color-state-selected-hover, #00274a)}`;
7288
7288
 
@@ -7305,6 +7305,7 @@ var styleCss = css`.util_displayInline{display:inline}.util_displayInlineBlock{d
7305
7305
  * @slot - Default slot for the menu content.
7306
7306
  * @slot bib.fullscreen.headline - Defines the headline to display above menu-options
7307
7307
  * @slot label - Defines the content of the label.
7308
+ * @slot {HTMLSlotElement} optionalLabel - Allows overriding the optional display text "(optional)", which appears next to the label.
7308
7309
  * @slot helpText - Defines the content of the helpText.
7309
7310
  * @slot placeholder - Defines the content of the placeholder to be shown when there is no value
7310
7311
  * @slot valueText - Dropdown value text display.
@@ -8349,6 +8350,7 @@ class AuroSelect extends AuroElement$3 {
8349
8350
  <div class="${classMap(valueContainerClasses)}">
8350
8351
  <label class="${classMap(this.commonLabelClasses)}">
8351
8352
  <slot name="label"></slot>
8353
+ ${this.required ? undefined : html`<slot name="optionalLabel"> (optional)</slot>`}
8352
8354
  </label>
8353
8355
  <div class="value" id="value"></div>
8354
8356
  ${this.value ? undefined : html`
@@ -8429,6 +8431,7 @@ class AuroSelect extends AuroElement$3 {
8429
8431
  <div class="${classMap(valueContainerClasses)}">
8430
8432
  <label class="${classMap(this.commonLabelClasses)}">
8431
8433
  <slot name="label"></slot>
8434
+ ${this.required ? undefined : html`<slot name="optionalLabel"> (optional)</slot>`}
8432
8435
  </label>
8433
8436
  <div class="value" id="value"></div>
8434
8437
  ${this.value ? undefined : html`
@@ -8510,6 +8513,7 @@ class AuroSelect extends AuroElement$3 {
8510
8513
  <div class="${classMap(valueContainerClasses)}">
8511
8514
  <label class="${classMap(this.commonLabelClasses)}">
8512
8515
  <slot name="label"></slot>
8516
+ ${this.required ? undefined : html`<slot name="optionalLabel"> (optional)</slot>`}
8513
8517
  </label>
8514
8518
  <div class="value" id="value"></div>
8515
8519
  ${this.value ? undefined : html`
@@ -8624,6 +8628,7 @@ class AuroSelect extends AuroElement$3 {
8624
8628
  <slot></slot>
8625
8629
  </${this.bibtemplateTag}>
8626
8630
  <slot name="label" slot="label"></slot>
8631
+ ${this.required ? undefined : html`<slot name="optionalLabel"> (optional)</slot>`}
8627
8632
  <p slot="helpText">
8628
8633
  ${!this.validity || this.validity === undefined || this.validity === 'valid'
8629
8634
  ? html`
@@ -7282,7 +7282,7 @@ function arrayConverter(value) {
7282
7282
  throw new Error('Invalid value: Input must be an array or undefined');
7283
7283
  }
7284
7284
 
7285
- css`:host{cursor:pointer;user-select:none}:host .wrapper{display:flex;align-items:center;padding-right:var(--ds-size-200, 1rem);padding-left:calc(var(--ds-size-150, 0.75rem) + 24px + var(--ds-size-100, 0.5rem));padding-top:var(--ds-size-50, 0.25rem);padding-bottom:var(--ds-size-50, 0.25rem);-webkit-tap-highlight-color:transparent}:host .wrapper[class*=shape-box],:host .wrapper[class*=shape-snowflake]{border-radius:unset}:host .wrapper[class*=shape-pill]{border-radius:30px}:host .wrapper[class*=-lg]{font-size:var(--ds-text-body-size-lg, 1.125rem);line-height:var(--ds-text-body-height-lg, 1.625rem);padding-top:var(--ds-size-75, 0.375rem);padding-bottom:var(--ds-size-75, 0.375rem);padding-right:var(--ds-size-150, 0.75rem);margin-bottom:var(--ds-size-50, 0.25rem)}:host .wrapper[class*=-xl]{font-size:var(--ds-text-body-size-lg, 1.125rem);line-height:var(--ds-text-body-height-lg, 1.625rem);padding-top:var(--ds-size-100, 0.5rem);padding-bottom:var(--ds-size-100, 0.5rem);padding-right:var(--ds-size-200, 1rem);margin-bottom:var(--ds-size-100, 0.5rem)}:host slot{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host [auro-icon]{--ds-auro-icon-size: var(--ds-size-300, 1.5rem);margin-right:var(--ds-size-150, 0.75rem);margin-left:var(--ds-size-100, 0.5rem)}:host ::slotted(.nestingSpacer){display:inline-block;width:var(--ds-size-300, 1.5rem)}:host ::slotted(strong){font-weight:700}:host([loadingplaceholder]) .wrapper{padding-left:calc(var(--ds-size-150, 0.75rem) + 24px + var(--ds-size-100, 0.5rem))}:host([selected]) .wrapper{padding-left:0}:host([nocheckmark]) .wrapper{padding-left:var(--ds-size-150, 0.75rem)}:host([nocheckmark]) .wrapper[class*=-lg]{padding-left:var(--ds-size-150, 0.75rem)}:host([nocheckmark]) .wrapper[class*=-xl]{padding-left:var(--ds-size-200, 1rem)}:host([hidden]){display:none}:host([static]){pointer-events:none}:host([disabled]:hover){cursor:auto}:host([disabled]){user-select:none;pointer-events:none}`;
7285
+ css`:host{cursor:pointer;user-select:none}:host .wrapper{display:flex;align-items:center;padding-right:var(--ds-size-200, 1rem);padding-left:calc(var(--ds-size-150, 0.75rem) + 24px + var(--ds-size-100, 0.5rem));padding-top:var(--ds-size-50, 0.25rem);padding-bottom:var(--ds-size-50, 0.25rem);-webkit-tap-highlight-color:transparent}:host .wrapper[class*=shape-box],:host .wrapper[class*=shape-snowflake]{border-radius:unset}:host .wrapper[class*=shape-pill]{border-radius:30px}:host .wrapper[class*=-lg]{font-size:var(--ds-text-body-size-lg, 1.125rem);line-height:var(--ds-text-body-height-lg, 1.625rem);padding-top:var(--ds-size-75, 0.375rem);padding-bottom:var(--ds-size-75, 0.375rem);padding-right:var(--ds-size-150, 0.75rem)}:host .wrapper[class*=-lg]:not(:last-child){margin-bottom:var(--ds-size-50, 0.25rem)}:host .wrapper[class*=-xl]{font-size:var(--ds-text-body-size-lg, 1.125rem);line-height:var(--ds-text-body-height-lg, 1.625rem);padding-top:var(--ds-size-100, 0.5rem);padding-bottom:var(--ds-size-100, 0.5rem);padding-right:var(--ds-size-200, 1rem)}:host .wrapper[class*=-xl]:not(:last-child){margin-bottom:var(--ds-size-100, 0.5rem)}:host slot{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host [auro-icon]{--ds-auro-icon-size: var(--ds-size-300, 1.5rem);margin-right:var(--ds-size-150, 0.75rem);margin-left:var(--ds-size-100, 0.5rem)}:host ::slotted(.nestingSpacer){display:inline-block;width:var(--ds-size-300, 1.5rem)}:host ::slotted(strong){font-weight:700}:host([loadingplaceholder]) .wrapper{padding-left:calc(var(--ds-size-150, 0.75rem) + 24px + var(--ds-size-100, 0.5rem))}:host([selected]) .wrapper{padding-left:0}:host([nocheckmark]) .wrapper{padding-left:var(--ds-size-150, 0.75rem)}:host([nocheckmark]) .wrapper[class*=-lg]{padding-left:var(--ds-size-150, 0.75rem)}:host([nocheckmark]) .wrapper[class*=-xl]{padding-left:var(--ds-size-200, 1rem)}:host([hidden]){display:none}:host([static]){pointer-events:none}:host([disabled]:hover){cursor:auto}:host([disabled]){user-select:none;pointer-events:none}`;
7286
7286
 
7287
7287
  css`:host .wrapper{border:1px solid var(--ds-auro-menuoption-container-border-color);background-color:var(--ds-auro-menuoption-container-color);color:var(--ds-auro-menuoption-text-color)}:host svg{fill:var(--ds-auro-menuoption-icon-color)}:host([disabled]){--ds-auro-menuoption-text-color: var(--ds-basic-color-texticon-disabled, #d0d0d0)}:host(:hover),:host(.active){--ds-auro-menuoption-container-color: var(--ds-basic-color-surface-neutral-subtle, #f7f7f7)}:host([selected]){--ds-auro-menuoption-container-color: var(--ds-advanced-color-state-selected, #01426a);--ds-auro-menuoption-text-color: var(--ds-basic-color-texticon-inverse, #ffffff);--ds-auro-menuoption-icon-color: var(--ds-basic-color-texticon-inverse, #ffffff)}:host([selected]):host(:hover),:host([selected]):host(.active){--ds-auro-menuoption-container-color: var(--ds-advanced-color-state-selected-hover, #00274a)}`;
7288
7288
 
@@ -7305,6 +7305,7 @@ var styleCss = css`.util_displayInline{display:inline}.util_displayInlineBlock{d
7305
7305
  * @slot - Default slot for the menu content.
7306
7306
  * @slot bib.fullscreen.headline - Defines the headline to display above menu-options
7307
7307
  * @slot label - Defines the content of the label.
7308
+ * @slot {HTMLSlotElement} optionalLabel - Allows overriding the optional display text "(optional)", which appears next to the label.
7308
7309
  * @slot helpText - Defines the content of the helpText.
7309
7310
  * @slot placeholder - Defines the content of the placeholder to be shown when there is no value
7310
7311
  * @slot valueText - Dropdown value text display.
@@ -8349,6 +8350,7 @@ class AuroSelect extends AuroElement$3 {
8349
8350
  <div class="${classMap(valueContainerClasses)}">
8350
8351
  <label class="${classMap(this.commonLabelClasses)}">
8351
8352
  <slot name="label"></slot>
8353
+ ${this.required ? undefined : html`<slot name="optionalLabel"> (optional)</slot>`}
8352
8354
  </label>
8353
8355
  <div class="value" id="value"></div>
8354
8356
  ${this.value ? undefined : html`
@@ -8429,6 +8431,7 @@ class AuroSelect extends AuroElement$3 {
8429
8431
  <div class="${classMap(valueContainerClasses)}">
8430
8432
  <label class="${classMap(this.commonLabelClasses)}">
8431
8433
  <slot name="label"></slot>
8434
+ ${this.required ? undefined : html`<slot name="optionalLabel"> (optional)</slot>`}
8432
8435
  </label>
8433
8436
  <div class="value" id="value"></div>
8434
8437
  ${this.value ? undefined : html`
@@ -8510,6 +8513,7 @@ class AuroSelect extends AuroElement$3 {
8510
8513
  <div class="${classMap(valueContainerClasses)}">
8511
8514
  <label class="${classMap(this.commonLabelClasses)}">
8512
8515
  <slot name="label"></slot>
8516
+ ${this.required ? undefined : html`<slot name="optionalLabel"> (optional)</slot>`}
8513
8517
  </label>
8514
8518
  <div class="value" id="value"></div>
8515
8519
  ${this.value ? undefined : html`
@@ -8624,6 +8628,7 @@ class AuroSelect extends AuroElement$3 {
8624
8628
  <slot></slot>
8625
8629
  </${this.bibtemplateTag}>
8626
8630
  <slot name="label" slot="label"></slot>
8631
+ ${this.required ? undefined : html`<slot name="optionalLabel"> (optional)</slot>`}
8627
8632
  <p slot="helpText">
8628
8633
  ${!this.validity || this.validity === undefined || this.validity === 'valid'
8629
8634
  ? html`
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@aurodesignsystem-dev/auro-formkit",
3
- "version": "0.0.0-pr624.24",
3
+ "version": "0.0.0-pr624.26",
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": {