@aurodesignsystem/auro-formkit 5.2.2 → 5.3.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 (54) hide show
  1. package/CHANGELOG.md +10 -3
  2. package/components/bibtemplate/dist/buttonVersion.d.ts +1 -1
  3. package/components/bibtemplate/dist/index.js +18 -83
  4. package/components/bibtemplate/dist/registered.js +18 -83
  5. package/components/checkbox/demo/api.min.js +14 -3
  6. package/components/checkbox/demo/index.min.js +14 -3
  7. package/components/checkbox/dist/index.js +14 -3
  8. package/components/checkbox/dist/registered.js +14 -3
  9. package/components/combobox/demo/api.js +2 -0
  10. package/components/combobox/demo/api.md +117 -3
  11. package/components/combobox/demo/api.min.js +445 -343
  12. package/components/combobox/demo/index.min.js +348 -265
  13. package/components/combobox/dist/auro-combobox.d.ts +18 -0
  14. package/components/combobox/dist/index.js +275 -212
  15. package/components/combobox/dist/registered.js +275 -212
  16. package/components/counter/demo/api.md +29 -1
  17. package/components/counter/demo/api.min.js +264 -240
  18. package/components/counter/demo/index.min.js +264 -240
  19. package/components/counter/dist/auro-counter-group.d.ts +9 -0
  20. package/components/counter/dist/index.js +183 -176
  21. package/components/counter/dist/registered.js +183 -176
  22. package/components/datepicker/demo/api.md +23 -1
  23. package/components/datepicker/demo/api.min.js +420 -447
  24. package/components/datepicker/demo/index.min.js +420 -447
  25. package/components/datepicker/dist/auro-datepicker.d.ts +9 -0
  26. package/components/datepicker/dist/buttonVersion.d.ts +1 -1
  27. package/components/datepicker/dist/index.js +241 -279
  28. package/components/datepicker/dist/registered.js +241 -279
  29. package/components/dropdown/demo/api.md +46 -2
  30. package/components/dropdown/demo/api.min.js +148 -16
  31. package/components/dropdown/demo/index.min.js +148 -16
  32. package/components/dropdown/dist/auro-dropdown.d.ts +12 -0
  33. package/components/dropdown/dist/index.js +118 -3
  34. package/components/dropdown/dist/registered.js +118 -3
  35. package/components/input/demo/api.min.js +35 -89
  36. package/components/input/demo/index.min.js +35 -89
  37. package/components/input/dist/buttonVersion.d.ts +1 -1
  38. package/components/input/dist/index.js +35 -89
  39. package/components/input/dist/registered.js +35 -89
  40. package/components/menu/demo/api.min.js +11 -2
  41. package/components/menu/demo/index.min.js +11 -2
  42. package/components/menu/dist/index.js +11 -2
  43. package/components/menu/dist/registered.js +11 -2
  44. package/components/radio/demo/api.min.js +18 -7
  45. package/components/radio/demo/index.min.js +18 -7
  46. package/components/radio/dist/index.js +18 -7
  47. package/components/radio/dist/registered.js +18 -7
  48. package/components/select/demo/api.md +29 -1
  49. package/components/select/demo/api.min.js +269 -150
  50. package/components/select/demo/index.min.js +269 -150
  51. package/components/select/dist/auro-select.d.ts +11 -0
  52. package/components/select/dist/index.js +199 -106
  53. package/components/select/dist/registered.js +199 -106
  54. package/package.json +5 -5
