morya-ui 0.3.1 → 0.3.2

package/CHANGELOG.md

@@ -1,5 +1,37 @@
 # morya-ui
 
+## 0.3.2
+
+### 新功能
+
+- add click ripple and a press-scale toggle
+- replace quick jumper with a filterable Select
+- refine ops layout primitives and P2 filter/stat APIs
+- add shadow prop and remove hoverable
+
+### 修复
+
+- Panel component change demo component width
+- remove OS reduced-motion media queries from components
+- control intensity via library preference only
+
+### 文档
+
+- document impeccable and skills-cli companion install
+- document library-only motion control
+
+### 变更
+
+- extract filter and expanded-key helpers
+- extract label filter helpers for option lists
+- extract sort, filter, and selection helpers
+- extract expand and visible-entry helpers
+- extract option filter and multi-select helpers
+- cover CommandMenu keys and FileUpload dropzone keyboard
+- extract accept and size helpers
+- polish overlay scale, press feedback, and scroll containment
+- refresh snippets, generators, and golden page copies
+
 ## 0.3.1
 
 ### 新功能

package/dist/Button-dMqRmoYa.js

@@ -0,0 +1,222 @@
+import { r as e, t } from "./types-DGuu4Eg4.js";
+import { t as n } from "./Icon-od9Ob-Ay.js";
+import { o as r } from "./config-CapALqt3.js";
+import { Comment as i, Fragment as a, Text as o, computed as s, createBlock as c, createCommentVNode as l, createElementBlock as u, createElementVNode as d, createTextVNode as f, defineComponent as p, normalizeClass as m, normalizeStyle as h, onBeforeUnmount as g, openBlock as _, ref as v, renderSlot as y, resolveDynamicComponent as b, toDisplayString as x, useSlots as ee } from "vue";
+//#region src/components/Button/Button.vue?vue&type=script&setup=true&lang.ts
+var S = [
+	"type",
+	"disabled",
+	"autofocus",
+	"aria-busy",
+	"aria-label"
+], C = {
+	key: 2,
+	class: "m-button__label"
+}, w = 560, T = 280, E = /* @__PURE__ */ p({
+	__name: "Button",
+	props: {
+		label: {},
+		icon: {},
+		iconPos: { default: "left" },
+		iconOnly: {
+			type: Boolean,
+			default: !1
+		},
+		severity: {},
+		color: {},
+		raised: {
+			type: Boolean,
+			default: !1
+		},
+		rounded: {
+			type: Boolean,
+			default: !1
+		},
+		text: {
+			type: Boolean,
+			default: !1
+		},
+		outlined: {
+			type: Boolean,
+			default: !1
+		},
+		link: {
+			type: Boolean,
+			default: !1
+		},
+		ghost: {
+			type: Boolean,
+			default: !1
+		},
+		quaternary: {
+			type: Boolean,
+			default: !1
+		},
+		plain: {
+			type: Boolean,
+			default: !1
+		},
+		variant: {},
+		size: {},
+		fluid: {
+			type: Boolean,
+			default: !1
+		},
+		loading: {
+			type: Boolean,
+			default: !1
+		},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		badge: {},
+		badgeSeverity: { default: null },
+		autofocus: {
+			type: Boolean,
+			default: !1
+		},
+		nativeType: { default: "button" },
+		ariaLabel: {},
+		ripple: {
+			type: Boolean,
+			default: !0
+		},
+		press: {
+			type: Boolean,
+			default: !0
+		}
+	},
+	emits: ["click"],
+	setup(p, { expose: E, emit: D }) {
+		let O = p, k = D, A = ee(), j = v(null), M = v(null), N = /* @__PURE__ */ new Set(), P = s(() => !!A.default?.().some((e) => Z(e))), F = s(() => P.value || !!O.label?.trim()), I = s(() => O.outlined || O.variant === "outlined"), L = s(() => O.text || O.variant === "text"), R = s(() => O.link || O.variant === "link"), z = s(() => O.ghost || O.variant === "ghost"), B = s(() => O.quaternary || O.variant === "quaternary"), V = s(() => O.fluid), H = r("Button", () => O.size), U = s(() => e(H.value)), W = s(() => O.iconOnly || !F.value && !!(O.icon || A.icon || O.loading)), G = s(() => t(O.severity) ?? "primary"), K = s(() => typeof O.icon == "string" ? O.icon : void 0), q = s(() => typeof O.icon == "string" || !O.icon ? void 0 : O.icon), J = s(() => [
+			"m-button",
+			`m-button--${G.value}`,
+			`m-button--${H.value}`,
+			`m-button--icon-${O.iconPos}`,
+			{
+				"m-button--raised": O.raised,
+				"m-button--rounded": O.rounded,
+				"m-button--text": L.value,
+				"m-button--outlined": I.value,
+				"m-button--link": R.value,
+				"m-button--ghost": z.value,
+				"m-button--quaternary": B.value,
+				"m-button--plain": O.plain,
+				"m-button--fluid": V.value,
+				"m-button--loading": O.loading,
+				"m-button--icon-only": W.value,
+				"m-button--custom": !!O.color,
+				"m-button--ripple": O.ripple,
+				"m-button--press": O.press
+			}
+		]), Y = s(() => O.color ? { "--m-button-color": O.color } : void 0), X = s(() => ["m-button__badge", O.badgeSeverity ? `m-button__badge--${t(O.badgeSeverity)}` : "m-button__badge--contrast"]);
+		function Z(e) {
+			if (e == null || typeof e == "boolean") return !1;
+			if (typeof e == "string" || typeof e == "number") return String(e).trim().length > 0;
+			if (Array.isArray(e)) return e.some((e) => Z(e));
+			if (typeof e == "object" && "type" in e) {
+				let t = e;
+				return t.type === i ? !1 : t.type === o ? String(t.children ?? "").trim().length > 0 : t.type !== a || Z(t.children);
+			}
+			return !1;
+		}
+		function Q() {
+			return !O.ripple || typeof document > "u" || document.documentElement.dataset.mMotion === "none";
+		}
+		function te() {
+			return typeof document > "u" ? w : document.documentElement.dataset.mMotion === "reduced" ? T : w;
+		}
+		function $(e, t, n = !1) {
+			if (Q()) return;
+			let r = j.value, i = M.value;
+			if (!r || !i) return;
+			let a = r.getBoundingClientRect(), o = Math.ceil(Math.hypot(a.width, a.height) * 2), s = n ? a.width / 2 : e - a.left, c = n ? a.height / 2 : t - a.top, l = document.createElement("span");
+			l.className = "m-button__ripple-wave", l.style.width = `${o}px`, l.style.height = `${o}px`, l.style.left = `${s - o / 2}px`, l.style.top = `${c - o / 2}px`, i.appendChild(l);
+			let u = te(), d = () => {
+				l.remove();
+			};
+			if (typeof l.animate == "function") {
+				let e = l.animate([
+					{
+						transform: "scale(0)",
+						opacity: .42
+					},
+					{
+						transform: "scale(0.55)",
+						opacity: .22,
+						offset: .55
+					},
+					{
+						transform: "scale(1)",
+						opacity: 0
+					}
+				], {
+					duration: u,
+					easing: "cubic-bezier(0.2, 0, 0, 1)",
+					fill: "forwards"
+				});
+				N.add(e), e.finished.then(() => {
+					N.delete(e), d();
+				}).catch(d);
+				return;
+			}
+			l.classList.add("m-button__ripple-wave--fallback"), window.setTimeout(d, u);
+		}
+		function ne(e) {
+			O.disabled || O.loading || e.button === 0 && $(e.clientX, e.clientY);
+		}
+		function re(e) {
+			O.disabled || O.loading || (e.detail === 0 && $(0, 0, !0), k("click", e));
+		}
+		function ie() {
+			j.value?.focus();
+		}
+		return g(() => {
+			for (let e of N) e.cancel();
+			N.clear();
+		}), E({
+			focus: ie,
+			ref: j
+		}), (e, t) => (_(), u("button", {
+			ref_key: "buttonElement",
+			ref: j,
+			class: m(J.value),
+			style: h(Y.value),
+			type: p.nativeType,
+			disabled: p.disabled || p.loading,
+			autofocus: p.autofocus || void 0,
+			"aria-busy": p.loading || void 0,
+			"aria-label": p.ariaLabel || (W.value ? p.label : void 0),
+			onPointerdown: ne,
+			onClick: re
+		}, [
+			p.ripple ? (_(), u("span", {
+				key: 0,
+				ref_key: "rippleLayer",
+				ref: M,
+				class: "m-button__ripple",
+				"aria-hidden": "true"
+			}, null, 512)) : l("", !0),
+			p.loading || p.icon || e.$slots.icon ? (_(), u("span", {
+				key: 1,
+				class: m(["m-button__icon", { "m-button__icon--loading": p.loading }]),
+				"aria-hidden": "true"
+			}, [p.loading ? y(e.$slots, "loadingicon", {}, () => [t[0] ||= d("span", { class: "m-button__spinner" }, null, -1)], void 0, 0) : y(e.$slots, "icon", { class: "m-button__icon-slot" }, () => [K.value ? (_(), c(n, {
+				key: 0,
+				name: K.value,
+				size: U.value
+			}, null, 8, ["name", "size"])) : q.value ? (_(), c(b(q.value), {
+				key: 1,
+				class: "m-button__icon-graphic"
+			})) : l("", !0)], void 0, 1)], 2)) : l("", !0),
+			F.value && !p.iconOnly ? (_(), u("span", C, [y(e.$slots, "default", {}, () => [f(x(p.label), 1)])])) : l("", !0),
+			p.badge != null && p.badge !== "" ? (_(), u("span", {
+				key: 3,
+				class: m(X.value)
+			}, x(p.badge), 3)) : l("", !0)
+		], 46, S));
+	}
+});
+//#endregion
+export { E as t };

