@v-c/pagination 1.0.0 → 1.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Options.js +8 -10
- package/dist/Pager.d.ts +2 -0
- package/dist/Pager.js +22 -10
- package/dist/Pagination.js +67 -40
- package/dist/index.d.ts +1 -1
- package/dist/index.js +2 -2
- package/dist/interface.d.ts +4 -1
- package/dist/interface.js +2 -0
- package/dist/isEnterOrSpaceKey.d.ts +7 -0
- package/dist/isEnterOrSpaceKey.js +7 -0
- package/dist/locale/am.js +4 -2
- package/dist/locale/ar_EG.js +4 -2
- package/dist/locale/az_AZ.js +4 -2
- package/dist/locale/bg_BG.js +4 -2
- package/dist/locale/bn_BD.js +4 -2
- package/dist/locale/by_BY.js +4 -2
- package/dist/locale/ca_ES.js +4 -2
- package/dist/locale/cs_CZ.js +4 -2
- package/dist/locale/da_DK.js +4 -2
- package/dist/locale/de_DE.js +4 -2
- package/dist/locale/el_GR.js +4 -2
- package/dist/locale/en_GB.js +4 -2
- package/dist/locale/en_US.js +4 -2
- package/dist/locale/es_ES.js +4 -2
- package/dist/locale/et_EE.js +4 -2
- package/dist/locale/eu_ES.js +4 -2
- package/dist/locale/fa_IR.js +4 -2
- package/dist/locale/fi_FI.js +4 -2
- package/dist/locale/fr_BE.js +4 -2
- package/dist/locale/fr_CA.js +4 -2
- package/dist/locale/fr_FR.js +4 -2
- package/dist/locale/ga_IE.js +4 -2
- package/dist/locale/gl_ES.js +4 -2
- package/dist/locale/he_IL.js +4 -2
- package/dist/locale/hi_IN.js +4 -2
- package/dist/locale/hr_HR.js +4 -2
- package/dist/locale/hu_HU.js +4 -2
- package/dist/locale/id_ID.js +4 -2
- package/dist/locale/is_IS.js +4 -2
- package/dist/locale/it_IT.js +4 -2
- package/dist/locale/ja_JP.js +4 -2
- package/dist/locale/ka_GE.js +4 -2
- package/dist/locale/kk_KZ.js +4 -2
- package/dist/locale/km_KH.js +4 -2
- package/dist/locale/kmr_IQ.js +4 -2
- package/dist/locale/kn_IN.js +4 -2
- package/dist/locale/ko_KR.js +4 -2
- package/dist/locale/lt_LT.js +4 -2
- package/dist/locale/lv_LV.js +4 -2
- package/dist/locale/mk_MK.js +4 -2
- package/dist/locale/ml_IN.js +4 -2
- package/dist/locale/mn_MN.js +4 -2
- package/dist/locale/mr_IN.js +4 -2
- package/dist/locale/ms_MY.js +4 -2
- package/dist/locale/my_MM.js +4 -2
- package/dist/locale/nb_NO.js +4 -2
- package/dist/locale/ne_NP.js +4 -2
- package/dist/locale/nl_BE.js +4 -2
- package/dist/locale/nl_NL.js +4 -2
- package/dist/locale/pa_IN.js +4 -2
- package/dist/locale/pb_IN.js +4 -2
- package/dist/locale/pl_PL.js +4 -2
- package/dist/locale/pt_BR.js +4 -2
- package/dist/locale/pt_PT.js +4 -2
- package/dist/locale/ro_RO.js +4 -2
- package/dist/locale/ru_RU.js +4 -2
- package/dist/locale/si_LK.js +4 -2
- package/dist/locale/sk_SK.js +4 -2
- package/dist/locale/sl_SI.js +4 -2
- package/dist/locale/sr_Cyrl_RS.js +4 -2
- package/dist/locale/sr_RS.js +4 -2
- package/dist/locale/sv_SE.js +4 -2
- package/dist/locale/ta_IN.js +4 -2
- package/dist/locale/te_IN.js +4 -2
- package/dist/locale/th_TH.js +4 -2
- package/dist/locale/tk_TK.js +4 -2
- package/dist/locale/tr_TR.js +4 -2
- package/dist/locale/ug_CN.js +4 -2
- package/dist/locale/uk_UA.js +4 -2
- package/dist/locale/ur_PK.js +4 -2
- package/dist/locale/uz_UZ.js +4 -2
- package/dist/locale/vi_VN.js +4 -2
- package/dist/locale/zh_CN.js +4 -2
- package/dist/locale/zh_TW.js +4 -2
- package/package.json +13 -7
- package/dist/Options.cjs +0 -162
- package/dist/Pager.cjs +0 -80
- package/dist/Pagination.cjs +0 -592
- package/dist/_virtual/rolldown_runtime.cjs +0 -21
- package/dist/index.cjs +0 -6
- package/dist/interface.cjs +0 -30
- package/dist/locale/am.cjs +0 -19
- package/dist/locale/ar_EG.cjs +0 -19
- package/dist/locale/az_AZ.cjs +0 -19
- package/dist/locale/bg_BG.cjs +0 -19
- package/dist/locale/bn_BD.cjs +0 -19
- package/dist/locale/by_BY.cjs +0 -19
- package/dist/locale/ca_ES.cjs +0 -19
- package/dist/locale/cs_CZ.cjs +0 -19
- package/dist/locale/da_DK.cjs +0 -19
- package/dist/locale/de_DE.cjs +0 -19
- package/dist/locale/el_GR.cjs +0 -19
- package/dist/locale/en_GB.cjs +0 -19
- package/dist/locale/en_US.cjs +0 -19
- package/dist/locale/es_ES.cjs +0 -19
- package/dist/locale/et_EE.cjs +0 -19
- package/dist/locale/eu_ES.cjs +0 -19
- package/dist/locale/fa_IR.cjs +0 -19
- package/dist/locale/fi_FI.cjs +0 -19
- package/dist/locale/fr_BE.cjs +0 -19
- package/dist/locale/fr_CA.cjs +0 -19
- package/dist/locale/fr_FR.cjs +0 -19
- package/dist/locale/ga_IE.cjs +0 -19
- package/dist/locale/gl_ES.cjs +0 -19
- package/dist/locale/he_IL.cjs +0 -19
- package/dist/locale/hi_IN.cjs +0 -19
- package/dist/locale/hr_HR.cjs +0 -19
- package/dist/locale/hu_HU.cjs +0 -19
- package/dist/locale/id_ID.cjs +0 -19
- package/dist/locale/is_IS.cjs +0 -19
- package/dist/locale/it_IT.cjs +0 -19
- package/dist/locale/ja_JP.cjs +0 -19
- package/dist/locale/ka_GE.cjs +0 -19
- package/dist/locale/kk_KZ.cjs +0 -19
- package/dist/locale/km_KH.cjs +0 -19
- package/dist/locale/kmr_IQ.cjs +0 -19
- package/dist/locale/kn_IN.cjs +0 -19
- package/dist/locale/ko_KR.cjs +0 -19
- package/dist/locale/lt_LT.cjs +0 -19
- package/dist/locale/lv_LV.cjs +0 -19
- package/dist/locale/mk_MK.cjs +0 -19
- package/dist/locale/ml_IN.cjs +0 -19
- package/dist/locale/mn_MN.cjs +0 -19
- package/dist/locale/mr_IN.cjs +0 -19
- package/dist/locale/ms_MY.cjs +0 -19
- package/dist/locale/my_MM.cjs +0 -19
- package/dist/locale/nb_NO.cjs +0 -18
- package/dist/locale/ne_NP.cjs +0 -19
- package/dist/locale/nl_BE.cjs +0 -19
- package/dist/locale/nl_NL.cjs +0 -19
- package/dist/locale/pa_IN.cjs +0 -19
- package/dist/locale/pb_IN.cjs +0 -19
- package/dist/locale/pl_PL.cjs +0 -19
- package/dist/locale/pt_BR.cjs +0 -19
- package/dist/locale/pt_PT.cjs +0 -19
- package/dist/locale/ro_RO.cjs +0 -19
- package/dist/locale/ru_RU.cjs +0 -19
- package/dist/locale/si_LK.cjs +0 -19
- package/dist/locale/sk_SK.cjs +0 -19
- package/dist/locale/sl_SI.cjs +0 -19
- package/dist/locale/sr_Cyrl_RS.cjs +0 -18
- package/dist/locale/sr_RS.cjs +0 -18
- package/dist/locale/sv_SE.cjs +0 -19
- package/dist/locale/ta_IN.cjs +0 -19
- package/dist/locale/te_IN.cjs +0 -19
- package/dist/locale/th_TH.cjs +0 -19
- package/dist/locale/tk_TK.cjs +0 -19
- package/dist/locale/tr_TR.cjs +0 -19
- package/dist/locale/ug_CN.cjs +0 -19
- package/dist/locale/uk_UA.cjs +0 -19
- package/dist/locale/ur_PK.cjs +0 -19
- package/dist/locale/uz_UZ.cjs +0 -19
- package/dist/locale/vi_VN.cjs +0 -19
- package/dist/locale/zh_CN.cjs +0 -19
- package/dist/locale/zh_TW.cjs +0 -19
package/dist/Options.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { computed, createVNode, defineComponent, nextTick, ref } from "vue";
|
|
2
2
|
import KeyCode from "@v-c/util/dist/KeyCode";
|
|
3
|
-
|
|
3
|
+
//#region src/Options.tsx
|
|
4
|
+
var Options = /* @__PURE__ */ defineComponent((props) => {
|
|
4
5
|
const defaultPageSizeOptions = [
|
|
5
6
|
10,
|
|
6
7
|
20,
|
|
@@ -97,13 +98,11 @@ var Options_default = /* @__PURE__ */ defineComponent((props) => {
|
|
|
97
98
|
},
|
|
98
99
|
locale: {
|
|
99
100
|
type: Object,
|
|
100
|
-
required: true
|
|
101
|
-
default: void 0
|
|
101
|
+
required: true
|
|
102
102
|
},
|
|
103
103
|
rootPrefixCls: {
|
|
104
104
|
type: String,
|
|
105
|
-
required: true
|
|
106
|
-
default: void 0
|
|
105
|
+
required: true
|
|
107
106
|
},
|
|
108
107
|
selectPrefixCls: {
|
|
109
108
|
type: String,
|
|
@@ -112,8 +111,7 @@ var Options_default = /* @__PURE__ */ defineComponent((props) => {
|
|
|
112
111
|
},
|
|
113
112
|
pageSize: {
|
|
114
113
|
type: Number,
|
|
115
|
-
required: true
|
|
116
|
-
default: void 0
|
|
114
|
+
required: true
|
|
117
115
|
},
|
|
118
116
|
pageSizeOptions: {
|
|
119
117
|
type: Array,
|
|
@@ -143,8 +141,7 @@ var Options_default = /* @__PURE__ */ defineComponent((props) => {
|
|
|
143
141
|
},
|
|
144
142
|
showSizeChanger: {
|
|
145
143
|
type: Boolean,
|
|
146
|
-
required: true
|
|
147
|
-
default: void 0
|
|
144
|
+
required: true
|
|
148
145
|
},
|
|
149
146
|
sizeChangerRender: {
|
|
150
147
|
type: Function,
|
|
@@ -152,4 +149,5 @@ var Options_default = /* @__PURE__ */ defineComponent((props) => {
|
|
|
152
149
|
default: void 0
|
|
153
150
|
}
|
|
154
151
|
} });
|
|
155
|
-
|
|
152
|
+
//#endregion
|
|
153
|
+
export { Options as default };
|
package/dist/Pager.d.ts
CHANGED
|
@@ -3,6 +3,8 @@ import { PaginationProps } from './interface';
|
|
|
3
3
|
export interface PagerProps extends Pick<PaginationProps, 'itemRender'> {
|
|
4
4
|
rootPrefixCls: string;
|
|
5
5
|
page: number;
|
|
6
|
+
/** Localized word for "page", prefixed to the number in the accessible name. */
|
|
7
|
+
pageLabel?: string;
|
|
6
8
|
active?: boolean;
|
|
7
9
|
className?: string;
|
|
8
10
|
style?: CSSProperties;
|
package/dist/Pager.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { createVNode, defineComponent } from "vue";
|
|
2
2
|
import { classNames } from "@v-c/util";
|
|
3
|
-
|
|
3
|
+
//#region src/Pager.tsx
|
|
4
|
+
var Pager = /* @__PURE__ */ defineComponent((props) => {
|
|
4
5
|
const handleClick = () => {
|
|
5
6
|
props.onClick?.(props.page);
|
|
6
7
|
};
|
|
@@ -8,31 +9,42 @@ var Pager_default = /* @__PURE__ */ defineComponent((props) => {
|
|
|
8
9
|
props.onKeyPress?.(e, props.onClick, props.page);
|
|
9
10
|
};
|
|
10
11
|
return () => {
|
|
11
|
-
const { rootPrefixCls, page, active, className, showTitle, itemRender, style } = props;
|
|
12
|
+
const { rootPrefixCls, page, pageLabel, active, className, showTitle, itemRender, style } = props;
|
|
12
13
|
const prefixCls = `${rootPrefixCls}-item`;
|
|
13
14
|
const cls = classNames(prefixCls, `${prefixCls}-${page}`, {
|
|
14
15
|
[`${prefixCls}-active`]: active,
|
|
15
16
|
[`${prefixCls}-disabled`]: !page
|
|
16
17
|
}, className);
|
|
17
|
-
const pager = itemRender?.(page, "page", createVNode("a", {
|
|
18
|
+
const pager = itemRender?.(page, "page", createVNode("a", {
|
|
19
|
+
"tabindex": -1,
|
|
20
|
+
"aria-hidden": "true",
|
|
21
|
+
"rel": "nofollow"
|
|
22
|
+
}, [page]));
|
|
23
|
+
const pagerLabel = `${pageLabel ?? ""} ${page}`.trim();
|
|
18
24
|
return pager ? createVNode("li", {
|
|
19
25
|
"title": showTitle ? String(page) : void 0,
|
|
20
26
|
"class": cls,
|
|
21
27
|
"style": style,
|
|
22
28
|
"onClick": handleClick,
|
|
23
29
|
"onKeydown": handleKeyPress,
|
|
24
|
-
"tabindex": 0
|
|
30
|
+
"tabindex": 0,
|
|
31
|
+
"role": "button",
|
|
32
|
+
"aria-label": pagerLabel,
|
|
33
|
+
"aria-current": active ? "page" : void 0
|
|
25
34
|
}, [pager]) : null;
|
|
26
35
|
};
|
|
27
36
|
}, { props: {
|
|
28
37
|
rootPrefixCls: {
|
|
29
38
|
type: String,
|
|
30
|
-
required: true
|
|
31
|
-
default: void 0
|
|
39
|
+
required: true
|
|
32
40
|
},
|
|
33
41
|
page: {
|
|
34
42
|
type: Number,
|
|
35
|
-
required: true
|
|
43
|
+
required: true
|
|
44
|
+
},
|
|
45
|
+
pageLabel: {
|
|
46
|
+
type: String,
|
|
47
|
+
required: false,
|
|
36
48
|
default: void 0
|
|
37
49
|
},
|
|
38
50
|
active: {
|
|
@@ -52,8 +64,7 @@ var Pager_default = /* @__PURE__ */ defineComponent((props) => {
|
|
|
52
64
|
},
|
|
53
65
|
showTitle: {
|
|
54
66
|
type: Boolean,
|
|
55
|
-
required: true
|
|
56
|
-
default: void 0
|
|
67
|
+
required: true
|
|
57
68
|
},
|
|
58
69
|
onClick: {
|
|
59
70
|
type: Function,
|
|
@@ -71,4 +82,5 @@ var Pager_default = /* @__PURE__ */ defineComponent((props) => {
|
|
|
71
82
|
default: void 0
|
|
72
83
|
}
|
|
73
84
|
} });
|
|
74
|
-
|
|
85
|
+
//#endregion
|
|
86
|
+
export { Pager as default };
|
package/dist/Pagination.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
1
|
+
import Options from "./Options.js";
|
|
2
|
+
import Pager from "./Pager.js";
|
|
3
|
+
import isEnterOrSpaceKey from "./isEnterOrSpaceKey.js";
|
|
4
|
+
import locale from "./locale/zh_CN.js";
|
|
4
5
|
import { computed, createTextVNode, createVNode, defineComponent, h, isVNode, mergeProps, ref, toRef, watchEffect } from "vue";
|
|
5
6
|
import KeyCode from "@v-c/util/dist/KeyCode";
|
|
6
7
|
import { classNames } from "@v-c/util";
|
|
@@ -9,6 +10,7 @@ import pickAttrs from "@v-c/util/dist/pickAttrs";
|
|
|
9
10
|
import { getAttrStyleAndClass } from "@v-c/util/dist/props-util";
|
|
10
11
|
import { cloneElement } from "@v-c/util/dist/vnode";
|
|
11
12
|
import warning from "@v-c/util/dist/warning";
|
|
13
|
+
//#region src/Pagination.tsx
|
|
12
14
|
function isInteger(v) {
|
|
13
15
|
const value = Number(v);
|
|
14
16
|
return typeof value === "number" && !Number.isNaN(value) && isFinite(value) && Math.floor(value) === value;
|
|
@@ -26,10 +28,10 @@ var paginationDefaults = {
|
|
|
26
28
|
defaultPageSize: 10,
|
|
27
29
|
showPrevNextJumpers: true,
|
|
28
30
|
showTitle: true,
|
|
29
|
-
locale
|
|
31
|
+
locale,
|
|
30
32
|
totalBoundaryShowSizeChanger: 50
|
|
31
33
|
};
|
|
32
|
-
var
|
|
34
|
+
var Pagination = /* @__PURE__ */ defineComponent((props, { attrs }) => {
|
|
33
35
|
const paginationRef = ref();
|
|
34
36
|
const mergedPrefixCls = computed(() => props.prefixCls ?? paginationDefaults.prefixCls);
|
|
35
37
|
const mergedSelectPrefixCls = computed(() => props.selectPrefixCls ?? paginationDefaults.selectPrefixCls);
|
|
@@ -59,22 +61,24 @@ var Pagination_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
|
|
|
59
61
|
});
|
|
60
62
|
function getValidValue(e) {
|
|
61
63
|
const inputValue = e.target.value;
|
|
62
|
-
const allPages
|
|
64
|
+
const allPages = calculatePage(void 0, pageSize.value, mergedTotal.value);
|
|
63
65
|
let value;
|
|
64
66
|
if (inputValue === "") value = inputValue;
|
|
65
67
|
else if (Number.isNaN(Number(inputValue))) value = internalInputVal.value;
|
|
66
|
-
else if (inputValue >= allPages
|
|
68
|
+
else if (inputValue >= allPages) value = allPages;
|
|
67
69
|
else value = Number(inputValue);
|
|
68
70
|
return value;
|
|
69
71
|
}
|
|
70
72
|
function isValid(page) {
|
|
71
73
|
return isInteger(page) && page !== current.value && isInteger(mergedTotal.value) && mergedTotal.value > 0;
|
|
72
74
|
}
|
|
73
|
-
function getItemIcon(icon,
|
|
75
|
+
function getItemIcon(icon, _label, title) {
|
|
74
76
|
const prefixCls = mergedPrefixCls.value;
|
|
75
77
|
let iconNode = icon || createVNode("button", {
|
|
76
78
|
"type": "button",
|
|
77
|
-
"
|
|
79
|
+
"tabindex": -1,
|
|
80
|
+
"aria-hidden": "true",
|
|
81
|
+
"title": title,
|
|
78
82
|
"class": `${prefixCls}-item-link`
|
|
79
83
|
}, null);
|
|
80
84
|
if (typeof icon === "function") iconNode = h(icon, { ...props });
|
|
@@ -112,29 +116,36 @@ var Pagination_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
|
|
|
112
116
|
function jumpNextHandle() {
|
|
113
117
|
handleChange(jumpNextPage.value);
|
|
114
118
|
}
|
|
115
|
-
function
|
|
116
|
-
if (event
|
|
119
|
+
function runIfEnterOrSpace(event, callback, ...restParams) {
|
|
120
|
+
if (isEnterOrSpaceKey(event)) {
|
|
121
|
+
event.preventDefault();
|
|
122
|
+
callback(...restParams);
|
|
123
|
+
}
|
|
117
124
|
}
|
|
118
125
|
function runIfEnterPrev(event) {
|
|
119
|
-
|
|
126
|
+
runIfEnterOrSpace(event, prevHandle);
|
|
120
127
|
}
|
|
121
128
|
function runIfEnterNext(event) {
|
|
122
|
-
|
|
129
|
+
runIfEnterOrSpace(event, nextHandle);
|
|
123
130
|
}
|
|
124
131
|
function runIfEnterJumpPrev(event) {
|
|
125
|
-
|
|
132
|
+
runIfEnterOrSpace(event, jumpPrevHandle);
|
|
126
133
|
}
|
|
127
134
|
function runIfEnterJumpNext(event) {
|
|
128
|
-
|
|
135
|
+
runIfEnterOrSpace(event, jumpNextHandle);
|
|
129
136
|
}
|
|
130
|
-
function renderPrev(prevPage
|
|
131
|
-
const
|
|
137
|
+
function renderPrev(prevPage) {
|
|
138
|
+
const itemRender = props.itemRender || defaultItemRender;
|
|
139
|
+
const prevPageTitle = mergedLocale.value.prev_page || "prev page";
|
|
140
|
+
const prevButton = itemRender?.(prevPage, "prev", getItemIcon(props.prevIcon, prevPageTitle, mergedShowTitle.value ? prevPageTitle : void 0));
|
|
132
141
|
const nextProps = {};
|
|
133
142
|
if (!hasPrev.value) nextProps.disabled = true;
|
|
134
143
|
return isVNode(prevButton) ? cloneElement(prevButton, nextProps) : prevButton;
|
|
135
144
|
}
|
|
136
|
-
function renderNext(nextPage
|
|
137
|
-
const
|
|
145
|
+
function renderNext(nextPage) {
|
|
146
|
+
const itemRender = props.itemRender || defaultItemRender;
|
|
147
|
+
const nextPageTitle = mergedLocale.value.next_page || "next page";
|
|
148
|
+
const nextButton = itemRender?.(nextPage, "next", getItemIcon(props.nextIcon, nextPageTitle, mergedShowTitle.value ? nextPageTitle : void 0));
|
|
138
149
|
const nextProps = {};
|
|
139
150
|
if (!hasNext.value) nextProps.disabled = true;
|
|
140
151
|
return isVNode(nextButton) ? cloneElement(nextButton, nextProps) : nextButton;
|
|
@@ -142,6 +153,10 @@ var Pagination_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
|
|
|
142
153
|
function handleGoTO(event) {
|
|
143
154
|
if (event.type === "click" || event.keyCode === KeyCode.ENTER) handleChange(internalInputVal.value);
|
|
144
155
|
}
|
|
156
|
+
/**
|
|
157
|
+
* prevent "up arrow" key reseting cursor position within textbox
|
|
158
|
+
* @see https://stackoverflow.com/a/1081114
|
|
159
|
+
*/
|
|
145
160
|
function handleKeyDown(event) {
|
|
146
161
|
if (event.keyCode === KeyCode.UP || event.keyCode === KeyCode.DOWN) event.preventDefault();
|
|
147
162
|
}
|
|
@@ -165,13 +180,15 @@ var Pagination_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
|
|
|
165
180
|
handleChange(getValidValue(event));
|
|
166
181
|
}
|
|
167
182
|
function changePageSize(size) {
|
|
183
|
+
const preservedPage = Math.floor((current.value - 1) * pageSize.value / size) + 1;
|
|
168
184
|
const newCurrent = calculatePage(size, pageSize.value, mergedTotal.value);
|
|
185
|
+
const recommendPage = newCurrent === 0 ? 1 : Math.min(preservedPage, newCurrent);
|
|
169
186
|
const nextCurrent = current.value > newCurrent && newCurrent !== 0 ? newCurrent : current.value;
|
|
170
187
|
setPageSize(size);
|
|
171
188
|
internalInputVal.value = nextCurrent;
|
|
172
189
|
props.onShowSizeChange?.(current.value, size);
|
|
173
190
|
setCurrent(nextCurrent);
|
|
174
|
-
props.onChange?.(nextCurrent, size);
|
|
191
|
+
props.onChange?.(nextCurrent, size, { recommendPage });
|
|
175
192
|
}
|
|
176
193
|
const shouldDisplayQuickJumper = computed(() => mergedTotal.value > pageSize.value ? props.showQuickJumper : false);
|
|
177
194
|
return () => {
|
|
@@ -200,13 +217,14 @@ var Pagination_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
|
|
|
200
217
|
return prev;
|
|
201
218
|
})();
|
|
202
219
|
prev = createVNode("li", {
|
|
203
|
-
"title": showTitle ? locale?.prev_page : void 0,
|
|
204
220
|
"onClick": prevHandle,
|
|
205
221
|
"tabindex": prevDisabled ? void 0 : 0,
|
|
206
222
|
"onKeydown": runIfEnterPrev,
|
|
207
223
|
"class": classNames(`${prefixCls}-prev`, itemClassName, { [`${prefixCls}-disabled`]: prevDisabled }),
|
|
208
224
|
"style": itemStyle,
|
|
209
|
-
"aria-disabled": prevDisabled
|
|
225
|
+
"aria-disabled": prevDisabled,
|
|
226
|
+
"role": "button",
|
|
227
|
+
"aria-label": locale?.prev_page
|
|
210
228
|
}, [prev]);
|
|
211
229
|
}
|
|
212
230
|
let next = renderNext(nextPage.value);
|
|
@@ -223,13 +241,14 @@ var Pagination_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
|
|
|
223
241
|
return next;
|
|
224
242
|
})();
|
|
225
243
|
next = createVNode("li", {
|
|
226
|
-
"title": showTitle ? locale?.next_page : void 0,
|
|
227
244
|
"onClick": nextHandle,
|
|
228
245
|
"tabindex": nextTabIndex ?? void 0,
|
|
229
246
|
"onKeydown": runIfEnterNext,
|
|
230
247
|
"class": classNames(`${prefixCls}-next`, itemClassName, { [`${prefixCls}-disabled`]: nextDisabled }),
|
|
231
248
|
"style": itemStyle,
|
|
232
|
-
"aria-disabled": nextDisabled
|
|
249
|
+
"aria-disabled": nextDisabled,
|
|
250
|
+
"role": "button",
|
|
251
|
+
"aria-label": locale?.next_page
|
|
233
252
|
}, [next]);
|
|
234
253
|
}
|
|
235
254
|
const totalText = showTotal && createVNode("li", { "class": `${prefixCls}-total-text` }, [showTotal(total, [total === 0 ? 0 : (current.value - 1) * pageSize.value + 1, current.value * pageSize.value > total ? total : current.value * pageSize.value])]);
|
|
@@ -278,9 +297,10 @@ var Pagination_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
|
|
|
278
297
|
const pagerProps = {
|
|
279
298
|
rootPrefixCls: prefixCls,
|
|
280
299
|
onClick: handleChange,
|
|
281
|
-
onKeyPress:
|
|
300
|
+
onKeyPress: runIfEnterOrSpace,
|
|
282
301
|
showTitle,
|
|
283
302
|
itemRender: mergedItemRender,
|
|
303
|
+
pageLabel: locale?.page,
|
|
284
304
|
page: -1,
|
|
285
305
|
className: itemClassName,
|
|
286
306
|
style: itemStyle
|
|
@@ -288,12 +308,12 @@ var Pagination_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
|
|
|
288
308
|
const pagerList = [];
|
|
289
309
|
const pageBufferSize = showLessItems ? 1 : 2;
|
|
290
310
|
if (allPages.value <= 3 + pageBufferSize * 2) {
|
|
291
|
-
if (!allPages.value) pagerList.push(createVNode(
|
|
311
|
+
if (!allPages.value) pagerList.push(createVNode(Pager, mergeProps(pagerProps, {
|
|
292
312
|
"key": "noPager",
|
|
293
313
|
"page": 1,
|
|
294
314
|
"className": `${prefixCls}-item-disabled`
|
|
295
315
|
}), null));
|
|
296
|
-
for (let i = 1; i <= allPages.value; i += 1) pagerList.push(createVNode(
|
|
316
|
+
for (let i = 1; i <= allPages.value; i += 1) pagerList.push(createVNode(Pager, mergeProps(pagerProps, {
|
|
297
317
|
"key": i,
|
|
298
318
|
"page": i,
|
|
299
319
|
"active": current.value === i
|
|
@@ -301,51 +321,57 @@ var Pagination_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
|
|
|
301
321
|
} else {
|
|
302
322
|
const prevItemTitle = showLessItems ? locale?.prev_3 : locale?.prev_5;
|
|
303
323
|
const nextItemTitle = showLessItems ? locale?.next_3 : locale?.next_5;
|
|
304
|
-
const jumpPrevContent = mergedItemRender(jumpPrevPage.value, "jump-prev", getItemIcon(jumpPrevIcon,
|
|
305
|
-
const jumpNextContent = mergedItemRender(jumpNextPage.value, "jump-next", getItemIcon(jumpNextIcon,
|
|
324
|
+
const jumpPrevContent = mergedItemRender(jumpPrevPage.value, "jump-prev", getItemIcon(jumpPrevIcon, prevItemTitle, showTitle ? prevItemTitle : void 0));
|
|
325
|
+
const jumpNextContent = mergedItemRender(jumpNextPage.value, "jump-next", getItemIcon(jumpNextIcon, nextItemTitle, showTitle ? nextItemTitle : void 0));
|
|
306
326
|
let jumpPrev = null;
|
|
307
327
|
let jumpNext = null;
|
|
308
328
|
if (showPrevNextJumpers) {
|
|
309
329
|
jumpPrev = jumpPrevContent ? createVNode("li", {
|
|
310
|
-
"title": showTitle ? prevItemTitle : void 0,
|
|
311
330
|
"key": "prev",
|
|
312
331
|
"onClick": jumpPrevHandle,
|
|
313
332
|
"tabindex": 0,
|
|
314
333
|
"onKeydown": runIfEnterJumpPrev,
|
|
315
|
-
"class": classNames(`${prefixCls}-jump-prev`, { [`${prefixCls}-jump-prev-custom-icon`]: !!jumpPrevIcon })
|
|
334
|
+
"class": classNames(`${prefixCls}-jump-prev`, { [`${prefixCls}-jump-prev-custom-icon`]: !!jumpPrevIcon }),
|
|
335
|
+
"role": "button",
|
|
336
|
+
"aria-label": prevItemTitle
|
|
316
337
|
}, [jumpPrevContent]) : null;
|
|
317
338
|
jumpNext = jumpNextContent ? createVNode("li", {
|
|
318
|
-
"title": showTitle ? nextItemTitle : void 0,
|
|
319
339
|
"key": "next",
|
|
320
340
|
"onClick": jumpNextHandle,
|
|
321
341
|
"tabindex": 0,
|
|
322
342
|
"onKeydown": runIfEnterJumpNext,
|
|
323
|
-
"class": classNames(`${prefixCls}-jump-next`, { [`${prefixCls}-jump-next-custom-icon`]: !!jumpNextIcon })
|
|
343
|
+
"class": classNames(`${prefixCls}-jump-next`, { [`${prefixCls}-jump-next-custom-icon`]: !!jumpNextIcon }),
|
|
344
|
+
"role": "button",
|
|
345
|
+
"aria-label": nextItemTitle
|
|
324
346
|
}, [jumpNextContent]) : null;
|
|
325
347
|
}
|
|
326
348
|
let left = Math.max(1, current.value - pageBufferSize);
|
|
327
349
|
let right = Math.min(current.value + pageBufferSize, allPages.value);
|
|
328
350
|
if (current.value - 1 <= pageBufferSize) right = 1 + pageBufferSize * 2;
|
|
329
351
|
if (allPages.value - current.value <= pageBufferSize) left = allPages.value - pageBufferSize * 2;
|
|
330
|
-
|
|
352
|
+
const hasJumpPrev = !!jumpPrev && current.value - 1 >= pageBufferSize * 2 && current.value !== 3;
|
|
353
|
+
const hasJumpNext = !!jumpNext && allPages.value - current.value >= pageBufferSize * 2 && current.value !== allPages.value - 2;
|
|
354
|
+
if (!showLessItems && hasJumpPrev && right !== allPages.value) left += 1;
|
|
355
|
+
if (!showLessItems && hasJumpNext && left !== 1) right -= 1;
|
|
356
|
+
for (let i = left; i <= right; i += 1) pagerList.push(createVNode(Pager, mergeProps(pagerProps, {
|
|
331
357
|
"key": i,
|
|
332
358
|
"page": i,
|
|
333
359
|
"active": current.value === i
|
|
334
360
|
}), null));
|
|
335
|
-
if (
|
|
361
|
+
if (hasJumpPrev) {
|
|
336
362
|
if (pagerList[0]) pagerList[0] = cloneElement(pagerList[0], { className: classNames(`${prefixCls}-item-after-jump-prev`, pagerList[0].props?.className) });
|
|
337
363
|
pagerList.unshift(jumpPrev);
|
|
338
364
|
}
|
|
339
|
-
if (
|
|
365
|
+
if (hasJumpNext) {
|
|
340
366
|
const lastOne = pagerList[pagerList.length - 1];
|
|
341
367
|
if (lastOne) pagerList[pagerList.length - 1] = cloneElement(lastOne, { className: classNames(`${prefixCls}-item-before-jump-next`, lastOne.props?.className) });
|
|
342
368
|
pagerList.push(jumpNext);
|
|
343
369
|
}
|
|
344
|
-
if (left !== 1) pagerList.unshift(createVNode(
|
|
370
|
+
if (left !== 1) pagerList.unshift(createVNode(Pager, mergeProps(pagerProps, {
|
|
345
371
|
"key": 1,
|
|
346
372
|
"page": 1
|
|
347
373
|
}), null));
|
|
348
|
-
if (right !== allPages.value) pagerList.push(createVNode(
|
|
374
|
+
if (right !== allPages.value) pagerList.push(createVNode(Pager, mergeProps(pagerProps, {
|
|
349
375
|
"key": allPages.value,
|
|
350
376
|
"page": allPages.value
|
|
351
377
|
}), null));
|
|
@@ -366,7 +392,7 @@ var Pagination_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
|
|
|
366
392
|
prev,
|
|
367
393
|
simple ? simplePager : pagerList,
|
|
368
394
|
next,
|
|
369
|
-
createVNode(
|
|
395
|
+
createVNode(Options, {
|
|
370
396
|
"locale": locale,
|
|
371
397
|
"rootPrefixCls": prefixCls,
|
|
372
398
|
"disabled": disabled,
|
|
@@ -579,4 +605,5 @@ var Pagination_default = /* @__PURE__ */ defineComponent((props, { attrs }) => {
|
|
|
579
605
|
name: "VCPagination",
|
|
580
606
|
inheritAttrs: false
|
|
581
607
|
});
|
|
582
|
-
|
|
608
|
+
//#endregion
|
|
609
|
+
export { Pagination as default };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export type { PaginationData, PaginationLocale, PaginationProps } from './interface';
|
|
1
|
+
export type { PaginationData, PaginationLocale, PaginationOnChangeInfo, PaginationProps } from './interface';
|
|
2
2
|
export { default } from './Pagination';
|
package/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
export {
|
|
1
|
+
import Pagination from "./Pagination.js";
|
|
2
|
+
export { Pagination as default };
|
package/dist/interface.d.ts
CHANGED
|
@@ -45,8 +45,11 @@ export interface PaginationData {
|
|
|
45
45
|
jumpPrevIcon: VueNode;
|
|
46
46
|
jumpNextIcon: VueNode;
|
|
47
47
|
}
|
|
48
|
+
export interface PaginationOnChangeInfo {
|
|
49
|
+
recommendPage?: number;
|
|
50
|
+
}
|
|
48
51
|
export interface PaginationProps extends Partial<PaginationData> {
|
|
49
|
-
onChange?: (page: number, pageSize: number) => void;
|
|
52
|
+
onChange?: (page: number, pageSize: number, info?: PaginationOnChangeInfo) => void;
|
|
50
53
|
onShowSizeChange?: (current: number, size: number) => void;
|
|
51
54
|
itemRender?: (page: number, type: 'page' | 'prev' | 'next' | 'jump-prev' | 'jump-next', element: VueNode) => VueNode;
|
|
52
55
|
showTotal?: (total: number, range: [number, number]) => VueNode;
|
package/dist/interface.js
CHANGED
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import KeyCode from "@v-c/util/dist/KeyCode";
|
|
2
|
+
//#region src/isEnterOrSpaceKey.ts
|
|
3
|
+
function isEnterOrSpaceKey(event) {
|
|
4
|
+
return event.key === "Enter" || event.key === " " || event.key === "Spacebar" || event.charCode === KeyCode.ENTER || event.keyCode === KeyCode.ENTER;
|
|
5
|
+
}
|
|
6
|
+
//#endregion
|
|
7
|
+
export { isEnterOrSpaceKey as default };
|
package/dist/locale/am.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
//#region src/locale/am.ts
|
|
2
|
+
var locale = {
|
|
2
3
|
items_per_page: "/ ግፅ",
|
|
3
4
|
jump_to: "ሂድ ወደ",
|
|
4
5
|
jump_to_confirm: "አረጋግጥ",
|
|
@@ -11,4 +12,5 @@ var am_default = {
|
|
|
11
12
|
next_3: "ቀጣይ 3 ገፅ",
|
|
12
13
|
page_size: "የገፅ መጠን"
|
|
13
14
|
};
|
|
14
|
-
|
|
15
|
+
//#endregion
|
|
16
|
+
export { locale as default };
|
package/dist/locale/ar_EG.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
//#region src/locale/ar_EG.ts
|
|
2
|
+
var locale = {
|
|
2
3
|
items_per_page: "/ الصفحة",
|
|
3
4
|
jump_to: "الذهاب إلى",
|
|
4
5
|
jump_to_confirm: "تأكيد",
|
|
@@ -11,4 +12,5 @@ var ar_EG_default = {
|
|
|
11
12
|
next_3: "ثلاث صفحات تالية",
|
|
12
13
|
page_size: "مقاس الصفحه"
|
|
13
14
|
};
|
|
14
|
-
|
|
15
|
+
//#endregion
|
|
16
|
+
export { locale as default };
|
package/dist/locale/az_AZ.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
//#region src/locale/az_AZ.ts
|
|
2
|
+
var locale = {
|
|
2
3
|
items_per_page: "/ səhifə",
|
|
3
4
|
jump_to: "Get",
|
|
4
5
|
jump_to_confirm: "təsdiqlə",
|
|
@@ -11,4 +12,5 @@ var az_AZ_default = {
|
|
|
11
12
|
next_3: "Növbəti 3 Səhifə",
|
|
12
13
|
page_size: "Page Size"
|
|
13
14
|
};
|
|
14
|
-
|
|
15
|
+
//#endregion
|
|
16
|
+
export { locale as default };
|
package/dist/locale/bg_BG.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
//#region src/locale/bg_BG.ts
|
|
2
|
+
var locale = {
|
|
2
3
|
items_per_page: "/ страница",
|
|
3
4
|
jump_to: "Към",
|
|
4
5
|
jump_to_confirm: "потвърждавам",
|
|
@@ -11,4 +12,5 @@ var bg_BG_default = {
|
|
|
11
12
|
next_3: "Следващи 3 страници",
|
|
12
13
|
page_size: "Page Size"
|
|
13
14
|
};
|
|
14
|
-
|
|
15
|
+
//#endregion
|
|
16
|
+
export { locale as default };
|
package/dist/locale/bn_BD.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
//#region src/locale/bn_BD.ts
|
|
2
|
+
var locale = {
|
|
2
3
|
items_per_page: "/ পৃষ্ঠা",
|
|
3
4
|
jump_to: "যাও",
|
|
4
5
|
jump_to_confirm: "নিশ্চিত",
|
|
@@ -11,4 +12,5 @@ var bn_BD_default = {
|
|
|
11
12
|
next_3: "পরবর্তী ৩ পৃষ্ঠা",
|
|
12
13
|
page_size: "পাতার আকার"
|
|
13
14
|
};
|
|
14
|
-
|
|
15
|
+
//#endregion
|
|
16
|
+
export { locale as default };
|
package/dist/locale/by_BY.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
//#region src/locale/by_BY.ts
|
|
2
|
+
var locale = {
|
|
2
3
|
items_per_page: "/старонка",
|
|
3
4
|
jump_to: "Перайсці",
|
|
4
5
|
jump_to_confirm: "Пацвердзіць",
|
|
@@ -11,4 +12,5 @@ var by_BY_default = {
|
|
|
11
12
|
next_3: "Наступныя 3",
|
|
12
13
|
page_size: "памер старонкі"
|
|
13
14
|
};
|
|
14
|
-
|
|
15
|
+
//#endregion
|
|
16
|
+
export { locale as default };
|
package/dist/locale/ca_ES.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
//#region src/locale/ca_ES.ts
|
|
2
|
+
var locale = {
|
|
2
3
|
items_per_page: "/ pàgina",
|
|
3
4
|
jump_to: "Anar a",
|
|
4
5
|
jump_to_confirm: "Confirma",
|
|
@@ -11,4 +12,5 @@ var ca_ES_default = {
|
|
|
11
12
|
next_3: "3 pàgines següents",
|
|
12
13
|
page_size: "mida de la pàgina"
|
|
13
14
|
};
|
|
14
|
-
|
|
15
|
+
//#endregion
|
|
16
|
+
export { locale as default };
|
package/dist/locale/cs_CZ.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
//#region src/locale/cs_CZ.ts
|
|
2
|
+
var locale = {
|
|
2
3
|
items_per_page: "/ strana",
|
|
3
4
|
jump_to: "Přejít",
|
|
4
5
|
jump_to_confirm: "potvrdit",
|
|
@@ -11,4 +12,5 @@ var cs_CZ_default = {
|
|
|
11
12
|
next_3: "Následující 3 strany",
|
|
12
13
|
page_size: "velikost stránky"
|
|
13
14
|
};
|
|
14
|
-
|
|
15
|
+
//#endregion
|
|
16
|
+
export { locale as default };
|
package/dist/locale/da_DK.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
//#region src/locale/da_DK.ts
|
|
2
|
+
var locale = {
|
|
2
3
|
items_per_page: "/ side",
|
|
3
4
|
jump_to: "Gå til",
|
|
4
5
|
jump_to_confirm: "bekræft",
|
|
@@ -11,4 +12,5 @@ var da_DK_default = {
|
|
|
11
12
|
next_3: "Næste 3 Sider",
|
|
12
13
|
page_size: "sidestørrelse"
|
|
13
14
|
};
|
|
14
|
-
|
|
15
|
+
//#endregion
|
|
16
|
+
export { locale as default };
|
package/dist/locale/de_DE.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
//#region src/locale/de_DE.ts
|
|
2
|
+
var locale = {
|
|
2
3
|
items_per_page: "/ Seite",
|
|
3
4
|
jump_to: "Gehe zu",
|
|
4
5
|
jump_to_confirm: "bestätigen",
|
|
@@ -11,4 +12,5 @@ var de_DE_default = {
|
|
|
11
12
|
next_3: "3 Seiten vor",
|
|
12
13
|
page_size: "Page Size"
|
|
13
14
|
};
|
|
14
|
-
|
|
15
|
+
//#endregion
|
|
16
|
+
export { locale as default };
|
package/dist/locale/el_GR.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
//#region src/locale/el_GR.ts
|
|
2
|
+
var locale = {
|
|
2
3
|
items_per_page: "/ σελίδα",
|
|
3
4
|
jump_to: "Μετάβαση",
|
|
4
5
|
jump_to_confirm: "επιβεβαιώνω",
|
|
@@ -11,4 +12,5 @@ var el_GR_default = {
|
|
|
11
12
|
next_3: "Επόμενες 3 Σελίδες",
|
|
12
13
|
page_size: "Μέγεθος σελίδας"
|
|
13
14
|
};
|
|
14
|
-
|
|
15
|
+
//#endregion
|
|
16
|
+
export { locale as default };
|
package/dist/locale/en_GB.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
//#region src/locale/en_GB.ts
|
|
2
|
+
var locale = {
|
|
2
3
|
items_per_page: "/ page",
|
|
3
4
|
jump_to: "Go to",
|
|
4
5
|
jump_to_confirm: "confirm",
|
|
@@ -11,4 +12,5 @@ var en_GB_default = {
|
|
|
11
12
|
next_3: "Next 3 Pages",
|
|
12
13
|
page_size: "Page Size"
|
|
13
14
|
};
|
|
14
|
-
|
|
15
|
+
//#endregion
|
|
16
|
+
export { locale as default };
|
package/dist/locale/en_US.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
//#region src/locale/en_US.ts
|
|
2
|
+
var locale = {
|
|
2
3
|
items_per_page: "/ page",
|
|
3
4
|
jump_to: "Go to",
|
|
4
5
|
jump_to_confirm: "confirm",
|
|
@@ -11,4 +12,5 @@ var en_US_default = {
|
|
|
11
12
|
next_3: "Next 3 Pages",
|
|
12
13
|
page_size: "Page Size"
|
|
13
14
|
};
|
|
14
|
-
|
|
15
|
+
//#endregion
|
|
16
|
+
export { locale as default };
|