import React, { Component } from 'react';
import PropTypes from 'prop-types';
import Modal, { defaultModalVariant, modalVariants } from '../Modal';

class LoginModal extends Component {
  static propTypes = {
    /** Modal contents displayed over underlay, no styling/wrapper provided */
    children: PropTypes.any.isRequired,
    /** Control whether to show the modal: this allows internal entering/exiting logic for transitions */
    show: PropTypes.bool.isRequired,
    /** If provided, it is invoked for escape key or underlay click interactions. If omitted, the modal dialog does not respond to these interactions: you have to provide a way of closing it from the modal dialog content (an interaction that will toggle the `show` prop) . */
    onExit: PropTypes.func,
    /** A11y-enabled modal title */
    title: PropTypes.string.isRequired,

    verticalDialogOffset: PropTypes.string,
    verticalAlign: PropTypes.string,

    /** color variant of the underlay */
    variant: PropTypes.oneOf(modalVariants),
  };
  static defaultProps = {
    variant: defaultModalVariant,
    onExit: undefined,
    verticalAlign: 'middle',
    verticalDialogOffset: null,
  };

  render() {
    const { children, ...props } = this.props;
    return <Modal {...props}>{children}</Modal>;
  }
}

export default LoginModal;