https://github.com/ymlluo/bs5dialog
bs5dialog is a library for creating Bootstrap 5 dialogs. It provides a set of components for creating alerts, prompts, confirms, messages, toasts, tabs, spinners, and offcanvas dialogs.
https://github.com/ymlluo/bs5dialog
alert bootstrap bootstrap5 confirm dialog loading message offcanvas prompt spinner toast
Last synced: 3 months ago
JSON representation
bs5dialog is a library for creating Bootstrap 5 dialogs. It provides a set of components for creating alerts, prompts, confirms, messages, toasts, tabs, spinners, and offcanvas dialogs.
- Host: GitHub
- URL: https://github.com/ymlluo/bs5dialog
- Owner: ymlluo
- License: mit
- Created: 2023-03-30T08:59:28.000Z (about 3 years ago)
- Default Branch: master
- Last Pushed: 2025-04-07T02:25:07.000Z (about 1 year ago)
- Last Synced: 2025-10-18T18:39:29.938Z (8 months ago)
- Topics: alert, bootstrap, bootstrap5, confirm, dialog, loading, message, offcanvas, prompt, spinner, toast
- Language: JavaScript
- Homepage: https://ymlluo.github.io/bs5dialog/
- Size: 887 KB
- Stars: 13
- Watchers: 2
- Forks: 4
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
[](https://github.com/ymlluo/bs5dialog/actions/workflows/npm-publish.yml)
[](https://www.npmjs.com/package/@ymlluo/bs5dialog)
[](#)
# Introduction
bs5dialog is a library for creating Bootstrap 5 dialogs. It provides a set of components for creating alerts, prompts, confirms, messages, toasts, tabs, loadings, and offcanvas dialogs.
## Demo
Here is a simple demo page, which will be completed later
### ✨ [Demo](https://ymlluo.github.io/bs5dialog/dist/index.html)
---
# Installation
To install bs5dialog, run the following command:
```
npm install @ymlluo/bs5dialog
```
### CDN via jsDelivr
Skip the download with jsDelivr to deliver cached version of bs5dialog's compiled CSS and JS to your project.
``` html
```
# Components
## [Alert](docs/alert.md)
Displays an alert modal with the given content and options.
## [Confirm](docs/confirm.md)
Displays a confirmation modal with the given content and options.
## [Prompt](docs/prompt.md)
Displays a prompt dialog with customizable options.
## [Message](docs/message.md)
Displays a message with customizable options
## [Loading](docs/loading.md)
Creates a loading element and appends it to the target element.
> Tips:You can also use the function alias `showLoading`
## [Toast](docs/toast.md)
Displays a toast message with customizable options.
## [Offcanvas](docs/offcanvas.md)
Creates an offcanvas element with the given content and options.
## [Load](docs/load.md)
Loads content or remote page into a Bootstrap 5 modal dialog with customizable options.supports default dragging, zooming, and maximizing of the modal window.
# Internationalization
bs5dialog includes internationalization support through the i18n module. To use it, import the desired language file:
```
import { i18n } from 'bs5dialog';
```
Then, set the language using the setLanguage function:
```
bs5dialog.i18n.setCurrentLang("zh")
```
# Acknowledgments
[twbs/bootstrap](https://github.com/twbs/bootstrap)
[tabler/tabler](https://github.com/tabler/tabler)
A lot of inspiration and styling comes from these great libraries, big thanks to them
# License
This project is licensed under the MIT License - see the [LICENSE.md](LICENSE.md) file for details