linter-bundle 6.3.0 → 7.1.0

package/eslint/rules/enforce-logical-expression-parens.md

@@ -0,0 +1,31 @@
+# Enforce parentheses around logical operations (`linter-bundle/enforce-logical-expression-parens`)
+
+## Rule Details
+
+This rule ensures that logical operations (using `&&`, `||`, etc.) are always enclosed in parentheses unless they are already part of an existing expression. This improves readability and prevents potential issues with operator precedence.
+
+Examples of **incorrect** code for this rule:
+
+```ts
+return foo !== null && foo.bar === 42 && baz === 84;
+```
+
+The logical operations in the above code are not enclosed in parentheses. The rule will automatically add parentheses to make the code clearer and ensure proper precedence.
+
+Corrected code would look like this:
+
+```ts
+return (foo !== null && foo.bar === 42 && baz === 84);
+```
+
+### When the rule will not apply
+
+If the logical operations are already inside parentheses, no changes will be made:
+
+```ts
+if (foo !== null && foo.bar === 42 && baz === 84) {
+  // code
+}
+```
+
+In this case, the code is already correctly wrapped in parentheses, so no further modifications are necessary.

package/eslint/rules/enforce-logical-expression-parens.mjs

@@ -0,0 +1,39 @@
+/**
+ * @file ESLint rule which ensures logical operations are wrapped in parentheses.
+ */
+
+import { isParenthesized } from './helper/is-parenthesized.mjs';
+
+/**
+ * @type {import('eslint').Rule.RuleModule}
+ */
+export default {
+	meta: {
+		type: 'problem',
+		docs: {
+			description: 'Add parentheses around logical operations if not already present',
+			category: 'Best Practices',
+			recommended: false
+		},
+		fixable: 'code'
+	},
+	create (context) {
+		return {
+			LogicalExpression (node) {
+				// Check if the parent node is a logical expression
+				if (node.parent.type === 'LogicalExpression' || isParenthesized(context, node)) {
+					return; // Do not add parentheses if they are already present
+				}
+
+				// If no parentheses are present, add parentheses around the logical operation
+				context.report({
+					node,
+					message: 'Add parentheses around the logical operation.',
+					fix (fixer) {
+						return fixer.replaceText(node, `(${context.getSourceCode().getText(node)})`);
+					}
+				});
+			}
+		};
+	}
+};

package/eslint/rules/enforce-ternary-parens.md

@@ -0,0 +1,29 @@
+# Enforce parentheses around ternary expressions (`linter-bundle/enforce-ternary-parens`)
+
+## Rule Details
+
+This rule enforces that ternary expressions are always wrapped in parentheses to improve readability and maintain consistency in code formatting.
+
+### Examples of **incorrect** code for this rule
+
+```ts
+const foo = bar ? 1 : 2;
+const value = condition ? 'yes' : 'no';
+```
+
+### Examples of **correct** code for this rule
+
+```ts
+const foo = (bar ? 1 : 2);
+const value = (condition ? 'yes' : 'no');
+```
+
+## Why is this rule useful?
+
+- **Improved readability**: Wrapping ternary expressions in parentheses makes it clear that the entire expression is evaluated together.
+- **Consistency**: Ensures a uniform style when using the ternary operator.
+- **Avoids ambiguity**: Helps prevent misunderstandings in complex expressions.
+
+## Fixable
+
+This rule is fixable. It will automatically wrap ternary expressions in parentheses.

package/eslint/rules/enforce-ternary-parens.mjs

