{"id":18410295,"url":"https://github.com/vidit-kushwaha/react-popupify","last_synced_at":"2025-06-21T08:06:56.246Z","repository":{"id":241875999,"uuid":"808081706","full_name":"Vidit-Kushwaha/react-popupify","owner":"Vidit-Kushwaha","description":"React Popupify is a simple and easy to use popup component for React applications.","archived":false,"fork":false,"pushed_at":"2024-11-25T21:06:04.000Z","size":1082,"stargazers_count":6,"open_issues_count":3,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-06-15T05:02:57.596Z","etag":null,"topics":["component","javascript","popup","react","react-component","react-popup"],"latest_commit_sha":null,"homepage":"https://docs-react-popupify.onrender.com/","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Vidit-Kushwaha.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-05-30T10:48:45.000Z","updated_at":"2024-11-25T21:03:23.000Z","dependencies_parsed_at":"2024-06-28T11:44:05.242Z","dependency_job_id":"e3f256cf-1a0f-4f31-b3aa-0d377da38ac0","html_url":"https://github.com/Vidit-Kushwaha/react-popupify","commit_stats":null,"previous_names":["vidit-kushwaha/react-popupify"],"tags_count":4,"template":false,"template_full_name":null,"purl":"pkg:github/Vidit-Kushwaha/react-popupify","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Vidit-Kushwaha%2Freact-popupify","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Vidit-Kushwaha%2Freact-popupify/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Vidit-Kushwaha%2Freact-popupify/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Vidit-Kushwaha%2Freact-popupify/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Vidit-Kushwaha","download_url":"https://codeload.github.com/Vidit-Kushwaha/react-popupify/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Vidit-Kushwaha%2Freact-popupify/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":261088354,"owners_count":23107682,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["component","javascript","popup","react","react-component","react-popup"],"created_at":"2024-11-06T03:30:48.708Z","updated_at":"2025-06-21T08:06:51.231Z","avatar_url":"https://github.com/Vidit-Kushwaha.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# React-Popupify\n\n\n![NPM Version](https://img.shields.io/npm/v/react-popupify?style=for-the-badge)\n![NPM Downloads](https://img.shields.io/npm/dw/react-popupify?style=for-the-badge)\n![npm bundle size](https://img.shields.io/bundlephobia/min/react-popupify?style=for-the-badge)\n![GitHub License](https://img.shields.io/github/license/Vidit-Kushwaha/react-popupify?style=for-the-badge)\n![Coveralls](https://img.shields.io/coverallsCoverage/github/Vidit-Kushwaha/react-popupify?style=for-the-badge)\n\n\u003cimg src=\"https://i.ibb.co/m6t3dQc/download-1.gif\" alt=\"GIF\" height=\"650\"\u003e\n\n## Table of Contents\n\n- [Features](#features)\n- [Installation](#installation)\n- [Documentation](#documentation)\n- [Contributing](#contributing)\n- [Release Notes](#release-notes)\n- [License](#license)\n\n## Features \n\n- **Easy Integration**: Simple and intuitive API for quick integration.\n- **Custom Animations**: Supports various animation types such as `bounce`, `flip`, `zoom`, and `fade`.\n- **Auto-Close**: Option to auto-close the popup after a specified duration.\n- **Customizable Close Button**: Flexible options for close button customization.\n- **Event Handlers**: Callbacks for when the popup is entered and exited.\n- **Esc Key and Outside Click**: Configurable options to close the popup using the escape key or clicking outside.\n\n## Installation\n\nWith npm\n```\nnpm install --save react-popupify\n```\n\nAdding css\n```html\nimport \"react-popupify/dist/bundle.css\";\n```\n\n### The Gist\n\n```jsx\n\n  import React from 'react';\n\n  import { showPopup } from 'react-popupify'\n  import \"react-popupify/dist/bundle.css\";\n  \n  const App = () =\u003e {\n\n  const popup = () =\u003e showPopup('customPopupId', { open: true })\n\n    return (\n      \u003cdiv\u003e\n        \u003cbutton onClick={popup}\u003eShow Popup!\u003c/button\u003e\n        \u003cCustomPopup /\u003e\n      \u003c/div\u003e\n    );\n  }\n\nexport default App\n```\n\n./component/CustomPopup.tsx\n```jsx\n  import React from 'react';\n  import { Popup } from 'react-popupify';\n\n  const CustomPopup = () =\u003e {\n  \n    return (\n          \u003cPopup\n            popupId=\"customPopupId\"\n            animation=\"bounce\"\n            open={false}\n            closeOnEscape={true}\n            closeOnOutsideClick={true}\n            closeButton={true}\n        \u003e\n          Say Hello to React-Poupify !!\n        \u003c/Popup\u003e\n    );\n  }\n\nexport default CustomPopup\n```\n\n## Documentation\n\nCheck the [documentation](https://docs-react-popupify.onrender.com/) to get you started!\n\n## Contributing\n\nWe welcome contributions! Whether you're a seasoned developer or a curious enthusiast, there are ways to get involved:\n\n-   **Bug fixes and improvements:** Find any issues? Submit a pull request!\n-   **New features:** Have an idea for a cool feature? Let's discuss it in an issue!\n-   **Documentation:** Improve the project's documentation and website.\n-   **Spread the word:** Share the project with your network and help it grow!\n\nYou can see contribution guidelines [here](https://github.com/Vidit-Kushwaha/react-popupify/blob/main/CONTRIBUTING.md)\n\n## Release Notes\n\nYou can find the release note for the latest release [here](https://github.com/Vidit-Kushwaha/react-popupify/releases/latest)\n\nYou can browse them all [here](https://github.com/Vidit-Kushwaha/react-popupify/releases)\n\n## License\n\nThis project is licensed under the MIT License. See the [LICENSE](https://github.com/Vidit-Kushwaha/react-popupify/blob/main/LICENSE) file for details.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvidit-kushwaha%2Freact-popupify","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvidit-kushwaha%2Freact-popupify","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvidit-kushwaha%2Freact-popupify/lists"}