@axos-web-dev/shared-components 1.0.10 → 1.0.12

package/dist/ATMLocator/ATMLocator.js

@@ -20,6 +20,7 @@ import "react-use";
 import "../Accordion/Accordion.js";
 import "../Accordion/Accordion.css.js";
 import "../AlertBanner/AlertBanner.css.js";
+import "next/image.js";
 import "../Article/Article.css.js";
 import "../ArticlesSet/ArticlesSet.css.js";
 /* empty css                                              */
@@ -36,7 +37,6 @@ import "../Carousel/index.js";
 import "../Hyperlink/Hyperlink.css.js";
 /* empty css                                                                    */
 import "../Comparison/Comparison.css.js";
-import "next/image.js";
 import "../HeroBanner/HeroBanner.css.js";
 import "../HeroBanner/LargeBanner.css.js";
 import "../HeroBanner/SelectionBanner.css.js";

package/dist/Article/Article.js

@@ -1,10 +1,10 @@
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { getVariant } from "../utils/getVariant.js";
-import "react";
-import { LazyImage } from "../utils/lazyImage/lazyImage.js";
+import { OptimizeImage } from "../utils/optimizeImage/OptimizeImage.js";
 import { ant_article, ant_img, ant_content, ant_eyebrow, ant_card_title, ant_card_body, ant_card_cta } from "./Article.css.js";
 import { Button } from "../Button/Button.js";
 import "../Button/Button.css.js";
