@aurodesignsystem-dev/auro-formkit 0.0.0-pr624.7 → 0.0.0-pr624.70

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 (138) hide show
  1. package/components/bibtemplate/dist/auro-bibtemplate.d.ts +12 -2
  2. package/components/bibtemplate/dist/buttonVersion.d.ts +2 -0
  3. package/components/bibtemplate/dist/iconVersion.d.ts +1 -1
  4. package/components/bibtemplate/dist/index.js +1262 -81
  5. package/components/bibtemplate/dist/registered.js +1262 -81
  6. package/components/checkbox/README.md +1 -1
  7. package/components/checkbox/demo/api.html +16 -10
  8. package/components/checkbox/demo/api.md +47 -14
  9. package/components/checkbox/demo/api.min.js +65 -42
  10. package/components/checkbox/demo/index.html +16 -10
  11. package/components/checkbox/demo/index.md +2 -2
  12. package/components/checkbox/demo/index.min.js +65 -42
  13. package/components/checkbox/demo/readme.html +16 -9
  14. package/components/checkbox/demo/readme.md +1 -1
  15. package/components/checkbox/dist/auro-checkbox-group.d.ts +1 -1
  16. package/components/checkbox/dist/auro-checkbox.d.ts +3 -3
  17. package/components/checkbox/dist/index.js +65 -42
  18. package/components/checkbox/dist/registered.js +65 -42
  19. package/components/combobox/demo/api.html +16 -10
  20. package/components/combobox/demo/api.md +113 -8
  21. package/components/combobox/demo/api.min.js +3096 -870
  22. package/components/combobox/demo/index.html +16 -10
  23. package/components/combobox/demo/index.md +6 -30
  24. package/components/combobox/demo/index.min.js +3096 -870
  25. package/components/combobox/demo/readme.html +16 -9
  26. package/components/combobox/dist/auro-combobox.d.ts +42 -8
  27. package/components/combobox/dist/index.js +2878 -748
  28. package/components/combobox/dist/registered.js +2878 -748
  29. package/components/counter/demo/api.html +17 -10
  30. package/components/counter/demo/api.md +156 -21
  31. package/components/counter/demo/api.min.js +3363 -652
  32. package/components/counter/demo/index.html +17 -10
  33. package/components/counter/demo/index.md +185 -34
  34. package/components/counter/demo/index.min.js +3363 -652
  35. package/components/counter/demo/readme.html +16 -9
  36. package/components/counter/dist/auro-counter-button.d.ts +2 -0
  37. package/components/counter/dist/auro-counter-group.d.ts +151 -11
  38. package/components/counter/dist/auro-counter.d.ts +16 -0
  39. package/components/counter/dist/helptextVersion.d.ts +2 -0
  40. package/components/counter/dist/iconVersion.d.ts +1 -1
  41. package/components/counter/dist/index.js +3364 -653
  42. package/components/counter/dist/registered.js +3364 -653
  43. package/components/datepicker/demo/api.html +16 -10
  44. package/components/datepicker/demo/api.md +25 -16
  45. package/components/datepicker/demo/api.min.js +11857 -8105
  46. package/components/datepicker/demo/index.html +16 -10
  47. package/components/datepicker/demo/index.md +71 -4
  48. package/components/datepicker/demo/index.min.js +11857 -8105
  49. package/components/datepicker/demo/readme.html +16 -9
  50. package/components/datepicker/dist/auro-datepicker.d.ts +89 -11
  51. package/components/datepicker/dist/buttonVersion.d.ts +1 -1
  52. package/components/datepicker/dist/iconVersion.d.ts +2 -0
  53. package/components/datepicker/dist/index.js +8691 -4939
  54. package/components/datepicker/dist/popoverVersion.d.ts +1 -1
  55. package/components/datepicker/dist/registered.js +8691 -4939
  56. package/components/dropdown/demo/api.html +16 -10
  57. package/components/dropdown/demo/api.md +81 -274
  58. package/components/dropdown/demo/api.min.js +429 -195
  59. package/components/dropdown/demo/index.html +16 -10
  60. package/components/dropdown/demo/index.md +92 -362
  61. package/components/dropdown/demo/index.min.js +429 -195
  62. package/components/dropdown/demo/readme.html +16 -9
  63. package/components/dropdown/dist/auro-dropdown.d.ts +41 -76
  64. package/components/dropdown/dist/auro-dropdownBib.d.ts +14 -0
  65. package/components/dropdown/dist/index.js +429 -195
  66. package/components/dropdown/dist/registered.js +429 -195
  67. package/components/form/demo/api.html +16 -9
  68. package/components/form/demo/api.min.js +1 -1
  69. package/components/form/demo/autocomplete.html +19 -3
  70. package/components/form/demo/index.html +16 -9
  71. package/components/form/demo/index.min.js +1 -1
  72. package/components/form/demo/readme.html +16 -9
  73. package/components/form/demo/working.html +19 -13
  74. package/components/form/dist/index.js +1 -1
  75. package/components/form/dist/registered.js +1 -1
  76. package/components/helptext/dist/index.js +2 -2
  77. package/components/helptext/dist/registered.js +2 -2
  78. package/components/input/README.md +5 -2
  79. package/components/input/demo/api.html +16 -10
  80. package/components/input/demo/api.md +228 -130
  81. package/components/input/demo/api.min.js +908 -246
  82. package/components/input/demo/index.html +16 -10
  83. package/components/input/demo/index.md +48 -32
  84. package/components/input/demo/index.min.js +908 -246
  85. package/components/input/demo/readme.html +16 -9
  86. package/components/input/demo/readme.md +5 -2
  87. package/components/input/dist/auro-input.d.ts +3 -3
  88. package/components/input/dist/base-input.d.ts +38 -10
  89. package/components/input/dist/buttonVersion.d.ts +1 -1
  90. package/components/input/dist/iconVersion.d.ts +1 -1
  91. package/components/input/dist/index.js +908 -246
  92. package/components/input/dist/registered.js +908 -246
  93. package/components/layoutElement/dist/index.js +13 -10
  94. package/components/menu/demo/api.html +32 -10
  95. package/components/menu/demo/api.md +69 -8
  96. package/components/menu/demo/api.min.js +238 -47
  97. package/components/menu/demo/index.html +16 -10
  98. package/components/menu/demo/index.min.js +238 -47
  99. package/components/menu/demo/readme.html +16 -9
  100. package/components/menu/dist/auro-menu.d.ts +41 -7
  101. package/components/menu/dist/auro-menuoption.d.ts +15 -3
  102. package/components/menu/dist/iconVersion.d.ts +1 -1
  103. package/components/menu/dist/index.js +238 -47
  104. package/components/menu/dist/registered.js +238 -47
  105. package/components/menu/dist/styles/default/style-menuoption-css.d.ts +2 -0
  106. package/components/menu/dist/styles/default/tokens-css.d.ts +2 -0
  107. package/components/radio/demo/api.html +16 -10
  108. package/components/radio/demo/api.md +7 -8
  109. package/components/radio/demo/api.min.js +88 -90
  110. package/components/radio/demo/index.html +16 -10
  111. package/components/radio/demo/index.min.js +88 -90
  112. package/components/radio/demo/readme.html +16 -9
  113. package/components/radio/dist/auro-radio-group.d.ts +1 -1
  114. package/components/radio/dist/auro-radio.d.ts +9 -12
  115. package/components/radio/dist/index.js +88 -90
  116. package/components/radio/dist/registered.js +88 -90
  117. package/components/select/demo/api.html +16 -10
  118. package/components/select/demo/api.js +0 -2
  119. package/components/select/demo/api.md +104 -57
  120. package/components/select/demo/api.min.js +2148 -635
  121. package/components/select/demo/index.html +17 -11
  122. package/components/select/demo/index.md +45 -158
  123. package/components/select/demo/index.min.js +2148 -623
  124. package/components/select/demo/readme.html +16 -9
  125. package/components/select/dist/auro-select.d.ts +49 -16
  126. package/components/select/dist/index.js +2078 -649
  127. package/components/select/dist/registered.js +2078 -649
  128. package/package.json +30 -27
  129. /package/components/{datepicker/dist/styles/emphasized/style-css.d.ts → counter/dist/styles/shapeSize-css.d.ts} +0 -0
  130. /package/components/{dropdown/dist/styles/default → datepicker/dist/styles/snowflake}/color-css.d.ts +0 -0
  131. /package/components/{dropdown/dist/styles/default → datepicker/dist/styles/snowflake}/style-css.d.ts +0 -0
  132. /package/components/dropdown/dist/styles/{default → classic}/bibColors-css.d.ts +0 -0
  133. /package/components/dropdown/dist/styles/{default → classic}/bibStyles-css.d.ts +0 -0
  134. /package/components/{menu/dist/styles/color-menu-css.d.ts → dropdown/dist/styles/classic/color-css.d.ts} +0 -0
  135. /package/components/{menu/dist/styles/color-menuoption-css.d.ts → dropdown/dist/styles/classic/style-css.d.ts} +0 -0
  136. /package/components/menu/dist/styles/{style-menu-css.d.ts → default/color-menu-css.d.ts} +0 -0
  137. /package/components/menu/dist/styles/{style-menuoption-css.d.ts → default/color-menuoption-css.d.ts} +0 -0
  138. /package/components/menu/dist/styles/{tokens-css.d.ts → default/style-menu-css.d.ts} +0 -0
