import * as React from 'react';
import { TreeDataSource, TreeGrid, } from '../../InfiniteTable';
import { Flex } from 'rebass';
import join from '../../utils/join';
const columns = {
    label: {
        field: 'label',
        header: 'Label',
        defaultFlex: 1,
        renderTreeIcon: true,
        renderSelectionCheckBox: true,
        defaultSortable: false,
    },
};
const domProps = {
    style: {
        height: '100%',
        flex: 1,
    },
    className: 'ab-TreeList',
};
const DEFAULT_TREE_EXPAND_STATE = {
    expandedPaths: [],
    defaultExpanded: false,
};
export function TreeList(props) {
    return (React.createElement(Flex, { flex: 1, flexDirection: 'column', className: "ab-TreeList", style: props.style },
        React.createElement(TreeDataSource, { data: props.options, primaryKey: props.primaryKey ?? 'id', defaultTreeSelection: props.defaultTreeSelection, treeSelection: props.treeSelection, onTreeSelectionChange: props.onTreeSelectionChange, treeFilterFunction: props.treeFilterFunction, onTreeExpandStateChange: props.onTreeExpandStateChange, defaultTreeExpandState: props.defaultTreeExpandState ?? DEFAULT_TREE_EXPAND_STATE },
            React.createElement(TreeGrid, { defaultActiveRowIndex: 0, onReady: props.onReady, debugId: props.debugId, keyboardSelection: true, rowHeight: props.rowHeight ?? '--ab-grid-row-height', keyboardNavigation: "row", columnHeaderHeight: props.columnHeaderHeight, domProps: {
                    ...domProps,
                    ...props.domProps,
                    className: join(domProps.className, props.domProps?.className),
                    style: { ...domProps.style, ...props.domProps?.style },
                }, columns: props.columns ?? columns, showZebraRows: false }))));
}
