Sha256: 50cccc3511d4c7c03c491a0ab299b5291306d378ed405321254dee9f8723a37d

Contents?: true

Size: 1.27 KB

Versions: 44

Compression:

Stored size: 1.27 KB

Contents

/* @flow */

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

import DateTime from '../pb_kit/dateTime.js'
import { buildCss } from '../utilities/props'
import { Body, Caption } from '../'
import { spacing } from '../utilities/spacing.js'

const Components = {
  body: Body,
  caption: Caption,
}

type TimeStackedProps = {
  className?: String | Array<String>,
  dark?: Boolean,
  data?: String,
  date: String,
  id?: String,
  align?: "left" | "center" | "right",
  tag?: "body" | "caption",
}

const TimeStacked = (props: TimeStackedProps) => {
  const { className, dark = false, date, tag = 'body' } = props
  const classes = classnames(
    className,
    buildCss('pb_time_stacked_kit', {
      dark: dark,
    }),
    spacing(props)
  )

  const tagClasses = classnames(buildCss('pb_time_stacked_kit', tag))

  const dateTimestamp = new DateTime({ value: date })

  const Tag = Components[tag]

  return (
    <div className={classes}>
      <div className="pb_time_stacked_day_month">
        <Tag
            className={tagClasses}
            color="light"
            text={dateTimestamp.toTimeWithMeridian()}
        />
        <Tag
            color="light"
            text={dateTimestamp.toTimezone()}
        />
      </div>
    </div>
  )
}

export default TimeStacked

Version data entries

44 entries across 44 versions & 1 rubygems

Version Path
playbook_ui-6.0.1.pre.alpha5 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-6.0.1.pre.alpha4 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-6.0.1.pre.alpha3 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-6.0.1.pre.alpha2 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-5.2.0.pre.alpha15 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-5.2.0.pre.alpha14 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-5.2.0.pre.alpha13 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-6.0.1 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-5.2.0.pre.alpha12 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-6.0.0 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-5.2.0.pre.alpha11 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-5.5.1.pre.alpha4 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-5.5.1.pre.alpha3 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-5.5.1.pre.alpha2 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-5.5.1.pre.alpha1 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-5.2.0.pre.alpha10 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-5.5.1 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-5.5.0 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-5.5.0.pre.alpha1 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx
playbook_ui-5.2.0.pre.alpha9 app/pb_kits/playbook/pb_time_stacked/_time_stacked.jsx