@devgw-react/blank-modal
TypeScript icon, indicating that this package has built-in type declarations

1.1.6 • Public • Published

@devgw-react/blank-modal

React Hook to open your modal on browser

Installation

yarn

yarn add @devgw-react/blank-modal

npm

npm i @devgw-react/blank-modal

Usage

import React from "react";
import { ModalTemplate, useModalHandler } from "@devgw/blank-modal";

const ModalParent = () => {
  const {
    isVisible,
    handleModalActive,
    handleModalInactive,
  } = useModalHandler();
  return (
    <>
      <ModalTemplate
        isVisible={isVisible} // modal status
        handleModalInactive={handleModalInactive} // modal close
      >
        // create a component for modal here.
        <div>HELLOW</div>
        <button onClick={handleModalInactive}></button> // modal close
      </ModalTemplate>
      <button onClick={handleModalActive}>MODAL OPEN</button> // modal open
    </>
  );
};

export default ModalParent;

ModalTemplate Arguments

Argument Type Description Required
children ReactNode Components to be view in modal yes
isVisible boolean modal visible state value yes
handleModalInactive ()=>void modal isVisible handler no
borderRadius string modal border radius value no
bgColor string modal background color value no

Package Sidebar

Install

npm i @devgw-react/blank-modal

Weekly Downloads

1

Version

1.1.6

License

MIT

Unpacked Size

29.4 kB

Total Files

15

Last publish

Collaborators

  • devge