Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/sweetalert2/sweetalert2-react-content
Official SweetAlert2 enhancer adding support for React elements as content
https://github.com/sweetalert2/sweetalert2-react-content
react sweetalert sweetalert2
Last synced: 6 days ago
JSON representation
Official SweetAlert2 enhancer adding support for React elements as content
- Host: GitHub
- URL: https://github.com/sweetalert2/sweetalert2-react-content
- Owner: sweetalert2
- License: mit
- Created: 2018-02-04T02:30:26.000Z (almost 7 years ago)
- Default Branch: main
- Last Pushed: 2024-12-16T22:24:28.000Z (29 days ago)
- Last Synced: 2025-01-02T05:03:21.810Z (13 days ago)
- Topics: react, sweetalert, sweetalert2
- Language: JavaScript
- Homepage:
- Size: 1.95 MB
- Stars: 707
- Watchers: 15
- Forks: 50
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
- awesome-react-components - sweetalert2-react-content - Official SweetAlert2 enhancer adding support for React elements as content (UI Components / Overlay)
- awesome-react - sweetalert2-react-content - Official SweetAlert2 enhancer adding support for React elements as content. ![](https://img.shields.io/github/stars/sweetalert2/sweetalert2-react-content.svg?style=social&label=Star) (UI Components / Dialog/Modal/Alert)
- awesome-react-components - sweetalert2-react-content - Official SweetAlert2 enhancer adding support for React elements as content (UI Components / Overlay)
- fucking-awesome-react-components - sweetalert2-react-content - Official SweetAlert2 enhancer adding support for React elements as content (UI Components / Overlay)
- awesome-react-components - sweetalert2-react-content - Official SweetAlert2 enhancer adding support for React elements as content (UI Components / Overlay)
- awesome-react-components - sweetalert2-react-content - Official SweetAlert2 enhancer adding support for React elements as content (UI Components / Overlay)
README
# sweetalert2-react-content
Official [SweetAlert2](https://sweetalert2.github.io/) enhancer adding support for React elements as content.
- Simple example: https://sweetalert2.github.io/recipe-gallery/sweetalert2-react.html
- With React Router: https://sweetalert2.github.io/recipe-gallery/sweetalert2-react-router.html
- With react-day-picker: https://sweetalert2.github.io/recipe-gallery/input-datepicker.html
- With Formik: https://sweetalert2.github.io/recipe-gallery/sweetalert2-formik.html---
The following options can be React elements:
- `title`
- `html`
- `confirmButtonText`
- `denyButtonText`
- `cancelButtonText`
- `footer`
- `closeButtonHtml`
- `iconHtml`
- `loaderHtml`## Installation
```bash
npm install sweetalert2 sweetalert2-react-content
```## Usage Example
```jsx
import Swal from 'sweetalert2'
import withReactContent from 'sweetalert2-react-content'const MySwal = withReactContent(Swal)
MySwal.fire({
title:Hello World
,
didOpen: () => {
// `MySwal` is a subclass of `Swal` with all the same instance & static methods
MySwal.showLoading()
},
}).then(() => {
return MySwal.fire(Shorthand works too
)
})
```The `dist/sweetalert2-react-content.umd.js` file defines `window.sweetalert2ReactContent` in non-CJS/AMD environments.