@wakastellar/ui 4.0.0-dev.0 → 4.0.1

package/dist/blocks/chat/index.es.js

@@ -0,0 +1,534 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.es.js";
+import { Avatar as t, AvatarFallback as n, AvatarImage as r } from "../../components/avatar/index.es.js";
+import { Badge as i } from "../../components/badge/index.es.js";
+import { Button as a } from "../../components/button/index.es.js";
+import { DropdownMenu as o, DropdownMenuContent as s, DropdownMenuItem as c, DropdownMenuTrigger as l } from "../../components/dropdown-menu/index.es.js";
+import { Input as u } from "../../components/input/index.es.js";
+import { ScrollArea as d } from "../../components/scroll-area/index.es.js";
+import { Textarea as f } from "../../components/textarea/index.es.js";
+import "./widget.es.js";
+import * as p from "react";
+import { Calendar as m, Check as h, CheckCheck as g, File as _, MessageCircle as v, Minimize2 as y, MoreVertical as b, Paperclip as x, Phone as S, Reply as C, Search as w, Send as T, Settings as E, Smile as D, Trash2 as O, Video as k, X as A } from "lucide-react";
+import { Fragment as j, jsx as M, jsxs as N } from "react/jsx-runtime";
+//#region src/blocks/chat/index.tsx
+var P = (e) => {
+	let t = typeof e == "string" ? new Date(e) : e, n = /* @__PURE__ */ new Date(), r = new Date(n.getFullYear(), n.getMonth(), n.getDate()), i = /* @__PURE__ */ new Date(r.getTime() - 1440 * 60 * 1e3), a = new Date(t.getFullYear(), t.getMonth(), t.getDate());
+	return a.getTime() === r.getTime() ? "Aujourd'hui" : a.getTime() === i.getTime() ? "Hier" : t.toLocaleDateString("fr-FR", {
+		weekday: "long",
+		day: "numeric",
+		month: "long"
+	});
+}, F = (e, t) => {
+	let n = typeof e == "string" ? new Date(e) : e, r = typeof t == "string" ? new Date(t) : t;
+	return n.getFullYear() === r.getFullYear() && n.getMonth() === r.getMonth() && n.getDate() === r.getDate();
+}, I = (e) => {
+	if (e.initials) return e.initials;
+	let t = e.name.split(" ");
+	return t.length >= 2 ? (t[0][0] + t[1][0]).toUpperCase() : e.name.substring(0, 2).toUpperCase();
+};
+function L({ date: e }) {
+	return /* @__PURE__ */ M("div", {
+		className: "flex items-center justify-center my-4",
+		children: /* @__PURE__ */ M("div", {
+			className: "px-3 py-1 text-xs text-muted-foreground bg-muted rounded-full",
+			children: P(e)
+		})
+	});
+}
+function R({ conversations: a, activeId: o, currentUser: s, onSelect: c, onSearch: l }) {
+	let [f, m] = p.useState(""), h = (e) => e.name ? e.name : e.participants.filter((e) => e.id !== s.id).map((e) => e.name).join(", "), g = (e) => {
+		if (e.avatar) return {
+			url: e.avatar,
+			fallback: e.name?.charAt(0) || "G"
+		};
+		if (e.isGroup) return { fallback: "G" };
+		let t = e.participants.find((e) => e.id !== s.id);
+		return {
+			url: t?.avatar,
+			fallback: I(t || {
+				id: "",
+				name: "?"
+			})
+		};
+	}, _ = (e) => {
+		if (!e) return "";
+		let t = typeof e == "string" ? new Date(e) : e, n = (/* @__PURE__ */ new Date()).getTime() - t.getTime(), r = Math.floor(n / (1e3 * 60 * 60 * 24));
+		return r === 0 ? t.toLocaleTimeString("fr-FR", {
+			hour: "2-digit",
+			minute: "2-digit"
+		}) : r === 1 ? "Hier" : r < 7 ? t.toLocaleDateString("fr-FR", { weekday: "short" }) : t.toLocaleDateString("fr-FR", {
+			day: "numeric",
+			month: "short"
+		});
+	}, v = a.filter((e) => f ? h(e).toLowerCase().includes(f.toLowerCase()) : !0);
+	return /* @__PURE__ */ N("div", {
+		className: "flex flex-col h-full border-r",
+		children: [/* @__PURE__ */ M("div", {
+			className: "p-3 border-b",
+			children: /* @__PURE__ */ N("div", {
+				className: "relative",
+				children: [/* @__PURE__ */ M(w, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" }), /* @__PURE__ */ M(u, {
+					placeholder: "Rechercher...",
+					value: f,
+					onChange: (e) => {
+						m(e.target.value), l?.(e.target.value);
+					},
+					className: "pl-9"
+				})]
+			})
+		}), /* @__PURE__ */ M(d, {
+			className: "flex-1",
+			children: v.map((a) => {
+				let l = g(a), u = h(a), d = a.participants.find((e) => e.id !== s.id);
+				return /* @__PURE__ */ N("button", {
+					onClick: () => c(a),
+					className: e("w-full flex items-center gap-3 p-3 hover:bg-muted/50 transition-colors text-left", o === a.id && "bg-muted"),
+					children: [/* @__PURE__ */ N("div", {
+						className: "relative",
+						children: [/* @__PURE__ */ N(t, { children: [/* @__PURE__ */ M(r, { src: l.url }), /* @__PURE__ */ M(n, { children: l.fallback })] }), d?.status === "online" && /* @__PURE__ */ M("div", { className: "absolute bottom-0 right-0 h-3 w-3 rounded-full bg-green-500 border-2 border-background" })]
+					}), /* @__PURE__ */ N("div", {
+						className: "flex-1 min-w-0",
+						children: [/* @__PURE__ */ N("div", {
+							className: "flex items-center justify-between",
+							children: [/* @__PURE__ */ M("span", {
+								className: "font-medium text-sm truncate",
+								children: u
+							}), /* @__PURE__ */ M("span", {
+								className: "text-xs text-muted-foreground",
+								children: _(a.lastMessage?.timestamp)
+							})]
+						}), /* @__PURE__ */ N("div", {
+							className: "flex items-center justify-between",
+							children: [/* @__PURE__ */ M("p", {
+								className: "text-xs text-muted-foreground truncate",
+								children: a.lastMessage?.content || "Aucun message"
+							}), a.unreadCount && a.unreadCount > 0 && /* @__PURE__ */ M(i, {
+								className: "h-5 min-w-[20px] justify-center",
+								children: a.unreadCount
+							})]
+						})]
+					})]
+				}, a.id);
+			})
+		})]
+	});
+}
+function z({ conversation: i, currentUser: u, title: d, statusText: f, showStatus: p = !0, showCloseButton: h, onAudioCall: g, onVideoCall: _, onClose: x, onCloseConversation: C, onMinimize: w, layout: T }) {
+	let D = i?.participants.find((e) => e.id !== u.id), O = d || i?.name || D?.name || "Messages", j = () => f || (i ? i.isGroup ? `${i.participants.length} participants` : D?.status === "online" ? "En ligne" : D?.lastSeen ? `Vu ${(typeof D.lastSeen == "string" ? new Date(D.lastSeen) : D.lastSeen).toLocaleString("fr-FR")}` : "Hors ligne" : ""), P = T === "floating" || T === "widget";
+	return /* @__PURE__ */ N("div", {
+		className: e("flex items-center justify-between p-3 border-b", P && "bg-primary text-primary-foreground rounded-t-lg"),
+		children: [/* @__PURE__ */ N("div", {
+			className: "flex items-center gap-3",
+			children: [
+				i && /* @__PURE__ */ N(t, {
+					className: e(P && "border-2 border-primary-foreground/20"),
+					children: [/* @__PURE__ */ M(r, { src: i.avatar || D?.avatar }), /* @__PURE__ */ M(n, {
+						className: e(P && "bg-primary-foreground/20 text-primary-foreground"),
+						children: I(D || {
+							id: "",
+							name: O
+						})
+					})]
+				}),
+				!i && /* @__PURE__ */ M(v, { className: "h-5 w-5" }),
+				/* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("h3", {
+					className: "font-semibold text-sm",
+					children: O
+				}), p && /* @__PURE__ */ N("div", {
+					className: "flex items-center gap-1.5",
+					children: [
+						D?.status === "online" && /* @__PURE__ */ M("div", { className: e("h-2 w-2 rounded-full", P ? "bg-green-400" : "bg-green-500") }),
+						D?.status === "offline" && /* @__PURE__ */ M("div", { className: e("h-2 w-2 rounded-full", P ? "bg-gray-400" : "bg-gray-500") }),
+						/* @__PURE__ */ M("p", {
+							className: e("text-xs", P ? "text-primary-foreground/80" : "text-muted-foreground"),
+							children: j()
+						})
+					]
+				})] })
+			]
+		}), /* @__PURE__ */ N("div", {
+			className: "flex items-center gap-1",
+			children: [
+				g && !P && /* @__PURE__ */ M(a, {
+					variant: "ghost",
+					size: "icon",
+					onClick: g,
+					children: /* @__PURE__ */ M(S, { className: "h-4 w-4" })
+				}),
+				_ && !P && /* @__PURE__ */ M(a, {
+					variant: "ghost",
+					size: "icon",
+					onClick: _,
+					children: /* @__PURE__ */ M(k, { className: "h-4 w-4" })
+				}),
+				h && C && /* @__PURE__ */ N(a, {
+					variant: P ? "ghost" : "outline",
+					size: "sm",
+					onClick: C,
+					className: e(P && "text-primary-foreground hover:bg-primary-foreground/20"),
+					children: [/* @__PURE__ */ M(m, { className: "h-4 w-4 mr-1.5" }), "Clôturer"]
+				}),
+				w && P && /* @__PURE__ */ M(a, {
+					variant: "ghost",
+					size: "icon",
+					onClick: w,
+					className: "text-primary-foreground hover:bg-primary-foreground/20",
+					children: /* @__PURE__ */ M(y, { className: "h-4 w-4" })
+				}),
+				x && P && /* @__PURE__ */ M(a, {
+					variant: "ghost",
+					size: "icon",
+					onClick: x,
+					className: "text-primary-foreground hover:bg-primary-foreground/20",
+					children: /* @__PURE__ */ M(A, { className: "h-4 w-4" })
+				}),
+				!P && /* @__PURE__ */ N(o, { children: [/* @__PURE__ */ M(l, {
+					asChild: !0,
+					children: /* @__PURE__ */ M(a, {
+						variant: "ghost",
+						size: "icon",
+						children: /* @__PURE__ */ M(b, { className: "h-4 w-4" })
+					})
+				}), /* @__PURE__ */ M(s, {
+					align: "end",
+					children: /* @__PURE__ */ N(c, { children: [/* @__PURE__ */ M(E, { className: "mr-2 h-4 w-4" }), "Paramètres"] })
+				})] })
+			]
+		})]
+	});
+}
+function B({ message: i, isOwn: o, showStatus: s, showTimestamp: c, onDelete: l, onReply: u }) {
+	return /* @__PURE__ */ N("div", {
+		className: e("flex gap-2 group", o ? "flex-row-reverse" : "flex-row"),
+		children: [!o && /* @__PURE__ */ N(t, {
+			className: "h-8 w-8",
+			children: [/* @__PURE__ */ M(r, { src: i.sender.avatar }), /* @__PURE__ */ M(n, {
+				className: "text-xs",
+				children: I(i.sender)
+			})]
+		}), /* @__PURE__ */ N("div", {
+			className: e("max-w-[70%]", o && "items-end"),
+			children: [
+				i.replyTo && /* @__PURE__ */ N("div", {
+					className: "text-xs text-muted-foreground mb-1 p-2 bg-muted/50 rounded border-l-2 border-primary",
+					children: [/* @__PURE__ */ M("span", {
+						className: "font-medium",
+						children: i.replyTo.sender.name
+					}), /* @__PURE__ */ M("p", {
+						className: "truncate",
+						children: i.replyTo.content
+					})]
+				}),
+				/* @__PURE__ */ N("div", {
+					className: e("relative rounded-2xl px-4 py-2", o ? "bg-primary text-primary-foreground rounded-tr-sm" : "bg-muted rounded-tl-sm"),
+					children: [
+						i.attachments && i.attachments.length > 0 && /* @__PURE__ */ M("div", {
+							className: "space-y-2 mb-2",
+							children: i.attachments.map((e, t) => /* @__PURE__ */ M("div", { children: e.type === "image" ? /* @__PURE__ */ M("img", {
+								src: e.url,
+								alt: e.name,
+								className: "rounded-lg max-w-full"
+							}) : /* @__PURE__ */ N("div", {
+								className: "flex items-center gap-2 p-2 bg-background/10 rounded",
+								children: [/* @__PURE__ */ M(_, { className: "h-4 w-4" }), /* @__PURE__ */ M("span", {
+									className: "text-sm truncate",
+									children: e.name
+								})]
+							}) }, t))
+						}),
+						/* @__PURE__ */ M("p", {
+							className: "text-sm whitespace-pre-wrap break-words",
+							children: i.content
+						}),
+						/* @__PURE__ */ N("div", {
+							className: e("absolute top-0 opacity-0 group-hover:opacity-100 transition-opacity flex items-center gap-1", o ? "-left-20" : "-right-20"),
+							children: [/* @__PURE__ */ M(a, {
+								variant: "ghost",
+								size: "icon",
+								className: "h-7 w-7",
+								onClick: () => u?.(i),
+								children: /* @__PURE__ */ M(C, { className: "h-3 w-3" })
+							}), o && l && /* @__PURE__ */ M(a, {
+								variant: "ghost",
+								size: "icon",
+								className: "h-7 w-7",
+								onClick: () => l(i.id),
+								children: /* @__PURE__ */ M(O, { className: "h-3 w-3" })
+							})]
+						})
+					]
+				}),
+				/* @__PURE__ */ N("div", {
+					className: e("flex items-center gap-1 mt-1 text-xs text-muted-foreground", o && "justify-end"),
+					children: [
+						c && /* @__PURE__ */ M("span", { children: ((e) => (typeof e == "string" ? new Date(e) : e).toLocaleTimeString("fr-FR", {
+							hour: "2-digit",
+							minute: "2-digit"
+						}))(i.timestamp) }),
+						i.isEdited && /* @__PURE__ */ M("span", { children: "(modifié)" }),
+						o && s && (() => {
+							switch (i.status) {
+								case "sending": return /* @__PURE__ */ M("div", { className: "h-3 w-3 rounded-full border-2 border-current animate-pulse" });
+								case "sent": return /* @__PURE__ */ M(h, { className: "h-3 w-3" });
+								case "delivered": return /* @__PURE__ */ M(g, { className: "h-3 w-3" });
+								case "read": return /* @__PURE__ */ M(g, { className: "h-3 w-3 text-blue-500" });
+								case "error": return /* @__PURE__ */ M(A, { className: "h-3 w-3 text-red-500" });
+								default: return null;
+							}
+						})()
+					]
+				})
+			]
+		})]
+	});
+}
+function V({ onSend: e, replyTo: t, onCancelReply: n, showAttachments: r, showEmoji: i, placeholder: o, sending: s, showHint: c = !0, hintText: l = "Appuyez sur Entrée pour envoyer, Maj+Entrée pour un saut de ligne" }) {
+	let [u, d] = p.useState(""), m = p.useRef(null), h = () => {
+		u.trim() && !s && (e(u.trim()), d(""));
+	};
+	return p.useEffect(() => {
+		m.current && (m.current.style.height = "auto", m.current.style.height = Math.min(m.current.scrollHeight, 120) + "px");
+	}, [u]), /* @__PURE__ */ N("div", {
+		className: "border-t p-3",
+		children: [
+			t && /* @__PURE__ */ N("div", {
+				className: "flex items-center justify-between mb-2 p-2 bg-muted rounded text-sm",
+				children: [/* @__PURE__ */ N("div", {
+					className: "flex items-center gap-2",
+					children: [/* @__PURE__ */ M(C, { className: "h-4 w-4 text-primary" }), /* @__PURE__ */ N("div", { children: [/* @__PURE__ */ M("span", {
+						className: "font-medium",
+						children: t.sender.name
+					}), /* @__PURE__ */ M("p", {
+						className: "text-muted-foreground truncate",
+						children: t.content
+					})] })]
+				}), /* @__PURE__ */ M(a, {
+					variant: "ghost",
+					size: "icon",
+					className: "h-6 w-6",
+					onClick: n,
+					children: /* @__PURE__ */ M(A, { className: "h-4 w-4" })
+				})]
+			}),
+			/* @__PURE__ */ N("div", {
+				className: "flex items-end gap-2",
+				children: [
+					r && /* @__PURE__ */ M(a, {
+						variant: "ghost",
+						size: "icon",
+						className: "flex-shrink-0",
+						children: /* @__PURE__ */ M(x, { className: "h-4 w-4" })
+					}),
+					/* @__PURE__ */ M(f, {
+						ref: m,
+						value: u,
+						onChange: (e) => d(e.target.value),
+						onKeyDown: (e) => {
+							e.key === "Enter" && !e.shiftKey && (e.preventDefault(), h());
+						},
+						placeholder: o,
+						className: "flex-1 min-h-[40px] max-h-[120px] resize-none",
+						disabled: s,
+						rows: 1
+					}),
+					i && /* @__PURE__ */ M(a, {
+						variant: "ghost",
+						size: "icon",
+						className: "flex-shrink-0",
+						children: /* @__PURE__ */ M(D, { className: "h-4 w-4" })
+					}),
+					/* @__PURE__ */ M(a, {
+						onClick: h,
+						disabled: !u.trim() || s,
+						size: "icon",
+						className: "flex-shrink-0 rounded-full",
+						children: /* @__PURE__ */ M(T, { className: "h-4 w-4" })
+					})
+				]
+			}),
+			c && /* @__PURE__ */ M("p", {
+				className: "text-xs text-muted-foreground mt-2",
+				children: l
+			})
+		]
+	});
+}
+function H({ conversations: t = [], activeConversation: n, messages: r, currentUser: a, onSendMessage: o, onConversationSelect: s, onMessageDelete: c, onMessageReply: l, onSearch: u, onAudioCall: f, onVideoCall: m, onClose: h, onCloseConversation: g, onMinimize: _, showConversationList: y = !0, showHeader: b = !0, showMessageStatus: x = !0, showTimestamps: S = !0, showAttachments: C = !0, showEmoji: w = !0, showDateSeparators: T = !0, showInputHint: E = !0, showCloseButton: D = !1, inputPlaceholder: O, inputHintText: k, sending: A = !1, loading: P = !1, layout: I = "full", headerTitle: H, showHeaderStatus: U = !0, statusText: W, minimized: G = !1, className: K }) {
+	let [q, J] = p.useState(null), Y = p.useRef(null);
+	p.useEffect(() => {
+		Y.current?.scrollIntoView({ behavior: "smooth" });
+	}, [r]);
+	let X = (e, t) => {
+		o?.(e, t), J(null);
+	}, Z = (e) => {
+		J(e), l?.(e);
+	};
+	return (I === "floating" || I === "widget") && G ? /* @__PURE__ */ N("button", {
+		onClick: _,
+		className: e("flex items-center gap-3 p-3 bg-primary text-primary-foreground rounded-full shadow-lg hover:shadow-xl transition-shadow", K),
+		children: [
+			/* @__PURE__ */ M(v, { className: "h-5 w-5" }),
+			/* @__PURE__ */ M("span", {
+				className: "font-medium",
+				children: "Messages"
+			}),
+			t.reduce((e, t) => e + (t.unreadCount || 0), 0) > 0 && /* @__PURE__ */ M(i, {
+				variant: "secondary",
+				className: "bg-white text-primary",
+				children: t.reduce((e, t) => e + (t.unreadCount || 0), 0)
+			})
+		]
+	}) : /* @__PURE__ */ N("div", {
+		className: e("flex bg-background overflow-hidden", {
+			full: "h-screen",
+			embedded: "h-[600px]",
+			floating: "h-[500px] w-[400px] rounded-lg shadow-xl border",
+			widget: "h-[500px] w-[350px] rounded-lg shadow-2xl border"
+		}[I], K),
+		children: [y && I !== "widget" && I !== "floating" && /* @__PURE__ */ M("div", {
+			className: "w-80 flex-shrink-0",
+			children: /* @__PURE__ */ M(R, {
+				conversations: t,
+				activeId: n?.id,
+				currentUser: a,
+				onSelect: (e) => s?.(e),
+				onSearch: u
+			})
+		}), /* @__PURE__ */ M("div", {
+			className: "flex-1 flex flex-col min-w-0",
+			children: n || I === "widget" || I === "floating" ? /* @__PURE__ */ N(j, { children: [
+				b && /* @__PURE__ */ M(z, {
+					conversation: n,
+					currentUser: a,
+					title: H,
+					statusText: W,
+					showStatus: U,
+					showCloseButton: D,
+					onAudioCall: f,
+					onVideoCall: m,
+					onClose: h,
+					onCloseConversation: g,
+					onMinimize: _,
+					layout: I
+				}),
+				/* @__PURE__ */ M(d, {
+					className: "flex-1 p-4",
+					children: /* @__PURE__ */ N("div", {
+						className: "space-y-4",
+						children: [P ? /* @__PURE__ */ M("div", {
+							className: "flex items-center justify-center py-8",
+							children: /* @__PURE__ */ M("div", { className: "animate-spin rounded-full h-8 w-8 border-b-2 border-primary" })
+						}) : (() => {
+							let e = [], t = null;
+							return r.forEach((n, r) => {
+								let i = typeof n.timestamp == "string" ? new Date(n.timestamp) : n.timestamp;
+								T && (!t || !F(t, i)) && (e.push(/* @__PURE__ */ M(L, { date: i }, `separator-${r}`)), t = i), e.push(/* @__PURE__ */ M(B, {
+									message: n,
+									isOwn: n.sender.id === a.id,
+									showStatus: x,
+									showTimestamp: S,
+									onDelete: c,
+									onReply: Z
+								}, n.id));
+							}), e;
+						})(), /* @__PURE__ */ M("div", { ref: Y })]
+					})
+				}),
+				/* @__PURE__ */ M(V, {
+					onSend: X,
+					replyTo: q,
+					onCancelReply: () => J(null),
+					showAttachments: C,
+					showEmoji: w,
+					placeholder: (() => {
+						if (O) return O;
+						if (n) {
+							let e = n.participants.find((e) => e.id !== a.id);
+							if (e) return `Écrire à ${e.name}...`;
+						}
+						return "Écrivez votre message...";
+					})(),
+					sending: A,
+					showHint: E,
+					hintText: k
+				})
+			] }) : /* @__PURE__ */ M("div", {
+				className: "flex-1 flex items-center justify-center text-muted-foreground",
+				children: /* @__PURE__ */ N("div", {
+					className: "text-center",
+					children: [/* @__PURE__ */ M(v, { className: "h-12 w-12 mx-auto mb-4 opacity-50" }), /* @__PURE__ */ M("p", { children: "Sélectionnez une conversation" })]
+				})
+			})
+		})]
+	});
+}
+var U = {
+	id: "current",
+	name: "Moi",
+	status: "online"
+}, W = [{
+	id: "1",
+	participants: [U, {
+		id: "2",
+		name: "Marie Dupont",
+		status: "online"
+	}],
+	lastMessage: {
+		id: "m1",
+		content: "D'accord, je m'en occupe !",
+		sender: {
+			id: "2",
+			name: "Marie Dupont"
+		},
+		timestamp: /* @__PURE__ */ new Date(Date.now() - 1e3 * 60 * 5),
+		status: "read"
+	},
+	unreadCount: 0
+}, {
+	id: "2",
+	participants: [U, {
+		id: "3",
+		name: "Pierre Martin",
+		status: "offline"
+	}],
+	lastMessage: {
+		id: "m2",
+		content: "On se voit demain ?",
+		sender: U,
+		timestamp: /* @__PURE__ */ new Date(Date.now() - 1e3 * 60 * 60),
+		status: "delivered"
+	},
+	unreadCount: 2
+}], G = [
+	{
+		id: "1",
+		content: "Salut ! Comment ça va ?",
+		sender: {
+			id: "2",
+			name: "Marie Dupont"
+		},
+		timestamp: /* @__PURE__ */ new Date(Date.now() - 1e3 * 60 * 30),
+		status: "read"
+	},
+	{
+		id: "2",
+		content: "Ça va bien merci ! Et toi ?",
+		sender: U,
+		timestamp: /* @__PURE__ */ new Date(Date.now() - 1e3 * 60 * 25),
+		status: "read"
+	},
+	{
+		id: "3",
+		content: "Super ! Tu as vu le nouveau projet ?",
+		sender: {
+			id: "2",
+			name: "Marie Dupont"
+		},
+		timestamp: /* @__PURE__ */ new Date(Date.now() - 1e3 * 60 * 20),
+		status: "read"
+	}
+];
+//#endregion
+export { H as default, W as defaultChatConversations, G as defaultChatMessages, U as defaultChatUser };

