const require_runtime = require("../../../../_virtual/_rolldown/runtime.js");
const require_utils = require("../../../booking/utils.js");
const require_useEngineContext = require("../../../../hooks/useEngineContext.js");
const require_locales = require("../../locales.js");
const require_usePrefix = require("../../../../hooks/usePrefix.js");
const require_useToast = require("../../../../hooks/useToast.js");
let react = require("react");
react = require_runtime.__toESM(react);
let antd = require("antd");
let _pisell_utils = require("@pisell/utils");
let classnames = require("classnames");
classnames = require_runtime.__toESM(classnames);
require("./index.less");
//#region src/components/checkout/components/SendPaymentLinkModal/index.tsx
function SendPaymentLinkModal({ balanceAmount = "$15.1", customerEmail = "customer@email.com", customerName = "", onClose, sendPaymentLink, customerId }) {
	var _context$appHelper$ut, _context$appHelper$ut2, _context$appHelper$ut3, _context$appHelper$ut4;
	const prefix = require_usePrefix.default();
	const context = require_useEngineContext.default();
	_pisell_utils.locales.init(require_locales.default, ((_context$appHelper$ut = context.appHelper.utils) === null || _context$appHelper$ut === void 0 || (_context$appHelper$ut2 = _context$appHelper$ut.getApp) === null || _context$appHelper$ut2 === void 0 || (_context$appHelper$ut2 = _context$appHelper$ut2.call(_context$appHelper$ut)) === null || _context$appHelper$ut2 === void 0 || (_context$appHelper$ut2 = _context$appHelper$ut2.locales) === null || _context$appHelper$ut2 === void 0 || (_context$appHelper$ut3 = _context$appHelper$ut2.getLocale) === null || _context$appHelper$ut3 === void 0 ? void 0 : _context$appHelper$ut3.call(_context$appHelper$ut2)) || ((_context$appHelper$ut4 = context.appHelper.utils) === null || _context$appHelper$ut4 === void 0 || (_context$appHelper$ut4 = _context$appHelper$ut4.storage) === null || _context$appHelper$ut4 === void 0 ? void 0 : _context$appHelper$ut4.get("umi_locale")) || "en");
	const Toast = require_useToast.default();
	const getText = (key, fallback) => {
		return _pisell_utils.locales.getText(key) || fallback;
	};
	const formatCustomerName = (customerName) => {
		if (require_utils.isWalkIn(customerId)) return "";
		const formatTemplate = getText("pisell2.checkout.send-payment-link.customer-name-format");
		if (typeof formatTemplate === "function") return formatTemplate(customerName);
		return `${customerName}'s `;
	};
	const validateEmail = (email) => {
		return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);
	};
	const [emailAddress, setEmailAddress] = (0, react.useState)(customerEmail || "");
	(0, react.useEffect)(() => {
		setEmailAddress(customerEmail || "");
	}, [customerEmail]);
	const handleSendLink = () => {
		console.log("Send link clicked");
		console.log("Email to send:", emailAddress);
		console.log("Amount to send:", balanceAmount);
		if (!emailAddress || emailAddress.trim() === "") {
			Toast.fail(getText("pisell2.checkout.send-payment-link.email-required"));
			return;
		}
		if (!validateEmail(emailAddress.trim())) {
			Toast.fail(getText("pisell2.checkout.send-payment-link.email-invalid"));
			return;
		}
		sendPaymentLink({
			emails: [emailAddress.trim()],
			amount: balanceAmount
		});
		onClose === null || onClose === void 0 || onClose();
	};
	const modalContent = /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)("send-payment-link-modal") }, /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)("modal-content") }, /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)("main-content") }, /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)("illustration-container") }, /* @__PURE__ */ react.default.createElement("img", {
		src: prefix + "/send_payment_link.png",
		className: (0, classnames.default)("illustration")
	})), /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)("form-container") }, /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)("email-options-container") }, /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)("email-section") }, /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)("section-label") }, formatCustomerName(customerName), getText("pisell2.checkout.send-payment-link.email-address", "Email Address")), /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)("email-option") }, /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)("email-input-container") }, /* @__PURE__ */ react.default.createElement("div", { className: `${(0, classnames.default)("email-input")} ${(0, classnames.default)("email-input-selected")}` }, /* @__PURE__ */ react.default.createElement("input", {
		type: "email",
		value: emailAddress,
		onChange: (e) => setEmailAddress(e.target.value),
		placeholder: getText("pisell2.checkout.send-payment-link.email-placeholder", "Enter email address"),
		className: (0, classnames.default)("email-text-input")
	})))))), /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)("footer") }, /* @__PURE__ */ react.default.createElement("button", {
		className: (0, classnames.default)("send-button"),
		onClick: handleSendLink
	}, getText("pisell2.checkout.send-payment-link.send-button", "Send Link")))))));
	return /* @__PURE__ */ react.default.createElement(antd.Modal, {
		title: getText("pisell2.checkout.send-payment-link.modal-title", "Send Payment Link"),
		width: 680,
		footer: null,
		centered: true,
		wrapClassName: "send-payment-link-modal-wrapper",
		open: true,
		onCancel: onClose
	}, modalContent);
}
//#endregion
exports.default = SendPaymentLinkModal;
