From 6cc16bbd06fbdad9942967d77cc9748619d33dfb Mon Sep 17 00:00:00 2001
From: Sanxiaozhizi <sxzz@sxzz.moe>
Date: Tue, 31 Aug 2021 09:40:13 +0800
Subject: [PATCH] refactor: enhance type definition (#3062)

* chore: add vue-tsc for type check

* refactor(components): respect Vue's own style type

* refactor(components): improve props type

* chore(build): improve types

* fix(components): remove unnecessary props

* perf(components): use shallowRef

* fix(components): add missing property type for table

* refactor(components): improve time-picker types

* refactor(components): extract import type

* refactor(components): improve popper types

* refactor(components): upload list types

* fix(docs): fix type

* better type

* fix: remove index
---
 build/build-indices.ts                        |  26 +-
 package.json                                  |   1 +
 .../components/autocomplete/src/index.vue     |  10 +-
 packages/components/button/src/button.vue     |   8 +-
 packages/components/button/src/types.ts       |   2 +
 .../components/calendar/src/date-table.vue    |   2 +-
 packages/components/calendar/src/index.vue    |   3 +-
 packages/components/cascader/src/index.vue    |  10 +-
 .../checkbox/src/checkbox-button.vue          |   1 -
 packages/components/checkbox/src/checkbox.vue |   5 +-
 .../components/checkbox/src/useCheckbox.ts    |   2 +-
 packages/components/collapse/src/collapse.vue |   3 +-
 .../src/components/alpha-slider.vue           |   7 +-
 .../components/color-picker/src/index.vue     |   7 +-
 packages/components/dropdown/src/dropdown.vue |  15 +-
 .../components/image-viewer/src/index.vue     |   4 +-
 packages/components/loading/src/index.ts      |   6 +-
 packages/components/menu/src/menuItem.vue     |   4 +-
 packages/components/popconfirm/src/index.vue  |  16 +-
 .../components/popper/src/renderers/popper.ts |   4 +-
 .../popper/src/use-popper/defaults.ts         |   4 +-
 .../popper/src/use-popper/popper-options.ts   |   2 +-
 packages/components/progress/src/index.vue    |   7 +-
 packages/components/select-v2/src/defaults.ts |   5 +-
 packages/components/select-v2/src/select.vue  |   2 +-
 .../components/select-v2/src/useSelect.ts     |   3 +
 packages/components/select/src/select.vue     |  14 +-
 packages/components/slider/src/index.vue      |   4 +-
 packages/components/slider/src/slider.type.ts |  10 +-
 packages/components/slider/src/useSlide.ts    |  12 +-
 .../components/slider/src/useSliderButton.ts  |   4 +-
 packages/components/slider/src/useStops.ts    |   4 +-
 .../components/table/src/filter-panel.vue     |   7 +-
 .../table/src/table-column/defaults.ts        |   1 +
 .../time-picker/src/common/picker.vue         |  43 +-
 .../time-picker/src/common/props.ts           |   2 +-
 .../src/time-picker-com/panel-time-pick.vue   |   2 +-
 .../src/time-picker-com/panel-time-range.vue  |   2 +-
 .../time-select/src/time-select.vue           |   5 +-
 .../components/tree/src/model/useKeydown.ts   |   6 +-
 packages/components/tree/src/tree-node.vue    |   2 +-
 .../components/upload/src/upload-list.vue     |  16 +-
 .../hooks/use-popper/use-popper-options.ts    |   4 +-
 packages/utils/dom.ts                         |   7 +-
 tsconfig.json                                 |   8 +-
 typings/vue-test-utils.d.ts                   |   6 +-
 website/components/side-nav.vue               |   7 +-
 yarn.lock                                     | 525 +++++++++++++++++-
 48 files changed, 700 insertions(+), 150 deletions(-)
 create mode 100644 packages/components/button/src/types.ts

diff --git a/build/build-indices.ts b/build/build-indices.ts
index e592e8b0bb..49d8b4a6b4 100644
--- a/build/build-indices.ts
+++ b/build/build-indices.ts
@@ -6,6 +6,15 @@ import algoliasearch from 'algoliasearch'
 import { slugify } from 'transliteration'
 import fg from 'fast-glob'
 
+interface Index {
+  component: string
+  title: string
+  anchor: string
+  content: string
+  sort: number
+  path: string
+}
+
 const algoliaKey = process.env.ALGOLIA_KEY
 
 const client = algoliasearch('7DCTSU0WBW', algoliaKey)
@@ -21,7 +30,7 @@ const langs = {
   const index = client.initIndex(indexName)
   index.clearObjects().then(() => {
     const files = fg.sync(`website/docs/${lang}/*.md`)
-    let indices = []
+    const indices: Index[][] = []
     files.forEach(file => {
       const regExp = new RegExp(`website\/docs\/${lang}\/(.*).md`)
       const pathContent = file.match(regExp)
@@ -49,14 +58,17 @@ const langs = {
           return match
         })
       let i = 0
-      indices = indices.concat(
+      indices.push(
         matches.map(match => {
           const title = match[0].replace(/#{2,4}/, '').trim()
-          const index = { component, title }
-          index.anchor = slugify(title)
-          index.content = (match[1] || title).replace(/<[^>]+>/g, '')
-          index.path = path
-          index.sort = i++
+          const index: Index = {
+            component,
+            title,
+            anchor: slugify(title),
+            content: (match[1] || title).replace(/<[^>]+>/g, ''),
+            path: path,
+            sort: i++,
+          }
           return index
         }),
       )
diff --git a/package.json b/package.json
index 2ad18d925d..98014c54fa 100644
--- a/package.json
+++ b/package.json
@@ -119,6 +119,7 @@
     "vue-jest": "5.0.0-alpha.5",
     "vue-loader": "^16.1.2",
     "vue-router": "^4.0.2",
+    "vue-tsc": "^0.3.0",
     "webpack": "^4.44.1",
     "webpack-bundle-analyzer": "^3.9.0",
     "webpack-cli": "^3.3.12",
diff --git a/packages/components/autocomplete/src/index.vue b/packages/components/autocomplete/src/index.vue
index ed1fff3e41..4dab909ca0 100644
--- a/packages/components/autocomplete/src/index.vue
+++ b/packages/components/autocomplete/src/index.vue
@@ -7,7 +7,7 @@
     :append-to-body="popperAppendToBody"
     pure
     manual-mode
-    effect="light"
+    :effect="Effect.LIGHT"
     trigger="click"
     transition="el-zoom-in-top"
     :gpu-acceleration="false"
@@ -100,7 +100,7 @@ import { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'
 import throwError from '@element-plus/utils/error'
 import ElInput from '@element-plus/components/input'
 import ElScrollbar from '@element-plus/components/scrollbar'
-import ElPopper from '@element-plus/components/popper'
+import ElPopper, { Effect, Placement } from '@element-plus/components/popper'
 
 import type { PropType } from 'vue'
 
@@ -129,7 +129,7 @@ export default defineComponent({
       default: 300,
     },
     placement: {
-      type: String,
+      type: String as PropType<Placement>,
       validator: (val: string): boolean => {
         return ['top', 'top-start', 'top-end', 'bottom', 'bottom-start', 'bottom-end'].includes(val)
       },
@@ -313,7 +313,11 @@ export default defineComponent({
       inputRef.value.inputOrTextarea.setAttribute('aria-activedescendant', `${id.value}-item-${highlightedIndex.value}`)
     }
 
+
+
     return {
+      Effect,
+
       attrs,
       suggestions,
       highlightedIndex,
diff --git a/packages/components/button/src/button.vue b/packages/components/button/src/button.vue
index 32787ffe35..23e9456eaf 100644
--- a/packages/components/button/src/button.vue
+++ b/packages/components/button/src/button.vue
@@ -33,16 +33,14 @@ import { elButtonGroupKey } from '@element-plus/tokens'
 import type { PropType } from 'vue'
 import type { ComponentSize } from '@element-plus/utils/types'
 import type { ElFormContext, ElFormItemContext } from '@element-plus/tokens'
-
-type IButtonType = PropType<'primary' | 'success' | 'warning' | 'danger' | 'info' | 'text' | 'default'>
-type IButtonNativeType = PropType<'button' | 'submit' | 'reset'>
+import type { ButtonNativeType, ButtonType } from './types'
 
 export default defineComponent({
   name: 'ElButton',
 
   props: {
     type: {
-      type: String as IButtonType,
+      type: String as PropType<ButtonType>,
       default: 'default',
       validator: (val: string) => {
         return [
@@ -65,7 +63,7 @@ export default defineComponent({
       default: '',
     },
     nativeType: {
-      type: String as IButtonNativeType,
+      type: String as PropType<ButtonNativeType>,
       default: 'button',
       validator: (val: string) => {
         return ['button', 'submit', 'reset'].includes(val)
diff --git a/packages/components/button/src/types.ts b/packages/components/button/src/types.ts
new file mode 100644
index 0000000000..2240660281
--- /dev/null
+++ b/packages/components/button/src/types.ts
@@ -0,0 +1,2 @@
+export type ButtonType = 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'text' | 'default'
+export type ButtonNativeType = 'button' | 'submit' | 'reset'
diff --git a/packages/components/calendar/src/date-table.vue b/packages/components/calendar/src/date-table.vue
index 698bc73116..7b1f90db7a 100644
--- a/packages/components/calendar/src/date-table.vue
+++ b/packages/components/calendar/src/date-table.vue
@@ -44,8 +44,8 @@ import {
   computed,
   defineComponent,
   ref,
-  PropType,
 } from 'vue'
+import { PropType } from 'vue'
 import dayjs, { Dayjs } from 'dayjs'
 import localeData from 'dayjs/plugin/localeData'
 import { useLocaleInject } from '@element-plus/hooks'
diff --git a/packages/components/calendar/src/index.vue b/packages/components/calendar/src/index.vue
index 22958690f8..85da3b7970 100644
--- a/packages/components/calendar/src/index.vue
+++ b/packages/components/calendar/src/index.vue
@@ -56,11 +56,10 @@
 <script lang="ts">
 import {
   ref,
-  ComputedRef,
-  PropType,
   computed,
   defineComponent,
 } from 'vue'
+import type { PropType, ComputedRef } from 'vue'
 import dayjs from 'dayjs'
 
 import ElButton from '@element-plus/components/button'
diff --git a/packages/components/cascader/src/index.vue b/packages/components/cascader/src/index.vue
index 2b01a112ba..789966bbea 100644
--- a/packages/components/cascader/src/index.vue
+++ b/packages/components/cascader/src/index.vue
@@ -11,7 +11,7 @@
     :stop-popper-mouse-event="false"
     transition="el-zoom-in-top"
     :gpu-acceleration="false"
-    effect="light"
+    :effect="Effect.LIGHT"
     pure
     @after-leave="hideSuggestionPanel"
   >
@@ -157,6 +157,7 @@ import isServer from '@element-plus/utils/isServer'
 import { useGlobalConfig } from '@element-plus/utils/util'
 import { addResizeListener, removeResizeListener } from '@element-plus/utils/resize-event'
 import { isValidComponentSize } from '@element-plus/utils/validators'
+import { Effect, Options } from '@element-plus/components/popper'
 
 import type { ComputedRef, PropType } from 'vue'
 import type { ElFormContext, ElFormItemContext } from '@element-plus/tokens'
@@ -171,7 +172,7 @@ const INPUT_HEIGHT_MAP = {
   mini: 28,
 }
 
-const popperOptions = {
+const popperOptions: Partial<Options> = {
   modifiers: [
     {
       name: 'arrowPosition',
@@ -279,7 +280,7 @@ export default defineComponent({
 
     const isDisabled = computed(() => props.disabled || elForm.disabled)
     const inputPlaceholder = computed(() => props.placeholder || t('el.cascader.placeholder'))
-    const realSize: ComputedRef<string> = computed(() => props.size || elFormItem.size || $ELEMENT.size)
+    const realSize: ComputedRef<ComponentSize> = computed(() => props.size || elFormItem.size || $ELEMENT.size)
     const tagSize = computed(() => ['small', 'mini'].includes(realSize.value) ? 'mini' : 'small')
     const multiple = computed(() => !!props.props.multiple)
     const readonly = computed(() => !props.filterable || multiple.value)
@@ -303,7 +304,7 @@ export default defineComponent({
         : ''
     })
 
-    const checkedValue = computed({
+    const checkedValue = computed<CascaderValue>({
       get () {
         return props.modelValue
       },
@@ -553,6 +554,7 @@ export default defineComponent({
     })
 
     return {
+      Effect,
       popperOptions,
       popper,
       popperPaneRef,
diff --git a/packages/components/checkbox/src/checkbox-button.vue b/packages/components/checkbox/src/checkbox-button.vue
index ee488c1636..4d760bcb7b 100644
--- a/packages/components/checkbox/src/checkbox-button.vue
+++ b/packages/components/checkbox/src/checkbox-button.vue
@@ -14,7 +14,6 @@
     <input
       v-if="trueLabel || falseLabel"
       v-model="model"
-      :checked="isChecked"
       class="el-checkbox-button__original"
       type="checkbox"
       :name="name"
diff --git a/packages/components/checkbox/src/checkbox.vue b/packages/components/checkbox/src/checkbox.vue
index 737b7e0081..fc5ff44eab 100644
--- a/packages/components/checkbox/src/checkbox.vue
+++ b/packages/components/checkbox/src/checkbox.vue
@@ -18,15 +18,14 @@
         'is-indeterminate': indeterminate,
         'is-focus': focus
       }"
-      :tabindex="indeterminate ? 0 : false"
-      :role="indeterminate ? 'checkbox' : false"
+      :tabindex="indeterminate ? 0 : undefined"
+      :role="indeterminate ? 'checkbox' : undefined"
       :aria-checked="indeterminate ? 'mixed' : false"
     >
       <span class="el-checkbox__inner"></span>
       <input
         v-if="trueLabel || falseLabel"
         v-model="model"
-        :checked="isChecked"
         class="el-checkbox__original"
         type="checkbox"
         :aria-hidden="indeterminate ? 'true' : 'false'"
diff --git a/packages/components/checkbox/src/useCheckbox.ts b/packages/components/checkbox/src/useCheckbox.ts
index f316c5f669..16e0c18950 100644
--- a/packages/components/checkbox/src/useCheckbox.ts
+++ b/packages/components/checkbox/src/useCheckbox.ts
@@ -104,7 +104,7 @@ const useCheckboxStatus = (props: IUseCheckboxProps, { model }: PartialReturnTyp
   const { isGroup, checkboxGroup, elFormItemSize, ELEMENT } = useCheckboxGroup()
   const focus = ref(false)
   const size = computed<string | undefined>(() => checkboxGroup?.checkboxGroupSize?.value || elFormItemSize.value || ELEMENT.size)
-  const isChecked = computed(() => {
+  const isChecked = computed<boolean>(() => {
     const value = model.value
     if (toTypeString(value) === '[object Boolean]') {
       return value
diff --git a/packages/components/collapse/src/collapse.vue b/packages/components/collapse/src/collapse.vue
index 07deb86db1..5f0a5f49b7 100644
--- a/packages/components/collapse/src/collapse.vue
+++ b/packages/components/collapse/src/collapse.vue
@@ -10,10 +10,9 @@ import {
   ref,
   watch,
   provide,
-  PropType,
-  Ref,
   onUnmounted,
 } from 'vue'
+import type { PropType, Ref } from 'vue'
 import mitt, { Emitter } from 'mitt'
 import { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'
 
diff --git a/packages/components/color-picker/src/components/alpha-slider.vue b/packages/components/color-picker/src/components/alpha-slider.vue
index b7a5c5780f..ec71dbcfb1 100644
--- a/packages/components/color-picker/src/components/alpha-slider.vue
+++ b/packages/components/color-picker/src/components/alpha-slider.vue
@@ -22,9 +22,10 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, watch, ref, onMounted, getCurrentInstance, PropType } from 'vue'
+import { defineComponent, watch, ref, onMounted, getCurrentInstance, shallowRef } from 'vue'
 import draggable from '../draggable'
 
+import type { PropType } from 'vue'
 import type { Nullable } from '@element-plus/utils/types'
 import type Color from '../color'
 
@@ -44,8 +45,8 @@ export default defineComponent({
   setup(props) {
     const instance = getCurrentInstance()
     // ref
-    const thumb = ref<Nullable<HTMLElement>>(null)
-    const bar = ref<Nullable<HTMLElement>>(null)
+    const thumb = shallowRef<Nullable<HTMLElement>>(null)
+    const bar = shallowRef<Nullable<HTMLElement>>(null)
 
     // data
     const thumbLeft = ref(0)
diff --git a/packages/components/color-picker/src/index.vue b/packages/components/color-picker/src/index.vue
index 07393216ef..baed02a74b 100644
--- a/packages/components/color-picker/src/index.vue
+++ b/packages/components/color-picker/src/index.vue
@@ -2,7 +2,7 @@
   <el-popper
     ref="popper"
     v-model:visible="showPicker"
-    effect="light"
+    :effect="Effect.LIGHT"
     manual-mode
     trigger="click"
     :show-arrow="false"
@@ -93,7 +93,7 @@ import ElButton from '@element-plus/components/button'
 import { ClickOutside } from '@element-plus/directives'
 import { elFormItemKey, elFormKey } from '@element-plus/tokens'
 import { useLocaleInject } from '@element-plus/hooks'
-import ElPopper from '@element-plus/components/popper'
+import ElPopper, { Effect } from '@element-plus/components/popper'
 import ElInput from '@element-plus/components/input'
 import { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'
 import { useGlobalConfig } from '@element-plus/utils/util'
@@ -282,7 +282,8 @@ export default defineComponent({
     })
 
     return {
-      color,
+      Effect,
+      color: color as Color,
       colorDisabled,
       colorSize,
       displayedColor,
diff --git a/packages/components/dropdown/src/dropdown.vue b/packages/components/dropdown/src/dropdown.vue
index 32c1123702..55b2a97df9 100644
--- a/packages/components/dropdown/src/dropdown.vue
+++ b/packages/components/dropdown/src/dropdown.vue
@@ -59,14 +59,17 @@ import {
   watch,
   onMounted,
 } from 'vue'
+import type { PropType } from 'vue'
 import ElButton from '@element-plus/components/button'
-import ElPopper from '@element-plus/components/popper'
+import ElPopper, { Effect, Placement } from '@element-plus/components/popper'
 import ElScrollbar from '@element-plus/components/scrollbar'
 import { on, addClass, removeClass } from '@element-plus/utils/dom'
 import { addUnit } from '@element-plus/utils/util'
 import { useDropdown } from './useDropdown'
 
 import type { ComponentPublicInstance } from 'vue'
+import type { TriggerType } from '@element-plus/hooks/use-popper/use-target-events'
+import type { ButtonType } from '@element-plus/components/button/src/types'
 
 type Nullable<T> = null | T
 const { ButtonGroup: ElButtonGroup } = ElButton
@@ -81,10 +84,10 @@ export default defineComponent({
   },
   props: {
     trigger: {
-      type: String,
+      type: String as PropType<TriggerType>,
       default: 'hover',
     },
-    type: String,
+    type: String as PropType<ButtonType>,
     size: {
       type: String,
       default: '',
@@ -95,7 +98,7 @@ export default defineComponent({
       default: true,
     },
     placement: {
-      type: String,
+      type: String as PropType<Placement>,
       default: 'bottom',
     },
     showTimeout: {
@@ -111,8 +114,8 @@ export default defineComponent({
       default: 0,
     },
     effect: {
-      type: String,
-      default: 'light',
+      type: String as PropType<Effect>,
+      default: Effect.LIGHT,
     },
     maxHeight: {
       type: [Number, String],
diff --git a/packages/components/image-viewer/src/index.vue b/packages/components/image-viewer/src/index.vue
index 0dd7cbe6f2..69324abe7b 100644
--- a/packages/components/image-viewer/src/index.vue
+++ b/packages/components/image-viewer/src/index.vue
@@ -71,7 +71,7 @@ import { EVENT_CODE } from '@element-plus/utils/aria'
 import { on, off } from '@element-plus/utils/dom'
 import { rafThrottle, isFirefox } from '@element-plus/utils/util'
 
-import type { PropType } from 'vue'
+import type { PropType, CSSProperties } from 'vue'
 
 const Mode = {
   CONTAIN: {
@@ -160,7 +160,7 @@ export default defineComponent({
         transition: enableTransition ? 'transform .3s' : '',
         marginLeft: `${offsetX}px`,
         marginTop: `${offsetY}px`,
-      } as CSSStyleDeclaration
+      } as CSSProperties
       if (mode.value.name === Mode.CONTAIN.name) {
         style.maxWidth = style.maxHeight = '100%'
       }
diff --git a/packages/components/loading/src/index.ts b/packages/components/loading/src/index.ts
index 8a59c86c34..d4f6e03363 100644
--- a/packages/components/loading/src/index.ts
+++ b/packages/components/loading/src/index.ts
@@ -5,6 +5,8 @@ import PopupManager from '@element-plus/utils/popup-manager'
 import isServer from '@element-plus/utils/isServer'
 import { createLoadingComponent } from './createLoadingComponent'
 
+import type { CSSProperties } from 'vue'
+
 import type {
   ILoadingGlobalConfig,
   ILoadingInstance,
@@ -29,11 +31,11 @@ const globalLoadingOption: ILoadingGlobalConfig = {
 }
 
 const addStyle = async (options: ILoadingOptions, parent: HTMLElement, instance: ILoadingInstance) => {
-  const maskStyle: Partial<CSSStyleDeclaration> = {}
+  const maskStyle: Partial<CSSProperties> = {}
   if (options.fullscreen) {
     instance.originalPosition.value = getStyle(document.body, 'position')
     instance.originalOverflow.value = getStyle(document.body, 'overflow')
-    maskStyle.zIndex = String(PopupManager.nextZIndex())
+    maskStyle.zIndex = PopupManager.nextZIndex()
   } else if (options.body) {
     instance.originalPosition.value = getStyle(document.body, 'position')
     /**
diff --git a/packages/components/menu/src/menuItem.vue b/packages/components/menu/src/menuItem.vue
index 10999edcd4..f2c3c51dce 100644
--- a/packages/components/menu/src/menuItem.vue
+++ b/packages/components/menu/src/menuItem.vue
@@ -20,7 +20,7 @@
           rootMenu.props.collapse &&
           slots.title
       "
-      effect="dark"
+      :effect="Effect.DARK"
       placement="right"
     >
       <template #content>
@@ -48,6 +48,7 @@ import {
   getCurrentInstance,
 } from 'vue'
 import ElTooltip from '@element-plus/components/tooltip'
+import { Effect } from '@element-plus/components/popper'
 import { RootMenuProvider, SubMenuProvider } from './menu'
 import useMenu from './useMenu'
 
@@ -148,6 +149,7 @@ export default defineComponent({
     })
 
     return {
+      Effect,
       parentMenu,
       rootMenu,
       slots,
diff --git a/packages/components/popconfirm/src/index.vue b/packages/components/popconfirm/src/index.vue
index 97ad99d2b2..8be2cf1f78 100644
--- a/packages/components/popconfirm/src/index.vue
+++ b/packages/components/popconfirm/src/index.vue
@@ -2,7 +2,7 @@
   <el-popper
     v-model:visible="visible"
     trigger="click"
-    effect="light"
+    :effect="Effect.LIGHT"
     popper-class="el-popover"
     append-to-body
     :fallback-placements="['bottom' ,'top', 'right', 'left']"
@@ -43,9 +43,12 @@
 <script lang="ts">
 import { defineComponent, ref, computed } from 'vue'
 import ElButton from '@element-plus/components/button'
-import ElPopper from '@element-plus/components/popper'
+import ElPopper, { Effect } from '@element-plus/components/popper'
 import { useLocaleInject } from '@element-plus/hooks'
 
+import type { PropType } from 'vue'
+import type { ButtonType } from '@element-plus/components/button/src/types'
+
 export default defineComponent({
   name: 'ElPopconfirm',
 
@@ -65,12 +68,12 @@ export default defineComponent({
       type: String,
     },
     confirmButtonType: {
-      type: String,
-      default: 'primary',
+      type: String as PropType<ButtonType>,
+      default: 'primary' as ButtonType,
     },
     cancelButtonType: {
-      type: String,
-      default: 'text',
+      type: String as PropType<ButtonType>,
+      default: 'text' as ButtonType,
     },
     icon: {
       type: String,
@@ -104,6 +107,7 @@ export default defineComponent({
       return props.cancelButtonText || t('el.popconfirm.cancelButtonText')
     })
     return {
+      Effect,
       visible,
       confirm,
       cancel,
diff --git a/packages/components/popper/src/renderers/popper.ts b/packages/components/popper/src/renderers/popper.ts
index 7a5b005abe..af90b0fd73 100644
--- a/packages/components/popper/src/renderers/popper.ts
+++ b/packages/components/popper/src/renderers/popper.ts
@@ -2,7 +2,7 @@ import { withDirectives, Transition, vShow, withCtx, h } from 'vue'
 import { NOOP } from '@vue/shared'
 import { stop } from '@element-plus/utils/dom'
 
-import type { VNode, Ref } from 'vue'
+import type { VNode, Ref, CSSProperties } from 'vue'
 import type { Effect } from '../use-popper/defaults'
 
 interface IRenderPopperProps {
@@ -10,7 +10,7 @@ interface IRenderPopperProps {
   name: string
   stopPopperMouseEvent: boolean
   popperClass: string
-  popperStyle?: Partial<CSSStyleDeclaration>
+  popperStyle?: Partial<CSSProperties>
   popperId: string
   popperRef?: Ref<HTMLElement>
   pure?: boolean
diff --git a/packages/components/popper/src/use-popper/defaults.ts b/packages/components/popper/src/use-popper/defaults.ts
index 0a3c0ce13d..f9c211df6b 100644
--- a/packages/components/popper/src/use-popper/defaults.ts
+++ b/packages/components/popper/src/use-popper/defaults.ts
@@ -29,7 +29,7 @@ export type IPopperOptions = {
   manualMode: boolean
   offset: number
   placement: Placement
-  popperOptions: Options
+  popperOptions: Partial<Options>
   showAfter: number
   showArrow: boolean
   strategy: PositioningStrategy
@@ -118,7 +118,7 @@ export default {
   },
   // Once this option were given, the entire popper is under the users' control, top priority
   popperOptions: {
-    type: Object as PropType<Options>,
+    type: Object as PropType<Partial<Options>>,
     default: () => null,
   },
   showArrow: {
diff --git a/packages/components/popper/src/use-popper/popper-options.ts b/packages/components/popper/src/use-popper/popper-options.ts
index 2c17f2696f..568913c8b3 100644
--- a/packages/components/popper/src/use-popper/popper-options.ts
+++ b/packages/components/popper/src/use-popper/popper-options.ts
@@ -5,7 +5,7 @@ import type { Ref } from 'vue'
 import type { Options, Placement } from '@popperjs/core'
 
 interface IUsePopperProps {
-  popperOptions: Options
+  popperOptions: Partial<Options>
   arrowOffset: number
   offset: number
   placement: Placement
diff --git a/packages/components/progress/src/index.vue b/packages/components/progress/src/index.vue
index a71f437a84..f5abce7898 100644
--- a/packages/components/progress/src/index.vue
+++ b/packages/components/progress/src/index.vue
@@ -67,6 +67,7 @@
 
 <script lang="ts">
 import { computed, defineComponent } from 'vue'
+import type { PropType, SVGAttributes } from 'vue'
 
 type ProgressFuncType = (percentage: number) => string;
 
@@ -77,7 +78,7 @@ interface IProgressProps {
   indeterminate: boolean
   duration: number
   strokeWidth: number
-  strokeLinecap: string
+  strokeLinecap: NonNullable<SVGAttributes['stroke-linecap']>
   textInside: boolean
   width: number
   showText: boolean
@@ -117,8 +118,8 @@ export default defineComponent({
       default: 6,
     },
     strokeLinecap: {
-      type: String,
-      default: 'round',
+      type: String as PropType<IProgressProps['strokeLinecap']>,
+      default: 'round' as IProgressProps['strokeLinecap'],
     },
     textInside: {
       type: Boolean,
diff --git a/packages/components/select-v2/src/defaults.ts b/packages/components/select-v2/src/defaults.ts
index d293134738..73a2775d55 100644
--- a/packages/components/select-v2/src/defaults.ts
+++ b/packages/components/select-v2/src/defaults.ts
@@ -3,6 +3,7 @@ import { isValidComponentSize } from '@element-plus/utils/validators'
 import type { PropType } from 'vue'
 import type { ComponentSize } from '@element-plus/utils/types'
 import type { OptionType } from './select.types'
+import type { Options } from '@element-plus/components/popper'
 
 export const SelectProps = {
   allowCreate: Boolean,
@@ -64,8 +65,8 @@ export const SelectProps = {
     default: '',
   },
   popperOptions: {
-    type: Object,
-    default: () => ({}),
+    type: Object as PropType<Partial<Options>>,
+    default: () => ({} as Partial<Options>),
   },
   remote: Boolean,
   size: {
diff --git a/packages/components/select-v2/src/select.vue b/packages/components/select-v2/src/select.vue
index f9a98a5b96..c8e8288b1f 100644
--- a/packages/components/select-v2/src/select.vue
+++ b/packages/components/select-v2/src/select.vue
@@ -17,7 +17,7 @@
       :stop-popper-mouse-event="false"
       :popper-options="popperOptions"
       :fallback-placements="['bottom-start', 'top-start', 'right', 'left']"
-      effect="light"
+      :effect="Effect.LIGHT"
       manual-mode
       placement="bottom-start"
       pure
diff --git a/packages/components/select-v2/src/useSelect.ts b/packages/components/select-v2/src/useSelect.ts
index 82ef3350dc..d9f524349d 100644
--- a/packages/components/select-v2/src/useSelect.ts
+++ b/packages/components/select-v2/src/useSelect.ts
@@ -23,6 +23,7 @@ import {
   getValueByPath,
   useGlobalConfig,
 } from '@element-plus/utils/util'
+import { Effect } from '@element-plus/components/popper'
 
 import { useAllowCreate } from './useAllowCreate'
 
@@ -661,6 +662,8 @@ const useSelect = (props: ExtractPropTypes<typeof SelectProps>, emit) => {
 
     popperRef,
 
+    Effect,
+
     // methods exports
     debouncedOnInputChange,
     deleteTag,
diff --git a/packages/components/select/src/select.vue b/packages/components/select/src/select.vue
index de14896cb1..212ef99698 100644
--- a/packages/components/select/src/select.vue
+++ b/packages/components/select/src/select.vue
@@ -14,7 +14,7 @@
       :popper-class="`el-select__popper ${popperClass}`"
       :fallback-placements="['bottom-start', 'top-start', 'right', 'left']"
       manual-mode
-      effect="light"
+      :effect="Effect.LIGHT"
       pure
       trigger="click"
       transition="el-zoom-in-top"
@@ -28,7 +28,7 @@
             v-if="multiple"
             ref="tags"
             class="el-select__tags"
-            :style="{ 'max-width': inputWidth - 32 + 'px', width: '100%' }"
+            :style="{ maxWidth: inputWidth - 32 + 'px', width: '100%' }"
           >
             <span v-if="collapseTags && selected.length">
               <el-tag
@@ -39,7 +39,7 @@
                 disable-transitions
                 @close="deleteTag($event, selected[0])"
               >
-                <span class="el-select__tags-text" :style="{ 'max-width': inputWidth - 123 + 'px' }">{{ selected[0].currentLabel }}</span>
+                <span class="el-select__tags-text" :style="{ maxWidth: inputWidth - 123 + 'px' }">{{ selected[0].currentLabel }}</span>
               </el-tag>
               <el-tag
                 v-if="selected.length > 1"
@@ -64,7 +64,7 @@
                   disable-transitions
                   @close="deleteTag($event, item)"
                 >
-                  <span class="el-select__tags-text" :style="{ 'max-width': inputWidth - 75 + 'px' }">{{ item.currentLabel }}</span>
+                  <span class="el-select__tags-text" :style="{ maxWidth: inputWidth - 75 + 'px' }">{{ item.currentLabel }}</span>
                 </el-tag>
               </span>
             </transition>
@@ -180,7 +180,7 @@ import {
 import { ClickOutside } from '@element-plus/directives'
 import { useFocus, useLocaleInject } from '@element-plus/hooks'
 import ElInput from '@element-plus/components/input'
-import ElPopper from '@element-plus/components/popper'
+import ElPopper, { Effect } from '@element-plus/components/popper'
 import ElScrollbar from '@element-plus/components/scrollbar'
 import ElTag from '@element-plus/components/tag'
 import { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/utils/constants'
@@ -193,6 +193,7 @@ import { selectKey } from './token'
 
 import type { PropType } from 'vue'
 import type { ComponentSize } from '@element-plus/utils/types'
+import type { SelectContext } from './token'
 
 export default defineComponent({
   name: 'ElSelect',
@@ -348,7 +349,7 @@ export default defineComponent({
       selectWrapper,
       selected,
       setSelected,
-    }))
+    }) as unknown as SelectContext)
 
     onMounted(() => {
       states.cachedPlaceHolder = currentPlaceholder.value = (props.placeholder || t('el.select.placeholder'))
@@ -403,6 +404,7 @@ export default defineComponent({
     })
 
     return {
+      Effect,
       tagInMultiLine,
       prefixWidth,
       selectSize,
diff --git a/packages/components/slider/src/index.vue b/packages/components/slider/src/index.vue
index 4c12d6607f..ca9b95b420 100644
--- a/packages/components/slider/src/index.vue
+++ b/packages/components/slider/src/index.vue
@@ -104,7 +104,7 @@ import { useSlide } from './useSlide'
 import { useStops } from './useStops'
 
 import type { PropType } from 'vue'
-import type { Nullable } from '@element-plus/utils/types'
+import type { ComponentSize, Nullable } from '@element-plus/utils/types'
 
 export default defineComponent({
   name: 'ElSlider',
@@ -141,7 +141,7 @@ export default defineComponent({
       default: true,
     },
     inputSize: {
-      type: String,
+      type: String as PropType<ComponentSize>,
       default: 'small',
     },
     showStops: {
diff --git a/packages/components/slider/src/slider.type.ts b/packages/components/slider/src/slider.type.ts
index 7d76fdb3c0..eceec8f09d 100644
--- a/packages/components/slider/src/slider.type.ts
+++ b/packages/components/slider/src/slider.type.ts
@@ -1,4 +1,4 @@
-import { ComputedRef, Ref } from 'vue'
+import type { ComputedRef, CSSProperties, Ref } from 'vue'
 import type { Nullable } from '@element-plus/utils/types'
 
 export interface ISliderProps {
@@ -54,7 +54,7 @@ export type Marks = ComputedRef<Mark[]>
 
 export type Stops = {
   stops: ComputedRef<number[]>
-  getStopStyle: (position: number) => CSSStyleDeclaration
+  getStopStyle: (position: number) => CSSProperties
 }
 
 export type Slide = {
@@ -64,8 +64,8 @@ export type Slide = {
   sliderDisabled: ComputedRef<boolean>
   minValue: ComputedRef<number>
   maxValue: ComputedRef<number>
-  runwayStyle: ComputedRef<CSSStyleDeclaration>
-  barStyle: ComputedRef<CSSStyleDeclaration>
+  runwayStyle: ComputedRef<CSSProperties>
+  barStyle: ComputedRef<CSSProperties>
   resetSize: () => void
   setPosition: (percent: number) => void
   emitChange: () => void
@@ -98,7 +98,7 @@ export interface ISliderButtonInitData {
 export interface ISliderButton {
   tooltip: Ref<Nullable<HTMLElement>>
   showTooltip: Ref<boolean>
-  wrapperStyle: ComputedRef<CSSStyleDeclaration>
+  wrapperStyle: ComputedRef<CSSProperties>
   formatValue: ComputedRef<number | string>
   handleMouseEnter: () => void
   handleMouseLeave: () => void
diff --git a/packages/components/slider/src/useSlide.ts b/packages/components/slider/src/useSlide.ts
index 76af99e633..6c7eb9499a 100644
--- a/packages/components/slider/src/useSlide.ts
+++ b/packages/components/slider/src/useSlide.ts
@@ -1,4 +1,4 @@
-import { computed, inject, nextTick, ref } from 'vue'
+import { computed, CSSProperties, inject, nextTick, ref, shallowRef } from 'vue'
 import { CHANGE_EVENT } from '@element-plus/utils/constants'
 import { elFormKey, elFormItemKey } from '@element-plus/tokens'
 import type { ButtonRefs, ISliderInitData, ISliderProps } from './slider.type'
@@ -10,7 +10,7 @@ export const useSlide = (props: ISliderProps, initData: ISliderInitData, emit) =
   const elForm = inject(elFormKey, {} as ElFormContext)
   const elFormItem = inject(elFormItemKey, {} as ElFormItemContext)
 
-  const slider = ref<Nullable<HTMLElement>>(null)
+  const slider = shallowRef<Nullable<HTMLElement>>(null)
 
   const firstButton = ref(null)
 
@@ -45,11 +45,11 @@ export const useSlide = (props: ISliderProps, initData: ISliderInitData, emit) =
       : '0%'
   })
 
-  const runwayStyle = computed(() => {
-    return (props.vertical ? { height: props.height } : {}) as CSSStyleDeclaration
+  const runwayStyle = computed<CSSProperties>(() => {
+    return (props.vertical ? { height: props.height } : {})
   })
 
-  const barStyle = computed(() => {
+  const barStyle = computed<CSSProperties>(() => {
     return (props.vertical
       ? {
         height: barSize.value,
@@ -57,7 +57,7 @@ export const useSlide = (props: ISliderProps, initData: ISliderInitData, emit) =
       } : {
         width: barSize.value,
         left: barStart.value,
-      }) as CSSStyleDeclaration
+      })
   })
 
   const resetSize = () => {
diff --git a/packages/components/slider/src/useSliderButton.ts b/packages/components/slider/src/useSliderButton.ts
index fa1541a0a4..418db4c28a 100644
--- a/packages/components/slider/src/useSliderButton.ts
+++ b/packages/components/slider/src/useSliderButton.ts
@@ -1,4 +1,4 @@
-import { computed, inject, nextTick, ref, watch } from 'vue'
+import { computed, CSSProperties, inject, nextTick, ref, watch } from 'vue'
 import debounce from 'lodash/debounce'
 import { UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'
 import { off, on } from '@element-plus/utils/dom'
@@ -65,7 +65,7 @@ export const useSliderButton = (props: ISliderButtonProps, initData: ISliderButt
   })
 
   const wrapperStyle = computed(() => {
-    return (props.vertical ? { bottom: currentPosition.value } : { left: currentPosition.value }) as CSSStyleDeclaration
+    return (props.vertical ? { bottom: currentPosition.value } : { left: currentPosition.value }) as CSSProperties
   })
 
   const handleMouseEnter = () => {
diff --git a/packages/components/slider/src/useStops.ts b/packages/components/slider/src/useStops.ts
index 95f5b329a0..b98eb9edb3 100644
--- a/packages/components/slider/src/useStops.ts
+++ b/packages/components/slider/src/useStops.ts
@@ -1,4 +1,4 @@
-import { computed } from 'vue'
+import { computed, CSSProperties } from 'vue'
 
 import { ComputedRef } from 'vue'
 import type { ISliderInitData, ISliderProps, Stops } from './slider.type'
@@ -26,7 +26,7 @@ export const useStops = (props: ISliderProps, initData: ISliderInitData, minValu
   })
 
   const getStopStyle = (position: number) => {
-    return (props.vertical ? { 'bottom': position + '%' } : { 'left': position + '%' }) as CSSStyleDeclaration
+    return (props.vertical ? { 'bottom': position + '%' } : { 'left': position + '%' }) as CSSProperties
   }
 
   return {
diff --git a/packages/components/table/src/filter-panel.vue b/packages/components/table/src/filter-panel.vue
index 2ac6da24da..7d9218036f 100644
--- a/packages/components/table/src/filter-panel.vue
+++ b/packages/components/table/src/filter-panel.vue
@@ -6,7 +6,7 @@
     :placement="placement"
     :show-arrow="false"
     :stop-popper-mouse-event="false"
-    effect="light"
+    :effect="Effect.LIGHT"
     pure
     manual-mode
     popper-class="el-table-filter"
@@ -89,7 +89,7 @@ import {
 import ElCheckbox from '@element-plus/components/checkbox'
 import { ClickOutside } from '@element-plus/directives'
 import { useLocaleInject } from '@element-plus/hooks'
-import ElPopper from '@element-plus/components/popper'
+import ElPopper, { Effect, Placement } from '@element-plus/components/popper'
 import ElScrollbar from '@element-plus/components/scrollbar'
 
 import type {
@@ -113,7 +113,7 @@ export default defineComponent({
   directives: { ClickOutside },
   props: {
     placement: {
-      type: String,
+      type: String as PropType<Placement>,
       default: 'bottom-start',
     },
     store: {
@@ -239,6 +239,7 @@ export default defineComponent({
       hideFilterPanel,
       popperPaneRef,
       tooltip,
+      Effect,
     }
   },
 })
diff --git a/packages/components/table/src/table-column/defaults.ts b/packages/components/table/src/table-column/defaults.ts
index e3c5eb84a6..c139e96642 100644
--- a/packages/components/table/src/table-column/defaults.ts
+++ b/packages/components/table/src/table-column/defaults.ts
@@ -63,6 +63,7 @@ interface TableColumnCtx<T> {
   columns: TableColumnCtx<T>[]
   getColumnIndex: () => number
   no: number
+  filterOpened?: boolean
 }
 
 interface TableColumn<T> extends ComponentInternalInstance {
diff --git a/packages/components/time-picker/src/common/picker.vue b/packages/components/time-picker/src/common/picker.vue
index ea936a4172..6d16f742a7 100644
--- a/packages/components/time-picker/src/common/picker.vue
+++ b/packages/components/time-picker/src/common/picker.vue
@@ -3,7 +3,7 @@
     ref="refPopper"
     v-model:visible="pickerVisible"
     manual-mode
-    effect="light"
+    :effect="Effect.LIGHT"
     pure
     trigger="click"
     v-bind="$attrs"
@@ -138,7 +138,7 @@ import { useLocaleInject } from '@element-plus/hooks'
 import { ClickOutside } from '@element-plus/directives'
 import { elFormKey, elFormItemKey } from '@element-plus/tokens'
 import ElInput from '@element-plus/components/input'
-import ElPopper from '@element-plus/components/popper'
+import ElPopper, { Effect } from '@element-plus/components/popper'
 import { EVENT_CODE } from '@element-plus/utils/aria'
 import { useGlobalConfig, isEmpty } from '@element-plus/utils/util'
 import { timePickerDefaultProps } from './props'
@@ -148,14 +148,14 @@ import type { ElFormContext, ElFormItemContext } from '@element-plus/tokens'
 import type { Options } from '@popperjs/core'
 
 interface PickerOptions {
-  isValidValue: any
-  handleKeydown: any
-  parseUserInput: any
-  formatToString: any
-  getRangeAvailableTime: any
-  getDefaultValue: any
+  isValidValue: (date: Dayjs) => boolean
+  handleKeydown: (event: KeyboardEvent) => void
+  parseUserInput: (value: Dayjs) => dayjs.Dayjs
+  formatToString: (value: Dayjs) => string | string[]
+  getRangeAvailableTime: (date: Dayjs) => dayjs.Dayjs
+  getDefaultValue: () => Dayjs
   panelReady: boolean
-  handleClear: any
+  handleClear: () => void
 }
 
 // Date object and string
@@ -343,22 +343,16 @@ export default defineComponent({
       return ''
     })
 
-    const isTimeLikePicker = computed(() => {
-      return props.type.indexOf('time') !== -1
-    })
+    const isTimeLikePicker = computed(() =>props.type.includes('time'))
 
-    const isTimePicker = computed(() => {
-      return props.type.indexOf('time') === 0
-    })
+    const isTimePicker = computed(() => props.type.startsWith('time'))
 
-    const isDatesPicker = computed(() => {
-      return props.type === 'dates'
-    })
+    const isDatesPicker = computed(() => props.type === 'dates')
+
+    const triggerClass = computed(() => props.prefixIcon || (isTimeLikePicker.value ? 'el-icon-time' : 'el-icon-date'))
 
-    const triggerClass = computed(() => {
-      return props.prefixIcon || (isTimeLikePicker.value ? 'el-icon-time' : 'el-icon-date')
-    })
     const showClose = ref(false)
+
     const onClearIconClick = event => {
       if (props.readonly || pickerDisabled.value) return
       if (showClose.value) {
@@ -525,8 +519,8 @@ export default defineComponent({
       }
     }
 
-    const pickerOptions = ref({} as PickerOptions)
-    const onSetPickerOption = e => {
+    const pickerOptions = ref<Partial<PickerOptions>>({})
+    const onSetPickerOption = <T extends keyof PickerOptions>(e: [T, PickerOptions[T]]) => {
       pickerOptions.value[e[0]] = e[1]
       pickerOptions.value.panelReady = true
     }
@@ -538,7 +532,10 @@ export default defineComponent({
     provide('EP_PICKER_BASE', {
       props,
     })
+
     return {
+      Effect,
+
       // injected popper options
       elPopperOptions,
 
diff --git a/packages/components/time-picker/src/common/props.ts b/packages/components/time-picker/src/common/props.ts
index dc7110a6d7..749ce54120 100644
--- a/packages/components/time-picker/src/common/props.ts
+++ b/packages/components/time-picker/src/common/props.ts
@@ -56,7 +56,7 @@ export const timePickerDefaultProps = {
     default: '',
   },
   popperOptions: {
-    type: Object as PropType<Options>,
+    type: Object as PropType<Partial<Options>>,
     default: () => ({}),
   },
   modelValue: {
diff --git a/packages/components/time-picker/src/time-picker-com/panel-time-pick.vue b/packages/components/time-picker/src/time-picker-com/panel-time-pick.vue
index 41fe0e51d2..45939d6b68 100644
--- a/packages/components/time-picker/src/time-picker-com/panel-time-pick.vue
+++ b/packages/components/time-picker/src/time-picker-com/panel-time-pick.vue
@@ -104,7 +104,7 @@ export default defineComponent({
     const handleCancel = () => {
       ctx.emit('pick', oldValue.value, false)
     }
-    const handleConfirm = (visible = false, first) => {
+    const handleConfirm = (visible = false, first = false) => {
       if (first) return
       ctx.emit('pick', props.parsedValue, visible)
     }
diff --git a/packages/components/time-picker/src/time-picker-com/panel-time-range.vue b/packages/components/time-picker/src/time-picker-com/panel-time-range.vue
index 0d1a8b56a6..0a120ce083 100644
--- a/packages/components/time-picker/src/time-picker-com/panel-time-range.vue
+++ b/packages/components/time-picker/src/time-picker-com/panel-time-range.vue
@@ -98,7 +98,7 @@ export default defineComponent({
     visible: Boolean,
     actualVisible: Boolean,
     parsedValue: {
-      type: [Array, String] as PropType<string | Array<Dayjs>>,
+      type: [Array] as PropType<Array<Dayjs>>,
     },
     format: {
       type: String,
diff --git a/packages/components/time-select/src/time-select.vue b/packages/components/time-select/src/time-select.vue
index d9e4850c97..21399c15ba 100644
--- a/packages/components/time-select/src/time-select.vue
+++ b/packages/components/time-select/src/time-select.vue
@@ -28,8 +28,9 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, computed, ref } from 'vue'
+import { defineComponent, computed, ref, PropType } from 'vue'
 import ElSelect from '@element-plus/components/select'
+import { ComponentSize } from '@element-plus/utils/types'
 
 const { Option: ElOption } = ElSelect
 
@@ -103,7 +104,7 @@ export default defineComponent({
       default: true,
     },
     size: {
-      type: String,
+      type: String as PropType<ComponentSize>,
       default: '',
       validator: (value: string) =>
         !value || ['medium', 'small', 'mini'].indexOf(value) !== -1,
diff --git a/packages/components/tree/src/model/useKeydown.ts b/packages/components/tree/src/model/useKeydown.ts
index fba44e7f09..1304f6a760 100644
--- a/packages/components/tree/src/model/useKeydown.ts
+++ b/packages/components/tree/src/model/useKeydown.ts
@@ -1,4 +1,4 @@
-import { onMounted, onUpdated, onBeforeUnmount, ref, watch } from 'vue'
+import { onMounted, onUpdated, onBeforeUnmount, watch, shallowRef } from 'vue'
 import { EVENT_CODE } from '@element-plus/utils/aria'
 import { on, off } from '@element-plus/utils/dom'
 import TreeStore from './tree-store'
@@ -10,8 +10,8 @@ interface UseKeydownOption {
   el$: Ref<HTMLElement>
 }
 export function useKeydown({ el$ }: UseKeydownOption, store: Ref<TreeStore>) {
-  const treeItems = ref<Nullable<HTMLElement>[]>([])
-  const checkboxItems = ref<Nullable<HTMLElement>[]>([])
+  const treeItems = shallowRef<Nullable<HTMLElement>[]>([])
+  const checkboxItems = shallowRef<Nullable<HTMLElement>[]>([])
 
   onMounted(() => {
     initTabIndex()
diff --git a/packages/components/tree/src/tree-node.vue b/packages/components/tree/src/tree-node.vue
index e162dc2506..a5b70f32e3 100644
--- a/packages/components/tree/src/tree-node.vue
+++ b/packages/components/tree/src/tree-node.vue
@@ -26,7 +26,7 @@
   >
     <div
       class="el-tree-node__content"
-      :style="{ 'padding-left': (node.level - 1) * tree.props.indent + 'px' }"
+      :style="{ paddingLeft: (node.level - 1) * tree.props.indent + 'px' }"
     >
       <span
         :class="[
diff --git a/packages/components/upload/src/upload-list.vue b/packages/components/upload/src/upload-list.vue
index a1aa9f71c7..65fc6e5d8e 100644
--- a/packages/components/upload/src/upload-list.vue
+++ b/packages/components/upload/src/upload-list.vue
@@ -46,7 +46,7 @@
           v-if="file.status === 'uploading'"
           :type="listType === 'picture-card' ? 'circle' : 'line'"
           :stroke-width="listType === 'picture-card' ? 6 : 2"
-          :percentage="parsePercentage(file.percentage)"
+          :percentage="+file.percentage"
         />
         <span v-if="listType === 'picture-card'" class="el-upload-list__item-actions">
           <span
@@ -75,13 +75,14 @@ import { useLocaleInject } from '@element-plus/hooks'
 import ElProgress from '@element-plus/components/progress'
 
 import type { PropType } from 'vue'
+import type { UploadFile } from './upload.type'
 
 export default defineComponent({
   name: 'ElUploadList',
   components: { ElProgress },
   props: {
     files: {
-      type: Array as PropType<File[]>,
+      type: Array as PropType<UploadFile[]>,
       default: () => [] as File[],
     },
     disabled: {
@@ -89,7 +90,7 @@ export default defineComponent({
       default: false,
     },
     handlePreview: {
-      type: Function as PropType<(file: File) => void>,
+      type: Function as PropType<(file: UploadFile) => void>,
       default: () => NOOP,
     },
     listType: {
@@ -101,11 +102,7 @@ export default defineComponent({
   setup(props, { emit }) {
     const { t } = useLocaleInject()
 
-    const parsePercentage = (val: string) => {
-      return parseInt(val, 10)
-    }
-
-    const handleClick = (file: File) => {
+    const handleClick = (file: UploadFile) => {
       props.handlePreview(file)
     }
 
@@ -113,12 +110,11 @@ export default defineComponent({
       (e.target as HTMLElement).focus()
     }
 
-    const handleRemove = (e: Event, file: File) => {
+    const handleRemove = (e: Event, file: UploadFile) => {
       emit('remove', file)
     }
     return {
       focusing: ref(false),
-      parsePercentage,
       handleClick,
       handleRemove,
       onFileClicked,
diff --git a/packages/hooks/use-popper/use-popper-options.ts b/packages/hooks/use-popper/use-popper-options.ts
index db18f671fb..8f176cfbf9 100644
--- a/packages/hooks/use-popper/use-popper-options.ts
+++ b/packages/hooks/use-popper/use-popper-options.ts
@@ -39,12 +39,12 @@ export const defaultModifiers = [
 ]
 
 export const defaultPopperOptions = {
-  type: Object as PropType<Options>,
+  type: Object as PropType<Partial<Options>>,
   default: () => {
     return {
       fallbackPlacements: DEFAULT_FALLBACK_PLACEMENTS,
       strategy: 'fixed',
       modifiers: defaultModifiers,
-    }
+    } as Partial<Options>
   },
 }
diff --git a/packages/utils/dom.ts b/packages/utils/dom.ts
index 110b051226..0cc9f9a1c1 100644
--- a/packages/utils/dom.ts
+++ b/packages/utils/dom.ts
@@ -1,3 +1,4 @@
+import { CSSProperties } from 'vue'
 import isServer from './isServer'
 import { camelize, isObject } from './util'
 
@@ -102,7 +103,7 @@ export function removeClass(el: HTMLElement, cls: string): void {
 }
 
 /* istanbul ignore next */
-// Here I want to use the type CSSStyleDeclaration, but the definition for CSSStyleDeclaration
+// Here I want to use the type CSSProperties, but the definition for CSSProperties
 // has { [index: number]: string } in its type annotation, which does not satisfy the method
 // camelize(s: string)
 // Same as the return type
@@ -129,7 +130,7 @@ export const getStyle = function(
 /* istanbul ignore next */
 export function setStyle(
   element: HTMLElement,
-  styleName: CSSStyleDeclaration | string,
+  styleName: CSSProperties | string,
   value?: string,
 ): void {
   if (!element || !styleName) return
@@ -144,7 +145,7 @@ export function setStyle(
   }
 }
 
-export function removeStyle(element: HTMLElement, style: CSSStyleDeclaration | string) {
+export function removeStyle(element: HTMLElement, style: CSSProperties | string) {
   if (!element || !style) return
 
   if (isObject(style)) {
diff --git a/tsconfig.json b/tsconfig.json
index 5734f3c550..55a14baeb0 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -16,5 +16,11 @@
     "forceConsistentCasingInFileNames": true,
     "resolveJsonModule": true
   },
-  "exclude": ["node_modules"]
+  "exclude": [
+    "node_modules",
+    "**/__tests__",
+    "dist/**",
+    "packages/*/es",
+    "packages/*/lib"
+  ]
 }
diff --git a/typings/vue-test-utils.d.ts b/typings/vue-test-utils.d.ts
index 8b998b1e4b..9b8000df3e 100644
--- a/typings/vue-test-utils.d.ts
+++ b/typings/vue-test-utils.d.ts
@@ -1,11 +1,11 @@
-import { ComponentPublicInstance } from 'vue'
+import { ComponentPublicInstance ,CSSProperties } from 'vue'
 
 declare module '@vue/test-utils' {
   interface DOMWrapper<ElementType> {
-    style: CSSStyleDeclaration
+    style: CSSProperties
   }
 
   interface VueWrapper<T extends ComponentPublicInstance> {
-    style: CSSStyleDeclaration
+    style: CSSProperties
   }
 }
diff --git a/website/components/side-nav.vue b/website/components/side-nav.vue
index 6f94385ba3..0dd4b56e26 100644
--- a/website/components/side-nav.vue
+++ b/website/components/side-nav.vue
@@ -101,6 +101,7 @@
 <script lang="ts">
 import {
   computed,
+  CSSProperties,
   defineComponent,
   nextTick,
   onBeforeUnmount,
@@ -142,7 +143,7 @@ export default defineComponent({
     })
 
     const navStyle = computed(() => {
-      const style = {}
+      const style: CSSProperties = {}
       if (isSmallScreen.value) {
         style.paddingBottom = '60px'
       }
@@ -187,10 +188,10 @@ export default defineComponent({
       hideAllMenu()
       let activeAnchor = document.querySelector('a.active')
       let ul = activeAnchor.parentNode
-      while (ul.tagName !== 'UL') {
+      while (ul.nodeName !== 'UL') {
         ul = ul.parentNode
       }
-      ul.style.height = 'auto'
+      (ul as HTMLUListElement).style.height = 'auto'
     }
 
     const hideAllMenu = () => {
diff --git a/yarn.lock b/yarn.lock
index daf2e86d94..006d1c927a 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -408,7 +408,7 @@
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.12.11.tgz#9ce3595bcd74bc5c466905e86c535b8b25011e79"
   integrity sha512-N3UxG+uuF4CMYoNj8AhnbAcJF0PiuJ9KHuy1lQmkYsxTer/MAH9UBNHsBoAX/4s6NvlDD047No8mYVGGzLL4hg==
 
-"@babel/parser@^7.15.0":
+"@babel/parser@^7.15.0", "@babel/parser@^7.6.0", "@babel/parser@^7.9.6":
   version "7.15.3"
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.15.3.tgz#3416d9bea748052cfcb63dbcc27368105b1ed862"
   integrity sha512-O0L6v/HvqbdJawj0iBEfVQMc3/6WP+AeOsovsIgBFyJaG+W2w7eqvZB7puddATmWuARlm1SX7DwxJ/JJUnDpEA==
@@ -1036,7 +1036,7 @@
     lodash "^4.17.19"
     to-fast-properties "^2.0.0"
 
-"@babel/types@^7.15.0":
+"@babel/types@^7.15.0", "@babel/types@^7.6.1", "@babel/types@^7.9.6":
   version "7.15.0"
   resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.15.0.tgz#61af11f2286c4e9c69ca8deb5f4375a73c72dcbd"
   integrity sha512-OBvfqnllOIdX4ojTHpwZbpvz4j3EWyjkZEdmjH0/cgsd6QOdSgU8rLSk6ard/pcW7rlmjdVSX/AWOaORR1uNOQ==
@@ -1180,6 +1180,25 @@
   resolved "https://registry.yarnpkg.com/@element-plus/icons/-/icons-0.0.11.tgz#9b187c002774548b911850d17fa5fc2f9a515f57"
   integrity sha512-iKQXSxXu131Ai+I9Ymtcof9WId7kaXvB1+WRfAfpQCW7UiAMYgdNDqb/u0hgTo2Yq3MwC4MWJnNuTBEpG8r7+A==
 
+"@emmetio/abbreviation@^2.2.2":
+  version "2.2.2"
+  resolved "https://registry.yarnpkg.com/@emmetio/abbreviation/-/abbreviation-2.2.2.tgz#746762fd9e7a8c2ea604f580c62e3cfe250e6989"
+  integrity sha512-TtE/dBnkTCct8+LntkqVrwqQao6EnPAs1YN3cUgxOxTaBlesBCY37ROUAVZrRlG64GNnVShdl/b70RfAI3w5lw==
+  dependencies:
+    "@emmetio/scanner" "^1.0.0"
+
+"@emmetio/css-abbreviation@^2.1.4":
+  version "2.1.4"
+  resolved "https://registry.yarnpkg.com/@emmetio/css-abbreviation/-/css-abbreviation-2.1.4.tgz#90362e8a1122ce3b76f6c3157907d30182f53f54"
+  integrity sha512-qk9L60Y+uRtM5CPbB0y+QNl/1XKE09mSO+AhhSauIfr2YOx/ta3NJw2d8RtCFxgzHeRqFRr8jgyzThbu+MZ4Uw==
+  dependencies:
+    "@emmetio/scanner" "^1.0.0"
+
+"@emmetio/scanner@^1.0.0":
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/@emmetio/scanner/-/scanner-1.0.0.tgz#065b2af6233fe7474d44823e3deb89724af42b5f"
+  integrity sha512-8HqW8EVqjnCmWXVpqAOZf+EGESdkR27odcMMMGefgKXtar00SoYNSryGv//TELI4T3QFsECo78p+0lmalk/CFA==
+
 "@eslint/eslintrc@^0.4.3":
   version "0.4.3"
   resolved "https://registry.yarnpkg.com/@eslint/eslintrc/-/eslintrc-0.4.3.tgz#9e42981ef035beb3dd49add17acb96e8ff6f394c"
@@ -2801,6 +2820,59 @@
     "@typescript-eslint/types" "4.29.3"
     eslint-visitor-keys "^2.0.0"
 
+"@volar/code-gen@^0.27.7":
+  version "0.27.7"
+  resolved "https://registry.yarnpkg.com/@volar/code-gen/-/code-gen-0.27.7.tgz#2914a4055e8947ad710a52f2b8662b2bf6bc8d29"
+  integrity sha512-CIvgh9YpZ3nlqgtq0oSZNZBZ1paxUVUB67njWBxO9S8WeQFIRcLRn9QUkSDyleROoqFXXuXn1GT8I5qY+Cv5mg==
+  dependencies:
+    "@volar/shared" "^0.27.7"
+    "@volar/source-map" "^0.27.7"
+
+"@volar/html2pug@^0.27.7":
+  version "0.27.7"
+  resolved "https://registry.yarnpkg.com/@volar/html2pug/-/html2pug-0.27.7.tgz#873869b678632ac5214251c370b9e5b28b76e7bd"
+  integrity sha512-QPTyRSWxH+KnFuk4q5vzJxFGtTkAhAj2pkFc2TQVrp8J1Px8NM2eIZ/G9dr8r+av+1fzwEM8DCBrZNLfwV1yJQ==
+  dependencies:
+    domelementtype "^2.2.0"
+    domhandler "^4.2.0"
+    htmlparser2 "^6.1.0"
+    pug "^3.0.2"
+
+"@volar/shared@^0.27.7":
+  version "0.27.7"
+  resolved "https://registry.yarnpkg.com/@volar/shared/-/shared-0.27.7.tgz#b31766e5570f9bbc4a56886020be9d2642a0faa8"
+  integrity sha512-Uu/FrqDUDesVUxDifuTnIbyTIgRxNd6yyBabv8K0K2LpmilP6zd3Oqe6V5vhfNE8fojbUSjBmGWYYyuPbFwi5A==
+  dependencies:
+    upath "^2.0.1"
+    vscode-jsonrpc "^8.0.0-next.1"
+    vscode-uri "^3.0.2"
+
+"@volar/source-map@^0.27.7":
+  version "0.27.7"
+  resolved "https://registry.yarnpkg.com/@volar/source-map/-/source-map-0.27.7.tgz#b6f727a0af35ccba78bb8037c29a8f20996dcf5f"
+  integrity sha512-vG8YQJ5JEyB/sO5RTETpkB6uQ6H4aRIa76X0wGa9rCdJgTt5lLZGLMjG+Xo2osIaUnWyRRQ/bRU/gF+C/QfziA==
+  dependencies:
+    "@volar/shared" "^0.27.7"
+
+"@volar/transforms@^0.27.7":
+  version "0.27.7"
+  resolved "https://registry.yarnpkg.com/@volar/transforms/-/transforms-0.27.7.tgz#fbee4e523280b526c47c5a6cf2f71f48c514e092"
+  integrity sha512-pOmi/18KjCtpEupbAxUvhj+EBH0vBwYKxI2VmbY+lXWBDcFZqGOZFdMt9hdoZEB/FHKeNbi13rs5WBNuZUXQAA==
+  dependencies:
+    "@volar/shared" "^0.27.7"
+
+"@vscode/emmet-helper@^2.7.0":
+  version "2.7.0"
+  resolved "https://registry.yarnpkg.com/@vscode/emmet-helper/-/emmet-helper-2.7.0.tgz#3db485f6a650196ff8bbd38ba1b9e468ec8d22f8"
+  integrity sha512-LL7MoKNLUQASacQROO7hBdx5IAxsEnA0UdJFd9xXyf3sBQgz8NE3QEfo3IezE7uin8W2fkG2+EXMst3oqK6+KQ==
+  dependencies:
+    emmet "^2.3.0"
+    jsonc-parser "^2.3.0"
+    vscode-languageserver-textdocument "^1.0.1"
+    vscode-languageserver-types "^3.15.1"
+    vscode-nls "^5.0.0"
+    vscode-uri "^2.1.2"
+
 "@vue/babel-helper-vue-transform-on@^1.0.0":
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/@vue/babel-helper-vue-transform-on/-/babel-helper-vue-transform-on-1.0.0.tgz#8cbec6bbcae53626ad70139061be5e73403c9a62"
@@ -2832,7 +2904,7 @@
     estree-walker "^2.0.2"
     source-map "^0.6.1"
 
-"@vue/compiler-dom@3.2.6":
+"@vue/compiler-dom@3.2.6", "@vue/compiler-dom@^3.2.4":
   version "3.2.6"
   resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.2.6.tgz#3764d7fe1a696e39fb2a3c9d638da0749e369b2d"
   integrity sha512-+a/3oBAzFIXhHt8L5IHJOTP4a5egzvpXYyi13jR7CUYOR1S+Zzv7vBWKYBnKyJLwnrxTZnTQVjeHCgJq743XKg==
@@ -2840,7 +2912,7 @@
     "@vue/compiler-core" "3.2.6"
     "@vue/shared" "3.2.6"
 
-"@vue/compiler-sfc@^3.2.0":
+"@vue/compiler-sfc@^3.2.0", "@vue/compiler-sfc@^3.2.4":
   version "3.2.6"
   resolved "https://registry.npmjs.org/@vue/compiler-sfc/-/compiler-sfc-3.2.6.tgz#d6ab7410cff57081ab627b15a1ea51a1072c7cf1"
   integrity sha512-Ariz1eDsf+2fw6oWXVwnBNtfKHav72RjlWXpEgozYBLnfRPzP+7jhJRw4Nq0OjSsLx2HqjF3QX7HutTjYB0/eA==
@@ -2888,7 +2960,7 @@
   optionalDependencies:
     prettier "^1.18.2"
 
-"@vue/reactivity@3.2.6":
+"@vue/reactivity@3.2.6", "@vue/reactivity@^3.2.4":
   version "3.2.6"
   resolved "https://registry.yarnpkg.com/@vue/reactivity/-/reactivity-3.2.6.tgz#b8993fa6f48545178e588e25a9c9431a1c1b7d50"
   integrity sha512-8vIDD2wpCnYisNNZjmcIj+Rixn0uhZNY3G1vzlgdVdLygeRSuFjkmnZk6WwvGzUWpKfnG0e/NUySM3mVi59hAA==
@@ -2923,7 +2995,7 @@
     "@vue/shared" "3.2.6"
     csstype "^2.6.8"
 
-"@vue/shared@3.2.6":
+"@vue/shared@3.2.6", "@vue/shared@^3.2.4":
   version "3.2.6"
   resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.2.6.tgz#2c22bae88fe2b7b59fa68a9c9c4cd60bae2c1794"
   integrity sha512-uwX0Qs2e6kdF+WmxwuxJxOnKs/wEkMArtYpHSm7W+VY/23Tl8syMRyjnzEeXrNCAP0/8HZxEGkHJsjPEDNRuHw==
@@ -3476,7 +3548,7 @@ arrify@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/arrify/-/arrify-1.0.1.tgz#898508da2226f380df904728456849c1501a4b0d"
 
-asap@^2.0.0:
+asap@^2.0.0, asap@~2.0.3:
   version "2.0.6"
   resolved "https://registry.yarnpkg.com/asap/-/asap-2.0.6.tgz#e50347611d7e690943208bbdafebcbc2fb866d46"
 
@@ -3495,6 +3567,11 @@ asn1@~0.2.3:
   dependencies:
     safer-buffer "~2.1.0"
 
+assert-never@^1.2.1:
+  version "1.2.1"
+  resolved "https://registry.yarnpkg.com/assert-never/-/assert-never-1.2.1.tgz#11f0e363bf146205fb08193b5c7b90f4d1cf44fe"
+  integrity sha512-TaTivMB6pYI1kXwrFlEhLeGfOqoDNdTxjCdwRfFFkEA30Eu+k48W34nlok2EYWJfFFzqaEmichdNM7th6M5HNw==
+
 assert-plus@1.0.0, assert-plus@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/assert-plus/-/assert-plus-1.0.0.tgz#f12e0f3c5d77b0b1cdd9146942e4e96c1e4dd525"
@@ -3767,6 +3844,13 @@ babel-preset-vue@^2.0.2:
     babel-plugin-syntax-jsx "^6.18.0"
     babel-plugin-transform-vue-jsx "^3.5.0"
 
+babel-walk@3.0.0-canary-5:
+  version "3.0.0-canary-5"
+  resolved "https://registry.yarnpkg.com/babel-walk/-/babel-walk-3.0.0-canary-5.tgz#f66ecd7298357aee44955f235a6ef54219104b11"
+  integrity sha512-GAwkz0AihzY5bkwIY5QDR+LvsRQgB/B+1foMPvi0FZPMl5fjD7ICiznUiBdLYMH1QYe6vqu4gWYytZOccLouFw==
+  dependencies:
+    "@babel/types" "^7.9.6"
+
 bach@^1.0.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/bach/-/bach-1.2.0.tgz#4b3ce96bf27134f79a1b414a51c14e34c3bd9880"
@@ -4223,6 +4307,14 @@ cachedir@2.2.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/cachedir/-/cachedir-2.2.0.tgz#19afa4305e05d79e417566882e0c8f960f62ff0e"
 
+call-bind@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/call-bind/-/call-bind-1.0.2.tgz#b1d4e89e688119c3c9a903ad30abb2f6a919be3c"
+  integrity sha512-7O+FbCihrB5WGbFYesctwmTKae6rOiIzmz1icreWJ+0aA7LJfuqhEso2T9ncpcFtzMQtzXf2QGGueWJGTYsqrA==
+  dependencies:
+    function-bind "^1.1.1"
+    get-intrinsic "^1.0.2"
+
 call-me-maybe@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/call-me-maybe/-/call-me-maybe-1.0.1.tgz#26d208ea89e37b5cbde60250a15f031c16a4d66b"
@@ -4366,6 +4458,13 @@ char-regex@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/char-regex/-/char-regex-1.0.2.tgz#d744358226217f981ed58f479b1d6bcc29545dcf"
 
+character-parser@^2.2.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/character-parser/-/character-parser-2.2.0.tgz#c7ce28f36d4bcd9744e5ffc2c5fcde1c73261fc0"
+  integrity sha1-x84o821LzZdE5f/CxfzeHHMmH8A=
+  dependencies:
+    is-regex "^1.0.3"
+
 chardet@^0.7.0:
   version "0.7.0"
   resolved "https://registry.yarnpkg.com/chardet/-/chardet-0.7.0.tgz#90094849f0937f2eedc2425d0d28a9e5f0cbad9e"
@@ -4849,6 +4948,14 @@ consolidate@^0.16.0:
   dependencies:
     bluebird "^3.7.2"
 
+constantinople@^4.0.1:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/constantinople/-/constantinople-4.0.1.tgz#0def113fa0e4dc8de83331a5cf79c8b325213151"
+  integrity sha512-vCrqcSIq4//Gx74TXXCGnHpulY1dskqLTFGDmhrGxzeXL8lF8kvXv6mpNWlJj1uD4DW23D4ljAqbY4RRaaUZIw==
+  dependencies:
+    "@babel/parser" "^7.6.0"
+    "@babel/types" "^7.6.1"
+
 constants-browserify@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/constants-browserify/-/constants-browserify-1.0.0.tgz#c20b96d8c617748aaf1c16021760cd27fcb8cb75"
@@ -5647,6 +5754,11 @@ doctrine@^3.0.0:
   dependencies:
     esutils "^2.0.2"
 
+doctypes@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/doctypes/-/doctypes-1.1.0.tgz#ea80b106a87538774e8a3a4a5afe293de489e0a9"
+  integrity sha1-6oCxBqh1OHdOijpKWv4pPeSJ4Kk=
+
 dom-converter@^0.2:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/dom-converter/-/dom-converter-0.2.0.tgz#6721a9daee2e293682955b6afe416771627bb768"
@@ -5660,6 +5772,15 @@ dom-serializer@0:
     domelementtype "^2.0.1"
     entities "^2.0.0"
 
+dom-serializer@^1.0.1:
+  version "1.3.2"
+  resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-1.3.2.tgz#6206437d32ceefaec7161803230c7a20bc1b4d91"
+  integrity sha512-5c54Bk5Dw4qAxNOI1pFEizPSjVsx5+bpJKmL2kPn8JhBUq2q09tTCa3mjijun2NfK78NMouDYNMBkOrPZiS+ig==
+  dependencies:
+    domelementtype "^2.0.1"
+    domhandler "^4.2.0"
+    entities "^2.0.0"
+
 domain-browser@^1.1.1:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/domain-browser/-/domain-browser-1.2.0.tgz#3d31f50191a6749dd1375a7f522e823d42e54eda"
@@ -5672,6 +5793,11 @@ domelementtype@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-2.0.1.tgz#1f8bdfe91f5a78063274e803b4bdcedf6e94f94d"
 
+domelementtype@^2.2.0:
+  version "2.2.0"
+  resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-2.2.0.tgz#9a0b6c2782ed6a1c7323d42267183df9bd8b1d57"
+  integrity sha512-DtBMo82pv1dFtUmHyr48beiuq792Sxohr+8Hm9zoxklYPfa6n0Z3Byjj2IV7bmr2IyqClnqEQhfgHJJ5QF0R5A==
+
 domexception@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/domexception/-/domexception-2.0.1.tgz#fb44aefba793e1574b0af6aed2801d057529f304"
@@ -5684,6 +5810,13 @@ domhandler@^2.3.0:
   dependencies:
     domelementtype "1"
 
+domhandler@^4.0.0, domhandler@^4.2.0:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/domhandler/-/domhandler-4.2.0.tgz#f9768a5f034be60a89a27c2e4d0f74eba0d8b059"
+  integrity sha512-zk7sgt970kzPks2Bf+dwT/PLzghLnsivb9CcxkvR8Mzr66Olr0Ofd8neSbglHJHaHa2MadfoSdNlKYAaafmWfA==
+  dependencies:
+    domelementtype "^2.2.0"
+
 domutils@1.5.1:
   version "1.5.1"
   resolved "https://registry.yarnpkg.com/domutils/-/domutils-1.5.1.tgz#dcd8488a26f563d61079e48c9f7b7e32373682cf"
@@ -5698,6 +5831,15 @@ domutils@^1.5.1, domutils@^1.7.0:
     dom-serializer "0"
     domelementtype "1"
 
+domutils@^2.5.2:
+  version "2.7.0"
+  resolved "https://registry.yarnpkg.com/domutils/-/domutils-2.7.0.tgz#8ebaf0c41ebafcf55b0b72ec31c56323712c5442"
+  integrity sha512-8eaHa17IwJUPAiB+SoTYBo5mCdeMgdcAoXJ59m6DT1vw+5iLS3gNoqYaRowaBKtGVrOF1Jz4yDTgYKLK2kvfJg==
+  dependencies:
+    dom-serializer "^1.0.1"
+    domelementtype "^2.2.0"
+    domhandler "^4.2.0"
+
 dot-case@^3.0.3:
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/dot-case/-/dot-case-3.0.3.tgz#21d3b52efaaba2ea5fda875bb1aa8124521cf4aa"
@@ -5799,6 +5941,14 @@ emittery@^0.7.1:
   version "0.7.1"
   resolved "https://registry.yarnpkg.com/emittery/-/emittery-0.7.1.tgz#c02375a927a40948c0345cc903072597f5270451"
 
+emmet@^2.3.0:
+  version "2.3.4"
+  resolved "https://registry.yarnpkg.com/emmet/-/emmet-2.3.4.tgz#5ba0d7a5569a68c7697dfa890c772e4f3179d123"
+  integrity sha512-3IqSwmO+N2ZGeuhDyhV/TIOJFUbkChi53bcasSNRE7Yd+4eorbbYz4e53TpMECt38NtYkZNupQCZRlwdAYA42A==
+  dependencies:
+    "@emmetio/abbreviation" "^2.2.2"
+    "@emmetio/css-abbreviation" "^2.1.4"
+
 emoji-regex@^7.0.1:
   version "7.0.3"
   resolved "https://registry.yarnpkg.com/emoji-regex/-/emoji-regex-7.0.3.tgz#933a04052860c85e83c122479c4748a8e4c72156"
@@ -6870,6 +7020,15 @@ get-caller-file@^2.0.1:
   resolved "https://registry.yarnpkg.com/get-caller-file/-/get-caller-file-2.0.5.tgz#4f94412a82db32f36e3b0b9741f8a97feb031f7e"
   integrity sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==
 
+get-intrinsic@^1.0.2:
+  version "1.1.1"
+  resolved "https://registry.yarnpkg.com/get-intrinsic/-/get-intrinsic-1.1.1.tgz#15f59f376f855c446963948f0d24cd3637b4abc6"
+  integrity sha512-kWZrnVM42QCiEA2Ig1bG8zjoIMOgxWwYCEeNdwY6Tv/cOSeGpcoX4pXHfKUxNKVoArnrEr2e9srnAxxGIraS9Q==
+  dependencies:
+    function-bind "^1.1.1"
+    has "^1.0.3"
+    has-symbols "^1.0.1"
+
 get-own-enumerable-property-symbols@^3.0.0:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/get-own-enumerable-property-symbols/-/get-own-enumerable-property-symbols-3.0.2.tgz#b5fde77f22cbe35f390b4e089922c50bce6ef664"
@@ -7319,6 +7478,18 @@ has-symbols@^1.0.0, has-symbols@^1.0.1:
   resolved "https://registry.yarnpkg.com/has-symbols/-/has-symbols-1.0.1.tgz#9f5214758a44196c406d9bd76cebf81ec2dd31e8"
   integrity sha512-PLcsoqu++dmEIZB+6totNFKq/7Do+Z0u4oT0zKOJNl3lYK6vGwwu2hjHs+68OEZbTjiUE9bgOABXbP/GvrS0Kg==
 
+has-symbols@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/has-symbols/-/has-symbols-1.0.2.tgz#165d3070c00309752a1236a479331e3ac56f1423"
+  integrity sha512-chXa79rL/UC2KlX17jo3vRGz0azaWEx5tGqZg5pO3NUyEJVB17dMruQlzCCOfUvElghKcm5194+BCRvi2Rv/Gw==
+
+has-tostringtag@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/has-tostringtag/-/has-tostringtag-1.0.0.tgz#7e133818a7d394734f941e73c3d3f9291e658b25"
+  integrity sha512-kFjcSNhnlGV1kyoGk7OXKSawH5JOb/LzUc5w9B02hOTO0dfFRjbHQKvg1d6cf3HbeUmtU9VbbV3qzZ2Teh97WQ==
+  dependencies:
+    has-symbols "^1.0.2"
+
 has-unicode@^2.0.0, has-unicode@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/has-unicode/-/has-unicode-2.0.1.tgz#e0e6fe6a28cf51138855e086d1691e771de2a8b9"
@@ -7513,6 +7684,16 @@ htmlparser2@^3.3.0:
     inherits "^2.0.1"
     readable-stream "^3.1.1"
 
+htmlparser2@^6.1.0:
+  version "6.1.0"
+  resolved "https://registry.yarnpkg.com/htmlparser2/-/htmlparser2-6.1.0.tgz#c4d762b6c3371a05dbe65e94ae43a9f845fb8fb7"
+  integrity sha512-gyyPk6rgonLFEDGoeRgQNaEUvdJ4ktTmmUh/h2t7s+M8oPpIPxgNACWa+6ESR57kXstwqPiCut0V8NRpcwgU7A==
+  dependencies:
+    domelementtype "^2.0.1"
+    domhandler "^4.0.0"
+    domutils "^2.5.2"
+    entities "^2.0.0"
+
 http-cache-semantics@^3.8.1:
   version "3.8.1"
   resolved "https://registry.yarnpkg.com/http-cache-semantics/-/http-cache-semantics-3.8.1.tgz#39b0e16add9b605bf0a9ef3d9daaf4843b4cacd2"
@@ -7977,6 +8158,13 @@ is-core-module@^2.1.0:
   dependencies:
     has "^1.0.3"
 
+is-core-module@^2.2.0:
+  version "2.6.0"
+  resolved "https://registry.yarnpkg.com/is-core-module/-/is-core-module-2.6.0.tgz#d7553b2526fe59b92ba3e40c8df757ec8a709e19"
+  integrity sha512-wShG8vs60jKfPWpF2KZRaAtvt3a20OAn7+IJ6hLPECpSABLcKtFKTTI4ZtH5QcBruBHlq+WsdHWyz0BCZW7svQ==
+  dependencies:
+    has "^1.0.3"
+
 is-data-descriptor@^0.1.4:
   version "0.1.4"
   resolved "https://registry.yarnpkg.com/is-data-descriptor/-/is-data-descriptor-0.1.4.tgz#0b5ee648388e2c860282e793f1856fec3f301b56"
@@ -8022,6 +8210,14 @@ is-docker@^2.0.0:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/is-docker/-/is-docker-2.1.1.tgz#4125a88e44e450d384e09047ede71adc2d144156"
 
+is-expression@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/is-expression/-/is-expression-4.0.0.tgz#c33155962abf21d0afd2552514d67d2ec16fd2ab"
+  integrity sha512-zMIXX63sxzG3XrkHkrAPvm/OVZVSCPNkwMHU8oTX7/U3AL78I0QXCEICXUM13BIa8TYGZ68PiTKfQz3yaTNr4A==
+  dependencies:
+    acorn "^7.1.1"
+    object-assign "^4.1.1"
+
 is-extendable@^0.1.0, is-extendable@^0.1.1:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/is-extendable/-/is-extendable-0.1.1.tgz#62b110e289a471418e3ec36a617d472e301dfc89"
@@ -8160,12 +8356,25 @@ is-potential-custom-element-name@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/is-potential-custom-element-name/-/is-potential-custom-element-name-1.0.0.tgz#0c52e54bcca391bb2c494b21e8626d7336c6e397"
 
+is-promise@^2.0.0:
+  version "2.2.2"
+  resolved "https://registry.yarnpkg.com/is-promise/-/is-promise-2.2.2.tgz#39ab959ccbf9a774cf079f7b40c7a26f763135f1"
+  integrity sha512-+lP4/6lKUBfQjZ2pdxThZvLUAafmZb8OAxFb8XXtiQmS35INgr85hdOGoEs124ez1FCnZJt6jau/T+alh58QFQ==
+
 is-reference@^1.2.1:
   version "1.2.1"
   resolved "https://registry.yarnpkg.com/is-reference/-/is-reference-1.2.1.tgz#8b2dac0b371f4bc994fdeaba9eb542d03002d0b7"
   dependencies:
     "@types/estree" "*"
 
+is-regex@^1.0.3:
+  version "1.1.4"
+  resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.1.4.tgz#eef5663cd59fa4c0ae339505323df6854bb15958"
+  integrity sha512-kvRdxDsxZjhzUX07ZnLydzS1TU/TJlTUHHY4YLL87e37oUA49DfkLqgy+VjFocowy29cKvcSiu+kIv728jTTVg==
+  dependencies:
+    call-bind "^1.0.2"
+    has-tostringtag "^1.0.0"
+
 is-regex@^1.0.4, is-regex@^1.1.1:
   version "1.1.1"
   resolved "https://registry.yarnpkg.com/is-regex/-/is-regex-1.1.1.tgz#c6f98aacc546f6cec5468a07b7b153ab564a57b9"
@@ -8762,6 +8971,11 @@ joycon@^3.0.1:
   resolved "https://registry.npmjs.org/joycon/-/joycon-3.0.1.tgz#9074c9b08ccf37a6726ff74a18485f85efcaddaf"
   integrity sha512-SJcJNBg32dGgxhPtM0wQqxqV0ax9k/9TaUskGDSJkSFSQOEWWvQ3zzWdGQRIUry2j1zA5+ReH13t0Mf3StuVZA==
 
+js-stringify@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/js-stringify/-/js-stringify-1.0.2.tgz#1736fddfd9724f28a3682adc6230ae7e4e9679db"
+  integrity sha1-Fzb939lyTyijaCrcYjCufk6Weds=
+
 "js-tokens@^3.0.0 || ^4.0.0", js-tokens@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
@@ -8872,6 +9086,11 @@ json5@^1.0.1:
   dependencies:
     minimist "^1.2.0"
 
+jsonc-parser@^2.3.0:
+  version "2.3.1"
+  resolved "https://registry.yarnpkg.com/jsonc-parser/-/jsonc-parser-2.3.1.tgz#59549150b133f2efacca48fe9ce1ec0659af2342"
+  integrity sha512-H8jvkz1O50L3dMZCsLqiuB2tA7muqbSg1AtGEkN0leAqGjsUzDJir3Zwr02BhqdcITPg3ei3mZ+HjMocAknhhg==
+
 jsonc-parser@^3.0.0:
   version "3.0.0"
   resolved "https://registry.npmjs.org/jsonc-parser/-/jsonc-parser-3.0.0.tgz#abdd785701c7e7eaca8a9ec8cf070ca51a745a22"
@@ -8904,6 +9123,14 @@ jsprim@^1.2.2:
     json-schema "0.2.3"
     verror "1.10.0"
 
+jstransformer@1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/jstransformer/-/jstransformer-1.0.0.tgz#ed8bf0921e2f3f1ed4d5c1a44f68709ed24722c3"
+  integrity sha1-7Yvwkh4vPx7U1cGkT2hwntJHIsM=
+  dependencies:
+    is-promise "^2.0.0"
+    promise "^7.0.1"
+
 just-debounce@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/just-debounce/-/just-debounce-1.0.0.tgz#87fccfaeffc0b68cd19d55f6722943f929ea35ea"
@@ -11394,6 +11621,13 @@ promise-retry@^2.0.1:
     err-code "^2.0.2"
     retry "^0.12.0"
 
+promise@^7.0.1:
+  version "7.3.1"
+  resolved "https://registry.yarnpkg.com/promise/-/promise-7.3.1.tgz#064b72602b18f90f29192b8b1bc418ffd1ebd3bf"
+  integrity sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==
+  dependencies:
+    asap "~2.0.3"
+
 prompts@^2.0.1:
   version "2.3.2"
   resolved "https://registry.yarnpkg.com/prompts/-/prompts-2.3.2.tgz#480572d89ecf39566d2bd3fe2c9fccb7c4c0b068"
@@ -11453,6 +11687,109 @@ public-encrypt@^4.0.0:
     randombytes "^2.0.1"
     safe-buffer "^5.1.2"
 
+pug-attrs@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/pug-attrs/-/pug-attrs-3.0.0.tgz#b10451e0348165e31fad1cc23ebddd9dc7347c41"
+  integrity sha512-azINV9dUtzPMFQktvTXciNAfAuVh/L/JCl0vtPCwvOA21uZrC08K/UnmrL+SXGEVc1FwzjW62+xw5S/uaLj6cA==
+  dependencies:
+    constantinople "^4.0.1"
+    js-stringify "^1.0.2"
+    pug-runtime "^3.0.0"
+
+pug-code-gen@^3.0.2:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/pug-code-gen/-/pug-code-gen-3.0.2.tgz#ad190f4943133bf186b60b80de483100e132e2ce"
+  integrity sha512-nJMhW16MbiGRiyR4miDTQMRWDgKplnHyeLvioEJYbk1RsPI3FuA3saEP8uwnTb2nTJEKBU90NFVWJBk4OU5qyg==
+  dependencies:
+    constantinople "^4.0.1"
+    doctypes "^1.1.0"
+    js-stringify "^1.0.2"
+    pug-attrs "^3.0.0"
+    pug-error "^2.0.0"
+    pug-runtime "^3.0.0"
+    void-elements "^3.1.0"
+    with "^7.0.0"
+
+pug-error@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/pug-error/-/pug-error-2.0.0.tgz#5c62173cb09c34de2a2ce04f17b8adfec74d8ca5"
+  integrity sha512-sjiUsi9M4RAGHktC1drQfCr5C5eriu24Lfbt4s+7SykztEOwVZtbFk1RRq0tzLxcMxMYTBR+zMQaG07J/btayQ==
+
+pug-filters@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/pug-filters/-/pug-filters-4.0.0.tgz#d3e49af5ba8472e9b7a66d980e707ce9d2cc9b5e"
+  integrity sha512-yeNFtq5Yxmfz0f9z2rMXGw/8/4i1cCFecw/Q7+D0V2DdtII5UvqE12VaZ2AY7ri6o5RNXiweGH79OCq+2RQU4A==
+  dependencies:
+    constantinople "^4.0.1"
+    jstransformer "1.0.0"
+    pug-error "^2.0.0"
+    pug-walk "^2.0.0"
+    resolve "^1.15.1"
+
+pug-lexer@^5.0.1:
+  version "5.0.1"
+  resolved "https://registry.yarnpkg.com/pug-lexer/-/pug-lexer-5.0.1.tgz#ae44628c5bef9b190b665683b288ca9024b8b0d5"
+  integrity sha512-0I6C62+keXlZPZkOJeVam9aBLVP2EnbeDw3An+k0/QlqdwH6rv8284nko14Na7c0TtqtogfWXcRoFE4O4Ff20w==
+  dependencies:
+    character-parser "^2.2.0"
+    is-expression "^4.0.0"
+    pug-error "^2.0.0"
+
+pug-linker@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.yarnpkg.com/pug-linker/-/pug-linker-4.0.0.tgz#12cbc0594fc5a3e06b9fc59e6f93c146962a7708"
+  integrity sha512-gjD1yzp0yxbQqnzBAdlhbgoJL5qIFJw78juN1NpTLt/mfPJ5VgC4BvkoD3G23qKzJtIIXBbcCt6FioLSFLOHdw==
+  dependencies:
+    pug-error "^2.0.0"
+    pug-walk "^2.0.0"
+
+pug-load@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/pug-load/-/pug-load-3.0.0.tgz#9fd9cda52202b08adb11d25681fb9f34bd41b662"
+  integrity sha512-OCjTEnhLWZBvS4zni/WUMjH2YSUosnsmjGBB1An7CsKQarYSWQ0GCVyd4eQPMFJqZ8w9xgs01QdiZXKVjk92EQ==
+  dependencies:
+    object-assign "^4.1.1"
+    pug-walk "^2.0.0"
+
+pug-parser@^6.0.0:
+  version "6.0.0"
+  resolved "https://registry.yarnpkg.com/pug-parser/-/pug-parser-6.0.0.tgz#a8fdc035863a95b2c1dc5ebf4ecf80b4e76a1260"
+  integrity sha512-ukiYM/9cH6Cml+AOl5kETtM9NR3WulyVP2y4HOU45DyMim1IeP/OOiyEWRr6qk5I5klpsBnbuHpwKmTx6WURnw==
+  dependencies:
+    pug-error "^2.0.0"
+    token-stream "1.0.0"
+
+pug-runtime@^3.0.0, pug-runtime@^3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/pug-runtime/-/pug-runtime-3.0.1.tgz#f636976204723f35a8c5f6fad6acda2a191b83d7"
+  integrity sha512-L50zbvrQ35TkpHwv0G6aLSuueDRwc/97XdY8kL3tOT0FmhgG7UypU3VztfV/LATAvmUfYi4wNxSajhSAeNN+Kg==
+
+pug-strip-comments@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/pug-strip-comments/-/pug-strip-comments-2.0.0.tgz#f94b07fd6b495523330f490a7f554b4ff876303e"
+  integrity sha512-zo8DsDpH7eTkPHCXFeAk1xZXJbyoTfdPlNR0bK7rpOMuhBYb0f5qUVCO1xlsitYd3w5FQTK7zpNVKb3rZoUrrQ==
+  dependencies:
+    pug-error "^2.0.0"
+
+pug-walk@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/pug-walk/-/pug-walk-2.0.0.tgz#417aabc29232bb4499b5b5069a2b2d2a24d5f5fe"
+  integrity sha512-yYELe9Q5q9IQhuvqsZNwA5hfPkMJ8u92bQLIMcsMxf/VADjNtEYptU+inlufAFYcWdHlwNfZOEnOOQrZrcyJCQ==
+
+pug@^3.0.2:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/pug/-/pug-3.0.2.tgz#f35c7107343454e43bc27ae0ff76c731b78ea535"
+  integrity sha512-bp0I/hiK1D1vChHh6EfDxtndHji55XP/ZJKwsRqrz6lRia6ZC2OZbdAymlxdVFwd1L70ebrVJw4/eZ79skrIaw==
+  dependencies:
+    pug-code-gen "^3.0.2"
+    pug-filters "^4.0.0"
+    pug-lexer "^5.0.1"
+    pug-linker "^4.0.0"
+    pug-load "^3.0.0"
+    pug-parser "^6.0.0"
+    pug-runtime "^3.0.1"
+    pug-strip-comments "^2.0.0"
+
 pump@^2.0.0:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/pump/-/pump-2.0.1.tgz#12399add6e4cf7526d973cbc8b5ce2e2908b3909"
@@ -11872,6 +12209,11 @@ replace-homedir@^1.0.0:
     is-absolute "^1.0.0"
     remove-trailing-separator "^1.1.0"
 
+request-light@^0.5.4:
+  version "0.5.4"
+  resolved "https://registry.yarnpkg.com/request-light/-/request-light-0.5.4.tgz#497a98c6d8ae49536417a5e2d7f383b934f3e38c"
+  integrity sha512-t3566CMweOFlUk7Y1DJMu5OrtpoZEb6aSTsLQVT3wtrIEJ5NhcY9G/Oqxvjllzl4a15zXfFlcr9q40LbLVQJqw==
+
 request-promise-core@1.1.4:
   version "1.1.4"
   resolved "https://registry.yarnpkg.com/request-promise-core/-/request-promise-core-1.1.4.tgz#3eedd4223208d419867b78ce815167d10593a22f"
@@ -12014,6 +12356,14 @@ resolve@^1.13.1, resolve@^1.8.1:
     is-core-module "^2.0.0"
     path-parse "^1.0.6"
 
+resolve@^1.15.1:
+  version "1.20.0"
+  resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.20.0.tgz#629a013fb3f70755d6f0b7935cc1c2c5378b1975"
+  integrity sha512-wENBPt4ySzg4ybFQW2TT1zMQucPK95HSh/nq2CFTZVOGut2+pQvSsgtda4d26YrYcr067wjbmzOG8byDPBX63A==
+  dependencies:
+    is-core-module "^2.2.0"
+    path-parse "^1.0.6"
+
 resolve@^1.18.1:
   version "1.19.0"
   resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.19.0.tgz#1af5bf630409734a067cae29318aac7fa29a267c"
@@ -13358,6 +13708,11 @@ toidentifier@1.0.0:
   resolved "https://registry.yarnpkg.com/toidentifier/-/toidentifier-1.0.0.tgz#7e1be3470f1e77948bc43d94a3c8f4d7752ba553"
   integrity sha512-yaOH/Pk/VEhBWWTlhI+qXxDFXlejDGcQipMlyxda9nthulaxLZUNcUqFxokp0vcYnvteJln5FNQDRrxj3YcbVw==
 
+token-stream@1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/token-stream/-/token-stream-1.0.0.tgz#cc200eab2613f4166d27ff9afc7ca56d49df6eb4"
+  integrity sha1-zCAOqyYT9BZtJ/+a/HylbUnfbrQ=
+
 tough-cookie@^2.3.3, tough-cookie@~2.5.0:
   version "2.5.0"
   resolved "https://registry.yarnpkg.com/tough-cookie/-/tough-cookie-2.5.0.tgz#cd9fb2a0aa1d5a12b473bd9fb96fa3dcff65ade2"
@@ -13689,6 +14044,11 @@ upath@^1.1.1, upath@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/upath/-/upath-1.2.0.tgz#8f66dbcd55a883acdae4408af8b035a5044c1894"
 
+upath@^2.0.1:
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/upath/-/upath-2.0.1.tgz#50c73dea68d6f6b990f51d279ce6081665d61a8b"
+  integrity sha512-1uEe95xksV1O0CYKXo8vQvN1JEbtJp7lb7C5U9HMsIp6IVwntkH/oNUzyVNQSd4S1sYk2FpSSW44FqMc8qee5w==
+
 uri-js@^4.2.2:
   version "4.4.1"
   resolved "https://registry.yarnpkg.com/uri-js/-/uri-js-4.4.1.tgz#9b1a52595225859e55f669d928f88c6c57f2a77e"
@@ -13914,6 +14274,140 @@ vm-browserify@^1.0.1:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/vm-browserify/-/vm-browserify-1.1.2.tgz#78641c488b8e6ca91a75f511e7a3b32a86e5dda0"
 
+void-elements@^3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/void-elements/-/void-elements-3.1.0.tgz#614f7fbf8d801f0bb5f0661f5b2f5785750e4f09"
+  integrity sha1-YU9/v42AHwu18GYfWy9XhXUOTwk=
+
+vscode-css-languageservice@^5.1.4:
+  version "5.1.4"
+  resolved "https://registry.yarnpkg.com/vscode-css-languageservice/-/vscode-css-languageservice-5.1.4.tgz#07e4c63f1c3bb06e6f3f329c32b490d20a601bab"
+  integrity sha512-fIJZJMXbaBsK0ifBb2RmSiLtzwn6NrZnKn7O+0ziIjwAY+rPvSK9St2qqQXFU3reZVRAt/I4GBp40dC/THcUDA==
+  dependencies:
+    vscode-languageserver-textdocument "^1.0.1"
+    vscode-languageserver-types "^3.16.0"
+    vscode-nls "^5.0.0"
+    vscode-uri "^3.0.2"
+
+vscode-html-languageservice@^4.0.7:
+  version "4.0.7"
+  resolved "https://registry.yarnpkg.com/vscode-html-languageservice/-/vscode-html-languageservice-4.0.7.tgz#94f2ed22c821965f828222d13b5aa541b358d992"
+  integrity sha512-P5TQMYpgxAdLs+PwpC7Lm+0lXCyQAC6kZ41YuPYNHVooC4XO7Y2+ncHBcQJVK4C9LU2cTOAl0lzq4WAxuwRHYw==
+  dependencies:
+    vscode-languageserver-textdocument "^1.0.1"
+    vscode-languageserver-types "^3.16.0"
+    vscode-nls "^5.0.0"
+    vscode-uri "^3.0.2"
+
+vscode-json-languageservice@^4.1.5:
+  version "4.1.7"
+  resolved "https://registry.yarnpkg.com/vscode-json-languageservice/-/vscode-json-languageservice-4.1.7.tgz#18244d62b115a5818c7526ef4339438b7175dfaa"
+  integrity sha512-cwG5TwZyHYthsk2aS3W1dVgVP6Vwn3o+zscwN58uMgZt/nKuyxd9vdEB1F58Ix+S5kSKAnkUCP6hvulcoImQQQ==
+  dependencies:
+    jsonc-parser "^3.0.0"
+    vscode-languageserver-textdocument "^1.0.1"
+    vscode-languageserver-types "^3.16.0"
+    vscode-nls "^5.0.0"
+    vscode-uri "^3.0.2"
+
+vscode-jsonrpc@8.0.0-next.2, vscode-jsonrpc@^8.0.0-next.1:
+  version "8.0.0-next.2"
+  resolved "https://registry.yarnpkg.com/vscode-jsonrpc/-/vscode-jsonrpc-8.0.0-next.2.tgz#285fc294be586e4768acd67e5a42efc738a5cac0"
+  integrity sha512-gxUyTBAjmwGkiHW/UaRScre2s4i98P8M7gnc3VB4DrVQUm3vQ0idi2cN9nbkfcjATx+uEt8C22j+MLN/8UzsJA==
+
+vscode-languageserver-protocol@3.17.0-next.8:
+  version "3.17.0-next.8"
+  resolved "https://registry.yarnpkg.com/vscode-languageserver-protocol/-/vscode-languageserver-protocol-3.17.0-next.8.tgz#ef2eb7423b474cccd11384239de24488e7fe818c"
+  integrity sha512-P89vSuJ+FA5JzFmcOoZN13Ig1yd6LsiPOig0O5m5BSGuO/rplQegCd9J0wKpaTy7trf/SYHRoypnbUBdzy14sg==
+  dependencies:
+    vscode-jsonrpc "8.0.0-next.2"
+    vscode-languageserver-types "3.17.0-next.3"
+
+vscode-languageserver-textdocument@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/vscode-languageserver-textdocument/-/vscode-languageserver-textdocument-1.0.1.tgz#178168e87efad6171b372add1dea34f53e5d330f"
+  integrity sha512-UIcJDjX7IFkck7cSkNNyzIz5FyvpQfY7sdzVy+wkKN/BLaD4DQ0ppXQrKePomCxTS7RrolK1I0pey0bG9eh8dA==
+
+vscode-languageserver-types@3.17.0-next.3:
+  version "3.17.0-next.3"
+  resolved "https://registry.yarnpkg.com/vscode-languageserver-types/-/vscode-languageserver-types-3.17.0-next.3.tgz#e1f4311e08ea3193e81126154b6a342fc1c3dba3"
+  integrity sha512-VQcXnhKYxUW6OiRMhG++SzmZYMJwusXknJGd+FfdOnS1yHAo734OHyR0e2eEHDlv0/oWc8RZPgx/VKSKyondVg==
+
+vscode-languageserver-types@^3.15.1, vscode-languageserver-types@^3.16.0:
+  version "3.16.0"
+  resolved "https://registry.yarnpkg.com/vscode-languageserver-types/-/vscode-languageserver-types-3.16.0.tgz#ecf393fc121ec6974b2da3efb3155644c514e247"
+  integrity sha512-k8luDIWJWyenLc5ToFQQMaSrqCHiLwyKPHKPQZ5zz21vM+vIVUSvsRpcbiECH4WR88K2XZqc4ScRcZ7nk/jbeA==
+
+vscode-languageserver@^8.0.0-next.1:
+  version "8.0.0-next.2"
+  resolved "https://registry.yarnpkg.com/vscode-languageserver/-/vscode-languageserver-8.0.0-next.2.tgz#3a3daf79ff10350ea9cec5c73b5302901a955117"
+  integrity sha512-7qCEXTeGZKkI8BGvlKh0JPXTY7BaWoiwQYKCcGaUgnMs34wt6F/yaKcxoC3XIouBBVyRxiI6Ml/JdztM3XYEaA==
+  dependencies:
+    vscode-languageserver-protocol "3.17.0-next.8"
+
+vscode-nls@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/vscode-nls/-/vscode-nls-5.0.0.tgz#99f0da0bd9ea7cda44e565a74c54b1f2bc257840"
+  integrity sha512-u0Lw+IYlgbEJFF6/qAqG2d1jQmJl0eyAGJHoAJqr2HT4M2BNuQYSEiSE75f52pXHSJm8AlTjnLLbBFPrdz2hpA==
+
+vscode-pug-languageservice@^0.27.7:
+  version "0.27.7"
+  resolved "https://registry.yarnpkg.com/vscode-pug-languageservice/-/vscode-pug-languageservice-0.27.7.tgz#1f521fb33f003101befa92fb89903e1f23ecd9fd"
+  integrity sha512-pRKKUNfbAwbDujyIQiLNBLeHIrIUXEDPzgYPxz3KFCxJ/t2RXk+RRZeWFXWsdsQi6uESAPyFTv+jHJltKwSCfw==
+  dependencies:
+    "@volar/code-gen" "^0.27.7"
+    "@volar/shared" "^0.27.7"
+    "@volar/source-map" "^0.27.7"
+    "@volar/transforms" "^0.27.7"
+    pug-lexer "^5.0.1"
+    pug-parser "^6.0.0"
+    vscode-languageserver "^8.0.0-next.1"
+
+vscode-typescript-languageservice@^0.27.7:
+  version "0.27.7"
+  resolved "https://registry.yarnpkg.com/vscode-typescript-languageservice/-/vscode-typescript-languageservice-0.27.7.tgz#13c209673c24b827e990a0326860acb04609a2d4"
+  integrity sha512-7DAwUy6ZOHyitAvBSqDFrdhPmr9SrOsC9K/h1aDg1CKPZR321XjgeE0lOZlrFKCi7XL/JeTvZubYD1lc321ZOg==
+  dependencies:
+    "@volar/shared" "^0.27.7"
+    upath "^2.0.1"
+    vscode-languageserver "^8.0.0-next.1"
+    vscode-languageserver-textdocument "^1.0.1"
+
+vscode-uri@^2.1.2:
+  version "2.1.2"
+  resolved "https://registry.yarnpkg.com/vscode-uri/-/vscode-uri-2.1.2.tgz#c8d40de93eb57af31f3c715dd650e2ca2c096f1c"
+  integrity sha512-8TEXQxlldWAuIODdukIb+TR5s+9Ds40eSJrw+1iDDA9IFORPjMELarNQE3myz5XIkWWpdprmJjm1/SxMlWOC8A==
+
+vscode-uri@^3.0.2:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/vscode-uri/-/vscode-uri-3.0.2.tgz#ecfd1d066cb8ef4c3a208decdbab9a8c23d055d0"
+  integrity sha512-jkjy6pjU1fxUvI51P+gCsxg1u2n8LSt0W6KrCNQceaziKzff74GoWmjVG46KieVzybO1sttPQmYfrwSHey7GUA==
+
+vscode-vue-languageservice@^0.27.0:
+  version "0.27.7"
+  resolved "https://registry.yarnpkg.com/vscode-vue-languageservice/-/vscode-vue-languageservice-0.27.7.tgz#f0984c84602bfa117ec7ce1e90b37777b6a0c792"
+  integrity sha512-UXFkaPwkw+H32eXLaEyA23BNf4OUUOSffAwLu2/+W8Wi4/X0fr2aSsc2YKO+FNeIKAfIjS0qWDLo51kj1YIeCA==
+  dependencies:
+    "@volar/code-gen" "^0.27.7"
+    "@volar/html2pug" "^0.27.7"
+    "@volar/shared" "^0.27.7"
+    "@volar/source-map" "^0.27.7"
+    "@volar/transforms" "^0.27.7"
+    "@vscode/emmet-helper" "^2.7.0"
+    "@vue/compiler-dom" "^3.2.4"
+    "@vue/compiler-sfc" "^3.2.4"
+    "@vue/reactivity" "^3.2.4"
+    "@vue/shared" "^3.2.4"
+    request-light "^0.5.4"
+    upath "^2.0.1"
+    vscode-css-languageservice "^5.1.4"
+    vscode-html-languageservice "^4.0.7"
+    vscode-json-languageservice "^4.1.5"
+    vscode-languageserver "^8.0.0-next.1"
+    vscode-languageserver-textdocument "^1.0.1"
+    vscode-pug-languageservice "^0.27.7"
+    vscode-typescript-languageservice "^0.27.7"
+
 vue-eslint-parser@^7.10.0:
   version "7.10.0"
   resolved "https://registry.yarnpkg.com/vue-eslint-parser/-/vue-eslint-parser-7.10.0.tgz#ea4e4b10fd10aa35c8a79ac783488d8abcd29be8"
@@ -13956,6 +14450,13 @@ vue-template-es2015-compiler@^1.9.0:
   version "1.9.1"
   resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.9.1.tgz#1ee3bc9a16ecbf5118be334bb15f9c46f82f5825"
 
+vue-tsc@^0.3.0:
+  version "0.3.0"
+  resolved "https://registry.yarnpkg.com/vue-tsc/-/vue-tsc-0.3.0.tgz#3b3872bf4f1d2e4409b57adbd826032e253db406"
+  integrity sha512-zaDRZBxwRIz1XjhNP92FqugG71st6BUMnA2EwPeXrAyzbEYVRz6TezNFceYl3QYqqN8CtaxbqUhaQEDj/ntoCA==
+  dependencies:
+    vscode-vue-languageservice "^0.27.0"
+
 vue@^3.2.0:
   version "3.2.6"
   resolved "https://registry.yarnpkg.com/vue/-/vue-3.2.6.tgz#c71445078751f458648fd8fb3a2da975507d03d2"
@@ -14252,6 +14753,16 @@ windows-release@^3.1.0:
   dependencies:
     execa "^1.0.0"
 
+with@^7.0.0:
+  version "7.0.2"
+  resolved "https://registry.yarnpkg.com/with/-/with-7.0.2.tgz#ccee3ad542d25538a7a7a80aad212b9828495bac"
+  integrity sha512-RNGKj82nUPg3g5ygxkQl0R937xLyho1J24ItRCBTr/m1YnZkzJy1hUiHUJrc/VlsDQzsCnInEGSg3bci0Lmd4w==
+  dependencies:
+    "@babel/parser" "^7.9.6"
+    "@babel/types" "^7.9.6"
+    assert-never "^1.2.1"
+    babel-walk "3.0.0-canary-5"
+
 word-wrap@^1.0.3, word-wrap@^1.2.3, word-wrap@~1.2.3:
   version "1.2.3"
   resolved "https://registry.yarnpkg.com/word-wrap/-/word-wrap-1.2.3.tgz#610636f6b1f703891bd34771ccb17fb93b47079c"