├── pagix.png ├── pagination.png ├── .github └── FUNDING.yml ├── .prettierrc ├── .editorconfig ├── .releaserc.json ├── .gitignore ├── src └── index.js ├── CHANGELOG.md ├── index.d.ts ├── package.json └── README.md /pagix.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/brunobertolini/pagix/HEAD/pagix.png -------------------------------------------------------------------------------- /pagination.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/brunobertolini/pagix/HEAD/pagination.png -------------------------------------------------------------------------------- /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | # These are supported funding model platforms 2 | 3 | github: brunobertolini 4 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "requirePragma": false, 3 | "printWidth": 80, 4 | "tabWidth": 2, 5 | "useTabs": true, 6 | "semi": false, 7 | "singleQuote": true, 8 | "trailingComma": "es5", 9 | "bracketSpacing": true 10 | } 11 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | # http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | indent_size = 2 6 | indent_style = tab 7 | charset = utf-8 8 | end_of_line = lf 9 | insert_final_newline = true 10 | trim_trailing_whitespace = true 11 | 12 | [*.md] 13 | trim_trailing_whitespace = false 14 | 15 | [Makefile] 16 | indent_style = tab 17 | 18 | [*.yml] 19 | indent_style = space 20 | -------------------------------------------------------------------------------- /.releaserc.json: -------------------------------------------------------------------------------- 1 | { 2 | "plugins": [ 3 | "@semantic-release/commit-analyzer", 4 | "@semantic-release/release-notes-generator", 5 | "@semantic-release/github", 6 | "@semantic-release/changelog", 7 | "@semantic-release/npm", 8 | { 9 | "path": "@semantic-release/git", 10 | "assets": ["package.json", "package-lock.json", "CHANGELOG.md"], 11 | "message": "chore(release): ${nextRelease.version} [skip ci]\n\n${nextRelease.notes}" 12 | } 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # OS Specific 2 | .DS_Store 3 | .DS_Store? 4 | ._* 5 | .Spotlight-V100 6 | .Trashes 7 | ehthumbs.db 8 | Thumbs.db 9 | *cache.json 10 | 11 | # IDE Specific 12 | nbproject 13 | .~lock.* 14 | .buildpath 15 | .idea 16 | .project 17 | .settings 18 | composer.lock 19 | *.sublime-workspace 20 | *.swp 21 | *.swo 22 | 23 | # Project Specific 24 | node_modules 25 | .env 26 | tmp 27 | *.tmp* 28 | *.log 29 | logs 30 | .changelog 31 | pids 32 | *.pid 33 | *.seed 34 | *.pid.lock 35 | lib-cov 36 | coverage 37 | .nyc_output 38 | build/Release 39 | typings/ 40 | .npm 41 | .npmrc 42 | .eslintcache 43 | .node_repl_history 44 | *.tgz 45 | .yarn-integrity 46 | lib 47 | build 48 | dist 49 | .cache 50 | .docz 51 | *.rpt2* 52 | *.rts2* 53 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | export const between = (num, min, max) => Math.max(min, Math.min(num, max)) 2 | 3 | export const range = (from, to) => { 4 | const result = [] 5 | let n = from 6 | 7 | while (n < to) { 8 | result.push(n) 9 | n += 1 10 | } 11 | 12 | return result 13 | } 14 | 15 | export const pagix = ({ 16 | records, 17 | limit = 10, 18 | current = 1, 19 | delta = 1, 20 | fixed = 1, 21 | }) => { 22 | const total = Math.ceil(Math.max(1, records / limit)) 23 | const page = between(current, 1, total) 24 | 25 | const min = 1 + fixed 26 | const max = total - fixed 27 | 28 | const maxLeft = Math.min(max - delta * 2 - 1, max) 29 | const minRight = Math.min(min + delta * 2 + 1, max) 30 | 31 | const left = between(page - delta, min, maxLeft) 32 | const right = between(page + delta, minRight, max) 33 | 34 | const missLeft = left - fixed 35 | const missRight = total - fixed - right + 1 36 | 37 | const hasPrev = missLeft > 2 38 | const hasNext = missRight > 2 39 | 40 | const start = range(1, between(fixed + 1, 1, total + 1)) 41 | 42 | const middle = range( 43 | missLeft === 2 ? left - 1 : left, 44 | missRight === 2 ? right + 2 : right + 1 45 | ) 46 | const end = range(between(total - fixed + 1, 2, total + 1), total + 1) 47 | 48 | const from = between(limit * page - limit + 1, 1, records) 49 | const to = between(limit * page, 1, records) 50 | 51 | const prev = hasPrev && between(page - 1 - delta * 2, 1, total) 52 | const next = hasNext && between(page + 1 + delta * 2, 1, total) 53 | 54 | return { 55 | total, 56 | current: page, 57 | start, 58 | middle, 59 | end, 60 | next, 61 | prev, 62 | from, 63 | to, 64 | } 65 | } 66 | 67 | export default pagix 68 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # 1.0.0 (2020-04-05) 2 | 3 | 4 | ### Bug Fixes 5 | 6 | * default export ([f9ce7b0](https://github.com/brunobertolini/pagix/commit/f9ce7b068bd2a4ef07a70a3a0134d2c0a79188bc)) 7 | * range calc ([564e643](https://github.com/brunobertolini/pagix/commit/564e643d42aed0db9d0de1499f410ae3d0b6ca4f)) 8 | 9 | 10 | ### Features 11 | 12 | * move params to object params and create prev/next calc ([9943e93](https://github.com/brunobertolini/pagix/commit/9943e931bb7f4368907608c9a9299cf7107bd75d)) 13 | * **paginatex:** start with previous code ([06de7d6](https://github.com/brunobertolini/pagix/commit/06de7d672273a43345c61a828adec626c697dd91)) 14 | 15 | # Change Log 16 | 17 | All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines. 18 | 19 | 20 | # [0.1.0-alpha.3](https://github.com/brunobertolini/paginatex/compare/v0.1.0-alpha.2...v0.1.0-alpha.3) (2019-01-10) 21 | 22 | 23 | ### Bug Fixes 24 | 25 | * range calc ([564e643](https://github.com/brunobertolini/paginatex/commit/564e643)) 26 | 27 | 28 | 29 | 30 | # [0.1.0-alpha.2](https://github.com/brunobertolini/paginatex/compare/v0.1.0-alpha.1...v0.1.0-alpha.2) (2019-01-09) 31 | 32 | 33 | 34 | 35 | # [0.1.0-alpha.1](https://github.com/brunobertolini/paginatex/compare/v0.1.0-alpha.0...v0.1.0-alpha.1) (2019-01-09) 36 | 37 | 38 | 39 | 40 | # 0.1.0-alpha.0 (2019-01-09) 41 | 42 | 43 | ### Features 44 | 45 | * **paginatex:** start with previous code ([06de7d6](https://github.com/brunobertolini/paginatex/commit/06de7d6)) 46 | -------------------------------------------------------------------------------- /index.d.ts: -------------------------------------------------------------------------------- 1 | export function between(num: number, min: number, max: number): number; 2 | export function range(from: number, to: number): number[]; 3 | 4 | export interface PagixOptions { 5 | /** 6 | * total of records to paginate 7 | */ 8 | records: number; 9 | /** 10 | * total of records to show per page 11 | * @default 10 12 | */ 13 | limit?: number; 14 | /** 15 | * current page 16 | * @default 1 17 | */ 18 | current?: number; 19 | /** 20 | * total of pages to show in each side of current page 21 | * @default 1 22 | */ 23 | delta?: number; 24 | /** 25 | * total of pages to show before prev button and after next button 26 | * @default 1 27 | */ 28 | fixed?: number; 29 | } 30 | 31 | interface PagixReturn { 32 | /** 33 | * total number of pages 34 | */ 35 | total: number; 36 | /** 37 | * current page number, constrained between `1` and `total` 38 | */ 39 | current: number; 40 | /** 41 | * an array of page numbers, the first `fixed` page numbers 42 | */ 43 | start: number[]; 44 | /** 45 | * an array of page numbers, calculated from `current` page 46 | */ 47 | middle: number[]; 48 | /** 49 | * an array with pages after next button 50 | */ 51 | end: number[]; 52 | /** 53 | * the previous page number between `start` and `middle` 54 | * false if there is no truncated pages between `start` and `middle` 55 | */ 56 | next: number | false; 57 | /** 58 | * the next page number between `middle` and `end` 59 | * false if there is no truncated pages between `middle` and `end` 60 | */ 61 | prev: number | false; 62 | /** 63 | * initial record in current pagination 64 | */ 65 | from: number; 66 | /** 67 | * last record in current pagination 68 | */ 69 | to: number; 70 | } 71 | 72 | export function pagix(options: PagixOptions): PagixReturn; 73 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "pagix", 3 | "version": "1.1.0", 4 | "license": "MIT", 5 | "description": "A generic pagination algorithm", 6 | "main": "dist/index.js", 7 | "umd:main": "dist/index.umd.js", 8 | "module": "dist/index.m.js", 9 | "source": "src/index.js", 10 | "files": [ 11 | "dist/", 12 | "index.d.ts", 13 | "package.json", 14 | "README.md" 15 | ], 16 | "types": "index.d.ts", 17 | "keywords": [ 18 | "pagination", 19 | "pages", 20 | "paginate", 21 | "pages calc", 22 | "pagination calculate", 23 | "pagination calc" 24 | ], 25 | "author": { 26 | "name": "Bruno Bertolini", 27 | "email": "dev@brunobertolini.com", 28 | "url": "http://brunobertolini.com" 29 | }, 30 | "repository": { 31 | "type": "git", 32 | "url": "https://github.com/brunobertolini/pagix" 33 | }, 34 | "scripts": { 35 | "fix": "yarn fix:lint", 36 | "fix:lint": "prettier \"src/**/*.{js,jsx,ts,tsx}\" --write", 37 | "lib:dev": "microbundle watch --target browser --name pagix", 38 | "lib:build": "microbundle build --target browser --name pagix", 39 | "lib:release": "standard-version --no-verify", 40 | "build": "yarn lib:build", 41 | "prepublish": "yarn build" 42 | }, 43 | "husky": { 44 | "hooks": { 45 | "pre-commit": "lint-staged", 46 | "commit-msg": "commitlint -E HUSKY_GIT_PARAMS" 47 | } 48 | }, 49 | "commitlint": { 50 | "extends": [ 51 | "@commitlint/config-conventional" 52 | ] 53 | }, 54 | "lint-staged": { 55 | "*.{{js,jsx,mjs,ts,tsx,md,mdx}}": [ 56 | "yarn fix", 57 | "git add" 58 | ] 59 | }, 60 | "devDependencies": { 61 | "@commitlint/cli": "^8.3.5", 62 | "@commitlint/config-conventional": "^8.3.4", 63 | "@semantic-release/changelog": "^5.0.1", 64 | "@semantic-release/git": "^9.0.0", 65 | "husky": "^4.2.3", 66 | "lint-staged": "^10.1.2", 67 | "microbundle": "^0.11.0", 68 | "prettier": "^2.0.2", 69 | "semantic-release": "^17.0.4" 70 | } 71 | } 72 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 |

