@propellerads/pagination 2.0.4 → 3.1.0

package/dist/index.js

@@ -1,8 +1,731 @@
+import * as e from "react";
+import { createElement as t, useContext as n, useEffect as r, useRef as i, useState as a } from "react";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { actionColor as c, black as l, errorColor as u, gray50 as d, gray70 as f, spacing as p, successColor as m, warningColor as h, white as g } from "@propellerads/stylevariables";
+import _, { ThemeContext as v } from "styled-components";
+import y from "@propellerads/label";
+import b from "@propellerads/select";
+//#region ../../node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.mjs
+function x() {
+	return typeof window < "u";
+}
+function S(e) {
+	var t;
+	return (e == null || (t = e.ownerDocument) == null ? void 0 : t.defaultView) || window;
+}
+function C(e) {
+	return x() ? e instanceof HTMLElement || e instanceof S(e).HTMLElement : !1;
+}
+//#endregion
+//#region ../../node_modules/@base-ui-components/utils/esm/useRefWithInit.js
+var w = {};
+function T(t, n) {
+	let r = e.useRef(w);
+	return r.current === w && (r.current = t(n)), r;
+}
+//#endregion
+//#region ../../node_modules/@base-ui-components/utils/esm/useStableCallback.js
+var E = e[`useInsertionEffect${Math.random().toFixed(1)}`.slice(0, -3)], D = E && E !== e.useLayoutEffect ? E : (e) => e();
+function O(e) {
+	let t = T(k).current;
+	return t.next = e, D(t.effect), t.trampoline;
+}
+function k() {
+	let e = {
+		next: void 0,
+		callback: A,
+		trampoline: (...t) => e.callback?.(...t),
+		effect: () => {
+			e.callback = e.next;
+		}
+	};
+	return e;
+}
+function A() {
+	if (process.env.NODE_ENV !== "production") throw Error("Base UI: Cannot call an event handler while rendering.");
+}
+//#endregion
+//#region ../../node_modules/@base-ui-components/utils/esm/error.js
+var j;
+process.env.NODE_ENV !== "production" && (j = /* @__PURE__ */ new Set());
+function ee(...e) {
+	if (process.env.NODE_ENV !== "production") {
+		let t = e.join(" ");
+		j.has(t) || (j.add(t), console.error(`Base UI: ${t}`));
+	}
+}
+var te = typeof document < "u" ? e.useLayoutEffect : () => {};
+//#endregion
+//#region ../../node_modules/@base-ui-components/utils/esm/mergeObjects.js
+function M(e, t) {
+	if (e && !t) return e;
+	if (!e && t) return t;
+	if (e || t) return {
+		...e,
+		...t
+	};
+}
+//#endregion
+//#region ../../node_modules/@base-ui-components/react/esm/merge-props/mergeProps.js
+var N = {};
+function P(e, t, n, r, i) {
+	let a = { ...I(e, N) };
+	return t && (a = F(a, t)), n && (a = F(a, n)), r && (a = F(a, r)), i && (a = F(a, i)), a;
+}
+function ne(e) {
+	if (e.length === 0) return N;
+	if (e.length === 1) return I(e[0], N);
+	let t = { ...I(e[0], N) };
+	for (let n = 1; n < e.length; n += 1) t = F(t, e[n]);
+	return t;
+}
+function F(e, t) {
+	return ae(t) ? t(e) : re(e, t);
+}
+function re(e, t) {
+	if (!t) return e;
+	for (let n in t) {
+		let r = t[n];
+		switch (n) {
+			case "style":
+				e[n] = M(e.style, r);
+				break;
+			case "className":
+				e[n] = R(e.className, r);
+				break;
+			default: ie(n, r) ? e[n] = oe(e[n], r) : e[n] = r;
+		}
+	}
+	return e;
+}
+function ie(e, t) {
+	let n = e.charCodeAt(0), r = e.charCodeAt(1), i = e.charCodeAt(2);
+	return n === 111 && r === 110 && i >= 65 && i <= 90 && (typeof t == "function" || t === void 0);
+}
+function ae(e) {
+	return typeof e == "function";
+}
+function I(e, t) {
+	return ae(e) ? e(t) : e ?? N;
+}
+function oe(e, t) {
+	return t ? e ? (n) => {
+		if (se(n)) {
+			let r = n;
+			L(r);
+			let i = t(r);
+			return r.baseUIHandlerPrevented || e?.(r), i;
+		}
+		let r = t(n);
+		return e?.(n), r;
+	} : t : e;
+}
+function L(e) {
+	return e.preventBaseUIHandler = () => {
+		e.baseUIHandlerPrevented = !0;
+	}, e;
+}
+function R(e, t) {
+	return t ? e ? t + " " + e : t : e;
+}
+function se(e) {
+	return typeof e == "object" && !!e && "nativeEvent" in e;
+}
+//#endregion
+//#region ../../node_modules/@base-ui-components/utils/esm/formatErrorMessage.js
+function z(e, ...t) {
+	let n = new URL(`https://base-ui.com/production-error/${e}`);
+	return t.forEach((e) => n.searchParams.append("args[]", e)), `Base UI error #${e}; visit ${n} for the full message.`;
+}
+//#endregion
+//#region ../../node_modules/@base-ui-components/react/esm/composite/root/CompositeRootContext.js
+var B = /* @__PURE__ */ e.createContext(void 0);
+process.env.NODE_ENV !== "production" && (B.displayName = "CompositeRootContext");
+function ce(t = !1) {
+	let n = e.useContext(B);
+	if (n === void 0 && !t) throw Error(process.env.NODE_ENV === "production" ? z(16) : "Base UI: CompositeRootContext is missing. Composite parts must be placed within <Composite.Root>.");
+	return n;
+}
+//#endregion
+//#region ../../node_modules/@base-ui-components/react/esm/utils/useFocusableWhenDisabled.js
+function le(t) {
+	let { focusableWhenDisabled: n, disabled: r, composite: i = !1, tabIndex: a = 0, isNativeButton: o } = t, s = i && n !== !1, c = i && n === !1;
+	return { props: e.useMemo(() => {
+		let e = { onKeyDown(e) {
+			r && n && e.key !== "Tab" && e.preventDefault();
+		} };
+		return i || (e.tabIndex = a, !o && r && (e.tabIndex = n ? a : -1)), (o && (n || s) || !o && r) && (e["aria-disabled"] = r), o && (!n || c) && (e.disabled = r), e;
+	}, [
+		i,
+		r,
+		n,
+		s,
+		c,
+		o,
+		a
+	]) };
+}
+//#endregion
+//#region ../../node_modules/@base-ui-components/react/esm/use-button/useButton.js
+function ue(t = {}) {
+	let { disabled: n = !1, focusableWhenDisabled: r, tabIndex: i = 0, native: a = !0 } = t, o = e.useRef(null), s = ce(!0) !== void 0, c = O(() => {
+		let e = o.current;
+		return !!(e?.tagName === "A" && e?.href);
+	}), { props: l } = le({
+		focusableWhenDisabled: r,
+		disabled: n,
+		composite: s,
+		tabIndex: i,
+		isNativeButton: a
+	});
+	process.env.NODE_ENV !== "production" && e.useEffect(() => {
+		if (!o.current) return;
+		let e = o.current.tagName === "BUTTON";
+		a ? e || ee("A component that acts as a button was not rendered as a native <button>, which does not match the default. Ensure that the element passed to the `render` prop of the component is a real <button>, or set the `nativeButton` prop on the component to `false`.") : e && ee("A component that acts as a button was rendered as a native <button>, which does not match the default. Ensure that the element passed to the `render` prop of the component is not a real <button>, or set the `nativeButton` prop on the component to `true`.");
+	}, [a]);
+	let u = e.useCallback(() => {
+		let e = o.current;
+		de(e) && s && n && l.disabled === void 0 && e.disabled && (e.disabled = !1);
+	}, [
+		n,
+		l.disabled,
+		s
+	]);
+	return te(u, [u]), {
+		getButtonProps: e.useCallback((e = {}) => {
+			let { onClick: t, onMouseDown: r, onKeyUp: i, onKeyDown: o, onPointerDown: s, ...u } = e;
+			return P({
+				type: a ? "button" : void 0,
+				onClick(e) {
+					if (n) {
+						e.preventDefault();
+						return;
+					}
+					t?.(e);
+				},
+				onMouseDown(e) {
+					n || r?.(e);
+				},
+				onKeyDown(e) {
+					if (n || (L(e), o?.(e)), e.baseUIHandlerPrevented) return;
+					let r = e.target === e.currentTarget && !a && !c() && !n, i = e.key === "Enter", s = e.key === " ";
+					r && ((s || i) && e.preventDefault(), i && t?.(e));
+				},
+				onKeyUp(e) {
+					n || (L(e), i?.(e)), !e.baseUIHandlerPrevented && e.target === e.currentTarget && !a && !n && e.key === " " && t?.(e);
+				},
+				onPointerDown(e) {
+					if (n) {
+						e.preventDefault();
+						return;
+					}
+					s?.(e);
+				}
+			}, a ? void 0 : { role: "button" }, l, u);
+		}, [
+			n,
+			l,
+			a,
+			c
+		]),
+		buttonRef: O((e) => {
+			o.current = e, u();
+		})
+	};
+}
+function de(e) {
+	return C(e) && e.tagName === "BUTTON";
+}
+//#endregion
+//#region ../../node_modules/@base-ui-components/utils/esm/useMergedRefs.js
+function V(e, t, n, r) {
+	let i = T(H).current;
+	return pe(i, e, t, n, r) && U(i, [
+		e,
+		t,
+		n,
+		r
+	]), i.callback;
+}
+function fe(e) {
+	let t = T(H).current;
+	return me(t, e) && U(t, e), t.callback;
+}
+function H() {
+	return {
+		callback: null,
+		cleanup: null,
+		refs: []
+	};
+}
+function pe(e, t, n, r, i) {
+	return e.refs[0] !== t || e.refs[1] !== n || e.refs[2] !== r || e.refs[3] !== i;
+}
+function me(e, t) {
+	return e.refs.length !== t.length || e.refs.some((e, n) => e !== t[n]);
+}
+function U(e, t) {
+	if (e.refs = t, t.every((e) => e == null)) {
+		e.callback = null;
+		return;
+	}
+	e.callback = (n) => {
+		if (e.cleanup &&= (e.cleanup(), null), n != null) {
+			let r = Array(t.length).fill(null);
+			for (let e = 0; e < t.length; e += 1) {
+				let i = t[e];
+				if (i != null) switch (typeof i) {
+					case "function": {
+						let t = i(n);
+						typeof t == "function" && (r[e] = t);
+						break;
+					}
+					case "object":
+						i.current = n;
+						break;
+					default:
+				}
+			}
+			e.cleanup = () => {
+				for (let e = 0; e < t.length; e += 1) {
+					let n = t[e];
+					if (n != null) switch (typeof n) {
+						case "function": {
+							let t = r[e];
+							typeof t == "function" ? t() : n(null);
+							break;
+						}
+						case "object":
+							n.current = null;
+							break;
+						default:
+					}
+				}
+			};
+		}
+	};
+}
+//#endregion
+//#region ../../node_modules/@base-ui-components/utils/esm/reactVersion.js
+var he = parseInt(e.version, 10);
+function ge(e) {
+	return he >= e;
+}
+//#endregion
+//#region ../../node_modules/@base-ui-components/utils/esm/getReactElementRef.js
+function W(t) {
+	if (!/* @__PURE__ */ e.isValidElement(t)) return null;
+	let n = t, r = n.props;
+	return (ge(19) ? r?.ref : n.ref) ?? null;
+}
+//#endregion
+//#region ../../node_modules/@base-ui-components/react/esm/utils/getStateAttributesProps.js
+function _e(e, t) {
+	let n = {};
+	for (let r in e) {
+		let i = e[r];
+		if (t?.hasOwnProperty(r)) {
+			let e = t[r](i);
+			e != null && Object.assign(n, e);
+			continue;
+		}
+		i === !0 ? n[`data-${r.toLowerCase()}`] = "" : i && (n[`data-${r.toLowerCase()}`] = i.toString());
+	}
+	return n;
+}
+//#endregion
+//#region ../../node_modules/@base-ui-components/react/esm/utils/resolveClassName.js
+function ve(e, t) {
+	return typeof e == "function" ? e(t) : e;
+}
+//#endregion
+//#region ../../node_modules/@base-ui-components/react/esm/utils/resolveStyle.js
+function ye(e, t) {
+	return typeof e == "function" ? e(t) : e;
+}
+Object.freeze([]);
+var G = Object.freeze({});
+//#endregion
+//#region ../../node_modules/@base-ui-components/react/esm/utils/useRenderElement.js
+function be(e, t, n = {}) {
+	let r = t.render, i = xe(t, n);
+	return n.enabled === !1 ? null : Se(e, r, i, n.state ?? G);
+}
+function xe(e, t = {}) {
+	let { className: n, style: r, render: i } = e, { state: a = G, ref: o, props: s, stateAttributesMapping: c, enabled: l = !0 } = t, u = l ? ve(n, a) : void 0, d = l ? ye(r, a) : void 0, f = l ? _e(a, c) : G, p = l ? M(f, Array.isArray(s) ? ne(s) : s) ?? G : G;
+	return typeof document < "u" && (l ? Array.isArray(o) ? p.ref = fe([
+		p.ref,
+		W(i),
+		...o
+	]) : p.ref = V(p.ref, W(i), o) : V(null, null)), l ? (u !== void 0 && (p.className = R(p.className, u)), d !== void 0 && (p.style = M(p.style, d)), p) : G;
+}
+function Se(t, n, r, i) {
+	if (n) {
+		if (typeof n == "function") return n(r, i);
+		let t = P(r, n.props);
+		return t.ref = r.ref, /* @__PURE__ */ e.cloneElement(n, t);
+	}
+	if (t && typeof t == "string") return Ce(t, r);
+	throw Error(process.env.NODE_ENV === "production" ? z(8) : "Base UI: Render element or function are not defined.");
+}
+function Ce(n, r) {
+	return n === "button" ? /* @__PURE__ */ t("button", {
+		type: "button",
+		...r,
+		key: r.key
+	}) : n === "img" ? /* @__PURE__ */ t("img", {
+		alt: "",
+		...r,
+		key: r.key
+	}) : /* @__PURE__ */ e.createElement(n, r);
+}
+//#endregion
+//#region ../../node_modules/@base-ui-components/react/esm/button/Button.js
+var K = /* @__PURE__ */ e.forwardRef(function(t, n) {
+	let { render: r, className: i, disabled: a = !1, focusableWhenDisabled: o = !1, nativeButton: s = !0, ...c } = t, l = !!a, { getButtonProps: u, buttonRef: d } = ue({
+		disabled: l,
+		focusableWhenDisabled: o,
+		native: s
+	});
+	return be("button", t, {
+		state: e.useMemo(() => ({ disabled: l }), [l]),
+		ref: [n, d],
+		props: [c, u]
+	});
+});
+process.env.NODE_ENV !== "production" && (K.displayName = "Button");
+//#endregion
+//#region ../../node_modules/clsx/dist/clsx.mjs
+function q(e) {
+	var t, n, r = "";
+	if (typeof e == "string" || typeof e == "number") r += e;
+	else if (typeof e == "object") if (Array.isArray(e)) {
+		var i = e.length;
+		for (t = 0; t < i; t++) e[t] && (n = q(e[t])) && (r && (r += " "), r += n);
+	} else for (n in e) e[n] && (r && (r += " "), r += n);
+	return r;
+}
+function we() {
+	for (var e, t, n = 0, r = "", i = arguments.length; n < i; n++) (e = arguments[n]) && (t = q(e)) && (r && (r += " "), r += t);
+	return r;
+}
+//#endregion
+//#region ../../node_modules/class-variance-authority/dist/index.mjs
+var Te = (e) => typeof e == "boolean" ? `${e}` : e === 0 ? "0" : e, Ee = we, De = (e, t) => (n) => {
+	if (t?.variants == null) return Ee(e, n?.class, n?.className);
+	let { variants: r, defaultVariants: i } = t, a = Object.keys(r).map((e) => {
+		let t = n?.[e], a = i?.[e];
+		if (t === null) return null;
+		let o = Te(t) || Te(a);
+		return r[e][o];
+	}), o = n && Object.entries(n).reduce((e, t) => {
+		let [n, r] = t;
+		return r === void 0 || (e[n] = r), e;
+	}, {});
+	return Ee(e, a, t?.compoundVariants?.reduce((e, t) => {
+		let { class: n, className: r, ...a } = t;
+		return Object.entries(a).every((e) => {
+			let [t, n] = e;
+			return Array.isArray(n) ? n.includes({
+				...i,
+				...o
+			}[t]) : {
+				...i,
+				...o
+			}[t] === n;
+		}) ? [
+			...e,
+			n,
+			r
+		] : e;
+	}, []), n?.class, n?.className);
+}, Oe = (...e) => we(e), J = {
+	Primary: "primary",
+	Secondary: "secondary",
+	Ghost: "ghost",
+	Link: "link",
+	Plain: "plain"
+}, ke = {
+	Action: "action",
+	Danger: "danger",
+	Success: "success"
+}, Ae = De("pa-button", {
+	variants: {
+		variant: {
+			primary: "pa-button--primary",
+			secondary: "pa-button--secondary",
+			ghost: "pa-button--ghost",
+			link: "pa-button--link",
+			plain: "pa-button--plain"
+		},
+		tone: {
+			action: "pa-button--tone-action",
+			danger: "pa-button--tone-danger",
+			success: "pa-button--tone-success"
+		},
+		iconOnly: {
+			true: "pa-button--icon",
+			false: ""
+		},
+		fullWidth: {
+			true: "pa-button--full-width",
+			false: ""
+		},
+		loading: {
+			true: "pa-button--loading",
+			false: ""
+		},
+		startIcon: {
+			true: "pa-button--start-icon",
+			false: ""
+		},
+		endIcon: {
+			true: "pa-button--end-icon",
+			false: ""
+		}
+	},
+	defaultVariants: {
+		variant: "primary",
+		tone: "action",
+		iconOnly: !1,
+		fullWidth: !1,
+		loading: !1,
+		startIcon: !1,
+		endIcon: !1
+	}
+}), Y = ({ variant: e = J.Primary, tone: t = ke.Action, isFullWidth: n = !1, isLoading: c = !1, isAsync: l = !1, isDisabled: u = !1, type: d = "button", className: f, onClick: p, icon: m, startIcon: h, endIcon: g, gtmAction: _, gtmLabel: v, children: y, ...b }) => {
+	let [x, S] = a(!1), C = i(!0);
+	r(() => () => {
+		C.current = !1;
+	}, []);
+	let w = c || x, T = async (e) => {
+		if (w) {
+			e.preventDefault();
+			return;
+		}
+		if (p !== void 0) {
+			if (!l) {
+				p(e);
+				return;
+			}
+			try {
+				S(!0), await p(e);
+			} finally {
+				C.current && S(!1);
+			}
+		}
+	}, E = /* @__PURE__ */ o("span", {
+		className: "pa-button__spinner",
+		"aria-hidden": "true"
+	}), D = m !== void 0, O = h === void 0 && g !== void 0, k = w && !D && !O ? E : h, A = w && O ? E : g, j = D ? w ? E : m : y;
+	return /* @__PURE__ */ s(K, {
+		...b,
+		type: d,
+		disabled: u,
+		className: Oe("Button", Ae({
+			variant: e,
+			tone: t,
+			iconOnly: D,
+			fullWidth: n,
+			loading: w,
+			startIcon: k !== void 0,
+			endIcon: A !== void 0
+		}), f),
+		onClick: T,
+		"aria-disabled": w || void 0,
+		"aria-busy": w || void 0,
+		"data-loading": w || void 0,
+		"gtm-action": _,
+		"gtm-label": v,
+		children: [
+			k !== void 0 && /* @__PURE__ */ o("span", {
+				className: "pa-button__icon",
+				"aria-hidden": "true",
+				children: k
+			}),
+			j,
+			A !== void 0 && /* @__PURE__ */ o("span", {
+				className: "pa-button__icon",
+				"aria-hidden": "true",
+				children: A
+			})
+		]
+	});
+}, X = {
+	ExtraSmall: "extra-small",
+	Small: "small",
+	MediumSmall: "medium-small",
+	Medium: "medium",
+	Large: "large",
+	ExtraLarge: "extra-large"
+}, Z = {
+	Black: "black",
+	White: "white",
+	Blue: "blue",
+	Gray: "gray",
+	GrayDark: "gray-dark",
+	Success: "success",
+	Warning: "warning",
+	Error: "error"
+}, je = {
+	[X.ExtraSmall]: p * 3,
+	[X.Small]: p * 4,
+	[X.MediumSmall]: p * 5,
+	[X.Medium]: p * 6,
+	[X.Large]: p * 8,
+	[X.ExtraLarge]: p * 16
+}, Me = _.svg`
+  display: inline-flex;
+  width: ${(e) => je[e.$size]}px;
+  height: ${(e) => je[e.$size]}px;
+  fill: ${(e) => e.$color};
 
-'use strict'
+  &:hover {
+    fill: ${(e) => e.$hoverColor};
+  }
+`, Ne = {
+	[Z.White]: () => g,
+	[Z.Blue]: (e) => e?.actionColor?.main ?? c,
+	[Z.Gray]: () => f,
+	[Z.GrayDark]: () => d,
+	[Z.Success]: (e) => e?.successColor?.main ?? m,
+	[Z.Error]: (e) => e?.errorColor?.main ?? u,
+	[Z.Warning]: (e) => e?.warningColor?.main ?? h,
+	[Z.Black]: () => l
+}, Pe = (e) => e in Ne, Fe = (e, t) => Pe(t) ? Ne[t](e) : t, Q = ({ children: e, size: t = X.Medium, color: r = Z.Black, hoverColor: i, ...a }) => {
+	let s = n(v);
+	return /* @__PURE__ */ o(Me, {
+		$size: t,
+		$color: Fe(s, r),
+		$hoverColor: Fe(s, i || r),
+		viewBox: "0 0 24 24",
+		...a,
+		children: e
+	});
+}, Ie = (e) => /* @__PURE__ */ o(Q, {
+	...e,
+	children: /* @__PURE__ */ o("path", { d: "M14.71 15.88L10.83 12l3.88-3.88c.39-.39.39-1.02 0-1.41-.39-.39-1.02-.39-1.41 0L8.71 11.3c-.39.39-.39 1.02 0 1.41l4.59 4.59c.39.39 1.02.39 1.41 0 .38-.39.39-1.03 0-1.42z" })
+}), Le = (e) => /* @__PURE__ */ s(Q, {
+	...e,
+	children: [/* @__PURE__ */ o("path", {
+		opacity: ".87",
+		fill: "none",
+		d: "M0 0h24v24H0V0z"
+	}), /* @__PURE__ */ o("path", { d: "M17.7075 15.89L13.8175 12L17.7075 8.11C18.0975 7.72 18.0975 7.09 17.7075 6.7C17.3175 6.31 16.6875 6.31 16.2975 6.7L11.7075 11.29C11.3175 11.68 11.3175 12.31 11.7075 12.7L16.2975 17.3C16.6875 17.69 17.3175 17.69 17.7075 17.3C18.0875 16.91 18.0875 16.27 17.7075 15.89ZM6.9975 18C6.4475 18 5.9975 17.55 5.9975 17L5.9975 7C5.9975 6.45 6.4475 6 6.9975 6C7.5475 6 7.9975 6.45 7.9975 7L7.9975 17C7.9975 17.55 7.5475 18 6.9975 18Z" })]
+}), Re = (e) => /* @__PURE__ */ s(Q, {
+	...e,
+	children: [/* @__PURE__ */ o("path", {
+		opacity: ".87",
+		fill: "none",
+		d: "M0 0h24v24H0V0z"
+	}), /* @__PURE__ */ o("path", { d: "M6.29 8.11L10.18 12l-3.89 3.89c-.39.39-.39 1.02 0 1.41.39.39 1.02.39 1.41 0l4.59-4.59c.39-.39.39-1.02 0-1.41L7.7 6.7c-.39-.39-1.02-.39-1.41 0-.38.39-.38 1.03 0 1.41zM17 6c.55 0 1 .45 1 1v10c0 .55-.45 1-1 1s-1-.45-1-1V7c0-.55.45-1 1-1z" })]
+}), ze = (e) => /* @__PURE__ */ o(Q, {
+	...e,
+	children: /* @__PURE__ */ o("path", { d: "M9.29 15.88L13.17 12 9.29 8.12c-.39-.39-.39-1.02 0-1.41.39-.39 1.02-.39 1.41 0l4.59 4.59c.39.39.39 1.02 0 1.41L10.7 17.3c-.39.39-1.02.39-1.41 0-.38-.39-.39-1.03 0-1.42z" })
+}), Be = _.div`
+  display: flex;
+  align-items: center;
+`, Ve = _.div`
+  display: flex;
+  align-items: center;
+  margin-right: ${p * 9}px;
 
-if (process.env.NODE_ENV === 'production') {
-  module.exports = require('./pagination.cjs.production.min.js')
-} else {
-  module.exports = require('./pagination.cjs.development.js')
-}
+  label {
+    margin: 0 ${p * 3}px 0 0;
+  }
+
+  select {
+    width: 66px;
+  }
+`, He = _.div`
+  width: 70px;
+`, Ue = _.div`
+  margin-right: ${p * 8}px;
+`, We = _.div`
+  display: flex;
+`, $ = _.div`
+  &:not(:last-child) {
+    margin-right: ${p * 2}px;
+  }
+`, Ge = (e, t, n) => {
+	let r = e * (t - 1);
+	return {
+		from: r + 1,
+		to: Math.min(r + e, n),
+		total: n
+	};
+}, Ke = ({ from: e, to: t, total: n }) => `${e}-${t} of ${n}`, qe = ({ pageIndex: e, perPage: t, pageSizes: n = [
+	10,
+	20,
+	50
+], totalPages: r, totalItems: i, setPageSize: a, canNextPage: c, gotoPage: l, canPreviousPage: u, previousPageHandler: d, nextPageHandler: f, parentElementId: p, paginationAmount: m = "", labelPerPage: h = "" }) => {
+	let g = `${p}-pagination-select-per-page`, _ = n.map((e) => ({
+		id: e,
+		label: e,
+		value: e
+	})), v = _.find(({ value: e }) => e === t), x = Ge(t, e + 1, i), S = m || Ke(x);
+	return /* @__PURE__ */ s(Be, { children: [
+		/* @__PURE__ */ s(Ve, { children: [h && /* @__PURE__ */ o(y, {
+			label: h,
+			for: g
+		}), /* @__PURE__ */ o(He, { children: /* @__PURE__ */ o(b, {
+			id: g,
+			onChange: (e) => {
+				e !== null && a(Number(e.value));
+			},
+			options: _,
+			value: v
+		}) })] }),
+		/* @__PURE__ */ o(Ue, { children: S }),
+		/* @__PURE__ */ s(We, { children: [
+			/* @__PURE__ */ o($, { children: /* @__PURE__ */ o(Y, {
+				variant: J.Ghost,
+				icon: /* @__PURE__ */ o(Le, {
+					hoverColor: Z.Blue,
+					color: Z.Gray
+				}),
+				"aria-label": "First page",
+				isDisabled: !u,
+				id: `${p}-pagination-first-page-button`,
+				onClick: () => l(0)
+			}) }),
+			/* @__PURE__ */ o($, { children: /* @__PURE__ */ o(Y, {
+				variant: J.Ghost,
+				icon: /* @__PURE__ */ o(Ie, {
+					hoverColor: Z.Blue,
+					color: Z.Gray
+				}),
+				"aria-label": "Previous page",
+				isDisabled: !u,
+				id: `${p}-pagination-previous-page-button`,
+				onClick: d
+			}) }),
+			/* @__PURE__ */ o($, { children: /* @__PURE__ */ o(Y, {
+				variant: J.Ghost,
+				icon: /* @__PURE__ */ o(ze, {
+					hoverColor: Z.Blue,
+					color: Z.Gray
+				}),
+				"aria-label": "Next page",
+				isDisabled: !c,
+				id: `${p}-pagination-next-page-button`,
+				onClick: f
+			}) }),
+			/* @__PURE__ */ o($, { children: /* @__PURE__ */ o(Y, {
+				variant: J.Ghost,
+				icon: /* @__PURE__ */ o(Re, {
+					hoverColor: Z.Blue,
+					color: Z.Gray
+				}),
+				"aria-label": "Last page",
+				isDisabled: !c,
+				id: `${p}-pagination-last-page-button`,
+				onClick: () => l(r - 1)
+			}) })
+		] })
+	] });
+};
+//#endregion
+export { qe as default };
+
+//# sourceMappingURL=index.js.map