@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
package/components/select/demo/index.html CHANGED
@@ -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 Generator | auro-select 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-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
- <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/@aurodesignsystem/webcorestylesheets@latest/dist/bundled/essentials-as.css" />
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
 
package/components/select/demo/index.md CHANGED
@@ -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
- <div class="exampleWrapper">
221
- <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/snowflake/basic.html) -->
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 -->