@stylexjs/babel-plugin 0.5.0-alpha.3 → 0.5.0

package/lib/index.js

@@ -30,6 +30,7 @@ var name = "@stylexjs/stylex";
 
 const defaultMessage = expected => (value, name) => name ? `Expected (${name}) to be ${expected}, but got \`${JSON.stringify(value)}\`.` : expected;
 const defaultUnionMessage = expected => (value, name) => name ? `Expected (${name}) to be ${expected}` : expected;
+const defaultObjectMessage = expected => (value, name) => name ? `Expected (${name}) to be ${expected} but:` : expected;
 const indent = str => str.split('\n').filter(line => !line.trim().startsWith('But got:')).map(line => line.includes(', but got') ? line.replace(/, but got.+$/, '') : line).map(line => line.trim()[0] === '-' ? line : `- ${line}`).map(line => `\n\t${line}`).join('');
 const string = function () {
   let message = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : defaultMessage('a string');
@@ -104,6 +105,23 @@ const object = function (shape) {
     return result;
   };
 };
+const objectOf = function (check) {
+  let message = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : defaultObjectMessage('an object');
+  return (value, name) => {
+    if (typeof value !== 'object' || value == null) {
+      return new Error(message(value, name));
+    }
+    const result = {};
+    for (const key in value) {
+      const item = check(value[key], name ? `${name}.${key}` : `With the key '${key}':`);
+      if (item instanceof Error) {
+        return new Error(`${message(value, name)}${indent(item.message)}\nBut got: ${indent(JSON.stringify(value))}`);
+      }
+      result[key] = item;
+    }
+    return result;
+  };
+};
 const unionOf = function (a, b) {
   let message = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : defaultUnionMessage('one of');
   return (value, name) => {
@@ -145,6 +163,118 @@ const logAndDefault = (check, value, def, name) => {
   return result;
 };
 
+function isArrayExpression(path, props) {
+  return path.isArrayExpression(props);
+}
+function isArrowFunctionExpression(path, props) {
+  return path.isArrowFunctionExpression(props);
+}
+function isBinaryExpression(path, props) {
+  return path.isBinaryExpression(props);
+}
+function isBooleanLiteral(path, props) {
+  return path.isBooleanLiteral(props);
+}
+function isCallExpression(path, props) {
+  return path.isCallExpression(props);
+}
+function isClass(path, props) {
+  return path.isClass(props);
+}
+function isConditionalExpression(path, props) {
+  return path.isConditionalExpression(props);
+}
+function isExportDefaultDeclaration(path, props) {
+  return path.isExportDefaultDeclaration(props);
+}
+function isExportNamedDeclaration(path, props) {
+  return path.isExportNamedDeclaration(props);
+}
+function isExpression(path, props) {
+  return path.isExpression(props);
+}
+function isExpressionStatement(path, props) {
+  return path.isExpressionStatement(props);
+}
+function isExpressionWrapper(path, props) {
+  return path.isExpressionWrapper(props);
+}
+function isFunction(path, props) {
+  return path.isFunction(props);
+}
+function isIdentifier(path, props) {
+  return path.isIdentifier(props);
+}
+function isImportDeclaration(path, props) {
+  return path.isImportDeclaration(props);
+}
+function isImportDefaultSpecifier(path, props) {
+  return path.isImportDefaultSpecifier(props);
+}
+function isImportNamespaceSpecifier(path, props) {
+  return path.isImportNamespaceSpecifier(props);
+}
+function isImportSpecifier(path, props) {
+  return path.isImportSpecifier(props);
+}
+function isLogicalExpression(path, props) {
+  return path.isLogicalExpression(props);
+}
+function isMemberExpression(path, props) {
+  return path.isMemberExpression(props);
+}
+function isNullLiteral(path, props) {
+  return path.isNullLiteral(props);
+}
+function isNumericLiteral(path, props) {
+  return path.isNumericLiteral(props);
+}
+function isObjectExpression(path, props) {
+  return path.isObjectExpression(props);
+}
+function isObjectMethod(path, props) {
+  return path.isObjectMethod(props);
+}
+function isObjectProperty(path, props) {
+  return path.isObjectProperty(props);
+}
+function isProgram(path, props) {
+  return path.isProgram(props);
+}
+function isSequenceExpression(path, props) {
+  return path.isSequenceExpression(props);
+}
+function isSpreadElement(path, props) {
+  return path.isSpreadElement(props);
+}
+function isStatement(path, props) {
+  return path.isStatement(props);
+}
+function isStringLiteral(path, props) {
+  return path.isStringLiteral(props);
+}
+function isTSAsExpression(path, props) {
+  return path.isTSAsExpression(props);
+}
+function isTaggedTemplateExpression(path, props) {
+  return path.isTaggedTemplateExpression(props);
+}
+function isTemplateLiteral(path, props) {
+  return path.isTemplateLiteral(props);
+}
+function isUnaryExpression(path, props) {
+  return path.isUnaryExpression(props);
+}
+function isVariableDeclaration(path, props) {
+  return path.isVariableDeclaration(props);
+}
+function isVariableDeclarator(path, props) {
+  return path.isVariableDeclarator(props);
+}
+function isReferencedIdentifier(path, props) {
+  return path.isReferencedIdentifier(props);
+}
+
 const CheckModuleResolution = unionOf3(object({
   type: literal('commonJS'),
   rootDir: string(),
@@ -202,8 +332,16 @@ class StateManager {
     const styleResolution = logAndDefault(unionOf3(literal('application-order'), literal('property-specificity'), literal('legacy-expand-shorthands')), options.styleResolution ?? 'application-order', 'application-order', 'options.styleResolution');
     const unstable_moduleResolution = logAndDefault(unionOf(nullish(), CheckModuleResolution), options.unstable_moduleResolution, null, 'options.unstable_moduleResolution');
     const treeshakeCompensation = logAndDefault(boolean(), options.treeshakeCompensation ?? false, false, 'options.treeshakeCompensation');
+    const aliasesOption = logAndDefault(unionOf(nullish(), objectOf(unionOf(string(), array(string())))), options.aliases, null, 'options.aliases');
+    const aliases = aliasesOption == null ? aliasesOption : Object.fromEntries(Object.entries(aliasesOption).map(_ref => {
+      let [key, value] = _ref;
+      if (typeof value === 'string') {
+        return [key, [value]];
+      }
+      return [key, value];
+    }));
     const opts = {
-      ...options,
+      aliases,
       dev,
       test,
       runtimeInjection,
@@ -253,6 +391,56 @@ class StateManager {
       from: runInj
     } : runInj || null;
   }
+  addNamedImport(statementPath, as, from, options) {
+    const identifier = helperModuleImports.addNamed(statementPath, as, from, options);
+    const programPath = getProgramPath(statementPath);
+    if (programPath == null) {
+      return identifier;
+    }
+    const bodyPath = programPath.get('body');
+    let lastImportIndex = -1;
+    for (let i = 0; i < bodyPath.length; i++) {
+      const statement = bodyPath[i];
+      if (isImportDeclaration(statement)) {
+        lastImportIndex = i;
+      }
+    }
+    if (lastImportIndex === -1) {
+      return identifier;
+    }
+    const lastImport = bodyPath[lastImportIndex];
+    if (lastImport == null) {
+      return identifier;
+    }
+    const importName = statementPath.scope.generateUidIdentifier(as);
+    lastImport.insertAfter(t__namespace.variableDeclaration('var', [t__namespace.variableDeclarator(importName, identifier)]));
+    return importName;
+  }
+  addDefaultImport(statementPath, from, options) {
+    const identifier = helperModuleImports.addDefault(statementPath, from, options);
+    const programPath = getProgramPath(statementPath);
+    if (programPath == null) {
+      return identifier;
+    }
+    const bodyPath = programPath.get('body');
+    let lastImportIndex = -1;
+    for (let i = 0; i < bodyPath.length; i++) {
+      const statement = bodyPath[i];
+      if (isImportDeclaration(statement)) {
+        lastImportIndex = i;
+      }
+    }
+    if (lastImportIndex === -1) {
+      return identifier;
+    }
+    const lastImport = bodyPath[lastImportIndex];
+    if (lastImport == null) {
+      return identifier;
+    }
+    const importName = statementPath.scope.generateUidIdentifier('inject');
+    lastImport.insertAfter(t__namespace.variableDeclaration('var', [t__namespace.variableDeclarator(importName, identifier)]));
+    return importName;
+  }
   get isDev() {
     return !!this.options.dev;
   }
@@ -293,11 +481,12 @@ class StateManager {
       case 'commonJS':
         {
           const rootDir = this.options.unstable_moduleResolution.rootDir;
-          const themeFileExtension = this.options.unstable_moduleResolution.themeFileExtension ?? '.stylex';
+          const aliases = this.options.aliases;
+          const themeFileExtension = this.options.unstable_moduleResolution?.themeFileExtension ?? '.stylex';
           if (!matchesFileSuffix(themeFileExtension)(importPath)) {
             return false;
           }
-          const resolvedFilePath = filePathResolver(importPath, sourceFilePath);
+          const resolvedFilePath = filePathResolver(importPath, sourceFilePath, aliases);
           return resolvedFilePath ? ['themeNameRef', path.relative(rootDir, resolvedFilePath)] : false;
         }
       case 'haste':
@@ -310,11 +499,12 @@ class StateManager {
         }
       case 'experimental_crossFileParsing':
         {
+          const aliases = this.options.aliases;
           const themeFileExtension = this.options.unstable_moduleResolution.themeFileExtension ?? '.stylex';
           if (!matchesFileSuffix(themeFileExtension)(importPath)) {
             return false;
           }
-          const resolvedFilePath = filePathResolver(importPath, sourceFilePath);
+          const resolvedFilePath = filePathResolver(importPath, sourceFilePath, aliases);
           return resolvedFilePath ? ['filePath', resolvedFilePath] : false;
         }
       default:
@@ -328,25 +518,48 @@ class StateManager {
     this.styleVarsToKeep.add(memberExpression);
   }
 }
-const filePathResolver = (relativeFilePath, sourceFilePath) => {
-  const fileToLookFor = relativeFilePath;
-  if (EXTENSIONS.some(ext => fileToLookFor.endsWith(ext))) {
-    try {
-      const resolvedFilePath = require.resolve(fileToLookFor, {
-        paths: [path.dirname(sourceFilePath)]
-      });
-      return resolvedFilePath;
-    } catch {}
-  }
-  for (const ext of EXTENSIONS) {
-    try {
-      const importPathStr = fileToLookFor.startsWith('.') ? fileToLookFor + ext : fileToLookFor;
-      const resolvedFilePath = require.resolve(importPathStr, {
-        paths: [path.dirname(sourceFilePath)]
+function possibleAliasedPaths(importPath, aliases) {
+  const result = [importPath];
+  if (aliases == null || Object.keys(aliases).length === 0) {
+    return result;
+  }
+  for (const [alias, value] of Object.entries(aliases)) {
+    if (alias.includes('*')) {
+      const [before, after] = alias.split('*');
+      if (importPath.startsWith(before) && importPath.endsWith(after)) {
+        const replacementString = importPath.slice(before.length, after.length > 0 ? -after.length : undefined);
+        value.forEach(v => {
+          result.push(v.split('*').join(replacementString));
+        });
+      }
+    } else if (alias === importPath) {
+      value.forEach(v => {
+        result.push(v);
       });
-      return resolvedFilePath;
-    } catch {}
+    }
+  }
+  return result;
+}
+const filePathResolver = (relativeFilePath, sourceFilePath, aliases) => {
+  for (const ext of ['', ...EXTENSIONS]) {
+    const importPathStr = relativeFilePath + ext;
+    if (importPathStr.startsWith('.')) {
+      try {
+        return require.resolve(importPathStr, {
+          paths: [path.dirname(sourceFilePath)]
+        });
+      } catch {}
+    }
+    const allAliases = possibleAliasedPaths(importPathStr, aliases);
+    for (const possiblePath of allAliases) {
+      try {
+        return require.resolve(possiblePath, {
+          paths: [path.dirname(sourceFilePath)]
+        });
+      } catch {}
+    }
   }
+  return null;
 };
 const EXTENSIONS = ['.js', '.ts', '.tsx', '.jsx', '.mjs', '.cjs'];
 const addFileExtension = (importedFilePath, sourceFile) => {
@@ -357,6 +570,17 @@ const addFileExtension = (importedFilePath, sourceFile) => {
   return importedFilePath + fileExtension;
 };
 const matchesFileSuffix = allowedSuffix => filename => filename.endsWith(`${allowedSuffix}.js`) || filename.endsWith(`${allowedSuffix}.ts`) || filename.endsWith(`${allowedSuffix}.tsx`) || filename.endsWith(`${allowedSuffix}.jsx`) || filename.endsWith(`${allowedSuffix}.mjs`) || filename.endsWith(`${allowedSuffix}.cjs`) || filename.endsWith(allowedSuffix);
+const getProgramPath = path => {
+  let programPath = path;
+  while (programPath != null && !isProgram(programPath)) {
+    if (programPath.parentPath) {
+      programPath = programPath.parentPath;
+    } else {
+      return null;
+    }
+  }
+  return programPath;
+};
 
 function readImportDeclarations(path, state) {
   const {
@@ -1147,7 +1371,10 @@ function getExpandedKeys(options) {
   return Object.keys(expansions[options.styleResolution ?? 'application-order']);
 }
 function flatMapExpandedShorthands(objEntry, options) {
-  const [key, value] = objEntry;
+  let [key, value] = objEntry;
+  if (key.startsWith('var(') && key.endsWith(')')) {
+    key = key.slice(4, -1);
+  }
   const expansion = expansions[options.styleResolution ?? 'application-order'][key];
   if (expansion) {
     if (Array.isArray(value)) {
@@ -1329,6 +1556,16 @@ function normalizeWhitespace(ast, _) {
           break;
         }
       case 'div':
+        {
+          if (node.value === ',') {
+            node.before = '';
+            node.after = '';
+          } else {
+            node.before = ' ';
+            node.after = ' ';
+          }
+          break;
+        }
       case 'function':
         {
           node.before = '';
@@ -1360,7 +1597,14 @@ function _interopRequireDefault$b(obj) { return obj && obj.__esModule ? obj : {
 const angles = ['deg', 'grad', 'turn', 'rad'];
 const timings = ['ms', 's'];
 function normalizeZeroDimensions(ast, _) {
+  let endFunction = 0;
   ast.walk(node => {
+    if (node.type === 'function' && !endFunction) {
+      endFunction = node.sourceEndIndex ?? 0;
+    }
+    if (endFunction > 0 && node.sourceIndex > endFunction) {
+      endFunction = 0;
+    }
     if (node.type !== 'word') {
       return;
     }
@@ -1372,7 +1616,7 @@ function normalizeZeroDimensions(ast, _) {
       node.value = '0deg';
     } else if (timings.indexOf(dimension.unit) !== -1) {
       node.value = '0s';
-    } else {
+    } else if (!endFunction) {
       node.value = '0';
     }
   });
@@ -1809,6 +2053,7 @@ var propertyPriorities = {};
 Object.defineProperty(propertyPriorities, "__esModule", {
   value: true
 });
+propertyPriorities.PSEUDO_ELEMENT_PRIORITY = propertyPriorities.PSEUDO_CLASS_PRIORITIES = propertyPriorities.AT_RULE_PRIORITIES = void 0;
 propertyPriorities.default = getPriority;
 const longHandPhysical = new Set();
 const longHandLogical = new Set();
@@ -2246,7 +2491,7 @@ longHandLogical.add('math-depth');
 longHandLogical.add('math-shift');
 longHandLogical.add('math-style');
 longHandLogical.add('touch-action');
-const PRIORITIES = {
+const PSEUDO_CLASS_PRIORITIES = propertyPriorities.PSEUDO_CLASS_PRIORITIES = {
   ':is': 40,
   ':where': 40,
   ':not': 40,
@@ -2301,25 +2546,31 @@ const PRIORITIES = {
   ':focusVisible': 160,
   ':active': 170
 };
+const AT_RULE_PRIORITIES = propertyPriorities.AT_RULE_PRIORITIES = {
+  '@supports': 30,
+  '@media': 200,
+  '@container': 300
+};
+const PSEUDO_ELEMENT_PRIORITY = propertyPriorities.PSEUDO_ELEMENT_PRIORITY = 5000;
 function getPriority(key) {
   if (key.startsWith('--')) {
     return 1;
   }
   if (key.startsWith('@supports')) {
-    return 30;
+    return AT_RULE_PRIORITIES['@supports'];
   }
   if (key.startsWith('@media')) {
-    return 200;
+    return AT_RULE_PRIORITIES['@media'];
   }
   if (key.startsWith('@container')) {
-    return 300;
+    return AT_RULE_PRIORITIES['@container'];
   }
   if (key.startsWith('::')) {
-    return 5000;
+    return PSEUDO_ELEMENT_PRIORITY;
   }
   if (key.startsWith(':')) {
     const prop = key.startsWith(':') && key.includes('(') ? key.slice(0, key.indexOf('(')) : key;
-    return PRIORITIES[prop] ?? 40;
+    return PSEUDO_CLASS_PRIORITIES[prop] ?? 40;
   }
   if (longHandPhysical.has(key)) {
     return 4000;
@@ -2343,7 +2594,7 @@ generateCssRule.generateRule = generateRule;
 var _generateLtr$1 = _interopRequireDefault$6(generateLtr);
 var _generateRtl$1 = _interopRequireDefault$6(generateRtl);
 var _genCSSRule = genCSSRule$1;
-var _propertyPriorities = _interopRequireDefault$6(propertyPriorities);
+var _propertyPriorities$1 = _interopRequireDefault$6(propertyPriorities);
 function _interopRequireDefault$6(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function generateRule(className, key, value, pseudos, atRules) {
   const pairs = Array.isArray(value) ? value.map(eachValue => [key, eachValue]) : [[key, value]];
@@ -2352,7 +2603,7 @@ function generateRule(className, key, value, pseudos, atRules) {
   const rtlDecls = pairs.map(_generateRtl$1.default).filter(Boolean).map(pair => pair.join(':')).join(';');
   const ltrRule = (0, _genCSSRule.genCSSRule)(className, ltrDecls, pseudos, atRules);
   const rtlRule = !rtlDecls ? null : (0, _genCSSRule.genCSSRule)(className, rtlDecls, pseudos, atRules);
-  const priority = (0, _propertyPriorities.default)(key) + pseudos.map(_propertyPriorities.default).reduce((a, b) => a + b, 0) + atRules.map(_propertyPriorities.default).reduce((a, b) => a + b, 0);
+  const priority = (0, _propertyPriorities$1.default)(key) + pseudos.map(_propertyPriorities$1.default).reduce((a, b) => a + b, 0) + atRules.map(_propertyPriorities$1.default).reduce((a, b) => a + b, 0);
   return {
     priority,
     ltr: ltrRule,
@@ -3158,7 +3409,7 @@ var messages_1;
 Object.defineProperty(lib, "__esModule", {
   value: true
 });
-var utils_1 = lib.utils = lib.types = messages_1 = lib.messages = keyframes_1 = lib.keyframes = include_1 = lib.include = firstThatWorks_1 = lib.firstThatWorks = defineVars_1 = lib.defineVars = createTheme_1 = lib.createTheme = create_1 = lib.create = IncludedStyles_1 = lib.IncludedStyles = void 0;
+var utils_1 = lib.utils = lib.types = messages_1 = lib.messages = keyframes_1 = lib.keyframes = include_1 = lib.include = firstThatWorks_1 = lib.firstThatWorks = defineVars_1 = lib.defineVars = createTheme_1 = lib.createTheme = create_1 = lib.create = lib.PSEUDO_ELEMENT_PRIORITY = lib.PSEUDO_CLASS_PRIORITIES = IncludedStyles_1 = lib.IncludedStyles = lib.AT_RULE_PRIORITIES = void 0;
 var _stylexCreate = _interopRequireDefault(stylexCreate$1);
 var _stylexDefineVars = _interopRequireDefault(stylexDefineVars$1);
 var _stylexCreateTheme = _interopRequireDefault(stylexCreateTheme$1);
@@ -3170,6 +3421,7 @@ var _fileBasedIdentifier = _interopRequireDefault(fileBasedIdentifier);
 var m = _interopRequireWildcard(messages$3);
 var _types = _interopRequireWildcard(types$1);
 lib.types = _types;
+var _propertyPriorities = propertyPriorities;
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -3185,6 +3437,9 @@ utils_1 = lib.utils = {
 messages_1 = lib.messages = m;
 IncludedStyles_1 = lib.IncludedStyles = _stylexInclude.IncludedStyles;
 firstThatWorks_1 = lib.firstThatWorks = _stylexFirstThatWorks.default;
+lib.PSEUDO_CLASS_PRIORITIES = _propertyPriorities.PSEUDO_CLASS_PRIORITIES;
+lib.AT_RULE_PRIORITIES = _propertyPriorities.AT_RULE_PRIORITIES;
+lib.PSEUDO_ELEMENT_PRIORITY = _propertyPriorities.PSEUDO_ELEMENT_PRIORITY;
 
 function namespaceToDevClassName(namespace, varName, filename) {
   const basename = path.basename(filename).split('.')[0];
@@ -3224,118 +3479,6 @@ function canBeIdentifier(str) {
   return str.match(/^[a-zA-Z_$][a-zA-Z0-9_$]*$/) != null;
 }
 
-function isArrayExpression(path, props) {
-  return path.isArrayExpression(props);
-}
-function isArrowFunctionExpression(path, props) {
-  return path.isArrowFunctionExpression(props);
-}
-function isBinaryExpression(path, props) {
-  return path.isBinaryExpression(props);
-}
-function isBooleanLiteral(path, props) {
-  return path.isBooleanLiteral(props);
-}
-function isCallExpression(path, props) {
-  return path.isCallExpression(props);
-}
-function isClass(path, props) {
-  return path.isClass(props);
-}
-function isConditionalExpression(path, props) {
-  return path.isConditionalExpression(props);
-}
-function isExportDefaultDeclaration(path, props) {
-  return path.isExportDefaultDeclaration(props);
-}
-function isExportNamedDeclaration(path, props) {
-  return path.isExportNamedDeclaration(props);
-}
-function isExpression(path, props) {
-  return path.isExpression(props);
-}
-function isExpressionStatement(path, props) {
-  return path.isExpressionStatement(props);
-}
-function isExpressionWrapper(path, props) {
-  return path.isExpressionWrapper(props);
-}
-function isFunction(path, props) {
-  return path.isFunction(props);
-}
-function isIdentifier(path, props) {
-  return path.isIdentifier(props);
-}
-function isImportDeclaration(path, props) {
-  return path.isImportDeclaration(props);
-}
-function isImportDefaultSpecifier(path, props) {
-  return path.isImportDefaultSpecifier(props);
-}
-function isImportNamespaceSpecifier(path, props) {
-  return path.isImportNamespaceSpecifier(props);
-}
-function isImportSpecifier(path, props) {
-  return path.isImportSpecifier(props);
-}
-function isLogicalExpression(path, props) {
-  return path.isLogicalExpression(props);
-}
-function isMemberExpression(path, props) {
-  return path.isMemberExpression(props);
-}
-function isNullLiteral(path, props) {
-  return path.isNullLiteral(props);
-}
-function isNumericLiteral(path, props) {
-  return path.isNumericLiteral(props);
-}
-function isObjectExpression(path, props) {
-  return path.isObjectExpression(props);
-}
-function isObjectMethod(path, props) {
-  return path.isObjectMethod(props);
-}
-function isObjectProperty(path, props) {
-  return path.isObjectProperty(props);
-}
-function isProgram(path, props) {
-  return path.isProgram(props);
-}
-function isSequenceExpression(path, props) {
-  return path.isSequenceExpression(props);
-}
-function isSpreadElement(path, props) {
-  return path.isSpreadElement(props);
-}
-function isStatement(path, props) {
-  return path.isStatement(props);
-}
-function isStringLiteral(path, props) {
-  return path.isStringLiteral(props);
-}
-function isTSAsExpression(path, props) {
-  return path.isTSAsExpression(props);
-}
-function isTaggedTemplateExpression(path, props) {
-  return path.isTaggedTemplateExpression(props);
-}
-function isTemplateLiteral(path, props) {
-  return path.isTemplateLiteral(props);
-}
-function isUnaryExpression(path, props) {
-  return path.isUnaryExpression(props);
-}
-function isVariableDeclaration(path, props) {
-  return path.isVariableDeclaration(props);
-}
-function isVariableDeclarator(path, props) {
-  return path.isVariableDeclarator(props);
-}
-function isReferencedIdentifier(path, props) {
-  return path.isReferencedIdentifier(props);
-}
-
 const VALID_CALLEES = ['String', 'Number', 'Math', 'Object', 'Array'];
 const INVALID_METHODS = ['random', 'assign', 'defineProperties', 'defineProperty', 'freeze', 'seal', 'splice'];
 function isValidCallee(val) {
@@ -3955,7 +4098,10 @@ function evaluatePartialObjectRecursively(path, traversalState) {
           value: null
         };
       }
-      const key = keyResult.value;
+      let key = keyResult.value;
+      if (key.startsWith('var(') && key.endsWith(')')) {
+        key = key.slice(4, -1);
+      }
       const valuePath = prop.get('value');
       if (isObjectExpression(valuePath)) {
         const result = evaluatePartialObjectRecursively(valuePath, traversalState, functions, [...keyPath, key]);
@@ -4141,9 +4287,9 @@ function transformStyleXCreate(path, state) {
           from,
           as
         } = state.runtimeInjection;
-        injectName = as != null ? helperModuleImports.addNamed(statementPath, as, from, {
+        injectName = as != null ? state.addNamedImport(statementPath, as, from, {
           nameHint: 'inject'
-        }) : helperModuleImports.addDefault(statementPath, from, {
+        }) : state.addDefaultImport(statementPath, from, {
           nameHint: 'inject'
         });
         state.injectImportInserted = injectName;
@@ -4272,9 +4418,9 @@ function transformStyleXDefineVars(callExpressionPath, state) {
           from,
           as
         } = state.runtimeInjection;
-        injectName = as != null ? helperModuleImports.addNamed(statementPath, as, from, {
+        injectName = as != null ? state.addNamedImport(statementPath, as, from, {
           nameHint: 'inject'
-        }) : helperModuleImports.addDefault(statementPath, from, {
+        }) : state.addDefaultImport(statementPath, from, {
           nameHint: 'inject'
         });
         state.injectImportInserted = injectName;
@@ -4372,9 +4518,9 @@ function transformStyleXCreateTheme(callExpressionPath, state) {
           from,
           as
         } = state.runtimeInjection;
-        injectName = as != null ? helperModuleImports.addNamed(statementPath, as, from, {
+        injectName = as != null ? state.addNamedImport(statementPath, as, from, {
           nameHint: 'inject'
-        }) : helperModuleImports.addDefault(statementPath, from, {
+        }) : state.addDefaultImport(statementPath, from, {
           nameHint: 'inject'
         });
         state.injectImportInserted = injectName;
@@ -4474,9 +4620,9 @@ function transformStyleXKeyframes(path, state) {
           from,
           as
         } = state.runtimeInjection;
-        injectName = as != null ? helperModuleImports.addNamed(statementPath, as, from, {
+        injectName = as != null ? state.addNamedImport(statementPath, as, from, {
           nameHint: 'inject'
-        }) : helperModuleImports.addDefault(statementPath, from, {
+        }) : state.addDefaultImport(statementPath, from, {
           nameHint: 'inject'
         });
         state.injectImportInserted = injectName;

package/lib/utils/state-manager.d.ts

@@ -14,6 +14,11 @@ import type {
   CompiledNamespaces,
   StyleXOptions as RuntimeOptions,
 } from '@stylexjs/shared';
+import type { ImportOptions } from '@babel/helper-module-imports';
+type ImportAdditionOptions = Omit<
+  Partial<ImportOptions>,
+  'ensureLiveReference' | 'ensureNoContext'
+>;
 export type ImportPathResolution =
   | false
   | ['themeNameRef' | 'filePath', string];
@@ -43,6 +48,10 @@ export type StyleXOptions = Readonly<
       treeshakeCompensation?: boolean;
       genConditionalClasses: boolean;
       unstable_moduleResolution: null | undefined | ModuleResolution;
+      aliases?:
+        | null
+        | undefined
+        | Readonly<{ [$$Key$$: string]: string | ReadonlyArray<string> }>;
     })
   > & {
     importSources: ReadonlyArray<
@@ -55,6 +64,10 @@ export type StyleXOptions = Readonly<
     treeshakeCompensation?: boolean;
     genConditionalClasses: boolean;
     unstable_moduleResolution: null | undefined | ModuleResolution;
+    aliases?:
+      | null
+      | undefined
+      | Readonly<{ [$$Key$$: string]: string | ReadonlyArray<string> }>;
   }
 >;
 type StyleXStateOptions = Readonly<
@@ -64,11 +77,19 @@ type StyleXStateOptions = Readonly<
       runtimeInjection:
         | (null | undefined | string)
         | Readonly<{ from: string; as: null | undefined | string }>;
+      aliases?:
+        | null
+        | undefined
+        | Readonly<{ [$$Key$$: string]: ReadonlyArray<string> }>;
     })
   > & {
     runtimeInjection:
       | (null | undefined | string)
       | Readonly<{ from: string; as: null | undefined | string }>;
+    aliases?:
+      | null
+      | undefined
+      | Readonly<{ [$$Key$$: string]: ReadonlyArray<string> }>;
   }
 >;
 declare class StateManager {
@@ -103,6 +124,17 @@ declare class StateManager {
     | null
     | undefined
     | Readonly<{ from: string; as?: null | undefined | string }>;
+  addNamedImport(
+    statementPath: NodePath,
+    as: string,
+    from: string,
+    options: ImportAdditionOptions,
+  ): t.Identifier;
+  addDefaultImport(
+    statementPath: NodePath,
+    from: string,
+    options: ImportAdditionOptions,
+  ): t.Identifier;
   get isDev(): boolean;
   get isTest(): boolean;
   get filename(): string | void;

package/lib/utils/state-manager.js.flow

@@ -14,6 +14,12 @@ import type {
   CompiledNamespaces,
   StyleXOptions as RuntimeOptions,
 } from '@stylexjs/shared';
+import type { ImportOptions } from '../../flow_modules/@babel/helper-module-imports';
+type ImportAdditionOptions = Omit<
+  Partial<ImportOptions>,
+  'ensureLiveReference' | 'ensureNoContext',
+>;
+
 export type ImportPathResolution =
   | false
   | ['themeNameRef' | 'filePath', string];
@@ -43,12 +49,14 @@ export type StyleXOptions = $ReadOnly<{
   treeshakeCompensation?: boolean,
   genConditionalClasses: boolean,
   unstable_moduleResolution: ?ModuleResolution,
+  aliases?: ?$ReadOnly<{ [string]: string | $ReadOnlyArray<string> }>,
   ...
 }>;
 
 type StyleXStateOptions = $ReadOnly<{
   ...StyleXOptions,
   runtimeInjection: ?string | $ReadOnly<{ from: string, as: ?string }>,
+  aliases?: ?$ReadOnly<{ [string]: $ReadOnlyArray<string> }>,
   ...
 }>;
 
@@ -79,6 +87,17 @@ declare export default class StateManager {
   get canReferenceTheme(): boolean;
   get metadata(): { [key: string]: any };
   get runtimeInjection(): ?$ReadOnly<{ from: string, as?: ?string }>;
+  addNamedImport(
+    statementPath: NodePath<>,
+    as: string,
+    from: string,
+    options: ImportAdditionOptions,
+  ): t.Identifier;
+  addDefaultImport(
+    statementPath: NodePath<>,
+    from: string,
+    options: ImportAdditionOptions,
+  ): t.Identifier;
   get isDev(): boolean;
   get isTest(): boolean;
   get filename(): string | void;

package/lib/utils/validate.d.ts

@@ -39,7 +39,7 @@ export declare const object: <
 ) => Check<ObjOfChecks<T>>;
 export declare const objectOf: <T>(
   $$PARAM_0$$: Check<T>,
-  $$PARAM_1$$: Msg,
+  message?: Msg,
 ) => Check<{ readonly [$$Key$$: string]: T }>;
 export declare const unionOf: <A, B>(
   a: Check<A>,

package/lib/utils/validate.js.flow

@@ -40,7 +40,10 @@ declare export const object: <T: { +[string]: Check<mixed> }>(
   msg?: Msg,
 ) => Check<ObjOfChecks<T>>;
 
-declare export const objectOf: <T>(Check<T>, Msg) => Check<{ +[string]: T }>;
+declare export const objectOf: <T>(
+  Check<T>,
+  message?: Msg,
+) => Check<{ +[string]: T }>;
 
 declare export const unionOf: <A, B>(
   a: Check<A>,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stylexjs/babel-plugin",
-  "version": "0.5.0-alpha.3",
+  "version": "0.5.0",
   "description": "StyleX babel plugin.",
   "main": "lib/index.js",
   "repository": "https://github.com/facebook/stylex",
@@ -9,12 +9,13 @@
     "prebuild": "gen-types -i src/ -o lib/",
     "build": "rollup --config ./rollup.config.mjs",
     "build-haste": "HASTE=true rollup --config ./rollup.config.mjs",
+    "build-watch": "rollup --config ./rollup.config.mjs --watch",
     "test": "jest"
   },
   "dependencies": {
     "@babel/helper-module-imports": "^7.22.15",
-    "@stylexjs/shared": "0.5.0-alpha.3",
-    "@stylexjs/stylex": "0.5.0-alpha.3",
+    "@stylexjs/shared": "0.5.0",
+    "@stylexjs/stylex": "0.5.0",
     "@babel/core": "^7.23.6",
     "@babel/traverse": "^7.23.6",
     "@babel/types": "^7.23.6"