toastflux 1.0.1 → 1.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,27 +1,10 @@
1
1
  # 🚀 ToastFlux
2
2
 
3
- > ⚡ Lightweight • 🎨 Beautiful • 🧠 Fully Customizable
4
- > A modern toast notification library for React & Next.js
3
+ [![npm version](https://img.shields.io/npm/v/toastflux.svg?style=flat-square)](https://www.npmjs.com/package/toastflux)
4
+ [![bundle size](https://img.shields.io/bundlephobia/minzip/toastflux?style=flat-square&label=size)](https://bundlephobia.com/package/toastflux)
5
5
 
6
- ---
7
-
8
- ## ✨ Why ToastFlux?
9
-
10
- ToastFlux is built for developers who want **speed, flexibility, and clean UI** without complexity.
11
-
12
- - ⚡ Blazing fast & lightweight
13
- - 🎨 Beautiful default UI (no extra styling needed)
14
- - 🧩 Fully customizable (style, icon, font, layout)
15
- - 📍 Flexible positioning system
16
- - 🎯 Action buttons (Undo, Retry, etc.)
17
- - ⏱ Smart duration & dismiss control
18
- - 📊 Progress bar support
19
- - 📝 Description text support
20
- - 🌗 Built-in dark & light themes
21
- - ⚛️ Works with React & Next.js App Router
22
- - 👆 Swipe to dismiss (touch & pointer support)
23
-
24
- ---
6
+ > ⚡ **Ultra Lightweight (~2.8kb gzipped) • 🎨 Beautiful • 🧠 Powerful**
7
+ > A modern scalable toast notification library for React & Next.js. **[Live Demo →](https://toastflux.versintal.in)**
25
8
 
26
9
  ## 📦 Installation
27
10
 
@@ -29,272 +12,86 @@ ToastFlux is built for developers who want **speed, flexibility, and clean UI**
29
12
  npm install toastflux
30
13
  ```
31
14
 
32
- ---
15
+ ## 🚀 Quick Usage
33
16
 
34
- ## 🚀 Quick Start
17
+ Add `<Toaster />` once to your app root (or `app/layout.tsx` for Next.js App Router).
35
18
 
36
- ```jsx
19
+ ```tsx
37
20
  import { Toaster, toast } from "toastflux";
38
21
  import "toastflux/styles/toast.css";
39
22
 
40
- function App() {
23
+ export default function App() {
41
24
  return (
42
25
  <>
43
- <Toaster theme="dark" />
44
-
26
+ <Toaster theme="dark" position="bottom-right" />
45
27
  <button onClick={() => toast.success("Event created 🚀")}>
46
28
  Show Toast
47
29
  </button>
48
30
  </>
49
31
  );
50
32
  }
51
-
52
- export default App;
53
33
  ```
54
34
 
55
- ---
35
+ ## ⚡ Toast Types & Capabilities
56
36
 
57
- ## 🎯 Toast Types
37
+ ToastFlux handles basic toasts, promises, lifecycle events, and complex UI smoothly:
58
38
 
59
- ```jsx
39
+ ```tsx
40
+ // Basic Types
60
41
  toast.success("Saved successfully!");
61
- toast.info("Meeting starts soon.");
62
- toast.warning("Storage almost full.");
63
42
  toast.error("Upload failed.");
64
- toast.default("Just a message.");
65
- ```
66
-
67
- ---
68
-
69
- ## 🎨 Customization
70
-
71
- ### 📝 Description
72
-
73
- Add a subtitle/description below the main message:
74
-
75
- ```jsx
76
- toast.success("Event has been created", {
77
- description: "Monday, January 3rd at 6:00pm",
78
- });
79
- ```
80
-
81
- ---
82
-
83
- ### ⏱ Duration & Dismiss
84
-
85
- ```jsx
86
- toast.success("I stay longer!", {
87
- duration: 6000,
88
- dismissible: true,
89
- });
90
- ```
91
-
92
- ---
43
+ toast.loading("Fetching data...");
93
44
 
94
- ### 🎯 Action Buttons
95
-
96
- ```jsx
97
- toast.info("Item deleted", {
98
- action: {
99
- label: "Undo",
100
- onClick: () => console.log("Undo clicked"),
101
- },
102
- });
103
- ```
104
-
105
- ---
106
-
107
- ### 📍 Positioning
108
-
109
- ```jsx
110
- toast.success("Bottom right toast!", {
111
- position: "bottom-right",
45
+ // Promise Handling
46
+ toast.promise(fetchData(), {
47
+ loading: "Loading...",
48
+ success: (data) => `Loaded ${data.name}!`,
49
+ error: "Error loading data",
112
50
  });
113
- ```
114
-
115
- Or globally via `<Toaster />`:
116
-
117
- ```jsx
118
- <Toaster position="top-right" />
119
- ```
120
-
121
- ---
122
-
123
- ### 📊 Progress Bar
124
51
 
125
- ```jsx
126
- toast.info("Uploading file...", {
127
- progress: 45,
128
- });
129
- ```
130
-
131
- ---
132
-
133
- ### 🎨 Custom Style & Icon
134
-
135
- ```jsx
136
- toast.default("Custom styled toast", {
137
- style: {
138
- border: "1px solid #ec4899",
139
- background: "#fdf2f8",
140
- color: "#000",
141
- },
52
+ // Advanced (Actions, Progress, Hooks)
53
+ toast("System Update", {
54
+ description: "Version 2.0 downloaded",
142
55
  icon: <span>🌟</span>,
143
- iconColor: "#10b981",
56
+ action: { label: "Install", onClick: () => console.log("Installing") },
57
+ onClose: (t) => console.log(`Toast ${t.id} closed!`),
58
+ progress: 80,
59
+ duration: 6000,
144
60
  });
145
61
  ```
146
62
 
147
- ---
63
+ ## ⚙️ `<Toaster />` Global Defaults
64
+ Keep your code DRY by defining global configurations on the Toaster itself.
148
65
 
149
- ## 🎭 Themes
150
-
151
- ToastFlux supports built-in dark and light themes:
152
-
153
- ```jsx
154
- <Toaster theme="light" />
155
- <Toaster theme="dark" />
66
+ ```tsx
67
+ <Toaster
68
+ theme="light"
69
+ position="bottom-left"
70
+ duration={5000}
71
+ toastOptions={{ style: { borderRadius: '12px' } }}
72
+ />
156
73
  ```
157
74
 
158
- ---
159
-
160
- ## 🧠 API Overview
75
+ ## 🧠 API Reference
161
76
 
162
77
  ### `toast(message, options?)`
163
-
164
- | Option | Type | Description |
165
- | ------------- | ------------------ | ----------------------------- |
166
- | `description` | ReactNode | Subtitle below main message |
167
- | `duration` | number | Auto dismiss time in ms |
168
- | `dismissible` | boolean | Enable manual close button |
169
- | `position` | ToastPosition | Where toast appears on screen |
170
- | `style` | CSSProperties | Inline styles override |
171
- | `className` | string | Custom CSS class |
172
- | `icon` | ReactNode | Custom icon element |
173
- | `iconColor` | string | Color for default icons |
174
- | `action` | { label, onClick } | Action button config |
175
- | `progress` | number | Progress bar value (0–100) |
176
-
177
- ---
178
-
179
- ## 📍 Supported Positions
180
-
181
- | Position | Description |
182
- | --------------- | -------------------------- |
183
- | `top-left` | Top left corner |
184
- | `top-center` | Top center |
185
- | `top-right` | Top right corner (default) |
186
- | `bottom-left` | Bottom left corner |
187
- | `bottom-center` | Bottom center |
188
- | `bottom-right` | Bottom right corner |
189
-
190
- ---
191
-
192
- ## 🔤 Custom Font (CSS Variable)
193
-
194
- ToastFlux uses a clean system font by default. To match your app's custom font, set the `--tf-font-family` CSS variable:
195
-
78
+ | Option | Type | Description |
79
+ |--------|------|-------------|
80
+ | `description` | ReactNode | Subtitle text below the title |
81
+ | `duration` | number | Auto dismiss time in ms (Default: `4000`) |
82
+ | `dismissible` | boolean | Enable manual close button |
83
+ | `position` | string | `top-right`, `bottom-center`, `top-left`, etc. |
84
+ | `style` / `className` | CSS / string | Inline styles and class overrides |
85
+ | `icon` / `iconColor` | ReactNode / string | Custom icon / SVG color override |
86
+ | `action` | `{ label, onClick }` | Action button configuration |
87
+ | `progress` | number (0-100) | Built-in progress bar value |
88
+ | `onShow` / `onClose` / `onClick` | `(toast) => void` | Lifecycle hooks for analytics/tracking |
89
+
90
+ ## 🔤 Custom Font
91
+ Use the CSS variable `--tf-font-family` to automatically match your app's font:
196
92
  ```css
197
- /* In your global CSS (e.g. index.css or globals.css) */
198
- :root {
199
- --tf-font-family: "Inter", sans-serif;
200
- }
201
- ```
202
-
203
- 👉 Falls back to `system-ui, sans-serif` by default — no ugly serif fonts!
204
-
205
- ---
206
-
207
- ## ⚙️ Next.js (App Router) Usage
208
-
209
- ToastFlux works seamlessly with Next.js App Router. Since it uses client-side state, add `"use client"` where needed.
210
-
211
- ### 1. Add `<Toaster />` to Root Layout
212
-
213
- ```tsx
214
- // app/layout.tsx
215
- import { Toaster } from "toastflux";
216
- import "toastflux/styles/toast.css";
217
-
218
- export default function RootLayout({
219
- children,
220
- }: {
221
- children: React.ReactNode;
222
- }) {
223
- return (
224
- <html lang="en">
225
- <body>
226
- {children}
227
- <Toaster theme="dark" />
228
- </body>
229
- </html>
230
- );
231
- }
232
- ```
233
-
234
- ### 2. Use `toast` in Any Client Component
235
-
236
- ```tsx
237
- // app/page.tsx
238
- "use client";
239
-
240
- import { toast } from "toastflux";
241
-
242
- export default function HomePage() {
243
- return (
244
- <button onClick={() => toast.success("It works in Next.js too! 🚀")}>
245
- Show Toast
246
- </button>
247
- );
248
- }
249
- ```
250
-
251
- ---
252
-
253
- ## 🧱 Architecture
254
-
255
- ```
256
- toastflux/
257
- ├── packages/
258
- │ ├── core/ → Framework-independent logic (store, types, toast fn)
259
- │ ├── react/ → React UI components (Toaster, ToastItem)
260
- │ └── styles/ → CSS (toast.css)
261
- └── apps/
262
- ├── react-app/ → Vite + React demo
263
- └── next-app/ → Next.js App Router demo
93
+ :root { --tf-font-family: "Inter", sans-serif; }
264
94
  ```
265
95
 
266
- ---
267
-
268
- ## 🚀 Roadmap
269
-
270
- - [x] Toast types (success, error, info, warning, default)
271
- - [x] Dark & Light themes
272
- - [x] Description support
273
- - [x] Custom font via CSS variable
274
- - [x] Action buttons
275
- - [x] Progress bar
276
- - [x] Swipe to dismiss
277
- - [x] Next.js App Router support
278
- - [ ] Promise-based toasts (`toast.promise`)
279
- - [ ] Smart toast grouping
280
- - [ ] Advanced animations
281
- - [ ] DevTools panel
282
-
283
- ---
284
-
285
- ## 🤝 Contributing
286
-
287
- PRs and ideas are welcome!
288
- Feel free to open issues or suggest improvements.
289
-
290
- ---
291
-
292
- ## 📄 License
293
-
294
- MIT
295
-
296
- ---
297
-
298
- ## ❤️ Author
299
-
300
- Built with passion by **Rahul**
96
+ ## 🤝 License
97
+ [MIT](https://github.com/Rahul-Bairwa/toastflux/blob/main/LICENSE) © [Rahul Bairwa](https://github.com/Rahul-Bairwa)
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "toastflux",
3
- "version": "1.0.1",
3
+ "version": "1.0.3",
4
4
  "description": "A lightweight, beautiful, and fully customizable toast notification library for React & Next.js with modern UI, themes, actions, and progress support.",
5
5
  "author": "Rahul",
6
6
  "license": "MIT",
@@ -27,16 +27,16 @@
27
27
  ],
28
28
  "exports": {
29
29
  ".": {
30
+ "types": "./packages/react/dist/index.d.ts",
30
31
  "import": "./packages/react/dist/index.mjs",
31
- "require": "./packages/react/dist/index.js",
32
- "types": "./packages/react/dist/index.d.ts"
32
+ "require": "./packages/react/dist/index.js"
33
33
  },
34
34
  "./styles/toast.css": "./packages/styles/toast.css"
35
35
  },
36
36
  "sideEffects": [
37
37
  "*.css"
38
38
  ],
39
- "homepage": "https://github.com/Rahul-Bairwa/toastflux",
39
+ "homepage": "https://toastflux.versintal.in",
40
40
  "repository": {
41
41
  "type": "git",
42
42
  "url": "https://github.com/Rahul-Bairwa/toastflux.git"
@@ -21,10 +21,16 @@ interface Toast {
21
21
  };
22
22
  render?: () => ReactNode;
23
23
  progress?: number;
24
- groupId?: string;
24
+ onShow?: (toast: Toast) => void;
25
+ onClose?: (toast: Toast) => void;
26
+ onClick?: (toast: Toast) => void;
25
27
  }
26
-
27
28
  type ToastOptions = Partial<Omit<Toast, "id" | "type" | "createdAt">>;
29
+ declare const PEEK_OFFSET = 10;
30
+ declare const MAX_STACK_VISIBLE = 3;
31
+ declare const SCALE_STEP = 0.05;
32
+ declare const OPACITY_STEP = 0.15;
33
+
28
34
  declare const toast: {
29
35
  (msg: string | undefined, type?: ToastType, options?: ToastOptions): string;
30
36
  success(msg: string, options?: ToastOptions): string;
@@ -34,6 +40,11 @@ declare const toast: {
34
40
  loading(msg: string, options?: ToastOptions): string;
35
41
  default(msg: string, options?: ToastOptions): string;
36
42
  custom(options: ToastOptions): string;
43
+ promise<T>(promise: Promise<T>, msgs: {
44
+ loading: string;
45
+ success: string | ((data: T) => string);
46
+ error: string | ((err: any) => string);
47
+ }, options?: ToastOptions): Promise<T>;
37
48
  dismiss(id: string): void;
38
49
  };
39
50
 
@@ -41,12 +52,16 @@ type Listener = () => void;
41
52
  declare class ToastStore {
42
53
  private toasts;
43
54
  private listeners;
55
+ private config;
56
+ updateConfig(newConfig: ToastOptions): void;
57
+ getConfig(): Partial<Omit<Toast, "id" | "type" | "createdAt">>;
44
58
  subscribe(listener: Listener): () => void;
45
59
  getToasts(): Toast[];
46
60
  add(toast: Toast): void;
47
61
  remove(id: string): void;
62
+ update(id: string, newToastInfo: Partial<Toast>): void;
48
63
  private emit;
49
64
  }
50
65
  declare const toastStore: ToastStore;
51
66
 
52
- export { type Toast, type ToastOptions, type ToastPosition, type ToastType, toast, toastStore };
67
+ export { MAX_STACK_VISIBLE, OPACITY_STEP, PEEK_OFFSET, SCALE_STEP, type Toast, type ToastOptions, type ToastPosition, type ToastType, toast, toastStore };
@@ -21,10 +21,16 @@ interface Toast {
21
21
  };
22
22
  render?: () => ReactNode;
23
23
  progress?: number;
24
- groupId?: string;
24
+ onShow?: (toast: Toast) => void;
25
+ onClose?: (toast: Toast) => void;
26
+ onClick?: (toast: Toast) => void;
25
27
  }
26
-
27
28
  type ToastOptions = Partial<Omit<Toast, "id" | "type" | "createdAt">>;
29
+ declare const PEEK_OFFSET = 10;
30
+ declare const MAX_STACK_VISIBLE = 3;
31
+ declare const SCALE_STEP = 0.05;
32
+ declare const OPACITY_STEP = 0.15;
33
+
28
34
  declare const toast: {
29
35
  (msg: string | undefined, type?: ToastType, options?: ToastOptions): string;
30
36
  success(msg: string, options?: ToastOptions): string;
@@ -34,6 +40,11 @@ declare const toast: {
34
40
  loading(msg: string, options?: ToastOptions): string;
35
41
  default(msg: string, options?: ToastOptions): string;
36
42
  custom(options: ToastOptions): string;
43
+ promise<T>(promise: Promise<T>, msgs: {
44
+ loading: string;
45
+ success: string | ((data: T) => string);
46
+ error: string | ((err: any) => string);
47
+ }, options?: ToastOptions): Promise<T>;
37
48
  dismiss(id: string): void;
38
49
  };
39
50
 
@@ -41,12 +52,16 @@ type Listener = () => void;
41
52
  declare class ToastStore {
42
53
  private toasts;
43
54
  private listeners;
55
+ private config;
56
+ updateConfig(newConfig: ToastOptions): void;
57
+ getConfig(): Partial<Omit<Toast, "id" | "type" | "createdAt">>;
44
58
  subscribe(listener: Listener): () => void;
45
59
  getToasts(): Toast[];
46
60
  add(toast: Toast): void;
47
61
  remove(id: string): void;
62
+ update(id: string, newToastInfo: Partial<Toast>): void;
48
63
  private emit;
49
64
  }
50
65
  declare const toastStore: ToastStore;
51
66
 
52
- export { type Toast, type ToastOptions, type ToastPosition, type ToastType, toast, toastStore };
67
+ export { MAX_STACK_VISIBLE, OPACITY_STEP, PEEK_OFFSET, SCALE_STEP, type Toast, type ToastOptions, type ToastPosition, type ToastType, toast, toastStore };
@@ -1,84 +1,2 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
-
20
- // packages/core/src/index.ts
21
- var index_exports = {};
22
- __export(index_exports, {
23
- toast: () => toast,
24
- toastStore: () => toastStore
25
- });
26
- module.exports = __toCommonJS(index_exports);
27
-
28
- // packages/core/src/store.ts
29
- var ToastStore = class {
30
- constructor() {
31
- this.toasts = [];
32
- this.listeners = [];
33
- }
34
- subscribe(listener) {
35
- this.listeners.push(listener);
36
- return () => {
37
- this.listeners = this.listeners.filter((l) => l !== listener);
38
- };
39
- }
40
- getToasts() {
41
- return this.toasts;
42
- }
43
- add(toast2) {
44
- this.toasts = [toast2, ...this.toasts];
45
- this.emit();
46
- }
47
- remove(id) {
48
- this.toasts = this.toasts.filter((t) => t.id !== id);
49
- this.emit();
50
- }
51
- emit() {
52
- this.listeners.forEach((l) => l());
53
- }
54
- };
55
- var toastStore = new ToastStore();
56
-
57
- // packages/core/src/toast.ts
58
- function createToast(message, type, options) {
59
- const id = crypto.randomUUID();
60
- toastStore.add({
61
- id,
62
- message,
63
- type,
64
- createdAt: Date.now(),
65
- ...options
66
- });
67
- return id;
68
- }
69
- var toastFn = (msg, type = "default", options) => createToast(msg, type, options);
70
- toastFn.success = (msg, options) => createToast(msg, "success", options);
71
- toastFn.error = (msg, options) => createToast(msg, "error", options);
72
- toastFn.info = (msg, options) => createToast(msg, "info", options);
73
- toastFn.warning = (msg, options) => createToast(msg, "warning", options);
74
- toastFn.loading = (msg, options) => createToast(msg, "loading", options);
75
- toastFn.default = (msg, options) => createToast(msg, "default", options);
76
- toastFn.custom = (options) => createToast(options.message, "default", options);
77
- toastFn.dismiss = (id) => toastStore.remove(id);
78
- var toast = toastFn;
79
- // Annotate the CommonJS export names for ESM import in node:
80
- 0 && (module.exports = {
81
- toast,
82
- toastStore
83
- });
1
+ 'use strict';var d=class{constructor(){this.toasts=[];this.listeners=[];this.config={};}updateConfig(t){this.config={...this.config,...t};}getConfig(){return this.config}subscribe(t){return this.listeners.push(t),()=>{this.listeners=this.listeners.filter(s=>s!==t);}}getToasts(){return this.toasts}add(t){this.toasts=[t,...this.toasts],this.emit();}remove(t){this.toasts=this.toasts.filter(s=>s.id!==t),this.emit();}update(t,s){this.toasts=this.toasts.map(i=>i.id===t?{...i,...s}:i),this.emit();}emit(){this.listeners.forEach(t=>t());}},n=new d;function r(o,t,s){let i=crypto.randomUUID(),a=n.getConfig();return n.add({id:i,message:o,type:t,createdAt:Date.now(),...a,...s}),i}var e=(o,t="default",s)=>r(o,t,s);e.success=(o,t)=>r(o,"success",t);e.error=(o,t)=>r(o,"error",t);e.info=(o,t)=>r(o,"info",t);e.warning=(o,t)=>r(o,"warning",t);e.loading=(o,t)=>r(o,"loading",t);e.default=(o,t)=>r(o,"default",t);e.custom=o=>r(o.message,"default",o);e.promise=(o,t,s)=>{let i=(s==null?void 0:s.duration)||n.getConfig().duration||4e3,a=e.loading(t.loading,{...s,duration:1/0});return o.then(c=>{let p=typeof t.success=="function"?t.success(c):t.success;n.update(a,{type:"success",message:p,duration:i});}).catch(c=>{let p=typeof t.error=="function"?t.error(c):t.error;n.update(a,{type:"error",message:p,duration:i});}),o};e.dismiss=o=>n.remove(o);var u=e;var l=10,m=3,h=.05,y=.15;exports.MAX_STACK_VISIBLE=m;exports.OPACITY_STEP=y;exports.PEEK_OFFSET=l;exports.SCALE_STEP=h;exports.toast=u;exports.toastStore=n;//# sourceMappingURL=index.js.map
84
2
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/store.ts","../src/toast.ts"],"sourcesContent":["export * from \"./toast\";\r\nexport * from \"./store\";\r\nexport * from \"./types\";\r\n","import { Toast } from \"./types\";\r\n\r\ntype Listener = () => void;\r\n\r\nclass ToastStore {\r\n private toasts: Toast[] = [];\r\n private listeners: Listener[] = [];\r\n\r\n subscribe(listener: Listener) {\r\n this.listeners.push(listener);\r\n return () => {\r\n this.listeners = this.listeners.filter((l) => l !== listener);\r\n };\r\n }\r\n\r\n getToasts() {\r\n return this.toasts;\r\n }\r\n\r\n add(toast: Toast) {\r\n this.toasts = [toast, ...this.toasts];\r\n this.emit();\r\n }\r\n\r\n remove(id: string) {\r\n this.toasts = this.toasts.filter((t) => t.id !== id);\r\n this.emit();\r\n }\r\n\r\n private emit() {\r\n this.listeners.forEach((l) => l());\r\n }\r\n}\r\n\r\nexport const toastStore = new ToastStore();\r\n","import { toastStore } from \"./store\";\nimport { Toast, ToastType } from \"./types\";\n\nexport type ToastOptions = Partial<Omit<Toast, \"id\" | \"type\" | \"createdAt\">>;\n\nfunction createToast(message: string | undefined, type: ToastType, options?: ToastOptions) {\n const id = crypto.randomUUID();\n\n toastStore.add({\n id,\n message,\n type,\n createdAt: Date.now(),\n ...options,\n });\n\n return id;\n}\n\nconst toastFn = (msg: string | undefined, type: ToastType = \"default\", options?: ToastOptions) => createToast(msg, type, options);\n\ntoastFn.success = (msg: string, options?: ToastOptions) => createToast(msg, \"success\", options);\ntoastFn.error = (msg: string, options?: ToastOptions) => createToast(msg, \"error\", options);\ntoastFn.info = (msg: string, options?: ToastOptions) => createToast(msg, \"info\", options);\ntoastFn.warning = (msg: string, options?: ToastOptions) => createToast(msg, \"warning\", options);\ntoastFn.loading = (msg: string, options?: ToastOptions) => createToast(msg, \"loading\", options);\ntoastFn.default = (msg: string, options?: ToastOptions) => createToast(msg, \"default\", options);\ntoastFn.custom = (options: ToastOptions) => createToast(options.message, \"default\", options);\n\ntoastFn.dismiss = (id: string) => toastStore.remove(id);\n\nexport const toast = toastFn;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACIA,IAAM,aAAN,MAAiB;AAAA,EAAjB;AACE,SAAQ,SAAkB,CAAC;AAC3B,SAAQ,YAAwB,CAAC;AAAA;AAAA,EAEjC,UAAU,UAAoB;AAC5B,SAAK,UAAU,KAAK,QAAQ;AAC5B,WAAO,MAAM;AACX,WAAK,YAAY,KAAK,UAAU,OAAO,CAAC,MAAM,MAAM,QAAQ;AAAA,IAC9D;AAAA,EACF;AAAA,EAEA,YAAY;AACV,WAAO,KAAK;AAAA,EACd;AAAA,EAEA,IAAIA,QAAc;AAChB,SAAK,SAAS,CAACA,QAAO,GAAG,KAAK,MAAM;AACpC,SAAK,KAAK;AAAA,EACZ;AAAA,EAEA,OAAO,IAAY;AACjB,SAAK,SAAS,KAAK,OAAO,OAAO,CAAC,MAAM,EAAE,OAAO,EAAE;AACnD,SAAK,KAAK;AAAA,EACZ;AAAA,EAEQ,OAAO;AACb,SAAK,UAAU,QAAQ,CAAC,MAAM,EAAE,CAAC;AAAA,EACnC;AACF;AAEO,IAAM,aAAa,IAAI,WAAW;;;AC7BzC,SAAS,YAAY,SAA6B,MAAiB,SAAwB;AACzF,QAAM,KAAK,OAAO,WAAW;AAE7B,aAAW,IAAI;AAAA,IACb;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW,KAAK,IAAI;AAAA,IACpB,GAAG;AAAA,EACL,CAAC;AAED,SAAO;AACT;AAEA,IAAM,UAAU,CAAC,KAAyB,OAAkB,WAAW,YAA2B,YAAY,KAAK,MAAM,OAAO;AAEhI,QAAQ,UAAU,CAAC,KAAa,YAA2B,YAAY,KAAK,WAAW,OAAO;AAC9F,QAAQ,QAAQ,CAAC,KAAa,YAA2B,YAAY,KAAK,SAAS,OAAO;AAC1F,QAAQ,OAAO,CAAC,KAAa,YAA2B,YAAY,KAAK,QAAQ,OAAO;AACxF,QAAQ,UAAU,CAAC,KAAa,YAA2B,YAAY,KAAK,WAAW,OAAO;AAC9F,QAAQ,UAAU,CAAC,KAAa,YAA2B,YAAY,KAAK,WAAW,OAAO;AAC9F,QAAQ,UAAU,CAAC,KAAa,YAA2B,YAAY,KAAK,WAAW,OAAO;AAC9F,QAAQ,SAAS,CAAC,YAA0B,YAAY,QAAQ,SAAS,WAAW,OAAO;AAE3F,QAAQ,UAAU,CAAC,OAAe,WAAW,OAAO,EAAE;AAE/C,IAAM,QAAQ;","names":["toast"]}
1
+ {"version":3,"sources":["../src/store.ts","../src/toast.ts","../src/types.ts"],"names":["ToastStore","newConfig","listener","l","toast","id","t","newToastInfo","toastStore","createToast","message","type","options","defaultOptions","toastFn","msg","promise","msgs","defaultDuration","data","err","PEEK_OFFSET","MAX_STACK_VISIBLE","SCALE_STEP","OPACITY_STEP"],"mappings":"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","file":"index.js","sourcesContent":["import { Toast, ToastOptions } from \"./types\";\r\n\r\ntype Listener = () => void;\r\n\r\nclass ToastStore {\r\n private toasts: Toast[] = [];\r\n private listeners: Listener[] = [];\r\n private config: ToastOptions = {};\r\n\r\n updateConfig(newConfig: ToastOptions) {\r\n this.config = { ...this.config, ...newConfig };\r\n }\r\n\r\n getConfig() {\r\n return this.config;\r\n }\r\n\r\n subscribe(listener: Listener) {\r\n this.listeners.push(listener);\r\n return () => {\r\n this.listeners = this.listeners.filter((l) => l !== listener);\r\n };\r\n }\r\n\r\n getToasts() {\r\n return this.toasts;\r\n }\r\n\r\n add(toast: Toast) {\r\n this.toasts = [toast, ...this.toasts];\r\n this.emit();\r\n }\r\n\r\n remove(id: string) {\r\n this.toasts = this.toasts.filter((t) => t.id !== id);\r\n this.emit();\r\n }\r\n\r\n update(id: string, newToastInfo: Partial<Toast>) {\r\n this.toasts = this.toasts.map((t) => (t.id === id ? { ...t, ...newToastInfo } : t));\r\n this.emit();\r\n }\r\n\r\n\r\n private emit() {\r\n this.listeners.forEach((l) => l());\r\n }\r\n}\r\n\r\nexport const toastStore = new ToastStore();\r\n","import { toastStore } from \"./store\";\r\nimport { Toast, ToastType, ToastOptions } from \"./types\";\r\n\r\nfunction createToast(message: string | undefined, type: ToastType, options?: ToastOptions) {\r\n const id = crypto.randomUUID();\r\n\r\n const defaultOptions = toastStore.getConfig();\r\n\r\n toastStore.add({\r\n id,\r\n message,\r\n type,\r\n createdAt: Date.now(),\r\n ...defaultOptions,\r\n ...options,\r\n });\r\n\r\n return id;\r\n}\r\n\r\nconst toastFn = (msg: string | undefined, type: ToastType = \"default\", options?: ToastOptions) => createToast(msg, type, options);\r\n\r\ntoastFn.success = (msg: string, options?: ToastOptions) => createToast(msg, \"success\", options);\r\ntoastFn.error = (msg: string, options?: ToastOptions) => createToast(msg, \"error\", options);\r\ntoastFn.info = (msg: string, options?: ToastOptions) => createToast(msg, \"info\", options);\r\ntoastFn.warning = (msg: string, options?: ToastOptions) => createToast(msg, \"warning\", options);\r\ntoastFn.loading = (msg: string, options?: ToastOptions) => createToast(msg, \"loading\", options);\r\ntoastFn.default = (msg: string, options?: ToastOptions) => createToast(msg, \"default\", options);\r\ntoastFn.custom = (options: ToastOptions) => createToast(options.message, \"default\", options);\r\n\r\ntoastFn.promise = <T>(\r\n promise: Promise<T>,\r\n msgs: {\r\n loading: string;\r\n success: string | ((data: T) => string);\r\n error: string | ((err: any) => string);\r\n },\r\n options?: ToastOptions\r\n) => {\r\n const defaultDuration = options?.duration || toastStore.getConfig().duration || 4000;\r\n const id = toastFn.loading(msgs.loading, { ...options, duration: Infinity });\r\n\r\n promise\r\n .then((data) => {\r\n const message = typeof msgs.success === \"function\" ? msgs.success(data) : msgs.success;\r\n toastStore.update(id, { type: \"success\", message, duration: defaultDuration });\r\n })\r\n .catch((err) => {\r\n const message = typeof msgs.error === \"function\" ? msgs.error(err) : msgs.error;\r\n toastStore.update(id, { type: \"error\", message, duration: defaultDuration });\r\n });\r\n\r\n return promise;\r\n};\r\n\r\ntoastFn.dismiss = (id: string) => toastStore.remove(id);\r\n\r\nexport const toast = toastFn;\r\n","import { ReactNode, CSSProperties } from \"react\";\r\n\r\nexport type ToastType =\r\n | \"success\"\r\n | \"error\"\r\n | \"info\"\r\n | \"warning\"\r\n | \"loading\"\r\n | \"default\";\r\n\r\nexport type ToastPosition =\r\n | \"top-left\"\r\n | \"top-center\"\r\n | \"top-right\"\r\n | \"bottom-left\"\r\n | \"bottom-center\"\r\n | \"bottom-right\";\r\n\r\nexport interface Toast {\r\n id: string;\r\n message?: string;\r\n description?: ReactNode;\r\n type?: ToastType;\r\n createdAt: number;\r\n style?: CSSProperties;\r\n className?: string;\r\n duration?: number;\r\n dismissible?: boolean;\r\n position?: ToastPosition;\r\n icon?: ReactNode;\r\n iconColor?: string;\r\n action?: {\r\n label: string;\r\n onClick: () => void;\r\n };\r\n render?: () => ReactNode;\r\n progress?: number;\r\n onShow?: (toast: Toast) => void;\r\n onClose?: (toast: Toast) => void;\r\n onClick?: (toast: Toast) => void;\r\n}\r\n\r\nexport type ToastOptions = Partial<Omit<Toast, \"id\" | \"type\" | \"createdAt\">>;\r\n\r\nexport const PEEK_OFFSET = 10;\r\nexport const MAX_STACK_VISIBLE = 3;\r\nexport const SCALE_STEP = 0.05;\r\nexport const OPACITY_STEP = 0.15;\r\n"]}
@@ -1,56 +1,2 @@
1
- // packages/core/src/store.ts
2
- var ToastStore = class {
3
- constructor() {
4
- this.toasts = [];
5
- this.listeners = [];
6
- }
7
- subscribe(listener) {
8
- this.listeners.push(listener);
9
- return () => {
10
- this.listeners = this.listeners.filter((l) => l !== listener);
11
- };
12
- }
13
- getToasts() {
14
- return this.toasts;
15
- }
16
- add(toast2) {
17
- this.toasts = [toast2, ...this.toasts];
18
- this.emit();
19
- }
20
- remove(id) {
21
- this.toasts = this.toasts.filter((t) => t.id !== id);
22
- this.emit();
23
- }
24
- emit() {
25
- this.listeners.forEach((l) => l());
26
- }
27
- };
28
- var toastStore = new ToastStore();
29
-
30
- // packages/core/src/toast.ts
31
- function createToast(message, type, options) {
32
- const id = crypto.randomUUID();
33
- toastStore.add({
34
- id,
35
- message,
36
- type,
37
- createdAt: Date.now(),
38
- ...options
39
- });
40
- return id;
41
- }
42
- var toastFn = (msg, type = "default", options) => createToast(msg, type, options);
43
- toastFn.success = (msg, options) => createToast(msg, "success", options);
44
- toastFn.error = (msg, options) => createToast(msg, "error", options);
45
- toastFn.info = (msg, options) => createToast(msg, "info", options);
46
- toastFn.warning = (msg, options) => createToast(msg, "warning", options);
47
- toastFn.loading = (msg, options) => createToast(msg, "loading", options);
48
- toastFn.default = (msg, options) => createToast(msg, "default", options);
49
- toastFn.custom = (options) => createToast(options.message, "default", options);
50
- toastFn.dismiss = (id) => toastStore.remove(id);
51
- var toast = toastFn;
52
- export {
53
- toast,
54
- toastStore
55
- };
1
+ var d=class{constructor(){this.toasts=[];this.listeners=[];this.config={};}updateConfig(t){this.config={...this.config,...t};}getConfig(){return this.config}subscribe(t){return this.listeners.push(t),()=>{this.listeners=this.listeners.filter(s=>s!==t);}}getToasts(){return this.toasts}add(t){this.toasts=[t,...this.toasts],this.emit();}remove(t){this.toasts=this.toasts.filter(s=>s.id!==t),this.emit();}update(t,s){this.toasts=this.toasts.map(i=>i.id===t?{...i,...s}:i),this.emit();}emit(){this.listeners.forEach(t=>t());}},n=new d;function r(o,t,s){let i=crypto.randomUUID(),a=n.getConfig();return n.add({id:i,message:o,type:t,createdAt:Date.now(),...a,...s}),i}var e=(o,t="default",s)=>r(o,t,s);e.success=(o,t)=>r(o,"success",t);e.error=(o,t)=>r(o,"error",t);e.info=(o,t)=>r(o,"info",t);e.warning=(o,t)=>r(o,"warning",t);e.loading=(o,t)=>r(o,"loading",t);e.default=(o,t)=>r(o,"default",t);e.custom=o=>r(o.message,"default",o);e.promise=(o,t,s)=>{let i=(s==null?void 0:s.duration)||n.getConfig().duration||4e3,a=e.loading(t.loading,{...s,duration:1/0});return o.then(c=>{let p=typeof t.success=="function"?t.success(c):t.success;n.update(a,{type:"success",message:p,duration:i});}).catch(c=>{let p=typeof t.error=="function"?t.error(c):t.error;n.update(a,{type:"error",message:p,duration:i});}),o};e.dismiss=o=>n.remove(o);var u=e;var l=10,m=3,h=.05,y=.15;export{m as MAX_STACK_VISIBLE,y as OPACITY_STEP,l as PEEK_OFFSET,h as SCALE_STEP,u as toast,n as toastStore};//# sourceMappingURL=index.mjs.map
56
2
  //# sourceMappingURL=index.mjs.map