@fewangsit/wangsvue-presets 1.0.85-alpha.5 → 1.0.85-alpha.6

Sign up to get free protection for your applications and to get access to all the features.
Files changed (41) hide show
  1. package/fixedasset/badge/index.js +1 -1
  2. package/fixedasset/buttonradio/index.d.ts +23 -21
  3. package/fixedasset/buttonradio/index.js +21 -31
  4. package/fixedasset/card/index.js +2 -2
  5. package/fixedasset/dropdown/index.d.ts +56 -39
  6. package/fixedasset/dropdown/index.js +24 -28
  7. package/fixedasset/form/index.js +1 -1
  8. package/fixedasset/global.js +1 -1
  9. package/fixedasset/index.d.ts +2 -2
  10. package/fixedasset/index.js +92 -92
  11. package/fixedasset/index.system.js +2 -2
  12. package/fixedasset/inputcurrency/index.js +1 -1
  13. package/fixedasset/inputnumber/index.d.ts +25 -6
  14. package/fixedasset/inputnumber/index.js +36 -4
  15. package/fixedasset/inputphonenumber/index.d.ts +22 -12
  16. package/fixedasset/inputphonenumber/index.js +20 -7
  17. package/fixedasset/multiselect/index.d.ts +80 -44
  18. package/fixedasset/multiselect/index.js +50 -70
  19. package/fixedasset/style.css +127 -45
  20. package/fixedasset/textarea/index.js +3 -2
  21. package/fixedasset/toggleswitch/index.d.ts +100 -0
  22. package/{wangsvue/inputswitch → fixedasset/toggleswitch}/index.js +44 -17
  23. package/package.json +1 -1
  24. package/wangsvue/buttonradio/index.d.ts +24 -28
  25. package/wangsvue/buttonradio/index.js +20 -33
  26. package/wangsvue/dropdown/index.d.ts +33 -0
  27. package/wangsvue/dropdown/index.js +15 -6
  28. package/wangsvue/index.d.ts +2 -2
  29. package/wangsvue/index.js +92 -92
  30. package/wangsvue/index.system.js +2 -2
  31. package/wangsvue/inputnumber/index.d.ts +25 -6
  32. package/wangsvue/inputnumber/index.js +36 -4
  33. package/wangsvue/inputphonenumber/index.d.ts +22 -12
  34. package/wangsvue/inputphonenumber/index.js +17 -5
  35. package/wangsvue/multiselect/index.d.ts +52 -4
  36. package/wangsvue/multiselect/index.js +28 -35
  37. package/wangsvue/style.css +132 -38
  38. package/wangsvue/toggleswitch/index.d.ts +105 -0
  39. package/{fixedasset/inputswitch → wangsvue/toggleswitch}/index.js +45 -17
  40. package/fixedasset/inputswitch/index.d.ts +0 -67
  41. package/wangsvue/inputswitch/index.d.ts +0 -67
@@ -974,6 +974,10 @@
974
974
  left: 0px;
975
975
  }
976
976
 
977
+ .left-0\.5{
978
+ left: 0.125rem;
979
+ }
980
+
977
981
  .left-2{
978
982
  left: 0.5rem;
979
983
  }
@@ -1475,6 +1479,10 @@
1475
1479
  height: 21px;
1476
1480
  }
1477
1481
 
1482
+ .h-\[26px\]{
1483
+ height: 26px;
1484
+ }
1485
+
1478
1486
  .h-\[2rem\]{
1479
1487
  height: 2rem;
1480
1488
  }
@@ -1779,6 +1787,10 @@
1779
1787
  min-width: 0px;
1780
1788
  }
1781
1789
 
1790
+ .min-w-4{
1791
+ min-width: 1rem;
1792
+ }
1793
+
1782
1794
  .min-w-52{
1783
1795
  min-width: 13rem;
1784
1796
  }
@@ -1979,11 +1991,6 @@
1979
1991
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1980
1992
  }
1981
1993
 
1982
- .translate-x-3\.5{
1983
- --tw-translate-x: 0.875rem;
1984
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
1985
- }
1986
-
1987
1994
  .translate-x-full{
1988
1995
  --tw-translate-x: 100%;
1989
1996
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -1999,6 +2006,11 @@
1999
2006
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
2000
2007
  }
2001
2008
 
2009
+ .translate-y-1\/2{
2010
+ --tw-translate-y: 50%;
2011
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
2012
+ }
2013
+
2002
2014
  .translate-y-2\/4{
2003
2015
  --tw-translate-y: 50%;
2004
2016
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -2475,6 +2487,10 @@
2475
2487
  border-radius: 60px;
2476
2488
  }
2477
2489
 
2490
+ .rounded-\[6px\]{
2491
+ border-radius: 6px;
2492
+ }
2493
+
2478
2494
  .rounded-\[7px\]{
2479
2495
  border-radius: 7px;
2480
2496
  }
@@ -2712,11 +2728,6 @@
2712
2728
  border-style: none;
2713
2729
  }
2714
2730
 
2715
- .\!border-danger-500{
2716
- --tw-border-opacity: 1 !important;
2717
- border-color: rgb(183 75 36 / var(--tw-border-opacity)) !important;
2718
- }
2719
-
2720
2731
  .\!border-general-100{
2721
2732
  --tw-border-opacity: 1 !important;
2722
2733
  border-color: rgb(218 217 227 / var(--tw-border-opacity)) !important;
@@ -2801,6 +2812,11 @@
2801
2812
  border-color: rgb(255 255 255 / var(--tw-border-opacity));
2802
2813
  }
2803
2814
 
2815
+ .\!bg-danger-500{
2816
+ --tw-bg-opacity: 1 !important;
2817
+ background-color: rgb(183 75 36 / var(--tw-bg-opacity)) !important;
2818
+ }
2819
+
2804
2820
  .\!bg-general-100{
2805
2821
  --tw-bg-opacity: 1 !important;
2806
2822
  background-color: rgb(218 217 227 / var(--tw-bg-opacity)) !important;
@@ -2841,6 +2857,11 @@
2841
2857
  background-color: rgb(159 124 60 / var(--tw-bg-opacity)) !important;
2842
2858
  }
2843
2859
 
2860
+ .\!bg-success-500{
2861
+ --tw-bg-opacity: 1 !important;
2862
+ background-color: rgb(0 147 132 / var(--tw-bg-opacity)) !important;
2863
+ }
2864
+
2844
2865
  .\!bg-transparent{
2845
2866
  background-color: transparent !important;
2846
2867
  }
@@ -2927,6 +2948,11 @@
2927
2948
  background-color: rgb(107 114 128 / var(--tw-bg-opacity));
2928
2949
  }
2929
2950
 
2951
+ .bg-grayscale-100{
2952
+ --tw-bg-opacity: 1;
2953
+ background-color: rgb(242 242 242 / var(--tw-bg-opacity));
2954
+ }
2955
+
2930
2956
  .bg-grayscale-200{
2931
2957
  --tw-bg-opacity: 1;
2932
2958
  background-color: rgb(229 230 230 / var(--tw-bg-opacity));
@@ -3549,6 +3575,15 @@
3549
3575
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
3550
3576
  }
3551
3577
 
3578
+ .\!text-\[10px\]{
3579
+ font-size: 10px !important;
3580
+ }
3581
+
3582
+ .\!text-base{
3583
+ font-size: 1rem !important;
3584
+ line-height: 1.5rem !important;
3585
+ }
3586
+
3552
3587
  .\!text-xs{
3553
3588
  font-size: 0.75rem !important;
3554
3589
  line-height: 1rem !important;
@@ -3676,10 +3711,6 @@
3676
3711
  line-height: 1.125rem;
3677
3712
  }
3678
3713
 
3679
- .leading-\[12px\]{
3680
- line-height: 12px;
3681
- }
3682
-
3683
3714
  .leading-\[133\.333\%\]{
3684
3715
  line-height: 133.333%;
3685
3716
  }
@@ -3696,6 +3727,10 @@
3696
3727
  line-height: 19.12px;
3697
3728
  }
3698
3729
 
3730
+ .leading-\[22px\]{
3731
+ line-height: 22px;
3732
+ }
3733
+
3699
3734
  .leading-\[2rem\]{
3700
3735
  line-height: 2rem;
3701
3736
  }
@@ -3720,10 +3755,6 @@
3720
3755
  letter-spacing: 0.02em;
3721
3756
  }
3722
3757
 
3723
- .tracking-\[0\.03em\]{
3724
- letter-spacing: 0.03em;
3725
- }
3726
-
3727
3758
  .tracking-\[0\.2488px\]{
3728
3759
  letter-spacing: 0.2488px;
3729
3760
  }
