@dialpad/eslint-plugin-dialtone 1.8.2 → 1.10.0

package/lib/rules/deprecated-base-color-classes.js

@@ -0,0 +1,51 @@
+/**
+ * @fileoverview Detects usage of deprecated base color utility classes.
+ * @author Tico Ortega
+ */
+'use strict';
+
+// ------------------------------------------------------------------------------
+// Rule Definition
+// ------------------------------------------------------------------------------
+
+const description = 'Usage of base color utility classes are deprecated and will be removed in the future.';
+
+module.exports = {
+  meta: {
+    type: 'suggestion', // `problem`, `suggestion`, or `layout`
+    docs: {
+      description,
+      recommended: false,
+      url: 'https://github.com/dialpad/dialtone/blob/staging/packages/eslint-plugin-dialtone/docs/rules/deprecated-base-color-classes.md', // URL to the documentation page for this rule
+    },
+    fixable: null, // Or `code` or `whitespace`
+    schema: [], // Add a schema if the rule has options
+    messages: {
+      recommendBackgroundSemanticColor: `${description} Checkout the available replacements here: https://dialtone.dialpad.com/utilities/backgrounds/color.html`,
+      recommendForegroundSemanticColor: `${description} Checkout the available replacements here: https://dialtone.dialpad.com/utilities/typography/font-color.html`,
+      recommendBorderSemanticColor: `${description} Checkout the available replacements here: https://dialtone.dialpad.com/utilities/borders/color.html`,
+      recommendDivideSemanticColor: `${description} Checkout the available replacements here: https://dialtone.dialpad.com/utilities/borders/divide-color.html`,
+    }, // Add messageId and message
+  },
+
+  create (context) {
+    const sourceCode = context.sourceCode ?? context.getSourceCode();
+    return sourceCode.parserServices.defineTemplateBodyVisitor({
+      // Visitor functions for Vue templates
+      VAttribute (node) {
+        if (node.key.name === 'class') {
+          const classes = node.value.value;
+          if (classes.match(/d-bgc-\w+-\d{2,4}/)) {
+            context.report({ node, messageId: 'recommendBackgroundSemanticColor' });
+          } else if (classes.match(/d-fc-\w+-\d{2,4}/)) {
+            context.report({ node, messageId: 'recommendForegroundSemanticColor' });
+          } else if (classes.match(/d-bc-\w+-\d{2,4}/)) {
+            context.report({ node, messageId: 'recommendBorderSemanticColor' });
+          } else if (classes.match(/d-divide-\w+-\d{2,4}/)) {
+            context.report({ node, messageId: 'recommendDivideSemanticColor' });
+          }
+        }
+      },
+    });
+  },
+};

package/lib/rules/deprecated-directive.js

@@ -4,9 +4,9 @@
  */
 'use strict';
 
-//------------------------------------------------------------------------------
+// ------------------------------------------------------------------------------
 // Rule Definition
-//------------------------------------------------------------------------------
+// ------------------------------------------------------------------------------
 
 module.exports = {
   meta: {
@@ -25,7 +25,7 @@ module.exports = {
     },
   },
 
-  create(context) {
+  create (context) {
     const deprecatedDirectives = [
       {
         directiveName: 'tooltip',
@@ -34,12 +34,13 @@ module.exports = {
       },
     ];
 
-    return context.parserServices.defineTemplateBodyVisitor({
-      VAttribute(node) {
+    const sourceCode = context.sourceCode ?? context.getSourceCode();
+    return sourceCode.parserServices.defineTemplateBodyVisitor({
+      VAttribute (node) {
         deprecatedDirectives.forEach((item) => {
           if (node.directive && node.key.name.name === item.directiveName) {
             context.report({
-              node: node,
+              node,
               messageId: 'deprecatedDirective',
               data: {
                 directiveName: item.directiveName,

package/lib/rules/recommend-typography-style.js

@@ -2,17 +2,17 @@
  * @fileoverview Utilities to set Font family, Font weight, Font size, and Line height separately are discouraged in favor of composed typography utilities
  * @author Nina Repetto
  */
-"use strict";
+'use strict';
 
-//------------------------------------------------------------------------------
+// ------------------------------------------------------------------------------
 // Rule Definition
-//------------------------------------------------------------------------------
+// ------------------------------------------------------------------------------
 
 module.exports = {
   meta: {
     type: 'suggestion', // `problem`, `suggestion`, or `layout`
     docs: {
-      description: "Utilities to set Font family, Font weight, Font size, and Line height separately are discouraged in favor of composed typography utilities",
+      description: 'Utilities to set Font family, Font weight, Font size, and Line height separately are discouraged in favor of composed typography utilities',
       recommended: false,
       url: 'https://github.com/dialpad/dialtone/blob/staging/packages/eslint-plugin-dialtone/docs/rules/recommend-typography-style.md', // URL to the documentation page for this rule
     },
@@ -26,10 +26,11 @@ module.exports = {
     }, // Add messageId and message
   },
 
-  create(context) {
-    return context.parserServices.defineTemplateBodyVisitor({
+  create (context) {
+    const sourceCode = context.sourceCode ?? context.getSourceCode();
+    return sourceCode.parserServices.defineTemplateBodyVisitor({
       // Visitor functions for Vue templates
-      VAttribute(node) {
+      VAttribute (node) {
         if (node.key.name === 'class') {
           const classes = node.value.value.split(' ');
           const typographyClasses = [
@@ -46,16 +47,16 @@ module.exports = {
             'd-ff-unset',
           ];
           const typographyClassesFound = classes.filter((className) =>
-            typographyClasses.some((typographyClass) => className.includes(typographyClass))
+            typographyClasses.some((typographyClass) => className.includes(typographyClass)),
           );
           if (typographyClassesFound.length > 0) {
             context.report({
-              node: node,
+              node,
               messageId: 'recommendTypographyStyle',
             });
           }
         }
-      }
+      },
     });
-  }
+  },
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dialpad/eslint-plugin-dialtone",
-  "version": "1.8.2",
+  "version": "1.10.0",
   "description": "dialtone eslint plugin",
   "keywords": [
     "Dialpad",