@wakastellar/ui 4.0.0 → 4.1.1

package/dist/components/waka-team-banner/index.es.js

@@ -0,0 +1,625 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.es.js";
+import * as t from "react";
+import { Check as n, Crown as r, Loader2 as i, Medal as a, Star as o, Target as s, Trophy as c, UserPlus as l, Users as u, Zap as d } from "lucide-react";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
+//#region src/components/waka-team-banner/index.tsx
+var m = {
+	primary: "#6366f1",
+	secondary: "#8b5cf6",
+	gradientDirection: "to-r"
+}, h = {
+	common: {
+		gradient: "from-slate-400 to-slate-500",
+		glow: "rgba(148, 163, 184, 0.4)",
+		ring: "ring-slate-400"
+	},
+	rare: {
+		gradient: "from-blue-400 to-blue-600",
+		glow: "rgba(59, 130, 246, 0.4)",
+		ring: "ring-blue-400"
+	},
+	epic: {
+		gradient: "from-purple-400 to-purple-600",
+		glow: "rgba(168, 85, 247, 0.5)",
+		ring: "ring-purple-400"
+	},
+	legendary: {
+		gradient: "from-amber-400 via-orange-500 to-red-500",
+		glow: "rgba(245, 158, 11, 0.5)",
+		ring: "ring-amber-400"
+	}
+}, g = {
+	sm: {
+		container: "p-4",
+		logo: "h-12 w-12",
+		name: "text-lg",
+		motto: "text-xs",
+		stat: "text-sm",
+		statLabel: "text-xs",
+		avatar: "h-7 w-7",
+		avatarOverlap: "-ml-2",
+		achievement: "h-6 w-6",
+		button: "text-xs px-3 py-1.5"
+	},
+	md: {
+		container: "p-6",
+		logo: "h-16 w-16",
+		name: "text-xl",
+		motto: "text-sm",
+		stat: "text-lg",
+		statLabel: "text-xs",
+		avatar: "h-9 w-9",
+		avatarOverlap: "-ml-2.5",
+		achievement: "h-8 w-8",
+		button: "text-sm px-4 py-2"
+	},
+	lg: {
+		container: "p-8",
+		logo: "h-20 w-20",
+		name: "text-2xl",
+		motto: "text-base",
+		stat: "text-xl",
+		statLabel: "text-sm",
+		avatar: "h-11 w-11",
+		avatarOverlap: "-ml-3",
+		achievement: "h-10 w-10",
+		button: "text-base px-5 py-2.5"
+	}
+};
+function _({ initialJoinState: e = "available", joinDelay: n = 1500, onJoinSuccess: r, onJoinError: i } = {}) {
+	let [a, o] = t.useState(e), [s, c] = t.useState(!1), [l, u] = t.useState(null);
+	return {
+		joinState: a,
+		requestJoin: t.useCallback(async () => {
+			if (a === "available") {
+				c(!0), u(null), o("pending");
+				try {
+					await new Promise((e) => setTimeout(e, n)), o("joined"), r?.();
+				} catch (e) {
+					let t = e instanceof Error ? e : /* @__PURE__ */ Error("Failed to join team");
+					u(t), o("available"), i?.(t);
+				} finally {
+					c(!1);
+				}
+			}
+		}, [
+			a,
+			n,
+			r,
+			i
+		]),
+		cancelJoin: t.useCallback(() => {
+			a === "pending" && (o("available"), c(!1));
+		}, [a]),
+		leaveTeam: t.useCallback(() => {
+			a === "joined" && o("available");
+		}, [a]),
+		isJoining: s,
+		error: l,
+		reset: t.useCallback(() => {
+			o(e), c(!1), u(null);
+		}, [e])
+	};
+}
+function v({ src: t, name: n, size: r, theme: i, animated: a }) {
+	let o = g[r], s = n.split(" ").map((e) => e[0]).join("").toUpperCase().slice(0, 2);
+	return /* @__PURE__ */ p("div", {
+		className: "relative",
+		children: [a && /* @__PURE__ */ f("div", {
+			className: "absolute inset-0 rounded-xl blur-md animate-team-logo-pulse",
+			style: { backgroundColor: `${i.primary}40` }
+		}), /* @__PURE__ */ f("div", {
+			className: e("relative rounded-xl overflow-hidden flex items-center justify-center", "border-2 shadow-lg transition-transform duration-300", a && "hover:scale-105", o.logo),
+			style: {
+				borderColor: i.primary,
+				background: t ? void 0 : `linear-gradient(${i.gradientDirection?.replace("to-", "to ") || "to right"}, ${i.primary}, ${i.secondary || i.primary})`
+			},
+			children: t ? /* @__PURE__ */ f("img", {
+				src: t,
+				alt: `${n} logo`,
+				className: "h-full w-full object-cover"
+			}) : /* @__PURE__ */ f("span", {
+				className: "text-white font-bold text-lg drop-shadow-md",
+				children: s
+			})
+		})]
+	});
+}
+function y({ icon: t, value: n, label: r, size: i, theme: a, animated: o, animationDelay: s = 0 }) {
+	let c = g[i];
+	return /* @__PURE__ */ p("div", {
+		className: e("flex flex-col items-center transition-all duration-300", o && "animate-team-stat-enter"),
+		style: o ? {
+			animationDelay: `${s}ms`,
+			animationFillMode: "both"
+		} : void 0,
+		children: [
+			/* @__PURE__ */ f("div", {
+				className: "p-2 rounded-lg mb-1 transition-colors duration-200",
+				style: { backgroundColor: `${a.primary}15` },
+				children: /* @__PURE__ */ f("div", {
+					style: { color: a.primary },
+					children: t
+				})
+			}),
+			/* @__PURE__ */ f("span", {
+				className: e("font-bold tabular-nums", c.stat),
+				children: n
+			}),
+			/* @__PURE__ */ f("span", {
+				className: e("text-muted-foreground uppercase tracking-wider", c.statLabel),
+				children: r
+			})
+		]
+	});
+}
+function b({ members: t, maxDisplay: n, size: i, theme: a, onMemberClick: o, animated: s }) {
+	let c = g[i], l = t.slice(0, n), u = t.length - n, d = (e) => e.split(" ").map((e) => e[0]).join("").toUpperCase().slice(0, 2);
+	return /* @__PURE__ */ p("div", {
+		className: "flex items-center",
+		children: [/* @__PURE__ */ f("div", {
+			className: "flex",
+			children: l.map((t, n) => /* @__PURE__ */ p("div", {
+				className: e("relative rounded-full border-2 border-background overflow-hidden", "flex items-center justify-center bg-muted", "transition-all duration-200 hover:z-10 hover:scale-110", n > 0 && c.avatarOverlap, o && "cursor-pointer", c.avatar, s && "animate-team-avatar-enter"),
+				style: s ? {
+					animationDelay: `${n * 50}ms`,
+					animationFillMode: "both"
+				} : void 0,
+				onClick: () => o?.(t),
+				title: t.name,
+				children: [t.avatar ? /* @__PURE__ */ f("img", {
+					src: t.avatar,
+					alt: t.name,
+					className: "h-full w-full object-cover"
+				}) : /* @__PURE__ */ f("span", {
+					className: "text-xs font-medium text-muted-foreground",
+					children: d(t.name)
+				}), t.isLeader && /* @__PURE__ */ f("div", {
+					className: "absolute -top-1 -right-1 h-4 w-4 rounded-full flex items-center justify-center",
+					style: { backgroundColor: a.primary },
+					children: /* @__PURE__ */ f(r, { className: "h-2.5 w-2.5 text-white" })
+				})]
+			}, t.id))
+		}), u > 0 && /* @__PURE__ */ f("div", {
+			className: e("rounded-full border-2 border-background flex items-center justify-center", "bg-muted text-muted-foreground font-medium", c.avatarOverlap, c.avatar, s && "animate-team-avatar-enter"),
+			style: s ? {
+				animationDelay: `${n * 50}ms`,
+				animationFillMode: "both"
+			} : void 0,
+			children: /* @__PURE__ */ p("span", {
+				className: "text-xs",
+				children: ["+", u]
+			})
+		})]
+	});
+}
+function x({ achievement: n, size: r, onClick: i, animated: a, animationDelay: o = 0 }) {
+	let [s, c] = t.useState(!1), l = g[r], u = h[n.rarity || "common"];
+	return /* @__PURE__ */ p("div", {
+		className: e("relative group", i && "cursor-pointer", a && "animate-team-achievement-enter"),
+		style: a ? {
+			animationDelay: `${o}ms`,
+			animationFillMode: "both"
+		} : void 0,
+		onClick: i,
+		onMouseEnter: () => c(!0),
+		onMouseLeave: () => c(!1),
+		children: [
+			s && /* @__PURE__ */ f("div", {
+				className: "absolute inset-0 rounded-full blur-md transition-opacity duration-200",
+				style: { backgroundColor: u.glow }
+			}),
+			/* @__PURE__ */ f("div", {
+				className: e("relative rounded-full flex items-center justify-center", "bg-gradient-to-br text-white shadow-md", "transition-transform duration-200", "ring-2 ring-offset-2 ring-offset-background", u.gradient, u.ring, s && "scale-110", l.achievement),
+				children: /* @__PURE__ */ f("div", {
+					className: "h-4 w-4",
+					children: n.icon
+				})
+			}),
+			s && /* @__PURE__ */ p("div", {
+				className: e("absolute left-1/2 top-full z-30 mt-2 -translate-x-1/2", "whitespace-nowrap rounded-lg bg-popover px-3 py-2 text-sm shadow-lg border", "animate-team-tooltip-enter"),
+				children: [/* @__PURE__ */ f("div", {
+					className: "font-semibold",
+					children: n.name
+				}), n.description && /* @__PURE__ */ f("div", {
+					className: "text-xs text-muted-foreground max-w-[180px] whitespace-normal",
+					children: n.description
+				})]
+			})
+		]
+	});
+}
+function S({ state: t, size: r, theme: a, onClick: o, animated: s }) {
+	let c = g[r], u = {
+		available: {
+			label: "Join Team",
+			icon: /* @__PURE__ */ f(l, { className: "h-4 w-4 mr-1.5" }),
+			bg: a.primary,
+			text: "white",
+			disabled: !1
+		},
+		pending: {
+			label: "Pending...",
+			icon: /* @__PURE__ */ f(i, { className: "h-4 w-4 mr-1.5 animate-spin" }),
+			bg: `${a.primary}80`,
+			text: "white",
+			disabled: !0
+		},
+		joined: {
+			label: "Joined",
+			icon: /* @__PURE__ */ f(n, { className: "h-4 w-4 mr-1.5" }),
+			bg: "#22c55e",
+			text: "white",
+			disabled: !0
+		},
+		closed: {
+			label: "Closed",
+			icon: null,
+			bg: "#6b7280",
+			text: "white",
+			disabled: !0
+		}
+	}[t];
+	return /* @__PURE__ */ p("button", {
+		type: "button",
+		className: e("inline-flex items-center justify-center font-medium rounded-lg", "transition-all duration-200", !u.disabled && "hover:scale-105 hover:shadow-lg active:scale-95", u.disabled && "cursor-not-allowed opacity-80", s && "animate-team-button-enter", c.button),
+		style: {
+			backgroundColor: u.bg,
+			color: u.text,
+			boxShadow: u.disabled ? void 0 : `0 4px 14px ${a.primary}40`
+		},
+		onClick: o,
+		disabled: u.disabled,
+		children: [u.icon, u.label]
+	});
+}
+function C({ name: t, motto: n, logo: r, stats: i, members: l = [], maxDisplayMembers: h = 5, achievements: _ = [], maxDisplayAchievements: C = 5, theme: w = m, size: T = "md", variant: E = "default", animated: D = !0, joinState: O = "available", onJoinClick: k, onClick: A, onMemberClick: j, onAchievementClick: M, className: N }) {
+	let P = g[T], F = {
+		...m,
+		...w
+	}, I = _.slice(0, C), L = T === "sm" ? "h-4 w-4" : T === "md" ? "h-5 w-5" : "h-6 w-6", R = (i.totalRanks, `#${i.rank}`), z = i.maxMembers ? `${i.members}/${i.maxMembers}` : i.members.toString();
+	return E === "compact" ? /* @__PURE__ */ p("div", {
+		className: e("relative flex items-center gap-4 rounded-xl border bg-card overflow-hidden", "transition-all duration-300", D && "animate-team-banner-enter", A && "cursor-pointer hover:shadow-lg", P.container, N),
+		onClick: A,
+		children: [
+			/* @__PURE__ */ f("div", {
+				className: "absolute left-0 top-0 bottom-0 w-1",
+				style: { background: `linear-gradient(to bottom, ${F.primary}, ${F.secondary || F.primary})` }
+			}),
+			/* @__PURE__ */ f(v, {
+				src: r,
+				name: t,
+				size: "sm",
+				theme: F,
+				animated: D
+			}),
+			/* @__PURE__ */ p("div", {
+				className: "flex-1 min-w-0",
+				children: [/* @__PURE__ */ f("h3", {
+					className: e("font-bold truncate", P.name),
+					children: t
+				}), /* @__PURE__ */ p("div", {
+					className: "flex items-center gap-3 text-sm text-muted-foreground",
+					children: [
+						/* @__PURE__ */ p("span", {
+							className: "flex items-center gap-1",
+							children: [
+								/* @__PURE__ */ f(c, { className: "h-3.5 w-3.5" }),
+								" ",
+								i.wins,
+								" wins"
+							]
+						}),
+						/* @__PURE__ */ p("span", {
+							className: "flex items-center gap-1",
+							children: [
+								/* @__PURE__ */ f(a, { className: "h-3.5 w-3.5" }),
+								" ",
+								R
+							]
+						}),
+						/* @__PURE__ */ p("span", {
+							className: "flex items-center gap-1",
+							children: [
+								/* @__PURE__ */ f(u, { className: "h-3.5 w-3.5" }),
+								" ",
+								z
+							]
+						})
+					]
+				})]
+			}),
+			k && /* @__PURE__ */ f(S, {
+				state: O,
+				size: "sm",
+				theme: F,
+				onClick: (e) => {
+					e.stopPropagation(), k();
+				},
+				animated: D
+			})
+		]
+	}) : E === "expanded" ? /* @__PURE__ */ p("div", {
+		className: e("relative rounded-2xl border bg-card overflow-hidden", "transition-all duration-300", D && "animate-team-banner-enter", A && "cursor-pointer hover:shadow-xl", N),
+		onClick: A,
+		children: [/* @__PURE__ */ f("div", {
+			className: "h-24 relative",
+			style: { background: `linear-gradient(${F.gradientDirection?.replace("to-", "to ") || "to right"}, ${F.primary}, ${F.secondary || F.primary})` },
+			children: D && /* @__PURE__ */ f("div", {
+				className: "absolute inset-0 opacity-20",
+				children: /* @__PURE__ */ f("div", {
+					className: "absolute inset-0 animate-team-pattern",
+					style: { backgroundImage: "url(\"data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.4'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E\")" }
+				})
+			})
+		}), /* @__PURE__ */ p("div", {
+			className: e("relative", P.container),
+			children: [/* @__PURE__ */ f("div", {
+				className: "absolute -top-12 left-6",
+				children: /* @__PURE__ */ f(v, {
+					src: r,
+					name: t,
+					size: T,
+					theme: F,
+					animated: D
+				})
+			}), /* @__PURE__ */ p("div", {
+				className: e("pt-8", T === "sm" ? "pt-4" : T === "lg" ? "pt-12" : "pt-8"),
+				children: [
+					/* @__PURE__ */ p("div", {
+						className: "flex items-start justify-between mb-4",
+						children: [/* @__PURE__ */ p("div", {
+							className: "ml-20 lg:ml-24",
+							children: [/* @__PURE__ */ f("h2", {
+								className: e("font-bold", P.name),
+								children: t
+							}), n && /* @__PURE__ */ p("p", {
+								className: e("text-muted-foreground italic", P.motto),
+								children: [
+									"\"",
+									n,
+									"\""
+								]
+							})]
+						}), k && /* @__PURE__ */ f(S, {
+							state: O,
+							size: T,
+							theme: F,
+							onClick: (e) => {
+								e.stopPropagation(), k();
+							},
+							animated: D
+						})]
+					}),
+					/* @__PURE__ */ p("div", {
+						className: "flex items-center justify-around py-4 border-y my-4",
+						children: [
+							/* @__PURE__ */ f(y, {
+								icon: /* @__PURE__ */ f(c, { className: L }),
+								value: i.wins,
+								label: "Wins",
+								size: T,
+								theme: F,
+								animated: D,
+								animationDelay: 100
+							}),
+							/* @__PURE__ */ f(y, {
+								icon: /* @__PURE__ */ f(a, { className: L }),
+								value: R,
+								label: "Rank",
+								size: T,
+								theme: F,
+								animated: D,
+								animationDelay: 200
+							}),
+							/* @__PURE__ */ f(y, {
+								icon: /* @__PURE__ */ f(u, { className: L }),
+								value: z,
+								label: "Members",
+								size: T,
+								theme: F,
+								animated: D,
+								animationDelay: 300
+							}),
+							i.winRate !== void 0 && /* @__PURE__ */ f(y, {
+								icon: /* @__PURE__ */ f(s, { className: L }),
+								value: `${i.winRate}%`,
+								label: "Win Rate",
+								size: T,
+								theme: F,
+								animated: D,
+								animationDelay: 400
+							}),
+							i.streak !== void 0 && i.streak > 0 && /* @__PURE__ */ f(y, {
+								icon: /* @__PURE__ */ f(d, { className: L }),
+								value: i.streak,
+								label: "Streak",
+								size: T,
+								theme: F,
+								animated: D,
+								animationDelay: 500
+							})
+						]
+					}),
+					/* @__PURE__ */ p("div", {
+						className: "flex items-center justify-between",
+						children: [l.length > 0 && /* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("h4", {
+							className: "text-xs uppercase tracking-wider text-muted-foreground mb-2",
+							children: "Members"
+						}), /* @__PURE__ */ f(b, {
+							members: l,
+							maxDisplay: h,
+							size: T,
+							theme: F,
+							onMemberClick: j,
+							animated: D
+						})] }), I.length > 0 && /* @__PURE__ */ p("div", {
+							className: l.length === 0 ? "" : "ml-auto",
+							children: [/* @__PURE__ */ f("h4", {
+								className: "text-xs uppercase tracking-wider text-muted-foreground mb-2 text-right",
+								children: "Achievements"
+							}), /* @__PURE__ */ f("div", {
+								className: "flex gap-2",
+								children: I.map((e, t) => /* @__PURE__ */ f(x, {
+									achievement: e,
+									size: T,
+									onClick: M ? () => M(e) : void 0,
+									animated: D,
+									animationDelay: 100 + t * 50
+								}, e.id))
+							})]
+						})]
+					})
+				]
+			})]
+		})]
+	}) : /* @__PURE__ */ p("div", {
+		className: e("relative rounded-xl border bg-card overflow-hidden", "transition-all duration-300", D && "animate-team-banner-enter", A && "cursor-pointer hover:shadow-lg", P.container, N),
+		onClick: A,
+		children: [
+			/* @__PURE__ */ f("div", {
+				className: "absolute top-0 left-0 right-0 h-1",
+				style: { background: `linear-gradient(${F.gradientDirection?.replace("to-", "to ") || "to right"}, ${F.primary}, ${F.secondary || F.primary})` }
+			}),
+			/* @__PURE__ */ p("div", {
+				className: "flex items-start gap-4",
+				children: [/* @__PURE__ */ f(v, {
+					src: r,
+					name: t,
+					size: T,
+					theme: F,
+					animated: D
+				}), /* @__PURE__ */ p("div", {
+					className: "flex-1 min-w-0",
+					children: [
+						/* @__PURE__ */ p("div", {
+							className: "flex items-start justify-between gap-4",
+							children: [/* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("h3", {
+								className: e("font-bold", P.name),
+								children: t
+							}), n && /* @__PURE__ */ p("p", {
+								className: e("text-muted-foreground italic mt-0.5", P.motto),
+								children: [
+									"\"",
+									n,
+									"\""
+								]
+							})] }), k && /* @__PURE__ */ f(S, {
+								state: O,
+								size: T,
+								theme: F,
+								onClick: (e) => {
+									e.stopPropagation(), k();
+								},
+								animated: D
+							})]
+						}),
+						/* @__PURE__ */ p("div", {
+							className: "flex items-center gap-6 mt-4",
+							children: [
+								/* @__PURE__ */ p("div", {
+									className: "flex items-center gap-1.5",
+									children: [
+										/* @__PURE__ */ f(c, {
+											className: e("h-4 w-4"),
+											style: { color: F.primary }
+										}),
+										/* @__PURE__ */ f("span", {
+											className: e("font-semibold", P.stat),
+											children: i.wins
+										}),
+										/* @__PURE__ */ f("span", {
+											className: e("text-muted-foreground", P.statLabel),
+											children: "wins"
+										})
+									]
+								}),
+								/* @__PURE__ */ p("div", {
+									className: "flex items-center gap-1.5",
+									children: [
+										/* @__PURE__ */ f(a, {
+											className: e("h-4 w-4"),
+											style: { color: F.primary }
+										}),
+										/* @__PURE__ */ f("span", {
+											className: e("font-semibold", P.stat),
+											children: R
+										}),
+										i.totalRanks && /* @__PURE__ */ p("span", {
+											className: e("text-muted-foreground", P.statLabel),
+											children: ["of ", i.totalRanks]
+										})
+									]
+								}),
+								/* @__PURE__ */ p("div", {
+									className: "flex items-center gap-1.5",
+									children: [/* @__PURE__ */ f(u, {
+										className: e("h-4 w-4"),
+										style: { color: F.primary }
+									}), /* @__PURE__ */ f("span", {
+										className: e("font-semibold", P.stat),
+										children: z
+									})]
+								}),
+								i.points !== void 0 && /* @__PURE__ */ p("div", {
+									className: "flex items-center gap-1.5",
+									children: [
+										/* @__PURE__ */ f(o, {
+											className: e("h-4 w-4"),
+											style: { color: F.primary }
+										}),
+										/* @__PURE__ */ f("span", {
+											className: e("font-semibold", P.stat),
+											children: i.points.toLocaleString()
+										}),
+										/* @__PURE__ */ f("span", {
+											className: e("text-muted-foreground", P.statLabel),
+											children: "pts"
+										})
+									]
+								})
+							]
+						}),
+						(l.length > 0 || I.length > 0) && /* @__PURE__ */ p("div", {
+							className: "flex items-center justify-between mt-4 pt-4 border-t",
+							children: [l.length > 0 && /* @__PURE__ */ f(b, {
+								members: l,
+								maxDisplay: h,
+								size: T,
+								theme: F,
+								onMemberClick: j,
+								animated: D
+							}), I.length > 0 && /* @__PURE__ */ f("div", {
+								className: e("flex gap-1.5", l.length === 0 && "ml-0"),
+								children: I.map((e, t) => /* @__PURE__ */ f(x, {
+									achievement: e,
+									size: T,
+									onClick: M ? () => M(e) : void 0,
+									animated: D,
+									animationDelay: 100 + t * 50
+								}, e.id))
+							})]
+						})
+					]
+				})]
+			}),
+			/* @__PURE__ */ f("style", { children: "\n        @keyframes team-banner-enter {\n          from {\n            opacity: 0;\n            transform: translateY(20px);\n          }\n          to {\n            opacity: 1;\n            transform: translateY(0);\n          }\n        }\n        .animate-team-banner-enter {\n          animation: team-banner-enter 0.5s ease-out;\n        }\n\n        @keyframes team-logo-pulse {\n          0%, 100% {\n            opacity: 0.4;\n            transform: scale(1);\n          }\n          50% {\n            opacity: 0.7;\n            transform: scale(1.1);\n          }\n        }\n        .animate-team-logo-pulse {\n          animation: team-logo-pulse 2s ease-in-out infinite;\n        }\n\n        @keyframes team-stat-enter {\n          from {\n            opacity: 0;\n            transform: translateY(10px);\n          }\n          to {\n            opacity: 1;\n            transform: translateY(0);\n          }\n        }\n        .animate-team-stat-enter {\n          animation: team-stat-enter 0.4s ease-out;\n        }\n\n        @keyframes team-avatar-enter {\n          from {\n            opacity: 0;\n            transform: scale(0.5);\n          }\n          to {\n            opacity: 1;\n            transform: scale(1);\n          }\n        }\n        .animate-team-avatar-enter {\n          animation: team-avatar-enter 0.3s ease-out;\n        }\n\n        @keyframes team-achievement-enter {\n          from {\n            opacity: 0;\n            transform: scale(0.5) rotate(-10deg);\n          }\n          to {\n            opacity: 1;\n            transform: scale(1) rotate(0deg);\n          }\n        }\n        .animate-team-achievement-enter {\n          animation: team-achievement-enter 0.4s ease-out;\n        }\n\n        @keyframes team-button-enter {\n          from {\n            opacity: 0;\n            transform: translateX(10px);\n          }\n          to {\n            opacity: 1;\n            transform: translateX(0);\n          }\n        }\n        .animate-team-button-enter {\n          animation: team-button-enter 0.4s ease-out 0.2s;\n          animation-fill-mode: both;\n        }\n\n        @keyframes team-tooltip-enter {\n          from {\n            opacity: 0;\n            transform: translate(-50%, 10px);\n          }\n          to {\n            opacity: 1;\n            transform: translate(-50%, 0);\n          }\n        }\n        .animate-team-tooltip-enter {\n          animation: team-tooltip-enter 0.2s ease-out;\n        }\n\n        @keyframes team-pattern {\n          from {\n            transform: translateX(0);\n          }\n          to {\n            transform: translateX(60px);\n          }\n        }\n        .animate-team-pattern {\n          animation: team-pattern 3s linear infinite;\n        }\n      " })
+		]
+	});
+}
+function w(e) {
+	return /* @__PURE__ */ f(C, {
+		variant: "compact",
+		...e
+	});
+}
+function T(e) {
+	return /* @__PURE__ */ f(C, {
+		variant: "expanded",
+		...e
+	});
+}
+//#endregion
+export { C as WakaTeamBanner, C as default, w as WakaTeamBannerCompact, T as WakaTeamBannerExpanded, _ as useTeamBanner };

