juice-toast 1.0.0 → 1.1.0

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,23 +1,24 @@
1
1
  # 🍹 JuiceToast
2
2
 
3
- **JuiceToast** is a lightweight, flexible, and dependency-free toast notification library.
4
- It supports **ESM**, **UMD**, **dynamic toast types**, **theme systems**, **queue handling**, and **backward compatibility**.
3
+ **JuiceToast** is a lightweight, flexible, and dependency-free toast notification library for modern web applications.
4
+ Designed with a **clean API**, **extensive customization**, and **strong backward compatibility**, JuiceToast fits both small projects and enterprise-scale systems.
5
5
 
6
- Suitable for small projects up to custom-built frameworks.
6
+ It supports **ESM and UMD**, **dynamic toast types**, **theme management**, **queue handling**, and **legacy API compatibility** out of the box.
7
7
 
8
8
  ---
9
9
 
10
- ## ✨ Features
10
+ ## ✨ Key Features
11
11
 
12
12
  - 🚀 Zero dependencies
13
- - 📦 Supports **ESM** & **UMD**
14
- - 🔁 Queue system (toasts are displayed one at a time)
15
- - 🎨 Theme system (light / dark / custom)
13
+ - 📦 Supports **ESM** and **UMD**
14
+ - 🔁 Built-in queue system (one toast displayed at a time)
15
+ - 🎨 Theme system (light, dark, and custom themes)
16
16
  - 🧩 Dynamic toast types (`success`, `error`, etc.)
17
- - ⏳ Auto close & sticky toasts
17
+ - ⏳ Auto-dismiss & sticky toasts
18
18
  - ❌ Closable toasts
19
- - ⭐ Icon support with animation and link
20
- - 🕰 Backward compatibility with legacy APIs
19
+ - ⭐ Icon support (position, animation, link)
20
+ - 📐 Size presets and manual sizing
21
+ - 🧱 Full backward compatibility with legacy APIs
21
22
 
22
23
  ---
23
24
 
@@ -25,13 +26,24 @@ Suitable for small projects up to custom-built frameworks.
25
26
 
26
27
  ### ESM
27
28
  ```js
28
- import juiceToast from "./juice-toast.esm.js";
29
+ import juiceToast from "https://cdn.kyrt.my.id/libs/js/juice-toast/1.1.0/juice-toast.esm.js";
29
30
  ```
30
31
 
31
32
  ### UMD (Browser)
32
33
  ```html
33
- <script src="juice-toast.umd.js"></script>
34
+ <link
35
+ rel="stylesheet"
36
+ href="https://cdn.kyrt.my.id/libs/css/fontic/2.0.0/juice-toast/style.css"
37
+ />
38
+ <script src="https://cdn.kyrt.my.id/libs/js/juice-toast/1.1.0/juice-toast.umd.js"></script>
39
+
34
40
  <script>
41
+ juiceToast.setup({
42
+ success: {
43
+ bg: "#01AA38"
44
+ }
45
+ });
46
+
35
47
  juiceToast.success("Hello world!");
36
48
  </script>
37
49
  ```
@@ -55,28 +67,37 @@ juiceToast.setup({
55
67
  }
56
68
  });
57
69
 
58
- juiceToast.success("Success!");
59
- juiceToast.error({ title: "Error", message: "An error has occurred" });
70
+ juiceToast.success("Operation completed successfully.");
71
+ juiceToast.error({
72
+ title: "Error",
73
+ message: "An unexpected error occurred."
74
+ });
60
75
  ```
61
76
 
62
77
  ---
63
78
 
64
- ## 🧠 Core Concept
79
+ ## 🧠 Core Concepts
65
80
 
66
81
  ### Toast Types
67
- Toasts are triggered based on **types** defined via `setup()` or `addType()`.
82
+
83
+ Toasts are triggered based on **types** registered using `setup()` or `addType()`.
68
84
 
69
85
  ```js
70
- juiceToast.info("Hello");
71
- juiceToast.warning({ message: "Be careful", duration: 4000 });
86
+ juiceToast.info("Information message");
87
+ juiceToast.warning({
88
+ message: "Proceed with caution",
89
+ duration: 4000
90
+ });
72
91
  ```
73
92
 
93
+ This approach allows a clear separation between **toast configuration** and **runtime usage**.
94
+
74
95
  ---
75
96
 
76
- ## ⚙️ API
97
+ ## ⚙️ API Reference
77
98
 
78
99
  ### `setup(config)`
79
- Register all toast types.
100
+ Registers all toast types and their default configuration.
80
101
 
81
102
  ```js
