"use client";
import { jsx, jsxs } from "react/jsx-runtime";
import { CaretLeft } from "../../atoms/Icon/CaretLeft.js";
import { CaretRight } from "../../atoms/Icon/CaretRight.js";
import { DoubleCaretLeft } from "../../atoms/Icon/DoubleCaretLeft.js";
import { DoubleCaretRight } from "../../atoms/Icon/DoubleCaretRight.js";
import { PageLink } from "./PageLink.js";
import { Flex } from "../../atoms/Flex/Flex.js";
import { Spacing } from "../../tokens/Spacing.js";
function PaginationNav({ current, total, linkProps }) {
  const pages = (current < 4 ? [1, 2, 3, 4, 5] : current > total - 3 ? [total - 4, total - 3, total - 2, total - 1, total] : [current - 2, current - 1, current, current + 1, current + 2]).filter((page) => page > 0 && page <= total);
  const previous = Math.max(current - 1, 1);
  const next = Math.min(current + 1, total);
  const renderFirstAndLastPageButtons = total > 5;
  return /* @__PURE__ */ jsx("nav", { children: /* @__PURE__ */ jsxs(Flex.Row, { as: "ul", gap: Spacing["8px"], onKeyDown: moveFocusWithArrowKeys, children: [
    renderFirstAndLastPageButtons ? /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(PageLink, { page: 1, ...linkProps({ page: 1 }), children: /* @__PURE__ */ jsx(DoubleCaretLeft, {}) }) }) : null,
    /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(PageLink, { page: previous, ...linkProps({ page: previous }), children: /* @__PURE__ */ jsx(CaretLeft, {}) }) }),
    pages.map((page) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(PageLink, { page, ...linkProps({ page }), isCurrent: page === current }) }, page)),
    /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(PageLink, { page: next, ...linkProps({ page: next }), children: /* @__PURE__ */ jsx(CaretRight, {}) }) }),
    renderFirstAndLastPageButtons ? /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(PageLink, { page: total, ...linkProps({ page: total }), children: /* @__PURE__ */ jsx(DoubleCaretRight, {}) }) }) : null
  ] }) });
}
function moveFocusWithArrowKeys(event) {
  if ((event.key === "ArrowLeft" || event.key === "ArrowRight") && event.target instanceof HTMLAnchorElement) {
    const listItem = event.target.parentElement;
    if (!listItem) return;
    const next = event.key === "ArrowRight" ? listItem.nextElementSibling : listItem.previousElementSibling;
    if (!next) return;
    next.firstChild.focus();
  }
}
export {
  PaginationNav
};
