@deframe-sdk/components 0.1.31 → 0.1.33
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/index.d.mts +292 -3
- package/dist/index.d.ts +292 -3
- package/dist/index.js +1421 -3
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1396 -5
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +143 -0
- package/package.json +1 -1
package/dist/styles.css
CHANGED
|
@@ -367,6 +367,9 @@
|
|
|
367
367
|
.my-4 {
|
|
368
368
|
margin-block: calc(var(--spacing) * 4);
|
|
369
369
|
}
|
|
370
|
+
.my-\[40px\] {
|
|
371
|
+
margin-block: 40px;
|
|
372
|
+
}
|
|
370
373
|
.my-\[var\(--deframe-widget-size-gap-sm\)\] {
|
|
371
374
|
margin-block: var(--deframe-widget-size-gap-sm);
|
|
372
375
|
}
|
|
@@ -565,6 +568,9 @@
|
|
|
565
568
|
.h-10 {
|
|
566
569
|
height: calc(var(--spacing) * 10);
|
|
567
570
|
}
|
|
571
|
+
.h-11 {
|
|
572
|
+
height: calc(var(--spacing) * 11);
|
|
573
|
+
}
|
|
568
574
|
.h-12 {
|
|
569
575
|
height: calc(var(--spacing) * 12);
|
|
570
576
|
}
|
|
@@ -598,6 +604,9 @@
|
|
|
598
604
|
.h-\[7px\] {
|
|
599
605
|
height: 7px;
|
|
600
606
|
}
|
|
607
|
+
.h-\[8px\] {
|
|
608
|
+
height: 8px;
|
|
609
|
+
}
|
|
601
610
|
.h-\[12px\] {
|
|
602
611
|
height: 12px;
|
|
603
612
|
}
|
|
@@ -733,6 +742,9 @@
|
|
|
733
742
|
.min-h-\[86px\] {
|
|
734
743
|
min-height: 86px;
|
|
735
744
|
}
|
|
745
|
+
.min-h-\[100svh\] {
|
|
746
|
+
min-height: 100svh;
|
|
747
|
+
}
|
|
736
748
|
.min-h-\[136px\] {
|
|
737
749
|
min-height: 136px;
|
|
738
750
|
}
|
|
@@ -742,6 +754,9 @@
|
|
|
742
754
|
.min-h-\[600px\] {
|
|
743
755
|
min-height: 600px;
|
|
744
756
|
}
|
|
757
|
+
.min-h-\[calc\(100svh-160px\)\] {
|
|
758
|
+
min-height: calc(100svh - 160px);
|
|
759
|
+
}
|
|
745
760
|
.min-h-full {
|
|
746
761
|
min-height: 100%;
|
|
747
762
|
}
|
|
@@ -775,6 +790,9 @@
|
|
|
775
790
|
.w-10 {
|
|
776
791
|
width: calc(var(--spacing) * 10);
|
|
777
792
|
}
|
|
793
|
+
.w-11 {
|
|
794
|
+
width: calc(var(--spacing) * 11);
|
|
795
|
+
}
|
|
778
796
|
.w-12 {
|
|
779
797
|
width: calc(var(--spacing) * 12);
|
|
780
798
|
}
|
|
@@ -802,6 +820,9 @@
|
|
|
802
820
|
.w-48 {
|
|
803
821
|
width: calc(var(--spacing) * 48);
|
|
804
822
|
}
|
|
823
|
+
.w-56 {
|
|
824
|
+
width: calc(var(--spacing) * 56);
|
|
825
|
+
}
|
|
805
826
|
.w-64 {
|
|
806
827
|
width: calc(var(--spacing) * 64);
|
|
807
828
|
}
|
|
@@ -823,6 +844,9 @@
|
|
|
823
844
|
.w-\[7px\] {
|
|
824
845
|
width: 7px;
|
|
825
846
|
}
|
|
847
|
+
.w-\[8px\] {
|
|
848
|
+
width: 8px;
|
|
849
|
+
}
|
|
826
850
|
.w-\[12px\] {
|
|
827
851
|
width: 12px;
|
|
828
852
|
}
|
|
@@ -838,6 +862,9 @@
|
|
|
838
862
|
.w-\[18px\] {
|
|
839
863
|
width: 18px;
|
|
840
864
|
}
|
|
865
|
+
.w-\[24px\] {
|
|
866
|
+
width: 24px;
|
|
867
|
+
}
|
|
841
868
|
.w-\[32px\] {
|
|
842
869
|
width: 32px;
|
|
843
870
|
}
|
|
@@ -862,6 +889,9 @@
|
|
|
862
889
|
.w-\[64px\] {
|
|
863
890
|
width: 64px;
|
|
864
891
|
}
|
|
892
|
+
.w-\[72px\] {
|
|
893
|
+
width: 72px;
|
|
894
|
+
}
|
|
865
895
|
.w-\[83px\] {
|
|
866
896
|
width: 83px;
|
|
867
897
|
}
|
|
@@ -940,6 +970,9 @@
|
|
|
940
970
|
.max-w-\[84px\] {
|
|
941
971
|
max-width: 84px;
|
|
942
972
|
}
|
|
973
|
+
.max-w-\[100px\] {
|
|
974
|
+
max-width: 100px;
|
|
975
|
+
}
|
|
943
976
|
.max-w-\[150px\] {
|
|
944
977
|
max-width: 150px;
|
|
945
978
|
}
|
|
@@ -952,9 +985,15 @@
|
|
|
952
985
|
.max-w-\[260px\] {
|
|
953
986
|
max-width: 260px;
|
|
954
987
|
}
|
|
988
|
+
.max-w-\[300px\] {
|
|
989
|
+
max-width: 300px;
|
|
990
|
+
}
|
|
955
991
|
.max-w-\[320px\] {
|
|
956
992
|
max-width: 320px;
|
|
957
993
|
}
|
|
994
|
+
.max-w-\[390px\] {
|
|
995
|
+
max-width: 390px;
|
|
996
|
+
}
|
|
958
997
|
.max-w-\[480px\] {
|
|
959
998
|
max-width: 480px;
|
|
960
999
|
}
|
|
@@ -1090,6 +1129,9 @@
|
|
|
1090
1129
|
.grid-cols-3 {
|
|
1091
1130
|
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
1092
1131
|
}
|
|
1132
|
+
.grid-cols-\[1fr_100px\] {
|
|
1133
|
+
grid-template-columns: 1fr 100px;
|
|
1134
|
+
}
|
|
1093
1135
|
.grid-cols-\[1fr_100px_130px\] {
|
|
1094
1136
|
grid-template-columns: 1fr 100px 130px;
|
|
1095
1137
|
}
|
|
@@ -1376,10 +1418,18 @@
|
|
|
1376
1418
|
border-style: var(--tw-border-style);
|
|
1377
1419
|
border-width: 1px;
|
|
1378
1420
|
}
|
|
1421
|
+
.border-2 {
|
|
1422
|
+
border-style: var(--tw-border-style);
|
|
1423
|
+
border-width: 2px;
|
|
1424
|
+
}
|
|
1379
1425
|
.border-12 {
|
|
1380
1426
|
border-style: var(--tw-border-style);
|
|
1381
1427
|
border-width: 12px;
|
|
1382
1428
|
}
|
|
1429
|
+
.border-\[3px\] {
|
|
1430
|
+
border-style: var(--tw-border-style);
|
|
1431
|
+
border-width: 3px;
|
|
1432
|
+
}
|
|
1383
1433
|
.border-\[length\:var\(--deframe-widget-size-border-sm\)\] {
|
|
1384
1434
|
border-style: var(--tw-border-style);
|
|
1385
1435
|
border-width: var(--deframe-widget-size-border-sm);
|
|
@@ -1441,6 +1491,12 @@
|
|
|
1441
1491
|
border-color: color-mix(in srgb,var(--deframe-widget-color-brand-secondary) 32%,transparent);
|
|
1442
1492
|
}
|
|
1443
1493
|
}
|
|
1494
|
+
.border-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-state-error\)_28\%\,transparent\)\] {
|
|
1495
|
+
border-color: var(--deframe-widget-color-state-error);
|
|
1496
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
1497
|
+
border-color: color-mix(in srgb,var(--deframe-widget-color-state-error) 28%,transparent);
|
|
1498
|
+
}
|
|
1499
|
+
}
|
|
1444
1500
|
.border-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-state-error\)_32\%\,transparent\)\] {
|
|
1445
1501
|
border-color: var(--deframe-widget-color-state-error);
|
|
1446
1502
|
@supports (color: color-mix(in lab, red, red)) {
|
|
@@ -1459,18 +1515,36 @@
|
|
|
1459
1515
|
border-color: color-mix(in srgb,var(--deframe-widget-color-state-info) 32%,transparent);
|
|
1460
1516
|
}
|
|
1461
1517
|
}
|
|
1518
|
+
.border-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-state-success\)_28\%\,transparent\)\] {
|
|
1519
|
+
border-color: var(--deframe-widget-color-state-success);
|
|
1520
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
1521
|
+
border-color: color-mix(in srgb,var(--deframe-widget-color-state-success) 28%,transparent);
|
|
1522
|
+
}
|
|
1523
|
+
}
|
|
1462
1524
|
.border-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-state-success\)_32\%\,transparent\)\] {
|
|
1463
1525
|
border-color: var(--deframe-widget-color-state-success);
|
|
1464
1526
|
@supports (color: color-mix(in lab, red, red)) {
|
|
1465
1527
|
border-color: color-mix(in srgb,var(--deframe-widget-color-state-success) 32%,transparent);
|
|
1466
1528
|
}
|
|
1467
1529
|
}
|
|
1530
|
+
.border-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-state-warning\)_28\%\,transparent\)\] {
|
|
1531
|
+
border-color: var(--deframe-widget-color-state-warning);
|
|
1532
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
1533
|
+
border-color: color-mix(in srgb,var(--deframe-widget-color-state-warning) 28%,transparent);
|
|
1534
|
+
}
|
|
1535
|
+
}
|
|
1468
1536
|
.border-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-state-warning\)_32\%\,transparent\)\] {
|
|
1469
1537
|
border-color: var(--deframe-widget-color-state-warning);
|
|
1470
1538
|
@supports (color: color-mix(in lab, red, red)) {
|
|
1471
1539
|
border-color: color-mix(in srgb,var(--deframe-widget-color-state-warning) 32%,transparent);
|
|
1472
1540
|
}
|
|
1473
1541
|
}
|
|
1542
|
+
.border-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-text-tertiary\)_22\%\,transparent\)\] {
|
|
1543
|
+
border-color: var(--deframe-widget-color-text-tertiary);
|
|
1544
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
1545
|
+
border-color: color-mix(in srgb,var(--deframe-widget-color-text-tertiary) 22%,transparent);
|
|
1546
|
+
}
|
|
1547
|
+
}
|
|
1474
1548
|
.border-\[color\:var\(--deframe-widget-color-bg-secondary\)\] {
|
|
1475
1549
|
border-color: var(--deframe-widget-color-bg-secondary);
|
|
1476
1550
|
}
|
|
@@ -1561,6 +1635,9 @@
|
|
|
1561
1635
|
.border-transparent {
|
|
1562
1636
|
border-color: transparent;
|
|
1563
1637
|
}
|
|
1638
|
+
.border-t-transparent {
|
|
1639
|
+
border-top-color: transparent;
|
|
1640
|
+
}
|
|
1564
1641
|
.bg-\[\#0A0A0A\] {
|
|
1565
1642
|
background-color: #0A0A0A;
|
|
1566
1643
|
}
|
|
@@ -1621,6 +1698,12 @@
|
|
|
1621
1698
|
background-color: color-mix(in srgb,var(--deframe-widget-color-bg-tertiary) 92%,transparent);
|
|
1622
1699
|
}
|
|
1623
1700
|
}
|
|
1701
|
+
.bg-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-brand-primary\)_8\%\,var\(--deframe-widget-color-bg-secondary\)\)\] {
|
|
1702
|
+
background-color: var(--deframe-widget-color-brand-primary);
|
|
1703
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
1704
|
+
background-color: color-mix(in srgb,var(--deframe-widget-color-brand-primary) 8%,var(--deframe-widget-color-bg-secondary));
|
|
1705
|
+
}
|
|
1706
|
+
}
|
|
1624
1707
|
.bg-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-brand-primary\)_12\%\,transparent\)\] {
|
|
1625
1708
|
background-color: var(--deframe-widget-color-brand-primary);
|
|
1626
1709
|
@supports (color: color-mix(in lab, red, red)) {
|
|
@@ -1657,6 +1740,12 @@
|
|
|
1657
1740
|
background-color: color-mix(in srgb,var(--deframe-widget-color-state-error) 20%,transparent);
|
|
1658
1741
|
}
|
|
1659
1742
|
}
|
|
1743
|
+
.bg-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-state-info\)_12\%\,transparent\)\] {
|
|
1744
|
+
background-color: var(--deframe-widget-color-state-info);
|
|
1745
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
1746
|
+
background-color: color-mix(in srgb,var(--deframe-widget-color-state-info) 12%,transparent);
|
|
1747
|
+
}
|
|
1748
|
+
}
|
|
1660
1749
|
.bg-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-state-info\)_16\%\,transparent\)\] {
|
|
1661
1750
|
background-color: var(--deframe-widget-color-state-info);
|
|
1662
1751
|
@supports (color: color-mix(in lab, red, red)) {
|
|
@@ -1711,9 +1800,27 @@
|
|
|
1711
1800
|
background-color: color-mix(in srgb,var(--deframe-widget-color-text-secondary) 12%,transparent);
|
|
1712
1801
|
}
|
|
1713
1802
|
}
|
|
1803
|
+
.bg-\[color\:color-mix\(in_srgb\,var\(--deframe-widget-color-text-tertiary\)_10\%\,transparent\)\] {
|
|
1804
|
+
background-color: var(--deframe-widget-color-text-tertiary);
|
|
1805
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
1806
|
+
background-color: color-mix(in srgb,var(--deframe-widget-color-text-tertiary) 10%,transparent);
|
|
1807
|
+
}
|
|
1808
|
+
}
|
|
1809
|
+
.bg-\[color\:var\(--deframe-widget-color-bg-primary\)\] {
|
|
1810
|
+
background-color: var(--deframe-widget-color-bg-primary);
|
|
1811
|
+
}
|
|
1714
1812
|
.bg-\[color\:var\(--deframe-widget-color-bg-secondary\)\] {
|
|
1715
1813
|
background-color: var(--deframe-widget-color-bg-secondary);
|
|
1716
1814
|
}
|
|
1815
|
+
.bg-\[color\:var\(--deframe-widget-color-bg-tertiary\)\] {
|
|
1816
|
+
background-color: var(--deframe-widget-color-bg-tertiary);
|
|
1817
|
+
}
|
|
1818
|
+
.bg-\[color\:var\(--deframe-widget-color-border-primary\)\] {
|
|
1819
|
+
background-color: var(--deframe-widget-color-border-primary);
|
|
1820
|
+
}
|
|
1821
|
+
.bg-\[color\:var\(--deframe-widget-color-brand-primary\)\] {
|
|
1822
|
+
background-color: var(--deframe-widget-color-brand-primary);
|
|
1823
|
+
}
|
|
1717
1824
|
.bg-\[var\(--deframe-widget-color-bg-muted\)\] {
|
|
1718
1825
|
background-color: var(--deframe-widget-color-bg-muted);
|
|
1719
1826
|
}
|
|
@@ -2003,6 +2110,9 @@
|
|
|
2003
2110
|
.p-\[var\(--deframe-widget-size-padding-x-md\)\] {
|
|
2004
2111
|
padding: var(--deframe-widget-size-padding-x-md);
|
|
2005
2112
|
}
|
|
2113
|
+
.p-\[var\(--deframe-widget-size-padding-x-sm\)\] {
|
|
2114
|
+
padding: var(--deframe-widget-size-padding-x-sm);
|
|
2115
|
+
}
|
|
2006
2116
|
.p-\[var\(--deframe-widget-size-padding-y-md\)\] {
|
|
2007
2117
|
padding: var(--deframe-widget-size-padding-y-md);
|
|
2008
2118
|
}
|
|
@@ -2111,6 +2221,9 @@
|
|
|
2111
2221
|
.py-\[11px\] {
|
|
2112
2222
|
padding-block: 11px;
|
|
2113
2223
|
}
|
|
2224
|
+
.py-\[12px\] {
|
|
2225
|
+
padding-block: 12px;
|
|
2226
|
+
}
|
|
2114
2227
|
.py-\[13px\] {
|
|
2115
2228
|
padding-block: 13px;
|
|
2116
2229
|
}
|
|
@@ -2355,6 +2468,9 @@
|
|
|
2355
2468
|
.text-\[length\:var\(--deframe-widget-font-size-sm\)\] {
|
|
2356
2469
|
font-size: var(--deframe-widget-font-size-sm);
|
|
2357
2470
|
}
|
|
2471
|
+
.text-\[length\:var\(--deframe-widget-font-size-xl\)\] {
|
|
2472
|
+
font-size: var(--deframe-widget-font-size-xl);
|
|
2473
|
+
}
|
|
2358
2474
|
.text-\[length\:var\(--deframe-widget-font-size-xs\)\] {
|
|
2359
2475
|
font-size: var(--deframe-widget-font-size-xs);
|
|
2360
2476
|
}
|
|
@@ -2409,6 +2525,10 @@
|
|
|
2409
2525
|
--tw-leading: 140%;
|
|
2410
2526
|
line-height: 140%;
|
|
2411
2527
|
}
|
|
2528
|
+
.leading-\[var\(--deframe-widget-font-leading-lg\)\] {
|
|
2529
|
+
--tw-leading: var(--deframe-widget-font-leading-lg);
|
|
2530
|
+
line-height: var(--deframe-widget-font-leading-lg);
|
|
2531
|
+
}
|
|
2412
2532
|
.leading-\[var\(--deframe-widget-font-leading-md\)\] {
|
|
2413
2533
|
--tw-leading: var(--deframe-widget-font-leading-md);
|
|
2414
2534
|
line-height: var(--deframe-widget-font-leading-md);
|
|
@@ -2417,6 +2537,10 @@
|
|
|
2417
2537
|
--tw-leading: var(--deframe-widget-font-leading-sm);
|
|
2418
2538
|
line-height: var(--deframe-widget-font-leading-sm);
|
|
2419
2539
|
}
|
|
2540
|
+
.leading-\[var\(--deframe-widget-font-leading-xl\)\] {
|
|
2541
|
+
--tw-leading: var(--deframe-widget-font-leading-xl);
|
|
2542
|
+
line-height: var(--deframe-widget-font-leading-xl);
|
|
2543
|
+
}
|
|
2420
2544
|
.leading-\[var\(--deframe-widget-font-leading-xs\)\] {
|
|
2421
2545
|
--tw-leading: var(--deframe-widget-font-leading-xs);
|
|
2422
2546
|
line-height: var(--deframe-widget-font-leading-xs);
|
|
@@ -2484,6 +2608,14 @@
|
|
|
2484
2608
|
--tw-font-weight: var(--deframe-widget-font-family);
|
|
2485
2609
|
font-weight: var(--deframe-widget-font-family);
|
|
2486
2610
|
}
|
|
2611
|
+
.font-\[var\(--deframe-widget-font-weight-medium\)\] {
|
|
2612
|
+
--tw-font-weight: var(--deframe-widget-font-weight-medium);
|
|
2613
|
+
font-weight: var(--deframe-widget-font-weight-medium);
|
|
2614
|
+
}
|
|
2615
|
+
.font-\[var\(--deframe-widget-font-weight-semibold\)\] {
|
|
2616
|
+
--tw-font-weight: var(--deframe-widget-font-weight-semibold);
|
|
2617
|
+
font-weight: var(--deframe-widget-font-weight-semibold);
|
|
2618
|
+
}
|
|
2487
2619
|
.font-bold {
|
|
2488
2620
|
--tw-font-weight: var(--font-weight-bold);
|
|
2489
2621
|
font-weight: var(--font-weight-bold);
|
|
@@ -2804,6 +2936,10 @@
|
|
|
2804
2936
|
}
|
|
2805
2937
|
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
2806
2938
|
}
|
|
2939
|
+
.shadow-\[0_20px_50px_rgba\(17\,20\,27\,0\.12\)\] {
|
|
2940
|
+
--tw-shadow: 0 20px 50px var(--tw-shadow-color, rgba(17,20,27,0.12));
|
|
2941
|
+
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
2942
|
+
}
|
|
2807
2943
|
.shadow-\[0px_1px_3px_0px_rgba\(0\,0\,0\,0\.1\)\] {
|
|
2808
2944
|
--tw-shadow: 0px 1px 3px 0px var(--tw-shadow-color, rgba(0,0,0,0.1));
|
|
2809
2945
|
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
@@ -3178,6 +3314,13 @@
|
|
|
3178
3314
|
}
|
|
3179
3315
|
}
|
|
3180
3316
|
}
|
|
3317
|
+
.hover\:bg-\[color\:var\(--deframe-widget-color-bg-tertiary\)\] {
|
|
3318
|
+
&:hover {
|
|
3319
|
+
@media (hover: hover) {
|
|
3320
|
+
background-color: var(--deframe-widget-color-bg-tertiary);
|
|
3321
|
+
}
|
|
3322
|
+
}
|
|
3323
|
+
}
|
|
3181
3324
|
.hover\:bg-\[rgba\(255\,255\,255\,0\.06\)\] {
|
|
3182
3325
|
&:hover {
|
|
3183
3326
|
@media (hover: hover) {
|