@cloudparse/up-miniapps-sdk 0.2.1 → 0.2.2

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.
package/dist/style.css CHANGED
@@ -41,6 +41,7 @@
41
41
  --color-blue-600: oklch(54.6% 0.245 262.881);
42
42
  --color-blue-700: oklch(48.8% 0.243 264.376);
43
43
  --color-blue-900: oklch(37.9% 0.146 265.522);
44
+ --color-pink-400: oklch(71.8% 0.202 349.761);
44
45
  --color-pink-500: oklch(65.6% 0.241 354.308);
45
46
  --color-rose-500: oklch(64.5% 0.246 16.439);
46
47
  --color-slate-100: oklch(96.8% 0.007 247.896);
@@ -72,6 +73,7 @@
72
73
  --color-black: #000;
73
74
  --color-white: #fff;
74
75
  --spacing: 0.25rem;
76
+ --container-sm: 24rem;
75
77
  --text-xs: 0.75rem;
76
78
  --text-xs--line-height: calc(1 / 0.75);
77
79
  --text-sm: 0.875rem;
@@ -96,8 +98,9 @@
96
98
  --tracking-widest: 0.1em;
97
99
  --leading-tight: 1.25;
98
100
  --leading-relaxed: 1.625;
99
- --radius-md: 0.375rem;
100
- --radius-lg: 0.5rem;
101
+ --radius-sm: calc(var(--radius) - 4px);
102
+ --radius-md: calc(var(--radius) - 2px);
103
+ --radius-lg: var(--radius);
101
104
  --radius-xl: 0.75rem;
102
105
  --radius-2xl: 1rem;
103
106
  --radius-3xl: 1.5rem;
@@ -110,6 +113,21 @@
110
113
  --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
111
114
  --default-font-family: var(--font-sans);
112
115
  --default-mono-font-family: var(--font-mono);
116
+ --color-background: hsl(var(--background));
117
+ --color-foreground: hsl(var(--foreground));
118
+ --color-card: hsl(var(--card));
119
+ --color-card-foreground: hsl(var(--card-foreground));
120
+ --color-primary: hsl(var(--primary));
121
+ --color-primary-foreground: hsl(var(--primary-foreground));
122
+ --color-secondary: hsl(var(--secondary));
123
+ --color-secondary-foreground: hsl(var(--secondary-foreground));
124
+ --color-muted-foreground: hsl(var(--muted-foreground));
125
+ --color-accent: hsl(var(--accent));
126
+ --color-accent-foreground: hsl(var(--accent-foreground));
127
+ --color-destructive: hsl(var(--destructive));
128
+ --color-destructive-foreground: hsl(var(--destructive-foreground));
129
+ --color-input: hsl(var(--input));
130
+ --color-ring: hsl(var(--ring));
113
131
  }
114
132
  }
