@burdenoff/microfe-billing 2026.530.2 → 2026.530.4

package/dist/billing/modules/coupons/pages/CreateCouponPage.js

@@ -4,16 +4,92 @@ import "../../../shared/components/index.js";
 import { useBillingPermissions as n } from "../../../hooks/useBillingPermissions.js";
 import { useCreateCouponMutation as r } from "../../../../generated/global-operations.js";
 import { useBillingNavigate as i } from "../../../hooks/useBillingNavigate.js";
-import { useState as a } from "react";
-import { ArrowLeft as o, DollarSign as s, Package as c, Percent as l, Save as u, Tag as d } from "lucide-react";
-import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
-import { useI18n as h } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { useRef as a, useState as o } from "react";
+import { ArrowLeft as s, Package as c, Percent as l, Save as u, Tag as d, Users as f, X as p } from "lucide-react";
+import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
+import { useI18n as _ } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
 //#region src/billing/modules/coupons/pages/CreateCouponPage.tsx
-var g = () => {
-	let { t: g } = h(), _ = (e, t) => {
-		let n = g(e);
+var v = [
+	{
+		code: "USD",
+		symbol: "$",
+		name: "US Dollar"
+	},
+	{
+		code: "EUR",
+		symbol: "€",
+		name: "Euro"
+	},
+	{
+		code: "GBP",
+		symbol: "£",
+		name: "British Pound"
+	},
+	{
+		code: "INR",
+		symbol: "₹",
+		name: "Indian Rupee"
+	},
+	{
+		code: "AUD",
+		symbol: "A$",
+		name: "Australian Dollar"
+	},
+	{
+		code: "CAD",
+		symbol: "C$",
+		name: "Canadian Dollar"
+	},
+	{
+		code: "SGD",
+		symbol: "S$",
+		name: "Singapore Dollar"
+	},
+	{
+		code: "JPY",
+		symbol: "¥",
+		name: "Japanese Yen"
+	},
+	{
+		code: "MXN",
+		symbol: "MX$",
+		name: "Mexican Peso"
+	},
+	{
+		code: "BRL",
+		symbol: "R$",
+		name: "Brazilian Real"
+	},
+	{
+		code: "CHF",
+		symbol: "Fr",
+		name: "Swiss Franc"
+	},
+	{
+		code: "HKD",
+		symbol: "HK$",
+		name: "Hong Kong Dollar"
+	},
+	{
+		code: "NZD",
+		symbol: "NZ$",
+		name: "New Zealand Dollar"
+	},
+	{
+		code: "SEK",
+		symbol: "kr",
+		name: "Swedish Krona"
+	},
+	{
+		code: "KRW",
+		symbol: "₩",
+		name: "South Korean Won"
+	}
+], y = () => {
+	let { t: y } = _(), b = (e, t) => {
+		let n = y(e);
 		return n === e ? t : n;
-	}, v = i(), y = n(), [b, x] = a({
+	}, x = i(), S = n(), [C, w] = o(""), T = a(null), [E, D] = o({
 		code: "",
 		name: "",
 		description: "",
@@ -31,138 +107,168 @@ var g = () => {
 		applicableProducts: [],
 		applicableServices: [],
 		campaignName: ""
-	}), [S, C] = a({}), [w, T] = a(!1), [E] = r();
-	if (!y.canManageDiscounts) return /* @__PURE__ */ p(e, { message: "You don't have permission to create coupons." });
-	let D = (e, t) => {
-		x((n) => ({
+	}), [O, k] = o({}), [A, j] = o(!1), M = v.find((e) => e.code === E.currency)?.symbol ?? E.currency, [N] = r();
+	if (!S.canManageDiscounts) return /* @__PURE__ */ h(e, { message: "You don't have permission to create coupons." });
+	let P = (e, t) => {
+		D((n) => ({
 			...n,
 			[e]: t
-		})), S[e] && C((t) => {
+		})), O[e] && k((t) => {
 			let n = { ...t };
 			return delete n[e], n;
 		});
-	}, O = () => {
+	}, F = () => {
 		let e = {};
-		return b.code.trim() ? /^[A-Z0-9-_]+$/.test(b.code) ? b.code.length < 3 ? e.code = "Code must be at least 3 characters" : b.code.length > 50 && (e.code = "Code must be at most 50 characters") : e.code = "Code must contain only uppercase letters, numbers, hyphens, and underscores" : e.code = "Coupon code is required", b.name.trim() || (e.name = "Coupon name is required"), b.value <= 0 && (e.value = "Value must be greater than 0"), b.type === "PERCENTAGE" && b.value > 100 && (e.value = "Percentage cannot exceed 100%"), b.validFrom || (e.validFrom = "Start date is required"), b.validUntil && b.validUntil < b.validFrom && (e.validUntil = "End date must be after start date"), C(e), Object.keys(e).length === 0;
+		return E.code.trim() ? /^[A-Z0-9-_]+$/.test(E.code) ? E.code.length < 3 ? e.code = "Code must be at least 3 characters" : E.code.length > 50 && (e.code = "Code must be at most 50 characters") : e.code = "Code must contain only uppercase letters, numbers, hyphens, and underscores" : e.code = "Coupon code is required", E.name.trim() || (e.name = "Coupon name is required"), E.value <= 0 && (e.value = "Value must be greater than 0"), E.type === "PERCENTAGE" && E.value > 100 && (e.value = "Percentage cannot exceed 100%"), E.scope === "USER_SPECIFIC" && E.restrictedToUserIds.length === 0 && (e.restrictedToUserIds = "Add at least one user email or ID"), E.validFrom || (e.validFrom = "Start date is required"), E.validUntil && E.validUntil < E.validFrom && (e.validUntil = "End date must be after start date"), k(e), Object.keys(e).length === 0;
+	}, I = (e) => {
+		let t = e.trim();
+		t && (E.restrictedToUserIds.includes(t) || P("restrictedToUserIds", [...E.restrictedToUserIds, t]), w(""));
+	}, L = (e) => {
+		P("restrictedToUserIds", E.restrictedToUserIds.filter((t) => t !== e));
 	};
-	return /* @__PURE__ */ m("div", {
+	return /* @__PURE__ */ g("div", {
 		className: "max-w-4xl mx-auto p-4 sm:p-6 space-y-6",
-		children: [/* @__PURE__ */ m("div", {
+		children: [/* @__PURE__ */ g("div", {
 			className: "flex items-center gap-4",
-			children: [/* @__PURE__ */ p("button", {
+			children: [/* @__PURE__ */ h("button", {
 				type: "button",
-				onClick: () => v("/coupons"),
+				onClick: () => x("/coupons"),
 				className: "p-2 rounded-lg hover:bg-muted text-muted-foreground hover:text-foreground",
-				children: /* @__PURE__ */ p(o, { className: "size-5" })
-			}), /* @__PURE__ */ p(t, {
-				title: _("billing.coupons.createTitle", "Create Coupon"),
+				children: /* @__PURE__ */ h(s, { className: "size-5" })
+			}), /* @__PURE__ */ h(t, {
+				title: b("billing.coupons.createTitle", "Create Coupon"),
 				description: "Create a new discount code or promotional offer",
-				icon: /* @__PURE__ */ p(d, { className: "size-6" })
+				icon: /* @__PURE__ */ h(d, { className: "size-6" })
 			})]
-		}), /* @__PURE__ */ m("form", {
+		}), /* @__PURE__ */ g("form", {
 			onSubmit: async (e) => {
-				if (e.preventDefault(), O()) {
-					T(!0);
+				if (e.preventDefault(), F()) {
+					j(!0);
 					try {
-						if ((await E({ variables: { input: {
-							code: b.code,
-							name: b.name,
-							description: b.description,
-							scope: b.scope,
-							type: b.type,
-							value: b.value,
-							currency: b.currency,
-							minPurchaseAmount: b.minPurchaseAmount,
-							maxDiscountAmount: b.maxDiscountAmount,
-							maxTotalUses: b.maxTotalUses,
-							maxUsesPerUser: b.maxUsesPerUser,
-							validFrom: new Date(b.validFrom).toISOString(),
-							validUntil: b.validUntil ? new Date(b.validUntil).toISOString() : void 0,
-							restrictedToUserIds: b.restrictedToUserIds,
-							applicableProducts: b.applicableProducts,
-							applicableServices: b.applicableServices,
+						if ((await N({ variables: { input: {
+							code: E.code,
+							name: E.name,
+							description: E.description,
+							scope: E.scope,
+							type: E.type,
+							value: E.value,
+							currency: E.currency,
+							minPurchaseAmount: E.minPurchaseAmount,
+							maxDiscountAmount: E.maxDiscountAmount,
+							maxTotalUses: E.maxTotalUses,
+							maxUsesPerUser: E.maxUsesPerUser,
+							validFrom: new Date(E.validFrom).toISOString(),
+							validUntil: E.validUntil ? new Date(E.validUntil).toISOString() : void 0,
+							restrictedToUserIds: E.restrictedToUserIds,
+							applicableProducts: E.applicableProducts,
+							applicableServices: E.applicableServices,
 							excludedProducts: [],
 							excludedServices: [],
-							campaignName: b.campaignName || void 0
-						} } })).data?.createCoupon) v("/coupons");
+							campaignName: E.campaignName || void 0
+						} } })).data?.createCoupon) x("/coupons");
 						else throw Error("Failed to create coupon");
 					} catch (e) {
-						console.error("Error creating coupon:", e), C({ code: e instanceof Error ? e.message : "Failed to create coupon. Please try again." });
+						console.error("Error creating coupon:", e), k({ code: e instanceof Error ? e.message : "Failed to create coupon. Please try again." });
 					} finally {
-						T(!1);
+						j(!1);
 					}
 				}
 			},
 			className: "space-y-6",
 			children: [
-				/* @__PURE__ */ m("div", {
+				/* @__PURE__ */ g("div", {
 					className: "bg-card border border-border rounded-lg p-6 space-y-4",
 					children: [
-						/* @__PURE__ */ p("h3", {
+						/* @__PURE__ */ h("h3", {
 							className: "text-lg font-semibold text-foreground",
 							children: "Basic Information"
 						}),
-						/* @__PURE__ */ m("div", { children: [
-							/* @__PURE__ */ p("label", {
+						/* @__PURE__ */ g("div", { children: [
+							/* @__PURE__ */ h("label", {
 								className: "block text-sm font-medium text-foreground mb-1",
 								children: "Coupon Code *"
 							}),
-							/* @__PURE__ */ p("input", {
+							/* @__PURE__ */ h("input", {
 								type: "text",
-								value: b.code,
-								onChange: (e) => D("code", e.target.value.toUpperCase()),
+								value: E.code,
+								onChange: (e) => P("code", e.target.value.toUpperCase()),
 								placeholder: "e.g., WELCOME20",
-								className: `w-full px-4 py-2 rounded-lg border ${S.code ? "border-destructive" : "border-border"} bg-background text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-primary/20`
+								className: `w-full px-4 py-2 rounded-lg border ${O.code ? "border-destructive" : "border-border"} bg-background text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-primary/20`
 							}),
-							S.code && /* @__PURE__ */ p("p", {
+							O.code && /* @__PURE__ */ h("p", {
 								className: "text-sm text-destructive mt-1",
-								children: S.code
+								children: O.code
 							}),
-							/* @__PURE__ */ p("p", {
+							/* @__PURE__ */ h("p", {
 								className: "text-xs text-muted-foreground mt-1",
 								children: "Use uppercase letters, numbers, hyphens, and underscores"
 							})
 						] }),
-						/* @__PURE__ */ m("div", { children: [
-							/* @__PURE__ */ p("label", {
+						/* @__PURE__ */ g("div", { children: [
+							/* @__PURE__ */ h("label", {
 								className: "block text-sm font-medium text-foreground mb-1",
 								children: "Display Name *"
 							}),
-							/* @__PURE__ */ p("input", {
+							/* @__PURE__ */ h("input", {
 								type: "text",
-								value: b.name,
-								onChange: (e) => D("name", e.target.value),
+								value: E.name,
+								onChange: (e) => P("name", e.target.value),
 								placeholder: "e.g., Welcome 20% Off",
-								className: `w-full px-4 py-2 rounded-lg border ${S.name ? "border-destructive" : "border-border"} bg-background text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-primary/20`
+								className: `w-full px-4 py-2 rounded-lg border ${O.name ? "border-destructive" : "border-border"} bg-background text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-primary/20`
 							}),
-							S.name && /* @__PURE__ */ p("p", {
+							O.name && /* @__PURE__ */ h("p", {
 								className: "text-sm text-destructive mt-1",
-								children: S.name
+								children: O.name
 							})
 						] }),
-						/* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p("label", {
+						/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("label", {
 							className: "block text-sm font-medium text-foreground mb-1",
 							children: "Description"
-						}), /* @__PURE__ */ p("textarea", {
-							value: b.description,
-							onChange: (e) => D("description", e.target.value),
+						}), /* @__PURE__ */ h("textarea", {
+							value: E.description,
+							onChange: (e) => P("description", e.target.value),
 							placeholder: "Optional description for internal use",
 							rows: 3,
 							className: "w-full px-4 py-2 rounded-lg border border-border bg-background text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-primary/20"
 						})] })
 					]
 				}),
-				/* @__PURE__ */ m("div", {
+				/* @__PURE__ */ g("div", {
 					className: "bg-card border border-border rounded-lg p-6 space-y-4",
 					children: [
-						/* @__PURE__ */ p("h3", {
+						/* @__PURE__ */ h("h3", {
 							className: "text-lg font-semibold text-foreground",
 							children: "Discount Configuration"
 						}),
-						/* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p("label", {
+						/* @__PURE__ */ g("div", { children: [
+							/* @__PURE__ */ h("label", {
+								className: "block text-sm font-medium text-foreground mb-1",
+								children: "Coupon Currency *"
+							}),
+							/* @__PURE__ */ h("select", {
+								value: E.currency,
+								onChange: (e) => P("currency", e.target.value),
+								className: "w-full px-4 py-2 rounded-lg border border-border bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/20",
+								children: v.map(({ code: e, symbol: t, name: n }) => /* @__PURE__ */ g("option", {
+									value: e,
+									children: [
+										t,
+										" ",
+										e,
+										" — ",
+										n
+									]
+								}, e))
+							}),
+							/* @__PURE__ */ h("p", {
+								className: "text-xs text-muted-foreground mt-1",
+								children: "Amounts below are in this currency. Users paying in a different currency (e.g. INR) will have the amounts automatically converted using live exchange rates at validation time."
+							})
+						] }),
+						/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("label", {
 							className: "block text-sm font-medium text-foreground mb-2",
 							children: "Discount Type *"
-						}), /* @__PURE__ */ p("div", {
+						}), /* @__PURE__ */ h("div", {
 							className: "grid grid-cols-3 gap-3",
 							children: [
 								{
@@ -172,244 +278,315 @@ var g = () => {
 								},
 								{
 									value: "FIXED_AMOUNT",
-									label: "Fixed Amount",
-									icon: s
+									label: `Fixed (${M})`,
+									icon: null
 								},
 								{
 									value: "FREE_SHIPPING",
 									label: "Free Shipping",
 									icon: c
 								}
-							].map(({ value: e, label: t, icon: n }) => /* @__PURE__ */ m("button", {
+							].map(({ value: e, label: t, icon: n }) => /* @__PURE__ */ g("button", {
 								type: "button",
-								onClick: () => D("type", e),
-								className: `p-4 rounded-lg border-2 transition-colors ${b.type === e ? "border-primary bg-primary/10" : "border-border hover:border-primary/50"}`,
-								children: [/* @__PURE__ */ p(n, { className: "size-5 mx-auto mb-2" }), /* @__PURE__ */ p("p", {
+								onClick: () => P("type", e),
+								className: `p-4 rounded-lg border-2 transition-colors ${E.type === e ? "border-primary bg-primary/10" : "border-border hover:border-primary/50"}`,
+								children: [n ? /* @__PURE__ */ h(n, { className: "size-5 mx-auto mb-2" }) : /* @__PURE__ */ h("span", {
+									className: "block text-lg font-bold mb-2",
+									children: M
+								}), /* @__PURE__ */ h("p", {
 									className: "text-sm font-medium",
 									children: t
 								})]
 							}, e))
 						})] }),
-						/* @__PURE__ */ m("div", { children: [
-							/* @__PURE__ */ p("label", {
+						/* @__PURE__ */ g("div", { children: [
+							/* @__PURE__ */ h("label", {
 								className: "block text-sm font-medium text-foreground mb-1",
 								children: "Discount Value *"
 							}),
-							/* @__PURE__ */ p("div", {
+							/* @__PURE__ */ h("div", {
 								className: "relative",
-								children: b.type === "PERCENTAGE" ? /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p(l, { className: "absolute left-3 top-1/2 -translate-y-1/2 size-4 text-muted-foreground" }), /* @__PURE__ */ p("input", {
+								children: E.type === "PERCENTAGE" ? /* @__PURE__ */ g(m, { children: [/* @__PURE__ */ h(l, { className: "absolute left-3 top-1/2 -translate-y-1/2 size-4 text-muted-foreground" }), /* @__PURE__ */ h("input", {
 									type: "number",
-									value: b.value,
-									onChange: (e) => D("value", parseFloat(e.target.value)),
+									value: E.value,
+									onChange: (e) => P("value", parseFloat(e.target.value)),
 									min: "0",
 									max: "100",
 									step: "0.01",
-									className: `w-full pl-10 pr-4 py-2 rounded-lg border ${S.value ? "border-destructive" : "border-border"} bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/20`
-								})] }) : /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p(s, { className: "absolute left-3 top-1/2 -translate-y-1/2 size-4 text-muted-foreground" }), /* @__PURE__ */ p("input", {
+									className: `w-full pl-10 pr-4 py-2 rounded-lg border ${O.value ? "border-destructive" : "border-border"} bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/20`
+								})] }) : /* @__PURE__ */ g(m, { children: [/* @__PURE__ */ h("span", {
+									className: "absolute left-3 top-1/2 -translate-y-1/2 text-sm text-muted-foreground font-medium",
+									children: M
+								}), /* @__PURE__ */ h("input", {
 									type: "number",
-									value: b.value,
-									onChange: (e) => D("value", parseFloat(e.target.value)),
+									value: E.value,
+									onChange: (e) => P("value", parseFloat(e.target.value)),
 									min: "0",
 									step: "0.01",
-									className: `w-full pl-10 pr-4 py-2 rounded-lg border ${S.value ? "border-destructive" : "border-border"} bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/20`
+									className: `w-full pl-10 pr-4 py-2 rounded-lg border ${O.value ? "border-destructive" : "border-border"} bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/20`
 								})] })
 							}),
-							S.value && /* @__PURE__ */ p("p", {
+							O.value && /* @__PURE__ */ h("p", {
 								className: "text-sm text-destructive mt-1",
-								children: S.value
+								children: O.value
 							})
 						] }),
-						/* @__PURE__ */ m("div", { children: [
-							/* @__PURE__ */ p("label", {
+						/* @__PURE__ */ g("div", { children: [
+							/* @__PURE__ */ g("label", {
 								className: "block text-sm font-medium text-foreground mb-1",
-								children: "Minimum Purchase Amount"
+								children: [
+									"Minimum Purchase Amount (",
+									E.currency,
+									")"
+								]
 							}),
-							/* @__PURE__ */ m("div", {
+							/* @__PURE__ */ g("div", {
 								className: "relative",
-								children: [/* @__PURE__ */ p(s, { className: "absolute left-3 top-1/2 -translate-y-1/2 size-4 text-muted-foreground" }), /* @__PURE__ */ p("input", {
+								children: [/* @__PURE__ */ h("span", {
+									className: "absolute left-3 top-1/2 -translate-y-1/2 text-sm text-muted-foreground font-medium",
+									children: M
+								}), /* @__PURE__ */ h("input", {
 									type: "number",
-									value: b.minPurchaseAmount || "",
-									onChange: (e) => D("minPurchaseAmount", e.target.value ? parseFloat(e.target.value) : null),
+									value: E.minPurchaseAmount || "",
+									onChange: (e) => P("minPurchaseAmount", e.target.value ? parseFloat(e.target.value) : null),
 									min: "0",
 									step: "0.01",
 									placeholder: "No minimum",
 									className: "w-full pl-10 pr-4 py-2 rounded-lg border border-border bg-background text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-primary/20"
 								})]
 							}),
-							/* @__PURE__ */ p("p", {
+							/* @__PURE__ */ g("p", {
 								className: "text-xs text-muted-foreground mt-1",
-								children: "Order must be at least this amount to use coupon"
+								children: [
+									"Order must be at least this amount in ",
+									E.currency,
+									" (auto-converted for other currencies)"
+								]
 							})
 						] }),
-						b.type === "PERCENTAGE" && /* @__PURE__ */ m("div", { children: [
-							/* @__PURE__ */ p("label", {
+						E.type === "PERCENTAGE" && /* @__PURE__ */ g("div", { children: [
+							/* @__PURE__ */ g("label", {
 								className: "block text-sm font-medium text-foreground mb-1",
-								children: "Maximum Discount Amount"
+								children: [
+									"Maximum Discount Amount (",
+									E.currency,
+									")"
+								]
 							}),
-							/* @__PURE__ */ m("div", {
+							/* @__PURE__ */ g("div", {
 								className: "relative",
-								children: [/* @__PURE__ */ p(s, { className: "absolute left-3 top-1/2 -translate-y-1/2 size-4 text-muted-foreground" }), /* @__PURE__ */ p("input", {
+								children: [/* @__PURE__ */ h("span", {
+									className: "absolute left-3 top-1/2 -translate-y-1/2 text-sm text-muted-foreground font-medium",
+									children: M
+								}), /* @__PURE__ */ h("input", {
 									type: "number",
-									value: b.maxDiscountAmount || "",
-									onChange: (e) => D("maxDiscountAmount", e.target.value ? parseFloat(e.target.value) : null),
+									value: E.maxDiscountAmount || "",
+									onChange: (e) => P("maxDiscountAmount", e.target.value ? parseFloat(e.target.value) : null),
 									min: "0",
 									step: "0.01",
 									placeholder: "No maximum",
 									className: "w-full pl-10 pr-4 py-2 rounded-lg border border-border bg-background text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-primary/20"
 								})]
 							}),
-							/* @__PURE__ */ p("p", {
+							/* @__PURE__ */ g("p", {
 								className: "text-xs text-muted-foreground mt-1",
-								children: "Cap the discount amount for percentage-based coupons"
+								children: [
+									"Cap the discount in ",
+									E.currency,
+									" — auto-converted to the user's payment currency"
+								]
 							})
 						] })
 					]
 				}),
-				/* @__PURE__ */ m("div", {
+				/* @__PURE__ */ g("div", {
 					className: "bg-card border border-border rounded-lg p-6 space-y-4",
 					children: [
-						/* @__PURE__ */ p("h3", {
+						/* @__PURE__ */ h("h3", {
 							className: "text-lg font-semibold text-foreground",
 							children: "Usage Limits"
 						}),
-						/* @__PURE__ */ m("div", { children: [
-							/* @__PURE__ */ p("label", {
+						/* @__PURE__ */ g("div", { children: [
+							/* @__PURE__ */ h("label", {
 								className: "block text-sm font-medium text-foreground mb-1",
 								children: "Total Usage Limit"
 							}),
-							/* @__PURE__ */ p("input", {
+							/* @__PURE__ */ h("input", {
 								type: "number",
-								value: b.maxTotalUses || "",
-								onChange: (e) => D("maxTotalUses", e.target.value ? parseInt(e.target.value) : null),
+								value: E.maxTotalUses || "",
+								onChange: (e) => P("maxTotalUses", e.target.value ? parseInt(e.target.value) : null),
 								min: "1",
 								placeholder: "Unlimited",
 								className: "w-full px-4 py-2 rounded-lg border border-border bg-background text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-primary/20"
 							}),
-							/* @__PURE__ */ p("p", {
+							/* @__PURE__ */ h("p", {
 								className: "text-xs text-muted-foreground mt-1",
 								children: "Maximum number of times this coupon can be used across all users"
 							})
 						] }),
-						/* @__PURE__ */ m("div", { children: [
-							/* @__PURE__ */ p("label", {
+						/* @__PURE__ */ g("div", { children: [
+							/* @__PURE__ */ h("label", {
 								className: "block text-sm font-medium text-foreground mb-1",
 								children: "Per-User Limit *"
 							}),
-							/* @__PURE__ */ p("input", {
+							/* @__PURE__ */ h("input", {
 								type: "number",
-								value: b.maxUsesPerUser,
-								onChange: (e) => D("maxUsesPerUser", parseInt(e.target.value)),
+								value: E.maxUsesPerUser,
+								onChange: (e) => P("maxUsesPerUser", parseInt(e.target.value)),
 								min: "1",
 								className: "w-full px-4 py-2 rounded-lg border border-border bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/20"
 							}),
-							/* @__PURE__ */ p("p", {
+							/* @__PURE__ */ h("p", {
 								className: "text-xs text-muted-foreground mt-1",
 								children: "Maximum times a single user can use this coupon"
 							})
 						] })
 					]
 				}),
-				/* @__PURE__ */ m("div", {
+				/* @__PURE__ */ g("div", {
 					className: "bg-card border border-border rounded-lg p-6 space-y-4",
-					children: [/* @__PURE__ */ p("h3", {
+					children: [/* @__PURE__ */ h("h3", {
 						className: "text-lg font-semibold text-foreground",
 						children: "Validity Period"
-					}), /* @__PURE__ */ m("div", {
+					}), /* @__PURE__ */ g("div", {
 						className: "grid grid-cols-1 md:grid-cols-2 gap-4",
-						children: [/* @__PURE__ */ m("div", { children: [
-							/* @__PURE__ */ p("label", {
+						children: [/* @__PURE__ */ g("div", { children: [
+							/* @__PURE__ */ h("label", {
 								className: "block text-sm font-medium text-foreground mb-1",
 								children: "Start Date *"
 							}),
-							/* @__PURE__ */ p("input", {
+							/* @__PURE__ */ h("input", {
 								type: "date",
-								value: b.validFrom,
-								onChange: (e) => D("validFrom", e.target.value),
-								className: `w-full px-4 py-2 rounded-lg border ${S.validFrom ? "border-destructive" : "border-border"} bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/20`
+								value: E.validFrom,
+								onChange: (e) => P("validFrom", e.target.value),
+								className: `w-full px-4 py-2 rounded-lg border ${O.validFrom ? "border-destructive" : "border-border"} bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/20`
 							}),
-							S.validFrom && /* @__PURE__ */ p("p", {
+							O.validFrom && /* @__PURE__ */ h("p", {
 								className: "text-sm text-destructive mt-1",
-								children: S.validFrom
+								children: O.validFrom
 							})
-						] }), /* @__PURE__ */ m("div", { children: [
-							/* @__PURE__ */ p("label", {
+						] }), /* @__PURE__ */ g("div", { children: [
+							/* @__PURE__ */ h("label", {
 								className: "block text-sm font-medium text-foreground mb-1",
 								children: "End Date"
 							}),
-							/* @__PURE__ */ p("input", {
+							/* @__PURE__ */ h("input", {
 								type: "date",
-								value: b.validUntil,
-								onChange: (e) => D("validUntil", e.target.value),
-								className: `w-full px-4 py-2 rounded-lg border ${S.validUntil ? "border-destructive" : "border-border"} bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/20`
+								value: E.validUntil,
+								onChange: (e) => P("validUntil", e.target.value),
+								className: `w-full px-4 py-2 rounded-lg border ${O.validUntil ? "border-destructive" : "border-border"} bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/20`
 							}),
-							S.validUntil && /* @__PURE__ */ p("p", {
+							O.validUntil && /* @__PURE__ */ h("p", {
 								className: "text-sm text-destructive mt-1",
-								children: S.validUntil
+								children: O.validUntil
 							}),
-							/* @__PURE__ */ p("p", {
+							/* @__PURE__ */ h("p", {
 								className: "text-xs text-muted-foreground mt-1",
 								children: "Leave empty for no expiry"
 							})
 						] })]
 					})]
 				}),
-				/* @__PURE__ */ m("div", {
+				/* @__PURE__ */ g("div", {
 					className: "bg-card border border-border rounded-lg p-6 space-y-4",
 					children: [
-						/* @__PURE__ */ p("h3", {
+						/* @__PURE__ */ h("h3", {
 							className: "text-lg font-semibold text-foreground",
 							children: "Coupon Scope"
 						}),
-						/* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p("label", {
+						/* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("label", {
 							className: "block text-sm font-medium text-foreground mb-2",
 							children: "Who can use this coupon? *"
-						}), /* @__PURE__ */ m("select", {
-							value: b.scope,
-							onChange: (e) => D("scope", e.target.value),
+						}), /* @__PURE__ */ g("select", {
+							value: E.scope,
+							onChange: (e) => P("scope", e.target.value),
 							className: "w-full px-4 py-2 rounded-lg border border-border bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-primary/20",
 							children: [
-								/* @__PURE__ */ p("option", {
+								/* @__PURE__ */ h("option", {
 									value: "GENERIC",
 									children: "Anyone (Public)"
 								}),
-								/* @__PURE__ */ p("option", {
+								/* @__PURE__ */ h("option", {
 									value: "USER_SPECIFIC",
 									children: "Specific Users Only"
 								}),
-								/* @__PURE__ */ p("option", {
+								/* @__PURE__ */ h("option", {
 									value: "REFERRAL",
 									children: "Referral Code"
 								}),
-								/* @__PURE__ */ p("option", {
+								/* @__PURE__ */ h("option", {
 									value: "CAMPAIGN",
 									children: "Campaign-Specific"
 								})
 							]
 						})] }),
-						b.scope === "CAMPAIGN" && /* @__PURE__ */ m("div", { children: [/* @__PURE__ */ p("label", {
+						E.scope === "CAMPAIGN" && /* @__PURE__ */ g("div", { children: [/* @__PURE__ */ h("label", {
 							className: "block text-sm font-medium text-foreground mb-1",
 							children: "Campaign Name"
-						}), /* @__PURE__ */ p("input", {
+						}), /* @__PURE__ */ h("input", {
 							type: "text",
-							value: b.campaignName,
-							onChange: (e) => D("campaignName", e.target.value),
+							value: E.campaignName,
+							onChange: (e) => P("campaignName", e.target.value),
 							placeholder: "e.g., Summer Sale 2024",
 							className: "w-full px-4 py-2 rounded-lg border border-border bg-background text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-primary/20"
-						})] })
+						})] }),
+						E.scope === "USER_SPECIFIC" && /* @__PURE__ */ g("div", { children: [
+							/* @__PURE__ */ h("label", {
+								className: "block text-sm font-medium text-foreground mb-1",
+								children: /* @__PURE__ */ g("span", {
+									className: "flex items-center gap-1.5",
+									children: [/* @__PURE__ */ h(f, { className: "size-4" }), "Restricted Users *"]
+								})
+							}),
+							/* @__PURE__ */ g("div", {
+								className: `min-h-[42px] flex flex-wrap gap-2 px-3 py-2 rounded-lg border ${O.restrictedToUserIds ? "border-destructive" : "border-border"} bg-background cursor-text`,
+								onClick: () => T.current?.focus(),
+								children: [E.restrictedToUserIds.map((e) => /* @__PURE__ */ g("span", {
+									className: "inline-flex items-center gap-1 px-2 py-0.5 rounded-md bg-primary/10 text-primary text-sm font-medium",
+									children: [e, /* @__PURE__ */ h("button", {
+										type: "button",
+										onClick: (t) => {
+											t.stopPropagation(), L(e);
+										},
+										className: "hover:text-destructive",
+										children: /* @__PURE__ */ h(p, { className: "size-3" })
+									})]
+								}, e)), /* @__PURE__ */ h("input", {
+									ref: T,
+									type: "text",
+									value: C,
+									onChange: (e) => w(e.target.value),
+									onKeyDown: (e) => {
+										e.key === "Enter" || e.key === "," ? (e.preventDefault(), I(C)) : e.key === "Backspace" && !C && E.restrictedToUserIds.length > 0 && L(E.restrictedToUserIds[E.restrictedToUserIds.length - 1]);
+									},
+									onBlur: () => I(C),
+									placeholder: E.restrictedToUserIds.length === 0 ? "Enter user email or ID, press Enter to add" : "Add another…",
+									className: "flex-1 min-w-[200px] bg-transparent text-foreground placeholder:text-muted-foreground text-sm focus:outline-none"
+								})]
+							}),
+							O.restrictedToUserIds && /* @__PURE__ */ h("p", {
+								className: "text-sm text-destructive mt-1",
+								children: O.restrictedToUserIds
+							}),
+							/* @__PURE__ */ h("p", {
+								className: "text-xs text-muted-foreground mt-1",
+								children: "Type an email or user ID and press Enter or comma to add. Only these users can redeem this coupon."
+							})
+						] })
 					]
 				}),
-				/* @__PURE__ */ m("div", {
+				/* @__PURE__ */ g("div", {
 					className: "flex items-center justify-end gap-3",
-					children: [/* @__PURE__ */ p("button", {
+					children: [/* @__PURE__ */ h("button", {
 						type: "button",
-						onClick: () => v("/coupons"),
+						onClick: () => x("/coupons"),
 						className: "px-6 py-3 rounded-lg border border-border text-foreground hover:bg-muted",
 						children: "Cancel"
-					}), /* @__PURE__ */ p("button", {
+					}), /* @__PURE__ */ h("button", {
 						type: "submit",
-						disabled: w,
+						disabled: A,
 						className: "px-6 py-3 rounded-lg bg-primary text-primary-foreground hover:bg-primary/90 flex items-center gap-2 disabled:opacity-50 disabled:cursor-not-allowed",
-						children: w ? /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p("div", { className: "size-4 border-2 border-primary-foreground border-t-transparent rounded-full animate-spin" }), "Creating…"] }) : /* @__PURE__ */ m(f, { children: [/* @__PURE__ */ p(u, { className: "size-4" }), "Create Coupon"] })
+						children: A ? /* @__PURE__ */ g(m, { children: [/* @__PURE__ */ h("div", { className: "size-4 border-2 border-primary-foreground border-t-transparent rounded-full animate-spin" }), "Creating…"] }) : /* @__PURE__ */ g(m, { children: [/* @__PURE__ */ h(u, { className: "size-4" }), "Create Coupon"] })
 					})]
 				})
 			]
@@ -417,6 +594,6 @@ var g = () => {
 	});
 };
 //#endregion
-export { g as CreateCouponPage };
+export { y as CreateCouponPage };
 
 //# sourceMappingURL=CreateCouponPage.js.map