@tamagui/static 1.0.0-beta.153 → 1.0.0-beta.181

package/dist/cjs/constants.js

@@ -33,4 +33,12 @@ const MEDIA_SEP = "_";
 const cacheDir = (0, import_find_cache_dir.default)({ name: "tamagui", create: true });
 const FAILED_EVAL = Symbol("failed_style_eval");
 const CONCAT_CLASSNAME_IMPORT = "concatClassName";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  CONCAT_CLASSNAME_IMPORT,
+  CSS_FILE_NAME,
+  FAILED_EVAL,
+  MEDIA_SEP,
+  cacheDir
+});
 //# sourceMappingURL=constants.js.map

package/dist/cjs/extractor/accessSafe.js

@@ -29,4 +29,8 @@ function accessSafe(obj, member) {
   return t.logicalExpression("&&", t.logicalExpression("&&", t.binaryExpression("===", t.unaryExpression("typeof", obj), t.stringLiteral("object")), t.binaryExpression("!==", obj, t.nullLiteral())), t.memberExpression(obj, t.identifier(member), false));
 }
 __name(accessSafe, "accessSafe");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  accessSafe
+});
 //# sourceMappingURL=accessSafe.js.map

package/dist/cjs/extractor/babelParse.js

@@ -48,4 +48,9 @@ function babelParse(code) {
   return parser(code.toString(), parserOptions);
 }
 __name(babelParse, "babelParse");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  babelParse,
+  parserOptions
+});
 //# sourceMappingURL=babelParse.js.map

package/dist/cjs/extractor/babelParse.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/extractor/babelParse.ts"],
-  "sourcesContent": ["import * as babelParser from '@babel/parser'\n\nexport const parserOptions: babelParser.ParserOptions = Object.freeze({\n  plugins: [\n    'asyncGenerators',\n    'classProperties',\n    'dynamicImport',\n    'functionBind',\n    'jsx',\n    'numericSeparator',\n    'objectRestSpread',\n    'optionalCatchBinding',\n    'decorators-legacy',\n    'typescript',\n    'optionalChaining',\n    'nullishCoalescingOperator',\n    // 'objectRestSpread',\n    // 'dynamicImport'\n  ],\n  sourceType: 'module',\n})\n\nconst parser = babelParser.parse.bind(babelParser)\n\nexport function babelParse(code: string | Buffer): any {\n  return parser(code.toString(), parserOptions)\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAA6B;AAEtB,MAAM,gBAA2C,OAAO,OAAO;AAAA,EACpE,SAAS;AAAA,IACP;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAGF;AAAA,EACA,YAAY;AACd,CAAC;AAED,MAAM,SAAS,YAAY,MAAM,KAAK,WAAW;AAE1C,oBAAoB,MAA4B;AACrD,SAAO,OAAO,KAAK,SAAS,GAAG,aAAa;AAC9C;AAFgB;",
+  "sourcesContent": ["import * as babelParser from '@babel/parser'\n\nexport const parserOptions: babelParser.ParserOptions = Object.freeze({\n  plugins: [\n    'asyncGenerators',\n    'classProperties',\n    'dynamicImport',\n    'functionBind',\n    'jsx',\n    'numericSeparator',\n    'objectRestSpread',\n    'optionalCatchBinding',\n    'decorators-legacy',\n    'typescript',\n    'optionalChaining',\n    'nullishCoalescingOperator',\n  ],\n  sourceType: 'module',\n})\n\nconst parser = babelParser.parse.bind(babelParser)\n\nexport function babelParse(code: string | Buffer): any {\n  return parser(code.toString(), parserOptions)\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAA6B;AAEtB,MAAM,gBAA2C,OAAO,OAAO;AAAA,EACpE,SAAS;AAAA,IACP;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAAA,EACA,YAAY;AACd,CAAC;AAED,MAAM,SAAS,YAAY,MAAM,KAAK,WAAW;AAE1C,oBAAoB,MAA4B;AACrD,SAAO,OAAO,KAAK,SAAS,GAAG,aAAa;AAC9C;AAFgB;",
   "names": []
 }

package/dist/cjs/extractor/buildClassName.js

@@ -58,4 +58,8 @@ function buildClassName(classNameObjects) {
   }, null);
 }
 __name(buildClassName, "buildClassName");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  buildClassName
