@tamagui/static 1.100.6 → 1.101.0

package/dist/esm/extractor/extractToNative.js

@@ -0,0 +1,309 @@
+import { basename } from "node:path";
+import { transformFromAstSync } from "@babel/core";
+import generator from "@babel/generator";
+import { declare } from "@babel/helper-plugin-utils";
+import { parse } from "@babel/parser";
+import template from "@babel/template";
+import * as t from "@babel/types";
+import {
+  createExtractor,
+  createLogger,
+  getPragmaOptions,
+  isSimpleSpread,
+  literalToAst,
+  loadTamaguiBuildConfigSync
+} from "@tamagui/static";
+const importNativeView = template(`
+const __ReactNativeView = require('react-native').View;
+const __ReactNativeText = require('react-native').Text;
+`), importStyleSheet = template(`
+const __ReactNativeStyleSheet = require('react-native').StyleSheet;
+`), importWithStyle = template(`
+const __withStableStyle = require('@tamagui/core')._withStableStyle;
+`), extractor = createExtractor({ platform: "native" });
+let tamaguiBuildOptionsLoaded;
+function extractToNative(sourceFileName, sourceCode, options) {
+  const ast = parse(sourceCode, {
+    sourceType: "module",
+    plugins: ["jsx", "typescript"]
+  }), babelPlugin = getBabelPlugin(), out = transformFromAstSync(ast, sourceCode, {
+    plugins: [[babelPlugin, options]],
+    configFile: !1,
+    sourceFileName,
+    filename: sourceFileName
+  });
+  if (!out)
+    throw new Error("No output returned");
+  return out;
+}
+function getBabelPlugin() {
+  return declare((api, options) => (api.assertVersion(7), getBabelParseDefinition(options)));
+}
+function getBabelParseDefinition(options) {
+  return {
+    name: "tamagui",
+    visitor: {
+      Program: {
+        enter(root) {
+          let sourcePath = this.file.opts.filename;
+          if (sourcePath?.includes("node_modules") || !sourcePath?.endsWith(".jsx") && !sourcePath?.endsWith(".tsx"))
+            return;
+          process.env.SOURCE_ROOT?.endsWith("ios") && (sourcePath = sourcePath.replace("/ios", ""));
+          let hasImportedView = !1, hasImportedViewWrapper = !1;
+          const sheetStyles = {}, sheetIdentifier = root.scope.generateUidIdentifier("sheet"), firstCommentContents = (
+            // join because you can join together multiple pragmas
+            root.node.body[0]?.leadingComments?.map((comment) => comment?.value || " ").join(" ") ?? ""
+          ), firstComment = firstCommentContents ? `//${firstCommentContents}` : "", { shouldPrintDebug, shouldDisable } = getPragmaOptions({
+            source: firstComment,
+            path: sourcePath
+          });
+          if (shouldDisable)
+            return;
+          !options.config && !options.components && (tamaguiBuildOptionsLoaded ||= loadTamaguiBuildConfigSync({}));
+          const finalOptions = {
+            // @ts-ignore just in case they leave it out
+            platform: "native",
+            ...tamaguiBuildOptionsLoaded,
+            ...options
+          }, printLog = createLogger(sourcePath, finalOptions);
+          function addSheetStyle(style, node) {
+            let key = `${`${Object.keys(sheetStyles).length}`}`;
+            if (process.env.NODE_ENV === "development") {
+              const lineNumbers = node.loc ? node.loc.start.line + (node.loc.start.line !== node.loc.end.line ? `-${node.loc.end.line}` : "") : "";
+              key += `:${basename(sourcePath)}:${lineNumbers}`;
+            }
+            return sheetStyles[key] = style, readStyleExpr(key);
+          }
+          function readStyleExpr(key) {
+            return template("SHEET['KEY']")({
+              SHEET: sheetIdentifier.name,
+              KEY: key
+            }).expression;
+          }
+          let res;
+          try {
+            res = extractor.parseSync(root, {
+              importsWhitelist: ["constants.js", "colors.js"],
+              extractStyledDefinitions: options.forceExtractStyleDefinitions,
+              excludeProps: /* @__PURE__ */ new Set([
+                "className",
+                "userSelect",
+                "whiteSpace",
+                "textOverflow",
+                "cursor",
+                "contain"
+              ]),
+              shouldPrintDebug,
+              ...finalOptions,
+              // disable this extraction for now at least, need to figure out merging theme vs non-theme
+              // because theme need to stay in render(), whereas non-theme can be extracted
+              // for now just turn it off entirely at a small perf loss
+              disableExtractInlineMedia: !0,
+              // disable extracting variables as no native concept of them (only theme values)
+              disableExtractVariables: options.experimentalFlattenThemesOnNative ? !1 : "theme",
+              sourcePath,
+              // disabling flattening for now
+              // it's flattening a plain <Paragraph>hello</Paragraph> which breaks things because themes
+              // thinking it's not really worth the effort to do much compilation on native
+              // for now just disable flatten as it can only run in narrow places on native
+              // disableFlattening: 'styled',
+              getFlattenedNode({ isTextView }) {
+                return hasImportedView || (hasImportedView = !0, root.unshiftContainer("body", importNativeView())), isTextView ? "__ReactNativeText" : "__ReactNativeView";
+              },
+              onExtractTag(props) {
+                const { isFlattened } = props;
+                if (!isFlattened)
+                  return;
+                assertValidTag(props.node);
+                const stylesExpr = t.arrayExpression([]), hocStylesExpr = t.arrayExpression([]), expressions = [], finalAttrs = [], themeKeysUsed = /* @__PURE__ */ new Set();
+                function getStyleExpression(style) {
+                  if (!style) return;
+                  const { plain, themed } = splitThemeStyles(style);
+                  let themeExpr = null;
+                  if (themed && options.experimentalFlattenThemesOnNative) {
+                    for (const key in themed)
+                      themeKeysUsed.add(themed[key].split("$")[1]);
+                    themeExpr = getThemedStyleExpression(themed);
+                  }
+                  const ident = addSheetStyle(plain, props.node);
+                  return themeExpr ? (addStyleExpression(ident), addStyleExpression(ident, !0), themeExpr) : ident;
+                }
+                function addStyleExpression(expr, HOC = !1) {
+                  Array.isArray(expr) ? (HOC ? hocStylesExpr : stylesExpr).elements.push(...expr) : (HOC ? hocStylesExpr : stylesExpr).elements.push(expr);
+                }
+                function getThemedStyleExpression(styles) {
+                  const themedStylesAst = literalToAst(styles);
+                  return themedStylesAst.properties.forEach((_) => {
+                    const prop = _;
+                    prop.value.type === "StringLiteral" && (prop.value = t.memberExpression(
+                      t.identifier("theme"),
+                      t.identifier(prop.value.value.slice(1) + ".get()")
+                    ));
+                  }), themedStylesAst;
+                }
+                let hasDynamicStyle = !1;
+                for (const attr of props.attrs)
+                  switch (attr.type) {
+                    case "style": {
+                      let styleExpr = getStyleExpression(attr.value);
+                      addStyleExpression(styleExpr), options.experimentalFlattenThemesOnNative && addStyleExpression(styleExpr, !0);
+                      break;
+                    }
+                    case "ternary": {
+                      const { consequent, alternate } = attr.value, consExpr = getStyleExpression(consequent), altExpr = getStyleExpression(alternate);
+                      options.experimentalFlattenThemesOnNative && (expressions.push(attr.value.test), addStyleExpression(
+                        t.conditionalExpression(
+                          t.identifier(`_expressions[${expressions.length - 1}]`),
+                          consExpr || t.nullLiteral(),
+                          altExpr || t.nullLiteral()
+                        ),
+                        !0
+                      ));
+                      const styleExpr = t.conditionalExpression(
+                        attr.value.test,
+                        consExpr || t.nullLiteral(),
+                        altExpr || t.nullLiteral()
+                      );
+                      addStyleExpression(
+                        styleExpr
+                        // TODO: what is this for ?
+                        // isFlattened ? simpleHash(JSON.stringify({ consequent, alternate })) : undefined
+                      );
+                      break;
+                    }
+                    case "dynamic-style": {
+                      hasDynamicStyle = !0, expressions.push(attr.value), options.experimentalFlattenDynamicValues ? addStyleExpression(
+                        t.objectExpression([
+                          t.objectProperty(
+                            t.identifier(attr.name),
+                            t.identifier(`_expressions[${expressions.length - 1}]`)
+                          )
+                        ]),
+                        !0
+                      ) : addStyleExpression(
+                        t.objectExpression([
+                          t.objectProperty(
+                            t.identifier(attr.name),
+                            attr.value
+                          )
+                        ])
+                      );
+                      break;
+                    }
+                    case "attr": {
+                      t.isJSXSpreadAttribute(attr.value) && isSimpleSpread(attr.value) && (stylesExpr.elements.push(
+                        t.memberExpression(attr.value.argument, t.identifier("style"))
+                      ), options.experimentalFlattenThemesOnNative && hocStylesExpr.elements.push(
+                        t.memberExpression(
+                          attr.value.argument,
+                          t.identifier("style")
+                        )
+                      )), finalAttrs.push(attr.value);
+                      break;
+                    }
+                  }
+                if (props.node.attributes = finalAttrs, props.isFlattened)
+                  if (options.experimentalFlattenThemesOnNative && (themeKeysUsed.size || hocStylesExpr.elements.length > 1 || hasDynamicStyle)) {
+                    hasImportedViewWrapper || (root.unshiftContainer("body", importWithStyle()), hasImportedViewWrapper = !0);
+                    const name = props.node.name.name, WrapperIdentifier = root.scope.generateUidIdentifier(
+                      name + "Wrapper"
+                    );
+                    root.pushContainer(
+                      "body",
+                      t.variableDeclaration("const", [
+                        t.variableDeclarator(
+                          WrapperIdentifier,
+                          t.callExpression(t.identifier("__withStableStyle"), [
+                            t.identifier(name),
+                            t.arrowFunctionExpression(
+                              [t.identifier("theme"), t.identifier("_expressions")],
+                              t.blockStatement([
+                                t.returnStatement(
+                                  t.callExpression(
+                                    t.memberExpression(
+                                      t.identifier("React"),
+                                      t.identifier("useMemo")
+                                    ),
+                                    [
+                                      t.arrowFunctionExpression(
+                                        [],
+                                        t.blockStatement([
+                                          t.returnStatement(
+                                            t.arrayExpression([...hocStylesExpr.elements])
+                                          )
+                                        ])
+                                      ),
+                                      t.arrayExpression([
+                                        t.spreadElement(t.identifier("_expressions"))
+                                      ])
+                                    ]
+                                  )
+                                )
+                              ])
+                            )
+                          ])
+                        )
+                      ])
+                    ), props.node.name = WrapperIdentifier, props.jsxPath.node.closingElement && (props.jsxPath.node.closingElement.name = WrapperIdentifier), expressions.length && props.node.attributes.push(
+                      t.jsxAttribute(
+                        t.jsxIdentifier("expressions"),
+                        t.jsxExpressionContainer(t.arrayExpression(expressions))
+                      )
+                    );
+                  } else
+                    props.node.attributes.push(
+                      t.jsxAttribute(
+                        t.jsxIdentifier("style"),
+                        t.jsxExpressionContainer(
+                          stylesExpr.elements.length === 1 ? stylesExpr.elements[0] : stylesExpr
+                        )
+                      )
+                    );
+              }
+            });
+          } catch (err) {
+            if (err instanceof Error) {
+              let message = `${shouldPrintDebug === "verbose" ? err : err.message}`;
+              message.includes("Unexpected return value from visitor method") && (message = "Unexpected return value from visitor method"), console.warn("Error in Tamagui parse, skipping", message, err.stack);
+              return;
+            }
+          }
+          if (!Object.keys(sheetStyles).length) {
+            shouldPrintDebug && console.info("END no styles"), res && printLog(res);
+            return;
+          }
+          const sheetObject = literalToAst(sheetStyles), sheetOuter = template(
+            "const SHEET = __ReactNativeStyleSheet.create(null)"
+          )({
+            SHEET: sheetIdentifier.name
+          });
+          sheetOuter.declarations[0].init.arguments[0] = sheetObject, root.unshiftContainer("body", sheetOuter), root.unshiftContainer("body", importStyleSheet()), shouldPrintDebug && (console.info(`
+ -------- output code ------- 
+`), console.info(
+            generator(root.parent).code.split(`
+`).filter((x) => !x.startsWith("//")).join(`
+`)
+          )), res && printLog(res);
+        }
+      }
+    }
+  };
+}
+function assertValidTag(node) {
+  node.attributes.find((x) => x.type === "JSXAttribute" && x.name.name === "style") && process.env.DEBUG?.startsWith("tamagui") && console.warn("\u26A0\uFE0F Cannot pass style attribute to extracted style");
+}
+function splitThemeStyles(style) {
+  const themed = {}, plain = {};
+  let noTheme = !0;
+  for (const key in style) {
+    const val = style[key];
+    val && val[0] === "$" ? (themed[key] = val, noTheme = !1) : plain[key] = val;
+  }
+  return { themed: noTheme ? null : themed, plain };
+}
+export {
+  extractToNative,
+  getBabelParseDefinition,
+  getBabelPlugin
+};
+//# sourceMappingURL=extractToNative.js.map

