@qsxy/element-plus-react 1.0.0-next.16 → 1.0.0-next.18

package/dist/CheckboxGroup/CheckboxGroup.js

@@ -68,6 +68,7 @@ var CheckboxGroup = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props,
         if (itemChecked) {
           nextValue.push(itemValue);
         } else {
+          // @ts-ignore
           remove(nextValue, function (i) {
             return shallowEqual(i, itemValue);
           });

package/dist/ConfigProvider/ConfigProvider.d.ts

@@ -16,6 +16,8 @@ export interface ConfigProviderProps {
     popper?: {
         appendTo?: HTMLElement;
     };
+    locale?: 'en' | 'zh-CN';
 }
 declare const ConfigProvider: import("react").Context<ConfigProviderProps>;
+export declare const useConfigProvider: () => ConfigProviderProps;
 export default ConfigProvider;

package/dist/ConfigProvider/ConfigProvider.js

@@ -1,10 +1,14 @@
-import { createContext } from 'react';
+import { createContext, useContext } from 'react';
 var ConfigProvider = /*#__PURE__*/createContext({
   // message: { max: Infinity },
   inputNumber: {
     controlsPositionRight: false
   },
+  locale: 'en',
   popper: {}
 });
+export var useConfigProvider = function useConfigProvider() {
+  return useContext(ConfigProvider);
+};
 ConfigProvider.displayName = 'ConfigProvider';
 export default ConfigProvider;

package/dist/ConfigProvider/index.d.ts

@@ -1,2 +1,2 @@
-export { default as ConfigProvider } from './ConfigProvider';
+export { default as ConfigProvider, useConfigProvider } from './ConfigProvider';
 export type { ConfigProviderProps } from './ConfigProvider';

package/dist/ConfigProvider/index.js

@@ -1 +1 @@
-export { default as ConfigProvider } from "./ConfigProvider";
+export { default as ConfigProvider, useConfigProvider } from "./ConfigProvider";

package/dist/DateTimePicker/DateTimePicker.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { DateTimePickerRef } from './typings';
-declare const DateTimePicker: React.MemoExoticComponent<React.ForwardRefExoticComponent<Omit<import("..").DatePickerProps, "type" | "name"> & {
+declare const DateTimePicker: React.MemoExoticComponent<React.ForwardRefExoticComponent<Omit<import("..").DatePickerProps, "name" | "type"> & {
     name?: string;
     onClear?: (event?: any) => void;
     defaultTime?: Date;

package/dist/Dialog/Dialog.js

@@ -41,6 +41,7 @@ function InternalElDialog(props, ref) {
     alignCenter = props.alignCenter,
     draggable = props.draggable,
     fullscreen = props.fullscreen,
+    headerClass = props.headerClass,
     top = props.top,
     close = props.close,
     beforeClose = props.beforeClose,
@@ -245,7 +246,8 @@ function InternalElDialog(props, ref) {
     ref: headerRef,
     classPrefix: classPrefix,
     showClose: showClose,
-    border: border
+    border: border,
+    headerClass: headerClass
   }, title), children)))), document.body));
 }
 var Comp = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(InternalElDialog));

package/dist/Empty/Empty.js

@@ -33,5 +33,5 @@ var Empty = function Empty(props) {
     className: e(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["bottom"])))
   }, props.children) : null);
 };
-Empty.displayName = 'Empty';
+Empty.displayName = 'ElEmpty';
 export default Empty;

package/dist/Empty/ImgEmpty.js

