@rovula/ui 0.0.9 → 0.0.10

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 (97) hide show
  1. package/dist/cjs/bundle.css +429 -3
  2. package/dist/cjs/bundle.js +1 -1
  3. package/dist/cjs/bundle.js.map +1 -1
  4. package/dist/cjs/types/components/AlertDialog/Alert.stories.d.ts +20 -0
  5. package/dist/cjs/types/components/AlertDialog/AlertDialog.d.ts +20 -0
  6. package/dist/cjs/types/components/Button/Button.styles.d.ts +1 -1
  7. package/dist/cjs/types/components/Checkbox/Checkbox.d.ts +4 -0
  8. package/dist/cjs/types/components/Checkbox/Checkbox.stories.d.ts +308 -0
  9. package/dist/cjs/types/components/Dialog/Dialog.d.ts +19 -0
  10. package/dist/cjs/types/components/Dialog/Dialog.stories.d.ts +25 -0
  11. package/dist/cjs/types/components/Input/Input.d.ts +5 -0
  12. package/dist/cjs/types/components/Input/Input.stories.d.ts +314 -0
  13. package/dist/cjs/types/components/Label/Label.d.ts +5 -0
  14. package/dist/cjs/types/components/Label/Label.stories.d.ts +286 -0
  15. package/dist/cjs/types/components/RadioGroup/RadioGroup.d.ts +5 -0
  16. package/dist/cjs/types/components/RadioGroup/RadioGroup.stories.d.ts +299 -0
  17. package/dist/cjs/types/components/Table/Datagrid.d.ts +11 -0
  18. package/dist/cjs/types/components/Table/Table.d.ts +10 -11
  19. package/dist/cjs/types/components/Table/Table.stories.d.ts +283 -0
  20. package/dist/cjs/types/components/Tabs/Tabs.d.ts +7 -5
  21. package/dist/cjs/types/components/Tabs/Tabs.stories.d.ts +49 -0
  22. package/dist/cjs/types/index.d.ts +7 -1
  23. package/dist/cjs/types/utils/cn.d.ts +2 -0
  24. package/dist/components/AlertDialog/Alert.stories.js +39 -0
  25. package/dist/components/AlertDialog/AlertDialog.js +73 -0
  26. package/dist/components/Button/Button.js +3 -3
  27. package/dist/components/Button/Button.styles.js +1 -1
  28. package/dist/components/Checkbox/Checkbox.js +37 -0
  29. package/dist/components/Checkbox/Checkbox.stories.js +49 -0
  30. package/dist/components/Dialog/Dialog.js +63 -0
  31. package/dist/components/Dialog/Dialog.stories.js +52 -0
  32. package/dist/components/Input/Input.js +31 -0
  33. package/dist/components/Input/Input.stories.js +37 -0
  34. package/dist/components/Label/Label.js +35 -0
  35. package/dist/components/Label/Label.stories.js +38 -0
  36. package/dist/components/RadioGroup/RadioGroup.js +41 -0
  37. package/dist/components/RadioGroup/RadioGroup.stories.js +44 -0
  38. package/dist/components/Table/Datagrid.js +6 -0
  39. package/dist/components/Table/Table.js +65 -5
  40. package/dist/components/Table/Table.stories.js +32 -0
  41. package/dist/components/Tabs/Tabs.js +10 -4
  42. package/dist/components/Tabs/Tabs.stories.js +60 -0
  43. package/dist/esm/bundle.css +429 -3
  44. package/dist/esm/bundle.js +1 -1
  45. package/dist/esm/bundle.js.map +1 -1
  46. package/dist/esm/types/components/AlertDialog/Alert.stories.d.ts +20 -0
  47. package/dist/esm/types/components/AlertDialog/AlertDialog.d.ts +20 -0
  48. package/dist/esm/types/components/Button/Button.styles.d.ts +1 -1
  49. package/dist/esm/types/components/Checkbox/Checkbox.d.ts +4 -0
  50. package/dist/esm/types/components/Checkbox/Checkbox.stories.d.ts +308 -0
  51. package/dist/esm/types/components/Dialog/Dialog.d.ts +19 -0
  52. package/dist/esm/types/components/Dialog/Dialog.stories.d.ts +25 -0
  53. package/dist/esm/types/components/Input/Input.d.ts +5 -0
  54. package/dist/esm/types/components/Input/Input.stories.d.ts +314 -0
  55. package/dist/esm/types/components/Label/Label.d.ts +5 -0
  56. package/dist/esm/types/components/Label/Label.stories.d.ts +286 -0
  57. package/dist/esm/types/components/RadioGroup/RadioGroup.d.ts +5 -0
  58. package/dist/esm/types/components/RadioGroup/RadioGroup.stories.d.ts +299 -0
  59. package/dist/esm/types/components/Table/Datagrid.d.ts +11 -0
  60. package/dist/esm/types/components/Table/Table.d.ts +10 -11
  61. package/dist/esm/types/components/Table/Table.stories.d.ts +283 -0
  62. package/dist/esm/types/components/Tabs/Tabs.d.ts +7 -5
  63. package/dist/esm/types/components/Tabs/Tabs.stories.d.ts +49 -0
  64. package/dist/esm/types/index.d.ts +7 -1
  65. package/dist/esm/types/utils/cn.d.ts +2 -0
  66. package/dist/index.d.ts +82 -28
  67. package/dist/index.js +7 -1
  68. package/dist/src/theme/global.css +511 -3
  69. package/dist/theme/global.css +57 -0
  70. package/dist/theme/main-preset.js +29 -1
  71. package/dist/theme/presets/colors.js +19 -0
  72. package/dist/utils/cn.js +9 -0
  73. package/package.json +9 -1
  74. package/src/components/AlertDialog/Alert.stories.tsx +67 -0
  75. package/src/components/AlertDialog/AlertDialog.tsx +142 -0
  76. package/src/components/Button/Button.styles.ts +1 -1
  77. package/src/components/Button/Button.tsx +4 -4
  78. package/src/components/Checkbox/Checkbox.stories.tsx +91 -0
  79. package/src/components/Checkbox/Checkbox.tsx +36 -0
  80. package/src/components/Dialog/Dialog.stories.tsx +118 -0
  81. package/src/components/Dialog/Dialog.tsx +119 -0
  82. package/src/components/Input/Input.stories.tsx +40 -0
  83. package/src/components/Input/Input.tsx +25 -0
  84. package/src/components/Label/Label.stories.tsx +45 -0
  85. package/src/components/Label/Label.tsx +26 -0
  86. package/src/components/RadioGroup/RadioGroup.stories.tsx +71 -0
  87. package/src/components/RadioGroup/RadioGroup.tsx +59 -0
  88. package/src/components/Table/Datagrid.tsx +36 -0
  89. package/src/components/Table/Table.stories.tsx +79 -0
  90. package/src/components/Table/Table.tsx +116 -35
  91. package/src/components/Tabs/Tabs.stories.tsx +75 -0
  92. package/src/components/Tabs/Tabs.tsx +39 -10
  93. package/src/index.ts +8 -1
  94. package/src/theme/global.css +57 -0
  95. package/src/theme/main-preset.js +29 -1
  96. package/src/theme/presets/colors.js +19 -0
  97. package/src/utils/cn.ts +6 -0
