@hs-web-team/eslint-config-node 3.0.0-next.9 → 3.1.0-next.1

package/CLAUDE.md

@@ -26,8 +26,13 @@ When testing changes to this package in downstream projects, you'll typically:
 ### Core Configuration File
 - **`index.js`**: The main ESLint configuration export using ESLint 9's flat config format
   - Uses `@eslint/js`, `typescript-eslint`, and `globals` packages
-  - Exports two separate configurations: one for JavaScript files (`**/*.{js,mjs,cjs}`) and one for TypeScript files (`**/*.{ts,mts,cts,tsx}`)
-  - JavaScript config uses `js/recommended`, TypeScript config uses `tseslint.configs.recommended`
+  - Exports an array of configuration objects (flat config format)
+  - Structure:
+    1. Global ignores object
+    2. `js.configs.recommended` for JavaScript baseline
+    3. JavaScript-specific config for `**/*.{js,mjs,cjs}` files
+    4. Spreads `tseslint.configs.recommended` for TypeScript baseline
+    5. TypeScript-specific config for `**/*.{ts,mts,cts,tsx}` files
   - Includes Node.js, ES2022, and Jest globals
   - Common ignores: `node_modules`, `.serverless`, `.webpack`, `dist`, `eslint.config.js`
   - Key custom rules: `no-console` (allows info/warn/error), `max-len` (120 chars), camelcase disabled

package/README.md

@@ -22,21 +22,19 @@ This is a list of ESLint rules that are recommended for use with **Hubspot Marke
 2. Add to `eslint.config.js` in project root directory
 
     ```typescript
-    import { defineConfig } from 'eslint/config';
     import wtConfig from '@hs-web-team/eslint-config-node';
 
-    export default defineConfig([
+    export default [
       ...wtConfig,
-    ]);
+    ];
     ```
 
 3. Extend the eslint on a project basis by adding rules to `eslint.config.js` e.g.
 
     ```typescript
-    import { defineConfig } from 'eslint/config';
     import wtConfig from '@hs-web-team/eslint-config-node';
 
-    export default defineConfig([
+    export default [
       // Add project-specific ignores here
       {
         ignores: ['dist/**'],
@@ -48,7 +46,7 @@ This is a list of ESLint rules that are recommended for use with **Hubspot Marke
         },
       },
       ...wtConfig, // This will include the shared rules from @hs-web-team/eslint-config-node
-    ]);
+    ];
     ```
 
 ## Where to use it

package/browser.js

