Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

rc-tree

Package Overview
Dependencies
Maintainers
10
Versions
308
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

rc-tree - npm Package Compare versions

Comparing version 4.0.0 to 4.1.0

4

es/interface.d.ts
import * as React from 'react';
import { TreeNodeProps } from './TreeNode';
export { ScrollTo } from 'rc-virtual-list/lib/List';
export interface DataNode {

@@ -64,7 +65,4 @@ checkable?: boolean;

}
export declare type ScrollTo = (scroll: {
key: Key;
}) => void;
export declare type GetKey<RecordType> = (record: RecordType, index?: number) => Key;
export declare type GetCheckDisabled<RecordType> = (record: RecordType) => boolean;
export declare type Direction = 'ltr' | 'rtl' | undefined;

@@ -0,1 +1,2 @@

import _extends from "@babel/runtime/helpers/esm/extends";
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";

@@ -60,3 +61,3 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";

if (motionNodes) {
return /*#__PURE__*/React.createElement(CSSMotion, Object.assign({
return /*#__PURE__*/React.createElement(CSSMotion, _extends({
ref: ref,

@@ -84,3 +85,3 @@ visible: visible

var treeNodeProps = getTreeNodeProps(key, treeNodeRequiredProps);
return /*#__PURE__*/React.createElement(TreeNode, Object.assign({}, restProps, treeNodeProps, {
return /*#__PURE__*/React.createElement(TreeNode, _extends({}, restProps, treeNodeProps, {
active: active,

@@ -96,3 +97,3 @@ data: treeNode.data,

return /*#__PURE__*/React.createElement(TreeNode, Object.assign({
return /*#__PURE__*/React.createElement(TreeNode, _extends({
domRef: ref,

@@ -99,0 +100,0 @@ className: className,

@@ -0,1 +1,2 @@

import _extends from "@babel/runtime/helpers/esm/extends";
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";

@@ -241,3 +242,3 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";

className: "".concat(prefixCls, "-indent-unit")
}))), /*#__PURE__*/React.createElement(VirtualList, Object.assign({}, domProps, {
}))), /*#__PURE__*/React.createElement(VirtualList, _extends({}, domProps, {
data: mergedData,

@@ -262,3 +263,3 @@ itemKey: itemKey,

var treeNodeProps = getTreeNodeProps(mergedKey, treeNodeRequiredProps);
return /*#__PURE__*/React.createElement(MotionTreeNode, Object.assign({}, restProps, treeNodeProps, {
return /*#__PURE__*/React.createElement(MotionTreeNode, _extends({}, restProps, treeNodeProps, {
active: !!activeItem && key === activeItem.data.key,

@@ -265,0 +266,0 @@ pos: pos,

@@ -0,1 +1,2 @@

import _extends from "@babel/runtime/helpers/esm/extends";
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";

@@ -1029,3 +1030,3 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";

className: classNames(prefixCls, className, (_classNames = {}, _defineProperty(_classNames, "".concat(prefixCls, "-show-line"), showLine), _defineProperty(_classNames, "".concat(prefixCls, "-focused"), focused), _defineProperty(_classNames, "".concat(prefixCls, "-active-focused"), activeKey !== null), _classNames))
}, /*#__PURE__*/React.createElement(NodeList, Object.assign({
}, /*#__PURE__*/React.createElement(NodeList, _extends({
ref: this.listRef,

@@ -1032,0 +1033,0 @@ prefixCls: prefixCls,

@@ -64,3 +64,3 @@ import * as React from 'react';

setSelectHandle: (node: any) => void;
getNodeState: () => "open" | "close";
getNodeState: () => "close" | "open";
hasChildren: () => boolean;

@@ -67,0 +67,0 @@ isLeaf: () => boolean;

@@ -0,1 +1,2 @@

import _extends from "@babel/runtime/helpers/esm/extends";
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";

@@ -436,3 +437,3 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";

var mergedDraggable = typeof draggable === 'function' ? draggable(data) : draggable;
return /*#__PURE__*/React.createElement("div", Object.assign({
return /*#__PURE__*/React.createElement("div", _extends({
ref: domRef,

@@ -461,3 +462,3 @@ className: classNames(className, "".concat(prefixCls, "-treenode"), (_classNames = {}, _defineProperty(_classNames, "".concat(prefixCls, "-treenode-disabled"), disabled), _defineProperty(_classNames, "".concat(prefixCls, "-treenode-switcher-").concat(expanded ? 'open' : 'close'), !isLeaf), _defineProperty(_classNames, "".concat(prefixCls, "-treenode-checkbox-checked"), checked), _defineProperty(_classNames, "".concat(prefixCls, "-treenode-checkbox-indeterminate"), halfChecked), _defineProperty(_classNames, "".concat(prefixCls, "-treenode-selected"), selected), _defineProperty(_classNames, "".concat(prefixCls, "-treenode-loading"), loading), _defineProperty(_classNames, "".concat(prefixCls, "-treenode-active"), active), _defineProperty(_classNames, "".concat(prefixCls, "-treenode-leaf-last"), isEndNode), _defineProperty(_classNames, 'drop-target', dropTargetKey === eventKey), _defineProperty(_classNames, 'drop-container', dropContainerKey === eventKey), _defineProperty(_classNames, 'drag-over', !disabled && dragOver), _defineProperty(_classNames, 'drag-over-gap-top', !disabled && dragOverGapTop), _defineProperty(_classNames, 'drag-over-gap-bottom', !disabled && dragOverGapBottom), _defineProperty(_classNames, 'filter-node', filterTreeNode && filterTreeNode(convertNodePropsToEventData(this.props))), _classNames)),

return /*#__PURE__*/React.createElement(TreeContext.Consumer, null, function (context) {
return /*#__PURE__*/React.createElement(InternalTreeNode, Object.assign({}, props, {
return /*#__PURE__*/React.createElement(InternalTreeNode, _extends({}, props, {
context: context

@@ -464,0 +465,0 @@ }));

@@ -234,3 +234,3 @@ import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";

var childrenNodes = convertDataToTree(children, processor);
return /*#__PURE__*/React.createElement(TreeNode, Object.assign({}, processProps(props)), childrenNodes);
return /*#__PURE__*/React.createElement(TreeNode, processProps(props), childrenNodes);
});

@@ -237,0 +237,0 @@ }

@@ -20,2 +20,7 @@ import * as React from 'react';

export declare function flattenTreeData(treeNodeList?: DataNode[], expandedKeys?: Key[] | true): FlattenNode[];
declare type ExternalGetKey = GetKey<DataNode> | string;
interface TraverseDataNodesConfig {
childrenPropName?: string;
externalGetKey?: ExternalGetKey;
}
/**

@@ -32,3 +37,3 @@ * Traverse all the data by `treeData`.

level: number;
}) => void, externalGetKey?: GetKey<DataNode> | string): void;
}) => void, config?: TraverseDataNodesConfig | ExternalGetKey): void;
interface Wrapper {

@@ -41,7 +46,11 @@ posEntities: Record<string, DataEntity>;

*/
export declare function convertDataToEntities(dataNodes: DataNode[], { initWrapper, processEntity, onProcessFinished, }?: {
export declare function convertDataToEntities(dataNodes: DataNode[], { initWrapper, processEntity, onProcessFinished, externalGetKey, childrenPropName, }?: {
initWrapper?: (wrapper: Wrapper) => Wrapper;
processEntity?: (entity: DataEntity, wrapper: Wrapper) => void;
onProcessFinished?: (wrapper: Wrapper) => void;
}, externalGetKey?: GetKey<DataNode> | string): {
externalGetKey?: ExternalGetKey;
childrenPropName?: string;
},
/** @deprecated Use `config.externalGetKey` instead */
legacyExternalGetKey?: ExternalGetKey): {
posEntities: {};

@@ -48,0 +57,0 @@ keyEntities: {};

@@ -0,1 +1,2 @@

import _typeof from "@babel/runtime/helpers/esm/typeof";
import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";

@@ -123,3 +124,20 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";

export function traverseDataNodes(dataNodes, callback, externalGetKey) {
export function traverseDataNodes(dataNodes, callback, // To avoid too many params, let use config instead of origin param
config) {
// Init config
var externalGetKey = null;
var childrenPropName;
var configType = _typeof(config);
if (configType === 'function' || configType === 'string') {
// Legacy getKey param
externalGetKey = config;
} else if (config && configType === 'object') {
childrenPropName = config.childrenPropName;
externalGetKey = config.externalGetKey;
}
childrenPropName = childrenPropName || 'children'; // Get keys
var syntheticGetKey;

@@ -141,6 +159,7 @@

};
}
} // Process
function processNode(node, index, parent) {
var children = node ? node.children : dataNodes;
var children = node ? node[childrenPropName] : dataNodes;
var pos = node ? getPosition(parent.pos, index) : '0'; // Process node if is not root

@@ -183,5 +202,11 @@

processEntity = _ref.processEntity,
onProcessFinished = _ref.onProcessFinished;
onProcessFinished = _ref.onProcessFinished,
externalGetKey = _ref.externalGetKey,
childrenPropName = _ref.childrenPropName;
var externalGetKey = arguments.length > 2 ? arguments[2] : undefined;
var
/** @deprecated Use `config.externalGetKey` instead */
legacyExternalGetKey = arguments.length > 2 ? arguments[2] : undefined;
// Init config
var mergedExternalGetKey = externalGetKey || legacyExternalGetKey;
var posEntities = {};

@@ -226,3 +251,6 @@ var keyEntities = {};

}
}, externalGetKey);
}, {
externalGetKey: mergedExternalGetKey,
childrenPropName: childrenPropName
});

@@ -229,0 +257,0 @@ if (onProcessFinished) {

import * as React from 'react';
import { TreeNodeProps } from './TreeNode';
export { ScrollTo } from 'rc-virtual-list/lib/List';
export interface DataNode {

@@ -64,7 +65,4 @@ checkable?: boolean;

}
export declare type ScrollTo = (scroll: {
key: Key;
}) => void;
export declare type GetKey<RecordType> = (record: RecordType, index?: number) => Key;
export declare type GetCheckDisabled<RecordType> = (record: RecordType) => boolean;
export declare type Direction = 'ltr' | 'rtl' | undefined;

@@ -12,2 +12,4 @@ "use strict";

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));

@@ -78,3 +80,3 @@

if (motionNodes) {
return /*#__PURE__*/React.createElement(_rcMotion.default, Object.assign({
return /*#__PURE__*/React.createElement(_rcMotion.default, (0, _extends2.default)({
ref: ref,

@@ -101,3 +103,3 @@ visible: visible

var treeNodeProps = (0, _treeUtil.getTreeNodeProps)(key, treeNodeRequiredProps);
return /*#__PURE__*/React.createElement(_TreeNode.default, Object.assign({}, restProps, treeNodeProps, {
return /*#__PURE__*/React.createElement(_TreeNode.default, (0, _extends2.default)({}, restProps, treeNodeProps, {
active: active,

@@ -113,3 +115,3 @@ data: treeNode.data,

return /*#__PURE__*/React.createElement(_TreeNode.default, Object.assign({
return /*#__PURE__*/React.createElement(_TreeNode.default, (0, _extends2.default)({
domRef: ref,

@@ -116,0 +118,0 @@ className: className,

@@ -13,2 +13,4 @@ "use strict";

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));

@@ -261,3 +263,3 @@

className: "".concat(prefixCls, "-indent-unit")
}))), /*#__PURE__*/React.createElement(_rcVirtualList.default, Object.assign({}, domProps, {
}))), /*#__PURE__*/React.createElement(_rcVirtualList.default, (0, _extends2.default)({}, domProps, {
data: mergedData,

@@ -281,3 +283,3 @@ itemKey: itemKey,

var treeNodeProps = (0, _treeUtil.getTreeNodeProps)(mergedKey, treeNodeRequiredProps);
return /*#__PURE__*/React.createElement(_MotionTreeNode.default, Object.assign({}, restProps, treeNodeProps, {
return /*#__PURE__*/React.createElement(_MotionTreeNode.default, (0, _extends2.default)({}, restProps, treeNodeProps, {
active: !!activeItem && key === activeItem.data.key,

@@ -284,0 +286,0 @@ pos: pos,

@@ -12,2 +12,4 @@ "use strict";

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

@@ -1054,3 +1056,3 @@

className: (0, _classnames.default)(prefixCls, className, (_classNames = {}, (0, _defineProperty2.default)(_classNames, "".concat(prefixCls, "-show-line"), showLine), (0, _defineProperty2.default)(_classNames, "".concat(prefixCls, "-focused"), focused), (0, _defineProperty2.default)(_classNames, "".concat(prefixCls, "-active-focused"), activeKey !== null), _classNames))
}, /*#__PURE__*/React.createElement(_NodeList.default, Object.assign({
}, /*#__PURE__*/React.createElement(_NodeList.default, (0, _extends2.default)({
ref: this.listRef,

@@ -1057,0 +1059,0 @@ prefixCls: prefixCls,

@@ -64,3 +64,3 @@ import * as React from 'react';

setSelectHandle: (node: any) => void;
getNodeState: () => "open" | "close";
getNodeState: () => "close" | "open";
hasChildren: () => boolean;

@@ -67,0 +67,0 @@ isLeaf: () => boolean;

@@ -12,2 +12,4 @@ "use strict";

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

@@ -460,3 +462,3 @@

var mergedDraggable = typeof draggable === 'function' ? draggable(data) : draggable;
return /*#__PURE__*/React.createElement("div", Object.assign({
return /*#__PURE__*/React.createElement("div", (0, _extends2.default)({
ref: domRef,

@@ -486,3 +488,3 @@ className: (0, _classnames.default)(className, "".concat(prefixCls, "-treenode"), (_classNames = {}, (0, _defineProperty2.default)(_classNames, "".concat(prefixCls, "-treenode-disabled"), disabled), (0, _defineProperty2.default)(_classNames, "".concat(prefixCls, "-treenode-switcher-").concat(expanded ? 'open' : 'close'), !isLeaf), (0, _defineProperty2.default)(_classNames, "".concat(prefixCls, "-treenode-checkbox-checked"), checked), (0, _defineProperty2.default)(_classNames, "".concat(prefixCls, "-treenode-checkbox-indeterminate"), halfChecked), (0, _defineProperty2.default)(_classNames, "".concat(prefixCls, "-treenode-selected"), selected), (0, _defineProperty2.default)(_classNames, "".concat(prefixCls, "-treenode-loading"), loading), (0, _defineProperty2.default)(_classNames, "".concat(prefixCls, "-treenode-active"), active), (0, _defineProperty2.default)(_classNames, "".concat(prefixCls, "-treenode-leaf-last"), isEndNode), (0, _defineProperty2.default)(_classNames, 'drop-target', dropTargetKey === eventKey), (0, _defineProperty2.default)(_classNames, 'drop-container', dropContainerKey === eventKey), (0, _defineProperty2.default)(_classNames, 'drag-over', !disabled && dragOver), (0, _defineProperty2.default)(_classNames, 'drag-over-gap-top', !disabled && dragOverGapTop), (0, _defineProperty2.default)(_classNames, 'drag-over-gap-bottom', !disabled && dragOverGapBottom), (0, _defineProperty2.default)(_classNames, 'filter-node', filterTreeNode && filterTreeNode((0, _treeUtil.convertNodePropsToEventData)(this.props))), _classNames)),

return /*#__PURE__*/React.createElement(_contextTypes.TreeContext.Consumer, null, function (context) {
return /*#__PURE__*/React.createElement(InternalTreeNode, Object.assign({}, props, {
return /*#__PURE__*/React.createElement(InternalTreeNode, (0, _extends2.default)({}, props, {
context: context

@@ -489,0 +491,0 @@ }));

@@ -269,3 +269,3 @@ "use strict";

var childrenNodes = convertDataToTree(children, processor);
return /*#__PURE__*/_react.default.createElement(_TreeNode.default, Object.assign({}, processProps(props)), childrenNodes);
return /*#__PURE__*/_react.default.createElement(_TreeNode.default, processProps(props), childrenNodes);
});

@@ -272,0 +272,0 @@ }

@@ -20,2 +20,7 @@ import * as React from 'react';

export declare function flattenTreeData(treeNodeList?: DataNode[], expandedKeys?: Key[] | true): FlattenNode[];
declare type ExternalGetKey = GetKey<DataNode> | string;
interface TraverseDataNodesConfig {
childrenPropName?: string;
externalGetKey?: ExternalGetKey;
}
/**

@@ -32,3 +37,3 @@ * Traverse all the data by `treeData`.

level: number;
}) => void, externalGetKey?: GetKey<DataNode> | string): void;
}) => void, config?: TraverseDataNodesConfig | ExternalGetKey): void;
interface Wrapper {

@@ -41,7 +46,11 @@ posEntities: Record<string, DataEntity>;

*/
export declare function convertDataToEntities(dataNodes: DataNode[], { initWrapper, processEntity, onProcessFinished, }?: {
export declare function convertDataToEntities(dataNodes: DataNode[], { initWrapper, processEntity, onProcessFinished, externalGetKey, childrenPropName, }?: {
initWrapper?: (wrapper: Wrapper) => Wrapper;
processEntity?: (entity: DataEntity, wrapper: Wrapper) => void;
onProcessFinished?: (wrapper: Wrapper) => void;
}, externalGetKey?: GetKey<DataNode> | string): {
externalGetKey?: ExternalGetKey;
childrenPropName?: string;
},
/** @deprecated Use `config.externalGetKey` instead */
legacyExternalGetKey?: ExternalGetKey): {
posEntities: {};

@@ -48,0 +57,0 @@ keyEntities: {};

@@ -17,2 +17,4 @@ "use strict";

var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));

@@ -146,3 +148,19 @@

function traverseDataNodes(dataNodes, callback, externalGetKey) {
function traverseDataNodes(dataNodes, callback, // To avoid too many params, let use config instead of origin param
config) {
// Init config
var externalGetKey = null;
var childrenPropName;
var configType = (0, _typeof2.default)(config);
if (configType === 'function' || configType === 'string') {
// Legacy getKey param
externalGetKey = config;
} else if (config && configType === 'object') {
childrenPropName = config.childrenPropName;
externalGetKey = config.externalGetKey;
}
childrenPropName = childrenPropName || 'children'; // Get keys
var syntheticGetKey;

@@ -164,6 +182,7 @@

};
}
} // Process
function processNode(node, index, parent) {
var children = node ? node.children : dataNodes;
var children = node ? node[childrenPropName] : dataNodes;
var pos = node ? (0, _util.getPosition)(parent.pos, index) : '0'; // Process node if is not root

@@ -207,5 +226,11 @@

processEntity = _ref.processEntity,
onProcessFinished = _ref.onProcessFinished;
onProcessFinished = _ref.onProcessFinished,
externalGetKey = _ref.externalGetKey,
childrenPropName = _ref.childrenPropName;
var externalGetKey = arguments.length > 2 ? arguments[2] : undefined;
var
/** @deprecated Use `config.externalGetKey` instead */
legacyExternalGetKey = arguments.length > 2 ? arguments[2] : undefined;
// Init config
var mergedExternalGetKey = externalGetKey || legacyExternalGetKey;
var posEntities = {};

@@ -250,3 +275,6 @@ var keyEntities = {};

}
}, externalGetKey);
}, {
externalGetKey: mergedExternalGetKey,
childrenPropName: childrenPropName
});

@@ -253,0 +281,0 @@ if (onProcessFinished) {

{
"name": "rc-tree",
"version": "4.0.0",
"version": "4.1.0",
"description": "tree ui component for react",

@@ -56,3 +56,3 @@ "engines": {

"@types/warning": "^3.0.0",
"@umijs/fabric": "^2.3.1",
"@umijs/fabric": "^2.4.8",
"css-animation": "^1.2.0",

@@ -59,0 +59,0 @@ "enzyme": "^3.3.0",

@@ -8,3 +8,3 @@ # rc-tree

[![NPM version][npm-image]][npm-url]
[![build status][travis-image]][travis-url]
[![build status][github-actions-image]][github-actions-url]
[![Test coverage][coveralls-image]][coveralls-url]

@@ -18,4 +18,4 @@ [![Dependencies][david-image]][david-url]

[npm-url]: http://npmjs.org/package/rc-tree
[travis-image]: https://img.shields.io/travis/react-component/tree.svg?style=flat-square
[travis-url]: https://travis-ci.org/react-component/tree
[github-actions-image]: https://github.com/react-component/tree/workflows/CI/badge.svg
[github-actions-url]: https://github.com/react-component/tree/actions
[coveralls-image]: https://img.shields.io/coveralls/react-component/tree.svg?style=flat-square

@@ -46,3 +46,3 @@ [coveralls-url]: https://coveralls.io/r/react-component/tree?branch=master

## install
## Install

@@ -123,3 +123,3 @@ [![rc-tree](https://nodei.co/npm/rc-tree.png)](https://npmjs.org/package/rc-tree)

## note
## Note

@@ -147,8 +147,8 @@ The number of treeNodes can be very large, but when enable `checkable`, it will spend more computing time, so we cached some calculations(e.g. `this.treeNodesStates`), to avoid double computing. But, this bring some restrictions, **when you async load treeNodes, you should render tree like this** `{this.state.treeData.length ? <Tree ...>{this.state.treeData.map(t => <TreeNode ... />)}</Tree> : 'loading tree'}`

## other tree view
## Other tree views
- [ztree](http://www.ztree.me/)
- [jqTree](http://mbraak.github.io/jqTree/)
- [jquery.treeselect](http://travistidwell.com/jquery.treeselect.js/)
- [angular Select Tree](http://a5hik.github.io/angular-multi-select-tree/)
- [zTree](http://www.treejs.cn/)
- [jqTree](https://mbraak.github.io/jqTree/)
- [jquery.treeselect](https://travistidwell.com/jquery.treeselect.js/)
- [Angular Multi Select Tree](https://a5hik.github.io/angular-multi-select-tree/)
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc