# @magicbruno/swalstrap5

> Sweetalert2 inspired dialog based on Bootstrap 5

Latest version **1.0.10** (published 2022-09-27) · ISC license · 0 weekly downloads

## Install

```sh
npm install @magicbruno/swalstrap5
pnpm add @magicbruno/swalstrap5
yarn add @magicbruno/swalstrap5
bun add @magicbruno/swalstrap5
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.10 |
| Published | 2022-09-27 |
| First published | 2022-07-15 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 679.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 4 |
| Author | Bruno Migliaretti |
| Maintainers | magicbruno |
| Keywords | sweetalert, alert, bootstrap, dialog |

## Links

- npm: https://www.npmjs.com/package/@magicbruno/swalstrap5
- Repository: https://github.com/magicbruno/SwalStrap5
- Homepage: https://magicbruno.github.io/SwalStrap5/
- Issues: https://github.com/magicbruno/SwalStrap5/issues
- npm.io page: https://npm.io/package/@magicbruno/swalstrap5

## Alternatives

- [@sveltejs/kit](https://npm.io/package/@sveltejs/kit.md) — 2.2M weekly downloads
- [@atlaskit/theme](https://npm.io/package/@atlaskit/theme.md) — 402.0K weekly downloads
- [@tangle-network/brand](https://npm.io/package/@tangle-network/brand.md) — 10.0K weekly downloads
- [seneca](https://npm.io/package/seneca.md) — 7.4K weekly downloads
- [@bsb/base](https://npm.io/package/@bsb/base.md) — 7.2K weekly downloads

## Recent versions

- 1.0.10 (latest) — 2022-09-27
- 1.0.8 — 2022-08-04
- 1.0.7 — 2022-08-04
- 1.0.6 — 2022-08-04
- 1.0.5 — 2022-08-01
- 1.0.4 — 2022-07-31
- 1.0.3 — 2022-07-30
- 1.0.2 — 2022-07-30
- 1.0.1 — 2022-07-30
- 1.0.0 — 2022-07-15

## README

# Sweet Alert for Bootstrap 5
A **Swetalert** and **Bootbox** alternative build on Bootstrap 5 Modal and Toast components. Do you need Swalstrap for Bootstrap 4? 
[Go here](https://github.com/magicbruno/SwalStrap4).

## Getting started 
Load Swalstrap form CDN:

```
<script src="https://cdn.jsdelivr.net/npm/@magicbruno/swalstrap5@1.0.8/dist/js/swalstrap5_all.min.js"></script>
```
swalstrap5_all.js will load automatically Swalstrap stylesheet and will create a default instance of Swalstrap named Swal (an aliased as swal, Sweetalert and sweetalert).

You can use Swalstrap applying fire method to the created instance:
```
<script>
    Swal.fire('Wanderful!','Swalstrap is working!','success')
</script>
```
If you prefer you can load Swalstrap stylesheet (or a customized one) separately:
```
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@magicbruno/swalstrap5@1.0.8/dist/css/swalstrap.min.css">
```
and load swalstrap5.js version:
```
<script src="https://cdn.jsdelivr.net/npm/@magicbruno/swalstrap5@1.0.8/dist/js/swalstrap5.min.js"></script>
```
In this case you must create at least an instance of Swalstrap an then use it to open your popups:
```
<script>
    // Create an instance 
    const mySwal = new Swalstrap();
    // Then use it for all your popups
    mySwal.fire('Wanderful!','Swalstrap is working!','success');
</script>
```
## Downloading Swalstrap

You can install package via npm:
```
npm install @magicbruno/swalstrap5@1.0.8
```
clone the git package:
```
git clone https://github.com/magicbruno/SwalStrap5.git
```
or [download it](https://github.com/magicbruno/SwalStrap5/archive/refs/heads/main.zip).

>### Warning
>Swalstrap is inspired to Sweetalert NOT a clone. Features are reproduced not copied.
>So there are differences. Watch documentation and test examples.

- [Documentation](https://magicbruno.github.io/SwalStrap5/api.html).
- [Examples](https://magicbruno.github.io/SwalStrap5/basic-examples.html).
- [Customization example](https://magicbruno.github.io/SwalStrap5/custumization.html).

---
_Source: https://npm.io/package/@magicbruno/swalstrap5 · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
