@wakastellar/ui 4.0.0-dev.0 → 4.0.1

package/dist/blocks/chat-interface/index.es.js

@@ -0,0 +1,446 @@
+"use client";
+"use client";
+import { cn as e } from "../../utils/cn.es.js";
+import { Avatar as t, AvatarFallback as n, AvatarImage as r } from "../../components/avatar/index.es.js";
+import { Badge as i } from "../../components/badge/index.es.js";
+import { Button as a } from "../../components/button/index.es.js";
+import { Input as o } from "../../components/input/index.es.js";
+import { ScrollArea as s } from "../../components/scroll-area/index.es.js";
+import * as c from "react";
+import { Check as l, CheckCheck as u, Circle as d, Clock as f, File as p, Image as m, MoreVertical as h, Paperclip as g, Phone as _, Pin as v, Reply as y, Search as b, Send as x, Smile as S, Video as C } from "lucide-react";
+import { Fragment as w, jsx as T, jsxs as E } from "react/jsx-runtime";
+//#region src/blocks/chat-interface/index.tsx
+var D = {
+	online: "bg-green-500",
+	offline: "bg-gray-400",
+	away: "bg-yellow-500",
+	busy: "bg-red-500"
+};
+function O({ user: i, size: a = "md" }) {
+	return /* @__PURE__ */ E("div", {
+		className: "relative",
+		children: [/* @__PURE__ */ E(t, {
+			className: {
+				sm: "h-8 w-8",
+				md: "h-10 w-10",
+				lg: "h-12 w-12"
+			}[a],
+			children: [/* @__PURE__ */ T(r, {
+				src: i.avatar,
+				alt: i.name
+			}), /* @__PURE__ */ T(n, { children: i.name.slice(0, 2).toUpperCase() })]
+		}), i.status && /* @__PURE__ */ T("div", { className: e("absolute bottom-0 right-0 h-3 w-3 rounded-full border-2 border-background", D[i.status]) })]
+	});
+}
+function k({ conversation: a, currentUserId: o, isSelected: s, onClick: c }) {
+	let l = a.participants.find((e) => e.id !== o), u = a.isGroup ? a.groupName : l?.name, d = a.isGroup ? a.groupAvatar : l?.avatar;
+	return /* @__PURE__ */ E("button", {
+		onClick: c,
+		className: e("w-full flex items-center gap-3 p-3 rounded-lg transition-colors text-left", s ? "bg-primary/10" : "hover:bg-muted/50"),
+		children: [
+			/* @__PURE__ */ E("div", {
+				className: "relative",
+				children: [/* @__PURE__ */ E(t, { children: [/* @__PURE__ */ T(r, { src: d }), /* @__PURE__ */ T(n, { children: u?.slice(0, 2).toUpperCase() })] }), !a.isGroup && l?.status && /* @__PURE__ */ T("div", { className: e("absolute bottom-0 right-0 h-3 w-3 rounded-full border-2 border-background", D[l.status]) })]
+			}),
+			/* @__PURE__ */ E("div", {
+				className: "flex-1 min-w-0",
+				children: [/* @__PURE__ */ E("div", {
+					className: "flex items-center justify-between",
+					children: [/* @__PURE__ */ T("span", {
+						className: "font-medium truncate",
+						children: u
+					}), a.lastMessage && /* @__PURE__ */ T("span", {
+						className: "text-xs text-muted-foreground",
+						children: typeof a.lastMessage.timestamp == "string" ? a.lastMessage.timestamp : M(a.lastMessage.timestamp)
+					})]
+				}), a.lastMessage && /* @__PURE__ */ T("p", {
+					className: "text-sm text-muted-foreground truncate",
+					children: a.lastMessage.content
+				})]
+			}),
+			a.unreadCount && a.unreadCount > 0 && /* @__PURE__ */ T(i, {
+				className: "h-5 w-5 p-0 flex items-center justify-center rounded-full",
+				children: a.unreadCount
+			}),
+			a.isPinned && /* @__PURE__ */ T(v, { className: "h-3 w-3 text-muted-foreground" })
+		]
+	});
+}
+function A({ message: t, isOwn: n, sender: r, showAvatar: i }) {
+	let a = {
+		sending: /* @__PURE__ */ T(f, { className: "h-3 w-3" }),
+		sent: /* @__PURE__ */ T(l, { className: "h-3 w-3" }),
+		delivered: /* @__PURE__ */ T(u, { className: "h-3 w-3" }),
+		read: /* @__PURE__ */ T(u, { className: "h-3 w-3 text-blue-500" })
+	};
+	return /* @__PURE__ */ E("div", {
+		className: e("flex gap-2 max-w-[80%]", n ? "ml-auto flex-row-reverse" : ""),
+		children: [
+			i && r && !n && /* @__PURE__ */ T(O, {
+				user: r,
+				size: "sm"
+			}),
+			!i && !n && /* @__PURE__ */ T("div", { className: "w-8" }),
+			/* @__PURE__ */ E("div", {
+				className: "space-y-1",
+				children: [
+					!n && i && r && /* @__PURE__ */ T("span", {
+						className: "text-xs text-muted-foreground ml-1",
+						children: r.name
+					}),
+					/* @__PURE__ */ E("div", {
+						className: e("rounded-2xl px-4 py-2", n ? "bg-primary text-primary-foreground rounded-br-md" : "bg-muted rounded-bl-md"),
+						children: [
+							t.replyTo && /* @__PURE__ */ E("div", {
+								className: e("text-xs mb-1 pb-1 border-b", n ? "border-primary-foreground/20" : "border-border"),
+								children: [/* @__PURE__ */ T(y, { className: "h-3 w-3 inline mr-1" }), "Reply to message"]
+							}),
+							/* @__PURE__ */ T("p", {
+								className: "text-sm whitespace-pre-wrap",
+								children: t.content
+							}),
+							t.attachments && t.attachments.length > 0 && /* @__PURE__ */ T("div", {
+								className: "mt-2 space-y-2",
+								children: t.attachments.map((e) => /* @__PURE__ */ E("div", {
+									className: "flex items-center gap-2",
+									children: [e.type === "image" ? /* @__PURE__ */ T(m, { className: "h-4 w-4" }) : /* @__PURE__ */ T(p, { className: "h-4 w-4" }), /* @__PURE__ */ T("span", {
+										className: "text-xs truncate",
+										children: e.name
+									})]
+								}, e.id))
+							})
+						]
+					}),
+					/* @__PURE__ */ E("div", {
+						className: e("flex items-center gap-1 text-xs text-muted-foreground", n ? "justify-end" : ""),
+						children: [/* @__PURE__ */ T("span", { children: typeof t.timestamp == "string" ? t.timestamp : M(t.timestamp) }), n && t.status && a[t.status]]
+					}),
+					t.reactions && t.reactions.length > 0 && /* @__PURE__ */ T("div", {
+						className: "flex gap-1 mt-1",
+						children: Array.from(new Set(t.reactions.map((e) => e.emoji))).map((e) => /* @__PURE__ */ E("span", {
+							className: "text-xs bg-muted rounded-full px-2 py-0.5",
+							children: [
+								e,
+								" ",
+								t.reactions.filter((t) => t.emoji === e).length
+							]
+						}, e))
+					})
+				]
+			})
+		]
+	});
+}
+function j({ users: e }) {
+	if (e.length === 0) return null;
+	let t = e.map((e) => e.name).join(", ");
+	return /* @__PURE__ */ E("div", {
+		className: "flex items-center gap-2 text-sm text-muted-foreground",
+		children: [/* @__PURE__ */ E("div", {
+			className: "flex gap-1",
+			children: [
+				/* @__PURE__ */ T(d, {
+					className: "h-2 w-2 animate-bounce",
+					style: { animationDelay: "0ms" }
+				}),
+				/* @__PURE__ */ T(d, {
+					className: "h-2 w-2 animate-bounce",
+					style: { animationDelay: "150ms" }
+				}),
+				/* @__PURE__ */ T(d, {
+					className: "h-2 w-2 animate-bounce",
+					style: { animationDelay: "300ms" }
+				})
+			]
+		}), /* @__PURE__ */ E("span", { children: [
+			t,
+			" ",
+			e.length === 1 ? "is" : "are",
+			" typing..."
+		] })]
+	});
+}
+function M(e) {
+	return e.toLocaleTimeString([], {
+		hour: "2-digit",
+		minute: "2-digit"
+	});
+}
+function N({ currentUser: t, conversations: n = [], selectedConversation: r, messages: i = [], onSendMessage: l, onSelectConversation: u, onTyping: d, typingUsers: f = [], showSidebar: p = !0, className: m }) {
+	let [v, y] = c.useState(""), [D, M] = c.useState(""), N = c.useRef(null), P = () => {
+		N.current?.scrollIntoView({ behavior: "smooth" });
+	};
+	c.useEffect(() => {
+		P();
+	}, [i]);
+	let F = () => {
+		!v.trim() || !l || (l(v.trim()), y(""));
+	}, I = (e) => {
+		e.key === "Enter" && !e.shiftKey && (e.preventDefault(), F());
+	}, L = n.filter((e) => {
+		if (!D) return !0;
+		let n = e.participants.find((e) => e.id !== t.id);
+		return (e.isGroup ? e.groupName : n?.name)?.toLowerCase().includes(D.toLowerCase());
+	}), R = r?.participants.find((e) => e.id !== t.id), z = r?.isGroup ? r.groupName : R?.name, B = i.reduce((e, t, n) => {
+		let r = i[n - 1], a = !r || r.senderId !== t.senderId;
+		return e.push({
+			message: t,
+			showAvatar: a
+		}), e;
+	}, []);
+	return /* @__PURE__ */ E("div", {
+		className: e("flex h-[600px] rounded-lg border overflow-hidden", m),
+		children: [p && /* @__PURE__ */ E("div", {
+			className: "w-80 border-r flex flex-col bg-card",
+			children: [/* @__PURE__ */ E("div", {
+				className: "p-4 border-b",
+				children: [/* @__PURE__ */ E("div", {
+					className: "flex items-center justify-between mb-4",
+					children: [/* @__PURE__ */ T("h2", {
+						className: "font-semibold text-lg",
+						children: "Messages"
+					}), /* @__PURE__ */ T(a, {
+						variant: "ghost",
+						size: "icon",
+						children: /* @__PURE__ */ T(h, { className: "h-4 w-4" })
+					})]
+				}), /* @__PURE__ */ E("div", {
+					className: "relative",
+					children: [/* @__PURE__ */ T(b, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" }), /* @__PURE__ */ T(o, {
+						placeholder: "Search conversations...",
+						value: D,
+						onChange: (e) => M(e.target.value),
+						className: "pl-9"
+					})]
+				})]
+			}), /* @__PURE__ */ T(s, {
+				className: "flex-1",
+				children: /* @__PURE__ */ T("div", {
+					className: "p-2 space-y-1",
+					children: L.map((e) => /* @__PURE__ */ T(k, {
+						conversation: e,
+						currentUserId: t.id,
+						isSelected: r?.id === e.id,
+						onClick: () => u?.(e)
+					}, e.id))
+				})
+			})]
+		}), /* @__PURE__ */ T("div", {
+			className: "flex-1 flex flex-col",
+			children: r ? /* @__PURE__ */ E(w, { children: [
+				/* @__PURE__ */ E("div", {
+					className: "h-16 border-b flex items-center justify-between px-4 bg-card",
+					children: [/* @__PURE__ */ E("div", {
+						className: "flex items-center gap-3",
+						children: [R && /* @__PURE__ */ T(O, { user: R }), /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("h3", {
+							className: "font-medium",
+							children: z
+						}), R?.status && /* @__PURE__ */ T("p", {
+							className: "text-xs text-muted-foreground capitalize",
+							children: R.status === "online" ? "Online" : `Last seen ${R.lastSeen || "recently"}`
+						})] })]
+					}), /* @__PURE__ */ E("div", {
+						className: "flex items-center gap-1",
+						children: [
+							/* @__PURE__ */ T(a, {
+								variant: "ghost",
+								size: "icon",
+								children: /* @__PURE__ */ T(_, { className: "h-4 w-4" })
+							}),
+							/* @__PURE__ */ T(a, {
+								variant: "ghost",
+								size: "icon",
+								children: /* @__PURE__ */ T(C, { className: "h-4 w-4" })
+							}),
+							/* @__PURE__ */ T(a, {
+								variant: "ghost",
+								size: "icon",
+								children: /* @__PURE__ */ T(h, { className: "h-4 w-4" })
+							})
+						]
+					})]
+				}),
+				/* @__PURE__ */ E(s, {
+					className: "flex-1 p-4",
+					children: [/* @__PURE__ */ E("div", {
+						className: "space-y-4",
+						children: [B.map(({ message: e, showAvatar: n }) => /* @__PURE__ */ T(A, {
+							message: e,
+							isOwn: e.senderId === t.id,
+							sender: r.participants.find((t) => t.id === e.senderId),
+							showAvatar: n
+						}, e.id)), /* @__PURE__ */ T("div", { ref: N })]
+					}), f.length > 0 && /* @__PURE__ */ T("div", {
+						className: "mt-4",
+						children: /* @__PURE__ */ T(j, { users: f })
+					})]
+				}),
+				/* @__PURE__ */ T("div", {
+					className: "p-4 border-t bg-card",
+					children: /* @__PURE__ */ E("div", {
+						className: "flex items-end gap-2",
+						children: [
+							/* @__PURE__ */ T(a, {
+								variant: "ghost",
+								size: "icon",
+								children: /* @__PURE__ */ T(g, { className: "h-4 w-4" })
+							}),
+							/* @__PURE__ */ T("div", {
+								className: "flex-1",
+								children: /* @__PURE__ */ T(o, {
+									placeholder: "Type a message...",
+									value: v,
+									onChange: (e) => {
+										y(e.target.value), d?.();
+									},
+									onKeyDown: I,
+									className: "rounded-full"
+								})
+							}),
+							/* @__PURE__ */ T(a, {
+								variant: "ghost",
+								size: "icon",
+								children: /* @__PURE__ */ T(S, { className: "h-4 w-4" })
+							}),
+							/* @__PURE__ */ T(a, {
+								size: "icon",
+								onClick: F,
+								disabled: !v.trim(),
+								children: /* @__PURE__ */ T(x, { className: "h-4 w-4" })
+							})
+						]
+					})
+				})
+			] }) : /* @__PURE__ */ T("div", {
+				className: "flex-1 flex items-center justify-center",
+				children: /* @__PURE__ */ E("div", {
+					className: "text-center",
+					children: [
+						/* @__PURE__ */ T("div", {
+							className: "h-16 w-16 rounded-full bg-muted flex items-center justify-center mx-auto mb-4",
+							children: /* @__PURE__ */ T(x, { className: "h-8 w-8 text-muted-foreground" })
+						}),
+						/* @__PURE__ */ T("h3", {
+							className: "font-medium text-lg",
+							children: "Your Messages"
+						}),
+						/* @__PURE__ */ T("p", {
+							className: "text-muted-foreground text-sm mt-1",
+							children: "Select a conversation to start chatting"
+						})
+					]
+				})
+			})
+		})]
+	});
+}
+var P = [
+	{
+		id: "1",
+		name: "John Doe",
+		avatar: "",
+		status: "online"
+	},
+	{
+		id: "2",
+		name: "Jane Smith",
+		avatar: "",
+		status: "away",
+		lastSeen: "2 hours ago"
+	},
+	{
+		id: "3",
+		name: "Bob Wilson",
+		avatar: "",
+		status: "offline",
+		lastSeen: "yesterday"
+	},
+	{
+		id: "4",
+		name: "Alice Brown",
+		avatar: "",
+		status: "busy"
+	}
+], F = [
+	{
+		id: "conv1",
+		participants: [P[0], P[1]],
+		lastMessage: {
+			id: "m1",
+			content: "Hey, how's the project going?",
+			senderId: "2",
+			timestamp: /* @__PURE__ */ new Date(),
+			status: "read"
+		},
+		unreadCount: 2,
+		isPinned: !0
+	},
+	{
+		id: "conv2",
+		participants: [P[0], P[2]],
+		lastMessage: {
+			id: "m2",
+			content: "See you tomorrow!",
+			senderId: "1",
+			timestamp: /* @__PURE__ */ new Date(Date.now() - 36e5),
+			status: "delivered"
+		}
+	},
+	{
+		id: "conv3",
+		isGroup: !0,
+		groupName: "Project Team",
+		participants: [
+			P[0],
+			P[1],
+			P[2],
+			P[3]
+		],
+		lastMessage: {
+			id: "m3",
+			content: "Meeting at 3pm",
+			senderId: "4",
+			timestamp: /* @__PURE__ */ new Date(Date.now() - 72e5),
+			status: "read"
+		},
+		unreadCount: 5
+	}
+], I = [
+	{
+		id: "msg1",
+		content: "Hey! How are you doing?",
+		senderId: "2",
+		timestamp: /* @__PURE__ */ new Date(Date.now() - 36e5),
+		status: "read"
+	},
+	{
+		id: "msg2",
+		content: "I'm doing great, thanks for asking! Just finished the new feature.",
+		senderId: "1",
+		timestamp: /* @__PURE__ */ new Date(Date.now() - 35e5),
+		status: "read"
+	},
+	{
+		id: "msg3",
+		content: "That's awesome! Can you show me a demo?",
+		senderId: "2",
+		timestamp: /* @__PURE__ */ new Date(Date.now() - 34e5),
+		status: "read"
+	},
+	{
+		id: "msg4",
+		content: "Sure! Let me schedule a call for tomorrow. Does 2pm work for you?",
+		senderId: "1",
+		timestamp: /* @__PURE__ */ new Date(Date.now() - 33e5),
+		status: "delivered"
+	},
+	{
+		id: "msg5",
+		content: "Perfect, 2pm works great!",
+		senderId: "2",
+		timestamp: /* @__PURE__ */ new Date(Date.now() - 32e5),
+		status: "read"
+	}
+];
+//#endregion
+export { N as default, F as defaultConversations, I as defaultMessages, P as defaultUsers };

package/dist/blocks/checkout-flow/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(`../../components/badge/index.cjs.js`),r=require(`../../components/button/index.cjs.js`),i=require(`../../components/card/index.cjs.js`),a=require(`../../components/checkbox/index.cjs.js`),o=require(`../../components/label/index.cjs.js`),s=require(`../../components/input/index.cjs.js`),c=require(`../../components/radio-group/index.cjs.js`),l=require(`../../components/separator/index.cjs.js`);let u=require(`react`);u=e.__toESM(u);let d=require(`lucide-react`),f=require(`react/jsx-runtime`);function p({steps:e,currentStep:n}){let r=e.findIndex(e=>e.id===n);return(0,f.jsx)(`div`,{className:`flex items-center justify-center mb-8`,children:e.map((n,i)=>(0,f.jsxs)(u.Fragment,{children:[(0,f.jsxs)(`div`,{className:`flex items-center`,children:[(0,f.jsx)(`div`,{className:t.cn(`h-8 w-8 rounded-full flex items-center justify-center text-sm font-medium`,i<r?`bg-primary text-primary-foreground`:i===r?`bg-primary text-primary-foreground ring-4 ring-primary/20`:`bg-muted text-muted-foreground`),children:i<r?(0,f.jsx)(d.Check,{className:`h-4 w-4`}):i+1}),(0,f.jsx)(`span`,{className:t.cn(`ml-2 text-sm font-medium hidden sm:inline`,i<=r?`text-foreground`:`text-muted-foreground`),children:n.label})]}),i<e.length-1&&(0,f.jsx)(`div`,{className:t.cn(`w-8 sm:w-16 h-0.5 mx-2`,i<r?`bg-primary`:`bg-muted`)})]},n.id))})}function m({items:e,currency:t=`$`,discount:n,couponCode:a,setCouponCode:o,onApplyCoupon:c,onRemoveDiscount:u,isApplyingCoupon:p,shippingPrice:m=0,taxRate:h=0}){let g=e.reduce((e,t)=>e+t.price*t.quantity,0),_=n?n.type===`percent`?g*n.amount/100:n.amount:0,v=g-_,y=v*h/100,b=v+y+m;return(0,f.jsxs)(i.Card,{children:[(0,f.jsx)(i.CardHeader,{children:(0,f.jsxs)(i.CardTitle,{className:`flex items-center gap-2`,children:[(0,f.jsx)(d.ShoppingBag,{className:`h-5 w-5`}),`Order Summary`]})}),(0,f.jsxs)(i.CardContent,{className:`space-y-4`,children:[(0,f.jsx)(`div`,{className:`space-y-3`,children:e.map(e=>(0,f.jsxs)(`div`,{className:`flex gap-3`,children:[e.image&&(0,f.jsx)(`div`,{className:`h-16 w-16 rounded-lg bg-muted overflow-hidden flex-shrink-0`,children:(0,f.jsx)(`img`,{src:e.image,alt:e.name,className:`h-full w-full object-cover`})}),(0,f.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,f.jsx)(`p`,{className:`font-medium truncate`,children:e.name}),e.variant&&(0,f.jsx)(`p`,{className:`text-sm text-muted-foreground`,children:e.variant}),(0,f.jsxs)(`p`,{className:`text-sm`,children:[`Qty: `,e.quantity]})]}),(0,f.jsxs)(`p`,{className:`font-medium`,children:[t,(e.price*e.quantity).toFixed(2)]})]},e.id))}),(0,f.jsx)(l.Separator,{}),n?(0,f.jsxs)(`div`,{className:`flex items-center justify-between p-2 rounded-lg bg-green-500/10 text-green-600`,children:[(0,f.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,f.jsx)(d.Percent,{className:`h-4 w-4`}),(0,f.jsx)(`span`,{className:`font-medium`,children:n.code}),(0,f.jsxs)(`span`,{className:`text-sm`,children:[`(-`,n.type===`percent`?`${n.amount}%`:`${t}${n.amount}`,`)`]})]}),(0,f.jsx)(r.Button,{variant:`ghost`,size:`sm`,onClick:u,children:(0,f.jsx)(d.X,{className:`h-4 w-4`})})]}):(0,f.jsxs)(`div`,{className:`flex gap-2`,children:[(0,f.jsx)(s.Input,{placeholder:`Coupon code`,value:a,onChange:e=>o(e.target.value),className:`flex-1`}),(0,f.jsx)(r.Button,{variant:`outline`,onClick:c,disabled:!a||p,children:p?(0,f.jsx)(d.Loader2,{className:`h-4 w-4 animate-spin`}):`Apply`})]}),(0,f.jsx)(l.Separator,{}),(0,f.jsxs)(`div`,{className:`space-y-2 text-sm`,children:[(0,f.jsxs)(`div`,{className:`flex justify-between`,children:[(0,f.jsx)(`span`,{className:`text-muted-foreground`,children:`Subtotal`}),(0,f.jsxs)(`span`,{children:[t,g.toFixed(2)]})]}),_>0&&(0,f.jsxs)(`div`,{className:`flex justify-between text-green-600`,children:[(0,f.jsx)(`span`,{children:`Discount`}),(0,f.jsxs)(`span`,{children:[`-`,t,_.toFixed(2)]})]}),m>0&&(0,f.jsxs)(`div`,{className:`flex justify-between`,children:[(0,f.jsx)(`span`,{className:`text-muted-foreground`,children:`Shipping`}),(0,f.jsxs)(`span`,{children:[t,m.toFixed(2)]})]}),y>0&&(0,f.jsxs)(`div`,{className:`flex justify-between`,children:[(0,f.jsxs)(`span`,{className:`text-muted-foreground`,children:[`Tax (`,h,`%)`]}),(0,f.jsxs)(`span`,{children:[t,y.toFixed(2)]})]}),(0,f.jsx)(l.Separator,{}),(0,f.jsxs)(`div`,{className:`flex justify-between text-lg font-bold`,children:[(0,f.jsx)(`span`,{children:`Total`}),(0,f.jsxs)(`span`,{children:[t,b.toFixed(2)]})]})]})]})]})}function h({items:e,shippingMethods:h=g,paymentMethods:v=_,onApplyCoupon:y,discount:b,onRemoveDiscount:x,onSubmitOrder:S,currency:C=`$`,taxRate:w=8.5,className:T}){let[E,D]=u.useState(`cart`),[O,k]=u.useState(``),[A,j]=u.useState(!1),[M,N]=u.useState(!1),[P,F]=u.useState({firstName:``,lastName:``,email:``,phone:``,address:``,apartment:``,city:``,state:``,postalCode:``,country:`US`}),[I,L]=u.useState(h[0]?.id||``),[R,z]=u.useState(v[0]?.id||``),[B,V]=u.useState(!1),H=[{id:`cart`,label:`Cart`},{id:`shipping`,label:`Shipping`},{id:`payment`,label:`Payment`},{id:`review`,label:`Review`}],U=h.find(e=>e.id===I),W=async()=>{!y||!O||(j(!0),await y(O),j(!1))},G=async()=>{if(S){N(!0);try{await S({address:P,shippingMethod:I,paymentMethod:R,saveInfo:B})}finally{N(!1)}}},K=()=>{let e=H.findIndex(e=>e.id===E);e<H.length-1&&D(H[e+1].id)},q=()=>{let e=H.findIndex(e=>e.id===E);e>0&&D(H[e-1].id)};return(0,f.jsxs)(`div`,{className:t.cn(`max-w-6xl mx-auto`,T),children:[(0,f.jsx)(p,{steps:H,currentStep:E}),(0,f.jsxs)(`div`,{className:`grid gap-8 lg:grid-cols-3`,children:[(0,f.jsxs)(`div`,{className:`lg:col-span-2 space-y-6`,children:[E===`cart`&&(0,f.jsxs)(i.Card,{children:[(0,f.jsxs)(i.CardHeader,{children:[(0,f.jsx)(i.CardTitle,{children:`Shopping Cart`}),(0,f.jsxs)(i.CardDescription,{children:[e.length,` items in your cart`]})]}),(0,f.jsx)(i.CardContent,{className:`space-y-4`,children:e.map(e=>(0,f.jsxs)(`div`,{className:`flex gap-4 p-4 rounded-lg border`,children:[e.image&&(0,f.jsx)(`div`,{className:`h-24 w-24 rounded-lg bg-muted overflow-hidden flex-shrink-0`,children:(0,f.jsx)(`img`,{src:e.image,alt:e.name,className:`h-full w-full object-cover`})}),(0,f.jsxs)(`div`,{className:`flex-1`,children:[(0,f.jsx)(`h3`,{className:`font-medium`,children:e.name}),e.description&&(0,f.jsx)(`p`,{className:`text-sm text-muted-foreground`,children:e.description}),e.variant&&(0,f.jsx)(n.Badge,{variant:`secondary`,className:`mt-1`,children:e.variant}),(0,f.jsxs)(`div`,{className:`mt-2 flex items-center justify-between`,children:[(0,f.jsxs)(`span`,{className:`text-sm`,children:[`Qty: `,e.quantity]}),(0,f.jsxs)(`span`,{className:`font-bold`,children:[C,(e.price*e.quantity).toFixed(2)]})]})]})]},e.id))}),(0,f.jsx)(i.CardFooter,{children:(0,f.jsxs)(r.Button,{className:`w-full`,onClick:K,children:[`Continue to Shipping`,(0,f.jsx)(d.ChevronRight,{className:`h-4 w-4 ml-2`})]})})]}),E===`shipping`&&(0,f.jsxs)(i.Card,{children:[(0,f.jsx)(i.CardHeader,{children:(0,f.jsxs)(i.CardTitle,{className:`flex items-center gap-2`,children:[(0,f.jsx)(d.MapPin,{className:`h-5 w-5`}),`Shipping Address`]})}),(0,f.jsxs)(i.CardContent,{className:`space-y-4`,children:[(0,f.jsxs)(`div`,{className:`grid gap-4 sm:grid-cols-2`,children:[(0,f.jsxs)(`div`,{className:`space-y-2`,children:[(0,f.jsx)(o.Label,{children:`First Name`}),(0,f.jsx)(s.Input,{value:P.firstName,onChange:e=>F({...P,firstName:e.target.value})})]}),(0,f.jsxs)(`div`,{className:`space-y-2`,children:[(0,f.jsx)(o.Label,{children:`Last Name`}),(0,f.jsx)(s.Input,{value:P.lastName,onChange:e=>F({...P,lastName:e.target.value})})]})]}),(0,f.jsxs)(`div`,{className:`grid gap-4 sm:grid-cols-2`,children:[(0,f.jsxs)(`div`,{className:`space-y-2`,children:[(0,f.jsx)(o.Label,{children:`Email`}),(0,f.jsx)(s.Input,{type:`email`,value:P.email,onChange:e=>F({...P,email:e.target.value})})]}),(0,f.jsxs)(`div`,{className:`space-y-2`,children:[(0,f.jsx)(o.Label,{children:`Phone`}),(0,f.jsx)(s.Input,{type:`tel`,value:P.phone,onChange:e=>F({...P,phone:e.target.value})})]})]}),(0,f.jsxs)(`div`,{className:`space-y-2`,children:[(0,f.jsx)(o.Label,{children:`Address`}),(0,f.jsx)(s.Input,{value:P.address,onChange:e=>F({...P,address:e.target.value})})]}),(0,f.jsxs)(`div`,{className:`space-y-2`,children:[(0,f.jsx)(o.Label,{children:`Apartment, suite, etc. (optional)`}),(0,f.jsx)(s.Input,{value:P.apartment,onChange:e=>F({...P,apartment:e.target.value})})]}),(0,f.jsxs)(`div`,{className:`grid gap-4 sm:grid-cols-3`,children:[(0,f.jsxs)(`div`,{className:`space-y-2`,children:[(0,f.jsx)(o.Label,{children:`City`}),(0,f.jsx)(s.Input,{value:P.city,onChange:e=>F({...P,city:e.target.value})})]}),(0,f.jsxs)(`div`,{className:`space-y-2`,children:[(0,f.jsx)(o.Label,{children:`State`}),(0,f.jsx)(s.Input,{value:P.state,onChange:e=>F({...P,state:e.target.value})})]}),(0,f.jsxs)(`div`,{className:`space-y-2`,children:[(0,f.jsx)(o.Label,{children:`Postal Code`}),(0,f.jsx)(s.Input,{value:P.postalCode,onChange:e=>F({...P,postalCode:e.target.value})})]})]}),(0,f.jsx)(l.Separator,{className:`my-6`}),(0,f.jsxs)(`div`,{children:[(0,f.jsxs)(`h3`,{className:`font-medium mb-4 flex items-center gap-2`,children:[(0,f.jsx)(d.Truck,{className:`h-5 w-5`}),`Shipping Method`]}),(0,f.jsx)(c.RadioGroup,{value:I,onValueChange:L,children:(0,f.jsx)(`div`,{className:`space-y-3`,children:h.map(e=>(0,f.jsxs)(o.Label,{className:t.cn(`flex items-center gap-4 p-4 rounded-lg border cursor-pointer transition-colors`,I===e.id?`border-primary bg-primary/5`:`hover:bg-muted/50`),children:[(0,f.jsx)(c.RadioGroupItem,{value:e.id}),(0,f.jsxs)(`div`,{className:`flex-1`,children:[(0,f.jsx)(`p`,{className:`font-medium`,children:e.name}),(0,f.jsx)(`p`,{className:`text-sm text-muted-foreground`,children:e.description})]}),(0,f.jsxs)(`div`,{className:`text-right`,children:[(0,f.jsx)(`p`,{className:`font-medium`,children:e.price===0?`Free`:`${C}${e.price.toFixed(2)}`}),(0,f.jsx)(`p`,{className:`text-sm text-muted-foreground`,children:e.estimatedDays})]})]},e.id))})})]})]}),(0,f.jsxs)(i.CardFooter,{className:`flex gap-4`,children:[(0,f.jsxs)(r.Button,{variant:`outline`,onClick:q,children:[(0,f.jsx)(d.ChevronLeft,{className:`h-4 w-4 mr-2`}),`Back`]}),(0,f.jsxs)(r.Button,{className:`flex-1`,onClick:K,children:[`Continue to Payment`,(0,f.jsx)(d.ChevronRight,{className:`h-4 w-4 ml-2`})]})]})]}),E===`payment`&&(0,f.jsxs)(i.Card,{children:[(0,f.jsx)(i.CardHeader,{children:(0,f.jsxs)(i.CardTitle,{className:`flex items-center gap-2`,children:[(0,f.jsx)(d.CreditCard,{className:`h-5 w-5`}),`Payment Method`]})}),(0,f.jsxs)(i.CardContent,{children:[(0,f.jsx)(c.RadioGroup,{value:R,onValueChange:z,children:(0,f.jsx)(`div`,{className:`space-y-3`,children:v.map(e=>(0,f.jsxs)(o.Label,{className:t.cn(`flex items-center gap-4 p-4 rounded-lg border cursor-pointer transition-colors`,R===e.id?`border-primary bg-primary/5`:`hover:bg-muted/50`),children:[(0,f.jsx)(c.RadioGroupItem,{value:e.id}),e.icon,(0,f.jsx)(`span`,{className:`font-medium`,children:e.label}),e.last4&&(0,f.jsxs)(`span`,{className:`text-muted-foreground`,children:[`•••• `,e.last4]})]},e.id))})}),(0,f.jsxs)(`div`,{className:`mt-6 flex items-center gap-2`,children:[(0,f.jsx)(a.Checkbox,{id:`save-info`,checked:B,onCheckedChange:e=>V(e)}),(0,f.jsx)(o.Label,{htmlFor:`save-info`,className:`text-sm`,children:`Save my information for faster checkout`})]}),(0,f.jsxs)(`div`,{className:`mt-6 p-4 rounded-lg bg-muted/50 flex items-center gap-3`,children:[(0,f.jsx)(d.Shield,{className:`h-5 w-5 text-green-500`}),(0,f.jsx)(`p`,{className:`text-sm text-muted-foreground`,children:`Your payment information is encrypted and secure`})]})]}),(0,f.jsxs)(i.CardFooter,{className:`flex gap-4`,children:[(0,f.jsxs)(r.Button,{variant:`outline`,onClick:q,children:[(0,f.jsx)(d.ChevronLeft,{className:`h-4 w-4 mr-2`}),`Back`]}),(0,f.jsxs)(r.Button,{className:`flex-1`,onClick:K,children:[`Review Order`,(0,f.jsx)(d.ChevronRight,{className:`h-4 w-4 ml-2`})]})]})]}),E===`review`&&(0,f.jsxs)(i.Card,{children:[(0,f.jsxs)(i.CardHeader,{children:[(0,f.jsx)(i.CardTitle,{children:`Review Your Order`}),(0,f.jsx)(i.CardDescription,{children:`Please verify all information before placing your order`})]}),(0,f.jsxs)(i.CardContent,{className:`space-y-6`,children:[(0,f.jsxs)(`div`,{children:[(0,f.jsxs)(`h3`,{className:`font-medium mb-2 flex items-center gap-2`,children:[(0,f.jsx)(d.MapPin,{className:`h-4 w-4`}),`Shipping Address`]}),(0,f.jsxs)(`div`,{className:`p-4 rounded-lg bg-muted/50 text-sm`,children:[(0,f.jsxs)(`p`,{className:`font-medium`,children:[P.firstName,` `,P.lastName]}),(0,f.jsxs)(`p`,{children:[P.address,P.apartment&&`, ${P.apartment}`]}),(0,f.jsxs)(`p`,{children:[P.city,`, `,P.state,` `,P.postalCode]}),(0,f.jsx)(`p`,{children:P.email}),(0,f.jsx)(`p`,{children:P.phone})]})]}),(0,f.jsxs)(`div`,{children:[(0,f.jsxs)(`h3`,{className:`font-medium mb-2 flex items-center gap-2`,children:[(0,f.jsx)(d.Truck,{className:`h-4 w-4`}),`Shipping Method`]}),(0,f.jsxs)(`div`,{className:`p-4 rounded-lg bg-muted/50 text-sm`,children:[(0,f.jsx)(`p`,{className:`font-medium`,children:U?.name}),(0,f.jsx)(`p`,{className:`text-muted-foreground`,children:U?.estimatedDays})]})]}),(0,f.jsxs)(`div`,{children:[(0,f.jsxs)(`h3`,{className:`font-medium mb-2 flex items-center gap-2`,children:[(0,f.jsx)(d.CreditCard,{className:`h-4 w-4`}),`Payment Method`]}),(0,f.jsx)(`div`,{className:`p-4 rounded-lg bg-muted/50 text-sm`,children:(0,f.jsx)(`p`,{className:`font-medium`,children:v.find(e=>e.id===R)?.label})})]})]}),(0,f.jsxs)(i.CardFooter,{className:`flex gap-4`,children:[(0,f.jsxs)(r.Button,{variant:`outline`,onClick:q,children:[(0,f.jsx)(d.ChevronLeft,{className:`h-4 w-4 mr-2`}),`Back`]}),(0,f.jsx)(r.Button,{className:`flex-1`,onClick:G,disabled:M,children:M?(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(d.Loader2,{className:`h-4 w-4 mr-2 animate-spin`}),`Processing...`]}):(0,f.jsxs)(f.Fragment,{children:[(0,f.jsx)(d.Lock,{className:`h-4 w-4 mr-2`}),`Place Order`]})})]})]})]}),(0,f.jsx)(`div`,{className:`lg:sticky lg:top-4 h-fit`,children:(0,f.jsx)(m,{items:e,currency:C,discount:b,couponCode:O,setCouponCode:k,onApplyCoupon:W,onRemoveDiscount:x,isApplyingCoupon:A,shippingPrice:U?.price||0,taxRate:w})})]})]})}var g=[{id:`standard`,name:`Standard Shipping`,description:`Delivered by postal service`,price:4.99,estimatedDays:`5-7 business days`,icon:(0,f.jsx)(d.Package,{className:`h-5 w-5`})},{id:`express`,name:`Express Shipping`,description:`Fast delivery guaranteed`,price:14.99,estimatedDays:`2-3 business days`,icon:(0,f.jsx)(d.Truck,{className:`h-5 w-5`})},{id:`overnight`,name:`Overnight Shipping`,description:`Next day delivery`,price:29.99,estimatedDays:`Next business day`,icon:(0,f.jsx)(d.Truck,{className:`h-5 w-5`})}],_=[{id:`card`,type:`card`,label:`Credit Card`,icon:(0,f.jsx)(d.CreditCard,{className:`h-5 w-5`})},{id:`paypal`,type:`paypal`,label:`PayPal`,icon:(0,f.jsx)(`div`,{className:`h-5 w-5 rounded bg-blue-500 flex items-center justify-center text-white text-xs font-bold`,children:`P`})}],v=[{id:`1`,name:`Premium Wireless Headphones`,description:`High-quality audio with noise cancellation`,price:249.99,quantity:1,variant:`Matte Black`},{id:`2`,name:`USB-C Charging Cable`,description:`Fast charging compatible`,price:19.99,quantity:2,variant:`2m`}];exports.default=h,exports.defaultCartItems=v,exports.defaultPaymentMethods=_,exports.defaultShippingMethods=g;