first commit

app_vue/node_modules/eslint-plugin-vue/lib/rules/v-slot-style.js

@@ -0,0 +1,158 @@
+/**
+ * @author Toru Nagashima
+ * See LICENSE file in root directory for full license.
+ */
+'use strict'
+
+const { pascalCase } = require('../utils/casing')
+const utils = require('../utils')
+
+/**
+ * @typedef {Object} Options
+ * @property {"shorthand" | "longform" | "v-slot"} atComponent The style for the default slot at a custom component directly.
+ * @property {"shorthand" | "longform" | "v-slot"} default The style for the default slot at a template wrapper.
+ * @property {"shorthand" | "longform"} named The style for named slots at a template wrapper.
+ */
+
+/**
+ * Normalize options.
+ * @param {any} options The raw options to normalize.
+ * @returns {Options} The normalized options.
+ */
+function normalizeOptions(options) {
+  /** @type {Options} */
+  const normalized = {
+    atComponent: 'v-slot',
+    default: 'shorthand',
+    named: 'shorthand'
+  }
+
+  if (typeof options === 'string') {
+    normalized.atComponent =
+      normalized.default =
+      normalized.named =
+        /** @type {"shorthand" | "longform"} */ (options)
+  } else if (options != null) {
+    /** @type {(keyof Options)[]} */
+    const keys = ['atComponent', 'default', 'named']
+    for (const key of keys) {
+      if (options[key] != null) {
+        normalized[key] = options[key]
+      }
+    }
+  }
+
+  return normalized
+}
+
+/**
+ * Get the expected style.
+ * @param {Options} options The options that defined expected types.
+ * @param {VDirective} node The `v-slot` node to check.
+ * @returns {"shorthand" | "longform" | "v-slot"} The expected style.
+ */
+function getExpectedStyle(options, node) {
+  const { argument } = node.key
+
+  if (
+    argument == null ||
+    (argument.type === 'VIdentifier' && argument.name === 'default')
+  ) {
+    const element = node.parent.parent
+    return element.name === 'template' ? options.default : options.atComponent
+  }
+  return options.named
+}
+
+/**
+ * Get the expected style.
+ * @param {VDirective} node The `v-slot` node to check.
+ * @returns {"shorthand" | "longform" | "v-slot"} The expected style.
+ */
+function getActualStyle(node) {
+  const { name, argument } = node.key
+
+  if (name.rawName === '#') {
+    return 'shorthand'
+  }
+  if (argument != null) {
+    return 'longform'
+  }
+  return 'v-slot'
+}
+
+module.exports = {
+  meta: {
+    type: 'suggestion',
+    docs: {
+      description: 'enforce `v-slot` directive style',
+      categories: ['vue3-strongly-recommended', 'strongly-recommended'],
+      url: 'https://eslint.vuejs.org/rules/v-slot-style.html'
+    },
+    fixable: 'code',
+    schema: [
+      {
+        anyOf: [
+          { enum: ['shorthand', 'longform'] },
+          {
+            type: 'object',
+            properties: {
+              atComponent: { enum: ['shorthand', 'longform', 'v-slot'] },
+              default: { enum: ['shorthand', 'longform', 'v-slot'] },
+              named: { enum: ['shorthand', 'longform'] }
+            },
+            additionalProperties: false
+          }
+        ]
+      }
+    ],
+    messages: {
+      expectedShorthand: "Expected '#{{argument}}' instead of '{{actual}}'.",
+      expectedLongform:
+        "Expected 'v-slot:{{argument}}' instead of '{{actual}}'.",
+      expectedVSlot: "Expected 'v-slot' instead of '{{actual}}'."
+    }
+  },
+  /** @param {RuleContext} context */
+  create(context) {
+    const sourceCode = context.getSourceCode()
+    const options = normalizeOptions(context.options[0])
+
+    return utils.defineTemplateBodyVisitor(context, {
+      /** @param {VDirective} node */
+      "VAttribute[directive=true][key.name.name='slot']"(node) {
+        const expected = getExpectedStyle(options, node)
+        const actual = getActualStyle(node)
+        if (actual === expected) {
+          return
+        }
+
+        const { name, argument } = node.key
+        /** @type {Range} */
+        const range = [name.range[0], (argument || name).range[1]]
+        const argumentText = argument ? sourceCode.getText(argument) : 'default'
+        context.report({
+          node,
+          messageId: `expected${pascalCase(expected)}`,
+          data: {
+            actual: sourceCode.text.slice(range[0], range[1]),
+            argument: argumentText
+          },
+
+          fix(fixer) {
+            switch (expected) {
+              case 'shorthand':
+                return fixer.replaceTextRange(range, `#${argumentText}`)
+              case 'longform':
+                return fixer.replaceTextRange(range, `v-slot:${argumentText}`)
+              case 'v-slot':
+                return fixer.replaceTextRange(range, 'v-slot')
+              default:
+                return null
+            }
+          }
+        })
+      }
+    })
+  }
+}