@agilebot/eslint-plugin 0.2.3 → 0.2.4

package/dist/index.d.ts

@@ -4,15 +4,15 @@ declare namespace _default {
         namespace recommended {
             export let plugins: string[];
             let rules_1: {
-                '@agilebot/react/prefer-named-property-access': string;
-                '@agilebot/react/hook-use-ref': string;
-                '@agilebot/react/no-inline-styles': string;
-                '@agilebot/tss/unused-classes': string;
-                '@agilebot/tss/no-color-value': string;
-                '@agilebot/tss/class-naming': string;
-                '@agilebot/import/enforce-icon-alias': string;
-                '@agilebot/import/monorepo': string;
-                '@agilebot/stylistic/no-unnecessary-template-literals': string;
+                '@agilebot/react-prefer-named-property-access': string;
+                '@agilebot/react-hook-use-ref': string;
+                '@agilebot/react-prefer-sx-prop': string;
+                '@agilebot/tss-unused-classes': string;
+                '@agilebot/tss-no-color-value': string;
+                '@agilebot/tss-class-naming': string;
+                '@agilebot/import-enforce-icon-alias': string;
+                '@agilebot/import-monorepo': string;
+                '@agilebot/stylistic-no-unnecessary-template-literals': string;
             };
             export { rules_1 as rules };
             export namespace settings {

package/dist/index.js

@@ -1,3 +1,11 @@
+/**
+ * @license @agilebot/eslint-plugin v0.2.4
+ *
+ * Copyright (c) Agilebot, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
 'use strict';
 
 var fs = require('node:fs');
@@ -235,7 +243,7 @@ var idMissing = {
       category: 'Intl',
       recommended: true
     },
-    fixable: null,
+    fixable: undefined,
     schema: []
   },
   create: function (context) {
@@ -317,7 +325,7 @@ var idPrefix = {
       category: 'Intl',
       recommended: true
     },
-    fixable: null,
+    fixable: undefined,
     schema: [
       {
         type: 'array',
@@ -395,7 +403,7 @@ var idUnused = {
       category: 'Intl',
       recommended: true
     },
-    fixable: null,
+    fixable: undefined,
     schema: []
   },
   create: function (context) {
@@ -478,7 +486,7 @@ var noDefault = {
       category: 'Intl',
       recommended: true
     },
-    fixable: null,
+    fixable: undefined,
     schema: []
   },
   create: function (context) {
@@ -2083,15 +2091,98 @@ var hookUseRef = {
   }))
 };
 
-var noInlineStyles = {
+function* updateImportStatement(context, fixer, key) {
+  const sourceCode = context.sourceCode;
+  const importNode = sourceCode.ast.body.find(
+    node => node.type === 'ImportDeclaration' && node.source.value === 'react'
+  );
+  if (!importNode) {
+    yield fixer.insertTextBefore(
+      sourceCode.ast.body[0],
+      `import { ${key} } from 'react';\n`
+    );
+    return;
+  }
+  if (
+    importNode.specifiers.length === 1 &&
+    importNode.specifiers[0].type === 'ImportDefaultSpecifier'
+  ) {
+    yield fixer.insertTextAfter(importNode.specifiers[0], `, { ${key} }`);
+    return;
+  }
+  const alreadyImportedKeys = importNode.specifiers
+    .filter(specifier => specifier.type === 'ImportSpecifier')
+    .map(specifier => specifier.imported.name);
+  if (alreadyImportedKeys.includes(key)) {
+    return;
+  }
+  yield fixer.insertTextAfter([...importNode.specifiers].pop(), `, ${key}`);
+}
+var preferNamedPropertyAccess = utils.ESLintUtils.RuleCreator.withoutDocs({
+  defaultOptions: [],
+  meta: {
+    type: 'layout',
+    fixable: 'code',
+    docs: {
+      description:
+        'Enforce importing each member of React namespace separately instead of accessing them through React namespace'
+    },
+    messages: {
+      illegalReactPropertyAccess:
+        'Illegal React property access: {{name}}. Use named import instead.'
+    },
+    schema: []
+  },
+  create(context) {
+    return {
+      TSQualifiedName(node) {
+        if (
+          ('name' in node.left && node.left.name !== 'React') ||
+          ('name' in node.right && node.right.name.endsWith('Event'))
+        ) {
+          return;
+        }
+        context.report({
+          node,
+          messageId: 'illegalReactPropertyAccess',
+          data: {
+            name: node.right.name
+          },
+          *fix(fixer) {
+            yield fixer.replaceText(node, node.right.name);
+            yield* updateImportStatement(context, fixer, node.right.name);
+          }
+        });
+      },
+      MemberExpression(node) {
+        if (node.object.name !== 'React') {
+          return;
+        }
+        context.report({
+          node,
+          messageId: 'illegalReactPropertyAccess',
+          data: {
+            name: node.property.name
+          },
+          *fix(fixer) {
+            yield fixer.replaceText(node, node.property.name);
+            yield* updateImportStatement(context, fixer, node.property.name);
+          }
+        });
+      }
+    };
+  }
+});
+
+var preferSxProp = {
   meta: {
     docs: {
-      description: 'Disallow style props on components and DOM Nodes',
+      description: 'Prefer using sx prop instead of inline styles',
       category: 'Best Practices',
       recommended: false
     },
     messages: {
-      disallowInlineStyles:
+      preferSxProp:
         'Avoid using inline styles, use sx prop or tss-react or styled-component instead'
     },
     schema: [
@@ -2130,7 +2221,7 @@ var noInlineStyles = {
       if (prop === 'style') {
         context.report({
           node,
-          messageId: 'disallowInlineStyles'
+          messageId: 'preferSxProp'
         });
       }
     }
@@ -2148,7 +2239,7 @@ var noInlineStyles = {
       if (prop === 'style') {
         context.report({
           node,
-          messageId: 'disallowInlineStyles'
+          messageId: 'preferSxProp'
         });
       }
     }
@@ -2161,88 +2252,40 @@ var noInlineStyles = {
   }
 };
 
-function* updateImportStatement(context, fixer, key) {
-  const sourceCode = context.getSourceCode();
-  const importNode = sourceCode.ast.body.find(
-    node => node.type === 'ImportDeclaration' && node.source.value === 'react'
-  );
-  if (!importNode) {
-    yield fixer.insertTextBefore(
-      sourceCode.ast.body[0],
-      `import { ${key} } from 'react';\n`
-    );
-    return;
-  }
-  if (
-    importNode.specifiers.length === 1 &&
-    importNode.specifiers[0].type === 'ImportDefaultSpecifier'
-  ) {
-    yield fixer.insertTextAfter(importNode.specifiers[0], `, { ${key} }`);
-    return;
-  }
-  const alreadyImportedKeys = importNode.specifiers
-    .filter(specifier => specifier.type === 'ImportSpecifier')
-    .map(specifier => specifier.imported.name);
-  if (alreadyImportedKeys.includes(key)) {
-    return;
-  }
-  yield fixer.insertTextAfter([...importNode.specifiers].pop(), `, ${key}`);
-}
-var preferNamedPropertyAccess = utils.ESLintUtils.RuleCreator.withoutDocs({
-  defaultOptions: [],
+var noUnnecessaryTemplateLiterals = {
   meta: {
-    type: 'layout',
-    fixable: 'code',
+    type: 'problem',
     docs: {
-      description:
-        'Enforce importing each member of React namespace separately instead of accessing them through React namespace'
-    },
-    messages: {
-      illegalReactPropertyAccess:
-        'Illegal React property access: {{name}}. Use named import instead.'
+      description: 'Check if a template string contains only one ${}',
+      recommended: true
     },
+    fixable: 'code',
     schema: []
   },
   create(context) {
     return {
-      TSQualifiedName(node) {
+      TemplateLiteral(node) {
+        const code = context.sourceCode.getText(node);
         if (
-          ('name' in node.left && node.left.name !== 'React') ||
-          ('name' in node.right && node.right.name.endsWith('Event'))
+          code.startsWith('`${') &&
+          code.endsWith('}`') &&
+          code.split('${').length === 2
         ) {
-          return;
-        }
-        context.report({
-          node,
-          messageId: 'illegalReactPropertyAccess',
-          data: {
-            name: node.right.name
-          },
-          *fix(fixer) {
-            yield fixer.replaceText(node, node.right.name);
-            yield* updateImportStatement(context, fixer, node.right.name);
-          }
-        });
-      },
-      MemberExpression(node) {
-        if (node.object.name !== 'React') {
-          return;
+          context.report({
+            node,
+            message: 'Unnecessary template string with only one ${}.',
+            fix(fixer) {
+              return fixer.replaceText(
+                node,
+                code.substring(3, code.length - 2)
+              );
+            }
+          });
         }
-        context.report({
-          node,
-          messageId: 'illegalReactPropertyAccess',
-          data: {
-            name: node.property.name
-          },
-          *fix(fixer) {
-            yield fixer.replaceText(node, node.property.name);
-            yield* updateImportStatement(context, fixer, node.property.name);
-          }
-        });
       }
     };
   }
-});
+};
 
 function getBasicIdentifier(node) {
   if (node.type === 'Identifier') {
@@ -2320,9 +2363,6 @@ function getStyesObj(node) {
       break;
   }
 }
-function isCamelCase(value) {
-  return /^[a-z][a-zA-Z0-9]*$/.test(value);
-}
 
 var classNaming = {
   meta: {
@@ -2346,7 +2386,7 @@ var classNaming = {
             return;
           }
           const className = property.key.value || property.key.name;
-          if (!isCamelCase(className)) {
+          if (!eslintUtils.isCamelCase(className)) {
             context.report({
               node: property,
               message: `Class \`${className}\` must be camelCase in TSS.`
@@ -2492,63 +2532,28 @@ var unusedClasses = {
   }
 };
 
-var noUnnecessaryTemplateLiterals = {
-  meta: {
-    type: 'problem',
-    docs: {
-      description: 'Check if a template string contains only one ${}',
-      recommended: true
-    },
-    fixable: 'code',
-    schema: []
-  },
-  create(context) {
-    return {
-      TemplateLiteral(node) {
-        const code = context.sourceCode.getText(node);
-        if (
-          code.startsWith('`${') &&
-          code.endsWith('}`') &&
-          code.split('${').length === 2
-        ) {
-          context.report({
-            node,
-            message: 'Unnecessary template string with only one ${}.',
-            fix(fixer) {
-              return fixer.replaceText(
-                node,
-                code.substring(3, code.length - 2)
-              );
-            }
-          });
-        }
-      }
-    };
-  }
-};
-
 var ruleFiles = /*#__PURE__*/Object.freeze({
   __proto__: null,
-  src_rules_import_enforce_icon_alias: enforceIconAlias,
-  src_rules_import_monorepo: monorepo,
-  src_rules_intl_id_missing: idMissing,
-  src_rules_intl_id_prefix: idPrefix,
-  src_rules_intl_id_unused: idUnused,
-  src_rules_intl_no_default: noDefault,
-  src_rules_react_better_exhaustive_deps: betterExhaustiveDeps,
-  src_rules_react_hook_use_ref: hookUseRef,
-  src_rules_react_no_inline_styles: noInlineStyles,
-  src_rules_react_prefer_named_property_access: preferNamedPropertyAccess,
-  src_rules_stylistic_no_unnecessary_template_literals: noUnnecessaryTemplateLiterals,
-  src_rules_tss_class_naming: classNaming,
-  src_rules_tss_no_color_value: noColorValue,
-  src_rules_tss_unused_classes: unusedClasses
+  rules_import_enforce_icon_alias: enforceIconAlias,
+  rules_import_monorepo: monorepo,
+  rules_intl_id_missing: idMissing,
+  rules_intl_id_prefix: idPrefix,
+  rules_intl_id_unused: idUnused,
+  rules_intl_no_default: noDefault,
+  rules_react_better_exhaustive_deps: betterExhaustiveDeps,
+  rules_react_hook_use_ref: hookUseRef,
+  rules_react_prefer_named_property_access: preferNamedPropertyAccess,
+  rules_react_prefer_sx_prop: preferSxProp,
+  rules_stylistic_no_unnecessary_template_literals: noUnnecessaryTemplateLiterals,
+  rules_tss_class_naming: classNaming,
+  rules_tss_no_color_value: noColorValue,
+  rules_tss_unused_classes: unusedClasses
 });
 
 const rules = {};
 Object.keys(ruleFiles).forEach(key => {
-  const ruleKey = key.replace(/^src_rules_/, '');
-  const finalKey = ruleKey.replace(/_/, '/').replace(/_/g, '-');
+  const ruleKey = key.replace(/^rules_/, '');
+  const finalKey = ruleKey.replace(/_/g, '-');
   rules[finalKey] = ruleFiles[key];
 });
 var index = {
@@ -2557,15 +2562,15 @@ var index = {
     recommended: {
       plugins: ['@agilebot'],
       rules: {
-        '@agilebot/react/prefer-named-property-access': 'error',
-        '@agilebot/react/hook-use-ref': 'warn',
-        '@agilebot/react/no-inline-styles': 'error',
-        '@agilebot/tss/unused-classes': 'warn',
-        '@agilebot/tss/no-color-value': 'error',
-        '@agilebot/tss/class-naming': 'error',
-        '@agilebot/import/enforce-icon-alias': 'error',
-        '@agilebot/import/monorepo': 'error',
-        '@agilebot/stylistic/no-unnecessary-template-literals': 'error'
+        '@agilebot/react-prefer-named-property-access': 'error',
+        '@agilebot/react-hook-use-ref': 'warn',
+        '@agilebot/react-prefer-sx-prop': 'error',
+        '@agilebot/tss-unused-classes': 'warn',
+        '@agilebot/tss-no-color-value': 'error',
+        '@agilebot/tss-class-naming': 'error',
+        '@agilebot/import-enforce-icon-alias': 'error',
+        '@agilebot/import-monorepo': 'error',
+        '@agilebot/stylistic-no-unnecessary-template-literals': 'error'
       },
       settings: {
         react: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agilebot/eslint-plugin",
-  "version": "0.2.3",
+  "version": "0.2.4",
   "description": "Agilebot's ESLint plugin",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -20,7 +20,7 @@
   "dependencies": {
     "@typescript-eslint/utils": "^7.6.0",
     "eslint-plugin-react": "^7.34.1",
-    "@agilebot/eslint-utils": "0.2.3"
+    "@agilebot/eslint-utils": "0.2.4"
   },
   "peerDependencies": {
     "eslint": "^7.0.0 || ^8.0.0"
@@ -28,6 +28,9 @@
   "files": [
     "dist"
   ],
+  "devDependencies": {
+    "@types/estree": "^1.0.5"
+  },
   "scripts": {
     "build": "rollup -c rollup.config.mjs && nr dts",
     "dts": "tsc -p tsconfig.dts.json",