@jotforminc/dnd-builder 3.4.3 → 3.4.6

package/lib/esm/components/withClickOutside.js

@@ -7,6 +7,7 @@ import 'core-js/modules/es.string.iterator.js';
 import { useRef, useCallback, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import { EVENT_IGNORED_ROLES } from '../constants/eventIgnoredRoles.js';
+import { useBuilderStore } from '../contexts/BuilderContext.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; }
@@ -26,6 +27,9 @@ function withClickOutside(WrappedComponent) {
         onClickOutside = props.onClickOutside,
         _props$withClickOutsi = props.withClickOutsideWrapperClass,
         withClickOutsideWrapperClass = _props$withClickOutsi === void 0 ? null : _props$withClickOutsi;
+    var clickOutsideIgnoreSelectors = useBuilderStore(function (state) {
+      return state.clickOutsideIgnoreSelectors;
+    });
     var wrapper = useRef(null);
     var handleClickOutside = useCallback(function (event) {
       var classList = event.target.classList;
@@ -36,6 +40,8 @@ function withClickOutside(WrappedComponent) {
         return event.target.closest(".".concat(item));
       }) || EVENT_IGNORED_ROLES.some(function (role) {
         return event.target.closest("[role=".concat(role, "]"));
+      }) || clickOutsideIgnoreSelectors.some(function (selector) {
+        return selector && event.target.closest(selector);
       }))) {
         return;
       }
@@ -43,7 +49,7 @@ function withClickOutside(WrappedComponent) {
       if (wrapper.current && !wrapper.current.contains(event.target)) {
         onClickOutside(event);
       }
-    }, [exceptionalClasses, onClickOutside]);
+    }, [exceptionalClasses, onClickOutside, clickOutsideIgnoreSelectors]);
     useEffect(function () {
       window.addEventListener('mousedown', handleClickOutside, true);
       return function () {

package/lib/esm/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":";;;;;;;;;;;;;;;;;AAIA,SAASA,cAAT,CAAwBC,gBAAxB,EAA0C;AACxC,SAAOA,gBAAgB,CAACC,WAAjB,IAAgCD,gBAAgB,CAACE,IAAjD,IAAyD,WAAhE;AACD;;AAED,SAASC,gBAAT,CAA0BH,gBAA1B,EAA4C;AAC1C,WAASI,gBAAT,CAA0BC,KAA1B,EAAiC;AAC/B,gCAIIA,KAJJ,CACEC,kBADF;AAAA,QACEA,kBADF,sCACuB,IADvB;AAAA,QAEEC,cAFF,GAIIF,KAJJ,CAEEE,cAFF;AAAA,gCAIIF,KAJJ,CAGEG,4BAHF;AAAA,QAGEA,4BAHF,sCAGiC,IAHjC;AAMA,QAAMC,OAAO,GAAGC,MAAM,CAAC,IAAD,CAAtB;AAEA,QAAMC,kBAAkB,GAAGC,WAAW,CAAC,UAAAC,KAAK,EAAI;AAC9C,UAAQC,SAAR,GAAsBD,KAAK,CAACE,MAA5B,CAAQD,SAAR;;AACA,UACER,kBAAkB,KAEhBQ,SAAS,CAACE,QAAV,CAAmBV,kBAAnB,KACGW,KAAK,CAACC,IAAN,CAAWJ,SAAX,EAAsBK,IAAtB,CAA2B,UAAAC,MAAM;AAAA,eAAId,kBAAkB,CAACe,QAAnB,CAA4BD,MAA5B,CAAJ;AAAA,OAAjC,CADH,IAEGd,kBAAkB,CAACa,IAAnB,CAAwB,UAAAG,IAAI;AAAA,eAAIT,KAAK,CAACE,MAAN,CAAaQ,OAAb,YAAyBD,IAAzB,EAAJ;AAAA,OAA5B,CAFH,IAGGE,mBAAmB,CAACL,IAApB,CAAyB,UAAAM,IAAI;AAAA,eAAIZ,KAAK,CAACE,MAAN,CAAaQ,OAAb,iBAA8BE,IAA9B,OAAJ;AAAA,OAA7B,CALa,CADpB,EAQE;AACA;AACD;;AAED,UAAIhB,OAAO,CAACiB,OAAR,IAAmB,CAACjB,OAAO,CAACiB,OAAR,CAAgBV,QAAhB,CAAyBH,KAAK,CAACE,MAA/B,CAAxB,EAAgE;AAC9DR,QAAAA,cAAc,CAACM,KAAD,CAAd;AACD;AACF,KAjBqC,EAiBnC,CAACP,kBAAD,EAAqBC,cAArB,CAjBmC,CAAtC;AAmBAoB,IAAAA,SAAS,CAAC,YAAM;AACdC,MAAAA,MAAM,CAACC,gBAAP,CAAwB,WAAxB,EAAqClB,kBAArC,EAAyD,IAAzD;AACA,aAAO,YAAM;AACXiB,QAAAA,MAAM,CAACE,mBAAP,CAA2B,WAA3B,EAAwCnB,kBAAxC,EAA4D,IAA5D;AACD,OAFD;AAGD,KALQ,EAKN,CAACA,kBAAD,CALM,CAAT,CA5B+B;;AAoC/B,QAAMoB,aAAa,GAAG,CAAC,8BAAD,EAAiC,oBAAjC,CAAtB;AACA,QAAMC,aAAa,GAAGjC,cAAc,CAACC,gBAAD,CAApC;;AACA,QAAIgC,aAAa,KAAK,WAAtB,EAAmC;AACjC;AACAD,MAAAA,aAAa,CAACE,IAAd,CAAmB,gBAAnB;AACD;;AACD,QAAMC,aAAa,GAAGC,MAAM,CAACC,IAAP,CAAY/B,KAAZ,EAAmBgC,MAAnB,CAA0B,UAACC,QAAD,EAAWC,OAAX,EAAuB;AACrE,UAAMC,SAAS,GAAGF,QAAlB;;AACA,UAAIP,aAAa,CAACU,OAAd,CAAsBF,OAAtB,MAAmC,CAAC,CAAxC,EAA2C;AACzCC,QAAAA,SAAS,CAACD,OAAD,CAAT,GAAqBlC,KAAK,CAACkC,OAAD,CAA1B;AACD;;AACD,aAAOC,SAAP;AACD,KANqB,EAMnB,EANmB,CAAtB;AAQA,wBACEE;AACE,MAAA,GAAG,EAAEjC,OADP;AAEE,MAAA,SAAS,EAAED,4BAFb;AAAA,6BAIEkC,IAAC,gBAAD,oBACMR,aADN;AAJF,MADF;AAUD;;AAED9B,EAAAA,gBAAgB,CAACuC,SAAjB,GAA6B;AAC3BrC,IAAAA,kBAAkB,EAAEsC,SAAS,CAACC,SAAV,CAAoB,CACtCD,SAAS,CAACE,MAD4B,EAEtCF,SAAS,CAACG,OAAV,CAAkBH,SAAS,CAACE,MAA5B,CAFsC,CAApB,CADO;AAK3BvC,IAAAA,cAAc,EAAEqC,SAAS,CAACI,IAAV,CAAeC,UALJ;AAM3BzC,IAAAA,4BAA4B,EAAEoC,SAAS,CAACE;AANb,GAA7B;AASA1C,EAAAA,gBAAgB,CAACH,WAAjB,wBAA6CF,cAAc,CAACC,gBAAD,CAA3D;AAEA,SAAOI,gBAAP;AACD;;;;"}
+{"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/esm/constants/eventIgnoredRoles.js

@@ -4,6 +4,7 @@
  * 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"]'];
 
-export { EVENT_IGNORED_ROLES };
+export { EVENT_IGNORED_FIELDS, EVENT_IGNORED_ROLES };
 //# sourceMappingURL=eventIgnoredRoles.js.map

package/lib/esm/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/esm/contexts/BuilderContext.js

@@ -38,6 +38,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/esm/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/esm/contexts/Providers.js

@@ -4,7 +4,7 @@ import { PresentationProvider } from './PresentationContext.js';
 import { PropProvider } from './PropContext.js';
 import { jsx } from 'react/jsx-runtime';
 
-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; }
 
@@ -18,6 +18,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,
@@ -27,6 +28,7 @@ var Providers = function Providers(_ref) {
       props = _objectWithoutProperties(_ref, _excluded);
 
   return /*#__PURE__*/jsx(BuilderProvider, {
+    clickOutsideIgnoreSelectors: clickOutsideIgnoreSelectors,
     lastScrollPosition: lastScrollPosition,
     onRightPanelsToggled: onRightPanelsToggled,
     shouldShowRightPanelInitially: shouldShowRightPanelInitially,
@@ -43,6 +45,9 @@ var Providers = function Providers(_ref) {
 Providers.propTypes = {
   children: PropTypes.node.isRequired,
 
+  /** CSS selectors ignored by right panel click-outside logic */
+  clickOutsideIgnoreSelectors: PropTypes.arrayOf(PropTypes.string),
+
   /** Last scroll position */
   lastScrollPosition: PropTypes.number,
 

package/lib/esm/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","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,IAAC,eAAD;AACE,IAAA,kBAAkB,EAAEP,kBADtB;AAEE,IAAA,oBAAoB,EAAEE,oBAFxB;AAGE,IAAA,6BAA6B,EAAEE,6BAHjC;AAAA,2BAKEG,IAAC,YAAD,kCAAkBD,KAAlB;AAAA,gBACGL,IAAI,KAAK,WAAT,GAAuBF,QAAvB,gBACCQ,IAAC,oBAAD;AACE,QAAA,sBAAsB,EAAEJ,sBAD1B;AAEE,QAAA,uBAAuB,EAAEE,uBAF3B;AAAA,kBAIGN;AAJH;AAFJ;AALF,IADF;AAkBD;;AAEDD,SAAS,CAACU,SAAV,GAAsB;AACpBT,EAAAA,QAAQ,EAAEU,SAAS,CAACC,IAAV,CAAeC,UADL;;AAEpB;AACAX,EAAAA,kBAAkB,EAAES,SAAS,CAACG,MAHV;;AAIpB;AACAX,EAAAA,IAAI,EAAEQ,SAAS,CAACI,KAAV,CAAgB,CAAC,WAAD,EAAc,cAAd,EAA8B,SAA9B,EAAyC,OAAzC,CAAhB,CALc;;AAMpB;AACF;AACA;AACA;AACEX,EAAAA,oBAAoB,EAAEO,SAAS,CAACK,IAVZ;;AAWpB;AACAX,EAAAA,sBAAsB,EAAEM,SAAS,CAACM,OAAV,CAAkBN,SAAS,CAACO,KAAV,CAAgB,EAAhB,CAAlB,CAZJ;;AAapB;AACAZ,EAAAA,6BAA6B,EAAEK,SAAS,CAACQ,IAdrB;;AAepB;AACAZ,EAAAA,uBAAuB,EAAEI,SAAS,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","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,IAAC,eAAD;AACE,IAAA,2BAA2B,EAAER,2BAD/B;AAEE,IAAA,kBAAkB,EAAEC,kBAFtB;AAGE,IAAA,oBAAoB,EAAEE,oBAHxB;AAIE,IAAA,6BAA6B,EAAEE,6BAJjC;AAAA,2BAMEG,IAAC,YAAD,kCAAkBD,KAAlB;AAAA,gBACGL,IAAI,KAAK,WAAT,GAAuBH,QAAvB,gBACCS,IAAC,oBAAD;AACE,QAAA,sBAAsB,EAAEJ,sBAD1B;AAEE,QAAA,uBAAuB,EAAEE,uBAF3B;AAAA,kBAIGP;AAJH;AAFJ;AANF,IADF;AAmBD;;AAEDD,SAAS,CAACW,SAAV,GAAsB;AACpBV,EAAAA,QAAQ,EAAEW,SAAS,CAACC,IAAV,CAAeC,UADL;;AAEpB;AACAZ,EAAAA,2BAA2B,EAAEU,SAAS,CAACG,OAAV,CAAkBH,SAAS,CAACI,MAA5B,CAHT;;AAIpB;AACAb,EAAAA,kBAAkB,EAAES,SAAS,CAACK,MALV;;AAMpB;AACAb,EAAAA,IAAI,EAAEQ,SAAS,CAACM,KAAV,CAAgB,CAAC,WAAD,EAAc,cAAd,EAA8B,SAA9B,EAAyC,OAAzC,CAAhB,CAPc;;AAQpB;AACF;AACA;AACA;AACEb,EAAAA,oBAAoB,EAAEO,SAAS,CAACO,IAZZ;;AAapB;AACAb,EAAAA,sBAAsB,EAAEM,SAAS,CAACG,OAAV,CAAkBH,SAAS,CAACQ,KAAV,CAAgB,EAAhB,CAAlB,CAdJ;;AAepB;AACAb,EAAAA,6BAA6B,EAAEK,SAAS,CAACS,IAhBrB;;AAiBpB;AACAb,EAAAA,uBAAuB,EAAEI,SAAS,CAACS;AAlBf,CAAtB;;;;"}

package/lib/esm/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/esm/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;
-}

package/lib/esm/styles/_jfReportsReportItem.scss

@@ -74,17 +74,16 @@
       content: "";
       position: absolute;
       display: block;
-      background-color: #ddefff;
-      border: 1px solid $blue;
+      background-color: #FFFFFF;
+      border: 3px solid #0099FF;
       transition: .3s ease-in-out;
     }
 
     &:not(.forLine):after {
-      left: 2px;
-      top: 2px;
-      right: 2px;
-      bottom: 2px;
-      border-radius: 2px;
+      inset: 2px;
+      width: 3px;
+      height: 3px;
+      border-radius: 3px;
     }
 
     &.forLine {
@@ -93,26 +92,28 @@
       }
       &:not(.isVertical) {
         &:after {
-          top: 1px;
+          top: -0.5px;
           bottom: 1px;
-          left: calc(50% - 10px);
-          width: 18px;
+          left: calc(50% - 6px);
+          width: 8px;
+          height: 4px;
         }
       }
 
       &.isVertical {
         &:after {
-          top: calc(50% - 10px);
-          left: 1px;
-          right: 1px;
-          height: 18px;
+          top: calc(50% - 6px);
+          left: -0.5px;
+          right: -0.5px;
+          height: 8px;
+          width: 4px;
         }
       }
     }
 
     &:hover {
       &:after {
-        background-color: #B4DCFF;
+        background-color: #FFFFFF;
       }
     }
   }
@@ -123,7 +124,7 @@
     top: -50px;
     padding: 5px;
     background-color: #ddefff;
-    border: 1px solid $blue;
+    border: 2px solid #0099FF;
     border-radius: 50%;
 
     &:before {
@@ -148,8 +149,7 @@
   }
 
   .reportItemResizer {
-    border: 1px solid $blue;
-    box-shadow: 0 0 0 3px rgba(106, 110, 143, 0.15);
+    border: 3px solid #0099FF;
     border-radius: 3px;
 
     &.hideVerticalHandle {
@@ -216,56 +216,82 @@
 }
 
 .jfReport {
-  .reportItemMenu {
+  .report-item-toolbar {
     position: absolute;
-    top: 0;
+    top: 50%;
+    transform: translateY(-50%);
     right: -24px;
-    background-color: $blue;
-    border-radius: 4px;
+    background-color: #FFFFFF;
+    padding: 4px;
+    border-radius: 3px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
     text-align: center;
     pointer-events: all;
+    z-index: 2;
     animation: .2s fadeRight forwards;
+    gap: 4px;
+    box-shadow: 0 4px 8px 0 rgba(84, 95, 111, 0.15), 0 0 2px 0 rgba(37, 45, 91, 0.1);
 
     &-item {
-      display: inline-block;
-      padding: 6px 5px;
-      background-color: transparent;
-
-      svg {
-        width: 14px;
-        height: 14px;
-        backface-visibility: hidden;
-        transition: .3s ease-in-out;
-        transform: translateZ(0);
+      max-width: 24px;
+      max-height: 24px;
+      min-width: 24px;
+      min-height: 24px;
+      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 {
+        width: 16px;
+        height: 16px;
+        color: #0A1551;
+        fill: #0A1551;
+        transition: $transition;
       }
-    }
 
-    &:not(.forLocked) {
-      padding: 0 4px;
-      .reportItemMenu-item {
-        display: inline-flex;
-        align-items: center;
-        justify-content: center;
-        width: 20px;
-        height: 20px;
-        padding: 0;
-        border-radius: 3px;
-        transition: 0.3s ease-in;
+      &:where(:hover) {
+        background-color: #E3E5F5;
+        transition: $transition;
+      }
 
-        + .reportItemMenu-item {
-          margin-top: 4px;
-        }
+      &:hover.primary {
+        background-color: #EDF8FF;
 
-        &:first-child {
-          margin-top: 4px;
+        .toolbar-icon {
+          color: #0075E3;
+          fill: #0075E3;
         }
+      }
+
+      &:hover.error {
+        background-color: #FEF2F2;
 
-        &:last-child {
-          margin-bottom: 4px;
+        .toolbar-icon {
+          color: #DC2626;
+          fill: #DC2626;
         }
+      }
+    }
+
+    &.isLocked.forLocked {
+      background-color: #C8CEED;
+
+      .report-item-toolbar-item {
+        background-color: #C8CEED;
 
         &:hover {
-          background-color: rgba(255, 255, 255, 0.2);
+          background-color: #E3E5F5;
         }
       }
     }
@@ -277,7 +303,7 @@
       opacity: 0;
     }
     100% {
-      right: -35px;
+      right: -38px;
       opacity: 1;
     }
   }

package/lib/esm/styles/_jfReportsTextEditor.scss

@@ -291,7 +291,7 @@
     }
   }
 
-  .reportItemMenu + .ql-toolbar.ql-snow {
+  .report-item-toolbar + .ql-toolbar.ql-snow {
     .ql-stroke {
       /* stylelint-disable-next-line declaration-no-important */
       stroke: #6F76A7 !important;
@@ -304,6 +304,6 @@
   }
 }
 
-.reportItemMenu + .ql-toolbar.ql-snow .ql-button:hover {
+.report-item-toolbar + .ql-toolbar.ql-snow .ql-button:hover {
   background-color: #F3F3FE;
 }