Merge pull request #15206 from pegel03/master

Typings for React-Paginate (latest version 4.2.0)

react-paginate/index.d.ts

@@ -1,10 +1,10 @@
-// Type definitions for react-paginate v4.2.0
+// Type definitions for react-paginate 4.2
 // Project: https://github.com/AdeleD/react-paginate
-// Definitions by: Simon Hartcher <https://github.com/deevus>, Wouter Hardeman <https://github.com/wouterhardeman>
+// Definitions by: Simon Hartcher <https://github.com/deevus>, Wouter Hardeman <https://github.com/wouterhardeman>, pegel03 <https://github.com/pegel03>
 // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
 // TypeScript Version: 2.1
 
-import * as React from "react";
+import * as React from 'react';
 
 interface ReactPaginateProps {
     /**
@@ -45,7 +45,7 @@ interface ReactPaginateProps {
     /**
      * The method to call when a page is clicked. Exposes the current page object as an argument.
      */
-    onPageChange?: Function;
+    onPageChange?: (selectedItem: {selected: number}) => void;
 
     /**
      * The initial page selected.
@@ -58,9 +58,9 @@ interface ReactPaginateProps {
     forcePage?: number;
 
     /**
-     * Disable `onPageChange` callback with initial page. Default: `false`
+     * Disable onPageChange callback with initial page. Default: false
      */
-    disableInitialCallback?: boolean
+    disableInitialCallback?: boolean;
 
     /**
      * The classname of the pagination container.
@@ -108,9 +108,9 @@ interface ReactPaginateProps {
     disabledClassName?: string;
 
     /**
-     * The method is called to generate the `href` attribute value on tag `a` of each page element.
+     * The method is called to generate the href attribute value on tag a of each page element.
      */
-    hrefBuilder?: Function;
+    hrefBuilder?: (pageIndex: number) => void;
 }
 
 declare const ReactPaginate: React.ComponentClass<ReactPaginateProps>;

react-paginate/react-paginate-tests.tsx

@@ -2,12 +2,31 @@ import * as React from "react";
 import ReactPaginate = require("react-paginate");
 
 class Test extends React.Component<{}, {}> {
-    public render() {
+
+    render() {
         return (
             <ReactPaginate
                 pageCount={1}
                 pageRangeDisplayed={10}
                 marginPagesDisplayed={2}
+                previousLabel={'previous'}
+                nextLabel={'next'}
+                breakLabel={'break-me'}
+                breakClassName={'break-class'}
+                onPageChange={(selectedItem: {selected: number}) => null}
+                initialPage={2}
+                forcePage={3}
+                disableInitialCallback={false}
+                containerClassName={'container'}
+                pageClassName={'page-li'}
+                pageLinkClassName={'page-a'}
+                activeClassName={'active'}
+                previousClassName={'previous-li'}
+                nextClassName={'next-li'}
+                previousLinkClassName={'previous-a'}
+                nextLinkClassName={'next-a'}
+                disabledClassName={'disabled'}
+                hrefBuilder={(pageIndex: number) => null}
             />
         );
     }

react-paginate/tsconfig.json

@@ -11,7 +11,7 @@
         ],
         "noImplicitAny": true,
         "noImplicitThis": true,
-        "strictNullChecks": false,
+        "strictNullChecks": true,
         "baseUrl": "../",
         "typeRoots": [
             "../"
@@ -21,4 +21,4 @@
         "forceConsistentCasingInFileNames": true,
         "jsx": "react"
     }
-}
+}

react-paginate/tslint.json

@@ -0,0 +1 @@
+{ "extends": "../tslint.json" }