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

| Property | Type | Description | | :-------- | :---------- | :----------------------------------- | | open | boolean | Trigger to open/close modal. | | onClose | () => void | Handle modal closing action. | | closeIcon | JSX.Element | Close icon for the modal (optional). |