feat: Follow identifier decleration

.changeset/twenty-ties-boil.md

@@ -0,0 +1,19 @@
+---
+"eslint-plugin-rtl-friendly": minor
+---
+
+Look for Identifier decleration
+
+```js
+const a = "text-left";
+//         ^^^^^^^^^
+return <div className={a} />;
+```
+
+Or even if it's assigned to another variable
+```js
+const a = "text-left";
+//         ^^^^^^^^^
+const b = a;
+return <div className={b} />;
+```

README.md

@@ -2,6 +2,9 @@
 
 Helps you write code that works the same for both LTR and RTL languages.
 
+> [!IMPORTANT]
+> Until `1.0.0` is released, this plugin is in Beta.
+
 <div align="center">
 
 [![npm version](https://img.shields.io/npm/v/eslint-plugin-rtl-friendly.svg)](https://www.npmjs.com/package/eslint-plugin-rtl-friendly)
@@ -101,7 +104,7 @@ $ pnpm add -D eslint-plugin-rtl-friendly]
 
 ### Requirements
 
-- ESLint (Flat Config)
+- ESLint >= V9 (Flat Config)
 - Tailwindcss [V3.3.0](https://tailwindcss.com/blog/tailwindcss-v3-3#simplified-rtl-support-with-logical-properties) or higher
 
 ```js

package.json

@@ -45,7 +45,7 @@
     "gen-e2e": "tsx scripts/generate-e2e"
   },
   "peerDependencies": {
-    "eslint": ">=8.0.0",
+    "eslint": ">=9.0.0",
     "tailwindcss": ">=3.3.0"
   },
   "devDependencies": {

src/rules/no-phyisical-properties/rule.ts

@@ -15,11 +15,13 @@ import { parseForPhysicalClasses } from "../../utils/tailwind.js";
 //   return `https://github.com/AhmedBaset/eslint-plugin-rtl-friendly/blob/main/src/rules/${ruleName}/README.md`;
 // });
 
-// const RULE_NAME = "no-physical-properties";
+export const RULE_NAME = "no-physical-properties";
+
 export const NO_PHYSICAL_CLASSESS = "NO_PHYSICAL_CLASSESS";
-type NO_PHYSICAL_CLASSESS = typeof NO_PHYSICAL_CLASSESS;
+export const IDENTIFIER_USED = "IDENTIFIER_USED";
+export type MessageId = "NO_PHYSICAL_CLASSESS" | "IDENTIFIER_USED";
 
-export const noPhysicalProperties: RuleModule<NO_PHYSICAL_CLASSESS> = {
+export const noPhysicalProperties: RuleModule<MessageId> = {
   // name: RULE_NAME,
   defaultOptions: [],
   meta: {
@@ -30,8 +32,8 @@ export const noPhysicalProperties: RuleModule<NO_PHYSICAL_CLASSESS> = {
     },
     fixable: "code",
     messages: {
-      // eslint-disable-next-line eslint-plugin/no-unused-message-ids
       [NO_PHYSICAL_CLASSESS]: `Avoid using physical properties such as "{{ invalid }}". Instead, use logical properties like "{{ valid }}" for better RTL support.`,
+      [IDENTIFIER_USED]: `This text is used later as a class name but contains physical properties such as "{{ invalid }}". It's better to use logical properties like "{{ valid }}" for improved RTL support.`,
     },
     schema: [],
   },
@@ -58,7 +60,7 @@ export const noPhysicalProperties: RuleModule<NO_PHYSICAL_CLASSESS> = {
         //   return;
         // }
 
-        const tokens = extractTokensFromNode(node, "checker");
+        const tokens = extractTokensFromNode(node, ctx, "checker");
         tokens?.forEach((token) => {
           const classValue = token?.getValue();
           if (!classValue) return;
@@ -74,22 +76,33 @@ export const noPhysicalProperties: RuleModule<NO_PHYSICAL_CLASSESS> = {
           const valid = parsed.map((p) => p.valid).join(" ");
 
           // cache.set(classesAsString, valid);
-          report({ ctx, node, invalid, valid, token: token ?? null });
+          report({
+            ctx,
+            node,
+            messageId: token.messageId,
+            invalid,
+            valid,
+            token: token ?? null,
+          });
         });
       },
     };
   },
 };
 
-type Context = Readonly<RuleContext<"NO_PHYSICAL_CLASSESS", []>>;
+export type Context = Readonly<
+  RuleContext<"NO_PHYSICAL_CLASSESS" | "IDENTIFIER_USED", []>
+>;
 
 function report({
   ctx,
   invalid,
   valid,
   node,
   token,
+  messageId,
 }: {
+  messageId: MessageId;
   ctx: Context;
   node: TSESTree.JSXAttribute;
   invalid: string;
@@ -98,7 +111,7 @@ function report({
 }) {
   return ctx.report({
     node,
-    messageId: NO_PHYSICAL_CLASSESS,
+    messageId,
     data: {
       invalid,
       valid,