+import "react";
 import "react-use";
 const Article = ({
   id,
@@ -22,11 +22,14 @@ const Article = ({
       className: `${ant_article({ variant })} flex flex_col rounded`,
       id: `id_${id}`,
       children: [
-        /* @__PURE__ */ jsx("div", { className: ant_img, role: "presentation", children: /* @__PURE__ */ jsxs("picture", { children: [
-          /* @__PURE__ */ jsx("source", { srcSet: `${image?.src}?fm=avif`, type: "image/avif" }),
-          /* @__PURE__ */ jsx("source", { srcSet: `${image?.src}?fm=webp`, type: "image/webp" }),
-          /* @__PURE__ */ jsx(LazyImage, { src: `${image?.src}?q=85`, alt: image?.alt ?? "" })
-        ] }) }),
+        /* @__PURE__ */ jsx("div", { className: ant_img, role: "presentation", children: /* @__PURE__ */ jsx(
+          OptimizeImage,
+          {
+            src: `${image?.src}`,
+            alt: image?.alt ?? "",
+            fill: true
+          }
+        ) }),
         /* @__PURE__ */ jsxs("div", { className: `${ant_content} flex flex_col between`, children: [
           /* @__PURE__ */ jsxs("div", { children: [
             /* @__PURE__ */ jsx("span", { className: `${ant_eyebrow({ variant })}`, children: itemType }),

package/dist/Button/Button.js

@@ -15,6 +15,7 @@ import { getVariant } from "../utils/getVariant.js";
 import clsx from "clsx";
 import { useState, createElement } from "react";
 import "../AlertBanner/AlertBanner.css.js";
+import "next/image.js";
 import "../Article/Article.css.js";
 import { button } from "./Button.css.js";
 import "react-use";
@@ -64,7 +65,6 @@ import "../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";
 import "../Carousel/index.js";
 /* empty css                                                                    */
 import "../Comparison/Comparison.css.js";
-import "next/image.js";
 import "../HeroBanner/HeroBanner.css.js";
 import "../HeroBanner/LargeBanner.css.js";
 import "../HeroBanner/SelectionBanner.css.js";

package/dist/Calculators/Calculator.js

@@ -21,6 +21,7 @@ import "../Accordion/Accordion.js";
 import "../Accordion/Accordion.css.js";
 import "../AlertBanner/AlertBanner.css.js";
 import { useRef, useEffect } from "react";
+import "next/image.js";
 import "../Article/Article.css.js";
 import "../ArticlesSet/ArticlesSet.css.js";
 /* empty css                                              */
@@ -40,7 +41,6 @@ import "../Carousel/index.js";
 import "../Hyperlink/Hyperlink.css.js";
 /* empty css                                                                    */
 import "../Comparison/Comparison.css.js";
-import "next/image.js";
 import "../HeroBanner/HeroBanner.css.js";
 import "../HeroBanner/LargeBanner.css.js";
 import "../HeroBanner/SelectionBanner.css.js";

package/dist/Carousel/index.js

@@ -20,6 +20,7 @@ import "../Accordion/Accordion.js";
 import "../Accordion/Accordion.css.js";
 import "../AlertBanner/AlertBanner.css.js";
 import React, { useEffect, Children, cloneElement } from "react";
+import "next/image.js";
 import "../Article/Article.css.js";
 import "../Interstitial/Interstitial-variants.css.js";
 import "../Chevron/Chevron.css.js";
@@ -66,7 +67,6 @@ import "../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";
 /* empty css                                                    */
 /* empty css                                                                    */
 import "../Comparison/Comparison.css.js";
-import "next/image.js";
 import "../HeroBanner/HeroBanner.css.js";
 import "../HeroBanner/LargeBanner.css.js";
 import "../HeroBanner/SelectionBanner.css.js";

package/dist/Chevron/index.js

@@ -12,6 +12,7 @@ import "../Accordion/Accordion.css.js";
 import "../AlertBanner/AlertBanner.css.js";
 import { getVariant } from "../utils/getVariant.js";
 import { useState } from "react";
+import "next/image.js";
 import "../Article/Article.css.js";
 import { Interstitial } from "../Interstitial/Interstitial.js";
 import { chevron, chevron_wrapper } from "./Chevron.css.js";
@@ -66,7 +67,6 @@ import "../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";
 import "../Carousel/index.js";
 /* empty css                                                                    */
 import "../Comparison/Comparison.css.js";
-import "next/image.js";
 import "../HeroBanner/HeroBanner.css.js";
 import "../HeroBanner/LargeBanner.css.js";
 import "../HeroBanner/SelectionBanner.css.js";

package/dist/Comparison/Comparison.js

@@ -19,6 +19,7 @@ import '../assets/VideoWrapper/VideoWrapper.css';import '../assets/VideoTile/Vid
 /* empty css                                                    */
 /* empty css                                                */
 import "../AlertBanner/AlertBanner.css.js";
+import "next/image.js";
 import "../Article/Article.css.js";
 import "../ArticlesSet/ArticlesSet.css.js";
 import "../utils/allowedAxosDomains.js";
@@ -64,7 +65,6 @@ import "../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";
 import "../Carousel/index.js";
 /* empty css                                                                    */
 import { comparison_layout, headerComparison, feature_header, feature_title, comparison_feature, comparison_list, comparison_buttons, comparison } from "./Comparison.css.js";
-import "next/image.js";
 import "../HeroBanner/HeroBanner.css.js";
 import "../HeroBanner/LargeBanner.css.js";
 import "../HeroBanner/SelectionBanner.css.js";

package/dist/ExecutiveBio/ExecutiveBio.js

@@ -2,7 +2,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useRef, useState, useEffect, createElement } from "react";
 import { getVariant } from "../utils/getVariant.js";
-import { LazyImage } from "../utils/lazyImage/lazyImage.js";
+import { OptimizeImage } from "../utils/optimizeImage/OptimizeImage.js";
 import { executive_bio, padding, item_bio, shift, media, headshot, img_area, description, person, headline_setting, job_title, copy, contacts, contact_col, svg_icon, contact_entry, url_row } from "./ExecutiveBio.css.js";
 import "../Accordion/Accordion.js";
 import "../Accordion/Accordion.css.js";
@@ -66,7 +66,6 @@ import "../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";
 import "../Carousel/index.js";
 /* empty css                                                                    */
 import "../Comparison/Comparison.css.js";
-import "next/image.js";
 import "../HeroBanner/HeroBanner.css.js";
 import "../HeroBanner/LargeBanner.css.js";
 import "../HeroBanner/SelectionBanner.css.js";
@@ -83,6 +82,7 @@ import "../ImageBillboard/ImageBillboard.css.js";
 /* empty css                                        */
 /* empty css                                              */
 /* empty css                                                      */
+import "next/image.js";
 /* empty css                                            */
 /* empty css                                    */
 import "../LandingPageHeader/LandingPageHeader.css.js";
@@ -147,29 +147,14 @@ const ExecutiveBio = ({
     }
   }, []);
   return /* @__PURE__ */ jsx("section", { className: `section_spacer ${executive_bio}`, id, children: /* @__PURE__ */ jsx("div", { className: "containment", children: /* @__PURE__ */ jsx("div", { className: `${padding} ${item_bio({ variant })} rounded`, children: /* @__PURE__ */ jsxs("div", { className: `${shift} flex`, children: [
-    executiveHeadshot && /* @__PURE__ */ jsx("div", { className: media, children: /* @__PURE__ */ jsx("div", { className: headshot, children: /* @__PURE__ */ jsx("div", { className: img_area, role: "presentation", children: /* @__PURE__ */ jsxs("picture", { children: [
-      /* @__PURE__ */ jsx(
-        "source",
-        {
-          srcSet: `${executiveHeadshot?.src}?fm=avif`,
-          type: "image/avif"
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "source",
-        {
-          srcSet: `${executiveHeadshot?.src}?fm=webp`,
-          type: "image/webp"
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        LazyImage,
-        {
-          src: `${executiveHeadshot?.src}?q=85`,
-          alt: ""
-        }
-      )
-    ] }) }) }) }),
+    executiveHeadshot && /* @__PURE__ */ jsx("div", { className: media, children: /* @__PURE__ */ jsx("div", { className: headshot, children: /* @__PURE__ */ jsx("div", { className: img_area, role: "presentation", children: /* @__PURE__ */ jsx(
+      OptimizeImage,
+      {
+        src: executiveHeadshot?.src,
+        alt: "",
+        fill: true
+      }
+    ) }) }) }),
     /* @__PURE__ */ jsxs("div", { className: `${description} flex_col between`, children: [
       /* @__PURE__ */ jsxs("div", { className: person, children: [
         executiveName && createElement(

package/dist/FaqAccordion/index.js

@@ -17,6 +17,7 @@ import { icon } from "../Accordion/Accordion.css.js";
 import { Chevron } from "../Chevron/index.js";
 import "../AlertBanner/AlertBanner.css.js";
 import { getVariant } from "../utils/getVariant.js";
+import "next/image.js";
 import "../Article/Article.css.js";
 import "../ArticlesSet/ArticlesSet.css.js";
 import "../IconBillboard/IconBillboard.css.js";
@@ -65,7 +66,6 @@ import "../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";
 import "../Carousel/index.js";
 /* empty css                                                                    */
 import "../Comparison/Comparison.css.js";
-import "next/image.js";
 import "../HeroBanner/HeroBanner.css.js";
 import "../HeroBanner/LargeBanner.css.js";
 import "../HeroBanner/SelectionBanner.css.js";

package/dist/FooterSiteMap/AxosBank/FooterSiteMap.js

@@ -12,6 +12,7 @@ import "clsx";
 import "react";
 import "../../Chevron/Chevron.css.js";
 import "../../AlertBanner/AlertBanner.css.js";
+import "next/image.js";
 import "../../Article/Article.css.js";
 import "../../IconBillboard/IconBillboard.css.js";
 import { findMoreAxosDomains } from "../../utils/allowedAxosDomains.js";
@@ -62,7 +63,6 @@ import "../../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";
 import "../../Carousel/index.js";
 /* empty css                                                                       */
 import "../../Comparison/Comparison.css.js";
-import "next/image.js";
 import "../../HeroBanner/HeroBanner.css.js";
 import "../../HeroBanner/LargeBanner.css.js";
 import "../../HeroBanner/SelectionBanner.css.js";

package/dist/Forms/ApplyNow.js

@@ -23,6 +23,7 @@ import "../Accordion/Accordion.js";
 import "../Accordion/Accordion.css.js";
 import "../AlertBanner/AlertBanner.css.js";
 import { useReducer } from "react";
+import "next/image.js";
 import "../Article/Article.css.js";
 import "../ArticlesSet/ArticlesSet.css.js";
 import "../Calculators/calculator.css.js";
@@ -66,7 +67,6 @@ import "../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";
 import "../Carousel/index.js";
 /* empty css                                                                    */
 import "../Comparison/Comparison.css.js";
-import "next/image.js";
 import "../HeroBanner/HeroBanner.css.js";
 import "../HeroBanner/LargeBanner.css.js";
 import "../HeroBanner/SelectionBanner.css.js";

package/dist/Forms/ContactUsBusiness.js

@@ -28,6 +28,7 @@ import clsx from "clsx";
 import "react";
 import "../Chevron/Chevron.css.js";
 import "../AlertBanner/AlertBanner.css.js";
+import "next/image.js";
 import "../Article/Article.css.js";
 import { Button } from "../Button/Button.js";
 import "../Button/Button.css.js";
@@ -66,7 +67,6 @@ import "../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";
 import "../Carousel/index.js";
 /* empty css                                                                    */
 import "../Comparison/Comparison.css.js";
-import "next/image.js";
 import "../HeroBanner/HeroBanner.css.js";
 import "../HeroBanner/LargeBanner.css.js";
 import "../HeroBanner/SelectionBanner.css.js";

package/dist/Forms/ContactUsNMLSId.js

@@ -28,6 +28,7 @@ import clsx from "clsx";
 import "react";
 import "../Chevron/Chevron.css.js";
 import "../AlertBanner/AlertBanner.css.js";
+import "next/image.js";
 import "../Article/Article.css.js";
 import { Button } from "../Button/Button.js";
 import "../Button/Button.css.js";
@@ -66,7 +67,6 @@ import "../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";
 import "../Carousel/index.js";
 /* empty css                                                                    */
 import "../Comparison/Comparison.css.js";
-import "next/image.js";
 import "../HeroBanner/HeroBanner.css.js";
 import "../HeroBanner/LargeBanner.css.js";
 import "../HeroBanner/SelectionBanner.css.js";

package/dist/Forms/CraPublicFile.js

@@ -28,6 +28,7 @@ import clsx from "clsx";
 import "react";
 import "../Chevron/Chevron.css.js";
 import "../AlertBanner/AlertBanner.css.js";
+import "next/image.js";
 import "../Article/Article.css.js";
 import { Button } from "../Button/Button.js";
 import "../Button/Button.css.js";
@@ -66,7 +67,6 @@ import "../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";
 import "../Carousel/index.js";
 /* empty css                                                                    */
 import "../Comparison/Comparison.css.js";
-import "next/image.js";
 import "../HeroBanner/HeroBanner.css.js";
 import "../HeroBanner/LargeBanner.css.js";
 import "../HeroBanner/SelectionBanner.css.js";

package/dist/Forms/EmailOnly.js

@@ -28,6 +28,7 @@ import clsx from "clsx";
 import "react";
 import "../Chevron/Chevron.css.js";
 import "../AlertBanner/AlertBanner.css.js";
+import "next/image.js";
 import "../Article/Article.css.js";
 import { Button } from "../Button/Button.js";
 import "../Button/Button.css.js";
@@ -67,7 +68,6 @@ import "../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";
 import "../Carousel/index.js";
 /* empty css                                                                    */
 import "../Comparison/Comparison.css.js";
-import "next/image.js";
 import "../HeroBanner/HeroBanner.css.js";
 import "../HeroBanner/LargeBanner.css.js";
 import "../HeroBanner/SelectionBanner.css.js";

package/dist/Forms/MortgageRate/MortgageRateForm.js

@@ -21,6 +21,7 @@ import "../../Accordion/Accordion.js";
 import "../../Accordion/Accordion.css.js";
 import "../../AlertBanner/AlertBanner.css.js";
 import { useState, useEffect } from "react";
+import "next/image.js";
 import "../../Article/Article.css.js";
 import "../../ArticlesSet/ArticlesSet.css.js";
 import "../../Calculators/calculator.css.js";
@@ -66,7 +67,6 @@ import "../../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";
 import "../../Carousel/index.js";
 /* empty css                                                                       */
 import "../../Comparison/Comparison.css.js";
-import "next/image.js";
 import "../../HeroBanner/HeroBanner.css.js";
 import "../../HeroBanner/LargeBanner.css.js";
 import "../../HeroBanner/SelectionBanner.css.js";

package/dist/Forms/MortgageRate/MortgageRateWatch.js

@@ -35,6 +35,7 @@ import "../../utils/allowedAxosDomains.js";
 import "../../Accordion/Accordion.js";
 import "../../Accordion/Accordion.css.js";
 import "../../AlertBanner/AlertBanner.css.js";
+import "next/image.js";
 import "../../Article/Article.css.js";
 import "../../ArticlesSet/ArticlesSet.css.js";
 import "../../Calculators/calculator.css.js";
@@ -63,7 +64,6 @@ import "../../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";
 import "../../Carousel/index.js";
 /* empty css                                                                       */
 import "../../Comparison/Comparison.css.js";
-import "next/image.js";
 import "../../HeroBanner/HeroBanner.css.js";
 import "../../HeroBanner/LargeBanner.css.js";
 import "../../HeroBanner/SelectionBanner.css.js";

package/dist/Forms/SuccesForm.js

@@ -17,6 +17,7 @@ import "../Accordion/Accordion.js";
 import "../Accordion/Accordion.css.js";
 import "../AlertBanner/AlertBanner.css.js";
 import "react";
+import "next/image.js";
 import "../Article/Article.css.js";
 import "../ArticlesSet/ArticlesSet.css.js";
 import "../Calculators/calculator.css.js";
@@ -38,7 +39,6 @@ import "../Carousel/index.js";
 import "../Hyperlink/Hyperlink.css.js";
 /* empty css                                                                    */
 import "../Comparison/Comparison.css.js";
-import "next/image.js";
 import "../HeroBanner/HeroBanner.css.js";
 import "../HeroBanner/LargeBanner.css.js";
 import "../HeroBanner/SelectionBanner.css.js";

package/dist/HeroBanner/HeroBanner.css.d.ts

@@ -72,4 +72,3 @@ export declare const headline_text: import('@vanilla-extract/recipes').RuntimeFn
 }>;
 export declare const hero_btns: string;
 export declare const hero_embedded_image: string;
-export declare const img_contents: string;

package/dist/HeroBanner/HeroBanner.css.js

@@ -17,7 +17,6 @@ var heroSupertag = createRuntimeFn({ defaultClassName: "_1ye8k3fc", variantClass
 var headline_text = createRuntimeFn({ defaultClassName: "_1ye8k3fh", variantClassNames: { variant: { primary: "_1ye8k3fi", secondary: "_1ye8k3fj", tertiary: "_1ye8k3fk", quaternary: "_1ye8k3fl" } }, defaultVariants: {}, compoundVariants: [] });
 var hero_btns = "_1ye8k3fm";
 var hero_embedded_image = "_1ye8k3fn";
-var img_contents = "_1ye8k3fo";
 export {
   headline_text,
   heroSupertag,
@@ -28,7 +27,6 @@ export {
   hero_img,
   hero_text,
   hero_wrapper,
-  img_contents,
   logout,
   reversed,
   reversed_lg_image

package/dist/HeroBanner/HeroBanner.js

@@ -5,9 +5,9 @@ import "react";
 import "react-use";
 import { Chevron } from "../Chevron/index.js";
 import { getVariant } from "../utils/getVariant.js";
-import Image from "next/image.js";
+import { OptimizeImage } from "../utils/optimizeImage/OptimizeImage.js";
 import clsx from "clsx";
-import { logout, hero_banner, hero_wrapper, hero_content, reversed, hero_text, heroSupertag, headline_text, hero_btns, hero_img, img_contents, reversed_lg_image } from "./HeroBanner.css.js";
+import { logout, hero_banner, hero_wrapper, hero_content, reversed, hero_text, heroSupertag, headline_text, hero_btns, hero_img, reversed_lg_image } from "./HeroBanner.css.js";
 import { lg_hero_banner, lg_hero_content, lg_hero_text, lg_hero_eyebrow, lg_headline_text, lg_hero_img, lg_hero_sizing } from "./LargeBanner.css.js";
 import { selection_section_icon_img, selection_section_icon, selection_section, selection_section_bg, selection_section_content, selection_headline_text } from "./SelectionBanner.css.js";
 const HeroBanner = ({
@@ -106,34 +106,18 @@ const HeroBanner = ({
                 )
               ) })
             ] }),
-            !isSelectionBanner ? /* @__PURE__ */ jsx("div", { className: hero_img, role: "presentation", children: /* @__PURE__ */ jsxs("picture", { className: img_contents, children: [
-              /* @__PURE__ */ jsx(
-                "source",
-                {
-                  srcSet: `https:${image?.src}?fm=avif&w=604&h=480&fit=fill`,
-                  type: "image/avif"
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                "source",
-                {
-                  srcSet: `https:${image?.src}?fm=webp&w=604&h=480&fit=fill`,
-                  type: "image/webp"
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                Image,
-                {
-                  className: "img_fluid",
-                  style: { color: "transparent" },
-                  src: `https:${image?.src}?w=604&h=480&fit=fill&q=85`,
-                  alt: "",
-                  height: 480,
-                  width: 604,
-                  priority: true
-                }
-              )
-            ] }) }) : /* @__PURE__ */ jsxs("div", { className: selection_section, children: [
+            !isSelectionBanner ? /* @__PURE__ */ jsx("div", { className: hero_img, role: "presentation", children: /* @__PURE__ */ jsx(
+              OptimizeImage,
+              {
+                className: "img_fluid",
+                src: `${image?.src}`,
+                alt: "",
+                height: 480,
+                width: 604,
+                unoptimized: false,
+                priority: true
+              }
+            ) }) : /* @__PURE__ */ jsxs("div", { className: selection_section, children: [
               /* @__PURE__ */ jsx("div", { className: selection_section_bg }),
               /* @__PURE__ */ jsxs("div", { className: selection_section_content, children: [
                 /* @__PURE__ */ jsxs("div", { children: [
@@ -304,33 +288,18 @@ const HeroBanner = ({
               {
                 className: `${lg_hero_img} ${imagePlacement !== "Right" ? reversed_lg_image : ""} rounded`,
                 role: "presentation",
-                children: /* @__PURE__ */ jsxs("picture", { className: img_contents, children: [
-                  /* @__PURE__ */ jsx(
-                    "source",
-                    {
-                      srcSet: `https:${image?.src}?fm=avif`,
-                      type: "image/avif"
-                    }
-                  ),
-                  /* @__PURE__ */ jsx(
-                    "source",
-                    {
-                      srcSet: `https:${image?.src}?fm=webp`,
-                      type: "image/webp"
-                    }
-                  ),
-                  /* @__PURE__ */ jsx(
-                    Image,
-                    {
-                      src: `https:${image?.src}?q=85`,
-                      className: lg_hero_sizing,
-                      alt: "",
-                      height: 600,
-                      width: 792,
-                      priority: true
-                    }
-                  )
-                ] })
+                children: /* @__PURE__ */ jsx(
+                  OptimizeImage,
+                  {
+                    src: `${image?.src}`,
+                    className: lg_hero_sizing,
+                    alt: "",
+                    height: 600,
+                    width: 792,
+                    priority: true,
+                    unoptimized: false
+                  }
+                )
               }
             )
           ]

package/dist/HeroBanner/index.js

@@ -1,5 +1,5 @@
 import { HeroBanner } from "./HeroBanner.js";
-import { headline_text, heroSupertag, hero_banner, hero_btns, hero_content, hero_embedded_image, hero_img, hero_text, hero_wrapper, img_contents, logout, reversed, reversed_lg_image } from "./HeroBanner.css.js";
+import { headline_text, heroSupertag, hero_banner, hero_btns, hero_content, hero_embedded_image, hero_img, hero_text, hero_wrapper, logout, reversed, reversed_lg_image } from "./HeroBanner.css.js";
 import { selection_headline_text, selection_section, selection_section_bg, selection_section_content, selection_section_icon, selection_section_icon_img } from "./SelectionBanner.css.js";
 export {
   HeroBanner,
@@ -12,7 +12,6 @@ export {
   hero_img,
   hero_text,
   hero_wrapper,
-  img_contents,
   logout,
   reversed,
   reversed_lg_image,

package/dist/Hyperlink/index.js

@@ -13,6 +13,7 @@ import clsx from "clsx";
 import "react";
 import "../Chevron/Chevron.css.js";
 import "../AlertBanner/AlertBanner.css.js";
+import "next/image.js";
 import "../Article/Article.css.js";
 import "../IconBillboard/IconBillboard.css.js";
 import { findMoreAxosDomains } from "../utils/allowedAxosDomains.js";
@@ -63,7 +64,6 @@ import "../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";
 import "../Carousel/index.js";
 /* empty css                                                                    */
 import "../Comparison/Comparison.css.js";
-import "next/image.js";
 import "../HeroBanner/HeroBanner.css.js";
 import "../HeroBanner/LargeBanner.css.js";
 import "../HeroBanner/SelectionBanner.css.js";

package/dist/ImageBillboard/ImageBillboardSet.js

@@ -14,7 +14,7 @@ import '../assets/icons/FollowIcon/FollowIcon.css';import '../assets/icons/Downl
 /* empty css                                                    */
 /* empty css                                                */
 import { getVariant } from "../utils/getVariant.js";
-import { LazyImage } from "../utils/lazyImage/lazyImage.js";
+import { OptimizeImage } from "../utils/optimizeImage/OptimizeImage.js";
 import clsx from "clsx";
 import { billboard_img, image_background, up_to, rate_billboard, apy_billboard, rate_pad, rate_container, body, billboard_body, billboard_header_section, supertag, header, body_copy, sub_bullets, billboard_ctas, billboard, imagePlacement } from "./ImageBillboard.css.js";
 const ImageBillboard = ({
@@ -64,11 +64,14 @@ const ImageBillboard = ({
         position === "right" && "reversed"
       ),
       children: [
-        /* @__PURE__ */ jsx("div", { className: `${billboard_img} flex`, children: image ? /* @__PURE__ */ jsx("div", { className: image_background, role: "presentation", children: /* @__PURE__ */ jsxs("picture", { children: [
-          /* @__PURE__ */ jsx("source", { srcSet: `${image?.src}?fm=avif`, type: "image/avif" }),
-          /* @__PURE__ */ jsx("source", { srcSet: `${image?.src}?fm=webp`, type: "image/webp" }),
-          /* @__PURE__ */ jsx(LazyImage, { src: `${image?.src}?q=85`, alt: image?.alt ?? "" })
-        ] }) }) : /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx("div", { className: `${billboard_img} flex`, children: image ? /* @__PURE__ */ jsx("div", { className: image_background, role: "presentation", children: /* @__PURE__ */ jsx(
+          OptimizeImage,
+          {
+            src: image?.src,
+            alt: image?.alt ?? "",
+            fill: true
+          }
+        ) }) : /* @__PURE__ */ jsx(
           "div",
           {
             className: clsx(

package/dist/ImageLink/ImageLink.js

@@ -16,6 +16,7 @@ import "../Accordion/Accordion.js";
 import "../Accordion/Accordion.css.js";
 import "../AlertBanner/AlertBanner.css.js";
 import { isValidElement } from "react";
+import "next/image.js";
 import "../Article/Article.css.js";
 import "../ArticlesSet/ArticlesSet.css.js";
 import "../Calculators/calculator.css.js";
@@ -75,7 +76,6 @@ import "../ImageBillboard/ImageBillboard.css.js";
 /* empty css                             */
 /* empty css                                              */
 /* empty css                                                      */
-import "next/image.js";
 /* empty css                                            */
 /* empty css                                    */
 import "../LandingPageHeader/LandingPageHeader.css.js";

package/dist/ImageLink/ImageLinkSet.js

@@ -22,6 +22,7 @@ import "../SetContainer/SetContainer.css.js";
 import "../Accordion/Accordion.js";
 import "../Accordion/Accordion.css.js";
 import "../AlertBanner/AlertBanner.css.js";
+import "next/image.js";
 import "../Article/Article.css.js";
 import "../ArticlesSet/ArticlesSet.css.js";
 import "../Calculators/calculator.css.js";
@@ -75,7 +76,6 @@ import "../FaqAccordion/index.js";
 import "../FooterDisclosure/FooterDisclosure.css.js";
 /* empty css                                                          */
 /* empty css                                                         */
-import "next/image.js";
 import "../HeroBanner/LargeBanner.css.js";
 import "../HeroBanner/SelectionBanner.css.js";
 import "../ImageBillboard/ImageBillboard.css.js";

package/dist/ImageLink/index.js

@@ -12,6 +12,7 @@ import "clsx";
 import "react";
 import "../Chevron/Chevron.css.js";
 import "../AlertBanner/AlertBanner.css.js";
+import "next/image.js";
 import "../Article/Article.css.js";
 import "../IconBillboard/IconBillboard.css.js";
 import "../utils/allowedAxosDomains.js";
@@ -61,7 +62,6 @@ import "../Calculators/SummitApyCalculator/BalanceAPYCalculator.css.js";
 import "../Carousel/index.js";
 /* empty css                                                                    */
 import "../Comparison/Comparison.css.js";
-import "next/image.js";
 import "../HeroBanner/HeroBanner.css.js";
 import "../HeroBanner/LargeBanner.css.js";
 import "../HeroBanner/SelectionBanner.css.js";