115
133
  @layer base {
@@ -283,6 +301,17 @@
283
301
  .visible {
284
302
  visibility: visible;
285
303
  }
304
+ .sr-only {
305
+ position: absolute;
306
+ width: 1px;
307
+ height: 1px;
308
+ padding: 0;
309
+ margin: -1px;
310
+ overflow: hidden;
311
+ clip-path: inset(50%);
312
+ white-space: nowrap;
313
+ border-width: 0;
314
+ }
286
315
  .absolute {
287
316
  position: absolute;
288
317
  }
@@ -301,9 +330,15 @@
301
330
  .inset-x-0 {
302
331
  inset-inline: calc(var(--spacing) * 0);
303
332
  }
333
+ .inset-y-0 {
334
+ inset-block: calc(var(--spacing) * 0);
335
+ }
304
336
  .-top-1 {
305
337
  top: calc(var(--spacing) * -1);
306
338
  }
339
+ .top-0 {
340
+ top: calc(var(--spacing) * 0);
341
+ }
307
342
  .top-4 {
308
343
  top: calc(var(--spacing) * 4);
309
344
  }
@@ -457,9 +492,15 @@
457
492
  .hidden {
458
493
  display: none;
459
494
  }
495
+ .inline {
496
+ display: inline;
497
+ }
460
498
  .inline-block {
461
499
  display: inline-block;
462
500
  }
501
+ .inline-flex {
502
+ display: inline-flex;
503
+ }
463
504
  .h-0 {
464
505
  height: calc(var(--spacing) * 0);
465
506
  }
@@ -493,9 +534,15 @@
493
534
  .h-8 {
494
535
  height: calc(var(--spacing) * 8);
495
536
  }
537
+ .h-9 {
538
+ height: calc(var(--spacing) * 9);
539
+ }
496
540
  .h-10 {
497
541
  height: calc(var(--spacing) * 10);
498
542
  }
543
+ .h-11 {
544
+ height: calc(var(--spacing) * 11);
545
+ }
499
546
  .h-12 {
500
547
  height: calc(var(--spacing) * 12);
501
548
  }
@@ -517,6 +564,9 @@
517
564
  .h-\[700px\] {
518
565
  height: 700px;
519
566
  }
567
+ .h-auto {
568
+ height: auto;
569
+ }
520
570
  .h-full {
521
571
  height: 100%;
522
572
  }
@@ -547,6 +597,9 @@
547
597
  .w-2\.5 {
548
598
  width: calc(var(--spacing) * 2.5);
549
599
  }
600
+ .w-3\/4 {
601
+ width: calc(3 / 4 * 100%);
602
+ }
550
603
  .w-4 {
551
604
  width: calc(var(--spacing) * 4);
552
605
  }
@@ -632,14 +685,6 @@
632
685
  --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
633
686
  translate: var(--tw-translate-x) var(--tw-translate-y);
634
687
  }
