eslint-plugin-lit 1.12.0 → 1.13.0

package/docs/rules/no-classfield-shadowing.md

@@ -1,11 +1,11 @@
-# Disallows class fields with same name as static properties
+# Disallows class fields with same name as reactive properties
 
-Class fields set with same names as static properties will not trigger updates as expected. They will overwrite
+Class fields set with same names as reactive properties will not trigger updates as expected. They will overwrite
 accessors used for detecting changes. See https://lit.dev/msg/class-field-shadowing for more information.
 
 ## Rule Details
 
-This rule disallows class fields with same name as static properties.
+This rule disallows class fields with same name as reactive properties.
 
 The following patterns are considered warnings:
 

package/lib/rules/no-classfield-shadowing.js

@@ -17,7 +17,7 @@ const rule = {
         schema: [],
         messages: {
             noClassfieldShadowing: 'The {{ prop }} property is a class field which has the same name as ' +
-                'static property which could have unintended side-effects.'
+                'a reactive property which could have unintended side-effects.'
         }
     },
     create(context) {
@@ -27,7 +27,8 @@ const rule = {
                     const propertyMap = (0, util_1.getPropertyMap)(node);
                     const classMembers = (0, util_1.getClassFields)(node);
                     for (const [prop, { key }] of propertyMap.entries()) {
-                        if (classMembers.has(prop)) {
+                        const member = classMembers.get(prop);
+                        if (member && !(0, util_1.hasLitPropertyDecorator)(member)) {
                             context.report({
                                 node: key,
                                 messageId: 'noClassfieldShadowing',

package/lib/util.d.ts

@@ -6,6 +6,9 @@ export interface BabelDecorator extends ESTree.BaseNode {
 export interface BabelProperty extends ESTree.MethodDefinition {
     decorators?: BabelDecorator[];
 }
+export type DecoratedNode = ESTree.Node & {
+    decorators?: BabelDecorator[];
+};
 /**
  * Returns if the given node is a lit class
  * @param {ESTree.Class} clazz
@@ -46,6 +49,12 @@ export declare function getClassFields(node: ESTree.Class): ReadonlyMap<string,
  * @return {ReadonlyMap<string, ESTreeObjectExpression>}
  */
 export declare function getPropertyMap(node: ESTree.Class): ReadonlyMap<string, PropertyMapEntry>;
+/**
+ * Determines if a node has a lit property decorator
+ * @param {ESTree.Node} node Node to test
+ * @return {boolean}
+ */
+export declare function hasLitPropertyDecorator(node: ESTree.Node): boolean;
 /**
  * Generates a placeholder string for a given quasi
  *

package/lib/util.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.templateExpressionToHtml = exports.isExpressionPlaceholder = exports.getExpressionPlaceholder = exports.getPropertyMap = exports.getClassFields = exports.extractPropertyEntry = exports.getIdentifierName = exports.isLitClass = void 0;
+exports.templateExpressionToHtml = exports.isExpressionPlaceholder = exports.getExpressionPlaceholder = exports.hasLitPropertyDecorator = exports.getPropertyMap = exports.getClassFields = exports.extractPropertyEntry = exports.getIdentifierName = exports.isLitClass = void 0;
 /**
  * Returns if given node has a lit identifier
  * @param {ESTree.Node} node
@@ -107,6 +107,8 @@ function getClassFields(node) {
     return result;
 }
 exports.getClassFields = getClassFields;
+const propertyDecorators = ['state', 'property', 'internalProperty'];
+const internalDecorators = ['state', 'internalProperty'];
 /**
  * Get the properties object of an element class
  *
@@ -116,8 +118,6 @@ exports.getClassFields = getClassFields;
 function getPropertyMap(node) {
     var _a;
     const result = new Map();
-    const propertyDecorators = ['state', 'property', 'internalProperty'];
-    const internalDecorators = ['state', 'internalProperty'];
     for (const member of node.body.body) {
         if (member.type === 'PropertyDefinition' &&
             member.static &&
@@ -192,6 +192,26 @@ function getPropertyMap(node) {
     return result;
 }
 exports.getPropertyMap = getPropertyMap;
+/**
+ * Determines if a node has a lit property decorator
+ * @param {ESTree.Node} node Node to test
+ * @return {boolean}
+ */
+function hasLitPropertyDecorator(node) {
+    const decoratedNode = node;
+    if (!decoratedNode.decorators || !Array.isArray(decoratedNode.decorators)) {
+        return false;
+    }
+    for (const decorator of decoratedNode.decorators) {
+        if (decorator.expression.type === 'CallExpression' &&
+            decorator.expression.callee.type === 'Identifier' &&
+            propertyDecorators.includes(decorator.expression.callee.name)) {
+            return true;
+        }
+    }
+    return false;
+}
+exports.hasLitPropertyDecorator = hasLitPropertyDecorator;
 /**
  * Generates a placeholder string for a given quasi
  *

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eslint-plugin-lit",
-  "version": "1.12.0",
+  "version": "1.13.0",
   "description": "lit-html support for ESLint",
   "main": "lib/index.js",
   "files": [
@@ -49,8 +49,8 @@
     "eslint": ">= 5"
   },
   "devDependencies": {
-    "@babel/eslint-parser": "^7.18.9",
-    "@babel/plugin-proposal-decorators": "^7.18.10",
+    "@babel/eslint-parser": "^7.24.5",
+    "@babel/plugin-proposal-decorators": "^7.24.1",
     "@types/chai": "^4.2.16",
     "@types/eslint": "^8.4.6",
     "@types/estree": "^1.0.0",