gatsby-plugin-image 2.14.0-next.3 → 2.14.0

package/dist/components/layout-wrapper.js

@@ -1,6 +1,4 @@
 "use strict";
-// eslint-disable-next-line @typescript-eslint/triple-slash-reference
-/// <reference path="../global.d.ts" />
 var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
     if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
     return cooked;
@@ -61,7 +59,7 @@ var NativeScriptLoading = function () { return (react_1["default"].createElement
         __html: (0, terser_macro_1["default"])(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\nconst hasNativeLazyLoadSupport = typeof HTMLImageElement !== \"undefined\" && \"loading\" in HTMLImageElement.prototype;\nif (hasNativeLazyLoadSupport) {\n  const gatsbyImages = document.querySelectorAll('img[data-main-image]');\n  for (let mainImage of gatsbyImages) {\n    if (mainImage.dataset.src) {\n      mainImage.setAttribute('src', mainImage.dataset.src)\n      mainImage.removeAttribute('data-src')\n    }\n    if (mainImage.dataset.srcset) {\n      mainImage.setAttribute('srcset', mainImage.dataset.srcset)\n      mainImage.removeAttribute('data-srcset')\n    }\n\n    const sources = mainImage.parentNode.querySelectorAll('source[data-srcset]');\n    for (let source of sources) {\n      source.setAttribute('srcset', source.dataset.srcset)\n      source.removeAttribute('data-srcset')\n    }\n\n    if (mainImage.complete) {\n      mainImage.style.opacity = 1;\n    }\n  }\n}\n"], ["\nconst hasNativeLazyLoadSupport = typeof HTMLImageElement !== \"undefined\" && \"loading\" in HTMLImageElement.prototype;\nif (hasNativeLazyLoadSupport) {\n  const gatsbyImages = document.querySelectorAll('img[data-main-image]');\n  for (let mainImage of gatsbyImages) {\n    if (mainImage.dataset.src) {\n      mainImage.setAttribute('src', mainImage.dataset.src)\n      mainImage.removeAttribute('data-src')\n    }\n    if (mainImage.dataset.srcset) {\n      mainImage.setAttribute('srcset', mainImage.dataset.srcset)\n      mainImage.removeAttribute('data-srcset')\n    }\n\n    const sources = mainImage.parentNode.querySelectorAll('source[data-srcset]');\n    for (let source of sources) {\n      source.setAttribute('srcset', source.dataset.srcset)\n      source.removeAttribute('data-srcset')\n    }\n\n    if (mainImage.complete) {\n      mainImage.style.opacity = 1;\n    }\n  }\n}\n"])))
     } })); };
 function getSizer(layout, width, height) {
-    var sizer = null;
+    var sizer = "";
     if (layout === "fullWidth") {
         sizer = "<div aria-hidden=\"true\" style=\"padding-top: ".concat((height / width) * 100, "%;\"></div>");
     }
@@ -91,8 +89,7 @@ var LayoutWrapper = function LayoutWrapper(_a) {
     return (react_1["default"].createElement(react_1.Fragment, null,
         react_1["default"].createElement(Sizer, __assign({}, props)),
         children,
-        // eslint-disable-next-line no-undef
-        SERVER && react_1["default"].createElement(NativeScriptLoading, null)));
+        SERVER ? react_1["default"].createElement(NativeScriptLoading, null) : null));
 };
 exports.LayoutWrapper = LayoutWrapper;
 var templateObject_1;

package/dist/components/lazy-hydrate.js

@@ -10,6 +10,65 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -25,55 +84,135 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 exports.__esModule = true;
-exports.lazyHydrate = void 0;
-/* global HAS_REACT_18 */
+exports.renderImageToString = exports.swapPlaceholderImage = void 0;
 var react_1 = __importDefault(require("react"));
+var server_1 = require("react-dom/server");
 var layout_wrapper_1 = require("./layout-wrapper");
 var placeholder_1 = require("./placeholder");
 var main_image_1 = require("./main-image");
 var hooks_1 = require("./hooks");