635
- .translate-x-0 {
636
- --tw-translate-x: calc(var(--spacing) * 0);
637
- translate: var(--tw-translate-x) var(--tw-translate-y);
638
- }
639
- .translate-x-\[calc\(-100\%\+24px\)\] {
640
- --tw-translate-x: calc(-100% + 24px);
641
- translate: var(--tw-translate-x) var(--tw-translate-y);
642
- }
643
688
  .scale-75 {
644
689
  --tw-scale-x: 75%;
645
690
  --tw-scale-y: 75%;
@@ -679,6 +724,12 @@
679
724
  .flex-col {
680
725
  flex-direction: column;
681
726
  }
727
+ .flex-col-reverse {
728
+ flex-direction: column-reverse;
729
+ }
730
+ .flex-wrap {
731
+ flex-wrap: wrap;
732
+ }
682
733
  .items-center {
683
734
  align-items: center;
684
735
  }
@@ -697,6 +748,9 @@
697
748
  .justify-end {
698
749
  justify-content: flex-end;
699
750
  }
751
+ .justify-start {
752
+ justify-content: flex-start;
753
+ }
700
754
  .gap-1 {
701
755
  gap: calc(var(--spacing) * 1);
702
756
  }
@@ -712,6 +766,13 @@
712
766
  .gap-4 {
713
767
  gap: calc(var(--spacing) * 4);
714
768
  }
769
+ .space-y-1\.5 {
770
+ :where(& > :not(:last-child)) {
771
+ --tw-space-y-reverse: 0;
772
+ margin-block-start: calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));
773
+ margin-block-end: calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)));
774
+ }
775
+ }
715
776
  .space-y-2 {
716
777
  :where(& > :not(:last-child)) {
717
778
  --tw-space-y-reverse: 0;
@@ -769,6 +830,9 @@
769
830
  .rounded-md {
770
831
  border-radius: var(--radius-md);
771
832
  }
833
+ .rounded-sm {
834
+ border-radius: var(--radius-sm);
835
+ }
772
836
  .rounded-xl {
773
837
  border-radius: var(--radius-xl);
774
838
  }
@@ -854,6 +918,9 @@
854
918
  .border-gray-200 {
855
919
  border-color: var(--color-gray-200);
856
920
  }
921
+ .border-input {
922
+ border-color: var(--color-input);
923
+ }
857
924
  .border-red-100 {
858
925
  border-color: var(--color-red-100);
859
926
  }
@@ -938,6 +1005,9 @@
938
1005
  .bg-amber-50 {
939
1006
  background-color: var(--color-amber-50);
940
1007
  }
1008
+ .bg-background {
1009
+ background-color: var(--color-background);
1010
+ }
941
1011
  .bg-black\/45 {
942
1012
  background-color: color-mix(in srgb, #000 45%, transparent);
943
1013
  @supports (color: color-mix(in lab, red, red)) {
@@ -965,6 +1035,9 @@
965
1035
  .bg-blue-600 {
966
1036
  background-color: var(--color-blue-600);
967
1037
  }
1038
+ .bg-card {
1039
+ background-color: var(--color-card);
1040
+ }
968
1041
  .bg-cyan-400 {
969
1042
  background-color: var(--color-cyan-400);
970
1043
  }
@@ -977,6 +1050,9 @@
977
1050
  background-color: color-mix(in oklab, var(--color-cyan-500) 10%, transparent);
978
1051
  }
979
1052
  }
1053
+ .bg-destructive {
1054
+ background-color: var(--color-destructive);
1055
+ }
980
1056
  .bg-emerald-100 {
981
1057
  background-color: var(--color-emerald-100);
982
1058
  }
@@ -1010,6 +1086,9 @@
1010
1086
  .bg-orange-500 {
1011
1087
  background-color: var(--color-orange-500);
1012
1088
  }
1089
+ .bg-primary {
1090
+ background-color: var(--color-primary);
1091
+ }
1013
1092
  .bg-red-50 {
1014
1093
  background-color: var(--color-red-50);
1015
1094
  }
@@ -1022,6 +1101,9 @@
1022
1101
  .bg-rose-500 {
1023
1102
  background-color: var(--color-rose-500);
1024
1103
  }
1104
+ .bg-secondary {
1105
+ background-color: var(--color-secondary);
1106
+ }
1025
1107
  .bg-slate-800 {
1026
1108
  background-color: var(--color-slate-800);
1027
1109
  }
@@ -1067,12 +1149,6 @@
1067
1149
  background-color: color-mix(in oklab, var(--color-white) 10%, transparent);
1068
1150
  }
1069
1151
  }
1070
- .bg-white\/20 {
1071
- background-color: color-mix(in srgb, #fff 20%, transparent);
1072
- @supports (color: color-mix(in lab, red, red)) {
1073
- background-color: color-mix(in oklab, var(--color-white) 20%, transparent);
1074
- }
1075
- }
1076
1152
  .bg-white\/25 {
1077
1153
  background-color: color-mix(in srgb, #fff 25%, transparent);
1078
1154
  @supports (color: color-mix(in lab, red, red)) {
@@ -1115,6 +1191,9 @@
1115
1191
  .p-0 {
1116
1192
  padding: calc(var(--spacing) * 0);
1117
1193
  }
1194
+ .p-0\! {
1195
+ padding: calc(var(--spacing) * 0) !important;
1196
+ }
1118
1197
  .p-2 {
1119
1198
  padding: calc(var(--spacing) * 2);
1120
1199
  }
@@ -1172,12 +1251,12 @@
1172
1251
  .py-3 {
1173
1252
  padding-block: calc(var(--spacing) * 3);
1174
1253
  }
1175
- .py-4 {
1176
- padding-block: calc(var(--spacing) * 4);
1177
- }
1178
1254
  .py-8 {
1179
1255
  padding-block: calc(var(--spacing) * 8);
1180
1256
  }
1257
+ .pt-0 {
1258
+ padding-top: calc(var(--spacing) * 0);
1259
+ }
1181
1260
  .pt-1 {
1182
1261
  padding-top: calc(var(--spacing) * 1);
1183
1262
  }
@@ -1190,9 +1269,6 @@
1190
1269
  .pt-4 {
1191
1270
  padding-top: calc(var(--spacing) * 4);
1192
1271
  }
1193
- .pr-1 {
1194
- padding-right: calc(var(--spacing) * 1);
1195
- }
1196
1272
  .pr-2 {
1197
1273
  padding-right: calc(var(--spacing) * 2);
1198
1274
  }
@@ -1211,9 +1287,6 @@
1211
1287
  .pb-4 {
1212
1288
  padding-bottom: calc(var(--spacing) * 4);
1213
1289
  }
1214
- .pl-4 {
1215
- padding-left: calc(var(--spacing) * 4);
1216
- }
1217
1290
  .text-center {
1218
1291
  text-align: center;
1219
1292
  }
@@ -1348,15 +1421,24 @@
1348
1421
  .text-blue-900 {
1349
1422
  color: var(--color-blue-900);
1350
1423
  }
1424
+ .text-card-foreground {
1425
+ color: var(--color-card-foreground);
1426
+ }
1351
1427
  .text-cyan-400 {
1352
1428
  color: var(--color-cyan-400);
1353
1429
  }
1430
+ .text-destructive-foreground {
1431
+ color: var(--color-destructive-foreground);
1432
+ }
1354
1433
  .text-emerald-400 {
1355
1434
  color: var(--color-emerald-400);
1356
1435
  }
1357
1436
  .text-emerald-700 {
1358
1437
  color: var(--color-emerald-700);
1359
1438
  }
1439
+ .text-foreground {
1440
+ color: var(--color-foreground);
1441
+ }
1360
1442
  .text-gray-400 {
1361
1443
  color: var(--color-gray-400);
1362
1444
  }
@@ -1381,18 +1463,30 @@
1381
1463
  .text-green-900 {
1382
1464
  color: var(--color-green-900);
1383
1465
  }
1466
+ .text-muted-foreground {
1467
+ color: var(--color-muted-foreground);
1468
+ }
1384
1469
  .text-orange-700 {
1385
1470
  color: var(--color-orange-700);
1386
1471
  }
1387
1472
  .text-pink-500 {
1388
1473
  color: var(--color-pink-500);
1389
1474
  }
1475
+ .text-primary {
1476
+ color: var(--color-primary);
1477
+ }
1478
+ .text-primary-foreground {
1479
+ color: var(--color-primary-foreground);
1480
+ }
1390
1481
  .text-red-400 {
1391
1482
  color: var(--color-red-400);
1392
1483
  }
1393
1484
  .text-red-600 {
1394
1485
  color: var(--color-red-600);
1395
1486
  }
1487
+ .text-secondary-foreground {
1488
+ color: var(--color-secondary-foreground);
1489
+ }
1396
1490
  .text-slate-100 {
1397
1491
  color: var(--color-slate-100);
1398
1492
  }
@@ -1429,6 +1523,9 @@
1429
1523
  .italic {
1430
1524
  font-style: italic;
1431
1525
  }
1526
+ .underline-offset-4 {
1527
+ text-underline-offset: 4px;
1528
+ }
1432
1529
  .accent-blue-500 {
1433
1530
  accent-color: var(--color-blue-500);
1434
1531
  }
@@ -1438,6 +1535,9 @@
1438
1535
  .opacity-45 {
1439
1536
  opacity: 45%;
1440
1537
  }
1538
+ .opacity-70 {
1539
+ opacity: 70%;
1540
+ }
1441
1541
  .opacity-90 {
1442
1542
  opacity: 90%;
1443
1543
  }
@@ -1531,9 +1631,20 @@
1531
1631
  --tw-ring-offset-width: 2px;
1532
1632
  --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1533
1633
  }
1634
+ .ring-offset-background {
1635
+ --tw-ring-offset-color: var(--color-background);
1636
+ }
1534
1637
  .ring-offset-zinc-950 {
1535
1638
  --tw-ring-offset-color: var(--color-zinc-950);
1536
1639
  }
1640
+ .outline {
1641
+ outline-style: var(--tw-outline-style);
1642
+ outline-width: 1px;
1643
+ }
1644
+ .blur {
1645
+ --tw-blur: blur(8px);
1646
+ 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,);
1647
+ }
1537
1648
  .filter {
1538
1649
  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,);
1539
1650
  }
@@ -1553,6 +1664,9 @@
1553
1664
  --tw-backdrop-blur: blur(var(--blur-sm));
1554
1665
  backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
1555
1666
  }
1667
+ .backdrop-filter {
1668
+ backdrop-filter: var(--tw-backdrop-blur,) var(--tw-backdrop-brightness,) var(--tw-backdrop-contrast,) var(--tw-backdrop-grayscale,) var(--tw-backdrop-hue-rotate,) var(--tw-backdrop-invert,) var(--tw-backdrop-opacity,) var(--tw-backdrop-saturate,) var(--tw-backdrop-sepia,);
1669
+ }
1556
1670
  .transition {
1557
1671
  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
1558
1672
  transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
@@ -1639,16 +1753,6 @@
1639
1753
  }
1640
1754
  }
1641
1755
  }
1642
- .group-hover\:bg-white\/40 {
1643
- &:is(:where(.group):hover *) {
1644
- @media (hover: hover) {
1645
- background-color: color-mix(in srgb, #fff 40%, transparent);
1646
- @supports (color: color-mix(in lab, red, red)) {
1647
- background-color: color-mix(in oklab, var(--color-white) 40%, transparent);
1648
- }
1649
- }
1650
- }
1651
- }
1652
1756
  .group-hover\:opacity-100 {
1653
1757
  &:is(:where(.group):hover *) {
1654
1758
  @media (hover: hover) {
@@ -1725,6 +1829,13 @@
1725
1829
  }
1726
1830
  }
1727
1831
  }
1832
+ .hover\:bg-accent {
1833
+ &:hover {
1834
+ @media (hover: hover) {
1835
+ background-color: var(--color-accent);
1836
+ }
1837
+ }
1838
+ }
1728
1839
  .hover\:bg-blue-700 {
1729
1840
  &:hover {
1730
1841
  @media (hover: hover) {
@@ -1746,6 +1857,16 @@
1746
1857
  }
1747
1858
  }
1748
1859
  }
1860
+ .hover\:bg-destructive\/90 {
1861
+ &:hover {
1862
+ @media (hover: hover) {
1863
+ background-color: color-mix(in srgb, hsl(var(--destructive)) 90%, transparent);
1864
+ @supports (color: color-mix(in lab, red, red)) {
1865
+ background-color: color-mix(in oklab, var(--color-destructive) 90%, transparent);
1866
+ }
1867
+ }
1868
+ }
1869
+ }
1749
1870
  .hover\:bg-gray-50 {
1750
1871
  &:hover {
1751
1872
  @media (hover: hover) {
@@ -1767,6 +1888,16 @@
1767
1888
  }
1768
1889
  }
1769
1890
  }
1891
+ .hover\:bg-primary\/90 {
1892
+ &:hover {
1893
+ @media (hover: hover) {
1894
+ background-color: color-mix(in srgb, hsl(var(--primary)) 90%, transparent);
1895
+ @supports (color: color-mix(in lab, red, red)) {
1896
+ background-color: color-mix(in oklab, var(--color-primary) 90%, transparent);
1897
+ }
1898
+ }
1899
+ }
1900
+ }
1770
1901
  .hover\:bg-red-50 {
1771
1902
  &:hover {
1772
1903
  @media (hover: hover) {
@@ -1791,6 +1922,16 @@
1791
1922
  }
1792
1923
  }
1793
1924
  }
1925
+ .hover\:bg-secondary\/80 {
1926
+ &:hover {
1927
+ @media (hover: hover) {
1928
+ background-color: color-mix(in srgb, hsl(var(--secondary)) 80%, transparent);
1929
+ @supports (color: color-mix(in lab, red, red)) {
1930
+ background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);
1931
+ }
1932
+ }
1933
+ }
1934
+ }
1794
1935
  .hover\:bg-slate-800 {
1795
1936
  &:hover {
1796
1937
  @media (hover: hover) {
@@ -1798,6 +1939,23 @@
1798
1939
  }
1799
1940
  }
1800
1941
  }