package/components/select/demo/readme.html CHANGED
@@ -16,17 +16,24 @@
16
16
  <head>
17
17
  <meta charset="UTF-8" />
18
18
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
19
- <title>Auro Web Component Generator | auro-select custom element</title>
20
- <link
21
- rel="stylesheet"
22
- type="text/css"
23
- href="https://cdn.jsdelivr.net/npm/prismjs@1.24.1/themes/prism.css"
24
- />
25
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/auro-classic/CSSCustomProperties.css">
26
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/alaska/CSSCustomProperties--alaska.css">
19
+ <title>Auro Web Component Demo | auro-select</title>
20
+
21
+ <!-- Prism.js Stylesheet -->
22
+ <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/prismjs@1.24.1/themes/prism.css"/>
23
+
24
+ <!-- Legacy reference is still needed to support auro-select's use of legacy token values at this time -->
25
+ <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/legacy/auro-classic/CSSCustomProperties.css"/>
26
+
27
+ <!-- Design Token Alaska Theme -->
28
+ <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/themes/alaska/CSSCustomProperties--alaska.min.css"/>
29
+
30
+ <!-- Webcore Stylesheet Alaska Theme -->
31
+ <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/bundled/themes/alaska.global.min.css" />
32
+
33
+ <!-- Demo Specific Styles -->
27
34
  <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/demoWrapper.css" />
