diff options
author | Michael Lando <ml636r@att.com> | 2018-05-21 20:19:48 +0000 |
---|---|---|
committer | Gerrit Code Review <gerrit@onap.org> | 2018-05-21 20:19:48 +0000 |
commit | 05b37297177e8a342668c15e5d6f738b51f7aedd (patch) | |
tree | e236c96df52a13f935292db8aa73e84d0c41ad8a /src/react/Accordion.js | |
parent | 884dfb789593d2a3cc319047ab1f0215778aec9f (diff) | |
parent | 1994c98063c27a41797dec01f2ca9fcbe33ceab0 (diff) |
Merge "init commit onap ui"HEAD2.0.0-ONAPmasterbeijing2.0.0-ONAP
Diffstat (limited to 'src/react/Accordion.js')
-rw-r--r-- | src/react/Accordion.js | 40 |
1 files changed, 40 insertions, 0 deletions
diff --git a/src/react/Accordion.js b/src/react/Accordion.js new file mode 100644 index 0000000..3acdd24 --- /dev/null +++ b/src/react/Accordion.js @@ -0,0 +1,40 @@ +import React from 'react'; +import PropTypes from 'prop-types'; +import SVGIcon from './SVGIcon.js'; + +class Accordion extends React.Component { + constructor(props) { + super(props); + this.state = { + open: props.defaultExpanded + }; + } + render() { + const { children, title, className, dataTestId } = this.props; + const { open } = this.state; + return ( + <div className={`sdc-accordion ${className}`}> + <div data-test-id={dataTestId} onClick={() => this.setState({ open: !open })} className='sdc-accordion-header'> + <SVGIcon name='chevronDown' iconClassName={open ? 'down' : ''} /> + <div className='title'>{title}</div> + </div> + <div className={`sdc-accordion-body ${open ? 'open' : ''}`}>{children}</div> + </div> + ); + } +} + +Accordion.propTypes = { + title: PropTypes.string, + children: PropTypes.node, + expandByDefault: PropTypes.bool, + dataTestId: PropTypes.string +}; + +Accordion.defaultProps = { + title: '', + className: '', + defaultExpanded: false +}; + +export default Accordion; |