@tamagui/static 1.0.0-alpha.3 → 1.0.0-alpha.7

package/dist/index.cjs

@@ -717,6 +717,7 @@ function createExtractor() {
     format: "cjs"
   });
   let loadedTamaguiConfig;
+  let hasLogged = false;
   return {
     getTamaguiConfig() {
       return loadedTamaguiConfig;
@@ -730,7 +731,9 @@ function createExtractor() {
         sourcePath = "",
         onExtractTag,
         getFlattenedNode,
-        onDidFlatten
+        disableExtraction,
+        disableExtractInlineMedia,
+        disableDebugAttr
       } = _b, props = __objRest(_b, [
         "config",
         "importsWhitelist",
@@ -739,7 +742,9 @@ function createExtractor() {
         "sourcePath",
         "onExtractTag",
         "getFlattenedNode",
-        "onDidFlatten"
+        "disableExtraction",
+        "disableExtractInlineMedia",
+        "disableDebugAttr"
       ]);
       if (sourcePath === "") {
         throw new Error(`Must provide a source file name`);
@@ -753,16 +758,16 @@ function createExtractor() {
       });
       loadedTamaguiConfig = tamaguiConfig;
       const defaultTheme = tamaguiConfig.themes[Object.keys(tamaguiConfig.themes)[0]];
-      let doesUseValidImport = false;
       const body = fileOrPath.type === "Program" ? fileOrPath.get("body") : fileOrPath.program.body;
       const isInternalImport = /* @__PURE__ */ __name((importStr) => isInsideTamagui(sourcePath) && importStr[0] === ".", "isInternalImport");
       const validComponents = Object.keys(components).filter((key) => {
         var _a2;
-        return !!((_a2 = components[key]) == null ? void 0 : _a2.staticConfig);
+        return key[0].toUpperCase() === key[0] && !!((_a2 = components[key]) == null ? void 0 : _a2.staticConfig);
       }).reduce((obj, name) => {
         obj[name] = components[name];
         return obj;
       }, {});
+      let doesUseValidImport = false;
       for (const bodyPath of body) {
         if (bodyPath.type !== "ImportDeclaration")
           continue;
@@ -791,6 +796,11 @@ function createExtractor() {
         return fileOrPath.type === "File" ? (0, import_traverse.default)(fileOrPath, a) : fileOrPath.traverse(a);
       }, "callTraverse");
       let programPath;
+      const res = {
+        flattened: 0,
+        optimized: 0,
+        modified: 0
+      };
       callTraverse({
         Program: {
           enter(path3) {
@@ -823,8 +833,26 @@ function createExtractor() {
           if (!component || !component.staticConfig) {
             return;
           }
-          const { staticConfig } = component;
           const originalNodeName = node.name.name;
+          if (shouldPrintDebug) {
+            console.log(`
+<${originalNodeName} />`);
+          }
+          const filePath = sourcePath.replace(process.cwd(), ".");
+          const lineNumbers = node.loc ? node.loc.start.line + (node.loc.start.line !== node.loc.end.line ? `-${node.loc.end.line}` : "") : "";
+          if (shouldAddDebugProp && !disableDebugAttr) {
+            const preName = componentName ? `${componentName}:` : "";
+            res.modified++;
+            node.attributes.unshift(t9.jsxAttribute(t9.jsxIdentifier("data-is"), t9.stringLiteral(`  ${preName}${node.name.name}   ${filePath.replace("./", "")}:${lineNumbers}  `)));
+          }
+          if (disableExtraction) {
+            if (!hasLogged) {
+              console.log("\u{1F95A} Tamagui disableExtraction set: no CSS or optimizations will be run");
+              hasLogged = true;
+            }
+            return;
+          }
+          const { staticConfig } = component;
           const isTextView = staticConfig.isText || false;
           const validStyles = (staticConfig == null ? void 0 : staticConfig.validStyles) ?? {};
           let tagName = ((_a2 = staticConfig.defaultProps) == null ? void 0 : _a2.tag) ?? (isTextView ? "span" : "div");
@@ -846,21 +874,17 @@ function createExtractor() {
           ]);
           const excludeProps = new Set(props.excludeProps ?? []);
           const isExcludedProp = /* @__PURE__ */ __name((name) => {
-            const res = excludeProps.has(name);
-            if (res && shouldPrintDebug)
+            const res2 = excludeProps.has(name);
+            if (res2 && shouldPrintDebug)
               console.log(`  excluding ${name}`);
-            return res;
+            return res2;
           }, "isExcludedProp");
           const isDeoptedProp = /* @__PURE__ */ __name((name) => {
-            const res = deoptProps.has(name);
-            if (res && shouldPrintDebug)
+            const res2 = deoptProps.has(name);
+            if (res2 && shouldPrintDebug)
               console.log(`  deopting ${name}`);
-            return res;
+            return res2;
           }, "isDeoptedProp");
-          if (shouldPrintDebug) {
-            console.log(`
-<${originalNodeName} />`);
-          }
           const staticNamespace = getStaticBindingsForScope(traversePath.scope, importsWhitelist, sourcePath, bindingCache, shouldPrintDebug);
           const attemptEval = !evaluateVars ? evaluateAstNode : createEvaluator({
             tamaguiConfig,
@@ -933,11 +957,11 @@ function createExtractor() {
           let isFlattened = false;
           attrs = traversePath.get("openingElement").get("attributes").flatMap((path3) => {
             try {
-              const res = evaluateAttribute(path3);
-              if (!res) {
+              const res2 = evaluateAttribute(path3);
+              if (!res2) {
                 path3.remove();
               }
-              return res;
+              return res2;
             } catch (err) {
               console.log("Error extracting attribute", err.message, err.stack);
               console.log("node", path3.node);
@@ -1059,7 +1083,7 @@ function createExtractor() {
             if (UNTOUCHED_PROPS[name]) {
               return attr;
             }
-            if (name[0] === "$" && t9.isJSXExpressionContainer(attribute == null ? void 0 : attribute.value)) {
+            if (name[0] === "$" && t9.isJSXExpressionContainer(attribute == null ? void 0 : attribute.value) && !disableExtractInlineMedia) {
               const shortname = name.slice(1);
               if (mediaQueryConfig[shortname]) {
                 const expression = attribute.value.expression;
@@ -1246,8 +1270,6 @@ function createExtractor() {
           if (parentFn) {
             modifiedComponents.add(parentFn);
           }
-          const filePath = sourcePath.replace(process.cwd(), ".");
-          const lineNumbers = node.loc ? node.loc.start.line + (node.loc.start.line !== node.loc.end.line ? `-${node.loc.end.line}` : "") : "";
           let ternaries = [];
           attrs = attrs.reduce((out, cur) => {
             const next = attrs[attrs.indexOf(cur) + 1];
@@ -1442,20 +1464,13 @@ function createExtractor() {
           if (shouldPrintDebug) {
             console.log("  - attrs (after): ", attrs.map(attrStr).join(", "));
           }
-          if (shouldAddDebugProp) {
-            const preName = componentName ? `${componentName}:` : "";
-            attrs.unshift({
-              type: "attr",
-              value: t9.jsxAttribute(t9.jsxIdentifier("data-is"), t9.stringLiteral(`  ${preName}${node.name.name}   ${filePath.replace("./", "")}:${lineNumbers}  `))
-            });
-          }
           if (shouldFlatten) {
             if (shouldPrintDebug) {
               console.log("  [\u2705] flattening", originalNodeName, flatNode);
             }
             isFlattened = true;
             node.name.name = flatNode;
-            onDidFlatten == null ? void 0 : onDidFlatten();
+            res.flattened++;
             if (closingElement) {
               closingElement.name.name = flatNode;
             }
@@ -1464,6 +1479,7 @@ function createExtractor() {
             console.log("  [\u274A] inline props ", inlinePropCount, shouldDeopt ? " deopted" : "", hasSpread ? " spread" : "", "!flatten", staticConfig.neverFlatten);
             console.log("  - attrs (end): ", attrs.map(attrStr).join(", "));
           }
+          res.optimized++;
           onExtractTag({
             attrs,
             node,
@@ -1486,6 +1502,7 @@ function createExtractor() {
           removeUnusedHooks(comp, shouldPrintDebug);
         }
       }
+      return res;
     }
   };
 }
@@ -1803,16 +1820,11 @@ function extractToClassNames({
   }
   const cssMap = new Map();
   const existingHoists = {};
-  let flattened = 0;
-  let optimized = 0;
-  extractor.parse(ast, __spreadProps(__spreadValues({
+  const res = extractor.parse(ast, __spreadProps(__spreadValues({
     sourcePath,
     shouldPrintDebug
   }, options), {
     getFlattenedNode: ({ tag }) => tag,
-    onDidFlatten() {
-      flattened++;
-    },
     onExtractTag: ({
       attrs,
       node,
@@ -1823,7 +1835,6 @@ function extractToClassNames({
       lineNumbers,
       programPath
     }) => {
-      optimized++;
       let finalClassNames = [];
       let finalAttrs = [];
       let finalStyles = [];
@@ -1849,11 +1860,11 @@ function extractToClassNames({
         if (!style)
           return [];
         const styleWithPrev = ensureNeededPrevStyle(style);
-        const res = (0, import_core_node3.getStylesAtomic)(styleWithPrev);
-        if (res.length) {
-          finalStyles = [...finalStyles, ...res];
+        const res2 = (0, import_core_node3.getStylesAtomic)(styleWithPrev);
+        if (res2.length) {
+          finalStyles = [...finalStyles, ...res2];
         }
-        return res;
+        return res2;
       }, "addStyles");
       let lastMediaImportance = 1;
       for (const attr of attrs) {
@@ -1956,12 +1967,10 @@ function extractToClassNames({
       }
     }
   }));
-  if (!optimized) {
+  if (!res || !res.modified) {
     return null;
   }
-  const styles = Array.from(cssMap.values()).map((x) => {
-    return x.css;
-  }).join("\n").trim();
+  const styles = Array.from(cssMap.values()).map((x) => x.css).join("\n").trim();
   if (styles) {
     const cssQuery = threaded ? `cssData=${Buffer.from(styles).toString("base64")}` : `cssPath=${cssPath}`;
     const remReq = (0, import_loader_utils.getRemainingRequest)(loader);
@@ -1981,7 +1990,7 @@ function extractToClassNames({
   }
   if (shouldLogTiming && mem) {
     const memUsed = Math.round((process.memoryUsage().heapUsed - mem.heapUsed) / 1024 / 1204 * 10) / 10;
-    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` : ""}`);
+    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` : ""}`);
   }
   return {
     ast,
@@ -1997,8 +2006,24 @@ var fs = __toModule(require("fs"));
 var import_path4 = __toModule(require("path"));
 function patchReactNativeWeb() {
   const rootDir = require.resolve("react-native-web").replace(/\/dist.*/, "");
-  fs.writeFileSync(import_path4.default.join(rootDir, "dist", "tamagui-exports.js"), moduleExports);
-  fs.writeFileSync(import_path4.default.join(rootDir, "dist", "cjs", "tamagui-exports.js"), cjsExports);
+  const modulePath = import_path4.default.join(rootDir, "dist", "tamagui-exports.js");
+  const cjsPath = import_path4.default.join(rootDir, "dist", "cjs", "tamagui-exports.js");
+  const isEqual = (() => {
+    let res = false;
+    try {
+      res = fs.readFileSync(modulePath, "utf-8") === moduleExports && fs.readFileSync(cjsPath, "utf-8") == cjsExports;
+    } catch {
+      res = false;
+    }
+    return res;
+  })();
+  if (!isEqual) {
+    console.log("\u{1F95A} Tamagui patching react-native-web to share atomic styling primitives");
+    console.log("   > adding", modulePath);
+    console.log("   > adding", cjsPath);
+    fs.writeFileSync(modulePath, moduleExports);
+    fs.writeFileSync(cjsPath, cjsExports);
+  }
   const moduleEntry = import_path4.default.join(rootDir, "dist", "index.js");
   const moduleEntrySrc = fs.readFileSync(moduleEntry, "utf-8");
   if (!moduleEntrySrc.includes("// tamagui-patch-v4")) {
@@ -2019,7 +2044,6 @@ export const TamaguiExports = TExports
 exports.TamaguiExports = _interopRequireDefault(require("./tamagui-exports"));
 // tamagui-patch-end
 `);
-    console.log(`Tamagui patched react-native-web`);
   }
 }
 __name(patchReactNativeWeb, "patchReactNativeWeb");