@qasa/qds-ui 0.10.1 → 0.11.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 (34) hide show
  1. package/dist/cjs/index.js +2 -2
  2. package/dist/cjs/index.js.map +1 -1
  3. package/dist/cjs/types/components/button/button-styles.d.ts +26 -16
  4. package/dist/cjs/types/components/icon-button/icon-button-styles.d.ts +26 -16
  5. package/dist/cjs/types/components/label/label.d.ts +13 -8
  6. package/dist/cjs/types/components/loading-dots/loading-dots.d.ts +13 -8
  7. package/dist/cjs/types/components/paragraph/paragraph.d.ts +13 -8
  8. package/dist/cjs/types/components/textarea/textarea.d.ts +5 -0
  9. package/dist/cjs/types/components/toast/toast-styles.d.ts +13 -8
  10. package/dist/cjs/types/styles/common-styles.d.ts +13 -8
  11. package/dist/cjs/types/theme/foundations/colors.d.ts +9 -8
  12. package/dist/cjs/types/theme/foundations/index.d.ts +13 -8
  13. package/dist/cjs/types/theme/foundations/sizes.d.ts +2 -0
  14. package/dist/cjs/types/theme/foundations/spacing.d.ts +4 -0
  15. package/dist/cjs/types/theme/theme-tools.d.ts +13 -8
  16. package/dist/cjs/types/theme/theme.d.ts +13 -8
  17. package/dist/esm/index.js +2 -2
  18. package/dist/esm/index.js.map +1 -1
  19. package/dist/esm/types/components/button/button-styles.d.ts +26 -16
  20. package/dist/esm/types/components/icon-button/icon-button-styles.d.ts +26 -16
  21. package/dist/esm/types/components/label/label.d.ts +13 -8
  22. package/dist/esm/types/components/loading-dots/loading-dots.d.ts +13 -8
  23. package/dist/esm/types/components/paragraph/paragraph.d.ts +13 -8
  24. package/dist/esm/types/components/textarea/textarea.d.ts +5 -0
  25. package/dist/esm/types/components/toast/toast-styles.d.ts +13 -8
  26. package/dist/esm/types/styles/common-styles.d.ts +13 -8
  27. package/dist/esm/types/theme/foundations/colors.d.ts +9 -8
  28. package/dist/esm/types/theme/foundations/index.d.ts +13 -8
  29. package/dist/esm/types/theme/foundations/sizes.d.ts +2 -0
  30. package/dist/esm/types/theme/foundations/spacing.d.ts +4 -0
  31. package/dist/esm/types/theme/theme-tools.d.ts +13 -8
  32. package/dist/esm/types/theme/theme.d.ts +13 -8
  33. package/dist/index.d.ts +135 -80
  34. package/package.json +2 -4
