test(comp:*): resovle overlay warnings and stepper snapshots (#1402)

* test(comp:*): resovle overlay warnings and stepper snapshots

* style: update with style lint

packages/cdk/drag-drop/src/composables/useDraggable.ts

@@ -5,18 +5,18 @@
  * found in the LICENSE file at https://github.com/IDuxFE/idux/blob/main/LICENSE
  */
 
-import type { DnDEventName, DnDEventType, DnDPosition, DraggableOptions } from '../types'
 import type { DnDContext } from './useDragDropContext'
+import type { DnDEventName, DnDEventType, DnDPosition, DraggableOptions } from '../types'
 
 import { type ComputedRef, computed, ref, watch } from 'vue'
 
 import { type MaybeElementRef, convertElement, tryOnScopeDispose, useEventListener } from '@idux/cdk/utils'
 
-import { DnDState } from '../state'
-import { extraMove, initContext, reMoveElement } from '../utils'
 import { withBoundary } from './withBoundary'
 import { withDragFree } from './withDragFree'
 import { withDragHandle } from './withDragHandle'
+import { DnDState } from '../state'
+import { extraMove, initContext, reMoveElement } from '../utils'
 
 /**
  * make a element draggable

packages/cdk/drag-drop/src/composables/useDroppable.ts

@@ -11,8 +11,8 @@ import { watch } from 'vue'
 
 import { type MaybeElementRef, convertElement, tryOnScopeDispose } from '@idux/cdk/utils'
 
-import { initContext } from '../utils'
 import { type DnDContext } from './useDragDropContext'
+import { initContext } from '../utils'
 
 /**
  * make a element droppable as a container and accept draggable element

packages/cdk/drag-drop/src/composables/withBoundary.ts

@@ -5,8 +5,8 @@
  * found in the LICENSE file at https://github.com/IDuxFE/idux/blob/main/LICENSE
  */
 
-import { LockAxisType } from '../types'
 import { type DnDContext } from './useDragDropContext'
+import { LockAxisType } from '../types'
 
 export const withBoundary = (
   sourceEl: HTMLElement,

packages/cdk/drag-drop/src/composables/withDragFree.ts

@@ -7,8 +7,8 @@
 
 import type { DnDEventType } from '../types'
 
-import { moveElement } from '../utils'
 import { type DnDContext } from './useDragDropContext'
+import { moveElement } from '../utils'
 
 export const withDragFree = (sourceEl: HTMLElement, context: DnDContext): void => {
   const registry = context.registry

packages/cdk/drag-drop/src/draggable/Draggable.tsx

@@ -11,8 +11,8 @@ import { computed, defineComponent, normalizeClass, reactive, ref } from 'vue'
 
 import { callEmit } from '@idux/cdk/utils'
 
-import { useDraggable } from '../composables/useDraggable'
 import { draggableProps } from './types'
+import { useDraggable } from '../composables/useDraggable'
 
 const style = {
   width: 'fit-content',

packages/cdk/forms/src/models/formArray.ts

@@ -7,8 +7,8 @@
 
 import { type ComputedRef, computed, watch, watchEffect } from 'vue'
 
-import { type AsyncValidatorFn, type ValidateStatus, type ValidatorFn, type ValidatorOptions } from '../types'
 import { AbstractControl } from './abstractControl'
+import { type AsyncValidatorFn, type ValidateStatus, type ValidatorFn, type ValidatorOptions } from '../types'
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 export class FormArray<T = any> extends AbstractControl<T[]> {

packages/cdk/forms/src/models/formControl.ts

@@ -7,8 +7,8 @@
 
 import { watch } from 'vue'
 
-import { type AsyncValidatorFn, type ValidatorFn, type ValidatorOptions } from '../types'
 import { AbstractControl } from './abstractControl'
+import { type AsyncValidatorFn, type ValidatorFn, type ValidatorOptions } from '../types'
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 export class FormControl<T = any> extends AbstractControl<T> {

packages/cdk/forms/src/models/formGroup.ts

@@ -9,8 +9,8 @@ import { watch, watchEffect } from 'vue'
 
 import { hasOwnProperty } from '@idux/cdk/utils'
 
-import { type AsyncValidatorFn, type ValidateStatus, type ValidatorFn, type ValidatorOptions } from '../types'
 import { AbstractControl, type GroupControls, type OptionalKeys } from './abstractControl'
+import { type AsyncValidatorFn, type ValidateStatus, type ValidatorFn, type ValidatorOptions } from '../types'
 
 export class FormGroup<T extends object = object> extends AbstractControl<T> {
   constructor(

packages/cdk/scroll/src/strategy/blockScrollStrategy.ts

@@ -7,8 +7,8 @@
 
 import { addClass, removeClass } from '@idux/cdk/utils'
 
-import { getScrollBarSize } from '../utils'
 import { ScrollStrategy } from './scrollStrategy'
+import { getScrollBarSize } from '../utils'
 
 export interface BlockScrollStrategyOptions {
   target?: HTMLElement

packages/cdk/scroll/src/virtual/composables/useScrollState.ts

@@ -5,8 +5,8 @@
  * found in the LICENSE file at https://github.com/IDuxFE/idux/blob/main/LICENSE
  */
 
-import type { VirtualScrollProps } from '../types'
 import type { GetKey } from './useGetKey'
+import type { VirtualScrollProps } from '../types'
 import type { VKey } from '@idux/cdk/utils'
 import type { ComputedRef, Ref } from 'vue'
 

packages/components/_private/date-panel/src/panel-body/PanelBody.tsx

@@ -11,8 +11,8 @@ import type { ComputedRef, VNode } from 'vue'
 
 import { computed, defineComponent, inject } from 'vue'
 
-import { datePanelToken } from '../token'
 import PanelRow from './PanelRow'
+import { datePanelToken } from '../token'
 
 export default defineComponent({
   setup() {

packages/components/_private/date-panel/src/panel-body/PanelRow.tsx

@@ -7,9 +7,9 @@
 
 import { computed, defineComponent, inject } from 'vue'
 
+import PanelCell from './PanelCell'
 import { datePanelToken } from '../token'
 import { panelRowProps } from '../types'
-import PanelCell from './PanelCell'
 
 interface TbodyCell {
   key: string

packages/components/_private/overlay/__tests__/overlay.spec.ts

@@ -12,7 +12,7 @@ describe('Overlay', () => {
   const OverlayMount = (options?: MountingOptions<Partial<OverlayProps>>) => {
     const { props, ...rest } = options || {}
     return mount(Overlay, {
-      props: { container: () => '.ix-overlay-container', ...props },
+      props: { container: () => '.ix-overlay-container', containerFallback: '.ix-overlay-container', ...props },
       ...rest,
     } as MountingOptions<OverlayProps>)
   }
@@ -26,7 +26,10 @@ describe('Overlay', () => {
     document.querySelector('.ix-overlay-container')!.innerHTML = ''
   })
 
-  renderWork<OverlayProps>(Overlay, { props: { container: () => '.ix-overlay-container', visible: true }, slots })
+  renderWork<OverlayProps>(Overlay, {
+    props: { container: () => '.ix-overlay-container', containerFallback: '.ix-overlay-container', visible: true },
+    slots,
+  })
 
   test('visible work', async () => {
     const onUpdateVisible = vi.fn()

packages/components/cascader/src/composables/useActiveState.ts

@@ -9,8 +9,8 @@ import { type ComputedRef, type Ref, computed } from 'vue'
 
 import { type VKey, useState } from '@idux/cdk/utils'
 
-import { type CascaderProps } from '../types'
 import { type MergedData } from './useDataSource'
+import { type CascaderProps } from '../types'
 
 export interface ActiveStateContext {
   activeKey: Ref<VKey | undefined>

packages/components/cascader/src/composables/useExpandable.ts

@@ -12,9 +12,9 @@ import { isNil } from 'lodash-es'
 import { type VKey, callEmit, useControlledProp } from '@idux/cdk/utils'
 import { type GetKeyFn } from '@idux/components/utils'
 
+import { type MergedData, convertMergedData, convertMergedDataMap } from './useDataSource'
 import { type CascaderData, type CascaderProps } from '../types'
 import { callChange, getParentKeys } from '../utils'
-import { type MergedData, convertMergedData, convertMergedDataMap } from './useDataSource'
 
 export interface ExpandableContext {
   expandedKeys: ComputedRef<VKey[]>

packages/components/cascader/src/composables/useSearchable.ts

@@ -11,8 +11,8 @@ import { isFunction } from 'lodash-es'
 
 import { NoopArray, type VKey } from '@idux/cdk/utils'
 
-import { type CascaderData, type CascaderProps, type CascaderSearchFn } from '../types'
 import { type MergedData } from './useDataSource'
+import { type CascaderData, type CascaderProps, type CascaderSearchFn } from '../types'
 
 export interface SearchableContext {
   searchedData: ComputedRef<MergedData[]>

packages/components/cascader/src/composables/useSelectedState.ts

@@ -13,9 +13,9 @@ import { type FormAccessor } from '@idux/cdk/forms'
 import { NoopArray, type VKey, callEmit, convertArray } from '@idux/cdk/utils'
 import { useGlobalConfig } from '@idux/components/config'
 
+import { type MergedData } from './useDataSource'
 import { type CascaderProps, type CascaderStrategy } from '../types'
 import { getChildrenKeys, getParentKeys } from '../utils'
-import { type MergedData } from './useDataSource'
 
 export interface SelectedStateContext {
   selectedKeys: ComputedRef<VKey[]>

packages/components/cascader/src/contents/OverlayContent.tsx

@@ -12,8 +12,8 @@ import { type VNode, computed, defineComponent, inject, watch } from 'vue'
 import { type VKey, callEmit } from '@idux/cdk/utils'
 import { ɵInput } from '@idux/components/_private/input'
 
-import { cascaderToken } from '../token'
 import OverlayOptionGroup from './OverlayOptionGroup'
+import { cascaderToken } from '../token'
 
 export default defineComponent({
   setup() {

packages/components/cascader/src/contents/OverlayOptionGroup.tsx

@@ -10,9 +10,9 @@ import { type PropType, type VNode, computed, defineComponent, inject, normalize
 import { CdkVirtualScroll, type VirtualItemRenderFn } from '@idux/cdk/scroll'
 import { ɵEmpty } from '@idux/components/_private/empty'
 
+import OverlayOption from './OverlayOption'
 import { type MergedData } from '../composables/useDataSource'
 import { cascaderToken } from '../token'
-import OverlayOption from './OverlayOption'
 
 export default defineComponent({
   props: {

packages/components/date-picker/src/composables/useControl.ts

@@ -10,9 +10,9 @@ import { type ComputedRef, type Ref, watch } from 'vue'
 import { useState } from '@idux/cdk/utils'
 import { type DateConfig } from '@idux/components/config'
 
-import { applyDateTime, convertToDate, isSameDateTime } from '../utils'
 import { type FormatContext } from './useFormat'
 import { type InputEnableStatus } from './useInputEnableStatus'
+import { applyDateTime, convertToDate, isSameDateTime } from '../utils'
 
 export interface PickerControlContext {
   inputValue: ComputedRef<string>

packages/components/date-picker/src/composables/useOverlayState.ts

@@ -5,9 +5,9 @@
  * found in the LICENSE file at https://github.com/IDuxFE/idux/blob/main/LICENSE
  */
 
-import type { DatePickerProps, DateRangePickerProps } from '../types'
 import type { PickerControlContext } from './useControl'
 import type { PickerRangeControlContext } from './useRangeControl'
+import type { DatePickerProps, DateRangePickerProps } from '../types'
 import type { ComputedRef } from 'vue'
 
 import { onMounted, watch } from 'vue'

packages/components/date-picker/src/composables/useRangeControl.ts

@@ -10,10 +10,10 @@ import { type ComputedRef, type Ref, computed, watch } from 'vue'
 import { convertArray, useState } from '@idux/cdk/utils'
 import { type DateConfig } from '@idux/components/config'
 
-import { compareDateTime, convertToDate, sortRangeValue } from '../utils'
 import { type PickerControlContext, useControl } from './useControl'
 import { type FormatContext } from './useFormat'
 import { type InputEnableStatus } from './useInputEnableStatus'
+import { compareDateTime, convertToDate, sortRangeValue } from '../utils'
 
 export interface PickerRangeControlContext {
   buffer: ComputedRef<(Date | undefined)[] | undefined>

packages/components/form/src/composables/useFormItem.ts

@@ -23,9 +23,9 @@ import { type VKey, hasOwnProperty } from '@idux/cdk/utils'
 import { useGlobalConfig } from '@idux/components/config'
 import { type Locale } from '@idux/components/locales'
 
+import { useFormStatus } from './public'
 import { FORM_ITEM_TOKEN } from '../token'
 import { type FormItemProps } from '../types'
-import { useFormStatus } from './public'
 
 export function useFormItem(props: FormItemProps): {
   status: ComputedRef<ValidateStatus | undefined>

packages/components/menu/src/contents/MenuItem.tsx

@@ -11,10 +11,10 @@ import { isString } from 'lodash-es'
 
 import { useKey } from '@idux/components/utils'
 
+import { coverIcon } from './Utils'
 import { usePaddingLeft } from '../composables/usePaddingLeft'
 import { menuItemGroupToken, menuSubToken, menuToken } from '../token'
 import { menuItemProps } from '../types'
-import { coverIcon } from './Utils'
 
 export default defineComponent({
   name: 'MenuItem',

packages/components/menu/src/contents/MenuItemGroup.tsx

@@ -11,10 +11,10 @@ import { isString } from 'lodash-es'
 
 import { useKey } from '@idux/components/utils'
 
+import { coverChildren, coverIcon } from './Utils'
 import { usePaddingLeft } from '../composables/usePaddingLeft'
 import { menuItemGroupToken, menuSubToken, menuToken } from '../token'
 import { menuItemGroupProps } from '../types'
-import { coverChildren, coverIcon } from './Utils'
 
 export default defineComponent({
   name: 'MenuItemGroup',

packages/components/menu/src/contents/Utils.tsx

@@ -13,11 +13,11 @@ import { Logger } from '@idux/cdk/utils'
 import { IxIcon } from '@idux/components/icon'
 import { type GetKeyFn } from '@idux/components/utils'
 
-import { type MenuData } from '../types'
 import MenuDivider from './MenuDivider'
 import MenuItem from './MenuItem'
 import MenuItemGroup from './MenuItemGroup'
 import MenuSub from './menu-sub/MenuSub'
+import { type MenuData } from '../types'
 
 export function coverChildren(data: MenuData[] | undefined, getKetFn: GetKeyFn): VNode[] {
   if (!data || data.length === 0) {

packages/components/menu/src/contents/menu-sub/MenuSub.tsx

@@ -25,12 +25,12 @@ import { ɵOverlay } from '@idux/components/_private/overlay'
 import { useGlobalConfig } from '@idux/components/config'
 import { useKey } from '@idux/components/utils'
 
-import { usePaddingLeft } from '../../composables/usePaddingLeft'
-import { type MenuSubContext, menuItemGroupToken, menuSubToken, menuToken } from '../../token'
-import { type MenuData, type MenuProps, type MenuSubProps, menuSubProps } from '../../types'
 import InlineContent from './InlineContent'
 import Label from './Label'
 import OverlayContent from './OverlayContent'
+import { usePaddingLeft } from '../../composables/usePaddingLeft'
+import { type MenuSubContext, menuItemGroupToken, menuSubToken, menuToken } from '../../token'
+import { type MenuData, type MenuProps, type MenuSubProps, menuSubProps } from '../../types'
 
 export default defineComponent({
   name: 'MenuSub',

packages/components/select/src/composables/useOptions.ts

@@ -16,9 +16,9 @@ import { isFunction, isNil } from 'lodash-es'
 
 import { type VKey, flattenNode } from '@idux/cdk/utils'
 
+import { GetKeyFn } from './useGetOptionKey'
 import { optionGroupKey, optionKey } from '../option'
 import { generateOption } from '../utils/generateOption'
-import { GetKeyFn } from './useGetOptionKey'
 
 export interface FlattenedOption {
   key: VKey

packages/components/select/src/composables/useSelectedState.ts

@@ -12,9 +12,9 @@ import { type ComputedRef, computed, toRaw } from 'vue'
 import { type FormAccessor } from '@idux/cdk/forms'
 import { type VKey, callEmit, convertArray } from '@idux/cdk/utils'
 
+import { type FlattenedOption } from './useOptions'
 import { type SelectProps } from '../types'
 import { generateOption } from '../utils/generateOption'
-import { type FlattenedOption } from './useOptions'
 
 export interface SelectedStateContext {
   selectedValue: ComputedRef<VKey[]>

packages/components/select/src/panel/Panel.tsx

@@ -19,15 +19,15 @@ import { callEmit } from '@idux/cdk/utils'
 import { ɵEmpty } from '@idux/components/_private/empty'
 import { type SelectConfig, useGlobalConfig } from '@idux/components/config'
 
+import ListBox from './ListBox'
+import Option from './Option'
+import OptionGroup from './OptionGroup'
 import { usePanelGetOptionKey } from '../composables/useGetOptionKey'
 import { useFlattenedOptions } from '../composables/useOptions'
 import { usePanelActiveState } from '../composables/usePanelActiveState'
 import { useSelectedState } from '../composables/usePanelSelectedState'
 import { SELECT_PANEL_DATA_TOKEN, selectPanelContext } from '../token'
 import { type SelectPanelProps, selectPanelProps } from '../types'
-import ListBox from './ListBox'
-import Option from './Option'
-import OptionGroup from './OptionGroup'
 
 export default defineComponent({
   name: 'IxSelectPanel',

packages/components/stepper/demo/Dot.vue

@@ -1,5 +1,5 @@
 <template>
-  <IxStepper :activeKey="2" :dot="true" labelPlacement="bottom">
+  <IxStepper :activeKey="2" :dot="true">
     <IxStepperItem title="Finished" description="This is a description."></IxStepperItem>
     <IxStepperItem title="In Progress" description="This is a description."></IxStepperItem>
     <IxStepperItem title="Waiting" description="This is a description."></IxStepperItem>

packages/components/stepper/src/StepperItem.tsx

@@ -46,7 +46,7 @@ export default defineComponent({
     const classes = computed(() => {
       const prefixCls = mergedPrefixCls.value
       const { disabled, icon } = props
-      const { dot, labelPlacement } = parentProps
+      const { dot } = parentProps
 
       return normalizeClass({
         [prefixCls]: true,
@@ -56,7 +56,6 @@ export default defineComponent({
         [`${prefixCls}-disabled`]: disabled,
         [`${prefixCls}-with-icon`]: icon || !!slots.icon,
         [`${prefixCls}-dot`]: dot,
-        [`${prefixCls}-label-${labelPlacement}`]: true,
       })
     })
 

packages/components/table/src/composables/useDataSource.ts

@@ -10,9 +10,9 @@ import { type ComputedRef, type Ref, computed } from 'vue'
 import { type VKey } from '@idux/cdk/utils'
 import { type GetKeyFn } from '@idux/components/utils'
 
-import { type TablePagination, type TableProps } from '../types'
 import { type ActiveFilter } from './useFilterable'
 import { type ActiveSorter } from './useSortable'
+import { type TablePagination, type TableProps } from '../types'
 
 export function useDataSource(
   props: TableProps,