UNPKG

@intility/bifrost-react

Version:

React library for Intility's design system, Bifrost.

60 lines (59 loc) 1.79 kB
"use client"; import { jsx as _jsx } from "react/jsx-runtime"; import Tooltip from "../Tooltip/Tooltip.js"; import useDateTimeFormatter from "../../hooks/useDateTimeFormatter.js"; const tooltipTimeOptions = { hour: "2-digit", minute: "2-digit", timeZoneName: "short" }; const tooltipDateOptions = { day: "2-digit", month: "long", year: "numeric" }; const fullToolTipOptions = { ...tooltipDateOptions, ...tooltipTimeOptions }; /** Format date and/or time based on current Bifrost locale */ const FormatDate = ({ date, show = "date", options, locale, fullTooltip = false, noTooltip = false })=>{ const dateTimeFormatter = useDateTimeFormatter(); // toLocaleTimeString will display date as well when passed date-specific options const displayString = dateTimeFormatter({ date, show, locale, options }); if (noTooltip) { return /*#__PURE__*/ _jsx("span", { suppressHydrationWarning: true, children: displayString }); } let tooltipOptions; if (fullTooltip || show === "datetime") { tooltipOptions = fullToolTipOptions; } else if (show === "time") { tooltipOptions = tooltipTimeOptions; } else { tooltipOptions = tooltipDateOptions; } const tooltipString = dateTimeFormatter({ date, show, locale, options: tooltipOptions }); return /*#__PURE__*/ _jsx(Tooltip, { content: /*#__PURE__*/ _jsx("span", { suppressHydrationWarning: true, children: tooltipString }), children: /*#__PURE__*/ _jsx("span", { suppressHydrationWarning: true, children: displayString }) }); }; export default FormatDate;