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