75 lines
1.5 KiB
TypeScript
75 lines
1.5 KiB
TypeScript
import Toastify from 'toastify-js'; // das Modul wird von node_modules ausgelesen und gebundlet. Funktioniert nur mit JS-Bundler
|
|
|
|
export type ToastVariant =
|
|
| 'primary'
|
|
| 'secondary'
|
|
| 'warning'
|
|
| 'success'
|
|
| 'info'
|
|
| 'error'
|
|
| 'danger'
|
|
| 'light'
|
|
| 'dark';
|
|
|
|
export interface ToastApi {
|
|
show: () => void;
|
|
}
|
|
|
|
const Toast = (text = '', variant: ToastVariant = 'primary'): ToastApi => {
|
|
const getColorByName = (variant = ''): string => {
|
|
let color: string;
|
|
switch (variant.trim().toLowerCase()) {
|
|
case 'primary':
|
|
color = '#0d6efd';
|
|
break;
|
|
case 'secondary':
|
|
color = '#6c757d';
|
|
break;
|
|
case 'warning':
|
|
color = '#ffc720';
|
|
break;
|
|
case 'success':
|
|
color = '#13653f';
|
|
break;
|
|
case 'info':
|
|
color = '#25cff2';
|
|
break;
|
|
case 'error':
|
|
case 'danger':
|
|
color = '#a52834';
|
|
break;
|
|
case 'light':
|
|
color = '#babbbc';
|
|
break;
|
|
case 'dark':
|
|
color = '#373b3e';
|
|
break;
|
|
|
|
default:
|
|
console.warn('variant not found');
|
|
color = 'white';
|
|
}
|
|
return color;
|
|
};
|
|
|
|
const show = (): void => {
|
|
Toastify({
|
|
text: text,
|
|
duration: 2000,
|
|
className: variant,
|
|
gravity: 'top', // `top` or `bottom`
|
|
position: 'center', // `left`, `center` or `right`
|
|
stopOnFocus: true, // Prevents dismissing of toast on hover
|
|
style: {
|
|
background: getColorByName(variant),
|
|
},
|
|
}).showToast();
|
|
};
|
|
|
|
return {
|
|
show,
|
|
};
|
|
};
|
|
|
|
export default Toast;
|