@kbach/react 0.5.32 → 0.5.34
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/README.md +13 -1
- package/dist/{chunk-X6FH5QTD.mjs → chunk-6AUSWRH2.mjs} +1 -1
- package/dist/{chunk-VZD4672I.mjs → chunk-LMCUZ3HI.mjs} +2 -2
- package/dist/{chunk-SOBLKZGE.mjs → chunk-T3SOZ6AO.mjs} +454 -434
- package/dist/index.js +450 -434
- package/dist/index.mjs +2 -2
- package/dist/jsx-dev-runtime.js +450 -434
- package/dist/jsx-dev-runtime.mjs +3 -3
- package/dist/jsx-runtime.js +450 -434
- package/dist/jsx-runtime.mjs +3 -3
- package/dist/vite-plugin.js +483 -493
- package/dist/vite-plugin.mjs +21 -49
- package/kbach-react.md +778 -0
- package/package.json +2 -2
- package/KBACH.md +0 -952
package/dist/jsx-dev-runtime.js
CHANGED
|
@@ -613,6 +613,10 @@ var LRUCache = class {
|
|
|
613
613
|
|
|
614
614
|
// src/core/platform.ts
|
|
615
615
|
var isWeb = typeof window !== "undefined" && typeof window.document !== "undefined" && typeof window.document.createElement !== "undefined";
|
|
616
|
+
var _cssGenMode = false;
|
|
617
|
+
function getEffectiveIsWeb() {
|
|
618
|
+
return isWeb || _cssGenMode;
|
|
619
|
+
}
|
|
616
620
|
function toNativeValue(raw) {
|
|
617
621
|
if (/^-?\d+(\.\d+)?px$/.test(raw)) return parseFloat(raw);
|
|
618
622
|
if (/^-?\d+(\.\d+)?rem$/.test(raw)) return parseFloat(raw) * 16;
|
|
@@ -1430,8 +1434,12 @@ function hexToRgba(hex, alpha) {
|
|
|
1430
1434
|
}
|
|
1431
1435
|
function resolveSpacing(value, negative, spacing, isArbitrary) {
|
|
1432
1436
|
if (isArbitrary) {
|
|
1433
|
-
const resolved =
|
|
1434
|
-
|
|
1437
|
+
const resolved = getEffectiveIsWeb() ? value : toNativeValue(value);
|
|
1438
|
+
if (negative) {
|
|
1439
|
+
if (typeof resolved === "number") return -resolved;
|
|
1440
|
+
if (typeof resolved === "string" && /^\d/.test(resolved)) return `-${resolved}`;
|
|
1441
|
+
}
|
|
1442
|
+
return resolved;
|
|
1435
1443
|
}
|
|
1436
1444
|
const raw = spacing[value];
|
|
1437
1445
|
if (raw === void 0) return null;
|
|
@@ -1443,7 +1451,7 @@ function resolveSpacing(value, negative, spacing, isArbitrary) {
|
|
|
1443
1451
|
return raw;
|
|
1444
1452
|
}
|
|
1445
1453
|
function resolveSizing(value, spacing, isArbitrary) {
|
|
1446
|
-
if (isArbitrary) return
|
|
1454
|
+
if (isArbitrary) return getEffectiveIsWeb() ? value : toNativeValue(value);
|
|
1447
1455
|
const raw = spacing[value];
|
|
1448
1456
|
if (raw !== void 0) return raw;
|
|
1449
1457
|
if (/^\d+\/\d+$/.test(value)) {
|
|
@@ -1453,356 +1461,364 @@ function resolveSizing(value, spacing, isArbitrary) {
|
|
|
1453
1461
|
return null;
|
|
1454
1462
|
}
|
|
1455
1463
|
function resolveRadius(value, radii, isArbitrary) {
|
|
1456
|
-
if (isArbitrary) return
|
|
1464
|
+
if (isArbitrary) return getEffectiveIsWeb() ? value : toNativeValue(value);
|
|
1457
1465
|
const key = value === "" ? "DEFAULT" : value;
|
|
1458
1466
|
return radii[key] ?? null;
|
|
1459
1467
|
}
|
|
1460
1468
|
function resolveFontSize(value, fontSizes, isArbitrary) {
|
|
1461
|
-
if (isArbitrary) return
|
|
1469
|
+
if (isArbitrary) return getEffectiveIsWeb() ? value : toNativeValue(value);
|
|
1462
1470
|
return fontSizes[value] ?? null;
|
|
1463
1471
|
}
|
|
1464
1472
|
var FILTER_COMPOSE = "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,)";
|
|
1465
1473
|
var BACKDROP_FILTER_COMPOSE = "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,)";
|
|
1466
|
-
var
|
|
1467
|
-
|
|
1468
|
-
|
|
1469
|
-
|
|
1470
|
-
|
|
1471
|
-
|
|
1472
|
-
|
|
1473
|
-
|
|
1474
|
-
|
|
1475
|
-
|
|
1476
|
-
|
|
1477
|
-
|
|
1478
|
-
|
|
1479
|
-
|
|
1480
|
-
|
|
1481
|
-
|
|
1482
|
-
|
|
1483
|
-
|
|
1484
|
-
|
|
1485
|
-
|
|
1486
|
-
|
|
1487
|
-
|
|
1488
|
-
|
|
1489
|
-
|
|
1490
|
-
|
|
1491
|
-
|
|
1492
|
-
|
|
1493
|
-
|
|
1494
|
-
|
|
1495
|
-
|
|
1496
|
-
|
|
1497
|
-
|
|
1498
|
-
|
|
1499
|
-
|
|
1500
|
-
|
|
1501
|
-
|
|
1502
|
-
|
|
1503
|
-
|
|
1504
|
-
|
|
1505
|
-
|
|
1506
|
-
|
|
1507
|
-
|
|
1508
|
-
|
|
1509
|
-
|
|
1510
|
-
|
|
1511
|
-
|
|
1512
|
-
|
|
1513
|
-
|
|
1514
|
-
|
|
1515
|
-
|
|
1516
|
-
|
|
1517
|
-
|
|
1518
|
-
|
|
1519
|
-
|
|
1520
|
-
|
|
1521
|
-
|
|
1522
|
-
|
|
1523
|
-
|
|
1524
|
-
|
|
1525
|
-
|
|
1526
|
-
|
|
1527
|
-
|
|
1528
|
-
|
|
1529
|
-
|
|
1530
|
-
|
|
1531
|
-
|
|
1532
|
-
|
|
1533
|
-
|
|
1534
|
-
|
|
1535
|
-
|
|
1536
|
-
|
|
1537
|
-
|
|
1538
|
-
|
|
1539
|
-
|
|
1540
|
-
|
|
1541
|
-
|
|
1542
|
-
|
|
1543
|
-
|
|
1544
|
-
|
|
1545
|
-
|
|
1546
|
-
|
|
1547
|
-
|
|
1548
|
-
|
|
1549
|
-
|
|
1550
|
-
|
|
1551
|
-
|
|
1552
|
-
|
|
1553
|
-
|
|
1554
|
-
|
|
1555
|
-
|
|
1556
|
-
|
|
1557
|
-
|
|
1558
|
-
|
|
1559
|
-
|
|
1560
|
-
|
|
1561
|
-
|
|
1562
|
-
|
|
1563
|
-
|
|
1564
|
-
|
|
1565
|
-
|
|
1566
|
-
|
|
1567
|
-
|
|
1568
|
-
|
|
1569
|
-
|
|
1570
|
-
|
|
1571
|
-
|
|
1572
|
-
|
|
1573
|
-
|
|
1574
|
-
|
|
1575
|
-
|
|
1576
|
-
|
|
1577
|
-
|
|
1578
|
-
|
|
1579
|
-
|
|
1580
|
-
|
|
1581
|
-
|
|
1582
|
-
|
|
1583
|
-
|
|
1584
|
-
|
|
1585
|
-
|
|
1586
|
-
|
|
1587
|
-
|
|
1588
|
-
|
|
1589
|
-
|
|
1590
|
-
|
|
1591
|
-
|
|
1592
|
-
|
|
1593
|
-
|
|
1594
|
-
|
|
1595
|
-
|
|
1596
|
-
|
|
1597
|
-
|
|
1598
|
-
|
|
1599
|
-
|
|
1600
|
-
|
|
1601
|
-
|
|
1602
|
-
|
|
1603
|
-
|
|
1604
|
-
|
|
1605
|
-
|
|
1606
|
-
|
|
1607
|
-
|
|
1608
|
-
|
|
1609
|
-
|
|
1610
|
-
|
|
1611
|
-
|
|
1612
|
-
|
|
1613
|
-
|
|
1614
|
-
|
|
1615
|
-
|
|
1616
|
-
|
|
1617
|
-
|
|
1618
|
-
|
|
1619
|
-
|
|
1620
|
-
|
|
1621
|
-
|
|
1622
|
-
|
|
1623
|
-
|
|
1624
|
-
|
|
1625
|
-
|
|
1626
|
-
|
|
1627
|
-
|
|
1628
|
-
|
|
1629
|
-
|
|
1630
|
-
|
|
1631
|
-
|
|
1632
|
-
|
|
1633
|
-
|
|
1634
|
-
|
|
1635
|
-
|
|
1636
|
-
|
|
1637
|
-
|
|
1638
|
-
|
|
1639
|
-
|
|
1640
|
-
|
|
1641
|
-
|
|
1642
|
-
|
|
1643
|
-
|
|
1644
|
-
|
|
1645
|
-
|
|
1646
|
-
|
|
1647
|
-
|
|
1648
|
-
|
|
1649
|
-
|
|
1650
|
-
|
|
1651
|
-
|
|
1652
|
-
|
|
1653
|
-
|
|
1654
|
-
|
|
1655
|
-
|
|
1656
|
-
|
|
1657
|
-
|
|
1658
|
-
|
|
1659
|
-
|
|
1660
|
-
|
|
1661
|
-
|
|
1662
|
-
|
|
1663
|
-
|
|
1664
|
-
|
|
1665
|
-
|
|
1666
|
-
|
|
1667
|
-
|
|
1668
|
-
|
|
1669
|
-
|
|
1670
|
-
|
|
1671
|
-
|
|
1672
|
-
|
|
1673
|
-
|
|
1674
|
-
|
|
1675
|
-
|
|
1676
|
-
|
|
1677
|
-
|
|
1678
|
-
|
|
1679
|
-
|
|
1680
|
-
|
|
1681
|
-
|
|
1682
|
-
|
|
1683
|
-
|
|
1684
|
-
|
|
1685
|
-
|
|
1686
|
-
|
|
1687
|
-
|
|
1688
|
-
|
|
1689
|
-
|
|
1690
|
-
|
|
1691
|
-
|
|
1692
|
-
|
|
1693
|
-
|
|
1694
|
-
|
|
1695
|
-
|
|
1696
|
-
|
|
1697
|
-
|
|
1698
|
-
|
|
1699
|
-
|
|
1700
|
-
|
|
1701
|
-
|
|
1702
|
-
|
|
1703
|
-
|
|
1704
|
-
|
|
1705
|
-
|
|
1706
|
-
|
|
1707
|
-
|
|
1708
|
-
|
|
1709
|
-
|
|
1710
|
-
|
|
1711
|
-
|
|
1712
|
-
|
|
1713
|
-
|
|
1714
|
-
|
|
1715
|
-
|
|
1716
|
-
|
|
1717
|
-
|
|
1718
|
-
|
|
1719
|
-
|
|
1720
|
-
|
|
1721
|
-
|
|
1722
|
-
|
|
1723
|
-
|
|
1724
|
-
|
|
1725
|
-
|
|
1726
|
-
|
|
1727
|
-
|
|
1728
|
-
|
|
1729
|
-
|
|
1730
|
-
|
|
1731
|
-
|
|
1732
|
-
|
|
1733
|
-
|
|
1734
|
-
|
|
1735
|
-
|
|
1736
|
-
|
|
1737
|
-
|
|
1738
|
-
|
|
1739
|
-
|
|
1740
|
-
|
|
1741
|
-
|
|
1742
|
-
|
|
1743
|
-
|
|
1744
|
-
|
|
1745
|
-
|
|
1746
|
-
|
|
1747
|
-
|
|
1748
|
-
|
|
1749
|
-
|
|
1750
|
-
|
|
1751
|
-
|
|
1752
|
-
|
|
1753
|
-
|
|
1754
|
-
|
|
1755
|
-
|
|
1756
|
-
|
|
1757
|
-
|
|
1758
|
-
|
|
1759
|
-
|
|
1760
|
-
|
|
1761
|
-
|
|
1762
|
-
|
|
1763
|
-
|
|
1764
|
-
|
|
1765
|
-
|
|
1766
|
-
|
|
1767
|
-
|
|
1768
|
-
|
|
1769
|
-
|
|
1770
|
-
|
|
1771
|
-
|
|
1772
|
-
|
|
1773
|
-
|
|
1774
|
-
|
|
1775
|
-
|
|
1776
|
-
|
|
1777
|
-
|
|
1778
|
-
|
|
1779
|
-
|
|
1780
|
-
|
|
1781
|
-
|
|
1782
|
-
|
|
1783
|
-
|
|
1784
|
-
|
|
1785
|
-
|
|
1786
|
-
|
|
1787
|
-
|
|
1788
|
-
|
|
1789
|
-
|
|
1790
|
-
|
|
1791
|
-
|
|
1792
|
-
|
|
1793
|
-
|
|
1794
|
-
|
|
1795
|
-
|
|
1796
|
-
|
|
1797
|
-
|
|
1798
|
-
|
|
1799
|
-
|
|
1800
|
-
|
|
1801
|
-
|
|
1802
|
-
|
|
1803
|
-
|
|
1804
|
-
|
|
1805
|
-
}
|
|
1474
|
+
var _standalone = null;
|
|
1475
|
+
function buildStandalone() {
|
|
1476
|
+
const web = getEffectiveIsWeb();
|
|
1477
|
+
return {
|
|
1478
|
+
// Display
|
|
1479
|
+
// React Native only supports display:'flex'|'none'. Setting 'flex' explicitly is
|
|
1480
|
+
// a no-op normally, but is needed to re-show an element that was hidden via `hidden`.
|
|
1481
|
+
// `grid`, `inline-*`, `contents`, `flow-root` have no native equivalent.
|
|
1482
|
+
flex: { display: "flex" },
|
|
1483
|
+
block: web ? { display: "block" } : null,
|
|
1484
|
+
"inline-block": web ? { display: "inline-block" } : null,
|
|
1485
|
+
inline: web ? { display: "inline" } : null,
|
|
1486
|
+
grid: web ? { display: "grid" } : null,
|
|
1487
|
+
grd: web ? { display: "grid" } : null,
|
|
1488
|
+
"inline-flex": { display: web ? "inline-flex" : "flex" },
|
|
1489
|
+
"inline-grid": web ? { display: "inline-grid" } : null,
|
|
1490
|
+
hidden: { display: "none" },
|
|
1491
|
+
contents: web ? { display: "contents" } : null,
|
|
1492
|
+
"flow-root": web ? { display: "flow-root" } : null,
|
|
1493
|
+
// Flex direction (both web and native)
|
|
1494
|
+
"flex-row": { flexDirection: "row" },
|
|
1495
|
+
"flex-col": { flexDirection: "column" },
|
|
1496
|
+
"flex-row-reverse": { flexDirection: "row-reverse" },
|
|
1497
|
+
"flex-col-reverse": { flexDirection: "column-reverse" },
|
|
1498
|
+
// Flex wrap (both)
|
|
1499
|
+
"flex-wrap": { flexWrap: "wrap" },
|
|
1500
|
+
"flex-wrap-reverse": { flexWrap: "wrap-reverse" },
|
|
1501
|
+
"flex-nowrap": { flexWrap: "nowrap" },
|
|
1502
|
+
// Flex grow / shrink (both)
|
|
1503
|
+
"flex-grow": { flexGrow: 1 },
|
|
1504
|
+
"flex-grow-0": { flexGrow: 0 },
|
|
1505
|
+
"flex-shrink": { flexShrink: 1 },
|
|
1506
|
+
"flex-shrink-0": { flexShrink: 0 },
|
|
1507
|
+
// Align items (both)
|
|
1508
|
+
"items-start": { alignItems: "flex-start" },
|
|
1509
|
+
"items-end": { alignItems: "flex-end" },
|
|
1510
|
+
"items-center": { alignItems: "center" },
|
|
1511
|
+
"items-baseline": { alignItems: "baseline" },
|
|
1512
|
+
"items-stretch": { alignItems: "stretch" },
|
|
1513
|
+
// Justify content (both)
|
|
1514
|
+
"justify-start": { justifyContent: "flex-start" },
|
|
1515
|
+
"justify-end": { justifyContent: "flex-end" },
|
|
1516
|
+
"justify-center": { justifyContent: "center" },
|
|
1517
|
+
"justify-between": { justifyContent: "space-between" },
|
|
1518
|
+
"justify-around": { justifyContent: "space-around" },
|
|
1519
|
+
"justify-evenly": { justifyContent: "space-evenly" },
|
|
1520
|
+
// Align content (both)
|
|
1521
|
+
"content-start": { alignContent: "flex-start" },
|
|
1522
|
+
"content-end": { alignContent: "flex-end" },
|
|
1523
|
+
"content-center": { alignContent: "center" },
|
|
1524
|
+
"content-between": { alignContent: "space-between" },
|
|
1525
|
+
"content-around": { alignContent: "space-around" },
|
|
1526
|
+
"content-evenly": { alignContent: "space-evenly" },
|
|
1527
|
+
"content-stretch": { alignContent: "stretch" },
|
|
1528
|
+
// Align self (both)
|
|
1529
|
+
"self-auto": { alignSelf: "auto" },
|
|
1530
|
+
"self-start": { alignSelf: "flex-start" },
|
|
1531
|
+
"self-end": { alignSelf: "flex-end" },
|
|
1532
|
+
"self-center": { alignSelf: "center" },
|
|
1533
|
+
"self-stretch": { alignSelf: "stretch" },
|
|
1534
|
+
"self-baseline": { alignSelf: "baseline" },
|
|
1535
|
+
// Text align (both)
|
|
1536
|
+
"text-left": { textAlign: "left" },
|
|
1537
|
+
"text-right": { textAlign: "right" },
|
|
1538
|
+
"text-center": { textAlign: "center" },
|
|
1539
|
+
"text-justify": { textAlign: "justify" },
|
|
1540
|
+
// Font weight shortcuts (both)
|
|
1541
|
+
"font-thin": { fontWeight: "100" },
|
|
1542
|
+
"font-extralight": { fontWeight: "200" },
|
|
1543
|
+
"font-light": { fontWeight: "300" },
|
|
1544
|
+
"font-normal": { fontWeight: "400" },
|
|
1545
|
+
"font-medium": { fontWeight: "500" },
|
|
1546
|
+
"font-semibold": { fontWeight: "600" },
|
|
1547
|
+
"font-bold": { fontWeight: "700" },
|
|
1548
|
+
"font-extrabold": { fontWeight: "800" },
|
|
1549
|
+
"font-black": { fontWeight: "900" },
|
|
1550
|
+
// Text decoration (overline is web-only)
|
|
1551
|
+
underline: { textDecorationLine: "underline" },
|
|
1552
|
+
overline: web ? { textDecorationLine: "overline" } : null,
|
|
1553
|
+
"line-through": { textDecorationLine: "line-through" },
|
|
1554
|
+
"no-underline": { textDecorationLine: "none" },
|
|
1555
|
+
// Text transform (both)
|
|
1556
|
+
uppercase: { textTransform: "uppercase" },
|
|
1557
|
+
lowercase: { textTransform: "lowercase" },
|
|
1558
|
+
capitalize: { textTransform: "capitalize" },
|
|
1559
|
+
"normal-case": { textTransform: "none" },
|
|
1560
|
+
// Font style (both)
|
|
1561
|
+
italic: { fontStyle: "italic" },
|
|
1562
|
+
"non-italic": { fontStyle: "normal" },
|
|
1563
|
+
// Position (fixed/sticky/static are web-only; RN only supports relative/absolute)
|
|
1564
|
+
relative: { position: "relative" },
|
|
1565
|
+
absolute: { position: "absolute" },
|
|
1566
|
+
fixed: web ? { position: "fixed" } : null,
|
|
1567
|
+
sticky: web ? { position: "sticky" } : null,
|
|
1568
|
+
static: web ? { position: "static" } : null,
|
|
1569
|
+
// Visibility (no `visibility` prop on native; use opacity instead)
|
|
1570
|
+
visible: web ? { visibility: "visible" } : null,
|
|
1571
|
+
invisible: web ? { visibility: "hidden" } : { opacity: 0 },
|
|
1572
|
+
// Overflow (RN supports 'hidden' | 'visible' | 'scroll'; not 'auto')
|
|
1573
|
+
"overflow-hidden": { overflow: "hidden" },
|
|
1574
|
+
"overflow-visible": { overflow: "visible" },
|
|
1575
|
+
"overflow-scroll": { overflow: "scroll" },
|
|
1576
|
+
"overflow-auto": web ? { overflow: "auto" } : { overflow: "scroll" },
|
|
1577
|
+
// overflowX / overflowY are web-only
|
|
1578
|
+
"overflow-x-hidden": web ? { overflowX: "hidden" } : null,
|
|
1579
|
+
"overflow-x-scroll": web ? { overflowX: "scroll" } : null,
|
|
1580
|
+
"overflow-x-auto": web ? { overflowX: "auto" } : null,
|
|
1581
|
+
"overflow-y-hidden": web ? { overflowY: "hidden" } : null,
|
|
1582
|
+
"overflow-y-scroll": web ? { overflowY: "scroll" } : null,
|
|
1583
|
+
"overflow-y-auto": web ? { overflowY: "auto" } : null,
|
|
1584
|
+
// Object fit (web-only; use resizeMode prop on RN Image)
|
|
1585
|
+
"object-contain": web ? { objectFit: "contain" } : null,
|
|
1586
|
+
"object-cover": web ? { objectFit: "cover" } : null,
|
|
1587
|
+
"object-fill": web ? { objectFit: "fill" } : null,
|
|
1588
|
+
"object-none": web ? { objectFit: "none" } : null,
|
|
1589
|
+
"object-scale-down": web ? { objectFit: "scale-down" } : null,
|
|
1590
|
+
// Border style (both)
|
|
1591
|
+
"border-solid": { borderStyle: "solid" },
|
|
1592
|
+
"border-dashed": { borderStyle: "dashed" },
|
|
1593
|
+
"border-dotted": { borderStyle: "dotted" },
|
|
1594
|
+
"border-none": { borderWidth: 0 },
|
|
1595
|
+
// Border sides default width (both)
|
|
1596
|
+
"border-t": { borderTopWidth: 1 },
|
|
1597
|
+
"border-r": { borderRightWidth: 1 },
|
|
1598
|
+
"border-b": { borderBottomWidth: 1 },
|
|
1599
|
+
"border-l": { borderLeftWidth: 1 },
|
|
1600
|
+
// Cursor (web-only)
|
|
1601
|
+
"cursor-auto": web ? { cursor: "auto" } : null,
|
|
1602
|
+
"cursor-default": web ? { cursor: "default" } : null,
|
|
1603
|
+
"cursor-pointer": web ? { cursor: "pointer" } : null,
|
|
1604
|
+
"cursor-wait": web ? { cursor: "wait" } : null,
|
|
1605
|
+
"cursor-text": web ? { cursor: "text" } : null,
|
|
1606
|
+
"cursor-move": web ? { cursor: "move" } : null,
|
|
1607
|
+
"cursor-not-allowed": web ? { cursor: "not-allowed" } : null,
|
|
1608
|
+
// User select (web-only)
|
|
1609
|
+
"select-none": web ? { userSelect: "none" } : null,
|
|
1610
|
+
"select-text": web ? { userSelect: "text" } : null,
|
|
1611
|
+
"select-all": web ? { userSelect: "all" } : null,
|
|
1612
|
+
"select-auto": web ? { userSelect: "auto" } : null,
|
|
1613
|
+
// Pointer events (both)
|
|
1614
|
+
"pointer-events-none": { pointerEvents: "none" },
|
|
1615
|
+
"pointer-events-auto": { pointerEvents: "auto" },
|
|
1616
|
+
// Whitespace (web-only; RN Text uses numberOfLines prop instead)
|
|
1617
|
+
"whitespace-normal": web ? { whiteSpace: "normal" } : null,
|
|
1618
|
+
"whitespace-nowrap": web ? { whiteSpace: "nowrap" } : null,
|
|
1619
|
+
"whitespace-pre": web ? { whiteSpace: "pre" } : null,
|
|
1620
|
+
"whitespace-pre-wrap": web ? { whiteSpace: "pre-wrap" } : null,
|
|
1621
|
+
"whitespace-pre-line": web ? { whiteSpace: "pre-line" } : null,
|
|
1622
|
+
// Word break (web-only)
|
|
1623
|
+
"break-normal": web ? { overflowWrap: "normal", wordBreak: "normal" } : null,
|
|
1624
|
+
"break-words": web ? { overflowWrap: "break-word" } : null,
|
|
1625
|
+
"break-all": web ? { wordBreak: "break-all" } : null,
|
|
1626
|
+
// Misc web-only
|
|
1627
|
+
truncate: web ? { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } : null,
|
|
1628
|
+
"box-border": web ? { boxSizing: "border-box" } : null,
|
|
1629
|
+
"box-content": web ? { boxSizing: "content-box" } : null,
|
|
1630
|
+
"appearance-none": web ? { appearance: "none" } : null,
|
|
1631
|
+
"outline-none": web ? { outline: "none", outlineOffset: "0" } : null,
|
|
1632
|
+
outline: web ? { outline: "2px solid transparent", outlineOffset: "2px" } : null,
|
|
1633
|
+
resize: web ? { resize: "both" } : null,
|
|
1634
|
+
"resize-none": web ? { resize: "none" } : null,
|
|
1635
|
+
"resize-y": web ? { resize: "vertical" } : null,
|
|
1636
|
+
"resize-x": web ? { resize: "horizontal" } : null,
|
|
1637
|
+
antialiased: web ? { WebkitFontSmoothing: "antialiased", MozOsxFontSmoothing: "grayscale" } : null,
|
|
1638
|
+
"subpixel-antialiased": web ? { WebkitFontSmoothing: "subpixel-antialiased", MozOsxFontSmoothing: "auto" } : null,
|
|
1639
|
+
"overflow-ellipsis": web ? { textOverflow: "ellipsis" } : null,
|
|
1640
|
+
"sr-only": web ? {
|
|
1641
|
+
position: "absolute",
|
|
1642
|
+
width: 1,
|
|
1643
|
+
height: 1,
|
|
1644
|
+
padding: 0,
|
|
1645
|
+
margin: -1,
|
|
1646
|
+
overflow: "hidden",
|
|
1647
|
+
clip: "rect(0,0,0,0)",
|
|
1648
|
+
whiteSpace: "nowrap",
|
|
1649
|
+
border: 0
|
|
1650
|
+
} : null,
|
|
1651
|
+
"not-sr-only": web ? {
|
|
1652
|
+
position: "static",
|
|
1653
|
+
width: "auto",
|
|
1654
|
+
height: "auto",
|
|
1655
|
+
padding: 0,
|
|
1656
|
+
margin: 0,
|
|
1657
|
+
overflow: "visible",
|
|
1658
|
+
clip: "auto",
|
|
1659
|
+
whiteSpace: "normal"
|
|
1660
|
+
} : null,
|
|
1661
|
+
// Lists (web-only)
|
|
1662
|
+
"list-none": web ? { listStyleType: "none" } : null,
|
|
1663
|
+
"list-disc": web ? { listStyleType: "disc" } : null,
|
|
1664
|
+
"list-decimal": web ? { listStyleType: "decimal" } : null,
|
|
1665
|
+
// Background clip (web-only)
|
|
1666
|
+
"bg-clip-border": web ? { backgroundClip: "border-box" } : null,
|
|
1667
|
+
"bg-clip-padding": web ? { backgroundClip: "padding-box" } : null,
|
|
1668
|
+
"bg-clip-content": web ? { backgroundClip: "content-box" } : null,
|
|
1669
|
+
"bg-clip-text": web ? { backgroundClip: "text", WebkitBackgroundClip: "text" } : null,
|
|
1670
|
+
// Background image
|
|
1671
|
+
"bg-none": web ? { backgroundImage: "none" } : null,
|
|
1672
|
+
// Background size (web-only)
|
|
1673
|
+
"bg-auto": web ? { backgroundSize: "auto" } : null,
|
|
1674
|
+
"bg-cover": web ? { backgroundSize: "cover" } : null,
|
|
1675
|
+
"bg-contain": web ? { backgroundSize: "contain" } : null,
|
|
1676
|
+
// Background position (web-only)
|
|
1677
|
+
"bg-center": web ? { backgroundPosition: "center" } : null,
|
|
1678
|
+
"bg-top": web ? { backgroundPosition: "top" } : null,
|
|
1679
|
+
"bg-bottom": web ? { backgroundPosition: "bottom" } : null,
|
|
1680
|
+
"bg-left": web ? { backgroundPosition: "left" } : null,
|
|
1681
|
+
"bg-right": web ? { backgroundPosition: "right" } : null,
|
|
1682
|
+
"bg-left-top": web ? { backgroundPosition: "left top" } : null,
|
|
1683
|
+
"bg-left-bottom": web ? { backgroundPosition: "left bottom" } : null,
|
|
1684
|
+
"bg-right-top": web ? { backgroundPosition: "right top" } : null,
|
|
1685
|
+
"bg-right-bottom": web ? { backgroundPosition: "right bottom" } : null,
|
|
1686
|
+
// Background repeat (web-only)
|
|
1687
|
+
"bg-repeat": web ? { backgroundRepeat: "repeat" } : null,
|
|
1688
|
+
"bg-no-repeat": web ? { backgroundRepeat: "no-repeat" } : null,
|
|
1689
|
+
"bg-repeat-x": web ? { backgroundRepeat: "repeat-x" } : null,
|
|
1690
|
+
"bg-repeat-y": web ? { backgroundRepeat: "repeat-y" } : null,
|
|
1691
|
+
"bg-repeat-round": web ? { backgroundRepeat: "round" } : null,
|
|
1692
|
+
"bg-repeat-space": web ? { backgroundRepeat: "space" } : null,
|
|
1693
|
+
// Background attachment (web-only)
|
|
1694
|
+
"bg-fixed": web ? { backgroundAttachment: "fixed" } : null,
|
|
1695
|
+
"bg-local": web ? { backgroundAttachment: "local" } : null,
|
|
1696
|
+
"bg-scroll": web ? { backgroundAttachment: "scroll" } : null,
|
|
1697
|
+
// Object position (web-only)
|
|
1698
|
+
"object-center": web ? { objectPosition: "center" } : null,
|
|
1699
|
+
"object-top": web ? { objectPosition: "top" } : null,
|
|
1700
|
+
"object-bottom": web ? { objectPosition: "bottom" } : null,
|
|
1701
|
+
"object-left": web ? { objectPosition: "left" } : null,
|
|
1702
|
+
"object-right": web ? { objectPosition: "right" } : null,
|
|
1703
|
+
"object-left-top": web ? { objectPosition: "left top" } : null,
|
|
1704
|
+
"object-left-bottom": web ? { objectPosition: "left bottom" } : null,
|
|
1705
|
+
"object-right-top": web ? { objectPosition: "right top" } : null,
|
|
1706
|
+
"object-right-bottom": web ? { objectPosition: "right bottom" } : null,
|
|
1707
|
+
// Table (web-only)
|
|
1708
|
+
table: web ? { display: "table" } : null,
|
|
1709
|
+
"table-auto": web ? { tableLayout: "auto" } : null,
|
|
1710
|
+
"table-fixed": web ? { tableLayout: "fixed" } : null,
|
|
1711
|
+
"caption-top": web ? { captionSide: "top" } : null,
|
|
1712
|
+
"caption-bottom": web ? { captionSide: "bottom" } : null,
|
|
1713
|
+
"border-collapse": web ? { borderCollapse: "collapse" } : null,
|
|
1714
|
+
"border-separate": web ? { borderCollapse: "separate" } : null,
|
|
1715
|
+
// List style position (web-only)
|
|
1716
|
+
"list-inside": web ? { listStylePosition: "inside" } : null,
|
|
1717
|
+
"list-outside": web ? { listStylePosition: "outside" } : null,
|
|
1718
|
+
// Font variant numeric (web-only)
|
|
1719
|
+
"normal-nums": web ? { fontVariantNumeric: "normal" } : null,
|
|
1720
|
+
ordinal: web ? { fontVariantNumeric: "ordinal" } : null,
|
|
1721
|
+
"slashed-zero": web ? { fontVariantNumeric: "slashed-zero" } : null,
|
|
1722
|
+
"lining-nums": web ? { fontVariantNumeric: "lining-nums" } : null,
|
|
1723
|
+
"oldstyle-nums": web ? { fontVariantNumeric: "oldstyle-nums" } : null,
|
|
1724
|
+
"proportional-nums": web ? { fontVariantNumeric: "proportional-nums" } : null,
|
|
1725
|
+
"tabular-nums": web ? { fontVariantNumeric: "tabular-nums" } : null,
|
|
1726
|
+
"diagonal-fractions": web ? { fontVariantNumeric: "diagonal-fractions" } : null,
|
|
1727
|
+
"stacked-fractions": web ? { fontVariantNumeric: "stacked-fractions" } : null,
|
|
1728
|
+
// Isolation (web-only)
|
|
1729
|
+
isolate: web ? { isolation: "isolate" } : null,
|
|
1730
|
+
"isolation-auto": web ? { isolation: "auto" } : null,
|
|
1731
|
+
// Backface visibility (both iOS and Android)
|
|
1732
|
+
"backface-visible": { backfaceVisibility: "visible" },
|
|
1733
|
+
"backface-hidden": { backfaceVisibility: "hidden" },
|
|
1734
|
+
// CSS filters — standalone = default/full effect (web-only)
|
|
1735
|
+
grayscale: web ? { "--tw-grayscale": "grayscale(100%)", filter: FILTER_COMPOSE } : null,
|
|
1736
|
+
invert: web ? { "--tw-invert": "invert(100%)", filter: FILTER_COMPOSE } : null,
|
|
1737
|
+
sepia: web ? { "--tw-sepia": "sepia(100%)", filter: FILTER_COMPOSE } : null,
|
|
1738
|
+
// Divide none
|
|
1739
|
+
"divide-none": web ? { __divideX: 0, __divideY: 0 } : null,
|
|
1740
|
+
// Group / peer markers (no-op: no style emitted; just ensures isKnownUtility returns true)
|
|
1741
|
+
group: web ? {} : null,
|
|
1742
|
+
peer: web ? {} : null,
|
|
1743
|
+
// Text-wrap (web-only)
|
|
1744
|
+
"text-wrap": web ? { textWrap: "wrap" } : null,
|
|
1745
|
+
"text-nowrap": web ? { textWrap: "nowrap" } : null,
|
|
1746
|
+
"text-balance": web ? { textWrap: "balance" } : null,
|
|
1747
|
+
"text-pretty": web ? { textWrap: "pretty" } : null,
|
|
1748
|
+
// Screen sizing (vw values are web-only; vh values work cross-platform via spacing scale for h-*)
|
|
1749
|
+
"w-screen": web ? { width: "100vw" } : null,
|
|
1750
|
+
"min-h-screen": { minHeight: "100vh" },
|
|
1751
|
+
"max-h-screen": { maxHeight: "100vh" },
|
|
1752
|
+
"min-w-screen": web ? { minWidth: "100vw" } : null,
|
|
1753
|
+
"max-w-screen": web ? { maxWidth: "100vw" } : null,
|
|
1754
|
+
// max-w named container sizes (mirrors Tailwind's container scale)
|
|
1755
|
+
"max-w-none": { maxWidth: "none" },
|
|
1756
|
+
"max-w-xs": { maxWidth: 320 },
|
|
1757
|
+
"max-w-sm": { maxWidth: 384 },
|
|
1758
|
+
"max-w-md": { maxWidth: 448 },
|
|
1759
|
+
"max-w-lg": { maxWidth: 512 },
|
|
1760
|
+
"max-w-xl": { maxWidth: 576 },
|
|
1761
|
+
"max-w-2xl": { maxWidth: 672 },
|
|
1762
|
+
"max-w-3xl": { maxWidth: 768 },
|
|
1763
|
+
"max-w-4xl": { maxWidth: 896 },
|
|
1764
|
+
"max-w-5xl": { maxWidth: 1024 },
|
|
1765
|
+
"max-w-6xl": { maxWidth: 1152 },
|
|
1766
|
+
"max-w-7xl": { maxWidth: 1280 },
|
|
1767
|
+
"max-w-prose": web ? { maxWidth: "65ch" } : null,
|
|
1768
|
+
// Extended cursors (web-only)
|
|
1769
|
+
"cursor-grab": web ? { cursor: "grab" } : null,
|
|
1770
|
+
"cursor-grabbing": web ? { cursor: "grabbing" } : null,
|
|
1771
|
+
"cursor-zoom-in": web ? { cursor: "zoom-in" } : null,
|
|
1772
|
+
"cursor-zoom-out": web ? { cursor: "zoom-out" } : null,
|
|
1773
|
+
"cursor-crosshair": web ? { cursor: "crosshair" } : null,
|
|
1774
|
+
"cursor-help": web ? { cursor: "help" } : null,
|
|
1775
|
+
"cursor-none": web ? { cursor: "none" } : null,
|
|
1776
|
+
// Overflow clip (web-only)
|
|
1777
|
+
"overflow-clip": web ? { overflow: "clip" } : null,
|
|
1778
|
+
"overflow-x-clip": web ? { overflowX: "clip" } : null,
|
|
1779
|
+
"overflow-y-clip": web ? { overflowY: "clip" } : null,
|
|
1780
|
+
// Scroll behavior (web-only)
|
|
1781
|
+
"scroll-smooth": web ? { scrollBehavior: "smooth" } : null,
|
|
1782
|
+
"scroll-auto": web ? { scrollBehavior: "auto" } : null,
|
|
1783
|
+
// Float (web-only)
|
|
1784
|
+
"float-left": web ? { float: "left" } : null,
|
|
1785
|
+
"float-right": web ? { float: "right" } : null,
|
|
1786
|
+
"float-start": web ? { float: "inline-start" } : null,
|
|
1787
|
+
"float-end": web ? { float: "inline-end" } : null,
|
|
1788
|
+
"float-none": web ? { float: "none" } : null,
|
|
1789
|
+
// Clear (web-only)
|
|
1790
|
+
"clear-left": web ? { clear: "left" } : null,
|
|
1791
|
+
"clear-right": web ? { clear: "right" } : null,
|
|
1792
|
+
"clear-both": web ? { clear: "both" } : null,
|
|
1793
|
+
"clear-start": web ? { clear: "inline-start" } : null,
|
|
1794
|
+
"clear-end": web ? { clear: "inline-end" } : null,
|
|
1795
|
+
"clear-none": web ? { clear: "none" } : null,
|
|
1796
|
+
// Vertical align (web-only)
|
|
1797
|
+
"align-baseline": web ? { verticalAlign: "baseline" } : null,
|
|
1798
|
+
"align-top": web ? { verticalAlign: "top" } : null,
|
|
1799
|
+
"align-middle": web ? { verticalAlign: "middle" } : null,
|
|
1800
|
+
"align-bottom": web ? { verticalAlign: "bottom" } : null,
|
|
1801
|
+
"align-text-top": web ? { verticalAlign: "text-top" } : null,
|
|
1802
|
+
"align-text-bottom": web ? { verticalAlign: "text-bottom" } : null,
|
|
1803
|
+
"align-sub": web ? { verticalAlign: "sub" } : null,
|
|
1804
|
+
"align-super": web ? { verticalAlign: "super" } : null,
|
|
1805
|
+
// Touch action (web-only)
|
|
1806
|
+
"touch-auto": web ? { touchAction: "auto" } : null,
|
|
1807
|
+
"touch-none": web ? { touchAction: "none" } : null,
|
|
1808
|
+
"touch-pan-x": web ? { touchAction: "pan-x" } : null,
|
|
1809
|
+
"touch-pan-y": web ? { touchAction: "pan-y" } : null,
|
|
1810
|
+
"touch-pan-left": web ? { touchAction: "pan-left" } : null,
|
|
1811
|
+
"touch-pan-right": web ? { touchAction: "pan-right" } : null,
|
|
1812
|
+
"touch-pan-up": web ? { touchAction: "pan-up" } : null,
|
|
1813
|
+
"touch-pan-down": web ? { touchAction: "pan-down" } : null,
|
|
1814
|
+
"touch-pinch-zoom": web ? { touchAction: "pinch-zoom" } : null,
|
|
1815
|
+
"touch-manipulation": web ? { touchAction: "manipulation" } : null
|
|
1816
|
+
};
|
|
1817
|
+
}
|
|
1818
|
+
function getStandalone() {
|
|
1819
|
+
if (!_standalone) _standalone = buildStandalone();
|
|
1820
|
+
return _standalone;
|
|
1821
|
+
}
|
|
1806
1822
|
var RESOLVERS = {
|
|
1807
1823
|
// ── Background ─────────────────────────────────────────────────────────────
|
|
1808
1824
|
bg: ({ value, isArbitrary }, { colors }) => {
|
|
@@ -1810,7 +1826,7 @@ var RESOLVERS = {
|
|
|
1810
1826
|
return color ? { backgroundColor: color } : null;
|
|
1811
1827
|
},
|
|
1812
1828
|
"bg-opacity": ({ value }, _) => {
|
|
1813
|
-
if (!
|
|
1829
|
+
if (!getEffectiveIsWeb()) return null;
|
|
1814
1830
|
const v = parseFloat(value) / 100;
|
|
1815
1831
|
return isNaN(v) ? null : { "--bg-opacity": v };
|
|
1816
1832
|
},
|
|
@@ -1820,7 +1836,7 @@ var RESOLVERS = {
|
|
|
1820
1836
|
if (!isArbitrary && size !== null) return { fontSize: size };
|
|
1821
1837
|
if (isArbitrary) {
|
|
1822
1838
|
if (/^\d/.test(value) || /^(calc|min|max|clamp)/.test(value)) {
|
|
1823
|
-
return { fontSize:
|
|
1839
|
+
return { fontSize: getEffectiveIsWeb() ? value : toNativeValue(value) };
|
|
1824
1840
|
}
|
|
1825
1841
|
return { color: value };
|
|
1826
1842
|
}
|
|
@@ -1828,7 +1844,7 @@ var RESOLVERS = {
|
|
|
1828
1844
|
return color ? { color } : null;
|
|
1829
1845
|
},
|
|
1830
1846
|
"text-opacity": ({ value }, _) => {
|
|
1831
|
-
if (!
|
|
1847
|
+
if (!getEffectiveIsWeb()) return null;
|
|
1832
1848
|
const v = parseFloat(value) / 100;
|
|
1833
1849
|
return isNaN(v) ? null : { "--text-opacity": v };
|
|
1834
1850
|
},
|
|
@@ -2024,7 +2040,7 @@ var RESOLVERS = {
|
|
|
2024
2040
|
},
|
|
2025
2041
|
// ── Grid template columns/rows (Tailwind-style aliases, web-only) ──────────
|
|
2026
2042
|
"grid-cols": ({ value, isArbitrary }) => {
|
|
2027
|
-
if (!
|
|
2043
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2028
2044
|
if (!value) return null;
|
|
2029
2045
|
if (isArbitrary) return { display: "grid", gridTemplateColumns: value };
|
|
2030
2046
|
if (value === "none") return { display: "grid", gridTemplateColumns: "none" };
|
|
@@ -2033,7 +2049,7 @@ var RESOLVERS = {
|
|
|
2033
2049
|
return { display: "grid", gridTemplateColumns: `repeat(${n}, minmax(0, 1fr))` };
|
|
2034
2050
|
},
|
|
2035
2051
|
"grid-rows": ({ value, isArbitrary }) => {
|
|
2036
|
-
if (!
|
|
2052
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2037
2053
|
if (!value) return null;
|
|
2038
2054
|
if (isArbitrary) return { gridTemplateRows: value };
|
|
2039
2055
|
if (value === "none") return { gridTemplateRows: "none" };
|
|
@@ -2043,7 +2059,7 @@ var RESOLVERS = {
|
|
|
2043
2059
|
},
|
|
2044
2060
|
// ── Grid auto flow (web-only) ─────────────────────────────────────────────
|
|
2045
2061
|
"grid-flow": ({ value }) => {
|
|
2046
|
-
if (!
|
|
2062
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2047
2063
|
const flows = {
|
|
2048
2064
|
row: "row",
|
|
2049
2065
|
col: "column",
|
|
@@ -2056,7 +2072,7 @@ var RESOLVERS = {
|
|
|
2056
2072
|
},
|
|
2057
2073
|
// ── Grid auto sizing (web-only) ───────────────────────────────────────────
|
|
2058
2074
|
"auto-cols": ({ value, isArbitrary }) => {
|
|
2059
|
-
if (!
|
|
2075
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2060
2076
|
if (isArbitrary) return { gridAutoColumns: value };
|
|
2061
2077
|
const presets = {
|
|
2062
2078
|
auto: "auto",
|
|
@@ -2068,7 +2084,7 @@ var RESOLVERS = {
|
|
|
2068
2084
|
return v ? { gridAutoColumns: v } : null;
|
|
2069
2085
|
},
|
|
2070
2086
|
"auto-rows": ({ value, isArbitrary }) => {
|
|
2071
|
-
if (!
|
|
2087
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2072
2088
|
if (isArbitrary) return { gridAutoRows: value };
|
|
2073
2089
|
const presets = {
|
|
2074
2090
|
auto: "auto",
|
|
@@ -2081,54 +2097,54 @@ var RESOLVERS = {
|
|
|
2081
2097
|
},
|
|
2082
2098
|
// ── Grid column placement (web-only) ──────────────────────────────────────
|
|
2083
2099
|
"col-span": ({ value }) => {
|
|
2084
|
-
if (!
|
|
2100
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2085
2101
|
if (value === "full") return { gridColumn: "1 / -1" };
|
|
2086
2102
|
const n = parseInt(value, 10);
|
|
2087
2103
|
return isNaN(n) ? null : { gridColumn: `span ${n} / span ${n}` };
|
|
2088
2104
|
},
|
|
2089
2105
|
"col-start": ({ value, isArbitrary }) => {
|
|
2090
|
-
if (!
|
|
2106
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2091
2107
|
if (value === "auto") return { gridColumnStart: "auto" };
|
|
2092
2108
|
if (isArbitrary) return { gridColumnStart: value };
|
|
2093
2109
|
const n = parseInt(value, 10);
|
|
2094
2110
|
return isNaN(n) ? null : { gridColumnStart: n };
|
|
2095
2111
|
},
|
|
2096
2112
|
"col-end": ({ value, isArbitrary }) => {
|
|
2097
|
-
if (!
|
|
2113
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2098
2114
|
if (value === "auto") return { gridColumnEnd: "auto" };
|
|
2099
2115
|
if (isArbitrary) return { gridColumnEnd: value };
|
|
2100
2116
|
const n = parseInt(value, 10);
|
|
2101
2117
|
return isNaN(n) ? null : { gridColumnEnd: n };
|
|
2102
2118
|
},
|
|
2103
2119
|
col: ({ value, isArbitrary }) => {
|
|
2104
|
-
if (!
|
|
2120
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2105
2121
|
if (!value || value === "auto") return { gridColumn: "auto" };
|
|
2106
2122
|
if (isArbitrary) return { gridColumn: value };
|
|
2107
2123
|
return null;
|
|
2108
2124
|
},
|
|
2109
2125
|
// ── Grid row placement (web-only) ─────────────────────────────────────────
|
|
2110
2126
|
"row-span": ({ value }) => {
|
|
2111
|
-
if (!
|
|
2127
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2112
2128
|
if (value === "full") return { gridRow: "1 / -1" };
|
|
2113
2129
|
const n = parseInt(value, 10);
|
|
2114
2130
|
return isNaN(n) ? null : { gridRow: `span ${n} / span ${n}` };
|
|
2115
2131
|
},
|
|
2116
2132
|
"row-start": ({ value, isArbitrary }) => {
|
|
2117
|
-
if (!
|
|
2133
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2118
2134
|
if (value === "auto") return { gridRowStart: "auto" };
|
|
2119
2135
|
if (isArbitrary) return { gridRowStart: value };
|
|
2120
2136
|
const n = parseInt(value, 10);
|
|
2121
2137
|
return isNaN(n) ? null : { gridRowStart: n };
|
|
2122
2138
|
},
|
|
2123
2139
|
"row-end": ({ value, isArbitrary }) => {
|
|
2124
|
-
if (!
|
|
2140
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2125
2141
|
if (value === "auto") return { gridRowEnd: "auto" };
|
|
2126
2142
|
if (isArbitrary) return { gridRowEnd: value };
|
|
2127
2143
|
const n = parseInt(value, 10);
|
|
2128
2144
|
return isNaN(n) ? null : { gridRowEnd: n };
|
|
2129
2145
|
},
|
|
2130
2146
|
row: ({ value, isArbitrary }) => {
|
|
2131
|
-
if (!
|
|
2147
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2132
2148
|
if (!value || value === "auto") return { gridRow: "auto" };
|
|
2133
2149
|
if (isArbitrary) return { gridRow: value };
|
|
2134
2150
|
return null;
|
|
@@ -2136,7 +2152,7 @@ var RESOLVERS = {
|
|
|
2136
2152
|
// ── Grid alignment (web-only) ──────────────────────────────────────────────
|
|
2137
2153
|
// place-items is shorthand for align-items + justify-items on a grid container
|
|
2138
2154
|
"place-items": ({ value }) => {
|
|
2139
|
-
if (!
|
|
2155
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2140
2156
|
const map = {
|
|
2141
2157
|
start: "start",
|
|
2142
2158
|
end: "end",
|
|
@@ -2148,7 +2164,7 @@ var RESOLVERS = {
|
|
|
2148
2164
|
},
|
|
2149
2165
|
// place-content is shorthand for align-content + justify-content on a grid container
|
|
2150
2166
|
"place-content": ({ value }) => {
|
|
2151
|
-
if (!
|
|
2167
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2152
2168
|
const map = {
|
|
2153
2169
|
start: "start",
|
|
2154
2170
|
end: "end",
|
|
@@ -2163,7 +2179,7 @@ var RESOLVERS = {
|
|
|
2163
2179
|
},
|
|
2164
2180
|
// justify-items controls inline-axis alignment of grid items within their cells
|
|
2165
2181
|
"justify-items": ({ value }) => {
|
|
2166
|
-
if (!
|
|
2182
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2167
2183
|
const map = {
|
|
2168
2184
|
start: "start",
|
|
2169
2185
|
end: "end",
|
|
@@ -2174,7 +2190,7 @@ var RESOLVERS = {
|
|
|
2174
2190
|
},
|
|
2175
2191
|
// place-self is shorthand for align-self + justify-self on a grid item
|
|
2176
2192
|
"place-self": ({ value }) => {
|
|
2177
|
-
if (!
|
|
2193
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2178
2194
|
const map = {
|
|
2179
2195
|
auto: "auto",
|
|
2180
2196
|
start: "start",
|
|
@@ -2186,7 +2202,7 @@ var RESOLVERS = {
|
|
|
2186
2202
|
},
|
|
2187
2203
|
// justify-self controls inline-axis self-alignment of a grid item
|
|
2188
2204
|
"justify-self": ({ value }) => {
|
|
2189
|
-
if (!
|
|
2205
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2190
2206
|
const map = {
|
|
2191
2207
|
auto: "auto",
|
|
2192
2208
|
start: "start",
|
|
@@ -2198,7 +2214,7 @@ var RESOLVERS = {
|
|
|
2198
2214
|
},
|
|
2199
2215
|
// ── CSS Filters (composable via CSS variables, web-only) ─────────────────
|
|
2200
2216
|
blur: ({ value, isArbitrary }) => {
|
|
2201
|
-
if (!
|
|
2217
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2202
2218
|
const sizes = {
|
|
2203
2219
|
"": "blur(8px)",
|
|
2204
2220
|
sm: "blur(4px)",
|
|
@@ -2213,43 +2229,43 @@ var RESOLVERS = {
|
|
|
2213
2229
|
return v !== void 0 ? { "--tw-blur": v, filter: FILTER_COMPOSE } : null;
|
|
2214
2230
|
},
|
|
2215
2231
|
brightness: ({ value, isArbitrary }) => {
|
|
2216
|
-
if (!
|
|
2232
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2217
2233
|
const v = isArbitrary ? `brightness(${value})` : `brightness(${parseFloat(value) / 100})`;
|
|
2218
2234
|
return isNaN(parseFloat(value)) && !isArbitrary ? null : { "--tw-brightness": v, filter: FILTER_COMPOSE };
|
|
2219
2235
|
},
|
|
2220
2236
|
contrast: ({ value, isArbitrary }) => {
|
|
2221
|
-
if (!
|
|
2237
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2222
2238
|
const v = isArbitrary ? `contrast(${value})` : `contrast(${parseFloat(value) / 100})`;
|
|
2223
2239
|
return isNaN(parseFloat(value)) && !isArbitrary ? null : { "--tw-contrast": v, filter: FILTER_COMPOSE };
|
|
2224
2240
|
},
|
|
2225
2241
|
grayscale: ({ value }) => {
|
|
2226
|
-
if (!
|
|
2242
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2227
2243
|
const v = value === "0" ? "grayscale(0)" : "grayscale(100%)";
|
|
2228
2244
|
return { "--tw-grayscale": v, filter: FILTER_COMPOSE };
|
|
2229
2245
|
},
|
|
2230
2246
|
"hue-rotate": ({ value, negative, isArbitrary }) => {
|
|
2231
|
-
if (!
|
|
2247
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2232
2248
|
const deg = isArbitrary ? value : `${(negative ? -1 : 1) * parseFloat(value)}deg`;
|
|
2233
2249
|
if (isNaN(parseFloat(deg)) && !isArbitrary) return null;
|
|
2234
2250
|
return { "--tw-hue-rotate": `hue-rotate(${deg})`, filter: FILTER_COMPOSE };
|
|
2235
2251
|
},
|
|
2236
2252
|
invert: ({ value }) => {
|
|
2237
|
-
if (!
|
|
2253
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2238
2254
|
const v = value === "0" ? "invert(0)" : "invert(100%)";
|
|
2239
2255
|
return { "--tw-invert": v, filter: FILTER_COMPOSE };
|
|
2240
2256
|
},
|
|
2241
2257
|
saturate: ({ value, isArbitrary }) => {
|
|
2242
|
-
if (!
|
|
2258
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2243
2259
|
const v = isArbitrary ? `saturate(${value})` : `saturate(${parseFloat(value) / 100})`;
|
|
2244
2260
|
return isNaN(parseFloat(value)) && !isArbitrary ? null : { "--tw-saturate": v, filter: FILTER_COMPOSE };
|
|
2245
2261
|
},
|
|
2246
2262
|
sepia: ({ value }) => {
|
|
2247
|
-
if (!
|
|
2263
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2248
2264
|
const v = value === "0" ? "sepia(0)" : "sepia(100%)";
|
|
2249
2265
|
return { "--tw-sepia": v, filter: FILTER_COMPOSE };
|
|
2250
2266
|
},
|
|
2251
2267
|
"drop-shadow": ({ value, isArbitrary }) => {
|
|
2252
|
-
if (!
|
|
2268
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2253
2269
|
if (isArbitrary) return { "--tw-drop-shadow": `drop-shadow(${value.replace(/_/g, " ")})`, filter: FILTER_COMPOSE };
|
|
2254
2270
|
const presets = {
|
|
2255
2271
|
"": "drop-shadow(0 1px 2px rgb(0 0 0/0.1)) drop-shadow(0 1px 1px rgb(0 0 0/0.06))",
|
|
@@ -2265,14 +2281,14 @@ var RESOLVERS = {
|
|
|
2265
2281
|
},
|
|
2266
2282
|
// Arbitrary full filter string: filter-[blur(4px)_grayscale(1)]
|
|
2267
2283
|
filter: ({ value, isArbitrary }) => {
|
|
2268
|
-
if (!
|
|
2284
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2269
2285
|
if (isArbitrary) return { filter: value.replace(/_/g, " ") };
|
|
2270
2286
|
if (value === "none") return { filter: "none" };
|
|
2271
2287
|
return null;
|
|
2272
2288
|
},
|
|
2273
2289
|
// ── Backdrop Filters (composable via CSS variables, web-only) ────────────
|
|
2274
2290
|
"backdrop-blur": ({ value, isArbitrary }) => {
|
|
2275
|
-
if (!
|
|
2291
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2276
2292
|
const sizes = {
|
|
2277
2293
|
"": "blur(8px)",
|
|
2278
2294
|
sm: "blur(4px)",
|
|
@@ -2287,52 +2303,52 @@ var RESOLVERS = {
|
|
|
2287
2303
|
return v !== void 0 ? { "--tw-backdrop-blur": v, backdropFilter: BACKDROP_FILTER_COMPOSE } : null;
|
|
2288
2304
|
},
|
|
2289
2305
|
"backdrop-brightness": ({ value, isArbitrary }) => {
|
|
2290
|
-
if (!
|
|
2306
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2291
2307
|
const v = isArbitrary ? `brightness(${value})` : `brightness(${parseFloat(value) / 100})`;
|
|
2292
2308
|
return isNaN(parseFloat(value)) && !isArbitrary ? null : { "--tw-backdrop-brightness": v, backdropFilter: BACKDROP_FILTER_COMPOSE };
|
|
2293
2309
|
},
|
|
2294
2310
|
"backdrop-contrast": ({ value, isArbitrary }) => {
|
|
2295
|
-
if (!
|
|
2311
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2296
2312
|
const v = isArbitrary ? `contrast(${value})` : `contrast(${parseFloat(value) / 100})`;
|
|
2297
2313
|
return isNaN(parseFloat(value)) && !isArbitrary ? null : { "--tw-backdrop-contrast": v, backdropFilter: BACKDROP_FILTER_COMPOSE };
|
|
2298
2314
|
},
|
|
2299
2315
|
"backdrop-grayscale": ({ value }) => {
|
|
2300
|
-
if (!
|
|
2316
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2301
2317
|
return { "--tw-backdrop-grayscale": value === "0" ? "grayscale(0)" : "grayscale(100%)", backdropFilter: BACKDROP_FILTER_COMPOSE };
|
|
2302
2318
|
},
|
|
2303
2319
|
"backdrop-hue-rotate": ({ value, negative, isArbitrary }) => {
|
|
2304
|
-
if (!
|
|
2320
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2305
2321
|
const deg = isArbitrary ? value : `${(negative ? -1 : 1) * parseFloat(value)}deg`;
|
|
2306
2322
|
if (isNaN(parseFloat(deg)) && !isArbitrary) return null;
|
|
2307
2323
|
return { "--tw-backdrop-hue-rotate": `hue-rotate(${deg})`, backdropFilter: BACKDROP_FILTER_COMPOSE };
|
|
2308
2324
|
},
|
|
2309
2325
|
"backdrop-invert": ({ value }) => {
|
|
2310
|
-
if (!
|
|
2326
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2311
2327
|
return { "--tw-backdrop-invert": value === "0" ? "invert(0)" : "invert(100%)", backdropFilter: BACKDROP_FILTER_COMPOSE };
|
|
2312
2328
|
},
|
|
2313
2329
|
"backdrop-opacity": ({ value, isArbitrary }) => {
|
|
2314
|
-
if (!
|
|
2330
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2315
2331
|
const v = isArbitrary ? `opacity(${value})` : `opacity(${parseFloat(value) / 100})`;
|
|
2316
2332
|
return isNaN(parseFloat(value)) && !isArbitrary ? null : { "--tw-backdrop-opacity": v, backdropFilter: BACKDROP_FILTER_COMPOSE };
|
|
2317
2333
|
},
|
|
2318
2334
|
"backdrop-saturate": ({ value, isArbitrary }) => {
|
|
2319
|
-
if (!
|
|
2335
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2320
2336
|
const v = isArbitrary ? `saturate(${value})` : `saturate(${parseFloat(value) / 100})`;
|
|
2321
2337
|
return isNaN(parseFloat(value)) && !isArbitrary ? null : { "--tw-backdrop-saturate": v, backdropFilter: BACKDROP_FILTER_COMPOSE };
|
|
2322
2338
|
},
|
|
2323
2339
|
"backdrop-sepia": ({ value }) => {
|
|
2324
|
-
if (!
|
|
2340
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2325
2341
|
return { "--tw-backdrop-sepia": value === "0" ? "sepia(0)" : "sepia(100%)", backdropFilter: BACKDROP_FILTER_COMPOSE };
|
|
2326
2342
|
},
|
|
2327
2343
|
"backdrop-filter": ({ value, isArbitrary }) => {
|
|
2328
|
-
if (!
|
|
2344
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2329
2345
|
if (isArbitrary) return { backdropFilter: value.replace(/_/g, " ") };
|
|
2330
2346
|
if (value === "none") return { backdropFilter: "none" };
|
|
2331
2347
|
return null;
|
|
2332
2348
|
},
|
|
2333
2349
|
// ── Background gradient (CSS variable gradient stops, web-only) ──────────
|
|
2334
2350
|
"bg-gradient-to": ({ value }) => {
|
|
2335
|
-
if (!
|
|
2351
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2336
2352
|
const directions = {
|
|
2337
2353
|
t: "to top",
|
|
2338
2354
|
tr: "to top right",
|
|
@@ -2350,7 +2366,7 @@ var RESOLVERS = {
|
|
|
2350
2366
|
};
|
|
2351
2367
|
},
|
|
2352
2368
|
from: ({ value, isArbitrary }, { colors }) => {
|
|
2353
|
-
if (!
|
|
2369
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2354
2370
|
const color = resolveColor(value, colors, isArbitrary);
|
|
2355
2371
|
if (!color) return null;
|
|
2356
2372
|
return {
|
|
@@ -2359,7 +2375,7 @@ var RESOLVERS = {
|
|
|
2359
2375
|
};
|
|
2360
2376
|
},
|
|
2361
2377
|
via: ({ value, isArbitrary }, { colors }) => {
|
|
2362
|
-
if (!
|
|
2378
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2363
2379
|
const color = resolveColor(value, colors, isArbitrary);
|
|
2364
2380
|
if (!color) return null;
|
|
2365
2381
|
return {
|
|
@@ -2368,7 +2384,7 @@ var RESOLVERS = {
|
|
|
2368
2384
|
};
|
|
2369
2385
|
},
|
|
2370
2386
|
to: ({ value, isArbitrary }, { colors }) => {
|
|
2371
|
-
if (!
|
|
2387
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2372
2388
|
const color = resolveColor(value, colors, isArbitrary);
|
|
2373
2389
|
if (!color) return null;
|
|
2374
2390
|
return { "--tw-gradient-to": color };
|
|
@@ -2377,23 +2393,23 @@ var RESOLVERS = {
|
|
|
2377
2393
|
"skew-x": ({ value, negative, isArbitrary }) => {
|
|
2378
2394
|
const deg = isArbitrary ? value : `${(negative ? -1 : 1) * parseFloat(value)}deg`;
|
|
2379
2395
|
if (!isArbitrary && isNaN(parseFloat(value))) return null;
|
|
2380
|
-
return
|
|
2396
|
+
return getEffectiveIsWeb() ? { transform: `skewX(${deg})` } : { transform: [{ skewX: deg }] };
|
|
2381
2397
|
},
|
|
2382
2398
|
"skew-y": ({ value, negative, isArbitrary }) => {
|
|
2383
2399
|
const deg = isArbitrary ? value : `${(negative ? -1 : 1) * parseFloat(value)}deg`;
|
|
2384
2400
|
if (!isArbitrary && isNaN(parseFloat(value))) return null;
|
|
2385
|
-
return
|
|
2401
|
+
return getEffectiveIsWeb() ? { transform: `skewY(${deg})` } : { transform: [{ skewY: deg }] };
|
|
2386
2402
|
},
|
|
2387
2403
|
// Arbitrary full transform string: transform-[rotate(45deg)_scale(1.5)]
|
|
2388
2404
|
transform: ({ value, isArbitrary }) => {
|
|
2389
|
-
if (!
|
|
2405
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2390
2406
|
if (isArbitrary) return { transform: value.replace(/_/g, " ") };
|
|
2391
2407
|
if (value === "none") return { transform: "none" };
|
|
2392
2408
|
return null;
|
|
2393
2409
|
},
|
|
2394
2410
|
// Transform origin
|
|
2395
2411
|
origin: ({ value, isArbitrary }) => {
|
|
2396
|
-
if (!
|
|
2412
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2397
2413
|
if (isArbitrary) return { transformOrigin: value.replace(/_/g, " ") };
|
|
2398
2414
|
const origins = {
|
|
2399
2415
|
center: "center",
|
|
@@ -2410,7 +2426,7 @@ var RESOLVERS = {
|
|
|
2410
2426
|
},
|
|
2411
2427
|
// ── Text decoration advanced (web-only) ───────────────────────────────────
|
|
2412
2428
|
decoration: ({ value, isArbitrary }, { colors }) => {
|
|
2413
|
-
if (!
|
|
2429
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2414
2430
|
if (isArbitrary) {
|
|
2415
2431
|
if (/^\d/.test(value) || value.startsWith("calc(")) return { textDecorationThickness: value };
|
|
2416
2432
|
return { textDecorationColor: value };
|
|
@@ -2437,7 +2453,7 @@ var RESOLVERS = {
|
|
|
2437
2453
|
return color ? { textDecorationColor: color } : null;
|
|
2438
2454
|
},
|
|
2439
2455
|
"underline-offset": ({ value, isArbitrary }) => {
|
|
2440
|
-
if (!
|
|
2456
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2441
2457
|
if (isArbitrary) return { textUnderlineOffset: value };
|
|
2442
2458
|
const offsets = {
|
|
2443
2459
|
auto: "auto",
|
|
@@ -2451,7 +2467,7 @@ var RESOLVERS = {
|
|
|
2451
2467
|
},
|
|
2452
2468
|
// ── Outline extended (web-only) ───────────────────────────────────────────
|
|
2453
2469
|
outline: ({ value, isArbitrary }, { colors }) => {
|
|
2454
|
-
if (!
|
|
2470
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2455
2471
|
if (!value) return { outline: "2px solid transparent", outlineOffset: "2px" };
|
|
2456
2472
|
if (value === "none") return { outline: "none", outlineOffset: "0" };
|
|
2457
2473
|
if (isArbitrary) {
|
|
@@ -2464,14 +2480,14 @@ var RESOLVERS = {
|
|
|
2464
2480
|
return color ? { outlineColor: color } : null;
|
|
2465
2481
|
},
|
|
2466
2482
|
"outline-offset": ({ value, isArbitrary }) => {
|
|
2467
|
-
if (!
|
|
2483
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2468
2484
|
if (isArbitrary) return { outlineOffset: value };
|
|
2469
2485
|
const offsets = { "0": "0px", "1": "1px", "2": "2px", "4": "4px", "8": "8px" };
|
|
2470
2486
|
return offsets[value] ? { outlineOffset: offsets[value] } : null;
|
|
2471
2487
|
},
|
|
2472
2488
|
// ── Columns (web-only) ─────────────────────────────────────────────────────
|
|
2473
2489
|
columns: ({ value, isArbitrary }) => {
|
|
2474
|
-
if (!
|
|
2490
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2475
2491
|
if (isArbitrary) return { columnCount: value };
|
|
2476
2492
|
if (value === "auto") return { columnCount: "auto" };
|
|
2477
2493
|
const n = parseInt(value, 10);
|
|
@@ -2495,7 +2511,7 @@ var RESOLVERS = {
|
|
|
2495
2511
|
},
|
|
2496
2512
|
// ── Mix / background blend mode (web-only) ───────────────────────────────
|
|
2497
2513
|
"mix-blend": ({ value }) => {
|
|
2498
|
-
if (!
|
|
2514
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2499
2515
|
const modes = [
|
|
2500
2516
|
"normal",
|
|
2501
2517
|
"multiply",
|
|
@@ -2518,7 +2534,7 @@ var RESOLVERS = {
|
|
|
2518
2534
|
return modes.includes(value) ? { mixBlendMode: value } : null;
|
|
2519
2535
|
},
|
|
2520
2536
|
"bg-blend": ({ value }) => {
|
|
2521
|
-
if (!
|
|
2537
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2522
2538
|
const modes = [
|
|
2523
2539
|
"normal",
|
|
2524
2540
|
"multiply",
|
|
@@ -2541,7 +2557,7 @@ var RESOLVERS = {
|
|
|
2541
2557
|
},
|
|
2542
2558
|
// ── Will-change (web-only) ─────────────────────────────────────────────────
|
|
2543
2559
|
"will-change": ({ value, isArbitrary }) => {
|
|
2544
|
-
if (!
|
|
2560
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2545
2561
|
if (isArbitrary) return { willChange: value.replace(/_/g, ", ") };
|
|
2546
2562
|
const presets = {
|
|
2547
2563
|
auto: "auto",
|
|
@@ -2555,21 +2571,21 @@ var RESOLVERS = {
|
|
|
2555
2571
|
// These return special __divide* markers that resolver.ts converts to
|
|
2556
2572
|
// .cls > * + * { border-... } CSS rules. No inline style is applied.
|
|
2557
2573
|
"divide-x": ({ value, isArbitrary }) => {
|
|
2558
|
-
if (!
|
|
2574
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2559
2575
|
if (value === "reverse") return null;
|
|
2560
2576
|
if (!value) return { __divideX: 1 };
|
|
2561
2577
|
const n = parseFloat(value);
|
|
2562
2578
|
return isNaN(n) ? null : { __divideX: n };
|
|
2563
2579
|
},
|
|
2564
2580
|
"divide-y": ({ value, isArbitrary }) => {
|
|
2565
|
-
if (!
|
|
2581
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2566
2582
|
if (value === "reverse") return null;
|
|
2567
2583
|
if (!value) return { __divideY: 1 };
|
|
2568
2584
|
const n = parseFloat(value);
|
|
2569
2585
|
return isNaN(n) ? null : { __divideY: n };
|
|
2570
2586
|
},
|
|
2571
2587
|
divide: ({ value, isArbitrary }, { colors }) => {
|
|
2572
|
-
if (!
|
|
2588
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2573
2589
|
if (isArbitrary) return { __divideColor: value };
|
|
2574
2590
|
const styleTokens = {
|
|
2575
2591
|
solid: "solid",
|
|
@@ -2586,7 +2602,7 @@ var RESOLVERS = {
|
|
|
2586
2602
|
// Named presets give cross-platform shadow; arbitrary is web-only.
|
|
2587
2603
|
"text-shadow": ({ value, isArbitrary }, { colors }) => {
|
|
2588
2604
|
if (value === "none") {
|
|
2589
|
-
return
|
|
2605
|
+
return getEffectiveIsWeb() ? { textShadow: "none" } : { textShadowColor: "transparent", textShadowOffset: { width: 0, height: 0 }, textShadowRadius: 0 };
|
|
2590
2606
|
}
|
|
2591
2607
|
const webPresets = {
|
|
2592
2608
|
"": "0 2px 4px rgba(0,0,0,0.3)",
|
|
@@ -2603,15 +2619,15 @@ var RESOLVERS = {
|
|
|
2603
2619
|
xl: { textShadowColor: "rgba(0,0,0,0.5)", textShadowOffset: { width: 0, height: 16 }, textShadowRadius: 32 }
|
|
2604
2620
|
};
|
|
2605
2621
|
if (value in webPresets) {
|
|
2606
|
-
if (
|
|
2622
|
+
if (getEffectiveIsWeb()) return { textShadow: webPresets[value] };
|
|
2607
2623
|
return nativePresets[value] ?? null;
|
|
2608
2624
|
}
|
|
2609
2625
|
if (isArbitrary) {
|
|
2610
|
-
return
|
|
2626
|
+
return getEffectiveIsWeb() ? { textShadow: value.replace(/_/g, " ") } : null;
|
|
2611
2627
|
}
|
|
2612
2628
|
const color = resolveColor(value, colors, false);
|
|
2613
2629
|
if (color) {
|
|
2614
|
-
return
|
|
2630
|
+
return getEffectiveIsWeb() ? { textShadow: `0 2px 4px ${color}` } : { textShadowColor: color };
|
|
2615
2631
|
}
|
|
2616
2632
|
return null;
|
|
2617
2633
|
},
|
|
@@ -2619,13 +2635,13 @@ var RESOLVERS = {
|
|
|
2619
2635
|
perspective: ({ value, isArbitrary }) => {
|
|
2620
2636
|
if (isArbitrary) {
|
|
2621
2637
|
const numPx = parseFloat(value);
|
|
2622
|
-
if (
|
|
2638
|
+
if (getEffectiveIsWeb()) return { transform: `perspective(${value})` };
|
|
2623
2639
|
return isNaN(numPx) ? null : { transform: [{ perspective: numPx }] };
|
|
2624
2640
|
}
|
|
2625
|
-
if (value === "none") return
|
|
2641
|
+
if (value === "none") return getEffectiveIsWeb() ? { transform: "none" } : null;
|
|
2626
2642
|
const n = parseFloat(value);
|
|
2627
2643
|
if (isNaN(n)) return null;
|
|
2628
|
-
return
|
|
2644
|
+
return getEffectiveIsWeb() ? { transform: `perspective(${n}px)` } : { transform: [{ perspective: n }] };
|
|
2629
2645
|
},
|
|
2630
2646
|
// ── Tint color (native-only, for Image and icon components) ──────────────
|
|
2631
2647
|
tint: ({ value, isArbitrary }, { colors }) => {
|
|
@@ -2643,7 +2659,7 @@ var RESOLVERS = {
|
|
|
2643
2659
|
// resolver.ts detects __keyframe, injects the rule, then strips the marker
|
|
2644
2660
|
// so it never reaches element inline styles.
|
|
2645
2661
|
animate: ({ value, isArbitrary }) => {
|
|
2646
|
-
if (!
|
|
2662
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2647
2663
|
if (isArbitrary) return { animation: value.replace(/_/g, " ") };
|
|
2648
2664
|
const defs = {
|
|
2649
2665
|
none: { animation: "none" },
|
|
@@ -2669,7 +2685,7 @@ var RESOLVERS = {
|
|
|
2669
2685
|
},
|
|
2670
2686
|
// ── Line-clamp (web-only) ─────────────────────────────────────────────────
|
|
2671
2687
|
"line-clamp": ({ value }) => {
|
|
2672
|
-
if (!
|
|
2688
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2673
2689
|
if (value === "none") return { overflow: "visible", display: "block", WebkitLineClamp: "unset" };
|
|
2674
2690
|
const n = parseInt(value, 10);
|
|
2675
2691
|
if (isNaN(n) || n < 1) return null;
|
|
@@ -2682,14 +2698,14 @@ var RESOLVERS = {
|
|
|
2682
2698
|
},
|
|
2683
2699
|
// ── Caret color (web-only) ────────────────────────────────────────────────
|
|
2684
2700
|
caret: ({ value, isArbitrary }, { colors }) => {
|
|
2685
|
-
if (!
|
|
2701
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2686
2702
|
if (value === "auto" || value === "transparent") return { caretColor: value };
|
|
2687
2703
|
const color = resolveColor(value, colors, isArbitrary);
|
|
2688
2704
|
return color ? { caretColor: color } : null;
|
|
2689
2705
|
},
|
|
2690
2706
|
// ── Accent color (web-only) ───────────────────────────────────────────────
|
|
2691
2707
|
accent: ({ value, isArbitrary }, { colors }) => {
|
|
2692
|
-
if (!
|
|
2708
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2693
2709
|
if (value === "auto") return { accentColor: "auto" };
|
|
2694
2710
|
const color = resolveColor(value, colors, isArbitrary);
|
|
2695
2711
|
return color ? { accentColor: color } : null;
|
|
@@ -2773,7 +2789,7 @@ var RESOLVERS = {
|
|
|
2773
2789
|
}
|
|
2774
2790
|
const v = zIndex[value];
|
|
2775
2791
|
if (v !== void 0) {
|
|
2776
|
-
if (v === "auto") return
|
|
2792
|
+
if (v === "auto") return getEffectiveIsWeb() ? { zIndex: "auto" } : null;
|
|
2777
2793
|
return { zIndex: v };
|
|
2778
2794
|
}
|
|
2779
2795
|
const n = parseInt(value);
|
|
@@ -2802,13 +2818,13 @@ var RESOLVERS = {
|
|
|
2802
2818
|
},
|
|
2803
2819
|
// ── Line height ────────────────────────────────────────────────────────────
|
|
2804
2820
|
leading: ({ value, isArbitrary }, { lineHeight }) => {
|
|
2805
|
-
if (isArbitrary) return { lineHeight:
|
|
2821
|
+
if (isArbitrary) return { lineHeight: getEffectiveIsWeb() ? value : toNativeValue(value) };
|
|
2806
2822
|
const v = lineHeight[value];
|
|
2807
2823
|
return v !== void 0 ? { lineHeight: v } : null;
|
|
2808
2824
|
},
|
|
2809
2825
|
// ── Letter spacing ─────────────────────────────────────────────────────────
|
|
2810
2826
|
tracking: ({ value, isArbitrary }, { letterSpacing }) => {
|
|
2811
|
-
if (isArbitrary) return { letterSpacing:
|
|
2827
|
+
if (isArbitrary) return { letterSpacing: getEffectiveIsWeb() ? value : toNativeValue(value) };
|
|
2812
2828
|
const v = letterSpacing[value];
|
|
2813
2829
|
return v !== void 0 ? { letterSpacing: v } : null;
|
|
2814
2830
|
},
|
|
@@ -2823,34 +2839,34 @@ var RESOLVERS = {
|
|
|
2823
2839
|
scale: ({ value, isArbitrary }) => {
|
|
2824
2840
|
const n = isArbitrary ? parseFloat(value) : parseFloat(value) / 100;
|
|
2825
2841
|
if (isNaN(n)) return null;
|
|
2826
|
-
return
|
|
2842
|
+
return getEffectiveIsWeb() ? { transform: `scale(${n})` } : { transform: [{ scale: n }] };
|
|
2827
2843
|
},
|
|
2828
2844
|
"scale-x": ({ value, isArbitrary }) => {
|
|
2829
2845
|
const n = isArbitrary ? parseFloat(value) : parseFloat(value) / 100;
|
|
2830
2846
|
if (isNaN(n)) return null;
|
|
2831
|
-
return
|
|
2847
|
+
return getEffectiveIsWeb() ? { transform: `scaleX(${n})` } : { transform: [{ scaleX: n }] };
|
|
2832
2848
|
},
|
|
2833
2849
|
"scale-y": ({ value, isArbitrary }) => {
|
|
2834
2850
|
const n = isArbitrary ? parseFloat(value) : parseFloat(value) / 100;
|
|
2835
2851
|
if (isNaN(n)) return null;
|
|
2836
|
-
return
|
|
2852
|
+
return getEffectiveIsWeb() ? { transform: `scaleY(${n})` } : { transform: [{ scaleY: n }] };
|
|
2837
2853
|
},
|
|
2838
2854
|
// ── Rotate ─────────────────────────────────────────────────────────────────
|
|
2839
2855
|
rotate: ({ value, negative, isArbitrary }) => {
|
|
2840
2856
|
if (isArbitrary) {
|
|
2841
2857
|
const finalValue = negative ? `-${value}` : value;
|
|
2842
|
-
return
|
|
2858
|
+
return getEffectiveIsWeb() ? { transform: `rotate(${finalValue})` } : { transform: [{ rotate: finalValue }] };
|
|
2843
2859
|
}
|
|
2844
2860
|
const deg = parseFloat(value);
|
|
2845
2861
|
if (isNaN(deg)) return null;
|
|
2846
2862
|
const finalDeg = negative ? -deg : deg;
|
|
2847
|
-
return
|
|
2863
|
+
return getEffectiveIsWeb() ? { transform: `rotate(${finalDeg}deg)` } : { transform: [{ rotate: `${finalDeg}deg` }] };
|
|
2848
2864
|
},
|
|
2849
2865
|
// ── Translate ──────────────────────────────────────────────────────────────
|
|
2850
2866
|
"translate-x": ({ value, negative, isArbitrary }, { spacing }) => {
|
|
2851
2867
|
const v = resolveSpacing(value, negative, spacing, isArbitrary);
|
|
2852
2868
|
if (v === null) return null;
|
|
2853
|
-
if (
|
|
2869
|
+
if (getEffectiveIsWeb()) return { transform: `translateX(${v})` };
|
|
2854
2870
|
if (typeof v === "string") {
|
|
2855
2871
|
const n = parseFloat(v);
|
|
2856
2872
|
return isNaN(n) ? null : { transform: [{ translateX: n }] };
|
|
@@ -2860,7 +2876,7 @@ var RESOLVERS = {
|
|
|
2860
2876
|
"translate-y": ({ value, negative, isArbitrary }, { spacing }) => {
|
|
2861
2877
|
const v = resolveSpacing(value, negative, spacing, isArbitrary);
|
|
2862
2878
|
if (v === null) return null;
|
|
2863
|
-
if (
|
|
2879
|
+
if (getEffectiveIsWeb()) return { transform: `translateY(${v})` };
|
|
2864
2880
|
if (typeof v === "string") {
|
|
2865
2881
|
const n = parseFloat(v);
|
|
2866
2882
|
return isNaN(n) ? null : { transform: [{ translateY: n }] };
|
|
@@ -2873,12 +2889,12 @@ var RESOLVERS = {
|
|
|
2873
2889
|
const presets = { auto: "auto", square: 1, video: 16 / 9 };
|
|
2874
2890
|
if (!(value in presets)) return null;
|
|
2875
2891
|
const v = presets[value];
|
|
2876
|
-
if (v === "auto") return
|
|
2892
|
+
if (v === "auto") return getEffectiveIsWeb() ? { aspectRatio: "auto" } : null;
|
|
2877
2893
|
return { aspectRatio: v };
|
|
2878
2894
|
},
|
|
2879
2895
|
// ── Transition (web-only; use Animated API on native) ─────────────────────
|
|
2880
2896
|
transition: ({ value }) => {
|
|
2881
|
-
if (!
|
|
2897
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2882
2898
|
const presets = {
|
|
2883
2899
|
"": "color 150ms, background-color 150ms, border-color 150ms, opacity 150ms, box-shadow 150ms",
|
|
2884
2900
|
all: "all 150ms",
|
|
@@ -2892,18 +2908,18 @@ var RESOLVERS = {
|
|
|
2892
2908
|
return v !== void 0 ? { transition: v } : null;
|
|
2893
2909
|
},
|
|
2894
2910
|
duration: ({ value, isArbitrary }) => {
|
|
2895
|
-
if (!
|
|
2911
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2896
2912
|
const ms = isArbitrary ? value : `${value}ms`;
|
|
2897
2913
|
return { transitionDuration: ms };
|
|
2898
2914
|
},
|
|
2899
2915
|
delay: ({ value, isArbitrary }) => {
|
|
2900
|
-
if (!
|
|
2916
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2901
2917
|
const ms = isArbitrary ? value : `${value}ms`;
|
|
2902
2918
|
return { transitionDelay: ms };
|
|
2903
2919
|
},
|
|
2904
2920
|
// ── Ring (web-only: box-shadow outline ring) ──────────────────────────────
|
|
2905
2921
|
ring: ({ value, isArbitrary }, { colors }) => {
|
|
2906
|
-
if (!
|
|
2922
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2907
2923
|
const DEFAULT_COLOR = "rgba(59, 130, 246, 0.5)";
|
|
2908
2924
|
const DEFAULT_WIDTH = 3;
|
|
2909
2925
|
if (!value) {
|
|
@@ -2930,7 +2946,7 @@ var RESOLVERS = {
|
|
|
2930
2946
|
return null;
|
|
2931
2947
|
},
|
|
2932
2948
|
"ring-offset": ({ value, isArbitrary }, _theme) => {
|
|
2933
|
-
if (!
|
|
2949
|
+
if (!getEffectiveIsWeb()) return null;
|
|
2934
2950
|
const DEFAULT_RING_COLOR = "rgba(59, 130, 246, 0.5)";
|
|
2935
2951
|
const DEFAULT_RING_WIDTH = 3;
|
|
2936
2952
|
const offsetTokens = { "0": 0, "1": 1, "2": 2, "4": 4, "8": 8 };
|
|
@@ -2959,7 +2975,7 @@ function resolveUtility(parsed, theme) {
|
|
|
2959
2975
|
if (parsed.utility === "inline-grid") {
|
|
2960
2976
|
return { display: "inline-grid" };
|
|
2961
2977
|
}
|
|
2962
|
-
if (parsed.utility in
|
|
2978
|
+
if (parsed.utility in getStandalone()) return getStandalone()[parsed.utility] ?? null;
|
|
2963
2979
|
}
|
|
2964
2980
|
const resolver = PLUGIN_RESOLVERS[parsed.utility] ?? RESOLVERS[parsed.utility];
|
|
2965
2981
|
if (resolver) return resolver(parsed, theme);
|
|
@@ -2975,7 +2991,7 @@ function getPluginStandaloneMap() {
|
|
|
2975
2991
|
return PLUGIN_STANDALONE;
|
|
2976
2992
|
}
|
|
2977
2993
|
function isKnownUtility(utility) {
|
|
2978
|
-
return utility in
|
|
2994
|
+
return utility in getStandalone() || utility in RESOLVERS || utility in PLUGIN_STANDALONE || utility in PLUGIN_RESOLVERS;
|
|
2979
2995
|
}
|
|
2980
2996
|
|
|
2981
2997
|
// src/core/responsiveStore.ts
|