@react-pdf-viewer/zoom - npm Package Compare versions

Comparing version 3.11.0 to 3.12.0

lib/cjs/zoom.js

@@ -79,2 +79,49 @@ 'use strict';
 
+var WHEEL_EVENT_OPTIONS = {
+    passive: false,
+};
+var svgElement = null;
+var createSvgElement = function () {
+    return svgElement || (svgElement = document.createElementNS('http://www.w3.org/2000/svg', 'svg'));
+};
+var PinchZoom = function (_a) {
+    var pagesContainerRef = _a.pagesContainerRef, store = _a.store;
+    var zoomTo = core.useDebounceCallback(function (scale) {
+        var zoom = store.get('zoom');
+        if (zoom) {
+            zoom(scale);
+        }
+    }, 40);
+    var handleWheelEvent = function (e) {
+        if (!e.ctrlKey) {
+            return;
+        }
+        e.preventDefault();
+        var target = e.target;
+        var rect = target.getBoundingClientRect();
+        var scaleDiff = 1 - e.deltaY / 100;
+        var originX = e.clientX - rect.left;
+        var originY = e.clientY - rect.top;
+        var currentScale = store.get('scale');
+        var matrix = createSvgElement()
+            .createSVGMatrix()
+            .translate(originX, originY)
+            .scale(scaleDiff)
+            .translate(-originX, -originY)
+            .scale(currentScale);
+        zoomTo(matrix.a);
+    };
+    core.useIsomorphicLayoutEffect(function () {
+        var pagesContainer = pagesContainerRef.current;
+        if (!pagesContainer) {
+            return;
+        }
+        pagesContainer.addEventListener('wheel', handleWheelEvent, WHEEL_EVENT_OPTIONS);
+        return function () {
+            pagesContainer.removeEventListener('wheel', handleWheelEvent);
+        };
+    }, []);
+    return React__namespace.createElement(React__namespace.Fragment, null);
+};
+
 var LEVELS = [
@@ -309,2 +356,3 @@ 0.1, 0.2, 0.3, 0.4, 0.5, 0.6, 0.7, 0.8, 0.9, 1, 1.1, 1.3, 1.5, 1.7, 1.9, 2.1, 2.4, 2.7, 3.0, 3.3, 3.7, 4.1, 4.6,
                 React__namespace.createElement(ShortcutHandler, { containerRef: props.containerRef, store: store }),
+                React__namespace.createElement(PinchZoom, { pagesContainerRef: props.pagesContainerRef, store: store }),
                 slot.children)),
@@ -311,0 +359,0 @@ };

lib/cjs/zoom.min.js

