@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.
- package/components/bibtemplate/dist/auro-bibtemplate.d.ts +6 -0
- package/components/bibtemplate/dist/index.js +25 -1
- package/components/bibtemplate/dist/registered.js +25 -1
- package/components/checkbox/demo/api.html +16 -10
- package/components/checkbox/demo/api.min.js +23 -16
- package/components/checkbox/demo/index.html +16 -10
- package/components/checkbox/demo/index.min.js +23 -16
- package/components/checkbox/demo/readme.html +16 -9
- package/components/checkbox/dist/index.js +23 -16
- package/components/checkbox/dist/registered.js +23 -16
- package/components/combobox/demo/api.html +16 -10
- package/components/combobox/demo/api.md +12 -6
- package/components/combobox/demo/api.min.js +442 -148
- package/components/combobox/demo/index.html +16 -10
- package/components/combobox/demo/index.min.js +442 -148
- package/components/combobox/demo/readme.html +16 -9
- package/components/combobox/dist/index.js +405 -136
- package/components/combobox/dist/registered.js +405 -136
- package/components/counter/demo/api.html +17 -10
- package/components/counter/demo/api.md +140 -7
- package/components/counter/demo/api.min.js +1171 -1016
- package/components/counter/demo/index.html +17 -10
- package/components/counter/demo/index.md +86 -0
- package/components/counter/demo/index.min.js +1171 -1016
- package/components/counter/demo/readme.html +16 -9
- package/components/counter/dist/auro-counter-group.d.ts +64 -23
- package/components/counter/dist/auro-counter.d.ts +10 -0
- package/components/counter/dist/index.js +1171 -1016
- package/components/counter/dist/registered.js +1171 -1016
- package/components/datepicker/demo/api.html +16 -10
- package/components/datepicker/demo/api.min.js +403 -123
- package/components/datepicker/demo/index.html +16 -10
- package/components/datepicker/demo/index.min.js +403 -123
- package/components/datepicker/demo/readme.html +16 -9
- package/components/datepicker/dist/auro-datepicker.d.ts +6 -0
- package/components/datepicker/dist/index.js +403 -123
- package/components/datepicker/dist/registered.js +403 -123
- package/components/dropdown/demo/api.html +16 -10
- package/components/dropdown/demo/api.md +77 -269
- package/components/dropdown/demo/api.min.js +336 -96
- package/components/dropdown/demo/index.html +16 -10
- package/components/dropdown/demo/index.md +45 -363
- package/components/dropdown/demo/index.min.js +336 -96
- package/components/dropdown/demo/readme.html +16 -9
- package/components/dropdown/dist/auro-dropdown.d.ts +35 -67
- package/components/dropdown/dist/auro-dropdownBib.d.ts +0 -6
- package/components/dropdown/dist/index.js +336 -96
- package/components/dropdown/dist/registered.js +336 -96
- package/components/form/demo/api.html +16 -9
- package/components/form/demo/autocomplete.html +19 -3
- package/components/form/demo/index.html +16 -9
- package/components/form/demo/readme.html +16 -9
- package/components/form/demo/working.html +19 -13
- package/components/helptext/dist/index.js +1 -1
- package/components/helptext/dist/registered.js +1 -1
- package/components/input/demo/api.html +16 -10
- package/components/input/demo/api.md +1 -1
- package/components/input/demo/api.min.js +14 -14
- package/components/input/demo/index.html +16 -10
- package/components/input/demo/index.min.js +14 -14
- package/components/input/demo/readme.html +16 -9
- package/components/input/dist/base-input.d.ts +1 -1
- package/components/input/dist/index.js +14 -14
- package/components/input/dist/registered.js +14 -14
- package/components/menu/demo/api.html +16 -32
- package/components/menu/demo/api.md +1 -1
- package/components/menu/demo/api.min.js +37 -12
- package/components/menu/demo/index.html +16 -10
- package/components/menu/demo/index.min.js +37 -12
- package/components/menu/demo/readme.html +16 -9
- package/components/menu/dist/auro-menu.d.ts +13 -2
- package/components/menu/dist/index.js +37 -12
- package/components/menu/dist/registered.js +37 -12
- package/components/radio/demo/api.html +16 -10
- package/components/radio/demo/api.md +0 -1
- package/components/radio/demo/api.min.js +61 -76
- package/components/radio/demo/index.html +16 -10
- package/components/radio/demo/index.min.js +61 -76
- package/components/radio/demo/readme.html +16 -9
- package/components/radio/dist/auro-radio.d.ts +8 -11
- package/components/radio/dist/index.js +61 -76
- package/components/radio/dist/registered.js +61 -76
- package/components/select/demo/api.html +16 -10
- package/components/select/demo/api.js +0 -2
- package/components/select/demo/api.md +53 -51
- package/components/select/demo/api.min.js +520 -358
- package/components/select/demo/index.html +16 -11
- package/components/select/demo/index.md +6 -158
- package/components/select/demo/index.min.js +520 -346
- package/components/select/demo/readme.html +16 -9
- package/components/select/dist/auro-select.d.ts +33 -8
- package/components/select/dist/index.js +483 -334
- package/components/select/dist/registered.js +483 -334
- 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
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/design-tokens@latest/dist/auro-classic/CSSCustomProperties.css"
|
|
26
|
-
|
|
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
|
-
|
|
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>
|