-var reactRender;
-var reactHydrate;
-if (HAS_REACT_18) {
-    var reactDomClient_1 = require("react-dom/client");
-    reactRender = function (Component, el, root) {
-        if (!root) {
-            root = reactDomClient_1.createRoot(el);
-        }
-        root.render(Component);
-        return root;
-    };
-    reactHydrate = function (Component, el) { return reactDomClient_1.hydrateRoot(el, Component); };
+var intersection_observer_1 = require("./intersection-observer");
+function applyPolyfill(element) {
+    return __awaiter(this, void 0, void 0, function () {
+        return __generator(this, function (_a) {
+            switch (_a.label) {
+                case 0:
+                    if (!!("objectFitPolyfill" in window)) return [3 /*break*/, 2];
+                    return [4 /*yield*/, Promise.resolve().then(function () { return __importStar(require(
+                        // @ts-ignore typescript can't find the module for some reason ¯\_(ツ)_/¯
+                        /* webpackChunkName: "gatsby-plugin-image-objectfit-polyfill" */ "objectFitPolyfill")); })];
+                case 1:
+                    _a.sent();
+                    _a.label = 2;
+                case 2:
+                    ;
+                    window.objectFitPolyfill(element);
+                    return [2 /*return*/];
+            }
+        });
+    });
 }
-else {
-    var reactDomClient_2 = require("react-dom");
-    reactRender = function (Component, el) {
-        reactDomClient_2.render(Component, el);
-    };
-    reactHydrate = reactDomClient_2.hydrate;
+function toggleLoaded(mainImage, placeholderImage) {
+    mainImage.style.opacity = "1";
+    if (placeholderImage) {
+        placeholderImage.style.opacity = "0";
+    }
 }
-function lazyHydrate(_a, root, hydrated, forceHydrate, reactRootRef) {
-    var image = _a.image, loading = _a.loading, isLoading = _a.isLoading, isLoaded = _a.isLoaded, toggleIsLoaded = _a.toggleIsLoaded, ref = _a.ref, imgClassName = _a.imgClassName, _b = _a.imgStyle, imgStyle = _b === void 0 ? {} : _b, objectPosition = _a.objectPosition, backgroundColor = _a.backgroundColor, _c = _a.objectFit, objectFit = _c === void 0 ? "cover" : _c, props = __rest(_a, ["image", "loading", "isLoading", "isLoaded", "toggleIsLoaded", "ref", "imgClassName", "imgStyle", "objectPosition", "backgroundColor", "objectFit"]);
-    var width = image.width, height = image.height, layout = image.layout, images = image.images, placeholder = image.placeholder, wrapperBackgroundColor = image.backgroundColor;
-    var cacheKey = JSON.stringify(images);
-    imgStyle = __assign({ objectFit: objectFit, objectPosition: objectPosition, backgroundColor: backgroundColor }, imgStyle);
-    var component = (react_1["default"].createElement(layout_wrapper_1.LayoutWrapper, { layout: layout, width: width, height: height },
-        react_1["default"].createElement(placeholder_1.Placeholder, __assign({}, (0, hooks_1.getPlaceholderProps)(placeholder, isLoaded, layout, width, height, wrapperBackgroundColor, objectFit, objectPosition))),
-        react_1["default"].createElement(main_image_1.MainImage, __assign({}, props, { width: width, height: height, className: imgClassName }, (0, hooks_1.getMainProps)(isLoading, isLoaded, images, loading, toggleIsLoaded, cacheKey, ref, imgStyle)))));
-    if (root.current) {
-        // Force render to mitigate "Expected server HTML to contain a matching" in develop
-        if (hydrated.current || forceHydrate.current || HAS_REACT_18) {
-            reactRootRef.current = reactRender(component, root.current, reactRootRef.current);
+function startLoading(element, cacheKey, imageCache, onStartLoad, onLoad, onError) {
+    var mainImage = element.querySelector("[data-main-image]");
+    var placeholderImage = element.querySelector("[data-placeholder-image]");
+    var isCached = imageCache.has(cacheKey);
+    function onImageLoaded(e) {
+        var _this = this;
+        // eslint-disable-next-line @babel/no-invalid-this
+        this.removeEventListener("load", onImageLoaded);
+        var target = e.currentTarget;
+        var img = new Image();
+        img.src = target.currentSrc;
+        if (img.decode) {
+            // Decode the image through javascript to support our transition
+            img
+                .decode()
+                .then(function () {
+                // eslint-disable-next-line @babel/no-invalid-this
+                toggleLoaded(_this, placeholderImage);
+                onLoad === null || onLoad === void 0 ? void 0 : onLoad({
+                    wasCached: isCached
+                });
+            })["catch"](function (e) {
+                // eslint-disable-next-line @babel/no-invalid-this
+                toggleLoaded(_this, placeholderImage);
+                onError === null || onError === void 0 ? void 0 : onError(e);
+            });
         }
         else {
-            reactHydrate(component, root.current);
+            // eslint-disable-next-line @babel/no-invalid-this
+            toggleLoaded(this, placeholderImage);
+            onLoad === null || onLoad === void 0 ? void 0 : onLoad({
+                wasCached: isCached
+            });
+        }
+    }
+    mainImage.addEventListener("load", onImageLoaded);
+    onStartLoad === null || onStartLoad === void 0 ? void 0 : onStartLoad({
+        wasCached: isCached
+    });
+    Array.from(mainImage.parentElement.children).forEach(function (child) {
+        var src = child.getAttribute("data-src");
+        var srcSet = child.getAttribute("data-srcset");
+        if (src) {
+            child.removeAttribute("data-src");
+            child.setAttribute("src", src);
         }
-        hydrated.current = true;
+        if (srcSet) {
+            child.removeAttribute("data-srcset");
+            child.setAttribute("srcset", srcSet);
+        }
+    });
+    imageCache.add(cacheKey);
+    // Load times not always fires - mostly when it's a 304
+    // We check if the image is already completed and if so we trigger onload.
+    if (mainImage.complete) {
+        onImageLoaded.call(mainImage, {
+            currentTarget: mainImage
+        });
     }
     return function () {
-        if (root.current) {
-            reactRender(null, root.current, reactRootRef.current);
+        if (mainImage) {
+            mainImage.removeEventListener("load", onImageLoaded);
         }
     };
 }
-exports.lazyHydrate = lazyHydrate;
+function swapPlaceholderImage(element, cacheKey, imageCache, style, onStartLoad, onLoad, onError) {
+    var _a, _b;
+    if (!(0, hooks_1.hasNativeLazyLoadSupport)()) {
+        var cleanup_1;
+        var io = (0, intersection_observer_1.createIntersectionObserver)(function () {
+            cleanup_1 = startLoading(element, cacheKey, imageCache, onStartLoad, onLoad, onError);
+        });
+        var unobserve_1 = io(element);
+        // Polyfill "object-fit" if unsupported (mostly IE)
+        if (!("objectFit" in document.documentElement.style)) {
+            element.dataset.objectFit = (_a = style.objectFit) !== null && _a !== void 0 ? _a : "cover";
+            element.dataset.objectPosition = "".concat((_b = style.objectPosition) !== null && _b !== void 0 ? _b : "50% 50%");
+            applyPolyfill(element);
+        }
+        return function () {
+            if (cleanup_1) {
+                cleanup_1();
+            }
+            unobserve_1();
+        };
+    }
+    return startLoading(element, cacheKey, imageCache, onStartLoad, onLoad, onError);
+}
+exports.swapPlaceholderImage = swapPlaceholderImage;
+function renderImageToString(_a) {
+    var image = _a.image, _b = _a.loading, loading = _b === void 0 ? "lazy" : _b, isLoading = _a.isLoading, isLoaded = _a.isLoaded, imgClassName = _a.imgClassName, _c = _a.imgStyle, imgStyle = _c === void 0 ? {} : _c, objectPosition = _a.objectPosition, backgroundColor = _a.backgroundColor, _d = _a.objectFit, objectFit = _d === void 0 ? "cover" : _d, props = __rest(_a, ["image", "loading", "isLoading", "isLoaded", "imgClassName", "imgStyle", "objectPosition", "backgroundColor", "objectFit"]);
+    var width = image.width, height = image.height, layout = image.layout, images = image.images, placeholder = image.placeholder, wrapperBackgroundColor = image.backgroundColor;
+    imgStyle = __assign({ objectFit: objectFit, objectPosition: objectPosition, backgroundColor: backgroundColor }, imgStyle);
+    return (0, server_1.renderToStaticMarkup)(react_1["default"].createElement(layout_wrapper_1.LayoutWrapper, { layout: layout, width: width, height: height },
+        react_1["default"].createElement(placeholder_1.Placeholder, __assign({}, (0, hooks_1.getPlaceholderProps)(placeholder, isLoaded, layout, width, height, wrapperBackgroundColor, objectFit, objectPosition))),
+        react_1["default"].createElement(main_image_1.MainImage, __assign({}, props, { width: width, height: height, className: imgClassName }, (0, hooks_1.getMainProps)(isLoading, isLoaded, images, loading, imgStyle)))));
+}
+exports.renderImageToString = renderImageToString;

package/dist/components/main-image.js

@@ -10,38 +10,19 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 exports.__esModule = true;
 exports.MainImage = void 0;
-var react_1 = __importStar(require("react"));
+var react_1 = __importDefault(require("react"));
 var picture_1 = require("./picture");
-exports.MainImage = (0, react_1.forwardRef)(function MainImage(props, ref) {
+var MainImage = function MainImage(props) {
     return (react_1["default"].createElement(react_1["default"].Fragment, null,
-        react_1["default"].createElement(picture_1.Picture, __assign({ ref: ref }, props)),
+        react_1["default"].createElement(picture_1.Picture, __assign({}, props)),
         react_1["default"].createElement("noscript", null,
             react_1["default"].createElement(picture_1.Picture, __assign({}, props, { shouldLoad: true })))));
-});
+};
+exports.MainImage = MainImage;
 exports.MainImage.displayName = "MainImage";
 exports.MainImage.propTypes = picture_1.Picture.propTypes;

package/dist/components/picture.js

@@ -44,19 +44,21 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 exports.__esModule = true;
 exports.Picture = void 0;
-/* eslint-disable filenames/match-regex */
-var react_1 = __importStar(require("react"));
+var react_1 = __importDefault(require("react"));
 var PropTypes = __importStar(require("prop-types"));
 var Image = function Image(_a) {
-    var src = _a.src, srcSet = _a.srcSet, loading = _a.loading, _b = _a.alt, alt = _b === void 0 ? "" : _b, shouldLoad = _a.shouldLoad, innerRef = _a.innerRef, props = __rest(_a, ["src", "srcSet", "loading", "alt", "shouldLoad", "innerRef"]);
-    return (react_1["default"].createElement("img", __assign({}, props, { decoding: "async", loading: loading, src: shouldLoad ? src : undefined, "data-src": !shouldLoad ? src : undefined, srcSet: shouldLoad ? srcSet : undefined, "data-srcset": !shouldLoad ? srcSet : undefined, alt: alt, ref: innerRef })));
+    var src = _a.src, srcSet = _a.srcSet, loading = _a.loading, _b = _a.alt, alt = _b === void 0 ? "" : _b, shouldLoad = _a.shouldLoad, props = __rest(_a, ["src", "srcSet", "loading", "alt", "shouldLoad"]);
+    return (react_1["default"].createElement("img", __assign({}, props, { decoding: "async", loading: loading, src: shouldLoad ? src : undefined, "data-src": !shouldLoad ? src : undefined, srcSet: shouldLoad ? srcSet : undefined, "data-srcset": !shouldLoad ? srcSet : undefined, alt: alt })));
 };
-exports.Picture = (0, react_1.forwardRef)(function Picture(_a, ref) {
+var Picture = function Picture(_a) {
     var fallback = _a.fallback, _b = _a.sources, sources = _b === void 0 ? [] : _b, _c = _a.shouldLoad, shouldLoad = _c === void 0 ? true : _c, props = __rest(_a, ["fallback", "sources", "shouldLoad"]);
     var sizes = props.sizes || (fallback === null || fallback === void 0 ? void 0 : fallback.sizes);
-    var fallbackImage = (react_1["default"].createElement(Image, __assign({}, props, fallback, { sizes: sizes, shouldLoad: shouldLoad, innerRef: ref })));
+    var fallbackImage = (react_1["default"].createElement(Image, __assign({}, props, fallback, { sizes: sizes, shouldLoad: shouldLoad })));
     if (!sources.length) {
         return fallbackImage;
     }
@@ -66,7 +68,8 @@ exports.Picture = (0, react_1.forwardRef)(function Picture(_a, ref) {
             return (react_1["default"].createElement("source", { key: "".concat(media, "-").concat(type, "-").concat(srcSet), type: type, media: media, srcSet: shouldLoad ? srcSet : undefined, "data-srcset": !shouldLoad ? srcSet : undefined, sizes: sizes }));
         }),
         fallbackImage));
-});
+};
+exports.Picture = Picture;
 Image.propTypes = {
     src: PropTypes.string.isRequired,
     alt: PropTypes.string.isRequired,

package/dist/gatsby-image.browser.js

@@ -1,2 +1,2 @@
-var e=require("./index.browser-53efc75d.js");require("react"),require("common-tags"),require("camelcase"),require("prop-types"),exports.GatsbyImage=e.GatsbyImage,exports.LaterHydrator=e.LaterHydrator,exports.MainImage=e.MainImage,exports.Placeholder=e.Placeholder,exports.StaticImage=e.StaticImage,exports.generateImageData=e.generateImageData,exports.getImage=e.getImage,exports.getImageData=e.getImageData,exports.getLowResolutionImageURL=e.getLowResolutionImageURL,exports.getSrc=e.getSrc,exports.getSrcSet=e.getSrcSet,exports.withArtDirection=e.withArtDirection;
+var e=require("./index.browser-bd6b0c0c.js");require("react"),require("camelcase"),require("prop-types"),exports.GatsbyImage=e.GatsbyImage,exports.MainImage=e.MainImage,exports.Placeholder=e.Placeholder,exports.StaticImage=e.StaticImage,exports.generateImageData=e.generateImageData,exports.getImage=e.getImage,exports.getImageData=e.getImageData,exports.getLowResolutionImageURL=e.getLowResolutionImageURL,exports.getSrc=e.getSrc,exports.getSrcSet=e.getSrcSet,exports.withArtDirection=e.withArtDirection;
 //# sourceMappingURL=gatsby-image.browser.js.map

package/dist/gatsby-image.browser.modern.js

@@ -1,2 +1,2 @@
-export{G as GatsbyImage,c as LaterHydrator,M as MainImage,P as Placeholder,S as StaticImage,i as generateImageData,d as getImage,h as getImageData,j as getLowResolutionImageURL,e as getSrc,f as getSrcSet,w as withArtDirection}from"./index.browser-80ad8918.js";import"react";import"common-tags";import"camelcase";import"prop-types";
+export{G as GatsbyImage,M as MainImage,P as Placeholder,S as StaticImage,i as generateImageData,c as getImage,f as getImageData,j as getLowResolutionImageURL,d as getSrc,e as getSrcSet,w as withArtDirection}from"./index.browser-cdba1a30.js";import"react";import"camelcase";import"prop-types";
 //# sourceMappingURL=gatsby-image.browser.modern.js.map

package/dist/gatsby-image.js

@@ -1,2 +1,2 @@
-var e=require("react"),t=require("common-tags"),a=require("camelcase"),r=require("prop-types");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function n(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach(function(a){if("default"!==a){var r=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(t,a,r.get?r:{enumerable:!0,get:function(){return e[a]}})}}),t.default=e,t}var o,s=i(e),l=i(a),u=n(r),d=i(r);function c(){return c=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var r in a)Object.prototype.hasOwnProperty.call(a,r)&&(e[r]=a[r])}return e},c.apply(this,arguments)}function h(e,t){if(null==e)return{};var a,r,i={},n=Object.keys(e);for(r=0;r<n.length;r++)t.indexOf(a=n[r])>=0||(i[a]=e[a]);return i}var g=[.25,.5,1,2],f=[750,1080,1366,1920],p=[320,654,768,1024,1366,1600,1920,2048,2560,3440,3840,4096],m=function(e){return console.warn(e)},v=function(e,t){return e-t},w=function(e){return e.map(function(e){return e.src+" "+e.width+"w"}).join(",\n")};function y(e){var t=e.lastIndexOf(".");if(-1!==t){var a=e.slice(t+1);if("jpeg"===a)return"jpg";if(3===a.length||4===a.length)return a}}function b(e){var t=e.layout,a=void 0===t?"constrained":t,r=e.width,i=e.height,n=e.sourceMetadata,o=e.breakpoints,s=e.aspectRatio,u=e.formats,d=void 0===u?["auto","webp"]:u;return d=d.map(function(e){return e.toLowerCase()}),a=l.default(a),r&&i?c({},e,{formats:d,layout:a,aspectRatio:r/i}):(n.width&&n.height&&!s&&(s=n.width/n.height),"fullWidth"===a?(r=r||n.width||o[o.length-1],i=i||Math.round(r/(s||1.3333333333333333))):(r||(r=i&&s?i*s:n.width?n.width:i?Math.round(i/1.3333333333333333):800),s&&!i?i=Math.round(r/s):s||(s=r/i)),c({},e,{width:r,height:i,aspectRatio:s,layout:a,formats:d}))}function E(e){var a,r=(e=b(e)).pluginName,i=e.sourceMetadata,n=e.generateImageSource,s=e.layout,l=e.fit,u=e.options,d=e.width,h=e.height,p=e.filename,v=e.reporter,E=void 0===v?{warn:m}:v,x=e.backgroundColor,I=e.placeholderURL;if(r||E.warn('[gatsby-plugin-image] "generateImageData" was not passed a plugin name'),"function"!=typeof n)throw new Error("generateImageSource must be a function");i&&(i.width||i.height)?i.format||(i.format=y(p)):i={width:d,height:h,format:(null==(a=i)?void 0:a.format)||y(p)||"auto"};var R=new Set(e.formats);(0===R.size||R.has("auto")||R.has(""))&&(R.delete("auto"),R.delete(""),R.add(i.format)),R.has("jpg")&&R.has("png")&&(E.warn("["+r+"] Specifying both 'jpg' and 'png' formats is not supported. Using 'auto' instead"),R.delete("jpg"===i.format?"png":"jpg"));var j=function(e){var a=e.filename,r=e.layout,i=void 0===r?"constrained":r,n=e.sourceMetadata,s=e.reporter,l=void 0===s?{warn:m}:s,u=e.breakpoints,d=void 0===u?f:u,h=Object.entries({width:e.width,height:e.height}).filter(function(e){var t=e[1];return"number"==typeof t&&t<1});if(h.length)throw new Error("Specified dimensions for images must be positive numbers (> 0). Problem dimensions you have are "+h.map(function(e){return e.join(": ")}).join(", "));return"fixed"===i?function(e){var a=e.filename,r=e.sourceMetadata,i=e.width,n=e.height,s=e.fit,l=void 0===s?"cover":s,u=e.outputPixelDensities,d=e.reporter,c=void 0===d?{warn:m}:d,h=r.width/r.height,f=k(void 0===u?g:u);if(i&&n){var p=M(r,{width:i,height:n,fit:l});i=p.width,n=p.height,h=p.aspectRatio}i?n||(n=Math.round(i/h)):i=n?Math.round(n*h):800;var v,w,y=i;if(r.width<i||r.height<n){var b=r.width<i?"width":"height";c.warn(t.stripIndent(o||(v=["\n    The requested ",' "','px" for the image '," was larger than the actual image "," of ","px. If possible, replace the current image with a larger one."],w||(w=v.slice(0)),v.raw=w,o=v),b,"width"===b?i:n,a,b,r[b])),"width"===b?(i=r.width,n=Math.round(i/h)):i=(n=r.height)*h}return{sizes:f.filter(function(e){return e>=1}).map(function(e){return Math.round(e*i)}).filter(function(e){return e<=r.width}),aspectRatio:h,presentationWidth:y,presentationHeight:Math.round(y/h),unscaledWidth:i}}(e):"constrained"===i?S(e):"fullWidth"===i?S(c({breakpoints:d},e)):(l.warn("No valid layout was provided for the image at "+a+". Valid image layouts are fixed, fullWidth, and constrained. Found "+i),{sizes:[n.width],presentationWidth:n.width,presentationHeight:n.height,aspectRatio:n.width/n.height,unscaledWidth:n.width})}(c({},e,{sourceMetadata:i})),N={sources:[]},W=e.sizes;W||(W=function(e,t){switch(t){case"constrained":return"(min-width: "+e+"px) "+e+"px, 100vw";case"fixed":return e+"px";case"fullWidth":return"100vw";default:return}}(j.presentationWidth,s)),R.forEach(function(e){var t=j.sizes.map(function(t){var a=n(p,t,Math.round(t/j.aspectRatio),e,l,u);if(null!=a&&a.width&&a.height&&a.src&&a.format)return a;E.warn("["+r+"] The resolver for image "+p+" returned an invalid value.")}).filter(Boolean);if("jpg"===e||"png"===e||"auto"===e){var a=t.find(function(e){return e.width===j.unscaledWidth})||t[0];a&&(N.fallback={src:a.src,srcSet:w(t),sizes:W})}else{var i;null==(i=N.sources)||i.push({srcSet:w(t),sizes:W,type:"image/"+e})}});var _={images:N,layout:s,backgroundColor:x};switch(I&&(_.placeholder={fallback:I}),s){case"fixed":_.width=j.presentationWidth,_.height=j.presentationHeight;break;case"fullWidth":_.width=1,_.height=1/j.aspectRatio;break;case"constrained":_.width=e.width||j.presentationWidth||1,_.height=(_.width||1)/j.aspectRatio}return _}var k=function(e){return Array.from(new Set([1].concat(e))).sort(v)};function S(e){var t,a=e.sourceMetadata,r=e.width,i=e.height,n=e.fit,o=void 0===n?"cover":n,s=e.outputPixelDensities,l=e.breakpoints,u=e.layout,d=a.width/a.height,c=k(void 0===s?g:s);if(r&&i){var h=M(a,{width:r,height:i,fit:o});r=h.width,i=h.height,d=h.aspectRatio}r=r&&Math.min(r,a.width),i=i&&Math.min(i,a.height),r||i||(i=(r=Math.min(800,a.width))/d),r||(r=i*d);var f=r;return(a.width<r||a.height<i)&&(r=a.width,i=a.height),r=Math.round(r),(null==l?void 0:l.length)>0?(t=l.filter(function(e){return e<=a.width})).length<l.length&&!t.includes(a.width)&&t.push(a.width):t=(t=c.map(function(e){return Math.round(e*r)})).filter(function(e){return e<=a.width}),"constrained"!==u||t.includes(r)||t.push(r),{sizes:t=t.sort(v),aspectRatio:d,presentationWidth:f,presentationHeight:Math.round(f/d),unscaledWidth:r}}function M(e,t){var a=e.width/e.height,r=t.width,i=t.height;switch(t.fit){case"fill":r=t.width?t.width:e.width,i=t.height?t.height:e.height;break;case"inside":var n=t.width?t.width:Number.MAX_SAFE_INTEGER,o=t.height?t.height:Number.MAX_SAFE_INTEGER;r=Math.min(n,Math.round(o*a)),i=Math.min(o,Math.round(n/a));break;case"outside":var s=t.width?t.width:0,l=t.height?t.height:0;r=Math.max(s,Math.round(l*a)),i=Math.max(l,Math.round(s/a));break;default:t.width&&!t.height&&(r=t.width,i=Math.round(t.width/a)),t.height&&!t.width&&(r=Math.round(t.height*a),i=t.height)}return{width:r,height:i,aspectRatio:r/i}}var x=["baseUrl","urlBuilder","sourceWidth","sourceHeight","pluginName","formats","breakpoints","options"],I=["images","placeholder"];function R(){return"undefined"!=typeof GATSBY___IMAGE&&GATSBY___IMAGE}new Set;var j,N=function(e){var t;return function(e){var t,a;return Boolean(null==e||null==(t=e.images)||null==(a=t.fallback)?void 0:a.src)}(e)?e:function(e){return Boolean(null==e?void 0:e.gatsbyImageData)}(e)?e.gatsbyImageData:null==e||null==(t=e.childImageSharp)?void 0:t.gatsbyImageData},W=["src","srcSet","loading","alt","shouldLoad","innerRef"],_=["fallback","sources","shouldLoad"],O=function(e){var t=e.src,a=e.srcSet,r=e.loading,i=e.alt,n=void 0===i?"":i,o=e.shouldLoad,l=e.innerRef,u=h(e,W);return s.default.createElement("img",c({},u,{decoding:"async",loading:r,src:o?t:void 0,"data-src":o?void 0:t,srcSet:o?a:void 0,"data-srcset":o?void 0:a,alt:n,ref:l}))},A=e.forwardRef(function(e,t){var a=e.fallback,r=e.sources,i=void 0===r?[]:r,n=e.shouldLoad,o=void 0===n||n,l=h(e,_),u=l.sizes||(null==a?void 0:a.sizes),d=s.default.createElement(O,c({},l,a,{sizes:u,shouldLoad:o,innerRef:t}));return i.length?s.default.createElement("picture",null,i.map(function(e){var t=e.media,a=e.srcSet,r=e.type;return s.default.createElement("source",{key:t+"-"+r+"-"+a,type:r,media:t,srcSet:o?a:void 0,"data-srcset":o?void 0:a,sizes:u})}),d):d});O.propTypes={src:u.string.isRequired,alt:u.string.isRequired,sizes:u.string,srcSet:u.string,shouldLoad:u.bool},A.displayName="Picture",A.propTypes={alt:u.string.isRequired,shouldLoad:u.bool,fallback:u.exact({src:u.string.isRequired,srcSet:u.string,sizes:u.string}),sources:u.arrayOf(u.oneOfType([u.exact({media:u.string.isRequired,type:u.string,sizes:u.string,srcSet:u.string.isRequired}),u.exact({media:u.string,type:u.string.isRequired,sizes:u.string,srcSet:u.string.isRequired})]))};var T=["fallback"],L=function(e){var t=e.fallback,a=h(e,T);return t?s.default.createElement(A,c({},a,{fallback:{src:t},"aria-hidden":!0,alt:""})):s.default.createElement("div",c({},a))};L.displayName="Placeholder",L.propTypes={fallback:u.string,sources:null==(j=A.propTypes)?void 0:j.sources,alt:function(e,t,a){return e[t]?new Error("Invalid prop `"+t+"` supplied to `"+a+"`. Validation failed."):null}};var q=e.forwardRef(function(e,t){return s.default.createElement(s.default.Fragment,null,s.default.createElement(A,c({ref:t},e)),s.default.createElement("noscript",null,s.default.createElement(A,c({},e,{shouldLoad:!0}))))});q.displayName="MainImage",q.propTypes=A.propTypes;var z=["children"],D=function(){return s.default.createElement("script",{type:"module",dangerouslySetInnerHTML:{__html:'const t="undefined"!=typeof HTMLImageElement&&"loading"in HTMLImageElement.prototype;if(t){const t=document.querySelectorAll("img[data-main-image]");for(let e of t){e.dataset.src&&(e.setAttribute("src",e.dataset.src),e.removeAttribute("data-src")),e.dataset.srcset&&(e.setAttribute("srcset",e.dataset.srcset),e.removeAttribute("data-srcset"));const t=e.parentNode.querySelectorAll("source[data-srcset]");for(let e of t)e.setAttribute("srcset",e.dataset.srcset),e.removeAttribute("data-srcset");e.complete&&(e.style.opacity=1)}}'}})},C=function(e){var t=e.layout,a=e.width,r=e.height;return"fullWidth"===t?s.default.createElement("div",{"aria-hidden":!0,style:{paddingTop:r/a*100+"%"}}):"constrained"===t?s.default.createElement("div",{style:{maxWidth:a,display:"block"}},s.default.createElement("img",{alt:"",role:"presentation","aria-hidden":"true",src:"data:image/svg+xml;charset=utf-8,%3Csvg height='"+r+"' width='"+a+"' xmlns='http://www.w3.org/2000/svg' version='1.1'%3E%3C/svg%3E",style:{maxWidth:"100%",display:"block",position:"static"}})):null},P=function(t){var a=t.children,r=h(t,z);return s.default.createElement(e.Fragment,null,s.default.createElement(C,c({},r)),a,s.default.createElement(D,null))},F=["as","children"],H=["as","className","class","style","image","loading","imgClassName","imgStyle","backgroundColor","objectFit","objectPosition"],G=["style","className"],B=function(e){return e.replace(/\n/g,"")},U=function(e){var t=e.as,a=void 0===t?"div":t,r=e.children,i=h(e,F);return s.default.createElement(a,c({},i),r)},V=function(e){var t=e.as,a=e.className,r=e.class,i=e.style,n=e.image,o=e.loading,l=void 0===o?"lazy":o,u=e.imgClassName,d=e.imgStyle,g=e.backgroundColor,f=e.objectFit,p=e.objectPosition,m=h(e,H);if(!n)return console.warn("[gatsby-plugin-image] Missing image prop"),null;r&&(a=r),d=c({objectFit:f,objectPosition:p,backgroundColor:g},d);var v=n.width,w=n.height,y=n.layout,b=n.images,E=n.placeholder,k=n.backgroundColor,S=function(e,t,a){var r={},i="gatsby-image-wrapper";return R()||(r.position="relative",r.overflow="hidden"),"fixed"===a?(r.width=e,r.height=t):"constrained"===a&&(R()||(r.display="inline-block",r.verticalAlign="top"),i="gatsby-image-wrapper gatsby-image-wrapper-constrained"),{className:i,"data-gatsby-image-wrapper":"",style:r}}(v,w,y),M=S.style,x=S.className,I=h(S,G),j={fallback:void 0,sources:[]};return b.fallback&&(j.fallback=c({},b.fallback,{srcSet:b.fallback.srcSet?B(b.fallback.srcSet):void 0})),b.sources&&(j.sources=b.sources.map(function(e){return c({},e,{srcSet:B(e.srcSet)})})),s.default.createElement(U,c({},I,{as:t,style:c({},M,i,{backgroundColor:g}),className:x+(a?" "+a:"")}),s.default.createElement(P,{layout:y,width:v,height:w},s.default.createElement(L,c({},function(e,t,a,r,i,n,o,s){var l={};n&&(l.backgroundColor=n,"fixed"===a?(l.width=r,l.height=i,l.backgroundColor=n,l.position="relative"):("constrained"===a||"fullWidth"===a)&&(l.position="absolute",l.top=0,l.left=0,l.bottom=0,l.right=0)),o&&(l.objectFit=o),s&&(l.objectPosition=s);var u=c({},e,{"aria-hidden":!0,"data-placeholder-image":"",style:c({opacity:1,transition:"opacity 500ms linear"},l)});return R()||(u.style={height:"100%",left:0,position:"absolute",top:0,width:"100%"}),u}(E,0,y,v,w,k,f,p))),s.default.createElement(q,c({"data-gatsby-image-ssr":"",className:u},m,function(e,t,a,r,i,n,o,s){return void 0===s&&(s={}),R()||(s=c({height:"100%",left:0,position:"absolute",top:0,transform:"translateZ(0)",transition:"opacity 250ms linear",width:"100%",willChange:"opacity"},s)),c({},a,{loading:r,shouldLoad:e,"data-main-image":"",style:c({},s,{opacity:0}),onLoad:function(e){var t=e.currentTarget,a=new Image;a.src=t.currentSrc,a.decode?a.decode().catch(function(){}).then(function(){i(!0)}):i(!0)},ref:void 0})}("eager"===l,0,j,l,void 0,0,0,d)))))},X=["src","__imageData","__error","width","height","aspectRatio","tracedSVGOptions","placeholder","formats","quality","transformOptions","jpgOptions","pngOptions","webpOptions","avifOptions","blurredOptions"],Y=function(e){return function(t){var a=t.src,r=t.__imageData,i=t.__error,n=h(t,X);return i&&console.warn(i),r?s.default.createElement(e,c({image:r},n)):(console.warn("Image not loaded",a),i||"development"!==process.env.NODE_ENV||console.warn('Please ensure that "gatsby-plugin-image" is included in the plugins array in gatsby-config.js, and that your version of gatsby is at least 2.24.78'),null)}}(V),Z=function(e,t){return"fullWidth"!==e.layout||"width"!==t&&"height"!==t||!e[t]?d.default.number.apply(d.default,[e,t].concat([].slice.call(arguments,2))):new Error('"'+t+'" '+e[t]+" may not be passed when layout is fullWidth.")},J=new Set(["fixed","fullWidth","constrained"]),K={src:d.default.string.isRequired,alt:function(e,t,a){return e.alt||""===e.alt?d.default.string.apply(d.default,[e,t,a].concat([].slice.call(arguments,3))):new Error('The "alt" prop is required in '+a+'. If the image is purely presentational then pass an empty string: e.g. alt="". Learn more: https://a11y-style-guide.com/style-guide/section-media.html')},width:Z,height:Z,sizes:d.default.string,layout:function(e){if(void 0!==e.layout&&!J.has(e.layout))return new Error("Invalid value "+e.layout+'" provided for prop "layout". Defaulting to "constrained". Valid values are "fixed", "fullWidth" or "constrained".')}};Y.displayName="StaticImage",Y.propTypes=K,exports.GatsbyImage=V,exports.MainImage=q,exports.Placeholder=L,exports.StaticImage=Y,exports.generateImageData=E,exports.getImage=N,exports.getImageData=function(e){var t,a=e.baseUrl,r=e.urlBuilder,i=e.sourceWidth,n=e.sourceHeight,o=e.pluginName,s=void 0===o?"getImageData":o,l=e.formats,u=void 0===l?["auto"]:l,d=e.breakpoints,g=e.options,f=h(e,x);return null!=(t=d)&&t.length||"fullWidth"!==f.layout&&"FULL_WIDTH"!==f.layout||(d=p),E(c({},f,{pluginName:s,generateImageSource:function(e,t,a,i){return{width:t,height:a,format:i,src:r({baseUrl:e,width:t,height:a,options:g,format:i})}},filename:a,formats:u,breakpoints:d,sourceMetadata:{width:i,height:n,format:"auto"}}))},exports.getLowResolutionImageURL=function(e,t){var a;return void 0===t&&(t=20),null==(a=(0,(e=b(e)).generateImageSource)(e.filename,t,Math.round(t/e.aspectRatio),e.sourceMetadata.format||"jpg",e.fit,e.options))?void 0:a.src},exports.getSrc=function(e){var t,a,r;return null==(t=N(e))||null==(a=t.images)||null==(r=a.fallback)?void 0:r.src},exports.getSrcSet=function(e){var t,a,r;return null==(t=N(e))||null==(a=t.images)||null==(r=a.fallback)?void 0:r.srcSet},exports.withArtDirection=function(e,t){var a,r,i,n=e.images,o=e.placeholder,s=c({},h(e,I),{images:c({},n,{sources:[]}),placeholder:o&&c({},o,{sources:[]})});return t.forEach(function(t){var a,r=t.media,i=t.image;r?(i.layout!==e.layout&&"development"===process.env.NODE_ENV&&console.warn('[gatsby-plugin-image] Mismatched image layout: expected "'+e.layout+'" but received "'+i.layout+'". All art-directed images use the same layout as the default image'),(a=s.images.sources).push.apply(a,i.images.sources.map(function(e){return c({},e,{media:r})}).concat([{media:r,srcSet:i.images.fallback.srcSet}])),s.placeholder&&s.placeholder.sources.push({media:r,srcSet:i.placeholder.fallback})):"development"===process.env.NODE_ENV&&console.warn("[gatsby-plugin-image] All art-directed images passed to must have a value set for `media`. Skipping.")}),(a=s.images.sources).push.apply(a,n.sources),null!=o&&o.sources&&(null==(r=s.placeholder)||(i=r.sources).push.apply(i,o.sources)),s};
+var e=require("react"),t=require("camelcase"),a=require("prop-types");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function r(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach(function(a){if("default"!==a){var i=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(t,a,i.get?i:{enumerable:!0,get:function(){return e[a]}})}}),t.default=e,t}var n=i(e),o=i(t),s=r(a),l=i(a);function u(){return u=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var a=arguments[t];for(var i in a)Object.prototype.hasOwnProperty.call(a,i)&&(e[i]=a[i])}return e},u.apply(this,arguments)}function d(e,t){if(null==e)return{};var a,i,r={},n=Object.keys(e);for(i=0;i<n.length;i++)t.indexOf(a=n[i])>=0||(r[a]=e[a]);return r}var c=[.25,.5,1,2],h=[750,1080,1366,1920],g=[320,654,768,1024,1366,1600,1920,2048,2560,3440,3840,4096],p=function(e){return console.warn(e)},f=function(e,t){return e-t},m=function(e){return e.map(function(e){return e.src+" "+e.width+"w"}).join(",\n")};function v(e){var t=e.lastIndexOf(".");if(-1!==t){var a=e.slice(t+1);if("jpeg"===a)return"jpg";if(3===a.length||4===a.length)return a}}function w(e){var t=e.layout,a=void 0===t?"constrained":t,i=e.width,r=e.height,n=e.sourceMetadata,s=e.breakpoints,l=e.aspectRatio,d=e.formats,c=void 0===d?["auto","webp"]:d;return c=c.map(function(e){return e.toLowerCase()}),a=o.default(a),i&&r?u({},e,{formats:c,layout:a,aspectRatio:i/r}):(n.width&&n.height&&!l&&(l=n.width/n.height),"fullWidth"===a?(i=i||n.width||s[s.length-1],r=r||Math.round(i/(l||1.3333333333333333))):(i||(i=r&&l?r*l:n.width?n.width:r?Math.round(r/1.3333333333333333):800),l&&!r?r=Math.round(i/l):l||(l=i/r)),u({},e,{width:i,height:r,aspectRatio:l,layout:a,formats:c}))}function y(e){var t,a=(e=w(e)).pluginName,i=e.sourceMetadata,r=e.generateImageSource,n=e.layout,o=e.fit,s=e.options,l=e.width,d=e.height,g=e.filename,f=e.reporter,y=void 0===f?{warn:p}:f,M=e.backgroundColor,S=e.placeholderURL;if(a||y.warn('[gatsby-plugin-image] "generateImageData" was not passed a plugin name'),"function"!=typeof r)throw new Error("generateImageSource must be a function");i&&(i.width||i.height)?i.format||(i.format=v(g)):i={width:l,height:d,format:(null==(t=i)?void 0:t.format)||v(g)||"auto"};var x=new Set(e.formats);(0===x.size||x.has("auto")||x.has(""))&&(x.delete("auto"),x.delete(""),x.add(i.format)),x.has("jpg")&&x.has("png")&&(y.warn("["+a+"] Specifying both 'jpg' and 'png' formats is not supported. Using 'auto' instead"),x.delete("jpg"===i.format?"png":"jpg"));var I=function(e){var t=e.filename,a=e.layout,i=void 0===a?"constrained":a,r=e.sourceMetadata,n=e.reporter,o=void 0===n?{warn:p}:n,s=e.breakpoints,l=void 0===s?h:s,d=Object.entries({width:e.width,height:e.height}).filter(function(e){var t=e[1];return"number"==typeof t&&t<1});if(d.length)throw new Error("Specified dimensions for images must be positive numbers (> 0). Problem dimensions you have are "+d.map(function(e){return e.join(": ")}).join(", "));return"fixed"===i?function(e){var t=e.filename,a=e.sourceMetadata,i=e.width,r=e.height,n=e.fit,o=void 0===n?"cover":n,s=e.outputPixelDensities,l=e.reporter,u=void 0===l?{warn:p}:l,d=a.width/a.height,h=b(void 0===s?c:s);if(i&&r){var g=k(a,{width:i,height:r,fit:o});i=g.width,r=g.height,d=g.aspectRatio}i?r||(r=Math.round(i/d)):i=r?Math.round(r*d):800;var f=i;if(a.width<i||a.height<r){var m=a.width<i?"width":"height";u.warn("\nThe requested "+m+' "'+("width"===m?i:r)+'px" for the image '+t+" was larger than the actual image "+m+" of "+a[m]+"px. If possible, replace the current image with a larger one."),"width"===m?(i=a.width,r=Math.round(i/d)):i=(r=a.height)*d}return{sizes:h.filter(function(e){return e>=1}).map(function(e){return Math.round(e*i)}).filter(function(e){return e<=a.width}),aspectRatio:d,presentationWidth:f,presentationHeight:Math.round(f/d),unscaledWidth:i}}(e):"constrained"===i?E(e):"fullWidth"===i?E(u({breakpoints:l},e)):(o.warn("No valid layout was provided for the image at "+t+". Valid image layouts are fixed, fullWidth, and constrained. Found "+i),{sizes:[r.width],presentationWidth:r.width,presentationHeight:r.height,aspectRatio:r.width/r.height,unscaledWidth:r.width})}(u({},e,{sourceMetadata:i})),j={sources:[]},N=e.sizes;N||(N=function(e,t){switch(t){case"constrained":return"(min-width: "+e+"px) "+e+"px, 100vw";case"fixed":return e+"px";case"fullWidth":return"100vw";default:return}}(I.presentationWidth,n)),x.forEach(function(e){var t=I.sizes.map(function(t){var i=r(g,t,Math.round(t/I.aspectRatio),e,o,s);if(null!=i&&i.width&&i.height&&i.src&&i.format)return i;y.warn("["+a+"] The resolver for image "+g+" returned an invalid value.")}).filter(Boolean);if("jpg"===e||"png"===e||"auto"===e){var i=t.find(function(e){return e.width===I.unscaledWidth})||t[0];i&&(j.fallback={src:i.src,srcSet:m(t),sizes:N})}else{var n;null==(n=j.sources)||n.push({srcSet:m(t),sizes:N,type:"image/"+e})}});var R={images:j,layout:n,backgroundColor:M};switch(S&&(R.placeholder={fallback:S}),n){case"fixed":R.width=I.presentationWidth,R.height=I.presentationHeight;break;case"fullWidth":R.width=1,R.height=1/I.aspectRatio;break;case"constrained":R.width=e.width||I.presentationWidth||1,R.height=(R.width||1)/I.aspectRatio}return R}var b=function(e){return Array.from(new Set([1].concat(e))).sort(f)};function E(e){var t,a=e.sourceMetadata,i=e.width,r=e.height,n=e.fit,o=void 0===n?"cover":n,s=e.outputPixelDensities,l=e.breakpoints,u=e.layout,d=a.width/a.height,h=b(void 0===s?c:s);if(i&&r){var g=k(a,{width:i,height:r,fit:o});i=g.width,r=g.height,d=g.aspectRatio}i=i&&Math.min(i,a.width),r=r&&Math.min(r,a.height),i||r||(r=(i=Math.min(800,a.width))/d),i||(i=r*d);var p=i;return(a.width<i||a.height<r)&&(i=a.width,r=a.height),i=Math.round(i),(null==l?void 0:l.length)>0?(t=l.filter(function(e){return e<=a.width})).length<l.length&&!t.includes(a.width)&&t.push(a.width):t=(t=h.map(function(e){return Math.round(e*i)})).filter(function(e){return e<=a.width}),"constrained"!==u||t.includes(i)||t.push(i),{sizes:t=t.sort(f),aspectRatio:d,presentationWidth:p,presentationHeight:Math.round(p/d),unscaledWidth:i}}function k(e,t){var a=e.width/e.height,i=t.width,r=t.height;switch(t.fit){case"fill":i=t.width?t.width:e.width,r=t.height?t.height:e.height;break;case"inside":var n=t.width?t.width:Number.MAX_SAFE_INTEGER,o=t.height?t.height:Number.MAX_SAFE_INTEGER;i=Math.min(n,Math.round(o*a)),r=Math.min(o,Math.round(n/a));break;case"outside":var s=t.width?t.width:0,l=t.height?t.height:0;i=Math.max(s,Math.round(l*a)),r=Math.max(l,Math.round(s/a));break;default:t.width&&!t.height&&(i=t.width,r=Math.round(t.width/a)),t.height&&!t.width&&(i=Math.round(t.height*a),r=t.height)}return{width:i,height:r,aspectRatio:i/r}}var M=["baseUrl","urlBuilder","sourceWidth","sourceHeight","pluginName","formats","breakpoints","options"],S=["images","placeholder"];function x(){return"undefined"!=typeof GATSBY___IMAGE&&GATSBY___IMAGE}var I,j=function(e){var t;return function(e){var t,a;return Boolean(null==e||null==(t=e.images)||null==(a=t.fallback)?void 0:a.src)}(e)?e:function(e){return Boolean(null==e?void 0:e.gatsbyImageData)}(e)?e.gatsbyImageData:function(e){return Boolean(null==e?void 0:e.gatsbyImage)}(e)?e.gatsbyImage:null==e||null==(t=e.childImageSharp)?void 0:t.gatsbyImageData},N=["src","srcSet","loading","alt","shouldLoad"],R=["fallback","sources","shouldLoad"],W=function(e){var t=e.src,a=e.srcSet,i=e.loading,r=e.alt,o=void 0===r?"":r,s=e.shouldLoad,l=d(e,N);return n.default.createElement("img",u({},l,{decoding:"async",loading:i,src:s?t:void 0,"data-src":s?void 0:t,srcSet:s?a:void 0,"data-srcset":s?void 0:a,alt:o}))},_=function(e){var t=e.fallback,a=e.sources,i=void 0===a?[]:a,r=e.shouldLoad,o=void 0===r||r,s=d(e,R),l=s.sizes||(null==t?void 0:t.sizes),c=n.default.createElement(W,u({},s,t,{sizes:l,shouldLoad:o}));return i.length?n.default.createElement("picture",null,i.map(function(e){var t=e.media,a=e.srcSet,i=e.type;return n.default.createElement("source",{key:t+"-"+i+"-"+a,type:i,media:t,srcSet:o?a:void 0,"data-srcset":o?void 0:a,sizes:l})}),c):c};W.propTypes={src:s.string.isRequired,alt:s.string.isRequired,sizes:s.string,srcSet:s.string,shouldLoad:s.bool},_.displayName="Picture",_.propTypes={alt:s.string.isRequired,shouldLoad:s.bool,fallback:s.exact({src:s.string.isRequired,srcSet:s.string,sizes:s.string}),sources:s.arrayOf(s.oneOfType([s.exact({media:s.string.isRequired,type:s.string,sizes:s.string,srcSet:s.string.isRequired}),s.exact({media:s.string,type:s.string.isRequired,sizes:s.string,srcSet:s.string.isRequired})]))};var O=["fallback"],A=function(e){var t=e.fallback,a=d(e,O);return t?n.default.createElement(_,u({},a,{fallback:{src:t},"aria-hidden":!0,alt:""})):n.default.createElement("div",u({},a))};A.displayName="Placeholder",A.propTypes={fallback:s.string,sources:null==(I=_.propTypes)?void 0:I.sources,alt:function(e,t,a){return e[t]?new Error("Invalid prop `"+t+"` supplied to `"+a+"`. Validation failed."):null}};var T=function(e){return n.default.createElement(n.default.Fragment,null,n.default.createElement(_,u({},e)),n.default.createElement("noscript",null,n.default.createElement(_,u({},e,{shouldLoad:!0}))))};T.displayName="MainImage",T.propTypes=_.propTypes;var L=["children"],z=function(){return n.default.createElement("script",{type:"module",dangerouslySetInnerHTML:{__html:'const t="undefined"!=typeof HTMLImageElement&&"loading"in HTMLImageElement.prototype;if(t){const t=document.querySelectorAll("img[data-main-image]");for(let e of t){e.dataset.src&&(e.setAttribute("src",e.dataset.src),e.removeAttribute("data-src")),e.dataset.srcset&&(e.setAttribute("srcset",e.dataset.srcset),e.removeAttribute("data-srcset"));const t=e.parentNode.querySelectorAll("source[data-srcset]");for(let e of t)e.setAttribute("srcset",e.dataset.srcset),e.removeAttribute("data-srcset");e.complete&&(e.style.opacity=1)}}'}})},D=function(e){var t=e.layout,a=e.width,i=e.height;return"fullWidth"===t?n.default.createElement("div",{"aria-hidden":!0,style:{paddingTop:i/a*100+"%"}}):"constrained"===t?n.default.createElement("div",{style:{maxWidth:a,display:"block"}},n.default.createElement("img",{alt:"",role:"presentation","aria-hidden":"true",src:"data:image/svg+xml;charset=utf-8,%3Csvg height='"+i+"' width='"+a+"' xmlns='http://www.w3.org/2000/svg' version='1.1'%3E%3C/svg%3E",style:{maxWidth:"100%",display:"block",position:"static"}})):null},q=function(t){var a=t.children,i=d(t,L);return n.default.createElement(e.Fragment,null,n.default.createElement(D,u({},i)),a,n.default.createElement(z,null))},C=["as","className","class","style","image","loading","imgClassName","imgStyle","backgroundColor","objectFit","objectPosition"],P=["style","className"],F=function(e){return e.replace(/\n/g,"")},H=function(e){var t=e.as,a=void 0===t?"div":t,i=e.className,r=e.class,o=e.style,s=e.image,l=e.loading,c=void 0===l?"lazy":l,h=e.imgClassName,g=e.imgStyle,p=e.backgroundColor,f=e.objectFit,m=e.objectPosition,v=d(e,C);if(!s)return console.warn("[gatsby-plugin-image] Missing image prop"),null;r&&(i=r),g=u({objectFit:f,objectPosition:m,backgroundColor:p},g);var w=s.width,y=s.height,b=s.layout,E=s.images,k=s.placeholder,M=s.backgroundColor,S=function(e,t,a){var i={},r="gatsby-image-wrapper";return x()||(i.position="relative",i.overflow="hidden"),"fixed"===a?(i.width=e,i.height=t):"constrained"===a&&(x()||(i.display="inline-block",i.verticalAlign="top"),r="gatsby-image-wrapper gatsby-image-wrapper-constrained"),{className:r,"data-gatsby-image-wrapper":"",style:i}}(w,y,b),I=S.style,j=S.className,N=d(S,P),R={fallback:void 0,sources:[]};return E.fallback&&(R.fallback=u({},E.fallback,{srcSet:E.fallback.srcSet?F(E.fallback.srcSet):void 0})),E.sources&&(R.sources=E.sources.map(function(e){return u({},e,{srcSet:F(e.srcSet)})})),n.default.createElement(a,u({},N,{style:u({},I,o,{backgroundColor:p}),className:j+(i?" "+i:"")}),n.default.createElement(q,{layout:b,width:w,height:y},n.default.createElement(A,u({},function(e,t,a,i,r,n,o,s){var l={};n&&(l.backgroundColor=n,"fixed"===a?(l.width=i,l.height=r,l.backgroundColor=n,l.position="relative"):("constrained"===a||"fullWidth"===a)&&(l.position="absolute",l.top=0,l.left=0,l.bottom=0,l.right=0)),o&&(l.objectFit=o),s&&(l.objectPosition=s);var d=u({},e,{"aria-hidden":!0,"data-placeholder-image":"",style:u({opacity:1,transition:"opacity 500ms linear"},l)});return x()||(d.style={height:"100%",left:0,position:"absolute",top:0,width:"100%"}),d}(k,0,b,w,y,M,f,m))),n.default.createElement(T,u({"data-gatsby-image-ssr":"",className:h},v,function(e,t,a,i,r){return void 0===r&&(r={}),x()||(r=u({height:"100%",left:0,position:"absolute",top:0,transform:"translateZ(0)",transition:"opacity 250ms linear",width:"100%",willChange:"opacity"},r)),u({},a,{loading:i,shouldLoad:e,"data-main-image":"",style:u({},r,{opacity:0})})}("eager"===c,0,R,c,g)))))},B=["src","__imageData","__error","width","height","aspectRatio","tracedSVGOptions","placeholder","formats","quality","transformOptions","jpgOptions","pngOptions","webpOptions","avifOptions","blurredOptions"],G=function(e){return function(t){var a=t.src,i=t.__imageData,r=t.__error,o=d(t,B);return r&&console.warn(r),i?n.default.createElement(e,u({image:i},o)):(console.warn("Image not loaded",a),r||"development"!==process.env.NODE_ENV||console.warn('Please ensure that "gatsby-plugin-image" is included in the plugins array in gatsby-config.js, and that your version of gatsby is at least 2.24.78'),null)}}(H),U=function(e,t){return"fullWidth"!==e.layout||"width"!==t&&"height"!==t||!e[t]?l.default.number.apply(l.default,[e,t].concat([].slice.call(arguments,2))):new Error('"'+t+'" '+e[t]+" may not be passed when layout is fullWidth.")},V=new Set(["fixed","fullWidth","constrained"]),X={src:l.default.string.isRequired,alt:function(e,t,a){return e.alt||""===e.alt?l.default.string.apply(l.default,[e,t,a].concat([].slice.call(arguments,3))):new Error('The "alt" prop is required in '+a+'. If the image is purely presentational then pass an empty string: e.g. alt="". Learn more: https://a11y-style-guide.com/style-guide/section-media.html')},width:U,height:U,sizes:l.default.string,layout:function(e){if(void 0!==e.layout&&!V.has(e.layout))return new Error("Invalid value "+e.layout+'" provided for prop "layout". Defaulting to "constrained". Valid values are "fixed", "fullWidth" or "constrained".')}};G.displayName="StaticImage",G.propTypes=X,exports.GatsbyImage=H,exports.MainImage=T,exports.Placeholder=A,exports.StaticImage=G,exports.generateImageData=y,exports.getImage=j,exports.getImageData=function(e){var t,a=e.baseUrl,i=e.urlBuilder,r=e.sourceWidth,n=e.sourceHeight,o=e.pluginName,s=void 0===o?"getImageData":o,l=e.formats,c=void 0===l?["auto"]:l,h=e.breakpoints,p=e.options,f=d(e,M);return null!=(t=h)&&t.length||"fullWidth"!==f.layout&&"FULL_WIDTH"!==f.layout||(h=g),y(u({},f,{pluginName:s,generateImageSource:function(e,t,a,r){return{width:t,height:a,format:r,src:i({baseUrl:e,width:t,height:a,options:p,format:r})}},filename:a,formats:c,breakpoints:h,sourceMetadata:{width:r,height:n,format:"auto"}}))},exports.getLowResolutionImageURL=function(e,t){var a;return void 0===t&&(t=20),null==(a=(0,(e=w(e)).generateImageSource)(e.filename,t,Math.round(t/e.aspectRatio),e.sourceMetadata.format||"jpg",e.fit,e.options))?void 0:a.src},exports.getSrc=function(e){var t,a,i;return null==(t=j(e))||null==(a=t.images)||null==(i=a.fallback)?void 0:i.src},exports.getSrcSet=function(e){var t,a,i;return null==(t=j(e))||null==(a=t.images)||null==(i=a.fallback)?void 0:i.srcSet},exports.withArtDirection=function(e,t){var a,i,r,n=e.images,o=e.placeholder,s=u({},d(e,S),{images:u({},n,{sources:[]}),placeholder:o&&u({},o,{sources:[]})});return t.forEach(function(t){var a,i=t.media,r=t.image;i?(r.layout!==e.layout&&"development"===process.env.NODE_ENV&&console.warn('[gatsby-plugin-image] Mismatched image layout: expected "'+e.layout+'" but received "'+r.layout+'". All art-directed images use the same layout as the default image'),(a=s.images.sources).push.apply(a,r.images.sources.map(function(e){return u({},e,{media:i})}).concat([{media:i,srcSet:r.images.fallback.srcSet}])),s.placeholder&&s.placeholder.sources.push({media:i,srcSet:r.placeholder.fallback})):"development"===process.env.NODE_ENV&&console.warn("[gatsby-plugin-image] All art-directed images passed to must have a value set for `media`. Skipping.")}),(a=s.images.sources).push.apply(a,n.sources),null!=o&&o.sources&&(null==(i=s.placeholder)||(r=i.sources).push.apply(r,o.sources)),s};
 //# sourceMappingURL=gatsby-image.js.map