@dartess/eslint-plugin 0.0.1

package/dist/rules/stories-export-meta.js

@@ -0,0 +1,37 @@
+import { ESLintUtils, AST_NODE_TYPES } from '@typescript-eslint/utils';
+export default ESLintUtils.RuleCreator(() => '')({
+    name: 'stories-export-meta',
+    defaultOptions: [],
+    meta: {
+        type: 'suggestion',
+        docs: {
+            description: 'The default export should include type checking using `satisfy Meta`',
+        },
+        messages: {
+            exportDefaultTypeCheck: '`export default` should be `satisfies Meta<typeof T>`',
+        },
+        schema: [],
+    },
+    create(context) {
+        return {
+            ExportDefaultDeclaration(node) {
+                const { declaration } = node;
+                const hasSatisfies = declaration.type === AST_NODE_TYPES.TSSatisfiesExpression;
+                const isMeta = hasSatisfies &&
+                    declaration.typeAnnotation.type === AST_NODE_TYPES.TSTypeReference &&
+                    declaration.typeAnnotation.typeName.type === AST_NODE_TYPES.Identifier &&
+                    declaration.typeAnnotation.typeName.name === 'Meta';
+                const isMetaWithParameter = isMeta &&
+                    declaration.typeAnnotation.type === AST_NODE_TYPES.TSTypeReference &&
+                    declaration.typeAnnotation.typeArguments &&
+                    declaration.typeAnnotation.typeArguments.params.length > 0;
+                if (!hasSatisfies || !isMeta || !isMetaWithParameter) {
+                    context.report({
+                        node: declaration,
+                        messageId: 'exportDefaultTypeCheck',
+                    });
+                }
+            },
+        };
+    },
+});

package/dist/rules/stories-export-typed.d.ts

@@ -0,0 +1,3 @@
+import { ESLintUtils } from '@typescript-eslint/utils';
+declare const _default: ESLintUtils.RuleModule<"exportStoryType", [], unknown, ESLintUtils.RuleListener>;
+export default _default;

package/dist/rules/stories-export-typed.js

@@ -0,0 +1,51 @@
+import { ESLintUtils, AST_NODE_TYPES } from '@typescript-eslint/utils';
+/**
+ * @fileoverview Stories exports should include type checking using `Story` or `StoryObj`
+ * @author Sergey Kozlov
+ */
+const validStoryNames = ['Story', 'StoryObj'];
+const validStoryNamesString = validStoryNames.map(name => `\`${name}\``).join(' or ');
+export default ESLintUtils.RuleCreator(() => '')({
+    name: 'stories-export-typed',
+    defaultOptions: [],
+    meta: {
+        type: 'suggestion',
+        docs: {
+            description: `Stories exports should include type checking using ${validStoryNamesString}`,
+        },
+        messages: {
+            exportStoryType: `stories \`export\` should be typed as ${validStoryNamesString}`,
+        },
+        schema: [],
+    },
+    create(context) {
+        return {
+            ExportNamedDeclaration: node => {
+                if (!node.declaration || !('declarations' in node.declaration)) {
+                    return;
+                }
+                const nodeStoryId = node.declaration.declarations[0].id;
+                const { typeAnnotation } = nodeStoryId;
+                if (nodeStoryId) {
+                    if (typeAnnotation?.typeAnnotation.type === AST_NODE_TYPES.TSTypeReference &&
+                        typeAnnotation?.typeAnnotation?.typeName.type === AST_NODE_TYPES.Identifier &&
+                        validStoryNames.includes(typeAnnotation?.typeAnnotation?.typeName?.name)) {
+                        return;
+                    }
+                    if (typeAnnotation) {
+                        context.report({
+                            node: typeAnnotation,
+                            messageId: 'exportStoryType',
+                        });
+                    }
+                    else {
+                        context.report({
+                            node: nodeStoryId,
+                            messageId: 'exportStoryType',
+                        });
+                    }
+                }
+            },
+        };
+    },
+});

package/dist/rules/strict-observable-components-declaration.d.ts

@@ -0,0 +1,14 @@
+import { ESLintUtils } from '@typescript-eslint/utils';
+/**
+ * @fileoverview The observable component must be an inline function.
+ * @author Sergey Kozlov
+ */
+type Options = [
+    {
+        ignoreObserverArg?: Array<string>;
+        allowedHocs?: Array<string>;
+    }
+];
+type MessageIds = 'observedIsInlined' | 'observedIsFE' | 'extraCallsAsParam' | 'observedIsNamed' | 'componentIsNamed' | 'componentIsNamedAsObserved';
+declare const _default: ESLintUtils.RuleModule<MessageIds, Options, unknown, ESLintUtils.RuleListener>;
+export default _default;

