rc-dialog
react dialog component
Screenshot
Install
Usage
var Dialog = ; ReactDOM document); // use dialog
API
rc-dialog
name | type | default | description |
---|---|---|---|
prefixCls | String | rc-dialog | The dialog dom node's prefixCls |
className | String | additional className for dialog | |
wrapClassName | String | additional className for dialog wrap | |
style | Object | {} | Root style for dialog element.Such as width, height |
zIndex | Number | ||
bodyStyle | Object | {} | body style for dialog body element.Such as height |
maskStyle | Object | {} | style for mask element. |
visible | Boolean | false | current dialog's visible status |
animation | String | part of dialog animation css class name | |
maskAnimation | String | part of dialog's mask animation css class name | |
transitionName | String | dialog animation css class name | |
maskTransitionName | String | mask animation css class name | |
title | String|React.Element | Title of the dialog | |
footer | React.Element | footer of the dialog | |
closable | Boolean | true | whether show close button |
mask | Boolean | true | whether show mask |
maskClosable | Boolean | true | whether click mask to close |
keyboard | Boolean | true | whether support press esc to close |
mousePosition | {x:number,y:number} | set pageX and pageY of current mouse(it will cause transform origin to be set). | |
onClose | function() | called when click close button or mask | |
afterClose | function() | called when close animation end | |
appendDOM | string | modal mount container element id | |
destroyOnClose | Boolean | false | to unmount child compenents on onClose |
draggable | Boolean | true | whether drag modal to move |
bounds | any | {} | modal drag bounds |
Development
npm install
npm start
Example
http://localhost:8007/examples/
online example: http://react-component.github.io/dialog/
Test Case
npm test
npm run chrome-test
Coverage
npm run coverage
open coverage/ dir
License
rc-dialog is released under the MIT license.
本项目从 https://github.com/react-component/dialog fork,修改了部分代码,使弹层实现了拖拽功能。