cozy-viewer 13.0.2 → 13.2.0

package/CHANGELOG.md

@@ -3,6 +3,44 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [13.2.0](https://github.com/cozy/cozy-libs/compare/cozy-viewer@13.1.0...cozy-viewer@13.2.0) (2025-01-15)
+
+
+### Bug Fixes
+
+* **viewer:** Remove horizontal scroolbar ([9b0c2c3](https://github.com/cozy/cozy-libs/commit/9b0c2c33c5d0f60a195342cf84b36ca6a2398085))
+
+
+### Features
+
+* **viewer:** Add input for select current page ([7aa912e](https://github.com/cozy/cozy-libs/commit/7aa912e63df7b53341b11157ac2d9c7fe383f2fc))
+* **viewer:** Auto hide toolbar buttons ([90e656a](https://github.com/cozy/cozy-libs/commit/90e656af5627ab627d2cad2d19a14b56b99a4e76))
+* **viewer:** Increase display limit for all pages ([b4a1b4a](https://github.com/cozy/cozy-libs/commit/b4a1b4a62839a89666db3c81df7b98eec5f30afa))
+* **viewer:** Replace old Viewer buttons ([ef2fbee](https://github.com/cozy/cozy-libs/commit/ef2fbee8a49bc6bbef7f7d7ded266beaf7c2470a))
+* **viewer:** Update style of toolbar ([5f6008d](https://github.com/cozy/cozy-libs/commit/5f6008dba900fea754b45b403d39ab758553fa56))
+
+
+
+
+
+# [13.1.0](https://github.com/cozy/cozy-libs/compare/cozy-viewer@13.0.2...cozy-viewer@13.1.0) (2025-01-13)
+
+
+### Bug Fixes
+
+* **Viewer:** Now hide edit option on mobile if read only ([ce2f287](https://github.com/cozy/cozy-libs/commit/ce2f287494a943547762d5f189a74d38554d9f05))
+* **Viewer:** Now isReadOnly manage public and private share ([6e0aba3](https://github.com/cozy/cozy-libs/commit/6e0aba3abd9dee753656e9aef82ecb53931e14aa))
+* **Viewer:** Now show edit option on qualification according to share ([73034bf](https://github.com/cozy/cozy-libs/commit/73034bf13bb18ba269aa70902902f214b31d87fb))
+
+
+### Features
+
+* **Viewer:** Disable qualification modification on public ([f41540e](https://github.com/cozy/cozy-libs/commit/f41540ea791d31878dfa2325bca4cc7f867c010a))
+
+
+
+
+
 ## [13.0.2](https://github.com/cozy/cozy-libs/compare/cozy-viewer@13.0.1...cozy-viewer@13.0.2) (2025-01-13)
 
 

package/dist/Footer/BottomSheetContent.d.ts

@@ -1,12 +1,14 @@
 export default BottomSheetContent;
-declare function BottomSheetContent({ file, isPublic }: {
+declare function BottomSheetContent({ file, isPublic, isReadOnly }: {
     file: any;
     isPublic: any;
+    isReadOnly: any;
 }): JSX.Element[];
 declare namespace BottomSheetContent {
     namespace propTypes {
         const file: PropTypes.Validator<object>;
         const isPublic: PropTypes.Requireable<boolean>;
+        const isReadOnly: PropTypes.Requireable<boolean>;
     }
 }
 import PropTypes from "prop-types";

package/dist/Footer/BottomSheetContent.js

@@ -21,7 +21,8 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 var BottomSheetContent = function BottomSheetContent(_ref) {
   var file = _ref.file,
-      isPublic = _ref.isPublic;
+      isPublic = _ref.isPublic,
+      isReadOnly = _ref.isReadOnly;
   var panelBlocks = (0, _getPanelBlocks.default)({
     panelBlocksSpecs: (0, _getPanelBlocks.getPanelBlocksSpecs)(isPublic),
     file: file
@@ -33,14 +34,16 @@ var BottomSheetContent = function BottomSheetContent(_ref) {
       disableElevation: index === panelBlocks.length - 1
     }, /*#__PURE__*/_react.default.createElement(PanelBlock, {
       file: file,
-      isPublic: isPublic
+      isPublic: isPublic,
+      isReadOnly: isReadOnly
     }));
   });
 };
 
 BottomSheetContent.propTypes = {
   file: _propTypes.default.object.isRequired,
-  isPublic: _propTypes.default.bool
+  isPublic: _propTypes.default.bool,
+  isReadOnly: _propTypes.default.bool
 };
 
 var _default = exports.default = BottomSheetContent;

package/dist/Footer/FooterContent.d.ts

@@ -1,15 +1,17 @@
 export default FooterContent;
-declare function FooterContent({ file, toolbarRef, children, isPublic }: {
+declare function FooterContent({ file, toolbarRef, children, isPublic, isReadOnly }: {
     file: any;
     toolbarRef: any;
     children: any;
     isPublic: any;
+    isReadOnly: any;
 }): JSX.Element;
 declare namespace FooterContent {
     namespace propTypes {
         const file: PropTypes.Validator<object>;
         const toolbarRef: PropTypes.Requireable<object>;
         const isPublic: PropTypes.Requireable<boolean>;
+        const isReadOnly: PropTypes.Requireable<boolean>;
         const children: PropTypes.Requireable<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
     }
 }

package/dist/Footer/FooterContent.js

@@ -61,7 +61,8 @@ var FooterContent = function FooterContent(_ref2) {
   var file = _ref2.file,
       toolbarRef = _ref2.toolbarRef,
       children = _ref2.children,
-      isPublic = _ref2.isPublic;
+      isPublic = _ref2.isPublic,
+      isReadOnly = _ref2.isReadOnly;
   var styles = useStyles();
   var toolbarProps = (0, _react.useMemo)(function () {
     return {
@@ -90,7 +91,8 @@ var FooterContent = function FooterContent(_ref2) {
     FooterActionButtonsWithFile: FooterActionButtonsWithFile
   })), /*#__PURE__*/_react.default.createElement(_BottomSheetContent.default, {
     file: file,
-    isPublic: isPublic
+    isPublic: isPublic,
+    isReadOnly: isReadOnly
   }));
 };
 
@@ -98,6 +100,7 @@ FooterContent.propTypes = {
   file: _propTypes.default.object.isRequired,
   toolbarRef: _propTypes.default.object,
   isPublic: _propTypes.default.bool,
+  isReadOnly: _propTypes.default.bool,
   children: _propTypes.default.oneOfType([_propTypes.default.node, _propTypes.default.arrayOf(_propTypes.default.node)])
 };
 

package/dist/NoViewer/NoViewer.js

@@ -25,11 +25,13 @@ var styles = {
   "viewer-pdfviewer": "styles__viewer-pdfviewer___3MJPk",
   "viewer-textviewer": "styles__viewer-textviewer___1fl1c",
   "viewer-canceled": "styles__viewer-canceled___3KRBk",
+  "viewer-pdfviewer-input-page": "styles__viewer-pdfviewer-input-page___9HErK",
   "viewer-textviewer-content": "styles__viewer-textviewer-content___30dhP",
   "viewer-filename": "styles__viewer-filename___1-DIz",
   "viewer-pdfviewer-pdf": "styles__viewer-pdfviewer-pdf___3R4jL",
   "viewer-pdfviewer-page": "styles__viewer-pdfviewer-page___VvOF3",
   "viewer-pdfviewer-toolbar": "styles__viewer-pdfviewer-toolbar___2Eat3",
+  "viewer-pdfviewer-toolbar--hidden": "styles__viewer-pdfviewer-toolbar--hidden___3LBfu",
   "viewer-pdfMobile": "styles__viewer-pdfMobile___ym7we",
   "viewer-pdfMobile--image": "styles__viewer-pdfMobile--image___3_zsS"
 };

package/dist/Panel/ActionMenuWrapper.js

@@ -34,6 +34,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 var ActionMenuWrapper = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var file = _ref.file,
       optionFile = _ref.optionFile,
+      isReadOnly = _ref.isReadOnly,
       onClose = _ref.onClose;
   var name = optionFile.name,
       value = optionFile.value;
@@ -47,7 +48,7 @@ var ActionMenuWrapper = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref)
   var _useAlert = (0, _Alert.useAlert)(),
       showAlert = _useAlert.showAlert;
 
-  var isEditable = (0, _helpers.isEditableAttribute)(name, file);
+  var isEditable = (0, _helpers.isEditableAttribute)(name, file) && !isReadOnly;
   var editPath = "".concat(file.metadata.qualification.label, "/").concat(file._id, "/edit/information?metadata=").concat(optionFile.name);
 
   var handleCopy = /*#__PURE__*/function () {
@@ -134,6 +135,7 @@ ActionMenuWrapper.propTypes = {
     name: _propTypes.default.string,
     value: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number])
   }),
+  isReadOnly: _propTypes.default.bool,
   onClose: _propTypes.default.func
 };
 

package/dist/Panel/Qualification.js

@@ -59,6 +59,7 @@ var ComponentFromMetadataQualificationType = {
 
 var Qualification = function Qualification(_ref) {
   var file = _ref.file,
+      isPublic = _ref.isPublic,
       isReadOnly = _ref.isReadOnly;
   var _file$metadata = file.metadata,
       metadata = _file$metadata === void 0 ? {} : _file$metadata;
@@ -115,13 +116,13 @@ var Qualification = function Qualification(_ref) {
     file: file
   }), (0, _qualification.hasSupportedQualification)(file) ? /*#__PURE__*/_react.default.createElement(_QualificationListItemQualification.default, {
     file: file,
-    isReadOnly: isReadOnly,
+    isReadOnly: isPublic ? true : isReadOnly,
     onClick: function onClick() {
       return setShowQualifModal(true);
     }
   }) : /*#__PURE__*/_react.default.createElement(_QualificationListItemQualificationEmpty.default, {
     file: file,
-    isReadOnly: isReadOnly,
+    isReadOnly: isPublic ? true : isReadOnly,
     onClick: function onClick() {
       return setShowQualifModal(true);
     }
@@ -139,7 +140,7 @@ var Qualification = function Qualification(_ref) {
       key: idx
     }, /*#__PURE__*/_react.default.createElement(QualificationListItemComp, {
       file: file,
-      isReadOnly: isReadOnly,
+      isReadOnly: isPublic ? true : isReadOnly,
       ref: actionBtnRef.current[idx],
       formattedMetadataQualification: meta,
       toggleActionsMenu: function toggleActionsMenu(val) {
@@ -153,7 +154,8 @@ var Qualification = function Qualification(_ref) {
     onClose: hideActionsMenu,
     file: file,
     optionFile: optionFile,
-    ref: actionBtnRef.current[optionFile.id]
+    ref: actionBtnRef.current[optionFile.id],
+    isReadOnly: isPublic ? true : isReadOnly
   })));
 };
 

package/dist/Panel/QualificationListItemContact.js

@@ -128,7 +128,8 @@ var QualificationListItemContact = function QualificationListItemContact(_ref) {
     onClose: hideActionsMenu,
     file: file,
     optionFile: optionFile,
-    ref: actionBtnRef
+    ref: actionBtnRef,
+    isReadOnly: isReadOnly
   }));
 };
 

package/dist/ViewerContainer.js

@@ -29,6 +29,8 @@ var _cozyClient = require("cozy-client");
 
 var _permission = require("cozy-client/dist/models/permission");
 
+var _cozySharing = require("cozy-sharing");
+
 var _Modal = _interopRequireDefault(require("cozy-ui/transpiled/react/Modal"));
 
 var _proptypes = require("cozy-ui/transpiled/react/proptypes");
@@ -90,6 +92,10 @@ var ViewerContainer = function ViewerContainer(props) {
 
   var client = (0, _cozyClient.useClient)();
   (0, _I18n.useExtendI18n)(_locales.locales);
+
+  var _useSharingContext = (0, _cozySharing.useSharingContext)(),
+      hasWriteAccess = _useSharingContext.hasWriteAccess;
+
   var currentFile = files[currentIndex];
   var fileCount = files.length;
   var hasPrevious = currentIndex > 0;
@@ -110,17 +116,30 @@ var ViewerContainer = function ViewerContainer(props) {
         return _regenerator.default.wrap(function _callee$(_context) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
-              _context.next = 2;
+              if (!isPublic) {
+                _context.next = 6;
+                break;
+              }
+
+              _context.next = 3;
               return (0, _permission.isDocumentReadOnly)({
                 document: currentFile,
                 client: client
               });
 
-            case 2:
-              res = _context.sent;
+            case 3:
+              _context.t0 = _context.sent;
+              _context.next = 7;
+              break;
+
+            case 6:
+              _context.t0 = !hasWriteAccess(currentFile._id);
+
+            case 7:
+              res = _context.t0;
               setIsReadOnly(res);
 
-            case 4:
+            case 9:
             case "end":
               return _context.stop();
           }
@@ -133,7 +152,7 @@ var ViewerContainer = function ViewerContainer(props) {
     }();
 
     getIsReadOnly();
-  }, [client, currentFile]);
+  }, [client, currentFile, hasWriteAccess, isPublic]);
   return /*#__PURE__*/_react.default.createElement(_Alert.default, null, /*#__PURE__*/_react.default.createElement("div", {
     id: "viewer-wrapper",
     className: (0, _classnames.default)(styles['viewer-wrapper'], className)

package/dist/ViewerInformationsWrapper.js

@@ -50,7 +50,8 @@ var ViewerInformationsWrapper = function ViewerInformationsWrapper(_ref) {
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !disableFooter && /*#__PURE__*/_react.default.createElement(_Footer.default, null, /*#__PURE__*/_react.default.createElement(_FooterContent.default, {
     file: currentFile,
     toolbarRef: toolbarRef,
-    isPublic: isPublic
+    isPublic: isPublic,
+    isReadOnly: isReadOnly
   }, children)), validForPanel && /*#__PURE__*/_react.default.createElement(_InformationPanel.default, null, /*#__PURE__*/_react.default.createElement(_PanelContent.default, {
     file: currentFile,
     isPublic: isPublic,

package/dist/ViewersByFile/AudioViewer.js

@@ -25,11 +25,13 @@ var styles = {
   "viewer-pdfviewer": "styles__viewer-pdfviewer___3MJPk",
   "viewer-textviewer": "styles__viewer-textviewer___1fl1c",
   "viewer-canceled": "styles__viewer-canceled___3KRBk",
+  "viewer-pdfviewer-input-page": "styles__viewer-pdfviewer-input-page___9HErK",
   "viewer-textviewer-content": "styles__viewer-textviewer-content___30dhP",
   "viewer-filename": "styles__viewer-filename___1-DIz",
   "viewer-pdfviewer-pdf": "styles__viewer-pdfviewer-pdf___3R4jL",
   "viewer-pdfviewer-page": "styles__viewer-pdfviewer-page___VvOF3",
   "viewer-pdfviewer-toolbar": "styles__viewer-pdfviewer-toolbar___2Eat3",
+  "viewer-pdfviewer-toolbar--hidden": "styles__viewer-pdfviewer-toolbar--hidden___3LBfu",
   "viewer-pdfMobile": "styles__viewer-pdfMobile___ym7we",
   "viewer-pdfMobile--image": "styles__viewer-pdfMobile--image___3_zsS"
 };

package/dist/ViewersByFile/BlankPaperViewer.js

@@ -27,11 +27,13 @@ var styles = {
   "viewer-pdfviewer": "styles__viewer-pdfviewer___3MJPk",
   "viewer-textviewer": "styles__viewer-textviewer___1fl1c",
   "viewer-canceled": "styles__viewer-canceled___3KRBk",
+  "viewer-pdfviewer-input-page": "styles__viewer-pdfviewer-input-page___9HErK",
   "viewer-textviewer-content": "styles__viewer-textviewer-content___30dhP",
   "viewer-filename": "styles__viewer-filename___1-DIz",
   "viewer-pdfviewer-pdf": "styles__viewer-pdfviewer-pdf___3R4jL",
   "viewer-pdfviewer-page": "styles__viewer-pdfviewer-page___VvOF3",
   "viewer-pdfviewer-toolbar": "styles__viewer-pdfviewer-toolbar___2Eat3",
+  "viewer-pdfviewer-toolbar--hidden": "styles__viewer-pdfviewer-toolbar--hidden___3LBfu",
   "viewer-pdfMobile": "styles__viewer-pdfMobile___ym7we",
   "viewer-pdfMobile--image": "styles__viewer-pdfMobile--image___3_zsS"
 };

package/dist/ViewersByFile/ImageViewer.js

@@ -51,11 +51,13 @@ var styles = {
   "viewer-pdfviewer": "styles__viewer-pdfviewer___3MJPk",
   "viewer-textviewer": "styles__viewer-textviewer___1fl1c",
   "viewer-canceled": "styles__viewer-canceled___3KRBk",
+  "viewer-pdfviewer-input-page": "styles__viewer-pdfviewer-input-page___9HErK",
   "viewer-textviewer-content": "styles__viewer-textviewer-content___30dhP",
   "viewer-filename": "styles__viewer-filename___1-DIz",
   "viewer-pdfviewer-pdf": "styles__viewer-pdfviewer-pdf___3R4jL",
   "viewer-pdfviewer-page": "styles__viewer-pdfviewer-page___VvOF3",
   "viewer-pdfviewer-toolbar": "styles__viewer-pdfviewer-toolbar___2Eat3",
+  "viewer-pdfviewer-toolbar--hidden": "styles__viewer-pdfviewer-toolbar--hidden___3LBfu",
   "viewer-pdfMobile": "styles__viewer-pdfMobile___ym7we",
   "viewer-pdfMobile--image": "styles__viewer-pdfMobile--image___3_zsS"
 };

package/dist/ViewersByFile/NoNetworkViewer.js

@@ -25,11 +25,13 @@ var styles = {
   "viewer-pdfviewer": "styles__viewer-pdfviewer___3MJPk",
   "viewer-textviewer": "styles__viewer-textviewer___1fl1c",
   "viewer-canceled": "styles__viewer-canceled___3KRBk",
+  "viewer-pdfviewer-input-page": "styles__viewer-pdfviewer-input-page___9HErK",
   "viewer-textviewer-content": "styles__viewer-textviewer-content___30dhP",
   "viewer-filename": "styles__viewer-filename___1-DIz",
   "viewer-pdfviewer-pdf": "styles__viewer-pdfviewer-pdf___3R4jL",
   "viewer-pdfviewer-page": "styles__viewer-pdfviewer-page___VvOF3",
   "viewer-pdfviewer-toolbar": "styles__viewer-pdfviewer-toolbar___2Eat3",
+  "viewer-pdfviewer-toolbar--hidden": "styles__viewer-pdfviewer-toolbar--hidden___3LBfu",
   "viewer-pdfMobile": "styles__viewer-pdfMobile___ym7we",
   "viewer-pdfMobile--image": "styles__viewer-pdfMobile--image___3_zsS"
 };

package/dist/ViewersByFile/PdfJsViewer.d.ts

@@ -1,10 +1,13 @@
 export const MIN_SCALE: 0.25;
 export const MAX_SCALE: 3;
-export const MAX_PAGES: 3;
+export const MAX_PAGES: 40;
+export const MAX_SIZE_FILE: 10485760;
 export class PdfJsViewer extends React.Component<any, any, any> {
-    constructor(props: Readonly<any>);
-    constructor(props: any, context?: any);
+    constructor();
+    inputRef: React.RefObject<any>;
     resizeListener: import("lodash").DebouncedFunc<() => void> | undefined;
+    mouseMoveListener: import("lodash").DebouncedFunc<() => void> | undefined;
+    onMouseMove: () => void;
     onKeyUp: (e: any) => void;
     toggleGestures(enable: any): void;
     setWrapperSize: () => void;
@@ -16,6 +19,10 @@ export class PdfJsViewer extends React.Component<any, any, any> {
     previousPage: () => void;
     scaleUp: () => void;
     scaleDown: () => void;
+    handleInputPageChange: (evt: any) => void;
+    handleInputPageKeyDown: (evt: any) => void;
+    handleInputPageFocus: () => void;
+    handleInputPageBlur: () => void;
     wrapper: HTMLDivElement | null | undefined;
 }
 export namespace PdfJsViewer {

package/dist/ViewersByFile/PdfJsViewer.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.PdfJsViewer = exports.MIN_SCALE = exports.MAX_SCALE = exports.MAX_PAGES = void 0;
+exports.default = exports.PdfJsViewer = exports.MIN_SCALE = exports.MAX_SIZE_FILE = exports.MAX_SCALE = exports.MAX_PAGES = void 0;
 
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 
@@ -61,19 +61,32 @@ var styles = {
   "viewer-pdfviewer": "styles__viewer-pdfviewer___3MJPk",
   "viewer-textviewer": "styles__viewer-textviewer___1fl1c",
   "viewer-canceled": "styles__viewer-canceled___3KRBk",
+  "viewer-pdfviewer-input-page": "styles__viewer-pdfviewer-input-page___9HErK",
   "viewer-textviewer-content": "styles__viewer-textviewer-content___30dhP",
   "viewer-filename": "styles__viewer-filename___1-DIz",
   "viewer-pdfviewer-pdf": "styles__viewer-pdfviewer-pdf___3R4jL",
   "viewer-pdfviewer-page": "styles__viewer-pdfviewer-page___VvOF3",
   "viewer-pdfviewer-toolbar": "styles__viewer-pdfviewer-toolbar___2Eat3",
+  "viewer-pdfviewer-toolbar--hidden": "styles__viewer-pdfviewer-toolbar--hidden___3LBfu",
   "viewer-pdfMobile": "styles__viewer-pdfMobile___ym7we",
   "viewer-pdfMobile--image": "styles__viewer-pdfMobile--image___3_zsS"
 };
 var MIN_SCALE = exports.MIN_SCALE = 0.25;
 var MAX_SCALE = exports.MAX_SCALE = 3;
-var MAX_PAGES = exports.MAX_PAGES = 3;
+var MAX_PAGES = exports.MAX_PAGES = 40;
+var MAX_SIZE_FILE = exports.MAX_SIZE_FILE = 10485760; // 10MB
+
 var KEY_CODE_UP = 38;
 var KEY_CODE_DOWN = 40;
+var OPACITY_DELAY = 1000;
+var timeoutOpacity;
+
+var makeInputPageStyle = function makeInputPageStyle(nbPages) {
+  var maxWidth = Math.max(1, String(Math.abs(nbPages)).length - 1);
+  return {
+    maxWidth: "".concat(maxWidth, ".5rem")
+  };
+};
 
 var PdfJsViewer = exports.PdfJsViewer = /*#__PURE__*/function (_Component) {
   (0, _inherits2.default)(PdfJsViewer, _Component);
@@ -84,23 +97,41 @@ var PdfJsViewer = exports.PdfJsViewer = /*#__PURE__*/function (_Component) {
     var _this;
 
     (0, _classCallCheck2.default)(this, PdfJsViewer);
-
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-
-    _this = _super.call.apply(_super, [this].concat(args));
+    _this = _super.call(this);
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
       totalPages: 1,
       scale: 1,
       currentPage: 1,
+      inputPageValue: 1,
       loaded: false,
       errored: false,
       width: null,
-      renderAllPages: false
+      renderAllPages: false,
+      toolbarDisplayed: true,
+      keepToolbarDisplayed: false,
+      isInputPageFocused: false
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onMouseMove", function () {
+      if (!_this.state.toolbarDisplayed) {
+        _this.setState({
+          toolbarDisplayed: true
+        });
+      }
+
+      if (timeoutOpacity) {
+        clearTimeout(timeoutOpacity);
+      }
+
+      timeoutOpacity = setTimeout(function () {
+        _this.setState({
+          toolbarDisplayed: false
+        });
+      }, OPACITY_DELAY);
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onKeyUp", function (e) {
       if (e.keyCode === KEY_CODE_UP) _this.previousPage();else if (e.keyCode === KEY_CODE_DOWN) _this.nextPage();
+
+      _this.onMouseMove();
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "setWrapperSize", function () {
       var width = _this.wrapper ? _this.wrapper.getBoundingClientRect().width : null;
@@ -114,7 +145,7 @@ var PdfJsViewer = exports.PdfJsViewer = /*#__PURE__*/function (_Component) {
 
       _this.setState({
         totalPages: numPages,
-        renderAllPages: numPages <= MAX_PAGES,
+        renderAllPages: numPages <= MAX_PAGES && parseInt(_this.props.file.size, 10) <= MAX_SIZE_FILE,
         loaded: true
       });
     });
@@ -128,15 +159,19 @@ var PdfJsViewer = exports.PdfJsViewer = /*#__PURE__*/function (_Component) {
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "nextPage", function () {
       _this.setState(function (state) {
+        var value = Math.min(state.currentPage + 1, state.totalPages);
         return {
-          currentPage: Math.min(state.currentPage + 1, state.totalPages)
+          currentPage: value,
+          inputPageValue: value
         };
       });
     });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "previousPage", function () {
       _this.setState(function (state) {
+        var value = Math.max(state.currentPage - 1, 1);
         return {
-          currentPage: Math.max(state.currentPage - 1, 1)
+          currentPage: value,
+          inputPageValue: value
         };
       });
     });
@@ -160,6 +195,37 @@ var PdfJsViewer = exports.PdfJsViewer = /*#__PURE__*/function (_Component) {
         };
       });
     });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleInputPageChange", function (evt) {
+      var value = evt.target.value;
+
+      if (value === '' || value <= _this.state.totalPages && value > 0) {
+        _this.setState({
+          inputPageValue: value
+        });
+      }
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleInputPageKeyDown", function (evt) {
+      if (evt.keyCode === 13) {
+        _this.inputRef.current.blur();
+      }
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleInputPageFocus", function () {
+      _this.setState({
+        isInputPageFocused: true,
+        keepToolbarDisplayed: true
+      });
+    });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "handleInputPageBlur", function () {
+      _this.setState(function (state) {
+        return {
+          keepToolbarDisplayed: false,
+          isInputPageFocused: false,
+          inputPageValue: state.inputPageValue ? state.inputPageValue : state.currentPage,
+          currentPage: state.inputPageValue ? parseInt(state.inputPageValue, 10) : state.currentPage
+        };
+      });
+    });
+    _this.inputRef = /*#__PURE__*/_react.default.createRef();
     return _this;
   }
 
@@ -168,14 +234,21 @@ var PdfJsViewer = exports.PdfJsViewer = /*#__PURE__*/function (_Component) {
     value: function componentDidMount() {
       this.setWrapperSize();
       this.resizeListener = (0, _throttle.default)(this.setWrapperSize, 500);
+      this.mouseMoveListener = (0, _throttle.default)(this.onMouseMove, OPACITY_DELAY / 2);
       window.addEventListener('resize', this.resizeListener);
+      document.addEventListener('mousemove', this.mouseMoveListener);
       document.addEventListener('keyup', this.onKeyUp, false);
     }
   }, {
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
       window.removeEventListener('resize', this.resizeListener);
+      document.removeEventListener('mousemove', this.mouseMoveListener);
       document.removeEventListener('keyup', this.onKeyUp, false);
+
+      if (timeoutOpacity) {
+        clearTimeout(timeoutOpacity);
+      }
     }
   }, {
     key: "toggleGestures",
@@ -203,15 +276,20 @@ var PdfJsViewer = exports.PdfJsViewer = /*#__PURE__*/function (_Component) {
           errored = _this$state.errored,
           totalPages = _this$state.totalPages,
           currentPage = _this$state.currentPage,
+          inputPageValue = _this$state.inputPageValue,
           scale = _this$state.scale,
           width = _this$state.width,
-          renderAllPages = _this$state.renderAllPages;
+          renderAllPages = _this$state.renderAllPages,
+          toolbarDisplayed = _this$state.toolbarDisplayed,
+          keepToolbarDisplayed = _this$state.keepToolbarDisplayed,
+          isInputPageFocused = _this$state.isInputPageFocused;
       if (errored) return /*#__PURE__*/_react.default.createElement(_NoViewer.default, {
         file: file,
         renderFallbackExtraContent: renderFallbackExtraContent
       });
-      var pageWidth = width ? width * scale : null; // newer versions of react-pdf do that automatically
+      var pageWidth = width && totalPages > 1 ? width - 15 : width; // Remove the scrollbar width to avoid a horizontal scrollbar
 
+      var pageInputValue = inputPageValue || inputPageValue === '' ? inputPageValue : currentPage.toString();
       return /*#__PURE__*/_react.default.createElement("div", {
         className: styles['viewer-pdfviewer'],
         ref: function ref(_ref2) {
@@ -229,16 +307,28 @@ var PdfJsViewer = exports.PdfJsViewer = /*#__PURE__*/function (_Component) {
           key: page,
           pageNumber: page + 1,
           width: pageWidth,
+          scale: scale,
           renderAnnotations: false,
           className: (0, _classnames.default)('u-mv-1', styles['viewer-pdfviewer-page'])
         });
       }) : /*#__PURE__*/_react.default.createElement(_reactPdf.Page, {
         pageNumber: currentPage,
         width: pageWidth,
+        scale: scale,
         renderAnnotations: false,
         className: styles['viewer-pdfviewer-page']
       })), loaded && /*#__PURE__*/_react.default.createElement("div", {
-        className: (0, _classnames.default)(styles['viewer-pdfviewer-toolbar'], 'u-p-half')
+        className: (0, _classnames.default)(styles['viewer-pdfviewer-toolbar'], 'u-p-half', (0, _defineProperty2.default)({}, styles['viewer-pdfviewer-toolbar--hidden'], !toolbarDisplayed && !keepToolbarDisplayed)),
+        onMouseEnter: function onMouseEnter() {
+          return !isInputPageFocused && _this2.setState({
+            keepToolbarDisplayed: true
+          });
+        },
+        onMouseLeave: function onMouseLeave() {
+          return !isInputPageFocused && _this2.setState({
+            keepToolbarDisplayed: false
+          });
+        }
       }, !renderAllPages && /*#__PURE__*/_react.default.createElement("span", {
         className: "u-mh-half"
       }, /*#__PURE__*/_react.default.createElement(_PdfToolbarButton.default, {
@@ -246,7 +336,21 @@ var PdfJsViewer = exports.PdfJsViewer = /*#__PURE__*/function (_Component) {
         onClick: this.previousPage,
         disabled: currentPage === 1,
         label: t('Viewer.previous')
-      }), currentPage, "/", totalPages, /*#__PURE__*/_react.default.createElement(_PdfToolbarButton.default, {
+      }), /*#__PURE__*/_react.default.createElement("label", {
+        htmlFor: "input-page"
+      }, /*#__PURE__*/_react.default.createElement("input", {
+        ref: this.inputRef,
+        id: "input-page",
+        className: styles['viewer-pdfviewer-input-page'],
+        type: "text",
+        inputMode: "numeric",
+        style: makeInputPageStyle(totalPages),
+        value: pageInputValue,
+        onChange: this.handleInputPageChange,
+        onKeyDown: this.handleInputPageKeyDown,
+        onFocus: this.handleInputPageFocus,
+        onBlur: this.handleInputPageBlur
+      }), "/", totalPages), /*#__PURE__*/_react.default.createElement(_PdfToolbarButton.default, {
         icon: "bottom",
         onClick: this.nextPage,
         disabled: currentPage === totalPages,