package/dist/rules/strict-observable-components-declaration.js

@@ -0,0 +1,118 @@
+import { ESLintUtils, AST_NODE_TYPES } from '@typescript-eslint/utils';
+export default ESLintUtils.RuleCreator(() => '')({
+    name: 'strict-observable-components-declaration',
+    defaultOptions: [{}],
+    meta: {
+        type: 'suggestion',
+        docs: {
+            description: 'Disallow missed and wrong named `observer` components.',
+        },
+        messages: {
+            observedIsInlined: 'The component must be an inline function.',
+            observedIsFE: 'The component must be a function expression.',
+            extraCallsAsParam: `Passing the result of a function call '{{ callName }}' is not allowed by 'ignoreObserverArg' option.`,
+            observedIsNamed: 'The component must be a named function expression.',
+            componentIsNamed: 'The return value from the observer must be assigned to a variable.',
+            componentIsNamedAsObserved: 'The name of the observable component and the name of the variable must match.',
+        },
+        schema: [
+            {
+                type: 'object',
+                properties: {
+                    ignoreObserverArg: {
+                        type: 'array',
+                        items: {
+                            type: 'string',
+                        },
+                    },
+                    allowedHocs: {
+                        type: 'array',
+                        items: {
+                            type: 'string',
+                        },
+                    },
+                },
+            },
+        ],
+    },
+    create(context) {
+        const getParent = (node, allowedHocs) => {
+            let { parent } = node;
+            if (!allowedHocs) {
+                return parent;
+            }
+            while (parent.type === AST_NODE_TYPES.CallExpression &&
+                'name' in parent.callee &&
+                allowedHocs.includes(parent.callee.name)) {
+                parent = parent.parent;
+            }
+            return parent;
+        };
+        return {
+            CallExpression(node) {
+                if (!('name' in node.callee) || node.callee.name !== 'observer') {
+                    return;
+                }
+                const [arg] = node.arguments;
+                const [options] = context.options;
+                const wrongArgType = () => {
+                    context.report({
+                        node: arg,
+                        messageId: 'observedIsFE',
+                    });
+                };
+                switch (arg.type) {
+                    case AST_NODE_TYPES.Identifier: {
+                        context.report({
+                            node: arg,
+                            messageId: 'observedIsInlined',
+                        });
+                        break;
+                    }
+                    case AST_NODE_TYPES.CallExpression: {
+                        if (options?.ignoreObserverArg) {
+                            if ('name' in arg.callee && !options.ignoreObserverArg.includes(arg.callee.name)) {
+                                context.report({
+                                    node: arg,
+                                    messageId: 'extraCallsAsParam',
+                                    data: { callName: arg.callee.name },
+                                });
+                            }
+                        }
+                        else {
+                            wrongArgType();
+                        }
+                        break;
+                    }
+                    case AST_NODE_TYPES.FunctionExpression: {
+                        if (arg.id === null) {
+                            context.report({
+                                node: arg,
+                                messageId: 'observedIsNamed',
+                            });
+                            return;
+                        }
+                        const parent = getParent(node, options?.allowedHocs);
+                        if (parent && parent.type !== AST_NODE_TYPES.VariableDeclarator) {
+                            context.report({
+                                node,
+                                messageId: 'componentIsNamed',
+                            });
+                            return;
+                        }
+                        if (parent && 'name' in parent.id && arg.id?.name !== parent.id.name) {
+                            context.report({
+                                node: parent,
+                                messageId: 'componentIsNamedAsObserved',
+                            });
+                        }
+                        break;
+                    }
+                    default: {
+                        wrongArgType();
+                    }
+                }
+            },
+        };
+    },
+});

package/dist/utils/index.d.ts

@@ -0,0 +1 @@
+export { parseGitIgnore } from './parse-git-ignore.ts';

package/dist/utils/index.js

@@ -0,0 +1 @@
+export { parseGitIgnore } from "./parse-git-ignore.js";

package/dist/utils/parse-git-ignore.d.ts

@@ -0,0 +1,2 @@
+import type { TSESLint } from '@typescript-eslint/utils';
+export declare function parseGitIgnore(): TSESLint.FlatConfig.Config;