@@ -0,0 +1,159 @@
+import js from '@eslint/js';
+import globals from 'globals';
+import tseslint from 'typescript-eslint';
+import reactPlugin from 'eslint-plugin-react';
+import reactHooksPlugin from 'eslint-plugin-react-hooks';
+import jsxA11yPlugin from 'eslint-plugin-jsx-a11y';
+
+// Base rules adapted from the browser config
+const baseRules = {
+  'comma-dangle': 'warn',
+  'no-param-reassign': ['warn', { props: false }],
+  'arrow-parens': 0,
+  'no-plusplus': 0,
+  'no-console': ['error', { allow: ['warn', 'error'] }],
+  'no-confusing-arrow': 0,
+  'no-trailing-spaces': ['error', { skipBlankLines: true }],
+  'no-unused-expressions': ['warn', { allowTernary: true }],
+  'max-len': [
+    2,
+    {
+      code: 120,
+      ignoreStrings: true,
+      ignoreTemplateLiterals: true
+    }
+  ],
+  'operator-linebreak': 0,
+  'implicit-arrow-linebreak': 0,
+  indent: 0,
+  'object-curly-newline': 0,
+  'function-paren-newline': 0,
+  'nonblock-statement-body-position': 0
+};
+
+// React-specific rules
+const reactRules = {
+  'react/prefer-stateless-function': 'off',
+  'react/no-array-index-key': 0,
+  'react/destructuring-assignment': 0,
+  'react/require-default-props': 0,
+  'react/self-closing-comp': [
+    2,
+    {
+      component: true,
+      html: false
+    }
+  ],
+  'react/forbid-prop-types': 0
+};
+
+// Common ignore patterns
+const commonIgnores = [
+  '**/node_modules/**',
+  '**/dist/**',
+  '**/build/**',
+  '**/.next/**',
+  '**/coverage/**',
+  'eslint.config.js'
+];
+
+export default [
+  // Global ignores
+  {
+    ignores: commonIgnores
+  },
+  // Base config for all JavaScript files
+  js.configs.recommended,
+  {
+    files: ['**/*.{js,mjs,cjs,jsx}'],
+    languageOptions: {
+      ecmaVersion: 2021,
+      sourceType: 'module',
+      globals: {
+        ...globals.browser,
+        ...globals.es2021,
+        ...globals.jest,
+        // Custom browser globals from original config
+        $: true,
+        jQuery: true,
+        Invoca: true
+      },
+      parserOptions: {
+        ecmaFeatures: {
+          jsx: true
+        }
+      }
+    },
+    rules: {
+      ...baseRules
+    }
+  },
+  // React configuration
+  {
+    files: ['**/*.{js,mjs,cjs,jsx}'],
+    plugins: {
+      react: reactPlugin,
+      'react-hooks': reactHooksPlugin,
+      'jsx-a11y': jsxA11yPlugin
+    },
+    settings: {
+      react: {
+        version: 'detect'
+      }
+    },
+    rules: {
+      ...reactPlugin.configs.recommended.rules,
+      ...reactHooksPlugin.configs.recommended.rules,
+      ...jsxA11yPlugin.configs.recommended.rules,
+      ...reactRules
+    }
+  },
+  // TypeScript config
+  ...tseslint.configs.recommended.map(config => ({
+    ...config,
+    files: ['**/*.{ts,mts,cts,tsx}']
+  })),
+  {
+    files: ['**/*.{ts,mts,cts,tsx}'],
+    languageOptions: {
+      ecmaVersion: 2021,
+      sourceType: 'module',
+      globals: {
+        ...globals.browser,
+        ...globals.es2021,
+        ...globals.jest,
+        $: true,
+        jQuery: true,
+        Invoca: true
+      },
+      parserOptions: {
+        ecmaFeatures: {
+          jsx: true
+        }
+      }
+    },
+    rules: {
+      ...baseRules
+    }
+  },
+  // React configuration for TypeScript files
+  {
+    files: ['**/*.{ts,tsx}'],
+    plugins: {
+      react: reactPlugin,
+      'react-hooks': reactHooksPlugin,
+      'jsx-a11y': jsxA11yPlugin
+    },
+    settings: {
+      react: {
+        version: 'detect'
+      }
+    },
+    rules: {
+      ...reactPlugin.configs.recommended.rules,
+      ...reactHooksPlugin.configs.recommended.rules,
+      ...jsxA11yPlugin.configs.recommended.rules,
+      ...reactRules
+    }
+  }
+];

package/docs/MIGRATION-V3.md

@@ -7,9 +7,9 @@
 > This migration requires Node.js v22 or higher and a **manual migration** from `.eslintrc` to `eslint.config.mjs`.
 
 - [ ] Upgrade to Node.js v22 or higher
-- [ ] Upgrade ESLint to v9: `npm install eslint@^9 --save-dev`
-- [ ] Update the package: `npm install @hs-web-team/eslint-config-node@latest`
+- [ ] Update the package: `npm install -D @hs-web-team/eslint-config-node@latest`
 - [ ] **Remove** `@hs-web-team/eslint-config-ts` from dependencies (no longer needed - TypeScript support is now included)
