content: import React from 'react';
  import PropTypes from 'prop-types';
  
  import Dropdown from './Dropdown';
  
  const propTypes = {
    /**
     * An html id attribute for the Toggle button, necessary for assistive technologies, such as screen readers.
     * @type {string|number}
     * @required
     */
    id: PropTypes.any,
  
    /** An `href` passed to the Toggle component */
    href: PropTypes.string,
  
    /** An `onClick` handler passed to the Toggle component */
    onClick: PropTypes.func,
  
    /** The content of the non-toggle Button.  */
    title: PropTypes.node.isRequired,
  
    /** Disables both Buttons  */
    disabled: PropTypes.bool,
  
    /** An ARIA accessible role applied to the Menu component. When set to 'menu', The dropdown */
    menuRole: PropTypes.string,
  
    /**
     *  Which event when fired outside the component will cause it to be closed.
     *
     * _see [DropdownMenu](#menu-props) for more details_
     */
    rootCloseEvent: PropTypes.string,
  
    /** @ignore */
    bsPrefix: PropTypes.string,
    /** @ignore */
    variant: PropTypes.string,
    /** @ignore */
    size: PropTypes.string,
  };
  
  /**
   * A convenience component for simple or general use dropdowns. Renders a `Button` toggle and all `children`
   * are passed directly to the default `Dropdown.Menu`.
   *
   * _All unknown props are passed through to the `Dropdown` component._ Only
   * the Button `variant`, `size` and `bsPrefix` props are passed to the toggle,
   * along with menu related props are passed to the `Dropdown.Menu`
   */
  class DropdownButton extends React.Component {
    render() {
      const {
        title,
        children,
        bsPrefix,
        rootCloseEvent,
        variant,
        size,
        menuRole,
        disabled,
        href,
        id,
        ...props
      } = this.props;
  
      return (
        <Dropdown {...props}>
          <Dropdown.Toggle
            id={id}
            href={href}
            size={size}
            variant={variant}
            disabled={disabled}
            childBsPrefix={bsPrefix}
          >
            {title}
          </Dropdown.Toggle>
          <Dropdown.Menu role={menuRole} rootCloseEvent={rootCloseEvent}>
            {children}
          </Dropdown.Menu>
        </Dropdown>
      );
    }
  }
  
  DropdownButton.propTypes = propTypes;
  
  export default DropdownButton;
  