@@ -534,7 +534,62 @@ video {
534
534
  --input-disabled-background-color: 247 247 247;
535
535
 
536
536
  --input-label-background-color: 249 251 255;
537
+
538
+ /* Text */
539
+ --text-default-dark: 1 1 68;
540
+ --text-default-medium: 47 78 255;
541
+ --text-default-light: 213 230 255;
542
+
543
+ --text-grey-dark: 29 30 39;
544
+ --text-grey-medium: 117 121 128;
545
+ --text-grey-light: 164 169 178;
546
+ --text-white: 255 255 255;
547
+
548
+ /* Other/Popup */
549
+ --popup-background: 249 251 255;
550
+ /* Other/Popup Curtain */
551
+ --popup-overlay: 0 0 0;
552
+ --popup-overlay-alpha: 0.48;
553
+ --popup-rounded: 24px;
554
+
555
+ /* TODO for shadcn, wait for refactor */
556
+ /* --background: 0 0% 100%; */
557
+ --background: 220 100% 99%;
558
+ --foreground: 222.2 47.4% 11.2%;
559
+
560
+ --muted: 210 40% 96.1%;
561
+ --muted-foreground: 215.4 16.3% 46.9%;
562
+
563
+ --popover: 0 0% 100%;
564
+ --popover-foreground: 222.2 47.4% 11.2%;
565
+
566
+ --border: 214.3 31.8% 91.4%;
567
+ --input: 214.3 31.8% 91.4%;
568
+
569
+ --card: 0 0% 100%;
570
+ --card-foreground: 222.2 47.4% 11.2%;
571
+
572
+ --primary: var(--primary-default);
573
+
574
+ --secondary: var(--secondary-default);
575
+
576
+ --accent: 210 40% 96.1%;
577
+ --accent-foreground: 222.2 47.4% 11.2%;
578
+
579
+ --destructive: 0 100% 50%;
580
+ --destructive-foreground: 210 40% 98%;
581
+
582
+ --ring: 215 20.2% 65.1%;
583
+
584
+ --radius: 0.5rem;
537
585
  }
