Sha256: f6c3fec3a80d193193501c506179963912531c4948f7fb869dcb608620ac86f9

Contents?: true

Size: 1.12 KB

Versions: 97

Compression:

Stored size: 1.12 KB

Contents

/* @flow */
import React from 'react'
import classnames from 'classnames'

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

import Caption from '../pb_caption/_caption'

type SectionSeparatorProps = {
  aria: object,
  className: string,
  dark?: boolean,
  data: object,
  id: string,
  orientation?: "horizontal" | "vertical",
  text: string,
  variant?: "card" | "background",
}

const SectionSeparator = (props: SectionSeparatorProps) => {
  const {
    aria = {},
    className,
    data = {},
    id,
    orientation = 'horizontal',
    text,
    variant = 'card',
  } = props
  const ariaProps = buildAriaProps(aria)
  const dataProps = buildDataProps(data)
  const classes = classnames(buildCss('pb_section_separator_kit', variant, orientation), globalProps(props), className)

  return (

    <div
        {...ariaProps}
        {...dataProps}
        className={classes}
        id={id}
    >

      <If condition={text}>
        <span>
          <Caption text={text} />
        </span>
      </If>

    </div>
  )
}

export default SectionSeparator

Version data entries

97 entries across 97 versions & 1 rubygems

Version Path
playbook_ui-11.3.0.pre.alpha2 app/pb_kits/playbook/pb_section_separator/_section_separator.jsx
playbook_ui-11.3.0.pre.alpha1 app/pb_kits/playbook/pb_section_separator/_section_separator.jsx
playbook_ui-11.3.0 app/pb_kits/playbook/pb_section_separator/_section_separator.jsx
playbook_ui-11.2.7 app/pb_kits/playbook/pb_section_separator/_section_separator.jsx
playbook_ui-11.2.6 app/pb_kits/playbook/pb_section_separator/_section_separator.jsx
playbook_ui-11.2.5 app/pb_kits/playbook/pb_section_separator/_section_separator.jsx
playbook_ui-11.2.4 app/pb_kits/playbook/pb_section_separator/_section_separator.jsx
playbook_ui-11.2.4.pre.alpha1 app/pb_kits/playbook/pb_section_separator/_section_separator.jsx
playbook_ui-11.2.3 app/pb_kits/playbook/pb_section_separator/_section_separator.jsx
playbook_ui-11.2.2 app/pb_kits/playbook/pb_section_separator/_section_separator.jsx
playbook_ui-11.2.1 app/pb_kits/playbook/pb_section_separator/_section_separator.jsx
playbook_ui-11.2.0 app/pb_kits/playbook/pb_section_separator/_section_separator.jsx
playbook_ui-11.1.2 app/pb_kits/playbook/pb_section_separator/_section_separator.jsx
playbook_ui-11.1.2.pre.alpha1 app/pb_kits/playbook/pb_section_separator/_section_separator.jsx
playbook_ui-11.1.1 app/pb_kits/playbook/pb_section_separator/_section_separator.jsx
playbook_ui-11.1.1.pre.alpha1 app/pb_kits/playbook/pb_section_separator/_section_separator.jsx
playbook_ui-11.1.0 app/pb_kits/playbook/pb_section_separator/_section_separator.jsx
playbook_ui-11.0.1 app/pb_kits/playbook/pb_section_separator/_section_separator.jsx
playbook_ui-11.0.0 app/pb_kits/playbook/pb_section_separator/_section_separator.jsx
playbook_ui-11.0.0.pre.alpha.2 app/pb_kits/playbook/pb_section_separator/_section_separator.jsx