import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { useContext } from 'react';
import cls from 'clsx';
import ConfigProviderContext from '../config-provider/ConfigProviderContext';
import { Tag } from '../tag';
import { Image } from '../image';
import { isDef } from '../utils';

function isStringOrNumber(target) {
  return typeof target === 'string' || typeof target === 'number';
}

const ProductCard = props => {
  const {
    prefixCls,
    createNamespace
  } = useContext(ConfigProviderContext);
  const [bem] = createNamespace('product-card', prefixCls);

  const renderTitle = () => {
    if (props.title) {
      return _jsx("div", Object.assign({
        className: cls(bem('title'), 'rv-multi-ellipsis--l2')
      }, {
        children: props.title
      }));
    }

    return null;
  };

  const renderThumbTag = () => {
    if (props.tag) {
      return _jsx("div", Object.assign({
        className: cls(bem('tag'))
      }, {
        children: isStringOrNumber(props.tag) ? _jsx(Tag, Object.assign({
          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", Object.assign({
        href: props.thumbLink,
        className: cls(bem('thumb')),
        onClick: props.onClickThumb
      }, {
        children: [renderThumbImage(), renderThumbTag()]
      }));
    }

    return null;
  };

  const renderDesc = () => {
    if (props.desc) {
      return _jsx("div", Object.assign({
        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", Object.assign({
          className: cls(bem('price-currency'))
        }, {
          children: props.currency
        })), _jsx("span", Object.assign({
          className: cls(bem('price-integer'))
        }, {
          children: priceArr[0]
        })), props.decimal && _jsxs(_Fragment, {
          children: [".", _jsx("span", Object.assign({
            className: cls(bem('price-decimal'))
          }, {
            children: priceArr[1] || '00'
          }))]
        })]
      });
    }

    return props.price;
  };

  const renderOriginalPrice = () => {
    return _jsx("div", Object.assign({
      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", Object.assign({
    className: cls(bem('price'))
  }, {
    children: renderPriceText()
  }));

  const OriginPrice = showOriginPrice && renderOriginalPrice();

  const Num = showNum && _jsx("div", Object.assign({
    className: cls(bem('num'))
  }, {
    children: isStringOrNumber(props.num) ? `x${props.num}` : props.num
  }));

  const Footer = props.footer && _jsx("div", Object.assign({
    className: cls(bem('footer'))
  }, {
    children: props.footer
  }));

  const Bottom = showBottom && _jsxs("div", Object.assign({
    className: cls(bem('bottom'))
  }, {
    children: [props.priceTop, Price, OriginPrice, Num, props.bottom]
  }));

  return _jsxs("div", Object.assign({
    className: cls(bem(), props.className),
    style: props.style,
    onClick: props.onClick
  }, {
    children: [_jsxs("div", Object.assign({
      className: cls(bem('header'))
    }, {
      children: [renderThumb(), _jsxs("div", Object.assign({
        className: cls(bem('content', {
          centered: props.centered
        }))
      }, {
        children: [_jsxs("div", {
          children: [renderTitle(), renderDesc(), props.tags]
        }), Bottom]
      }))]
    })), Footer]
  }));
}; // defaultProps defined if need


ProductCard.defaultProps = {
  currency: '¥',
  decimal: true
};
export default ProductCard;