Refactor #2310

src/components/paginator/JumpToPageInput.js

@@ -1,39 +1,58 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { InputNumber } from '../inputnumber/InputNumber';
+import { ObjectUtils } from '../utils/Utils';
 
 export class JumpToPageInput extends Component {
 
     static defaultProps = {
         page: null,
         rows: null,
+        pageCount: null,
         disabled: false,
+        template: null,
         onChange: null
     }
 
     static propTypes = {
         page: PropTypes.number,
         rows: PropTypes.number,
+        pageCount: PropTypes.number,
         disabled: PropTypes.bool,
+        template: PropTypes.any,
         onChange: PropTypes.func
     }
 
     constructor(props) {
         super(props)
 
-        this.inputChange = this.inputChange.bind(this);
+        this.onChange = this.onChange.bind(this);
     }
 
-    inputChange(event) {
+    onChange(event) {
         if (this.props.onChange) {
             this.props.onChange(this.props.rows * (event.value - 1), this.props.rows);
         }
     }
 
     render() {
-        return (
-            <InputNumber value={this.props.page} onChange={this.inputChange} className="p-paginator-page-input" disabled={this.props.disabled} />
-        )
+        const value = this.props.pageCount > 0 ? this.props.page + 1 : 0;
+        const element = <InputNumber value={value} onChange={this.onChange} className="p-paginator-page-input" disabled={this.props.disabled} />;
+
+        if (this.props.template) {
+            const defaultOptions = {
+                value,
+                onChange: this.onChange,
+                disabled: this.props.disabled,
+                className: 'p-paginator-page-input',
+                element,
+                props: this.props
+            };
+
+            return ObjectUtils.getJSXElement(this.props.template, defaultOptions);
+        }
+
+        return element;
     }
 
 }

src/components/paginator/Paginator.d.ts

@@ -116,10 +116,12 @@ interface PaginatorCurrentPageReportOptions {
 }
 
 interface PaginatorJumpToPageInputOptions {
-    page: number;
-    rows: number
-    disabled: boolean;
+    value: number;
     onChange(first:number, rows: number): void;
+    disabled: boolean;
+    className: string;
+    element: JSX.Element;
+    props: PaginatorProps;
 }
 
 interface PaginatorTemplateOptions {

src/components/paginator/Paginator.js

@@ -119,10 +119,6 @@ export class Paginator extends Component {
         return Math.floor(this.props.first / this.props.rows);
     }
 
-    currentPage() {
-        return this.getPageCount() > 0 ? this.getPage() + 1 : 0;
-    }
-
     empty() {
         let pageCount = this.getPageCount()
         return pageCount === 0;
@@ -204,7 +200,7 @@ export class Paginator extends Component {
                     rows={this.props.rows} totalRecords={this.props.totalRecords} template={template} />;
                 break;
             case 'JumpToPageInput':
-                element = <JumpToPageInput key={key} rows={this.props.rows} page={this.currentPage()} onChange={this.changePage} disabled={this.empty()} />;
+                element = <JumpToPageInput key={key} rows={this.props.rows} page={this.getPage()} pageCount={this.getPageCount()} onChange={this.changePage} disabled={this.empty()} template={template} />;
                 break;
 
             default: