import * as React from 'react';
import Hammer from 'react-hammerjs';
import * as ReactDOM from 'react-dom';
import { Accordion, accordionOpen, accordionClose } from '../../lib/accordion';

class Deom extends React.Component<any, any> {
  constructor(props, state) {
    super(props, state);
  }
  
  public state = {
    elem: ''
  }
  public elem: HTMLElement;

  public componentDidMount() {
    this.setState({
      elem: document.getElementById('accordion')
    });
  }
  public render() {
    return (
      <div>
        <Accordion
          id="accordion"
          defaultOpen
        >
          展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容
          展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容
          展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容展开的内容
        </Accordion>
        <Hammer onTap={() => accordionOpen('accordion')}>
          <button>打开</button>
        </Hammer>
        <Hammer onTap={() => accordionClose('accordion')}>
          <button>关闭</button>
        </Hammer>
      </div>
    )
  }
}

ReactDOM.render(<Deom />, document.getElementById('root'));