Sha256: 68a4bff79228de3e88bfd8af3f092e1d3ec6ad0d0c1e087fdebb11d708930060
Contents?: true
Size: 1.46 KB
Versions: 7
Compression:
Stored size: 1.46 KB
Contents
/* @flow */
import React from 'react'
import DateTime from '../pb_kit/dateTime.js'
import { Body, Icon } from '../'
import classnames from 'classnames'
import { globalProps } from '../utilities/globalProps.js'
type DateRangeInlineProps = {
className?: String,
data?: String,
endDate?: Date,
id?: String,
startDate?: Date,
}
const dateTimestamp = (dateValue) => {
const date = new DateTime({ value: dateValue })
return `${date.toDay()} ${date.toMonth()} ${date.toYear()}`
}
const dateTimeIso = (dateValue) => {
const date = new DateTime({ value: dateValue })
return date.toIso()
}
const DateRangeInline = (props: DateRangeInlineProps) => {
const { endDate, startDate } = props
return (
<div className={classnames('pb_date_range_inline', globalProps(props))}>
<Body
color="light"
tag="span"
>
<Icon
fixedWidth
icon="calendar-alt"
/>
</Body>
<Body tag="span">
<time dateTime={dateTimeIso(startDate)}>
{` ${dateTimestamp(
startDate
)} `}
</time>
</Body>
<Body
color="light"
tag="span"
>
<Icon
fixedWidth
icon="long-arrow-right"
/>
</Body>
<Body tag="span">
<time dateTime={dateTimeIso(endDate)}>
{` ${dateTimestamp(
endDate
)} `}
</time>
</Body>
</div>
)
}
export default DateRangeInline
Version data entries
7 entries across 7 versions & 1 rubygems