Sha256: 6678eae8dbcf00c543aab837e0daa173572349a7ba8e1a284e62162bb1b2aa51

Contents?: true

Size: 1.6 KB

Versions: 233

Compression:

Stored size: 1.6 KB

Contents

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

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

import Body from '../pb_body/_body'
import Flex from '../pb_flex/_flex'
import FlexItem from '../pb_flex/_flex_item'
import DateYearStacked from '../pb_date_year_stacked/_date_year_stacked'
import Icon from '../pb_icon/_icon'

type DateRangeStackedProps = {
  className?: string | string[],
  data?: string,
  dark?: boolean,
  endDate: string,
  id?: string,
  startDate: string,
}

const DateRangeStacked = (props: DateRangeStackedProps) => {
  const { className, dark = false, endDate, startDate, data={} } = props
  const css = classnames(
    buildCss('pb_date_range_stacked'),
    globalProps(props),
    className
  )
  const dataProps = buildDataProps(data)

  return (
    <div {...dataProps} className={css}>
      <Flex vertical="center">
        <FlexItem>
          <DateYearStacked
              align="right"
              dark={dark}
              date={startDate}
          />
        </FlexItem>
        <FlexItem>
          <div>
            <Body
                color="light"
                tag="span"
            >
              <Icon
                  className="pb_date_range_stacked_arrow"
                  fixedWidth
                  icon="long-arrow-right"
              />
            </Body>
          </div>
        </FlexItem>
        <FlexItem>
          <DateYearStacked
              dark={dark}
              date={endDate}
          />
        </FlexItem>
      </Flex>
    </div>
  )
}

export default DateRangeStacked

Version data entries

233 entries across 233 versions & 1 rubygems

Version Path
playbook_ui-12.37.0.pre.alpha.svgiconmethods1064 app/pb_kits/playbook/pb_date_range_stacked/_date_range_stacked.tsx
playbook_ui-12.37.0.pre.alpha.PLAY951collapsiblenav31062 app/pb_kits/playbook/pb_date_range_stacked/_date_range_stacked.tsx
playbook_ui-12.37.0 app/pb_kits/playbook/pb_date_range_stacked/_date_range_stacked.tsx
playbook_ui-12.36.0.pre.alpha.svgiconmethods1059 app/pb_kits/playbook/pb_date_range_stacked/_date_range_stacked.tsx
playbook_ui-12.36.0.pre.alpha.svgiconmethods1043 app/pb_kits/playbook/pb_date_range_stacked/_date_range_stacked.tsx
playbook_ui-12.36.0.pre.alpha.PLAY942collapsiblenav21035 app/pb_kits/playbook/pb_date_range_stacked/_date_range_stacked.tsx
playbook_ui-12.36.0 app/pb_kits/playbook/pb_date_range_stacked/_date_range_stacked.tsx
playbook_ui-12.35.0.pre.alpha.iconpocwebfonts1023 app/pb_kits/playbook/pb_date_range_stacked/_date_range_stacked.tsx
playbook_ui-12.35.0 app/pb_kits/playbook/pb_date_range_stacked/_date_range_stacked.tsx
playbook_ui-12.34.0.pre.alpha.fixdialogcloseevents1004 app/pb_kits/playbook/pb_date_range_stacked/_date_range_stacked.tsx
playbook_ui-12.34.0.pre.alpha.fixdialogcloseevents1003 app/pb_kits/playbook/pb_date_range_stacked/_date_range_stacked.tsx
playbook_ui-12.34.0.pre.alpha.play716popoverkitcloseonclickissue998 app/pb_kits/playbook/pb_date_range_stacked/_date_range_stacked.tsx
playbook_ui-12.34.0 app/pb_kits/playbook/pb_date_range_stacked/_date_range_stacked.tsx
playbook_ui-12.33.1.pre.alpha.PLAY933navkitcollapsible994 app/pb_kits/playbook/pb_date_range_stacked/_date_range_stacked.tsx
playbook_ui-12.33.1 app/pb_kits/playbook/pb_date_range_stacked/_date_range_stacked.tsx
playbook_ui-12.32.0 app/pb_kits/playbook/pb_date_range_stacked/_date_range_stacked.tsx
playbook_ui-12.31.0.pre.alpha.hoverrails951 app/pb_kits/playbook/pb_date_range_stacked/_date_range_stacked.tsx
playbook_ui-12.31.0.pre.alpha.hoverrails948 app/pb_kits/playbook/pb_date_range_stacked/_date_range_stacked.tsx
playbook_ui-12.31.0.pre.alpha.multilevelnopillsdesigns944 app/pb_kits/playbook/pb_date_range_stacked/_date_range_stacked.tsx
playbook_ui-12.31.0.pre.alpha.multilevelnopillsdesigns941 app/pb_kits/playbook/pb_date_range_stacked/_date_range_stacked.tsx