@wakastellar/ui 4.0.0 → 4.0.1

package/dist/components/waka-cost-breakdown/index.es.js

@@ -0,0 +1,555 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.es.js";
+import * as t from "react";
+import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/components/waka-cost-breakdown/index.tsx
+var a = [
+	"hsl(var(--chart-1))",
+	"hsl(var(--chart-2))",
+	"hsl(var(--chart-3))",
+	"hsl(var(--chart-4))",
+	"hsl(var(--chart-5))",
+	"hsl(var(--primary))",
+	"hsl(var(--info))",
+	"hsl(var(--warning))",
+	"hsl(var(--success))",
+	"hsl(var(--destructive))"
+];
+function o(e, t = 0) {
+	return e.map((e, n) => ({
+		...e,
+		color: e.color || a[(t + n) % a.length],
+		children: e.children ? o(e.children, t + n) : void 0
+	}));
+}
+function s(e) {
+	return e.reduce((e, t) => t.children && t.children.length > 0 ? e + s(t.children) : e + t.value, 0);
+}
+function c(e) {
+	return e.children && e.children.length > 0 ? s(e.children) : e.value;
+}
+function l(e, t) {
+	let n = parseInt(e.slice(1), 16), r = Math.min(255, (n >> 16) + Math.round(255 * t)), i = Math.min(255, (n >> 8 & 255) + Math.round(255 * t)), a = Math.min(255, (n & 255) + Math.round(255 * t));
+	return `#${(r << 16 | i << 8 | a).toString(16).padStart(6, "0")}`;
+}
+function u(e, t, n = 0) {
+	let r = e.reduce((e, t) => e + c(t), 0);
+	if (r === 0 || e.length === 0) return [];
+	let i = [...e].sort((e, t) => c(t) - c(e)), a = [], o = { ...t }, s = i;
+	for (; s.length > 0;) {
+		let { width: e, height: t } = o, i = e >= t, l = i ? t : e, u = [], d = 0, f = Infinity;
+		for (let n = 0; n < s.length; n++) {
+			let a = s.slice(0, n + 1), o = a.reduce((e, t) => e + c(t), 0), p = o / r, m = i ? e * p : t * p, h = 0;
+			if (a.forEach((e) => {
+				let t = l * (c(e) / o), n = Math.max(m / t, t / m);
+				h = Math.max(h, n);
+			}), h <= f) f = h, u = a, d = o;
+			else break;
+		}
+		let p = d / r, m = i ? e * p : t * p, h = 0;
+		u.forEach((e) => {
+			let t = l * (c(e) / d), r = i ? {
+				x: o.x,
+				y: o.y + h,
+				width: m,
+				height: t,
+				item: e,
+				depth: n
+			} : {
+				x: o.x + h,
+				y: o.y,
+				width: t,
+				height: m,
+				item: e,
+				depth: n
+			};
+			a.push(r), h += t;
+		}), o = i ? {
+			x: o.x + m,
+			y: o.y,
+			width: e - m,
+			height: t
+		} : {
+			x: o.x,
+			y: o.y + m,
+			width: e,
+			height: t - m
+		}, s = s.slice(u.length), r === d && (s = []);
+	}
+	return a;
+}
+function d(e, t, n, r, i, a = 0, o) {
+	let s = e.reduce((e, t) => e + c(t), 0);
+	if (s === 0) return [];
+	let l = [], u = t, f = (i - r) / 3;
+	return e.forEach((e) => {
+		let p = c(e), m = (n - t) * p / s, h = u + m;
+		l.push({
+			startAngle: u,
+			endAngle: h,
+			innerRadius: r,
+			outerRadius: r + f,
+			item: e,
+			depth: a,
+			parentColor: o
+		}), e.children && e.children.length > 0 && l.push(...d(e.children, u, h, r + f, i, a + 1, e.color)), u = h;
+	}), l;
+}
+function f(e, t, n, r, i, a) {
+	let o = (i - 90) * Math.PI / 180, s = (a - 90) * Math.PI / 180, c = e + r * Math.cos(o), l = t + r * Math.sin(o), u = e + r * Math.cos(s), d = t + r * Math.sin(s), f = e + n * Math.cos(s), p = t + n * Math.sin(s), m = e + n * Math.cos(o), h = t + n * Math.sin(o), g = +(a - i > 180);
+	return n === 0 ? `M ${e} ${t} L ${c} ${l} A ${r} ${r} 0 ${g} 1 ${u} ${d} Z` : `M ${c} ${l} A ${r} ${r} 0 ${g} 1 ${u} ${d} L ${f} ${p} A ${n} ${n} 0 ${g} 0 ${m} ${h} Z`;
+}
+function p({ path: n, onNavigate: a }) {
+	return /* @__PURE__ */ i("nav", {
+		className: "flex items-center gap-1 text-sm mb-4 flex-wrap",
+		children: [/* @__PURE__ */ r("button", {
+			onClick: () => a(-1),
+			className: e("px-2 py-1 rounded-md transition-colors", "hover:bg-muted focus:outline-none focus:ring-2 focus:ring-primary", "text-muted-foreground hover:text-foreground"),
+			children: "All"
+		}), n.map((o, s) => /* @__PURE__ */ i(t.Fragment, { children: [/* @__PURE__ */ r("span", {
+			className: "text-muted-foreground",
+			children: "/"
+		}), /* @__PURE__ */ i("button", {
+			onClick: () => a(s),
+			className: e("px-2 py-1 rounded-md transition-colors flex items-center gap-2", "hover:bg-muted focus:outline-none focus:ring-2 focus:ring-primary", s === n.length - 1 ? "text-foreground font-medium" : "text-muted-foreground hover:text-foreground"),
+			children: [o.color && /* @__PURE__ */ r("span", {
+				className: "w-2 h-2 rounded-full",
+				style: { backgroundColor: o.color }
+			}), o.name]
+		})] }, o.id))]
+	});
+}
+function m({ item: t, position: n, total: a, formatValue: o, showComparison: s }) {
+	let l = c(t), u = (l / a * 100).toFixed(1);
+	return /* @__PURE__ */ i("div", {
+		className: e("absolute z-50 px-3 py-2 text-sm rounded-lg shadow-lg", "bg-foreground text-background", "animate-in fade-in-0 zoom-in-95 duration-100", "pointer-events-none min-w-[140px]"),
+		style: {
+			left: n.x,
+			top: n.y - 70,
+			transform: "translateX(-50%)"
+		},
+		children: [
+			/* @__PURE__ */ r("div", {
+				className: "font-semibold mb-1",
+				children: t.name
+			}),
+			/* @__PURE__ */ i("div", {
+				className: "flex justify-between gap-4",
+				children: [/* @__PURE__ */ r("span", {
+					className: "opacity-70",
+					children: "Value:"
+				}), /* @__PURE__ */ r("span", {
+					className: "font-medium",
+					children: o(l)
+				})]
+			}),
+			/* @__PURE__ */ i("div", {
+				className: "flex justify-between gap-4",
+				children: [/* @__PURE__ */ r("span", {
+					className: "opacity-70",
+					children: "Share:"
+				}), /* @__PURE__ */ i("span", { children: [u, "%"] })]
+			}),
+			s && t.change !== void 0 && /* @__PURE__ */ i("div", {
+				className: "flex justify-between gap-4 mt-1 pt-1 border-t border-background/20",
+				children: [/* @__PURE__ */ r("span", {
+					className: "opacity-70",
+					children: "Change:"
+				}), /* @__PURE__ */ i("span", {
+					className: e("font-medium", t.change > 0 && "text-red-300", t.change < 0 && "text-green-300"),
+					children: [
+						t.change > 0 ? "+" : "",
+						t.change.toFixed(1),
+						"%"
+					]
+				})]
+			}),
+			t.children && t.children.length > 0 && /* @__PURE__ */ i("div", {
+				className: "text-xs opacity-70 mt-1 pt-1 border-t border-background/20",
+				children: [
+					"Click to drill down (",
+					t.children.length,
+					" items)"
+				]
+			}),
+			/* @__PURE__ */ r("div", { className: "absolute left-1/2 -translate-x-1/2 -bottom-1.5 w-3 h-3 rotate-45 bg-foreground" })
+		]
+	});
+}
+function h({ items: t, total: n, formatValue: a, hoveredId: o, onHover: s, onClick: l, showComparison: u }) {
+	return /* @__PURE__ */ r("div", {
+		className: "flex flex-col gap-1",
+		children: t.map((t) => {
+			let d = c(t), f = (d / n * 100).toFixed(1), p = o === t.id, m = o !== null && o !== t.id;
+			return /* @__PURE__ */ i("button", {
+				className: e("flex items-center gap-3 px-3 py-2 rounded-lg transition-all duration-200 text-left", "hover:bg-muted focus:outline-none focus:ring-2 focus:ring-primary", p && "bg-muted", m && "opacity-50"),
+				onMouseEnter: () => s(t.id),
+				onMouseLeave: () => s(null),
+				onClick: () => l(t),
+				children: [
+					/* @__PURE__ */ r("span", {
+						className: "w-3 h-3 rounded flex-shrink-0",
+						style: { backgroundColor: t.color }
+					}),
+					/* @__PURE__ */ r("span", {
+						className: "flex-1 truncate text-sm",
+						children: t.name
+					}),
+					/* @__PURE__ */ i("div", {
+						className: "flex flex-col items-end text-xs",
+						children: [/* @__PURE__ */ r("span", {
+							className: "font-medium",
+							children: a(d)
+						}), /* @__PURE__ */ i("span", {
+							className: "text-muted-foreground",
+							children: [f, "%"]
+						})]
+					}),
+					u && t.change !== void 0 && /* @__PURE__ */ i("span", {
+						className: e("text-xs font-medium px-1.5 py-0.5 rounded", t.change > 0 && "text-red-600 bg-red-100", t.change < 0 && "text-green-600 bg-green-100", t.change === 0 && "text-muted-foreground bg-muted"),
+						children: [
+							t.change > 0 ? "+" : "",
+							t.change.toFixed(1),
+							"%"
+						]
+					}),
+					t.children && t.children.length > 0 && /* @__PURE__ */ r("svg", {
+						className: "w-4 h-4 text-muted-foreground",
+						fill: "none",
+						viewBox: "0 0 24 24",
+						stroke: "currentColor",
+						children: /* @__PURE__ */ r("path", {
+							strokeLinecap: "round",
+							strokeLinejoin: "round",
+							strokeWidth: 2,
+							d: "M9 5l7 7-7 7"
+						})
+					})
+				]
+			}, t.id);
+		})
+	});
+}
+function g({ data: a, width: o, height: s, onItemClick: l, hoveredId: d, onHover: f, formatValue: p, showComparison: h, animated: g, total: _ }) {
+	let [v, y] = t.useState(null), b = t.useRef(null), x = t.useMemo(() => u(a, {
+		x: 0,
+		y: 0,
+		width: o,
+		height: s
+	}, 0), [
+		a,
+		o,
+		s
+	]), S = (e, t) => {
+		if (b.current) {
+			let n = b.current.getBoundingClientRect();
+			y({
+				item: t.item,
+				position: {
+					x: e.clientX - n.left,
+					y: e.clientY - n.top
+				}
+			});
+		}
+		f(t.item.id);
+	};
+	return /* @__PURE__ */ i("div", {
+		ref: b,
+		className: "relative",
+		style: {
+			width: o,
+			height: s
+		},
+		children: [/* @__PURE__ */ r("svg", {
+			width: o,
+			height: s,
+			className: "overflow-visible",
+			children: x.map((t, a) => {
+				let o = d === t.item.id, s = d !== null && d !== t.item.id, u = t.item.children && t.item.children.length > 0, p = (c(t.item) / _ * 100).toFixed(1), m = t.width >= 60 && t.height >= 40, h = t.width >= 80 && t.height >= 50;
+				return /* @__PURE__ */ i("g", {
+					className: e("cursor-pointer", g && "transition-all duration-300"),
+					style: {
+						opacity: s ? .5 : 1,
+						transform: o ? "scale(1.02)" : "scale(1)",
+						transformOrigin: `${t.x + t.width / 2}px ${t.y + t.height / 2}px`
+					},
+					onMouseMove: (e) => S(e, t),
+					onMouseLeave: () => {
+						y(null), f(null);
+					},
+					onClick: () => l(t.item),
+					children: [
+						/* @__PURE__ */ r("rect", {
+							x: t.x + 1,
+							y: t.y + 1,
+							width: Math.max(0, t.width - 2),
+							height: Math.max(0, t.height - 2),
+							fill: t.item.color,
+							rx: "4",
+							className: e(g && "transition-all duration-200", o && "brightness-110"),
+							style: { filter: o ? "brightness(1.1)" : void 0 }
+						}),
+						m && /* @__PURE__ */ i(n, { children: [/* @__PURE__ */ r("text", {
+							x: t.x + t.width / 2,
+							y: t.y + t.height / 2 - (h ? 8 : 0),
+							textAnchor: "middle",
+							dominantBaseline: "middle",
+							fill: "white",
+							className: "text-xs font-medium pointer-events-none",
+							style: { textShadow: "0 1px 2px rgba(0,0,0,0.5)" },
+							children: t.item.name.length > Math.floor(t.width / 8) ? t.item.name.slice(0, Math.floor(t.width / 8)) + "..." : t.item.name
+						}), h && /* @__PURE__ */ i("text", {
+							x: t.x + t.width / 2,
+							y: t.y + t.height / 2 + 10,
+							textAnchor: "middle",
+							dominantBaseline: "middle",
+							fill: "white",
+							className: "text-[10px] pointer-events-none opacity-80",
+							style: { textShadow: "0 1px 2px rgba(0,0,0,0.5)" },
+							children: [p, "%"]
+						})] }),
+						u && t.width >= 24 && t.height >= 24 && /* @__PURE__ */ r("circle", {
+							cx: t.x + t.width - 12,
+							cy: t.y + 12,
+							r: "8",
+							fill: "rgba(255,255,255,0.3)",
+							className: "pointer-events-none"
+						})
+					]
+				}, t.item.id);
+			})
+		}), v && /* @__PURE__ */ r(m, {
+			item: v.item,
+			position: v.position,
+			total: _,
+			formatValue: p,
+			showComparison: h
+		})]
+	});
+}
+function _({ data: n, size: o, onItemClick: s, hoveredId: c, onHover: u, formatValue: p, showComparison: h, animated: g, total: _ }) {
+	let [v, y] = t.useState(null), b = t.useRef(null), x = o / 2, S = o / 2, C = o / 2 - 20, w = t.useMemo(() => d(n, 0, 360, 50, C, 0), [
+		n,
+		50,
+		C
+	]), T = (e, t) => {
+		if (b.current) {
+			let n = b.current.getBoundingClientRect();
+			y({
+				item: t.item,
+				position: {
+					x: e.clientX - n.left,
+					y: e.clientY - n.top
+				}
+			});
+		}
+		u(t.item.id);
+	}, E = (e) => e.depth === 0 ? e.item.color || a[0] : l(e.parentColor || e.item.color || a[0], e.depth * .15);
+	return /* @__PURE__ */ i("div", {
+		ref: b,
+		className: "relative",
+		style: {
+			width: o,
+			height: o
+		},
+		children: [/* @__PURE__ */ i("svg", {
+			width: o,
+			height: o,
+			className: "overflow-visible",
+			children: [
+				/* @__PURE__ */ r("circle", {
+					cx: x,
+					cy: S,
+					r: 45,
+					fill: "none",
+					stroke: "currentColor",
+					strokeWidth: "1",
+					className: "opacity-10"
+				}),
+				w.map((t, n) => {
+					let i = c === t.item.id, a = c !== null && c !== t.item.id;
+					t.item.children && t.item.children.length;
+					let o = E(t);
+					return /* @__PURE__ */ r("path", {
+						d: f(x, S, t.innerRadius, t.outerRadius, t.startAngle, t.endAngle),
+						fill: o,
+						stroke: "white",
+						strokeWidth: "1",
+						className: e("cursor-pointer", g && "transition-all duration-200"),
+						style: {
+							opacity: a ? .5 : 1,
+							filter: i ? "brightness(1.15)" : void 0,
+							transform: i ? "scale(1.02)" : "scale(1)",
+							transformOrigin: `${x}px ${S}px`
+						},
+						onMouseMove: (e) => T(e, t),
+						onMouseLeave: () => {
+							y(null), u(null);
+						},
+						onClick: () => s(t.item)
+					}, `${t.item.id}-${t.depth}-${n}`);
+				}),
+				/* @__PURE__ */ r("text", {
+					x,
+					y: S - 8,
+					textAnchor: "middle",
+					dominantBaseline: "middle",
+					className: "text-xs font-medium fill-muted-foreground",
+					children: "Total"
+				}),
+				/* @__PURE__ */ r("text", {
+					x,
+					y: S + 10,
+					textAnchor: "middle",
+					dominantBaseline: "middle",
+					className: "text-sm font-bold fill-foreground",
+					children: p(_)
+				})
+			]
+		}), v && /* @__PURE__ */ r(m, {
+			item: v.item,
+			position: v.position,
+			total: _,
+			formatValue: p,
+			showComparison: h
+		})]
+	});
+}
+function v({ data: n, variant: a = "treemap", currency: l = "$", showLegend: u = !0, showComparison: d = !1, onItemClick: f, formatValue: m, animated: v = !0, className: y }) {
+	let [b, x] = t.useState([]), [S, C] = t.useState(null), w = t.useMemo(() => o(n), [n]), T = t.useMemo(() => {
+		let e = w;
+		for (let t of b) {
+			let n = e.find((e) => e.id === t.id);
+			if (n?.children) e = n.children;
+			else break;
+		}
+		return e;
+	}, [w, b]), E = t.useMemo(() => s(T), [T]), D = t.useCallback((e) => e >= 1e6 ? `${l}${(e / 1e6).toFixed(1)}M` : e >= 1e3 ? `${l}${(e / 1e3).toFixed(1)}K` : `${l}${e.toFixed(2)}`, [l]), O = m || D, k = t.useCallback((e) => {
+		let t = [...b.map((e) => e.id), e.id];
+		f?.(e.id, t), e.children && e.children.length > 0 && x([...b, {
+			id: e.id,
+			name: e.name,
+			color: e.color
+		}]);
+	}, [b, f]), A = t.useCallback((e) => {
+		x(e === -1 ? [] : b.slice(0, e + 1));
+	}, [b]), j = t.useMemo(() => s(w), [w]);
+	return /* @__PURE__ */ i("div", {
+		className: e("flex flex-col", y),
+		children: [
+			b.length > 0 && /* @__PURE__ */ r(p, {
+				path: b,
+				onNavigate: A
+			}),
+			/* @__PURE__ */ i("div", {
+				className: "flex items-center justify-between mb-4",
+				children: [/* @__PURE__ */ i("div", { children: [
+					/* @__PURE__ */ r("div", {
+						className: "text-sm text-muted-foreground",
+						children: b.length > 0 ? "Category Total" : "Total Cost"
+					}),
+					/* @__PURE__ */ r("div", {
+						className: "text-2xl font-bold",
+						children: O(E)
+					}),
+					b.length > 0 && /* @__PURE__ */ i("div", {
+						className: "text-xs text-muted-foreground",
+						children: [(E / j * 100).toFixed(1), "% of total"]
+					})
+				] }), d && /* @__PURE__ */ i("div", {
+					className: "text-right",
+					children: [/* @__PURE__ */ r("div", {
+						className: "text-sm text-muted-foreground",
+						children: "vs. Previous Period"
+					}), /* @__PURE__ */ r("div", {
+						className: "flex items-center gap-2 justify-end",
+						children: (() => {
+							let t = T.reduce((e, t) => e + (t.change || 0) * c(t), 0) / E;
+							return /* @__PURE__ */ i("span", {
+								className: e("text-lg font-semibold", t > 0 && "text-red-600", t < 0 && "text-green-600", t === 0 && "text-muted-foreground"),
+								children: [
+									t > 0 ? "+" : "",
+									t.toFixed(1),
+									"%"
+								]
+							});
+						})()
+					})]
+				})]
+			}),
+			/* @__PURE__ */ i("div", {
+				className: e("flex gap-6", u ? "flex-row" : "flex-col"),
+				children: [/* @__PURE__ */ r("div", {
+					className: "flex-1 min-w-0",
+					children: a === "treemap" ? /* @__PURE__ */ r(g, {
+						data: T,
+						width: 400,
+						height: 300,
+						onItemClick: k,
+						hoveredId: S,
+						onHover: C,
+						formatValue: O,
+						showComparison: d,
+						animated: v,
+						total: E
+					}) : /* @__PURE__ */ r(_, {
+						data: T,
+						size: 350,
+						onItemClick: k,
+						hoveredId: S,
+						onHover: C,
+						formatValue: O,
+						showComparison: d,
+						animated: v,
+						total: E
+					})
+				}), u && /* @__PURE__ */ i("div", {
+					className: "w-64 flex-shrink-0",
+					children: [/* @__PURE__ */ r("div", {
+						className: "text-sm font-medium mb-2 text-muted-foreground",
+						children: b.length > 0 ? "Subcategories" : "Categories"
+					}), /* @__PURE__ */ r(h, {
+						items: T,
+						total: E,
+						formatValue: O,
+						hoveredId: S,
+						onHover: C,
+						onClick: k,
+						showComparison: d
+					})]
+				})]
+			})
+		]
+	});
+}
+function y({ data: e, onDrillDown: n }) {
+	let [r, i] = t.useState([]), [a, o] = t.useState(null);
+	return {
+		path: r,
+		selectedItem: a,
+		setSelectedItem: o,
+		drillDown: t.useCallback((e) => {
+			let t = [...r, e];
+			i(t), n?.(t);
+		}, [r, n]),
+		drillUp: t.useCallback(() => {
+			let e = r.slice(0, -1);
+			i(e), n?.(e);
+		}, [r, n]),
+		reset: t.useCallback(() => {
+			i([]), o(null), n?.([]);
+		}, [n]),
+		getCurrentData: t.useCallback(() => {
+			let t = e;
+			for (let e of r) {
+				let n = t.find((t) => t.id === e);
+				if (n?.children) t = n.children;
+				else break;
+			}
+			return t;
+		}, [e, r])
+	};
+}
+//#endregion
+export { v as default, y as useCostBreakdown };