package/dist/index.d.ts CHANGED
@@ -29,7 +29,9 @@ declare const theme: {
29
29
  '5x': string;
30
30
  '6x': string;
31
31
  '8x': string;
32
+ '10x': string;
32
33
  '12x': string;
34
+ '14x': string;
33
35
  '16x': string;
34
36
  '20x': string;
35
37
  '24x': string;
@@ -70,6 +72,7 @@ declare const theme: {
70
72
  gray30: string;
71
73
  gray20: string;
72
74
  gray10: string;
75
+ pink: string;
73
76
  uiPink: string;
74
77
  uiPinkDark: string;
75
78
  uiPinkLight: string;
@@ -82,15 +85,15 @@ declare const theme: {
82
85
  softPink: string;
83
86
  warmYellow: string;
84
87
  softYellow: string;
85
- red10: string;
86
- red20: string;
87
- red30: string;
88
- red40: string;
89
- red50: string;
90
- red60: string;
91
- red70: string;
92
- red80: string;
93
88
  red90: string;
89
+ red80: string;
90
+ red70: string;
91
+ red60: string;
92
+ red50: string;
93
+ red40: string;
94
+ red30: string;
95
+ red20: string;
96
+ red10: string;
94
97
  green90: string;
95
98
  green80: string;
96
99
  green70: string;
@@ -199,7 +202,9 @@ declare const theme: {
199
202
  '5x': string;
200
203
  '6x': string;
201
204
  '8x': string;
205
+ '10x': string;
202
206
  '12x': string;
207
+ '14x': string;
203
208
  '16x': string;
204
209
  '20x': string;
205
210
  '24x': string;
@@ -634,6 +639,7 @@ declare const overrideTheme: (overrides: ThemeOverrides) => {
634
639
  gray30: string;
635
640
  gray20: string;
636
641
  gray10: string;
642
+ pink: string;
637
643
  uiPink: string;
638
644
  uiPinkDark: string;
639
645
  uiPinkLight: string;
@@ -646,15 +652,15 @@ declare const overrideTheme: (overrides: ThemeOverrides) => {
646
652
  softPink: string;
647
653
  warmYellow: string;
648
654
  softYellow: string;
649
- red10: string;
650
- red20: string;
651
- red30: string;
652
- red40: string;
653
- red50: string;
654
- red60: string;
655
- red70: string;
656
- red80: string;
657
655
  red90: string;
656
+ red80: string;
657
+ red70: string;
658
+ red60: string;
659
+ red50: string;
660
+ red40: string;
661
+ red30: string;
662
+ red20: string;
663
+ red10: string;
658
664
  green90: string;
659
665
  green80: string;
660
666
  green70: string;
@@ -752,7 +758,9 @@ declare const overrideTheme: (overrides: ThemeOverrides) => {
752
758
  '5x': string;
753
759
  '6x': string;
754
760
  '8x': string;
761
+ '10x': string;
755
762
  '12x': string;
763
+ '14x': string;
756
764
  '16x': string;
757
765
  '20x': string;
758
766
  '24x': string;
@@ -807,7 +815,9 @@ declare const overrideTheme: (overrides: ThemeOverrides) => {
807
815
  '5x': string;
808
816
  '6x': string;
809
817
  '8x': string;
818
+ '10x': string;
810
819
  '12x': string;
820
+ '14x': string;
811
821
  '16x': string;
812
822
  '20x': string;
813
823
  '24x': string;
@@ -1062,7 +1072,9 @@ declare const getFormFieldBaseStyles: (theme: {
1062
1072
  '5x': string;
1063
1073
  '6x': string;
1064
1074
  '8x': string;
1075
+ '10x': string;
1065
1076
  '12x': string;
1077
+ '14x': string;
1066
1078
  '16x': string;
1067
1079
  '20x': string;
1068
1080
  '24x': string;
@@ -1103,6 +1115,7 @@ declare const getFormFieldBaseStyles: (theme: {
1103
1115
  gray30: string;
1104
1116
  gray20: string;
1105
1117
  gray10: string;
1118
+ pink: string;
1106
1119
  uiPink: string;
1107
1120
  uiPinkDark: string;
1108
1121
  uiPinkLight: string;
@@ -1115,15 +1128,15 @@ declare const getFormFieldBaseStyles: (theme: {
1115
1128
  softPink: string;
1116
1129
  warmYellow: string;
1117
1130
  softYellow: string;
1118
- red10: string;
1119
- red20: string;
1120
- red30: string;
1121
- red40: string;
1122
- red50: string;
1123
- red60: string;
1124
- red70: string;
1125
- red80: string;
1126
1131
  red90: string;
1132
+ red80: string;
1133
+ red70: string;
1134
+ red60: string;
1135
+ red50: string;
1136
+ red40: string;
1137
+ red30: string;
1138
+ red20: string;
1139
+ red10: string;
1127
1140
  green90: string;
1128
1141
  green80: string;
1129
1142
  green70: string;
@@ -1232,7 +1245,9 @@ declare const getFormFieldBaseStyles: (theme: {
1232
1245
  '5x': string;
1233
1246
  '6x': string;
1234
1247
  '8x': string;
1248
+ '10x': string;
1235
1249
  '12x': string;
1250
+ '14x': string;
1236
1251
  '16x': string;
1237
1252
  '20x': string;
1238
1253
  '24x': string;
@@ -1508,7 +1523,9 @@ declare const getSizeStyles$4: (theme: {
1508
1523
  '5x': string;
1509
1524
  '6x': string;
1510
1525
  '8x': string;
1526
+ '10x': string;
1511
1527
  '12x': string;
1528
+ '14x': string;
1512
1529
  '16x': string;
1513
1530
  '20x': string;
1514
1531
  '24x': string;
@@ -1549,6 +1566,7 @@ declare const getSizeStyles$4: (theme: {
1549
1566
  gray30: string;
1550
1567
  gray20: string;
1551
1568
  gray10: string;
1569
+ pink: string;
1552
1570
  uiPink: string;
1553
1571
  uiPinkDark: string;
1554
1572
  uiPinkLight: string;
@@ -1561,15 +1579,15 @@ declare const getSizeStyles$4: (theme: {
1561
1579
  softPink: string;
1562
1580
  warmYellow: string;
1563
1581
  softYellow: string;
1564
- red10: string;
1565
- red20: string;
1566
- red30: string;
1567
- red40: string;
1568
- red50: string;
1569
- red60: string;
1570
- red70: string;
1571
- red80: string;
1572
1582
  red90: string;
1583
+ red80: string;
1584
+ red70: string;
1585
+ red60: string;
1586
+ red50: string;
1587
+ red40: string;
1588
+ red30: string;
1589
+ red20: string;
1590
+ red10: string;
1573
1591
  green90: string;
1574
1592
  green80: string;
1575
1593
  green70: string;
@@ -1678,7 +1696,9 @@ declare const getSizeStyles$4: (theme: {
1678
1696
  '5x': string;
1679
1697
  '6x': string;
1680
1698
  '8x': string;
1699
+ '10x': string;
1681
1700
  '12x': string;
1701
+ '14x': string;
1682
1702
  '16x': string;
1683
1703
  '20x': string;
1684
1704
  '24x': string;
@@ -1960,7 +1980,9 @@ declare const getVariantStyles$1: (theme: {
1960
1980
  '5x': string;
1961
1981
  '6x': string;
1962
1982
  '8x': string;
1983
+ '10x': string;
1963
1984
  '12x': string;
1985
+ '14x': string;
1964
1986
  '16x': string;
1965
1987
  '20x': string;
1966
1988
  '24x': string;
@@ -2001,6 +2023,7 @@ declare const getVariantStyles$1: (theme: {
2001
2023
  gray30: string;
2002
2024
  gray20: string;
2003
2025
  gray10: string;
2026
+ pink: string;
2004
2027
  uiPink: string;
2005
2028
  uiPinkDark: string;
2006
2029
  uiPinkLight: string;
@@ -2013,15 +2036,15 @@ declare const getVariantStyles$1: (theme: {
2013
2036
  softPink: string;
2014
2037
  warmYellow: string;
2015
2038
  softYellow: string;
2016
- red10: string;
2017
- red20: string;
2018
- red30: string;
2019
- red40: string;
2020
- red50: string;
2021
- red60: string;
2022
- red70: string;
2023
- red80: string;
2024
2039
  red90: string;
2040
+ red80: string;
2041
+ red70: string;
2042
+ red60: string;
2043
+ red50: string;
2044
+ red40: string;
2045
+ red30: string;
2046
+ red20: string;
2047
+ red10: string;
2025
2048
  green90: string;
2026
2049
  green80: string;
2027
2050
  green70: string;
@@ -2130,7 +2153,9 @@ declare const getVariantStyles$1: (theme: {
2130
2153
  '5x': string;
2131
2154
  '6x': string;
2132
2155
  '8x': string;
2156
+ '10x': string;
2133
2157
  '12x': string;
2158
+ '14x': string;
2134
2159
  '16x': string;
2135
2160
  '20x': string;
2136
2161
  '24x': string;
@@ -2719,7 +2744,9 @@ declare const getSizeStyles$3: (theme: {
2719
2744
  '5x': string;
2720
2745
  '6x': string;
2721
2746
  '8x': string;
2747
+ '10x': string;
2722
2748
  '12x': string;
2749
+ '14x': string;
2723
2750
  '16x': string;
2724
2751
  '20x': string;
2725
2752
  '24x': string;
@@ -2760,6 +2787,7 @@ declare const getSizeStyles$3: (theme: {
2760
2787
  gray30: string;
2761
2788
  gray20: string;
2762
2789
  gray10: string;
2790
+ pink: string;
2763
2791
  uiPink: string;
2764
2792
  uiPinkDark: string;
2765
2793
  uiPinkLight: string;
@@ -2772,15 +2800,15 @@ declare const getSizeStyles$3: (theme: {
2772
2800
  softPink: string;
2773
2801
  warmYellow: string;
2774
2802
  softYellow: string;
2775
- red10: string;
2776
- red20: string;
2777
- red30: string;
2778
- red40: string;
2779
- red50: string;
2780
- red60: string;
2781
- red70: string;
2782
- red80: string;
2783
2803
  red90: string;
2804
+ red80: string;
2805
+ red70: string;
2806
+ red60: string;
2807
+ red50: string;
2808
+ red40: string;
2809
+ red30: string;
2810
+ red20: string;
2811
+ red10: string;
2784
2812
  green90: string;
2785
2813
  green80: string;
2786
2814
  green70: string;
@@ -2889,7 +2917,9 @@ declare const getSizeStyles$3: (theme: {
2889
2917
  '5x': string;
2890
2918
  '6x': string;
2891
2919
  '8x': string;
2920
+ '10x': string;
2892
2921
  '12x': string;
2922
+ '14x': string;
2893
2923
  '16x': string;
2894
2924
  '20x': string;
2895
2925
  '24x': string;
@@ -3132,7 +3162,9 @@ declare const getVariantStyles: (theme: {
3132
3162
  '5x': string;
3133
3163
  '6x': string;
3134
3164
  '8x': string;
3165
+ '10x': string;
3135
3166
  '12x': string;
3167
+ '14x': string;
3136
3168
  '16x': string;
3137
3169
  '20x': string;
3138
3170
  '24x': string;
@@ -3173,6 +3205,7 @@ declare const getVariantStyles: (theme: {
3173
3205
  gray30: string;
3174
3206
  gray20: string;
3175
3207
  gray10: string;
3208
+ pink: string;
3176
3209
  uiPink: string;
3177
3210
  uiPinkDark: string;
3178
3211
  uiPinkLight: string;
@@ -3185,15 +3218,15 @@ declare const getVariantStyles: (theme: {
3185
3218
  softPink: string;
3186
3219
  warmYellow: string;
3187
3220
  softYellow: string;
3188
- red10: string;
3189
- red20: string;
3190
- red30: string;
3191
- red40: string;
3192
- red50: string;
3193
- red60: string;
3194
- red70: string;
3195
- red80: string;
3196
3221
  red90: string;
3222
+ red80: string;
3223
+ red70: string;
3224
+ red60: string;
3225
+ red50: string;
3226
+ red40: string;
3227
+ red30: string;
3228
+ red20: string;
3229
+ red10: string;
3197
3230
  green90: string;
3198
3231
  green80: string;
3199
3232
  green70: string;
@@ -3302,7 +3335,9 @@ declare const getVariantStyles: (theme: {
3302
3335
  '5x': string;
3303
3336
  '6x': string;
3304
3337
  '8x': string;
3338
+ '10x': string;
3305
3339
  '12x': string;
3340
+ '14x': string;
3306
3341
  '16x': string;
3307
3342
  '20x': string;
3308
3343
  '24x': string;
@@ -3664,7 +3699,9 @@ declare const getSizeStyles$2: (theme: {
3664
3699
  '5x': string;
3665
3700
  '6x': string;
3666
3701
  '8x': string;
3702
+ '10x': string;
3667
3703
  '12x': string;
3704
+ '14x': string;
3668
3705
  '16x': string;
3669
3706
  '20x': string;
3670
3707
  '24x': string;
@@ -3705,6 +3742,7 @@ declare const getSizeStyles$2: (theme: {
3705
3742
  gray30: string;
3706
3743
  gray20: string;
3707
3744
  gray10: string;
3745
+ pink: string;
3708
3746
  uiPink: string;
3709
3747
  uiPinkDark: string;
3710
3748
  uiPinkLight: string;
@@ -3717,15 +3755,15 @@ declare const getSizeStyles$2: (theme: {
3717
3755
  softPink: string;
3718
3756
  warmYellow: string;
3719
3757
  softYellow: string;
3720
- red10: string;
3721
- red20: string;
3722
- red30: string;
3723
- red40: string;
3724
- red50: string;
3725
- red60: string;
3726
- red70: string;
3727
- red80: string;
3728
3758
  red90: string;
3759
+ red80: string;
3760
+ red70: string;
3761
+ red60: string;
3762
+ red50: string;
3763
+ red40: string;
3764
+ red30: string;
3765
+ red20: string;
3766
+ red10: string;
3729
3767
  green90: string;
3730
3768
  green80: string;
3731
3769
  green70: string;
@@ -3834,7 +3872,9 @@ declare const getSizeStyles$2: (theme: {
3834
3872
  '5x': string;
3835
3873
  '6x': string;
3836
3874
  '8x': string;
3875
+ '10x': string;
3837
3876
  '12x': string;
3877
+ '14x': string;
3838
3878
  '16x': string;
3839
3879
  '20x': string;
3840
3880
  '24x': string;
@@ -4113,7 +4153,9 @@ declare const getSizeStyles$1: (theme: {
4113
4153
  '5x': string;
4114
4154
  '6x': string;
4115
4155
  '8x': string;
4156
+ '10x': string;
4116
4157
  '12x': string;
4158
+ '14x': string;
4117
4159
  '16x': string;
4118
4160
  '20x': string;
4119
4161
  '24x': string;
@@ -4154,6 +4196,7 @@ declare const getSizeStyles$1: (theme: {
4154
4196
  gray30: string;
4155
4197
  gray20: string;
4156
4198
  gray10: string;
4199
+ pink: string;
4157
4200
  uiPink: string;
4158
4201
  uiPinkDark: string;
4159
4202
  uiPinkLight: string;
@@ -4166,15 +4209,15 @@ declare const getSizeStyles$1: (theme: {
4166
4209
  softPink: string;
4167
4210
  warmYellow: string;
4168
4211
  softYellow: string;
4169
- red10: string;
4170
- red20: string;
4171
- red30: string;
4172
- red40: string;
4173
- red50: string;
4174
- red60: string;
4175
- red70: string;
4176
- red80: string;
4177
4212
  red90: string;
4213
+ red80: string;
4214
+ red70: string;
4215
+ red60: string;
4216
+ red50: string;
4217
+ red40: string;
4218
+ red30: string;
4219
+ red20: string;
4220
+ red10: string;
4178
4221
  green90: string;
4179
4222
  green80: string;
4180
4223
  green70: string;
@@ -4283,7 +4326,9 @@ declare const getSizeStyles$1: (theme: {
4283
4326
  '5x': string;
4284
4327
  '6x': string;
4285
4328
  '8x': string;
4329
+ '10x': string;
4286
4330
  '12x': string;
4331
+ '14x': string;
4287
4332
  '16x': string;
4288
4333
  '20x': string;
4289
4334
  '24x': string;
@@ -4528,7 +4573,9 @@ declare const getSizeStyles: (theme: {
4528
4573
  '5x': string;
4529
4574
  '6x': string;
4530
4575
  '8x': string;
4576
+ '10x': string;
4531
4577
  '12x': string;
4578
+ '14x': string;
4532
4579
  '16x': string;
4533
4580
  '20x': string;
4534
4581
  '24x': string;
@@ -4569,6 +4616,7 @@ declare const getSizeStyles: (theme: {
4569
4616
  gray30: string;
4570
4617
  gray20: string;
4571
4618
  gray10: string;
4619
+ pink: string;
4572
4620
  uiPink: string;
4573
4621
  uiPinkDark: string;
4574
4622
  uiPinkLight: string;
@@ -4581,15 +4629,15 @@ declare const getSizeStyles: (theme: {
4581
4629
  softPink: string;
4582
4630
  warmYellow: string;
4583
4631
  softYellow: string;
4584
- red10: string;
4585
- red20: string;
4586
- red30: string;
4587
- red40: string;
4588
- red50: string;
4589
- red60: string;
4590
- red70: string;
4591
- red80: string;
4592
4632
  red90: string;
4633
+ red80: string;
4634
+ red70: string;
4635
+ red60: string;
4636
+ red50: string;
4637
+ red40: string;
4638
+ red30: string;
4639
+ red20: string;
4640
+ red10: string;
4593
4641
  green90: string;
4594
4642
  green80: string;
4595
4643
  green70: string;
@@ -4698,7 +4746,9 @@ declare const getSizeStyles: (theme: {
4698
4746
  '5x': string;
4699
4747
  '6x': string;
4700
4748
  '8x': string;
4749
+ '10x': string;
4701
4750
  '12x': string;
4751
+ '14x': string;
4702
4752
  '16x': string;
4703
4753
  '20x': string;
4704
4754
  '24x': string;
@@ -5236,6 +5286,11 @@ interface TextareaOptions extends TextareaBaseOptions {
5236
5286
  * Text that provides additional guidance to the user
5237
5287
  */
5238
5288
  helperText?: string;
5289
+ /**
5290
+ * If `true`, the input will display an optional indicator.
5291
+ * If the `isRequired` prop is also `true`, this prop will be ignored.
5292
+ */
5293
+ isOptional?: boolean;
5239
5294
  }
5240
5295
  type OmittedProps$1 = 'children' | 'readOnly' | 'size';
5241
5296
  interface TextareaProps extends Omit<HTMLQdsProps<'textarea'>, OmittedProps$1>, TextareaOptions {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@qasa/qds-ui",
3
- "version": "0.10.1",
3
+ "version": "0.11.0",
4
4
  "license": "UNLICENSED",
5
5
  "repository": {
6
6
  "type": "git",
@@ -26,8 +26,7 @@
26
26
  "lint:ci": "NODE_ENV=production eslint . --cache",
27
27
  "lint:prettier": "prettier --check ./src --cache",
28
28
  "prepublishOnly": "yarn build",
29
- "release": "changeset publish",
30
- "gen:component": "plop --plopfile scripts/plopfile.js"
29
+ "release": "changeset publish"
31
30
  },
32
31
  "devDependencies": {
33
32
  "@babel/core": "^7.19.3",
@@ -76,7 +75,6 @@
76
75
  "jest-matchmedia-mock": "^1.1.0",
77
76
  "jest-watch-typeahead": "^2.2.0",
78
77
  "lucide-react": "^0.294.0",
79
- "plop": "^3.1.1",
80
78
  "prettier": "^3.2.5",
81
79
  "react": "^18.2.0",
82
80
  "react-dom": "^18.2.0",