@@ -16,10 +16,10 @@ var ImgEmpty = function ImgEmpty() {
     x2: "61.1496914%",
     y2: "100%"
   }, /*#__PURE__*/React.createElement("stop", {
-    "stop-color": "var(--el-empty-fill-color-1)",
+    stopColor: "var(--el-empty-fill-color-1)",
     offset: "0%"
   }), /*#__PURE__*/React.createElement("stop", {
-    "stop-color": "var(--el-empty-fill-color-4)",
+    stopColor: "var(--el-empty-fill-color-4)",
     offset: "100%"
   })), /*#__PURE__*/React.createElement("linearGradient", {
     id: ids[1],
@@ -28,10 +28,10 @@ var ImgEmpty = function ImgEmpty() {
     x2: "100%",
     y2: "90.5%"
   }, /*#__PURE__*/React.createElement("stop", {
-    "stop-color": "var(--el-empty-fill-color-1)",
+    stopColor: "var(--el-empty-fill-color-1)",
     offset: "0%"
   }), /*#__PURE__*/React.createElement("stop", {
-    "stop-color": "var(--el-empty-fill-color-6)",
+    stopColor: "var(--el-empty-fill-color-6)",
     offset: "100%"
   })), /*#__PURE__*/React.createElement("rect", {
     id: "path-3-1",
@@ -42,7 +42,7 @@ var ImgEmpty = function ImgEmpty() {
   })), /*#__PURE__*/React.createElement("g", {
     id: "Illustrations",
     stroke: "none",
-    "stroke-width": "1",
+    strokeWidth: "1",
     fill: "none",
     fillRule: "evenodd"
   }, /*#__PURE__*/React.createElement("g", {

package/dist/Form/Form.d.ts

@@ -1,16 +1,21 @@
-import { FC } from 'react';
+import React, { ForwardedRef } from 'react';
 import { FormProvider } from './FormContext';
 import Field from './FormItem';
 import List from './List';
-import { FormProps } from './typings';
+import { FormInstance, FormProps, Store } from './typings';
 import useForm from './useForm';
 import useWatch from './useWatch';
-interface FormComponent extends FC<FormProps> {
+declare const ForwardForm: <RecordType = Store>(props: FormProps<RecordType> & {
+    ref?: ForwardedRef<FormInstance<RecordType>>;
+}) => React.ReactElement;
+type InternalFormType = typeof ForwardForm;
+interface FormInterface extends InternalFormType {
+    displayName?: string;
     FormProvider: typeof FormProvider;
     Item: typeof Field;
     List: typeof List;
     useForm: typeof useForm;
     useWatch: typeof useWatch;
 }
-declare const Form: FormComponent;
+declare const Form: FormInterface;
 export default Form;

package/dist/Form/Form.js

@@ -1,7 +1,6 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var _templateObject;
 var _excluded = ["colon", "inline", "labelPosition", "cols", "flat", "formStyle", "name", "initialValues", "fields", "component", "preserve", "children", "validateMessages", "validateTrigger", "onValuesChange", "onFieldsChange", "onFinish", "onFinishFailed", "className", "disabled", "labelWidth", "size", "rules", "hideRequiredAsterisk", "requireAsteriskPosition", "showMessage", "scrollToError"];
-var _this = this,
-  _templateObject;
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -29,7 +28,8 @@ import List from "./List";
 import useForm from "./useForm";
 import useWatch from "./useWatch";
 import { isSimilar } from "./utils/valueUtil";
-var Form = /*#__PURE__*/forwardRef(function (props, ref) {
+function InternalForm(props, ref) {
+  var _this = this;
   props = mergeDefaultProps({
     inline: false,
     cols: 0,
@@ -189,7 +189,9 @@ var Form = /*#__PURE__*/forwardRef(function (props, ref) {
       restProps === null || restProps === void 0 || (_restProps$onReset = restProps.onReset) === null || _restProps$onReset === void 0 || _restProps$onReset.call(_this, event);
     }
   }), wrapperNode);
-});
+}
+var ForwardForm = /*#__PURE__*/forwardRef(InternalForm);
+var Form = ForwardForm;
 Form.FormProvider = FormProvider;
 Form.Item = Field;
 Form.List = List;

package/dist/Form/typings.d.ts

@@ -5,7 +5,7 @@ import { InternalFieldProps } from './FormItem';
 type BaseFormProps = Omit<React.AllHTMLAttributes<HTMLFormElement>, 'onSubmit' | 'form' | 'size' | 'children'>;
 type RenderProps = (values: Store, form: FormInstance) => React.ReactElement;
 export type FormRules = Record<string, Rule[] | Record<string, Rule[]>>;
-export interface FormProps<Values = any> extends BaseFormProps {
+export interface FormProps<Values = Store> extends BaseFormProps {
     /** 经 Form.useForm() 创建的 form 控制实例，不提供时会自动创建 */
     form?: FormInstance<Values>;
     children?: RenderProps | ComponentChildren;
@@ -25,7 +25,7 @@ export interface FormProps<Values = any> extends BaseFormProps {
     /** 配置 Form.Item 的 colon 的默认值。表示是否显示 label 后面的冒号 */
     colon?: boolean;
     /** 表单默认值，只有初始化以及重置时生效 */
-    initialValues?: Store;
+    initialValues?: Values;
     /** 表单域标签的位置， 如果值为 left 或者 right 时，则需要设置 label-width */
     labelPosition?: 'left' | 'right' | 'top';
     /** 表单域标签的宽度，例如 '50px'。 作为 Form 直接子元素的 form-item 会继承该值。 支持 auto。 */

package/dist/MessageBox/MessageBox.js

@@ -208,6 +208,7 @@ var MessageBox = /*#__PURE__*/memo( /*#__PURE__*/forwardRef(function (props, ref
       get ref() {
         return containerRef;
       },
+      inputValue: inputValue,
       close: done,
       setConfirmButtonLoading: setConfirmButtonLoading,
       setConfirmButtonText: setConfirmButtonText

package/dist/MessageBox/typings.d.ts

@@ -104,6 +104,7 @@ export interface MessageBoxMethod {
 }
 export interface MessageBoxRef {
     ref: RefObject<HTMLDivElement>;
+    inputValue?: string;
     /** 关闭方法 */
     close: () => void;
     /** 设置确认按钮是否加载状态 */

package/dist/Pagination/Options.d.ts

@@ -1,16 +1,21 @@
 import React, { FC } from 'react';
+import { TypeAttributes } from '../types/common';
 interface Props {
     goButton?: React.ReactElement | boolean;
     quickGo?: (val: number) => void;
     rootPrefixCls?: string;
     pageSize: number;
-    pageSizeOptions?: Array<string>;
+    /** 默认的每页条数 */
+    defaultPageSize?: number;
+    pageSizeOptions?: Array<number>;
     selectComponentClass?: string;
     selectPrefixCls?: string;
     disabled?: boolean;
+    simple?: boolean;
     current?: number;
     changeSize: ((page: number) => void) | null;
-    mini?: boolean;
+    size?: TypeAttributes.Size;
+    type: 'sizes' | 'jumper';
 }
 declare const Options: FC<Props>;
 export default Options;

package/dist/Pagination/Options.js

@@ -1,4 +1,4 @@
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -6,7 +6,11 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-import React, { useCallback, useMemo, useState } from 'react';
+import classNames from 'classnames';
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { ElInput } from '..';
+import { useConfigProvider } from "../ConfigProvider";
 import ElOption from "../Select/Option";
 import Select from "../Select/Select";
 import { useClassNames } from "../hooks";
@@ -14,42 +18,50 @@ var Options = function Options(props) {
   var rootPrefixCls = props.rootPrefixCls,
     changeSize = props.changeSize,
     quickGo = props.quickGo,
+    current = props.current,
     goButton = props.goButton,
     disabled = props.disabled,
-    _props$pageSizeOption = props.pageSizeOptions,
-    _pageSizeOptions = _props$pageSizeOption === void 0 ? ['10', '20', '50', '100'] : _props$pageSizeOption,
+    simple = props.simple,
+    _pageSizeOptions = props.pageSizeOptions,
     pageSize = props.pageSize,
-    mini = props.mini;
+    defaultPageSize = props.defaultPageSize,
+    type = props.type,
+    size = props.size;
   var _useState = useState(''),
     _useState2 = _slicedToArray(_useState, 2),
     goInputText = _useState2[0],
     setGoInputText = _useState2[1];
-  var _useClassNames = useClassNames("".concat(rootPrefixCls, "-options")),
-    b = _useClassNames.b;
+  var _useClassNames = useClassNames(rootPrefixCls),
+    b = _useClassNames.b,
+    e = _useClassNames.e,
+    is = _useClassNames.is;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var _useConfigProvider = useConfigProvider(),
+    locale = _useConfigProvider.locale;
   var getValidValue = useMemo(function () {
     return !goInputText || typeof goInputText === 'number' ? undefined : Number(goInputText);
   }, [goInputText]);
-  var go = useCallback(function (e) {
+  var go = useCallback(function (event) {
     if (goInputText === '') {
       return;
     }
-    if (e.key === 'Enter' || e.type === 'click') {
-      setGoInputText('');
+    if (event.key === 'Enter' || event.type === 'click') {
       getValidValue && (quickGo === null || quickGo === void 0 ? void 0 : quickGo(getValidValue));
     }
   }, [getValidValue, goInputText, quickGo]);
   var handleChangeSize = useCallback(function (value) {
     changeSize === null || changeSize === void 0 || changeSize(Number(value));
   }, [changeSize]);
-  var handleChange = useCallback(function (e) {
-    setGoInputText(e.target.value);
+  var handleChange = useCallback(function (value) {
+    setGoInputText(value);
   }, []);
-  var handleBlur = useCallback(function (e) {
+  var handleBlur = useCallback(function (event) {
     if (goButton || goInputText === '') {
       return;
     }
     setGoInputText('');
-    if (e.relatedTarget && (e.relatedTarget.className.indexOf(b(_templateObject || (_templateObject = _taggedTemplateLiteral(["item-link"])))) >= 0 || e.relatedTarget.className.indexOf(b(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["item"])))) >= 0)) {
+    if (event.relatedTarget && (event.relatedTarget.className.indexOf(b(_templateObject || (_templateObject = _taggedTemplateLiteral(["item-link"])))) >= 0 || event.relatedTarget.className.indexOf(b(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["item"])))) >= 0)) {
       return;
     }
     getValidValue && (quickGo === null || quickGo === void 0 ? void 0 : quickGo(getValidValue));
@@ -60,7 +72,7 @@ var Options = function Options(props) {
     })) {
       return _pageSizeOptions;
     }
-    return _pageSizeOptions.concat([pageSize.toString()]).sort(function (x, y) {
+    return _pageSizeOptions.concat([pageSize]).sort(function (x, y) {
       var numberA = isNaN(Number(x)) ? 0 : Number(x);
       var numberB = isNaN(Number(y)) ? 0 : Number(y);
       return numberA - numberB;
@@ -72,52 +84,55 @@ var Options = function Options(props) {
       filterable: false,
       className: b(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["size-changer"]))),
       clearable: false,
-      size: mini ? 'small' : null,
-      value: (pageSize.toString() || _pageSizeOptions[0]).toString()
-      // @ts-ignore
-      ,
+      size: size,
+      value: pageSize,
+      defaultValue: defaultPageSize || _pageSizeOptions[0],
       onChange: handleChangeSize
     }, pageSizeOptions.map(function (opt, i) {
       return /*#__PURE__*/React.createElement(ElOption, {
         key: i,
         value: opt,
-        label: "".concat(opt, " \u6761/\u9875")
+        label: "".concat(opt, " ").concat(t('el.pagination.pagesize', {
+          lng: locale
+        }))
       });
     }));
-  }, [changeSize, disabled, b, mini, pageSize, _pageSizeOptions, handleChangeSize, pageSizeOptions]);
+  }, [changeSize, disabled, b, size, pageSize, defaultPageSize, _pageSizeOptions, handleChangeSize, pageSizeOptions, t, locale]);
+  useEffect(function () {
+    return setGoInputText(current + '');
+  }, [current]);
   var goInput = useMemo(function () {
-    if (quickGo) {
-      var gotoButton;
-      if (goButton) {
-        gotoButton = typeof goButton === 'boolean' ? /*#__PURE__*/React.createElement("button", {
-          type: "button",
-          onClick: go,
-          onKeyUp: go,
-          disabled: disabled,
-          className: b(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["quick-jumper-button"])))
-        }, "\u786E\u5B9A") : /*#__PURE__*/React.createElement("span", {
-          onClick: go,
-          onKeyUp: go
-        }, goButton);
-      }
-      return /*#__PURE__*/React.createElement("div", {
-        className: b(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["quick-jumper"])))
-      }, "\u8DF3\u81F3", /*#__PURE__*/React.createElement("input", {
-        disabled: disabled,
-        type: "text",
-        value: goInputText,
-        onChange: handleChange,
-        onKeyUp: go,
-        onBlur: handleBlur
-      }), "\u9875", gotoButton);
-    }
-    return null;
-  }, [b, disabled, go, goButton, goInputText, handleBlur, handleChange, quickGo]);
-  if (!changeSize && !quickGo) {
-    return null;
+    return /*#__PURE__*/React.createElement(React.Fragment, null, simple ? null : /*#__PURE__*/React.createElement("span", {
+      className: e(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["goto"])))
+    }, t('el.pagination.goto', {
+      lng: locale
+    })), /*#__PURE__*/React.createElement(ElInput, {
+      className: e(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["editor"]))),
+      disabled: disabled,
+      value: goInputText,
+      size: size,
+      onChange: handleChange,
+      onKeyUp: go,
+      placeholder: "",
+      clearable: false
+    }), simple ? null : /*#__PURE__*/React.createElement("span", {
+      className: e(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["classifier"])))
+    }, t('el.pagination.pageClassifier', {
+      lng: locale
+    })));
+  }, [disabled, e, go, goInputText, handleChange, locale, simple, size, t]);
+  if (type === 'sizes') {
+    return /*#__PURE__*/React.createElement("span", {
+      className: classNames(e(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["sizes"]))), b(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["item"]))))
+    }, changeSelect);
+  }
+  if (type === 'jumper') {
+    return /*#__PURE__*/React.createElement("span", {
+      className: classNames(e(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["jump"]))), b(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["item"]))), is({
+        simple: simple
+      }))
+    }, goInput);
   }
