@r01al/simple-toast 1.0.3 → 1.0.5
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/dist/simple-toast.cjs.js +52 -49
- package/dist/simple-toast.esm.js +52 -49
- package/dist/simple-toast.esm.min.js +1 -0
- package/dist/simple-toast.min.js +1 -1
- package/dist/simple-toast.umd.js +52 -49
- package/package.json +6 -5
package/dist/simple-toast.cjs.js
CHANGED
|
@@ -46,14 +46,14 @@ function _toPropertyKey(t) {
|
|
|
46
46
|
return "symbol" == typeof i ? i : i + "";
|
|
47
47
|
}
|
|
48
48
|
|
|
49
|
-
|
|
49
|
+
var defaultConfig = {
|
|
50
50
|
position: 'bc',
|
|
51
51
|
duration: 3000,
|
|
52
52
|
theme: 'l',
|
|
53
53
|
dismissible: true,
|
|
54
54
|
maxToasts: 10
|
|
55
55
|
};
|
|
56
|
-
|
|
56
|
+
var globalConfig = _objectSpread2({}, defaultConfig);
|
|
57
57
|
function configure(config) {
|
|
58
58
|
globalConfig = _objectSpread2(_objectSpread2({}, globalConfig), config);
|
|
59
59
|
}
|
|
@@ -61,17 +61,17 @@ function getConfig() {
|
|
|
61
61
|
return globalConfig;
|
|
62
62
|
}
|
|
63
63
|
|
|
64
|
-
|
|
64
|
+
var stylesInjected = false;
|
|
65
65
|
function injectStyles() {
|
|
66
66
|
if (stylesInjected) return;
|
|
67
|
-
|
|
67
|
+
var style = document.createElement('style');
|
|
68
68
|
style.setAttribute('data-r01st', '');
|
|
69
69
|
style.textContent = "\n.r01st-container {\n position: fixed;\n z-index: 9999;\n pointer-events: none;\n padding: 16px;\n}\n.r01st-container[data-position=\"tl\"] {\n top: 0;\n left: 0;\n}\n\n.r01st-container[data-position=\"tc\"] {\n top: 0;\n left: 50%;\n margin-left: -210px;\n}\n\n.r01st-container[data-position=\"tr\"] {\n top: 0;\n right: 0;\n}\n.r01st-container[data-position=\"ml\"] {\n top: 50%;\n left: 0;\n margin-top: -50px;\n}\n\n.r01st-container[data-position=\"mc\"] {\n top: 50%;\n left: 50%;\n margin-left: -210px;\n margin-top: -50px;\n}\n\n.r01st-container[data-position=\"mr\"] {\n top: 50%;\n right: 0;\n margin-top: -50px;\n}\n.r01st-container[data-position=\"bl\"] {\n bottom: 0;\n left: 0;\n}\n\n.r01st-container[data-position=\"bc\"] {\n bottom: 0;\n left: 50%;\n margin-left: -210px;\n}\n\n.r01st-container[data-position=\"br\"] {\n bottom: 0;\n right: 0;\n}\n.r01st {\n pointer-events: auto;\n position: relative;\n min-width: 280px;\n max-width: 420px;\n padding: 16px;\n margin-bottom: 16px;\n border-radius: 8px;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n font-size: 14px;\n line-height: 1.5;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;\n color: #ffffff;\n opacity: 0;\n transition: opacity 0.3s ease, margin-top 0.3s ease;\n margin-top: -20px;\n}\n.r01st-show {\n opacity: 1;\n margin-top: 0;\n}\n.r01st-container[data-theme=\"l\"] .r01st-success {\n background-color: #10b981;\n}\n\n.r01st-container[data-theme=\"l\"] .r01st-error {\n background-color: #ef4444;\n}\n\n.r01st-container[data-theme=\"l\"] .r01st-info {\n background-color: #3b82f6;\n}\n\n.r01st-container[data-theme=\"l\"] .r01st-warning {\n background-color: #f59e0b;\n}\n.r01st-container[data-theme=\"d\"] .r01st-success {\n background-color: #059669;\n}\n\n.r01st-container[data-theme=\"d\"] .r01st-error {\n background-color: #dc2626;\n}\n\n.r01st-container[data-theme=\"d\"] .r01st-info {\n background-color: #2563eb;\n}\n\n.r01st-container[data-theme=\"d\"] .r01st-warning {\n background-color: #d97706;\n}\n.r01st-content {\n display: inline-block;\n width: 100%;\n vertical-align: top;\n}\n.r01st-table {\n width: 100%;\n border-collapse: collapse;\n}\n.r01st-cell {\n vertical-align: middle;\n}\n.r01st-message-cell {\n width: 100%;\n}\n.r01st-close-cell {\n width: 1%;\n padding-left: 8px;\n}\n.r01st-icon {\n display: inline-block;\n width: 20px;\n height: 20px;\n vertical-align: middle;\n margin-right: 12px;\n}\n\n.r01st-icon svg {\n width: 100%;\n height: 100%;\n display: block;\n}\n.r01st-message {\n display: inline-block;\n vertical-align: middle;\n word-wrap: break-word;\n max-width: calc(100% - 32px);\n}\n.r01st-close {\n background: transparent;\n border: none;\n color: #ffffff;\n font-size: 24px;\n line-height: 1;\n cursor: pointer;\n padding: 0;\n width: 24px;\n height: 24px;\n text-align: center;\n border-radius: 4px;\n opacity: 0.8;\n}\n\n.r01st-close:hover {\n background-color: rgba(255, 255, 255, 0.2);\n opacity: 1;\n}\n\n.r01st-close:focus {\n outline: 2px solid #ffffff;\n outline-offset: 2px;\n}\n.r01st-container[data-position^=\"b\"] .r01st {\n margin-top: 0;\n margin-bottom: -20px;\n}\n\n.r01st-container[data-position^=\"b\"] .r01st-show {\n margin-bottom: 16px;\n}\n@media (max-width: 480px) {\n .r01st-container {\n left: 0 !important;\n right: 0 !important;\n margin-left: 0 !important;\n padding: 8px;\n }\n\n .r01st {\n min-width: auto;\n max-width: none;\n }\n}\n@media (prefers-reduced-motion: reduce) {\n .r01st {\n transition: opacity 0.2s;\n margin-top: 0;\n }\n}\n@media print {\n .r01st-container {\n display: none;\n }\n}\n";
|
|
70
70
|
document.head.appendChild(style);
|
|
71
71
|
stylesInjected = true;
|
|
72
72
|
}
|
|
73
73
|
|
|
74
|
-
|
|
74
|
+
var container = null;
|
|
75
75
|
function getContainer(position, theme) {
|
|
76
76
|
injectStyles();
|
|
77
77
|
if (container && (container.getAttribute('data-position') !== position || container.getAttribute('data-theme') !== theme)) {
|
|
@@ -98,7 +98,7 @@ function cleanupContainer(activeCount) {
|
|
|
98
98
|
}
|
|
99
99
|
|
|
100
100
|
function getIcon(type) {
|
|
101
|
-
|
|
101
|
+
var icons = {
|
|
102
102
|
success: '<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"/></svg>',
|
|
103
103
|
error: '<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z" clip-rule="evenodd"/></svg>',
|
|
104
104
|
info: '<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z" clip-rule="evenodd"/></svg>',
|
|
@@ -108,31 +108,31 @@ function getIcon(type) {
|
|
|
108
108
|
}
|
|
109
109
|
|
|
110
110
|
function createToastElement(message, type, dismissible, className, id, onClose) {
|
|
111
|
-
|
|
111
|
+
var toastEl = document.createElement('div');
|
|
112
112
|
toastEl.className = 'r01st r01st-' + type + (className ? ' ' + className : '');
|
|
113
113
|
toastEl.setAttribute('role', 'alert');
|
|
114
114
|
toastEl.setAttribute('data-toast-id', id);
|
|
115
|
-
|
|
115
|
+
var content = document.createElement('div');
|
|
116
116
|
content.className = 'r01st-content';
|
|
117
|
-
|
|
117
|
+
var icon = document.createElement('span');
|
|
118
118
|
icon.className = 'r01st-icon';
|
|
119
119
|
icon.innerHTML = getIcon(type);
|
|
120
120
|
icon.setAttribute('aria-hidden', 'true');
|
|
121
121
|
content.appendChild(icon);
|
|
122
|
-
|
|
122
|
+
var messageEl = document.createElement('span');
|
|
123
123
|
messageEl.className = 'r01st-message';
|
|
124
124
|
messageEl.textContent = message;
|
|
125
125
|
content.appendChild(messageEl);
|
|
126
126
|
if (dismissible) {
|
|
127
|
-
|
|
127
|
+
var layoutTable = document.createElement('table');
|
|
128
128
|
layoutTable.className = 'r01st-table';
|
|
129
|
-
|
|
130
|
-
|
|
129
|
+
var layoutRow = document.createElement('tr');
|
|
130
|
+
var messageCell = document.createElement('td');
|
|
131
131
|
messageCell.className = 'r01st-cell r01st-message-cell';
|
|
132
132
|
messageCell.appendChild(content);
|
|
133
|
-
|
|
133
|
+
var closeCell = document.createElement('td');
|
|
134
134
|
closeCell.className = 'r01st-cell r01st-close-cell';
|
|
135
|
-
|
|
135
|
+
var closeBtn = document.createElement('button');
|
|
136
136
|
closeBtn.className = 'r01st-close';
|
|
137
137
|
closeBtn.innerHTML = '×';
|
|
138
138
|
closeBtn.setAttribute('aria-label', 'Close notification');
|
|
@@ -149,13 +149,13 @@ function createToastElement(message, type, dismissible, className, id, onClose)
|
|
|
149
149
|
}
|
|
150
150
|
|
|
151
151
|
function showToast(element) {
|
|
152
|
-
requestAnimationFrame(()
|
|
152
|
+
requestAnimationFrame(function () {
|
|
153
153
|
element.className = element.className + ' r01st-show';
|
|
154
154
|
});
|
|
155
155
|
}
|
|
156
156
|
function hideToast(element, callback) {
|
|
157
157
|
element.className = element.className.replace(' r01st-show', '');
|
|
158
|
-
setTimeout(()
|
|
158
|
+
setTimeout(function () {
|
|
159
159
|
if (element.parentNode) {
|
|
160
160
|
element.parentNode.removeChild(element);
|
|
161
161
|
}
|
|
@@ -163,57 +163,60 @@ function hideToast(element, callback) {
|
|
|
163
163
|
}, 300);
|
|
164
164
|
}
|
|
165
165
|
|
|
166
|
-
|
|
167
|
-
|
|
166
|
+
var toastCounter = 0;
|
|
167
|
+
var activeToasts = new Map();
|
|
168
168
|
function createToast(message) {
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
type = 'info'
|
|
178
|
-
|
|
179
|
-
const id = ++toastCounter;
|
|
169
|
+
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
170
|
+
var config = _objectSpread2(_objectSpread2({}, getConfig()), options);
|
|
171
|
+
var position = config.position,
|
|
172
|
+
duration = config.duration,
|
|
173
|
+
dismissible = config.dismissible,
|
|
174
|
+
theme = config.theme,
|
|
175
|
+
className = config.className,
|
|
176
|
+
_config$type = config.type,
|
|
177
|
+
type = _config$type === void 0 ? 'info' : _config$type;
|
|
178
|
+
var id = ++toastCounter;
|
|
180
179
|
if (activeToasts.size >= getConfig().maxToasts) {
|
|
181
|
-
|
|
180
|
+
var firstToast = activeToasts.keys().next().value;
|
|
182
181
|
dismissToast(firstToast);
|
|
183
182
|
}
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
183
|
+
var container = getContainer(position, theme);
|
|
184
|
+
var handleClose = function handleClose() {
|
|
185
|
+
return dismissToast(id);
|
|
186
|
+
};
|
|
187
|
+
var toastEl = createToastElement(message, type, dismissible, className, id, handleClose);
|
|
187
188
|
container.appendChild(toastEl);
|
|
188
189
|
showToast(toastEl);
|
|
189
|
-
|
|
190
|
+
var toastData = {
|
|
190
191
|
element: toastEl,
|
|
191
192
|
timeoutId: null
|
|
192
193
|
};
|
|
193
194
|
if (duration > 0) {
|
|
194
|
-
toastData.timeoutId = setTimeout(
|
|
195
|
+
toastData.timeoutId = setTimeout(function () {
|
|
196
|
+
return dismissToast(id);
|
|
197
|
+
}, duration);
|
|
195
198
|
}
|
|
196
199
|
activeToasts.set(id, toastData);
|
|
197
200
|
return id;
|
|
198
201
|
}
|
|
199
202
|
function dismissToast(id) {
|
|
200
|
-
|
|
203
|
+
var toastData = activeToasts.get(id);
|
|
201
204
|
if (!toastData) return;
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
timeoutId
|
|
205
|
-
} = toastData;
|
|
205
|
+
var element = toastData.element,
|
|
206
|
+
timeoutId = toastData.timeoutId;
|
|
206
207
|
if (timeoutId) {
|
|
207
208
|
clearTimeout(timeoutId);
|
|
208
209
|
}
|
|
209
210
|
activeToasts.delete(id);
|
|
210
|
-
hideToast(element, ()
|
|
211
|
+
hideToast(element, function () {
|
|
211
212
|
cleanupContainer(activeToasts.size);
|
|
212
213
|
});
|
|
213
214
|
}
|
|
214
215
|
function dismissAllToasts() {
|
|
215
|
-
|
|
216
|
-
ids.forEach(
|
|
216
|
+
var ids = Array.from(activeToasts.keys());
|
|
217
|
+
ids.forEach(function (id) {
|
|
218
|
+
return dismissToast(id);
|
|
219
|
+
});
|
|
217
220
|
}
|
|
218
221
|
|
|
219
222
|
/**
|
|
@@ -223,31 +226,31 @@ function dismissAllToasts() {
|
|
|
223
226
|
* @returns {number} Toast ID
|
|
224
227
|
*/
|
|
225
228
|
function toast(message) {
|
|
226
|
-
|
|
229
|
+
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
227
230
|
return createToast(message, options);
|
|
228
231
|
}
|
|
229
232
|
|
|
230
233
|
// Shorthand methods
|
|
231
234
|
toast.success = function (message) {
|
|
232
|
-
|
|
235
|
+
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
233
236
|
return toast(message, _objectSpread2(_objectSpread2({}, options), {}, {
|
|
234
237
|
type: 'success'
|
|
235
238
|
}));
|
|
236
239
|
};
|
|
237
240
|
toast.error = function (message) {
|
|
238
|
-
|
|
241
|
+
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
239
242
|
return toast(message, _objectSpread2(_objectSpread2({}, options), {}, {
|
|
240
243
|
type: 'error'
|
|
241
244
|
}));
|
|
242
245
|
};
|
|
243
246
|
toast.info = function (message) {
|
|
244
|
-
|
|
247
|
+
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
245
248
|
return toast(message, _objectSpread2(_objectSpread2({}, options), {}, {
|
|
246
249
|
type: 'info'
|
|
247
250
|
}));
|
|
248
251
|
};
|
|
249
252
|
toast.warning = function (message) {
|
|
250
|
-
|
|
253
|
+
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
251
254
|
return toast(message, _objectSpread2(_objectSpread2({}, options), {}, {
|
|
252
255
|
type: 'warning'
|
|
253
256
|
}));
|
package/dist/simple-toast.esm.js
CHANGED
|
@@ -42,14 +42,14 @@ function _toPropertyKey(t) {
|
|
|
42
42
|
return "symbol" == typeof i ? i : i + "";
|
|
43
43
|
}
|
|
44
44
|
|
|
45
|
-
|
|
45
|
+
var defaultConfig = {
|
|
46
46
|
position: 'bc',
|
|
47
47
|
duration: 3000,
|
|
48
48
|
theme: 'l',
|
|
49
49
|
dismissible: true,
|
|
50
50
|
maxToasts: 10
|
|
51
51
|
};
|
|
52
|
-
|
|
52
|
+
var globalConfig = _objectSpread2({}, defaultConfig);
|
|
53
53
|
function configure(config) {
|
|
54
54
|
globalConfig = _objectSpread2(_objectSpread2({}, globalConfig), config);
|
|
55
55
|
}
|
|
@@ -57,17 +57,17 @@ function getConfig() {
|
|
|
57
57
|
return globalConfig;
|
|
58
58
|
}
|
|
59
59
|
|
|
60
|
-
|
|
60
|
+
var stylesInjected = false;
|
|
61
61
|
function injectStyles() {
|
|
62
62
|
if (stylesInjected) return;
|
|
63
|
-
|
|
63
|
+
var style = document.createElement('style');
|
|
64
64
|
style.setAttribute('data-r01st', '');
|
|
65
65
|
style.textContent = "\n.r01st-container {\n position: fixed;\n z-index: 9999;\n pointer-events: none;\n padding: 16px;\n}\n.r01st-container[data-position=\"tl\"] {\n top: 0;\n left: 0;\n}\n\n.r01st-container[data-position=\"tc\"] {\n top: 0;\n left: 50%;\n margin-left: -210px;\n}\n\n.r01st-container[data-position=\"tr\"] {\n top: 0;\n right: 0;\n}\n.r01st-container[data-position=\"ml\"] {\n top: 50%;\n left: 0;\n margin-top: -50px;\n}\n\n.r01st-container[data-position=\"mc\"] {\n top: 50%;\n left: 50%;\n margin-left: -210px;\n margin-top: -50px;\n}\n\n.r01st-container[data-position=\"mr\"] {\n top: 50%;\n right: 0;\n margin-top: -50px;\n}\n.r01st-container[data-position=\"bl\"] {\n bottom: 0;\n left: 0;\n}\n\n.r01st-container[data-position=\"bc\"] {\n bottom: 0;\n left: 50%;\n margin-left: -210px;\n}\n\n.r01st-container[data-position=\"br\"] {\n bottom: 0;\n right: 0;\n}\n.r01st {\n pointer-events: auto;\n position: relative;\n min-width: 280px;\n max-width: 420px;\n padding: 16px;\n margin-bottom: 16px;\n border-radius: 8px;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n font-size: 14px;\n line-height: 1.5;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;\n color: #ffffff;\n opacity: 0;\n transition: opacity 0.3s ease, margin-top 0.3s ease;\n margin-top: -20px;\n}\n.r01st-show {\n opacity: 1;\n margin-top: 0;\n}\n.r01st-container[data-theme=\"l\"] .r01st-success {\n background-color: #10b981;\n}\n\n.r01st-container[data-theme=\"l\"] .r01st-error {\n background-color: #ef4444;\n}\n\n.r01st-container[data-theme=\"l\"] .r01st-info {\n background-color: #3b82f6;\n}\n\n.r01st-container[data-theme=\"l\"] .r01st-warning {\n background-color: #f59e0b;\n}\n.r01st-container[data-theme=\"d\"] .r01st-success {\n background-color: #059669;\n}\n\n.r01st-container[data-theme=\"d\"] .r01st-error {\n background-color: #dc2626;\n}\n\n.r01st-container[data-theme=\"d\"] .r01st-info {\n background-color: #2563eb;\n}\n\n.r01st-container[data-theme=\"d\"] .r01st-warning {\n background-color: #d97706;\n}\n.r01st-content {\n display: inline-block;\n width: 100%;\n vertical-align: top;\n}\n.r01st-table {\n width: 100%;\n border-collapse: collapse;\n}\n.r01st-cell {\n vertical-align: middle;\n}\n.r01st-message-cell {\n width: 100%;\n}\n.r01st-close-cell {\n width: 1%;\n padding-left: 8px;\n}\n.r01st-icon {\n display: inline-block;\n width: 20px;\n height: 20px;\n vertical-align: middle;\n margin-right: 12px;\n}\n\n.r01st-icon svg {\n width: 100%;\n height: 100%;\n display: block;\n}\n.r01st-message {\n display: inline-block;\n vertical-align: middle;\n word-wrap: break-word;\n max-width: calc(100% - 32px);\n}\n.r01st-close {\n background: transparent;\n border: none;\n color: #ffffff;\n font-size: 24px;\n line-height: 1;\n cursor: pointer;\n padding: 0;\n width: 24px;\n height: 24px;\n text-align: center;\n border-radius: 4px;\n opacity: 0.8;\n}\n\n.r01st-close:hover {\n background-color: rgba(255, 255, 255, 0.2);\n opacity: 1;\n}\n\n.r01st-close:focus {\n outline: 2px solid #ffffff;\n outline-offset: 2px;\n}\n.r01st-container[data-position^=\"b\"] .r01st {\n margin-top: 0;\n margin-bottom: -20px;\n}\n\n.r01st-container[data-position^=\"b\"] .r01st-show {\n margin-bottom: 16px;\n}\n@media (max-width: 480px) {\n .r01st-container {\n left: 0 !important;\n right: 0 !important;\n margin-left: 0 !important;\n padding: 8px;\n }\n\n .r01st {\n min-width: auto;\n max-width: none;\n }\n}\n@media (prefers-reduced-motion: reduce) {\n .r01st {\n transition: opacity 0.2s;\n margin-top: 0;\n }\n}\n@media print {\n .r01st-container {\n display: none;\n }\n}\n";
|
|
66
66
|
document.head.appendChild(style);
|
|
67
67
|
stylesInjected = true;
|
|
68
68
|
}
|
|
69
69
|
|
|
70
|
-
|
|
70
|
+
var container = null;
|
|
71
71
|
function getContainer(position, theme) {
|
|
72
72
|
injectStyles();
|
|
73
73
|
if (container && (container.getAttribute('data-position') !== position || container.getAttribute('data-theme') !== theme)) {
|
|
@@ -94,7 +94,7 @@ function cleanupContainer(activeCount) {
|
|
|
94
94
|
}
|
|
95
95
|
|
|
96
96
|
function getIcon(type) {
|
|
97
|
-
|
|
97
|
+
var icons = {
|
|
98
98
|
success: '<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"/></svg>',
|
|
99
99
|
error: '<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z" clip-rule="evenodd"/></svg>',
|
|
100
100
|
info: '<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z" clip-rule="evenodd"/></svg>',
|
|
@@ -104,31 +104,31 @@ function getIcon(type) {
|
|
|
104
104
|
}
|
|
105
105
|
|
|
106
106
|
function createToastElement(message, type, dismissible, className, id, onClose) {
|
|
107
|
-
|
|
107
|
+
var toastEl = document.createElement('div');
|
|
108
108
|
toastEl.className = 'r01st r01st-' + type + (className ? ' ' + className : '');
|
|
109
109
|
toastEl.setAttribute('role', 'alert');
|
|
110
110
|
toastEl.setAttribute('data-toast-id', id);
|
|
111
|
-
|
|
111
|
+
var content = document.createElement('div');
|
|
112
112
|
content.className = 'r01st-content';
|
|
113
|
-
|
|
113
|
+
var icon = document.createElement('span');
|
|
114
114
|
icon.className = 'r01st-icon';
|
|
115
115
|
icon.innerHTML = getIcon(type);
|
|
116
116
|
icon.setAttribute('aria-hidden', 'true');
|
|
117
117
|
content.appendChild(icon);
|
|
118
|
-
|
|
118
|
+
var messageEl = document.createElement('span');
|
|
119
119
|
messageEl.className = 'r01st-message';
|
|
120
120
|
messageEl.textContent = message;
|
|
121
121
|
content.appendChild(messageEl);
|
|
122
122
|
if (dismissible) {
|
|
123
|
-
|
|
123
|
+
var layoutTable = document.createElement('table');
|
|
124
124
|
layoutTable.className = 'r01st-table';
|
|
125
|
-
|
|
126
|
-
|
|
125
|
+
var layoutRow = document.createElement('tr');
|
|
126
|
+
var messageCell = document.createElement('td');
|
|
127
127
|
messageCell.className = 'r01st-cell r01st-message-cell';
|
|
128
128
|
messageCell.appendChild(content);
|
|
129
|
-
|
|
129
|
+
var closeCell = document.createElement('td');
|
|
130
130
|
closeCell.className = 'r01st-cell r01st-close-cell';
|
|
131
|
-
|
|
131
|
+
var closeBtn = document.createElement('button');
|
|
132
132
|
closeBtn.className = 'r01st-close';
|
|
133
133
|
closeBtn.innerHTML = '×';
|
|
134
134
|
closeBtn.setAttribute('aria-label', 'Close notification');
|
|
@@ -145,13 +145,13 @@ function createToastElement(message, type, dismissible, className, id, onClose)
|
|
|
145
145
|
}
|
|
146
146
|
|
|
147
147
|
function showToast(element) {
|
|
148
|
-
requestAnimationFrame(()
|
|
148
|
+
requestAnimationFrame(function () {
|
|
149
149
|
element.className = element.className + ' r01st-show';
|
|
150
150
|
});
|
|
151
151
|
}
|
|
152
152
|
function hideToast(element, callback) {
|
|
153
153
|
element.className = element.className.replace(' r01st-show', '');
|
|
154
|
-
setTimeout(()
|
|
154
|
+
setTimeout(function () {
|
|
155
155
|
if (element.parentNode) {
|
|
156
156
|
element.parentNode.removeChild(element);
|
|
157
157
|
}
|
|
@@ -159,57 +159,60 @@ function hideToast(element, callback) {
|
|
|
159
159
|
}, 300);
|
|
160
160
|
}
|
|
161
161
|
|
|
162
|
-
|
|
163
|
-
|
|
162
|
+
var toastCounter = 0;
|
|
163
|
+
var activeToasts = new Map();
|
|
164
164
|
function createToast(message) {
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
type = 'info'
|
|
174
|
-
|
|
175
|
-
const id = ++toastCounter;
|
|
165
|
+
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
166
|
+
var config = _objectSpread2(_objectSpread2({}, getConfig()), options);
|
|
167
|
+
var position = config.position,
|
|
168
|
+
duration = config.duration,
|
|
169
|
+
dismissible = config.dismissible,
|
|
170
|
+
theme = config.theme,
|
|
171
|
+
className = config.className,
|
|
172
|
+
_config$type = config.type,
|
|
173
|
+
type = _config$type === void 0 ? 'info' : _config$type;
|
|
174
|
+
var id = ++toastCounter;
|
|
176
175
|
if (activeToasts.size >= getConfig().maxToasts) {
|
|
177
|
-
|
|
176
|
+
var firstToast = activeToasts.keys().next().value;
|
|
178
177
|
dismissToast(firstToast);
|
|
179
178
|
}
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
179
|
+
var container = getContainer(position, theme);
|
|
180
|
+
var handleClose = function handleClose() {
|
|
181
|
+
return dismissToast(id);
|
|
182
|
+
};
|
|
183
|
+
var toastEl = createToastElement(message, type, dismissible, className, id, handleClose);
|
|
183
184
|
container.appendChild(toastEl);
|
|
184
185
|
showToast(toastEl);
|
|
185
|
-
|
|
186
|
+
var toastData = {
|
|
186
187
|
element: toastEl,
|
|
187
188
|
timeoutId: null
|
|
188
189
|
};
|
|
189
190
|
if (duration > 0) {
|
|
190
|
-
toastData.timeoutId = setTimeout(
|
|
191
|
+
toastData.timeoutId = setTimeout(function () {
|
|
192
|
+
return dismissToast(id);
|
|
193
|
+
}, duration);
|
|
191
194
|
}
|
|
192
195
|
activeToasts.set(id, toastData);
|
|
193
196
|
return id;
|
|
194
197
|
}
|
|
195
198
|
function dismissToast(id) {
|
|
196
|
-
|
|
199
|
+
var toastData = activeToasts.get(id);
|
|
197
200
|
if (!toastData) return;
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
timeoutId
|
|
201
|
-
} = toastData;
|
|
201
|
+
var element = toastData.element,
|
|
202
|
+
timeoutId = toastData.timeoutId;
|
|
202
203
|
if (timeoutId) {
|
|
203
204
|
clearTimeout(timeoutId);
|
|
204
205
|
}
|
|
205
206
|
activeToasts.delete(id);
|
|
206
|
-
hideToast(element, ()
|
|
207
|
+
hideToast(element, function () {
|
|
207
208
|
cleanupContainer(activeToasts.size);
|
|
208
209
|
});
|
|
209
210
|
}
|
|
210
211
|
function dismissAllToasts() {
|
|
211
|
-
|
|
212
|
-
ids.forEach(
|
|
212
|
+
var ids = Array.from(activeToasts.keys());
|
|
213
|
+
ids.forEach(function (id) {
|
|
214
|
+
return dismissToast(id);
|
|
215
|
+
});
|
|
213
216
|
}
|
|
214
217
|
|
|
215
218
|
/**
|
|
@@ -219,31 +222,31 @@ function dismissAllToasts() {
|
|
|
219
222
|
* @returns {number} Toast ID
|
|
220
223
|
*/
|
|
221
224
|
function toast(message) {
|
|
222
|
-
|
|
225
|
+
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
223
226
|
return createToast(message, options);
|
|
224
227
|
}
|
|
225
228
|
|
|
226
229
|
// Shorthand methods
|
|
227
230
|
toast.success = function (message) {
|
|
228
|
-
|
|
231
|
+
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
229
232
|
return toast(message, _objectSpread2(_objectSpread2({}, options), {}, {
|
|
230
233
|
type: 'success'
|
|
231
234
|
}));
|
|
232
235
|
};
|
|
233
236
|
toast.error = function (message) {
|
|
234
|
-
|
|
237
|
+
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
235
238
|
return toast(message, _objectSpread2(_objectSpread2({}, options), {}, {
|
|
236
239
|
type: 'error'
|
|
237
240
|
}));
|
|
238
241
|
};
|
|
239
242
|
toast.info = function (message) {
|
|
240
|
-
|
|
243
|
+
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
241
244
|
return toast(message, _objectSpread2(_objectSpread2({}, options), {}, {
|
|
242
245
|
type: 'info'
|
|
243
246
|
}));
|
|
244
247
|
};
|
|
245
248
|
toast.warning = function (message) {
|
|
246
|
-
|
|
249
|
+
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
247
250
|
return toast(message, _objectSpread2(_objectSpread2({}, options), {}, {
|
|
248
251
|
type: 'warning'
|
|
249
252
|
}));
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
function n(n,t,e){return(t=function(n){var t=function(n,t){if("object"!=typeof n||!n)return n;var e=n[Symbol.toPrimitive];if(void 0!==e){var r=e.call(n,t);if("object"!=typeof r)return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(n)}(n,"string");return"symbol"==typeof t?t:t+""}(t))in n?Object.defineProperty(n,t,{value:e,enumerable:!0,configurable:!0,writable:!0}):n[t]=e,n}function t(n,t){var e=Object.keys(n);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(n);t&&(r=r.filter(function(t){return Object.getOwnPropertyDescriptor(n,t).enumerable})),e.push.apply(e,r)}return e}function e(e){for(var r=1;arguments.length>r;r++){var i=null!=arguments[r]?arguments[r]:{};r%2?t(Object(i),!0).forEach(function(t){n(e,t,i[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(i)):t(Object(i)).forEach(function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(i,n))})}return e}var r=e({},{position:"bc",duration:3e3,theme:"l",dismissible:!0,maxToasts:10});function i(n){r=e(e({},r),n)}function o(){return r}var a=!1;var s=null;function l(n,t){return function(){if(!a){var n=document.createElement("style");n.setAttribute("data-r01st",""),n.textContent='\n.r01st-container {\n position: fixed;\n z-index: 9999;\n pointer-events: none;\n padding: 16px;\n}\n.r01st-container[data-position="tl"] {\n top: 0;\n left: 0;\n}\n\n.r01st-container[data-position="tc"] {\n top: 0;\n left: 50%;\n margin-left: -210px;\n}\n\n.r01st-container[data-position="tr"] {\n top: 0;\n right: 0;\n}\n.r01st-container[data-position="ml"] {\n top: 50%;\n left: 0;\n margin-top: -50px;\n}\n\n.r01st-container[data-position="mc"] {\n top: 50%;\n left: 50%;\n margin-left: -210px;\n margin-top: -50px;\n}\n\n.r01st-container[data-position="mr"] {\n top: 50%;\n right: 0;\n margin-top: -50px;\n}\n.r01st-container[data-position="bl"] {\n bottom: 0;\n left: 0;\n}\n\n.r01st-container[data-position="bc"] {\n bottom: 0;\n left: 50%;\n margin-left: -210px;\n}\n\n.r01st-container[data-position="br"] {\n bottom: 0;\n right: 0;\n}\n.r01st {\n pointer-events: auto;\n position: relative;\n min-width: 280px;\n max-width: 420px;\n padding: 16px;\n margin-bottom: 16px;\n border-radius: 8px;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n font-size: 14px;\n line-height: 1.5;\n font-family: -apple-system, BlinkMacSystemFont, \'Segoe UI\', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;\n color: #ffffff;\n opacity: 0;\n transition: opacity 0.3s ease, margin-top 0.3s ease;\n margin-top: -20px;\n}\n.r01st-show {\n opacity: 1;\n margin-top: 0;\n}\n.r01st-container[data-theme="l"] .r01st-success {\n background-color: #10b981;\n}\n\n.r01st-container[data-theme="l"] .r01st-error {\n background-color: #ef4444;\n}\n\n.r01st-container[data-theme="l"] .r01st-info {\n background-color: #3b82f6;\n}\n\n.r01st-container[data-theme="l"] .r01st-warning {\n background-color: #f59e0b;\n}\n.r01st-container[data-theme="d"] .r01st-success {\n background-color: #059669;\n}\n\n.r01st-container[data-theme="d"] .r01st-error {\n background-color: #dc2626;\n}\n\n.r01st-container[data-theme="d"] .r01st-info {\n background-color: #2563eb;\n}\n\n.r01st-container[data-theme="d"] .r01st-warning {\n background-color: #d97706;\n}\n.r01st-content {\n display: inline-block;\n width: 100%;\n vertical-align: top;\n}\n.r01st-table {\n width: 100%;\n border-collapse: collapse;\n}\n.r01st-cell {\n vertical-align: middle;\n}\n.r01st-message-cell {\n width: 100%;\n}\n.r01st-close-cell {\n width: 1%;\n padding-left: 8px;\n}\n.r01st-icon {\n display: inline-block;\n width: 20px;\n height: 20px;\n vertical-align: middle;\n margin-right: 12px;\n}\n\n.r01st-icon svg {\n width: 100%;\n height: 100%;\n display: block;\n}\n.r01st-message {\n display: inline-block;\n vertical-align: middle;\n word-wrap: break-word;\n max-width: calc(100% - 32px);\n}\n.r01st-close {\n background: transparent;\n border: none;\n color: #ffffff;\n font-size: 24px;\n line-height: 1;\n cursor: pointer;\n padding: 0;\n width: 24px;\n height: 24px;\n text-align: center;\n border-radius: 4px;\n opacity: 0.8;\n}\n\n.r01st-close:hover {\n background-color: rgba(255, 255, 255, 0.2);\n opacity: 1;\n}\n\n.r01st-close:focus {\n outline: 2px solid #ffffff;\n outline-offset: 2px;\n}\n.r01st-container[data-position^="b"] .r01st {\n margin-top: 0;\n margin-bottom: -20px;\n}\n\n.r01st-container[data-position^="b"] .r01st-show {\n margin-bottom: 16px;\n}\n@media (max-width: 480px) {\n .r01st-container {\n left: 0 !important;\n right: 0 !important;\n margin-left: 0 !important;\n padding: 8px;\n }\n\n .r01st {\n min-width: auto;\n max-width: none;\n }\n}\n@media (prefers-reduced-motion: reduce) {\n .r01st {\n transition: opacity 0.2s;\n margin-top: 0;\n }\n}\n@media print {\n .r01st-container {\n display: none;\n }\n}\n',document.head.appendChild(n),a=!0}}(),!s||s.getAttribute("data-position")===n&&s.getAttribute("data-theme")===t||(s.parentNode.removeChild(s),s=null),s||((s=document.createElement("div")).className="r01st-container",s.setAttribute("role","region"),s.setAttribute("aria-label","Notifications"),s.setAttribute("aria-live","polite"),s.setAttribute("data-position",n),s.setAttribute("data-theme",t),document.body.appendChild(s)),s}var c=0,d=new Map;function p(n){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=e(e({},o()),t),i=r.position,a=r.duration,s=r.dismissible,p=r.theme,m=r.className,f=r.type,g=void 0===f?"info":f,b=++c;d.size<o().maxToasts||u(d.keys().next().value);var h,v=l(i,p),x=function(n,t,e,r,i,o){var a=document.createElement("div");a.className="r01st r01st-"+t+(r?" "+r:""),a.setAttribute("role","alert"),a.setAttribute("data-toast-id",i);var s=document.createElement("div");s.className="r01st-content";var l=document.createElement("span");l.className="r01st-icon",l.innerHTML=function(n){var t={success:'<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"/></svg>',error:'<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z" clip-rule="evenodd"/></svg>',info:'<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z" clip-rule="evenodd"/></svg>',warning:'<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z" clip-rule="evenodd"/></svg>'};return t[n]||t.info}(t),l.setAttribute("aria-hidden","true"),s.appendChild(l);var c=document.createElement("span");if(c.className="r01st-message",c.textContent=n,s.appendChild(c),e){var d=document.createElement("table");d.className="r01st-table";var p=document.createElement("tr"),u=document.createElement("td");u.className="r01st-cell r01st-message-cell",u.appendChild(s);var m=document.createElement("td");m.className="r01st-cell r01st-close-cell";var f=document.createElement("button");f.className="r01st-close",f.innerHTML="×",f.setAttribute("aria-label","Close notification"),f.onclick=o,m.appendChild(f),p.appendChild(u),p.appendChild(m),d.appendChild(p),a.appendChild(d)}else a.appendChild(s);return a}(n,g,s,m,b,function(){return u(b)});v.appendChild(x),h=x,requestAnimationFrame(function(){h.className=h.className+" r01st-show"});var y={element:x,timeoutId:null};return a>0&&(y.timeoutId=setTimeout(function(){return u(b)},a)),d.set(b,y),b}function u(n){var t=d.get(n);if(t){var e=t.element,r=t.timeoutId;r&&clearTimeout(r),d.delete(n),function(n,t){n.className=n.className.replace(" r01st-show",""),setTimeout(function(){n.parentNode&&n.parentNode.removeChild(n),t&&t()},300)}(e,function(){var n;n=d.size,s&&0===n&&(s.parentNode.removeChild(s),s=null)})}}function m(n){return p(n,arguments.length>1&&void 0!==arguments[1]?arguments[1]:{})}m.success=function(n){return m(n,e(e({},arguments.length>1&&void 0!==arguments[1]?arguments[1]:{}),{},{type:"success"}))},m.error=function(n){return m(n,e(e({},arguments.length>1&&void 0!==arguments[1]?arguments[1]:{}),{},{type:"error"}))},m.info=function(n){return m(n,e(e({},arguments.length>1&&void 0!==arguments[1]?arguments[1]:{}),{},{type:"info"}))},m.warning=function(n){return m(n,e(e({},arguments.length>1&&void 0!==arguments[1]?arguments[1]:{}),{},{type:"warning"}))},m.dismiss=u,m.dismissAll=function(){Array.from(d.keys()).forEach(function(n){return u(n)})};export{i as configure,m as default,m as toast};
|
package/dist/simple-toast.min.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(n,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((n="undefined"!=typeof globalThis?globalThis:n||self).SimpleToast={})}(this,function(n){"use strict";function t(n,t,e){return(t=function(n){var t=function(n,t){if("object"!=typeof n||!n)return n;var e=n[Symbol.toPrimitive];if(void 0!==e){var r=e.call(n,t);if("object"!=typeof r)return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(n)}(n,"string");return"symbol"==typeof t?t:t+""}(t))in n?Object.defineProperty(n,t,{value:e,enumerable:!0,configurable:!0,writable:!0}):n[t]=e,n}function e(n,t){var e=Object.keys(n);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(n);t&&(r=r.filter(function(t){return Object.getOwnPropertyDescriptor(n,t).enumerable})),e.push.apply(e,r)}return e}function r(n){for(var r=1;arguments.length>r;r++){var o=null!=arguments[r]?arguments[r]:{};r%2?e(Object(o),!0).forEach(function(e){t(n,e,o[e])}):Object.getOwnPropertyDescriptors?Object.defineProperties(n,Object.getOwnPropertyDescriptors(o)):e(Object(o)).forEach(function(t){Object.defineProperty(n,t,Object.getOwnPropertyDescriptor(o,t))})}return n}
|
|
1
|
+
!function(n,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((n="undefined"!=typeof globalThis?globalThis:n||self).SimpleToast={})}(this,function(n){"use strict";function t(n,t,e){return(t=function(n){var t=function(n,t){if("object"!=typeof n||!n)return n;var e=n[Symbol.toPrimitive];if(void 0!==e){var r=e.call(n,t);if("object"!=typeof r)return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(n)}(n,"string");return"symbol"==typeof t?t:t+""}(t))in n?Object.defineProperty(n,t,{value:e,enumerable:!0,configurable:!0,writable:!0}):n[t]=e,n}function e(n,t){var e=Object.keys(n);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(n);t&&(r=r.filter(function(t){return Object.getOwnPropertyDescriptor(n,t).enumerable})),e.push.apply(e,r)}return e}function r(n){for(var r=1;arguments.length>r;r++){var o=null!=arguments[r]?arguments[r]:{};r%2?e(Object(o),!0).forEach(function(e){t(n,e,o[e])}):Object.getOwnPropertyDescriptors?Object.defineProperties(n,Object.getOwnPropertyDescriptors(o)):e(Object(o)).forEach(function(t){Object.defineProperty(n,t,Object.getOwnPropertyDescriptor(o,t))})}return n}var o=r({},{position:"bc",duration:3e3,theme:"l",dismissible:!0,maxToasts:10});function i(){return o}var a=!1;var s=null;function l(n,t){return function(){if(!a){var n=document.createElement("style");n.setAttribute("data-r01st",""),n.textContent='\n.r01st-container {\n position: fixed;\n z-index: 9999;\n pointer-events: none;\n padding: 16px;\n}\n.r01st-container[data-position="tl"] {\n top: 0;\n left: 0;\n}\n\n.r01st-container[data-position="tc"] {\n top: 0;\n left: 50%;\n margin-left: -210px;\n}\n\n.r01st-container[data-position="tr"] {\n top: 0;\n right: 0;\n}\n.r01st-container[data-position="ml"] {\n top: 50%;\n left: 0;\n margin-top: -50px;\n}\n\n.r01st-container[data-position="mc"] {\n top: 50%;\n left: 50%;\n margin-left: -210px;\n margin-top: -50px;\n}\n\n.r01st-container[data-position="mr"] {\n top: 50%;\n right: 0;\n margin-top: -50px;\n}\n.r01st-container[data-position="bl"] {\n bottom: 0;\n left: 0;\n}\n\n.r01st-container[data-position="bc"] {\n bottom: 0;\n left: 50%;\n margin-left: -210px;\n}\n\n.r01st-container[data-position="br"] {\n bottom: 0;\n right: 0;\n}\n.r01st {\n pointer-events: auto;\n position: relative;\n min-width: 280px;\n max-width: 420px;\n padding: 16px;\n margin-bottom: 16px;\n border-radius: 8px;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n font-size: 14px;\n line-height: 1.5;\n font-family: -apple-system, BlinkMacSystemFont, \'Segoe UI\', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;\n color: #ffffff;\n opacity: 0;\n transition: opacity 0.3s ease, margin-top 0.3s ease;\n margin-top: -20px;\n}\n.r01st-show {\n opacity: 1;\n margin-top: 0;\n}\n.r01st-container[data-theme="l"] .r01st-success {\n background-color: #10b981;\n}\n\n.r01st-container[data-theme="l"] .r01st-error {\n background-color: #ef4444;\n}\n\n.r01st-container[data-theme="l"] .r01st-info {\n background-color: #3b82f6;\n}\n\n.r01st-container[data-theme="l"] .r01st-warning {\n background-color: #f59e0b;\n}\n.r01st-container[data-theme="d"] .r01st-success {\n background-color: #059669;\n}\n\n.r01st-container[data-theme="d"] .r01st-error {\n background-color: #dc2626;\n}\n\n.r01st-container[data-theme="d"] .r01st-info {\n background-color: #2563eb;\n}\n\n.r01st-container[data-theme="d"] .r01st-warning {\n background-color: #d97706;\n}\n.r01st-content {\n display: inline-block;\n width: 100%;\n vertical-align: top;\n}\n.r01st-table {\n width: 100%;\n border-collapse: collapse;\n}\n.r01st-cell {\n vertical-align: middle;\n}\n.r01st-message-cell {\n width: 100%;\n}\n.r01st-close-cell {\n width: 1%;\n padding-left: 8px;\n}\n.r01st-icon {\n display: inline-block;\n width: 20px;\n height: 20px;\n vertical-align: middle;\n margin-right: 12px;\n}\n\n.r01st-icon svg {\n width: 100%;\n height: 100%;\n display: block;\n}\n.r01st-message {\n display: inline-block;\n vertical-align: middle;\n word-wrap: break-word;\n max-width: calc(100% - 32px);\n}\n.r01st-close {\n background: transparent;\n border: none;\n color: #ffffff;\n font-size: 24px;\n line-height: 1;\n cursor: pointer;\n padding: 0;\n width: 24px;\n height: 24px;\n text-align: center;\n border-radius: 4px;\n opacity: 0.8;\n}\n\n.r01st-close:hover {\n background-color: rgba(255, 255, 255, 0.2);\n opacity: 1;\n}\n\n.r01st-close:focus {\n outline: 2px solid #ffffff;\n outline-offset: 2px;\n}\n.r01st-container[data-position^="b"] .r01st {\n margin-top: 0;\n margin-bottom: -20px;\n}\n\n.r01st-container[data-position^="b"] .r01st-show {\n margin-bottom: 16px;\n}\n@media (max-width: 480px) {\n .r01st-container {\n left: 0 !important;\n right: 0 !important;\n margin-left: 0 !important;\n padding: 8px;\n }\n\n .r01st {\n min-width: auto;\n max-width: none;\n }\n}\n@media (prefers-reduced-motion: reduce) {\n .r01st {\n transition: opacity 0.2s;\n margin-top: 0;\n }\n}\n@media print {\n .r01st-container {\n display: none;\n }\n}\n',document.head.appendChild(n),a=!0}}(),!s||s.getAttribute("data-position")===n&&s.getAttribute("data-theme")===t||(s.parentNode.removeChild(s),s=null),s||((s=document.createElement("div")).className="r01st-container",s.setAttribute("role","region"),s.setAttribute("aria-label","Notifications"),s.setAttribute("aria-live","polite"),s.setAttribute("data-position",n),s.setAttribute("data-theme",t),document.body.appendChild(s)),s}var c=0,d=new Map;function p(n){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},e=r(r({},i()),t),o=e.position,a=e.duration,s=e.dismissible,p=e.theme,m=e.className,f=e.type,g=void 0===f?"info":f,b=++c;d.size<i().maxToasts||u(d.keys().next().value);var h,v=l(o,p),x=function(n,t,e,r,o,i){var a=document.createElement("div");a.className="r01st r01st-"+t+(r?" "+r:""),a.setAttribute("role","alert"),a.setAttribute("data-toast-id",o);var s=document.createElement("div");s.className="r01st-content";var l=document.createElement("span");l.className="r01st-icon",l.innerHTML=function(n){var t={success:'<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"/></svg>',error:'<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z" clip-rule="evenodd"/></svg>',info:'<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z" clip-rule="evenodd"/></svg>',warning:'<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M8.257 3.099c.765-1.36 2.722-1.36 3.486 0l5.58 9.92c.75 1.334-.213 2.98-1.742 2.98H4.42c-1.53 0-2.493-1.646-1.743-2.98l5.58-9.92zM11 13a1 1 0 11-2 0 1 1 0 012 0zm-1-8a1 1 0 00-1 1v3a1 1 0 002 0V6a1 1 0 00-1-1z" clip-rule="evenodd"/></svg>'};return t[n]||t.info}(t),l.setAttribute("aria-hidden","true"),s.appendChild(l);var c=document.createElement("span");if(c.className="r01st-message",c.textContent=n,s.appendChild(c),e){var d=document.createElement("table");d.className="r01st-table";var p=document.createElement("tr"),u=document.createElement("td");u.className="r01st-cell r01st-message-cell",u.appendChild(s);var m=document.createElement("td");m.className="r01st-cell r01st-close-cell";var f=document.createElement("button");f.className="r01st-close",f.innerHTML="×",f.setAttribute("aria-label","Close notification"),f.onclick=i,m.appendChild(f),p.appendChild(u),p.appendChild(m),d.appendChild(p),a.appendChild(d)}else a.appendChild(s);return a}(n,g,s,m,b,function(){return u(b)});v.appendChild(x),h=x,requestAnimationFrame(function(){h.className=h.className+" r01st-show"});var y={element:x,timeoutId:null};return a>0&&(y.timeoutId=setTimeout(function(){return u(b)},a)),d.set(b,y),b}function u(n){var t=d.get(n);if(t){var e=t.element,r=t.timeoutId;r&&clearTimeout(r),d.delete(n),function(n,t){n.className=n.className.replace(" r01st-show",""),setTimeout(function(){n.parentNode&&n.parentNode.removeChild(n),t&&t()},300)}(e,function(){var n;n=d.size,s&&0===n&&(s.parentNode.removeChild(s),s=null)})}}function m(n){return p(n,arguments.length>1&&void 0!==arguments[1]?arguments[1]:{})}m.success=function(n){return m(n,r(r({},arguments.length>1&&void 0!==arguments[1]?arguments[1]:{}),{},{type:"success"}))},m.error=function(n){return m(n,r(r({},arguments.length>1&&void 0!==arguments[1]?arguments[1]:{}),{},{type:"error"}))},m.info=function(n){return m(n,r(r({},arguments.length>1&&void 0!==arguments[1]?arguments[1]:{}),{},{type:"info"}))},m.warning=function(n){return m(n,r(r({},arguments.length>1&&void 0!==arguments[1]?arguments[1]:{}),{},{type:"warning"}))},m.dismiss=u,m.dismissAll=function(){Array.from(d.keys()).forEach(function(n){return u(n)})},n.configure=function(n){o=r(r({},o),n)},n.default=m,n.toast=m,Object.defineProperty(n,"__esModule",{value:!0})});
|
package/dist/simple-toast.umd.js
CHANGED
|
@@ -48,14 +48,14 @@
|
|
|
48
48
|
return "symbol" == typeof i ? i : i + "";
|
|
49
49
|
}
|
|
50
50
|
|
|
51
|
-
|
|
51
|
+
var defaultConfig = {
|
|
52
52
|
position: 'bc',
|
|
53
53
|
duration: 3000,
|
|
54
54
|
theme: 'l',
|
|
55
55
|
dismissible: true,
|
|
56
56
|
maxToasts: 10
|
|
57
57
|
};
|
|
58
|
-
|
|
58
|
+
var globalConfig = _objectSpread2({}, defaultConfig);
|
|
59
59
|
function configure(config) {
|
|
60
60
|
globalConfig = _objectSpread2(_objectSpread2({}, globalConfig), config);
|
|
61
61
|
}
|
|
@@ -63,17 +63,17 @@
|
|
|
63
63
|
return globalConfig;
|
|
64
64
|
}
|
|
65
65
|
|
|
66
|
-
|
|
66
|
+
var stylesInjected = false;
|
|
67
67
|
function injectStyles() {
|
|
68
68
|
if (stylesInjected) return;
|
|
69
|
-
|
|
69
|
+
var style = document.createElement('style');
|
|
70
70
|
style.setAttribute('data-r01st', '');
|
|
71
71
|
style.textContent = "\n.r01st-container {\n position: fixed;\n z-index: 9999;\n pointer-events: none;\n padding: 16px;\n}\n.r01st-container[data-position=\"tl\"] {\n top: 0;\n left: 0;\n}\n\n.r01st-container[data-position=\"tc\"] {\n top: 0;\n left: 50%;\n margin-left: -210px;\n}\n\n.r01st-container[data-position=\"tr\"] {\n top: 0;\n right: 0;\n}\n.r01st-container[data-position=\"ml\"] {\n top: 50%;\n left: 0;\n margin-top: -50px;\n}\n\n.r01st-container[data-position=\"mc\"] {\n top: 50%;\n left: 50%;\n margin-left: -210px;\n margin-top: -50px;\n}\n\n.r01st-container[data-position=\"mr\"] {\n top: 50%;\n right: 0;\n margin-top: -50px;\n}\n.r01st-container[data-position=\"bl\"] {\n bottom: 0;\n left: 0;\n}\n\n.r01st-container[data-position=\"bc\"] {\n bottom: 0;\n left: 50%;\n margin-left: -210px;\n}\n\n.r01st-container[data-position=\"br\"] {\n bottom: 0;\n right: 0;\n}\n.r01st {\n pointer-events: auto;\n position: relative;\n min-width: 280px;\n max-width: 420px;\n padding: 16px;\n margin-bottom: 16px;\n border-radius: 8px;\n box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);\n font-size: 14px;\n line-height: 1.5;\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;\n color: #ffffff;\n opacity: 0;\n transition: opacity 0.3s ease, margin-top 0.3s ease;\n margin-top: -20px;\n}\n.r01st-show {\n opacity: 1;\n margin-top: 0;\n}\n.r01st-container[data-theme=\"l\"] .r01st-success {\n background-color: #10b981;\n}\n\n.r01st-container[data-theme=\"l\"] .r01st-error {\n background-color: #ef4444;\n}\n\n.r01st-container[data-theme=\"l\"] .r01st-info {\n background-color: #3b82f6;\n}\n\n.r01st-container[data-theme=\"l\"] .r01st-warning {\n background-color: #f59e0b;\n}\n.r01st-container[data-theme=\"d\"] .r01st-success {\n background-color: #059669;\n}\n\n.r01st-container[data-theme=\"d\"] .r01st-error {\n background-color: #dc2626;\n}\n\n.r01st-container[data-theme=\"d\"] .r01st-info {\n background-color: #2563eb;\n}\n\n.r01st-container[data-theme=\"d\"] .r01st-warning {\n background-color: #d97706;\n}\n.r01st-content {\n display: inline-block;\n width: 100%;\n vertical-align: top;\n}\n.r01st-table {\n width: 100%;\n border-collapse: collapse;\n}\n.r01st-cell {\n vertical-align: middle;\n}\n.r01st-message-cell {\n width: 100%;\n}\n.r01st-close-cell {\n width: 1%;\n padding-left: 8px;\n}\n.r01st-icon {\n display: inline-block;\n width: 20px;\n height: 20px;\n vertical-align: middle;\n margin-right: 12px;\n}\n\n.r01st-icon svg {\n width: 100%;\n height: 100%;\n display: block;\n}\n.r01st-message {\n display: inline-block;\n vertical-align: middle;\n word-wrap: break-word;\n max-width: calc(100% - 32px);\n}\n.r01st-close {\n background: transparent;\n border: none;\n color: #ffffff;\n font-size: 24px;\n line-height: 1;\n cursor: pointer;\n padding: 0;\n width: 24px;\n height: 24px;\n text-align: center;\n border-radius: 4px;\n opacity: 0.8;\n}\n\n.r01st-close:hover {\n background-color: rgba(255, 255, 255, 0.2);\n opacity: 1;\n}\n\n.r01st-close:focus {\n outline: 2px solid #ffffff;\n outline-offset: 2px;\n}\n.r01st-container[data-position^=\"b\"] .r01st {\n margin-top: 0;\n margin-bottom: -20px;\n}\n\n.r01st-container[data-position^=\"b\"] .r01st-show {\n margin-bottom: 16px;\n}\n@media (max-width: 480px) {\n .r01st-container {\n left: 0 !important;\n right: 0 !important;\n margin-left: 0 !important;\n padding: 8px;\n }\n\n .r01st {\n min-width: auto;\n max-width: none;\n }\n}\n@media (prefers-reduced-motion: reduce) {\n .r01st {\n transition: opacity 0.2s;\n margin-top: 0;\n }\n}\n@media print {\n .r01st-container {\n display: none;\n }\n}\n";
|
|
72
72
|
document.head.appendChild(style);
|
|
73
73
|
stylesInjected = true;
|
|
74
74
|
}
|
|
75
75
|
|
|
76
|
-
|
|
76
|
+
var container = null;
|
|
77
77
|
function getContainer(position, theme) {
|
|
78
78
|
injectStyles();
|
|
79
79
|
if (container && (container.getAttribute('data-position') !== position || container.getAttribute('data-theme') !== theme)) {
|
|
@@ -100,7 +100,7 @@
|
|
|
100
100
|
}
|
|
101
101
|
|
|
102
102
|
function getIcon(type) {
|
|
103
|
-
|
|
103
|
+
var icons = {
|
|
104
104
|
success: '<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"/></svg>',
|
|
105
105
|
error: '<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zM8.707 7.293a1 1 0 00-1.414 1.414L8.586 10l-1.293 1.293a1 1 0 101.414 1.414L10 11.414l1.293 1.293a1 1 0 001.414-1.414L11.414 10l1.293-1.293a1 1 0 00-1.414-1.414L10 8.586 8.707 7.293z" clip-rule="evenodd"/></svg>',
|
|
106
106
|
info: '<svg viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z" clip-rule="evenodd"/></svg>',
|
|
@@ -110,31 +110,31 @@
|
|
|
110
110
|
}
|
|
111
111
|
|
|
112
112
|
function createToastElement(message, type, dismissible, className, id, onClose) {
|
|
113
|
-
|
|
113
|
+
var toastEl = document.createElement('div');
|
|
114
114
|
toastEl.className = 'r01st r01st-' + type + (className ? ' ' + className : '');
|
|
115
115
|
toastEl.setAttribute('role', 'alert');
|
|
116
116
|
toastEl.setAttribute('data-toast-id', id);
|
|
117
|
-
|
|
117
|
+
var content = document.createElement('div');
|
|
118
118
|
content.className = 'r01st-content';
|
|
119
|
-
|
|
119
|
+
var icon = document.createElement('span');
|
|
120
120
|
icon.className = 'r01st-icon';
|
|
121
121
|
icon.innerHTML = getIcon(type);
|
|
122
122
|
icon.setAttribute('aria-hidden', 'true');
|
|
123
123
|
content.appendChild(icon);
|
|
124
|
-
|
|
124
|
+
var messageEl = document.createElement('span');
|
|
125
125
|
messageEl.className = 'r01st-message';
|
|
126
126
|
messageEl.textContent = message;
|
|
127
127
|
content.appendChild(messageEl);
|
|
128
128
|
if (dismissible) {
|
|
129
|
-
|
|
129
|
+
var layoutTable = document.createElement('table');
|
|
130
130
|
layoutTable.className = 'r01st-table';
|
|
131
|
-
|
|
132
|
-
|
|
131
|
+
var layoutRow = document.createElement('tr');
|
|
132
|
+
var messageCell = document.createElement('td');
|
|
133
133
|
messageCell.className = 'r01st-cell r01st-message-cell';
|
|
134
134
|
messageCell.appendChild(content);
|
|
135
|
-
|
|
135
|
+
var closeCell = document.createElement('td');
|
|
136
136
|
closeCell.className = 'r01st-cell r01st-close-cell';
|
|
137
|
-
|
|
137
|
+
var closeBtn = document.createElement('button');
|
|
138
138
|
closeBtn.className = 'r01st-close';
|
|
139
139
|
closeBtn.innerHTML = '×';
|
|
140
140
|
closeBtn.setAttribute('aria-label', 'Close notification');
|
|
@@ -151,13 +151,13 @@
|
|
|
151
151
|
}
|
|
152
152
|
|
|
153
153
|
function showToast(element) {
|
|
154
|
-
requestAnimationFrame(()
|
|
154
|
+
requestAnimationFrame(function () {
|
|
155
155
|
element.className = element.className + ' r01st-show';
|
|
156
156
|
});
|
|
157
157
|
}
|
|
158
158
|
function hideToast(element, callback) {
|
|
159
159
|
element.className = element.className.replace(' r01st-show', '');
|
|
160
|
-
setTimeout(()
|
|
160
|
+
setTimeout(function () {
|
|
161
161
|
if (element.parentNode) {
|
|
162
162
|
element.parentNode.removeChild(element);
|
|
163
163
|
}
|
|
@@ -165,57 +165,60 @@
|
|
|
165
165
|
}, 300);
|
|
166
166
|
}
|
|
167
167
|
|
|
168
|
-
|
|
169
|
-
|
|
168
|
+
var toastCounter = 0;
|
|
169
|
+
var activeToasts = new Map();
|
|
170
170
|
function createToast(message) {
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
type = 'info'
|
|
180
|
-
|
|
181
|
-
const id = ++toastCounter;
|
|
171
|
+
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
172
|
+
var config = _objectSpread2(_objectSpread2({}, getConfig()), options);
|
|
173
|
+
var position = config.position,
|
|
174
|
+
duration = config.duration,
|
|
175
|
+
dismissible = config.dismissible,
|
|
176
|
+
theme = config.theme,
|
|
177
|
+
className = config.className,
|
|
178
|
+
_config$type = config.type,
|
|
179
|
+
type = _config$type === void 0 ? 'info' : _config$type;
|
|
180
|
+
var id = ++toastCounter;
|
|
182
181
|
if (activeToasts.size >= getConfig().maxToasts) {
|
|
183
|
-
|
|
182
|
+
var firstToast = activeToasts.keys().next().value;
|
|
184
183
|
dismissToast(firstToast);
|
|
185
184
|
}
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
185
|
+
var container = getContainer(position, theme);
|
|
186
|
+
var handleClose = function handleClose() {
|
|
187
|
+
return dismissToast(id);
|
|
188
|
+
};
|
|
189
|
+
var toastEl = createToastElement(message, type, dismissible, className, id, handleClose);
|
|
189
190
|
container.appendChild(toastEl);
|
|
190
191
|
showToast(toastEl);
|
|
191
|
-
|
|
192
|
+
var toastData = {
|
|
192
193
|
element: toastEl,
|
|
193
194
|
timeoutId: null
|
|
194
195
|
};
|
|
195
196
|
if (duration > 0) {
|
|
196
|
-
toastData.timeoutId = setTimeout(
|
|
197
|
+
toastData.timeoutId = setTimeout(function () {
|
|
198
|
+
return dismissToast(id);
|
|
199
|
+
}, duration);
|
|
197
200
|
}
|
|
198
201
|
activeToasts.set(id, toastData);
|
|
199
202
|
return id;
|
|
200
203
|
}
|
|
201
204
|
function dismissToast(id) {
|
|
202
|
-
|
|
205
|
+
var toastData = activeToasts.get(id);
|
|
203
206
|
if (!toastData) return;
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
timeoutId
|
|
207
|
-
} = toastData;
|
|
207
|
+
var element = toastData.element,
|
|
208
|
+
timeoutId = toastData.timeoutId;
|
|
208
209
|
if (timeoutId) {
|
|
209
210
|
clearTimeout(timeoutId);
|
|
210
211
|
}
|
|
211
212
|
activeToasts.delete(id);
|
|
212
|
-
hideToast(element, ()
|
|
213
|
+
hideToast(element, function () {
|
|
213
214
|
cleanupContainer(activeToasts.size);
|
|
214
215
|
});
|
|
215
216
|
}
|
|
216
217
|
function dismissAllToasts() {
|
|
217
|
-
|
|
218
|
-
ids.forEach(
|
|
218
|
+
var ids = Array.from(activeToasts.keys());
|
|
219
|
+
ids.forEach(function (id) {
|
|
220
|
+
return dismissToast(id);
|
|
221
|
+
});
|
|
219
222
|
}
|
|
220
223
|
|
|
221
224
|
/**
|
|
@@ -225,31 +228,31 @@
|
|
|
225
228
|
* @returns {number} Toast ID
|
|
226
229
|
*/
|
|
227
230
|
function toast(message) {
|
|
228
|
-
|
|
231
|
+
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
229
232
|
return createToast(message, options);
|
|
230
233
|
}
|
|
231
234
|
|
|
232
235
|
// Shorthand methods
|
|
233
236
|
toast.success = function (message) {
|
|
234
|
-
|
|
237
|
+
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
235
238
|
return toast(message, _objectSpread2(_objectSpread2({}, options), {}, {
|
|
236
239
|
type: 'success'
|
|
237
240
|
}));
|
|
238
241
|
};
|
|
239
242
|
toast.error = function (message) {
|
|
240
|
-
|
|
243
|
+
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
241
244
|
return toast(message, _objectSpread2(_objectSpread2({}, options), {}, {
|
|
242
245
|
type: 'error'
|
|
243
246
|
}));
|
|
244
247
|
};
|
|
245
248
|
toast.info = function (message) {
|
|
246
|
-
|
|
249
|
+
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
247
250
|
return toast(message, _objectSpread2(_objectSpread2({}, options), {}, {
|
|
248
251
|
type: 'info'
|
|
249
252
|
}));
|
|
250
253
|
};
|
|
251
254
|
toast.warning = function (message) {
|
|
252
|
-
|
|
255
|
+
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
253
256
|
return toast(message, _objectSpread2(_objectSpread2({}, options), {}, {
|
|
254
257
|
type: 'warning'
|
|
255
258
|
}));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@r01al/simple-toast",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.5",
|
|
4
4
|
"description": "Lightweight, framework-agnostic toast notification library with zero dependencies",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"toast",
|
|
@@ -20,9 +20,9 @@
|
|
|
20
20
|
"url": "https://github.com/r01al/simple-toast/issues"
|
|
21
21
|
},
|
|
22
22
|
"homepage": "https://github.com/r01al/simple-toast#readme",
|
|
23
|
-
"main": "dist/simple-toast.
|
|
24
|
-
"module": "dist/simple-toast.esm.js",
|
|
25
|
-
"browser": "dist/simple-toast.
|
|
23
|
+
"main": "dist/simple-toast.min.js",
|
|
24
|
+
"module": "dist/simple-toast.esm.min.js",
|
|
25
|
+
"browser": "dist/simple-toast.min.js",
|
|
26
26
|
"types": "dist/toast.d.ts",
|
|
27
27
|
"files": [
|
|
28
28
|
"dist"
|
|
@@ -30,7 +30,8 @@
|
|
|
30
30
|
"scripts": {
|
|
31
31
|
"build": "rollup -c && cp src/toast.d.ts dist/toast.d.ts",
|
|
32
32
|
"dev": "rollup -c -w",
|
|
33
|
-
"test": "echo \"Error: no test specified\" && exit 1"
|
|
33
|
+
"test": "echo \"Error: no test specified\" && exit 1",
|
|
34
|
+
"publish": "npm version patch && npm run build && npm pack && npm publish --access public"
|
|
34
35
|
},
|
|
35
36
|
"devDependencies": {
|
|
36
37
|
"@babel/core": "^7.28.5",
|