eslint-plugin-vuetify 2.3.0 → 2.4.0

package/README.md

@@ -48,6 +48,7 @@ These rules will help you avoid deprecated components, props, and classes. They
 - Prevent the use of classes that have been removed from Vuetify ([`no-deprecated-classes`])
 - Prevent the use of the old theme class syntax ([`no-deprecated-colors`])
 - Prevent the use of deprecated import paths ([`no-deprecated-imports`])
+- Ensure icon buttons have a variant defined ([`icon-button-variant`])
 
 ### Grid system
 
@@ -63,6 +64,7 @@ These rules are designed to help migrate to the new grid system in Vuetify v2. T
 [`no-deprecated-classes`]: ./docs/rules/no-deprecated-classes.md
 [`no-deprecated-colors`]: ./docs/rules/no-deprecated-colors.md
 [`no-deprecated-imports`]: ./docs/rules/no-deprecated-imports.md
+[`icon-button-variant`]: ./docs/rules/icon-button-variant.md
 
 
 ## 💪 Supporting Vuetify

package/lib/rules/icon-button-variant.js

@@ -0,0 +1,49 @@
+'use strict';
+
+const {
+  classify,
+  getAttributes
+} = require('../util/helpers');
+
+// ------------------------------------------------------------------------------
+// Rule Definition
+// ------------------------------------------------------------------------------
+
+module.exports = {
+  meta: {
+    docs: {
+      description: 'Ensure icon buttons have a variant defined.',
+      category: 'recommended'
+    },
+    fixable: 'code',
+    schema: [{
+      type: 'string'
+    }],
+    messages: {
+      needsVariant: 'Icon buttons should have {{ a }} defined.'
+    }
+  },
+  create(context) {
+    return context.parserServices.defineTemplateBodyVisitor({
+      VElement(element) {
+        const tag = classify(element.rawName);
+        if (tag !== 'VBtn') return;
+        const attributes = getAttributes(element);
+        const iconAttribute = attributes.find(attr => attr.name === 'icon');
+        if (!iconAttribute) return;
+        if (attributes.some(attr => attr.name === 'variant')) return;
+        const variant = `variant="${context.options[0] || 'text'}"`;
+        context.report({
+          node: iconAttribute.node,
+          messageId: 'needsVariant',
+          data: {
+            a: variant
+          },
+          fix(fixer) {
+            return fixer.insertTextAfter(iconAttribute.node, ' ' + variant);
+          }
+        });
+      }
+    });
+  }
+};

package/lib/rules/no-deprecated-classes.js

@@ -11,13 +11,7 @@ const replacements = new Map([[/^rounded-(r|l|tr|tl|br|bl)(-.*)?$/, ([side, rest
     bl: 'bs'
   }[side];
   return `rounded-${side}${rest || ''}`;
-}], [/^border-([rl])(.*)$/, ([side, rest]) => {
-  side = {
-    r: 'e',
-    l: 's'
-  }[side];
-  return `border-${side}${rest}`;
-}], [/^text-xs-(left|right|center|justify)$/, ([align]) => `text-${align}`], [/hidden-(xs|sm|md|lg|xl)-only/, ([breakpoint]) => `hidden-${breakpoint}`], ['scroll-y', 'overflow-y-auto'], ['hide-overflow', 'overflow-hidden'], ['show-overflow', 'overflow-visible'], ['no-wrap', 'text-no-wrap'], ['ellipsis', 'text-truncate'], ['left', 'float-left'], ['right', 'float-right'], ['display-4', 'text-h1'], ['display-3', 'text-h2'], ['display-2', 'text-h3'], ['display-1', 'text-h4'], ['headline', 'text-h5'], ['title', 'text-h6'], ['subtitle-1', 'text-subtitle-1'], ['subtitle-2', 'text-subtitle-2'], ['body-1', 'text-body-1'], ['body-2', 'text-body-2'], ['caption', 'text-caption'], ['caption', 'text-caption'], ['overline', 'text-overline'], [/^transition-(fast-out-slow-in|linear-out-slow-in|fast-out-linear-in|ease-in-out|fast-in-fast-out|swing)$/, false]]);
+}], [/^text-xs-(left|right|center|justify)$/, ([align]) => `text-${align}`], [/^hidden-(xs|sm|md|lg|xl)-only$/, ([breakpoint]) => `hidden-${breakpoint}`], ['scroll-y', 'overflow-y-auto'], ['hide-overflow', 'overflow-hidden'], ['show-overflow', 'overflow-visible'], ['no-wrap', 'text-no-wrap'], ['ellipsis', 'text-truncate'], ['left', 'float-left'], ['right', 'float-right'], ['display-4', 'text-h1'], ['display-3', 'text-h2'], ['display-2', 'text-h3'], ['display-1', 'text-h4'], ['headline', 'text-h5'], ['title', 'text-h6'], ['subtitle-1', 'text-subtitle-1'], ['subtitle-2', 'text-subtitle-2'], ['body-1', 'text-body-1'], ['body-2', 'text-body-2'], ['caption', 'text-caption'], ['caption', 'text-caption'], ['overline', 'text-overline'], [/^transition-(fast-out-slow-in|linear-out-slow-in|fast-out-linear-in|ease-in-out|fast-in-fast-out|swing)$/, false]]);
 
 // ------------------------------------------------------------------------------
 // Rule Definition

package/lib/rules/no-deprecated-props.js

@@ -89,9 +89,6 @@ const select = {
   cacheItems: false,
   deletableChips: 'closable-chips',
   disableLookup: false,
-  itemColor: {
-    custom: 'item-props.color'
-  },
   itemDisabled: {
     custom: 'item-props.disabled'
   },
@@ -316,10 +313,7 @@ const replacements = {
   VCard: {
     activeClass: false,
     loaderHeight: false,
-    outlined: {
-      name: 'variant',
-      value: 'outlined'
-    },
+    outlined: 'border',
     raised: {
       name: 'elevation',
       value: 8
@@ -1018,7 +1012,7 @@ module.exports = {
                       return [fixer.replaceText(propNameNode, replace.name), fixer.replaceText(attr.value, `"${value}"`)];
                     } else {
                       const expression = context.getSourceCode().getText(attr.value.expression);
-                      return [fixer.replaceText(propNameNode, replace.name), fixer.replaceText(attr.value, `"${expression} && '${value}'"`)];
+                      return [fixer.replaceText(propNameNode, replace.name), fixer.replaceText(attr.value, `"${expression} ? '${value}' : undefined"`)];
                     }
                   } else {
                     return fixer.replaceText(attr, `${replace.bind ? ':' : ''}${replace.name}="${value}"`);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "eslint-plugin-vuetify",
-  "version": "2.3.0",
+  "version": "2.4.0",
   "description": "An eslint plugin for Vuetify",
   "main": "lib/index.js",
   "author": "Kael Watts-Deuchar <kaelwd@gmail.com>",