1942
+ .hover\:bg-slate-900\/80 {
1943
+ &:hover {
1944
+ @media (hover: hover) {
1945
+ background-color: color-mix(in srgb, oklch(20.8% 0.042 265.755) 80%, transparent);
1946
+ @supports (color: color-mix(in lab, red, red)) {
1947
+ background-color: color-mix(in oklab, var(--color-slate-900) 80%, transparent);
1948
+ }
1949
+ }
1950
+ }
1951
+ }
1952
+ .hover\:bg-transparent {
1953
+ &:hover {
1954
+ @media (hover: hover) {
1955
+ background-color: transparent;
1956
+ }
1957
+ }
1958
+ }
1801
1959
  .hover\:bg-white\/5 {
1802
1960
  &:hover {
1803
1961
  @media (hover: hover) {
@@ -1815,6 +1973,20 @@
1815
1973
  }
1816
1974
  }
1817
1975
  }
1976
+ .hover\:text-accent-foreground {
1977
+ &:hover {
1978
+ @media (hover: hover) {
1979
+ color: var(--color-accent-foreground);
1980
+ }
1981
+ }
1982
+ }
1983
+ .hover\:text-black {
1984
+ &:hover {
1985
+ @media (hover: hover) {
1986
+ color: var(--color-black);
1987
+ }
1988
+ }
1989
+ }
1818
1990
  .hover\:text-blue-400 {
1819
1991
  &:hover {
1820
1992
  @media (hover: hover) {
@@ -1836,6 +2008,13 @@
1836
2008
  }
1837
2009
  }
1838
2010
  }
