@tamagui/static 1.0.0-alpha.0

package/README.md

@@ -0,0 +1,21 @@
+- onPress extraction
+- bug with props after spread not applying, make them deopt:
+  - <YStack {...baseStyle} cursor="default" /> wont be right rn
+- have seen bugs with <Spacer flex /> and <YStack fullscreen />
+- make pressStyle override hoverStyle always
+- activeStyle may be desirable...
+- <Image /> // harder than seems RN does some werid stuff with cover/etc
+- space
+  - SmallButton good example case of constant
+- hoverStyle/pressStyle (spread + constant too - TagButton, DishView)
+  - final step is hoverStyle={{ color: x, ...parent.hoverStyle, }}
+- pass in config to be able to create static extracted easily within web
+  - OverlayLinkButton
+- SmallCircleButton case spreads
+- Circle, EmojiButton, LinearGradient, VoteButton
+- LinkButton - getting this to just extract styles would be big
+  - just needs to tell compiler _never_ to go to just <div />
+- onPressIn/onPressOut etc can all be converted to inline functions still as divs (HomeAutocompleteBackground, SearchLocationButton, etc)
+- // TODO WHY SCALE NOT WORKING???
+- Link - can maybe fully extract, if we can just run the actual component and then return the results???
+- CSS variables for color!

package/dist/constants.js

@@ -0,0 +1,10 @@
+import findCacheDir from "find-cache-dir";
+const CSS_FILE_NAME = "__snack.css";
+const MEDIA_SEP = "_";
+const cacheDir = findCacheDir({ name: "tamagui", create: true });
+export {
+  CSS_FILE_NAME,
+  MEDIA_SEP,
+  cacheDir
+};
+//# sourceMappingURL=constants.js.map

package/dist/constants.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/constants.ts"],
+  "sourcesContent": ["import findCacheDir from 'find-cache-dir'\n\nexport const CSS_FILE_NAME = '__snack.css'\n\n// ENSURE THIS ISNT THE SAME AS THE SEPARATOR USED FOR STYLE KEYS\n// SEE matching one in concatClassName\nexport const MEDIA_SEP = '_'\n\n// ensure cache dir\nexport const cacheDir = findCacheDir({ name: 'tamagui', create: true })\n"],
+  "mappings": "AAAA;AAEO,MAAM,gBAAgB;AAItB,MAAM,YAAY;AAGlB,MAAM,WAAW,aAAa,EAAE,MAAM,WAAW,QAAQ;",
+  "names": []
+}

package/dist/extractor/accessSafe.js

@@ -0,0 +1,11 @@
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+import * as t from "@babel/types";
+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");
+export {
+  accessSafe
+};
+//# sourceMappingURL=accessSafe.js.map

package/dist/extractor/accessSafe.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/extractor/accessSafe.ts"],
+  "sourcesContent": ["import * as t from '@babel/types'\n\n// accessSafe wraps memberExpressions in object/null checks\n// TODO: inject this as a function? this gets pretty repetitive\nexport function accessSafe(obj: t.Expression, member: string): t.LogicalExpression {\n  return t.logicalExpression(\n    '&&',\n    t.logicalExpression(\n      '&&',\n      // typeof obj === 'object\n      t.binaryExpression('===', t.unaryExpression('typeof', obj), t.stringLiteral('object')),\n      // obj !== null\n      t.binaryExpression('!==', obj, t.nullLiteral())\n    ),\n    // obj.member\n    t.memberExpression(obj, t.identifier(member), false)\n  )\n}\n"],
+  "mappings": ";;AAAA;AAIO,oBAAoB,KAAmB,QAAqC;AACjF,SAAO,EAAE,kBACP,MACA,EAAE,kBACA,MAEA,EAAE,iBAAiB,OAAO,EAAE,gBAAgB,UAAU,MAAM,EAAE,cAAc,YAE5E,EAAE,iBAAiB,OAAO,KAAK,EAAE,iBAGnC,EAAE,iBAAiB,KAAK,EAAE,WAAW,SAAS;AAAA;AAXlC;",
+  "names": []
+}

package/dist/extractor/babelParse.js

