import { defineComponent, getCurrentInstance, computed, ref, watch, provide, h } from 'vue'; import '../../../hooks/index.mjs'; import { debugWarn } from '../../../utils/error.mjs'; import { buildProps, definePropType, mutable } from '../../../utils/props.mjs'; import '../../../tokens/index.mjs'; import './components/prev.mjs'; import './components/next.mjs'; import './components/sizes.mjs'; import './components/jumper.mjs'; import './components/total.mjs'; import './components/pager.mjs'; import { useLocale } from '../../../hooks/use-locale/index.mjs'; import { elPaginationKey } from '../../../tokens/pagination.mjs'; import script from './components/prev.vue_vue_type_script_lang.mjs'; import script$1 from './components/jumper.vue_vue_type_script_lang.mjs'; import script$2 from './components/pager.vue_vue_type_script_lang.mjs'; import script$3 from './components/next.vue_vue_type_script_lang.mjs'; import script$4 from './components/sizes.vue_vue_type_script_lang.mjs'; import script$5 from './components/total.vue_vue_type_script_lang.mjs'; const isAbsent = (v) => typeof v !== "number"; const paginationProps = buildProps({ total: Number, pageSize: Number, defaultPageSize: Number, currentPage: Number, defaultCurrentPage: Number, pageCount: Number, pagerCount: { type: Number, validator: (value) => { return typeof value === "number" && (value | 0) === value && value > 4 && value < 22 && value % 2 === 1; }, default: 7 }, layout: { type: String, default: ["prev", "pager", "next", "jumper", "->", "total"].join(", ") }, pageSizes: { type: definePropType(Array), default: () => mutable([10, 20, 30, 40, 50, 100]) }, popperClass: { type: String, default: "" }, prevText: { type: String, default: "" }, nextText: { type: String, default: "" }, small: Boolean, background: Boolean, disabled: Boolean, hideOnSinglePage: Boolean }); const paginationEmits = { "update:current-page": (val) => typeof val === "number", "update:page-size": (val) => typeof val === "number", "size-change": (val) => typeof val === "number", "current-change": (val) => typeof val === "number", "prev-click": (val) => typeof val === "number", "next-click": (val) => typeof val === "number" }; const componentName = "ElPagination"; var Pagination = defineComponent({ name: componentName, props: paginationProps, emits: paginationEmits, setup(props, { emit, slots }) { const { t } = useLocale(); const vnodeProps = getCurrentInstance().vnode.props || {}; 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 = 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; } } else { } } } return true; }); const innerPageSize = ref(isAbsent(props.defaultPageSize) ? 10 : props.defaultPageSize); const innerCurrentPage = ref(isAbsent(props.defaultCurrentPage) ? 1 : props.defaultCurrentPage); const pageSizeBridge = 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 = 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 = 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); } } }); watch(pageCountBridge, (val) => { if (currentPageBridge.value > val) currentPageBridge.value = val; }); 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); } provide(elPaginationKey, { pageCount: pageCountBridge, disabled: computed(() => props.disabled), currentPage: currentPageBridge, changeEvent: handleCurrentChange, handleSizeChange }); return () => { var _a, _b; if (!assertValidUsage.value) { 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 = h("div", { class: "el-pagination__rightwrapper" }, rightWrapperChildren); const TEMPLATE_MAP = { prev: h(script, { disabled: props.disabled, currentPage: currentPageBridge.value, prevText: props.prevText, onClick: prev }), jumper: h(script$1), pager: h(script$2, { currentPage: currentPageBridge.value, pageCount: pageCountBridge.value, pagerCount: props.pagerCount, onChange: handleCurrentChange, disabled: props.disabled }), next: h(script$3, { disabled: props.disabled, currentPage: currentPageBridge.value, pageCount: pageCountBridge.value, nextText: props.nextText, onClick: next }), sizes: h(script$4, { pageSize: pageSizeBridge.value, pageSizes: props.pageSizes, popperClass: props.popperClass, disabled: props.disabled }), slot: (_b = (_a = slots == null ? void 0 : slots.default) == null ? void 0 : _a.call(slots)) != null ? _b : null, total: h(script$5, { 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]); } }); if (haveRightWrapper && rightWrapperChildren.length > 0) { rootChildren.unshift(rightWrapperRoot); } return h("div", { role: "pagination", "aria-label": "pagination", class: [ "el-pagination", { "is-background": props.background, "el-pagination--small": props.small } ] }, rootChildren); }; } }); export { Pagination as default, paginationEmits, paginationProps }; //# sourceMappingURL=pagination.mjs.map