@aurodesignsystem-dev/auro-formkit 0.0.0-pr1489.0 → 0.0.0-pr1489.10

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 (66) hide show
  1. package/components/checkbox/demo/customize.min.js +249 -125
  2. package/components/checkbox/demo/getting-started.min.js +249 -125
  3. package/components/checkbox/demo/index.min.js +249 -125
  4. package/components/checkbox/demo/styles.min.css +1 -1
  5. package/components/checkbox/dist/index.js +249 -125
  6. package/components/checkbox/dist/registered.js +249 -125
  7. package/components/combobox/demo/customize.min.js +523 -259
  8. package/components/combobox/demo/getting-started.min.js +523 -259
  9. package/components/combobox/demo/index.min.js +523 -259
  10. package/components/combobox/demo/styles.min.css +1 -1
  11. package/components/combobox/dist/index.js +523 -259
  12. package/components/combobox/dist/registered.js +523 -259
  13. package/components/counter/demo/customize.min.js +271 -131
  14. package/components/counter/demo/index.min.js +271 -131
  15. package/components/counter/demo/styles.min.css +1 -1
  16. package/components/counter/dist/index.js +249 -125
  17. package/components/counter/dist/registered.js +249 -125
  18. package/components/datepicker/demo/accessibility.md +12 -9
  19. package/components/datepicker/demo/api.md +1 -1
  20. package/components/datepicker/demo/customize.md +4 -0
  21. package/components/datepicker/demo/customize.min.js +1638 -654
  22. package/components/datepicker/demo/index.md +35 -5
  23. package/components/datepicker/demo/index.min.js +1654 -659
  24. package/components/datepicker/demo/keyboard-behavior.md +16 -16
  25. package/components/datepicker/demo/styles.min.css +1 -1
  26. package/components/datepicker/demo/voiceover.md +5 -3
  27. package/components/datepicker/demo/why-datepicker.md +2 -2
  28. package/components/datepicker/dist/index.js +1642 -658
  29. package/components/datepicker/dist/registered.js +1642 -658
  30. package/components/datepicker/dist/src/auro-calendar-cell.d.ts +52 -17
  31. package/components/datepicker/dist/src/auro-calendar-month.d.ts +12 -4
  32. package/components/datepicker/dist/src/auro-calendar.d.ts +161 -8
  33. package/components/datepicker/dist/src/auro-datepicker.d.ts +77 -79
  34. package/components/dropdown/demo/customize.min.js +22 -6
  35. package/components/dropdown/demo/getting-started.min.js +22 -6
  36. package/components/dropdown/demo/index.min.js +22 -6
  37. package/components/dropdown/demo/styles.min.css +1 -1
  38. package/components/dropdown/dist/auro-dropdown.d.ts +3 -2
  39. package/components/dropdown/dist/index.js +22 -6
  40. package/components/dropdown/dist/registered.js +22 -6
  41. package/components/form/demo/customize.min.js +3461 -1561
  42. package/components/form/demo/getting-started.min.js +3461 -1561
  43. package/components/form/demo/index.min.js +3461 -1561
  44. package/components/form/demo/registerDemoDeps.min.js +3461 -1561
  45. package/components/form/demo/styles.min.css +1 -1
  46. package/components/input/demo/customize.min.js +249 -125
  47. package/components/input/demo/getting-started.min.js +249 -125
  48. package/components/input/demo/index.min.js +249 -125
  49. package/components/input/demo/styles.min.css +1 -1
  50. package/components/input/dist/index.js +249 -125
  51. package/components/input/dist/registered.js +249 -125
  52. package/components/menu/demo/styles.min.css +1 -1
  53. package/components/radio/demo/customize.min.js +249 -125
  54. package/components/radio/demo/getting-started.min.js +249 -125
  55. package/components/radio/demo/index.min.js +249 -125
  56. package/components/radio/demo/styles.min.css +1 -1
  57. package/components/radio/dist/index.js +249 -125
  58. package/components/radio/dist/registered.js +249 -125
  59. package/components/select/demo/customize.min.js +271 -131
  60. package/components/select/demo/getting-started.min.js +271 -131
  61. package/components/select/demo/index.min.js +271 -131
  62. package/components/select/demo/styles.min.css +1 -1
  63. package/components/select/dist/index.js +271 -131
  64. package/components/select/dist/registered.js +271 -131
  65. package/custom-elements.json +1936 -1614
  66. package/package.json +8 -8
package/components/datepicker/demo/index.md CHANGED
@@ -12,6 +12,7 @@
12
12
  <auro-anchorlink fluid href="#skipSelection" class="level2 body-xs">Skip Selection</auro-anchorlink>
13
13
  <auro-anchorlink fluid href="#popoverSlot" class="level2 body-xs">Date Popover</auro-anchorlink>
14
14
  <auro-anchorlink fluid href="#blackoutDates" class="level2 body-xs">Blackout Dates</auro-anchorlink>
15
+ <auro-anchorlink fluid href="#referenceDates" class="level2 body-xs">Reference Dates</auro-anchorlink>
15
16
  <auro-anchorlink fluid href="#viewportSize" class="level2 body-xs">Viewport Size</auro-anchorlink>
16
17
  </auro-nav>
17
18
  </nav>
@@ -180,7 +181,7 @@
180
181
  <div class="exampleWrapper">
181
182
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/popover-slot.html) -->
182
183
  <!-- The below content is automatically added from ./../apiExamples/popover-slot.html -->
