3d/node_modules/element-plus/lib/components/pagination/src/pagination.js

Object.defineProperties(exports, {
	__esModule: { value: true },
	[Symbol.toStringTag]: { value: "Module" }
});
require("../../../_virtual/_rolldown/runtime.js");
const require_event = require("../../../constants/event.js");
const require_types = require("../../../utils/types.js");
const require_error = require("../../../utils/error.js");
const require_runtime$1 = require("../../../utils/vue/props/runtime.js");
const require_icon = require("../../../utils/vue/icon.js");
const require_typescript = require("../../../utils/typescript.js");
const require_index = require("../../../hooks/use-deprecated/index.js");
const require_index$1 = require("../../../hooks/use-locale/index.js");
const require_index$2 = require("../../../hooks/use-namespace/index.js");
const require_index$3 = require("../../../hooks/use-size/index.js");
const require_constants = require("./constants.js");
const require_prev = require("./components/prev2.js");
const require_next = require("./components/next2.js");
const require_sizes = require("./components/sizes2.js");
const require_jumper = require("./components/jumper2.js");
const require_total = require("./components/total2.js");
const require_pager = require("./components/pager2.js");
let _element_plus_icons_vue = require("@element-plus/icons-vue");
let vue = require("vue");
//#region ../../packages/components/pagination/src/pagination.ts
/**
* It it user's responsibility to guarantee that the value of props.total... is number
* (same as pageSize, defaultPageSize, currentPage, defaultCurrentPage, pageCount)
* Otherwise we can reasonable infer that the corresponding field is absent
*/
const isAbsent = (v) => typeof v !== "number";
const paginationProps = require_runtime$1.buildProps({
	/**
	* @description options of item count per page
	*/
	pageSize: Number,
	/**
	* @description default initial value of page size, not setting is the same as setting 10
	*/
	defaultPageSize: Number,
	/**
	* @description total item count
	*/
	total: Number,
	/**
	* @description total page count. Set either `total` or `page-count` and pages will be displayed; if you need `page-sizes`, `total` is required
	*/
	pageCount: Number,
	/**
	* @description number of pagers. Pagination collapses when the total page count exceeds this value
	*/
	pagerCount: {
		type: Number,
		validator: (value) => {
			return require_types.isNumber(value) && Math.trunc(value) === value && value > 4 && value < 22 && value % 2 === 1;
		},
		default: 7
	},
	/**
	* @description current page number
	*/
	currentPage: Number,
	/**
	* @description default initial value of current-page, not setting is the same as setting 1
	*/
	defaultCurrentPage: Number,
	/**
	* @description layout of Pagination, elements separated with a comma
	*/
	layout: {
		type: String,
		default: [
			"prev",
			"pager",
			"next",
			"jumper",
			"->",
			"total"
		].join(", ")
	},
	/**
	* @description item count of each page
	*/
	pageSizes: {
		type: require_runtime$1.definePropType(Array),
		default: () => require_typescript.mutable([
			10,
			20,
			30,
			40,
			50,
			100
		])
	},
	/**
	* @description custom class name for the page size Select's dropdown
	*/
	popperClass: {
		type: String,
		default: ""
	},
	/**
	* @description custom style for the page size Select's dropdown
	*/
	popperStyle: { type: require_runtime$1.definePropType([String, Object]) },
	/**
	* @description text for the prev button
	*/
	prevText: {
		type: String,
		default: ""
	},
	/**
	* @description icon for the prev button, higher priority of `prev-text`
	*/
	prevIcon: {
		type: require_icon.iconPropType,
		default: () => _element_plus_icons_vue.ArrowLeft
	},
	/**
	* @description text for the next button
	*/
	nextText: {
		type: String,
		default: ""
	},
	/**
	* @description icon for the next button, higher priority of `next-text`
	*/
	nextIcon: {
		type: require_icon.iconPropType,
		default: () => _element_plus_icons_vue.ArrowRight
	},
	/**
	* @description whether Pagination size is teleported to body
	*/
	teleported: {
		type: Boolean,
		default: true
	},
	/**
	* @description whether to use small pagination
	*/
	small: Boolean,
	/**
	* @description set page size
	*/
	size: require_index$3.useSizeProp,
	/**
	* @description whether the buttons have a background color
	*/
	background: Boolean,
	/**
	* @description whether Pagination is disabled
	*/
	disabled: Boolean,
	/**
	* @description whether to hide when there's only one page
	*/
	hideOnSinglePage: Boolean,
	/**
	* @description which element the size dropdown appends to.
	*/
	appendSizeTo: String
});
const paginationEmits = {
	"update:current-page": (val) => require_types.isNumber(val),
	"update:page-size": (val) => require_types.isNumber(val),
	"size-change": (val) => require_types.isNumber(val),
	change: (currentPage, pageSize) => require_types.isNumber(currentPage) && require_types.isNumber(pageSize),
	"current-change": (val) => require_types.isNumber(val),
	"prev-click": (val) => require_types.isNumber(val),
	"next-click": (val) => require_types.isNumber(val)
};
const componentName = "ElPagination";
var pagination_default = (0, vue.defineComponent)({
	name: componentName,
	props: paginationProps,
	emits: paginationEmits,
	setup(props, { emit, slots }) {
		const { t } = require_index$1.useLocale();
		const ns = require_index$2.useNamespace("pagination");
		const vnodeProps = (0, vue.getCurrentInstance)().vnode.props || {};
		const _globalSize = require_index$3.useGlobalSize();
		const _size = (0, vue.computed)(() => props.small ? "small" : props.size ?? _globalSize.value);
		require_index.useDeprecated({
			from: "small",
			replacement: "size",
			version: "3.0.0",
			scope: "el-pagination",
			ref: "https://element-plus.org/zh-CN/component/pagination.html"
		}, (0, vue.computed)(() => !!props.small));
		const hasCurrentPageListener = "onUpdate:currentPage" in vnodeProps || "onUpdate:current-page" in vnodeProps || "onCurrentChange" in vnodeProps;
		const hasPageSizeListener = "onUpdate:pageSize" in vnodeProps || "onUpdate:page-size" in vnodeProps || "onSizeChange" in vnodeProps;
		const assertValidUsage = (0, vue.computed)(() => {
			if (isAbsent(props.total) && isAbsent(props.pageCount)) return false;
			if (!isAbsent(props.currentPage) && !hasCurrentPageListener) return false;
			if (props.layout.includes("sizes")) {
				if (!isAbsent(props.pageCount)) {
					if (!hasPageSizeListener) return false;
				} else if (!isAbsent(props.total)) {
					if (!isAbsent(props.pageSize)) {
						if (!hasPageSizeListener) return false;
					}
				}
			}
			return true;
		});
		const innerPageSize = (0, vue.ref)(isAbsent(props.defaultPageSize) ? 10 : props.defaultPageSize);
		const innerCurrentPage = (0, vue.ref)(isAbsent(props.defaultCurrentPage) ? 1 : props.defaultCurrentPage);
		const pageSizeBridge = (0, vue.computed)({
			get() {
				return isAbsent(props.pageSize) ? innerPageSize.value : props.pageSize;
			},
			set(v) {
				if (isAbsent(props.pageSize)) innerPageSize.value = v;
				if (hasPageSizeListener) {
					emit("update:page-size", v);
					emit("size-change", v);
				}
			}
		});
		const pageCountBridge = (0, vue.computed)(() => {
			let pageCount = 0;
			if (!isAbsent(props.pageCount)) pageCount = props.pageCount;
			else if (!isAbsent(props.total)) pageCount = Math.max(1, Math.ceil(props.total / pageSizeBridge.value));
			return pageCount;
		});
		const currentPageBridge = (0, vue.computed)({
			get() {
				return isAbsent(props.currentPage) ? innerCurrentPage.value : props.currentPage;
			},
			set(v) {
				let newCurrentPage = v;
				if (v < 1) newCurrentPage = 1;
				else if (v > pageCountBridge.value) newCurrentPage = pageCountBridge.value;
				if (isAbsent(props.currentPage)) innerCurrentPage.value = newCurrentPage;
				if (hasCurrentPageListener) {
					emit("update:current-page", newCurrentPage);
					emit("current-change", newCurrentPage);
				}
			}
		});
		(0, vue.watch)(pageCountBridge, (val) => {
			if (currentPageBridge.value > val) currentPageBridge.value = val;
		});
		(0, vue.watch)([currentPageBridge, pageSizeBridge], (value) => {
			emit(require_event.CHANGE_EVENT, ...value);
		}, { flush: "post" });
		function handleCurrentChange(val) {
			currentPageBridge.value = val;
		}
		function handleSizeChange(val) {
			pageSizeBridge.value = val;
			const newPageCount = pageCountBridge.value;
			if (currentPageBridge.value > newPageCount) currentPageBridge.value = newPageCount;
		}
		function prev() {
			if (props.disabled) return;
			currentPageBridge.value -= 1;
			emit("prev-click", currentPageBridge.value);
		}
		function next() {
			if (props.disabled) return;
			currentPageBridge.value += 1;
			emit("next-click", currentPageBridge.value);
		}
		function addClass(element, cls) {
			if (element) {
				if (!element.props) element.props = {};
				element.props.class = [element.props.class, cls].join(" ");
			}
		}
		(0, vue.provide)(require_constants.elPaginationKey, {
			pageCount: pageCountBridge,
			disabled: (0, vue.computed)(() => props.disabled),
			currentPage: currentPageBridge,
			changeEvent: handleCurrentChange,
			handleSizeChange
		});
		return () => {
			if (!assertValidUsage.value) {
				require_error.debugWarn(componentName, t("el.pagination.deprecationWarning"));
				return null;
			}
			if (!props.layout) return null;
			if (props.hideOnSinglePage && pageCountBridge.value <= 1) return null;
			const rootChildren = [];
			const rightWrapperChildren = [];
			const rightWrapperRoot = (0, vue.h)("div", { class: ns.e("rightwrapper") }, rightWrapperChildren);
			const TEMPLATE_MAP = {
				prev: (0, vue.h)(require_prev.default, {
					disabled: props.disabled,
					currentPage: currentPageBridge.value,
					prevText: props.prevText,
					prevIcon: props.prevIcon,
					onClick: prev
				}),
				jumper: (0, vue.h)(require_jumper.default, { size: _size.value }),
				pager: (0, vue.h)(require_pager.default, {
					currentPage: currentPageBridge.value,
					pageCount: pageCountBridge.value,
					pagerCount: props.pagerCount,
					onChange: handleCurrentChange,
					disabled: props.disabled
				}),
				next: (0, vue.h)(require_next.default, {
					disabled: props.disabled,
					currentPage: currentPageBridge.value,
					pageCount: pageCountBridge.value,
					nextText: props.nextText,
					nextIcon: props.nextIcon,
					onClick: next
				}),
				sizes: (0, vue.h)(require_sizes.default, {
					pageSize: pageSizeBridge.value,
					pageSizes: props.pageSizes,
					popperClass: props.popperClass,
					popperStyle: props.popperStyle,
					disabled: props.disabled,
					teleported: props.teleported,
					size: _size.value,
					appendSizeTo: props.appendSizeTo
				}),
				slot: slots?.default?.() ?? null,
				total: (0, vue.h)(require_total.default, { total: isAbsent(props.total) ? 0 : props.total })
			};
			const components = props.layout.split(",").map((item) => item.trim());
			let haveRightWrapper = false;
			components.forEach((c) => {
				if (c === "->") {
					haveRightWrapper = true;
					return;
				}
				if (!haveRightWrapper) rootChildren.push(TEMPLATE_MAP[c]);
				else rightWrapperChildren.push(TEMPLATE_MAP[c]);
			});
			addClass(rootChildren[0], ns.is("first"));
			addClass(rootChildren[rootChildren.length - 1], ns.is("last"));
			if (haveRightWrapper && rightWrapperChildren.length > 0) {
				addClass(rightWrapperChildren[0], ns.is("first"));
				addClass(rightWrapperChildren[rightWrapperChildren.length - 1], ns.is("last"));
				rootChildren.push(rightWrapperRoot);
			}
			return (0, vue.h)("div", { class: [
				ns.b(),
				ns.is("background", props.background),
				ns.m(_size.value)
			] }, rootChildren);
		};
	}
});
//#endregion
exports.default = pagination_default;
exports.paginationEmits = paginationEmits;
exports.paginationProps = paginationProps;

//# sourceMappingURL=pagination.js.map