@wakastellar/ui 4.0.0 → 4.0.1

package/dist/components/waka-credit-burn-rate/index.es.js

@@ -0,0 +1,252 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.es.js";
+import * as t from "react";
+import { AlertTriangle as n, Clock as r, TrendingDown as i } from "lucide-react";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+//#region src/components/waka-credit-burn-rate/index.tsx
+function s(e) {
+	if (e.length === 0) return 0;
+	let t = e.slice(-7);
+	return t.reduce((e, t) => e + t.value, 0) / t.length;
+}
+function c(e, t) {
+	return t <= 0 ? Infinity : Math.floor(e / t);
+}
+function l(e) {
+	if (!isFinite(e) || e <= 0) return null;
+	let t = /* @__PURE__ */ new Date();
+	return t.setDate(t.getDate() + e), t;
+}
+function u(e) {
+	return e.toLocaleDateString("en-US", {
+		month: "short",
+		day: "numeric",
+		year: "numeric"
+	});
+}
+function d(e) {
+	return e < 7 ? {
+		stroke: "#ef4444",
+		text: "text-red-600",
+		bg: "bg-red-100 dark:bg-red-950",
+		label: "Critical"
+	} : e <= 30 ? {
+		stroke: "#f59e0b",
+		text: "text-amber-600",
+		bg: "bg-amber-100 dark:bg-amber-950",
+		label: "Warning"
+	} : {
+		stroke: "#22c55e",
+		text: "text-green-600",
+		bg: "bg-green-100 dark:bg-green-950",
+		label: "Healthy"
+	};
+}
+function f({ dailyUsage: n, avgBurnRate: r, width: i, height: s, showProjection: c, projectionDays: l, statusColor: u, animated: d }) {
+	let [f, p] = t.useState(0), [m, h] = t.useState(!d), g = t.useRef(null), _ = i - 4, v = s - 4, y = n.length + (c ? l : 0), b = n.map((e) => e.value), x = c ? Array.from({ length: l }, () => r) : [], S = [...b, ...x], C = Math.min(...S, 0), w = Math.max(...S, 1) - C || 1, T = n.map((e, t) => `${2 + t / (y - 1) * _},${2 + v - (e.value - C) / w * v}`), E = [];
+	if (c && n.length > 0) {
+		let e = n.length - 1, t = 2 + e / (y - 1) * _, i = 2 + v - (n[e].value - C) / w * v;
+		E.push(`${t},${i}`);
+		for (let e = 1; e <= l; e++) {
+			let t = 2 + (n.length - 1 + e) / (y - 1) * _, i = 2 + v - (r - C) / w * v;
+			E.push(`${t},${i}`);
+		}
+	}
+	return t.useEffect(() => {
+		g.current && p(g.current.getTotalLength());
+	}, [n]), t.useEffect(() => {
+		if (d && f > 0) {
+			let e = setTimeout(() => h(!0), 50);
+			return () => clearTimeout(e);
+		}
+	}, [d, f]), n.length < 2 ? /* @__PURE__ */ a("svg", {
+		width: i,
+		height: s,
+		children: /* @__PURE__ */ a("text", {
+			x: i / 2,
+			y: s / 2,
+			textAnchor: "middle",
+			dominantBaseline: "middle",
+			className: "text-xs fill-muted-foreground",
+			children: "Not enough data"
+		})
+	}) : /* @__PURE__ */ o("svg", {
+		width: i,
+		height: s,
+		className: "overflow-visible",
+		children: [
+			/* @__PURE__ */ a("polyline", {
+				ref: g,
+				points: T.join(" "),
+				fill: "none",
+				stroke: u,
+				strokeWidth: "1.5",
+				strokeLinecap: "round",
+				strokeLinejoin: "round",
+				style: d && f > 0 ? {
+					strokeDasharray: f,
+					strokeDashoffset: m ? 0 : f,
+					transition: "stroke-dashoffset 1s ease-out"
+				} : void 0
+			}),
+			c && E.length > 1 && /* @__PURE__ */ a("polyline", {
+				points: E.join(" "),
+				fill: "none",
+				stroke: u,
+				strokeWidth: "1.5",
+				strokeLinecap: "round",
+				strokeLinejoin: "round",
+				strokeDasharray: "4,3",
+				opacity: "0.5",
+				className: e(d && "transition-opacity duration-500", d && (m ? "opacity-50" : "opacity-0"))
+			}),
+			n.length > 0 && /* @__PURE__ */ a("circle", {
+				cx: parseFloat(T[T.length - 1].split(",")[0]),
+				cy: parseFloat(T[T.length - 1].split(",")[1]),
+				r: "2.5",
+				fill: u,
+				stroke: "white",
+				strokeWidth: "1",
+				className: e(d && "transition-opacity duration-500", d && (m ? "opacity-100" : "opacity-0"))
+			})
+		]
+	});
+}
+function p({ dailyUsage: t, avgBurnRate: n, daysRemaining: r, width: i, height: s, showProjection: c, projectionDays: l, animated: u, className: p }) {
+	let m = d(r);
+	return /* @__PURE__ */ o("div", {
+		className: e("inline-flex items-center gap-2", p),
+		children: [/* @__PURE__ */ a(f, {
+			dailyUsage: t,
+			avgBurnRate: n,
+			width: i,
+			height: s,
+			showProjection: c,
+			projectionDays: l,
+			statusColor: m.stroke,
+			animated: u
+		}), /* @__PURE__ */ a("span", {
+			className: e("text-xs font-medium tabular-nums", m.text),
+			children: isFinite(r) ? `${r}d` : "--"
+		})]
+	});
+}
+function m({ dailyUsage: t, balance: s, avgBurnRate: c, daysRemaining: l, depletionDate: p, width: m, height: h, showProjection: g, projectionDays: _, animated: v, className: y }) {
+	let b = d(l);
+	return /* @__PURE__ */ o("div", {
+		className: e("rounded-lg border bg-card p-4 space-y-4", y),
+		children: [
+			/* @__PURE__ */ o("div", {
+				className: "flex items-center justify-between",
+				children: [/* @__PURE__ */ o("div", {
+					className: "flex items-center gap-2 text-sm font-medium text-muted-foreground",
+					children: [/* @__PURE__ */ a(i, { className: "h-4 w-4" }), /* @__PURE__ */ a("span", { children: "Credit Burn Rate" })]
+				}), /* @__PURE__ */ a("div", {
+					className: e("px-2 py-0.5 rounded-full text-xs font-medium", b.bg, b.text),
+					children: b.label
+				})]
+			}),
+			/* @__PURE__ */ a("div", {
+				className: "flex justify-center",
+				children: /* @__PURE__ */ a(f, {
+					dailyUsage: t,
+					avgBurnRate: c,
+					width: m,
+					height: h,
+					showProjection: g,
+					projectionDays: _,
+					statusColor: b.stroke,
+					animated: v
+				})
+			}),
+			/* @__PURE__ */ o("div", {
+				className: "grid grid-cols-3 gap-3",
+				children: [
+					/* @__PURE__ */ o("div", {
+						className: "space-y-1",
+						children: [
+							/* @__PURE__ */ a("div", {
+								className: "text-xs text-muted-foreground",
+								children: "Burn Rate"
+							}),
+							/* @__PURE__ */ a("div", {
+								className: "text-lg font-bold tabular-nums",
+								children: c.toFixed(1)
+							}),
+							/* @__PURE__ */ a("div", {
+								className: "text-xs text-muted-foreground",
+								children: "credits/day"
+							})
+						]
+					}),
+					/* @__PURE__ */ o("div", {
+						className: "space-y-1",
+						children: [
+							/* @__PURE__ */ o("div", {
+								className: "flex items-center gap-1 text-xs text-muted-foreground",
+								children: [/* @__PURE__ */ a(r, { className: "h-3 w-3" }), /* @__PURE__ */ a("span", { children: "Days Left" })]
+							}),
+							/* @__PURE__ */ a("div", {
+								className: e("text-lg font-bold tabular-nums", b.text),
+								children: isFinite(l) ? l : "--"
+							}),
+							/* @__PURE__ */ o("div", {
+								className: "text-xs text-muted-foreground",
+								children: [s.toLocaleString(), " credits"]
+							})
+						]
+					}),
+					/* @__PURE__ */ o("div", {
+						className: "space-y-1",
+						children: [
+							/* @__PURE__ */ a("div", {
+								className: "text-xs text-muted-foreground",
+								children: "Depleted By"
+							}),
+							/* @__PURE__ */ a("div", {
+								className: e("text-sm font-semibold", b.text),
+								children: p ? u(p) : "--"
+							}),
+							l < 7 && isFinite(l) && /* @__PURE__ */ o("div", {
+								className: "flex items-center gap-1 text-xs text-red-600",
+								children: [/* @__PURE__ */ a(n, { className: "h-3 w-3" }), /* @__PURE__ */ a("span", { children: "Critical" })]
+							})
+						]
+					})
+				]
+			})
+		]
+	});
+}
+function h({ dailyUsage: n, balance: r, showProjection: i = !1, projectionDays: o = 7, width: u = 120, height: d = 32, animated: f = !0, variant: h = "sparkline", className: g }) {
+	let _ = t.useMemo(() => s(n), [n]), v = t.useMemo(() => c(r, _), [r, _]), y = t.useMemo(() => l(v), [v]);
+	return !n || n.length === 0 ? /* @__PURE__ */ a("div", {
+		className: e("inline-flex items-center gap-2 text-muted-foreground text-sm", g),
+		children: "No data"
+	}) : h === "card" ? /* @__PURE__ */ a(m, {
+		dailyUsage: n,
+		balance: r,
+		avgBurnRate: _,
+		daysRemaining: v,
+		depletionDate: y,
+		width: Math.max(u, 200),
+		height: Math.max(d, 48),
+		showProjection: i,
+		projectionDays: o,
+		animated: f,
+		className: g
+	}) : /* @__PURE__ */ a(p, {
+		dailyUsage: n,
+		avgBurnRate: _,
+		daysRemaining: v,
+		width: u,
+		height: d,
+		showProjection: i,
+		projectionDays: o,
+		animated: f,
+		className: g
+	});
+}
+//#endregion
+export { h as default };

