@wakastellar/ui 4.0.0-dev.0 → 4.0.1

package/dist/components/waka-progress-onboarding/index.es.js

@@ -0,0 +1,375 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.es.js";
+import * as t from "react";
+import { Check as n, ChevronRight as r, Circle as i, X as a } from "lucide-react";
+import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region src/components/waka-progress-onboarding/index.tsx
+var l = {
+	default: {
+		gradient: "from-primary to-primary",
+		fill: "bg-primary",
+		stepActive: "bg-primary text-primary-foreground border-primary",
+		stepCompleted: "bg-primary text-primary-foreground border-primary",
+		stepPending: "bg-muted text-muted-foreground border-muted",
+		text: "text-primary"
+	},
+	blue: {
+		gradient: "from-blue-500 to-blue-600",
+		fill: "bg-blue-500",
+		stepActive: "bg-blue-500 text-white border-blue-500",
+		stepCompleted: "bg-blue-500 text-white border-blue-500",
+		stepPending: "bg-muted text-muted-foreground border-muted",
+		text: "text-blue-600"
+	},
+	green: {
+		gradient: "from-green-500 to-emerald-600",
+		fill: "bg-green-500",
+		stepActive: "bg-green-500 text-white border-green-500",
+		stepCompleted: "bg-green-500 text-white border-green-500",
+		stepPending: "bg-muted text-muted-foreground border-muted",
+		text: "text-green-600"
+	},
+	purple: {
+		gradient: "from-purple-500 to-purple-600",
+		fill: "bg-purple-500",
+		stepActive: "bg-purple-500 text-white border-purple-500",
+		stepCompleted: "bg-purple-500 text-white border-purple-500",
+		stepPending: "bg-muted text-muted-foreground border-muted",
+		text: "text-purple-600"
+	},
+	orange: {
+		gradient: "from-orange-500 to-amber-600",
+		fill: "bg-orange-500",
+		stepActive: "bg-orange-500 text-white border-orange-500",
+		stepCompleted: "bg-orange-500 text-white border-orange-500",
+		stepPending: "bg-muted text-muted-foreground border-muted",
+		text: "text-orange-600"
+	},
+	custom: {
+		gradient: "",
+		fill: "",
+		stepActive: "",
+		stepCompleted: "",
+		stepPending: "bg-muted text-muted-foreground border-muted",
+		text: ""
+	}
+};
+function u({ active: e, onComplete: n }) {
+	let [r, i] = t.useState(!1);
+	if (t.useEffect(() => {
+		if (e) {
+			i(!0);
+			let e = setTimeout(() => {
+				i(!1), n?.();
+			}, 2500);
+			return () => clearTimeout(e);
+		}
+	}, [e, n]), !r) return null;
+	let a = [
+		"#22c55e",
+		"#3b82f6",
+		"#f59e0b",
+		"#ef4444",
+		"#a855f7",
+		"#06b6d4"
+	];
+	return /* @__PURE__ */ c("div", {
+		className: "pointer-events-none absolute inset-0 overflow-hidden",
+		children: [[...Array(40)].map((e, t) => {
+			let n = t / 40 * 360, r = 60 + Math.random() * 80, i = 4 + Math.random() * 6, o = .8 + Math.random() * .4;
+			return /* @__PURE__ */ s("div", {
+				className: "absolute left-1/2 top-1/2 animate-confetti-burst-onboarding",
+				style: {
+					width: i,
+					height: i,
+					backgroundColor: a[Math.floor(Math.random() * a.length)],
+					borderRadius: Math.random() > .5 ? "50%" : "2px",
+					"--angle": `${n}deg`,
+					"--distance": `${r}px`,
+					animationDuration: `${o}s`,
+					animationDelay: `${Math.random() * .15}s`
+				}
+			}, t);
+		}), /* @__PURE__ */ s("style", { children: "\n        @keyframes confetti-burst-onboarding {\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) rotate(360deg);\n            opacity: 0;\n          }\n        }\n        .animate-confetti-burst-onboarding {\n          animation: confetti-burst-onboarding 1s ease-out forwards;\n        }\n      " })]
+	});
+}
+function d({ step: t, index: r, currentStep: a, color: u, customColor: d, variant: f, orientation: p, clickable: m, onClick: h }) {
+	let g = l[u], _ = t.completed || r < a, v = r === a, y = {
+		mini: "h-2.5 w-2.5",
+		full: "h-6 w-6"
+	}, b = {
+		mini: "h-1.5 w-1.5",
+		full: "h-3.5 w-3.5"
+	}, x = () => u === "custom" && d ? _ || v ? "text-white border-2" : g.stepPending : _ ? g.stepCompleted : v ? g.stepActive : g.stepPending, S = {};
+	return u === "custom" && d && (_ || v) && (S.backgroundColor = d, S.borderColor = d), /* @__PURE__ */ c("button", {
+		type: "button",
+		onClick: m ? h : void 0,
+		disabled: !m,
+		className: e("relative rounded-full flex items-center justify-center border-2 transition-all duration-300", y[f], x(), m && "cursor-pointer hover:scale-110", !m && "cursor-default", v && "ring-2 ring-offset-2 ring-offset-background", v && u !== "custom" && `ring-${u === "default" ? "primary" : u}-500/30`, v && u === "custom" && "ring-current/30"),
+		style: S,
+		"aria-label": `Step ${r + 1}: ${t.label}`,
+		"aria-current": v ? "step" : void 0,
+		children: [f === "full" && /* @__PURE__ */ s(o, { children: _ ? /* @__PURE__ */ s(n, { className: b[f] }) : v ? t.icon || /* @__PURE__ */ s(i, { className: e(b[f], "fill-current") }) : /* @__PURE__ */ s("span", {
+			className: "text-xs font-medium",
+			children: r + 1
+		}) }), v && /* @__PURE__ */ s("span", {
+			className: "absolute inset-0 rounded-full animate-ping opacity-30",
+			style: u === "custom" && d ? { backgroundColor: d } : {}
+		})]
+	});
+}
+function f({ steps: n, currentStep: i, variant: o = "full", orientation: f = "horizontal", showPercentage: p = !0, showStepMarkers: m = !0, animated: h = !0, color: g = "default", customColor: _, showConfettiOnComplete: v = !0, dismissible: y = !1, onDismiss: b, onStepClick: x, clickable: S = !1, className: C }) {
+	let [w, T] = t.useState(!1), [E, D] = t.useState(!1), O = t.useRef(!1), k = l[g], A = n.length, j = n.filter((e, t) => e.completed || t < i).length, M = Math.round(j / A * 100), N = M === 100;
+	t.useEffect(() => {
+		N && !O.current && v && T(!0), O.current = N;
+	}, [N, v]);
+	let P = () => {
+		D(!0), b?.();
+	};
+	if (E) return null;
+	let F = h ? {
+		width: `${M}%`,
+		transition: "width 0.5s ease-out"
+	} : { width: `${M}%` }, I = h ? {
+		height: `${M}%`,
+		transition: "height 0.5s ease-out"
+	} : { height: `${M}%` };
+	return o === "mini" ? /* @__PURE__ */ c("div", {
+		className: e("relative flex items-center gap-2", f === "vertical" && "flex-col h-full", C),
+		children: [
+			w && /* @__PURE__ */ s(u, {
+				active: w,
+				onComplete: () => T(!1)
+			}),
+			/* @__PURE__ */ s("div", {
+				className: e("relative overflow-hidden rounded-full bg-muted", f === "horizontal" ? "h-1.5 flex-1" : "w-1.5 flex-1"),
+				children: /* @__PURE__ */ s("div", {
+					className: e("absolute rounded-full bg-gradient-to-r", f === "horizontal" ? "h-full left-0 top-0" : "w-full left-0 bottom-0", g !== "custom" && k.gradient),
+					style: {
+						...f === "horizontal" ? F : I,
+						...g === "custom" && _ ? { backgroundColor: _ } : {}
+					}
+				})
+			}),
+			m && /* @__PURE__ */ s("div", {
+				className: e("flex gap-1", f === "vertical" && "flex-col"),
+				children: n.map((e, t) => /* @__PURE__ */ s(d, {
+					step: e,
+					index: t,
+					currentStep: i,
+					totalSteps: A,
+					color: g,
+					customColor: _,
+					variant: "mini",
+					orientation: f,
+					clickable: S,
+					onClick: () => x?.(t)
+				}, e.id))
+			}),
+			p && /* @__PURE__ */ c("span", {
+				className: e("text-xs font-medium tabular-nums", g !== "custom" && k.text),
+				style: g === "custom" && _ ? { color: _ } : {},
+				children: [M, "%"]
+			}),
+			y && /* @__PURE__ */ s("button", {
+				type: "button",
+				onClick: P,
+				className: "p-0.5 rounded hover:bg-muted transition-colors text-muted-foreground hover:text-foreground",
+				"aria-label": "Dismiss onboarding",
+				children: /* @__PURE__ */ s(a, { className: "h-3 w-3" })
+			})
+		]
+	}) : /* @__PURE__ */ c("div", {
+		className: e("relative rounded-lg border bg-card p-4", f === "vertical" && "max-w-xs", C),
+		children: [
+			w && /* @__PURE__ */ s(u, {
+				active: w,
+				onComplete: () => T(!1)
+			}),
+			/* @__PURE__ */ c("div", {
+				className: "flex items-center justify-between mb-3",
+				children: [/* @__PURE__ */ s("div", {
+					className: "flex items-center gap-2",
+					children: p && /* @__PURE__ */ c("span", {
+						className: e("text-sm font-semibold tabular-nums", g !== "custom" && k.text),
+						style: g === "custom" && _ ? { color: _ } : {},
+						children: [M, "% complete"]
+					})
+				}), y && /* @__PURE__ */ s("button", {
+					type: "button",
+					onClick: P,
+					className: "p-1 rounded-md hover:bg-muted transition-colors text-muted-foreground hover:text-foreground",
+					"aria-label": "Dismiss onboarding",
+					children: /* @__PURE__ */ s(a, { className: "h-4 w-4" })
+				})]
+			}),
+			/* @__PURE__ */ c("div", {
+				className: e("relative overflow-hidden rounded-full bg-muted mb-4", f === "horizontal" ? "h-2" : "w-2 h-full mx-auto"),
+				children: [/* @__PURE__ */ s("div", {
+					className: e("absolute rounded-full", f === "horizontal" ? "h-full left-0 top-0" : "w-full left-0 bottom-0", g !== "custom" && e("bg-gradient-to-r", k.gradient)),
+					style: {
+						...f === "horizontal" ? F : I,
+						...g === "custom" && _ ? { backgroundColor: _ } : {}
+					}
+				}), h && M > 0 && /* @__PURE__ */ s("div", {
+					className: "absolute inset-0 overflow-hidden rounded-full",
+					style: { width: `${M}%` },
+					children: /* @__PURE__ */ s("div", { className: "absolute inset-0 animate-shine-onboarding" })
+				})]
+			}),
+			/* @__PURE__ */ s("div", {
+				className: e(f === "horizontal" ? "flex items-start justify-between" : "flex flex-col gap-2"),
+				children: n.map((t, a) => {
+					let o = t.completed || a < i, l = a === i, u = a === n.length - 1;
+					return /* @__PURE__ */ c("div", {
+						className: e(f === "horizontal" ? "flex flex-col items-center flex-1" : "flex items-start gap-3"),
+						children: [
+							/* @__PURE__ */ c("div", {
+								className: e("flex items-center", f === "horizontal" ? "w-full" : "flex-col"),
+								children: [
+									f === "horizontal" && a > 0 && /* @__PURE__ */ s("div", {
+										className: e("flex-1 h-0.5 transition-colors duration-300", o || l ? g === "custom" ? "" : k.fill : "bg-muted"),
+										style: (o || l) && g === "custom" && _ ? { backgroundColor: _ } : {}
+									}),
+									/* @__PURE__ */ s(d, {
+										step: t,
+										index: a,
+										currentStep: i,
+										totalSteps: A,
+										color: g,
+										customColor: _,
+										variant: "full",
+										orientation: f,
+										clickable: S,
+										onClick: () => x?.(a)
+									}),
+									f === "horizontal" && !u && /* @__PURE__ */ s("div", {
+										className: e("flex-1 h-0.5 transition-colors duration-300", o ? g === "custom" ? "" : k.fill : "bg-muted"),
+										style: o && g === "custom" && _ ? { backgroundColor: _ } : {}
+									}),
+									f === "vertical" && !u && /* @__PURE__ */ s("div", {
+										className: e("w-0.5 h-6 my-1 transition-colors duration-300", o ? g === "custom" ? "" : k.fill : "bg-muted"),
+										style: o && g === "custom" && _ ? { backgroundColor: _ } : {}
+									})
+								]
+							}),
+							/* @__PURE__ */ s("div", {
+								className: e(f === "horizontal" ? "text-center mt-2 max-w-[100px]" : "flex-1 pb-2"),
+								children: /* @__PURE__ */ c("button", {
+									type: "button",
+									onClick: S ? () => x?.(a) : void 0,
+									disabled: !S,
+									className: e("text-left", S && "cursor-pointer hover:opacity-80", !S && "cursor-default"),
+									children: [/* @__PURE__ */ c("p", {
+										className: e("text-sm font-medium transition-colors", l ? "text-foreground" : "text-muted-foreground", o && "line-through opacity-60"),
+										children: [t.label, t.optional && /* @__PURE__ */ s("span", {
+											className: "ml-1 text-xs font-normal text-muted-foreground",
+											children: "(optional)"
+										})]
+									}), t.description && f === "vertical" && /* @__PURE__ */ s("p", {
+										className: "text-xs text-muted-foreground mt-0.5",
+										children: t.description
+									})]
+								})
+							}),
+							l && f === "vertical" && /* @__PURE__ */ s(r, {
+								className: e("h-4 w-4 animate-pulse", g !== "custom" && k.text),
+								style: g === "custom" && _ ? { color: _ } : {}
+							})
+						]
+					}, t.id);
+				})
+			}),
+			N && /* @__PURE__ */ s("div", {
+				className: e("mt-4 p-3 rounded-md text-center text-sm font-medium animate-fade-in-onboarding", g !== "custom" && `bg-${g === "default" ? "primary" : g}-500/10`, g !== "custom" && k.text),
+				style: g === "custom" && _ ? {
+					backgroundColor: `${_}15`,
+					color: _
+				} : {},
+				children: "Onboarding complete!"
+			}),
+			/* @__PURE__ */ s("style", { children: "\n        @keyframes shine-onboarding {\n          0% { transform: translateX(-100%); opacity: 0; }\n          50% { opacity: 0.4; }\n          100% { transform: translateX(100%); opacity: 0; }\n        }\n        .animate-shine-onboarding {\n          background: linear-gradient(90deg, transparent, rgba(255,255,255,0.5), transparent);\n          animation: shine-onboarding 2s ease-in-out infinite;\n        }\n        @keyframes fade-in-onboarding {\n          from { opacity: 0; transform: translateY(-4px); }\n          to { opacity: 1; transform: translateY(0); }\n        }\n        .animate-fade-in-onboarding {\n          animation: fade-in-onboarding 0.3s ease-out;\n        }\n      " })
+		]
+	});
+}
+function p({ initialSteps: e, initialStep: n = 0, onComplete: r, onStepChange: i, persistKey: a }) {
+	let o = t.useCallback(() => {
+		if (a && typeof window < "u") try {
+			let e = localStorage.getItem(`waka-onboarding-${a}`);
+			if (e) return JSON.parse(e);
+		} catch {}
+		return null;
+	}, [a])(), [s, c] = t.useState(o?.steps || e), [l, u] = t.useState(o?.currentStep ?? n), [d, f] = t.useState(o?.isDismissed ?? !1), p = s.filter((e, t) => e.completed || t < l).length, m = Math.round(p / s.length * 100), h = m === 100;
+	t.useEffect(() => {
+		a && typeof window < "u" && localStorage.setItem(`waka-onboarding-${a}`, JSON.stringify({
+			steps: s,
+			currentStep: l,
+			isDismissed: d
+		}));
+	}, [
+		s,
+		l,
+		d,
+		a
+	]);
+	let g = t.useRef(h);
+	t.useEffect(() => {
+		h && !g.current && r?.(), g.current = h;
+	}, [h, r]);
+	let _ = t.useCallback((e) => {
+		e >= 0 && e < s.length && (u(e), i?.(e));
+	}, [s.length, i]), v = t.useCallback(() => {
+		l < s.length - 1 && _(l + 1);
+	}, [
+		l,
+		s.length,
+		_
+	]), y = t.useCallback(() => {
+		l > 0 && _(l - 1);
+	}, [l, _]), b = t.useCallback((e) => {
+		c((t) => t.map((t) => t.id === e ? {
+			...t,
+			completed: !0
+		} : t));
+	}, []);
+	return {
+		currentStep: l,
+		steps: s,
+		isCompleted: h,
+		isDismissed: d,
+		percentage: m,
+		goToStep: _,
+		nextStep: v,
+		prevStep: y,
+		completeStep: b,
+		uncompleteStep: t.useCallback((e) => {
+			c((t) => t.map((t) => t.id === e ? {
+				...t,
+				completed: !1
+			} : t));
+		}, []),
+		completeAndNext: t.useCallback(() => {
+			l < s.length && (b(s[l].id), v());
+		}, [
+			l,
+			s,
+			b,
+			v
+		]),
+		dismiss: t.useCallback(() => {
+			f(!0);
+		}, []),
+		reset: t.useCallback(() => {
+			c(e.map((e) => ({
+				...e,
+				completed: !1
+			}))), u(0), f(!1), a && typeof window < "u" && localStorage.removeItem(`waka-onboarding-${a}`);
+		}, [e, a]),
+		setSteps: t.useCallback((e) => {
+			c(e);
+		}, [])
+	};
+}
+//#endregion
+export { f as default, p as useProgressOnboarding };

