0.3.1 • Published 2 years ago

react-awesome-simple-modal v0.3.1

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

Licence npm version Downloads

React Awesome Simple Modal

Simple library with Modal component for React.

Installation

npm i react-awesome-simple-modal

Live Demo

https://codesandbox.io/s/react-awseome-simple-modal-demo-ozq4hp

Example

import { useState } from "react";
import { ReactSimpleModal } from "react-awesome-simple-modal";

export default function App() {
  const [isOpen, setIsOpen] = useState(false);

  return (
    <>
      <button
        style={{ border: "1px solid black", padding: "4px" }}
        onClick={() => setIsOpen(true)}
      >
        Click Me!
      </button>
      <ReactSimpleModal open={isOpen} onClose={() => setIsOpen(false)}>
        <div
          style={{
            display: "flex",
            justifyContent: "center",
            alignItems: "center",
            color: "white"
          }}
        >
          <h1>Hello!</h1>
        </div>
      </ReactSimpleModal>
    </>
  );
}

API

PropertyTypeDescription
openbooleanTrigger to open/close modal.
onClose() => voidHandle modal closing action.
closeIconJSX.ElementClose icon for the modal (optional).