flicker-alerts 1.0.7 → 1.0.9

package/index.js

@@ -2,6 +2,16 @@ const FlickerAlerts = {
     showAlert: function ({ type, title, message, timer = 3000 }) {
       // Verifique se está no ambiente do navegador (client-side) antes de tentar manipular o DOM
       if (typeof window !== 'undefined' && typeof document !== 'undefined') {
+        // Garantir que o container de alertas exista, se não, criá-lo
+        let container = document.getElementById('alerts-container');
+        if (!container) {
+          // Cria o container se ele não existir
+          container = document.createElement('div');
+          container.id = 'alerts-container';
+          container.className = 'top-right';  // Aplica a classe para posicionar no topo direito
+          document.body.appendChild(container); // Adiciona o container ao body
+        }
+  
         // Criação do alerta
         const alertBox = document.createElement('div');
         alertBox.className = `alert-custom alert-${type}`;
@@ -36,10 +46,7 @@ const FlickerAlerts = {
         alertBox.appendChild(progressBar);
   
         // Adicionar ao container
-        const container = document.getElementById('alerts-container');
-        if (container) {
-          container.appendChild(alertBox);
-        }
+        container.appendChild(alertBox);
   
         // Remoção automática após o tempo especificado
         setTimeout(() => alertBox.remove(), timer);

package/package.json

@@ -1,9 +1,10 @@
 {
   "name": "flicker-alerts",
-  "version": "1.0.7",
+  "version": "1.0.9",
   "description": "Biblioteca para alertas animados",
   "main": "index.js",
-  "types": "index.d.ts", 
+  "types": "index.d.ts",
+  "style": "style.css", 
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"
   },

package/style.css

@@ -1,3 +1,4 @@
+/* Estilo geral para o alerta */
 .alert-custom {
     display: flex;
     align-items: center;
@@ -67,6 +68,7 @@
     color: #777; /* Cor mais escura no hover */
 }
 
+/* Estilos para os tipos de alerta */
 .alert-success {
     border-left: 0.25rem solid #28a745;
 }
@@ -103,6 +105,7 @@
     color: white;
 }
 
+/* Classe para o container de alertas no topo direito */
 .top-right {
     position: fixed;
     top: 1rem;
@@ -113,6 +116,7 @@
     z-index: 1050;
 }
 
+/* Barra de progresso */
 .progress-bar {
     position: absolute;
     bottom: 0;
@@ -138,6 +142,7 @@
     background-color: #dc3545;
 }
 
+/* Animação de progresso */
 @keyframes load {
     from {
         width: 0;