Pagination.js 1.6 KB

1
  1. import React from'react';import Module from'../Module';import Link from'./Link.js';class Pagination extends Module{constructor(a){super(a),this.selected.onUpdate(()=>this.forceUpdate()),this.page.set(this.selected.value)}go(a){this.page.set(a),this.props.onPage&&this.props.onPage(a)}render(){let a=this.selected.value||1,b=[-2,-1,0,1,2].map(b=>b+a);return React.createElement('div',{className:this.props.className+' Pagination '},React.createElement('nav',{"aria-label":'Page navigation example'},React.createElement('ul',{className:'pagination justify-content-end'},React.createElement('li',{className:'page-item '+(1<a?'':'disabled')},React.createElement('a',{className:'page-link',href:'#',"aria-label":'Previous',onClick:()=>this.go(a-1)},React.createElement('span',{"aria-hidden":'true'},'\xAB'),React.createElement('span',{className:'sr-only'},'Previous'))),b.map(b=>0<b&&b<=this.lastPage.value?React.createElement('li',{key:b,onClick:()=>this.go(b),className:'page-item '+(a===b?'active':'')},React.createElement('a',{className:'page-link',href:'#'},b)):''),React.createElement('li',{className:'page-item '+(a<this.lastPage.value?'':'disabled')},React.createElement('a',{className:'page-link',href:'#',"aria-label":'Next',onClick:()=>this.go(a+1)},React.createElement('span',{"aria-hidden":'true'},'\xBB'),React.createElement('span',{className:'sr-only'},'Next'))))),super.render())}}Pagination.EditPosition='top-right',Pagination.Category='Layout',Pagination.Inputs={selected:{type:Module.Types.Number,defaultValue:1},lastPage:{type:Module.Types.Number,defaultValue:2}},Pagination.Outputs={page:{}};export default Pagination;