AifMessages

A message and notification library for Angular based on SweetAlert2, with support for internationalization and predefined message types.

Installation

npm install aif-messages
Dependencies
This library requires:

sweetalert2 - For displaying message dialogs

Usage
Basic Import
typescript
import { 
  msg_success, 
  msg_error, 
  msg_warning, 
  msg_info, 
  msg_confirm,
  msg_input,
  msg_wait 
} from 'aif-messages';
Usage Examples
Success Message
typescript
// Simple
msg_success('Operation completed');

// With custom configuration
msg_success({
  title: 'Success!',
  message: 'Data saved successfully',
  confirm: {
    text: 'Accept',
    color: 'green'
  }
});
Error Message
typescript
// Simple
msg_error('Error processing request');

// With title and message
msg_error('Connection Error', 'Could not connect to server');
Warning Message
typescript
// Simple
msg_warning('Warning message');

// With title and message
msg_warning('Security Warning', 'This action may have security implications');
Info Message
typescript
// Simple
msg_info('Information message');

// With title and message
msg_info('System Update', 'New features are available in the latest version');
Confirmation Dialog
typescript
msg_confirm('Are you sure you want to delete this record?')
  .then((result) => {
    if (result.isConfirmed) {
      // Action if confirmed
      console.log('User confirmed');
    }
  });

// With custom configuration
msg_confirm({
  title: 'Confirm Action',
  text: 'This action cannot be undone',
  confirmButtonText: 'Yes, delete it',
  cancelButtonText: 'Cancel',
  confirmButtonColor: 'red'
});
Input Dialog
typescript
msg_input({
  title: 'Enter your name',
  text: 'Please enter your full name',
  input: 'text'
}).then((result) => {
  if (result.isConfirmed) {
    console.log('Name entered:', result.value);
  }
});

// Email input example
msg_input({
  title: 'Email Address',
  text: 'Please enter your email',
  input: 'email',
  inputPlaceholder: '[email protected]'
});
Wait Message
typescript
// Show wait message
const closeWait = msg_wait('Processing...');

// Perform some async operation
setTimeout(() => {
  // Close the wait message
  closeWait();
}, 2000);

// With custom configuration
const closeCustomWait = msg_wait({
  title: 'Loading',
  text: 'Please wait while we process your request',
  allowOutsideClick: false
});
Internationalization
Default Messages
The library includes default English messages:

typescript
{
  'success.title': 'Success',
  'success.message': 'Operation completed successfully.',
  'warning.title': 'Warning',
  'warning.message': 'This is a warning message.',
  'info.title': 'Information',
  'info.message': 'This is an informational message.',
  'error.title': 'Error',
  'error.message': 'An error has occurred.',
  'input.title': 'Input Required',
  'input.message': 'Please provide the required input.',
  'confirm.message': 'Are you sure you want to proceed?',
  'btn.ok': 'OK',
  'btn.cancel': 'Cancel'
}
Customize Messages
typescript
import { msg_load_lang } from 'aif-messages';

// Spanish example
msg_load_lang({
  'success.title': 'Éxito',
  'success.message': 'Operación completada exitosamente.',
  'warning.title': 'Advertencia',
  'warning.message': 'Este es un mensaje de advertencia.',
  'info.title': 'Información',
  'info.message': 'Este es un mensaje informativo.',
  'error.title': 'Error',
  'error.message': 'Ha ocurrido un error.',
  'input.title': 'Entrada Requerida',
  'input.message': 'Por favor proporcione la entrada requerida.',
  'confirm.message': '¿Está seguro de que desea continuar?',
  'btn.ok': 'Aceptar',
  'btn.cancel': 'Cancelar'
});

// French example
msg_load_lang({
  'success.title': 'Succès',
  'success.message': 'Opération terminée avec succès.',
  'warning.title': 'Avertissement',
  'warning.message': 'Ceci est un message d\'avertissement.',
  'info.title': 'Information',
  'info.message': 'Ceci est un message informatif.',
  'error.title': 'Erreur',
  'error.message': 'Une erreur est survenue.',
  'input.title': 'Entrée Requise',
  'input.message': 'Veuillez fournir l\'entrée requise.',
  'confirm.message': 'Êtes-vous sûr de vouloir continuer?',
  'btn.ok': 'OK',
  'btn.cancel': 'Annuler'
});
Export Current Messages
typescript
import { msg_export_lang } from 'aif-messages';

