1 | (function (global, factory) {
|
2 | typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
|
3 | typeof define === 'function' && define.amd ? define(factory) :
|
4 | (global.nativeToast = factory());
|
5 | }(this, (function () { 'use strict';
|
6 |
|
7 | |
8 |
|
9 |
|
10 |
|
11 |
|
12 |
|
13 | var index = function(obj) {
|
14 | var arguments$1 = arguments;
|
15 |
|
16 | for (var i = 1; i < arguments.length; i++) {
|
17 |
|
18 | for (var p in arguments[i]) { obj[p] = arguments$1[i][p]; }
|
19 | }
|
20 | return obj
|
21 | };
|
22 |
|
23 | var nanoAssign_common = index;
|
24 |
|
25 | var prevToast = null;
|
26 | var icons = {
|
27 | warning: "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"feather feather-alert-circle\"><circle cx=\"12\" cy=\"12\" r=\"10\"></circle><line x1=\"12\" y1=\"8\" x2=\"12\" y2=\"12\"></line><line x1=\"12\" y1=\"16\" x2=\"12\" y2=\"16\"></line></svg>",
|
28 | success: "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"feather feather-check-circle\"><path d=\"M22 11.08V12a10 10 0 1 1-5.93-9.14\"></path><polyline points=\"22 4 12 14.01 9 11.01\"></polyline></svg>",
|
29 | info: "<svg viewBox=\"0 0 32 32\" width=\"32\" height=\"32\" fill=\"none\" stroke=\"currentcolor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"6.25%\"><path d=\"M16 14 L16 23 M16 8 L16 10\" /><circle cx=\"16\" cy=\"16\" r=\"14\" /></svg>",
|
30 | error: "<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"feather feather-alert-triangle\"><path d=\"M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z\"></path><line x1=\"12\" y1=\"9\" x2=\"12\" y2=\"13\"></line><line x1=\"12\" y1=\"17\" x2=\"12\" y2=\"17\"></line></svg>"
|
31 | };
|
32 |
|
33 | var Toast = function Toast(ref) {
|
34 | var this$1 = this;
|
35 | if ( ref === void 0 ) ref = {};
|
36 | var message = ref.message; if ( message === void 0 ) message = '';
|
37 | var position = ref.position; if ( position === void 0 ) position = 'south-east';
|
38 | var timeout = ref.timeout; if ( timeout === void 0 ) timeout = 3000;
|
39 | var el = ref.el; if ( el === void 0 ) el = document.body;
|
40 | var rounded = ref.rounded; if ( rounded === void 0 ) rounded = false;
|
41 | var type = ref.type; if ( type === void 0 ) type = '';
|
42 | var debug = ref.debug; if ( debug === void 0 ) debug = false;
|
43 | var edge = ref.edge; if ( edge === void 0 ) edge = false;
|
44 | var icon = ref.icon; if ( icon === void 0 ) icon = true;
|
45 | var closeOnClick = ref.closeOnClick; if ( closeOnClick === void 0 ) closeOnClick = false;
|
46 | var elements = ref.elements; if ( elements === void 0 ) elements = [];
|
47 |
|
48 | if (prevToast) {
|
49 | prevToast.destroy();
|
50 | }
|
51 |
|
52 | this.message = message;
|
53 | this.position = position;
|
54 | this.el = el;
|
55 | this.timeout = timeout;
|
56 | this.closeOnClick = closeOnClick;
|
57 | this.toast = document.createElement('div');
|
58 | this.toast.className = "native-toast native-toast-" + (this.position);
|
59 |
|
60 | if (type) {
|
61 | this.toast.className += " native-toast-" + type;
|
62 |
|
63 | if (icon) {
|
64 | this.message = "<span class=\"native-toast-icon-" + type + "\">" + (icons[type] || '') + "</span>" + (this.message);
|
65 | }
|
66 | }
|
67 |
|
68 | var messageElement = document.createElement('div');
|
69 | messageElement.className = 'native-toast-message';
|
70 | messageElement.innerHTML = this.message;
|
71 | [messageElement ].concat( elements).forEach(function (el) {
|
72 | this$1.toast.appendChild(el);
|
73 | });
|
74 | var isMobile = document.body.clientWidth < 768;
|
75 |
|
76 | if (edge || isMobile) {
|
77 | this.toast.className += ' native-toast-edge';
|
78 | } else if (rounded) {
|
79 | this.toast.style.borderRadius = '33px';
|
80 | }
|
81 |
|
82 | this.el.appendChild(this.toast);
|
83 | prevToast = this;
|
84 | this.show();
|
85 |
|
86 | if (!debug && timeout) {
|
87 | this.hide();
|
88 | }
|
89 |
|
90 | if (this.closeOnClick) {
|
91 | this.toast.addEventListener('click', function () {
|
92 | this$1.destroy();
|
93 | });
|
94 | }
|
95 | };
|
96 |
|
97 | Toast.prototype.show = function show () {
|
98 | var this$1 = this;
|
99 |
|
100 | setTimeout(function () {
|
101 | this$1.toast.classList.add('native-toast-shown');
|
102 | }, 300);
|
103 | };
|
104 |
|
105 | Toast.prototype.hide = function hide () {
|
106 | var this$1 = this;
|
107 |
|
108 | setTimeout(function () {
|
109 | this$1.destroy();
|
110 | }, this.timeout);
|
111 | };
|
112 |
|
113 | Toast.prototype.destroy = function destroy () {
|
114 | var this$1 = this;
|
115 |
|
116 | if (!this.toast) { return; }
|
117 | this.toast.classList.remove('native-toast-shown');
|
118 | setTimeout(function () {
|
119 | if (this$1.toast) {
|
120 | this$1.el.removeChild(this$1.toast);
|
121 | this$1.toast = null;
|
122 | }
|
123 | }, 300);
|
124 | };
|
125 |
|
126 | function toast(options) {
|
127 | return new Toast(options);
|
128 | }
|
129 |
|
130 | var loop = function () {
|
131 | toast[type] = function (options) { return toast(nanoAssign_common({
|
132 | type: type
|
133 | }, options)); };
|
134 | };
|
135 |
|
136 | for (var type of ['success', 'info', 'warning', 'error']) loop();
|
137 |
|
138 | return toast;
|
139 |
|
140 | })));
|