@rovula/ui 0.0.8 → 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 (129) hide show
  1. package/dist/cjs/bundle.css +497 -4
  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/Dropdown/Dropdown.d.ts +26 -0
  12. package/dist/cjs/types/components/Dropdown/Dropdown.stories.d.ts +367 -0
  13. package/dist/cjs/types/components/Dropdown/Dropdown.styles.d.ts +11 -0
  14. package/dist/cjs/types/components/Input/Input.d.ts +5 -0
  15. package/dist/cjs/types/components/Input/Input.stories.d.ts +314 -0
  16. package/dist/cjs/types/components/Label/Label.d.ts +5 -0
  17. package/dist/cjs/types/components/Label/Label.stories.d.ts +286 -0
  18. package/dist/cjs/types/components/RadioGroup/RadioGroup.d.ts +5 -0
  19. package/dist/cjs/types/components/RadioGroup/RadioGroup.stories.d.ts +299 -0
  20. package/dist/cjs/types/components/Table/Datagrid.d.ts +11 -0
  21. package/dist/cjs/types/components/Table/Table.d.ts +10 -11
  22. package/dist/cjs/types/components/Table/Table.stories.d.ts +283 -0
  23. package/dist/cjs/types/components/Tabs/Tabs.d.ts +7 -5
  24. package/dist/cjs/types/components/Tabs/Tabs.stories.d.ts +49 -0
  25. package/dist/cjs/types/components/TextInput/TextInput.d.ts +3 -2
  26. package/dist/cjs/types/components/TextInput/TextInput.stories.d.ts +2 -16
  27. package/dist/cjs/types/index.d.ts +8 -2
  28. package/dist/cjs/types/utils/cn.d.ts +2 -0
  29. package/dist/components/AlertDialog/Alert.stories.js +39 -0
  30. package/dist/components/AlertDialog/AlertDialog.js +73 -0
  31. package/dist/components/Button/Button.js +3 -3
  32. package/dist/components/Button/Button.styles.js +1 -1
  33. package/dist/components/Checkbox/Checkbox.js +37 -0
  34. package/dist/components/Checkbox/Checkbox.stories.js +49 -0
  35. package/dist/components/Dialog/Dialog.js +63 -0
  36. package/dist/components/Dialog/Dialog.stories.js +52 -0
  37. package/dist/components/Dropdown/Dropdown.js +58 -0
  38. package/dist/components/{Select/Select.stories.js → Dropdown/Dropdown.stories.js} +8 -11
  39. package/dist/components/Dropdown/Dropdown.styles.js +47 -0
  40. package/dist/components/Input/Input.js +31 -0
  41. package/dist/components/Input/Input.stories.js +37 -0
  42. package/dist/components/Label/Label.js +35 -0
  43. package/dist/components/Label/Label.stories.js +38 -0
  44. package/dist/components/RadioGroup/RadioGroup.js +41 -0
  45. package/dist/components/RadioGroup/RadioGroup.stories.js +44 -0
  46. package/dist/components/Table/Datagrid.js +6 -0
  47. package/dist/components/Table/Table.js +65 -5
  48. package/dist/components/Table/Table.stories.js +32 -0
  49. package/dist/components/Tabs/Tabs.js +10 -4
  50. package/dist/components/Tabs/Tabs.stories.js +60 -0
  51. package/dist/components/TextInput/TextInput.js +3 -3
  52. package/dist/esm/bundle.css +497 -4
  53. package/dist/esm/bundle.js +1 -1
  54. package/dist/esm/bundle.js.map +1 -1
  55. package/dist/esm/types/components/AlertDialog/Alert.stories.d.ts +20 -0
  56. package/dist/esm/types/components/AlertDialog/AlertDialog.d.ts +20 -0
  57. package/dist/esm/types/components/Button/Button.styles.d.ts +1 -1
  58. package/dist/esm/types/components/Checkbox/Checkbox.d.ts +4 -0
  59. package/dist/esm/types/components/Checkbox/Checkbox.stories.d.ts +308 -0
  60. package/dist/esm/types/components/Dialog/Dialog.d.ts +19 -0
  61. package/dist/esm/types/components/Dialog/Dialog.stories.d.ts +25 -0
  62. package/dist/esm/types/components/Dropdown/Dropdown.d.ts +26 -0
  63. package/dist/esm/types/components/Dropdown/Dropdown.stories.d.ts +367 -0
  64. package/dist/esm/types/components/Dropdown/Dropdown.styles.d.ts +11 -0
  65. package/dist/esm/types/components/Input/Input.d.ts +5 -0
  66. package/dist/esm/types/components/Input/Input.stories.d.ts +314 -0
  67. package/dist/esm/types/components/Label/Label.d.ts +5 -0
  68. package/dist/esm/types/components/Label/Label.stories.d.ts +286 -0
  69. package/dist/esm/types/components/RadioGroup/RadioGroup.d.ts +5 -0
  70. package/dist/esm/types/components/RadioGroup/RadioGroup.stories.d.ts +299 -0
  71. package/dist/esm/types/components/Table/Datagrid.d.ts +11 -0
  72. package/dist/esm/types/components/Table/Table.d.ts +10 -11
  73. package/dist/esm/types/components/Table/Table.stories.d.ts +283 -0
  74. package/dist/esm/types/components/Tabs/Tabs.d.ts +7 -5
  75. package/dist/esm/types/components/Tabs/Tabs.stories.d.ts +49 -0
  76. package/dist/esm/types/components/TextInput/TextInput.d.ts +3 -2
  77. package/dist/esm/types/components/TextInput/TextInput.stories.d.ts +2 -16
  78. package/dist/esm/types/index.d.ts +8 -2
  79. package/dist/esm/types/utils/cn.d.ts +2 -0
  80. package/dist/index.d.ts +88 -30
  81. package/dist/index.js +8 -2
  82. package/dist/src/theme/global.css +598 -4
  83. package/dist/theme/global.css +57 -0
  84. package/dist/theme/main-preset.js +29 -1
  85. package/dist/theme/presets/colors.js +19 -0
  86. package/dist/utils/cn.js +9 -0
  87. package/package.json +9 -1
  88. package/src/components/AlertDialog/Alert.stories.tsx +67 -0
  89. package/src/components/AlertDialog/AlertDialog.tsx +142 -0
  90. package/src/components/Button/Button.styles.ts +1 -1
  91. package/src/components/Button/Button.tsx +4 -4
  92. package/src/components/Checkbox/Checkbox.stories.tsx +91 -0
  93. package/src/components/Checkbox/Checkbox.tsx +36 -0
  94. package/src/components/Dialog/Dialog.stories.tsx +118 -0
  95. package/src/components/Dialog/Dialog.tsx +119 -0
  96. package/src/components/{Select/Select.stories.tsx → Dropdown/Dropdown.stories.tsx} +11 -14
  97. package/src/components/Dropdown/Dropdown.styles.ts +54 -0
  98. package/src/components/Dropdown/Dropdown.tsx +151 -0
  99. package/src/components/Input/Input.stories.tsx +40 -0
  100. package/src/components/Input/Input.tsx +25 -0
  101. package/src/components/Label/Label.stories.tsx +45 -0
  102. package/src/components/Label/Label.tsx +26 -0
  103. package/src/components/RadioGroup/RadioGroup.stories.tsx +71 -0
  104. package/src/components/RadioGroup/RadioGroup.tsx +59 -0
  105. package/src/components/Table/Datagrid.tsx +36 -0
  106. package/src/components/Table/Table.stories.tsx +79 -0
  107. package/src/components/Table/Table.tsx +116 -35
  108. package/src/components/Tabs/Tabs.stories.tsx +75 -0
  109. package/src/components/Tabs/Tabs.tsx +39 -10
  110. package/src/components/TextInput/TextInput.tsx +11 -2
  111. package/src/index.ts +9 -2
  112. package/src/theme/global.css +57 -0
  113. package/src/theme/main-preset.js +29 -1
  114. package/src/theme/presets/colors.js +19 -0
  115. package/src/utils/cn.ts +6 -0
  116. package/dist/cjs/types/components/Select/Select copy.d.ts +0 -23
  117. package/dist/cjs/types/components/Select/Select.d.ts +0 -23
  118. package/dist/cjs/types/components/Select/Select.stories.d.ts +0 -348
  119. package/dist/cjs/types/components/Select/Select.styles.d.ts +0 -14
  120. package/dist/components/Select/Select copy.js +0 -42
  121. package/dist/components/Select/Select.js +0 -21
  122. package/dist/components/Select/Select.styles.js +0 -100
  123. package/dist/esm/types/components/Select/Select copy.d.ts +0 -23
  124. package/dist/esm/types/components/Select/Select.d.ts +0 -23
  125. package/dist/esm/types/components/Select/Select.stories.d.ts +0 -348
  126. package/dist/esm/types/components/Select/Select.styles.d.ts +0 -14
  127. package/src/components/Select/Select copy.tsx +0 -103
  128. package/src/components/Select/Select.styles.ts +0 -111
  129. package/src/components/Select/Select.tsx +0 -54
