Sha256: 879c6ae7b723ca7d8349902a78d847ff4d61b31e3c647cbac73131f88c0fe224

Contents?: true

Size: 1.09 KB

Versions: 40

Compression:

Stored size: 1.09 KB

Contents

/* @flow */

import React from 'react'
import classnames from 'classnames'
import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
import { spacing } from '../utilities/spacing.js'

type CaptionProps = {
  aria?: object,
  className?: String,
  children: Array<React.ReactNode> | React.ReactNode,
  dark?: Boolean,
  data?: object,
  id?: String,
  size?: "xs" | "sm" | "md" | "lg" | "xl",
  tag?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "span" | "div",
  text?: String,
}

const Caption = (props: CaptionProps) => {
  const {
    aria = {},
    className,
    children,
    dark = false,
    data = {},
    id,
    size = 'md',
    tag = 'div',
    text,
  } = props
  const Tag = `${tag}`

  const ariaProps = buildAriaProps(aria)
  const dataProps = buildDataProps(data)
  const css = classnames(
    buildCss('pb_caption_kit', size, {
      dark: dark,
    }),
    className,
    spacing(props)
  )

  return (
    <Tag
        {...ariaProps}
        {...dataProps}
        className={css}
        id={id}
    >
      {text || children}
    </Tag>
  )
}

export default Caption

Version data entries

40 entries across 40 versions & 1 rubygems

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