@wakastellar/ui 4.0.0 → 4.1.1

package/dist/components/waka-chat-bubble/index.es.js

@@ -0,0 +1,472 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.es.js";
+import * as t from "react";
+import { AlertCircle as n, Check as r, CheckCheck as i, Clock as a, FileText as o, Image as s, MoreVertical as c, Pencil as l, RefreshCw as u, Reply as d, Smile as f, Trash2 as p, X as m } from "lucide-react";
+import { cva as h } from "class-variance-authority";
+import { jsx as g, jsxs as _ } from "react/jsx-runtime";
+//#region src/components/waka-chat-bubble/index.tsx
+var v = h("relative rounded-2xl px-4 py-2.5 max-w-[85%] break-words transition-all", {
+	variants: {
+		variant: {
+			default: "",
+			minimal: "shadow-none",
+			elevated: "shadow-lg"
+		},
+		isSent: {
+			true: "bg-primary text-primary-foreground ml-auto rounded-br-md",
+			false: "bg-muted text-foreground mr-auto rounded-bl-md"
+		}
+	},
+	defaultVariants: {
+		variant: "default",
+		isSent: !1
+	}
+}), y = h("h-3.5 w-3.5", { variants: { status: {
+	sending: "text-muted-foreground animate-pulse",
+	sent: "text-muted-foreground",
+	delivered: "text-muted-foreground",
+	read: "text-blue-500",
+	failed: "text-destructive"
+} } });
+function b(e, t) {
+	let n = typeof e == "string" ? new Date(e) : e;
+	if (t === "relative") {
+		let e = (/* @__PURE__ */ new Date()).getTime() - n.getTime(), t = Math.floor(e / 6e4), r = Math.floor(e / 36e5), i = Math.floor(e / 864e5);
+		return t < 1 ? "Just now" : t < 60 ? `${t}m ago` : r < 24 ? `${r}h ago` : i < 7 ? `${i}d ago` : n.toLocaleDateString();
+	}
+	return t === "datetime" ? n.toLocaleString(void 0, {
+		month: "short",
+		day: "numeric",
+		hour: "numeric",
+		minute: "2-digit"
+	}) : n.toLocaleTimeString(void 0, {
+		hour: "numeric",
+		minute: "2-digit"
+	});
+}
+function x(e) {
+	let t = e.trim();
+	return /^[\p{Emoji}\p{Emoji_Modifier}\p{Emoji_Component}\p{Emoji_Modifier_Base}\p{Emoji_Presentation}\s]+$/u.test(t) && t.length <= 12;
+}
+function S(e) {
+	return e ? e < 1024 ? `${e} B` : e < 1024 * 1024 ? `${(e / 1024).toFixed(1)} KB` : `${(e / (1024 * 1024)).toFixed(1)} MB` : "";
+}
+function C({ user: t, size: n = "default", className: r }) {
+	return /* @__PURE__ */ g("div", {
+		className: e("flex-shrink-0 rounded-full overflow-hidden bg-muted flex items-center justify-center", n === "sm" ? "h-6 w-6 text-xs" : "h-8 w-8 text-sm", r),
+		children: t?.avatar ? /* @__PURE__ */ g("img", {
+			src: t.avatar,
+			alt: t.name,
+			className: "h-full w-full object-cover"
+		}) : /* @__PURE__ */ g("span", {
+			className: "font-medium text-muted-foreground",
+			children: t?.initials ?? t?.name?.slice(0, 2).toUpperCase() ?? "?"
+		})
+	});
+}
+function w({ status: t, readReceipt: o }) {
+	if (t === "sending") return /* @__PURE__ */ g(a, { className: e(y({ status: "sending" })) });
+	if (t === "failed") return /* @__PURE__ */ g(n, { className: e(y({ status: "failed" })) });
+	let s = o ?? (t === "delivered" ? "delivered" : "sent");
+	return s === "read" ? /* @__PURE__ */ g(i, { className: e(y({ status: "read" })) }) : s === "delivered" ? /* @__PURE__ */ g(i, { className: e(y({ status: "delivered" })) }) : /* @__PURE__ */ g(r, { className: e(y({ status: "sent" })) });
+}
+function ee({ reaction: t, onClick: n, isSent: r }) {
+	return /* @__PURE__ */ _("button", {
+		type: "button",
+		onClick: n,
+		className: e("inline-flex items-center gap-1 px-2 py-0.5 rounded-full text-xs font-medium transition-colors", t.reacted ? "bg-primary/20 text-primary border border-primary/30" : r ? "bg-primary-foreground/20 text-primary-foreground/80 hover:bg-primary-foreground/30" : "bg-background border border-border hover:bg-muted"),
+		children: [/* @__PURE__ */ g("span", { children: t.emoji }), /* @__PURE__ */ g("span", { children: t.count })]
+	});
+}
+function te({ attachment: t, onClick: n, isSent: r }) {
+	return t.type === "image" ? /* @__PURE__ */ g("button", {
+		type: "button",
+		onClick: n,
+		className: "relative rounded-lg overflow-hidden max-w-[280px] cursor-pointer hover:opacity-90 transition-opacity",
+		children: /* @__PURE__ */ g("img", {
+			src: t.thumbnail ?? t.url,
+			alt: t.name,
+			className: "max-h-[200px] object-cover",
+			style: { width: t.width ? Math.min(t.width, 280) : "auto" }
+		})
+	}) : /* @__PURE__ */ _("button", {
+		type: "button",
+		onClick: n,
+		className: e("flex items-center gap-3 p-3 rounded-lg transition-colors max-w-[280px]", r ? "bg-primary-foreground/10 hover:bg-primary-foreground/20" : "bg-background/50 hover:bg-background/80"),
+		children: [/* @__PURE__ */ g("div", {
+			className: e("flex-shrink-0 h-10 w-10 rounded-lg flex items-center justify-center", r ? "bg-primary-foreground/20" : "bg-muted"),
+			children: t.type === "video" ? /* @__PURE__ */ g(s, { className: "h-5 w-5" }) : /* @__PURE__ */ g(o, { className: "h-5 w-5" })
+		}), /* @__PURE__ */ _("div", {
+			className: "min-w-0 flex-1 text-left",
+			children: [/* @__PURE__ */ g("p", {
+				className: "text-sm font-medium truncate",
+				children: t.name
+			}), t.size && /* @__PURE__ */ g("p", {
+				className: e("text-xs", r ? "text-primary-foreground/70" : "text-muted-foreground"),
+				children: S(t.size)
+			})]
+		})]
+	});
+}
+function ne({ preview: t, onClick: n, isSent: r }) {
+	return /* @__PURE__ */ _("button", {
+		type: "button",
+		onClick: n,
+		className: e("flex flex-col rounded-lg overflow-hidden max-w-[280px] text-left transition-colors", r ? "bg-primary-foreground/10 hover:bg-primary-foreground/20" : "bg-background/50 hover:bg-background/80 border border-border"),
+		children: [t.image && /* @__PURE__ */ g("div", {
+			className: "relative h-32 w-full overflow-hidden",
+			children: /* @__PURE__ */ g("img", {
+				src: t.image,
+				alt: "",
+				className: "h-full w-full object-cover"
+			})
+		}), /* @__PURE__ */ _("div", {
+			className: "p-3",
+			children: [
+				/* @__PURE__ */ _("div", {
+					className: "flex items-center gap-2 mb-1",
+					children: [t.favicon && /* @__PURE__ */ g("img", {
+						src: t.favicon,
+						alt: "",
+						className: "h-4 w-4"
+					}), t.siteName && /* @__PURE__ */ g("span", {
+						className: e("text-xs", r ? "text-primary-foreground/70" : "text-muted-foreground"),
+						children: t.siteName
+					})]
+				}),
+				/* @__PURE__ */ g("p", {
+					className: "text-sm font-medium line-clamp-2",
+					children: t.title
+				}),
+				t.description && /* @__PURE__ */ g("p", {
+					className: e("text-xs mt-1 line-clamp-2", r ? "text-primary-foreground/70" : "text-muted-foreground"),
+					children: t.description
+				})
+			]
+		})]
+	});
+}
+function re({ onReply: n, onEdit: r, onDelete: i, onAddReaction: a, isSent: o, isOpen: s, onOpenChange: u }) {
+	let m = t.useRef(null);
+	return t.useEffect(() => {
+		function e(e) {
+			m.current && !m.current.contains(e.target) && u(!1);
+		}
+		if (s) return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
+	}, [s, u]), /* @__PURE__ */ _("div", {
+		className: "relative",
+		ref: m,
+		children: [/* @__PURE__ */ g("button", {
+			type: "button",
+			onClick: () => u(!s),
+			className: e("p-1.5 rounded-full transition-colors", o ? "hover:bg-primary-foreground/20 text-primary-foreground/70" : "hover:bg-muted text-muted-foreground"),
+			children: /* @__PURE__ */ g(c, { className: "h-4 w-4" })
+		}), s && /* @__PURE__ */ _("div", {
+			className: e("absolute z-50 min-w-[140px] rounded-lg border bg-popover p-1 shadow-lg animate-in fade-in-0 zoom-in-95", o ? "right-0" : "left-0"),
+			children: [
+				a && /* @__PURE__ */ _("button", {
+					type: "button",
+					onClick: () => {
+						a(), u(!1);
+					},
+					className: "flex items-center gap-2 w-full px-3 py-2 text-sm rounded-md hover:bg-muted transition-colors",
+					children: [/* @__PURE__ */ g(f, { className: "h-4 w-4" }), "React"]
+				}),
+				n && /* @__PURE__ */ _("button", {
+					type: "button",
+					onClick: () => {
+						n(), u(!1);
+					},
+					className: "flex items-center gap-2 w-full px-3 py-2 text-sm rounded-md hover:bg-muted transition-colors",
+					children: [/* @__PURE__ */ g(d, { className: "h-4 w-4" }), "Reply"]
+				}),
+				r && o && /* @__PURE__ */ _("button", {
+					type: "button",
+					onClick: () => {
+						r(), u(!1);
+					},
+					className: "flex items-center gap-2 w-full px-3 py-2 text-sm rounded-md hover:bg-muted transition-colors",
+					children: [/* @__PURE__ */ g(l, { className: "h-4 w-4" }), "Edit"]
+				}),
+				i && o && /* @__PURE__ */ _("button", {
+					type: "button",
+					onClick: () => {
+						i(), u(!1);
+					},
+					className: "flex items-center gap-2 w-full px-3 py-2 text-sm rounded-md hover:bg-muted text-destructive transition-colors",
+					children: [/* @__PURE__ */ g(p, { className: "h-4 w-4" }), "Delete"]
+				})
+			]
+		})]
+	});
+}
+var T = t.forwardRef(({ message: n, isSent: r = !1, sender: i, showAvatar: a = !0, timestamp: o, timestampFormat: s = "time", status: c = "sent", readReceipt: l, reactions: p = [], thread: h, isEdited: y = !1, attachments: S = [], linkPreview: T, markdown: E = !1, onAddReaction: D, onToggleReaction: O, onReply: k, onEdit: A, onDelete: j, onRetry: M, onThreadClick: N, onAttachmentClick: P, onLinkPreviewClick: F, showActions: I = !0, emojiPicker: L, quickReactions: R = [
+	"thumbs_up",
+	"heart",
+	"laugh",
+	"wow",
+	"sad",
+	"angry"
+].map((e) => ({
+	thumbs_up: "👍",
+	heart: "❤️",
+	laugh: "😂",
+	wow: "😮",
+	sad: "😢",
+	angry: "😡"
+})[e] ?? "👍"), renderTimestamp: z, maxWidth: B, variant: V, className: H, ...U }, W) => {
+	let [G, K] = t.useState(!1), [q, J] = t.useState(!1), [Y, X] = t.useState(!1), [Z, Q] = t.useState(!1), $ = x(n), ie = S.length > 0, ae = (n) => E ? n.split(/(`[^`]+`)/g).map((n, i) => {
+		if (n.startsWith("`") && n.endsWith("`")) return /* @__PURE__ */ g("code", {
+			className: e("px-1.5 py-0.5 rounded text-sm font-mono", r ? "bg-primary-foreground/20" : "bg-muted-foreground/20"),
+			children: n.slice(1, -1)
+		}, i);
+		let a = n;
+		return a = n.split(/(\*\*[^*]+\*\*)/g).map((e, t) => e.startsWith("**") && e.endsWith("**") ? /* @__PURE__ */ g("strong", { children: e.slice(2, -2) }, t) : e), /* @__PURE__ */ g(t.Fragment, { children: a }, i);
+	}) : n, oe = (e) => {
+		D?.(e), Q(!1);
+	}, se = (e) => {
+		D?.(e), X(!1);
+	};
+	return /* @__PURE__ */ _("div", {
+		ref: W,
+		className: e("group flex gap-2 px-2 py-1", r ? "flex-row-reverse" : "flex-row", H),
+		onMouseEnter: () => K(!0),
+		onMouseLeave: () => {
+			K(!1), Q(!1);
+		},
+		...U,
+		children: [
+			a && !r && /* @__PURE__ */ g(C, {
+				user: i,
+				className: "mt-auto mb-1"
+			}),
+			/* @__PURE__ */ _("div", {
+				className: e("flex flex-col", r ? "items-end" : "items-start"),
+				style: { maxWidth: B ?? "85%" },
+				children: [
+					!r && i?.name && /* @__PURE__ */ g("span", {
+						className: "text-xs text-muted-foreground mb-1 ml-1",
+						children: i.name
+					}),
+					/* @__PURE__ */ _("div", {
+						className: e("relative", r ? "flex flex-row-reverse" : "flex"),
+						children: [I && G && /* @__PURE__ */ _("div", {
+							className: e("flex items-center gap-0.5 mx-1 opacity-0 group-hover:opacity-100 transition-opacity", r ? "flex-row-reverse" : ""),
+							children: [
+								D && /* @__PURE__ */ _("div", {
+									className: "relative",
+									children: [/* @__PURE__ */ g("button", {
+										type: "button",
+										onClick: () => Q(!Z),
+										className: "p-1.5 rounded-full hover:bg-muted text-muted-foreground transition-colors",
+										children: /* @__PURE__ */ g(f, { className: "h-4 w-4" })
+									}), Z && /* @__PURE__ */ g("div", {
+										className: e("absolute z-50 flex gap-1 p-1.5 rounded-full bg-popover border shadow-lg animate-in fade-in-0 zoom-in-95", r ? "right-0" : "left-0", "bottom-full mb-1"),
+										children: R.map((e) => /* @__PURE__ */ g("button", {
+											type: "button",
+											onClick: () => oe(e),
+											className: "text-lg hover:scale-125 transition-transform p-1",
+											children: e
+										}, e))
+									})]
+								}),
+								k && /* @__PURE__ */ g("button", {
+									type: "button",
+									onClick: k,
+									className: "p-1.5 rounded-full hover:bg-muted text-muted-foreground transition-colors",
+									children: /* @__PURE__ */ g(d, { className: "h-4 w-4" })
+								}),
+								(A || j) && /* @__PURE__ */ g(re, {
+									onReply: k,
+									onEdit: A,
+									onDelete: j,
+									onAddReaction: D ? () => X(!0) : void 0,
+									isSent: r,
+									isOpen: q,
+									onOpenChange: J
+								})
+							]
+						}), /* @__PURE__ */ _("div", {
+							className: e(v({
+								variant: V,
+								isSent: r
+							}), $ && "bg-transparent px-2 py-1 text-4xl", c === "failed" && "opacity-70"),
+							children: [
+								ie && /* @__PURE__ */ g("div", {
+									className: "space-y-2 mb-2",
+									children: S.map((e) => /* @__PURE__ */ g(te, {
+										attachment: e,
+										onClick: () => P?.(e),
+										isSent: r
+									}, e.id))
+								}),
+								T && /* @__PURE__ */ g("div", {
+									className: "mb-2",
+									children: /* @__PURE__ */ g(ne, {
+										preview: T,
+										onClick: () => F?.(T.url),
+										isSent: r
+									})
+								}),
+								/* @__PURE__ */ g("p", {
+									className: e("whitespace-pre-wrap", $ && "text-4xl leading-tight"),
+									children: ae(n)
+								}),
+								/* @__PURE__ */ _("div", {
+									className: e("flex items-center gap-1.5 mt-1", r ? "justify-end" : "justify-start"),
+									children: [
+										y && /* @__PURE__ */ g("span", {
+											className: e("text-[10px]", r ? "text-primary-foreground/60" : "text-muted-foreground"),
+											children: "edited"
+										}),
+										o && /* @__PURE__ */ g("span", {
+											className: e("text-[10px]", r ? "text-primary-foreground/60" : "text-muted-foreground"),
+											children: z ? z(o) : b(o, s)
+										}),
+										r && /* @__PURE__ */ g(w, {
+											status: c,
+											readReceipt: l
+										})
+									]
+								}),
+								c === "failed" && M && /* @__PURE__ */ _("button", {
+									type: "button",
+									onClick: M,
+									className: e("flex items-center gap-1 mt-2 text-xs font-medium", r ? "text-primary-foreground/80" : "text-destructive"),
+									children: [/* @__PURE__ */ g(u, { className: "h-3 w-3" }), "Tap to retry"]
+								})
+							]
+						})]
+					}),
+					p.length > 0 && /* @__PURE__ */ g("div", {
+						className: e("flex flex-wrap gap-1 mt-1", r ? "justify-end mr-2" : "justify-start ml-2"),
+						children: p.map((e) => /* @__PURE__ */ g(ee, {
+							reaction: e,
+							onClick: () => O?.(e.emoji),
+							isSent: r
+						}, e.emoji))
+					}),
+					h && h.count > 0 && /* @__PURE__ */ _("button", {
+						type: "button",
+						onClick: N,
+						className: e("flex items-center gap-2 mt-1 px-2 py-1 rounded-lg text-xs transition-colors", r ? "hover:bg-primary/10 text-primary" : "hover:bg-muted text-muted-foreground"),
+						children: [
+							/* @__PURE__ */ g("div", {
+								className: "flex -space-x-1",
+								children: h.participants.slice(0, 3).map((e) => /* @__PURE__ */ g(C, {
+									user: e,
+									size: "sm",
+									className: "ring-2 ring-background"
+								}, e.id))
+							}),
+							/* @__PURE__ */ _("span", { children: [
+								h.count,
+								" ",
+								h.count === 1 ? "reply" : "replies"
+							] }),
+							h.lastReply && /* @__PURE__ */ _("span", {
+								className: "text-muted-foreground truncate max-w-[100px]",
+								children: ["- ", h.lastReply]
+							})
+						]
+					})
+				]
+			}),
+			Y && L && /* @__PURE__ */ g("div", {
+				className: "fixed inset-0 z-50 flex items-center justify-center bg-black/50",
+				onClick: () => X(!1),
+				children: /* @__PURE__ */ _("div", {
+					className: "bg-popover rounded-lg shadow-xl p-4",
+					onClick: (e) => e.stopPropagation(),
+					children: [/* @__PURE__ */ _("div", {
+						className: "flex items-center justify-between mb-2",
+						children: [/* @__PURE__ */ g("span", {
+							className: "text-sm font-medium",
+							children: "Add Reaction"
+						}), /* @__PURE__ */ g("button", {
+							type: "button",
+							onClick: () => X(!1),
+							className: "p-1 rounded hover:bg-muted",
+							children: /* @__PURE__ */ g(m, { className: "h-4 w-4" })
+						})]
+					}), L(se)]
+				})
+			})
+		]
+	});
+});
+T.displayName = "WakaChatBubble";
+function E({ users: t = [], showAvatar: n = !0, className: r, ...i }) {
+	if (t.length === 0) return null;
+	let a = t.length === 1 ? t[0].name : t.length === 2 ? `${t[0].name} and ${t[1].name}` : `${t[0].name} and ${t.length - 1} others`;
+	return /* @__PURE__ */ _("div", {
+		className: e("flex items-end gap-2 px-2 py-1", r),
+		...i,
+		children: [
+			n && /* @__PURE__ */ g(C, {
+				user: t[0],
+				className: "mb-1"
+			}),
+			/* @__PURE__ */ g("div", {
+				className: "bg-muted rounded-2xl rounded-bl-md px-4 py-3",
+				children: /* @__PURE__ */ _("div", {
+					className: "flex items-center gap-1",
+					children: [
+						/* @__PURE__ */ g("span", {
+							className: "w-2 h-2 rounded-full bg-muted-foreground/50 animate-bounce",
+							style: { animationDelay: "0ms" }
+						}),
+						/* @__PURE__ */ g("span", {
+							className: "w-2 h-2 rounded-full bg-muted-foreground/50 animate-bounce",
+							style: { animationDelay: "150ms" }
+						}),
+						/* @__PURE__ */ g("span", {
+							className: "w-2 h-2 rounded-full bg-muted-foreground/50 animate-bounce",
+							style: { animationDelay: "300ms" }
+						})
+					]
+				})
+			}),
+			/* @__PURE__ */ _("span", {
+				className: "text-xs text-muted-foreground ml-1",
+				children: [
+					a,
+					" ",
+					t.length === 1 ? "is" : "are",
+					" typing..."
+				]
+			})
+		]
+	});
+}
+function D({ date: t, className: n, ...r }) {
+	let i = typeof t == "string" ? new Date(t) : t, a = /* @__PURE__ */ new Date(), o = new Date(a);
+	o.setDate(o.getDate() - 1);
+	let s;
+	return s = i.toDateString() === a.toDateString() ? "Today" : i.toDateString() === o.toDateString() ? "Yesterday" : i.toLocaleDateString(void 0, {
+		weekday: "long",
+		month: "long",
+		day: "numeric"
+	}), /* @__PURE__ */ _("div", {
+		className: e("flex items-center justify-center py-4", n),
+		...r,
+		children: [
+			/* @__PURE__ */ g("div", { className: "flex-1 h-px bg-border" }),
+			/* @__PURE__ */ g("span", {
+				className: "px-4 text-xs text-muted-foreground font-medium",
+				children: s
+			}),
+			/* @__PURE__ */ g("div", { className: "flex-1 h-px bg-border" })
+		]
+	});
+}
+function O({ message: t, icon: n, className: r, ...i }) {
+	return /* @__PURE__ */ _("div", {
+		className: e("flex items-center justify-center gap-2 py-2 text-xs text-muted-foreground", r),
+		...i,
+		children: [n, /* @__PURE__ */ g("span", { children: t })]
+	});
+}
+//#endregion
+export { T as WakaChatBubble, D as WakaChatDateSeparator, O as WakaChatSystemMessage, E as WakaChatTypingIndicator };

package/dist/components/waka-checklist/index.cjs.js

@@ -0,0 +1,40 @@
+"use client";"use client";const e=require("../../_virtual/_rolldown/runtime.cjs.js"),t=require("../../utils/cn.cjs.js");let n=require("react");n=e.__toESM(n);let r=require("lucide-react"),i=require("react/jsx-runtime");var a=`waka-checklist-`;function o(e){return`${a}${e}`}function s(e){if(typeof window>`u`)return null;try{let t=localStorage.getItem(o(e));if(t){let e=JSON.parse(t);return{...e,expandedTasks:new Set(e.expandedTasks||[])}}}catch{}return null}function c(e,t){if(!(typeof window>`u`))try{localStorage.setItem(o(e),JSON.stringify({...t,expandedTasks:Array.from(t.expandedTasks)}))}catch{}}function l({checklistId:e,tasks:t,persistent:r=!0,defaultCollapsed:i=!1,onComplete:a,onTaskChange:l}){let[u,d]=n.useState(()=>{let t=r?s(e):null;return{tasks:t?.tasks||{},collapsed:t?.collapsed??i,expandedTasks:t?.expandedTasks||new Set}}),f=n.useRef(!1),p=u.tasks,m=Object.values(p).filter(e=>e===`completed`).length,h=Object.values(p).filter(e=>e===`skipped`).length,g=t.length,_=t.filter(e=>e.required!==!1),v=_.filter(e=>p[e.id]===`completed`).length,y=_.filter(e=>p[e.id]===`skipped`).length,b=_.length===0||v+y>=_.length,x=g>0?m/g*100:0;n.useEffect(()=>{r&&c(e,u)},[e,r,u]),n.useEffect(()=>{b&&!f.current&&m>0&&a?.(),f.current=b},[b,m,a]);let S=n.useCallback(e=>{d(t=>({...t,tasks:{...t.tasks,[e]:`completed`}})),l?.(e,`completed`)},[l]),C=n.useCallback(e=>{d(t=>({...t,tasks:{...t.tasks,[e]:`skipped`}})),l?.(e,`skipped`)},[l]),w=n.useCallback(e=>{d(t=>{let n={...t.tasks};return delete n[e],{...t,tasks:n}}),l?.(e,`pending`)},[l]),T=n.useCallback(e=>{d(t=>{let n=new Set(t.expandedTasks);return n.has(e)?n.delete(e):n.add(e),{...t,expandedTasks:n}})},[]),E=n.useCallback(()=>{d(e=>({...e,collapsed:!e.collapsed}))},[]),D=n.useCallback(()=>{d({tasks:{},collapsed:i,expandedTasks:new Set}),r&&localStorage.removeItem(o(e))},[e,i,r]),O=n.useCallback(e=>p[e]||`pending`,[p]);return{taskStates:p,isCollapsed:u.collapsed,expandedTasks:u.expandedTasks,completeTask:S,skipTask:C,resetTask:w,toggleTaskExpanded:T,toggleCollapsed:E,resetChecklist:D,progress:x,completedCount:m,skippedCount:h,totalCount:g,isComplete:b,getTaskStatus:O}}function u({active:e,onComplete:t}){let[a,o]=n.useState(!1);if(n.useEffect(()=>{if(e){o(!0);let e=setTimeout(()=>{o(!1),t?.()},4e3);return()=>clearTimeout(e)}},[e,t]),!a)return null;let s=[`#fbbf24`,`#f59e0b`,`#ef4444`,`#8b5cf6`,`#06b6d4`,`#22c55e`,`#ec4899`];return(0,i.jsxs)(`div`,{className:`pointer-events-none fixed inset-0 z-50 overflow-hidden`,children:[[...Array(80)].map((e,t)=>{let n=t/80*360,r=150+Math.random()*250,a=6+Math.random()*10,o=1.2+Math.random()*.6;return(0,i.jsx)(`div`,{className:`absolute left-1/2 top-1/2 animate-confetti`,style:{width:a,height:a,backgroundColor:s[Math.floor(Math.random()*s.length)],borderRadius:Math.random()>.5?`50%`:`2px`,"--angle":`${n}deg`,"--distance":`${r}px`,animationDuration:`${o}s`,animationDelay:`${Math.random()*.3}s`}},t)}),(0,i.jsx)(`div`,{className:`absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 animate-celebration-popup`,children:(0,i.jsxs)(`div`,{className:`flex flex-col items-center gap-4 rounded-2xl bg-gradient-to-br from-yellow-400 via-orange-500 to-pink-500 px-12 py-8 text-white shadow-2xl`,children:[(0,i.jsxs)(`div`,{className:`flex items-center gap-3`,children:[(0,i.jsx)(r.PartyPopper,{className:`h-10 w-10 animate-bounce`}),(0,i.jsx)(r.Trophy,{className:`h-12 w-12 animate-pulse`}),(0,i.jsx)(r.PartyPopper,{className:`h-10 w-10 animate-bounce`})]}),(0,i.jsxs)(`div`,{className:`text-center`,children:[(0,i.jsx)(`h3`,{className:`text-3xl font-bold`,children:`All Done!`}),(0,i.jsx)(`p`,{className:`mt-1 text-lg opacity-90`,children:`You completed all the tasks`})]}),(0,i.jsx)(r.Gift,{className:`h-8 w-8 animate-bounce`})]})}),[...Array(20)].map((e,t)=>(0,i.jsx)(r.Sparkles,{className:`absolute animate-sparkle text-yellow-400`,style:{left:`${Math.random()*100}%`,top:`${Math.random()*100}%`,animationDelay:`${Math.random()*2}s`,fontSize:`${20+Math.random()*20}px`}},`sparkle-${t}`)),(0,i.jsx)(`style`,{children:`
+        @keyframes confetti {
+          0% {
+            transform: translate(-50%, -50%) rotate(var(--angle)) translateX(0) scale(1);
+            opacity: 1;
+          }
+          100% {
+            transform: translate(-50%, -50%) rotate(var(--angle)) translateX(var(--distance)) scale(0) rotate(720deg);
+            opacity: 0;
+          }
+        }
+        @keyframes celebration-popup {
+          0% { transform: translate(-50%, -50%) scale(0); opacity: 0; }
+          20% { transform: translate(-50%, -50%) scale(1.1); opacity: 1; }
+          30% { transform: translate(-50%, -50%) scale(1); }
+          80% { transform: translate(-50%, -50%) scale(1); opacity: 1; }
+          100% { transform: translate(-50%, -50%) scale(0.8); opacity: 0; }
+        }
+        @keyframes sparkle {
+          0%, 100% { transform: scale(0) rotate(0deg); opacity: 0; }
+          50% { transform: scale(1) rotate(180deg); opacity: 1; }
+        }
+        .animate-confetti {
+          animation: confetti 1.5s ease-out forwards;
+        }
+        .animate-celebration-popup {
+          animation: celebration-popup 4s ease-out forwards;
+        }
+        .animate-sparkle {
+          animation: sparkle 2s ease-in-out infinite;
+        }
+      `})]})}function d({progress:e,showPercentage:a=!0,size:o=`default`}){let[s,c]=n.useState(0);n.useEffect(()=>{let t=setTimeout(()=>c(e),100);return()=>clearTimeout(t)},[e]);let l={sm:`h-1.5`,default:`h-2`,lg:`h-3`},u=e>=100;return(0,i.jsxs)(`div`,{className:`w-full`,children:[(0,i.jsxs)(`div`,{className:t.cn(`relative w-full overflow-hidden rounded-full bg-muted`,l[o]),children:[(0,i.jsx)(`div`,{className:t.cn(`h-full rounded-full transition-all duration-700 ease-out`,u?`bg-gradient-to-r from-green-500 to-emerald-500`:`bg-gradient-to-r from-blue-500 to-purple-500`),style:{width:`${s}%`}}),(0,i.jsx)(`div`,{className:`absolute inset-0 animate-progress-shine`,style:{width:`${s}%`}})]}),a&&(0,i.jsxs)(`div`,{className:`mt-1 flex items-center justify-between text-xs text-muted-foreground`,children:[(0,i.jsxs)(`span`,{children:[Math.round(s),`% complete`]}),u&&(0,i.jsxs)(`span`,{className:`flex items-center gap-1 text-green-600`,children:[(0,i.jsx)(r.Check,{className:`h-3 w-3`}),`Complete`]})]}),(0,i.jsx)(`style`,{children:`
+        @keyframes progress-shine {
+          0% { background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.3) 50%, transparent 100%); background-position: -100% 0; }
+          100% { background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.3) 50%, transparent 100%); background-position: 200% 0; }
+        }
+        .animate-progress-shine {
+          animation: progress-shine 2s ease-in-out infinite;
+        }
+      `})]})}function f({task:e,status:n,isExpanded:a,onToggleExpand:o,onComplete:s,onSkip:c,onReset:l,size:u=`default`}){let d=n===`completed`,f=n===`skipped`,p=n===`pending`,m={sm:{container:`px-3 py-2`,icon:`h-4 w-4`,checkIcon:`h-3 w-3`,title:`text-sm`,description:`text-xs`,button:`px-2 py-1 text-xs`},default:{container:`px-4 py-3`,icon:`h-5 w-5`,checkIcon:`h-3.5 w-3.5`,title:`text-base`,description:`text-sm`,button:`px-3 py-1.5 text-sm`},lg:{container:`px-5 py-4`,icon:`h-6 w-6`,checkIcon:`h-4 w-4`,title:`text-lg`,description:`text-base`,button:`px-4 py-2 text-base`}}[u];return(0,i.jsxs)(`div`,{className:t.cn(`group rounded-lg border transition-all duration-200`,d&&`border-green-200 bg-green-50 dark:border-green-900 dark:bg-green-950/30`,f&&`border-muted bg-muted/30 opacity-60`,p&&`border-border bg-card hover:border-primary/50 hover:shadow-sm`),children:[(0,i.jsxs)(`div`,{className:t.cn(`flex items-center gap-3`,m.container),children:[(0,i.jsxs)(`button`,{type:`button`,onClick:p?s:l,className:t.cn(`flex-shrink-0 rounded-full border-2 transition-all duration-200`,m.icon,`flex items-center justify-center`,d&&`border-green-500 bg-green-500 text-white`,f&&`border-muted-foreground/30 bg-muted`,p&&`border-muted-foreground/30 hover:border-primary hover:bg-primary/10`),"aria-label":p?`Complete task`:`Reset task`,children:[d&&(0,i.jsx)(r.Check,{className:m.checkIcon}),f&&(0,i.jsx)(r.X,{className:t.cn(m.checkIcon,`text-muted-foreground`)})]}),(0,i.jsx)(`div`,{className:`flex-1 min-w-0`,children:(0,i.jsxs)(`div`,{className:`flex items-center gap-2`,children:[e.icon&&(0,i.jsx)(`span`,{className:`text-muted-foreground`,children:e.icon}),(0,i.jsx)(`span`,{className:t.cn(`font-medium transition-all duration-200`,m.title,d&&`text-green-700 line-through dark:text-green-400`,f&&`text-muted-foreground line-through`),children:e.title}),e.required===!1&&(0,i.jsx)(`span`,{className:`text-xs text-muted-foreground`,children:`(optional)`}),e.points&&p&&(0,i.jsxs)(`span`,{className:`inline-flex items-center gap-0.5 rounded-full bg-yellow-100 px-2 py-0.5 text-xs font-medium text-yellow-700 dark:bg-yellow-900/50 dark:text-yellow-400`,children:[`+`,e.points]})]})}),(0,i.jsxs)(`div`,{className:`flex items-center gap-2`,children:[p&&e.skippable&&(0,i.jsx)(`button`,{type:`button`,onClick:c,className:`text-xs text-muted-foreground hover:text-foreground transition-colors`,children:`Skip`}),p&&e.actionLabel&&e.onAction&&(0,i.jsx)(`button`,{type:`button`,onClick:t=>{t.stopPropagation(),e.onAction?.()},className:t.cn(`rounded-md bg-primary text-primary-foreground font-medium transition-colors hover:bg-primary/90`,m.button),children:e.actionLabel}),e.description&&(0,i.jsx)(`button`,{type:`button`,onClick:o,className:`rounded-md p-1 text-muted-foreground hover:bg-muted hover:text-foreground transition-colors`,"aria-label":a?`Collapse details`:`Expand details`,children:a?(0,i.jsx)(r.ChevronDown,{className:m.icon}):(0,i.jsx)(r.ChevronRight,{className:m.icon})})]})]}),e.description&&(0,i.jsx)(`div`,{className:t.cn(`overflow-hidden transition-all duration-200`,a?`max-h-40 opacity-100`:`max-h-0 opacity-0`),children:(0,i.jsx)(`div`,{className:t.cn(`border-t pt-2 pb-3 px-4 ml-8`,m.description,`text-muted-foreground`),children:e.description})})]})}function p({category:e,tasks:t,taskStates:a,expandedTasks:o,onCompleteTask:s,onSkipTask:c,onResetTask:l,onToggleTaskExpanded:u,size:d=`default`}){let[p,m]=n.useState(!0),h=t.filter(e=>a[e.id]===`completed`).length,g=t.length;return(0,i.jsxs)(`div`,{className:`space-y-2`,children:[(0,i.jsxs)(`button`,{type:`button`,onClick:()=>m(e=>!e),className:`flex w-full items-center gap-2 rounded-lg px-2 py-1.5 hover:bg-muted/50 transition-colors`,children:[p?(0,i.jsx)(r.ChevronDown,{className:`h-4 w-4 text-muted-foreground`}):(0,i.jsx)(r.ChevronRight,{className:`h-4 w-4 text-muted-foreground`}),e.icon&&(0,i.jsx)(`span`,{className:`text-muted-foreground`,children:e.icon}),(0,i.jsx)(`span`,{className:`font-medium`,children:e.label}),(0,i.jsxs)(`span`,{className:`ml-auto text-sm text-muted-foreground`,children:[h,`/`,g]})]}),p&&(0,i.jsx)(`div`,{className:`ml-4 space-y-2`,children:t.map(e=>(0,i.jsx)(f,{task:e,status:a[e.id]||`pending`,isExpanded:o.has(e.id),onToggleExpand:()=>u(e.id),onComplete:()=>s(e.id),onSkip:()=>c(e.id),onReset:()=>l(e.id),size:d},e.id))})]})}function m({checklistId:e,tasks:a,categories:o,title:s=`Getting Started`,subtitle:c,showProgress:m=!0,showPercentage:h=!0,persistent:g=!0,showCelebration:_=!0,onComplete:v,onTaskChange:y,defaultCollapsed:b=!1,collapsible:x=!0,size:S=`default`,className:C}){let[w,T]=n.useState(!1),E=n.useRef(!1),D=l({checklistId:e,tasks:a,persistent:g,defaultCollapsed:b,onComplete:()=>{_&&T(!0),v?.()},onTaskChange:y});n.useEffect(()=>{D.isComplete&&!E.current&&D.completedCount>0&&_&&T(!0),E.current=D.isComplete},[D.isComplete,D.completedCount,_]);let O=n.useMemo(()=>{if(!o||o.length===0)return null;let e={},t=[];for(let n of a)n.category&&o.find(e=>e.id===n.category)?(e[n.category]||(e[n.category]=[]),e[n.category].push(n)):t.push(n);return{groups:e,uncategorized:t}},[a,o]),k={sm:{container:`p-3`,header:`gap-2`,title:`text-base`,subtitle:`text-xs`},default:{container:`p-4`,header:`gap-3`,title:`text-lg`,subtitle:`text-sm`},lg:{container:`p-6`,header:`gap-4`,title:`text-xl`,subtitle:`text-base`}}[S];return(0,i.jsxs)(`div`,{className:t.cn(`rounded-xl border bg-card shadow-sm`,k.container,C),children:[(0,i.jsx)(u,{active:w,onComplete:()=>T(!1)}),(0,i.jsxs)(`div`,{className:t.cn(`flex items-start justify-between`,k.header),children:[(0,i.jsxs)(`div`,{className:`flex-1`,children:[(0,i.jsxs)(`div`,{className:`flex items-center gap-2`,children:[x&&(0,i.jsx)(`button`,{type:`button`,onClick:D.toggleCollapsed,className:`rounded-md p-1 hover:bg-muted transition-colors`,"aria-label":D.isCollapsed?`Expand checklist`:`Collapse checklist`,children:D.isCollapsed?(0,i.jsx)(r.ChevronRight,{className:`h-5 w-5`}):(0,i.jsx)(r.ChevronDown,{className:`h-5 w-5`})}),(0,i.jsx)(`h2`,{className:t.cn(`font-semibold`,k.title),children:s}),D.isComplete&&(0,i.jsxs)(`span`,{className:`inline-flex items-center gap-1 rounded-full bg-green-100 px-2 py-0.5 text-xs font-medium text-green-700 dark:bg-green-900/50 dark:text-green-400`,children:[(0,i.jsx)(r.Check,{className:`h-3 w-3`}),`Complete`]})]}),c&&!D.isCollapsed&&(0,i.jsx)(`p`,{className:t.cn(`text-muted-foreground mt-1`,k.subtitle),children:c})]}),(0,i.jsxs)(`div`,{className:`text-right text-sm text-muted-foreground`,children:[(0,i.jsx)(`span`,{className:`font-medium text-foreground`,children:D.completedCount}),`/`,D.totalCount,` tasks`]})]}),m&&!D.isCollapsed&&(0,i.jsx)(`div`,{className:`mt-3`,children:(0,i.jsx)(d,{progress:D.progress,showPercentage:h,size:S})}),!D.isCollapsed&&(0,i.jsx)(`div`,{className:`mt-4 space-y-3`,children:O?(0,i.jsxs)(i.Fragment,{children:[o?.map(e=>{let t=O.groups[e.id]||[];return t.length===0?null:(0,i.jsx)(p,{category:e,tasks:t,taskStates:D.taskStates,expandedTasks:D.expandedTasks,onCompleteTask:D.completeTask,onSkipTask:D.skipTask,onResetTask:D.resetTask,onToggleTaskExpanded:D.toggleTaskExpanded,size:S},e.id)}),O.uncategorized.length>0&&(0,i.jsx)(`div`,{className:`space-y-2`,children:O.uncategorized.map(e=>(0,i.jsx)(f,{task:e,status:D.getTaskStatus(e.id),isExpanded:D.expandedTasks.has(e.id),onToggleExpand:()=>D.toggleTaskExpanded(e.id),onComplete:()=>D.completeTask(e.id),onSkip:()=>D.skipTask(e.id),onReset:()=>D.resetTask(e.id),size:S},e.id))})]}):(0,i.jsx)(`div`,{className:`space-y-2`,children:a.map(e=>(0,i.jsx)(f,{task:e,status:D.getTaskStatus(e.id),isExpanded:D.expandedTasks.has(e.id),onToggleExpand:()=>D.toggleTaskExpanded(e.id),onComplete:()=>D.completeTask(e.id),onSkip:()=>D.skipTask(e.id),onReset:()=>D.resetTask(e.id),size:S},e.id))})}),D.isComplete&&!D.isCollapsed&&(0,i.jsx)(`div`,{className:`mt-4 rounded-lg bg-gradient-to-r from-green-50 to-emerald-50 p-4 dark:from-green-950/30 dark:to-emerald-950/30`,children:(0,i.jsxs)(`div`,{className:`flex items-center gap-3`,children:[(0,i.jsx)(`div`,{className:`rounded-full bg-green-500 p-2 text-white`,children:(0,i.jsx)(r.Trophy,{className:`h-5 w-5`})}),(0,i.jsxs)(`div`,{children:[(0,i.jsx)(`p`,{className:`font-medium text-green-700 dark:text-green-400`,children:`Great job!`}),(0,i.jsx)(`p`,{className:`text-sm text-green-600 dark:text-green-500`,children:`You have completed the onboarding checklist`})]}),(0,i.jsx)(r.Gift,{className:`ml-auto h-8 w-8 text-green-500`})]})})]})}exports.WakaChecklist=m,exports.default=m,exports.useChecklist=l;