element-plus/es/components/table-v2/src/composables/use-row.mjs.map

A Component Library for Vue 3

{"version":3,"file":"use-row.mjs","names":[],"sources":["../../../../../../../packages/components/table-v2/src/composables/use-row.ts"],"sourcesContent":["import {\n  computed,\n  getCurrentInstance,\n  nextTick,\n  ref,\n  shallowRef,\n  unref,\n} from 'vue'\nimport { debounce } from 'lodash-unified'\nimport { isNumber } from '@element-plus/utils'\nimport { FixedDir } from '../constants'\n\nimport type { ComponentInternalInstance, Ref, ShallowRef } from 'vue'\nimport type { TableV2Props } from '../table'\nimport type {\n  RowExpandParams,\n  RowHeightChangedParams,\n  RowHoverParams,\n} from '../row'\nimport type { FixedDirection, KeyType } from '../types'\nimport type { onRowRenderedParams } from '../grid'\nimport type { TableGridInstance } from '../table-grid'\nimport type { UseNamespaceReturn } from '@element-plus/hooks'\n\ntype Heights = Record<KeyType, number>\ntype GridInstanceRef = Ref<TableGridInstance | undefined>\n\ntype UseRowProps = {\n  mainTableRef: GridInstanceRef\n  leftTableRef: GridInstanceRef\n  rightTableRef: GridInstanceRef\n  tableInstance: ComponentInternalInstance\n  ns: UseNamespaceReturn\n  isScrolling: ShallowRef<boolean>\n}\n\nexport const useRow = (\n  props: TableV2Props,\n  {\n    mainTableRef,\n    leftTableRef,\n    rightTableRef,\n    tableInstance,\n    ns,\n    isScrolling,\n  }: UseRowProps\n) => {\n  const vm = getCurrentInstance()!\n  const { emit } = vm\n  const isResetting = shallowRef(false)\n  const expandedRowKeys = ref<KeyType[]>(props.defaultExpandedRowKeys || [])\n  const lastRenderedRowIndex = ref(-1)\n  const resetIndex = shallowRef<number | null>(null)\n  const rowHeights = ref<Heights>({})\n  const pendingRowHeights = ref<Heights>({})\n  const leftTableHeights = shallowRef<Heights>({})\n  const mainTableHeights = shallowRef<Heights>({})\n  const rightTableHeights = shallowRef<Heights>({})\n  const isDynamic = computed(() => isNumber(props.estimatedRowHeight))\n\n  function onRowsRendered(params: onRowRenderedParams) {\n    props.onRowsRendered?.(params)\n\n    if (params.rowCacheEnd > unref(lastRenderedRowIndex)) {\n      lastRenderedRowIndex.value = params.rowCacheEnd\n    }\n  }\n\n  function onRowHovered({ hovered, rowKey }: RowHoverParams) {\n    if (isScrolling.value) {\n      return\n    }\n    const tableRoot = tableInstance!.vnode.el as HTMLElement\n    const rows = tableRoot.querySelectorAll(`[rowkey=\"${String(rowKey)}\"]`)\n    rows.forEach((row) => {\n      if (hovered) {\n        row.classList.add(ns.is('hovered'))\n      } else {\n        row.classList.remove(ns.is('hovered'))\n      }\n    })\n  }\n\n  function onRowExpanded({\n    expanded,\n    rowData,\n    rowIndex,\n    rowKey,\n  }: RowExpandParams) {\n    const _expandedRowKeys = [...unref(expandedRowKeys)]\n    const currentKeyIndex = _expandedRowKeys.indexOf(rowKey)\n    if (expanded) {\n      if (currentKeyIndex === -1) _expandedRowKeys.push(rowKey)\n    } else {\n      if (currentKeyIndex > -1) _expandedRowKeys.splice(currentKeyIndex, 1)\n    }\n    expandedRowKeys.value = _expandedRowKeys\n\n    emit('update:expandedRowKeys', _expandedRowKeys)\n    props.onRowExpand?.({\n      expanded,\n      rowData,\n      rowIndex,\n      rowKey,\n    })\n    // If this is not controlled, then use this to notify changes\n    props.onExpandedRowsChange?.(_expandedRowKeys)\n\n    const tableRoot = tableInstance!.vnode.el as HTMLElement\n    const hoverRow = tableRoot.querySelector(\n      `.${ns.is('hovered')}[rowkey=\"${String(rowKey)}\"]`\n    )\n    if (hoverRow) {\n      nextTick(() => onRowHovered({ hovered: true, rowKey }))\n    }\n  }\n\n  const flushingRowHeights = debounce(() => {\n    isResetting.value = true\n    rowHeights.value = { ...unref(rowHeights), ...unref(pendingRowHeights) }\n    resetAfterIndex(unref(resetIndex)!, false)\n    pendingRowHeights.value = {}\n    // force update\n    resetIndex.value = null\n    mainTableRef.value?.forceUpdate()\n    leftTableRef.value?.forceUpdate()\n    rightTableRef.value?.forceUpdate()\n    vm.proxy?.$forceUpdate()\n    isResetting.value = false\n  }, 0)\n\n  function resetAfterIndex(index: number, forceUpdate = false) {\n    if (!unref(isDynamic)) return\n    ;[mainTableRef, leftTableRef, rightTableRef].forEach((tableRef) => {\n      const table = unref(tableRef)\n      if (table) table.resetAfterRowIndex(index, forceUpdate)\n    })\n  }\n\n  function resetHeights(rowKey: KeyType, height: number, rowIdx: number) {\n    const resetIdx = unref(resetIndex)\n    if (resetIdx === null) {\n      resetIndex.value = rowIdx\n    } else {\n      if (resetIdx > rowIdx) {\n        resetIndex.value = rowIdx\n      }\n    }\n\n    pendingRowHeights.value[rowKey] = height\n  }\n\n  function onRowHeightChange(\n    { rowKey, height, rowIndex }: RowHeightChangedParams,\n    fixedDir: FixedDirection\n  ) {\n    if (!fixedDir) {\n      mainTableHeights.value[rowKey] = height\n    } else {\n      if (fixedDir === FixedDir.RIGHT) {\n        rightTableHeights.value[rowKey] = height\n      } else {\n        leftTableHeights.value[rowKey] = height\n      }\n    }\n\n    const maximumHeight = Math.max(\n      ...[leftTableHeights, rightTableHeights, mainTableHeights].map(\n        (records) => records.value[rowKey] || 0\n      )\n    )\n\n    if (unref(rowHeights)[rowKey] !== maximumHeight) {\n      resetHeights(rowKey, maximumHeight, rowIndex)\n      flushingRowHeights()\n    }\n  }\n\n  return {\n    expandedRowKeys,\n    lastRenderedRowIndex,\n    isDynamic,\n    isResetting,\n    rowHeights,\n\n    resetAfterIndex,\n    onRowExpanded,\n    onRowHovered,\n    onRowsRendered,\n    onRowHeightChange,\n  }\n}\n\nexport type UseRowReturn = ReturnType<typeof useRow>\n"],"mappings":"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"}