2011
+ .hover\:text-pink-400 {
2012
+ &:hover {
2013
+ @media (hover: hover) {
2014
+ color: var(--color-pink-400);
2015
+ }
2016
+ }
2017
+ }
1839
2018
  .hover\:text-red-500 {
1840
2019
  &:hover {
1841
2020
  @media (hover: hover) {
@@ -1864,17 +2043,64 @@
1864
2043
  }
1865
2044
  }
1866
2045
  }
2046
+ .hover\:opacity-105 {
2047
+ &:hover {
2048
+ @media (hover: hover) {
2049
+ opacity: 105%;
2050
+ }
2051
+ }
2052
+ }
1867
2053
  .focus\:border-blue-500 {
1868
2054
  &:focus {
1869
2055
  border-color: var(--color-blue-500);
1870
2056
  }
1871
2057
  }
2058
+ .focus\:ring-2 {
2059
+ &:focus {
2060
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
2061
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
2062
+ }
2063
+ }
2064
+ .focus\:ring-ring {
2065
+ &:focus {
2066
+ --tw-ring-color: var(--color-ring);
2067
+ }
2068
+ }
2069
+ .focus\:ring-offset-2 {
2070
+ &:focus {
2071
+ --tw-ring-offset-width: 2px;
2072
+ --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
2073
+ }
2074
+ }
1872
2075
  .focus\:outline-none {
1873
2076
  &:focus {
1874
2077
  --tw-outline-style: none;
1875
2078
  outline-style: none;
1876
2079
  }
1877
2080
  }
2081
+ .focus-visible\:ring-2 {
2082
+ &:focus-visible {
2083
+ --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
2084
+ box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
2085
+ }
2086
+ }
2087
+ .focus-visible\:ring-ring {
2088
+ &:focus-visible {
2089
+ --tw-ring-color: var(--color-ring);
2090
+ }
2091
+ }
2092
+ .focus-visible\:ring-offset-2 {
2093
+ &:focus-visible {
2094
+ --tw-ring-offset-width: 2px;
2095
+ --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
2096
+ }
2097
+ }
2098
+ .focus-visible\:outline-none {
2099
+ &:focus-visible {
2100
+ --tw-outline-style: none;
2101
+ outline-style: none;
2102
+ }
2103
+ }
1878
2104
  .active\:scale-95 {
1879
2105
  &:active {
1880
2106
  --tw-scale-x: 95%;
@@ -1891,6 +2117,11 @@
1891
2117
  }
1892
2118
  }
