styled-components-to-stylex-codemod 0.0.45 → 0.0.47

package/dist/{bridge-consumer-patcher-DNsxze1l.mjs → bridge-consumer-patcher-CjR2kIOd.mjs}

@@ -1,6 +1,6 @@
-import { n as toRealPath } from "./path-utils-BIpoL4Ue.mjs";
+import { r as toRealPath } from "./path-utils-BC4U8X_q.mjs";
 import { r as escapeRegex } from "./string-utils-DD9wdRHW.mjs";
-import { t as isSelectorContext } from "./selector-context-heuristic-CGggN74M.mjs";
+import { t as isSelectorContext } from "./selector-context-heuristic-LVizWWOR.mjs";
 import { readFileSync } from "node:fs";
 //#region src/internal/bridge-consumer-patcher.ts
 /**

package/dist/{compute-leaf-set-Be5Cgxnr.mjs → compute-leaf-set-90UrZ9WP.mjs}

@@ -1,4 +1,4 @@
-import { o as resolveBarrelReExportBinding, r as findImportSource } from "./extract-external-interface-B61N1a6q.mjs";
+import { o as resolveBarrelReExportBinding, r as findImportSource } from "./extract-external-interface-CvkkJZb1.mjs";
 //#region src/internal/prepass/compute-leaf-set.ts
 /**
 * Computes which styled-component bindings are "leaves" for leaves-only mode:

package/dist/{extract-external-interface-B61N1a6q.mjs → extract-external-interface-CvkkJZb1.mjs}

@@ -5,6 +5,7 @@ import { readFileSync } from "node:fs";
 * Logger and warning types for transform diagnostics.
 * Core concepts: severity classification and source context reporting.
 */
