@salesforce-ux/eslint-plugin-slds 1.0.3 → 1.0.4

package/build/index.js

@@ -1098,6 +1098,18 @@ function forEachNamespacedVariable(valueText, callback) {
   });
   forEachValue(valueText, extractor, () => false, callback);
 }
+function forEachLwcVariable(valueText, callback) {
+  const extractor = (node) => extractCssVariable(node, (variableName, childrenArray) => {
+    if (!variableName.startsWith("--lwc-")) {
+      return null;
+    }
+    const hasFallback = childrenArray.some(
+      (child) => child.type === "Operator" && child.value === ","
+    );
+    return { name: variableName, hasFallback };
+  });
+  forEachValue(valueText, extractor, () => false, callback);
+}
 function formatSuggestionHooks(hooks) {
   if (hooks.length === 1) {
     return `${hooks[0]}`;
@@ -1131,32 +1143,6 @@ function getRecommendation(lwcToken) {
   const hasRecommendation = oldValue in lwcToSlds && replacementCategory !== "empty" /* EMPTY */;
   return { hasRecommendation, recommendation, replacementCategory };
 }
-function extractLwcVariableWithFallback(node, sourceCode) {
-  if (!node?.children || node.type !== "Function" || node.name !== "var") {
-    return null;
-  }
-  const children = Array.from(node.children);
-  const firstChild = children[0];
-  if (!firstChild?.name?.startsWith("--lwc-") || firstChild.type !== "Identifier") {
-    return null;
-  }
-  const commaIndex = children.findIndex(
-    (child) => child.type === "Operator" && child.value === ","
-  );
-  let fallbackValue = null;
-  if (commaIndex !== -1 && commaIndex + 1 < children.length) {
-    const fallbackStart = children[commaIndex + 1];
-    const fallbackEnd = children[children.length - 1];
-    if (fallbackStart?.loc && fallbackEnd?.loc) {
-      const fullText = sourceCode.getText();
-      fallbackValue = fullText.substring(fallbackStart.loc.start.offset, fallbackEnd.loc.end.offset).trim();
-    }
-  }
-  return {
-    lwcToken: firstChild.name,
-    fallbackValue
-  };
-}
 function getReportMessage(cssVar, replacementCategory, recommendation) {
   if (!recommendation) {
     return {
@@ -1192,85 +1178,73 @@ var lwc_token_to_slds_hook_default = {
     messages: messages4
   },
   create(context) {
-    function reportAndFix(node, oldValue, suggestedMatch, messageId, data) {
-      let fixFunction = null;
-      if (suggestedMatch) {
-        fixFunction = (fixer) => {
-          if (node.type === "Declaration") {
-            const sourceCode = context.sourceCode;
-            const fullText = sourceCode.getText();
-            const nodeOffset = node.loc.start.offset;
-            const propertyStart = nodeOffset;
-            const propertyEnd = propertyStart + oldValue.length;
-            const textAtPosition = fullText.substring(propertyStart, propertyEnd);
-            if (textAtPosition === oldValue) {
-              return fixer.replaceTextRange([propertyStart, propertyEnd], suggestedMatch);
-            }
-          } else if (node.type === "Function" && node.name === "var") {
-            const sourceCode = context.sourceCode;
-            const fullText = sourceCode.getText();
-            const nodeOffset = node.loc.start.offset;
-            const nodeEnd = node.loc.end.offset;
-            return fixer.replaceTextRange([nodeOffset, nodeEnd], suggestedMatch);
-          } else {
-            const sourceCode = context.sourceCode;
-            const fullText = sourceCode.getText();
-            const varFunctionCall = `var(${oldValue})`;
-            const nodeOffset = node.loc.start.offset;
-            const searchStart = Math.max(0, nodeOffset - 4);
-            const searchEnd = nodeOffset + oldValue.length + 1;
-            const searchArea = fullText.substring(searchStart, searchEnd);
-            const functionCallIndex = searchArea.indexOf(varFunctionCall);
-            if (functionCallIndex !== -1) {
-              const actualStart = searchStart + functionCallIndex;
-              const actualEnd = actualStart + varFunctionCall.length;
-              return fixer.replaceTextRange([actualStart, actualEnd], suggestedMatch);
-            }
-          }
-          return null;
-        };
-      }
+    function reportAndFix(node, suggestedMatch, messageId, data, fixRange, loc) {
       context.report({
         node,
+        loc: loc || node.loc,
         messageId,
         data,
-        fix: fixFunction
+        fix: suggestedMatch && fixRange ? (fixer) => {
+          return fixer.replaceTextRange(fixRange, suggestedMatch);
+        } : void 0
       });
     }
     return {
-      // CSS custom property declarations: --lwc-* properties
-      "Declaration[property=/^--lwc-/]"(node) {
+      // CSS custom property declarations: Check both property name and value
+      "Declaration"(node) {
         const property = node.property;
-        if (shouldIgnoreDetection(property)) {
-          return;
-        }
-        const { hasRecommendation, recommendation, replacementCategory } = getRecommendation(property);
-        const { messageId, data } = getReportMessage(property, replacementCategory, recommendation);
-        const suggestedMatch = hasRecommendation && replacementCategory === "slds_token" /* SLDS_TOKEN */ ? recommendation : null;
-        reportAndFix(node, property, suggestedMatch, messageId, data);
-      },
-      // LWC tokens inside var() functions: var(--lwc-*)
-      "Function[name='var']"(node) {
-        const lwcVarInfo = extractLwcVariableWithFallback(node, context.sourceCode);
-        if (!lwcVarInfo) {
-          return;
-        }
-        const { lwcToken, fallbackValue } = lwcVarInfo;
-        if (shouldIgnoreDetection(lwcToken)) {
-          return;
-        }
-        const { hasRecommendation, recommendation, replacementCategory } = getRecommendation(lwcToken);
-        const { messageId, data } = getReportMessage(lwcToken, replacementCategory, recommendation);
-        let suggestedMatch = null;
-        if (hasRecommendation) {
-          if (replacementCategory === "slds_token" /* SLDS_TOKEN */) {
-            const originalVarCall = fallbackValue ? `var(${lwcToken}, ${fallbackValue})` : `var(${lwcToken})`;
-            suggestedMatch = `var(${recommendation}, ${originalVarCall})`;
-          } else if (replacementCategory === "raw_value" /* RAW_VALUE */) {
-            suggestedMatch = recommendation;
+        if (property && property.startsWith("--lwc-")) {
+          if (!shouldIgnoreDetection(property)) {
+            const { hasRecommendation, recommendation, replacementCategory } = getRecommendation(property);
+            const { messageId, data } = getReportMessage(property, replacementCategory, recommendation);
+            const suggestedMatch = hasRecommendation && replacementCategory === "slds_token" /* SLDS_TOKEN */ ? recommendation : null;
+            const propertyStart = node.loc.start.offset;
+            const propertyEnd = propertyStart + property.length;
+            reportAndFix(node, suggestedMatch, messageId, data, [propertyStart, propertyEnd]);
           }
         }
-        reportAndFix(node, lwcToken, suggestedMatch, messageId, data);
+        const valueText = context.sourceCode.getText(node.value);
+        if (valueText) {
+          forEachLwcVariable(valueText, (variableInfo, positionInfo) => {
+            const { name: lwcToken, hasFallback } = variableInfo;
+            if (shouldIgnoreDetection(lwcToken)) {
+              return;
+            }
+            const { hasRecommendation, recommendation, replacementCategory } = getRecommendation(lwcToken);
+            const { messageId, data } = getReportMessage(lwcToken, replacementCategory, recommendation);
+            let suggestedMatch = null;
+            if (hasRecommendation) {
+              if (replacementCategory === "slds_token" /* SLDS_TOKEN */) {
+                let fallbackValue = null;
+                if (hasFallback && positionInfo.start && positionInfo.end && positionInfo.start.offset !== void 0 && positionInfo.end.offset !== void 0) {
+                  const varCallText = valueText.substring(positionInfo.start.offset, positionInfo.end.offset);
+                  const commaIndex = varCallText.indexOf(",");
+                  if (commaIndex !== -1) {
+                    fallbackValue = varCallText.substring(commaIndex + 1, varCallText.length - 1).trim();
+                  }
+                }
+                const originalVarCall = fallbackValue ? `var(${lwcToken}, ${fallbackValue})` : `var(${lwcToken})`;
+                suggestedMatch = `var(${recommendation}, ${originalVarCall})`;
+              } else if (replacementCategory === "raw_value" /* RAW_VALUE */) {
+                suggestedMatch = recommendation;
+              }
+            }
+            const valueStartOffset = node.value.loc.start.offset;
+            const varStartOffset = valueStartOffset + (positionInfo.start?.offset || 0);
+            const varEndOffset = valueStartOffset + (positionInfo.end?.offset || valueText.length);
+            const preciseLoc = positionInfo.start && positionInfo.end && node.value.loc ? {
+              start: {
+                line: node.value.loc.start.line + positionInfo.start.line - 1,
+                column: node.value.loc.start.column + positionInfo.start.column - 1
+              },
+              end: {
+                line: node.value.loc.start.line + positionInfo.end.line - 1,
+                column: node.value.loc.start.column + positionInfo.end.column - 1
+              }
+            } : node.value.loc;
+            reportAndFix(node, suggestedMatch, messageId, data, [varStartOffset, varEndOffset], preciseLoc);
+          });
+        }
       }
     };
   }
@@ -2334,7 +2308,6 @@ var no_hardcoded_values_slds2_default = defineNoHardcodedValueRule({
 
 // src/index.ts
 var import_parser2 = __toESM(require("@html-eslint/parser"));
-var import_css = __toESM(require("@eslint/css"));
 
 // eslint.rules.json
 var eslint_rules_default = {
@@ -2382,7 +2355,7 @@ var rules = {
 var plugin = {
   meta: {
     name: "@salesforce-ux/eslint-plugin-slds",
-    version: "1.0.3"
+    version: "1.0.4"
   },
   rules,
   configs: {}
@@ -2392,13 +2365,11 @@ var cssConfigArray = [
   {
     files: ["**/*.{css,scss}"],
     language: "css/css",
-    ...import_css.default.configs.recommended,
     languageOptions: {
       tolerant: true
       // Allow recoverable parsing errors for SCSS syntax
     },
     plugins: {
-      css: import_css.default,
       "@salesforce-ux/slds": plugin
     },
     rules: eslint_rules_default.css,