const currentMessages = msg_export_lang();
console.log(currentMessages);
API Reference
Main Functions
msg_success(rd: string | object)
Displays a success message.

Parameters:

rd: String message or configuration object

Returns: Promise with SweetAlert2 result

msg_error(title: string, message?: string)
Displays an error message.

Parameters:

title: Error title or main message

message: Optional detailed message

Returns: Promise with SweetAlert2 result

msg_warning(title: string, message?: string)
Displays a warning message.

Parameters:

title: Warning title or main message

message: Optional detailed message

Returns: Promise with SweetAlert2 result

msg_info(title: string, message?: string)
Displays an informational message.

Parameters:

title: Info title or main message

message: Optional detailed message

Returns: Promise with SweetAlert2 result

msg_confirm(rd: string | object)
Displays a confirmation dialog.

Parameters:

rd: String message or configuration object

Returns: Promise with SweetAlert2 result

msg_input(rd: object)
Displays a data input dialog.

Parameters:

rd: Configuration object

Returns: Promise with SweetAlert2 result containing input value

msg_wait(rd: string | object)
Displays a wait message.

Parameters:

rd: String message or configuration object

Returns: Function to close the wait message

Internationalization Functions
msg_load_lang(messages: object)
Loads custom messages for internationalization.

Parameters:

messages: Object with key-value pairs for message translations

msg_export_lang()
Exports currently configured messages.

Returns: Object containing all current messages

Configuration Options
All functions accept a configuration object that can include:

Common Properties
Property	Type	Default	Description
title	string	-	Message title
message	string	-	Message content
text	string	-	Alternative text (alias for message)
icon	string	Type-specific	Icon type ('success', 'error', 'warning', 'info', 'question')
Button Properties
Property	Type	Default	Description
confirmButtonColor	string	Type-specific	Confirm button color
cancelButtonColor	string	Type-specific	Cancel button color
confirmButtonText	string	'OK'	Confirm button text
cancelButtonText	string	'Cancel'	Cancel button text
Behavior Properties
Property	Type	Default	Description
allowOutsideClick	boolean	true	Allow closing by clicking outside
allowEnterKey	boolean	true	Allow closing with Enter key
showCancelButton	boolean	false	Show cancel button
showConfirmButton	boolean	true	Show confirm button
Input Specific Properties
Property	Type	Default	Description
input	string	'text'	Input type ('text', 'email', 'password', 'number', 'tel', etc.)
inputPlaceholder	string	-	Input placeholder text
inputValue	string	-	Default input value
Advanced Usage
Chaining Messages
typescript
msg_confirm('Delete this item?')
  .then(result => {
    if (result.isConfirmed) {
      return msg_success('Item deleted successfully');
    } else {
      return msg_info('Deletion cancelled');
    }
  });
Custom Styling
typescript
msg_success({
  title: 'Custom Styled',
  message: 'This message has custom styling',
  confirmButtonColor: '#3085d6',
  cancelButtonColor: '#d33',
  customClass: {
    popup: 'custom-popup-class',
    title: 'custom-title-class'
  }
});
Async Operations with Wait
typescript
// Show wait message during async operation
const closeWait = msg_wait('Processing your request...');

fetch('/api/data')
  .then(response => response.json())
  .then(data => {
    closeWait();
    msg_success('Data loaded successfully');
  })
  .catch(error => {
    closeWait();
    msg_error('Failed to load data');
  });
Development
Building the Library
bash
ng build aif-messages
Running Tests
bash
ng test
Publishing
bash
cd dist/aif-messages
npm publish
Contributing
Fork the repository

Create a feature branch

Make your changes

Add tests if applicable

Submit a pull request

Support
For issues and feature requests, please open an issue on the GitHub repository.

License
ISC License

Changelog
Version 1.0.0
Initial release

Basic message types (success, error, warning, info)

Confirmation dialogs

Input dialogs

Wait messages

Internationalization support

This library is built with Angular and leverages SweetAlert2 for beautiful, responsive alerts and dialogs.

text