@alifd/meet-react/es/card/card.js

Fusion Mobile React UI System Component

import { rpx2vw4style as __rpx2vw__ } from "@alifd/babel-runtime-jsx-style-transform";
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
import { __rest } from "tslib";
import React, { createElement } from "react";
import classNames from 'classnames';
import View from '../view';
import Icon from '../icon';
import { isInvalidValue, isNumber, isValidArray, noop } from '../utils';
var ARROW_ICON_MAP = {
  right: 'arrow-right',
  up: 'arrow-up',
  down: 'arrow-down',
  loading: 'loading'
};
var Card = function Card(props) {
  var _props$prefix = props.prefix,
    prefix = _props$prefix === void 0 ? 'mt-' : _props$prefix,
    _props$showHeadDivide = props.showHeadDivider,
    showHeadDivider = _props$showHeadDivide === void 0 ? true : _props$showHeadDivide,
    media = props.media,
    arrow = props.arrow,
    extra = props.extra,
    title = props.title,
    className = props.className,
    headerClassName = props.headerClassName,
    headerStyle = props.headerStyle,
    bodyClassName = props.bodyClassName,
    footerClassName = props.footerClassName,
    contentHeight = props.contentHeight,
    _props$bodyStyle = props.bodyStyle,
    bodyStyle = _props$bodyStyle === void 0 ? {} : _props$bodyStyle,
    _props$footerStyle = props.footerStyle,
    footerStyle = _props$footerStyle === void 0 ? {} : _props$footerStyle,
    actions = props.actions,
    children = props.children,
    _props$onHeaderClick = props.onHeaderClick,
    onHeaderClick = _props$onHeaderClick === void 0 ? noop : _props$onHeaderClick,
    _props$onBodyClick = props.onBodyClick,
    onBodyClick = _props$onBodyClick === void 0 ? noop : _props$onBodyClick,
    others = __rest(props, ["prefix", "showHeadDivider", "media", "arrow", "extra", "title", "className", "headerClassName", "headerStyle", "bodyClassName", "footerClassName", "contentHeight", "bodyStyle", "footerStyle", "actions", "children", "onHeaderClick", "onBodyClick"]);
  var clsPrefix = "".concat(prefix, "card");
  var clses = {
    card: classNames(className, clsPrefix),
    header: classNames("".concat(clsPrefix, "-header"), headerClassName, _defineProperty({}, "".concat(clsPrefix, "-header--no-divider"), !showHeadDivider)),
    title: "".concat(clsPrefix, "-title"),
    media: "".concat(clsPrefix, "-media"),
    extra: "".concat(clsPrefix, "-extra"),
    arrow: "".concat(clsPrefix, "-arrow"),
    body: classNames("".concat(clsPrefix, "-body"), bodyClassName),
    footer: classNames("".concat(clsPrefix, "-footer"), footerClassName)
  };
  var _bodyStyle = bodyStyle;
  if (isNumber(contentHeight) && contentHeight >= 0) {
    _bodyStyle.height = contentHeight;
  }
  return /*#__PURE__*/React.createElement(View, _extends({
    className: clses.card
  }, others), !isInvalidValue(title) && !!title ? /*#__PURE__*/React.createElement(View, {
    className: clses.header,
    onClick: onHeaderClick,
    style: __rpx2vw__(headerStyle)
  }, media ? /*#__PURE__*/React.createElement(View, {
    className: clses.media
  }, media) : null, /*#__PURE__*/React.createElement(View, {
    className: clses.title
  }, title), extra ? /*#__PURE__*/React.createElement(View, {
    className: clses.extra
  }, extra) : null, Object.keys(ARROW_ICON_MAP).indexOf(arrow) > -1 ? /*#__PURE__*/React.createElement(Icon, {
    className: clses.arrow,
    type: ARROW_ICON_MAP[arrow],
    size: "s"
  }) : null) : null, children ? /*#__PURE__*/React.createElement(View, {
    className: clses.body,
    style: __rpx2vw__(_bodyStyle),
    onClick: onBodyClick
  }, children) : null, isValidArray(actions) ? /*#__PURE__*/React.createElement(View, {
    className: clses.footer,
    style: __rpx2vw__(footerStyle)
  }, actions) : null);
};
Card.displayName = 'Card';
export default Card;