@aurodesignsystem-dev/auro-formkit 0.0.0-pr624.8 → 0.0.0-pr624.80

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 (143) 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 +49 -15
  9. package/components/checkbox/demo/api.min.js +73 -43
  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 +73 -43
  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 +72 -42
  18. package/components/checkbox/dist/registered.js +72 -42
  19. package/components/combobox/demo/api.html +16 -10
  20. package/components/combobox/demo/api.md +115 -8
  21. package/components/combobox/demo/api.min.js +3102 -921
  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 +3102 -921
  25. package/components/combobox/demo/readme.html +16 -9
  26. package/components/combobox/dist/auro-combobox.d.ts +44 -12
  27. package/components/combobox/dist/index.js +3080 -995
  28. package/components/combobox/dist/registered.js +3080 -995
  29. package/components/counter/demo/api.html +17 -10
  30. package/components/counter/demo/api.md +158 -21
  31. package/components/counter/demo/api.min.js +3416 -728
  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 +3416 -728
  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 +161 -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 +3416 -728
  42. package/components/counter/dist/registered.js +3416 -728
  43. package/components/datepicker/README.md +1 -1
  44. package/components/datepicker/demo/api.html +16 -10
  45. package/components/datepicker/demo/api.md +59 -28
  46. package/components/datepicker/demo/api.min.js +8486 -4644
  47. package/components/datepicker/demo/index.html +16 -10
  48. package/components/datepicker/demo/index.md +75 -8
  49. package/components/datepicker/demo/index.min.js +8486 -4644
  50. package/components/datepicker/demo/readme.html +16 -9
  51. package/components/datepicker/demo/readme.md +1 -1
  52. package/components/datepicker/dist/auro-datepicker.d.ts +151 -12
  53. package/components/datepicker/dist/buttonVersion.d.ts +1 -1
  54. package/components/datepicker/dist/iconVersion.d.ts +2 -0
  55. package/components/datepicker/dist/index.js +7033 -3191
  56. package/components/datepicker/dist/popoverVersion.d.ts +1 -1
  57. package/components/datepicker/dist/registered.js +7033 -3191
  58. package/components/dropdown/demo/api.html +16 -10
  59. package/components/dropdown/demo/api.md +82 -275
  60. package/components/dropdown/demo/api.min.js +451 -260
  61. package/components/dropdown/demo/index.html +16 -10
  62. package/components/dropdown/demo/index.md +92 -362
  63. package/components/dropdown/demo/index.min.js +451 -260
  64. package/components/dropdown/demo/readme.html +16 -9
  65. package/components/dropdown/dist/auro-dropdown.d.ts +43 -83
  66. package/components/dropdown/dist/auro-dropdownBib.d.ts +14 -0
  67. package/components/dropdown/dist/index.js +450 -259
  68. package/components/dropdown/dist/registered.js +450 -259
  69. package/components/form/demo/api.html +16 -9
  70. package/components/form/demo/api.min.js +2 -2
  71. package/components/form/demo/autocomplete.html +19 -3
  72. package/components/form/demo/index.html +16 -9
  73. package/components/form/demo/index.min.js +2 -2
  74. package/components/form/demo/readme.html +16 -9
  75. package/components/form/demo/working.html +19 -13
  76. package/components/form/dist/index.js +1 -1
  77. package/components/form/dist/registered.js +1 -1
  78. package/components/helptext/dist/index.js +2 -2
  79. package/components/helptext/dist/registered.js +2 -2
  80. package/components/input/README.md +5 -2
  81. package/components/input/demo/api.html +16 -10
  82. package/components/input/demo/api.md +228 -130
  83. package/components/input/demo/api.min.js +909 -247
  84. package/components/input/demo/index.html +16 -10
  85. package/components/input/demo/index.md +48 -32
  86. package/components/input/demo/index.min.js +909 -247
  87. package/components/input/demo/readme.html +16 -9
  88. package/components/input/demo/readme.md +5 -2
  89. package/components/input/dist/auro-input.d.ts +3 -3
  90. package/components/input/dist/base-input.d.ts +38 -10
  91. package/components/input/dist/buttonVersion.d.ts +1 -1
  92. package/components/input/dist/iconVersion.d.ts +1 -1
  93. package/components/input/dist/index.js +908 -246
  94. package/components/input/dist/registered.js +908 -246
  95. package/components/layoutElement/dist/index.js +13 -10
  96. package/components/menu/demo/api.html +32 -10
  97. package/components/menu/demo/api.md +69 -8
  98. package/components/menu/demo/api.min.js +239 -48
  99. package/components/menu/demo/index.html +16 -10
  100. package/components/menu/demo/index.min.js +239 -48
  101. package/components/menu/demo/readme.html +16 -9
  102. package/components/menu/dist/auro-menu.d.ts +41 -7
  103. package/components/menu/dist/auro-menuoption.d.ts +15 -3
  104. package/components/menu/dist/iconVersion.d.ts +1 -1
  105. package/components/menu/dist/index.js +238 -47
  106. package/components/menu/dist/registered.js +238 -47
  107. package/components/menu/dist/styles/default/color-menuoption-css.d.ts +2 -0
  108. package/components/menu/dist/styles/default/style-menu-css.d.ts +2 -0
  109. package/components/menu/dist/styles/default/style-menuoption-css.d.ts +2 -0
  110. package/components/menu/dist/styles/default/tokens-css.d.ts +2 -0
  111. package/components/radio/demo/api.html +16 -10
  112. package/components/radio/demo/api.md +39 -9
  113. package/components/radio/demo/api.min.js +91 -93
  114. package/components/radio/demo/index.html +16 -10
  115. package/components/radio/demo/index.min.js +91 -93
  116. package/components/radio/demo/readme.html +16 -9
  117. package/components/radio/dist/auro-radio-group.d.ts +1 -1
  118. package/components/radio/dist/auro-radio.d.ts +9 -12
  119. package/components/radio/dist/index.js +90 -92
  120. package/components/radio/dist/registered.js +90 -92
  121. package/components/select/demo/api.html +16 -10
  122. package/components/select/demo/api.js +0 -2
  123. package/components/select/demo/api.md +150 -121
  124. package/components/select/demo/api.min.js +2184 -704
  125. package/components/select/demo/index.html +17 -11
  126. package/components/select/demo/index.md +1066 -259
  127. package/components/select/demo/index.min.js +2186 -694
  128. package/components/select/demo/readme.html +16 -9
  129. package/components/select/dist/auro-select.d.ts +59 -21
  130. package/components/select/dist/index.js +2107 -711
  131. package/components/select/dist/registered.js +2107 -711
  132. package/package.json +31 -28
  133. /package/components/{datepicker/dist/styles/default/color-css.d.ts → counter/dist/styles/shapeSize-css.d.ts} +0 -0
  134. /package/components/{dropdown/dist/styles/default → datepicker/dist/styles/classic}/color-css.d.ts +0 -0
  135. /package/components/datepicker/dist/styles/{emphasized → classic}/style-css.d.ts +0 -0
  136. /package/components/{dropdown/dist/styles/default/bibColors-css.d.ts → datepicker/dist/styles/snowflake/color-css.d.ts} +0 -0
  137. /package/components/{dropdown/dist/styles/default → datepicker/dist/styles/snowflake}/style-css.d.ts +0 -0
  138. /package/components/dropdown/dist/styles/{default/bibStyles-css.d.ts → classic/bibColors-css.d.ts} +0 -0
  139. /package/components/{menu/dist/styles/color-menu-css.d.ts → dropdown/dist/styles/classic/bibStyles-css.d.ts} +0 -0
  140. /package/components/{menu/dist/styles/color-menuoption-css.d.ts → dropdown/dist/styles/classic/color-css.d.ts} +0 -0
  141. /package/components/{menu/dist/styles/style-menu-css.d.ts → dropdown/dist/styles/classic/style-css.d.ts} +0 -0
  142. /package/components/{menu/dist/styles/style-menuoption-css.d.ts → dropdown/dist/styles/style-css.d.ts} +0 -0
  143. /package/components/menu/dist/styles/{tokens-css.d.ts → default/color-menu-css.d.ts} +0 -0