28
35
  <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/elementDemoStyles.css" />
29
- </head>
36
+ </head>
30
37
  <body class="auro-markdown">
31
38
  <main></main>
32
39
 
package/components/select/dist/auro-select.d.ts CHANGED
@@ -4,9 +4,10 @@
4
4
  * @slot - Default slot for the menu content.
5
5
  * @slot bib.fullscreen.headline - Defines the headline to display above menu-options
6
6
  * @slot label - Defines the content of the label.
7
+ * @slot {HTMLSlotElement} optionalLabel - Allows overriding the optional display text "(optional)", which appears next to the label.
7
8
  * @slot helpText - Defines the content of the helpText.
8
- * @slot placeholder - Defines the content of the placeholder to be shown when there is no value
9
9
  * @slot valueText - Dropdown value text display.
10
+ * @slot displayValue - Allows custom HTML content to display the selected value when select is not focused.
10
11
  * @event auroSelect-valueSet - Notifies that the component has a new value set.
11
12
  * @event input - Notifies every time the value prop of the element is changed. The updated `value` and `optionSelected` will be delivered in `detail` object.
12
13
  * @event auroFormElement-validated - Notifies that the `validity` and `errorMessage` values have changed.
@@ -64,13 +65,6 @@ export class AuroSelect extends AuroElement {
64
65
  type: StringConstructor;
65
66
  reflect: boolean;
66
67
  };
