Testing Alpha

resources/assets/js/notifications/drivers/notyf-driver.js

@@ -0,0 +1,17 @@
+import { Notyf } from 'notyf';
+import 'notyf/notyf.min.css';
+
+const notyf = new Notyf({
+    duration: 5000,
+    ripple: true,
+    position: { x: 'right', y: 'top' },
+});
+
+export const NotyfDriver = {
+    notify({ type = 'success', message = '' }) {
+        notyf.open({
+            type,
+            message,
+        });
+    },
+};

resources/assets/js/notifications/drivers/sweetalert-driver.js

@@ -0,0 +1,15 @@
+export const SweetAlertDriver = {
+    async notify(options = {}) {
+        const Swal = (await import('sweetalert2')).default;
+
+        Swal.fire({
+            icon: options.type || 'info',
+            title: options.title || '',
+            text: options.message || '',
+            timer: options.delay || 5000,
+            timerProgressBar: true,
+            showConfirmButton: false,
+            ...options,
+        });
+    },
+};

resources/assets/js/notifications/drivers/toastify-driver.js

@@ -0,0 +1,15 @@
+import Toastify from 'toastify-js';
+import 'toastify-js/src/toastify.css';
+
+export const ToastifyDriver = {
+    notify({ message = '', type = 'default', duration = 4000, position = 'right' }) {
+        Toastify({
+            text: message,
+            duration: duration,
+            gravity: 'top',
+            position: position,
+            className: `toastify-${type}`,
+            close: true,
+        }).showToast();
+    },
+};

resources/assets/js/notifications/drivers/toastr-driver.js

@@ -0,0 +1,87 @@
+// resources/js/vuexy/notifications/vuexy-toastr.js
+
+import toastr from 'toastr';
+
+export const ToastrDriver = {
+    defaultOptions: {
+        closeButton: true,
+        progressBar: true,
+        tapToDismiss: true,
+        newestOnTop: true,
+        positionClass: 'toast-top-right',
+        timeOut: 5000,
+        extendedTimeOut: 1000,
+        showDuration: 300,
+        hideDuration: 300,
+        showMethod: 'fadeIn',
+        hideMethod: 'fadeOut',
+    },
+
+    /**
+     * Notifica usando toastr con opciones personalizadas
+     */
+    notify({
+        type = 'success',
+        message = '',
+        title = '',
+        delay = 5000,
+        position = 'toast-top-right',
+        closeButton = true,
+        progressBar = true,
+        iconClass = null,
+        extraOptions = {}
+    } = {}) {
+        const timeOut = delay;
+        const extendedTimeOut = delay + 1000;
+
+        toastr.options = {
+            ...this.defaultOptions,
+            closeButton,
+            progressBar,
+            timeOut,
+            extendedTimeOut,
+            positionClass: position,
+            ...extraOptions
+        };
+
+        if (iconClass) {
+            toastr.options.iconClass = iconClass;
+        }
+
+        if (toastr[type]) {
+            toastr[type](message, title);
+        } else {
+            toastr.info(message || 'Sin mensaje');
+        }
+
+        if (import.meta.env.DEV) {
+            console.debug(`[TOAST ${type.toUpperCase()}] ${title}: ${message}`);
+        }
+    },
+
+    success(message, title = 'Éxito', delay = 4000, options = {}) {
+        this.notify({ type: 'success', message, title, delay, ...options });
+    },
+
+    error(message, title = 'Error', delay = 6000, options = {}) {
+        this.notify({ type: 'error', message, title, delay, ...options });
+    },
+
+    warning(message, title = 'Advertencia', delay = 5000, options = {}) {
+        this.notify({ type: 'warning', message, title, delay, ...options });
+    },
+
+    info(message, title = 'Información', delay = 5000, options = {}) {
+        this.notify({ type: 'info', message, title, delay, ...options });
+    },
+
+    /**
+     * Inicializa listeners para eventos globales como vuexy:notify
+     */
+    listenToGlobalEvents() {
+        window.addEventListener('vuexy:notify', (event) => {
+            const detail = event.detail || {};
+            this.notify(detail);
+        });
+    }
+};

resources/assets/js/notifications/drivers/vuexy-driver.js

@@ -0,0 +1,47 @@
+// drivers/vuexy-driver.js
+
+export const VuexyDriver = {
+    notify({ message, type = 'info', target = 'body', delay = 3000 }) {
+        const event = new CustomEvent('vuexy:notify', {
+            detail: { type, message, target, delay }
+        });
+
+        window.dispatchEvent(event);
+    },
+
+    success(message, target = 'body', delay = 3000) {
+        this.notify({ type: 'success', message, target, delay });
+    },
+
+    error(message, target = 'body', delay = 3000) {
+        this.notify({ type: 'error', message, target, delay });
+    },
+
+    info(message, target = 'body', delay = 3000) {
+        this.notify({ type: 'info', message, target, delay });
+    },
+
+    warning(message, target = 'body', delay = 3000) {
+        this.notify({ type: 'warning', message, target, delay });
+    },
+
+    fromStorage() {
+        const storageData = localStorage.getItem('vuexy_notification');
+
+        if (storageData) {
+            try {
+                this.notify(JSON.parse(storageData));
+                localStorage.removeItem('vuexy_notification');
+            } catch (e) {
+                console.error('[VuexyDriver] Error parseando notificación', e);
+            }
+        }
+    },
+
+    fromSession() {
+        if (window.vuexySessionNotification) {
+            this.notify(window.vuexySessionNotification);
+            window.vuexySessionNotification = null;
+        }
+    }
+};