@typestyles/migrate 0.2.0 → 0.4.0

package/dist/chunk-D2W3OEBT.js

@@ -0,0 +1,868 @@
+#!/usr/bin/env node
+import { parse } from '@babel/parser';
+import generate from '@babel/generator';
+import traverse from '@babel/traverse';
+import * as t4 from '@babel/types';
+import postcss from 'postcss';
+import { readFile, writeFile, mkdir, stat } from 'fs/promises';
+import { relative, dirname, resolve, extname } from 'path';
+import { createPatch } from 'diff';
+import fg from 'fast-glob';
+import picomatch from 'picomatch';
+
+function camelCaseProperty(property) {
+  return property.replace(/-([a-z])/g, (_, letter) => letter.toUpperCase());
+}
+function toValueNode(value, varReplacements) {
+  const trimmed = value.trim();
+  if (varReplacements?.has(trimmed)) {
+    return varReplacements.get(trimmed);
+  }
+  if (/^-?\d+(\.\d+)?$/.test(trimmed)) {
+    return t4.numericLiteral(Number(trimmed));
+  }
+  return t4.stringLiteral(trimmed);
+}
+function toKeyNode(key) {
+  if (/^[A-Za-z_$][A-Za-z0-9_$]*$/.test(key)) {
+    return t4.identifier(key);
+  }
+  return t4.stringLiteral(key);
+}
+function nodesToObject(nodes, warnings, varReplacements) {
+  const properties = [];
+  for (const node of nodes ?? []) {
+    if (node.type === "decl") {
+      const normalized = node.prop.startsWith("--") ? node.prop : camelCaseProperty(node.prop);
+      properties.push(
+        t4.objectProperty(toKeyNode(normalized), toValueNode(node.value, varReplacements))
+      );
+      continue;
+    }
+    if (node.type === "rule") {
+      const nested = nodesToObject(node.nodes, warnings, varReplacements);
+      properties.push(t4.objectProperty(t4.stringLiteral(node.selector.trim()), nested));
+      continue;
+    }
+    if (node.type === "atrule") {
+      const nested = nodesToObject(node.nodes, warnings, varReplacements);
+      const atRuleKey = `@${node.name}${node.params ? ` ${node.params}` : ""}`;
+      properties.push(t4.objectProperty(t4.stringLiteral(atRuleKey), nested));
+      continue;
+    }
+    warnings.push({
+      message: `Unsupported CSS node "${node.type}" skipped.`
+    });
+  }
+  return t4.objectExpression(properties);
+}
+function cssToObjectExpression(cssText, warnings, varReplacements) {
+  try {
+    const root = postcss.parse(cssText);
+    return nodesToObject(root.nodes, warnings, varReplacements);
+  } catch (error) {
+    warnings.push({
+      message: `Could not parse CSS template literal: ${error.message}`
+    });
+    return null;
+  }
+}
+var PLACEHOLDER_PREFIX = "__ts_migrate_var_";
+function camelCaseProperty2(property) {
+  return property.replace(/-([a-z])/g, (_, letter) => letter.toUpperCase());
+}
+function placeholderToken(index) {
+  return `${PLACEHOLDER_PREFIX}${index}__`;
+}
+function extractSuffixFromQuasi(quasiText) {
+  const match = quasiText.match(/^([^;\n]*)/);
+  return match?.[1] ?? "";
+}
+function literalToCssValue(node) {
+  if (t4.isStringLiteral(node)) return node.value;
+  if (t4.isNumericLiteral(node)) return String(node.value);
+  return null;
+}
+function unwrapExpression(expression) {
+  if (t4.isParenthesizedExpression(expression)) {
+    return unwrapExpression(expression.expression);
+  }
+  return expression;
+}
+function extractCssPropertyBeforeInterpolation(quasiText) {
+  const match = quasiText.match(/([a-zA-Z-]+)\s*:\s*$/);
+  return match?.[1] ?? null;
+}
+function stripTrailingPropertyDeclaration(quasiText) {
+  return quasiText.replace(/[a-zA-Z-]+\s*:\s*$/, "");
+}
+function stripLeadingDeclarationRemainder(quasiText) {
+  const semiIdx = quasiText.indexOf(";");
+  if (semiIdx === -1) return quasiText;
+  return quasiText.slice(semiIdx + 1).trimStart();
+}
+function parsePropInterpolation(expression) {
+  if (!t4.isArrowFunctionExpression(expression)) return null;
+  const param = expression.params[0];
+  if (!param) return null;
+  const body = unwrapExpression(expression.body);
+  if (!t4.isExpression(body)) return null;
+  if (t4.isIdentifier(param)) {
+    if (t4.isMemberExpression(body) && !body.computed && t4.isIdentifier(body.object, { name: param.name }) && t4.isIdentifier(body.property)) {
+      return { propName: body.property.name };
+    }
+    return null;
+  }
+  if (t4.isObjectPattern(param) && t4.isIdentifier(body)) {
+    const propName = body.name;
+    const hasProp = param.properties.some((property) => {
+      if (!t4.isObjectProperty(property)) return false;
+      const keyName = t4.isIdentifier(property.key) ? property.key.name : t4.isStringLiteral(property.key) ? property.key.value : null;
+      return keyName === propName;
+    });
+    if (!hasProp) return null;
+    return { propName };
+  }
+  return null;
+}
+function parseBooleanTernaryInterpolation(expression) {
+  if (!t4.isArrowFunctionExpression(expression)) return null;
+  const param = expression.params[0];
+  if (!t4.isIdentifier(param)) return null;
+  const body = unwrapExpression(expression.body);
+  if (!t4.isConditionalExpression(body)) return null;
+  if (!t4.isMemberExpression(body.test) || body.test.computed || !t4.isIdentifier(body.test.object, { name: param.name }) || !t4.isIdentifier(body.test.property)) {
+    return null;
+  }
+  const trueValue = literalToCssValue(body.consequent);
+  const falseValue = literalToCssValue(body.alternate);
+  if (trueValue === null || falseValue === null) return null;
+  return {
+    propName: body.test.property.name,
+    trueValue,
+    falseValue
+  };
+}
+function parseTemplateInterpolations(template) {
+  const interpolations = [];
+  for (let i = 0; i < template.expressions.length; i++) {
+    const expression = template.expressions[i];
+    if (!t4.isExpression(expression)) return null;
+    const parsed = parsePropInterpolation(expression);
+    if (!parsed) return null;
+    const followingQuasi = template.quasis[i + 1]?.value.cooked ?? "";
+    interpolations.push({
+      index: i,
+      propName: parsed.propName,
+      suffix: extractSuffixFromQuasi(followingQuasi)
+    });
+  }
+  return interpolations;
+}
+function parseBooleanTemplateInterpolations(template) {
+  const interpolations = [];
+  for (let i = 0; i < template.expressions.length; i++) {
+    const expression = template.expressions[i];
+    if (!t4.isExpression(expression)) return null;
+    const parsed = parseBooleanTernaryInterpolation(expression);
+    if (!parsed) return null;
+    const quasiBefore = template.quasis[i]?.value.cooked ?? "";
+    const cssProperty = extractCssPropertyBeforeInterpolation(quasiBefore);
+    if (!cssProperty) return null;
+    interpolations.push({
+      index: i,
+      propName: parsed.propName,
+      trueValue: parsed.trueValue,
+      falseValue: parsed.falseValue,
+      cssProperty: camelCaseProperty2(cssProperty)
+    });
+  }
+  return interpolations;
+}
+function reconstructInterpolatedCss(template, interpolations) {
+  let result = "";
+  for (let i = 0; i < template.quasis.length; i++) {
+    let quasiText = template.quasis[i].value.cooked ?? "";
+    if (i > 0) {
+      const interpolation = interpolations[i - 1];
+      if (interpolation?.suffix && quasiText.startsWith(interpolation.suffix)) {
+        quasiText = quasiText.slice(interpolation.suffix.length);
+      }
+    }
+    result += quasiText;
+    if (i < interpolations.length) {
+      result += placeholderToken(interpolations[i].index);
+    }
+  }
+  return result;
+}
+function reconstructStaticCssWithoutVariants(template, booleanInterpolations) {
+  const skipIndices = new Set(booleanInterpolations.map((interpolation) => interpolation.index));
+  let result = "";
+  for (let i = 0; i < template.quasis.length; i++) {
+    let quasiText = template.quasis[i].value.cooked ?? "";
+    if (skipIndices.has(i)) {
+      quasiText = stripTrailingPropertyDeclaration(quasiText);
+    }
+    if (i > 0 && skipIndices.has(i - 1)) {
+      quasiText = stripLeadingDeclarationRemainder(quasiText);
+    }
+    result += quasiText;
+  }
+  return result.trim();
+}
+function toVarDebugName(componentName, propName) {
+  return `${componentName}${propName.charAt(0).toUpperCase()}${propName.slice(1)}`;
+}
+function toComponentConstName(componentName) {
+  if (!componentName) return componentName;
+  return componentName.charAt(0).toLowerCase() + componentName.slice(1);
+}
+function toCssValueNode(value) {
+  if (/^-?\d+(\.\d+)?$/.test(value.trim())) {
+    return t4.numericLiteral(Number(value));
+  }
+  return t4.stringLiteral(value);
+}
+function toKeyNode2(key) {
+  if (/^[A-Za-z_$][A-Za-z0-9_$]*$/.test(key)) {
+    return t4.identifier(key);
+  }
+  return t4.stringLiteral(key);
+}
+function buildVariantStyles(properties) {
+  return t4.objectExpression(
+    Object.entries(properties).map(
+      ([key, value]) => t4.objectProperty(toKeyNode2(key), toCssValueNode(value))
+    )
+  );
+}
+function buildVariantComponentConfig(baseObject, booleanInterpolations) {
+  const variantGroups = /* @__PURE__ */ new Map();
+  for (const interpolation of booleanInterpolations) {
+    const group = variantGroups.get(interpolation.propName) ?? { true: {}, false: {} };
+    group.true[interpolation.cssProperty] = interpolation.trueValue;
+    group.false[interpolation.cssProperty] = interpolation.falseValue;
+    variantGroups.set(interpolation.propName, group);
+  }
+  const variantsProperties = [...variantGroups.entries()].map(
+    ([propName, values]) => t4.objectProperty(
+      t4.identifier(propName),
+      t4.objectExpression([
+        t4.objectProperty(t4.identifier("true"), buildVariantStyles(values.true)),
+        t4.objectProperty(t4.identifier("false"), buildVariantStyles(values.false))
+      ])
+    )
+  );
+  const defaultVariantProperties = [...variantGroups.keys()].map(
+    (propName) => t4.objectProperty(t4.identifier(propName), t4.booleanLiteral(false))
+  );
+  return t4.objectExpression([
+    t4.objectProperty(t4.identifier("base"), baseObject),
+    t4.objectProperty(t4.identifier("variants"), t4.objectExpression(variantsProperties)),
+    t4.objectProperty(t4.identifier("defaultVariants"), t4.objectExpression(defaultVariantProperties))
+  ]);
+}
+
+// src/transform.ts
+function toKebabCase(input) {
+  return input.replace(/([a-z0-9])([A-Z])/g, "$1-$2").replace(/[_\s]+/g, "-").toLowerCase();
+}
+function memberExpressionToJsxName(expression) {
+  if (t4.isIdentifier(expression)) {
+    return t4.jsxIdentifier(expression.name);
+  }
+  if (t4.isMemberExpression(expression) && !expression.computed) {
+    const left = memberExpressionToJsxName(expression.object);
+    const right = t4.isIdentifier(expression.property) ? t4.jsxIdentifier(expression.property.name) : null;
+    if (!left || !right) return null;
+    return t4.jsxMemberExpression(left, right);
+  }
+  return null;
+}
+function parseStyledTarget(tag, styledNames) {
+  if (t4.isMemberExpression(tag) && t4.isIdentifier(tag.object) && styledNames.has(tag.object.name) && t4.isIdentifier(tag.property)) {
+    return { kind: "intrinsic", jsxName: t4.jsxIdentifier(tag.property.name) };
+  }
+  if (t4.isCallExpression(tag) && t4.isIdentifier(tag.callee) && styledNames.has(tag.callee.name)) {
+    const firstArg = tag.arguments[0];
+    if (!firstArg || !t4.isExpression(firstArg)) return null;
+    const jsxName = memberExpressionToJsxName(firstArg);
+    if (!jsxName) return null;
+    return { kind: "component", jsxName };
+  }
+  return null;
+}
+function addWarning(warnings, message, nodeName) {
+  warnings.push({ message, nodeName });
+}
+function createMergedClassExpression(existing, classNameExpression) {
+  return t4.callExpression(
+    t4.memberExpression(
+      t4.callExpression(
+        t4.memberExpression(
+          t4.arrayExpression([existing, classNameExpression]),
+          t4.identifier("filter")
+        ),
+        [t4.identifier("Boolean")]
+      ),
+      t4.identifier("join")
+    ),
+    [t4.stringLiteral(" ")]
+  );
+}
+function updateClassNameAttribute(openingElement, classNameExpression) {
+  const existingAttr = openingElement.attributes.find(
+    (attribute) => t4.isJSXAttribute(attribute) && t4.isJSXIdentifier(attribute.name, { name: "className" })
+  );
+  if (!existingAttr) {
+    openingElement.attributes.push(
+      t4.jsxAttribute(t4.jsxIdentifier("className"), t4.jsxExpressionContainer(classNameExpression))
+    );
+    return;
+  }
+  if (!existingAttr.value) {
+    existingAttr.value = t4.jsxExpressionContainer(classNameExpression);
+    return;
+  }
+  if (t4.isStringLiteral(existingAttr.value)) {
+    existingAttr.value = t4.jsxExpressionContainer(
+      createMergedClassExpression(t4.stringLiteral(existingAttr.value.value), classNameExpression)
+    );
+    return;
+  }
+  if (t4.isJSXExpressionContainer(existingAttr.value)) {
+    existingAttr.value = t4.jsxExpressionContainer(
+      createMergedClassExpression(
+        existingAttr.value.expression,
+        classNameExpression
+      )
+    );
+  }
+}
+function ensureTypestylesImport(ast, needsVars) {
+  const requiredSpecifiers = /* @__PURE__ */ new Set(["styles"]);
+  if (needsVars) {
+    requiredSpecifiers.add("createVar");
+    requiredSpecifiers.add("assignVars");
+  }
+  let typestylesImport = null;
+  for (const statement of ast.program.body) {
+    if (t4.isImportDeclaration(statement) && statement.source.value === "typestyles") {
+      typestylesImport = statement;
+      break;
+    }
+  }
+  const buildSpecifiers = (names) => [...names].map((name) => t4.importSpecifier(t4.identifier(name), t4.identifier(name)));
+  if (!typestylesImport) {
+    ast.program.body.unshift(
+      t4.importDeclaration(buildSpecifiers(requiredSpecifiers), t4.stringLiteral("typestyles"))
+    );
+    return;
+  }
+  for (const name of requiredSpecifiers) {
+    const hasSpecifier = typestylesImport.specifiers.some(
+      (specifier) => t4.isImportSpecifier(specifier) && t4.isIdentifier(specifier.imported, { name }) && t4.isIdentifier(specifier.local, { name })
+    );
+    if (!hasSpecifier) {
+      typestylesImport.specifiers.push(t4.importSpecifier(t4.identifier(name), t4.identifier(name)));
+    }
+  }
+}
+function cleanupUnusedImports(ast) {
+  traverse(ast, {
+    Program(path) {
+      path.scope.crawl();
+    },
+    ImportDeclaration(path) {
+      const unusedLocals = path.node.specifiers.filter((specifier) => {
+        if (path.node.source.value === "typestyles" && t4.isImportSpecifier(specifier) && (specifier.local.name === "styles" || specifier.local.name === "createVar" || specifier.local.name === "assignVars")) {
+          return false;
+        }
+        const local = specifier.local.name;
+        const binding = path.scope.getBinding(local);
+        return !binding || binding.referencePaths.length === 0;
+      });
+      if (unusedLocals.length === 0) return;
+      path.node.specifiers = path.node.specifiers.filter(
+        (specifier) => !unusedLocals.includes(specifier)
+      );
+      if (path.node.specifiers.length === 0) {
+        path.remove();
+      }
+    }
+  });
+}
+function createAssignVarValue(propExpression, suffix) {
+  if (!suffix) return propExpression;
+  if (t4.isStringLiteral(propExpression)) {
+    return t4.stringLiteral(`${propExpression.value}${suffix}`);
+  }
+  return t4.binaryExpression("+", propExpression, t4.stringLiteral(suffix));
+}
+function buildAssignVarsCall(propVars, propValues) {
+  const properties = propVars.filter((binding) => propValues.has(binding.propName)).map((binding) => {
+    const propExpression = propValues.get(binding.propName);
+    return t4.objectProperty(
+      t4.identifier(binding.varConstName),
+      createAssignVarValue(propExpression, binding.suffix),
+      true
+    );
+  });
+  return t4.callExpression(t4.identifier("assignVars"), [t4.objectExpression(properties)]);
+}
+function mergeStyleExpressions(existing, assignVarsCall) {
+  return t4.objectExpression([t4.spreadElement(existing), t4.spreadElement(assignVarsCall)]);
+}
+function updateStyleAttribute(openingElement, assignVarsCall) {
+  const existingAttr = openingElement.attributes.find(
+    (attribute) => t4.isJSXAttribute(attribute) && t4.isJSXIdentifier(attribute.name, { name: "style" })
+  );
+  if (!existingAttr) {
+    openingElement.attributes.push(
+      t4.jsxAttribute(t4.jsxIdentifier("style"), t4.jsxExpressionContainer(assignVarsCall))
+    );
+    return;
+  }
+  if (!existingAttr.value) {
+    existingAttr.value = t4.jsxExpressionContainer(assignVarsCall);
+    return;
+  }
+  if (t4.isJSXExpressionContainer(existingAttr.value)) {
+    existingAttr.value = t4.jsxExpressionContainer(
+      mergeStyleExpressions(existingAttr.value.expression, assignVarsCall)
+    );
+  }
+}
+function collectPropValuesFromJsx(openingElement, propNames) {
+  const values = /* @__PURE__ */ new Map();
+  for (const attribute of openingElement.attributes) {
+    if (!t4.isJSXAttribute(attribute) || !t4.isJSXIdentifier(attribute.name)) continue;
+    if (!propNames.has(attribute.name.name)) continue;
+    if (!attribute.value) {
+      values.set(attribute.name.name, t4.booleanLiteral(true));
+      continue;
+    }
+    if (t4.isStringLiteral(attribute.value)) {
+      values.set(attribute.name.name, t4.stringLiteral(attribute.value.value));
+      continue;
+    }
+    if (t4.isJSXExpressionContainer(attribute.value)) {
+      values.set(attribute.name.name, attribute.value.expression);
+    }
+  }
+  return values;
+}
+function removeStyledProps(openingElement, propNames) {
+  openingElement.attributes = openingElement.attributes.filter((attribute) => {
+    if (!t4.isJSXAttribute(attribute) || !t4.isJSXIdentifier(attribute.name)) return true;
+    return !propNames.has(attribute.name.name);
+  });
+}
+function buildComponentClassNameExpression(componentConstName, variantProps, propValues) {
+  const properties = variantProps.filter((propName) => propValues.has(propName)).map((propName) => t4.objectProperty(t4.identifier(propName), propValues.get(propName)));
+  if (properties.length === 0) {
+    return t4.callExpression(t4.identifier(componentConstName), []);
+  }
+  return t4.callExpression(t4.identifier(componentConstName), [t4.objectExpression(properties)]);
+}
+function migrateBooleanVariantTemplate(path, variableName, template, styledTarget, warnings, styledTransforms) {
+  const booleanInterpolations = parseBooleanTemplateInterpolations(template);
+  if (!booleanInterpolations) return false;
+  const staticCss = reconstructStaticCssWithoutVariants(template, booleanInterpolations);
+  const baseObject = cssToObjectExpression(staticCss, warnings);
+  if (!baseObject) {
+    addWarning(warnings, "Skipped because CSS could not be parsed.", variableName);
+    return false;
+  }
+  const componentConstName = path.scope.generateUidIdentifier(
+    toComponentConstName(variableName)
+  ).name;
+  const componentConfig = buildVariantComponentConfig(baseObject, booleanInterpolations);
+  const variantProps = [
+    ...new Set(booleanInterpolations.map((interpolation) => interpolation.propName))
+  ];
+  const declaration = path.parentPath;
+  if (!declaration.isVariableDeclaration()) return false;
+  declaration.node.declarations = [
+    t4.variableDeclarator(
+      t4.identifier(componentConstName),
+      t4.callExpression(t4.memberExpression(t4.identifier("styles"), t4.identifier("component")), [
+        t4.stringLiteral(toKebabCase(variableName)),
+        componentConfig
+      ])
+    )
+  ];
+  styledTransforms.set(variableName, {
+    originalName: variableName,
+    mode: "component",
+    classConstName: componentConstName,
+    target: styledTarget,
+    propVars: [],
+    variantProps
+  });
+  return true;
+}
+function migrateInterpolatedTemplate(path, variableName, template, styledTarget, warnings, styledTransforms) {
+  const interpolations = parseTemplateInterpolations(template);
+  if (!interpolations) {
+    addWarning(
+      warnings,
+      "Skipped template literal with unsupported interpolations. Only prop-based patterns like `${props => props.color}` are migrated.",
+      variableName
+    );
+    return false;
+  }
+  const cssText = reconstructInterpolatedCss(template, interpolations);
+  const propVars = interpolations.map((interpolation) => ({
+    propName: interpolation.propName,
+    varConstName: path.scope.generateUidIdentifier(
+      `${variableName}${interpolation.propName.charAt(0).toUpperCase()}${interpolation.propName.slice(1)}Var`
+    ).name,
+    suffix: interpolation.suffix
+  }));
+  const varReplacements = /* @__PURE__ */ new Map();
+  for (let i = 0; i < interpolations.length; i++) {
+    varReplacements.set(
+      placeholderToken(interpolations[i].index),
+      t4.identifier(propVars[i].varConstName)
+    );
+  }
+  const objectExpression4 = cssToObjectExpression(cssText, warnings, varReplacements);
+  if (!objectExpression4) {
+    addWarning(warnings, "Skipped because CSS could not be parsed.", variableName);
+    return false;
+  }
+  const classConstName = path.scope.generateUidIdentifier(`${variableName}Class`).name;
+  const varDeclarators = propVars.map(
+    (propVar) => t4.variableDeclarator(
+      t4.identifier(propVar.varConstName),
+      t4.callExpression(t4.identifier("createVar"), [
+        t4.stringLiteral(toVarDebugName(variableName, propVar.propName))
+      ])
+    )
+  );
+  const declaration = path.parentPath;
+  if (!declaration.isVariableDeclaration()) return false;
+  declaration.node.declarations = [
+    ...varDeclarators,
+    t4.variableDeclarator(
+      t4.identifier(classConstName),
+      t4.callExpression(t4.memberExpression(t4.identifier("styles"), t4.identifier("class")), [
+        t4.stringLiteral(toKebabCase(variableName)),
+        objectExpression4
+      ])
+    )
+  ];
+  styledTransforms.set(variableName, {
+    originalName: variableName,
+    mode: "class",
+    classConstName,
+    target: styledTarget,
+    propVars,
+    variantProps: []
+  });
+  return true;
+}
+function isOnlyJsxReferences(binding) {
+  return binding.referencePaths.every((referencePath) => {
+    const parent = referencePath.parentPath;
+    if (!parent) return false;
+    return parent.isJSXOpeningElement() && parent.get("name") === referencePath || parent.isJSXClosingElement() && parent.get("name") === referencePath;
+  });
+}
+function migrateSource(filePath, source) {
+  const warnings = [];
+  let changed = false;
+  const ast = parse(source, {
+    sourceType: "module",
+    plugins: ["typescript", "jsx"]
+  });
+  const styledNames = /* @__PURE__ */ new Set();
+  const cssTagNames = /* @__PURE__ */ new Set();
+  const styledTransforms = /* @__PURE__ */ new Map();
+  let needsVars = false;
+  traverse(ast, {
+    ImportDeclaration(path) {
+      if (path.node.source.value === "styled-components" || path.node.source.value === "@emotion/styled") {
+        for (const specifier of path.node.specifiers) {
+          if (t4.isImportDefaultSpecifier(specifier)) {
+            styledNames.add(specifier.local.name);
+          }
+          if (t4.isImportSpecifier(specifier) && t4.isIdentifier(specifier.imported, { name: "css" })) {
+            cssTagNames.add(specifier.local.name);
+          }
+        }
+      }
+      if (path.node.source.value === "@emotion/react" || path.node.source.value === "@emotion/css") {
+        for (const specifier of path.node.specifiers) {
+          if (t4.isImportSpecifier(specifier) && t4.isIdentifier(specifier.imported, { name: "css" })) {
+            cssTagNames.add(specifier.local.name);
+          }
+        }
+      }
+    }
+  });
+  traverse(ast, {
+    VariableDeclarator(path) {
+      if (!t4.isIdentifier(path.node.id)) return;
+      if (!t4.isTaggedTemplateExpression(path.node.init)) return;
+      const variableName = path.node.id.name;
+      const binding = path.scope.getBinding(variableName);
+      if (!binding) return;
+      const template = path.node.init.quasi;
+      const hasInterpolations = template.expressions.length > 0;
+      const styledTarget = parseStyledTarget(path.node.init.tag, styledNames);
+      if (hasInterpolations) {
+        if (!styledTarget) {
+          addWarning(
+            warnings,
+            "Skipped template literal with interpolations. Only styled-components prop patterns are migrated.",
+            variableName
+          );
+          return;
+        }
+        const declaration = path.parentPath;
+        if (declaration.parentPath?.isExportNamedDeclaration() || declaration.parentPath?.isExportDefaultDeclaration()) {
+          addWarning(
+            warnings,
+            "Skipped exported styled component to avoid changing external API shape.",
+            variableName
+          );
+          return;
+        }
+        if (!isOnlyJsxReferences(binding)) {
+          addWarning(warnings, "Skipped styled component with non-JSX references.", variableName);
+          return;
+        }
+        if (migrateBooleanVariantTemplate(
+          path,
+          variableName,
+          template,
+          styledTarget,
+          warnings,
+          styledTransforms
+        )) {
+          changed = true;
+          return;
+        }
+        if (migrateInterpolatedTemplate(
+          path,
+          variableName,
+          template,
+          styledTarget,
+          warnings,
+          styledTransforms
+        )) {
+          needsVars = true;
+          changed = true;
+        }
+        return;
+      }
+      const cssText = template.quasis.map((quasi) => quasi.value.cooked ?? "").join("");
+      const objectExpression4 = cssToObjectExpression(cssText, warnings);
+      if (!objectExpression4) {
+        addWarning(warnings, "Skipped because CSS could not be parsed.", variableName);
+        return;
+      }
+      if (styledTarget) {
+        const declaration = path.parentPath;
+        if (declaration.parentPath?.isExportNamedDeclaration() || declaration.parentPath?.isExportDefaultDeclaration()) {
+          addWarning(
+            warnings,
+            "Skipped exported styled component to avoid changing external API shape.",
+            variableName
+          );
+          return;
+        }
+        if (!isOnlyJsxReferences(binding)) {
+          addWarning(warnings, "Skipped styled component with non-JSX references.", variableName);
+          return;
+        }
+        const classConstName = path.scope.generateUidIdentifier(`${variableName}Class`).name;
+        path.node.id = t4.identifier(classConstName);
+        path.node.init = t4.callExpression(
+          t4.memberExpression(t4.identifier("styles"), t4.identifier("class")),
+          [t4.stringLiteral(toKebabCase(variableName)), objectExpression4]
+        );
+        styledTransforms.set(variableName, {
+          originalName: variableName,
+          mode: "class",
+          classConstName,
+          target: styledTarget,
+          propVars: [],
+          variantProps: []
+        });
+        changed = true;
+        return;
+      }
+      if (t4.isIdentifier(path.node.init.tag) && cssTagNames.has(path.node.init.tag.name)) {
+        path.node.init = t4.callExpression(
+          t4.memberExpression(t4.identifier("styles"), t4.identifier("class")),
+          [t4.stringLiteral(toKebabCase(variableName)), objectExpression4]
+        );
+        changed = true;
+      }
+    }
+  });
+  if (styledTransforms.size > 0) {
+    traverse(ast, {
+      JSXElement(path) {
+        const openingName = path.node.openingElement.name;
+        if (!t4.isJSXIdentifier(openingName)) return;
+        const transform = styledTransforms.get(openingName.name);
+        if (!transform) return;
+        path.node.openingElement.name = transform.target.jsxName;
+        if (path.node.closingElement) {
+          path.node.closingElement.name = transform.target.jsxName;
+        }
+        const classNameExpression = transform.mode === "component" ? buildComponentClassNameExpression(
+          transform.classConstName,
+          transform.variantProps,
+          collectPropValuesFromJsx(path.node.openingElement, new Set(transform.variantProps))
+        ) : t4.identifier(transform.classConstName);
+        updateClassNameAttribute(path.node.openingElement, classNameExpression);
+        if (transform.propVars.length > 0) {
+          const propNames = new Set(transform.propVars.map((propVar) => propVar.propName));
+          const propValues = collectPropValuesFromJsx(path.node.openingElement, propNames);
+          if (propValues.size > 0) {
+            const assignVarsCall = buildAssignVarsCall(transform.propVars, propValues);
+            updateStyleAttribute(path.node.openingElement, assignVarsCall);
+            removeStyledProps(path.node.openingElement, propNames);
+          }
+        }
+        if (transform.variantProps.length > 0) {
+          removeStyledProps(path.node.openingElement, new Set(transform.variantProps));
+        }
+      }
+    });
+  }
+  if (changed) {
+    ensureTypestylesImport(ast, needsVars);
+    cleanupUnusedImports(ast);
+  }
+  const output = generate(
+    ast,
+    {
+      retainLines: false,
+      comments: true,
+      concise: false
+    },
+    source
+  );
+  return {
+    filePath,
+    changed: changed && output.code !== source,
+    code: output.code,
+    warnings
+  };
+}
+var DEFAULT_EXCLUDES = ["**/node_modules/**", "**/dist/**", "**/.next/**", "**/.turbo/**"];
+function normalizeExtension(extension) {
+  return extension.startsWith(".") ? extension : `.${extension}`;
+}
+async function collectTargetFiles(cwd, targets, extensions, include, exclude) {
+  const normalizedTargets = targets.length > 0 ? targets : ["."];
+  const literalFiles = [];
+  const dynamicPatterns = [];
+  for (const target of normalizedTargets) {
+    const absolute = resolve(cwd, target);
+    try {
+      const targetStat = await stat(absolute);
+      if (targetStat.isFile()) {
+        literalFiles.push(absolute);
+      } else if (targetStat.isDirectory()) {
+        dynamicPatterns.push(`${absolute.split("\\").join("/")}/**/*`);
+      }
+    } catch {
+      dynamicPatterns.push(target);
+    }
+  }
+  const globbed = await fg(dynamicPatterns, {
+    cwd,
+    absolute: true,
+    onlyFiles: true,
+    ignore: [...DEFAULT_EXCLUDES, ...exclude]
+  });
+  const extensionSet = new Set(extensions.map(normalizeExtension));
+  const includeMatchers = include.length > 0 ? include.map((pattern) => picomatch(pattern)) : null;
+  const unique = /* @__PURE__ */ new Set([...literalFiles, ...globbed]);
+  return Array.from(unique).filter((filePath) => extensionSet.has(extname(filePath))).filter((filePath) => {
+    if (!includeMatchers) return true;
+    const rel = relative(cwd, filePath).split("\\").join("/");
+    return includeMatchers.some((matcher) => matcher(rel));
+  }).sort();
+}
+
+// src/migrate.ts
+function renderPatch(filePath, before, after) {
+  return createPatch(filePath, before, after, "before", "after").split("\n").slice(2).join("\n");
+}
+async function runMigration(cwd, options) {
+  const files = await collectTargetFiles(
+    cwd,
+    options.targets,
+    options.extensions,
+    options.include,
+    options.exclude
+  );
+  const reportEntries = [];
+  let changedCount = 0;
+  let warningCount = 0;
+  for (const filePath of files) {
+    const before = await readFile(filePath, "utf8");
+    const result = migrateSource(filePath, before);
+    const relativePath = relative(cwd, filePath);
+    warningCount += result.warnings.length;
+    if (result.changed) {
+      changedCount += 1;
+      if (options.write) {
+        await writeFile(filePath, result.code, "utf8");
+        process.stdout.write(`updated ${relativePath}
+`);
+      } else {
+        process.stdout.write(`
+--- ${relativePath} (dry-run) ---
+`);
+        process.stdout.write(`${renderPatch(relativePath, before, result.code)}
+`);
+      }
+    }
+    for (const warning of result.warnings) {
+      const nodeLabel = warning.nodeName ? ` (${warning.nodeName})` : "";
+      process.stdout.write(`warning ${relativePath}${nodeLabel}: ${warning.message}
+`);
+    }
+    reportEntries.push({
+      filePath: relativePath,
+      changed: result.changed,
+      warnings: result.warnings
+    });
+  }
+  const summary = {
+    filesScanned: files.length,
+    filesChanged: changedCount,
+    warnings: warningCount
+  };
+  process.stdout.write(
+    `
+Scanned ${summary.filesScanned} files, changed ${summary.filesChanged}, warnings ${summary.warnings}.
+`
+  );
+  const report = {
+    summary,
+    files: reportEntries
+  };
+  if (options.reportPath) {
+    await mkdir(dirname(options.reportPath), { recursive: true });
+    await writeFile(options.reportPath, `${JSON.stringify(report, null, 2)}
+`, "utf8");
+    process.stdout.write(`Report written to ${options.reportPath}
+`);
+  }
+  return report;
+}
+
+export { migrateSource, runMigration };
+//# sourceMappingURL=chunk-D2W3OEBT.js.map
+//# sourceMappingURL=chunk-D2W3OEBT.js.map