Sha256: 68ac581387694cd64eb5aecb2f1e2c1abbc695b0d250064c6a4cb22c1cea9497

Contents?: true

Size: 1.02 KB

Versions: 76

Compression:

Stored size: 1.02 KB

Contents

/* @flow */

import classnames from 'classnames'
import React, { useContext } from 'react'
import AnimateHeight from 'react-animate-height'
import { buildCss } from '../../utilities/props'
import { globalProps } from '../../utilities/globalProps.js'

import { CollapsibleContext } from '../_collapsible.jsx'

type CollapsibleContentProps = {
  children: array<React.ReactNode> | React.ReactNode | string,
  className?: string,
  padding?: string,
}

const CollapsibleContent = ({
  children,
  className,
  padding = 'md',
  ...props
}: CollapsibleContentProps) => {
  const context = useContext(CollapsibleContext)
  const contentCSS = buildCss('pb_collapsible_content_kit')
  const contentSpacing = globalProps(props, { padding })

  return (
    <div className={classnames(contentCSS, className, contentSpacing)}>
      <AnimateHeight
          duration={300}
          height={context.collapsed ? 0 : 'auto'}
          id="bottom-section"
      >
        {children}
      </AnimateHeight>
    </div>
  )
}

export default CollapsibleContent

Version data entries

76 entries across 76 versions & 1 rubygems

Version Path
playbook_ui-9.19.0 app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleContent.jsx
playbook_ui-9.19.0.pre.alphafonts app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleContent.jsx
playbook_ui-9.18.0.flow.bin.alpha app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleContent.jsx
playbook_ui-9.18.0 app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleContent.jsx
playbook_ui-9.17.0 app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleContent.jsx
playbook_ui-9.17.0.pre.decouple.website2 app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleContent.jsx
playbook_ui-9.16.0 app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleContent.jsx
playbook_ui-9.15.0 app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleContent.jsx
playbook_ui-9.15.0.pre.decouple.website1 app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleContent.jsx
playbook_ui-9.14.1.alpha.radio.alignment app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleContent.jsx
playbook_ui-9.14.1.alpha.highcharts9 app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleContent.jsx
playbook_ui-9.14.1 app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleContent.jsx
playbook_ui-9.13.0 app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleContent.jsx
playbook_ui-9.12.0 app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleContent.jsx
playbook_ui-9.12.0.pre.text.addon app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleContent.jsx
playbook_ui-9.11.0 app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleContent.jsx
playbook_ui-9.10.0 app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleContent.jsx
playbook_ui-9.10.0.pre.date.time.stacked.1 app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleContent.jsx
playbook_ui-9.10.0.pre.alpha2 app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleContent.jsx
playbook_ui-9.10.0.pre.alpha1 app/pb_kits/playbook/pb_collapsible/child_kits/CollapsibleContent.jsx