import { jsx as r, jsxs as a } from "react/jsx-runtime";
import { HighlightedTitle as c } from "../../components/HighlightedTitle/HighlightedTitle.es.js";
import { StudyGridCard as u } from "../../components/StudyGridCard/StudyGridCard.es.js";
import { Typography as f } from "../../components/Typography/Typography.es.js";
import i from "../../modules/Studies/studies.module.css";
import { Button as g } from "../../components/Button/Button.es.js";
function T({
  title: l,
  description: o,
  articles: m,
  allStudiesLink: d,
  trackingEvent: n,
  trackingLocation: h
}) {
  const p = m.reduce(
    (e, t) => {
      const s = e[e.length - 1];
      return s.length < 2 ? s.push(t) : e.push([t]), e;
    },
    [[]]
  );
  return /* @__PURE__ */ r("section", { className: i.root, children: /* @__PURE__ */ a("div", { className: i.container, children: [
    /* @__PURE__ */ a("div", { className: i.header, children: [
      /* @__PURE__ */ r(c, { title: l }),
      o && /* @__PURE__ */ r(f, { as: "p", defaultVariant: "bodyLg", className: i.description, children: o }),
      d && /* @__PURE__ */ r("div", { children: /* @__PURE__ */ r(g, { as: "a", variant: "muted", size: "lg", href: d, children: "view all studies" }) })
    ] }),
    /* @__PURE__ */ r("div", { className: i.articles, children: p.map((e, t) => /* @__PURE__ */ r("div", { className: i.row, children: e.map((s) => /* @__PURE__ */ r(
      u,
      {
        ...s,
        trackingEvent: n,
        trackingLocation: h
      },
      s.title
    )) }, t)) })
  ] }) });
}
export {
  T as Studies
};
