@aurodesignsystem/auro-formkit 2.0.1 → 2.0.3-beta.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.
Files changed (70) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/components/bibtemplate/dist/iconVersion.d.ts +1 -1
  3. package/components/bibtemplate/dist/index.js +133 -127
  4. package/components/bibtemplate/dist/registered.js +133 -127
  5. package/components/checkbox/README.md +1 -1
  6. package/components/checkbox/demo/api.min.js +29 -55
  7. package/components/checkbox/demo/index.min.js +29 -55
  8. package/components/checkbox/demo/readme.md +1 -1
  9. package/components/checkbox/dist/index.js +27 -100
  10. package/components/checkbox/dist/registered.js +27 -100
  11. package/components/combobox/README.md +1 -1
  12. package/components/combobox/demo/api.min.js +620 -596
  13. package/components/combobox/demo/index.min.js +620 -596
  14. package/components/combobox/demo/readme.md +1 -1
  15. package/components/combobox/dist/index.js +496 -565
  16. package/components/combobox/dist/registered.js +496 -565
  17. package/components/counter/README.md +1 -1
  18. package/components/counter/demo/api.min.js +450 -375
  19. package/components/counter/demo/index.min.js +450 -375
  20. package/components/counter/demo/readme.md +1 -1
  21. package/components/counter/dist/iconVersion.d.ts +1 -1
  22. package/components/counter/dist/index.js +468 -440
  23. package/components/counter/dist/registered.js +468 -440
  24. package/components/datepicker/README.md +1 -1
  25. package/components/datepicker/demo/api.min.js +582 -573
  26. package/components/datepicker/demo/index.min.js +582 -573
  27. package/components/datepicker/demo/readme.md +1 -1
  28. package/components/datepicker/dist/index.js +584 -645
  29. package/components/datepicker/dist/registered.js +584 -645
  30. package/components/dropdown/README.md +1 -1
  31. package/components/dropdown/demo/api.min.js +150 -107
  32. package/components/dropdown/demo/index.min.js +150 -107
  33. package/components/dropdown/demo/readme.md +1 -1
  34. package/components/dropdown/dist/index.js +151 -155
  35. package/components/dropdown/dist/registered.js +151 -155
  36. package/components/form/README.md +1 -1
  37. package/components/form/demo/readme.md +1 -1
  38. package/components/form/dist/index.js +4 -28
  39. package/components/form/dist/registered.js +4 -28
  40. package/components/helptext/dist/index.js +6 -30
  41. package/components/helptext/dist/registered.js +6 -30
  42. package/components/input/README.md +1 -1
  43. package/components/input/demo/api.md +46 -46
  44. package/components/input/demo/api.min.js +209 -152
  45. package/components/input/demo/index.md +6 -6
  46. package/components/input/demo/index.min.js +209 -152
  47. package/components/input/demo/readme.md +1 -1
  48. package/components/input/dist/index.js +206 -208
  49. package/components/input/dist/registered.js +206 -208
  50. package/components/menu/README.md +1 -1
  51. package/components/menu/demo/api.min.js +106 -53
  52. package/components/menu/demo/index.min.js +106 -53
  53. package/components/menu/demo/readme.md +1 -1
  54. package/components/menu/dist/iconVersion.d.ts +1 -1
  55. package/components/menu/dist/index.js +128 -122
  56. package/components/menu/dist/registered.js +128 -122
  57. package/components/radio/README.md +1 -1
  58. package/components/radio/demo/api.min.js +29 -55
  59. package/components/radio/demo/index.min.js +29 -55
  60. package/components/radio/demo/readme.md +1 -1
  61. package/components/radio/dist/index.js +27 -100
  62. package/components/radio/dist/registered.js +27 -100
  63. package/components/select/README.md +1 -1
  64. package/components/select/demo/api.min.js +417 -398
  65. package/components/select/demo/index.min.js +417 -398
  66. package/components/select/demo/readme.md +1 -1
  67. package/components/select/dist/index.js +298 -373
  68. package/components/select/dist/registered.js +298 -373
  69. package/package.json +4 -2
  70. package/packages/build-tools/src/postinstall.mjs +5 -1
