oxlint-plugin-react-doctor 0.2.18-dev.eab6dc2 → 0.2.18-dev.eba20ae

package/dist/index.js

@@ -3954,6 +3954,7 @@ const noEmDashInJsxText = defineRule({
 	title: "Em dash in JSX text",
 	tags: ["design", "test-noise"],
 	severity: "warn",
+	defaultEnabled: false,
 	category: "Architecture",
 	recommendation: "Replace em dashes in UI text with commas, colons, semicolons, or parentheses so the copy reads less like AI output.",
 	create: (context) => ({ JSXText(jsxTextNode) {
@@ -4000,6 +4001,7 @@ const noRedundantPaddingAxes = defineRule({
 	title: "Redundant padding axes",
 	tags: ["design", "test-noise"],
 	severity: "warn",
+	defaultEnabled: false,
 	category: "Architecture",
 	recommendation: "Collapse `px-N py-N` to `p-N` when both sides match. Keep them split only when one side changes at a breakpoint (`py-2 md:py-3`).",
 	create: (context) => ({ JSXAttribute(jsxAttribute) {
@@ -4023,6 +4025,7 @@ const noRedundantSizeAxes = defineRule({
 	requires: ["tailwind:3.4"],
 	tags: ["design", "test-noise"],
 	severity: "warn",
+	defaultEnabled: false,
 	category: "Architecture",
 	recommendation: "Collapse `w-N h-N` to `size-N` (Tailwind v3.4+) when both sides match.",
 	create: (context) => ({ JSXAttribute(jsxAttribute) {
@@ -4046,6 +4049,7 @@ const noSpaceOnFlexChildren = defineRule({
 	title: "space-* utility on flex children",
 	tags: ["design", "test-noise"],
 	severity: "warn",
+	defaultEnabled: false,
 	category: "Architecture",
 	recommendation: "Use `gap-*` on the flex or grid parent. `space-x-*` and `space-y-*` leave gaps when a child is hidden, miss spacing on wrapped lines, and don't flip in right-to-left layouts.",
 	create: (context) => ({ JSXAttribute(jsxAttribute) {
@@ -4079,6 +4083,7 @@ const noThreePeriodEllipsis = defineRule({
 	title: "Three dots instead of ellipsis",
 	tags: ["design", "test-noise"],
 	severity: "warn",
+	defaultEnabled: false,
 	category: "Architecture",
 	recommendation: "Use the real ellipsis \"…\" (or `…`) instead of three dots. Good for labels like \"Rename…\" and \"Loading…\".",
 	create: (context) => ({ JSXText(jsxTextNode) {
@@ -4138,6 +4143,7 @@ const noVagueButtonLabel = defineRule({
 	title: "Vague button label",
 	tags: ["design", "test-noise"],
 	severity: "warn",
+	defaultEnabled: false,
 	recommendation: "Name the action: \"Save changes\" instead of \"Continue\", \"Send invite\" instead of \"Submit\". The label is the button's accessible name.",
 	create: (context) => ({ JSXElement(jsxElementNode) {
 		const tagName = getOpeningElementTagName(jsxElementNode.openingElement);
@@ -4609,11 +4615,17 @@ const isCleanupFunctionLike = (node, knownCleanupFunctionNames, knownBoundSubscr
 	if (!isFunctionLike$2(node)) return false;
 	return containsReleaseLikeCall(node.body, knownCleanupFunctionNames, knownBoundSubscriptionNames);
 };
-const isCleanupReturn = (returnedValue, knownCleanupFunctionNames, knownBoundSubscriptionNames) => {
+const isCleanupReturn = (returnedValue, knownCleanupFunctionNames, knownBoundSubscriptionNames, options = {}) => {
 	if (!returnedValue) return false;
 	const unwrappedValue = unwrapChainExpression$2(returnedValue);
-	if (isNodeOfType(unwrappedValue, "Identifier")) return knownCleanupFunctionNames.has(unwrappedValue.name);
+	if (isNodeOfType(unwrappedValue, "Literal") && unwrappedValue.value === null) return false;
+	if (isNodeOfType(unwrappedValue, "Identifier")) {
+		if (unwrappedValue.name === "undefined") return false;
+		if (knownCleanupFunctionNames.has(unwrappedValue.name)) return true;
+		return options.allowOpaqueReturn === true && !knownBoundSubscriptionNames.has(unwrappedValue.name);
+	}
 	if (isCleanupReturningSubscribeLikeCallExpression(unwrappedValue)) return true;
+	if (options.allowOpaqueReturn === true && !isSubscribeLikeCallExpression(unwrappedValue)) return true;
 	if (isCleanupFunctionLike(unwrappedValue, knownCleanupFunctionNames, knownBoundSubscriptionNames)) return true;
 	return false;
 };
@@ -4634,12 +4646,14 @@ const findSubscribeLikeUsages = (callback) => {
 		if (isNodeOfType(child.callee, "Identifier") && TIMER_CALLEE_NAMES_REQUIRING_CLEANUP.has(child.callee.name)) {
 			usages.push({
 				kind: "timer",
+				node: child,
 				resourceName: child.callee.name
 			});
 			return;
 		}
 		if (isNodeOfType(child.callee, "MemberExpression") && isNodeOfType(child.callee.property, "Identifier") && SUBSCRIPTION_METHOD_NAMES.has(child.callee.property.name)) usages.push({
 			kind: "subscribe",
+			node: child,
 			resourceName: child.callee.property.name
 		});
 	});
@@ -4686,7 +4700,20 @@ const collectCleanupBindings = (effectCallback) => {
 	});
 	return bindings;
 };
-const effectHasCleanupRelease = (callback) => {
+const getRangeStart = (node) => {
+	const rangeStart = node.range?.[0];
+	return typeof rangeStart === "number" ? rangeStart : null;
+};
+const cleanupReturnRunsAfterUsage = (returnStatement, usages) => {
+	if (returnStatement.argument && isCleanupReturningSubscribeLikeCallExpression(returnStatement.argument)) return true;
+	const returnStart = getRangeStart(returnStatement);
+	if (returnStart === null) return true;
+	return usages.some((usage) => {
+		const usageStart = getRangeStart(usage.node);
+		return usageStart === null || usageStart < returnStart;
+	});
+};
+const effectHasCleanupReturn = (callback, usages) => {
 	if (!isNodeOfType(callback, "ArrowFunctionExpression") && !isNodeOfType(callback, "FunctionExpression")) return false;
 	if (!isNodeOfType(callback.body, "BlockStatement")) return isCleanupReturningSubscribeLikeCallExpression(callback.body);
 	const cleanupBindings = collectCleanupBindings(callback);
@@ -4694,7 +4721,8 @@ const effectHasCleanupRelease = (callback) => {
 	walkInsideStatementBlocks(callback.body, (child) => {
 		if (didFindCleanupReturn) return;
 		if (!isNodeOfType(child, "ReturnStatement")) return;
-		if (isCleanupReturn(child.argument, cleanupBindings.cleanupFunctionNames, cleanupBindings.subscriptionNames)) didFindCleanupReturn = true;
+		if (!cleanupReturnRunsAfterUsage(child, usages)) return;
+		if (isCleanupReturn(child.argument, cleanupBindings.cleanupFunctionNames, cleanupBindings.subscriptionNames, { allowOpaqueReturn: true })) didFindCleanupReturn = true;
 	});
 	return didFindCleanupReturn;
 };
@@ -4710,7 +4738,7 @@ const effectNeedsCleanup = defineRule({
 		if (!callback) return;
 		const usages = findSubscribeLikeUsages(callback);
 		if (usages.length === 0) return;
-		if (effectHasCleanupRelease(callback)) return;
+		if (effectHasCleanupReturn(callback, usages)) return;
 		const firstUsage = usages[0];
 		const verb = firstUsage.kind === "timer" ? "schedules" : "subscribes via";
 		context.report({
@@ -9703,6 +9731,7 @@ const jsxNoConstructedContextValues = defineRule({
 	title: "Unstable context provider value",
 	tags: ["react-jsx-only"],
 	severity: "warn",
+	disabledBy: ["react-compiler"],
 	recommendation: "Wrap the context value in `useMemo`, or move it outside the component.",
 	category: "Performance",
 	create: (context) => {
@@ -11785,6 +11814,7 @@ const jsxPascalCase = defineRule({
 	id: "jsx-pascal-case",
 	title: "Component name not PascalCase",
 	severity: "warn",
+	defaultEnabled: false,
 	tags: ["test-noise"],
 	recommendation: "Rename custom JSX components to PascalCase.",
 	category: "Architecture",
@@ -14243,6 +14273,7 @@ const noArrayIndexKey = defineRule({
 	id: "no-array-index-key",
 	title: "Array index used as a key",
 	severity: "warn",
+	defaultEnabled: false,
 	recommendation: "Use a stable `key` from your data instead of the array index.",
 	category: "Performance",
 	create: (context) => ({
@@ -15382,6 +15413,7 @@ const noDarkModeGlow = defineRule({
 	title: "Colored glow on dark background",
 	tags: ["design", "test-noise"],
 	severity: "warn",
+	defaultEnabled: false,
 	recommendation: "Use a subtle `box-shadow` in neutral colors for depth, or a faint `border`. Colored glows on dark backgrounds look overdone.",
 	create: (context) => ({ JSXAttribute(node) {
 		const expression = getInlineStyleExpression(node);
@@ -15416,6 +15448,7 @@ const noDefaultProps = defineRule({
 	requires: ["react:19"],
 	tags: ["test-noise"],
 	severity: "warn",
+	defaultEnabled: false,
 	recommendation: "React 19 drops `Component.defaultProps` for function components. Set the defaults in the destructured props instead: `function Foo({ size = \"md\", variant = \"primary\" })` instead of `Foo.defaultProps = { size: \"md\", variant: \"primary\" }`.",
 	create: (context) => ({ AssignmentExpression(node) {
 		if (node.operator !== "=") return;
@@ -17588,6 +17621,7 @@ const noGenericHandlerNames = defineRule({
 	id: "no-generic-handler-names",
 	title: "Vague event handler name",
 	severity: "warn",
+	defaultEnabled: false,
 	tags: ["test-noise"],
 	recommendation: "Rename it to say what it does. For example `handleSubmit` could be `saveUserProfile`, and `handleClick` could be `toggleSidebar`.",
 	create: (context) => ({ JSXAttribute(node) {
@@ -17789,6 +17823,7 @@ const noGradientText = defineRule({
 	title: "Gradient text is hard to read",
 	tags: ["design", "test-noise"],
 	severity: "warn",
+	defaultEnabled: false,
 	recommendation: "Use a solid text color so it stays readable. For emphasis, change the weight, size, or color instead of using a gradient.",
 	create: (context) => ({
 		JSXAttribute(node) {
@@ -18075,6 +18110,7 @@ const noJustifiedText = defineRule({
 	title: "Justified text without hyphens",
 	tags: ["test-noise"],
 	severity: "warn",
+	defaultEnabled: false,
 	category: "Accessibility",
 	recommendation: "Use `text-align: left` for body text. If you must justify, add `hyphens: auto` and `overflow-wrap: break-word`.",
 	create: (context) => ({ JSXAttribute(node) {
@@ -20179,6 +20215,12 @@ const getReactDoctorStringSetting = (settings, settingName) => {
 	const settingValue = readOwnPropertyValue(bag, settingName);
 	return typeof settingValue === "string" ? settingValue : void 0;
 };
+const getReactDoctorNumberSetting = (settings, settingName) => {
+	const bag = readReactDoctorSettingsBag(settings);
+	if (!bag) return void 0;
+	const settingValue = readOwnPropertyValue(bag, settingName);
+	return typeof settingValue === "number" && Number.isFinite(settingValue) ? settingValue : void 0;
+};
 const getReactDoctorStringArraySetting = (settings, settingName) => {
 	const bag = readReactDoctorSettingsBag(settings);
 	if (!bag) return [];
@@ -20316,6 +20358,7 @@ const noPropTypes = defineRule({
 	requires: ["react:19"],
 	tags: ["test-noise"],
 	severity: "warn",
+	defaultEnabled: false,
 	recommendation: "React 19 ignores `Component.propTypes`, so invalid props pass silently. Describe props with TypeScript types and add real runtime checks (or schema parsing) only where data can actually be wrong. Only runs on React 19+ projects.",
 	create: (context) => ({
 		AssignmentExpression(node) {
@@ -20344,6 +20387,7 @@ const noPureBlackBackground = defineRule({
 	title: "Pure black background",
 	tags: ["design", "test-noise"],
 	severity: "warn",
+	defaultEnabled: false,
 	recommendation: "Nudge the background slightly toward your brand color, like `#0a0a0f` or Tailwind's `bg-gray-950`. Pure black looks harsh on modern screens.",
 	create: (context) => ({
 		JSXAttribute(node) {
@@ -21773,6 +21817,7 @@ const noSideTabBorder = defineRule({
 	title: "Thick one-sided border",
 	tags: ["design", "test-noise"],
 	severity: "warn",
+	defaultEnabled: false,
 	recommendation: "Use a softer accent like an inset box-shadow, a background, or a thin border-bottom instead of a thick one-sided border.",
 	create: (context) => ({
 		JSXAttribute(node) {
@@ -23651,15 +23696,46 @@ const noUsememoSimpleExpression = defineRule({
 });
 //#endregion
 //#region src/plugin/rules/design/no-wide-letter-spacing.ts
+const getJsxAttributeStringValue = (attributeValue) => {
+	if (!attributeValue) return null;
+	if (isNodeOfType(attributeValue, "Literal") && typeof attributeValue.value === "string") return attributeValue.value;
+	if (isNodeOfType(attributeValue, "JSXExpressionContainer")) {
+		const expression = attributeValue.expression;
+		if (isNodeOfType(expression, "Literal") && typeof expression.value === "string") return expression.value;
+	}
+	return null;
+};
+const isTruthyBooleanJsxAttribute = (attributeValue) => {
+	if (attributeValue === null) return true;
+	if (isNodeOfType(attributeValue, "JSXExpressionContainer")) {
+		const expression = attributeValue.expression;
+		return isNodeOfType(expression, "Literal") && expression.value === true;
+	}
+	return false;
+};
+const hasUppercaseSiblingProp = (styleAttribute) => {
+	const openingElement = styleAttribute.parent;
+	if (!openingElement || !isNodeOfType(openingElement, "JSXOpeningElement")) return false;
+	for (const attribute of openingElement.attributes ?? []) {
+		if (!isNodeOfType(attribute, "JSXAttribute")) continue;
+		if (!isNodeOfType(attribute.name, "JSXIdentifier")) continue;
+		const attributeName = attribute.name.name;
+		if (attributeName === "uppercase" && isTruthyBooleanJsxAttribute(attribute.value)) return true;
+		if (attributeName === "textTransform" && getJsxAttributeStringValue(attribute.value) === "uppercase") return true;
+	}
+	return false;
+};
 const noWideLetterSpacing = defineRule({
 	id: "no-wide-letter-spacing",
 	title: "Wide letter spacing on body text",
 	severity: "warn",
+	defaultEnabled: false,
 	tags: ["test-noise"],
 	recommendation: "Save wide letter-spacing (over 0.05em) for short uppercase labels, nav items, and buttons, not body text.",
 	create: (context) => ({ JSXAttribute(node) {
 		const expression = getInlineStyleExpression(node);
 		if (!expression) return;
+		if (hasUppercaseSiblingProp(node)) return;
 		let isUppercase = false;
 		let letterSpacingProperty = null;
 		let letterSpacingEm = null;
@@ -23737,6 +23813,7 @@ const noZIndex9999 = defineRule({
 	title: "Excessively high z-index",
 	tags: ["test-noise"],
 	severity: "warn",
+	defaultEnabled: false,
 	recommendation: "Pick a small z-index scale, like dropdown 10, modal 20, toast 30. To layer something on top, use `isolation: isolate` instead of bigger numbers.",
 	create: (context) => ({
 		JSXAttribute(node) {
@@ -24512,6 +24589,7 @@ const preferEs6Class = defineRule({
 	id: "prefer-es6-class",
 	title: "createClass instead of ES6 class",
 	severity: "warn",
+	defaultEnabled: false,
 	recommendation: "Pick one component style for the whole codebase: `class extends React.Component` (default) or `createReactClass` (legacy).",
 	category: "Architecture",
 	create: (context) => {
@@ -24822,6 +24900,7 @@ const preferModuleScopeStaticValue = defineRule({
 	tags: ["test-noise"],
 	severity: "warn",
 	category: "Architecture",
+	disabledBy: ["react-compiler"],
 	recommendation: "Move the value above the component, at the top of the file. It doesn't use local state, so rebuilding it each update is wasted and makes it look new every time.",
 	create: (context) => ({ VariableDeclarator(node) {
 		if (!isNodeOfType(node.id, "Identifier")) return;
@@ -26778,76 +26857,22 @@ const rerenderTransitionsScroll = defineRule({
 	} })
 });
 //#endregion
+//#region src/plugin/utils/define-retired-rule.ts
+const defineRetiredRule = (rule) => defineRule({
+	...rule,
+	defaultEnabled: false,
+	lifecycle: "retired",
+	create: () => ({})
+});
+//#endregion
 //#region src/plugin/rules/react-native/rn-animate-layout-property.ts
-const REANIMATED_LAYOUT_KEYS = new Set([
-	"width",
-	"height",
-	"top",
-	"left",
-	"right",
-	"bottom",
-	"minWidth",
-	"minHeight",
-	"maxWidth",
-	"maxHeight",
-	"margin",
-	"marginTop",
-	"marginBottom",
-	"marginLeft",
-	"marginRight",
-	"marginHorizontal",
-	"marginVertical",
-	"padding",
-	"paddingTop",
-	"paddingBottom",
-	"paddingLeft",
-	"paddingRight",
-	"paddingHorizontal",
-	"paddingVertical",
-	"flex",
-	"flexBasis",
-	"flexGrow",
-	"flexShrink",
-	"borderWidth",
-	"borderTopWidth",
-	"borderBottomWidth",
-	"borderLeftWidth",
-	"borderRightWidth",
-	"fontSize",
-	"lineHeight",
-	"letterSpacing"
-]);
-const findReturnedObject = (callback) => {
-	if (!isNodeOfType(callback, "ArrowFunctionExpression") && !isNodeOfType(callback, "FunctionExpression")) return null;
-	const body = callback.body;
-	if (isNodeOfType(body, "ObjectExpression")) return body;
-	if (!isNodeOfType(body, "BlockStatement")) return null;
-	for (const stmt of body.body ?? []) if (isNodeOfType(stmt, "ReturnStatement") && isNodeOfType(stmt.argument, "ObjectExpression")) return stmt.argument;
-	return null;
-};
-const rnAnimateLayoutProperty = defineRule({
+const rnAnimateLayoutProperty = defineRetiredRule({
 	id: "rn-animate-layout-property",
 	title: "Animating a layout property",
 	tags: ["test-noise"],
 	requires: ["react-native"],
-	severity: "error",
-	recommendation: "Animating size or position props runs on the JS thread and can stutter. Animate `transform: [{ translateX/Y }, { scale }]` or `opacity` instead, which run on the GPU.",
-	create: (context) => ({ CallExpression(node) {
-		if (!isNodeOfType(node.callee, "Identifier") || node.callee.name !== "useAnimatedStyle") return;
-		const callback = node.arguments?.[0];
-		if (!callback) return;
-		const returnedObject = findReturnedObject(callback);
-		if (!returnedObject) return;
-		for (const property of returnedObject.properties ?? []) {
-			if (!isNodeOfType(property, "Property")) continue;
-			if (!isNodeOfType(property.key, "Identifier")) continue;
-			if (!REANIMATED_LAYOUT_KEYS.has(property.key.name)) continue;
-			context.report({
-				node: property,
-				message: `Your users see stutter when useAnimatedStyle animates "${property.key.name}" on the layout thread.`
-			});
-		}
-	} })
+	severity: "warn",
+	recommendation: "Reanimated useAnimatedStyle runs on the UI thread; layout-affecting properties driven by animation helpers, interpolate, or shared values are valid."
 });
 //#endregion
 //#region src/plugin/rules/react-native/rn-animation-reaction-as-derived.ts
@@ -27052,7 +27077,6 @@ const LEGACY_EXPO_PACKAGE_REPLACEMENTS = new Map([
 	["expo-av", "expo-audio for audio and expo-video for video"],
 	["expo-permissions", "the permissions API in each module (e.g. Camera.requestPermissionsAsync())"],
 	["expo-app-loading", "expo-splash-screen"],
-	["expo-linear-gradient", "the `backgroundImage` CSS gradient style prop (New Architecture) or expo-linear-gradient's successor"],
 	["react-native-fast-image", "expo-image (drop-in with caching, placeholders, and crossfades)"]
 ]);
 const EXPO_UI_MODULE_SOURCES = new Set([
@@ -27207,6 +27231,10 @@ const RECYCLABLE_LIST_PACKAGES = {
 	LegendList: ["@legendapp/list"]
 };
 const SIZING_HINT_ATTRIBUTE_NAMES = new Set(["estimatedItemSize", "estimatedListSize"]);
+const isFlashListV2OrNewer = (context) => {
+	const flashListMajorVersion = getReactDoctorNumberSetting(context.settings, "shopifyFlashListMajorVersion");
+	return flashListMajorVersion !== void 0 && flashListMajorVersion >= 2;
+};
 const isEmptyArrayLiteral = (node) => {
 	if (!isNodeOfType(node.value, "JSXExpressionContainer")) return false;
 	const expression = node.value.expression;
@@ -27228,6 +27256,7 @@ const rnListMissingEstimatedItemSize = defineRule({
 			break;
 		}
 		if (!canonicalRecyclerName) return;
+		if (canonicalRecyclerName === "FlashList" && isFlashListV2OrNewer(context)) return;
 		let hasSizingHint = false;
 		let dataIsEmptyLiteral = false;
 		let hasDataProp = false;
@@ -28170,37 +28199,14 @@ const rnNoSingleElementStyleArray = defineRule({
 	} })
 });
 //#endregion
-//#region src/plugin/rules/react-native/utils/scrollview_names.ts
-const SCROLLVIEW_NAMES = new Set([
-	"ScrollView",
-	"FlatList",
-	"SectionList",
-	"VirtualizedList",
-	"KeyboardAwareScrollView"
-]);
-//#endregion
 //#region src/plugin/rules/react-native/rn-prefer-content-inset-adjustment.ts
-const rnPreferContentInsetAdjustment = defineRule({
+const rnPreferContentInsetAdjustment = defineRetiredRule({
 	id: "rn-prefer-content-inset-adjustment",
-	title: "SafeAreaView instead of contentInsetAdjustment",
+	title: "Manual safe-area inset adjustment",
 	tags: ["test-noise"],
 	requires: ["react-native"],
 	severity: "warn",
-	recommendation: "Drop the SafeAreaView wrapper and set `contentInsetAdjustmentBehavior=\"automatic\"` on the ScrollView so the OS handles the safe area.",
-	create: (context) => ({ JSXElement(node) {
-		if (resolveJsxElementName(node.openingElement) !== "SafeAreaView") return;
-		for (const child of node.children ?? []) {
-			if (!isNodeOfType(child, "JSXElement")) continue;
-			const childName = resolveJsxElementName(child.openingElement);
-			if (!childName || !SCROLLVIEW_NAMES.has(childName)) continue;
-			if (childName === "KeyboardAwareScrollView") continue;
-			context.report({
-				node,
-				message: `Your users render an extra wrapper view from <SafeAreaView> around <${childName}>.`
-			});
-			return;
-		}
-	} })
+	recommendation: "Prefer native content inset adjustment only when it replaces manual inset plumbing; SafeAreaView wrappers are valid and intentionally ignored."
 });
 //#endregion
 //#region src/react-native-dependency-names.ts
@@ -28586,6 +28592,15 @@ const rnPressableSharedValueMutation = defineRule({
 	}
 });
 //#endregion
+//#region src/plugin/rules/react-native/utils/scrollview_names.ts
+const SCROLLVIEW_NAMES = new Set([
+	"ScrollView",
+	"FlatList",
+	"SectionList",
+	"VirtualizedList",
+	"KeyboardAwareScrollView"
+]);
+//#endregion
 //#region src/plugin/rules/react-native/rn-scrollview-dynamic-padding.ts
 const rnScrollviewDynamicPadding = defineRule({
 	id: "rn-scrollview-dynamic-padding",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "oxlint-plugin-react-doctor",
-  "version": "0.2.18-dev.eab6dc2",
+  "version": "0.2.18-dev.eba20ae",
   "description": "oxlint plugin for React Doctor: diagnose React codebases for security, performance, correctness, accessibility, bundle-size, and architecture issues",
   "keywords": [
     "accessibility",