@grafana/ui/dist/cjs/components/Table/TableNG/Cells/ImageCell.cjs

Grafana Components Library

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var jsxRuntime = require('react/jsx-runtime');
var css = require('@emotion/css');
var React = require('react');
require('../../types.cjs');
var MaybeWrapWithLink = require('../components/MaybeWrapWithLink.cjs');
var schema = require('@grafana/schema');

"use strict";
const ImageCell = ({ cellOptions, field, value, rowIdx }) => {
  const [error, setError] = React.useState(false);
  const { text } = field.display(value);
  const { alt, title } = cellOptions.type === schema.TableCellDisplayMode.Image ? cellOptions : { alt: void 0, title: void 0 };
  if (!text) {
    return null;
  }
  return /* @__PURE__ */ jsxRuntime.jsx(MaybeWrapWithLink.MaybeWrapWithLink, { field, rowIdx, children: error ? text : /* @__PURE__ */ jsxRuntime.jsx("img", { alt, src: text, title, onError: () => setError(true) }) });
};
const styles = css.css({
  "&, a, img": {
    width: "100%",
    height: "100%"
  },
  img: {
    objectFit: "contain"
  }
});
const getStyles = () => styles;

exports.ImageCell = ImageCell;
exports.getStyles = getStyles;
//# sourceMappingURL=ImageCell.cjs.map