Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@react-pdf-viewer/zoom

Package Overview
Dependencies
Maintainers
1
Versions
42
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

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

Comparing version 2.2.1 to 2.3.0

62

lib/cjs/zoom.js

@@ -8,14 +8,10 @@ 'use strict';

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
var ZoomInIcon = function () {
return (React__default['default'].createElement(core.Icon, { size: 16 },
React__default['default'].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" })));
return (React.createElement(core.Icon, { size: 16 },
React.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" })));
};
var ZoomOutIcon = function () {
return (React__default['default'].createElement(core.Icon, { size: 16 },
React__default['default'].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" })));
return (React.createElement(core.Icon, { size: 16 },
React.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" })));
};

@@ -50,3 +46,3 @@

var useZoom = function (store) {
var _a = React.useState(0), scale = _a[0], setScale = _a[1];
var _a = React.useState(store.get('scale') || 0), scale = _a[0], setScale = _a[1];
var handleScaleChanged = function (currentScale) {

@@ -67,3 +63,3 @@ setScale(currentScale);

var scale = useZoom(store).scale;
var defaultChildren = function (props) { return React__default['default'].createElement(React__default['default'].Fragment, null, Math.round(props.scale * 100) + "%"); };
var defaultChildren = function (props) { return React.createElement(React.Fragment, null, Math.round(props.scale * 100) + "%"); };
var render = children || defaultChildren;

@@ -90,20 +86,20 @@ return render({ scale: scale });

var click = function () { toggle(); };
return (React__default['default'].createElement("span", { className: 'rpv-zoom-popover-target', onClick: click },
React__default['default'].createElement("span", { className: 'rpv-zoom-popover-target-scale' },
return (React.createElement("span", { className: 'rpv-zoom-popover-target', onClick: click },
React.createElement("span", { className: 'rpv-zoom-popover-target-scale' },
Math.round(scale * 100),
"%"),
React__default['default'].createElement("span", { className: 'rpv-zoom-popover-target-arrow' })));
React.createElement("span", { className: 'rpv-zoom-popover-target-arrow' })));
};
var renderContent = function (toggle) { return (React__default['default'].createElement(core.Menu, null,
var renderContent = function (toggle) { return (React.createElement(core.Menu, null,
Object.keys(core.SpecialZoomLevel).map(function (k) {
var level = k;
var clickMenuItem = function () { toggle(); onZoom(level); };
return (React__default['default'].createElement(core.MenuItem, { key: level, onClick: clickMenuItem }, getSpcialLevelLabel(level)));
return (React.createElement(core.MenuItem, { key: level, onClick: clickMenuItem }, getSpcialLevelLabel(level)));
}),
React__default['default'].createElement(core.MenuDivider, null),
React.createElement(core.MenuDivider, null),
LEVELS.map(function (level) {
var clickMenuItem = function () { toggle(); onZoom(level); };
return (React__default['default'].createElement(core.MenuItem, { key: level, onClick: clickMenuItem }, Math.round(level * 100) + "%"));
return (React.createElement(core.MenuItem, { key: level, onClick: clickMenuItem }, Math.round(level * 100) + "%"));
}))); };
return (React__default['default'].createElement(core.Popover, { position: core.Position.BottomCenter, target: renderTarget, content: renderContent, offset: PORTAL_OFFSET, closeOnClickOutside: true, closeOnEscape: true }));
return (React.createElement(core.Popover, { position: core.Position.BottomCenter, target: renderTarget, content: renderContent, offset: PORTAL_OFFSET, closeOnClickOutside: true, closeOnEscape: true }));
};

@@ -120,3 +116,3 @@

};
var defaultChildren = function (props) { return React__default['default'].createElement(ZoomPopover, { scale: props.scale, onZoom: props.onZoom }); };
var defaultChildren = function (props) { return React.createElement(ZoomPopover, { scale: props.scale, onZoom: props.onZoom }); };
var render = children || defaultChildren;

@@ -134,4 +130,4 @@ return render({

var label = l10n && l10n.zoom ? l10n.zoom.zoomIn : 'Zoom in';
return (React__default['default'].createElement(core.Tooltip, { position: core.Position.BottomCenter, target: React__default['default'].createElement(core.Button, { onClick: onClick },
React__default['default'].createElement(ZoomInIcon, null)), content: function () { return label; }, offset: TOOLTIP_OFFSET }));
return (React.createElement(core.Tooltip, { position: core.Position.BottomCenter, target: React.createElement(core.Button, { onClick: onClick },
React.createElement(ZoomInIcon, null)), content: function () { return label; }, offset: TOOLTIP_OFFSET }));
};

@@ -191,3 +187,3 @@

};
var defaultChildren = function (props) { return React__default['default'].createElement(ZoomInButton, { onClick: props.onClick }); };
var defaultChildren = function (props) { return React.createElement(ZoomInButton, { onClick: props.onClick }); };
var render = children || defaultChildren;

@@ -204,4 +200,4 @@ return render({

var label = l10n && l10n.zoom ? l10n.zoom.zoomOut : 'Zoom out';
return (React__default['default'].createElement(core.Tooltip, { position: core.Position.BottomCenter, target: React__default['default'].createElement(core.Button, { onClick: onClick },
React__default['default'].createElement(ZoomOutIcon, null)), content: function () { return label; }, offset: TOOLTIP_OFFSET$1 }));
return (React.createElement(core.Tooltip, { position: core.Position.BottomCenter, target: React.createElement(core.Button, { onClick: onClick },
React.createElement(ZoomOutIcon, null)), content: function () { return label; }, offset: TOOLTIP_OFFSET$1 }));
};

@@ -219,3 +215,3 @@

};
var defaultChildren = function (props) { return React__default['default'].createElement(ZoomOutButton, { onClick: props.onClick }); };
var defaultChildren = function (props) { return React.createElement(ZoomOutButton, { onClick: props.onClick }); };
var render = children || defaultChildren;

@@ -228,10 +224,10 @@ return render({

var zoomPlugin = function () {
var store = core.createStore({});
var CurrentScaleDecorator = function (props) { return (React__default['default'].createElement(CurrentScale, __assign({}, props, { store: store }))); };
var ZoomInDecorator = function (props) { return (React__default['default'].createElement(ZoomIn, __assign({}, props, { store: store }))); };
var ZoomInButtonDecorator = function () { return (React__default['default'].createElement(ZoomInDecorator, null, function (props) { return React__default['default'].createElement(ZoomInButton, __assign({}, props)); })); };
var ZoomOutDecorator = function (props) { return (React__default['default'].createElement(ZoomOut, __assign({}, props, { store: store }))); };
var ZoomOutButtonDecorator = function () { return (React__default['default'].createElement(ZoomOutDecorator, null, function (props) { return React__default['default'].createElement(ZoomOutButton, __assign({}, props)); })); };
var ZoomDecorator = function (props) { return React__default['default'].createElement(Zoom, __assign({}, props, { store: store })); };
var ZoomPopoverDecorator = function () { return (React__default['default'].createElement(ZoomDecorator, null, function (props) { return React__default['default'].createElement(ZoomPopover, __assign({}, props)); })); };
var store = React.useMemo(function () { return core.createStore({}); }, []);
var CurrentScaleDecorator = function (props) { return (React.createElement(CurrentScale, __assign({}, props, { store: store }))); };
var ZoomInDecorator = function (props) { return (React.createElement(ZoomIn, __assign({}, props, { store: store }))); };
var ZoomInButtonDecorator = function () { return (React.createElement(ZoomInDecorator, null, function (props) { return React.createElement(ZoomInButton, __assign({}, props)); })); };
var ZoomOutDecorator = function (props) { return (React.createElement(ZoomOut, __assign({}, props, { store: store }))); };
var ZoomOutButtonDecorator = function () { return (React.createElement(ZoomOutDecorator, null, function (props) { return React.createElement(ZoomOutButton, __assign({}, props)); })); };
var ZoomDecorator = function (props) { return React.createElement(Zoom, __assign({}, props, { store: store })); };
var ZoomPopoverDecorator = function () { return (React.createElement(ZoomDecorator, null, function (props) { return React.createElement(ZoomPopover, __assign({}, props)); })); };
return {

@@ -238,0 +234,0 @@ install: function (pluginFunctions) {

@@ -1,1 +0,1 @@

"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("@react-pdf-viewer/core");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=n(e),r=function(){return o.default.createElement(t.Icon,{size:16},o.default.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"}))},u=function(){return o.default.createElement(t.Icon,{size:16},o.default.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"}))},a=function(){return(a=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}).apply(this,arguments)},c=function(t){var n=e.useState(0),o=n[0],r=n[1],u=function(e){r(e)};return e.useEffect((function(){return t.subscribe("scale",u),function(){t.unsubscribe("scale",u)}}),[]),{scale:o}},l=function(e){var t=e.children,n=e.store;return(t||function(e){return o.default.createElement(o.default.Fragment,null,Math.round(100*e.scale)+"%")})({scale:c(n).scale})},i=[.5,.75,1,1.25,1.5,2,3,4],f={left:0,top:8},m=function(n){var r=n.scale,u=n.onZoom,a=e.useContext(t.LocalizationContext);return o.default.createElement(t.Popover,{position:t.Position.BottomCenter,target:function(e){return o.default.createElement("span",{className:"rpv-zoom-popover-target",onClick:function(){e()}},o.default.createElement("span",{className:"rpv-zoom-popover-target-scale"},Math.round(100*r),"%"),o.default.createElement("span",{className:"rpv-zoom-popover-target-arrow"}))},content:function(e){return o.default.createElement(t.Menu,null,Object.keys(t.SpecialZoomLevel).map((function(n){var r=n;return o.default.createElement(t.MenuItem,{key:r,onClick:function(){e(),u(r)}},function(e){switch(e){case t.SpecialZoomLevel.ActualSize:return a&&a.zoom?a.zoom.actualSize:"Actual size";case t.SpecialZoomLevel.PageFit:return a&&a.zoom?a.zoom.pageFit:"Page fit";case t.SpecialZoomLevel.PageWidth:return a&&a.zoom?a.zoom.pageWidth:"Page width"}}(r))})),o.default.createElement(t.MenuDivider,null),i.map((function(n){return o.default.createElement(t.MenuItem,{key:n,onClick:function(){e(),u(n)}},Math.round(100*n)+"%")})))},offset:f,closeOnClickOutside:!0,closeOnEscape:!0})},s=function(e){var t=e.children,n=e.store;return(t||function(e){return o.default.createElement(m,{scale:e.scale,onZoom:e.onZoom})})({scale:c(n).scale,onZoom:function(e){var t=n.get("zoom");t&&t(e)}})},d={left:0,top:8},p=function(n){var u=n.onClick,a=e.useContext(t.LocalizationContext),c=a&&a.zoom?a.zoom.zoomIn:"Zoom in";return o.default.createElement(t.Tooltip,{position:t.Position.BottomCenter,target:o.default.createElement(t.Button,{onClick:u},o.default.createElement(r,null)),content:function(){return c},offset:d})},E=[.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],v=function(e){var t=e.children,n=e.store,r=c(n).scale;return(t||function(e){return o.default.createElement(p,{onClick:e.onClick})})({onClick:function(){var e,t=n.get("zoom");t&&t((e=r,E.find((function(t){return t>e}))||e))}})},z={left:0,top:8},C=function(n){var r=n.onClick,a=e.useContext(t.LocalizationContext),c=a&&a.zoom?a.zoom.zoomOut:"Zoom out";return o.default.createElement(t.Tooltip,{position:t.Position.BottomCenter,target:o.default.createElement(t.Button,{onClick:r},o.default.createElement(u,null)),content:function(){return c},offset:z})},g=function(e){var t=e.children,n=e.store,r=c(n).scale;return(t||function(e){return o.default.createElement(C,{onClick:e.onClick})})({onClick:function(){var e,t,o=n.get("zoom");o&&o((e=r,-1===(t=E.findIndex((function(t){return t>=e})))||0===t?e:E[t-1]))}})};exports.ZoomInIcon=r,exports.ZoomOutIcon=u,exports.zoomPlugin=function(){var e=t.createStore({}),n=function(t){return o.default.createElement(v,a({},t,{store:e}))},r=function(t){return o.default.createElement(g,a({},t,{store:e}))},u=function(t){return o.default.createElement(s,a({},t,{store:e}))};return{install:function(t){e.update("zoom",t.zoom)},onViewerStateChange:function(t){return e.update("scale",t.scale),t},CurrentScale:function(t){return o.default.createElement(l,a({},t,{store:e}))},ZoomIn:n,ZoomInButton:function(){return o.default.createElement(n,null,(function(e){return o.default.createElement(p,a({},e))}))},ZoomOut:r,ZoomOutButton:function(){return o.default.createElement(r,null,(function(e){return o.default.createElement(C,a({},e))}))},Zoom:u,ZoomPopover:function(){return o.default.createElement(u,null,(function(e){return o.default.createElement(m,a({},e))}))}}};
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("@react-pdf-viewer/core"),n=function(){return e.createElement(t.Icon,{size:16},e.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"}))},o=function(){return e.createElement(t.Icon,{size:16},e.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"}))},r=function(){return(r=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}).apply(this,arguments)},c=function(t){var n=e.useState(t.get("scale")||0),o=n[0],r=n[1],c=function(e){r(e)};return e.useEffect((function(){return t.subscribe("scale",c),function(){t.unsubscribe("scale",c)}}),[]),{scale:o}},u=function(t){var n=t.children,o=t.store;return(n||function(t){return e.createElement(e.Fragment,null,Math.round(100*t.scale)+"%")})({scale:c(o).scale})},a=[.5,.75,1,1.25,1.5,2,3,4],i={left:0,top:8},l=function(n){var o=n.scale,r=n.onZoom,c=e.useContext(t.LocalizationContext);return e.createElement(t.Popover,{position:t.Position.BottomCenter,target:function(t){return e.createElement("span",{className:"rpv-zoom-popover-target",onClick:function(){t()}},e.createElement("span",{className:"rpv-zoom-popover-target-scale"},Math.round(100*o),"%"),e.createElement("span",{className:"rpv-zoom-popover-target-arrow"}))},content:function(n){return e.createElement(t.Menu,null,Object.keys(t.SpecialZoomLevel).map((function(o){var u=o;return e.createElement(t.MenuItem,{key:u,onClick:function(){n(),r(u)}},function(e){switch(e){case t.SpecialZoomLevel.ActualSize:return c&&c.zoom?c.zoom.actualSize:"Actual size";case t.SpecialZoomLevel.PageFit:return c&&c.zoom?c.zoom.pageFit:"Page fit";case t.SpecialZoomLevel.PageWidth:return c&&c.zoom?c.zoom.pageWidth:"Page width"}}(u))})),e.createElement(t.MenuDivider,null),a.map((function(o){return e.createElement(t.MenuItem,{key:o,onClick:function(){n(),r(o)}},Math.round(100*o)+"%")})))},offset:i,closeOnClickOutside:!0,closeOnEscape:!0})},m=function(t){var n=t.children,o=t.store;return(n||function(t){return e.createElement(l,{scale:t.scale,onZoom:t.onZoom})})({scale:c(o).scale,onZoom:function(e){var t=o.get("zoom");t&&t(e)}})},s={left:0,top:8},f=function(o){var r=o.onClick,c=e.useContext(t.LocalizationContext),u=c&&c.zoom?c.zoom.zoomIn:"Zoom in";return e.createElement(t.Tooltip,{position:t.Position.BottomCenter,target:e.createElement(t.Button,{onClick:r},e.createElement(n,null)),content:function(){return u},offset:s})},p=[.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],E=function(t){var n=t.children,o=t.store,r=c(o).scale;return(n||function(t){return e.createElement(f,{onClick:t.onClick})})({onClick:function(){var e,t=o.get("zoom");t&&t((e=r,p.find((function(t){return t>e}))||e))}})},v={left:0,top:8},z=function(n){var r=n.onClick,c=e.useContext(t.LocalizationContext),u=c&&c.zoom?c.zoom.zoomOut:"Zoom out";return e.createElement(t.Tooltip,{position:t.Position.BottomCenter,target:e.createElement(t.Button,{onClick:r},e.createElement(o,null)),content:function(){return u},offset:v})},C=function(t){var n=t.children,o=t.store,r=c(o).scale;return(n||function(t){return e.createElement(z,{onClick:t.onClick})})({onClick:function(){var e,t,n=o.get("zoom");n&&n((e=r,-1===(t=p.findIndex((function(t){return t>=e})))||0===t?e:p[t-1]))}})};exports.ZoomInIcon=n,exports.ZoomOutIcon=o,exports.zoomPlugin=function(){var n=e.useMemo((function(){return t.createStore({})}),[]),o=function(t){return e.createElement(E,r({},t,{store:n}))},c=function(t){return e.createElement(C,r({},t,{store:n}))},a=function(t){return e.createElement(m,r({},t,{store:n}))};return{install:function(e){n.update("zoom",e.zoom)},onViewerStateChange:function(e){return n.update("scale",e.scale),e},CurrentScale:function(t){return e.createElement(u,r({},t,{store:n}))},ZoomIn:o,ZoomInButton:function(){return e.createElement(o,null,(function(t){return e.createElement(f,r({},t))}))},ZoomOut:c,ZoomOutButton:function(){return e.createElement(c,null,(function(t){return e.createElement(z,r({},t))}))},Zoom:a,ZoomPopover:function(){return e.createElement(a,null,(function(t){return e.createElement(l,r({},t))}))}}};

@@ -9,3 +9,3 @@ /**

import { Component, ReactElement, ReactNode } from 'react';
import * as React from 'react';
import { Plugin, SpecialZoomLevel } from '@react-pdf-viewer/core';

@@ -22,3 +22,3 @@

export interface ZoomInProps {
children?: (props: RenderZoomInProps) => ReactElement;
children?: (props: RenderZoomInProps) => React.ReactElement;
}

@@ -35,3 +35,3 @@

export interface ZoomOutProps {
children?: (props: RenderZoomOutProps) => ReactNode;
children?: (props: RenderZoomOutProps) => React.ReactNode;
}

@@ -48,3 +48,3 @@

export interface CurrentScaleProps {
children?: (props: RenderCurrentScaleProps) => ReactElement;
children?: (props: RenderCurrentScaleProps) => React.ReactElement;
}

@@ -62,3 +62,3 @@

export interface ZoomProps {
children?: (props: RenderZoomProps) => ReactElement;
children?: (props: RenderZoomProps) => React.ReactElement;
}

@@ -71,13 +71,13 @@

export interface ZoomPlugin extends Plugin {
CurrentScale: (props: CurrentScaleProps) => ReactElement;
ZoomIn: (props: ZoomInProps) => ReactElement;
ZoomInButton: () => ReactElement;
ZoomOut: (props: ZoomOutProps) => ReactElement;
ZoomOutButton: () => ReactElement;
Zoom: (props: ZoomProps) => ReactElement;
ZoomPopover: () => ReactElement;
CurrentScale: (props: CurrentScaleProps) => React.ReactElement;
ZoomIn: (props: ZoomInProps) => React.ReactElement;
ZoomInButton: () => React.ReactElement;
ZoomOut: (props: ZoomOutProps) => React.ReactElement;
ZoomOutButton: () => React.ReactElement;
Zoom: (props: ZoomProps) => React.ReactElement;
ZoomPopover: () => React.ReactElement;
}
export function zoomPlugin(): ZoomPlugin;
export class ZoomInIcon extends Component {}
export class ZoomOutIcon extends Component {}
export class ZoomInIcon extends React.Component {}
export class ZoomOutIcon extends React.Component {}
{
"name": "@react-pdf-viewer/zoom",
"version": "2.2.1",
"version": "2.3.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": "2.2.1"
"@react-pdf-viewer/core": "2.3.0"
},

@@ -52,3 +52,3 @@ "peerDependencies": {

},
"gitHead": "dc23d3ab29ed34affa25cc4acd25f7fce4e14fd0"
"gitHead": "182a54c3c2cb7d0d77bb988e495b3e6853108b0a"
}
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc