iglooform 3.6.0 → 3.6.1

package/es/media/preview.js

@@ -79,6 +79,10 @@ var PdfViewer = function PdfViewer(_ref) {
     _useState8 = _slicedToArray(_useState7, 2),
     needPassword = _useState8[0],
     setNeedPassword = _useState8[1];
+  var _useState9 = useState(undefined),
+    _useState10 = _slicedToArray(_useState9, 2),
+    pdfOriginalWidth = _useState10[0],
+    setPdfOriginalWidth = _useState10[1];
   var _useBreakpoint = useBreakpoint(),
     md = _useBreakpoint.md;
   var _useReducer = useReducer(function (a) {
@@ -102,6 +106,22 @@ var PdfViewer = function PdfViewer(_ref) {
       setPageSize(numPages);
     }
   };
+  var handlePageLoadSuccess = function handlePageLoadSuccess(pageData) {
+    if (autoWidth && !pdfOriginalWidth) {
+      var originalWidth = pageData.originalWidth;
+      if (originalWidth) {
+        setPdfOriginalWidth(originalWidth);
+      }
+    }
+  };
+  var getOptimalPdfWidth = function getOptimalPdfWidth() {
+    var scale = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
+    if (!autoWidth || !containerWidth) return undefined;
+    if (pdfOriginalWidth) {
+      return Math.min(containerWidth, pdfOriginalWidth);
+    }
+    return containerWidth * scale;
+  };
   var handleCancelLoad = function handleCancelLoad() {
     var current = documentRef === null || documentRef === void 0 ? void 0 : documentRef.current;
     if (current) {
@@ -168,6 +188,7 @@ var PdfViewer = function PdfViewer(_ref) {
       style: {
         display: 'flex',
         flexDirection: 'column',
+        alignItems: 'center',
         maxWidth: "calc(100vw - ".concat(md ? 64 : 32, "px)"),
         width: autoWidth ? '100%' : undefined,
         maxHeight: '100%',
@@ -185,8 +206,9 @@ var PdfViewer = function PdfViewer(_ref) {
         }).map(function (_, index) {
           return /*#__PURE__*/_jsx(Page, {
             pageNumber: index + 1,
-            width: autoWidth ? containerWidth : undefined,
-            scale: !autoWidth ? scale : undefined
+            width: autoWidth ? getOptimalPdfWidth(1) : undefined,
+            scale: !autoWidth ? scale : undefined,
+            onLoadSuccess: index === 0 ? handlePageLoadSuccess : undefined
           }, index);
         })
       })
@@ -197,6 +219,7 @@ var PdfViewer = function PdfViewer(_ref) {
       ref: autoWidth ? containerRef : undefined,
       style: {
         maxWidth: "calc(100vw - ".concat(md ? 64 : 32, "px)"),
+        width: autoWidth ? '100%' : undefined,
         maxHeight: '100%',
         transform: "translate(".concat(left, "px, ").concat(top, "px)"),
         position: 'absolute',
@@ -209,8 +232,9 @@ var PdfViewer = function PdfViewer(_ref) {
         onPassword: onPassword,
         children: /*#__PURE__*/_jsx(Page, {
           pageNumber: page,
-          width: autoWidth && containerWidth ? containerWidth * scale : undefined,
-          scale: !autoWidth ? scale : undefined
+          width: autoWidth ? getOptimalPdfWidth(scale) : undefined,
+          scale: !autoWidth ? scale : undefined,
+          onLoadSuccess: handlePageLoadSuccess
         })
       })
     }, index), isCurrent && Boolean(pageSize > 1) && /*#__PURE__*/_jsxs("div", {
@@ -313,31 +337,31 @@ var Media = function Media(_ref4) {
     showAllPages = _ref4$showAllPages === void 0 ? true : _ref4$showAllPages,
     _ref4$autoWidth = _ref4.autoWidth,
     autoWidth = _ref4$autoWidth === void 0 ? false : _ref4$autoWidth;
-  var _useState9 = useState(false),
-    _useState10 = _slicedToArray(_useState9, 2),
-    isDrag = _useState10[0],
-    setIsDrag = _useState10[1];
-  var _useState11 = useState({
-      startX: 0,
-      startY: 0
-    }),
+  var _useState11 = useState(false),
     _useState12 = _slicedToArray(_useState11, 2),
-    startPos = _useState12[0],
-    setStartPos = _useState12[1];
+    isDrag = _useState12[0],
+    setIsDrag = _useState12[1];
   var _useState13 = useState({
-      top: 0,
-      left: 0
+      startX: 0,
+      startY: 0
     }),
     _useState14 = _slicedToArray(_useState13, 2),
-    offset = _useState14[0],
-    setOffset = _useState14[1];
+    startPos = _useState14[0],
+    setStartPos = _useState14[1];
   var _useState15 = useState({
       top: 0,
       left: 0
     }),
     _useState16 = _slicedToArray(_useState15, 2),
-    lastOffset = _useState16[0],
-    setLastOffset = _useState16[1];
+    offset = _useState16[0],
+    setOffset = _useState16[1];
+  var _useState17 = useState({
+      top: 0,
+      left: 0
+    }),
+    _useState18 = _slicedToArray(_useState17, 2),
+    lastOffset = _useState18[0],
+    setLastOffset = _useState18[1];
   var handleMouseUp = function handleMouseUp(e) {
     e.preventDefault();
     var button = e.button;

package/lib/media/preview.js

@@ -85,6 +85,10 @@ var PdfViewer = function PdfViewer(_ref) {
     _useState8 = _slicedToArray(_useState7, 2),
     needPassword = _useState8[0],
     setNeedPassword = _useState8[1];
+  var _useState9 = (0, _react.useState)(undefined),
+    _useState10 = _slicedToArray(_useState9, 2),
+    pdfOriginalWidth = _useState10[0],
+    setPdfOriginalWidth = _useState10[1];
   var _useBreakpoint = useBreakpoint(),
     md = _useBreakpoint.md;
   var _useReducer = (0, _react.useReducer)(function (a) {
@@ -108,6 +112,22 @@ var PdfViewer = function PdfViewer(_ref) {
       setPageSize(numPages);
     }
   };
+  var handlePageLoadSuccess = function handlePageLoadSuccess(pageData) {
+    if (autoWidth && !pdfOriginalWidth) {
+      var originalWidth = pageData.originalWidth;
+      if (originalWidth) {
+        setPdfOriginalWidth(originalWidth);
+      }
+    }
+  };
+  var getOptimalPdfWidth = function getOptimalPdfWidth() {
+    var scale = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
+    if (!autoWidth || !containerWidth) return undefined;
+    if (pdfOriginalWidth) {
+      return Math.min(containerWidth, pdfOriginalWidth);
+    }
+    return containerWidth * scale;
+  };
   var handleCancelLoad = function handleCancelLoad() {
     var current = documentRef === null || documentRef === void 0 ? void 0 : documentRef.current;
     if (current) {
@@ -174,6 +194,7 @@ var PdfViewer = function PdfViewer(_ref) {
       style: {
         display: 'flex',
         flexDirection: 'column',
+        alignItems: 'center',
         maxWidth: "calc(100vw - ".concat(md ? 64 : 32, "px)"),
         width: autoWidth ? '100%' : undefined,
         maxHeight: '100%',
@@ -191,8 +212,9 @@ var PdfViewer = function PdfViewer(_ref) {
         }).map(function (_, index) {
           return /*#__PURE__*/(0, _jsxRuntime.jsx)(_entry.Page, {
             pageNumber: index + 1,
-            width: autoWidth ? containerWidth : undefined,
-            scale: !autoWidth ? scale : undefined
+            width: autoWidth ? getOptimalPdfWidth(1) : undefined,
+            scale: !autoWidth ? scale : undefined,
+            onLoadSuccess: index === 0 ? handlePageLoadSuccess : undefined
           }, index);
         })
       })
@@ -203,6 +225,7 @@ var PdfViewer = function PdfViewer(_ref) {
       ref: autoWidth ? containerRef : undefined,
       style: {
         maxWidth: "calc(100vw - ".concat(md ? 64 : 32, "px)"),
+        width: autoWidth ? '100%' : undefined,
         maxHeight: '100%',
         transform: "translate(".concat(left, "px, ").concat(top, "px)"),
         position: 'absolute',
@@ -215,8 +238,9 @@ var PdfViewer = function PdfViewer(_ref) {
         onPassword: onPassword,
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_entry.Page, {
           pageNumber: page,
-          width: autoWidth && containerWidth ? containerWidth * scale : undefined,
-          scale: !autoWidth ? scale : undefined
+          width: autoWidth ? getOptimalPdfWidth(scale) : undefined,
+          scale: !autoWidth ? scale : undefined,
+          onLoadSuccess: handlePageLoadSuccess
         })
       })
     }, index), isCurrent && Boolean(pageSize > 1) && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
@@ -319,31 +343,31 @@ var Media = function Media(_ref4) {
     showAllPages = _ref4$showAllPages === void 0 ? true : _ref4$showAllPages,
     _ref4$autoWidth = _ref4.autoWidth,
     autoWidth = _ref4$autoWidth === void 0 ? false : _ref4$autoWidth;
-  var _useState9 = (0, _react.useState)(false),
-    _useState10 = _slicedToArray(_useState9, 2),
-    isDrag = _useState10[0],
-    setIsDrag = _useState10[1];
-  var _useState11 = (0, _react.useState)({
-      startX: 0,
-      startY: 0
-    }),
+  var _useState11 = (0, _react.useState)(false),
     _useState12 = _slicedToArray(_useState11, 2),
-    startPos = _useState12[0],
-    setStartPos = _useState12[1];
+    isDrag = _useState12[0],
+    setIsDrag = _useState12[1];
   var _useState13 = (0, _react.useState)({
-      top: 0,
-      left: 0
+      startX: 0,
+      startY: 0
     }),
     _useState14 = _slicedToArray(_useState13, 2),
-    offset = _useState14[0],
-    setOffset = _useState14[1];
+    startPos = _useState14[0],
+    setStartPos = _useState14[1];
   var _useState15 = (0, _react.useState)({
       top: 0,
       left: 0
     }),
     _useState16 = _slicedToArray(_useState15, 2),
-    lastOffset = _useState16[0],
-    setLastOffset = _useState16[1];
+    offset = _useState16[0],
+    setOffset = _useState16[1];
+  var _useState17 = (0, _react.useState)({
+      top: 0,
+      left: 0
+    }),
+    _useState18 = _slicedToArray(_useState17, 2),
+    lastOffset = _useState18[0],
+    setLastOffset = _useState18[1];
   var handleMouseUp = function handleMouseUp(e) {
     e.preventDefault();
     var button = e.button;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "iglooform",
-  "version": "3.6.0",
+  "version": "3.6.1",
   "scripts": {
     "start": "dumi dev",
     "build-dev": "dumi build",