@@ -3845,6 +3876,11 @@
3845
3876
  color: rgb(108 104 141 / var(--tw-text-opacity));
3846
3877
  }
3847
3878
 
3879
+ .text-general-500{
3880
+ --tw-text-opacity: 1;
3881
+ color: rgb(78 75 102 / var(--tw-text-opacity));
3882
+ }
3883
+
3848
3884
  .text-general-800{
3849
3885
  --tw-text-opacity: 1;
3850
3886
  color: rgb(32 30 41 / var(--tw-text-opacity));
@@ -4143,6 +4179,10 @@
4143
4179
  --tw-ring-color: rgb(159 124 60 / var(--tw-ring-opacity)) !important;
4144
4180
  }
4145
4181
 
4182
+ .\!ring-transparent{
4183
+ --tw-ring-color: transparent !important;
4184
+ }
4185
+
4146
4186
  .ring-blue-400\/50{
4147
4187
  --tw-ring-color: rgb(96 165 250 / 0.5);
4148
4188
  }
@@ -4162,11 +4202,21 @@
4162
4202
  --tw-ring-color: rgb(183 75 36 / var(--tw-ring-opacity));
4163
4203
  }
4164
4204
 
4205
+ .ring-general-100{
4206
+ --tw-ring-opacity: 1;
4207
+ --tw-ring-color: rgb(218 217 227 / var(--tw-ring-opacity));
4208
+ }
4209
+
4165
4210
  .ring-general-200{
4166
4211
  --tw-ring-opacity: 1;
4167
4212
  --tw-ring-color: rgb(181 179 199 / var(--tw-ring-opacity));
4168
4213
  }
4169
4214
 
4215
+ .ring-general-300{
4216
+ --tw-ring-opacity: 1;
4217
+ --tw-ring-color: rgb(144 140 171 / var(--tw-ring-opacity));
4218
+ }
4219
+
4170
4220
  .ring-general-400{
4171
4221
  --tw-ring-opacity: 1;
4172
4222
  --tw-ring-color: rgb(108 104 141 / var(--tw-ring-opacity));
@@ -4217,6 +4267,11 @@
4217
4267
  --tw-ring-color: rgb(238 235 211 / var(--tw-ring-opacity));
4218
4268
  }
4219
4269
 
