vue/html-indent not working properly

[qmhc]

Tell us about your environment

• ESLint version: 7.7.0
• eslint-plugin-vue version: 6.2.2
• Node version: 14.4.0 on Windows

Please show your full configuration:

module.exports = {
  root: true,
  env: {
    node: true
  },
  extends: [
    'plugin:vue/essential',
    'plugin:vue/strongly-recommended',
    'plugin:vue/recommended',
    '@vue/standard',
    '@vue/typescript/recommended'
  ],
  parserOptions: {
    ecmaVersion: 2020
  },
  rules: {
    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
    'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
    'space-before-function-paren': [
      'error',
      {
        anonymous: 'always',
        named: 'never',
        asyncArrow: 'always'
      }
    ],
    '@typescript-eslint/no-explicit-any': 'off',
    '@typescript-eslint/strict-boolean-expressions': 'off',
    '@typescript-eslint/member-delimiter-style': [
      'error',
      {
        multiline: {
          delimiter: 'comma',
          requireLast: false
        },
        singleline: {
          requireLast: false
        }
      }
    ],
    '@typescript-eslint/no-inferrable-types': 'error',
    '@typescript-eslint/no-this-alias': [
      'error',
      {
        allowDestructuring: true
      }
    ],
    '@typescript-eslint/no-unnecessary-condition': 'off',
    'vue/eqeqeq': 'error',
    'vue/object-curly-spacing': ['error', 'always'],
    'vue/require-direct-export': 'error',
    'vue/no-parsing-error': [
      'error',
      {
        'x-invalid-end-tag': false
      }
    ],
    'vue/max-attributes-per-line': [
      'error',
      {
        singleline: 2,
        multiline: {
          max: 1,
          allowFirstLine: false
        }
      }
    ],
    'vue/match-component-file-name': [
      'error',
      {
        extensions: ['vue'],
        shouldMatchCase: false
      }
    ],
    'vue/space-infix-ops': [
      'error',
      {
        int32Hint: false
      }
    ],
    'vue/html-self-closing': [
      'error',
      {
        html: {
          void: 'always',
          normal: 'never',
          component: 'never'
        },
        svg: 'always',
        math: 'always'
      }
    ]
  }
}

What did you do?

<template>
  <div>
    <Input>
      <template #suffix>
        <Icon name="user"></Icon>
      </template>
    </Input>
  </div>
</template>

Input is a component named 'Input' has a slot named 'suffix'.

run

# base on @vue/cli 3.x+
yarn run lint

What did you expect to happen?

<template>
  <div>
    <Input>
      <template #suffix>
        <Icon name="user"></Icon>
      </template>
    </Input>
  </div>
</template>

What actually happened?

<template>
  <div>
    <Input>
    <template #suffix>
      <Icon name="user"></Icon>
    </template>
    </Input>
  </div>
</template>