@wakastellar/ui 4.0.0-dev.0 → 4.0.1

package/dist/components/waka-thread-view/index.es.js

@@ -0,0 +1,384 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.es.js";
+import * as t from "react";
+import { Bell as n, BellOff as r, ChevronDown as i, ChevronUp as a, Loader2 as o, Lock as s, MessageSquare as c, MoreHorizontal as l, RefreshCw as u, Reply as d, Send as f, Users as p } from "lucide-react";
+import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
+//#region src/components/waka-thread-view/index.tsx
+function _(e) {
+	let t = Math.floor(((/* @__PURE__ */ new Date()).getTime() - e.getTime()) / 1e3);
+	if (t < 60) return "just now";
+	let n = Math.floor(t / 60);
+	if (n < 60) return `${n}m ago`;
+	let r = Math.floor(n / 60);
+	if (r < 24) return `${r}h ago`;
+	let i = Math.floor(r / 24);
+	if (i < 7) return `${i}d ago`;
+	let a = Math.floor(i / 7);
+	return a < 4 ? `${a}w ago` : e.toLocaleDateString();
+}
+function v(e) {
+	let t = e.replies?.length || 0;
+	return e.replies?.forEach((e) => {
+		t += v(e);
+	}), t;
+}
+function y(e) {
+	return e.split(" ").map((e) => e[0]).join("").toUpperCase().slice(0, 2);
+}
+function b({ participant: t, size: n = "md", className: r }) {
+	return /* @__PURE__ */ h("div", {
+		className: e("relative flex items-center justify-center rounded-full font-semibold flex-shrink-0", {
+			sm: "h-6 w-6 text-[10px]",
+			md: "h-8 w-8 text-xs",
+			lg: "h-10 w-10 text-sm"
+		}[n], t.avatar ? "" : "bg-muted text-muted-foreground", r),
+		children: t.avatar ? /* @__PURE__ */ h("img", {
+			src: t.avatar,
+			alt: t.name,
+			className: "h-full w-full rounded-full object-cover"
+		}) : y(t.name)
+	});
+}
+function x({ participants: e, max: t = 4 }) {
+	let n = e.slice(0, t), r = e.length - t;
+	return /* @__PURE__ */ g("div", {
+		className: "flex items-center gap-1",
+		children: [/* @__PURE__ */ h("div", {
+			className: "flex -space-x-2",
+			children: n.map((e) => /* @__PURE__ */ h(b, {
+				participant: e,
+				size: "sm",
+				className: "ring-2 ring-background"
+			}, e.id))
+		}), r > 0 && /* @__PURE__ */ g("span", {
+			className: "text-xs text-muted-foreground ml-1",
+			children: [
+				"+",
+				r,
+				" more"
+			]
+		})]
+	});
+}
+function S({ count: t, isExpanded: n, onClick: r }) {
+	return t === 0 ? null : /* @__PURE__ */ g("button", {
+		onClick: r,
+		className: e("flex items-center gap-1.5 text-sm font-medium transition-colors", "text-primary hover:text-primary/80"),
+		children: [h(n ? a : i, { className: "h-4 w-4" }), /* @__PURE__ */ g("span", { children: [
+			t,
+			" ",
+			t === 1 ? "reply" : "replies"
+		] })]
+	});
+}
+function C({ message: t, depth: n, maxDepth: r, isCollapsed: i, onToggleCollapse: a, onReply: o, showReplyButton: s = !0 }) {
+	let u = t.replies && t.replies.length > 0, f = u ? v(t) : 0, p = n < r;
+	return /* @__PURE__ */ g("div", {
+		className: "group",
+		children: [
+			/* @__PURE__ */ g("div", {
+				className: e("flex gap-3 py-3 transition-colors", n > 0 && "hover:bg-accent/30 rounded-lg px-2 -mx-2"),
+				children: [/* @__PURE__ */ h(b, {
+					participant: t.author,
+					size: n === 0 ? "lg" : "md"
+				}), /* @__PURE__ */ g("div", {
+					className: "flex-1 min-w-0",
+					children: [
+						/* @__PURE__ */ g("div", {
+							className: "flex items-center gap-2 flex-wrap",
+							children: [
+								/* @__PURE__ */ h("span", {
+									className: "font-medium text-sm",
+									children: t.author.name
+								}),
+								/* @__PURE__ */ h("span", {
+									className: "text-xs text-muted-foreground",
+									children: _(new Date(t.timestamp))
+								}),
+								t.edited && /* @__PURE__ */ h("span", {
+									className: "text-xs text-muted-foreground italic",
+									children: "(edited)"
+								})
+							]
+						}),
+						/* @__PURE__ */ h("p", {
+							className: "mt-1 text-sm text-foreground whitespace-pre-wrap",
+							children: t.content
+						}),
+						/* @__PURE__ */ g("div", {
+							className: "mt-2 flex items-center gap-4",
+							children: [
+								s && o && /* @__PURE__ */ g("button", {
+									onClick: () => o(t.id),
+									className: "flex items-center gap-1 text-xs text-muted-foreground hover:text-primary transition-colors",
+									children: [/* @__PURE__ */ h(d, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ h("span", { children: "Reply" })]
+								}),
+								u && p && /* @__PURE__ */ h(S, {
+									count: f,
+									isExpanded: !i,
+									onClick: () => a(t.id)
+								}),
+								/* @__PURE__ */ h("button", {
+									className: "opacity-0 group-hover:opacity-100 text-muted-foreground hover:text-foreground transition-all",
+									children: /* @__PURE__ */ h(l, { className: "h-4 w-4" })
+								})
+							]
+						})
+					]
+				})]
+			}),
+			u && !i && p && /* @__PURE__ */ h("div", {
+				className: e("ml-4 pl-4 border-l-2 border-border/50", "animate-thread-expand"),
+				children: t.replies.map((e) => /* @__PURE__ */ h(C, {
+					message: e,
+					depth: n + 1,
+					maxDepth: r,
+					isCollapsed: !1,
+					onToggleCollapse: a,
+					onReply: o,
+					showReplyButton: s
+				}, e.id))
+			}),
+			u && !p && /* @__PURE__ */ h("div", {
+				className: "ml-11 mt-1 text-xs text-muted-foreground",
+				children: /* @__PURE__ */ g("span", {
+					className: "flex items-center gap-1",
+					children: [
+						/* @__PURE__ */ h(c, { className: "h-3 w-3" }),
+						f,
+						" nested ",
+						f === 1 ? "reply" : "replies"
+					]
+				})
+			})
+		]
+	});
+}
+function w({ currentUser: n, onSubmit: r, placeholder: i = "Write a reply...", disabled: a = !1, replyingTo: o, onCancelReply: s }) {
+	let [c, l] = t.useState(""), u = t.useRef(null), p = (e) => {
+		e.preventDefault(), c.trim() && !a && (r(c.trim()), l(""));
+	};
+	return t.useEffect(() => {
+		u.current && (u.current.style.height = "auto", u.current.style.height = `${Math.min(u.current.scrollHeight, 150)}px`);
+	}, [c]), /* @__PURE__ */ g("form", {
+		onSubmit: p,
+		className: "flex gap-3",
+		children: [n && /* @__PURE__ */ h(b, {
+			participant: n,
+			size: "md"
+		}), /* @__PURE__ */ g("div", {
+			className: "flex-1 relative",
+			children: [
+				o && /* @__PURE__ */ g("div", {
+					className: "flex items-center gap-2 text-xs text-muted-foreground mb-1",
+					children: [
+						/* @__PURE__ */ h(d, { className: "h-3 w-3" }),
+						/* @__PURE__ */ h("span", { children: "Replying to thread" }),
+						/* @__PURE__ */ h("button", {
+							type: "button",
+							onClick: s,
+							className: "hover:text-foreground",
+							children: "Cancel"
+						})
+					]
+				}),
+				/* @__PURE__ */ g("div", {
+					className: "relative flex items-end gap-2 rounded-lg border bg-background focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2",
+					children: [/* @__PURE__ */ h("textarea", {
+						ref: u,
+						value: c,
+						onChange: (e) => l(e.target.value),
+						onKeyDown: (e) => {
+							e.key === "Enter" && (e.metaKey || e.ctrlKey) && p(e), e.key === "Escape" && s && s();
+						},
+						placeholder: i,
+						disabled: a,
+						rows: 1,
+						className: e("flex-1 resize-none bg-transparent px-3 py-2.5 text-sm", "placeholder:text-muted-foreground focus:outline-none", "disabled:cursor-not-allowed disabled:opacity-50", "min-h-[40px] max-h-[150px]")
+					}), /* @__PURE__ */ h("button", {
+						type: "submit",
+						disabled: a || !c.trim(),
+						className: e("flex-shrink-0 p-2.5 rounded-r-lg transition-colors", "text-muted-foreground hover:text-primary", "disabled:opacity-50 disabled:cursor-not-allowed"),
+						children: /* @__PURE__ */ h(f, { className: "h-4 w-4" })
+					})]
+				}),
+				/* @__PURE__ */ h("p", {
+					className: "mt-1 text-[10px] text-muted-foreground",
+					children: "Press Cmd+Enter to send"
+				})
+			]
+		})]
+	});
+}
+function T({ thread: t, showParticipants: i, onFollowToggle: a, onRefresh: o }) {
+	return /* @__PURE__ */ g("div", {
+		className: "flex items-start justify-between gap-4 pb-4 border-b",
+		children: [/* @__PURE__ */ g("div", {
+			className: "flex-1 min-w-0",
+			children: [t.title && /* @__PURE__ */ h("h2", {
+				className: "text-lg font-semibold mb-2",
+				children: t.title
+			}), /* @__PURE__ */ g("div", {
+				className: "flex items-center gap-4 flex-wrap",
+				children: [
+					/* @__PURE__ */ g("div", {
+						className: "flex items-center gap-1.5 text-sm text-muted-foreground",
+						children: [/* @__PURE__ */ h(c, { className: "h-4 w-4" }), /* @__PURE__ */ g("span", { children: [
+							t.replyCount,
+							" ",
+							t.replyCount === 1 ? "reply" : "replies"
+						] })]
+					}),
+					i && t.participants.length > 0 && /* @__PURE__ */ g("div", {
+						className: "flex items-center gap-1.5",
+						children: [/* @__PURE__ */ h(p, { className: "h-4 w-4 text-muted-foreground" }), /* @__PURE__ */ h(x, {
+							participants: t.participants,
+							max: 4
+						})]
+					}),
+					t.isClosed && /* @__PURE__ */ g("div", {
+						className: "flex items-center gap-1 text-sm text-muted-foreground",
+						children: [/* @__PURE__ */ h(s, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ h("span", { children: "Closed" })]
+					})
+				]
+			})]
+		}), /* @__PURE__ */ g("div", {
+			className: "flex items-center gap-2",
+			children: [t.hasNewUpdates && o && /* @__PURE__ */ g("button", {
+				onClick: o,
+				className: e("flex items-center gap-1.5 px-3 py-1.5 rounded-full text-sm", "bg-primary/10 text-primary hover:bg-primary/20 transition-colors", "animate-pulse"),
+				children: [/* @__PURE__ */ h(u, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ h("span", { children: "New updates" })]
+			}), a && /* @__PURE__ */ h("button", {
+				onClick: a,
+				className: e("flex items-center gap-1.5 px-3 py-1.5 rounded-lg text-sm transition-colors", t.isFollowing ? "bg-primary text-primary-foreground hover:bg-primary/90" : "bg-muted text-muted-foreground hover:bg-muted/80"),
+				children: t.isFollowing ? /* @__PURE__ */ g(m, { children: [/* @__PURE__ */ h(r, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ h("span", { children: "Following" })] }) : /* @__PURE__ */ g(m, { children: [/* @__PURE__ */ h(n, { className: "h-3.5 w-3.5" }), /* @__PURE__ */ h("span", { children: "Follow" })] })
+			})]
+		})]
+	});
+}
+function E({ thread: n, currentUser: r, onReply: a, onLoadMore: c, hasMoreReplies: l = !1, loading: u = !1, onFollowToggle: d, onRefresh: f, maxDepth: p = 3, showParticipants: _ = !0, enableReplies: v = !0, className: y }) {
+	let [b, x] = t.useState(/* @__PURE__ */ new Set()), [S, E] = t.useState(null);
+	return /* @__PURE__ */ g("div", {
+		className: e("flex flex-col", y),
+		children: [
+			/* @__PURE__ */ h(T, {
+				thread: n,
+				showParticipants: _,
+				onFollowToggle: d,
+				onRefresh: f
+			}),
+			/* @__PURE__ */ h("div", {
+				className: "py-4 border-b",
+				children: /* @__PURE__ */ h(C, {
+					message: n.parentMessage,
+					depth: 0,
+					maxDepth: p,
+					isCollapsed: b.has(n.parentMessage.id),
+					onToggleCollapse: (e) => {
+						x((t) => {
+							let n = new Set(t);
+							return n.has(e) ? n.delete(e) : n.add(e), n;
+						});
+					},
+					onReply: v && !n.isClosed ? (e) => {
+						E(e);
+					} : void 0,
+					showReplyButton: v && !n.isClosed
+				})
+			}),
+			l && /* @__PURE__ */ h("div", {
+				className: "py-3 border-b",
+				children: /* @__PURE__ */ h("button", {
+					onClick: c,
+					disabled: u,
+					className: e("flex items-center gap-2 text-sm text-primary hover:text-primary/80 transition-colors", "disabled:opacity-50 disabled:cursor-not-allowed"),
+					children: u ? /* @__PURE__ */ g(m, { children: [/* @__PURE__ */ h(o, { className: "h-4 w-4 animate-spin" }), /* @__PURE__ */ h("span", { children: "Loading..." })] }) : /* @__PURE__ */ g(m, { children: [/* @__PURE__ */ h(i, { className: "h-4 w-4" }), /* @__PURE__ */ h("span", { children: "Load more replies" })] })
+				})
+			}),
+			u && !l && /* @__PURE__ */ h("div", {
+				className: "flex items-center justify-center py-8",
+				children: /* @__PURE__ */ h(o, { className: "h-6 w-6 animate-spin text-muted-foreground" })
+			}),
+			v && !n.isClosed && /* @__PURE__ */ h("div", {
+				className: "pt-4 mt-auto",
+				children: /* @__PURE__ */ h(w, {
+					currentUser: r,
+					onSubmit: (e) => {
+						a?.(e, S || void 0), E(null);
+					},
+					placeholder: S ? "Write a reply..." : "Add a comment...",
+					replyingTo: S || void 0,
+					onCancelReply: S ? () => {
+						E(null);
+					} : void 0
+				})
+			}),
+			n.isClosed && /* @__PURE__ */ g("div", {
+				className: "flex items-center justify-center gap-2 py-6 text-muted-foreground",
+				children: [/* @__PURE__ */ h(s, { className: "h-4 w-4" }), /* @__PURE__ */ h("span", {
+					className: "text-sm",
+					children: "This thread is closed for new replies"
+				})]
+			}),
+			/* @__PURE__ */ h("style", { children: "\n        @keyframes thread-expand {\n          0% {\n            opacity: 0;\n            max-height: 0;\n            transform: translateY(-8px);\n          }\n          100% {\n            opacity: 1;\n            max-height: 2000px;\n            transform: translateY(0);\n          }\n        }\n        .animate-thread-expand {\n          animation: thread-expand 0.3s ease-out forwards;\n          overflow: hidden;\n        }\n      " })
+		]
+	});
+}
+function D({ initialThread: e, maxReplies: n = 100 } = {}) {
+	let [r, i] = t.useState(e || null), [a, o] = t.useState(!1), [s, c] = t.useState(/* @__PURE__ */ new Set()), l = t.useCallback((e) => {
+		c((t) => {
+			let n = new Set(t);
+			return n.has(e) ? n.delete(e) : n.add(e), n;
+		});
+	}, []), u = t.useCallback((e) => s.has(e), [s]);
+	return {
+		thread: r,
+		loading: a,
+		collapsedThreads: s,
+		toggleCollapse: l,
+		addReply: t.useCallback((e, t) => {
+			if (!r) return;
+			let a = {
+				id: `reply-${Date.now()}`,
+				author: r.participants[0] || {
+					id: "current-user",
+					name: "You"
+				},
+				content: e,
+				timestamp: /* @__PURE__ */ new Date(),
+				replies: []
+			}, o = (e, t) => !t || e.id === t ? {
+				...e,
+				replies: [...e.replies || [], a].slice(-n)
+			} : e.replies ? {
+				...e,
+				replies: e.replies.map((e) => o(e, t))
+			} : e;
+			i((e) => e && {
+				...e,
+				parentMessage: o(e.parentMessage, t),
+				replyCount: e.replyCount + 1
+			});
+		}, [r, n]),
+		setThread: t.useCallback((e) => {
+			i(e);
+		}, []),
+		toggleFollow: t.useCallback(() => {
+			i((e) => e && {
+				...e,
+				isFollowing: !e.isFollowing
+			});
+		}, []),
+		setHasNewUpdates: t.useCallback((e) => {
+			i((t) => t && {
+				...t,
+				hasNewUpdates: e
+			});
+		}, []),
+		setLoading: o,
+		isCollapsed: u
+	};
+}
+//#endregion
+export { E as default, D as useThreadView };

package/dist/components/waka-tilt-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`);let n=require(`react`);n=e.__toESM(n);let r=require(`react/jsx-runtime`);function i({maxTilt:e=15,perspective:i=1e3,scale:a=1.02,speed:o=400,disabled:s=!1,glare:c=!0,maxGlare:l=.2,reset:u=!0,reverse:d=!1,gyroscope:f=!1,className:p,children:m,style:h,...g}){let _=n.useRef(null),[v,y]=n.useState({x:0,y:0}),[b,x]=n.useState({x:50,y:50}),[S,C]=n.useState(!1),w=d?-1:1,T=n.useCallback(t=>{if(s||!_.current)return;let n=_.current.getBoundingClientRect(),r=n.width,i=n.height,a=(t.clientX-n.left)/r,o=(t.clientY-n.top)/i;y({x:(o-.5)*e*2*w,y:(a-.5)*e*2*w*-1}),x({x:a*100,y:o*100})},[s,e,w]),E=()=>{s||C(!0)},D=()=>{u&&(y({x:0,y:0}),x({x:50,y:50})),C(!1)};n.useEffect(()=>{if(!f||s||typeof window>`u`)return;let t=t=>{t.gamma===null||t.beta===null||y({x:Math.min(Math.max(t.beta,-e),e)*w,y:Math.min(Math.max(t.gamma,-e),e)*w*-1})};return window.addEventListener(`deviceorientation`,t),()=>window.removeEventListener(`deviceorientation`,t)},[f,s,e,w]);let O={perspective:`${i}px`,...h},k={transform:`rotateX(${v.x}deg) rotateY(${v.y}deg) scale(${S?a:1})`,transition:`transform ${o}ms cubic-bezier(0.03, 0.98, 0.52, 0.99)`,transformStyle:`preserve-3d`},A={position:`absolute`,inset:0,borderRadius:`inherit`,background:`radial-gradient(circle at ${b.x}% ${b.y}%, rgba(255,255,255,${l}), transparent 60%)`,opacity:+!!S,transition:`opacity ${o}ms ease`,pointerEvents:`none`};return(0,r.jsx)(`div`,{ref:_,className:t.cn(`relative`,p),style:O,onMouseMove:T,onMouseEnter:E,onMouseLeave:D,...g,children:(0,r.jsxs)(`div`,{style:k,className:`relative`,children:[m,c&&(0,r.jsx)(`div`,{style:A})]})})}function a({title:e,description:n,icon:a,image:o,footer:s,className:c,glowColor:l=`hsl(var(--primary))`}){return(0,r.jsx)(i,{className:t.cn(`group cursor-pointer`,c),maxTilt:10,glare:!0,children:(0,r.jsxs)(`div`,{className:`relative overflow-hidden rounded-xl border bg-card shadow-lg`,children:[(0,r.jsx)(`div`,{className:`absolute -inset-px rounded-xl opacity-0 blur-xl transition-opacity duration-500 group-hover:opacity-30`,style:{background:l}}),o&&(0,r.jsxs)(`div`,{className:`relative h-48 overflow-hidden`,children:[(0,r.jsx)(`img`,{src:o,alt:e,className:`h-full w-full object-cover transition-transform duration-500 group-hover:scale-105`}),(0,r.jsx)(`div`,{className:`absolute inset-0 bg-gradient-to-t from-card to-transparent`})]}),(0,r.jsxs)(`div`,{className:`relative p-6`,style:{transform:`translateZ(30px)`},children:[a&&(0,r.jsx)(`div`,{className:`mb-4 inline-flex h-12 w-12 items-center justify-center rounded-lg`,style:{background:`linear-gradient(135deg, ${l}20, ${l}10)`,transform:`translateZ(20px)`},children:a}),(0,r.jsx)(`h3`,{className:`text-xl font-semibold`,style:{transform:`translateZ(40px)`},children:e}),n&&(0,r.jsx)(`p`,{className:`mt-2 text-sm text-muted-foreground`,style:{transform:`translateZ(25px)`},children:n}),s&&(0,r.jsx)(`div`,{className:`mt-4 pt-4 border-t`,style:{transform:`translateZ(20px)`},children:s})]}),(0,r.jsx)(`div`,{className:`absolute -right-4 -top-4 h-24 w-24 rounded-full opacity-5`,style:{background:l,transform:`translateZ(60px)`}})]})})}exports.WakaTiltCard=i,exports.WakaTiltShowcaseCard=a;

package/dist/components/waka-tilt-card/index.es.js

@@ -0,0 +1,146 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.es.js";
+import * as t from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/components/waka-tilt-card/index.tsx
+function i({ maxTilt: i = 15, perspective: a = 1e3, scale: o = 1.02, speed: s = 400, disabled: c = !1, glare: l = !0, maxGlare: u = .2, reset: d = !0, reverse: f = !1, gyroscope: p = !1, className: m, children: h, style: g, ..._ }) {
+	let v = t.useRef(null), [y, b] = t.useState({
+		x: 0,
+		y: 0
+	}), [x, S] = t.useState({
+		x: 50,
+		y: 50
+	}), [C, w] = t.useState(!1), T = f ? -1 : 1, E = t.useCallback((e) => {
+		if (c || !v.current) return;
+		let t = v.current.getBoundingClientRect(), n = t.width, r = t.height, a = (e.clientX - t.left) / n, o = (e.clientY - t.top) / r;
+		b({
+			x: (o - .5) * i * 2 * T,
+			y: (a - .5) * i * 2 * T * -1
+		}), S({
+			x: a * 100,
+			y: o * 100
+		});
+	}, [
+		c,
+		i,
+		T
+	]), D = () => {
+		c || w(!0);
+	}, O = () => {
+		d && (b({
+			x: 0,
+			y: 0
+		}), S({
+			x: 50,
+			y: 50
+		})), w(!1);
+	};
+	t.useEffect(() => {
+		if (!p || c || typeof window > "u") return;
+		let e = (e) => {
+			e.gamma === null || e.beta === null || b({
+				x: Math.min(Math.max(e.beta, -i), i) * T,
+				y: Math.min(Math.max(e.gamma, -i), i) * T * -1
+			});
+		};
+		return window.addEventListener("deviceorientation", e), () => window.removeEventListener("deviceorientation", e);
+	}, [
+		p,
+		c,
+		i,
+		T
+	]);
+	let k = {
+		perspective: `${a}px`,
+		...g
+	}, A = {
+		transform: `rotateX(${y.x}deg) rotateY(${y.y}deg) scale(${C ? o : 1})`,
+		transition: `transform ${s}ms cubic-bezier(0.03, 0.98, 0.52, 0.99)`,
+		transformStyle: "preserve-3d"
+	}, j = {
+		position: "absolute",
+		inset: 0,
+		borderRadius: "inherit",
+		background: `radial-gradient(circle at ${x.x}% ${x.y}%, rgba(255,255,255,${u}), transparent 60%)`,
+		opacity: +!!C,
+		transition: `opacity ${s}ms ease`,
+		pointerEvents: "none"
+	};
+	return /* @__PURE__ */ n("div", {
+		ref: v,
+		className: e("relative", m),
+		style: k,
+		onMouseMove: E,
+		onMouseEnter: D,
+		onMouseLeave: O,
+		..._,
+		children: /* @__PURE__ */ r("div", {
+			style: A,
+			className: "relative",
+			children: [h, l && /* @__PURE__ */ n("div", { style: j })]
+		})
+	});
+}
+function a({ title: t, description: a, icon: o, image: s, footer: c, className: l, glowColor: u = "hsl(var(--primary))" }) {
+	return /* @__PURE__ */ n(i, {
+		className: e("group cursor-pointer", l),
+		maxTilt: 10,
+		glare: !0,
+		children: /* @__PURE__ */ r("div", {
+			className: "relative overflow-hidden rounded-xl border bg-card shadow-lg",
+			children: [
+				/* @__PURE__ */ n("div", {
+					className: "absolute -inset-px rounded-xl opacity-0 blur-xl transition-opacity duration-500 group-hover:opacity-30",
+					style: { background: u }
+				}),
+				s && /* @__PURE__ */ r("div", {
+					className: "relative h-48 overflow-hidden",
+					children: [/* @__PURE__ */ n("img", {
+						src: s,
+						alt: t,
+						className: "h-full w-full object-cover transition-transform duration-500 group-hover:scale-105"
+					}), /* @__PURE__ */ n("div", { className: "absolute inset-0 bg-gradient-to-t from-card to-transparent" })]
+				}),
+				/* @__PURE__ */ r("div", {
+					className: "relative p-6",
+					style: { transform: "translateZ(30px)" },
+					children: [
+						o && /* @__PURE__ */ n("div", {
+							className: "mb-4 inline-flex h-12 w-12 items-center justify-center rounded-lg",
+							style: {
+								background: `linear-gradient(135deg, ${u}20, ${u}10)`,
+								transform: "translateZ(20px)"
+							},
+							children: o
+						}),
+						/* @__PURE__ */ n("h3", {
+							className: "text-xl font-semibold",
+							style: { transform: "translateZ(40px)" },
+							children: t
+						}),
+						a && /* @__PURE__ */ n("p", {
+							className: "mt-2 text-sm text-muted-foreground",
+							style: { transform: "translateZ(25px)" },
+							children: a
+						}),
+						c && /* @__PURE__ */ n("div", {
+							className: "mt-4 pt-4 border-t",
+							style: { transform: "translateZ(20px)" },
+							children: c
+						})
+					]
+				}),
+				/* @__PURE__ */ n("div", {
+					className: "absolute -right-4 -top-4 h-24 w-24 rounded-full opacity-5",
+					style: {
+						background: u,
+						transform: "translateZ(60px)"
+					}
+				})
+			]
+		})
+	});
+}
+//#endregion
+export { i as WakaTiltCard, a as WakaTiltShowcaseCard };

package/dist/components/waka-time-picker/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(`../button/index.cjs.js`),r=require(`../input/index.cjs.js`),i=require(`../popover/index.cjs.js`);let a=require(`react`);a=e.__toESM(a);let o=require(`lucide-react`),s=require(`react/jsx-runtime`);function c(e){let t=e.split(`:`);return{hours:parseInt(t[0]||`0`,10),minutes:parseInt(t[1]||`0`,10),seconds:parseInt(t[2]||`0`,10)}}function l(e,t,n,r){let i=e.toString().padStart(2,`0`),a=t.toString().padStart(2,`0`),o=n.toString().padStart(2,`0`);return r?`${i}:${a}:${o}`:`${i}:${a}`}function u(e){let t=e>=12?`PM`:`AM`,n=e%12;return n===0&&(n=12),{display:n,period:t}}function d(e,t){return t===`AM`?e===12?0:e:e===12?12:e+12}function f(e,t,n,r,i){let a=e*3600+t*60+n;if(r){let e=c(r);if(a<e.hours*3600+e.minutes*60+e.seconds)return!1}if(i){let e=c(i);if(a>e.hours*3600+e.minutes*60+e.seconds)return!1}return!0}function p({value:e,onChange:t,max:r,step:i=1,disabled:c,label:l}){let u=a.useMemo(()=>{let e=[];for(let t=0;t<r;t+=i)e.push(t);return e},[r,i]);return(0,s.jsxs)(`div`,{className:`flex flex-col items-center`,children:[(0,s.jsx)(`span`,{className:`text-xs text-muted-foreground mb-1`,children:l}),(0,s.jsx)(n.Button,{type:`button`,variant:`ghost`,size:`icon`,className:`h-6 w-8`,onClick:()=>{t(u[(u.indexOf(e)+1)%u.length])},disabled:c,tabIndex:-1,children:(0,s.jsx)(o.ChevronUp,{className:`h-4 w-4`})}),(0,s.jsx)(`div`,{className:`h-10 w-12 flex items-center justify-center text-lg font-medium`,children:e.toString().padStart(2,`0`)}),(0,s.jsx)(n.Button,{type:`button`,variant:`ghost`,size:`icon`,className:`h-6 w-8`,onClick:()=>{let n=u.indexOf(e);t(u[n===0?u.length-1:n-1])},disabled:c,tabIndex:-1,children:(0,s.jsx)(o.ChevronDown,{className:`h-4 w-4`})})]})}function m({value:e,onChange:t,disabled:r}){return(0,s.jsxs)(`div`,{className:`flex flex-col gap-1`,children:[(0,s.jsx)(n.Button,{type:`button`,variant:e===`AM`?`default`:`ghost`,size:`sm`,className:`h-7 px-2`,onClick:()=>t(`AM`),disabled:r,children:`AM`}),(0,s.jsx)(n.Button,{type:`button`,variant:e===`PM`?`default`:`ghost`,size:`sm`,className:`h-7 px-2`,onClick:()=>t(`PM`),disabled:r,children:`PM`})]})}function h({value:e,onChange:h,placeholder:g=`Sélectionner une heure`,format:_=`24h`,showSeconds:v=!1,minuteStep:y=1,secondStep:b=1,minTime:x,maxTime:S,disabled:C=!1,error:w=!1,size:T=`md`,className:E,id:D,name:O}){let[k,A]=a.useState(!1),[j,M]=a.useState(e||``),N=e?c(e):{hours:0,minutes:0,seconds:0},[P,F]=a.useState(N.hours),[I,L]=a.useState(N.minutes),[R,z]=a.useState(N.seconds),[B,V]=a.useState(N.hours>=12?`PM`:`AM`);a.useEffect(()=>{if(e){let t=c(e);F(t.hours),L(t.minutes),z(t.seconds),V(t.hours>=12?`PM`:`AM`),M(e)}},[e]);let H=a.useMemo(()=>{if(!e)return``;if(_===`12h`){let{display:e,period:t}=u(P);return`${e.toString().padStart(2,`0`)}:${I.toString().padStart(2,`0`)}${v?`:${R.toString().padStart(2,`0`)}`:``} ${t}`}return l(P,I,R,v)},[e,P,I,R,_,v]),U=(e,t,n)=>{if(!f(e,t,n,x,S))return;F(e),L(t),z(n);let r=l(e,t,n,v);h?.(r)},W=e=>{U(_===`12h`?d(e,B):e,I,R)},G=e=>{U(P,e,R)},K=e=>{U(P,I,e)},q=e=>{V(e),U(d(P%12||12,e),I,R)},J=e=>{let t=e.target.value;M(t);let n=v?/^(\d{1,2}):(\d{2}):(\d{2})$/:/^(\d{1,2}):(\d{2})$/,r=t.match(n);if(r){let e=parseInt(r[1],10),t=parseInt(r[2],10),n=v?parseInt(r[3],10):0;e>=0&&e<24&&t>=0&&t<60&&n>=0&&n<60&&U(e,t,n)}},Y={sm:`h-8 text-xs`,md:`h-9 text-sm`,lg:`h-10 text-base`},X={sm:`h-3 w-3`,md:`h-4 w-4`,lg:`h-5 w-5`},Z=_===`12h`?P%12||12:P;return(0,s.jsxs)(i.Popover,{open:k,onOpenChange:A,children:[(0,s.jsx)(i.PopoverTrigger,{asChild:!0,children:(0,s.jsxs)(`div`,{className:t.cn(`relative`,E),children:[(0,s.jsx)(r.Input,{id:D,name:O,value:H,onChange:J,placeholder:g,disabled:C,className:t.cn(Y[T],`pr-10`,w&&`border-destructive focus-visible:ring-destructive`)}),(0,s.jsx)(n.Button,{type:`button`,variant:`ghost`,size:`icon`,className:t.cn(`absolute right-0 top-0 h-full px-2`,C&&`pointer-events-none opacity-50`),onClick:()=>!C&&A(!k),tabIndex:-1,children:(0,s.jsx)(o.Clock,{className:X[T]})})]})}),(0,s.jsxs)(i.PopoverContent,{className:`w-auto p-4`,align:`start`,children:[(0,s.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,s.jsx)(p,{value:Z,onChange:W,max:_===`12h`?13:24,disabled:C,label:`Heures`}),(0,s.jsx)(`span`,{className:`text-xl font-medium`,children:`:`}),(0,s.jsx)(p,{value:I,onChange:G,max:60,step:y,disabled:C,label:`Minutes`}),v&&(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(`span`,{className:`text-xl font-medium`,children:`:`}),(0,s.jsx)(p,{value:R,onChange:K,max:60,step:b,disabled:C,label:`Secondes`})]}),_===`12h`&&(0,s.jsx)(`div`,{className:`ml-2`,children:(0,s.jsx)(m,{value:B,onChange:q,disabled:C})})]}),(0,s.jsxs)(`div`,{className:`flex gap-2 mt-4 pt-4 border-t`,children:[(0,s.jsx)(n.Button,{type:`button`,variant:`outline`,size:`sm`,onClick:()=>{let e=new Date;U(e.getHours(),e.getMinutes(),e.getSeconds())},disabled:C,children:`Maintenant`}),(0,s.jsx)(n.Button,{type:`button`,variant:`outline`,size:`sm`,onClick:()=>U(0,0,0),disabled:C,children:`00:00`}),(0,s.jsx)(n.Button,{type:`button`,variant:`outline`,size:`sm`,onClick:()=>U(12,0,0),disabled:C,children:`12:00`})]})]})]})}function g(e={}){let{initialValue:t=``,format:n=`24h`,showSeconds:r=!1}=e,[i,o]=a.useState(t);return{value:i,onChange:o,clear:()=>o(``),setNow:()=>{let e=new Date,t=e.getHours().toString().padStart(2,`0`),n=e.getMinutes().toString().padStart(2,`0`),i=e.getSeconds().toString().padStart(2,`0`);o(r?`${t}:${n}:${i}`:`${t}:${n}`)},format:n,showSeconds:r}}exports.default=h,exports.useTimePicker=g;