@qsxy/element-plus-react 1.0.3 → 2.0.0

package/dist/TableV2/src/table-v2.js

@@ -0,0 +1,311 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import { useClassNames } from "../../hooks";
+import React, { forwardRef, useImperativeHandle, useMemo } from 'react';
+import { TableV2Context } from "./tokens";
+import { useTable } from "./use-table";
+// renderers
+import Cell from "./renderers/cell";
+import Empty from "./renderers/empty";
+import Footer from "./renderers/footer";
+import Header from "./renderers/header";
+import HeaderCell from "./renderers/header-cell";
+import LeftTable from "./renderers/left-table";
+import MainTable from "./renderers/main-table";
+import Overlay from "./renderers/overlay";
+import RightTable from "./renderers/right-table";
+import Row from "./renderers/row";
+import { mergeDefaultProps } from "../../Util";
+import classNames from 'classnames';
+var COMPONENT_NAME = 'ElTableV2';
+var TableV2 = /*#__PURE__*/forwardRef(function (props, ref) {
+  props = mergeDefaultProps({
+    cache: 2,
+    headerHeight: 50,
+    footerHeight: 0,
+    rowHeight: 50,
+    rowKey: 'id',
+    indentSize: 12,
+    hScrollbarSize: 6,
+    vScrollbarSize: 6,
+    sortBy: {},
+    sortState: undefined
+  }, props);
+  var ns = useClassNames('table-v2');
+  var _useTable = useTable(props),
+    columnsStyles = _useTable.columnsStyles,
+    fixedColumnsOnLeft = _useTable.fixedColumnsOnLeft,
+    fixedColumnsOnRight = _useTable.fixedColumnsOnRight,
+    mainColumns = _useTable.mainColumns,
+    mainTableHeight = _useTable.mainTableHeight,
+    fixedTableHeight = _useTable.fixedTableHeight,
+    leftTableWidth = _useTable.leftTableWidth,
+    rightTableWidth = _useTable.rightTableWidth,
+    data = _useTable.data,
+    depthMap = _useTable.depthMap,
+    expandedRowKeys = _useTable.expandedRowKeys,
+    hasFixedColumns = _useTable.hasFixedColumns,
+    mainTableRef = _useTable.mainTableRef,
+    leftTableRef = _useTable.leftTableRef,
+    rightTableRef = _useTable.rightTableRef,
+    isDynamic = _useTable.isDynamic,
+    isResetting = _useTable.isResetting,
+    isScrolling = _useTable.isScrolling,
+    bodyWidth = _useTable.bodyWidth,
+    emptyStyle = _useTable.emptyStyle,
+    rootStyle = _useTable.rootStyle,
+    footerHeight = _useTable.footerHeight,
+    showEmpty = _useTable.showEmpty,
+    scrollTo = _useTable.scrollTo,
+    scrollToLeft = _useTable.scrollToLeft,
+    scrollToTop = _useTable.scrollToTop,
+    scrollToRow = _useTable.scrollToRow,
+    getRowHeight = _useTable.getRowHeight,
+    onColumnSorted = _useTable.onColumnSorted,
+    onRowHeightChange = _useTable.onRowHeightChange,
+    onRowHovered = _useTable.onRowHovered,
+    onRowExpanded = _useTable.onRowExpanded,
+    onRowsRendered = _useTable.onRowsRendered,
+    onScroll = _useTable.onScroll,
+    onVerticalScroll = _useTable.onVerticalScroll;
+
+  // Expose methods via ref
+  useImperativeHandle(ref, function () {
+    return {
+      scrollTo: scrollTo,
+      scrollToLeft: scrollToLeft,
+      scrollToTop: scrollToTop,
+      scrollToRow: scrollToRow
+    };
+  }, [scrollTo, scrollToLeft, scrollToTop, scrollToRow]);
+
+  // Provide context to child components
+  var contextValue = useMemo(function () {
+    return {
+      ns: ns,
+      isResetting: isResetting,
+      isScrolling: isScrolling
+    };
+  }, [ns, isResetting, isScrolling]);
+  var _props = props,
+    cache = _props.cache,
+    cellProps = _props.cellProps,
+    estimatedRowHeight = _props.estimatedRowHeight,
+    expandColumnKey = _props.expandColumnKey,
+    fixedData = _props.fixedData,
+    headerHeight = _props.headerHeight,
+    headerClass = _props.headerClass,
+    headerProps = _props.headerProps,
+    headerCellProps = _props.headerCellProps,
+    sortBy = _props.sortBy,
+    sortState = _props.sortState,
+    rowHeight = _props.rowHeight,
+    rowClass = _props.rowClass,
+    rowEventHandlers = _props.rowEventHandlers,
+    rowKey = _props.rowKey,
+    rowProps = _props.rowProps,
+    scrollbarAlwaysOn = _props.scrollbarAlwaysOn,
+    indentSize = _props.indentSize,
+    iconSize = _props.iconSize,
+    useIsScrolling = _props.useIsScrolling,
+    vScrollbarSize = _props.vScrollbarSize,
+    width = _props.width,
+    className = _props.className,
+    _rowFormatter = _props.rowFormatter,
+    _cellFormatter = _props.cellFormatter,
+    _headerFormatter = _props.headerFormatter,
+    headerCellFormatter = _props.headerCellFormatter,
+    footer = _props.footer,
+    empty = _props.empty,
+    overlay = _props.overlay;
+  var mainTableProps = useMemo(function () {
+    return {
+      cache: cache,
+      className: ns.e('main'),
+      columns: mainColumns,
+      data: data,
+      fixedData: fixedData,
+      estimatedRowHeight: estimatedRowHeight,
+      bodyWidth: bodyWidth,
+      headerHeight: headerHeight,
+      headerWidth: bodyWidth,
+      height: mainTableHeight,
+      mainTableRef: mainTableRef,
+      rowKey: rowKey,
+      rowHeight: rowHeight,
+      scrollbarAlwaysOn: scrollbarAlwaysOn,
+      scrollbarStartGap: 2,
+      scrollbarEndGap: vScrollbarSize,
+      useIsScrolling: useIsScrolling,
+      width: width,
+      getRowHeight: getRowHeight,
+      onRowsRendered: onRowsRendered,
+      onScroll: onScroll
+    };
+  }, [cache, ns, mainColumns, data, fixedData, estimatedRowHeight, bodyWidth, headerHeight, mainTableHeight, mainTableRef, rowKey, rowHeight, scrollbarAlwaysOn, vScrollbarSize, useIsScrolling, width, getRowHeight, onRowsRendered, onScroll]);
+  var leftColumnsWidth = leftTableWidth;
+  var _fixedTableHeight = fixedTableHeight;
+  var leftTableProps = useMemo(function () {
+    return {
+      cache: cache,
+      className: ns.e('left'),
+      columns: fixedColumnsOnLeft,
+      data: data,
+      fixedData: fixedData,
+      estimatedRowHeight: estimatedRowHeight,
+      leftTableRef: leftTableRef,
+      rowHeight: rowHeight,
+      bodyWidth: leftColumnsWidth,
+      headerWidth: leftColumnsWidth,
+      headerHeight: headerHeight,
+      height: _fixedTableHeight,
+      rowKey: rowKey,
+      scrollbarAlwaysOn: scrollbarAlwaysOn,
+      scrollbarStartGap: 2,
+      scrollbarEndGap: vScrollbarSize,
+      useIsScrolling: useIsScrolling,
+      width: leftColumnsWidth,
+      getRowHeight: getRowHeight,
+      onScroll: onVerticalScroll
+    };
+  }, [cache, ns, fixedColumnsOnLeft, data, fixedData, estimatedRowHeight, leftTableRef, rowHeight, leftColumnsWidth, headerHeight, _fixedTableHeight, rowKey, scrollbarAlwaysOn, vScrollbarSize, useIsScrolling, getRowHeight, onVerticalScroll]);
+  var rightColumnsWidth = rightTableWidth;
+  var rightTableProps = useMemo(function () {
+    return {
+      cache: cache,
+      className: ns.e('right'),
+      columns: fixedColumnsOnRight,
+      data: data,
+      fixedData: fixedData,
+      estimatedRowHeight: estimatedRowHeight,
+      rightTableRef: rightTableRef,
+      rowHeight: rowHeight,
+      bodyWidth: rightColumnsWidth,
+      headerWidth: rightColumnsWidth,
+      headerHeight: headerHeight,
+      height: _fixedTableHeight,
+      rowKey: rowKey,
+      scrollbarAlwaysOn: scrollbarAlwaysOn,
+      scrollbarStartGap: 2,
+      scrollbarEndGap: vScrollbarSize,
+      width: rightColumnsWidth,
+      style: _defineProperty({}, "--".concat(ns.cssVarName('table-scrollbar-size')), "".concat(vScrollbarSize, "px")),
+      useIsScrolling: useIsScrolling,
+      getRowHeight: getRowHeight,
+      onScroll: onVerticalScroll
+    };
+  }, [cache, ns, fixedColumnsOnRight, data, fixedData, estimatedRowHeight, rightTableRef, rowHeight, rightColumnsWidth, headerHeight, _fixedTableHeight, rowKey, scrollbarAlwaysOn, vScrollbarSize, useIsScrolling, getRowHeight, onVerticalScroll]);
+  var tableRowProps = useMemo(function () {
+    return {
+      ns: ns,
+      depthMap: depthMap,
+      columnsStyles: columnsStyles,
+      expandColumnKey: expandColumnKey,
+      expandedRowKeys: expandedRowKeys,
+      estimatedRowHeight: estimatedRowHeight,
+      hasFixedColumns: hasFixedColumns,
+      rowProps: rowProps,
+      rowClass: rowClass,
+      rowKey: rowKey,
+      rowEventHandlers: rowEventHandlers,
+      onRowHovered: onRowHovered,
+      onRowExpanded: onRowExpanded,
+      onRowHeightChange: onRowHeightChange
+    };
+  }, [ns, depthMap, columnsStyles, expandColumnKey, expandedRowKeys, estimatedRowHeight, hasFixedColumns, rowProps, rowClass, rowKey, rowEventHandlers, onRowHovered, onRowExpanded, onRowHeightChange]);
+  var tableCellProps = useMemo(function () {
+    return {
+      cellProps: cellProps,
+      expandColumnKey: expandColumnKey,
+      indentSize: indentSize,
+      iconSize: iconSize,
+      rowKey: rowKey,
+      expandedRowKeys: expandedRowKeys,
+      ns: ns
+    };
+  }, [cellProps, expandColumnKey, indentSize, iconSize, rowKey, expandedRowKeys, ns]);
+  var tableHeaderProps = useMemo(function () {
+    return {
+      ns: ns,
+      headerClass: headerClass,
+      headerProps: headerProps,
+      columnsStyles: columnsStyles
+    };
+  }, [ns, headerClass, headerProps, columnsStyles]);
+  var tableHeaderCellProps = useMemo(function () {
+    return {
+      ns: ns,
+      sortBy: sortBy,
+      sortState: sortState,
+      headerCellProps: headerCellProps,
+      onColumnSorted: onColumnSorted
+    };
+  }, [ns, sortBy, sortState, headerCellProps, onColumnSorted]);
+  var rootKls = useMemo(function () {
+    return classNames(className, ns.b(), ns.e('root'), ns.is({
+      isDynamic: isDynamic
+    }));
+  }, [className, ns, isDynamic]);
+  var footerProps = useMemo(function () {
+    return {
+      className: ns.e('footer'),
+      style: footerHeight
+    };
+  }, [ns, footerHeight]);
+  var formatters = useMemo(function () {
+    return {
+      rowFormatter: function rowFormatter(params) {
+        return /*#__PURE__*/React.createElement(Row, _extends({}, params, tableRowProps, {
+          key: "row_".concat(params.rowIndex),
+          rowFormatter: _rowFormatter,
+          cellFormatter: function cellFormatter(cellParams) {
+            return _cellFormatter ? /*#__PURE__*/React.createElement(Cell, _extends({}, cellParams, tableCellProps, {
+              key: "row_".concat(params.rowIndex, "_").concat(cellParams.columnIndex),
+              style: columnsStyles[cellParams.column.key]
+            }), _cellFormatter(cellParams)) : /*#__PURE__*/React.createElement(Cell, _extends({}, cellParams, tableCellProps, {
+              key: "row_".concat(params.rowIndex, "_").concat(cellParams.columnIndex),
+              style: columnsStyles[cellParams.column.key]
+            }));
+          }
+        }));
+      },
+      headerFormatter: function headerFormatter(headerParams) {
+        return /*#__PURE__*/React.createElement(Header, _extends({}, headerParams, tableHeaderProps, {
+          key: "header_".concat(headerParams.headerIndex),
+          headerFormatter: _headerFormatter,
+          cellFormatter: function cellFormatter(headerCellParams) {
+            return headerCellFormatter ? /*#__PURE__*/React.createElement(HeaderCell, _extends({}, headerCellParams, tableHeaderCellProps, {
+              key: "headerCell_".concat(headerCellParams.columnIndex),
+              style: columnsStyles[headerCellParams.column.key]
+            }), headerCellFormatter(headerCellParams)) : /*#__PURE__*/React.createElement(HeaderCell, _extends({}, headerCellParams, tableHeaderCellProps, {
+              key: "headerCell_".concat(headerCellParams.columnIndex),
+              style: columnsStyles[headerCellParams.column.key]
+            }));
+          }
+        }));
+      }
+    };
+  }, [_cellFormatter, columnsStyles, headerCellFormatter, _headerFormatter, _rowFormatter, tableCellProps, tableHeaderCellProps, tableHeaderProps, tableRowProps]);
+  return /*#__PURE__*/React.createElement(TableV2Context.Provider, {
+    value: contextValue
+  }, /*#__PURE__*/React.createElement("div", {
+    className: rootKls,
+    style: rootStyle
+  }, /*#__PURE__*/React.createElement(MainTable, _extends({
+    ref: mainTableRef
+  }, mainTableProps, formatters)), /*#__PURE__*/React.createElement(LeftTable, _extends({
+    ref: leftTableRef
+  }, leftTableProps, formatters)), /*#__PURE__*/React.createElement(RightTable, _extends({
+    ref: rightTableRef
+  }, rightTableProps, formatters)), footer && /*#__PURE__*/React.createElement(Footer, footerProps, footer), showEmpty && /*#__PURE__*/React.createElement(Empty, {
+    className: ns.e('empty'),
+    style: emptyStyle
+  }, empty), overlay && /*#__PURE__*/React.createElement(Overlay, {
+    className: ns.e('overlay')
+  }, overlay)));
+});
+TableV2.displayName = COMPONENT_NAME;
+export default TableV2;

package/dist/TableV2/src/table.d.ts

@@ -0,0 +1,196 @@
+import { IconSize } from "../../Icon/typings";
+import React, { CSSProperties } from 'react';
+import { GridDefaultSlotParams } from '../../VirtualList';
+import type { SortOrder } from './constants';
+import { TableV2GridProps } from './grid';
+import { RowEventHandlers, RowExpandParams } from './row';
+import type { Column, ColumnCommonParams, KeyType, RowCommonParams, SortState } from './types';
+/**
+ * Param types
+ */
+export type ColumnSortParams<T> = {
+    column: Column<T>;
+    key: KeyType;
+    order: SortOrder;
+};
+/**
+ * Renderer/Getter types
+ */
+export type ExtraCellPropGetter<T> = (params: ColumnCommonParams<T> & RowCommonParams & {
+    cellData: T;
+    rowData: any;
+}) => any;
+export type ExtractHeaderPropGetter<T> = (params: {
+    columns: Column<T>[];
+    headerIndex: number;
+}) => any;
+export type ExtractHeaderCellPropGetter<T> = (params: ColumnCommonParams<T> & {
+    headerIndex: number;
+}) => any;
+export type ExtractRowPropGetter<T> = (params: {
+    columns: Column<T>[];
+} & RowCommonParams) => any;
+export type HeaderClassNameGetter<T> = (params: {
+    columns: Column<T>[];
+    headerIndex: number;
+}) => string;
+export type RowClassNameGetter<T> = (params: {
+    columns: Column<T>[];
+} & RowCommonParams) => string;
+/**
+ * Handler types
+ */
+export type ColumnSortHandler<T> = (params: ColumnSortParams<T>) => void;
+export type ColumnResizeHandler<T> = (column: Column<T>, width: number) => void;
+export type ExpandedRowsChangeHandler = (expandedRowKeys: KeyType[]) => void;
+export type RowsRenderedParams = {
+    rowCacheStart: number;
+    rowCacheEnd: number;
+    rowVisibleStart: number;
+    rowVisibleEnd: number;
+};
+export type ScrollParams = {
+    xAxisScrollDir?: 'forward' | 'backward';
+    scrollLeft?: number;
+    yAxisScrollDir?: 'forward' | 'backward';
+    scrollTop?: number;
+};
+export type TableV2Props = {
+    /** 为了更好的渲染效果预先多加载的行数 */
+    cache?: number;
+    /** 渲染动态的单元格的预估高度 */
+    estimatedRowHeight?: number;
+    /** header 部分的自定义 class 名 */
+    headerClass?: string | HeaderClassNameGetter<any>;
+    /** header 部分的自定义 props 名 */
+    headerProps?: object | ExtractHeaderPropGetter<any>;
+    /** header cell 部分的自定义 props 名 */
+    headerCellProps?: object | ExtractHeaderCellPropGetter<any>;
+    /** header 的高度由height设置。 如果传入数组，它会使 header row 等于数组长度 */
+    headerHeight?: number | number[];
+    /** footer 的高度，当传入值时，这部分将被计算入 table 的高度里 */
+    footerHeight?: number;
+    /** row wrapper 部分的自定义 class 名 */
+    rowClass?: string | RowClassNameGetter<any>;
+    /** 每行的 key 值，如果不提供，将使用索引 index 代替 */
+    rowKey?: string | symbol | number;
+    /** row component 部分的自定义 class 名 */
+    rowProps?: object | ExtractRowPropGetter<any>;
+    /** 每行的高度, 用于计算表的总高度 */
+    rowHeight?: number;
+    /** 当每行添加了一系列事件处理器时触发 */
+    rowEventHandlers?: RowEventHandlers;
+    /** 每个单元格 cell 的自定义 props (除了 header cell 以外) */
+    cellProps?: object | ExtraCellPropGetter<any>;
+    /** 列 column 的配置数组 */
+    columns: Column<any>[];
+    /** 要在表中渲染的数据数组 */
+    data: any[];
+    /** 一个自定义方法从数据源获取数据 */
+    dataGetter?: (data: any[]) => any[];
+    /** 渲染行在表格主内容上方和 header 下方区域的数据 */
+    fixedData?: any[];
+    /** 列的 key 来标记哪个行可以被展开 */
+    expandColumnKey?: string;
+    /** 存放行展开状态的 key 的数组，可以和 v-model 搭配使用 */
+    expandedRowKeys?: KeyType[];
+    /** 默认展开的行的 key 的数组, 这个数据不是响应式的 */
+    defaultExpandedRowKeys?: KeyType[];
+    /** 表格的类名称，将应用于表格的全部的三个部分 (左、右、主) */
+    className?: string | string[] | object | (() => string | string[] | object);
+    /** 单元格宽度是自适应还是固定 */
+    fixed?: boolean;
+    /** 表格的宽度 */
+    width?: number;
+    /** 表格的高度 */
+    height?: number;
+    /** 表格的最大高度 */
+    maxHeight?: number;
+    /** 树形表的水平缩进 */
+    indentSize?: number;
+    /** 图标大小 */
+    iconSize?: IconSize;
+    /** 水平滚动条的大小，防止水平和垂直滚动条重叠。 */
+    hScrollbarSize?: number;
+    /** 垂直滚动条的大小，防止水平和垂直滚动条重叠。 */
+    vScrollbarSize?: number;
+    /** 滚动条是否总是显示，不论是否滚动 */
+    scrollbarAlwaysOn?: boolean;
+    /** 排序方式 */
+    sortBy?: SortBy;
+    /** 多个排序 */
+    sortState?: SortState;
+    useIsScrolling?: boolean;
+    footer?: React.ReactNode;
+    empty?: React.ReactNode;
+    overlay?: React.ReactNode;
+    headerFormatter?: (props: HeaderSlotProps) => React.ReactNode;
+    rowFormatter?: (props: TableGridRowSlotParams) => React.ReactNode[];
+    cellFormatter?: (props: CellFormatProps<any>) => React.ReactNode;
+    headerCellFormatter?: (props: HeaderCellSlotProps) => React.ReactNode;
+    /** 列排序时调用 */
+    onColumnSort?: ColumnSortHandler<any>;
+    /** 当行被渲染后触发 */
+    onRowsRendered?: (params: RowsRenderedParams) => void;
+    /** 行展开状态改变时触发 */
+    onExpandedRowsChange?: ExpandedRowsChangeHandler;
+    /** 到达表格末尾时触发。 回调包含剩余距离，它通常是滚动条高度。*/
+    onEndReached?: (remainDistance: number) => void;
+    /** 点击箭头图标展开/折叠树节点时触发 */
+    onRowExpand?: (params: RowExpandParams) => void;
+    /** 表格被用户滚动后触发 */
+    onScroll?: (params: ScrollParams) => void;
+};
+export type HeaderSlotProps = {
+    cells: React.ReactNode[];
+    columns: Column<any>[];
+    headerIndex: number;
+};
+export type TableGridRowSlotParams = {
+    columns: TableV2GridProps['columns'];
+    cells: React.ReactNode[];
+    rowData: any;
+} & GridDefaultSlotParams;
+export type RowFormatProps = {
+    cells?: React.ReactNode[];
+    columns: Column<any>[];
+    rowData?: any;
+    columnIndex?: number;
+    rowIndex?: number;
+    data?: any;
+    key?: number | string;
+    isScrolling?: boolean;
+    style?: CSSProperties;
+    depth?: number;
+};
+export type CellFormatProps<T> = {
+    column: Column<T>;
+    columns: Column<T>[];
+    columnIndex: number;
+    depth: number;
+    style: CSSProperties;
+    rowData: any;
+    rowIndex: number;
+    isScrolling: boolean;
+    expandIconProps?: {
+        rowData: any;
+        rowIndex: number;
+        onExpand: (expand: boolean) => void;
+    } | undefined;
+};
+export type SortBy = {
+    key?: KeyType;
+    order?: SortOrder;
+};
+export type HeaderCellSlotProps = {
+    className: string;
+    columns: Column<any>[];
+    column: Column<any>;
+    columnIndex: number;
+    headerIndex: number;
+    style: CSSProperties;
+    headerCellProps?: any;
+    sortBy: SortBy;
+    sortState?: SortState | undefined;
+    onColumnSorted: (e: MouseEvent) => void;
+};