package/dist/{Card-Dsmnzong.js → Card-B1CB9Trm.js}

@@ -28,16 +28,14 @@ var _ = ["aria-label"], v = {
 			type: Boolean,
 			default: !0
 		},
-		hoverable: {
-			type: Boolean,
-			default: !1
-		}
+		shadow: { default: "never" }
 	},
 	setup(c) {
 		let C = c, w = h(), { rootAttrs: T } = e(w, () => C.pt), E = n(() => t(C.size)), D = n(() => `h${C.headingLevel}`), O = n(() => ["m-card", {
 			"m-card--bordered": C.bordered,
 			"m-card--borderless": !C.bordered,
-			"m-card--hoverable": C.hoverable,
+			"m-card--shadow-hover": C.shadow === "hover",
+			"m-card--shadow-always": C.shadow === "always",
 			"m-card--small": E.value === "small",
 			"m-card--large": E.value === "large"
 		}]);

package/dist/Empty-C5tndBOm.js

@@ -0,0 +1,147 @@
+import { a as e } from "./useComponentAttrs-e-5QAjdw.js";
+import { t } from "./Icon-od9Ob-Ay.js";
+import { t as n } from "./useMId-BXFYayPP.js";
+import { n as r } from "./locale-Bzm2nbEp.js";
+import { computed as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createTextVNode as c, defineComponent as l, mergeProps as u, openBlock as d, ref as f, renderSlot as p, toDisplayString as m, unref as h, useAttrs as g, useSlots as _, watch as v } from "vue";
+//#region src/components/Empty/illustrations/loaders.ts
+var y = {
+	"no-content": () => import("./no-content-CwbqVPoN.js"),
+	"no-result": () => import("./no-result-pGce34BV.js"),
+	"no-message": () => import("./no-message-DnIEpMiO.js"),
+	"no-schedule": () => import("./no-schedule-Cl9Frt1Q.js"),
+	"no-issue": () => import("./no-issue-DMkU-Pnw.js"),
+	"network-error": () => import("./network-error-C6vl5a7S.js"),
+	"server-error": () => import("./server-error-D8zGMe5r.js"),
+	building: () => import("./building-DYLdXiQg.js"),
+	"churn-high": () => import("./churn-high-D1ELpZzW.js"),
+	"conversion-low": () => import("./conversion-low-CwZiQc2k.js"),
+	"activity-low": () => import("./activity-low-CgK9kHWr.js"),
+	"profile-unclear": () => import("./profile-unclear-CGs4PCfw.js"),
+	"input-irregular": () => import("./input-irregular-xSLDoNTS.js"),
+	"payment-cycle-long": () => import("./payment-cycle-long-Ba9FNStl.js")
+};
+async function b(e) {
+	return (await y[e]()).default;
+}
+//#endregion
+//#region src/components/Empty/illustrations/defaultEmptyIcon.ts
+var x = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 28 28\" fill=\"none\" aria-hidden=\"true\" focusable=\"false\"><path d=\"M26 7.5C26 11.0899 23.0899 14 19.5 14C15.9101 14 13 11.0899 13 7.5C13 3.91015 15.9101 1 19.5 1C23.0899 1 26 3.91015 26 7.5ZM16.8536 4.14645C16.6583 3.95118 16.3417 3.95118 16.1464 4.14645C15.9512 4.34171 15.9512 4.65829 16.1464 4.85355L18.7929 7.5L16.1464 10.1464C15.9512 10.3417 15.9512 10.6583 16.1464 10.8536C16.3417 11.0488 16.6583 11.0488 16.8536 10.8536L19.5 8.20711L22.1464 10.8536C22.3417 11.0488 22.6583 11.0488 22.8536 10.8536C23.0488 10.6583 23.0488 10.3417 22.8536 10.1464L20.2071 7.5L22.8536 4.85355C23.0488 4.65829 23.0488 3.95118 22.8536 4.14645C22.6583 3.95118 22.3417 3.95118 22.1464 4.14645L19.5 6.79289L16.8536 4.14645Z\" fill=\"currentColor\"/><path d=\"M25 22.75V12.5991C24.5572 13.0765 24.053 13.4961 23.5 13.8454V16H17.5L17.3982 16.0068C17.0322 16.0565 16.75 16.3703 16.75 16.75C16.75 18.2688 15.5188 19.5 14 19.5C12.4812 19.5 11.25 18.2688 11.25 16.75L11.2432 16.6482C11.1935 16.2822 10.8797 16 10.5 16H4.5V7.25C4.5 6.2835 5.2835 5.5 6.25 5.5H12.2696C12.4146 4.97463 12.6153 4.47237 12.865 4H6.25C4.45507 4 3 5.45507 3 7.25V22.75C3 24.5449 4.45507 26 6.25 26H21.75C23.5449 26 25 24.5449 25 22.75ZM4.5 22.75V17.5H9.81597L9.85751 17.7041C10.2905 19.5919 11.9808 21 14 21L14.215 20.9947C16.2095 20.8953 17.842 19.4209 18.184 17.5H23.5V22.75C23.5 23.7165 22.7165 24.5 21.75 24.5H6.25C5.2835 24.5 4.5 23.7165 4.5 22.75Z\" fill=\"currentColor\"/></svg>", S = [
+	"no-content",
+	"no-result",
+	"no-message",
+	"no-schedule",
+	"no-issue"
+], C = [
+	"network-error",
+	"server-error",
+	"building"
+], w = /__MID_(\d+)__/g;
+function T(e, t) {
+	return e.replace(w, (e, n) => `${t}-${n}`);
+}
+async function E(e, t) {
+	return T(await b(e), t);
+}
+//#endregion
+//#region src/components/Empty/Empty.vue?vue&type=script&setup=true&lang.ts
+var D = {
+	key: 0,
+	class: "m-empty__illustration",
+	"aria-hidden": "true"
+}, O = ["src"], k = ["innerHTML"], A = ["innerHTML"], j = {
+	key: 1,
+	class: "m-empty__body"
+}, M = {
+	key: 0,
+	class: "m-empty__title"
+}, N = {
+	key: 1,
+	class: "m-empty__description"
+}, P = {
+	key: 2,
+	class: "m-empty__extra"
+}, F = /* @__PURE__ */ l({
+	inheritAttrs: !1,
+	__name: "Empty",
+	props: {
+		pt: {},
+		title: {},
+		description: {},
+		showDescription: {
+			type: Boolean,
+			default: !0
+		},
+		showIcon: {
+			type: Boolean,
+			default: !0
+		},
+		size: {},
+		icon: {},
+		illustration: {},
+		image: {},
+		simple: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	setup(l) {
+		let y = l, b = g(), S = _(), { rootAttrs: C } = e(b, () => y.pt), w = r(), T = n("m-ill"), F = f(), I = 0;
+		function L(e) {
+			return e === "small" || e === "sm" ? "small" : e === "large" || e === "lg" ? "large" : "medium";
+		}
+		let R = i(() => L(y.size)), z = i(() => !!(S.image || y.image)), B = i(() => !!S.icon), V = i(() => {
+			if (y.showIcon) {
+				if (y.illustration) return y.illustration;
+				if (!(z.value || B.value) && y.icon === "search") return "no-result";
+			}
+		});
+		v(V, (e) => {
+			let t = ++I;
+			if (!e) {
+				F.value = void 0;
+				return;
+			}
+			E(e, T).then((e) => {
+				t === I && (F.value = e);
+			}, () => {
+				t === I && (F.value = void 0);
+			});
+		}, { immediate: !0 });
+		let H = i(() => y.showIcon && !!V.value && !!F.value && !z.value && !B.value), U = i(() => y.showIcon && !!y.icon && y.icon !== "search" && !V.value && !z.value && !B.value), W = i(() => y.showIcon && !V.value && !U.value && !z.value && !B.value), G = i(() => y.showIcon && (z.value || B.value || H.value || U.value || W.value)), K = i(() => y.description == null ? w.value.emptyMessage : y.description), q = i(() => S.title ? !0 : y.title != null && y.title !== ""), J = i(() => y.showDescription ? S.default ? !0 : !!K.value : !1), Y = i(() => [
+			"m-empty",
+			`m-empty--${R.value}`,
+			{
+				"m-empty--simple": y.simple,
+				"m-empty--default-icon": W.value
+			}
+		]);
+		return (e, n) => (d(), s("div", u(h(C), {
+			class: Y.value,
+			role: "status"
+		}), [
+			G.value ? (d(), s("div", D, [z.value ? p(e.$slots, "image", {}, () => [l.image ? (d(), s("img", {
+				key: 0,
+				class: "m-empty__image",
+				src: l.image,
+				alt: ""
+			}, null, 8, O)) : o("", !0)], void 0, 0) : B.value ? p(e.$slots, "icon", {}, void 0, void 0, 1) : H.value && F.value ? (d(), s("div", {
+				key: 2,
+				class: "m-empty__glyph",
+				innerHTML: F.value
+			}, null, 8, k)) : U.value && l.icon ? (d(), a(t, {
+				key: 3,
+				class: "m-empty__icon",
+				name: l.icon,
+				size: "lg"
+			}, null, 8, ["name"])) : W.value ? (d(), s("div", {
+				key: 4,
+				class: "m-empty__default-icon",
+				innerHTML: h(x)
+			}, null, 8, A)) : o("", !0)])) : o("", !0),
+			q.value || J.value ? (d(), s("div", j, [q.value ? (d(), s("div", M, [p(e.$slots, "title", {}, () => [c(m(l.title), 1)])])) : o("", !0), J.value ? (d(), s("div", N, [p(e.$slots, "default", {}, () => [c(m(K.value), 1)])])) : o("", !0)])) : o("", !0),
+			h(S).extra ? (d(), s("div", P, [p(e.$slots, "extra")])) : o("", !0)
+		], 16));
+	}
+});
+//#endregion
+export { b as i, C as n, S as r, F as t };

package/dist/Pagination-CqpC5EAs.js

@@ -0,0 +1,166 @@
+import { a as e } from "./useComponentAttrs-e-5QAjdw.js";
+import { t } from "./Icon-od9Ob-Ay.js";
+import { t as n } from "./Select-CKGrSoaC.js";
+import { n as r, t as i } from "./locale-Bzm2nbEp.js";
+import { Fragment as a, computed as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createVNode as u, defineComponent as d, mergeProps as f, normalizeClass as p, openBlock as m, renderList as h, toDisplayString as g, unref as _, useAttrs as v } from "vue";
+//#region src/components/Pagination/Pagination.vue?vue&type=script&setup=true&lang.ts
+var y = ["aria-label"], b = ["disabled", "aria-label"], x = {
+	key: 0,
+	class: "m-pagination__simple",
+	"aria-current": "page"
+}, S = [
+	"disabled",
+	"aria-label",
+	"aria-current",
+	"onClick"
+], C = ["disabled", "aria-label"], w = {
+	key: 2,
+	class: "m-pagination__sizer"
+}, T = { class: "m-pagination__sizer-label" }, E = ["disabled", "value"], D = ["value"], O = {
+	key: 3,
+	class: "m-pagination__jumper"
+}, k = { key: 0 }, A = /* @__PURE__ */ d({
+	inheritAttrs: !1,
+	__name: "Pagination",
+	props: {
+		pt: {},
+		modelValue: { default: 1 },
+		totalRecords: {},
+		rows: { default: 10 },
+		pageSize: {},
+		pageLinkSize: { default: 5 },
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		showSizePicker: {
+			type: Boolean,
+			default: !1
+		},
+		pageSizes: { default: () => [
+			10,
+			20,
+			50,
+			100
+		] },
+		showQuickJumper: {
+			type: Boolean,
+			default: !1
+		},
+		simple: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: [
+		"update:modelValue",
+		"page",
+		"update:rows",
+		"update:pageSize"
+	],
+	setup(d, { expose: A, emit: j }) {
+		let M = d, N = j, P = v(), { rootAttrs: F } = e(P, () => M.pt), I = r(), L = o(() => Math.max(1, M.pageSize ?? M.rows)), R = o(() => Math.max(1, Math.ceil(M.totalRecords / L.value))), z = o(() => Math.min(Math.max(1, M.modelValue), R.value)), B = o(() => (z.value - 1) * L.value), V = o(() => {
+			let e = Math.min(M.pageLinkSize, R.value), t = Math.min(Math.max(1, z.value - Math.floor(e / 2)), R.value - e + 1);
+			return Array.from({ length: e }, (e, n) => t + n);
+		}), H = o(() => {
+			let e = [...M.pageSizes];
+			return e.includes(L.value) || e.unshift(L.value), e;
+		}), U = o(() => !M.showQuickJumper || M.simple ? [] : Array.from({ length: R.value }, (e, t) => {
+			let n = t + 1;
+			return {
+				label: String(n),
+				value: n
+			};
+		})), W = o(() => ({ control: { "aria-label": I.value.jumpToPage } }));
+		function G(e) {
+			let t = Math.min(Math.max(1, e), R.value);
+			M.disabled || t === z.value || (N("update:modelValue", t), N("page", t));
+		}
+		function K(e) {
+			if (M.disabled || e === L.value) return;
+			N("update:rows", e), N("update:pageSize", e);
+			let t = Math.max(1, Math.ceil(M.totalRecords / e)), n = Math.min(z.value, t);
+			n !== z.value && (N("update:modelValue", n), N("page", n));
+		}
+		function q(e) {
+			let t = Number(e.target.value);
+			Number.isFinite(t) && K(t);
+		}
+		function J(e) {
+			if (typeof e != "number" && typeof e != "string") return;
+			let t = typeof e == "number" ? e : Number(e);
+			Number.isFinite(t) && G(t);
+		}
+		function Y(e) {
+			return i(I.value.page, { page: e });
+		}
+		return A({
+			first: B,
+			pageCount: R
+		}), (e, r) => (m(), c("nav", f(_(F), {
+			class: ["m-pagination", { "m-pagination--simple": d.simple }],
+			"aria-label": _(I).pagination
+		}), [
+			l("button", {
+				type: "button",
+				class: "m-pagination__button",
+				disabled: d.disabled || z.value === 1,
+				"aria-label": _(I).prevPage,
+				onClick: r[0] ||= (e) => G(z.value - 1)
+			}, [u(t, {
+				name: "chevron-left",
+				size: "sm"
+			})], 8, b),
+			d.simple ? (m(), c("span", x, g(z.value) + " / " + g(R.value), 1)) : (m(!0), c(a, { key: 1 }, h(V.value, (e) => (m(), c("button", {
+				key: e,
+				type: "button",
+				class: p(["m-pagination__button", { "m-pagination__button--active": e === z.value }]),
+				disabled: d.disabled,
+				"aria-label": Y(e),
+				"aria-current": e === z.value ? "page" : void 0,
+				onClick: (t) => G(e)
+			}, g(e), 11, S))), 128)),
+			l("button", {
+				type: "button",
+				class: "m-pagination__button",
+				disabled: d.disabled || z.value === R.value,
+				"aria-label": _(I).nextPage,
+				onClick: r[1] ||= (e) => G(z.value + 1)
+			}, [u(t, {
+				name: "chevron-right",
+				size: "sm"
+			})], 8, C),
+			d.showSizePicker && !d.simple ? (m(), c("label", w, [l("span", T, g(_(I).itemsPerPage), 1), l("select", {
+				class: "m-pagination__select",
+				disabled: d.disabled,
+				value: L.value,
+				onChange: q
+			}, [(m(!0), c(a, null, h(H.value, (e) => (m(), c("option", {
+				key: e,
+				value: e
+			}, g(e), 9, D))), 128))], 40, E)])) : s("", !0),
+			d.showQuickJumper && !d.simple ? (m(), c("div", O, [
+				l("span", null, g(_(I).jumpToPage), 1),
+				u(n, {
+					class: "m-pagination__jumper-select",
+					size: "small",
+					"model-value": z.value,
+					options: U.value,
+					disabled: d.disabled,
+					filter: R.value > 10,
+					pt: W.value,
+					"onUpdate:modelValue": J
+				}, null, 8, [
+					"model-value",
+					"options",
+					"disabled",
+					"filter",
+					"pt"
+				]),
+				_(I).pageClassifier ? (m(), c("span", k, g(_(I).pageClassifier), 1)) : s("", !0)
+			])) : s("", !0)
+		], 16, y));
+	}
+});
+//#endregion
+export { A as t };