styled-components-to-stylex-codemod 0.0.39 → 0.0.41

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "styled-components-to-stylex-codemod",
-  "version": "0.0.39",
+  "version": "0.0.41",
   "description": "Codemod to transform styled-components to StyleX",
   "keywords": [
     "codemod",
@@ -82,9 +82,9 @@
   "scripts": {
     "build": "tsdown",
     "dev": "tsdown --watch",
-    "test": "vitest",
-    "test:run": "vitest run",
-    "test:coverage": "vitest run --coverage",
+    "test": "vitest --configLoader runner",
+    "test:run": "vitest run --configLoader runner",
+    "test:coverage": "vitest run --coverage --configLoader runner",
     "format": "oxfmt",
     "format:check": "oxfmt --check",
     "lint": "concurrently 'pnpm:lint:oxlint' 'pnpm:lint:eslint'",

package/dist/merge-markers-BC5YNB7D.mjs

@@ -1,392 +0,0 @@
-//#region src/internal/public-api-validation.ts
-function describeValue(value) {
-	if (value === null) return "null";
-	if (value === void 0) return "undefined";
-	if (Array.isArray(value)) return `Array(${value.length})`;
-	if (typeof value === "string") return `"${value}"`;
-	if (typeof value === "number" || typeof value === "boolean") return String(value);
-	if (typeof value === "bigint") return value.toString();
-	if (typeof value === "symbol") return value.description ? `Symbol(${value.description})` : "Symbol()";
-	if (typeof value === "function") return "[Function]";
-	if (typeof value === "object") {
-		const ctor = value?.constructor?.name ?? "Object";
-		let keys = [];
-		try {
-			keys = Object.keys(value);
-		} catch {}
-		const preview = keys.slice(0, 5).join(", ");
-		const suffix = keys.length > 5 ? ", ..." : "";
-		return keys.length ? `${ctor} { ${preview}${suffix} }` : ctor;
-	}
-	return "[Unknown]";
-}
-/** Validates that the candidate is a fully-resolved `Adapter` (externalInterface must be a function). */
-function assertValidAdapter(candidate, where) {
-	assertAdapterShape(candidate, where, false);
-}
-/** Validates that the candidate is a valid `AdapterInput` (externalInterface may be `"auto"` or a function). */
-function assertValidAdapterInput(candidate, where) {
-	assertAdapterShape(candidate, where, true);
-}
-function assertAdapterShape(candidate, where, allowAutoExtIf) {
-	const obj = candidate;
-	const resolveValue = obj?.resolveValue;
-	const resolveCall = obj?.resolveCall;
-	const resolveSelector = obj?.resolveSelector;
-	const resolveBaseComponent = obj?.resolveBaseComponent;
-	const externalInterface = obj?.externalInterface;
-	if (!candidate || typeof candidate !== "object") throw new Error([
-		`${where}: expected an adapter object.`,
-		`Received: ${describeValue(candidate)}`,
-		"",
-		"Adapter requirements:",
-		"  - adapter.resolveValue(context) is required",
-		"  - adapter.resolveCall(context) is required",
-		"  - adapter.resolveSelector(context) is required",
-		"  - adapter.externalInterface(context) is required",
-		"",
-		"resolveValue(context) is called with one of these shapes:",
-		"  - { kind: \"theme\", path }",
-		"  - { kind: \"cssVariable\", name, fallback?, definedValue? }",
-		"  - { kind: \"importedValue\", importedName, source, path? }",
-		"",
-		"resolveCall(context) is called with:",
-		"  - { callSiteFilePath, calleeImportedName, calleeSource, args }",
-		"",
-		"resolveSelector(context) is called with:",
-		"  - { kind: \"selectorInterpolation\", importedName, source, path? }",
-		"  - { kind: \"mediaQueryInterpolation\", importedName, source, path?, mediaQuery }",
-		"",
-		`Docs/examples: ${ADAPTER_DOCS_URL}`
-	].join("\n"));
-	if (typeof resolveValue !== "function") throw new Error([
-		`${where}: adapter.resolveValue must be a function.`,
-		`Received: resolveValue=${describeValue(resolveValue)}`,
-		"",
-		"Adapter shape:",
-		"  {",
-		"    resolveValue(context) {",
-		"      // theme/cssVariable -> { expr, imports, dropDefinition? } | null",
-		"    }",
-		"    resolveCall(context) { return { expr, imports } | null }",
-		"  }",
-		"",
-		`Docs/examples: ${ADAPTER_DOCS_URL}`
-	].join("\n"));
-	if (typeof resolveCall !== "function") throw new Error([
-		`${where}: adapter.resolveCall must be a function.`,
-		`Received: resolveCall=${describeValue(resolveCall)}`,
-		"",
-		"Adapter shape:",
-		"  {",
-		"    resolveCall(context) { return { expr: string, imports: ImportSpec[] } | null }",
-		"  }",
-		"",
-		`Docs/examples: ${ADAPTER_DOCS_URL}`
-	].join("\n"));
-	if (typeof resolveSelector !== "function") throw new Error([
-		`${where}: adapter.resolveSelector must be a function.`,
-		`Received: resolveSelector=${describeValue(resolveSelector)}`,
-		"",
-		"Adapter shape:",
-		"  {",
-		"    resolveSelector(context) { return { kind: \"media\" | \"pseudoAlias\" | \"pseudoExpand\", ... } | undefined }",
-		"  }",
-		"",
-		`Docs/examples: ${ADAPTER_DOCS_URL}`
-	].join("\n"));
-	if (resolveBaseComponent !== void 0 && typeof resolveBaseComponent !== "function") throw new Error([
-		`${where}: adapter.resolveBaseComponent must be a function when provided.`,
-		`Received: resolveBaseComponent=${describeValue(resolveBaseComponent)}`,
-		"",
-		"Adapter shape:",
-		"  {",
-		"    resolveBaseComponent(context) {",
-		"      return { tagName, consumedProps, sx?, mixins? } | undefined",
-		"    }",
-		"  }",
-		"",
-		`Docs/examples: ${ADAPTER_DOCS_URL}`
-	].join("\n"));
-	if (!(typeof externalInterface === "function" || allowAutoExtIf && externalInterface === "auto")) throw new Error([`${where}: ${allowAutoExtIf ? "adapter.externalInterface must be a function or \"auto\"." : "adapter.externalInterface must be a function."}`, `Received: externalInterface=${describeValue(externalInterface)}`].join("\n"));
-	const styleMerger = obj?.styleMerger;
-	if (styleMerger !== null && styleMerger !== void 0) {
-		if (typeof styleMerger !== "object") throw new Error([
-			`${where}: adapter.styleMerger must be null or an object.`,
-			`Received: styleMerger=${describeValue(styleMerger)}`,
-			"",
-			"Expected shape:",
-			"  {",
-			"    functionName: \"stylexProps\",",
-			"    importSource: { kind: \"specifier\", value: \"@company/ui-utils\" }",
-			"  }"
-		].join("\n"));
-		const { functionName, importSource } = styleMerger;
-		assertFunctionNameAndImportSource({
-			where,
-			configPath: "adapter.styleMerger",
-			functionName,
-			importSource,
-			specifierExample: "@company/ui-utils",
-			absolutePathExample: "/path/to/module.ts"
-		});
-	}
-	const markerFile = obj?.markerFile;
-	if (markerFile !== void 0 && markerFile !== null && typeof markerFile !== "function") throw new Error([
-		`${where}: adapter.markerFile must be a function when provided.`,
-		`Received: markerFile=${describeValue(markerFile)}`,
-		"",
-		"Expected signature:",
-		"  markerFile(ctx: { filePath: string }) => { kind: \"specifier\" | \"absolutePath\", value: string }"
-	].join("\n"));
-	const wrappedComponentInterface = obj?.wrappedComponentInterface;
-	if (wrappedComponentInterface !== void 0 && wrappedComponentInterface !== null && typeof wrappedComponentInterface !== "function") throw new Error([
-		`${where}: adapter.wrappedComponentInterface must be a function when provided.`,
-		`Received: wrappedComponentInterface=${describeValue(wrappedComponentInterface)}`,
-		"",
-		"Expected signature:",
-		"  wrappedComponentInterface(ctx: { localName: string; importSource: string; importedName: string; filePath: string })",
-		"    => { acceptsSx: boolean } | undefined"
-	].join("\n"));
-	const themeHook = obj?.themeHook;
-	if (themeHook !== null && themeHook !== void 0) {
-		if (typeof themeHook !== "object") throw new Error([
-			`${where}: adapter.themeHook must be an object when provided.`,
-			`Received: themeHook=${describeValue(themeHook)}`,
-			"",
-			"Expected shape:",
-			"  {",
-			"    functionName: \"useTheme\",",
-			"    importSource: { kind: \"specifier\", value: \"@company/theme-hooks\" }",
-			"  }"
-		].join("\n"));
-		const { functionName, importSource } = themeHook;
-		assertFunctionNameAndImportSource({
-			where,
-			configPath: "adapter.themeHook",
-			functionName,
-			importSource,
-			specifierExample: "@company/theme-hooks",
-			absolutePathExample: "/path/to/theme-hooks.ts"
-		});
-	}
-}
-function assertFunctionNameAndImportSource(args) {
-	const { where, configPath, functionName, importSource, specifierExample, absolutePathExample } = args;
-	if (typeof functionName !== "string" || !functionName.trim()) throw new Error([`${where}: ${configPath}.functionName must be a non-empty string.`, `Received: functionName=${describeValue(functionName)}`].join("\n"));
-	if (!importSource || typeof importSource !== "object") throw new Error([
-		`${where}: ${configPath}.importSource must be an object.`,
-		`Received: importSource=${describeValue(importSource)}`,
-		"",
-		"Expected shape:",
-		`  { kind: "specifier", value: "${specifierExample}" }`,
-		"  or",
-		`  { kind: "absolutePath", value: "${absolutePathExample}" }`
-	].join("\n"));
-	const { kind, value } = importSource;
-	if (kind !== "specifier" && kind !== "absolutePath") throw new Error([`${where}: ${configPath}.importSource.kind must be "specifier" or "absolutePath".`, `Received: kind=${describeValue(kind)}`].join("\n"));
-	if (typeof value !== "string" || !value.trim()) throw new Error([`${where}: ${configPath}.importSource.value must be a non-empty string.`, `Received: value=${describeValue(value)}`].join("\n"));
-}
-const ADAPTER_DOCS_URL = `https://github.com/skovhus/styled-components-to-stylex-codemod#adapter`;
-//#endregion
-//#region src/adapter.ts
-/**
-* Adapter entry point for customizing the codemod.
-* Core concepts: value resolution hooks and adapter validation.
-*/
-/**
-* Type guard: checks whether a resolve result is a directional expansion.
-*/
-function isDirectionalResult(r) {
-	return "directional" in r;
-}
-const DEFAULT_THEME_HOOK = {
-	functionName: "useTheme",
-	importSource: {
-		kind: "specifier",
-		value: "styled-components"
-	}
-};
-/**
-* Helper for nicer user authoring + type inference.
-*
-* `defineAdapter(...)` also performs runtime validation (helpful for JS consumers)
-* and will throw a descriptive error message if the adapter shape is invalid.
-*
-* Usage:
-*   export default defineAdapter({
-*     resolveValue(ctx) {
-*       if (ctx.kind === "theme") {
-*         // For shorthand properties with multi-value tokens, return directional entries
-*         if (ctx.cssProperty === "padding" && ctx.path === "input.padding") {
-*           return {
-*             directional: [
-*               { prop: "paddingBlock", expr: "$input.paddingBlock", imports: [{ from: { kind: "specifier", value: "./tokens" }, names: [{ imported: "$input" }] }] },
-*               { prop: "paddingInline", expr: "$input.paddingInline", imports: [{ from: { kind: "specifier", value: "./tokens" }, names: [{ imported: "$input" }] }] },
-*             ],
-*           };
-*         }
-*         return {
-*           expr: `tokens.${ctx.path}`,
-*           imports: [
-*             { from: { kind: "specifier", value: "./tokens" }, names: [{ imported: "tokens" }] },
-*           ],
-*         };
-*       }
-*       // Return undefined to bail/skip the file
-*     },
-*
-*     resolveCall(ctx) {
-*       // Resolve helper calls inside template interpolations.
-*       // Use ctx.cssProperty to determine context:
-*       // - If ctx.cssProperty exists → return a CSS value expression
-*       // - If ctx.cssProperty is undefined → return a StyleX style object reference
-*       // Return { expr, imports } or undefined to bail/skip the file
-*       void ctx;
-*     },
-*
-*     resolveSelector(ctx) {
-*       // Resolve imported values used in selector position.
-*       // Return one of:
-*       // - { kind: "media", expr, imports } for media queries (e.g., breakpoints.phone)
-*       // - { kind: "pseudoAlias", values, styleSelectorExpr?, imports? } for pseudo-class expansion
-*       // - undefined to bail/skip the file
-*       // For @media placeholders, check ctx.kind === "mediaQueryInterpolation" and
-*       // use ctx.mediaQuery.feature to choose the correct defineConsts media key.
-*       void ctx;
-*     },
-*
-*     // Configure external interface for exported components
-*     externalInterface(ctx) {
-*       // Example: Enable styles, `as`, and `ref` for shared components folder
-*       if (ctx.filePath.includes("/shared/components/")) {
-*         return { styles: true, as: true, ref: true };
-*       }
-*       return { styles: false, as: false, ref: false };
-*     },
-*
-*     // Optional: provide a custom merger, or use `null` for the default verbose merge output
-*     styleMerger: null,
-*
-*     // Emit sx={} JSX attributes instead of {...stylex.props()} spreads (requires StyleX ≥0.18)
-*     useSxProp: false,
-*
-*     // Opt out of logical properties — use paddingTop/Right/Bottom/Left instead of Block/Inline
-*     // usePhysicalProperties: true,
-*
-*     // Optional: customize runtime theme hook import/call used by emitted wrappers
-*     themeHook: {
-*       functionName: "useTheme",
-*       importSource: { kind: "specifier", value: "styled-components" },
-*     },
-*   });
-*/
-function defineAdapter(adapter) {
-	assertValidAdapterInput(adapter, "defineAdapter(adapter)");
-	return adapter;
-}
-//#endregion
-//#region src/internal/merge-markers.ts
-/**
-* Shared utility for merging marker sidecar content.
-* Core concepts: deduplication of defineMarker declarations across files.
-*/
-/** Regex matching a marker block: optional JSDoc comment followed by the export line. */
-const MARKER_BLOCK_RE = /(?:\/\*\*[^]*?\*\/\n)?export const \w+ = stylex\.defineMarker\(\);/gm;
-/** Regex matching just the export line (used for dedup checks). */
-const MARKER_EXPORT_RE = /^export const \w+ = stylex\.defineMarker\(\);$/gm;
-/** Regex matching a generated defineVars export block. */
-const DEFINE_VARS_BLOCK_RE = /export const \w+ = stylex\.defineVars\(\{\n[\s\S]*?\n\}\);/gm;
-/** Regex matching just the defineVars export line (used for dedup checks). */
-const DEFINE_VARS_EXPORT_RE = /^export const \w+ = stylex\.defineVars\(\{$/gm;
-/**
-* Merge marker declarations from `incoming` into `base`, appending only new
-* marker blocks (JSDoc + export). Returns `base` unchanged if all markers already exist.
-*/
-function mergeMarkerDeclarations(base, incoming) {
-	const mergedDefineVars = mergeDefineVarsBlocks(base, incoming);
-	const markerBlocks = getNewBlocks({
-		base: mergedDefineVars,
-		incoming,
-		blockRegex: MARKER_BLOCK_RE,
-		exportRegex: MARKER_EXPORT_RE
-	});
-	const defineVarsBlocks = getNewBlocks({
-		base: mergedDefineVars,
-		incoming,
-		blockRegex: DEFINE_VARS_BLOCK_RE,
-		exportRegex: DEFINE_VARS_EXPORT_RE
-	});
-	const blocksToAdd = [...markerBlocks, ...defineVarsBlocks];
-	if (blocksToAdd.length === 0) return mergedDefineVars;
-	let merged = mergedDefineVars;
-	if (!merged.includes("@stylexjs/stylex")) merged = `import * as stylex from "@stylexjs/stylex";\n\n${merged}`;
-	return merged.trimEnd() + "\n\n" + blocksToAdd.join("\n\n") + "\n";
-}
-function getNewBlocks(args) {
-	const { base, incoming, blockRegex, exportRegex } = args;
-	const incomingExports = [...incoming.matchAll(exportRegex)].map((m) => m[0]);
-	if (incomingExports.length === 0) return [];
-	const newExportLines = incomingExports.filter((line) => !base.includes(line));
-	if (newExportLines.length === 0) return [];
-	const newExportSet = new Set(newExportLines);
-	return [...incoming.matchAll(blockRegex)].map((m) => m[0]).filter((block) => {
-		const exportLine = block.match(exportRegex);
-		return exportLine && newExportSet.has(exportLine[0]);
-	});
-}
-function mergeDefineVarsBlocks(base, incoming) {
-	let merged = base;
-	for (const incomingBlock of incoming.matchAll(DEFINE_VARS_BLOCK_RE)) {
-		const incomingText = incomingBlock[0];
-		const exportName = readDefineVarsExportName(incomingText);
-		if (!exportName) continue;
-		const existingBlock = findDefineVarsBlockByExportName(merged, exportName);
-		if (!existingBlock) continue;
-		const entriesToAdd = getMissingDefineVarsEntries({
-			existingBlock: existingBlock.text,
-			incomingBlock: incomingText
-		});
-		if (entriesToAdd.length === 0) continue;
-		const insertionPoint = existingBlock.start + existingBlock.text.lastIndexOf("\n});");
-		const linesToAdd = entriesToAdd.map((entry) => entry.line);
-		merged = `${merged.slice(0, insertionPoint)}\n${linesToAdd.join("\n")}${merged.slice(insertionPoint)}`;
-	}
-	return merged;
-}
-function readDefineVarsExportName(block) {
-	return /^export const ([A-Za-z_$][\w$]*) = stylex\.defineVars\(\{/m.exec(block)?.[1] ?? null;
-}
-function findDefineVarsBlockByExportName(source, exportName) {
-	for (const match of source.matchAll(DEFINE_VARS_BLOCK_RE)) {
-		const text = match[0];
-		if (readDefineVarsExportName(text) === exportName && match.index !== void 0) return {
-			text,
-			start: match.index
-		};
-	}
-	return null;
-}
-function getMissingDefineVarsEntries(args) {
-	const { existingBlock, incomingBlock } = args;
-	const existingKeys = new Set(readDefineVarsEntryKeys(existingBlock));
-	return readDefineVarsEntries(incomingBlock).filter((entry) => !existingKeys.has(entry.key));
-}
-function readDefineVarsEntryKeys(block) {
-	return readDefineVarsEntries(block).map((entry) => entry.key);
-}
-function readDefineVarsEntries(block) {
-	return block.split("\n").map((line) => ({
-		line,
-		match: /^\s*(?:(["']--[^"']+["'])|([A-Za-z_$][\w$]*))\s*:/.exec(line)
-	})).filter((entry) => Boolean(entry.match)).map(({ line, match }) => ({
-		key: normalizeDefineVarsEntryKey(match[1] ?? match[2]),
-		line
-	}));
-}
-function normalizeDefineVarsEntryKey(key) {
-	if (key.length >= 2 && (key.startsWith("\"") && key.endsWith("\"") || key.startsWith("'") && key.endsWith("'"))) return key.slice(1, -1);
-	return key;
-}
-//#endregion
-export { assertValidAdapter as a, isDirectionalResult as i, DEFAULT_THEME_HOOK as n, assertValidAdapterInput as o, defineAdapter as r, describeValue as s, mergeMarkerDeclarations as t };