boreal-ui 0.0.39 → 0.0.41

package/dist/next/{image-CEz9QtOW.js → image-BBS8QO15.js}

@@ -1,647 +1,705 @@
-import { _ as _interop_require_default, a as _interop_require_wildcard, r as requireRouterContext_sharedRuntime, b as requireUseMergedRef, g as getDefaultExportFromCjs } from "./link-Bik5xH00.js";
+import { r as require_interop_require_default, a as require_interop_require_wildcard, b as requireRouterContext_sharedRuntime, c as requireUseMergedRef, g as getDefaultExportFromCjs } from "./link-CxWP3aXr.js";
 import require$$2 from "react/jsx-runtime";
 import React from "react";
 import ReactDOM from "react-dom";
 var imageExternal = {};
 var getImgProps = {};
 var warnOnce = {};
-(function(exports) {
-  Object.defineProperty(exports, "__esModule", {
-    value: true
-  });
-  Object.defineProperty(exports, "warnOnce", {
-    enumerable: true,
-    get: function() {
-      return warnOnce2;
-    }
-  });
-  let warnOnce2 = (_) => {
-  };
-  if (process.env.NODE_ENV !== "production") {
-    const warnings = /* @__PURE__ */ new Set();
-    warnOnce2 = (msg) => {
-      if (!warnings.has(msg)) {
-        console.warn(msg);
+var hasRequiredWarnOnce;
+function requireWarnOnce() {
+  if (hasRequiredWarnOnce) return warnOnce;
+  hasRequiredWarnOnce = 1;
+  (function(exports$1) {
+    Object.defineProperty(exports$1, "__esModule", {
+      value: true
+    });
+    Object.defineProperty(exports$1, "warnOnce", {
+      enumerable: true,
+      get: function() {
+        return warnOnce2;
       }
-      warnings.add(msg);
+    });
+    let warnOnce2 = (_) => {
     };
-  }
-})(warnOnce);
+    if (process.env.NODE_ENV !== "production") {
+      const warnings = /* @__PURE__ */ new Set();
+      warnOnce2 = (msg) => {
+        if (!warnings.has(msg)) {
+          console.warn(msg);
+        }
+        warnings.add(msg);
+      };
+    }
+  })(warnOnce);
+  return warnOnce;
+}
 var imageBlurSvg = {};
-(function(exports) {
-  Object.defineProperty(exports, "__esModule", {
-    value: true
-  });
-  Object.defineProperty(exports, "getImageBlurSvg", {
-    enumerable: true,
-    get: function() {
-      return getImageBlurSvg;
+var hasRequiredImageBlurSvg;
+function requireImageBlurSvg() {
+  if (hasRequiredImageBlurSvg) return imageBlurSvg;
+  hasRequiredImageBlurSvg = 1;
+  (function(exports$1) {
+    Object.defineProperty(exports$1, "__esModule", {
+      value: true
+    });
+    Object.defineProperty(exports$1, "getImageBlurSvg", {
+      enumerable: true,
+      get: function() {
+        return getImageBlurSvg;
+      }
+    });
+    function getImageBlurSvg({ widthInt, heightInt, blurWidth, blurHeight, blurDataURL, objectFit }) {
+      const std = 20;
+      const svgWidth = blurWidth ? blurWidth * 40 : widthInt;
+      const svgHeight = blurHeight ? blurHeight * 40 : heightInt;
+      const viewBox = svgWidth && svgHeight ? `viewBox='0 0 ${svgWidth} ${svgHeight}'` : "";
+      const preserveAspectRatio = viewBox ? "none" : objectFit === "contain" ? "xMidYMid" : objectFit === "cover" ? "xMidYMid slice" : "none";
+      return `%3Csvg xmlns='http://www.w3.org/2000/svg' ${viewBox}%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='${std}'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='${std}'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='${preserveAspectRatio}' style='filter: url(%23b);' href='${blurDataURL}'/%3E%3C/svg%3E`;
     }
-  });
-  function getImageBlurSvg(param) {
-    let { widthInt, heightInt, blurWidth, blurHeight, blurDataURL, objectFit } = param;
-    const std = 20;
-    const svgWidth = blurWidth ? blurWidth * 40 : widthInt;
-    const svgHeight = blurHeight ? blurHeight * 40 : heightInt;
-    const viewBox = svgWidth && svgHeight ? "viewBox='0 0 " + svgWidth + " " + svgHeight + "'" : "";
-    const preserveAspectRatio = viewBox ? "none" : objectFit === "contain" ? "xMidYMid" : objectFit === "cover" ? "xMidYMid slice" : "none";
-    return "%3Csvg xmlns='http://www.w3.org/2000/svg' " + viewBox + "%3E%3Cfilter id='b' color-interpolation-filters='sRGB'%3E%3CfeGaussianBlur stdDeviation='" + std + "'/%3E%3CfeColorMatrix values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 100 -1' result='s'/%3E%3CfeFlood x='0' y='0' width='100%25' height='100%25'/%3E%3CfeComposite operator='out' in='s'/%3E%3CfeComposite in2='SourceGraphic'/%3E%3CfeGaussianBlur stdDeviation='" + std + "'/%3E%3C/filter%3E%3Cimage width='100%25' height='100%25' x='0' y='0' preserveAspectRatio='" + preserveAspectRatio + "' style='filter: url(%23b);' href='" + blurDataURL + "'/%3E%3C/svg%3E";
-  }
-})(imageBlurSvg);
+  })(imageBlurSvg);
+  return imageBlurSvg;
+}
 var imageConfig = {};
-(function(exports) {
-  Object.defineProperty(exports, "__esModule", {
-    value: true
-  });
-  function _export(target, all) {
-    for (var name in all) Object.defineProperty(target, name, {
-      enumerable: true,
-      get: all[name]
+var hasRequiredImageConfig;
+function requireImageConfig() {
+  if (hasRequiredImageConfig) return imageConfig;
+  hasRequiredImageConfig = 1;
+  (function(exports$1) {
+    Object.defineProperty(exports$1, "__esModule", {
+      value: true
     });
-  }
-  _export(exports, {
-    VALID_LOADERS: function() {
-      return VALID_LOADERS;
-    },
-    imageConfigDefault: function() {
-      return imageConfigDefault;
+    function _export(target, all) {
+      for (var name in all) Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+      });
     }
-  });
-  const VALID_LOADERS = [
-    "default",
-    "imgix",
-    "cloudinary",
-    "akamai",
-    "custom"
-  ];
-  const imageConfigDefault = {
-    deviceSizes: [
-      640,
-      750,
-      828,
-      1080,
-      1200,
-      1920,
-      2048,
-      3840
-    ],
-    imageSizes: [
-      16,
-      32,
-      48,
-      64,
-      96,
-      128,
-      256,
-      384
-    ],
-    path: "/_next/image",
-    loader: "default",
-    loaderFile: "",
-    domains: [],
-    disableStaticImages: false,
-    minimumCacheTTL: 60,
-    formats: [
-      "image/webp"
-    ],
-    dangerouslyAllowSVG: false,
-    contentSecurityPolicy: "script-src 'none'; frame-src 'none'; sandbox;",
-    contentDispositionType: "attachment",
-    localPatterns: void 0,
-    remotePatterns: [],
-    qualities: void 0,
-    unoptimized: false
-  };
-})(imageConfig);
-(function(exports) {
-  Object.defineProperty(exports, "__esModule", {
-    value: true
-  });
-  Object.defineProperty(exports, "getImgProps", {
-    enumerable: true,
-    get: function() {
-      return getImgProps2;
+    _export(exports$1, {
+      VALID_LOADERS: function() {
+        return VALID_LOADERS;
+      },
+      imageConfigDefault: function() {
+        return imageConfigDefault;
+      }
+    });
+    const VALID_LOADERS = [
+      "default",
+      "imgix",
+      "cloudinary",
+      "akamai",
+      "custom"
+    ];
+    const imageConfigDefault = {
+      deviceSizes: [
+        640,
+        750,
+        828,
+        1080,
+        1200,
+        1920,
+        2048,
+        3840
+      ],
+      imageSizes: [
+        32,
+        48,
+        64,
+        96,
+        128,
+        256,
+        384
+      ],
+      path: "/_next/image",
+      loader: "default",
+      loaderFile: "",
+      /**
+      * @deprecated Use `remotePatterns` instead to protect your application from malicious users.
+      */
+      domains: [],
+      disableStaticImages: false,
+      minimumCacheTTL: 14400,
+      formats: [
+        "image/webp"
+      ],
+      maximumRedirects: 3,
+      dangerouslyAllowLocalIP: false,
+      dangerouslyAllowSVG: false,
+      contentSecurityPolicy: `script-src 'none'; frame-src 'none'; sandbox;`,
+      contentDispositionType: "attachment",
+      localPatterns: void 0,
+      remotePatterns: [],
+      qualities: [
+        75
+      ],
+      unoptimized: false
+    };
+  })(imageConfig);
+  return imageConfig;
+}
+var hasRequiredGetImgProps;
+function requireGetImgProps() {
+  if (hasRequiredGetImgProps) return getImgProps;
+  hasRequiredGetImgProps = 1;
+  (function(exports$1) {
+    Object.defineProperty(exports$1, "__esModule", {
+      value: true
+    });
+    Object.defineProperty(exports$1, "getImgProps", {
+      enumerable: true,
+      get: function() {
+        return getImgProps2;
+      }
+    });
+    const _warnonce = requireWarnOnce();
+    const _imageblursvg = requireImageBlurSvg();
+    const _imageconfig = requireImageConfig();
+    const VALID_LOADING_VALUES = [
+      "lazy",
+      "eager",
+      void 0
+    ];
+    const INVALID_BACKGROUND_SIZE_VALUES = [
+      "-moz-initial",
+      "fill",
+      "none",
+      "scale-down",
+      void 0
+    ];
+    function isStaticRequire(src) {
+      return src.default !== void 0;
     }
-  });
-  const _warnonce = warnOnce;
-  const _imageblursvg = imageBlurSvg;
-  const _imageconfig = imageConfig;
-  const VALID_LOADING_VALUES = [
-    "lazy",
-    "eager",
-    void 0
-  ];
-  const INVALID_BACKGROUND_SIZE_VALUES = [
-    "-moz-initial",
-    "fill",
-    "none",
-    "scale-down",
-    void 0
-  ];
-  function isStaticRequire(src) {
-    return src.default !== void 0;
-  }
-  function isStaticImageData(src) {
-    return src.src !== void 0;
-  }
-  function isStaticImport(src) {
-    return !!src && typeof src === "object" && (isStaticRequire(src) || isStaticImageData(src));
-  }
-  const allImgs = /* @__PURE__ */ new Map();
-  let perfObserver;
-  function getInt(x) {
-    if (typeof x === "undefined") {
-      return x;
+    function isStaticImageData(src) {
+      return src.src !== void 0;
     }
-    if (typeof x === "number") {
-      return Number.isFinite(x) ? x : NaN;
+    function isStaticImport(src) {
+      return !!src && typeof src === "object" && (isStaticRequire(src) || isStaticImageData(src));
     }
-    if (typeof x === "string" && /^[0-9]+$/.test(x)) {
-      return parseInt(x, 10);
+    const allImgs = /* @__PURE__ */ new Map();
+    let perfObserver;
+    function getInt(x) {
+      if (typeof x === "undefined") {
+        return x;
+      }
+      if (typeof x === "number") {
+        return Number.isFinite(x) ? x : NaN;
+      }
+      if (typeof x === "string" && /^[0-9]+$/.test(x)) {
+        return parseInt(x, 10);
+      }
+      return NaN;
     }
-    return NaN;
-  }
-  function getWidths(param, width, sizes) {
-    let { deviceSizes, allSizes } = param;
-    if (sizes) {
-      const viewportWidthRe = /(^|\s)(1?\d?\d)vw/g;
-      const percentSizes = [];
-      for (let match; match = viewportWidthRe.exec(sizes); match) {
-        percentSizes.push(parseInt(match[2]));
+    function getWidths({ deviceSizes, allSizes }, width, sizes) {
+      if (sizes) {
+        const viewportWidthRe = /(^|\s)(1?\d?\d)vw/g;
+        const percentSizes = [];
+        for (let match; match = viewportWidthRe.exec(sizes); match) {
+          percentSizes.push(parseInt(match[2]));
+        }
+        if (percentSizes.length) {
+          const smallestRatio = Math.min(...percentSizes) * 0.01;
+          return {
+            widths: allSizes.filter((s) => s >= deviceSizes[0] * smallestRatio),
+            kind: "w"
+          };
+        }
+        return {
+          widths: allSizes,
+          kind: "w"
+        };
       }
-      if (percentSizes.length) {
-        const smallestRatio = Math.min(...percentSizes) * 0.01;
+      if (typeof width !== "number") {
         return {
-          widths: allSizes.filter((s) => s >= deviceSizes[0] * smallestRatio),
+          widths: deviceSizes,
           kind: "w"
         };
       }
+      const widths = [
+        ...new Set(
+          // > This means that most OLED screens that say they are 3x resolution,
+          // > are actually 3x in the green color, but only 1.5x in the red and
+          // > blue colors. Showing a 3x resolution image in the app vs a 2x
+          // > resolution image will be visually the same, though the 3x image
+          // > takes significantly more data. Even true 3x resolution screens are
+          // > wasteful as the human eye cannot see that level of detail without
+          // > something like a magnifying glass.
+          // https://blog.twitter.com/engineering/en_us/topics/infrastructure/2019/capping-image-fidelity-on-ultra-high-resolution-devices.html
+          [
+            width,
+            width * 2
+            /*, width * 3*/
+          ].map((w) => allSizes.find((p) => p >= w) || allSizes[allSizes.length - 1])
+        )
+      ];
       return {
-        widths: allSizes,
-        kind: "w"
-      };
-    }
-    if (typeof width !== "number") {
-      return {
-        widths: deviceSizes,
-        kind: "w"
-      };
-    }
-    const widths = [
-      ...new Set(
-        // > This means that most OLED screens that say they are 3x resolution,
-        // > are actually 3x in the green color, but only 1.5x in the red and
-        // > blue colors. Showing a 3x resolution image in the app vs a 2x
-        // > resolution image will be visually the same, though the 3x image
-        // > takes significantly more data. Even true 3x resolution screens are
-        // > wasteful as the human eye cannot see that level of detail without
-        // > something like a magnifying glass.
-        // https://blog.twitter.com/engineering/en_us/topics/infrastructure/2019/capping-image-fidelity-on-ultra-high-resolution-devices.html
-        [
-          width,
-          width * 2
-          /*, width * 3*/
-        ].map((w) => allSizes.find((p) => p >= w) || allSizes[allSizes.length - 1])
-      )
-    ];
-    return {
-      widths,
-      kind: "x"
-    };
-  }
-  function generateImgAttrs(param) {
-    let { config, src, unoptimized, width, quality, sizes, loader } = param;
-    if (unoptimized) {
-      return {
-        src,
-        srcSet: void 0,
-        sizes: void 0
-      };
-    }
-    const { widths, kind } = getWidths(config, width, sizes);
-    const last = widths.length - 1;
-    return {
-      sizes: !sizes && kind === "w" ? "100vw" : sizes,
-      srcSet: widths.map((w, i) => loader({
-        config,
-        src,
-        quality,
-        width: w
-      }) + " " + (kind === "w" ? w : i + 1) + kind).join(", "),
-      // It's intended to keep `src` the last attribute because React updates
-      // attributes in order. If we keep `src` the first one, Safari will
-      // immediately start to fetch `src`, before `sizes` and `srcSet` are even
-      // updated by React. That causes multiple unnecessary requests if `srcSet`
-      // and `sizes` are defined.
-      // This bug cannot be reproduced in Chrome or Firefox.
-      src: loader({
-        config,
-        src,
-        quality,
-        width: widths[last]
-      })
-    };
-  }
-  function getImgProps2(param, _state) {
-    let { src, sizes, unoptimized = false, priority = false, loading, className, quality, width, height, fill = false, style, overrideSrc, onLoad, onLoadingComplete, placeholder = "empty", blurDataURL, fetchPriority, decoding = "async", layout, objectFit, objectPosition, lazyBoundary, lazyRoot, ...rest } = param;
-    const { imgConf, showAltText, blurComplete, defaultLoader } = _state;
-    let config;
-    let c = imgConf || _imageconfig.imageConfigDefault;
-    if ("allSizes" in c) {
-      config = c;
-    } else {
-      var _c_qualities;
-      const allSizes = [
-        ...c.deviceSizes,
-        ...c.imageSizes
-      ].sort((a, b) => a - b);
-      const deviceSizes = c.deviceSizes.sort((a, b) => a - b);
-      const qualities = (_c_qualities = c.qualities) == null ? void 0 : _c_qualities.sort((a, b) => a - b);
-      config = {
-        ...c,
-        allSizes,
-        deviceSizes,
-        qualities
+        widths,
+        kind: "x"
       };
     }
-    if (typeof defaultLoader === "undefined") {
-      throw Object.defineProperty(new Error("images.loaderFile detected but the file is missing default export.\nRead more: https://nextjs.org/docs/messages/invalid-images-config"), "__NEXT_ERROR_CODE", {
-        value: "E163",
-        enumerable: false,
-        configurable: true
-      });
-    }
-    let loader = rest.loader || defaultLoader;
-    delete rest.loader;
-    delete rest.srcSet;
-    const isDefaultLoader = "__next_img_default" in loader;
-    if (isDefaultLoader) {
-      if (config.loader === "custom") {
-        throw Object.defineProperty(new Error('Image with src "' + src + '" is missing "loader" prop.\nRead more: https://nextjs.org/docs/messages/next-image-missing-loader'), "__NEXT_ERROR_CODE", {
-          value: "E252",
-          enumerable: false,
-          configurable: true
-        });
+    function generateImgAttrs({ config, src, unoptimized, width, quality, sizes, loader }) {
+      if (unoptimized) {
+        return {
+          src,
+          srcSet: void 0,
+          sizes: void 0
+        };
       }
-    } else {
-      const customImageLoader = loader;
-      loader = (obj) => {
-        const { config: _, ...opts } = obj;
-        return customImageLoader(opts);
+      const { widths, kind } = getWidths(config, width, sizes);
+      const last = widths.length - 1;
+      return {
+        sizes: !sizes && kind === "w" ? "100vw" : sizes,
+        srcSet: widths.map((w, i) => `${loader({
+          config,
+          src,
+          quality,
+          width: w
+        })} ${kind === "w" ? w : i + 1}${kind}`).join(", "),
+        // It's intended to keep `src` the last attribute because React updates
+        // attributes in order. If we keep `src` the first one, Safari will
+        // immediately start to fetch `src`, before `sizes` and `srcSet` are even
+        // updated by React. That causes multiple unnecessary requests if `srcSet`
+        // and `sizes` are defined.
+        // This bug cannot be reproduced in Chrome or Firefox.
+        src: loader({
+          config,
+          src,
+          quality,
+          width: widths[last]
+        })
       };
     }
-    if (layout) {
-      if (layout === "fill") {
-        fill = true;
-      }
-      const layoutToStyle = {
-        intrinsic: {
-          maxWidth: "100%",
-          height: "auto"
-        },
-        responsive: {
-          width: "100%",
-          height: "auto"
-        }
-      };
-      const layoutToSizes = {
-        responsive: "100vw",
-        fill: "100vw"
-      };
-      const layoutStyle = layoutToStyle[layout];
-      if (layoutStyle) {
-        style = {
-          ...style,
-          ...layoutStyle
+    function getImgProps2({ src, sizes, unoptimized = false, priority = false, preload = false, loading, className, quality, width, height, fill = false, style, overrideSrc, onLoad, onLoadingComplete, placeholder = "empty", blurDataURL, fetchPriority, decoding = "async", layout, objectFit, objectPosition, lazyBoundary, lazyRoot, ...rest }, _state) {
+      var _a;
+      const { imgConf, showAltText, blurComplete, defaultLoader } = _state;
+      let config;
+      let c = imgConf || _imageconfig.imageConfigDefault;
+      if ("allSizes" in c) {
+        config = c;
+      } else {
+        const allSizes = [
+          ...c.deviceSizes,
+          ...c.imageSizes
+        ].sort((a, b) => a - b);
+        const deviceSizes = c.deviceSizes.sort((a, b) => a - b);
+        const qualities = (_a = c.qualities) == null ? void 0 : _a.sort((a, b) => a - b);
+        config = {
+          ...c,
+          allSizes,
+          deviceSizes,
+          qualities
         };
       }
-      const layoutSizes = layoutToSizes[layout];
-      if (layoutSizes && !sizes) {
-        sizes = layoutSizes;
-      }
-    }
-    let staticSrc = "";
-    let widthInt = getInt(width);
-    let heightInt = getInt(height);
-    let blurWidth;
-    let blurHeight;
-    if (isStaticImport(src)) {
-      const staticImageData = isStaticRequire(src) ? src.default : src;
-      if (!staticImageData.src) {
-        throw Object.defineProperty(new Error("An object should only be passed to the image component src parameter if it comes from a static image import. It must include src. Received " + JSON.stringify(staticImageData)), "__NEXT_ERROR_CODE", {
-          value: "E460",
-          enumerable: false,
-          configurable: true
-        });
-      }
-      if (!staticImageData.height || !staticImageData.width) {
-        throw Object.defineProperty(new Error("An object should only be passed to the image component src parameter if it comes from a static image import. It must include height and width. Received " + JSON.stringify(staticImageData)), "__NEXT_ERROR_CODE", {
-          value: "E48",
+      if (typeof defaultLoader === "undefined") {
+        throw Object.defineProperty(new Error("images.loaderFile detected but the file is missing default export.\nRead more: https://nextjs.org/docs/messages/invalid-images-config"), "__NEXT_ERROR_CODE", {
+          value: "E163",
           enumerable: false,
           configurable: true
         });
       }
-      blurWidth = staticImageData.blurWidth;
-      blurHeight = staticImageData.blurHeight;
-      blurDataURL = blurDataURL || staticImageData.blurDataURL;
-      staticSrc = staticImageData.src;
-      if (!fill) {
-        if (!widthInt && !heightInt) {
-          widthInt = staticImageData.width;
-          heightInt = staticImageData.height;
-        } else if (widthInt && !heightInt) {
-          const ratio = widthInt / staticImageData.width;
-          heightInt = Math.round(staticImageData.height * ratio);
-        } else if (!widthInt && heightInt) {
-          const ratio = heightInt / staticImageData.height;
-          widthInt = Math.round(staticImageData.width * ratio);
+      let loader = rest.loader || defaultLoader;
+      delete rest.loader;
+      delete rest.srcSet;
+      const isDefaultLoader = "__next_img_default" in loader;
+      if (isDefaultLoader) {
+        if (config.loader === "custom") {
+          throw Object.defineProperty(new Error(`Image with src "${src}" is missing "loader" prop.
+Read more: https://nextjs.org/docs/messages/next-image-missing-loader`), "__NEXT_ERROR_CODE", {
+            value: "E252",
+            enumerable: false,
+            configurable: true
+          });
         }
-      }
-    }
-    src = typeof src === "string" ? src : staticSrc;
-    let isLazy = !priority && (loading === "lazy" || typeof loading === "undefined");
-    if (!src || src.startsWith("data:") || src.startsWith("blob:")) {
-      unoptimized = true;
-      isLazy = false;
-    }
-    if (config.unoptimized) {
-      unoptimized = true;
-    }
-    if (isDefaultLoader && !config.dangerouslyAllowSVG && src.split("?", 1)[0].endsWith(".svg")) {
-      unoptimized = true;
-    }
-    const qualityInt = getInt(quality);
-    if (process.env.NODE_ENV !== "production") {
-      if (config.output === "export" && isDefaultLoader && !unoptimized) {
-        throw Object.defineProperty(new Error("Image Optimization using the default loader is not compatible with `{ output: 'export' }`.\n  Possible solutions:\n    - Remove `{ output: 'export' }` and run \"next start\" to run server mode including the Image Optimization API.\n    - Configure `{ images: { unoptimized: true } }` in `next.config.js` to disable the Image Optimization API.\n  Read more: https://nextjs.org/docs/messages/export-image-api"), "__NEXT_ERROR_CODE", {
-          value: "E500",
-          enumerable: false,
-          configurable: true
-        });
-      }
-      if (!src) {
-        unoptimized = true;
       } else {
-        if (fill) {
-          if (width) {
-            throw Object.defineProperty(new Error('Image with src "' + src + '" has both "width" and "fill" properties. Only one should be used.'), "__NEXT_ERROR_CODE", {
-              value: "E96",
-              enumerable: false,
-              configurable: true
-            });
-          }
-          if (height) {
-            throw Object.defineProperty(new Error('Image with src "' + src + '" has both "height" and "fill" properties. Only one should be used.'), "__NEXT_ERROR_CODE", {
-              value: "E115",
-              enumerable: false,
-              configurable: true
-            });
-          }
-          if ((style == null ? void 0 : style.position) && style.position !== "absolute") {
-            throw Object.defineProperty(new Error('Image with src "' + src + '" has both "fill" and "style.position" properties. Images with "fill" always use position absolute - it cannot be modified.'), "__NEXT_ERROR_CODE", {
-              value: "E216",
-              enumerable: false,
-              configurable: true
-            });
-          }
-          if ((style == null ? void 0 : style.width) && style.width !== "100%") {
-            throw Object.defineProperty(new Error('Image with src "' + src + '" has both "fill" and "style.width" properties. Images with "fill" always use width 100% - it cannot be modified.'), "__NEXT_ERROR_CODE", {
-              value: "E73",
-              enumerable: false,
-              configurable: true
-            });
-          }
-          if ((style == null ? void 0 : style.height) && style.height !== "100%") {
-            throw Object.defineProperty(new Error('Image with src "' + src + '" has both "fill" and "style.height" properties. Images with "fill" always use height 100% - it cannot be modified.'), "__NEXT_ERROR_CODE", {
-              value: "E404",
-              enumerable: false,
-              configurable: true
-            });
-          }
-        } else {
-          if (typeof widthInt === "undefined") {
-            throw Object.defineProperty(new Error('Image with src "' + src + '" is missing required "width" property.'), "__NEXT_ERROR_CODE", {
-              value: "E451",
-              enumerable: false,
-              configurable: true
-            });
-          } else if (isNaN(widthInt)) {
-            throw Object.defineProperty(new Error('Image with src "' + src + '" has invalid "width" property. Expected a numeric value in pixels but received "' + width + '".'), "__NEXT_ERROR_CODE", {
-              value: "E66",
-              enumerable: false,
-              configurable: true
-            });
-          }
-          if (typeof heightInt === "undefined") {
-            throw Object.defineProperty(new Error('Image with src "' + src + '" is missing required "height" property.'), "__NEXT_ERROR_CODE", {
-              value: "E397",
-              enumerable: false,
-              configurable: true
-            });
-          } else if (isNaN(heightInt)) {
-            throw Object.defineProperty(new Error('Image with src "' + src + '" has invalid "height" property. Expected a numeric value in pixels but received "' + height + '".'), "__NEXT_ERROR_CODE", {
-              value: "E444",
-              enumerable: false,
-              configurable: true
-            });
-          }
-          if (/^[\x00-\x20]/.test(src)) {
-            throw Object.defineProperty(new Error('Image with src "' + src + '" cannot start with a space or control character. Use src.trimStart() to remove it or encodeURIComponent(src) to keep it.'), "__NEXT_ERROR_CODE", {
-              value: "E176",
-              enumerable: false,
-              configurable: true
-            });
+        const customImageLoader = loader;
+        loader = (obj) => {
+          const { config: _, ...opts } = obj;
+          return customImageLoader(opts);
+        };
+      }
+      if (layout) {
+        if (layout === "fill") {
+          fill = true;
+        }
+        const layoutToStyle = {
+          intrinsic: {
+            maxWidth: "100%",
+            height: "auto"
+          },
+          responsive: {
+            width: "100%",
+            height: "auto"
           }
-          if (/[\x00-\x20]$/.test(src)) {
-            throw Object.defineProperty(new Error('Image with src "' + src + '" cannot end with a space or control character. Use src.trimEnd() to remove it or encodeURIComponent(src) to keep it.'), "__NEXT_ERROR_CODE", {
-              value: "E21",
-              enumerable: false,
-              configurable: true
-            });
+        };
+        const layoutToSizes = {
+          responsive: "100vw",
+          fill: "100vw"
+        };
+        const layoutStyle = layoutToStyle[layout];
+        if (layoutStyle) {
+          style = {
+            ...style,
+            ...layoutStyle
+          };
+        }
+        const layoutSizes = layoutToSizes[layout];
+        if (layoutSizes && !sizes) {
+          sizes = layoutSizes;
+        }
+      }
+      let staticSrc = "";
+      let widthInt = getInt(width);
+      let heightInt = getInt(height);
+      let blurWidth;
+      let blurHeight;
+      if (isStaticImport(src)) {
+        const staticImageData = isStaticRequire(src) ? src.default : src;
+        if (!staticImageData.src) {
+          throw Object.defineProperty(new Error(`An object should only be passed to the image component src parameter if it comes from a static image import. It must include src. Received ${JSON.stringify(staticImageData)}`), "__NEXT_ERROR_CODE", {
+            value: "E460",
+            enumerable: false,
+            configurable: true
+          });
+        }
+        if (!staticImageData.height || !staticImageData.width) {
+          throw Object.defineProperty(new Error(`An object should only be passed to the image component src parameter if it comes from a static image import. It must include height and width. Received ${JSON.stringify(staticImageData)}`), "__NEXT_ERROR_CODE", {
+            value: "E48",
+            enumerable: false,
+            configurable: true
+          });
+        }
+        blurWidth = staticImageData.blurWidth;
+        blurHeight = staticImageData.blurHeight;
+        blurDataURL = blurDataURL || staticImageData.blurDataURL;
+        staticSrc = staticImageData.src;
+        if (!fill) {
+          if (!widthInt && !heightInt) {
+            widthInt = staticImageData.width;
+            heightInt = staticImageData.height;
+          } else if (widthInt && !heightInt) {
+            const ratio = widthInt / staticImageData.width;
+            heightInt = Math.round(staticImageData.height * ratio);
+          } else if (!widthInt && heightInt) {
+            const ratio = heightInt / staticImageData.height;
+            widthInt = Math.round(staticImageData.width * ratio);
           }
         }
       }
-      if (!VALID_LOADING_VALUES.includes(loading)) {
-        throw Object.defineProperty(new Error('Image with src "' + src + '" has invalid "loading" property. Provided "' + loading + '" should be one of ' + VALID_LOADING_VALUES.map(String).join(",") + "."), "__NEXT_ERROR_CODE", {
-          value: "E357",
-          enumerable: false,
-          configurable: true
-        });
+      src = typeof src === "string" ? src : staticSrc;
+      let isLazy = !priority && !preload && (loading === "lazy" || typeof loading === "undefined");
+      if (!src || src.startsWith("data:") || src.startsWith("blob:")) {
+        unoptimized = true;
+        isLazy = false;
       }
-      if (priority && loading === "lazy") {
-        throw Object.defineProperty(new Error('Image with src "' + src + `" has both "priority" and "loading='lazy'" properties. Only one should be used.`), "__NEXT_ERROR_CODE", {
-          value: "E218",
-          enumerable: false,
-          configurable: true
-        });
+      if (config.unoptimized) {
+        unoptimized = true;
       }
-      if (placeholder !== "empty" && placeholder !== "blur" && !placeholder.startsWith("data:image/")) {
-        throw Object.defineProperty(new Error('Image with src "' + src + '" has invalid "placeholder" property "' + placeholder + '".'), "__NEXT_ERROR_CODE", {
-          value: "E431",
-          enumerable: false,
-          configurable: true
-        });
+      if (isDefaultLoader && !config.dangerouslyAllowSVG && src.split("?", 1)[0].endsWith(".svg")) {
+        unoptimized = true;
       }
-      if (placeholder !== "empty") {
-        if (widthInt && heightInt && widthInt * heightInt < 1600) {
-          (0, _warnonce.warnOnce)('Image with src "' + src + '" is smaller than 40x40. Consider removing the "placeholder" property to improve performance.');
+      const qualityInt = getInt(quality);
+      if (process.env.NODE_ENV !== "production") {
+        if (config.output === "export" && isDefaultLoader && !unoptimized) {
+          throw Object.defineProperty(new Error(`Image Optimization using the default loader is not compatible with \`{ output: 'export' }\`.
+  Possible solutions:
+    - Remove \`{ output: 'export' }\` and run "next start" to run server mode including the Image Optimization API.
+    - Configure \`{ images: { unoptimized: true } }\` in \`next.config.js\` to disable the Image Optimization API.
+  Read more: https://nextjs.org/docs/messages/export-image-api`), "__NEXT_ERROR_CODE", {
+            value: "E500",
+            enumerable: false,
+            configurable: true
+          });
         }
-      }
-      if (placeholder === "blur" && !blurDataURL) {
-        const VALID_BLUR_EXT = [
-          "jpeg",
-          "png",
-          "webp",
-          "avif"
-        ];
-        throw Object.defineProperty(new Error('Image with src "' + src + `" has "placeholder='blur'" property but is missing the "blurDataURL" property.
+        if (!src) {
+          unoptimized = true;
+        } else {
+          if (fill) {
+            if (width) {
+              throw Object.defineProperty(new Error(`Image with src "${src}" has both "width" and "fill" properties. Only one should be used.`), "__NEXT_ERROR_CODE", {
+                value: "E96",
+                enumerable: false,
+                configurable: true
+              });
+            }
+            if (height) {
+              throw Object.defineProperty(new Error(`Image with src "${src}" has both "height" and "fill" properties. Only one should be used.`), "__NEXT_ERROR_CODE", {
+                value: "E115",
+                enumerable: false,
+                configurable: true
+              });
+            }
+            if ((style == null ? void 0 : style.position) && style.position !== "absolute") {
+              throw Object.defineProperty(new Error(`Image with src "${src}" has both "fill" and "style.position" properties. Images with "fill" always use position absolute - it cannot be modified.`), "__NEXT_ERROR_CODE", {
+                value: "E216",
+                enumerable: false,
+                configurable: true
+              });
+            }
+            if ((style == null ? void 0 : style.width) && style.width !== "100%") {
+              throw Object.defineProperty(new Error(`Image with src "${src}" has both "fill" and "style.width" properties. Images with "fill" always use width 100% - it cannot be modified.`), "__NEXT_ERROR_CODE", {
+                value: "E73",
+                enumerable: false,
+                configurable: true
+              });
+            }
+            if ((style == null ? void 0 : style.height) && style.height !== "100%") {
+              throw Object.defineProperty(new Error(`Image with src "${src}" has both "fill" and "style.height" properties. Images with "fill" always use height 100% - it cannot be modified.`), "__NEXT_ERROR_CODE", {
+                value: "E404",
+                enumerable: false,
+                configurable: true
+              });
+            }
+          } else {
+            if (typeof widthInt === "undefined") {
+              throw Object.defineProperty(new Error(`Image with src "${src}" is missing required "width" property.`), "__NEXT_ERROR_CODE", {
+                value: "E451",
+                enumerable: false,
+                configurable: true
+              });
+            } else if (isNaN(widthInt)) {
+              throw Object.defineProperty(new Error(`Image with src "${src}" has invalid "width" property. Expected a numeric value in pixels but received "${width}".`), "__NEXT_ERROR_CODE", {
+                value: "E66",
+                enumerable: false,
+                configurable: true
+              });
+            }
+            if (typeof heightInt === "undefined") {
+              throw Object.defineProperty(new Error(`Image with src "${src}" is missing required "height" property.`), "__NEXT_ERROR_CODE", {
+                value: "E397",
+                enumerable: false,
+                configurable: true
+              });
+            } else if (isNaN(heightInt)) {
+              throw Object.defineProperty(new Error(`Image with src "${src}" has invalid "height" property. Expected a numeric value in pixels but received "${height}".`), "__NEXT_ERROR_CODE", {
+                value: "E444",
+                enumerable: false,
+                configurable: true
+              });
+            }
+            if (/^[\x00-\x20]/.test(src)) {
+              throw Object.defineProperty(new Error(`Image with src "${src}" cannot start with a space or control character. Use src.trimStart() to remove it or encodeURIComponent(src) to keep it.`), "__NEXT_ERROR_CODE", {
+                value: "E176",
+                enumerable: false,
+                configurable: true
+              });
+            }
+            if (/[\x00-\x20]$/.test(src)) {
+              throw Object.defineProperty(new Error(`Image with src "${src}" cannot end with a space or control character. Use src.trimEnd() to remove it or encodeURIComponent(src) to keep it.`), "__NEXT_ERROR_CODE", {
+                value: "E21",
+                enumerable: false,
+                configurable: true
+              });
+            }
+          }
+        }
+        if (!VALID_LOADING_VALUES.includes(loading)) {
+          throw Object.defineProperty(new Error(`Image with src "${src}" has invalid "loading" property. Provided "${loading}" should be one of ${VALID_LOADING_VALUES.map(String).join(",")}.`), "__NEXT_ERROR_CODE", {
+            value: "E357",
+            enumerable: false,
+            configurable: true
+          });
+        }
+        if (priority && loading === "lazy") {
+          throw Object.defineProperty(new Error(`Image with src "${src}" has both "priority" and "loading='lazy'" properties. Only one should be used.`), "__NEXT_ERROR_CODE", {
+            value: "E218",
+            enumerable: false,
+            configurable: true
+          });
+        }
+        if (preload && loading === "lazy") {
+          throw Object.defineProperty(new Error(`Image with src "${src}" has both "preload" and "loading='lazy'" properties. Only one should be used.`), "__NEXT_ERROR_CODE", {
+            value: "E803",
+            enumerable: false,
+            configurable: true
+          });
+        }
+        if (preload && priority) {
+          throw Object.defineProperty(new Error(`Image with src "${src}" has both "preload" and "priority" properties. Only "preload" should be used.`), "__NEXT_ERROR_CODE", {
+            value: "E802",
+            enumerable: false,
+            configurable: true
+          });
+        }
+        if (placeholder !== "empty" && placeholder !== "blur" && !placeholder.startsWith("data:image/")) {
+          throw Object.defineProperty(new Error(`Image with src "${src}" has invalid "placeholder" property "${placeholder}".`), "__NEXT_ERROR_CODE", {
+            value: "E431",
+            enumerable: false,
+            configurable: true
+          });
+        }
+        if (placeholder !== "empty") {
+          if (widthInt && heightInt && widthInt * heightInt < 1600) {
+            (0, _warnonce.warnOnce)(`Image with src "${src}" is smaller than 40x40. Consider removing the "placeholder" property to improve performance.`);
+          }
+        }
+        if (qualityInt && config.qualities && !config.qualities.includes(qualityInt)) {
+          (0, _warnonce.warnOnce)(`Image with src "${src}" is using quality "${qualityInt}" which is not configured in images.qualities [${config.qualities.join(", ")}]. Please update your config to [${[
+            ...config.qualities,
+            qualityInt
+          ].sort().join(", ")}].
+Read more: https://nextjs.org/docs/messages/next-image-unconfigured-qualities`);
+        }
+        if (placeholder === "blur" && !blurDataURL) {
+          const VALID_BLUR_EXT = [
+            "jpeg",
+            "png",
+            "webp",
+            "avif"
+          ];
+          throw Object.defineProperty(new Error(`Image with src "${src}" has "placeholder='blur'" property but is missing the "blurDataURL" property.
         Possible solutions:
           - Add a "blurDataURL" property, the contents should be a small Data URL to represent the image
-          - Change the "src" property to a static import with one of the supported file types: ` + VALID_BLUR_EXT.join(",") + ' (animated images not supported)\n          - Remove the "placeholder" property, effectively no blur effect\n        Read more: https://nextjs.org/docs/messages/placeholder-blur-data-url'), "__NEXT_ERROR_CODE", {
-          value: "E371",
-          enumerable: false,
-          configurable: true
-        });
-      }
-      if ("ref" in rest) {
-        (0, _warnonce.warnOnce)('Image with src "' + src + '" is using unsupported "ref" property. Consider using the "onLoad" property instead.');
-      }
-      if (!unoptimized && !isDefaultLoader) {
-        const urlStr = loader({
-          config,
-          src,
-          width: widthInt || 400,
-          quality: qualityInt || 75
-        });
-        let url;
-        try {
-          url = new URL(urlStr);
-        } catch (err) {
+          - Change the "src" property to a static import with one of the supported file types: ${VALID_BLUR_EXT.join(",")} (animated images not supported)
+          - Remove the "placeholder" property, effectively no blur effect
+        Read more: https://nextjs.org/docs/messages/placeholder-blur-data-url`), "__NEXT_ERROR_CODE", {
+            value: "E371",
+            enumerable: false,
+            configurable: true
+          });
         }
-        if (urlStr === src || url && url.pathname === src && !url.search) {
-          (0, _warnonce.warnOnce)('Image with src "' + src + '" has a "loader" property that does not implement width. Please implement it or use the "unoptimized" property instead.\nRead more: https://nextjs.org/docs/messages/next-image-missing-loader-width');
+        if ("ref" in rest) {
+          (0, _warnonce.warnOnce)(`Image with src "${src}" is using unsupported "ref" property. Consider using the "onLoad" property instead.`);
+        }
+        if (!unoptimized && !isDefaultLoader) {
+          const urlStr = loader({
+            config,
+            src,
+            width: widthInt || 400,
+            quality: qualityInt || 75
+          });
+          let url;
+          try {
+            url = new URL(urlStr);
+          } catch (err) {
+          }
+          if (urlStr === src || url && url.pathname === src && !url.search) {
+            (0, _warnonce.warnOnce)(`Image with src "${src}" has a "loader" property that does not implement width. Please implement it or use the "unoptimized" property instead.
+Read more: https://nextjs.org/docs/messages/next-image-missing-loader-width`);
+          }
+        }
+        if (onLoadingComplete) {
+          (0, _warnonce.warnOnce)(`Image with src "${src}" is using deprecated "onLoadingComplete" property. Please use the "onLoad" property instead.`);
+        }
+        for (const [legacyKey, legacyValue] of Object.entries({
+          layout,
+          objectFit,
+          objectPosition,
+          lazyBoundary,
+          lazyRoot
+        })) {
+          if (legacyValue) {
+            (0, _warnonce.warnOnce)(`Image with src "${src}" has legacy prop "${legacyKey}". Did you forget to run the codemod?
+Read more: https://nextjs.org/docs/messages/next-image-upgrade-to-13`);
+          }
+        }
+        if (typeof window !== "undefined" && !perfObserver && window.PerformanceObserver) {
+          perfObserver = new PerformanceObserver((entryList) => {
+            var _a2;
+            for (const entry of entryList.getEntries()) {
+              const imgSrc = ((_a2 = entry == null ? void 0 : entry.element) == null ? void 0 : _a2.src) || "";
+              const lcpImage = allImgs.get(imgSrc);
+              if (lcpImage && lcpImage.loading === "lazy" && lcpImage.placeholder === "empty" && !lcpImage.src.startsWith("data:") && !lcpImage.src.startsWith("blob:")) {
+                (0, _warnonce.warnOnce)(`Image with src "${lcpImage.src}" was detected as the Largest Contentful Paint (LCP). Please add the \`loading="eager"\` property if this image is above the fold.
+Read more: https://nextjs.org/docs/app/api-reference/components/image#loading`);
+              }
+            }
+          });
+          try {
+            perfObserver.observe({
+              type: "largest-contentful-paint",
+              buffered: true
+            });
+          } catch (err) {
+            console.error(err);
+          }
         }
       }
-      if (onLoadingComplete) {
-        (0, _warnonce.warnOnce)('Image with src "' + src + '" is using deprecated "onLoadingComplete" property. Please use the "onLoad" property instead.');
-      }
-      for (const [legacyKey, legacyValue] of Object.entries({
-        layout,
+      const imgStyle = Object.assign(fill ? {
+        position: "absolute",
+        height: "100%",
+        width: "100%",
+        left: 0,
+        top: 0,
+        right: 0,
+        bottom: 0,
         objectFit,
-        objectPosition,
-        lazyBoundary,
-        lazyRoot
-      })) {
-        if (legacyValue) {
-          (0, _warnonce.warnOnce)('Image with src "' + src + '" has legacy prop "' + legacyKey + '". Did you forget to run the codemod?\nRead more: https://nextjs.org/docs/messages/next-image-upgrade-to-13');
+        objectPosition
+      } : {}, showAltText ? {} : {
+        color: "transparent"
+      }, style);
+      const backgroundImage = !blurComplete && placeholder !== "empty" ? placeholder === "blur" ? `url("data:image/svg+xml;charset=utf-8,${(0, _imageblursvg.getImageBlurSvg)({
+        widthInt,
+        heightInt,
+        blurWidth,
+        blurHeight,
+        blurDataURL: blurDataURL || "",
+        objectFit: imgStyle.objectFit
+      })}")` : `url("${placeholder}")` : null;
+      const backgroundSize = !INVALID_BACKGROUND_SIZE_VALUES.includes(imgStyle.objectFit) ? imgStyle.objectFit : imgStyle.objectFit === "fill" ? "100% 100%" : "cover";
+      let placeholderStyle = backgroundImage ? {
+        backgroundSize,
+        backgroundPosition: imgStyle.objectPosition || "50% 50%",
+        backgroundRepeat: "no-repeat",
+        backgroundImage
+      } : {};
+      if (process.env.NODE_ENV === "development") {
+        if (placeholderStyle.backgroundImage && placeholder === "blur" && (blurDataURL == null ? void 0 : blurDataURL.startsWith("/"))) {
+          placeholderStyle.backgroundImage = `url("${blurDataURL}")`;
         }
       }
-      if (typeof window !== "undefined" && !perfObserver && window.PerformanceObserver) {
-        perfObserver = new PerformanceObserver((entryList) => {
-          for (const entry of entryList.getEntries()) {
-            var _entry_element;
-            const imgSrc = (entry == null ? void 0 : (_entry_element = entry.element) == null ? void 0 : _entry_element.src) || "";
-            const lcpImage = allImgs.get(imgSrc);
-            if (lcpImage && !lcpImage.priority && lcpImage.placeholder === "empty" && !lcpImage.src.startsWith("data:") && !lcpImage.src.startsWith("blob:")) {
-              (0, _warnonce.warnOnce)('Image with src "' + lcpImage.src + '" was detected as the Largest Contentful Paint (LCP). Please add the "priority" property if this image is above the fold.\nRead more: https://nextjs.org/docs/api-reference/next/image#priority');
-            }
+      const imgAttributes = generateImgAttrs({
+        config,
+        src,
+        unoptimized,
+        width: widthInt,
+        quality: qualityInt,
+        sizes,
+        loader
+      });
+      const loadingFinal = isLazy ? "lazy" : loading;
+      if (process.env.NODE_ENV !== "production") {
+        if (typeof window !== "undefined") {
+          let fullUrl;
+          try {
+            fullUrl = new URL(imgAttributes.src);
+          } catch (e) {
+            fullUrl = new URL(imgAttributes.src, window.location.href);
           }
-        });
-        try {
-          perfObserver.observe({
-            type: "largest-contentful-paint",
-            buffered: true
+          allImgs.set(fullUrl.href, {
+            src,
+            loading: loadingFinal,
+            placeholder
           });
-        } catch (err) {
-          console.error(err);
-        }
-      }
-    }
-    const imgStyle = Object.assign(fill ? {
-      position: "absolute",
-      height: "100%",
-      width: "100%",
-      left: 0,
-      top: 0,
-      right: 0,
-      bottom: 0,
-      objectFit,
-      objectPosition
-    } : {}, showAltText ? {} : {
-      color: "transparent"
-    }, style);
-    const backgroundImage = !blurComplete && placeholder !== "empty" ? placeholder === "blur" ? 'url("data:image/svg+xml;charset=utf-8,' + (0, _imageblursvg.getImageBlurSvg)({
-      widthInt,
-      heightInt,
-      blurWidth,
-      blurHeight,
-      blurDataURL: blurDataURL || "",
-      objectFit: imgStyle.objectFit
-    }) + '")' : 'url("' + placeholder + '")' : null;
-    const backgroundSize = !INVALID_BACKGROUND_SIZE_VALUES.includes(imgStyle.objectFit) ? imgStyle.objectFit : imgStyle.objectFit === "fill" ? "100% 100%" : "cover";
-    let placeholderStyle = backgroundImage ? {
-      backgroundSize,
-      backgroundPosition: imgStyle.objectPosition || "50% 50%",
-      backgroundRepeat: "no-repeat",
-      backgroundImage
-    } : {};
-    if (process.env.NODE_ENV === "development") {
-      if (placeholderStyle.backgroundImage && placeholder === "blur" && (blurDataURL == null ? void 0 : blurDataURL.startsWith("/"))) {
-        placeholderStyle.backgroundImage = 'url("' + blurDataURL + '")';
-      }
-    }
-    const imgAttributes = generateImgAttrs({
-      config,
-      src,
-      unoptimized,
-      width: widthInt,
-      quality: qualityInt,
-      sizes,
-      loader
-    });
-    if (process.env.NODE_ENV !== "production") {
-      if (typeof window !== "undefined") {
-        let fullUrl;
-        try {
-          fullUrl = new URL(imgAttributes.src);
-        } catch (e) {
-          fullUrl = new URL(imgAttributes.src, window.location.href);
         }
-        allImgs.set(fullUrl.href, {
-          src,
-          priority,
-          placeholder
-        });
       }
+      const props = {
+        ...rest,
+        loading: loadingFinal,
+        fetchPriority,
+        width: widthInt,
+        height: heightInt,
+        decoding,
+        className,
+        style: {
+          ...imgStyle,
+          ...placeholderStyle
+        },
+        sizes: imgAttributes.sizes,
+        srcSet: imgAttributes.srcSet,
+        src: overrideSrc || imgAttributes.src
+      };
+      const meta = {
+        unoptimized,
+        preload: preload || priority,
+        placeholder,
+        fill
+      };
+      return {
+        props,
+        meta
+      };
     }
-    const props = {
-      ...rest,
-      loading: isLazy ? "lazy" : loading,
-      fetchPriority,
-      width: widthInt,
-      height: heightInt,
-      decoding,
-      className,
-      style: {
-        ...imgStyle,
-        ...placeholderStyle
-      },
-      sizes: imgAttributes.sizes,
-      srcSet: imgAttributes.srcSet,
-      src: overrideSrc || imgAttributes.src
-    };
-    const meta = {
-      unoptimized,
-      priority,
-      placeholder,
-      fill
-    };
-    return {
-      props,
-      meta
-    };
-  }
-})(getImgProps);
+  })(getImgProps);
+  return getImgProps;
+}
 var imageComponent = { exports: {} };
 var head = { exports: {} };
 var sideEffect = {};
@@ -649,11 +707,11 @@ var hasRequiredSideEffect;
 function requireSideEffect() {
   if (hasRequiredSideEffect) return sideEffect;
   hasRequiredSideEffect = 1;
-  (function(exports) {
-    Object.defineProperty(exports, "__esModule", {
+  (function(exports$1) {
+    Object.defineProperty(exports$1, "__esModule", {
       value: true
     });
-    Object.defineProperty(exports, "default", {
+    Object.defineProperty(exports$1, "default", {
       enumerable: true,
       get: function() {
         return SideEffect;
@@ -666,24 +724,24 @@ function requireSideEffect() {
     const useClientOnlyEffect = isServer ? () => {
     } : _react.useEffect;
     function SideEffect(props) {
+      var _a;
       const { headManager, reduceComponentsToState } = props;
       function emitChange() {
         if (headManager && headManager.mountedInstances) {
           const headElements = _react.Children.toArray(Array.from(headManager.mountedInstances).filter(Boolean));
-          headManager.updateHead(reduceComponentsToState(headElements, props));
+          headManager.updateHead(reduceComponentsToState(headElements));
         }
       }
       if (isServer) {
-        var _headManager_mountedInstances;
-        headManager == null ? void 0 : (_headManager_mountedInstances = headManager.mountedInstances) == null ? void 0 : _headManager_mountedInstances.add(props.children);
+        (_a = headManager == null ? void 0 : headManager.mountedInstances) == null ? void 0 : _a.add(props.children);
         emitChange();
       }
       useClientOnlyLayoutEffect(() => {
-        var _headManager_mountedInstances2;
-        headManager == null ? void 0 : (_headManager_mountedInstances2 = headManager.mountedInstances) == null ? void 0 : _headManager_mountedInstances2.add(props.children);
+        var _a2;
+        (_a2 = headManager == null ? void 0 : headManager.mountedInstances) == null ? void 0 : _a2.add(props.children);
         return () => {
-          var _headManager_mountedInstances3;
-          headManager == null ? void 0 : (_headManager_mountedInstances3 = headManager.mountedInstances) == null ? void 0 : _headManager_mountedInstances3.delete(props.children);
+          var _a3;
+          (_a3 = headManager == null ? void 0 : headManager.mountedInstances) == null ? void 0 : _a3.delete(props.children);
         };
       });
       useClientOnlyLayoutEffect(() => {
@@ -713,47 +771,23 @@ function requireSideEffect() {
   })(sideEffect);
   return sideEffect;
 }
-var ampContext_sharedRuntime = {};
-var hasRequiredAmpContext_sharedRuntime;
-function requireAmpContext_sharedRuntime() {
-  if (hasRequiredAmpContext_sharedRuntime) return ampContext_sharedRuntime;
-  hasRequiredAmpContext_sharedRuntime = 1;
-  (function(exports) {
-    Object.defineProperty(exports, "__esModule", {
-      value: true
-    });
-    Object.defineProperty(exports, "AmpStateContext", {
-      enumerable: true,
-      get: function() {
-        return AmpStateContext;
-      }
-    });
-    const _interop_require_default$1 = _interop_require_default;
-    const _react = /* @__PURE__ */ _interop_require_default$1._(React);
-    const AmpStateContext = _react.default.createContext({});
-    if (process.env.NODE_ENV !== "production") {
-      AmpStateContext.displayName = "AmpStateContext";
-    }
-  })(ampContext_sharedRuntime);
-  return ampContext_sharedRuntime;
-}
 var headManagerContext_sharedRuntime = {};
 var hasRequiredHeadManagerContext_sharedRuntime;
 function requireHeadManagerContext_sharedRuntime() {
   if (hasRequiredHeadManagerContext_sharedRuntime) return headManagerContext_sharedRuntime;
   hasRequiredHeadManagerContext_sharedRuntime = 1;
-  (function(exports) {
-    Object.defineProperty(exports, "__esModule", {
+  (function(exports$1) {
+    Object.defineProperty(exports$1, "__esModule", {
       value: true
     });
-    Object.defineProperty(exports, "HeadManagerContext", {
+    Object.defineProperty(exports$1, "HeadManagerContext", {
       enumerable: true,
       get: function() {
         return HeadManagerContext;
       }
     });
-    const _interop_require_default$1 = _interop_require_default;
-    const _react = /* @__PURE__ */ _interop_require_default$1._(React);
+    const _interop_require_default = /* @__PURE__ */ require_interop_require_default();
+    const _react = /* @__PURE__ */ _interop_require_default._(React);
     const HeadManagerContext = _react.default.createContext({});
     if (process.env.NODE_ENV !== "production") {
       HeadManagerContext.displayName = "HeadManagerContext";
@@ -761,35 +795,13 @@ function requireHeadManagerContext_sharedRuntime() {
   })(headManagerContext_sharedRuntime);
   return headManagerContext_sharedRuntime;
 }
-var ampMode = {};
-var hasRequiredAmpMode;
-function requireAmpMode() {
-  if (hasRequiredAmpMode) return ampMode;
-  hasRequiredAmpMode = 1;
-  (function(exports) {
-    Object.defineProperty(exports, "__esModule", {
-      value: true
-    });
-    Object.defineProperty(exports, "isInAmpMode", {
-      enumerable: true,
-      get: function() {
-        return isInAmpMode;
-      }
-    });
-    function isInAmpMode(param) {
-      let { ampFirst = false, hybrid = false, hasQuery = false } = param === void 0 ? {} : param;
-      return ampFirst || hybrid && hasQuery;
-    }
-  })(ampMode);
-  return ampMode;
-}
 var hasRequiredHead;
 function requireHead() {
   if (hasRequiredHead) return head.exports;
   hasRequiredHead = 1;
-  (function(module, exports) {
+  (function(module, exports$1) {
     "use client";
-    Object.defineProperty(exports, "__esModule", {
+    Object.defineProperty(exports$1, "__esModule", {
       value: true
     });
     function _export(target, all) {
@@ -798,7 +810,7 @@ function requireHead() {
         get: all[name]
       });
     }
-    _export(exports, {
+    _export(exports$1, {
       default: function() {
         return _default;
       },
@@ -806,28 +818,23 @@ function requireHead() {
         return defaultHead;
       }
     });
-    const _interop_require_default$1 = _interop_require_default;
-    const _interop_require_wildcard$1 = _interop_require_wildcard;
+    const _interop_require_default = /* @__PURE__ */ require_interop_require_default();
+    const _interop_require_wildcard = /* @__PURE__ */ require_interop_require_wildcard();
     const _jsxruntime = require$$2;
-    const _react = /* @__PURE__ */ _interop_require_wildcard$1._(React);
-    const _sideeffect = /* @__PURE__ */ _interop_require_default$1._(requireSideEffect());
-    const _ampcontextsharedruntime = requireAmpContext_sharedRuntime();
+    const _react = /* @__PURE__ */ _interop_require_wildcard._(React);
+    const _sideeffect = /* @__PURE__ */ _interop_require_default._(requireSideEffect());
     const _headmanagercontextsharedruntime = requireHeadManagerContext_sharedRuntime();
-    const _ampmode = requireAmpMode();
-    const _warnonce = warnOnce;
-    function defaultHead(inAmpMode) {
-      if (inAmpMode === void 0) inAmpMode = false;
+    const _warnonce = requireWarnOnce();
+    function defaultHead() {
       const head2 = [
         /* @__PURE__ */ (0, _jsxruntime.jsx)("meta", {
           charSet: "utf-8"
-        }, "charset")
-      ];
-      if (!inAmpMode) {
-        head2.push(/* @__PURE__ */ (0, _jsxruntime.jsx)("meta", {
+        }, "charset"),
+        /* @__PURE__ */ (0, _jsxruntime.jsx)("meta", {
           name: "viewport",
           content: "width=device-width"
-        }, "viewport"));
-      }
+        }, "viewport")
+      ];
       return head2;
     }
     function onlyReactElement(list, child) {
@@ -909,16 +916,17 @@ function requireHead() {
         return isUnique;
       };
     }
-    function reduceComponents(headChildrenElements, props) {
-      const { inAmpMode } = props;
-      return headChildrenElements.reduce(onlyReactElement, []).reverse().concat(defaultHead(inAmpMode).reverse()).filter(unique()).reverse().map((c, i) => {
+    function reduceComponents(headChildrenElements) {
+      return headChildrenElements.reduce(onlyReactElement, []).reverse().concat(defaultHead().reverse()).filter(unique()).reverse().map((c, i) => {
         const key = c.key || i;
         if (process.env.NODE_ENV === "development") {
           if (c.type === "script" && c.props["type"] !== "application/ld+json") {
-            const srcMessage = c.props["src"] ? '<script> tag with src="' + c.props["src"] + '"' : "inline <script>";
-            (0, _warnonce.warnOnce)("Do not add <script> tags using next/head (see " + srcMessage + "). Use next/script instead. \nSee more info here: https://nextjs.org/docs/messages/no-script-tags-in-head-component");
+            const srcMessage = c.props["src"] ? `<script> tag with src="${c.props["src"]}"` : `inline <script>`;
+            (0, _warnonce.warnOnce)(`Do not add <script> tags using next/head (see ${srcMessage}). Use next/script instead. 
+See more info here: https://nextjs.org/docs/messages/no-script-tags-in-head-component`);
           } else if (c.type === "link" && c.props["rel"] === "stylesheet") {
-            (0, _warnonce.warnOnce)('Do not add stylesheets using next/head (see <link rel="stylesheet"> tag with href="' + c.props["href"] + '"). Use Document instead. \nSee more info here: https://nextjs.org/docs/messages/no-stylesheets-in-head-component');
+            (0, _warnonce.warnOnce)(`Do not add stylesheets using next/head (see <link rel="stylesheet"> tag with href="${c.props["href"]}"). Use Document instead. 
+See more info here: https://nextjs.org/docs/messages/no-stylesheets-in-head-component`);
           }
         }
         return /* @__PURE__ */ _react.default.cloneElement(c, {
@@ -926,22 +934,19 @@ function requireHead() {
         });
       });
     }
-    function Head(param) {
-      let { children } = param;
-      const ampState = (0, _react.useContext)(_ampcontextsharedruntime.AmpStateContext);
+    function Head({ children }) {
       const headManager = (0, _react.useContext)(_headmanagercontextsharedruntime.HeadManagerContext);
       return /* @__PURE__ */ (0, _jsxruntime.jsx)(_sideeffect.default, {
         reduceComponentsToState: reduceComponents,
         headManager,
-        inAmpMode: (0, _ampmode.isInAmpMode)(ampState),
         children
       });
     }
     const _default = Head;
-    if ((typeof exports.default === "function" || typeof exports.default === "object" && exports.default !== null) && typeof exports.default.__esModule === "undefined") {
-      Object.defineProperty(exports.default, "__esModule", { value: true });
-      Object.assign(exports.default, exports);
-      module.exports = exports.default;
+    if ((typeof exports$1.default === "function" || typeof exports$1.default === "object" && exports$1.default !== null) && typeof exports$1.default.__esModule === "undefined") {
+      Object.defineProperty(exports$1.default, "__esModule", { value: true });
+      Object.assign(exports$1.default, exports$1);
+      module.exports = exports$1.default;
     }
   })(head, head.exports);
   return head.exports;
@@ -951,19 +956,19 @@ var hasRequiredImageConfigContext_sharedRuntime;
 function requireImageConfigContext_sharedRuntime() {
   if (hasRequiredImageConfigContext_sharedRuntime) return imageConfigContext_sharedRuntime;
   hasRequiredImageConfigContext_sharedRuntime = 1;
-  (function(exports) {
-    Object.defineProperty(exports, "__esModule", {
+  (function(exports$1) {
+    Object.defineProperty(exports$1, "__esModule", {
       value: true
     });
-    Object.defineProperty(exports, "ImageConfigContext", {
+    Object.defineProperty(exports$1, "ImageConfigContext", {
       enumerable: true,
       get: function() {
         return ImageConfigContext;
       }
     });
-    const _interop_require_default$1 = _interop_require_default;
-    const _react = /* @__PURE__ */ _interop_require_default$1._(React);
-    const _imageconfig = imageConfig;
+    const _interop_require_default = /* @__PURE__ */ require_interop_require_default();
+    const _react = /* @__PURE__ */ _interop_require_default._(React);
+    const _imageconfig = requireImageConfig();
     const ImageConfigContext = _react.default.createContext(_imageconfig.imageConfigDefault);
     if (process.env.NODE_ENV !== "production") {
       ImageConfigContext.displayName = "ImageConfigContext";
@@ -972,6 +977,32 @@ function requireImageConfigContext_sharedRuntime() {
   return imageConfigContext_sharedRuntime;
 }
 var imageLoader = {};
+var findClosestQuality = {};
+var hasRequiredFindClosestQuality;
+function requireFindClosestQuality() {
+  if (hasRequiredFindClosestQuality) return findClosestQuality;
+  hasRequiredFindClosestQuality = 1;
+  (function(exports$1) {
+    Object.defineProperty(exports$1, "__esModule", {
+      value: true
+    });
+    Object.defineProperty(exports$1, "findClosestQuality", {
+      enumerable: true,
+      get: function() {
+        return findClosestQuality2;
+      }
+    });
+    function findClosestQuality2(quality, config) {
+      var _a;
+      const q = quality || 75;
+      if (!((_a = config == null ? void 0 : config.qualities) == null ? void 0 : _a.length)) {
+        return q;
+      }
+      return config.qualities.reduce((prev, cur) => Math.abs(cur - q) < Math.abs(prev - q) ? cur : prev, 0);
+    }
+  })(findClosestQuality);
+  return findClosestQuality;
+}
 var matchLocalPattern = {};
 var picomatch = { exports: {} };
 var hasRequiredPicomatch;
@@ -1039,7 +1070,7 @@ function requirePicomatch() {
         try {
           new RegExp(u3);
         } catch (e4) {
-          return t3.map((t4) => o.escapeRegex(t4)).join("..");
+          return t3.map(((t4) => o.escapeRegex(t4))).join("..");
         }
         return u3;
       };
@@ -1173,7 +1204,7 @@ function requirePicomatch() {
         };
         if (u3.fastpaths !== false && !/(^[*!]|[/()[\]{}"])/.test(t3)) {
           let n2 = false;
-          let s2 = t3.replace(i, (t4, e4, u4, o2, s3, r2) => {
+          let s2 = t3.replace(i, ((t4, e4, u4, o2, s3, r2) => {
             if (o2 === "\\") {
               n2 = true;
               return t4;
@@ -1197,12 +1228,12 @@ function requirePicomatch() {
               return k;
             }
             return e4 ? t4 : `\\${t4}`;
-          });
+          }));
           if (n2 === true) {
             if (u3.unescape === true) {
               s2 = s2.replace(/\\/g, "");
             } else {
-              s2 = s2.replace(/\\+/g, (t4) => t4.length % 2 === 0 ? "\\\\" : t4 ? "\\" : "");
+              s2 = s2.replace(/\\+/g, ((t4) => t4.length % 2 === 0 ? "\\\\" : t4 ? "\\" : ""));
             }
           }
           if (s2 === t3 && u3.contains === true) {
@@ -1739,7 +1770,7 @@ function requirePicomatch() {
       const isObject = (t3) => t3 && typeof t3 === "object" && !Array.isArray(t3);
       const picomatch2 = (t3, e3, u3 = false) => {
         if (Array.isArray(t3)) {
-          const n3 = t3.map((t4) => picomatch2(t4, e3, u3));
+          const n3 = t3.map(((t4) => picomatch2(t4, e3, u3)));
           const arrayMatcher = (t4) => {
             for (const e4 of n3) {
               const u4 = e4(t4);
@@ -1820,7 +1851,7 @@ function requirePicomatch() {
       };
       picomatch2.isMatch = (t3, e3, u3) => picomatch2(e3, u3)(t3);
       picomatch2.parse = (t3, e3) => {
-        if (Array.isArray(t3)) return t3.map((t4) => picomatch2.parse(t4, e3));
+        if (Array.isArray(t3)) return t3.map(((t4) => picomatch2.parse(t4, e3)));
         return o(t3, { ...e3, fastpaths: false });
       };
       picomatch2.scan = (t3, e3) => n(t3, e3);
@@ -2150,7 +2181,7 @@ function requirePicomatch() {
       e2.isRegexChar = (t3) => t3.length === 1 && e2.hasRegexChars(t3);
       e2.escapeRegex = (t3) => t3.replace(r, "\\$1");
       e2.toPosixSlashes = (t3) => t3.replace(n, "/");
-      e2.removeBackslashes = (t3) => t3.replace(o, (t4) => t4 === "\\" ? "" : t4);
+      e2.removeBackslashes = (t3) => t3.replace(o, ((t4) => t4 === "\\" ? "" : t4));
       e2.escapeLast = (t3, u3, n2) => {
         const o2 = t3.lastIndexOf(u3, n2);
         if (o2 === -1) return t3;
@@ -2209,8 +2240,8 @@ var hasRequiredMatchLocalPattern;
 function requireMatchLocalPattern() {
   if (hasRequiredMatchLocalPattern) return matchLocalPattern;
   hasRequiredMatchLocalPattern = 1;
-  (function(exports) {
-    Object.defineProperty(exports, "__esModule", {
+  (function(exports$1) {
+    Object.defineProperty(exports$1, "__esModule", {
       value: true
     });
     function _export(target, all) {
@@ -2219,7 +2250,7 @@ function requireMatchLocalPattern() {
         get: all[name]
       });
     }
-    _export(exports, {
+    _export(exports$1, {
       hasLocalMatch: function() {
         return hasLocalMatch;
       },
@@ -2234,8 +2265,7 @@ function requireMatchLocalPattern() {
           return false;
         }
       }
-      var _pattern_pathname;
-      if (!(0, _picomatch.makeRe)((_pattern_pathname = pattern.pathname) != null ? _pattern_pathname : "**", {
+      if (!(0, _picomatch.makeRe)(pattern.pathname ?? "**", {
         dot: true
       }).test(url.pathname)) {
         return false;
@@ -2257,8 +2287,8 @@ var hasRequiredMatchRemotePattern;
 function requireMatchRemotePattern() {
   if (hasRequiredMatchRemotePattern) return matchRemotePattern;
   hasRequiredMatchRemotePattern = 1;
-  (function(exports) {
-    Object.defineProperty(exports, "__esModule", {
+  (function(exports$1) {
+    Object.defineProperty(exports$1, "__esModule", {
       value: true
     });
     function _export(target, all) {
@@ -2267,7 +2297,7 @@ function requireMatchRemotePattern() {
         get: all[name]
       });
     }
-    _export(exports, {
+    _export(exports$1, {
       hasRemoteMatch: function() {
         return hasRemoteMatch;
       },
@@ -2288,7 +2318,8 @@ function requireMatchRemotePattern() {
         }
       }
       if (pattern.hostname === void 0) {
-        throw Object.defineProperty(new Error("Pattern should define hostname but found\n" + JSON.stringify(pattern)), "__NEXT_ERROR_CODE", {
+        throw Object.defineProperty(new Error(`Pattern should define hostname but found
+${JSON.stringify(pattern)}`), "__NEXT_ERROR_CODE", {
           value: "E410",
           enumerable: false,
           configurable: true
@@ -2303,8 +2334,7 @@ function requireMatchRemotePattern() {
           return false;
         }
       }
-      var _pattern_pathname;
-      if (!(0, _picomatch.makeRe)((_pattern_pathname = pattern.pathname) != null ? _pattern_pathname : "**", {
+      if (!(0, _picomatch.makeRe)(pattern.pathname ?? "**", {
         dot: true
       }).test(url.pathname)) {
         return false;
@@ -2321,37 +2351,44 @@ var hasRequiredImageLoader;
 function requireImageLoader() {
   if (hasRequiredImageLoader) return imageLoader;
   hasRequiredImageLoader = 1;
-  (function(exports) {
-    Object.defineProperty(exports, "__esModule", {
+  (function(exports$1) {
+    Object.defineProperty(exports$1, "__esModule", {
       value: true
     });
-    Object.defineProperty(exports, "default", {
+    Object.defineProperty(exports$1, "default", {
       enumerable: true,
       get: function() {
         return _default;
       }
     });
-    const DEFAULT_Q = 75;
-    function defaultLoader(param) {
-      let { config, src, width, quality } = param;
-      var _config_qualities;
+    const _findclosestquality = requireFindClosestQuality();
+    function defaultLoader({ config, src, width, quality }) {
+      var _a;
+      if (src.startsWith("/") && src.includes("?") && ((_a = config.localPatterns) == null ? void 0 : _a.length) === 1 && config.localPatterns[0].pathname === "**" && config.localPatterns[0].search === "") {
+        throw Object.defineProperty(new Error(`Image with src "${src}" is using a query string which is not configured in images.localPatterns.
+Read more: https://nextjs.org/docs/messages/next-image-unconfigured-localpatterns`), "__NEXT_ERROR_CODE", {
+          value: "E871",
+          enumerable: false,
+          configurable: true
+        });
+      }
       if (process.env.NODE_ENV !== "production") {
         const missingValues = [];
         if (!src) missingValues.push("src");
         if (!width) missingValues.push("width");
         if (missingValues.length > 0) {
-          throw Object.defineProperty(new Error("Next Image Optimization requires " + missingValues.join(", ") + " to be provided. Make sure you pass them as props to the `next/image` component. Received: " + JSON.stringify({
+          throw Object.defineProperty(new Error(`Next Image Optimization requires ${missingValues.join(", ")} to be provided. Make sure you pass them as props to the \`next/image\` component. Received: ${JSON.stringify({
             src,
             width,
             quality
-          })), "__NEXT_ERROR_CODE", {
+          })}`), "__NEXT_ERROR_CODE", {
             value: "E188",
             enumerable: false,
             configurable: true
           });
         }
         if (src.startsWith("//")) {
-          throw Object.defineProperty(new Error('Failed to parse src "' + src + '" on `next/image`, protocol-relative URL (//) must be changed to an absolute URL (http:// or https://)'), "__NEXT_ERROR_CODE", {
+          throw Object.defineProperty(new Error(`Failed to parse src "${src}" on \`next/image\`, protocol-relative URL (//) must be changed to an absolute URL (http:// or https://)`), "__NEXT_ERROR_CODE", {
             value: "E360",
             enumerable: false,
             configurable: true
@@ -2362,7 +2399,8 @@ function requireImageLoader() {
           process.env.NEXT_RUNTIME !== "edge") {
             const { hasLocalMatch } = requireMatchLocalPattern();
             if (!hasLocalMatch(config.localPatterns, src)) {
-              throw Object.defineProperty(new Error("Invalid src prop (" + src + ") on `next/image` does not match `images.localPatterns` configured in your `next.config.js`\nSee more info: https://nextjs.org/docs/messages/next-image-unconfigured-localpatterns"), "__NEXT_ERROR_CODE", {
+              throw Object.defineProperty(new Error(`Invalid src prop (${src}) on \`next/image\` does not match \`images.localPatterns\` configured in your \`next.config.js\`
+See more info: https://nextjs.org/docs/messages/next-image-unconfigured-localpatterns`), "__NEXT_ERROR_CODE", {
                 value: "E426",
                 enumerable: false,
                 configurable: true
@@ -2376,7 +2414,7 @@ function requireImageLoader() {
             parsedSrc = new URL(src);
           } catch (err) {
             console.error(err);
-            throw Object.defineProperty(new Error('Failed to parse src "' + src + '" on `next/image`, if using relative image it must start with a leading slash "/" or be an absolute URL (http:// or https://)'), "__NEXT_ERROR_CODE", {
+            throw Object.defineProperty(new Error(`Failed to parse src "${src}" on \`next/image\`, if using relative image it must start with a leading slash "/" or be an absolute URL (http:// or https://)`), "__NEXT_ERROR_CODE", {
               value: "E63",
               enumerable: false,
               configurable: true
@@ -2386,7 +2424,8 @@ function requireImageLoader() {
           process.env.NEXT_RUNTIME !== "edge") {
             const { hasRemoteMatch } = requireMatchRemotePattern();
             if (!hasRemoteMatch(config.domains, config.remotePatterns, parsedSrc)) {
-              throw Object.defineProperty(new Error("Invalid src prop (" + src + ') on `next/image`, hostname "' + parsedSrc.hostname + '" is not configured under images in your `next.config.js`\nSee more info: https://nextjs.org/docs/messages/next-image-unconfigured-host'), "__NEXT_ERROR_CODE", {
+              throw Object.defineProperty(new Error(`Invalid src prop (${src}) on \`next/image\`, hostname "${parsedSrc.hostname}" is not configured under images in your \`next.config.js\`
+See more info: https://nextjs.org/docs/messages/next-image-unconfigured-host`), "__NEXT_ERROR_CODE", {
                 value: "E231",
                 enumerable: false,
                 configurable: true
@@ -2394,350 +2433,365 @@ function requireImageLoader() {
             }
           }
         }
-        if (quality && config.qualities && !config.qualities.includes(quality)) {
-          throw Object.defineProperty(new Error("Invalid quality prop (" + quality + ") on `next/image` does not match `images.qualities` configured in your `next.config.js`\nSee more info: https://nextjs.org/docs/messages/next-image-unconfigured-qualities"), "__NEXT_ERROR_CODE", {
-            value: "E623",
-            enumerable: false,
-            configurable: true
-          });
-        }
       }
-      const q = quality || ((_config_qualities = config.qualities) == null ? void 0 : _config_qualities.reduce((prev, cur) => Math.abs(cur - DEFAULT_Q) < Math.abs(prev - DEFAULT_Q) ? cur : prev)) || DEFAULT_Q;
-      return config.path + "?url=" + encodeURIComponent(src) + "&w=" + width + "&q=" + q + (src.startsWith("/_next/static/media/") && process.env.NEXT_DEPLOYMENT_ID ? "&dpl=" + process.env.NEXT_DEPLOYMENT_ID : "");
+      const q = (0, _findclosestquality.findClosestQuality)(quality, config);
+      return `${config.path}?url=${encodeURIComponent(src)}&w=${width}&q=${q}${src.startsWith("/_next/static/media/") && process.env.NEXT_DEPLOYMENT_ID ? `&dpl=${process.env.NEXT_DEPLOYMENT_ID}` : ""}`;
     }
     defaultLoader.__next_img_default = true;
     const _default = defaultLoader;
   })(imageLoader);
   return imageLoader;
 }
-(function(module, exports) {
-  "use client";
-  Object.defineProperty(exports, "__esModule", {
-    value: true
-  });
-  Object.defineProperty(exports, "Image", {
-    enumerable: true,
-    get: function() {
-      return Image2;
-    }
-  });
-  const _interop_require_default$1 = _interop_require_default;
-  const _interop_require_wildcard$1 = _interop_require_wildcard;
-  const _jsxruntime = require$$2;
-  const _react = /* @__PURE__ */ _interop_require_wildcard$1._(React);
-  const _reactdom = /* @__PURE__ */ _interop_require_default$1._(ReactDOM);
-  const _head = /* @__PURE__ */ _interop_require_default$1._(requireHead());
-  const _getimgprops = getImgProps;
-  const _imageconfig = imageConfig;
-  const _imageconfigcontextsharedruntime = requireImageConfigContext_sharedRuntime();
-  const _warnonce = warnOnce;
-  const _routercontextsharedruntime = requireRouterContext_sharedRuntime();
-  const _imageloader = /* @__PURE__ */ _interop_require_default$1._(requireImageLoader());
-  const _usemergedref = requireUseMergedRef();
-  const configEnv = process.env.__NEXT_IMAGE_OPTS;
-  if (typeof window === "undefined") {
-    globalThis.__NEXT_IMAGE_IMPORTED = true;
-  }
-  function handleLoading(img, placeholder, onLoadRef, onLoadingCompleteRef, setBlurComplete, unoptimized, sizesInput) {
-    const src = img == null ? void 0 : img.src;
-    if (!img || img["data-loaded-src"] === src) {
-      return;
+var hasRequiredImageComponent;
+function requireImageComponent() {
+  if (hasRequiredImageComponent) return imageComponent.exports;
+  hasRequiredImageComponent = 1;
+  (function(module, exports$1) {
+    "use client";
+    Object.defineProperty(exports$1, "__esModule", {
+      value: true
+    });
+    Object.defineProperty(exports$1, "Image", {
+      enumerable: true,
+      get: function() {
+        return Image2;
+      }
+    });
+    const _interop_require_default = /* @__PURE__ */ require_interop_require_default();
+    const _interop_require_wildcard = /* @__PURE__ */ require_interop_require_wildcard();
+    const _jsxruntime = require$$2;
+    const _react = /* @__PURE__ */ _interop_require_wildcard._(React);
+    const _reactdom = /* @__PURE__ */ _interop_require_default._(ReactDOM);
+    const _head = /* @__PURE__ */ _interop_require_default._(requireHead());
+    const _getimgprops = requireGetImgProps();
+    const _imageconfig = requireImageConfig();
+    const _imageconfigcontextsharedruntime = requireImageConfigContext_sharedRuntime();
+    const _warnonce = requireWarnOnce();
+    const _routercontextsharedruntime = requireRouterContext_sharedRuntime();
+    const _imageloader = /* @__PURE__ */ _interop_require_default._(requireImageLoader());
+    const _usemergedref = requireUseMergedRef();
+    const configEnv = process.env.__NEXT_IMAGE_OPTS;
+    if (typeof window === "undefined") {
+      globalThis.__NEXT_IMAGE_IMPORTED = true;
     }
-    img["data-loaded-src"] = src;
-    const p = "decode" in img ? img.decode() : Promise.resolve();
-    p.catch(() => {
-    }).then(() => {
-      if (!img.parentElement || !img.isConnected) {
+    function handleLoading(img, placeholder, onLoadRef, onLoadingCompleteRef, setBlurComplete, unoptimized, sizesInput) {
+      const src = img == null ? void 0 : img.src;
+      if (!img || img["data-loaded-src"] === src) {
         return;
       }
-      if (placeholder !== "empty") {
-        setBlurComplete(true);
-      }
-      if (onLoadRef == null ? void 0 : onLoadRef.current) {
-        const event = new Event("load");
-        Object.defineProperty(event, "target", {
-          writable: false,
-          value: img
-        });
-        let prevented = false;
-        let stopped = false;
-        onLoadRef.current({
-          ...event,
-          nativeEvent: event,
-          currentTarget: img,
-          target: img,
-          isDefaultPrevented: () => prevented,
-          isPropagationStopped: () => stopped,
-          persist: () => {
-          },
-          preventDefault: () => {
-            prevented = true;
-            event.preventDefault();
-          },
-          stopPropagation: () => {
-            stopped = true;
-            event.stopPropagation();
-          }
-        });
-      }
-      if (onLoadingCompleteRef == null ? void 0 : onLoadingCompleteRef.current) {
-        onLoadingCompleteRef.current(img);
-      }
-      if (process.env.NODE_ENV !== "production") {
-        const origSrc = new URL(src, "http://n").searchParams.get("url") || src;
-        if (img.getAttribute("data-nimg") === "fill") {
-          if (!unoptimized && (!sizesInput || sizesInput === "100vw")) {
-            let widthViewportRatio = img.getBoundingClientRect().width / window.innerWidth;
-            if (widthViewportRatio < 0.6) {
-              if (sizesInput === "100vw") {
-                (0, _warnonce.warnOnce)('Image with src "' + origSrc + '" has "fill" prop and "sizes" prop of "100vw", but image is not rendered at full viewport width. Please adjust "sizes" to improve page performance. Read more: https://nextjs.org/docs/api-reference/next/image#sizes');
-              } else {
-                (0, _warnonce.warnOnce)('Image with src "' + origSrc + '" has "fill" but is missing "sizes" prop. Please add it to improve page performance. Read more: https://nextjs.org/docs/api-reference/next/image#sizes');
+      img["data-loaded-src"] = src;
+      const p = "decode" in img ? img.decode() : Promise.resolve();
+      p.catch(() => {
+      }).then(() => {
+        if (!img.parentElement || !img.isConnected) {
+          return;
+        }
+        if (placeholder !== "empty") {
+          setBlurComplete(true);
+        }
+        if (onLoadRef == null ? void 0 : onLoadRef.current) {
+          const event = new Event("load");
+          Object.defineProperty(event, "target", {
+            writable: false,
+            value: img
+          });
+          let prevented = false;
+          let stopped = false;
+          onLoadRef.current({
+            ...event,
+            nativeEvent: event,
+            currentTarget: img,
+            target: img,
+            isDefaultPrevented: () => prevented,
+            isPropagationStopped: () => stopped,
+            persist: () => {
+            },
+            preventDefault: () => {
+              prevented = true;
+              event.preventDefault();
+            },
+            stopPropagation: () => {
+              stopped = true;
+              event.stopPropagation();
+            }
+          });
+        }
+        if (onLoadingCompleteRef == null ? void 0 : onLoadingCompleteRef.current) {
+          onLoadingCompleteRef.current(img);
+        }
+        if (process.env.NODE_ENV !== "production") {
+          const origSrc = new URL(src, "http://n").searchParams.get("url") || src;
+          if (img.getAttribute("data-nimg") === "fill") {
+            if (!unoptimized && (!sizesInput || sizesInput === "100vw")) {
+              let widthViewportRatio = img.getBoundingClientRect().width / window.innerWidth;
+              if (widthViewportRatio < 0.6) {
+                if (sizesInput === "100vw") {
+                  (0, _warnonce.warnOnce)(`Image with src "${origSrc}" has "fill" prop and "sizes" prop of "100vw", but image is not rendered at full viewport width. Please adjust "sizes" to improve page performance. Read more: https://nextjs.org/docs/api-reference/next/image#sizes`);
+                } else {
+                  (0, _warnonce.warnOnce)(`Image with src "${origSrc}" has "fill" but is missing "sizes" prop. Please add it to improve page performance. Read more: https://nextjs.org/docs/api-reference/next/image#sizes`);
+                }
               }
             }
-          }
-          if (img.parentElement) {
-            const { position } = window.getComputedStyle(img.parentElement);
-            const valid = [
-              "absolute",
-              "fixed",
-              "relative"
-            ];
-            if (!valid.includes(position)) {
-              (0, _warnonce.warnOnce)('Image with src "' + origSrc + '" has "fill" and parent element with invalid "position". Provided "' + position + '" should be one of ' + valid.map(String).join(",") + ".");
+            if (img.parentElement) {
+              const { position } = window.getComputedStyle(img.parentElement);
+              const valid = [
+                "absolute",
+                "fixed",
+                "relative"
+              ];
+              if (!valid.includes(position)) {
+                (0, _warnonce.warnOnce)(`Image with src "${origSrc}" has "fill" and parent element with invalid "position". Provided "${position}" should be one of ${valid.map(String).join(",")}.`);
+              }
+            }
+            if (img.height === 0) {
+              (0, _warnonce.warnOnce)(`Image with src "${origSrc}" has "fill" and a height value of 0. This is likely because the parent element of the image has not been styled to have a set height.`);
             }
           }
-          if (img.height === 0) {
-            (0, _warnonce.warnOnce)('Image with src "' + origSrc + '" has "fill" and a height value of 0. This is likely because the parent element of the image has not been styled to have a set height.');
+          const heightModified = img.height.toString() !== img.getAttribute("height");
+          const widthModified = img.width.toString() !== img.getAttribute("width");
+          if (heightModified && !widthModified || !heightModified && widthModified) {
+            (0, _warnonce.warnOnce)(`Image with src "${origSrc}" has either width or height modified, but not the other. If you use CSS to change the size of your image, also include the styles 'width: "auto"' or 'height: "auto"' to maintain the aspect ratio.`);
           }
         }
-        const heightModified = img.height.toString() !== img.getAttribute("height");
-        const widthModified = img.width.toString() !== img.getAttribute("width");
-        if (heightModified && !widthModified || !heightModified && widthModified) {
-          (0, _warnonce.warnOnce)('Image with src "' + origSrc + `" has either width or height modified, but not the other. If you use CSS to change the size of your image, also include the styles 'width: "auto"' or 'height: "auto"' to maintain the aspect ratio.`);
-        }
+      });
+    }
+    function getDynamicProps(fetchPriority) {
+      if (Boolean(_react.use)) {
+        return {
+          fetchPriority
+        };
       }
-    });
-  }
-  function getDynamicProps(fetchPriority) {
-    if (Boolean(_react.use)) {
       return {
-        fetchPriority
+        fetchpriority: fetchPriority
       };
     }
-    return {
-      fetchpriority: fetchPriority
-    };
-  }
-  const ImageElement = /* @__PURE__ */ (0, _react.forwardRef)((param, forwardedRef) => {
-    let { src, srcSet, sizes, height, width, decoding, className, style, fetchPriority, placeholder, loading, unoptimized, fill, onLoadRef, onLoadingCompleteRef, setBlurComplete, setShowAltText, sizesInput, onLoad, onError, ...rest } = param;
-    const ownRef = (0, _react.useCallback)((img) => {
-      if (!img) {
-        return;
-      }
-      if (onError) {
-        img.src = img.src;
-      }
-      if (process.env.NODE_ENV !== "production") {
-        if (!src) {
-          console.error('Image is missing required "src" property:', img);
+    const ImageElement = /* @__PURE__ */ (0, _react.forwardRef)(({ src, srcSet, sizes, height, width, decoding, className, style, fetchPriority, placeholder, loading, unoptimized, fill, onLoadRef, onLoadingCompleteRef, setBlurComplete, setShowAltText, sizesInput, onLoad, onError, ...rest }, forwardedRef) => {
+      const ownRef = (0, _react.useCallback)((img) => {
+        if (!img) {
+          return;
         }
-        if (img.getAttribute("alt") === null) {
-          console.error('Image is missing required "alt" property. Please add Alternative Text to describe the image for screen readers and search engines.');
+        if (onError) {
+          img.src = img.src;
         }
-      }
-      if (img.complete) {
-        handleLoading(img, placeholder, onLoadRef, onLoadingCompleteRef, setBlurComplete, unoptimized, sizesInput);
-      }
-    }, [
-      src,
-      placeholder,
-      onLoadRef,
-      onLoadingCompleteRef,
-      setBlurComplete,
-      onError,
-      unoptimized,
-      sizesInput
-    ]);
-    const ref = (0, _usemergedref.useMergedRef)(forwardedRef, ownRef);
-    return /* @__PURE__ */ (0, _jsxruntime.jsx)("img", {
-      ...rest,
-      ...getDynamicProps(fetchPriority),
-      // It's intended to keep `loading` before `src` because React updates
-      // props in order which causes Safari/Firefox to not lazy load properly.
-      // See https://github.com/facebook/react/issues/25883
-      loading,
-      width,
-      height,
-      decoding,
-      "data-nimg": fill ? "fill" : "1",
-      className,
-      style,
-      // It's intended to keep `src` the last attribute because React updates
-      // attributes in order. If we keep `src` the first one, Safari will
-      // immediately start to fetch `src`, before `sizes` and `srcSet` are even
-      // updated by React. That causes multiple unnecessary requests if `srcSet`
-      // and `sizes` are defined.
-      // This bug cannot be reproduced in Chrome or Firefox.
-      sizes,
-      srcSet,
-      src,
-      ref,
-      onLoad: (event) => {
-        const img = event.currentTarget;
-        handleLoading(img, placeholder, onLoadRef, onLoadingCompleteRef, setBlurComplete, unoptimized, sizesInput);
-      },
-      onError: (event) => {
-        setShowAltText(true);
-        if (placeholder !== "empty") {
-          setBlurComplete(true);
+        if (process.env.NODE_ENV !== "production") {
+          if (!src) {
+            console.error(`Image is missing required "src" property:`, img);
+          }
+          if (img.getAttribute("alt") === null) {
+            console.error(`Image is missing required "alt" property. Please add Alternative Text to describe the image for screen readers and search engines.`);
+          }
         }
-        if (onError) {
-          onError(event);
+        if (img.complete) {
+          handleLoading(img, placeholder, onLoadRef, onLoadingCompleteRef, setBlurComplete, unoptimized, sizesInput);
         }
-      }
-    });
-  });
-  function ImagePreload(param) {
-    let { isAppRouter, imgAttributes } = param;
-    const opts = {
-      as: "image",
-      imageSrcSet: imgAttributes.srcSet,
-      imageSizes: imgAttributes.sizes,
-      crossOrigin: imgAttributes.crossOrigin,
-      referrerPolicy: imgAttributes.referrerPolicy,
-      ...getDynamicProps(imgAttributes.fetchPriority)
-    };
-    if (isAppRouter && _reactdom.default.preload) {
-      _reactdom.default.preload(imgAttributes.src, opts);
-      return null;
-    }
-    return /* @__PURE__ */ (0, _jsxruntime.jsx)(_head.default, {
-      children: /* @__PURE__ */ (0, _jsxruntime.jsx)("link", {
-        rel: "preload",
-        // Note how we omit the `href` attribute, as it would only be relevant
-        // for browsers that do not support `imagesrcset`, and in those cases
-        // it would cause the incorrect image to be preloaded.
-        //
-        // https://html.spec.whatwg.org/multipage/semantics.html#attr-link-imagesrcset
-        href: imgAttributes.srcSet ? void 0 : imgAttributes.src,
-        ...opts
-      }, "__nimg-" + imgAttributes.src + imgAttributes.srcSet + imgAttributes.sizes)
+      }, [
+        src,
+        placeholder,
+        onLoadRef,
+        onLoadingCompleteRef,
+        setBlurComplete,
+        onError,
+        unoptimized,
+        sizesInput
+      ]);
+      const ref = (0, _usemergedref.useMergedRef)(forwardedRef, ownRef);
+      return /* @__PURE__ */ (0, _jsxruntime.jsx)("img", {
+        ...rest,
+        ...getDynamicProps(fetchPriority),
+        // It's intended to keep `loading` before `src` because React updates
+        // props in order which causes Safari/Firefox to not lazy load properly.
+        // See https://github.com/facebook/react/issues/25883
+        loading,
+        width,
+        height,
+        decoding,
+        "data-nimg": fill ? "fill" : "1",
+        className,
+        style,
+        // It's intended to keep `src` the last attribute because React updates
+        // attributes in order. If we keep `src` the first one, Safari will
+        // immediately start to fetch `src`, before `sizes` and `srcSet` are even
+        // updated by React. That causes multiple unnecessary requests if `srcSet`
+        // and `sizes` are defined.
+        // This bug cannot be reproduced in Chrome or Firefox.
+        sizes,
+        srcSet,
+        src,
+        ref,
+        onLoad: (event) => {
+          const img = event.currentTarget;
+          handleLoading(img, placeholder, onLoadRef, onLoadingCompleteRef, setBlurComplete, unoptimized, sizesInput);
+        },
+        onError: (event) => {
+          setShowAltText(true);
+          if (placeholder !== "empty") {
+            setBlurComplete(true);
+          }
+          if (onError) {
+            onError(event);
+          }
+        }
+      });
     });
-  }
-  const Image2 = /* @__PURE__ */ (0, _react.forwardRef)((props, forwardedRef) => {
-    const pagesRouter = (0, _react.useContext)(_routercontextsharedruntime.RouterContext);
-    const isAppRouter = !pagesRouter;
-    const configContext = (0, _react.useContext)(_imageconfigcontextsharedruntime.ImageConfigContext);
-    const config = (0, _react.useMemo)(() => {
-      var _c_qualities;
-      const c = configEnv || configContext || _imageconfig.imageConfigDefault;
-      const allSizes = [
-        ...c.deviceSizes,
-        ...c.imageSizes
-      ].sort((a, b) => a - b);
-      const deviceSizes = c.deviceSizes.sort((a, b) => a - b);
-      const qualities = (_c_qualities = c.qualities) == null ? void 0 : _c_qualities.sort((a, b) => a - b);
-      return {
-        ...c,
-        allSizes,
-        deviceSizes,
-        qualities
+    function ImagePreload({ isAppRouter, imgAttributes }) {
+      const opts = {
+        as: "image",
+        imageSrcSet: imgAttributes.srcSet,
+        imageSizes: imgAttributes.sizes,
+        crossOrigin: imgAttributes.crossOrigin,
+        referrerPolicy: imgAttributes.referrerPolicy,
+        ...getDynamicProps(imgAttributes.fetchPriority)
       };
-    }, [
-      configContext
-    ]);
-    const { onLoad, onLoadingComplete } = props;
-    const onLoadRef = (0, _react.useRef)(onLoad);
-    (0, _react.useEffect)(() => {
-      onLoadRef.current = onLoad;
-    }, [
-      onLoad
-    ]);
-    const onLoadingCompleteRef = (0, _react.useRef)(onLoadingComplete);
-    (0, _react.useEffect)(() => {
-      onLoadingCompleteRef.current = onLoadingComplete;
-    }, [
-      onLoadingComplete
-    ]);
-    const [blurComplete, setBlurComplete] = (0, _react.useState)(false);
-    const [showAltText, setShowAltText] = (0, _react.useState)(false);
-    const { props: imgAttributes, meta: imgMeta } = (0, _getimgprops.getImgProps)(props, {
-      defaultLoader: _imageloader.default,
-      imgConf: config,
-      blurComplete,
-      showAltText
-    });
-    return /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
-      children: [
-        /* @__PURE__ */ (0, _jsxruntime.jsx)(ImageElement, {
-          ...imgAttributes,
-          unoptimized: imgMeta.unoptimized,
-          placeholder: imgMeta.placeholder,
-          fill: imgMeta.fill,
-          onLoadRef,
-          onLoadingCompleteRef,
-          setBlurComplete,
-          setShowAltText,
-          sizesInput: props.sizes,
-          ref: forwardedRef
-        }),
-        imgMeta.priority ? /* @__PURE__ */ (0, _jsxruntime.jsx)(ImagePreload, {
-          isAppRouter,
-          imgAttributes
-        }) : null
-      ]
+      if (isAppRouter && _reactdom.default.preload) {
+        _reactdom.default.preload(imgAttributes.src, opts);
+        return null;
+      }
+      return /* @__PURE__ */ (0, _jsxruntime.jsx)(_head.default, {
+        children: /* @__PURE__ */ (0, _jsxruntime.jsx)("link", {
+          rel: "preload",
+          // Note how we omit the `href` attribute, as it would only be relevant
+          // for browsers that do not support `imagesrcset`, and in those cases
+          // it would cause the incorrect image to be preloaded.
+          //
+          // https://html.spec.whatwg.org/multipage/semantics.html#attr-link-imagesrcset
+          href: imgAttributes.srcSet ? void 0 : imgAttributes.src,
+          ...opts
+        }, "__nimg-" + imgAttributes.src + imgAttributes.srcSet + imgAttributes.sizes)
+      });
+    }
+    const Image2 = /* @__PURE__ */ (0, _react.forwardRef)((props, forwardedRef) => {
+      const pagesRouter = (0, _react.useContext)(_routercontextsharedruntime.RouterContext);
+      const isAppRouter = !pagesRouter;
+      const configContext = (0, _react.useContext)(_imageconfigcontextsharedruntime.ImageConfigContext);
+      const config = (0, _react.useMemo)(() => {
+        var _a;
+        const c = configEnv || configContext || _imageconfig.imageConfigDefault;
+        const allSizes = [
+          ...c.deviceSizes,
+          ...c.imageSizes
+        ].sort((a, b) => a - b);
+        const deviceSizes = c.deviceSizes.sort((a, b) => a - b);
+        const qualities = (_a = c.qualities) == null ? void 0 : _a.sort((a, b) => a - b);
+        return {
+          ...c,
+          allSizes,
+          deviceSizes,
+          qualities,
+          // During the SSR, configEnv (__NEXT_IMAGE_OPTS) does not include
+          // security sensitive configs like `localPatterns`, which is needed
+          // during the server render to ensure it's validated. Therefore use
+          // configContext, which holds the config from the server for validation.
+          localPatterns: typeof window === "undefined" ? configContext == null ? void 0 : configContext.localPatterns : c.localPatterns
+        };
+      }, [
+        configContext
+      ]);
+      const { onLoad, onLoadingComplete } = props;
+      const onLoadRef = (0, _react.useRef)(onLoad);
+      (0, _react.useEffect)(() => {
+        onLoadRef.current = onLoad;
+      }, [
+        onLoad
+      ]);
+      const onLoadingCompleteRef = (0, _react.useRef)(onLoadingComplete);
+      (0, _react.useEffect)(() => {
+        onLoadingCompleteRef.current = onLoadingComplete;
+      }, [
+        onLoadingComplete
+      ]);
+      const [blurComplete, setBlurComplete] = (0, _react.useState)(false);
+      const [showAltText, setShowAltText] = (0, _react.useState)(false);
+      const { props: imgAttributes, meta: imgMeta } = (0, _getimgprops.getImgProps)(props, {
+        defaultLoader: _imageloader.default,
+        imgConf: config,
+        blurComplete,
+        showAltText
+      });
+      return /* @__PURE__ */ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
+        children: [
+          /* @__PURE__ */ (0, _jsxruntime.jsx)(ImageElement, {
+            ...imgAttributes,
+            unoptimized: imgMeta.unoptimized,
+            placeholder: imgMeta.placeholder,
+            fill: imgMeta.fill,
+            onLoadRef,
+            onLoadingCompleteRef,
+            setBlurComplete,
+            setShowAltText,
+            sizesInput: props.sizes,
+            ref: forwardedRef
+          }),
+          imgMeta.preload ? /* @__PURE__ */ (0, _jsxruntime.jsx)(ImagePreload, {
+            isAppRouter,
+            imgAttributes
+          }) : null
+        ]
+      });
     });
-  });
-  if ((typeof exports.default === "function" || typeof exports.default === "object" && exports.default !== null) && typeof exports.default.__esModule === "undefined") {
-    Object.defineProperty(exports.default, "__esModule", { value: true });
-    Object.assign(exports.default, exports);
-    module.exports = exports.default;
-  }
-})(imageComponent, imageComponent.exports);
-var imageComponentExports = imageComponent.exports;
-(function(exports) {
-  Object.defineProperty(exports, "__esModule", {
-    value: true
-  });
-  function _export(target, all) {
-    for (var name in all) Object.defineProperty(target, name, {
-      enumerable: true,
-      get: all[name]
+    if ((typeof exports$1.default === "function" || typeof exports$1.default === "object" && exports$1.default !== null) && typeof exports$1.default.__esModule === "undefined") {
+      Object.defineProperty(exports$1.default, "__esModule", { value: true });
+      Object.assign(exports$1.default, exports$1);
+      module.exports = exports$1.default;
+    }
+  })(imageComponent, imageComponent.exports);
+  return imageComponent.exports;
+}
+var hasRequiredImageExternal;
+function requireImageExternal() {
+  if (hasRequiredImageExternal) return imageExternal;
+  hasRequiredImageExternal = 1;
+  (function(exports$1) {
+    Object.defineProperty(exports$1, "__esModule", {
+      value: true
     });
-  }
-  _export(exports, {
-    default: function() {
-      return _default;
-    },
-    getImageProps: function() {
-      return getImageProps;
+    function _export(target, all) {
+      for (var name in all) Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+      });
     }
-  });
-  const _interop_require_default$1 = _interop_require_default;
-  const _getimgprops = getImgProps;
-  const _imagecomponent = imageComponentExports;
-  const _imageloader = /* @__PURE__ */ _interop_require_default$1._(requireImageLoader());
-  function getImageProps(imgProps) {
-    const { props } = (0, _getimgprops.getImgProps)(imgProps, {
-      defaultLoader: _imageloader.default,
-      // This is replaced by webpack define plugin
-      imgConf: process.env.__NEXT_IMAGE_OPTS
+    _export(exports$1, {
+      default: function() {
+        return _default;
+      },
+      getImageProps: function() {
+        return getImageProps;
+      }
     });
-    for (const [key, value] of Object.entries(props)) {
-      if (value === void 0) {
-        delete props[key];
+    const _interop_require_default = /* @__PURE__ */ require_interop_require_default();
+    const _getimgprops = requireGetImgProps();
+    const _imagecomponent = requireImageComponent();
+    const _imageloader = /* @__PURE__ */ _interop_require_default._(requireImageLoader());
+    function getImageProps(imgProps) {
+      const { props } = (0, _getimgprops.getImgProps)(imgProps, {
+        defaultLoader: _imageloader.default,
+        // This is replaced by webpack define plugin
+        imgConf: process.env.__NEXT_IMAGE_OPTS
+      });
+      for (const [key, value] of Object.entries(props)) {
+        if (value === void 0) {
+          delete props[key];
+        }
       }
+      return {
+        props
+      };
     }
-    return {
-      props
-    };
-  }
-  const _default = _imagecomponent.Image;
-})(imageExternal);
-var image = imageExternal;
-const Image = /* @__PURE__ */ getDefaultExportFromCjs(image);
+    const _default = _imagecomponent.Image;
+  })(imageExternal);
+  return imageExternal;
+}
+var image;
+var hasRequiredImage;
+function requireImage() {
+  if (hasRequiredImage) return image;
+  hasRequiredImage = 1;
+  image = requireImageExternal();
+  return image;
+}
+var imageExports = requireImage();
+const Image = /* @__PURE__ */ getDefaultExportFromCjs(imageExports);
 export {
   Image as I
 };
-//# sourceMappingURL=image-CEz9QtOW.js.map
+//# sourceMappingURL=image-BBS8QO15.js.map