All files / publisher/form AccordionHelp.js

100% Statements 14/14
100% Branches 4/4
100% Functions 3/3
100% Lines 14/14

Press n or j to go to the next uncovered block, b, p or k for the previous block.

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 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56          23x   23x   23x           1x   1x 1x           36x 36x   36x 36x 35x     36x                         8x       8x            
import React, { Fragment } from "react";
import PropTypes from "prop-types";
 
class AccordionHelp extends React.Component {
  constructor(props) {
    super(props);
 
    this.toggleHelp = this.toggleHelp.bind(this);
 
    this.state = {
      open: false,
    };
  }
 
  toggleHelp(e) {
    const { open } = this.state;
 
    e.preventDefault();
    this.setState({
      open: !open,
    });
  }
 
  render() {
    const { open } = this.state;
    const { name, children } = this.props;
 
    let label = `Hide ${name.toLowerCase()}`;
    if (!open) {
      label = `Show ${name.toLowerCase()}`;
    }
 
    return (
      <Fragment>
        <p className="p-form-help-text">
          <a href="#" role="button" tabIndex="0" onClick={this.toggleHelp}>
            {label}
          </a>
        </p>
        <div className={`${open ? "" : "u-hide"}`}>{children}</div>
      </Fragment>
    );
  }
}
 
AccordionHelp.defaultProps = {
  name: "help",
};
 
AccordionHelp.propTypes = {
  name: PropTypes.string,
  children: PropTypes.element,
};
 
export { AccordionHelp as default };