eslint-plugin-code-style 1.7.6 → 1.8.1

package/CHANGELOG.md

@@ -7,6 +7,37 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ---
 
+## [1.8.1] - 2026-02-03
+
+### Changed
+
+- **`function-naming-convention`** - Add `handleXxx` → `xxxHandler` auto-fix (converts `handleClick` to `clickHandler` instead of `handleClickHandler`)
+
+---
+
+## [1.8.0] - 2026-02-03
+
+### Added
+
+- **New Rule: `no-hardcoded-strings`** - Enforce importing strings from constants/strings modules instead of hardcoding them inline. Promotes maintainability, consistency, and easier internationalization.
+  - Detects hardcoded strings in JSX text content, attributes, and component logic
+  - Configurable `ignoreAttributes`, `extraIgnoreAttributes`, `ignorePatterns` options
+  - Automatically ignores technical strings (CSS units, URLs, paths, identifiers, etc.)
+  - Valid import paths: `@/constants`, `@/strings`, `@/@constants`, `@/@strings`, `@/data/constants`, `@/data/strings`
+
+### Changed
+
+- **`absolute-imports-only`** - Add `strings`, `@constants`, `@strings` to default allowed folders
+- **`module-index-exports`** - Add `strings`, `@constants`, `@strings` to default module folders
+
+### Stats
+
+- Total Rules: 70 (was 69)
+- Auto-fixable: 63 rules 🔧
+- Report-only: 7 rules (was 6)
+
+---
+
 ## [1.7.6] - 2026-02-02
 
 ### Changed
@@ -1138,6 +1169,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ---
 
+[1.8.1]: https://github.com/Mohamed-Elhawary/eslint-plugin-code-style/compare/v1.8.0...v1.8.1
+[1.8.0]: https://github.com/Mohamed-Elhawary/eslint-plugin-code-style/compare/v1.7.6...v1.8.0
 [1.7.6]: https://github.com/Mohamed-Elhawary/eslint-plugin-code-style/compare/v1.7.5...v1.7.6
 [1.7.5]: https://github.com/Mohamed-Elhawary/eslint-plugin-code-style/compare/v1.7.4...v1.7.5
 [1.7.4]: https://github.com/Mohamed-Elhawary/eslint-plugin-code-style/compare/v1.7.3...v1.7.4

package/README.md

@@ -19,7 +19,7 @@
 
 **A powerful ESLint plugin for enforcing consistent code formatting and style rules in React/JSX projects.**
 
-*69 rules (63 auto-fixable) to keep your codebase clean and consistent*
+*70 rules (63 auto-fixable) to keep your codebase clean and consistent*
 
 </div>
 
@@ -27,7 +27,7 @@
 
 ## 🎯 Why This Plugin?
 
