xl-react-infinite-tree/lib/renderer.js

The infinite-tree library for React.

'use strict';

Object.defineProperty(exports, "__esModule", {
    value: true
});
exports.defaultRowRenderer = undefined;

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _classnames = require('classnames');

var _classnames2 = _interopRequireDefault(_classnames);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

/* eslint react/jsx-indent: 0 */
var defaultRowRenderer = function defaultRowRenderer(node, treeOptions) {
    var id = node.id,
        name = node.name,
        _node$loadOnDemand = node.loadOnDemand,
        loadOnDemand = _node$loadOnDemand === undefined ? false : _node$loadOnDemand,
        children = node.children,
        state = node.state;

    var droppable = treeOptions.droppable;
    var depth = state.depth,
        open = state.open,
        path = state.path,
        total = state.total,
        _state$selected = state.selected,
        selected = _state$selected === undefined ? false : _state$selected;

    var childrenLength = Object.keys(children).length;
    var more = node.hasChildren();

    return _react2.default.createElement(
        'div',
        {
            className: (0, _classnames2.default)('infinite-tree-item', { 'infinite-tree-selected': selected }),
            'data-id': id,
            'data-expanded': more && open,
            'data-depth': depth,
            'data-path': path,
            'data-selected': selected,
            'data-children': childrenLength,
            'data-total': total,
            droppable: droppable
        },
        _react2.default.createElement(
            'div',
            {
                className: 'infinite-tree-node',
                style: { marginLeft: depth * 18 }
            },
            !more && loadOnDemand && _react2.default.createElement(
                'a',
                { className: (0, _classnames2.default)(treeOptions.togglerClass, 'infinite-tree-closed') },
                '\u25BA'
            ),
            more && open && _react2.default.createElement(
                'a',
                { className: (0, _classnames2.default)(treeOptions.togglerClass) },
                '\u25BC'
            ),
            more && !open && _react2.default.createElement(
                'a',
                { className: (0, _classnames2.default)(treeOptions.togglerClass, 'infinite-tree-closed') },
                '\u25BA'
            ),
            _react2.default.createElement(
                'span',
                { className: 'infinite-tree-title' },
                name
            )
        )
    );
};

exports.defaultRowRenderer = defaultRowRenderer;