package/components/select/demo/api.md CHANGED
@@ -40,6 +40,7 @@ The auro-select element is a wrapper for auro-dropdown and auro-menu to create a
40
40
  | [setCustomValidity](#setCustomValidity) | `setCustomValidity` | `string` | | Sets a custom help text message to display for all validityStates. |
41
41
  | [setCustomValidityCustomError](#setCustomValidityCustomError) | `setCustomValidityCustomError` | `string` | | Custom help text message to display when validity = `customError`. |
42
42
  | [setCustomValidityValueMissing](#setCustomValidityValueMissing) | `setCustomValidityValueMissing` | `string` | | Custom help text message to display when validity = `valueMissing`. |
43
+ | [shift](#shift) | `shift` | `boolean` | "false" | If set, the dropdown will shift its position to avoid being cut off by the viewport. |
43
44
  | [validity](#validity) | `validity` | `string` | | Specifies the `validityState` this element is in. |
44
45
  | [value](#value) | `value` | `string` | | Value selected for the component. |
45
46
 
@@ -1130,12 +1131,13 @@ The label for selected option can be customized using `displayValue` slot under
1130
1131
  </auro-accordion>
1131
1132
 
1132
1133
  ### Customized bib position
1133
- The bib position can be customized with `placement`, `offset`, `flip`, `autoPlacement` attributes.
1134
+ The bib position can be customized with `placement`, `offset`, `flip`, `autoPlacement`, and `shift` attributes.
1134
1135
 
1135
1136
  - `placement` specifies the preferred position where the bib should appear relative to the trigger.
1136
1137
  - `offset` sets the distance between the trigger and the bib.
1137
1138
  - When `autoPlacement` is enabled, smart positioning logic is applied to determine the best placement for the bib. If all sides have sufficient space, the bib will appear in the position specified by `placement`.
1138
1139
  - Unless `noFlip` is enabled, if there isn't enough space for the preferred `placement`, the bib will automatically flip to an alternative position.
1140
+ - `shift` when enabled, adjusts the bib position when it would overflow the viewport boundaries, ensuring it remains visible.
1139
1141
 
1140
1142
  <div class="exampleWrapper">
1141
1143
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/floaterConfig.html) -->
@@ -1180,6 +1182,19 @@ The bib position can be customized with `placement`, `offset`, `flip`, `autoPlac
1180
1182
  <auro-menuoption value="prefer alaska">Prefer Alaska</auro-menuoption>
1181
1183
  </auro-menu>
1182
1184
  </auro-select>
1185
+ <auro-select width="350px" offset="20" noFlip placement="bottom-start" shift noFlip >
1186
+ <span slot="bib.fullscreen.headline">Bib Headline</span>
1187
+ <span slot="label">Label</span>
1188
+ <span slot="helpText">bottom-start bib with 20px offset, noFlip and shift</span>
1189
+ <auro-menu>
1190
+ <auro-menuoption value="stops">Stops</auro-menuoption>
1191
+ <auro-menuoption value="price">Price</auro-menuoption>
1192
+ <auro-menuoption value="duration">Duration</auro-menuoption>
1193
+ <auro-menuoption value="departure">Departure</auro-menuoption>
1194
+ <auro-menuoption value="arrival">Arrival</auro-menuoption>
1195
+ <auro-menuoption value="prefer alaska">Prefer Alaska</auro-menuoption>
1196
+ </auro-menu>
1197
+ </auro-select>
1183
1198
  </div>
1184
1199
  <!-- AURO-GENERATED-CONTENT:END -->
1185
1200
  </div>
@@ -1229,6 +1244,19 @@ The bib position can be customized with `placement`, `offset`, `flip`, `autoPlac
1229
1244
  <auro-menuoption value="prefer alaska">Prefer Alaska</auro-menuoption>
1230
1245
  </auro-menu>
1231
1246
  </auro-select>
1247
+ <auro-select width="350px" offset="20" noFlip placement="bottom-start" shift noFlip >
1248
+ <span slot="bib.fullscreen.headline">Bib Headline</span>
1249
+ <span slot="label">Label</span>
1250
+ <span slot="helpText">bottom-start bib with 20px offset, noFlip and shift</span>
1251
+ <auro-menu>
1252
+ <auro-menuoption value="stops">Stops</auro-menuoption>
1253
+ <auro-menuoption value="price">Price</auro-menuoption>
1254
+ <auro-menuoption value="duration">Duration</auro-menuoption>
1255
+ <auro-menuoption value="departure">Departure</auro-menuoption>
1256
+ <auro-menuoption value="arrival">Arrival</auro-menuoption>
1257
+ <auro-menuoption value="prefer alaska">Prefer Alaska</auro-menuoption>
1258
+ </auro-menu>
1259
+ </auro-select>
1232
1260
  </div>
1233
1261
  ```
1234
1262
  <!-- AURO-GENERATED-CONTENT:END -->