From 5c0cd714473b89f615af5cc5ec24458f6c36454d Mon Sep 17 00:00:00 2001
From: Flo Edelmann <florian-edelmann@online.de>
Date: Tue, 16 Nov 2021 01:44:57 +0100
Subject: [PATCH] Docs: Add hints for rules that provide suggestions (#1708)

---
 docs/rules/README.md                          | 22 ++++++++++---------
 .../no-potential-component-option-typo.md     |  2 ++
 docs/rules/no-restricted-custom-event.md      |  2 ++
 docs/rules/no-restricted-props.md             |  2 ++
 docs/rules/no-unused-vars.md                  |  1 +
 docs/rules/require-emit-validator.md          |  2 ++
 docs/rules/require-explicit-emits.md          |  1 +
 docs/rules/require-expose.md                  |  2 ++
 docs/rules/valid-next-tick.md                 |  1 +
 tools/update-docs-rules-index.js              |  8 +++++--
 tools/update-docs.js                          |  7 +++++-
 11 files changed, 37 insertions(+), 13 deletions(-)

diff --git a/docs/rules/README.md b/docs/rules/README.md
index 8619d88f1..03ce9d584 100644
--- a/docs/rules/README.md
+++ b/docs/rules/README.md
@@ -8,6 +8,8 @@ sidebarDepth: 0
 
 ::: tip Legend
   :wrench: Indicates that the rule is fixable, and using `--fix` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fixing-problems) can automatically fix some of the reported problems.
+
+  :bulb: Indicates that some problems reported by the rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
 :::
 
 
@@ -78,7 +80,7 @@ Enforce all the rules in this category, as well as all higher priority rules, wi
 | [vue/no-template-key](./no-template-key.md) | disallow `key` attribute on `<template>` |  |
 | [vue/no-textarea-mustache](./no-textarea-mustache.md) | disallow mustaches in `<textarea>` |  |
 | [vue/no-unused-components](./no-unused-components.md) | disallow registering components that are not used inside templates |  |
-| [vue/no-unused-vars](./no-unused-vars.md) | disallow unused variable definitions of v-for directives or scope attributes |  |
+| [vue/no-unused-vars](./no-unused-vars.md) | disallow unused variable definitions of v-for directives or scope attributes | :bulb: |
 | [vue/no-use-v-if-with-v-for](./no-use-v-if-with-v-for.md) | disallow use v-if on the same element as v-for |  |
 | [vue/no-useless-template-attributes](./no-useless-template-attributes.md) | disallow useless attribute on `<template>` |  |
 | [vue/no-v-for-template-key-on-child](./no-v-for-template-key-on-child.md) | disallow key of `<template v-for>` placed on child elements |  |
@@ -95,7 +97,7 @@ Enforce all the rules in this category, as well as all higher priority rules, wi
 | [vue/use-v-on-exact](./use-v-on-exact.md) | enforce usage of `exact` modifier on `v-on` |  |
 | [vue/valid-define-emits](./valid-define-emits.md) | enforce valid `defineEmits` compiler macro |  |
 | [vue/valid-define-props](./valid-define-props.md) | enforce valid `defineProps` compiler macro |  |
-| [vue/valid-next-tick](./valid-next-tick.md) | enforce valid `nextTick` function calls | :wrench: |
+| [vue/valid-next-tick](./valid-next-tick.md) | enforce valid `nextTick` function calls | :wrench::bulb: |
 | [vue/valid-template-root](./valid-template-root.md) | enforce valid template root |  |
 | [vue/valid-v-bind](./valid-v-bind.md) | enforce valid `v-bind` directives |  |
 | [vue/valid-v-cloak](./valid-v-cloak.md) | enforce valid `v-cloak` directives |  |
@@ -144,7 +146,7 @@ Enforce all the rules in this category, as well as all higher priority rules, wi
 | [vue/one-component-per-file](./one-component-per-file.md) | enforce that each component should be in its own file |  |
 | [vue/prop-name-casing](./prop-name-casing.md) | enforce specific casing for the Prop name in Vue components |  |
 | [vue/require-default-prop](./require-default-prop.md) | require default value for props |  |
