@wakastellar/ui 4.0.0-dev.0 → 4.0.1

package/dist/components/waka-power-up/index.cjs.js

@@ -0,0 +1,82 @@
+"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={speed:{icon:r.Zap,color:`#fbbf24`,gradient:`from-yellow-400 via-amber-500 to-orange-500`},shield:{icon:r.Shield,color:`#3b82f6`,gradient:`from-blue-400 via-blue-500 to-indigo-600`},damage:{icon:r.Flame,color:`#ef4444`,gradient:`from-red-400 via-red-500 to-orange-600`},time:{icon:r.Clock,color:`#8b5cf6`,gradient:`from-purple-400 via-violet-500 to-indigo-500`},star:{icon:r.Star,color:`#f59e0b`,gradient:`from-amber-300 via-yellow-400 to-orange-400`},boost:{icon:r.Rocket,color:`#06b6d4`,gradient:`from-cyan-400 via-teal-500 to-emerald-500`},accuracy:{icon:r.Target,color:`#10b981`,gradient:`from-emerald-400 via-green-500 to-teal-500`},health:{icon:r.Heart,color:`#ec4899`,gradient:`from-pink-400 via-rose-500 to-red-400`},coins:{icon:r.Coins,color:`#fcd34d`,gradient:`from-yellow-300 via-amber-400 to-yellow-500`},luck:{icon:r.Sparkles,color:`#a855f7`,gradient:`from-purple-400 via-fuchsia-500 to-pink-500`}},o={sm:{container:`p-2`,icon:`h-6 w-6`,iconContainer:`h-10 w-10`,title:`text-xs font-semibold`,description:`text-[10px]`,multiplier:`text-[10px] px-1.5 py-0.5`,countdown:`text-xs`,stack:`h-4 w-4 text-[10px]`,glowSize:60},md:{container:`p-3`,icon:`h-8 w-8`,iconContainer:`h-14 w-14`,title:`text-sm font-semibold`,description:`text-xs`,multiplier:`text-xs px-2 py-0.5`,countdown:`text-sm`,stack:`h-5 w-5 text-xs`,glowSize:80},lg:{container:`p-4`,icon:`h-10 w-10`,iconContainer:`h-18 w-18`,title:`text-base font-semibold`,description:`text-sm`,multiplier:`text-sm px-2.5 py-1`,countdown:`text-base`,stack:`h-6 w-6 text-sm`,glowSize:100}};function s(e){if(e<=0)return`0s`;let t=Math.floor(e/1e3),n=Math.floor(t/60),r=Math.floor(n/60);return r>0?`${r}h ${n%60}m`:n>0?`${n}m ${t%60}s`:`${t}s`}function c(e){return e>=1?Number.isInteger(e)?`x${e}`:`x${e.toFixed(1)}`:`+${Math.round((e-1)*100)}%`}function l(e){if(e.type===`custom`)return{icon:e.customIcon||r.Sparkles,color:e.customColor||`#a855f7`,gradient:`from-purple-400 via-fuchsia-500 to-pink-500`};let t=a[e.type];return{...t,color:e.customColor||t.color}}function u({color:e,size:n,intensity:r=.6,pulse:a}){return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(`div`,{className:t.cn(`absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 rounded-full blur-xl`,a&&`animate-power-up-glow`),style:{width:n,height:n,background:`radial-gradient(circle, ${e} 0%, transparent 70%)`,opacity:r}}),(0,i.jsx)(`div`,{className:t.cn(`absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 rounded-full blur-md`,a&&`animate-power-up-glow-inner`),style:{width:n*.6,height:n*.6,background:`radial-gradient(circle, ${e} 0%, transparent 60%)`,opacity:r*.8}})]})}function d({powerUp:e,size:n,glowEnabled:r,pulseEnabled:a,isActivating:s}){let c=o[n],{icon:d,color:f,gradient:p}=l(e);return(0,i.jsxs)(`div`,{className:`relative`,children:[r&&e.isActive&&(0,i.jsx)(u,{color:f,size:c.glowSize,pulse:a}),s&&(0,i.jsx)(`div`,{className:`absolute inset-0 z-20`,children:[...Array(8)].map((e,t)=>(0,i.jsx)(`div`,{className:`absolute left-1/2 top-1/2 animate-activation-burst`,style:{"--angle":`${t/8*360}deg`,"--distance":`${c.glowSize*.8}px`},children:(0,i.jsx)(`div`,{className:`h-2 w-2 rounded-full`,style:{backgroundColor:f,boxShadow:`0 0 8px ${f}`}})},t))}),(0,i.jsxs)(`div`,{className:t.cn(`relative z-10 flex items-center justify-center rounded-xl`,`bg-gradient-to-br ${p}`,c.iconContainer,a&&e.isActive&&`animate-power-up-pulse`,s&&`animate-activation-pop`),style:{boxShadow:e.isActive?`0 0 20px ${f}80, 0 0 40px ${f}40, inset 0 1px 0 rgba(255,255,255,0.3)`:`0 0 10px ${f}40`},children:[(0,i.jsx)(`div`,{className:`absolute inset-0 rounded-xl`,style:{background:`radial-gradient(circle at 30% 30%, rgba(255,255,255,0.4) 0%, transparent 50%)`}}),(0,i.jsx)(d,{className:t.cn(c.icon,`text-white drop-shadow-lg relative z-10`)}),e.isActive&&(0,i.jsx)(`div`,{className:`absolute -inset-1 rounded-xl animate-power-up-ring`,style:{border:`2px solid ${f}`,opacity:.6}})]}),e.stackCount&&e.stackCount>1&&(0,i.jsx)(`div`,{className:t.cn(`absolute -right-1 -top-1 z-20 flex items-center justify-center rounded-full bg-white font-bold shadow-lg`,c.stack),style:{color:f},children:e.stackCount})]})}function f({remainingTime:e,totalDuration:n,color:r,size:a}){let c=o[a],l=e/n*100,u=l<20,d=l<10;return(0,i.jsxs)(`div`,{className:`w-full`,children:[(0,i.jsx)(`div`,{className:t.cn(`mb-1 text-center font-mono tabular-nums`,c.countdown,d&&`text-red-500 animate-pulse`,u&&!d&&`text-orange-500`),children:s(e)}),(0,i.jsx)(`div`,{className:`h-1.5 w-full overflow-hidden rounded-full bg-muted`,children:(0,i.jsx)(`div`,{className:t.cn(`h-full rounded-full transition-all duration-200`,d&&`animate-pulse`),style:{width:`${l}%`,backgroundColor:d?`#ef4444`:u?`#f97316`:r,boxShadow:`0 0 8px ${d?`#ef4444`:u?`#f97316`:r}80`}})})]})}function p({powerUp:e,size:n,showCountdown:r,showDescription:a,glowEnabled:s,pulseEnabled:u,remainingTime:p,isActivating:m,onClick:h,className:g}){let _=o[n],{color:v,gradient:y}=l(e);return(0,i.jsxs)(`div`,{className:t.cn(`relative overflow-hidden rounded-xl border bg-card transition-all duration-300`,e.isActive&&`ring-2`,h&&`cursor-pointer hover:scale-[1.02] active:scale-[0.98]`,_.container,g),style:{borderColor:e.isActive?`${v}60`:void 0,"--tw-ring-color":v,boxShadow:e.isActive?`0 0 20px ${v}30, inset 0 0 30px ${v}10`:void 0},onClick:h,children:[(0,i.jsx)(`div`,{className:`absolute inset-0 opacity-10`,style:{background:`linear-gradient(135deg, ${v}40 0%, transparent 50%, ${v}20 100%)`}}),(0,i.jsxs)(`div`,{className:`relative z-10 flex gap-3`,children:[(0,i.jsx)(d,{powerUp:e,size:n,glowEnabled:s,pulseEnabled:u,isActivating:m}),(0,i.jsxs)(`div`,{className:`flex flex-1 flex-col justify-center gap-1`,children:[(0,i.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,i.jsx)(`span`,{className:t.cn(_.title,`text-foreground`),children:e.name}),(0,i.jsx)(`span`,{className:t.cn(`rounded-full font-bold`,_.multiplier,`bg-gradient-to-r ${y} text-white`),children:c(e.multiplier)})]}),a&&(0,i.jsx)(`p`,{className:t.cn(_.description,`text-muted-foreground line-clamp-2`),children:e.description}),r&&e.isActive&&(0,i.jsx)(`div`,{className:`mt-1`,children:(0,i.jsx)(f,{remainingTime:p,totalDuration:e.duration,color:v,size:n})})]})]}),e.isActive&&(0,i.jsx)(`div`,{className:`absolute inset-0 animate-power-up-shine pointer-events-none`,children:(0,i.jsx)(`div`,{className:`h-full w-[200%] -translate-x-full`,style:{background:`linear-gradient(90deg, transparent 0%, ${v}20 50%, transparent 100%)`}})})]})}function m({powerUp:e,size:n,glowEnabled:r,pulseEnabled:a,remainingTime:u,isActivating:f,onClick:p,className:m}){let h=o[n],{color:g,gradient:_}=l(e),v=u/e.duration*100;return(0,i.jsxs)(`div`,{className:t.cn(`relative inline-flex items-center gap-2 rounded-full border px-3 py-1.5 transition-all duration-300`,p&&`cursor-pointer hover:scale-105 active:scale-95`,m),style:{borderColor:`${g}60`,backgroundColor:`${g}15`,boxShadow:e.isActive?`0 0 15px ${g}40`:void 0},onClick:p,children:[(0,i.jsx)(`svg`,{className:`absolute inset-0 h-full w-full -rotate-90`,style:{opacity:.3},children:(0,i.jsx)(`rect`,{x:`1`,y:`1`,rx:`9999`,ry:`9999`,width:`calc(100% - 2px)`,height:`calc(100% - 2px)`,fill:`none`,stroke:g,strokeWidth:`2`,strokeDasharray:`${v} ${100-v}`,pathLength:`100`})}),(0,i.jsxs)(`div`,{className:`relative`,children:[r&&e.isActive&&(0,i.jsx)(`div`,{className:`absolute -inset-1 rounded-full blur-sm`,style:{backgroundColor:`${g}60`}}),(0,i.jsx)(d,{powerUp:e,size:`sm`,glowEnabled:!1,pulseEnabled:a,isActivating:f})]}),(0,i.jsx)(`span`,{className:t.cn(`font-bold`,h.multiplier,`bg-gradient-to-r ${_} bg-clip-text text-transparent`),children:c(e.multiplier)}),e.isActive&&(0,i.jsx)(`span`,{className:t.cn(`font-mono tabular-nums`,h.countdown,v<20?`text-red-500`:`text-muted-foreground`),children:s(u)})]})}function h({powerUp:e,size:n,glowEnabled:r,pulseEnabled:a,isActivating:o,onClick:s,className:l}){return(0,i.jsx)(`div`,{className:t.cn(`relative inline-block`,s&&`cursor-pointer`,l),onClick:s,title:`${e.name}: ${c(e.multiplier)}`,children:(0,i.jsx)(d,{powerUp:e,size:n,glowEnabled:r,pulseEnabled:a,isActivating:o})})}function g({powerUp:e,size:t=`md`,variant:r=`card`,showCountdown:a=!0,showDescription:o=!0,glowEnabled:s=!0,pulseEnabled:c=!0,onExpire:l,onClick:u,className:d}){let[f,g]=n.useState(e.duration),[_,v]=n.useState(!1),y=n.useRef(e.isActive),b=n.useRef(null);n.useEffect(()=>{e.isActive&&!y.current&&(v(!0),setTimeout(()=>v(!1),600)),y.current=e.isActive},[e.isActive]),n.useEffect(()=>{if(!e.isActive||!e.activatedAt){g(e.duration);return}let t=()=>{let t=Date.now()-e.activatedAt,n=Math.max(0,e.duration-t);g(n),n<=0&&(l?.(e),b.current&&=(clearInterval(b.current),null))};return t(),b.current=setInterval(t,100),()=>{b.current&&=(clearInterval(b.current),null)}},[e.isActive,e.activatedAt,e.duration,l,e]);let x=n.useCallback(()=>{u?.(e)},[u,e]),S={powerUp:e,size:t,glowEnabled:s,pulseEnabled:c,remainingTime:f,isActivating:_,onClick:u?x:void 0,className:d};return(0,i.jsxs)(i.Fragment,{children:[r===`card`&&(0,i.jsx)(p,{...S,showCountdown:a,showDescription:o}),r===`badge`&&(0,i.jsx)(m,{...S}),r===`compact`&&(0,i.jsx)(h,{...S}),(0,i.jsx)(`style`,{children:`
+        @keyframes power-up-glow {
+          0%, 100% {
+            opacity: 0.4;
+            transform: translate(-50%, -50%) scale(1);
+          }
+          50% {
+            opacity: 0.7;
+            transform: translate(-50%, -50%) scale(1.1);
+          }
+        }
+        .animate-power-up-glow {
+          animation: power-up-glow 2s ease-in-out infinite;
+        }
+
+        @keyframes power-up-glow-inner {
+          0%, 100% {
+            opacity: 0.5;
+            transform: translate(-50%, -50%) scale(1);
+          }
+          50% {
+            opacity: 0.9;
+            transform: translate(-50%, -50%) scale(1.15);
+          }
+        }
+        .animate-power-up-glow-inner {
+          animation: power-up-glow-inner 1.5s ease-in-out infinite;
+        }
+
+        @keyframes power-up-pulse {
+          0%, 100% { transform: scale(1); }
+          50% { transform: scale(1.05); }
+        }
+        .animate-power-up-pulse {
+          animation: power-up-pulse 1.5s ease-in-out infinite;
+        }
+
+        @keyframes power-up-ring {
+          0%, 100% {
+            transform: scale(1);
+            opacity: 0.6;
+          }
+          50% {
+            transform: scale(1.1);
+            opacity: 0.3;
+          }
+        }
+        .animate-power-up-ring {
+          animation: power-up-ring 2s ease-in-out infinite;
+        }
+
+        @keyframes power-up-shine {
+          0% { transform: translateX(-100%); }
+          50%, 100% { transform: translateX(100%); }
+        }
+        .animate-power-up-shine {
+          animation: power-up-shine 3s ease-in-out infinite;
+        }
+
+        @keyframes activation-burst {
+          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);
+            opacity: 0;
+          }
+        }
+        .animate-activation-burst {
+          animation: activation-burst 0.6s ease-out forwards;
+        }
+
+        @keyframes activation-pop {
+          0% { transform: scale(0.8); opacity: 0.5; }
+          50% { transform: scale(1.2); }
+          100% { transform: scale(1); opacity: 1; }
+        }
+        .animate-activation-pop {
+          animation: activation-pop 0.4s ease-out forwards;
+        }
+      `})]})}g.displayName=`WakaPowerUp`;function _({initialPowerUps:e=[],onPowerUpExpire:t,onPowerUpActivate:r}={}){let[i,a]=n.useState(e.map(e=>({...e,isActive:!0,activatedAt:e.activatedAt||Date.now()})));return n.useEffect(()=>{let e=setInterval(()=>{let e=Date.now();a(n=>{let r=[],i=[];for(let t of n)t.activatedAt&&e-t.activatedAt>=t.duration?i.push(t):r.push(t);return i.forEach(e=>t?.(e)),r})},100);return()=>clearInterval(e)},[t]),{activePowerUps:i,activate:n.useCallback(e=>{let t={...e,isActive:!0,activatedAt:Date.now(),stackCount:e.stackCount||1};a(n=>{let r=n.findIndex(t=>t.id===e.id);if(r>=0){let e=n[r],t=e.maxStack||5,i=Math.min((e.stackCount||1)+1,t),a=[...n];return a[r]={...e,stackCount:i,activatedAt:Date.now()},a}return[...n,t]}),r?.(t)},[r]),deactivate:n.useCallback(e=>{a(t=>t.filter(t=>t.id!==e))},[]),getRemainingTime:n.useCallback(e=>{let t=i.find(t=>t.id===e);if(!t||!t.activatedAt)return 0;let n=Date.now()-t.activatedAt;return Math.max(0,t.duration-n)},[i]),isTypeActive:n.useCallback(e=>i.some(t=>t.type===e&&t.isActive),[i]),getCombinedMultiplier:n.useCallback(e=>{let t=i.filter(t=>t.type===e&&t.isActive);return t.length===0?1:t.reduce((e,t)=>{let n=t.stackCount||1;return e*t.multiplier**+n},1)},[i]),stack:n.useCallback((e,t=`count`)=>{a(n=>{let r=n.findIndex(t=>t.id===e);if(r<0)return n;let i=n[r],a=[...n];if(t===`count`){let e=i.maxStack||5;a[r]={...i,stackCount:Math.min((i.stackCount||1)+1,e)}}else a[r]={...i,activatedAt:Date.now()};return a})},[]),clearAll:n.useCallback(()=>{a([])},[])}}function v({powerUps:e,size:n=`md`,variant:r=`card`,direction:a=`vertical`,gap:o=`md`,onExpire:s,onClick:c,className:l}){return(0,i.jsx)(`div`,{className:t.cn(`flex`,a===`horizontal`?`flex-row flex-wrap`:`flex-col`,{sm:`gap-2`,md:`gap-3`,lg:`gap-4`}[o],l),children:e.map(e=>(0,i.jsx)(g,{powerUp:e,size:n,variant:r,onExpire:s,onClick:c},e.id))})}v.displayName=`WakaPowerUpList`,exports.WakaPowerUp=g,exports.WakaPowerUpList=v,exports.usePowerUp=_;

package/dist/components/waka-power-up/index.es.js

@@ -0,0 +1,477 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.es.js";
+import * as t from "react";
+import { Clock as n, Coins as r, Flame as i, Heart as a, Rocket as o, Shield as s, Sparkles as c, Star as l, Target as u, Zap as d } from "lucide-react";
+import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
+//#region src/components/waka-power-up/index.tsx
+var h = {
+	speed: {
+		icon: d,
+		color: "#fbbf24",
+		gradient: "from-yellow-400 via-amber-500 to-orange-500"
+	},
+	shield: {
+		icon: s,
+		color: "#3b82f6",
+		gradient: "from-blue-400 via-blue-500 to-indigo-600"
+	},
+	damage: {
+		icon: i,
+		color: "#ef4444",
+		gradient: "from-red-400 via-red-500 to-orange-600"
+	},
+	time: {
+		icon: n,
+		color: "#8b5cf6",
+		gradient: "from-purple-400 via-violet-500 to-indigo-500"
+	},
+	star: {
+		icon: l,
+		color: "#f59e0b",
+		gradient: "from-amber-300 via-yellow-400 to-orange-400"
+	},
+	boost: {
+		icon: o,
+		color: "#06b6d4",
+		gradient: "from-cyan-400 via-teal-500 to-emerald-500"
+	},
+	accuracy: {
+		icon: u,
+		color: "#10b981",
+		gradient: "from-emerald-400 via-green-500 to-teal-500"
+	},
+	health: {
+		icon: a,
+		color: "#ec4899",
+		gradient: "from-pink-400 via-rose-500 to-red-400"
+	},
+	coins: {
+		icon: r,
+		color: "#fcd34d",
+		gradient: "from-yellow-300 via-amber-400 to-yellow-500"
+	},
+	luck: {
+		icon: c,
+		color: "#a855f7",
+		gradient: "from-purple-400 via-fuchsia-500 to-pink-500"
+	}
+}, g = {
+	sm: {
+		container: "p-2",
+		icon: "h-6 w-6",
+		iconContainer: "h-10 w-10",
+		title: "text-xs font-semibold",
+		description: "text-[10px]",
+		multiplier: "text-[10px] px-1.5 py-0.5",
+		countdown: "text-xs",
+		stack: "h-4 w-4 text-[10px]",
+		glowSize: 60
+	},
+	md: {
+		container: "p-3",
+		icon: "h-8 w-8",
+		iconContainer: "h-14 w-14",
+		title: "text-sm font-semibold",
+		description: "text-xs",
+		multiplier: "text-xs px-2 py-0.5",
+		countdown: "text-sm",
+		stack: "h-5 w-5 text-xs",
+		glowSize: 80
+	},
+	lg: {
+		container: "p-4",
+		icon: "h-10 w-10",
+		iconContainer: "h-18 w-18",
+		title: "text-base font-semibold",
+		description: "text-sm",
+		multiplier: "text-sm px-2.5 py-1",
+		countdown: "text-base",
+		stack: "h-6 w-6 text-sm",
+		glowSize: 100
+	}
+};
+function _(e) {
+	if (e <= 0) return "0s";
+	let t = Math.floor(e / 1e3), n = Math.floor(t / 60), r = Math.floor(n / 60);
+	return r > 0 ? `${r}h ${n % 60}m` : n > 0 ? `${n}m ${t % 60}s` : `${t}s`;
+}
+function v(e) {
+	return e >= 1 ? Number.isInteger(e) ? `x${e}` : `x${e.toFixed(1)}` : `+${Math.round((e - 1) * 100)}%`;
+}
+function y(e) {
+	if (e.type === "custom") return {
+		icon: e.customIcon || c,
+		color: e.customColor || "#a855f7",
+		gradient: "from-purple-400 via-fuchsia-500 to-pink-500"
+	};
+	let t = h[e.type];
+	return {
+		...t,
+		color: e.customColor || t.color
+	};
+}
+function b({ color: t, size: n, intensity: r = .6, pulse: i }) {
+	return /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p("div", {
+		className: e("absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 rounded-full blur-xl", i && "animate-power-up-glow"),
+		style: {
+			width: n,
+			height: n,
+			background: `radial-gradient(circle, ${t} 0%, transparent 70%)`,
+			opacity: r
+		}
+	}), /* @__PURE__ */ p("div", {
+		className: e("absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2 rounded-full blur-md", i && "animate-power-up-glow-inner"),
+		style: {
+			width: n * .6,
+			height: n * .6,
+			background: `radial-gradient(circle, ${t} 0%, transparent 60%)`,
+			opacity: r * .8
+		}
+	})] });
+}
+function x({ powerUp: t, size: n, glowEnabled: r, pulseEnabled: i, isActivating: a }) {
+	let o = g[n], { icon: s, color: c, gradient: l } = y(t);
+	return /* @__PURE__ */ m("div", {
+		className: "relative",
+		children: [
+			r && t.isActive && /* @__PURE__ */ p(b, {
+				color: c,
+				size: o.glowSize,
+				pulse: i
+			}),
+			a && /* @__PURE__ */ p("div", {
+				className: "absolute inset-0 z-20",
+				children: [...Array(8)].map((e, t) => /* @__PURE__ */ p("div", {
+					className: "absolute left-1/2 top-1/2 animate-activation-burst",
+					style: {
+						"--angle": `${t / 8 * 360}deg`,
+						"--distance": `${o.glowSize * .8}px`
+					},
+					children: /* @__PURE__ */ p("div", {
+						className: "h-2 w-2 rounded-full",
+						style: {
+							backgroundColor: c,
+							boxShadow: `0 0 8px ${c}`
+						}
+					})
+				}, t))
+			}),
+			/* @__PURE__ */ m("div", {
+				className: e("relative z-10 flex items-center justify-center rounded-xl", `bg-gradient-to-br ${l}`, o.iconContainer, i && t.isActive && "animate-power-up-pulse", a && "animate-activation-pop"),
+				style: { boxShadow: t.isActive ? `0 0 20px ${c}80, 0 0 40px ${c}40, inset 0 1px 0 rgba(255,255,255,0.3)` : `0 0 10px ${c}40` },
+				children: [
+					/* @__PURE__ */ p("div", {
+						className: "absolute inset-0 rounded-xl",
+						style: { background: "radial-gradient(circle at 30% 30%, rgba(255,255,255,0.4) 0%, transparent 50%)" }
+					}),
+					/* @__PURE__ */ p(s, { className: e(o.icon, "text-white drop-shadow-lg relative z-10") }),
+					t.isActive && /* @__PURE__ */ p("div", {
+						className: "absolute -inset-1 rounded-xl animate-power-up-ring",
+						style: {
+							border: `2px solid ${c}`,
+							opacity: .6
+						}
+					})
+				]
+			}),
+			t.stackCount && t.stackCount > 1 && /* @__PURE__ */ p("div", {
+				className: e("absolute -right-1 -top-1 z-20 flex items-center justify-center rounded-full bg-white font-bold shadow-lg", o.stack),
+				style: { color: c },
+				children: t.stackCount
+			})
+		]
+	});
+}
+function S({ remainingTime: t, totalDuration: n, color: r, size: i }) {
+	let a = g[i], o = t / n * 100, s = o < 20, c = o < 10;
+	return /* @__PURE__ */ m("div", {
+		className: "w-full",
+		children: [/* @__PURE__ */ p("div", {
+			className: e("mb-1 text-center font-mono tabular-nums", a.countdown, c && "text-red-500 animate-pulse", s && !c && "text-orange-500"),
+			children: _(t)
+		}), /* @__PURE__ */ p("div", {
+			className: "h-1.5 w-full overflow-hidden rounded-full bg-muted",
+			children: /* @__PURE__ */ p("div", {
+				className: e("h-full rounded-full transition-all duration-200", c && "animate-pulse"),
+				style: {
+					width: `${o}%`,
+					backgroundColor: c ? "#ef4444" : s ? "#f97316" : r,
+					boxShadow: `0 0 8px ${c ? "#ef4444" : s ? "#f97316" : r}80`
+				}
+			})
+		})]
+	});
+}
+function C({ powerUp: t, size: n, showCountdown: r, showDescription: i, glowEnabled: a, pulseEnabled: o, remainingTime: s, isActivating: c, onClick: l, className: u }) {
+	let d = g[n], { color: f, gradient: h } = y(t);
+	return /* @__PURE__ */ m("div", {
+		className: e("relative overflow-hidden rounded-xl border bg-card transition-all duration-300", t.isActive && "ring-2", l && "cursor-pointer hover:scale-[1.02] active:scale-[0.98]", d.container, u),
+		style: {
+			borderColor: t.isActive ? `${f}60` : void 0,
+			"--tw-ring-color": f,
+			boxShadow: t.isActive ? `0 0 20px ${f}30, inset 0 0 30px ${f}10` : void 0
+		},
+		onClick: l,
+		children: [
+			/* @__PURE__ */ p("div", {
+				className: "absolute inset-0 opacity-10",
+				style: { background: `linear-gradient(135deg, ${f}40 0%, transparent 50%, ${f}20 100%)` }
+			}),
+			/* @__PURE__ */ m("div", {
+				className: "relative z-10 flex gap-3",
+				children: [/* @__PURE__ */ p(x, {
+					powerUp: t,
+					size: n,
+					glowEnabled: a,
+					pulseEnabled: o,
+					isActivating: c
+				}), /* @__PURE__ */ m("div", {
+					className: "flex flex-1 flex-col justify-center gap-1",
+					children: [
+						/* @__PURE__ */ m("div", {
+							className: "flex items-center gap-2",
+							children: [/* @__PURE__ */ p("span", {
+								className: e(d.title, "text-foreground"),
+								children: t.name
+							}), /* @__PURE__ */ p("span", {
+								className: e("rounded-full font-bold", d.multiplier, `bg-gradient-to-r ${h} text-white`),
+								children: v(t.multiplier)
+							})]
+						}),
+						i && /* @__PURE__ */ p("p", {
+							className: e(d.description, "text-muted-foreground line-clamp-2"),
+							children: t.description
+						}),
+						r && t.isActive && /* @__PURE__ */ p("div", {
+							className: "mt-1",
+							children: /* @__PURE__ */ p(S, {
+								remainingTime: s,
+								totalDuration: t.duration,
+								color: f,
+								size: n
+							})
+						})
+					]
+				})]
+			}),
+			t.isActive && /* @__PURE__ */ p("div", {
+				className: "absolute inset-0 animate-power-up-shine pointer-events-none",
+				children: /* @__PURE__ */ p("div", {
+					className: "h-full w-[200%] -translate-x-full",
+					style: { background: `linear-gradient(90deg, transparent 0%, ${f}20 50%, transparent 100%)` }
+				})
+			})
+		]
+	});
+}
+function w({ powerUp: t, size: n, glowEnabled: r, pulseEnabled: i, remainingTime: a, isActivating: o, onClick: s, className: c }) {
+	let l = g[n], { color: u, gradient: d } = y(t), f = a / t.duration * 100;
+	return /* @__PURE__ */ m("div", {
+		className: e("relative inline-flex items-center gap-2 rounded-full border px-3 py-1.5 transition-all duration-300", s && "cursor-pointer hover:scale-105 active:scale-95", c),
+		style: {
+			borderColor: `${u}60`,
+			backgroundColor: `${u}15`,
+			boxShadow: t.isActive ? `0 0 15px ${u}40` : void 0
+		},
+		onClick: s,
+		children: [
+			/* @__PURE__ */ p("svg", {
+				className: "absolute inset-0 h-full w-full -rotate-90",
+				style: { opacity: .3 },
+				children: /* @__PURE__ */ p("rect", {
+					x: "1",
+					y: "1",
+					rx: "9999",
+					ry: "9999",
+					width: "calc(100% - 2px)",
+					height: "calc(100% - 2px)",
+					fill: "none",
+					stroke: u,
+					strokeWidth: "2",
+					strokeDasharray: `${f} ${100 - f}`,
+					pathLength: "100"
+				})
+			}),
+			/* @__PURE__ */ m("div", {
+				className: "relative",
+				children: [r && t.isActive && /* @__PURE__ */ p("div", {
+					className: "absolute -inset-1 rounded-full blur-sm",
+					style: { backgroundColor: `${u}60` }
+				}), /* @__PURE__ */ p(x, {
+					powerUp: t,
+					size: "sm",
+					glowEnabled: !1,
+					pulseEnabled: i,
+					isActivating: o
+				})]
+			}),
+			/* @__PURE__ */ p("span", {
+				className: e("font-bold", l.multiplier, `bg-gradient-to-r ${d} bg-clip-text text-transparent`),
+				children: v(t.multiplier)
+			}),
+			t.isActive && /* @__PURE__ */ p("span", {
+				className: e("font-mono tabular-nums", l.countdown, f < 20 ? "text-red-500" : "text-muted-foreground"),
+				children: _(a)
+			})
+		]
+	});
+}
+function T({ powerUp: t, size: n, glowEnabled: r, pulseEnabled: i, isActivating: a, onClick: o, className: s }) {
+	return /* @__PURE__ */ p("div", {
+		className: e("relative inline-block", o && "cursor-pointer", s),
+		onClick: o,
+		title: `${t.name}: ${v(t.multiplier)}`,
+		children: /* @__PURE__ */ p(x, {
+			powerUp: t,
+			size: n,
+			glowEnabled: r,
+			pulseEnabled: i,
+			isActivating: a
+		})
+	});
+}
+function E({ powerUp: e, size: n = "md", variant: r = "card", showCountdown: i = !0, showDescription: a = !0, glowEnabled: o = !0, pulseEnabled: s = !0, onExpire: c, onClick: l, className: u }) {
+	let [d, h] = t.useState(e.duration), [g, _] = t.useState(!1), v = t.useRef(e.isActive), y = t.useRef(null);
+	t.useEffect(() => {
+		e.isActive && !v.current && (_(!0), setTimeout(() => _(!1), 600)), v.current = e.isActive;
+	}, [e.isActive]), t.useEffect(() => {
+		if (!e.isActive || !e.activatedAt) {
+			h(e.duration);
+			return;
+		}
+		let t = () => {
+			let t = Date.now() - e.activatedAt, n = Math.max(0, e.duration - t);
+			h(n), n <= 0 && (c?.(e), y.current &&= (clearInterval(y.current), null));
+		};
+		return t(), y.current = setInterval(t, 100), () => {
+			y.current &&= (clearInterval(y.current), null);
+		};
+	}, [
+		e.isActive,
+		e.activatedAt,
+		e.duration,
+		c,
+		e
+	]);
+	let b = t.useCallback(() => {
+		l?.(e);
+	}, [l, e]), x = {
+		powerUp: e,
+		size: n,
+		glowEnabled: o,
+		pulseEnabled: s,
+		remainingTime: d,
+		isActivating: g,
+		onClick: l ? b : void 0,
+		className: u
+	};
+	return /* @__PURE__ */ m(f, { children: [
+		r === "card" && /* @__PURE__ */ p(C, {
+			...x,
+			showCountdown: i,
+			showDescription: a
+		}),
+		r === "badge" && /* @__PURE__ */ p(w, { ...x }),
+		r === "compact" && /* @__PURE__ */ p(T, { ...x }),
+		/* @__PURE__ */ p("style", { children: "\n        @keyframes power-up-glow {\n          0%, 100% {\n            opacity: 0.4;\n            transform: translate(-50%, -50%) scale(1);\n          }\n          50% {\n            opacity: 0.7;\n            transform: translate(-50%, -50%) scale(1.1);\n          }\n        }\n        .animate-power-up-glow {\n          animation: power-up-glow 2s ease-in-out infinite;\n        }\n\n        @keyframes power-up-glow-inner {\n          0%, 100% {\n            opacity: 0.5;\n            transform: translate(-50%, -50%) scale(1);\n          }\n          50% {\n            opacity: 0.9;\n            transform: translate(-50%, -50%) scale(1.15);\n          }\n        }\n        .animate-power-up-glow-inner {\n          animation: power-up-glow-inner 1.5s ease-in-out infinite;\n        }\n\n        @keyframes power-up-pulse {\n          0%, 100% { transform: scale(1); }\n          50% { transform: scale(1.05); }\n        }\n        .animate-power-up-pulse {\n          animation: power-up-pulse 1.5s ease-in-out infinite;\n        }\n\n        @keyframes power-up-ring {\n          0%, 100% {\n            transform: scale(1);\n            opacity: 0.6;\n          }\n          50% {\n            transform: scale(1.1);\n            opacity: 0.3;\n          }\n        }\n        .animate-power-up-ring {\n          animation: power-up-ring 2s ease-in-out infinite;\n        }\n\n        @keyframes power-up-shine {\n          0% { transform: translateX(-100%); }\n          50%, 100% { transform: translateX(100%); }\n        }\n        .animate-power-up-shine {\n          animation: power-up-shine 3s ease-in-out infinite;\n        }\n\n        @keyframes activation-burst {\n          0% {\n            transform: translate(-50%, -50%) rotate(var(--angle)) translateX(0) scale(1);\n            opacity: 1;\n          }\n          100% {\n            transform: translate(-50%, -50%) rotate(var(--angle)) translateX(var(--distance)) scale(0);\n            opacity: 0;\n          }\n        }\n        .animate-activation-burst {\n          animation: activation-burst 0.6s ease-out forwards;\n        }\n\n        @keyframes activation-pop {\n          0% { transform: scale(0.8); opacity: 0.5; }\n          50% { transform: scale(1.2); }\n          100% { transform: scale(1); opacity: 1; }\n        }\n        .animate-activation-pop {\n          animation: activation-pop 0.4s ease-out forwards;\n        }\n      " })
+	] });
+}
+E.displayName = "WakaPowerUp";
+function D({ initialPowerUps: e = [], onPowerUpExpire: n, onPowerUpActivate: r } = {}) {
+	let [i, a] = t.useState(e.map((e) => ({
+		...e,
+		isActive: !0,
+		activatedAt: e.activatedAt || Date.now()
+	})));
+	return t.useEffect(() => {
+		let e = setInterval(() => {
+			let e = Date.now();
+			a((t) => {
+				let r = [], i = [];
+				for (let n of t) n.activatedAt && e - n.activatedAt >= n.duration ? i.push(n) : r.push(n);
+				return i.forEach((e) => n?.(e)), r;
+			});
+		}, 100);
+		return () => clearInterval(e);
+	}, [n]), {
+		activePowerUps: i,
+		activate: t.useCallback((e) => {
+			let t = {
+				...e,
+				isActive: !0,
+				activatedAt: Date.now(),
+				stackCount: e.stackCount || 1
+			};
+			a((n) => {
+				let r = n.findIndex((t) => t.id === e.id);
+				if (r >= 0) {
+					let e = n[r], t = e.maxStack || 5, i = Math.min((e.stackCount || 1) + 1, t), a = [...n];
+					return a[r] = {
+						...e,
+						stackCount: i,
+						activatedAt: Date.now()
+					}, a;
+				}
+				return [...n, t];
+			}), r?.(t);
+		}, [r]),
+		deactivate: t.useCallback((e) => {
+			a((t) => t.filter((t) => t.id !== e));
+		}, []),
+		getRemainingTime: t.useCallback((e) => {
+			let t = i.find((t) => t.id === e);
+			if (!t || !t.activatedAt) return 0;
+			let n = Date.now() - t.activatedAt;
+			return Math.max(0, t.duration - n);
+		}, [i]),
+		isTypeActive: t.useCallback((e) => i.some((t) => t.type === e && t.isActive), [i]),
+		getCombinedMultiplier: t.useCallback((e) => {
+			let t = i.filter((t) => t.type === e && t.isActive);
+			return t.length === 0 ? 1 : t.reduce((e, t) => {
+				let n = t.stackCount || 1;
+				return e * t.multiplier ** +n;
+			}, 1);
+		}, [i]),
+		stack: t.useCallback((e, t = "count") => {
+			a((n) => {
+				let r = n.findIndex((t) => t.id === e);
+				if (r < 0) return n;
+				let i = n[r], a = [...n];
+				if (t === "count") {
+					let e = i.maxStack || 5;
+					a[r] = {
+						...i,
+						stackCount: Math.min((i.stackCount || 1) + 1, e)
+					};
+				} else a[r] = {
+					...i,
+					activatedAt: Date.now()
+				};
+				return a;
+			});
+		}, []),
+		clearAll: t.useCallback(() => {
+			a([]);
+		}, [])
+	};
+}
+function O({ powerUps: t, size: n = "md", variant: r = "card", direction: i = "vertical", gap: a = "md", onExpire: o, onClick: s, className: c }) {
+	return /* @__PURE__ */ p("div", {
+		className: e("flex", i === "horizontal" ? "flex-row flex-wrap" : "flex-col", {
+			sm: "gap-2",
+			md: "gap-3",
+			lg: "gap-4"
+		}[a], c),
+		children: t.map((e) => /* @__PURE__ */ p(E, {
+			powerUp: e,
+			size: n,
+			variant: r,
+			onExpire: o,
+			onClick: s
+		}, e.id))
+	});
+}
+O.displayName = "WakaPowerUpList";
+//#endregion
+export { E as WakaPowerUp, O as WakaPowerUpList, D as usePowerUp };

package/dist/components/waka-presence-indicator/index.cjs.js

@@ -0,0 +1,15 @@
+"use client";"use client";const e=require(`../../_virtual/_rolldown/runtime.cjs.js`),t=require(`../../utils/cn.cjs.js`),n=require(`../avatar/index.cjs.js`),r=require(`../dropdown-menu/index.cjs.js`);let i=require(`react`);i=e.__toESM(i);let a=require(`lucide-react`),o=require(`react/jsx-runtime`);function s(e){let t=new Date().getTime()-e.getTime(),n=Math.floor(t/6e4),r=Math.floor(n/60),i=Math.floor(r/24);return i>0?`${i}d`:r>0?`${r}h`:n>0?`${n}m`:`Just now`}function c(e){let t=new Date().getTime()-e.getTime(),n=Math.floor(t/6e4),r=Math.floor(n/60),i=Math.floor(r/24);return i>0?`${i} day${i>1?`s`:``} ago`:r>0?`${r} hour${r>1?`s`:``} ago`:n>0?`${n} minute${n>1?`s`:``} ago`:`Just now`}function l(e={}){let{initialState:t,onStatusChange:n,autoAwayTimeout:r,persistKey:a}=e,[o,l]=i.useState(()=>{if(a&&typeof window<`u`){let e=localStorage.getItem(a);if(e)try{let t=JSON.parse(e);return{status:t.status||`offline`,customMessage:t.customMessage,updatedAt:t.updatedAt?new Date(t.updatedAt):new Date,lastSeen:t.lastSeen?new Date(t.lastSeen):void 0,doNotDisturb:t.doNotDisturb||!1}}catch{}}return{status:t?.status||`offline`,customMessage:t?.customMessage,updatedAt:t?.updatedAt||new Date,lastSeen:t?.lastSeen,doNotDisturb:t?.doNotDisturb||!1}}),u=i.useRef(void 0),d=i.useRef(Date.now());return i.useEffect(()=>{a&&typeof window<`u`&&localStorage.setItem(a,JSON.stringify({status:o.status,customMessage:o.customMessage,updatedAt:o.updatedAt?.toISOString(),lastSeen:o.lastSeen?.toISOString(),doNotDisturb:o.doNotDisturb}))},[o,a]),i.useEffect(()=>{if(!r||o.status!==`online`)return;let e=()=>{d.current=Date.now(),o.status===`away`&&l(e=>({...e,status:`online`,updatedAt:new Date}))};return window.addEventListener(`mousemove`,e),window.addEventListener(`keydown`,e),window.addEventListener(`click`,e),window.addEventListener(`scroll`,e),u.current=setInterval(()=>{Date.now()-d.current>=r&&o.status===`online`&&l(e=>({...e,status:`away`,updatedAt:new Date}))},1e4),()=>{window.removeEventListener(`mousemove`,e),window.removeEventListener(`keydown`,e),window.removeEventListener(`click`,e),window.removeEventListener(`scroll`,e),u.current&&clearInterval(u.current)}},[r,o.status]),{presence:o,setStatus:i.useCallback(e=>{l(t=>({...t,status:e,updatedAt:new Date,lastSeen:t.status!==`offline`&&e===`offline`?new Date:t.lastSeen})),n?.(e)},[n]),setCustomMessage:i.useCallback(e=>{l(t=>({...t,customMessage:e}))},[]),toggleDoNotDisturb:i.useCallback(()=>{l(e=>({...e,doNotDisturb:!e.doNotDisturb}))},[]),setPresence:i.useCallback(e=>{l(t=>({...t,...e,updatedAt:e.status===t.status?t.updatedAt:new Date})),e.status&&e.status!==o.status&&n?.(e.status)},[n,o.status]),getStatusDuration:i.useCallback(()=>o.updatedAt?s(o.updatedAt):null,[o.updatedAt]),getLastSeen:i.useCallback(()=>o.lastSeen?c(o.lastSeen):null,[o.lastSeen])}}var u={online:{label:`Online`,color:`bg-green-500`,bgColor:`bg-green-500/20`,ringColor:`ring-green-500/50`,icon:a.Circle},away:{label:`Away`,color:`bg-yellow-500`,bgColor:`bg-yellow-500/20`,ringColor:`ring-yellow-500/50`,icon:a.Clock},busy:{label:`Busy`,color:`bg-red-500`,bgColor:`bg-red-500/20`,ringColor:`ring-red-500/50`,icon:a.MinusCircle},offline:{label:`Offline`,color:`bg-gray-400`,bgColor:`bg-gray-400/20`,ringColor:`ring-gray-400/50`,icon:a.Circle},invisible:{label:`Invisible`,color:`bg-gray-400`,bgColor:`bg-gray-400/20`,ringColor:`ring-gray-400/50`,icon:a.EyeOff}},d={xs:{dot:`h-2 w-2`,dotPosition:`-bottom-0 -right-0`,avatar:`h-6 w-6`,text:`text-xs`,icon:`h-2 w-2`,ring:`ring-1`,padding:`p-0.5`},sm:{dot:`h-2.5 w-2.5`,dotPosition:`-bottom-0.5 -right-0.5`,avatar:`h-8 w-8`,text:`text-xs`,icon:`h-2.5 w-2.5`,ring:`ring-2`,padding:`p-0.5`},md:{dot:`h-3 w-3`,dotPosition:`-bottom-0.5 -right-0.5`,avatar:`h-10 w-10`,text:`text-sm`,icon:`h-3 w-3`,ring:`ring-2`,padding:`p-1`},lg:{dot:`h-4 w-4`,dotPosition:`-bottom-1 -right-1`,avatar:`h-12 w-12`,text:`text-base`,icon:`h-3.5 w-3.5`,ring:`ring-2`,padding:`p-1`},xl:{dot:`h-5 w-5`,dotPosition:`-bottom-1 -right-1`,avatar:`h-16 w-16`,text:`text-lg`,icon:`h-4 w-4`,ring:`ring-[3px]`,padding:`p-1.5`}};function f({status:e,size:n=`md`,pulse:r=!0,doNotDisturb:i=!1,className:a}){let s=u[e],c=d[n],l=r&&e===`online`&&!i;return(0,o.jsxs)(`div`,{className:t.cn(`relative inline-flex`,a),children:[l&&(0,o.jsx)(`span`,{className:t.cn(`absolute inset-0 rounded-full animate-presence-ping`,s.color,`opacity-75`)}),(0,o.jsx)(`span`,{className:t.cn(`relative inline-flex rounded-full`,c.dot,s.color,i&&`ring-1 ring-background`),children:i&&(0,o.jsx)(`span`,{className:`absolute inset-0 flex items-center justify-center`,children:(0,o.jsx)(`span`,{className:`h-[1px] w-2/3 bg-background rounded-full`})})}),(0,o.jsx)(`style`,{children:`
+        @keyframes presence-ping {
+          0% {
+            transform: scale(1);
+            opacity: 0.75;
+          }
+          75%, 100% {
+            transform: scale(2);
+            opacity: 0;
+          }
+        }
+        .animate-presence-ping {
+          animation: presence-ping 1.5s cubic-bezier(0, 0, 0.2, 1) infinite;
+        }
+      `})]})}function p({src:e,fallback:r,alt:i,status:a,size:s=`md`,pulse:c=!0,doNotDisturb:l=!1,className:p,showRing:m=!1,onClick:h}){let g=u[a],_=d[s];return(0,o.jsxs)(`div`,{className:t.cn(`relative inline-flex`,h&&`cursor-pointer`,p),onClick:h,children:[(0,o.jsxs)(n.Avatar,{className:t.cn(_.avatar,m&&[_.ring,`ring-offset-2 ring-offset-background`,g.ringColor]),children:[e&&(0,o.jsx)(n.AvatarImage,{src:e,alt:i||`User avatar`}),(0,o.jsx)(n.AvatarFallback,{className:`text-xs font-medium`,children:r||`?`})]}),(0,o.jsx)(`span`,{className:t.cn(`absolute flex items-center justify-center rounded-full ring-2 ring-background`,_.dot,_.dotPosition),children:(0,o.jsx)(f,{status:a,size:s,pulse:c,doNotDisturb:l})})]})}function m({status:e,customMessage:n,showDuration:r=!1,updatedAt:i,size:c=`md`,doNotDisturb:l=!1,className:p}){let m=u[e],h=d[c],g=i?s(i):null;return(0,o.jsxs)(`div`,{className:t.cn(`inline-flex items-center gap-2 rounded-full border px-3 py-1.5`,m.bgColor,p),children:[(0,o.jsx)(f,{status:e,size:`sm`,pulse:e===`online`,doNotDisturb:l}),(0,o.jsx)(`span`,{className:t.cn(`font-medium`,h.text),children:n||m.label}),r&&g&&g!==`Just now`&&(0,o.jsxs)(`span`,{className:t.cn(`text-muted-foreground`,h.text),children:[`for `,g]}),l&&(0,o.jsx)(a.BellOff,{className:t.cn(`text-muted-foreground`,h.icon)})]})}function h({presence:e,onStatusChange:n,onToggleDND:s,onSetCustomMessage:c,showCustomMessage:l=!0,size:m=`md`,disabled:h=!1,className:g,avatar:_,triggerVariant:v=`badge`}){let[y,b]=i.useState(e.customMessage||``),[x,S]=i.useState(!1),C=u[e.status],w=d[m],T=e=>{n(e)},E=()=>{c?.(y.trim()||void 0),S(!1)};return(0,o.jsxs)(r.DropdownMenu,{children:[(0,o.jsx)(r.DropdownMenuTrigger,{asChild:!0,disabled:h,children:(0,o.jsx)(`button`,{className:t.cn(`focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 rounded-full`,h&&`opacity-50 cursor-not-allowed`,g),type:`button`,children:v===`avatar`&&_?(0,o.jsx)(p,{src:_.src,fallback:_.fallback,alt:_.alt,status:e.status,size:m,doNotDisturb:e.doNotDisturb}):v===`minimal`?(0,o.jsxs)(`div`,{className:`flex items-center gap-1.5`,children:[(0,o.jsx)(f,{status:e.status,size:m,doNotDisturb:e.doNotDisturb}),(0,o.jsx)(a.ChevronDown,{className:t.cn(`text-muted-foreground`,w.icon)})]}):(0,o.jsxs)(`div`,{className:t.cn(`inline-flex items-center gap-2 rounded-full border px-3 py-1.5 transition-colors`,`hover:bg-muted/50 cursor-pointer`,C.bgColor),children:[(0,o.jsx)(f,{status:e.status,size:`sm`,doNotDisturb:e.doNotDisturb}),(0,o.jsx)(`span`,{className:t.cn(`font-medium`,w.text),children:e.customMessage||C.label}),(0,o.jsx)(a.ChevronDown,{className:t.cn(`text-muted-foreground`,w.icon)})]})})}),(0,o.jsxs)(r.DropdownMenuContent,{align:`start`,className:`w-56`,children:[[`online`,`away`,`busy`,`offline`,`invisible`].map(n=>{let i=u[n];return i.icon,(0,o.jsxs)(r.DropdownMenuItem,{onClick:()=>T(n),className:`flex items-center gap-2 cursor-pointer`,children:[(0,o.jsx)(`span`,{className:t.cn(`h-2.5 w-2.5 rounded-full`,i.color)}),(0,o.jsx)(`span`,{className:`flex-1`,children:i.label}),e.status===n&&(0,o.jsx)(a.Check,{className:`h-4 w-4 text-primary`}),n===`invisible`&&(0,o.jsx)(a.Eye,{className:`h-3.5 w-3.5 text-muted-foreground`})]},n)}),(l||s)&&(0,o.jsx)(r.DropdownMenuSeparator,{}),s&&(0,o.jsxs)(r.DropdownMenuItem,{onClick:s,className:`flex items-center gap-2 cursor-pointer`,children:[(0,o.jsx)(a.BellOff,{className:`h-4 w-4`}),(0,o.jsx)(`span`,{className:`flex-1`,children:`Do Not Disturb`}),e.doNotDisturb&&(0,o.jsx)(a.Check,{className:`h-4 w-4 text-primary`})]}),l&&c&&(0,o.jsxs)(o.Fragment,{children:[x?(0,o.jsx)(`div`,{className:`p-2`,children:(0,o.jsxs)(`div`,{className:`flex gap-2`,children:[(0,o.jsx)(`input`,{type:`text`,value:y,onChange:e=>b(e.target.value),placeholder:`What's your status?`,className:t.cn(`flex-1 px-2 py-1 text-sm rounded border bg-background`,`focus:outline-none focus:ring-1 focus:ring-ring`),onKeyDown:e=>{e.key===`Enter`&&E(),e.key===`Escape`&&S(!1)},autoFocus:!0}),(0,o.jsx)(`button`,{onClick:E,className:`px-2 py-1 text-sm bg-primary text-primary-foreground rounded hover:bg-primary/90`,type:`button`,children:`Save`})]})}):(0,o.jsxs)(r.DropdownMenuItem,{onClick:()=>S(!0),className:`flex items-center gap-2 cursor-pointer`,children:[(0,o.jsx)(a.Moon,{className:`h-4 w-4`}),(0,o.jsx)(`span`,{className:`flex-1`,children:e.customMessage?`Edit status message`:`Set status message`})]}),e.customMessage&&!x&&(0,o.jsxs)(r.DropdownMenuItem,{onClick:()=>c(void 0),className:`flex items-center gap-2 cursor-pointer text-muted-foreground`,children:[(0,o.jsx)(`span`,{className:`h-4 w-4`}),(0,o.jsx)(`span`,{children:`Clear status message`})]})]})]})]})}function g({lastSeen:e,size:n=`md`,showPrefix:r=!0,className:s}){let l=d[n],[u,f]=i.useState(c(e));return i.useEffect(()=>{let t=setInterval(()=>{f(c(e))},6e4);return()=>clearInterval(t)},[e]),(0,o.jsxs)(`div`,{className:t.cn(`inline-flex items-center gap-1.5 text-muted-foreground`,l.text,s),children:[(0,o.jsx)(a.Clock,{className:l.icon}),(0,o.jsxs)(`span`,{children:[r&&`Last seen `,u]})]})}function _({name:e,avatarSrc:n,avatarFallback:r,presence:i,showDuration:c=!0,showLastSeen:l=!0,size:f=`md`,className:m,onClick:h}){let _=u[i.status],v=d[f],y=i.updatedAt?s(i.updatedAt):null;return(0,o.jsxs)(`div`,{className:t.cn(`flex items-center gap-3 p-3 rounded-lg border bg-card`,h&&`cursor-pointer hover:bg-muted/50 transition-colors`,m),onClick:h,children:[(0,o.jsx)(p,{src:n,fallback:r||e.slice(0,2).toUpperCase(),alt:e,status:i.status,size:f,doNotDisturb:i.doNotDisturb}),(0,o.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,o.jsx)(`div`,{className:t.cn(`font-medium truncate`,v.text),children:e}),(0,o.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,o.jsx)(`span`,{className:t.cn(`inline-flex items-center gap-1`,v.text,_.label===`Online`?`text-green-600 dark:text-green-400`:_.label===`Away`?`text-yellow-600 dark:text-yellow-400`:_.label===`Busy`?`text-red-600 dark:text-red-400`:`text-muted-foreground`),children:i.customMessage||_.label}),c&&y&&i.status!==`offline`&&y!==`Just now`&&(0,o.jsxs)(`span`,{className:t.cn(`text-muted-foreground`,v.text),children:[`- `,y]})]}),l&&i.status===`offline`&&i.lastSeen&&(0,o.jsx)(g,{lastSeen:i.lastSeen,size:`sm`,className:`mt-0.5`})]}),i.doNotDisturb&&(0,o.jsx)(a.BellOff,{className:t.cn(`text-muted-foreground shrink-0`,v.icon)})]})}function v({users:e,size:n=`md`,showLastSeen:r=!0,groupByStatus:a=!1,maxVisible:s,onUserClick:c,className:l}){let f=d[n],p=i.useMemo(()=>{let t={online:0,busy:1,away:2,invisible:3,offline:4};return[...e].sort((e,n)=>t[e.presence.status]-t[n.presence.status])},[e]),m=i.useMemo(()=>{if(!a)return null;let e={online:[],away:[],busy:[],offline:[],invisible:[]};return p.forEach(t=>{e[t.presence.status].push(t)}),e},[p,a]),h=s?p.slice(0,s):p,g=s?Math.max(0,e.length-s):0,v=e=>(0,o.jsx)(_,{name:e.name,avatarSrc:e.avatarSrc,avatarFallback:e.avatarFallback,presence:e.presence,showLastSeen:r,size:n,onClick:c?()=>c(e.id):void 0},e.id);return a&&m?(0,o.jsx)(`div`,{className:t.cn(`space-y-4`,l),children:[`online`,`busy`,`away`,`offline`,`invisible`].map(e=>{let n=m[e];if(n.length===0)return null;let r=u[e];return(0,o.jsxs)(`div`,{children:[(0,o.jsxs)(`div`,{className:t.cn(`flex items-center gap-2 mb-2`,f.text),children:[(0,o.jsx)(`span`,{className:t.cn(`h-2 w-2 rounded-full`,r.color)}),(0,o.jsx)(`span`,{className:`font-medium`,children:r.label}),(0,o.jsxs)(`span`,{className:`text-muted-foreground`,children:[`(`,n.length,`)`]})]}),(0,o.jsx)(`div`,{className:`space-y-2`,children:n.map(v)})]},e)})}):(0,o.jsxs)(`div`,{className:t.cn(`space-y-2`,l),children:[h.map(v),g>0&&(0,o.jsxs)(`div`,{className:t.cn(`flex items-center justify-center p-2 rounded-lg border border-dashed text-muted-foreground`,f.text),children:[`+`,g,` more`]})]})}function y({users:e,max:n=5,size:r=`md`,className:i}){let a=d[r],s=e.slice(0,n),c=Math.max(0,e.length-n),l={xs:`-ml-2`,sm:`-ml-2.5`,md:`-ml-3`,lg:`-ml-4`,xl:`-ml-5`};return(0,o.jsxs)(`div`,{className:t.cn(`flex items-center`,i),children:[s.map((e,n)=>(0,o.jsx)(`div`,{className:t.cn(`relative`,n>0&&l[r]),style:{zIndex:s.length-n},children:(0,o.jsx)(p,{src:e.avatarSrc,fallback:e.avatarFallback||e.name.slice(0,2).toUpperCase(),alt:e.name,status:e.presence.status,size:r,pulse:!1,doNotDisturb:e.presence.doNotDisturb})},e.id)),c>0&&(0,o.jsx)(`div`,{className:t.cn(`relative flex items-center justify-center rounded-full bg-muted border-2 border-background`,a.avatar,l[r]),style:{zIndex:0},children:(0,o.jsxs)(`span`,{className:t.cn(`text-muted-foreground font-medium`,a.text),children:[`+`,c]})})]})}exports.WakaPresenceAvatarStack=y,exports.WakaPresenceCard=_,exports.WakaPresenceLastSeen=g,exports.WakaPresenceList=v,exports.WakaPresenceSelector=h,exports.WakaPresenceStatusBadge=m,exports.WakaPresenceWithAvatar=p,exports.default=f,exports.usePresence=l;