@aurodesignsystem-dev/auro-formkit 0.0.0-pr740.9 → 0.0.0-pr750.0

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 (94) hide show
  1. package/components/bibtemplate/dist/auro-bibtemplate.d.ts +6 -0
  2. package/components/bibtemplate/dist/index.js +25 -1
  3. package/components/bibtemplate/dist/registered.js +25 -1
  4. package/components/checkbox/demo/api.html +16 -10
  5. package/components/checkbox/demo/api.min.js +23 -16
  6. package/components/checkbox/demo/index.html +16 -10
  7. package/components/checkbox/demo/index.min.js +23 -16
  8. package/components/checkbox/demo/readme.html +16 -9
  9. package/components/checkbox/dist/index.js +23 -16
  10. package/components/checkbox/dist/registered.js +23 -16
  11. package/components/combobox/demo/api.html +16 -10
  12. package/components/combobox/demo/api.md +12 -6
  13. package/components/combobox/demo/api.min.js +442 -148
  14. package/components/combobox/demo/index.html +16 -10
  15. package/components/combobox/demo/index.min.js +442 -148
  16. package/components/combobox/demo/readme.html +16 -9
  17. package/components/combobox/dist/index.js +405 -136
  18. package/components/combobox/dist/registered.js +405 -136
  19. package/components/counter/demo/api.html +17 -10
  20. package/components/counter/demo/api.md +140 -7
  21. package/components/counter/demo/api.min.js +1171 -1016
  22. package/components/counter/demo/index.html +17 -10
  23. package/components/counter/demo/index.md +86 -0
  24. package/components/counter/demo/index.min.js +1171 -1016
  25. package/components/counter/demo/readme.html +16 -9
  26. package/components/counter/dist/auro-counter-group.d.ts +64 -23
  27. package/components/counter/dist/auro-counter.d.ts +10 -0
  28. package/components/counter/dist/index.js +1171 -1016
  29. package/components/counter/dist/registered.js +1171 -1016
  30. package/components/datepicker/demo/api.html +16 -10
  31. package/components/datepicker/demo/api.min.js +403 -123
  32. package/components/datepicker/demo/index.html +16 -10
  33. package/components/datepicker/demo/index.min.js +403 -123
  34. package/components/datepicker/demo/readme.html +16 -9
  35. package/components/datepicker/dist/auro-datepicker.d.ts +6 -0
  36. package/components/datepicker/dist/index.js +403 -123
  37. package/components/datepicker/dist/registered.js +403 -123
  38. package/components/dropdown/demo/api.html +16 -10
  39. package/components/dropdown/demo/api.md +77 -269
  40. package/components/dropdown/demo/api.min.js +336 -96
  41. package/components/dropdown/demo/index.html +16 -10
  42. package/components/dropdown/demo/index.md +45 -363
  43. package/components/dropdown/demo/index.min.js +336 -96
  44. package/components/dropdown/demo/readme.html +16 -9
  45. package/components/dropdown/dist/auro-dropdown.d.ts +35 -67
  46. package/components/dropdown/dist/auro-dropdownBib.d.ts +0 -6
  47. package/components/dropdown/dist/index.js +336 -96
  48. package/components/dropdown/dist/registered.js +336 -96
  49. package/components/form/demo/api.html +16 -9
  50. package/components/form/demo/autocomplete.html +19 -3
  51. package/components/form/demo/index.html +16 -9
  52. package/components/form/demo/readme.html +16 -9
  53. package/components/form/demo/working.html +19 -13
  54. package/components/helptext/dist/index.js +1 -1
  55. package/components/helptext/dist/registered.js +1 -1
  56. package/components/input/demo/api.html +16 -10
  57. package/components/input/demo/api.md +1 -1
  58. package/components/input/demo/api.min.js +14 -14
  59. package/components/input/demo/index.html +16 -10
  60. package/components/input/demo/index.min.js +14 -14
  61. package/components/input/demo/readme.html +16 -9
  62. package/components/input/dist/base-input.d.ts +1 -1
  63. package/components/input/dist/index.js +14 -14
  64. package/components/input/dist/registered.js +14 -14
  65. package/components/menu/demo/api.html +16 -32
  66. package/components/menu/demo/api.md +1 -1
  67. package/components/menu/demo/api.min.js +37 -12
  68. package/components/menu/demo/index.html +16 -10
  69. package/components/menu/demo/index.min.js +37 -12
  70. package/components/menu/demo/readme.html +16 -9
  71. package/components/menu/dist/auro-menu.d.ts +13 -2
  72. package/components/menu/dist/index.js +37 -12
  73. package/components/menu/dist/registered.js +37 -12
  74. package/components/radio/demo/api.html +16 -10
  75. package/components/radio/demo/api.md +0 -1
  76. package/components/radio/demo/api.min.js +61 -76
  77. package/components/radio/demo/index.html +16 -10
  78. package/components/radio/demo/index.min.js +61 -76
  79. package/components/radio/demo/readme.html +16 -9
  80. package/components/radio/dist/auro-radio.d.ts +8 -11
  81. package/components/radio/dist/index.js +61 -76
  82. package/components/radio/dist/registered.js +61 -76
  83. package/components/select/demo/api.html +16 -10
  84. package/components/select/demo/api.js +0 -2
  85. package/components/select/demo/api.md +53 -51
  86. package/components/select/demo/api.min.js +520 -358
  87. package/components/select/demo/index.html +16 -11
  88. package/components/select/demo/index.md +6 -158
  89. package/components/select/demo/index.min.js +520 -346
  90. package/components/select/demo/readme.html +16 -9
  91. package/components/select/dist/auro-select.d.ts +33 -8
  92. package/components/select/dist/index.js +483 -334
  93. package/components/select/dist/registered.js +483 -334
  94. package/package.json +26 -25
