chototoss / react-paginating Goto Github PK
View Code? Open in Web Editor NEWSimple, lightweight, flexible pagination ReactJS component ⏮⏪1️⃣2️⃣3️⃣⏩⏭
Home Page: https://chototoss.github.io/react-paginating/
License: MIT License
Simple, lightweight, flexible pagination ReactJS component ⏮⏪1️⃣2️⃣3️⃣⏩⏭
Home Page: https://chototoss.github.io/react-paginating/
License: MIT License
Hello there,
A relative simple question: Is it compatible with IE 11 ?
Kind Regards.
\uno>npm install --save react-paginating
npm WARN rollback Rolling back [email protected] failed (this is probably harmless): EPERM: operation not permitted, lstat 'C:\REACT\uno\node_modules\jest-haste-map\node_modules\fsevents\node_modules'
npm WARN @typescript-eslint/[email protected] requires a peer of typescript@* but none is installed. You must install peer dependencies yourself.
npm WARN @typescript-eslint/[email protected] requires a peer of typescript@* but none is installed. You must install peer dependencies yourself.
npm WARN @typescript-eslint/[email protected] requires a peer of typescript@* but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of [email protected] - 3 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of popper.js@^1.14.7 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of typescript@* but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\jest-haste-map\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
get rid of create react app and set up from scratch
Could you please release a new version with those improved typings?
Describe the issue
Update typescript declaration & flow-type files.
Solution
class
declaration to function
and use React.SFC
.flowgen
to update the flow-typed
file.Describe the bug
Missing propTypes
at Pagination.js
.
Solution
Revert the propTypes
from the old version.
Replace the calculation of pagination with paging-algorithm: https://www.npmjs.com/package/paging-algorithm
Describe the issue
Apply rollup to replace the build process.
Expected behavior
Using the rollup to release to manage the build process. It supports 3 types of module.
Actual behavior
It uses the "babel cli" to compile the ES6 code to ES5 code.
From the example as of the moment, developers would have to construct their data into an array of array to conform with the usage of this library. I don't really think it's developer-friendly that way. A developer should only concern with the data that they get an external source (API, file etc...).
Hence, I'm submitting a feature request for a method that will: take in an Array and a limit
integer and will return a new Array with the proper format.
function getData(array, perPage) {
...
}
Also, I think that limit
is a bit odd name for what it really is. Should it be perPage
? or itemsPerPage
?
Describe the issue
Add support minified iife
format.
Solution
packge.json
Add postbuild
command
"scripts": {
...,
"postbuild": "BUILD_MINIFY=true rollup --config"
...,
}
rollup.config.js
Install package terser
& modify the rollup config.
import babel from 'rollup-plugin-babel';
import { terser } from 'rollup-plugin-terser';
const isMinify = process.env.BUILD_MINIFY ? true : false;
let output = [
{
file: 'dist/react-paginating.cjs.js',
name: 'react-paginating-cjs',
format: 'cjs'
},
{
file: 'dist/react-paginating.esm.js',
name: 'react-paginating-esm',
format: 'esm'
},
{
file: 'dist/react-paginating.umd.js',
name: 'react-paginating-umd',
format: 'umd',
sourcemap: true
},
];
if (isMinify) {
output = {
file: 'dist/react-paginating.umd.min.js',
name: 'react-paginating.umd.min',
format: 'iife',
sourcemap: true
};
}
export default [{
input: 'src/Pagination/index.js',
output,
plugins: [
babel({
exclude: 'node_modules/**'
}),
isMinify ? terser() : null
]
}];
☝️ Important announcement: Greenkeeper will be saying goodbye 👋 and passing the torch to Snyk on June 3rd, 2020! Find out how to migrate to Snyk and more at greenkeeper.io
4.3.3
to 4.4.0
.This version is covered by your current version range and after updating it in your project the build failed.
rollup-plugin-babel is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.
There is a collection of frequently asked questions. If those don’t help, you can always ask the humans behind Greenkeeper.
Your Greenkeeper Bot 🌴
Hi,
Are there any code samples which show how to send the click event parameter to the onPageChange? So that i can stop propagating it?
Hi, I'm new to React and I would like to use this component as a Hook instead of normal Class. Is there a working example I can view?
Thanks
Describe the bug
Optimize the commands to be cleaner by using bash scripts.
Solution
Create bash scripts contains scripts
directory.
Hi,
When I NPM install I get the above error. I am using Gatsby.
Any ideas?
Many thanks
Nick
Set up a small app in site the repo to create a document and apply react-paginating.github.io
to point to the document
Describe the issue
Upgrade babel from version 6 to 7
Solution
install packages
presets
@babel/core
@babel/preset-env
@babel/preset-react
plugins
@babel/plugin-proposal-class-properties
and update .babelrc
as follow:
{
"presets": [
"@babel/preset-env",
"@babel/preset-react"
],
"plugins": [
"@babel/plugin-proposal-class-properties"
]
}
☝️ Important announcement: Greenkeeper will be saying goodbye 👋 and passing the torch to Snyk on June 3rd, 2020! Find out how to migrate to Snyk and more at greenkeeper.io
3.4.0
to 3.4.1
.This version is covered by your current version range and after updating it in your project the build failed.
react-scripts is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.
v3.4.1 is a maintenance release that includes minor bug fixes and documentation updates including upgrading Babel to fix a bug in the 7.8 release line. This release also brings support for TypeScript 3.8.
react-scripts
babel-preset-react-app
cra-template
, eslint-config-react-app
, react-scripts
cra-template-typescript
, cra-template
react-scripts
react-scripts
babel-preset-react-app
, create-react-app
, react-dev-utils
, react-error-overlay
, react-scripts
react-scripts
Inside any created project that has not been ejected, run:
npm install --save --save-exact [email protected]
or
yarn add --exact [email protected]
The new version differs by 13 commits.
d2f813f
Publish
7641a3c
Prepare 3.4.1 release
d5b527f
Update to Babel 7.9 (#8681)
6adb82a
Add React.StrictMode to default templates (#8558)
a452ddc
Bump dependencies (#8620)
3f699fd
Fix proxying API request docs (#8515)
4d26208
Use native ESLint behaviour when extending (#8276)
8ba0ccb
Whitelist main in template.json (#8539)
7d3b72c
Update template example in docs (#8561)
2030ee1
Fix optional chaining and nullish coalescing support (#8526)
038e6fa
Widen eslint-config-react-app peer dependency versions (#7790)
7e6d6cd
Closes webpack dev server and exits process on "end" stdin (#7203)
af926d5
Bump pnp-webpack-plugin (#8509)
See the full diff
There is a collection of frequently asked questions. If those don’t help, you can always ask the humans behind Greenkeeper.
Your Greenkeeper Bot 🌴
6.13.0
to 6.14.0
.This version is covered by your current version range and after updating it in your project the build failed.
all-contributors-cli is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.
The new version differs by 5 commits.
b3d0995
feat(alpha-sort): Add a parameter contributorsSortAlphabetically (#249)
8dd551a
chore(package): update nock to version 12.0.0 (#248)
80b1fbd
Update pify to the latest version 🚀 (#247)
07099de
chore(deps): update inquirer to the latest version 🚀 (#245)
3c124bf
Update kcd-scripts to the latest version 🚀 (#244)
See the full diff
There is a collection of frequently asked questions. If those don’t help, you can always ask the humans behind Greenkeeper.
Your Greenkeeper Bot 🌴
devDependency
@babel/core was updated from 7.8.4
to 7.8.6
.devDependency
@babel/plugin-proposal-class-properties was updated from 7.8.0
to 7.8.3
.devDependency
@babel/preset-env was updated from 7.8.4
to 7.8.6
.devDependency
@babel/preset-react was updated from 7.8.0
to 7.8.3
.This version is covered by your current version range and after updating it in your project the build failed.
This monorepo update includes releases of one or more dependencies which all belong to the babel7 group definition.
babel7 is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.
There is a collection of frequently asked questions. If those don’t help, you can always ask the humans behind Greenkeeper.
Your Greenkeeper Bot 🌴
dependency
react was updated from 16.12.0
to 16.13.0
.dependency
react-dom was updated from 16.12.0
to 16.13.0
.devDependency
react-test-renderer was updated from 16.12.0
to 16.13.0
.This version is covered by your current version range and after updating it in your project the build failed.
This monorepo update includes releases of one or more dependencies which all belong to the react group definition.
react is a direct dependency of this project, and it is very likely causing it to break. If other packages depend on yours, this update is probably also breaking those in turn.
React.createFactory()
(@trueadm in #17878)style
may cause an unexpected collision (@sophiebits in #14181, #18002)unstable_createPortal
(@trueadm in #17880)onMouseEnter
being fired on disabled buttons (@AlfredoGJ in #17675)shouldComponentUpdate
twice when developing in StrictMode
(@bvaughn in #17942)version
property to ReactDOM (@ealush in #15780)toString()
of dangerouslySetInnerHTML
(@sebmarkbage in #17773)ReactDOM.createRoot()
(@trueadm in #17937)ReactDOM.createRoot()
callback params and added warnings on usage (@bvaughn in #17916)SuspenseList
CPU bound heuristic (@sebmarkbage in #17455)isPending
only being true when transitioning from inside an input event (@acdlite in #17382)React.memo
components dropping updates when interrupted by a higher priority update (@acdlite in #18091)There is a collection of frequently asked questions. If those don’t help, you can always ask the humans behind Greenkeeper.
Your Greenkeeper Bot 🌴
☝️ Important announcement: Greenkeeper will be saying goodbye 👋 and passing the torch to Snyk on June 3rd, 2020! Find out how to migrate to Snyk and more at greenkeeper.io
7.18.3
to 7.19.0
.This version is covered by your current version range and after updating it in your project the build failed.
eslint-plugin-react is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.
The new version differs by 14 commits.
e2ed536
Update CHANGELOG and bump version
5959b5f
[fix] prefer-stateless-function
: avoid crash on ts empty constructor
e231f44
[tests] no-unescaped-entities
: skip test cases that are now parsing errors in [email protected]
434b45f
[Dev Deps] update @types/eslint
, @types/estree
, @types/node
, eslint-plugin-eslint-plugin
, eslint-plugin-import
, typescript
a917dda
[Deps] update resolve
, xregexp
09608cc
[Fix] no-adjacent-inline-elements
: avoid a crash
b833535
[Fix] no-unused-prop-types
: Change the reporting to point to a more accurate node
edc5fe2
[New] style-prop-object
: Add allow
option
9b5d6aa
[Fix] self-closing-comp
: consider JSXMemberExpression as component too
598277e
[New] jsx-pascal-case
: Support unicode characters
43e466c
[readme] Small visual inconsistency
03edb68
[docs] add react/
prefix to rule name, for consistency
b517b9e
[Fix] no-unused-prop-types
: make markPropTypesAsUsed
work with TSEmptyBodyFunctionExpression
AST node
66c0d66
[Fix] displayName
(but really, propTypes
detection): do not crash on empty flow type spreads
See the full diff
There is a collection of frequently asked questions. If those don’t help, you can always ask the humans behind Greenkeeper.
Your Greenkeeper Bot 🌴
Pagination UX/UI on Mobile devices does not necessarily look and feel like Pagination on Web. This library (https://github.com/garrettmac/react-native-pagination) provides great examples on how one would implement Pagination on mobile devices.
However, for this particular library, I could think of one immediate use-case is to wrap a list (FlatList
for example) in the Pagination
component and implement onReachedEnd()
(I think that's what the method's called, could be completely off but the point is this method is called when the list reaches the end and asking for more data).
What do you guys think? Any other suggetions on how pagination should be on mobile devices?
☝️ Important announcement: Greenkeeper will be saying goodbye 👋 and passing the torch to Snyk on June 3rd, 2020! Find out how to migrate to Snyk and more at greenkeeper.io
9.0.0
to 9.0.1
.This version is covered by your current version range and after updating it in your project the build failed.
sinon is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.
The new version differs by 23 commits.
d2b4b72
Update docs/changelog.md and set new release id in docs/_config.yml
c99f6ea
Add release documentation for v9.0.1
0fe75bf
9.0.1
e24b7e7
Update CHANGELOG.md and AUTHORS for new release
00b40a6
Upgrade @sinonjs/samsam to latest
decaec6
Upgrade @sinonjs/formatio to latest
775e53b
Merge pull request #2237 from fatso83/issue-2226
92dc087
Remove needless intermediary
25311e4
Simplify sandbox fix by reusing the fix for stubs
1fe433e
[fix] stubs restore prototype props correctly
3031027
Add custom prop isOwn to descriptor
49abbad
Rename util
4b55c62
[fix] sandbox.restore handles protype props
aac0bc3
Add verification tests for #2226
5436466
Bump @sinonjs/commons from 1.7.0 to 1.7.1
There are 23 commits in total.
See the full diff
There is a collection of frequently asked questions. If those don’t help, you can always ask the humans behind Greenkeeper.
Your Greenkeeper Bot 🌴
☝️ Important announcement: Greenkeeper will be saying goodbye 👋 and passing the torch to Snyk on June 3rd, 2020! Find out how to migrate to Snyk and more at greenkeeper.io
5.2.0
to 5.3.0
.This version is covered by your current version range and after updating it in your project the build failed.
rollup-plugin-terser is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.
There is a collection of frequently asked questions. If those don’t help, you can always ask the humans behind Greenkeeper.
Your Greenkeeper Bot 🌴
Add the customize prop className to let it’s easier to customize style
Replace the current paging algorithm with paging-algorithm
package
As stated in the title, we should try getting rid of UNSAFE Life Cycle methods that are being used in master branch. As far as I understand, we would want to update the state.currentPage
to this.props.currentPage
if this.props.currentPage
is not null AND this.props.currentPage
is different than current state.currentPage
.
We can actually use static getDerivedStateFromProps
for this and get rid of the two UNSAFE componentWill...
methods.
Describe the bug
Error when pass Controlled Props as string on server side using Nextjs 8
To Reproduce
Steps to reproduce the behavior:
<Pagination
total={'this is string'}
currentPage={'10'} />
Expected behavior
"10", '2'
Describe the issue
After finishing the development. Next step is releasing the package with the new version. We don't need to commit the dist/
directory to the repo.
Solution
Adding the dist/
,yarn.lock
and package-lock.json
to .gitignore
file.
When trying to run my react-scripts
based app after upgrading this package to its latest version, I get a warning:
The react-scripts package provided by Create React App requires a dependency:
"babel-loader": "8.0.5"
Looking at the changes, this commit appears to have moved a number of dependencies from dev to normal when upgrading them. Leaving this as-it would mean that any react-scripts
app that uses a different version of that package would be unable to depend on this one.
Describe the issue
Add flow-typed support
Solution
Use Flowgen to migrate the Typescript declaration file to flow-typed file.
1.31.1
to 1.32.0
.This version is covered by your current version range and after updating it in your project the build failed.
rollup is a devDependency of this project. It might not break your production code or affect downstream projects, but probably breaks your build or test tools, which may prevent deploying or publishing.
2020-02-28
--plugin <plugin>
(#3379)The new version differs by 8 commits.
9d68d8e
1.32.0
f3320a0
Update changelog
07223eb
introduce CLI --plugin support (#3379)
1b5f505
Update resolveFileUrl docs (#3404)
1d8a09e
Update changelog
b6251df
Bump codecov from 3.6.1 to 3.6.5 (#3392)
db576f3
Update changelog
5779af6
fix typo: this.addWatchfile (#3390)
See the full diff
There is a collection of frequently asked questions. If those don’t help, you can always ask the humans behind Greenkeeper.
Your Greenkeeper Bot 🌴
Describe the bug
Basically, my API endpoint will be like: http://localhost:3000/api/items?page=2
which accepts query currentPage
is 2, and returns items
, totalPages
(eg. 20 pages)
Obviously, I don't have to and don't need to provide total
and limit
to your Component.
In the other hand, if I provide total
and limit
, I don't need to provide totalPages
By the way, pageCount
props name is very confusing, could you rename it to something clearer, like pagesDisplayCount
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.