the-platform/Img.js

React Hooks and Suspense-ready Components for Web API's and elements

"use strict";

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

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

var _createResource = require("./createResource");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var hashingFn = function hashingFn(_ref) {
  var src = _ref.src,
      srcSet = _ref.srcSet;
  return "".concat(src).concat(srcSet);
};

var ImgResource = (0, _createResource.createResource)(function (_ref2) {
  var src = _ref2.src,
      srcSet = _ref2.srcSet;
  return new Promise(function (resolve, reject) {
    var image = new Image();
    image.src = src;

    if (srcSet) {
      image.srcset = srcSet;
    }

    image.onload = resolve;
    image.onerror = reject;
  });
}, hashingFn);
exports.ImgResource = ImgResource;

var Img = function Img(props) {
  var src = props.src,
      srcSet = props.srcSet;

  if (src) {
    ImgResource.read({
      src: src,
      srcSet: srcSet
    });
  }

  return _react.default.createElement("img", props);
};

exports.Img = Img;