import React from "react";
import moment from "moment";
import { AccessorBox, HeaderSvg, IconSpacer } from "./styled";
import { getShortHandTimeAlias, MINUTE } from "./utils";
// @ts-ignore
import ArrowSvg from "./assets/arrow.svg";
// @ts-ignore
import CalendarSvg from "./assets/calendar.svg";
const Arrow = () => (React.createElement(HeaderSvg, null,
    React.createElement("use", { xlinkHref: `#${ArrowSvg.id}` })));
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))));
    }
    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),
        startAlias,
        "\u00A0",
        React.createElement(Arrow, null),
        "\u00A0",
        endAlias));
};
//# sourceMappingURL=accessor-element.js.map