Sha256: ea16e3e2e1ef831c4c56adce1e561e5d1e6c975a06298b445cbec6d318892160

Contents?: true

Size: 1.29 KB

Versions: 644

Compression:

Stored size: 1.29 KB

Contents

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

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

import Body from '../pb_body/_body'
import Title from '../pb_title/_title'

type DateYearStackedProps = {
  align?: "left" | "center" | "right",
  className?: string | string[],
  dark?: boolean,
  data?: string,
  date: Date,
  htmlOptions?: {[key: string]: string | number | boolean | (() => void)},
  id?: string,
}

const DateYearStacked = (props: DateYearStackedProps): React.ReactElement => {
  const { 
    align = 'left', 
    className, 
    dark = false, 
    date, 
    data={},
    htmlOptions = {}, 
  } = props
  const css = classnames(
    buildCss('pb_date_year_stacked', align),
    globalProps(props),
    className
  )
   const dataProps = buildDataProps(data)
   const htmlProps = buildHtmlProps(htmlOptions)

  return (
    <div 
        {...dataProps}
        {...htmlProps}
        className={css}
    >
      <Title
          dark={dark}
          size={4}
          text={`${DateTime.toDay(date)} ${DateTime.toMonth(date).toUpperCase()}`}
      />
      <Body color="light">{DateTime.toYear(date)}</Body>
    </div>
  )
}

export default DateYearStacked

Version data entries

644 entries across 644 versions & 1 rubygems

Version Path
playbook_ui-13.16.0.pre.alpha.PBNTR177NewAdvancedTableKit2035 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.tsx
playbook_ui-13.16.0.pre.alpha.PBNTR177NewAdvancedTableKit2034 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.tsx
playbook_ui-13.16.0.pre.alpha.PBNTR177NewAdvancedTableKit2023 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.tsx
playbook_ui-13.16.0.pre.alpha.PBNTR177NewAdvancedTableKit2010 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.tsx
playbook_ui-13.16.0.pre.alpha.PLAY11642006 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.tsx
playbook_ui-13.16.0.pre.alpha.play1141iconkitusinglibrary1995 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.tsx
playbook_ui-13.16.0.pre.alpha.play1141iconkitusinglibrary1993 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.tsx
playbook_ui-13.16.0.pre.alpha.PLAY11641992 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.tsx
playbook_ui-13.16.0.pre.alpha.PLAY11641991 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.tsx
playbook_ui-13.16.0.pre.alpha.fonttest1972 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.tsx
playbook_ui-13.15.0.pre.alpha.play1141iconkitusinglibrary1956 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.tsx
playbook_ui-13.16.0 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.tsx
playbook_ui-13.15.0.pre.alpha.play10841940 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.tsx
playbook_ui-13.15.0.pre.alpha.1132globalpropdatepickerspacing1929 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.tsx
playbook_ui-13.15.0.pre.alpha.PLAY10851907 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.tsx
playbook_ui-13.15.0.pre.alpha.PLAY11311893 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.tsx
playbook_ui-13.15.0.pre.alpha.reactselectbump581876 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.tsx
playbook_ui-13.15.0.pre.alpha.PLAY10831873 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.tsx
playbook_ui-13.14.0.pre.alpha.play1101betaicons1825 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.tsx
playbook_ui-13.14.0.pre.alpha.play1101betaicons1798 app/pb_kits/playbook/pb_date_year_stacked/_date_year_stacked.tsx