Merge pull request #14512 from johnnyreilly/master

contributing rc-tree definition

rc-tree/index.d.ts

@@ -0,0 +1,67 @@
+// Type definitions for rc-tree 1.4
+// Project: https://github.com/react-component/tree
+// Definitions by: John Reilly <https://github.com/johnnyreilly/>
+// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
+// TypeScript Version: 2.1
+
+import {
+    Component,
+    Props
+} from "react";
+
+export interface TreeNodeProps extends Props<TreeNode> {
+    className?: string;
+    disabled?: boolean;
+    disableCheckbox?: boolean;
+    title?: string | JSX.Element;
+    isLeaf?: boolean;
+}
+
+export class TreeNode extends Component<TreeNodeProps, {}> { }
+
+export interface ExpandData {
+    expanded: boolean;
+    node: TreeNode;
+}
+
+export interface CheckData {
+    checked: boolean;
+    checkedNodes: TreeNode[];
+    node: TreeNode;
+    event: Event;
+}
+
+export interface SelectData {
+    selected: boolean;
+    selectedNodes: TreeNode[];
+    node: TreeNode;
+    event: Event;
+}
+
+
+export interface TreeProps extends Props<Tree> {
+    className?: string;
+    prefixCls?: string;
+    showLine?: boolean;
+    showIcon?: boolean;
+    selectable?: boolean;
+    multiple?: boolean;
+    checkable?: boolean | JSX.Element;
+    defaultExpandAll?: boolean;
+    defaultExpandedKeys?: string[];
+    expandedKeys?: string[];
+    autoExpandParent?: boolean;
+    defaultCheckedKeys?: string[];
+    checkedKeys?: string[] | { checked: string[]; halfChecked: string[] };
+    checkStrictly?: boolean;
+    defaultSelectedKeys?: string[];
+    selectedKeys?: string[];
+    onExpand?: (expandedKeys: string[], e: ExpandData) => void;
+    onCheck?: (checkedKeys: string[], e: CheckData) => void;
+    onSelect?: (selectedKeys: string[], e: SelectData) => void;
+    filterTreeNode?: (node: TreeNode) => boolean;
+    loadData?: (node: TreeNode) => Promise<any>;
+    draggable?: boolean;
+}
+
+export default class Tree extends Component<TreeProps, {}> { }

rc-tree/rc-tree-tests.tsx

@@ -0,0 +1,92 @@
+import * as React from 'react';
+import Tree, { TreeNode, SelectData, CheckData } from 'rc-tree';
+
+
+interface Props {
+    keys: string[];
+}
+
+interface State {
+    defaultExpandedKeys: string[];
+    defaultSelectedKeys: string[];
+    defaultCheckedKeys: string[];
+    switchIt: boolean;
+}
+
+export class Demo extends React.Component<Props, State> {
+    constructor(props: Props) {
+        super(props);
+
+        const keys = this.props.keys;
+        this.state = {
+            defaultExpandedKeys: keys,
+            defaultSelectedKeys: keys,
+            defaultCheckedKeys: keys,
+            switchIt: true,
+        };
+    }
+
+    public static defaultProps: Props = {
+        keys: ['0-0-0-0'],
+    };
+
+
+    getInitialState() {
+    }
+
+    onExpand(expandedKeys: string[]) {
+        console.log('onExpand', expandedKeys, arguments);
+    }
+
+    onSelect(selectedKeys: string[], info: SelectData) {
+        console.log('selected', selectedKeys, info);
+    }
+
+    onCheck(checkedKeys: string[], info: CheckData) {
+        console.log('onCheck', checkedKeys, info);
+    }
+
+    onEdit() {
+        setTimeout(() => {
+            console.log('current key: ');
+        }, 0);
+    }
+
+    onDel(e: React.MouseEvent<HTMLSpanElement>) {
+        if (!window.confirm('sure to delete?')) {
+            return;
+        }
+        e.stopPropagation();
+    }
+
+    render() {
+        const customLabel = (<span className="cus-label">
+            <span>operations: </span>
+            <span style={{ color: 'blue' }} onClick={this.onEdit}>Edit</span>&nbsp;
+      <label onClick={(e) => e.stopPropagation()}><input type="checkbox" /> checked</label> &nbsp;
+      <span style={{ color: 'red' }} onClick={e => this.onDel(e)}>Delete</span>
+        </span>);
+        return (<div style={{ margin: '0 20px' }}>
+            <h2>simple</h2>
+            <Tree
+                className="myCls" showLine checkable defaultExpandAll
+                defaultExpandedKeys={this.state.defaultExpandedKeys}
+                onExpand={this.onExpand}
+                defaultSelectedKeys={this.state.defaultSelectedKeys}
+                defaultCheckedKeys={this.state.defaultCheckedKeys}
+                onSelect={this.onSelect} onCheck={this.onCheck}
+            >
+                <TreeNode title="parent 1" key="0-0">
+                    <TreeNode title={customLabel} key="0-0-0">
+                        <TreeNode title="leaf" key="0-0-0-0" />
+                        <TreeNode title="leaf" key="0-0-0-1" />
+                    </TreeNode>
+                    <TreeNode title="parent 1-1" key="0-0-1">
+                        <TreeNode title="parent 1-1-0" key="0-0-1-0" disableCheckbox />
+                        <TreeNode title="parent 1-1-1" key="0-0-1-1" />
+                    </TreeNode>
+                </TreeNode>
+            </Tree>
+        </div>);
+    }
+}

rc-tree/tsconfig.json

@@ -0,0 +1,26 @@
+{
+    "compilerOptions": {
+        "module": "commonjs",
+        "lib": [
+            "es6",
+            "dom"
+        ],
+        "noImplicitAny": true,
+        "noImplicitThis": true,
+        "noUnusedParameters": true,
+        "noUnusedLocals": true,
+        "strictNullChecks": true,
+        "baseUrl": "../",
+        "jsx": "react",
+        "typeRoots": [
+            "../"
+        ],
+        "types": [],
+        "noEmit": true,
+        "forceConsistentCasingInFileNames": true
+    },
+    "files": [
+        "index.d.ts",
+        "rc-tree-tests.tsx"
+    ]
+}

rc-tree/tslint.json

@@ -0,0 +1 @@
+{ "extends": "../tslint.json" }