const require_runtime = require("../../../../../../_virtual/_rolldown/runtime.js");
const require_utils = require("../../utils.js");
const require_index = require("../WalletPassTextMode/index.js");
let react = require("react");
react = require_runtime.__toESM(react);
let _pisell_utils = require("@pisell/utils");
let _pisell_materials = require("@pisell/materials");
require("./index.less");
//#region src/components/checkout/components/WalletPassModule/components/WalletPassCardDisplay/index.tsx
const Amount = _pisell_materials.PisellText.Amount;
const WalletPassCardDisplay = ({ isCardMode, cardData, selectedWalletIds, onSelectWallet, onDetail, onConfirmEditAmount, onBeforeEditAmount }) => {
	const handleCardListChange = (value) => {
		onSelectWallet(value);
	};
	const formatBalance = (balance, option) => {
		var _option$data;
		if ((option === null || option === void 0 || (_option$data = option.data) === null || _option$data === void 0 ? void 0 : _option$data.originData.tag) === "point_card") {
			var _option$data2, _option$data3;
			const value = (option === null || option === void 0 ? void 0 : option.active) ? (balance || 0) - ((option === null || option === void 0 || (_option$data2 = option.data) === null || _option$data2 === void 0 || (_option$data2 = _option$data2.originData) === null || _option$data2 === void 0 ? void 0 : _option$data2.recommended_usage_par_value) || 0) : balance;
			const amount = require_utils.getPointCardAmount(value || 0, option === null || option === void 0 || (_option$data3 = option.data) === null || _option$data3 === void 0 || (_option$data3 = _option$data3.originData) === null || _option$data3 === void 0 ? void 0 : _option$data3.wallet_pass_usage_unit);
			return /* @__PURE__ */ react.default.createElement("div", null, /* @__PURE__ */ react.default.createElement(Amount, {
				className: "pisell-card-amount-item-value",
				useThousandsSeparator: true,
				value,
				showCurrencySymbol: false
			}), "(", /* @__PURE__ */ react.default.createElement(Amount, {
				className: "pisell-card-amount-item-value",
				useThousandsSeparator: true,
				value: amount,
				showCurrencySymbol: false
			}), ")");
		}
		if (option === null || option === void 0 ? void 0 : option.active) {
			var _option$data4;
			return /* @__PURE__ */ react.default.createElement("div", null, /* @__PURE__ */ react.default.createElement(Amount, {
				className: "pisell-card-amount-item-value",
				useThousandsSeparator: true,
				value: balance ? balance - ((option === null || option === void 0 || (_option$data4 = option.data) === null || _option$data4 === void 0 ? void 0 : _option$data4.redeem) || 0) : 0,
				showCurrencySymbol: true
			}));
		}
		return /* @__PURE__ */ react.default.createElement("div", null, /* @__PURE__ */ react.default.createElement(Amount, {
			className: "pisell-card-amount-item-value",
			useThousandsSeparator: true,
			value: balance,
			showCurrencySymbol: true
		}));
	};
	const formatBalanceTitle = (balanceTitle, option) => {
		if (option === null || option === void 0 ? void 0 : option.active) return /* @__PURE__ */ react.default.createElement("span", null, _pisell_utils.locales.getText("wallet-pass-module-balance-after"));
		return /* @__PURE__ */ react.default.createElement("span", null, _pisell_utils.locales.getText("wallet-pass-module-balance"));
	};
	const formatRedeemTitle = (title, option) => {
		if (option === null || option === void 0 ? void 0 : option.active) return /* @__PURE__ */ react.default.createElement("span", null, option.originDom);
		return /* @__PURE__ */ react.default.createElement("span", null, _pisell_utils.locales.getText("wallet-pass-module-max.use"));
	};
	return /* @__PURE__ */ react.default.createElement("div", { className: "wallet-pass-card-display-container" }, isCardMode ? /* @__PURE__ */ react.default.createElement(_pisell_materials.PisellCardList, {
		showActiveBackground: true,
		showName: true,
		showStoreName: false,
		showRedeem: true,
		showBalance: true,
		showCode: true,
		showValidDate: true,
		showDetail: true,
		showQrCode: true,
		showCover: true,
		showActions: false,
		platform: "pc",
		mode: "multiple",
		direction: "horizontal",
		formatBalance,
		formatBalanceTitle,
		formatRedeemTitle,
		type: "mini",
		data: cardData,
		hasMore: false,
		showEmpty: false,
		fullWidth: false,
		value: selectedWalletIds,
		useExternalDetail: true,
		onDetail,
		showStatus: false,
		onChange: handleCardListChange,
		actions: {
			layout: "expanded",
			detail: {
				visible: false,
				iconColor: "#1570EF"
			},
			edit: {
				visible: false,
				iconColor: "#1570EF"
			}
		},
		enableEditAmount: true,
		onConfirmEditAmount,
		onBeforeEditAmount
	}) : /* @__PURE__ */ react.default.createElement(require_index.default, {
		cardData,
		selectedWalletIds
	}));
};
//#endregion
exports.default = WalletPassCardDisplay;
