@aurodesignsystem/auro-formkit 4.0.1 → 5.0.0-rc-1002.1.1

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 (175) hide show
  1. package/CHANGELOG.md +193 -3
  2. package/components/bibtemplate/dist/auro-bibtemplate.d.ts +12 -2
  3. package/components/bibtemplate/dist/buttonVersion.d.ts +2 -0
  4. package/components/bibtemplate/dist/headerVersion.d.ts +1 -1
  5. package/components/bibtemplate/dist/iconVersion.d.ts +1 -1
  6. package/components/bibtemplate/dist/index.js +1184 -105
  7. package/components/bibtemplate/dist/registered.js +1184 -105
  8. package/components/checkbox/README.md +1 -1
  9. package/components/checkbox/demo/api.html +16 -10
  10. package/components/checkbox/demo/api.md +54 -19
  11. package/components/checkbox/demo/api.min.js +81 -45
  12. package/components/checkbox/demo/index.html +16 -10
  13. package/components/checkbox/demo/index.md +2 -2
  14. package/components/checkbox/demo/index.min.js +81 -45
  15. package/components/checkbox/demo/readme.html +16 -9
  16. package/components/checkbox/demo/readme.md +1 -1
  17. package/components/checkbox/dist/auro-checkbox-group.d.ts +2 -2
  18. package/components/checkbox/dist/auro-checkbox.d.ts +10 -3
  19. package/components/checkbox/dist/index.js +80 -44
  20. package/components/checkbox/dist/registered.js +80 -44
  21. package/components/combobox/README.md +2 -0
  22. package/components/combobox/demo/api.html +16 -10
  23. package/components/combobox/demo/api.md +124 -7
  24. package/components/combobox/demo/api.min.js +4542 -1330
  25. package/components/combobox/demo/index.html +16 -10
  26. package/components/combobox/demo/index.md +108 -4
  27. package/components/combobox/demo/index.min.js +4542 -1330
  28. package/components/combobox/demo/readme.html +16 -9
  29. package/components/combobox/demo/readme.md +2 -0
  30. package/components/combobox/dist/auro-combobox.d.ts +81 -18
  31. package/components/combobox/dist/index.js +4588 -1520
  32. package/components/combobox/dist/registered.js +4588 -1520
  33. package/components/counter/demo/api.html +17 -10
  34. package/components/counter/demo/api.md +167 -21
  35. package/components/counter/demo/api.min.js +3621 -866
  36. package/components/counter/demo/index.html +17 -10
  37. package/components/counter/demo/index.md +191 -34
  38. package/components/counter/demo/index.min.js +3621 -866
  39. package/components/counter/demo/readme.html +16 -9
  40. package/components/counter/dist/auro-counter-button.d.ts +2 -0
  41. package/components/counter/dist/auro-counter-group.d.ts +162 -11
  42. package/components/counter/dist/auro-counter.d.ts +16 -0
  43. package/components/counter/dist/helptextVersion.d.ts +2 -0
  44. package/components/counter/dist/iconVersion.d.ts +1 -1
  45. package/components/counter/dist/index.js +3619 -864
  46. package/components/counter/dist/registered.js +3619 -864
  47. package/components/datepicker/README.md +2 -1
  48. package/components/datepicker/demo/api.html +16 -10
  49. package/components/datepicker/demo/api.md +80 -30
  50. package/components/datepicker/demo/api.min.js +14795 -10365
  51. package/components/datepicker/demo/index.html +16 -10
  52. package/components/datepicker/demo/index.md +96 -4
  53. package/components/datepicker/demo/index.min.js +14795 -10365
  54. package/components/datepicker/demo/readme.html +16 -9
  55. package/components/datepicker/demo/readme.md +2 -1
  56. package/components/datepicker/dist/auro-datepicker.d.ts +163 -4
  57. package/components/datepicker/dist/buttonVersion.d.ts +1 -1
  58. package/components/datepicker/dist/iconVersion.d.ts +2 -0
  59. package/components/datepicker/dist/index.js +14916 -10486
  60. package/components/datepicker/dist/popoverVersion.d.ts +1 -1
  61. package/components/datepicker/dist/registered.js +14916 -10486
  62. package/components/dropdown/demo/api.html +16 -10
  63. package/components/dropdown/demo/api.md +94 -262
  64. package/components/dropdown/demo/api.min.js +738 -259
  65. package/components/dropdown/demo/index.html +16 -10
  66. package/components/dropdown/demo/index.md +93 -266
  67. package/components/dropdown/demo/index.min.js +738 -259
  68. package/components/dropdown/demo/readme.html +16 -9
  69. package/components/dropdown/dist/auro-dropdown.d.ts +92 -73
  70. package/components/dropdown/dist/auro-dropdownBib.d.ts +14 -0
  71. package/components/dropdown/dist/index.js +710 -231
  72. package/components/dropdown/dist/registered.js +710 -231
  73. package/components/dropdown/dist/styles/classic/style-css.d.ts +2 -0
  74. package/components/dropdown/dist/styles/emphasized/style-css.d.ts +2 -0
  75. package/components/dropdown/dist/styles/shapeSize-css.d.ts +2 -0
  76. package/components/dropdown/dist/styles/snowflake/style-css.d.ts +2 -0
  77. package/components/form/demo/api.html +16 -9
  78. package/components/form/demo/api.md +1 -1
  79. package/components/form/demo/api.min.js +3 -3
  80. package/components/form/demo/autocomplete.html +19 -3
  81. package/components/form/demo/index.html +16 -9
  82. package/components/form/demo/index.min.js +3 -3
  83. package/components/form/demo/readme.html +16 -9
  84. package/components/form/demo/working.html +19 -13
  85. package/components/form/dist/auro-form.d.ts +1 -1
  86. package/components/form/dist/index.js +2 -2
  87. package/components/form/dist/registered.js +2 -2
  88. package/components/helptext/dist/auro-helptext.d.ts +0 -2
  89. package/components/helptext/dist/index.js +2 -4
  90. package/components/helptext/dist/registered.js +2 -4
  91. package/components/input/README.md +6 -2
  92. package/components/input/demo/api.html +16 -10
  93. package/components/input/demo/api.md +258 -144
  94. package/components/input/demo/api.min.js +1550 -497
  95. package/components/input/demo/index.html +17 -11
  96. package/components/input/demo/index.md +95 -27
  97. package/components/input/demo/index.min.js +1549 -496
  98. package/components/input/demo/readme.html +16 -9
  99. package/components/input/demo/readme.md +6 -2
  100. package/components/input/dist/auro-input.d.ts +139 -3
  101. package/components/input/dist/base-input.d.ts +80 -26
  102. package/components/input/dist/buttonVersion.d.ts +1 -1
  103. package/components/input/dist/iconVersion.d.ts +1 -1
  104. package/components/input/dist/index.js +1504 -451
  105. package/components/input/dist/registered.js +1504 -451
  106. package/components/input/dist/styles/classic/color-css.d.ts +2 -0
  107. package/components/input/dist/styles/classic/style-css.d.ts +2 -0
  108. package/components/input/dist/styles/default/borders-css.d.ts +2 -0
  109. package/components/input/dist/styles/default/color-css.d.ts +2 -0
  110. package/components/input/dist/styles/default/mixins-css.d.ts +2 -0
  111. package/components/input/dist/styles/default/notificationIcons-css.d.ts +2 -0
  112. package/components/input/dist/styles/default/style-css.d.ts +2 -0
  113. package/components/input/dist/styles/emphasized/color-css.d.ts +2 -0
  114. package/components/input/dist/styles/emphasized/style-css.d.ts +2 -0
  115. package/components/input/dist/styles/shapeSize-css.d.ts +2 -0
  116. package/components/input/dist/styles/snowflake/style-css.d.ts +2 -0
  117. package/components/layoutElement/dist/auroElement.d.ts +34 -0
  118. package/components/layoutElement/dist/index.d.ts +2 -0
  119. package/components/layoutElement/dist/index.js +98 -0
  120. package/components/layoutElement/dist/registered.js +98 -0
  121. package/components/menu/demo/api.html +17 -10
  122. package/components/menu/demo/api.md +65 -8
  123. package/components/menu/demo/api.min.js +304 -65
  124. package/components/menu/demo/index.html +16 -10
  125. package/components/menu/demo/index.min.js +304 -65
  126. package/components/menu/demo/readme.html +16 -9
  127. package/components/menu/dist/auro-menu.d.ts +53 -7
  128. package/components/menu/dist/auro-menuoption.d.ts +21 -3
  129. package/components/menu/dist/iconVersion.d.ts +1 -1
  130. package/components/menu/dist/index.js +289 -50
  131. package/components/menu/dist/registered.js +289 -50
  132. package/components/menu/dist/styles/default/color-menu-css.d.ts +2 -0
  133. package/components/menu/dist/styles/default/color-menuoption-css.d.ts +2 -0
  134. package/components/menu/dist/styles/default/style-menu-css.d.ts +2 -0
  135. package/components/menu/dist/styles/default/style-menuoption-css.d.ts +2 -0
  136. package/components/menu/dist/styles/default/tokens-css.d.ts +2 -0
  137. package/components/radio/demo/api.html +16 -10
  138. package/components/radio/demo/api.md +41 -9
  139. package/components/radio/demo/api.min.js +93 -95
  140. package/components/radio/demo/index.html +16 -10
  141. package/components/radio/demo/index.min.js +93 -95
  142. package/components/radio/demo/readme.html +16 -9
  143. package/components/radio/dist/auro-radio-group.d.ts +1 -1
  144. package/components/radio/dist/auro-radio.d.ts +11 -12
  145. package/components/radio/dist/index.js +92 -94
  146. package/components/radio/dist/registered.js +92 -94
  147. package/components/select/README.md +1 -0
  148. package/components/select/demo/api.html +16 -10
  149. package/components/select/demo/api.js +0 -2
  150. package/components/select/demo/api.md +156 -114
  151. package/components/select/demo/api.min.js +3126 -657
  152. package/components/select/demo/index.html +17 -10
  153. package/components/select/demo/index.md +398 -62
  154. package/components/select/demo/index.min.js +3129 -648
  155. package/components/select/demo/readme.html +16 -9
  156. package/components/select/demo/readme.md +1 -0
  157. package/components/select/dist/auro-select.d.ts +173 -18
  158. package/components/select/dist/helptextVersion.d.ts +2 -0
  159. package/components/select/dist/index.js +3128 -791
  160. package/components/select/dist/registered.js +3128 -791
  161. package/components/select/dist/styles/shapeSize-css.d.ts +2 -0
  162. package/components/select/dist/styles/tokens-css.d.ts +2 -0
  163. package/package.json +33 -32
  164. package/packages/build-tools/src/postinstall.mjs +0 -12
  165. /package/components/{dropdown/dist/styles/bibColors-css.d.ts → combobox/dist/styles/emphasized/style-css.d.ts} +0 -0
  166. /package/components/{dropdown/dist/styles/bibStyles-css.d.ts → combobox/dist/styles/snowflake/style-css.d.ts} +0 -0
  167. /package/components/{input/dist/styles/borders-css.d.ts → counter/dist/styles/shapeSize-css.d.ts} +0 -0
  168. /package/components/{input/dist/styles/input-css.d.ts → datepicker/dist/styles/classic/color-css.d.ts} +0 -0
  169. /package/components/{input/dist/styles/label-css.d.ts → datepicker/dist/styles/classic/style-css.d.ts} +0 -0
  170. /package/components/{input/dist/styles/notificationIcons-css.d.ts → datepicker/dist/styles/shapeSize-css.d.ts} +0 -0
  171. /package/components/{menu/dist/styles/color-menu-css.d.ts → datepicker/dist/styles/snowflake/color-css.d.ts} +0 -0
  172. /package/components/{menu/dist/styles/color-menuoption-css.d.ts → datepicker/dist/styles/snowflake/style-css.d.ts} +0 -0
  173. /package/components/{menu/dist/styles/style-menu-css.d.ts → dropdown/dist/styles/classic/bibColors-css.d.ts} +0 -0
  174. /package/components/{menu/dist/styles/style-menuoption-css.d.ts → dropdown/dist/styles/classic/bibStyles-css.d.ts} +0 -0
  175. /package/components/{menu/dist/styles/tokens-css.d.ts → dropdown/dist/styles/classic/color-css.d.ts} +0 -0