+});
 //# sourceMappingURL=buildClassName.js.map

package/dist/cjs/extractor/createEvaluator.js

@@ -70,4 +70,9 @@ function createSafeEvaluator(attemptEval) {
   };
 }
 __name(createSafeEvaluator, "createSafeEvaluator");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  createEvaluator,
+  createSafeEvaluator
+});
 //# sourceMappingURL=createEvaluator.js.map

package/dist/cjs/extractor/createExtractor.js

@@ -68,6 +68,7 @@ var import_loadTamagui = require("./loadTamagui");
 var import_logLines = require("./logLines");
 var import_normalizeTernaries = require("./normalizeTernaries");
 var import_removeUnusedHooks = require("./removeUnusedHooks");
+var import_timer = require("./timer");
 var import_validHTMLAttributes = require("./validHTMLAttributes");
 const UNTOUCHED_PROPS = {
   key: true,
@@ -95,10 +96,6 @@ function createExtractor() {
     process.exit(1);
   }
   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);
-  require("esbuild-register/dist/node").register({
-    target: "es2019",
-    format: "cjs"
-  });
   let loadedTamaguiConfig;
   let hasLogged = false;
   return {
@@ -146,10 +143,15 @@ function createExtractor() {
       if (!Array.isArray(props.components)) {
         throw new Error(`Must provide components array with list of Tamagui component modules`);
       }
+      const tm = (0, import_timer.timer)();
       const { components, tamaguiConfig } = (0, import_loadTamagui.loadTamagui)({
         config,
         components: props.components || ["tamagui"]
       });
+      if (shouldPrintDebug === "verbose") {
+        console.log("tamagui.config.ts:", { components, config });
+      }
+      tm.mark("load-tamagui", shouldPrintDebug === "verbose");
       loadedTamaguiConfig = tamaguiConfig;
       const defaultTheme = tamaguiConfig.themes[Object.keys(tamaguiConfig.themes)[0]];
       const body = fileOrPath.type === "Program" ? fileOrPath.get("body") : fileOrPath.program.body;
@@ -163,6 +165,9 @@ function createExtractor() {
         obj[name] = components[name];
         return obj;
       }, {});
+      if (shouldPrintDebug === "verbose") {
+        console.log("validComponents", Object.keys(validComponents));
+      }
       let doesUseValidImport = false;
       let hasImportedTheme = false;
       for (const bodyPath of body) {
@@ -170,11 +175,16 @@ function createExtractor() {
           continue;
         const node = "node" in bodyPath ? bodyPath.node : bodyPath;
         const from = node.source.value;
-        if (props.components.includes(from) || isInternalImport(from)) {
-          if (node.specifiers.some((specifier) => {
+        const isValidImport = props.components.includes(from) || isInternalImport(from);
+        if (isValidImport) {
+          const isValidComponent = node.specifiers.some((specifier) => {
             const name = specifier.local.name;
             return validComponents[name] || validHooks[name];
-          })) {
+          });
+          if (shouldPrintDebug === "verbose") {
+            console.log("import from", from, { isValidComponent });
+          }
+          if (isValidComponent) {
             doesUseValidImport = true;
             break;
           }
@@ -186,6 +196,7 @@ function createExtractor() {
       if (!doesUseValidImport) {
         return null;
       }
+      tm.mark("import-check", shouldPrintDebug === "verbose");
       let couldntParse = false;
       const modifiedComponents = /* @__PURE__ */ new Set();
       const bindingCache = {};
@@ -207,6 +218,7 @@ function createExtractor() {
         },
         JSXElement(traversePath) {
           var _a2, _b2, _c;
+          tm.mark("jsx-element", shouldPrintDebug === "verbose");
           const node = traversePath.node.openingElement;
           const ogAttributes = node.attributes;
           const componentName = (0, import_extractHelpers.findComponentName)(traversePath.scope);
@@ -631,6 +643,11 @@ function createExtractor() {
               for (const key in next) {
                 if (import_core_node.pseudos[key]) {
                   prev2[key] = prev2[key] || {};
+                  if (shouldPrintDebug) {
+                    if (!next[key] || !prev2[key]) {
+                      console.log("warn: missing", key, prev2, next);
+                    }
+                  }
                   Object.assign(prev2[key], next[key]);
                 } else {
                   prev2[key] = next[key];
@@ -740,6 +757,7 @@ function createExtractor() {
             if (couldntParse) {
               return;
             }
+            tm.mark("jsx-element-flattened", shouldPrintDebug === "verbose");
             node.attributes = flattenedAttrs;
             if (staticConfig.defaultProps) {
               for (const key in staticConfig.defaultProps) {
@@ -765,6 +783,7 @@ function createExtractor() {
             attrs = traversePath.get("openingElement").get("attributes").flatMap((path) => {
               try {
                 const res2 = evaluateAttribute(path);
+                tm.mark("jsx-element-evaluate-attr", shouldPrintDebug === "verbose");
                 if (!res2) {
                   path.remove();
                 }
@@ -827,43 +846,25 @@ function createExtractor() {
               out.push(cur);
               return out;
             }, []).flat();
-            const completeStaticProps = __spreadValues({}, Object.keys(attrs).reduce((acc, index) => {
-              const cur = attrs[index];
-              if (cur.type === "style") {
-                Object.assign(acc, cur.value);
-              }
-              if (cur.type === "attr") {
-                if (t.isJSXSpreadAttribute(cur.value)) {
-                  return acc;
-                }
-                if (!t.isJSXIdentifier(cur.value.name)) {
-                  return acc;
-                }
-                const key = cur.value.name.name;
-                const value = attemptEvalSafe(cur.value.value || t.booleanLiteral(true));
-                if (value === import_constants.FAILED_EVAL) {
-                  return acc;
-                }
-                acc[key] = value;
-              }
-              return acc;
-            }, {}));
             const hasSpread = node.attributes.some((x) => t.isJSXSpreadAttribute(x));
             const hasOnlyStringChildren = !hasSpread && (node.selfClosing || traversePath.node.children && traversePath.node.children.every((x) => x.type === "JSXText"));
             const themeVal = inlined.get("theme");
             inlined.delete("theme");
             const allOtherPropsExtractable = [...inlined].every(([k, v]) => INLINE_EXTRACTABLE[k]);
-            const shouldWrapInnerTheme = allOtherPropsExtractable && !!(hasOnlyStringChildren && themeVal);
-            const canFlattenProps = inlined.size === 0 || shouldWrapInnerTheme || allOtherPropsExtractable;
+            const shouldWrapThme = allOtherPropsExtractable && !!themeVal;
+            const canFlattenProps = inlined.size === 0 || shouldWrapThme || allOtherPropsExtractable;
             let shouldFlatten = !shouldDeopt && canFlattenProps && !hasSpread && staticConfig.neverFlatten !== true && (staticConfig.neverFlatten === "jsx" ? hasOnlyStringChildren : true);
-            if (shouldFlatten && shouldWrapInnerTheme) {
+            if (shouldPrintDebug) {
+              console.log(" >>", { hasSpread, shouldDeopt, shouldFlatten, canFlattenProps, shouldWrapThme, allOtherPropsExtractable, hasOnlyStringChildren });
+            }
+            if (shouldFlatten && shouldWrapThme) {
               if (typeof themeVal !== "string") {
-                console.warn("??");
                 return;
               }
               if (shouldPrintDebug) {
                 console.log("  - wrapping theme", allOtherPropsExtractable, themeVal);
               }
+              attrs = attrs.filter((x) => x.type === "attr" && t.isJSXAttribute(x.value) && x.value.name.name === "theme" ? false : true);
               if (!hasImportedTheme) {
                 hasImportedTheme = true;
                 programPath.node.body.push(t.importDeclaration([t.importSpecifier(t.identifier("_TamaguiTheme"), t.identifier("Theme"))], t.stringLiteral("@tamagui/core")));
@@ -875,23 +876,21 @@ function createExtractor() {
             if (shouldFlatten && staticConfig.defaultProps) {
               const defaultStyleAttrs = Object.keys(staticConfig.defaultProps).flatMap((key) => {
                 if (!isValidStyleKey(key)) {
-                  return;
+                  return [];
                 }
-                try {
-                  const serialize = require("babel-literal-to-ast");
-                  const val = staticConfig.defaultProps[key];
-                  const value = serialize(val);
-                  const name = tamaguiConfig.shorthands[key] || key;
-                  return {
-                    type: "style",
-                    name,
-                    value
-                  };
-                } catch (err) {
-                  console.warn(`\u26A0\uFE0F Error evaluating default style for component, prop ${key}
- error: ${err}`);
+                const value = staticConfig.defaultProps[key];
+                const name = tamaguiConfig.shorthands[key] || key;
+                if (value === void 0) {
+                  console.warn(`\u26A0\uFE0F Error evaluating default style for component, prop ${key} ${value}`);
                   shouldDeopt = true;
+                  return;
                 }
+                const attr = {
+                  type: "style",
+                  name,
+                  value: { [name]: value }
+                };
+                return attr;
               });
               if (defaultStyleAttrs.length) {
                 attrs = [...defaultStyleAttrs, ...attrs];
@@ -959,6 +958,7 @@ function createExtractor() {
               acc.push(cur);
               return acc;
             }, []);
+            tm.mark("jsx-element-expanded", shouldPrintDebug === "verbose");
             if (shouldPrintDebug) {
               console.log("  - attrs (expanded): \n", (0, import_logLines.logLines)(attrs.map(import_extractHelpers.attrStr).join(", ")));
             }
@@ -995,48 +995,84 @@ function createExtractor() {
               acc.push(cur);
               return acc;
             }, []);
+            const state = {
+              noClassNames: true,
+              focus: false,
+              hover: false,
+              mounted: true,
+              press: false,
+              pressIn: false
+            };
+            const completeStaticProps = Object.keys(attrs).reduce((acc, index) => {
+              const cur = attrs[index];
+              if (cur.type === "style") {
+                (0, import_core_node.normalizeStyleObject)(cur.value);
+                Object.assign(acc, cur.value);
+              }
+              if (cur.type === "attr") {
+                if (t.isJSXSpreadAttribute(cur.value)) {
+                  return acc;
+                }
+                if (!t.isJSXIdentifier(cur.value.name)) {
+                  return acc;
+                }
+                const key = cur.value.name.name;
+                const value = attemptEvalSafe(cur.value.value || t.booleanLiteral(true));
+                if (value === import_constants.FAILED_EVAL) {
+                  return acc;
+                }
+                acc[key] = value;
+              }
+              return acc;
+            }, {});
+            const completeProps = __spreadValues(__spreadValues({}, staticConfig.defaultProps), completeStaticProps);
             if (shouldPrintDebug) {
               console.log("  - attrs (combined \u{1F500}): \n", (0, import_logLines.logLines)(attrs.map(import_extractHelpers.attrStr).join(", ")));
+              console.log("  - defaultProps: \n", (0, import_logLines.logLines)((0, import_extractHelpers.objToStr)(staticConfig.defaultProps)));
+              console.log("  - completeStaticProps: \n", (0, import_logLines.logLines)((0, import_extractHelpers.objToStr)(completeStaticProps)));
             }
-            const completeProps = __spreadValues(__spreadValues({}, staticConfig.defaultProps), completeStaticProps);
             const getStyles = /* @__PURE__ */ __name((props2, debugName = "") => {
-              if (!props2)
-                return;
-              if (!Object.keys(props2).length)
-                return;
+              if (!props2 || !Object.keys(props2).length) {
+                if (shouldPrintDebug)
+                  console.log(" getStyles() no props");
+                return {};
+              }
               if (excludeProps && !!excludeProps.size) {
                 for (const key in props2) {
                   if (excludeProps.has(key)) {
+                    if (shouldPrintDebug)
+                      console.log(" delete excluded", key);
                     delete props2[key];
                   }
                 }
               }
-              const out = (0, import_core_node.getSplitStyles)(props2, staticConfig, defaultTheme, {
-                noClassNames: true,
-                fallbackProps: completeProps,
-                focus: false,
-                hover: false,
-                mounted: true,
-                press: false,
-                pressIn: false
-              });
-              const outStyle = __spreadValues(__spreadValues({}, out.style), out.pseudos);
-              for (const key in outStyle) {
+              try {
+                const out = (0, import_core_node.getSplitStyles)(props2, staticConfig, defaultTheme, __spreadProps(__spreadValues({}, state), {
+                  fallbackProps: completeProps
+                }));
+                const outStyle = __spreadValues(__spreadValues({}, out.style), out.pseudos);
                 if (staticConfig.validStyles) {
-                  if (!staticConfig.validStyles[key] && !import_core_node.pseudos[key]) {
-                    delete outStyle[key];
+                  for (const key in outStyle) {
+                    if (!staticConfig.validStyles[key] && !import_core_node.pseudos[key] && !/(hover|focus|press)Style$/.test(key)) {
+                      if (shouldPrintDebug)
+                        console.log(" delete invalid style", key);
+                      delete outStyle[key];
+                    }
                   }
                 }
-              }
-              if (shouldPrintDebug === "verbose") {
-                console.log(`       getStyles ${debugName} (props):
+                if (shouldPrintDebug) {
+                  console.log(`       getStyles ${debugName} (props):
 `, (0, import_logLines.logLines)((0, import_extractHelpers.objToStr)(props2)));
-                console.log(`       getStyles ${debugName} (out.viewProps):
+                  console.log(`       getStyles ${debugName} (out.viewProps):
 `, (0, import_logLines.logLines)((0, import_extractHelpers.objToStr)(out.viewProps)));
-                console.log(`       getStyles ${debugName} (out.style):
+                  console.log(`       getStyles ${debugName} (out.style):
 `, (0, import_logLines.logLines)((0, import_extractHelpers.objToStr)(outStyle || {}), true));
+                }
+                return outStyle;
+              } catch (err) {
+                console.log("error", err.message, err.stack);
+                return {};
               }
-              return outStyle;
             }, "getStyles");
             const completeStylesProcessed = getStyles(completeProps, "completeStylesProcessed");
             if (!completeStylesProcessed) {
@@ -1077,11 +1113,13 @@ function createExtractor() {
                       console.log("     => tern ", (0, import_extractHelpers.attrStr)(attr));
                     continue;
                   case "style":
+                    if (shouldPrintDebug)
+                      console.log("  * styles in", (0, import_logLines.logLines)((0, import_extractHelpers.objToStr)(attr.value)));
                     const styles = getStyles(attr.value, "style");
+                    if (shouldPrintDebug)
+                      console.log("  * styles out", (0, import_logLines.logLines)((0, import_extractHelpers.objToStr)(styles)));
                     if (styles) {
                       attr.value = Object.fromEntries(Object.keys(styles).map((k) => [k, completeStylesProcessed[k]]));
-                    } else {
-                      console.warn("?????????");
                     }
                     continue;
                 }
@@ -1089,6 +1127,7 @@ function createExtractor() {
                 getStyleError = err;
               }
             }
+            tm.mark("jsx-element-styles", shouldPrintDebug === "verbose");
             if (getStyleError) {
               console.log(" \u26A0\uFE0F postprocessing error, deopt", getStyleError);
               node.attributes = ogAttributes;
@@ -1112,6 +1151,9 @@ function createExtractor() {
               if (attr.type === "style") {
                 for (const key in attr.value) {
                   if (existingStyleKeys.has(key)) {
+                    if (shouldPrintDebug) {
+                      console.log("  >> delete existing", key);
+                    }
                     delete attr.value[key];
                   } else {
                     existingStyleKeys.add(key);
@@ -1153,6 +1195,7 @@ function createExtractor() {
           }
         }
       });
+      tm.mark("jsx-done", shouldPrintDebug === "verbose");
       if (modifiedComponents.size) {
         const all = Array.from(modifiedComponents);
         if (shouldPrintDebug) {
@@ -1162,9 +1205,14 @@ function createExtractor() {
           (0, import_removeUnusedHooks.removeUnusedHooks)(comp, shouldPrintDebug);
         }
       }
+      tm.done(shouldPrintDebug === "verbose");
       return res;
     }
   };
 }
 __name(createExtractor, "createExtractor");
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  createExtractor
+});
 //# sourceMappingURL=createExtractor.js.map