render-smooth-image-react/build/index.js

A React Component to render images smoothly.

"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports["default"]=void 0;var _react=_interopRequireDefault(require("react")),_propTypes=_interopRequireDefault(require("prop-types"));function _interopRequireDefault(a){return a&&a.__esModule?a:{default:a}}function _typeof(a){"@babel/helpers - typeof";return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(a){return typeof a}:function(a){return a&&"function"==typeof Symbol&&a.constructor===Symbol&&a!==Symbol.prototype?"symbol":typeof a},_typeof(a)}function _extends(){return _extends=Object.assign||function(a){for(var b,c=1;c<arguments.length;c++)for(var d in b=arguments[c],b)Object.prototype.hasOwnProperty.call(b,d)&&(a[d]=b[d]);return a},_extends.apply(this,arguments)}function _classCallCheck(a,b){if(!(a instanceof b))throw new TypeError("Cannot call a class as a function")}function _defineProperties(a,b){for(var c,d=0;d<b.length;d++)c=b[d],c.enumerable=c.enumerable||!1,c.configurable=!0,"value"in c&&(c.writable=!0),Object.defineProperty(a,c.key,c)}function _createClass(a,b,c){return b&&_defineProperties(a.prototype,b),c&&_defineProperties(a,c),a}function _inherits(a,b){if("function"!=typeof b&&null!==b)throw new TypeError("Super expression must either be null or a function");a.prototype=Object.create(b&&b.prototype,{constructor:{value:a,writable:!0,configurable:!0}}),b&&_setPrototypeOf(a,b)}function _setPrototypeOf(a,b){return _setPrototypeOf=Object.setPrototypeOf||function(a,b){return a.__proto__=b,a},_setPrototypeOf(a,b)}function _createSuper(a){var b=_isNativeReflectConstruct();return function(){var c,d=_getPrototypeOf(a);if(b){var e=_getPrototypeOf(this).constructor;c=Reflect.construct(d,arguments,e)}else c=d.apply(this,arguments);return _possibleConstructorReturn(this,c)}}function _possibleConstructorReturn(a,b){return b&&("object"===_typeof(b)||"function"==typeof b)?b:_assertThisInitialized(a)}function _assertThisInitialized(a){if(void 0===a)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return a}function _isNativeReflectConstruct(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Date.prototype.toString.call(Reflect.construct(Date,[],function(){})),!0}catch(a){return!1}}function _getPrototypeOf(a){return _getPrototypeOf=Object.setPrototypeOf?Object.getPrototypeOf:function(a){return a.__proto__||Object.getPrototypeOf(a)},_getPrototypeOf(a)}// TODO: For immediate use-case in a heavily dependant project, used e.persist()
// This doesn't do anything in React v17 above
// Migrate to use hooks - r=that will be v2.0.0 major release
var RenderSmoothImage=/*#__PURE__*/function(a){function b(a){var d;return _classCallCheck(this,b),d=c.call(this,a),d.state={imageLoaded:!1,isValidSrc:!!a.src},d.showImage=function(){var b=0<arguments.length&&void 0!==arguments[0]?arguments[0]:null;null!==b&&b.persist(),d.setState({imageLoaded:!0},function(){return null!==b&&"function"==typeof a.onLoad&&a.onLoad(b)})},d.handleError=function(){var b=0<arguments.length&&void 0!==arguments[0]?arguments[0]:null;null!==b&&b.persist(),d.setState({isValidSrc:!1},function(){return null!==b&&"function"==typeof a.onError&&a.onError(b)})},d.imageRef=_react["default"].createRef(),d}_inherits(b,a);var c=_createSuper(b);return _createClass(b,[{key:"componentDidMount",value:function componentDidMount(){this.state.isValidSrc&&(new Image().src=this.props.src),!!this.imageRef.current&&this.imageRef.current.complete&&this.showImage()}},{key:"render",value:function render(){var a=this.state,b=a.imageLoaded,c=a.isValidSrc,d=this.props,e=d.src,f=d.alt,g=d.objectFit,h=d.imageProps,i=d.wrapperProps;return/*#__PURE__*/_react["default"].createElement("div",_extends({className:"smooth-image-wrapper"},i),c?/*#__PURE__*/_react["default"].createElement("img",_extends({ref:this.imageRef,className:"smooth-image img-".concat(b?"visible":"hidden"),style:{objectFit:g},src:e,alt:f,onLoad:this.showImage,onError:this.handleError},h)):/*#__PURE__*/_react["default"].createElement("div",{className:"smooth-no-image"},f),c&&!b&&/*#__PURE__*/_react["default"].createElement("div",{className:"smooth-preloader"},/*#__PURE__*/_react["default"].createElement("span",{className:"loader"})))}}]),b}(_react["default"].Component);exports["default"]=RenderSmoothImage,RenderSmoothImage.propTypes={src:_propTypes["default"].string.isRequired,alt:_propTypes["default"].string,objectFit:_propTypes["default"].oneOf(["contain","fill","cover","none","scale-down"]),onLoad:_propTypes["default"].func,onError:_propTypes["default"].func,wrapperProps:_propTypes["default"].shape({}),imageProps:_propTypes["default"].shape({})},RenderSmoothImage.defaultProps={alt:"not found",objectFit:"contain",onLoad:function onLoad(){return null},onError:function onError(){return null},wrapperProps:{},imageProps:{}};