586
+ * {
587
+ border-color: hsl(var(--border));
588
+ }
589
+ body {
590
+ background-color: hsl(var(--background));
591
+ color: hsl(var(--foreground));
592
+ }
538
593
 
539
594
  *, ::before, ::after {
540
595
  --tw-border-spacing-x: 0;
@@ -643,15 +698,45 @@ video {
643
698
  --tw-contain-paint: ;
644
699
  --tw-contain-style: ;
645
700
  }
701
+ .container {
702
+ width: 100%;
703
+ margin-right: auto;
704
+ margin-left: auto;
705
+ padding-right: 2rem;
706
+ padding-left: 2rem;
707
+ }
708
+ @media (min-width: 1400px) {
709
+
710
+ .container {
711
+ max-width: 1400px;
712
+ }
713
+ }
714
+ .sr-only {
715
+ position: absolute;
716
+ width: 1px;
717
+ height: 1px;
718
+ padding: 0;
719
+ margin: -1px;
720
+ overflow: hidden;
721
+ clip: rect(0, 0, 0, 0);
722
+ white-space: nowrap;
723
+ border-width: 0;
724
+ }
646
725
  .pointer-events-none {
647
726
  pointer-events: none;
648
727
  }
728
+ .fixed {
729
+ position: fixed;
730
+ }
649
731
  .absolute {
650
732
  position: absolute;
651
733
  }
652
734
  .relative {
653
735
  position: relative;
654
736
  }
737
+ .inset-0 {
738
+ inset: 0px;
739
+ }
655
740
  .inset-y-0 {
656
741
  top: 0px;
657
742
  bottom: 0px;
@@ -668,15 +753,30 @@ video {
668
753
  .left-4 {
669
754
  left: 1rem;
670
755
  }
756
+ .left-\[50\%\] {
757
+ left: 50%;
758
+ }
671
759
  .right-0 {
672
760
  right: 0px;
673
761
  }
762
+ .right-4 {
763
+ right: 1rem;
764
+ }
765
+ .top-4 {
766
+ top: 1rem;
767
+ }
768
+ .top-\[50\%\] {
769
+ top: 50%;
770
+ }
674
771
  .z-10 {
675
772
  z-index: 10;
676
773
  }
677
774
  .z-50 {
678
775
  z-index: 50;
679
776
  }
777
+ .col-span-3 {
778
+ grid-column: span 3 / span 3;
779
+ }
680
780
  .mx-auto {
681
781
  margin-left: auto;
682
782
  margin-right: auto;
@@ -697,6 +797,12 @@ video {
697
797
  .mt-1 {
698
798
  margin-top: 0.25rem;
699
799
  }
800
+ .mt-2 {
801
+ margin-top: 0.5rem;
802
+ }
803
+ .mt-4 {
804
+ margin-top: 1rem;
805
+ }
700
806
  .mt-\[6px\] {
701
807
  margin-top: 6px;
702
808
  }
@@ -721,6 +827,17 @@ video {
721
827
  .hidden {
722
828
  display: none;
723
829
  }
830
+ .aspect-square {
831
+ aspect-ratio: 1 / 1;
832
+ }
833
+ .size-2 {
834
+ width: 0.5rem;
835
+ height: 0.5rem;
836
+ }
837
+ .size-2\.5 {
838
+ width: 0.625rem;
839
+ height: 0.625rem;
840
+ }
724
841
  .size-3 {
725
842
  width: 0.75rem;
726
843
  height: 0.75rem;
@@ -741,9 +858,27 @@ video {
741
858
  width: 14px;
742
859
  height: 14px;
743
860
  }
861
+ .h-10 {
862
+ height: 2.5rem;
863
+ }
864
+ .h-12 {
865
+ height: 3rem;
866
+ }
867
+ .h-4 {
868
+ height: 1rem;
869
+ }
870
+ .h-\[54px\] {
871
+ height: 54px;
872
+ }
744
873
  .max-h-60 {
745
874
  max-height: 15rem;
746
875
  }
876
+ .w-4 {
877
+ width: 1rem;
878
+ }
879
+ .w-\[100px\] {
880
+ width: 100px;
881
+ }
747
882
  .w-\[200px\] {
748
883
  width: 200px;
749
884
  }
@@ -759,6 +894,23 @@ video {
759
894
  .max-w-3xl {
760
895
  max-width: 48rem;
761
896
  }
897
+ .max-w-lg {
898
+ max-width: 32rem;
899
+ }
900
+ .shrink-0 {
901
+ flex-shrink: 0;
902
+ }
903
+ .caption-bottom {
904
+ caption-side: bottom;
905
+ }
906
+ .translate-x-\[-50\%\] {
907
+ --tw-translate-x: -50%;
908
+ 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));
909
+ }
910
+ .translate-y-\[-50\%\] {
911
+ --tw-translate-y: -50%;
912
+ 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));
913
+ }
762
914
  .rotate-180 {
763
915
  --tw-rotate: 180deg;
764
916
  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));
@@ -776,6 +928,9 @@ video {
776
928
  -moz-appearance: none;
777
929
  appearance: none;
778
930
  }
931
+ .grid-cols-4 {
932
+ grid-template-columns: repeat(4, minmax(0, 1fr));
933
+ }
779
934
  .grid-cols-\[auto_1fr\] {
780
935
  grid-template-columns: auto 1fr;
781
936
  }
@@ -785,6 +940,9 @@ video {
785
940
  .flex-col {
786
941
  flex-direction: column;
787
942
  }
943
+ .flex-col-reverse {
944
+ flex-direction: column-reverse;
945
+ }
788
946
  .items-center {
789
947
  align-items: center;
790
948
  }
@@ -794,12 +952,21 @@ video {
794
952
  .gap-1 {
795
953
  gap: 0.25rem;
796
954
  }
955
+ .gap-1\.5 {
956
+ gap: 0.375rem;
957
+ }
797
958
  .gap-2 {
798
959
  gap: 0.5rem;
799
960
  }
961
+ .gap-3 {
962
+ gap: 0.75rem;
963
+ }
800
964
  .gap-4 {
801
965
  gap: 1rem;
802
966
  }
967
+ .gap-6 {
968
+ gap: 1.5rem;
969
+ }
803
970
  .gap-x-8 {
804
971
  -moz-column-gap: 2rem;
805
972
  column-gap: 2rem;
@@ -810,6 +977,24 @@ video {
810
977
  .gap-y-6 {
811
978
  row-gap: 1.5rem;
812
979
  }
980
+ .space-x-2 > :not([hidden]) ~ :not([hidden]) {
981
+ --tw-space-x-reverse: 0;
982
+ margin-right: calc(0.5rem * var(--tw-space-x-reverse));
983
+ margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
984
+ }
985
+ .space-y-2 > :not([hidden]) ~ :not([hidden]) {
986
+ --tw-space-y-reverse: 0;
987
+ margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
988
+ margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
989
+ }
990
+ .space-y-4 > :not([hidden]) ~ :not([hidden]) {
991
+ --tw-space-y-reverse: 0;
992
+ margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
993
+ margin-bottom: calc(1rem * var(--tw-space-y-reverse));
994
+ }
995
+ .overflow-auto {
996
+ overflow: auto;
997
+ }
813
998
  .overflow-x-auto {
814
999
  overflow-x: auto;
815
1000
  }
@@ -835,16 +1020,16 @@ video {
835
1020
  border-radius: 9999px;
836
1021
  }
837
1022
  .rounded-lg {
838
- border-radius: 0.5rem;
1023
+ border-radius: var(--radius);
839
1024
  }
840
1025
  .rounded-md {
841
- border-radius: 0.375rem;
1026
+ border-radius: calc(var(--radius) - 2px);
842
1027
  }
843
1028
  .rounded-none {
844
1029
  border-radius: 0px;
845
1030
  }
846
1031
  .rounded-sm {
847
- border-radius: 0.125rem;
1032
+ border-radius: calc(var(--radius) - 4px);
848
1033
  }
849
1034
  .rounded-xl {
850
1035
  border-radius: 0.75rem;
@@ -855,9 +1040,18 @@ video {
855
1040
  .border-0 {
856
1041
  border-width: 0px;
857
1042
  }
1043
+ .border-b {
1044
+ border-bottom-width: 1px;
1045
+ }
858
1046
  .border-b-2 {
859
1047
  border-bottom-width: 2px;
860
1048
  }
1049
+ .border-b-\[3px\] {
1050
+ border-bottom-width: 3px;
1051
+ }
1052
+ .border-t {
1053
+ border-top-width: 1px;
1054
+ }
861
1055
  .border-error {
862
1056
  --tw-border-opacity: 1;
863
1057
  border-color: rgb(var(--error-100) / var(--tw-border-opacity));
@@ -878,10 +1072,22 @@ video {
878
1072
  --tw-border-opacity: 1;
879
1073
  border-color: rgb(var(--primary-default) / var(--tw-border-opacity));
880
1074
  }
1075
+ .border-primary-10 {
1076
+ --tw-border-opacity: 1;
1077
+ border-color: rgb(var(--primary-10) / var(--tw-border-opacity));
1078
+ }
1079
+ .border-primary-30 {
1080
+ --tw-border-opacity: 1;
1081
+ border-color: rgb(var(--primary-30) / var(--tw-border-opacity));
1082
+ }
881
1083
  .border-secondary {
882
1084
  --tw-border-opacity: 1;
883
1085
  border-color: rgb(var(--secondary-default) / var(--tw-border-opacity));
884
1086
  }
1087
+ .border-secondary-110 {
1088
+ --tw-border-opacity: 1;
1089
+ border-color: rgb(var(--secondary-110) / var(--tw-border-opacity));
1090
+ }
885
1091
  .border-success {
886
1092
  --tw-border-opacity: 1;
887
1093
  border-color: rgb(var(--success-default) / var(--tw-border-opacity));
@@ -890,6 +1096,10 @@ video {
890
1096
  --tw-border-opacity: 1;
891
1097
  border-color: rgb(var(--tertiary-120) / var(--tw-border-opacity));
892
1098
  }
1099
+ .border-textcolor-dark {
1100
+ --tw-border-opacity: 1;
1101
+ border-color: rgb(var(--text-default-dark) / var(--tw-border-opacity));
1102
+ }
893
1103
  .border-transparent {
894
1104
  border-color: transparent;
895
1105
  }
@@ -897,6 +1107,9 @@ video {
897
1107
  --tw-border-opacity: 1;
898
1108
  border-color: rgb(var(--warning-default) / var(--tw-border-opacity));
899
1109
  }
1110
+ .bg-background {
1111
+ background-color: hsl(var(--background));
1112
+ }
900
1113
  .bg-error {
901
1114
  --tw-bg-opacity: 1;
902
1115
  background-color: rgb(var(--error-100) / var(--tw-bg-opacity));
@@ -905,6 +1118,10 @@ video {
905
1118
  --tw-bg-opacity: 1;
906
1119
  background-color: rgb(229 231 235 / var(--tw-bg-opacity));
907
1120
  }
1121
+ .bg-grey2-300 {
1122
+ --tw-bg-opacity: 1;
1123
+ background-color: rgb(var(--grey2-300) / var(--tw-bg-opacity));
1124
+ }
908
1125
  .bg-info {
909
1126
  --tw-bg-opacity: 1;
910
1127
  background-color: rgb(var(--info-default) / var(--tw-bg-opacity));
@@ -913,6 +1130,13 @@ video {
913
1130
  --tw-bg-opacity: 1;
914
1131
  background-color: rgb(var(--input-label-background-color) / var(--tw-bg-opacity));
915
1132
  }
1133
+ .bg-popup-background {
1134
+ --tw-bg-opacity: 1;
1135
+ background-color: rgb(var(--popup-background) / var(--tw-bg-opacity));
1136
+ }
1137
+ .bg-popup-overlay {
1138
+ background-color: rgb(var(--popup-overlay) / var(--popup-overlay-alpha));
1139
+ }
916
1140
  .bg-primary {
917
1141
  --tw-bg-opacity: 1;
918
1142
  background-color: rgb(var(--primary-default) / var(--tw-bg-opacity));
@@ -944,6 +1168,9 @@ video {
944
1168
  --tw-bg-opacity: 1;
945
1169
  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
946
1170
  }
1171
+ .fill-current {
1172
+ fill: currentColor;
1173
+ }
947
1174
  .fill-error {
948
1175
  fill: rgb(var(--error-100) / 1);
949
1176
  }
@@ -959,6 +1186,9 @@ video {
959
1186
  .fill-input-text-disabled {
960
1187
  fill: rgb(var(--input-disabled-text-color) / 1);
961
1188
  }
1189
+ .fill-secondary-110 {
1190
+ fill: rgb(var(--secondary-110) / 1);
1191
+ }
962
1192
  .p-1 {
963
1193
  padding: 0.25rem;
964
1194
  }
@@ -971,6 +1201,16 @@ video {
971
1201
  .p-5 {
972
1202
  padding: 1.25rem;
973
1203
  }
1204
+ .p-6 {
1205
+ padding: 1.5rem;
1206
+ }
1207
+ .p-8 {
1208
+ padding: 2rem;
1209
+ }
1210
+ .px-1 {
1211
+ padding-left: 0.25rem;
1212
+ padding-right: 0.25rem;
1213
+ }
974
1214
  .px-3 {
975
1215
  padding-left: 0.75rem;
976
1216
  padding-right: 0.75rem;
@@ -1012,9 +1252,15 @@ video {
1012
1252
  .pe-\[48px\] {
1013
1253
  padding-inline-end: 48px;
1014
1254
  }
1255
+ .text-left {
1256
+ text-align: left;
1257
+ }
1015
1258
  .text-center {
1016
1259
  text-align: center;
1017
1260
  }
1261
+ .text-right {
1262
+ text-align: right;
1263
+ }
1018
1264
  .align-middle {
1019
1265
  vertical-align: middle;
1020
1266
  }
@@ -1143,13 +1389,22 @@ video {
1143
1389
  .capitalize {
1144
1390
  text-transform: capitalize;
1145
1391
  }
1392
+ .leading-none {
1393
+ line-height: 1;
1394
+ }
1146
1395
  .tracking-\[\.02857em\] {
1147
1396
  letter-spacing: .02857em;
1148
1397
  }
1398
+ .tracking-tight {
1399
+ letter-spacing: -0.025em;
1400
+ }
1149
1401
  .text-black {
1150
1402
  --tw-text-opacity: 1;
1151
1403
  color: rgb(0 0 0 / var(--tw-text-opacity));
1152
1404
  }
1405
+ .text-current {
1406
+ color: currentColor;
1407
+ }
1153
1408
  .text-error {
1154
1409
  --tw-text-opacity: 1;
1155
1410
  color: rgb(var(--error-100) / var(--tw-text-opacity));
@@ -1186,6 +1441,10 @@ video {
1186
1441
  --tw-text-opacity: 1;
1187
1442
  color: rgb(var(--primary-foreground) / var(--tw-text-opacity));
1188
1443
  }
1444
+ .text-secondary-110 {
1445
+ --tw-text-opacity: 1;
1446
+ color: rgb(var(--secondary-110) / var(--tw-text-opacity));
1447
+ }
1189
1448
  .text-secondary-130 {
1190
1449
  --tw-text-opacity: 1;
1191
1450
  color: rgb(var(--secondary-130) / var(--tw-text-opacity));
@@ -1210,6 +1469,18 @@ video {
1210
1469
  --tw-text-opacity: 1;
1211
1470
  color: rgb(var(--tertiary-foreground) / var(--tw-text-opacity));
1212
1471
  }
1472
+ .text-textcolor-dark {
1473
+ --tw-text-opacity: 1;
1474
+ color: rgb(var(--text-default-dark) / var(--tw-text-opacity));
1475
+ }
1476
+ .text-textcolor-grey-dark {
1477
+ --tw-text-opacity: 1;
1478
+ color: rgb(var(--text-grey-dark) / var(--tw-text-opacity));
1479
+ }
1480
+ .text-textcolor-grey-light {
1481
+ --tw-text-opacity: 1;
1482
+ color: rgb(var(--text-grey-light) / var(--tw-text-opacity));
1483
+ }
1213
1484
  .text-warning {
1214
1485
  --tw-text-opacity: 1;
1215
1486
  color: rgb(var(--warning-default) / var(--tw-text-opacity));
@@ -1231,6 +1502,14 @@ video {
1231
1502
  .underline-offset-4 {
1232
1503
  text-underline-offset: 4px;
1233
1504
  }
1505
+ .opacity-70 {
1506
+ opacity: 0.7;
1507
+ }
1508
+ .shadow-lg {
1509
+ --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
1510
+ --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
1511
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
1512
+ }
1234
1513
  .shadow-md {
1235
1514
  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
1236
1515
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
@@ -1243,6 +1522,11 @@ video {
1243
1522
  .outline {
1244
1523
  outline-style: solid;
1245
1524
  }
1525
+ .ring {
1526
+ --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1527
+ --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
1528
+ box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
1529
+ }
1246
1530
  .ring-1 {
1247
1531
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1248
1532
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
@@ -1263,6 +1547,9 @@ video {
1263
1547
  --tw-ring-opacity: 1;
1264
1548
  --tw-ring-color: rgb(var(--input-disabled-stroke-color) / var(--tw-ring-opacity));
1265
1549
  }
1550
+ .ring-offset-background {
1551
+ --tw-ring-offset-color: hsl(var(--background));
1552
+ }
1266
1553
  .filter {
1267
1554
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
1268
1555
  }
@@ -1276,12 +1563,23 @@ video {
1276
1563
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1277
1564
  transition-duration: 150ms;
1278
1565
  }
1566
+ .transition-opacity {
1567
+ transition-property: opacity;
1568
+ transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1569
+ transition-duration: 150ms;
1570
+ }
1571
+ .duration-200 {
1572
+ transition-duration: 200ms;
1573
+ }
1279
1574
  .duration-300 {
1280
1575
  transition-duration: 300ms;
1281
1576
  }
1282
1577
  .ease-in-out {
1283
1578
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1284
1579
  }
1580
+ .ease-out {
1581
+ transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
1582
+ }
1285
1583
  .typography-h1 {
1286
1584
  font-size: 64px;
1287
1585
  line-height: 80px;
@@ -1387,6 +1685,19 @@ video {
1387
1685
  line-height: 10px;
1388
1686
  font-weight: 400;
1389
1687
  }
1688
+ .file\:border-0::file-selector-button {
1689
+ border-width: 0px;
1690
+ }
1691
+ .file\:bg-transparent::file-selector-button {
1692
+ background-color: transparent;
1693
+ }
1694
+ .file\:text-sm::file-selector-button {
1695
+ font-size: 0.875rem;
1696
+ line-height: 1.25rem;
1697
+ }
1698
+ .file\:font-medium::file-selector-button {
1699
+ font-weight: 500;
1700
+ }
1390
1701
  .placeholder\:text-input-text-disabled::-moz-placeholder {
1391
1702
  --tw-text-opacity: 1;
1392
1703
  color: rgb(var(--input-disabled-text-color) / var(--tw-text-opacity));
@@ -1457,9 +1768,16 @@ video {
1457
1768
  .hover\:fill-input-text:hover {
1458
1769
  fill: rgb(var(--input-default-text-color) / 1);
1459
1770
  }
1771
+ .hover\:text-textcolor-dark:hover {
1772
+ --tw-text-opacity: 1;
1773
+ color: rgb(var(--text-default-dark) / var(--tw-text-opacity));
1774
+ }
1460
1775
  .hover\:text-opacity-80:hover {
1461
1776
  --tw-text-opacity: 0.8;
1462
1777
  }
1778
+ .hover\:opacity-100:hover {
1779
+ opacity: 1;
1780
+ }
1463
1781
  .focus\:border-input-stroke:focus {
1464
1782
  --tw-border-opacity: 1;
1465
1783
  border-color: rgb(var(--input-default-stroke-color) / var(--tw-border-opacity));
@@ -1473,11 +1791,20 @@ video {
1473
1791
  .focus\:pe-8:focus {
1474
1792
  padding-inline-end: 2rem;
1475
1793
  }
1794
+ .focus\:outline-none:focus {
1795
+ outline: 2px solid transparent;
1796
+ outline-offset: 2px;
1797
+ }
1476
1798
  .focus\:ring-1:focus {
1477
1799
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1478
1800
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
1479
1801
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
1480
1802
  }
1803
+ .focus\:ring-2:focus {
1804
+ --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1805
+ --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
1806
+ box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
1807
+ }
1481
1808
  .focus\:ring-inset:focus {
1482
1809
  --tw-ring-inset: inset;
1483
1810
  }
@@ -1489,11 +1816,48 @@ video {
1489
1816
  --tw-ring-opacity: 1;
1490
1817
  --tw-ring-color: rgb(var(--input-active-stroke-color) / var(--tw-ring-opacity));
1491
1818
  }
1819
+ .focus\:ring-ring:focus {
1820
+ --tw-ring-color: hsl(var(--ring));
1821
+ }
1822
+ .focus\:ring-offset-2:focus {
1823
+ --tw-ring-offset-width: 2px;
1824
+ }
1825
+ .focus-visible\:outline-none:focus-visible {
1826
+ outline: 2px solid transparent;
1827
+ outline-offset: 2px;
1828
+ }
1829
+ .focus-visible\:ring-2:focus-visible {
1830
+ --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1831
+ --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
1832
+ box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
1833
+ }
1834
+ .focus-visible\:ring-ring:focus-visible {
1835
+ --tw-ring-color: hsl(var(--ring));
1836
+ }
1837
+ .focus-visible\:ring-offset-2:focus-visible {
1838
+ --tw-ring-offset-width: 2px;
1839
+ }
1492
1840
  .active\:scale-\[98\%\]:active {
1493
1841
  --tw-scale-x: 98%;
1494
1842
  --tw-scale-y: 98%;
1495
1843
  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));
1496
1844
  }
1845
+ .disabled\:pointer-events-none:disabled {
1846
+ pointer-events: none;
1847
+ }
1848
+ .disabled\:cursor-not-allowed:disabled {
1849
+ cursor: not-allowed;
1850
+ }
1851
+ .disabled\:border-secondary-110:disabled {
1852
+ --tw-border-opacity: 1;
1853
+ border-color: rgb(var(--secondary-110) / var(--tw-border-opacity));
1854
+ }
1855
+ .disabled\:fill-secondary-110:disabled {
1856
+ fill: rgb(var(--secondary-110) / 1);
1857
+ }
1858
+ .disabled\:opacity-50:disabled {
1859
+ opacity: 0.5;
1860
+ }
1497
1861
  .peer:-moz-placeholder-shown ~ .peer-placeholder-shown\:top-2 {
1498
1862
  top: 0.5rem;
1499
1863
  }
@@ -1569,6 +1933,12 @@ video {
1569
1933
  line-height: 10px;
1570
1934
  font-weight: 400;
1571
1935
  }
1936
+ .peer:disabled ~ .peer-disabled\:cursor-not-allowed {
1937
+ cursor: not-allowed;
1938
+ }
1939
+ .peer:disabled ~ .peer-disabled\:opacity-70 {
1940
+ opacity: 0.7;
1941
+ }
1572
1942
  .aria-disabled\:pointer-events-none[aria-disabled="true"] {
1573
1943
  pointer-events: none;
1574
1944
  }
@@ -1577,4 +1947,60 @@ video {
1577
1947
  }
1578
1948
  .aria-disabled\:opacity-50[aria-disabled="true"] {
1579
1949
  opacity: 0.5;
1950
+ }
1951
+ .data-\[state\=checked\]\:border-primary[data-state=checked] {
1952
+ --tw-border-opacity: 1;
1953
+ border-color: rgb(var(--primary-default) / var(--tw-border-opacity));
1954
+ }
1955
+ .data-\[state\=checked\]\:bg-primary[data-state=checked] {
1956
+ --tw-bg-opacity: 1;
1957
+ background-color: rgb(var(--primary-default) / var(--tw-bg-opacity));
1958
+ }
1959
+ .data-\[state\=checked\]\:text-primary-foreground[data-state=checked] {
1960
+ --tw-text-opacity: 1;
1961
+ color: rgb(var(--primary-foreground) / var(--tw-text-opacity));
1962
+ }
1963
+ @media (min-width: 640px) {
1964
+
1965
+ .sm\:mt-0 {
1966
+ margin-top: 0px;
1967
+ }
1968
+
1969
+ .sm\:max-w-\[425px\] {
1970
+ max-width: 425px;
1971
+ }
1972
+
1973
+ .sm\:flex-row {
1974
+ flex-direction: row;
1975
+ }
1976
+
1977
+ .sm\:justify-end {
1978
+ justify-content: flex-end;
1979
+ }
1980
+
1981
+ .sm\:space-x-2 > :not([hidden]) ~ :not([hidden]) {
1982
+ --tw-space-x-reverse: 0;
1983
+ margin-right: calc(0.5rem * var(--tw-space-x-reverse));
1984
+ margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
1985
+ }
1986
+
1987
+ .sm\:rounded-\[var\(--popup-rounded\)\] {
1988
+ border-radius: var(--popup-rounded);
1989
+ }
1990
+
1991
+ .sm\:text-left {
1992
+ text-align: left;
1993
+ }
1994
+ }
1995
+ .\[\&\:has\(\[role\=checkbox\]\)\]\:pr-0:has([role=checkbox]) {
1996
+ padding-right: 0px;
1997
+ }
1998
+ .\[\&\>tr\]\:last\:border-b-0:last-child>tr {
1999
+ border-bottom-width: 0px;
2000
+ }
2001
+ .\[\&_tr\:last-child\]\:border-0 tr:last-child {
2002
+ border-width: 0px;
2003
+ }
2004
+ .\[\&_tr\]\:border-b tr {
2005
+ border-bottom-width: 1px;
1580
2006
  }