gatsby-plugin-image
Version:
Adding responsive images to your site while maintaining high performance scores can be difficult to do manually. The Gatsby Image plugin handles the hard parts of producing images in multiple sizes and formats for you!
3 lines (2 loc) • 3.44 kB
JavaScript
var e=require("./index.browser-395cc902.js"),t=require("react"),r=require("react-dom/server");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function o(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach(function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}}),t.default=e,t}require("camelcase"),require("prop-types");var i,a=/*#__PURE__*/n(t),c=new WeakMap,u=navigator.connection||navigator.mozConnection||navigator.webkitConnection,l=["image","loading","isLoading","isLoaded","imgClassName","imgStyle","objectPosition","backgroundColor","objectFit"];function s(e,t){e.style.opacity="1",t&&(t.style.opacity="0")}function d(e,t,r,n,o,i){var a=e.querySelector("[data-main-image]"),c=e.querySelector("[data-placeholder-image]"),u=r.has(t);function l(e){var t=this;this.removeEventListener("load",l);var r=e.currentTarget,n=new Image;n.src=r.currentSrc,n.decode?n.decode().then(function(){s(t,c),null==o||o({wasCached:u})}).catch(function(e){s(t,c),null==i||i(e)}):(s(this,c),null==o||o({wasCached:u}))}return a.addEventListener("load",l),null==n||n({wasCached:u}),Array.from(a.parentElement.children).forEach(function(e){var t=e.getAttribute("data-src"),r=e.getAttribute("data-srcset");t&&(e.removeAttribute("data-src"),e.setAttribute("src",t)),r&&(e.removeAttribute("data-srcset"),e.setAttribute("srcset",r))}),r.add(t),a.complete&&l.call(a,{currentTarget:a}),function(){a&&a.removeEventListener("load",l)}}exports.renderImageToString=function(t){var n=t.image,o=t.loading,i=void 0===o?"lazy":o,c=t.isLoading,u=t.isLoaded,s=t.imgClassName,d=t.imgStyle,f=void 0===d?{}:d,g=t.objectPosition,v=t.backgroundColor,m=t.objectFit,b=void 0===m?"cover":m,h=e._objectWithoutPropertiesLoose(t,l),p=n.width,y=n.height,j=n.layout,P=n.images,w=n.placeholder,C=n.backgroundColor;return f=e._extends({objectFit:b,objectPosition:g,backgroundColor:v},f),r.renderToStaticMarkup(a.default.createElement(e.LayoutWrapper,{layout:j,width:p,height:y},a.default.createElement(e.Placeholder,e._extends({},e.getPlaceholderProps(w,u,j,p,y,C,b,g))),a.default.createElement(e.MainImage,e._extends({},h,{width:p,height:y,className:s},e.getMainProps(c,u,P,i,f)))))},exports.swapPlaceholderImage=function(t,r,n,a,l,s,f){if(!e.hasNativeLazyLoadSupport()){var g,v,m,b=(p=function(){g=d(t,r,n,l,s,f)},"IntersectionObserver"in window?(i||(i=new IntersectionObserver(function(e){e.forEach(function(e){var t;e.isIntersecting&&(null==(t=c.get(e.target))||t(),c.delete(e.target))})},{rootMargin:"4g"!==(null==u?void 0:u.effectiveType)||null!=u&&u.saveData?"2500px":"1250px"})),function(e){return c.set(e,p),i.observe(e),function(){i&&e&&(c.delete(e),i.unobserve(e))}}):function(){return p(),function(){}}),h=b(t);return"objectFit"in document.documentElement.style||(t.dataset.objectFit=null!=(v=a.objectFit)?v:"cover",t.dataset.objectPosition=""+(null!=(m=a.objectPosition)?m:"50% 50%"),function(e){try{var t=function(){window.objectFitPolyfill(e)},r=function(){if(!("objectFitPolyfill"in window))return Promise.resolve(Promise.resolve().then(function(){/*#__PURE__*/return o(require("objectFitPolyfill"))})).then(function(){})}();return Promise.resolve(r&&r.then?r.then(t):t())}catch(e){return Promise.reject(e)}}(t)),function(){g&&g(),h()}}var p;return d(t,r,n,l,s,f)};
//# sourceMappingURL=lazy-hydrate-6ff2d17c.js.map