choerodon-ui/lib/list/Item.js

An enterprise-class UI design language and React-based implementation

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = exports.Meta = void 0;

var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));

var _react = _interopRequireWildcard(require("react"));

var _classnames = _interopRequireDefault(require("classnames"));

var _grid = require("../grid");

var _ConfigContext = _interopRequireDefault(require("../config-provider/ConfigContext"));

var _ListContext = _interopRequireDefault(require("./ListContext"));

var ListMeta = function ListMeta(props) {
  var customizePrefixCls = props.prefixCls,
      className = props.className,
      avatar = props.avatar,
      title = props.title,
      description = props.description,
      others = (0, _objectWithoutProperties2["default"])(props, ["prefixCls", "className", "avatar", "title", "description"]);

  var _useContext = (0, _react.useContext)(_ConfigContext["default"]),
      getPrefixCls = _useContext.getPrefixCls;

  var prefixCls = getPrefixCls('list', customizePrefixCls);
  var classString = (0, _classnames["default"])("".concat(prefixCls, "-item-meta"), className);

  var content = _react["default"].createElement("div", {
    className: "".concat(prefixCls, "-item-meta-content")
  }, title && _react["default"].createElement("h4", {
    className: "".concat(prefixCls, "-item-meta-title")
  }, title), description && _react["default"].createElement("div", {
    className: "".concat(prefixCls, "-item-meta-description")
  }, description));

  return _react["default"].createElement("div", (0, _extends2["default"])({}, others, {
    className: classString
  }), avatar && _react["default"].createElement("div", {
    className: "".concat(prefixCls, "-item-meta-avatar")
  }, avatar), (title || description) && content);
};

ListMeta.displayName = 'ListMeta';
var Meta = (0, _react.memo)(ListMeta);
exports.Meta = Meta;

function getGrid(grid, t) {
  return grid[t] && Math.floor(24 / grid[t]);
}

var ListItem = function ListItem(props) {
  var _useContext2 = (0, _react.useContext)(_ListContext["default"]),
      grid = _useContext2.grid,
      getPrefixCls = _useContext2.getPrefixCls;

  var customizePrefixCls = props.prefixCls,
      children = props.children,
      actions = props.actions,
      extra = props.extra,
      className = props.className,
      others = (0, _objectWithoutProperties2["default"])(props, ["prefixCls", "children", "actions", "extra", "className"]);
  var prefixCls = getPrefixCls('list', customizePrefixCls);
  var classString = (0, _classnames["default"])("".concat(prefixCls, "-item"), className);
  var metaContent = [];
  var otherContent = [];

  _react.Children.forEach(children, function (element) {
    if (element && element.type && element.type === Meta) {
      metaContent.push(element);
    } else {
      otherContent.push(element);
    }
  });

  var contentClassString = (0, _classnames["default"])("".concat(prefixCls, "-item-content"), (0, _defineProperty2["default"])({}, "".concat(prefixCls, "-item-content-single"), metaContent.length < 1));
  var content = otherContent.length > 0 ? _react["default"].createElement("div", {
    className: contentClassString
  }, otherContent) : null;
  var actionsContent;

  if (actions && actions.length > 0) {
    var actionsContentItem = function actionsContentItem(action, i) {
      return _react["default"].createElement("li", {
        key: "".concat(prefixCls, "-item-action-").concat(i)
      }, action, i !== actions.length - 1 && _react["default"].createElement("em", {
        className: "".concat(prefixCls, "-item-action-split")
      }));
    };

    actionsContent = _react["default"].createElement("ul", {
      className: "".concat(prefixCls, "-item-action")
    }, actions.map(function (action, i) {
      return actionsContentItem(action, i);
    }));
  }

  var extraContent = _react["default"].createElement("div", {
    className: "".concat(prefixCls, "-item-extra-wrap")
  }, _react["default"].createElement("div", {
    className: "".concat(prefixCls, "-item-main")
  }, metaContent, content, actionsContent), _react["default"].createElement("div", {
    className: "".concat(prefixCls, "-item-extra")
  }, extra));

  var mainContent = grid ? _react["default"].createElement(_grid.Col, {
    span: getGrid(grid, 'column'),
    xs: getGrid(grid, 'xs'),
    sm: getGrid(grid, 'sm'),
    md: getGrid(grid, 'md'),
    lg: getGrid(grid, 'lg'),
    xl: getGrid(grid, 'xl'),
    xxl: getGrid(grid, 'xxl')
  }, _react["default"].createElement("div", (0, _extends2["default"])({}, others, {
    className: classString
  }), extra && extraContent, !extra && metaContent, !extra && content, !extra && actionsContent)) : _react["default"].createElement("div", (0, _extends2["default"])({}, others, {
    className: classString
  }), extra && extraContent, !extra && metaContent, !extra && content, !extra && actionsContent);
  return mainContent;
};

ListItem.displayName = 'ListItem';
ListItem.Meta = Meta;
var _default = ListItem;
exports["default"] = _default;
//# sourceMappingURL=Item.js.map