package/dist/TableV2/src/table.js

@@ -0,0 +1 @@
+export {};

package/dist/TableV2/src/tokens.d.ts

@@ -0,0 +1,11 @@
+import { RefObject } from 'react';
+import { UseNamespaceReturn } from '../../hooks/useClassNames';
+export type TableV2Context = {
+    isScrolling: boolean;
+    isResetting: RefObject<boolean>;
+    ns: UseNamespaceReturn;
+    scrollLeft?: number;
+};
+export declare const TableV2Context: import("react").Context<TableV2Context>;
+export declare const TableV2GridScrollLeftContext: import("react").Context<number>;
+export declare const TABLE_V2_GRID_INJECTION_KEY: import("react").Context<TableV2Context>;

package/dist/TableV2/src/tokens.js

@@ -0,0 +1,6 @@
+import { createContext } from 'react';
+export var TableV2Context = /*#__PURE__*/createContext(null);
+
+// Context for grid scroll left position
+export var TableV2GridScrollLeftContext = /*#__PURE__*/createContext(undefined);
+export var TABLE_V2_GRID_INJECTION_KEY = TableV2Context;

package/dist/TableV2/src/types.d.ts

@@ -0,0 +1,94 @@
+import type { ComponentType, CSSProperties, ReactNode } from 'react';
+import type { FixedDir, SortOrder } from './constants';
+export type Alignment = 'left' | 'center' | 'right';
+export type FixedDirection = FixedDir;
+export type KeyType = string | number | symbol;
+/**
+ * Param types
+ */
+export type CellRendererParams<T> = {
+    cellData: T;
+} & RowCommonParams & ColumnCommonParams<T>;
+export type ColumnCommonParams<T> = {
+    columns: Column<T>[];
+    column: Column<T>;
+    columnIndex: number;
+};
+export type HeaderCellRendererParams<T> = {
+    headerIndex: number;
+} & ColumnCommonParams<T>;
+export type RowCommonParams = {
+    rowData: any;
+    rowIndex: number;
+};
+export type ClassNameGetterParams<T> = {
+    cellData: T;
+} & RowCommonParams & ColumnCommonParams<T>;
+export type DataGetterParams<T> = {
+    columns: Column<T>[];
+    column: Column<T>;
+    columnIndex: number;
+} & RowCommonParams;
+export type DataGetter<T> = (params: DataGetterParams<T>) => T;
+export type ClassNameGetter<T> = (params: ClassNameGetterParams<T>) => string;
+export type HeaderClassGetter<T> = (params: ColumnCommonParams<T> & {
+    headerIndex: number;
+}) => string;
+/**
+ * Renderer/Getter types
+ */
+export type CellRenderer<T> = (params: CellRendererParams<T>) => ReactNode;
+export type HeaderCellRenderer<T> = (params: HeaderCellRendererParams<T>) => ReactNode;
+export type Column<T = any> = {
+    /**
+     * Attributes
+     */
+    align?: Alignment;
+    className?: string | ClassNameGetter<T>;
+    key?: KeyType;
+    dataKey?: KeyType;
+    fixed?: true | FixedDirection;
+    flexGrow?: CSSProperties['flexGrow'];
+    flexShrink?: CSSProperties['flexShrink'];
+    title?: string;
+    hidden?: boolean;
+    headerClass?: HeaderClassGetter<T> | string;
+    maxWidth?: number;
+    minWidth?: number;
+    style?: CSSProperties;
+    sortable?: boolean;
+    width?: number;
+    /**
+     * Renderers
+     */
+    cellRenderer?: CellRenderer<T>;
+    headerCellRenderer?: HeaderCellRenderer<T>;
+    /**
+     * Extendable sections
+     */
+    [key: string]: any;
+};
+export type Columns<T> = Column<T>[];
+export type AnyColumns = Columns<any>;
+export type SortBy = {
+    key: KeyType;
+    order: SortOrder;
+};
+export type SortState = {
+    [key: KeyType]: SortOrder;
+};
+export type CustomizedCellsType = ReactNode[];
+export type DefaultCellsType = ReactNode[][];
+export type ColumnCellsType = DefaultCellsType | CustomizedCellsType;
+export type TableV2CustomizedHeaderSlotParam<T = any> = {
+    cells: ReactNode[];
+    columns: Columns<T>;
+    headerIndex: number;
+};
+export type SimpleFunctionalComponentProps<T extends object> = {
+    className?: string;
+    style?: CSSProperties;
+} & T;
+export type SimpleFunctionalComponent<E extends object = {
+    [key: string]: any;
+}> = ComponentType<SimpleFunctionalComponentProps<E>>;

