customizable-toast-notification 3.4.0 → 3.4.1
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.
- package/README.md +31 -14
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -21,23 +21,28 @@ A **lightweight**, **zero-dependency** toast notification library for modern Jav
|
|
|
21
21
|
|
|
22
22
|
### NPM/Yarn
|
|
23
23
|
|
|
24
|
+
```bash
|
|
24
25
|
npm install customizable-toast-notification
|
|
26
|
+
```
|
|
25
27
|
|
|
26
28
|
or
|
|
27
|
-
yarn add customizable-toast-notification
|
|
28
29
|
|
|
29
|
-
|
|
30
|
+
```bash
|
|
31
|
+
yarn add customizable-toast-notification
|
|
32
|
+
```
|
|
30
33
|
|
|
31
34
|
### CDN (UMD Build)
|
|
32
35
|
|
|
36
|
+
```bash
|
|
33
37
|
<script src="https://cdn.jsdelivr.net/npm/customizable-toast-notification@latest/dist/index.umd.js"></script>
|
|
34
|
-
|
|
35
|
-
text
|
|
38
|
+
```
|
|
36
39
|
|
|
37
40
|
## 🚀 Quick Start
|
|
38
41
|
|
|
39
42
|
### ES Modules
|
|
40
43
|
|
|
44
|
+
```json
|
|
45
|
+
|
|
41
46
|
import { createToast, setDefaultColors, setDefaultMessages } from 'customizable-toast-notification';
|
|
42
47
|
|
|
43
48
|
// Simple usage
|
|
@@ -47,13 +52,16 @@ type: "success",
|
|
|
47
52
|
duration: 3000
|
|
48
53
|
});
|
|
49
54
|
|
|
50
|
-
|
|
55
|
+
```
|
|
51
56
|
|
|
52
57
|
### CDN/Browser
|
|
53
58
|
|
|
54
|
-
|
|
59
|
+
```json
|
|
60
|
+
|
|
61
|
+
<script src="https://cdn.jsdelivr.net/npm/customizable-toast-notification@latest/dist/index.umd.js"></script>
|
|
62
|
+
<script> customizableToast.createToast({ message: "Hello from CDN!", type: "success", position: "top-right" }); </script>
|
|
55
63
|
|
|
56
|
-
|
|
64
|
+
```
|
|
57
65
|
|
|
58
66
|
## 📖 API Reference
|
|
59
67
|
|
|
@@ -81,11 +89,17 @@ Creates and displays a toast notification.
|
|
|
81
89
|
|
|
82
90
|
#### Position Options
|
|
83
91
|
|
|
92
|
+
```josn
|
|
93
|
+
|
|
84
94
|
- `"top-left"`, `"top-right"`, `"top-center"`
|
|
85
95
|
- `"bottom-left"`, `"bottom-right"`, `"bottom-center"`
|
|
86
96
|
|
|
97
|
+
```
|
|
98
|
+
|
|
87
99
|
### `setDefaultColors(colors)`
|
|
88
100
|
|
|
101
|
+
```json
|
|
102
|
+
|
|
89
103
|
Configure default colors for toast types.
|
|
90
104
|
|
|
91
105
|
setDefaultColors({
|
|
@@ -95,10 +109,11 @@ warning: "#f59e0b",
|
|
|
95
109
|
info: "#3b82f6"
|
|
96
110
|
});
|
|
97
111
|
|
|
98
|
-
|
|
112
|
+
```
|
|
99
113
|
|
|
100
114
|
### `setDefaultMessages(messages)`
|
|
101
115
|
|
|
116
|
+
```json
|
|
102
117
|
Configure default messages for toast types.
|
|
103
118
|
|
|
104
119
|
setDefaultMessages({
|
|
@@ -108,12 +123,13 @@ warning: "Please check your input!",
|
|
|
108
123
|
info: "Here's some information!"
|
|
109
124
|
});
|
|
110
125
|
|
|
111
|
-
|
|
126
|
+
```
|
|
112
127
|
|
|
113
128
|
## 💡 Examples
|
|
114
129
|
|
|
115
130
|
### Basic Toast Types
|
|
116
131
|
|
|
132
|
+
```json
|
|
117
133
|
// Success
|
|
118
134
|
createToast({ type: "success", message: "Data saved!" });
|
|
119
135
|
|
|
@@ -126,10 +142,11 @@ createToast({ type: "warning", message: "Please confirm!" });
|
|
|
126
142
|
// Info
|
|
127
143
|
createToast({ type: "info", message: "New update available!" });
|
|
128
144
|
|
|
129
|
-
|
|
145
|
+
```
|
|
130
146
|
|
|
131
147
|
### Advanced Customization
|
|
132
148
|
|
|
149
|
+
```json
|
|
133
150
|
createToast({
|
|
134
151
|
message: "File uploading...",
|
|
135
152
|
type: "info",
|
|
@@ -145,8 +162,6 @@ animationDuration: "0.8s",
|
|
|
145
162
|
animationEasing: "ease-out"
|
|
146
163
|
});
|
|
147
164
|
|
|
148
|
-
text
|
|
149
|
-
|
|
150
165
|
### App-wide Configuration
|
|
151
166
|
|
|
152
167
|
// Set your brand colors once
|
|
@@ -168,7 +183,7 @@ info: "💡 Info! Here's a tip."
|
|
|
168
183
|
// Now just use types throughout your app
|
|
169
184
|
createToast({ type: "success" }); // Uses your custom colors & messages
|
|
170
185
|
|
|
171
|
-
|
|
186
|
+
```
|
|
172
187
|
|
|
173
188
|
## 🛡️ Reliability Features
|
|
174
189
|
|
|
@@ -200,12 +215,14 @@ Exciting times ahead! Looking for sponsors and eager to explore new collaboratio
|
|
|
200
215
|
|
|
201
216
|
### Development Setup
|
|
202
217
|
|
|
218
|
+
```bash
|
|
219
|
+
|
|
203
220
|
git clone https://github.com/sammy-cool/customizable-toast-notification.git
|
|
204
221
|
cd customizable-toast-notification
|
|
205
222
|
npm install
|
|
206
223
|
npm run build
|
|
207
224
|
|
|
208
|
-
|
|
225
|
+
```
|
|
209
226
|
|
|
210
227
|
## 📄 License
|
|
211
228
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "customizable-toast-notification",
|
|
3
|
-
"version": "3.4.
|
|
3
|
+
"version": "3.4.1",
|
|
4
4
|
"description": "A lightweight, zero-dependency toast notification library for modern JavaScript applications with production-grade reliability and comprehensive system mechanisms",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "dist/index.cjs",
|