@jotforminc/dnd-builder 2.5.0 → 2.5.2

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.2](https://github.com/jotform/dnd-builder/compare/v2.5.1...v2.5.2) (2023-03-02)
+
+
+### Bug Fixes
+
+* **static-scene:** use hoc for pan pinch zoom ([708a3a9](https://github.com/jotform/dnd-builder/commit/708a3a9abc28cafed950a917a9cf2f3a87a3563d))
+* **withZoomPanPinchHOC:** renaming & test fix ([f70566e](https://github.com/jotform/dnd-builder/commit/f70566ec1bfce45330914dca725281d22b08fa4f))
+
+### [2.5.1](https://github.com/jotform/dnd-builder/compare/v2.5.0...v2.5.1) (2023-03-01)
+
+
+### Bug Fixes
+
+* **static-scene:** fix transform values for print mode  ([931dae7](https://github.com/jotform/dnd-builder/commit/931dae759392d6c700be969ab6f8ae0edfe39816))
+
 ## [2.5.0](https://github.com/jotform/dnd-builder/compare/v2.4.6...v2.5.0) (2023-02-28)
 
 

package/lib/cjs/components/Panels/AllSlidesPanel/PageItem.js

@@ -43,7 +43,7 @@ var PageItem = reactSortableHoc.SortableElement(function (_ref) {
       children: order
     }), /*#__PURE__*/jsxRuntime.jsx("div", {
       className: "thumbnailFrame o-hidden",
-      children: /*#__PURE__*/jsxRuntime.jsx(StaticPage, {
+      children: /*#__PURE__*/jsxRuntime.jsx(StaticPage['default'], {
         acceptedItems: acceptedItems,
         additionalPageItems: additionalPageItems,
         hashCode: hashCode,

package/lib/cjs/components/Panels/AllSlidesPanel/PageItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"PageItem.js","sources":["../../../../../src/components/Panels/AllSlidesPanel/PageItem.js"],"sourcesContent":["import { memo } from 'react';\nimport { SortableElement } from 'react-sortable-hoc';\nimport classNames from 'classnames';\nimport StaticPage from '../../Preview/StaticPage';\nimport PageThumbnailActions from './PageThumbnailActions';\n\nconst PageItem = SortableElement(({\n  acceptedItems,\n  additionalPageItems,\n  hashCode,\n  isSelected,\n  itemAccessor,\n  onAnEventTrigger,\n  onPageAdd,\n  onPageClick,\n  onPageDuplicate,\n  onPageRemove,\n  order,\n  page,\n  style,\n}) => {\n  const onKeyDown = f => f;\n  return (\n    <div\n      className={(\n        classNames('thumbnailWrapper d-flex dir-col a-center j-center p-relative', { isSelected })\n      )}\n      data-id={page.id}\n      data-order={order}\n      onClick={onPageClick}\n      onKeyDown={onKeyDown}\n    >\n      <div className=\"thumbnailOrder\">{order}</div>\n      <div className=\"thumbnailFrame o-hidden\">\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      <PageThumbnailActions\n        onAnEventTrigger={onAnEventTrigger}\n        onPageAdd={onPageAdd}\n        onPageDuplicate={onPageDuplicate}\n        onPageRemove={onPageRemove}\n        order={order}\n        page={page}\n      />\n    </div>\n  );\n});\n\nexport default memo(PageItem);\n"],"names":["PageItem","SortableElement","acceptedItems","additionalPageItems","hashCode","isSelected","itemAccessor","onAnEventTrigger","onPageAdd","onPageClick","onPageDuplicate","onPageRemove","order","page","style","onKeyDown","f","_jsxs","classNames","id","_jsx","items","memo"],"mappings":";;;;;;;;;;;;;AAMA,IAAMA,QAAQ,GAAGC,gCAAe,CAAC,gBAc3B;AAAA,MAbJC,aAaI,QAbJA,aAaI;AAAA,MAZJC,mBAYI,QAZJA,mBAYI;AAAA,MAXJC,QAWI,QAXJA,QAWI;AAAA,MAVJC,UAUI,QAVJA,UAUI;AAAA,MATJC,YASI,QATJA,YASI;AAAA,MARJC,gBAQI,QARJA,gBAQI;AAAA,MAPJC,SAOI,QAPJA,SAOI;AAAA,MANJC,WAMI,QANJA,WAMI;AAAA,MALJC,eAKI,QALJA,eAKI;AAAA,MAJJC,YAII,QAJJA,YAII;AAAA,MAHJC,KAGI,QAHJA,KAGI;AAAA,MAFJC,IAEI,QAFJA,IAEI;AAAA,MADJC,KACI,QADJA,KACI;;AACJ,MAAMC,SAAS,GAAG,SAAZA,SAAY,CAAAC,CAAC;AAAA,WAAIA,CAAJ;AAAA,GAAnB;;AACA,sBACEC;AACE,IAAA,SAAS,EACPC,8BAAU,CAAC,8DAAD,EAAiE;AAAEb,MAAAA,UAAU,EAAVA;AAAF,KAAjE,CAFd;AAIE,eAASQ,IAAI,CAACM,EAJhB;AAKE,kBAAYP,KALd;AAME,IAAA,OAAO,EAAEH,WANX;AAOE,IAAA,SAAS,EAAEM,SAPb;AAAA,4BASEK;AAAK,MAAA,SAAS,EAAC,gBAAf;AAAA,gBAAiCR;AAAjC,MATF,eAUEQ;AAAK,MAAA,SAAS,EAAC,yBAAf;AAAA,6BACEA,eAAC,UAAD;AACE,QAAA,aAAa,EAAElB,aADjB;AAEE,QAAA,mBAAmB,EAAEC,mBAFvB;AAGE,QAAA,QAAQ,EAAEC,QAHZ;AAIE,QAAA,YAAY,EAAEE,YAJhB;AAKE,QAAA,KAAK,EAAEO,IAAI,CAACQ,KALd;AAME,QAAA,KAAK,EAAEP;AANT;AADF,MAVF,eAoBEM,eAAC,oBAAD;AACE,MAAA,gBAAgB,EAAEb,gBADpB;AAEE,MAAA,SAAS,EAAEC,SAFb;AAGE,MAAA,eAAe,EAAEE,eAHnB;AAIE,MAAA,YAAY,EAAEC,YAJhB;AAKE,MAAA,KAAK,EAAEC,KALT;AAME,MAAA,IAAI,EAAEC;AANR,MApBF;AAAA,IADF;AA+BD,CA/C+B,CAAhC;AAiDA,8BAAeS,UAAI,CAACtB,QAAD,CAAnB;;;;"}
+{"version":3,"file":"PageItem.js","sources":["../../../../../src/components/Panels/AllSlidesPanel/PageItem.js"],"sourcesContent":["import { memo } from 'react';\nimport { SortableElement } from 'react-sortable-hoc';\nimport classNames from 'classnames';\nimport StaticPage from '../../Preview/StaticPage';\nimport PageThumbnailActions from './PageThumbnailActions';\n\nconst PageItem = SortableElement(({\n  acceptedItems,\n  additionalPageItems,\n  hashCode,\n  isSelected,\n  itemAccessor,\n  onAnEventTrigger,\n  onPageAdd,\n  onPageClick,\n  onPageDuplicate,\n  onPageRemove,\n  order,\n  page,\n  style,\n}) => {\n  const onKeyDown = f => f;\n  return (\n    <div\n      className={(\n        classNames('thumbnailWrapper d-flex dir-col a-center j-center p-relative', { isSelected })\n      )}\n      data-id={page.id}\n      data-order={order}\n      onClick={onPageClick}\n      onKeyDown={onKeyDown}\n    >\n      <div className=\"thumbnailOrder\">{order}</div>\n      <div className=\"thumbnailFrame o-hidden\">\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      <PageThumbnailActions\n        onAnEventTrigger={onAnEventTrigger}\n        onPageAdd={onPageAdd}\n        onPageDuplicate={onPageDuplicate}\n        onPageRemove={onPageRemove}\n        order={order}\n        page={page}\n      />\n    </div>\n  );\n});\n\nexport default memo(PageItem);\n"],"names":["PageItem","SortableElement","acceptedItems","additionalPageItems","hashCode","isSelected","itemAccessor","onAnEventTrigger","onPageAdd","onPageClick","onPageDuplicate","onPageRemove","order","page","style","onKeyDown","f","_jsxs","classNames","id","_jsx","StaticPage","items","memo"],"mappings":";;;;;;;;;;;;;AAMA,IAAMA,QAAQ,GAAGC,gCAAe,CAAC,gBAc3B;AAAA,MAbJC,aAaI,QAbJA,aAaI;AAAA,MAZJC,mBAYI,QAZJA,mBAYI;AAAA,MAXJC,QAWI,QAXJA,QAWI;AAAA,MAVJC,UAUI,QAVJA,UAUI;AAAA,MATJC,YASI,QATJA,YASI;AAAA,MARJC,gBAQI,QARJA,gBAQI;AAAA,MAPJC,SAOI,QAPJA,SAOI;AAAA,MANJC,WAMI,QANJA,WAMI;AAAA,MALJC,eAKI,QALJA,eAKI;AAAA,MAJJC,YAII,QAJJA,YAII;AAAA,MAHJC,KAGI,QAHJA,KAGI;AAAA,MAFJC,IAEI,QAFJA,IAEI;AAAA,MADJC,KACI,QADJA,KACI;;AACJ,MAAMC,SAAS,GAAG,SAAZA,SAAY,CAAAC,CAAC;AAAA,WAAIA,CAAJ;AAAA,GAAnB;;AACA,sBACEC;AACE,IAAA,SAAS,EACPC,8BAAU,CAAC,8DAAD,EAAiE;AAAEb,MAAAA,UAAU,EAAVA;AAAF,KAAjE,CAFd;AAIE,eAASQ,IAAI,CAACM,EAJhB;AAKE,kBAAYP,KALd;AAME,IAAA,OAAO,EAAEH,WANX;AAOE,IAAA,SAAS,EAAEM,SAPb;AAAA,4BASEK;AAAK,MAAA,SAAS,EAAC,gBAAf;AAAA,gBAAiCR;AAAjC,MATF,eAUEQ;AAAK,MAAA,SAAS,EAAC,yBAAf;AAAA,6BACEA,eAACC,qBAAD;AACE,QAAA,aAAa,EAAEnB,aADjB;AAEE,QAAA,mBAAmB,EAAEC,mBAFvB;AAGE,QAAA,QAAQ,EAAEC,QAHZ;AAIE,QAAA,YAAY,EAAEE,YAJhB;AAKE,QAAA,KAAK,EAAEO,IAAI,CAACS,KALd;AAME,QAAA,KAAK,EAAER;AANT;AADF,MAVF,eAoBEM,eAAC,oBAAD;AACE,MAAA,gBAAgB,EAAEb,gBADpB;AAEE,MAAA,SAAS,EAAEC,SAFb;AAGE,MAAA,eAAe,EAAEE,eAHnB;AAIE,MAAA,YAAY,EAAEC,YAJhB;AAKE,MAAA,KAAK,EAAEC,KALT;AAME,MAAA,IAAI,EAAEC;AANR,MApBF;AAAA,IADF;AA+BD,CA/C+B,CAAhC;AAiDA,8BAAeU,UAAI,CAACvB,QAAD,CAAnB;;;;"}

package/lib/cjs/components/Panels/SlidesPanel/SortablePageItem.js

@@ -46,7 +46,7 @@ var SortablePageItem = reactSortableHoc.SortableElement(function (_ref) {
       children: order
     }), /*#__PURE__*/jsxRuntime.jsx("div", {
       className: "thumbnailFrame o-hidden",
-      children: /*#__PURE__*/jsxRuntime.jsx(StaticPage, {
+      children: /*#__PURE__*/jsxRuntime.jsx(StaticPage['default'], {
         acceptedItems: acceptedItems,
         additionalPageItems: additionalPageItems,
         hashCode: hashCode,

package/lib/cjs/components/Panels/SlidesPanel/SortablePageItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"SortablePageItem.js","sources":["../../../../../src/components/Panels/SlidesPanel/SortablePageItem.js"],"sourcesContent":["import { memo } from 'react';\nimport { SortableElement } from 'react-sortable-hoc';\nimport classNames from 'classnames';\nimport StaticPage from '../../Preview/StaticPage';\nimport PageThumbnailActions from './PageThumbnailActions';\n\nconst SortablePageItem = SortableElement(({\n  acceptedItems,\n  additionalPageItems,\n  disableInteraction,\n  hashCode,\n  isSelected,\n  itemAccessor,\n  onAnEventTrigger,\n  onPageAdd,\n  onPageClick,\n  onPageDuplicate,\n  onPageRemove,\n  order,\n  page,\n  pageContainerStyle,\n  style,\n}) => {\n  const onKeyDown = f => f;\n  return (\n    <div\n      className={classNames('thumbnailWrapper d-flex a-center j-between', { isSelected })}\n      data-id={page.id}\n      data-order={order}\n      onClick={onPageClick}\n      onKeyDown={onKeyDown}\n      style={style}\n    >\n      <div className=\"thumbnailOrder\">{order}</div>\n      <div className=\"thumbnailFrame o-hidden\">\n        <StaticPage\n          acceptedItems={acceptedItems}\n          additionalPageItems={additionalPageItems}\n          hashCode={hashCode}\n          itemAccessor={itemAccessor}\n          items={page.items}\n          style={pageContainerStyle}\n        />\n      </div>\n      <PageThumbnailActions\n        disableInteraction={disableInteraction}\n        onAnEventTrigger={onAnEventTrigger}\n        onPageAdd={onPageAdd}\n        onPageDuplicate={onPageDuplicate}\n        onPageRemove={onPageRemove}\n        order={order}\n        page={page}\n      />\n    </div>\n  );\n});\n\nexport default memo(SortablePageItem);\n"],"names":["SortablePageItem","SortableElement","acceptedItems","additionalPageItems","disableInteraction","hashCode","isSelected","itemAccessor","onAnEventTrigger","onPageAdd","onPageClick","onPageDuplicate","onPageRemove","order","page","pageContainerStyle","style","onKeyDown","f","_jsxs","classNames","id","_jsx","items","memo"],"mappings":";;;;;;;;;;;;;AAMA,IAAMA,gBAAgB,GAAGC,gCAAe,CAAC,gBAgBnC;AAAA,MAfJC,aAeI,QAfJA,aAeI;AAAA,MAdJC,mBAcI,QAdJA,mBAcI;AAAA,MAbJC,kBAaI,QAbJA,kBAaI;AAAA,MAZJC,QAYI,QAZJA,QAYI;AAAA,MAXJC,UAWI,QAXJA,UAWI;AAAA,MAVJC,YAUI,QAVJA,YAUI;AAAA,MATJC,gBASI,QATJA,gBASI;AAAA,MARJC,SAQI,QARJA,SAQI;AAAA,MAPJC,WAOI,QAPJA,WAOI;AAAA,MANJC,eAMI,QANJA,eAMI;AAAA,MALJC,YAKI,QALJA,YAKI;AAAA,MAJJC,KAII,QAJJA,KAII;AAAA,MAHJC,IAGI,QAHJA,IAGI;AAAA,MAFJC,kBAEI,QAFJA,kBAEI;AAAA,MADJC,KACI,QADJA,KACI;;AACJ,MAAMC,SAAS,GAAG,SAAZA,SAAY,CAAAC,CAAC;AAAA,WAAIA,CAAJ;AAAA,GAAnB;;AACA,sBACEC;AACE,IAAA,SAAS,EAAEC,8BAAU,CAAC,4CAAD,EAA+C;AAAEd,MAAAA,UAAU,EAAVA;AAAF,KAA/C,CADvB;AAEE,eAASQ,IAAI,CAACO,EAFhB;AAGE,kBAAYR,KAHd;AAIE,IAAA,OAAO,EAAEH,WAJX;AAKE,IAAA,SAAS,EAAEO,SALb;AAME,IAAA,KAAK,EAAED,KANT;AAAA,4BAQEM;AAAK,MAAA,SAAS,EAAC,gBAAf;AAAA,gBAAiCT;AAAjC,MARF,eASES;AAAK,MAAA,SAAS,EAAC,yBAAf;AAAA,6BACEA,eAAC,UAAD;AACE,QAAA,aAAa,EAAEpB,aADjB;AAEE,QAAA,mBAAmB,EAAEC,mBAFvB;AAGE,QAAA,QAAQ,EAAEE,QAHZ;AAIE,QAAA,YAAY,EAAEE,YAJhB;AAKE,QAAA,KAAK,EAAEO,IAAI,CAACS,KALd;AAME,QAAA,KAAK,EAAER;AANT;AADF,MATF,eAmBEO,eAAC,oBAAD;AACE,MAAA,kBAAkB,EAAElB,kBADtB;AAEE,MAAA,gBAAgB,EAAEI,gBAFpB;AAGE,MAAA,SAAS,EAAEC,SAHb;AAIE,MAAA,eAAe,EAAEE,eAJnB;AAKE,MAAA,YAAY,EAAEC,YALhB;AAME,MAAA,KAAK,EAAEC,KANT;AAOE,MAAA,IAAI,EAAEC;AAPR,MAnBF;AAAA,IADF;AA+BD,CAjDuC,CAAxC;AAmDA,sCAAeU,UAAI,CAACxB,gBAAD,CAAnB;;;;"}
+{"version":3,"file":"SortablePageItem.js","sources":["../../../../../src/components/Panels/SlidesPanel/SortablePageItem.js"],"sourcesContent":["import { memo } from 'react';\nimport { SortableElement } from 'react-sortable-hoc';\nimport classNames from 'classnames';\nimport StaticPage from '../../Preview/StaticPage';\nimport PageThumbnailActions from './PageThumbnailActions';\n\nconst SortablePageItem = SortableElement(({\n  acceptedItems,\n  additionalPageItems,\n  disableInteraction,\n  hashCode,\n  isSelected,\n  itemAccessor,\n  onAnEventTrigger,\n  onPageAdd,\n  onPageClick,\n  onPageDuplicate,\n  onPageRemove,\n  order,\n  page,\n  pageContainerStyle,\n  style,\n}) => {\n  const onKeyDown = f => f;\n  return (\n    <div\n      className={classNames('thumbnailWrapper d-flex a-center j-between', { isSelected })}\n      data-id={page.id}\n      data-order={order}\n      onClick={onPageClick}\n      onKeyDown={onKeyDown}\n      style={style}\n    >\n      <div className=\"thumbnailOrder\">{order}</div>\n      <div className=\"thumbnailFrame o-hidden\">\n        <StaticPage\n          acceptedItems={acceptedItems}\n          additionalPageItems={additionalPageItems}\n          hashCode={hashCode}\n          itemAccessor={itemAccessor}\n          items={page.items}\n          style={pageContainerStyle}\n        />\n      </div>\n      <PageThumbnailActions\n        disableInteraction={disableInteraction}\n        onAnEventTrigger={onAnEventTrigger}\n        onPageAdd={onPageAdd}\n        onPageDuplicate={onPageDuplicate}\n        onPageRemove={onPageRemove}\n        order={order}\n        page={page}\n      />\n    </div>\n  );\n});\n\nexport default memo(SortablePageItem);\n"],"names":["SortablePageItem","SortableElement","acceptedItems","additionalPageItems","disableInteraction","hashCode","isSelected","itemAccessor","onAnEventTrigger","onPageAdd","onPageClick","onPageDuplicate","onPageRemove","order","page","pageContainerStyle","style","onKeyDown","f","_jsxs","classNames","id","_jsx","StaticPage","items","memo"],"mappings":";;;;;;;;;;;;;AAMA,IAAMA,gBAAgB,GAAGC,gCAAe,CAAC,gBAgBnC;AAAA,MAfJC,aAeI,QAfJA,aAeI;AAAA,MAdJC,mBAcI,QAdJA,mBAcI;AAAA,MAbJC,kBAaI,QAbJA,kBAaI;AAAA,MAZJC,QAYI,QAZJA,QAYI;AAAA,MAXJC,UAWI,QAXJA,UAWI;AAAA,MAVJC,YAUI,QAVJA,YAUI;AAAA,MATJC,gBASI,QATJA,gBASI;AAAA,MARJC,SAQI,QARJA,SAQI;AAAA,MAPJC,WAOI,QAPJA,WAOI;AAAA,MANJC,eAMI,QANJA,eAMI;AAAA,MALJC,YAKI,QALJA,YAKI;AAAA,MAJJC,KAII,QAJJA,KAII;AAAA,MAHJC,IAGI,QAHJA,IAGI;AAAA,MAFJC,kBAEI,QAFJA,kBAEI;AAAA,MADJC,KACI,QADJA,KACI;;AACJ,MAAMC,SAAS,GAAG,SAAZA,SAAY,CAAAC,CAAC;AAAA,WAAIA,CAAJ;AAAA,GAAnB;;AACA,sBACEC;AACE,IAAA,SAAS,EAAEC,8BAAU,CAAC,4CAAD,EAA+C;AAAEd,MAAAA,UAAU,EAAVA;AAAF,KAA/C,CADvB;AAEE,eAASQ,IAAI,CAACO,EAFhB;AAGE,kBAAYR,KAHd;AAIE,IAAA,OAAO,EAAEH,WAJX;AAKE,IAAA,SAAS,EAAEO,SALb;AAME,IAAA,KAAK,EAAED,KANT;AAAA,4BAQEM;AAAK,MAAA,SAAS,EAAC,gBAAf;AAAA,gBAAiCT;AAAjC,MARF,eASES;AAAK,MAAA,SAAS,EAAC,yBAAf;AAAA,6BACEA,eAACC,qBAAD;AACE,QAAA,aAAa,EAAErB,aADjB;AAEE,QAAA,mBAAmB,EAAEC,mBAFvB;AAGE,QAAA,QAAQ,EAAEE,QAHZ;AAIE,QAAA,YAAY,EAAEE,YAJhB;AAKE,QAAA,KAAK,EAAEO,IAAI,CAACU,KALd;AAME,QAAA,KAAK,EAAET;AANT;AADF,MATF,eAmBEO,eAAC,oBAAD;AACE,MAAA,kBAAkB,EAAElB,kBADtB;AAEE,MAAA,gBAAgB,EAAEI,gBAFpB;AAGE,MAAA,SAAS,EAAEC,SAHb;AAIE,MAAA,eAAe,EAAEE,eAJnB;AAKE,MAAA,YAAY,EAAEC,YALhB;AAME,MAAA,KAAK,EAAEC,KANT;AAOE,MAAA,IAAI,EAAEC;AAPR,MAnBF;AAAA,IADF;AA+BD,CAjDuC,CAAxC;AAmDA,sCAAeW,UAAI,CAACzB,gBAAD,CAAnB;;;;"}

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

@@ -1,5 +1,7 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
 require('core-js/modules/es.array.filter.js');
 require('core-js/modules/es.array.map.js');
 var React = require('react');
@@ -8,6 +10,7 @@ var classNames = require('../../constants/classNames.js');
 var ReportItemRenderer = require('../Builder/ReportItemRenderer.js');
 var StaticItem = require('./StaticItem.js');
 var getMergedItem = require('../../utils/getMergedItem.js');
+var withZoomPanPinchHOC = require('../withZoomPanPinchHOC.js');
 var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -65,6 +68,8 @@ StaticPage.defaultProps = {
   style: {}
 };
 var StaticPage$1 = /*#__PURE__*/React.memo(StaticPage);
+var StaticPageWithZoomPanPinch = withZoomPanPinchHOC(StaticPage);
 
-module.exports = StaticPage$1;
+exports.StaticPageWithZoomPanPinch = StaticPageWithZoomPanPinch;
+exports.default = StaticPage$1;
 //# sourceMappingURL=StaticPage.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"StaticPage.js","sources":["../../../../src/components/Preview/StaticPage.js"],"sourcesContent":["import { memo } from 'react';\nimport PropTypes from 'prop-types';\nimport * as classNames from '../../constants/classNames';\nimport ReportItemRenderer from '../Builder/ReportItemRenderer';\nimport StaticItem from './StaticItem';\nimport getMergedItem from '../../utils/getMergedItem';\n\nconst StaticPage = ({\n  acceptedItems,\n  additionalPageItems,\n  hashCode,\n  itemAccessor,\n  items,\n  style,\n}) => (\n  <div\n    className={classNames.pageContainer}\n    style={style}\n  >\n    <div className=\"jfReport-hider o-hidden f-all p-relative\">\n      {items.filter(item => (\n        item.isVisible !== undefined\n          ? item.isVisible\n          : true\n      )).map(item => {\n        const mergedItem = getMergedItem(item, acceptedItems);\n        return (\n          <StaticItem\n            key={item.id}\n            hashCode={hashCode}\n            item={item}\n          >\n            <ReportItemRenderer\n              item={item}\n            >\n              {ReportItem => (\n                <ReportItem\n                  item={mergedItem}\n                  itemAccessor={itemAccessor}\n                />\n              )}\n            </ReportItemRenderer>\n          </StaticItem>\n        );\n      })}\n      {additionalPageItems}\n    </div>\n  </div>\n);\n\nStaticPage.propTypes = {\n  acceptedItems: PropTypes.shape({}),\n  additionalPageItems: PropTypes.arrayOf(PropTypes.node),\n  hashCode: PropTypes.string,\n  itemAccessor: PropTypes.func,\n  items: PropTypes.arrayOf(PropTypes.shape({})),\n  style: PropTypes.shape({}),\n};\n\nStaticPage.defaultProps = {\n  acceptedItems: {},\n  additionalPageItems: [],\n  hashCode: '',\n  itemAccessor: () => {},\n  items: [],\n  style: {},\n};\n\nexport default memo(StaticPage);\n"],"names":["StaticPage","acceptedItems","additionalPageItems","hashCode","itemAccessor","items","style","_jsx","classNames","_jsxs","filter","item","isVisible","undefined","map","mergedItem","getMergedItem","ReportItem","id","propTypes","PropTypes","shape","arrayOf","node","string","func","defaultProps","memo"],"mappings":";;;;;;;;;;;;;;;;AAOA,IAAMA,UAAU,GAAG,SAAbA,UAAa;AAAA,MACjBC,aADiB,QACjBA,aADiB;AAAA,MAEjBC,mBAFiB,QAEjBA,mBAFiB;AAAA,MAGjBC,QAHiB,QAGjBA,QAHiB;AAAA,MAIjBC,YAJiB,QAIjBA,YAJiB;AAAA,MAKjBC,KALiB,QAKjBA,KALiB;AAAA,MAMjBC,KANiB,QAMjBA,KANiB;AAAA,sBAQjBC;AACE,IAAA,SAAS,EAAEC,wBADb;AAEE,IAAA,KAAK,EAAEF,KAFT;AAAA,2BAIEG;AAAK,MAAA,SAAS,EAAC,0CAAf;AAAA,iBACGJ,KAAK,CAACK,MAAN,CAAa,UAAAC,IAAI;AAAA,eAChBA,IAAI,CAACC,SAAL,KAAmBC,SAAnB,GACIF,IAAI,CAACC,SADT,GAEI,IAHY;AAAA,OAAjB,EAIEE,GAJF,CAIM,UAAAH,IAAI,EAAI;AACb,YAAMI,UAAU,GAAGC,aAAa,CAACL,IAAD,EAAOV,aAAP,CAAhC;AACA,4BACEM,eAAC,UAAD;AAEE,UAAA,QAAQ,EAAEJ,QAFZ;AAGE,UAAA,IAAI,EAAEQ,IAHR;AAAA,iCAKEJ,eAAC,kBAAD;AACE,YAAA,IAAI,EAAEI,IADR;AAAA,sBAGG,kBAAAM,UAAU;AAAA,kCACTV,eAAC,UAAD;AACE,gBAAA,IAAI,EAAEQ,UADR;AAEE,gBAAA,YAAY,EAAEX;AAFhB,gBADS;AAAA;AAHb;AALF,WACOO,IAAI,CAACO,EADZ,CADF;AAkBD,OAxBA,CADH,EA0BGhB,mBA1BH;AAAA;AAJF,IARiB;AAAA,CAAnB;;AA2CAF,UAAU,CAACmB,SAAX,GAAuB;AACrBlB,EAAAA,aAAa,EAAEmB,6BAAS,CAACC,KAAV,CAAgB,EAAhB,CADM;AAErBnB,EAAAA,mBAAmB,EAAEkB,6BAAS,CAACE,OAAV,CAAkBF,6BAAS,CAACG,IAA5B,CAFA;AAGrBpB,EAAAA,QAAQ,EAAEiB,6BAAS,CAACI,MAHC;AAIrBpB,EAAAA,YAAY,EAAEgB,6BAAS,CAACK,IAJH;AAKrBpB,EAAAA,KAAK,EAAEe,6BAAS,CAACE,OAAV,CAAkBF,6BAAS,CAACC,KAAV,CAAgB,EAAhB,CAAlB,CALc;AAMrBf,EAAAA,KAAK,EAAEc,6BAAS,CAACC,KAAV,CAAgB,EAAhB;AANc,CAAvB;AASArB,UAAU,CAAC0B,YAAX,GAA0B;AACxBzB,EAAAA,aAAa,EAAE,EADS;AAExBC,EAAAA,mBAAmB,EAAE,EAFG;AAGxBC,EAAAA,QAAQ,EAAE,EAHc;AAIxBC,EAAAA,YAAY,EAAE,wBAAM,EAJI;AAKxBC,EAAAA,KAAK,EAAE,EALiB;AAMxBC,EAAAA,KAAK,EAAE;AANiB,CAA1B;AASA,gCAAeqB,UAAI,CAAC3B,UAAD,CAAnB;;;;"}
+{"version":3,"file":"StaticPage.js","sources":["../../../../src/components/Preview/StaticPage.js"],"sourcesContent":["import { memo } from 'react';\nimport PropTypes from 'prop-types';\nimport * as classNames from '../../constants/classNames';\nimport ReportItemRenderer from '../Builder/ReportItemRenderer';\nimport StaticItem from './StaticItem';\nimport getMergedItem from '../../utils/getMergedItem';\nimport withZoomPanPinchHOC from '../withZoomPanPinchHOC';\n\nconst StaticPage = ({\n  acceptedItems,\n  additionalPageItems,\n  hashCode,\n  itemAccessor,\n  items,\n  style,\n}) => (\n  <div\n    className={classNames.pageContainer}\n    style={style}\n  >\n    <div className=\"jfReport-hider o-hidden f-all p-relative\">\n      {items.filter(item => (\n        item.isVisible !== undefined\n          ? item.isVisible\n          : true\n      )).map(item => {\n        const mergedItem = getMergedItem(item, acceptedItems);\n        return (\n          <StaticItem\n            key={item.id}\n            hashCode={hashCode}\n            item={item}\n          >\n            <ReportItemRenderer\n              item={item}\n            >\n              {ReportItem => (\n                <ReportItem\n                  item={mergedItem}\n                  itemAccessor={itemAccessor}\n                />\n              )}\n            </ReportItemRenderer>\n          </StaticItem>\n        );\n      })}\n      {additionalPageItems}\n    </div>\n  </div>\n);\n\nStaticPage.propTypes = {\n  acceptedItems: PropTypes.shape({}),\n  additionalPageItems: PropTypes.arrayOf(PropTypes.node),\n  hashCode: PropTypes.string,\n  itemAccessor: PropTypes.func,\n  items: PropTypes.arrayOf(PropTypes.shape({})),\n  style: PropTypes.shape({}),\n};\n\nStaticPage.defaultProps = {\n  acceptedItems: {},\n  additionalPageItems: [],\n  hashCode: '',\n  itemAccessor: () => {},\n  items: [],\n  style: {},\n};\n\nexport default memo(StaticPage);\nexport const StaticPageWithZoomPanPinch = withZoomPanPinchHOC(StaticPage);\n"],"names":["StaticPage","acceptedItems","additionalPageItems","hashCode","itemAccessor","items","style","_jsx","classNames","_jsxs","filter","item","isVisible","undefined","map","mergedItem","getMergedItem","ReportItem","id","propTypes","PropTypes","shape","arrayOf","node","string","func","defaultProps","memo","StaticPageWithZoomPanPinch","withZoomPanPinchHOC"],"mappings":";;;;;;;;;;;;;;;;;;;AAQA,IAAMA,UAAU,GAAG,SAAbA,UAAa;AAAA,MACjBC,aADiB,QACjBA,aADiB;AAAA,MAEjBC,mBAFiB,QAEjBA,mBAFiB;AAAA,MAGjBC,QAHiB,QAGjBA,QAHiB;AAAA,MAIjBC,YAJiB,QAIjBA,YAJiB;AAAA,MAKjBC,KALiB,QAKjBA,KALiB;AAAA,MAMjBC,KANiB,QAMjBA,KANiB;AAAA,sBAQjBC;AACE,IAAA,SAAS,EAAEC,wBADb;AAEE,IAAA,KAAK,EAAEF,KAFT;AAAA,2BAIEG;AAAK,MAAA,SAAS,EAAC,0CAAf;AAAA,iBACGJ,KAAK,CAACK,MAAN,CAAa,UAAAC,IAAI;AAAA,eAChBA,IAAI,CAACC,SAAL,KAAmBC,SAAnB,GACIF,IAAI,CAACC,SADT,GAEI,IAHY;AAAA,OAAjB,EAIEE,GAJF,CAIM,UAAAH,IAAI,EAAI;AACb,YAAMI,UAAU,GAAGC,aAAa,CAACL,IAAD,EAAOV,aAAP,CAAhC;AACA,4BACEM,eAAC,UAAD;AAEE,UAAA,QAAQ,EAAEJ,QAFZ;AAGE,UAAA,IAAI,EAAEQ,IAHR;AAAA,iCAKEJ,eAAC,kBAAD;AACE,YAAA,IAAI,EAAEI,IADR;AAAA,sBAGG,kBAAAM,UAAU;AAAA,kCACTV,eAAC,UAAD;AACE,gBAAA,IAAI,EAAEQ,UADR;AAEE,gBAAA,YAAY,EAAEX;AAFhB,gBADS;AAAA;AAHb;AALF,WACOO,IAAI,CAACO,EADZ,CADF;AAkBD,OAxBA,CADH,EA0BGhB,mBA1BH;AAAA;AAJF,IARiB;AAAA,CAAnB;;AA2CAF,UAAU,CAACmB,SAAX,GAAuB;AACrBlB,EAAAA,aAAa,EAAEmB,6BAAS,CAACC,KAAV,CAAgB,EAAhB,CADM;AAErBnB,EAAAA,mBAAmB,EAAEkB,6BAAS,CAACE,OAAV,CAAkBF,6BAAS,CAACG,IAA5B,CAFA;AAGrBpB,EAAAA,QAAQ,EAAEiB,6BAAS,CAACI,MAHC;AAIrBpB,EAAAA,YAAY,EAAEgB,6BAAS,CAACK,IAJH;AAKrBpB,EAAAA,KAAK,EAAEe,6BAAS,CAACE,OAAV,CAAkBF,6BAAS,CAACC,KAAV,CAAgB,EAAhB,CAAlB,CALc;AAMrBf,EAAAA,KAAK,EAAEc,6BAAS,CAACC,KAAV,CAAgB,EAAhB;AANc,CAAvB;AASArB,UAAU,CAAC0B,YAAX,GAA0B;AACxBzB,EAAAA,aAAa,EAAE,EADS;AAExBC,EAAAA,mBAAmB,EAAE,EAFG;AAGxBC,EAAAA,QAAQ,EAAE,EAHc;AAIxBC,EAAAA,YAAY,EAAE,wBAAM,EAJI;AAKxBC,EAAAA,KAAK,EAAE,EALiB;AAMxBC,EAAAA,KAAK,EAAE;AANiB,CAA1B;AASA,gCAAeqB,UAAI,CAAC3B,UAAD,CAAnB;IACa4B,0BAA0B,GAAGC,mBAAmB,CAAC7B,UAAD;;;;;"}

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

@@ -9,7 +9,6 @@ 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');
@@ -43,7 +42,6 @@ var StaticScene = function StaticScene(_ref) {
       presentationPage = _ref.presentationPage;
 
   var _usePresentationConte = presentationContext.usePresentationContext(),
-      fittedZoom = _usePresentationConte.fittedZoom,
       isFullscreen = _usePresentationConte.isFullscreen,
       showControlsInFullScreen = _usePresentationConte.showControlsInFullScreen;
 
@@ -68,11 +66,6 @@ var StaticScene = function StaticScene(_ref) {
       reportPageTransition = _settings$reportPageT === void 0 ? 'noAnimation' : _settings$reportPageT;
   var width = parseInt(reportLayoutWidth, 10);
   var height = parseInt(reportLayoutHeight, 10);
-  React.useEffect(function () {
-    if (mode === 'print') {
-      setZoom(1);
-    }
-  }, [mode]);
   React.useEffect(function () {
     if (viewPortRef.current) {
       viewPortRef.current.scrollTop = lastScrollPosition;
@@ -81,7 +74,7 @@ var StaticScene = function StaticScene(_ref) {
 
   React.useEffect(function () {
     transformRefs.current = transformRefs.current.slice(0, pages.length);
-  }, [pages]);
+  }, [pages.length]);
   var pageContainerStyles = React.useMemo(function () {
     return {
       height: height,
@@ -103,7 +96,7 @@ var StaticScene = function StaticScene(_ref) {
         transformRefs.current[i].centerView(zoom);
       }
     }
-  }, [pages.length, zoom, isFullscreen]);
+  }, [pages.length, zoom, isFullscreen, mode]);
   return /*#__PURE__*/jsxRuntime.jsxs("main", {
     className: classNames.mainWrapper,
     children: [/*#__PURE__*/jsxRuntime.jsx("div", _objectSpread(_objectSpread({
@@ -124,40 +117,18 @@ var StaticScene = function StaticScene(_ref) {
 
           return /*#__PURE__*/jsxRuntime.jsx("div", {
             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) {
+            children: /*#__PURE__*/jsxRuntime.jsx(StaticPage.StaticPageWithZoomPanPinch, {
+              acceptedItems: acceptedItems,
+              additionalPageItems: additionalPageItems,
+              handleZoom: handleZoom,
+              hashCode: hashCode,
+              itemAccessor: itemAccessor,
+              items: page.items,
+              mode: mode,
+              refSetter: function refSetter(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
-                })
-              })
+              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 {\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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"}
+{"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 * as classNames from '../../constants/classNames';\nimport { StaticPageWithZoomPanPinch } 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  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 (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.length]);\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, mode]);\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                <StaticPageWithZoomPanPinch\n                  acceptedItems={acceptedItems}\n                  additionalPageItems={additionalPageItems}\n                  handleZoom={handleZoom}\n                  hashCode={hashCode}\n                  itemAccessor={itemAccessor}\n                  items={page.items}\n                  mode={mode}\n                  refSetter={element => { transformRefs.current[index] = element; }}\n                  style={style}\n                />\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","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","StaticPageWithZoomPanPinch","items","element","toString","propTypes","PropTypes","arrayOf","node","func","string","bool","number","shape","defaultProps"],"mappings":"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"}

package/lib/cjs/components/withZoomPanPinchHOC.js

@@ -0,0 +1,73 @@
+'use strict';
+
+var PropTypes = require('prop-types');
+var reactZoomPanPinch = require('react-zoom-pan-pinch');
+var builderContext = require('../utils/builderContext.js');
+var presentationContext = require('../utils/presentationContext.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+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; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+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 withZoomPanPinchHOC = function withZoomPanPinchHOC(WrappedComponent) {
+  var ZoomPanPinchHOC = function ZoomPanPinchHOC(props) {
+    var handleZoom = props.handleZoom,
+        mode = props.mode,
+        refSetter = props.refSetter;
+
+    var _useBuilderContext = builderContext.useBuilderContext(),
+        zoom = _useBuilderContext.zoom;
+
+    var _usePresentationConte = presentationContext.usePresentationContext(),
+        fittedZoom = _usePresentationConte.fittedZoom;
+
+    if (mode === 'print') {
+      return /*#__PURE__*/jsxRuntime.jsx(WrappedComponent, _objectSpread({}, props));
+    }
+
+    return /*#__PURE__*/jsxRuntime.jsx(reactZoomPanPinch.TransformWrapper, {
+      ref: refSetter,
+      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(WrappedComponent, _objectSpread({}, props))
+      })
+    });
+  };
+
+  ZoomPanPinchHOC.propTypes = {
+    handleZoom: PropTypes.func.isRequired,
+    mode: PropTypes.string,
+    refSetter: PropTypes.oneOfType([PropTypes.func, PropTypes.shape({
+      current: PropTypes.any
+    })]).isRequired
+  };
+  ZoomPanPinchHOC.defaultProps = {
+    mode: ''
+  };
+  return ZoomPanPinchHOC;
+};
+
+module.exports = withZoomPanPinchHOC;
+//# sourceMappingURL=withZoomPanPinchHOC.js.map

package/lib/cjs/components/withZoomPanPinchHOC.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"withZoomPanPinchHOC.js","sources":["../../../src/components/withZoomPanPinchHOC.js"],"sourcesContent":["import {\n  string, func, any, oneOfType, shape,\n} from 'prop-types';\nimport { TransformWrapper, TransformComponent } from 'react-zoom-pan-pinch';\nimport { useBuilderContext } from '../utils/builderContext';\nimport { usePresentationContext } from '../utils/presentationContext';\n\nconst withZoomPanPinchHOC = WrappedComponent => {\n  const ZoomPanPinchHOC = props => {\n    const { handleZoom, mode, refSetter } = props;\n\n    const { zoom } = useBuilderContext();\n    const { fittedZoom } = usePresentationContext();\n\n    if (mode === 'print') {\n      return <WrappedComponent {...props} />;\n    }\n\n    return (\n      <TransformWrapper\n        ref={refSetter}\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          <WrappedComponent {...props} />\n        </TransformComponent>\n      </TransformWrapper>\n    );\n  };\n\n  ZoomPanPinchHOC.propTypes = {\n    handleZoom: func.isRequired,\n    mode: string,\n    refSetter: oneOfType([\n      func,\n      shape({ current: any }),\n    ]).isRequired,\n  };\n\n  ZoomPanPinchHOC.defaultProps = {\n    mode: '',\n  };\n\n  return ZoomPanPinchHOC;\n};\n\nexport default withZoomPanPinchHOC;\n"],"names":["withZoomPanPinchHOC","WrappedComponent","ZoomPanPinchHOC","props","handleZoom","mode","refSetter","useBuilderContext","zoom","usePresentationContext","fittedZoom","_jsx","TransformWrapper","step","disabled","TransformComponent","height","width","propTypes","func","isRequired","string","oneOfType","shape","current","any","defaultProps"],"mappings":";;;;;;;;;;;;;;IAOMA,mBAAmB,GAAG,SAAtBA,mBAAsB,CAAAC,gBAAgB,EAAI;AAC9C,MAAMC,eAAe,GAAG,SAAlBA,eAAkB,CAAAC,KAAK,EAAI;AAC/B,QAAQC,UAAR,GAAwCD,KAAxC,CAAQC,UAAR;AAAA,QAAoBC,IAApB,GAAwCF,KAAxC,CAAoBE,IAApB;AAAA,QAA0BC,SAA1B,GAAwCH,KAAxC,CAA0BG,SAA1B;;AAEA,6BAAiBC,gCAAiB,EAAlC;AAAA,QAAQC,IAAR,sBAAQA,IAAR;;AACA,gCAAuBC,0CAAsB,EAA7C;AAAA,QAAQC,UAAR,yBAAQA,UAAR;;AAEA,QAAIL,IAAI,KAAK,OAAb,EAAsB;AACpB,0BAAOM,eAAC,gBAAD,oBAAsBR,KAAtB,EAAP;AACD;;AAED,wBACEQ,eAACC,kCAAD;AACE,MAAA,GAAG,EAAEN,SADP;AAEE,MAAA,YAAY,EAAE,IAFhB;AAGE,MAAA,eAAe,EAAE,IAHnB;AAIE,MAAA,cAAc,EAAE,IAJlB;AAKE,MAAA,WAAW,EAAE;AACXO,QAAAA,IAAI,EAAE;AADK,OALf;AAQE,MAAA,YAAY,EAAEL,IARhB;AASE,MAAA,QAAQ,EAAE,CATZ;AAUE,MAAA,QAAQ,EAAE,GAVZ;AAWE,MAAA,MAAM,EAAEJ,UAXV;AAYE,MAAA,OAAO,EAAE;AACPU,QAAAA,QAAQ,EAAEN,IAAI,IAAIE;AADX,OAZX;AAeE,MAAA,KAAK,EAAE;AACLG,QAAAA,IAAI,EAAE;AADD,OAfT;AAAA,6BAmBEF,eAACI,oCAAD;AACE,QAAA,YAAY,EAAE;AAAEC,UAAAA,MAAM,EAAE,MAAV;AAAkBC,UAAAA,KAAK,EAAE;AAAzB,SADhB;AAAA,+BAGEN,eAAC,gBAAD,oBAAsBR,KAAtB;AAHF;AAnBF,MADF;AA2BD,GArCD;;AAuCAD,EAAAA,eAAe,CAACgB,SAAhB,GAA4B;AAC1Bd,IAAAA,UAAU,EAAEe,cAAI,CAACC,UADS;AAE1Bf,IAAAA,IAAI,EAAEgB,gBAFoB;AAG1Bf,IAAAA,SAAS,EAAEgB,mBAAS,CAAC,CACnBH,cADmB,EAEnBI,eAAK,CAAC;AAAEC,MAAAA,OAAO,EAAEC;AAAX,KAAD,CAFc,CAAD,CAAT,CAGRL;AANuB,GAA5B;AASAlB,EAAAA,eAAe,CAACwB,YAAhB,GAA+B;AAC7BrB,IAAAA,IAAI,EAAE;AADuB,GAA/B;AAIA,SAAOH,eAAP;AACD;;;;"}

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

@@ -6,6 +6,7 @@ import { pageContainer } from '../../constants/classNames.js';
 import ReportItemRenderer from '../Builder/ReportItemRenderer.js';
 import StaticItem from './StaticItem.js';
 import getMergedItem from '../../utils/getMergedItem.js';
+import withZoomPanPinchHOC from '../withZoomPanPinchHOC.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
 var StaticPage = function StaticPage(_ref) {
@@ -59,6 +60,8 @@ StaticPage.defaultProps = {
   style: {}
 };
 var StaticPage$1 = /*#__PURE__*/memo(StaticPage);
+var StaticPageWithZoomPanPinch = withZoomPanPinchHOC(StaticPage);
 
 export default StaticPage$1;
+export { StaticPageWithZoomPanPinch };
 //# sourceMappingURL=StaticPage.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"StaticPage.js","sources":["../../../../src/components/Preview/StaticPage.js"],"sourcesContent":["import { memo } from 'react';\nimport PropTypes from 'prop-types';\nimport * as classNames from '../../constants/classNames';\nimport ReportItemRenderer from '../Builder/ReportItemRenderer';\nimport StaticItem from './StaticItem';\nimport getMergedItem from '../../utils/getMergedItem';\n\nconst StaticPage = ({\n  acceptedItems,\n  additionalPageItems,\n  hashCode,\n  itemAccessor,\n  items,\n  style,\n}) => (\n  <div\n    className={classNames.pageContainer}\n    style={style}\n  >\n    <div className=\"jfReport-hider o-hidden f-all p-relative\">\n      {items.filter(item => (\n        item.isVisible !== undefined\n          ? item.isVisible\n          : true\n      )).map(item => {\n        const mergedItem = getMergedItem(item, acceptedItems);\n        return (\n          <StaticItem\n            key={item.id}\n            hashCode={hashCode}\n            item={item}\n          >\n            <ReportItemRenderer\n              item={item}\n            >\n              {ReportItem => (\n                <ReportItem\n                  item={mergedItem}\n                  itemAccessor={itemAccessor}\n                />\n              )}\n            </ReportItemRenderer>\n          </StaticItem>\n        );\n      })}\n      {additionalPageItems}\n    </div>\n  </div>\n);\n\nStaticPage.propTypes = {\n  acceptedItems: PropTypes.shape({}),\n  additionalPageItems: PropTypes.arrayOf(PropTypes.node),\n  hashCode: PropTypes.string,\n  itemAccessor: PropTypes.func,\n  items: PropTypes.arrayOf(PropTypes.shape({})),\n  style: PropTypes.shape({}),\n};\n\nStaticPage.defaultProps = {\n  acceptedItems: {},\n  additionalPageItems: [],\n  hashCode: '',\n  itemAccessor: () => {},\n  items: [],\n  style: {},\n};\n\nexport default memo(StaticPage);\n"],"names":["StaticPage","acceptedItems","additionalPageItems","hashCode","itemAccessor","items","style","_jsx","classNames","_jsxs","filter","item","isVisible","undefined","map","mergedItem","getMergedItem","ReportItem","id","propTypes","PropTypes","shape","arrayOf","node","string","func","defaultProps","memo"],"mappings":";;;;;;;;;;AAOA,IAAMA,UAAU,GAAG,SAAbA,UAAa;AAAA,MACjBC,aADiB,QACjBA,aADiB;AAAA,MAEjBC,mBAFiB,QAEjBA,mBAFiB;AAAA,MAGjBC,QAHiB,QAGjBA,QAHiB;AAAA,MAIjBC,YAJiB,QAIjBA,YAJiB;AAAA,MAKjBC,KALiB,QAKjBA,KALiB;AAAA,MAMjBC,KANiB,QAMjBA,KANiB;AAAA,sBAQjBC;AACE,IAAA,SAAS,EAAEC,aADb;AAEE,IAAA,KAAK,EAAEF,KAFT;AAAA,2BAIEG;AAAK,MAAA,SAAS,EAAC,0CAAf;AAAA,iBACGJ,KAAK,CAACK,MAAN,CAAa,UAAAC,IAAI;AAAA,eAChBA,IAAI,CAACC,SAAL,KAAmBC,SAAnB,GACIF,IAAI,CAACC,SADT,GAEI,IAHY;AAAA,OAAjB,EAIEE,GAJF,CAIM,UAAAH,IAAI,EAAI;AACb,YAAMI,UAAU,GAAGC,aAAa,CAACL,IAAD,EAAOV,aAAP,CAAhC;AACA,4BACEM,IAAC,UAAD;AAEE,UAAA,QAAQ,EAAEJ,QAFZ;AAGE,UAAA,IAAI,EAAEQ,IAHR;AAAA,iCAKEJ,IAAC,kBAAD;AACE,YAAA,IAAI,EAAEI,IADR;AAAA,sBAGG,kBAAAM,UAAU;AAAA,kCACTV,IAAC,UAAD;AACE,gBAAA,IAAI,EAAEQ,UADR;AAEE,gBAAA,YAAY,EAAEX;AAFhB,gBADS;AAAA;AAHb;AALF,WACOO,IAAI,CAACO,EADZ,CADF;AAkBD,OAxBA,CADH,EA0BGhB,mBA1BH;AAAA;AAJF,IARiB;AAAA,CAAnB;;AA2CAF,UAAU,CAACmB,SAAX,GAAuB;AACrBlB,EAAAA,aAAa,EAAEmB,SAAS,CAACC,KAAV,CAAgB,EAAhB,CADM;AAErBnB,EAAAA,mBAAmB,EAAEkB,SAAS,CAACE,OAAV,CAAkBF,SAAS,CAACG,IAA5B,CAFA;AAGrBpB,EAAAA,QAAQ,EAAEiB,SAAS,CAACI,MAHC;AAIrBpB,EAAAA,YAAY,EAAEgB,SAAS,CAACK,IAJH;AAKrBpB,EAAAA,KAAK,EAAEe,SAAS,CAACE,OAAV,CAAkBF,SAAS,CAACC,KAAV,CAAgB,EAAhB,CAAlB,CALc;AAMrBf,EAAAA,KAAK,EAAEc,SAAS,CAACC,KAAV,CAAgB,EAAhB;AANc,CAAvB;AASArB,UAAU,CAAC0B,YAAX,GAA0B;AACxBzB,EAAAA,aAAa,EAAE,EADS;AAExBC,EAAAA,mBAAmB,EAAE,EAFG;AAGxBC,EAAAA,QAAQ,EAAE,EAHc;AAIxBC,EAAAA,YAAY,EAAE,wBAAM,EAJI;AAKxBC,EAAAA,KAAK,EAAE,EALiB;AAMxBC,EAAAA,KAAK,EAAE;AANiB,CAA1B;AASA,gCAAeqB,IAAI,CAAC3B,UAAD,CAAnB;;;;"}
+{"version":3,"file":"StaticPage.js","sources":["../../../../src/components/Preview/StaticPage.js"],"sourcesContent":["import { memo } from 'react';\nimport PropTypes from 'prop-types';\nimport * as classNames from '../../constants/classNames';\nimport ReportItemRenderer from '../Builder/ReportItemRenderer';\nimport StaticItem from './StaticItem';\nimport getMergedItem from '../../utils/getMergedItem';\nimport withZoomPanPinchHOC from '../withZoomPanPinchHOC';\n\nconst StaticPage = ({\n  acceptedItems,\n  additionalPageItems,\n  hashCode,\n  itemAccessor,\n  items,\n  style,\n}) => (\n  <div\n    className={classNames.pageContainer}\n    style={style}\n  >\n    <div className=\"jfReport-hider o-hidden f-all p-relative\">\n      {items.filter(item => (\n        item.isVisible !== undefined\n          ? item.isVisible\n          : true\n      )).map(item => {\n        const mergedItem = getMergedItem(item, acceptedItems);\n        return (\n          <StaticItem\n            key={item.id}\n            hashCode={hashCode}\n            item={item}\n          >\n            <ReportItemRenderer\n              item={item}\n            >\n              {ReportItem => (\n                <ReportItem\n                  item={mergedItem}\n                  itemAccessor={itemAccessor}\n                />\n              )}\n            </ReportItemRenderer>\n          </StaticItem>\n        );\n      })}\n      {additionalPageItems}\n    </div>\n  </div>\n);\n\nStaticPage.propTypes = {\n  acceptedItems: PropTypes.shape({}),\n  additionalPageItems: PropTypes.arrayOf(PropTypes.node),\n  hashCode: PropTypes.string,\n  itemAccessor: PropTypes.func,\n  items: PropTypes.arrayOf(PropTypes.shape({})),\n  style: PropTypes.shape({}),\n};\n\nStaticPage.defaultProps = {\n  acceptedItems: {},\n  additionalPageItems: [],\n  hashCode: '',\n  itemAccessor: () => {},\n  items: [],\n  style: {},\n};\n\nexport default memo(StaticPage);\nexport const StaticPageWithZoomPanPinch = withZoomPanPinchHOC(StaticPage);\n"],"names":["StaticPage","acceptedItems","additionalPageItems","hashCode","itemAccessor","items","style","_jsx","classNames","_jsxs","filter","item","isVisible","undefined","map","mergedItem","getMergedItem","ReportItem","id","propTypes","PropTypes","shape","arrayOf","node","string","func","defaultProps","memo","StaticPageWithZoomPanPinch","withZoomPanPinchHOC"],"mappings":";;;;;;;;;;;AAQA,IAAMA,UAAU,GAAG,SAAbA,UAAa;AAAA,MACjBC,aADiB,QACjBA,aADiB;AAAA,MAEjBC,mBAFiB,QAEjBA,mBAFiB;AAAA,MAGjBC,QAHiB,QAGjBA,QAHiB;AAAA,MAIjBC,YAJiB,QAIjBA,YAJiB;AAAA,MAKjBC,KALiB,QAKjBA,KALiB;AAAA,MAMjBC,KANiB,QAMjBA,KANiB;AAAA,sBAQjBC;AACE,IAAA,SAAS,EAAEC,aADb;AAEE,IAAA,KAAK,EAAEF,KAFT;AAAA,2BAIEG;AAAK,MAAA,SAAS,EAAC,0CAAf;AAAA,iBACGJ,KAAK,CAACK,MAAN,CAAa,UAAAC,IAAI;AAAA,eAChBA,IAAI,CAACC,SAAL,KAAmBC,SAAnB,GACIF,IAAI,CAACC,SADT,GAEI,IAHY;AAAA,OAAjB,EAIEE,GAJF,CAIM,UAAAH,IAAI,EAAI;AACb,YAAMI,UAAU,GAAGC,aAAa,CAACL,IAAD,EAAOV,aAAP,CAAhC;AACA,4BACEM,IAAC,UAAD;AAEE,UAAA,QAAQ,EAAEJ,QAFZ;AAGE,UAAA,IAAI,EAAEQ,IAHR;AAAA,iCAKEJ,IAAC,kBAAD;AACE,YAAA,IAAI,EAAEI,IADR;AAAA,sBAGG,kBAAAM,UAAU;AAAA,kCACTV,IAAC,UAAD;AACE,gBAAA,IAAI,EAAEQ,UADR;AAEE,gBAAA,YAAY,EAAEX;AAFhB,gBADS;AAAA;AAHb;AALF,WACOO,IAAI,CAACO,EADZ,CADF;AAkBD,OAxBA,CADH,EA0BGhB,mBA1BH;AAAA;AAJF,IARiB;AAAA,CAAnB;;AA2CAF,UAAU,CAACmB,SAAX,GAAuB;AACrBlB,EAAAA,aAAa,EAAEmB,SAAS,CAACC,KAAV,CAAgB,EAAhB,CADM;AAErBnB,EAAAA,mBAAmB,EAAEkB,SAAS,CAACE,OAAV,CAAkBF,SAAS,CAACG,IAA5B,CAFA;AAGrBpB,EAAAA,QAAQ,EAAEiB,SAAS,CAACI,MAHC;AAIrBpB,EAAAA,YAAY,EAAEgB,SAAS,CAACK,IAJH;AAKrBpB,EAAAA,KAAK,EAAEe,SAAS,CAACE,OAAV,CAAkBF,SAAS,CAACC,KAAV,CAAgB,EAAhB,CAAlB,CALc;AAMrBf,EAAAA,KAAK,EAAEc,SAAS,CAACC,KAAV,CAAgB,EAAhB;AANc,CAAvB;AASArB,UAAU,CAAC0B,YAAX,GAA0B;AACxBzB,EAAAA,aAAa,EAAE,EADS;AAExBC,EAAAA,mBAAmB,EAAE,EAFG;AAGxBC,EAAAA,QAAQ,EAAE,EAHc;AAIxBC,EAAAA,YAAY,EAAE,wBAAM,EAJI;AAKxBC,EAAAA,KAAK,EAAE,EALiB;AAMxBC,EAAAA,KAAK,EAAE;AANiB,CAA1B;AASA,gCAAeqB,IAAI,CAAC3B,UAAD,CAAnB;IACa4B,0BAA0B,GAAGC,mBAAmB,CAAC7B,UAAD;;;;;"}

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

@@ -7,9 +7,8 @@ import 'core-js/modules/es.regexp.to-string.js';
 import { useRef, useEffect, useMemo, useCallback } from 'react';
 import PropTypes from 'prop-types';
 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 { StaticPageWithZoomPanPinch } from './StaticPage.js';
 import { usePropContext } from '../../utils/propContext.js';
 import { useBuilderContext } from '../../utils/builderContext.js';
 import { slugify } from '../../utils/string.js';
@@ -36,7 +35,6 @@ var StaticScene = function StaticScene(_ref) {
       presentationPage = _ref.presentationPage;
 
   var _usePresentationConte = usePresentationContext(),
-      fittedZoom = _usePresentationConte.fittedZoom,
       isFullscreen = _usePresentationConte.isFullscreen,
       showControlsInFullScreen = _usePresentationConte.showControlsInFullScreen;
 
@@ -61,11 +59,6 @@ var StaticScene = function StaticScene(_ref) {
       reportPageTransition = _settings$reportPageT === void 0 ? 'noAnimation' : _settings$reportPageT;
   var width = parseInt(reportLayoutWidth, 10);
   var height = parseInt(reportLayoutHeight, 10);
-  useEffect(function () {
-    if (mode === 'print') {
-      setZoom(1);
-    }
-  }, [mode]);
   useEffect(function () {
     if (viewPortRef.current) {
       viewPortRef.current.scrollTop = lastScrollPosition;
@@ -74,7 +67,7 @@ var StaticScene = function StaticScene(_ref) {
 
   useEffect(function () {
     transformRefs.current = transformRefs.current.slice(0, pages.length);
-  }, [pages]);
+  }, [pages.length]);
   var pageContainerStyles = useMemo(function () {
     return {
       height: height,
@@ -96,7 +89,7 @@ var StaticScene = function StaticScene(_ref) {
         transformRefs.current[i].centerView(zoom);
       }
     }
-  }, [pages.length, zoom, isFullscreen]);
+  }, [pages.length, zoom, isFullscreen, mode]);
   return /*#__PURE__*/jsxs("main", {
     className: mainWrapper,
     children: [/*#__PURE__*/jsx("div", _objectSpread(_objectSpread({
@@ -117,40 +110,18 @@ var StaticScene = function StaticScene(_ref) {
 
           return /*#__PURE__*/jsx("div", {
             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) {
+            children: /*#__PURE__*/jsx(StaticPageWithZoomPanPinch, {
+              acceptedItems: acceptedItems,
+              additionalPageItems: additionalPageItems,
+              handleZoom: handleZoom,
+              hashCode: hashCode,
+              itemAccessor: itemAccessor,
+              items: page$1.items,
+              mode: mode,
+              refSetter: function refSetter(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
-                })
-              })
+              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 {\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":"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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 * as classNames from '../../constants/classNames';\nimport { StaticPageWithZoomPanPinch } 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  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 (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.length]);\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, mode]);\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                <StaticPageWithZoomPanPinch\n                  acceptedItems={acceptedItems}\n                  additionalPageItems={additionalPageItems}\n                  handleZoom={handleZoom}\n                  hashCode={hashCode}\n                  itemAccessor={itemAccessor}\n                  items={page.items}\n                  mode={mode}\n                  refSetter={element => { transformRefs.current[index] = element; }}\n                  style={style}\n                />\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","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","items","element","toString","propTypes","PropTypes","arrayOf","node","func","string","bool","number","shape","defaultProps"],"mappings":"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"}

package/lib/esm/components/withZoomPanPinchHOC.js

@@ -0,0 +1,71 @@
+import { func, string, oneOfType, shape, any } from 'prop-types';
+import { TransformWrapper, TransformComponent } from 'react-zoom-pan-pinch';
+import { useBuilderContext } from '../utils/builderContext.js';
+import { usePresentationContext } from '../utils/presentationContext.js';
+import { jsx } from 'react/jsx-runtime';
+
+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; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+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 withZoomPanPinchHOC = function withZoomPanPinchHOC(WrappedComponent) {
+  var ZoomPanPinchHOC = function ZoomPanPinchHOC(props) {
+    var handleZoom = props.handleZoom,
+        mode = props.mode,
+        refSetter = props.refSetter;
+
+    var _useBuilderContext = useBuilderContext(),
+        zoom = _useBuilderContext.zoom;
+
+    var _usePresentationConte = usePresentationContext(),
+        fittedZoom = _usePresentationConte.fittedZoom;
+
+    if (mode === 'print') {
+      return /*#__PURE__*/jsx(WrappedComponent, _objectSpread({}, props));
+    }
+
+    return /*#__PURE__*/jsx(TransformWrapper, {
+      ref: refSetter,
+      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(WrappedComponent, _objectSpread({}, props))
+      })
+    });
+  };
+
+  ZoomPanPinchHOC.propTypes = {
+    handleZoom: func.isRequired,
+    mode: string,
+    refSetter: oneOfType([func, shape({
+      current: any
+    })]).isRequired
+  };
+  ZoomPanPinchHOC.defaultProps = {
+    mode: ''
+  };
+  return ZoomPanPinchHOC;
+};
+
+export default withZoomPanPinchHOC;
+//# sourceMappingURL=withZoomPanPinchHOC.js.map

package/lib/esm/components/withZoomPanPinchHOC.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"withZoomPanPinchHOC.js","sources":["../../../src/components/withZoomPanPinchHOC.js"],"sourcesContent":["import {\n  string, func, any, oneOfType, shape,\n} from 'prop-types';\nimport { TransformWrapper, TransformComponent } from 'react-zoom-pan-pinch';\nimport { useBuilderContext } from '../utils/builderContext';\nimport { usePresentationContext } from '../utils/presentationContext';\n\nconst withZoomPanPinchHOC = WrappedComponent => {\n  const ZoomPanPinchHOC = props => {\n    const { handleZoom, mode, refSetter } = props;\n\n    const { zoom } = useBuilderContext();\n    const { fittedZoom } = usePresentationContext();\n\n    if (mode === 'print') {\n      return <WrappedComponent {...props} />;\n    }\n\n    return (\n      <TransformWrapper\n        ref={refSetter}\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          <WrappedComponent {...props} />\n        </TransformComponent>\n      </TransformWrapper>\n    );\n  };\n\n  ZoomPanPinchHOC.propTypes = {\n    handleZoom: func.isRequired,\n    mode: string,\n    refSetter: oneOfType([\n      func,\n      shape({ current: any }),\n    ]).isRequired,\n  };\n\n  ZoomPanPinchHOC.defaultProps = {\n    mode: '',\n  };\n\n  return ZoomPanPinchHOC;\n};\n\nexport default withZoomPanPinchHOC;\n"],"names":["withZoomPanPinchHOC","WrappedComponent","ZoomPanPinchHOC","props","handleZoom","mode","refSetter","useBuilderContext","zoom","usePresentationContext","fittedZoom","_jsx","step","disabled","height","width","propTypes","func","isRequired","string","oneOfType","shape","current","any","defaultProps"],"mappings":";;;;;;;;;;;;IAOMA,mBAAmB,GAAG,SAAtBA,mBAAsB,CAAAC,gBAAgB,EAAI;AAC9C,MAAMC,eAAe,GAAG,SAAlBA,eAAkB,CAAAC,KAAK,EAAI;AAC/B,QAAQC,UAAR,GAAwCD,KAAxC,CAAQC,UAAR;AAAA,QAAoBC,IAApB,GAAwCF,KAAxC,CAAoBE,IAApB;AAAA,QAA0BC,SAA1B,GAAwCH,KAAxC,CAA0BG,SAA1B;;AAEA,6BAAiBC,iBAAiB,EAAlC;AAAA,QAAQC,IAAR,sBAAQA,IAAR;;AACA,gCAAuBC,sBAAsB,EAA7C;AAAA,QAAQC,UAAR,yBAAQA,UAAR;;AAEA,QAAIL,IAAI,KAAK,OAAb,EAAsB;AACpB,0BAAOM,IAAC,gBAAD,oBAAsBR,KAAtB,EAAP;AACD;;AAED,wBACEQ,IAAC,gBAAD;AACE,MAAA,GAAG,EAAEL,SADP;AAEE,MAAA,YAAY,EAAE,IAFhB;AAGE,MAAA,eAAe,EAAE,IAHnB;AAIE,MAAA,cAAc,EAAE,IAJlB;AAKE,MAAA,WAAW,EAAE;AACXM,QAAAA,IAAI,EAAE;AADK,OALf;AAQE,MAAA,YAAY,EAAEJ,IARhB;AASE,MAAA,QAAQ,EAAE,CATZ;AAUE,MAAA,QAAQ,EAAE,GAVZ;AAWE,MAAA,MAAM,EAAEJ,UAXV;AAYE,MAAA,OAAO,EAAE;AACPS,QAAAA,QAAQ,EAAEL,IAAI,IAAIE;AADX,OAZX;AAeE,MAAA,KAAK,EAAE;AACLE,QAAAA,IAAI,EAAE;AADD,OAfT;AAAA,6BAmBED,IAAC,kBAAD;AACE,QAAA,YAAY,EAAE;AAAEG,UAAAA,MAAM,EAAE,MAAV;AAAkBC,UAAAA,KAAK,EAAE;AAAzB,SADhB;AAAA,+BAGEJ,IAAC,gBAAD,oBAAsBR,KAAtB;AAHF;AAnBF,MADF;AA2BD,GArCD;;AAuCAD,EAAAA,eAAe,CAACc,SAAhB,GAA4B;AAC1BZ,IAAAA,UAAU,EAAEa,IAAI,CAACC,UADS;AAE1Bb,IAAAA,IAAI,EAAEc,MAFoB;AAG1Bb,IAAAA,SAAS,EAAEc,SAAS,CAAC,CACnBH,IADmB,EAEnBI,KAAK,CAAC;AAAEC,MAAAA,OAAO,EAAEC;AAAX,KAAD,CAFc,CAAD,CAAT,CAGRL;AANuB,GAA5B;AASAhB,EAAAA,eAAe,CAACsB,YAAhB,GAA+B;AAC7BnB,IAAAA,IAAI,EAAE;AADuB,GAA/B;AAIA,SAAOH,eAAP;AACD;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jotforminc/dnd-builder",
-  "version": "2.5.0",
+  "version": "2.5.2",
   "files": [
     "lib"
   ],