refactor: deduplicate shared patterns across codebase

- Extract isValidIdentifierName to string-utils.ts (was defined 6 times)
- Consolidate resolveThemeAst in value-patterns.ts to reuse
  resolveThemeFromPropsMember from template-literals.ts
- Extract resolveTplBranch and applyResolvedEntries helpers in
  css-helper-conditional.ts to deduplicate template literal branch handling

https://claude.ai/code/session_01CEoafpHoAaRMVmm1WtcXu1

Author: claude

src/internal/emit-wrappers/emit-intrinsic-should-forward-prop.ts

@@ -7,6 +7,7 @@
 import type { StyledDecl } from "../transform-types.js";
 import { getBridgeClassVar } from "../utilities/bridge-classname.js";
 import { buildStyleFnConditionExpr } from "../utilities/jscodeshift-utils.js";
+import { isValidIdentifierName } from "../utilities/string-utils.js";
 import { type ExpressionKind, type InlineStyleProp, type WrapperPropDefaults } from "./types.js";
 import { SX_PROP_TYPE_TEXT, type JsxAttr, type StatementKind } from "./wrapper-emitter.js";
 import { emitStyleMerging } from "./style-merger.js";
@@ -150,10 +151,9 @@ export function emitShouldForwardPropWrappers(ctx: EmitIntrinsicContext): void {
       !!dropPrefixFromFilter &&
       (usedAttrs.has("*") ||
         [...usedAttrs].some((n) => n.startsWith(dropPrefixFromFilter) && !extraProps.has(n)));
-    const isValidIdentifier = (name: string): boolean => /^[$A-Z_][0-9A-Z_$]*$/i.test(name);
     const knownPrefixProps = dropPrefixFromFilter
       ? [...extraProps].filter(
-          (p: string) => p.startsWith(dropPrefixFromFilter) && isValidIdentifier(p),
+          (p: string) => p.startsWith(dropPrefixFromFilter) && isValidIdentifierName(p),
         )
       : [];
     const knownPrefixPropsSet = new Set(knownPrefixProps);
@@ -183,7 +183,7 @@ export function emitShouldForwardPropWrappers(ctx: EmitIntrinsicContext): void {
       const staticVariantPropTypes = buildStaticVariantPropTypes(d);
       const lines: string[] = [];
       for (const p of extraProps) {
-        if (!isValidIdentifier(p)) {
+        if (!isValidIdentifierName(p)) {
           continue;
         }
         const variantType = variantDimByProp.get(p);
@@ -219,7 +219,7 @@ export function emitShouldForwardPropWrappers(ctx: EmitIntrinsicContext): void {
       const staticVariantPropTypes = buildStaticVariantPropTypes(d);
       const lines: string[] = [];
       for (const p of extraProps) {
-        if (!isValidIdentifier(p) || explicitPropNames.has(p) || compoundWhenKeys.has(p)) {
+        if (!isValidIdentifierName(p) || explicitPropNames.has(p) || compoundWhenKeys.has(p)) {
           continue;
         }
         const variantType = variantDimByProp.get(p);

src/internal/emit-wrappers/emit-intrinsic-simple.ts

@@ -7,6 +7,7 @@
 import type { JSCodeshift } from "jscodeshift";
 import type { StyledDecl } from "../transform-types.js";
 import { getBridgeClassVar } from "../utilities/bridge-classname.js";
+import { isValidIdentifierName } from "../utilities/string-utils.js";
 import {
   collectInlineStylePropNames,
   type ExpressionKind,
@@ -650,11 +651,10 @@ export function emitSimpleExportedIntrinsicWrappers(ctx: EmitIntrinsicContext):
         for (const k of compoundVariantWhenKeys) {
           keys.delete(k);
         }
-        const isValidIdentifier = (name: string): boolean => /^[$A-Z_][0-9A-Z_$]*$/i.test(name);
         const filtered = [...keys].filter(
           (k) =>
             k &&
-            isValidIdentifier(k) &&
+            isValidIdentifierName(k) &&
             k !== "children" &&
             k !== "className" &&
             k !== "style" &&

src/internal/emit-wrappers/variant-condition.ts

@@ -8,6 +8,7 @@
  */
 import type { JSCodeshift } from "jscodeshift";
 import type { ExpressionKind } from "./types.js";
+import { isValidIdentifierName } from "../utilities/string-utils.js";
 
 export type LogicalExpressionOperand = Parameters<JSCodeshift["logicalExpression"]>[1];
 
@@ -17,8 +18,6 @@ type VariantConditionResult = {
   isBoolean: boolean;
 };
 
-const isValidIdentifier = (name: string): boolean => /^[$A-Z_][0-9A-Z_$]*$/i.test(name);
-
 /**
  * Parse a variant "when" string into an AST condition expression.
  *
@@ -43,7 +42,7 @@ export function parseVariantWhenToAst(
       .split(".")
       .map((part) => part.trim())
       .filter(Boolean);
-    if (parts.length < 2 || parts.some((part) => !isValidIdentifier(part))) {
+    if (parts.length < 2 || parts.some((part) => !isValidIdentifierName(part))) {
       return null;
     }
     return parts
@@ -65,13 +64,13 @@ export function parseVariantWhenToAst(
         .map((part) => part.trim())
         .filter(Boolean);
       const last = parts[parts.length - 1];
-      if (!last || !isValidIdentifier(last)) {
+      if (!last || !isValidIdentifierName(last)) {
         return { propName: null, expr: j.identifier(trimmedRaw) };
       }
       const root = parts[0];
       if (root === "props" || root === "p") {
         const propRoot = parts[1];
-        if (!propRoot || !isValidIdentifier(propRoot)) {
+        if (!propRoot || !isValidIdentifierName(propRoot)) {
           return { propName: null, expr: j.identifier(trimmedRaw) };
         }
         const expr = parts

src/internal/lower-rules/css-helper-conditional.ts

@@ -1636,16 +1636,8 @@ export function createCssHelperConditionalHandler(ctx: CssHelperConditionalConte
           continue;
         }
 
-        const consResolved = resolveTemplateLiteralBranch(tplCtx, {
-          node: split.consTpl as Parameters<typeof resolveTemplateLiteralBranch>[1]["node"],
-          paramName,
-          bindings,
-        });
-        const altResolved = resolveTemplateLiteralBranch(tplCtx, {
-          node: split.altTpl as Parameters<typeof resolveTemplateLiteralBranch>[1]["node"],
-          paramName,
-          bindings,
-        });
+        const consResolved = resolveTplBranch(split.consTpl as ExpressionKind);
+        const altResolved = resolveTplBranch(split.altTpl as ExpressionKind);
         if (!consResolved || !altResolved) {
           skipIndices.add(split.ternaryIdx);
           continue;
@@ -1703,97 +1695,72 @@ export function createCssHelperConditionalHandler(ctx: CssHelperConditionalConte
       return false;
     };
 
+    // Helper to resolve a template literal branch and apply its entries
+    const resolveTplBranch = (
+      node: ExpressionKind,
+    ): ReturnType<typeof resolveTemplateLiteralBranch> =>
+      resolveTemplateLiteralBranch(tplCtx, { node: node as any, paramName, bindings });
+
+    // Helper to apply all entries (style, dynamic, inline) from a resolved branch
+    const applyResolvedEntries = (
+      resolved: NonNullable<ReturnType<typeof resolveTemplateLiteralBranch>>,
+      info: TestInfo,
+      when: string,
+    ): void => {
+      if (Object.keys(resolved.style).length > 0) {
+        applyVariant(info, resolved.style);
+      }
+      if (resolved.dynamicEntries.length > 0) {
+        applyDynamicEntries(resolved.dynamicEntries, when);
+      }
+      if (resolved.inlineEntries.length > 0) {
+        applyInlineEntries(resolved.inlineEntries, when);
+      }
+    };
+
     // Check altIsEmpty BEFORE altIsTpl since empty templates are also template literals
     // and the altIsEmpty case doesn't require invertWhen (which fails for compound conditions)
     if (consIsTpl && altIsEmpty) {
       dropAllTestInfoProps(testInfo);
-      const consResolved = resolveTemplateLiteralBranch(tplCtx, {
-        node: cons as any,
-        paramName,
-        bindings,
-      });
+      const consResolved = resolveTplBranch(cons);
       if (!consResolved) {
         // Fallback: try splitting dynamic property name ternaries
         if (tryResolveDynamicPropertyNameTpl(cons)) {
           return true;
         }
         return false;
       }
-      if (Object.keys(consResolved.style).length > 0) {
-        applyVariant(testInfo, consResolved.style);
-      }
-      if (consResolved.dynamicEntries.length > 0) {
-        applyDynamicEntries(consResolved.dynamicEntries, testInfo.when);
-      }
-      if (consResolved.inlineEntries.length > 0) {
-        applyInlineEntries(consResolved.inlineEntries, testInfo.when);
-      }
+      applyResolvedEntries(consResolved, testInfo, testInfo.when);
       return true;
     }
 
     if (consIsTpl && altIsTpl) {
       dropAllTestInfoProps(testInfo);
-      const consResolved = resolveTemplateLiteralBranch(tplCtx, {
-        node: cons as any,
-        paramName,
-        bindings,
-      });
-      const altResolved = resolveTemplateLiteralBranch(tplCtx, {
-        node: alt as any,
-        paramName,
-        bindings,
-      });
+      const consResolved = resolveTplBranch(cons);
+      const altResolved = resolveTplBranch(alt);
       if (!consResolved || !altResolved) {
         return false;
       }
       const invertedWhen = invertWhen(testInfo.when);
       if (!invertedWhen) {
         return false;
       }
-      if (Object.keys(consResolved.style).length > 0) {
-        applyVariant(testInfo, consResolved.style);
-      }
-      if (Object.keys(altResolved.style).length > 0) {
-        applyVariant({ ...testInfo, when: invertedWhen }, altResolved.style);
-      }
-      if (consResolved.dynamicEntries.length > 0) {
-        applyDynamicEntries(consResolved.dynamicEntries, testInfo.when);
-      }
-      if (altResolved.dynamicEntries.length > 0) {
-        applyDynamicEntries(altResolved.dynamicEntries, invertedWhen);
-      }
-      if (consResolved.inlineEntries.length > 0) {
-        applyInlineEntries(consResolved.inlineEntries, testInfo.when);
-      }
-      if (altResolved.inlineEntries.length > 0) {
-        applyInlineEntries(altResolved.inlineEntries, invertedWhen);
-      }
+      applyResolvedEntries(consResolved, testInfo, testInfo.when);
+      applyResolvedEntries(altResolved, { ...testInfo, when: invertedWhen }, invertedWhen);
       return true;
     }
 
     if (consIsEmpty && altIsTpl) {
       dropAllTestInfoProps(testInfo);
-      const altResolved = resolveTemplateLiteralBranch(tplCtx, {
-        node: alt as any,
-        paramName,
-        bindings,
-      });
+      const altResolved = resolveTplBranch(alt);
       if (!altResolved) {
         return false;
       }
       const invertedWhen = invertWhen(testInfo.when);
       if (!invertedWhen) {
         return false;
       }
-      if (Object.keys(altResolved.style).length > 0) {
-        applyVariant({ ...testInfo, when: invertedWhen }, altResolved.style);
-      }
-      if (altResolved.dynamicEntries.length > 0) {
-        applyDynamicEntries(altResolved.dynamicEntries, invertedWhen);
-      }
-      if (altResolved.inlineEntries.length > 0) {
-        applyInlineEntries(altResolved.inlineEntries, invertedWhen);
-      }
+      applyResolvedEntries(altResolved, { ...testInfo, when: invertedWhen }, invertedWhen);
       return true;
     }
 

src/internal/lower-rules/import-resolution.ts

@@ -14,6 +14,7 @@ import {
   isFunctionNode,
   isIdentifierNode,
 } from "../utilities/jscodeshift-utils.js";
+import { isValidIdentifierName } from "../utilities/string-utils.js";
 
 export const buildSafeIndexedParamName = (
   preferred: string,
@@ -284,5 +285,3 @@ export const createImportResolver = (args: {
     resolveImportForExpr,
   };
 };
-
-const isValidIdentifierName = (name: string): boolean => /^[$A-Z_][0-9A-Z_$]*$/i.test(name);

src/internal/lower-rules/template-literals.ts

@@ -29,6 +29,7 @@ import {
   type ArrowFnParamBindings,
   type CallExpressionNode,
 } from "../utilities/jscodeshift-utils.js";
+import { isValidIdentifierName } from "../utilities/string-utils.js";
 import { parseCssTemplateToRules } from "./css-helper.js";
 import { extractStaticParts } from "./interpolations.js";
 import { buildTemplateWithStaticParts } from "./inline-styles.js";
@@ -703,7 +704,7 @@ function resolveDynamicTemplateExpr(args: {
   return null;
 }
 
-function resolveThemeFromPropsMember(args: {
+export function resolveThemeFromPropsMember(args: {
   expr: Expression;
   paramName: string;
   filePath: string;
@@ -853,7 +854,7 @@ function buildPropAccessExpr(
   propName: string,
   defaultValue?: unknown,
 ): ExpressionKind {
-  const isIdent = /^[$A-Z_][0-9A-Z_$]*$/i.test(propName);
+  const isIdent = isValidIdentifierName(propName);
   const baseExpr = isIdent
     ? (j.identifier(propName) as ExpressionKind)
     : (j.memberExpression(j.identifier("props"), j.literal(propName), true) as ExpressionKind);

src/internal/lower-rules/value-patterns.ts

@@ -14,7 +14,9 @@ import {
   resolveStaticExpressionValue,
   setIdentifierTypeAnnotation,
 } from "../utilities/jscodeshift-utils.js";
+import { isValidIdentifierName } from "../utilities/string-utils.js";
 import { buildSafeIndexedParamName } from "./import-resolution.js";
+import { resolveThemeFromPropsMember } from "./template-literals.js";
 import { cssValueToJs, styleKeyWithSuffix } from "../transform/helpers.js";
 import { cssPropertyToIdentifier, makeCssProperty } from "./shared.js";
 import type { LowerRulesState } from "./state.js";
@@ -278,29 +280,14 @@ export const createValuePatternHandlers = (ctx: ValuePatternContext) => {
       if (hasLocalThemeBinding) {
         return null;
       }
-      const path = getMemberPathFromIdentifier(node as any, paramName);
-      if (!path || path[0] !== "theme") {
-        return null;
-      }
-      const themePath = path.slice(1).join(".");
-      if (!themePath) {
-        return null;
-      }
-      const resolved = resolveValue({
-        kind: "theme",
-        path: themePath,
+      return resolveThemeFromPropsMember({
+        expr: node,
+        paramName: paramName!,
         filePath,
-        loc: getNodeLocStart(node) ?? undefined,
+        parseExpr,
+        resolveValue,
+        resolverImports,
       });
-      if (!resolved) {
-        return null;
-      }
-      registerImports(resolved.imports, resolverImports);
-      const exprAst = parseExpr(resolved.expr);
-      if (!exprAst) {
-        return null;
-      }
-      return exprAst as ExpressionKind;
     };
 
     const readPropAccess = (node: any): string | null => {
@@ -334,7 +321,7 @@ export const createValuePatternHandlers = (ctx: ValuePatternContext) => {
     const altTheme = resolveThemeAst(body.alternate);
 
     const buildPropAccess = (prop: string): ExpressionKind => {
-      const isIdent = /^[$A-Z_][0-9A-Z_$]*$/i.test(prop);
+      const isIdent = isValidIdentifierName(prop);
       return isIdent
         ? j.memberExpression(j.identifier("props"), j.identifier(prop))
         : j.memberExpression(j.identifier("props"), j.literal(prop), true);
@@ -382,7 +369,7 @@ export const createValuePatternHandlers = (ctx: ValuePatternContext) => {
         styleFnDecls.set(fnKey, j.arrowFunctionExpression([param], bodyExpr));
       }
       if (!styleFnFromProps.some((p) => p.fnKey === fnKey)) {
-        const isIdent = /^[$A-Z_][0-9A-Z_$]*$/i.test(nullishPropName);
+        const isIdent = isValidIdentifierName(nullishPropName);
         const baseArg = isIdent ? j.identifier(nullishPropName) : buildPropAccess(nullishPropName);
         const callArg = j.logicalExpression("??", baseArg, fallbackTheme);
         styleFnFromProps.push({

src/internal/transform-steps/analyze-before-emit.ts

@@ -19,7 +19,7 @@ import {
   isFunctionNode,
   literalToStaticValue,
 } from "../utilities/jscodeshift-utils.js";
-import { escapeRegex } from "../utilities/string-utils.js";
+import { escapeRegex, isValidIdentifierName } from "../utilities/string-utils.js";
 import type { PromotedStyleEntry } from "../transform-types.js";
 import { parseVariantWhenToAst } from "../emit-wrappers/variant-condition.js";
 import { BLOCKED_INTRINSIC_ATTR_RENAMES } from "../emit-wrappers/types.js";
@@ -2041,12 +2041,6 @@ type PromotedParamType = "number" | "string" | "numberOrString";
 const LENGTH_LIKE_CSS_PROP_RE =
   /^(top|right|bottom|left|width|height|minWidth|maxWidth|minHeight|maxHeight|margin|padding|gap|inset|translate|fontSize|letterSpacing|lineHeight|borderWidth|borderRadius|outline)/;
 
-const IDENTIFIER_NAME_RE = /^[$A-Z_][0-9A-Z_$]*$/i;
-
-function isValidIdentifierName(name: string): boolean {
-  return IDENTIFIER_NAME_RE.test(name);
-}
-
 function coerceToStringForStyleX(cssProp: string, value: unknown): unknown {
   if (STYLEX_STRING_ONLY_CSS_PROPS.has(cssProp) && typeof value === "number") {
     return String(value);

src/internal/utilities/string-utils.ts

@@ -6,6 +6,16 @@
  * Capitalizes the first character of a string.
  * @example capitalize("hello") => "Hello"
  */
+/**
+ * Checks whether a string is a valid JavaScript identifier name.
+ * @example isValidIdentifierName("foo") => true
+ * @example isValidIdentifierName("$bar") => true
+ * @example isValidIdentifierName("some-prop") => false
+ */
+export function isValidIdentifierName(name: string): boolean {
+  return /^[$A-Z_][0-9A-Z_$]*$/i.test(name);
+}
+
 export function capitalize(s: string): string {
   return s.charAt(0).toUpperCase() + s.slice(1);
 }