@tamagui/static 1.0.0-alpha.5 → 1.0.0-alpha.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/extractor/createExtractor.js +40 -26
- package/dist/extractor/createExtractor.js.map +2 -2
- package/dist/extractor/extractToClassNames.js +8 -16
- package/dist/extractor/extractToClassNames.js.map +2 -2
- package/dist/index.cjs +68 -46
- package/dist/index.cjs.map +2 -2
- package/dist/patchReactNativeWeb.js +18 -3
- package/dist/patchReactNativeWeb.js.map +2 -2
- package/package.json +4 -4
- package/src/extractor/createExtractor.ts +50 -34
- package/src/extractor/extractToClassNames.ts +4 -15
- package/src/patchReactNativeWeb.ts +21 -5
- package/src/types.ts +5 -2
- package/types.d.ts +7 -2
package/dist/index.cjs
CHANGED
|
@@ -717,6 +717,7 @@ function createExtractor() {
|
|
|
717
717
|
format: "cjs"
|
|
718
718
|
});
|
|
719
719
|
let loadedTamaguiConfig;
|
|
720
|
+
let hasLogged = false;
|
|
720
721
|
return {
|
|
721
722
|
getTamaguiConfig() {
|
|
722
723
|
return loadedTamaguiConfig;
|
|
@@ -730,7 +731,8 @@ function createExtractor() {
|
|
|
730
731
|
sourcePath = "",
|
|
731
732
|
onExtractTag,
|
|
732
733
|
getFlattenedNode,
|
|
733
|
-
|
|
734
|
+
disableExtraction,
|
|
735
|
+
disableDebugAttr
|
|
734
736
|
} = _b, props = __objRest(_b, [
|
|
735
737
|
"config",
|
|
736
738
|
"importsWhitelist",
|
|
@@ -739,7 +741,8 @@ function createExtractor() {
|
|
|
739
741
|
"sourcePath",
|
|
740
742
|
"onExtractTag",
|
|
741
743
|
"getFlattenedNode",
|
|
742
|
-
"
|
|
744
|
+
"disableExtraction",
|
|
745
|
+
"disableDebugAttr"
|
|
743
746
|
]);
|
|
744
747
|
if (sourcePath === "") {
|
|
745
748
|
throw new Error(`Must provide a source file name`);
|
|
@@ -753,7 +756,6 @@ function createExtractor() {
|
|
|
753
756
|
});
|
|
754
757
|
loadedTamaguiConfig = tamaguiConfig;
|
|
755
758
|
const defaultTheme = tamaguiConfig.themes[Object.keys(tamaguiConfig.themes)[0]];
|
|
756
|
-
let doesUseValidImport = false;
|
|
757
759
|
const body = fileOrPath.type === "Program" ? fileOrPath.get("body") : fileOrPath.program.body;
|
|
758
760
|
const isInternalImport = /* @__PURE__ */ __name((importStr) => isInsideTamagui(sourcePath) && importStr[0] === ".", "isInternalImport");
|
|
759
761
|
const validComponents = Object.keys(components).filter((key) => {
|
|
@@ -763,6 +765,7 @@ function createExtractor() {
|
|
|
763
765
|
obj[name] = components[name];
|
|
764
766
|
return obj;
|
|
765
767
|
}, {});
|
|
768
|
+
let doesUseValidImport = false;
|
|
766
769
|
for (const bodyPath of body) {
|
|
767
770
|
if (bodyPath.type !== "ImportDeclaration")
|
|
768
771
|
continue;
|
|
@@ -791,6 +794,11 @@ function createExtractor() {
|
|
|
791
794
|
return fileOrPath.type === "File" ? (0, import_traverse.default)(fileOrPath, a) : fileOrPath.traverse(a);
|
|
792
795
|
}, "callTraverse");
|
|
793
796
|
let programPath;
|
|
797
|
+
const res = {
|
|
798
|
+
flattened: 0,
|
|
799
|
+
optimized: 0,
|
|
800
|
+
modified: 0
|
|
801
|
+
};
|
|
794
802
|
callTraverse({
|
|
795
803
|
Program: {
|
|
796
804
|
enter(path3) {
|
|
@@ -823,8 +831,26 @@ function createExtractor() {
|
|
|
823
831
|
if (!component || !component.staticConfig) {
|
|
824
832
|
return;
|
|
825
833
|
}
|
|
826
|
-
const { staticConfig } = component;
|
|
827
834
|
const originalNodeName = node.name.name;
|
|
835
|
+
if (shouldPrintDebug) {
|
|
836
|
+
console.log(`
|
|
837
|
+
<${originalNodeName} />`);
|
|
838
|
+
}
|
|
839
|
+
const filePath = sourcePath.replace(process.cwd(), ".");
|
|
840
|
+
const lineNumbers = node.loc ? node.loc.start.line + (node.loc.start.line !== node.loc.end.line ? `-${node.loc.end.line}` : "") : "";
|
|
841
|
+
if (shouldAddDebugProp && !disableDebugAttr) {
|
|
842
|
+
const preName = componentName ? `${componentName}:` : "";
|
|
843
|
+
res.modified++;
|
|
844
|
+
node.attributes.unshift(t9.jsxAttribute(t9.jsxIdentifier("data-is"), t9.stringLiteral(` ${preName}${node.name.name} ${filePath.replace("./", "")}:${lineNumbers} `)));
|
|
845
|
+
}
|
|
846
|
+
if (disableExtraction) {
|
|
847
|
+
if (!hasLogged) {
|
|
848
|
+
console.log("\u{1F95A} Tamagui disableExtraction set: no CSS or optimizations will be run");
|
|
849
|
+
hasLogged = true;
|
|
850
|
+
}
|
|
851
|
+
return;
|
|
852
|
+
}
|
|
853
|
+
const { staticConfig } = component;
|
|
828
854
|
const isTextView = staticConfig.isText || false;
|
|
829
855
|
const validStyles = (staticConfig == null ? void 0 : staticConfig.validStyles) ?? {};
|
|
830
856
|
let tagName = ((_a2 = staticConfig.defaultProps) == null ? void 0 : _a2.tag) ?? (isTextView ? "span" : "div");
|
|
@@ -846,21 +872,17 @@ function createExtractor() {
|
|
|
846
872
|
]);
|
|
847
873
|
const excludeProps = new Set(props.excludeProps ?? []);
|
|
848
874
|
const isExcludedProp = /* @__PURE__ */ __name((name) => {
|
|
849
|
-
const
|
|
850
|
-
if (
|
|
875
|
+
const res2 = excludeProps.has(name);
|
|
876
|
+
if (res2 && shouldPrintDebug)
|
|
851
877
|
console.log(` excluding ${name}`);
|
|
852
|
-
return
|
|
878
|
+
return res2;
|
|
853
879
|
}, "isExcludedProp");
|
|
854
880
|
const isDeoptedProp = /* @__PURE__ */ __name((name) => {
|
|
855
|
-
const
|
|
856
|
-
if (
|
|
881
|
+
const res2 = deoptProps.has(name);
|
|
882
|
+
if (res2 && shouldPrintDebug)
|
|
857
883
|
console.log(` deopting ${name}`);
|
|
858
|
-
return
|
|
884
|
+
return res2;
|
|
859
885
|
}, "isDeoptedProp");
|
|
860
|
-
if (shouldPrintDebug) {
|
|
861
|
-
console.log(`
|
|
862
|
-
<${originalNodeName} />`);
|
|
863
|
-
}
|
|
864
886
|
const staticNamespace = getStaticBindingsForScope(traversePath.scope, importsWhitelist, sourcePath, bindingCache, shouldPrintDebug);
|
|
865
887
|
const attemptEval = !evaluateVars ? evaluateAstNode : createEvaluator({
|
|
866
888
|
tamaguiConfig,
|
|
@@ -933,11 +955,11 @@ function createExtractor() {
|
|
|
933
955
|
let isFlattened = false;
|
|
934
956
|
attrs = traversePath.get("openingElement").get("attributes").flatMap((path3) => {
|
|
935
957
|
try {
|
|
936
|
-
const
|
|
937
|
-
if (!
|
|
958
|
+
const res2 = evaluateAttribute(path3);
|
|
959
|
+
if (!res2) {
|
|
938
960
|
path3.remove();
|
|
939
961
|
}
|
|
940
|
-
return
|
|
962
|
+
return res2;
|
|
941
963
|
} catch (err) {
|
|
942
964
|
console.log("Error extracting attribute", err.message, err.stack);
|
|
943
965
|
console.log("node", path3.node);
|
|
@@ -1246,8 +1268,6 @@ function createExtractor() {
|
|
|
1246
1268
|
if (parentFn) {
|
|
1247
1269
|
modifiedComponents.add(parentFn);
|
|
1248
1270
|
}
|
|
1249
|
-
const filePath = sourcePath.replace(process.cwd(), ".");
|
|
1250
|
-
const lineNumbers = node.loc ? node.loc.start.line + (node.loc.start.line !== node.loc.end.line ? `-${node.loc.end.line}` : "") : "";
|
|
1251
1271
|
let ternaries = [];
|
|
1252
1272
|
attrs = attrs.reduce((out, cur) => {
|
|
1253
1273
|
const next = attrs[attrs.indexOf(cur) + 1];
|
|
@@ -1442,20 +1462,13 @@ function createExtractor() {
|
|
|
1442
1462
|
if (shouldPrintDebug) {
|
|
1443
1463
|
console.log(" - attrs (after): ", attrs.map(attrStr).join(", "));
|
|
1444
1464
|
}
|
|
1445
|
-
if (shouldAddDebugProp) {
|
|
1446
|
-
const preName = componentName ? `${componentName}:` : "";
|
|
1447
|
-
attrs.unshift({
|
|
1448
|
-
type: "attr",
|
|
1449
|
-
value: t9.jsxAttribute(t9.jsxIdentifier("data-is"), t9.stringLiteral(` ${preName}${node.name.name} ${filePath.replace("./", "")}:${lineNumbers} `))
|
|
1450
|
-
});
|
|
1451
|
-
}
|
|
1452
1465
|
if (shouldFlatten) {
|
|
1453
1466
|
if (shouldPrintDebug) {
|
|
1454
1467
|
console.log(" [\u2705] flattening", originalNodeName, flatNode);
|
|
1455
1468
|
}
|
|
1456
1469
|
isFlattened = true;
|
|
1457
1470
|
node.name.name = flatNode;
|
|
1458
|
-
|
|
1471
|
+
res.flattened++;
|
|
1459
1472
|
if (closingElement) {
|
|
1460
1473
|
closingElement.name.name = flatNode;
|
|
1461
1474
|
}
|
|
@@ -1464,6 +1477,7 @@ function createExtractor() {
|
|
|
1464
1477
|
console.log(" [\u274A] inline props ", inlinePropCount, shouldDeopt ? " deopted" : "", hasSpread ? " spread" : "", "!flatten", staticConfig.neverFlatten);
|
|
1465
1478
|
console.log(" - attrs (end): ", attrs.map(attrStr).join(", "));
|
|
1466
1479
|
}
|
|
1480
|
+
res.optimized++;
|
|
1467
1481
|
onExtractTag({
|
|
1468
1482
|
attrs,
|
|
1469
1483
|
node,
|
|
@@ -1486,6 +1500,7 @@ function createExtractor() {
|
|
|
1486
1500
|
removeUnusedHooks(comp, shouldPrintDebug);
|
|
1487
1501
|
}
|
|
1488
1502
|
}
|
|
1503
|
+
return res;
|
|
1489
1504
|
}
|
|
1490
1505
|
};
|
|
1491
1506
|
}
|
|
@@ -1803,16 +1818,11 @@ function extractToClassNames({
|
|
|
1803
1818
|
}
|
|
1804
1819
|
const cssMap = new Map();
|
|
1805
1820
|
const existingHoists = {};
|
|
1806
|
-
|
|
1807
|
-
let optimized = 0;
|
|
1808
|
-
extractor.parse(ast, __spreadProps(__spreadValues({
|
|
1821
|
+
const res = extractor.parse(ast, __spreadProps(__spreadValues({
|
|
1809
1822
|
sourcePath,
|
|
1810
1823
|
shouldPrintDebug
|
|
1811
1824
|
}, options), {
|
|
1812
1825
|
getFlattenedNode: ({ tag }) => tag,
|
|
1813
|
-
onDidFlatten() {
|
|
1814
|
-
flattened++;
|
|
1815
|
-
},
|
|
1816
1826
|
onExtractTag: ({
|
|
1817
1827
|
attrs,
|
|
1818
1828
|
node,
|
|
@@ -1823,7 +1833,6 @@ function extractToClassNames({
|
|
|
1823
1833
|
lineNumbers,
|
|
1824
1834
|
programPath
|
|
1825
1835
|
}) => {
|
|
1826
|
-
optimized++;
|
|
1827
1836
|
let finalClassNames = [];
|
|
1828
1837
|
let finalAttrs = [];
|
|
1829
1838
|
let finalStyles = [];
|
|
@@ -1849,11 +1858,11 @@ function extractToClassNames({
|
|
|
1849
1858
|
if (!style)
|
|
1850
1859
|
return [];
|
|
1851
1860
|
const styleWithPrev = ensureNeededPrevStyle(style);
|
|
1852
|
-
const
|
|
1853
|
-
if (
|
|
1854
|
-
finalStyles = [...finalStyles, ...
|
|
1861
|
+
const res2 = (0, import_core_node3.getStylesAtomic)(styleWithPrev);
|
|
1862
|
+
if (res2.length) {
|
|
1863
|
+
finalStyles = [...finalStyles, ...res2];
|
|
1855
1864
|
}
|
|
1856
|
-
return
|
|
1865
|
+
return res2;
|
|
1857
1866
|
}, "addStyles");
|
|
1858
1867
|
let lastMediaImportance = 1;
|
|
1859
1868
|
for (const attr of attrs) {
|
|
@@ -1956,12 +1965,10 @@ function extractToClassNames({
|
|
|
1956
1965
|
}
|
|
1957
1966
|
}
|
|
1958
1967
|
}));
|
|
1959
|
-
if (!
|
|
1968
|
+
if (!res || !res.modified) {
|
|
1960
1969
|
return null;
|
|
1961
1970
|
}
|
|
1962
|
-
const styles = Array.from(cssMap.values()).map((x) =>
|
|
1963
|
-
return x.css;
|
|
1964
|
-
}).join("\n").trim();
|
|
1971
|
+
const styles = Array.from(cssMap.values()).map((x) => x.css).join("\n").trim();
|
|
1965
1972
|
if (styles) {
|
|
1966
1973
|
const cssQuery = threaded ? `cssData=${Buffer.from(styles).toString("base64")}` : `cssPath=${cssPath}`;
|
|
1967
1974
|
const remReq = (0, import_loader_utils.getRemainingRequest)(loader);
|
|
@@ -1981,7 +1988,7 @@ function extractToClassNames({
|
|
|
1981
1988
|
}
|
|
1982
1989
|
if (shouldLogTiming && mem) {
|
|
1983
1990
|
const memUsed = Math.round((process.memoryUsage().heapUsed - mem.heapUsed) / 1024 / 1204 * 10) / 10;
|
|
1984
|
-
console.log(` \u{1F95A} ${(0, import_path3.basename)(sourcePath).padStart(40)} ${`${Date.now() - start}`.padStart(3)}ms \u05C1\xB7 ${`${optimized}`.padStart(4)} optimized \xB7 ${flattened} flattened ${memUsed > 10 ? `used ${memUsed}MB` : ""}`);
|
|
1991
|
+
console.log(` \u{1F95A} ${(0, import_path3.basename)(sourcePath).padStart(40)} ${`${Date.now() - start}`.padStart(3)}ms \u05C1\xB7 ${`${res.optimized}`.padStart(4)} optimized \xB7 ${res.flattened} flattened ${memUsed > 10 ? `used ${memUsed}MB` : ""}`);
|
|
1985
1992
|
}
|
|
1986
1993
|
return {
|
|
1987
1994
|
ast,
|
|
@@ -1997,8 +2004,24 @@ var fs = __toModule(require("fs"));
|
|
|
1997
2004
|
var import_path4 = __toModule(require("path"));
|
|
1998
2005
|
function patchReactNativeWeb() {
|
|
1999
2006
|
const rootDir = require.resolve("react-native-web").replace(/\/dist.*/, "");
|
|
2000
|
-
|
|
2001
|
-
|
|
2007
|
+
const modulePath = import_path4.default.join(rootDir, "dist", "tamagui-exports.js");
|
|
2008
|
+
const cjsPath = import_path4.default.join(rootDir, "dist", "cjs", "tamagui-exports.js");
|
|
2009
|
+
const isEqual = (() => {
|
|
2010
|
+
let res = false;
|
|
2011
|
+
try {
|
|
2012
|
+
res = fs.readFileSync(modulePath, "utf-8") === moduleExports && fs.readFileSync(cjsPath, "utf-8") == cjsExports;
|
|
2013
|
+
} catch {
|
|
2014
|
+
res = false;
|
|
2015
|
+
}
|
|
2016
|
+
return res;
|
|
2017
|
+
})();
|
|
2018
|
+
if (!isEqual) {
|
|
2019
|
+
console.log("\u{1F95A} Tamagui patching react-native-web to share atomic styling primitives");
|
|
2020
|
+
console.log(" > adding", modulePath);
|
|
2021
|
+
console.log(" > adding", cjsPath);
|
|
2022
|
+
fs.writeFileSync(modulePath, moduleExports);
|
|
2023
|
+
fs.writeFileSync(cjsPath, cjsExports);
|
|
2024
|
+
}
|
|
2002
2025
|
const moduleEntry = import_path4.default.join(rootDir, "dist", "index.js");
|
|
2003
2026
|
const moduleEntrySrc = fs.readFileSync(moduleEntry, "utf-8");
|
|
2004
2027
|
if (!moduleEntrySrc.includes("// tamagui-patch-v4")) {
|
|
@@ -2019,7 +2042,6 @@ export const TamaguiExports = TExports
|
|
|
2019
2042
|
exports.TamaguiExports = _interopRequireDefault(require("./tamagui-exports"));
|
|
2020
2043
|
// tamagui-patch-end
|
|
2021
2044
|
`);
|
|
2022
|
-
console.log(`Tamagui patched react-native-web`);
|
|
2023
2045
|
}
|
|
2024
2046
|
}
|
|
2025
2047
|
__name(patchReactNativeWeb, "patchReactNativeWeb");
|