@@ -0,0 +1,39 @@
+/**
+ * @file ESLint rule which ensures ternary expressions are wrapped in parentheses.
+ */
+
+import { isParenthesized } from './helper/is-parenthesized.mjs';
+
+/**
+ * @type {import('eslint').Rule.RuleModule}
+ */
+export default {
+	meta: {
+		type: 'problem',
+		fixable: 'code',
+		docs: {
+			description: 'Requires ternary expressions to be wrapped in parentheses.',
+			category: 'Styling',
+			recommended: false
+		}
+	},
+
+	create (context) {
+		return {
+			ConditionalExpression (node) {
+				if (isParenthesized(context, node)) {
+					return;
+				}
+
+				context.report({
+					node,
+					message: 'Ternary expressions must be wrapped in parentheses.',
+					fix (fixer) {
+						// Wrap the entire ternary expression in parentheses.
+						return fixer.replaceText(node, `(${context.sourceCode.getText(node)})`);
+					}
+				});
+			}
+		};
+	}
+};

package/eslint/rules/ensure-lucide-import-consistency.md

@@ -0,0 +1,38 @@
+# Enforces using Lucide prefix for lucide-react imports and their usage (`linter-bundle/ensure-lucide-import-consistency`)
+
+## Rule Details
+
+This rule ensures that components imported from `lucide-react` are used with a `Lucide` prefix. It checks both the import statements and the JSX or JavaScript usage of these components.
+If a component does not follow this convention, it will be automatically fixed by replacing the component name with the properly prefixed name (`Lucide`).
+
+### Correct Usage
+
+When importing components from `lucide-react`, the component name should start with the `Lucide` prefix.
+
+#### Correct Code Example
+
+```ts
+import { LucideHome } from 'lucide-react';
+
+<LucideHome />
+```
+
+#### Incorrect Code Example
+
+```ts
+import { Home } from 'lucide-react';
+
+<Home />
+```
+
+### Rule Behavior
+
+- **Import Declarations**: If a component from `lucide-react` is imported without the `Lucide` prefix, the rule will automatically rename it to add the `Lucide` prefix.
+  
+- **JSX Usage**: In JSX, if a component is used without the `Lucide` prefix (even if correctly imported), it will be reported and fixed.
+
+- **JavaScript Usage**: For non-JSX usage (e.g., when components are referenced via `React.createElement` or directly as identifiers), the rule will also ensure the correct `Lucide` prefix is applied.
+
+## Fixable
+
+This rule is fixable. It will automatically rename components and their usages to ensure they follow the `Lucide` prefix convention.

package/eslint/rules/ensure-lucide-import-consistency.mjs

@@ -0,0 +1,112 @@
+/**
+ * @file ESLint rule which enforces using Lucide prefix for lucide-react imports and their usage.
+ */
+
+import { AST_NODE_TYPES } from '@typescript-eslint/utils';
+
+/**
+ * @typedef {'alternative'} MessageIds
+ */
+
+/** @type {import('@typescript-eslint/utils/ts-eslint').RuleModule<MessageIds>} */
+export default {
+	meta: {
+		type: 'suggestion',
+		docs: {
+			description: 'Enforces using Lucide prefix for lucide-react imports and their usage',
+			category: 'Best Practices',
+			recommended: true
+		},
+		messages: {
+			alternative: 'Please use "{{lucideName}}" instead of "{{componentName}}"'
+		},
+		schema: [],
+		fixable: 'code'
+	},
+	defaultOptions: [],
+	create (context) {
+		// Track renamed imports from lucide-react
+		const renamedImports = new Map();
+
+		return {
+			ImportDeclaration (node) {
+				if (node.source.value === 'lucide-react') {
+					for (const specifier of node.specifiers) {
+						if (specifier.type === AST_NODE_TYPES.ImportSpecifier) {
+							const importedName = /** @type {any} */(specifier.imported).name;
+							const localName = specifier.local.name;
+
+							if (!importedName.startsWith('Lucide')) {
+								const lucideName = `Lucide${importedName.replace(/Icon$/u, '')}`;
+
+								// Store the mapping of local name to Lucide name
+								renamedImports.set(localName, lucideName);
+
+								context.report({
+									node: specifier,
+									messageId: 'alternative',
+									data: { lucideName, importedName },
+									fix (fixer) {
+										return fixer.replaceText(
+											specifier.imported,
+											lucideName
+										);
+									}
+								});
+							}
+						}
+					}
+				}
+			},
+
+			// Fix JSX usage
+			JSXIdentifier (node) {
+				// Only check opening elements, not attributes
+				if (node.parent.type === AST_NODE_TYPES.JSXOpeningElement || node.parent.type === AST_NODE_TYPES.JSXClosingElement) {
+					const componentName = node.name;
+
+					if (renamedImports.has(componentName)) {
+						/** @type {string} */
+						const lucideName = renamedImports.get(componentName);
+
+						context.report({
+							node,
+							messageId: 'alternative',
+							data: { lucideName, componentName },
+							fix (fixer) {
+								return fixer.replaceText(node, lucideName);
+							}
+						});
+					}
+				}
+			},
+
+			// Fix JS usage (for non-JSX cases like React.createElement)
+			Identifier (node) {
+				// Exclude import declarations (already handled) and JSX (handled separately)
+				if (
+					node.parent.type !== AST_NODE_TYPES.ImportSpecifier &&
+					node.parent.type !== AST_NODE_TYPES.JSXIdentifier &&
+					node.parent.type !== AST_NODE_TYPES.JSXOpeningElement &&
+					node.parent.type !== AST_NODE_TYPES.JSXClosingElement
+				) {
+					const componentName = node.name;
+
+					if (renamedImports.has(componentName)) {
+						/** @type {string} */
+						const lucideName = renamedImports.get(componentName);
+
+						context.report({
+							node,
+							messageId: 'alternative',
+							data: { lucideName, componentName },
+							fix (fixer) {
+								return fixer.replaceText(node, lucideName);
+							}
+						});
+					}
+				}
+			}
+		};
+	}
+};