2 | Pagix 3 |

4 | 5 | > A generic, framework agnostic, pagination calculator 6 | 7 | ## Highlights 8 | 9 | - :electric_plug: Framework agnostic 10 | - :trophy: Dependency free 11 | - :fire: Higly flexible 12 | 13 | ### ✨ [Demo](https://codesandbox.io/s/loving-mclaren-4265rwmzlx) 14 | 15 | ## Install 16 | 17 | ``` 18 | yarn add pagix 19 | ``` 20 | 21 | ## Basic Usage 22 | 23 | ```js 24 | import { pagix } from 'pagix' 25 | 26 | const paginate = pagix({ records: 100 }) 27 | ``` 28 | 29 | The `pagix` function returns an object with some calculated props: 30 | 31 | - **total**: total number of pages 32 | - **current**: current page number, constrained between `1` and `total` 33 | - **start**: an array of page numbers, the first `fixed` page numbers 34 | - **middle**: an array of page numbers, calculated from `current` page 35 | - **end**: an array of page numbers, the last `fixed` page numbers 36 | - **prev**: the previous page number between `start` and `middle`, false if there is no truncated pages between `start` and `middle` 37 | - **next**: the next page number between `middle` and `end`, false if there is no truncated pages between `middle` and `end` 38 | - **from**: initial record in current page 39 | - **to**: last record in current page 40 | 41 | ![pagination explain](./pagination.png) 42 | 43 | ## API 44 | 45 | **pagix({ records [, limit, current, delta, fixed ] })**: Main method to calculate pagination 46 | 47 | | Prop | Required | Default | Description | 48 | | ------- | -------- | ------- | --------------------------------------------------------------- | 49 | | records | true | - | total of records to paginate | 50 | | limit | false | 10 | total of records to show per page | 51 | | current | true | 1 | current page | 52 | | delta | true | 1 | total of pages to show in each side of current page | 53 | | fixed | true | 1 | total of pages to show before prev button and after next button | 54 | 55 | ## 🤝 Contributing 56 | 57 | Contributions, issues and feature requests are welcome!
Feel free to check [issues page](https://github.com/brunobertolini/pagix/issues). 58 | 59 | ## Show your support 60 | 61 | Give a ⭐️ if this project helped you! 62 | --------------------------------------------------------------------------------