package/components/input/demo/api.md CHANGED
@@ -128,7 +128,7 @@ Use the `disable` attribute to prevent the user from interacting with the input.
128
128
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=../apiExamples/disabled.html) -->
129
129
  <!-- The below content is automatically added from ../apiExamples/disabled.html -->
130
130
  <auro-input disabled bordered type="date">
131
- <slot slot="label">Arrival date</slot>
131
+ <span slot="label">Arrival date</span>
132
132
  </auro-input>
133
133
  <!-- AURO-GENERATED-CONTENT:END -->
134
134
  </div>
@@ -139,7 +139,7 @@ Use the `disable` attribute to prevent the user from interacting with the input.
139
139
 
140
140
  ```html
141
141
  <auro-input disabled bordered type="date">
142
- <slot slot="label">Arrival date</slot>
142
+ <span slot="label">Arrival date</span>
143
143
  </auro-input>
144
144
  ```
145
145
  <!-- AURO-GENERATED-CONTENT:END -->
@@ -362,8 +362,8 @@ The `setCustomValidityTooLong` attribute may optionally be used in combination w
362
362
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=../apiExamples/maxLength.html) -->
363
363
  <!-- The below content is automatically added from ../apiExamples/maxLength.html -->
364
364
  <auro-input maxlength="12" setCustomValidityTooLong="Oops! There were too many characters entered." bordered required>
365
- <slot slot="label">Voucher Code</slot>
366
- <slot slot="helptext">Please enter your 12 character voucher code.</slot>
365
+ <span slot="label">Voucher Code</span>
366
+ <span slot="helptext">Please enter your 12 character voucher code.</span>
367
367
  </auro-input>
368
368
  <!-- AURO-GENERATED-CONTENT:END -->
369
369
  </div>
@@ -374,8 +374,8 @@ The `setCustomValidityTooLong` attribute may optionally be used in combination w
374
374
 
375
375
  ```html
376
376
  <auro-input maxlength="12" setCustomValidityTooLong="Oops! There were too many characters entered." bordered required>
377
- <slot slot="label">Voucher Code</slot>
378
- <slot slot="helptext">Please enter your 12 character voucher code.</slot>
377
+ <span slot="label">Voucher Code</span>
378
+ <span slot="helptext">Please enter your 12 character voucher code.</span>
379
379
  </auro-input>
380
380
  ```
381
381
  <!-- AURO-GENERATED-CONTENT:END -->
@@ -390,8 +390,8 @@ The `setCustomValidityTooShort` attribute may optionally be used in combination
390
390
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=../apiExamples/minLength.html) -->
391
391
  <!-- The below content is automatically added from ../apiExamples/minLength.html -->
392
392
  <auro-input minlength="4" setCustomValidityTooShort="Please enter a full voucher code." bordered required>
393
- <slot slot="label">Voucher Code</slot>
394
- <slot slot="helptext">Please enter your 4 character voucher code.</slot>
393
+ <span slot="label">Voucher Code</span>
394
+ <span slot="helptext">Please enter your 4 character voucher code.</span>
395
395
  </auro-input>
396
396
  <!-- AURO-GENERATED-CONTENT:END -->
397
397
  </div>
@@ -402,8 +402,8 @@ The `setCustomValidityTooShort` attribute may optionally be used in combination
402
402
 
403
403
  ```html
404
404
  <auro-input minlength="4" setCustomValidityTooShort="Please enter a full voucher code." bordered required>
405
- <slot slot="label">Voucher Code</slot>
406
- <slot slot="helptext">Please enter your 4 character voucher code.</slot>
405
+ <span slot="label">Voucher Code</span>
406
+ <span slot="helptext">Please enter your 4 character voucher code.</span>
407
407
  </auro-input>
408
408
  ```
409
409
  <!-- AURO-GENERATED-CONTENT:END -->
@@ -496,8 +496,8 @@ Example use cases for auro-input support the `activeLabel` attribute. If set, th
496
496
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=../apiExamples/activeLabel.html) -->
497
497
  <!-- The below content is automatically added from ../apiExamples/activeLabel.html -->
498
498
  <auro-input activeLabel bordered>
499
- <slot slot="label">Address</slot>
500
- <slot slot="helptext">Please enter your home address.</slot>
499
+ <span slot="label">Address</span>
500
+ <span slot="helptext">Please enter your home address.</span>
501
501
  </auro-input>
502
502
  <!-- AURO-GENERATED-CONTENT:END -->
503
503
  </div>
@@ -508,8 +508,8 @@ Example use cases for auro-input support the `activeLabel` attribute. If set, th
508
508
 
509
509
  ```html
510
510
  <auro-input activeLabel bordered>
511
- <slot slot="label">Address</slot>
512
- <slot slot="helptext">Please enter your home address.</slot>
511
+ <span slot="label">Address</span>
512
+ <span slot="helptext">Please enter your home address.</span>
513
513
  </auro-input>
514
514
  ```
515
515
  <!-- AURO-GENERATED-CONTENT:END -->
@@ -522,8 +522,8 @@ For use cases where the field is `required`, but live validation is not wanted,
522
522
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=../apiExamples/noValidate.html) -->
523
523
  <!-- The below content is automatically added from ../apiExamples/noValidate.html -->
524
524
  <auro-input noValidate required bordered>
525
- <slot slot="label">Address</slot>
526
- <slot slot="helptext">Please enter your home address.</slot>
525
+ <span slot="label">Address</span>
526
+ <span slot="helptext">Please enter your home address.</span>
527
527
  </auro-input>
528
528
  <!-- AURO-GENERATED-CONTENT:END -->
529
529
  </div>
@@ -534,8 +534,8 @@ For use cases where the field is `required`, but live validation is not wanted,
534
534
 
535
535
  ```html
536
536
  <auro-input noValidate required bordered>
537
- <slot slot="label">Address</slot>
538
- <slot slot="helptext">Please enter your home address.</slot>
537
+ <span slot="label">Address</span>
538
+ <span slot="helptext">Please enter your home address.</span>
539
539
  </auro-input>
540
540
  ```
541
541
  <!-- AURO-GENERATED-CONTENT:END -->
@@ -749,8 +749,8 @@ Default help text will be added to the input `type="email"` if custom help text
749
749
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=../apiExamples/email.html) -->
750
750
  <!-- The below content is automatically added from ../apiExamples/email.html -->
751
751
  <auro-input type="email" bordered required>
752
- <slot slot="label">Email address</slot>
753
- <slot slot="helptext">Please enter your email address.</slot>
752
+ <span slot="label">Email address</span>
753
+ <span slot="helptext">Please enter your email address.</span>
754
754
  </auro-input>
755
755
  <!-- AURO-GENERATED-CONTENT:END -->
756
756
  </div>
@@ -761,8 +761,8 @@ Default help text will be added to the input `type="email"` if custom help text
761
761
 
762
762
  ```html
763
763
  <auro-input type="email" bordered required>
764
- <slot slot="label">Email address</slot>
765
- <slot slot="helptext">Please enter your email address.</slot>
764
+ <span slot="label">Email address</span>
765
+ <span slot="helptext">Please enter your email address.</span>
766
766
  </auro-input>
767
767
  ```
768
768
  <!-- AURO-GENERATED-CONTENT:END -->
@@ -778,8 +778,8 @@ This `number` input type should only be used for incremental numeric values, mea
778
778
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=../apiExamples/number.html) -->
779
779
  <!-- The below content is automatically added from ../apiExamples/number.html -->
780
780
  <auro-input type="number" bordered required>
781
- <slot slot="label">Number of Passengers</slot>
782
- <slot slot="helptext">Please enter the number of passengers.</slot>
781
+ <span slot="label">Number of Passengers</span>
782
+ <span slot="helptext">Please enter the number of passengers.</span>
783
783
  </auro-input>
784
784
  <!-- AURO-GENERATED-CONTENT:END -->
785
785
  </div>
@@ -790,8 +790,8 @@ This `number` input type should only be used for incremental numeric values, mea
790
790
 
791
791
  ```html
792
792
  <auro-input type="number" bordered required>
793
- <slot slot="label">Number of Passengers</slot>
794
- <slot slot="helptext">Please enter the number of passengers.</slot>
793
+ <span slot="label">Number of Passengers</span>
794
+ <span slot="helptext">Please enter the number of passengers.</span>
795
795
  </auro-input>
796
796
  ```