1893
2119
  }
2120
+ .disabled\:pointer-events-none {
2121
+ &:disabled {
2122
+ pointer-events: none;
2123
+ }
2124
+ }
1894
2125
  .disabled\:cursor-not-allowed {
1895
2126
  &:disabled {
1896
2127
  cursor: not-allowed;
@@ -1906,6 +2137,23 @@
1906
2137
  opacity: 50%;
1907
2138
  }
1908
2139
  }
2140
+ .data-\[state\=closed\]\:duration-300 {
2141
+ &[data-state="closed"] {
2142
+ --tw-duration: 300ms;
2143
+ transition-duration: 300ms;
2144
+ }
2145
+ }
2146
+ .data-\[state\=open\]\:bg-secondary {
2147
+ &[data-state="open"] {
2148
+ background-color: var(--color-secondary);
2149
+ }
2150
+ }
2151
+ .data-\[state\=open\]\:duration-500 {
2152
+ &[data-state="open"] {
2153
+ --tw-duration: 500ms;
2154
+ transition-duration: 500ms;
2155
+ }
2156
+ }
1909
2157
  .sm\:mt-3 {
1910
2158
  @media (width >= 40rem) {
1911
2159
  margin-top: calc(var(--spacing) * 3);
@@ -1936,11 +2184,35 @@
1936
2184
  max-width: 380px;
1937
2185
  }
1938
2186
  }
2187
+ .sm\:max-w-sm {
2188
+ @media (width >= 40rem) {
2189
+ max-width: var(--container-sm);
2190
+ }
2191
+ }
1939
2192
  .sm\:grid-cols-4 {
1940
2193
  @media (width >= 40rem) {
1941
2194
  grid-template-columns: repeat(4, minmax(0, 1fr));
1942
2195
  }
1943
2196
  }
2197
+ .sm\:flex-row {
2198
+ @media (width >= 40rem) {
2199
+ flex-direction: row;
2200
+ }
2201
+ }
2202
+ .sm\:justify-end {
2203
+ @media (width >= 40rem) {
2204
+ justify-content: flex-end;
2205
+ }
2206
+ }
2207
+ .sm\:space-x-2 {
2208
+ @media (width >= 40rem) {
2209
+ :where(& > :not(:last-child)) {
2210
+ --tw-space-x-reverse: 0;
2211
+ margin-inline-start: calc(calc(var(--spacing) * 2) * var(--tw-space-x-reverse));
2212
+ margin-inline-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-x-reverse)));
2213
+ }
2214
+ }
2215
+ }
1944
2216
  .sm\:p-4 {
1945
2217
  @media (width >= 40rem) {
1946
2218
  padding: calc(var(--spacing) * 4);
@@ -1956,6 +2228,11 @@
1956
2228
  padding-block: calc(var(--spacing) * 2);
1957
2229
  }
1958
2230
  }
2231
+ .sm\:text-left {
2232
+ @media (width >= 40rem) {
2233
+ text-align: left;
2234
+ }
2235
+ }
1959
2236
  .sm\:text-lg {
1960
2237
  @media (width >= 40rem) {
1961
2238
  font-size: var(--text-lg);
@@ -1983,6 +2260,67 @@
1983
2260
  grid-template-columns: repeat(4, minmax(0, 1fr));
1984
2261
  }
1985
2262
  }
