import { jsx as m, jsxs as i } from "react/jsx-runtime";
import { cn as t } from "../../../../utils/cn/cn.es.js";
import a from "../../../../components/AdvancedGallery/components/ImageGalleryPagination/imageGalleryPagination.module.css";
import { Icon as s } from "../../../Icon/Icon.es.js";
import { EIconName as p } from "../../../Icon/constants.es.js";
const N = ({
  items: r,
  activeIndex: n,
  className: l,
  onSelect: c
}) => /* @__PURE__ */ m("div", { className: t(a.root, l), children: r.map((o, e) => /* @__PURE__ */ i(
  "button",
  {
    type: "button",
    className: t(a.thumbnailButton, { [a.active]: e === n }),
    onClick: () => c(e),
    children: [
      /* @__PURE__ */ m(
        "img",
        {
          src: o.mediaType === "image" ? o.url : o.preview,
          alt: `thumbnail ${e + 1}`,
          className: a.thumbnailImage
        }
      ),
      o.mediaType === "video" && o.videoType === "complex" && /* @__PURE__ */ m("div", { className: a.customPlayButton, children: /* @__PURE__ */ m(s, { className: a.icon, name: p.ALT_PLAY }) })
    ]
  },
  e
)) });
export {
  N as ImageGalleryPagination
};