@@ -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-counter 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-counter</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-counter'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
 
@@ -50,5 +56,6 @@
50
56
  <!-- If additional elements are needed for the demo, add them here. -->
51
57
  <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-accordion@latest/dist/auro-accordion__bundled.js" type="module"></script>
52
58
  <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-button@latest/dist/auro-button__bundled.js" type="module"></script>
59
+ <script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-icon@latest/dist/auro-icon__bundled.js" type="module"></script>
53
60
  </body>
54
61
  </html>
@@ -97,6 +97,88 @@ Adding a description provides additional context to users. The description appea
97
97
  <!-- AURO-GENERATED-CONTENT:END -->
98
98
  </auro-accordion>
99
99
 
100
+ ### Counter with Help Text
101
+
102
+ Help text is supported with counters, and can be added by targetting the `helptext` slot.
103
+
104
+ <div class="exampleWrapper">
105
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/counter-helptext.html) -->
106
+ <!-- The below content is automatically added from ./../apiExamples/counter-helptext.html -->
107
+ <auro-counter>
108
+ Adults
109
+ <span slot="helptext">This is help text for the counter</span>
110
+ </auro-counter>
111
+ <!-- AURO-GENERATED-CONTENT:END -->
112
+ </div>
113
+ <div class="exampleWrapper--ondark" aria-hidden>
114
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/ondark-counter-helptext.html) -->
115
+ <!-- The below content is automatically added from ./../apiExamples/ondark-counter-helptext.html -->
116
+ <auro-counter ondark>
117
+ Adults
118
+ <span slot="helptext">This is help text for the counter</span>
119
+ </auro-counter>
120
+ <!-- AURO-GENERATED-CONTENT:END -->
121
+ </div>
122
+ <auro-accordion alignRight>
123
+ <span slot="trigger">See code</span>
124
+ <!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/counter-helptext.html) -->
125
+ <!-- The below code snippet is automatically added from ./../apiExamples/counter-helptext.html -->
126
+
127
+ ```html
128
+ <auro-counter>
129
+ Adults
130
+ <span slot="helptext">This is help text for the counter</span>
131
+ </auro-counter>
132
+ ```
133
+ <!-- AURO-GENERATED-CONTENT:END -->
134
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/ondark-counter-helptext.html) -->
135
+ <!-- The below content is automatically added from ./../apiExamples/ondark-counter-helptext.html -->
136
+ <auro-counter ondark>
137
+ Adults
138
+ <span slot="helptext">This is help text for the counter</span>
139
+ </auro-counter>
140
+ <!-- AURO-GENERATED-CONTENT:END -->
141
+ </auro-accordion>
142
+
143
+ ### Counter with Custom Error
144
+
145
+ A custom error can be set on the counter by adding the `error` attribute with the desired message.
146
+
147
+ <div class="exampleWrapper">
148
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/counter-error.html) -->
149
+ <!-- The below content is automatically added from ./../apiExamples/counter-error.html -->
150
+ <auro-counter error="There is an error with the counter">
151
+ Adults
152
+ </auro-counter>
153
+ <!-- AURO-GENERATED-CONTENT:END -->
154
+ </div>
155
+ <div class="exampleWrapper--ondark" aria-hidden>
156
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/ondark-counter-error.html) -->
157
+ <!-- The below content is automatically added from ./../apiExamples/ondark-counter-error.html -->
158
+ <auro-counter ondark error="There is an error with the counter">
159
+ Adults
160
+ </auro-counter>
161
+ <!-- AURO-GENERATED-CONTENT:END -->
162
+ </div>
163
+ <auro-accordion alignRight>
164
+ <span slot="trigger">See code</span>
165
+ <!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/counter-error.html) -->
166
+ <!-- The below code snippet is automatically added from ./../apiExamples/counter-error.html -->
167
+
168
+ ```html
169
+ <auro-counter error="There is an error with the counter">
170
+ Adults
171
+ </auro-counter>
172
+ ```
173
+ <!-- AURO-GENERATED-CONTENT:END -->
174
+ <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/ondark-counter-error.html) -->
175
+ <!-- The below content is automatically added from ./../apiExamples/ondark-counter-error.html -->
176
+ <auro-counter ondark error="There is an error with the counter">
177
+ Adults
178
+ </auro-counter>
179
+ <!-- AURO-GENERATED-CONTENT:END -->
180
+ </auro-accordion>
181
+
100
182
  ### Basic Counter Group
