glass-app-manager/target/.yalc/@informatica/droplets-core/src/components/tree/Tree.js

Informatica's Glass Framework CLI for bootstrapping

// @flow

import * as React from "react";
import classNames from "classnames";

import hoist from "hoist-non-react-statics";

import { default as RCTree, TreeNode as RCTreeNode } from "rc-tree";

export type TreeProps = {
    /**
     * Children of the tree.
     */
    children: React.Node,

    /**
     * Whether the tree should show checkboxes
     */
    checkable: boolean,

    /**
     * Set to true to show icons next to the TreeNodes
     */
    showIcons: boolean,

    /**
     * Callback to execute when the TreeNode is expanded.
     */
    onExpand: () => void,

    /**
     * Callback to execute when the TreeNode is selected.
     */
    onSelect: () => void,

    /**
     * Callback to execute when the TreeNode is checked.
     */
    onCheck: () => void,

    /**
     * Additional class selectors to pass to component.
     */
    className?: string,
};

export type TreeNodeProps = {
    /**
     * Children of the TreeNode.
     */
    children?: React.Node,

    /**
     * Determines if this treeNode is a leaf node
     */
    isLeaf: boolean,

    /**
     * Determines if this treeNode is a root node
     */
    isRoot: boolean,
};

function Tree(props: TreeProps) {
    const { children, className, showIcons, onExpand, onSelect, onCheck, ...rest } = props;
    const classes = classNames("tree", className);

    return (
        <RCTree
            className={classes}
            showIcon={showIcons}
            onExpand={onExpand}
            onSelect={onSelect}
            onCheck={onCheck}
            {...props}>
            {children}
        </RCTree>
    );
}

Tree.defaultProps = {
    checkable: false,
    showIcons: false,
    onExpand: expandedKeys => {},
    onSelect: (selectedKeys, info) => {},
    onCheck: (checkedKeys, info) => {},
};

TreeNode.displayName = "Tree";

function TreeNode(props: TreeNodeProps) {
    const { children, className, ...rest } = props;
    const classes = classNames("tree__node", className);

    const switcherIcon = (props: TreeNodeProps) => {
        const { expanded, isLeaf } = props;

        if (isLeaf) {
            return null;
        }

        const classes = classNames("tree__node__switcher", { "tree__node__switcher--collapsed": !expanded });

        return <span className={classes} />;
    };

    const icon = (props: TreeNodeProps) => {
        const { isLeaf, isRoot } = props;
        const classes = classNames("tree__node__icon", iconClass);

        let iconClass = "tree__node__icon--parent";

        if (isRoot) {
            iconClass = "tree__node__icon--root";
        } else if (isLeaf) {
            iconClass = "tree__node__icon--leaf";
        }

        return <span className={classes} />;
    };

    return (
        <RCTreeNode className={classes} switcherIcon={switcherIcon} icon={icon} {...props}>
            {children}
        </RCTreeNode>
    );
}

hoist(TreeNode, RCTreeNode);

TreeNode.defaultProps = {
    isLeaf: false,
    isRoot: false,
};

TreeNode.displayName = "Tree.TreeNode";

Tree.TreeNode = TreeNode;

export default Tree;