@kdcloudjs/table 1.0.0

package/es/table/transforms/columnRangeHover.js

@@ -0,0 +1,94 @@
+import _slicedToArray from "@babel/runtime-corejs3/helpers/slicedToArray";
+import _extends from "@babel/runtime-corejs3/helpers/extends";
+import { useState } from 'react';
+import { isLeafNode, mergeCellProps, traverseColumn } from '../utils';
+import { warnTransformsDeprecated } from './warnTransformsDeprecated';
+var EMPTY_RANGE = {
+  start: -1,
+  end: -1
+};
+/** @deprecated transform 用法已经过时，请使用 pipeline 来对表格进行拓展 */
+
+export function makeColumnRangeHoverTransform(_ref) {
+  var _ref$hoverColor = _ref.hoverColor,
+      hoverColor = _ref$hoverColor === void 0 ? 'var(--hover-bgcolor)' : _ref$hoverColor,
+      _ref$headerHoverColor = _ref.headerHoverColor,
+      headerHoverColor = _ref$headerHoverColor === void 0 ? 'var(--header-hover-bgcolor)' : _ref$headerHoverColor,
+      hoverRange = _ref.hoverRange,
+      onChangeHoverRange = _ref.onChangeHoverRange;
+  warnTransformsDeprecated('makeColumnRangeHoverTransform');
+  return traverseColumn(function (col, _ref2) {
+    var colRange = _ref2.range;
+    var match = colRange.end > hoverRange.start && hoverRange.end > colRange.start;
+
+    if (!isLeafNode(col)) {
+      if (headerHoverColor == null) {
+        return col;
+      }
+
+      return _extends(_extends({}, col), {
+        headerCellProps: mergeCellProps(col.headerCellProps, {
+          onMouseEnter: function onMouseEnter() {
+            onChangeHoverRange(colRange);
+          },
+          onMouseLeave: function onMouseLeave() {
+            onChangeHoverRange(EMPTY_RANGE);
+          },
+          style: {
+            '--header-bgcolor': match ? headerHoverColor : undefined
+          }
+        })
+      });
+    }
+
+    var prevGetCellProps = col.getCellProps;
+    return _extends(_extends({}, col), {
+      headerCellProps: mergeCellProps(col.headerCellProps, {
+        onMouseEnter: function onMouseEnter() {
+          onChangeHoverRange(colRange);
+        },
+        onMouseLeave: function onMouseLeave() {
+          onChangeHoverRange(EMPTY_RANGE);
+        },
+        style: {
+          '--header-bgcolor': match ? headerHoverColor : undefined
+        }
+      }),
+      getCellProps: function getCellProps(value, record, rowIndex) {
+        var prevCellProps = prevGetCellProps === null || prevGetCellProps === void 0 ? void 0 : prevGetCellProps(value, record, rowIndex);
+        return mergeCellProps(prevCellProps, {
+          onMouseEnter: function onMouseEnter() {
+            onChangeHoverRange(colRange);
+          },
+          onMouseLeave: function onMouseLeave() {
+            onChangeHoverRange(EMPTY_RANGE);
+          },
+          style: {
+            '--bgcolor': match ? hoverColor : undefined
+          }
+        });
+      }
+    });
+  });
+}
+/** @deprecated transform 用法已经过时，请使用 pipeline 来对表格进行拓展 */
+
+export function useColumnHoverRangeTransform() {
+  var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+      hoverColor = _ref3.hoverColor,
+      headerHoverColor = _ref3.headerHoverColor,
+      _ref3$defaultHoverRan = _ref3.defaultHoverRange,
+      defaultHoverRange = _ref3$defaultHoverRan === void 0 ? EMPTY_RANGE : _ref3$defaultHoverRan;
+
+  var _useState = useState(defaultHoverRange),
+      _useState2 = _slicedToArray(_useState, 2),
+      hoverRange = _useState2[0],
+      onChangeHoverRange = _useState2[1];
+
+  return makeColumnRangeHoverTransform({
+    hoverColor: hoverColor,
+    headerHoverColor: headerHoverColor,
+    hoverRange: hoverRange,
+    onChangeHoverRange: onChangeHoverRange
+  });
+}

package/es/table/transforms/columnResize.d.ts

@@ -0,0 +1,27 @@
+import { TableTransform } from '../interfaces';
+/** @deprecated transform 用法已经过时，请使用 pipeline 来对表格进行拓展 */
+export interface ColumnResizeOptions {
+    /** 每一列的宽度 */
+    sizes: number[];
+    /** 修改宽度的回调函数 */
+    onChangeSizes(nextSizes: number[]): void;
+    /** 列的最小宽度，默认为 40 */
+    minSize?: number;
+    /** 列的最大宽度，默认为 Infinity */
+    maxSize?: number;
+    /** 是否在列的末尾追加可伸缩列，默认为 false */
+    appendExpander?: boolean;
+    /** 是否在调整列宽时禁用 user-select，默认为 false */
+    disableUserSelectWhenResizing?: boolean;
+    /** 可伸缩列 style.visibility */
+    expanderVisibility?: 'visible' | 'hidden';
+}
+/** @deprecated transform 用法已经过时，请使用 pipeline 来对表格进行拓展 */
+export declare function makeColumnResizeTransform({ sizes, onChangeSizes, minSize, maxSize, appendExpander, expanderVisibility, disableUserSelectWhenResizing, }: ColumnResizeOptions): TableTransform;
+/** @deprecated transform 用法已经过时，请使用 pipeline 来对表格进行拓展 */
+export declare function useColumnResizeTransform({ defaultSizes, ...others }: Omit<ColumnResizeOptions, 'sizes' | 'onChangeSizes'> & {
+    defaultSizes: number[];
+}): import("../interfaces").Transform<{
+    columns: import("../interfaces").ArtColumn[];
+    dataSource: any[];
+}>;

package/es/table/transforms/columnResize.js

