diff --git a/README.md b/README.md index ccf02c7..b39c4e9 100644 --- a/README.md +++ b/README.md @@ -98,22 +98,20 @@ or ## Customizations -You can customize your pagination styles by overwriting default values. -If you do not want to use icons or do not have the default icon source (mdi) used in the project, -you can pass false as the value of iconButtons +You can customize your pagination styles by overwriting default values. Available props for component: Prop Name | Default Value ------------- | ------------- containerClass | pagination -iconButtons | true +buttonIcons | false prevButtonClass | page-item prevButtonText | Prev -prevIconButton | mdi mdi-chevron-left +prevButtonIcon | fa fa-chevron-left nextButtonClass | page-item nextButtonText | Next -nextIconButton | mdi mdi-chevron-right +nextButtonIcon | fa fa-chevron-right numberButtonClass | page-item numberClass | page-link numbersCountForShow | 2 @@ -130,8 +128,7 @@ You have to define here only props which you want to overwrite. options:{ containerClass: "pagination-container", prevButtonClass: "prev-button-class", - nextButtonText: "Next Page", - iconButtons: false, + nextButtonText: "Next Page" ... } ``` @@ -146,7 +143,7 @@ params=()=>{ } } ``` -`<Pagination changePage={this.getData} data={data} options={options} iconButtons={false} requestParams={this.params()}/>` +`<Pagination changePage={this.getData} data={data} options={options} requestParams={this.params()}/>` ## Credits diff --git a/package.json b/package.json index eef82ac..599f3b0 100644 --- a/package.json +++ b/package.json @@ -8,7 +8,7 @@ }, "repository": { "type": "git", - "url": "git+https://github.com/luilliarcec/react-laravel-paginex.git" + "url": "git+https://github.com/lionix-team/react-laravel-paginex.git" }, "keywords": [ "laravel", @@ -18,10 +18,6 @@ "paginate", "lionix" ], - "author": { - "name": "Luis Arce", - "email": "luilliarcec@gmail.com" - }, "contributors": [ { "name": "Lionix Team", diff --git a/src/Pagination.jsx b/src/Pagination.jsx index 53dce2f..bfc24b9 100644 --- a/src/Pagination.jsx +++ b/src/Pagination.jsx @@ -49,8 +49,8 @@ class Pagination extends Component { // Generate Prev Icon Or Text Buttons generateButtonsPrev = () => { let options = this.state.options; - if (options.iconButtons) { - return <i className={options.prevIconButton}/> + if (options.buttonIcons) { + return <i className={options.prevButtonIcon}/> } return options.prevButtonText; }; @@ -58,8 +58,8 @@ class Pagination extends Component { // Generate Next Icon Or Text Buttons generateButtonsNext = () => { let options = this.state.options; - if (options.iconButtons) { - return <i className={options.nextIconButton}/> + if (options.buttonIcons) { + return <i className={options.nextButtonIcon}/> } return options.nextButtonText; }; @@ -153,13 +153,13 @@ class Pagination extends Component { Pagination.defaultProps = { options: { containerClass: "pagination", - iconButtons: true, + buttonIcons: false, prevButtonClass: "page-item", prevButtonText: "Prev", - prevIconButton: "mdi mdi-chevron-left", + prevButtonIcon: "fa fa-chevron-left", nextButtonClass: "page-item", nextButtonText: "Next", - nextIconButton: "mdi mdi-chevron-right", + nextButtonIcon: "fa fa-chevron-right", numberButtonClass: "page-item", numberClass: "page-link", numbersCountForShow: 2, @@ -171,13 +171,13 @@ Pagination.defaultProps = { Pagination.propTypes = { options: PropTypes.shape({ containerClass: PropTypes.string, - iconButtons: PropTypes.bool, + buttonIcons: PropTypes.bool, nextButtonClass: PropTypes.string, nextButtonText: PropTypes.string, - nextIconButton: PropTypes.string, + nextButtonIcon: PropTypes.string, prevButtonClass: PropTypes.string, prevButtonText: PropTypes.string, - prevIconButton: PropTypes.string, + prevButtonIcon: PropTypes.string, numberButtonClass: PropTypes.string, numberClass: PropTypes.string, numberCountForShow: PropTypes.number,