package/eslint/rules/helper/is-parenthesized.mjs

@@ -0,0 +1,40 @@
+/**
+ * @file ESLint helper function to check if an ESLint Rule Node is wrapped in parentheses.
+ */
+
+/**
+ * Helper function to check if the node is wrapped in parentheses.
+ *
+ * @param {import('eslint').Rule.RuleContext} context - The rule context.
+ * @param {import('eslint').Rule.Node} node - The expression node.
+ * @returns {boolean} Returns `true` with the node is wrapped by parens.
+ */
+export function isParenthesized (context, node) {
+	const { sourceCode } = context;
+
+	const firstToken = sourceCode.getFirstToken(node);
+
+	if (!firstToken) {
+		return false;
+	}
+
+	const lastToken = sourceCode.getLastToken(node);
+
+	if (!lastToken) {
+		return false;
+	}
+
+	const tokenBefore = sourceCode.getTokenBefore(firstToken);
+
+	if (!tokenBefore) {
+		return false;
+	}
+
+	const tokenAfter = sourceCode.getTokenAfter(lastToken);
+
+	if (!tokenAfter) {
+		return false;
+	}
+
+	return (tokenBefore.value === '(' && tokenAfter.value === ')');
+}

package/eslint/rules/no-extra-spaces-in-generics.md

@@ -0,0 +1,25 @@
+# Disallow spaces in TypeScript generics (`linter-bundle/no-spaces-in-generics`)
+
+## Rule Details
+
+This rule disallows spaces after the `<` and before the `>` in TypeScript generics. Ensuring that no unnecessary spaces are used around generics helps maintain consistency and readability in your code.
+
+Examples of **incorrect** code for this rule:
+
+```ts
+declare function foo< T>(x: T): T;  // Space after '<'
+
+function bar<U >(): U {             // Space before '>'
+    return null as U;
+}
+```
+
+Examples of **correct** code for this rule:
+
+```ts
+declare function foo<T>(x: T): T;
+
+function bar<U>(): U {
+    return null as U;
+}
+```

package/eslint/rules/no-extra-spaces-in-generics.mjs

