@jotforminc/dnd-builder 2.4.5 → 2.5.0

package/CHANGELOG.md

@@ -2,6 +2,21 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+## [2.5.0](https://github.com/jotform/dnd-builder/compare/v2.4.6...v2.5.0) (2023-02-28)
+
+
+### Features
+
+* **static-scene:** zoom-pan-pinch feature is supported now by dnd-builder ([55644e9](https://github.com/jotform/dnd-builder/commit/55644e9aead43ca2655906e0beab984a756b4d28))
+
+
+### Bug Fixes
+
+* **presentation-wrapper:** gesture should work for only fit case ([f1c2cc2](https://github.com/jotform/dnd-builder/commit/f1c2cc2d38a0bfc0352a7ea4f65852ae8e827cf0))
+* **presentation-wrapper:** when isFullScreen is set, fitToScreen should recalculate  ([055c746](https://github.com/jotform/dnd-builder/commit/055c74665706742d134bc6a988af282656cea714))
+
+### [2.4.6](https://github.com/jotform/dnd-builder/compare/v2.4.4...v2.4.6) (2023-02-27)
+
 ### [2.4.5](https://github.com/jotform/dnd-builder/compare/v2.4.4...v2.4.5) (2023-02-01)
 
 ### [2.4.4](https://github.com/jotform/dnd-builder/compare/v2.4.3...v2.4.4) (2022-08-09)

package/lib/cjs/components/Presentation/PresentationWrapper.js

@@ -43,9 +43,11 @@ var PresentationWrapper = function PresentationWrapper(_ref) {
 
   var _usePresentationConte = presentationContext.usePresentationContext(),
       currentPage = _usePresentationConte.currentPage,
+      fittedZoom = _usePresentationConte.fittedZoom,
       isFullscreen = _usePresentationConte.isFullscreen,
       pageCount = _usePresentationConte.pageCount,
       setCurrentPage = _usePresentationConte.setCurrentPage,
+      setFittedZoom = _usePresentationConte.setFittedZoom,
       setIsFullscreen = _usePresentationConte.setIsFullscreen,
       setShowControlsInFullScreen = _usePresentationConte.setShowControlsInFullScreen,
       showControlsInFullScreen = _usePresentationConte.showControlsInFullScreen;
@@ -54,11 +56,6 @@ var PresentationWrapper = function PresentationWrapper(_ref) {
       setZoom = _useBuilderContext.setZoom,
       zoom = _useBuilderContext.zoom;
 
-  var _useState = React.useState(1),
-      _useState2 = _slicedToArray(_useState, 2),
-      fittedZoom = _useState2[0],
-      setFittedZoom = _useState2[1];
-
   var fitToScreen = React.useCallback(function () {
     var delay = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
     return setTimeout(function () {
@@ -75,8 +72,8 @@ var PresentationWrapper = function PresentationWrapper(_ref) {
     }, delay);
   }, [settings, isFullscreen, useFixedPresentationBar, pageCount]);
   React.useEffect(function () {
-    fitToScreen();
-  }, []);
+    fitToScreen(100);
+  }, [isFullscreen]);
   React.useEffect(function () {
     if (isFullscreen) {
       setShowControlsInFullScreen(true);
@@ -132,10 +129,13 @@ var PresentationWrapper = function PresentationWrapper(_ref) {
           event = _ref2.event;
 
       event.preventDefault();
-      var clientWidth = event.target.clientWidth;
 
-      if (axis === 'x' && window.innerWidth / 4 < distance && clientWidth * zoom < window.innerWidth) {
-        return v < 0 ? pageChanger(1)() : pageChanger(-1)();
+      if (fittedZoom === zoom) {
+        var clientWidth = event.target.clientWidth;
+
+        if (axis === 'x' && window.innerWidth / 4 < distance && clientWidth * zoom < window.innerWidth) {
+          return v < 0 ? pageChanger(1)() : pageChanger(-1)();
+        }
       }
     } // onPinchEnd: ({ movement: [d] }) => {
     //   const zoomStep = Number(parseFloat(d / 1000).toFixed(1));

package/lib/cjs/components/Presentation/PresentationWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"PresentationWrapper.js","sources":["../../../../src/components/Presentation/PresentationWrapper.js"],"sourcesContent":["import {\n  useCallback,\n  useEffect,\n  useState,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport Modal from 'react-modal';\nimport classNames from 'classnames';\nimport { useGesture } from 'react-use-gesture';\nimport PresentationBar from './PresentationBar';\nimport ProgressBar from './ProgressBar';\nimport { useBuilderContext } from '../../utils/builderContext';\nimport { useEventListener, useFullscreenChange } from '../../utils/hooks';\nimport {\n  changePage,\n  throttle,\n  zoomHandler,\n} from '../../utils/functions';\nimport { usePresentationContext } from '../../utils/presentationContext';\nimport { usePropContext } from '../../utils/propContext';\n// import { ZOOM_MIN, ZOOM_MAX } from '../../constants/zoom';\n\nconst PresentationWrapper = ({\n  children,\n  presentationBarActions,\n  useFixedPresentationBar,\n}) => {\n  const { onAnEventTrigger, settings } = usePropContext();\n  const {\n    currentPage,\n    isFullscreen,\n    pageCount,\n    setCurrentPage,\n    setIsFullscreen,\n    setShowControlsInFullScreen,\n    showControlsInFullScreen,\n  } = usePresentationContext();\n\n  const { setZoom, zoom } = useBuilderContext();\n  const [fittedZoom, setFittedZoom] = useState(1);\n\n  const fitToScreen = useCallback((delay = 0) => setTimeout(() => {\n    const newZoom = zoomHandler({\n      handler: setZoom,\n      isFullscreen,\n      isModeCustomize: false,\n      limitZoom: false,\n      settings,\n      useFixedPresentationBar,\n      useProgressBar: pageCount > 2,\n    });\n    setFittedZoom(newZoom);\n  }, delay), [settings, isFullscreen, useFixedPresentationBar, pageCount]);\n\n  useEffect(() => { fitToScreen(); }, []);\n\n  useEffect(() => {\n    if (isFullscreen) {\n      setShowControlsInFullScreen(true);\n      setTimeout(() => setShowControlsInFullScreen(false), 1500);\n    }\n  }, [isFullscreen]);\n\n  const pageChanger = action => changePage({\n    action,\n    currentPage,\n    pageCount,\n    setCurrentPage,\n  });\n\n  const handleKeyboardEvent = useCallback(e => {\n    if (e.keyCode === 39) {\n      pageChanger(1)();\n    } else if (e.keyCode === 37) {\n      pageChanger(-1)();\n    }\n  });\n\n  const setControlVisibility = e => {\n    // TODO :: timeout in n out for better ux\n    if (!isFullscreen) return;\n    if (showControlsInFullScreen && window.innerHeight - e.clientY >= 200) {\n      setShowControlsInFullScreen(false);\n    } else if (!showControlsInFullScreen && window.innerHeight - e.clientY < 200) {\n      setShowControlsInFullScreen(true);\n    }\n  };\n\n  useEventListener('keydown', handleKeyboardEvent);\n  useEventListener('mousemove', throttle(setControlVisibility, 150));\n  useEventListener('gesturestart', e => e.preventDefault());\n  useEventListener('gesturechange', e => e.preventDefault());\n  useFullscreenChange(isFullscreen, setIsFullscreen, fitToScreen);\n\n  const gesture = useGesture({\n    onDragEnd: ({\n      axis, direction: [v], distance, event,\n    }) => {\n      event.preventDefault();\n      const { clientWidth } = event.target;\n      if (axis === 'x'\n      && window.innerWidth / 4 < distance\n      && clientWidth * zoom < window.innerWidth) {\n        return v < 0 ? pageChanger(1)() : pageChanger(-1)();\n      }\n    },\n    // onPinchEnd: ({ movement: [d] }) => {\n    //   const zoomStep = Number(parseFloat(d / 1000).toFixed(1));\n    //   const newZoomValue = Number(((Math.round((zoom + zoomStep) * 10)) / 10).toFixed(2));\n    //   if (zoom !== newZoomValue && newZoomValue <= ZOOM_MAX) {\n    //     const minZoom = Math.min(fittedZoom, ZOOM_MIN);\n    //     setZoom(Math.max(newZoomValue, minZoom));\n    //   }\n    // },\n  });\n\n  return (\n    <>\n      <Modal\n        appElement={document.getElementById('root')}\n        className={classNames('jfPresentation jfFields', { black: isFullscreen })}\n        closeTimeoutMS={300}\n        contentLabel=\"Report Presentation\"\n        id=\"presentationModal\"\n        isOpen={true}\n        overlayClassName={classNames(\n          'jfPresentation-overlay',\n          { fixedPresentationBar: useFixedPresentationBar, isFullscreen },\n        )}\n        portalClassName=\"PresentationModal\"\n        shouldCloseOnEsc={false}\n        shouldFocusAfterRender={false}\n      >\n        {children(currentPage - 1, gesture)}\n        <PresentationBar\n          currentPage={currentPage}\n          fittedZoom={fittedZoom}\n          fitToScreen={fitToScreen}\n          isFullscreen={isFullscreen}\n          isVisible={(!isFullscreen || (isFullscreen && showControlsInFullScreen))}\n          onAnEventTrigger={onAnEventTrigger}\n          pageCount={pageCount}\n          presentationBarActions={presentationBarActions}\n          setCurrentPage={setCurrentPage}\n          setIsFullscreen={setIsFullscreen}\n          settings={settings}\n          setZoom={setZoom}\n          zoom={zoom}\n        />\n        <ProgressBar\n          currentPage={currentPage}\n          pageCount={pageCount}\n        />\n      </Modal>\n    </>\n  );\n};\n\nPresentationWrapper.propTypes = {\n  children: PropTypes.any,\n  presentationBarActions: PropTypes.arrayOf(PropTypes.shape({})),\n  useFixedPresentationBar: PropTypes.bool,\n};\n\nPresentationWrapper.defaultProps = {\n  children: () => {},\n  presentationBarActions: [],\n  useFixedPresentationBar: false,\n};\n\nexport default PresentationWrapper;\n"],"names":["PresentationWrapper","children","presentationBarActions","useFixedPresentationBar","usePropContext","onAnEventTrigger","settings","usePresentationContext","currentPage","isFullscreen","pageCount","setCurrentPage","setIsFullscreen","setShowControlsInFullScreen","showControlsInFullScreen","useBuilderContext","setZoom","zoom","useState","fittedZoom","setFittedZoom","fitToScreen","useCallback","delay","setTimeout","newZoom","zoomHandler","handler","isModeCustomize","limitZoom","useProgressBar","useEffect","pageChanger","action","changePage","handleKeyboardEvent","e","keyCode","setControlVisibility","window","innerHeight","clientY","useEventListener","throttle","preventDefault","useFullscreenChange","gesture","useGesture","onDragEnd","axis","direction","v","distance","event","clientWidth","target","innerWidth","_jsx","_jsxs","Modal","document","getElementById","classNames","black","fixedPresentationBar","propTypes","PropTypes","any","arrayOf","shape","bool","defaultProps"],"mappings":"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"}
+{"version":3,"file":"PresentationWrapper.js","sources":["../../../../src/components/Presentation/PresentationWrapper.js"],"sourcesContent":["import {\n  useCallback,\n  useEffect,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport Modal from 'react-modal';\nimport classNames from 'classnames';\nimport { useGesture } from 'react-use-gesture';\nimport PresentationBar from './PresentationBar';\nimport ProgressBar from './ProgressBar';\nimport { useBuilderContext } from '../../utils/builderContext';\nimport { useEventListener, useFullscreenChange } from '../../utils/hooks';\nimport {\n  changePage,\n  throttle,\n  zoomHandler,\n} from '../../utils/functions';\nimport { usePresentationContext } from '../../utils/presentationContext';\nimport { usePropContext } from '../../utils/propContext';\n// import { ZOOM_MIN, ZOOM_MAX } from '../../constants/zoom';\n\nconst PresentationWrapper = ({\n  children,\n  presentationBarActions,\n  useFixedPresentationBar,\n}) => {\n  const { onAnEventTrigger, settings } = usePropContext();\n  const {\n    currentPage,\n    fittedZoom,\n    isFullscreen,\n    pageCount,\n    setCurrentPage,\n    setFittedZoom,\n    setIsFullscreen,\n    setShowControlsInFullScreen,\n    showControlsInFullScreen,\n  } = usePresentationContext();\n\n  const { setZoom, zoom } = useBuilderContext();\n\n  const fitToScreen = useCallback((delay = 0) => setTimeout(() => {\n    const newZoom = zoomHandler({\n      handler: setZoom,\n      isFullscreen,\n      isModeCustomize: false,\n      limitZoom: false,\n      settings,\n      useFixedPresentationBar,\n      useProgressBar: pageCount > 2,\n    });\n    setFittedZoom(newZoom);\n  }, delay), [settings, isFullscreen, useFixedPresentationBar, pageCount]);\n\n  useEffect(() => { fitToScreen(100); }, [isFullscreen]);\n\n  useEffect(() => {\n    if (isFullscreen) {\n      setShowControlsInFullScreen(true);\n      setTimeout(() => setShowControlsInFullScreen(false), 1500);\n    }\n  }, [isFullscreen]);\n\n  const pageChanger = action => changePage({\n    action,\n    currentPage,\n    pageCount,\n    setCurrentPage,\n  });\n\n  const handleKeyboardEvent = useCallback(e => {\n    if (e.keyCode === 39) {\n      pageChanger(1)();\n    } else if (e.keyCode === 37) {\n      pageChanger(-1)();\n    }\n  });\n\n  const setControlVisibility = e => {\n    // TODO :: timeout in n out for better ux\n    if (!isFullscreen) return;\n    if (showControlsInFullScreen && window.innerHeight - e.clientY >= 200) {\n      setShowControlsInFullScreen(false);\n    } else if (!showControlsInFullScreen && window.innerHeight - e.clientY < 200) {\n      setShowControlsInFullScreen(true);\n    }\n  };\n\n  useEventListener('keydown', handleKeyboardEvent);\n  useEventListener('mousemove', throttle(setControlVisibility, 150));\n  useEventListener('gesturestart', e => e.preventDefault());\n  useEventListener('gesturechange', e => e.preventDefault());\n  useFullscreenChange(isFullscreen, setIsFullscreen, fitToScreen);\n\n  const gesture = useGesture({\n    onDragEnd: ({\n      axis, direction: [v], distance, event,\n    }) => {\n      event.preventDefault();\n      if (fittedZoom === zoom) {\n        const { clientWidth } = event.target;\n        if (axis === 'x'\n        && window.innerWidth / 4 < distance\n        && clientWidth * zoom < window.innerWidth) {\n          return v < 0 ? pageChanger(1)() : pageChanger(-1)();\n        }\n      }\n    },\n    // onPinchEnd: ({ movement: [d] }) => {\n    //   const zoomStep = Number(parseFloat(d / 1000).toFixed(1));\n    //   const newZoomValue = Number(((Math.round((zoom + zoomStep) * 10)) / 10).toFixed(2));\n    //   if (zoom !== newZoomValue && newZoomValue <= ZOOM_MAX) {\n    //     const minZoom = Math.min(fittedZoom, ZOOM_MIN);\n    //     setZoom(Math.max(newZoomValue, minZoom));\n    //   }\n    // },\n  });\n\n  return (\n    <>\n      <Modal\n        appElement={document.getElementById('root')}\n        className={classNames('jfPresentation jfFields', { black: isFullscreen })}\n        closeTimeoutMS={300}\n        contentLabel=\"Report Presentation\"\n        id=\"presentationModal\"\n        isOpen={true}\n        overlayClassName={classNames(\n          'jfPresentation-overlay',\n          { fixedPresentationBar: useFixedPresentationBar, isFullscreen },\n        )}\n        portalClassName=\"PresentationModal\"\n        shouldCloseOnEsc={false}\n        shouldFocusAfterRender={false}\n      >\n        {children(currentPage - 1, gesture)}\n        <PresentationBar\n          currentPage={currentPage}\n          fittedZoom={fittedZoom}\n          fitToScreen={fitToScreen}\n          isFullscreen={isFullscreen}\n          isVisible={(!isFullscreen || (isFullscreen && showControlsInFullScreen))}\n          onAnEventTrigger={onAnEventTrigger}\n          pageCount={pageCount}\n          presentationBarActions={presentationBarActions}\n          setCurrentPage={setCurrentPage}\n          setIsFullscreen={setIsFullscreen}\n          settings={settings}\n          setZoom={setZoom}\n          zoom={zoom}\n        />\n        <ProgressBar\n          currentPage={currentPage}\n          pageCount={pageCount}\n        />\n      </Modal>\n    </>\n  );\n};\n\nPresentationWrapper.propTypes = {\n  children: PropTypes.any,\n  presentationBarActions: PropTypes.arrayOf(PropTypes.shape({})),\n  useFixedPresentationBar: PropTypes.bool,\n};\n\nPresentationWrapper.defaultProps = {\n  children: () => {},\n  presentationBarActions: [],\n  useFixedPresentationBar: false,\n};\n\nexport default PresentationWrapper;\n"],"names":["PresentationWrapper","children","presentationBarActions","useFixedPresentationBar","usePropContext","onAnEventTrigger","settings","usePresentationContext","currentPage","fittedZoom","isFullscreen","pageCount","setCurrentPage","setFittedZoom","setIsFullscreen","setShowControlsInFullScreen","showControlsInFullScreen","useBuilderContext","setZoom","zoom","fitToScreen","useCallback","delay","setTimeout","newZoom","zoomHandler","handler","isModeCustomize","limitZoom","useProgressBar","useEffect","pageChanger","action","changePage","handleKeyboardEvent","e","keyCode","setControlVisibility","window","innerHeight","clientY","useEventListener","throttle","preventDefault","useFullscreenChange","gesture","useGesture","onDragEnd","axis","direction","v","distance","event","clientWidth","target","innerWidth","_jsx","_jsxs","Modal","document","getElementById","classNames","black","fixedPresentationBar","propTypes","PropTypes","any","arrayOf","shape","bool","defaultProps"],"mappings":"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"}

package/lib/cjs/components/Preview/StaticScene.js

@@ -2,11 +2,14 @@
 
 require('core-js/modules/es.array.concat.js');
 require('core-js/modules/es.array.map.js');
+require('core-js/modules/es.array.slice.js');
 require('core-js/modules/es.number.to-fixed.js');
 require('core-js/modules/es.object.to-string.js');
 require('core-js/modules/es.regexp.to-string.js');
 var React = require('react');
 var PropTypes = require('prop-types');
+var classNames$1 = require('classnames');
+var reactZoomPanPinch = require('react-zoom-pan-pinch');
 var classNames = require('../../constants/classNames.js');
 var StaticPage = require('./StaticPage.js');
 var propContext = require('../../utils/propContext.js');
@@ -20,6 +23,7 @@ var jsxRuntime = require('react/jsx-runtime');
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames$1);
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
@@ -39,6 +43,7 @@ var StaticScene = function StaticScene(_ref) {
       presentationPage = _ref.presentationPage;
 
   var _usePresentationConte = presentationContext.usePresentationContext(),
+      fittedZoom = _usePresentationConte.fittedZoom,
       isFullscreen = _usePresentationConte.isFullscreen,
       showControlsInFullScreen = _usePresentationConte.showControlsInFullScreen;
 
@@ -47,19 +52,11 @@ var StaticScene = function StaticScene(_ref) {
       settings = _usePropContext.settings;
 
   var _useBuilderContext = builderContext.useBuilderContext(),
+      setZoom = _useBuilderContext.setZoom,
       zoom = _useBuilderContext.zoom;
 
   var viewPortRef = React.useRef({});
-  var pageStyles = React.useRef({});
-  var pageContainerStyles = React.useRef({});
-  var zoomAdjusterStyles = React.useRef({});
-  zoom = mode === 'print' ? 1 : zoom;
-  React.useEffect(function () {
-    if (viewPortRef.current) {
-      viewPortRef.current.scrollTop = lastScrollPosition;
-    }
-  }, []); // set last scroll position after changing mode
-
+  var transformRefs = React.useRef([]);
   var reportBackgroundColor = settings.reportBackgroundColor,
       _settings$reportLayou = settings.reportLayout,
       reportLayout = _settings$reportLayou === void 0 ? 'A4 Landscape' : _settings$reportLayou,
@@ -71,31 +68,42 @@ var StaticScene = function StaticScene(_ref) {
       reportPageTransition = _settings$reportPageT === void 0 ? 'noAnimation' : _settings$reportPageT;
   var width = parseInt(reportLayoutWidth, 10);
   var height = parseInt(reportLayoutHeight, 10);
-  pageStyles.current = {
-    alignItems: 'center',
-    justifyContent: 'center'
-  };
-  pageContainerStyles.current = {
-    height: height,
-    transform: "scale(".concat(zoom, ")"),
-    transformOrigin: '0 0',
-    width: width
-  };
-  zoomAdjusterStyles.current = {
-    height: parseFloat((height * zoom).toFixed(1)),
-    margin: '0',
-    width: parseFloat((width * zoom).toFixed(1))
-  };
-
-  if (viewPortRef.current.clientWidth < zoomAdjusterStyles.current.width) {
-    delete pageStyles.current.justifyContent;
-  }
-
-  if (viewPortRef.current.clientHeight < zoomAdjusterStyles.current.height) {
-    delete pageStyles.current.alignItems;
-  }
+  React.useEffect(function () {
+    if (mode === 'print') {
+      setZoom(1);
+    }
+  }, [mode]);
+  React.useEffect(function () {
+    if (viewPortRef.current) {
+      viewPortRef.current.scrollTop = lastScrollPosition;
+    }
+  }, []); // set last scroll position after changing mode
 
+  React.useEffect(function () {
+    transformRefs.current = transformRefs.current.slice(0, pages.length);
+  }, [pages]);
+  var pageContainerStyles = React.useMemo(function () {
+    return {
+      height: height,
+      width: width
+    };
+  }, [width, height]);
   var transitionStyle = hooks.usePageTransition(reportPageTransition, presentationPage);
+  var handleZoom = React.useCallback(function (zoomPanPinch) {
+    var fixedValue = parseFloat(zoomPanPinch.state.scale.toFixed(2));
+    var roundValue = parseFloat((Math.round(fixedValue * 100) / 100).toFixed(1));
+
+    if (roundValue <= 2 && roundValue >= 0.5) {
+      setZoom(roundValue);
+    }
+  }, []);
+  React.useEffect(function () {
+    if (transformRefs.current.length > 0) {
+      for (var i = 0; i < pages.length; i++) {
+        transformRefs.current[i].centerView(zoom);
+      }
+    }
+  }, [pages.length, zoom, isFullscreen]);
   return /*#__PURE__*/jsxRuntime.jsxs("main", {
     className: classNames.mainWrapper,
     children: [/*#__PURE__*/jsxRuntime.jsx("div", _objectSpread(_objectSpread({
@@ -106,25 +114,49 @@ var StaticScene = function StaticScene(_ref) {
         className: "".concat(classNames.canvas, " ").concat(reportPageTransition),
         style: transitionStyle,
         children: pages.map(function (page, index) {
+          var _cNames;
+
           var backgroundColor = page.backgroundColor;
 
-          var style = _objectSpread(_objectSpread({}, pageContainerStyles.current), {}, {
+          var style = _objectSpread(_objectSpread({}, pageContainerStyles), {}, {
             backgroundColor: backgroundColor ? backgroundColor : reportBackgroundColor || '#fff'
           });
 
           return /*#__PURE__*/jsxRuntime.jsx("div", {
-            className: "".concat(classNames.page, " ").concat(string.slugify(reportLayout), " ").concat(index === presentationPage ? 'activePage' : ''),
-            style: pageStyles.current,
-            children: /*#__PURE__*/jsxRuntime.jsx("div", {
-              className: "jfReport-zoomAdjuster ".concat(mode !== 'preview' ? 'd-flex' : ''),
-              style: zoomAdjusterStyles.current,
-              children: /*#__PURE__*/jsxRuntime.jsx(StaticPage, {
-                acceptedItems: acceptedItems,
-                additionalPageItems: additionalPageItems,
-                hashCode: hashCode,
-                itemAccessor: itemAccessor,
-                items: page.items,
-                style: style
+            className: classNames__default['default']((_cNames = {}, _defineProperty(_cNames, classNames.page, true), _defineProperty(_cNames, string.slugify(reportLayout), true), _defineProperty(_cNames, "activePage", index === presentationPage), _cNames)),
+            children: /*#__PURE__*/jsxRuntime.jsx(reactZoomPanPinch.TransformWrapper, {
+              ref: function ref(element) {
+                transformRefs.current[index] = element;
+              },
+              centerOnInit: true,
+              centerZoomedOut: true,
+              disablePadding: true,
+              doubleClick: {
+                step: 0.2
+              },
+              initialScale: zoom,
+              maxScale: 2,
+              minScale: 0.5,
+              onZoom: handleZoom,
+              panning: {
+                disabled: zoom <= fittedZoom
+              },
+              pinch: {
+                step: 1
+              },
+              children: /*#__PURE__*/jsxRuntime.jsx(reactZoomPanPinch.TransformComponent, {
+                wrapperStyle: {
+                  height: '100%',
+                  width: '100%'
+                },
+                children: /*#__PURE__*/jsxRuntime.jsx(StaticPage, {
+                  acceptedItems: acceptedItems,
+                  additionalPageItems: additionalPageItems,
+                  hashCode: hashCode,
+                  itemAccessor: itemAccessor,
+                  items: page.items,
+                  style: style
+                })
               })
             })
           }, "page_".concat(index.toString()));

package/lib/cjs/components/Preview/StaticScene.js.map

@@ -1 +1 @@
-{"version":3,"file":"StaticScene.js","sources":["../../../../src/components/Preview/StaticScene.js"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport * as classNames from '../../constants/classNames';\nimport StaticPage from './StaticPage';\nimport { usePropContext } from '../../utils/propContext';\nimport { useBuilderContext } from '../../utils/builderContext';\nimport { slugify } from '../../utils/string';\nimport { usePageTransition } from '../../utils/hooks';\nimport { usePresentationContext } from '../../utils/presentationContext';\nimport ZoomControls from '../Builder/ZoomControls';\n\nconst StaticScene = ({\n  additionalPageItems,\n  gesture,\n  hashCode,\n  hideZoom,\n  itemAccessor,\n  lastScrollPosition,\n  mode,\n  pages,\n  presentationPage,\n}) => {\n  const { isFullscreen, showControlsInFullScreen } = usePresentationContext();\n  const { acceptedItems, settings } = usePropContext();\n  let { zoom } = useBuilderContext();\n  const viewPortRef = useRef({});\n  const pageStyles = useRef({});\n  const pageContainerStyles = useRef({});\n  const zoomAdjusterStyles = useRef({});\n  zoom = mode === 'print' ? 1 : zoom;\n  useEffect(() => {\n    if (viewPortRef.current) {\n      viewPortRef.current.scrollTop = lastScrollPosition;\n    }\n  }, []); // set last scroll position after changing mode\n\n  const {\n    reportBackgroundColor,\n    reportLayout = 'A4 Landscape',\n    reportLayoutHeight = 794,\n    reportLayoutWidth = 1123,\n    reportPageTransition = 'noAnimation',\n  } = settings;\n  const width = parseInt(reportLayoutWidth, 10);\n  const height = parseInt(reportLayoutHeight, 10);\n  pageStyles.current = {\n    alignItems: 'center',\n    justifyContent: 'center',\n  };\n  pageContainerStyles.current = {\n    height,\n    transform: `scale(${zoom})`,\n    transformOrigin: '0 0',\n    width,\n  };\n  zoomAdjusterStyles.current = {\n    height: parseFloat((height * zoom).toFixed(1)),\n    margin: '0',\n    width: parseFloat((width * zoom).toFixed(1)),\n  };\n\n  if (viewPortRef.current.clientWidth < zoomAdjusterStyles.current.width) {\n    delete pageStyles.current.justifyContent;\n  }\n\n  if (viewPortRef.current.clientHeight < zoomAdjusterStyles.current.height) {\n    delete pageStyles.current.alignItems;\n  }\n\n  const transitionStyle = usePageTransition(reportPageTransition, presentationPage);\n\n  return (\n    <main\n      className={classNames.mainWrapper}\n    >\n      <div\n        ref={viewPortRef}\n        className={classNames.viewport}\n        {...gesture()}\n      >\n        <div\n          className={`${classNames.canvas} ${reportPageTransition}`}\n          style={transitionStyle}\n        >\n          {pages.map((page, index) => {\n            const { backgroundColor } = page;\n            const style = {\n              ...pageContainerStyles.current,\n              backgroundColor: backgroundColor ? backgroundColor : reportBackgroundColor || '#fff',\n            };\n            return (\n              <div\n                key={`page_${index.toString()}`}\n                className={`${\n                  classNames.page\n                } ${\n                  slugify(reportLayout)\n                } ${\n                  index === presentationPage ? 'activePage' : ''\n                }`}\n                style={pageStyles.current}\n              >\n                <div\n                  className={`jfReport-zoomAdjuster ${mode !== 'preview' ? 'd-flex' : ''}`}\n                  style={zoomAdjusterStyles.current}\n                >\n                  <StaticPage\n                    acceptedItems={acceptedItems}\n                    additionalPageItems={additionalPageItems}\n                    hashCode={hashCode}\n                    itemAccessor={itemAccessor}\n                    items={page.items}\n                    style={style}\n                  />\n                </div>\n              </div>\n            );\n          })}\n        </div>\n      </div>\n      <ZoomControls\n        pages={pages}\n        showZoom={(!isFullscreen || (isFullscreen && showControlsInFullScreen)) && !hideZoom}\n      />\n    </main>\n  );\n};\n\nStaticScene.propTypes = {\n  additionalPageItems: PropTypes.arrayOf(PropTypes.node),\n  gesture: PropTypes.func,\n  hashCode: PropTypes.string,\n  hideZoom: PropTypes.bool,\n  itemAccessor: PropTypes.func,\n  lastScrollPosition: PropTypes.number,\n  mode: PropTypes.string,\n  pages: PropTypes.arrayOf(PropTypes.shape({})),\n  presentationPage: PropTypes.number,\n};\n\nStaticScene.defaultProps = {\n  additionalPageItems: [],\n  gesture: () => {},\n  hashCode: '',\n  hideZoom: false,\n  itemAccessor: () => {},\n  lastScrollPosition: 0,\n  mode: 'preview',\n  pages: [],\n  presentationPage: 0,\n};\n\nexport default StaticScene;\n"],"names":["StaticScene","additionalPageItems","gesture","hashCode","hideZoom","itemAccessor","lastScrollPosition","mode","pages","presentationPage","usePresentationContext","isFullscreen","showControlsInFullScreen","usePropContext","acceptedItems","settings","useBuilderContext","zoom","viewPortRef","useRef","pageStyles","pageContainerStyles","zoomAdjusterStyles","useEffect","current","scrollTop","reportBackgroundColor","reportLayout","reportLayoutHeight","reportLayoutWidth","reportPageTransition","width","parseInt","height","alignItems","justifyContent","transform","transformOrigin","parseFloat","toFixed","margin","clientWidth","clientHeight","transitionStyle","usePageTransition","_jsxs","classNames","_jsx","map","page","index","backgroundColor","style","slugify","items","toString","propTypes","PropTypes","arrayOf","node","func","string","bool","number","shape","defaultProps"],"mappings":"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"}
+{"version":3,"file":"StaticScene.js","sources":["../../../../src/components/Preview/StaticScene.js"],"sourcesContent":["import {\n  useCallback, useEffect, useMemo, useRef,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport cNames from 'classnames';\nimport { TransformWrapper, TransformComponent } from 'react-zoom-pan-pinch';\nimport * as classNames from '../../constants/classNames';\nimport StaticPage from './StaticPage';\nimport { usePropContext } from '../../utils/propContext';\nimport { useBuilderContext } from '../../utils/builderContext';\nimport { slugify } from '../../utils/string';\nimport { usePageTransition } from '../../utils/hooks';\nimport { usePresentationContext } from '../../utils/presentationContext';\nimport ZoomControls from '../Builder/ZoomControls';\n\nconst StaticScene = ({\n  additionalPageItems,\n  gesture,\n  hashCode,\n  hideZoom,\n  itemAccessor,\n  lastScrollPosition,\n  mode,\n  pages,\n  presentationPage,\n}) => {\n  const { fittedZoom, isFullscreen, showControlsInFullScreen } = usePresentationContext();\n  const { acceptedItems, settings } = usePropContext();\n  const { setZoom, zoom } = useBuilderContext();\n  const viewPortRef = useRef({});\n  const transformRefs = useRef([]);\n\n  const {\n    reportBackgroundColor,\n    reportLayout = 'A4 Landscape',\n    reportLayoutHeight = 794,\n    reportLayoutWidth = 1123,\n    reportPageTransition = 'noAnimation',\n  } = settings;\n  const width = parseInt(reportLayoutWidth, 10);\n  const height = parseInt(reportLayoutHeight, 10);\n\n  useEffect(() => {\n    if (mode === 'print') {\n      setZoom(1);\n    }\n  }, [mode]);\n\n  useEffect(() => {\n    if (viewPortRef.current) {\n      viewPortRef.current.scrollTop = lastScrollPosition;\n    }\n  }, []); // set last scroll position after changing mode\n\n  useEffect(() => {\n    transformRefs.current = transformRefs.current.slice(0, pages.length);\n  }, [pages]);\n\n  const pageContainerStyles = useMemo(() => ({\n    height,\n    width,\n  }), [width, height]);\n\n  const transitionStyle = usePageTransition(reportPageTransition, presentationPage);\n\n  const handleZoom = useCallback(zoomPanPinch => {\n    const fixedValue = parseFloat(zoomPanPinch.state.scale.toFixed(2));\n    const roundValue = parseFloat((Math.round((fixedValue * 100)) / 100).toFixed(1));\n    if (roundValue <= 2 && roundValue >= 0.5) {\n      setZoom(roundValue);\n    }\n  }, []);\n\n  useEffect(() => {\n    if (transformRefs.current.length > 0) {\n      for (let i = 0; i < pages.length; i++) {\n        transformRefs.current[i].centerView(zoom);\n      }\n    }\n  }, [pages.length, zoom, isFullscreen]);\n\n  return (\n    <main\n      className={classNames.mainWrapper}\n    >\n      <div\n        ref={viewPortRef}\n        className={classNames.viewport}\n        {...gesture()}\n      >\n        <div\n          className={`${classNames.canvas} ${reportPageTransition}`}\n          style={transitionStyle}\n        >\n          {pages.map((page, index) => {\n            const { backgroundColor } = page;\n            const style = {\n              ...pageContainerStyles,\n              backgroundColor: backgroundColor ? backgroundColor : reportBackgroundColor || '#fff',\n            };\n            return (\n              <div\n                key={`page_${index.toString()}`}\n                className={cNames({\n                  [classNames.page]: true,\n                  [slugify(reportLayout)]: true,\n                  activePage: index === presentationPage,\n                })}\n              >\n                <TransformWrapper\n                  ref={element => { transformRefs.current[index] = element; }}\n                  centerOnInit={true}\n                  centerZoomedOut={true}\n                  disablePadding={true}\n                  doubleClick={{\n                    step: 0.2,\n                  }}\n                  initialScale={zoom}\n                  maxScale={2}\n                  minScale={0.5}\n                  onZoom={handleZoom}\n                  panning={{\n                    disabled: zoom <= fittedZoom,\n                  }}\n                  pinch={{\n                    step: 1,\n                  }}\n                >\n                  <TransformComponent\n                    wrapperStyle={{ height: '100%', width: '100%' }}\n                  >\n                    <StaticPage\n                      acceptedItems={acceptedItems}\n                      additionalPageItems={additionalPageItems}\n                      hashCode={hashCode}\n                      itemAccessor={itemAccessor}\n                      items={page.items}\n                      style={style}\n                    />\n                  </TransformComponent>\n                </TransformWrapper>\n              </div>\n            );\n          })}\n        </div>\n      </div>\n      <ZoomControls\n        pages={pages}\n        showZoom={(!isFullscreen || (isFullscreen && showControlsInFullScreen)) && !hideZoom}\n      />\n    </main>\n  );\n};\n\nStaticScene.propTypes = {\n  additionalPageItems: PropTypes.arrayOf(PropTypes.node),\n  gesture: PropTypes.func,\n  hashCode: PropTypes.string,\n  hideZoom: PropTypes.bool,\n  itemAccessor: PropTypes.func,\n  lastScrollPosition: PropTypes.number,\n  mode: PropTypes.string,\n  pages: PropTypes.arrayOf(PropTypes.shape({})),\n  presentationPage: PropTypes.number,\n};\n\nStaticScene.defaultProps = {\n  additionalPageItems: [],\n  gesture: () => {},\n  hashCode: '',\n  hideZoom: false,\n  itemAccessor: () => {},\n  lastScrollPosition: 0,\n  mode: 'preview',\n  pages: [],\n  presentationPage: 0,\n};\n\nexport default StaticScene;\n"],"names":["StaticScene","additionalPageItems","gesture","hashCode","hideZoom","itemAccessor","lastScrollPosition","mode","pages","presentationPage","usePresentationContext","fittedZoom","isFullscreen","showControlsInFullScreen","usePropContext","acceptedItems","settings","useBuilderContext","setZoom","zoom","viewPortRef","useRef","transformRefs","reportBackgroundColor","reportLayout","reportLayoutHeight","reportLayoutWidth","reportPageTransition","width","parseInt","height","useEffect","current","scrollTop","slice","length","pageContainerStyles","useMemo","transitionStyle","usePageTransition","handleZoom","useCallback","zoomPanPinch","fixedValue","parseFloat","state","scale","toFixed","roundValue","Math","round","i","centerView","_jsxs","classNames","_jsx","map","page","index","backgroundColor","style","cNames","slugify","TransformWrapper","element","step","disabled","TransformComponent","items","toString","propTypes","PropTypes","arrayOf","node","func","string","bool","number","shape","defaultProps"],"mappings":"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"}

package/lib/cjs/utils/presentationContext.js

@@ -36,6 +36,7 @@ function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.g
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 var PresentationContext = /*#__PURE__*/React.createContext({
   currentPage: 1,
+  fittedZoom: 1,
   isFullscreen: false,
   pageCount: 0,
   showZoomInFullScreen: false
@@ -80,11 +81,18 @@ var PresentationProvider = /*#__PURE__*/function (_React$Component) {
       });
     });
 
+    _defineProperty(_assertThisInitialized(_this), "setFittedZoom", function (fittedZoom) {
+      _this.setState({
+        fittedZoom: fittedZoom
+      });
+    });
+
     _this.state = {
       currentPage: props.currentPage,
       isFullscreen: props.isFullscreen,
       pageCount: props.pageCount,
       setCurrentPage: _this.setCurrentPage,
+      setFittedZoom: _this.setFittedZoom,
       setIsFullscreen: _this.setIsFullscreen,
       setShowControlsInFullScreen: _this.setShowControlsInFullScreen
     };

package/lib/cjs/utils/presentationContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"presentationContext.js","sources":["../../../src/utils/presentationContext.js"],"sourcesContent":["/* eslint-disable react/no-unused-state */\nimport React, { createContext, useContext } from 'react';\nimport PropTypes from 'prop-types';\n\nexport const PresentationContext = createContext({\n  currentPage: 1,\n  isFullscreen: false,\n  pageCount: 0,\n  showZoomInFullScreen: false,\n});\n\nexport const usePresentationContext = () => {\n  const context = useContext(PresentationContext);\n  if (!context) {\n    throw new Error('PresentationContext must be used with PresentationProvider!');\n  }\n  return context;\n};\n\nexport class PresentationProvider extends React.Component {\n  static getDerivedStateFromProps(nextProps, prevState) {\n    const updates = {};\n    const {\n      pageCount,\n    } = prevState;\n\n    if (nextProps.pageCount !== pageCount) {\n      updates.pageCount = nextProps.pageCount;\n    }\n\n    return updates;\n  }\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      currentPage: props.currentPage,\n      isFullscreen: props.isFullscreen,\n      pageCount: props.pageCount,\n      setCurrentPage: this.setCurrentPage,\n      setIsFullscreen: this.setIsFullscreen,\n      setShowControlsInFullScreen: this.setShowControlsInFullScreen,\n    };\n  }\n\n  setCurrentPage = currentPage => {\n    this.setState({ currentPage });\n  };\n\n  setIsFullscreen = isFullscreen => {\n    this.setState({ isFullscreen, showControlsInFullScreen: false });\n  };\n\n  setShowControlsInFullScreen = showControlsInFullScreen => {\n    this.setState({ showControlsInFullScreen });\n  }\n\n  render() {\n    const { children } = this.props;\n    return (\n      <PresentationContext.Provider value={this.state}>\n        {children}\n      </PresentationContext.Provider>\n    );\n  }\n}\n\nPresentationProvider.propTypes = {\n  children: PropTypes.any,\n  currentPage: PropTypes.number,\n  isFullscreen: PropTypes.bool,\n  pageCount: PropTypes.number,\n};\n\nPresentationProvider.defaultProps = {\n  children: null,\n  currentPage: 1,\n  isFullscreen: false,\n  pageCount: 1,\n};\n\nexport const PresentationConsumer = PresentationContext.Consumer;\n"],"names":["PresentationContext","createContext","currentPage","isFullscreen","pageCount","showZoomInFullScreen","usePresentationContext","context","useContext","Error","PresentationProvider","props","setState","showControlsInFullScreen","state","setCurrentPage","setIsFullscreen","setShowControlsInFullScreen","children","_jsx","nextProps","prevState","updates","React","Component","propTypes","PropTypes","any","number","bool","defaultProps","Consumer"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAIaA,mBAAmB,gBAAGC,mBAAa,CAAC;AAC/CC,EAAAA,WAAW,EAAE,CADkC;AAE/CC,EAAAA,YAAY,EAAE,KAFiC;AAG/CC,EAAAA,SAAS,EAAE,CAHoC;AAI/CC,EAAAA,oBAAoB,EAAE;AAJyB,CAAD;IAOnCC,sBAAsB,GAAG,SAAzBA,sBAAyB,GAAM;AAC1C,MAAMC,OAAO,GAAGC,gBAAU,CAACR,mBAAD,CAA1B;;AACA,MAAI,CAACO,OAAL,EAAc;AACZ,UAAM,IAAIE,KAAJ,CAAU,6DAAV,CAAN;AACD;;AACD,SAAOF,OAAP;AACD;IAEYG,oBAAb;AAAA;;AAAA;;AAcE,gCAAYC,KAAZ,EAAmB;AAAA;;AAAA;;AACjB,8BAAMA,KAAN;;AADiB,qEAYF,UAAAT,WAAW,EAAI;AAC9B,YAAKU,QAAL,CAAc;AAAEV,QAAAA,WAAW,EAAXA;AAAF,OAAd;AACD,KAdkB;;AAAA,sEAgBD,UAAAC,YAAY,EAAI;AAChC,YAAKS,QAAL,CAAc;AAAET,QAAAA,YAAY,EAAZA,YAAF;AAAgBU,QAAAA,wBAAwB,EAAE;AAA1C,OAAd;AACD,KAlBkB;;AAAA,kFAoBW,UAAAA,wBAAwB,EAAI;AACxD,YAAKD,QAAL,CAAc;AAAEC,QAAAA,wBAAwB,EAAxBA;AAAF,OAAd;AACD,KAtBkB;;AAEjB,UAAKC,KAAL,GAAa;AACXZ,MAAAA,WAAW,EAAES,KAAK,CAACT,WADR;AAEXC,MAAAA,YAAY,EAAEQ,KAAK,CAACR,YAFT;AAGXC,MAAAA,SAAS,EAAEO,KAAK,CAACP,SAHN;AAIXW,MAAAA,cAAc,EAAE,MAAKA,cAJV;AAKXC,MAAAA,eAAe,EAAE,MAAKA,eALX;AAMXC,MAAAA,2BAA2B,EAAE,MAAKA;AANvB,KAAb;AAFiB;AAUlB;;AAxBH;AAAA;AAAA,WAsCE,kBAAS;AACP,UAAQC,QAAR,GAAqB,KAAKP,KAA1B,CAAQO,QAAR;AACA,0BACEC,eAAC,mBAAD,CAAqB,QAArB;AAA8B,QAAA,KAAK,EAAE,KAAKL,KAA1C;AAAA,kBACGI;AADH,QADF;AAKD;AA7CH;AAAA;AAAA,WACE,kCAAgCE,SAAhC,EAA2CC,SAA3C,EAAsD;AACpD,UAAMC,OAAO,GAAG,EAAhB;AACA,UACElB,SADF,GAEIiB,SAFJ,CACEjB,SADF;;AAIA,UAAIgB,SAAS,CAAChB,SAAV,KAAwBA,SAA5B,EAAuC;AACrCkB,QAAAA,OAAO,CAAClB,SAAR,GAAoBgB,SAAS,CAAChB,SAA9B;AACD;;AAED,aAAOkB,OAAP;AACD;AAZH;;AAAA;AAAA,EAA0CC,yBAAK,CAACC,SAAhD;AAgDAd,oBAAoB,CAACe,SAArB,GAAiC;AAC/BP,EAAAA,QAAQ,EAAEQ,6BAAS,CAACC,GADW;AAE/BzB,EAAAA,WAAW,EAAEwB,6BAAS,CAACE,MAFQ;AAG/BzB,EAAAA,YAAY,EAAEuB,6BAAS,CAACG,IAHO;AAI/BzB,EAAAA,SAAS,EAAEsB,6BAAS,CAACE;AAJU,CAAjC;AAOAlB,oBAAoB,CAACoB,YAArB,GAAoC;AAClCZ,EAAAA,QAAQ,EAAE,IADwB;AAElChB,EAAAA,WAAW,EAAE,CAFqB;AAGlCC,EAAAA,YAAY,EAAE,KAHoB;AAIlCC,EAAAA,SAAS,EAAE;AAJuB,CAApC;AAOoCJ,mBAAmB,CAAC+B;;;;;;"}
+{"version":3,"file":"presentationContext.js","sources":["../../../src/utils/presentationContext.js"],"sourcesContent":["/* eslint-disable react/no-unused-state */\nimport React, { createContext, useContext } from 'react';\nimport PropTypes from 'prop-types';\n\nexport const PresentationContext = createContext({\n  currentPage: 1,\n  fittedZoom: 1,\n  isFullscreen: false,\n  pageCount: 0,\n  showZoomInFullScreen: false,\n});\n\nexport const usePresentationContext = () => {\n  const context = useContext(PresentationContext);\n  if (!context) {\n    throw new Error('PresentationContext must be used with PresentationProvider!');\n  }\n  return context;\n};\n\nexport class PresentationProvider extends React.Component {\n  static getDerivedStateFromProps(nextProps, prevState) {\n    const updates = {};\n    const {\n      pageCount,\n    } = prevState;\n\n    if (nextProps.pageCount !== pageCount) {\n      updates.pageCount = nextProps.pageCount;\n    }\n\n    return updates;\n  }\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      currentPage: props.currentPage,\n      isFullscreen: props.isFullscreen,\n      pageCount: props.pageCount,\n      setCurrentPage: this.setCurrentPage,\n      setFittedZoom: this.setFittedZoom,\n      setIsFullscreen: this.setIsFullscreen,\n      setShowControlsInFullScreen: this.setShowControlsInFullScreen,\n    };\n  }\n\n  setCurrentPage = currentPage => {\n    this.setState({ currentPage });\n  };\n\n  setIsFullscreen = isFullscreen => {\n    this.setState({ isFullscreen, showControlsInFullScreen: false });\n  };\n\n  setShowControlsInFullScreen = showControlsInFullScreen => {\n    this.setState({ showControlsInFullScreen });\n  }\n\n  setFittedZoom = fittedZoom => {\n    this.setState({ fittedZoom });\n  }\n\n  render() {\n    const { children } = this.props;\n    return (\n      <PresentationContext.Provider value={this.state}>\n        {children}\n      </PresentationContext.Provider>\n    );\n  }\n}\n\nPresentationProvider.propTypes = {\n  children: PropTypes.any,\n  currentPage: PropTypes.number,\n  isFullscreen: PropTypes.bool,\n  pageCount: PropTypes.number,\n};\n\nPresentationProvider.defaultProps = {\n  children: null,\n  currentPage: 1,\n  isFullscreen: false,\n  pageCount: 1,\n};\n\nexport const PresentationConsumer = PresentationContext.Consumer;\n"],"names":["PresentationContext","createContext","currentPage","fittedZoom","isFullscreen","pageCount","showZoomInFullScreen","usePresentationContext","context","useContext","Error","PresentationProvider","props","setState","showControlsInFullScreen","state","setCurrentPage","setFittedZoom","setIsFullscreen","setShowControlsInFullScreen","children","_jsx","nextProps","prevState","updates","React","Component","propTypes","PropTypes","any","number","bool","defaultProps","Consumer"],"mappings":"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"}

package/lib/esm/components/Presentation/PresentationWrapper.js

@@ -1,4 +1,4 @@
-import { useState, useCallback, useEffect } from 'react';
+import { useCallback, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import Modal from 'react-modal';
 import classNames from 'classnames';
@@ -35,9 +35,11 @@ var PresentationWrapper = function PresentationWrapper(_ref) {
 
   var _usePresentationConte = usePresentationContext(),
       currentPage = _usePresentationConte.currentPage,
+      fittedZoom = _usePresentationConte.fittedZoom,
       isFullscreen = _usePresentationConte.isFullscreen,
       pageCount = _usePresentationConte.pageCount,
       setCurrentPage = _usePresentationConte.setCurrentPage,
+      setFittedZoom = _usePresentationConte.setFittedZoom,
       setIsFullscreen = _usePresentationConte.setIsFullscreen,
       setShowControlsInFullScreen = _usePresentationConte.setShowControlsInFullScreen,
       showControlsInFullScreen = _usePresentationConte.showControlsInFullScreen;
@@ -46,11 +48,6 @@ var PresentationWrapper = function PresentationWrapper(_ref) {
       setZoom = _useBuilderContext.setZoom,
       zoom = _useBuilderContext.zoom;
 
-  var _useState = useState(1),
-      _useState2 = _slicedToArray(_useState, 2),
-      fittedZoom = _useState2[0],
-      setFittedZoom = _useState2[1];
-
   var fitToScreen = useCallback(function () {
     var delay = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
     return setTimeout(function () {
@@ -67,8 +64,8 @@ var PresentationWrapper = function PresentationWrapper(_ref) {
     }, delay);
   }, [settings, isFullscreen, useFixedPresentationBar, pageCount]);
   useEffect(function () {
-    fitToScreen();
-  }, []);
+    fitToScreen(100);
+  }, [isFullscreen]);
   useEffect(function () {
     if (isFullscreen) {
       setShowControlsInFullScreen(true);
@@ -124,10 +121,13 @@ var PresentationWrapper = function PresentationWrapper(_ref) {
           event = _ref2.event;
 
       event.preventDefault();
-      var clientWidth = event.target.clientWidth;
 
-      if (axis === 'x' && window.innerWidth / 4 < distance && clientWidth * zoom < window.innerWidth) {
-        return v < 0 ? pageChanger(1)() : pageChanger(-1)();
+      if (fittedZoom === zoom) {
+        var clientWidth = event.target.clientWidth;
+
+        if (axis === 'x' && window.innerWidth / 4 < distance && clientWidth * zoom < window.innerWidth) {
+          return v < 0 ? pageChanger(1)() : pageChanger(-1)();
+        }
       }
     } // onPinchEnd: ({ movement: [d] }) => {
     //   const zoomStep = Number(parseFloat(d / 1000).toFixed(1));

package/lib/esm/components/Presentation/PresentationWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"PresentationWrapper.js","sources":["../../../../src/components/Presentation/PresentationWrapper.js"],"sourcesContent":["import {\n  useCallback,\n  useEffect,\n  useState,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport Modal from 'react-modal';\nimport classNames from 'classnames';\nimport { useGesture } from 'react-use-gesture';\nimport PresentationBar from './PresentationBar';\nimport ProgressBar from './ProgressBar';\nimport { useBuilderContext } from '../../utils/builderContext';\nimport { useEventListener, useFullscreenChange } from '../../utils/hooks';\nimport {\n  changePage,\n  throttle,\n  zoomHandler,\n} from '../../utils/functions';\nimport { usePresentationContext } from '../../utils/presentationContext';\nimport { usePropContext } from '../../utils/propContext';\n// import { ZOOM_MIN, ZOOM_MAX } from '../../constants/zoom';\n\nconst PresentationWrapper = ({\n  children,\n  presentationBarActions,\n  useFixedPresentationBar,\n}) => {\n  const { onAnEventTrigger, settings } = usePropContext();\n  const {\n    currentPage,\n    isFullscreen,\n    pageCount,\n    setCurrentPage,\n    setIsFullscreen,\n    setShowControlsInFullScreen,\n    showControlsInFullScreen,\n  } = usePresentationContext();\n\n  const { setZoom, zoom } = useBuilderContext();\n  const [fittedZoom, setFittedZoom] = useState(1);\n\n  const fitToScreen = useCallback((delay = 0) => setTimeout(() => {\n    const newZoom = zoomHandler({\n      handler: setZoom,\n      isFullscreen,\n      isModeCustomize: false,\n      limitZoom: false,\n      settings,\n      useFixedPresentationBar,\n      useProgressBar: pageCount > 2,\n    });\n    setFittedZoom(newZoom);\n  }, delay), [settings, isFullscreen, useFixedPresentationBar, pageCount]);\n\n  useEffect(() => { fitToScreen(); }, []);\n\n  useEffect(() => {\n    if (isFullscreen) {\n      setShowControlsInFullScreen(true);\n      setTimeout(() => setShowControlsInFullScreen(false), 1500);\n    }\n  }, [isFullscreen]);\n\n  const pageChanger = action => changePage({\n    action,\n    currentPage,\n    pageCount,\n    setCurrentPage,\n  });\n\n  const handleKeyboardEvent = useCallback(e => {\n    if (e.keyCode === 39) {\n      pageChanger(1)();\n    } else if (e.keyCode === 37) {\n      pageChanger(-1)();\n    }\n  });\n\n  const setControlVisibility = e => {\n    // TODO :: timeout in n out for better ux\n    if (!isFullscreen) return;\n    if (showControlsInFullScreen && window.innerHeight - e.clientY >= 200) {\n      setShowControlsInFullScreen(false);\n    } else if (!showControlsInFullScreen && window.innerHeight - e.clientY < 200) {\n      setShowControlsInFullScreen(true);\n    }\n  };\n\n  useEventListener('keydown', handleKeyboardEvent);\n  useEventListener('mousemove', throttle(setControlVisibility, 150));\n  useEventListener('gesturestart', e => e.preventDefault());\n  useEventListener('gesturechange', e => e.preventDefault());\n  useFullscreenChange(isFullscreen, setIsFullscreen, fitToScreen);\n\n  const gesture = useGesture({\n    onDragEnd: ({\n      axis, direction: [v], distance, event,\n    }) => {\n      event.preventDefault();\n      const { clientWidth } = event.target;\n      if (axis === 'x'\n      && window.innerWidth / 4 < distance\n      && clientWidth * zoom < window.innerWidth) {\n        return v < 0 ? pageChanger(1)() : pageChanger(-1)();\n      }\n    },\n    // onPinchEnd: ({ movement: [d] }) => {\n    //   const zoomStep = Number(parseFloat(d / 1000).toFixed(1));\n    //   const newZoomValue = Number(((Math.round((zoom + zoomStep) * 10)) / 10).toFixed(2));\n    //   if (zoom !== newZoomValue && newZoomValue <= ZOOM_MAX) {\n    //     const minZoom = Math.min(fittedZoom, ZOOM_MIN);\n    //     setZoom(Math.max(newZoomValue, minZoom));\n    //   }\n    // },\n  });\n\n  return (\n    <>\n      <Modal\n        appElement={document.getElementById('root')}\n        className={classNames('jfPresentation jfFields', { black: isFullscreen })}\n        closeTimeoutMS={300}\n        contentLabel=\"Report Presentation\"\n        id=\"presentationModal\"\n        isOpen={true}\n        overlayClassName={classNames(\n          'jfPresentation-overlay',\n          { fixedPresentationBar: useFixedPresentationBar, isFullscreen },\n        )}\n        portalClassName=\"PresentationModal\"\n        shouldCloseOnEsc={false}\n        shouldFocusAfterRender={false}\n      >\n        {children(currentPage - 1, gesture)}\n        <PresentationBar\n          currentPage={currentPage}\n          fittedZoom={fittedZoom}\n          fitToScreen={fitToScreen}\n          isFullscreen={isFullscreen}\n          isVisible={(!isFullscreen || (isFullscreen && showControlsInFullScreen))}\n          onAnEventTrigger={onAnEventTrigger}\n          pageCount={pageCount}\n          presentationBarActions={presentationBarActions}\n          setCurrentPage={setCurrentPage}\n          setIsFullscreen={setIsFullscreen}\n          settings={settings}\n          setZoom={setZoom}\n          zoom={zoom}\n        />\n        <ProgressBar\n          currentPage={currentPage}\n          pageCount={pageCount}\n        />\n      </Modal>\n    </>\n  );\n};\n\nPresentationWrapper.propTypes = {\n  children: PropTypes.any,\n  presentationBarActions: PropTypes.arrayOf(PropTypes.shape({})),\n  useFixedPresentationBar: PropTypes.bool,\n};\n\nPresentationWrapper.defaultProps = {\n  children: () => {},\n  presentationBarActions: [],\n  useFixedPresentationBar: false,\n};\n\nexport default PresentationWrapper;\n"],"names":["PresentationWrapper","children","presentationBarActions","useFixedPresentationBar","usePropContext","onAnEventTrigger","settings","usePresentationContext","currentPage","isFullscreen","pageCount","setCurrentPage","setIsFullscreen","setShowControlsInFullScreen","showControlsInFullScreen","useBuilderContext","setZoom","zoom","useState","fittedZoom","setFittedZoom","fitToScreen","useCallback","delay","setTimeout","newZoom","zoomHandler","handler","isModeCustomize","limitZoom","useProgressBar","useEffect","pageChanger","action","changePage","handleKeyboardEvent","e","keyCode","setControlVisibility","window","innerHeight","clientY","useEventListener","throttle","preventDefault","useFullscreenChange","gesture","useGesture","onDragEnd","axis","direction","v","distance","event","clientWidth","target","innerWidth","_jsx","_jsxs","document","getElementById","classNames","black","fixedPresentationBar","propTypes","PropTypes","any","arrayOf","shape","bool","defaultProps"],"mappings":"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"}
+{"version":3,"file":"PresentationWrapper.js","sources":["../../../../src/components/Presentation/PresentationWrapper.js"],"sourcesContent":["import {\n  useCallback,\n  useEffect,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport Modal from 'react-modal';\nimport classNames from 'classnames';\nimport { useGesture } from 'react-use-gesture';\nimport PresentationBar from './PresentationBar';\nimport ProgressBar from './ProgressBar';\nimport { useBuilderContext } from '../../utils/builderContext';\nimport { useEventListener, useFullscreenChange } from '../../utils/hooks';\nimport {\n  changePage,\n  throttle,\n  zoomHandler,\n} from '../../utils/functions';\nimport { usePresentationContext } from '../../utils/presentationContext';\nimport { usePropContext } from '../../utils/propContext';\n// import { ZOOM_MIN, ZOOM_MAX } from '../../constants/zoom';\n\nconst PresentationWrapper = ({\n  children,\n  presentationBarActions,\n  useFixedPresentationBar,\n}) => {\n  const { onAnEventTrigger, settings } = usePropContext();\n  const {\n    currentPage,\n    fittedZoom,\n    isFullscreen,\n    pageCount,\n    setCurrentPage,\n    setFittedZoom,\n    setIsFullscreen,\n    setShowControlsInFullScreen,\n    showControlsInFullScreen,\n  } = usePresentationContext();\n\n  const { setZoom, zoom } = useBuilderContext();\n\n  const fitToScreen = useCallback((delay = 0) => setTimeout(() => {\n    const newZoom = zoomHandler({\n      handler: setZoom,\n      isFullscreen,\n      isModeCustomize: false,\n      limitZoom: false,\n      settings,\n      useFixedPresentationBar,\n      useProgressBar: pageCount > 2,\n    });\n    setFittedZoom(newZoom);\n  }, delay), [settings, isFullscreen, useFixedPresentationBar, pageCount]);\n\n  useEffect(() => { fitToScreen(100); }, [isFullscreen]);\n\n  useEffect(() => {\n    if (isFullscreen) {\n      setShowControlsInFullScreen(true);\n      setTimeout(() => setShowControlsInFullScreen(false), 1500);\n    }\n  }, [isFullscreen]);\n\n  const pageChanger = action => changePage({\n    action,\n    currentPage,\n    pageCount,\n    setCurrentPage,\n  });\n\n  const handleKeyboardEvent = useCallback(e => {\n    if (e.keyCode === 39) {\n      pageChanger(1)();\n    } else if (e.keyCode === 37) {\n      pageChanger(-1)();\n    }\n  });\n\n  const setControlVisibility = e => {\n    // TODO :: timeout in n out for better ux\n    if (!isFullscreen) return;\n    if (showControlsInFullScreen && window.innerHeight - e.clientY >= 200) {\n      setShowControlsInFullScreen(false);\n    } else if (!showControlsInFullScreen && window.innerHeight - e.clientY < 200) {\n      setShowControlsInFullScreen(true);\n    }\n  };\n\n  useEventListener('keydown', handleKeyboardEvent);\n  useEventListener('mousemove', throttle(setControlVisibility, 150));\n  useEventListener('gesturestart', e => e.preventDefault());\n  useEventListener('gesturechange', e => e.preventDefault());\n  useFullscreenChange(isFullscreen, setIsFullscreen, fitToScreen);\n\n  const gesture = useGesture({\n    onDragEnd: ({\n      axis, direction: [v], distance, event,\n    }) => {\n      event.preventDefault();\n      if (fittedZoom === zoom) {\n        const { clientWidth } = event.target;\n        if (axis === 'x'\n        && window.innerWidth / 4 < distance\n        && clientWidth * zoom < window.innerWidth) {\n          return v < 0 ? pageChanger(1)() : pageChanger(-1)();\n        }\n      }\n    },\n    // onPinchEnd: ({ movement: [d] }) => {\n    //   const zoomStep = Number(parseFloat(d / 1000).toFixed(1));\n    //   const newZoomValue = Number(((Math.round((zoom + zoomStep) * 10)) / 10).toFixed(2));\n    //   if (zoom !== newZoomValue && newZoomValue <= ZOOM_MAX) {\n    //     const minZoom = Math.min(fittedZoom, ZOOM_MIN);\n    //     setZoom(Math.max(newZoomValue, minZoom));\n    //   }\n    // },\n  });\n\n  return (\n    <>\n      <Modal\n        appElement={document.getElementById('root')}\n        className={classNames('jfPresentation jfFields', { black: isFullscreen })}\n        closeTimeoutMS={300}\n        contentLabel=\"Report Presentation\"\n        id=\"presentationModal\"\n        isOpen={true}\n        overlayClassName={classNames(\n          'jfPresentation-overlay',\n          { fixedPresentationBar: useFixedPresentationBar, isFullscreen },\n        )}\n        portalClassName=\"PresentationModal\"\n        shouldCloseOnEsc={false}\n        shouldFocusAfterRender={false}\n      >\n        {children(currentPage - 1, gesture)}\n        <PresentationBar\n          currentPage={currentPage}\n          fittedZoom={fittedZoom}\n          fitToScreen={fitToScreen}\n          isFullscreen={isFullscreen}\n          isVisible={(!isFullscreen || (isFullscreen && showControlsInFullScreen))}\n          onAnEventTrigger={onAnEventTrigger}\n          pageCount={pageCount}\n          presentationBarActions={presentationBarActions}\n          setCurrentPage={setCurrentPage}\n          setIsFullscreen={setIsFullscreen}\n          settings={settings}\n          setZoom={setZoom}\n          zoom={zoom}\n        />\n        <ProgressBar\n          currentPage={currentPage}\n          pageCount={pageCount}\n        />\n      </Modal>\n    </>\n  );\n};\n\nPresentationWrapper.propTypes = {\n  children: PropTypes.any,\n  presentationBarActions: PropTypes.arrayOf(PropTypes.shape({})),\n  useFixedPresentationBar: PropTypes.bool,\n};\n\nPresentationWrapper.defaultProps = {\n  children: () => {},\n  presentationBarActions: [],\n  useFixedPresentationBar: false,\n};\n\nexport default PresentationWrapper;\n"],"names":["PresentationWrapper","children","presentationBarActions","useFixedPresentationBar","usePropContext","onAnEventTrigger","settings","usePresentationContext","currentPage","fittedZoom","isFullscreen","pageCount","setCurrentPage","setFittedZoom","setIsFullscreen","setShowControlsInFullScreen","showControlsInFullScreen","useBuilderContext","setZoom","zoom","fitToScreen","useCallback","delay","setTimeout","newZoom","zoomHandler","handler","isModeCustomize","limitZoom","useProgressBar","useEffect","pageChanger","action","changePage","handleKeyboardEvent","e","keyCode","setControlVisibility","window","innerHeight","clientY","useEventListener","throttle","preventDefault","useFullscreenChange","gesture","useGesture","onDragEnd","axis","direction","v","distance","event","clientWidth","target","innerWidth","_jsx","_jsxs","document","getElementById","classNames","black","fixedPresentationBar","propTypes","PropTypes","any","arrayOf","shape","bool","defaultProps"],"mappings":"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"}

package/lib/esm/components/Preview/StaticScene.js

@@ -1,11 +1,14 @@
 import 'core-js/modules/es.array.concat.js';
 import 'core-js/modules/es.array.map.js';
+import 'core-js/modules/es.array.slice.js';
 import 'core-js/modules/es.number.to-fixed.js';
 import 'core-js/modules/es.object.to-string.js';
 import 'core-js/modules/es.regexp.to-string.js';
-import { useRef, useEffect } from 'react';
+import { useRef, useEffect, useMemo, useCallback } from 'react';
 import PropTypes from 'prop-types';
-import { mainWrapper, canvas, page, viewport } from '../../constants/classNames.js';
+import classNames from 'classnames';
+import { TransformWrapper, TransformComponent } from 'react-zoom-pan-pinch';
+import { mainWrapper, canvas, viewport, page } from '../../constants/classNames.js';
 import StaticPage from './StaticPage.js';
 import { usePropContext } from '../../utils/propContext.js';
 import { useBuilderContext } from '../../utils/builderContext.js';
@@ -33,6 +36,7 @@ var StaticScene = function StaticScene(_ref) {
       presentationPage = _ref.presentationPage;
 
   var _usePresentationConte = usePresentationContext(),
+      fittedZoom = _usePresentationConte.fittedZoom,
       isFullscreen = _usePresentationConte.isFullscreen,
       showControlsInFullScreen = _usePresentationConte.showControlsInFullScreen;
 
@@ -41,19 +45,11 @@ var StaticScene = function StaticScene(_ref) {
       settings = _usePropContext.settings;
 
   var _useBuilderContext = useBuilderContext(),
+      setZoom = _useBuilderContext.setZoom,
       zoom = _useBuilderContext.zoom;
 
   var viewPortRef = useRef({});
-  var pageStyles = useRef({});
-  var pageContainerStyles = useRef({});
-  var zoomAdjusterStyles = useRef({});
-  zoom = mode === 'print' ? 1 : zoom;
-  useEffect(function () {
-    if (viewPortRef.current) {
-      viewPortRef.current.scrollTop = lastScrollPosition;
-    }
-  }, []); // set last scroll position after changing mode
-
+  var transformRefs = useRef([]);
   var reportBackgroundColor = settings.reportBackgroundColor,
       _settings$reportLayou = settings.reportLayout,
       reportLayout = _settings$reportLayou === void 0 ? 'A4 Landscape' : _settings$reportLayou,
@@ -65,31 +61,42 @@ var StaticScene = function StaticScene(_ref) {
       reportPageTransition = _settings$reportPageT === void 0 ? 'noAnimation' : _settings$reportPageT;
   var width = parseInt(reportLayoutWidth, 10);
   var height = parseInt(reportLayoutHeight, 10);
-  pageStyles.current = {
-    alignItems: 'center',
-    justifyContent: 'center'
-  };
-  pageContainerStyles.current = {
-    height: height,
-    transform: "scale(".concat(zoom, ")"),
-    transformOrigin: '0 0',
-    width: width
-  };
-  zoomAdjusterStyles.current = {
-    height: parseFloat((height * zoom).toFixed(1)),
-    margin: '0',
-    width: parseFloat((width * zoom).toFixed(1))
-  };
-
-  if (viewPortRef.current.clientWidth < zoomAdjusterStyles.current.width) {
-    delete pageStyles.current.justifyContent;
-  }
-
-  if (viewPortRef.current.clientHeight < zoomAdjusterStyles.current.height) {
-    delete pageStyles.current.alignItems;
-  }
+  useEffect(function () {
+    if (mode === 'print') {
+      setZoom(1);
+    }
+  }, [mode]);
+  useEffect(function () {
+    if (viewPortRef.current) {
+      viewPortRef.current.scrollTop = lastScrollPosition;
+    }
+  }, []); // set last scroll position after changing mode
 
+  useEffect(function () {
+    transformRefs.current = transformRefs.current.slice(0, pages.length);
+  }, [pages]);
+  var pageContainerStyles = useMemo(function () {
+    return {
+      height: height,
+      width: width
+    };
+  }, [width, height]);
   var transitionStyle = usePageTransition(reportPageTransition, presentationPage);
+  var handleZoom = useCallback(function (zoomPanPinch) {
+    var fixedValue = parseFloat(zoomPanPinch.state.scale.toFixed(2));
+    var roundValue = parseFloat((Math.round(fixedValue * 100) / 100).toFixed(1));
+
+    if (roundValue <= 2 && roundValue >= 0.5) {
+      setZoom(roundValue);
+    }
+  }, []);
+  useEffect(function () {
+    if (transformRefs.current.length > 0) {
+      for (var i = 0; i < pages.length; i++) {
+        transformRefs.current[i].centerView(zoom);
+      }
+    }
+  }, [pages.length, zoom, isFullscreen]);
   return /*#__PURE__*/jsxs("main", {
     className: mainWrapper,
     children: [/*#__PURE__*/jsx("div", _objectSpread(_objectSpread({
@@ -100,25 +107,49 @@ var StaticScene = function StaticScene(_ref) {
         className: "".concat(canvas, " ").concat(reportPageTransition),
         style: transitionStyle,
         children: pages.map(function (page$1, index) {
+          var _cNames;
+
           var backgroundColor = page$1.backgroundColor;
 
-          var style = _objectSpread(_objectSpread({}, pageContainerStyles.current), {}, {
+          var style = _objectSpread(_objectSpread({}, pageContainerStyles), {}, {
             backgroundColor: backgroundColor ? backgroundColor : reportBackgroundColor || '#fff'
           });
 
           return /*#__PURE__*/jsx("div", {
-            className: "".concat(page, " ").concat(slugify(reportLayout), " ").concat(index === presentationPage ? 'activePage' : ''),
-            style: pageStyles.current,
-            children: /*#__PURE__*/jsx("div", {
-              className: "jfReport-zoomAdjuster ".concat(mode !== 'preview' ? 'd-flex' : ''),
-              style: zoomAdjusterStyles.current,
-              children: /*#__PURE__*/jsx(StaticPage, {
-                acceptedItems: acceptedItems,
-                additionalPageItems: additionalPageItems,
-                hashCode: hashCode,
-                itemAccessor: itemAccessor,
-                items: page$1.items,
-                style: style
+            className: classNames((_cNames = {}, _defineProperty(_cNames, page, true), _defineProperty(_cNames, slugify(reportLayout), true), _defineProperty(_cNames, "activePage", index === presentationPage), _cNames)),
+            children: /*#__PURE__*/jsx(TransformWrapper, {
+              ref: function ref(element) {
+                transformRefs.current[index] = element;
+              },
+              centerOnInit: true,
+              centerZoomedOut: true,
+              disablePadding: true,
+              doubleClick: {
+                step: 0.2
+              },
+              initialScale: zoom,
+              maxScale: 2,
+              minScale: 0.5,
+              onZoom: handleZoom,
+              panning: {
+                disabled: zoom <= fittedZoom
+              },
+              pinch: {
+                step: 1
+              },
+              children: /*#__PURE__*/jsx(TransformComponent, {
+                wrapperStyle: {
+                  height: '100%',
+                  width: '100%'
+                },
+                children: /*#__PURE__*/jsx(StaticPage, {
+                  acceptedItems: acceptedItems,
+                  additionalPageItems: additionalPageItems,
+                  hashCode: hashCode,
+                  itemAccessor: itemAccessor,
+                  items: page$1.items,
+                  style: style
+                })
               })
             })
           }, "page_".concat(index.toString()));

package/lib/esm/components/Preview/StaticScene.js.map

@@ -1 +1 @@
-{"version":3,"file":"StaticScene.js","sources":["../../../../src/components/Preview/StaticScene.js"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport * as classNames from '../../constants/classNames';\nimport StaticPage from './StaticPage';\nimport { usePropContext } from '../../utils/propContext';\nimport { useBuilderContext } from '../../utils/builderContext';\nimport { slugify } from '../../utils/string';\nimport { usePageTransition } from '../../utils/hooks';\nimport { usePresentationContext } from '../../utils/presentationContext';\nimport ZoomControls from '../Builder/ZoomControls';\n\nconst StaticScene = ({\n  additionalPageItems,\n  gesture,\n  hashCode,\n  hideZoom,\n  itemAccessor,\n  lastScrollPosition,\n  mode,\n  pages,\n  presentationPage,\n}) => {\n  const { isFullscreen, showControlsInFullScreen } = usePresentationContext();\n  const { acceptedItems, settings } = usePropContext();\n  let { zoom } = useBuilderContext();\n  const viewPortRef = useRef({});\n  const pageStyles = useRef({});\n  const pageContainerStyles = useRef({});\n  const zoomAdjusterStyles = useRef({});\n  zoom = mode === 'print' ? 1 : zoom;\n  useEffect(() => {\n    if (viewPortRef.current) {\n      viewPortRef.current.scrollTop = lastScrollPosition;\n    }\n  }, []); // set last scroll position after changing mode\n\n  const {\n    reportBackgroundColor,\n    reportLayout = 'A4 Landscape',\n    reportLayoutHeight = 794,\n    reportLayoutWidth = 1123,\n    reportPageTransition = 'noAnimation',\n  } = settings;\n  const width = parseInt(reportLayoutWidth, 10);\n  const height = parseInt(reportLayoutHeight, 10);\n  pageStyles.current = {\n    alignItems: 'center',\n    justifyContent: 'center',\n  };\n  pageContainerStyles.current = {\n    height,\n    transform: `scale(${zoom})`,\n    transformOrigin: '0 0',\n    width,\n  };\n  zoomAdjusterStyles.current = {\n    height: parseFloat((height * zoom).toFixed(1)),\n    margin: '0',\n    width: parseFloat((width * zoom).toFixed(1)),\n  };\n\n  if (viewPortRef.current.clientWidth < zoomAdjusterStyles.current.width) {\n    delete pageStyles.current.justifyContent;\n  }\n\n  if (viewPortRef.current.clientHeight < zoomAdjusterStyles.current.height) {\n    delete pageStyles.current.alignItems;\n  }\n\n  const transitionStyle = usePageTransition(reportPageTransition, presentationPage);\n\n  return (\n    <main\n      className={classNames.mainWrapper}\n    >\n      <div\n        ref={viewPortRef}\n        className={classNames.viewport}\n        {...gesture()}\n      >\n        <div\n          className={`${classNames.canvas} ${reportPageTransition}`}\n          style={transitionStyle}\n        >\n          {pages.map((page, index) => {\n            const { backgroundColor } = page;\n            const style = {\n              ...pageContainerStyles.current,\n              backgroundColor: backgroundColor ? backgroundColor : reportBackgroundColor || '#fff',\n            };\n            return (\n              <div\n                key={`page_${index.toString()}`}\n                className={`${\n                  classNames.page\n                } ${\n                  slugify(reportLayout)\n                } ${\n                  index === presentationPage ? 'activePage' : ''\n                }`}\n                style={pageStyles.current}\n              >\n                <div\n                  className={`jfReport-zoomAdjuster ${mode !== 'preview' ? 'd-flex' : ''}`}\n                  style={zoomAdjusterStyles.current}\n                >\n                  <StaticPage\n                    acceptedItems={acceptedItems}\n                    additionalPageItems={additionalPageItems}\n                    hashCode={hashCode}\n                    itemAccessor={itemAccessor}\n                    items={page.items}\n                    style={style}\n                  />\n                </div>\n              </div>\n            );\n          })}\n        </div>\n      </div>\n      <ZoomControls\n        pages={pages}\n        showZoom={(!isFullscreen || (isFullscreen && showControlsInFullScreen)) && !hideZoom}\n      />\n    </main>\n  );\n};\n\nStaticScene.propTypes = {\n  additionalPageItems: PropTypes.arrayOf(PropTypes.node),\n  gesture: PropTypes.func,\n  hashCode: PropTypes.string,\n  hideZoom: PropTypes.bool,\n  itemAccessor: PropTypes.func,\n  lastScrollPosition: PropTypes.number,\n  mode: PropTypes.string,\n  pages: PropTypes.arrayOf(PropTypes.shape({})),\n  presentationPage: PropTypes.number,\n};\n\nStaticScene.defaultProps = {\n  additionalPageItems: [],\n  gesture: () => {},\n  hashCode: '',\n  hideZoom: false,\n  itemAccessor: () => {},\n  lastScrollPosition: 0,\n  mode: 'preview',\n  pages: [],\n  presentationPage: 0,\n};\n\nexport default StaticScene;\n"],"names":["StaticScene","additionalPageItems","gesture","hashCode","hideZoom","itemAccessor","lastScrollPosition","mode","pages","presentationPage","usePresentationContext","isFullscreen","showControlsInFullScreen","usePropContext","acceptedItems","settings","useBuilderContext","zoom","viewPortRef","useRef","pageStyles","pageContainerStyles","zoomAdjusterStyles","useEffect","current","scrollTop","reportBackgroundColor","reportLayout","reportLayoutHeight","reportLayoutWidth","reportPageTransition","width","parseInt","height","alignItems","justifyContent","transform","transformOrigin","parseFloat","toFixed","margin","clientWidth","clientHeight","transitionStyle","usePageTransition","_jsxs","classNames","_jsx","map","page","index","backgroundColor","style","slugify","items","toString","propTypes","PropTypes","arrayOf","node","func","string","bool","number","shape","defaultProps"],"mappings":"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"}
+{"version":3,"file":"StaticScene.js","sources":["../../../../src/components/Preview/StaticScene.js"],"sourcesContent":["import {\n  useCallback, useEffect, useMemo, useRef,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport cNames from 'classnames';\nimport { TransformWrapper, TransformComponent } from 'react-zoom-pan-pinch';\nimport * as classNames from '../../constants/classNames';\nimport StaticPage from './StaticPage';\nimport { usePropContext } from '../../utils/propContext';\nimport { useBuilderContext } from '../../utils/builderContext';\nimport { slugify } from '../../utils/string';\nimport { usePageTransition } from '../../utils/hooks';\nimport { usePresentationContext } from '../../utils/presentationContext';\nimport ZoomControls from '../Builder/ZoomControls';\n\nconst StaticScene = ({\n  additionalPageItems,\n  gesture,\n  hashCode,\n  hideZoom,\n  itemAccessor,\n  lastScrollPosition,\n  mode,\n  pages,\n  presentationPage,\n}) => {\n  const { fittedZoom, isFullscreen, showControlsInFullScreen } = usePresentationContext();\n  const { acceptedItems, settings } = usePropContext();\n  const { setZoom, zoom } = useBuilderContext();\n  const viewPortRef = useRef({});\n  const transformRefs = useRef([]);\n\n  const {\n    reportBackgroundColor,\n    reportLayout = 'A4 Landscape',\n    reportLayoutHeight = 794,\n    reportLayoutWidth = 1123,\n    reportPageTransition = 'noAnimation',\n  } = settings;\n  const width = parseInt(reportLayoutWidth, 10);\n  const height = parseInt(reportLayoutHeight, 10);\n\n  useEffect(() => {\n    if (mode === 'print') {\n      setZoom(1);\n    }\n  }, [mode]);\n\n  useEffect(() => {\n    if (viewPortRef.current) {\n      viewPortRef.current.scrollTop = lastScrollPosition;\n    }\n  }, []); // set last scroll position after changing mode\n\n  useEffect(() => {\n    transformRefs.current = transformRefs.current.slice(0, pages.length);\n  }, [pages]);\n\n  const pageContainerStyles = useMemo(() => ({\n    height,\n    width,\n  }), [width, height]);\n\n  const transitionStyle = usePageTransition(reportPageTransition, presentationPage);\n\n  const handleZoom = useCallback(zoomPanPinch => {\n    const fixedValue = parseFloat(zoomPanPinch.state.scale.toFixed(2));\n    const roundValue = parseFloat((Math.round((fixedValue * 100)) / 100).toFixed(1));\n    if (roundValue <= 2 && roundValue >= 0.5) {\n      setZoom(roundValue);\n    }\n  }, []);\n\n  useEffect(() => {\n    if (transformRefs.current.length > 0) {\n      for (let i = 0; i < pages.length; i++) {\n        transformRefs.current[i].centerView(zoom);\n      }\n    }\n  }, [pages.length, zoom, isFullscreen]);\n\n  return (\n    <main\n      className={classNames.mainWrapper}\n    >\n      <div\n        ref={viewPortRef}\n        className={classNames.viewport}\n        {...gesture()}\n      >\n        <div\n          className={`${classNames.canvas} ${reportPageTransition}`}\n          style={transitionStyle}\n        >\n          {pages.map((page, index) => {\n            const { backgroundColor } = page;\n            const style = {\n              ...pageContainerStyles,\n              backgroundColor: backgroundColor ? backgroundColor : reportBackgroundColor || '#fff',\n            };\n            return (\n              <div\n                key={`page_${index.toString()}`}\n                className={cNames({\n                  [classNames.page]: true,\n                  [slugify(reportLayout)]: true,\n                  activePage: index === presentationPage,\n                })}\n              >\n                <TransformWrapper\n                  ref={element => { transformRefs.current[index] = element; }}\n                  centerOnInit={true}\n                  centerZoomedOut={true}\n                  disablePadding={true}\n                  doubleClick={{\n                    step: 0.2,\n                  }}\n                  initialScale={zoom}\n                  maxScale={2}\n                  minScale={0.5}\n                  onZoom={handleZoom}\n                  panning={{\n                    disabled: zoom <= fittedZoom,\n                  }}\n                  pinch={{\n                    step: 1,\n                  }}\n                >\n                  <TransformComponent\n                    wrapperStyle={{ height: '100%', width: '100%' }}\n                  >\n                    <StaticPage\n                      acceptedItems={acceptedItems}\n                      additionalPageItems={additionalPageItems}\n                      hashCode={hashCode}\n                      itemAccessor={itemAccessor}\n                      items={page.items}\n                      style={style}\n                    />\n                  </TransformComponent>\n                </TransformWrapper>\n              </div>\n            );\n          })}\n        </div>\n      </div>\n      <ZoomControls\n        pages={pages}\n        showZoom={(!isFullscreen || (isFullscreen && showControlsInFullScreen)) && !hideZoom}\n      />\n    </main>\n  );\n};\n\nStaticScene.propTypes = {\n  additionalPageItems: PropTypes.arrayOf(PropTypes.node),\n  gesture: PropTypes.func,\n  hashCode: PropTypes.string,\n  hideZoom: PropTypes.bool,\n  itemAccessor: PropTypes.func,\n  lastScrollPosition: PropTypes.number,\n  mode: PropTypes.string,\n  pages: PropTypes.arrayOf(PropTypes.shape({})),\n  presentationPage: PropTypes.number,\n};\n\nStaticScene.defaultProps = {\n  additionalPageItems: [],\n  gesture: () => {},\n  hashCode: '',\n  hideZoom: false,\n  itemAccessor: () => {},\n  lastScrollPosition: 0,\n  mode: 'preview',\n  pages: [],\n  presentationPage: 0,\n};\n\nexport default StaticScene;\n"],"names":["StaticScene","additionalPageItems","gesture","hashCode","hideZoom","itemAccessor","lastScrollPosition","mode","pages","presentationPage","usePresentationContext","fittedZoom","isFullscreen","showControlsInFullScreen","usePropContext","acceptedItems","settings","useBuilderContext","setZoom","zoom","viewPortRef","useRef","transformRefs","reportBackgroundColor","reportLayout","reportLayoutHeight","reportLayoutWidth","reportPageTransition","width","parseInt","height","useEffect","current","scrollTop","slice","length","pageContainerStyles","useMemo","transitionStyle","usePageTransition","handleZoom","useCallback","zoomPanPinch","fixedValue","parseFloat","state","scale","toFixed","roundValue","Math","round","i","centerView","_jsxs","classNames","_jsx","map","page","index","backgroundColor","style","cNames","slugify","element","step","disabled","items","toString","propTypes","PropTypes","arrayOf","node","func","string","bool","number","shape","defaultProps"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;IAeMA,WAAW,GAAG,SAAdA,WAAc,OAUd;AAAA,MATJC,mBASI,QATJA,mBASI;AAAA,MARJC,OAQI,QARJA,OAQI;AAAA,MAPJC,QAOI,QAPJA,QAOI;AAAA,MANJC,QAMI,QANJA,QAMI;AAAA,MALJC,YAKI,QALJA,YAKI;AAAA,MAJJC,kBAII,QAJJA,kBAII;AAAA,MAHJC,IAGI,QAHJA,IAGI;AAAA,MAFJC,KAEI,QAFJA,KAEI;AAAA,MADJC,gBACI,QADJA,gBACI;;AACJ,8BAA+DC,sBAAsB,EAArF;AAAA,MAAQC,UAAR,yBAAQA,UAAR;AAAA,MAAoBC,YAApB,yBAAoBA,YAApB;AAAA,MAAkCC,wBAAlC,yBAAkCA,wBAAlC;;AACA,wBAAoCC,cAAc,EAAlD;AAAA,MAAQC,aAAR,mBAAQA,aAAR;AAAA,MAAuBC,QAAvB,mBAAuBA,QAAvB;;AACA,2BAA0BC,iBAAiB,EAA3C;AAAA,MAAQC,OAAR,sBAAQA,OAAR;AAAA,MAAiBC,IAAjB,sBAAiBA,IAAjB;;AACA,MAAMC,WAAW,GAAGC,MAAM,CAAC,EAAD,CAA1B;AACA,MAAMC,aAAa,GAAGD,MAAM,CAAC,EAAD,CAA5B;AAEA,MACEE,qBADF,GAMIP,QANJ,CACEO,qBADF;AAAA,8BAMIP,QANJ,CAEEQ,YAFF;AAAA,MAEEA,YAFF,sCAEiB,cAFjB;AAAA,+BAMIR,QANJ,CAGES,kBAHF;AAAA,MAGEA,kBAHF,uCAGuB,GAHvB;AAAA,+BAMIT,QANJ,CAIEU,iBAJF;AAAA,MAIEA,iBAJF,uCAIsB,IAJtB;AAAA,8BAMIV,QANJ,CAKEW,oBALF;AAAA,MAKEA,oBALF,sCAKyB,aALzB;AAOA,MAAMC,KAAK,GAAGC,QAAQ,CAACH,iBAAD,EAAoB,EAApB,CAAtB;AACA,MAAMI,MAAM,GAAGD,QAAQ,CAACJ,kBAAD,EAAqB,EAArB,CAAvB;AAEAM,EAAAA,SAAS,CAAC,YAAM;AACd,QAAIxB,IAAI,KAAK,OAAb,EAAsB;AACpBW,MAAAA,OAAO,CAAC,CAAD,CAAP;AACD;AACF,GAJQ,EAIN,CAACX,IAAD,CAJM,CAAT;AAMAwB,EAAAA,SAAS,CAAC,YAAM;AACd,QAAIX,WAAW,CAACY,OAAhB,EAAyB;AACvBZ,MAAAA,WAAW,CAACY,OAAZ,CAAoBC,SAApB,GAAgC3B,kBAAhC;AACD;AACF,GAJQ,EAIN,EAJM,CAAT,CAvBI;;AA6BJyB,EAAAA,SAAS,CAAC,YAAM;AACdT,IAAAA,aAAa,CAACU,OAAd,GAAwBV,aAAa,CAACU,OAAd,CAAsBE,KAAtB,CAA4B,CAA5B,EAA+B1B,KAAK,CAAC2B,MAArC,CAAxB;AACD,GAFQ,EAEN,CAAC3B,KAAD,CAFM,CAAT;AAIA,MAAM4B,mBAAmB,GAAGC,OAAO,CAAC;AAAA,WAAO;AACzCP,MAAAA,MAAM,EAANA,MADyC;AAEzCF,MAAAA,KAAK,EAALA;AAFyC,KAAP;AAAA,GAAD,EAG/B,CAACA,KAAD,EAAQE,MAAR,CAH+B,CAAnC;AAKA,MAAMQ,eAAe,GAAGC,iBAAiB,CAACZ,oBAAD,EAAuBlB,gBAAvB,CAAzC;AAEA,MAAM+B,UAAU,GAAGC,WAAW,CAAC,UAAAC,YAAY,EAAI;AAC7C,QAAMC,UAAU,GAAGC,UAAU,CAACF,YAAY,CAACG,KAAb,CAAmBC,KAAnB,CAAyBC,OAAzB,CAAiC,CAAjC,CAAD,CAA7B;AACA,QAAMC,UAAU,GAAGJ,UAAU,CAAC,CAACK,IAAI,CAACC,KAAL,CAAYP,UAAU,GAAG,GAAzB,IAAiC,GAAlC,EAAuCI,OAAvC,CAA+C,CAA/C,CAAD,CAA7B;;AACA,QAAIC,UAAU,IAAI,CAAd,IAAmBA,UAAU,IAAI,GAArC,EAA0C;AACxC9B,MAAAA,OAAO,CAAC8B,UAAD,CAAP;AACD;AACF,GAN6B,EAM3B,EAN2B,CAA9B;AAQAjB,EAAAA,SAAS,CAAC,YAAM;AACd,QAAIT,aAAa,CAACU,OAAd,CAAsBG,MAAtB,GAA+B,CAAnC,EAAsC;AACpC,WAAK,IAAIgB,CAAC,GAAG,CAAb,EAAgBA,CAAC,GAAG3C,KAAK,CAAC2B,MAA1B,EAAkCgB,CAAC,EAAnC,EAAuC;AACrC7B,QAAAA,aAAa,CAACU,OAAd,CAAsBmB,CAAtB,EAAyBC,UAAzB,CAAoCjC,IAApC;AACD;AACF;AACF,GANQ,EAMN,CAACX,KAAK,CAAC2B,MAAP,EAAehB,IAAf,EAAqBP,YAArB,CANM,CAAT;AAQA,sBACEyC;AACE,IAAA,SAAS,EAAEC,WADb;AAAA,4BAGEC;AACE,MAAA,GAAG,EAAEnC,WADP;AAEE,MAAA,SAAS,EAAEkC;AAFb,OAGMpD,OAAO,EAHb;AAAA,6BAKEqD;AACE,QAAA,SAAS,YAAKD,MAAL,cAA0B3B,oBAA1B,CADX;AAEE,QAAA,KAAK,EAAEW,eAFT;AAAA,kBAIG9B,KAAK,CAACgD,GAAN,CAAU,UAACC,MAAD,EAAOC,KAAP,EAAiB;AAAA;;AAC1B,cAAQC,eAAR,GAA4BF,MAA5B,CAAQE,eAAR;;AACA,cAAMC,KAAK,mCACNxB,mBADM;AAETuB,YAAAA,eAAe,EAAEA,eAAe,GAAGA,eAAH,GAAqBpC,qBAAqB,IAAI;AAFrE,YAAX;;AAIA,8BACEgC;AAEE,YAAA,SAAS,EAAEM,UAAM,yCACdP,IADc,EACI,IADJ,4BAEdQ,OAAO,CAACtC,YAAD,CAFO,EAEU,IAFV,0CAGHkC,KAAK,KAAKjD,gBAHP,YAFnB;AAAA,mCAQE8C,IAAC,gBAAD;AACE,cAAA,GAAG,EAAE,aAAAQ,OAAO,EAAI;AAAEzC,gBAAAA,aAAa,CAACU,OAAd,CAAsB0B,KAAtB,IAA+BK,OAA/B;AAAyC,eAD7D;AAEE,cAAA,YAAY,EAAE,IAFhB;AAGE,cAAA,eAAe,EAAE,IAHnB;AAIE,cAAA,cAAc,EAAE,IAJlB;AAKE,cAAA,WAAW,EAAE;AACXC,gBAAAA,IAAI,EAAE;AADK,eALf;AAQE,cAAA,YAAY,EAAE7C,IARhB;AASE,cAAA,QAAQ,EAAE,CATZ;AAUE,cAAA,QAAQ,EAAE,GAVZ;AAWE,cAAA,MAAM,EAAEqB,UAXV;AAYE,cAAA,OAAO,EAAE;AACPyB,gBAAAA,QAAQ,EAAE9C,IAAI,IAAIR;AADX,eAZX;AAeE,cAAA,KAAK,EAAE;AACLqD,gBAAAA,IAAI,EAAE;AADD,eAfT;AAAA,qCAmBET,IAAC,kBAAD;AACE,gBAAA,YAAY,EAAE;AAAEzB,kBAAAA,MAAM,EAAE,MAAV;AAAkBF,kBAAAA,KAAK,EAAE;AAAzB,iBADhB;AAAA,uCAGE2B,IAAC,UAAD;AACE,kBAAA,aAAa,EAAExC,aADjB;AAEE,kBAAA,mBAAmB,EAAEd,mBAFvB;AAGE,kBAAA,QAAQ,EAAEE,QAHZ;AAIE,kBAAA,YAAY,EAAEE,YAJhB;AAKE,kBAAA,KAAK,EAAEoD,MAAI,CAACS,KALd;AAME,kBAAA,KAAK,EAAEN;AANT;AAHF;AAnBF;AARF,4BACeF,KAAK,CAACS,QAAN,EADf,EADF;AA2CD,SAjDA;AAJH;AALF,OAHF,eAgEEZ,IAAC,YAAD;AACE,MAAA,KAAK,EAAE/C,KADT;AAEE,MAAA,QAAQ,EAAE,CAAC,CAACI,YAAD,IAAkBA,YAAY,IAAIC,wBAAnC,KAAiE,CAACT;AAF9E,MAhEF;AAAA,IADF;AAuED;;AAEDJ,WAAW,CAACoE,SAAZ,GAAwB;AACtBnE,EAAAA,mBAAmB,EAAEoE,SAAS,CAACC,OAAV,CAAkBD,SAAS,CAACE,IAA5B,CADC;AAEtBrE,EAAAA,OAAO,EAAEmE,SAAS,CAACG,IAFG;AAGtBrE,EAAAA,QAAQ,EAAEkE,SAAS,CAACI,MAHE;AAItBrE,EAAAA,QAAQ,EAAEiE,SAAS,CAACK,IAJE;AAKtBrE,EAAAA,YAAY,EAAEgE,SAAS,CAACG,IALF;AAMtBlE,EAAAA,kBAAkB,EAAE+D,SAAS,CAACM,MANR;AAOtBpE,EAAAA,IAAI,EAAE8D,SAAS,CAACI,MAPM;AAQtBjE,EAAAA,KAAK,EAAE6D,SAAS,CAACC,OAAV,CAAkBD,SAAS,CAACO,KAAV,CAAgB,EAAhB,CAAlB,CARe;AAStBnE,EAAAA,gBAAgB,EAAE4D,SAAS,CAACM;AATN,CAAxB;AAYA3E,WAAW,CAAC6E,YAAZ,GAA2B;AACzB5E,EAAAA,mBAAmB,EAAE,EADI;AAEzBC,EAAAA,OAAO,EAAE,mBAAM,EAFU;AAGzBC,EAAAA,QAAQ,EAAE,EAHe;AAIzBC,EAAAA,QAAQ,EAAE,KAJe;AAKzBC,EAAAA,YAAY,EAAE,wBAAM,EALK;AAMzBC,EAAAA,kBAAkB,EAAE,CANK;AAOzBC,EAAAA,IAAI,EAAE,SAPmB;AAQzBC,EAAAA,KAAK,EAAE,EARkB;AASzBC,EAAAA,gBAAgB,EAAE;AATO,CAA3B;;;;"}

package/lib/esm/utils/presentationContext.js

@@ -27,6 +27,7 @@ function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.g
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 var PresentationContext = /*#__PURE__*/createContext({
   currentPage: 1,
+  fittedZoom: 1,
   isFullscreen: false,
   pageCount: 0,
   showZoomInFullScreen: false
@@ -71,11 +72,18 @@ var PresentationProvider = /*#__PURE__*/function (_React$Component) {
       });
     });
 
+    _defineProperty(_assertThisInitialized(_this), "setFittedZoom", function (fittedZoom) {
+      _this.setState({
+        fittedZoom: fittedZoom
+      });
+    });
+
     _this.state = {
       currentPage: props.currentPage,
       isFullscreen: props.isFullscreen,
       pageCount: props.pageCount,
       setCurrentPage: _this.setCurrentPage,
+      setFittedZoom: _this.setFittedZoom,
       setIsFullscreen: _this.setIsFullscreen,
       setShowControlsInFullScreen: _this.setShowControlsInFullScreen
     };

package/lib/esm/utils/presentationContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"presentationContext.js","sources":["../../../src/utils/presentationContext.js"],"sourcesContent":["/* eslint-disable react/no-unused-state */\nimport React, { createContext, useContext } from 'react';\nimport PropTypes from 'prop-types';\n\nexport const PresentationContext = createContext({\n  currentPage: 1,\n  isFullscreen: false,\n  pageCount: 0,\n  showZoomInFullScreen: false,\n});\n\nexport const usePresentationContext = () => {\n  const context = useContext(PresentationContext);\n  if (!context) {\n    throw new Error('PresentationContext must be used with PresentationProvider!');\n  }\n  return context;\n};\n\nexport class PresentationProvider extends React.Component {\n  static getDerivedStateFromProps(nextProps, prevState) {\n    const updates = {};\n    const {\n      pageCount,\n    } = prevState;\n\n    if (nextProps.pageCount !== pageCount) {\n      updates.pageCount = nextProps.pageCount;\n    }\n\n    return updates;\n  }\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      currentPage: props.currentPage,\n      isFullscreen: props.isFullscreen,\n      pageCount: props.pageCount,\n      setCurrentPage: this.setCurrentPage,\n      setIsFullscreen: this.setIsFullscreen,\n      setShowControlsInFullScreen: this.setShowControlsInFullScreen,\n    };\n  }\n\n  setCurrentPage = currentPage => {\n    this.setState({ currentPage });\n  };\n\n  setIsFullscreen = isFullscreen => {\n    this.setState({ isFullscreen, showControlsInFullScreen: false });\n  };\n\n  setShowControlsInFullScreen = showControlsInFullScreen => {\n    this.setState({ showControlsInFullScreen });\n  }\n\n  render() {\n    const { children } = this.props;\n    return (\n      <PresentationContext.Provider value={this.state}>\n        {children}\n      </PresentationContext.Provider>\n    );\n  }\n}\n\nPresentationProvider.propTypes = {\n  children: PropTypes.any,\n  currentPage: PropTypes.number,\n  isFullscreen: PropTypes.bool,\n  pageCount: PropTypes.number,\n};\n\nPresentationProvider.defaultProps = {\n  children: null,\n  currentPage: 1,\n  isFullscreen: false,\n  pageCount: 1,\n};\n\nexport const PresentationConsumer = PresentationContext.Consumer;\n"],"names":["PresentationContext","createContext","currentPage","isFullscreen","pageCount","showZoomInFullScreen","usePresentationContext","context","useContext","Error","PresentationProvider","props","setState","showControlsInFullScreen","state","setCurrentPage","setIsFullscreen","setShowControlsInFullScreen","children","_jsx","nextProps","prevState","updates","React","Component","propTypes","PropTypes","any","number","bool","defaultProps","Consumer"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;IAIaA,mBAAmB,gBAAGC,aAAa,CAAC;AAC/CC,EAAAA,WAAW,EAAE,CADkC;AAE/CC,EAAAA,YAAY,EAAE,KAFiC;AAG/CC,EAAAA,SAAS,EAAE,CAHoC;AAI/CC,EAAAA,oBAAoB,EAAE;AAJyB,CAAD;IAOnCC,sBAAsB,GAAG,SAAzBA,sBAAyB,GAAM;AAC1C,MAAMC,OAAO,GAAGC,UAAU,CAACR,mBAAD,CAA1B;;AACA,MAAI,CAACO,OAAL,EAAc;AACZ,UAAM,IAAIE,KAAJ,CAAU,6DAAV,CAAN;AACD;;AACD,SAAOF,OAAP;AACD;IAEYG,oBAAb;AAAA;;AAAA;;AAcE,gCAAYC,KAAZ,EAAmB;AAAA;;AAAA;;AACjB,8BAAMA,KAAN;;AADiB,qEAYF,UAAAT,WAAW,EAAI;AAC9B,YAAKU,QAAL,CAAc;AAAEV,QAAAA,WAAW,EAAXA;AAAF,OAAd;AACD,KAdkB;;AAAA,sEAgBD,UAAAC,YAAY,EAAI;AAChC,YAAKS,QAAL,CAAc;AAAET,QAAAA,YAAY,EAAZA,YAAF;AAAgBU,QAAAA,wBAAwB,EAAE;AAA1C,OAAd;AACD,KAlBkB;;AAAA,kFAoBW,UAAAA,wBAAwB,EAAI;AACxD,YAAKD,QAAL,CAAc;AAAEC,QAAAA,wBAAwB,EAAxBA;AAAF,OAAd;AACD,KAtBkB;;AAEjB,UAAKC,KAAL,GAAa;AACXZ,MAAAA,WAAW,EAAES,KAAK,CAACT,WADR;AAEXC,MAAAA,YAAY,EAAEQ,KAAK,CAACR,YAFT;AAGXC,MAAAA,SAAS,EAAEO,KAAK,CAACP,SAHN;AAIXW,MAAAA,cAAc,EAAE,MAAKA,cAJV;AAKXC,MAAAA,eAAe,EAAE,MAAKA,eALX;AAMXC,MAAAA,2BAA2B,EAAE,MAAKA;AANvB,KAAb;AAFiB;AAUlB;;AAxBH;AAAA;AAAA,WAsCE,kBAAS;AACP,UAAQC,QAAR,GAAqB,KAAKP,KAA1B,CAAQO,QAAR;AACA,0BACEC,IAAC,mBAAD,CAAqB,QAArB;AAA8B,QAAA,KAAK,EAAE,KAAKL,KAA1C;AAAA,kBACGI;AADH,QADF;AAKD;AA7CH;AAAA;AAAA,WACE,kCAAgCE,SAAhC,EAA2CC,SAA3C,EAAsD;AACpD,UAAMC,OAAO,GAAG,EAAhB;AACA,UACElB,SADF,GAEIiB,SAFJ,CACEjB,SADF;;AAIA,UAAIgB,SAAS,CAAChB,SAAV,KAAwBA,SAA5B,EAAuC;AACrCkB,QAAAA,OAAO,CAAClB,SAAR,GAAoBgB,SAAS,CAAChB,SAA9B;AACD;;AAED,aAAOkB,OAAP;AACD;AAZH;;AAAA;AAAA,EAA0CC,KAAK,CAACC,SAAhD;AAgDAd,oBAAoB,CAACe,SAArB,GAAiC;AAC/BP,EAAAA,QAAQ,EAAEQ,SAAS,CAACC,GADW;AAE/BzB,EAAAA,WAAW,EAAEwB,SAAS,CAACE,MAFQ;AAG/BzB,EAAAA,YAAY,EAAEuB,SAAS,CAACG,IAHO;AAI/BzB,EAAAA,SAAS,EAAEsB,SAAS,CAACE;AAJU,CAAjC;AAOAlB,oBAAoB,CAACoB,YAArB,GAAoC;AAClCZ,EAAAA,QAAQ,EAAE,IADwB;AAElChB,EAAAA,WAAW,EAAE,CAFqB;AAGlCC,EAAAA,YAAY,EAAE,KAHoB;AAIlCC,EAAAA,SAAS,EAAE;AAJuB,CAApC;AAOoCJ,mBAAmB,CAAC+B;;;;"}
+{"version":3,"file":"presentationContext.js","sources":["../../../src/utils/presentationContext.js"],"sourcesContent":["/* eslint-disable react/no-unused-state */\nimport React, { createContext, useContext } from 'react';\nimport PropTypes from 'prop-types';\n\nexport const PresentationContext = createContext({\n  currentPage: 1,\n  fittedZoom: 1,\n  isFullscreen: false,\n  pageCount: 0,\n  showZoomInFullScreen: false,\n});\n\nexport const usePresentationContext = () => {\n  const context = useContext(PresentationContext);\n  if (!context) {\n    throw new Error('PresentationContext must be used with PresentationProvider!');\n  }\n  return context;\n};\n\nexport class PresentationProvider extends React.Component {\n  static getDerivedStateFromProps(nextProps, prevState) {\n    const updates = {};\n    const {\n      pageCount,\n    } = prevState;\n\n    if (nextProps.pageCount !== pageCount) {\n      updates.pageCount = nextProps.pageCount;\n    }\n\n    return updates;\n  }\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      currentPage: props.currentPage,\n      isFullscreen: props.isFullscreen,\n      pageCount: props.pageCount,\n      setCurrentPage: this.setCurrentPage,\n      setFittedZoom: this.setFittedZoom,\n      setIsFullscreen: this.setIsFullscreen,\n      setShowControlsInFullScreen: this.setShowControlsInFullScreen,\n    };\n  }\n\n  setCurrentPage = currentPage => {\n    this.setState({ currentPage });\n  };\n\n  setIsFullscreen = isFullscreen => {\n    this.setState({ isFullscreen, showControlsInFullScreen: false });\n  };\n\n  setShowControlsInFullScreen = showControlsInFullScreen => {\n    this.setState({ showControlsInFullScreen });\n  }\n\n  setFittedZoom = fittedZoom => {\n    this.setState({ fittedZoom });\n  }\n\n  render() {\n    const { children } = this.props;\n    return (\n      <PresentationContext.Provider value={this.state}>\n        {children}\n      </PresentationContext.Provider>\n    );\n  }\n}\n\nPresentationProvider.propTypes = {\n  children: PropTypes.any,\n  currentPage: PropTypes.number,\n  isFullscreen: PropTypes.bool,\n  pageCount: PropTypes.number,\n};\n\nPresentationProvider.defaultProps = {\n  children: null,\n  currentPage: 1,\n  isFullscreen: false,\n  pageCount: 1,\n};\n\nexport const PresentationConsumer = PresentationContext.Consumer;\n"],"names":["PresentationContext","createContext","currentPage","fittedZoom","isFullscreen","pageCount","showZoomInFullScreen","usePresentationContext","context","useContext","Error","PresentationProvider","props","setState","showControlsInFullScreen","state","setCurrentPage","setFittedZoom","setIsFullscreen","setShowControlsInFullScreen","children","_jsx","nextProps","prevState","updates","React","Component","propTypes","PropTypes","any","number","bool","defaultProps","Consumer"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jotforminc/dnd-builder",
-  "version": "2.4.5",
+  "version": "2.5.0",
   "files": [
     "lib"
   ],
@@ -15,7 +15,7 @@
     "intersection-observer": "0.12.0",
     "lodash.isequal": "4.5.0",
     "memoize-one": "5.1.1",
-    "nanoid": "3.1.20",
+    "nanoid": "3.1.31",
     "object-hash": "2.1.1",
     "prop-types": "15.7.2",
     "re-resizable": "6.9.0",
@@ -31,6 +31,7 @@
     "react-sortable-hoc": "2.0.0",
     "react-use-gesture": "9.0.4",
     "react-window": "1.8.6",
+    "react-zoom-pan-pinch": "^3.0.1",
     "recharts": "2.0.7",
     "regenerator-runtime": "0.13.7"
   },