wimui 0.63.4 → 0.64.0

package/dist/components/media/Lightbox/Lightbox.js

@@ -2,184 +2,202 @@
 import { Root as e, Slottable as t } from "../../../node_modules/@radix-ui/react-slot/dist/index.js";
 import { useWimTranslation as n } from "../../../i18n/useWimTranslation.js";
 import { OverlayBase as r } from "../../_internal/OverlayBase.js";
-import { componentsNs as i } from "../../../i18n/generated/components.js";
-import a from "../../../icon/chevron-left.js";
-import o from "../../../icon/chevron-right.js";
-import s from "../../../icon/close.js";
-import c from "../../../icon/minus.js";
-import l from "../../../icon/plus.js";
-import { Icon as u } from "../Icon/Icon.js";
-import d from "./lightbox.module.js";
-import { createContext as f, useCallback as p, useContext as m, useEffect as h, useState as g } from "react";
-import _ from "classnames";
-import { jsx as v, jsxs as y } from "react/jsx-runtime";
+import { VisuallyHidden as i } from "../../layout/VisuallyHidden/VisuallyHidden.js";
+import { componentsNs as a } from "../../../i18n/generated/components.js";
+import o from "../../../icon/chevron-left.js";
+import s from "../../../icon/chevron-right.js";
+import c from "../../../icon/close.js";
+import l from "../../../icon/minus.js";
+import u from "../../../icon/plus.js";
+import { Icon as d } from "../Icon/Icon.js";
+import f from "./lightbox.module.js";
+import { createContext as p, useCallback as m, useContext as h, useEffect as g, useState as _ } from "react";
+import v from "classnames";
+import { jsx as y, jsxs as b } from "react/jsx-runtime";
 //#region src/components/media/Lightbox/Lightbox.tsx
