@aurodesignsystem-dev/auro-formkit 0.0.0-pr741.0 → 0.0.0-pr750.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.
- package/components/bibtemplate/dist/index.js +1 -1
- package/components/bibtemplate/dist/registered.js +1 -1
- package/components/checkbox/demo/api.html +16 -10
- package/components/checkbox/demo/api.min.js +11 -11
- package/components/checkbox/demo/index.html +16 -10
- package/components/checkbox/demo/index.min.js +11 -11
- package/components/checkbox/demo/readme.html +16 -9
- package/components/checkbox/dist/index.js +11 -11
- package/components/checkbox/dist/registered.js +11 -11
- package/components/combobox/demo/api.html +16 -10
- package/components/combobox/demo/api.md +12 -6
- package/components/combobox/demo/api.min.js +411 -103
- package/components/combobox/demo/index.html +16 -10
- package/components/combobox/demo/index.min.js +411 -103
- package/components/combobox/demo/readme.html +16 -9
- package/components/combobox/dist/index.js +374 -91
- package/components/combobox/dist/registered.js +374 -91
- package/components/counter/demo/api.html +16 -10
- package/components/counter/demo/api.md +140 -7
- package/components/counter/demo/api.min.js +1145 -987
- package/components/counter/demo/index.html +16 -10
- package/components/counter/demo/index.md +82 -0
- package/components/counter/demo/index.min.js +1145 -987
- 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 +1145 -987
- package/components/counter/dist/registered.js +1145 -987
- package/components/datepicker/demo/api.html +16 -10
- package/components/datepicker/demo/api.min.js +374 -91
- package/components/datepicker/demo/index.html +16 -10
- package/components/datepicker/demo/index.min.js +374 -91
- package/components/datepicker/demo/readme.html +16 -9
- package/components/datepicker/dist/auro-datepicker.d.ts +6 -0
- package/components/datepicker/dist/index.js +374 -91
- package/components/datepicker/dist/registered.js +374 -91
- package/components/dropdown/demo/api.html +16 -10
- package/components/dropdown/demo/api.md +77 -267
- package/components/dropdown/demo/api.min.js +331 -64
- package/components/dropdown/demo/index.html +16 -10
- package/components/dropdown/demo/index.md +45 -363
- package/components/dropdown/demo/index.min.js +331 -64
- package/components/dropdown/demo/readme.html +16 -9
- package/components/dropdown/dist/auro-dropdown.d.ts +35 -67
- package/components/dropdown/dist/index.js +331 -64
- package/components/dropdown/dist/registered.js +331 -64
- 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 +491 -326
- package/components/select/demo/index.html +16 -11
- package/components/select/demo/index.md +6 -158
- package/components/select/demo/index.min.js +491 -314
- package/components/select/demo/readme.html +16 -9
- package/components/select/dist/auro-select.d.ts +33 -8
- package/components/select/dist/index.js +454 -302
- package/components/select/dist/registered.js +454 -302
- package/package.json +26 -25
|
@@ -16,19 +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-select</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-select'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
|
-
<script src="https://cdn.jsdelivr.net/npm/@aurodesignsystem/auro-icon@8.0.3/dist/auro-icon__bundled.js" type="module"></script>
|
|
31
|
-
</head>
|
|
36
|
+
</head>
|
|
32
37
|
<body class="auro-markdown">
|
|
33
38
|
<main></main>
|
|
34
39
|
|
|
@@ -22,7 +22,7 @@ A baseline `<auro-select>` using `<auro-menu>` and `<auro-menuoption>` elements.
|
|
|
22
22
|
<!-- The below content is automatically added from ./../apiExamples/classic/basic.html -->
|
|
23
23
|
<auro-select placeholder="Placeholder content">
|
|
24
24
|
<span slot="bib.fullscreen.headline">Bib Header</span>
|
|
25
|
-
<span slot="label">Name</span>
|
|
25
|
+
<span slot="label">Name with placeholder</span>
|
|
26
26
|
<auro-menu>
|
|
27
27
|
<auro-menuoption value="Apples" id="option-0">Apples</auro-menuoption>
|
|
28
28
|
<auro-menuoption value="Oranges" id="option-1">Oranges</auro-menuoption>
|
|
@@ -56,86 +56,10 @@ A baseline `<auro-select>` using `<auro-menu>` and `<auro-menuoption>` elements.
|
|
|
56
56
|
<!-- AURO-GENERATED-CONTENT:END -->
|
|
57
57
|
</div>
|
|
58
58
|
|
|
59
|
-
### Emphasized
|
|
59
|
+
### Emphasized
|
|
60
|
+
|
|
61
|
+
Only supported for onDark usage.
|
|
60
62
|
|
|
61
|
-
<div class="exampleWrapper">
|
|
62
|
-
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/emphasized/basic.html) -->
|
|
63
|
-
<!-- The below content is automatically added from ./../apiExamples/emphasized/basic.html -->
|
|
64
|
-
<div style="display: flex; flex-direction: row; gap: 10px;">
|
|
65
|
-
<auro-select layout="emphasized" shape="pill" size="xl" value="flights" forceDisplayValue style="display:inline-block;">
|
|
66
|
-
<span slot="label">Select Example</span>
|
|
67
|
-
<auro-menu nocheckmark>
|
|
68
|
-
<auro-menuoption value="flights">
|
|
69
|
-
<auro-icon category="terminal" name="plane-diag-stroke" customcolor></auro-icon> Flights
|
|
70
|
-
<auro-icon style="--ds-auro-icon-size: 40px;" slot="displayValue" category="terminal" name="plane-diag-fill" customcolor></auro-icon>
|
|
71
|
-
</auro-menuoption>
|
|
72
|
-
<auro-menuoption value="cars">
|
|
73
|
-
<auro-icon category="destination" name="car-rental-stroke" customcolor></auro-icon> Cars
|
|
74
|
-
<auro-icon style="--ds-auro-icon-size: 40px;" slot="displayValue" category="destination" name="car-rental-stroke" customcolor></auro-icon>
|
|
75
|
-
</auro-menuoption>
|
|
76
|
-
<auro-menuoption value="hotels">
|
|
77
|
-
<auro-icon category="destination" name="hotel-stroke" customcolor></auro-icon> Hotels
|
|
78
|
-
<auro-icon style="--ds-auro-icon-size: 40px;" slot="displayValue" category="destination" name="hotel-filled" customcolor></auro-icon>
|
|
79
|
-
</auro-menuoption>
|
|
80
|
-
<auro-menuoption value="packages">
|
|
81
|
-
<auro-icon category="shop" name="gift-stroke" customcolor></auro-icon> Packages
|
|
82
|
-
<auro-icon style="--ds-auro-icon-size: 40px;" slot="displayValue" category="shop" name="gift-filled" customcolor></auro-icon>
|
|
83
|
-
</auro-menuoption>
|
|
84
|
-
<auro-menuoption value="cruises">
|
|
85
|
-
<auro-icon category="in-flight" name="boarding" customcolor></auro-icon> Cruises
|
|
86
|
-
<auro-icon style="--ds-auro-icon-size: 40px;" slot="displayValue" category="in-flight" name="boarding" customcolor></auro-icon>
|
|
87
|
-
</auro-menuoption>
|
|
88
|
-
</auro-menu>
|
|
89
|
-
</auro-select>
|
|
90
|
-
<auro-select layout="emphasized" shape="pill" size="xl" value="flights" style="display:inline-block;">
|
|
91
|
-
<span slot="label">Select Example</span>
|
|
92
|
-
<auro-menu nocheckmark>
|
|
93
|
-
<auro-menuoption value="flights">
|
|
94
|
-
<auro-icon category="terminal" name="plane-diag-stroke" customcolor></auro-icon> Flights
|
|
95
|
-
<auro-icon style="--ds-auro-icon-size: 40px;" slot="displayValue" category="terminal" name="plane-diag-fill" customcolor></auro-icon>
|
|
96
|
-
</auro-menuoption>
|
|
97
|
-
<auro-menuoption value="cars">
|
|
98
|
-
<auro-icon category="destination" name="car-rental-stroke" customcolor></auro-icon> Cars
|
|
99
|
-
<auro-icon style="--ds-auro-icon-size: 40px;" slot="displayValue" category="destination" name="car-rental-stroke" customcolor></auro-icon>
|
|
100
|
-
</auro-menuoption>
|
|
101
|
-
<auro-menuoption value="hotels">
|
|
102
|
-
<auro-icon category="destination" name="hotel-stroke" customcolor></auro-icon> Hotels
|
|
103
|
-
<auro-icon style="--ds-auro-icon-size: 40px;" slot="displayValue" category="destination" name="hotel-filled" customcolor></auro-icon>
|
|
104
|
-
</auro-menuoption>
|
|
105
|
-
<auro-menuoption value="packages">
|
|
106
|
-
<auro-icon category="shop" name="gift-stroke" customcolor></auro-icon> Packages
|
|
107
|
-
<auro-icon style="--ds-auro-icon-size: 40px;" slot="displayValue" category="shop" name="gift-filled" customcolor></auro-icon>
|
|
108
|
-
</auro-menuoption>
|
|
109
|
-
<auro-menuoption value="cruises">
|
|
110
|
-
<auro-icon category="in-flight" name="boarding" customcolor></auro-icon> Cruises
|
|
111
|
-
<auro-icon style="--ds-auro-icon-size: 40px;" slot="displayValue" category="in-flight" name="boarding" customcolor></auro-icon>
|
|
112
|
-
</auro-menuoption>
|
|
113
|
-
</auro-menu>
|
|
114
|
-
</auro-select>
|
|
115
|
-
<auro-select layout="emphasized" shape="pill" size="xl" value="flights" required style="display:inline-block;">
|
|
116
|
-
<span slot="label">Select Example</span>
|
|
117
|
-
<span slot="helpText">no displayValue in menuoptions</span>
|
|
118
|
-
<auro-menu nocheckmark>
|
|
119
|
-
<auro-menuoption value="flights">
|
|
120
|
-
<auro-icon category="terminal" name="plane-diag-stroke" customcolor></auro-icon> Flights
|
|
121
|
-
</auro-menuoption>
|
|
122
|
-
<auro-menuoption value="cars">
|
|
123
|
-
<auro-icon category="destination" name="car-rental-stroke" customcolor></auro-icon> Cars
|
|
124
|
-
</auro-menuoption>
|
|
125
|
-
<auro-menuoption value="hotels">
|
|
126
|
-
<auro-icon category="destination" name="hotel-stroke" customcolor></auro-icon> Hotels
|
|
127
|
-
</auro-menuoption>
|
|
128
|
-
<auro-menuoption value="packages">
|
|
129
|
-
<auro-icon category="shop" name="gift-stroke" customcolor></auro-icon> Packages
|
|
130
|
-
</auro-menuoption>
|
|
131
|
-
<auro-menuoption value="cruises">
|
|
132
|
-
<auro-icon category="in-flight" name="boarding" customcolor></auro-icon> Cruises
|
|
133
|
-
</auro-menuoption>
|
|
134
|
-
</auro-menu>
|
|
135
|
-
</auro-select>
|
|
136
|
-
</div>
|
|
137
|
-
<!-- AURO-GENERATED-CONTENT:END -->
|
|
138
|
-
</div>
|
|
139
63
|
<div class="exampleWrapper--ondark" aria-hidden>
|
|
140
64
|
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/emphasized/basic-ondark.html) -->
|
|
141
65
|
<!-- The below content is automatically added from ./../apiExamples/emphasized/basic-ondark.html -->
|
|
@@ -217,84 +141,8 @@ A baseline `<auro-select>` using `<auro-menu>` and `<auro-menuoption>` elements.
|
|
|
217
141
|
|
|
218
142
|
### Snowflake
|
|
219
143
|
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
<!-- The below content is automatically added from ./../apiExamples/snowflake/basic.html -->
|
|
223
|
-
<div style="display: flex; flex-direction: row; gap: 10px;">
|
|
224
|
-
<auro-select placeholder="placeholder text" layout="snowflake" shape="snowflake" forceDisplayValue style="display:inline-block;">
|
|
225
|
-
<span slot="label">Select Example</span>
|
|
226
|
-
<auro-menu nocheckmark>
|
|
227
|
-
<auro-menuoption value="flights">
|
|
228
|
-
<auro-icon category="terminal" name="plane-diag-stroke" customcolor></auro-icon> Flights
|
|
229
|
-
<auro-icon style="--ds-auro-icon-size: 40px;" slot="displayValue" category="terminal" name="plane-diag-fill" customcolor></auro-icon>
|
|
230
|
-
</auro-menuoption>
|
|
231
|
-
<auro-menuoption value="cars">
|
|
232
|
-
<auro-icon category="destination" name="car-rental-stroke" customcolor></auro-icon> Cars
|
|
233
|
-
<auro-icon style="--ds-auro-icon-size: 40px;" slot="displayValue" category="destination" name="car-rental-stroke" customcolor></auro-icon>
|
|
234
|
-
</auro-menuoption>
|
|
235
|
-
<auro-menuoption value="hotels">
|
|
236
|
-
<auro-icon category="destination" name="hotel-stroke" customcolor></auro-icon> Hotels
|
|
237
|
-
<auro-icon style="--ds-auro-icon-size: 40px;" slot="displayValue" category="destination" name="hotel-filled" customcolor></auro-icon>
|
|
238
|
-
</auro-menuoption>
|
|
239
|
-
<auro-menuoption value="packages">
|
|
240
|
-
<auro-icon category="shop" name="gift-stroke" customcolor></auro-icon> Packages
|
|
241
|
-
<auro-icon style="--ds-auro-icon-size: 40px;" slot="displayValue" category="shop" name="gift-filled" customcolor></auro-icon>
|
|
242
|
-
</auro-menuoption>
|
|
243
|
-
<auro-menuoption value="cruises">
|
|
244
|
-
<auro-icon category="in-flight" name="boarding" customcolor></auro-icon> Cruises
|
|
245
|
-
<auro-icon style="--ds-auro-icon-size: 40px;" slot="displayValue" category="in-flight" name="boarding" customcolor></auro-icon>
|
|
246
|
-
</auro-menuoption>
|
|
247
|
-
</auro-menu>
|
|
248
|
-
</auro-select>
|
|
249
|
-
<auro-select layout="snowflake" shape="snowflake" value="flights" style="display:inline-block;">
|
|
250
|
-
<span slot="label">Select Example</span>
|
|
251
|
-
<auro-menu nocheckmark>
|
|
252
|
-
<auro-menuoption value="flights">
|
|
253
|
-
<auro-icon category="terminal" name="plane-diag-stroke" customcolor></auro-icon> Flights
|
|
254
|
-
<auro-icon style="--ds-auro-icon-size: 40px;" slot="displayValue" category="terminal" name="plane-diag-fill" customcolor></auro-icon>
|
|
255
|
-
</auro-menuoption>
|
|
256
|
-
<auro-menuoption value="cars">
|
|
257
|
-
<auro-icon category="destination" name="car-rental-stroke" customcolor></auro-icon> Cars
|
|
258
|
-
<auro-icon style="--ds-auro-icon-size: 40px;" slot="displayValue" category="destination" name="car-rental-stroke" customcolor></auro-icon>
|
|
259
|
-
</auro-menuoption>
|
|
260
|
-
<auro-menuoption value="hotels">
|
|
261
|
-
<auro-icon category="destination" name="hotel-stroke" customcolor></auro-icon> Hotels
|
|
262
|
-
<auro-icon style="--ds-auro-icon-size: 40px;" slot="displayValue" category="destination" name="hotel-filled" customcolor></auro-icon>
|
|
263
|
-
</auro-menuoption>
|
|
264
|
-
<auro-menuoption value="packages">
|
|
265
|
-
<auro-icon category="shop" name="gift-stroke" customcolor></auro-icon> Packages
|
|
266
|
-
<auro-icon style="--ds-auro-icon-size: 40px;" slot="displayValue" category="shop" name="gift-filled" customcolor></auro-icon>
|
|
267
|
-
</auro-menuoption>
|
|
268
|
-
<auro-menuoption value="cruises">
|
|
269
|
-
<auro-icon category="in-flight" name="boarding" customcolor></auro-icon> Cruises
|
|
270
|
-
<auro-icon style="--ds-auro-icon-size: 40px;" slot="displayValue" category="in-flight" name="boarding" customcolor></auro-icon>
|
|
271
|
-
</auro-menuoption>
|
|
272
|
-
</auro-menu>
|
|
273
|
-
</auro-select>
|
|
274
|
-
<auro-select layout="snowflake" shape="snowflake" placeholder="placeholder text" required style="display:inline-block;">
|
|
275
|
-
<span slot="label">Select Example Placeholder</span>
|
|
276
|
-
<span slot="helpText">no displayValue in menuoptions</span>
|
|
277
|
-
<auro-menu nocheckmark>
|
|
278
|
-
<auro-menuoption value="flights">
|
|
279
|
-
<auro-icon category="terminal" name="plane-diag-stroke" customcolor></auro-icon> Flights
|
|
280
|
-
</auro-menuoption>
|
|
281
|
-
<auro-menuoption value="cars">
|
|
282
|
-
<auro-icon category="destination" name="car-rental-stroke" customcolor></auro-icon> Cars
|
|
283
|
-
</auro-menuoption>
|
|
284
|
-
<auro-menuoption value="hotels">
|
|
285
|
-
<auro-icon category="destination" name="hotel-stroke" customcolor></auro-icon> Hotels
|
|
286
|
-
</auro-menuoption>
|
|
287
|
-
<auro-menuoption value="packages">
|
|
288
|
-
<auro-icon category="shop" name="gift-stroke" customcolor></auro-icon> Packages
|
|
289
|
-
</auro-menuoption>
|
|
290
|
-
<auro-menuoption value="cruises">
|
|
291
|
-
<auro-icon category="in-flight" name="boarding" customcolor></auro-icon> Cruises
|
|
292
|
-
</auro-menuoption>
|
|
293
|
-
</auro-menu>
|
|
294
|
-
</auro-select>
|
|
295
|
-
</div>
|
|
296
|
-
<!-- AURO-GENERATED-CONTENT:END -->
|
|
297
|
-
</div>
|
|
144
|
+
Only supported for onDark usage.
|
|
145
|
+
|
|
298
146
|
<div class="exampleWrapper--ondark" aria-hidden>
|
|
299
147
|
<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/snowflake/basic-ondark.html) -->
|
|
300
148
|
<!-- The below content is automatically added from ./../apiExamples/snowflake/basic-ondark.html -->
|