@jotforminc/dnd-builder 3.4.2 → 3.4.5

package/lib/cjs/components/TextEditor/TextEditor.js

@@ -47,19 +47,11 @@ var TextEditor = function TextEditor(_ref) {
   var setIsTextEditorOpen = BuilderContext.useBuilderStore(function (state) {
     return state.setIsTextEditorOpen;
   });
-  React.useEffect(function () {
-    if (isTextEditorOpen && !isSelected) {
-      setIsTextEditorOpen(false);
-    }
-  }, [isSelected, isTextEditorOpen, setIsTextEditorOpen]);
   var onClick = React.useCallback(function () {
     if (isSelected && !isLocked) {
       setIsTextEditorOpen(true);
     }
   }, [isSelected, isLocked, setIsTextEditorOpen]);
-  var onClose = React.useCallback(function () {
-    setIsTextEditorOpen(false);
-  }, [setIsTextEditorOpen]);
   var isNotEmpty = React.useMemo(function () {
     var el = document.createElement('div');
     el.innerHTML = _content;
@@ -68,9 +60,9 @@ var TextEditor = function TextEditor(_ref) {
   return isSelected && isTextEditorOpen ? /*#__PURE__*/jsxRuntime.jsx(QuillEditor, {
     content: _content,
     handleSave: handleSave,
-    onClose: onClose,
     placeholder: placeholder,
-    setContent: setContent
+    setContent: setContent,
+    setIsTextEditorOpen: setIsTextEditorOpen
   }) : /*#__PURE__*/jsxRuntime.jsx("div", {
     className: "f-all ql-editor".concat(isNotEmpty ? '' : ' isEmptyTextElement'),
     dangerouslySetInnerHTML: {

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

@@ -1 +1 @@
-{"version":3,"file":"TextEditor.js","sources":["../../../../src/components/TextEditor/TextEditor.js"],"sourcesContent":["import {\n  useCallback,\n  useMemo,\n  useEffect,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport domPurify from 'dompurify';\nimport QuillEditor from './QuillEditor';\nimport { useBuilderStore } from '../../contexts/BuilderContext';\nimport { usePropState } from '../../utils/hooks';\n\nconst TextEditor = ({\n  content = '',\n  handleSave = () => {},\n  isLocked = false,\n  isSelected = false,\n  placeholder,\n}) => {\n  const [_content, setContent] = usePropState(content, domPurify.sanitize);\n\n  const isTextEditorOpen = useBuilderStore(state => state.isTextEditorOpen);\n  const setIsTextEditorOpen = useBuilderStore(state => state.setIsTextEditorOpen);\n\n  useEffect(() => {\n    if (isTextEditorOpen && !isSelected) {\n      setIsTextEditorOpen(false);\n    }\n  }, [isSelected, isTextEditorOpen, setIsTextEditorOpen]);\n\n  const onClick = useCallback(() => {\n    if (isSelected && !isLocked) {\n      setIsTextEditorOpen(true);\n    }\n  }, [isSelected, isLocked, setIsTextEditorOpen]);\n\n  const onClose = useCallback(() => {\n    setIsTextEditorOpen(false);\n  }, [setIsTextEditorOpen]);\n\n  const isNotEmpty = useMemo(() => {\n    const el = document.createElement('div');\n    el.innerHTML = _content;\n    return !!el.innerText;\n  }, [_content]);\n\n  return isSelected && isTextEditorOpen ? (\n    <QuillEditor\n      content={_content}\n      handleSave={handleSave}\n      onClose={onClose}\n      placeholder={placeholder}\n      setContent={setContent}\n    />\n  ) : (\n    <div\n      className={`f-all ql-editor${isNotEmpty ? '' : ' isEmptyTextElement'}`}\n      dangerouslySetInnerHTML={{\n        __html: isNotEmpty ? _content : placeholder,\n      }}\n      onClick={onClick}\n      onKeyDown={() => {}}\n    />\n  );\n};\n\nTextEditor.propTypes = {\n  content: PropTypes.string,\n  handleSave: PropTypes.func,\n  isLocked: PropTypes.bool,\n  isSelected: PropTypes.bool,\n  placeholder: PropTypes.string.isRequired,\n};\n\nexport default TextEditor;\n"],"names":["TextEditor","content","handleSave","isLocked","isSelected","placeholder","usePropState","domPurify","sanitize","_content","setContent","isTextEditorOpen","useBuilderStore","state","setIsTextEditorOpen","useEffect","onClick","useCallback","onClose","isNotEmpty","useMemo","el","document","createElement","innerHTML","innerText","_jsx","__html","propTypes","PropTypes","string","func","bool","isRequired"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;IAWMA,UAAU,GAAG,SAAbA,UAAa,OAMb;AAAA,0BALJC,OAKI;AAAA,MALJA,OAKI,6BALM,EAKN;AAAA,6BAJJC,UAII;AAAA,MAJJA,UAII,gCAJS,YAAM,EAIf;AAAA,2BAHJC,QAGI;AAAA,MAHJA,QAGI,8BAHO,KAGP;AAAA,6BAFJC,UAEI;AAAA,MAFJA,UAEI,gCAFS,KAET;AAAA,MADJC,WACI,QADJA,WACI;;AACJ,sBAA+BC,kBAAY,CAACL,OAAD,EAAUM,6BAAS,CAACC,QAApB,CAA3C;AAAA;AAAA,MAAOC,QAAP;AAAA,MAAiBC,UAAjB;;AAEA,MAAMC,gBAAgB,GAAGC,8BAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACF,gBAAV;AAAA,GAAN,CAAxC;AACA,MAAMG,mBAAmB,GAAGF,8BAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACC,mBAAV;AAAA,GAAN,CAA3C;AAEAC,EAAAA,eAAS,CAAC,YAAM;AACd,QAAIJ,gBAAgB,IAAI,CAACP,UAAzB,EAAqC;AACnCU,MAAAA,mBAAmB,CAAC,KAAD,CAAnB;AACD;AACF,GAJQ,EAIN,CAACV,UAAD,EAAaO,gBAAb,EAA+BG,mBAA/B,CAJM,CAAT;AAMA,MAAME,OAAO,GAAGC,iBAAW,CAAC,YAAM;AAChC,QAAIb,UAAU,IAAI,CAACD,QAAnB,EAA6B;AAC3BW,MAAAA,mBAAmB,CAAC,IAAD,CAAnB;AACD;AACF,GAJ0B,EAIxB,CAACV,UAAD,EAAaD,QAAb,EAAuBW,mBAAvB,CAJwB,CAA3B;AAMA,MAAMI,OAAO,GAAGD,iBAAW,CAAC,YAAM;AAChCH,IAAAA,mBAAmB,CAAC,KAAD,CAAnB;AACD,GAF0B,EAExB,CAACA,mBAAD,CAFwB,CAA3B;AAIA,MAAMK,UAAU,GAAGC,aAAO,CAAC,YAAM;AAC/B,QAAMC,EAAE,GAAGC,QAAQ,CAACC,aAAT,CAAuB,KAAvB,CAAX;AACAF,IAAAA,EAAE,CAACG,SAAH,GAAef,QAAf;AACA,WAAO,CAAC,CAACY,EAAE,CAACI,SAAZ;AACD,GAJyB,EAIvB,CAAChB,QAAD,CAJuB,CAA1B;AAMA,SAAOL,UAAU,IAAIO,gBAAd,gBACLe,eAAC,WAAD;AACE,IAAA,OAAO,EAAEjB,QADX;AAEE,IAAA,UAAU,EAAEP,UAFd;AAGE,IAAA,OAAO,EAAEgB,OAHX;AAIE,IAAA,WAAW,EAAEb,WAJf;AAKE,IAAA,UAAU,EAAEK;AALd,IADK,gBASLgB;AACE,IAAA,SAAS,2BAAoBP,UAAU,GAAG,EAAH,GAAQ,qBAAtC,CADX;AAEE,IAAA,uBAAuB,EAAE;AACvBQ,MAAAA,MAAM,EAAER,UAAU,GAAGV,QAAH,GAAcJ;AADT,KAF3B;AAKE,IAAA,OAAO,EAAEW,OALX;AAME,IAAA,SAAS,EAAE,qBAAM;AANnB,IATF;AAkBD;;AAEDhB,UAAU,CAAC4B,SAAX,GAAuB;AACrB3B,EAAAA,OAAO,EAAE4B,6BAAS,CAACC,MADE;AAErB5B,EAAAA,UAAU,EAAE2B,6BAAS,CAACE,IAFD;AAGrB5B,EAAAA,QAAQ,EAAE0B,6BAAS,CAACG,IAHC;AAIrB5B,EAAAA,UAAU,EAAEyB,6BAAS,CAACG,IAJD;AAKrB3B,EAAAA,WAAW,EAAEwB,6BAAS,CAACC,MAAV,CAAiBG;AALT,CAAvB;;;;"}
+{"version":3,"file":"TextEditor.js","sources":["../../../../src/components/TextEditor/TextEditor.js"],"sourcesContent":["import { useCallback, useMemo } from 'react';\nimport PropTypes from 'prop-types';\nimport domPurify from 'dompurify';\nimport QuillEditor from './QuillEditor';\nimport { useBuilderStore } from '../../contexts/BuilderContext';\nimport { usePropState } from '../../utils/hooks';\n\nconst TextEditor = ({\n  content = '',\n  handleSave = () => {},\n  isLocked = false,\n  isSelected = false,\n  placeholder,\n}) => {\n  const [_content, setContent] = usePropState(content, domPurify.sanitize);\n\n  const isTextEditorOpen = useBuilderStore(state => state.isTextEditorOpen);\n  const setIsTextEditorOpen = useBuilderStore(state => state.setIsTextEditorOpen);\n\n  const onClick = useCallback(() => {\n    if (isSelected && !isLocked) {\n      setIsTextEditorOpen(true);\n    }\n  }, [isSelected, isLocked, setIsTextEditorOpen]);\n\n  const isNotEmpty = useMemo(() => {\n    const el = document.createElement('div');\n    el.innerHTML = _content;\n    return !!el.innerText;\n  }, [_content]);\n\n  return isSelected && isTextEditorOpen ? (\n    <QuillEditor\n      content={_content}\n      handleSave={handleSave}\n      placeholder={placeholder}\n      setContent={setContent}\n      setIsTextEditorOpen={setIsTextEditorOpen}\n    />\n  ) : (\n    <div\n      className={`f-all ql-editor${isNotEmpty ? '' : ' isEmptyTextElement'}`}\n      dangerouslySetInnerHTML={{\n        __html: isNotEmpty ? _content : placeholder,\n      }}\n      onClick={onClick}\n      onKeyDown={() => {}}\n    />\n  );\n};\n\nTextEditor.propTypes = {\n  content: PropTypes.string,\n  handleSave: PropTypes.func,\n  isLocked: PropTypes.bool,\n  isSelected: PropTypes.bool,\n  placeholder: PropTypes.string.isRequired,\n};\n\nexport default TextEditor;\n"],"names":["TextEditor","content","handleSave","isLocked","isSelected","placeholder","usePropState","domPurify","sanitize","_content","setContent","isTextEditorOpen","useBuilderStore","state","setIsTextEditorOpen","onClick","useCallback","isNotEmpty","useMemo","el","document","createElement","innerHTML","innerText","_jsx","__html","propTypes","PropTypes","string","func","bool","isRequired"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;IAOMA,UAAU,GAAG,SAAbA,UAAa,OAMb;AAAA,0BALJC,OAKI;AAAA,MALJA,OAKI,6BALM,EAKN;AAAA,6BAJJC,UAII;AAAA,MAJJA,UAII,gCAJS,YAAM,EAIf;AAAA,2BAHJC,QAGI;AAAA,MAHJA,QAGI,8BAHO,KAGP;AAAA,6BAFJC,UAEI;AAAA,MAFJA,UAEI,gCAFS,KAET;AAAA,MADJC,WACI,QADJA,WACI;;AACJ,sBAA+BC,kBAAY,CAACL,OAAD,EAAUM,6BAAS,CAACC,QAApB,CAA3C;AAAA;AAAA,MAAOC,QAAP;AAAA,MAAiBC,UAAjB;;AAEA,MAAMC,gBAAgB,GAAGC,8BAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACF,gBAAV;AAAA,GAAN,CAAxC;AACA,MAAMG,mBAAmB,GAAGF,8BAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACC,mBAAV;AAAA,GAAN,CAA3C;AAEA,MAAMC,OAAO,GAAGC,iBAAW,CAAC,YAAM;AAChC,QAAIZ,UAAU,IAAI,CAACD,QAAnB,EAA6B;AAC3BW,MAAAA,mBAAmB,CAAC,IAAD,CAAnB;AACD;AACF,GAJ0B,EAIxB,CAACV,UAAD,EAAaD,QAAb,EAAuBW,mBAAvB,CAJwB,CAA3B;AAMA,MAAMG,UAAU,GAAGC,aAAO,CAAC,YAAM;AAC/B,QAAMC,EAAE,GAAGC,QAAQ,CAACC,aAAT,CAAuB,KAAvB,CAAX;AACAF,IAAAA,EAAE,CAACG,SAAH,GAAeb,QAAf;AACA,WAAO,CAAC,CAACU,EAAE,CAACI,SAAZ;AACD,GAJyB,EAIvB,CAACd,QAAD,CAJuB,CAA1B;AAMA,SAAOL,UAAU,IAAIO,gBAAd,gBACLa,eAAC,WAAD;AACE,IAAA,OAAO,EAAEf,QADX;AAEE,IAAA,UAAU,EAAEP,UAFd;AAGE,IAAA,WAAW,EAAEG,WAHf;AAIE,IAAA,UAAU,EAAEK,UAJd;AAKE,IAAA,mBAAmB,EAAEI;AALvB,IADK,gBASLU;AACE,IAAA,SAAS,2BAAoBP,UAAU,GAAG,EAAH,GAAQ,qBAAtC,CADX;AAEE,IAAA,uBAAuB,EAAE;AACvBQ,MAAAA,MAAM,EAAER,UAAU,GAAGR,QAAH,GAAcJ;AADT,KAF3B;AAKE,IAAA,OAAO,EAAEU,OALX;AAME,IAAA,SAAS,EAAE,qBAAM;AANnB,IATF;AAkBD;;AAEDf,UAAU,CAAC0B,SAAX,GAAuB;AACrBzB,EAAAA,OAAO,EAAE0B,6BAAS,CAACC,MADE;AAErB1B,EAAAA,UAAU,EAAEyB,6BAAS,CAACE,IAFD;AAGrB1B,EAAAA,QAAQ,EAAEwB,6BAAS,CAACG,IAHC;AAIrB1B,EAAAA,UAAU,EAAEuB,6BAAS,CAACG,IAJD;AAKrBzB,EAAAA,WAAW,EAAEsB,6BAAS,CAACC,MAAV,CAAiBG;AALT,CAAvB;;;;"}

package/lib/cjs/components/withClickOutside.js

@@ -9,6 +9,7 @@ require('core-js/modules/es.string.iterator.js');
 var React = require('react');
 var PropTypes = require('prop-types');
 var eventIgnoredRoles = require('../constants/eventIgnoredRoles.js');
+var BuilderContext = require('../contexts/BuilderContext.js');
 var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -32,6 +33,9 @@ function withClickOutside(WrappedComponent) {
         onClickOutside = props.onClickOutside,
         _props$withClickOutsi = props.withClickOutsideWrapperClass,
         withClickOutsideWrapperClass = _props$withClickOutsi === void 0 ? null : _props$withClickOutsi;
+    var clickOutsideIgnoreSelectors = BuilderContext.useBuilderStore(function (state) {
+      return state.clickOutsideIgnoreSelectors;
+    });
     var wrapper = React.useRef(null);
     var handleClickOutside = React.useCallback(function (event) {
       var classList = event.target.classList;
@@ -42,6 +46,8 @@ function withClickOutside(WrappedComponent) {
         return event.target.closest(".".concat(item));
       }) || eventIgnoredRoles.EVENT_IGNORED_ROLES.some(function (role) {
         return event.target.closest("[role=".concat(role, "]"));
+      }) || clickOutsideIgnoreSelectors.some(function (selector) {
+        return selector && event.target.closest(selector);
       }))) {
         return;
       }
@@ -49,7 +55,7 @@ function withClickOutside(WrappedComponent) {
       if (wrapper.current && !wrapper.current.contains(event.target)) {
         onClickOutside(event);
       }
-    }, [exceptionalClasses, onClickOutside]);
+    }, [exceptionalClasses, onClickOutside, clickOutsideIgnoreSelectors]);
     React.useEffect(function () {
       window.addEventListener('mousedown', handleClickOutside, true);
       return function () {

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

@@ -1 +1 @@
-{"version":3,"file":"withClickOutside.js","sources":["../../../src/components/withClickOutside.js"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport { EVENT_IGNORED_ROLES } from '../constants/eventIgnoredRoles';\n\nfunction getDisplayName(WrappedComponent) {\n  return WrappedComponent.displayName || WrappedComponent.name || 'Component';\n}\n\nfunction withClickOutside(WrappedComponent) {\n  function WithClickOutside(props) {\n    const {\n      exceptionalClasses = null,\n      onClickOutside,\n      withClickOutsideWrapperClass = null,\n    } = props;\n\n    const wrapper = useRef(null);\n\n    const handleClickOutside = useCallback(event => {\n      const { classList } = event.target;\n      if (\n        exceptionalClasses\n        && (\n          classList.contains(exceptionalClasses)\n          || Array.from(classList).some(xClass => exceptionalClasses.includes(xClass))\n          || exceptionalClasses.some(item => event.target.closest(`.${item}`))\n          || EVENT_IGNORED_ROLES.some(role => event.target.closest(`[role=${role}]`))\n        )\n      ) {\n        return;\n      }\n\n      if (wrapper.current && !wrapper.current.contains(event.target)) {\n        onClickOutside(event);\n      }\n    }, [exceptionalClasses, onClickOutside]);\n\n    useEffect(() => {\n      window.addEventListener('mousedown', handleClickOutside, true);\n      return () => {\n        window.removeEventListener('mousedown', handleClickOutside, true);\n      };\n    }, [handleClickOutside]);\n\n    // should we memoize this?\n    const propsToFilter = ['withClickOutsideWrapperClass', 'exceptionalClasses'];\n    const componentName = getDisplayName(WrappedComponent);\n    if (componentName === 'Resizable') {\n      // beceause resizable wrapper directly passes props to an html el\n      propsToFilter.push('onClickOutside');\n    }\n    const filteredProps = Object.keys(props).reduce((allProps, propKey) => {\n      const _allProps = allProps;\n      if (propsToFilter.indexOf(propKey) === -1) {\n        _allProps[propKey] = props[propKey];\n      }\n      return _allProps;\n    }, {});\n\n    return (\n      <div\n        ref={wrapper}\n        className={withClickOutsideWrapperClass}\n      >\n        <WrappedComponent\n          {...filteredProps}\n        />\n      </div>\n    );\n  }\n\n  WithClickOutside.propTypes = {\n    exceptionalClasses: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.arrayOf(PropTypes.string),\n    ]),\n    onClickOutside: PropTypes.func.isRequired,\n    withClickOutsideWrapperClass: PropTypes.string,\n  };\n\n  WithClickOutside.displayName = `inlineEdit(${getDisplayName(WrappedComponent)})`;\n\n  return WithClickOutside;\n}\n\nexport default withClickOutside;\n"],"names":["getDisplayName","WrappedComponent","displayName","name","withClickOutside","WithClickOutside","props","exceptionalClasses","onClickOutside","withClickOutsideWrapperClass","wrapper","useRef","handleClickOutside","useCallback","event","classList","target","contains","Array","from","some","xClass","includes","item","closest","EVENT_IGNORED_ROLES","role","current","useEffect","window","addEventListener","removeEventListener","propsToFilter","componentName","push","filteredProps","Object","keys","reduce","allProps","propKey","_allProps","indexOf","_jsx","propTypes","PropTypes","oneOfType","string","arrayOf","func","isRequired"],"mappings":"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"}
+{"version":3,"file":"withClickOutside.js","sources":["../../../src/components/withClickOutside.js"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport { EVENT_IGNORED_ROLES } from '../constants/eventIgnoredRoles';\nimport { useBuilderStore } from '../contexts/BuilderContext';\n\nfunction getDisplayName(WrappedComponent) {\n  return WrappedComponent.displayName || WrappedComponent.name || 'Component';\n}\n\nfunction withClickOutside(WrappedComponent) {\n  function WithClickOutside(props) {\n    const {\n      exceptionalClasses = null,\n      onClickOutside,\n      withClickOutsideWrapperClass = null,\n    } = props;\n\n    const clickOutsideIgnoreSelectors = useBuilderStore(state => state.clickOutsideIgnoreSelectors);\n    const wrapper = useRef(null);\n\n    const handleClickOutside = useCallback(event => {\n      const { classList } = event.target;\n      if (\n        exceptionalClasses\n        && (\n          classList.contains(exceptionalClasses)\n          || Array.from(classList).some(xClass => exceptionalClasses.includes(xClass))\n          || exceptionalClasses.some(item => event.target.closest(`.${item}`))\n          || EVENT_IGNORED_ROLES.some(role => event.target.closest(`[role=${role}]`))\n          || clickOutsideIgnoreSelectors.some(selector => selector && event.target.closest(selector))\n        )\n      ) {\n        return;\n      }\n\n      if (wrapper.current && !wrapper.current.contains(event.target)) {\n        onClickOutside(event);\n      }\n    }, [exceptionalClasses, onClickOutside, clickOutsideIgnoreSelectors]);\n\n    useEffect(() => {\n      window.addEventListener('mousedown', handleClickOutside, true);\n      return () => {\n        window.removeEventListener('mousedown', handleClickOutside, true);\n      };\n    }, [handleClickOutside]);\n\n    // should we memoize this?\n    const propsToFilter = ['withClickOutsideWrapperClass', 'exceptionalClasses'];\n    const componentName = getDisplayName(WrappedComponent);\n    if (componentName === 'Resizable') {\n      // beceause resizable wrapper directly passes props to an html el\n      propsToFilter.push('onClickOutside');\n    }\n    const filteredProps = Object.keys(props).reduce((allProps, propKey) => {\n      const _allProps = allProps;\n      if (propsToFilter.indexOf(propKey) === -1) {\n        _allProps[propKey] = props[propKey];\n      }\n      return _allProps;\n    }, {});\n\n    return (\n      <div\n        ref={wrapper}\n        className={withClickOutsideWrapperClass}\n      >\n        <WrappedComponent\n          {...filteredProps}\n        />\n      </div>\n    );\n  }\n\n  WithClickOutside.propTypes = {\n    exceptionalClasses: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.arrayOf(PropTypes.string),\n    ]),\n    onClickOutside: PropTypes.func.isRequired,\n    withClickOutsideWrapperClass: PropTypes.string,\n  };\n\n  WithClickOutside.displayName = `inlineEdit(${getDisplayName(WrappedComponent)})`;\n\n  return WithClickOutside;\n}\n\nexport default withClickOutside;\n"],"names":["getDisplayName","WrappedComponent","displayName","name","withClickOutside","WithClickOutside","props","exceptionalClasses","onClickOutside","withClickOutsideWrapperClass","clickOutsideIgnoreSelectors","useBuilderStore","state","wrapper","useRef","handleClickOutside","useCallback","event","classList","target","contains","Array","from","some","xClass","includes","item","closest","EVENT_IGNORED_ROLES","role","selector","current","useEffect","window","addEventListener","removeEventListener","propsToFilter","componentName","push","filteredProps","Object","keys","reduce","allProps","propKey","_allProps","indexOf","_jsx","propTypes","PropTypes","oneOfType","string","arrayOf","func","isRequired"],"mappings":"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"}

package/lib/cjs/constants/eventIgnoredRoles.js

@@ -8,6 +8,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
  * should be ignored by event handlers.
  */
 var EVENT_IGNORED_ROLES = ['dialog'];
+var EVENT_IGNORED_FIELDS = ['combobox', 'listbox', 'input', 'textarea', 'select', '[contenteditable="true"]', '[role="combobox"]', '[role="listbox"]', '[aria-haspopup="listbox"]', 'input[type="color"]', 'input[type="number"]'];
 
+exports.EVENT_IGNORED_FIELDS = EVENT_IGNORED_FIELDS;
 exports.EVENT_IGNORED_ROLES = EVENT_IGNORED_ROLES;
 //# sourceMappingURL=eventIgnoredRoles.js.map

package/lib/cjs/constants/eventIgnoredRoles.js.map

@@ -1 +1 @@
-{"version":3,"file":"eventIgnoredRoles.js","sources":["../../../src/constants/eventIgnoredRoles.js"],"sourcesContent":["/**\n * If an HTML Tag has its role attribute set as one of the\n * members of this array, events that originate from it\n * should be ignored by event handlers.\n */\nexport const EVENT_IGNORED_ROLES = [\n  'dialog',\n];\n"],"names":["EVENT_IGNORED_ROLES"],"mappings":";;;;AAAA;AACA;AACA;AACA;AACA;IACaA,mBAAmB,GAAG,CACjC,QADiC;;;;"}
+{"version":3,"file":"eventIgnoredRoles.js","sources":["../../../src/constants/eventIgnoredRoles.js"],"sourcesContent":["/**\n * If an HTML Tag has its role attribute set as one of the\n * members of this array, events that originate from it\n * should be ignored by event handlers.\n */\nexport const EVENT_IGNORED_ROLES = [\n  'dialog',\n];\n\nexport const EVENT_IGNORED_FIELDS = [\n  'combobox',\n  'listbox',\n  'input',\n  'textarea',\n  'select',\n  '[contenteditable=\"true\"]',\n  '[role=\"combobox\"]',\n  '[role=\"listbox\"]',\n  '[aria-haspopup=\"listbox\"]',\n  'input[type=\"color\"]',\n  'input[type=\"number\"]',\n];\n"],"names":["EVENT_IGNORED_ROLES","EVENT_IGNORED_FIELDS"],"mappings":";;;;AAAA;AACA;AACA;AACA;AACA;IACaA,mBAAmB,GAAG,CACjC,QADiC;IAItBC,oBAAoB,GAAG,CAClC,UADkC,EAElC,SAFkC,EAGlC,OAHkC,EAIlC,UAJkC,EAKlC,QALkC,EAMlC,0BANkC,EAOlC,mBAPkC,EAQlC,kBARkC,EASlC,2BATkC,EAUlC,qBAVkC,EAWlC,sBAXkC;;;;;"}

package/lib/cjs/contexts/BuilderContext.js

@@ -46,6 +46,7 @@ var builderStore = function builderStore(props) {
         left: 0,
         right: 0
       },
+      clickOutsideIgnoreSelectors: props.clickOutsideIgnoreSelectors || [],
       contextMenuProps: props.contextMenuProps || false,
       editedElement: props.editedElement || 'l_layout',
       guides: {},

package/lib/cjs/contexts/BuilderContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"BuilderContext.js","sources":["../../../src/contexts/BuilderContext.js"],"sourcesContent":["import { createContext, useContext, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport { createStore, useStore } from 'zustand';\n\nconst builderStore = props => {\n  return createStore((set, get) => ({\n    activeElements: props.activeElement || [],\n    activeTab: props.activeTab || { left: 0, right: 0 },\n    contextMenuProps: props.contextMenuProps || false,\n    editedElement: props.editedElement || 'l_layout',\n    guides: {},\n    isAllSlidesPanelOpen: props.isAllSlidesPanelOpen || false,\n    isLeftPanelOpen: props.isLeftPanelOpen || false,\n    isResize: false,\n    isRightPanelOpen: props.isRightPanelOpen || false,\n    isSlidesPanelOpen: props.isSlidesPanelOpen || false,\n    isTextEditorOpen: props.isTextEditorOpen || false,\n    lastScrollPosition: props.lastScrollPosition || 0,\n    matches: {},\n    onRightPanelsToggled: props.onRightPanelsToggled || (() => {}),\n    resetActiveElements: props.resetActiveElements || (() => {\n      set({ activeElements: [], editedElement: 'l_layout' });\n    }),\n    setActiveElements: props.setActiveElements || ((itemID, edit = true, replace = true) => {\n      const { activeElements } = get();\n      set({\n        activeElements: replace ? [itemID] : [...activeElements, itemID],\n        ...edit ? { editedElement: !itemID ? 'l_layout' : `i_${itemID}` } : {},\n      });\n    }),\n    setActiveElementsSelection: props.setActiveElementsSelection || (itemIDs => {\n      if (!itemIDs || itemIDs.length === 0) {\n        set({ activeElements: [], editedElement: 'l_layout' });\n      } else if (itemIDs.length === 1) {\n        set({\n          activeElements: itemIDs,\n          editedElement: `i_${itemIDs[0]}`,\n        });\n      } else {\n        set({ activeElements: itemIDs });\n      }\n    }),\n    setActiveTab: props.setActiveTab || ((panel, tabIndex) => {\n      const { activeTab } = get();\n      set({ activeTab: { ...activeTab, [panel]: tabIndex } });\n    }),\n    setContextMenuProps: status => {\n      set({ contextMenuProps: status });\n    },\n    setEditedElement: id => {\n      set({ editedElement: id });\n    },\n    setGuides: guides => {\n      set({ guides });\n    },\n    setIsAllSlidesPanelOpen: status => {\n      set({ isAllSlidesPanelOpen: status });\n    },\n    setIsLeftPanelOpen: props.setIsLeftPanelOpen || (status => {\n      const { isEnoughCanvasSize } = get();\n      set({\n        isLeftPanelOpen: status,\n        ...status && !isEnoughCanvasSize && { isRightPanelOpen: false },\n      });\n    }),\n    setIsResize: status => {\n      set({ isResize: status });\n    },\n    setIsRightPanelOpen: props.setIsRightPanelOpen || (status => {\n      const { isEnoughCanvasSize, onRightPanelsToggled } = get();\n      set({\n        isRightPanelOpen: status,\n        ...status && !isEnoughCanvasSize && { isLeftPanelOpen: false },\n        ...status && { isSlidesPanelOpen: false },\n      });\n      onRightPanelsToggled(status);\n    }),\n    setIsSlidesPanelOpen: props.setIsSlidesPanelOpen || (status => {\n      const { isEnoughCanvasSize, onRightPanelsToggled } = get();\n      set({\n        isSlidesPanelOpen: status,\n        ...status && !isEnoughCanvasSize && { isLeftPanelOpen: false },\n        ...status && { isRightPanelOpen: false },\n      });\n      onRightPanelsToggled(status);\n    }),\n    setIsTextEditorOpen: status => {\n      set({ isTextEditorOpen: status });\n    },\n    setMatches: matches => {\n      set({ matches });\n    },\n    setZoom: (zoom, layoutWidth) => {\n      set({ zoom });\n      if (layoutWidth) {\n        const { clientWidth: paneWidth } = document.querySelector('.jfReport-pane .toolItemWrapper');\n        const sceneWidth = parseInt(layoutWidth, 10) * zoom;\n        if (window.innerWidth - sceneWidth + 100 > (paneWidth * 2)) {\n          set({ isEnoughCanvasSize: true });\n        } else {\n          set({\n            isEnoughCanvasSize: false,\n            isLeftPanelOpen: false,\n          });\n        }\n      }\n    },\n    shouldShowRightPanelInitially: props.shouldShowRightPanelInitially ?? true,\n    zoom: 1,\n  }));\n};\n\nconst BuilderContext = createContext(null);\n\nexport const BuilderProvider = ({ children, value, ...props }) => {\n  const storeRef = useRef();\n  if (!storeRef.current) {\n    storeRef.current = builderStore(props);\n  }\n\n  return (\n    <BuilderContext.Provider value={storeRef.current}>\n      {children}\n    </BuilderContext.Provider>\n  );\n};\n\nBuilderProvider.propTypes = {\n  children: PropTypes.any,\n  value: PropTypes.object,\n};\n\nexport const BuilderConsumer = BuilderContext.Consumer;\n\nexport const useBuilderStore = selector => {\n  const context = useContext(BuilderContext);\n  if (!context) {\n    throw new Error('useBuilderStore must be used with BuilderProvider!');\n  }\n  return useStore(context, selector);\n};\n"],"names":["builderStore","props","createStore","set","get","activeElements","activeElement","activeTab","left","right","contextMenuProps","editedElement","guides","isAllSlidesPanelOpen","isLeftPanelOpen","isResize","isRightPanelOpen","isSlidesPanelOpen","isTextEditorOpen","lastScrollPosition","matches","onRightPanelsToggled","resetActiveElements","setActiveElements","itemID","edit","replace","setActiveElementsSelection","itemIDs","length","setActiveTab","panel","tabIndex","setContextMenuProps","status","setEditedElement","id","setGuides","setIsAllSlidesPanelOpen","setIsLeftPanelOpen","isEnoughCanvasSize","setIsResize","setIsRightPanelOpen","setIsSlidesPanelOpen","setIsTextEditorOpen","setMatches","setZoom","zoom","layoutWidth","document","querySelector","paneWidth","clientWidth","sceneWidth","parseInt","window","innerWidth","shouldShowRightPanelInitially","BuilderContext","createContext","BuilderProvider","children","value","storeRef","useRef","current","_jsx","propTypes","PropTypes","any","object","Consumer","useBuilderStore","selector","context","useContext","Error","useStore"],"mappings":"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"}
+{"version":3,"file":"BuilderContext.js","sources":["../../../src/contexts/BuilderContext.js"],"sourcesContent":["/* eslint-disable complexity */\nimport { createContext, useContext, useRef } from 'react';\nimport PropTypes from 'prop-types';\nimport { createStore, useStore } from 'zustand';\n\nconst builderStore = props => {\n  return createStore((set, get) => ({\n    activeElements: props.activeElement || [],\n    activeTab: props.activeTab || { left: 0, right: 0 },\n    clickOutsideIgnoreSelectors: props.clickOutsideIgnoreSelectors || [],\n    contextMenuProps: props.contextMenuProps || false,\n    editedElement: props.editedElement || 'l_layout',\n    guides: {},\n    isAllSlidesPanelOpen: props.isAllSlidesPanelOpen || false,\n    isLeftPanelOpen: props.isLeftPanelOpen || false,\n    isResize: false,\n    isRightPanelOpen: props.isRightPanelOpen || false,\n    isSlidesPanelOpen: props.isSlidesPanelOpen || false,\n    isTextEditorOpen: props.isTextEditorOpen || false,\n    lastScrollPosition: props.lastScrollPosition || 0,\n    matches: {},\n    onRightPanelsToggled: props.onRightPanelsToggled || (() => {}),\n    resetActiveElements: props.resetActiveElements || (() => {\n      set({ activeElements: [], editedElement: 'l_layout' });\n    }),\n    setActiveElements: props.setActiveElements || ((itemID, edit = true, replace = true) => {\n      const { activeElements } = get();\n      set({\n        activeElements: replace ? [itemID] : [...activeElements, itemID],\n        ...edit ? { editedElement: !itemID ? 'l_layout' : `i_${itemID}` } : {},\n      });\n    }),\n    setActiveElementsSelection: props.setActiveElementsSelection || (itemIDs => {\n      if (!itemIDs || itemIDs.length === 0) {\n        set({ activeElements: [], editedElement: 'l_layout' });\n      } else if (itemIDs.length === 1) {\n        set({\n          activeElements: itemIDs,\n          editedElement: `i_${itemIDs[0]}`,\n        });\n      } else {\n        set({ activeElements: itemIDs });\n      }\n    }),\n    setActiveTab: props.setActiveTab || ((panel, tabIndex) => {\n      const { activeTab } = get();\n      set({ activeTab: { ...activeTab, [panel]: tabIndex } });\n    }),\n    setContextMenuProps: status => {\n      set({ contextMenuProps: status });\n    },\n    setEditedElement: id => {\n      set({ editedElement: id });\n    },\n    setGuides: guides => {\n      set({ guides });\n    },\n    setIsAllSlidesPanelOpen: status => {\n      set({ isAllSlidesPanelOpen: status });\n    },\n    setIsLeftPanelOpen: props.setIsLeftPanelOpen || (status => {\n      const { isEnoughCanvasSize } = get();\n      set({\n        isLeftPanelOpen: status,\n        ...status && !isEnoughCanvasSize && { isRightPanelOpen: false },\n      });\n    }),\n    setIsResize: status => {\n      set({ isResize: status });\n    },\n    setIsRightPanelOpen: props.setIsRightPanelOpen || (status => {\n      const { isEnoughCanvasSize, onRightPanelsToggled } = get();\n      set({\n        isRightPanelOpen: status,\n        ...status && !isEnoughCanvasSize && { isLeftPanelOpen: false },\n        ...status && { isSlidesPanelOpen: false },\n      });\n      onRightPanelsToggled(status);\n    }),\n    setIsSlidesPanelOpen: props.setIsSlidesPanelOpen || (status => {\n      const { isEnoughCanvasSize, onRightPanelsToggled } = get();\n      set({\n        isSlidesPanelOpen: status,\n        ...status && !isEnoughCanvasSize && { isLeftPanelOpen: false },\n        ...status && { isRightPanelOpen: false },\n      });\n      onRightPanelsToggled(status);\n    }),\n    setIsTextEditorOpen: status => {\n      set({ isTextEditorOpen: status });\n    },\n    setMatches: matches => {\n      set({ matches });\n    },\n    setZoom: (zoom, layoutWidth) => {\n      set({ zoom });\n      if (layoutWidth) {\n        const { clientWidth: paneWidth } = document.querySelector('.jfReport-pane .toolItemWrapper');\n        const sceneWidth = parseInt(layoutWidth, 10) * zoom;\n        if (window.innerWidth - sceneWidth + 100 > (paneWidth * 2)) {\n          set({ isEnoughCanvasSize: true });\n        } else {\n          set({\n            isEnoughCanvasSize: false,\n            isLeftPanelOpen: false,\n          });\n        }\n      }\n    },\n    shouldShowRightPanelInitially: props.shouldShowRightPanelInitially ?? true,\n    zoom: 1,\n  }));\n};\n\nconst BuilderContext = createContext(null);\n\nexport const BuilderProvider = ({ children, value, ...props }) => {\n  const storeRef = useRef();\n  if (!storeRef.current) {\n    storeRef.current = builderStore(props);\n  }\n\n  return (\n    <BuilderContext.Provider value={storeRef.current}>\n      {children}\n    </BuilderContext.Provider>\n  );\n};\n\nBuilderProvider.propTypes = {\n  children: PropTypes.any,\n  value: PropTypes.object,\n};\n\nexport const BuilderConsumer = BuilderContext.Consumer;\n\nexport const useBuilderStore = selector => {\n  const context = useContext(BuilderContext);\n  if (!context) {\n    throw new Error('useBuilderStore must be used with BuilderProvider!');\n  }\n  return useStore(context, selector);\n};\n"],"names":["builderStore","props","createStore","set","get","activeElements","activeElement","activeTab","left","right","clickOutsideIgnoreSelectors","contextMenuProps","editedElement","guides","isAllSlidesPanelOpen","isLeftPanelOpen","isResize","isRightPanelOpen","isSlidesPanelOpen","isTextEditorOpen","lastScrollPosition","matches","onRightPanelsToggled","resetActiveElements","setActiveElements","itemID","edit","replace","setActiveElementsSelection","itemIDs","length","setActiveTab","panel","tabIndex","setContextMenuProps","status","setEditedElement","id","setGuides","setIsAllSlidesPanelOpen","setIsLeftPanelOpen","isEnoughCanvasSize","setIsResize","setIsRightPanelOpen","setIsSlidesPanelOpen","setIsTextEditorOpen","setMatches","setZoom","zoom","layoutWidth","document","querySelector","paneWidth","clientWidth","sceneWidth","parseInt","window","innerWidth","shouldShowRightPanelInitially","BuilderContext","createContext","BuilderProvider","children","value","storeRef","useRef","current","_jsx","propTypes","PropTypes","any","object","Consumer","useBuilderStore","selector","context","useContext","Error","useStore"],"mappings":"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"}

package/lib/cjs/contexts/Providers.js

@@ -10,7 +10,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 
-var _excluded = ["children", "lastScrollPosition", "mode", "onRightPanelsToggled", "presentationBarActions", "shouldShowRightPanelInitially", "useFixedPresentationBar"];
+var _excluded = ["children", "clickOutsideIgnoreSelectors", "lastScrollPosition", "mode", "onRightPanelsToggled", "presentationBarActions", "shouldShowRightPanelInitially", "useFixedPresentationBar"];
 
 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; }
 
@@ -24,6 +24,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 var Providers = function Providers(_ref) {
   var children = _ref.children,
+      clickOutsideIgnoreSelectors = _ref.clickOutsideIgnoreSelectors,
       lastScrollPosition = _ref.lastScrollPosition,
       mode = _ref.mode,
       onRightPanelsToggled = _ref.onRightPanelsToggled,
@@ -33,6 +34,7 @@ var Providers = function Providers(_ref) {
       props = _objectWithoutProperties(_ref, _excluded);
 
   return /*#__PURE__*/jsxRuntime.jsx(BuilderContext.BuilderProvider, {
+    clickOutsideIgnoreSelectors: clickOutsideIgnoreSelectors,
     lastScrollPosition: lastScrollPosition,
     onRightPanelsToggled: onRightPanelsToggled,
     shouldShowRightPanelInitially: shouldShowRightPanelInitially,
@@ -49,6 +51,9 @@ var Providers = function Providers(_ref) {
 Providers.propTypes = {
   children: PropTypes__default['default'].node.isRequired,
 
+  /** CSS selectors ignored by right panel click-outside logic */
+  clickOutsideIgnoreSelectors: PropTypes__default['default'].arrayOf(PropTypes__default['default'].string),
+
   /** Last scroll position */
   lastScrollPosition: PropTypes__default['default'].number,
 

package/lib/cjs/contexts/Providers.js.map

@@ -1 +1 @@
-{"version":3,"file":"Providers.js","sources":["../../../src/contexts/Providers.js"],"sourcesContent":["import PropTypes from 'prop-types';\nimport { BuilderProvider } from './BuilderContext';\nimport { PresentationProvider } from './PresentationContext';\nimport { PropProvider } from './PropContext';\n\nconst Providers = ({\n  children,\n  lastScrollPosition,\n  mode,\n  onRightPanelsToggled,\n  presentationBarActions,\n  shouldShowRightPanelInitially,\n  useFixedPresentationBar,\n  ...props\n}) => {\n  return (\n    <BuilderProvider\n      lastScrollPosition={lastScrollPosition}\n      onRightPanelsToggled={onRightPanelsToggled}\n      shouldShowRightPanelInitially={shouldShowRightPanelInitially}\n    >\n      <PropProvider {...props}>\n        {mode === 'customize' ? children : (\n          <PresentationProvider\n            presentationBarActions={presentationBarActions}\n            useFixedPresentationBar={useFixedPresentationBar}\n          >\n            {children}\n          </PresentationProvider>\n        )}\n      </PropProvider>\n    </BuilderProvider>\n  );\n};\n\nProviders.propTypes = {\n  children: PropTypes.node.isRequired,\n  /** Last scroll position */\n  lastScrollPosition: PropTypes.number,\n  /** Mode of the report */\n  mode: PropTypes.oneOf(['customize', 'presentation', 'preview', 'print']),\n  /** Function called when the slides or the right panel is\n   * toggled takes a boolean value to indicate whether or\n   * not the panel is toggled open.\n   */\n  onRightPanelsToggled: PropTypes.func,\n  /** To pass in action definitions that will be rendered as buttons */\n  presentationBarActions: PropTypes.arrayOf(PropTypes.shape({})),\n  /** Flag for fixed action bar */\n  shouldShowRightPanelInitially: PropTypes.bool,\n  /** Flag for whether to show the right panel initially */\n  useFixedPresentationBar: PropTypes.bool,\n};\n\nexport default Providers;\n"],"names":["Providers","children","lastScrollPosition","mode","onRightPanelsToggled","presentationBarActions","shouldShowRightPanelInitially","useFixedPresentationBar","props","_jsx","BuilderProvider","PropProvider","PresentationProvider","propTypes","PropTypes","node","isRequired","number","oneOf","func","arrayOf","shape","bool"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;IAKMA,SAAS,GAAG,SAAZA,SAAY,OASZ;AAAA,MARJC,QAQI,QARJA,QAQI;AAAA,MAPJC,kBAOI,QAPJA,kBAOI;AAAA,MANJC,IAMI,QANJA,IAMI;AAAA,MALJC,oBAKI,QALJA,oBAKI;AAAA,MAJJC,sBAII,QAJJA,sBAII;AAAA,MAHJC,6BAGI,QAHJA,6BAGI;AAAA,MAFJC,uBAEI,QAFJA,uBAEI;AAAA,MADDC,KACC;;AACJ,sBACEC,eAACC,8BAAD;AACE,IAAA,kBAAkB,EAAER,kBADtB;AAEE,IAAA,oBAAoB,EAAEE,oBAFxB;AAGE,IAAA,6BAA6B,EAAEE,6BAHjC;AAAA,2BAKEG,eAACE,wBAAD,kCAAkBH,KAAlB;AAAA,gBACGL,IAAI,KAAK,WAAT,GAAuBF,QAAvB,gBACCQ,eAACG,wCAAD;AACE,QAAA,sBAAsB,EAAEP,sBAD1B;AAEE,QAAA,uBAAuB,EAAEE,uBAF3B;AAAA,kBAIGN;AAJH;AAFJ;AALF,IADF;AAkBD;;AAEDD,SAAS,CAACa,SAAV,GAAsB;AACpBZ,EAAAA,QAAQ,EAAEa,6BAAS,CAACC,IAAV,CAAeC,UADL;;AAEpB;AACAd,EAAAA,kBAAkB,EAAEY,6BAAS,CAACG,MAHV;;AAIpB;AACAd,EAAAA,IAAI,EAAEW,6BAAS,CAACI,KAAV,CAAgB,CAAC,WAAD,EAAc,cAAd,EAA8B,SAA9B,EAAyC,OAAzC,CAAhB,CALc;;AAMpB;AACF;AACA;AACA;AACEd,EAAAA,oBAAoB,EAAEU,6BAAS,CAACK,IAVZ;;AAWpB;AACAd,EAAAA,sBAAsB,EAAES,6BAAS,CAACM,OAAV,CAAkBN,6BAAS,CAACO,KAAV,CAAgB,EAAhB,CAAlB,CAZJ;;AAapB;AACAf,EAAAA,6BAA6B,EAAEQ,6BAAS,CAACQ,IAdrB;;AAepB;AACAf,EAAAA,uBAAuB,EAAEO,6BAAS,CAACQ;AAhBf,CAAtB;;;;"}
+{"version":3,"file":"Providers.js","sources":["../../../src/contexts/Providers.js"],"sourcesContent":["import PropTypes from 'prop-types';\nimport { BuilderProvider } from './BuilderContext';\nimport { PresentationProvider } from './PresentationContext';\nimport { PropProvider } from './PropContext';\n\nconst Providers = ({\n  children,\n  clickOutsideIgnoreSelectors,\n  lastScrollPosition,\n  mode,\n  onRightPanelsToggled,\n  presentationBarActions,\n  shouldShowRightPanelInitially,\n  useFixedPresentationBar,\n  ...props\n}) => {\n  return (\n    <BuilderProvider\n      clickOutsideIgnoreSelectors={clickOutsideIgnoreSelectors}\n      lastScrollPosition={lastScrollPosition}\n      onRightPanelsToggled={onRightPanelsToggled}\n      shouldShowRightPanelInitially={shouldShowRightPanelInitially}\n    >\n      <PropProvider {...props}>\n        {mode === 'customize' ? children : (\n          <PresentationProvider\n            presentationBarActions={presentationBarActions}\n            useFixedPresentationBar={useFixedPresentationBar}\n          >\n            {children}\n          </PresentationProvider>\n        )}\n      </PropProvider>\n    </BuilderProvider>\n  );\n};\n\nProviders.propTypes = {\n  children: PropTypes.node.isRequired,\n  /** CSS selectors ignored by right panel click-outside logic */\n  clickOutsideIgnoreSelectors: PropTypes.arrayOf(PropTypes.string),\n  /** Last scroll position */\n  lastScrollPosition: PropTypes.number,\n  /** Mode of the report */\n  mode: PropTypes.oneOf(['customize', 'presentation', 'preview', 'print']),\n  /** Function called when the slides or the right panel is\n   * toggled takes a boolean value to indicate whether or\n   * not the panel is toggled open.\n   */\n  onRightPanelsToggled: PropTypes.func,\n  /** To pass in action definitions that will be rendered as buttons */\n  presentationBarActions: PropTypes.arrayOf(PropTypes.shape({})),\n  /** Flag for fixed action bar */\n  shouldShowRightPanelInitially: PropTypes.bool,\n  /** Flag for whether to show the right panel initially */\n  useFixedPresentationBar: PropTypes.bool,\n};\n\nexport default Providers;\n"],"names":["Providers","children","clickOutsideIgnoreSelectors","lastScrollPosition","mode","onRightPanelsToggled","presentationBarActions","shouldShowRightPanelInitially","useFixedPresentationBar","props","_jsx","BuilderProvider","PropProvider","PresentationProvider","propTypes","PropTypes","node","isRequired","arrayOf","string","number","oneOf","func","shape","bool"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;IAKMA,SAAS,GAAG,SAAZA,SAAY,OAUZ;AAAA,MATJC,QASI,QATJA,QASI;AAAA,MARJC,2BAQI,QARJA,2BAQI;AAAA,MAPJC,kBAOI,QAPJA,kBAOI;AAAA,MANJC,IAMI,QANJA,IAMI;AAAA,MALJC,oBAKI,QALJA,oBAKI;AAAA,MAJJC,sBAII,QAJJA,sBAII;AAAA,MAHJC,6BAGI,QAHJA,6BAGI;AAAA,MAFJC,uBAEI,QAFJA,uBAEI;AAAA,MADDC,KACC;;AACJ,sBACEC,eAACC,8BAAD;AACE,IAAA,2BAA2B,EAAET,2BAD/B;AAEE,IAAA,kBAAkB,EAAEC,kBAFtB;AAGE,IAAA,oBAAoB,EAAEE,oBAHxB;AAIE,IAAA,6BAA6B,EAAEE,6BAJjC;AAAA,2BAMEG,eAACE,wBAAD,kCAAkBH,KAAlB;AAAA,gBACGL,IAAI,KAAK,WAAT,GAAuBH,QAAvB,gBACCS,eAACG,wCAAD;AACE,QAAA,sBAAsB,EAAEP,sBAD1B;AAEE,QAAA,uBAAuB,EAAEE,uBAF3B;AAAA,kBAIGP;AAJH;AAFJ;AANF,IADF;AAmBD;;AAEDD,SAAS,CAACc,SAAV,GAAsB;AACpBb,EAAAA,QAAQ,EAAEc,6BAAS,CAACC,IAAV,CAAeC,UADL;;AAEpB;AACAf,EAAAA,2BAA2B,EAAEa,6BAAS,CAACG,OAAV,CAAkBH,6BAAS,CAACI,MAA5B,CAHT;;AAIpB;AACAhB,EAAAA,kBAAkB,EAAEY,6BAAS,CAACK,MALV;;AAMpB;AACAhB,EAAAA,IAAI,EAAEW,6BAAS,CAACM,KAAV,CAAgB,CAAC,WAAD,EAAc,cAAd,EAA8B,SAA9B,EAAyC,OAAzC,CAAhB,CAPc;;AAQpB;AACF;AACA;AACA;AACEhB,EAAAA,oBAAoB,EAAEU,6BAAS,CAACO,IAZZ;;AAapB;AACAhB,EAAAA,sBAAsB,EAAES,6BAAS,CAACG,OAAV,CAAkBH,6BAAS,CAACQ,KAAV,CAAgB,EAAhB,CAAlB,CAdJ;;AAepB;AACAhB,EAAAA,6BAA6B,EAAEQ,6BAAS,CAACS,IAhBrB;;AAiBpB;AACAhB,EAAAA,uBAAuB,EAAEO,6BAAS,CAACS;AAlBf,CAAtB;;;;"}

package/lib/cjs/styles/_jfReportsFloatings.scss

@@ -151,13 +151,13 @@
       }
     }
 
-    .controllerItem {
+    :where(.controllerItem) {
       background: #343C6A;
       border-radius: 3px;
       border: none;
       transition: $transition;
 
-      &:hover {
+      &:where(:hover) {
         background: rgba(111, 118, 167, 0.6);
       }
     }
@@ -197,6 +197,113 @@
     }
   }
 
+  // Page Toolbar new styles //
+  &.page-toolbar {
+    position: absolute;
+    top: 58px;
+    right: -40px;
+    gap: 4px;
+
+    .controllerItem {
+      max-width: 24px;
+      max-height: 24px;
+      min-width: 24px;
+      min-height: 24px;
+
+      .toolbar-icon {
+        width: 16px;
+        height: 16px;
+      }
+    }
+  }
+
+  // Zoom Toolbar new styles //
+  &.zoom-toolbar {
+    position: absolute;
+    bottom: 20px;
+    left: 20px;
+    gap: 4px;
+    z-index: 2;
+
+    .controllerItem {
+      max-width: 32px;
+      max-height: 32px;
+      min-width: 32px;
+      min-height: 32px;
+
+      .toolbar-icon {
+        width: 20px;
+        height: 20px;
+      }
+    }
+  }
+
+  &.page-toolbar, &.zoom-toolbar {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    justify-content: flex-start;
+    transition: $transition;
+    border-radius: 3px;
+
+    .floatingController-container {
+      display: flex;
+      padding: 4px;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+      gap: 4px;
+      box-shadow: 0 4px 8px 0 rgba(84, 95, 111, 0.15), 0 0 2px 0 rgba(37, 45, 91, 0.1);
+    }
+
+    :where(.floatingController-container + .floatingController-container) {
+      margin-top: 0;
+    }
+
+    .controllerItem {
+      width: 100%;
+      height: 100%;
+      display: flex;
+      padding: 4px;
+      flex-shrink: 0;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+      border-radius: 4px;
+      background-color: #F9F9FF;
+      transition: $transition;
+
+      .toolbar-icon {
+        color: #0A1551;
+        fill: #0A1551;
+        transition: $transition;
+      }
+
+      &:where(:hover) {
+        background-color: #E3E5F5;
+        transition: $transition;
+      }
+
+      &:hover.primary {
+        background-color: #EDF8FF;
+
+        .toolbar-icon {
+          color: #0075E3;
+          fill: #0075E3;
+        }
+      }
+
+      &:hover.error {
+        background-color: #FEF2F2;
+
+        .toolbar-icon {
+          color: #DC2626;
+          fill: #DC2626;
+        }
+      }
+    }
+  }
+
 
   &.forZoom {
     left: 15px;

package/lib/cjs/styles/_jfReportsPages.scss

@@ -153,43 +153,40 @@
 
 
 .contextMenu-wrapper {
-  border-radius: 3px;
-  background: #fff;
-  color: #fff;
-  display: block;
+  display: flex;
+  padding: 4px;
+  flex-direction: column;
+  justify-content: center;
+  align-items: flex-start;
   position: absolute;
   width: 225px;
   z-index: 10;
-  box-shadow: 0 0 8px 1px rgba(0, 0, 0, 0.2);
+  border-radius: 4px;
+  background: #252D5B;
+  color: #FFFFFF;
 }
 
 .contextMenu-button {
-  transition: .2s ease-in-out;
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: flex-start;
   background: none;
   border: none;
-  height: 45px;
+  height: 40px;
   width: 100%;
   font-size: 0.875rem;
-  padding-left: 14px;
+  padding: 0 8px;
   text-align: left;
+  color: #FFFFFF;
+  transition: .2s ease-in-out;
 
   .contextMenu-icon {
+    color: #FFFFFF;
     margin-right: 9px;
-    width: 15px;
-    height: 14px;
-
-    .icon-lock {
-      width: 16px;
-      height: 14px;
-      fill: $blue;
-      stroke: $blue;
-
-      > path { fill: $blue; }
-    }
+    width: 16px;
+    height: 16px;
+    fill: #FFFFFF;
   }
 
   .contextMenu-text {
@@ -200,20 +197,16 @@
   }
 
   &:hover {
-    background: #f0f0f0;
+    background-color: #454E80;
+    transition: all 0.3s ease;
   }
 }
 
 .contextMenu-button.isDanger {
+  color: #DC2626;
 
   .contextMenu-icon {
-    svg {
-      width: 16px;
-      height: 16px;
-    }
+    color: #DC2626;
+    fill: #DC2626;
   }
 }
-
-.contextMenu-button + .contextMenu-button {
-  border-top: 1px solid #F0F0F0;
-}