797
797
  <!-- AURO-GENERATED-CONTENT:END -->
@@ -807,8 +807,8 @@ Default help text will be added to the input `type="credit-card"` if custom help
807
807
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=../apiExamples/creditCard.html) -->
808
808
  <!-- The below content is automatically added from ../apiExamples/creditCard.html -->
809
809
  <auro-input type="credit-card" bordered required>
810
- <slot slot="label">Card number</slot>
811
- <slot slot="helptext">Valid credit card numbers must include 16 digits (15 for Amex).</slot>
810
+ <span slot="label">Card number</span>
811
+ <span slot="helptext">Valid credit card numbers must include 16 digits (15 for Amex).</span>
812
812
  </auro-input>
813
813
  <!-- AURO-GENERATED-CONTENT:END -->
814
814
  </div>
@@ -819,8 +819,8 @@ Default help text will be added to the input `type="credit-card"` if custom help
819
819
 
820
820
  ```html
821
821
  <auro-input type="credit-card" bordered required>
822
- <slot slot="label">Card number</slot>
823
- <slot slot="helptext">Valid credit card numbers must include 16 digits (15 for Amex).</slot>
822
+ <span slot="label">Card number</span>
823
+ <span slot="helptext">Valid credit card numbers must include 16 digits (15 for Amex).</span>
824
824
  </auro-input>
825
825
  ```
826
826
  <!-- AURO-GENERATED-CONTENT:END -->
@@ -833,8 +833,8 @@ Use the `type="credit-card"` and `icon` attributes for a credit card formatted i
833
833
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=../apiExamples/creditCardIcon.html) -->
834
834
  <!-- The below content is automatically added from ../apiExamples/creditCardIcon.html -->
835
835
  <auro-input icon type="credit-card" bordered required>
836
- <slot slot="label">Card number</slot>
837
- <slot slot="helptext">Valid credit card numbers must include 16 digits (15 for Amex).</slot>
836
+ <span slot="label">Card number</span>
837
+ <span slot="helptext">Valid credit card numbers must include 16 digits (15 for Amex).</span>
838
838
  </auro-input>
839
839
  <!-- AURO-GENERATED-CONTENT:END -->
840
840
  </div>
@@ -846,8 +846,8 @@ Use the `type="credit-card"` and `icon` attributes for a credit card formatted i
846
846
 
847
847
  ```html
848
848
  <auro-input icon type="credit-card" bordered required>
849
- <slot slot="label">Card number</slot>
850
- <slot slot="helptext">Valid credit card numbers must include 16 digits (15 for Amex).</slot>
849
+ <span slot="label">Card number</span>
850
+ <span slot="helptext">Valid credit card numbers must include 16 digits (15 for Amex).</span>
851
851
  </auro-input>
852
852
  ```
853
853
  <!-- AURO-GENERATED-CONTENT:END -->
@@ -903,7 +903,7 @@ Use the `type="date"` attribute for a date formatted input. The default date for
903
903
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=../apiExamples/monthDayYear.html) -->
904
904
  <!-- The below content is automatically added from ../apiExamples/monthDayYear.html -->
905
905
  <auro-input type="date" bordered>
906
- <slot slot="label">Arrival date</slot>
906
+ <span slot="label">Arrival date</span>
907
907
  </auro-input>
908
908
  <!-- AURO-GENERATED-CONTENT:END -->
909
909
  </div>
@@ -914,7 +914,7 @@ Use the `type="date"` attribute for a date formatted input. The default date for
914
914
 
915
915
  ```html
916
916
  <auro-input type="date" bordered>
917
- <slot slot="label">Arrival date</slot>
917
+ <span slot="label">Arrival date</span>
918
918
  </auro-input>
919
919
  ```
920
920
  <!-- AURO-GENERATED-CONTENT:END -->
@@ -928,7 +928,7 @@ Use the `format` attribute to put together any combination of `mm`, `dd`, & `yyy
928
928
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=../apiExamples/yearMonthDay.html) -->
929
929
  <!-- The below content is automatically added from ../apiExamples/yearMonthDay.html -->
930
930
  <auro-input type="date" format="yyyy/mm/dd" bordered>
931
- <slot slot="label">Arrival date</slot>
931
+ <span slot="label">Arrival date</span>
932
932
  </auro-input>
933
933
  <!-- AURO-GENERATED-CONTENT:END -->
934
934
  </div>
@@ -939,7 +939,7 @@ Use the `format` attribute to put together any combination of `mm`, `dd`, & `yyy
939
939
 