183
- <auro-datepicker centralDate="12/03/2023" calendarStartDate="12/01/2023" calendarEndDate="12/31/2023" minDate="12/04/2023" maxDate="12/09/2023">
184
+ <auro-datepicker centralDate="12/03/2023" calendarStartDate="12/01/2023" calendarEndDate="12/31/2023" minDate="12/02/2023" maxDate="12/09/2023">
184
185
  <span slot="bib.fullscreen.headline">Popover Slot Example</span>
185
186
  <span slot="fromLabel">Choose a date</span>
186
187
  <span slot="bib.fullscreen.fromLabel">Choose a date</span>
@@ -205,7 +206,7 @@
205
206
  <span slot="trigger">See code</span>
206
207
  <!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/popover-slot.html) -->
207
208
  <!-- The below code snippet is automatically added from ./../apiExamples/popover-slot.html -->
208
- <pre class="language-html"><code class="language-html">&lt;auro-datepicker centralDate="12/03/2023" calendarStartDate="12/01/2023" calendarEndDate="12/31/2023" minDate="12/04/2023" maxDate="12/09/2023"&gt;
209
+ <pre class="language-html"><code class="language-html">&lt;auro-datepicker centralDate="12/03/2023" calendarStartDate="12/01/2023" calendarEndDate="12/31/2023" minDate="12/02/2023" maxDate="12/09/2023"&gt;
209
210
  &lt;span slot="bib.fullscreen.headline"&gt;Popover Slot Example&lt;/span&gt;
210
211
  &lt;span slot="fromLabel"&gt;Choose a date&lt;/span&gt;
211
212
  &lt;span slot="bib.fullscreen.fromLabel"&gt;Choose a date&lt;/span&gt;
@@ -232,9 +233,11 @@
232
233
  <div class="exampleWrapper">
233
234
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/blackout-label.html) -->
234
235
  <!-- The below content is automatically added from ./../apiExamples/blackout-label.html -->
235
- <auro-datepicker id="blackoutLabelExample" blackoutLabel="sold out">
236
- <span slot="fromLabel">Choose a date</span>
236
+ <auro-datepicker id="blackoutLabelExample" range blackoutLabel="sold out">
237
+ <span slot="fromLabel">Choose a start date</span>
238
+ <span slot="toLabel">Choose an end date</span>
237
239
  <span slot="bib.fullscreen.fromLabel">Choose a date</span>
240
+ <span slot="bib.fullscreen.toLabel">Choose an end date</span>
238
241
  </auro-datepicker>
239
242
  <!-- AURO-GENERATED-CONTENT:END -->
240
243
  </div>
@@ -242,7 +245,34 @@
242
245
  <span slot="trigger">See code</span>
243
246
  <!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/blackout-label.html) -->
244
247
  <!-- The below code snippet is automatically added from ./../apiExamples/blackout-label.html -->
245
- <pre class="language-html"><code class="language-html">&lt;auro-datepicker id="blackoutLabelExample" blackoutLabel="sold out"&gt;
248
+ <pre class="language-html"><code class="language-html">&lt;auro-datepicker id="blackoutLabelExample" range blackoutLabel="sold out"&gt;
249
+ &lt;span slot="fromLabel"&gt;Choose a start date&lt;/span&gt;
250
+ &lt;span slot="toLabel"&gt;Choose an end date&lt;/span&gt;
251
+ &lt;span slot="bib.fullscreen.fromLabel"&gt;Choose a date&lt;/span&gt;
252
+ &lt;span slot="bib.fullscreen.toLabel"&gt;Choose an end date&lt;/span&gt;
253
+ &lt;/auro-datepicker&gt;</code></pre>
254
+ <!-- AURO-GENERATED-CONTENT:END -->
255
+ </auro-accordion>
256
+ <auro-header level="3" id="referenceDates">Reference dates</auro-header>
257
+ <p>Use the <code>referenceDates</code> attribute to highlight specific dates on the calendar. Reference dates are displayed with a distinct visual treatment to draw attention to dates of interest, such as the cheapest travel dates or dates with special availability.</p>
258
+ <div class="exampleWrapper">
259
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/reference-dates.html) -->
260
+ <!-- The below content is automatically added from ./../apiExamples/reference-dates.html -->
261
+ <auro-datepicker referenceDates='["10/05/2025", "10/15/2025", "10/20/2025", "10/22/2025"]' minDate="10/02/2025" range>
262
+ <span slot="ariaLabel.bib.close">Close Calendar</span>
263
+ <span slot="bib.fullscreen.headline">Datepicker Headline</span>
264
+ <span slot="fromLabel">Choose a date</span>
265
+ <span slot="bib.fullscreen.fromLabel">Choose a date</span>
266
+ </auro-datepicker>
267
+ <!-- AURO-GENERATED-CONTENT:END -->
268
+ </div>
269
+ <auro-accordion alignRight>
270
+ <span slot="trigger">See code</span>
271
+ <!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/reference-dates.html) -->
272
+ <!-- The below code snippet is automatically added from ./../apiExamples/reference-dates.html -->
273
+ <pre class="language-html"><code class="language-html">&lt;auro-datepicker referenceDates='["10/05/2025", "10/15/2025", "10/20/2025", "10/22/2025"]' minDate="10/02/2025" range&gt;
274
+ &lt;span slot="ariaLabel.bib.close"&gt;Close Calendar&lt;/span&gt;
275
+ &lt;span slot="bib.fullscreen.headline"&gt;Datepicker Headline&lt;/span&gt;
246
276
  &lt;span slot="fromLabel"&gt;Choose a date&lt;/span&gt;
247
277
  &lt;span slot="bib.fullscreen.fromLabel"&gt;Choose a date&lt;/span&gt;
248
278
  &lt;/auro-datepicker&gt;</code></pre>