@anoki/fse-ui/dist/index.es65.js

FSE UI components library

import { j as i } from "./index.es278.js";
import { Swiper as n, SwiperSlide as m } from "./index.es303.js";
import p from "./index.es300.js";
import u from "./index.es301.js";
import S from "./index.es302.js";
import './components/ui/Carousel/Carousel.css';import './node_modules/swiper/modules/pagination.css';import './node_modules/swiper/modules/navigation.css';import './node_modules/swiper/swiper.css';/* empty css            */
/* empty css            */
/* empty css            */
/* empty css            */
import { SectionHeading as f } from "./index.es229.js";
import { ArrowLink as g } from "./index.es21.js";
function I({
  title: a,
  children: r = [],
  type: c = "default",
  linkHref: o,
  linkLabel: t = "Scopri tutti",
  asLink: d = "a"
}) {
  return /* @__PURE__ */ i.jsxs("section", { className: "carousel-wrapper", "aria-label": a || void 0, children: [
    /* @__PURE__ */ i.jsx(
      f,
      {
        title: a,
        color: c === "sectionHome" ? "slate-20" : "primary",
        className: "carousel-title",
        titleMarginBottom: "0",
        children: o && /* @__PURE__ */ i.jsx(
          g,
          {
            href: o,
            asLink: d,
            fs: "7",
            "aria-label": a ? `${t} - ${a}` : t,
            children: t.toUpperCase()
          }
        )
      }
    ),
    /* @__PURE__ */ i.jsx("div", { className: "carousel-outer-wrapper", children: /* @__PURE__ */ i.jsx(
      n,
      {
        className: "carousel-inner-wrapper",
        spaceBetween: 24,
        modules: [p, u, S],
        a11y: {
          prevSlideMessage: "Slide precedente",
          nextSlideMessage: "Slide successiva",
          lastSlideMessage: "",
          firstSlideMessage: ""
        },
        watchSlidesProgress: !0,
        breakpoints: {
          0: {
            slidesPerView: 1,
            spaceBetween: 24,
            centeredSlides: !0
          },
          768: {
            slidesPerView: 2,
            spaceBetween: 24,
            centeredSlides: !1
          },
          992: {
            slidesPerView: 3,
            spaceBetween: 24,
            centeredSlides: !1
          }
        },
        pagination: r.length > 3 ? {
          enabled: !0,
          clickable: !0
        } : {},
        loop: r.length > 3,
        navigation: r.length > 3,
        onInit: (e) => {
          e.slides.forEach((s) => {
            s.inert = !s.classList.contains("swiper-slide-visible");
          }), e.slides.slice(
            e.activeIndex,
            e.activeIndex + Number(e.params.slidesPerView)
          ).forEach((s, l) => {
            s.classList.remove("lastViewableSlide"), (l + 1) % Number(e.params.slidesPerView) === 0 && s.classList.add("lastViewableSlide");
          });
        },
        onSlideChange: (e) => {
          e.slides.forEach((s) => {
            s.inert = !s.classList.contains("swiper-slide-visible");
          }), e.slides.slice(
            e.activeIndex,
            e.activeIndex + Number(e.params.slidesPerView)
          ).forEach((s, l) => {
            s.classList.remove("lastViewableSlide"), (l + 1) % Number(e.params.slidesPerView) === 0 && s.classList.add("lastViewableSlide");
          });
        },
        children: r.map((e, s) => /* @__PURE__ */ i.jsx(m, { className: "swiper-slide-custom", children: e }, s))
      }
    ) })
  ] });
}
export {
  I as Carousel
};
//# sourceMappingURL=index.es65.js.map