+const UNSUPPORTED_SHOULD_FORWARD_PROP_WARNING = "Unsupported shouldForwardProp pattern (only !prop.startsWith(), ![].includes(prop), and prop !== are supported)";
 /**
 * When fileCount <= this threshold, warnings are printed per-file inline and
 * the summary is skipped. Above the threshold only the summary is printed.
@@ -379,4 +380,4 @@ function getFileImportsFromRes(name) {
 	return cached;
 }
 //#endregion
-export { resolveBarrelReExport as a, getReExportedSourceName as i, fileImportsFrom as n, resolveBarrelReExportBinding as o, findImportSource as r, Logger as s, fileExports as t };
+export { resolveBarrelReExport as a, UNSUPPORTED_SHOULD_FORWARD_PROP_WARNING as c, getReExportedSourceName as i, fileImportsFrom as n, resolveBarrelReExportBinding as o, findImportSource as r, Logger as s, fileExports as t };

package/dist/{forwarded-as-consumer-patcher-DoVqLOgw.mjs → forwarded-as-consumer-patcher-CaLmjoiP.mjs}

@@ -1,4 +1,4 @@
-import { n as toRealPath } from "./path-utils-BIpoL4Ue.mjs";
+import { r as toRealPath } from "./path-utils-BC4U8X_q.mjs";
 import { r as escapeRegex } from "./string-utils-DD9wdRHW.mjs";
 import { readFileSync } from "node:fs";
 //#region src/internal/forwarded-as-consumer-patcher.ts

package/dist/index.d.mts

@@ -1,4 +1,4 @@
-import { a as CollectedWarning, c as MarkerFileContext, l as defineAdapter, n as TransformMode, o as AdapterInput, s as ImportSource } from "./transform-types-CQjiY4Yp.mjs";
+import { a as CollectedWarning, c as MarkerFileContext, l as defineAdapter, n as TransformMode, o as AdapterInput, s as ImportSource } from "./transform-types-Bshr_dBf.mjs";
 
 //#region src/run.d.ts
 interface RunTransformOptions {

package/dist/index.mjs

@@ -1,7 +1,7 @@
-import { c as describeValue, i as defineAdapter, n as mergeMarkerDeclarations, s as assertValidAdapterInput, t as transformedComponentAcceptsSx } from "./sx-surface-DBy6tOUv.mjs";
-import { a as resolveBarrelReExport, s as Logger } from "./extract-external-interface-B61N1a6q.mjs";
-import { r as extractStyledDefBasesFromSource } from "./compute-leaf-set-Be5Cgxnr.mjs";
-import { n as toRealPath } from "./path-utils-BIpoL4Ue.mjs";
+import { c as describeValue, i as defineAdapter, n as mergeMarkerDeclarations, s as assertValidAdapterInput, t as transformedComponentAcceptsSx } from "./sx-surface-BzqO3hcC.mjs";
+import { a as resolveBarrelReExport, s as Logger } from "./extract-external-interface-CvkkJZb1.mjs";
+import { r as extractStyledDefBasesFromSource } from "./compute-leaf-set-90UrZ9WP.mjs";
+import { r as toRealPath } from "./path-utils-BC4U8X_q.mjs";
 import jscodeshift from "jscodeshift";
 import { fileURLToPath, pathToFileURL } from "node:url";
 import { dirname, join, resolve } from "node:path";
@@ -149,7 +149,7 @@ async function runTransform(options) {
 	const { createModuleResolver } = await import("./resolve-imports-DgSAddIF.mjs").then((n) => n.n);
 	const sharedResolver = createModuleResolver();
 	filePaths = orderFilesByLocalImportDependencies(filePaths, sharedResolver, toRealPath);
-	const { runPrepass } = await import("./run-prepass-COJ2IOPl.mjs");
+	const { runPrepass } = await import("./run-prepass-1yZOVT3P.mjs");
 	const absoluteFiles = filePaths.map((f) => resolve(f));
 	const absoluteConsumers = consumerFilePaths.map((f) => resolve(f));
 	let prepassResult;
@@ -252,7 +252,12 @@ async function runTransform(options) {
 					const autoInterfaceNames = ctx.importedName === "default" ? [ctx.localName, ctx.importedName] : [ctx.importedName];
 					const styledDefinitionNames = getStyledDefinitionNames(definitionSourcePath);
 					const sourceComponentNames = ctx.importedName === "default" ? [ctx.localName, getDefaultExportedName(definitionSourcePath)].filter((name) => typeof name === "string") : [ctx.importedName];
-					if (findTypedComponentMetadata(prepassResult.typeScriptMetadata, definitionSourcePath, sourceComponentNames)?.supportsSxProp === true) return { acceptsSx: true };
+					const typedComponent = findTypedComponentMetadata(prepassResult.typeScriptMetadata, definitionSourcePath, sourceComponentNames);
+					if (typedComponent?.supportsSxProp === true) return {
+						acceptsSx: true,
+						sxExcludedProperties: typedComponent.sxExcludedProperties,
+						sxAllowedProperties: typedComponent.sxAllowedProperties
+					};
 					if (transformedComponentAcceptsSx({
 						absolutePath: definitionSourcePath,
 						componentNames: sourceComponentNames,
@@ -343,7 +348,7 @@ async function runTransform(options) {
 	const result = await runTransformSequentially(transformModule, filePaths, runnerOptions);
 	if (sidecarFiles.size > 0 && !dryRun) for (const [sidecarPath, content] of sidecarFiles) await writeFile(sidecarPath, mergeSidecarContent(sidecarPath, content), "utf-8");
 	if (bridgeResults.size > 0 && !dryRun) {
-		const { buildConsumerReplacements, patchConsumerFile } = await import("./bridge-consumer-patcher-DNsxze1l.mjs");
+		const { buildConsumerReplacements, patchConsumerFile } = await import("./bridge-consumer-patcher-CjR2kIOd.mjs");
 		const consumerReplacements = buildConsumerReplacements(crossFilePrepassResult.selectorUsages, bridgeResults, transformedFiles);
 		const patchedFiles = [];
 		for (const [consumerPath, replacements] of consumerReplacements) {
@@ -356,7 +361,7 @@ async function runTransform(options) {
 		if (formatterCommands && patchedFiles.length > 0) await runFormatters(formatterCommands, patchedFiles);
 	}
 	if (prepassResult.forwardedAsConsumers.size > 0 && !dryRun) {
-		const { buildForwardedAsReplacements, patchConsumerForwardedAs } = await import("./forwarded-as-consumer-patcher-DoVqLOgw.mjs");
+		const { buildForwardedAsReplacements, patchConsumerForwardedAs } = await import("./forwarded-as-consumer-patcher-CaLmjoiP.mjs");
 		const forwardedAsReplacements = buildForwardedAsReplacements(prepassResult.forwardedAsConsumers, transformedFiles);
 		const patchedFiles = [];
 		for (const [consumerPath, entries] of forwardedAsReplacements) {
@@ -369,7 +374,7 @@ async function runTransform(options) {
 		if (formatterCommands && patchedFiles.length > 0) await runFormatters(formatterCommands, patchedFiles);
 	}
 	if (transientPropRenames.size > 0 && !dryRun) {
-		const { collectTransientPropPatches } = await import("./transient-prop-consumer-patcher-BX-LeC2B.mjs");
+		const { collectTransientPropPatches } = await import("./transient-prop-consumer-patcher-DGSFnxSo.mjs");
 		const patches = collectTransientPropPatches({
 			transientPropRenames,
 			consumerFilePaths: consumerFilePaths.map((p) => resolve(p)),

package/dist/{path-utils-BIpoL4Ue.mjs → path-utils-BC4U8X_q.mjs}

@@ -1,5 +1,5 @@
 import { resolve } from "node:path";
-import { realpathSync } from "node:fs";
+import { existsSync, realpathSync } from "node:fs";
 //#region src/internal/utilities/path-utils.ts
 /**
 * Shared path utilities for symlink resolution and path normalization.
@@ -26,5 +26,29 @@ function toRealPath(filePath) {
 function isRelativeSpecifier(specifier) {
 	return specifier === "." || specifier === ".." || specifier.startsWith("./") || specifier.startsWith("../") || specifier.startsWith(".\\") || specifier.startsWith("..\\");
 }
+/**
+* Resolve a source file path to an existing implementation file when possible,
+* accepting extensionless imports and index modules before resolving symlinks.
+*/
+function resolveExistingFilePath(filePath) {
+	const resolved = resolveExistingSourceFilePath(filePath);
+	return existsSync(resolved) ? toRealPath(resolved) : resolved;
+}
+function resolveExistingSourceFilePath(filePath) {
+	const resolved = resolve(filePath);
+	if (existsSync(resolved)) return resolved;
+	for (const extension of [
+		".tsx",
+		".ts",
+		".jsx",
+		".js",
+		"/index.tsx",
+		"/index.ts"
+	]) {
+		const candidate = `${resolved}${extension}`;
+		if (existsSync(candidate)) return candidate;
+	}
+	return resolved;
+}
 //#endregion
-export { toRealPath as n, isRelativeSpecifier as t };
+export { resolveExistingFilePath as n, toRealPath as r, isRelativeSpecifier as t };

package/dist/prop-usage-Bz3z0V2F.mjs

