import { classNames } from '../misc';

import { KendoComponent } from '../_types/component';
import { TIMELINE_FOLDER_NAME, TIMELINE_MODULE_NAME } from './constants';
export const TIMELINETRACK_CLASSNAME = `k-timeline-track`;

export const TimelineTrack: KendoComponent<React.HTMLAttributes<HTMLDivElement>> = (
    props: React.HTMLAttributes<HTMLDivElement>
) => {
    const {
        ...other
    } = props;

    return (

        <div
            {...other}
            className={classNames(
                props.className,
                TIMELINETRACK_CLASSNAME
            )}>
            <ul className="k-timeline-scrollable-wrap" role="tablist">
                {props.children}
            </ul>
        </div>
    );
};

TimelineTrack.className = TIMELINETRACK_CLASSNAME;
TimelineTrack.moduleName = TIMELINE_MODULE_NAME;
TimelineTrack.folderName = TIMELINE_FOLDER_NAME;

export default TimelineTrack;