-| [vue/require-explicit-emits](./require-explicit-emits.md) | require `emits` option with name triggered by `$emit()` |  |
+| [vue/require-explicit-emits](./require-explicit-emits.md) | require `emits` option with name triggered by `$emit()` | :bulb: |
 | [vue/require-prop-types](./require-prop-types.md) | require type definitions in props |  |
 | [vue/singleline-html-element-content-newline](./singleline-html-element-content-newline.md) | require a line break before and after the contents of a singleline element | :wrench: |
 | [vue/v-bind-style](./v-bind-style.md) | enforce `v-bind` directive style | :wrench: |
@@ -202,7 +204,7 @@ Enforce all the rules in this category, as well as all higher priority rules, wi
 | [vue/no-template-key](./no-template-key.md) | disallow `key` attribute on `<template>` |  |
 | [vue/no-textarea-mustache](./no-textarea-mustache.md) | disallow mustaches in `<textarea>` |  |
 | [vue/no-unused-components](./no-unused-components.md) | disallow registering components that are not used inside templates |  |
-| [vue/no-unused-vars](./no-unused-vars.md) | disallow unused variable definitions of v-for directives or scope attributes |  |
+| [vue/no-unused-vars](./no-unused-vars.md) | disallow unused variable definitions of v-for directives or scope attributes | :bulb: |
 | [vue/no-use-v-if-with-v-for](./no-use-v-if-with-v-for.md) | disallow use v-if on the same element as v-for |  |
 | [vue/no-useless-template-attributes](./no-useless-template-attributes.md) | disallow useless attribute on `<template>` |  |
 | [vue/no-v-for-template-key](./no-v-for-template-key.md) | disallow `key` attribute on `<template v-for>` |  |
@@ -214,7 +216,7 @@ Enforce all the rules in this category, as well as all higher priority rules, wi
 | [vue/require-valid-default-prop](./require-valid-default-prop.md) | enforce props default values to be valid |  |
 | [vue/return-in-computed-property](./return-in-computed-property.md) | enforce that a return statement is present in computed property |  |
 | [vue/use-v-on-exact](./use-v-on-exact.md) | enforce usage of `exact` modifier on `v-on` |  |
-| [vue/valid-next-tick](./valid-next-tick.md) | enforce valid `nextTick` function calls | :wrench: |
+| [vue/valid-next-tick](./valid-next-tick.md) | enforce valid `nextTick` function calls | :wrench::bulb: |
 | [vue/valid-template-root](./valid-template-root.md) | enforce valid template root |  |
 | [vue/valid-v-bind-sync](./valid-v-bind-sync.md) | enforce valid `.sync` modifier on `v-bind` directives |  |
 | [vue/valid-v-bind](./valid-v-bind.md) | enforce valid `v-bind` directives |  |
@@ -323,14 +325,14 @@ For example:
 | [vue/no-empty-component-block](./no-empty-component-block.md) | disallow the `<template>` `<script>` `<style>` block to be empty |  |
 | [vue/no-invalid-model-keys](./no-invalid-model-keys.md) | require valid keys in model option |  |
 | [vue/no-multiple-objects-in-class](./no-multiple-objects-in-class.md) | disallow to pass multiple objects into array to class |  |
-| [vue/no-potential-component-option-typo](./no-potential-component-option-typo.md) | disallow a potential typo in your component property |  |
+| [vue/no-potential-component-option-typo](./no-potential-component-option-typo.md) | disallow a potential typo in your component property | :bulb: |
 | [vue/no-reserved-component-names](./no-reserved-component-names.md) | disallow the use of reserved names in component definitions |  |
 | [vue/no-restricted-block](./no-restricted-block.md) | disallow specific block |  |
 | [vue/no-restricted-call-after-await](./no-restricted-call-after-await.md) | disallow asynchronously called restricted methods |  |
 | [vue/no-restricted-class](./no-restricted-class.md) | disallow specific classes in Vue components |  |
 | [vue/no-restricted-component-options](./no-restricted-component-options.md) | disallow specific component option |  |
-| [vue/no-restricted-custom-event](./no-restricted-custom-event.md) | disallow specific custom event |  |
-| [vue/no-restricted-props](./no-restricted-props.md) | disallow specific props |  |
+| [vue/no-restricted-custom-event](./no-restricted-custom-event.md) | disallow specific custom event | :bulb: |
+| [vue/no-restricted-props](./no-restricted-props.md) | disallow specific props | :bulb: |
 | [vue/no-restricted-static-attribute](./no-restricted-static-attribute.md) | disallow specific attribute |  |
 | [vue/no-restricted-v-bind](./no-restricted-v-bind.md) | disallow specific argument in `v-bind` |  |
 | [vue/no-static-inline-styles](./no-static-inline-styles.md) | disallow static inline `style` attributes |  |
@@ -347,8 +349,8 @@ For example:
 | [vue/no-v-text](./no-v-text.md) | disallow use of v-text |  |
 | [vue/padding-line-between-blocks](./padding-line-between-blocks.md) | require or disallow padding lines between blocks | :wrench: |
 | [vue/require-direct-export](./require-direct-export.md) | require the component to be directly exported |  |
-| [vue/require-emit-validator](./require-emit-validator.md) | require type definitions in emits |  |
-| [vue/require-expose](./require-expose.md) | require declare public properties using `expose` |  |
+| [vue/require-emit-validator](./require-emit-validator.md) | require type definitions in emits | :bulb: |
+| [vue/require-expose](./require-expose.md) | require declare public properties using `expose` | :bulb: |
 | [vue/require-name-property](./require-name-property.md) | require a name property in Vue components |  |
 | [vue/script-indent](./script-indent.md) | enforce consistent indentation in `<script>` | :wrench: |
 | [vue/sort-keys](./sort-keys.md) | enforce sort-keys in a manner that is compatible with order-in-components |  |
diff --git a/docs/rules/no-potential-component-option-typo.md b/docs/rules/no-potential-component-option-typo.md
index 0a4696af8..bcd2d4ed3 100644
--- a/docs/rules/no-potential-component-option-typo.md
+++ b/docs/rules/no-potential-component-option-typo.md
@@ -9,6 +9,8 @@ since: v7.0.0
 
 > disallow a potential typo in your component property
 
+- :bulb: Some problems reported by this rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
+
 ## :book: Rule Details
 
 This rule disallow a potential typo in your component options
diff --git a/docs/rules/no-restricted-custom-event.md b/docs/rules/no-restricted-custom-event.md
index 231ad0607..f18edc3f3 100644
--- a/docs/rules/no-restricted-custom-event.md
+++ b/docs/rules/no-restricted-custom-event.md
@@ -9,6 +9,8 @@ since: v7.3.0
 
 > disallow specific custom event
 
+- :bulb: Some problems reported by this rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
+
 ## :book: Rule Details
 
 This rule allows you to specify custom event that you don't want to use in your application.
diff --git a/docs/rules/no-restricted-props.md b/docs/rules/no-restricted-props.md
index 42ddec12b..beecaaa8b 100644
--- a/docs/rules/no-restricted-props.md
+++ b/docs/rules/no-restricted-props.md
@@ -9,6 +9,8 @@ since: v7.3.0
 
 > disallow specific props
 
+- :bulb: Some problems reported by this rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
+
 ## :book: Rule Details
 
 This rule allows you to specify props that you don't want to use in your application.
diff --git a/docs/rules/no-unused-vars.md b/docs/rules/no-unused-vars.md
index a7486bad5..be0b1fcc1 100644
--- a/docs/rules/no-unused-vars.md
+++ b/docs/rules/no-unused-vars.md
@@ -10,6 +10,7 @@ since: v3.14.0
 > disallow unused variable definitions of v-for directives or scope attributes
 
 - :gear: This rule is included in all of `"plugin:vue/vue3-essential"`, `"plugin:vue/essential"`, `"plugin:vue/vue3-strongly-recommended"`, `"plugin:vue/strongly-recommended"`, `"plugin:vue/vue3-recommended"` and `"plugin:vue/recommended"`.
+- :bulb: Some problems reported by this rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
 
 ## :book: Rule Details
 
diff --git a/docs/rules/require-emit-validator.md b/docs/rules/require-emit-validator.md
index a5c4f1965..97a975185 100644
--- a/docs/rules/require-emit-validator.md
+++ b/docs/rules/require-emit-validator.md
@@ -9,6 +9,8 @@ since: v7.10.0
 
 > require type definitions in emits
 