@@ -16,18 +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-datepicker 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-datepicker</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-datepicker'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
- <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/bundled/essentials-as.css" />
30
- </head>
36
+ </head>
31
37
  <body class="auro-markdown">
32
38
  <main></main>
33
39
 
@@ -17,12 +17,99 @@ The `<auro-datepicker>` element should be used in situations where users may:
17
17
 
18
18
  ## Examples
19
19
 
20
+ ### Snowflake layout
21
+
22
+ #### Single date
23
+ <div class="exampleWrapper--ondark" style="width: 306px">
24
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/snowflake/ondark.html) -->
25
+ <!-- The below content is automatically added from ./../apiExamples/snowflake/ondark.html -->
26
+ <auro-datepicker layout="snowflake" shape="snowflake" ondark placeholder="MM/DD">
27
+ <span slot="ariaLabel.bib.close">Close Calendar</span>
28
+ <span slot="label">Date</span>
29
+ <span slot="bib.fullscreen.headline">Datepicker Headline</span>
30
+ <span slot="fromLabel">Choose a date</span>
31
+ <span slot="bib.fullscreen.dateLabel">Choose a date</span>
32
+ </auro-datepicker>
33
+ <!-- AURO-GENERATED-CONTENT:END -->
34
+ </div>
35
+ <div class="exampleWrapper--ondark">
36
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/snowflake/ondark.html) -->
37
+ <!-- The below content is automatically added from ./../apiExamples/snowflake/ondark.html -->
38
+ <auro-datepicker layout="snowflake" shape="snowflake" ondark placeholder="MM/DD">
39
+ <span slot="ariaLabel.bib.close">Close Calendar</span>
40
+ <span slot="label">Date</span>
41
+ <span slot="bib.fullscreen.headline">Datepicker Headline</span>
42
+ <span slot="fromLabel">Choose a date</span>
43
+ <span slot="bib.fullscreen.dateLabel">Choose a date</span>
44
+ </auro-datepicker>
45
+ <!-- AURO-GENERATED-CONTENT:END -->
46
+ </div>
47
+ <auro-accordion alignRight>
48
+ <span slot="trigger">See code</span>
49
+ <!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/snowflake/ondark.html) -->
50
+ <!-- The below code snippet is automatically added from ./../apiExamples/snowflake/ondark.html -->
51
+
52
+ ```html
53
+ <auro-datepicker layout="snowflake" shape="snowflake" ondark placeholder="MM/DD">
54
+ <span slot="ariaLabel.bib.close">Close Calendar</span>
55
+ <span slot="label">Date</span>
56
+ <span slot="bib.fullscreen.headline">Datepicker Headline</span>
57
+ <span slot="fromLabel">Choose a date</span>
58
+ <span slot="bib.fullscreen.dateLabel">Choose a date</span>
59
+ </auro-datepicker>
60
+ ```
61
+ <!-- AURO-GENERATED-CONTENT:END -->
62
+ </auro-accordion>
63
+
64
+ #### Range
65
+ <div class="exampleWrapper--ondark" style="width: 306px">
66
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/snowflake/ondark-range.html) -->
67
+ <!-- The below content is automatically added from ./../apiExamples/snowflake/ondark-range.html -->
68
+ <auro-datepicker range layout="snowflake" shape="snowflake" ondark placeholder="MM/DD">
69
+ <span slot="ariaLabel.bib.close">Close Calendar</span>
70
+ <span slot="label">Dates</span>
71
+ <span slot="bib.fullscreen.headline">Datepicker Headline</span>
72
+ <span slot="fromLabel">Choose a date</span>
73
+ <span slot="bib.fullscreen.dateLabel">Choose a date</span>
74
+ </auro-datepicker>
75
+ <!-- AURO-GENERATED-CONTENT:END -->
76
+ </div>
77
+ <div class="exampleWrapper--ondark">
78
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/snowflake/ondark-range.html) -->
79
+ <!-- The below content is automatically added from ./../apiExamples/snowflake/ondark-range.html -->
80
+ <auro-datepicker range layout="snowflake" shape="snowflake" ondark placeholder="MM/DD">
81
+ <span slot="ariaLabel.bib.close">Close Calendar</span>
82
+ <span slot="label">Dates</span>
83
+ <span slot="bib.fullscreen.headline">Datepicker Headline</span>
84
+ <span slot="fromLabel">Choose a date</span>
85
+ <span slot="bib.fullscreen.dateLabel">Choose a date</span>
86
+ </auro-datepicker>
87
+ <!-- AURO-GENERATED-CONTENT:END -->
88
+ </div>
89
+ <auro-accordion alignRight>
90
+ <span slot="trigger">See code</span>
91
+ <!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/snowflake/ondark-range.html) -->
92
+ <!-- The below code snippet is automatically added from ./../apiExamples/snowflake/ondark-range.html -->
93
+
94
+ ```html
95
+ <auro-datepicker range layout="snowflake" shape="snowflake" ondark placeholder="MM/DD">
96
+ <span slot="ariaLabel.bib.close">Close Calendar</span>
97
+ <span slot="label">Dates</span>
98
+ <span slot="bib.fullscreen.headline">Datepicker Headline</span>
99
+ <span slot="fromLabel">Choose a date</span>
100
+ <span slot="bib.fullscreen.dateLabel">Choose a date</span>
101
+ </auro-datepicker>
102
+ ```
103
+ <!-- AURO-GENERATED-CONTENT:END -->
104
+ </auro-accordion>
105
+
20
106
  ### Basic
