blob: 3acdd24cd596eb723071f6afbb2062c3d76cd5f1 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
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;
|