eslint-plugin-th-rules 1.19.2 → 1.20.0

package/.vscode/settings.json

@@ -1,5 +1,8 @@
 {
     "cSpell.words": [
         "sonarjs"
+    ],
+    "conventionalCommits.scopes": [
+        "eslint"
     ]
 }

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+# [1.20.0](https://github.com/tomerh2001/eslint-plugin-th-rules/compare/v1.19.3...v1.20.0) (2026-01-06)
+
+
+### Features
+
+* **eslint:** :boom: migrated to ESLint flat configs ([0af8a5e](https://github.com/tomerh2001/eslint-plugin-th-rules/commit/0af8a5e49026af3145924363949cdb2978886dbf))
+
+## [1.19.3](https://github.com/tomerh2001/eslint-plugin-th-rules/compare/v1.19.2...v1.19.3) (2026-01-06)
+
+
+### Bug Fixes
+
+* remove styles-in-styles-file rule and update configs ([e6779c2](https://github.com/tomerh2001/eslint-plugin-th-rules/commit/e6779c2d6bf367fc9474c0ded5977b0a03ad159f))
+
 ## [1.19.2](https://github.com/tomerh2001/eslint-plugin-th-rules/compare/v1.19.1...v1.19.2) (2026-01-05)
 
 

package/README.md

@@ -22,7 +22,6 @@ This repository contains custom ESLint rules to enhance code quality and consist
 | [no-default-export](docs/rules/no-default-export.md)             | Convert unnamed default exports to named default exports based on the file name.       | ✅ ⚛️ 🟦 | 🔧 |
 | [no-destructuring](docs/rules/no-destructuring.md)               | Disallow destructuring that does not meet certain conditions                           | ✅ ⚛️ 🟦 |    |
 | [schemas-in-schemas-file](docs/rules/schemas-in-schemas-file.md) | Require Zod schema declarations to be placed in a .schemas.ts file                     | ✅ ⚛️ 🟦 |    |
-| [styles-in-styles-file](docs/rules/styles-in-styles-file.md)     | Require React-Native StyleSheet.create(...) to be placed in a .styles.ts file          | ✅ ⚛️ 🟦 |    |
 | [top-level-functions](docs/rules/top-level-functions.md)         | Require all top-level functions to be named/regular functions.                         | ✅ ⚛️ 🟦 | 🔧 |
 | [types-in-dts](docs/rules/types-in-dts.md)                       | Require TypeScript type declarations (type/interface/enum) to be placed in .d.ts files | ✅ ⚛️ 🟦 |    |
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eslint-plugin-th-rules",
-  "version": "1.19.2",
+  "version": "1.20.0",
   "description": "A List of custom ESLint rules created by Tomer Horowitz",
   "keywords": [
     "eslint",

package/src/index.js

@@ -2,61 +2,83 @@
 /* eslint-disable unicorn/prefer-module */
 
 'use strict';
+
 const requireIndex = require('requireindex');
+const globals = require('globals');
+const sonarjs = require('eslint-plugin-sonarjs');
+const security = require('eslint-plugin-security');
+const reactPlugin = require('eslint-plugin-react');
+const reactHooks = require('eslint-plugin-react-hooks');
+const tseslint = require('typescript-eslint');
 
-const configs = {
-	recommended: {
-		plugins: [
-			'th-rules',
-			'sonarjs',
-		],
-		extends: [
-			'plugin:sonarjs/recommended-legacy',
-			'plugin:security/recommended-legacy',
-		],
-		rules: {
-			'th-rules/no-destructuring': 'error',
-			'th-rules/no-default-export': 'error',
-			'th-rules/no-comments': 'error',
-			'th-rules/top-level-functions': 'error',
-			'th-rules/styles-in-styles-file': 'error',
-			'th-rules/schemas-in-schemas-file': 'error',
-			'th-rules/types-in-dts': 'error',
-			'unicorn/prefer-module': 'warn',
-			'unicorn/filename-case': 'off',
-			'unicorn/no-array-callback-reference': 'off',
-			'import/extensions': 'off',
-			'unicorn/no-static-only-class': 'off',
-			'unicorn/no-await-expression-member': 'off',
-			'new-cap': 'off',
-			'no-await-in-loop': 'off',
-			'n/file-extension-in-import': 'off',
-			'import/no-cycle': 'off',
-			camelcase: 'warn',
-			'sonarjs/mouse-events-a11y': 'off',
-			'sonarjs/no-unstable-nested-components': 'off',
-			'unicorn/prefer-global-this': 'off',
-			'unicorn/no-thenable': 'off',
-			'sonarjs/no-clear-text-protocols': 'off',
-		},
-		env: {
-			node: true,
-			es2024: true,
-			jest: true,
+const plugin = {
+	rules: requireIndex(`${__dirname}/rules`),
+	configs: {},
+};
+
+const baseRecommended = {
+	plugins: {
+		'th-rules': plugin,
+		security,
+		react: reactPlugin,
+		'react-hooks': reactHooks,
+	},
+	languageOptions: {
+		ecmaVersion: 2024,
+		globals: {
+			...globals.node,
+			...globals.es2024,
+			...globals.jest,
 		},
 	},
+	settings: {
+		react: {version: 'detect'},
+	},
+	rules: {
+		'th-rules/no-destructuring': 'error',
+		'th-rules/no-default-export': 'error',
+		'th-rules/no-comments': 'error',
+		'th-rules/top-level-functions': 'error',
+		'th-rules/schemas-in-schemas-file': 'error',
+		'th-rules/types-in-dts': 'error',
+
+		'unicorn/prefer-module': 'warn',
+		'unicorn/filename-case': 'off',
+		'unicorn/no-array-callback-reference': 'off',
+		'import/extensions': 'off',
+		'unicorn/no-static-only-class': 'off',
+		'unicorn/no-await-expression-member': 'off',
+		'new-cap': 'off',
+		'no-await-in-loop': 'off',
+		'n/file-extension-in-import': 'off',
+		'import/no-cycle': 'off',
+		camelcase: 'warn',
+
+		'sonarjs/mouse-events-a11y': 'off',
+		'sonarjs/no-unstable-nested-components': 'off',
+		'unicorn/prefer-global-this': 'off',
+		'unicorn/no-thenable': 'off',
+		'sonarjs/no-clear-text-protocols': 'off',
+	},
 };
 
-for (const configName of Object.keys(configs)) {
-	configs[`${configName}-typescript`] = {
-		...configs[configName],
-		extends: [
-			'plugin:@typescript-eslint/strict-type-checked',
-			'plugin:@typescript-eslint/stylistic-type-checked',
-			...configs[configName].extends,
-		],
+plugin.configs.recommended = [
+	sonarjs.configs.recommended,
+	security.configs.recommended,
+	baseRecommended,
+];
+
+plugin.configs['recommended-typescript'] = [
+	...plugin.configs.recommended,
+	tseslint.configs.strictTypeChecked,
+	tseslint.configs.stylisticTypeChecked,
+	{
+		languageOptions: {
+			parserOptions: {
+				projectService: true,
+			},
+		},
 		rules: {
-			...configs[configName].rules,
 			'@typescript-eslint/naming-convention': 'warn',
 			'@typescript-eslint/consistent-type-definitions': 'off',
 			'@typescript-eslint/no-extraneous-class': 'off',
@@ -68,22 +90,18 @@ for (const configName of Object.keys(configs)) {
 			'@typescript-eslint/no-unsafe-return': 'off',
 			'@typescript-eslint/no-unsafe-argument': 'off',
 		},
-	};
-	configs[`${configName}-react`] = {
-		...configs[configName],
-		extends: [
-			'plugin:react/recommended',
-			'plugin:react-hooks/recommended',
-			...configs[configName].extends,
-		],
+	},
+];
+
+plugin.configs['recommended-react'] = [
+	...plugin.configs.recommended,
+	reactPlugin.configs.flat.recommended,
+	reactHooks.configs['recommended-latest'] ?? reactHooks.configs.recommended,
+	{
 		rules: {
-			...configs[configName].rules,
 			'n/prefer-global/process': 'off',
 		},
-	};
-}
+	},
+];
 
-module.exports = {
-	rules: requireIndex(`${__dirname}/rules`),
-	configs,
-};
+module.exports = plugin;

package/docs/rules/styles-in-styles-file.md

@@ -1,141 +0,0 @@
-# th-rules/styles-in-styles-file
-
-📝 Require React-Native StyleSheet.create(...) to be placed in a .styles.ts file.
-
-💼 This rule is enabled in the following configs: ✅ `recommended`, ⚛️ `recommended-react`, 🟦 `recommended-typescript`.
-
-<!-- end auto-generated rule header -->
-
-This rule enforces that React-Native stylesheet declarations created via `StyleSheet.create(...)` live in a dedicated styles file, typically ending with `.styles.ts`.
-
-In practice, this prevents implementation/component files from containing large style objects, and encourages consistent separation of concerns.
-
-## Rationale
-
-Keeping styles in dedicated files:
-- improves readability of component files by reducing visual noise,
-- encourages reuse and consistency across components,
-- makes style changes easier to review (diffs focus only on styles),
-- standardizes project structure and naming conventions.
-
-## What the rule reports
-
-The rule reports any `StyleSheet.create(...)` call in files whose names do **not** match one of the allowed suffixes (by default, `.styles.ts`).
-
-Optionally, it can also report `StyleSheet.compose(...)` calls.
-
-## Examples
-
-### ❌ Incorrect
-
-```ts
-// ArticleCard.tsx
-import {StyleSheet} from 'react-native';
-
-const styles = StyleSheet.create({
-	container: {padding: 12},
-});
-```
-
-```ts
-// AnyOtherFile.ts
-import {StyleSheet} from 'react-native';
-
-export default StyleSheet.create({
-	row: {flexDirection: 'row'},
-});
-```
-
-### ✅ Correct
-
-```ts
-// ArticleCard.styles.ts
-import {StyleSheet} from 'react-native';
-
-export const styles = StyleSheet.create({
-	container: {padding: 12},
-});
-```
-
-```ts
-// ArticleCard.tsx
-import React from 'react';
-import {View} from 'react-native';
-import {styles} from './ArticleCard.styles';
-
-export function ArticleCard() {
-	return <View style={styles.container} />;
-}
-```
-
-### `includeCompose` example
-
-When `includeCompose: true`, the following becomes invalid outside a `.styles.ts(x)` file:
-
-```ts
-// ArticleCard.tsx
-import {StyleSheet} from 'react-native';
-
-const combined = StyleSheet.compose(
-	{padding: 12},
-	{margin: 8},
-);
-```
-
-With the same code moved to `ArticleCard.styles.ts`, it becomes valid.
-
-## Options
-
-<!-- begin auto-generated rule options list -->
-
-| Name              | Type     |
-| :---------------- | :------- |
-| `allowedSuffixes` | String[] |
-| `includeCompose`  | Boolean  |
-
-<!-- end auto-generated rule options list -->
-
-### `allowedSuffixes`
-
-An array of filename suffixes that are allowed to contain `StyleSheet.create(...)`.
-
-Default:
-- `.styles.ts`
-
-Example:
-
-```json
-{
-  "rules": {
-    "th-rules/styles-in-styles-file": ["error", {
-      "allowedSuffixes": [".styles.ts", ".native-styles.ts"]
-    }]
-  }
-}
-```
-
-### `includeCompose`
-
-When set to `true`, the rule also enforces the file restriction for `StyleSheet.compose(...)`.
-
-Default: `false`
-
-Example:
-
-```json
-{
-  "rules": {
-    "th-rules/styles-in-styles-file": ["error", {
-      "includeCompose": true
-    }]
-  }
-}
-```
-
-## Notes
-
-- This rule only targets `StyleSheet.create(...)` (and optionally `StyleSheet.compose(...)`). It does not restrict:
-  - plain object styles (e.g., `const styles = { ... }`),
-  - other styling systems (e.g., styled-components, Tamagui, Emotion),
-  - calls to other `StyleSheet.*` helpers (e.g., `flatten`, `hairlineWidth`).
-- The rule is filename-based. If ESLint is invoked with `<input>` (stdin), the rule will treat it as not being an allowed styles file.

package/src/rules/styles-in-styles-file.js

@@ -1,143 +0,0 @@
-const meta = {
-	type: 'problem',
-	docs: {
-		description: 'Require React-Native StyleSheet.create(...) to be placed in a .styles.ts file',
-		category: 'Stylistic Issues',
-		recommended: false,
-		url: 'https://github.com/tomerh2001/eslint-plugin-th-rules/blob/main/docs/rules/styles-in-styles-file.md',
-	},
-	schema: [
-		{
-			type: 'object',
-			properties: {
-				allowedSuffixes: {
-					type: 'array',
-					items: {type: 'string', minLength: 1},
-					minItems: 1,
-				},
-				includeCompose: {type: 'boolean'},
-			},
-			additionalProperties: false,
-		},
-	],
-	messages: {
-		moveStyles:
-			'React-Native styles must be defined in a dedicated styles file ({{suffixes}}).',
-	},
-};
-
-function create(context) {
-	const options = context.options?.[0] ?? {};
-	const allowedSuffixes = options.allowedSuffixes ?? ['.styles.ts'];
-	const includeCompose = Boolean(options.includeCompose);
-
-	function isAllowedStyleFile(filename) {
-		if (!filename || filename === '<input>') {
-			return false;
-		}
-
-		return allowedSuffixes.some(suffix => filename.endsWith(suffix));
-	}
-
-	function isStyleSheetMemberCall(node, memberName) {
-		const callee = node?.callee;
-		if (!callee || callee.type !== 'MemberExpression') {
-			return false;
-		}
-
-		const object = callee.object;
-		const property = callee.property;
-
-		return (
-			object?.type === 'Identifier'
-			&& object.name === 'StyleSheet'
-			&& !callee.computed
-			&& property?.type === 'Identifier'
-			&& property.name === memberName
-		);
-	}
-
-	/**
-	 * Try to infer the “name” of the style object, e.g.:
-	 *   const styles = StyleSheet.create(...)      -> "styles"
-	 *   styles = StyleSheet.create(...)            -> "styles"
-	 *   exports.styles = StyleSheet.create(...)    -> "exports.styles"
-	 */
-	function getAssignmentTargetName(callNode) {
-		const p = callNode.parent;
-
-		if (p?.type === 'VariableDeclarator') {
-			const id = p.id;
-			if (id?.type === 'Identifier') {
-				return id.name;
-			}
-
-			return null;
-		}
-
-		if (p?.type === 'AssignmentExpression') {
-			const left = p.left;
-
-			if (left?.type === 'Identifier') {
-				return left.name;
-			}
-
-			if (left?.type === 'MemberExpression' && !left.computed) {
-				const object = left.object;
-				const property = left.property;
-
-				const objectName
-					= object?.type === 'Identifier'
-						? object.name
-						: (object?.type === 'ThisExpression'
-							? 'this'
-							: null);
-
-				const propertyName = property?.type === 'Identifier' ? property.name : null;
-
-				if (objectName && propertyName) {
-					return `${objectName}.${propertyName}`;
-				}
-			}
-
-			return null;
-		}
-
-		return null;
-	}
-
-	function report(node) {
-		const filename = context.getFilename();
-		if (isAllowedStyleFile(filename)) {
-			return;
-		}
-
-		const targetName = getAssignmentTargetName(node);
-		const target = targetName ? ` "${targetName}"` : '';
-
-		context.report({
-			node,
-			messageId: 'moveStyles',
-			data: {
-				filename,
-				suffixes: allowedSuffixes.join(' or '),
-				target,
-			},
-		});
-	}
-
-	return {
-		CallExpression(node) {
-			if (isStyleSheetMemberCall(node, 'create')) {
-				report(node);
-				return;
-			}
-
-			if (includeCompose && isStyleSheetMemberCall(node, 'compose')) {
-				report(node);
-			}
-		},
-	};
-}
-
-module.exports = {meta, create};