67
- /**
68
- * If set, makes dropdown width match the size of the content, rather than the width of the trigger.
69
- */
70
- flexMenuWidth: {
71
- type: BooleanConstructor;
72
- reflect: boolean;
73
- };
74
68
  /**
75
69
  * Defines the screen size breakpoint (`xs`, `sm`, `md`, `lg`, `xl`, `disabled`)
76
70
  * at which the dropdown switches to fullscreen mode on mobile. `disabled` indicates a dropdown should _never_ enter fullscreen.
@@ -152,13 +146,20 @@ export class AuroSelect extends AuroElement {
152
146
  * "top" | "right" | "bottom" | "left" |
153
147
  * "bottom-start" | "top-start" | "top-end" |
154
148
  * "right-start" | "right-end" | "bottom-end" |
155
- * "left-start" | "left-end"
149
+ * "left-start" | "left-end".
156
150
  * @default bottom-start
157
151
  */
158
152
  placement: {
159
153
  type: StringConstructor;
160
154
  reflect: boolean;
161
155
  };
156
+ /**
157
+ * Define custom placeholder text.
158
+ */
159
+ placeholder: {
160
+ type: StringConstructor;
161
+ reflect: boolean;
162
+ };
162
163
  /**
163
164
  * Populates the `required` attribute on the element. Used for client-side validation.
164
165
  */
@@ -199,10 +200,13 @@ export class AuroSelect extends AuroElement {
199
200
  reflect: boolean;
200
201
  };
201
202
  /**
202
- * Value selected for the component. Default type is `String`, changing to `Array<String>` when `multiSelect` is true.
203
- * @type {String|Array<String>}
203
+ * Value selected for the component.
204
204
  */
205
- value: string | Array<string>;
205
+ value: {
206
+ type: StringConstructor;
207
+ reflect: boolean;
208
+ attribute: string;
209
+ };
206
210
  /**
207
211
  * Sets multi-select mode, allowing multiple options to be selected at once.
208
212
  */
@@ -301,10 +305,23 @@ export class AuroSelect extends AuroElement {
301
305
  fullscreenBreakpoint: string;
302
306
  onDark: boolean;
303
307
  isPopoverVisible: any;
308
+ /**
309
+ * Formatted value based on `multiSelect` state.
310
+ * Default type is `String`, changing to `Array<String>` when `multiSelect` is true.
311
+ * @private
312
+ * @returns {String|Array<String>}
313
+ */
314
+ private get formattedValue();
315
+ /**
316
+ * Returns classmap configuration for html5 input labels in all layouts.
317
+ * @private
318
+ * @returns {void}
319
+ */
320
+ private get commonLabelClasses();
304
321
  /**
305
322
  * Returns classmap configuration for wrapper elements in each layout.
306
323
  * @private
307
- * @return {object} - Returns classmap.
324
+ * @returns {object} - Returns classmap.
308
325
  */
309
326
  private get commonWrapperClasses();
310
327
  /**
@@ -384,6 +401,13 @@ export class AuroSelect extends AuroElement {
384
401
  */
385
402
  private clearSelection;
386
403
  firstUpdated(): void;
404
+ /**
405
+ * Update the menu value. With checks for menu existence. Awaits value update.
406
+ * @param {string} value - The value to set in the menu.
407
+ * @returns {void}
408
+ * @private
409
+ */
410
+ private updateMenuValue;
387
411
  updated(changedProperties: any): Promise<void>;
388
412
  /**
389
413
  * Resets component to initial state.
@@ -413,8 +437,18 @@ export class AuroSelect extends AuroElement {
413
437
  * @private
414
438
  */
415
439
  private _updateNativeSelect;
416
- renderAriaHtml(): import("lit-html").TemplateResult;
417
- renderNativeSelect(): import("lit-html").TemplateResult;
440
+ /**
441
+ * Returns HTML for the hidden a11y screen reader content.
442
+ * @private
443
+ * @returns {html} - Returns HTML for the hidden a11y screen reader content.
444
+ */
445
+ private renderAriaHtml;
446
+ /**
447
+ * Returns HTML for the hidden HTML5 select.
448
+ * @private
449
+ * @returns {html} - Returns HTML for the hidden HTML5 select.
450
+ */
451
+ private renderNativeSelect;
418
452
  /**
419
453
  * Returns HTML for the help text and error message.
420
454
  * @private
@@ -446,6 +480,5 @@ export class AuroSelect extends AuroElement {
446
480
  * @returns {void}
447
481
  */
448
482
  private renderLayout;
449
- renderBACKUP(): import("lit-html").TemplateResult;
450
483
  }
451
484
  import { AuroElement } from '../../layoutElement/src/auroElement.js';