/* @flow */ import React from 'react' import classnames from 'classnames' import { Body, Caption, Icon } from '../' import DateTime from '../pb_kit/dateTime.js' import { spacing } from '../utilities/spacing.js' type TimeRangeInlineProps = { className?: String, id?: String, data?: String, alignment?: "left" | "center" | "vertical", size?: "sm" | "xs", dark?: Boolean, icon?: Boolean, timezone?: Boolean, startTime: String, endTime: String, } const timezoneString = (dateValue) => { const date = new DateTime({ value: dateValue }) return `${date.convertToTimezone()}` } const dateTimestamp = (dateValue) => { const date = new DateTime({ value: dateValue }) return `${date.toHour()}:${date.toMinute()}${date.toMeridian()}` } const dateTimeIso = (dateValue) => { const date = new DateTime({ value: dateValue }) return date.toIso() } const TimeRangeInline = (props: TimeRangeInlineProps) => { const { className, alignment = 'left', size = 'sm', dark = false, icon = false, timezone = false, startTime, endTime, } = props const separator = ( ) const iconContent = () => { return ( ) } return (

{iconContent()} {` ${dateTimestamp( startTime )} `} {separator} {` ${dateTimestamp( endTime )} `} {timezoneString(endTime)} {iconContent()} {` ${dateTimestamp( startTime )} `} {separator} {` ${dateTimestamp( endTime )} `} {timezoneString(endTime)}

) } export default TimeRangeInline