Security News
The Push to Ban Ransom Payments Is Gaining Momentum
Ransomware costs victims an estimated $30 billion per year and has gotten so out of control that global support for banning payments is gaining momentum.
sweetalert2
Advanced tools
Changelog
Readme
A beautiful, responsive, customizable, accessible (WAI-ARIA) replacement for JavaScript's popup boxes. Zero dependencies.
:shipit: The author of SweetAlert2 (@limonte) is looking for short-term to medium-term working contracts in front-end, preferably OSS.
:point_right: Upgrading from v8.x to v9.x? Read the release notes!
If you're upgrading from v7.x, please upgrade from v7 to v8 first!
If you're upgrading from v6.x, please upgrade from v6 to v7 first!
:point_right: Migrating from SweetAlert? SweetAlert 1.x to SweetAlert2 migration guide
npm install --save sweetalert2
Or grab from jsdelivr CDN :
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@9"></script>
<script src="sweetalert2/dist/sweetalert2.all.min.js"></script>
<!-- Include a polyfill for ES6 Promises (optional) for IE11 -->
<script src="https://cdn.jsdelivr.net/npm/promise-polyfill9/dist/polyfill.js"></script>
You can also include the stylesheet separately if desired:
<script src="sweetalert2/dist/sweetalert2.min.js"></script>
<link rel="stylesheet" href="sweetalert2/dist/sweetalert2.min.css">
Or:
// ES6 Modules or TypeScript
import Swal from 'sweetalert2'
// CommonJS
const Swal = require('sweetalert2')
Or with JS modules:
<link rel="stylesheet" href="sweetalert2/dist/sweetalert2.css">
<script type="module">
import Swal from 'sweetalert2/src/sweetalert2.js'
</script>
It's possible to import JS and CSS separately, e.g. if you need to customize styles:
import Swal from 'sweetalert2/dist/sweetalert2.js'
import 'sweetalert2/src/sweetalert2.scss'
Please note that TypeScript is well-supported, so you don't have to install a third-party declaration file.
The most basic message:
Swal.fire('Hello world!')
A message signaling an error:
Swal.fire('Oops...', 'Something went wrong!', 'error')
Handling the result of SweetAlert2 modal:
Swal.fire({
title: 'Are you sure?',
text: 'You will not be able to recover this imaginary file!',
icon: 'warning',
showCancelButton: true,
confirmButtonText: 'Yes, delete it!',
cancelButtonText: 'No, keep it'
}).then((result) => {
if (result.value) {
Swal.fire(
'Deleted!',
'Your imaginary file has been deleted.',
'success'
)
// For more information about handling dismissals please visit
// https://sweetalert2.github.io/#handling-dismissals
} else if (result.dismiss === Swal.DismissReason.cancel) {
Swal.fire(
'Cancelled',
'Your imaginary file is safe :)',
'error'
)
}
})
IE11* | Edge | Chrome | Firefox | Safari | Opera | UC Browser |
---|---|---|---|---|---|---|
:heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: | :heavy_check_mark: |
* ES6 Promise polyfill should be included, see usage example.
Note that SweetAlert2 does not and will not provide support or functionality of any kind on IE10 and lower.
sweetalert2-themes ↗
)@gverni | @zenflow | @toverux |
If you would like to contribute enhancements or fixes, please do the following:
Fork the sweetalert2
repository and clone it locally.
When in the SweetAlert2 directory, run npm install
or yarn install
to install dependencies.
To begin active development, run npm start
or yarn start
. This does several things for you:
dist
folderBecome a sponsor | FlowCrypt | WP Reset | SebaEBC | Lapakle |
SexualAlpha | STED | YourDoll | STC | Bingato | RealSexDoll | DoctorClimax |
Has SweetAlert2 helped you create an amazing application? You can show your support by making a donation:
16Z7RvFv7PsV3XzFvchYwPnRfw9KeLTZQJ
0x192096161eB2273f12b1cB4E31aBB09Bfc03a7F3
qz28x66hrljtdz3052p8ya3cmkwwva5avy0msz2ej3
GDUM4VJZYDNRHBTKUQBOPC374AP6MMMVOJDMSHIPEJPEMBCY4ZHH6NDY
FAQs
A beautiful, responsive, customizable and accessible (WAI-ARIA) replacement for JavaScript's popup boxes, supported fork of sweetalert
We found that sweetalert2 demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Ransomware costs victims an estimated $30 billion per year and has gotten so out of control that global support for banning payments is gaining momentum.
Application Security
New SEC disclosure rules aim to enforce timely cyber incident reporting, but fear of job loss and inadequate resources lead to significant underreporting.
Security News
The Python Software Foundation has secured a 5-year sponsorship from Fastly that supports PSF's activities and events, most notably the security and reliability of the Python Package Index (PyPI).