const require_runtime = require("../../_virtual/_rolldown/runtime.js");
const require_objectSpread2 = require("../../_virtual/_@oxc-project_runtime@0.122.0/helpers/objectSpread2.js");
const require_useEngineContext = require("../../hooks/useEngineContext.js");
const require_index = require("../clientName/index.js");
const require_utils = require("./utils.js");
const require_index$1 = require("./line/index.js");
const require_locales = require("./locales.js");
let react = require("react");
react = require_runtime.__toESM(react);
let antd = require("antd");
let _pisell_utils = require("@pisell/utils");
let _pisell_materials = require("@pisell/materials");
let classnames = require("classnames");
classnames = require_runtime.__toESM(classnames);
let _pisell_icon = require("@pisell/icon");
require("./index.less");
//#region src/plus/clientCard/index.tsx
const processClientData = (dataSource, fieldNames = {}) => {
	if (!dataSource) return null;
	const fields = [
		"id",
		"name",
		"display_name",
		"nickname",
		"cover",
		"phone",
		"email",
		"birthday",
		"address",
		"tags"
	];
	const _data = {};
	fields.forEach((key) => {
		_data[key] = require_utils.getFieldValue(dataSource, key, fieldNames);
	});
	return require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, dataSource), _data);
};
const PREFIX = "pisell-client-card";
const renderAvatar = (processedData, avatarConfig = {}, isShowAvatar = true, isShowStatus = false, statusConfig = {}) => {
	if (!isShowAvatar || !processedData) return null;
	const { icon, useTextAvatar = false, children } = avatarConfig;
	const statusIndicator = isShowStatus && /* @__PURE__ */ react.default.createElement("div", {
		className: `pisell-client-card__status-indicator`,
		style: { backgroundColor: statusConfig.color || "#17B26A" }
	});
	if (useTextAvatar) {
		const text = children || require_utils.getAvatarText(processedData.name || processedData.display_name || processedData.nickname || "");
		return /* @__PURE__ */ react.default.createElement("div", { className: `${PREFIX}__avatar-wrapper` }, /* @__PURE__ */ react.default.createElement(_pisell_materials.PisellAvatar, require_objectSpread2._objectSpread2({ className: `${PREFIX}__avatar` }, avatarConfig), text), statusIndicator);
	}
	if (icon) return /* @__PURE__ */ react.default.createElement("div", { className: `${PREFIX}__avatar-wrapper` }, /* @__PURE__ */ react.default.createElement(_pisell_materials.PisellAvatar, require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({ className: `${PREFIX}__avatar` }, avatarConfig), {}, { icon: /* @__PURE__ */ react.default.createElement(_pisell_materials.Icon, { type: icon }) })), statusIndicator);
	return /* @__PURE__ */ react.default.createElement("div", { className: `${PREFIX}__avatar-wrapper` }, /* @__PURE__ */ react.default.createElement(_pisell_materials.PisellAvatar, require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({ className: `${PREFIX}__avatar` }, avatarConfig), {}, { src: processedData.cover })), statusIndicator);
};
const renderTags = (processedData, isShowTag = true, tags = [], tagConfig = {}) => {
	if (!isShowTag) return null;
	const tagsToShow = tags.length > 0 ? tags : (processedData === null || processedData === void 0 ? void 0 : processedData.tags) || [];
	if (!tagsToShow.length) return null;
	const { gap = 4, flexWrap = "nowrap" } = tagConfig;
	const isNoWrap = flexWrap === "nowrap";
	return /* @__PURE__ */ react.default.createElement("div", {
		className: (0, classnames.default)(`${PREFIX}__tags`, isNoWrap && `pisell-client-card__tags--nowrap`),
		style: {
			gap,
			flexWrap
		}
	}, tagsToShow.map((tag, index) => {
		const content = typeof tag === "string" ? tag : tag.children || tag.label;
		const tagProps = {
			key: index,
			color: typeof tag === "object" ? tag.color : void 0,
			className: (0, classnames.default)(`${PREFIX}__tag`, isNoWrap && `pisell-client-card__tag--nowrap`, !isNoWrap && `pisell-client-card__tag--wrap`)
		};
		return react.default.createElement(antd.Tag, tagProps, content);
	}));
};
const renderContactInfo = (processedData, isShowPhone = true, isShowEmail = true, isShowBirthday = true, isShowAddress = true, gap, cardType) => {
	if (!processedData) return null;
	const fields = [];
	if (cardType === "b2") {
		if (isShowPhone && processedData.phone) fields.push({
			value: processedData.phone,
			type: "phone"
		});
		else if (isShowEmail && processedData.email) fields.push({
			value: processedData.email,
			type: "email"
		});
	} else {
		if (isShowPhone && processedData.phone) fields.push({
			value: processedData.phone,
			type: "phone"
		});
		if (isShowEmail && processedData.email) fields.push({
			value: processedData.email,
			type: "email"
		});
	}
	if (isShowBirthday && processedData.birthday) fields.push({
		value: processedData.birthday,
		type: "birthday"
	});
	if (isShowAddress && processedData.address) fields.push({
		value: processedData.address,
		type: "address"
	});
	if (!fields.length) return null;
	return /* @__PURE__ */ react.default.createElement("div", {
		className: `${PREFIX}__fields`,
		style: { gap }
	}, fields.map((field, index) => /* @__PURE__ */ react.default.createElement("div", {
		key: index,
		className: (0, classnames.default)(`${PREFIX}__contact`, field.type === "address" && `pisell-client-card__contact--address`)
	}, field.value)));
};
const renderExtraFields = (extraFields = [], gap) => {
	if (!extraFields.length) return null;
	return /* @__PURE__ */ react.default.createElement("div", {
		className: `${PREFIX}__extra-fields`,
		style: { gap }
	}, extraFields.map((field, index) => {
		return /* @__PURE__ */ react.default.createElement("div", {
			key: index,
			className: `${PREFIX}__extra-field`
		}, field.icon && /* @__PURE__ */ react.default.createElement(_pisell_materials.Icon, {
			type: field.icon,
			className: `pisell-client-card__extra-field-icon`,
			style: {
				fontSize: field.iconSize,
				color: field.iconColor
			}
		}), field.isShowLabel !== false && field.label && /* @__PURE__ */ react.default.createElement("span", { className: `pisell-client-card__extra-field-label` }, field.label, ":"), field.isShowValue !== false && field.value && /* @__PURE__ */ react.default.createElement("span", { className: (0, classnames.default)(`pisell-client-card__extra-field-value`) }, field.value));
	}));
};
const ClientCard = ({ type = "b2", direction = "horizontal", dataSource, fieldNames = {}, style: customStyle = {}, horizontalGap, verticalGap, isShowAvatar = true, isShowName = true, isShowPhone = true, isShowEmail = true, isShowBirthday = true, isShowAddress = true, isShowTag = true, isShowStatus = false, isShowEmptyDescription = true, avatar = {}, status = {}, dropdown, defaultName, nameStyle = {}, tags = [], tag = {}, extraFields = [], slots = {}, onViewClient, onAddClient, onChangeClient, onRemoveClient }) => {
	var _context$appHelper;
	const context = require_useEngineContext.default();
	_pisell_utils.locales.init(require_locales.default, ((_context$appHelper = context.appHelper) === null || _context$appHelper === void 0 || (_context$appHelper = _context$appHelper.utils) === null || _context$appHelper === void 0 || (_context$appHelper = _context$appHelper.storage) === null || _context$appHelper === void 0 ? void 0 : _context$appHelper.get("umi_locale")) || "en");
	const processed = (0, react.useMemo)(() => {
		if (dataSource) return processClientData(dataSource, fieldNames);
		return null;
	}, [dataSource, fieldNames]);
	const translatedExtraFields = (0, react.useMemo)(() => {
		return extraFields.filter((item) => !!item);
	}, [extraFields]);
	const _dropdownProps = (0, react.useMemo)(() => {
		const _props = { menu: { items: [{
			key: "change",
			label: _pisell_utils.locales.getText("pisell2.text.change-client"),
			onClick: () => {
				onChangeClient === null || onChangeClient === void 0 || onChangeClient(dataSource);
			}
		}, {
			key: "remove",
			label: _pisell_utils.locales.getText("pisell2.text.remove-client"),
			onClick: () => {
				onRemoveClient === null || onRemoveClient === void 0 || onRemoveClient(dataSource);
			}
		}] } };
		if (dropdown && "open" in dropdown) _props.open = dropdown.open;
		return _props;
	}, [dropdown]);
	if (require_utils.isWalkIn(processed === null || processed === void 0 ? void 0 : processed.id)) {
		const cardStyle = require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, customStyle), {}, { gap: horizontalGap });
		return /* @__PURE__ */ react.default.createElement("div", require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({ className: (0, classnames.default)(PREFIX, `${PREFIX}--empty`) }, { onClick: () => onAddClient === null || onAddClient === void 0 ? void 0 : onAddClient() }), {}, { style: require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, cardStyle), {}, { cursor: "pointer" }) }), /* @__PURE__ */ react.default.createElement("div", { className: `${PREFIX}__content` }, /* @__PURE__ */ react.default.createElement("div", { className: `${PREFIX}__info` }, isShowAvatar && /* @__PURE__ */ react.default.createElement(_pisell_materials.PisellAvatar, {
			icon: avatar.icon ? /* @__PURE__ */ react.default.createElement(_pisell_materials.Icon, { type: avatar.icon }) : /* @__PURE__ */ react.default.createElement(_pisell_icon.User01, { style: { color: "#475467" } }),
			size: avatar.size
		}), /* @__PURE__ */ react.default.createElement("div", {
			className: `${PREFIX}__details`,
			style: { gap: verticalGap }
		}, isShowName && /* @__PURE__ */ react.default.createElement(require_index.default, {
			dataSource: defaultName || _pisell_utils.locales.getText("pisell2.text.add-client"),
			style: nameStyle
		}), isShowEmptyDescription && /* @__PURE__ */ react.default.createElement("div", { className: `pisell-client-card__empty-description` }, _pisell_utils.locales.getText("pisell2.text.leave-empty-for-walk-in")))), /* @__PURE__ */ react.default.createElement("div", { className: `${PREFIX}__actions` }, /* @__PURE__ */ react.default.createElement("span", { className: `${PREFIX}__plugin-icon` }, /* @__PURE__ */ react.default.createElement(_pisell_icon.PlusCircle, { style: {
			fontSize: 28,
			color: "#475467"
		} })))));
	}
	if (type === "b1") return /* @__PURE__ */ react.default.createElement(require_index$1.default, {
		dataSource: processed,
		isShowAvatar,
		isShowPhone,
		isShowEmail,
		isShowStatus,
		style: customStyle,
		horizontalGap,
		avatar,
		status,
		nameStyle,
		tags,
		tag,
		slots,
		onViewClient
	});
	const cardStyle = require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, customStyle), {}, { gap: horizontalGap });
	const isVertical = direction === "vertical";
	const isInlineTag = tag.placement === "inline";
	const getFieldVisibility = () => {
		switch (type) {
			case "b2": return {
				showBirthday: false,
				showAddress: false,
				showExtraFields: false
			};
			case "b5": return {
				showBirthday: isShowBirthday,
				showAddress: isShowAddress,
				showExtraFields: false
			};
			case "b9": return {
				showBirthday: isShowBirthday,
				showAddress: isShowAddress,
				showExtraFields: true
			};
			default: return {
				showBirthday: isShowBirthday,
				showAddress: isShowAddress,
				showExtraFields: true
			};
		}
	};
	const { showBirthday, showAddress, showExtraFields } = getFieldVisibility();
	return /* @__PURE__ */ react.default.createElement("div", require_objectSpread2._objectSpread2({
		className: (0, classnames.default)(PREFIX, `${PREFIX}--${type}`, {
			[`${PREFIX}--vertical`]: isVertical,
			[`${PREFIX}--horizontal`]: !isVertical
		}),
		style: require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({}, cardStyle), {}, { cursor: "pointer" })
	}, { onClick: () => dataSource && (onViewClient === null || onViewClient === void 0 ? void 0 : onViewClient(dataSource)) }), slots.top, /* @__PURE__ */ react.default.createElement("div", { className: `${PREFIX}__content` }, slots.left && /* @__PURE__ */ react.default.createElement("div", { className: `pisell-client-card__slot-left` }, slots.left), /* @__PURE__ */ react.default.createElement("div", { className: `${PREFIX}__info` }, renderAvatar(processed, avatar, isShowAvatar, isShowStatus, status), /* @__PURE__ */ react.default.createElement("div", {
		className: `${PREFIX}__details`,
		style: { gap: verticalGap }
	}, /* @__PURE__ */ react.default.createElement("div", { className: (0, classnames.default)(`${PREFIX}__name-tags`, isInlineTag && `pisell-client-card__name-tags--inline`) }, isShowName && /* @__PURE__ */ react.default.createElement(require_index.default, {
		dataSource: processed,
		style: nameStyle,
		className: "pisell-client-card__name "
	}), isInlineTag && renderTags(processed, isShowTag, tags, tag)), !isInlineTag && renderTags(processed, isShowTag, tags, tag), renderContactInfo(processed, isShowPhone, isShowEmail, showBirthday, showAddress, typeof verticalGap === "number" ? verticalGap : void 0, type), showExtraFields && renderExtraFields(translatedExtraFields, typeof verticalGap === "number" ? verticalGap : void 0))), /* @__PURE__ */ react.default.createElement("div", {
		className: `${PREFIX}__actions`,
		onClick: (e) => e.stopPropagation()
	}, /* @__PURE__ */ react.default.createElement(antd.Dropdown, require_objectSpread2._objectSpread2({
		trigger: ["click"],
		placement: "bottomRight"
	}, _dropdownProps), /* @__PURE__ */ react.default.createElement(antd.Button, require_objectSpread2._objectSpread2(require_objectSpread2._objectSpread2({
		type: "text",
		className: `${PREFIX}__menu-button`,
		size: "large",
		icon: /* @__PURE__ */ react.default.createElement(_pisell_materials.Icon, {
			type: "pisell2-dots-vertical",
			className: `${PREFIX}__menu-button-icon`
		})
	}, (dropdown === null || dropdown === void 0 ? void 0 : dropdown.buttonProps) || {}), {}, { onClick: (e) => {
		var _dropdown$buttonProps, _dropdown$buttonProps2;
		e.stopPropagation();
		dropdown === null || dropdown === void 0 || (_dropdown$buttonProps = dropdown.buttonProps) === null || _dropdown$buttonProps === void 0 || (_dropdown$buttonProps2 = _dropdown$buttonProps.onClick) === null || _dropdown$buttonProps2 === void 0 || _dropdown$buttonProps2.call(_dropdown$buttonProps, e);
	} })))), slots.right && /* @__PURE__ */ react.default.createElement("div", { className: `pisell-client-card__slot-right` }, slots.right)), slots.bottom);
};
//#endregion
exports.PREFIX = PREFIX;
exports.default = ClientCard;
