import React from "react";
import moment from "moment";
import { AccessorBox, HeaderSvg, IconSpacer, StartEndContainer, ArrowsIcon, } from "./styled";
import { getShortHandTimeAlias, MINUTE } from "./utils";
// @ts-ignore
import CalendarSvg from "./assets/calendar.svg";
const Calendar = () => (React.createElement(IconSpacer, null,
    React.createElement(HeaderSvg, null,
        React.createElement("use", { xlinkHref: `#${CalendarSvg.id}` }))));
export const PickerAccessorElement = (props) => {
    const { onClick, start = 15 * MINUTE, end } = props;
    if (start < 0) {
        return (React.createElement(AccessorBox, { onClick: onClick },
            React.createElement(Calendar, null),
            React.createElement(React.Fragment, null, getShortHandTimeAlias(-start)),
            React.createElement(ArrowsIcon, { name: "arrows_vertical" })));
    }
    const startAlias = moment(start).format("DD/MM/YYYY HH:mm");
    const endAlias = moment(end).format("DD/MM/YYYY HH:mm");
    return (React.createElement(AccessorBox, { onClick: onClick },
        React.createElement(Calendar, null),
        React.createElement(StartEndContainer, null,
            React.createElement("div", null, startAlias),
            React.createElement("div", null, endAlias)),
        React.createElement(ArrowsIcon, { name: "arrows_vertical" })));
};
//# sourceMappingURL=accessor-element.js.map