vue-sliding-pagination
Version:
Sliding pagination component
1 lines • 6.54 kB
JavaScript
!function(e,i){"object"==typeof exports&&"object"==typeof module?module.exports=i(require("vue")):"function"==typeof define&&define.amd?define("vue-sliding-pagination",["vue"],i):"object"==typeof exports?exports["vue-sliding-pagination"]=i(require("vue")):e["vue-sliding-pagination"]=i(e.vue)}(self,(function(e){return function(){"use strict";var i={380:function(i){i.exports=e}},t={};function n(e){var a=t[e];if(void 0!==a)return a.exports;var s=t[e]={exports:{}};return i[e](s,s.exports,n),s.exports}n.d=function(e,i){for(var t in i)n.o(i,t)&&!n.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:i[t]})},n.o=function(e,i){return Object.prototype.hasOwnProperty.call(e,i)},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var a={};n.r(a),n.d(a,{default:function(){return l},range:function(){return o}});var s=JSON.parse('{"componentClass":"c-sliding-pagination","list":"c-sliding-pagination__list","element":"c-sliding-pagination__list-element","elementDisabled":"c-sliding-pagination__list-element--disabled","elementActive":"c-sliding-pagination__list-element--active","page":"c-sliding-pagination__page"}'),r=n(380),g={name:"SlidingPaginationDefaultPage",props:{ariaPageLabel:{type:String,required:!0},isCurrent:{type:Boolean,required:!0},page:{type:Number,required:!0},pageClass:{type:String,required:!0}},computed:{pageClasses:function(){var e=this.pageClass;return this.isCurrent&&(e+=" c-sliding-pagination__page--current"),e}},methods:{goToPage:function(e){e.preventDefault(),e.stopPropagation(),this.$emit("page-click",this.page)}},render:function(){return(0,r.h)("a",{class:this.pageClasses,href:"#","aria-label":this.ariaPageLabel,onClick:this.goToPage},this.page)}};function o(e,i){var t=[];if("number"!=typeof e||"number"!=typeof i)return t;if(e>i){var n=e;e=i,i=n}for(var a=e;a<=i;a++)t.push(a);return t}var l={name:"SlidingPagination",props:{ariaPaginationLabel:{type:String,required:!1,default:"Pagination Navigation"},ariaGotoPageLabel:{type:String,required:!1,default:"Go to page %page% of %total%"},ariaPreviousPageLabel:{type:String,required:!1,default:"Go to previous page"},ariaNextPageLabel:{type:String,required:!1,default:"Go to next page"},ariaCurrentPageLabel:{type:String,required:!1,default:"Page %page% of %total%, current page"},classMap:{type:Object,required:!1,default:function(){return s}},current:{required:!0,type:Number},total:{required:!0,type:Number},slidingEndingSize:{required:!1,type:Number,default:2},slidingWindowSize:{required:!1,type:Number,default:3},nonSlidingSize:{required:!1,type:Number,default:9},pageComponent:{required:!1,type:Object,default:function(){return g}}},components:{SlidingPaginationDefaultPage:g},computed:{isSliding:function(){return this.total>this.nonSlidingSize},hasBeginningGap:function(){return!!this.isSliding&&this.lastBeginningPage+1!==this.firstWindowPage},hasEndingGap:function(){return!!this.isSliding&&this.lastWindowPage+1!==this.firstEndingPage},beginningPages:function(){return o(1,this.isSliding?this.slidingEndingSize:this.total)},lastBeginningPage:function(){return this.beginningPages[this.beginningPages.length-1]},endingPages:function(){return this.isSliding?o(this.total-this.slidingEndingSize+1,this.total):[]},firstEndingPage:function(){return this.endingPages[0]},slidingWindowHalf:function(){var e=this.slidingWindowSize/2;return this.slidingWindowSize%2==1&&(e-=.5),e},slidingWindowPages:function(){if(!this.isSliding)return[];var e=this.lastBeginningPage+this.slidingWindowHalf,i=this.firstEndingPage-this.slidingWindowHalf;if(this.current<=e)return o(this.lastBeginningPage+1,this.lastBeginningPage+this.slidingWindowSize);if(this.current>e&&this.current<i){var t=this.slidingWindowHalf;return this.slidingWindowSize%2==0&&(t/=2),o(-this.slidingWindowHalf+this.current,t+this.current)}return o(this.firstEndingPage-this.slidingWindowSize,this.firstEndingPage-1)},firstWindowPage:function(){return this.slidingWindowPages[0]},lastWindowPage:function(){return this.slidingWindowPages[this.slidingWindowPages.length-1]},showPreviousPageAction:function(){return this.total>this.nonSlidingSize},showNextPageAction:function(){return this.total>this.nonSlidingSize}},methods:{replaceLabelVars:function(e,i){return e.replace("%total%",this.total).replace("%page%",i)},isCurrentPage:function(e){return this.current===e},currentPageLabel:function(e){return this.replaceLabelVars(this.ariaCurrentPageLabel,e)},goToPage:function(e){this.$emit("page-change",e)},goToNextPage:function(){this.goToPage(this.current+1)},goToPreviousPage:function(){this.goToPage(this.current-1)},goToPageLabel:function(e){return this.replaceLabelVars(this.ariaGotoPageLabel,e)},pageLabel:function(e){return this.isCurrentPage(e)?this.currentPageLabel(e):this.goToPageLabel(e)},slotOrDefault:function(e,i){return this.$slots[e]?this.$slots[e]():i},navigationElement:function(e,i,t,n){return(0,r.h)("li",{class:[this.classMap.element,this.current===e?this.classMap.elementDisabled:""],key:e},[(0,r.h)("a",{class:this.classMap.page,href:"#",ariaLabel:t,disabled:1===this.current,onClick:e===this.total?this.goToNextPage:this.goToPreviousPage},n)])},pageListPage:function(e){return(0,r.h)("li",{class:[this.classMap.element,this.isCurrentPage(e)?this.classMap.elementActive:""]},[(0,r.h)(this.pageComponent,{isCurrent:this.isCurrentPage(e),ariaPageLabel:this.pageLabel(e),page:e,pageClass:this.classMap.page,onPageClick:this.goToPage})])},gap:function(e){return(0,r.h)("li",{ariaHidden:!0,class:[this.classMap.element,this.classMap.elementDisabled]},[(0,r.h)("a",{class:this.classMap.page,href:"#",disabled:!0},e)])}},render:function(){var e=this,i=[];return this.showPreviousPageAction&&i.push(this.navigationElement(1,-1,this.ariaPreviousPageLabel,this.slotOrDefault("previousPage","«"))),i=i.concat(this.beginningPages.map((function(i){return e.pageListPage(i)}))),this.hasBeginningGap&&i.push(this.gap(this.slotOrDefault("gapLeft","…"))),i=i.concat(this.slidingWindowPages.map((function(i){return e.pageListPage(i)}))),this.hasEndingGap&&i.push(this.gap(this.slotOrDefault("gapRight","…"))),i=i.concat(this.endingPages.map((function(i){return e.pageListPage(i)}))),this.showNextPageAction&&i.push(this.navigationElement(this.total,1,this.ariaNextPageLabel,this.slotOrDefault("nextPage","»"))),(0,r.h)("nav",{ariaLabel:this.ariaPaginationLabel,class:this.classMap.component},[(0,r.h)("ul",{class:this.classMap.list},i)])}};return a}()}));