Sha256: ddaacb95f1bbba17e5582d35ef6a81f02dbcadd91c15ce8ab2ddd9ba6e8388f5

Contents?: true

Size: 1.6 KB

Versions: 56

Compression:

Stored size: 1.6 KB

Contents

/* @flow */

import React from 'react'
import classnames from 'classnames'

import DateTime from '../pb_kit/dateTime'
import { buildCss, buildDataProps } from '../utilities/props'
import { deprecatedProps, globalProps } from '../utilities/globalProps'

import Body from '../pb_body/_body'
import Caption from '../pb_caption/_caption'

type TimeStackedProps = {
  align?: 'left' | 'center' | 'right',
  className?: string | array<string>,
  dark?: boolean,
  data?: object,
  date?: string,
  id?: string,
  time: number | Date,
  timeZone?: string,
}

const TimeStackedDefault = (props: TimeStackedProps) => {
  if (props.date) deprecatedProps('Time Stacked', ['date']) //date prop is deprecated, use time instead

  const {
    align = 'left',
    className,
    dark,
    data = {},
    date,
    time,
    timeZone,
  } = props

  const classes = classnames(
    buildCss('pb_time_stacked_kit', align),
    globalProps(props),
    className
  )
  const dataProps = buildDataProps(data)

  const dateTimestamp = new DateTime({ value: date ? date : new Date(time), zone: timeZone })

  return (
    <div
        className={classes}
        {...dataProps}
    >
      <Body
          className={classnames('pb_time_stacked', 'time-spacing')}
          color="light"
          dark={dark}
      >
        <time>
          {dateTimestamp.toTimeWithMeridian()}
          <Caption
              className="pb_time_stacked"
              color="light"
              dark={dark}
              tag="span"
              text={dateTimestamp.toTimezone()}
          />
        </time>
      </Body>
    </div>
  )
}

export default TimeStackedDefault

Version data entries

56 entries across 56 versions & 1 rubygems

Version Path
playbook_ui-12.1.0 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-12.0.0 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-11.20.0.pre.alpha.passthrough1 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-11.20.0.pre.alpha.railsdialog1 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-11.20.0.pre.alpha.focus1 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-11.20.0 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-11.19.0.pre.alpha.map1 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-11.19.0.pre.alpha.pagpassthrough1 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-11.19.0 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-11.18.0.pre.alpha.pagutility1 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-11.19.0.pre.typeahead1 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-11.18.0 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-11.17.0 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-11.15.0.pre.alpha.dependencies1 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-11.16.0.pre.alpha.paginationrails1 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-11.16.0 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-11.16.0.pre.alpha.reactupgrade1 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-11.15.0.pre.alpha.table1 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-11.16.0.pre.alpha.pagination.rails1 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-11.15.0 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx