react-toast-msg 2.5.0 → 2.5.6

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/LICENSE.md CHANGED
@@ -1,21 +1,21 @@
1
- MIT License
2
-
3
- Copyright (c) 2025 SudhuCodes
4
-
5
- Permission is hereby granted, free of charge, to any person obtaining a copy
6
- of this software and associated documentation files (the "Software"), to deal
7
- in the Software without restriction, including without limitation the rights
8
- to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
- copies of the Software, and to permit persons to whom the Software is
10
- furnished to do so, subject to the following conditions:
11
-
12
- The above copyright notice and this permission notice shall be included in all
13
- copies or substantial portions of the Software.
14
-
15
- THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
- IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
- FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
- AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
- LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
- OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
- SOFTWARE.
1
+ MIT License
2
+
3
+ Copyright (c) 2025 SudhuCodes
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md CHANGED
@@ -1,118 +1,140 @@
1
- # React Toast MSG - (SudhuCodes)
2
-
3
- A lightweight and customizable React toast notification library.
4
-
5
- ![Version](https://img.shields.io/npm/v/react-toast-msg)
6
- ![License](https://img.shields.io/npm/l/react-toast-msg)
7
- ![Downloads](https://img.shields.io/npm/dt/react-toast-msg)
8
-
9
- ![React Toast MSG](https://github.com/user-attachments/assets/c91fd623-a733-4634-88b7-2bb0f30366ff 'React Toast MSG')
10
-
11
- ---
12
-
13
- ## Installation
14
-
15
- ```bash
16
- npm i react-toast-msg
17
- ```
18
-
19
- ---
20
-
21
- ## Usage
22
-
23
- ### 1. Add `ToastContainer` at the root of your application:
24
-
25
- ```jsx
26
- import { toast, ToastContainer } from 'react-toast-msg';
27
-
28
- export default function Example() {
29
- return (
30
- <>
31
- <ToastContainer autoClose={3000} closeButton={true} />
32
-
33
- <button onClick={() => toast('Default toast')}>Default</button>
34
- <button onClick={() => toast.success('Success toast')}>Success</button>
35
- <button onClick={() => toast.error('Error toast')}>Error</button>
36
- <button onClick={() => toast.warning('Warning toast')}>Warning</button>
37
-
38
- <button onClick={() => toast.success('Success toast', 5000)}>Success with duration</button>
39
- </>
40
- );
41
- }
42
- ```
43
-
44
- ---
45
-
46
- ## Custom Auto-Close Duration
47
-
48
- You can now define a custom timeout per toast.
49
-
50
- | Usage Example | Description |
51
- | -------------------------------- | ------------------------------------ |
52
- | `toast('Message')` | Default timeout |
53
- | `toast('Message', 1000)` | Closes after 1000ms (1 second) |
54
- | `toast.success('Saved', 5000)` | Success toast closes after 5 seconds |
55
- | `toast('Text', 'success', 2000)` | Type + duration together |
56
-
57
- > Note: Duration is in milliseconds and default value is 3000ms
58
-
59
- ### Example:
60
-
61
- ```jsx
62
- <button onClick={() => toast('This will close in 1 second', 1000)}>
63
- Show 1s Toast
64
- </button>
65
-
66
- <button onClick={() => toast.success('Success - 5s', 5000)}>
67
- Show 5s Success Toast
68
- </button>
69
- ```
70
-
71
- ---
72
-
73
- ## ToastContainer Props
74
-
75
- | Prop | Type | Default | Description |
76
- | ----------- | ------- | ------- | ------------------------------------------------- |
77
- | autoClose | number | 3000 | Default close time in milliseconds for all toasts |
78
- | closeButton | boolean | false | Close button visibility for all toasts |
79
-
80
- Usage:
81
-
82
- ```jsx
83
- <ToastContainer autoClose={3000} closeButton={false} /> // Default
84
- ```
85
-
86
- ---
87
-
88
- ## Available Toast Variants
89
-
90
- ```js
91
- toast('Default message');
92
- toast.success('Success message');
93
- toast.error('Error occurred');
94
- toast.warning('Warning message');
95
- ```
96
-
97
- ---
98
-
99
- ## Contributing
100
-
101
- Contributions are welcome. You can:
102
-
103
- - Report issues
104
- - Suggest features
105
- - Submit pull requests
106
- - Improve documentation or code quality
107
-
108
- Repository: [https://github.com/sudhucodes/react-toast-msg](https://github.com/sudhucodes/react-toast-msg)
109
-
110
- ---
111
-
112
- ## License
113
-
114
- react-toast-msg is [MIT licensed](./LICENSE).
115
-
116
- ---
117
-
118
- <p align="center"> <sub>© 2025 SudhuCodes — All rights reserved.</sub> </p>
1
+ # React Toast MSG - (SudhuCodes)
2
+
3
+ A lightweight and customizable React toast notification library.
4
+
5
+ ![Version](https://img.shields.io/npm/v/react-toast-msg)
6
+ ![License](https://img.shields.io/npm/l/react-toast-msg)
7
+ ![Downloads](https://img.shields.io/npm/dt/react-toast-msg)
8
+
9
+ ![React Toast MSG](https://github.com/user-attachments/assets/c91fd623-a733-4634-88b7-2bb0f30366ff 'React Toast MSG')
10
+
11
+ ---
12
+
13
+ ## Features
14
+
15
+ - Lightweight & fast
16
+ - Tailwind CSS based styling
17
+ - Global & per-toast configuration
18
+ - Multiple toast variants
19
+ - Auto close with animation
20
+ - Manual close button support
21
+
22
+ ## Installation
23
+
24
+ ```bash
25
+ npm i react-toast-msg
26
+ ```
27
+
28
+ ## Install Tailwind CSS
29
+
30
+ Make sure you have Tailwind CSS installed in your project.
31
+
32
+ ### Import CSS
33
+
34
+ In your global CSS file (e.g., `index.css` or `App.css`), import the library's CSS:
35
+
36
+ ```css
37
+ @import 'react-toast-msg/style.css';
38
+ ```
39
+
40
+ ---
41
+
42
+ ## Usage
43
+
44
+ ### 1. Add `ToastContainer` at the root of your application:
45
+
46
+ ```jsx
47
+ import { toast, ToastContainer } from 'react-toast-msg';
48
+
49
+ export default function Example() {
50
+ return (
51
+ <>
52
+ <ToastContainer autoClose={3000} closeButton={true} />
53
+ <button onClick={() => toast('Default toast')}>Default</button>
54
+ <button onClick={() => toast.success('Success toast')}>Success</button>
55
+ {/* rest */}
56
+ <button onClick={() => toast.success('Success toast', { duration: 5000, closeButton: false })}>
57
+ Success with duration
58
+ </button>
59
+ </>
60
+ );
61
+ }
62
+ ```
63
+
64
+ ---
65
+
66
+ ## Custom Auto-Close Duration
67
+
68
+ You can now define a custom timeout per toast.
69
+
70
+ | Usage Example | Description |
71
+ | ----------------------------------------------- | ------------------------------------ |
72
+ | `toast('Message')` | Default timeout |
73
+ | `toast('Message', { duration: 1000 })` | Closes after 1000ms (1 second) |
74
+ | `toast.success('Saved')` | Success toast |
75
+ | `toast.success('Saved', { duration: 5000 })` | Success toast closes after 5 seconds |
76
+ | `toast.error('Error', { closeButton: true })` | Error toast with close button |
77
+ | `toast.warning('Warn', { closeButton: false })` | Warning without close button |
78
+
79
+ > Per-toast options always override ToastContainer defaults.
80
+
81
+ ### Example:
82
+
83
+ ```jsx
84
+ <button onClick={() => toast('This will close in 1 second', { duration: 1000 })}>
85
+ Show 1s Toast
86
+ </button>
87
+
88
+ <button onClick={() => toast.success('Success - 5s', { duration: 5000 })}>
89
+ Show 5s Success Toast
90
+ </button>
91
+ ```
92
+
93
+ ---
94
+
95
+ ## ToastContainer Props
96
+
97
+ | Prop | Type | Default | Description |
98
+ | ----------- | ------- | ------- | ------------------------------------------------- |
99
+ | autoClose | number | 3000 | Default close time in milliseconds for all toasts |
100
+ | closeButton | boolean | false | Close button visibility for all toasts |
101
+
102
+ Usage:
103
+
104
+ ```jsx
105
+ <ToastContainer autoClose={3000} closeButton={false} /> // Default
106
+ ```
107
+
108
+ ---
109
+
110
+ ## Available Toast Variants
111
+
112
+ ```js
113
+ toast('Default message');
114
+ toast.success('Success message');
115
+ toast.error('Error occurred');
116
+ toast.warning('Warning message');
117
+ ```
118
+
119
+ ---
120
+
121
+ ## Contributing
122
+
123
+ Contributions are welcome. You can:
124
+
125
+ - Report issues
126
+ - Suggest features
127
+ - Submit pull requests
128
+ - Improve documentation or code quality
129
+
130
+ Repository: [https://github.com/sudhucodes/react-toast-msg](https://github.com/sudhucodes/react-toast-msg)
131
+
132
+ ---
133
+
134
+ ## License
135
+
136
+ react-toast-msg is [MIT licensed](./LICENSE).
137
+
138
+ ---
139
+
140
+ <p align="center"> <sub>© 2025 SudhuCodes — All rights reserved.</sub> </p>
package/dist/index.d.mts CHANGED
@@ -1,17 +1,22 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
 
3
3
  type ToastType = 'success' | 'error' | 'warning' | 'default';
4
+ type ToastOptions = {
5
+ type?: ToastType;
6
+ duration?: number;
7
+ closeButton?: boolean;
8
+ };
4
9
  interface ToastContainerProps {
5
10
  autoClose?: number;
6
11
  closeButton?: boolean;
7
12
  }
8
13
 
9
14
  declare function ToastContainer({ autoClose, closeButton }: ToastContainerProps): react_jsx_runtime.JSX.Element;
10
- declare function toast(message: string, type?: ToastType | number, duration?: number): void;
15
+ declare function toast(message: string, options?: ToastOptions): void;
11
16
  declare namespace toast {
12
- var success: (message: string, duration?: number) => void;
13
- var error: (message: string, duration?: number) => void;
14
- var warning: (message: string, duration?: number) => void;
17
+ var success: (message: string, options?: ToastOptions) => void;
18
+ var error: (message: string, options?: ToastOptions) => void;
19
+ var warning: (message: string, options?: ToastOptions) => void;
15
20
  }
16
21
 
17
22
  export { ToastContainer, type ToastType, toast };
package/dist/index.d.ts CHANGED
@@ -1,17 +1,22 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
 
3
3
  type ToastType = 'success' | 'error' | 'warning' | 'default';
4
+ type ToastOptions = {
5
+ type?: ToastType;
6
+ duration?: number;
7
+ closeButton?: boolean;
8
+ };
4
9
  interface ToastContainerProps {
5
10
  autoClose?: number;
6
11
  closeButton?: boolean;
7
12
  }
8
13
 
9
14
  declare function ToastContainer({ autoClose, closeButton }: ToastContainerProps): react_jsx_runtime.JSX.Element;
10
- declare function toast(message: string, type?: ToastType | number, duration?: number): void;
15
+ declare function toast(message: string, options?: ToastOptions): void;
11
16
  declare namespace toast {
12
- var success: (message: string, duration?: number) => void;
13
- var error: (message: string, duration?: number) => void;
14
- var warning: (message: string, duration?: number) => void;
17
+ var success: (message: string, options?: ToastOptions) => void;
18
+ var error: (message: string, options?: ToastOptions) => void;
19
+ var warning: (message: string, options?: ToastOptions) => void;
15
20
  }
16
21
 
17
22
  export { ToastContainer, type ToastType, toast };
package/dist/index.js CHANGED
@@ -1,2 +1,2 @@
1
1
  "use client";
2
- "use strict";var R=Object.create;var f=Object.defineProperty;var S=Object.getOwnPropertyDescriptor;var B=Object.getOwnPropertyNames;var V=Object.getPrototypeOf,E=Object.prototype.hasOwnProperty;var k=(e,o)=>{for(var r in o)f(e,r,{get:o[r],enumerable:!0})},b=(e,o,r,s)=>{if(o&&typeof o=="object"||typeof o=="function")for(let t of B(o))!E.call(e,t)&&t!==r&&f(e,t,{get:()=>o[t],enumerable:!(s=S(o,t))||s.enumerable});return e};var F=(e,o,r)=>(r=e!=null?R(V(e)):{},b(o||!e||!e.__esModule?f(r,"default",{value:e,enumerable:!0}):r,e)),W=e=>b(f({},"__esModule",{value:!0}),e);var q={};k(q,{ToastContainer:()=>N,toast:()=>a});module.exports=W(q);var w=require("react");var d=require("react");var h=require("tailwind-merge"),I=F(require("clsx"));function n(...e){return(0,h.twMerge)((0,I.default)(e))}var p=require("react/jsx-runtime");function C({message:e,type:o="default",icon:r,leaving:s,setToasts:t,id:T,closeButton:x}){let[m,u]=(0,d.useState)(!1);(0,d.useEffect)(()=>{requestAnimationFrame(()=>u(!0))},[]);let i=()=>{u(!1),setTimeout(()=>{t==null||t(l=>l.filter(L=>L.id!==T))},300)};return(0,p.jsxs)("div",{className:n("pointer-events-auto relative flex min-w-62 max-w-80 items-center gap-1 rounded-lg border border-gray-200/70 bg-white py-3 text-zinc-800 transition-all duration-300 ease-out",m&&!s?"translate-y-0 opacity-100":"translate-y-10 opacity-0",o==="default"?"px-4":"px-3"),children:[r,e,x&&(0,p.jsx)("button",{onClick:i,className:"absolute -top-2 -right-2 cursor-pointer rounded-full border border-gray-200/70 bg-white p-px text-zinc-500",children:(0,p.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 16 16",fill:"currentColor",className:"size-3",children:(0,p.jsx)("path",{d:"M5.28 4.22a.75.75 0 0 0-1.06 1.06L6.94 8l-2.72 2.72a.75.75 0 1 0 1.06 1.06L8 9.06l2.72 2.72a.75.75 0 1 0 1.06-1.06L9.06 8l2.72-2.72a.75.75 0 0 0-1.06-1.06L8 6.94 5.28 4.22Z"})})})]})}var c=require("react/jsx-runtime"),Z=({className:e})=>(0,c.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"currentColor",className:n("size-6",e),children:(0,c.jsx)("path",{fillRule:"evenodd",d:"M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12Zm13.36-1.814a.75.75 0 1 0-1.22-.872l-3.236 4.53L9.53 12.22a.75.75 0 0 0-1.06 1.06l2.25 2.25a.75.75 0 0 0 1.14-.094l3.75-5.25Z",clipRule:"evenodd"})}),P=({className:e})=>(0,c.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"currentColor",className:n("size-6",e),children:(0,c.jsx)("path",{fillRule:"evenodd",d:"M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12ZM12 8.25a.75.75 0 0 1 .75.75v3.75a.75.75 0 0 1-1.5 0V9a.75.75 0 0 1 .75-.75Zm0 8.25a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Z",clipRule:"evenodd"})}),z=({className:e})=>(0,c.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"currentColor",className:n("size-6",e),children:(0,c.jsx)("path",{fillRule:"evenodd",d:"M9.401 3.003c1.155-2 4.043-2 5.197 0l7.355 12.748c1.154 2-.29 4.5-2.599 4.5H4.645c-2.309 0-3.752-2.5-2.598-4.5L9.4 3.003ZM12 8.25a.75.75 0 0 1 .75.75v3.75a.75.75 0 0 1-1.5 0V9a.75.75 0 0 1 .75-.75Zm0 8.25a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Z",clipRule:"evenodd"})});var g=require("react/jsx-runtime");function M(e){switch(e){case"success":return(0,g.jsx)(Z,{});case"error":return(0,g.jsx)(P,{});case"warning":return(0,g.jsx)(z,{});default:return null}}var y=require("react/jsx-runtime"),v=null;function N({autoClose:e=3e3,closeButton:o=!1}){let[r,s]=(0,w.useState)([]);return(0,w.useEffect)(()=>{v=(t,T="default",x)=>{let m=Date.now(),u=x||e;s(i=>[...i,{id:m,message:t,type:T,leaving:!1}]),setTimeout(()=>{s(i=>i.map(l=>l.id===m?{...l,leaving:!0}:l)),setTimeout(()=>{s(i=>i.filter(l=>l.id!==m))},300)},u)}},[e]),(0,y.jsx)("div",{className:n("pointer-events-none fixed inset-0 z-9999 flex flex-col items-end justify-end gap-2 p-4 text-sm"),children:r.map(t=>(0,y.jsx)(C,{id:t.id,message:t.message,setToasts:s,type:t.type,icon:M(t.type),leaving:t.leaving,closeButton:o},t.id))})}function a(e,o,r){v&&(typeof o=="number"?v(e,"default",o):v(e,o,r))}a.success=(e,o)=>a(e,"success",o);a.error=(e,o)=>a(e,"error",o);a.warning=(e,o)=>a(e,"warning",o);0&&(module.exports={ToastContainer,toast});
2
+ "use strict";var O=Object.create;var d=Object.defineProperty;var R=Object.getOwnPropertyDescriptor;var S=Object.getOwnPropertyNames;var V=Object.getPrototypeOf,E=Object.prototype.hasOwnProperty;var k=(t,e)=>{for(var s in e)d(t,s,{get:e[s],enumerable:!0})},b=(t,e,s,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of S(e))!E.call(t,o)&&o!==s&&d(t,o,{get:()=>e[o],enumerable:!(r=R(e,o))||r.enumerable});return t};var F=(t,e,s)=>(s=t!=null?O(V(t)):{},b(e||!t||!t.__esModule?d(s,"default",{value:t,enumerable:!0}):s,t)),W=t=>b(d({},"__esModule",{value:!0}),t);var q={};k(q,{ToastContainer:()=>L,toast:()=>i});module.exports=W(q);var v=require("react");var f=require("react");var C=require("tailwind-merge"),Z=F(require("clsx"));function n(...t){return(0,C.twMerge)((0,Z.default)(t))}var c=require("react/jsx-runtime");function P({message:t,type:e="default",icon:s,leaving:r,setToasts:o,id:w,closeButton:T}){let[x,p]=(0,f.useState)(!1);(0,f.useEffect)(()=>{requestAnimationFrame(()=>p(!0))},[]);let m=()=>{p(!1),setTimeout(()=>{o==null||o(h=>h.filter(a=>a.id!==w))},300)};return(0,c.jsxs)("div",{className:n("pointer-events-auto relative flex max-w-80 min-w-62 items-center gap-1 rounded-lg border border-gray-200/70 bg-white py-3 text-sm text-zinc-800 transition-all duration-300 ease-out",x&&!r?"translate-y-0 opacity-100":"translate-y-10 opacity-0",e==="default"?"px-4":"px-3"),children:[s,t,T&&(0,c.jsx)("button",{onClick:m,className:"absolute -top-2 -right-2 cursor-pointer rounded-full border border-gray-200/70 bg-white p-px text-zinc-500",children:(0,c.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 16 16",fill:"currentColor",className:"size-3",children:(0,c.jsx)("path",{d:"M5.28 4.22a.75.75 0 0 0-1.06 1.06L6.94 8l-2.72 2.72a.75.75 0 1 0 1.06 1.06L8 9.06l2.72 2.72a.75.75 0 1 0 1.06-1.06L9.06 8l2.72-2.72a.75.75 0 0 0-1.06-1.06L8 6.94 5.28 4.22Z"})})})]})}var l=require("react/jsx-runtime"),z=({className:t})=>(0,l.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"currentColor",className:n("size-5.5",t),height:24,width:24,children:(0,l.jsx)("path",{fillRule:"evenodd",d:"M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12Zm13.36-1.814a.75.75 0 1 0-1.22-.872l-3.236 4.53L9.53 12.22a.75.75 0 0 0-1.06 1.06l2.25 2.25a.75.75 0 0 0 1.14-.094l3.75-5.25Z",clipRule:"evenodd"})}),M=({className:t})=>(0,l.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"currentColor",className:n("size-5.5",t),height:24,width:24,children:(0,l.jsx)("path",{fillRule:"evenodd",d:"M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12ZM12 8.25a.75.75 0 0 1 .75.75v3.75a.75.75 0 0 1-1.5 0V9a.75.75 0 0 1 .75-.75Zm0 8.25a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Z",clipRule:"evenodd"})}),N=({className:t})=>(0,l.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"currentColor",className:n("size-5.5",t),height:24,width:24,children:(0,l.jsx)("path",{fillRule:"evenodd",d:"M9.401 3.003c1.155-2 4.043-2 5.197 0l7.355 12.748c1.154 2-.29 4.5-2.599 4.5H4.645c-2.309 0-3.752-2.5-2.598-4.5L9.4 3.003ZM12 8.25a.75.75 0 0 1 .75.75v3.75a.75.75 0 0 1-1.5 0V9a.75.75 0 0 1 .75-.75Zm0 8.25a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Z",clipRule:"evenodd"})});var g=require("react/jsx-runtime");function B(t){switch(t){case"success":return(0,g.jsx)(z,{});case"error":return(0,g.jsx)(M,{});case"warning":return(0,g.jsx)(N,{});default:return null}}var I=require("react/jsx-runtime"),y=null;function L({autoClose:t=3e3,closeButton:e=!1}){let[s,r]=(0,v.useState)([]);return(0,v.useEffect)(()=>{y=(o,w={})=>{let{type:T="default",duration:x,closeButton:p}=w,m=Date.now(),h=x||t;r(a=>[...a,{id:m,message:o,type:T,leaving:!1,closeButton:p!=null?p:e}]),setTimeout(()=>{r(a=>a.map(u=>u.id===m?{...u,leaving:!0}:u)),setTimeout(()=>{r(a=>a.filter(u=>u.id!==m))},300)},h)}},[t,e]),(0,I.jsx)("div",{className:n("pointer-events-none fixed inset-0 z-9999 flex flex-col items-end justify-end gap-2 p-4 text-sm"),children:s.map(o=>(0,I.jsx)(P,{id:o.id,message:o.message,setToasts:r,type:o.type,icon:B(o.type),leaving:o.leaving,closeButton:o.closeButton},o.id))})}function i(t,e){y&&y(t,e)}i.success=(t,e)=>i(t,{...e,type:"success"});i.error=(t,e)=>i(t,{...e,type:"error"});i.warning=(t,e)=>i(t,{...e,type:"warning"});0&&(module.exports={ToastContainer,toast});
package/dist/index.mjs CHANGED
@@ -1,2 +1,2 @@
1
1
  "use client";
2
- import{useState as N,useEffect as L}from"react";import{useEffect as P,useState as z}from"react";import{twMerge as C}from"tailwind-merge";import Z from"clsx";function r(...e){return C(Z(e))}import{jsx as g,jsxs as M}from"react/jsx-runtime";function w({message:e,type:o="default",icon:c,leaving:i,setToasts:t,id:f,closeButton:d}){let[p,m]=z(!1);P(()=>{requestAnimationFrame(()=>m(!0))},[]);let s=()=>{m(!1),setTimeout(()=>{t==null||t(n=>n.filter(I=>I.id!==f))},300)};return M("div",{className:r("pointer-events-auto relative flex min-w-62 max-w-80 items-center gap-1 rounded-lg border border-gray-200/70 bg-white py-3 text-zinc-800 transition-all duration-300 ease-out",p&&!i?"translate-y-0 opacity-100":"translate-y-10 opacity-0",o==="default"?"px-4":"px-3"),children:[c,e,d&&g("button",{onClick:s,className:"absolute -top-2 -right-2 cursor-pointer rounded-full border border-gray-200/70 bg-white p-px text-zinc-500",children:g("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 16 16",fill:"currentColor",className:"size-3",children:g("path",{d:"M5.28 4.22a.75.75 0 0 0-1.06 1.06L6.94 8l-2.72 2.72a.75.75 0 1 0 1.06 1.06L8 9.06l2.72 2.72a.75.75 0 1 0 1.06-1.06L9.06 8l2.72-2.72a.75.75 0 0 0-1.06-1.06L8 6.94 5.28 4.22Z"})})})]})}import{jsx as l}from"react/jsx-runtime";var T=({className:e})=>l("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"currentColor",className:r("size-6",e),children:l("path",{fillRule:"evenodd",d:"M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12Zm13.36-1.814a.75.75 0 1 0-1.22-.872l-3.236 4.53L9.53 12.22a.75.75 0 0 0-1.06 1.06l2.25 2.25a.75.75 0 0 0 1.14-.094l3.75-5.25Z",clipRule:"evenodd"})}),x=({className:e})=>l("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"currentColor",className:r("size-6",e),children:l("path",{fillRule:"evenodd",d:"M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12ZM12 8.25a.75.75 0 0 1 .75.75v3.75a.75.75 0 0 1-1.5 0V9a.75.75 0 0 1 .75-.75Zm0 8.25a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Z",clipRule:"evenodd"})}),y=({className:e})=>l("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"currentColor",className:r("size-6",e),children:l("path",{fillRule:"evenodd",d:"M9.401 3.003c1.155-2 4.043-2 5.197 0l7.355 12.748c1.154 2-.29 4.5-2.599 4.5H4.645c-2.309 0-3.752-2.5-2.598-4.5L9.4 3.003ZM12 8.25a.75.75 0 0 1 .75.75v3.75a.75.75 0 0 1-1.5 0V9a.75.75 0 0 1 .75-.75Zm0 8.25a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Z",clipRule:"evenodd"})});import{jsx as v}from"react/jsx-runtime";function b(e){switch(e){case"success":return v(T,{});case"error":return v(x,{});case"warning":return v(y,{});default:return null}}import{jsx as h}from"react/jsx-runtime";var u=null;function R({autoClose:e=3e3,closeButton:o=!1}){let[c,i]=N([]);return L(()=>{u=(t,f="default",d)=>{let p=Date.now(),m=d||e;i(s=>[...s,{id:p,message:t,type:f,leaving:!1}]),setTimeout(()=>{i(s=>s.map(n=>n.id===p?{...n,leaving:!0}:n)),setTimeout(()=>{i(s=>s.filter(n=>n.id!==p))},300)},m)}},[e]),h("div",{className:r("pointer-events-none fixed inset-0 z-9999 flex flex-col items-end justify-end gap-2 p-4 text-sm"),children:c.map(t=>h(w,{id:t.id,message:t.message,setToasts:i,type:t.type,icon:b(t.type),leaving:t.leaving,closeButton:o},t.id))})}function a(e,o,c){u&&(typeof o=="number"?u(e,"default",o):u(e,o,c))}a.success=(e,o)=>a(e,"success",o);a.error=(e,o)=>a(e,"error",o);a.warning=(e,o)=>a(e,"warning",o);export{R as ToastContainer,a as toast};
2
+ import{useState as B,useEffect as L}from"react";import{useEffect as z,useState as M}from"react";import{twMerge as Z}from"tailwind-merge";import P from"clsx";function s(...t){return Z(P(t))}import{jsx as v,jsxs as N}from"react/jsx-runtime";function x({message:t,type:o="default",icon:m,leaving:i,setToasts:e,id:u,closeButton:d}){let[f,a]=M(!1);z(()=>{requestAnimationFrame(()=>a(!0))},[]);let p=()=>{a(!1),setTimeout(()=>{e==null||e(g=>g.filter(r=>r.id!==u))},300)};return N("div",{className:s("pointer-events-auto relative flex max-w-80 min-w-62 items-center gap-1 rounded-lg border border-gray-200/70 bg-white py-3 text-sm text-zinc-800 transition-all duration-300 ease-out",f&&!i?"translate-y-0 opacity-100":"translate-y-10 opacity-0",o==="default"?"px-4":"px-3"),children:[m,t,d&&v("button",{onClick:p,className:"absolute -top-2 -right-2 cursor-pointer rounded-full border border-gray-200/70 bg-white p-px text-zinc-500",children:v("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 16 16",fill:"currentColor",className:"size-3",children:v("path",{d:"M5.28 4.22a.75.75 0 0 0-1.06 1.06L6.94 8l-2.72 2.72a.75.75 0 1 0 1.06 1.06L8 9.06l2.72 2.72a.75.75 0 1 0 1.06-1.06L9.06 8l2.72-2.72a.75.75 0 0 0-1.06-1.06L8 6.94 5.28 4.22Z"})})})]})}import{jsx as l}from"react/jsx-runtime";var h=({className:t})=>l("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"currentColor",className:s("size-5.5",t),height:24,width:24,children:l("path",{fillRule:"evenodd",d:"M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12Zm13.36-1.814a.75.75 0 1 0-1.22-.872l-3.236 4.53L9.53 12.22a.75.75 0 0 0-1.06 1.06l2.25 2.25a.75.75 0 0 0 1.14-.094l3.75-5.25Z",clipRule:"evenodd"})}),y=({className:t})=>l("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"currentColor",className:s("size-5.5",t),height:24,width:24,children:l("path",{fillRule:"evenodd",d:"M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12ZM12 8.25a.75.75 0 0 1 .75.75v3.75a.75.75 0 0 1-1.5 0V9a.75.75 0 0 1 .75-.75Zm0 8.25a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Z",clipRule:"evenodd"})}),I=({className:t})=>l("svg",{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 24 24",fill:"currentColor",className:s("size-5.5",t),height:24,width:24,children:l("path",{fillRule:"evenodd",d:"M9.401 3.003c1.155-2 4.043-2 5.197 0l7.355 12.748c1.154 2-.29 4.5-2.599 4.5H4.645c-2.309 0-3.752-2.5-2.598-4.5L9.4 3.003ZM12 8.25a.75.75 0 0 1 .75.75v3.75a.75.75 0 0 1-1.5 0V9a.75.75 0 0 1 .75-.75Zm0 8.25a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Z",clipRule:"evenodd"})});import{jsx as w}from"react/jsx-runtime";function b(t){switch(t){case"success":return w(h,{});case"error":return w(y,{});case"warning":return w(I,{});default:return null}}import{jsx as C}from"react/jsx-runtime";var T=null;function O({autoClose:t=3e3,closeButton:o=!1}){let[m,i]=B([]);return L(()=>{T=(e,u={})=>{let{type:d="default",duration:f,closeButton:a}=u,p=Date.now(),g=f||t;i(r=>[...r,{id:p,message:e,type:d,leaving:!1,closeButton:a!=null?a:o}]),setTimeout(()=>{i(r=>r.map(c=>c.id===p?{...c,leaving:!0}:c)),setTimeout(()=>{i(r=>r.filter(c=>c.id!==p))},300)},g)}},[t,o]),C("div",{className:s("pointer-events-none fixed inset-0 z-9999 flex flex-col items-end justify-end gap-2 p-4 text-sm"),children:m.map(e=>C(x,{id:e.id,message:e.message,setToasts:i,type:e.type,icon:b(e.type),leaving:e.leaving,closeButton:e.closeButton},e.id))})}function n(t,o){T&&T(t,o)}n.success=(t,o)=>n(t,{...o,type:"success"});n.error=(t,o)=>n(t,{...o,type:"error"});n.warning=(t,o)=>n(t,{...o,type:"warning"});export{O as ToastContainer,n as toast};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-toast-msg",
3
- "version": "2.5.0",
3
+ "version": "2.5.6",
4
4
  "description": "A lightweight, customizable React toast notification library with zero-config and fast setup.",
5
5
  "files": [
6
6
  "dist"
@@ -15,6 +15,13 @@
15
15
  "main": "dist/index.js",
16
16
  "module": "dist/index.mjs",
17
17
  "types": "dist/index.d.ts",
18
+ "exports": {
19
+ ".": {
20
+ "import": "./dist/index.mjs",
21
+ "require": "./dist/index.js"
22
+ },
23
+ "./style.css": "./dist/style.css"
24
+ },
18
25
  "keywords": [
19
26
  "react",
20
27
  "toast",
@@ -53,6 +60,7 @@
53
60
  },
54
61
  "dependencies": {
55
62
  "clsx": "^2.1.1",
63
+ "docstra": "^1.9.7",
56
64
  "tailwind-merge": "^3.4.0"
57
65
  }
58
66
  }