-This plugin provides **69 custom rules** (63 auto-fixable) for code formatting. Built for **ESLint v9 flat configs**.
+This plugin provides **70 custom rules** (63 auto-fixable) for code formatting. Built for **ESLint v9 flat configs**.
 
 > **Note:** ESLint [deprecated 79 formatting rules](https://eslint.org/blog/2023/10/deprecating-formatting-rules/) in v8.53.0. Our recommended configs use `@stylistic/eslint-plugin` as the replacement for these deprecated rules.
 
@@ -36,7 +36,7 @@ This plugin provides **69 custom rules** (63 auto-fixable) for code formatting.
 - **Works alongside existing tools** — Complements ESLint's built-in rules and packages like eslint-plugin-react, eslint-plugin-import, etc
 - **Self-sufficient rules** — Each rule handles complete formatting independently
 - **Consistency at scale** — Reduces code-style differences between team members by enforcing uniform formatting across your projects
-- **Highly automated** — 63 of 69 rules support auto-fix with `eslint --fix`
+- **Highly automated** — 63 of 70 rules support auto-fix with `eslint --fix`
 
 When combined with ESLint's native rules and other popular plugins, this package helps create a complete code style solution that keeps your codebase clean and consistent.
 
@@ -236,6 +236,7 @@ rules: {
     "code-style/no-empty-lines-in-jsx": "error",
     "code-style/no-empty-lines-in-objects": "error",
     "code-style/no-empty-lines-in-switch-cases": "error",
+    "code-style/no-hardcoded-strings": "error",
     "code-style/no-inline-type-definitions": "error",
     "code-style/object-property-per-line": "error",
     "code-style/object-property-value-brace": "error",
@@ -259,7 +260,7 @@ rules: {
 
 ## 📖 Rules Categories
 
-> **69 rules total** — 63 with auto-fix 🔧, 6 report-only. See detailed examples in [Rules Reference](#-rules-reference) below.
+> **70 rules total** — 63 with auto-fix 🔧, 7 report-only. See detailed examples in [Rules Reference](#-rules-reference) below.
 >
 > **Legend:** 🔧 Auto-fixable with `eslint --fix` • ⚙️ Customizable options
 
@@ -299,7 +300,7 @@ rules: {
 | **Function Rules** | |
 | `function-call-spacing` | No space between function name and `(`: `fn()` not `fn ()` 🔧 |
 | `function-declaration-style` | Auto-fix for `func-style`: converts function declarations to arrow expressions 🔧 |
-| `function-naming-convention` | Functions use camelCase, start with verb (get/set/handle/is/has), handlers end with Handler 🔧 |
+| `function-naming-convention` | Functions use camelCase, start with verb, end with Handler suffix; handleXxx → xxxHandler 🔧 |
 | `function-object-destructure` | Non-component functions: use typed params (not destructured), destructure in body; report dot notation access 🔧 |
 | `function-params-per-line` | When multiline, each param on own line with consistent indentation 🔧 |
 | `no-empty-lines-in-function-params` | No empty lines between parameters or after `(`/before `)` 🔧 |
@@ -348,6 +349,8 @@ rules: {
 | `typescript-definition-location` | Enforce TypeScript definitions (interfaces, types, enums) to be in designated folders ⚙️ |
 | **React Rules** | |
 | `react-code-order` | Enforce consistent ordering in components and hooks: props destructure → refs → state → redux → router → context → custom hooks → derived → memo → callback → handlers → effects → return 🔧 |
+| **String Rules** | |
+| `no-hardcoded-strings` | Enforce importing strings from constants/strings modules instead of hardcoding them ⚙️ |
 | **Variable Rules** | |
 | `variable-naming-convention` | camelCase for all variables and constants, PascalCase for components, `use` prefix for hooks 🔧 |
 
@@ -1316,33 +1319,37 @@ function isAuthenticated(): boolean {
 
 **What it does:** Enforces naming conventions for functions:
 - **camelCase** required
-- **Verb prefix** recommended (get, set, handle, is, has, can, should, etc.)
-- **Event handlers** can use `handle` prefix or `Handler` suffix
+- **Verb prefix** required (get, set, fetch, is, has, can, should, click, submit, etc.)
+- **Handler suffix** required (all functions must end with `Handler`)
+- **Auto-fixes** `handleXxx` to `xxxHandler` (avoids redundant `handleClickHandler`)
+- **Auto-fixes** PascalCase to camelCase for verb-prefixed functions
 
-**Why use it:** Function names should describe actions. Verb prefixes make the purpose immediately clear.
+**Why use it:** Function names should describe actions. Verb prefixes make the purpose immediately clear, and consistent Handler suffix makes event handlers easy to identify.
 
 ```javascript
-// ✅ Good — clear verb prefixes
-function getUserData() {}
-function setUserName(name) {}
-function handleClick() {}
-function handleSubmit() {}
-function isValidEmail(email) {}
-function hasPermission(user) {}
-function canAccess(resource) {}
-function shouldUpdate(props) {}
-const fetchUsers = async () => {};
-const submitHandler = () => {};
+// ✅ Good — verb prefix + Handler suffix
+function getUserDataHandler() {}
+function setUserNameHandler(name) {}
+function clickHandler() {}
+function submitHandler() {}
+function isValidEmailHandler(email) {}
+function hasPermissionHandler(user) {}
+function canAccessHandler(resource) {}
+const fetchUsersHandler = async () => {};
 
-// ❌ Bad — no verb, unclear purpose
-function userData() {}
-function userName(name) {}
-function click() {}
-function valid(email) {}
+// ❌ Bad (auto-fixed) — handleXxx → xxxHandler
+function handleClick() {}    // → clickHandler
+function handleSubmit() {}   // → submitHandler
+function handleChange() {}   // → changeHandler
 
-// ❌ Bad — wrong case
-function GetUserData() {}
-function get_user_data() {}
+// ❌ Bad (auto-fixed) — missing Handler suffix
+function getUserData() {}    // → getUserDataHandler
+function setUserName() {}    // → setUserNameHandler
+function fetchUsers() {}     // → fetchUsersHandler
+
+// ❌ Bad (auto-fixed) — PascalCase to camelCase
+function GetUserData() {}    // → getUserDataHandler
+function FetchStatus() {}    // → fetchStatusHandler
 ```
 
 ---
@@ -3278,6 +3285,73 @@ const YetAnotherBad = ({ title }) => {
 
 <br />
 
+## 📝 String Rules
+
+### `no-hardcoded-strings`
+
+**What it does:** Enforces that user-facing strings should be imported from constants/strings modules rather than hardcoded inline. This promotes maintainability, consistency, and enables easier internationalization.
+
+**Why use it:** Hardcoded strings scattered throughout your codebase are hard to maintain, translate, and keep consistent. Centralizing strings in constants makes them easy to find, update, and potentially translate.
+
+**Options:**
+
+| Option | Type | Default | Description |
+|--------|------|---------|-------------|
+| `ignoreAttributes` | `string[]` | See below | JSX attributes to ignore (replaces defaults) |
+| `extraIgnoreAttributes` | `string[]` | `[]` | Additional JSX attributes to ignore (extends defaults) |
+| `ignorePatterns` | `string[]` | `[]` | Regex patterns for strings to ignore |
+
+**Default ignored attributes:** `className`, `id`, `type`, `name`, `href`, `src`, `alt`, `role`, `style`, `key`, `data-*`, `aria-*`, and many more HTML/SVG attributes.
+
+**Default ignored patterns:** Empty strings, single characters, CSS units (`px`, `em`, `%`), colors, URLs, paths, file extensions, MIME types, UUIDs, dates, camelCase/snake_case identifiers, HTTP methods, and other technical strings.
+
+```javascript
+// ✅ Good — strings imported from constants
+import { BUTTON_LABEL, ERROR_MESSAGE, welcomeText } from "@/constants";
+import { FORM_LABELS } from "@/strings";
+
+const Component = () => (
+    <div>
+        <button>{BUTTON_LABEL}</button>
+        <span>{ERROR_MESSAGE}</span>
+        <p>{welcomeText}</p>
+    </div>
+);
+
+const getMessage = () => ERROR_MESSAGE;
+
+// ✅ Good — technical strings are allowed
+<input type="text" className="input-field" />
+<a href="/dashboard">Link</a>
+const url = `/api/users/${id}`;
+const size = "100px";
+
+// ❌ Bad — hardcoded user-facing strings
+<button>Submit Form</button>
+<span>Something went wrong</span>
+const message = "Welcome to the application";
+return "User not found";
+```
+
+**Configuration example:**
+
+```javascript
+// Allow more attributes, add custom ignore patterns
+"code-style/no-hardcoded-strings": ["error", {
+    extraIgnoreAttributes: ["tooltip", "placeholder"],
+    ignorePatterns: ["^TODO:", "^FIXME:"]
+}]
+```
+
+**Valid import paths for constants:**
+- `@/constants` or `@/@constants`
+- `@/strings` or `@/@strings`
+- `@/data/constants` or `@/data/strings`
+
+---
+
+<br />
+
 ## 📝 Variable Rules
 
 ### `variable-naming-convention`
@@ -3311,7 +3385,7 @@ const UseAuth = () => {};          // hooks should be camelCase
 
 ## 🔧 Auto-fixing
 
-63 of 69 rules support auto-fixing. Run ESLint with the `--fix` flag:
+63 of 70 rules support auto-fixing. Run ESLint with the `--fix` flag:
 
 ```bash
 # Fix all files in src directory

package/index.d.ts

@@ -59,6 +59,7 @@ export type RuleNames =
     | "code-style/no-empty-lines-in-jsx"
     | "code-style/no-empty-lines-in-objects"
     | "code-style/no-empty-lines-in-switch-cases"
+    | "code-style/no-hardcoded-strings"
     | "code-style/object-property-per-line"
     | "code-style/object-property-value-brace"
     | "code-style/object-property-value-format"
@@ -150,6 +151,7 @@ interface PluginRules {
     "no-empty-lines-in-jsx": Rule.RuleModule;
     "no-empty-lines-in-objects": Rule.RuleModule;
     "no-empty-lines-in-switch-cases": Rule.RuleModule;
+    "no-hardcoded-strings": Rule.RuleModule;
     "object-property-per-line": Rule.RuleModule;
     "object-property-value-brace": Rule.RuleModule;
     "object-property-value-format": Rule.RuleModule;

package/index.js

@@ -1996,19 +1996,21 @@ const functionDeclarationStyle = {
  *
  * Description:
  *   Function names should follow naming conventions: camelCase,
- *   starting with a verb, and handlers ending with "Handler".
- *   Auto-fixes PascalCase functions that start with verbs to camelCase.
+ *   starting with a verb, and ending with "Handler" suffix.
+ *   Auto-fixes PascalCase functions to camelCase.
+ *   Auto-fixes handleXxx to xxxHandler (avoids "handleClickHandler").
  *
  * ✓ Good:
- *   function getUserData() {}
- *   function handleClick() {}
- *   function isValidEmail() {}
- *   const submitHandler = () => {}
+ *   function getUserDataHandler() {}
+ *   function clickHandler() {}
+ *   function isValidEmailHandler() {}
+ *   const submitHandler = () => {};
  *
  * ✗ Bad (auto-fixed):
- *   function GetUserData() {}   // → getUserData
- *   const FetchStatus = () => {} // → fetchStatus
- *   function user_data() {}
+ *   function GetUserData() {}    // → getUserDataHandler
+ *   function handleClick() {}    // → clickHandler (not handleClickHandler)
+ *   function getUserData() {}    // → getUserDataHandler
+ *   const FetchStatus = () => {} // → fetchStatusHandler
  */
 const functionNamingConvention = {
     create(context) {
@@ -2071,8 +2073,8 @@ const functionNamingConvention = {
             // Performance
             "debounce", "throttle", "memoize", "cache", "batch", "queue", "defer", "delay",
             "schedule", "preload", "prefetch", "lazy",
-            // Events
-            "handle", "on", "click", "change", "input", "press", "drag", "drop",
+            // Events (note: "handle" is NOT included - handleXxx is auto-fixed to xxxHandler)
+            "on", "click", "change", "input", "press", "drag", "drop",
             "hover", "enter", "leave", "touch", "swipe", "pinch", "tap",
             // Comparison
             "compare", "diff", "equal", "differ", "overlap", "intersect", "union", "exclude",
@@ -2212,10 +2214,57 @@ const functionNamingConvention = {
 
             const hasVerbPrefix = startsWithVerbHandler(name);
             const hasHandlerSuffix = endsWithHandler(name);
+            const startsWithHandle = /^handle[A-Z]/.test(name);
+
+            // Special case: handleXxx -> xxxHandler (to avoid handleClickHandler)
+            if (startsWithHandle && !hasHandlerSuffix) {
+                const identifierNode = node.id || node.parent.id;
+                // Remove "handle" prefix and add "Handler" suffix: handleClick -> clickHandler
+                const baseName = name.slice(6); // Remove "handle"
+                const newName = baseName[0].toLowerCase() + baseName.slice(1) + "Handler";
+
+                context.report({
+                    fix(fixer) {
+                        const scope = context.sourceCode
+                            ? context.sourceCode.getScope(node)
+                            : context.getScope();
+
+                        const variable = scope.variables.find((v) => v.name === name)
+                            || (scope.upper && scope.upper.variables.find((v) => v.name === name));
+
+                        if (!variable) return fixer.replaceText(identifierNode, newName);
+
+                        const fixes = [];
+                        const fixedRanges = new Set();
+
+                        const addFixHandler = (nodeToFix) => {
+                            const rangeKey = `${nodeToFix.range[0]}-${nodeToFix.range[1]}`;
+
+                            if (!fixedRanges.has(rangeKey)) {
+                                fixedRanges.add(rangeKey);
+                                fixes.push(fixer.replaceText(nodeToFix, newName));
+                            }
+                        };
+
+                        variable.defs.forEach((def) => {
+                            addFixHandler(def.name);
+                        });
+
+                        variable.references.forEach((ref) => {
+                            addFixHandler(ref.identifier);
+                        });
+
+                        return fixes;
+                    },
+                    message: `Function "${name}" should be "${newName}" (handleXxx → xxxHandler to avoid redundant "handleXxxHandler")`,
+                    node: identifierNode,
+                });
+                return;
+            }
 
             if (!hasVerbPrefix && !hasHandlerSuffix) {
                 context.report({
-                    message: `Function "${name}" should start with a verb (get, set, fetch, handle, etc.) AND end with "Handler" (e.g., getDataHandler, handleClickHandler)`,
+                    message: `Function "${name}" should start with a verb (get, set, fetch, etc.) AND end with "Handler" (e.g., getDataHandler, clickHandler)`,
                     node: node.id || node.parent.id,
                 });
             } else if (!hasVerbPrefix) {
@@ -4738,6 +4787,8 @@ const absoluteImportsOnly = {
 
         // Default allowed folders
         const defaultAllowedFolders = [
+            "@constants",
+            "@strings",
             "actions",
             "apis",
             "assets",
@@ -4764,6 +4815,7 @@ const absoluteImportsOnly = {
             "schemas",
             "services",
             "store",
+            "strings",
             "styles",
             "theme",
             "thunks",
@@ -5402,6 +5454,8 @@ const moduleIndexExports = {
 
         // Default module folders
         const defaultModuleFolders = [
+            "@constants",
+            "@strings",
             "actions",
             "apis",
             "assets",
@@ -5428,6 +5482,7 @@ const moduleIndexExports = {
             "schemas",
             "services",
             "store",
+            "strings",
             "styles",
             "theme",
             "thunks",
@@ -12640,6 +12695,614 @@ const stringPropertySpacing = {
     },
 };
 
+/**
+ * ───────────────────────────────────────────────────────────────
+ * Rule: No Hardcoded Strings
+ * ───────────────────────────────────────────────────────────────
+ *
+ * Description:
+ *   Enforces that user-facing strings should be imported from
+ *   constants/strings modules rather than hardcoded inline.
+ *   This promotes maintainability, consistency, and enables
+ *   easier internationalization.
+ *
+ * Options:
+ *   { ignoreAttributes: ["className", "id", ...] } - JSX attributes to ignore (replaces defaults)
+ *   { extraIgnoreAttributes: ["tooltip", ...] } - Additional JSX attributes to ignore (extends defaults)
+ *   { ignorePatterns: [/^[A-Z_]+$/, ...] } - Regex patterns for strings to ignore
+ *
+ * ✓ Good:
+ *   import { BUTTON_LABEL, ERROR_MESSAGE } from "@/constants";
+ *   import { welcomeText } from "@/strings";
+ *
+ *   <button>{BUTTON_LABEL}</button>
+ *   <span>{ERROR_MESSAGE}</span>
+ *   const message = welcomeText;
+ *
+ * ✗ Bad:
+ *   <button>Submit</button>
+ *   <span>Something went wrong</span>
+ *   const message = "Welcome to the app";
+ *   return "User not found";
+ */
+const noHardcodedStrings = {
+    create(context) {
+        const options = context.options[0] || {};
+
+        // JSX attributes that commonly contain non-translatable values
+        const defaultIgnoreAttributes = [
+            "accept",
+            "acceptCharset",
+            "accessKey",
+            "action",
+            "align",
+            "allow",
+            "allowFullScreen",
+            "alt", // Often needs translation but sometimes contains technical descriptions
+            "as",
+            "async",
+            "autoCapitalize",
+            "autoComplete",
+            "autoCorrect",
+            "autoFocus",
+            "autoPlay",
+            "capture",
+            "cellPadding",
+            "cellSpacing",
+            "charSet",
+            "className",
+            "classNames",
+            "colSpan",
+            "contentEditable",
+            "controls",
+            "controlsList",
+            "coords",
+            "crossOrigin",
+            "d", // SVG path data
+            "data",
+            "data-*",
+            "dateTime",
+            "decoding",
+            "default",
+            "defer",
+            "dir",
+            "disabled",
+            "download",
+            "draggable",
+            "encType",
+            "enterKeyHint",
+            "fill", // SVG
+            "fillRule", // SVG
+            "for",
+            "form",
+            "formAction",
+            "formEncType",
+            "formMethod",
+            "formNoValidate",
+            "formTarget",
+            "frameBorder",
+            "headers",
+            "height",
+            "hidden",
+            "high",
+            "href",
+            "hrefLang",
+            "htmlFor",
+            "httpEquiv",
+            "icon",
+            "id",
+            "imagesizes",
+            "imagesrcset",
+            "inputMode",
+            "integrity",
+            "is",
+            "itemID",
+            "itemProp",
+            "itemRef",
+            "itemScope",
+            "itemType",
+            "key",
+            "keyParams",
+            "keyType",
+            "kind",
+            "lang",
+            "list",
+            "loading",
+            "loop",
+            "low",
+            "marginHeight",
+            "marginWidth",
+            "max",
+            "maxLength",
+            "media",
+            "mediaGroup",
+            "method",
+            "min",
+            "minLength",
+            "multiple",
+            "muted",
+            "name",
+            "noModule",
+            "noValidate",
+            "nonce",
+            "open",
+            "optimum",
+            "pattern",
+            "ping",
+            "playsInline",
+            "poster",
+            "preload",
+            "profile",
+            "radioGroup",
+            "readOnly",
+            "referrerPolicy",
+            "rel",
+            "required",
+            "reversed",
+            "role",
+            "rowSpan",
+            "rows",
+            "sandbox",
+            "scope",
+            "scoped",
+            "scrolling",
+            "seamless",
+            "selected",
+            "shape",
+            "sizes",
+            "slot",
+            "span",
+            "spellCheck",
+            "src",
+            "srcDoc",
+            "srcLang",
+            "srcSet",
+            "start",
+            "step",
+            "stroke", // SVG
+            "strokeWidth", // SVG
+            "style",
+            "summary",
+            "tabIndex",
+            "target",
+            "testId",
+            "transform", // SVG
+            "translate",
+            "type",
+            "useMap",
+            "value",
+            "viewBox", // SVG
+            "width",
+            "wmode",
+            "wrap",
+            "xmlns",
+        ];
+
+        const ignoreAttributes = options.ignoreAttributes
+            || [...defaultIgnoreAttributes, ...(options.extraIgnoreAttributes || [])];
+
+        // Patterns for strings that are likely technical/non-translatable
+        const technicalPatterns = [
+            // Empty or whitespace only
+            /^\s*$/,
+            // Single characters
+            /^.$/,
+            // CSS units and values
+            /^-?\d+(\.\d+)?(px|em|rem|%|vh|vw|vmin|vmax|ch|ex|cm|mm|in|pt|pc|deg|rad|turn|s|ms|fr)?$/,
+            // Colors (hex, rgb, hsl)
+            /^#[0-9a-fA-F]{3,8}$/,
+            /^(rgb|rgba|hsl|hsla)\(.+\)$/,
+            // URLs and paths
+            /^(https?:\/\/|\/\/|\/|\.\/|\.\.\/)/,
+            // Data URLs
+            /^data:/,
+            // Email pattern check (not full validation)
+            /^mailto:/,
+            // Tel pattern
+            /^tel:/,
+            // File extensions
+            /^\.[a-zA-Z0-9]+$/,
+            // MIME types
+            /^[a-z]+\/[a-z0-9.+-]+$/,
+            // UUIDs
+            /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i,
+            // Date formats (ISO, common patterns)
+            /^\d{4}-\d{2}-\d{2}(T\d{2}:\d{2}:\d{2})?/,
+            // Time formats
+            /^\d{1,2}:\d{2}(:\d{2})?(\s?(AM|PM|am|pm))?$/,
+            // JSON keys (camelCase, snake_case, SCREAMING_SNAKE_CASE)
+            /^[a-z][a-zA-Z0-9]*$/,
+            /^[a-z][a-z0-9_]*$/,
+            /^[A-Z][A-Z0-9_]*$/,
+            // Common technical strings
+            /^(true|false|null|undefined|NaN|Infinity)$/,
+            // HTTP methods
+            /^(GET|POST|PUT|PATCH|DELETE|HEAD|OPTIONS|CONNECT|TRACE)$/,
+            // Content types
+            /^application\//,
+            // Environment variables pattern
+            /^[A-Z][A-Z0-9_]*$/,
+            // Query parameters
+            /^[a-z][a-zA-Z0-9_]*=/,
+            // CSS property-like
+            /^[a-z]+(-[a-z]+)*$/,
+            // Numbers with separators
+            /^[\d,._]+$/,
+            // Semantic version
+            /^\d+\.\d+\.\d+/,
+            // Common separators
+            /^[,;:|•·\-–—/\\]+$/,
+            // HTML entities
+            /^&[a-z]+;$/,
+            // Punctuation only
+            /^[.!?,;:'"()\[\]{}]+$/,
+        ];
+
+        const extraIgnorePatterns = (options.ignorePatterns || []).map((p) => {
+            if (typeof p === "string") return new RegExp(p);
+
+            return p;
+        });
+
+        const allIgnorePatterns = [...technicalPatterns, ...extraIgnorePatterns];
+
+        // Check if a string matches any ignore pattern
+        const shouldIgnoreStringHandler = (str) => allIgnorePatterns.some((pattern) => pattern.test(str));
+
+        // Check if we're inside a constants/strings file
+        const isConstantsFileHandler = () => {
+            const filename = context.filename || context.getFilename();
+            const normalizedPath = filename.replace(/\\/g, "/").toLowerCase();
+
+            // Check if file is in constants/strings folders
+            return /\/(constants|strings|@constants|@strings)(\/|\.)/i.test(normalizedPath)
+                || /\/data\/(constants|strings)/i.test(normalizedPath);
+        };
+
+        // Check if the string is from an imported constant
+        const importedConstantsHandler = new Set();
+
+        // Track which identifiers come from constants imports
+        const trackImportsHandler = (node) => {
+            const importPath = node.source.value;
+
+            if (typeof importPath !== "string") return;
+
+            // Check if import is from constants/strings
+            const isFromConstants = /@?\/?(@?constants|@?strings|data\/constants|data\/strings)/i
+                .test(importPath);
+
+            if (isFromConstants) {
+                node.specifiers.forEach((spec) => {
+                    if (spec.local && spec.local.name) {
+                        importedConstantsHandler.add(spec.local.name);
+                    }
+                });
+            }
+        };
+
+        // Check if a node is a reference to an imported constant
+        const isImportedConstantHandler = (node) => {
+            if (node.type === "Identifier") {
+                return importedConstantsHandler.has(node.name);
+            }
+
+            if (node.type === "MemberExpression") {
+                // Check if the object is an imported constant (e.g., STRINGS.welcome)
+                if (node.object.type === "Identifier") {
+                    return importedConstantsHandler.has(node.object.name);
+                }
+            }
+
+            return false;
+        };
+
+        // Check if we're in a component, hook, or utility function
+        const isInRelevantContextHandler = (node) => {
+            let current = node.parent;
+
+            while (current) {
+                // Check for function declarations/expressions
+                if (
+                    current.type === "FunctionDeclaration"
+                    || current.type === "FunctionExpression"
+                    || current.type === "ArrowFunctionExpression"
+                ) {
+                    // Get function name if available
+                    let funcName = null;
+
+                    if (current.id && current.id.name) {
+                        funcName = current.id.name;
+                    } else if (
+                        current.parent
+                        && current.parent.type === "VariableDeclarator"
+                        && current.parent.id
+                        && current.parent.id.name
+                    ) {
+                        funcName = current.parent.id.name;
+                    }
+
+                    if (funcName) {
+                        // React components (PascalCase)
+                        if (/^[A-Z]/.test(funcName)) return true;
+
+                        // Custom hooks (useXxx)
+                        if (/^use[A-Z]/.test(funcName)) return true;
+
+                        // Utility/helper functions (common patterns)
+                        if (/Handler$|Helper$|Util$|Utils$/i.test(funcName)) return true;
+
+                        // Any function that returns JSX is a component
+                        // (This is checked via JSX detection below)
+                    }
+
+                    return true; // Check all functions for now
+                }
+
+                // Check for JSX - if we're in JSX, we're in a component
+                if (
+                    current.type === "JSXElement"
+                    || current.type === "JSXFragment"
+                ) {
+                    return true;
+                }
+
+                current = current.parent;
+            }
+
+            return false;
+        };
+
+        // Check if string is in an object that looks like constants definition
+        const isInConstantsObjectHandler = (node) => {
+            let current = node.parent;
+
+            while (current) {
+                if (current.type === "VariableDeclarator") {
+                    const varName = current.id && current.id.name;
+
+                    // Check if variable name suggests it's a constants object
+                    if (varName && /^[A-Z][A-Z0-9_]*$|CONSTANTS?|STRINGS?|MESSAGES?|LABELS?|TEXTS?/i.test(varName)) {
+                        return true;
+                    }
+                }
+
+                // Check for export const CONSTANT_NAME = "value"
+                if (current.type === "ExportNamedDeclaration") {
+                    return true;
+                }
+
+                current = current.parent;
+            }
+
+            return false;
+        };
+
+        // Skip if we're in a constants file
+        if (isConstantsFileHandler()) {
+            return {};
+        }
+
+        return {
+            ImportDeclaration: trackImportsHandler,
+
+            // Check JSX text content
+            JSXText(node) {
+                const text = node.value.trim();
+
+                if (!text || shouldIgnoreStringHandler(text)) return;
+
+                // Check if it looks like user-facing text (contains letters and spaces)
+                if (!/[a-zA-Z]/.test(text)) return;
+
+                context.report({
+                    message: `Hardcoded string "${text.substring(0, 30)}${text.length > 30 ? "..." : ""}" should be imported from constants/strings module`,
+                    node,
+                });
+            },
+
+            // Check JSX expression containers with string literals
+            JSXExpressionContainer(node) {
+                const { expression } = node;
+
+                // Skip if it's a reference to an imported constant
+                if (isImportedConstantHandler(expression)) return;
+
+                // Check string literals
+                if (expression.type === "Literal" && typeof expression.value === "string") {
+                    const str = expression.value;
+
+                    if (shouldIgnoreStringHandler(str)) return;
+
+                    // Check if it looks like user-facing text
+                    if (!/[a-zA-Z]/.test(str)) return;
+
+                    context.report({
+                        message: `Hardcoded string "${str.substring(0, 30)}${str.length > 30 ? "..." : ""}" should be imported from constants/strings module`,
+                        node: expression,
+                    });
+                }
+
+                // Check template literals
+                if (expression.type === "TemplateLiteral") {
+                    expression.quasis.forEach((quasi) => {
+                        const str = quasi.value.cooked || quasi.value.raw;
+
+                        if (shouldIgnoreStringHandler(str)) return;
+
+                        // Check if it contains user-facing text (more than just variable placeholders)
+                        if (!/[a-zA-Z]{2,}/.test(str)) return;
+
+                        // Skip if it looks like a path or URL pattern
+                        if (/^[/.]|https?:\/\//.test(str)) return;
+
+                        context.report({
+                            message: `Hardcoded string in template literal "${str.substring(0, 30)}${str.length > 30 ? "..." : ""}" should be imported from constants/strings module`,
+                            node: quasi,
+                        });
+                    });
+                }
+            },
+
+            // Check JSX attributes
+            JSXAttribute(node) {
+                if (!node.value) return;
+
+                // Get attribute name
+                const attrName = node.name.name || (node.name.namespace && `${node.name.namespace.name}:${node.name.name.name}`);
+
+                // Skip ignored attributes
+                if (ignoreAttributes.includes(attrName)) return;
+
+                // Handle data-* attributes
+                if (attrName && attrName.startsWith("data-")) return;
+
+                // Handle aria-* attributes
+                if (attrName && attrName.startsWith("aria-")) return;
+
+                // Check string literal values
+                if (node.value.type === "Literal" && typeof node.value.value === "string") {
+                    const str = node.value.value;
+
+                    if (shouldIgnoreStringHandler(str)) return;
+
+                    // Check if it looks like user-facing text (contains letters and multiple words or is long)
+                    if (!/[a-zA-Z]/.test(str)) return;
+
+                    if (str.split(/\s+/).length < 2 && str.length < 10) return;
+
+                    context.report({
+                        message: `Hardcoded string "${str.substring(0, 30)}${str.length > 30 ? "..." : ""}" in attribute "${attrName}" should be imported from constants/strings module`,
+                        node: node.value,
+                    });
+                }
+
+                // Check expression containers
+                if (node.value.type === "JSXExpressionContainer") {
+                    const { expression } = node.value;
+
+                    // Skip if it's a reference to an imported constant
+                    if (isImportedConstantHandler(expression)) return;
+
+                    if (expression.type === "Literal" && typeof expression.value === "string") {
+                        const str = expression.value;
+
+                        if (shouldIgnoreStringHandler(str)) return;
+
+                        if (!/[a-zA-Z]/.test(str)) return;
+
+                        if (str.split(/\s+/).length < 2 && str.length < 10) return;
+
+                        context.report({
+                            message: `Hardcoded string "${str.substring(0, 30)}${str.length > 30 ? "..." : ""}" in attribute "${attrName}" should be imported from constants/strings module`,
+                            node: expression,
+                        });
+                    }
+                }
+            },
+
+            // Check string literals in component/hook/utility logic
+            Literal(node) {
+                // Only check string literals
+                if (typeof node.value !== "string") return;
+
+                const str = node.value;
+
+                // Skip if it matches ignore patterns
+                if (shouldIgnoreStringHandler(str)) return;
+
+                // Skip if not in relevant context
+                if (!isInRelevantContextHandler(node)) return;
+
+                // Skip if in a constants definition object
+                if (isInConstantsObjectHandler(node)) return;
+
+                // Skip JSX (handled separately)
+                if (node.parent.type === "JSXAttribute" || node.parent.type === "JSXExpressionContainer") return;
+
+                // Skip import/export sources
+                if (node.parent.type === "ImportDeclaration" || node.parent.type === "ExportNamedDeclaration" || node.parent.type === "ExportAllDeclaration") return;
+
+                // Skip object property keys
+                if (node.parent.type === "Property" && node.parent.key === node) return;
+
+                // Skip if it doesn't look like user-facing text
+                if (!/[a-zA-Z]/.test(str)) return;
+
+                // Require at least 2 words or be reasonably long to be considered user-facing
+                if (str.split(/\s+/).length < 2 && str.length < 15) return;
+
+                context.report({
+                    message: `Hardcoded string "${str.substring(0, 30)}${str.length > 30 ? "..." : ""}" should be imported from constants/strings module`,
+                    node,
+                });
+            },
+
+            // Check template literals in component/hook/utility logic
+            TemplateLiteral(node) {
+                // Skip if in JSX (handled separately)
+                if (node.parent.type === "JSXExpressionContainer") return;
+
+                // Skip if not in relevant context
+                if (!isInRelevantContextHandler(node)) return;
+
+                // Skip if in a constants definition
+                if (isInConstantsObjectHandler(node)) return;
+
+                // Check each quasi (static part)
+                node.quasis.forEach((quasi) => {
+                    const str = quasi.value.cooked || quasi.value.raw;
+
+                    if (shouldIgnoreStringHandler(str)) return;
+
+                    // Check if it contains substantial user-facing text
+                    if (!/[a-zA-Z]{3,}/.test(str)) return;
+
+                    // Skip if it looks like a path, URL, or query
+                    if (/^[/.]|^https?:\/\/|^[?&]/.test(str)) return;
+
+                    // Skip interpolation-heavy templates (more expressions than text)
+                    if (node.expressions.length > node.quasis.length) return;
+
+                    context.report({
+                        message: `Hardcoded string in template literal "${str.substring(0, 30)}${str.length > 30 ? "..." : ""}" should be imported from constants/strings module`,
+                        node: quasi,
+                    });
+                });
+            },
+        };
+    },
+    meta: {
+        docs: {
+            description: "Enforce importing strings from constants/strings modules instead of hardcoding them",
+        },
+        schema: [
+            {
+                additionalProperties: false,
+                properties: {
+                    extraIgnoreAttributes: {
+                        description: "Additional JSX attributes to ignore (extends defaults)",
+                        items: { type: "string" },
+                        type: "array",
+                    },
+                    ignoreAttributes: {
+                        description: "JSX attributes to ignore (replaces defaults)",
+                        items: { type: "string" },
+                        type: "array",
+                    },
+                    ignorePatterns: {
+                        description: "Regex patterns for strings to ignore",
+                        items: { type: "string" },
+                        type: "array",
+                    },
+                },
+                type: "object",
+            },
+        ],
+        type: "suggestion",
+    },
+};
+
 /**
  * ───────────────────────────────────────────────────────────────
  * Rule: Variable Naming Convention
@@ -17819,6 +18482,9 @@ export default {
         // Type/Enum rules
         "enum-type-enforcement": enumTypeEnforcement,
 
+        // String rules
+        "no-hardcoded-strings": noHardcodedStrings,
+
         // Variable rules
         "variable-naming-convention": variableNamingConvention,
     },

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "eslint-plugin-code-style",
-    "version": "1.7.6",
+    "version": "1.8.1",
     "description": "A custom ESLint plugin for enforcing consistent code formatting and style rules in React/JSX projects",
     "main": "index.js",
     "types": "index.d.ts",