package/dist/esm/extractor/extractToNative.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../../src/extractor/extractToNative.ts"],
+  "mappings": "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",
+  "names": []
+}

package/dist/esm/extractor/extractToNative.mjs

@@ -0,0 +1,232 @@
+import { basename } from "node:path";
+import { transformFromAstSync } from "@babel/core";
+import generator from "@babel/generator";
+import { declare } from "@babel/helper-plugin-utils";
+import { parse } from "@babel/parser";
+import template from "@babel/template";
+import * as t from "@babel/types";
+import { createExtractor, createLogger, getPragmaOptions, isSimpleSpread, literalToAst, loadTamaguiBuildConfigSync } from "@tamagui/static";
+const importNativeView = template(`
+const __ReactNativeView = require('react-native').View;
+const __ReactNativeText = require('react-native').Text;
+`),
+  importStyleSheet = template(`
+const __ReactNativeStyleSheet = require('react-native').StyleSheet;
+`),
+  importWithStyle = template(`
+const __withStableStyle = require('@tamagui/core')._withStableStyle;
+`),
+  extractor = createExtractor({
+    platform: "native"
+  });
+let tamaguiBuildOptionsLoaded;
+function extractToNative(sourceFileName, sourceCode, options) {
+  const ast = parse(sourceCode, {
+      sourceType: "module",
+      plugins: ["jsx", "typescript"]
+    }),
+    babelPlugin = getBabelPlugin(),
+    out = transformFromAstSync(ast, sourceCode, {
+      plugins: [[babelPlugin, options]],
+      configFile: !1,
+      sourceFileName,
+      filename: sourceFileName
+    });
+  if (!out) throw new Error("No output returned");
+  return out;
+}
+function getBabelPlugin() {
+  return declare((api, options) => (api.assertVersion(7), getBabelParseDefinition(options)));
+}
+function getBabelParseDefinition(options) {
+  return {
+    name: "tamagui",
+    visitor: {
+      Program: {
+        enter(root) {
+          let sourcePath = this.file.opts.filename;
+          if (sourcePath?.includes("node_modules") || !sourcePath?.endsWith(".jsx") && !sourcePath?.endsWith(".tsx")) return;
+          process.env.SOURCE_ROOT?.endsWith("ios") && (sourcePath = sourcePath.replace("/ios", ""));
+          let hasImportedView = !1,
+            hasImportedViewWrapper = !1;
+          const sheetStyles = {},
+            sheetIdentifier = root.scope.generateUidIdentifier("sheet"),
+            firstCommentContents =
+            // join because you can join together multiple pragmas
+            root.node.body[0]?.leadingComments?.map(comment => comment?.value || " ").join(" ") ?? "",
+            firstComment = firstCommentContents ? `//${firstCommentContents}` : "",
+            {
+              shouldPrintDebug,
+              shouldDisable
+            } = getPragmaOptions({
+              source: firstComment,
+              path: sourcePath
+            });
+          if (shouldDisable) return;
+          !options.config && !options.components && (tamaguiBuildOptionsLoaded ||= loadTamaguiBuildConfigSync({}));
+          const finalOptions = {
+              // @ts-ignore just in case they leave it out
+              platform: "native",
+              ...tamaguiBuildOptionsLoaded,
+              ...options
+            },
+            printLog = createLogger(sourcePath, finalOptions);
+          function addSheetStyle(style, node) {
+            let key = `${`${Object.keys(sheetStyles).length}`}`;
+            if (process.env.NODE_ENV === "development") {
+              const lineNumbers = node.loc ? node.loc.start.line + (node.loc.start.line !== node.loc.end.line ? `-${node.loc.end.line}` : "") : "";
+              key += `:${basename(sourcePath)}:${lineNumbers}`;
+            }
+            return sheetStyles[key] = style, readStyleExpr(key);
+          }
+          function readStyleExpr(key) {
+            return template("SHEET['KEY']")({
+              SHEET: sheetIdentifier.name,
+              KEY: key
+            }).expression;
+          }
+          let res;
+          try {
+            res = extractor.parseSync(root, {
+              importsWhitelist: ["constants.js", "colors.js"],
+              extractStyledDefinitions: options.forceExtractStyleDefinitions,
+              excludeProps: /* @__PURE__ */new Set(["className", "userSelect", "whiteSpace", "textOverflow", "cursor", "contain"]),
+              shouldPrintDebug,
+              ...finalOptions,
+              // disable this extraction for now at least, need to figure out merging theme vs non-theme
+              // because theme need to stay in render(), whereas non-theme can be extracted
+              // for now just turn it off entirely at a small perf loss
+              disableExtractInlineMedia: !0,
+              // disable extracting variables as no native concept of them (only theme values)
+              disableExtractVariables: options.experimentalFlattenThemesOnNative ? !1 : "theme",
+              sourcePath,
+              // disabling flattening for now
+              // it's flattening a plain <Paragraph>hello</Paragraph> which breaks things because themes
+              // thinking it's not really worth the effort to do much compilation on native
+              // for now just disable flatten as it can only run in narrow places on native
+              // disableFlattening: 'styled',
+              getFlattenedNode({
+                isTextView
+              }) {
+                return hasImportedView || (hasImportedView = !0, root.unshiftContainer("body", importNativeView())), isTextView ? "__ReactNativeText" : "__ReactNativeView";
+              },
+              onExtractTag(props) {
+                const {
+                  isFlattened
+                } = props;
+                if (!isFlattened) return;
+                assertValidTag(props.node);
+                const stylesExpr = t.arrayExpression([]),
+                  hocStylesExpr = t.arrayExpression([]),
+                  expressions = [],
+                  finalAttrs = [],
+                  themeKeysUsed = /* @__PURE__ */new Set();
+                function getStyleExpression(style) {
+                  if (!style) return;
+                  const {
+                    plain,
+                    themed
+                  } = splitThemeStyles(style);
+                  let themeExpr = null;
+                  if (themed && options.experimentalFlattenThemesOnNative) {
+                    for (const key in themed) themeKeysUsed.add(themed[key].split("$")[1]);
+                    themeExpr = getThemedStyleExpression(themed);
+                  }
+                  const ident = addSheetStyle(plain, props.node);
+                  return themeExpr ? (addStyleExpression(ident), addStyleExpression(ident, !0), themeExpr) : ident;
+                }
+                function addStyleExpression(expr, HOC = !1) {
+                  Array.isArray(expr) ? (HOC ? hocStylesExpr : stylesExpr).elements.push(...expr) : (HOC ? hocStylesExpr : stylesExpr).elements.push(expr);
+                }
+                function getThemedStyleExpression(styles) {
+                  const themedStylesAst = literalToAst(styles);
+                  return themedStylesAst.properties.forEach(_ => {
+                    const prop = _;
+                    prop.value.type === "StringLiteral" && (prop.value = t.memberExpression(t.identifier("theme"), t.identifier(prop.value.value.slice(1) + ".get()")));
+                  }), themedStylesAst;
+                }
+                let hasDynamicStyle = !1;
+                for (const attr of props.attrs) switch (attr.type) {
+                  case "style":
+                    {
+                      let styleExpr = getStyleExpression(attr.value);
+                      addStyleExpression(styleExpr), options.experimentalFlattenThemesOnNative && addStyleExpression(styleExpr, !0);
+                      break;
+                    }
+                  case "ternary":
+                    {
+                      const {
+                          consequent,
+                          alternate
+                        } = attr.value,
+                        consExpr = getStyleExpression(consequent),
+                        altExpr = getStyleExpression(alternate);
+                      options.experimentalFlattenThemesOnNative && (expressions.push(attr.value.test), addStyleExpression(t.conditionalExpression(t.identifier(`_expressions[${expressions.length - 1}]`), consExpr || t.nullLiteral(), altExpr || t.nullLiteral()), !0));
+                      const styleExpr = t.conditionalExpression(attr.value.test, consExpr || t.nullLiteral(), altExpr || t.nullLiteral());
+                      addStyleExpression(styleExpr
+                      // TODO: what is this for ?
+                      // isFlattened ? simpleHash(JSON.stringify({ consequent, alternate })) : undefined
+                      );
+                      break;
+                    }
+                  case "dynamic-style":
+                    {
+                      hasDynamicStyle = !0, expressions.push(attr.value), options.experimentalFlattenDynamicValues ? addStyleExpression(t.objectExpression([t.objectProperty(t.identifier(attr.name), t.identifier(`_expressions[${expressions.length - 1}]`))]), !0) : addStyleExpression(t.objectExpression([t.objectProperty(t.identifier(attr.name), attr.value)]));
+                      break;
+                    }
+                  case "attr":
+                    {
+                      t.isJSXSpreadAttribute(attr.value) && isSimpleSpread(attr.value) && (stylesExpr.elements.push(t.memberExpression(attr.value.argument, t.identifier("style"))), options.experimentalFlattenThemesOnNative && hocStylesExpr.elements.push(t.memberExpression(attr.value.argument, t.identifier("style")))), finalAttrs.push(attr.value);
+                      break;
+                    }
+                }
+                if (props.node.attributes = finalAttrs, props.isFlattened) if (options.experimentalFlattenThemesOnNative && (themeKeysUsed.size || hocStylesExpr.elements.length > 1 || hasDynamicStyle)) {
+                  hasImportedViewWrapper || (root.unshiftContainer("body", importWithStyle()), hasImportedViewWrapper = !0);
+                  const name = props.node.name.name,
+                    WrapperIdentifier = root.scope.generateUidIdentifier(name + "Wrapper");
+                  root.pushContainer("body", t.variableDeclaration("const", [t.variableDeclarator(WrapperIdentifier, t.callExpression(t.identifier("__withStableStyle"), [t.identifier(name), t.arrowFunctionExpression([t.identifier("theme"), t.identifier("_expressions")], t.blockStatement([t.returnStatement(t.callExpression(t.memberExpression(t.identifier("React"), t.identifier("useMemo")), [t.arrowFunctionExpression([], t.blockStatement([t.returnStatement(t.arrayExpression([...hocStylesExpr.elements]))])), t.arrayExpression([t.spreadElement(t.identifier("_expressions"))])]))]))]))])), props.node.name = WrapperIdentifier, props.jsxPath.node.closingElement && (props.jsxPath.node.closingElement.name = WrapperIdentifier), expressions.length && props.node.attributes.push(t.jsxAttribute(t.jsxIdentifier("expressions"), t.jsxExpressionContainer(t.arrayExpression(expressions))));
+                } else props.node.attributes.push(t.jsxAttribute(t.jsxIdentifier("style"), t.jsxExpressionContainer(stylesExpr.elements.length === 1 ? stylesExpr.elements[0] : stylesExpr)));
+              }
+            });
+          } catch (err) {
+            if (err instanceof Error) {
+              let message = `${shouldPrintDebug === "verbose" ? err : err.message}`;
+              message.includes("Unexpected return value from visitor method") && (message = "Unexpected return value from visitor method"), console.warn("Error in Tamagui parse, skipping", message, err.stack);
+              return;
+            }
+          }
+          if (!Object.keys(sheetStyles).length) {
+            shouldPrintDebug && console.info("END no styles"), res && printLog(res);
+            return;
+          }
+          const sheetObject = literalToAst(sheetStyles),
+            sheetOuter = template("const SHEET = __ReactNativeStyleSheet.create(null)")({
+              SHEET: sheetIdentifier.name
+            });
+          sheetOuter.declarations[0].init.arguments[0] = sheetObject, root.unshiftContainer("body", sheetOuter), root.unshiftContainer("body", importStyleSheet()), shouldPrintDebug && (console.info(`
+ -------- output code ------- 
+`), console.info(generator(root.parent).code.split(`
+`).filter(x => !x.startsWith("//")).join(`
+`))), res && printLog(res);
+        }
+      }
+    }
+  };
+}
+function assertValidTag(node) {
+  node.attributes.find(x => x.type === "JSXAttribute" && x.name.name === "style") && process.env.DEBUG?.startsWith("tamagui") && console.warn("\u26A0\uFE0F Cannot pass style attribute to extracted style");
+}
+function splitThemeStyles(style) {
+  const themed = {},
+    plain = {};
+  let noTheme = !0;
+  for (const key in style) {
+    const val = style[key];
+    val && val[0] === "$" ? (themed[key] = val, noTheme = !1) : plain[key] = val;
+  }
+  return {
+    themed: noTheme ? null : themed,
+    plain
+  };
+}
+export { extractToNative, getBabelParseDefinition, getBabelPlugin };