feat(components): [virtual-table] row (#7047)

* feat(components): [virtual-table] row

- Define TableRow props
- Refine Table props

* Fix typing issue

packages/components/table-v2/src/row.ts

@@ -0,0 +1,78 @@
+import { buildProps, definePropType } from '@element-plus/utils'
+
+import type { ExtractPropTypes, StyleValue } from 'vue'
+import type { Column, FixedDirection, KeyType, RowCommonParams } from './types'
+
+export type RowExpandParams<T> = {
+  expanded: boolean
+  rowKey: KeyType
+} & RowCommonParams<T>
+
+export type RowHoverParams<T> = {
+  event: MouseEvent
+} & RowCommonParams<T>
+
+export type RowEventHandlerParams<T> = {
+  rowKey: KeyType
+  event: Event
+} & RowCommonParams<T>
+
+export type RowExpandHandler<T> = (params: RowExpandParams<T>) => void
+export type RowHoverHandler<T> = (params: RowHoverParams<T>) => void
+export type RowEventHandler<T> = (params: RowEventHandlerParams<T>) => void
+export type RowHeightChangeHandler = (
+  rowKey: KeyType,
+  height: number,
+  rowIndex: number,
+  fixedDirection: boolean | FixedDirection
+) => void
+
+export type RowEventHandlers<T> = {
+  click?: RowEventHandler<T>
+  contextmenu?: RowEventHandler<T>
+  dblclick?: RowEventHandler<T>
+  mouseenter?: RowEventHandler<T>
+  mouseleave?: RowEventHandler<T>
+}
+
+export const tableV2RowProps = buildProps({
+  class: String,
+  columns: {
+    type: definePropType<Column<any>[]>(Array),
+    required: true,
+  },
+  depth: Number,
+  expandColumnKey: String,
+  isScrolling: Boolean,
+  onRowExpand: {
+    type: definePropType<RowExpandHandler<any>>(Function),
+  },
+  onRowHover: {
+    type: definePropType<RowHoverHandler<any>>(Function),
+  },
+  onRowHeightChange: {
+    type: definePropType<RowHeightChangeHandler>(Function),
+  },
+  rowData: {
+    type: definePropType<any>(Object),
+    required: true,
+  },
+  rowEventHandlers: {
+    type: definePropType<RowEventHandlers<any>>(Object),
+  },
+  rowIndex: {
+    type: Number,
+    required: true,
+  },
+  /**
+   * Unique item key
+   */
+  rowKey: {
+    type: definePropType<KeyType>([String, Number, Symbol]),
+  },
+  style: {
+    type: definePropType<StyleValue>([String, Array, Object]),
+  },
+} as const)
+
+export type TableV2RowProps = ExtractPropTypes<typeof tableV2RowProps>

packages/components/table-v2/src/table.ts

@@ -17,16 +17,6 @@ export type ColumnSortParams<T> = {
   order: SortOrder
 }
 
-export type RowExpandParams<T> = {
-  expanded: boolean
-  rowKey: KeyType
-} & RowCommonParams<T>
-
-export type RowEventHandlerParams<T> = {
-  rowKey: KeyType
-  event: Event
-} & RowCommonParams<T>
-
 /**
  * Renderer/Getter types
  */
@@ -61,25 +51,8 @@ export type RowClassNameGetter<T> = (
  * Handler types
  */
 export type ColumnSortHandler<T> = (params: ColumnSortParams<T>) => void
-export type RowExpandHandler<T> = (params: RowExpandParams<T>) => void
-export type RowEventHandler<T> = (params: RowEventHandlerParams<T>) => void
-
-export type RowEventHandlers<T> = {
-  click?: RowEventHandler<T>
-  contextmenu?: RowEventHandler<T>
-  dblclick?: RowEventHandler<T>
-  mouseenter?: RowEventHandler<T>
-  mouseleave?: RowEventHandler<T>
-}
 
 export const tableV2Props = buildProps({
-  /**
-   * Unique items
-   */
-  rowKey: {
-    type: definePropType<KeyType>([String, Number, Symbol]),
-  },
-
   /**
    * extra props deriver
    */
@@ -128,7 +101,6 @@ export const tableV2Props = buildProps({
   /**
    * Expanded keys
    */
-  expandColumnKey: String,
   expandedRowKeys: {
     type: definePropType<KeyType[]>(Array),
   },
@@ -162,12 +134,6 @@ export const tableV2Props = buildProps({
   onColumnSort: {
     type: definePropType<ColumnSortParams<any>>(Function),
   },
-  onRowExpanded: {
-    type: definePropType<RowExpandHandler<any>>(Function),
-  },
-  rowEventHandlers: {
-    type: definePropType<RowEventHandlers<any>>(Object),
-  },
 } as const)
 
 export type TableV2Props = ExtractPropTypes<typeof tableV2Props>