@@ -1,1 +0,1 @@
-"use strict";var e=require("@react-pdf-viewer/core");function t(e){var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var o=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,o.get?o:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var n=t(require("react")),o=function(){return n.createElement(e.Icon,{ignoreDirection:!0,size:16},n.createElement("path",{d:"M10.5,0.499c5.523,0,10,4.477,10,10s-4.477,10-10,10s-10-4.477-10-10S4.977,0.499,10.5,0.499z\n            M23.5,23.499\n            l-5.929-5.929\n            M5.5,10.499h10\n            M10.5,5.499v10"}))},r=function(){return n.createElement(e.Icon,{ignoreDirection:!0,size:16},n.createElement("path",{d:"M10.5,0.499c5.523,0,10,4.477,10,10s-4.477,10-10,10s-10-4.477-10-10S4.977,0.499,10.5,0.499z\n            M23.5,23.499\n            l-5.929-5.929\n            M5.5,10.499h10"}))},c=function(){return c=Object.assign||function(e){for(var t,n=1,o=arguments.length;n<o;n++)for(var r in t=arguments[n])Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r]);return e},c.apply(this,arguments)},a=function(e){var t=n.useState(e.get("scale")||0),o=t[0],r=t[1],c=function(e){r(e)};return n.useEffect((function(){return e.subscribe("scale",c),function(){e.unsubscribe("scale",c)}}),[]),{scale:o}},u=function(e){var t=e.children,o=e.store;return(t||function(e){return n.createElement(n.Fragment,null,"".concat(Math.round(100*e.scale),"%"))})({scale:a(o).scale})},i=[.1,.2,.3,.4,.5,.6,.7,.8,.9,1,1.1,1.3,1.5,1.7,1.9,2.1,2.4,2.7,3,3.3,3.7,4.1,4.6,5.1,5.7,6.3,7,7.7,8.5,9.4,10],l=function(e){return i.find((function(t){return t>e}))||e},m=function(e){var t=i.findIndex((function(t){return t>=e}));return-1===t||0===t?e:i[t-1]},s=function(t){var o=t.containerRef,r=t.store,c=function(t){if(!t.shiftKey&&!t.altKey&&(e.isMac()?t.metaKey:t.ctrlKey)){var n=o.current;if(n&&document.activeElement&&n.contains(document.activeElement)){var c=r.get("zoom");if(c){var a=r.get("scale")||1,u=1;switch(t.key){case"-":u=m(a);break;case"=":u=l(a);break;case"0":u=1;break;default:u=a}u!==a&&(t.preventDefault(),c(u))}}}};return n.useEffect((function(){if(o.current)return document.addEventListener("keydown",c),function(){document.removeEventListener("keydown",c)}}),[o.current]),n.createElement(n.Fragment,null)},f=[.5,.75,1,1.25,1.5,2,3,4],v={left:0,top:8},p=function(t){var o=t.levels,r=void 0===o?f:o,c=t.scale,a=t.onZoom,u=n.useContext(e.LocalizationContext).l10n,i=n.useContext(e.ThemeContext).direction===e.TextDirection.RightToLeft,l=u&&u.zoom?u.zoom.zoomDocument:"Zoom document";return n.createElement(e.Popover,{ariaControlsSuffix:"zoom",ariaHasPopup:"menu",position:e.Position.BottomCenter,target:function(t){return n.createElement(e.MinimalButton,{ariaLabel:l,testId:"zoom__popover-target",onClick:function(){t()}},n.createElement("span",{className:"rpv-zoom__popover-target"},n.createElement("span",{"data-testid":"zoom__popover-target-scale",className:e.classNames({"rpv-zoom__popover-target-scale":!0,"rpv-zoom__popover-target-scale--ltr":!i,"rpv-zoom__popover-target-scale--rtl":i})},Math.round(100*c),"%"),n.createElement("span",{className:"rpv-zoom__popover-target-arrow"})))},content:function(t){return n.createElement(e.Menu,null,Object.keys(e.SpecialZoomLevel).map((function(o){var r=o;return n.createElement(e.MenuItem,{key:r,onClick:function(){t(),a(r)}},function(t){switch(t){case e.SpecialZoomLevel.ActualSize:return u&&u.zoom?u.zoom.actualSize:"Actual size";case e.SpecialZoomLevel.PageFit:return u&&u.zoom?u.zoom.pageFit:"Page fit";case e.SpecialZoomLevel.PageWidth:return u&&u.zoom?u.zoom.pageWidth:"Page width"}}(r))})),n.createElement(e.MenuDivider,null),r.map((function(o){return n.createElement(e.MenuItem,{key:o,onClick:function(){t(),a(o)}},"".concat(Math.round(100*o),"%"))})))},offset:v,closeOnClickOutside:!0,closeOnEscape:!0})},z=function(e){var t=e.children,o=e.levels,r=e.store;return(t||function(e){return n.createElement(p,{levels:o,scale:e.scale,onZoom:e.onZoom})})({scale:a(r).scale,onZoom:function(e){var t=r.get("zoom");t&&t(e)}})},E={left:0,top:8},d=function(t){var r=t.enableShortcuts,c=t.onClick,a=n.useContext(e.LocalizationContext).l10n,u=a&&a.zoom?a.zoom.zoomIn:"Zoom in",i=r?e.isMac()?"Meta+=":"Ctrl+=":"";return n.createElement(e.Tooltip,{ariaControlsSuffix:"zoom-in",position:e.Position.BottomCenter,target:n.createElement(e.MinimalButton,{ariaKeyShortcuts:i,ariaLabel:u,testId:"zoom__in-button",onClick:c},n.createElement(o,null)),content:function(){return u},offset:E})},C=function(e){var t=e.children,n=e.enableShortcuts,o=e.store,r=a(o).scale;return(t||d)({enableShortcuts:n,onClick:function(){var e=o.get("zoom");e&&e(l(r))}})},h=function(t){var r=t.onClick,c=n.useContext(e.LocalizationContext).l10n,a=c&&c.zoom?c.zoom.zoomIn:"Zoom in";return n.createElement(e.MenuItem,{icon:n.createElement(o,null),testId:"zoom__in-menu",onClick:r},a)},g={left:0,top:8},b=function(t){var o=t.enableShortcuts,c=t.onClick,a=n.useContext(e.LocalizationContext).l10n,u=a&&a.zoom?a.zoom.zoomOut:"Zoom out",i=o?e.isMac()?"Meta+-":"Ctrl+-":"";return n.createElement(e.Tooltip,{ariaControlsSuffix:"zoom-out",position:e.Position.BottomCenter,target:n.createElement(e.MinimalButton,{ariaKeyShortcuts:i,ariaLabel:u,testId:"zoom__out-button",onClick:c},n.createElement(r,null)),content:function(){return u},offset:g})},k=function(e){var t=e.children,n=e.enableShortcuts,o=e.store,r=a(o).scale;return(t||b)({enableShortcuts:n,onClick:function(){var e=o.get("zoom");e&&e(m(r))}})},S=function(t){var o=t.onClick,c=n.useContext(e.LocalizationContext).l10n,a=c&&c.zoom?c.zoom.zoomOut:"Zoom out";return n.createElement(e.MenuItem,{icon:n.createElement(r,null),testId:"zoom__out-menu",onClick:o},a)};exports.ZoomInIcon=o,exports.ZoomOutIcon=r,exports.zoomPlugin=function(t){var o=n.useMemo((function(){return Object.assign({},{enableShortcuts:!0},t)}),[]),r=n.useMemo((function(){return e.createStore({})}),[]),a=function(e){return n.createElement(C,c({enableShortcuts:o.enableShortcuts},e,{store:r}))},i=function(e){return n.createElement(k,c({enableShortcuts:o.enableShortcuts},e,{store:r}))},l=function(e){return n.createElement(z,c({},e,{store:r}))};return{renderViewer:function(e){var t=e.slot;if(!o.enableShortcuts)return t;var a={children:n.createElement(n.Fragment,null,n.createElement(s,{containerRef:e.containerRef,store:r}),t.children)};return c(c({},t),a)},install:function(e){r.update("zoom",e.zoom)},onViewerStateChange:function(e){return r.update("scale",e.scale),e},zoomTo:function(e){var t=r.get("zoom");t&&t(e)},CurrentScale:function(e){return n.createElement(u,c({},e,{store:r}))},ZoomIn:a,ZoomInButton:function(){return n.createElement(a,null,(function(e){return n.createElement(d,c({},e))}))},ZoomInMenuItem:function(e){return n.createElement(a,null,(function(t){return n.createElement(h,{onClick:function(){t.onClick(),e.onClick()}})}))},ZoomOut:i,ZoomOutButton:function(){return n.createElement(i,null,(function(e){return n.createElement(b,c({},e))}))},ZoomOutMenuItem:function(e){return n.createElement(i,null,(function(t){return n.createElement(S,{onClick:function(){t.onClick(),e.onClick()}})}))},Zoom:l,ZoomPopover:function(e){return n.createElement(l,null,(function(t){return n.createElement(p,c({levels:null==e?void 0:e.levels},t))}))}}};
+"use strict";var e=require("@react-pdf-viewer/core");function t(e){var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var o=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,o.get?o:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var n=t(require("react")),o=function(){return n.createElement(e.Icon,{ignoreDirection:!0,size:16},n.createElement("path",{d:"M10.5,0.499c5.523,0,10,4.477,10,10s-4.477,10-10,10s-10-4.477-10-10S4.977,0.499,10.5,0.499z\n            M23.5,23.499\n            l-5.929-5.929\n            M5.5,10.499h10\n            M10.5,5.499v10"}))},r=function(){return n.createElement(e.Icon,{ignoreDirection:!0,size:16},n.createElement("path",{d:"M10.5,0.499c5.523,0,10,4.477,10,10s-4.477,10-10,10s-10-4.477-10-10S4.977,0.499,10.5,0.499z\n            M23.5,23.499\n            l-5.929-5.929\n            M5.5,10.499h10"}))},c=function(){return c=Object.assign||function(e){for(var t,n=1,o=arguments.length;n<o;n++)for(var r in t=arguments[n])Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r]);return e},c.apply(this,arguments)},a=function(e){var t=n.useState(e.get("scale")||0),o=t[0],r=t[1],c=function(e){r(e)};return n.useEffect((function(){return e.subscribe("scale",c),function(){e.unsubscribe("scale",c)}}),[]),{scale:o}},u=function(e){var t=e.children,o=e.store;return(t||function(e){return n.createElement(n.Fragment,null,"".concat(Math.round(100*e.scale),"%"))})({scale:a(o).scale})},l={passive:!1},i=null,s=function(t){var o=t.pagesContainerRef,r=t.store,c=e.useDebounceCallback((function(e){var t=r.get("zoom");t&&t(e)}),40),a=function(e){if(e.ctrlKey){e.preventDefault();var t=e.target.getBoundingClientRect(),n=1-e.deltaY/100,o=e.clientX-t.left,a=e.clientY-t.top,u=r.get("scale"),l=(i||(i=document.createElementNS("http://www.w3.org/2000/svg","svg"))).createSVGMatrix().translate(o,a).scale(n).translate(-o,-a).scale(u);c(l.a)}};return e.useIsomorphicLayoutEffect((function(){var e=o.current;if(e)return e.addEventListener("wheel",a,l),function(){e.removeEventListener("wheel",a)}}),[]),n.createElement(n.Fragment,null)},m=[.1,.2,.3,.4,.5,.6,.7,.8,.9,1,1.1,1.3,1.5,1.7,1.9,2.1,2.4,2.7,3,3.3,3.7,4.1,4.6,5.1,5.7,6.3,7,7.7,8.5,9.4,10],f=function(e){return m.find((function(t){return t>e}))||e},v=function(e){var t=m.findIndex((function(t){return t>=e}));return-1===t||0===t?e:m[t-1]},p=function(t){var o=t.containerRef,r=t.store,c=function(t){if(!t.shiftKey&&!t.altKey&&(e.isMac()?t.metaKey:t.ctrlKey)){var n=o.current;if(n&&document.activeElement&&n.contains(document.activeElement)){var c=r.get("zoom");if(c){var a=r.get("scale")||1,u=1;switch(t.key){case"-":u=v(a);break;case"=":u=f(a);break;case"0":u=1;break;default:u=a}u!==a&&(t.preventDefault(),c(u))}}}};return n.useEffect((function(){if(o.current)return document.addEventListener("keydown",c),function(){document.removeEventListener("keydown",c)}}),[o.current]),n.createElement(n.Fragment,null)},z=[.5,.75,1,1.25,1.5,2,3,4],E={left:0,top:8},d=function(t){var o=t.levels,r=void 0===o?z:o,c=t.scale,a=t.onZoom,u=n.useContext(e.LocalizationContext).l10n,l=n.useContext(e.ThemeContext).direction===e.TextDirection.RightToLeft,i=u&&u.zoom?u.zoom.zoomDocument:"Zoom document";return n.createElement(e.Popover,{ariaControlsSuffix:"zoom",ariaHasPopup:"menu",position:e.Position.BottomCenter,target:function(t){return n.createElement(e.MinimalButton,{ariaLabel:i,testId:"zoom__popover-target",onClick:function(){t()}},n.createElement("span",{className:"rpv-zoom__popover-target"},n.createElement("span",{"data-testid":"zoom__popover-target-scale",className:e.classNames({"rpv-zoom__popover-target-scale":!0,"rpv-zoom__popover-target-scale--ltr":!l,"rpv-zoom__popover-target-scale--rtl":l})},Math.round(100*c),"%"),n.createElement("span",{className:"rpv-zoom__popover-target-arrow"})))},content:function(t){return n.createElement(e.Menu,null,Object.keys(e.SpecialZoomLevel).map((function(o){var r=o;return n.createElement(e.MenuItem,{key:r,onClick:function(){t(),a(r)}},function(t){switch(t){case e.SpecialZoomLevel.ActualSize:return u&&u.zoom?u.zoom.actualSize:"Actual size";case e.SpecialZoomLevel.PageFit:return u&&u.zoom?u.zoom.pageFit:"Page fit";case e.SpecialZoomLevel.PageWidth:return u&&u.zoom?u.zoom.pageWidth:"Page width"}}(r))})),n.createElement(e.MenuDivider,null),r.map((function(o){return n.createElement(e.MenuItem,{key:o,onClick:function(){t(),a(o)}},"".concat(Math.round(100*o),"%"))})))},offset:E,closeOnClickOutside:!0,closeOnEscape:!0})},g=function(e){var t=e.children,o=e.levels,r=e.store;return(t||function(e){return n.createElement(d,{levels:o,scale:e.scale,onZoom:e.onZoom})})({scale:a(r).scale,onZoom:function(e){var t=r.get("zoom");t&&t(e)}})},C={left:0,top:8},h=function(t){var r=t.enableShortcuts,c=t.onClick,a=n.useContext(e.LocalizationContext).l10n,u=a&&a.zoom?a.zoom.zoomIn:"Zoom in",l=r?e.isMac()?"Meta+=":"Ctrl+=":"";return n.createElement(e.Tooltip,{ariaControlsSuffix:"zoom-in",position:e.Position.BottomCenter,target:n.createElement(e.MinimalButton,{ariaKeyShortcuts:l,ariaLabel:u,testId:"zoom__in-button",onClick:c},n.createElement(o,null)),content:function(){return u},offset:C})},b=function(e){var t=e.children,n=e.enableShortcuts,o=e.store,r=a(o).scale;return(t||h)({enableShortcuts:n,onClick:function(){var e=o.get("zoom");e&&e(f(r))}})},k=function(t){var r=t.onClick,c=n.useContext(e.LocalizationContext).l10n,a=c&&c.zoom?c.zoom.zoomIn:"Zoom in";return n.createElement(e.MenuItem,{icon:n.createElement(o,null),testId:"zoom__in-menu",onClick:r},a)},S={left:0,top:8},M=function(t){var o=t.enableShortcuts,c=t.onClick,a=n.useContext(e.LocalizationContext).l10n,u=a&&a.zoom?a.zoom.zoomOut:"Zoom out",l=o?e.isMac()?"Meta+-":"Ctrl+-":"";return n.createElement(e.Tooltip,{ariaControlsSuffix:"zoom-out",position:e.Position.BottomCenter,target:n.createElement(e.MinimalButton,{ariaKeyShortcuts:l,ariaLabel:u,testId:"zoom__out-button",onClick:c},n.createElement(r,null)),content:function(){return u},offset:S})},I=function(e){var t=e.children,n=e.enableShortcuts,o=e.store,r=a(o).scale;return(t||M)({enableShortcuts:n,onClick:function(){var e=o.get("zoom");e&&e(v(r))}})},Z=function(t){var o=t.onClick,c=n.useContext(e.LocalizationContext).l10n,a=c&&c.zoom?c.zoom.zoomOut:"Zoom out";return n.createElement(e.MenuItem,{icon:n.createElement(r,null),testId:"zoom__out-menu",onClick:o},a)};exports.ZoomInIcon=o,exports.ZoomOutIcon=r,exports.zoomPlugin=function(t){var o=n.useMemo((function(){return Object.assign({},{enableShortcuts:!0},t)}),[]),r=n.useMemo((function(){return e.createStore({})}),[]),a=function(e){return n.createElement(b,c({enableShortcuts:o.enableShortcuts},e,{store:r}))},l=function(e){return n.createElement(I,c({enableShortcuts:o.enableShortcuts},e,{store:r}))},i=function(e){return n.createElement(g,c({},e,{store:r}))};return{renderViewer:function(e){var t=e.slot;if(!o.enableShortcuts)return t;var a={children:n.createElement(n.Fragment,null,n.createElement(p,{containerRef:e.containerRef,store:r}),n.createElement(s,{pagesContainerRef:e.pagesContainerRef,store:r}),t.children)};return c(c({},t),a)},install:function(e){r.update("zoom",e.zoom)},onViewerStateChange:function(e){return r.update("scale",e.scale),e},zoomTo:function(e){var t=r.get("zoom");t&&t(e)},CurrentScale:function(e){return n.createElement(u,c({},e,{store:r}))},ZoomIn:a,ZoomInButton:function(){return n.createElement(a,null,(function(e){return n.createElement(h,c({},e))}))},ZoomInMenuItem:function(e){return n.createElement(a,null,(function(t){return n.createElement(k,{onClick:function(){t.onClick(),e.onClick()}})}))},ZoomOut:l,ZoomOutButton:function(){return n.createElement(l,null,(function(e){return n.createElement(M,c({},e))}))},ZoomOutMenuItem:function(e){return n.createElement(l,null,(function(t){return n.createElement(Z,{onClick:function(){t.onClick(),e.onClick()}})}))},Zoom:i,ZoomPopover:function(e){return n.createElement(i,null,(function(t){return n.createElement(d,c({levels:null==e?void 0:e.levels},t))}))}}};

package.json

 {
     "name": "@react-pdf-viewer/zoom",
-    "version": "3.11.0",
+    "version": "3.12.0",
     "description": "A React component to view a PDF document",
@@ -36,3 +36,3 @@ "license": "https://react-pdf-viewer.dev/license",
     "dependencies": {
-        "@react-pdf-viewer/core": "3.11.0"
+        "@react-pdf-viewer/core": "3.12.0"
     },
@@ -53,3 +53,3 @@ "peerDependencies": {
     },
-    "gitHead": "25039b7717eb30743eaaabbb4bb2eb75529b49e2"
+    "gitHead": "ea84015146e8c5d4c78d7f10df2fba84567ef4aa"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

30638

increased by8.55%

Lines of code

480

increased by11.63%

Dependency changes

• + Added@react-pdf-viewer/core@3.12.0(transitive)

• - Removed@react-pdf-viewer/core@3.11.0(transitive)

• Updated@react-pdf-viewer/core@3.12.0