package/dist/blocks/chat/widget.cjs.js

@@ -0,0 +1 @@
+"use client";"use client";const e=require(`../../_virtual/_rolldown/runtime.cjs.js`),t=require(`../../utils/cn.cjs.js`),n=require(`../../components/badge/index.cjs.js`),r=require(`./index.cjs.js`);let i=require(`react`);i=e.__toESM(i);let a=require(`lucide-react`),o=require(`react/jsx-runtime`);var s=`waka-chat-widget-position`,c=e=>{if(typeof window>`u`)return null;try{let t=localStorage.getItem(e);if(t)return JSON.parse(t)}catch{}return null},l=(e,t)=>{if(!(typeof window>`u`))try{localStorage.setItem(e,JSON.stringify(t))}catch{}};function u({defaultPosition:e,position:u,onPositionChange:d,persistPosition:f=!0,positionStorageKey:p=s,defaultOpen:m=!1,open:h,onOpenChange:g,bubbleSize:_=`md`,bubbleColor:v=`primary`,bubbleIcon:y,bubbleText:b,showUnreadBadge:x=!0,bubbleAnimation:S=`none`,widgetPosition:C=`top-left`,widgetSize:w=`md`,bubbleClassName:T,widgetClassName:E,draggable:D=!0,constrainToViewport:O=!0,edgeOffset:k=16,onWidgetClose:A,onWidgetMinimize:j,zIndex:M=9999,conversations:N=[],...P}){let[F,I]=i.useState(m),[ee,L]=i.useState(()=>{if(e)return e;if(f){let e=c(p);if(e)return e}return{x:typeof window<`u`?window.innerWidth-80:0,y:typeof window<`u`?window.innerHeight-80:0}}),[R,z]=i.useState(!1),[B,V]=i.useState({x:0,y:0}),H=i.useRef(null),U=h===void 0?F:h,W=u===void 0?ee:u;i.useEffect(()=>{!(typeof window>`u`)&&!u&&!e&&L((f?c(p):null)||{x:window.innerWidth-80,y:window.innerHeight-80})},[u,e,f,p]);let G=e=>{h===void 0&&I(e),g?.(e)},K=e=>{u===void 0&&L(e),d?.(e),f&&l(p,e)},q=e=>{if(!O||typeof window>`u`)return e;let t=H.current?.offsetWidth||60,n=H.current?.offsetHeight||60;return{x:Math.max(k,Math.min(e.x,window.innerWidth-t-k)),y:Math.max(k,Math.min(e.y,window.innerHeight-n-k))}},J=e=>{!D||U||(z(!0),V({x:e.clientX-W.x,y:e.clientY-W.y}))},Y=e=>{if(!D||U)return;let t=e.touches[0];z(!0),V({x:t.clientX-W.x,y:t.clientY-W.y})};i.useEffect(()=>{if(!R)return;let e=e=>{K(q({x:e.clientX-B.x,y:e.clientY-B.y}))},t=e=>{let t=e.touches[0];K(q({x:t.clientX-B.x,y:t.clientY-B.y}))},n=()=>{z(!1)};return document.addEventListener(`mousemove`,e),document.addEventListener(`mouseup`,n),document.addEventListener(`touchmove`,t),document.addEventListener(`touchend`,n),()=>{document.removeEventListener(`mousemove`,e),document.removeEventListener(`mouseup`,n),document.removeEventListener(`touchmove`,t),document.removeEventListener(`touchend`,n)}},[R,B]);let X=()=>{R||G(!U)},Z=N.reduce((e,t)=>e+(t.unreadCount||0),0),Q={sm:`h-12 w-12`,md:`h-14 w-14`,lg:`h-16 w-16`},te={sm:`h-5 w-5`,md:`h-6 w-6`,lg:`h-7 w-7`},ne={primary:`bg-primary text-primary-foreground hover:bg-primary/90`,secondary:`bg-secondary text-secondary-foreground hover:bg-secondary/90`,success:`bg-green-500 text-white hover:bg-green-600`,warning:`bg-yellow-500 text-white hover:bg-yellow-600`,destructive:`bg-destructive text-destructive-foreground hover:bg-destructive/90`},re={none:``,pulse:`animate-pulse`,bounce:`animate-bounce`},$={sm:`h-[400px] w-[300px]`,md:`h-[500px] w-[380px]`,lg:`h-[600px] w-[420px]`};return(0,o.jsxs)(o.Fragment,{children:[(0,o.jsxs)(`button`,{ref:H,onClick:X,onMouseDown:J,onTouchStart:Y,className:t.cn(`fixed rounded-full shadow-lg transition-all duration-200`,`flex items-center justify-center gap-2`,Q[_],ne[v],re[S],R&&`cursor-grabbing scale-110`,D&&!R&&!U&&`cursor-grab`,U&&`opacity-0 pointer-events-none scale-75`,b&&`px-4 w-auto`,T),style:{left:W.x,top:W.y,zIndex:M,touchAction:`none`},"aria-label":`Ouvrir le chat`,children:[y||(0,o.jsx)(a.MessageCircle,{className:te[_]}),b&&(0,o.jsx)(`span`,{className:`font-medium text-sm`,children:b}),x&&Z>0&&(0,o.jsx)(n.Badge,{className:t.cn(`absolute -top-1 -right-1 h-5 min-w-[20px] px-1.5`,`bg-destructive text-destructive-foreground`,`flex items-center justify-center text-xs font-bold`),children:Z>99?`99+`:Z})]}),U&&(0,o.jsx)(`div`,{className:t.cn(`fixed rounded-xl shadow-2xl border bg-background overflow-hidden`,`animate-in fade-in-0 zoom-in-95 slide-in-from-bottom-2`,`duration-200`,$[w],E),style:(()=>{let e=H.current?.offsetWidth||60,t=H.current?.offsetHeight||60,n=$[w].match(/h-\[(\d+)px\] w-\[(\d+)px\]/),r=n?parseInt(n[1]):500,i=n?parseInt(n[2]):380,a=W.x,o=W.y;switch(C){case`top-left`:a=W.x-i+e,o=W.y-r-12;break;case`top-right`:o=W.y-r-12;break;case`bottom-left`:a=W.x-i+e,o=W.y+t+12;break;case`bottom-right`:o=W.y+t+12;break}return typeof window<`u`&&(a=Math.max(k,Math.min(a,window.innerWidth-i-k)),o=Math.max(k,Math.min(o,window.innerHeight-r-k))),{position:`fixed`,left:a,top:o,zIndex:M+1}})(),children:(0,o.jsx)(r.default,{...P,conversations:N,layout:`widget`,onClose:()=>{G(!1),A?.()},onMinimize:()=>{G(!1),j?.()},showCloseButton:!0,className:`h-full`})}),U&&(0,o.jsx)(`div`,{className:`fixed inset-0 bg-black/20 sm:hidden`,style:{zIndex:M-1},onClick:()=>G(!1)})]})}function d(e={}){let{defaultOpen:t=!1,defaultPosition:n,persistPosition:r=!0,positionStorageKey:a=s}=e,[o,u]=i.useState(t),[d,f]=i.useState(()=>{if(n)return n;if(typeof window>`u`)return{x:0,y:0};if(r){let e=c(a);if(e)return e}return{x:window.innerWidth-80,y:window.innerHeight-80}}),p=()=>u(!0),m=()=>u(!1),h=()=>u(e=>!e),g=e=>{f(e),r&&l(a,e)};return{isOpen:o,position:d,open:p,close:m,toggle:h,setIsOpen:u,updatePosition:g,resetPosition:()=>{typeof window>`u`||g(n||{x:window.innerWidth-80,y:window.innerHeight-80})},widgetProps:{open:o,onOpenChange:u,position:d,onPositionChange:g}}}exports.default=u,exports.useChatWidget=d;