@coko/client/dist/ui/common/Pagination.js

Client side common code for coko apps

import { noop as e } from "../../toolkit/funcs.js";
import { grid as t, th as n } from "../../toolkit/themeHelper.js";
import "../../toolkit/index.js";
import { useEffect as r, useImperativeHandle as i, useRef as a } from "react";
import o from "styled-components";
import { jsx as s } from "react/jsx-runtime";
import { Pagination as c } from "antd";
//#region src/ui/common/Pagination.tsx
var l = o.nav`
  .ant-pagination li {
    &:focus-within {
      outline: 4px solid ${n("colorPrimary")};
      outline-offset: 1px;
      transition:
        outline-offset 0s,
        outline 0s;
    }
  }

  .ant-pagination-prev,
  .ant-pagination-next {
    > * {
      color: ${n("colorText")};
      display: block;
      height: 100%;
      padding: 0 ${t(1)};
      width: 100%;

      &[aria-disabled='true'] {
        color: ${(e) => `${e.theme.colorText}77`};
        cursor: not-allowed;
      }

      &:hover {
        background-color: ${n("colorBackgroundHue")};
        transition: all 0.2s;
      }
    }
  }
`, u = {
	current: 1,
	pageSize: 10,
	itemRender: null,
	showSizeChanger: !1
}, d = (t) => {
	let { pagination: n = u, onChange: o = e, onShowSizeChange: d = e, ref: f, ...p } = t, { current: m, pageSize: h, total: g } = n, _ = a(null);
	i(f, () => _.current), r(() => {
		n && !n.itemRender && _.current && (_.current.querySelectorAll("li.ant-pagination-item").forEach((e, t) => {
			let n = t + 1, r = `Go to page ${n}`, i = e.querySelector(":scope > *");
			e.classList.contains("ant-pagination-item-active") ? (i?.setAttribute("aria-current", "page"), r = `Page ${n} , Current Page`) : i?.removeAttribute("aria-current"), i?.setAttribute("aria-label", r);
		}), _.current.querySelectorAll(".ant-pagination li:not([class*=\"custom-icon\"])").forEach((e) => {
			e.removeAttribute("tabindex");
			let t = e.querySelector(":scope > *");
			e.getAttribute("aria-disabled") === "true" ? (t?.removeAttribute("disabled"), t?.setAttribute("aria-disabled", "true")) : t?.removeAttribute("aria-disabled");
		}));
	}, [
		m,
		h,
		g,
		n
	]);
	let v = (e) => {
		e.preventDefault();
	}, y = (e) => {
		e.key === "Enter" && (e.preventDefault(), e.stopPropagation(), e.currentTarget.parentNode?.click());
	}, b = n.itemRender || ((e, t, n) => t === "jump-next" || t === "jump-prev" ? n : t === "prev" ? /* @__PURE__ */ s("a", {
		href: "/previous/page",
		onClick: v,
		onKeyDown: y,
		children: "Previous"
	}) : t === "next" ? /* @__PURE__ */ s("a", {
		href: "/next/page",
		onClick: v,
		onKeyDown: y,
		children: "Next"
	}) : /* @__PURE__ */ s("a", {
		href: `/page/${e}`,
		onClick: v,
		onKeyDown: y,
		children: e
	}));
	return /* @__PURE__ */ s(l, {
		"aria-label": "Pagination",
		ref: _,
		role: "navigation",
		...p,
		children: /* @__PURE__ */ s(c, {
			...n,
			itemRender: b,
			onChange: o,
			onShowSizeChange: d
		})
	});
};
//#endregion
export { d as default };