{"_id":"@azissofyanp/zxasp-pagination","_rev":"1-b9cc3aff5fe8770b325facd5154d2422","name":"@azissofyanp/zxasp-pagination","dist-tags":{"latest":"1.0.1"},"versions":{"1.0.0":{"type":"module","name":"@azissofyanp/zxasp-pagination","version":"1.0.0","description":"A flexible pagination library for client and server-side data.","main":"index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"repository":{"type":"git","url":"git+https://github.com/azissofyanp/zxasp-pagination.git"},"author":{"name":"Azis Sofyan Prasetyo"},"license":"MIT","dependencies":{"axios":"^1.1.0"},"bugs":{"url":"https://github.com/azissofyanp/zxasp-pagination/issues"},"homepage":"https://github.com/azissofyanp/zxasp-pagination#readme","keywords":["pagination"],"gitHead":"1f1efcac785446945438ea40777b3219182c748f","_id":"@azissofyanp/zxasp-pagination@1.0.0","_nodeVersion":"20.9.0","_npmVersion":"9.7.2","dist":{"integrity":"sha512-HZooly8m58mGxPm2oCTeGSr/luHWEDVFP6/hvmh8+sAUHcSpm0di53RJJ8gfbmF6H5z6z8P/mBQjgddIRzvKaQ==","shasum":"b0adec3cb22af65eff07b7cfb103ec94bd8aedbc","tarball":"https://registry.npmjs.org/@azissofyanp/zxasp-pagination/-/zxasp-pagination-1.0.0.tgz","fileCount":4,"unpackedSize":20625,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGvS98Q9icmZ66LM5dOfrKh2GtfprKlkdIPwrrtD7VjPAiEAmISEVVUiOnHQBDH0//hTWPGtU0un/WbFUnIggaLkv/8="}]},"_npmUser":{"name":"azissofyanp_","email":"azissofyanp@gmail.com"},"directories":{},"maintainers":[{"name":"azissofyanp_","email":"azissofyanp@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/zxasp-pagination_1.0.0_1699376817174_0.06574757501944584"},"_hasShrinkwrap":false},"1.0.1":{"type":"module","name":"@azissofyanp/zxasp-pagination","version":"1.0.1","description":"A flexible pagination library for client and server-side data.","main":"index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"repository":{"type":"git","url":"git+https://github.com/azissofyanp/zxasp-pagination.git"},"author":{"name":"Azis Sofyan Prasetyo"},"license":"MIT","dependencies":{"axios":"^1.1.0"},"bugs":{"url":"https://github.com/azissofyanp/zxasp-pagination/issues"},"homepage":"https://github.com/azissofyanp/zxasp-pagination#readme","keywords":["pagination"],"gitHead":"5a556c5e03cf31b89dcf0176c3bc46dec8142736","_id":"@azissofyanp/zxasp-pagination@1.0.1","_nodeVersion":"20.9.0","_npmVersion":"9.7.2","dist":{"integrity":"sha512-pc1RhvjnH1Z5kF7XmJv/RTvj4RHVnNtmeVtL7SLAr/g2zBhsljovMNGqN6SeqtuqkjnqV/Mh38iFBU/zvcmIEw==","shasum":"c85a2f2bcab8ef89972b8422b968e62361be7cd0","tarball":"https://registry.npmjs.org/@azissofyanp/zxasp-pagination/-/zxasp-pagination-1.0.1.tgz","fileCount":5,"unpackedSize":20677,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDsk+rLfwc5XlFju0fsZBm8FQg0J9hSSLjvlzpxFMzlhQIgLpp1wz9Amw4tE/qL4eKIwL3gvBY87zeRFM2eDY6AWkM="}]},"_npmUser":{"name":"azissofyanp_","email":"azissofyanp@gmail.com"},"directories":{},"maintainers":[{"name":"azissofyanp_","email":"azissofyanp@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/zxasp-pagination_1.0.1_1699664606656_0.15463581470323895"},"_hasShrinkwrap":false}},"time":{"created":"2023-11-07T17:06:57.060Z","1.0.0":"2023-11-07T17:06:57.373Z","modified":"2023-11-11T01:03:27.101Z","1.0.1":"2023-11-11T01:03:26.854Z"},"maintainers":[{"name":"azissofyanp_","email":"azissofyanp@gmail.com"}],"description":"A flexible pagination library for client and server-side data.","homepage":"https://github.com/azissofyanp/zxasp-pagination#readme","keywords":["pagination"],"repository":{"type":"git","url":"git+https://github.com/azissofyanp/zxasp-pagination.git"},"author":{"name":"Azis Sofyan Prasetyo"},"bugs":{"url":"https://github.com/azissofyanp/zxasp-pagination/issues"},"license":"MIT","readme":"# ZxPagination\r\n\r\n`ZxPagination` is a JavaScript library designed to simplify the process of creating paginated content with both client-side and server-side data fetching. It provides an easy-to-use interface for creating paginated data views in web applications.\r\n\r\n## Table of Contents\r\n\r\n- [Introduction](#introduction)\r\n- [Installation](#installation)\r\n- [Usage](#usage)\r\n  - [Initialization](#initialization)\r\n  - [Fetching Data](#fetching-data)\r\n  - [Updating Configuration](#updating-configuration)\r\n  - [Reloading Data](#reloading-data)\r\n- [Options](#options)\r\n- [Events](#events)\r\n- [Customization](#customization)\r\n- [Contributing](#contributing)\r\n- [License](#license)\r\n\r\n## Introduction\r\n\r\n`ZxPagination` provides a flexible and customizable solution for handling paginated data views in your web applications. Whether you want to fetch data from a server or use client-side data, this library simplifies the process and offers various configuration options for tailoring the pagination experience to your needs.\r\n\r\n## Installation\r\n\r\nYou can include `ZxPagination` in your project by including the following script tag in your HTML:\r\n\r\n```html\r\n<script src=\"path-to/zx-pagination.js\"></script>\r\n```\r\n\r\nReplace `path-to` with the actual path to the `zx-pagination.js` file in your project.\r\n\r\n## Usage\r\n\r\n### Initialization\r\n\r\nTo create a paginated data view, you need to initialize an instance of the `ZxPagination` class. Here's how you can do it:\r\n\r\n```javascript\r\nconst options = {\r\n  // Configuration options (see below)\r\n};\r\n\r\nconst pagination = new ZxPagination(options);\r\n```\r\n\r\n### Fetching Data\r\n\r\n`ZxPagination` supports both client-side and server-side data fetching. The `mode` option specifies the fetching mode. You can fetch data manually using the `fetchData` method:\r\n\r\n```javascript\r\npagination.fetchData(pageNumber);\r\n```\r\n\r\n### Updating Configuration\r\n\r\nYou can update the configuration of an existing `ZxPagination` instance using the `updateConfig` method:\r\n\r\n```javascript\r\nconst newOptions = {\r\n  // New configuration options\r\n};\r\n\r\npagination.updateConfig(newOptions);\r\n```\r\n\r\n### Reloading Data\r\n\r\nYou can reload the current page of data using the `reload` method:\r\n\r\n```javascript\r\nawait pagination.reload();\r\n```\r\n\r\n## Options\r\n\r\nHere are the available configuration options that you can pass when initializing or updating a `ZxPagination` instance:\r\n\r\n- `axiosConfig`: Configuration options for Axios (if using server-side data fetching).\r\n- `initLoad`: Boolean indicating whether to load data immediately.\r\n- `contentDiv`: ID of the container for displaying data content.\r\n- `paginationDiv`: ID of the container for displaying pagination controls.\r\n- `skeletonHtml`: HTML template for displaying loading skeleton.\r\n- `template`: Function that generates HTML for each data item.\r\n- `limit`: Number of items per page.\r\n- `mode`: Fetching mode (`\"client\"` or `\"server\"`).\r\n- `processing`: Processing mode (`\"client\"` or `\"server\"`).\r\n- `dataSrc`: Array of data items (if using client-side data).\r\n- `dataKey`: Key to access data in server response.\r\n- `noDataHtml`: HTML for displaying when there is no data.\r\n- `showPreviousNextButtons`: Boolean indicating whether to show previous/next buttons.\r\n- `paginationButtonsToShow`: Number of pagination buttons to show.\r\n- `onDataFetchSuccess`: Custom function to call on successful data fetch.\r\n- `onDataFetchError`: Custom function to call on data fetch error.\r\n- `paginationClass`: CSS class for the pagination container.\r\n- `activePageClass`: CSS class for the active page button.\r\n- `pageItemClass`: CSS class for pagination page item.\r\n- `pageLinkClass`: CSS class for pagination page link.\r\n\r\n## Events\r\n\r\n`ZxPagination` triggers the following events:\r\n\r\n- `onDataFetchSuccess(data)`: Triggered on successful data fetch.\r\n- `onDataFetchError(error)`: Triggered on data fetch error.\r\n\r\n## Customization\r\n\r\nYou can customize the appearance and behavior of the pagination controls and data content by updating the CSS classes and HTML templates used in the options.\r\n\r\n## Contributing\r\n\r\nContributions are welcome! Feel free to submit issues and pull requests to help improve `ZxPagination`.\r\n\r\n## License\r\n\r\n`ZxPagination` is licensed under the MIT License. See the [LICENSE](LICENSE) file for details.\r\n","readmeFilename":"README.md"}