"use client";
import { jsx as e, jsxs as t } from "react/jsx-runtime";
import { useEffect as c } from "react";
import { Navigation as C } from "swiper/modules";
import { Swiper as v, SwiperSlide as u } from "swiper/react";
import { useSwiper as R } from "../../utils/useSwiper/useSwiper.es.js";
import { cn as E } from "../../utils/cn/cn.es.js";
/* empty css                                                                       */
/* empty css                                                                                   */
/* empty css                                                                                   */
import i from "../../modules/ResearchEssentialReadings/researchEssentialReadings.module.css";
import { Typography as k } from "../../components/Typography/Typography.es.js";
import { ProgressButton as m } from "../../components/ProgressButton/ProgressButton.es.js";
import { ReadingCard as b } from "./components/ReadingCard/ReadingCard.es.js";
const P = [C], H = ({ readings: s }) => {
  const {
    swiper: r,
    isEnd: o,
    isBeginning: l,
    setIsEnd: p,
    hideNav: h,
    handleSlideChange: f,
    handlePrevClick: a,
    handleNextClick: n,
    onSwiperInit: g,
    handleSwiperResize: w,
    handleSlideTo: d
  } = R();
  return c(() => {
    r == null || r.setProgress(0, 300);
  }, [r]), c(() => {
    s.length && d(0);
  }, [s, d]), /* @__PURE__ */ e("div", { className: i.root, children: /* @__PURE__ */ t("div", { className: i.container, children: [
    /* @__PURE__ */ t("div", { className: i.topRow, children: [
      /* @__PURE__ */ e("div", { className: i.headerWrapper, children: /* @__PURE__ */ e("div", { className: i.header, children: /* @__PURE__ */ e(k, { defaultVariant: "displayXs", mobileVariant: "headingLg", children: "Essential Readings" }) }) }),
      /* @__PURE__ */ e(
        "div",
        {
          className: E(i.swiperControlsDesktop, {
            [i.swiperControlsHidden]: h
          }),
          children: /* @__PURE__ */ e(
            m,
            {
              left: {
                disabled: l,
                onClick: a
              },
              right: {
                disabled: o,
                onClick: n
              }
            }
          )
        }
      )
    ] }),
    /* @__PURE__ */ e("div", { className: i.carouselArea, children: /* @__PURE__ */ e(
      v,
      {
        onSwiper: g,
        onResize: w,
        onSlideChange: f,
        onReachEnd: () => p(!0),
        modules: P,
        spaceBetween: 0,
        slidesPerView: "auto",
        className: i.swiper,
        children: s.map((N, S) => /* @__PURE__ */ e(u, { className: i.swiperSlide, children: /* @__PURE__ */ e(b, { ...N }) }, S))
      }
    ) }),
    /* @__PURE__ */ e("div", { className: i.swiperControlsMobile, children: /* @__PURE__ */ e(
      m,
      {
        left: {
          disabled: l,
          onClick: a
        },
        right: {
          disabled: o,
          onClick: n
        }
      }
    ) })
  ] }) });
};
export {
  H as ResearchEssentialReadings
};
