Rmc-dialog NPM

m-dialog

react dialog component for mobile

Screenshot

Install

Usage

var Dialog = require('rmc-dialog');

ReactDOM.render(
  <Dialog title={title} onClose={callback1} visible>
      <p>first dialog</p>
  </Dialog>
), document.getElementById('t1'));

// use dialog

API

rmc-dialog(web)

name	description	type	default
prefixCls	The dialog dom node's prefixCls	String	`rmc-dialog`
className	additional className for dialog	String
wrapClassName	additional className for dialog wrap	String
style	Root style for dialog element.Such as width, height	Object	{}
zIndex	z-index	Number
bodyStyle	body style for dialog body element.Such as height	Object	{}
maskStyle	style for mask element.	Object	{}
visible	current dialog's visible status	Boolean	false
animation	part of dialog animation css class name	String
maskAnimation	part of dialog's mask animation css class name	String
transitionName	dialog animation css class name	String
maskTransitionName	mask animation css class name	String
title	Title of the dialog	String	React.Element
footer	footer of the dialog	React.Element
closable	whether show close button	Boolean	true
mask	whether show mask	Boolean	true
maskClosable	whether click mask to close	Boolean	true
onClose	called when click close button or mask	function

rmc-dialog/lib/Dialog (react-native)

name	description	type	default
wrapStyle	style for modal wrap	Object	{}
maskStyle	style for modal mask	Object	{}
style	style for modal	Object	{}
animationType	animation type for modal content, can be one of `none\|fade\|slide-up\|slide-down`	String	slide-up
animationDuration	animation duration	number	300
visible	visible state	boolean	false
animateAppear	whether animation on first show	boolean	false
onClose	called when close	Function	()=>void
onAnimationEnd	called when animation end	Function	(visible:boolean)=>void (animationType !== 'none')

Development

npm install
npm start

Example

http://localhost:8007/examples/

online example: http://react-component.github.io/m-dialog/

react-native

npm run rn-init
npm run watch-tsc
react-native start
react-native run-ios

Test Case

npm test
npm run chrome-test

Coverage

npm run coverage

open coverage/ dir

License

rmc-dialog is released under the MIT license.

react m-dialog react-component react-dialog dialog mobile dialog ui

babel-runtime rc-animate

zeal-cube-mobile antd-mobile-rn-responsive wmzy-mobile ant-zy xc-antd xs-mobile @infinitebrahmanuniverse/nolb-rm @everything-registry/sub-chunk-2672 sxf-mobile jdcloudmui jojo-mobile kb-cook hrfax-and-m hrfax-mobile meetyou-picker @whalecloud/cylon-mobile-lite ant-mobile-rui antd-mobile-without-normalize antd-mobile1221 antd-mobile_ch antd-mobile-mp antd-mobile-rn antd-mobile-rn-kxx antd-mobile-rn-mrhuangjser-forked antd-mobile-rui antd-mobile-alita antd-mobile-v2 artwork-mobile artwork-react ararin-cmp-mobile aphrodite-mobile fish-h5 fast-paper fishd-mobile cal-picker bcs-design-mobile bcs-kit bcs-mobile beisen-phoenix-fork-mobile-action-sheet bennt-antd-mobile-laguage-tw bennt-antd-phone-laguage-tw cabin-mobile-rn dingtalk-design-mobile yc-picker-scroll y-antd-mobile yzt-rui zhytestccccc weaver-mobile zj-rmc-picker rn-global-modal react-easy-page reactui-mobile reactui-mobile-mobile ne-native-rc pivi-dev-picker ppfish-mobile preact-h5-ui ppx-ui qingtai rmc-picker-scroll rmc-picker rainy-ui rn-common-picker sgj-ui sh-react-picker react-zeros @ohmi/rmc-picker 588middleware @beisen-phoenix/mobile-action-sheet @beisen-phoenix/mobile-picker @beisen/bsapp-mobile-ui @beisen/mole-components-web @ant-design/mobile @gdjiami/rmc-picker @efox/emp-lib-base @huangming1994/antd-mobile @mdfe/antd-mobile @johnnylc/rn-custom-ui-components @merryjs/mini @mlz/mobile @molejs/mole-components-rn @molejs/mole-components-web @molejs/mrn-modal

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago