@bootstrap-styled/ra-ui/lib/components/field/ImageField.js

UI components for react-admin

"use strict";

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

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

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

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

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

var _propTypes = _interopRequireDefault(require("prop-types"));

var _get = _interopRequireDefault(require("lodash/get"));

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

var _Ul = _interopRequireDefault(require("@bootstrap-styled/v4/lib/Ul"));

var _Li = _interopRequireDefault(require("@bootstrap-styled/v4/lib/Li"));

var _Img = _interopRequireDefault(require("@bootstrap-styled/v4/lib/Img"));

var _sanitizeRestProps = _interopRequireDefault(require("./sanitizeRestProps"));

var ImageField = function ImageField(_ref) {
  var className = _ref.className,
      record = _ref.record,
      source = _ref.source,
      src = _ref.src,
      title = _ref.title,
      rest = (0, _objectWithoutProperties2.default)(_ref, ["className", "record", "source", "src", "title"]);
  var sourceValue = (0, _get.default)(record, source);

  if (!sourceValue) {
    return _react.default.createElement("div", (0, _extends2.default)({
      className: className
    }, (0, _sanitizeRestProps.default)(rest)));
  }

  if (Array.isArray(sourceValue)) {
    return _react.default.createElement(_Ul.default, (0, _extends2.default)({
      className: (0, _classnames.default)('d-flex', className)
    }, (0, _sanitizeRestProps.default)(rest)), sourceValue.map(function (file, index) {
      var titleValue = (0, _get.default)(file, title) || title;
      var srcValue = (0, _get.default)(file, src) || title;
      return _react.default.createElement(_Li.default, {
        key: index
      }, _react.default.createElement(_Img.default, {
        alt: titleValue,
        title: titleValue,
        src: srcValue,
        className: "m-1"
      }));
    }));
  }

  var titleValue = (0, _get.default)(record, title) || title;
  return _react.default.createElement("div", (0, _extends2.default)({
    className: className
  }, (0, _sanitizeRestProps.default)(rest)), _react.default.createElement(_Img.default, {
    title: titleValue,
    alt: titleValue,
    src: sourceValue,
    className: "m-1"
  }));
};

exports.ImageField = ImageField;
ImageField.propTypes = {
  addLabel: _propTypes.default.bool,
  basePath: _propTypes.default.string,
  className: _propTypes.default.string,
  cellClassName: _propTypes.default.string,
  headerClassName: _propTypes.default.string,
  record: _propTypes.default.object,
  sortBy: _propTypes.default.string,
  source: _propTypes.default.string.isRequired,
  src: _propTypes.default.string,
  title: _propTypes.default.string
};
ImageField.displayName = 'ImageField';
var _default = ImageField;
exports.default = _default;