@@ -0,0 +1,55 @@
+/**
+ * @file ESLint rule which disallows spaces after '<' and before '>' in TypeScript generics.
+ */
+
+/**
+ * @typedef {'noSpaceAfterLessThan' | 'noSpaceBeforeGreaterThan'} MessageIds
+ */
+
+/** @type {import('@typescript-eslint/utils/ts-eslint').RuleModule<MessageIds>} */
+export default {
+	meta: {
+		type: 'problem',
+		docs: {
+			description: "Disallow spaces after '<' and before '>' in TypeScript generics.",
+			category: 'Stylistic Issues',
+			recommended: false
+		},
+		fixable: 'whitespace',
+		schema: [],
+		messages: {
+			noSpaceAfterLessThan: "No space allowed after '<' in generics.",
+			noSpaceBeforeGreaterThan: "No space allowed before '>' in generics."
+		}
+	},
+	defaultOptions: [],
+	create (context) {
+		return {
+			TSTypeParameterInstantiation (node) {
+				const text = context.sourceCode.getText(node);
+
+				// Check for space after "<"
+				if ((/<[ \t]+/u).test(text)) {
+					context.report({
+						node,
+						messageId: 'noSpaceAfterLessThan',
+						fix (fixer) {
+							return fixer.replaceText(node, text.replace(/<[ \t]+/u, '<'));
+						}
+					});
+				}
+
+				// Check for space before ">"
+				if ((/[ \t]+>/u).test(text)) {
+					context.report({
+						node,
+						messageId: 'noSpaceBeforeGreaterThan',
+						fix (fixer) {
+							return fixer.replaceText(node, text.replace(/[ \t]+>/u, '>'));
+						}
+					});
+				}
+			}
+		};
+	}
+};

package/eslint/rules/no-ternary-return.md

@@ -0,0 +1,29 @@
+# Disallow ternary expressions as return values (`linter-bundle/no-ternary-return`)
+
+## Rule Details
+
+To improve code readability, this rule disallows using ternary expressions directly as return values. Instead, it enforces using explicit `if` statements.
+
+### Examples of **incorrect** code for this rule
+
+```ts
+function getValue(condition: boolean) {
+  return condition ? "yes" : "no";
+}
+```
+
+### Examples of **correct** code for this rule
+
+```ts
+function getValue(condition: boolean) {
+  if (condition) { 
+    return "yes";
+  } 
+  
+  return "no"; 
+}
+```
+
+## Fixable
+
+This rule is **fixable**. The autofix will transform ternary return expressions into an `if` statement followed by a separate `return`.

package/eslint/rules/no-ternary-return.mjs

@@ -0,0 +1,50 @@
+/**
+ * @file ESLint rule which disallows ternary expressions as return values for better readability.
+ */
+
+/**
+ * @type {import('eslint').Rule.RuleModule}
+ */
+export default {
+	meta: {
+		type: 'suggestion',
+		docs: {
+			description: 'Disallow ternary expressions as return values for better readability',
+			category: 'Stylistic Issues',
+			recommended: true
+		},
+		fixable: 'code',
+		schema: []
+	},
+	create (context) {
+		return {
+			ReturnStatement (node) {
+				if (node.argument && node.argument.type === 'ConditionalExpression') {
+					context.report({
+						node,
+						message: 'Avoid using ternary expressions as return values; use an if-else statement instead.',
+						fix (fixer) {
+							const sourceCode = context.sourceCode;
+							const argumentText = /** @type {any} */(node.argument)?.test;
+							const argumentConsequent = /** @type {any} */(node.argument)?.consequent;
+							const argumentAlternate = /** @type {any} */(node.argument)?.alternate;
+
+							if (!argumentText || !argumentConsequent || !argumentAlternate) {
+								return null;
+							}
+
+							const test = sourceCode.getText(argumentText);
+							const consequent = sourceCode.getText(argumentConsequent);
+							const alternate = sourceCode.getText(argumentAlternate);
+							const indent = (/^\s*/u).exec(sourceCode.getText(node))?.[0];
+
+							const fixedCode = `if (${test}) {\n${indent}  return ${consequent};\n}\n\n${indent}return ${alternate};`;
+
+							return fixer.replaceText(node, fixedCode);
+						}
+					});
+				}
+			}
+		};
+	}
+};