-  return /*#__PURE__*/React.createElement("li", {
-    className: b()
-  }, changeSelect, goInput);
+  return null;
 };
 export default Options;

package/dist/Pagination/Pager.js

@@ -1,5 +1,5 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-var _templateObject, _templateObject2, _templateObject3;
+var _templateObject;
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
@@ -11,22 +11,22 @@ var Pager = function Pager(props) {
   var _props$classPrefix = props.classPrefix,
     classPrefix = _props$classPrefix === void 0 ? 'pagination-item' : _props$classPrefix,
     page = props.page,
-    showTitle = props.showTitle,
     active = props.active,
-    onClick = props.onClick,
-    itemRender = props.itemRender;
+    disabled = props.disabled,
+    onClick = props.onClick;
   var _useClassNames = useClassNames(classPrefix),
-    b = _useClassNames.b;
+    b = _useClassNames.b,
+    is = _useClassNames.is;
   var handleClick = function handleClick() {
     onClick === null || onClick === void 0 || onClick(page);
   };
   return /*#__PURE__*/React.createElement("li", {
-    title: showTitle ? page + '' : undefined,
-    className: classNames(b(), b(_templateObject || (_templateObject = _taggedTemplateLiteral(["", ""])), page), _defineProperty(_defineProperty({}, b(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["active"]))), active), b(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["disabled"]))), !page), props.className),
+    className: classNames('number', is({
+      active: active,
+      disabled: disabled
+    }), _defineProperty({}, b(_templateObject || (_templateObject = _taggedTemplateLiteral(["disabled"]))), !page), props.className),
     onClick: handleClick,
     tabIndex: 0
-  }, itemRender === null || itemRender === void 0 ? void 0 : itemRender(page, 'page', /*#__PURE__*/React.createElement("a", {
-    rel: "nofollow"
-  }, page)));
+  }, page);
 };
 export default Pager;