stitch-ui/src/core/components/Dropdown.js

/* eslint-disable react/prop-types */
import React from "react";
import DropdownMenu from "react-dd-menu";

export default class Dropdown extends React.Component {
  constructor(props) {
    super(props);
    this.state = { open: false };
  }
  render() {
    const menuOptions = {
      isOpen: this.state.open,
      close: () => {
        this.setState({ open: false });
      },
      toggle: (
        <div
          className="stitch-dropdown"
          onClick={() => {
            this.setState({ open: !this.state.open });
          }}
        >
          <span className="stitch-dropdown-arrow">▼</span>
          <span className="stitch-dropdown-text">
            {this.props.text}
          </span>
        </div>
      ),
      align: "center"
    };
    if (this.props.label) {
      return (
        <div className="stitch-dropdown-input">
          <div className="stitch-dropdown-label">
            {this.props.label}
          </div>
          <DropdownMenu {...menuOptions}>
            {this.props.children}
          </DropdownMenu>
        </div>
      );
    }
    return (
      <DropdownMenu {...menuOptions}>
        {this.props.children}
      </DropdownMenu>
    );
  }
}