@wakastellar/ui 4.0.0 → 4.1.1

package/dist/components/waka-season-pass/index.es.js

@@ -0,0 +1,463 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.es.js";
+import * as t from "react";
+import { Check as n, ChevronLeft as r, ChevronRight as i, Clock as a, Crown as o, Gift as s, Lock as c, Sparkles as l, Star as u, Zap as d } from "lucide-react";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
+//#region src/components/waka-season-pass/index.tsx
+function m(e) {
+	let t = /* @__PURE__ */ new Date(), n = e.getTime() - t.getTime();
+	if (n <= 0) return "Season ended";
+	let r = Math.floor(n / (1e3 * 60 * 60 * 24)), i = Math.floor(n % (1e3 * 60 * 60 * 24) / (1e3 * 60 * 60)), a = Math.floor(n % (1e3 * 60 * 60) / (1e3 * 60));
+	return r > 0 ? `${r}d ${i}h remaining` : i > 0 ? `${i}h ${a}m remaining` : `${a}m remaining`;
+}
+function h(e, t) {
+	return e.find((e) => e.level === t + 1)?.xpRequired ?? 0;
+}
+function g(e, t) {
+	return e.find((e) => e.level === t)?.xpRequired ?? 0;
+}
+function _({ active: e, onComplete: n }) {
+	let [r, i] = t.useState(!1);
+	if (t.useEffect(() => {
+		if (e) {
+			i(!0);
+			let e = setTimeout(() => {
+				i(!1), n?.();
+			}, 1e3);
+			return () => clearTimeout(e);
+		}
+	}, [e, n]), !r) return null;
+	let a = [
+		"#fbbf24",
+		"#f59e0b",
+		"#22c55e",
+		"#8b5cf6",
+		"#06b6d4"
+	];
+	return /* @__PURE__ */ p("div", {
+		className: "pointer-events-none absolute inset-0 overflow-hidden",
+		children: [
+			[...Array(20)].map((e, t) => {
+				let n = t / 20 * 360, r = 40 + Math.random() * 30, i = 4 + Math.random() * 4;
+				return /* @__PURE__ */ f("div", {
+					className: "absolute left-1/2 top-1/2 rounded-full animate-claim-particle",
+					style: {
+						width: i,
+						height: i,
+						backgroundColor: a[Math.floor(Math.random() * a.length)],
+						"--angle": `${n}deg`,
+						"--distance": `${r}px`,
+						animationDelay: `${Math.random() * .1}s`
+					}
+				}, t);
+			}),
+			[...[
+				,
+				,
+				,
+				,
+				,
+				,
+			]].map((e, t) => /* @__PURE__ */ f(l, {
+				className: "absolute animate-claim-sparkle",
+				style: {
+					left: `${20 + Math.random() * 60}%`,
+					top: `${20 + Math.random() * 60}%`,
+					color: a[Math.floor(Math.random() * a.length)],
+					animationDelay: `${t * .1}s`
+				}
+			}, `sparkle-${t}`)),
+			/* @__PURE__ */ f("style", { children: "\n        @keyframes claim-particle {\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        @keyframes claim-sparkle {\n          0% { transform: scale(0) rotate(0deg); opacity: 0; }\n          50% { transform: scale(1.2) rotate(180deg); opacity: 1; }\n          100% { transform: scale(0) rotate(360deg); opacity: 0; }\n        }\n        .animate-claim-particle {\n          animation: claim-particle 0.8s ease-out forwards;\n        }\n        .animate-claim-sparkle {\n          animation: claim-sparkle 0.6s ease-out forwards;\n        }\n      " })
+		]
+	});
+}
+function v({ reward: r, level: i, tier: a, isUnlocked: o, isPremium: l, onClaim: u }) {
+	let [d, m] = t.useState(!1), [h, g] = t.useState(!1), v = r && !r.claimed && o && (a === "free" || a === "premium" && l), y = a === "premium" && !l;
+	return r ? /* @__PURE__ */ p("div", {
+		className: e("relative flex h-16 w-16 flex-col items-center justify-center rounded-lg border-2 transition-all duration-300", r.claimed && "border-green-500/50 bg-green-500/10", !r.claimed && v && "border-yellow-500 bg-yellow-500/10 cursor-pointer hover:scale-105 hover:shadow-lg", !r.claimed && !v && !y && "border-muted-foreground/30 bg-muted/30", y && "border-purple-500/30 bg-purple-500/10", a === "premium" && !y && "border-purple-500/50"),
+		onMouseEnter: () => g(!0),
+		onMouseLeave: () => g(!1),
+		onClick: () => {
+			v && (m(!0), u?.());
+		},
+		children: [
+			/* @__PURE__ */ f(_, {
+				active: d,
+				onComplete: () => m(!1)
+			}),
+			y && /* @__PURE__ */ f("div", {
+				className: "absolute inset-0 flex items-center justify-center rounded-lg bg-black/40 z-10",
+				children: /* @__PURE__ */ f(c, { className: "h-5 w-5 text-purple-300" })
+			}),
+			r.claimed && /* @__PURE__ */ f("div", {
+				className: "absolute -right-1 -top-1 flex h-5 w-5 items-center justify-center rounded-full bg-green-500 z-20",
+				children: /* @__PURE__ */ f(n, { className: "h-3 w-3 text-white" })
+			}),
+			/* @__PURE__ */ f("div", {
+				className: e("flex items-center justify-center", (y || !v && !r.claimed) && "opacity-50"),
+				children: r.icon || /* @__PURE__ */ f(s, { className: e("h-6 w-6", a === "premium" ? "text-purple-500" : "text-yellow-500") })
+			}),
+			/* @__PURE__ */ f("span", {
+				className: e("mt-1 text-xs font-medium truncate max-w-full px-1", (y || !v && !r.claimed) && "opacity-50"),
+				children: typeof r.value == "number" ? r.value.toLocaleString() : r.value
+			}),
+			v && h && /* @__PURE__ */ f("div", {
+				className: "absolute -top-8 left-1/2 -translate-x-1/2 whitespace-nowrap rounded bg-black/90 px-2 py-1 text-xs text-white z-30",
+				children: "Click to claim"
+			}),
+			v && /* @__PURE__ */ f("div", {
+				className: "absolute inset-0 overflow-hidden rounded-lg",
+				children: /* @__PURE__ */ f("div", { className: "absolute inset-0 animate-reward-shine" })
+			}),
+			/* @__PURE__ */ f("style", { children: "\n        @keyframes reward-shine {\n          0% { transform: translateX(-100%); opacity: 0; }\n          50% { opacity: 0.3; }\n          100% { transform: translateX(100%); opacity: 0; }\n        }\n        .animate-reward-shine {\n          background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);\n          animation: reward-shine 2s ease-in-out infinite;\n        }\n      " })
+		]
+	}) : /* @__PURE__ */ f("div", {
+		className: "relative flex h-16 w-16 items-center justify-center rounded-lg border border-dashed border-muted-foreground/30 bg-muted/20",
+		children: /* @__PURE__ */ f("span", {
+			className: "text-xs text-muted-foreground",
+			children: "-"
+		})
+	});
+}
+function y({ level: t, currentLevel: n, isPremium: r, onClaimReward: i }) {
+	let a = n >= t.level, o = n === t.level;
+	return /* @__PURE__ */ p("div", {
+		className: "flex flex-col items-center gap-2 px-2",
+		children: [
+			/* @__PURE__ */ f(v, {
+				reward: t.freeReward,
+				level: t.level,
+				tier: "free",
+				isUnlocked: a,
+				isPremium: r,
+				onClaim: () => i?.(t.level, "free")
+			}),
+			/* @__PURE__ */ p("div", {
+				className: e("relative flex h-10 w-10 items-center justify-center rounded-full border-2 font-bold transition-all", a && "border-yellow-500 bg-gradient-to-br from-yellow-400 to-orange-500 text-white", !a && "border-muted-foreground/30 bg-muted/30 text-muted-foreground", o && "ring-2 ring-yellow-500/50 ring-offset-2 ring-offset-background scale-110"),
+				children: [
+					o && /* @__PURE__ */ f("div", { className: "absolute inset-0 rounded-full animate-pulse-ring" }),
+					/* @__PURE__ */ f("span", {
+						className: "relative z-10 text-sm",
+						children: t.level
+					}),
+					/* @__PURE__ */ f("style", { children: "\n          @keyframes pulse-ring {\n            0%, 100% { box-shadow: 0 0 0 0 rgba(234, 179, 8, 0.4); }\n            50% { box-shadow: 0 0 0 8px rgba(234, 179, 8, 0); }\n          }\n          .animate-pulse-ring {\n            animation: pulse-ring 2s ease-out infinite;\n          }\n        " })
+				]
+			}),
+			/* @__PURE__ */ f(v, {
+				reward: t.premiumReward,
+				level: t.level,
+				tier: "premium",
+				isUnlocked: a,
+				isPremium: r,
+				onClaim: () => i?.(t.level, "premium")
+			})
+		]
+	});
+}
+function b({ currentXP: e, currentLevel: t, levels: n }) {
+	let r = g(n, t), i = h(n, t), a = e - r, o = i - r, s = o > 0 ? Math.min(100, a / o * 100) : 100, c = Math.max(0, i - e);
+	return /* @__PURE__ */ p("div", {
+		className: "flex items-center gap-3",
+		children: [
+			/* @__PURE__ */ f("div", {
+				className: "flex h-10 w-10 items-center justify-center rounded-full bg-gradient-to-br from-yellow-400 to-orange-500 font-bold text-white shadow-lg",
+				children: t
+			}),
+			/* @__PURE__ */ p("div", {
+				className: "flex-1",
+				children: [/* @__PURE__ */ p("div", {
+					className: "mb-1 flex items-center justify-between text-sm",
+					children: [/* @__PURE__ */ p("span", {
+						className: "flex items-center gap-1 font-medium",
+						children: [
+							/* @__PURE__ */ f(d, { className: "h-4 w-4 text-yellow-500" }),
+							/* @__PURE__ */ f("span", {
+								className: "tabular-nums",
+								children: a.toLocaleString()
+							}),
+							/* @__PURE__ */ p("span", {
+								className: "text-muted-foreground",
+								children: [
+									"/ ",
+									o.toLocaleString(),
+									" XP"
+								]
+							})
+						]
+					}), /* @__PURE__ */ p("span", {
+						className: "text-muted-foreground tabular-nums",
+						children: [c.toLocaleString(), " XP to next level"]
+					})]
+				}), /* @__PURE__ */ f("div", {
+					className: "relative h-3 overflow-hidden rounded-full bg-muted",
+					children: /* @__PURE__ */ f("div", {
+						className: "h-full rounded-full bg-gradient-to-r from-yellow-400 to-orange-500 transition-all duration-500",
+						style: { width: `${s}%` },
+						children: /* @__PURE__ */ f("div", { className: "absolute inset-0 animate-xp-shine" })
+					})
+				})]
+			}),
+			/* @__PURE__ */ f("div", {
+				className: "flex h-10 w-10 items-center justify-center rounded-full border-2 border-muted-foreground/30 bg-muted/30 font-bold text-muted-foreground",
+				children: t + 1
+			}),
+			/* @__PURE__ */ f("style", { children: "\n        @keyframes xp-shine {\n          0% { transform: translateX(-100%); opacity: 0; }\n          50% { opacity: 0.3; }\n          100% { transform: translateX(100%); opacity: 0; }\n        }\n        .animate-xp-shine {\n          background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);\n          animation: xp-shine 2s ease-in-out infinite;\n        }\n      " })
+		]
+	});
+}
+function x({ seasonEndsAt: n }) {
+	let [r, i] = t.useState(() => m(n));
+	return t.useEffect(() => {
+		let e = setInterval(() => {
+			i(m(n));
+		}, 6e4);
+		return () => clearInterval(e);
+	}, [n]), /* @__PURE__ */ p("div", {
+		className: e("flex items-center gap-2 rounded-full px-4 py-2 text-sm font-medium", n.getTime() - Date.now() < 4320 * 60 * 1e3 ? "bg-red-500/10 text-red-500 animate-pulse" : "bg-muted text-muted-foreground"),
+		children: [/* @__PURE__ */ f(a, { className: "h-4 w-4" }), /* @__PURE__ */ f("span", { children: r })]
+	});
+}
+function S({ onUpgrade: e }) {
+	return /* @__PURE__ */ p("button", {
+		type: "button",
+		onClick: e,
+		className: "group relative flex items-center gap-3 rounded-xl border-2 border-purple-500/50 bg-gradient-to-r from-purple-500/10 to-pink-500/10 px-4 py-3 transition-all hover:border-purple-500 hover:shadow-lg hover:shadow-purple-500/20",
+		children: [
+			/* @__PURE__ */ f("div", {
+				className: "flex h-10 w-10 items-center justify-center rounded-full bg-gradient-to-br from-purple-500 to-pink-500 shadow-lg",
+				children: /* @__PURE__ */ f(o, { className: "h-5 w-5 text-white" })
+			}),
+			/* @__PURE__ */ p("div", {
+				className: "text-left",
+				children: [/* @__PURE__ */ f("div", {
+					className: "font-semibold text-purple-500 group-hover:text-purple-400",
+					children: "Upgrade to Premium"
+				}), /* @__PURE__ */ f("div", {
+					className: "text-xs text-muted-foreground",
+					children: "Unlock exclusive rewards and premium tier"
+				})]
+			}),
+			/* @__PURE__ */ f(u, { className: "ml-auto h-5 w-5 text-purple-500 opacity-0 transition-opacity group-hover:opacity-100" }),
+			/* @__PURE__ */ f("div", {
+				className: "absolute inset-0 overflow-hidden rounded-xl",
+				children: /* @__PURE__ */ f("div", { className: "absolute inset-0 animate-premium-shine opacity-0 group-hover:opacity-100" })
+			}),
+			/* @__PURE__ */ f("style", { children: "\n        @keyframes premium-shine {\n          0% { transform: translateX(-100%) rotate(45deg); }\n          100% { transform: translateX(100%) rotate(45deg); }\n        }\n        .animate-premium-shine {\n          background: linear-gradient(90deg, transparent, rgba(168, 85, 247, 0.2), transparent);\n          animation: premium-shine 1.5s ease-in-out infinite;\n        }\n      " })
+		]
+	});
+}
+function C({ levels: n, currentLevel: a, currentXP: o, isPremium: s, seasonEndsAt: l, onClaimReward: d, onUpgrade: m, className: h }) {
+	let g = t.useRef(null), [_, v] = t.useState(!1), [C, w] = t.useState(!0), T = t.useMemo(() => [...n].sort((e, t) => e.level - t.level), [n]), E = t.useCallback(() => {
+		let e = g.current;
+		e && (v(e.scrollLeft > 0), w(e.scrollLeft < e.scrollWidth - e.clientWidth - 1));
+	}, []);
+	return t.useEffect(() => {
+		let e = g.current;
+		if (!e) return;
+		let t = T.findIndex((e) => e.level === a);
+		if (t >= 0) {
+			let n = Math.max(0, t * 100 - e.clientWidth / 2 + 100 / 2);
+			e.scrollTo({
+				left: n,
+				behavior: "smooth"
+			});
+		}
+		E();
+	}, [
+		a,
+		T,
+		E
+	]), /* @__PURE__ */ p("div", {
+		className: e("space-y-4", h),
+		children: [
+			/* @__PURE__ */ p("div", {
+				className: "flex items-center justify-between",
+				children: [/* @__PURE__ */ p("div", {
+					className: "flex items-center gap-3",
+					children: [/* @__PURE__ */ f("div", {
+						className: "flex h-10 w-10 items-center justify-center rounded-lg bg-gradient-to-br from-yellow-400 to-orange-500 shadow-lg",
+						children: /* @__PURE__ */ f(u, { className: "h-5 w-5 text-white" })
+					}), /* @__PURE__ */ p("div", { children: [/* @__PURE__ */ f("h2", {
+						className: "text-lg font-bold",
+						children: "Season Pass"
+					}), /* @__PURE__ */ p("p", {
+						className: "text-sm text-muted-foreground",
+						children: [
+							"Level ",
+							a,
+							" ",
+							s && /* @__PURE__ */ f("span", {
+								className: "text-purple-500",
+								children: "(Premium)"
+							})
+						]
+					})] })]
+				}), l && /* @__PURE__ */ f(x, { seasonEndsAt: l })]
+			}),
+			/* @__PURE__ */ f(b, {
+				currentXP: o,
+				currentLevel: a,
+				levels: T
+			}),
+			!s && /* @__PURE__ */ f(S, { onUpgrade: m }),
+			/* @__PURE__ */ p("div", {
+				className: "relative",
+				children: [
+					/* @__PURE__ */ p("div", {
+						className: "absolute left-0 top-0 z-10 flex flex-col items-center justify-center gap-2 bg-gradient-to-r from-background via-background to-transparent pr-4 h-full",
+						children: [
+							/* @__PURE__ */ f("div", {
+								className: "flex h-16 items-center",
+								children: /* @__PURE__ */ f("span", {
+									className: "text-xs font-medium text-muted-foreground rotate-180",
+									style: { writingMode: "vertical-rl" },
+									children: "FREE"
+								})
+							}),
+							/* @__PURE__ */ f("div", { className: "h-10" }),
+							/* @__PURE__ */ f("div", {
+								className: "flex h-16 items-center",
+								children: /* @__PURE__ */ f("span", {
+									className: "text-xs font-medium text-purple-500 rotate-180",
+									style: { writingMode: "vertical-rl" },
+									children: "PREMIUM"
+								})
+							})
+						]
+					}),
+					_ && /* @__PURE__ */ f("button", {
+						type: "button",
+						onClick: () => {
+							let e = g.current;
+							e && e.scrollBy({
+								left: -300,
+								behavior: "smooth"
+							});
+						},
+						className: "absolute left-8 top-1/2 z-20 flex h-8 w-8 -translate-y-1/2 items-center justify-center rounded-full border bg-background shadow-lg transition-all hover:bg-accent",
+						children: /* @__PURE__ */ f(r, { className: "h-4 w-4" })
+					}),
+					C && /* @__PURE__ */ f("button", {
+						type: "button",
+						onClick: () => {
+							let e = g.current;
+							e && e.scrollBy({
+								left: 300,
+								behavior: "smooth"
+							});
+						},
+						className: "absolute right-0 top-1/2 z-20 flex h-8 w-8 -translate-y-1/2 items-center justify-center rounded-full border bg-background shadow-lg transition-all hover:bg-accent",
+						children: /* @__PURE__ */ f(i, { className: "h-4 w-4" })
+					}),
+					/* @__PURE__ */ p("div", {
+						ref: g,
+						onScroll: () => {
+							E();
+						},
+						className: "relative flex overflow-x-auto scroll-smooth pb-4 pl-10 scrollbar-thin scrollbar-track-transparent scrollbar-thumb-muted-foreground/30",
+						style: {
+							scrollbarWidth: "thin",
+							msOverflowStyle: "none"
+						},
+						children: [/* @__PURE__ */ f("div", {
+							className: "absolute left-10 right-0 top-1/2 h-1 -translate-y-1/2 bg-muted",
+							children: /* @__PURE__ */ f("div", {
+								className: "h-full bg-gradient-to-r from-yellow-400 to-orange-500 transition-all duration-500",
+								style: { width: `${Math.min(100, (a - 1) / (T.length - 1) * 100)}%` }
+							})
+						}), /* @__PURE__ */ f("div", {
+							className: "relative flex gap-4",
+							children: T.map((e) => /* @__PURE__ */ f(y, {
+								level: e,
+								currentLevel: a,
+								isPremium: s,
+								onClaimReward: d
+							}, e.level))
+						})]
+					})
+				]
+			}),
+			/* @__PURE__ */ p("div", {
+				className: "flex flex-wrap items-center gap-4 text-xs text-muted-foreground",
+				children: [
+					/* @__PURE__ */ p("div", {
+						className: "flex items-center gap-1",
+						children: [/* @__PURE__ */ f("div", { className: "h-3 w-3 rounded-full bg-gradient-to-br from-yellow-400 to-orange-500" }), /* @__PURE__ */ f("span", { children: "Unlocked" })]
+					}),
+					/* @__PURE__ */ p("div", {
+						className: "flex items-center gap-1",
+						children: [/* @__PURE__ */ f("div", { className: "h-3 w-3 rounded-full border-2 border-yellow-500 bg-yellow-500/20" }), /* @__PURE__ */ f("span", { children: "Claimable" })]
+					}),
+					/* @__PURE__ */ p("div", {
+						className: "flex items-center gap-1",
+						children: [/* @__PURE__ */ f("div", { className: "h-3 w-3 rounded-full border-2 border-green-500 bg-green-500/20" }), /* @__PURE__ */ f("span", { children: "Claimed" })]
+					}),
+					/* @__PURE__ */ p("div", {
+						className: "flex items-center gap-1",
+						children: [/* @__PURE__ */ f(c, { className: "h-3 w-3 text-purple-500" }), /* @__PURE__ */ f("span", { children: "Premium Only" })]
+					})
+				]
+			})
+		]
+	});
+}
+function w({ levels: e, initialLevel: n = 1, initialXP: r = 0, initialIsPremium: i = !1, onLevelUp: a, onClaimReward: o }) {
+	let [s, c] = t.useState(e), [l, u] = t.useState(n), [d, f] = t.useState(r), [p, m] = t.useState(i), _ = t.useRef(n), v = t.useCallback((e) => {
+		let t = 1;
+		for (let n of s) if (e >= n.xpRequired) t = n.level;
+		else break;
+		return t;
+	}, [s]);
+	return t.useEffect(() => {
+		let e = v(d);
+		e !== l && u(e);
+	}, [
+		d,
+		v,
+		l
+	]), t.useEffect(() => {
+		l > _.current && a?.(l), _.current = l;
+	}, [l, a]), {
+		levels: s,
+		currentLevel: l,
+		currentXP: d,
+		isPremium: p,
+		addXP: t.useCallback((e) => {
+			f((t) => t + e);
+		}, []),
+		claimReward: t.useCallback((e, t) => {
+			c((n) => n.map((n) => n.level === e ? t === "free" && n.freeReward ? (o?.(e, t), {
+				...n,
+				freeReward: {
+					...n.freeReward,
+					claimed: !0
+				}
+			}) : t === "premium" && n.premiumReward && p ? (o?.(e, t), {
+				...n,
+				premiumReward: {
+					...n.premiumReward,
+					claimed: !0
+				}
+			}) : n : n));
+		}, [p, o]),
+		upgradeToPremium: t.useCallback(() => {
+			m(!0);
+		}, []),
+		claimableRewardsCount: t.useMemo(() => {
+			let e = 0;
+			for (let t of s) l >= t.level && (t.freeReward && !t.freeReward.claimed && e++, t.premiumReward && !t.premiumReward.claimed && p && e++);
+			return e;
+		}, [
+			s,
+			l,
+			p
+		]),
+		progressPercent: (() => {
+			let e = g(s, l), t = h(s, l) - e;
+			return t <= 0 ? 100 : (d - e) / t * 100;
+		})()
+	};
+}
+//#endregion
+export { C as WakaSeasonPass, w as useSeasonPass };