package/dist/TableV2/src/types.js

@@ -0,0 +1 @@
+export {};

package/dist/TableV2/src/use-table.d.ts

@@ -0,0 +1,48 @@
+import { CSSProperties, RefObject } from 'react';
+import { ScrollPos } from './composables';
+import type { TableV2Props } from './table';
+import type { TableGridInstance } from './table-grid';
+import type { AnyColumns, KeyType } from './types';
+interface UseTableReturn {
+    columns: AnyColumns;
+    containerRef: RefObject<HTMLDivElement>;
+    mainTableRef: RefObject<TableGridInstance | null>;
+    leftTableRef: RefObject<TableGridInstance | null>;
+    rightTableRef: RefObject<TableGridInstance | null>;
+    isDynamic: boolean;
+    isResetting: RefObject<boolean>;
+    isScrolling: boolean;
+    hasFixedColumns: number;
+    columnsStyles: Record<KeyType, CSSProperties>;
+    columnsTotalWidth: number;
+    data: any[];
+    expandedRowKeys: KeyType[];
+    depthMap: Record<KeyType, number>;
+    fixedColumnsOnLeft: AnyColumns;
+    fixedColumnsOnRight: AnyColumns;
+    mainColumns: AnyColumns;
+    bodyWidth: number;
+    emptyStyle: CSSProperties;
+    rootStyle: CSSProperties;
+    footerHeight: CSSProperties;
+    mainTableHeight: number;
+    fixedTableHeight: number;
+    leftTableWidth: number;
+    rightTableWidth: number;
+    showEmpty: boolean;
+    getRowHeight: (rowIndex: number) => number;
+    onColumnSorted: (e: MouseEvent) => void;
+    onRowHovered: any;
+    onRowExpanded: any;
+    onRowsRendered: any;
+    onRowHeightChange: any;
+    scrollTo: (params: ScrollPos) => void;
+    scrollToLeft: (scrollLeft: number) => void;
+    scrollToTop: (scrollTop: number) => void;
+    scrollToRow: (row: number, strategy?: string) => void;
+    onScroll: (params: ScrollPos) => void;
+    onVerticalScroll: ({ scrollTop }: ScrollPos) => void;
+}
+declare function useTable(props: TableV2Props): UseTableReturn;
+export { useTable };
+export type { UseTableReturn };