Sha256: ac6b344879f60a5a6a2d7d38b198e781143c3b45e54f5bf1469a46f83a9d5ad1

Contents?: true

Size: 1.55 KB

Versions: 11

Compression:

Stored size: 1.55 KB

Contents

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

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

import Caption from '../pb_caption/_caption'

type SectionSeparatorProps = {
  aria?: { [key: string]: string; },
  children?: React.ReactChild[] | React.ReactChild,
  className?: string,
  dark?: boolean,
  data?: { [key: string]: string; },
  htmlOptions?: {[key: string]: string | number | boolean | (() => void)},
  id?: string,
  lineStyle?: "solid" | "dashed",
  orientation?: "horizontal" | "vertical",
  text?: string,
  variant?: "card" | "background",
}

const SectionSeparator = (props: SectionSeparatorProps) => {
  const {
    aria = {},
    children,
    className,
    data = {},
    htmlOptions = {},
    id,
    lineStyle = 'solid',
    orientation = 'horizontal',
    text,
    dark = false,
    variant = 'card',
  } = props
  const ariaProps = buildAriaProps(aria)
  const dataProps = buildDataProps(data)
  const htmlProps = buildHtmlProps(htmlOptions)
  const classes = classnames(buildCss('pb_section_separator_kit', variant, orientation, lineStyle === "dashed" ? lineStyle : ""), globalProps(props), className)

  return (

    <div
      {...ariaProps}
      {...dataProps}
      {...htmlProps}
      className={classes}
      id={id}
    >
      {
        children && children ||
        text && (
          <span>
            <Caption text={text} dark={dark} />
          </span>
        )
      }
    </div>
  )
}

export default SectionSeparator

Version data entries

11 entries across 11 versions & 1 rubygems

Version Path
playbook_ui-13.15.0.pre.alpha.play10841940 app/pb_kits/playbook/pb_section_separator/_section_separator.tsx
playbook_ui-13.15.0.pre.alpha.1132globalpropdatepickerspacing1929 app/pb_kits/playbook/pb_section_separator/_section_separator.tsx
playbook_ui-13.15.0.pre.alpha.PLAY11311893 app/pb_kits/playbook/pb_section_separator/_section_separator.tsx
playbook_ui-13.15.0.pre.alpha.reactselectbump581876 app/pb_kits/playbook/pb_section_separator/_section_separator.tsx
playbook_ui-13.15.0.pre.alpha.PLAY10831873 app/pb_kits/playbook/pb_section_separator/_section_separator.tsx
playbook_ui-13.14.0.pre.alpha.play1101betaicons1825 app/pb_kits/playbook/pb_section_separator/_section_separator.tsx
playbook_ui-13.14.0.pre.alpha.play1101betaicons1798 app/pb_kits/playbook/pb_section_separator/_section_separator.tsx
playbook_ui-13.14.0.pre.alpha.play1120lintdatepicker1797 app/pb_kits/playbook/pb_section_separator/_section_separator.tsx
playbook_ui-13.15.0 app/pb_kits/playbook/pb_section_separator/_section_separator.tsx
playbook_ui-13.13.0.pre.alpha.play10821727 app/pb_kits/playbook/pb_section_separator/_section_separator.tsx
playbook_ui-13.13.0.pre.alpha.play10821726 app/pb_kits/playbook/pb_section_separator/_section_separator.tsx