2263
+ .\[\&_svg\]\:pointer-events-none {
2264
+ & svg {
2265
+ pointer-events: none;
2266
+ }
2267
+ }
2268
+ .\[\&_svg\]\:size-4 {
2269
+ & svg {
2270
+ width: calc(var(--spacing) * 4);
2271
+ height: calc(var(--spacing) * 4);
2272
+ }
2273
+ }
2274
+ .\[\&_svg\]\:shrink-0 {
2275
+ & svg {
2276
+ flex-shrink: 0;
2277
+ }
2278
+ }
2279
+ }
2280
+ @layer base {
2281
+ :root {
2282
+ --background: 0 0% 100%;
2283
+ --foreground: 240 10% 3.9%;
2284
+ --card: 0 0% 100%;
2285
+ --card-foreground: 240 10% 3.9%;
2286
+ --popover: 0 0% 100%;
2287
+ --popover-foreground: 240 10% 3.9%;
2288
+ --primary: 240 5.9% 10%;
2289
+ --primary-foreground: 0 0% 98%;
2290
+ --secondary: 240 4.8% 95.9%;
2291
+ --secondary-foreground: 240 5.9% 10%;
2292
+ --muted: 240 4.8% 95.9%;
2293
+ --muted-foreground: 240 3.8% 46.1%;
2294
+ --accent: 240 4.8% 95.9%;
2295
+ --accent-foreground: 240 5.9% 10%;
2296
+ --destructive: 0 84.2% 60.2%;
2297
+ --destructive-foreground: 0 0% 98%;
2298
+ --border: 240 5.9% 90%;
2299
+ --input: 240 5.9% 90%;
2300
+ --ring: 240 5.9% 10%;
2301
+ --radius: 0.5rem;
2302
+ }
2303
+ .dark {
2304
+ --background: 240 10% 3.9%;
2305
+ --foreground: 0 0% 98%;
2306
+ --card: 240 10% 3.9%;
2307
+ --card-foreground: 0 0% 98%;
2308
+ --popover: 240 10% 3.9%;
2309
+ --popover-foreground: 0 0% 98%;
2310
+ --primary: 0 0% 98%;
2311
+ --primary-foreground: 240 5.9% 10%;
2312
+ --secondary: 240 3.7% 15.9%;
2313
+ --secondary-foreground: 0 0% 98%;
2314
+ --muted: 240 3.7% 15.9%;
2315
+ --muted-foreground: 240 5% 64.9%;
2316
+ --accent: 240 3.7% 15.9%;
2317
+ --accent-foreground: 0 0% 98%;
2318
+ --destructive: 0 62.8% 30.6%;
2319
+ --destructive-foreground: 0 0% 98%;
2320
+ --border: 240 3.7% 15.9%;
2321
+ --input: 240 3.7% 15.9%;
2322
+ --ring: 240 4.9% 83.9%;
2323
+ }
1986
2324
  }
1987
2325
  @property --tw-translate-x {
1988
2326
  syntax: "*";
@@ -2126,6 +2464,11 @@
2126
2464
  inherits: false;
2127
2465
  initial-value: 0 0 #0000;
2128
2466
  }
2467
+ @property --tw-outline-style {
2468
+ syntax: "*";
2469
+ inherits: false;
2470
+ initial-value: solid;
2471
+ }
2129
2472
  @property --tw-blur {
2130
2473
  syntax: "*";
2131
2474
  inherits: false;
@@ -2223,6 +2566,11 @@
2223
2566
  syntax: "*";
2224
2567
  inherits: false;
2225
2568
  }
2569
+ @property --tw-space-x-reverse {
2570
+ syntax: "*";
2571
+ inherits: false;
2572
+ initial-value: 0;
2573
+ }
2226
2574
  @keyframes pulse {
2227
2575
  50% {
2228
2576
  opacity: 0.5;
@@ -2262,6 +2610,7 @@
2262
2610
  --tw-ring-offset-width: 0px;
2263
2611
  --tw-ring-offset-color: #fff;
2264
2612
  --tw-ring-offset-shadow: 0 0 #0000;
2613
+ --tw-outline-style: solid;
2265
2614
  --tw-blur: initial;
2266
2615
  --tw-brightness: initial;
2267
2616
  --tw-contrast: initial;
@@ -2286,6 +2635,7 @@
2286
2635
  --tw-backdrop-sepia: initial;
2287
2636
  --tw-duration: initial;
2288
2637
  --tw-ease: initial;
2638
+ --tw-space-x-reverse: 0;
2289
2639
  }
2290
2640
  }
2291
2641
  }