react-toast-msg 0.1.0 → 1.0.2
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/index.css +2 -0
- package/dist/index.css.map +1 -0
- package/dist/index.es.css +2 -0
- package/dist/index.es.css.map +1 -0
- package/dist/index.es.js +32 -21
- package/dist/index.es.js.map +1 -1
- package/dist/index.js +32 -21
- package/dist/index.js.map +1 -1
- package/package.json +3 -2
package/dist/index.css
ADDED
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
.toast-container{display:flex;flex-direction:column;gap:8px;left:50%;max-width:90vw;position:fixed;top:20px;transform:translateX(-50%);width:auto;z-index:9999}.toast{animation:fadeInOut 3s ease-in-out forwards;background-color:#fff;border-radius:4px;box-shadow:0 2px 6px rgba(0,0,0,.15);color:#000;max-width:400px;min-width:200px;opacity:0;padding:10px 20px}.toast.success{background-color:#d4edda}.toast.error{background-color:#f8d7da}@keyframes fadeInOut{0%{opacity:0;transform:translateY(-10px)}10%{opacity:1;transform:translateY(0)}90%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-10px)}}
|
|
2
|
+
/*# sourceMappingURL=index.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["global.css"],"names":[],"mappings":"AAEA,iBAMI,YAAa,CACb,qBAAsB,CACtB,OAAQ,CALR,QAAS,CAOT,cAAe,CATf,cAAe,CACf,QAAS,CAET,0BAA2B,CAK3B,UAAW,CAJX,YAMJ,CAEA,OASI,2CAA4C,CAL5C,qBAAsB,CAFtB,iBAAkB,CAGlB,oCAAyC,CAFzC,UAAW,CAIX,eAAgB,CADhB,eAAgB,CAEhB,SAAU,CAPV,iBASJ,CAEA,eACI,wBACJ,CAEA,aACI,wBACJ,CAEA,qBACI,GACI,SAAU,CACV,2BACJ,CAEA,IACI,SAAU,CACV,uBACJ,CAEA,IACI,SAAU,CACV,uBACJ,CAEA,GACI,SAAU,CACV,2BACJ,CACJ","file":"index.css","sourcesContent":["/* ToastContainer.css */\r\n\r\n.toast-container {\r\n position: fixed;\r\n top: 20px;\r\n left: 50%;\r\n transform: translateX(-50%);\r\n z-index: 9999;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n width: auto;\r\n max-width: 90vw;\r\n}\r\n\r\n.toast {\r\n padding: 10px 20px;\r\n border-radius: 4px;\r\n color: #000;\r\n background-color: #fff;\r\n box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);\r\n min-width: 200px;\r\n max-width: 400px;\r\n opacity: 0;\r\n animation: fadeInOut 3s ease-in-out forwards;\r\n}\r\n\r\n.toast.success {\r\n background-color: #d4edda;\r\n}\r\n\r\n.toast.error {\r\n background-color: #f8d7da;\r\n}\r\n\r\n@keyframes fadeInOut {\r\n 0% {\r\n opacity: 0;\r\n transform: translateY(-10px);\r\n }\r\n\r\n 10% {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n\r\n 90% {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n\r\n 100% {\r\n opacity: 0;\r\n transform: translateY(-10px);\r\n }\r\n}"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
.toast-container{display:flex;flex-direction:column;gap:8px;left:50%;max-width:90vw;position:fixed;top:20px;transform:translateX(-50%);width:auto;z-index:9999}.toast{animation:fadeInOut 3s ease-in-out forwards;background-color:#fff;border-radius:4px;box-shadow:0 2px 6px rgba(0,0,0,.15);color:#000;max-width:400px;min-width:200px;opacity:0;padding:10px 20px}.toast.success{background-color:#d4edda}.toast.error{background-color:#f8d7da}@keyframes fadeInOut{0%{opacity:0;transform:translateY(-10px)}10%{opacity:1;transform:translateY(0)}90%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-10px)}}
|
|
2
|
+
/*# sourceMappingURL=index.es.css.map */
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["global.css"],"names":[],"mappings":"AAEA,iBAMI,YAAa,CACb,qBAAsB,CACtB,OAAQ,CALR,QAAS,CAOT,cAAe,CATf,cAAe,CACf,QAAS,CAET,0BAA2B,CAK3B,UAAW,CAJX,YAMJ,CAEA,OASI,2CAA4C,CAL5C,qBAAsB,CAFtB,iBAAkB,CAGlB,oCAAyC,CAFzC,UAAW,CAIX,eAAgB,CADhB,eAAgB,CAEhB,SAAU,CAPV,iBASJ,CAEA,eACI,wBACJ,CAEA,aACI,wBACJ,CAEA,qBACI,GACI,SAAU,CACV,2BACJ,CAEA,IACI,SAAU,CACV,uBACJ,CAEA,IACI,SAAU,CACV,uBACJ,CAEA,GACI,SAAU,CACV,2BACJ,CACJ","file":"index.es.css","sourcesContent":["/* ToastContainer.css */\r\n\r\n.toast-container {\r\n position: fixed;\r\n top: 20px;\r\n left: 50%;\r\n transform: translateX(-50%);\r\n z-index: 9999;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n width: auto;\r\n max-width: 90vw;\r\n}\r\n\r\n.toast {\r\n padding: 10px 20px;\r\n border-radius: 4px;\r\n color: #000;\r\n background-color: #fff;\r\n box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);\r\n min-width: 200px;\r\n max-width: 400px;\r\n opacity: 0;\r\n animation: fadeInOut 3s ease-in-out forwards;\r\n}\r\n\r\n.toast.success {\r\n background-color: #d4edda;\r\n}\r\n\r\n.toast.error {\r\n background-color: #f8d7da;\r\n}\r\n\r\n@keyframes fadeInOut {\r\n 0% {\r\n opacity: 0;\r\n transform: translateY(-10px);\r\n }\r\n\r\n 10% {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n\r\n 90% {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n\r\n 100% {\r\n opacity: 0;\r\n transform: translateY(-10px);\r\n }\r\n}"]}
|
package/dist/index.es.js
CHANGED
|
@@ -61,6 +61,36 @@ function _unsupportedIterableToArray(r, a) {
|
|
|
61
61
|
}
|
|
62
62
|
}
|
|
63
63
|
|
|
64
|
+
function styleInject(css, ref) {
|
|
65
|
+
if ( ref === void 0 ) ref = {};
|
|
66
|
+
var insertAt = ref.insertAt;
|
|
67
|
+
|
|
68
|
+
if (!css || typeof document === 'undefined') { return; }
|
|
69
|
+
|
|
70
|
+
var head = document.head || document.getElementsByTagName('head')[0];
|
|
71
|
+
var style = document.createElement('style');
|
|
72
|
+
style.type = 'text/css';
|
|
73
|
+
|
|
74
|
+
if (insertAt === 'top') {
|
|
75
|
+
if (head.firstChild) {
|
|
76
|
+
head.insertBefore(style, head.firstChild);
|
|
77
|
+
} else {
|
|
78
|
+
head.appendChild(style);
|
|
79
|
+
}
|
|
80
|
+
} else {
|
|
81
|
+
head.appendChild(style);
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
if (style.styleSheet) {
|
|
85
|
+
style.styleSheet.cssText = css;
|
|
86
|
+
} else {
|
|
87
|
+
style.appendChild(document.createTextNode(css));
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
var css_248z = ".toast-container {\r\n position: fixed;\r\n top: 20px;\r\n left: 50%;\r\n transform: translateX(-50%);\r\n z-index: 9999;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n width: auto;\r\n max-width: 90vw;\r\n}\r\n\r\n.toast {\r\n padding: 10px 20px;\r\n border-radius: 4px;\r\n color: #000;\r\n background-color: #fff;\r\n box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);\r\n min-width: 200px;\r\n max-width: 400px;\r\n opacity: 0;\r\n animation: fadeInOut 3s ease-in-out forwards;\r\n}\r\n\r\n.toast.success {\r\n background-color: #d4edda;\r\n}\r\n\r\n.toast.error {\r\n background-color: #f8d7da;\r\n}\r\n\r\n@keyframes fadeInOut {\r\n 0% {\r\n opacity: 0;\r\n transform: translateY(-10px);\r\n }\r\n\r\n 10% {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n\r\n 90% {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n\r\n 100% {\r\n opacity: 0;\r\n transform: translateY(-10px);\r\n }\r\n}";
|
|
92
|
+
styleInject(css_248z);
|
|
93
|
+
|
|
64
94
|
function ToastContainer() {
|
|
65
95
|
var _useState = useState([]),
|
|
66
96
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -79,30 +109,11 @@ function ToastContainer() {
|
|
|
79
109
|
});
|
|
80
110
|
}, []);
|
|
81
111
|
return /*#__PURE__*/React.createElement("div", {
|
|
82
|
-
|
|
83
|
-
position: 'fixed',
|
|
84
|
-
top: 20,
|
|
85
|
-
left: '50%',
|
|
86
|
-
transform: 'translateX(-50%)',
|
|
87
|
-
zIndex: 9999,
|
|
88
|
-
display: 'flex',
|
|
89
|
-
flexDirection: 'column',
|
|
90
|
-
gap: '8px',
|
|
91
|
-
width: 'auto',
|
|
92
|
-
maxWidth: '90vw'
|
|
93
|
-
}
|
|
112
|
+
className: "toast-container"
|
|
94
113
|
}, toasts.map(function (t, i) {
|
|
95
114
|
return /*#__PURE__*/React.createElement("div", {
|
|
96
115
|
key: i,
|
|
97
|
-
|
|
98
|
-
padding: '10px 20px',
|
|
99
|
-
borderRadius: 4,
|
|
100
|
-
color: '#000',
|
|
101
|
-
backgroundColor: t.type === 'success' ? '#d4edda' : t.type === 'error' ? '#f8d7da' : '#fff',
|
|
102
|
-
boxShadow: '0 2px 6px rgba(0,0,0,0.15)',
|
|
103
|
-
minWidth: 200,
|
|
104
|
-
maxWidth: 400
|
|
105
|
-
}
|
|
116
|
+
className: "toast ".concat(t.type)
|
|
106
117
|
}, t.message);
|
|
107
118
|
}));
|
|
108
119
|
}
|
package/dist/index.es.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.es.js","sources":["../src/ToastContainer.jsx","../src/index.js"],"sourcesContent":["import React, { useEffect, useState } from 'react';\r\nimport { _register } from './index.js';\r\n\r\nexport default function ToastContainer() {\r\n const [toasts, setToasts] = useState([]);\r\n\r\n useEffect(() => {\r\n _register((toast) => {\r\n setToasts((prev) => [...prev, toast]);\r\n setTimeout(() => {\r\n setToasts((prev) => prev.slice(1));\r\n }, 3000);\r\n });\r\n }, []);\r\n\r\n return (\r\n <div
|
|
1
|
+
{"version":3,"file":"index.es.js","sources":["../node_modules/style-inject/dist/style-inject.es.js","../src/ToastContainer.jsx","../src/index.js"],"sourcesContent":["function styleInject(css, ref) {\n if ( ref === void 0 ) ref = {};\n var insertAt = ref.insertAt;\n\n if (!css || typeof document === 'undefined') { return; }\n\n var head = document.head || document.getElementsByTagName('head')[0];\n var style = document.createElement('style');\n style.type = 'text/css';\n\n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild);\n } else {\n head.appendChild(style);\n }\n } else {\n head.appendChild(style);\n }\n\n if (style.styleSheet) {\n style.styleSheet.cssText = css;\n } else {\n style.appendChild(document.createTextNode(css));\n }\n}\n\nexport default styleInject;\n","import React, { useEffect, useState } from 'react';\r\nimport { _register } from './index.js';\r\nimport './global.css';\r\n\r\nexport default function ToastContainer() {\r\n const [toasts, setToasts] = useState([]);\r\n\r\n useEffect(() => {\r\n _register((toast) => {\r\n setToasts((prev) => [...prev, toast]);\r\n setTimeout(() => {\r\n setToasts((prev) => prev.slice(1));\r\n }, 3000);\r\n });\r\n }, []);\r\n\r\n return (\r\n <div className=\"toast-container\">\r\n {toasts.map((t, i) => (\r\n <div\r\n key={i}\r\n className={`toast ${t.type}`}\r\n >\r\n {t.message}\r\n </div>\r\n ))}\r\n </div>\r\n );\r\n}","import ToastContainer from './ToastContainer.jsx';\r\n\r\nlet addToast;\r\n\r\nconst toast = {\r\n show(message) {\r\n addToast && addToast({ message, type: 'default' });\r\n },\r\n success(message) {\r\n addToast && addToast({ message, type: 'success' });\r\n },\r\n error(message) {\r\n addToast && addToast({ message, type: 'error' });\r\n },\r\n};\r\n\r\nfunction _register(fn) {\r\n addToast = fn;\r\n}\r\n\r\nexport { ToastContainer, toast, _register };"],"names":["ToastContainer","_useState","useState","_useState2","_slicedToArray","toasts","setToasts","useEffect","_register","toast","prev","concat","_toConsumableArray","setTimeout","slice","React","createElement","className","map","t","i","key","type","message","addToast","show","success","error","fn"],"mappings":"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","x_google_ignoreList":[0]}
|
package/dist/index.js
CHANGED
|
@@ -63,6 +63,36 @@ function _unsupportedIterableToArray(r, a) {
|
|
|
63
63
|
}
|
|
64
64
|
}
|
|
65
65
|
|
|
66
|
+
function styleInject(css, ref) {
|
|
67
|
+
if ( ref === void 0 ) ref = {};
|
|
68
|
+
var insertAt = ref.insertAt;
|
|
69
|
+
|
|
70
|
+
if (!css || typeof document === 'undefined') { return; }
|
|
71
|
+
|
|
72
|
+
var head = document.head || document.getElementsByTagName('head')[0];
|
|
73
|
+
var style = document.createElement('style');
|
|
74
|
+
style.type = 'text/css';
|
|
75
|
+
|
|
76
|
+
if (insertAt === 'top') {
|
|
77
|
+
if (head.firstChild) {
|
|
78
|
+
head.insertBefore(style, head.firstChild);
|
|
79
|
+
} else {
|
|
80
|
+
head.appendChild(style);
|
|
81
|
+
}
|
|
82
|
+
} else {
|
|
83
|
+
head.appendChild(style);
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
if (style.styleSheet) {
|
|
87
|
+
style.styleSheet.cssText = css;
|
|
88
|
+
} else {
|
|
89
|
+
style.appendChild(document.createTextNode(css));
|
|
90
|
+
}
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
var css_248z = ".toast-container {\r\n position: fixed;\r\n top: 20px;\r\n left: 50%;\r\n transform: translateX(-50%);\r\n z-index: 9999;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 8px;\r\n width: auto;\r\n max-width: 90vw;\r\n}\r\n\r\n.toast {\r\n padding: 10px 20px;\r\n border-radius: 4px;\r\n color: #000;\r\n background-color: #fff;\r\n box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);\r\n min-width: 200px;\r\n max-width: 400px;\r\n opacity: 0;\r\n animation: fadeInOut 3s ease-in-out forwards;\r\n}\r\n\r\n.toast.success {\r\n background-color: #d4edda;\r\n}\r\n\r\n.toast.error {\r\n background-color: #f8d7da;\r\n}\r\n\r\n@keyframes fadeInOut {\r\n 0% {\r\n opacity: 0;\r\n transform: translateY(-10px);\r\n }\r\n\r\n 10% {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n\r\n 90% {\r\n opacity: 1;\r\n transform: translateY(0);\r\n }\r\n\r\n 100% {\r\n opacity: 0;\r\n transform: translateY(-10px);\r\n }\r\n}";
|
|
94
|
+
styleInject(css_248z);
|
|
95
|
+
|
|
66
96
|
function ToastContainer() {
|
|
67
97
|
var _useState = React.useState([]),
|
|
68
98
|
_useState2 = _slicedToArray(_useState, 2),
|
|
@@ -81,30 +111,11 @@ function ToastContainer() {
|
|
|
81
111
|
});
|
|
82
112
|
}, []);
|
|
83
113
|
return /*#__PURE__*/React.createElement("div", {
|
|
84
|
-
|
|
85
|
-
position: 'fixed',
|
|
86
|
-
top: 20,
|
|
87
|
-
left: '50%',
|
|
88
|
-
transform: 'translateX(-50%)',
|
|
89
|
-
zIndex: 9999,
|
|
90
|
-
display: 'flex',
|
|
91
|
-
flexDirection: 'column',
|
|
92
|
-
gap: '8px',
|
|
93
|
-
width: 'auto',
|
|
94
|
-
maxWidth: '90vw'
|
|
95
|
-
}
|
|
114
|
+
className: "toast-container"
|
|
96
115
|
}, toasts.map(function (t, i) {
|
|
97
116
|
return /*#__PURE__*/React.createElement("div", {
|
|
98
117
|
key: i,
|
|
99
|
-
|
|
100
|
-
padding: '10px 20px',
|
|
101
|
-
borderRadius: 4,
|
|
102
|
-
color: '#000',
|
|
103
|
-
backgroundColor: t.type === 'success' ? '#d4edda' : t.type === 'error' ? '#f8d7da' : '#fff',
|
|
104
|
-
boxShadow: '0 2px 6px rgba(0,0,0,0.15)',
|
|
105
|
-
minWidth: 200,
|
|
106
|
-
maxWidth: 400
|
|
107
|
-
}
|
|
118
|
+
className: "toast ".concat(t.type)
|
|
108
119
|
}, t.message);
|
|
109
120
|
}));
|
|
110
121
|
}
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../src/ToastContainer.jsx","../src/index.js"],"sourcesContent":["import React, { useEffect, useState } from 'react';\r\nimport { _register } from './index.js';\r\n\r\nexport default function ToastContainer() {\r\n const [toasts, setToasts] = useState([]);\r\n\r\n useEffect(() => {\r\n _register((toast) => {\r\n setToasts((prev) => [...prev, toast]);\r\n setTimeout(() => {\r\n setToasts((prev) => prev.slice(1));\r\n }, 3000);\r\n });\r\n }, []);\r\n\r\n return (\r\n <div
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../node_modules/style-inject/dist/style-inject.es.js","../src/ToastContainer.jsx","../src/index.js"],"sourcesContent":["function styleInject(css, ref) {\n if ( ref === void 0 ) ref = {};\n var insertAt = ref.insertAt;\n\n if (!css || typeof document === 'undefined') { return; }\n\n var head = document.head || document.getElementsByTagName('head')[0];\n var style = document.createElement('style');\n style.type = 'text/css';\n\n if (insertAt === 'top') {\n if (head.firstChild) {\n head.insertBefore(style, head.firstChild);\n } else {\n head.appendChild(style);\n }\n } else {\n head.appendChild(style);\n }\n\n if (style.styleSheet) {\n style.styleSheet.cssText = css;\n } else {\n style.appendChild(document.createTextNode(css));\n }\n}\n\nexport default styleInject;\n","import React, { useEffect, useState } from 'react';\r\nimport { _register } from './index.js';\r\nimport './global.css';\r\n\r\nexport default function ToastContainer() {\r\n const [toasts, setToasts] = useState([]);\r\n\r\n useEffect(() => {\r\n _register((toast) => {\r\n setToasts((prev) => [...prev, toast]);\r\n setTimeout(() => {\r\n setToasts((prev) => prev.slice(1));\r\n }, 3000);\r\n });\r\n }, []);\r\n\r\n return (\r\n <div className=\"toast-container\">\r\n {toasts.map((t, i) => (\r\n <div\r\n key={i}\r\n className={`toast ${t.type}`}\r\n >\r\n {t.message}\r\n </div>\r\n ))}\r\n </div>\r\n );\r\n}","import ToastContainer from './ToastContainer.jsx';\r\n\r\nlet addToast;\r\n\r\nconst toast = {\r\n show(message) {\r\n addToast && addToast({ message, type: 'default' });\r\n },\r\n success(message) {\r\n addToast && addToast({ message, type: 'success' });\r\n },\r\n error(message) {\r\n addToast && addToast({ message, type: 'error' });\r\n },\r\n};\r\n\r\nfunction _register(fn) {\r\n addToast = fn;\r\n}\r\n\r\nexport { ToastContainer, toast, _register };"],"names":["ToastContainer","_useState","useState","_useState2","_slicedToArray","toasts","setToasts","useEffect","_register","toast","prev","concat","_toConsumableArray","setTimeout","slice","React","createElement","className","map","t","i","key","type","message","addToast","show","success","error","fn"],"mappings":"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","x_google_ignoreList":[0]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-toast-msg",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "1.0.2",
|
|
4
4
|
"description": "A lightweight, customizable React toast notification library with zero-config and fast setup.",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/index.es.js",
|
|
@@ -40,6 +40,7 @@
|
|
|
40
40
|
"@babel/preset-react": "^7.27.1",
|
|
41
41
|
"@rollup/plugin-babel": "^6.0.4",
|
|
42
42
|
"@rollup/plugin-node-resolve": "^15.0.1",
|
|
43
|
-
"rollup": "^3.22.0"
|
|
43
|
+
"rollup": "^3.22.0",
|
|
44
|
+
"rollup-plugin-postcss": "^4.0.2"
|
|
44
45
|
}
|
|
45
46
|
}
|