package/eslint/rules/no-unnecessary-typeof.md

@@ -1,4 +1,4 @@
-# Disallow unnecessary `typeof` checks (`no-unnecessary-typeof`)
+# Disallow unnecessary `typeof` checks (`linter-bundle/no-unnecessary-typeof`)
 
 ## Rule Details
 

package/eslint/rules/{no-unnecessary-typeof.js → no-unnecessary-typeof.mjs}

@@ -2,41 +2,34 @@
  * @file ESLint rule which ensures that a `typeof` operant has more than one type in TypeScript, to prevent unnecessary checks of types at runtime.
  */
 
-/* eslint-disable unicorn/prefer-module -- For ESLint, we still need to rely on CommonJS modules */
-
 /** @typedef {ts.Type & { intrinsicName?: string; types?: ts.Type[]; objectFlags?: ts.ObjectFlags; }} Type */
 
-const ts = require('typescript');
+import * as ts from 'typescript';
 
-const { ESLintUtils } = require('@typescript-eslint/utils');
+import { ESLintUtils } from '@typescript-eslint/utils';
 
 /**
- * @type {import('eslint').Rule.RuleModule}
+ * @typedef {'text'} MessageIds
  */
-module.exports = {
+
+/** @type {import('@typescript-eslint/utils/ts-eslint').RuleModule<MessageIds>} */
+export default {
 	meta: {
+		type: 'problem',
 		docs: {
 			description: 'If a `typeof` operant has only one type in TypeScript, it\'s unnecessary to check it\'s type at runtime.',
-			recommended: true
+			recommended: true,
+			requiresTypeChecking: true
 		},
 		messages: {
 			text: 'Unnecessary `typeof`, because the only possible type of {{ variableName }} is `{{ typeName }}`.'
-		}
+		},
+		schema: []
 	},
-	/**
-	 * Create a new rule.
-	 *
-	 * @param {Readonly<import('@typescript-eslint/utils/ts-eslint').RuleContext<'text', []>>} context - RuleContext of @typescript-eslint instead of ESlint
-	 * @returns {import('@typescript-eslint/utils/ts-eslint').RuleListener} RuleListener of @typescript-eslint, instead of ESlint
-	 */
+	defaultOptions: [],
+
 	create (context) {
 		return {
-			/**
-			 * Rule function to handle unary expressions.
-			 *
-			 * @param {import('@typescript-eslint/typescript-estree').TSESTree.UnaryExpression} node - UnaryExpression of @typescript-eslint instead of ESlint
-			 * @returns {import('@typescript-eslint/utils/ts-eslint').RuleFunction<import('@typescript-eslint/typescript-estree').TSESTree.UnaryExpression> | void} RuleFunction of @typescript-eslint instead of ESlint
-			 */
 			UnaryExpression (node) {
 				if (node.operator !== 'typeof') {
 					return;
@@ -136,7 +129,7 @@ function getTypeString (checker, type) {
  * @returns {boolean} Returns `true` if the type is either `any` or `unknown`, or an object which is based on `unknown`
  */
 function isAnyOrUnknown (type) {
-	// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition -- `symbol` on Object is `undefined` for `Omit<unknown, 'undefined'>`
+	// eslint-disable-next-line @typescript-eslint/no-unnecessary-condition -- @todo I've seen `symbol` to be undefined. Is that an issue in the TypeScript type definition?
 	return (type.flags === ts.TypeFlags.Any || type.flags === ts.TypeFlags.Unknown || (type.flags === ts.TypeFlags.Object && type.symbol === undefined));
 }
 

package/eslint/rules/restricted-filenames.md

@@ -7,7 +7,7 @@ In projects in which several developers or even teams work together, it is impor
 Example configuration for this rule:
 
 ```js
-'restricted-filenames': ['error', {
+'linter-bundle/restricted-filenames': ['error', {
   basePath: './src',
   allowed: [
     'components/**/index.tsx',
@@ -64,7 +64,7 @@ If both are set, `disallowed` wins over `allowed` and all unspecified files are
 
 Instead of defining the same complex patterns over and over again, e.g. for casing, you can write them into a variable and use them within the pattern, for example by using template strings.
 
-Example of `.eslintrc.cjs`:
+Example of `eslint.config.mjs`:
 
 ```js
 const snippets = {
@@ -77,9 +77,9 @@ const snippets = {
   pascalCase: '[A-Z]*([a-zA-Z0-9])'
 };
 
-module.exports = {
+export default {
   rules: {
-    'restricted-filenames': ['error', {
+    'linter-bundle/restricted-filenames': ['error', {
       basePath: './src',
       allowed: [
         `components/${snippets.pascalCase}/index.tsx`,

package/eslint/rules/{restricted-filenames.js → restricted-filenames.mjs}

@@ -2,19 +2,19 @@
  * @file ESLint rule which ensures that only files which match given glob patterns are part of your project.
  */
 
-/* eslint-disable unicorn/prefer-module -- For ESLint, we still need to rely on CommonJS modules */
+import path from 'node:path';
 
-const path = require('node:path');
+import micromatch from 'micromatch';
 
-const micromatch = require('micromatch');
+// eslint-disable-next-line n/no-process-env -- If the ESLint sub-process is running from within the linter-bundle, we make use of its configuration.
+const isInLinterBundle = !process.env['LINTER_BUNDLE'];
 
-// eslint-disable-next-line n/no-process-env -- Only merge the linter-bundle config, if the linting is not started by the linter-bundle CLI tool (e.g. if ESlint is running separately in VSCode), to get warnings shown there too
-const linterBundleConfig = (!process.env['LINTER_BUNDLE'] ? require('../../helper/linter-bundle-config.cjs').linterBundleConfig : undefined);
+const { linterBundleConfig } = (isInLinterBundle ? await import('../../helper/linter-bundle-config.js') : {});
 
 /**
  * @type {import('eslint').Rule.RuleModule}
  */
-module.exports = {
+export default {
 	meta: {
 		docs: {
 			description: 'Restrict file and path names with given glob patterns.',
@@ -55,7 +55,7 @@ module.exports = {
 	create: (context) => {
 		const filePath = context.filename;
 		/** @type {{ basePath: string, allowed?: string[]; disallowed?: string[]; }[]} */
-		const options = linterBundleConfig?.files?.restrictions ? [...linterBundleConfig.files.restrictions, ...context.options] : context.options;
+		const options = (linterBundleConfig?.files?.restrictions ? [...linterBundleConfig.files.restrictions, ...context.options] : context.options);
 
 		for (const { basePath, allowed, disallowed } of options) {
 			const normalizedName = path.relative(path.join(process.cwd(), basePath), filePath);

package/eslint/storybook.mjs

@@ -0,0 +1,42 @@
+/**
+ * @file Settings for Storybook configuration and stories.
+ */
+
+export default [
+	{
+		files: ['**/*.stories.[jt]s?(x)'],
+		rules: {
+			/**
+			 * eslint-plugin-import
+			 *
+			 * @see https://github.com/import-js/eslint-plugin-import
+			 */
+			'import/no-default-export': 'off'
+		}
+	},
+	{
+		files: ['.storybook/main.ts'],
+		rules: {
+			/**
+			 * eslint-plugin-import
+			 *
+			 * @see https://github.com/import-js/eslint-plugin-import
+			 */
+			'import/no-nodejs-modules': 'off'
+		}
+	},
+	{
+		files: ['.storybook/preview.{js,cjs,mjs,jsx,ts,cts,mts,tsx}'],
+		rules: {
+			/**
+			 * eslint
+			 *
+			 * @see https://eslint.org/docs/rules/
+			 */
+			'no-underscore-dangle': ['error', {
+				allow: ['__BASE_PATH__', '___loader', '___navigate'],
+				allowAfterThis: true
+			}]
+		}
+	}
+];