@@ -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,18 +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
  }
674
- .top-2 {
675
- top: 0.5rem;
762
+ .right-4 {
763
+ right: 1rem;
676
764
  }
677
765
  .top-4 {
678
766
  top: 1rem;
679
767
  }
768
+ .top-\[50\%\] {
769
+ top: 50%;
770
+ }
771
+ .z-10 {
772
+ z-index: 10;
773
+ }
680
774
  .z-50 {
681
775
  z-index: 50;
682
776
  }
777
+ .col-span-3 {
778
+ grid-column: span 3 / span 3;
779
+ }
683
780
  .mx-auto {
684
781
  margin-left: auto;
685
782
  margin-right: auto;
@@ -700,6 +797,12 @@ video {
700
797
  .mt-1 {
701
798
  margin-top: 0.25rem;
702
799
  }
800
+ .mt-2 {
801
+ margin-top: 0.5rem;
802
+ }
803
+ .mt-4 {
804
+ margin-top: 1rem;
805
+ }
703
806
  .mt-\[6px\] {
704
807
  margin-top: 6px;
705
808
  }
@@ -724,6 +827,17 @@ video {
724
827
  .hidden {
725
828
  display: none;
726
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
+ }
727
841
  .size-3 {
728
842
  width: 0.75rem;
729
843
  height: 0.75rem;
@@ -736,6 +850,35 @@ video {
736
850
  width: 1.25rem;
737
851
  height: 1.25rem;
738
852
  }
853
+ .size-6 {
854
+ width: 1.5rem;
855
+ height: 1.5rem;
856
+ }
857
+ .size-\[14px\] {
858
+ width: 14px;
859
+ height: 14px;
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
+ }
873
+ .max-h-60 {
874
+ max-height: 15rem;
875
+ }
876
+ .w-4 {
877
+ width: 1rem;
878
+ }
879
+ .w-\[100px\] {
880
+ width: 100px;
881
+ }
739
882
  .w-\[200px\] {
740
883
  width: 200px;
741
884
  }
@@ -751,6 +894,27 @@ video {
751
894
  .max-w-3xl {
752
895
  max-width: 48rem;
753
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
+ }
914
+ .rotate-180 {
915
+ --tw-rotate: 180deg;
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));
917
+ }
754
918
  .cursor-pointer {
755
919
  cursor: pointer;
756
920
  }
@@ -764,6 +928,9 @@ video {
764
928
  -moz-appearance: none;
765
929
  appearance: none;
766
930
  }
931
+ .grid-cols-4 {
932
+ grid-template-columns: repeat(4, minmax(0, 1fr));
933
+ }
767
934
  .grid-cols-\[auto_1fr\] {
768
935
  grid-template-columns: auto 1fr;
769
936
  }
@@ -773,6 +940,9 @@ video {
773
940
  .flex-col {
774
941
  flex-direction: column;
775
942
  }
943
+ .flex-col-reverse {
944
+ flex-direction: column-reverse;
945
+ }
776
946
  .items-center {
777
947
  align-items: center;
778
948
  }
@@ -782,12 +952,21 @@ video {
782
952
  .gap-1 {
783
953
  gap: 0.25rem;
784
954
  }
955
+ .gap-1\.5 {
956
+ gap: 0.375rem;
957
+ }
785
958
  .gap-2 {
786
959
  gap: 0.5rem;
787
960
  }
961
+ .gap-3 {
962
+ gap: 0.75rem;
963
+ }
788
964
  .gap-4 {
789
965
  gap: 1rem;
790
966
  }
967
+ .gap-6 {
968
+ gap: 1.5rem;
969
+ }
791
970
  .gap-x-8 {
792
971
  -moz-column-gap: 2rem;
793
972
  column-gap: 2rem;
@@ -798,9 +977,30 @@ video {
798
977
  .gap-y-6 {
799
978
  row-gap: 1.5rem;
800
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
+ }
801
998
  .overflow-x-auto {
802
999
  overflow-x: auto;
803
1000
  }
1001
+ .overflow-y-auto {
1002
+ overflow-y: auto;
1003
+ }
804
1004
  .whitespace-nowrap {
805
1005
  white-space: nowrap;
806
1006
  }
@@ -820,13 +1020,16 @@ video {
820
1020
  border-radius: 9999px;
821
1021
  }
822
1022
  .rounded-lg {
823
- border-radius: 0.5rem;
1023
+ border-radius: var(--radius);
1024
+ }
1025
+ .rounded-md {
1026
+ border-radius: calc(var(--radius) - 2px);
824
1027
  }
825
1028
  .rounded-none {
826
1029
  border-radius: 0px;
827
1030
  }
828
1031
  .rounded-sm {
829
- border-radius: 0.125rem;
1032
+ border-radius: calc(var(--radius) - 4px);
830
1033
  }
831
1034
  .rounded-xl {
832
1035
  border-radius: 0.75rem;
@@ -837,13 +1040,26 @@ video {
837
1040
  .border-0 {
838
1041
  border-width: 0px;
839
1042
  }
1043
+ .border-b {
1044
+ border-bottom-width: 1px;
1045
+ }
840
1046
  .border-b-2 {
841
1047
  border-bottom-width: 2px;
842
1048
  }
1049
+ .border-b-\[3px\] {
1050
+ border-bottom-width: 3px;
1051
+ }
1052
+ .border-t {
1053
+ border-top-width: 1px;
1054
+ }
843
1055
  .border-error {
844
1056
  --tw-border-opacity: 1;
845
1057
  border-color: rgb(var(--error-100) / var(--tw-border-opacity));
846
1058
  }
1059
+ .border-gray-300 {
1060
+ --tw-border-opacity: 1;
1061
+ border-color: rgb(209 213 219 / var(--tw-border-opacity));
1062
+ }
847
1063
  .border-info {
848
1064
  --tw-border-opacity: 1;
849
1065
  border-color: rgb(var(--info-default) / var(--tw-border-opacity));
@@ -856,10 +1072,22 @@ video {
856
1072
  --tw-border-opacity: 1;
857
1073
  border-color: rgb(var(--primary-default) / var(--tw-border-opacity));
858
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
+ }
859
1083
  .border-secondary {
860
1084
  --tw-border-opacity: 1;
861
1085
  border-color: rgb(var(--secondary-default) / var(--tw-border-opacity));
862
1086
  }
1087
+ .border-secondary-110 {
1088
+ --tw-border-opacity: 1;
1089
+ border-color: rgb(var(--secondary-110) / var(--tw-border-opacity));
1090
+ }
863
1091
  .border-success {
864
1092
  --tw-border-opacity: 1;
865
1093
  border-color: rgb(var(--success-default) / var(--tw-border-opacity));
@@ -868,6 +1096,10 @@ video {
868
1096
  --tw-border-opacity: 1;
869
1097
  border-color: rgb(var(--tertiary-120) / var(--tw-border-opacity));
870
1098
  }
1099
+ .border-textcolor-dark {
1100
+ --tw-border-opacity: 1;
1101
+ border-color: rgb(var(--text-default-dark) / var(--tw-border-opacity));
1102
+ }
871
1103
  .border-transparent {
872
1104
  border-color: transparent;
873
1105
  }
@@ -875,10 +1107,21 @@ video {
875
1107
  --tw-border-opacity: 1;
876
1108
  border-color: rgb(var(--warning-default) / var(--tw-border-opacity));
877
1109
  }
1110
+ .bg-background {
1111
+ background-color: hsl(var(--background));
1112
+ }
878
1113
  .bg-error {
879
1114
  --tw-bg-opacity: 1;
880
1115
  background-color: rgb(var(--error-100) / var(--tw-bg-opacity));
881
1116
  }
1117
+ .bg-gray-200 {
1118
+ --tw-bg-opacity: 1;
1119
+ background-color: rgb(229 231 235 / var(--tw-bg-opacity));
1120
+ }
1121
+ .bg-grey2-300 {
1122
+ --tw-bg-opacity: 1;
1123
+ background-color: rgb(var(--grey2-300) / var(--tw-bg-opacity));
1124
+ }
882
1125
  .bg-info {
883
1126
  --tw-bg-opacity: 1;
884
1127
  background-color: rgb(var(--info-default) / var(--tw-bg-opacity));
@@ -887,6 +1130,13 @@ video {
887
1130
  --tw-bg-opacity: 1;
888
1131
  background-color: rgb(var(--input-label-background-color) / var(--tw-bg-opacity));
889
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
+ }
890
1140
  .bg-primary {
891
1141
  --tw-bg-opacity: 1;
892
1142
  background-color: rgb(var(--primary-default) / var(--tw-bg-opacity));
@@ -914,12 +1164,31 @@ video {
914
1164
  --tw-bg-opacity: 1;
915
1165
  background-color: rgb(var(--warning-default) / var(--tw-bg-opacity));
916
1166
  }
1167
+ .bg-white {
1168
+ --tw-bg-opacity: 1;
1169
+ background-color: rgb(255 255 255 / var(--tw-bg-opacity));
1170
+ }
1171
+ .fill-current {
1172
+ fill: currentColor;
1173
+ }
917
1174
  .fill-error {
918
1175
  fill: rgb(var(--error-100) / 1);
919
1176
  }
920
1177
  .fill-input-stroke-active {
921
1178
  fill: rgb(var(--input-active-stroke-color) / 1);
922
1179
  }
1180
+ .fill-input-text {
1181
+ fill: rgb(var(--input-default-text-color) / 1);
1182
+ }
1183
+ .fill-input-text-active {
1184
+ fill: rgb(var(--input-active-text-color) / 1);
1185
+ }
1186
+ .fill-input-text-disabled {
1187
+ fill: rgb(var(--input-disabled-text-color) / 1);
1188
+ }
1189
+ .fill-secondary-110 {
1190
+ fill: rgb(var(--secondary-110) / 1);
1191
+ }
923
1192
  .p-1 {
924
1193
  padding: 0.25rem;
925
1194
  }
@@ -932,6 +1201,16 @@ video {
932
1201
  .p-5 {
933
1202
  padding: 1.25rem;
934
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
+ }
935
1214
  .px-3 {
936
1215
  padding-left: 0.75rem;
937
1216
  padding-right: 0.75rem;
@@ -952,6 +1231,10 @@ video {
952
1231
  padding-top: 0.25rem;
953
1232
  padding-bottom: 0.25rem;
954
1233
  }
1234
+ .py-14 {
1235
+ padding-top: 3.5rem;
1236
+ padding-bottom: 3.5rem;
1237
+ }
955
1238
  .py-2 {
956
1239
  padding-top: 0.5rem;
957
1240
  padding-bottom: 0.5rem;
@@ -960,6 +1243,24 @@ video {
960
1243
  padding-top: 1rem;
961
1244
  padding-bottom: 1rem;
962
1245
  }
1246
+ .pe-\[30px\] {
1247
+ padding-inline-end: 30px;
1248
+ }
1249
+ .pe-\[40px\] {
1250
+ padding-inline-end: 40px;
1251
+ }
1252
+ .pe-\[48px\] {
1253
+ padding-inline-end: 48px;
1254
+ }
1255
+ .text-left {
1256
+ text-align: left;
1257
+ }
1258
+ .text-center {
1259
+ text-align: center;
1260
+ }
1261
+ .text-right {
1262
+ text-align: right;
1263
+ }
963
1264
  .align-middle {
964
1265
  vertical-align: middle;
965
1266
  }
@@ -1088,13 +1389,22 @@ video {
1088
1389
  .capitalize {
1089
1390
  text-transform: capitalize;
1090
1391
  }
1392
+ .leading-none {
1393
+ line-height: 1;
1394
+ }
1091
1395
  .tracking-\[\.02857em\] {
1092
1396
  letter-spacing: .02857em;
1093
1397
  }
1398
+ .tracking-tight {
1399
+ letter-spacing: -0.025em;
1400
+ }
1094
1401
  .text-black {
1095
1402
  --tw-text-opacity: 1;
1096
1403
  color: rgb(0 0 0 / var(--tw-text-opacity));
1097
1404
  }
1405
+ .text-current {
1406
+ color: currentColor;
1407
+ }
1098
1408
  .text-error {
1099
1409
  --tw-text-opacity: 1;
1100
1410
  color: rgb(var(--error-100) / var(--tw-text-opacity));
@@ -1131,6 +1441,10 @@ video {
1131
1441
  --tw-text-opacity: 1;
1132
1442
  color: rgb(var(--primary-foreground) / var(--tw-text-opacity));
1133
1443
  }
1444
+ .text-secondary-110 {
1445
+ --tw-text-opacity: 1;
1446
+ color: rgb(var(--secondary-110) / var(--tw-text-opacity));
1447
+ }
1134
1448
  .text-secondary-130 {
1135
1449
  --tw-text-opacity: 1;
1136
1450
  color: rgb(var(--secondary-130) / var(--tw-text-opacity));
@@ -1155,6 +1469,18 @@ video {
1155
1469
  --tw-text-opacity: 1;
1156
1470
  color: rgb(var(--tertiary-foreground) / var(--tw-text-opacity));
1157
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
+ }
1158
1484
  .text-warning {
1159
1485
  --tw-text-opacity: 1;
1160
1486
  color: rgb(var(--warning-default) / var(--tw-text-opacity));
@@ -1176,6 +1502,19 @@ video {
1176
1502
  .underline-offset-4 {
1177
1503
  text-underline-offset: 4px;
1178
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
+ }
1513
+ .shadow-md {
1514
+ --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
1515
+ --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
1516
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
1517
+ }
1179
1518
  .outline-none {
1180
1519
  outline: 2px solid transparent;
1181
1520
  outline-offset: 2px;
@@ -1183,6 +1522,11 @@ video {
1183
1522
  .outline {
1184
1523
  outline-style: solid;
1185
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
+ }
1186
1530
  .ring-1 {
1187
1531
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1188
1532
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
@@ -1203,6 +1547,12 @@ video {
1203
1547
  --tw-ring-opacity: 1;
1204
1548
  --tw-ring-color: rgb(var(--input-disabled-stroke-color) / var(--tw-ring-opacity));
1205
1549
  }
1550
+ .ring-offset-background {
1551
+ --tw-ring-offset-color: hsl(var(--background));
1552
+ }
1553
+ .filter {
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);
1555
+ }
1206
1556
  .transition-all {
1207
1557
  transition-property: all;
1208
1558
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
@@ -1213,12 +1563,23 @@ video {
1213
1563
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1214
1564
  transition-duration: 150ms;
1215
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
+ }
1216
1574
  .duration-300 {
1217
1575
  transition-duration: 300ms;
1218
1576
  }
1219
1577
  .ease-in-out {
1220
1578
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1221
1579
  }
1580
+ .ease-out {
1581
+ transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
1582
+ }
1222
1583
  .typography-h1 {
1223
1584
  font-size: 64px;
1224
1585
  line-height: 80px;
@@ -1324,6 +1685,19 @@ video {
1324
1685
  line-height: 10px;
1325
1686
  font-weight: 400;
1326
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
+ }
1327
1701
  .placeholder\:text-input-text-disabled::-moz-placeholder {
1328
1702
  --tw-text-opacity: 1;
1329
1703
  color: rgb(var(--input-disabled-text-color) / var(--tw-text-opacity));
@@ -1354,6 +1728,10 @@ video {
1354
1728
  --tw-bg-opacity: 1;
1355
1729
  background-color: rgb(var(--error-120) / var(--tw-bg-opacity));
1356
1730
  }
1731
+ .hover\:bg-gray-100:hover {
1732
+ --tw-bg-opacity: 1;
1733
+ background-color: rgb(243 244 246 / var(--tw-bg-opacity));
1734
+ }
1357
1735
  .hover\:bg-info-100:hover {
1358
1736
  --tw-bg-opacity: 1;
1359
1737
  background-color: rgb(var(--info-100)) / var(--tw-bg-opacity));
@@ -1390,9 +1768,16 @@ video {
1390
1768
  .hover\:fill-input-text:hover {
1391
1769
  fill: rgb(var(--input-default-text-color) / 1);
1392
1770
  }
1771
+ .hover\:text-textcolor-dark:hover {
1772
+ --tw-text-opacity: 1;
1773
+ color: rgb(var(--text-default-dark) / var(--tw-text-opacity));
1774
+ }
1393
1775
  .hover\:text-opacity-80:hover {
1394
1776
  --tw-text-opacity: 0.8;
1395
1777
  }
1778
+ .hover\:opacity-100:hover {
1779
+ opacity: 1;
1780
+ }
1396
1781
  .focus\:border-input-stroke:focus {
1397
1782
  --tw-border-opacity: 1;
1398
1783
  border-color: rgb(var(--input-default-stroke-color) / var(--tw-border-opacity));
@@ -1406,11 +1791,20 @@ video {
1406
1791
  .focus\:pe-8:focus {
1407
1792
  padding-inline-end: 2rem;
1408
1793
  }
1794
+ .focus\:outline-none:focus {
1795
+ outline: 2px solid transparent;
1796
+ outline-offset: 2px;
1797
+ }
1409
1798
  .focus\:ring-1:focus {
1410
1799
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1411
1800
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
1412
1801
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
1413
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
+ }
1414
1808
  .focus\:ring-inset:focus {
1415
1809
  --tw-ring-inset: inset;
1416
1810
  }
@@ -1422,11 +1816,48 @@ video {
1422
1816
  --tw-ring-opacity: 1;
1423
1817
  --tw-ring-color: rgb(var(--input-active-stroke-color) / var(--tw-ring-opacity));
1424
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
+ }
1425
1840
  .active\:scale-\[98\%\]:active {
1426
1841
  --tw-scale-x: 98%;
1427
1842
  --tw-scale-y: 98%;
1428
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));
1429
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
+ }
1430
1861
  .peer:-moz-placeholder-shown ~ .peer-placeholder-shown\:top-2 {
1431
1862
  top: 0.5rem;
1432
1863
  }
@@ -1502,6 +1933,12 @@ video {
1502
1933
  line-height: 10px;
1503
1934
  font-weight: 400;
1504
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
+ }
1505
1942
  .aria-disabled\:pointer-events-none[aria-disabled="true"] {
1506
1943
  pointer-events: none;
1507
1944
  }
@@ -1510,4 +1947,60 @@ video {
1510
1947
  }
1511
1948
  .aria-disabled\:opacity-50[aria-disabled="true"] {
1512
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;
1513
2006
  }