@activecollab/components/dist/cjs/components/EntityCard/EntityCard.js

ActiveCollab Components

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.EntityCard = void 0;
var _react = _interopRequireWildcard(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _Styles = require("./Styles");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
var EntityCard = exports.EntityCard = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
  var _ref$renderAs = _ref.renderAs,
    renderAs = _ref$renderAs === void 0 ? "list-item" : _ref$renderAs,
    properties = _ref.properties,
    className = _ref.className;
  var renderAsListItem = (0, _react.useCallback)(function (properties) {
    return properties.filter(function (p) {
      return p.showInList;
    }).map(function (p) {
      return /*#__PURE__*/_react.default.createElement("div", {
        key: p.name,
        className: "entity-property-".concat(p.name)
      }, p.render());
    });
  }, []);
  var renderAsGridItem = (0, _react.useCallback)(function (properties) {
    var headerSection = properties.filter(function (p) {
      return p.cardSection === "header";
    });
    var bodySection = properties.filter(function (p) {
      return p.cardSection === "body";
    });
    var footerSection = properties.filter(function (p) {
      return p.cardSection === "footer";
    });
    var renderProperty = function renderProperty(p) {
      return /*#__PURE__*/_react.default.createElement("div", {
        key: p.name,
        className: "entity-property-".concat(p.name)
      }, p.render());
    };
    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
      className: "card-header"
    }, headerSection.map(function (p) {
      return renderProperty(p);
    })), /*#__PURE__*/_react.default.createElement("div", {
      className: "card-body"
    }, bodySection.map(function (p) {
      return renderProperty(p);
    })), /*#__PURE__*/_react.default.createElement("div", {
      className: "card-footer"
    }, footerSection.map(function (p) {
      return renderProperty(p);
    })));
  }, []);
  return /*#__PURE__*/_react.default.createElement(_Styles.StyledEntityCard, {
    ref: ref,
    hoverable: true,
    className: (0, _classnames.default)("entity-card-wrapper", {
      "grid-item": renderAs === "grid-item",
      "list-item": renderAs === "list-item"
    }, className),
    variant: renderAs === "grid-item" ? "paper-1" : "paper-2",
    $renderAs: renderAs
  }, renderAs === "list-item" ? renderAsListItem(properties) : null, renderAs === "grid-item" ? renderAsGridItem(properties) : null);
});
EntityCard.displayName = "EntityCard";
//# sourceMappingURL=EntityCard.js.map