# Rence Alert
A beautiful, responsive, customizable, and accessible replacement for JavaScript's standard popup boxes. Designed with strict adherence to **Material Design 3**, Rence Alert elevates the styling of standard windows alerts with beautiful enter/exit animations, promise-based confirm/cancel features, and modern Toasts.
## Features
- **Zero Dependencies**: Core logic is completely standalone.
- **Material Design 3**: Fully compliant with M3 elevation shadows, corner radiuses, and spring-physics.
- **Promise Based**: Easy integration with React/Next.js using `.then()` for handling dismissals and confirmations.
- **Cancel Support**: Add cancel buttons effortlessly to ensure absolute user intent before taking destructive action.
- **Toasts**: Modern light-themed snackbars that slide in natively.
## Installation
### Method 1: jsDelivr CDN
Use the jsDelivr CDN to automatically sync directly to raw GitHub releases for vanilla HTML projects.
```html
```
### Method 2: NPM
*(If published to NPM registry later)*
```bash
npm install rence-alert
```
## Basic Usage (HTML / Vanilla JS)
```html
```
## Advanced Usage (React / Next.js)
Because RenceAlert mounts standard promises, you can use it confidently in React handler arrays:
```tsx
export default function DeleteButton() {
const handleDelete = () => {
RenceAlert.fire({
title: 'Warning',
text: 'Do you want to drop this database?',
icon: 'warning',
showCancelButton: true
}).then((res) => {
if(res.isConfirmed) {
console.log("Database Deleted");
}
});
};
return ;
}
```
## Designed By
Designed and Built by **David Abalaku**.