@@ -0,0 +1,65 @@
+//#region src/internal/utilities/jsx-static-literal.ts
+function readStaticJsxLiteral(attr) {
+	if (!isObjectRecord(attr) || attr.type !== "JSXAttribute") return;
+	if (!("value" in attr) || attr.value == null) return true;
+	const directLiteral = readLiteralNodeValue(attr.value);
+	if (directLiteral !== void 0) return directLiteral;
+	if (!isObjectRecord(attr.value) || attr.value.type !== "JSXExpressionContainer") return;
+	return readLiteralNodeValue(attr.value.expression);
+}
+function readLiteralNodeValue(node) {
+	if (!isObjectRecord(node)) return;
+	if (node.type === "StringLiteral" || node.type === "NumericLiteral" || node.type === "BooleanLiteral") return isStaticLiteral(node.value) ? node.value : void 0;
+	if (node.type === "Literal") return isStaticLiteral(node.value) ? node.value : void 0;
+	if (node.type === "UnaryExpression" && node.operator === "-") {
+		const value = readLiteralNodeValue(node.argument);
+		return typeof value === "number" ? -value : void 0;
+	}
+}
+function isObjectRecord(value) {
+	return typeof value === "object" && value !== null;
+}
+function isStaticLiteral(value) {
+	return typeof value === "string" || typeof value === "number" || typeof value === "boolean";
+}
+//#endregion
+//#region src/internal/utilities/prop-usage.ts
+const KNOWN_NON_ELEMENT_PROPS = new Set([
+	"className",
+	"style",
+	"as",
+	"ref",
+	"forwardedAs",
+	"key",
+	"children"
+]);
+function createComponentPropUsageInfo(name) {
+	return {
+		componentName: name,
+		usageCount: 0,
+		hasUnknownUsage: false,
+		props: {}
+	};
+}
+function mergeComponentPropUsage(info, usage) {
+	info.usageCount += 1;
+	if (usage.hasSpread) info.hasUnknownUsage = true;
+	const presentProps = new Set(Object.keys(usage.props));
+	for (const [propName, propInfo] of Object.entries(info.props)) if (!presentProps.has(propName)) propInfo.omittedCount += 1;
+	for (const [propName, value] of Object.entries(usage.props)) {
+		const propInfo = info.props[propName] ?? (info.props[propName] = {
+			values: [],
+			hasUnknown: false,
+			usageCount: 0,
+			omittedCount: info.usageCount - 1
+		});
+		propInfo.usageCount += 1;
+		if (value.kind === "unknown") {
+			propInfo.hasUnknown = true;
+			continue;
+		}
+		if (!propInfo.values.some((existing) => existing === value.value)) propInfo.values.push(value.value);
+	}
+}
+//#endregion
+export { readStaticJsxLiteral as i, createComponentPropUsageInfo as n, mergeComponentPropUsage as r, KNOWN_NON_ELEMENT_PROPS as t };

package/dist/{run-prepass-COJ2IOPl.mjs → run-prepass-1yZOVT3P.mjs}

@@ -1,8 +1,8 @@
-import { a as resolveBarrelReExport, n as fileImportsFrom, o as resolveBarrelReExportBinding, r as findImportSource, s as Logger, t as fileExports } from "./extract-external-interface-B61N1a6q.mjs";
-import { n as extractStyledDefBasesFromAstProgram, r as extractStyledDefBasesFromSource, t as computeGlobalLeafKeys } from "./compute-leaf-set-Be5Cgxnr.mjs";
+import { a as resolveBarrelReExport, n as fileImportsFrom, o as resolveBarrelReExportBinding, r as findImportSource, s as Logger, t as fileExports } from "./extract-external-interface-CvkkJZb1.mjs";
+import { n as extractStyledDefBasesFromAstProgram, r as extractStyledDefBasesFromSource, t as computeGlobalLeafKeys } from "./compute-leaf-set-90UrZ9WP.mjs";
 import { r as escapeRegex } from "./string-utils-DD9wdRHW.mjs";
-import { a as PLACEHOLDER_RE, i as readStaticJsxLiteral, n as createComponentPropUsageInfo, r as mergeComponentPropUsage, t as KNOWN_NON_ELEMENT_PROPS } from "./prop-usage-B6z4WOPr.mjs";
-import { t as isSelectorContext } from "./selector-context-heuristic-CGggN74M.mjs";
+import { n as isTemplatePlaceholderInSelectorContext, r as PLACEHOLDER_RE, t as isSelectorContext } from "./selector-context-heuristic-LVizWWOR.mjs";
+import { i as readStaticJsxLiteral, n as createComponentPropUsageInfo, r as mergeComponentPropUsage, t as KNOWN_NON_ELEMENT_PROPS } from "./prop-usage-Bz3z0V2F.mjs";
 import { relative, resolve } from "node:path";
 import { readFileSync, realpathSync } from "node:fs";
 import { execSync } from "node:child_process";