package/dist/components/waka-credit-card-input/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(`../input/index.cjs.js`);let r=require(`react`);r=e.__toESM(r);let i=require(`lucide-react`),a=require(`react/jsx-runtime`);var o=[{type:`amex`,pattern:/^3[47]/,lengths:[15],cvvLength:4},{type:`visa`,pattern:/^4/,lengths:[13,16,19],cvvLength:3},{type:`mastercard`,pattern:/^(5[1-5]|2[2-7])/,lengths:[16],cvvLength:3},{type:`discover`,pattern:/^(6011|65|64[4-9])/,lengths:[16,19],cvvLength:3},{type:`diners`,pattern:/^(36|38|30[0-5])/,lengths:[14],cvvLength:3},{type:`jcb`,pattern:/^35/,lengths:[16,19],cvvLength:3},{type:`unionpay`,pattern:/^62/,lengths:[16,17,18,19],cvvLength:3},{type:`maestro`,pattern:/^(50|5[6-9]|6[0-9])/,lengths:[12,13,14,15,16,17,18,19],cvvLength:3}];function s(e){let t=e.replace(/\D/g,``);for(let e of o)if(e.pattern.test(t))return e.type;return`unknown`}function c(e){return o.find(t=>t.type===e)||{type:`unknown`,pattern:/.*/,lengths:[16],cvvLength:3}}function l(e){let t=e.replace(/\D/g,``);if(t.length===0)return!1;let n=0,r=!1;for(let e=t.length-1;e>=0;e--){let i=parseInt(t[e],10);r&&(i*=2,i>9&&(i-=9)),n+=i,r=!r}return n%10==0}function u(e,t){let n=e.replace(/\D/g,``);if(t===`amex`)return[n.slice(0,4),n.slice(4,10),n.slice(10,15)].filter(Boolean).join(` `);let r=[];for(let e=0;e<n.length;e+=4)r.push(n.slice(e,e+4));return r.join(` `)}function d(e){let t=e.replace(/\D/g,``);return t.length>=2?`${t.slice(0,2)}/${t.slice(2,4)}`:t}function f(e){let t=e.match(/^(\d{2})\/(\d{2})$/);return t?{month:parseInt(t[1],10),year:parseInt(t[2],10)+2e3}:null}function p(e){let t=f(e);if(!t)return!1;let{month:n,year:r}=t;if(n<1||n>12)return!1;let i=new Date,a=i.getFullYear(),o=i.getMonth()+1;return!(r<a||r===a&&n<o)}function m({type:e,className:n}){let r=t.cn(`w-8 h-6`,n);switch(e){case`visa`:return(0,a.jsxs)(`svg`,{className:r,viewBox:`0 0 48 32`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,children:[(0,a.jsx)(`rect`,{width:`48`,height:`32`,rx:`4`,fill:`#1A1F71`}),(0,a.jsx)(`path`,{d:`M20.5 21.5L22.5 10.5H25.5L23.5 21.5H20.5Z`,fill:`white`}),(0,a.jsx)(`path`,{d:`M32.5 10.7C31.9 10.5 31 10.2 29.8 10.2C26.8 10.2 24.7 11.7 24.7 13.9C24.7 15.5 26.2 16.4 27.3 16.9C28.5 17.5 28.9 17.9 28.9 18.4C28.9 19.2 27.9 19.5 27 19.5C25.8 19.5 25.1 19.3 24.1 18.9L23.7 18.7L23.3 21.3C24 21.6 25.3 21.8 26.6 21.8C29.8 21.8 31.8 20.3 31.9 18C31.9 16.7 31.1 15.7 29.4 14.9C28.4 14.4 27.8 14 27.8 13.5C27.8 13 28.4 12.5 29.5 12.5C30.5 12.5 31.2 12.7 31.7 12.9L32 13L32.5 10.7Z`,fill:`white`}),(0,a.jsx)(`path`,{d:`M37.5 10.5H35.2C34.5 10.5 34 10.7 33.7 11.4L29.5 21.5H32.7L33.3 19.8H37.2L37.6 21.5H40.5L37.5 10.5ZM34.2 17.5C34.5 16.7 35.5 14 35.5 14C35.5 14 35.8 13.2 36 12.7L36.2 13.9C36.2 13.9 36.8 16.7 36.9 17.5H34.2Z`,fill:`white`}),(0,a.jsx)(`path`,{d:`M18.5 10.5L15.6 18.1L15.3 16.8C14.7 15 13 13 11 12L13.7 21.5H17L21.9 10.5H18.5Z`,fill:`white`}),(0,a.jsx)(`path`,{d:`M13 10.5H8.1L8 10.7C11.8 11.6 14.3 14 15.2 16.9L14.2 11.5C14.1 10.8 13.6 10.5 13 10.5Z`,fill:`#F9A51A`})]});case`mastercard`:return(0,a.jsxs)(`svg`,{className:r,viewBox:`0 0 48 32`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,children:[(0,a.jsx)(`rect`,{width:`48`,height:`32`,rx:`4`,fill:`#000000`}),(0,a.jsx)(`circle`,{cx:`18`,cy:`16`,r:`8`,fill:`#EB001B`}),(0,a.jsx)(`circle`,{cx:`30`,cy:`16`,r:`8`,fill:`#F79E1B`}),(0,a.jsx)(`path`,{d:`M24 10.8C25.8 12.2 27 14.5 27 16C27 17.5 25.8 19.8 24 21.2C22.2 19.8 21 17.5 21 16C21 14.5 22.2 12.2 24 10.8Z`,fill:`#FF5F00`})]});case`amex`:return(0,a.jsxs)(`svg`,{className:r,viewBox:`0 0 48 32`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,children:[(0,a.jsx)(`rect`,{width:`48`,height:`32`,rx:`4`,fill:`#006FCF`}),(0,a.jsx)(`path`,{d:`M8 16H12L13 13.5L14 16H18L15.5 19.5H18V21H8V19.5H10.5L8 16Z`,fill:`white`}),(0,a.jsx)(`text`,{x:`20`,y:`20`,fill:`white`,fontSize:`8`,fontWeight:`bold`,fontFamily:`Arial`,children:`AMEX`})]});case`discover`:return(0,a.jsxs)(`svg`,{className:r,viewBox:`0 0 48 32`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,children:[(0,a.jsx)(`rect`,{width:`48`,height:`32`,rx:`4`,fill:`#FFFFFF`,stroke:`#E5E5E5`}),(0,a.jsx)(`circle`,{cx:`30`,cy:`16`,r:`6`,fill:`#FF6600`}),(0,a.jsx)(`text`,{x:`8`,y:`20`,fill:`#000000`,fontSize:`7`,fontWeight:`bold`,fontFamily:`Arial`,children:`DISCOVER`})]});case`diners`:return(0,a.jsxs)(`svg`,{className:r,viewBox:`0 0 48 32`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,children:[(0,a.jsx)(`rect`,{width:`48`,height:`32`,rx:`4`,fill:`#FFFFFF`,stroke:`#E5E5E5`}),(0,a.jsx)(`circle`,{cx:`24`,cy:`16`,r:`8`,fill:`#0079BE`}),(0,a.jsx)(`path`,{d:`M19 16C19 13.2 20.5 10.8 22.7 9.6V22.4C20.5 21.2 19 18.8 19 16Z`,fill:`white`}),(0,a.jsx)(`path`,{d:`M25.3 9.6C27.5 10.8 29 13.2 29 16C29 18.8 27.5 21.2 25.3 22.4V9.6Z`,fill:`white`})]});case`jcb`:return(0,a.jsxs)(`svg`,{className:r,viewBox:`0 0 48 32`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,children:[(0,a.jsx)(`rect`,{width:`48`,height:`32`,rx:`4`,fill:`#FFFFFF`,stroke:`#E5E5E5`}),(0,a.jsx)(`rect`,{x:`8`,y:`8`,width:`10`,height:`16`,rx:`2`,fill:`#0066CC`}),(0,a.jsx)(`rect`,{x:`19`,y:`8`,width:`10`,height:`16`,rx:`2`,fill:`#E30613`}),(0,a.jsx)(`rect`,{x:`30`,y:`8`,width:`10`,height:`16`,rx:`2`,fill:`#00A651`})]});case`unionpay`:return(0,a.jsxs)(`svg`,{className:r,viewBox:`0 0 48 32`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,children:[(0,a.jsx)(`rect`,{width:`48`,height:`32`,rx:`4`,fill:`#D71F27`}),(0,a.jsx)(`text`,{x:`10`,y:`20`,fill:`white`,fontSize:`8`,fontWeight:`bold`,fontFamily:`Arial`,children:`UnionPay`})]});case`maestro`:return(0,a.jsxs)(`svg`,{className:r,viewBox:`0 0 48 32`,fill:`none`,xmlns:`http://www.w3.org/2000/svg`,children:[(0,a.jsx)(`rect`,{width:`48`,height:`32`,rx:`4`,fill:`#000000`}),(0,a.jsx)(`circle`,{cx:`18`,cy:`16`,r:`8`,fill:`#0066CC`}),(0,a.jsx)(`circle`,{cx:`30`,cy:`16`,r:`8`,fill:`#CC0000`}),(0,a.jsx)(`path`,{d:`M24 10C26 11.5 27.5 13.5 27.5 16C27.5 18.5 26 20.5 24 22C22 20.5 20.5 18.5 20.5 16C20.5 13.5 22 11.5 24 10Z`,fill:`#6C4899`})]});default:return(0,a.jsx)(i.CreditCard,{className:t.cn(`w-5 h-5 text-muted-foreground`,n)})}}function h({cardData:e,isFlipped:n,className:r}){return(0,a.jsx)(`div`,{className:t.cn(`perspective-1000`,r),children:(0,a.jsxs)(`div`,{className:t.cn(`relative w-full h-48 transition-transform duration-700 transform-style-3d`,n&&`rotate-y-180`),style:{transformStyle:`preserve-3d`,transform:n?`rotateY(180deg)`:`rotateY(0deg)`},children:[(0,a.jsxs)(`div`,{className:t.cn(`absolute inset-0 w-full h-full rounded-xl p-6 text-white backface-hidden`,`bg-gradient-to-br shadow-xl`,e.cardType===`visa`&&`from-blue-600 to-blue-800`,e.cardType===`mastercard`&&`from-red-600 to-orange-600`,e.cardType===`amex`&&`from-cyan-600 to-cyan-800`,e.cardType===`discover`&&`from-orange-500 to-orange-700`,e.cardType===`unknown`&&`from-gray-600 to-gray-800`),style:{backfaceVisibility:`hidden`},children:[(0,a.jsxs)(`div`,{className:`flex justify-between items-start mb-8`,children:[(0,a.jsx)(`div`,{className:`w-12 h-8 bg-gradient-to-br from-yellow-300 to-yellow-500 rounded opacity-90`}),(0,a.jsx)(m,{type:e.cardType,className:`w-12 h-8`})]}),(0,a.jsx)(`div`,{className:`font-mono text-xl tracking-wider mb-6`,children:e.cardNumber||`#### #### #### ####`}),(0,a.jsxs)(`div`,{className:`flex justify-between items-end`,children:[(0,a.jsxs)(`div`,{children:[(0,a.jsx)(`div`,{className:`text-xs uppercase opacity-70 mb-1`,children:`Card Holder`}),(0,a.jsx)(`div`,{className:`font-medium tracking-wide uppercase`,children:e.cardHolder||`YOUR NAME`})]}),(0,a.jsxs)(`div`,{className:`text-right`,children:[(0,a.jsx)(`div`,{className:`text-xs uppercase opacity-70 mb-1`,children:`Expires`}),(0,a.jsx)(`div`,{className:`font-mono`,children:e.expiry||`MM/YY`})]})]})]}),(0,a.jsxs)(`div`,{className:t.cn(`absolute inset-0 w-full h-full rounded-xl text-white backface-hidden rotate-y-180`,`bg-gradient-to-br shadow-xl`,e.cardType===`visa`&&`from-blue-700 to-blue-900`,e.cardType===`mastercard`&&`from-red-700 to-orange-700`,e.cardType===`amex`&&`from-cyan-700 to-cyan-900`,e.cardType===`discover`&&`from-orange-600 to-orange-800`,e.cardType===`unknown`&&`from-gray-700 to-gray-900`),style:{backfaceVisibility:`hidden`,transform:`rotateY(180deg)`},children:[(0,a.jsx)(`div`,{className:`w-full h-12 bg-black/40 mt-6`}),(0,a.jsx)(`div`,{className:`px-6 mt-6`,children:(0,a.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,a.jsx)(`div`,{className:`flex-1 h-10 bg-white/20 rounded flex items-center justify-end pr-4`,children:(0,a.jsx)(`span`,{className:`font-mono text-lg italic`,children:e.cvv||`###`})}),(0,a.jsx)(`div`,{className:`text-xs opacity-70`,children:`CVV`})]})}),(0,a.jsx)(`div`,{className:`absolute bottom-4 right-4`,children:(0,a.jsx)(m,{type:e.cardType,className:`w-10 h-6 opacity-50`})})]})]})})}function g(e={}){let{initialValue:t,validateOnChange:n=!0,errorMessages:i}=e,[a,o]=r.useState({cardNumber:t?.cardNumber||``,rawCardNumber:t?.rawCardNumber||``,cardHolder:t?.cardHolder||``,expiry:t?.expiry||``,cvv:t?.cvv||``,cardType:t?.cardType||`unknown`}),[f,m]=r.useState({}),[h,g]=r.useState({cardNumber:!1,cardHolder:!1,expiry:!1,cvv:!1}),_=r.useCallback(e=>{let t={},n=c(e.cardType);return e.rawCardNumber?n.lengths.includes(e.rawCardNumber.length)?l(e.rawCardNumber)||(t.cardNumber=i?.luhn||`Invalid card number`):t.cardNumber=i?.cardNumber||`Invalid card number length`:t.cardNumber=i?.cardNumber||`Card number is required`,e.cardHolder.trim()?e.cardHolder.trim().length<2&&(t.cardHolder=i?.cardHolder||`Name is too short`):t.cardHolder=i?.cardHolder||`Cardholder name is required`,e.expiry?p(e.expiry)||(t.expiry=i?.expiry||`Invalid or expired date`):t.expiry=i?.expiry||`Expiry date is required`,e.cvv?e.cvv.length!==n.cvvLength&&(t.cvv=i?.cvv||`CVV must be ${n.cvvLength} digits`):t.cvv=i?.cvv||`CVV is required`,t},[i]),v=r.useCallback(e=>{let t=e.replace(/\D/g,``).slice(0,19),r=s(t),i=u(t,r),c={...a,cardNumber:i,rawCardNumber:t,cardType:r};o(c),g(e=>({...e,cardNumber:!0})),n&&m(_(c))},[a,_,n]),y=r.useCallback(e=>{let t={...a,cardHolder:e.toUpperCase()};o(t),g(e=>({...e,cardHolder:!0})),n&&m(_(t))},[a,_,n]),b=r.useCallback(e=>{let t=d(e.replace(/\D/g,``).slice(0,4)),r={...a,expiry:t};o(r),g(e=>({...e,expiry:!0})),n&&m(_(r))},[a,_,n]),x=r.useCallback(e=>{let t=c(a.cardType),r=e.replace(/\D/g,``).slice(0,t.cvvLength),i={...a,cvv:r};o(i),g(e=>({...e,cvv:!0})),n&&m(_(i))},[a,_,n]),S=r.useCallback(()=>{o({cardNumber:``,rawCardNumber:``,cardHolder:``,expiry:``,cvv:``,cardType:`unknown`}),m({}),g({cardNumber:!1,cardHolder:!1,expiry:!1,cvv:!1})},[]),C=r.useMemo(()=>{let e=_(a);return Object.keys(e).length===0},[a,_]);return{cardData:a,errors:r.useMemo(()=>{let e={};return h.cardNumber&&f.cardNumber&&(e.cardNumber=f.cardNumber),h.cardHolder&&f.cardHolder&&(e.cardHolder=f.cardHolder),h.expiry&&f.expiry&&(e.expiry=f.expiry),h.cvv&&f.cvv&&(e.cvv=f.cvv),e},[f,h]),touched:h,isValid:C,updateCardNumber:v,updateCardHolder:y,updateExpiry:b,updateCvv:x,validate:()=>_(a),reset:S,setTouched:g}}function _({value:e,onChange:o,onValidationChange:l,disabled:u=!1,readOnly:d=!1,singleFieldMode:f=!1,showCardPreview:p=!1,showCardTypeIcon:_=!0,placeholders:v,labels:y,errorMessages:b,size:x=`md`,className:S,id:C,name:w,autoFocus:T=!1}){let{cardData:E,errors:D,isValid:O,updateCardNumber:k,updateCardHolder:A,updateExpiry:j,updateCvv:M}=g({initialValue:e,errorMessages:b}),[N,P]=r.useState(!1),[F,I]=r.useState(!1),[L,R]=r.useState(null),z=r.useRef(null),B=r.useRef(null),V=r.useRef(null),H=r.useRef(null);r.useEffect(()=>{o?.(E)},[E,o]),r.useEffect(()=>{l?.(O,D)},[O,D,l]),r.useEffect(()=>{T&&z.current&&z.current.focus()},[T]);let U=e=>{k(e.target.value);let t=c(s(e.target.value.replace(/\D/g,``))),n=e.target.value.replace(/\D/g,``);t.lengths.includes(n.length)&&V.current&&V.current.focus()},W=e=>{j(e.target.value),e.target.value.replace(/\D/g,``).length===4&&H.current&&H.current.focus()},G=()=>{R(`cvv`),I(!0)},K=()=>{R(null),I(!1)},q={sm:`h-8 text-xs`,md:`h-9 text-sm`,lg:`h-10 text-base`},J={sm:`text-xs`,md:`text-sm`,lg:`text-base`},Y=({children:e,label:n,error:r,htmlFor:o})=>(0,a.jsxs)(`div`,{className:`space-y-1.5`,children:[n&&(0,a.jsx)(`label`,{htmlFor:o,className:t.cn(`block font-medium text-foreground`,J[x]),children:n}),e,r&&(0,a.jsxs)(`div`,{className:`flex items-center gap-1 text-destructive`,children:[(0,a.jsx)(i.AlertCircle,{className:`h-3 w-3`}),(0,a.jsx)(`span`,{className:`text-xs`,children:r})]})]});return f?(0,a.jsx)(`div`,{className:t.cn(`space-y-4`,S),children:(0,a.jsx)(Y,{label:y?.cardNumber||`Card Details`,error:D.cardNumber,htmlFor:C?`${C}-combined`:void 0,children:(0,a.jsxs)(`div`,{className:`flex items-center gap-2`,children:[_&&(0,a.jsx)(m,{type:E.cardType,className:`flex-shrink-0`}),(0,a.jsxs)(`div`,{className:`flex-1 flex gap-2`,children:[(0,a.jsx)(n.Input,{ref:z,id:C?`${C}-combined`:void 0,name:w?`${w}-number`:void 0,type:`text`,inputMode:`numeric`,autoComplete:`cc-number`,placeholder:v?.cardNumber||`Card number`,value:E.cardNumber,onChange:U,disabled:u,readOnly:d,className:t.cn(q[x],`flex-1`,D.cardNumber&&`border-destructive focus-visible:ring-destructive`)}),(0,a.jsx)(n.Input,{ref:V,name:w?`${w}-expiry`:void 0,type:`text`,inputMode:`numeric`,autoComplete:`cc-exp`,placeholder:v?.expiry||`MM/YY`,value:E.expiry,onChange:W,disabled:u,readOnly:d,className:t.cn(q[x],`w-20`,D.expiry&&`border-destructive focus-visible:ring-destructive`)}),(0,a.jsxs)(`div`,{className:`relative w-16`,children:[(0,a.jsx)(n.Input,{ref:H,name:w?`${w}-cvv`:void 0,type:N?`text`:`password`,inputMode:`numeric`,autoComplete:`cc-csc`,placeholder:v?.cvv||`CVV`,value:E.cvv,onChange:e=>M(e.target.value),onFocus:G,onBlur:K,disabled:u,readOnly:d,className:t.cn(q[x],`pr-8`,D.cvv&&`border-destructive focus-visible:ring-destructive`)}),(0,a.jsx)(`button`,{type:`button`,onClick:()=>P(!N),className:`absolute right-2 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground`,tabIndex:-1,children:N?(0,a.jsx)(i.EyeOff,{className:`h-4 w-4`}):(0,a.jsx)(i.Eye,{className:`h-4 w-4`})})]})]})]})})}):(0,a.jsxs)(`div`,{className:t.cn(`space-y-4`,S),children:[p&&(0,a.jsx)(h,{cardData:E,isFlipped:F,className:`mb-6`}),(0,a.jsxs)(`div`,{className:`grid gap-4`,children:[(0,a.jsx)(Y,{label:y?.cardNumber||`Card Number`,error:D.cardNumber,htmlFor:C?`${C}-number`:void 0,children:(0,a.jsxs)(`div`,{className:`relative`,children:[(0,a.jsx)(n.Input,{ref:z,id:C?`${C}-number`:void 0,name:w?`${w}-number`:void 0,type:`text`,inputMode:`numeric`,autoComplete:`cc-number`,placeholder:v?.cardNumber||`1234 5678 9012 3456`,value:E.cardNumber,onChange:U,onFocus:()=>R(`cardNumber`),onBlur:()=>R(null),disabled:u,readOnly:d,className:t.cn(q[x],`pr-12`,D.cardNumber&&`border-destructive focus-visible:ring-destructive`)}),_&&(0,a.jsx)(`div`,{className:`absolute right-3 top-1/2 -translate-y-1/2`,children:(0,a.jsx)(m,{type:E.cardType})}),E.rawCardNumber&&!D.cardNumber&&(0,a.jsx)(i.Check,{className:`absolute right-12 top-1/2 -translate-y-1/2 h-4 w-4 text-green-500`})]})}),(0,a.jsx)(Y,{label:y?.cardHolder||`Cardholder Name`,error:D.cardHolder,htmlFor:C?`${C}-holder`:void 0,children:(0,a.jsx)(n.Input,{ref:B,id:C?`${C}-holder`:void 0,name:w?`${w}-holder`:void 0,type:`text`,autoComplete:`cc-name`,placeholder:v?.cardHolder||`JOHN DOE`,value:E.cardHolder,onChange:e=>A(e.target.value),onFocus:()=>R(`cardHolder`),onBlur:()=>R(null),disabled:u,readOnly:d,className:t.cn(q[x],D.cardHolder&&`border-destructive focus-visible:ring-destructive`)})}),(0,a.jsxs)(`div`,{className:`grid grid-cols-2 gap-4`,children:[(0,a.jsx)(Y,{label:y?.expiry||`Expiry Date`,error:D.expiry,htmlFor:C?`${C}-expiry`:void 0,children:(0,a.jsx)(n.Input,{ref:V,id:C?`${C}-expiry`:void 0,name:w?`${w}-expiry`:void 0,type:`text`,inputMode:`numeric`,autoComplete:`cc-exp`,placeholder:v?.expiry||`MM/YY`,value:E.expiry,onChange:W,onFocus:()=>R(`expiry`),onBlur:()=>R(null),disabled:u,readOnly:d,className:t.cn(q[x],D.expiry&&`border-destructive focus-visible:ring-destructive`)})}),(0,a.jsx)(Y,{label:y?.cvv||`CVV`,error:D.cvv,htmlFor:C?`${C}-cvv`:void 0,children:(0,a.jsxs)(`div`,{className:`relative`,children:[(0,a.jsx)(n.Input,{ref:H,id:C?`${C}-cvv`:void 0,name:w?`${w}-cvv`:void 0,type:N?`text`:`password`,inputMode:`numeric`,autoComplete:`cc-csc`,placeholder:v?.cvv??(E.cardType===`amex`?`1234`:`123`),value:E.cvv,onChange:e=>M(e.target.value),onFocus:G,onBlur:K,disabled:u,readOnly:d,className:t.cn(q[x],`pr-10`,D.cvv&&`border-destructive focus-visible:ring-destructive`)}),(0,a.jsx)(`button`,{type:`button`,onClick:()=>P(!N),className:`absolute right-3 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground transition-colors`,tabIndex:-1,"aria-label":N?`Hide CVV`:`Show CVV`,children:N?(0,a.jsx)(i.EyeOff,{className:`h-4 w-4`}):(0,a.jsx)(i.Eye,{className:`h-4 w-4`})})]})})]})]}),O&&E.rawCardNumber&&(0,a.jsxs)(`div`,{className:`flex items-center gap-2 text-sm text-green-600`,children:[(0,a.jsx)(i.Check,{className:`h-4 w-4`}),(0,a.jsx)(`span`,{children:`Card details are valid`})]})]})}exports.default=_,exports.useCreditCardInput=g;