import React, {Component} from 'react'; import Modal from '../base/Modal'; import ModalBody from '../base/ModalBody'; import ModalHeader from '../base/ModalHeader'; import ModalFooter from '../base/ModalFooter'; class PromptModal extends Component { constructor (props) { super(props); this.state = { headerName: 'Not Set', defaultValue: '', submitName: 'Not Set', selectText: false, hint: null }; } _onSubmit (e) { e.preventDefault(); this._onSubmitCallback && this._onSubmitCallback(this._input.value); this.modal.hide(); } show ({headerName, defaultValue, submitName, selectText, hint}) { this.modal.show(); this._input.value = defaultValue || ''; // Need to do this after render because modal focuses itself too setTimeout(() => { this._input.focus(); selectText && this._input.select(); }, 100); return new Promise(resolve => { this._onSubmitCallback = resolve; this.setState({ headerName, defaultValue, submitName, selectText, hint }) }); } render () { const {extraProps} = this.props; const {submitName, headerName, hint} = this.state; return ( this.modal = m} {...extraProps}> {headerName}
this._onSubmit(e)} className="wide pad">
this._input = n} type="text"/>
{hint ? `* ${hint}` : ''}
) } } PromptModal.propTypes = {}; export default PromptModal;