@@ -0,0 +1,30 @@
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+import * as babelParser from "@babel/parser";
+const parserOptions = Object.freeze({
+  plugins: [
+    "asyncGenerators",
+    "classProperties",
+    "dynamicImport",
+    "functionBind",
+    "jsx",
+    "numericSeparator",
+    "objectRestSpread",
+    "optionalCatchBinding",
+    "decorators-legacy",
+    "typescript",
+    "optionalChaining",
+    "nullishCoalescingOperator"
+  ],
+  sourceType: "module"
+});
+const parser = babelParser.parse.bind(babelParser);
+function babelParse(code) {
+  return parser(code.toString(), parserOptions);
+}
+__name(babelParse, "babelParse");
+export {
+  babelParse,
+  parserOptions
+};
+//# sourceMappingURL=babelParse.js.map

package/dist/extractor/babelParse.js.map

@@ -0,0 +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;AAEO,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;AAAA,EAIF,YAAY;AAAA;AAGd,MAAM,SAAS,YAAY,MAAM,KAAK;AAE/B,oBAAoB,MAA4B;AACrD,SAAO,OAAO,KAAK,YAAY;AAAA;AADjB;",
+  "names": []
+}

package/dist/extractor/buildClassName.js

@@ -0,0 +1,40 @@
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+import * as t from "@babel/types";
+function buildClassName(classNameObjects) {
+  return classNameObjects.reduce((acc, val) => {
+    if (acc == null) {
+      if (t.isConditionalExpression(val) || t.isStringLiteral(val) || t.isNumericLiteral(val)) {
+        return val;
+      }
+      return t.logicalExpression("||", val, t.stringLiteral(""));
+    }
+    let inner;
+    if (t.isStringLiteral(val)) {
+      if (t.isStringLiteral(acc)) {
+        return t.stringLiteral(`${acc.value} ${val.value}`);
+      }
+      inner = t.stringLiteral(` ${val.value}`);
+    } else if (t.isLiteral(val)) {
+      inner = t.binaryExpression("+", t.stringLiteral(" "), val);
+    } else if (t.isConditionalExpression(val) || t.isBinaryExpression(val)) {
+      if (t.isStringLiteral(acc)) {
+        return t.binaryExpression("+", t.stringLiteral(`${acc.value} `), val);
+      }
+      inner = t.binaryExpression("+", t.stringLiteral(" "), val);
+    } else if (t.isIdentifier(val) || t.isMemberExpression(val)) {
+      inner = t.conditionalExpression(val, t.binaryExpression("+", t.stringLiteral(" "), val), t.stringLiteral(""));
+    } else {
+      if (t.isStringLiteral(acc)) {
+        return t.binaryExpression("+", t.stringLiteral(`${acc.value} `), t.logicalExpression("||", val, t.stringLiteral("")));
+      }
+      inner = t.binaryExpression("+", t.stringLiteral(" "), t.logicalExpression("||", val, t.stringLiteral("")));
+    }
+    return t.binaryExpression("+", acc, inner);
+  }, null);
+}
+__name(buildClassName, "buildClassName");
+export {
+  buildClassName
+};
+//# sourceMappingURL=buildClassName.js.map