+- :bulb: Some problems reported by this rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
+
 ## :book: Rule Details
 
 This rule enforces that a `emits` statement contains type definition.
diff --git a/docs/rules/require-explicit-emits.md b/docs/rules/require-explicit-emits.md
index b698b488f..6d681c551 100644
--- a/docs/rules/require-explicit-emits.md
+++ b/docs/rules/require-explicit-emits.md
@@ -10,6 +10,7 @@ since: v7.0.0
 > require `emits` option with name triggered by `$emit()`
 
 - :gear: This rule is included in `"plugin:vue/vue3-strongly-recommended"` and `"plugin:vue/vue3-recommended"`.
+- :bulb: Some problems reported by this rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
 
 ## :book: Rule Details
 
diff --git a/docs/rules/require-expose.md b/docs/rules/require-expose.md
index 01baf5d44..d6b27c7fc 100644
--- a/docs/rules/require-expose.md
+++ b/docs/rules/require-expose.md
@@ -9,6 +9,8 @@ since: v7.14.0
 
 > require declare public properties using `expose`
 
+- :bulb: Some problems reported by this rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
+
 ## :book: Rule Details
 
 This rule enforces the component to explicitly declare the exposed properties to the component using `expose`. You can use `expose` to control the internal properties of a component so that they cannot be referenced externally.
diff --git a/docs/rules/valid-next-tick.md b/docs/rules/valid-next-tick.md
index 919e59049..6c838553d 100644
--- a/docs/rules/valid-next-tick.md
+++ b/docs/rules/valid-next-tick.md
@@ -11,6 +11,7 @@ since: v7.5.0
 
 - :gear: This rule is included in all of `"plugin:vue/vue3-essential"`, `"plugin:vue/essential"`, `"plugin:vue/vue3-strongly-recommended"`, `"plugin:vue/strongly-recommended"`, `"plugin:vue/vue3-recommended"` and `"plugin:vue/recommended"`.
 - :wrench: The `--fix` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fixing-problems) can automatically fix some of the problems reported by this rule.
+- :bulb: Some problems reported by this rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
 
 ## :book: Rule Details
 
diff --git a/tools/update-docs-rules-index.js b/tools/update-docs-rules-index.js
index 6e9c0f03f..913db1b91 100644
--- a/tools/update-docs-rules-index.js
+++ b/tools/update-docs-rules-index.js
@@ -25,9 +25,11 @@ const uncategorizedExtensionRule = rules.filter(
 const deprecatedRules = rules.filter((rule) => rule.meta.deprecated)
 
 function toRuleRow(rule) {
-  const mark = `${rule.meta.fixable ? ':wrench:' : ''}${
+  const mark = [
+    rule.meta.fixable ? ':wrench:' : '',
+    rule.meta.hasSuggestions ? ':bulb:' : '',
     rule.meta.deprecated ? ':warning:' : ''
-  }`
+  ].join('')
   const link = `[${rule.ruleId}](./${rule.name}.md)`
   const description = rule.meta.docs.description || '(no description)'
 
@@ -133,6 +135,8 @@ sidebarDepth: 0
 
 ::: tip Legend
   :wrench: Indicates that the rule is fixable, and using \`--fix\` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fixing-problems) can automatically fix some of the reported problems.
+
+  :bulb: Indicates that some problems reported by the rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).
 :::
 
 ${rulesTableContent}`
diff --git a/tools/update-docs.js b/tools/update-docs.js
index 50e77ad2e..098585887 100644
--- a/tools/update-docs.js
+++ b/tools/update-docs.js
@@ -141,7 +141,12 @@ class DocFile {
     }
     if (meta.fixable) {
       notes.push(
-        `- :wrench: The \`--fix\` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fixing-problems) can automatically fix some of the problems reported by this rule.`
+        '- :wrench: The `--fix` option on the [command line](https://eslint.org/docs/user-guide/command-line-interface#fixing-problems) can automatically fix some of the problems reported by this rule.'
+      )
+    }
+    if (meta.hasSuggestions) {
+      notes.push(
+        '- :bulb: Some problems reported by this rule are manually fixable by editor [suggestions](https://eslint.org/docs/developer-guide/working-with-rules#providing-suggestions).'
       )
     }