@react-vant-next/campaign/es/product-card/ProductCard.js

React Mobile UI Components based on Vant UI - Next Generation

import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
import { Image, Tag } from '@react-vant-next/ui';
import { createNamespace, mergeProps, isDef } from '@react-vant-next/utils';
import cls from 'clsx';

function isStringOrNumber(target) {
    return typeof target === "string" || typeof target === "number";
}
const [bem] = createNamespace("product-card");
const ProductCard = (p) => {
    const props = mergeProps(p, {
        currency: "¥",
        decimal: true,
    });
    const renderTitle = () => {
        if (props.title) {
            return (jsx("div", { className: cls(bem("title"), "rv-multi-ellipsis--l2"), children: props.title }));
        }
        return null;
    };
    const renderThumbTag = () => {
        if (props.tag) {
            return (jsx("div", { className: cls(bem("tag")), children: isStringOrNumber(props.tag)
                    ? (jsx(Tag, { mark: true, type: "danger", children: props.tag }))
                    : (props.tag) }));
        }
        return null;
    };
    const renderThumbImage = () => {
        if (!props.thumb)
            return null;
        if (typeof props.thumb === "string") {
            return (jsx(Image, { src: props.thumb, fit: "cover", width: "100%", height: "100%", lazyload: props.lazyload }));
        }
        return props.thumb;
    };
    const renderThumb = () => {
        if (props.thumb) {
            return (jsxs("a", { href: props.thumbLink, className: cls(bem("thumb")), onClick: props.onClickThumb, children: [renderThumbImage(), renderThumbTag()] }));
        }
        return null;
    };
    const renderDesc = () => {
        if (props.desc) {
            return jsx("div", { className: cls(bem("desc"), "rv-ellipsis"), children: props.desc });
        }
        return null;
    };
    const renderPriceText = () => {
        if (isStringOrNumber(props.price)) {
            const priceArr = props.price.toString().split(".");
            return (jsxs("div", { children: [jsx("span", { className: cls(bem("price-currency")), children: props.currency }), jsx("span", { className: cls(bem("price-integer")), children: priceArr[0] }), props.decimal && (jsxs(Fragment, { children: [".", jsx("span", { className: cls(bem("price-decimal")), children: priceArr[1] || "00" })] }))] }));
        }
        return props.price;
    };
    const renderOriginalPrice = () => {
        return (jsx("div", { className: cls(bem("origin-price")), children: isStringOrNumber(props.originPrice)
                ? `${props.currency} ${props.originPrice}`
                : props.originPrice }));
    };
    const showNum = isDef(props.num);
    const showPrice = isDef(props.price);
    const showOriginPrice = isDef(props.originPrice);
    const showBottom = showNum || showPrice || showOriginPrice || props.bottom;
    const Price = showPrice && (jsx("div", { className: cls(bem("price")), children: renderPriceText() }));
    const OriginPrice = showOriginPrice && renderOriginalPrice();
    const Num = showNum && (jsx("div", { className: cls(bem("num")), children: isStringOrNumber(props.num) ? `x${props.num}` : props.num }));
    const Footer = props.footer && (jsx("div", { className: cls(bem("footer")), children: props.footer }));
    const Bottom = showBottom && (jsxs("div", { className: cls(bem("bottom")), children: [props.priceTop, Price, OriginPrice, Num, props.bottom] }));
    return (jsxs("div", { className: cls(bem(), props.className), style: props.style, onClick: props.onClick, children: [jsxs("div", { className: cls(bem("header")), children: [renderThumb(), jsxs("div", { className: cls(bem("content", { centered: props.centered })), children: [jsxs("div", { children: [renderTitle(), renderDesc(), props.tags] }), Bottom] })] }), Footer] }));
};

export { ProductCard as default };
//# sourceMappingURL=ProductCard.js.map