101
183
 
102
184
  Counter groups allow you to manage multiple related counters together. This is useful when you need to collect multiple quantities that are related, such as different passenger types:
@@ -214,6 +296,7 @@ When using a dropdown, an additional layout, `snowflake`, is available for use:
214
296
  <!-- Example of counter-group properties -->
215
297
  <auro-counter-group max="10" min="2" isDropdown layout="snowflake">
216
298
  <div slot="bib.fullscreen.headline">Group fullscreen label</div>
299
+ <auro-icon slot="typeIcon" category="interface" name="account-stroke" customColor></auro-icon>
217
300
  <div slot="label">Snowflake Dropdown Group</div>
218
301
  <div slot="helpText">Total must be between 2-10</div>
219
302
  <auro-counter>
@@ -231,6 +314,7 @@ When using a dropdown, an additional layout, `snowflake`, is available for use:
231
314
  <!-- Example of counter-group properties -->
232
315
  <auro-counter-group max="10" min="2" isDropdown layout="snowflake" ondark>
233
316
  <div slot="bib.fullscreen.headline">Group fullscreen label</div>
317
+ <auro-icon slot="typeIcon" category="interface" name="account-stroke" customColor></auro-icon>
234
318
  <div slot="label">Snowflake Dropdown Group</div>
235
319
  <div slot="helpText">Total must be between 2-10</div>
236
320
  <auro-counter>
@@ -281,6 +365,7 @@ When using a dropdown, an additional layout, `snowflake`, is available for use:
281
365
  <!-- Example of counter-group properties -->
282
366
  <auro-counter-group max="10" min="2" isDropdown layout="snowflake">
283
367
  <div slot="bib.fullscreen.headline">Group fullscreen label</div>
368
+ <auro-icon slot="typeIcon" category="interface" name="account-stroke" customColor></auro-icon>
284
369
  <div slot="label">Snowflake Dropdown Group</div>
285
370
  <div slot="helpText">Total must be between 2-10</div>
286
371
  <auro-counter>
@@ -296,6 +381,7 @@ When using a dropdown, an additional layout, `snowflake`, is available for use:
296
381
  <!-- Example of counter-group properties -->
297
382
  <auro-counter-group max="10" min="2" isDropdown layout="snowflake" ondark>
298
383
  <div slot="bib.fullscreen.headline">Group fullscreen label</div>
384
+ <auro-icon slot="typeIcon" category="interface" name="account-stroke" customColor></auro-icon>
299
385
  <div slot="label">Snowflake Dropdown Group</div>
300
386
  <div slot="helpText">Total must be between 2-10</div>
301
387
  <auro-counter>