refactor(utils): migrate utils (#5949)

* refactor(utils-v2): migrate utils

* refactor(utils-v2): migrate utils

* refactor(utils-v2): migrate utils

* refactor(utils): remove

* refactor(utils): rename

* refactor(utils): move EVENT_CODE to constants

* refactor: remove generic

docs/.vitepress/vitepress/composables/lock-screen.ts

@@ -5,8 +5,8 @@ import {
   hasClass,
   getStyle,
   removeClass,
-} from '@element-plus/utils/dom'
-import getScrollBarWidth from '@element-plus/utils/scrollbar-width'
+  getScrollBarWidth,
+} from '@element-plus/utils'
 
 export const useLockScreen = () => {
   let scrollBarWidth = 0

package.json

@@ -62,7 +62,6 @@
     "@element-plus/theme-chalk": "workspace:*",
     "@element-plus/tokens": "workspace:*",
     "@element-plus/utils": "workspace:*",
-    "@element-plus/utils-v2": "workspace:*",
     "@popperjs/core": "^2.11.2",
     "@vueuse/core": "^7.6.0",
     "async-validator": "^4.0.7",
@@ -125,6 +124,7 @@
     "sucrase": "3.20.3",
     "ts-jest": "26.5.6",
     "ts-morph": "13.0.3",
+    "type-fest": "^2.11.2",
     "typescript": "4.5.5",
     "vue": "3.2.30",
     "vue-jest": "5.0.0-alpha.10",

packages/components/affix/index.ts

@@ -1,4 +1,4 @@
-import { withInstall } from '@element-plus/utils-v2'
+import { withInstall } from '@element-plus/utils'
 
 import Affix from './src/affix.vue'
 

packages/components/affix/src/affix.ts

@@ -1,4 +1,4 @@
-import { buildProps, definePropType } from '@element-plus/utils-v2'
+import { buildProps, definePropType } from '@element-plus/utils'
 import type { ExtractPropTypes } from 'vue'
 import type { ZIndexProperty } from 'csstype'
 import type Affix from './affix.vue'

packages/components/affix/src/affix.vue

@@ -15,7 +15,7 @@ import {
   watch,
 } from 'vue'
 import { useEventListener, useResizeObserver } from '@vueuse/core'
-import { getScrollContainer } from '@element-plus/utils/dom'
+import { getScrollContainer } from '@element-plus/utils'
 import { useNamespace } from '@element-plus/hooks'
 import { affixEmits, affixProps } from './affix'
 

packages/components/alert/__tests__/alert.spec.ts

@@ -1,5 +1,5 @@
 import { mount } from '@vue/test-utils'
-import { TypeComponentsMap } from '@element-plus/utils-v2'
+import { TypeComponentsMap } from '@element-plus/utils'
 import Alert from '../src/alert.vue'
 
 const AXIOM = 'Rem is the best girl'

packages/components/alert/index.ts

@@ -1,4 +1,4 @@
-import { withInstall } from '@element-plus/utils-v2'
+import { withInstall } from '@element-plus/utils'
 
 import Alert from './src/alert.vue'
 

packages/components/alert/src/alert.ts

@@ -1,4 +1,4 @@
-import { TypeComponentsMap, buildProps, keyOf } from '@element-plus/utils-v2'
+import { TypeComponentsMap, buildProps, keysOf } from '@element-plus/utils'
 import type { ExtractPropTypes } from 'vue'
 import type Alert from './alert.vue'
 
@@ -15,7 +15,7 @@ export const alertProps = buildProps({
   },
   type: {
     type: String,
-    values: keyOf(TypeComponentsMap),
+    values: keysOf(TypeComponentsMap),
     default: 'info',
   },
   closable: {

packages/components/alert/src/alert.vue

@@ -42,7 +42,7 @@
 <script lang="ts">
 import { defineComponent, computed, ref } from 'vue'
 import { ElIcon } from '@element-plus/components/icon'
-import { TypeComponents, TypeComponentsMap } from '@element-plus/utils-v2'
+import { TypeComponents, TypeComponentsMap } from '@element-plus/utils'
 import { useNamespace } from '@element-plus/hooks'
 import { alertProps, alertEmits } from './alert'
 

packages/components/autocomplete/index.ts

@@ -1,6 +1,6 @@
 import Autocomplete from './src/index.vue'
 import type { App } from 'vue'
-import type { SFCWithInstall } from '@element-plus/utils-v2'
+import type { SFCWithInstall } from '@element-plus/utils'
 
 Autocomplete.install = (app: App): void => {
   app.component(Autocomplete.name, Autocomplete)

packages/components/autocomplete/src/index.vue

@@ -94,7 +94,7 @@ import { NOOP } from '@vue/shared'
 import { debounce } from 'lodash-unified'
 import { useAttrs, useNamespace } from '@element-plus/hooks'
 import { ClickOutside } from '@element-plus/directives'
-import { generateId, isArray, throwError } from '@element-plus/utils-v2'
+import { generateId, isArray, throwError } from '@element-plus/utils'
 import { UPDATE_MODEL_EVENT } from '@element-plus/constants'
 import ElInput from '@element-plus/components/input'
 import ElScrollbar from '@element-plus/components/scrollbar'

packages/components/avatar/index.ts

@@ -1,4 +1,4 @@
-import { withInstall } from '@element-plus/utils-v2'
+import { withInstall } from '@element-plus/utils'
 import Avatar from './src/avatar.vue'
 
 export const ElAvatar = withInstall(Avatar)

packages/components/avatar/src/avatar.ts

@@ -1,8 +1,4 @@
-import {
-  buildProps,
-  definePropType,
-  iconPropType,
-} from '@element-plus/utils-v2'
+import { buildProps, definePropType, iconPropType } from '@element-plus/utils'
 import type { ExtractPropTypes } from 'vue'
 import type { ObjectFitProperty } from 'csstype'
 import type Avatar from './avatar.vue'

packages/components/avatar/src/avatar.vue

@@ -19,7 +19,7 @@
 import { defineComponent, computed, ref, watch } from 'vue'
 import { ElIcon } from '@element-plus/components/icon'
 import { useNamespace } from '@element-plus/hooks'
-import { isNumber, isString, addUnit } from '@element-plus/utils-v2'
+import { isNumber, isString, addUnit } from '@element-plus/utils'
 import { avatarEmits, avatarProps } from './avatar'
 
 import type { CSSProperties } from 'vue'

packages/components/backtop/index.ts

@@ -1,4 +1,4 @@
-import { withInstall } from '@element-plus/utils-v2'
+import { withInstall } from '@element-plus/utils'
 
 import Backtop from './src/backtop.vue'
 

packages/components/backtop/src/backtop.vue

@@ -20,8 +20,7 @@
 import { defineComponent, ref, computed, onMounted, shallowRef } from 'vue'
 import { useEventListener, useThrottleFn } from '@vueuse/core'
 import { ElIcon } from '@element-plus/components/icon'
-import { easeInOutCubic } from '@element-plus/utils/animation'
-import { throwError } from '@element-plus/utils-v2'
+import { easeInOutCubic, throwError } from '@element-plus/utils'
 import { CaretTop } from '@element-plus/icons-vue'
 import { useNamespace } from '@element-plus/hooks'
 

packages/components/badge/index.ts

@@ -1,4 +1,4 @@
-import { withInstall } from '@element-plus/utils-v2'
+import { withInstall } from '@element-plus/utils'
 
 import Badge from './src/badge.vue'
 

packages/components/badge/src/badge.ts

@@ -1,4 +1,4 @@
-import { buildProps } from '@element-plus/utils-v2'
+import { buildProps } from '@element-plus/utils'
 import type { ExtractPropTypes } from 'vue'
 import type Badge from './badge.vue'
 

packages/components/breadcrumb/index.ts

@@ -1,4 +1,4 @@
-import { withInstall, withNoopInstall } from '@element-plus/utils-v2'
+import { withInstall, withNoopInstall } from '@element-plus/utils'
 
 import Breadcrumb from './src/breadcrumb.vue'
 import BreadcrumbItem from './src/breadcrumb-item.vue'

packages/components/breadcrumb/src/breadcrumb-item.ts

@@ -1,4 +1,4 @@
-import { buildProps, definePropType } from '@element-plus/utils-v2'
+import { buildProps, definePropType } from '@element-plus/utils'
 import type { ExtractPropTypes } from 'vue'
 import type { RouteLocationRaw } from 'vue-router'
 import type BreadcrumbItem from './breadcrumb-item.vue'

packages/components/breadcrumb/src/breadcrumb.ts

@@ -1,4 +1,4 @@
-import { buildProps, iconPropType } from '@element-plus/utils-v2'
+import { buildProps, iconPropType } from '@element-plus/utils'
 import type { ExtractPropTypes } from 'vue'
 import type Breadcrumb from './breadcrumb.vue'
 

packages/components/button/index.ts

@@ -1,4 +1,4 @@
-import { withInstall, withNoopInstall } from '@element-plus/utils-v2'
+import { withInstall, withNoopInstall } from '@element-plus/utils'
 import Button from './src/button.vue'
 import ButtonGroup from './src/button-group.vue'
 

packages/components/button/src/button.ts

@@ -1,5 +1,5 @@
 import { useSizeProp } from '@element-plus/hooks'
-import { buildProps, iconPropType } from '@element-plus/utils-v2'
+import { buildProps, iconPropType } from '@element-plus/utils'
 import { Loading } from '@element-plus/icons-vue'
 import type { ExtractPropTypes } from 'vue'
 import type button from './button.vue'

packages/components/calendar/index.ts

@@ -1,4 +1,4 @@
-import { withInstall } from '@element-plus/utils-v2'
+import { withInstall } from '@element-plus/utils'
 import Calendar from './src/calendar.vue'
 
 export const ElCalendar = withInstall(Calendar)

packages/components/calendar/src/calendar.ts

@@ -1,4 +1,4 @@
-import { buildProps, definePropType } from '@element-plus/utils-v2'
+import { buildProps, definePropType } from '@element-plus/utils'
 import { UPDATE_MODEL_EVENT } from '@element-plus/constants'
 import type { ExtractPropTypes } from 'vue'
 

packages/components/calendar/src/calendar.vue

@@ -48,7 +48,7 @@ import { ref, computed, defineComponent } from 'vue'
 import dayjs from 'dayjs'
 import { ElButton, ElButtonGroup } from '@element-plus/components/button'
 import { useLocale, useNamespace } from '@element-plus/hooks'
-import { debugWarn } from '@element-plus/utils-v2'
+import { debugWarn } from '@element-plus/utils'
 import DateTable from './date-table.vue'
 import { calendarProps, calendarEmits } from './calendar'
 

packages/components/calendar/src/date-table.ts

@@ -1,4 +1,4 @@
-import { buildProps, definePropType, isObject } from '@element-plus/utils-v2'
+import { buildProps, definePropType, isObject } from '@element-plus/utils'
 import type { ExtractPropTypes } from 'vue'
 import type { Dayjs } from 'dayjs'
 

packages/components/card/index.ts

@@ -1,4 +1,4 @@
-import { withInstall } from '@element-plus/utils-v2'
+import { withInstall } from '@element-plus/utils'
 
 import Card from './src/card.vue'
 

packages/components/card/src/card.ts

@@ -1,4 +1,4 @@
-import { buildProps, definePropType } from '@element-plus/utils-v2'
+import { buildProps, definePropType } from '@element-plus/utils'
 import type Card from './card.vue'
 import type { ExtractPropTypes, StyleValue } from 'vue'
 

packages/components/carousel/index.ts

@@ -1,4 +1,4 @@
-import { withInstall, withNoopInstall } from '@element-plus/utils-v2'
+import { withInstall, withNoopInstall } from '@element-plus/utils'
 import Carousel from './src/main.vue'
 import CarouselItem from './src/item.vue'
 

packages/components/carousel/src/item.vue

@@ -31,8 +31,7 @@ import {
   getCurrentInstance,
   onUnmounted,
 } from 'vue'
-import { autoprefixer } from '@element-plus/utils/util'
-import { debugWarn } from '@element-plus/utils-v2'
+import { debugWarn } from '@element-plus/utils'
 import { useNamespace } from '@element-plus/hooks'
 import type { CSSProperties } from 'vue'
 import type { InjectCarouselScope, ICarouselItemProps } from './carousel'
@@ -80,7 +79,7 @@ export default defineComponent({
       const style: CSSProperties = {
         transform: value,
       }
-      return autoprefixer(style)
+      return style
     })
 
     // methods

packages/components/carousel/src/main.vue

@@ -78,12 +78,12 @@ import { throttle } from 'lodash-unified'
 import {
   addResizeListener,
   removeResizeListener,
-} from '@element-plus/utils/resize-event'
+  debugWarn,
+} from '@element-plus/utils'
 import { ElIcon } from '@element-plus/components/icon'
 import { ArrowLeft, ArrowRight } from '@element-plus/icons-vue'
 import { useNamespace } from '@element-plus/hooks'
 
-import { debugWarn } from '@element-plus/utils-v2'
 import type {
   ICarouselProps,
   CarouselItem,

packages/components/cascader-panel/index.ts

@@ -1,6 +1,6 @@
 import CascaderPanel from './src/index.vue'
 import type { App } from 'vue'
-import type { SFCWithInstall } from '@element-plus/utils-v2'
+import type { SFCWithInstall } from '@element-plus/utils'
 
 CascaderPanel.install = (app: App): void => {
   app.component(CascaderPanel.name, CascaderPanel)

packages/components/cascader-panel/src/index.vue

@@ -25,13 +25,20 @@ import {
   ref,
   watch,
 } from 'vue'
-import { isEqual } from 'lodash-unified'
+import { isEqual, flattenDeep } from 'lodash-unified'
 import { isClient } from '@vueuse/core'
-import { EVENT_CODE, focusNode, getSibling } from '@element-plus/utils/aria'
-import { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/constants'
-import scrollIntoView from '@element-plus/utils/scroll-into-view'
-import { arrayFlat, coerceTruthyValueToArray } from '@element-plus/utils/util'
-import { isEmpty, unique } from '@element-plus/utils-v2'
+import {
+  focusNode,
+  getSibling,
+  isEmpty,
+  unique,
+  castArray,
+} from '@element-plus/utils'
+import {
+  EVENT_CODE,
+  UPDATE_MODEL_EVENT,
+  CHANGE_EVENT,
+} from '@element-plus/constants'
 
 import ElCascaderMenu from './menu.vue'
 import Store from './store'
@@ -41,7 +48,7 @@ import { checkNode, getMenuIndex, sortByOriginalOrder } from './utils'
 import { CASCADER_PANEL_INJECTION_KEY } from './types'
 
 import type { PropType } from 'vue'
-import type { Nullable } from '@element-plus/utils/types'
+import type { Nullable } from '@element-plus/utils'
 import type {
   CascaderValue,
   CascaderNodeValue,
@@ -210,7 +217,7 @@ export default defineComponent({
 
       if (lazy && !loaded) {
         const values: CascaderNodeValue[] = unique(
-          arrayFlat(coerceTruthyValueToArray(modelValue))
+          flattenDeep(castArray(modelValue))
         )
         const nodes = values
           .map((val) => store?.getNodeByValue(val))
@@ -224,9 +231,7 @@ export default defineComponent({
           syncCheckedValue(true, forced)
         }
       } else {
-        const values = multiple
-          ? coerceTruthyValueToArray(modelValue)
-          : [modelValue]
+        const values = multiple ? castArray(modelValue) : [modelValue]
         const nodes = unique(
           values.map((val) => store?.getNodeByValue(val, leafOnly))
         ) as Node[]
@@ -267,11 +272,13 @@ export default defineComponent({
       menuList.value.forEach((menu) => {
         const menuElement = menu?.$el
         if (menuElement) {
-          const container = menuElement.querySelector('.el-scrollbar__wrap')
+          const container = (menuElement as HTMLElement).querySelector(
+            '.el-scrollbar__wrap'
+          )
           const activeNode =
             menuElement.querySelector('.el-cascader-node.is-active') ||
             menuElement.querySelector('.el-cascader-node.in-active-path')
-          scrollIntoView(container, activeNode)
+          container?.scrollIntoView(activeNode)
         }
       })
     }

packages/components/cascader-panel/src/menu.vue

@@ -37,7 +37,7 @@
 import { computed, defineComponent, getCurrentInstance, inject, ref } from 'vue'
 import ElScrollbar from '@element-plus/components/scrollbar'
 import { useLocale } from '@element-plus/hooks'
-import { generateId } from '@element-plus/utils-v2'
+import { generateId } from '@element-plus/utils'
 import { Loading } from '@element-plus/icons-vue'
 import ElIcon from '@element-plus/components/icon'
 import ElCascaderNode from './node.vue'
@@ -45,7 +45,7 @@ import { CASCADER_PANEL_INJECTION_KEY } from './types'
 
 import type { default as CascaderNode } from './node'
 import type { PropType } from 'vue'
-import type { Nullable } from '@element-plus/utils/types'
+import type { Nullable } from '@element-plus/utils'
 
 export default defineComponent({
   name: 'ElCascaderMenu',

packages/components/cascader-panel/src/node.ts

@@ -1,5 +1,5 @@
 import { isFunction } from '@vue/shared'
-import { capitalize, isUndefined, isEmpty } from '@element-plus/utils-v2'
+import { capitalize, isUndefined, isEmpty } from '@element-plus/utils'
 import type { VNode } from 'vue'
 
 export type CascaderNodeValue = string | number

packages/components/cascader-panel/src/store.ts

@@ -1,7 +1,7 @@
 import { isEqual } from 'lodash-unified'
 import Node from './node'
 
-import type { Nullable } from '@element-plus/utils/types'
+import type { Nullable } from '@element-plus/utils'
 import type {
   CascaderNodeValue,
   CascaderNodePathValue,

packages/components/cascader-panel/src/types.ts

@@ -1,5 +1,5 @@
 import type { VNode, InjectionKey } from 'vue'
-import type { Nullable } from '@element-plus/utils/types'
+import type { Nullable } from '@element-plus/utils'
 import type { default as CascaderNode } from './node'
 
 export type { CascaderNode }

packages/components/cascader-panel/src/utils.ts

@@ -1,4 +1,4 @@
-import { isLeaf } from '@element-plus/utils/aria'
+import { isLeaf } from '@element-plus/utils'
 import type { default as CascaderNode } from './node'
 
 export const getMenuIndex = (el: HTMLElement) => {

packages/components/cascader/__tests__/cascader.spec.ts

@@ -1,6 +1,6 @@
 import { nextTick } from 'vue'
 import { mount } from '@vue/test-utils'
-import { EVENT_CODE } from '@element-plus/utils/aria'
+import { EVENT_CODE } from '@element-plus/constants'
 import { triggerEvent } from '@element-plus/test-utils'
 import { ArrowDown, Check, CircleClose } from '@element-plus/icons-vue'
 import { POPPER_CONTAINER_SELECTOR } from '@element-plus/hooks'

packages/components/cascader/index.ts

@@ -1,6 +1,6 @@
 import Cascader from './src/index.vue'
 import type { App } from 'vue'
-import type { SFCWithInstall } from '@element-plus/utils-v2'
+import type { SFCWithInstall } from '@element-plus/utils'
 
 Cascader.install = (app: App): void => {
   app.component(Cascader.name, Cascader)

packages/components/cascader/src/index.vue

@@ -184,13 +184,19 @@ import { elFormKey, elFormItemKey } from '@element-plus/tokens'
 import { ClickOutside as Clickoutside } from '@element-plus/directives'
 import { useLocale, useSize } from '@element-plus/hooks'
 
-import { EVENT_CODE, focusNode, getSibling } from '@element-plus/utils/aria'
-import { UPDATE_MODEL_EVENT, CHANGE_EVENT } from '@element-plus/constants'
 import {
+  focusNode,
+  getSibling,
   addResizeListener,
   removeResizeListener,
-} from '@element-plus/utils/resize-event'
-import { isValidComponentSize, isKorean } from '@element-plus/utils-v2'
+  isValidComponentSize,
+  isKorean,
+} from '@element-plus/utils'
+import {
+  EVENT_CODE,
+  UPDATE_MODEL_EVENT,
+  CHANGE_EVENT,
+} from '@element-plus/constants'
 import { CircleClose, Check, ArrowDown } from '@element-plus/icons-vue'
 
 import type { Options } from '@element-plus/components/popper'

packages/components/check-tag/index.ts

@@ -1,4 +1,4 @@
-import { withInstall } from '@element-plus/utils-v2'
+import { withInstall } from '@element-plus/utils'
 import CheckTag from './src/check-tag.vue'
 
 export const ElCheckTag = withInstall(CheckTag)

packages/components/check-tag/src/check-tag.ts

@@ -1,4 +1,4 @@
-import { isBoolean, buildProps } from '@element-plus/utils-v2'
+import { isBoolean, buildProps } from '@element-plus/utils'
 import type CheckTag from './check-tag.vue'
 import type { ExtractPropTypes } from 'vue'
 

packages/components/checkbox/index.ts

@@ -1,4 +1,4 @@
-import { withInstall, withNoopInstall } from '@element-plus/utils-v2'
+import { withInstall, withNoopInstall } from '@element-plus/utils'
 
 import Checkbox from './src/checkbox.vue'
 import CheckboxButton from './src/checkbox-button.vue'

packages/components/checkbox/src/checkbox-group.vue

@@ -10,7 +10,7 @@ import {
   renderSlot,
 } from 'vue'
 import { UPDATE_MODEL_EVENT } from '@element-plus/constants'
-import { isValidComponentSize } from '@element-plus/utils-v2'
+import { isValidComponentSize } from '@element-plus/utils'
 import { useSize, useNamespace } from '@element-plus/hooks'
 import { useCheckboxGroup } from './useCheckbox'
 

packages/components/checkbox/src/checkbox.type.ts

@@ -1,6 +1,5 @@
 import type { ComputedRef } from 'vue'
 import type { ComponentSize } from '@element-plus/constants'
-import type { AnyFunction } from '@element-plus/utils/types'
 export interface ICheckboxGroupInstance {
   name?: string
   modelValue?: ComputedRef
@@ -11,5 +10,5 @@ export interface ICheckboxGroupInstance {
   fill?: ComputedRef<string>
   textColor?: ComputedRef<string>
   checkboxGroupSize?: ComputedRef<ComponentSize>
-  changeEvent?: AnyFunction<any>
+  changeEvent?: (...args: any[]) => any
 }

packages/components/checkbox/src/checkbox.vue

@@ -62,7 +62,7 @@
 <script lang="ts">
 import { defineComponent } from 'vue'
 import { UPDATE_MODEL_EVENT } from '@element-plus/constants'
-import { isValidComponentSize } from '@element-plus/utils-v2'
+import { isValidComponentSize } from '@element-plus/utils'
 import { useNamespace } from '@element-plus/hooks'
 import { useCheckbox } from './useCheckbox'
 

packages/components/checkbox/src/useCheckbox.ts

@@ -6,7 +6,6 @@ import { elFormKey, elFormItemKey } from '@element-plus/tokens'
 import { useSize } from '@element-plus/hooks'
 import type { ExtractPropTypes } from 'vue'
 import type { ElFormContext, ElFormItemContext } from '@element-plus/tokens'
-import type { PartialReturnType } from '@element-plus/utils/types'
 import type { ICheckboxGroupInstance } from './checkbox.type'
 
 export const useCheckboxProps = {
@@ -90,7 +89,7 @@ const useModel = (props: IUseCheckboxProps) => {
 
 const useCheckboxStatus = (
   props: IUseCheckboxProps,
-  { model }: PartialReturnType<typeof useModel>
+  { model }: Partial<ReturnType<typeof useModel>>
 ) => {
   const { isGroup, checkboxGroup } = useCheckboxGroup()
   const focus = ref(false)
@@ -127,8 +126,8 @@ const useDisabled = (
   {
     model,
     isChecked,
-  }: PartialReturnType<typeof useModel> &
-    PartialReturnType<typeof useCheckboxStatus>
+  }: Partial<ReturnType<typeof useModel>> &
+    Partial<ReturnType<typeof useCheckboxStatus>>
 ) => {
   const { elForm, isGroup, checkboxGroup } = useCheckboxGroup()
   const isLimitDisabled = computed(() => {
@@ -156,7 +155,7 @@ const useDisabled = (
 
 const setStoreValue = (
   props: IUseCheckboxProps,
-  { model }: PartialReturnType<typeof useModel>
+  { model }: Partial<ReturnType<typeof useModel>>
 ) => {
   function addToStore() {
     if (Array.isArray(model.value) && !model.value.includes(props.label)) {
@@ -170,7 +169,7 @@ const setStoreValue = (
 
 const useEvent = (
   props: IUseCheckboxProps,
-  { isLimitExceeded }: PartialReturnType<typeof useModel>
+  { isLimitExceeded }: Partial<ReturnType<typeof useModel>>
 ) => {
   const { elFormItem } = useCheckboxGroup()
   const { emit } = getCurrentInstance()

packages/components/col/index.ts

@@ -1,4 +1,4 @@
-import { withInstall } from '@element-plus/utils-v2'
+import { withInstall } from '@element-plus/utils'
 
 import Col from './src/col'
 

packages/components/col/src/col.ts

@@ -1,5 +1,5 @@
 import { defineComponent, computed, inject, h, renderSlot } from 'vue'
-import { buildProps, definePropType, mutable } from '@element-plus/utils-v2'
+import { buildProps, definePropType, mutable } from '@element-plus/utils'
 import { useNamespace } from '@element-plus/hooks'
 import type { ExtractPropTypes, CSSProperties } from 'vue'
 

packages/components/collapse-transition/index.ts

@@ -1,6 +1,6 @@
 import CollapseTransition from './src/collapse-transition.vue'
 import type { App } from 'vue'
-import type { SFCWithInstall } from '@element-plus/utils-v2'
+import type { SFCWithInstall } from '@element-plus/utils'
 
 CollapseTransition.install = (app: App): void => {
   app.component(CollapseTransition.name, CollapseTransition)

packages/components/collapse/index.ts

@@ -1,4 +1,4 @@
-import { withInstall, withNoopInstall } from '@element-plus/utils-v2'
+import { withInstall, withNoopInstall } from '@element-plus/utils'
 
 import Collapse from './src/collapse.vue'
 import CollapseItem from './src/collapse-item.vue'

packages/components/collapse/src/collapse-item.vue

@@ -50,7 +50,7 @@
 </template>
 <script lang="ts">
 import { defineComponent, inject, computed, ref } from 'vue'
-import { generateId } from '@element-plus/utils-v2'
+import { generateId } from '@element-plus/utils'
 import ElCollapseTransition from '@element-plus/components/collapse-transition'
 import ElIcon from '@element-plus/components/icon'
 import { ArrowRight } from '@element-plus/icons-vue'

packages/components/color-picker/__tests__/color-picker.spec.ts

@@ -3,7 +3,7 @@ import { mount } from '@vue/test-utils'
 import ColorPicker from '../src/index.vue'
 import type { ComponentPublicInstance } from 'vue'
 
-import type { Nullable } from '@element-plus/utils/types'
+import type { Nullable } from '@element-plus/utils'
 
 jest.mock('lodash-unified', () => {
   return {

packages/components/color-picker/index.ts

@@ -1,7 +1,7 @@
 import ColorPicker from './src/index.vue'
 
 import type { App } from 'vue'
-import type { SFCWithInstall } from '@element-plus/utils-v2'
+import type { SFCWithInstall } from '@element-plus/utils'
 
 ColorPicker.install = (app: App): void => {
   app.component(ColorPicker.name, ColorPicker)

packages/components/color-picker/src/color.ts

@@ -1,4 +1,4 @@
-import { hasOwn } from '@element-plus/utils-v2'
+import { hasOwn } from '@element-plus/utils'
 
 const hsv2hsl = function (hue: number, sat: number, val: number) {
   return [

packages/components/color-picker/src/components/alpha-slider.vue

@@ -28,11 +28,11 @@ import {
   getCurrentInstance,
   shallowRef,
 } from 'vue'
-import { getClientXY } from '@element-plus/utils/dom'
+import { getClientXY } from '@element-plus/utils'
 import draggable from '../draggable'
 
 import type { PropType } from 'vue'
-import type { Nullable } from '@element-plus/utils/types'
+import type { Nullable } from '@element-plus/utils'
 import type Color from '../color'
 
 export default defineComponent({

packages/components/color-picker/src/components/hue-slider.vue

@@ -21,7 +21,7 @@ import {
   getCurrentInstance,
   defineComponent,
 } from 'vue'
-import { getClientXY } from '@element-plus/utils/dom'
+import { getClientXY } from '@element-plus/utils'
 import draggable from '../draggable'
 
 import type { PropType } from 'vue'

packages/components/color-picker/src/components/sv-panel.vue

@@ -28,7 +28,7 @@ import {
   getCurrentInstance,
   onMounted,
 } from 'vue'
-import { getClientXY } from '@element-plus/utils/dom'
+import { getClientXY } from '@element-plus/utils'
 import draggable from '../draggable'
 
 import type { PropType } from 'vue'

packages/components/color-picker/src/draggable.ts

@@ -1,5 +1,5 @@
 import { isClient } from '@vueuse/core'
-import { on, off } from '@element-plus/utils/dom'
+import { on, off } from '@element-plus/utils'
 
 let isDragging = false
 

packages/components/color-picker/src/index.vue

@@ -113,7 +113,7 @@ import { useLocale, useSize, useNamespace } from '@element-plus/hooks'
 import ElTooltip from '@element-plus/components/tooltip'
 import ElInput from '@element-plus/components/input'
 import { UPDATE_MODEL_EVENT } from '@element-plus/constants'
-import { isValidComponentSize } from '@element-plus/utils-v2'
+import { isValidComponentSize } from '@element-plus/utils'
 import { Close, ArrowDown } from '@element-plus/icons-vue'
 import AlphaSlider from './components/alpha-slider.vue'
 import HueSlider from './components/hue-slider.vue'

packages/components/config-provider/index.ts

@@ -1,4 +1,4 @@
-import { withInstall } from '@element-plus/utils-v2'
+import { withInstall } from '@element-plus/utils'
 
 import ConfigProvider from './src/config-provider'
 

packages/components/config-provider/src/config-provider.ts

@@ -1,5 +1,5 @@
 import { defineComponent, renderSlot, watch } from 'vue'
-import { buildProps, definePropType } from '@element-plus/utils-v2'
+import { buildProps, definePropType } from '@element-plus/utils'
 import { provideGlobalConfig } from '@element-plus/hooks'
 import type { Language } from '@element-plus/locale'
 import type { ButtonConfigContext } from '@element-plus/components/button'

packages/components/container/index.ts

@@ -1,4 +1,4 @@
-import { withInstall, withNoopInstall } from '@element-plus/utils-v2'
+import { withInstall, withNoopInstall } from '@element-plus/utils'
 
 import Container from './src/container.vue'
 import Aside from './src/aside.vue'

packages/components/date-picker/__tests__/date-picker.spec.ts

@@ -8,7 +8,7 @@ import Input from '@element-plus/components/input'
 import zhCn from '@element-plus/locale/lang/zh-cn'
 import enUs from '@element-plus/locale/lang/en'
 import 'dayjs/locale/zh-cn'
-import { EVENT_CODE } from '@element-plus/utils/aria'
+import { EVENT_CODE } from '@element-plus/constants'
 import DatePicker from '../src/date-picker'
 
 const _mount = (template: string, data = () => ({}), otherObj?) =>

packages/components/date-picker/index.ts

@@ -1,7 +1,7 @@
 import DatePicker from './src/date-picker'
 
 import type { App } from 'vue'
-import type { SFCWithInstall } from '@element-plus/utils-v2'
+import type { SFCWithInstall } from '@element-plus/utils'
 
 const _DatePicker = DatePicker as SFCWithInstall<typeof DatePicker>
 

packages/components/date-picker/src/date-picker-com/basic-cell-render.ts

@@ -1,5 +1,5 @@
 import { h, defineComponent, inject } from 'vue'
-import { buildProps, definePropType } from '@element-plus/utils-v2'
+import { buildProps, definePropType } from '@element-plus/utils'
 import { ROOT_PICKER_INJECTION_KEY } from '../date-picker.type'
 import type { DateCell } from '../date-picker.type'
 

packages/components/date-picker/src/date-picker-com/basic-date-table.vue

@@ -36,7 +36,7 @@
 import { defineComponent, computed, ref } from 'vue'
 import dayjs from 'dayjs'
 import { useLocale } from '@element-plus/hooks'
-import { coerceTruthyValueToArray } from '@element-plus/utils/util'
+import { castArray } from '@element-plus/utils'
 import ElDatePickerCell from './basic-cell-render'
 import type { PropType } from 'vue'
 
@@ -130,9 +130,7 @@ export default defineComponent({
       let count = 1
 
       const selectedDate: Dayjs[] =
-        props.selectionMode === 'dates'
-          ? coerceTruthyValueToArray(props.parsedValue)
-          : []
+        props.selectionMode === 'dates' ? castArray(props.parsedValue) : []
 
       const calNow = dayjs().locale(lang.value).startOf('day')
 
@@ -389,10 +387,10 @@ export default defineComponent({
         })
       } else if (props.selectionMode === 'dates') {
         const newValue = cell.selected
-          ? coerceTruthyValueToArray(props.parsedValue).filter(
+          ? castArray(props.parsedValue).filter(
               (_) => _.valueOf() !== newDate.valueOf()
             )
-          : coerceTruthyValueToArray(props.parsedValue).concat([newDate])
+          : castArray(props.parsedValue).concat([newDate])
         ctx.emit('pick', newValue)
       }
     }

packages/components/date-picker/src/date-picker-com/basic-month-table.vue

@@ -23,8 +23,7 @@ import { defineComponent, computed, ref } from 'vue'
 import dayjs from 'dayjs'
 import { useLocale } from '@element-plus/hooks'
 import { rangeArr } from '@element-plus/components/time-picker'
-import { hasClass } from '@element-plus/utils/dom'
-import { coerceTruthyValueToArray } from '@element-plus/utils/util'
+import { hasClass, castArray } from '@element-plus/utils'
 
 import type { PropType } from 'vue'
 import type { Dayjs } from 'dayjs'
@@ -150,7 +149,7 @@ export default defineComponent({
         ? datesInMonth(year, month, lang.value).every(props.disabledDate)
         : false
       style.current =
-        coerceTruthyValueToArray(props.parsedValue).findIndex(
+        castArray(props.parsedValue).findIndex(
           (date) => date.year() === year && date.month() === month
         ) >= 0
       style.today = today.getFullYear() === year && today.getMonth() === month

packages/components/date-picker/src/date-picker-com/basic-year-table.vue

@@ -48,8 +48,7 @@ import { defineComponent, computed } from 'vue'
 import dayjs from 'dayjs'
 import { useLocale } from '@element-plus/hooks'
 import { rangeArr } from '@element-plus/components/time-picker'
-import { hasClass } from '@element-plus/utils/dom'
-import { coerceTruthyValueToArray } from '@element-plus/utils/util'
+import { hasClass, castArray } from '@element-plus/utils'
 
 import type { PropType } from 'vue'
 import type { Dayjs } from 'dayjs'
@@ -90,9 +89,7 @@ export default defineComponent({
         : false
 
       style.current =
-        coerceTruthyValueToArray(props.parsedValue).findIndex(
-          (_) => _.year() === year
-        ) >= 0
+        castArray(props.parsedValue).findIndex((_) => _.year() === year) >= 0
 
       style.today = today.year() === year
 

packages/components/date-picker/src/date-picker-com/panel-date-pick.vue

@@ -174,8 +174,8 @@ import {
   TimePickPanel,
 } from '@element-plus/components/time-picker'
 import { ElIcon } from '@element-plus/components/icon'
-import { EVENT_CODE } from '@element-plus/utils/aria'
-import { isValidDatePickType } from '@element-plus/utils-v2'
+import { isValidDatePickType } from '@element-plus/utils'
+import { EVENT_CODE } from '@element-plus/constants'
 import {
   DArrowLeft,
   ArrowLeft,

packages/components/date-picker/src/date-picker-com/panel-date-range.vue

@@ -245,7 +245,7 @@ import {
   TimePickPanel,
 } from '@element-plus/components/time-picker'
 import ElIcon from '@element-plus/components/icon'
-import { isValidDatePickType } from '@element-plus/utils-v2'
+import { isValidDatePickType } from '@element-plus/utils'
 import {
   DArrowLeft,
   ArrowLeft,

packages/components/descriptions/index.ts

@@ -1,4 +1,4 @@
-import { withInstall, withNoopInstall } from '@element-plus/utils-v2'
+import { withInstall, withNoopInstall } from '@element-plus/utils'
 
 import Descriptions from './src/index.vue'
 import DescriptionsItem from './src/description-item'

packages/components/descriptions/src/descriptions-cell.ts

@@ -1,5 +1,5 @@
 import { defineComponent, h, inject } from 'vue'
-import { addUnit, getNormalizedProps } from '@element-plus/utils-v2'
+import { addUnit, getNormalizedProps } from '@element-plus/utils'
 import { useNamespace } from '@element-plus/hooks'
 import { elDescriptionsKey } from './token'
 

packages/components/descriptions/src/index.vue

@@ -26,7 +26,7 @@
 
 <script lang="ts">
 import { computed, defineComponent, provide } from 'vue'
-import { isValidComponentSize } from '@element-plus/utils-v2'
+import { isValidComponentSize } from '@element-plus/utils'
 import { useSize, useNamespace } from '@element-plus/hooks'
 import DescriptionsRow from './descriptions-row.vue'
 import { elDescriptionsKey } from './token'

packages/components/dialog/index.ts

@@ -1,4 +1,4 @@
-import { withInstall } from '@element-plus/utils-v2'
+import { withInstall } from '@element-plus/utils'
 import Dialog from './src/dialog.vue'
 
 export const ElDialog = withInstall(Dialog)

packages/components/dialog/src/dialog.ts

@@ -1,8 +1,4 @@
-import {
-  buildProps,
-  definePropType,
-  iconPropType,
-} from '@element-plus/utils-v2'
+import { buildProps, definePropType, iconPropType } from '@element-plus/utils'
 import { UPDATE_MODEL_EVENT } from '@element-plus/constants'
 import type { ExtractPropTypes } from 'vue'
 

packages/components/dialog/src/dialog.vue

@@ -73,7 +73,7 @@ import { computed, defineComponent, ref } from 'vue'
 import { TrapFocus } from '@element-plus/directives'
 import { ElOverlay } from '@element-plus/components/overlay'
 import { ElIcon } from '@element-plus/components/icon'
-import { CloseComponents } from '@element-plus/utils-v2'
+import { CloseComponents } from '@element-plus/utils'
 import { useNamespace, useDraggable, useSameTarget } from '@element-plus/hooks'
 import { dialogProps, dialogEmits } from './dialog'
 import { useDialog } from './use-dialog'

packages/components/dialog/src/use-dialog.ts

@@ -8,7 +8,7 @@ import {
   useZIndex,
 } from '@element-plus/hooks'
 import { UPDATE_MODEL_EVENT } from '@element-plus/constants'
-import { isNumber } from '@element-plus/utils-v2'
+import { isNumber } from '@element-plus/utils'
 
 import type { CSSProperties, Ref, SetupContext } from 'vue'
 import type { DialogEmits, DialogProps } from './dialog'

packages/components/divider/index.ts

@@ -1,4 +1,4 @@
-import { withInstall } from '@element-plus/utils-v2'
+import { withInstall } from '@element-plus/utils'
 
 import Divider from './src/divider.vue'
 

packages/components/divider/src/divider.ts

@@ -1,4 +1,4 @@
-import { buildProps, definePropType } from '@element-plus/utils-v2'
+import { buildProps, definePropType } from '@element-plus/utils'
 import type { ExtractPropTypes } from 'vue'
 import type Divider from './divider.vue'
 

packages/components/drawer/index.ts

@@ -1,4 +1,4 @@
-import { withInstall } from '@element-plus/utils-v2'
+import { withInstall } from '@element-plus/utils'
 import Drawer from './src/drawer.vue'
 
 export const ElDrawer = withInstall(Drawer)

packages/components/drawer/src/drawer.ts

@@ -1,4 +1,4 @@
-import { buildProps } from '@element-plus/utils-v2'
+import { buildProps } from '@element-plus/utils'
 import { dialogProps, dialogEmits } from '@element-plus/components/dialog'
 import type { ExtractPropTypes } from 'vue'
 

packages/components/dropdown/__tests__/dropdown.spec.ts

@@ -1,7 +1,7 @@
 import { nextTick } from 'vue'
 import { mount } from '@vue/test-utils'
 import { rAF } from '@element-plus/test-utils/tick'
-import { EVENT_CODE } from '@element-plus/utils/aria'
+import { EVENT_CODE } from '@element-plus/constants'
 import { ElTooltip } from '@element-plus/components/tooltip'
 import Dropdown from '../src/dropdown.vue'
 import DropdownItem from '../src/dropdown-item.vue'

packages/components/dropdown/index.ts

@@ -1,4 +1,4 @@
-import { withInstall, withNoopInstall } from '@element-plus/utils-v2'
+import { withInstall, withNoopInstall } from '@element-plus/utils'
 
 import Dropdown from './src/dropdown.vue'
 import DropdownItem from './src/dropdown-item.vue'

packages/components/dropdown/src/dropdown-item-impl.vue

@@ -31,9 +31,9 @@ import {
 } from '@element-plus/components/roving-focus-group'
 import { COLLECTION_ITEM_SIGN } from '@element-plus/components/collection'
 import { ElIcon } from '@element-plus/components/icon'
-import { EVENT_CODE } from '@element-plus/utils/aria'
-import { composeEventHandlers, composeRefs } from '@element-plus/utils/dom'
 import { useNamespace } from '@element-plus/hooks'
+import { composeEventHandlers, composeRefs } from '@element-plus/utils'
+import { EVENT_CODE } from '@element-plus/constants'
 import {
   DROPDOWN_COLLECTION_ITEM_INJECTION_KEY,
   dropdownItemProps,

packages/components/dropdown/src/dropdown-item.vue

@@ -25,7 +25,7 @@ import {
   unref,
 } from 'vue'
 import { ElRovingFocusItem } from '@element-plus/components/roving-focus-group'
-import { composeEventHandlers, whenMouse } from '@element-plus/utils/dom'
+import { composeEventHandlers, whenMouse } from '@element-plus/utils'
 import ElDropdownItemImpl from './dropdown-item-impl.vue'
 import { useDropdown } from './useDropdown'
 import {

packages/components/dropdown/src/dropdown-menu.vue

@@ -15,14 +15,14 @@
 </template>
 <script lang="ts">
 import { computed, defineComponent, inject, unref } from 'vue'
-import { EVENT_CODE } from '@element-plus/utils/aria'
+import { composeRefs, composeEventHandlers } from '@element-plus/utils'
+import { EVENT_CODE } from '@element-plus/constants'
 import { FOCUS_TRAP_INJECTION_KEY } from '@element-plus/components/focus-trap'
 import {
   ROVING_FOCUS_COLLECTION_INJECTION_KEY,
   ROVING_FOCUS_GROUP_INJECTION_KEY,
   focusFirst,
 } from '@element-plus/components/roving-focus-group'
-import { composeRefs, composeEventHandlers } from '@element-plus/utils/dom'
 import { useNamespace } from '@element-plus/hooks'
 import { DROPDOWN_INJECTION_KEY } from './tokens'
 import {

packages/components/dropdown/src/dropdown.ts

@@ -1,9 +1,5 @@
-import { EVENT_CODE } from '@element-plus/utils/aria'
-import {
-  buildProps,
-  definePropType,
-  iconPropType,
-} from '@element-plus/utils-v2'
+import { buildProps, definePropType, iconPropType } from '@element-plus/utils'
+import { EVENT_CODE } from '@element-plus/constants'
 import { createCollectionWithScope } from '@element-plus/components/collection'
 import {
   useTooltipTriggerProps,
@@ -14,7 +10,7 @@ import type { Options } from '@popperjs/core'
 import type { ButtonType } from '@element-plus/components/button'
 import type { Placement } from '@element-plus/components/popper'
 import type { ComponentInternalInstance, ComputedRef } from 'vue'
-import type { Nullable } from '@element-plus/utils/types'
+import type { Nullable } from '@element-plus/utils'
 
 export interface IElDropdownInstance {
   instance?: ComponentInternalInstance

packages/components/dropdown/src/dropdown.vue

@@ -89,7 +89,7 @@ import ElScrollbar from '@element-plus/components/scrollbar'
 import ElIcon from '@element-plus/components/icon'
 import ElFocusTrap from '@element-plus/components/focus-trap'
 import ElRovingFocusGroup from '@element-plus/components/roving-focus-group'
-import { addUnit } from '@element-plus/utils-v2'
+import { addUnit } from '@element-plus/utils'
 import { ArrowDown } from '@element-plus/icons-vue'
 import { useNamespace, useSize } from '@element-plus/hooks'
 import { ElCollection as ElDropdownCollection, dropdownProps } from './dropdown'

packages/components/dropdown/src/useDropdown.ts

@@ -1,10 +1,8 @@
 import { inject, computed, ref } from 'vue'
-import { generateId } from '@element-plus/utils-v2'
-import { EVENT_CODE } from '@element-plus/utils/aria'
-import { on, addClass } from '@element-plus/utils/dom'
-
+import { generateId, on, addClass } from '@element-plus/utils'
+import { EVENT_CODE } from '@element-plus/constants'
 import { useNamespace } from '@element-plus/hooks'
-import type { Nullable } from '@element-plus/utils/types'
+import type { Nullable } from '@element-plus/utils'
 import type { IElDropdownInstance } from './dropdown'
 
 export const useDropdown = () => {

packages/components/empty/index.ts

@@ -1,4 +1,4 @@
-import { withInstall } from '@element-plus/utils-v2'
+import { withInstall } from '@element-plus/utils'
 
 import Empty from './src/empty.vue'
 

packages/components/focus-trap/__tests__/focus-trap.spec.ts

@@ -1,6 +1,6 @@
 import { h, nextTick, inject } from 'vue'
 import { mount } from '@vue/test-utils'
-import { EVENT_CODE } from '@element-plus/utils/aria'
+import { EVENT_CODE } from '@element-plus/constants'
 import ElFocusTrap from '../src/focus-trap.vue'
 import { FOCUS_TRAP_INJECTION_KEY } from '../src/tokens'
 

packages/components/focus-trap/src/focus-trap.vue

@@ -11,8 +11,8 @@ import {
   unref,
   watch,
 } from 'vue'
-import { EVENT_CODE } from '@element-plus/utils/aria'
-import { on, off } from '@element-plus/utils/dom'
+import { on, off } from '@element-plus/utils'
+import { EVENT_CODE } from '@element-plus/constants'
 import {
   focusableStack,
   focusFirstDescendant,

packages/components/form/index.ts

@@ -1,4 +1,4 @@
-import { withInstall, withNoopInstall } from '@element-plus/utils-v2'
+import { withInstall, withNoopInstall } from '@element-plus/utils'
 import Form from './src/form.vue'
 import FormItem from './src/form-item.vue'
 

packages/components/form/src/form-item.vue

@@ -53,8 +53,11 @@ import {
 } from 'vue'
 import { NOOP } from '@vue/shared'
 import AsyncValidator from 'async-validator'
-import { addUnit, isValidComponentSize } from '@element-plus/utils-v2'
-import { getPropByPath } from '@element-plus/utils/util'
+import {
+  addUnit,
+  isValidComponentSize,
+  getPropByPath,
+} from '@element-plus/utils'
 import { elFormItemKey, elFormKey } from '@element-plus/tokens'
 import { useSize } from '@element-plus/hooks'
 import LabelWrap from './label-wrap'

packages/components/form/src/form.vue

@@ -15,7 +15,7 @@ import {
   watch,
 } from 'vue'
 import { elFormKey } from '@element-plus/tokens'
-import { debugWarn } from '@element-plus/utils-v2'
+import { debugWarn } from '@element-plus/utils'
 import { useSize } from '@element-plus/hooks'
 import type { ValidateFieldsError } from 'async-validator'
 

packages/components/form/src/label-wrap.ts

@@ -10,15 +10,11 @@ import {
   ref,
   watch,
 } from 'vue'
-import {
-  addResizeListener,
-  removeResizeListener,
-} from '@element-plus/utils/resize-event'
+import { addResizeListener, removeResizeListener } from '@element-plus/utils'
 import { elFormItemKey, elFormKey } from '@element-plus/tokens'
-import type { ResizableElement } from '@element-plus/utils/resize-event'
+import type { ResizableElement, Nullable } from '@element-plus/utils'
 
 import type { CSSProperties } from 'vue'
-import type { Nullable } from '@element-plus/utils/types'
 
 export default defineComponent({
   name: 'ElLabelWrap',

packages/components/icon/index.ts

@@ -1,4 +1,4 @@
-import { withInstall } from '@element-plus/utils-v2'
+import { withInstall } from '@element-plus/utils'
 
 import Icon from './src/icon.vue'