Sha256: 30283bd4ce106d895e2b7cf82294a5db0dff322b11177a3560b92b5eb6c5649c

Contents?: true

Size: 1.58 KB

Versions: 644

Compression:

Stored size: 1.58 KB

Contents

import React from 'react'

import { buildCss, buildHtmlProps } from '../utilities/props'
import { deprecatedProps, globalProps } from '../utilities/globalProps'

import Flex from '../pb_flex/_flex'
import FlexItem from '../pb_flex/_flex_item'
import SectionSeparator from '../pb_section_separator/_section_separator'
import TimeStacked from '../pb_time_stacked/_time_stacked'
import DateStacked from '../pb_date_stacked/_date_stacked'

type DateTimeStackedProps = {
  htmlOptions?: {[key: string]: string | number | boolean | (() => void)},
  id?: string,
  date: Date,
  datetime: Date,
  dark: boolean,
  timeZone?: string,
}

const DateTimeStacked = (props: DateTimeStackedProps): React.ReactElement => {
  if (props.date) deprecatedProps()

  const {
    date,
    datetime,
    dark,
    htmlOptions = {},
    timeZone = 'America/New_York',
  } = props

  const classes = buildCss('pb_date_time_stacked_kit', globalProps(props))
  const htmlProps = buildHtmlProps(htmlOptions)

  return (
    <Flex
        inline={false}
        vertical="stretch"
        {...htmlProps}
        {...props}
    >
      <FlexItem>
        <DateStacked
            align="right"
            bold
            dark={dark}
            date={date || datetime}
        />
      </FlexItem>

      <SectionSeparator
          className="date-time-padding"
          orientation="vertical"
      />
      <FlexItem>
        <TimeStacked
            className={classes}
            dark={dark}
            date={date || datetime}
            timeZone={timeZone}
        />
      </FlexItem>
    </Flex>
  )
}

export default DateTimeStacked

Version data entries

644 entries across 644 versions & 1 rubygems

Version Path
playbook_ui-14.11.1.pre.alpha.PLAY17445539 app/pb_kits/playbook/pb_date_time_stacked/_date_time_stacked.tsx
playbook_ui-14.11.1.pre.alpha.PBNTR798datepickerturbo5537 app/pb_kits/playbook/pb_date_time_stacked/_date_time_stacked.tsx
playbook_ui-14.11.1.pre.alpha.pbntr703collapsiblerowsrails5536 app/pb_kits/playbook/pb_date_time_stacked/_date_time_stacked.tsx
playbook_ui-14.11.1.pre.alpha.PLAY1751pbcontenttagpt25529 app/pb_kits/playbook/pb_date_time_stacked/_date_time_stacked.tsx
playbook_ui-14.11.1.pre.alpha.PBNTR7495495 app/pb_kits/playbook/pb_date_time_stacked/_date_time_stacked.tsx
playbook_ui-14.12.0.pre.rc.11 app/pb_kits/playbook/pb_date_time_stacked/_date_time_stacked.tsx
playbook_ui-14.12.0.pre.rc.10 app/pb_kits/playbook/pb_date_time_stacked/_date_time_stacked.tsx
playbook_ui-14.12.0.pre.rc.9 app/pb_kits/playbook/pb_date_time_stacked/_date_time_stacked.tsx
playbook_ui-14.12.0.pre.rc.8 app/pb_kits/playbook/pb_date_time_stacked/_date_time_stacked.tsx
playbook_ui-14.12.0.pre.rc.7 app/pb_kits/playbook/pb_date_time_stacked/_date_time_stacked.tsx
playbook_ui-14.11.1.pre.alpha.play1724darkmodeauditmap5437 app/pb_kits/playbook/pb_date_time_stacked/_date_time_stacked.tsx
playbook_ui-14.11.1.pre.alpha.PBNTR719listdraggablesimple5432 app/pb_kits/playbook/pb_date_time_stacked/_date_time_stacked.tsx
playbook_ui-14.11.1.pre.alpha.PBNTR768stickyrightcolumn5431 app/pb_kits/playbook/pb_date_time_stacked/_date_time_stacked.tsx
playbook_ui-14.12.0.pre.rc.6 app/pb_kits/playbook/pb_date_time_stacked/_date_time_stacked.tsx
playbook_ui-14.11.1.pre.alpha.PBNTR718simiplifieddraggablereact5415 app/pb_kits/playbook/pb_date_time_stacked/_date_time_stacked.tsx
playbook_ui-14.11.1.pre.alpha.play1724darkmodeauditmap5413 app/pb_kits/playbook/pb_date_time_stacked/_date_time_stacked.tsx
playbook_ui-14.12.0.pre.rc.5 app/pb_kits/playbook/pb_date_time_stacked/_date_time_stacked.tsx
playbook_ui-14.11.1.pre.alpha.play1724darkmodeauditmap5409 app/pb_kits/playbook/pb_date_time_stacked/_date_time_stacked.tsx
playbook_ui-14.11.1.pre.alpha.PBNTR718simiplifieddraggablereact5400 app/pb_kits/playbook/pb_date_time_stacked/_date_time_stacked.tsx
playbook_ui-14.11.1.pre.alpha.PBNTR718simiplifieddraggablereact5392 app/pb_kits/playbook/pb_date_time_stacked/_date_time_stacked.tsx