21
107
 
22
108
  <div class="exampleWrapper">
23
109
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/basic.html) -->
24
110
  <!-- The below content is automatically added from ./../apiExamples/basic.html -->
25
- <auro-datepicker>
111
+ <auro-datepicker required="">
112
+ <span slot="ariaLabel.bib.close">Close Calendar</span>
26
113
  <span slot="bib.fullscreen.headline">Datepicker Headline</span>
27
114
  <span slot="fromLabel">Choose a date</span>
28
115
  <span slot="bib.fullscreen.dateLabel">Choose a date</span>
@@ -33,6 +120,7 @@ The `<auro-datepicker>` element should be used in situations where users may:
33
120
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/onDark.html) -->
34
121
  <!-- The below content is automatically added from ./../apiExamples/onDark.html -->
35
122
  <auro-datepicker onDark>
123
+ <span slot="ariaLabel.bib.close">Close Calendar</span>
36
124
  <span slot="bib.fullscreen.headline">Datepicker Headline</span>
37
125
  <span slot="fromLabel">Choose a date</span>
38
126
  <span slot="bib.fullscreen.dateLabel">Choose a date</span>
@@ -45,7 +133,8 @@ The `<auro-datepicker>` element should be used in situations where users may:
45
133
  <!-- The below code snippet is automatically added from ./../apiExamples/basic.html -->
46
134
 
47
135
  ```html
48
- <auro-datepicker>
136
+ <auro-datepicker required="">
137
+ <span slot="ariaLabel.bib.close">Close Calendar</span>
49
138
  <span slot="bib.fullscreen.headline">Datepicker Headline</span>
50
139
  <span slot="fromLabel">Choose a date</span>
51
140
  <span slot="bib.fullscreen.dateLabel">Choose a date</span>
@@ -55,6 +144,7 @@ The `<auro-datepicker>` element should be used in situations where users may:
55
144
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/onDark.html) -->
56
145
  <!-- The below content is automatically added from ./../apiExamples/onDark.html -->
57
146
  <auro-datepicker onDark>
147
+ <span slot="ariaLabel.bib.close">Close Calendar</span>
58
148
  <span slot="bib.fullscreen.headline">Datepicker Headline</span>
59
149
  <span slot="fromLabel">Choose a date</span>
60
150
  <span slot="bib.fullscreen.dateLabel">Choose a date</span>
@@ -67,7 +157,8 @@ The `<auro-datepicker>` element should be used in situations where users may:
67
157
  <div class="exampleWrapper">
68
158
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/basicRange.html) -->
69
159
  <!-- The below content is automatically added from ./../apiExamples/basicRange.html -->
70
- <auro-datepicker range>
160
+ <auro-datepicker range minDate="07/08/2025">
161
+ <span slot="ariaLabel.bib.close">Close Calendar</span>
71
162
  <span slot="bib.fullscreen.headline">Datepicker Range Headline</span>
72
163
  <span slot="fromLabel">Departure</span>
73
164
  <span slot="toLabel">Return</span>
@@ -92,7 +183,8 @@ The `<auro-datepicker>` element should be used in situations where users may:
92
183
  <!-- The below code snippet is automatically added from ./../apiExamples/basicRange.html -->
93
184
 
94
185
  ```html
95
- <auro-datepicker range>
186
+ <auro-datepicker range minDate="07/08/2025">
187
+ <span slot="ariaLabel.bib.close">Close Calendar</span>
96
188
  <span slot="bib.fullscreen.headline">Datepicker Range Headline</span>
97
189
  <span slot="fromLabel">Departure</span>
98
190
  <span slot="toLabel">Return</span>