1.2.0 • Published 2 years ago

kayt0-mypopup v1.2.0

Weekly downloads
-
License
ISC
Repository
-
Last release
2 years ago

Kayt0-MyPopup

It's a simple animated popup library that will allow you to add a popup with succes or error style. You can customize popup name and text. There is also a close button.

NPM

Installation

Install my-project with npm

    npm install --save kayt0-mypopup
    npm install --save framer-motion
    npm install

Install my-project with yarn

    yarn add kayt0-mypopup
    yarn add framer-motion
    yarn

Usage

//import useCycle from framer-motion to add the popup's display/hide statements
import { useCycle } from "framer-motion";

//import MyPopup from kayt0-mypopup to add the the popup
import { MyPopup } from "kayt0-mypopup";

export default function NewEmployee() {

  // initialize the popup's display/hide statement
  const [isPopupOpen, TogglePopup] = useCycle(false, true);

  return (
        {/* Add a button and trigger the TogglePopup Statement on Click */}
        <button onClick={TogglePopup}> Show Popup </button>

        {/* Add the popup component and specify all the props the popup needs */}
        <MyPopup
          // Main text displayed inside the popup
          text="New employee added."
          // Type success or error (green or red colors used)
          type="success"
          // The title displayed inside the popup
          title="Success"
          // Use the isPopupOpen statement to show/hide the popup
          trigger={isPopupOpen}
          // Pass the TogglePopup Statement to show/hide the popup
          onClose={TogglePopup}
        />
  );

License

MIT - @hugorobitaillie

1.2.0

2 years ago

1.1.10

2 years ago

1.1.9

2 years ago

1.1.8

2 years ago

1.1.7

2 years ago

1.1.6

2 years ago

1.1.5

2 years ago

1.1.4

2 years ago

1.1.3

2 years ago

1.1.1

2 years ago

1.1.0

2 years ago

1.0.15

2 years ago

1.0.14

2 years ago

1.0.13

2 years ago

1.0.12

2 years ago

1.0.11

2 years ago

1.0.10

2 years ago

1.0.9

2 years ago

1.0.8

2 years ago

1.0.7

2 years ago

1.0.6

2 years ago

1.0.5

2 years ago

1.0.4

2 years ago

1.0.3

2 years ago

1.0.2

2 years ago

1.0.1

2 years ago

1.0.0

2 years ago