@payfit/unity-components/dist/esm/components/table/parts/TablePagination.js

import { ClientSidePagination as e } from "../../client-side-pagination/ClientSidePagination.js";
import { SelectOption as t } from "../../select/parts/SelectOption.js";
import { Select as n } from "../../select/Select.js";
import { forwardRef as r, useState as i } from "react";
import { uyTv as a } from "@payfit/unity-themes";
import { jsx as o, jsxs as s } from "react/jsx-runtime";
import { useIntl as c } from "react-intl";
import { useId as l } from "react-aria/useId";
//#region src/components/table/parts/TablePagination.tsx
var u = a({ base: [
	"uy:bg-surface-neutral-low",
	"uy:sticky uy:bottom-0",
	"uy:grid uy:grid-cols-3 uy:items-center",
	"uy:ps-200 uy:py-100 uy:pe-100"
] }), d = [
	{
		value: "10",
		label: "10"
	},
	{
		value: "50",
		label: "50"
	},
	{
		value: "100",
		label: "100"
	},
	{
		value: "200",
		label: "200"
	}
], f = r((r, a) => {
	let { pageCount: f, rowCount: p, currentPage: m, rowsPerPage: h, defaultPage: g, pageSizeOptions: _ = d, defaultPageSize: v = h, onPageChange: y, onNextPress: b, onPreviousPress: x, onPageSizeChange: S, onPageHover: C, itemLabel: w = "unity:component:table:pagination:item", ...T } = r, E = l(), D = c(), [O, k] = i(v), A = {
		pageCount: f,
		defaultPage: g,
		currentPage: m,
		onPageChange: y,
		onNextPress: b,
		onPreviousPress: x,
		onPageHover: C
	}, j = Math.max(((m ?? g ?? 1) - 1) * h + 1, 1), M = Math.min(j + h - 1, p), N = {
		singular: D.formatMessage({
			id: w,
			defaultMessage: "items"
		}, { count: 1 }),
		plural: D.formatMessage({
			id: w,
			defaultMessage: "items"
		}, { count: 2 })
	};
	return /* @__PURE__ */ s("div", {
		"data-dd-privacy": "allow",
		...T,
		ref: a,
		className: u(),
		"data-unity-slot": "table-pagination",
		children: [
			/* @__PURE__ */ o("div", {
				className: "uy:justify-self-start",
				children: /* @__PURE__ */ o("span", {
					id: `table-pagination-${E}-label`,
					className: "uy:typography-body uy:text-content-neutral",
					children: D.formatMessage({
						id: "unity:component:table:pagination:label",
						defaultMessage: `${j}-${M} out of ${p} items`
					}, {
						pageCount: f,
						startRow: j,
						endRow: M,
						totalRows: p,
						itemLabel: N.plural
					})
				})
			}),
			/* @__PURE__ */ o("div", {
				className: "uy:justify-self-center",
				children: f > 1 && /* @__PURE__ */ o(e, {
					...A,
					"aria-labelledby": `table-pagination-${E}-label`
				})
			}),
			/* @__PURE__ */ o("div", {
				className: "uy:justify-self-end",
				children: /* @__PURE__ */ s("form", {
					className: "uy:flex uy:gap-100 uy:items-center",
					children: [/* @__PURE__ */ o("label", {
						className: "uy:shrink-0",
						id: `table-pagination-${E}-pagesize-label`,
						htmlFor: `table-pagination-${E}-pagesize-select`,
						children: D.formatMessage({
							id: "unity:component:table:pagination:page-size-control-label",
							defaultMessage: "Items per page"
						}, { itemLabel: N.plural })
					}), /* @__PURE__ */ o("div", {
						className: "uy:grow-0 uy:w-1000",
						children: /* @__PURE__ */ o(n, {
							id: `table-pagination-${E}-pagesize-select`,
							items: _,
							placeholder: "",
							value: `${O}`,
							onChange: (e) => {
								let t = parseInt(e, 10);
								S?.(t), k(t);
							},
							"aria-labelledby": `table-pagination-${E}-pagesize-label`,
							children: (e) => /* @__PURE__ */ o(t, {
								id: e.value,
								children: e.label
							})
						})
					})]
				})
			})
		]
	});
});
f.displayName = "TablePagination";
//#endregion
export { f as TablePagination, u as tablePagination };