package/dist/components/waka-secret-card/index.cjs.js

@@ -0,0 +1 @@
+"use client";"use client";const e=require("../../_virtual/_rolldown/runtime.cjs.js"),t=require("../../utils/cn.cjs.js"),n=require("../badge/index.cjs.js"),r=require("../button/index.cjs.js"),i=require("../card/index.cjs.js");let a=require("react");a=e.__toESM(a);let o=require("lucide-react"),s=require("react/jsx-runtime");var c={"api-key":{icon:o.Key,label:`API Key`,color:`text-blue-500`},password:{icon:o.Shield,label:`Password`,color:`text-purple-500`},certificate:{icon:o.Shield,label:`Certificate`,color:`text-green-500`},token:{icon:o.Key,label:`Token`,color:`text-orange-500`},other:{icon:o.Key,label:`Secret`,color:`text-gray-500`}};function l(e){return e.toLocaleDateString(`fr-FR`,{day:`2-digit`,month:`short`,year:`numeric`})}function u(e){let t=Date.now()-e.getTime(),n=Math.floor(t/6e4),r=Math.floor(n/60),i=Math.floor(r/24);return i>30?l(e):i>0?`${i}d ago`:r>0?`${r}h ago`:`${n}m ago`}function d(e){if(!e)return!1;let t=e.getTime()-Date.now();return t>0&&t<10080*60*1e3}function f(e){return e?e.getTime()<Date.now():!1}function p(e){return!e.rotationPeriod||!e.rotatedAt?!1:Math.floor((Date.now()-e.rotatedAt.getTime())/(1440*60*1e3))>=e.rotationPeriod}function m({secret:e,onRotate:m,onDelete:h,onCopy:g,onView:_,isValueVisible:v=!1,showHistory:y=!1,compact:b=!1,className:x}){let[S,C]=a.useState(!1),w=c[e.type],T=w.icon,E=f(e.expiresAt),D=d(e.expiresAt),O=p(e),k=()=>{g?.(),C(!0),setTimeout(()=>C(!1),2e3)};return b?(0,s.jsxs)(`div`,{className:t.cn(`flex items-center gap-3 p-3 border rounded-lg hover:bg-muted/30 transition-colors`,E&&`border-red-500/50 bg-red-500/5`,D&&!E&&`border-yellow-500/50 bg-yellow-500/5`,O&&`border-orange-500/50`,x),children:[(0,s.jsx)(T,{className:t.cn(`h-5 w-5 shrink-0`,w.color)}),(0,s.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,s.jsx)(`div`,{className:`font-medium truncate`,children:e.name}),(0,s.jsxs)(`div`,{className:`text-xs text-muted-foreground flex items-center gap-2`,children:[(0,s.jsx)(`span`,{children:w.label}),e.lastAccessedAt&&(0,s.jsxs)(`span`,{children:[`Last used `,u(e.lastAccessedAt)]})]})]}),E&&(0,s.jsx)(n.Badge,{className:`bg-red-500 text-xs`,children:`Expired`}),D&&!E&&(0,s.jsx)(n.Badge,{className:`bg-yellow-500 text-xs`,children:`Expiring Soon`}),O&&(0,s.jsxs)(n.Badge,{variant:`outline`,className:`text-orange-500 text-xs`,children:[(0,s.jsx)(o.RotateCcw,{className:`h-3 w-3 mr-1`}),`Rotate`]}),(0,s.jsxs)(`div`,{className:`flex items-center gap-1`,children:[_&&(0,s.jsx)(r.Button,{variant:`ghost`,size:`sm`,className:`h-8 w-8 p-0`,onClick:_,children:v?(0,s.jsx)(o.EyeOff,{className:`h-4 w-4`}):(0,s.jsx)(o.Eye,{className:`h-4 w-4`})}),g&&(0,s.jsx)(r.Button,{variant:`ghost`,size:`sm`,className:`h-8 w-8 p-0`,onClick:k,children:S?(0,s.jsx)(o.CheckCircle2,{className:`h-4 w-4 text-green-500`}):(0,s.jsx)(o.Copy,{className:`h-4 w-4`})}),m&&(0,s.jsx)(r.Button,{variant:`ghost`,size:`sm`,className:`h-8 w-8 p-0`,onClick:m,children:(0,s.jsx)(o.RotateCcw,{className:`h-4 w-4`})})]})]}):(0,s.jsxs)(i.Card,{className:t.cn(E&&`border-red-500/50`,D&&!E&&`border-yellow-500/50`,x),children:[(0,s.jsx)(i.CardHeader,{className:`pb-3`,children:(0,s.jsxs)(`div`,{className:`flex items-start justify-between`,children:[(0,s.jsxs)(`div`,{className:`flex items-center gap-3`,children:[(0,s.jsx)(`div`,{className:t.cn(`w-10 h-10 rounded-lg flex items-center justify-center`,`bg-muted`),children:(0,s.jsx)(T,{className:t.cn(`h-5 w-5`,w.color)})}),(0,s.jsxs)(`div`,{children:[(0,s.jsx)(i.CardTitle,{className:`text-base`,children:e.name}),(0,s.jsxs)(`div`,{className:`flex items-center gap-2 mt-1`,children:[(0,s.jsx)(n.Badge,{variant:`outline`,className:`text-xs`,children:w.label}),e.tags?.map(e=>(0,s.jsx)(n.Badge,{variant:`secondary`,className:`text-xs`,children:e},e))]})]})]}),(0,s.jsxs)(`div`,{className:`flex items-center gap-1`,children:[E&&(0,s.jsxs)(n.Badge,{className:`bg-red-500`,children:[(0,s.jsx)(o.AlertTriangle,{className:`h-3 w-3 mr-1`}),`Expired`]}),D&&!E&&(0,s.jsxs)(n.Badge,{className:`bg-yellow-500`,children:[(0,s.jsx)(o.Clock,{className:`h-3 w-3 mr-1`}),`Expires `,l(e.expiresAt)]}),O&&(0,s.jsxs)(n.Badge,{variant:`outline`,className:`text-orange-500`,children:[(0,s.jsx)(o.RotateCcw,{className:`h-3 w-3 mr-1`}),`Needs Rotation`]})]})]})}),(0,s.jsxs)(i.CardContent,{className:`space-y-4`,children:[e.description&&(0,s.jsx)(`p`,{className:`text-sm text-muted-foreground`,children:e.description}),e.value&&(0,s.jsxs)(`div`,{className:`flex items-center gap-2 p-2 bg-muted/50 rounded-lg font-mono text-sm`,children:[(0,s.jsx)(`span`,{className:`flex-1 truncate`,children:v?e.value:`•`.repeat(24)}),_&&(0,s.jsx)(r.Button,{variant:`ghost`,size:`sm`,className:`h-7 w-7 p-0 shrink-0`,onClick:_,children:v?(0,s.jsx)(o.EyeOff,{className:`h-4 w-4`}):(0,s.jsx)(o.Eye,{className:`h-4 w-4`})}),g&&(0,s.jsx)(r.Button,{variant:`ghost`,size:`sm`,className:`h-7 w-7 p-0 shrink-0`,onClick:k,children:S?(0,s.jsx)(o.CheckCircle2,{className:`h-4 w-4 text-green-500`}):(0,s.jsx)(o.Copy,{className:`h-4 w-4`})})]}),(0,s.jsxs)(`div`,{className:`grid grid-cols-2 gap-4 text-sm`,children:[(0,s.jsxs)(`div`,{className:`flex items-center gap-2 text-muted-foreground`,children:[(0,s.jsx)(o.Calendar,{className:`h-4 w-4`}),(0,s.jsxs)(`span`,{children:[`Created `,l(e.createdAt)]})]}),(0,s.jsxs)(`div`,{className:`flex items-center gap-2 text-muted-foreground`,children:[(0,s.jsx)(o.Clock,{className:`h-4 w-4`}),(0,s.jsxs)(`span`,{children:[`Updated `,u(e.updatedAt)]})]}),e.rotatedAt&&(0,s.jsxs)(`div`,{className:`flex items-center gap-2 text-muted-foreground`,children:[(0,s.jsx)(o.RotateCcw,{className:`h-4 w-4`}),(0,s.jsxs)(`span`,{children:[`Rotated `,u(e.rotatedAt)]})]}),e.lastAccessedAt&&(0,s.jsxs)(`div`,{className:`flex items-center gap-2 text-muted-foreground`,children:[(0,s.jsx)(o.User,{className:`h-4 w-4`}),(0,s.jsxs)(`span`,{children:[`Used `,u(e.lastAccessedAt),e.lastAccessedBy&&` by ${e.lastAccessedBy}`]})]})]}),y&&e.accessHistory&&e.accessHistory.length>0&&(0,s.jsxs)(`div`,{className:`border-t pt-4`,children:[(0,s.jsxs)(`div`,{className:`flex items-center gap-2 mb-2 text-sm font-medium`,children:[(0,s.jsx)(o.History,{className:`h-4 w-4`}),`Recent Access`]}),(0,s.jsx)(`div`,{className:`space-y-1`,children:e.accessHistory.slice(0,5).map((e,t)=>(0,s.jsxs)(`div`,{className:`flex items-center justify-between text-xs text-muted-foreground`,children:[(0,s.jsxs)(`span`,{children:[e.user,` - `,e.action]}),(0,s.jsx)(`span`,{children:u(e.timestamp)})]},t))})]}),(0,s.jsxs)(`div`,{className:`flex items-center gap-2 pt-2 border-t`,children:[m&&(0,s.jsxs)(r.Button,{variant:`outline`,size:`sm`,onClick:m,children:[(0,s.jsx)(o.RotateCcw,{className:`h-4 w-4 mr-2`}),`Rotate`]}),h&&(0,s.jsxs)(r.Button,{variant:`outline`,size:`sm`,className:`text-destructive hover:text-destructive`,onClick:h,children:[(0,s.jsx)(o.Trash2,{className:`h-4 w-4 mr-2`}),`Delete`]})]})]})]})}var h={id:`1`,name:`Production API Key`,description:`Main API key for production services`,type:`api-key`,value:`sk_live_1234567890abcdefghijklmnopqrstuvwxyz`,createdAt:new Date(Date.now()-2160*36e5),updatedAt:new Date(Date.now()-168*36e5),rotatedAt:new Date(Date.now()-720*36e5),rotationPeriod:30,expiresAt:new Date(Date.now()+552*36e5),lastAccessedAt:new Date(Date.now()-2*36e5),lastAccessedBy:`api-gateway`,tags:[`production`,`critical`],accessHistory:[{user:`api-gateway`,action:`read`,timestamp:new Date(Date.now()-2*36e5)},{user:`john.doe`,action:`rotate`,timestamp:new Date(Date.now()-720*36e5)},{user:`api-gateway`,action:`read`,timestamp:new Date(Date.now()-24*36e5)}]};exports.WakaSecretCard=m,exports.defaultSecret=h;