marcandrewb
3/31/2016 - 6:18 AM

Draggable React Bootstrap modal

Draggable React Bootstrap modal

import { Modal } from 'react-bootstrap'
import ModalDialog from 'react-bootstrap/lib/ModalDialog'

class DraggableModalDialog extends React.Component {
	render() {
		return <Draggable handle=".modal-title"><ModalDialog {...this.props} /></Draggable>
	}
}

// enforceForce=false causes recursion exception otherwise....
export default ({titleIconClass, modalClass, children, title, ...props}) =>
	<Modal dialogComponent={DraggableModalDialog} show={true} enforceFocus={false} backdrop="static" {...props}>
		<Modal.Header closeButton>
			<Modal.Title>
				{title}
			</Modal.Title>
		</Modal.Header>
		<Modal.Body>
			{children}
		</Modal.Body>
	</Modal>