package/dist/components/waka-coupon-input/index.cjs.js

@@ -0,0 +1,36 @@
+"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`);let i=require(`react`);i=e.__toESM(i);let a=require(`lucide-react`),o=require(`react/jsx-runtime`);function s(e={}){let{initialCoupons:t=[],validateCoupon:n,allowMultiple:r=!1,maxCoupons:a=5,onApply:o,onRemove:s,statusResetDelay:c=2e3}=e,[l,u]=i.useState(``),[d,f]=i.useState(`idle`),[p,m]=i.useState(null),[h,g]=i.useState(t),_=i.useRef(null);i.useEffect(()=>()=>{_.current&&clearTimeout(_.current)},[]);let v=i.useCallback(()=>{_.current&&clearTimeout(_.current),_.current=setTimeout(()=>{f(`idle`),m(null)},c)},[c]),y=i.useMemo(()=>r?h.length<a:h.length===0,[r,h.length,a]),b=i.useCallback(e=>h.some(t=>t.code.toUpperCase()===e.toUpperCase()),[h]);return{inputValue:l,setInputValue:u,status:d,errorMessage:p,appliedCoupons:h,applyCoupon:i.useCallback(async()=>{let e=l.trim().toUpperCase();if(!e){f(`error`),m(`Please enter a coupon code`),v();return}if(b(e)){f(`error`),m(`This coupon is already applied`),v();return}if(!y){f(`error`),m(r?`Maximum ${a} coupons allowed`:`Only one coupon can be applied`),v();return}f(`loading`),m(null);try{if(n){let t=await n(e);t.isValid&&t.coupon?(g(e=>[...e,t.coupon]),o?.(t.coupon),f(`success`),u(``),v()):(f(`error`),m(t.errorMessage||`Invalid coupon code`),v())}else{let t={code:e,discountValue:10,discountType:`percentage`,description:`Discount applied`};g(e=>[...e,t]),o?.(t),f(`success`),u(``),v()}}catch(e){f(`error`),m(e instanceof Error?e.message:`Failed to validate coupon`),v()}},[l,b,y,r,a,n,o,v]),removeCoupon:i.useCallback(e=>{g(t=>t.filter(t=>t.code.toUpperCase()!==e.toUpperCase())),s?.(e)},[s]),clearAllCoupons:i.useCallback(()=>{let e=h.map(e=>e.code);g([]),e.forEach(e=>s?.(e))},[h,s]),resetInput:i.useCallback(()=>{u(``),f(`idle`),m(null),_.current&&clearTimeout(_.current)},[]),canApplyMore:y,isCodeApplied:b}}var c={sm:{input:`h-8 text-xs`,button:`h-8 px-3 text-xs`,icon:`h-3.5 w-3.5`,tag:`text-xs py-1 px-2`,tagIcon:`h-3 w-3`},md:{input:`h-9 text-sm`,button:`h-9 px-4 text-sm`,icon:`h-4 w-4`,tag:`text-sm py-1.5 px-3`,tagIcon:`h-3.5 w-3.5`},lg:{input:`h-10 text-base`,button:`h-10 px-5 text-base`,icon:`h-5 w-5`,tag:`text-base py-2 px-4`,tagIcon:`h-4 w-4`}};function l({appliedCoupons:e,onApply:l,onRemove:u,validateCoupon:d,allowMultiple:f=!1,maxCoupons:p=5,placeholder:m=`Enter coupon code`,applyButtonText:h=`Apply`,currencySymbol:g=`$`,disabled:_=!1,size:v=`md`,className:y,inputClassName:b,buttonClassName:x,showAppliedCoupons:S=!0,formatDiscount:C,id:w,name:T}){let{inputValue:E,setInputValue:D,status:O,errorMessage:k,appliedCoupons:A,applyCoupon:j,removeCoupon:M,canApplyMore:N}=s({initialCoupons:e,validateCoupon:d,allowMultiple:f,maxCoupons:p,onApply:l,onRemove:u}),P=e??A,[F,I]=i.useState(0),L=i.useRef(null),R=c[v];i.useEffect(()=>{O===`error`&&I(e=>e+1)},[O]);let z=e=>{D(e.target.value.toUpperCase())},B=e=>{e.key===`Enter`&&(e.preventDefault(),j())},V=()=>{j()},H=e=>{M(e)},U=e=>C?C(e):e.discountType===`percentage`?`${e.discountValue}% off`:`${g}${e.discountValue} off`,W=()=>{switch(O){case`loading`:return(0,o.jsx)(a.Loader2,{className:t.cn(R.icon,`animate-spin`)});case`success`:return(0,o.jsx)(a.Check,{className:R.icon});default:return h}},G=_||O===`loading`||!N;return(0,o.jsxs)(`div`,{className:t.cn(`space-y-3`,y),children:[(0,o.jsxs)(`div`,{className:`flex gap-2`,children:[(0,o.jsxs)(`div`,{className:t.cn(`relative flex-1`,O===`error`&&`waka-coupon-shake`),children:[(0,o.jsx)(`div`,{className:`absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground`,children:(0,o.jsx)(a.Ticket,{className:R.icon})}),(0,o.jsx)(r.Input,{ref:L,id:w,name:T,type:`text`,value:E,onChange:z,onKeyDown:B,placeholder:m,disabled:G,className:t.cn(R.input,`pl-10 font-mono uppercase tracking-wider`,O===`error`&&`border-destructive focus-visible:ring-destructive`,O===`success`&&`border-green-500 focus-visible:ring-green-500`,b),"aria-invalid":O===`error`,"aria-describedby":k?`coupon-error`:void 0}),O===`success`&&(0,o.jsx)(`div`,{className:`absolute right-3 top-1/2 -translate-y-1/2`,children:(0,o.jsx)(`div`,{className:`waka-coupon-success-check rounded-full bg-green-500 p-0.5`,children:(0,o.jsx)(a.Check,{className:`h-3 w-3 text-white`})})})]},F),(0,o.jsx)(n.Button,{type:`button`,onClick:V,disabled:G||!E.trim(),className:t.cn(R.button,O===`success`&&`bg-green-500 hover:bg-green-600`,x),children:W()})]}),O===`error`&&k&&(0,o.jsxs)(`p`,{id:`coupon-error`,className:`text-sm text-destructive flex items-center gap-1.5`,role:`alert`,children:[(0,o.jsx)(a.X,{className:`h-3.5 w-3.5`}),k]}),S&&P.length>0&&(0,o.jsx)(`div`,{className:`space-y-2`,children:P.map(e=>(0,o.jsxs)(`div`,{className:t.cn(`flex items-center justify-between rounded-lg border bg-muted/50 waka-coupon-applied`,R.tag),children:[(0,o.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,o.jsx)(a.Tag,{className:t.cn(R.tagIcon,`text-primary`)}),(0,o.jsx)(`span`,{className:`font-mono font-medium`,children:e.code}),(0,o.jsx)(`span`,{className:`text-muted-foreground`,children:`-`}),(0,o.jsxs)(`span`,{className:`flex items-center gap-1 text-green-600 font-medium`,children:[e.discountType===`percentage`?(0,o.jsx)(a.Percent,{className:R.tagIcon}):null,U(e)]})]}),(0,o.jsx)(n.Button,{type:`button`,variant:`ghost`,size:`icon`,onClick:()=>H(e.code),disabled:_,className:`h-6 w-6 text-muted-foreground hover:text-destructive`,"aria-label":`Remove coupon ${e.code}`,children:(0,o.jsx)(a.X,{className:`h-3.5 w-3.5`})})]},e.code))}),f&&P.length>0&&N&&(0,o.jsxs)(`p`,{className:`text-xs text-muted-foreground`,children:[P.length,` of `,p,` coupons applied`]}),(0,o.jsx)(`style`,{dangerouslySetInnerHTML:{__html:`
+            @keyframes waka-coupon-shake {
+              0%, 100% { transform: translateX(0); }
+              10%, 30%, 50%, 70%, 90% { transform: translateX(-4px); }
+              20%, 40%, 60%, 80% { transform: translateX(4px); }
+            }
+
+            @keyframes waka-coupon-success-pop {
+              0% { transform: scale(0); opacity: 0; }
+              50% { transform: scale(1.2); }
+              100% { transform: scale(1); opacity: 1; }
+            }
+
+            @keyframes waka-coupon-slide-in {
+              0% {
+                opacity: 0;
+                transform: translateY(-10px);
+              }
+              100% {
+                opacity: 1;
+                transform: translateY(0);
+              }
+            }
+
+            .waka-coupon-shake {
+              animation: waka-coupon-shake 0.4s ease-in-out;
+            }
+
+            .waka-coupon-success-check {
+              animation: waka-coupon-success-pop 0.3s ease-out;
+            }
+
+            .waka-coupon-applied {
+              animation: waka-coupon-slide-in 0.3s ease-out;
+            }
+          `}})]})}l.displayName=`WakaCouponInput`,exports.default=l,exports.useCouponInput=s;