82
103
  juiceToast.setup({
@@ -88,7 +109,7 @@ juiceToast.setup({
88
109
  ---
89
110
 
90
111
  ### `addType(name, config)`
91
- Add a toast type dynamically.
112
+ Adds a new toast type dynamically at runtime.
92
113
 
93
114
  ```js
94
115
  juiceToast.addType("warning", {
@@ -100,12 +121,12 @@ juiceToast.addType("warning", {
100
121
  ---
101
122
 
102
123
  ### `defineTheme(name, styles)`
103
- Create or override a theme.
124
+ Creates or overrides a theme.
104
125
 
105
126
  ```js
106
127
  juiceToast.defineTheme("ocean", {
107
128
  bg: "#0ea5e9",
108
- color: "#fff",
129
+ color: "#ffffff",
109
130
  border: "1px solid #0284c7"
110
131
  });
111
132
  ```
@@ -113,7 +134,7 @@ juiceToast.defineTheme("ocean", {
113
134
  ---
114
135
 
115
136
  ### `setTheme(name)`
116
- Set the global theme.
137
+ Sets the global theme.
117
138
 
118
139
  ```js
119
140
  juiceToast.setTheme("dark");
@@ -122,7 +143,7 @@ juiceToast.setTheme("dark");
122
143
  ---
123
144
 
124
145
  ### `clear()`
125
- Clear all toast queues.
146
+ Clears all pending toast queues.
126
147
 
127
148
  ```js
128
149
  juiceToast.clear();
@@ -131,7 +152,7 @@ juiceToast.clear();
131
152
  ---
132
153
 
133
154
  ### `destroy()`
134
- Remove all queues and the root DOM element.
155
+ Removes all queues and the root DOM element.
135
156
 
136
157
  ```js
137
158
  juiceToast.destroy();
@@ -139,7 +160,7 @@ juiceToast.destroy();
139
160
 
140
161
  ---
141
162
 
142
- ## 🧾 Toast Payload
163
+ ## 🧾 Toast Payload Interface
143
164
 
144
165
  ```ts
145
166
  interface ToastPayload {
@@ -149,50 +170,43 @@ interface ToastPayload {
149
170
  bg?: string;
150
171
  color?: string;
151
172
  border?: string;
152
- glow?: string;
153
173
  theme?: string;
154
174
 
155
- duration?: number; // ms, 0 = sticky
175
+ duration?: number; // milliseconds, 0 = sticky
156
176
  position?: "top" | "center" | "bottom";
157
- toast?: "top" | "center" | "bottom"; // backward compatibility
177
+ toast?: "top" | "center" | "bottom"; // legacy support
178
+
158
179
  closable?: boolean;
159
- closeable?: boolean; // backward compatibility
180
+ closeable?: boolean; // legacy support
160
181
 
161
182
  icon?: string;
162
183
  iconPack?: string;
163
184
  iconLink?: string;
164
185
  iconAnimate?: string;
186
+ iconPosition?: "left" | "right" | "top";
165
187
 
166
- [key: string]: any;
167
- }
168
- ```
169
-
170
- ---
188
+ size?: "sm" | "md" | "lg";
189
+ width?: string;
190
+ height?: string;
171
191
 
172
- ## 🎯 Full Example
192
+ actions?: {
193
+ label: string;
194
+ onClick?: (event: MouseEvent) => void;
195
+ closeOnClick?: boolean;
196
+ }[];
173
197
 
174
- ```js
175
- juiceToast.success({
176
- title: "Login",
177
- message: "Successfully logged in!",
178
- icon: "check-circle",
179
- iconPack: "fa-solid",
180
- iconAnimate: "shake",
181
- iconLink: "https://example.com",
182
- duration: 3000,
183
- position: "top",
184
- closable: true
185
- });
198
+ [key: string]: any;
199
+ }
186
200
  ```
187
201
 
188
202
  ---
189
203
 
190
204
  ## 🔄 Backward Compatibility
191
205
 
192
- JuiceToast automatically supports legacy APIs:
206
+ JuiceToast automatically maps legacy options to the modern API.
193
207
 
194
- | Legacy | Current |
195
- |------|---------|
208
+ | Legacy Option | Current Option |
209
+ |--------------|----------------|
196
210
  | `toast` | `position` |
197
211
  | `closeable` | `closable` |
198
212
  | `icon_left_top` | `icon` |
@@ -213,7 +227,7 @@ light: {
213
227
 
214
228
  dark: {
215
229
  bg: "#1f2937",
216
- color: "#fff",
230
+ color: "#ffffff",
217
231
  border: "1px solid rgba(255,255,255,.08)"
218
232
  }
219
233
  ```
@@ -222,11 +236,12 @@ dark: {
222
236
 
223
237
  ## 📌 Notes
224
238
 
225
- - Not compatible with SSR (DOM required)
239
+ - Browser-only (DOM required)
226
240
  - Root element is automatically created: `#juice-toast-root`
241
+ - Suitable for frameworks, custom runtimes, etc.
227
242
 
228
243
  ---
229
244
 
230
245
  ## 📄 License
231
246
 
232
- MIT © JuiceToast
247
+ MIT License © OpenDN Foundation
@@ -1,65 +1,138 @@
1
- export type ToastPosition = "top" | "center" | "bottom";
1
+ /**
2
+ * OpenDN Foundation (C) 2026
3
+ * Juice Toast v1.1.0 — Type Definitions
4
+ * @license MIT
5
+ */
6
+
7
+ /* ================= BASIC TYPES ================= */
8
+
9
+ export type ToastPosition =
10
+ | "top"
11
+ | "center"
12
+ | "bottom"
13
+ | "top-left"
14
+ | "top-right"
15
+ | "bottom-left"
16
+ | "bottom-right";
17
+
18
+ export type ToastSize = "sm" | "md" | "lg";
19
+
20
+ export type IconPosition = "left" | "right" | "top";
21
+
22
+ export type ToastDuration = number; // 0 = persistent
23
+
24
+ /* ================= THEME ================= */
2
25
 
3
26
  export interface ToastTheme {
4
- bg ? : string;
5
- color ? : string;
6
- border ? : string;
7
- glow ? : string;
27
+ bg?: string;
28
+ color?: string;
29
+ border?: string;
30
+ glow?: string;
8
31
  }
9
32
 
33
+ /* ================= ACTION ================= */
34
+
35
+ export interface ToastAction {
36
+ label: string;
37
+ onClick?: (event: MouseEvent) => void;
38
+ closeOnClick?: boolean;
39
+ }
40
+
41
+ /* ================= PAYLOAD ================= */
42
+
10
43
  export interface ToastPayload {
11
- /* CONTENT */
12
- message ? : string;
13
- title ? : string;
14
-
15
- /* STYLE */
16
- bg ? : string;
17
- color ? : string;
18
- border ? : string;
19
- glow ? : string;
20
- theme ? : string;
21
-
22
- /* BEHAVIOR */
23
- duration ? : number; // ms, 0 = sticky
24
- position ? : ToastPosition;
25
- toast ? : ToastPosition; // backward compat
26
- closable ? : boolean;
27
- closeable ? : boolean; // backward compat
28
-
29
- /* ICON (Fontic / others) */
30
- icon ? : string;
31
- icon_left_top ? : string; // backward compat
32
- icon_config ? : string; // backward compat
33
- iconPack ? : string;
34
-
35
- iconLink ? : string;
36
- iconAnimate ? : string;
37
-
38
- /* any future extension */
39
- [key: string]: any;
44
+ /* -------- content -------- */
45
+ message?: string;
46
+ title?: string;
47
+
48
+ /* -------- appearance -------- */
49
+ bg?: string;
50
+ color?: string;
51
+ border?: string;
52
+ glow?: string;
53
+ theme?: string;
54
+
55
+ width?: string;
56
+ height?: string;
57
+ size?: ToastSize;
58
+ compact?: boolean;
59
+
60
+ /* -------- timing & placement -------- */
61
+ duration?: ToastDuration;
62
+ position?: ToastPosition;
63
+ toast?: ToastPosition; // legacy
64
+
65
+ /* -------- close -------- */
66
+ closable?: boolean;
67
+ closeable?: boolean; // legacy
68
+
69
+ /* -------- icon (modern) -------- */
70
+ icon?: string;
71
+ iconPack?: string;
72
+ iconSize?: string;
73
+ iconPosition?: IconPosition;
74
+ iconLink?: string;
75
+ iconAnimate?: string;
76
+
77
+ /* -------- icon (legacy) -------- */
78
+ icon_left_top?: string;
79
+ icon_config?: string;
80
+ icon_onClick_url?: string;
81
+ icon_onClick_animate?: string;
82
+
83
+ /* -------- actions -------- */
84
+ actions?: ToastAction[];
85
+
86
+ /* -------- escape hatch -------- */
87
+ [key: string]: unknown;
40
88
  }
41
89
 
90
+ /* ================= TYPE CONFIG ================= */
91
+
42
92
  export interface ToastTypeConfig extends ToastPayload {}
43
93
 
94
+ /* ================= CORE API ================= */
95
+
44
96
  export interface JuiceToastAPI {
45
- /* ===== SETUP ===== */
46
- setup(config: Record < string, ToastTypeConfig > ): void;
47
- addType(name: string, config ? : ToastTypeConfig): void;
48
-
49
- /* ===== THEME ===== */
97
+ /**
98
+ * Register toast types in bulk
99
+ */
100
+ setup<T extends Record<string, ToastTypeConfig>>(config?: T): void;
101
+
102
+ /**
103
+ * Add or override a single toast type
104
+ */
105
+ addType<T extends ToastTypeConfig>(
106
+ name: string,
107
+ config?: T
108
+ ): void;
109
+
110
+ /**
111
+ * Theme system
112
+ */
50
113
  defineTheme(name: string, styles: ToastTheme): void;
51
114
  setTheme(name: string): void;
52
-
53
- /* ===== QUEUE ===== */
115
+
116
+ /**
117
+ * Queue control
118
+ */
54
119
  clear(): void;
55
120
  destroy(): void;
56
-
57
- /* ===== DYNAMIC METHODS ===== */
58
- [type: string]: ((payload ? : string | number | ToastPayload) => void) | any;
121
+
122
+ /**
123
+ * Dynamic toast methods
124
+ * juiceToast.success(...)
125
+ * juiceToast.error(...)
126
+ * juiceToast.anything(...)
127
+ */
128
+ [type: string]:
129
+ | ((payload?: string | number | ToastPayload) => void)
130
+ | unknown;
59
131
  }
60
132
 
61
- /* ===== DEFAULT EXPORT ===== */
133
+ /* ================= EXPORT ================= */
134
+
62
135
  declare const juiceToast: JuiceToastAPI;
63
136
 
64
137
  export default juiceToast;
65
- export { juiceToast };
138
+ export { juiceToast };
@@ -1,2 +1,6 @@
1
- const c=typeof window!="undefined"&&typeof document!="undefined",l={light:{bg:"#ffffff",color:"#111",border:"1px solid #e5e7eb"},dark:{bg:"#1f2937",color:"#fff",border:"1px solid rgba(255,255,255,.08)"}},k={_config:{},_queue:[],_showing:!1,_theme:"dark",setup(t={}){this._config=t,this._registerTypes()},addType(t,o={}){this._config[t]=o,this._registerTypes()},defineTheme(t,o={}){l[t]={...l[t]||{},...o}},setTheme(t){if(this._theme=t,!c)return;const o=document.getElementById("juice-toast-root");o&&(o.dataset.theme=t)},clear(){this._queue.length=0},destroy(){var t;this.clear(),c&&((t=document.getElementById("juice-toast-root"))==null||t.remove())},_registerTypes(){Object.keys(this._config).forEach(t=>{if(typeof this[t]=="function"&&!this[t].__auto)return;const o=a=>this._enqueue(t,a);o.__auto=!0,this[t]=o})},_enqueue(t,o){this._queue.push({type:t,payload:o}),this._showing||this._next()},_next(){if(!this._queue.length){this._showing=!1;return}this._showing=!0;const t=this._queue.shift();this._showToast(t.type,t.payload)},_getRoot(t){if(!c)return null;let o=document.getElementById("juice-toast-root");return o||(o=document.createElement("div"),o.id="juice-toast-root",document.body.appendChild(o)),o.dataset.position=t||"bottom",o.dataset.theme=this._theme,o},_showToast(t,o){var h,u,f,_,p,g,b;if(!c)return;const a=this._config[t]||{},y=typeof o=="object"?o:{message:String(o)},e={...a,...y};e.icon=(h=e.icon)!=null?h:e.icon_left_top,e.iconPack=(u=e.iconPack)!=null?u:e.icon_config,e.iconLink=(f=e.iconLink)!=null?f:e.icon_onClick_url,e.iconAnimate=(_=e.iconAnimate)!=null?_:e.icon_onClick_animate,e.position=(p=e.position)!=null?p:e.toast,e.closable=(g=e.closable)!=null?g:e.closeable;const r=l[e.theme||this._theme]||{},n=document.createElement("div");if(n.className="juice-toast",n.style.background=e.bg||r.bg,n.style.color=e.color||r.color,n.style.border=e.border||r.border,e.icon){const i=document.createElement("i");i.className=["icon",e.iconPack||"",e.icon].join(" ").trim(),(e.iconLink||e.iconAnimate)&&(i.classList.add("icon-clickable"),i.onclick=j=>{j.stopPropagation(),e.iconAnimate&&(i.classList.remove(e.iconAnimate),i.offsetWidth,i.classList.add(e.iconAnimate)),e.iconLink&&window.open(e.iconLink,"_blank","noopener")}),n.appendChild(i)}const s=document.createElement("div");if(s.className="jt-content",e.title){const i=document.createElement("div");i.className="jt-title",i.textContent=e.title,s.appendChild(i)}const d=document.createElement("div");if(d.className="jt-message",d.textContent=e.message||"",s.appendChild(d),n.appendChild(s),e.closable){const i=document.createElement("span");i.className="juice-toast-close",i.innerHTML="\xD7",i.onclick=()=>{n.remove(),this._next()},n.appendChild(i)}this._getRoot(e.position).appendChild(n),requestAnimationFrame(()=>n.classList.add("show"));const m=(b=e.duration)!=null?b:2500;m!==0&&setTimeout(()=>{n.classList.remove("show"),setTimeout(()=>{n.remove(),this._next()},300)},m)}};var T=k;export{T as default,k as juiceToast};
2
- //# sourceMappingURL=juice-toast.esm.js.map
1
+ /**
2
+ * 2026 (C) OpenDN Foundation
3
+ * v1.1.0 Juice Toast
4
+ * ESM (ECMAScript Module (import/export))
5
+ */
6
+ let isBrowser="undefined"!=typeof window&&"undefined"!=typeof document,themes={light:{bg:"#ffffff",color:"#111",border:"1px solid #e5e7eb"},dark:{bg:"#1f2937",color:"#fff",border:"1px solid rgba(255,255,255,.08)"}},sizePreset={sm:{width:"260px",padding:"10px"},md:{width:"320px",padding:"14px"},lg:{width:"420px",padding:"18px"}},juiceToast={_config:{},_queue:[],_showing:!1,_theme:"dark",setup(e={}){this._config=e,this._registerTypes()},addType(e,t={}){this._config[e]=t,this._registerTypes()},defineTheme(e,t={}){themes[e]={...themes[e]||{},...t}},setTheme(e){if(this._theme=e,!isBrowser)return;let t=document.getElementById("juice-toast-root");t&&(t.dataset.theme=e)},clear(){this._queue.length=0},destroy(){this.clear(),isBrowser&&document.getElementById("juice-toast-root")?.remove()},_registerTypes(){Object.keys(this._config).forEach(e=>{if("function"==typeof this[e]&&!this[e].__auto)return;let t=t=>this._enqueue(e,t);t.__auto=!0,this[e]=t})},_enqueue(e,t){this._queue.push({type:e,payload:t}),this._showing||this._next()},_next(){if(!this._queue.length){this._showing=!1;return}this._showing=!0;let e=this._queue.shift();this._showToast(e.type,e.payload)},_getRoot(e){if(!isBrowser)return null;let t=document.getElementById("juice-toast-root");return t||((t=document.createElement("div")).id="juice-toast-root",document.body.appendChild(t)),t.dataset.position=e||"bottom",t.dataset.theme=this._theme,t},_showToast(e,t){if(!isBrowser)return;let i=this._config[e]||{},o="object"==typeof t?t:{message:String(t)},s={...i,...o};s.icon=s.icon??s.icon_left_top,s.iconPack=s.iconPack??s.icon_config,s.iconLink=s.iconLink??s.icon_onClick_url,s.iconAnimate=s.iconAnimate??s.icon_onClick_animate,s.position=s.position??s.toast,s.closable=s.closable??s.closeable,s.iconPosition=s.iconPosition||"left",s.compact=!!s.compact;let n=themes[s.theme||this._theme]||{},a=document.createElement("div");if(a.className="juice-toast",s.size&&sizePreset[s.size]){let c=sizePreset[s.size];c.width&&(a.style.width=c.width),c.padding&&(a.style.padding=c.padding)}s.compact&&a.classList.add("jt-compact"),s.width&&(a.style.width=s.width),s.height&&(a.style.height=s.height),a.style.background=s.bg||n.bg,a.style.color=s.color||n.color,a.style.border=s.border||n.border;let l=null;s.icon&&((l=document.createElement("i")).className=["icon",s.iconPack||"",s.icon].join(" ").trim(),s.iconSize&&(l.style.fontSize=s.iconSize),(s.iconLink||s.iconAnimate)&&(l.classList.add("icon-clickable"),l.onclick=e=>{e.stopPropagation(),s.iconAnimate&&(l.classList.remove(s.iconAnimate),l.offsetWidth,l.classList.add(s.iconAnimate)),s.iconLink&&window.open(s.iconLink,"_blank","noopener")}));let d=document.createElement("div");if(d.className="jt-content",s.title){let h=document.createElement("div");h.className="jt-title",h.textContent=s.title,d.appendChild(h)}let r=document.createElement("div");if(r.className="jt-message",r.textContent=s.message||"",d.appendChild(r),l&&"top"===s.iconPosition?(a.classList.add("jt-icon-top"),a.appendChild(l),a.appendChild(d)):l&&"right"===s.iconPosition?(a.appendChild(d),a.appendChild(l)):(l&&a.appendChild(l),a.appendChild(d)),Array.isArray(s.actions)&&s.actions.length){let p=document.createElement("div");p.className="jt-actions",s.actions.forEach(e=>{let t=document.createElement("button");t.className="jt-action",t.textContent=e.label,t.onclick=t=>{t.stopPropagation(),e.onClick?.(t),e.closeOnClick&&(a.remove(),this._next())},p.appendChild(t)}),d.appendChild(p)}if(s.closable){let m=document.createElement("span");m.className="juice-toast-close",m.innerHTML="\xd7",m.onclick=()=>{a.remove(),this._next()},a.appendChild(m)}let g=this._getRoot(s.position);g.appendChild(a),requestAnimationFrame(()=>a.classList.add("show"));let u=s.duration??2500;0!==u&&setTimeout(()=>{a.classList.remove("show"),setTimeout(()=>{a.remove(),this._next()},300)},u)}};export default juiceToast;export{juiceToast};
@@ -1,2 +1,6 @@
1
- var juiceToast=(()=>{(function(c,s){typeof define=="function"&&define.amd?define([],s):typeof module=="object"&&module.exports?module.exports=s():c.juiceToast=s()})(void 0,function(){return(function(){const c=typeof window!="undefined"&&typeof document!="undefined",s={light:{bg:"#fff",color:"#111",border:"1px solid #e5e7eb"},dark:{bg:"#1f2937",color:"#fff",border:"1px solid rgba(255,255,255,.08)"}};return{_config:{},_queue:[],_showing:!1,_theme:"dark",setup(t={}){this._config=t,this._registerTypes()},addType(t,o={}){this._config[t]=o,this._registerTypes()},defineTheme(t,o={}){s[t]={...s[t]||{},...o}},setTheme(t){if(this._theme=t,!c)return;const o=document.getElementById("juice-toast-root");o&&(o.dataset.theme=t)},clear(){this._queue.length=0},destroy(){var t;this.clear(),c&&((t=document.getElementById("juice-toast-root"))==null||t.remove())},_registerTypes(){Object.keys(this._config).forEach(t=>{if(typeof this[t]=="function"&&!this[t].__auto)return;const o=r=>this._enqueue(t,r);o.__auto=!0,this[t]=o})},_enqueue(t,o){this._queue.push({type:t,payload:o}),this._showing||this._next()},_next(){if(!this._queue.length){this._showing=!1;return}this._showing=!0;const t=this._queue.shift();this._showToast(t.type,t.payload)},_getRoot(t){if(!c)return null;let o=document.getElementById("juice-toast-root");return o||(o=document.createElement("div"),o.id="juice-toast-root",document.body.appendChild(o)),o.dataset.position=t||"bottom",o.dataset.theme=this._theme,o},_showToast(t,o){var m,h,f,_,p,g,b;if(!c)return;const r=this._config[t]||{},k=typeof o=="object"?o:{message:String(o)},e={...r,...k};e.icon=(m=e.icon)!=null?m:e.icon_left_top,e.iconPack=(h=e.iconPack)!=null?h:e.icon_config,e.iconLink=(f=e.iconLink)!=null?f:e.icon_onClick_url,e.iconAnimate=(_=e.iconAnimate)!=null?_:e.icon_onClick_animate,e.position=(p=e.position)!=null?p:e.toast,e.closable=(g=e.closable)!=null?g:e.closeable;const d=s[e.theme||this._theme]||{},n=document.createElement("div");if(n.className="juice-toast",n.style.background=e.bg||d.bg,n.style.color=e.color||d.color,n.style.border=e.border||d.border,e.icon){const i=document.createElement("i");i.className=["icon",e.iconPack||"",e.icon].join(" ").trim(),(e.iconLink||e.iconAnimate)&&(i.classList.add("icon-clickable"),i.onclick=j=>{j.stopPropagation(),e.iconAnimate&&(i.classList.remove(e.iconAnimate),i.offsetWidth,i.classList.add(e.iconAnimate)),e.iconLink&&window.open(e.iconLink,"_blank","noopener")}),n.appendChild(i)}const a=document.createElement("div");if(a.className="jt-content",e.title){const i=document.createElement("div");i.className="jt-title",i.textContent=e.title,a.appendChild(i)}const l=document.createElement("div");if(l.className="jt-message",l.textContent=e.message||"",a.appendChild(l),n.appendChild(a),e.closable){const i=document.createElement("span");i.className="juice-toast-close",i.innerHTML="\xD7",i.onclick=()=>{n.remove(),this._next()},n.appendChild(i)}this._getRoot(e.position).appendChild(n),requestAnimationFrame(()=>n.classList.add("show"));const u=(b=e.duration)!=null?b:2500;u!==0&&setTimeout(()=>{n.classList.remove("show"),setTimeout(()=>{n.remove(),this._next()},300)},u)}}})()});})();
2
- //# sourceMappingURL=juice-toast.umd.js.map
1
+ /**
2
+ * 2026 (C) OpenDN Foundation
3
+ * v1.1.0 Juice Toast
4
+ * UMD (Universal Module Definition (<script>))
5
+ */
6
+ !function(e,t){"function"==typeof define&&define.amd?define([],t):"object"==typeof module&&module.exports?module.exports=t():e.juiceToast=t()}(this,function(){return function(){let e="undefined"!=typeof window&&"undefined"!=typeof document,t={light:{bg:"#fff",color:"#111",border:"1px solid #e5e7eb"},dark:{bg:"#1f2937",color:"#fff",border:"1px solid rgba(255,255,255,.08)"}};return{_config:{},_queue:[],_showing:!1,_theme:"dark",setup(e={}){this._config=e,this._registerTypes()},addType(e,t={}){this._config[e]=t,this._registerTypes()},defineTheme(e,i={}){t[e]={...t[e]||{},...i}},setTheme(t){if(this._theme=t,!e)return;let i=document.getElementById("juice-toast-root");i&&(i.dataset.theme=t)},clear(){this._queue.length=0},destroy(){this.clear(),e&&document.getElementById("juice-toast-root")?.remove()},_registerTypes(){Object.keys(this._config).forEach(e=>{if("function"==typeof this[e]&&!this[e].__auto)return;let t=t=>this._enqueue(e,t);t.__auto=!0,this[e]=t})},_enqueue(e,t){this._queue.push({type:e,payload:t}),this._showing||this._next()},_next(){if(!this._queue.length){this._showing=!1;return}this._showing=!0;let e=this._queue.shift();this._showToast(e.type,e.payload)},_getRoot(t){if(!e)return null;let i=document.getElementById("juice-toast-root");return i||((i=document.createElement("div")).id="juice-toast-root",document.body.appendChild(i)),i.dataset.position=t||"bottom",i.dataset.theme=this._theme,i},_showToast(i,o){if(!e)return;let n=this._config[i]||{},s="object"==typeof o?o:{message:String(o)},a={...n,...s};a.icon=a.icon??a.icon_left_top,a.iconPack=a.iconPack??a.icon_config,a.iconLink=a.iconLink??a.icon_onClick_url,a.iconAnimate=a.iconAnimate??a.icon_onClick_animate,a.position=a.position??a.toast,a.closable=a.closable??a.closeable,a.iconPosition=a.iconPosition||"left",a.compact=!!a.compact;let c=t[a.theme||this._theme]||{},l=document.createElement("div");if(l.className="juice-toast",a.size&&sizePreset[a.size]){let d=sizePreset[a.size];d.width&&(l.style.width=d.width),d.padding&&(l.style.padding=d.padding)}a.width&&(l.style.width=a.width),a.height&&(l.style.height=a.height),l.style.background=a.bg||c.bg,l.style.color=a.color||c.color,l.style.border=a.border||c.border;let h=null;a.icon&&((h=document.createElement("i")).className=["icon",a.iconPack||"",a.icon].join(" ").trim(),a.iconSize&&(h.style.fontSize=a.iconSize),(a.iconLink||a.iconAnimate)&&(h.classList.add("icon-clickable"),h.onclick=e=>{e.stopPropagation(),a.iconAnimate&&(h.classList.remove(a.iconAnimate),h.offsetWidth,h.classList.add(a.iconAnimate)),a.iconLink&&window.open(a.iconLink,"_blank","noopener")}));let r=document.createElement("div");if(r.className="jt-content",a.title){let p=document.createElement("div");p.className="jt-title",p.textContent=a.title,r.appendChild(p)}let m=document.createElement("div");if(m.className="jt-message",m.textContent=a.message||"",r.appendChild(m),h&&"top"===a.iconPosition?(l.classList.add("jt-icon-top"),l.appendChild(h),l.appendChild(r)):h&&"right"===a.iconPosition?(l.appendChild(r),l.appendChild(h)):(h&&l.appendChild(h),l.appendChild(r)),Array.isArray(a.actions)&&a.actions.length){let u=document.createElement("div");u.className="jt-actions",a.actions.forEach(e=>{let t=document.createElement("button");t.className="jt-action",t.textContent=e.label,t.onclick=t=>{t.stopPropagation(),e.onClick?.(t),e.closeOnClick&&(l.remove(),this._next())},u.appendChild(t)}),r.appendChild(u)}if(a.closable){let f=document.createElement("span");f.className="juice-toast-close",f.innerHTML="\xd7",f.onclick=()=>{l.remove(),this._next()},l.appendChild(f)}let g=this._getRoot(a.position);g.appendChild(l),requestAnimationFrame(()=>l.classList.add("show"));let y=a.duration??2500;0!==y&&setTimeout(()=>{l.classList.remove("show"),setTimeout(()=>{l.remove(),this._next()},300)},y)}}}()});
package/dist/style.css ADDED
@@ -0,0 +1,6 @@
1
+ /*
2
+ 2026 (C) OpenDN Foundation
3
+ v1.1.0
4
+ @license MIT
5
+ */
6
+ #juice-toast-root{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:9999;pointer-events:none;display:flex;flex-direction:column;align-items:center}#juice-toast-root[data-position=center]{top:50%;bottom:auto;transform:translate(-50%,-50%)}#juice-toast-root[data-position=top]{top:20px;bottom:auto;transform:translateX(-50%)}.juice-toast{pointer-events:auto;display:flex;gap:12px;align-items:flex-start;min-width:220px;max-width:420px;padding:12px 16px;margin:6px 0;border-radius:8px;color:#fff;font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial;font-size:14px;background:#333;opacity:0;transform:translateY(10px);transition:opacity .25s,transform .25s,background .25s,color .25s,box-shadow .25s;position:relative;box-sizing:border-box;overflow:hidden}.juice-toast.show{opacity:1;transform:translateY(0)}.juice-toast .icon{width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;font-size:16px;line-height:1;flex:0 0 28px}.juice-toast .jt-content{display:flex;flex-direction:column;gap:4px;flex:1 1 auto}.juice-toast .jt-title{font-weight:700;font-size:13px;line-height:1}.juice-toast .jt-message{font-weight:400;font-size:13px;line-height:1.2;opacity:.95}.juice-toast-close{position:absolute;top:6px;right:8px;cursor:pointer;font-size:16px;opacity:.75;padding:4px;border-radius:4px}.juice-toast-close:hover{opacity:1;background:rgba(255,255,255,.06)}#juice-toast-root>.juice-toast{transform-origin:center}.icon[data-position=top]{align-self:center;margin-bottom:6px}.icon-clickable{opacity:.85}.icon-clickable:hover{opacity:1}@keyframes jt-spin{to{transform:rotate(360deg)}}@keyframes jt-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.2)}}@keyframes jt-shake{0%,100%{transform:translateX(0)}25%,75%{transform:translateX(-2px)}50%{transform:translateX(2px)}}.spin{animation:.6s linear jt-spin}.pulse{animation:.4s jt-pulse}.shake{animation:.4s jt-shake}@media (prefers-reduced-motion:reduce){.juice-toast,.pulse,.shake,.spin{animation:none!important;transition:none!important}}.jt-compact{padding:8px 10px;gap:8px;font-size:.9em}.jt-icon-top{flex-direction:column;align-items:flex-start}.jt-icon-top .icon{margin-bottom:6px}.jt-actions{display:flex;gap:8px;margin-top:10px}.jt-action{background:0 0;border:1px solid currentColor;padding:4px 10px;border-radius:6px;cursor:pointer;font-size:12px}
package/package.json CHANGED
@@ -1,19 +1,30 @@
1
1
  {
2
2
  "name": "juice-toast",
3
- "version": "1.0.0",
3
+ "version": "1.1.0",
4
4
  "description": "Lightweight, dependency-free toast notification library",
5
5
  "keywords": [
6
6
  "toast",
7
7
  "notification",
8
- "ui"
8
+ "ui",
9
+ "javascript",
10
+ "frontend",
11
+ "browser",
12
+ "vanilla-js"
9
13
  ],
10
14
  "license": "MIT",
11
15
  "author": "KhairyK",
12
16
  "homepage": "https://github.com/KhairyK/juiceToast",
17
+ "bugs": {
18
+ "url": "https://github.com/KhairyK/juiceToast/issues"
19
+ },
13
20
  "repository": {
14
21
  "type": "git",
15
22
  "url": "git+https://github.com/KhairyK/juiceToast.git"
16
23
  },
24
+ "funding": "https://patreon.com/Khairy47",
25
+ "engines": {
26
+ "node": ">=14"
27
+ },
17
28
  "main": "dist/juice-toast.umd.js",
18
29
  "module": "dist/juice-toast.esm.js",
19
30
  "types": "dist/juice-toast.d.ts",
@@ -24,14 +35,14 @@
24
35
  "types": "./dist/juice-toast.d.ts"
25
36
  }
26
37
  },
27
- "files": [
28
- "dist"
29
- ],
38
+ "files": ["dist"],
30
39
  "sideEffects": false,
31
- "scripts": {
32
- "build": "node build.js"
40
+ "publishConfig": {
41
+ "access": "public"
33
42
  },
34
- "devDependencies": {
35
- "esbuild": "^0.27.2"
43
+ "unpkg": "dist/juice-toast.umd.js",
44
+ "jsdelivr": "dist/juice-toast.umd.js",
45
+ "scripts": {
46
+ "dev": "live-server"
36
47
  }
37
48
  }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../src/juice-toast.esm.src.js"],
4
- "sourcesContent": ["const isBrowser =\n typeof window !== \"undefined\" &&\n typeof document !== \"undefined\";\n\n/* ================= THEME REGISTRY ================= */\n\nconst themes = {\n light: {\n bg: \"#ffffff\",\n color: \"#111\",\n border: \"1px solid #e5e7eb\"\n },\n dark: {\n bg: \"#1f2937\",\n color: \"#fff\",\n border: \"1px solid rgba(255,255,255,.08)\"\n }\n};\n\n/* ================= CORE ================= */\n\nconst juiceToast = {\n _config: {},\n _queue: [],\n _showing: false,\n _theme: \"dark\",\n \n /* ===== PUBLIC API ===== */\n \n setup(cfg = {}) {\n this._config = cfg;\n this._registerTypes();\n },\n \n addType(name, cfg = {}) {\n this._config[name] = cfg;\n this._registerTypes();\n },\n \n defineTheme(name, styles = {}) {\n themes[name] = { ...(themes[name] || {}), ...styles };\n },\n \n setTheme(name) {\n this._theme = name;\n if (!isBrowser) return;\n const root = document.getElementById(\"juice-toast-root\");\n if (root) root.dataset.theme = name;\n },\n \n clear() {\n this._queue.length = 0;\n },\n \n destroy() {\n this.clear();\n if (!isBrowser) return;\n document.getElementById(\"juice-toast-root\")?.remove();\n },\n \n /* ===== INTERNAL ===== */\n \n _registerTypes() {\n Object.keys(this._config).forEach(type => {\n if (typeof this[type] === \"function\" && !this[type].__auto) return;\n const fn = payload => this._enqueue(type, payload);\n fn.__auto = true;\n this[type] = fn;\n });\n },\n \n _enqueue(type, payload) {\n this._queue.push({ type, payload });\n if (!this._showing) this._next();\n },\n \n _next() {\n if (!this._queue.length) {\n this._showing = false;\n return;\n }\n this._showing = true;\n const item = this._queue.shift();\n this._showToast(item.type, item.payload);\n },\n \n _getRoot(position) {\n if (!isBrowser) return null;\n let root = document.getElementById(\"juice-toast-root\");\n if (!root) {\n root = document.createElement(\"div\");\n root.id = \"juice-toast-root\";\n document.body.appendChild(root);\n }\n root.dataset.position = position || \"bottom\";\n root.dataset.theme = this._theme;\n return root;\n },\n \n _showToast(type, payload) {\n if (!isBrowser) return;\n \n const base = this._config[type] || {};\n const data =\n typeof payload === \"object\" ?\n payload :\n { message: String(payload) };\n \n const cfg = { ...base, ...data };\n \n /* BACKWARD COMPAT */\n cfg.icon = cfg.icon ?? cfg.icon_left_top;\n cfg.iconPack = cfg.iconPack ?? cfg.icon_config;\n cfg.iconLink = cfg.iconLink ?? cfg.icon_onClick_url;\n cfg.iconAnimate = cfg.iconAnimate ?? cfg.icon_onClick_animate;\n cfg.position = cfg.position ?? cfg.toast;\n cfg.closable = cfg.closable ?? cfg.closeable;\n \n const theme = themes[cfg.theme || this._theme] || {};\n \n const toast = document.createElement(\"div\");\n toast.className = \"juice-toast\";\n toast.style.background = cfg.bg || theme.bg;\n toast.style.color = cfg.color || theme.color;\n toast.style.border = cfg.border || theme.border;\n \n /* ICON */\n if (cfg.icon) {\n const icon = document.createElement(\"i\");\n icon.className = [\n \"icon\",\n cfg.iconPack || \"\",\n cfg.icon\n ].join(\" \").trim();\n \n if (cfg.iconLink || cfg.iconAnimate) {\n icon.classList.add(\"icon-clickable\");\n icon.onclick = e => {\n e.stopPropagation();\n if (cfg.iconAnimate) {\n icon.classList.remove(cfg.iconAnimate);\n void icon.offsetWidth;\n icon.classList.add(cfg.iconAnimate);\n }\n if (cfg.iconLink) {\n window.open(cfg.iconLink, \"_blank\", \"noopener\");\n }\n };\n }\n toast.appendChild(icon);\n }\n \n /* CONTENT */\n const content = document.createElement(\"div\");\n content.className = \"jt-content\";\n \n if (cfg.title) {\n const t = document.createElement(\"div\");\n t.className = \"jt-title\";\n t.textContent = cfg.title;\n content.appendChild(t);\n }\n \n const msg = document.createElement(\"div\");\n msg.className = \"jt-message\";\n msg.textContent = cfg.message || \"\";\n content.appendChild(msg);\n \n toast.appendChild(content);\n \n /* CLOSE */\n if (cfg.closable) {\n const close = document.createElement(\"span\");\n close.className = \"juice-toast-close\";\n close.innerHTML = \"\u00D7\";\n close.onclick = () => {\n toast.remove();\n this._next();\n };\n toast.appendChild(close);\n }\n \n const root = this._getRoot(cfg.position);\n root.appendChild(toast);\n \n requestAnimationFrame(() => toast.classList.add(\"show\"));\n \n const duration = cfg.duration ?? 2500;\n if (duration === 0) return;\n \n setTimeout(() => {\n toast.classList.remove(\"show\");\n setTimeout(() => {\n toast.remove();\n this._next();\n }, 300);\n }, duration);\n }\n};\n\nexport default juiceToast;\nexport { juiceToast };\n"],
5
- "mappings": "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",
6
- "names": ["isBrowser", "themes", "juiceToast", "cfg", "name", "styles", "root", "_a", "type", "fn", "payload", "item", "position", "_b", "_c", "_d", "_e", "_f", "_g", "base", "data", "theme", "toast", "icon", "e", "content", "t", "msg", "close", "duration", "juice_toast_esm_src_default"]
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../src/juice-toast.umd.src.js"],
4
- "sourcesContent": ["(function(root, factory) {\n if (typeof define === \"function\" && define.amd) {\n define([], factory);\n } else if (typeof module === \"object\" && module.exports) {\n module.exports = factory();\n } else {\n root.juiceToast = factory();\n }\n})(this, function() {\n return (function() {\n \n const isBrowser =\n typeof window !== \"undefined\" &&\n typeof document !== \"undefined\";\n \n const themes = {\n light: { bg: \"#fff\", color: \"#111\", border: \"1px solid #e5e7eb\" },\n dark: { bg: \"#1f2937\", color: \"#fff\", border: \"1px solid rgba(255,255,255,.08)\" }\n };\n \n const api = { \n _config: {},\n _queue: [],\n _showing: false,\n _theme: \"dark\",\n \n /* ===== PUBLIC API ===== */\n \n setup(cfg = {}) {\n this._config = cfg;\n this._registerTypes();\n },\n \n addType(name, cfg = {}) {\n this._config[name] = cfg;\n this._registerTypes();\n },\n \n defineTheme(name, styles = {}) {\n themes[name] = { ...(themes[name] || {}), ...styles };\n },\n \n setTheme(name) {\n this._theme = name;\n if (!isBrowser) return;\n const root = document.getElementById(\"juice-toast-root\");\n if (root) root.dataset.theme = name;\n },\n \n clear() {\n this._queue.length = 0;\n },\n \n destroy() {\n this.clear();\n if (!isBrowser) return;\n document.getElementById(\"juice-toast-root\")?.remove();\n },\n \n /* ===== INTERNAL ===== */\n \n _registerTypes() {\n Object.keys(this._config).forEach(type => {\n if (typeof this[type] === \"function\" && !this[type].__auto) return;\n const fn = payload => this._enqueue(type, payload);\n fn.__auto = true;\n this[type] = fn;\n });\n },\n \n _enqueue(type, payload) {\n this._queue.push({ type, payload });\n if (!this._showing) this._next();\n },\n \n _next() {\n if (!this._queue.length) {\n this._showing = false;\n return;\n }\n this._showing = true;\n const item = this._queue.shift();\n this._showToast(item.type, item.payload);\n },\n \n _getRoot(position) {\n if (!isBrowser) return null;\n let root = document.getElementById(\"juice-toast-root\");\n if (!root) {\n root = document.createElement(\"div\");\n root.id = \"juice-toast-root\";\n document.body.appendChild(root);\n }\n root.dataset.position = position || \"bottom\";\n root.dataset.theme = this._theme;\n return root;\n },\n \n _showToast(type, payload) {\n if (!isBrowser) return;\n \n const base = this._config[type] || {};\n const data =\n typeof payload === \"object\" ?\n payload :\n { message: String(payload) };\n \n const cfg = { ...base, ...data };\n \n /* BACKWARD COMPAT */\n cfg.icon = cfg.icon ?? cfg.icon_left_top;\n cfg.iconPack = cfg.iconPack ?? cfg.icon_config;\n cfg.iconLink = cfg.iconLink ?? cfg.icon_onClick_url;\n cfg.iconAnimate = cfg.iconAnimate ?? cfg.icon_onClick_animate;\n cfg.position = cfg.position ?? cfg.toast;\n cfg.closable = cfg.closable ?? cfg.closeable;\n \n const theme = themes[cfg.theme || this._theme] || {};\n \n const toast = document.createElement(\"div\");\n toast.className = \"juice-toast\";\n toast.style.background = cfg.bg || theme.bg;\n toast.style.color = cfg.color || theme.color;\n toast.style.border = cfg.border || theme.border;\n \n /* ICON */\n if (cfg.icon) {\n const icon = document.createElement(\"i\");\n icon.className = [\n \"icon\",\n cfg.iconPack || \"\",\n cfg.icon\n ].join(\" \").trim();\n \n if (cfg.iconLink || cfg.iconAnimate) {\n icon.classList.add(\"icon-clickable\");\n icon.onclick = e => {\n e.stopPropagation();\n if (cfg.iconAnimate) {\n icon.classList.remove(cfg.iconAnimate);\n void icon.offsetWidth;\n icon.classList.add(cfg.iconAnimate);\n }\n if (cfg.iconLink) {\n window.open(cfg.iconLink, \"_blank\", \"noopener\");\n }\n };\n }\n toast.appendChild(icon);\n }\n \n /* CONTENT */\n const content = document.createElement(\"div\");\n content.className = \"jt-content\";\n \n if (cfg.title) {\n const t = document.createElement(\"div\");\n t.className = \"jt-title\";\n t.textContent = cfg.title;\n content.appendChild(t);\n }\n \n const msg = document.createElement(\"div\");\n msg.className = \"jt-message\";\n msg.textContent = cfg.message || \"\";\n content.appendChild(msg);\n \n toast.appendChild(content);\n \n /* CLOSE */\n if (cfg.closable) {\n const close = document.createElement(\"span\");\n close.className = \"juice-toast-close\";\n close.innerHTML = \"\u00D7\";\n close.onclick = () => {\n toast.remove();\n this._next();\n };\n toast.appendChild(close);\n }\n \n const root = this._getRoot(cfg.position);\n root.appendChild(toast);\n \n requestAnimationFrame(() => toast.classList.add(\"show\"));\n \n const duration = cfg.duration ?? 2500;\n if (duration === 0) return;\n \n setTimeout(() => {\n toast.classList.remove(\"show\");\n setTimeout(() => {\n toast.remove();\n this._next();\n }, 300);\n }, duration);\n } \n};\n \n return api;\n })();\n});\n"],
5
- "mappings": "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",
6
- "names": ["root", "factory", "isBrowser", "themes", "cfg", "name", "styles", "_a", "type", "fn", "payload", "item", "position", "_b", "_c", "_d", "_e", "_f", "_g", "base", "data", "theme", "toast", "icon", "e", "content", "t", "msg", "close", "duration"]
7
- }