itzbandhan-prompterx 🚀

A lightweight, modern, and fully customizable JavaScript library to replace the native browser alert(), prompt(), and confirm().

itzbandhan-prompterx provides non-blocking, Promise-based dialogs that are visually stunning, accessible, and injection-ready with zero dependencies.

🔗 Live Demo

Check out the library in action here: 👉 Live Demo on GitHub Pages

✨ Features

• 📦 Zero Dependencies: Pure JavaScript, no bulky frameworks required.
• 🚦 Non-Blocking: Built on Promises; doesn't freeze the main thread.
• 🎭 Theme Support: 8+ built-in themes (Success, Dark, Glass, Minimal, etc.).
• 🎨 Full Customization: Control colors, fonts, borders, and backdrop blurs.
• 🎹 Keyboard Support: Enter to submit, Esc to cancel.
• 🔄 Smart Queue: Automatically handles multiple dialogs in sequence.
• ♿ Accessible: ARIA-compliant and focus-trapped for screen readers.

📦 Installation

Install the package via npm:

npm install itzbandhan-prompterx

🚀 Usage

1. Simple Alert

Replaces the native alert().

import { setAlert } from 'itzbandhan-prompterx';

await setAlert("Settings saved successfully!", "success");

2. Modern Prompt

Replaces the native prompt().

import { setPrompt } from 'itzbandhan-prompterx';

const name = await setPrompt("Enter your developer name:", "dark");
if (name) {
    console.log(`Hello, ${name}!`);
}

3. Confirmation (Ask)

Replaces the native confirm().

import { setAsk } from 'itzbandhan-prompterx';

const confirmed = await setAsk("Do you want to delete this file?", "error");
if (confirmed) {
    // Perform delete logic
}

🎨 Theme System

Built-in Presets

Simply pass the theme name as the second argument:

• success / error / info / warning
• dark / light
• glass (Frosted glass effect)
• minimal (Sharp corners, high contrast)
• modern (Soft shadows, rounded)

Custom Styling

Pass a configuration object for total control:

setPrompt("Custom Action", {
  backgroundColor: "#111",
  textColor: "#00ff00",
  buttonColor: "#222",
  buttonTextColor: "#00ff00",
  borderRadius: "12px",
  fontFamily: "monospace",
  backdrop: "blur(10px)"
});

🛠 API Reference

setAlert(message, options)

| Parameter | Type | Description | | --- | --- | --- | | message | String | The text content of the alert. | | options | String | Object |

setPrompt(message, options)

| Parameter | Type | Description | | --- | --- | --- | | message | String | The label for the input field. | | options | String | Object | | Returns | Promise | Resolves to String (input) or null (cancelled). |

setAsk(message, options)

| Parameter | Type | Description | | --- | --- | --- | | message | String | The question to be confirmed. | | options | String | Object | | Returns | Promise | Resolves to true (OK) or false (Cancel). |

🧠 Technical Details

The Queue Manager

If your application triggers multiple dialogs at once, PrompterX manages a global queue. Dialogs will display one-by-one in the order they were called to ensure a smooth user experience.

setAlert("First Message");
setAlert("Second Message"); // This waits until the first is closed.

📄 License

Distributed under the MIT License. See LICENSE for more information.

Developed by Itzbandhan.