@@ -327,7 +327,7 @@ function findComponentSelectorLocalsFromNodes(templateNodes, styledImportName, c
 		for (const match of rawCss.matchAll(PLACEHOLDER_RE_G)) {
 			const exprIndex = Number(match[1]);
 			const pos = match.index;
-			if (isPlaceholderInSelectorContext(rawCss, pos, match[0].length)) {
+			if (isTemplatePlaceholderInSelectorContext(rawCss, pos, match[0].length)) {
 				const expr = expressions[exprIndex];
 				if (expr?.type === "Identifier" && typeof expr.name === "string") selectorLocals.add(expr.name);
 			}
@@ -357,11 +357,6 @@ function isCssTag(tag, cssImportNames) {
 	if (!tag || !cssImportNames || cssImportNames.size === 0) return false;
 	return tag.type === "Identifier" && typeof tag.name === "string" && cssImportNames.has(tag.name);
 }
-/** Check if a placeholder at the given position is in a CSS selector context. */
-function isPlaceholderInSelectorContext(rawCss, pos, length) {
-	const after = rawCss.slice(pos + length).trimStart();
-	return isSelectorContext(rawCss.slice(0, pos).trimEnd().replace(PLACEHOLDER_RE_G, "hover"), after);
-}
 /** Safely extract the name string from an AST identifier-like node. */
 function getNodeName(node) {
 	if (!node || typeof node !== "object") return;
@@ -755,7 +750,7 @@ function isTypeScriptParser(parserName) {
 }
 async function loadTypeScriptAnalysis() {
 	try {
-		return await import("./typescript-analysis-UWX_ePX0.mjs");
+		return await import("./typescript-analysis-C_25uBrt.mjs");
 	} catch (err) {
 		const message = err instanceof Error ? err.message : String(err);
 		if (message.includes("typescript") && (message.includes("Cannot find") || message.includes("ERR_MODULE_NOT_FOUND"))) throw new Error(["TypeScript parser runs require the optional `typescript` package for compiler metadata.", "Install TypeScript in the project (supported range: >=5.0.0 <6), or use a non-TypeScript parser."].join("\n"));

package/dist/selector-context-heuristic-LVizWWOR.mjs

@@ -0,0 +1,114 @@
+import { compile } from "stylis";
+//#region src/internal/styled-css.ts
+/** Matches `__SC_EXPR_N__` and captures the slot index in group 1. */
+const PLACEHOLDER_RE = /__SC_EXPR_(\d+)__/;
+function parseStyledTemplateLiteral(template) {
+	const parts = [];
+	const slots = [];
+	for (let i = 0; i < template.quasis.length; i++) {
+		const quasi = template.quasis[i];
+		parts.push(quasi.value.raw);
+		const expr = template.expressions[i];
+		if (!expr) continue;
+		const placeholder = makeInterpolationPlaceholder(i);
+		const startOffset = parts.join("").length;
+		parts.push(placeholder);
+		const endOffset = parts.join("").length;
+		slots.push({
+			index: i,
+			placeholder,
+			expression: expr,
+			startOffset,
+			endOffset
+		});
+	}
+	const rawCss = parts.join("");
+	return {
+		rawCss,
+		slots,
+		stylisAst: compile(terminateStandaloneInterpolationStatements(rawCss))
+	};
+}
+function terminateStandaloneInterpolationStatements(css) {
+	let parenDepth = 0;
+	const lines = css.split(/(?<=\n)/);
+	const depthsBeforeLine = [];
+	for (const line of lines) {
+		depthsBeforeLine.push(parenDepth);
+		parenDepth = updateParenDepth(parenDepth, line);
+	}
+	return lines.map((line, index) => {
+		return depthsBeforeLine[index] === 0 && /^\s*__SC_EXPR_\d+__\s*$/.test(line) && isBeforeAtRule(lines, index) ? line.replace(/(\s*)$/, ";$1") : line;
+	}).join("");
+}
+function makeInterpolationPlaceholder(index) {
+	return `__SC_EXPR_${index}__`;
+}
+function isBeforeAtRule(lines, startIndex) {
+	for (let i = startIndex + 1; i < lines.length; i++) {
+		const trimmed = lines[i].trim();
+		if (!trimmed || /^__SC_EXPR_\d+__\s*;?$/.test(trimmed)) continue;
+		return trimmed.startsWith("@");
+	}
+	return false;
+}
+function updateParenDepth(startDepth, line) {
+	let depth = startDepth;
+	let inString = false;
+	for (let i = 0; i < line.length; i++) {
+		const ch = line[i];
+		if ((ch === "\"" || ch === "'") && line[i - 1] !== "\\") {
+			if (!inString) inString = ch;
+			else if (inString === ch) inString = false;
+			continue;
+		}
+		if (inString) continue;
+		if (ch === "(") depth++;
+		else if (ch === ")") depth = Math.max(0, depth - 1);
+	}
+	return depth;
+}
+//#endregion
+//#region src/internal/utilities/selector-context-heuristic.ts
+/**
+* Shared heuristic for determining whether a placeholder/expression is in a
+* CSS selector context rather than a property value context.
+*
+* Used by both the prepass scanner (on reconstructed CSS with placeholders)
+* and the consumer patcher (on raw TypeScript source).
+*/
+/**
+* Given the text before and after a template expression, determine if the
+* expression is in a CSS selector context (e.g. `${Foo} { ... }`) rather
+* than a property value context (e.g. `color: ${Foo};`).
+*
+* Selector clues:
+*   - Followed by `{` → definitely a selector
+*   - `{` appears before next `;` without a value-separator colon → likely selector
+*
+* Value clues:
+*   - Preceded by `:` with no intervening `{`, `}`, or `;` → value context
+*     (but `:hover`, `:focus` etc. are pseudo-selectors, not values)
+*/
+function isSelectorContext(before, after) {
+	const lastSemiOrBrace = Math.max(before.lastIndexOf(";"), before.lastIndexOf("{"), before.lastIndexOf("}"));
+	const lastColon = before.lastIndexOf(":");
+	if (lastColon > lastSemiOrBrace) {
+		const colonContext = before.slice(lastColon).trim();
+		if (!/^:[a-z-]+/i.test(colonContext)) return false;
+	}
+	if (after.startsWith("{")) return true;
+	const afterUpToBrace = after.split("{")[0] ?? "";
+	const afterUpToSemi = after.split(";")[0] ?? "";
+	if (afterUpToBrace.length < afterUpToSemi.length) {
+		if (!/:\s|:$/.test(afterUpToBrace)) return true;
+	}
+	return false;
+}
+const TEMPLATE_PLACEHOLDER_RE = new RegExp(PLACEHOLDER_RE.source, "g");
+function isTemplatePlaceholderInSelectorContext(rawCss, pos, length) {
+	const after = rawCss.slice(pos + length).trimStart();
+	return isSelectorContext(rawCss.slice(0, pos).trimEnd().replace(TEMPLATE_PLACEHOLDER_RE, "hover"), after);
+}
+//#endregion
+export { terminateStandaloneInterpolationStatements as a, parseStyledTemplateLiteral as i, isTemplatePlaceholderInSelectorContext as n, PLACEHOLDER_RE as r, isSelectorContext as t };

package/dist/{sx-surface-DBy6tOUv.mjs → sx-surface-BzqO3hcC.mjs}

@@ -1,4 +1,4 @@
-import { n as toRealPath } from "./path-utils-BIpoL4Ue.mjs";
+import { r as toRealPath } from "./path-utils-BC4U8X_q.mjs";
 import { existsSync, readFileSync } from "node:fs";
 //#region src/internal/public-api-validation.ts
 function describeValue(value) {
@@ -148,7 +148,7 @@ function assertAdapterShape(candidate, where, allowAutoExtIf) {
 		"",
 		"Expected signature:",
 		"  wrappedComponentInterface(ctx: { localName: string; importSource: string; importedName: string; filePath: string })",
-		"    => { acceptsSx: boolean } | undefined"
+		"    => { acceptsSx: boolean; sxAllowedProperties?: string[]; sxExcludedProperties?: string[] } | undefined"
 	].join("\n"));
 	const themeHook = obj?.themeHook;
 	if (themeHook !== null && themeHook !== void 0) {

package/dist/{transform-types-CQjiY4Yp.d.mts → transform-types-Bshr_dBf.d.mts}

@@ -377,7 +377,7 @@ interface ResolveBaseComponentContext {
   importSource: string;
   /**
    * Imported binding name for the wrapped base component.
-   * Example: `import { Flex as OrbiterFlex } ...` -> importedName: "Flex"
+   * Example: `import { Flex as DesignSystemFlex } ...` -> importedName: "Flex"
    */
   importedName: string;
   /**
@@ -606,6 +606,37 @@ interface WrappedComponentInterfaceContext {
  */
 interface WrappedComponentInterfaceResult {
   acceptsSx: boolean;
+  /**
+   * Which element receives the wrapped component's `sx` prop.
+   *
+   * Most components apply `sx` to their root. Some controls expose `sx` for an
+   * inner element while `className`/`style` still target the outer root. Mark
+   * those as `"inner"` so the codemod can reject root-only wrapper styles
+   * instead of moving layout styles onto the wrong element.
+   */
+  sxTarget?: "root" | "inner";
+  /**
+   * StyleX property names that must stay on the wrapped component root when
+   * `sxTarget` is `"inner"`.
+   */
+  rootOnlyProperties?: string[];
+  /**
+   * StyleX property names that the wrapped component's `sx` prop explicitly rejects.
+   *
+   * Some components accept `sx`, but narrow it with `StyleXStylesWithout<...>` to
+   * reserve properties that the component owns internally. The transform can still
+   * use `sx` if it rewrites generated styles away from those excluded properties.
+   */
+  sxExcludedProperties?: string[];
+  /**
+   * StyleX property names that the wrapped component's `sx` prop accepts.
+   *
+   * Use this for components whose `sx` prop is intentionally narrower than a full
+   * `StyleXStyles` surface. When present, generated wrapper styles must use only
+   * these properties, or the codemod bails instead of sending unsupported reset
+   * styles through a weak/incorrect channel.
+   */
+  sxAllowedProperties?: string[];
 }
 /**
  * Configuration for a custom style merger function that combines stylex.props()
@@ -786,6 +817,7 @@ interface Adapter {
    *
    * Return:
    * - `{ acceptsSx: true }` to force the `sx={...}` path
+   *   (optionally with `sxAllowedProperties` / `sxExcludedProperties`)
    * - `{ acceptsSx: false }` to force the `{...stylex.props(...)}` path
    * - `undefined` to fall through to auto-detection (default)
    *
@@ -921,7 +953,7 @@ declare function defineAdapter<T extends AdapterInput>(adapter: T): T;
 //#endregion
 //#region src/internal/logger.d.ts
 type Severity = "info" | "warning" | "error";
-type WarningType = "`css` helper function switch must return css templates in all branches" | "`css` helper usage as a function call (css(...)) is not supported" | "`css` helper used outside of a styled component template cannot be statically transformed" | "Adapter helper call in border interpolation did not resolve to a single CSS value" | "Adapter resolveCall returned an unparseable styles expression" | "Adapter resolveCall returned an unparseable value expression" | "Adapter resolveCall returned StyleX styles for helper call where a CSS value was expected" | "Adapter resolved an imported helper call as StyleX styles without replacing the RuleSet helper" | "Adapter resolveCall returned undefined for helper call" | "Adapter resolveBaseComponent threw an error" | "Adapter resolved StyleX styles cannot be applied under nested selectors/at-rules" | "Adapter resolved StyleX styles inside pseudo selector but did not provide cssText for property expansion — add cssText to resolveCall result to enable pseudo-wrapping" | 'Adapter resolveCall cssText could not be parsed as CSS declarations — expected semicolon-separated property: value pairs (e.g. "white-space: nowrap; overflow: hidden;")' | "Adapter resolveValue returned an unparseable value expression" | "Adapter resolveValue returned undefined for imported value" | "Arrow function: body is not a recognized pattern (expected ternary, logical, call, or member expression)" | "Arrow function: conditional branches could not be resolved to static or theme values" | "Arrow function: helper call body is not supported" | "Arrow function: indexed theme lookup pattern not matched" | "Arrow function: logical expression pattern not supported" | "Arrow function: prop access cannot be converted to style function for this CSS property" | "Arrow function: theme access path could not be resolved" | "Component selectors like `${OtherComponent}:hover &` are not directly representable in StyleX. Manual refactor is required" | "Conditional `css` block: !important is not supported in StyleX" | "Conditional `css` block: @-rules (e.g., @media, @supports) are not supported" | "CSS block contains unsupported at-rule (only @media and @container are supported; @supports, etc. require manual handling)" | "Conditional `css` block: dynamic interpolation could not be resolved to a single component prop" | "Conditional `css` block: failed to parse expression" | "Conditional `css` block: missing CSS property name" | "Conditional `css` block: missing interpolation expression" | "Conditional `css` block: mixed static/dynamic values with non-theme expressions cannot be safely transformed" | "Conditional `css` block: multiple interpolation slots in a single property value" | "Conditional `css` block: ternary branch value could not be resolved (imported values require adapter support)" | "Conditional `css` block: ternary expressions inside pseudo selectors are not supported" | "Conditional `css` block: media query interpolation must be a simple imported reference (expressions like `value + 1` are not supported)" | "Conditional `css` block: unsupported selector" | "Directional border helper styles are not supported" | "Multi-slot border interpolation could not be resolved" | "Resolved border helper value could not be expanded to longhand properties" | "Resolved conditional border variant could not be expanded to longhand properties" | "createGlobalStyle is not supported in StyleX. Global styles should be handled separately (e.g., in a CSS file or using CSS reset libraries)" | "Failed to parse theme expressions" | "Heterogeneous background values (mix of gradients and colors) not currently supported" | "Higher-order styled factory wrappers (e.g. hoc(styled)) are not supported" | "Imported CSS helper mixins: cannot determine inherited properties for correct pseudo selector handling" | "Local helper function returns CSS that cannot be decomposed into individual properties" | "Local helper function computes CSS values that cannot be statically traced to the component prop" | "Unsupported background shorthand: multiple components cannot be mapped to a single StyleX longhand" | "Styled-components specificity hacks like `&&` / `&&&` are not representable in StyleX" | "Theme-dependent block-level conditional could not be fully resolved (branches may contain dynamic interpolations)" | "Theme-dependant call expression could not be resolved (e.g. theme helper calls like theme.highlight() are not supported)" | "Theme value with fallback (props.theme.X ?? / || default) cannot be resolved statically — use adapter.resolveValue to map theme paths to StyleX tokens" | "Theme-dependent nested prop access requires a project-specific theme source (e.g. useTheme())" | "Theme-dependent template literals require a project-specific theme source (e.g. useTheme())" | "Theme prop overrides on styled components are not supported" | "Universal selectors (`*`) are currently unsupported" | "Unsupported call expression (expected imported helper(...) or imported helper(...)(...))" | "Unsupported conditional test in shouldForwardProp" | "Unsupported .attrs() callback pattern" | "Unsupported shouldForwardProp pattern (only !prop.startsWith(), ![].includes(prop), and prop !== are supported)" | "Unsupported interpolation: arrow function" | "Unsupported interpolation: call expression" | "Unsupported interpolation: identifier" | "Unsupported interpolation: member expression" | "Unsupported interpolation: property" | "Unsupported interpolation: unknown" | "Unsupported nested conditional interpolation" | "Unsupported prop-based inline style expression cannot be safely inlined" | "Unsupported prop-based inline style props.theme access is not supported" | "Unsupported selector interpolation: imported value in selector position" | "Unsupported: media query interpolation must be a simple imported reference (expressions like `value + 1` are not supported)" | "Unsupported selector: class selector" | "Unsupported selector: comma-separated selectors must all be simple pseudos or pseudo-elements" | "Unsupported selector: descendant pseudo selector (space before pseudo)" | "Unsupported selector: adjacent sibling combinator" | "Unsupported selector: descendant/child/sibling selector" | "Unsupported selector: conditional css block inside pseudo-element selector" | "Unsupported selector: interpolated pseudo selector" | "Unsupported selector: pseudo-class on pseudo-element selector" | "Unsupported selector: unsupported pseudo-element" | "Unsupported selector: sibling combinator" | "Unsupported selector: unresolved interpolation in sibling selector" | "Unsupported selector: ambiguous element selector" | "Unsupported selector: attribute selector on unsupported element" | "Unsupported selector: element selector on exported component" | "Unsupported selector: element selector with combined ancestor and child pseudos" | "Unsupported selector: element selector with dynamic children" | "Unsupported selector: element selector with plain intrinsic children" | "Unsupported selector: element selector pseudo collision" | "Unsupported selector: cross-file component selector target has no JSX usage in this file" | "Unsupported selector: unresolved interpolation in cross-file component selector" | "Unsupported selector: unresolved interpolation in descendant component selector" | "Unsupported selector: unresolved interpolation in attribute selector" | "Unsupported selector: unresolved interpolation in element selector" | "Unsupported selector: unresolved interpolation in reverse component selector" | "Unsupported selector: unresolved interpolation in cross-component sibling selector" | "Unsupported selector: grouped reverse selector references different components" | "Unsupported selector: computed media query inside ancestor attribute selector" | "Unsupported selector: computed media query inside cross-component sibling selector" | "Unsupported selector: computed media query inside sibling selector" | "Unsupported selector: computed media query inside :has() component selector" | "Unsupported selector: cross-file :has() component selector not yet supported" | "Unsupported selector: unresolved interpolation in :has() component selector" | "Unsupported selector: unknown component selector" | "Unsupported selector: component selector with child pseudo" | "Unsupported selector: component selector target has no patchable JSX usage under selector parent" | "Unsupported selector: compound pseudo selector" | "Unsupported css`` mixin: after-base mixin style is not a plain object" | "Unsupported css`` mixin: nested contextual conditions in after-base mixin" | "Unsupported css`` mixin: cannot infer base default for after-base contextual override (base value is non-literal)" | "css`` helper function interpolation references closure variable that cannot be hoisted" | "Using styled-components components as mixins is not supported; use css`` mixins or strings instead" | "styled(ImportedComponent) wraps a component whose file uses styled-components — convert the base component's file first to avoid CSS cascade conflicts" | "Partial transform would have a StyleX leaf wrap a styled-components base — the extending component was transformed but its base was not, so the leaf's StyleX overrides cannot reliably beat the base's styled-components styles" | "Transient $-prefixed props renamed on exported component — update consumer call sites to use the new prop names" | "Shorthand property has an opaque value that StyleX will expand to longhands — use `directional` in resolveValue to return separate longhand tokens" | "animation shorthand contains a var() with no classifiable fallback — its longhand position cannot be determined statically; bind the variable to a specific longhand (e.g. animation-duration: var(--x)) instead";
+type WarningType = "`css` helper function switch must return css templates in all branches" | "`css` helper usage as a function call (css(...)) is not supported" | "`css` helper used outside of a styled component template cannot be statically transformed" | "Adapter helper call in border interpolation did not resolve to a single CSS value" | "Adapter resolveCall returned an unparseable styles expression" | "Adapter resolveCall returned an unparseable value expression" | "Adapter resolveCall returned StyleX styles for helper call where a CSS value was expected" | "Adapter resolved an imported helper call as StyleX styles without replacing the RuleSet helper" | "Adapter resolveCall returned undefined for helper call" | "Adapter resolveBaseComponent threw an error" | "Adapter resolved StyleX styles cannot be applied under nested selectors/at-rules" | "Adapter resolved StyleX styles inside pseudo selector but did not provide cssText for property expansion — add cssText to resolveCall result to enable pseudo-wrapping" | 'Adapter resolveCall cssText could not be parsed as CSS declarations — expected semicolon-separated property: value pairs (e.g. "white-space: nowrap; overflow: hidden;")' | "Adapter resolveValue returned an unparseable value expression" | "Adapter resolveValue returned undefined for imported value" | "Arrow function: body is not a recognized pattern (expected ternary, logical, call, or member expression)" | "Arrow function: conditional branches could not be resolved to static or theme values" | "Arrow function: helper call body is not supported" | "Arrow function: indexed theme lookup pattern not matched" | "Arrow function: logical expression pattern not supported" | "Arrow function: prop access cannot be converted to style function for this CSS property" | "Arrow function: theme access path could not be resolved" | "Component selectors like `${OtherComponent}:hover &` are not directly representable in StyleX. Manual refactor is required" | "Conditional `css` block: !important is not supported in StyleX" | "Conditional `css` block: unsupported or mixed @-rules require manual handling" | "CSS block contains unsupported at-rule (only @media, @container, and @supports are supported; mixed nested at-rules require manual handling)" | "Conditional `css` block: dynamic interpolation could not be resolved to a single component prop" | "Conditional `css` block: failed to parse expression" | "Conditional `css` block: missing CSS property name" | "Conditional `css` block: missing interpolation expression" | "Conditional `css` block: mixed static/dynamic values with non-theme expressions cannot be safely transformed" | "Conditional `css` block: multiple interpolation slots in a single property value" | "Conditional `css` block: ternary branch value could not be resolved (imported values require adapter support)" | "Conditional `css` block: ternary expressions inside pseudo selectors are not supported" | "Conditional `css` block: media query interpolation must be a simple imported reference (expressions like `value + 1` are not supported)" | "Conditional `css` block: unsupported selector" | "Directional border helper styles are not supported" | "Multi-slot border interpolation could not be resolved" | "Resolved border helper value could not be expanded to longhand properties" | "Resolved conditional border variant could not be expanded to longhand properties" | "createGlobalStyle is not supported in StyleX. Global styles should be handled separately (e.g., in a CSS file or using CSS reset libraries)" | "Failed to parse theme expressions" | "Heterogeneous background values (mix of gradients and colors) not currently supported" | "Higher-order styled factory wrappers (e.g. hoc(styled)) are not supported" | "Imported CSS helper mixins: cannot determine inherited properties for correct pseudo selector handling" | "Local helper function returns CSS that cannot be decomposed into individual properties" | "Local helper function computes CSS values that cannot be statically traced to the component prop" | "Unsupported background shorthand: multiple components cannot be mapped to a single StyleX longhand" | "Styled-components specificity hacks like `&&` / `&&&` are not representable in StyleX" | "Theme-dependent block-level conditional could not be fully resolved (branches may contain dynamic interpolations)" | "Theme-dependant call expression could not be resolved (e.g. theme helper calls like theme.highlight() are not supported)" | "Theme value with fallback (props.theme.X ?? / || default) cannot be resolved statically — use adapter.resolveValue to map theme paths to StyleX tokens" | "Theme-dependent nested prop access requires a project-specific theme source (e.g. useTheme())" | "Theme-dependent template literals require a project-specific theme source (e.g. useTheme())" | "Theme prop overrides on styled components are not supported" | "Universal selectors (`*`) are currently unsupported" | "Unsupported call expression (expected imported helper(...) or imported helper(...)(...))" | "Unsupported conditional test in shouldForwardProp" | "Unsupported .attrs() callback pattern" | "Unsupported shouldForwardProp pattern (only !prop.startsWith(), ![].includes(prop), and prop !== are supported)" | "Unsupported interpolation: arrow function" | "Unsupported interpolation: call expression" | "Unsupported interpolation: identifier" | "Unsupported interpolation: member expression" | "Unsupported interpolation: property" | "Unsupported interpolation: unknown" | `Unsupported CSS property "${string}" cannot be emitted in StyleX` | "Unsupported nested conditional interpolation" | "Unsupported prop-based inline style expression cannot be safely inlined" | "Unsupported prop-based inline style props.theme access is not supported" | "Unsupported selector interpolation: imported value in selector position" | "Unsupported: media query interpolation must be a simple imported reference (expressions like `value + 1` are not supported)" | "Unsupported selector: class selector" | "Unsupported selector: comma-separated selectors must all be simple pseudos or pseudo-elements" | "Unsupported selector: descendant pseudo selector (space before pseudo)" | "Unsupported selector: adjacent sibling combinator" | "Unsupported selector: descendant/child/sibling selector" | "Unsupported selector: conditional css block inside pseudo-element selector" | "Unsupported selector: interpolated pseudo selector" | "Unsupported selector: pseudo-class on pseudo-element selector" | "Unsupported selector: unsupported pseudo-element" | "Unsupported selector: sibling combinator" | "Unsupported selector: unresolved interpolation in sibling selector" | "Unsupported selector: ambiguous element selector" | "Unsupported selector: attribute selector on unsupported element" | "Unsupported selector: element selector on exported component" | "Unsupported selector: element selector with combined ancestor and child pseudos" | "Unsupported selector: element selector with dynamic children" | "Unsupported selector: element selector with plain intrinsic children" | "Unsupported selector: element selector pseudo collision" | "Unsupported selector: cross-file component selector target has no JSX usage in this file" | "Unsupported selector: unresolved interpolation in cross-file component selector" | "Unsupported selector: unresolved interpolation in descendant component selector" | "Unsupported selector: unresolved interpolation in attribute selector" | "Unsupported selector: unresolved interpolation in element selector" | "Unsupported selector: unresolved interpolation in reverse component selector" | "Unsupported selector: unresolved interpolation in cross-component sibling selector" | "Unsupported selector: grouped reverse selector references different components" | "Unsupported selector: computed media query inside ancestor attribute selector" | "Unsupported selector: computed media query inside cross-component sibling selector" | "Unsupported selector: computed media query inside sibling selector" | "Unsupported selector: computed media query inside :has() component selector" | "Unsupported selector: cross-file :has() component selector not yet supported" | "Unsupported selector: unresolved interpolation in :has() component selector" | "Unsupported selector: unknown component selector" | "Unsupported selector: component selector with child pseudo" | "Unsupported selector: component selector target has no patchable JSX usage under selector parent" | "Unsupported selector: compound pseudo selector" | "Unsupported css`` mixin: after-base mixin style is not a plain object" | "Unsupported css`` mixin: nested contextual conditions in after-base mixin" | "Unsupported css`` mixin: cannot infer base default for after-base contextual override (base value is non-literal)" | "css`` helper function interpolation references closure variable that cannot be hoisted" | "Using styled-components components as mixins is not supported; use css`` mixins or strings instead" | "styled(ImportedComponent) wraps a component whose file uses styled-components — convert the base component's file first to avoid CSS cascade conflicts" | "Partial transform would have a StyleX leaf wrap a styled-components base — the extending component was transformed but its base was not, so the leaf's StyleX overrides cannot reliably beat the base's styled-components styles" | "Conditional StyleX default would override an unproven earlier style for the same property" | "Forwarded sx conditional default would override an unproven wrapped component base style" | "Wrapped component does not accept className or sx for generated StyleX styles" | "Wrapped component sx prop targets an inner element for a root style property" | "Wrapped component sx prop rejects logical CSS properties that cannot be preserved losslessly" | "Wrapped component sx prop does not accept generated StyleX property" | "Transient $-prefixed props renamed on exported component — update consumer call sites to use the new prop names" | "Shorthand property has an opaque value that StyleX will expand to longhands — use `directional` in resolveValue to return separate longhand tokens" | "animation shorthand contains a var() with no classifiable fallback — its longhand position cannot be determined statically; bind the variable to a specific longhand (e.g. animation-duration: var(--x)) instead";
 interface WarningLog {
   severity: Severity;
   type: WarningType;
@@ -958,6 +990,8 @@ interface TypeScriptComponentMetadata {
   restProps: TypeScriptRestPropMetadata[];
   hasIndexSignature: boolean;
   supportsSxProp: boolean;
+  sxExcludedProperties: string[];
+  sxAllowedProperties?: string[];
 }
 interface TypeScriptFunctionMetadata {
   name: string;

package/dist/transform.d.mts

@@ -1,4 +1,4 @@
-import { i as TransformResult, r as TransformOptions, t as BridgeComponentResult } from "./transform-types-CQjiY4Yp.mjs";
+import { i as TransformResult, r as TransformOptions, t as BridgeComponentResult } from "./transform-types-Bshr_dBf.mjs";
 import { API, FileInfo, Options } from "jscodeshift";
 
 //#region src/transform.d.ts