feat: new jsx element and attribute resolution for dom rules (#1219)

Signed-off-by: REL1CX <[email protected]>
Co-authored-by: Copilot <[email protected]>

Author: Rel1cx

apps/website/content/docs/configuration/configure-analyzer.mdx

@@ -56,38 +56,6 @@ Example with `polymorphicPropName` set to `as`:
 // Evaluated as an h3 element
 ```
 
-### `additionalComponents` (Experimental)
-
-<Callout type="info">
-  Consider using `polymorphicPropName` instead when possible, as it's simpler
-  and more efficient.
-</Callout>
-
-<Callout type="warn">
-  Experimental feature that may lack stability and documentation.
-</Callout>
-
-Maps components and their attributes for comprehensive analysis. Supports default attribute values.
-
-Example configuration:
-
-```json
-[
-  {
-    "name": "EmbedContent",
-    "as": "iframe",
-    "attributes": [
-      {
-        "name": "sandbox",
-        "defaultValue": ""
-      }
-    ]
-  }
-]
-```
-
-This makes `<EmbedContent src="https://eslint-react.xyz" />{:tsx}` evaluate as `<iframe src="https://eslint-react.xyz" sandbox="" />{:tsx}`.
-
 ### `additionalHooks` (Experimental)
 
 <Callout type="warn">
@@ -127,20 +95,6 @@ export default [
           useEffect: ["useIsomorphicLayoutEffect"],
           useLayoutEffect: ["useIsomorphicLayoutEffect"],
         },
-
-        // (Experimental) Configure mapping for custom components and their attributes for more comprehensive analysis
-        additionalComponents: [
-          {
-            name: "Link",
-            as: "a",
-            attributes: [{ name: "to", as: "href" }],
-          },
-          {
-            name: "EmbedContent",
-            as: "iframe",
-            attributes: [{ name: "sandbox", defaultValue: "" }],
-          },
-        ],
       },
     },
   },

apps/website/content/docs/configuration/configure-analyzer.tsx

@@ -38,27 +38,6 @@ const properties = {
       />
     ),
   },
-  additionalComponents: {
-    type: "CustomComponent[]",
-    description: <Link href="#additionalcomponents">An array of components and its attributes mapping ⤵</Link>,
-    default: "[]",
-    typeDescription: (
-      <CodeBlock
-        code={dedent`
-          type CustomComponent = {
-            name: string;
-            as?: string;
-            attributes?: {
-              name: string;
-              as?: string;
-              defaultValue?: string;
-            }[]
-          }
-        `}
-        lang="ts"
-      />
-    ),
-  },
   polymorphicPropName: {
     type: "string",
     description: <Link href="#polymorphicpropname">The prop your code uses to create polymorphic components ⤵</Link>,

apps/website/content/docs/configuration/configure-enhanced-additional-components.mdx

@@ -5,7 +5,6 @@
     "!configure-language-preference",
     "configure-project-config",
     "!---Advanced Configuration---",
-    "!enhanced-additional-components",
     "!using-custom-parsers"
   ]
 }

apps/website/content/docs/configuration/meta.json

@@ -22,6 +22,7 @@
 
 ## Type Aliases
 
+- [AttributeValue](type-aliases/AttributeValue.md)
 - [Component](type-aliases/Component.md)
 - [ComponentDetectionHint](type-aliases/ComponentDetectionHint.md)
 - [ComponentEffectPhaseKind](type-aliases/ComponentEffectPhaseKind.md)
@@ -113,7 +114,6 @@
 - [findParentAttribute](functions/findParentAttribute.md)
 - [getAttribute](functions/getAttribute.md)
 - [getAttributeName](functions/getAttributeName.md)
-- [getAttributeValue](functions/getAttributeValue.md)
 - [getComponentFlagFromInitPath](functions/getComponentFlagFromInitPath.md)
 - [getComponentNameFromId](functions/getComponentNameFromId.md)
 - [getElementType](functions/getElementType.md)
@@ -151,6 +151,7 @@
 - [isRenderPropLoose](functions/isRenderPropLoose.md)
 - [isThisSetState](functions/isThisSetState.md)
 - [isUseEffectCallLoose](functions/isUseEffectCallLoose.md)
+- [resolveAttributeValue](functions/resolveAttributeValue.md)
 - [stringifyJsx](functions/stringifyJsx.md)
 - [useComponentCollector](functions/useComponentCollector.md)
 - [useComponentCollectorLegacy](functions/useComponentCollectorLegacy.md)

packages/core/docs/README.md

@@ -6,39 +6,32 @@
 
 # Function: getAttribute()
 
-> **getAttribute**(`context`, `name`, `attributes`, `initialScope?`): `undefined` \| `JSXAttribute` \| `JSXSpreadAttribute`
-
-Searches for a specific JSX attribute by name in a list of attributes
-Returns the last matching attribute (rightmost in JSX)
+> **getAttribute**(`context`, `attributes`, `initialScope?`): (`name`) => `undefined` \| `TSESTreeJSXAttributeLike`
 
 ## Parameters
 
 ### context
 
 `RuleContext`
 
-ESLint rule context
-
-### name
-
-`string`
-
-The name of the attribute to find
-
 ### attributes
 
-(`JSXAttribute` \| `JSXSpreadAttribute`)[]
-
-Array of JSX attributes to search through
+`TSESTreeJSXAttributeLike`[]
 
 ### initialScope?
 
 `Scope`
 
-Optional scope for resolving variables
-
 ## Returns
 
-`undefined` \| `JSXAttribute` \| `JSXSpreadAttribute`
+> (`name`): `undefined` \| `TSESTreeJSXAttributeLike`
+
+### Parameters
+
+#### name
+
+`string`
+
+### Returns
 
-The found attribute or undefined
+`undefined` \| `TSESTreeJSXAttributeLike`

packages/core/docs/functions/getAttribute.md

@@ -0,0 +1,23 @@
+[**@eslint-react/core**](../README.md)
+
+***
+
+[@eslint-react/core](../README.md) / resolveAttributeValue
+
+# Function: resolveAttributeValue()
+
+> **resolveAttributeValue**(`context`, `attribute`): \{ `kind`: `"boolean"`; `node?`: `undefined`; `toStatic`: `true`; \} \| \{ `kind`: `"literal"`; `node`: `BigIntLiteral` \| `BooleanLiteral` \| `NullLiteral` \| `NumberLiteral` \| `RegExpLiteral` \| `StringLiteral`; `toStatic`: `null` \| `string` \| `number` \| `bigint` \| `boolean` \| [`RegExp`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/RegExp); \} \| \{ `kind`: `"expression"`; `node`: `JSXEmptyExpression` \| `Expression`; `toStatic`: `unknown`; \} \| \{ `kind`: `"element"`; `node`: `JSXElement`; `toStatic`: `undefined`; \} \| \{ `kind`: `"spreadChild"`; `node`: `JSXEmptyExpression` \| `Expression`; `toStatic`: `undefined`; \} \| \{ `kind`: `"spreadProps"`; `node`: `Expression`; `toStatic`: `unknown`; \}
+
+## Parameters
+
+### context
+
+`RuleContext`
+
+### attribute
+
+`TSESTreeJSXAttributeLike`
+
+## Returns
+
+\{ `kind`: `"boolean"`; `node?`: `undefined`; `toStatic`: `true`; \} \| \{ `kind`: `"literal"`; `node`: `BigIntLiteral` \| `BooleanLiteral` \| `NullLiteral` \| `NumberLiteral` \| `RegExpLiteral` \| `StringLiteral`; `toStatic`: `null` \| `string` \| `number` \| `bigint` \| `boolean` \| [`RegExp`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/RegExp); \} \| \{ `kind`: `"expression"`; `node`: `JSXEmptyExpression` \| `Expression`; `toStatic`: `unknown`; \} \| \{ `kind`: `"element"`; `node`: `JSXElement`; `toStatic`: `undefined`; \} \| \{ `kind`: `"spreadChild"`; `node`: `JSXEmptyExpression` \| `Expression`; `toStatic`: `undefined`; \} \| \{ `kind`: `"spreadProps"`; `node`: `Expression`; `toStatic`: `unknown`; \}

packages/core/docs/functions/getAttributeValue.md

@@ -0,0 +1,11 @@
+[**@eslint-react/core**](../README.md)
+
+***
+
+[@eslint-react/core](../README.md) / AttributeValue
+
+# Type Alias: AttributeValue
+
+> **AttributeValue** = \{ `kind`: `"boolean"`; `toStatic`: `true`; \} \| \{ `kind`: `"element"`; `node`: `TSESTree.JSXElement`; `toStatic`: `unknown`; \} \| \{ `kind`: `"literal"`; `node`: `TSESTree.Literal`; `toStatic`: `null` \| `string` \| `number` \| `bigint` \| `boolean` \| [`RegExp`](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/RegExp); \} \| \{ `kind`: `"expression"`; `node`: `TSESTree.JSXExpressionContainer`\[`"expression"`\]; `toStatic`: `unknown`; \} \| \{ `kind`: `"spreadProps"`; `node`: `TSESTree.JSXSpreadAttribute`\[`"argument"`\]; `toStatic`: `unknown`; \} \| \{ `kind`: `"spreadChild"`; `node`: `TSESTree.JSXSpreadChild`\[`"expression"`\]; `toStatic`: `unknown`; \}
+
+Represents possible JSX attribute value types that can be resolved