940
940
  ```html
941
941
  <auro-input type="date" format="yyyy/mm/dd" bordered>
942
- <slot slot="label">Arrival date</slot>
942
+ <span slot="label">Arrival date</span>
943
943
  </auro-input>
944
944
  ```
945
945
  <!-- AURO-GENERATED-CONTENT:END -->
@@ -948,7 +948,7 @@ Use the `format` attribute to put together any combination of `mm`, `dd`, & `yyy
948
948
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=../apiExamples/monthYear.html) -->
949
949
  <!-- The below content is automatically added from ../apiExamples/monthYear.html -->
950
950
  <auro-input type="date" format="mm/yy" bordered>
951
- <slot slot="label">Expiration date</slot>
951
+ <span slot="label">Expiration date</span>
952
952
  </auro-input>
953
953
  <!-- AURO-GENERATED-CONTENT:END -->
954
954
  </div>
@@ -959,7 +959,7 @@ Use the `format` attribute to put together any combination of `mm`, `dd`, & `yyy
959
959
 
960
960
  ```html
961
961
  <auro-input type="date" format="mm/yy" bordered>
962
- <slot slot="label">Expiration date</slot>
962
+ <span slot="label">Expiration date</span>
963
963
  </auro-input>
964
964
  ```
965
965
  <!-- AURO-GENERATED-CONTENT:END -->
@@ -968,7 +968,7 @@ Use the `format` attribute to put together any combination of `mm`, `dd`, & `yyy
968
968
  <!-- AURO-GENERATED-CONTENT:START (FILE:src=../apiExamples/day.html) -->
969
969
  <!-- The below content is automatically added from ../apiExamples/day.html -->
970
970
  <auro-input type="date" format="dd" bordered>
971
- <slot slot="label">Day</slot>
971
+ <span slot="label">Day</span>
972
972
  </auro-input>
973
973
  <!-- AURO-GENERATED-CONTENT:END -->
974
974
  </div>
@@ -979,7 +979,7 @@ Use the `format` attribute to put together any combination of `mm`, `dd`, & `yyy
979
979
 
980
980
  ```html
981
981
  <auro-input type="date" format="dd" bordered>
982
- <slot slot="label">Day</slot>
982
+ <span slot="label">Day</span>
983
983
  </auro-input>
984
984
  ```
985
985
  <!-- AURO-GENERATED-CONTENT:END -->
@@ -997,8 +997,8 @@ Use the `reset()` method to reset the `<auro-input>`'s `value` and `validity` st
997
997
  <auro-button id="resetStateBtn">Reset</auro-button>
998
998
  <br /><br />
999
999
  <auro-input id="resetStateExample" bordered minlength="12" value="Auro Team" setCustomValidityTooShort="Please enter your full name!">
1000
- <slot slot="label">Full Name</slot>
1001
- <slot slot="helptext">Please enter your full name.</slot>
1000
+ <span slot="label">Full Name</span>
1001
+ <span slot="helptext">Please enter your full name.</span>
1002
1002
  </auro-input>
1003
1003
  <!-- AURO-GENERATED-CONTENT:END -->
1004
1004
  </div>
@@ -1011,8 +1011,8 @@ Use the `reset()` method to reset the `<auro-input>`'s `value` and `validity` st
1011
1011
  <auro-button id="resetStateBtn">Reset</auro-button>
1012
1012
  <br /><br />
1013
1013
  <auro-input id="resetStateExample" bordered minlength="12" value="Auro Team" setCustomValidityTooShort="Please enter your full name!">
1014
- <slot slot="label">Full Name</slot>
1015
- <slot slot="helptext">Please enter your full name.</slot>
1014
+ <span slot="label">Full Name</span>
1015
+ <span slot="helptext">Please enter your full name.</span>
1016
1016
  </auro-input>
1017
1017
  ```
1018
1018
  <!-- AURO-GENERATED-CONTENT:END -->