rsuite-table
Advanced tools
Comparing version 5.0.0-alpha.2 to 5.0.0-alpha.3
150
es/Cell.d.ts
import * as React from 'react'; | ||
import { StandardProps, RowDataType } from './common'; | ||
import PropTypes from 'prop-types'; | ||
import { StandardProps, RowDataType } from './@types/common'; | ||
export interface CellProps extends StandardProps { | ||
align?: 'left' | 'center' | 'right'; | ||
verticalAlign?: 'top' | 'middle' | 'bottom'; | ||
className?: string; | ||
classPrefix?: string; | ||
dataKey?: string; | ||
isHeaderCell?: boolean; | ||
width?: number; | ||
height?: number | ((rowData: object) => number); | ||
left?: number; | ||
headerHeight?: number; | ||
style?: React.CSSProperties; | ||
firstColumn?: boolean; | ||
lastColumn?: boolean; | ||
hasChildren?: boolean; | ||
children?: React.ReactNode | ((rowData: RowDataType, rowIndex: number) => React.ReactNode); | ||
rowKey?: string | number; | ||
rowIndex?: number; | ||
rowData?: RowDataType; | ||
depth?: number; | ||
onTreeToggle?: ( | ||
rowKey?: string | number, | ||
rowIndex?: number, | ||
rowData?: RowDataType, | ||
event?: React.MouseEvent | ||
) => void; | ||
renderTreeToggle?: ( | ||
expandButton: React.ReactNode, | ||
rowData?: RowDataType, | ||
expanded?: boolean | ||
) => React.ReactNode; | ||
renderCell?: (contentChildren: any) => React.ReactNode; | ||
wordWrap?: boolean; | ||
removed?: boolean; | ||
treeCol?: boolean; | ||
expanded?: boolean; | ||
align?: 'left' | 'center' | 'right'; | ||
verticalAlign?: 'top' | 'middle' | 'bottom'; | ||
className?: string; | ||
classPrefix?: string; | ||
dataKey?: string; | ||
isHeaderCell?: boolean; | ||
width?: number; | ||
height?: number | ((rowData: object) => number); | ||
left?: number; | ||
headerHeight?: number; | ||
style?: React.CSSProperties; | ||
firstColumn?: boolean; | ||
lastColumn?: boolean; | ||
hasChildren?: boolean; | ||
children?: React.ReactNode | ((rowData: RowDataType, rowIndex: number) => React.ReactNode); | ||
rowKey?: string | number; | ||
rowIndex?: number; | ||
rowData?: RowDataType; | ||
depth?: number; | ||
onTreeToggle?: (rowKey?: string | number, rowIndex?: number, rowData?: RowDataType, event?: React.MouseEvent) => void; | ||
renderTreeToggle?: (expandButton: React.ReactNode, rowData?: RowDataType, expanded?: boolean) => React.ReactNode; | ||
renderCell?: (contentChildren: any) => React.ReactNode; | ||
wordWrap?: boolean; | ||
removed?: boolean; | ||
treeCol?: boolean; | ||
expanded?: boolean; | ||
} | ||
declare const Cell: React.ComponentType<CellProps>; | ||
export declare const propTypes: { | ||
align: PropTypes.Requireable<string>; | ||
verticalAlign: PropTypes.Requireable<string>; | ||
className: PropTypes.Requireable<string>; | ||
classPrefix: PropTypes.Requireable<string>; | ||
dataKey: PropTypes.Requireable<string>; | ||
isHeaderCell: PropTypes.Requireable<boolean>; | ||
width: PropTypes.Requireable<number>; | ||
height: PropTypes.Requireable<number | ((...args: any[]) => any)>; | ||
left: PropTypes.Requireable<number>; | ||
headerHeight: PropTypes.Requireable<number>; | ||
style: PropTypes.Requireable<object>; | ||
firstColumn: PropTypes.Requireable<boolean>; | ||
lastColumn: PropTypes.Requireable<boolean>; | ||
hasChildren: PropTypes.Requireable<boolean>; | ||
children: PropTypes.Requireable<any>; | ||
rowKey: PropTypes.Requireable<string | number>; | ||
rowIndex: PropTypes.Requireable<number>; | ||
rowData: PropTypes.Requireable<object>; | ||
depth: PropTypes.Requireable<number>; | ||
onTreeToggle: PropTypes.Requireable<(...args: any[]) => any>; | ||
renderTreeToggle: PropTypes.Requireable<(...args: any[]) => any>; | ||
renderCell: PropTypes.Requireable<(...args: any[]) => any>; | ||
wordWrap: PropTypes.Requireable<boolean>; | ||
removed: PropTypes.Requireable<boolean>; | ||
treeCol: PropTypes.Requireable<boolean>; | ||
expanded: PropTypes.Requireable<boolean>; | ||
groupHeader: PropTypes.Requireable<PropTypes.ReactNodeLike>; | ||
groupCount: PropTypes.Requireable<number>; | ||
}; | ||
declare class Cell extends React.PureComponent<CellProps> { | ||
static contextType: React.Context<import("./TableContext").TableContextProps>; | ||
static propTypes: { | ||
align: PropTypes.Requireable<string>; | ||
verticalAlign: PropTypes.Requireable<string>; | ||
className: PropTypes.Requireable<string>; | ||
classPrefix: PropTypes.Requireable<string>; | ||
dataKey: PropTypes.Requireable<string>; | ||
isHeaderCell: PropTypes.Requireable<boolean>; | ||
width: PropTypes.Requireable<number>; | ||
height: PropTypes.Requireable<number | ((...args: any[]) => any)>; | ||
left: PropTypes.Requireable<number>; | ||
headerHeight: PropTypes.Requireable<number>; | ||
style: PropTypes.Requireable<object>; | ||
firstColumn: PropTypes.Requireable<boolean>; | ||
lastColumn: PropTypes.Requireable<boolean>; | ||
hasChildren: PropTypes.Requireable<boolean>; | ||
children: PropTypes.Requireable<any>; | ||
rowKey: PropTypes.Requireable<string | number>; | ||
rowIndex: PropTypes.Requireable<number>; | ||
rowData: PropTypes.Requireable<object>; | ||
depth: PropTypes.Requireable<number>; | ||
onTreeToggle: PropTypes.Requireable<(...args: any[]) => any>; | ||
renderTreeToggle: PropTypes.Requireable<(...args: any[]) => any>; | ||
renderCell: PropTypes.Requireable<(...args: any[]) => any>; | ||
wordWrap: PropTypes.Requireable<boolean>; | ||
removed: PropTypes.Requireable<boolean>; | ||
treeCol: PropTypes.Requireable<boolean>; | ||
expanded: PropTypes.Requireable<boolean>; | ||
groupHeader: PropTypes.Requireable<PropTypes.ReactNodeLike>; | ||
groupCount: PropTypes.Requireable<number>; | ||
}; | ||
static defaultProps: { | ||
headerHeight: number; | ||
depth: number; | ||
height: number; | ||
width: number; | ||
left: number; | ||
}; | ||
getClassPrefix: () => string; | ||
addPrefix: (name: string) => string; | ||
isTreeCol(): boolean; | ||
getHeight(): number; | ||
handleExpandClick: (event: React.MouseEvent) => void; | ||
renderTreeNodeExpandIcon(): JSX.Element; | ||
render(): JSX.Element; | ||
} | ||
export default Cell; |
@@ -56,4 +56,8 @@ import _extends from "@babel/runtime/helpers/esm/extends"; | ||
_this.getClassPrefix = function () { | ||
return _this.props.classPrefix || defaultClassPrefix('table-cell', _this.context.classPrefix); | ||
}; | ||
_this.addPrefix = function (name) { | ||
return prefix(_this.props.classPrefix)(name); | ||
return prefix(_this.getClassPrefix())(name); | ||
}; | ||
@@ -126,3 +130,3 @@ | ||
_proto.render = function render() { | ||
var _classNames, _styles, _extends2; | ||
var _classNames, _extends2, _contentStyles; | ||
@@ -146,3 +150,2 @@ var _this$props6 = this.props, | ||
wordWrap = _this$props6.wordWrap, | ||
classPrefix = _this$props6.classPrefix, | ||
depth = _this$props6.depth, | ||
@@ -152,3 +155,3 @@ verticalAlign = _this$props6.verticalAlign, | ||
onClick = _this$props6.onClick, | ||
rest = _objectWithoutPropertiesLoose(_this$props6, ["width", "left", "style", "className", "firstColumn", "lastColumn", "isHeaderCell", "headerHeight", "align", "children", "rowData", "dataKey", "rowIndex", "renderCell", "removed", "wordWrap", "classPrefix", "depth", "verticalAlign", "expanded", "onClick"]); | ||
rest = _objectWithoutPropertiesLoose(_this$props6, ["width", "left", "style", "className", "firstColumn", "lastColumn", "isHeaderCell", "headerHeight", "align", "children", "rowData", "dataKey", "rowIndex", "renderCell", "removed", "wordWrap", "depth", "verticalAlign", "expanded", "onClick"]); | ||
@@ -159,16 +162,17 @@ if (removed) { | ||
var classes = classNames(classPrefix, className, (_classNames = {}, _classNames[this.addPrefix('expanded')] = expanded && this.isTreeCol(), _classNames[this.addPrefix('first')] = firstColumn, _classNames[this.addPrefix('last')] = lastColumn, _classNames)); | ||
var classes = classNames(this.getClassPrefix(), className, (_classNames = {}, _classNames[this.addPrefix('expanded')] = expanded && this.isTreeCol(), _classNames[this.addPrefix('first')] = firstColumn, _classNames[this.addPrefix('last')] = lastColumn, _classNames)); | ||
var rtl = this.context.rtl; | ||
var nextHeight = isHeaderCell ? headerHeight : this.getHeight(); | ||
var styles = (_styles = { | ||
var styles = _extends({}, style, (_extends2 = { | ||
width: width, | ||
height: nextHeight, | ||
zIndex: depth | ||
}, _styles[rtl ? 'right' : 'left'] = left, _styles); | ||
}, _extends2[rtl ? 'right' : 'left'] = left, _extends2)); | ||
var contentStyles = _extends((_extends2 = { | ||
var contentStyles = (_contentStyles = { | ||
width: width, | ||
height: nextHeight, | ||
textAlign: align | ||
}, _extends2[rtl ? 'paddingRight' : 'paddingLeft'] = this.isTreeCol() ? depth * LAYER_WIDTH + 10 : null, _extends2), style); | ||
}, _contentStyles[rtl ? 'paddingRight' : 'paddingLeft'] = this.isTreeCol() ? depth * LAYER_WIDTH + 10 : null, _contentStyles); | ||
@@ -187,3 +191,3 @@ if (verticalAlign) { | ||
var unhandledProps = getUnhandledProps(Cell, getUnhandledProps(Column, rest)); | ||
var unhandledProps = getUnhandledProps(propTypes, getUnhandledProps(Column.propTypes, rest)); | ||
var cell = renderCell ? renderCell(cellContent) : cellContent; | ||
@@ -211,3 +215,2 @@ var content = wordWrap ? /*#__PURE__*/React.createElement("div", { | ||
Cell.defaultProps = { | ||
classPrefix: defaultClassPrefix('table-cell'), | ||
headerHeight: 36, | ||
@@ -214,0 +217,0 @@ depth: 0, |
@@ -0,13 +1,13 @@ | ||
import React from 'react'; | ||
export interface CellGroupProps { | ||
fixed?: 'left' | 'right'; | ||
width?: number; | ||
height?: number; | ||
left?: number; | ||
style?: React.CSSProperties; | ||
className?: string; | ||
classPrefix?: string; | ||
fixed?: 'left' | 'right'; | ||
width?: number; | ||
height?: number; | ||
left?: number; | ||
style?: React.CSSProperties; | ||
className?: string; | ||
classPrefix?: string; | ||
children?: React.ReactNode; | ||
} | ||
declare const CellGroup: React.ComponentType<CellGroupProps>; | ||
declare const CellGroup: React.ForwardRefExoticComponent<CellGroupProps & React.RefAttributes<HTMLDivElement>>; | ||
export default CellGroup; |
import _extends from "@babel/runtime/helpers/esm/extends"; | ||
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose"; | ||
import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose"; | ||
import * as React from 'react'; | ||
import React, { useContext } from 'react'; | ||
import PropTypes from 'prop-types'; | ||
import classNames from 'classnames'; | ||
import { defaultClassPrefix, getUnhandledProps, prefix } from './utils'; | ||
import { defaultClassPrefix, prefix } from './utils'; | ||
import TableContext from './TableContext'; | ||
var CellGroup = /*#__PURE__*/React.forwardRef(function (props, ref) { | ||
var _classNames; | ||
var CellGroup = /*#__PURE__*/function (_React$PureComponent) { | ||
_inheritsLoose(CellGroup, _React$PureComponent); | ||
var fixed = props.fixed, | ||
width = props.width, | ||
left = props.left, | ||
height = props.height, | ||
style = props.style, | ||
classPrefix = props.classPrefix, | ||
className = props.className, | ||
children = props.children, | ||
rest = _objectWithoutPropertiesLoose(props, ["fixed", "width", "left", "height", "style", "classPrefix", "className", "children"]); | ||
function CellGroup() { | ||
var _this; | ||
var _useContext = useContext(TableContext), | ||
translateDOMPositionXY = _useContext.translateDOMPositionXY, | ||
tableClassPrefix = _useContext.classPrefix; | ||
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { | ||
args[_key] = arguments[_key]; | ||
} | ||
var addPrefix = function addPrefix(name) { | ||
return prefix(classPrefix || defaultClassPrefix('table-cell-group', tableClassPrefix))(name); | ||
}; | ||
_this = _React$PureComponent.call.apply(_React$PureComponent, [this].concat(args)) || this; | ||
var classes = classNames(classPrefix, className, (_classNames = {}, _classNames[addPrefix("fixed-" + (fixed || ''))] = fixed, _classNames[addPrefix('scroll')] = !fixed, _classNames)); | ||
_this.addPrefix = function (name) { | ||
return prefix(_this.props.classPrefix)(name); | ||
}; | ||
var styles = _extends({ | ||
width: width, | ||
height: height | ||
}, style); | ||
return _this; | ||
} | ||
var _proto = CellGroup.prototype; | ||
_proto.render = function render() { | ||
var _classNames; | ||
var _this$props = this.props, | ||
fixed = _this$props.fixed, | ||
width = _this$props.width, | ||
left = _this$props.left, | ||
height = _this$props.height, | ||
style = _this$props.style, | ||
classPrefix = _this$props.classPrefix, | ||
className = _this$props.className, | ||
children = _this$props.children, | ||
rest = _objectWithoutPropertiesLoose(_this$props, ["fixed", "width", "left", "height", "style", "classPrefix", "className", "children"]); | ||
var classes = classNames(classPrefix, className, (_classNames = {}, _classNames[this.addPrefix("fixed-" + (fixed || ''))] = fixed, _classNames[this.addPrefix('scroll')] = !fixed, _classNames)); | ||
var styles = _extends({ | ||
width: width, | ||
height: height | ||
}, style); | ||
var unhandledProps = getUnhandledProps(CellGroup, rest); | ||
return /*#__PURE__*/React.createElement(TableContext.Consumer, null, function (_ref) { | ||
var translateDOMPositionXY = _ref.translateDOMPositionXY; | ||
translateDOMPositionXY === null || translateDOMPositionXY === void 0 ? void 0 : translateDOMPositionXY(styles, left, 0); | ||
return /*#__PURE__*/React.createElement("div", _extends({}, unhandledProps, { | ||
className: classes, | ||
style: styles | ||
}), children); | ||
}); | ||
}; | ||
return CellGroup; | ||
}(React.PureComponent); | ||
translateDOMPositionXY === null || translateDOMPositionXY === void 0 ? void 0 : translateDOMPositionXY(styles, left, 0); | ||
return /*#__PURE__*/React.createElement("div", _extends({}, rest, { | ||
ref: ref, | ||
className: classes, | ||
style: styles | ||
}), children); | ||
}); | ||
CellGroup.displayName = 'CellGroup'; | ||
CellGroup.propTypes = { | ||
@@ -75,5 +53,2 @@ fixed: PropTypes.oneOf(['left', 'right']), | ||
}; | ||
CellGroup.defaultProps = { | ||
classPrefix: defaultClassPrefix('table-cell-group') | ||
}; | ||
export default CellGroup; |
@@ -0,17 +1,34 @@ | ||
import PropTypes from 'prop-types'; | ||
export interface ColumnProps { | ||
align?: 'left' | 'center' | 'right'; | ||
verticalAlign?: 'top' | 'middle' | 'bottom'; | ||
width?: number; | ||
fixed?: boolean | 'left' | 'right'; | ||
resizable?: boolean; | ||
sortable?: boolean; | ||
flexGrow?: number; | ||
minWidth?: number; | ||
colSpan?: number; | ||
treeCol?: boolean; | ||
onResize?: (columnWidth?: number, dataKey?: string) => void; | ||
align?: 'left' | 'center' | 'right'; | ||
verticalAlign?: 'top' | 'middle' | 'bottom'; | ||
width?: number; | ||
fixed?: boolean | 'left' | 'right'; | ||
resizable?: boolean; | ||
sortable?: boolean; | ||
flexGrow?: number; | ||
minWidth?: number; | ||
colSpan?: number; | ||
treeCol?: boolean; | ||
onResize?: (columnWidth?: number, dataKey?: string) => void; | ||
} | ||
declare const Column: React.ComponentType<ColumnProps>; | ||
declare function Column(_props: ColumnProps): any; | ||
declare namespace Column { | ||
var defaultProps: { | ||
width: number; | ||
}; | ||
var propTypes: { | ||
align: PropTypes.Requireable<string>; | ||
verticalAlign: PropTypes.Requireable<string>; | ||
width: PropTypes.Requireable<number>; | ||
fixed: PropTypes.Requireable<string | boolean>; | ||
resizable: PropTypes.Requireable<boolean>; | ||
sortable: PropTypes.Requireable<boolean>; | ||
flexGrow: PropTypes.Requireable<number>; | ||
minWidth: PropTypes.Requireable<number>; | ||
colSpan: PropTypes.Requireable<number>; | ||
treeCol: PropTypes.Requireable<boolean>; | ||
onResize: PropTypes.Requireable<(...args: any[]) => any>; | ||
}; | ||
} | ||
export default Column; |
@@ -0,15 +1,14 @@ | ||
import React from 'react'; | ||
export interface ColumnGroupProps { | ||
align?: 'left' | 'center' | 'right'; | ||
verticalAlign?: 'top' | 'middle' | 'bottom'; | ||
fixed?: boolean | 'left' | 'right'; | ||
width?: number; | ||
header?: React.ReactNode; | ||
children?: React.ReactNode; | ||
className?: string; | ||
headerHeight?: number; | ||
classPrefix?: string; | ||
align?: 'left' | 'center' | 'right'; | ||
verticalAlign?: 'top' | 'middle' | 'bottom'; | ||
fixed?: boolean | 'left' | 'right'; | ||
width?: number; | ||
header?: React.ReactNode; | ||
children?: React.ReactNode; | ||
className?: string; | ||
headerHeight?: number; | ||
classPrefix?: string; | ||
} | ||
declare const ColumnGroup: React.ComponentType<ColumnGroupProps>; | ||
declare const ColumnGroup: React.ForwardRefExoticComponent<ColumnGroupProps & React.RefAttributes<HTMLDivElement>>; | ||
export default ColumnGroup; |
import _extends from "@babel/runtime/helpers/esm/extends"; | ||
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose"; | ||
import * as React from 'react'; | ||
import React, { useContext } from 'react'; | ||
import classNames from 'classnames'; | ||
import PropTypes from 'prop-types'; | ||
import { defaultClassPrefix, prefix } from './utils/prefix'; | ||
import TableContext from './TableContext'; | ||
var ColumnGroup = /*#__PURE__*/React.forwardRef(function (props, ref) { | ||
@@ -27,8 +28,12 @@ var header = props.header, | ||
var _useContext = useContext(TableContext), | ||
tableClassPrefix = _useContext.classPrefix; | ||
var colClassPrefix = classPrefix || defaultClassPrefix('table-column-group', tableClassPrefix); | ||
var addPrefix = React.useCallback(function (name) { | ||
return prefix(classPrefix)(name); | ||
return prefix(colClassPrefix)(name); | ||
}, []); | ||
return /*#__PURE__*/React.createElement("div", _extends({ | ||
ref: ref, | ||
className: classNames(classPrefix, className) | ||
className: classNames(colClassPrefix, className) | ||
}, rest), /*#__PURE__*/React.createElement("div", { | ||
@@ -41,3 +46,3 @@ className: addPrefix('header'), | ||
}, header)), React.Children.map(children, function (node) { | ||
var _node$props, _node$props2, _node$props2$style; | ||
var _node$props; | ||
@@ -50,14 +55,9 @@ var nodeStyles = _extends({ | ||
var width = (_node$props2 = node.props) === null || _node$props2 === void 0 ? void 0 : (_node$props2$style = _node$props2.style) === null || _node$props2$style === void 0 ? void 0 : _node$props2$style.width; | ||
var nodeContentStyles = { | ||
height: height, | ||
width: width, | ||
verticalAlign: verticalAlign | ||
}; | ||
return /*#__PURE__*/React.cloneElement(node, { | ||
className: addPrefix('cell'), | ||
style: nodeStyles, | ||
children: /*#__PURE__*/React.createElement("div", { | ||
className: addPrefix('cell-content'), | ||
style: nodeContentStyles | ||
headerHeight: height, | ||
verticalAlign: verticalAlign, | ||
children: /*#__PURE__*/React.createElement("span", { | ||
className: addPrefix('cell-content') | ||
}, node.props.children) | ||
@@ -69,4 +69,3 @@ }); | ||
ColumnGroup.defaultProps = { | ||
headerHeight: 80, | ||
classPrefix: defaultClassPrefix('table-column-group') | ||
headerHeight: 80 | ||
}; | ||
@@ -73,0 +72,0 @@ ColumnGroup.propTypes = { |
import * as React from 'react'; | ||
export type FixedType = boolean | 'left' | 'right'; | ||
import PropTypes from 'prop-types'; | ||
export declare type FixedType = boolean | 'left' | 'right'; | ||
export interface Client { | ||
clientX?: number; | ||
clientY?: number; | ||
preventDefault?: Function; | ||
clientX?: number; | ||
clientY?: number; | ||
preventDefault?: Function; | ||
} | ||
export interface ColumnResizeHandlerProps { | ||
height?: number; | ||
defaultColumnWidth?: number; | ||
columnLeft?: number; | ||
columnFixed?: FixedType; | ||
className?: string; | ||
classPrefix?: string; | ||
minWidth?: number; | ||
style?: React.CSSProperties; | ||
onColumnResizeStart?: (client: Client) => void; | ||
onColumnResizeEnd?: (columnWidth?: number, cursorDelta?: number) => void; | ||
onColumnResizeMove?: (columnWidth?: number, columnLeft?: number, columnFixed?: FixedType) => void; | ||
height?: number; | ||
defaultColumnWidth?: number; | ||
columnLeft?: number; | ||
columnFixed?: FixedType; | ||
className?: string; | ||
classPrefix?: string; | ||
minWidth?: number; | ||
style?: React.CSSProperties; | ||
onColumnResizeStart?: (client: Client) => void; | ||
onColumnResizeEnd?: (columnWidth?: number, cursorDelta?: number) => void; | ||
onColumnResizeMove?: (columnWidth?: number, columnLeft?: number, columnFixed?: FixedType) => void; | ||
} | ||
declare const ColumnResizeHandler: React.ComponentType<ColumnResizeHandlerProps>; | ||
declare class ColumnResizeHandler extends React.Component<ColumnResizeHandlerProps> { | ||
static contextType: React.Context<import("./TableContext").TableContextProps>; | ||
static propTypes: { | ||
height: PropTypes.Requireable<number>; | ||
defaultColumnWidth: PropTypes.Requireable<number>; | ||
columnLeft: PropTypes.Requireable<number>; | ||
columnFixed: PropTypes.Requireable<string | boolean>; | ||
className: PropTypes.Requireable<string>; | ||
classPrefix: PropTypes.Requireable<string>; | ||
minWidth: PropTypes.Requireable<number>; | ||
style: PropTypes.Requireable<object>; | ||
onColumnResizeStart: PropTypes.Requireable<(...args: any[]) => any>; | ||
onColumnResizeEnd: PropTypes.Requireable<(...args: any[]) => any>; | ||
onColumnResizeMove: PropTypes.Requireable<(...args: any[]) => any>; | ||
}; | ||
columnWidth: number; | ||
cursorDelta: number; | ||
mouseMoveTracker: any; | ||
isKeyDown: boolean; | ||
constructor(props: any); | ||
componentWillUnmount(): void; | ||
onMove: (deltaX: number) => void; | ||
onColumnResizeEnd: () => void; | ||
onColumnResizeMouseDown: (event: React.MouseEvent) => void; | ||
getMouseMoveTracker(): any; | ||
render(): JSX.Element; | ||
} | ||
export default ColumnResizeHandler; |
@@ -12,2 +12,15 @@ import _extends from "@babel/runtime/helpers/esm/extends"; | ||
import { RESIZE_MIN_WIDTH } from './constants'; | ||
var propTypes = { | ||
height: PropTypes.number, | ||
defaultColumnWidth: PropTypes.number, | ||
columnLeft: PropTypes.number, | ||
columnFixed: PropTypes.oneOfType([PropTypes.bool, PropTypes.oneOf(['left', 'right'])]), | ||
className: PropTypes.string, | ||
classPrefix: PropTypes.string, | ||
minWidth: PropTypes.number, | ||
style: PropTypes.object, | ||
onColumnResizeStart: PropTypes.func, | ||
onColumnResizeEnd: PropTypes.func, | ||
onColumnResizeMove: PropTypes.func | ||
}; | ||
@@ -106,4 +119,4 @@ var ColumnResizeHandler = /*#__PURE__*/function (_React$Component) { | ||
var classes = classNames(classPrefix, className); | ||
var unhandled = getUnhandledProps(ColumnResizeHandler, rest); | ||
var classes = classNames(classPrefix || defaultClassPrefix('table-column-resize-spanner', this.context.classPrefix), className); | ||
var unhandled = getUnhandledProps(propTypes, rest); | ||
return /*#__PURE__*/React.createElement("div", _extends({}, unhandled, { | ||
@@ -122,18 +135,3 @@ className: classes, | ||
ColumnResizeHandler.contextType = TableContext; | ||
ColumnResizeHandler.propTypes = { | ||
height: PropTypes.number, | ||
defaultColumnWidth: PropTypes.number, | ||
columnLeft: PropTypes.number, | ||
columnFixed: PropTypes.oneOfType([PropTypes.bool, PropTypes.oneOf(['left', 'right'])]), | ||
className: PropTypes.string, | ||
classPrefix: PropTypes.string, | ||
minWidth: PropTypes.number, | ||
style: PropTypes.object, | ||
onColumnResizeStart: PropTypes.func, | ||
onColumnResizeEnd: PropTypes.func, | ||
onColumnResizeMove: PropTypes.func | ||
}; | ||
ColumnResizeHandler.defaultProps = { | ||
classPrefix: defaultClassPrefix('table-column-resize-spanner') | ||
}; | ||
ColumnResizeHandler.propTypes = propTypes; | ||
export default ColumnResizeHandler; |
@@ -1,27 +0,58 @@ | ||
import { CellProps } from './Cell.d'; | ||
import * as React from 'react'; | ||
import PropTypes from 'prop-types'; | ||
import { CellProps } from './Cell'; | ||
export interface HeaderCellProps extends CellProps { | ||
index?: number; | ||
minWidth?: number; | ||
sortColumn?: string; | ||
sortType?: 'desc' | 'asc'; | ||
sortable?: boolean; | ||
resizable?: boolean; | ||
onColumnResizeStart?: (columnWidth?: number, left?: number, fixed?: boolean) => void; | ||
onColumnResizeEnd?: ( | ||
columnWidth?: number, | ||
cursorDelta?: number, | ||
dataKey?: any, | ||
index?: number | ||
) => void; | ||
onResize?: (columnWidth?: number, dataKey?: string) => void; | ||
onColumnResizeMove?: (columnWidth?: number, columnLeft?: number, columnFixed?: boolean) => void; | ||
onSortColumn?: (dataKey?: string) => void; | ||
flexGrow?: number; | ||
fixed?: boolean | 'left' | 'right'; | ||
children: React.ReactNode; | ||
index?: number; | ||
minWidth?: number; | ||
sortColumn?: string; | ||
sortType?: 'desc' | 'asc'; | ||
sortable?: boolean; | ||
resizable?: boolean; | ||
onColumnResizeStart?: (columnWidth?: number, left?: number, fixed?: boolean) => void; | ||
onColumnResizeEnd?: (columnWidth?: number, cursorDelta?: number, dataKey?: any, index?: number) => void; | ||
onResize?: (columnWidth?: number, dataKey?: string) => void; | ||
onColumnResizeMove?: (columnWidth?: number, columnLeft?: number, columnFixed?: boolean) => void; | ||
onSortColumn?: (dataKey?: string) => void; | ||
flexGrow?: number; | ||
fixed?: boolean | 'left' | 'right'; | ||
children: React.ReactNode; | ||
} | ||
declare const HeaderCell: React.ComponentType<HeaderCellProps>; | ||
interface HeaderCelltate { | ||
columnWidth?: number; | ||
width?: number; | ||
flexGrow?: number; | ||
} | ||
declare class HeaderCell extends React.PureComponent<HeaderCellProps, HeaderCelltate> { | ||
static propTypes: { | ||
index: PropTypes.Requireable<number>; | ||
sortColumn: PropTypes.Requireable<string>; | ||
sortType: PropTypes.Requireable<string>; | ||
sortable: PropTypes.Requireable<boolean>; | ||
resizable: PropTypes.Requireable<boolean>; | ||
minWidth: PropTypes.Requireable<number>; | ||
onColumnResizeStart: PropTypes.Requireable<(...args: any[]) => any>; | ||
onColumnResizeEnd: PropTypes.Requireable<(...args: any[]) => any>; | ||
onResize: PropTypes.Requireable<(...args: any[]) => any>; | ||
onColumnResizeMove: PropTypes.Requireable<(...args: any[]) => any>; | ||
onSortColumn: PropTypes.Requireable<(...args: any[]) => any>; | ||
flexGrow: PropTypes.Requireable<number>; | ||
fixed: PropTypes.Requireable<string | boolean>; | ||
children: PropTypes.Requireable<PropTypes.ReactNodeLike>; | ||
}; | ||
static contextType: React.Context<import("./TableContext").TableContextProps>; | ||
static getDerivedStateFromProps(nextProps: HeaderCellProps, prevState: HeaderCelltate): { | ||
width: number; | ||
flexGrow: number; | ||
columnWidth: number; | ||
}; | ||
constructor(props: HeaderCellProps); | ||
handleColumnResizeStart: () => void; | ||
handleColumnResizeEnd: (columnWidth?: number, cursorDelta?: number) => void; | ||
handleClick: () => void; | ||
getClassPrefix: () => string; | ||
addPrefix: (name: string) => string; | ||
renderResizeSpanner(): JSX.Element; | ||
renderSortColumn(): React.ReactNode; | ||
render(): JSX.Element; | ||
} | ||
export default HeaderCell; |
@@ -10,2 +10,3 @@ import _extends from "@babel/runtime/helpers/esm/extends"; | ||
import SortDown from '@rsuite/icons/SortDown'; | ||
import TableContext from './TableContext'; | ||
import ColumnResizeHandler from './ColumnResizeHandler'; | ||
@@ -18,2 +19,18 @@ import { isNullOrUndefined, getUnhandledProps, defaultClassPrefix, prefix } from './utils'; | ||
}; | ||
var propTypes = { | ||
index: PropTypes.number, | ||
sortColumn: PropTypes.string, | ||
sortType: PropTypes.oneOf(['desc', 'asc']), | ||
sortable: PropTypes.bool, | ||
resizable: PropTypes.bool, | ||
minWidth: PropTypes.number, | ||
onColumnResizeStart: PropTypes.func, | ||
onColumnResizeEnd: PropTypes.func, | ||
onResize: PropTypes.func, | ||
onColumnResizeMove: PropTypes.func, | ||
onSortColumn: PropTypes.func, | ||
flexGrow: PropTypes.number, | ||
fixed: PropTypes.oneOfType([PropTypes.bool, PropTypes.oneOf(['left', 'right'])]), | ||
children: PropTypes.node | ||
}; | ||
@@ -71,4 +88,8 @@ var HeaderCell = /*#__PURE__*/function (_React$PureComponent) { | ||
_this.getClassPrefix = function () { | ||
return _this.props.classPrefix || defaultClassPrefix('table-cell-header', _this.context.classPrefix); | ||
}; | ||
_this.addPrefix = function (name) { | ||
return prefix(_this.props.classPrefix)(name); | ||
return prefix(_this.getClassPrefix())(name); | ||
}; | ||
@@ -119,5 +140,6 @@ | ||
sortType = _this$props5$sortType === void 0 ? '' : _this$props5$sortType, | ||
dataKey = _this$props5.dataKey; | ||
dataKey = _this$props5.dataKey, | ||
groupHeader = _this$props5.groupHeader; | ||
if (sortable) { | ||
if (sortable && !groupHeader) { | ||
var _classNames; | ||
@@ -148,9 +170,9 @@ | ||
sortable = _this$props6.sortable, | ||
classPrefix = _this$props6.classPrefix, | ||
sortColumn = _this$props6.sortColumn, | ||
sortType = _this$props6.sortType, | ||
rest = _objectWithoutPropertiesLoose(_this$props6, ["className", "width", "dataKey", "headerHeight", "children", "left", "sortable", "classPrefix", "sortColumn", "sortType"]); | ||
groupHeader = _this$props6.groupHeader, | ||
rest = _objectWithoutPropertiesLoose(_this$props6, ["className", "width", "dataKey", "headerHeight", "children", "left", "sortable", "sortColumn", "sortType", "groupHeader"]); | ||
var classes = classNames(classPrefix, className, (_classNames2 = {}, _classNames2[this.addPrefix('sortable')] = sortable, _classNames2)); | ||
var unhandledProps = getUnhandledProps(HeaderCell, rest); | ||
var classes = classNames(this.getClassPrefix(), className, (_classNames2 = {}, _classNames2[this.addPrefix('sortable')] = sortable, _classNames2)); | ||
var unhandledProps = getUnhandledProps(propTypes, rest); | ||
var ariaSort; | ||
@@ -178,3 +200,3 @@ | ||
isHeaderCell: true, | ||
onClick: this.handleClick | ||
onClick: !groupHeader ? this.handleClick : null | ||
}), children, this.renderSortColumn()), this.renderResizeSpanner()); | ||
@@ -186,21 +208,4 @@ }; | ||
HeaderCell.propTypes = { | ||
index: PropTypes.number, | ||
sortColumn: PropTypes.string, | ||
sortType: PropTypes.oneOf(['desc', 'asc']), | ||
sortable: PropTypes.bool, | ||
resizable: PropTypes.bool, | ||
minWidth: PropTypes.number, | ||
onColumnResizeStart: PropTypes.func, | ||
onColumnResizeEnd: PropTypes.func, | ||
onResize: PropTypes.func, | ||
onColumnResizeMove: PropTypes.func, | ||
onSortColumn: PropTypes.func, | ||
flexGrow: PropTypes.number, | ||
fixed: PropTypes.oneOfType([PropTypes.bool, PropTypes.oneOf(['left', 'right'])]), | ||
children: PropTypes.node | ||
}; | ||
HeaderCell.defaultProps = { | ||
classPrefix: defaultClassPrefix('table-cell-header') | ||
}; | ||
HeaderCell.propTypes = propTypes; | ||
HeaderCell.contextType = TableContext; | ||
export default HeaderCell; |
@@ -1,18 +0,15 @@ | ||
import * as React from 'react'; | ||
import { StandardProps } from './common'; | ||
import React from 'react'; | ||
import { StandardProps } from './@types/common'; | ||
export interface RowProps extends StandardProps { | ||
width?: number; | ||
height?: number; | ||
headerHeight?: number; | ||
top?: number; | ||
isHeaderRow?: boolean; | ||
rowRef?: React.Ref<any>; | ||
className?: string; | ||
classPrefix?: string; | ||
style?: React.CSSProperties; | ||
width?: number; | ||
height?: number; | ||
headerHeight?: number; | ||
top?: number; | ||
isHeaderRow?: boolean; | ||
rowRef?: React.Ref<any>; | ||
className?: string; | ||
classPrefix?: string; | ||
style?: React.CSSProperties; | ||
} | ||
declare const Row: React.ComponentType<RowProps>; | ||
declare const Row: React.ForwardRefExoticComponent<Pick<RowProps, string | number> & React.RefAttributes<HTMLDivElement>>; | ||
export default Row; |
import _extends from "@babel/runtime/helpers/esm/extends"; | ||
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose"; | ||
import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose"; | ||
import * as React from 'react'; | ||
import React, { useContext } from 'react'; | ||
import PropTypes from 'prop-types'; | ||
import classNames from 'classnames'; | ||
import { defaultClassPrefix, getUnhandledProps, prefix } from './utils'; | ||
import { defaultClassPrefix, prefix, mergeRefs } from './utils'; | ||
import TableContext from './TableContext'; | ||
var Row = /*#__PURE__*/React.forwardRef(function (props, ref) { | ||
var _classNames; | ||
var Row = /*#__PURE__*/function (_React$PureComponent) { | ||
_inheritsLoose(Row, _React$PureComponent); | ||
var className = props.className, | ||
width = props.width, | ||
height = props.height, | ||
top = props.top, | ||
style = props.style, | ||
isHeaderRow = props.isHeaderRow, | ||
headerHeight = props.headerHeight, | ||
rowRef = props.rowRef, | ||
classPrefix = props.classPrefix, | ||
children = props.children, | ||
rest = _objectWithoutPropertiesLoose(props, ["className", "width", "height", "top", "style", "isHeaderRow", "headerHeight", "rowRef", "classPrefix", "children"]); | ||
function Row() { | ||
return _React$PureComponent.apply(this, arguments) || this; | ||
} | ||
var addPrefix = prefix(classPrefix); | ||
var classes = classNames(classPrefix, className, (_classNames = {}, _classNames[addPrefix('header')] = isHeaderRow, _classNames)); | ||
var _proto = Row.prototype; | ||
var _useContext = useContext(TableContext), | ||
translateDOMPositionXY = _useContext.translateDOMPositionXY; | ||
_proto.render = function render() { | ||
var _classNames; | ||
var styles = _extends({ | ||
minWidth: width, | ||
height: isHeaderRow ? headerHeight : height | ||
}, style); | ||
var _this$props = this.props, | ||
className = _this$props.className, | ||
width = _this$props.width, | ||
height = _this$props.height, | ||
top = _this$props.top, | ||
style = _this$props.style, | ||
isHeaderRow = _this$props.isHeaderRow, | ||
headerHeight = _this$props.headerHeight, | ||
rowRef = _this$props.rowRef, | ||
classPrefix = _this$props.classPrefix, | ||
children = _this$props.children, | ||
rest = _objectWithoutPropertiesLoose(_this$props, ["className", "width", "height", "top", "style", "isHeaderRow", "headerHeight", "rowRef", "classPrefix", "children"]); | ||
var addPrefix = prefix(classPrefix); | ||
var classes = classNames(classPrefix, className, (_classNames = {}, _classNames[addPrefix('header')] = isHeaderRow, _classNames)); | ||
var styles = _extends({ | ||
minWidth: width, | ||
height: isHeaderRow ? headerHeight : height | ||
}, style); | ||
var unhandledProps = getUnhandledProps(Row, rest); | ||
return /*#__PURE__*/React.createElement(TableContext.Consumer, null, function (_ref) { | ||
var translateDOMPositionXY = _ref.translateDOMPositionXY; | ||
translateDOMPositionXY === null || translateDOMPositionXY === void 0 ? void 0 : translateDOMPositionXY(styles, 0, top); | ||
return /*#__PURE__*/React.createElement("div", _extends({ | ||
role: "row" | ||
}, unhandledProps, { | ||
ref: rowRef, | ||
className: classes, | ||
style: styles | ||
}), children); | ||
}); | ||
}; | ||
return Row; | ||
}(React.PureComponent); | ||
translateDOMPositionXY === null || translateDOMPositionXY === void 0 ? void 0 : translateDOMPositionXY(styles, 0, top); | ||
return /*#__PURE__*/React.createElement("div", _extends({ | ||
role: "row" | ||
}, rest, { | ||
ref: mergeRefs(rowRef, ref), | ||
className: classes, | ||
style: styles | ||
}), children); | ||
}); | ||
Row.displayName = 'Row'; | ||
Row.defaultProps = { | ||
classPrefix: defaultClassPrefix('table-row'), | ||
height: 46, | ||
headerHeight: 40 | ||
}; | ||
Row.propTypes = { | ||
@@ -71,7 +60,2 @@ width: PropTypes.number, | ||
}; | ||
Row.defaultProps = { | ||
classPrefix: defaultClassPrefix('table-row'), | ||
height: 46, | ||
headerHeight: 40 | ||
}; | ||
export default Row; |
import * as React from 'react'; | ||
import PropTypes from 'prop-types'; | ||
export interface ScrollbarProps { | ||
vertical?: boolean; | ||
length: number; | ||
scrollLength: number; | ||
className?: string; | ||
classPrefix?: string; | ||
tableId?: string; | ||
onScroll?: (delta: number, event: React.MouseEvent) => void; | ||
onMouseDown?: (event: React.MouseEvent) => void; | ||
[key: string]: any; | ||
vertical?: boolean; | ||
length: number; | ||
scrollLength: number; | ||
className?: string; | ||
classPrefix?: string; | ||
tableId?: string; | ||
onScroll?: (delta: number, event: React.MouseEvent) => void; | ||
onMouseDown?: (event: React.MouseEvent) => void; | ||
[key: string]: any; | ||
} | ||
declare const Scrollbar: React.ComponentType<ScrollbarProps>; | ||
declare type Offset = { | ||
top: number; | ||
left: number; | ||
height?: number; | ||
width?: number; | ||
}; | ||
declare type State = { | ||
barOffset: Offset; | ||
handlePressed: boolean; | ||
}; | ||
declare class Scrollbar extends React.PureComponent<ScrollbarProps, State> { | ||
static contextType: React.Context<import("./TableContext").TableContextProps>; | ||
static propTypes: { | ||
tableId: PropTypes.Requireable<string>; | ||
vertical: PropTypes.Requireable<boolean>; | ||
length: PropTypes.Requireable<number>; | ||
scrollLength: PropTypes.Requireable<number>; | ||
className: PropTypes.Requireable<string>; | ||
classPrefix: PropTypes.Requireable<string>; | ||
onScroll: PropTypes.Requireable<(...args: any[]) => any>; | ||
onMouseDown: PropTypes.Requireable<(...args: any[]) => any>; | ||
}; | ||
static defaultProps: { | ||
classPrefix: string; | ||
scrollLength: number; | ||
length: number; | ||
}; | ||
scrollOffset: number; | ||
mouseMoveTracker: any; | ||
handleRef: React.RefObject<HTMLDivElement>; | ||
barRef: React.RefObject<HTMLDivElement>; | ||
constructor(props: ScrollbarProps); | ||
componentDidMount(): void; | ||
componentWillUnmount(): void; | ||
onWheelScroll(delta: number): void; | ||
getMouseMoveTracker(): any; | ||
initBarOffset(): void; | ||
handleMouseDown: (event: React.MouseEvent) => void; | ||
handleDragEnd: () => void; | ||
handleScroll(delta: number, event: React.MouseEvent): void; | ||
resetScrollBarPosition(forceDelta?: number): void; | ||
updateScrollBarPosition(delta: number, forceDelta?: number): void; | ||
releaseMouseMoves(): void; | ||
handleDragMove: (deltaX: number, deltaY: number, event: React.MouseEvent) => void; | ||
/** | ||
* 点击滚动条,然后滚动到指定位置 | ||
*/ | ||
handleClick: (event: React.MouseEvent) => void; | ||
render(): JSX.Element; | ||
} | ||
export default Scrollbar; |
@@ -11,2 +11,12 @@ import _extends from "@babel/runtime/helpers/esm/extends"; | ||
import TableContext from './TableContext'; | ||
var propTypes = { | ||
tableId: PropTypes.string, | ||
vertical: PropTypes.bool, | ||
length: PropTypes.number, | ||
scrollLength: PropTypes.number, | ||
className: PropTypes.string, | ||
classPrefix: PropTypes.string, | ||
onScroll: PropTypes.func, | ||
onMouseDown: PropTypes.func | ||
}; | ||
@@ -198,3 +208,3 @@ var Scrollbar = /*#__PURE__*/function (_React$PureComponent) { | ||
var styles = (_styles = {}, _styles[vertical ? 'height' : 'width'] = width + "%", _styles[vertical ? 'minHeight' : 'minWidth'] = SCROLLBAR_MIN_WIDTH, _styles); | ||
var unhandled = getUnhandledProps(Scrollbar, rest); | ||
var unhandled = getUnhandledProps(propTypes, rest); | ||
var valuenow = this.scrollOffset / length * 100 + width; | ||
@@ -226,12 +236,3 @@ return /*#__PURE__*/React.createElement("div", _extends({ | ||
Scrollbar.contextType = TableContext; | ||
Scrollbar.propTypes = { | ||
tableId: PropTypes.string, | ||
vertical: PropTypes.bool, | ||
length: PropTypes.number, | ||
scrollLength: PropTypes.number, | ||
className: PropTypes.string, | ||
classPrefix: PropTypes.string, | ||
onScroll: PropTypes.func, | ||
onMouseDown: PropTypes.func | ||
}; | ||
Scrollbar.propTypes = propTypes; | ||
Scrollbar.defaultProps = { | ||
@@ -238,0 +239,0 @@ classPrefix: defaultClassPrefix('table-scrollbar'), |
import * as React from 'react'; | ||
import { StandardProps, SortType, RowDataType } from './common'; | ||
import PropTypes from 'prop-types'; | ||
import { RowProps } from './Row'; | ||
import { StandardProps, SortType, RowDataType } from './@types/common'; | ||
export interface TableLocale { | ||
emptyMessage?: string; | ||
loading?: string; | ||
emptyMessage?: string; | ||
loading?: string; | ||
} | ||
export interface TableProps extends StandardProps { | ||
autoHeight?: boolean; | ||
affixHeader?: boolean | number; | ||
affixHorizontalScrollbar?: boolean | number; | ||
bodyRef?: (ref: HTMLElement) => void; | ||
bordered?: boolean; | ||
className?: string; | ||
classPrefix?: string; | ||
children: React.ReactNode; | ||
cellBordered?: boolean; | ||
defaultSortType?: SortType; | ||
disabledScroll?: boolean; | ||
defaultExpandAllRows?: boolean; | ||
defaultExpandedRowKeys?: string[] | number[]; | ||
data: object[]; | ||
expandedRowKeys?: string[] | number[]; | ||
height: number; | ||
hover: boolean; | ||
headerHeight: number; | ||
locale: TableLocale; | ||
loading?: boolean; | ||
loadAnimation?: boolean; | ||
minHeight: number; | ||
rowHeight: number | ((rowData: object) => number); | ||
rowKey: string | number; | ||
isTree?: boolean; | ||
rowExpandedHeight?: number; | ||
rowClassName?: string | ((rowData: object) => string); | ||
showHeader?: boolean; | ||
style?: React.CSSProperties; | ||
sortColumn?: string; | ||
sortType?: SortType; | ||
shouldUpdateScroll?: boolean; | ||
translate3d?: boolean; | ||
rtl?: boolean; | ||
width?: number; | ||
wordWrap?: boolean; | ||
virtualized?: boolean; | ||
renderTreeToggle?: ( | ||
expandButton: React.ReactNode, | ||
rowData?: RowDataType, | ||
expanded?: boolean | ||
) => React.ReactNode; | ||
renderRowExpanded?: (rowDate?: object) => React.ReactNode; | ||
renderEmpty?: (info: React.ReactNode) => React.ReactNode; | ||
renderLoading?: (loading: React.ReactNode) => React.ReactNode; | ||
onRowClick?: (rowData: object, event: React.MouseEvent) => void; | ||
onRowContextMenu?: (rowData: object, event: React.MouseEvent) => void; | ||
onScroll?: (scrollX: number, scrollY: number) => void; | ||
onSortColumn?: (dataKey: string, sortType?: SortType) => void; | ||
onExpandChange?: (expanded: boolean, rowData: object) => void; | ||
onTouchStart?: (event: React.TouchEvent) => void; // for tests | ||
onTouchMove?: (event: React.TouchEvent) => void; // for tests | ||
onDataUpdated?: (nextData: object[], scrollTo: (coord: { x: number; y: number }) => void) => void; | ||
autoHeight?: boolean; | ||
affixHeader?: boolean | number; | ||
affixHorizontalScrollbar?: boolean | number; | ||
bodyRef?: (ref: HTMLElement) => void; | ||
bordered?: boolean; | ||
className?: string; | ||
classPrefix?: string; | ||
children: React.ReactNode; | ||
cellBordered?: boolean; | ||
defaultSortType?: SortType; | ||
disabledScroll?: boolean; | ||
defaultExpandAllRows?: boolean; | ||
defaultExpandedRowKeys?: string[] | number[]; | ||
data: object[]; | ||
expandedRowKeys?: string[] | number[]; | ||
height: number; | ||
hover: boolean; | ||
headerHeight: number; | ||
locale: TableLocale; | ||
loading?: boolean; | ||
loadAnimation?: boolean; | ||
minHeight: number; | ||
rowHeight: number | ((rowData: object) => number); | ||
rowKey: string | number; | ||
isTree?: boolean; | ||
rowExpandedHeight?: number; | ||
rowClassName?: string | ((rowData: object) => string); | ||
showHeader?: boolean; | ||
style?: React.CSSProperties; | ||
sortColumn?: string; | ||
sortType?: SortType; | ||
shouldUpdateScroll?: boolean; | ||
translate3d?: boolean; | ||
rtl?: boolean; | ||
width?: number; | ||
wordWrap?: boolean; | ||
virtualized?: boolean; | ||
renderTreeToggle?: (expandButton: React.ReactNode, rowData?: RowDataType, expanded?: boolean) => React.ReactNode; | ||
renderRowExpanded?: (rowDate?: object) => React.ReactNode; | ||
renderEmpty?: (info: React.ReactNode) => React.ReactNode; | ||
renderLoading?: (loading: React.ReactNode) => React.ReactNode; | ||
onRowClick?: (rowData: object, event: React.MouseEvent) => void; | ||
onRowContextMenu?: (rowData: object, event: React.MouseEvent) => void; | ||
onScroll?: (scrollX: number, scrollY: number) => void; | ||
onSortColumn?: (dataKey: string, sortType?: SortType) => void; | ||
onExpandChange?: (expanded: boolean, rowData: object) => void; | ||
onTouchStart?: (event: React.TouchEvent) => void; | ||
onTouchMove?: (event: React.TouchEvent) => void; | ||
onDataUpdated?: (nextData: object[], scrollTo: (coord: { | ||
x: number; | ||
y: number; | ||
}) => void) => void; | ||
} | ||
declare const Table: React.ComponentType<TableProps>; | ||
interface TableRowProps extends RowProps { | ||
key?: string | number; | ||
depth?: number; | ||
} | ||
declare type Offset = { | ||
top?: number; | ||
left?: number; | ||
width?: number; | ||
height?: number; | ||
}; | ||
interface TableState { | ||
headerOffset?: Offset; | ||
tableOffset?: Offset; | ||
width: number; | ||
columnWidth: number; | ||
dataKey: number; | ||
shouldFixedColumn: boolean; | ||
contentHeight: number; | ||
contentWidth: number; | ||
tableRowsMaxHeight: number[]; | ||
isColumnResizing?: boolean; | ||
expandedRowKeys: string[] | number[]; | ||
sortType?: SortType; | ||
scrollY: number; | ||
isScrolling?: boolean; | ||
data: object[]; | ||
cacheData: object[]; | ||
fixedHeader: boolean; | ||
fixedHorizontalScrollbar?: boolean; | ||
isTree?: boolean; | ||
[key: string]: any; | ||
} | ||
declare class Table extends React.Component<TableProps, TableState> { | ||
static propTypes: { | ||
autoHeight: PropTypes.Requireable<boolean>; | ||
affixHeader: PropTypes.Requireable<number | boolean>; | ||
affixHorizontalScrollbar: PropTypes.Requireable<number | boolean>; | ||
bordered: PropTypes.Requireable<boolean>; | ||
bodyRef: PropTypes.Requireable<(...args: any[]) => any>; | ||
className: PropTypes.Requireable<string>; | ||
classPrefix: PropTypes.Requireable<string>; | ||
children: PropTypes.Requireable<any>; | ||
cellBordered: PropTypes.Requireable<boolean>; | ||
data: PropTypes.Requireable<object[]>; | ||
defaultExpandAllRows: PropTypes.Requireable<boolean>; | ||
defaultExpandedRowKeys: PropTypes.Requireable<(string | number)[]>; | ||
defaultSortType: PropTypes.Requireable<string | boolean>; | ||
disabledScroll: PropTypes.Requireable<boolean>; | ||
expandedRowKeys: PropTypes.Requireable<(string | number)[]>; | ||
hover: PropTypes.Requireable<boolean>; | ||
height: PropTypes.Requireable<number>; | ||
headerHeight: PropTypes.Requireable<number>; | ||
locale: PropTypes.Requireable<object>; | ||
loading: PropTypes.Requireable<boolean>; | ||
loadAnimation: PropTypes.Requireable<boolean>; | ||
minHeight: PropTypes.Requireable<number>; | ||
rowKey: PropTypes.Requireable<string | number>; | ||
rowHeight: PropTypes.Requireable<number | ((...args: any[]) => any)>; | ||
renderTreeToggle: PropTypes.Requireable<(...args: any[]) => any>; | ||
renderRowExpanded: PropTypes.Requireable<(...args: any[]) => any>; | ||
rowExpandedHeight: PropTypes.Requireable<number>; | ||
renderEmpty: PropTypes.Requireable<(...args: any[]) => any>; | ||
renderLoading: PropTypes.Requireable<(...args: any[]) => any>; | ||
rowClassName: PropTypes.Requireable<string | ((...args: any[]) => any)>; | ||
rtl: PropTypes.Requireable<boolean>; | ||
style: PropTypes.Requireable<object>; | ||
sortColumn: PropTypes.Requireable<string>; | ||
sortType: PropTypes.Requireable<string | boolean>; | ||
showHeader: PropTypes.Requireable<boolean>; | ||
shouldUpdateScroll: PropTypes.Requireable<boolean>; | ||
translate3d: PropTypes.Requireable<boolean>; | ||
wordWrap: PropTypes.Requireable<boolean>; | ||
width: PropTypes.Requireable<number>; | ||
virtualized: PropTypes.Requireable<boolean>; | ||
isTree: PropTypes.Requireable<boolean>; | ||
onRowClick: PropTypes.Requireable<(...args: any[]) => any>; | ||
onRowContextMenu: PropTypes.Requireable<(...args: any[]) => any>; | ||
onScroll: PropTypes.Requireable<(...args: any[]) => any>; | ||
onSortColumn: PropTypes.Requireable<(...args: any[]) => any>; | ||
onExpandChange: PropTypes.Requireable<(...args: any[]) => any>; | ||
onTouchStart: PropTypes.Requireable<(...args: any[]) => any>; | ||
onTouchMove: PropTypes.Requireable<(...args: any[]) => any>; | ||
onDataUpdated: PropTypes.Requireable<(...args: any[]) => any>; | ||
}; | ||
static defaultProps: { | ||
classPrefix: string; | ||
data: any[]; | ||
defaultSortType: string; | ||
height: number; | ||
rowHeight: number; | ||
headerHeight: number; | ||
minHeight: number; | ||
rowExpandedHeight: number; | ||
hover: boolean; | ||
showHeader: boolean; | ||
rowKey: string; | ||
translate3d: boolean; | ||
shouldUpdateScroll: boolean; | ||
locale: { | ||
emptyMessage: string; | ||
loading: string; | ||
}; | ||
}; | ||
static getDerivedStateFromProps(props: TableProps, state: TableState): { | ||
cacheData: object[]; | ||
isTree: boolean; | ||
data: any[]; | ||
}; | ||
translateDOMPositionXY: any; | ||
scrollListener: any; | ||
tableRef: React.RefObject<any>; | ||
scrollbarYRef: React.RefObject<any>; | ||
scrollbarXRef: React.RefObject<any>; | ||
tableBodyRef: React.RefObject<any>; | ||
affixHeaderWrapperRef: React.RefObject<any>; | ||
mouseAreaRef: React.RefObject<any>; | ||
headerWrapperRef: React.RefObject<any>; | ||
tableHeaderRef: React.RefObject<any>; | ||
wheelWrapperRef: React.RefObject<any>; | ||
tableRows: { | ||
[key: string]: [HTMLElement, any]; | ||
}; | ||
mounted: boolean; | ||
disableEventsTimeoutId: any; | ||
scrollY: number; | ||
scrollX: number; | ||
wheelHandler: any; | ||
minScrollY: any; | ||
minScrollX: any; | ||
mouseArea: any; | ||
touchX: any; | ||
touchY: any; | ||
wheelListener: any; | ||
touchStartListener: any; | ||
touchMoveListener: any; | ||
_cacheCells: any; | ||
_cacheChildrenSize: number; | ||
_visibleRows: any[]; | ||
constructor(props: TableProps); | ||
listenWheel: (deltaX: number, deltaY: number) => void; | ||
componentDidMount(): void; | ||
shouldComponentUpdate(nextProps: TableProps, nextState: TableState): boolean; | ||
componentDidUpdate(prevProps: TableProps, prevState: TableState): void; | ||
componentWillUnmount(): void; | ||
getExpandedRowKeys(): string[] | number[]; | ||
getSortType(): "desc" | "asc"; | ||
getScrollCellGroups(): any; | ||
getFixedLeftCellGroups(): any; | ||
getFixedRightCellGroups(): any; | ||
isRTL(): boolean; | ||
getRowHeight(rowData?: {}): number; | ||
/** | ||
* 获取表头高度 | ||
*/ | ||
getTableHeaderHeight(): number; | ||
/** | ||
* 获取 Table 需要渲染的高度 | ||
*/ | ||
getTableHeight(): number; | ||
/** | ||
* 获取 columns ReactElement 数组 | ||
* - 处理 children 中存在 <Column> 数组的情况 | ||
* - 过滤 children 中的空项 | ||
*/ | ||
getTableColumns(): React.ReactNodeArray; | ||
getCellDescriptor(): any; | ||
setOffsetByAffix: () => void; | ||
handleWindowScroll: () => void; | ||
affixHorizontalScrollbar: () => void; | ||
affixTableHeader: () => void; | ||
handleSortColumn: (dataKey: string) => void; | ||
handleColumnResizeEnd: (columnWidth: number, _cursorDelta: number, dataKey: any, index: number) => void; | ||
handleColumnResizeStart: (width: number, left: number, fixed: boolean) => void; | ||
handleColumnResizeMove: (width: number, left: number, fixed: boolean) => void; | ||
handleTreeToggle: (rowKey: any, _rowIndex: number, rowData: any) => void; | ||
handleScrollX: (delta: number) => void; | ||
handleScrollY: (delta: number) => void; | ||
handleWheel: (deltaX: number, deltaY: number) => void; | ||
debounceScrollEndedCallback: () => void; | ||
handleTouchStart: (event: React.TouchEvent) => void; | ||
handleTouchMove: (event: React.TouchEvent) => void; | ||
/** | ||
* 当用户在 Table 内使用 tab 键,触发了 onScroll 事件,这个时候应该更新滚动条位置 | ||
* https://github.com/rsuite/rsuite/issues/234 | ||
*/ | ||
handleBodyScroll: (event: any) => void; | ||
initPosition(): void; | ||
updatePosition(): void; | ||
updatePositionByFixedCell(): void; | ||
shouldHandleWheelX: (delta: number) => boolean; | ||
shouldHandleWheelY: (delta: number) => boolean; | ||
shouldRenderExpandedRow(rowData: object): boolean; | ||
addPrefix: (name: string) => string; | ||
calculateRowMaxHeight(): void; | ||
calculateTableWidth: () => void; | ||
calculateTableContentWidth(prevProps: TableProps): void; | ||
calculateTableContextHeight(prevProps?: TableProps): void; | ||
getControlledScrollTopValue(value: any): number[]; | ||
getControlledScrollLeftValue(value: any): number[]; | ||
/** | ||
* public method | ||
*/ | ||
scrollTop: (top?: number) => void; | ||
scrollLeft: (left?: number) => void; | ||
scrollTo: (coord: { | ||
x: number; | ||
y: number; | ||
}) => void; | ||
bindTableRowsRef: (index: number | string, rowData: any) => (ref: HTMLElement) => void; | ||
bindRowClick: (rowData: object) => (event: React.MouseEvent) => void; | ||
bindRowContextMenu: (rowData: object) => (event: React.MouseEvent) => void; | ||
renderRowData(bodyCells: any[], rowData: any, props: TableRowProps, shouldRenderExpandedRow?: boolean): JSX.Element; | ||
renderRow(props: TableRowProps, cells: any[], shouldRenderExpandedRow?: boolean, rowData?: any): JSX.Element; | ||
renderRowExpanded(rowData?: object): JSX.Element; | ||
renderMouseArea(): JSX.Element; | ||
renderTableHeader(headerCells: any[], rowWidth: number): JSX.Element; | ||
renderTableBody(bodyCells: any[], rowWidth: number): JSX.Element; | ||
renderInfo(): {}; | ||
renderScrollbar(): JSX.Element[]; | ||
/** | ||
* show loading | ||
*/ | ||
renderLoading(): {}; | ||
render(): JSX.Element; | ||
} | ||
export default Table; |
239
es/Table.js
@@ -28,2 +28,53 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose"; | ||
}; | ||
var propTypes = { | ||
autoHeight: PropTypes.bool, | ||
affixHeader: PropTypes.oneOfType([PropTypes.bool, PropTypes.number]), | ||
affixHorizontalScrollbar: PropTypes.oneOfType([PropTypes.bool, PropTypes.number]), | ||
bordered: PropTypes.bool, | ||
bodyRef: PropTypes.func, | ||
className: PropTypes.string, | ||
classPrefix: PropTypes.string, | ||
children: PropTypes.any, | ||
cellBordered: PropTypes.bool, | ||
data: PropTypes.arrayOf(PropTypes.object), | ||
defaultExpandAllRows: PropTypes.bool, | ||
defaultExpandedRowKeys: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])), | ||
defaultSortType: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]), | ||
disabledScroll: PropTypes.bool, | ||
expandedRowKeys: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])), | ||
hover: PropTypes.bool, | ||
height: PropTypes.number, | ||
headerHeight: PropTypes.number, | ||
locale: PropTypes.object, | ||
loading: PropTypes.bool, | ||
loadAnimation: PropTypes.bool, | ||
minHeight: PropTypes.number, | ||
rowKey: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), | ||
rowHeight: PropTypes.oneOfType([PropTypes.number, PropTypes.func]), | ||
renderTreeToggle: PropTypes.func, | ||
renderRowExpanded: PropTypes.func, | ||
rowExpandedHeight: PropTypes.number, | ||
renderEmpty: PropTypes.func, | ||
renderLoading: PropTypes.func, | ||
rowClassName: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), | ||
rtl: PropTypes.bool, | ||
style: PropTypes.object, | ||
sortColumn: PropTypes.string, | ||
sortType: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]), | ||
showHeader: PropTypes.bool, | ||
shouldUpdateScroll: PropTypes.bool, | ||
translate3d: PropTypes.bool, | ||
wordWrap: PropTypes.bool, | ||
width: PropTypes.number, | ||
virtualized: PropTypes.bool, | ||
isTree: PropTypes.bool, | ||
onRowClick: PropTypes.func, | ||
onRowContextMenu: PropTypes.func, | ||
onScroll: PropTypes.func, | ||
onSortColumn: PropTypes.func, | ||
onExpandChange: PropTypes.func, | ||
onTouchStart: PropTypes.func, | ||
onTouchMove: PropTypes.func, | ||
onDataUpdated: PropTypes.func | ||
}; | ||
@@ -755,7 +806,7 @@ var Table = /*#__PURE__*/function (_React$Component) { | ||
// 把 ColumnGroup 设置的属性覆盖到 Column | ||
var groupCellProps = { | ||
var groupCellProps = _extends({}, childColumn === null || childColumn === void 0 ? void 0 : childColumn.props, { | ||
align: align, | ||
fixed: fixed, | ||
verticalAlign: verticalAlign | ||
}; | ||
}); | ||
/** | ||
@@ -768,2 +819,3 @@ * 为分组中的第一列设置属性: | ||
if (index === 0) { | ||
@@ -1129,3 +1181,4 @@ groupCellProps.groupCount = childColumns.length; | ||
wordWrap = _this$props20.wordWrap, | ||
isTree = _this$props20.isTree; | ||
isTree = _this$props20.isTree, | ||
classPrefix = _this$props20.classPrefix; | ||
var hasChildren = isTree && rowData.children && Array.isArray(rowData.children); | ||
@@ -1135,2 +1188,3 @@ var nextRowKey = typeof rowData[rowKey] !== 'undefined' ? rowData[rowKey] : props.key; | ||
var rowProps = _extends({}, props, { | ||
classPrefix: classPrefix + "-row", | ||
key: nextRowKey, | ||
@@ -1169,3 +1223,5 @@ 'aria-rowindex': props.key + 2, | ||
_proto.renderRow = function renderRow(props, cells, shouldRenderExpandedRow, rowData) { | ||
var rowClassName = this.props.rowClassName; | ||
var _this$props21 = this.props, | ||
rowClassName = _this$props21.rowClassName, | ||
classPrefix = _this$props21.classPrefix; | ||
var _this$state6 = this.state, | ||
@@ -1179,2 +1235,4 @@ shouldFixedColumn = _this$state6.shouldFixedColumn, | ||
var cellGroupClassPrefix = classPrefix + "-cell-group"; | ||
if (typeof rowClassName === 'function') { | ||
@@ -1230,2 +1288,3 @@ restRowProps.className = rowClassName(rowData); | ||
}), fixedLeftCellGroupWidth ? /*#__PURE__*/React.createElement(CellGroup, { | ||
classPrefix: cellGroupClassPrefix, | ||
fixed: "left", | ||
@@ -1237,3 +1296,6 @@ height: props.isHeaderRow ? props.headerHeight : props.height, | ||
} : null | ||
}, mergeCells(resetLeftForCells(fixedLeftCells))) : null, /*#__PURE__*/React.createElement(CellGroup, null, mergeCells(scrollCells)), fixedRightCellGroupWidth ? /*#__PURE__*/React.createElement(CellGroup, { | ||
}, mergeCells(resetLeftForCells(fixedLeftCells))) : null, /*#__PURE__*/React.createElement(CellGroup, { | ||
classPrefix: cellGroupClassPrefix | ||
}, mergeCells(scrollCells)), fixedRightCellGroupWidth ? /*#__PURE__*/React.createElement(CellGroup, { | ||
classPrefix: cellGroupClassPrefix, | ||
fixed: "right", | ||
@@ -1253,9 +1315,11 @@ style: this.isRTL() ? { | ||
style: rowStyles | ||
}), /*#__PURE__*/React.createElement(CellGroup, null, mergeCells(cells)), shouldRenderExpandedRow && this.renderRowExpanded(rowData)); | ||
}), /*#__PURE__*/React.createElement(CellGroup, { | ||
classPrefix: cellGroupClassPrefix | ||
}, mergeCells(cells)), shouldRenderExpandedRow && this.renderRowExpanded(rowData)); | ||
}; | ||
_proto.renderRowExpanded = function renderRowExpanded(rowData) { | ||
var _this$props21 = this.props, | ||
renderRowExpanded = _this$props21.renderRowExpanded, | ||
rowExpandedHeight = _this$props21.rowExpandedHeight; | ||
var _this$props22 = this.props, | ||
renderRowExpanded = _this$props22.renderRowExpanded, | ||
rowExpandedHeight = _this$props22.rowExpandedHeight; | ||
var styles = { | ||
@@ -1293,3 +1357,5 @@ height: rowExpandedHeight | ||
_proto.renderTableHeader = function renderTableHeader(headerCells, rowWidth) { | ||
var affixHeader = this.props.affixHeader; | ||
var _this$props23 = this.props, | ||
affixHeader = _this$props23.affixHeader, | ||
classPrefix = _this$props23.classPrefix; | ||
var tableWidth = this.state.width; | ||
@@ -1299,2 +1365,3 @@ var top = typeof affixHeader === 'number' ? affixHeader : 0; | ||
var rowProps = { | ||
classPrefix: classPrefix + "-row", | ||
'aria-rowindex': 1, | ||
@@ -1329,10 +1396,10 @@ rowRef: this.tableHeaderRef, | ||
_proto.renderTableBody = function renderTableBody(bodyCells, rowWidth) { | ||
var _this$props22 = this.props, | ||
rowExpandedHeight = _this$props22.rowExpandedHeight, | ||
renderRowExpanded = _this$props22.renderRowExpanded, | ||
isTree = _this$props22.isTree, | ||
rowKey = _this$props22.rowKey, | ||
wordWrap = _this$props22.wordWrap, | ||
virtualized = _this$props22.virtualized, | ||
rowHeight = _this$props22.rowHeight; | ||
var _this$props24 = this.props, | ||
rowExpandedHeight = _this$props24.rowExpandedHeight, | ||
renderRowExpanded = _this$props24.renderRowExpanded, | ||
isTree = _this$props24.isTree, | ||
rowKey = _this$props24.rowKey, | ||
wordWrap = _this$props24.wordWrap, | ||
virtualized = _this$props24.virtualized, | ||
rowHeight = _this$props24.rowHeight; | ||
var headerHeight = this.getTableHeaderHeight(); | ||
@@ -1368,5 +1435,5 @@ var _this$state7 = this.state, | ||
for (var index = 0; index < data.length; index++) { | ||
var rowData = data[index]; | ||
var _rowData = data[index]; | ||
var maxHeight = tableRowsMaxHeight[index]; | ||
var shouldRenderExpandedRow = this.shouldRenderExpandedRow(rowData); | ||
var shouldRenderExpandedRow = this.shouldRenderExpandedRow(_rowData); | ||
var nextRowHeight = 0; | ||
@@ -1376,3 +1443,3 @@ var depth = 0; | ||
if (typeof rowHeight === 'function') { | ||
nextRowHeight = rowHeight(rowData); | ||
nextRowHeight = rowHeight(_rowData); | ||
} else { | ||
@@ -1387,3 +1454,3 @@ nextRowHeight = maxHeight ? Math.max(maxHeight + CELL_PADDING_HEIGHT, rowHeight) : rowHeight; | ||
if (isTree) { | ||
var parents = findAllParents(rowData, rowKey); | ||
var parents = findAllParents(_rowData, rowKey); | ||
var expandedRowKeys = this.getExpandedRowKeys(); | ||
@@ -1417,3 +1484,3 @@ depth = parents.length; // 如果是 Tree Table, 判断当前的行是否展开/折叠,如果是折叠则不显示该行。 | ||
this._visibleRows.push(this.renderRowData(bodyCells, rowData, rowProps, shouldRenderExpandedRow)); | ||
this._visibleRows.push(this.renderRowData(bodyCells, _rowData, rowProps, shouldRenderExpandedRow)); | ||
} | ||
@@ -1434,3 +1501,3 @@ } else { | ||
for (var _index = startIndex; _index < endIndex; _index++) { | ||
var _rowData = data[_index]; | ||
var _rowData2 = data[_index]; | ||
var _rowProps = { | ||
@@ -1443,3 +1510,3 @@ key: _index, | ||
this._visibleRows.push(this.renderRowData(bodyCells, _rowData, _rowProps, false)); | ||
this._visibleRows.push(this.renderRowData(bodyCells, _rowData2, _rowProps, false)); | ||
} | ||
@@ -1481,6 +1548,6 @@ } | ||
_proto.renderInfo = function renderInfo() { | ||
var _this$props23 = this.props, | ||
locale = _this$props23.locale, | ||
renderEmpty = _this$props23.renderEmpty, | ||
loading = _this$props23.loading; | ||
var _this$props25 = this.props, | ||
locale = _this$props25.locale, | ||
renderEmpty = _this$props25.renderEmpty, | ||
loading = _this$props25.loading; | ||
@@ -1498,6 +1565,7 @@ if (this._visibleRows.length || loading) { | ||
_proto.renderScrollbar = function renderScrollbar() { | ||
var _this$props24 = this.props, | ||
disabledScroll = _this$props24.disabledScroll, | ||
affixHorizontalScrollbar = _this$props24.affixHorizontalScrollbar, | ||
id = _this$props24.id; | ||
var _this$props26 = this.props, | ||
disabledScroll = _this$props26.disabledScroll, | ||
affixHorizontalScrollbar = _this$props26.affixHorizontalScrollbar, | ||
id = _this$props26.id, | ||
classPrefix = _this$props26.classPrefix; | ||
var _this$state8 = this.state, | ||
@@ -1516,4 +1584,6 @@ contentWidth = _this$state8.contentWidth, | ||
return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Scrollbar, { | ||
return [/*#__PURE__*/React.createElement(Scrollbar, { | ||
key: "scrollbar", | ||
tableId: id, | ||
classPrefix: classPrefix + "-scrollbar", | ||
className: classNames({ | ||
@@ -1531,2 +1601,4 @@ fixed: fixedHorizontalScrollbar | ||
}), /*#__PURE__*/React.createElement(Scrollbar, { | ||
key: "vertical-scrollbar", | ||
classPrefix: classPrefix + "-scrollbar", | ||
vertical: true, | ||
@@ -1538,3 +1610,3 @@ tableId: id, | ||
ref: this.scrollbarYRef | ||
})); | ||
})]; | ||
} | ||
@@ -1547,7 +1619,7 @@ /** | ||
_proto.renderLoading = function renderLoading() { | ||
var _this$props25 = this.props, | ||
locale = _this$props25.locale, | ||
loading = _this$props25.loading, | ||
loadAnimation = _this$props25.loadAnimation, | ||
renderLoading = _this$props25.renderLoading; | ||
var _this$props27 = this.props, | ||
locale = _this$props27.locale, | ||
loading = _this$props27.loading, | ||
loadAnimation = _this$props27.loadAnimation, | ||
renderLoading = _this$props27.renderLoading; | ||
@@ -1573,18 +1645,18 @@ if (!loadAnimation && !loading) { | ||
var _this$props26 = this.props, | ||
children = _this$props26.children, | ||
className = _this$props26.className, | ||
data = _this$props26.data, | ||
_this$props26$width = _this$props26.width, | ||
width = _this$props26$width === void 0 ? 0 : _this$props26$width, | ||
style = _this$props26.style, | ||
isTree = _this$props26.isTree, | ||
hover = _this$props26.hover, | ||
bordered = _this$props26.bordered, | ||
cellBordered = _this$props26.cellBordered, | ||
wordWrap = _this$props26.wordWrap, | ||
classPrefix = _this$props26.classPrefix, | ||
loading = _this$props26.loading, | ||
showHeader = _this$props26.showHeader, | ||
rest = _objectWithoutPropertiesLoose(_this$props26, ["children", "className", "data", "width", "style", "isTree", "hover", "bordered", "cellBordered", "wordWrap", "classPrefix", "loading", "showHeader"]); | ||
var _this$props28 = this.props, | ||
children = _this$props28.children, | ||
classPrefix = _this$props28.classPrefix, | ||
className = _this$props28.className, | ||
data = _this$props28.data, | ||
_this$props28$width = _this$props28.width, | ||
width = _this$props28$width === void 0 ? 0 : _this$props28$width, | ||
style = _this$props28.style, | ||
isTree = _this$props28.isTree, | ||
hover = _this$props28.hover, | ||
bordered = _this$props28.bordered, | ||
cellBordered = _this$props28.cellBordered, | ||
wordWrap = _this$props28.wordWrap, | ||
loading = _this$props28.loading, | ||
showHeader = _this$props28.showHeader, | ||
rest = _objectWithoutPropertiesLoose(_this$props28, ["children", "classPrefix", "className", "data", "width", "style", "isTree", "hover", "bordered", "cellBordered", "wordWrap", "loading", "showHeader"]); | ||
@@ -1607,5 +1679,6 @@ var isColumnResizing = this.state.isColumnResizing; | ||
var unhandled = getUnhandledProps(Table, rest); | ||
var unhandled = getUnhandledProps(propTypes, rest); | ||
return /*#__PURE__*/React.createElement(TableContext.Provider, { | ||
value: { | ||
classPrefix: classPrefix, | ||
translateDOMPositionXY: this.translateDOMPositionXY, | ||
@@ -1632,53 +1705,3 @@ rtl: this.isRTL(), | ||
Table.propTypes = { | ||
autoHeight: PropTypes.bool, | ||
affixHeader: PropTypes.oneOfType([PropTypes.bool, PropTypes.number]), | ||
affixHorizontalScrollbar: PropTypes.oneOfType([PropTypes.bool, PropTypes.number]), | ||
bordered: PropTypes.bool, | ||
bodyRef: PropTypes.func, | ||
className: PropTypes.string, | ||
classPrefix: PropTypes.string, | ||
children: PropTypes.any, | ||
cellBordered: PropTypes.bool, | ||
data: PropTypes.arrayOf(PropTypes.object), | ||
defaultExpandAllRows: PropTypes.bool, | ||
defaultExpandedRowKeys: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])), | ||
defaultSortType: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]), | ||
disabledScroll: PropTypes.bool, | ||
expandedRowKeys: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])), | ||
hover: PropTypes.bool, | ||
height: PropTypes.number, | ||
headerHeight: PropTypes.number, | ||
locale: PropTypes.object, | ||
loading: PropTypes.bool, | ||
loadAnimation: PropTypes.bool, | ||
minHeight: PropTypes.number, | ||
rowKey: PropTypes.oneOfType([PropTypes.string, PropTypes.number]), | ||
rowHeight: PropTypes.oneOfType([PropTypes.number, PropTypes.func]), | ||
renderTreeToggle: PropTypes.func, | ||
renderRowExpanded: PropTypes.func, | ||
rowExpandedHeight: PropTypes.number, | ||
renderEmpty: PropTypes.func, | ||
renderLoading: PropTypes.func, | ||
rowClassName: PropTypes.oneOfType([PropTypes.func, PropTypes.string]), | ||
rtl: PropTypes.bool, | ||
style: PropTypes.object, | ||
sortColumn: PropTypes.string, | ||
sortType: PropTypes.oneOfType([PropTypes.bool, PropTypes.string]), | ||
showHeader: PropTypes.bool, | ||
shouldUpdateScroll: PropTypes.bool, | ||
translate3d: PropTypes.bool, | ||
wordWrap: PropTypes.bool, | ||
width: PropTypes.number, | ||
virtualized: PropTypes.bool, | ||
isTree: PropTypes.bool, | ||
onRowClick: PropTypes.func, | ||
onRowContextMenu: PropTypes.func, | ||
onScroll: PropTypes.func, | ||
onSortColumn: PropTypes.func, | ||
onExpandChange: PropTypes.func, | ||
onTouchStart: PropTypes.func, | ||
onTouchMove: PropTypes.func, | ||
onDataUpdated: PropTypes.func | ||
}; | ||
Table.propTypes = propTypes; | ||
Table.defaultProps = { | ||
@@ -1685,0 +1708,0 @@ classPrefix: defaultClassPrefix('table'), |
@@ -11,6 +11,6 @@ import * as React from 'react'; | ||
if ( /*#__PURE__*/React.isValidElement(column)) { | ||
var _column$props = column.props, | ||
flexGrow = _column$props.flexGrow, | ||
_column$props$width = _column$props.width, | ||
width = _column$props$width === void 0 ? 0 : _column$props$width; | ||
var _ref = column.props, | ||
flexGrow = _ref.flexGrow, | ||
_ref$width = _ref.width, | ||
width = _ref$width === void 0 ? 0 : _ref$width; | ||
totalFlexGrow += flexGrow || 0; | ||
@@ -17,0 +17,0 @@ totalWidth += flexGrow ? 0 : width; |
/** | ||
* Returns an object consisting of props beyond the scope of the Component. | ||
* Useful for getting and spreading unknown props from the user. | ||
* @param {function} Component A function or ReactClass. | ||
* @param {object} propTypes | ||
* @param {object} props A ReactElement props object | ||
* @returns {{}} A shallow copy of the prop object | ||
*/ | ||
var getUnhandledProps = function getUnhandledProps(Component, props) { | ||
var _Component$handledPro = Component.handledProps, | ||
handledProps = _Component$handledPro === void 0 ? [] : _Component$handledPro, | ||
_Component$propTypes = Component.propTypes, | ||
propTypes = _Component$propTypes === void 0 ? {} : _Component$propTypes; | ||
var getUnhandledProps = function getUnhandledProps(propTypes, props) { | ||
var propTypeKeys = Object.keys(propTypes); | ||
@@ -19,6 +15,2 @@ return Object.keys(props).reduce(function (acc, prop) { | ||
if (handledProps.length > 0 && handledProps.indexOf(prop) === -1) { | ||
acc[prop] = props[prop]; | ||
} | ||
if (propTypeKeys.length > 0 && propTypeKeys.indexOf(prop) === -1) { | ||
@@ -25,0 +17,0 @@ acc[prop] = props[prop]; |
@@ -1,2 +0,2 @@ | ||
export * from './prefix'; | ||
export { globalKey, defaultClassPrefix, prefix, getClassNamePrefix } from './prefix'; | ||
export { default as isNullOrUndefined } from './isNullOrUndefined'; | ||
@@ -16,2 +16,3 @@ export { default as getUnhandledProps } from './getUnhandledProps'; | ||
export { default as isNumberOrTrue } from './isNumberOrTrue'; | ||
export * from './requestAnimationTimeout'; | ||
export { default as mergeRefs } from './mergeRefs'; | ||
export { cancelAnimationTimeout, requestAnimationTimeout } from './requestAnimationTimeout'; |
@@ -5,2 +5,3 @@ import * as React from 'react'; | ||
import ColumnGroup from '../ColumnGroup'; | ||
import HeaderCell from '../HeaderCell'; | ||
import isNullOrUndefined from './isNullOrUndefined'; | ||
@@ -37,3 +38,8 @@ | ||
nextCellWidth = _nextCell$props.width, | ||
children = _nextCell$props.children; | ||
sortable = _nextCell$props.sortable, | ||
children = _nextCell$props.children, | ||
dataKey = _nextCell$props.dataKey, | ||
onSortColumn = _nextCell$props.onSortColumn, | ||
sortColumn = _nextCell$props.sortColumn, | ||
sortType = _nextCell$props.sortType; | ||
@@ -48,8 +54,11 @@ if (j !== 0) { | ||
groupChildren.push( /*#__PURE__*/React.createElement("div", { | ||
groupChildren.push( /*#__PURE__*/React.createElement(HeaderCell, { | ||
key: j, | ||
style: { | ||
width: nextCellWidth, | ||
left: left | ||
} | ||
left: left, | ||
dataKey: dataKey, | ||
width: nextCellWidth, | ||
sortable: sortable, | ||
sortColumn: sortColumn, | ||
sortType: sortType, | ||
onSortColumn: onSortColumn | ||
}, children)); | ||
@@ -85,4 +94,4 @@ } | ||
_isHeaderCell = _nextCell$props2.isHeaderCell, | ||
dataKey = _nextCell$props2.dataKey; | ||
var cellText = isFunction(_children) ? _children(rowData, rowIndex) : get(rowData, dataKey); | ||
_dataKey = _nextCell$props2.dataKey; | ||
var cellText = isFunction(_children) ? _children(rowData, rowIndex) : get(rowData, _dataKey); | ||
@@ -100,3 +109,3 @@ if (rowData && isNullOrUndefined(cellText) || _isHeaderCell && isNullOrUndefined(_children)) { | ||
width: _nextWidth, | ||
'aria-colspan': colSpan && _nextWidth > width ? colSpan : undefined | ||
'aria-colspan': _nextWidth > width ? colSpan : undefined | ||
})); | ||
@@ -103,0 +112,0 @@ continue; |
@@ -11,3 +11,8 @@ import curry from 'lodash/curry'; | ||
}; | ||
export var defaultClassPrefix = function defaultClassPrefix(name) { | ||
export var defaultClassPrefix = function defaultClassPrefix(name, tableClassPrefix) { | ||
// 当设置了 table 的 classPrefix,则使用它作为前缀,并删除 name 中的 table | ||
if (tableClassPrefix) { | ||
return tableClassPrefix + "-" + (name === null || name === void 0 ? void 0 : name.replace('table-', '')); | ||
} | ||
return "" + getClassNamePrefix() + name; | ||
@@ -14,0 +19,0 @@ }; |
import * as React from 'react'; | ||
import { StandardProps, RowDataType } from './common'; | ||
import PropTypes from 'prop-types'; | ||
import { StandardProps, RowDataType } from './@types/common'; | ||
export interface CellProps extends StandardProps { | ||
align?: 'left' | 'center' | 'right'; | ||
verticalAlign?: 'top' | 'middle' | 'bottom'; | ||
className?: string; | ||
classPrefix?: string; | ||
dataKey?: string; | ||
isHeaderCell?: boolean; | ||
width?: number; | ||
height?: number | ((rowData: object) => number); | ||
left?: number; | ||
headerHeight?: number; | ||
style?: React.CSSProperties; | ||
firstColumn?: boolean; | ||
lastColumn?: boolean; | ||
hasChildren?: boolean; | ||
children?: React.ReactNode | ((rowData: RowDataType, rowIndex: number) => React.ReactNode); | ||
rowKey?: string | number; | ||
rowIndex?: number; | ||
rowData?: RowDataType; | ||
depth?: number; | ||
onTreeToggle?: ( | ||
rowKey?: string | number, | ||
rowIndex?: number, | ||
rowData?: RowDataType, | ||
event?: React.MouseEvent | ||
) => void; | ||
renderTreeToggle?: ( | ||
expandButton: React.ReactNode, | ||
rowData?: RowDataType, | ||
expanded?: boolean | ||
) => React.ReactNode; | ||
renderCell?: (contentChildren: any) => React.ReactNode; | ||
wordWrap?: boolean; | ||
removed?: boolean; | ||
treeCol?: boolean; | ||
expanded?: boolean; | ||
align?: 'left' | 'center' | 'right'; | ||
verticalAlign?: 'top' | 'middle' | 'bottom'; | ||
className?: string; | ||
classPrefix?: string; | ||
dataKey?: string; | ||
isHeaderCell?: boolean; | ||
width?: number; | ||
height?: number | ((rowData: object) => number); | ||
left?: number; | ||
headerHeight?: number; | ||
style?: React.CSSProperties; | ||
firstColumn?: boolean; | ||
lastColumn?: boolean; | ||
hasChildren?: boolean; | ||
children?: React.ReactNode | ((rowData: RowDataType, rowIndex: number) => React.ReactNode); | ||
rowKey?: string | number; | ||
rowIndex?: number; | ||
rowData?: RowDataType; | ||
depth?: number; | ||
onTreeToggle?: (rowKey?: string | number, rowIndex?: number, rowData?: RowDataType, event?: React.MouseEvent) => void; | ||
renderTreeToggle?: (expandButton: React.ReactNode, rowData?: RowDataType, expanded?: boolean) => React.ReactNode; | ||
renderCell?: (contentChildren: any) => React.ReactNode; | ||
wordWrap?: boolean; | ||
removed?: boolean; | ||
treeCol?: boolean; | ||
expanded?: boolean; | ||
} | ||
declare const Cell: React.ComponentType<CellProps>; | ||
export declare const propTypes: { | ||
align: PropTypes.Requireable<string>; | ||
verticalAlign: PropTypes.Requireable<string>; | ||
className: PropTypes.Requireable<string>; | ||
classPrefix: PropTypes.Requireable<string>; | ||
dataKey: PropTypes.Requireable<string>; | ||
isHeaderCell: PropTypes.Requireable<boolean>; | ||
width: PropTypes.Requireable<number>; | ||
height: PropTypes.Requireable<number | ((...args: any[]) => any)>; | ||
left: PropTypes.Requireable<number>; | ||
headerHeight: PropTypes.Requireable<number>; | ||
style: PropTypes.Requireable<object>; | ||
firstColumn: PropTypes.Requireable<boolean>; | ||
lastColumn: PropTypes.Requireable<boolean>; | ||
hasChildren: PropTypes.Requireable<boolean>; | ||
children: PropTypes.Requireable<any>; | ||
rowKey: PropTypes.Requireable<string | number>; | ||
rowIndex: PropTypes.Requireable<number>; | ||
rowData: PropTypes.Requireable<object>; | ||
depth: PropTypes.Requireable<number>; | ||
onTreeToggle: PropTypes.Requireable<(...args: any[]) => any>; | ||
renderTreeToggle: PropTypes.Requireable<(...args: any[]) => any>; | ||
renderCell: PropTypes.Requireable<(...args: any[]) => any>; | ||
wordWrap: PropTypes.Requireable<boolean>; | ||
removed: PropTypes.Requireable<boolean>; | ||
treeCol: PropTypes.Requireable<boolean>; | ||
expanded: PropTypes.Requireable<boolean>; | ||
groupHeader: PropTypes.Requireable<PropTypes.ReactNodeLike>; | ||
groupCount: PropTypes.Requireable<number>; | ||
}; | ||
declare class Cell extends React.PureComponent<CellProps> { | ||
static contextType: React.Context<import("./TableContext").TableContextProps>; | ||
static propTypes: { | ||
align: PropTypes.Requireable<string>; | ||
verticalAlign: PropTypes.Requireable<string>; | ||
className: PropTypes.Requireable<string>; | ||
classPrefix: PropTypes.Requireable<string>; | ||
dataKey: PropTypes.Requireable<string>; | ||
isHeaderCell: PropTypes.Requireable<boolean>; | ||
width: PropTypes.Requireable<number>; | ||
height: PropTypes.Requireable<number | ((...args: any[]) => any)>; | ||
left: PropTypes.Requireable<number>; | ||
headerHeight: PropTypes.Requireable<number>; | ||
style: PropTypes.Requireable<object>; | ||
firstColumn: PropTypes.Requireable<boolean>; | ||
lastColumn: PropTypes.Requireable<boolean>; | ||
hasChildren: PropTypes.Requireable<boolean>; | ||
children: PropTypes.Requireable<any>; | ||
rowKey: PropTypes.Requireable<string | number>; | ||
rowIndex: PropTypes.Requireable<number>; | ||
rowData: PropTypes.Requireable<object>; | ||
depth: PropTypes.Requireable<number>; | ||
onTreeToggle: PropTypes.Requireable<(...args: any[]) => any>; | ||
renderTreeToggle: PropTypes.Requireable<(...args: any[]) => any>; | ||
renderCell: PropTypes.Requireable<(...args: any[]) => any>; | ||
wordWrap: PropTypes.Requireable<boolean>; | ||
removed: PropTypes.Requireable<boolean>; | ||
treeCol: PropTypes.Requireable<boolean>; | ||
expanded: PropTypes.Requireable<boolean>; | ||
groupHeader: PropTypes.Requireable<PropTypes.ReactNodeLike>; | ||
groupCount: PropTypes.Requireable<number>; | ||
}; | ||
static defaultProps: { | ||
headerHeight: number; | ||
depth: number; | ||
height: number; | ||
width: number; | ||
left: number; | ||
}; | ||
getClassPrefix: () => string; | ||
addPrefix: (name: string) => string; | ||
isTreeCol(): boolean; | ||
getHeight(): number; | ||
handleExpandClick: (event: React.MouseEvent) => void; | ||
renderTreeNodeExpandIcon(): JSX.Element; | ||
render(): JSX.Element; | ||
} | ||
export default Cell; |
@@ -78,4 +78,8 @@ "use strict"; | ||
_this.getClassPrefix = function () { | ||
return _this.props.classPrefix || (0, _utils.defaultClassPrefix)('table-cell', _this.context.classPrefix); | ||
}; | ||
_this.addPrefix = function (name) { | ||
return (0, _utils.prefix)(_this.props.classPrefix)(name); | ||
return (0, _utils.prefix)(_this.getClassPrefix())(name); | ||
}; | ||
@@ -148,3 +152,3 @@ | ||
_proto.render = function render() { | ||
var _classNames, _styles, _extends2; | ||
var _classNames, _extends2, _contentStyles; | ||
@@ -168,3 +172,2 @@ var _this$props6 = this.props, | ||
wordWrap = _this$props6.wordWrap, | ||
classPrefix = _this$props6.classPrefix, | ||
depth = _this$props6.depth, | ||
@@ -174,3 +177,3 @@ verticalAlign = _this$props6.verticalAlign, | ||
onClick = _this$props6.onClick, | ||
rest = (0, _objectWithoutPropertiesLoose2["default"])(_this$props6, ["width", "left", "style", "className", "firstColumn", "lastColumn", "isHeaderCell", "headerHeight", "align", "children", "rowData", "dataKey", "rowIndex", "renderCell", "removed", "wordWrap", "classPrefix", "depth", "verticalAlign", "expanded", "onClick"]); | ||
rest = (0, _objectWithoutPropertiesLoose2["default"])(_this$props6, ["width", "left", "style", "className", "firstColumn", "lastColumn", "isHeaderCell", "headerHeight", "align", "children", "rowData", "dataKey", "rowIndex", "renderCell", "removed", "wordWrap", "depth", "verticalAlign", "expanded", "onClick"]); | ||
@@ -181,15 +184,15 @@ if (removed) { | ||
var classes = (0, _classnames["default"])(classPrefix, className, (_classNames = {}, _classNames[this.addPrefix('expanded')] = expanded && this.isTreeCol(), _classNames[this.addPrefix('first')] = firstColumn, _classNames[this.addPrefix('last')] = lastColumn, _classNames)); | ||
var classes = (0, _classnames["default"])(this.getClassPrefix(), className, (_classNames = {}, _classNames[this.addPrefix('expanded')] = expanded && this.isTreeCol(), _classNames[this.addPrefix('first')] = firstColumn, _classNames[this.addPrefix('last')] = lastColumn, _classNames)); | ||
var rtl = this.context.rtl; | ||
var nextHeight = isHeaderCell ? headerHeight : this.getHeight(); | ||
var styles = (_styles = { | ||
var styles = (0, _extends3["default"])({}, style, (_extends2 = { | ||
width: width, | ||
height: nextHeight, | ||
zIndex: depth | ||
}, _styles[rtl ? 'right' : 'left'] = left, _styles); | ||
var contentStyles = (0, _extends3["default"])((_extends2 = { | ||
}, _extends2[rtl ? 'right' : 'left'] = left, _extends2)); | ||
var contentStyles = (_contentStyles = { | ||
width: width, | ||
height: nextHeight, | ||
textAlign: align | ||
}, _extends2[rtl ? 'paddingRight' : 'paddingLeft'] = this.isTreeCol() ? depth * _constants.LAYER_WIDTH + 10 : null, _extends2), style); | ||
}, _contentStyles[rtl ? 'paddingRight' : 'paddingLeft'] = this.isTreeCol() ? depth * _constants.LAYER_WIDTH + 10 : null, _contentStyles); | ||
@@ -208,3 +211,3 @@ if (verticalAlign) { | ||
var unhandledProps = (0, _utils.getUnhandledProps)(Cell, (0, _utils.getUnhandledProps)(_Column["default"], rest)); | ||
var unhandledProps = (0, _utils.getUnhandledProps)(propTypes, (0, _utils.getUnhandledProps)(_Column["default"].propTypes, rest)); | ||
var cell = renderCell ? renderCell(cellContent) : cellContent; | ||
@@ -232,3 +235,2 @@ var content = wordWrap ? /*#__PURE__*/React.createElement("div", { | ||
Cell.defaultProps = { | ||
classPrefix: (0, _utils.defaultClassPrefix)('table-cell'), | ||
headerHeight: 36, | ||
@@ -235,0 +237,0 @@ depth: 0, |
@@ -0,13 +1,13 @@ | ||
import React from 'react'; | ||
export interface CellGroupProps { | ||
fixed?: 'left' | 'right'; | ||
width?: number; | ||
height?: number; | ||
left?: number; | ||
style?: React.CSSProperties; | ||
className?: string; | ||
classPrefix?: string; | ||
fixed?: 'left' | 'right'; | ||
width?: number; | ||
height?: number; | ||
left?: number; | ||
style?: React.CSSProperties; | ||
className?: string; | ||
classPrefix?: string; | ||
children?: React.ReactNode; | ||
} | ||
declare const CellGroup: React.ComponentType<CellGroupProps>; | ||
declare const CellGroup: React.ForwardRefExoticComponent<CellGroupProps & React.RefAttributes<HTMLDivElement>>; | ||
export default CellGroup; |
@@ -14,6 +14,4 @@ "use strict"; | ||
var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose")); | ||
var _react = _interopRequireWildcard(require("react")); | ||
var React = _interopRequireWildcard(require("react")); | ||
var _propTypes = _interopRequireDefault(require("prop-types")); | ||
@@ -27,55 +25,37 @@ | ||
var CellGroup = /*#__PURE__*/function (_React$PureComponent) { | ||
(0, _inheritsLoose2["default"])(CellGroup, _React$PureComponent); | ||
var CellGroup = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) { | ||
var _classNames; | ||
function CellGroup() { | ||
var _this; | ||
var fixed = props.fixed, | ||
width = props.width, | ||
left = props.left, | ||
height = props.height, | ||
style = props.style, | ||
classPrefix = props.classPrefix, | ||
className = props.className, | ||
children = props.children, | ||
rest = (0, _objectWithoutPropertiesLoose2["default"])(props, ["fixed", "width", "left", "height", "style", "classPrefix", "className", "children"]); | ||
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { | ||
args[_key] = arguments[_key]; | ||
} | ||
var _useContext = (0, _react.useContext)(_TableContext["default"]), | ||
translateDOMPositionXY = _useContext.translateDOMPositionXY, | ||
tableClassPrefix = _useContext.classPrefix; | ||
_this = _React$PureComponent.call.apply(_React$PureComponent, [this].concat(args)) || this; | ||
_this.addPrefix = function (name) { | ||
return (0, _utils.prefix)(_this.props.classPrefix)(name); | ||
}; | ||
return _this; | ||
} | ||
var _proto = CellGroup.prototype; | ||
_proto.render = function render() { | ||
var _classNames; | ||
var _this$props = this.props, | ||
fixed = _this$props.fixed, | ||
width = _this$props.width, | ||
left = _this$props.left, | ||
height = _this$props.height, | ||
style = _this$props.style, | ||
classPrefix = _this$props.classPrefix, | ||
className = _this$props.className, | ||
children = _this$props.children, | ||
rest = (0, _objectWithoutPropertiesLoose2["default"])(_this$props, ["fixed", "width", "left", "height", "style", "classPrefix", "className", "children"]); | ||
var classes = (0, _classnames["default"])(classPrefix, className, (_classNames = {}, _classNames[this.addPrefix("fixed-" + (fixed || ''))] = fixed, _classNames[this.addPrefix('scroll')] = !fixed, _classNames)); | ||
var styles = (0, _extends2["default"])({ | ||
width: width, | ||
height: height | ||
}, style); | ||
var unhandledProps = (0, _utils.getUnhandledProps)(CellGroup, rest); | ||
return /*#__PURE__*/React.createElement(_TableContext["default"].Consumer, null, function (_ref) { | ||
var translateDOMPositionXY = _ref.translateDOMPositionXY; | ||
translateDOMPositionXY === null || translateDOMPositionXY === void 0 ? void 0 : translateDOMPositionXY(styles, left, 0); | ||
return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({}, unhandledProps, { | ||
className: classes, | ||
style: styles | ||
}), children); | ||
}); | ||
var addPrefix = function addPrefix(name) { | ||
return (0, _utils.prefix)(classPrefix || (0, _utils.defaultClassPrefix)('table-cell-group', tableClassPrefix))(name); | ||
}; | ||
return CellGroup; | ||
}(React.PureComponent); | ||
var classes = (0, _classnames["default"])(classPrefix, className, (_classNames = {}, _classNames[addPrefix("fixed-" + (fixed || ''))] = fixed, _classNames[addPrefix('scroll')] = !fixed, _classNames)); | ||
var styles = (0, _extends2["default"])({ | ||
width: width, | ||
height: height | ||
}, style); | ||
translateDOMPositionXY === null || translateDOMPositionXY === void 0 ? void 0 : translateDOMPositionXY(styles, left, 0); | ||
return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({}, rest, { | ||
ref: ref, | ||
className: classes, | ||
style: styles | ||
}), children); | ||
}); | ||
CellGroup.displayName = 'CellGroup'; | ||
CellGroup.propTypes = { | ||
@@ -90,7 +70,3 @@ fixed: _propTypes["default"].oneOf(['left', 'right']), | ||
}; | ||
CellGroup.defaultProps = { | ||
classPrefix: (0, _utils.defaultClassPrefix)('table-cell-group') | ||
}; | ||
var _default = CellGroup; | ||
exports["default"] = _default; | ||
module.exports = exports.default; | ||
exports["default"] = _default; |
@@ -0,17 +1,34 @@ | ||
import PropTypes from 'prop-types'; | ||
export interface ColumnProps { | ||
align?: 'left' | 'center' | 'right'; | ||
verticalAlign?: 'top' | 'middle' | 'bottom'; | ||
width?: number; | ||
fixed?: boolean | 'left' | 'right'; | ||
resizable?: boolean; | ||
sortable?: boolean; | ||
flexGrow?: number; | ||
minWidth?: number; | ||
colSpan?: number; | ||
treeCol?: boolean; | ||
onResize?: (columnWidth?: number, dataKey?: string) => void; | ||
align?: 'left' | 'center' | 'right'; | ||
verticalAlign?: 'top' | 'middle' | 'bottom'; | ||
width?: number; | ||
fixed?: boolean | 'left' | 'right'; | ||
resizable?: boolean; | ||
sortable?: boolean; | ||
flexGrow?: number; | ||
minWidth?: number; | ||
colSpan?: number; | ||
treeCol?: boolean; | ||
onResize?: (columnWidth?: number, dataKey?: string) => void; | ||
} | ||
declare const Column: React.ComponentType<ColumnProps>; | ||
declare function Column(_props: ColumnProps): any; | ||
declare namespace Column { | ||
var defaultProps: { | ||
width: number; | ||
}; | ||
var propTypes: { | ||
align: PropTypes.Requireable<string>; | ||
verticalAlign: PropTypes.Requireable<string>; | ||
width: PropTypes.Requireable<number>; | ||
fixed: PropTypes.Requireable<string | boolean>; | ||
resizable: PropTypes.Requireable<boolean>; | ||
sortable: PropTypes.Requireable<boolean>; | ||
flexGrow: PropTypes.Requireable<number>; | ||
minWidth: PropTypes.Requireable<number>; | ||
colSpan: PropTypes.Requireable<number>; | ||
treeCol: PropTypes.Requireable<boolean>; | ||
onResize: PropTypes.Requireable<(...args: any[]) => any>; | ||
}; | ||
} | ||
export default Column; |
@@ -32,3 +32,2 @@ "use strict"; | ||
var _default = Column; | ||
exports["default"] = _default; | ||
module.exports = exports.default; | ||
exports["default"] = _default; |
@@ -0,15 +1,14 @@ | ||
import React from 'react'; | ||
export interface ColumnGroupProps { | ||
align?: 'left' | 'center' | 'right'; | ||
verticalAlign?: 'top' | 'middle' | 'bottom'; | ||
fixed?: boolean | 'left' | 'right'; | ||
width?: number; | ||
header?: React.ReactNode; | ||
children?: React.ReactNode; | ||
className?: string; | ||
headerHeight?: number; | ||
classPrefix?: string; | ||
align?: 'left' | 'center' | 'right'; | ||
verticalAlign?: 'top' | 'middle' | 'bottom'; | ||
fixed?: boolean | 'left' | 'right'; | ||
width?: number; | ||
header?: React.ReactNode; | ||
children?: React.ReactNode; | ||
className?: string; | ||
headerHeight?: number; | ||
classPrefix?: string; | ||
} | ||
declare const ColumnGroup: React.ComponentType<ColumnGroupProps>; | ||
declare const ColumnGroup: React.ForwardRefExoticComponent<ColumnGroupProps & React.RefAttributes<HTMLDivElement>>; | ||
export default ColumnGroup; |
@@ -14,3 +14,3 @@ "use strict"; | ||
var React = _interopRequireWildcard(require("react")); | ||
var _react = _interopRequireWildcard(require("react")); | ||
@@ -23,3 +23,5 @@ var _classnames = _interopRequireDefault(require("classnames")); | ||
var ColumnGroup = /*#__PURE__*/React.forwardRef(function (props, ref) { | ||
var _TableContext = _interopRequireDefault(require("./TableContext")); | ||
var ColumnGroup = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) { | ||
var header = props.header, | ||
@@ -41,16 +43,23 @@ className = props.className, | ||
}); | ||
var addPrefix = React.useCallback(function (name) { | ||
return (0, _prefix.prefix)(classPrefix)(name); | ||
var _useContext = (0, _react.useContext)(_TableContext["default"]), | ||
tableClassPrefix = _useContext.classPrefix; | ||
var colClassPrefix = classPrefix || (0, _prefix.defaultClassPrefix)('table-column-group', tableClassPrefix); | ||
var addPrefix = _react["default"].useCallback(function (name) { | ||
return (0, _prefix.prefix)(colClassPrefix)(name); | ||
}, []); | ||
return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({ | ||
return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({ | ||
ref: ref, | ||
className: (0, _classnames["default"])(classPrefix, className) | ||
}, rest), /*#__PURE__*/React.createElement("div", { | ||
className: (0, _classnames["default"])(colClassPrefix, className) | ||
}, rest), /*#__PURE__*/_react["default"].createElement("div", { | ||
className: addPrefix('header'), | ||
style: styles | ||
}, /*#__PURE__*/React.createElement("div", { | ||
}, /*#__PURE__*/_react["default"].createElement("div", { | ||
className: addPrefix('header-content'), | ||
style: contentStyles | ||
}, header)), React.Children.map(children, function (node) { | ||
var _node$props, _node$props2, _node$props2$style; | ||
}, header)), _react["default"].Children.map(children, function (node) { | ||
var _node$props; | ||
@@ -62,14 +71,9 @@ var nodeStyles = (0, _extends2["default"])({ | ||
}); | ||
var width = (_node$props2 = node.props) === null || _node$props2 === void 0 ? void 0 : (_node$props2$style = _node$props2.style) === null || _node$props2$style === void 0 ? void 0 : _node$props2$style.width; | ||
var nodeContentStyles = { | ||
height: height, | ||
width: width, | ||
verticalAlign: verticalAlign | ||
}; | ||
return /*#__PURE__*/React.cloneElement(node, { | ||
return /*#__PURE__*/_react["default"].cloneElement(node, { | ||
className: addPrefix('cell'), | ||
style: nodeStyles, | ||
children: /*#__PURE__*/React.createElement("div", { | ||
className: addPrefix('cell-content'), | ||
style: nodeContentStyles | ||
headerHeight: height, | ||
verticalAlign: verticalAlign, | ||
children: /*#__PURE__*/_react["default"].createElement("span", { | ||
className: addPrefix('cell-content') | ||
}, node.props.children) | ||
@@ -79,6 +83,6 @@ }); | ||
}); | ||
ColumnGroup.displayName = 'ColumnGroup'; | ||
ColumnGroup.defaultProps = { | ||
headerHeight: 80, | ||
classPrefix: (0, _prefix.defaultClassPrefix)('table-column-group') | ||
headerHeight: 80 | ||
}; | ||
@@ -91,3 +95,2 @@ ColumnGroup.propTypes = { | ||
var _default = ColumnGroup; | ||
exports["default"] = _default; | ||
module.exports = exports.default; | ||
exports["default"] = _default; |
import * as React from 'react'; | ||
export type FixedType = boolean | 'left' | 'right'; | ||
import PropTypes from 'prop-types'; | ||
export declare type FixedType = boolean | 'left' | 'right'; | ||
export interface Client { | ||
clientX?: number; | ||
clientY?: number; | ||
preventDefault?: Function; | ||
clientX?: number; | ||
clientY?: number; | ||
preventDefault?: Function; | ||
} | ||
export interface ColumnResizeHandlerProps { | ||
height?: number; | ||
defaultColumnWidth?: number; | ||
columnLeft?: number; | ||
columnFixed?: FixedType; | ||
className?: string; | ||
classPrefix?: string; | ||
minWidth?: number; | ||
style?: React.CSSProperties; | ||
onColumnResizeStart?: (client: Client) => void; | ||
onColumnResizeEnd?: (columnWidth?: number, cursorDelta?: number) => void; | ||
onColumnResizeMove?: (columnWidth?: number, columnLeft?: number, columnFixed?: FixedType) => void; | ||
height?: number; | ||
defaultColumnWidth?: number; | ||
columnLeft?: number; | ||
columnFixed?: FixedType; | ||
className?: string; | ||
classPrefix?: string; | ||
minWidth?: number; | ||
style?: React.CSSProperties; | ||
onColumnResizeStart?: (client: Client) => void; | ||
onColumnResizeEnd?: (columnWidth?: number, cursorDelta?: number) => void; | ||
onColumnResizeMove?: (columnWidth?: number, columnLeft?: number, columnFixed?: FixedType) => void; | ||
} | ||
declare const ColumnResizeHandler: React.ComponentType<ColumnResizeHandlerProps>; | ||
declare class ColumnResizeHandler extends React.Component<ColumnResizeHandlerProps> { | ||
static contextType: React.Context<import("./TableContext").TableContextProps>; | ||
static propTypes: { | ||
height: PropTypes.Requireable<number>; | ||
defaultColumnWidth: PropTypes.Requireable<number>; | ||
columnLeft: PropTypes.Requireable<number>; | ||
columnFixed: PropTypes.Requireable<string | boolean>; | ||
className: PropTypes.Requireable<string>; | ||
classPrefix: PropTypes.Requireable<string>; | ||
minWidth: PropTypes.Requireable<number>; | ||
style: PropTypes.Requireable<object>; | ||
onColumnResizeStart: PropTypes.Requireable<(...args: any[]) => any>; | ||
onColumnResizeEnd: PropTypes.Requireable<(...args: any[]) => any>; | ||
onColumnResizeMove: PropTypes.Requireable<(...args: any[]) => any>; | ||
}; | ||
columnWidth: number; | ||
cursorDelta: number; | ||
mouseMoveTracker: any; | ||
isKeyDown: boolean; | ||
constructor(props: any); | ||
componentWillUnmount(): void; | ||
onMove: (deltaX: number) => void; | ||
onColumnResizeEnd: () => void; | ||
onColumnResizeMouseDown: (event: React.MouseEvent) => void; | ||
getMouseMoveTracker(): any; | ||
render(): JSX.Element; | ||
} | ||
export default ColumnResizeHandler; |
@@ -32,2 +32,16 @@ "use strict"; | ||
var propTypes = { | ||
height: _propTypes["default"].number, | ||
defaultColumnWidth: _propTypes["default"].number, | ||
columnLeft: _propTypes["default"].number, | ||
columnFixed: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].oneOf(['left', 'right'])]), | ||
className: _propTypes["default"].string, | ||
classPrefix: _propTypes["default"].string, | ||
minWidth: _propTypes["default"].number, | ||
style: _propTypes["default"].object, | ||
onColumnResizeStart: _propTypes["default"].func, | ||
onColumnResizeEnd: _propTypes["default"].func, | ||
onColumnResizeMove: _propTypes["default"].func | ||
}; | ||
var ColumnResizeHandler = /*#__PURE__*/function (_React$Component) { | ||
@@ -123,4 +137,4 @@ (0, _inheritsLoose2["default"])(ColumnResizeHandler, _React$Component); | ||
var styles = (0, _extends3["default"])((_extends2 = {}, _extends2[rtl ? 'right' : 'left'] = this.columnWidth + columnLeft - 2, _extends2.height = height, _extends2), style); | ||
var classes = (0, _classnames["default"])(classPrefix, className); | ||
var unhandled = (0, _utils.getUnhandledProps)(ColumnResizeHandler, rest); | ||
var classes = (0, _classnames["default"])(classPrefix || (0, _utils.defaultClassPrefix)('table-column-resize-spanner', this.context.classPrefix), className); | ||
var unhandled = (0, _utils.getUnhandledProps)(propTypes, rest); | ||
return /*#__PURE__*/React.createElement("div", (0, _extends3["default"])({}, unhandled, { | ||
@@ -139,20 +153,4 @@ className: classes, | ||
ColumnResizeHandler.contextType = _TableContext["default"]; | ||
ColumnResizeHandler.propTypes = { | ||
height: _propTypes["default"].number, | ||
defaultColumnWidth: _propTypes["default"].number, | ||
columnLeft: _propTypes["default"].number, | ||
columnFixed: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].oneOf(['left', 'right'])]), | ||
className: _propTypes["default"].string, | ||
classPrefix: _propTypes["default"].string, | ||
minWidth: _propTypes["default"].number, | ||
style: _propTypes["default"].object, | ||
onColumnResizeStart: _propTypes["default"].func, | ||
onColumnResizeEnd: _propTypes["default"].func, | ||
onColumnResizeMove: _propTypes["default"].func | ||
}; | ||
ColumnResizeHandler.defaultProps = { | ||
classPrefix: (0, _utils.defaultClassPrefix)('table-column-resize-spanner') | ||
}; | ||
ColumnResizeHandler.propTypes = propTypes; | ||
var _default = ColumnResizeHandler; | ||
exports["default"] = _default; | ||
module.exports = exports.default; | ||
exports["default"] = _default; |
@@ -1,27 +0,58 @@ | ||
import { CellProps } from './Cell.d'; | ||
import * as React from 'react'; | ||
import PropTypes from 'prop-types'; | ||
import { CellProps } from './Cell'; | ||
export interface HeaderCellProps extends CellProps { | ||
index?: number; | ||
minWidth?: number; | ||
sortColumn?: string; | ||
sortType?: 'desc' | 'asc'; | ||
sortable?: boolean; | ||
resizable?: boolean; | ||
onColumnResizeStart?: (columnWidth?: number, left?: number, fixed?: boolean) => void; | ||
onColumnResizeEnd?: ( | ||
columnWidth?: number, | ||
cursorDelta?: number, | ||
dataKey?: any, | ||
index?: number | ||
) => void; | ||
onResize?: (columnWidth?: number, dataKey?: string) => void; | ||
onColumnResizeMove?: (columnWidth?: number, columnLeft?: number, columnFixed?: boolean) => void; | ||
onSortColumn?: (dataKey?: string) => void; | ||
flexGrow?: number; | ||
fixed?: boolean | 'left' | 'right'; | ||
children: React.ReactNode; | ||
index?: number; | ||
minWidth?: number; | ||
sortColumn?: string; | ||
sortType?: 'desc' | 'asc'; | ||
sortable?: boolean; | ||
resizable?: boolean; | ||
onColumnResizeStart?: (columnWidth?: number, left?: number, fixed?: boolean) => void; | ||
onColumnResizeEnd?: (columnWidth?: number, cursorDelta?: number, dataKey?: any, index?: number) => void; | ||
onResize?: (columnWidth?: number, dataKey?: string) => void; | ||
onColumnResizeMove?: (columnWidth?: number, columnLeft?: number, columnFixed?: boolean) => void; | ||
onSortColumn?: (dataKey?: string) => void; | ||
flexGrow?: number; | ||
fixed?: boolean | 'left' | 'right'; | ||
children: React.ReactNode; | ||
} | ||
declare const HeaderCell: React.ComponentType<HeaderCellProps>; | ||
interface HeaderCelltate { | ||
columnWidth?: number; | ||
width?: number; | ||
flexGrow?: number; | ||
} | ||
declare class HeaderCell extends React.PureComponent<HeaderCellProps, HeaderCelltate> { | ||
static propTypes: { | ||
index: PropTypes.Requireable<number>; | ||
sortColumn: PropTypes.Requireable<string>; | ||
sortType: PropTypes.Requireable<string>; | ||
sortable: PropTypes.Requireable<boolean>; | ||
resizable: PropTypes.Requireable<boolean>; | ||
minWidth: PropTypes.Requireable<number>; | ||
onColumnResizeStart: PropTypes.Requireable<(...args: any[]) => any>; | ||
onColumnResizeEnd: PropTypes.Requireable<(...args: any[]) => any>; | ||
onResize: PropTypes.Requireable<(...args: any[]) => any>; | ||
onColumnResizeMove: PropTypes.Requireable<(...args: any[]) => any>; | ||
onSortColumn: PropTypes.Requireable<(...args: any[]) => any>; | ||
flexGrow: PropTypes.Requireable<number>; | ||
fixed: PropTypes.Requireable<string | boolean>; | ||
children: PropTypes.Requireable<PropTypes.ReactNodeLike>; | ||
}; | ||
static contextType: React.Context<import("./TableContext").TableContextProps>; | ||
static getDerivedStateFromProps(nextProps: HeaderCellProps, prevState: HeaderCelltate): { | ||
width: number; | ||
flexGrow: number; | ||
columnWidth: number; | ||
}; | ||
constructor(props: HeaderCellProps); | ||
handleColumnResizeStart: () => void; | ||
handleColumnResizeEnd: (columnWidth?: number, cursorDelta?: number) => void; | ||
handleClick: () => void; | ||
getClassPrefix: () => string; | ||
addPrefix: (name: string) => string; | ||
renderResizeSpanner(): JSX.Element; | ||
renderSortColumn(): React.ReactNode; | ||
render(): JSX.Element; | ||
} | ||
export default HeaderCell; |
@@ -28,2 +28,4 @@ "use strict"; | ||
var _TableContext = _interopRequireDefault(require("./TableContext")); | ||
var _ColumnResizeHandler = _interopRequireDefault(require("./ColumnResizeHandler")); | ||
@@ -39,2 +41,18 @@ | ||
}; | ||
var propTypes = { | ||
index: _propTypes["default"].number, | ||
sortColumn: _propTypes["default"].string, | ||
sortType: _propTypes["default"].oneOf(['desc', 'asc']), | ||
sortable: _propTypes["default"].bool, | ||
resizable: _propTypes["default"].bool, | ||
minWidth: _propTypes["default"].number, | ||
onColumnResizeStart: _propTypes["default"].func, | ||
onColumnResizeEnd: _propTypes["default"].func, | ||
onResize: _propTypes["default"].func, | ||
onColumnResizeMove: _propTypes["default"].func, | ||
onSortColumn: _propTypes["default"].func, | ||
flexGrow: _propTypes["default"].number, | ||
fixed: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].oneOf(['left', 'right'])]), | ||
children: _propTypes["default"].node | ||
}; | ||
@@ -92,4 +110,8 @@ var HeaderCell = /*#__PURE__*/function (_React$PureComponent) { | ||
_this.getClassPrefix = function () { | ||
return _this.props.classPrefix || (0, _utils.defaultClassPrefix)('table-cell-header', _this.context.classPrefix); | ||
}; | ||
_this.addPrefix = function (name) { | ||
return (0, _utils.prefix)(_this.props.classPrefix)(name); | ||
return (0, _utils.prefix)(_this.getClassPrefix())(name); | ||
}; | ||
@@ -140,5 +162,6 @@ | ||
sortType = _this$props5$sortType === void 0 ? '' : _this$props5$sortType, | ||
dataKey = _this$props5.dataKey; | ||
dataKey = _this$props5.dataKey, | ||
groupHeader = _this$props5.groupHeader; | ||
if (sortable) { | ||
if (sortable && !groupHeader) { | ||
var _classNames; | ||
@@ -169,8 +192,8 @@ | ||
sortable = _this$props6.sortable, | ||
classPrefix = _this$props6.classPrefix, | ||
sortColumn = _this$props6.sortColumn, | ||
sortType = _this$props6.sortType, | ||
rest = (0, _objectWithoutPropertiesLoose2["default"])(_this$props6, ["className", "width", "dataKey", "headerHeight", "children", "left", "sortable", "classPrefix", "sortColumn", "sortType"]); | ||
var classes = (0, _classnames["default"])(classPrefix, className, (_classNames2 = {}, _classNames2[this.addPrefix('sortable')] = sortable, _classNames2)); | ||
var unhandledProps = (0, _utils.getUnhandledProps)(HeaderCell, rest); | ||
groupHeader = _this$props6.groupHeader, | ||
rest = (0, _objectWithoutPropertiesLoose2["default"])(_this$props6, ["className", "width", "dataKey", "headerHeight", "children", "left", "sortable", "sortColumn", "sortType", "groupHeader"]); | ||
var classes = (0, _classnames["default"])(this.getClassPrefix(), className, (_classNames2 = {}, _classNames2[this.addPrefix('sortable')] = sortable, _classNames2)); | ||
var unhandledProps = (0, _utils.getUnhandledProps)(propTypes, rest); | ||
var ariaSort; | ||
@@ -198,3 +221,3 @@ | ||
isHeaderCell: true, | ||
onClick: this.handleClick | ||
onClick: !groupHeader ? this.handleClick : null | ||
}), children, this.renderSortColumn()), this.renderResizeSpanner()); | ||
@@ -206,23 +229,5 @@ }; | ||
HeaderCell.propTypes = { | ||
index: _propTypes["default"].number, | ||
sortColumn: _propTypes["default"].string, | ||
sortType: _propTypes["default"].oneOf(['desc', 'asc']), | ||
sortable: _propTypes["default"].bool, | ||
resizable: _propTypes["default"].bool, | ||
minWidth: _propTypes["default"].number, | ||
onColumnResizeStart: _propTypes["default"].func, | ||
onColumnResizeEnd: _propTypes["default"].func, | ||
onResize: _propTypes["default"].func, | ||
onColumnResizeMove: _propTypes["default"].func, | ||
onSortColumn: _propTypes["default"].func, | ||
flexGrow: _propTypes["default"].number, | ||
fixed: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].oneOf(['left', 'right'])]), | ||
children: _propTypes["default"].node | ||
}; | ||
HeaderCell.defaultProps = { | ||
classPrefix: (0, _utils.defaultClassPrefix)('table-cell-header') | ||
}; | ||
HeaderCell.propTypes = propTypes; | ||
HeaderCell.contextType = _TableContext["default"]; | ||
var _default = HeaderCell; | ||
exports["default"] = _default; | ||
module.exports = exports.default; | ||
exports["default"] = _default; |
@@ -1,18 +0,15 @@ | ||
import * as React from 'react'; | ||
import { StandardProps } from './common'; | ||
import React from 'react'; | ||
import { StandardProps } from './@types/common'; | ||
export interface RowProps extends StandardProps { | ||
width?: number; | ||
height?: number; | ||
headerHeight?: number; | ||
top?: number; | ||
isHeaderRow?: boolean; | ||
rowRef?: React.Ref<any>; | ||
className?: string; | ||
classPrefix?: string; | ||
style?: React.CSSProperties; | ||
width?: number; | ||
height?: number; | ||
headerHeight?: number; | ||
top?: number; | ||
isHeaderRow?: boolean; | ||
rowRef?: React.Ref<any>; | ||
className?: string; | ||
classPrefix?: string; | ||
style?: React.CSSProperties; | ||
} | ||
declare const Row: React.ComponentType<RowProps>; | ||
declare const Row: React.ForwardRefExoticComponent<Pick<RowProps, string | number> & React.RefAttributes<HTMLDivElement>>; | ||
export default Row; |
@@ -14,6 +14,4 @@ "use strict"; | ||
var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose")); | ||
var _react = _interopRequireWildcard(require("react")); | ||
var React = _interopRequireWildcard(require("react")); | ||
var _propTypes = _interopRequireDefault(require("prop-types")); | ||
@@ -27,49 +25,42 @@ | ||
var Row = /*#__PURE__*/function (_React$PureComponent) { | ||
(0, _inheritsLoose2["default"])(Row, _React$PureComponent); | ||
var Row = /*#__PURE__*/_react["default"].forwardRef(function (props, ref) { | ||
var _classNames; | ||
function Row() { | ||
return _React$PureComponent.apply(this, arguments) || this; | ||
} | ||
var className = props.className, | ||
width = props.width, | ||
height = props.height, | ||
top = props.top, | ||
style = props.style, | ||
isHeaderRow = props.isHeaderRow, | ||
headerHeight = props.headerHeight, | ||
rowRef = props.rowRef, | ||
classPrefix = props.classPrefix, | ||
children = props.children, | ||
rest = (0, _objectWithoutPropertiesLoose2["default"])(props, ["className", "width", "height", "top", "style", "isHeaderRow", "headerHeight", "rowRef", "classPrefix", "children"]); | ||
var addPrefix = (0, _utils.prefix)(classPrefix); | ||
var classes = (0, _classnames["default"])(classPrefix, className, (_classNames = {}, _classNames[addPrefix('header')] = isHeaderRow, _classNames)); | ||
var _proto = Row.prototype; | ||
var _useContext = (0, _react.useContext)(_TableContext["default"]), | ||
translateDOMPositionXY = _useContext.translateDOMPositionXY; | ||
_proto.render = function render() { | ||
var _classNames; | ||
var styles = (0, _extends2["default"])({ | ||
minWidth: width, | ||
height: isHeaderRow ? headerHeight : height | ||
}, style); | ||
translateDOMPositionXY === null || translateDOMPositionXY === void 0 ? void 0 : translateDOMPositionXY(styles, 0, top); | ||
return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({ | ||
role: "row" | ||
}, rest, { | ||
ref: (0, _utils.mergeRefs)(rowRef, ref), | ||
className: classes, | ||
style: styles | ||
}), children); | ||
}); | ||
var _this$props = this.props, | ||
className = _this$props.className, | ||
width = _this$props.width, | ||
height = _this$props.height, | ||
top = _this$props.top, | ||
style = _this$props.style, | ||
isHeaderRow = _this$props.isHeaderRow, | ||
headerHeight = _this$props.headerHeight, | ||
rowRef = _this$props.rowRef, | ||
classPrefix = _this$props.classPrefix, | ||
children = _this$props.children, | ||
rest = (0, _objectWithoutPropertiesLoose2["default"])(_this$props, ["className", "width", "height", "top", "style", "isHeaderRow", "headerHeight", "rowRef", "classPrefix", "children"]); | ||
var addPrefix = (0, _utils.prefix)(classPrefix); | ||
var classes = (0, _classnames["default"])(classPrefix, className, (_classNames = {}, _classNames[addPrefix('header')] = isHeaderRow, _classNames)); | ||
var styles = (0, _extends2["default"])({ | ||
minWidth: width, | ||
height: isHeaderRow ? headerHeight : height | ||
}, style); | ||
var unhandledProps = (0, _utils.getUnhandledProps)(Row, rest); | ||
return /*#__PURE__*/React.createElement(_TableContext["default"].Consumer, null, function (_ref) { | ||
var translateDOMPositionXY = _ref.translateDOMPositionXY; | ||
translateDOMPositionXY === null || translateDOMPositionXY === void 0 ? void 0 : translateDOMPositionXY(styles, 0, top); | ||
return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({ | ||
role: "row" | ||
}, unhandledProps, { | ||
ref: rowRef, | ||
className: classes, | ||
style: styles | ||
}), children); | ||
}); | ||
}; | ||
return Row; | ||
}(React.PureComponent); | ||
Row.displayName = 'Row'; | ||
Row.defaultProps = { | ||
classPrefix: (0, _utils.defaultClassPrefix)('table-row'), | ||
height: 46, | ||
headerHeight: 40 | ||
}; | ||
Row.propTypes = { | ||
@@ -86,9 +77,3 @@ width: _propTypes["default"].number, | ||
}; | ||
Row.defaultProps = { | ||
classPrefix: (0, _utils.defaultClassPrefix)('table-row'), | ||
height: 46, | ||
headerHeight: 40 | ||
}; | ||
var _default = Row; | ||
exports["default"] = _default; | ||
module.exports = exports.default; | ||
exports["default"] = _default; |
import * as React from 'react'; | ||
import PropTypes from 'prop-types'; | ||
export interface ScrollbarProps { | ||
vertical?: boolean; | ||
length: number; | ||
scrollLength: number; | ||
className?: string; | ||
classPrefix?: string; | ||
tableId?: string; | ||
onScroll?: (delta: number, event: React.MouseEvent) => void; | ||
onMouseDown?: (event: React.MouseEvent) => void; | ||
[key: string]: any; | ||
vertical?: boolean; | ||
length: number; | ||
scrollLength: number; | ||
className?: string; | ||
classPrefix?: string; | ||
tableId?: string; | ||
onScroll?: (delta: number, event: React.MouseEvent) => void; | ||
onMouseDown?: (event: React.MouseEvent) => void; | ||
[key: string]: any; | ||
} | ||
declare const Scrollbar: React.ComponentType<ScrollbarProps>; | ||
declare type Offset = { | ||
top: number; | ||
left: number; | ||
height?: number; | ||
width?: number; | ||
}; | ||
declare type State = { | ||
barOffset: Offset; | ||
handlePressed: boolean; | ||
}; | ||
declare class Scrollbar extends React.PureComponent<ScrollbarProps, State> { | ||
static contextType: React.Context<import("./TableContext").TableContextProps>; | ||
static propTypes: { | ||
tableId: PropTypes.Requireable<string>; | ||
vertical: PropTypes.Requireable<boolean>; | ||
length: PropTypes.Requireable<number>; | ||
scrollLength: PropTypes.Requireable<number>; | ||
className: PropTypes.Requireable<string>; | ||
classPrefix: PropTypes.Requireable<string>; | ||
onScroll: PropTypes.Requireable<(...args: any[]) => any>; | ||
onMouseDown: PropTypes.Requireable<(...args: any[]) => any>; | ||
}; | ||
static defaultProps: { | ||
classPrefix: string; | ||
scrollLength: number; | ||
length: number; | ||
}; | ||
scrollOffset: number; | ||
mouseMoveTracker: any; | ||
handleRef: React.RefObject<HTMLDivElement>; | ||
barRef: React.RefObject<HTMLDivElement>; | ||
constructor(props: ScrollbarProps); | ||
componentDidMount(): void; | ||
componentWillUnmount(): void; | ||
onWheelScroll(delta: number): void; | ||
getMouseMoveTracker(): any; | ||
initBarOffset(): void; | ||
handleMouseDown: (event: React.MouseEvent) => void; | ||
handleDragEnd: () => void; | ||
handleScroll(delta: number, event: React.MouseEvent): void; | ||
resetScrollBarPosition(forceDelta?: number): void; | ||
updateScrollBarPosition(delta: number, forceDelta?: number): void; | ||
releaseMouseMoves(): void; | ||
handleDragMove: (deltaX: number, deltaY: number, event: React.MouseEvent) => void; | ||
/** | ||
* 点击滚动条,然后滚动到指定位置 | ||
*/ | ||
handleClick: (event: React.MouseEvent) => void; | ||
render(): JSX.Element; | ||
} | ||
export default Scrollbar; |
@@ -30,2 +30,13 @@ "use strict"; | ||
var propTypes = { | ||
tableId: _propTypes["default"].string, | ||
vertical: _propTypes["default"].bool, | ||
length: _propTypes["default"].number, | ||
scrollLength: _propTypes["default"].number, | ||
className: _propTypes["default"].string, | ||
classPrefix: _propTypes["default"].string, | ||
onScroll: _propTypes["default"].func, | ||
onMouseDown: _propTypes["default"].func | ||
}; | ||
var Scrollbar = /*#__PURE__*/function (_React$PureComponent) { | ||
@@ -215,3 +226,3 @@ (0, _inheritsLoose2["default"])(Scrollbar, _React$PureComponent); | ||
var styles = (_styles = {}, _styles[vertical ? 'height' : 'width'] = width + "%", _styles[vertical ? 'minHeight' : 'minWidth'] = _constants.SCROLLBAR_MIN_WIDTH, _styles); | ||
var unhandled = (0, _utils.getUnhandledProps)(Scrollbar, rest); | ||
var unhandled = (0, _utils.getUnhandledProps)(propTypes, rest); | ||
var valuenow = this.scrollOffset / length * 100 + width; | ||
@@ -243,12 +254,3 @@ return /*#__PURE__*/React.createElement("div", (0, _extends2["default"])({ | ||
Scrollbar.contextType = _TableContext["default"]; | ||
Scrollbar.propTypes = { | ||
tableId: _propTypes["default"].string, | ||
vertical: _propTypes["default"].bool, | ||
length: _propTypes["default"].number, | ||
scrollLength: _propTypes["default"].number, | ||
className: _propTypes["default"].string, | ||
classPrefix: _propTypes["default"].string, | ||
onScroll: _propTypes["default"].func, | ||
onMouseDown: _propTypes["default"].func | ||
}; | ||
Scrollbar.propTypes = propTypes; | ||
Scrollbar.defaultProps = { | ||
@@ -260,3 +262,2 @@ classPrefix: (0, _utils.defaultClassPrefix)('table-scrollbar'), | ||
var _default = Scrollbar; | ||
exports["default"] = _default; | ||
module.exports = exports.default; | ||
exports["default"] = _default; |
import * as React from 'react'; | ||
import { StandardProps, SortType, RowDataType } from './common'; | ||
import PropTypes from 'prop-types'; | ||
import { RowProps } from './Row'; | ||
import { StandardProps, SortType, RowDataType } from './@types/common'; | ||
export interface TableLocale { | ||
emptyMessage?: string; | ||
loading?: string; | ||
emptyMessage?: string; | ||
loading?: string; | ||
} | ||
export interface TableProps extends StandardProps { | ||
autoHeight?: boolean; | ||
affixHeader?: boolean | number; | ||
affixHorizontalScrollbar?: boolean | number; | ||
bodyRef?: (ref: HTMLElement) => void; | ||
bordered?: boolean; | ||
className?: string; | ||
classPrefix?: string; | ||
children: React.ReactNode; | ||
cellBordered?: boolean; | ||
defaultSortType?: SortType; | ||
disabledScroll?: boolean; | ||
defaultExpandAllRows?: boolean; | ||
defaultExpandedRowKeys?: string[] | number[]; | ||
data: object[]; | ||
expandedRowKeys?: string[] | number[]; | ||
height: number; | ||
hover: boolean; | ||
headerHeight: number; | ||
locale: TableLocale; | ||
loading?: boolean; | ||
loadAnimation?: boolean; | ||
minHeight: number; | ||
rowHeight: number | ((rowData: object) => number); | ||
rowKey: string | number; | ||
isTree?: boolean; | ||
rowExpandedHeight?: number; | ||
rowClassName?: string | ((rowData: object) => string); | ||
showHeader?: boolean; | ||
style?: React.CSSProperties; | ||
sortColumn?: string; | ||
sortType?: SortType; | ||
shouldUpdateScroll?: boolean; | ||
translate3d?: boolean; | ||
rtl?: boolean; | ||
width?: number; | ||
wordWrap?: boolean; | ||
virtualized?: boolean; | ||
renderTreeToggle?: ( | ||
expandButton: React.ReactNode, | ||
rowData?: RowDataType, | ||
expanded?: boolean | ||
) => React.ReactNode; | ||
renderRowExpanded?: (rowDate?: object) => React.ReactNode; | ||
renderEmpty?: (info: React.ReactNode) => React.ReactNode; | ||
renderLoading?: (loading: React.ReactNode) => React.ReactNode; | ||
onRowClick?: (rowData: object, event: React.MouseEvent) => void; | ||
onRowContextMenu?: (rowData: object, event: React.MouseEvent) => void; | ||
onScroll?: (scrollX: number, scrollY: number) => void; | ||
onSortColumn?: (dataKey: string, sortType?: SortType) => void; | ||
onExpandChange?: (expanded: boolean, rowData: object) => void; | ||
onTouchStart?: (event: React.TouchEvent) => void; // for tests | ||
onTouchMove?: (event: React.TouchEvent) => void; // for tests | ||
onDataUpdated?: (nextData: object[], scrollTo: (coord: { x: number; y: number }) => void) => void; | ||
autoHeight?: boolean; | ||
affixHeader?: boolean | number; | ||
affixHorizontalScrollbar?: boolean | number; | ||
bodyRef?: (ref: HTMLElement) => void; | ||
bordered?: boolean; | ||
className?: string; | ||
classPrefix?: string; | ||
children: React.ReactNode; | ||
cellBordered?: boolean; | ||
defaultSortType?: SortType; | ||
disabledScroll?: boolean; | ||
defaultExpandAllRows?: boolean; | ||
defaultExpandedRowKeys?: string[] | number[]; | ||
data: object[]; | ||
expandedRowKeys?: string[] | number[]; | ||
height: number; | ||
hover: boolean; | ||
headerHeight: number; | ||
locale: TableLocale; | ||
loading?: boolean; | ||
loadAnimation?: boolean; | ||
minHeight: number; | ||
rowHeight: number | ((rowData: object) => number); | ||
rowKey: string | number; | ||
isTree?: boolean; | ||
rowExpandedHeight?: number; | ||
rowClassName?: string | ((rowData: object) => string); | ||
showHeader?: boolean; | ||
style?: React.CSSProperties; | ||
sortColumn?: string; | ||
sortType?: SortType; | ||
shouldUpdateScroll?: boolean; | ||
translate3d?: boolean; | ||
rtl?: boolean; | ||
width?: number; | ||
wordWrap?: boolean; | ||
virtualized?: boolean; | ||
renderTreeToggle?: (expandButton: React.ReactNode, rowData?: RowDataType, expanded?: boolean) => React.ReactNode; | ||
renderRowExpanded?: (rowDate?: object) => React.ReactNode; | ||
renderEmpty?: (info: React.ReactNode) => React.ReactNode; | ||
renderLoading?: (loading: React.ReactNode) => React.ReactNode; | ||
onRowClick?: (rowData: object, event: React.MouseEvent) => void; | ||
onRowContextMenu?: (rowData: object, event: React.MouseEvent) => void; | ||
onScroll?: (scrollX: number, scrollY: number) => void; | ||
onSortColumn?: (dataKey: string, sortType?: SortType) => void; | ||
onExpandChange?: (expanded: boolean, rowData: object) => void; | ||
onTouchStart?: (event: React.TouchEvent) => void; | ||
onTouchMove?: (event: React.TouchEvent) => void; | ||
onDataUpdated?: (nextData: object[], scrollTo: (coord: { | ||
x: number; | ||
y: number; | ||
}) => void) => void; | ||
} | ||
declare const Table: React.ComponentType<TableProps>; | ||
interface TableRowProps extends RowProps { | ||
key?: string | number; | ||
depth?: number; | ||
} | ||
declare type Offset = { | ||
top?: number; | ||
left?: number; | ||
width?: number; | ||
height?: number; | ||
}; | ||
interface TableState { | ||
headerOffset?: Offset; | ||
tableOffset?: Offset; | ||
width: number; | ||
columnWidth: number; | ||
dataKey: number; | ||
shouldFixedColumn: boolean; | ||
contentHeight: number; | ||
contentWidth: number; | ||
tableRowsMaxHeight: number[]; | ||
isColumnResizing?: boolean; | ||
expandedRowKeys: string[] | number[]; | ||
sortType?: SortType; | ||
scrollY: number; | ||
isScrolling?: boolean; | ||
data: object[]; | ||
cacheData: object[]; | ||
fixedHeader: boolean; | ||
fixedHorizontalScrollbar?: boolean; | ||
isTree?: boolean; | ||
[key: string]: any; | ||
} | ||
declare class Table extends React.Component<TableProps, TableState> { | ||
static propTypes: { | ||
autoHeight: PropTypes.Requireable<boolean>; | ||
affixHeader: PropTypes.Requireable<number | boolean>; | ||
affixHorizontalScrollbar: PropTypes.Requireable<number | boolean>; | ||
bordered: PropTypes.Requireable<boolean>; | ||
bodyRef: PropTypes.Requireable<(...args: any[]) => any>; | ||
className: PropTypes.Requireable<string>; | ||
classPrefix: PropTypes.Requireable<string>; | ||
children: PropTypes.Requireable<any>; | ||
cellBordered: PropTypes.Requireable<boolean>; | ||
data: PropTypes.Requireable<object[]>; | ||
defaultExpandAllRows: PropTypes.Requireable<boolean>; | ||
defaultExpandedRowKeys: PropTypes.Requireable<(string | number)[]>; | ||
defaultSortType: PropTypes.Requireable<string | boolean>; | ||
disabledScroll: PropTypes.Requireable<boolean>; | ||
expandedRowKeys: PropTypes.Requireable<(string | number)[]>; | ||
hover: PropTypes.Requireable<boolean>; | ||
height: PropTypes.Requireable<number>; | ||
headerHeight: PropTypes.Requireable<number>; | ||
locale: PropTypes.Requireable<object>; | ||
loading: PropTypes.Requireable<boolean>; | ||
loadAnimation: PropTypes.Requireable<boolean>; | ||
minHeight: PropTypes.Requireable<number>; | ||
rowKey: PropTypes.Requireable<string | number>; | ||
rowHeight: PropTypes.Requireable<number | ((...args: any[]) => any)>; | ||
renderTreeToggle: PropTypes.Requireable<(...args: any[]) => any>; | ||
renderRowExpanded: PropTypes.Requireable<(...args: any[]) => any>; | ||
rowExpandedHeight: PropTypes.Requireable<number>; | ||
renderEmpty: PropTypes.Requireable<(...args: any[]) => any>; | ||
renderLoading: PropTypes.Requireable<(...args: any[]) => any>; | ||
rowClassName: PropTypes.Requireable<string | ((...args: any[]) => any)>; | ||
rtl: PropTypes.Requireable<boolean>; | ||
style: PropTypes.Requireable<object>; | ||
sortColumn: PropTypes.Requireable<string>; | ||
sortType: PropTypes.Requireable<string | boolean>; | ||
showHeader: PropTypes.Requireable<boolean>; | ||
shouldUpdateScroll: PropTypes.Requireable<boolean>; | ||
translate3d: PropTypes.Requireable<boolean>; | ||
wordWrap: PropTypes.Requireable<boolean>; | ||
width: PropTypes.Requireable<number>; | ||
virtualized: PropTypes.Requireable<boolean>; | ||
isTree: PropTypes.Requireable<boolean>; | ||
onRowClick: PropTypes.Requireable<(...args: any[]) => any>; | ||
onRowContextMenu: PropTypes.Requireable<(...args: any[]) => any>; | ||
onScroll: PropTypes.Requireable<(...args: any[]) => any>; | ||
onSortColumn: PropTypes.Requireable<(...args: any[]) => any>; | ||
onExpandChange: PropTypes.Requireable<(...args: any[]) => any>; | ||
onTouchStart: PropTypes.Requireable<(...args: any[]) => any>; | ||
onTouchMove: PropTypes.Requireable<(...args: any[]) => any>; | ||
onDataUpdated: PropTypes.Requireable<(...args: any[]) => any>; | ||
}; | ||
static defaultProps: { | ||
classPrefix: string; | ||
data: any[]; | ||
defaultSortType: string; | ||
height: number; | ||
rowHeight: number; | ||
headerHeight: number; | ||
minHeight: number; | ||
rowExpandedHeight: number; | ||
hover: boolean; | ||
showHeader: boolean; | ||
rowKey: string; | ||
translate3d: boolean; | ||
shouldUpdateScroll: boolean; | ||
locale: { | ||
emptyMessage: string; | ||
loading: string; | ||
}; | ||
}; | ||
static getDerivedStateFromProps(props: TableProps, state: TableState): { | ||
cacheData: object[]; | ||
isTree: boolean; | ||
data: any[]; | ||
}; | ||
translateDOMPositionXY: any; | ||
scrollListener: any; | ||
tableRef: React.RefObject<any>; | ||
scrollbarYRef: React.RefObject<any>; | ||
scrollbarXRef: React.RefObject<any>; | ||
tableBodyRef: React.RefObject<any>; | ||
affixHeaderWrapperRef: React.RefObject<any>; | ||
mouseAreaRef: React.RefObject<any>; | ||
headerWrapperRef: React.RefObject<any>; | ||
tableHeaderRef: React.RefObject<any>; | ||
wheelWrapperRef: React.RefObject<any>; | ||
tableRows: { | ||
[key: string]: [HTMLElement, any]; | ||
}; | ||
mounted: boolean; | ||
disableEventsTimeoutId: any; | ||
scrollY: number; | ||
scrollX: number; | ||
wheelHandler: any; | ||
minScrollY: any; | ||
minScrollX: any; | ||
mouseArea: any; | ||
touchX: any; | ||
touchY: any; | ||
wheelListener: any; | ||
touchStartListener: any; | ||
touchMoveListener: any; | ||
_cacheCells: any; | ||
_cacheChildrenSize: number; | ||
_visibleRows: any[]; | ||
constructor(props: TableProps); | ||
listenWheel: (deltaX: number, deltaY: number) => void; | ||
componentDidMount(): void; | ||
shouldComponentUpdate(nextProps: TableProps, nextState: TableState): boolean; | ||
componentDidUpdate(prevProps: TableProps, prevState: TableState): void; | ||
componentWillUnmount(): void; | ||
getExpandedRowKeys(): string[] | number[]; | ||
getSortType(): "desc" | "asc"; | ||
getScrollCellGroups(): any; | ||
getFixedLeftCellGroups(): any; | ||
getFixedRightCellGroups(): any; | ||
isRTL(): boolean; | ||
getRowHeight(rowData?: {}): number; | ||
/** | ||
* 获取表头高度 | ||
*/ | ||
getTableHeaderHeight(): number; | ||
/** | ||
* 获取 Table 需要渲染的高度 | ||
*/ | ||
getTableHeight(): number; | ||
/** | ||
* 获取 columns ReactElement 数组 | ||
* - 处理 children 中存在 <Column> 数组的情况 | ||
* - 过滤 children 中的空项 | ||
*/ | ||
getTableColumns(): React.ReactNodeArray; | ||
getCellDescriptor(): any; | ||
setOffsetByAffix: () => void; | ||
handleWindowScroll: () => void; | ||
affixHorizontalScrollbar: () => void; | ||
affixTableHeader: () => void; | ||
handleSortColumn: (dataKey: string) => void; | ||
handleColumnResizeEnd: (columnWidth: number, _cursorDelta: number, dataKey: any, index: number) => void; | ||
handleColumnResizeStart: (width: number, left: number, fixed: boolean) => void; | ||
handleColumnResizeMove: (width: number, left: number, fixed: boolean) => void; | ||
handleTreeToggle: (rowKey: any, _rowIndex: number, rowData: any) => void; | ||
handleScrollX: (delta: number) => void; | ||
handleScrollY: (delta: number) => void; | ||
handleWheel: (deltaX: number, deltaY: number) => void; | ||
debounceScrollEndedCallback: () => void; | ||
handleTouchStart: (event: React.TouchEvent) => void; | ||
handleTouchMove: (event: React.TouchEvent) => void; | ||
/** | ||
* 当用户在 Table 内使用 tab 键,触发了 onScroll 事件,这个时候应该更新滚动条位置 | ||
* https://github.com/rsuite/rsuite/issues/234 | ||
*/ | ||
handleBodyScroll: (event: any) => void; | ||
initPosition(): void; | ||
updatePosition(): void; | ||
updatePositionByFixedCell(): void; | ||
shouldHandleWheelX: (delta: number) => boolean; | ||
shouldHandleWheelY: (delta: number) => boolean; | ||
shouldRenderExpandedRow(rowData: object): boolean; | ||
addPrefix: (name: string) => string; | ||
calculateRowMaxHeight(): void; | ||
calculateTableWidth: () => void; | ||
calculateTableContentWidth(prevProps: TableProps): void; | ||
calculateTableContextHeight(prevProps?: TableProps): void; | ||
getControlledScrollTopValue(value: any): number[]; | ||
getControlledScrollLeftValue(value: any): number[]; | ||
/** | ||
* public method | ||
*/ | ||
scrollTop: (top?: number) => void; | ||
scrollLeft: (left?: number) => void; | ||
scrollTo: (coord: { | ||
x: number; | ||
y: number; | ||
}) => void; | ||
bindTableRowsRef: (index: number | string, rowData: any) => (ref: HTMLElement) => void; | ||
bindRowClick: (rowData: object) => (event: React.MouseEvent) => void; | ||
bindRowContextMenu: (rowData: object) => (event: React.MouseEvent) => void; | ||
renderRowData(bodyCells: any[], rowData: any, props: TableRowProps, shouldRenderExpandedRow?: boolean): JSX.Element; | ||
renderRow(props: TableRowProps, cells: any[], shouldRenderExpandedRow?: boolean, rowData?: any): JSX.Element; | ||
renderRowExpanded(rowData?: object): JSX.Element; | ||
renderMouseArea(): JSX.Element; | ||
renderTableHeader(headerCells: any[], rowWidth: number): JSX.Element; | ||
renderTableBody(bodyCells: any[], rowWidth: number): JSX.Element; | ||
renderInfo(): {}; | ||
renderScrollbar(): JSX.Element[]; | ||
/** | ||
* show loading | ||
*/ | ||
renderLoading(): {}; | ||
render(): JSX.Element; | ||
} | ||
export default Table; |
@@ -21,3 +21,2 @@ "use strict"; | ||
var _default = TableContext; | ||
exports["default"] = _default; | ||
module.exports = exports.default; | ||
exports["default"] = _default; |
@@ -17,4 +17,2 @@ "use strict"; | ||
return ReactContext; | ||
} | ||
module.exports = exports.default; | ||
} |
@@ -25,4 +25,2 @@ "use strict"; | ||
return parents; | ||
} | ||
module.exports = exports.default; | ||
} |
@@ -21,4 +21,2 @@ "use strict"; | ||
return keys; | ||
} | ||
module.exports = exports.default; | ||
} |
@@ -33,3 +33,2 @@ "use strict"; | ||
var _default = flattenData; | ||
exports["default"] = _default; | ||
module.exports = exports.default; | ||
exports["default"] = _default; |
@@ -21,6 +21,6 @@ "use strict"; | ||
if ( /*#__PURE__*/React.isValidElement(column)) { | ||
var _column$props = column.props, | ||
flexGrow = _column$props.flexGrow, | ||
_column$props$width = _column$props.width, | ||
width = _column$props$width === void 0 ? 0 : _column$props$width; | ||
var _ref = column.props, | ||
flexGrow = _ref.flexGrow, | ||
_ref$width = _ref.width, | ||
width = _ref$width === void 0 ? 0 : _ref$width; | ||
totalFlexGrow += flexGrow || 0; | ||
@@ -52,3 +52,2 @@ totalWidth += flexGrow ? 0 : width; | ||
var _default = getTotalByColumns; | ||
exports["default"] = _default; | ||
module.exports = exports.default; | ||
exports["default"] = _default; |
@@ -9,11 +9,7 @@ "use strict"; | ||
* Useful for getting and spreading unknown props from the user. | ||
* @param {function} Component A function or ReactClass. | ||
* @param {object} propTypes | ||
* @param {object} props A ReactElement props object | ||
* @returns {{}} A shallow copy of the prop object | ||
*/ | ||
var getUnhandledProps = function getUnhandledProps(Component, props) { | ||
var _Component$handledPro = Component.handledProps, | ||
handledProps = _Component$handledPro === void 0 ? [] : _Component$handledPro, | ||
_Component$propTypes = Component.propTypes, | ||
propTypes = _Component$propTypes === void 0 ? {} : _Component$propTypes; | ||
var getUnhandledProps = function getUnhandledProps(propTypes, props) { | ||
var propTypeKeys = Object.keys(propTypes); | ||
@@ -25,6 +21,2 @@ return Object.keys(props).reduce(function (acc, prop) { | ||
if (handledProps.length > 0 && handledProps.indexOf(prop) === -1) { | ||
acc[prop] = props[prop]; | ||
} | ||
if (propTypeKeys.length > 0 && propTypeKeys.indexOf(prop) === -1) { | ||
@@ -39,3 +31,2 @@ acc[prop] = props[prop]; | ||
var _default = getUnhandledProps; | ||
exports["default"] = _default; | ||
module.exports = exports.default; | ||
exports["default"] = _default; |
@@ -6,28 +6,10 @@ "use strict"; | ||
exports.__esModule = true; | ||
var _exportNames = { | ||
isNullOrUndefined: true, | ||
getUnhandledProps: true, | ||
getTotalByColumns: true, | ||
mergeCells: true, | ||
toggleClass: true, | ||
toggle: true, | ||
flattenData: true, | ||
translateDOMPositionXY: true, | ||
isRTL: true, | ||
findRowKeys: true, | ||
findAllParents: true, | ||
shouldShowRowByExpanded: true, | ||
resetLeftForCells: true, | ||
isNumberOrTrue: true | ||
}; | ||
exports.isNumberOrTrue = exports.resetLeftForCells = exports.shouldShowRowByExpanded = exports.findAllParents = exports.findRowKeys = exports.isRTL = exports.translateDOMPositionXY = exports.flattenData = exports.toggle = exports.toggleClass = exports.mergeCells = exports.getTotalByColumns = exports.getUnhandledProps = exports.isNullOrUndefined = void 0; | ||
exports.requestAnimationTimeout = exports.cancelAnimationTimeout = exports.mergeRefs = exports.isNumberOrTrue = exports.resetLeftForCells = exports.shouldShowRowByExpanded = exports.findAllParents = exports.findRowKeys = exports.isRTL = exports.translateDOMPositionXY = exports.flattenData = exports.toggle = exports.toggleClass = exports.mergeCells = exports.getTotalByColumns = exports.getUnhandledProps = exports.isNullOrUndefined = exports.getClassNamePrefix = exports.prefix = exports.defaultClassPrefix = exports.globalKey = void 0; | ||
var _prefix = require("./prefix"); | ||
Object.keys(_prefix).forEach(function (key) { | ||
if (key === "default" || key === "__esModule") return; | ||
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return; | ||
if (key in exports && exports[key] === _prefix[key]) return; | ||
exports[key] = _prefix[key]; | ||
}); | ||
exports.globalKey = _prefix.globalKey; | ||
exports.defaultClassPrefix = _prefix.defaultClassPrefix; | ||
exports.prefix = _prefix.prefix; | ||
exports.getClassNamePrefix = _prefix.getClassNamePrefix; | ||
@@ -90,9 +72,9 @@ var _isNullOrUndefined = _interopRequireDefault(require("./isNullOrUndefined")); | ||
var _mergeRefs = _interopRequireDefault(require("./mergeRefs")); | ||
exports.mergeRefs = _mergeRefs["default"]; | ||
var _requestAnimationTimeout = require("./requestAnimationTimeout"); | ||
Object.keys(_requestAnimationTimeout).forEach(function (key) { | ||
if (key === "default" || key === "__esModule") return; | ||
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return; | ||
if (key in exports && exports[key] === _requestAnimationTimeout[key]) return; | ||
exports[key] = _requestAnimationTimeout[key]; | ||
}); | ||
exports.cancelAnimationTimeout = _requestAnimationTimeout.cancelAnimationTimeout; | ||
exports.requestAnimationTimeout = _requestAnimationTimeout.requestAnimationTimeout; |
@@ -14,4 +14,2 @@ "use strict"; | ||
return (0, _isNull["default"])(value) || (0, _isUndefined["default"])(value); | ||
} | ||
module.exports = exports.default; | ||
} |
@@ -8,4 +8,2 @@ "use strict"; | ||
return !!value || value === 0; | ||
} | ||
module.exports = exports.default; | ||
} |
@@ -8,4 +8,2 @@ "use strict"; | ||
return typeof window !== 'undefined' && (document.body.getAttribute('dir') || document.dir) === 'rtl'; | ||
} | ||
module.exports = exports.default; | ||
} |
@@ -18,2 +18,4 @@ "use strict"; | ||
var _HeaderCell = _interopRequireDefault(require("../HeaderCell")); | ||
var _isNullOrUndefined = _interopRequireDefault(require("./isNullOrUndefined")); | ||
@@ -50,3 +52,8 @@ | ||
nextCellWidth = _nextCell$props.width, | ||
children = _nextCell$props.children; | ||
sortable = _nextCell$props.sortable, | ||
children = _nextCell$props.children, | ||
dataKey = _nextCell$props.dataKey, | ||
onSortColumn = _nextCell$props.onSortColumn, | ||
sortColumn = _nextCell$props.sortColumn, | ||
sortType = _nextCell$props.sortType; | ||
@@ -61,8 +68,11 @@ if (j !== 0) { | ||
groupChildren.push( /*#__PURE__*/React.createElement("div", { | ||
groupChildren.push( /*#__PURE__*/React.createElement(_HeaderCell["default"], { | ||
key: j, | ||
style: { | ||
width: nextCellWidth, | ||
left: left | ||
} | ||
left: left, | ||
dataKey: dataKey, | ||
width: nextCellWidth, | ||
sortable: sortable, | ||
sortColumn: sortColumn, | ||
sortType: sortType, | ||
onSortColumn: onSortColumn | ||
}, children)); | ||
@@ -98,4 +108,4 @@ } | ||
_isHeaderCell = _nextCell$props2.isHeaderCell, | ||
dataKey = _nextCell$props2.dataKey; | ||
var cellText = (0, _isFunction["default"])(_children) ? _children(rowData, rowIndex) : (0, _get["default"])(rowData, dataKey); | ||
_dataKey = _nextCell$props2.dataKey; | ||
var cellText = (0, _isFunction["default"])(_children) ? _children(rowData, rowIndex) : (0, _get["default"])(rowData, _dataKey); | ||
@@ -113,3 +123,3 @@ if (rowData && (0, _isNullOrUndefined["default"])(cellText) || _isHeaderCell && (0, _isNullOrUndefined["default"])(_children)) { | ||
width: _nextWidth, | ||
'aria-colspan': colSpan && _nextWidth > width ? colSpan : undefined | ||
'aria-colspan': _nextWidth > width ? colSpan : undefined | ||
})); | ||
@@ -126,3 +136,2 @@ continue; | ||
var _default = mergeCells; | ||
exports["default"] = _default; | ||
module.exports = exports.default; | ||
exports["default"] = _default; |
@@ -25,3 +25,8 @@ "use strict"; | ||
var defaultClassPrefix = function defaultClassPrefix(name) { | ||
var defaultClassPrefix = function defaultClassPrefix(name, tableClassPrefix) { | ||
// 当设置了 table 的 classPrefix,则使用它作为前缀,并删除 name 中的 table | ||
if (tableClassPrefix) { | ||
return tableClassPrefix + "-" + (name === null || name === void 0 ? void 0 : name.replace('table-', '')); | ||
} | ||
return "" + getClassNamePrefix() + name; | ||
@@ -28,0 +33,0 @@ }; |
@@ -30,4 +30,2 @@ "use strict"; | ||
return nextCells; | ||
} | ||
module.exports = exports.default; | ||
} |
@@ -26,4 +26,2 @@ "use strict"; | ||
return false; | ||
} | ||
module.exports = exports.default; | ||
} |
@@ -25,3 +25,2 @@ "use strict"; | ||
var _default = toggle; | ||
exports["default"] = _default; | ||
module.exports = exports.default; | ||
exports["default"] = _default; |
@@ -32,3 +32,2 @@ "use strict"; | ||
exports["default"] = _default; | ||
module.exports = exports.default; | ||
exports["default"] = _default; |
@@ -12,3 +12,2 @@ "use strict"; | ||
var _default = translateDOMPositionXY; | ||
exports["default"] = _default; | ||
module.exports = exports.default; | ||
exports["default"] = _default; |
{ | ||
"name": "rsuite-table", | ||
"version": "5.0.0-alpha.2", | ||
"version": "5.0.0-alpha.3", | ||
"description": "A React table component", | ||
@@ -11,7 +11,8 @@ "main": "lib/index.js", | ||
"format:check": "prettier --list-different \"{src,test}/**/*.{tsx,ts,js}\"", | ||
"build": "npm run build:gulp", | ||
"build": "npm run build:gulp && npm run build:types", | ||
"build:gulp": "gulp build", | ||
"build:types": "npx tsc --emitDeclarationOnly --outDir lib && npx tsc --emitDeclarationOnly --outDir es", | ||
"build:docs": "rm -rf assets && NODE_ENV=production webpack", | ||
"dev": "cross-env NODE_ENV=development webpack-dev-server --inline --progress --colors --port 3100 --host 0.0.0.0 ", | ||
"docs": "rm -rf assets && NODE_ENV=production webpack", | ||
"publish-docs": "node docs/gh-pages.js", | ||
"publish:docs": "node docs/gh-pages.js", | ||
"tdd": "karma start", | ||
@@ -40,6 +41,6 @@ "lint:ts": "eslint src/**/*.{ts,tsx}", | ||
"@babel/runtime": "^7.12.5", | ||
"@rsuite/icons": "^1.0.0-12", | ||
"@rsuite/icons": "^1.0.0", | ||
"classnames": "^2.2.5", | ||
"dom-lib": "^1.2.1", | ||
"element-resize-event": "^3.0.2", | ||
"dom-lib": "^2.0.3", | ||
"element-resize-event": "^3.0.6", | ||
"lodash": "^4.17.20" | ||
@@ -75,3 +76,2 @@ }, | ||
"babel-loader": "^8.2.2", | ||
"babel-plugin-add-module-exports": "^1.0.4", | ||
"babel-plugin-date-fns": "^0.2.1", | ||
@@ -78,0 +78,0 @@ "babel-plugin-istanbul": "^4.1.4", |
import * as React from 'react'; | ||
import isPlainObject from 'lodash/isPlainObject'; | ||
import { ColumnProps } from '../Column'; | ||
@@ -11,3 +12,3 @@ function getTotalByColumns(columns) { | ||
if (React.isValidElement(column)) { | ||
const { flexGrow, width = 0 } = column.props; | ||
const { flexGrow, width = 0 } = column.props as ColumnProps; | ||
totalFlexGrow += flexGrow || 0; | ||
@@ -14,0 +15,0 @@ totalWidth += flexGrow ? 0 : width; |
@@ -0,5 +1,6 @@ | ||
import PropTypes from 'prop-types'; | ||
/** | ||
* Returns an object consisting of props beyond the scope of the Component. | ||
* Useful for getting and spreading unknown props from the user. | ||
* @param {function} Component A function or ReactClass. | ||
* @param {object} propTypes | ||
* @param {object} props A ReactElement props object | ||
@@ -9,4 +10,6 @@ * @returns {{}} A shallow copy of the prop object | ||
const getUnhandledProps = (Component: any, props: any) => { | ||
const { handledProps = [], propTypes = {} } = Component; | ||
const getUnhandledProps = ( | ||
propTypes: Record<string, PropTypes.Requireable<any>>, | ||
props: Record<string, any> | ||
) => { | ||
const propTypeKeys = Object.keys(propTypes); | ||
@@ -18,5 +21,2 @@ | ||
} | ||
if (handledProps.length > 0 && handledProps.indexOf(prop) === -1) { | ||
acc[prop] = props[prop]; | ||
} | ||
if (propTypeKeys.length > 0 && propTypeKeys.indexOf(prop) === -1) { | ||
@@ -23,0 +23,0 @@ acc[prop] = props[prop]; |
@@ -1,2 +0,2 @@ | ||
export * from './prefix'; | ||
export { globalKey, defaultClassPrefix, prefix, getClassNamePrefix } from './prefix'; | ||
export { default as isNullOrUndefined } from './isNullOrUndefined'; | ||
@@ -16,2 +16,3 @@ export { default as getUnhandledProps } from './getUnhandledProps'; | ||
export { default as isNumberOrTrue } from './isNumberOrTrue'; | ||
export * from './requestAnimationTimeout'; | ||
export { default as mergeRefs } from './mergeRefs'; | ||
export { cancelAnimationTimeout, requestAnimationTimeout } from './requestAnimationTimeout'; |
@@ -9,5 +9,14 @@ import curry from 'lodash/curry'; | ||
} | ||
return globalKey; | ||
}; | ||
export const defaultClassPrefix = name => `${getClassNamePrefix()}${name}`; | ||
export const defaultClassPrefix = (name: string, tableClassPrefix?: string) => { | ||
// 当设置了 table 的 classPrefix,则使用它作为前缀,并删除 name 中的 table | ||
if (tableClassPrefix) { | ||
return `${tableClassPrefix}-${name?.replace('table-', '')}`; | ||
} | ||
return `${getClassNamePrefix()}${name}`; | ||
}; | ||
export const prefix = curry((pre: string, className: string | string[]) => { | ||
@@ -14,0 +23,0 @@ if (!pre || !className) { |
@@ -5,3 +5,3 @@ import requestAnimationFramePolyfill from 'dom-lib/lib/animation/requestAnimationFramePolyfill'; | ||
export const cancelAnimationTimeout = (frame: KeyframeAnimationOptions) => | ||
cancelAnimationFramePolyfill(frame.id); | ||
cancelAnimationFramePolyfill(frame.id as any); | ||
@@ -8,0 +8,0 @@ /** |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
475655
86
197
10221
+ Addeddom-lib@2.1.0(transitive)
- Removeddom-lib@1.3.1(transitive)
Updated@rsuite/icons@^1.0.0
Updateddom-lib@^2.0.3
Updatedelement-resize-event@^3.0.6