@achs/webkit/dist/components/molecules/Paginate/index.mjs

Conjunto de componentes de UI con el estilo del Sistema de Diseño ACHS (Asociación Chilena de Seguridad), para reutilizar de forma transversal en las aplicaciones web de ACHS. Construido con **React 19**, **TypeScript** y **Vite**, con soporte para las

import { jsxs as c, jsx as t } from "react/jsx-runtime";
import a from "./Paginate.module.scss.mjs";
const f = ({
  currentPage: i,
  totalPages: n,
  onPageChange: e
}) => {
  if (!n) return null;
  const d = (s) => {
    s >= 1 && s <= n && e && e(s);
  }, o = () => {
    const s = [];
    if (n <= 5)
      for (let l = 1; l <= n; l++)
        s.push(
          /* @__PURE__ */ t(
            "button",
            {
              type: "button",
              className: `${a.pageButton} ${i === l ? a.active : ""}`,
              onClick: () => d(l),
              "aria-current": i === l ? "page" : void 0,
              "aria-label": `Página ${l}`,
              children: l
            },
            l
          )
        );
    else {
      s.push(
        /* @__PURE__ */ t(
          "button",
          {
            type: "button",
            className: `${a.pageButton} ${i === 1 ? a.active : ""}`,
            onClick: () => d(1),
            "aria-current": i === 1 ? "page" : void 0,
            "aria-label": "Página 1",
            children: "1"
          },
          1
        )
      ), i >= 4 && s.push(/* @__PURE__ */ t("span", { className: a.ellipsis, children: "..." }, "ellipsis-start"));
      let l = 0, h = 0;
      i < 2 ? (l = 2, h = 4) : i >= 2 && i < n - 3 ? (l = Math.max(2, i - 1), h = Math.min(n - 1, i + 1)) : (l = n - 3, h = n - 1);
      for (let p = l; p <= h; p++)
        s.push(
          /* @__PURE__ */ t(
            "button",
            {
              type: "button",
              className: `${a.pageButton} ${i === p ? a.active : ""}`,
              onClick: () => d(p),
              "aria-current": i === p ? "page" : void 0,
              "aria-label": `Página ${p}`,
              children: p
            },
            p
          )
        );
      i < n - 2 && s.push(/* @__PURE__ */ t("span", { className: a.ellipsis, children: "..." }, "ellipsis-end")), n > 1 && b(
        s,
        i,
        n,
        d,
        a
      );
    }
    return s;
  };
  return /* @__PURE__ */ c("nav", { className: a.paginateContainer, "aria-label": "Paginación", children: [
    /* @__PURE__ */ c(
      "button",
      {
        type: "button",
        className: `${a.navButton} ${i === 1 ? a.disabled : ""}`,
        onClick: () => d(i - 1),
        disabled: i === 1,
        children: [
          /* @__PURE__ */ t("span", { className: a.chevronLeft, "aria-hidden": "true" }),
          "Anterior"
        ]
      }
    ),
    o(),
    /* @__PURE__ */ c(
      "button",
      {
        type: "button",
        className: `${a.navButton} ${i === n ? a.disabled : ""}`,
        onClick: () => d(i + 1),
        disabled: i === n,
        children: [
          "Siguiente",
          /* @__PURE__ */ t("span", { className: a.chevronRight, "aria-hidden": "true" })
        ]
      }
    )
  ] });
};
function b(i, n, e, d, o) {
  i.push(
    /* @__PURE__ */ t(
      "button",
      {
        type: "button",
        className: `${o.pageButton} ${n === e ? o.active : ""}`,
        onClick: () => d(e),
        "aria-current": n === e ? "page" : void 0,
        "aria-label": `Página ${e}`,
        children: e
      },
      e
    )
  );
}
export {
  f as Paginate,
  f as default
};