+- [ ] Remove the `--ext .js,.ts` flag from the ESLint command in your project's package.json
 - [ ] Manually create `eslint.config.mjs` (see [Manual Migration Guide](#manual-migration-guide) below)
 - [ ] Delete `.eslintrc` file
 - [ ] Run `npm run lint` to check for any errors

package/examples/browser-usage.md

@@ -0,0 +1,76 @@
+# Browser Configuration Usage
+
+This package now provides a browser configuration in addition to the Node.js configuration.
+
+## Installation
+
+```bash
+npm install --save-dev @hs-web-team/eslint-config-node
+```
+
+## Usage
+
+Create an `eslint.config.js` file in your browser/React project:
+
+```javascript
+import wtBrowserConfig from '@hs-web-team/eslint-config-node/browser';
+
+export default [
+  ...wtBrowserConfig,
+  // Add your custom overrides here
+  {
+    rules: {
+      // Custom rules
+    },
+  },
+];
+```
+
+## What's Included
+
+The browser configuration includes:
+
+- **ESLint recommended rules** for JavaScript
+- **TypeScript support** with typescript-eslint
+- **React support** with eslint-plugin-react
+- **React Hooks** rules with eslint-plugin-react-hooks
+- **Accessibility** rules with eslint-plugin-jsx-a11y
+- **Browser globals** (window, document, localStorage, etc.)
+- **Jest environment** for testing
+- **Custom globals**: jQuery, $, Invoca
+
+## Rules Adapted from Original Browser Config
+
+The configuration adapts rules from `@hs-web-team/eslint-config-browser`:
+
+- **Code Style**: 120 character line length, single quotes, trailing commas
+- **Console**: Allows `console.warn` and `console.error`
+- **React**: Flexible React component patterns
+- **Formatting**: Relaxed indentation and linebreak rules (use Prettier for formatting)
+
+## Migrating from Legacy Browser Config
+
+If you're migrating from `@hs-web-team/eslint-config-browser` (ESLint 8):
+
+1. Update your `eslint.config.js` to use flat config format
+2. Replace `extends: '@hs-web-team/eslint-config-browser'` with the import shown above
+3. Ensure you're using Node.js >= 22
+4. Review and adapt any custom rules in your project
+
+## File Patterns
+
+The configuration applies to:
+
+- JavaScript: `**/*.{js,mjs,cjs,jsx}`
+- TypeScript: `**/*.{ts,mts,cts,tsx}`
+
+## Ignored Directories
+
+The following directories are automatically ignored:
+
+- `node_modules`
+- `dist`
+- `build`
+- `.next`
+- `coverage`
+- `eslint.config.js`

package/index.js

@@ -1,7 +1,6 @@
 import js from '@eslint/js';
 import globals from 'globals';
 import tseslint from 'typescript-eslint';
-import { defineConfig } from 'eslint/config';
 
 // Base rules for all JavaScript files
 const baseRules = {
@@ -47,26 +46,30 @@ const commonIgnores = [
   'eslint.config.js',
 ];
 
-export default defineConfig([
+export default [
+  // Global ignores
+  {
+    ignores: commonIgnores,
+  },
   // Base config for all JavaScript files
+  js.configs.recommended,
   {
     files: ['**/*.{js,mjs,cjs}'],
-    plugins: { js },
-    extends: ['js/recommended'],
     languageOptions: {
       globals: {...globals.node, ...globals.es2022, ...globals.jest},
     },
-    ignores: commonIgnores,
     rules: baseRules,
   },
-  // TypeScript config that extends the base config
+  // TypeScript config - restrict to TypeScript files only
+  ...tseslint.configs.recommended.map(config => ({
+    ...config,
+    files: ['**/*.{ts,mts,cts,tsx}'],
+  })),
   {
     files: ['**/*.{ts,mts,cts,tsx}'],
-    ...tseslint.configs.recommended,
-    // You can add or override rules specific to TypeScript here
-    rules: {
-      ...baseRules,
-      // Add any TypeScript-specific rules here
+    languageOptions: {
+      globals: {...globals.node, ...globals.es2022, ...globals.jest},
     },
+    rules: baseRules,
   },
-]);
+];

package/package.json

@@ -1,9 +1,13 @@
 {
   "name": "@hs-web-team/eslint-config-node",
-  "version": "3.0.0-next.9",
+  "version": "3.1.0-next.1",
   "description": "HubSpot Marketing WebTeam ESLint rules for Node.js",
   "main": "index.js",
   "type": "module",
+  "exports": {
+    ".": "./index.js",
+    "./browser": "./browser.js"
+  },
   "scripts": {
     "lint": "npx eslint -c ./index.js *.js --fix",
     "test": "echo \"Error: no test specified\" && exit 1"
@@ -28,14 +32,18 @@
   },
   "homepage": "https://github.com/HubSpotWebTeam/wt-eslint-node#readme",
   "dependencies": {
-    "@eslint/eslintrc": "^3.3.1",
+    "@eslint/eslintrc": "^3.3.3",
     "@eslint/js": "^9.39.1",
     "@typescript-eslint/eslint-plugin": "^8.46.3",
     "@typescript-eslint/parser": "^8.46.3",
+    "eslint": "^9.39.1",
     "eslint-formatter-checkstyle": "^9.0.1",
+    "eslint-plugin-jsx-a11y": "^6.10.2",
+    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-react-hooks": "^7.0.1",
     "globals": "^16.5.0",
     "jiti": "^2.6.1",
-    "prettier": "^3.6.2",
-    "typescript-eslint": "^8.46.3"
+    "prettier": "^3.7.4",
+    "typescript-eslint": "^8.48.1"
   }
 }