@are-visual/virtual-table 0.7.0 → 0.8.0

package/middleware/expandable/index.d.ts

@@ -2,6 +2,8 @@ import * as _are_visual_virtual_table from '@are-visual/virtual-table';
 import { FixedType, ColumnExtra, ColumnType } from '@are-visual/virtual-table';
 import { MouseEvent, ReactNode, Key } from 'react';
 
+declare const ExpandRowHeightKey = "ExpandRow";
+
 type TriggerEventHandler<T> = (record: T, event: MouseEvent<HTMLElement>) => void;
 interface RenderExpandIconProps<T> {
     prefixCls: string;
@@ -30,9 +32,10 @@ interface ExpandableConfig<T> {
     fixed?: FixedType;
     extraColumnProps?: ColumnExtra;
 }
+
 declare const EXPANSION_COLUMN_KEY = "VirtualTable.EXPANSION_COLUMN";
 declare function isExpansionColumn<T = any>(column: ColumnType<T>): boolean;
 declare const tableExpandable: <T = any>(options?: ExpandableConfig<T> | undefined) => _are_visual_virtual_table.Middleware<T>;
 
-export { EXPANSION_COLUMN_KEY, isExpansionColumn, tableExpandable };
+export { EXPANSION_COLUMN_KEY, ExpandRowHeightKey, isExpansionColumn, tableExpandable };
 export type { ExpandableConfig, ExpandedRowRender, RenderExpandIcon, RenderExpandIconProps, RowClassName };

package/middleware/expandable/index.js

@@ -4,18 +4,19 @@ import { useControllableValue } from '@are-visual/virtual-table/middleware/utils
 import clsx from 'clsx';
 import { useMemo, useRef, useCallback } from 'react';
 
+const ExpandRowHeightKey = 'ExpandRow';
 const ExpandRow = props => {
   const {
     className,
     style,
-    rowIndex,
+    rowKey,
     isExpanded,
     colSpan,
     children,
     fixed
   } = props;
   const {
-    updateRowHeight
+    setRowHeightByRowKey
   } = useTableRowManager();
   const {
     tableWidth
@@ -28,7 +29,7 @@ const ExpandRow = props => {
     },
     ref: node => {
       if (node == null) return;
-      updateRowHeight(rowIndex, `row(${rowIndex})-expandable`, node.offsetHeight);
+      setRowHeightByRowKey(rowKey, ExpandRowHeightKey, node.offsetHeight);
     },
     children: jsx("td", {
       colSpan: colSpan,
@@ -131,11 +132,11 @@ function useTableExpandable(ctx, options) {
     const {
       rowData,
       rowIndex,
+      rowKey: key,
       columnDescriptor
     } = args;
     const isExpandable = rowExpandableRecord[rowIndex];
     if (isExpandable) {
-      const key = getRowKey(rowData, rowKey);
       const isExpanded = expansion.includes(key);
       const isRendered = expansionKeys.current.has(key);
       let className = '';
@@ -147,7 +148,7 @@ function useTableExpandable(ctx, options) {
       return jsxs(Fragment, {
         children: [children, isRendered && jsx(ExpandRow, {
           className: className,
-          rowIndex: rowIndex,
+          rowKey: key,
           isExpanded: isExpanded,
           colSpan: columnDescriptor.length,
           fixed: isFixed,
@@ -156,7 +157,7 @@ function useTableExpandable(ctx, options) {
       });
     }
     return children;
-  }, [isFixed, rowExpandableRecord, rowKey, expansion, expandedRowClassName, expandedRowRender]);
+  }, [isFixed, rowExpandableRecord, expansion, expandedRowClassName, expandedRowRender]);
   const columns = useMemo(() => {
     if (!showExpandColumn) {
       return rawColumns;
@@ -223,8 +224,7 @@ function useTableExpandable(ctx, options) {
     onRow: !expandRowByClick ? undefined : onRow
   };
 }
-/* eslint max-len: ["error", { "code": 120 }] */
 const tableExpandable = createMiddleware(useTableExpandable);
 
-export { EXPANSION_COLUMN_KEY, isExpansionColumn, tableExpandable };
+export { EXPANSION_COLUMN_KEY, ExpandRowHeightKey, isExpansionColumn, tableExpandable };
 //# sourceMappingURL=index.js.map

package/middleware/expandable/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../packages/virtual-table/src/middleware/expandable/expand-row.tsx","../../../../packages/virtual-table/src/middleware/expandable/index.tsx"],"sourcesContent":["import type { CSSProperties, FC, ReactNode } from 'react'\nimport { useContainerSize, useTableRowManager } from '@are-visual/virtual-table'\nimport clsx from 'clsx'\n\nexport interface ExpandRowProps {\n  className?: string\n  style?: CSSProperties\n  rowIndex: number\n  isExpanded?: boolean\n  colSpan?: number\n  children?: ReactNode\n  fixed?: boolean\n}\n\nconst ExpandRow: FC<ExpandRowProps> = (props) => {\n  const {\n    className,\n    style,\n    rowIndex,\n    isExpanded,\n    colSpan,\n    children,\n    fixed,\n  } = props\n\n  const { updateRowHeight } = useTableRowManager()\n  const { tableWidth } = useContainerSize()\n\n  return (\n    <tr\n      className={clsx('virtual-table-expanded-row', className)}\n      style={{ ...style, display: isExpanded ? undefined : 'none' }}\n      ref={(node) => {\n        if (node == null) return\n        updateRowHeight(rowIndex, `row(${rowIndex})-expandable`, node.offsetHeight)\n      }}\n    >\n      <td colSpan={colSpan}>\n        <div\n          className={clsx(\n            'virtual-table-cell',\n            fixed && 'virtual-table-expanded-row-fixed',\n          )}\n          style={{ width: tableWidth <= 0 ? undefined : tableWidth }}\n        >\n          {children}\n        </div>\n      </td>\n    </tr>\n  )\n}\n\nexport default ExpandRow\n","/* eslint-disable @typescript-eslint/no-explicit-any */\nimport type {\n  AnyObject,\n  ColumnExtra,\n  ColumnType,\n  FixedType,\n  MiddlewareContext,\n  MiddlewareRenderRow,\n  MiddlewareResult,\n  OnRowType,\n} from '@are-visual/virtual-table'\nimport type { Key, MouseEvent, ReactNode } from 'react'\nimport { createMiddleware, getRowKey, isValidFixed, useShallowMemo, useStableFn } from '@are-visual/virtual-table'\nimport { useControllableValue } from '@are-visual/virtual-table/middleware/utils/useControllableValue'\nimport clsx from 'clsx'\nimport { useCallback, useMemo, useRef } from 'react'\nimport ExpandRow from './expand-row'\n\ntype TriggerEventHandler<T> = (record: T, event: MouseEvent<HTMLElement>) => void\nexport interface RenderExpandIconProps<T> {\n  prefixCls: string\n  expanded: boolean\n  record: T\n  expandable: boolean\n  onExpand: TriggerEventHandler<T>\n}\nexport type RowClassName<T> = (record: T, index: number, indent: number) => string\nexport type RenderExpandIcon<T> = (props: RenderExpandIconProps<T>) => ReactNode\nexport type ExpandedRowRender<T> = (record: T, index: number, indent: number, expanded: boolean) => ReactNode\n\nexport interface ExpandableConfig<T> {\n  expandedRowKeys?: readonly Key[]\n  defaultExpandedRowKeys?: readonly Key[]\n  expandedRowRender?: ExpandedRowRender<T>\n  columnTitle?: ReactNode\n  expandRowByClick?: boolean\n  expandIcon?: RenderExpandIcon<T>\n  onExpand?: (expanded: boolean, record: T) => void\n  onExpandedRowsChange?: (expandedKeys: readonly Key[]) => void\n  defaultExpandAllRows?: boolean\n  showExpandColumn?: boolean\n  expandedRowClassName?: string | RowClassName<T>\n  rowExpandable?: (record: T) => boolean\n  columnWidth?: number | string\n  fixed?: FixedType\n  extraColumnProps?: ColumnExtra\n}\n\nexport const EXPANSION_COLUMN_KEY = 'VirtualTable.EXPANSION_COLUMN'\n\nexport function isExpansionColumn<T = any>(column: ColumnType<T>) {\n  return column.key === EXPANSION_COLUMN_KEY\n}\n\nfunction useTableExpandable<T = any>(\n  ctx: MiddlewareContext<T>,\n  options?: ExpandableConfig<T>,\n): MiddlewareResult<T> {\n  const disablePlugin = options == null\n\n  const { rowKey, columns: rawColumns, dataSource } = ctx\n  const {\n    // expandedRowKeys,\n    // onExpandedRowsChange,\n    defaultExpandedRowKeys,\n    expandedRowRender,\n    columnTitle,\n    expandRowByClick = false,\n    expandIcon,\n    onExpand,\n\n    defaultExpandAllRows = false,\n\n    // TODO: 未实现\n    // indentSize: _indentSize,\n\n    showExpandColumn = true,\n    expandedRowClassName,\n\n    rowExpandable,\n    columnWidth = 50,\n    fixed,\n    extraColumnProps,\n  } = options ?? {}\n\n  const _rowExpandableValue = useMemo(() => {\n    return dataSource.map((row) => {\n      if (!rowExpandable) return false\n      return rowExpandable(row)\n    })\n  }, [dataSource, rowExpandable])\n\n  // useShallowMemo 每一次渲染时候都会重新求值，这对于某些开销较大的计算不太友好，\n  // 所以使用 useMemo 求值再通过 useShallowMemo 浅比较\n  // useMemo 标记 deps 后，若 deps 不变也就不需要重新求值\n  // 使用 useShallowMemo 主要是为了防止重新求值后结果不变但地址指针变化，导致不必要的渲染\n  const rowExpandableRecord = useShallowMemo(() => _rowExpandableValue)\n\n  // 即使 defaultExpandAllRows 变更之后，此插件也不要响应变化，只使用初始值，所以存储一下\n  const defaultExpandAll = useRef(\n    // options 中有 expandedRowKeys 则表示受控模式，那么 defaultExpandAllRows 不生效\n    'expandedRowKeys' in (options ?? {}) || 'defaultExpandedRowKeys' in (options ?? {})\n      ? false\n      : defaultExpandAllRows,\n  )\n  const defaultExpandKey = useShallowMemo((): readonly Key[] => {\n    if (defaultExpandAll.current) {\n      const expandKeys = dataSource.map((record, index): Key | null => {\n        if (rowExpandableRecord[index]) {\n          const key = (record as AnyObject)[rowKey as string] as string | number\n          return key\n        }\n        return null\n      })\n      return expandKeys.filter((x) => x != null)\n    }\n    return []\n  })\n\n  const expansionKeys = useRef(new Set<Key>(defaultExpandedRowKeys ?? defaultExpandKey))\n  const [expansion, setExpansion] = useControllableValue<readonly Key[]>(\n    options ?? {},\n    {\n      trigger: 'onExpandedRowsChange',\n      valuePropName: 'expandedRowKeys',\n      defaultValue: defaultExpandedRowKeys ?? defaultExpandKey,\n    },\n  )\n\n  const onUpdateExpansion = useStableFn((rowData: T, shouldExpand?: boolean) => {\n    const key = getRowKey(rowData, rowKey)\n    expansionKeys.current.add(key)\n    if (shouldExpand == null) {\n      if (expansion.includes(key)) {\n        setExpansion(expansion.filter((x) => x !== key))\n        onExpand?.(false, rowData)\n      } else {\n        setExpansion([...expansion, key])\n        onExpand?.(true, rowData)\n      }\n    } else if (shouldExpand) {\n      setExpansion([...expansion, key])\n      onExpand?.(true, rowData)\n    } else {\n      setExpansion(expansion.filter((x) => x !== key))\n      onExpand?.(false, rowData)\n    }\n  })\n\n  const isFixed = isValidFixed(fixed)\n\n  const renderRow: MiddlewareRenderRow = useCallback((children, args) => {\n    const { rowData, rowIndex, columnDescriptor } = args\n\n    const isExpandable = rowExpandableRecord[rowIndex]\n    if (isExpandable) {\n      const key = getRowKey(rowData as T, rowKey)\n      const isExpanded: boolean | undefined = expansion.includes(key)\n      const isRendered = expansionKeys.current.has(key)\n\n      let className = ''\n      if (typeof expandedRowClassName === 'string') {\n        className = expandedRowClassName\n      } else if (typeof expandedRowClassName === 'function') {\n        className = expandedRowClassName(rowData as T, rowIndex, 0)\n      }\n\n      return (\n        <>\n          {children}\n          {isRendered && (\n            <ExpandRow\n              className={className}\n              rowIndex={rowIndex}\n              isExpanded={isExpanded}\n              colSpan={columnDescriptor.length}\n              fixed={isFixed}\n            >\n              {expandedRowRender?.(rowData as T, rowIndex, 0, isExpanded)}\n            </ExpandRow>\n          )}\n        </>\n      )\n    }\n    return children\n  }, [\n    isFixed,\n    rowExpandableRecord,\n    rowKey,\n    expansion,\n    expandedRowClassName,\n    expandedRowRender,\n  ])\n\n  const columns = useMemo((): ColumnType<T>[] => {\n    if (!showExpandColumn) {\n      return rawColumns\n    }\n\n    return [\n      {\n        ...extraColumnProps,\n        key: EXPANSION_COLUMN_KEY,\n        title: columnTitle,\n        width: columnWidth,\n        fixed,\n        render(_value, record, index) {\n          const key = getRowKey(record, rowKey)\n\n          const expandable = rowExpandableRecord[index] ?? false\n          const expanded = expansion.includes(key)\n\n          if (typeof expandIcon === 'function') {\n            return expandIcon({\n              expandable,\n              expanded,\n              record,\n              prefixCls: 'virtual-table',\n              onExpand: (rowData: T, _e) => {\n                onUpdateExpansion(rowData)\n              },\n            })\n          }\n\n          if (!expandable) {\n            return null\n          }\n\n          return (\n            <button\n              className={clsx(\n                'virtual-table-row-expand-icon',\n                expanded\n                  ? 'virtual-table-row-expand-icon-expanded'\n                  : 'virtual-table-row-expand-icon-collapsed',\n              )}\n              type=\"button\"\n              aria-label={expanded ? '关闭行' : '展开行'}\n              aria-expanded={expanded}\n              onClick={() => {\n                onUpdateExpansion(record, !expanded)\n              }}\n            />\n          )\n        },\n        onHeaderCell() {\n          return { className: 'virtual-table-expand-column' }\n        },\n      },\n      ...rawColumns,\n    ]\n  }, [\n    showExpandColumn,\n    columnTitle,\n    columnWidth,\n    fixed,\n    rawColumns,\n    rowKey,\n    rowExpandableRecord,\n    expansion,\n    expandIcon,\n    onUpdateExpansion,\n    extraColumnProps,\n  ])\n\n  const onRow: OnRowType<T> = useCallback((record, index) => {\n    if (rowExpandableRecord[index]) {\n      return {\n        onClick: (e) => {\n          e.stopPropagation()\n          onUpdateExpansion(record)\n        },\n      }\n    }\n    return {}\n  }, [rowExpandableRecord, onUpdateExpansion])\n\n  if (disablePlugin) {\n    return ctx\n  }\n\n  return {\n    ...ctx,\n    columns,\n    renderRow,\n    onRow: !expandRowByClick ? undefined : onRow,\n  }\n}\n\n/* eslint max-len: [\"error\", { \"code\": 120 }] */\nexport const tableExpandable = createMiddleware(useTableExpandable)\n"],"names":["ExpandRow","props","className","style","rowIndex","isExpanded","colSpan","children","fixed","updateRowHeight","useTableRowManager","tableWidth","useContainerSize","_jsx","clsx","display","undefined","ref","node","offsetHeight","width","EXPANSION_COLUMN_KEY","isExpansionColumn","column","key","useTableExpandable","ctx","options","disablePlugin","rowKey","columns","rawColumns","dataSource","defaultExpandedRowKeys","expandedRowRender","columnTitle","expandRowByClick","expandIcon","onExpand","defaultExpandAllRows","showExpandColumn","expandedRowClassName","rowExpandable","columnWidth","extraColumnProps","_rowExpandableValue","useMemo","map","row","rowExpandableRecord","useShallowMemo","defaultExpandAll","useRef","defaultExpandKey","current","expandKeys","record","index","filter","x","expansionKeys","Set","expansion","setExpansion","useControllableValue","trigger","valuePropName","defaultValue","onUpdateExpansion","useStableFn","rowData","shouldExpand","getRowKey","add","includes","isFixed","isValidFixed","renderRow","useCallback","args","columnDescriptor","isExpandable","isRendered","has","_jsxs","length","title","render","_value","expandable","expanded","prefixCls","_e","type","onClick","onHeaderCell","onRow","e","stopPropagation","tableExpandable","createMiddleware"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../packages/virtual-table/src/middleware/expandable/expand-row.tsx","../../../../packages/virtual-table/src/middleware/expandable/index.tsx"],"sourcesContent":["import type { CSSProperties, FC, Key, ReactNode } from 'react'\nimport { useContainerSize, useTableRowManager } from '@are-visual/virtual-table'\nimport clsx from 'clsx'\n\nexport interface ExpandRowProps {\n  className?: string\n  style?: CSSProperties\n  rowKey: Key\n  isExpanded?: boolean\n  colSpan?: number\n  children?: ReactNode\n  fixed?: boolean\n}\n\nexport const ExpandRowHeightKey = 'ExpandRow'\n\nconst ExpandRow: FC<ExpandRowProps> = (props) => {\n  const {\n    className,\n    style,\n    rowKey,\n    isExpanded,\n    colSpan,\n    children,\n    fixed,\n  } = props\n\n  const { setRowHeightByRowKey } = useTableRowManager()\n  const { tableWidth } = useContainerSize()\n\n  return (\n    <tr\n      className={clsx('virtual-table-expanded-row', className)}\n      style={{ ...style, display: isExpanded ? undefined : 'none' }}\n      ref={(node) => {\n        if (node == null) return\n        setRowHeightByRowKey(rowKey, ExpandRowHeightKey, node.offsetHeight)\n      }}\n    >\n      <td colSpan={colSpan}>\n        <div\n          className={clsx(\n            'virtual-table-cell',\n            fixed && 'virtual-table-expanded-row-fixed',\n          )}\n          style={{ width: tableWidth <= 0 ? undefined : tableWidth }}\n        >\n          {children}\n        </div>\n      </td>\n    </tr>\n  )\n}\n\nexport default ExpandRow\n","/* eslint-disable @typescript-eslint/no-explicit-any */\nimport type {\n  AnyObject,\n  ColumnExtra,\n  ColumnType,\n  FixedType,\n  MiddlewareContext,\n  MiddlewareRenderRow,\n  MiddlewareResult,\n  OnRowType,\n} from '@are-visual/virtual-table'\nimport type { Key, MouseEvent, ReactNode } from 'react'\nimport { createMiddleware, getRowKey, isValidFixed, useShallowMemo, useStableFn } from '@are-visual/virtual-table'\nimport { useControllableValue } from '@are-visual/virtual-table/middleware/utils/useControllableValue'\nimport clsx from 'clsx'\nimport { useCallback, useMemo, useRef } from 'react'\nimport ExpandRow, { ExpandRowHeightKey } from './expand-row'\n\ntype TriggerEventHandler<T> = (record: T, event: MouseEvent<HTMLElement>) => void\nexport interface RenderExpandIconProps<T> {\n  prefixCls: string\n  expanded: boolean\n  record: T\n  expandable: boolean\n  onExpand: TriggerEventHandler<T>\n}\nexport type RowClassName<T> = (record: T, index: number, indent: number) => string\nexport type RenderExpandIcon<T> = (props: RenderExpandIconProps<T>) => ReactNode\nexport type ExpandedRowRender<T> = (record: T, index: number, indent: number, expanded: boolean) => ReactNode\n\nexport interface ExpandableConfig<T> {\n  expandedRowKeys?: readonly Key[]\n  defaultExpandedRowKeys?: readonly Key[]\n  expandedRowRender?: ExpandedRowRender<T>\n  columnTitle?: ReactNode\n  expandRowByClick?: boolean\n  expandIcon?: RenderExpandIcon<T>\n  onExpand?: (expanded: boolean, record: T) => void\n  onExpandedRowsChange?: (expandedKeys: readonly Key[]) => void\n  defaultExpandAllRows?: boolean\n  showExpandColumn?: boolean\n  expandedRowClassName?: string | RowClassName<T>\n  rowExpandable?: (record: T) => boolean\n  columnWidth?: number | string\n  fixed?: FixedType\n  extraColumnProps?: ColumnExtra\n}\n\nexport { ExpandRowHeightKey }\nexport const EXPANSION_COLUMN_KEY = 'VirtualTable.EXPANSION_COLUMN'\n\nexport function isExpansionColumn<T = any>(column: ColumnType<T>) {\n  return column.key === EXPANSION_COLUMN_KEY\n}\n\nfunction useTableExpandable<T = any>(\n  ctx: MiddlewareContext<T>,\n  options?: ExpandableConfig<T>,\n): MiddlewareResult<T> {\n  const disablePlugin = options == null\n\n  const { rowKey, columns: rawColumns, dataSource } = ctx\n  const {\n    // expandedRowKeys,\n    // onExpandedRowsChange,\n    defaultExpandedRowKeys,\n    expandedRowRender,\n    columnTitle,\n    expandRowByClick = false,\n    expandIcon,\n    onExpand,\n\n    defaultExpandAllRows = false,\n\n    // TODO: 未实现\n    // indentSize: _indentSize,\n\n    showExpandColumn = true,\n    expandedRowClassName,\n\n    rowExpandable,\n    columnWidth = 50,\n    fixed,\n    extraColumnProps,\n  } = options ?? {}\n\n  const _rowExpandableValue = useMemo(() => {\n    return dataSource.map((row) => {\n      if (!rowExpandable) return false\n      return rowExpandable(row)\n    })\n  }, [dataSource, rowExpandable])\n\n  // useShallowMemo 每一次渲染时候都会重新求值，这对于某些开销较大的计算不太友好，\n  // 所以使用 useMemo 求值再通过 useShallowMemo 浅比较\n  // useMemo 标记 deps 后，若 deps 不变也就不需要重新求值\n  // 使用 useShallowMemo 主要是为了防止重新求值后结果不变但地址指针变化，导致不必要的渲染\n  const rowExpandableRecord = useShallowMemo(() => _rowExpandableValue)\n\n  // 即使 defaultExpandAllRows 变更之后，此插件也不要响应变化，只使用初始值，所以存储一下\n  const defaultExpandAll = useRef(\n    // options 中有 expandedRowKeys 则表示受控模式，那么 defaultExpandAllRows 不生效\n    'expandedRowKeys' in (options ?? {}) || 'defaultExpandedRowKeys' in (options ?? {})\n      ? false\n      : defaultExpandAllRows,\n  )\n  const defaultExpandKey = useShallowMemo((): readonly Key[] => {\n    if (defaultExpandAll.current) {\n      const expandKeys = dataSource.map((record, index): Key | null => {\n        if (rowExpandableRecord[index]) {\n          const key = (record as AnyObject)[rowKey as string] as string | number\n          return key\n        }\n        return null\n      })\n      return expandKeys.filter((x) => x != null)\n    }\n    return []\n  })\n\n  const expansionKeys = useRef(new Set<Key>(defaultExpandedRowKeys ?? defaultExpandKey))\n  const [expansion, setExpansion] = useControllableValue<readonly Key[]>(\n    options ?? {},\n    {\n      trigger: 'onExpandedRowsChange',\n      valuePropName: 'expandedRowKeys',\n      defaultValue: defaultExpandedRowKeys ?? defaultExpandKey,\n    },\n  )\n\n  const onUpdateExpansion = useStableFn((rowData: T, shouldExpand?: boolean) => {\n    const key = getRowKey(rowData, rowKey)\n    expansionKeys.current.add(key)\n    if (shouldExpand == null) {\n      if (expansion.includes(key)) {\n        setExpansion(expansion.filter((x) => x !== key))\n        onExpand?.(false, rowData)\n      } else {\n        setExpansion([...expansion, key])\n        onExpand?.(true, rowData)\n      }\n    } else if (shouldExpand) {\n      setExpansion([...expansion, key])\n      onExpand?.(true, rowData)\n    } else {\n      setExpansion(expansion.filter((x) => x !== key))\n      onExpand?.(false, rowData)\n    }\n  })\n\n  const isFixed = isValidFixed(fixed)\n\n  const renderRow: MiddlewareRenderRow = useCallback((children, args) => {\n    const { rowData, rowIndex, rowKey: key, columnDescriptor } = args\n\n    const isExpandable = rowExpandableRecord[rowIndex]\n    if (isExpandable) {\n      const isExpanded: boolean | undefined = expansion.includes(key)\n      const isRendered = expansionKeys.current.has(key)\n\n      let className = ''\n      if (typeof expandedRowClassName === 'string') {\n        className = expandedRowClassName\n      } else if (typeof expandedRowClassName === 'function') {\n        className = expandedRowClassName(rowData as T, rowIndex, 0)\n      }\n\n      return (\n        <>\n          {children}\n          {isRendered && (\n            <ExpandRow\n              className={className}\n              rowKey={key}\n              isExpanded={isExpanded}\n              colSpan={columnDescriptor.length}\n              fixed={isFixed}\n            >\n              {expandedRowRender?.(rowData as T, rowIndex, 0, isExpanded)}\n            </ExpandRow>\n          )}\n        </>\n      )\n    }\n    return children\n  }, [\n    isFixed,\n    rowExpandableRecord,\n    expansion,\n    expandedRowClassName,\n    expandedRowRender,\n  ])\n\n  const columns = useMemo((): ColumnType<T>[] => {\n    if (!showExpandColumn) {\n      return rawColumns\n    }\n\n    return [\n      {\n        ...extraColumnProps,\n        key: EXPANSION_COLUMN_KEY,\n        title: columnTitle,\n        width: columnWidth,\n        fixed,\n        render(_value, record, index) {\n          const key = getRowKey(record, rowKey)\n\n          const expandable = rowExpandableRecord[index] ?? false\n          const expanded = expansion.includes(key)\n\n          if (typeof expandIcon === 'function') {\n            return expandIcon({\n              expandable,\n              expanded,\n              record,\n              prefixCls: 'virtual-table',\n              onExpand: (rowData: T, _e) => {\n                onUpdateExpansion(rowData)\n              },\n            })\n          }\n\n          if (!expandable) {\n            return null\n          }\n\n          return (\n            <button\n              className={clsx(\n                'virtual-table-row-expand-icon',\n                expanded\n                  ? 'virtual-table-row-expand-icon-expanded'\n                  : 'virtual-table-row-expand-icon-collapsed',\n              )}\n              type=\"button\"\n              aria-label={expanded ? '关闭行' : '展开行'}\n              aria-expanded={expanded}\n              onClick={() => {\n                onUpdateExpansion(record, !expanded)\n              }}\n            />\n          )\n        },\n        onHeaderCell() {\n          return { className: 'virtual-table-expand-column' }\n        },\n      },\n      ...rawColumns,\n    ]\n  }, [\n    showExpandColumn,\n    columnTitle,\n    columnWidth,\n    fixed,\n    rawColumns,\n    rowKey,\n    rowExpandableRecord,\n    expansion,\n    expandIcon,\n    onUpdateExpansion,\n    extraColumnProps,\n  ])\n\n  const onRow: OnRowType<T> = useCallback((record, index) => {\n    if (rowExpandableRecord[index]) {\n      return {\n        onClick: (e) => {\n          e.stopPropagation()\n          onUpdateExpansion(record)\n        },\n      }\n    }\n    return {}\n  }, [rowExpandableRecord, onUpdateExpansion])\n\n  if (disablePlugin) {\n    return ctx\n  }\n\n  return {\n    ...ctx,\n    columns,\n    renderRow,\n    onRow: !expandRowByClick ? undefined : onRow,\n  }\n}\n\nexport const tableExpandable = createMiddleware(useTableExpandable)\n"],"names":["ExpandRowHeightKey","ExpandRow","props","className","style","rowKey","isExpanded","colSpan","children","fixed","setRowHeightByRowKey","useTableRowManager","tableWidth","useContainerSize","_jsx","clsx","display","undefined","ref","node","offsetHeight","width","EXPANSION_COLUMN_KEY","isExpansionColumn","column","key","useTableExpandable","ctx","options","disablePlugin","columns","rawColumns","dataSource","defaultExpandedRowKeys","expandedRowRender","columnTitle","expandRowByClick","expandIcon","onExpand","defaultExpandAllRows","showExpandColumn","expandedRowClassName","rowExpandable","columnWidth","extraColumnProps","_rowExpandableValue","useMemo","map","row","rowExpandableRecord","useShallowMemo","defaultExpandAll","useRef","defaultExpandKey","current","expandKeys","record","index","filter","x","expansionKeys","Set","expansion","setExpansion","useControllableValue","trigger","valuePropName","defaultValue","onUpdateExpansion","useStableFn","rowData","shouldExpand","getRowKey","add","includes","isFixed","isValidFixed","renderRow","useCallback","args","rowIndex","columnDescriptor","isExpandable","isRendered","has","_jsxs","length","title","render","_value","expandable","expanded","prefixCls","_e","type","onClick","onHeaderCell","onRow","e","stopPropagation","tableExpandable","createMiddleware"],"mappings":"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"}

package/middleware/loading/index.js

@@ -1,6 +1,6 @@
 import { jsx } from 'react/jsx-runtime';
 import { getKey, useTableSticky, isValidFixedRight, isValidFixedLeft, isValidFixed, useTableRowManager, findLastIndex, createMiddleware, onResize } from '@are-visual/virtual-table';
-import { memo, useState, useEffect, useMemo } from 'react';
+import { memo, useState, useEffect, useMemo, isValidElement, cloneElement } from 'react';
 import clsx from 'clsx';
 
 function LoadingCell(props) {
@@ -33,10 +33,10 @@ function LoadingRow(props) {
   const {
     descriptor,
     style,
-    rowIndex
+    rowKey
   } = props;
   const {
-    updateRowHeight
+    setRowHeightByRowKey
   } = useTableRowManager();
   const lastFixedLeftColumnIndex = findLastIndex(descriptor, x => {
     if (x.type === 'blank') {
@@ -55,7 +55,7 @@ function LoadingRow(props) {
     style: style,
     ref: node => {
       if (node == null) return;
-      updateRowHeight(rowIndex, rowIndex, node.offsetHeight);
+      setRowHeightByRowKey(rowKey, 'loading-tr', node.offsetHeight);
     },
     children: descriptor.map((item, index) => {
       const {
@@ -76,7 +76,6 @@ function LoadingRow(props) {
 }
 var LoadingRow$1 = /*#__PURE__*/memo(LoadingRow);
 
-const EMPTY_ARR = [];
 function useTableLoading(ctx, options) {
   const {
     loading = false
@@ -113,7 +112,21 @@ function useTableLoading(ctx, options) {
   }
   return {
     ...ctx,
-    dataSource: EMPTY_ARR,
+    renderBodyRoot: children => {
+      if (/*#__PURE__*/isValidElement(children)) {
+        if (Object.prototype.hasOwnProperty.call(children.props, 'style')) {
+          const style = children.props.style;
+          return /*#__PURE__*/cloneElement(children, {
+            style: {
+              ...style,
+              paddingBottom: undefined,
+              paddingTop: undefined
+            }
+          });
+        }
+      }
+      return children;
+    },
     renderBodyContent: (_ignore, _ref2) => {
       let {
         columnDescriptor,
@@ -125,7 +138,7 @@ function useTableLoading(ctx, options) {
             height: estimatedRowHeight
           },
           descriptor: columnDescriptor,
-          rowIndex: index + startRowIndex
+          rowKey: `__loading$-${index + startRowIndex}`
         }, item.key);
       });
     }

package/middleware/loading/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../packages/virtual-table/src/middleware/loading/cell.tsx","../../../../packages/virtual-table/src/middleware/loading/row.tsx","../../../../packages/virtual-table/src/middleware/loading/index.tsx"],"sourcesContent":["import type { ColumnType } from '@are-visual/virtual-table'\nimport type { ReactElement } from 'react'\nimport { getKey, isValidFixed, isValidFixedLeft, isValidFixedRight, useTableSticky } from '@are-visual/virtual-table'\nimport clsx from 'clsx'\nimport { memo } from 'react'\n\nexport interface CellProps<T> {\n  className?: string\n  column: ColumnType<T>\n}\n\nfunction LoadingCell<T>(props: CellProps<T>) {\n  const { column, className } = props\n\n  const { align, fixed } = column\n  const key = getKey(column)\n  const { size: stickySizes } = useTableSticky()\n\n  return (\n    <td\n      className={clsx(\n        'virtual-table-cell',\n        className,\n        align != null && `virtual-table-align-${align}`,\n        isValidFixed(fixed) && 'virtual-table-sticky-cell',\n      )}\n      style={{\n        left: isValidFixedLeft(fixed) ? stickySizes.get(key) : undefined,\n        right: isValidFixedRight(fixed) ? stickySizes.get(key) : undefined,\n      }}\n    >\n      <div className=\"virtual-table-loading-skeleton\" />\n    </td>\n  )\n}\n\nexport default memo(LoadingCell) as <T>(props: CellProps<T>) => ReactElement\n","import type { ColumnDescriptor } from '@are-visual/virtual-table'\nimport type { CSSProperties, ReactElement } from 'react'\nimport { findLastIndex, isValidFixedLeft, isValidFixedRight, useTableRowManager } from '@are-visual/virtual-table'\nimport clsx from 'clsx'\nimport { memo } from 'react'\nimport LoadingCell from './cell'\n\nexport interface RowProps<T> {\n  style?: CSSProperties\n  descriptor: ColumnDescriptor<T>[]\n  rowIndex: number\n}\n\nfunction LoadingRow<T>(props: RowProps<T>) {\n  const { descriptor, style, rowIndex } = props\n\n  const { updateRowHeight } = useTableRowManager()\n\n  const lastFixedLeftColumnIndex = findLastIndex(descriptor, (x) => {\n    if (x.type === 'blank') {\n      return false\n    }\n    return isValidFixedLeft(x.column.fixed)\n  })\n  const firstFixedRightColumnIndex = descriptor.findIndex((x) => {\n    if (x.type === 'blank') {\n      return false\n    }\n    return isValidFixedRight(x.column.fixed)\n  })\n\n  return (\n    <tr\n      className=\"virtual-table-row virtual-table-loading-cell\"\n      style={style}\n      ref={(node) => {\n        if (node == null) return\n        updateRowHeight(rowIndex, rowIndex, node.offsetHeight)\n      }}\n    >\n      {descriptor.map((item, index) => {\n        const { key } = item\n        if (item.type === 'blank') {\n          return <td key={key} />\n        }\n        const { column } = item\n        return (\n          <LoadingCell\n            key={key}\n            className={clsx(\n              lastFixedLeftColumnIndex === index && 'virtual-table-cell-fix-left-last',\n              firstFixedRightColumnIndex === index\n              && 'virtual-table-cell-fix-right-first',\n            )}\n            column={column}\n          />\n        )\n      })}\n    </tr>\n  )\n}\n\nexport default memo(LoadingRow) as <T>(props: RowProps<T>) => ReactElement\n","/* eslint-disable @typescript-eslint/no-explicit-any */\nimport type { MiddlewareContext, MiddlewareResult } from '@are-visual/virtual-table'\nimport { createMiddleware, onResize } from '@are-visual/virtual-table'\nimport { useEffect, useMemo, useState } from 'react'\nimport LoadingRow from './row'\n\nconst EMPTY_ARR: unknown[] = []\n\nfunction useTableLoading<T = any>(\n  ctx: MiddlewareContext<T>,\n  options?: { loading?: boolean },\n): MiddlewareResult<T> {\n  const { loading = false } = options ?? {}\n  const { estimatedRowHeight, headerWrapperRef, getScroller } = ctx\n\n  const [count, setCount] = useState(10)\n\n  useEffect(() => {\n    const header = headerWrapperRef.current\n    const container = getScroller()\n    if (container == null) return\n    return onResize(container, ({ height }) => {\n      const headerHeight = header?.offsetHeight ?? 0\n      setCount(Math.ceil((height - headerHeight) / estimatedRowHeight))\n    })\n  }, [getScroller, headerWrapperRef, estimatedRowHeight])\n\n  const fakeDataSource = useMemo(() => {\n    return Array.from({ length: count }, (_, index) => {\n      return { key: index }\n    })\n  }, [count])\n\n  if (!loading) {\n    return ctx\n  }\n\n  return {\n    ...ctx,\n    dataSource: EMPTY_ARR as T[],\n    renderBodyContent: (_ignore, { columnDescriptor, startRowIndex }) => {\n      return fakeDataSource.map((item, index) => {\n        return (\n          <LoadingRow\n            key={item.key}\n            style={{ height: estimatedRowHeight }}\n            descriptor={columnDescriptor}\n            rowIndex={index + startRowIndex}\n          />\n        )\n      })\n    },\n  }\n}\n\nexport const tableLoading = createMiddleware(useTableLoading)\n"],"names":["LoadingCell","props","column","className","align","fixed","key","getKey","size","stickySizes","useTableSticky","_jsx","clsx","isValidFixed","style","left","isValidFixedLeft","get","undefined","right","isValidFixedRight","children","memo","LoadingRow","descriptor","rowIndex","updateRowHeight","useTableRowManager","lastFixedLeftColumnIndex","findLastIndex","x","type","firstFixedRightColumnIndex","findIndex","ref","node","offsetHeight","map","item","index","EMPTY_ARR","useTableLoading","ctx","options","loading","estimatedRowHeight","headerWrapperRef","getScroller","count","setCount","useState","useEffect","header","current","container","onResize","_ref","height","headerHeight","Math","ceil","fakeDataSource","useMemo","Array","from","length","_","dataSource","renderBodyContent","_ignore","_ref2","columnDescriptor","startRowIndex","tableLoading","createMiddleware"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../packages/virtual-table/src/middleware/loading/cell.tsx","../../../../packages/virtual-table/src/middleware/loading/row.tsx","../../../../packages/virtual-table/src/middleware/loading/index.tsx"],"sourcesContent":["import type { ColumnType } from '@are-visual/virtual-table'\nimport type { ReactElement } from 'react'\nimport { getKey, isValidFixed, isValidFixedLeft, isValidFixedRight, useTableSticky } from '@are-visual/virtual-table'\nimport clsx from 'clsx'\nimport { memo } from 'react'\n\nexport interface CellProps<T> {\n  className?: string\n  column: ColumnType<T>\n}\n\nfunction LoadingCell<T>(props: CellProps<T>) {\n  const { column, className } = props\n\n  const { align, fixed } = column\n  const key = getKey(column)\n  const { size: stickySizes } = useTableSticky()\n\n  return (\n    <td\n      className={clsx(\n        'virtual-table-cell',\n        className,\n        align != null && `virtual-table-align-${align}`,\n        isValidFixed(fixed) && 'virtual-table-sticky-cell',\n      )}\n      style={{\n        left: isValidFixedLeft(fixed) ? stickySizes.get(key) : undefined,\n        right: isValidFixedRight(fixed) ? stickySizes.get(key) : undefined,\n      }}\n    >\n      <div className=\"virtual-table-loading-skeleton\" />\n    </td>\n  )\n}\n\nexport default memo(LoadingCell) as <T>(props: CellProps<T>) => ReactElement\n","import type { ColumnDescriptor } from '@are-visual/virtual-table'\nimport type { CSSProperties, Key, ReactElement } from 'react'\nimport { findLastIndex, isValidFixedLeft, isValidFixedRight, useTableRowManager } from '@are-visual/virtual-table'\nimport clsx from 'clsx'\nimport { memo } from 'react'\nimport LoadingCell from './cell'\n\nexport interface RowProps<T> {\n  style?: CSSProperties\n  descriptor: ColumnDescriptor<T>[]\n  rowKey: Key\n}\n\nfunction LoadingRow<T>(props: RowProps<T>) {\n  const { descriptor, style, rowKey } = props\n\n  const { setRowHeightByRowKey } = useTableRowManager()\n\n  const lastFixedLeftColumnIndex = findLastIndex(descriptor, (x) => {\n    if (x.type === 'blank') {\n      return false\n    }\n    return isValidFixedLeft(x.column.fixed)\n  })\n  const firstFixedRightColumnIndex = descriptor.findIndex((x) => {\n    if (x.type === 'blank') {\n      return false\n    }\n    return isValidFixedRight(x.column.fixed)\n  })\n\n  return (\n    <tr\n      className=\"virtual-table-row virtual-table-loading-cell\"\n      style={style}\n      ref={(node) => {\n        if (node == null) return\n        setRowHeightByRowKey(rowKey, 'loading-tr', node.offsetHeight)\n      }}\n    >\n      {descriptor.map((item, index) => {\n        const { key } = item\n        if (item.type === 'blank') {\n          return <td key={key} />\n        }\n        const { column } = item\n        return (\n          <LoadingCell\n            key={key}\n            className={clsx(\n              lastFixedLeftColumnIndex === index && 'virtual-table-cell-fix-left-last',\n              firstFixedRightColumnIndex === index\n              && 'virtual-table-cell-fix-right-first',\n            )}\n            column={column}\n          />\n        )\n      })}\n    </tr>\n  )\n}\n\nexport default memo(LoadingRow) as <T>(props: RowProps<T>) => ReactElement\n","/* eslint-disable @typescript-eslint/no-explicit-any */\nimport type { MiddlewareContext, MiddlewareResult } from '@are-visual/virtual-table'\nimport type { CSSProperties, ReactElement } from 'react'\nimport { createMiddleware, onResize } from '@are-visual/virtual-table'\nimport { cloneElement, isValidElement, useEffect, useMemo, useState } from 'react'\nimport LoadingRow from './row'\n\nfunction useTableLoading<T = any>(\n  ctx: MiddlewareContext<T>,\n  options?: { loading?: boolean },\n): MiddlewareResult<T> {\n  const { loading = false } = options ?? {}\n  const { estimatedRowHeight, headerWrapperRef, getScroller } = ctx\n\n  const [count, setCount] = useState(10)\n\n  useEffect(() => {\n    const header = headerWrapperRef.current\n    const container = getScroller()\n    if (container == null) return\n    return onResize(container, ({ height }) => {\n      const headerHeight = header?.offsetHeight ?? 0\n      setCount(Math.ceil((height - headerHeight) / estimatedRowHeight))\n    })\n  }, [getScroller, headerWrapperRef, estimatedRowHeight])\n\n  const fakeDataSource = useMemo(() => {\n    return Array.from({ length: count }, (_, index) => {\n      return { key: index }\n    })\n  }, [count])\n\n  if (!loading) {\n    return ctx\n  }\n\n  return {\n    ...ctx,\n    renderBodyRoot: (children) => {\n      if (isValidElement(children)) {\n        if (Object.prototype.hasOwnProperty.call(children.props, 'style')) {\n          const style = (children.props as { style: CSSProperties }).style\n          return cloneElement(children as ReactElement<{ style: CSSProperties }>, {\n            style: {\n              ...style,\n              paddingBottom: undefined,\n              paddingTop: undefined,\n            },\n          })\n        }\n      }\n      return children\n    },\n    renderBodyContent: (_ignore, { columnDescriptor, startRowIndex }) => {\n      return fakeDataSource.map((item, index) => {\n        return (\n          <LoadingRow\n            key={item.key}\n            style={{ height: estimatedRowHeight }}\n            descriptor={columnDescriptor}\n            rowKey={`__loading$-${index + startRowIndex}`}\n          />\n        )\n      })\n    },\n  }\n}\n\nexport const tableLoading = createMiddleware(useTableLoading)\n"],"names":["LoadingCell","props","column","className","align","fixed","key","getKey","size","stickySizes","useTableSticky","_jsx","clsx","isValidFixed","style","left","isValidFixedLeft","get","undefined","right","isValidFixedRight","children","memo","LoadingRow","descriptor","rowKey","setRowHeightByRowKey","useTableRowManager","lastFixedLeftColumnIndex","findLastIndex","x","type","firstFixedRightColumnIndex","findIndex","ref","node","offsetHeight","map","item","index","useTableLoading","ctx","options","loading","estimatedRowHeight","headerWrapperRef","getScroller","count","setCount","useState","useEffect","header","current","container","onResize","_ref","height","headerHeight","Math","ceil","fakeDataSource","useMemo","Array","from","length","_","renderBodyRoot","isValidElement","Object","prototype","hasOwnProperty","call","cloneElement","paddingBottom","paddingTop","renderBodyContent","_ignore","_ref2","columnDescriptor","startRowIndex","tableLoading","createMiddleware"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@are-visual/virtual-table",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "main": "./index.esm.js",
   "types": "./index.d.ts",
   "sideEffects": false,