flicker-alerts 1.0.35 → 1.0.37

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/index.js +66 -9
  2. package/package.json +2 -2
package/index.js CHANGED
@@ -1,3 +1,6 @@
1
+
2
+
3
+
1
4
  const FlickerAlerts = {
2
5
  showAlert: function ({ type, title, message, timer = 3000, position = 'top-right' }) {
3
6
  if (typeof window !== 'undefined' && typeof document !== 'undefined') {
@@ -6,8 +9,8 @@ const FlickerAlerts = {
6
9
  container = document.createElement('div');
7
10
  container.id = 'alerts-container';
8
11
  container.style.position = 'fixed';
9
- container.style.top = '0';
10
- container.style.left = '0';
12
+ container.style.top = 0;
13
+ container.style.left = 0;
11
14
  container.style.width = '100vw';
12
15
  container.style.height = '100vh';
13
16
  container.style.pointerEvents = 'none';
@@ -15,7 +18,8 @@ const FlickerAlerts = {
15
18
  }
16
19
 
17
20
  const alertBox = document.createElement('div');
18
- alertBox.className = `notification ${type} ${position}`;
21
+ alertBox.className = `notification ${type}`;
22
+ alertBox.classList.add(position);
19
23
 
20
24
  // Ícone
21
25
  const icon = document.createElement('div');
@@ -32,14 +36,15 @@ const FlickerAlerts = {
32
36
  // Divisor
33
37
  const divider = document.createElement('div');
34
38
  divider.className = 'divider';
39
+ console.log(`Created divider for ${type}`); // Para depuração
35
40
  alertBox.appendChild(divider);
36
-
41
+
37
42
  // Conteúdo
38
43
  const content = document.createElement('div');
39
44
  content.innerHTML = `<div class="title">${title}</div><div class="message">${message}</div>`;
40
45
  alertBox.appendChild(content);
41
46
 
42
- // Barra de progresso
47
+ // Barra de carregamento
43
48
  const progressBar = document.createElement('div');
44
49
  progressBar.className = 'progress-bar';
45
50
  progressBar.style.animationDuration = `${timer}ms`;
@@ -70,16 +75,42 @@ const FlickerAlerts = {
70
75
  },
71
76
  };
72
77
 
78
+
79
+
80
+
81
+ // Botões de teste - Eles podem ser removidos se não forem necessários
82
+ if (typeof document !== 'undefined') {
83
+ document.getElementById('success-btn')?.addEventListener('click', () => {
84
+ FlickerAlerts.showAlert({ type: 'success', title: 'Sucesso!', message: 'Essa mensagem é personalizável.' });
85
+ });
86
+
87
+ document.getElementById('info-btn')?.addEventListener('click', () => {
88
+ FlickerAlerts.showAlert({ type: 'info', title: 'Informação!', message: 'Essa mensagem é personalizável.' });
89
+ });
90
+
91
+ document.getElementById('warning-btn')?.addEventListener('click', () => {
92
+ FlickerAlerts.showAlert({ type: 'warning', title: 'Alerta!', message: 'Essa mensagem é personalizável.' });
93
+ });
94
+
95
+ document.getElementById('error-btn')?.addEventListener('click', () => {
96
+ FlickerAlerts.showAlert({ type: 'danger', title: 'Erro!', message: 'Essa mensagem é personalizável.' });
97
+ });
98
+ }
99
+
100
+ // Exportação
101
+
102
+
103
+
73
104
  const FlickerModals = {
74
- showModal: function ({ type, title, message, onConfirm, onCancel }) {
105
+ showModal: function ({ type, title, message, onConfirm, onCancel }) {
75
106
  if (typeof window !== 'undefined' && typeof document !== 'undefined') {
76
107
  let container = document.getElementById('modals-container');
77
108
  if (!container) {
78
109
  container = document.createElement('div');
79
110
  container.id = 'modals-container';
80
111
  container.style.position = 'fixed';
81
- container.style.top = '0';
82
- container.style.left = '0';
112
+ container.style.top = 0;
113
+ container.style.left = 0;
83
114
  container.style.width = '100vw';
84
115
  container.style.height = '100vh';
85
116
  container.style.pointerEvents = 'none';
@@ -176,4 +207,30 @@ const FlickerModals = {
176
207
  }
177
208
  };
178
209
 
179
- export default { FlickerAlerts, FlickerModals };
210
+ // Botões de teste - Eles podem ser removidos se não forem necessários
211
+ if (typeof document !== 'undefined') {
212
+ document.getElementById('modal-warning-btn')?.addEventListener('click', () => {
213
+ FlickerModals.showModal({
214
+ type: 'warning',
215
+ title: 'Tem certeza que deseja aceitar?',
216
+ message: 'Você tem certeza que deseja aceitar isso?',
217
+ onConfirm: () => { console.log('Confirmado!'); },
218
+ onCancel: () => { console.log('Cancelado!'); }
219
+ });
220
+ });
221
+
222
+ document.getElementById('modal-delete-btn')?.addEventListener('click', () => {
223
+ FlickerModals.showModal({
224
+ type: 'delete',
225
+ title: 'Tem certeza que deseja deletar?',
226
+ message: 'Você tem certeza que deseja deletar isso?',
227
+ onConfirm: () => { console.log('Deletado com sucesso!'); },
228
+ onCancel: () => { console.log('Cancelado!'); }
229
+ });
230
+ });
231
+ }
232
+
233
+
234
+
235
+
236
+ export default FlickerAlerts;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "flicker-alerts",
3
- "version": "1.0.35",
3
+ "version": "1.0.37",
4
4
  "description": "Biblioteca para alertas animados",
5
5
  "main": "index.js",
6
6
  "types": "index.d.ts",
@@ -16,6 +16,6 @@
16
16
  "author": "https://www.linkedin.com/in/bruno-carneiro-9a51aa190/",
17
17
  "license": "MIT",
18
18
  "dependencies": {
19
- "flicker-alerts": "^1.0.35"
19
+ "flicker-alerts": "^1.0.37"
20
20
  }
21
21
  }