package/dist/components/waka-terminal-output/index.cjs.js

@@ -0,0 +1,2 @@
+"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={30:`#1e1e1e`,31:`#e74c3c`,32:`#2ecc71`,33:`#f1c40f`,34:`#3498db`,35:`#9b59b6`,36:`#1abc9c`,37:`#ecf0f1`,90:`#7f8c8d`,91:`#ff6b6b`,92:`#69db7c`,93:`#ffe066`,94:`#74c0fc`,95:`#da77f2`,96:`#63e6be`,97:`#ffffff`},o={40:`#1e1e1e`,41:`#e74c3c`,42:`#2ecc71`,43:`#f1c40f`,44:`#3498db`,45:`#9b59b6`,46:`#1abc9c`,47:`#ecf0f1`,100:`#7f8c8d`,101:`#ff6b6b`,102:`#69db7c`,103:`#ffe066`,104:`#74c0fc`,105:`#da77f2`,106:`#63e6be`,107:`#ffffff`};function s(e){let t=[],n=/\x1b\[([0-9;]*)m/g,r=0,i={},s;for(;(s=n.exec(e))!==null;){s.index>r&&t.push({text:e.slice(r,s.index),styles:{...i}});let n=s[1].split(`;`).map(Number).filter(e=>!isNaN(e));for(let e of n)e===0?i={}:e===1?i.fontWeight=`bold`:e===3?i.fontStyle=`italic`:e===4?i.textDecoration=`underline`:e===9?i.textDecoration=`line-through`:a[e]?i.color=a[e]:o[e]&&(i.backgroundColor=o[e]);r=s.index+s[0].length}return r<e.length&&t.push({text:e.slice(r),styles:{...i}}),t}var c=[{pattern:/(\d{4}-\d{2}-\d{2}[T ]\d{2}:\d{2}:\d{2}(?:\.\d+)?(?:Z|[+-]\d{2}:?\d{2})?|\[\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}\])/g,className:`text-cyan-400`},{pattern:/\b(ERROR|error|Error)\b/g,className:`text-red-400 font-bold`},{pattern:/\b(WARN|warn|Warning|WARNING)\b/g,className:`text-yellow-400 font-bold`},{pattern:/\b(INFO|info)\b/g,className:`text-blue-400 font-bold`},{pattern:/\b(DEBUG|debug)\b/g,className:`text-gray-400 font-bold`},{pattern:/\b(\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3})\b/g,className:`text-purple-400`},{pattern:/(https?:\/\/[^\s]+)/g,className:`text-blue-300 underline`},{pattern:/\b(\d+(?:\.\d+)?)\b/g,className:`text-green-400`},{pattern:/("[^"]*"|'[^']*')/g,className:`text-orange-300`},{pattern:/\b(GET|POST|PUT|DELETE|PATCH|HEAD|OPTIONS)\b/g,className:`text-pink-400 font-bold`},{pattern:/\b([2][0-9]{2})\b/g,className:`text-green-400`},{pattern:/\b([4][0-9]{2})\b/g,className:`text-yellow-400`},{pattern:/\b([5][0-9]{2})\b/g,className:`text-red-400`},{pattern:/(\/[\w\-./]+\.\w+)/g,className:`text-teal-300`}];function l(e){let t=[{text:e,className:``}];for(let{pattern:e,className:n}of c){let r=[];for(let i of t){if(i.className){r.push(i);continue}let t=0,a=new RegExp(e.source,e.flags),o;for(;(o=a.exec(i.text))!==null;)o.index>t&&r.push({text:i.text.slice(t,o.index),className:``}),r.push({text:o[0],className:n}),t=o.index+o[0].length;t<i.text.length&&r.push({text:i.text.slice(t),className:``})}t.length=0,t.push(...r)}return t.filter(e=>e.text.length>0)}function u(e,t,r,i,a=5){return n.useMemo(()=>{let n=Math.max(0,Math.floor(i/t)-a),o=Math.min(e-1,Math.ceil((i+r)/t)+a),s=[];for(let r=n;r<=o&&r<e;r++)s.push({index:r,style:{position:`absolute`,top:r*t,left:0,right:0,height:t}});return{totalHeight:e*t,visibleItems:s,startIndex:n,endIndex:o}},[e,t,r,i,a])}function d({content:e,onCopy:a,className:o}){let[s,c]=n.useState(!1);return(0,i.jsx)(`button`,{onClick:async t=>{t.stopPropagation();try{await navigator.clipboard.writeText(e),c(!0),a?.(e),setTimeout(()=>c(!1),2e3)}catch{}},className:t.cn(`p-1 rounded hover:bg-white/10 transition-colors`,o),title:`Copy`,children:s?(0,i.jsx)(r.Check,{className:`h-3.5 w-3.5 text-green-400`}):(0,i.jsx)(r.Copy,{className:`h-3.5 w-3.5 text-gray-400 hover:text-white`})})}function f({line:e,index:r,showLineNumbers:a,showTimestamps:o,onCopy:c,style:u,isHighlighted:f}){let[p,m]=n.useState(!1),h=/\x1b\[/.test(e.content);return(0,i.jsxs)(`div`,{style:u,className:t.cn(`flex items-stretch font-mono text-sm border-l-2 border-transparent hover:bg-white/5 group`,e.level&&{error:`border-l-red-500`,warn:`border-l-yellow-500`,info:`border-l-blue-500`,debug:`border-l-gray-500`}[e.level],f&&`bg-yellow-500/20`),onMouseEnter:()=>m(!0),onMouseLeave:()=>m(!1),children:[a&&(0,i.jsx)(`span`,{className:`flex-shrink-0 w-12 px-2 text-right text-gray-500 select-none border-r border-gray-700 flex items-center justify-end`,children:r+1}),o&&e.timestamp&&(0,i.jsx)(`span`,{className:`flex-shrink-0 px-2 text-gray-500 select-none border-r border-gray-700 flex items-center`,children:(e=>e.toLocaleTimeString(`en-US`,{hour12:!1,hour:`2-digit`,minute:`2-digit`,second:`2-digit`}))(e.timestamp)}),(0,i.jsx)(`div`,{className:`flex-1 px-3 overflow-hidden whitespace-pre flex items-center`,children:(0,i.jsx)(`span`,{className:`overflow-hidden text-ellipsis`,children:h?s(e.content).map((e,t)=>(0,i.jsx)(`span`,{style:e.styles,children:e.text},t)):l(e.content).map((e,t)=>(0,i.jsx)(`span`,{className:e.className,children:e.text},t))})}),p&&(0,i.jsx)(`div`,{className:`flex-shrink-0 px-2 flex items-center opacity-0 group-hover:opacity-100 transition-opacity`,children:(0,i.jsx)(d,{content:e.content,onCopy:c})})]})}function p({lines:e,maxLines:a=1e4,showLineNumbers:o=!1,showTimestamps:s=!1,autoScroll:c=!0,searchable:l=!1,filterable:d=!1,onCopy:p,onClear:m,height:h=400,className:g}){let _=n.useRef(null),[v,y]=n.useState(0),[b,x]=n.useState(300),[S,C]=n.useState(``),[w,T]=n.useState(!1),[E,D]=n.useState(()=>new Set([`info`,`warn`,`error`,`debug`])),[O,k]=n.useState(!1),[A,j]=n.useState(!1),M=n.useRef(e.length),N=n.useMemo(()=>e.length>a?e.slice(e.length-a):e,[e,a]),P=n.useMemo(()=>{let e=N;if(d&&(e=e.filter(e=>e.level?E.has(e.level):!0)),S){let t=S.toLowerCase();e=e.filter(e=>e.content.toLowerCase().includes(t))}return e},[N,E,S,d]),F=n.useMemo(()=>{if(!S)return new Set;let e=S.toLowerCase(),t=new Set;return P.forEach((n,r)=>{n.content.toLowerCase().includes(e)&&t.add(r)}),t},[P,S]);n.useEffect(()=>{let e=_.current;if(!e)return;let t=()=>{x(e.clientHeight)};t();let n=new ResizeObserver(t);return n.observe(e),()=>n.disconnect()},[]),n.useEffect(()=>{if(c&&!A&&e.length>M.current){let e=_.current;e&&(e.scrollTop=e.scrollHeight)}M.current=e.length},[e.length,c,A]);let{totalHeight:I,visibleItems:L}=u(P.length,24,b,v),R=e=>{let t=e.currentTarget;y(t.scrollTop);let n=t.scrollHeight-t.scrollTop-t.clientHeight<50;j(!n)},z=async()=>{let e=P.map(e=>e.content).join(`
+`);try{await navigator.clipboard.writeText(e),p?.(e)}catch{}},B=e=>{D(t=>{let n=new Set(t);return n.has(e)?n.delete(e):n.add(e),n})},V=()=>{let e=_.current;e&&(e.scrollTop=e.scrollHeight,j(!1))},H={error:`bg-red-500/20 text-red-400 border-red-500/50`,warn:`bg-yellow-500/20 text-yellow-400 border-yellow-500/50`,info:`bg-blue-500/20 text-blue-400 border-blue-500/50`,debug:`bg-gray-500/20 text-gray-400 border-gray-500/50`},U=typeof h==`number`?`${h}px`:h;return(0,i.jsxs)(`div`,{className:t.cn(`flex flex-col rounded-lg overflow-hidden border border-gray-700 bg-[#1a1a2e]`,g),style:{height:U},children:[(0,i.jsxs)(`div`,{className:`flex items-center justify-between px-4 py-2 bg-[#16162a] border-b border-gray-700`,children:[(0,i.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,i.jsxs)(`div`,{className:`flex gap-1.5`,children:[(0,i.jsx)(`div`,{className:`w-3 h-3 rounded-full bg-red-500`}),(0,i.jsx)(`div`,{className:`w-3 h-3 rounded-full bg-yellow-500`}),(0,i.jsx)(`div`,{className:`w-3 h-3 rounded-full bg-green-500`})]}),(0,i.jsx)(`span`,{className:`text-gray-400 text-sm ml-2 font-mono`,children:`terminal`})]}),(0,i.jsxs)(`div`,{className:`flex items-center gap-2`,children:[l&&(0,i.jsx)(i.Fragment,{children:w?(0,i.jsxs)(`div`,{className:`flex items-center gap-1 bg-gray-800 rounded px-2 py-1`,children:[(0,i.jsx)(r.Search,{className:`h-3.5 w-3.5 text-gray-400`}),(0,i.jsx)(`input`,{type:`text`,value:S,onChange:e=>C(e.target.value),placeholder:`Search...`,className:`bg-transparent text-sm text-white placeholder-gray-500 outline-none w-32`,autoFocus:!0}),(0,i.jsx)(`button`,{onClick:()=>{C(``),T(!1)},className:`p-0.5 hover:bg-gray-700 rounded`,children:(0,i.jsx)(r.X,{className:`h-3.5 w-3.5 text-gray-400`})})]}):(0,i.jsx)(`button`,{onClick:()=>T(!0),className:`p-1.5 hover:bg-gray-700 rounded transition-colors`,title:`Search (Ctrl+F)`,children:(0,i.jsx)(r.Search,{className:`h-4 w-4 text-gray-400`})})}),d&&(0,i.jsxs)(`div`,{className:`relative`,children:[(0,i.jsx)(`button`,{onClick:()=>k(!O),className:t.cn(`p-1.5 hover:bg-gray-700 rounded transition-colors`,O&&`bg-gray-700`),title:`Filter by level`,children:(0,i.jsx)(r.Filter,{className:`h-4 w-4 text-gray-400`})}),O&&(0,i.jsx)(`div`,{className:`absolute right-0 top-full mt-1 bg-gray-800 border border-gray-700 rounded-lg p-2 shadow-xl z-10`,children:[`error`,`warn`,`info`,`debug`].map(e=>(0,i.jsxs)(`button`,{onClick:()=>B(e),className:t.cn(`flex items-center gap-2 w-full px-3 py-1.5 rounded text-sm capitalize transition-colors`,E.has(e)?H[e]:`text-gray-500 hover:bg-gray-700`),children:[(0,i.jsx)(`div`,{className:t.cn(`w-2 h-2 rounded-full`,E.has(e)?`opacity-100`:`opacity-30`,e===`error`&&`bg-red-500`,e===`warn`&&`bg-yellow-500`,e===`info`&&`bg-blue-500`,e===`debug`&&`bg-gray-500`)}),e]},e))})]}),(0,i.jsx)(`button`,{onClick:z,className:`p-1.5 hover:bg-gray-700 rounded transition-colors`,title:`Copy all`,children:(0,i.jsx)(r.Copy,{className:`h-4 w-4 text-gray-400`})}),m&&(0,i.jsx)(`button`,{onClick:m,className:`p-1.5 hover:bg-gray-700 rounded transition-colors`,title:`Clear`,children:(0,i.jsx)(r.Trash2,{className:`h-4 w-4 text-gray-400`})})]})]}),(0,i.jsx)(`div`,{ref:_,className:`flex-1 overflow-auto font-mono text-sm text-gray-200`,onScroll:R,children:P.length===0?(0,i.jsx)(`div`,{className:`flex items-center justify-center h-full text-gray-500`,children:S?`No matching logs found`:`No logs yet`}):(0,i.jsx)(`div`,{className:`relative`,style:{height:I},children:L.map(({index:e,style:t})=>(0,i.jsx)(f,{line:P[e],index:e,showLineNumbers:o,showTimestamps:s,onCopy:p,style:t,isHighlighted:F.has(e)},e))})}),(0,i.jsxs)(`div`,{className:`flex items-center justify-between px-4 py-1 bg-[#16162a] border-t border-gray-700 text-xs text-gray-500`,children:[(0,i.jsxs)(`div`,{className:`flex items-center gap-4`,children:[(0,i.jsxs)(`span`,{children:[P.length,` lines`]}),S&&(0,i.jsxs)(`span`,{children:[F.size,` matches`]})]}),(0,i.jsxs)(`div`,{className:`flex items-center gap-2`,children:[A&&c&&(0,i.jsx)(`button`,{onClick:V,className:`px-2 py-0.5 bg-blue-500/20 text-blue-400 rounded hover:bg-blue-500/30 transition-colors`,children:`Scroll to bottom`}),c&&!A&&(0,i.jsx)(`span`,{className:`text-green-400`,children:`Auto-scroll enabled`})]})]})]})}function m(e={}){let{maxLines:t=1e4}=e,[r,i]=n.useState([]),a=n.useCallback((e,n,r)=>{i(i=>{let a=[...i,{content:e,level:n,timestamp:r??new Date}];return a.length>t?a.slice(a.length-t):a})},[t]);return{lines:r,addLine:a,addLines:n.useCallback(e=>{i(n=>{let r=[...n,...e];return r.length>t?r.slice(r.length-t):r})},[t]),clear:n.useCallback(()=>{i([])},[]),log:n.useCallback(e=>a(e,`info`),[a]),warn:n.useCallback(e=>a(e,`warn`),[a]),error:n.useCallback(e=>a(e,`error`),[a]),debug:n.useCallback(e=>a(e,`debug`),[a])}}exports.WakaTerminalOutput=p,exports.default=p,exports.useTerminalOutput=m;