@@ -0,0 +1,152 @@
+import _slicedToArray from "@babel/runtime-corejs3/helpers/slicedToArray";
+import _extends from "@babel/runtime-corejs3/helpers/extends";
+import _taggedTemplateLiteral from "@babel/runtime-corejs3/helpers/taggedTemplateLiteral";
+
+var _templateObject;
+
+import _Object$getOwnPropertySymbols from "@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols";
+import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/slice";
+import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
+
+var __rest = this && this.__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof _Object$getOwnPropertySymbols === "function") for (var i = 0, p = _Object$getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+import React, { useState } from 'react';
+import { fromEvent } from 'rxjs';
+import * as op from 'rxjs/operators';
+import styled from 'styled-components';
+import { internals } from '../internals';
+import { isLeafNode, traverseColumn } from '../utils';
+import { warnTransformsDeprecated } from './warnTransformsDeprecated';
+
+function clamp(min, x, max) {
+  return Math.max(min, Math.min(max, x));
+}
+
+var RESIZE_EXPANDER_CLS = 'resize-expander';
+var ResizeHandle = styled.span(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  right: -5px;\n  width: 10px;\n  cursor: col-resize;\n  z-index: 1;\n"])));
+/** @deprecated transform 用法已经过时，请使用 pipeline 来对表格进行拓展 */
+
+export function makeColumnResizeTransform(_ref) {
+  var sizes = _ref.sizes,
+      onChangeSizes = _ref.onChangeSizes,
+      _ref$minSize = _ref.minSize,
+      minSize = _ref$minSize === void 0 ? 40 : _ref$minSize,
+      _ref$maxSize = _ref.maxSize,
+      maxSize = _ref$maxSize === void 0 ? Infinity : _ref$maxSize,
+      appendExpander = _ref.appendExpander,
+      _ref$expanderVisibili = _ref.expanderVisibility,
+      expanderVisibility = _ref$expanderVisibili === void 0 ? 'visible' : _ref$expanderVisibili,
+      disableUserSelectWhenResizing = _ref.disableUserSelectWhenResizing;
+  warnTransformsDeprecated('makeColumnResizeTransform');
+
+  var startResize = function startResize(colIndex, e) {
+    var startX = e.clientX;
+    var startSize = sizes[colIndex];
+    var nextSizes$ = fromEvent(window, 'mousemove').pipe(op.takeUntil(fromEvent(window, 'mouseup')), op.map(function (e) {
+      var movingX = e.clientX;
+
+      var nextSizes = _sliceInstanceProperty(sizes).call(sizes);
+
+      nextSizes[colIndex] = clamp(minSize, startSize + (movingX - startX), maxSize);
+      return nextSizes;
+    }));
+    var prevUserSelect = '';
+    var docElemStyle;
+
+    if (disableUserSelectWhenResizing) {
+      docElemStyle = document.documentElement.style;
+      prevUserSelect = docElemStyle.userSelect;
+      docElemStyle.userSelect = 'none';
+    }
+
+    nextSizes$.subscribe({
+      next: onChangeSizes,
+      complete: function complete() {
+        if (disableUserSelectWhenResizing) {
+          docElemStyle.userSelect = prevUserSelect;
+        }
+      }
+    });
+  };
+
+  var innerTransform = traverseColumn(function (col, _ref2) {
+    var range = _ref2.range;
+
+    var _a;
+
+    if (!isLeafNode(col)) {
+      return col;
+    }
+
+    var prevTitle = internals.safeRenderHeader(col);
+    return _extends(_extends({}, col), {
+      width: sizes[range.start],
+      title: /*#__PURE__*/React.createElement(React.Fragment, null, prevTitle, /*#__PURE__*/React.createElement(ResizeHandle, {
+        className: "resize-handle",
+        onMouseDown: function onMouseDown(e) {
+          return startResize(range.start, e);
+        }
+      })),
+      headerCellProps: _extends(_extends({}, col.headerCellProps), {
+        style: _extends(_extends({}, (_a = col.headerCellProps) === null || _a === void 0 ? void 0 : _a.style), {
+          overflow: 'visible',
+          position: 'relative'
+        })
+      })
+    });
+  });
+  return function (input) {
+    var _innerTransform = innerTransform(input),
+        columns = _innerTransform.columns,
+        dataSource = _innerTransform.dataSource;
+
+    return {
+      columns: appendExpander ? _concatInstanceProperty(columns).call(columns, [{
+        name: '',
+        headerCellProps: {
+          className: RESIZE_EXPANDER_CLS,
+          style: {
+            background: expanderVisibility === 'hidden' ? 'var(--bgcolor)' : undefined,
+            border: expanderVisibility === 'hidden' ? 'none' : undefined
+          }
+        },
+        getCellProps: function getCellProps() {
+          return {
+            className: RESIZE_EXPANDER_CLS,
+            style: {
+              visibility: expanderVisibility
+            }
+          };
+        }
+      }]) : columns,
+      dataSource: dataSource
+    };
+  };
+}
+/** @deprecated transform 用法已经过时，请使用 pipeline 来对表格进行拓展 */
+
+export function useColumnResizeTransform(_a) {
+  var defaultSizes = _a.defaultSizes,
+      others = __rest(_a, ["defaultSizes"]);
+
+  var _useState = useState(defaultSizes),
+      _useState2 = _slicedToArray(_useState, 2),
+      sizes = _useState2[0],
+      onChangeSizes = _useState2[1];
+
+  return makeColumnResizeTransform(_extends({
+    sizes: sizes,
+    onChangeSizes: onChangeSizes
+  }, others));
+}

package/es/table/transforms/flatten.d.ts

@@ -0,0 +1,3 @@
+import { TableTransform } from '../interfaces';
+/** @deprecated transform 用法已经过时，请使用 pipeline 来对表格进行拓展 */
+export declare function makeFlattenTransform(): TableTransform;

package/es/table/transforms/flatten.js

@@ -0,0 +1,16 @@
+import { isLeafNode, traverseColumn } from '../utils';
+import { warnTransformsDeprecated } from './warnTransformsDeprecated';
+/** @deprecated transform 用法已经过时，请使用 pipeline 来对表格进行拓展 */
+
+export function makeFlattenTransform() {
+  warnTransformsDeprecated('makeFlattenTransform');
+  return traverseColumn(function (column) {
+    var _a;
+
+    if (isLeafNode(column)) {
+      return column;
+    }
+
+    return ((_a = column.features) === null || _a === void 0 ? void 0 : _a.flatten) ? column.children : column;
+  });
+}

package/es/table/transforms/index.d.ts

@@ -0,0 +1,12 @@
+export { makeAutoRowSpanTransform } from './autoRowSpan';
+export { useAutoWidthTransform } from './autoWidth';
+export { makeBuildTreeTransform } from './buildTree';
+export { makeColumnHoverTransform, ColumnHoverOptions, useColumnHoverTransform } from './columnHover';
+export { makeColumnRangeHoverTransform, ColumnRangeHoverOptions, useColumnHoverRangeTransform, } from './columnRangeHover';
+export { makeColumnResizeTransform, ColumnResizeOptions, useColumnResizeTransform } from './columnResize';
+export { makeFlattenTransform } from './flatten';
+export { makeOrderFieldTransform } from './orderField';
+export { makeSortTransform, SortHeaderCellProps, SortOptions, useSortTransform } from './sort';
+export { makeTipsTransform, TipsOptions } from './tips';
+export { makeTreeModeTransform, TreeModeOptions, useTreeModeTransform } from './treeMode';
+export { makeVisibleTransform } from './visible';

package/es/table/transforms/index.js

@@ -0,0 +1,12 @@
+export { makeAutoRowSpanTransform } from './autoRowSpan';
+export { useAutoWidthTransform } from './autoWidth';
+export { makeBuildTreeTransform } from './buildTree';
+export { makeColumnHoverTransform, useColumnHoverTransform } from './columnHover';
+export { makeColumnRangeHoverTransform, useColumnHoverRangeTransform } from './columnRangeHover';
+export { makeColumnResizeTransform, useColumnResizeTransform } from './columnResize';
+export { makeFlattenTransform } from './flatten';
+export { makeOrderFieldTransform } from './orderField';
+export { makeSortTransform, useSortTransform } from './sort';
+export { makeTipsTransform } from './tips';
+export { makeTreeModeTransform, useTreeModeTransform } from './treeMode';
+export { makeVisibleTransform } from './visible';

package/es/table/transforms/orderField.d.ts

@@ -0,0 +1,3 @@
+import { TableTransform } from '../interfaces';
+/** @deprecated transform 用法已经过时，请使用 pipeline 来对表格进行拓展 */
+export declare function makeOrderFieldTransform(startOrder?: number): TableTransform;

package/es/table/transforms/orderField.js

@@ -0,0 +1,22 @@
+import _extends from "@babel/runtime-corejs3/helpers/extends";
+import { traverseColumn } from '../utils';
+import { warnTransformsDeprecated } from './warnTransformsDeprecated';
+/** @deprecated transform 用法已经过时，请使用 pipeline 来对表格进行拓展 */
+
+export function makeOrderFieldTransform() {
+  var startOrder = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
+  warnTransformsDeprecated('makeOrderFieldTransform');
+  return traverseColumn(function (column) {
+    var _a, _b;
+
+    if (((_a = column.features) === null || _a === void 0 ? void 0 : _a.order) || ((_b = column.features) === null || _b === void 0 ? void 0 : _b.orderField)) {
+      return _extends(_extends({}, column), {
+        getValue: function getValue(record, index) {
+          return index + startOrder;
+        }
+      });
+    }
+
+    return column;
+  });
+}

package/es/table/transforms/sort.d.ts

@@ -0,0 +1,43 @@
+import React, { ReactNode } from 'react';
+import { ArtColumn, SortItem, SortOrder, TableTransform } from '../interfaces';
+export interface SortHeaderCellProps {
+    /** 调用 makeSortTransform(...) 时的参数 */
+    sortOptions: Required<Omit<SortOptions, 'SortHeaderCell'>>;
+    /** 在添加排序相关的内容之前 表头原有的渲染内容 */
+    children: ReactNode;
+    /** 当前排序 */
+    sortOrder: SortOrder;
+    /** 多列排序下，sortIndex 指明了当前排序字段起作用的顺序. 当 sortOrder 为 none 时，sortIndex 固定为 -1 */
+    sortIndex: number;
+    /** 当前列的配置 */
+    column: ArtColumn;
+    /** 切换排序的回调 */
+    onToggle(e: React.MouseEvent): void;
+}
+export interface SortOptions {
+    /** 排序字段列表 */
+    sorts: SortItem[];
+    /** 更新排序字段列表的回调函数 */
+    onChangeSorts(nextSorts: SortItem[]): void;
+    /** 排序切换顺序 */
+    orders?: SortOrder[];
+    /** 排序模式。单选 single，多选 multiple，默认为多选 */
+    mode?: 'single' | 'multiple';
+    /** 自定义排序表头 */
+    SortHeaderCell?: React.ComponentType<SortHeaderCellProps>;
+    /** 是否保持 dataSource 不变 */
+    keepDataSource?: boolean;
+    /** 排序激活时 是否高亮这一列的单元格 */
+    highlightColumnWhenActive?: boolean;
+    /** 是否对触发 onChangeOpenKeys 的 click 事件调用 event.stopPropagation() */
+    stopClickEventPropagation?: boolean;
+}
+/** @deprecated transform 用法已经过时，请使用 pipeline 来对表格进行拓展 */
+export declare function makeSortTransform({ sorts: inputSorts, onChangeSorts: inputOnChangeSorts, orders, mode, SortHeaderCell, keepDataSource, highlightColumnWhenActive, stopClickEventPropagation, }: SortOptions): TableTransform;
+/** @deprecated transform 用法已经过时，请使用 pipeline 来对表格进行拓展 */
+export declare function useSortTransform({ defaultSorts, ...others }?: Omit<SortOptions, 'sorts' | 'onChangeSorts'> & {
+    defaultSorts?: SortItem[];
+}): import("../interfaces").Transform<{
+    columns: ArtColumn[];
+    dataSource: any[];
+}>;