0.0.22 • Published 3 years ago

react-smooth-modal v0.0.22

Weekly downloads
44
License
MIT
Repository
github
Last release
3 years ago

React Smooth Modal

A Smooth Modal which can be fullscreen and draggable dialog for React.JS.

gzip size

Installation

 # If you use npm:
 npm install react-smooth-modal

 # Or if you use Yarn:
 yarn add react-smooth-modal

Usage

Here is a example of react-smooth-modal being used in React with hooks:

 import React, { useState } from 'react';
 import Modal from 'react-smooth-modal';

 const App = () => {
    const [visible, setVisible] = useState(false);
    return (
        <div>
            <Modal
                title="Test Title"
                visible={visible}
                onCancel={() => setVisible(false)}
            >
                Hello World!
            </Modal>
        </div> 
    )
 }

Documentation

Coming soon!

API

NameTypeDefaultDescription
afterClosefunction()-Callback when the modal close
bodyStyleCSSProperties-The modal body style
borderRadiusnumber / string5pxBorderRadius of modal container
cancelTextstring取消The cancel button text
canFullscreenbooleanfalseWhether the modal can fullscreen
centerdbooleanfalseCentered Modal
classNamestring-The modal container className
closablebooleantrueWhether a close (x) button is visible or not
draggablebooleanfalseCan be draggable
escClosablebooleantrueWhether support press esc to close
footerReactNode-The modal's footer
maskClosablebooleantrueWhether to close the modal when the mask is clicked
onCancelfunction()-
onSurefunction()-
sureTextstring确定The sure button text
titleReactNode / string-The modal's title
visiblebooleanfalseWhether the modal is visible or not
widthnumber / string500pxThe modal's width
zIndexnumber1001The z-index of the Modal
0.0.22

3 years ago

0.0.21

3 years ago

0.0.20

3 years ago

0.0.17

3 years ago

0.0.18

3 years ago

0.0.19

3 years ago

0.0.15

3 years ago

0.0.16

3 years ago

0.0.14

3 years ago

0.0.13

3 years ago

0.0.12

3 years ago

0.0.11

3 years ago

0.0.10

3 years ago

0.0.9

3 years ago

0.0.8

3 years ago

0.0.7

3 years ago

0.0.6

3 years ago

0.0.5

3 years ago

0.0.4

3 years ago

0.0.3

3 years ago

0.0.2

3 years ago

0.0.1

3 years ago