4270
+ .ring-primary-200{
4271
+ --tw-ring-opacity: 1;
4272
+ --tw-ring-color: rgb(223 215 169 / var(--tw-ring-opacity));
4273
+ }
4274
+
4220
4275
  .ring-primary-400{
4221
4276
  --tw-ring-opacity: 1;
4222
4277
  --tw-ring-color: rgb(189 165 82 / var(--tw-ring-opacity));
@@ -4435,6 +4490,7 @@
4435
4490
 
4436
4491
  * {
4437
4492
  font-family: 'Poppins', sans-serif;
4493
+ scrollbar-width: thin;
4438
4494
  }
4439
4495
 
4440
4496
  .font-poppins {
@@ -4501,7 +4557,8 @@ h6,
4501
4557
  scrollbar-width: none;
4502
4558
  }
4503
4559
 
4504
- .scrollbar-w-thin {
4560
+ .scrollbar-w-thin,
4561
+ .p-virtualscroller {
4505
4562
  scrollbar-width: thin;
4506
4563
  }
4507
4564
 
@@ -4590,6 +4647,11 @@ h6,
4590
4647
  left: 0px;
4591
4648
  }
4592
4649
 
4650
+ .before\:left-0\.5::before{
4651
+ content: var(--tw-content);
4652
+ left: 0.125rem;
4653
+ }
4654
+
4593
4655
  .before\:left-1\/2::before{
4594
4656
  content: var(--tw-content);
4595
4657
  left: 50%;
@@ -4610,16 +4672,6 @@ h6,
4610
4672
  z-index: 50;
4611
4673
  }
4612
4674
 
4613
- .before\:-mt-\[6px\]::before{
4614
- content: var(--tw-content);
4615
- margin-top: -6px;
4616
- }
4617
-
4618
- .before\:ml-0\.5::before{
4619
- content: var(--tw-content);
4620
- margin-left: 0.125rem;
4621
- }
4622
-
4623
4675
  .before\:ml-4::before{
4624
4676
  content: var(--tw-content);
4625
4677
  margin-left: 1rem;
@@ -4671,9 +4723,15 @@ h6,
4671
4723
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4672
4724
  }
4673
4725
 
4674
- .before\:translate-x-3\.5::before{
4726
+ .before\:-translate-y-1\/2::before{
4675
4727
  content: var(--tw-content);
4676
- --tw-translate-x: 0.875rem;
4728
+ --tw-translate-y: -50%;
4729
+ transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4730
+ }
4731
+
4732
+ .before\:translate-x-\[calc\(18px\)\]::before{
4733
+ content: var(--tw-content);
4734
+ --tw-translate-x: calc(18px);
4677
4735
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
4678
4736
  }
4679
4737
 
@@ -4744,6 +4802,18 @@ h6,
4744
4802
  border-color: transparent;
4745
4803
  }
4746
4804
 
4805
+ .before\:\!bg-white::before{
4806
+ content: var(--tw-content);
4807
+ --tw-bg-opacity: 1 !important;
4808
+ background-color: rgb(255 255 255 / var(--tw-bg-opacity)) !important;
4809
+ }
4810
+
4811
+ .before\:bg-general-100::before{
4812
+ content: var(--tw-content);
4813
+ --tw-bg-opacity: 1;
4814
+ background-color: rgb(218 217 227 / var(--tw-bg-opacity));
4815
+ }
4816
+
4747
4817
  .before\:bg-general-50::before{
4748
4818
  content: var(--tw-content);
4749
4819
  --tw-bg-opacity: 1;
@@ -4773,13 +4843,6 @@ h6,
4773
4843
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
4774
4844
  }
4775
4845
 
4776
- .before\:shadow::before{
4777
- content: var(--tw-content);
4778
- --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
4779
- --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
4780
- box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
4781
- }
4782
-
4783
4846
  .before\:shadow-xl::before{
4784
4847
  content: var(--tw-content);
4785
4848
  --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
@@ -5335,6 +5398,10 @@ h6,
5335
5398
  background-color: rgb(133 103 50 / var(--tw-bg-opacity));
5336
5399
  }
5337
5400
 
5401
+ .focus\:bg-none:focus{
5402
+ background-image: none;
5403
+ }
5404
+
5338
5405
  .focus\:px-2:focus{
5339
5406
  padding-left: 0.5rem;
5340
5407
  padding-right: 0.5rem;
@@ -5600,6 +5667,22 @@ h6,
5600
5667
  background-color: rgb(231 192 104 / var(--tw-bg-opacity)) !important;
5601
5668
  }
5602
5669
 
5670
+ .peer:focus-visible ~ .peer-focus-visible\:\!outline{
5671
+ outline-style: solid !important;
5672
+ }
5673
+
5674
+ .peer:focus-visible ~ .peer-focus-visible\:\!outline-offset-0{
5675
+ outline-offset: 0px !important;
5676
+ }
5677
+
5678
+ .peer:focus-visible ~ .peer-focus-visible\:\!outline-primary-400\/\[5\%\]{
5679
+ outline-color: rgb(189 165 82 / 5%) !important;
5680
+ }
5681
+
5682
+ .peer:focus-visible ~ .peer-focus-visible\:\!outline-primary-500\/\[5\%\]{
5683
+ outline-color: rgb(159 124 60 / 5%) !important;
5684
+ }
5685
+
5603
5686
  .peer:focus-visible ~ .peer-focus-visible\:ring-2{
5604
5687
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
5605
5688
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
@@ -5837,6 +5920,12 @@ h6,
5837
5920
  background-image: none;
5838
5921
  }
5839
5922
 
5923
+ .\[\&\:has\(\:focus\)\]\:ring-1:has(:focus){
5924
+ --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
5925
+ --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
5926
+ box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
5927
+ }
5928
+
5840
5929
  .\[\&\:has\(\:focus\)\]\:\!ring-primary-400:has(:focus){
5841
5930
  --tw-ring-opacity: 1 !important;
5842
5931
  --tw-ring-color: rgb(189 165 82 / var(--tw-ring-opacity)) !important;
@@ -5852,6 +5941,11 @@ h6,
5852
5941
  --tw-ring-color: rgb(189 165 82 / var(--tw-ring-opacity));
5853
5942
  }
5854
5943
 
5944
+ .\[\&\:has\(\:focus\)\]\:ring-primary-500:has(:focus){
5945
+ --tw-ring-opacity: 1;
5946
+ --tw-ring-color: rgb(159 124 60 / var(--tw-ring-opacity));
5947
+ }
5948
+
5855
5949
  .\[\&\:has\(\:focus\)_\.inputgroupaddon\]\:\!ring-primary-400:has(:focus) .inputgroupaddon{
5856
5950
  --tw-ring-opacity: 1 !important;
5857
5951
  --tw-ring-color: rgb(189 165 82 / var(--tw-ring-opacity)) !important;
@@ -0,0 +1,105 @@
1
+ declare namespace _default {
2
+ function root({ props }: {
3
+ props: any;
4
+ }): {
5
+ class: (string | {
6
+ 'select-none pointer-events-none cursor-default': any;
7
+ })[];
8
+ };
9
+ function slider({ props }: {
10
+ props: any;
11
+ }): {
12
+ class: (string | {
13
+ 'before:transform before:translate-x-[calc(18px)]': boolean;
14
+ 'before:left-0.5'?: undefined;
15
+ ring?: undefined;
16
+ 'ring-[0.5px]'?: undefined;
17
+ 'before:bg-white'?: undefined;
18
+ 'before:bg-primary-200'?: undefined;
19
+ 'before:bg-general-50'?: undefined;
20
+ 'bg-white ring-primary-200'?: undefined;
21
+ 'bg-primary-400 ring-transparent'?: undefined;
22
+ 'bg-primary-100 ring-transparent'?: undefined;
23
+ 'bg-general-100 ring-general-100'?: undefined;
24
+ '!bg-danger-500 before:!bg-white !ring-transparent'?: undefined;
25
+ '!bg-success-500 before:!bg-white !ring-transparent'?: undefined;
26
+ } | {
27
+ 'before:left-0.5': boolean;
28
+ 'before:transform before:translate-x-[calc(18px)]'?: undefined;
29
+ ring?: undefined;
30
+ 'ring-[0.5px]'?: undefined;
31
+ 'before:bg-white'?: undefined;
32
+ 'before:bg-primary-200'?: undefined;
33
+ 'before:bg-general-50'?: undefined;
34
+ 'bg-white ring-primary-200'?: undefined;
35
+ 'bg-primary-400 ring-transparent'?: undefined;
36
+ 'bg-primary-100 ring-transparent'?: undefined;
37
+ 'bg-general-100 ring-general-100'?: undefined;
38
+ '!bg-danger-500 before:!bg-white !ring-transparent'?: undefined;
39
+ '!bg-success-500 before:!bg-white !ring-transparent'?: undefined;
40
+ } | {
41
+ ring: boolean;
42
+ 'ring-[0.5px]': boolean;
43
+ 'before:transform before:translate-x-[calc(18px)]'?: undefined;
44
+ 'before:left-0.5'?: undefined;
45
+ 'before:bg-white'?: undefined;
46
+ 'before:bg-primary-200'?: undefined;
47
+ 'before:bg-general-50'?: undefined;
48
+ 'bg-white ring-primary-200'?: undefined;
49
+ 'bg-primary-400 ring-transparent'?: undefined;
50
+ 'bg-primary-100 ring-transparent'?: undefined;
51
+ 'bg-general-100 ring-general-100'?: undefined;
52
+ '!bg-danger-500 before:!bg-white !ring-transparent'?: undefined;
53
+ '!bg-success-500 before:!bg-white !ring-transparent'?: undefined;
54
+ } | {
55
+ 'before:bg-white': boolean;
56
+ 'before:bg-primary-200': boolean;
57
+ 'before:bg-general-50': any;
58
+ 'bg-white ring-primary-200': boolean;
59
+ 'bg-primary-400 ring-transparent': boolean;
60
+ 'bg-primary-100 ring-transparent': any;
61
+ 'bg-general-100 ring-general-100': any;
62
+ 'before:transform before:translate-x-[calc(18px)]'?: undefined;
63
+ 'before:left-0.5'?: undefined;
64
+ ring?: undefined;
65
+ 'ring-[0.5px]'?: undefined;
66
+ '!bg-danger-500 before:!bg-white !ring-transparent'?: undefined;
67
+ '!bg-success-500 before:!bg-white !ring-transparent'?: undefined;
68
+ } | {
69
+ '!bg-danger-500 before:!bg-white !ring-transparent': boolean;
70
+ '!bg-success-500 before:!bg-white !ring-transparent': boolean;
71
+ 'before:transform before:translate-x-[calc(18px)]'?: undefined;
72
+ 'before:left-0.5'?: undefined;
73
+ ring?: undefined;
74
+ 'ring-[0.5px]'?: undefined;
75
+ 'before:bg-white'?: undefined;
76
+ 'before:bg-primary-200'?: undefined;
77
+ 'before:bg-general-50'?: undefined;
78
+ 'bg-white ring-primary-200'?: undefined;
79
+ 'bg-primary-400 ring-transparent'?: undefined;
80
+ 'bg-primary-100 ring-transparent'?: undefined;
81
+ 'bg-general-100 ring-general-100'?: undefined;
82
+ })[];
83
+ };
84
+ function input({ props }: {
85
+ props: any;
86
+ }): {
87
+ class: (string | {
88
+ 'cursor-default': any;
89
+ 'cursor-pointer': boolean;
90
+ })[];
91
+ };
92
+ namespace label {
93
+ let _class: string[];
94
+ export { _class as class };
95
+ }
96
+ namespace labeltext {
97
+ let _class_1: string;
98
+ export { _class_1 as class };
99
+ }
100
+ namespace tooltipicon {
101
+ let _class_2: string;
102
+ export { _class_2 as class };
103
+ }
104
+ }
105
+ export default _default;
@@ -1,5 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
+ var isFirefoxBased = navigator.userAgent.includes('Firefox');
3
4
  exports.default = {
4
5
  root: function (_a) {
5
6
  var props = _a.props;
@@ -31,33 +32,41 @@ exports.default = {
31
32
  'rounded-[60px]',
32
33
  // Before:
33
34
  'before:absolute before:top-1/2',
34
- 'before:-mt-[6px] before:ml-0.5',
35
+ 'before:-translate-y-1/2',
35
36
  'before:h-3 before:w-3',
36
37
  'before:rounded-full',
37
38
  'before:duration-200 before:transition before:ease-in-out',
38
- 'before:shadow',
39
+ // Active position
39
40
  {
40
- 'before:bg-white before:bg-white': props.modelValue == props.trueValue,
41
- 'before:bg-primary-200': props.modelValue !== props.trueValue && !props.disabled,
42
- 'before:bg-general-50': props.modelValue !== props.trueValue && props.disabled,
41
+ 'before:transform before:translate-x-[calc(18px)]': props.modelValue == props.trueValue,
43
42
  },
43
+ // Inactive position
44
44
  {
45
- 'before:transform before:translate-x-3.5': props.modelValue == props.trueValue,
45
+ 'before:left-0.5': props.modelValue != props.trueValue,
46
46
  },
47
47
  // Colors
48
- 'border',
48
+ 'ring',
49
+ { 'ring': isFirefoxBased, 'ring-[0.5px]': !isFirefoxBased },
49
50
  {
50
- 'border-primary-200': props.modelValue !== props.trueValue && !props.disabled,
51
- 'border-transparent': props.modelValue == props.trueValue,
51
+ 'before:bg-white': props.modelValue == props.trueValue,
52
+ 'before:bg-primary-200': props.modelValue !== props.trueValue && !props.disabled,
53
+ 'before:bg-general-50': props.modelValue !== props.trueValue && props.disabled,
54
+ // Inactive and Enabled
55
+ 'bg-white ring-primary-200': props.modelValue !== props.trueValue && !props.disabled,
56
+ // Active and Enabled
57
+ 'bg-primary-400 ring-transparent': props.modelValue == props.trueValue && !props.disabled,
58
+ // Active and Disabled
59
+ 'bg-primary-100 ring-transparent': props.modelValue == props.trueValue && props.disabled,
60
+ // Inactive and Disabled
61
+ 'bg-general-100 ring-general-100': props.modelValue !== props.trueValue && props.disabled,
52
62
  },
53
- {
54
- 'bg-white': props.modelValue !== props.trueValue && !props.disabled,
55
- 'bg-primary-500': props.modelValue == props.trueValue && !props.disabled,
56
- 'bg-primary-100': props.modelValue == props.trueValue && props.disabled,
57
- 'bg-general-100': props.modelValue !== props.trueValue && props.disabled,
63
+ // TriState colors
64
+ props.triState && {
65
+ '!bg-danger-500 before:!bg-white !ring-transparent': props.modelValue == props.falseValue && !props.disabled,
66
+ '!bg-success-500 before:!bg-white !ring-transparent': props.modelValue == props.trueValue && !props.disabled,
58
67
  },
59
68
  // States
60
- 'peer-focus-visible:ring-2 peer-focus-visible:ring-primary-500',
69
+ 'peer-focus-visible:!outline peer-focus-visible:!outline-offset-0 peer-focus-visible:!outline-primary-400/[5%]',
61
70
  // Transition
62
71
  'transition-colors duration-200',
63
72
  // Misc
@@ -82,12 +91,10 @@ exports.default = {
82
91
  'm-0',
83
92
  // Shape
84
93
  'rounded',
85
- 'border',
86
94
  // Shape
87
95
  'opacity-0',
88
96
  'rounded-md',
89
97
  'outline-none',
90
- 'border-2 border-surface-300',
91
98
  // Misc
92
99
  'appearance-none',
93
100
  {
@@ -97,4 +104,25 @@ exports.default = {
97
104
  ],
98
105
  });
99
106
  },
107
+ label: {
108
+ class: [
109
+ 'relative',
110
+ 'w-max h-max items-start cursor-pointer',
111
+ 'flex items-start select-none text-xs font-normal',
112
+ 'text-grayscale-900',
113
+ 'shrink-0',
114
+ // Alignment
115
+ 'inline-flex',
116
+ 'align-bottom',
117
+ // Transitions
118
+ 'transition-all',
119
+ 'duration-200',
120
+ ],
121
+ },
122
+ labeltext: {
123
+ class: 'ml-1 leading-4',
124
+ },
125
+ tooltipicon: {
126
+ class: 'text-grayscale-900 w-[10px] h-[10px]',
127
+ },
100
128
  };
@@ -1,67 +0,0 @@
1
- declare namespace _default {
2
- function root({ props }: {
3
- props: any;
4
- }): {
5
- class: (string | {
6
- 'select-none pointer-events-none cursor-default': any;
7
- })[];
8
- };
9
- function slider({ props }: {
10
- props: any;
11
- }): {
12
- class: (string | {
13
- 'before:bg-white before:bg-white': boolean;
14
- 'before:bg-primary-200': boolean;
15
- 'before:bg-general-50': any;
16
- 'before:transform before:translate-x-3.5'?: undefined;
17
- 'border-primary-200'?: undefined;
18
- 'border-transparent'?: undefined;
19
- 'bg-white'?: undefined;
20
- 'bg-primary-500'?: undefined;
21
- 'bg-primary-100'?: undefined;
22
- 'bg-general-100'?: undefined;
23
- } | {
24
- 'before:transform before:translate-x-3.5': boolean;
25
- 'before:bg-white before:bg-white'?: undefined;
26
- 'before:bg-primary-200'?: undefined;
27
- 'before:bg-general-50'?: undefined;
28
- 'border-primary-200'?: undefined;
29
- 'border-transparent'?: undefined;
30
- 'bg-white'?: undefined;
31
- 'bg-primary-500'?: undefined;
32
- 'bg-primary-100'?: undefined;
33
- 'bg-general-100'?: undefined;
34
- } | {
35
- 'border-primary-200': boolean;
36
- 'border-transparent': boolean;
37
- 'before:bg-white before:bg-white'?: undefined;
38
- 'before:bg-primary-200'?: undefined;
39
- 'before:bg-general-50'?: undefined;
40
- 'before:transform before:translate-x-3.5'?: undefined;
41
- 'bg-white'?: undefined;
42
- 'bg-primary-500'?: undefined;
43
- 'bg-primary-100'?: undefined;
44
- 'bg-general-100'?: undefined;
45
- } | {
46
- 'bg-white': boolean;
47
- 'bg-primary-500': boolean;
48
- 'bg-primary-100': any;
49
- 'bg-general-100': any;
50
- 'before:bg-white before:bg-white'?: undefined;
51
- 'before:bg-primary-200'?: undefined;
52
- 'before:bg-general-50'?: undefined;
53
- 'before:transform before:translate-x-3.5'?: undefined;
54
- 'border-primary-200'?: undefined;
55
- 'border-transparent'?: undefined;
56
- })[];
57
- };
58
- function input({ props }: {
59
- props: any;
60
- }): {
61
- class: (string | {
62
- 'cursor-default': any;
63
- 'cursor-pointer': boolean;
64
- })[];
65
- };
66
- }
67
- export default _default;