const require_runtime = require("../../../../_virtual/_rolldown/runtime.js");
const require_useStore = require("../../hooks/useStore.js");
const require_index = require("../../../../pro/Selector/index.js");
let react = require("react");
react = require_runtime.__toESM(react);
let _pisell_utils = require("@pisell/utils");
require("./index.less");
//#region src/plus/skuOptionsSelection/components/VariantCard/index.tsx
const VariantCard = (props) => {
	var _props$dataSource, _props$dataSource2;
	const { dataSource, actions } = props || {};
	const symbol = require_useStore.default((s) => s.symbol);
	const skuCardConfig = require_useStore.default((s) => s.skuCardConfig);
	const isVariantPriceVisible = (skuCardConfig === null || skuCardConfig === void 0 ? void 0 : skuCardConfig.variantPriceVisible) === true;
	const priceConfig = skuCardConfig === null || skuCardConfig === void 0 ? void 0 : skuCardConfig.price;
	const priceText = formatPriceText({
		symbol,
		price: dataSource === null || dataSource === void 0 ? void 0 : dataSource.price
	});
	const handleClick = (e) => {
		e.stopPropagation();
		if (dataSource === null || dataSource === void 0 ? void 0 : dataSource.disabled) return;
		if (dataSource === null || dataSource === void 0 ? void 0 : dataSource.selected) actions.update(dataSource._key, { quantity: 0 });
		else actions.update(dataSource._key, {
			quantity: 1,
			data: dataSource._original
		});
	};
	return /* @__PURE__ */ react.default.createElement(require_index.default.Item, props || {}, /* @__PURE__ */ react.default.createElement("div", {
		className: "pisell-sku-options-selection-variant-card",
		onClick: handleClick
	}, /* @__PURE__ */ react.default.createElement("div", { className: "pisell-sku-options-selection-variant-card__title" }, ((_props$dataSource = props.dataSource) === null || _props$dataSource === void 0 ? void 0 : _props$dataSource.title) || "", ((_props$dataSource2 = props.dataSource) === null || _props$dataSource2 === void 0 || (_props$dataSource2 = _props$dataSource2._extra) === null || _props$dataSource2 === void 0 ? void 0 : _props$dataSource2.hasStock) === false ? ` (${_pisell_utils.locales.getText("pisell2.skuOptionsSelection.variantItemCard.soldOut")})` : null), isVariantPriceVisible && (priceConfig === null || priceConfig === void 0 ? void 0 : priceConfig.visible) !== false && !!priceText ? /* @__PURE__ */ react.default.createElement("div", {
		className: "pisell-sku-options-selection-variant-card__price",
		style: {
			fontSize: priceConfig === null || priceConfig === void 0 ? void 0 : priceConfig.fontSize,
			fontWeight: priceConfig === null || priceConfig === void 0 ? void 0 : priceConfig.fontWeight,
			color: priceConfig === null || priceConfig === void 0 ? void 0 : priceConfig.color
		}
	}, _pisell_utils.locales.getText("pisell2.skuOptionsSelection.variantItemCard.price"), ":", priceText) : null));
};
function formatPriceText(params) {
	const symbol = params.symbol || "$";
	const price = Number(params.price);
	if (!params.price && params.price !== 0) return "";
	if (Number.isNaN(price)) return "";
	return `${symbol}${price.toFixed(2)}`;
}
//#endregion
exports.default = VariantCard;