package/components/dropdown/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-dropdown 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-dropdown</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-dropdown'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/dropdown/dist/auro-dropdown.d.ts CHANGED
@@ -1,16 +1,3 @@
1
- /**
2
- * @attr { Boolean } disableEventShow - If declared, the dropdown will only show by calling the API .show() public method.
3
- * @slot - Default slot for the popover content.
4
- * @slot label - Defines the content of the label.
5
- * @slot helpText - Defines the content of the helpText.
6
- * @slot trigger - Defines the content of the trigger.
7
- * @csspart trigger - The trigger content container.
8
- * @csspart chevron - The collapsed/expanded state icon container.
9
- * @csspart helpText - The helpText content container.
10
- * @event auroDropdown-triggerClick - Notifies that the trigger has been clicked.
11
- * @event auroDropdown-toggled - Notifies that the visibility of the dropdown bib has changed.
12
- * @event auroDropdown-idAdded - Notifies consumers that the unique ID for the dropdown bib has been generated.
13
- */
14
1
  export class AuroDropdown extends AuroElement {
15
2
  static get properties(): {
16
3
  /**
@@ -21,6 +8,14 @@ export class AuroDropdown extends AuroElement {
21
8
  type: BooleanConstructor;
22
9
  reflect: boolean;
23
10
  };
11
+ /**
12
+ * If declared, the dropdown will only show by calling the API .show() public method.
13
+ * @default false
14
+ */
15
+ disableEventShow: {
16
+ type: BooleanConstructor;
17
+ reflect: boolean;
18
+ };
24
19
  /**
25
20
  * If declared, applies a border around the trigger slot.
26
21
  */
@@ -37,16 +32,16 @@ export class AuroDropdown extends AuroElement {
37
32
  reflect: boolean;
38
33
  };
39
34
  /**
40
- * If declared, the dropdown will be styled with the common theme.
35
+ * If declared, the dropdown is not interactive.
41
36
  */
42
- common: {
37
+ disabled: {
43
38
  type: BooleanConstructor;
44
39
  reflect: boolean;
45
40
  };
46
41
  /**
47
- * If declared, the dropdown is not interactive.
42
+ * If declared, the focus trap inside of bib will be turned off.
48
43
  */
49
- disabled: {
44
+ disableFocusTrap: {
50
45
  type: BooleanConstructor;
51
46
  reflect: boolean;
52
47
  };
@@ -85,25 +80,13 @@ export class AuroDropdown extends AuroElement {
85
80
  type: BooleanConstructor;
86
81
  reflect: boolean;
87
82
  };
88
- /**
89
- * Makes the trigger to be full width of its parent container.
90
- */
91
- fluid: {
92
- type: BooleanConstructor;
93
- reflect: boolean;
94
- };
95
- /**
96
- * If declared, will apply padding around trigger slot content.
97
- */
98
- inset: {
99
- type: BooleanConstructor;
100
- reflect: boolean;
101
- };
102
83
  /**
103
84
  * If true, the dropdown bib is displayed.
104
85
  */
105
86
  isPopoverVisible: {
106
87
  type: BooleanConstructor;
88
+ reflect: boolean;
89
+ attribute: string;
107
90
  };
108
91
  /**
109
92
  * If true, the dropdown bib is taking the fullscreen when it's open.
@@ -137,14 +120,6 @@ export class AuroDropdown extends AuroElement {
137
120
  type: StringConstructor;
138
121
  reflect: boolean;
139
122
  };
140
- /**
141
- * Defines if there is a label preset.
142
- * @private
143
- */
144
- labeled: {
145
- type: BooleanConstructor;
146
- reflect: boolean;
147
- };
148
123
  /**
149
124
  * Defines if the trigger should size based on the parent element providing the border UI.
150
125
  * @private
@@ -198,6 +173,9 @@ export class AuroDropdown extends AuroElement {
198
173
  type: BooleanConstructor;
199
174
  reflect: boolean;
200
175
  };
176
+ /**
177
+ * If declared, and a function is set, that function will execute when the slot content is updated.
178
+ */
201
179
  onSlotChange: {
202
180
  type: FunctionConstructor;
203
181
  reflect: boolean;
@@ -210,13 +188,6 @@ export class AuroDropdown extends AuroElement {
210
188
  type: StringConstructor;
211
189
  reflect: boolean;
212
190
  };
213
- /**
214
- * If declared, will apply border-radius to trigger and default slots.
215
- */
216
- rounded: {
217
- type: BooleanConstructor;
218
- reflect: boolean;
219
- };
220
191
  /**
221
192
  * @private
222
193
  */
@@ -231,13 +202,6 @@ export class AuroDropdown extends AuroElement {
231
202
  attribute: boolean;
232
203
  reflect: boolean;
233
204
  };
234
- /**
235
- * The value for the aria-autocomplete attribute of the trigger element.
236
- */
237
- a11yAutocomplete: {
238
- type: StringConstructor;
239
- attribute: boolean;
240
- };
241
205
  };
242
206
  static get styles(): import("lit").CSSResult[];
243
207
  /**
@@ -253,18 +217,22 @@ export class AuroDropdown extends AuroElement {
253
217
  isBibFullscreen: boolean;
254
218
  matchWidth: boolean;
255
219
  noHideOnThisFocusLoss: boolean;
256
- errorMessage: string;
257
- shape: string;
258
- size: string;
220
+ errorMessage: any;
221
+ layout: any;
222
+ shape: any;
223
+ size: any;
259
224
  parentBorder: boolean;
260
- get commonLabelClasses(): {};
261
- get commonWrapperClasses(): {
262
- trigger: boolean;
263
- wrapper: boolean;
264
- hasFocus: boolean;
265
- simple: boolean;
266
- parentBorder: boolean;
267
- };
225
+ /**
226
+ * Handles the custom event `auroDropdown-toggled` to update the visibility of the dropdown bib.
227
+ * @private
228
+ * @param {CustomEvent} event - The custom event that contains the dropdown toggle information.
229
+ */
230
+ private handleDropdownToggle;
231
+ /**
232
+ * @private
233
+ * @returns {object} Class definition for the wrapper element.
234
+ */
235
+ private get commonWrapperClasses();
268
236
  /**
269
237
  * @private
270
238
  * @returns {void} Internal defaults.
@@ -272,12 +240,9 @@ export class AuroDropdown extends AuroElement {
272
240
  private privateDefaults;
273
241
  chevron: boolean;
274
242
  disabled: boolean;
243
+ disableFocusTrap: boolean;
275
244
  error: boolean;
276
- inset: boolean;
277
- rounded: boolean;
278
245
  noToggle: boolean;
279
- a11yAutocomplete: string;
280
- labeled: boolean;
281
246
  a11yRole: string;
282
247
  onDark: boolean;
283
248
  showTriggerBorders: boolean;
@@ -340,6 +305,11 @@ export class AuroDropdown extends AuroElement {
340
305
  * @returns {void}
341
306
  */
342
307
  show(): void;
308
+ /**
309
+ * When bib is open, focus on the first element inside of bib.
310
+ * If not, trigger element will get focus.
311
+ */
312
+ focus(): void;
343
313
  /**
344
314
  * Accessor for reusing the focusable entity query string.
345
315
  * @private
@@ -370,18 +340,16 @@ export class AuroDropdown extends AuroElement {
370
340
  private handleFocusin;
371
341
  hasFocus: boolean;
372
342
  /**
373
- * Function to support @focusout event.
374
343
  * @private
375
- * @return {void}
376
344
  */
377
- private handleFocusout;
345
+ private updateFocusTrap;
346
+ focusTrap: any;
378
347
  /**
379
- * Determines if the element or any children are focusable.
348
+ * Function to support @focusout event.
380
349
  * @private
381
- * @param {HTMLElement} element - Element to check.
382
- * @returns {Boolean} - True if the element or any children are focusable.
350
+ * @return {void}
383
351
  */
384
- private containsFocusableElement;
352
+ private handleFocusout;
385
353
  /**
386
354
  * Sets up event listeners to deliver focus and blur events from nested Auro components within the trigger slot to trigger.
387
355
  * This ensures that focus/blur events originating from within these components are propagated to the trigger element itself.
@@ -418,17 +386,9 @@ export class AuroDropdown extends AuroElement {
418
386
  *
419
387
  * @private
420
388
  * @method handleDefaultSlot
421
- * @param {Event} event - The event object representing the slot change.
422
389
  * @fires Function#onSlotChange - Optional callback invoked when the slot content changes.
423
390
  */
424
391
  private handleDefaultSlot;
425
- /**
426
- * @private
427
- * @method handleLabelSlotChange
428
- * @param {event} event - The event object representing the slot change.
429
- * @description Handles the slot change event for the label slot.
430
- */
431
- private handleLabelSlotChange;
432
392
  /**
433
393
  * Returns HTML for the common portion of the layouts.
434
394
  * @private
package/components/dropdown/dist/auro-dropdownBib.d.ts CHANGED
@@ -26,6 +26,14 @@ export class AuroDropdownBib extends LitElement {
26
26
  type: BooleanConstructor;
27
27
  reflect: boolean;
28
28
  };
29
+ /**
30
+ * If declared, the bib width will match the trigger width.
31
+ * @private
32
+ */
33
+ matchWidth: {
34
+ type: BooleanConstructor;
35
+ reflect: boolean;
36
+ };
29
37
  /**
30
38
  * If declared, will apply border-radius to the bib.
31
39
  */
@@ -39,11 +47,17 @@ export class AuroDropdownBib extends LitElement {
39
47
  bibTemplate: {
40
48
  type: ObjectConstructor;
41
49
  };
50
+ shape: {
51
+ type: StringConstructor;
52
+ reflect: boolean;
53
+ };
42
54
  };
43
55
  /**
44
56
  * @private
45
57
  */
46
58
  private _mobileBreakpointValue;
59
+ shape: string;
60
+ matchWidth: boolean;
47
61
  set mobileFullscreenBreakpoint(value: string);
48
62
  get mobileFullscreenBreakpoint(): string;
49
63
  updated(changedProperties: any): void;