package/dist/extractor/buildClassName.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/extractor/buildClassName.ts"],
+  "sourcesContent": ["import * as t from '@babel/types'\n\nimport { ClassNameObject } from '../types'\n\nexport function buildClassName(\n  classNameObjects: ClassNameObject[]\n): t.Expression | t.StringLiteral | null {\n  return classNameObjects.reduce<t.Expression | null>((acc, val) => {\n    if (acc == null) {\n      if (\n        // pass conditional expressions through\n        t.isConditionalExpression(val) ||\n        // pass non-null literals through\n        t.isStringLiteral(val) ||\n        t.isNumericLiteral(val)\n      ) {\n        return val\n      }\n      return t.logicalExpression('||', val, t.stringLiteral(''))\n    }\n\n    let inner: t.Expression\n    if (t.isStringLiteral(val)) {\n      if (t.isStringLiteral(acc)) {\n        // join adjacent string literals\n        return t.stringLiteral(`${acc.value} ${val.value}`)\n      }\n      inner = t.stringLiteral(` ${val.value}`)\n    } else if (t.isLiteral(val)) {\n      inner = t.binaryExpression('+', t.stringLiteral(' '), val)\n    } else if (t.isConditionalExpression(val) || t.isBinaryExpression(val)) {\n      if (t.isStringLiteral(acc)) {\n        return t.binaryExpression('+', t.stringLiteral(`${acc.value} `), val)\n      }\n      inner = t.binaryExpression('+', t.stringLiteral(' '), val)\n    } else if (t.isIdentifier(val) || t.isMemberExpression(val)) {\n      // identifiers and member expressions make for reasonable ternaries\n      inner = t.conditionalExpression(\n        val,\n        t.binaryExpression('+', t.stringLiteral(' '), val),\n        t.stringLiteral('')\n      )\n    } else {\n      if (t.isStringLiteral(acc)) {\n        return t.binaryExpression(\n          '+',\n          t.stringLiteral(`${acc.value} `),\n          t.logicalExpression('||', val, t.stringLiteral(''))\n        )\n      }\n      // use a logical expression for more complex prop values\n      inner = t.binaryExpression(\n        '+',\n        t.stringLiteral(' '),\n        t.logicalExpression('||', val, t.stringLiteral(''))\n      )\n    }\n\n    return t.binaryExpression('+', acc, inner)\n  }, null)\n}\n"],
+  "mappings": ";;AAAA;AAIO,wBACL,kBACuC;AACvC,SAAO,iBAAiB,OAA4B,CAAC,KAAK,QAAQ;AAChE,QAAI,OAAO,MAAM;AACf,UAEE,EAAE,wBAAwB,QAE1B,EAAE,gBAAgB,QAClB,EAAE,iBAAiB,MACnB;AACA,eAAO;AAAA;AAET,aAAO,EAAE,kBAAkB,MAAM,KAAK,EAAE,cAAc;AAAA;AAGxD,QAAI;AACJ,QAAI,EAAE,gBAAgB,MAAM;AAC1B,UAAI,EAAE,gBAAgB,MAAM;AAE1B,eAAO,EAAE,cAAc,GAAG,IAAI,SAAS,IAAI;AAAA;AAE7C,cAAQ,EAAE,cAAc,IAAI,IAAI;AAAA,eACvB,EAAE,UAAU,MAAM;AAC3B,cAAQ,EAAE,iBAAiB,KAAK,EAAE,cAAc,MAAM;AAAA,eAC7C,EAAE,wBAAwB,QAAQ,EAAE,mBAAmB,MAAM;AACtE,UAAI,EAAE,gBAAgB,MAAM;AAC1B,eAAO,EAAE,iBAAiB,KAAK,EAAE,cAAc,GAAG,IAAI,WAAW;AAAA;AAEnE,cAAQ,EAAE,iBAAiB,KAAK,EAAE,cAAc,MAAM;AAAA,eAC7C,EAAE,aAAa,QAAQ,EAAE,mBAAmB,MAAM;AAE3D,cAAQ,EAAE,sBACR,KACA,EAAE,iBAAiB,KAAK,EAAE,cAAc,MAAM,MAC9C,EAAE,cAAc;AAAA,WAEb;AACL,UAAI,EAAE,gBAAgB,MAAM;AAC1B,eAAO,EAAE,iBACP,KACA,EAAE,cAAc,GAAG,IAAI,WACvB,EAAE,kBAAkB,MAAM,KAAK,EAAE,cAAc;AAAA;AAInD,cAAQ,EAAE,iBACR,KACA,EAAE,cAAc,MAChB,EAAE,kBAAkB,MAAM,KAAK,EAAE,cAAc;AAAA;AAInD,WAAO,EAAE,iBAAiB,KAAK,KAAK;AAAA,KACnC;AAAA;AAvDW;",
+  "names": []
+}

package/dist/extractor/createEvaluator.js

@@ -0,0 +1,51 @@
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+import vm from "vm";
+import generate from "@babel/generator";
+import * as t from "@babel/types";
+import { FAILED_EVAL } from "./createExtractor";
+import { evaluateAstNode } from "./evaluateAstNode";
+import { isValidThemeHook } from "./extractHelpers";
+function createEvaluator({
+  tamaguiConfig,
+  staticNamespace,
+  sourcePath,
+  traversePath,
+  shouldPrintDebug
+}) {
+  const evalFn = /* @__PURE__ */ __name((n) => {
+    if (t.isMemberExpression(n) && t.isIdentifier(n.property) && isValidThemeHook(traversePath, n, sourcePath)) {
+      const key = n.property.name;
+      if (shouldPrintDebug) {
+        console.log("    > found theme prop", key);
+      }
+      console.log("SHOULD FIND THEME (NESTED NOW)", key);
+      return `var(--${key})`;
+    }
+    if (t.isIdentifier(n) && staticNamespace.hasOwnProperty(n.name)) {
+      return staticNamespace[n.name];
+    }
+    const evalContext = vm.createContext(staticNamespace);
+    const code = `(${generate(n).code})`;
+    return vm.runInContext(code, evalContext);
+  }, "evalFn");
+  return (n) => {
+    return evaluateAstNode(n, evalFn);
+  };
+}
+__name(createEvaluator, "createEvaluator");
+function createSafeEvaluator(attemptEval) {
+  return (n) => {
+    try {
+      return attemptEval(n);
+    } catch (err) {
+      return FAILED_EVAL;
+    }
+  };
+}
+__name(createSafeEvaluator, "createSafeEvaluator");
+export {
+  createEvaluator,
+  createSafeEvaluator
+};
+//# sourceMappingURL=createEvaluator.js.map

