Sha256: 088ccaafd3e30b27153c58b4da9cf77c251f31572d05e3994ec48025078a048c

Contents?: true

Size: 1.29 KB

Versions: 179

Compression:

Stored size: 1.29 KB

Contents

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

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

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

type TitleDetailProps = {
  align?: "left" | "center" | "right",
  aria?: { [key: string]: string },
  className?: string,
  data?: { [key: string]: string },
  detail: string,
  htmlOptions?: {[key: string]: string | number | boolean | (() => void)},
  id?: string,
  title: string,
} & GlobalProps

const TitleDetail = (props: TitleDetailProps) => {
  const {
    align = "left",
    aria = {},
    className,
    data = {},
    detail,
    htmlOptions = {},
    id,
    title,
  } = props
  
  const ariaProps = buildAriaProps(aria)
  const dataProps = buildDataProps(data)
  const htmlProps = buildHtmlProps(htmlOptions)
  const pbCss = buildCss("pb_title_detail_kit", align)

  return (
    <div
      {...ariaProps}
      {...dataProps}
      {...htmlProps}
      className={classnames(pbCss, globalProps(props), className)}
      id={id}
    >
      <Title
        size={4}
        text={title}
      />
      <Body
        color="light"
        text={detail}
      />
    </div>
  )
}

export default TitleDetail

Version data entries

179 entries across 179 versions & 1 rubygems

Version Path
playbook_ui-13.16.0.pre.alpha.play1141iconkitusinglibrary1995 app/pb_kits/playbook/pb_title_detail/_title_detail.tsx
playbook_ui-13.16.0.pre.alpha.play1141iconkitusinglibrary1993 app/pb_kits/playbook/pb_title_detail/_title_detail.tsx
playbook_ui-13.16.0.pre.alpha.PLAY11641992 app/pb_kits/playbook/pb_title_detail/_title_detail.tsx
playbook_ui-13.16.0.pre.alpha.PLAY11641991 app/pb_kits/playbook/pb_title_detail/_title_detail.tsx
playbook_ui-13.16.0.pre.alpha.fonttest1972 app/pb_kits/playbook/pb_title_detail/_title_detail.tsx
playbook_ui-13.15.0.pre.alpha.play1141iconkitusinglibrary1956 app/pb_kits/playbook/pb_title_detail/_title_detail.tsx
playbook_ui-13.16.0 app/pb_kits/playbook/pb_title_detail/_title_detail.tsx
playbook_ui-13.15.0.pre.alpha.play10841940 app/pb_kits/playbook/pb_title_detail/_title_detail.tsx
playbook_ui-13.15.0.pre.alpha.1132globalpropdatepickerspacing1929 app/pb_kits/playbook/pb_title_detail/_title_detail.tsx
playbook_ui-13.15.0.pre.alpha.PLAY10851907 app/pb_kits/playbook/pb_title_detail/_title_detail.tsx
playbook_ui-13.15.0.pre.alpha.PLAY11311893 app/pb_kits/playbook/pb_title_detail/_title_detail.tsx
playbook_ui-13.15.0.pre.alpha.reactselectbump581876 app/pb_kits/playbook/pb_title_detail/_title_detail.tsx
playbook_ui-13.15.0.pre.alpha.PLAY10831873 app/pb_kits/playbook/pb_title_detail/_title_detail.tsx
playbook_ui-13.14.0.pre.alpha.play1101betaicons1825 app/pb_kits/playbook/pb_title_detail/_title_detail.tsx
playbook_ui-13.14.0.pre.alpha.play1101betaicons1798 app/pb_kits/playbook/pb_title_detail/_title_detail.tsx
playbook_ui-13.14.0.pre.alpha.play1120lintdatepicker1797 app/pb_kits/playbook/pb_title_detail/_title_detail.tsx
playbook_ui-13.15.0 app/pb_kits/playbook/pb_title_detail/_title_detail.tsx
playbook_ui-13.13.0.pre.alpha.play10821727 app/pb_kits/playbook/pb_title_detail/_title_detail.tsx
playbook_ui-13.13.0.pre.alpha.play10821726 app/pb_kits/playbook/pb_title_detail/_title_detail.tsx