import { jsx as e, jsxs as i } from "react/jsx-runtime";
import { MiddleCarousel as m } from "../../pageComponents/HomepageHero/components/MiddleCarousel/MiddleCarousel.es.js";
import { Button as l } from "../../components/Button/Button.es.js";
import a from "../../modules/HomepageHeroV2/homepageHeroV2.module.css";
import { Icon as c } from "../../components/Icon/Icon.es.js";
import { EIconName as d } from "../../components/Icon/constants.es.js";
import { Typography as s } from "../../components/Typography/Typography.es.js";
function v({ title: n, description: o, button: t, buttonInverted: r }) {
  return /* @__PURE__ */ e("section", { className: a.root, "data-type": "hero", children: /* @__PURE__ */ i("div", { className: a.container, children: [
    /* @__PURE__ */ i("div", { className: a.textContent, children: [
      /* @__PURE__ */ i("div", { className: a.hsaContainer, children: [
        /* @__PURE__ */ e(c, { name: d.CIRCLE_CHECK, className: a.checkIcon }),
        /* @__PURE__ */ e(s, { className: a.hsaText, as: "p", defaultVariant: "bodySm", children: "HSA/FSA Eligible" })
      ] }),
      /* @__PURE__ */ e("div", { className: a.titleWrapper, children: /* @__PURE__ */ e(
        s,
        {
          className: a.title,
          as: "h2",
          defaultVariant: "displayXs",
          mobileVariant: "headingLg",
          children: n
        }
      ) }),
      /* @__PURE__ */ e(s, { className: a.description, as: "p", defaultVariant: "bodySm", mobileVariant: "bodyXs", children: o }),
      /* @__PURE__ */ i("div", { className: a.buttonContainer, children: [
        /* @__PURE__ */ e(l, { as: "a", href: t.link, variant: "secondary", size: "md", children: t.text }),
        r && /* @__PURE__ */ e(l, { as: "a", href: r.link, variant: "muted-invert", size: "md", children: r.text })
      ] })
    ] }),
    /* @__PURE__ */ e("div", { className: a.carouselArea, children: /* @__PURE__ */ e(m, {}) })
  ] }) });
}
export {
  v as HomepageHeroV2
};
