@tamagui/static 1.0.0-alpha.29 → 1.0.0-alpha.32
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/constants.js +10 -0
- package/dist/constants.js.map +7 -0
- package/dist/extractor/accessSafe.js +11 -0
- package/dist/extractor/accessSafe.js.map +7 -0
- package/dist/extractor/babelParse.js +30 -0
- package/dist/extractor/babelParse.js.map +7 -0
- package/dist/extractor/buildClassName.js +40 -0
- package/dist/extractor/buildClassName.js.map +7 -0
- package/dist/extractor/createEvaluator.js +51 -0
- package/dist/extractor/createEvaluator.js.map +7 -0
- package/dist/extractor/createExtractor.js +827 -0
- package/dist/extractor/createExtractor.js.map +7 -0
- package/dist/extractor/ensureImportingConcat.js +24 -0
- package/dist/extractor/ensureImportingConcat.js.map +7 -0
- package/dist/extractor/evaluateAstNode.js +94 -0
- package/dist/extractor/evaluateAstNode.js.map +7 -0
- package/dist/extractor/extractHelpers.js +94 -0
- package/dist/extractor/extractHelpers.js.map +7 -0
- package/dist/extractor/extractMediaStyle.js +151 -0
- package/dist/extractor/extractMediaStyle.js.map +7 -0
- package/dist/extractor/extractToClassNames.js +235 -0
- package/dist/extractor/extractToClassNames.js.map +7 -0
- package/dist/extractor/findTopmostFunction.js +23 -0
- package/dist/extractor/findTopmostFunction.js.map +7 -0
- package/dist/extractor/generatedUid.js +28 -0
- package/dist/extractor/generatedUid.js.map +7 -0
- package/dist/extractor/getPropValueFromAttributes.js +49 -0
- package/dist/extractor/getPropValueFromAttributes.js.map +7 -0
- package/dist/extractor/getSourceModule.js +69 -0
- package/dist/extractor/getSourceModule.js.map +7 -0
- package/dist/extractor/getStaticBindingsForScope.js +128 -0
- package/dist/extractor/getStaticBindingsForScope.js.map +7 -0
- package/dist/extractor/hoistClassNames.js +44 -0
- package/dist/extractor/hoistClassNames.js.map +7 -0
- package/dist/extractor/literalToAst.js +34 -0
- package/dist/extractor/literalToAst.js.map +7 -0
- package/dist/extractor/loadTamagui.js +41 -0
- package/dist/extractor/loadTamagui.js.map +7 -0
- package/dist/extractor/normalizeTernaries.js +52 -0
- package/dist/extractor/normalizeTernaries.js.map +7 -0
- package/dist/extractor/removeUnusedHooks.js +78 -0
- package/dist/extractor/removeUnusedHooks.js.map +7 -0
- package/dist/index.cjs +2116 -0
- package/dist/index.cjs.map +7 -0
- package/dist/index.js +14 -0
- package/dist/index.js.map +7 -0
- package/dist/patchReactNativeWeb.js +107 -0
- package/dist/patchReactNativeWeb.js.map +7 -0
- package/dist/types.js +1 -0
- package/dist/types.js.map +7 -0
- package/package.json +7 -7
- package/types/extractor/createExtractor.d.ts.map +1 -1
|
@@ -0,0 +1,827 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
|
|
3
|
+
import traverse from "@babel/traverse";
|
|
4
|
+
import * as t from "@babel/types";
|
|
5
|
+
import * as CoreNode from "@tamagui/core-node";
|
|
6
|
+
import { stylePropsTransform } from "@tamagui/helpers";
|
|
7
|
+
import { difference, pick } from "lodash";
|
|
8
|
+
import { createEvaluator, createSafeEvaluator } from "./createEvaluator";
|
|
9
|
+
import { evaluateAstNode } from "./evaluateAstNode";
|
|
10
|
+
import { attrStr, findComponentName, isInsideTamagui, isPresent, objToStr } from "./extractHelpers";
|
|
11
|
+
import { findTopmostFunction } from "./findTopmostFunction";
|
|
12
|
+
import { getStaticBindingsForScope } from "./getStaticBindingsForScope";
|
|
13
|
+
import { literalToAst } from "./literalToAst";
|
|
14
|
+
import { loadTamagui } from "./loadTamagui";
|
|
15
|
+
import { normalizeTernaries } from "./normalizeTernaries";
|
|
16
|
+
import { removeUnusedHooks } from "./removeUnusedHooks";
|
|
17
|
+
const { mediaQueryConfig, postProcessStyles, pseudos } = CoreNode;
|
|
18
|
+
const FAILED_EVAL = Symbol("failed_style_eval");
|
|
19
|
+
const UNTOUCHED_PROPS = {
|
|
20
|
+
key: true,
|
|
21
|
+
style: true,
|
|
22
|
+
className: true
|
|
23
|
+
};
|
|
24
|
+
const isAttr = /* @__PURE__ */ __name((x) => x.type === "attr", "isAttr");
|
|
25
|
+
const validHooks = {
|
|
26
|
+
useMedia: true,
|
|
27
|
+
useTheme: true
|
|
28
|
+
};
|
|
29
|
+
const createTernary = /* @__PURE__ */ __name((x) => x, "createTernary");
|
|
30
|
+
function createExtractor() {
|
|
31
|
+
const shouldAddDebugProp = !process.env.npm_package_dependencies_next && process.env.TAMAGUI_TARGET !== "native" && process.env.IDENTIFY_TAGS !== "false" && (process.env.NODE_ENV === "development" || process.env.DEBUG || process.env.IDENTIFY_TAGS);
|
|
32
|
+
require("esbuild-register/dist/node").register({
|
|
33
|
+
target: "es2019",
|
|
34
|
+
format: "cjs"
|
|
35
|
+
});
|
|
36
|
+
let loadedTamaguiConfig;
|
|
37
|
+
let hasLogged = false;
|
|
38
|
+
return {
|
|
39
|
+
getTamagui() {
|
|
40
|
+
return loadedTamaguiConfig;
|
|
41
|
+
},
|
|
42
|
+
parse: (fileOrPath, {
|
|
43
|
+
config = "tamagui.config.ts",
|
|
44
|
+
importsWhitelist = ["constants.js"],
|
|
45
|
+
evaluateVars = true,
|
|
46
|
+
shouldPrintDebug = false,
|
|
47
|
+
sourcePath = "",
|
|
48
|
+
onExtractTag,
|
|
49
|
+
getFlattenedNode,
|
|
50
|
+
disableExtraction,
|
|
51
|
+
disableExtractInlineMedia,
|
|
52
|
+
disableDebugAttr,
|
|
53
|
+
...props
|
|
54
|
+
}) => {
|
|
55
|
+
if (sourcePath === "") {
|
|
56
|
+
throw new Error(`Must provide a source file name`);
|
|
57
|
+
}
|
|
58
|
+
if (!Array.isArray(props.components)) {
|
|
59
|
+
throw new Error(`Must provide components array with list of Tamagui component modules`);
|
|
60
|
+
}
|
|
61
|
+
const { components, tamaguiConfig } = loadTamagui({
|
|
62
|
+
config,
|
|
63
|
+
components: props.components || ["tamagui"]
|
|
64
|
+
});
|
|
65
|
+
loadedTamaguiConfig = tamaguiConfig;
|
|
66
|
+
const defaultTheme = tamaguiConfig.themes[Object.keys(tamaguiConfig.themes)[0]];
|
|
67
|
+
const body = fileOrPath.type === "Program" ? fileOrPath.get("body") : fileOrPath.program.body;
|
|
68
|
+
const isInternalImport = /* @__PURE__ */ __name((importStr) => isInsideTamagui(sourcePath) && importStr[0] === ".", "isInternalImport");
|
|
69
|
+
const validComponents = Object.keys(components).filter((key) => key[0].toUpperCase() === key[0] && !!components[key]?.staticConfig).reduce((obj, name) => {
|
|
70
|
+
obj[name] = components[name];
|
|
71
|
+
return obj;
|
|
72
|
+
}, {});
|
|
73
|
+
let doesUseValidImport = false;
|
|
74
|
+
for (const bodyPath of body) {
|
|
75
|
+
if (bodyPath.type !== "ImportDeclaration")
|
|
76
|
+
continue;
|
|
77
|
+
const node = "node" in bodyPath ? bodyPath.node : bodyPath;
|
|
78
|
+
const from = node.source.value;
|
|
79
|
+
if (props.components.includes(from) || isInternalImport(from)) {
|
|
80
|
+
if (node.specifiers.some((specifier) => {
|
|
81
|
+
const name = specifier.local.name;
|
|
82
|
+
return validComponents[name] || validHooks[name];
|
|
83
|
+
})) {
|
|
84
|
+
doesUseValidImport = true;
|
|
85
|
+
break;
|
|
86
|
+
}
|
|
87
|
+
}
|
|
88
|
+
}
|
|
89
|
+
if (shouldPrintDebug) {
|
|
90
|
+
console.log(sourcePath, { doesUseValidImport });
|
|
91
|
+
}
|
|
92
|
+
if (!doesUseValidImport) {
|
|
93
|
+
return null;
|
|
94
|
+
}
|
|
95
|
+
let couldntParse = false;
|
|
96
|
+
const modifiedComponents = new Set();
|
|
97
|
+
const bindingCache = {};
|
|
98
|
+
const callTraverse = /* @__PURE__ */ __name((a) => {
|
|
99
|
+
return fileOrPath.type === "File" ? traverse(fileOrPath, a) : fileOrPath.traverse(a);
|
|
100
|
+
}, "callTraverse");
|
|
101
|
+
let programPath;
|
|
102
|
+
const res = {
|
|
103
|
+
flattened: 0,
|
|
104
|
+
optimized: 0,
|
|
105
|
+
modified: 0
|
|
106
|
+
};
|
|
107
|
+
callTraverse({
|
|
108
|
+
Program: {
|
|
109
|
+
enter(path) {
|
|
110
|
+
programPath = path;
|
|
111
|
+
}
|
|
112
|
+
},
|
|
113
|
+
JSXElement(traversePath) {
|
|
114
|
+
const node = traversePath.node.openingElement;
|
|
115
|
+
const ogAttributes = node.attributes;
|
|
116
|
+
const componentName = findComponentName(traversePath.scope);
|
|
117
|
+
const closingElement = traversePath.node.closingElement;
|
|
118
|
+
if (t.isJSXMemberExpression(closingElement?.name) || !t.isJSXIdentifier(node.name)) {
|
|
119
|
+
return;
|
|
120
|
+
}
|
|
121
|
+
const binding = traversePath.scope.getBinding(node.name.name);
|
|
122
|
+
if (binding) {
|
|
123
|
+
if (!t.isImportDeclaration(binding.path.parent)) {
|
|
124
|
+
return;
|
|
125
|
+
}
|
|
126
|
+
const source = binding.path.parent.source;
|
|
127
|
+
if (!props.components.includes(source.value) && !isInternalImport(source.value)) {
|
|
128
|
+
return;
|
|
129
|
+
}
|
|
130
|
+
if (!validComponents[binding.identifier.name]) {
|
|
131
|
+
return;
|
|
132
|
+
}
|
|
133
|
+
}
|
|
134
|
+
const component = validComponents[node.name.name];
|
|
135
|
+
if (!component || !component.staticConfig) {
|
|
136
|
+
return;
|
|
137
|
+
}
|
|
138
|
+
const originalNodeName = node.name.name;
|
|
139
|
+
if (shouldPrintDebug) {
|
|
140
|
+
console.log(`
|
|
141
|
+
<${originalNodeName} />`);
|
|
142
|
+
}
|
|
143
|
+
const filePath = sourcePath.replace(process.cwd(), ".");
|
|
144
|
+
const lineNumbers = node.loc ? node.loc.start.line + (node.loc.start.line !== node.loc.end.line ? `-${node.loc.end.line}` : "") : "";
|
|
145
|
+
if (shouldAddDebugProp && !disableDebugAttr) {
|
|
146
|
+
const preName = componentName ? `${componentName}:` : "";
|
|
147
|
+
res.modified++;
|
|
148
|
+
node.attributes.unshift(t.jsxAttribute(t.jsxIdentifier("data-is"), t.stringLiteral(` ${preName}${node.name.name} ${filePath.replace("./", "")}:${lineNumbers} `)));
|
|
149
|
+
}
|
|
150
|
+
if (disableExtraction) {
|
|
151
|
+
if (!hasLogged) {
|
|
152
|
+
console.log("\u{1F95A} Tamagui disableExtraction set: no CSS or optimizations will be run");
|
|
153
|
+
hasLogged = true;
|
|
154
|
+
}
|
|
155
|
+
return;
|
|
156
|
+
}
|
|
157
|
+
const { staticConfig } = component;
|
|
158
|
+
const isTextView = staticConfig.isText || false;
|
|
159
|
+
const validStyles = staticConfig?.validStyles ?? {};
|
|
160
|
+
let tagName = staticConfig.defaultProps?.tag ?? (isTextView ? "span" : "div");
|
|
161
|
+
traversePath.get("openingElement").get("attributes").forEach((path) => {
|
|
162
|
+
const attr = path.node;
|
|
163
|
+
if (t.isJSXSpreadAttribute(attr))
|
|
164
|
+
return;
|
|
165
|
+
if (attr.name.name !== "tag")
|
|
166
|
+
return;
|
|
167
|
+
const val = attr.value;
|
|
168
|
+
if (!t.isStringLiteral(val))
|
|
169
|
+
return;
|
|
170
|
+
tagName = val.value;
|
|
171
|
+
});
|
|
172
|
+
const flatNode = getFlattenedNode({ isTextView, tag: tagName });
|
|
173
|
+
const deoptProps = new Set([
|
|
174
|
+
...props.deoptProps ?? [],
|
|
175
|
+
...staticConfig.deoptProps ?? []
|
|
176
|
+
]);
|
|
177
|
+
const excludeProps = new Set(props.excludeProps ?? []);
|
|
178
|
+
const isExcludedProp = /* @__PURE__ */ __name((name) => {
|
|
179
|
+
const res2 = excludeProps.has(name);
|
|
180
|
+
if (res2 && shouldPrintDebug)
|
|
181
|
+
console.log(` excluding ${name}`);
|
|
182
|
+
return res2;
|
|
183
|
+
}, "isExcludedProp");
|
|
184
|
+
const isDeoptedProp = /* @__PURE__ */ __name((name) => {
|
|
185
|
+
const res2 = deoptProps.has(name);
|
|
186
|
+
if (res2 && shouldPrintDebug)
|
|
187
|
+
console.log(` deopting ${name}`);
|
|
188
|
+
return res2;
|
|
189
|
+
}, "isDeoptedProp");
|
|
190
|
+
const staticNamespace = getStaticBindingsForScope(traversePath.scope, importsWhitelist, sourcePath, bindingCache, shouldPrintDebug);
|
|
191
|
+
const attemptEval = !evaluateVars ? evaluateAstNode : createEvaluator({
|
|
192
|
+
tamaguiConfig,
|
|
193
|
+
staticNamespace,
|
|
194
|
+
sourcePath,
|
|
195
|
+
traversePath,
|
|
196
|
+
shouldPrintDebug
|
|
197
|
+
});
|
|
198
|
+
const attemptEvalSafe = createSafeEvaluator(attemptEval);
|
|
199
|
+
if (shouldPrintDebug) {
|
|
200
|
+
console.log(" staticNamespace", Object.keys(staticNamespace).join(", "));
|
|
201
|
+
}
|
|
202
|
+
const hasDeopt = /* @__PURE__ */ __name((obj) => {
|
|
203
|
+
return Object.keys(obj).some(isDeoptedProp);
|
|
204
|
+
}, "hasDeopt");
|
|
205
|
+
const flattenedAttrs = [];
|
|
206
|
+
traversePath.get("openingElement").get("attributes").forEach((path) => {
|
|
207
|
+
const attr = path.node;
|
|
208
|
+
if (!t.isJSXSpreadAttribute(attr)) {
|
|
209
|
+
flattenedAttrs.push(attr);
|
|
210
|
+
return;
|
|
211
|
+
}
|
|
212
|
+
let arg;
|
|
213
|
+
try {
|
|
214
|
+
arg = attemptEval(attr.argument);
|
|
215
|
+
} catch (e) {
|
|
216
|
+
if (shouldPrintDebug) {
|
|
217
|
+
console.log(" couldnt parse spread", e.message);
|
|
218
|
+
}
|
|
219
|
+
flattenedAttrs.push(attr);
|
|
220
|
+
return;
|
|
221
|
+
}
|
|
222
|
+
if (typeof arg !== "undefined") {
|
|
223
|
+
try {
|
|
224
|
+
if (typeof arg !== "object" || arg == null) {
|
|
225
|
+
if (shouldPrintDebug) {
|
|
226
|
+
console.log(" non object or null arg", arg);
|
|
227
|
+
}
|
|
228
|
+
flattenedAttrs.push(attr);
|
|
229
|
+
} else {
|
|
230
|
+
for (const k in arg) {
|
|
231
|
+
const value = arg[k];
|
|
232
|
+
if (!value && typeof value === "object") {
|
|
233
|
+
console.log("shouldnt we handle this?", k, value, arg);
|
|
234
|
+
continue;
|
|
235
|
+
}
|
|
236
|
+
flattenedAttrs.push(t.jsxAttribute(t.jsxIdentifier(k), t.jsxExpressionContainer(literalToAst(value))));
|
|
237
|
+
}
|
|
238
|
+
}
|
|
239
|
+
} catch (err) {
|
|
240
|
+
console.warn("cant parse spread, caught err", err);
|
|
241
|
+
couldntParse = true;
|
|
242
|
+
}
|
|
243
|
+
}
|
|
244
|
+
});
|
|
245
|
+
if (couldntParse) {
|
|
246
|
+
return;
|
|
247
|
+
}
|
|
248
|
+
node.attributes = flattenedAttrs;
|
|
249
|
+
if (staticConfig.defaultProps) {
|
|
250
|
+
for (const key in staticConfig.defaultProps) {
|
|
251
|
+
const serialize = require("babel-literal-to-ast");
|
|
252
|
+
const val = staticConfig.defaultProps[key];
|
|
253
|
+
node.attributes.unshift(t.jsxAttribute(t.jsxIdentifier(key), typeof val === "string" ? t.stringLiteral(val) : t.jsxExpressionContainer(serialize(val))));
|
|
254
|
+
}
|
|
255
|
+
}
|
|
256
|
+
let attrs = [];
|
|
257
|
+
let shouldDeopt = false;
|
|
258
|
+
let inlinePropCount = 0;
|
|
259
|
+
let isFlattened = false;
|
|
260
|
+
attrs = traversePath.get("openingElement").get("attributes").flatMap((path) => {
|
|
261
|
+
try {
|
|
262
|
+
const res2 = evaluateAttribute(path);
|
|
263
|
+
if (!res2) {
|
|
264
|
+
path.remove();
|
|
265
|
+
}
|
|
266
|
+
return res2;
|
|
267
|
+
} catch (err) {
|
|
268
|
+
console.log("Error extracting attribute", err.message, err.stack);
|
|
269
|
+
console.log("node", path.node);
|
|
270
|
+
return {
|
|
271
|
+
type: "attr",
|
|
272
|
+
value: path.node
|
|
273
|
+
};
|
|
274
|
+
}
|
|
275
|
+
}).flat(4).filter(isPresent);
|
|
276
|
+
function isStaticAttributeName(name) {
|
|
277
|
+
return !!(!!validStyles[name] || staticConfig.validPropsExtra?.[name] || !!pseudos[name] || staticConfig.variants?.[name] || tamaguiConfig.shorthands[name] || (name[0] === "$" ? !!mediaQueryConfig[name.slice(1)] : false));
|
|
278
|
+
}
|
|
279
|
+
__name(isStaticAttributeName, "isStaticAttributeName");
|
|
280
|
+
function isExtractable(obj) {
|
|
281
|
+
return t.isObjectExpression(obj) && obj.properties.every((prop) => {
|
|
282
|
+
if (!t.isObjectProperty(prop)) {
|
|
283
|
+
console.log("not object prop", prop);
|
|
284
|
+
return false;
|
|
285
|
+
}
|
|
286
|
+
const propName = prop.key["name"];
|
|
287
|
+
if (!isStaticAttributeName(propName) && propName !== "tag") {
|
|
288
|
+
if (shouldPrintDebug) {
|
|
289
|
+
console.log(" not a valid style prop!", propName);
|
|
290
|
+
}
|
|
291
|
+
return false;
|
|
292
|
+
}
|
|
293
|
+
return true;
|
|
294
|
+
});
|
|
295
|
+
}
|
|
296
|
+
__name(isExtractable, "isExtractable");
|
|
297
|
+
function createTernariesFromObjectProperties(test, side, ternaryPartial = {}) {
|
|
298
|
+
if (!side) {
|
|
299
|
+
return null;
|
|
300
|
+
}
|
|
301
|
+
if (!isExtractable(side)) {
|
|
302
|
+
throw new Error("not extractable");
|
|
303
|
+
}
|
|
304
|
+
return side.properties.flatMap((property) => {
|
|
305
|
+
if (!t.isObjectProperty(property)) {
|
|
306
|
+
throw new Error("expected object property");
|
|
307
|
+
}
|
|
308
|
+
if (t.isConditionalExpression(property.value)) {
|
|
309
|
+
const [truthy, falsy] = [
|
|
310
|
+
t.objectExpression([t.objectProperty(property.key, property.value.consequent)]),
|
|
311
|
+
t.objectExpression([t.objectProperty(property.key, property.value.alternate)])
|
|
312
|
+
].map((x) => attemptEval(x));
|
|
313
|
+
return [
|
|
314
|
+
createTernary({
|
|
315
|
+
remove() {
|
|
316
|
+
},
|
|
317
|
+
...ternaryPartial,
|
|
318
|
+
test: t.logicalExpression("&&", test, property.value.test),
|
|
319
|
+
consequent: truthy,
|
|
320
|
+
alternate: null
|
|
321
|
+
}),
|
|
322
|
+
createTernary({
|
|
323
|
+
...ternaryPartial,
|
|
324
|
+
test: t.logicalExpression("&&", test, t.unaryExpression("!", property.value.test)),
|
|
325
|
+
consequent: falsy,
|
|
326
|
+
alternate: null,
|
|
327
|
+
remove() {
|
|
328
|
+
}
|
|
329
|
+
})
|
|
330
|
+
];
|
|
331
|
+
}
|
|
332
|
+
const obj = t.objectExpression([t.objectProperty(property.key, property.value)]);
|
|
333
|
+
const consequent = attemptEval(obj);
|
|
334
|
+
return createTernary({
|
|
335
|
+
remove() {
|
|
336
|
+
},
|
|
337
|
+
...ternaryPartial,
|
|
338
|
+
test,
|
|
339
|
+
consequent,
|
|
340
|
+
alternate: null
|
|
341
|
+
});
|
|
342
|
+
});
|
|
343
|
+
}
|
|
344
|
+
__name(createTernariesFromObjectProperties, "createTernariesFromObjectProperties");
|
|
345
|
+
function evaluateAttribute(path) {
|
|
346
|
+
const attribute = path.node;
|
|
347
|
+
const attr = { type: "attr", value: attribute };
|
|
348
|
+
if (t.isJSXSpreadAttribute(attribute)) {
|
|
349
|
+
const arg = attribute.argument;
|
|
350
|
+
const conditional = t.isConditionalExpression(arg) ? [arg.test, arg.consequent, arg.alternate] : t.isLogicalExpression(arg) && arg.operator === "&&" ? [arg.left, arg.right, null] : null;
|
|
351
|
+
if (conditional) {
|
|
352
|
+
const [test, alt, cons] = conditional;
|
|
353
|
+
if (!test)
|
|
354
|
+
throw new Error(`no test`);
|
|
355
|
+
if ([alt, cons].some((side) => side && !isExtractable(side))) {
|
|
356
|
+
if (shouldPrintDebug) {
|
|
357
|
+
console.log("not extractable", alt, cons);
|
|
358
|
+
}
|
|
359
|
+
return attr;
|
|
360
|
+
}
|
|
361
|
+
return [
|
|
362
|
+
...createTernariesFromObjectProperties(test, alt) || [],
|
|
363
|
+
...cons && createTernariesFromObjectProperties(t.unaryExpression("!", test), cons) || []
|
|
364
|
+
].map((ternary) => ({
|
|
365
|
+
type: "ternary",
|
|
366
|
+
value: ternary
|
|
367
|
+
}));
|
|
368
|
+
}
|
|
369
|
+
}
|
|
370
|
+
if (t.isJSXSpreadAttribute(attribute) || !attribute.name || typeof attribute.name.name !== "string") {
|
|
371
|
+
inlinePropCount++;
|
|
372
|
+
return attr;
|
|
373
|
+
}
|
|
374
|
+
const name = attribute.name.name;
|
|
375
|
+
if (isExcludedProp(name)) {
|
|
376
|
+
return null;
|
|
377
|
+
}
|
|
378
|
+
if (isDeoptedProp(name)) {
|
|
379
|
+
if (shouldPrintDebug) {
|
|
380
|
+
console.log(" ! inlining, deopt prop", name);
|
|
381
|
+
}
|
|
382
|
+
inlinePropCount++;
|
|
383
|
+
return attr;
|
|
384
|
+
}
|
|
385
|
+
if (UNTOUCHED_PROPS[name]) {
|
|
386
|
+
return attr;
|
|
387
|
+
}
|
|
388
|
+
if (name[0] === "$" && t.isJSXExpressionContainer(attribute?.value)) {
|
|
389
|
+
if (disableExtractInlineMedia) {
|
|
390
|
+
return attr;
|
|
391
|
+
}
|
|
392
|
+
const shortname = name.slice(1);
|
|
393
|
+
if (mediaQueryConfig[shortname]) {
|
|
394
|
+
const expression = attribute.value.expression;
|
|
395
|
+
if (!t.isJSXEmptyExpression(expression)) {
|
|
396
|
+
const ternaries2 = createTernariesFromObjectProperties(t.stringLiteral(shortname), expression, {
|
|
397
|
+
inlineMediaQuery: shortname
|
|
398
|
+
});
|
|
399
|
+
if (ternaries2) {
|
|
400
|
+
return ternaries2.map((value2) => ({
|
|
401
|
+
type: "ternary",
|
|
402
|
+
value: value2
|
|
403
|
+
}));
|
|
404
|
+
}
|
|
405
|
+
}
|
|
406
|
+
}
|
|
407
|
+
}
|
|
408
|
+
const [value, valuePath] = (() => {
|
|
409
|
+
if (t.isJSXExpressionContainer(attribute?.value)) {
|
|
410
|
+
return [attribute.value.expression, path.get("value")];
|
|
411
|
+
} else {
|
|
412
|
+
return [attribute.value, path.get("value")];
|
|
413
|
+
}
|
|
414
|
+
})();
|
|
415
|
+
const remove = /* @__PURE__ */ __name(() => {
|
|
416
|
+
Array.isArray(valuePath) ? valuePath.map((p) => p.remove()) : valuePath.remove();
|
|
417
|
+
}, "remove");
|
|
418
|
+
if (name === "ref") {
|
|
419
|
+
if (shouldPrintDebug) {
|
|
420
|
+
console.log(" ! inlining, ref", name);
|
|
421
|
+
}
|
|
422
|
+
inlinePropCount++;
|
|
423
|
+
return attr;
|
|
424
|
+
}
|
|
425
|
+
if (name === "tag") {
|
|
426
|
+
return {
|
|
427
|
+
type: "attr",
|
|
428
|
+
value: path.node
|
|
429
|
+
};
|
|
430
|
+
}
|
|
431
|
+
const styleValue = attemptEvalSafe(value);
|
|
432
|
+
if (!isStaticAttributeName(name)) {
|
|
433
|
+
let keys = [name];
|
|
434
|
+
if (staticConfig.propMapper) {
|
|
435
|
+
const out = staticConfig.propMapper(name, styleValue, defaultTheme, staticConfig.defaultProps);
|
|
436
|
+
if (out) {
|
|
437
|
+
keys = Object.keys(out);
|
|
438
|
+
}
|
|
439
|
+
}
|
|
440
|
+
if (keys.some((k) => !isStaticAttributeName(k) && k !== "tag")) {
|
|
441
|
+
if (shouldPrintDebug) {
|
|
442
|
+
console.log(" ! inlining, not static attribute name", name);
|
|
443
|
+
}
|
|
444
|
+
inlinePropCount++;
|
|
445
|
+
return attr;
|
|
446
|
+
}
|
|
447
|
+
}
|
|
448
|
+
if (styleValue !== FAILED_EVAL) {
|
|
449
|
+
return {
|
|
450
|
+
type: "style",
|
|
451
|
+
value: { [name]: styleValue },
|
|
452
|
+
name,
|
|
453
|
+
attr: path.node
|
|
454
|
+
};
|
|
455
|
+
}
|
|
456
|
+
if (t.isBinaryExpression(value)) {
|
|
457
|
+
const { operator, left, right } = value;
|
|
458
|
+
const lVal = attemptEvalSafe(left);
|
|
459
|
+
const rVal = attemptEvalSafe(right);
|
|
460
|
+
if (shouldPrintDebug) {
|
|
461
|
+
console.log(` evalBinaryExpression lVal ${String(lVal)}, rVal ${String(rVal)}`);
|
|
462
|
+
}
|
|
463
|
+
if (lVal !== FAILED_EVAL && t.isConditionalExpression(right)) {
|
|
464
|
+
const ternary = addBinaryConditional(operator, left, right);
|
|
465
|
+
if (ternary)
|
|
466
|
+
return ternary;
|
|
467
|
+
}
|
|
468
|
+
if (rVal !== FAILED_EVAL && t.isConditionalExpression(left)) {
|
|
469
|
+
const ternary = addBinaryConditional(operator, right, left);
|
|
470
|
+
if (ternary)
|
|
471
|
+
return ternary;
|
|
472
|
+
}
|
|
473
|
+
if (shouldPrintDebug) {
|
|
474
|
+
console.log(` evalBinaryExpression cant extract`);
|
|
475
|
+
}
|
|
476
|
+
inlinePropCount++;
|
|
477
|
+
return attr;
|
|
478
|
+
}
|
|
479
|
+
const staticConditional = getStaticConditional(value);
|
|
480
|
+
if (staticConditional) {
|
|
481
|
+
return { type: "ternary", value: staticConditional };
|
|
482
|
+
}
|
|
483
|
+
const staticLogical = getStaticLogical(value);
|
|
484
|
+
if (staticLogical) {
|
|
485
|
+
return { type: "ternary", value: staticLogical };
|
|
486
|
+
}
|
|
487
|
+
if (shouldPrintDebug) {
|
|
488
|
+
console.log(" ! inline prop via no match", name, value.type);
|
|
489
|
+
}
|
|
490
|
+
inlinePropCount++;
|
|
491
|
+
return attr;
|
|
492
|
+
function addBinaryConditional(operator, staticExpr, cond) {
|
|
493
|
+
if (getStaticConditional(cond)) {
|
|
494
|
+
const alt = attemptEval(t.binaryExpression(operator, staticExpr, cond.alternate));
|
|
495
|
+
const cons = attemptEval(t.binaryExpression(operator, staticExpr, cond.consequent));
|
|
496
|
+
if (shouldPrintDebug) {
|
|
497
|
+
console.log(" binaryConditional", cond.test, cons, alt);
|
|
498
|
+
}
|
|
499
|
+
return {
|
|
500
|
+
type: "ternary",
|
|
501
|
+
value: {
|
|
502
|
+
test: cond.test,
|
|
503
|
+
remove,
|
|
504
|
+
alternate: { [name]: alt },
|
|
505
|
+
consequent: { [name]: cons }
|
|
506
|
+
}
|
|
507
|
+
};
|
|
508
|
+
}
|
|
509
|
+
return null;
|
|
510
|
+
}
|
|
511
|
+
__name(addBinaryConditional, "addBinaryConditional");
|
|
512
|
+
function getStaticConditional(value2) {
|
|
513
|
+
if (t.isConditionalExpression(value2)) {
|
|
514
|
+
try {
|
|
515
|
+
if (shouldPrintDebug) {
|
|
516
|
+
console.log("attempt", value2.alternate, value2.consequent);
|
|
517
|
+
}
|
|
518
|
+
const aVal = attemptEval(value2.alternate);
|
|
519
|
+
const cVal = attemptEval(value2.consequent);
|
|
520
|
+
if (shouldPrintDebug) {
|
|
521
|
+
const type = value2.test.type;
|
|
522
|
+
console.log(" static ternary", type, cVal, aVal);
|
|
523
|
+
}
|
|
524
|
+
return {
|
|
525
|
+
test: value2.test,
|
|
526
|
+
remove,
|
|
527
|
+
consequent: { [name]: cVal },
|
|
528
|
+
alternate: { [name]: aVal }
|
|
529
|
+
};
|
|
530
|
+
} catch (err) {
|
|
531
|
+
if (shouldPrintDebug) {
|
|
532
|
+
console.log(" cant eval ternary", err.message);
|
|
533
|
+
}
|
|
534
|
+
}
|
|
535
|
+
}
|
|
536
|
+
return null;
|
|
537
|
+
}
|
|
538
|
+
__name(getStaticConditional, "getStaticConditional");
|
|
539
|
+
function getStaticLogical(value2) {
|
|
540
|
+
if (t.isLogicalExpression(value2)) {
|
|
541
|
+
if (value2.operator === "&&") {
|
|
542
|
+
try {
|
|
543
|
+
const val = attemptEval(value2.right);
|
|
544
|
+
if (shouldPrintDebug) {
|
|
545
|
+
console.log(" staticLogical", value2.left, name, val);
|
|
546
|
+
}
|
|
547
|
+
return {
|
|
548
|
+
test: value2.left,
|
|
549
|
+
remove,
|
|
550
|
+
consequent: { [name]: val },
|
|
551
|
+
alternate: null
|
|
552
|
+
};
|
|
553
|
+
} catch (err) {
|
|
554
|
+
if (shouldPrintDebug) {
|
|
555
|
+
console.log(" cant static eval logical", err);
|
|
556
|
+
}
|
|
557
|
+
}
|
|
558
|
+
}
|
|
559
|
+
}
|
|
560
|
+
return null;
|
|
561
|
+
}
|
|
562
|
+
__name(getStaticLogical, "getStaticLogical");
|
|
563
|
+
}
|
|
564
|
+
__name(evaluateAttribute, "evaluateAttribute");
|
|
565
|
+
if (shouldPrintDebug) {
|
|
566
|
+
console.log(" - attrs (before): ", attrs.map(attrStr).join(", "));
|
|
567
|
+
}
|
|
568
|
+
node.attributes = attrs.filter(isAttr).map((x) => x.value);
|
|
569
|
+
if (couldntParse) {
|
|
570
|
+
if (shouldPrintDebug) {
|
|
571
|
+
console.log(` cancel:`, { couldntParse, shouldDeopt });
|
|
572
|
+
}
|
|
573
|
+
node.attributes = ogAttributes;
|
|
574
|
+
return;
|
|
575
|
+
}
|
|
576
|
+
const parentFn = findTopmostFunction(traversePath);
|
|
577
|
+
if (parentFn) {
|
|
578
|
+
modifiedComponents.add(parentFn);
|
|
579
|
+
}
|
|
580
|
+
let ternaries = [];
|
|
581
|
+
attrs = attrs.reduce((out, cur) => {
|
|
582
|
+
const next = attrs[attrs.indexOf(cur) + 1];
|
|
583
|
+
if (cur.type === "ternary") {
|
|
584
|
+
ternaries.push(cur.value);
|
|
585
|
+
}
|
|
586
|
+
if ((!next || next.type !== "ternary") && ternaries.length) {
|
|
587
|
+
const normalized = normalizeTernaries(ternaries).map(({ alternate, consequent, ...rest }) => {
|
|
588
|
+
return {
|
|
589
|
+
type: "ternary",
|
|
590
|
+
value: {
|
|
591
|
+
...rest,
|
|
592
|
+
alternate: alternate || null,
|
|
593
|
+
consequent: consequent || null
|
|
594
|
+
}
|
|
595
|
+
};
|
|
596
|
+
});
|
|
597
|
+
try {
|
|
598
|
+
return [...out, ...normalized];
|
|
599
|
+
} finally {
|
|
600
|
+
if (shouldPrintDebug) {
|
|
601
|
+
console.log(` normalizeTernaries (${ternaries.length} => ${normalized.length})`);
|
|
602
|
+
}
|
|
603
|
+
ternaries = [];
|
|
604
|
+
}
|
|
605
|
+
}
|
|
606
|
+
if (cur.type === "ternary") {
|
|
607
|
+
return out;
|
|
608
|
+
}
|
|
609
|
+
out.push(cur);
|
|
610
|
+
return out;
|
|
611
|
+
}, []).flat();
|
|
612
|
+
const completeStaticProps = {
|
|
613
|
+
...Object.keys(attrs).reduce((acc, index) => {
|
|
614
|
+
const cur = attrs[index];
|
|
615
|
+
if (cur.type === "style") {
|
|
616
|
+
Object.assign(acc, cur.value);
|
|
617
|
+
}
|
|
618
|
+
if (cur.type === "attr") {
|
|
619
|
+
if (t.isJSXSpreadAttribute(cur.value)) {
|
|
620
|
+
return acc;
|
|
621
|
+
}
|
|
622
|
+
if (!t.isJSXIdentifier(cur.value.name)) {
|
|
623
|
+
return acc;
|
|
624
|
+
}
|
|
625
|
+
const key = cur.value.name.name;
|
|
626
|
+
const value = attemptEvalSafe(cur.value.value || t.booleanLiteral(true));
|
|
627
|
+
if (value === FAILED_EVAL) {
|
|
628
|
+
return acc;
|
|
629
|
+
}
|
|
630
|
+
acc[key] = value;
|
|
631
|
+
}
|
|
632
|
+
return acc;
|
|
633
|
+
}, {})
|
|
634
|
+
};
|
|
635
|
+
const hasSpread = node.attributes.some((x) => t.isJSXSpreadAttribute(x));
|
|
636
|
+
const hasOnlyStringChildren = !hasSpread && (node.selfClosing || traversePath.node.children && traversePath.node.children.every((x) => x.type === "JSXText"));
|
|
637
|
+
const shouldFlatten = !shouldDeopt && inlinePropCount === 0 && !hasSpread && staticConfig.neverFlatten !== true && (staticConfig.neverFlatten === "jsx" ? hasOnlyStringChildren : true);
|
|
638
|
+
if (!shouldFlatten) {
|
|
639
|
+
attrs = attrs.reduce((acc, cur) => {
|
|
640
|
+
if (cur.type === "style") {
|
|
641
|
+
for (const key in cur.value) {
|
|
642
|
+
const shouldEnsureOverridden = !!staticConfig.ensureOverriddenProp?.[key];
|
|
643
|
+
const isSetInAttrsAlready = attrs.some((x) => x.type === "attr" && x.value.type === "JSXAttribute" && x.value.name.name === key);
|
|
644
|
+
if (!isSetInAttrsAlready) {
|
|
645
|
+
const isVariant = !!staticConfig.variants?.[cur.name || ""];
|
|
646
|
+
if (isVariant || shouldEnsureOverridden) {
|
|
647
|
+
acc.push({
|
|
648
|
+
type: "attr",
|
|
649
|
+
value: cur.attr || t.jsxAttribute(t.jsxIdentifier(key), t.jsxExpressionContainer(t.nullLiteral()))
|
|
650
|
+
});
|
|
651
|
+
}
|
|
652
|
+
}
|
|
653
|
+
}
|
|
654
|
+
}
|
|
655
|
+
acc.push(cur);
|
|
656
|
+
return acc;
|
|
657
|
+
}, []);
|
|
658
|
+
}
|
|
659
|
+
if (shouldPrintDebug) {
|
|
660
|
+
console.log(" - attrs (flattened): ", attrs.map(attrStr).join(", "));
|
|
661
|
+
}
|
|
662
|
+
attrs = attrs.reduce((acc, cur) => {
|
|
663
|
+
if (cur.type !== "attr" || !t.isJSXAttribute(cur.value) || typeof cur.value.name.name !== "string") {
|
|
664
|
+
if (cur.type === "style") {
|
|
665
|
+
const key = Object.keys(cur.value)[0];
|
|
666
|
+
if (!validStyles[key] && !pseudos[key]) {
|
|
667
|
+
if (shouldPrintDebug) {
|
|
668
|
+
console.log(" \u274C excluding", key);
|
|
669
|
+
}
|
|
670
|
+
return acc;
|
|
671
|
+
}
|
|
672
|
+
}
|
|
673
|
+
}
|
|
674
|
+
acc.push(cur);
|
|
675
|
+
return acc;
|
|
676
|
+
}, []);
|
|
677
|
+
if (shouldPrintDebug) {
|
|
678
|
+
console.log(" - attrs (evaluated styles): ", attrs.map(attrStr).join(", "));
|
|
679
|
+
}
|
|
680
|
+
let prev = null;
|
|
681
|
+
attrs = attrs.reduce((acc, cur) => {
|
|
682
|
+
if (cur.type === "style") {
|
|
683
|
+
if (prev?.type === "style") {
|
|
684
|
+
Object.assign(prev.value, cur.value);
|
|
685
|
+
return acc;
|
|
686
|
+
}
|
|
687
|
+
}
|
|
688
|
+
acc.push(cur);
|
|
689
|
+
prev = cur;
|
|
690
|
+
return acc;
|
|
691
|
+
}, []);
|
|
692
|
+
if (shouldPrintDebug) {
|
|
693
|
+
console.log(" - attrs (combined \u{1F500}): ", attrs.map(attrStr).join(", "));
|
|
694
|
+
}
|
|
695
|
+
const getStyles = /* @__PURE__ */ __name((props2) => {
|
|
696
|
+
if (!props2)
|
|
697
|
+
return;
|
|
698
|
+
if (!!excludeProps.size) {
|
|
699
|
+
for (const key in props2) {
|
|
700
|
+
if (isExcludedProp(key))
|
|
701
|
+
delete props2[key];
|
|
702
|
+
}
|
|
703
|
+
}
|
|
704
|
+
const out = postProcessStyles(props2, staticConfig, defaultTheme);
|
|
705
|
+
const next = out?.style ?? props2;
|
|
706
|
+
if (shouldPrintDebug) {
|
|
707
|
+
console.log(" >> getStyles: ", objToStr(props2), "==>>", objToStr(next));
|
|
708
|
+
console.log(" >> style: ", objToStr(out.style));
|
|
709
|
+
console.log(" >> viewp: ", objToStr(out.viewProps));
|
|
710
|
+
}
|
|
711
|
+
if (staticConfig.validStyles) {
|
|
712
|
+
for (const key in next) {
|
|
713
|
+
if (!staticConfig.validStyles[key] && !pseudos[key]) {
|
|
714
|
+
delete next[key];
|
|
715
|
+
}
|
|
716
|
+
}
|
|
717
|
+
}
|
|
718
|
+
return next;
|
|
719
|
+
}, "getStyles");
|
|
720
|
+
if (shouldPrintDebug) {
|
|
721
|
+
console.log(" staticConfig.defaultProps", staticConfig.defaultProps);
|
|
722
|
+
}
|
|
723
|
+
const completeStylesProcessed = getStyles({
|
|
724
|
+
...staticConfig.defaultProps,
|
|
725
|
+
...completeStaticProps
|
|
726
|
+
});
|
|
727
|
+
const stylesToAddToInitialGroup = difference(Object.keys(completeStylesProcessed), Object.keys(completeStaticProps));
|
|
728
|
+
if (stylesToAddToInitialGroup.length) {
|
|
729
|
+
const toAdd = pick(completeStylesProcessed, ...stylesToAddToInitialGroup);
|
|
730
|
+
const firstGroup = attrs.find((x) => x.type === "style");
|
|
731
|
+
if (shouldPrintDebug) {
|
|
732
|
+
console.log(" stylesToAddToInitialGroup", stylesToAddToInitialGroup.join(", "));
|
|
733
|
+
console.log(" toAdd", objToStr(toAdd));
|
|
734
|
+
}
|
|
735
|
+
if (!firstGroup) {
|
|
736
|
+
attrs.unshift({ type: "style", value: toAdd });
|
|
737
|
+
} else {
|
|
738
|
+
Object.assign(firstGroup.value, toAdd);
|
|
739
|
+
}
|
|
740
|
+
}
|
|
741
|
+
if (shouldPrintDebug) {
|
|
742
|
+
console.log(" completeStaticProps", objToStr(completeStaticProps));
|
|
743
|
+
console.log(" completeStylesProcessed", objToStr(completeStylesProcessed));
|
|
744
|
+
}
|
|
745
|
+
for (const attr of attrs) {
|
|
746
|
+
try {
|
|
747
|
+
switch (attr.type) {
|
|
748
|
+
case "ternary":
|
|
749
|
+
const a = getStyles(attr.value.alternate);
|
|
750
|
+
const c = getStyles(attr.value.consequent);
|
|
751
|
+
attr.value.alternate = a;
|
|
752
|
+
attr.value.consequent = c;
|
|
753
|
+
if (shouldPrintDebug) {
|
|
754
|
+
console.log(" => tern ", attrStr(attr));
|
|
755
|
+
}
|
|
756
|
+
break;
|
|
757
|
+
case "style":
|
|
758
|
+
const next = {};
|
|
759
|
+
for (const key in attr.value) {
|
|
760
|
+
if (key in stylePropsTransform) {
|
|
761
|
+
next["transform"] = completeStylesProcessed["transform"];
|
|
762
|
+
} else {
|
|
763
|
+
next[key] = completeStylesProcessed[key] ?? attr.value[key];
|
|
764
|
+
}
|
|
765
|
+
}
|
|
766
|
+
attr.value = next;
|
|
767
|
+
break;
|
|
768
|
+
}
|
|
769
|
+
} catch (err) {
|
|
770
|
+
if (shouldPrintDebug) {
|
|
771
|
+
console.log(" postprocessing error, deopt", err);
|
|
772
|
+
node.attributes = ogAttributes;
|
|
773
|
+
return node;
|
|
774
|
+
}
|
|
775
|
+
}
|
|
776
|
+
}
|
|
777
|
+
if (shouldPrintDebug) {
|
|
778
|
+
console.log(" - attrs (after): ", attrs.map(attrStr).join(", "));
|
|
779
|
+
}
|
|
780
|
+
if (shouldFlatten) {
|
|
781
|
+
if (shouldPrintDebug) {
|
|
782
|
+
console.log(" [\u2705] flattening", originalNodeName, flatNode);
|
|
783
|
+
}
|
|
784
|
+
isFlattened = true;
|
|
785
|
+
node.name.name = flatNode;
|
|
786
|
+
res.flattened++;
|
|
787
|
+
if (closingElement) {
|
|
788
|
+
closingElement.name.name = flatNode;
|
|
789
|
+
}
|
|
790
|
+
}
|
|
791
|
+
if (shouldPrintDebug) {
|
|
792
|
+
console.log(" [\u274A] inline props ", inlinePropCount, shouldDeopt ? " deopted" : "", hasSpread ? " spread" : "", "!flatten", staticConfig.neverFlatten);
|
|
793
|
+
console.log(" - attrs (end): ", attrs.map(attrStr).join(", "));
|
|
794
|
+
}
|
|
795
|
+
res.optimized++;
|
|
796
|
+
onExtractTag({
|
|
797
|
+
attrs,
|
|
798
|
+
node,
|
|
799
|
+
lineNumbers,
|
|
800
|
+
filePath,
|
|
801
|
+
attemptEval,
|
|
802
|
+
jsxPath: traversePath,
|
|
803
|
+
originalNodeName,
|
|
804
|
+
isFlattened,
|
|
805
|
+
programPath
|
|
806
|
+
});
|
|
807
|
+
}
|
|
808
|
+
});
|
|
809
|
+
if (modifiedComponents.size) {
|
|
810
|
+
const all = Array.from(modifiedComponents);
|
|
811
|
+
if (shouldPrintDebug) {
|
|
812
|
+
console.log(" [\u{1FA9D}] hook check", all.length);
|
|
813
|
+
}
|
|
814
|
+
for (const comp of all) {
|
|
815
|
+
removeUnusedHooks(comp, shouldPrintDebug);
|
|
816
|
+
}
|
|
817
|
+
}
|
|
818
|
+
return res;
|
|
819
|
+
}
|
|
820
|
+
};
|
|
821
|
+
}
|
|
822
|
+
__name(createExtractor, "createExtractor");
|
|
823
|
+
export {
|
|
824
|
+
FAILED_EVAL,
|
|
825
|
+
createExtractor
|
|
826
|
+
};
|
|
827
|
+
//# sourceMappingURL=createExtractor.js.map
|