package/dist/extractor/createEvaluator.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/extractor/createEvaluator.ts"],
+  "sourcesContent": ["import vm from 'vm'\n\nimport generate from '@babel/generator'\nimport { NodePath } from '@babel/traverse'\nimport * as t from '@babel/types'\nimport type { TamaguiConfig } from '@tamagui/core'\n\nimport { FAILED_EVAL } from './createExtractor'\nimport { evaluateAstNode } from './evaluateAstNode'\nimport { isValidThemeHook } from './extractHelpers'\n\nexport function createEvaluator({\n  tamaguiConfig,\n  staticNamespace,\n  sourcePath,\n  traversePath,\n  shouldPrintDebug,\n}: {\n  tamaguiConfig: TamaguiConfig\n  staticNamespace: Record<string, any>\n  sourcePath: string\n  traversePath: NodePath<t.JSXElement>\n  shouldPrintDebug: boolean\n}) {\n  // called when evaluateAstNode encounters a dynamic-looking prop\n  const evalFn = (n: t.Node) => {\n    // themes\n    if (\n      t.isMemberExpression(n) &&\n      t.isIdentifier(n.property) &&\n      isValidThemeHook(traversePath, n, sourcePath)\n    ) {\n      const key = n.property.name\n      if (shouldPrintDebug) {\n        console.log('    > found theme prop', key)\n      }\n      console.log('SHOULD FIND THEME (NESTED NOW)', key) // tamaguiConfig.themes)\n      // if (!themeKeys.has(key)) {\n      //   throw new Error(`    > accessing non-existent theme key: ${key}`)\n      // }\n      return `var(--${key})`\n    }\n    // variable\n    if (t.isIdentifier(n) && staticNamespace.hasOwnProperty(n.name)) {\n      return staticNamespace[n.name]\n    }\n    const evalContext = vm.createContext(staticNamespace)\n    const code = `(${generate(n as any).code})`\n    // if (shouldPrintDebug) {\n    //   console.log('evaluating', { n, code, evalContext })\n    // }\n    return vm.runInContext(code, evalContext)\n  }\n\n  return (n: t.Node) => {\n    return evaluateAstNode(n, evalFn)\n  }\n}\n\nexport function createSafeEvaluator(attemptEval: (n: t.Node) => any) {\n  return (n: t.Node) => {\n    try {\n      return attemptEval(n)\n    } catch (err) {\n      return FAILED_EVAL\n    }\n  }\n}\n"],
+  "mappings": ";;AAAA;AAEA;AAEA;AAGA;AACA;AACA;AAEO,yBAAyB;AAAA,EAC9B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,GAOC;AAED,QAAM,SAAS,wBAAC,MAAc;AAE5B,QACE,EAAE,mBAAmB,MACrB,EAAE,aAAa,EAAE,aACjB,iBAAiB,cAAc,GAAG,aAClC;AACA,YAAM,MAAM,EAAE,SAAS;AACvB,UAAI,kBAAkB;AACpB,gBAAQ,IAAI,0BAA0B;AAAA;AAExC,cAAQ,IAAI,kCAAkC;AAI9C,aAAO,SAAS;AAAA;AAGlB,QAAI,EAAE,aAAa,MAAM,gBAAgB,eAAe,EAAE,OAAO;AAC/D,aAAO,gBAAgB,EAAE;AAAA;AAE3B,UAAM,cAAc,GAAG,cAAc;AACrC,UAAM,OAAO,IAAI,SAAS,GAAU;AAIpC,WAAO,GAAG,aAAa,MAAM;AAAA,KA1BhB;AA6Bf,SAAO,CAAC,MAAc;AACpB,WAAO,gBAAgB,GAAG;AAAA;AAAA;AA5Cd;AAgDT,6BAA6B,aAAiC;AACnE,SAAO,CAAC,MAAc;AACpB,QAAI;AACF,aAAO,YAAY;AAAA,aACZ,KAAP;AACA,aAAO;AAAA;AAAA;AAAA;AALG;",
+  "names": []
+}