maz-ui
Version:
A standalone components library for Vue.Js 3 & Nuxt.Js 3
1 lines • 6.88 kB
JavaScript
import{t as _plugin_vue_export_helper_default}from"./_plugin-vue_export-helper.ChmETRGw.js";import{t as MazBtn_default}from"./MazBtn.DJj8H23m.js";import{Fragment,computed,createBlock,createCommentVNode,createElementBlock,createElementVNode,createTextVNode,createVNode,defineComponent,mergeProps,openBlock,renderList,renderSlot,toDisplayString,unref,withCtx}from"vue";import{useTranslations}from"@maz-ui/translations/composables/useTranslations";import{MazEllipsisHorizontal}from"@maz-ui/icons/lazy/MazEllipsisHorizontal";import{MazChevronDoubleLeft}from"@maz-ui/icons/static/MazChevronDoubleLeft";import{MazChevronLeft}from"@maz-ui/icons/static/MazChevronLeft";import '../assets/MazPagination.C3Dkf1HA.css';var _hoisted_1=[`aria-label`];var _hoisted_2={class:`maz-sr-only`};var _hoisted_3={class:`maz-sr-only`};var _hoisted_4=[`id`];var _hoisted_5={class:`maz-sr-only`};var _hoisted_6={class:`maz-sr-only`};var _hoisted_7={class:`maz-sr-only`};var MazPagination_default=_plugin_vue_export_helper_default(defineComponent({__name:`MazPagination`,props:{modelValue:{default:1},buttonProps:{},activeColor:{default:`background`},size:{default:`md`},totalPages:{},pageRange:{default:1},loading:{type:Boolean}},emits:[`update:model-value`],setup(__props,{emit:__emit}){let emits=__emit;let DEFAULT_BUTTONS_PROPS={size:`md`,color:`background`,outlined:!0,fab:!0};let{t}=useTranslations();let buttonsPropsMerged=computed(()=>({...DEFAULT_BUTTONS_PROPS,...__props.buttonProps}));let previousPage=computed(()=>__props.modelValue>1?__props.modelValue-1:1);let nextPage=computed(()=>__props.modelValue<__props.totalPages?__props.modelValue+1:__props.totalPages);let allPages=computed(()=>Array.from({length:__props.totalPages},(_,index)=>{let itemNumber=index+1;return{number:itemNumber,isActive:itemNumber===__props.modelValue,loading:itemNumber===__props.modelValue&&__props.loading}}));let firstOne=computed(()=>__props.modelValue-__props.pageRange>1?allPages.value.slice(0,1):[]);let lastOne=computed(()=>__props.modelValue<__props.totalPages-__props.pageRange?allPages.value.slice(-1):[]);let rangeStartAt=computed(()=>{let baseStart=__props.modelValue-__props.pageRange-1;return baseStart<0?0:baseStart>__props.totalPages-__props.pageRange?__props.totalPages-__props.pageRange:baseStart});let rangeEndAt=computed(()=>{let baseEnd=__props.modelValue+__props.pageRange;return baseEnd>__props.totalPages?__props.totalPages:baseEnd<__props.pageRange?__props.pageRange:baseEnd});let range=computed(()=>allPages.value.slice(rangeStartAt.value,rangeEndAt.value));let firstDivider=computed(()=>__props.modelValue-__props.pageRange>2?[{divider:!0}]:[]);let lastDivider=computed(()=>__props.modelValue<__props.totalPages-__props.pageRange-1?[{divider:!0}]:[]);let pages=computed(()=>[...firstOne.value,...firstDivider.value,...range.value,...lastDivider.value,...lastOne.value]);function setPageNumber(page){page!==__props.modelValue&&emits(`update:model-value`,page)}return(_ctx,_cache)=>(openBlock(),createElementBlock(`nav`,{class:`m-pagination m-reset-css`,role:`navigation`,"aria-label":unref(t)(`pagination.navAriaLabel`)},[createElementVNode(`ul`,null,[createElementVNode(`li`,null,[createVNode(MazBtn_default,mergeProps(buttonsPropsMerged.value,{disabled:__props.modelValue===1,"aria-label":`First Page, Page 1`,size:__props.size,onClick:_cache[0]||=$event=>setPageNumber(1)}),{default:withCtx(()=>[createElementVNode(`span`,_hoisted_2,[renderSlot(_ctx.$slots,`first-page-sr`,{page:1},()=>[createTextVNode(toDisplayString(unref(t)(`pagination.screenReader.firstPage`,{page:1})),1)],!0)]),createVNode(unref(MazChevronDoubleLeft))]),_:3},16,[`disabled`,`size`])]),createElementVNode(`li`,null,[createVNode(MazBtn_default,mergeProps(buttonsPropsMerged.value,{disabled:__props.modelValue===1,"aria-label":`Previous Page, Page ${previousPage.value}`,size:__props.size,onClick:_cache[1]||=$event=>setPageNumber(previousPage.value)}),{default:withCtx(()=>[createElementVNode(`span`,_hoisted_3,[renderSlot(_ctx.$slots,`previous-page-sr`,{page:previousPage.value},()=>[createTextVNode(toDisplayString(unref(t)(`pagination.screenReader.previousPage`,{page:previousPage.value})),1)],!0)]),createVNode(unref(MazChevronLeft))]),_:3},16,[`disabled`,`aria-label`,`size`])]),(openBlock(!0),createElementBlock(Fragment,null,renderList(pages.value,(page,i)=>(openBlock(),createElementBlock(`li`,{id:`number`in page?`button-${i}-${page.number}`:`ellipsis-${i}`,key:`number`in page?`button-${i}-${page.number}`:`ellipsis-${i}`},[`number`in page?(openBlock(),createBlock(MazBtn_default,mergeProps({key:0,ref_for:!0},{...buttonsPropsMerged.value,color:page.isActive?__props.activeColor:buttonsPropsMerged.value.color,outlined:page.isActive?!1:buttonsPropsMerged.value.outlined},{size:__props.size,"aria-label":`Page ${page.number}`,"aria-current":page.isActive?`page`:void 0,loading:page.loading,class:{active:page.isActive},onClick:$event=>page.isActive?void 0:setPageNumber(page.number)}),{default:withCtx(()=>[createElementVNode(`span`,_hoisted_5,[renderSlot(_ctx.$slots,`page-sr`,{page:page.number},()=>[createTextVNode(toDisplayString(unref(t)(`pagination.screenReader.page`,{page:page.number})),1)],!0)]),createTextVNode(` `+toDisplayString(page.number),1)]),_:2},1040,[`size`,`aria-label`,`aria-current`,`loading`,`class`,`onClick`])):page.divider?(openBlock(),createElementBlock(`div`,mergeProps({key:1,ref_for:!0},buttonsPropsMerged.value,{class:`flex-center flex p-2`}),[createVNode(unref(MazEllipsisHorizontal))],16)):createCommentVNode(``,!0)],8,_hoisted_4))),128)),createElementVNode(`li`,null,[createVNode(MazBtn_default,mergeProps(buttonsPropsMerged.value,{disabled:__props.modelValue===__props.totalPages,"aria-label":`Next Page, Page ${nextPage.value}`,size:__props.size,onClick:_cache[2]||=$event=>setPageNumber(nextPage.value)}),{default:withCtx(()=>[createElementVNode(`span`,_hoisted_6,[renderSlot(_ctx.$slots,`next-page-sr`,{page:nextPage.value},()=>[createTextVNode(toDisplayString(unref(t)(`pagination.screenReader.nextPage`,{page:nextPage.value})),1)],!0)]),createVNode(unref(MazChevronLeft),{class:`-maz-rotate-180`})]),_:3},16,[`disabled`,`aria-label`,`size`])]),createElementVNode(`li`,null,[createVNode(MazBtn_default,mergeProps(buttonsPropsMerged.value,{disabled:__props.modelValue===__props.totalPages,"aria-label":`Next Page, Page ${__props.totalPages}`,size:__props.size,onClick:_cache[3]||=$event=>setPageNumber(__props.totalPages)}),{default:withCtx(()=>[createElementVNode(`span`,_hoisted_7,[renderSlot(_ctx.$slots,`last-page-sr`,{page:__props.totalPages},()=>[createTextVNode(toDisplayString(unref(t)(`pagination.screenReader.lastPage`,{page:__props.totalPages})),1)],!0)]),createVNode(unref(MazChevronDoubleLeft),{class:`-maz-rotate-180`})]),_:3},16,[`disabled`,`aria-label`,`size`])])])],8,_hoisted_1))}}),[[`__scopeId`,`data-v-38d8a2f9`]]);export{MazPagination_default as t};