package/dist/components/waka-pull-to-refresh/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(`class-variance-authority`),i=require(`react/jsx-runtime`);var a=(0,r.cva)(`relative overflow-hidden touch-pan-y`,{variants:{variant:{default:``,ios:``,material:``}},defaultVariants:{variant:`default`}}),o=(0,r.cva)(`absolute left-0 right-0 flex items-center justify-center transition-transform`,{variants:{variant:{default:`top-0 -translate-y-full`,ios:`top-0 -translate-y-full`,material:`top-0 -translate-y-full`}},defaultVariants:{variant:`default`}});function s(e=`light`){typeof window<`u`&&`vibrate`in navigator&&navigator.vibrate({light:10,medium:20,heavy:30}[e])}function c({size:e=24,className:n}){return(0,i.jsxs)(`svg`,{className:t.cn(`animate-spin text-primary`,n),width:e,height:e,viewBox:`0 0 24 24`,fill:`none`,"aria-hidden":`true`,focusable:`false`,children:[(0,i.jsx)(`circle`,{className:`opacity-25`,cx:`12`,cy:`12`,r:`10`,stroke:`currentColor`,strokeWidth:`3`}),(0,i.jsx)(`path`,{className:`opacity-75`,fill:`currentColor`,d:`M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z`})]})}function l({progress:e,ready:n,size:r=24,className:a}){let o=n?180:e*180;return(0,i.jsx)(`svg`,{className:t.cn(`text-muted-foreground transition-transform`,a),width:r,height:r,viewBox:`0 0 24 24`,fill:`none`,style:{transform:`rotate(${o}deg)`},"aria-hidden":`true`,focusable:`false`,children:(0,i.jsx)(`path`,{d:`M12 4v16m0-16l-6 6m6-6l6 6`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`})})}function u({state:e,progress:t,pullingText:n,readyText:r,refreshingText:a,completeText:o,variant:s=`default`}){return s===`ios`?(0,i.jsx)(`div`,{className:`flex flex-col items-center gap-2 py-4`,children:e===`refreshing`?(0,i.jsx)(c,{size:28}):e===`complete`?(0,i.jsx)(`div`,{className:`text-green-500 text-2xl`,children:`✓`}):(0,i.jsx)(l,{progress:t,ready:e===`ready`,size:28})}):s===`material`?(0,i.jsx)(`div`,{className:`py-4`,children:(0,i.jsx)(`div`,{className:`w-10 h-10 rounded-full bg-background shadow-lg flex items-center justify-center`,style:{transform:`scale(${Math.min(t,1)})`,opacity:Math.min(t*2,1)},children:e===`refreshing`?(0,i.jsx)(c,{size:24}):e===`complete`?(0,i.jsx)(`span`,{className:`text-green-500 text-lg`,children:`✓`}):(0,i.jsx)(l,{progress:t,ready:e===`ready`,size:20})})}):(0,i.jsx)(`div`,{className:`flex flex-col items-center gap-2 py-4`,children:e===`refreshing`?(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(c,{}),(0,i.jsx)(`span`,{className:`text-sm text-muted-foreground`,children:a})]}):e===`complete`?(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(`div`,{className:`text-green-500 text-xl`,children:`✓`}),(0,i.jsx)(`span`,{className:`text-sm text-muted-foreground`,children:o})]}):(0,i.jsxs)(i.Fragment,{children:[(0,i.jsx)(l,{progress:t,ready:e===`ready`}),(0,i.jsx)(`span`,{className:`text-sm text-muted-foreground`,children:e===`ready`?r:n})]})})}var d=n.forwardRef(({onRefresh:e,pullThreshold:r=80,maxPull:c=150,resistance:l=.5,indicator:d,pullingText:f=`Pull to refresh`,readyText:p=`Release to refresh`,refreshingText:m=`Refreshing...`,completeText:h=`Done!`,hapticFeedback:g=!0,disabled:_=!1,onStateChange:v,variant:y,className:b,children:x,...S},C)=>{let w=n.useRef(null),T=n.useRef(null),[E,D]=n.useState(`idle`),[O,k]=n.useState(0),[A,j]=n.useState(null),[M,N]=n.useState(!1);n.useImperativeHandle(C,()=>w.current);let P=Math.min(O/r,1),F=n.useCallback(e=>{D(e),v?.(e)},[v]),I=n.useCallback(e=>{_||E===`refreshing`||((T.current?.scrollTop??0)<=0?(j(e.touches[0].clientY),N(!0)):N(!1))},[_,E]),L=n.useCallback(e=>{if(!M||A===null||_||E===`refreshing`)return;let t=e.touches[0].clientY-A;if(t>0){let n=Math.min(t*l,c);k(n),n>=r&&E!==`ready`?(F(`ready`),g&&s(`medium`)):n<r&&n>0&&E!==`pulling`&&F(`pulling`),e.preventDefault()}},[M,A,_,E,l,c,r,F,g]),R=n.useCallback(async()=>{if(!(_||A===null))if(j(null),N(!1),E===`ready`){F(`refreshing`),k(r);try{await e(),F(`complete`),g&&s(`light`),setTimeout(()=>{k(0),F(`idle`)},500)}catch{k(0),F(`idle`)}}else k(0),F(`idle`)},[_,A,E,F,r,e,g]),z=()=>typeof d==`function`?d(E,P):d||(0,i.jsx)(u,{state:E,progress:P,pullingText:f,readyText:p,refreshingText:m,completeText:h,variant:y??`default`});return(0,i.jsxs)(`div`,{ref:w,className:t.cn(a({variant:y}),b),...S,children:[(0,i.jsx)(`div`,{className:t.cn(o({variant:y})),style:{transform:`translateY(${O}px)`,transition:E===`refreshing`||E===`idle`?`transform 0.3s ease-out`:`none`},children:z()}),(0,i.jsx)(`div`,{ref:T,className:`h-full overflow-auto`,style:{transform:`translateY(${O}px)`,transition:E===`refreshing`||E===`idle`?`transform 0.3s ease-out`:`none`},onTouchStart:I,onTouchMove:L,onTouchEnd:R,onTouchCancel:R,children:x})]})});d.displayName=`WakaPullToRefresh`;function f({onRefresh:e,onStateChange:t}){let[r,i]=n.useState(`idle`),[a,o]=n.useState(!1);return{state:r,isRefreshing:a,refresh:n.useCallback(async()=>{if(!a){o(!0),i(`refreshing`),t?.(`refreshing`);try{await e(),i(`complete`),t?.(`complete`),setTimeout(()=>{i(`idle`),t?.(`idle`),o(!1)},500)}catch{i(`idle`),t?.(`idle`),o(!1)}}},[a,e,t])}}exports.WakaPullToRefresh=d,exports.usePullToRefresh=f;

package/dist/components/waka-pull-to-refresh/index.d.ts

@@ -29,9 +29,9 @@ export interface WakaPullToRefreshProps extends React.HTMLAttributes<HTMLDivElem
     /** Children to render as scrollable content */
     children: React.ReactNode;
 }
-declare const pullToRefreshVariants: (props?: {
-    variant?: "default" | "ios" | "material";
-} & import("class-variance-authority/types").ClassProp) => string;
+declare const pullToRefreshVariants: (props?: ({
+    variant?: "default" | "ios" | "material" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
 export declare const WakaPullToRefresh: React.ForwardRefExoticComponent<WakaPullToRefreshProps & React.RefAttributes<HTMLDivElement>>;
 export interface UsePullToRefreshOptions {
     onRefresh: () => Promise<void>;

package/dist/components/waka-pull-to-refresh/index.es.js

@@ -0,0 +1,224 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.es.js";
+import * as t from "react";
+import { cva as n } from "class-variance-authority";
+import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region src/components/waka-pull-to-refresh/index.tsx
+var o = n("relative overflow-hidden touch-pan-y", {
+	variants: { variant: {
+		default: "",
+		ios: "",
+		material: ""
+	} },
+	defaultVariants: { variant: "default" }
+}), s = n("absolute left-0 right-0 flex items-center justify-center transition-transform", {
+	variants: { variant: {
+		default: "top-0 -translate-y-full",
+		ios: "top-0 -translate-y-full",
+		material: "top-0 -translate-y-full"
+	} },
+	defaultVariants: { variant: "default" }
+});
+function c(e = "light") {
+	typeof window < "u" && "vibrate" in navigator && navigator.vibrate({
+		light: 10,
+		medium: 20,
+		heavy: 30
+	}[e]);
+}
+function l({ size: t = 24, className: n }) {
+	return /* @__PURE__ */ a("svg", {
+		className: e("animate-spin text-primary", n),
+		width: t,
+		height: t,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		"aria-hidden": "true",
+		focusable: "false",
+		children: [/* @__PURE__ */ i("circle", {
+			className: "opacity-25",
+			cx: "12",
+			cy: "12",
+			r: "10",
+			stroke: "currentColor",
+			strokeWidth: "3"
+		}), /* @__PURE__ */ i("path", {
+			className: "opacity-75",
+			fill: "currentColor",
+			d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
+		})]
+	});
+}
+function u({ progress: t, ready: n, size: r = 24, className: a }) {
+	let o = n ? 180 : t * 180;
+	return /* @__PURE__ */ i("svg", {
+		className: e("text-muted-foreground transition-transform", a),
+		width: r,
+		height: r,
+		viewBox: "0 0 24 24",
+		fill: "none",
+		style: { transform: `rotate(${o}deg)` },
+		"aria-hidden": "true",
+		focusable: "false",
+		children: /* @__PURE__ */ i("path", {
+			d: "M12 4v16m0-16l-6 6m6-6l6 6",
+			stroke: "currentColor",
+			strokeWidth: "2",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	});
+}
+function d({ state: e, progress: t, pullingText: n, readyText: o, refreshingText: s, completeText: c, variant: d = "default" }) {
+	return d === "ios" ? /* @__PURE__ */ i("div", {
+		className: "flex flex-col items-center gap-2 py-4",
+		children: e === "refreshing" ? /* @__PURE__ */ i(l, { size: 28 }) : e === "complete" ? /* @__PURE__ */ i("div", {
+			className: "text-green-500 text-2xl",
+			children: "✓"
+		}) : /* @__PURE__ */ i(u, {
+			progress: t,
+			ready: e === "ready",
+			size: 28
+		})
+	}) : d === "material" ? /* @__PURE__ */ i("div", {
+		className: "py-4",
+		children: /* @__PURE__ */ i("div", {
+			className: "w-10 h-10 rounded-full bg-background shadow-lg flex items-center justify-center",
+			style: {
+				transform: `scale(${Math.min(t, 1)})`,
+				opacity: Math.min(t * 2, 1)
+			},
+			children: e === "refreshing" ? /* @__PURE__ */ i(l, { size: 24 }) : e === "complete" ? /* @__PURE__ */ i("span", {
+				className: "text-green-500 text-lg",
+				children: "✓"
+			}) : /* @__PURE__ */ i(u, {
+				progress: t,
+				ready: e === "ready",
+				size: 20
+			})
+		})
+	}) : /* @__PURE__ */ i("div", {
+		className: "flex flex-col items-center gap-2 py-4",
+		children: e === "refreshing" ? /* @__PURE__ */ a(r, { children: [/* @__PURE__ */ i(l, {}), /* @__PURE__ */ i("span", {
+			className: "text-sm text-muted-foreground",
+			children: s
+		})] }) : e === "complete" ? /* @__PURE__ */ a(r, { children: [/* @__PURE__ */ i("div", {
+			className: "text-green-500 text-xl",
+			children: "✓"
+		}), /* @__PURE__ */ i("span", {
+			className: "text-sm text-muted-foreground",
+			children: c
+		})] }) : /* @__PURE__ */ a(r, { children: [/* @__PURE__ */ i(u, {
+			progress: t,
+			ready: e === "ready"
+		}), /* @__PURE__ */ i("span", {
+			className: "text-sm text-muted-foreground",
+			children: e === "ready" ? o : n
+		})] })
+	});
+}
+var f = t.forwardRef(({ onRefresh: n, pullThreshold: r = 80, maxPull: l = 150, resistance: u = .5, indicator: f, pullingText: p = "Pull to refresh", readyText: m = "Release to refresh", refreshingText: h = "Refreshing...", completeText: g = "Done!", hapticFeedback: _ = !0, disabled: v = !1, onStateChange: y, variant: b, className: x, children: S, ...C }, w) => {
+	let T = t.useRef(null), E = t.useRef(null), [D, O] = t.useState("idle"), [k, A] = t.useState(0), [j, M] = t.useState(null), [N, P] = t.useState(!1);
+	t.useImperativeHandle(w, () => T.current);
+	let F = Math.min(k / r, 1), I = t.useCallback((e) => {
+		O(e), y?.(e);
+	}, [y]), L = t.useCallback((e) => {
+		v || D === "refreshing" || ((E.current?.scrollTop ?? 0) <= 0 ? (M(e.touches[0].clientY), P(!0)) : P(!1));
+	}, [v, D]), R = t.useCallback((e) => {
+		if (!N || j === null || v || D === "refreshing") return;
+		let t = e.touches[0].clientY - j;
+		if (t > 0) {
+			let n = Math.min(t * u, l);
+			A(n), n >= r && D !== "ready" ? (I("ready"), _ && c("medium")) : n < r && n > 0 && D !== "pulling" && I("pulling"), e.preventDefault();
+		}
+	}, [
+		N,
+		j,
+		v,
+		D,
+		u,
+		l,
+		r,
+		I,
+		_
+	]), z = t.useCallback(async () => {
+		if (!(v || j === null)) if (M(null), P(!1), D === "ready") {
+			I("refreshing"), A(r);
+			try {
+				await n(), I("complete"), _ && c("light"), setTimeout(() => {
+					A(0), I("idle");
+				}, 500);
+			} catch {
+				A(0), I("idle");
+			}
+		} else A(0), I("idle");
+	}, [
+		v,
+		j,
+		D,
+		I,
+		r,
+		n,
+		_
+	]), B = () => typeof f == "function" ? f(D, F) : f || /* @__PURE__ */ i(d, {
+		state: D,
+		progress: F,
+		pullingText: p,
+		readyText: m,
+		refreshingText: h,
+		completeText: g,
+		variant: b ?? "default"
+	});
+	return /* @__PURE__ */ a("div", {
+		ref: T,
+		className: e(o({ variant: b }), x),
+		...C,
+		children: [/* @__PURE__ */ i("div", {
+			className: e(s({ variant: b })),
+			style: {
+				transform: `translateY(${k}px)`,
+				transition: D === "refreshing" || D === "idle" ? "transform 0.3s ease-out" : "none"
+			},
+			children: B()
+		}), /* @__PURE__ */ i("div", {
+			ref: E,
+			className: "h-full overflow-auto",
+			style: {
+				transform: `translateY(${k}px)`,
+				transition: D === "refreshing" || D === "idle" ? "transform 0.3s ease-out" : "none"
+			},
+			onTouchStart: L,
+			onTouchMove: R,
+			onTouchEnd: z,
+			onTouchCancel: z,
+			children: S
+		})]
+	});
+});
+f.displayName = "WakaPullToRefresh";
+function p({ onRefresh: e, onStateChange: n }) {
+	let [r, i] = t.useState("idle"), [a, o] = t.useState(!1);
+	return {
+		state: r,
+		isRefreshing: a,
+		refresh: t.useCallback(async () => {
+			if (!a) {
+				o(!0), i("refreshing"), n?.("refreshing");
+				try {
+					await e(), i("complete"), n?.("complete"), setTimeout(() => {
+						i("idle"), n?.("idle"), o(!1);
+					}, 500);
+				} catch {
+					i("idle"), n?.("idle"), o(!1);
+				}
+			}
+		}, [
+			a,
+			e,
+			n
+		])
+	};
+}
+//#endregion
+export { f as WakaPullToRefresh, p as usePullToRefresh };

package/dist/components/waka-qrcode/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`);let r=require(`react`);r=e.__toESM(r);let i=require(`lucide-react`),a=require(`react/jsx-runtime`);function o(e,t){let n=Math.max(21,Math.min(177,21+Math.floor(e.length/10)*4)),r=[];for(let t=0;t<n;t++){r[t]=[];for(let i=0;i<n;i++)if(t<7&&i<7||t<7&&i>=n-7||t>=n-7&&i<7){let e=t<7?t:t-(n-7),a=i<7?i:i>=n-7?i-(n-7):i;e===0||e===6||a===0||a===6||e>=2&&e<=4&&a>=2&&a<=4?r[t][i]=!0:r[t][i]=!1}else{let a=(e.charCodeAt((t*n+i)%e.length)||0)+t*31+i*17;r[t][i]=a%3==0}}return{modules:r,size:n}}function s({value:e,size:s=200,errorCorrectionLevel:c=`M`,fgColor:l=`#000000`,bgColor:u=`#FFFFFF`,includeMargin:d=!0,logoUrl:f,logoSize:p=.2,showActions:m=!1,className:h}){let g=r.useRef(null),[_,v]=r.useState(!1);return r.useEffect(()=>{let t=g.current;if(!t||!e)return;let n=t.getContext(`2d`);if(!n)return;let r=o(e,c),i=d?4:0,a=s/(r.size+i*2);n.fillStyle=u,n.fillRect(0,0,s,s),n.fillStyle=l;for(let e=0;e<r.size;e++)for(let t=0;t<r.size;t++)r.modules[e][t]&&n.fillRect((t+i)*a,(e+i)*a,a,a);if(f){let e=new Image;e.crossOrigin=`anonymous`,e.onload=()=>{let t=s*p,r=(s-t)/2,i=(s-t)/2;n.fillStyle=u,n.fillRect(r-4,i-4,t+8,t+8),n.drawImage(e,r,i,t,t)},e.src=f}},[e,s,c,l,u,d,f,p]),(0,a.jsxs)(`div`,{className:t.cn(`inline-flex flex-col items-center gap-2`,h),children:[(0,a.jsx)(`canvas`,{ref:g,width:s,height:s,className:`rounded-lg`,style:{width:s,height:s}}),m&&(0,a.jsxs)(`div`,{className:`flex gap-2`,children:[(0,a.jsxs)(n.Button,{variant:`outline`,size:`sm`,onClick:()=>{let e=g.current;if(!e)return;let t=document.createElement(`a`);t.download=`qrcode-${Date.now()}.png`,t.href=e.toDataURL(`image/png`),t.click()},children:[(0,a.jsx)(i.Download,{className:`h-4 w-4 mr-1`}),`Télécharger`]}),(0,a.jsxs)(n.Button,{variant:`outline`,size:`sm`,onClick:async()=>{let e=g.current;if(e)try{let t=await new Promise(t=>{e.toBlob(e=>{e&&t(e)},`image/png`)});await navigator.clipboard.write([new ClipboardItem({"image/png":t})]),v(!0),setTimeout(()=>v(!1),2e3)}catch(e){console.error(`Failed to copy QR code:`,e)}},children:[_?(0,a.jsx)(i.Check,{className:`h-4 w-4 mr-1`}):(0,a.jsx)(i.Copy,{className:`h-4 w-4 mr-1`}),_?`Copié`:`Copier`]})]})]})}function c(e=``){let[t,n]=r.useState(e);return{value:t,setValue:n,props:{value:t}}}exports.default=s,exports.useQRCode=c;