import React from "react";
import { Flex, TextSmall, Icon } from "@netdata/netdata-ui";
import { useDateTime } from "../../../utils/date-time";
const DateBox = ({ isPlaying, startDate, endDate, isSameDate }) => {
    const { localeTimeString, localeDateString } = useDateTime();
    return (React.createElement(Flex, { gap: 2 },
        React.createElement(TextSmall, { color: "text", whiteSpace: "nowrap" },
            localeDateString(startDate, { long: false }),
            " \u2022",
            " ",
            React.createElement(TextSmall, { color: isPlaying ? "accent" : "textFocus", whiteSpace: "nowrap" }, localeTimeString(startDate, { secs: false }))),
        React.createElement(Icon, { name: "arrow_left", color: isPlaying ? "accent" : "textFocus", size: "small", rotate: 2 }),
        React.createElement(TextSmall, { color: "text", whiteSpace: "nowrap" },
            !isSameDate && `${localeDateString(endDate, { long: false })} • `,
            React.createElement(TextSmall, { color: isPlaying ? "accent" : "textFocus", whiteSpace: "nowrap" }, localeTimeString(endDate, { secs: false })))));
};
export default DateBox;
//# sourceMappingURL=dateBox.js.map