package/dist/utils/parse-git-ignore.js

@@ -0,0 +1,7 @@
+import path from 'node:path';
+import { includeIgnoreFile } from '@eslint/compat';
+export function parseGitIgnore() {
+    const config = includeIgnoreFile(path.resolve('.gitignore'));
+    config.ignores = config.ignores?.filter(ignore => !ignore.startsWith('!'));
+    return config;
+}

package/docs/rules/jsx-text-as-child.md

@@ -0,0 +1,101 @@
+# JSX elements should not have text without translation (jsx-no-text-as-child)
+
+This rule disallows text as child in JSX elements, except specified characters like emojis,
+digits, special symbols and extra strings. This helps to ensure that JSX elements are only
+used for their intended purpose of representing translated texts.
+
+## Rule Details
+
+Examples of **incorrect** code for this rule:
+
+```js
+<MyComponent>This is some text</MyComponent>
+```
+
+Examples of **correct** code for this rule:
+
+```js
+<MyComponent>{t(translation.someText)}</MyComponent>
+```
+
+## Options
+
+`allowExtraStrings`: an array of strings that are allowed as text children in JSX elements.
+
+```json
+{
+  "@dartess/jsx-no-text-as-child": [
+    "error",
+    {
+      "allowExtraStrings": [
+        "USDT"
+      ]
+    }
+  ]
+}
+```
+
+`allowEmoji`: a boolean flag that allows emojis as text children in JSX elements.
+
+```json
+{
+  "@dartess/jsx-no-text-as-child": [
+    "error",
+    {
+      "allowEmoji": true
+    }
+  ]
+}
+```
+
+`allowDigits`: a boolean flag that allows digits as text children in JSX elements.
+
+```json
+{
+  "@dartess/jsx-no-text-as-child": [
+    "error",
+    {
+      "allowDigits": true
+    }
+  ]
+}
+```
+
+`allowSpecialSymbols`: a boolean flag that allows special symbols as text children in JSX elements.
+
+List of allowed symbols:
+
+```
+`-=[];\',./~!@#$%^&*()_+{}|:"<>?№–≈—
+```
+
+```json
+{
+  "@dartess/jsx-no-text-as-child": [
+    "error",
+    {
+      "allowSpecialSymbols": true
+    }
+  ]
+}
+```
+
+`disallowedSymbols`: allows you to prohibit some previously allowed characters
+
+
+```json
+{
+  "@dartess/jsx-no-text-as-child": [
+    "error",
+    {
+      "allowSpecialSymbols": true,
+      "disallowedSymbols": ["~"]
+    }
+  ]
+}
+```
+
+## When Not To Use It
+
+This rule is followed except for those files where translations are optional
+(service components, documentation components, etc.)

package/docs/rules/max-parent-import-depth.md

@@ -0,0 +1,31 @@
+# Disallow relative imports going up more than a specified number of parent directories (max-parent-import-depth)
+
+This rule limits the number of parent directory (../) levels allowed in import and export statements to enforce a flatter and more maintainable project structure.
+
+Unlike `import-x/no-relative-parent-imports`, the syntax is checked, not the actual position of the import, so imports from higher directories are allowed if you use aliases.
+
+## Rule Details
+
+Examples of **incorrect** code for this rule:
+
+```js
+import a from '../../../way-too-high';
+```
+
+Examples of **correct** code for this rule:
+
+```js
+import a from '../../two-up';
+```
+
+## Options
+
+This rule does not accept inline options, but requires a global ESLint setting:
+
+```json
+{
+  "settings": {
+    "maxParentImportLevels": 3 // default 2
+  }
+}
+```

package/docs/rules/prevent-mixing-external-and-internal-classes.md

@@ -0,0 +1,42 @@
+# Prevent mixing of outer and inner classes to avoid dependency on style order (prevent-mixing-external-and-internal-classes)
+
+Avoid mixing outer and inner classes on the same element. The import order of the style is not guaranteed,
+so the order in which the style is applied is also not guaranteed.
+
+## Rule Details
+
+Examples of **incorrect** code for this rule:
+
+```js
+cn(styles.root, className)
+```
+
+```js
+cn(styles.root, someItemClassName)
+```
+
+```js
+cn(styles.root, props.className)
+```
+
+```js
+cn(styles.root, props.obj.className)
+```
+
+```js
+cn(styles.root, props.someItemClassName)
+```
+
+Examples of **correct** code for this rule:
+
+```js
+cn(className)
+```
+
+```js
+cn(styles.root, styles.classItem)
+```
+
+## Options
+
+`libName` _(required)_: your classname-like package name, like `classnames` or `clsx`

package/docs/rules/require-observer.md

@@ -0,0 +1,43 @@
+# Require wrap components in observer if needed (require-observer)
+
+This rule requires that React components using specified store hooks are wrapped in `observer()` from `mobx-react-lite`.
+
+## Rule Details
+
+Examples of **incorrect** code for this rule:
+
+```js
+function MyComponent() {
+  const store = useStore();
+  return <div>{store.value}</div>;
+}
+```
+
+Examples of **correct** code for this rule:
+
+```js
+const MyComponent = observer(function MyComponent() {
+  const store = useStore();
+  return <div>{store.value}</div>;
+});
+```
+
+## Options
+
+This rule does not accept inline options, but requires a global ESLint setting:
+
+```json
+{
+  "settings": {
+    "mobx": {
+      "storeHooks": ["useStore"]
+    }
+  }
+}
+```
+
+- `storeHooks`: an array of hook names that require components to be wrapped in `observer()`.
+
+## When Not To Use It
+
+This rule should be disabled in projects that do not use MobX or do not require `observer()` wrapping for components.

package/docs/rules/stories-export-meta.md

@@ -0,0 +1,37 @@
+# Makes meta-information typing mandatory
+
+Storybook stories should contain meta information. Thanks to this rule, meta-information will always be typed.
+
+## Rule Details
+
+Examples of **incorrect** code for this rule:
+
+```ts
+export default {
+    component: Tabs,
+    title: 'Redesign/Tabs',
+}
+```
+
+```ts
+export default {
+  component: Tabs,
+  title: 'Redesign/Tabs',
+} as Meta;
+```
+
+```ts
+export default {
+    component: Tabs,
+    title: 'Redesign/Tabs',
+} satisfies Meta;
+```
+
+Examples of **correct** code for this rule:
+
+```ts
+export default {
+    component: Tabs,
+    title: 'Redesign/Tabs',
+} satisfies Meta<typeof Tabs>;
+```

package/docs/rules/stories-export-typed.md

@@ -0,0 +1,42 @@
+# Makes stories typing mandatory
+
+Forces typing of exported stories.
+
+## Rule Details
+
+Examples of **incorrect** code for this rule:
+
+```ts
+export const SimpleTabs = {
+  args: {
+    tabs: simpleTabs,
+  },
+};
+```
+
+Examples of **correct** code for this rule:
+
+```ts
+export const SimpleTabs: StoryObj<typeof Tabs> = {
+  args: {
+    tabs: simpleTabs,
+  },
+};
+```
+
+```ts
+type Story = StoryObj<typeof Tabs>;
+
+export const SimpleTabs: Story = {
+  args: {
+    tabs: simpleTabs,
+  },
+};
+
+export const TabsWithDropdown: Story = {
+  args: {
+    tabs: orderTabs,
+  },
+};
+
+```

package/docs/rules/strict-observable-components-declaration.md

@@ -0,0 +1,57 @@
+# Wrapping components in `observer` must comply with the regulations (strict-observable-components-declaration)
+
+For more convenient work and debugging, several factors must be agreed upon:
+the component that is passed to the observer must have the same name as
+the variable to which it is assigned. This provides two main benefits:
+
+1. Quick jump to a component in the IDE.
+2. Displaying the correct component name in devtools.
+
+## Rule Details
+
+Examples of **incorrect** code for this rule:
+
+```js
+const Component = observer(function() {})
+```
+
+```js
+const Component = observer(() => null)
+```
+
+```js
+const fn = () => {};
+const Component = observer(fn)
+```
+
+```js
+console.log(observer(function Component() {}));
+```
+
+```js
+const ComponentFoo = observer(function ComponentBar() {})
+```
+
+Examples of **correct** code for this rule:
+
+```js
+const Component = observer(function Component() {})
+```
+
+## Options
+
+`ignoreObserverArg`: an array of function names whose call result is valid as an argument for the observer.
+
+```json
+{
+  "@dartess/strict-observable-components-declaration": ["error", {"ignoreObserverArg": ["forwardRef"]}]
+}
+```
+
+`allowedHocs`: an array of function names that are valid for use as HOC.
+
+```json
+{
+  "@dartess/strict-observable-components-declaration": ["error", {"allowedHocs": ["someHocName"]}]
+}
+```