flicker-alerts 1.0.33 → 1.0.35

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 (3) hide show
  1. package/index.d.ts +14 -18
  2. package/index.js +8 -52
  3. package/package.json +2 -2
package/index.d.ts CHANGED
@@ -1,29 +1,25 @@
1
1
  declare module 'flicker-alerts' {
2
- // Definição das opções para os alertas
3
- interface AlertOptions {
4
- type: 'success' | 'info' | 'warning' | 'danger'; // Tipos de alerta disponíveis
2
+ export interface AlertOptions {
3
+ type: 'success' | 'info' | 'warning' | 'danger';
5
4
  title: string;
6
5
  message: string;
7
- timer?: number; // Duração opcional do alerta (em milissegundos)
8
- position?: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left' | 'center' | 'top-center' | 'bottom-center'; // Posições possíveis do alerta
6
+ timer?: number;
7
+ position?: 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left' | 'center' | 'top-center' | 'bottom-center';
9
8
  }
10
9
 
11
- // Definição das opções para os modais
12
- interface ModalOptions {
13
- type: 'warning' | 'delete' ; // Tipos de modal disponíveis
10
+ export interface ModalOptions {
11
+ type: 'warning' | 'delete';
14
12
  title: string;
15
13
  message: string;
16
- onConfirm?: () => void; // Função executada no botão de confirmação
17
- onCancel?: () => void; // Função executada no botão de cancelamento
18
- timer?: number; // Duração opcional do modal (em milissegundos)
14
+ onConfirm?: () => void;
15
+ onCancel?: () => void;
16
+ timer?: number;
19
17
  }
20
18
 
21
- // Classe principal para a biblioteca FlickerAlerts
22
- export default class FlickerAlerts {
23
- // Método estático para mostrar um alerta
24
- static showAlert(options: AlertOptions): void;
19
+ const FlickerAlerts: {
20
+ showAlert(options: AlertOptions): void;
21
+ showModal(options: ModalOptions): void;
22
+ };
25
23
 
26
- // Método estático para mostrar um modal
27
- static showModal(options: ModalOptions): void;
28
- }
24
+ export default FlickerAlerts;
29
25
  }
package/index.js CHANGED
@@ -6,8 +6,8 @@ const FlickerAlerts = {
6
6
  container = document.createElement('div');
7
7
  container.id = 'alerts-container';
8
8
  container.style.position = 'fixed';
9
- container.style.top = 0;
10
- container.style.left = 0;
9
+ container.style.top = '0';
10
+ container.style.left = '0';
11
11
  container.style.width = '100vw';
12
12
  container.style.height = '100vh';
13
13
  container.style.pointerEvents = 'none';
@@ -15,8 +15,7 @@ const FlickerAlerts = {
15
15
  }
16
16
 
17
17
  const alertBox = document.createElement('div');
18
- alertBox.className = `notification ${type}`;
19
- alertBox.classList.add(position);
18
+ alertBox.className = `notification ${type} ${position}`;
20
19
 
21
20
  // Ícone
22
21
  const icon = document.createElement('div');
@@ -33,7 +32,6 @@ const FlickerAlerts = {
33
32
  // Divisor
34
33
  const divider = document.createElement('div');
35
34
  divider.className = 'divider';
36
- console.log(`Created divider for ${type}`); // Para depuração
37
35
  alertBox.appendChild(divider);
38
36
 
39
37
  // Conteúdo
@@ -41,7 +39,7 @@ const FlickerAlerts = {
41
39
  content.innerHTML = `<div class="title">${title}</div><div class="message">${message}</div>`;
42
40
  alertBox.appendChild(content);
43
41
 
44
- // Barra de carregamento
42
+ // Barra de progresso
45
43
  const progressBar = document.createElement('div');
46
44
  progressBar.className = 'progress-bar';
47
45
  progressBar.style.animationDuration = `${timer}ms`;
@@ -72,35 +70,16 @@ const FlickerAlerts = {
72
70
  },
73
71
  };
74
72
 
75
- // Botões de teste - Eles podem ser removidos se não forem necessários
76
- if (typeof document !== 'undefined') {
77
- document.getElementById('success-btn')?.addEventListener('click', () => {
78
- FlickerAlerts.showAlert({ type: 'success', title: 'Sucesso!', message: 'Essa mensagem é personalizável.' });
79
- });
80
-
81
- document.getElementById('info-btn')?.addEventListener('click', () => {
82
- FlickerAlerts.showAlert({ type: 'info', title: 'Informação!', message: 'Essa mensagem é personalizável.' });
83
- });
84
-
85
- document.getElementById('warning-btn')?.addEventListener('click', () => {
86
- FlickerAlerts.showAlert({ type: 'warning', title: 'Alerta!', message: 'Essa mensagem é personalizável.' });
87
- });
88
-
89
- document.getElementById('error-btn')?.addEventListener('click', () => {
90
- FlickerAlerts.showAlert({ type: 'danger', title: 'Erro!', message: 'Essa mensagem é personalizável.' });
91
- });
92
- }
93
-
94
73
  const FlickerModals = {
95
- showModal: function ({ type, title, message, timer = 3000, onConfirm, onCancel }) {
74
+ showModal: function ({ type, title, message, onConfirm, onCancel }) {
96
75
  if (typeof window !== 'undefined' && typeof document !== 'undefined') {
97
76
  let container = document.getElementById('modals-container');
98
77
  if (!container) {
99
78
  container = document.createElement('div');
100
79
  container.id = 'modals-container';
101
80
  container.style.position = 'fixed';
102
- container.style.top = 0;
103
- container.style.left = 0;
81
+ container.style.top = '0';
82
+ container.style.left = '0';
104
83
  container.style.width = '100vw';
105
84
  container.style.height = '100vh';
106
85
  container.style.pointerEvents = 'none';
@@ -197,27 +176,4 @@ const FlickerModals = {
197
176
  }
198
177
  };
199
178
 
200
- // Botões de teste - Eles podem ser removidos se não forem necessários
201
- if (typeof document !== 'undefined') {
202
- document.getElementById('modal-warning-btn')?.addEventListener('click', () => {
203
- FlickerModals.showModal({
204
- type: 'warning',
205
- title: 'Tem certeza que deseja aceitar?',
206
- message: 'Você tem certeza que deseja aceitar isso?',
207
- onConfirm: () => { console.log('Confirmado!'); },
208
- onCancel: () => { console.log('Cancelado!'); }
209
- });
210
- });
211
-
212
- document.getElementById('modal-delete-btn')?.addEventListener('click', () => {
213
- FlickerModals.showModal({
214
- type: 'delete',
215
- title: 'Tem certeza que deseja deletar?',
216
- message: 'Você tem certeza que deseja deletar isso?',
217
- onConfirm: () => { console.log('Deletado com sucesso!'); },
218
- onCancel: () => { console.log('Cancelado!'); }
219
- });
220
- });
221
- }
222
-
223
- export default FlickerAlerts;
179
+ export default { FlickerAlerts, FlickerModals };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "flicker-alerts",
3
- "version": "1.0.33",
3
+ "version": "1.0.35",
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.33"
19
+ "flicker-alerts": "^1.0.35"
20
20
  }
21
21
  }