-var b = f(void 0), x = () => {
-	let e = m(b);
+var x = p(void 0), S = () => {
+	let e = h(x);
 	if (!e) throw Error("Lightbox components must be used within Lightbox");
 	return e;
-}, S = ({ children: e, open: t, onOpenChange: n, defaultOpen: r = !1, defaultIndex: i = 0 }) => {
-	let [a, o] = g(r), [s, c] = g(i), [l, u] = g([]), d = t !== void 0, f = d ? t : a, m = p((e) => {
+}, C = ({ children: e, open: t, onOpenChange: n, defaultOpen: r = !1, defaultIndex: i = 0 }) => {
+	let [a, o] = _(r), [s, c] = _(i), [l, u] = _([]), d = t !== void 0, f = d ? t : a, p = m((e) => {
 		d || o(e), n?.(e);
-	}, [d, n]), h = p((e) => {
+	}, [d, n]), h = m((e) => {
 		let t = -1;
 		return u((n) => (t = n.length, [...n, e])), t;
-	}, []), _ = p((e) => {}, []);
-	return /* @__PURE__ */ v(b.Provider, {
+	}, []), g = m((e) => {}, []);
+	return /* @__PURE__ */ y(x.Provider, {
 		value: {
 			open: f,
-			setOpen: m,
+			setOpen: p,
 			currentIndex: s,
 			setCurrentIndex: c,
 			items: l,
 			setItems: u,
 			registerItem: h,
-			unregisterItem: _
+			unregisterItem: g
 		},
 		children: e
 	});
-}, C = ({ children: r, className: a, onClick: o, asChild: s = !1, index: c, src: l, alt: u, caption: f, ...p }) => {
-	let { setOpen: m, setCurrentIndex: h, items: g, setItems: y } = x(), { t: b } = n(i), S = (e) => {
+}, w = ({ children: r, className: i, onClick: o, asChild: s = !1, index: c, src: l, alt: u, caption: d, ...p }) => {
+	let { setOpen: m, setCurrentIndex: h, items: g, setItems: _ } = S(), { t: b } = n(a), x = (e) => {
 		if (o?.(e), c !== void 0) h(c);
 		else if (l) {
 			let e = g.findIndex((e) => e.src === l);
 			if (e !== -1) h(e);
 			else {
 				let e = g.length;
-				y((e) => [...e, {
+				_((e) => [...e, {
 					src: l,
 					alt: u,
-					caption: f
+					caption: d
 				}]), h(e);
 			}
 		}
 		m(!0);
 	}, C = s ? e : "button", w = c === void 0 ? void 0 : g[c]?.alt, T = p["aria-label"] !== void 0 || p["aria-labelledby"] !== void 0, E = u ?? w, D = T ? void 0 : E ? b("lightbox.open_named", { name: E }) : b("lightbox.open");
-	return /* @__PURE__ */ v(C, {
+	return /* @__PURE__ */ y(C, {
 		type: "button",
-		className: _(d.trigger, a),
-		onClick: S,
+		className: v(f.trigger, i),
+		onClick: x,
 		"aria-label": D,
 		...p,
-		children: /* @__PURE__ */ v(t, { children: r })
+		children: /* @__PURE__ */ y(t, { children: r })
 	});
-}, w = ({ className: e, showCloseButton: t = !0, showNavigation: f = !0, showCounter: m = !0, closeOnOverlayClick: b = !0, ...S }) => {
-	let { open: C, setOpen: w, currentIndex: T, setCurrentIndex: E, items: D } = x(), { t: O } = n(i), [k, A] = g(1), j = p(() => {
-		E((T - 1 + D.length) % D.length), A(1);
+}, T = ({ className: e, showCloseButton: t = !0, showNavigation: p = !0, showCounter: h = !0, closeOnOverlayClick: x = !0, ...C }) => {
+	let { open: w, setOpen: T, currentIndex: E, setCurrentIndex: D, items: O } = S(), { t: k } = n(a), [A, j] = _(1), [M, N] = _("");
+	!w && M && N("");
+	let P = m((e) => {
+		let t = O[e], n = t?.title || t?.alt, r = k("lightbox.image_status", {
+			current: e + 1,
+			total: O.length
+		});
+		N(n ? `${r}: ${n}` : r), D(e), j(1);
 	}, [
-		T,
-		D.length,
-		E
-	]), M = p(() => {
-		E((T + 1) % D.length), A(1);
+		O,
+		D,
+		k
+	]), F = m(() => {
+		P((E - 1 + O.length) % O.length);
 	}, [
-		T,
-		D.length,
-		E
-	]), N = () => {
-		A((e) => e === 1 ? 2 : 1);
+		E,
+		O.length,
+		P
+	]), I = m(() => {
+		P((E + 1) % O.length);
+	}, [
+		E,
+		O.length,
+		P
+	]), L = () => {
+		j((e) => e === 1 ? 2 : 1);
 	};
-	h(() => {
-		if (!C) return;
+	g(() => {
+		if (!w) return;
 		let e = (e) => {
-			e.key === "ArrowLeft" && j(), e.key === "ArrowRight" && M(), e.key === "Escape" && w(!1);
+			e.key === "ArrowLeft" && F(), e.key === "ArrowRight" && I(), e.key === "Escape" && T(!1);
 		};
 		return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
 	}, [
-		C,
-		j,
-		M,
-		w
+		w,
+		F,
+		I,
+		T
 	]);
-	let P = D[T];
-	return P ? /* @__PURE__ */ v(r, {
-		...S,
-		open: C,
-		onOpenChange: w,
-		closeOnOverlayClick: b,
-		overlayClassName: d.overlay,
-		className: _("wim-lightbox", d.contentRoot, e),
-		"aria-label": S["aria-labelledby"] ? void 0 : S["aria-label"] ?? (P.title || P.alt || O("lightbox.dialog")),
+	let R = O[E];
+	return R ? /* @__PURE__ */ y(r, {
+		...C,
+		open: w,
+		onOpenChange: T,
+		closeOnOverlayClick: x,
+		overlayClassName: f.overlay,
+		className: v("wim-lightbox", f.contentRoot, e),
+		"aria-label": C["aria-labelledby"] ? void 0 : C["aria-label"] ?? (R.title || R.alt || k("lightbox.dialog")),
 		transitionProps: {
 			preset: "fade",
-			enter: d.contentEnter,
-			enterFrom: d.contentEnterFrom,
-			enterTo: d.contentEnterTo
+			enter: f.contentEnter,
+			enterFrom: f.contentEnterFrom,
+			enterTo: f.contentEnterTo
 		},
-		children: /* @__PURE__ */ y("div", {
-			className: d.container,
+		children: /* @__PURE__ */ b("div", {
+			className: f.container,
 			children: [
-				/* @__PURE__ */ y("div", {
-					className: d.header,
-					children: [m && D.length > 1 && /* @__PURE__ */ v("div", {
-						className: d.counter,
-						children: O("lightbox.counter", {
-							current: T + 1,
-							total: D.length
+				/* @__PURE__ */ y(i, {
+					role: "status",
+					"aria-atomic": "true",
+					children: M
+				}),
+				/* @__PURE__ */ b("div", {
+					className: f.header,
+					children: [h && O.length > 1 && /* @__PURE__ */ y("div", {
+						className: f.counter,
+						children: k("lightbox.counter", {
+							current: E + 1,
+							total: O.length
 						})
-					}), /* @__PURE__ */ y("div", {
-						className: d.controls,
-						children: [/* @__PURE__ */ v("button", {
-							className: d.iconButton,
-							onClick: N,
-							"aria-label": O(k > 1 ? "lightbox.zoom_out" : "lightbox.zoom_in"),
-							children: k > 1 ? /* @__PURE__ */ v(u, { component: c }) : /* @__PURE__ */ v(u, { component: l })
-						}), t && /* @__PURE__ */ v("button", {
-							className: d.iconButton,
-							onClick: () => w(!1),
-							"aria-label": O("lightbox.close"),
-							children: /* @__PURE__ */ v(u, { component: s })
+					}), /* @__PURE__ */ b("div", {
+						className: f.controls,
+						children: [/* @__PURE__ */ y("button", {
+							className: f.iconButton,
+							onClick: L,
+							"aria-label": k(A > 1 ? "lightbox.zoom_out" : "lightbox.zoom_in"),
+							children: A > 1 ? /* @__PURE__ */ y(d, { component: l }) : /* @__PURE__ */ y(d, { component: u })
+						}), t && /* @__PURE__ */ y("button", {
+							className: f.iconButton,
+							onClick: () => T(!1),
+							"aria-label": k("lightbox.close"),
+							children: /* @__PURE__ */ y(d, { component: c })
 						})]
 					})]
 				}),
-				/* @__PURE__ */ y("div", {
-					className: d.viewport,
+				/* @__PURE__ */ b("div", {
+					className: f.viewport,
 					children: [
-						f && D.length > 1 && /* @__PURE__ */ v("button", {
-							className: _(d.navButton, d.prev),
-							onClick: j,
-							"aria-label": O("lightbox.previous"),
-							children: /* @__PURE__ */ v(u, { component: a })
+						p && O.length > 1 && /* @__PURE__ */ y("button", {
+							className: v(f.navButton, f.prev),
+							onClick: F,
+							"aria-label": k("lightbox.previous"),
+							children: /* @__PURE__ */ y(d, { component: o })
 						}),
-						/* @__PURE__ */ v("div", {
-							className: d.mediaWrapper,
-							style: { transform: `scale(${k})` },
-							children: /* @__PURE__ */ v("img", {
-								src: P.src,
-								alt: P.alt || "",
-								className: d.image
+						/* @__PURE__ */ y("div", {
+							className: f.mediaWrapper,
+							style: { transform: `scale(${A})` },
+							children: /* @__PURE__ */ y("img", {
+								src: R.src,
+								alt: R.alt || "",
+								className: f.image
 							})
 						}),
-						f && D.length > 1 && /* @__PURE__ */ v("button", {
-							className: _(d.navButton, d.next),
-							onClick: M,
-							"aria-label": O("lightbox.next"),
-							children: /* @__PURE__ */ v(u, { component: o })
+						p && O.length > 1 && /* @__PURE__ */ y("button", {
+							className: v(f.navButton, f.next),
+							onClick: I,
+							"aria-label": k("lightbox.next"),
+							children: /* @__PURE__ */ y(d, { component: s })
 						})
 					]
 				}),
-				(P.title || P.caption) && /* @__PURE__ */ y("div", {
-					className: d.footer,
-					children: [P.title && /* @__PURE__ */ v("h3", {
-						className: d.title,
-						children: P.title
-					}), P.caption && /* @__PURE__ */ v("p", {
-						className: d.caption,
-						children: P.caption
+				(R.title || R.caption) && /* @__PURE__ */ b("div", {
+					className: f.footer,
+					children: [R.title && /* @__PURE__ */ y("h3", {
+						className: f.title,
+						children: R.title
+					}), R.caption && /* @__PURE__ */ y("p", {
+						className: f.caption,
+						children: R.caption
 					})]
 				})
 			]
 		})
 	}) : null;
-}, T = ({ items: e, children: t }) => {
-	let { setItems: n } = x();
-	return h(() => {
+}, E = ({ items: e, children: t }) => {
+	let { setItems: n } = S();
+	return g(() => {
 		n(e);
-	}, [e, n]), /* @__PURE__ */ v("div", {
-		className: d.gallery,
+	}, [e, n]), /* @__PURE__ */ y("div", {
+		className: f.gallery,
 		children: t
 	});
-}, E = S;
-E.Trigger = C, E.Content = w, E.Gallery = T, E.displayName = "Lightbox", C.displayName = "Lightbox.Trigger", w.displayName = "Lightbox.Content", T.displayName = "Lightbox.Gallery";
+}, D = C;
+D.Trigger = w, D.Content = T, D.Gallery = E, D.displayName = "Lightbox", w.displayName = "Lightbox.Trigger", T.displayName = "Lightbox.Content", E.displayName = "Lightbox.Gallery";
 //#endregion
-export { S as Lightbox, w as LightboxContent, T as LightboxGallery, E as LightboxRoot, E as default, C as LightboxTrigger, x as useLightbox };
+export { C as Lightbox, T as LightboxContent, E as LightboxGallery, D as LightboxRoot, D as default, w as LightboxTrigger, S as useLightbox };

package/dist/components/navigation/CommandPalette/command-palette.module.cjs

@@ -1,2 +1,2 @@
 "use client";
-var e=`_overlay_6u2zl_23`,t=`_content_6u2zl_39`,n=`_slideIn_6u2zl_1`,r=`_inputWrapper_6u2zl_68`,i=`_inputRight_6u2zl_107`,a=`_input_6u2zl_68`,o=`_list_6u2zl_126`,s=`_group_6u2zl_136`,c=`_groupHeading_6u2zl_142`,l=`_item_6u2zl_150`,u=`_active_6u2zl_153`,d=`_shortcut_6u2zl_157`,f=`_empty_6u2zl_166`,p=`_footer_6u2zl_172`,m=`_kbd_6u2zl_186`,h=`_trigger_6u2zl_195`,g={overlay:e,content:t,slideIn:n,inputWrapper:r,inputRight:i,input:a,list:o,group:s,groupHeading:c,item:l,active:u,shortcut:d,empty:f,footer:p,kbd:m,trigger:h};exports.active=u,exports.content=t,exports.default=g,exports.empty=f,exports.footer=p,exports.group=s,exports.groupHeading=c,exports.input=a,exports.inputRight=i,exports.inputWrapper=r,exports.item=l,exports.kbd=m,exports.list=o,exports.overlay=e,exports.shortcut=d,exports.slideIn=n,exports.trigger=h;
+var e=`_overlay_zrsc3_23`,t=`_content_zrsc3_39`,n=`_slideIn_zrsc3_1`,r=`_inputWrapper_zrsc3_68`,i=`_inputRight_zrsc3_107`,a=`_input_zrsc3_68`,o=`_list_zrsc3_126`,s=`_group_zrsc3_136`,c=`_groupHeading_zrsc3_142`,l=`_item_zrsc3_150`,u=`_active_zrsc3_153`,d=`_shortcut_zrsc3_157`,f=`_empty_zrsc3_166`,p=`_footer_zrsc3_172`,m=`_kbd_zrsc3_186`,h=`_trigger_zrsc3_195`,g={overlay:e,content:t,slideIn:n,inputWrapper:r,inputRight:i,input:a,list:o,group:s,groupHeading:c,item:l,active:u,shortcut:d,empty:f,footer:p,kbd:m,trigger:h};exports.active=u,exports.content=t,exports.default=g,exports.empty=f,exports.footer=p,exports.group=s,exports.groupHeading=c,exports.input=a,exports.inputRight=i,exports.inputWrapper=r,exports.item=l,exports.kbd=m,exports.list=o,exports.overlay=e,exports.shortcut=d,exports.slideIn=n,exports.trigger=h;

package/dist/components/navigation/CommandPalette/command-palette.module.js

@@ -1,6 +1,6 @@
 "use client";
 //#region src/components/navigation/CommandPalette/command-palette.module.scss
-var e = "_overlay_6u2zl_23", t = "_content_6u2zl_39", n = "_slideIn_6u2zl_1", r = "_inputWrapper_6u2zl_68", i = "_inputRight_6u2zl_107", a = "_input_6u2zl_68", o = "_list_6u2zl_126", s = "_group_6u2zl_136", c = "_groupHeading_6u2zl_142", l = "_item_6u2zl_150", u = "_active_6u2zl_153", d = "_shortcut_6u2zl_157", f = "_empty_6u2zl_166", p = "_footer_6u2zl_172", m = "_kbd_6u2zl_186", h = "_trigger_6u2zl_195", g = {
+var e = "_overlay_zrsc3_23", t = "_content_zrsc3_39", n = "_slideIn_zrsc3_1", r = "_inputWrapper_zrsc3_68", i = "_inputRight_zrsc3_107", a = "_input_zrsc3_68", o = "_list_zrsc3_126", s = "_group_zrsc3_136", c = "_groupHeading_zrsc3_142", l = "_item_zrsc3_150", u = "_active_zrsc3_153", d = "_shortcut_zrsc3_157", f = "_empty_zrsc3_166", p = "_footer_zrsc3_172", m = "_kbd_zrsc3_186", h = "_trigger_zrsc3_195", g = {
 	overlay: e,
 	content: t,
 	slideIn: n,

package/dist/components/navigation/Pagination/Pagination.cjs

@@ -1,2 +1,2 @@
 "use client";
-const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/@radix-ui/react-slot/dist/index.cjs"),n=require("../../../i18n/useWimTranslation.cjs"),r=require("../../../i18n/generated/common.cjs"),i=require("../../../icon/chevron-left.cjs"),a=require("../../../icon/chevron-right.cjs"),o=require("../../media/Icon/Icon.cjs"),s=require("../../form/Button/Button.cjs"),c=require("../../form/Input/Input.cjs"),l=require("../../form/Select/Select.cjs"),u=require("./pagination.module.cjs");let d=require("react");d=e.__toESM(d,1);let f=require("classnames");f=e.__toESM(f,1);let p=require("react/jsx-runtime");var m=d.default.forwardRef(({asChild:e=!1,className:n,children:r,page:i,isActive:a,...o},s)=>(0,p.jsx)(e?t.Root:`button`,{ref:s,type:e?void 0:`button`,className:(0,f.default)(u.default.button,n),"aria-current":a?`page`:void 0,...o,children:e?(0,p.jsx)(t.Slottable,{children:r}):r}));m.displayName=`PaginationPage`;var h=`...`,g=({total:e,pageSize:g=10,current:_=1,onChange:v,onPageSizeChange:y,siblingCount:b=1,className:x,asChild:S=!1,children:C,renderPage:w,hideOnSinglePage:T=!1,simple:E=!1,showSizeChanger:D=!1,pageSizeOptions:ee=[10,20,50,100],showTotal:O,showQuickJumper:k=!1,labels:A={},"aria-label":j,"aria-labelledby":M})=>{let{t:N}=n.useWimTranslation(r.commonNs),{prevPage:P=N(`a11y.go_to_prev_page`),nextPage:F=N(`a11y.go_to_next_page`),pageAriaLabel:I=e=>N(`a11y.go_to_page`,{page:String(e)}),itemsPerPage:L=N(`pagination.items_per_page`),goTo:R=N(`pagination.go_to`),go:z=N(`pagination.go`),pageSizeAriaLabel:B=N(`a11y.items_per_page`),jumpToPageAriaLabel:V=N(`a11y.jump_to_page`),navAriaLabel:H=N(`a11y.pagination_nav`)}=A,[U,W]=(0,d.useState)(g),[G,K]=(0,d.useState)(``),q=U,J=Math.ceil(e/q),Y=(0,d.useMemo)(()=>{if(b+5>=J)return Array.from({length:J},(e,t)=>t+1);let e=Math.max(_-b,1),t=Math.min(_+b,J),n=e>2,r=t<J-2,i=J;if(!n&&r){let e=3+2*b;return[...Array.from({length:e},(e,t)=>t+1),h,J]}if(n&&!r){let e=3+2*b;return[1,h,...Array.from({length:e},(t,n)=>J-e+n+1)]}return n&&r?[1,h,...Array.from({length:t-e+1},(t,n)=>e+n),h,i]:[]},[J,b,_]);if(T&&J<=1)return null;let X=e=>{e<1||e>J||e===_||v?.(e,q)},Z=e=>{W(e),y?.(e),v?.(1,e)},Q=()=>{let e=parseInt(G);!isNaN(e)&&e>=1&&e<=J&&(X(e),K(``))},te=e=>{e.key===`Enter`&&Q()},ne=(_-1)*q+1,re=Math.min(_*q,e),$=S?t.Root:`nav`,ie=e=>{let t={page:e,isActive:e===_,onClick:()=>X(e),"aria-label":I(e)};return w?w(e,t):(0,p.jsx)(m,{...t,children:e})};return E?(0,p.jsxs)($,{className:(0,f.default)(`wim-pagination`,u.default.root,u.default.simple,x),"aria-label":M?void 0:j??H,"aria-labelledby":M,children:[(0,p.jsx)(t.Slottable,{children:C}),(0,p.jsxs)(`ul`,{className:u.default.root,children:[(0,p.jsx)(`li`,{className:(0,f.default)(u.default.item,_===1&&u.default.disabled),children:(0,p.jsx)(`button`,{className:u.default.button,onClick:()=>X(_-1),disabled:_===1,"aria-label":P,children:(0,p.jsx)(o.Icon,{component:i.default,size:`sm`})})}),(0,p.jsx)(`li`,{className:(0,f.default)(u.default.item,u.default.simplePager),children:(0,p.jsxs)(`span`,{children:[_,` / `,J]})}),(0,p.jsx)(`li`,{className:(0,f.default)(u.default.item,_===J&&u.default.disabled),children:(0,p.jsx)(`button`,{className:u.default.button,onClick:()=>X(_+1),disabled:_===J,"aria-label":F,children:(0,p.jsx)(o.Icon,{component:a.default,size:`sm`})})})]})]}):(0,p.jsx)(`div`,{className:(0,f.default)(`wim-pagination`,u.default.container,x),children:(0,p.jsxs)(`div`,{className:u.default.wrapper,children:[O&&(0,p.jsx)(`div`,{className:u.default.total,children:O(e,[ne,re])}),(0,p.jsxs)($,{className:u.default.root,"aria-label":M?void 0:j??H,"aria-labelledby":M,children:[(0,p.jsx)(t.Slottable,{children:C}),(0,p.jsxs)(`ul`,{className:u.default.root,children:[(0,p.jsx)(`li`,{className:(0,f.default)(u.default.item,_===1&&u.default.disabled),children:(0,p.jsx)(`button`,{className:u.default.button,onClick:()=>X(_-1),disabled:_===1,"aria-label":P,children:(0,p.jsx)(o.Icon,{component:i.default,size:`sm`})})}),(0,p.jsx)(`li`,{className:(0,f.default)(u.default.item,u.default.mobileIndicator),children:(0,p.jsxs)(`span`,{children:[_,` / `,J]})}),Y.map((e,t)=>e===h?(0,p.jsx)(`li`,{className:(0,f.default)(u.default.item,u.default.ellipsis),"aria-hidden":`true`,children:h},`ellipsis-${t}`):(0,p.jsx)(`li`,{className:(0,f.default)(u.default.item,u.default.number,e===_&&u.default.active),children:ie(e)},e)),(0,p.jsx)(`li`,{className:(0,f.default)(u.default.item,_===J&&u.default.disabled),children:(0,p.jsx)(`button`,{className:u.default.button,onClick:()=>X(_+1),disabled:_===J,"aria-label":F,children:(0,p.jsx)(o.Icon,{component:a.default,size:`sm`})})})]})]}),D&&(0,p.jsx)(`div`,{className:u.default.sizeChanger,children:(0,p.jsx)(l.Select,{value:String(q),onChange:e=>Z(Number(e)),options:ee.map(e=>({label:`${e} ${L}`,value:String(e)})),width:`auto`,"aria-label":B})}),k&&(0,p.jsxs)(`div`,{className:u.default.quickJumper,children:[(0,p.jsx)(`span`,{children:R}),(0,p.jsx)(c.Input,{type:`number`,min:1,max:J,value:G,onChange:e=>K(e.target.value),onKeyDown:te,width:`60px`,"aria-label":V}),(0,p.jsx)(s.Button,{size:`sm`,variant:`outline`,onClick:Q,disabled:!G,children:z})]})]})})};exports.Pagination=g,exports.default=g,exports.PaginationPage=m;
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/@radix-ui/react-slot/dist/index.cjs"),n=require("../../../i18n/useWimTranslation.cjs"),r=require("../../../i18n/generated/common.cjs"),i=require("../../layout/VisuallyHidden/VisuallyHidden.cjs"),a=require("../../../icon/chevron-left.cjs"),o=require("../../../icon/chevron-right.cjs"),s=require("../../media/Icon/Icon.cjs"),ee=require("../../form/Button/Button.cjs"),te=require("../../form/Input/Input.cjs"),c=require("../../form/Select/Select.cjs"),l=require("./pagination.module.cjs");let u=require("react");u=e.__toESM(u,1);let d=require("classnames");d=e.__toESM(d,1);let f=require("react/jsx-runtime");var p=u.default.forwardRef(({asChild:e=!1,className:n,children:r,page:i,isActive:a,...o},s)=>(0,f.jsx)(e?t.Root:`button`,{ref:s,type:e?void 0:`button`,className:(0,d.default)(l.default.button,n),"aria-current":a?`page`:void 0,...o,children:e?(0,f.jsx)(t.Slottable,{children:r}):r}));p.displayName=`PaginationPage`;var m=`...`,h=({total:e,pageSize:h=10,current:g=1,onChange:_,onPageSizeChange:v,siblingCount:y=1,className:b,asChild:x=!1,children:S,renderPage:C,hideOnSinglePage:w=!1,simple:ne=!1,showSizeChanger:re=!1,pageSizeOptions:T=[10,20,50,100],showTotal:E,showQuickJumper:D=!1,labels:O={},"aria-label":k,"aria-labelledby":A})=>{let{t:j}=n.useWimTranslation(r.commonNs),{prevPage:M=j(`a11y.go_to_prev_page`),nextPage:N=j(`a11y.go_to_next_page`),pageAriaLabel:P=e=>j(`a11y.go_to_page`,{page:String(e)}),itemsPerPage:F=j(`pagination.items_per_page`),goTo:I=j(`pagination.go_to`),go:L=j(`pagination.go`),pageSizeAriaLabel:R=j(`a11y.items_per_page`),jumpToPageAriaLabel:z=j(`a11y.jump_to_page`),navAriaLabel:B=j(`a11y.pagination_nav`),pageStatus:V=(e,t)=>j(`pagination.page_status`,{current:String(e),total:String(t)})}=O,[H,U]=(0,u.useState)(h),[W,G]=(0,u.useState)(``),K=H,q=Math.ceil(e/K),[J,Y]=(0,u.useState)(g),[ie,ae]=(0,u.useState)(``);g!==J&&(Y(g),ae(V(g,q)));let X=(0,f.jsx)(i.VisuallyHidden,{role:`status`,"aria-atomic":`true`,children:ie}),oe=(0,u.useMemo)(()=>{if(y+5>=q)return Array.from({length:q},(e,t)=>t+1);let e=Math.max(g-y,1),t=Math.min(g+y,q),n=e>2,r=t<q-2,i=q;if(!n&&r){let e=3+2*y;return[...Array.from({length:e},(e,t)=>t+1),m,q]}if(n&&!r){let e=3+2*y;return[1,m,...Array.from({length:e},(t,n)=>q-e+n+1)]}return n&&r?[1,m,...Array.from({length:t-e+1},(t,n)=>e+n),m,i]:[]},[q,y,g]);if(w&&q<=1)return null;let Z=e=>{e<1||e>q||e===g||_?.(e,K)},se=e=>{U(e),v?.(e),_?.(1,e)},Q=()=>{let e=parseInt(W);!isNaN(e)&&e>=1&&e<=q&&(Z(e),G(``))},ce=e=>{e.key===`Enter`&&Q()},le=(g-1)*K+1,ue=Math.min(g*K,e),$=x?t.Root:`nav`,de=e=>{let t={page:e,isActive:e===g,onClick:()=>Z(e),"aria-label":P(e)};return C?C(e,t):(0,f.jsx)(p,{...t,children:e})};return ne?(0,f.jsxs)($,{className:(0,d.default)(`wim-pagination`,l.default.root,l.default.simple,b),"aria-label":A?void 0:k??B,"aria-labelledby":A,children:[(0,f.jsx)(t.Slottable,{children:S}),X,(0,f.jsxs)(`ul`,{className:l.default.root,children:[(0,f.jsx)(`li`,{className:(0,d.default)(l.default.item,g===1&&l.default.disabled),children:(0,f.jsx)(`button`,{className:l.default.button,onClick:()=>Z(g-1),disabled:g===1,"aria-label":M,children:(0,f.jsx)(s.Icon,{component:a.default,size:`sm`})})}),(0,f.jsx)(`li`,{className:(0,d.default)(l.default.item,l.default.simplePager),children:(0,f.jsxs)(`span`,{children:[g,` / `,q]})}),(0,f.jsx)(`li`,{className:(0,d.default)(l.default.item,g===q&&l.default.disabled),children:(0,f.jsx)(`button`,{className:l.default.button,onClick:()=>Z(g+1),disabled:g===q,"aria-label":N,children:(0,f.jsx)(s.Icon,{component:o.default,size:`sm`})})})]})]}):(0,f.jsx)(`div`,{className:(0,d.default)(`wim-pagination`,l.default.container,b),children:(0,f.jsxs)(`div`,{className:l.default.wrapper,children:[E&&(0,f.jsx)(`div`,{className:l.default.total,children:E(e,[le,ue])}),(0,f.jsxs)($,{className:l.default.root,"aria-label":A?void 0:k??B,"aria-labelledby":A,children:[(0,f.jsx)(t.Slottable,{children:S}),X,(0,f.jsxs)(`ul`,{className:l.default.root,children:[(0,f.jsx)(`li`,{className:(0,d.default)(l.default.item,g===1&&l.default.disabled),children:(0,f.jsx)(`button`,{className:l.default.button,onClick:()=>Z(g-1),disabled:g===1,"aria-label":M,children:(0,f.jsx)(s.Icon,{component:a.default,size:`sm`})})}),(0,f.jsx)(`li`,{className:(0,d.default)(l.default.item,l.default.mobileIndicator),children:(0,f.jsxs)(`span`,{children:[g,` / `,q]})}),oe.map((e,t)=>e===m?(0,f.jsx)(`li`,{className:(0,d.default)(l.default.item,l.default.ellipsis),"aria-hidden":`true`,children:m},`ellipsis-${t}`):(0,f.jsx)(`li`,{className:(0,d.default)(l.default.item,l.default.number,e===g&&l.default.active),children:de(e)},e)),(0,f.jsx)(`li`,{className:(0,d.default)(l.default.item,g===q&&l.default.disabled),children:(0,f.jsx)(`button`,{className:l.default.button,onClick:()=>Z(g+1),disabled:g===q,"aria-label":N,children:(0,f.jsx)(s.Icon,{component:o.default,size:`sm`})})})]})]}),re&&(0,f.jsx)(`div`,{className:l.default.sizeChanger,children:(0,f.jsx)(c.Select,{value:String(K),onChange:e=>se(Number(e)),options:T.map(e=>({label:`${e} ${F}`,value:String(e)})),width:`auto`,"aria-label":R})}),D&&(0,f.jsxs)(`div`,{className:l.default.quickJumper,children:[(0,f.jsx)(`span`,{children:I}),(0,f.jsx)(te.Input,{type:`number`,min:1,max:q,value:W,onChange:e=>G(e.target.value),onKeyDown:ce,width:`60px`,"aria-label":z}),(0,f.jsx)(ee.Button,{size:`sm`,variant:`outline`,onClick:Q,disabled:!W,children:L})]})]})})};exports.Pagination=h,exports.default=h,exports.PaginationPage=p;

package/dist/components/navigation/Pagination/Pagination.d.ts

@@ -76,6 +76,8 @@ export interface PaginationProps {
         jumpToPageAriaLabel?: string;
         navAriaLabel?: string;
         totalLabel?: string;
+        /** Announced to screen readers when the page changes. Receives the current page and the page count. */
+        pageStatus?: (current: number, totalPages: number) => string;
     };
     /** Accessible name for the navigation landmark. Takes precedence over `labels.navAriaLabel`. */
     "aria-label"?: string;