@jotforminc/dnd-builder 3.0.0-alpha.2 → 3.0.0

package/lib/cjs/components/Panels/RightPanel/RightPanel.js

@@ -1,6 +1,5 @@
 'use strict';
 
-require('core-js/modules/es.array.concat.js');
 require('core-js/modules/es.array.find.js');
 require('core-js/modules/es.array.from.js');
 require('core-js/modules/es.array.includes.js');
@@ -8,26 +7,23 @@ require('core-js/modules/es.array.map.js');
 require('core-js/modules/es.object.keys.js');
 require('core-js/modules/es.string.iterator.js');
 var React = require('react');
-var PropTypes = require('prop-types');
 var classNames = require('classnames');
 var Panel = require('../../Builder/Panel.js');
 var Section = require('../../Builder/Section.js');
 var reportSettings = require('../../../constants/reportSettings.js');
 var pageSettings = require('../../../constants/pageSettings.js');
-var builderContext = require('../../../utils/builderContext.js');
-var propContext = require('../../../utils/propContext.js');
+var BuilderContext = require('../../../contexts/BuilderContext.js');
+var PropContext = require('../../../contexts/PropContext.js');
 var functions = require('../../../utils/functions.js');
 var hooks = require('../../../utils/hooks.js');
 var itemTypes = require('../../../constants/itemTypes.js');
 var Tabs = require('../../Builder/Tabs.js');
 var Settings = require('./Settings.js');
 var RightPanelToggler = require('./RightPanelToggler.js');
-var string = require('../../../utils/string.js');
 var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
 
 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; }
@@ -37,127 +33,143 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 var exceptionalClasses = ['pageSettingSideBtn', 'paneClose', 'paneToggler', 'forZoom', 'jSheetContextMenu'];
 
-var RightPanel = function RightPanel(_ref) {
-  var itemAccessor = _ref.itemAccessor,
-      onItemChange = _ref.onItemChange,
-      onPageChange = _ref.onPageChange,
-      onSettingChange = _ref.onSettingChange,
-      pages = _ref.pages;
-
-  var _useBuilderContext = builderContext.useBuilderContext(),
-      activeTab = _useBuilderContext.activeTab,
-      editedElement = _useBuilderContext.editedElement,
-      isRightPanelOpen = _useBuilderContext.isRightPanelOpen,
-      isSlidesPanelOpen = _useBuilderContext.isSlidesPanelOpen,
-      setActiveElement = _useBuilderContext.setActiveElement,
-      setActiveTab = _useBuilderContext.setActiveTab,
-      setIsRightPanelOpen = _useBuilderContext.setIsRightPanelOpen;
-
-  var _usePropContext = propContext.usePropContext(),
-      acceptedItems = _usePropContext.acceptedItems,
-      layoutSettings = _usePropContext.settings;
-
+var RightPanel = function RightPanel() {
+  var activeTab = BuilderContext.useBuilderStore(function (state) {
+    return state.activeTab;
+  });
+  var editedElement = BuilderContext.useBuilderStore(function (state) {
+    return state.editedElement;
+  });
+  var isRightPanelOpen = BuilderContext.useBuilderStore(function (state) {
+    return state.isRightPanelOpen;
+  });
+  var isSlidesPanelOpen = BuilderContext.useBuilderStore(function (state) {
+    return state.isSlidesPanelOpen;
+  });
+  var setActiveElement = BuilderContext.useBuilderStore(function (state) {
+    return state.setActiveElement;
+  });
+  var setActiveTab = BuilderContext.useBuilderStore(function (state) {
+    return state.setActiveTab;
+  });
+  var setIsRightPanelOpen = BuilderContext.useBuilderStore(function (state) {
+    return state.setIsRightPanelOpen;
+  });
+  var acceptedItems = PropContext.usePropStore(function (state) {
+    return state.acceptedItems;
+  });
+  var layoutSettings = PropContext.usePropStore(function (state) {
+    return state.settings;
+  });
+  var onItemChange = PropContext.usePropStore(function (state) {
+    return state.onItemChange;
+  });
+  var onPageChange = PropContext.usePropStore(function (state) {
+    return state.onPageChange;
+  });
+  var onSettingChange = PropContext.usePropStore(function (state) {
+    return state.onSettingChange;
+  });
+  var pages = PropContext.usePropStore(function (state) {
+    return state.pages;
+  });
+  var itemAccessor = PropContext.usePropStore(function (state) {
+    return state.itemAccessor;
+  });
   var panelRef = React.useRef(null);
-
-  var _useTranslatedTexts = hooks.useTranslatedTexts(),
-      LAYOUT_SETTINGS = _useTranslatedTexts.LAYOUT_SETTINGS,
-      PAGE_SETTINGS = _useTranslatedTexts.PAGE_SETTINGS,
-      SETTINGS = _useTranslatedTexts.SETTINGS;
-
-  var settingMap = {
-    i_: {
-      details: function details(id) {
-        var item = functions.findItemById(id, pages);
-        return item;
+  var translatedTexts = hooks.useTranslatedTexts();
+  var settingMap = React.useMemo(function () {
+    return {
+      i_: {
+        details: function details(id) {
+          var item = functions.findItemById(id, pages);
+          return item;
+        },
+        settings: function settings(item) {
+          return acceptedItems[item.itemType];
+        },
+        title: function title(item) {
+          return translatedTexts["".concat((acceptedItems[item.itemType].title || item.itemType).toLocaleUpperCase(), "_SETTINGS")];
+        },
+        updater: onItemChange
       },
-      settings: function settings(item) {
-        return acceptedItems[item.itemType];
+      l_: {
+        details: function details() {
+          return _objectSpread(_objectSpread({}, layoutSettings), {}, {
+            id: itemTypes.REPORT_SETTINGS_ITEM_TYPE,
+            itemType: itemTypes.REPORT_SETTINGS_ITEM_TYPE
+          });
+        },
+        settings: function settings() {
+          return acceptedItems[itemTypes.REPORT_SETTINGS_ITEM_TYPE] || reportSettings['default'];
+        },
+        title: function title() {
+          return translatedTexts.LAYOUT_SETTINGS;
+        },
+        updater: onSettingChange
       },
-      title: function title(item) {
-        return "".concat(string.capitalize(acceptedItems[item.itemType].title || item.itemType), " ").concat(SETTINGS);
-      },
-      updater: onItemChange
-    },
-    l_: {
-      details: function details() {
-        return _objectSpread(_objectSpread({}, layoutSettings), {}, {
-          id: itemTypes.REPORT_SETTINGS_ITEM_TYPE,
-          itemType: itemTypes.REPORT_SETTINGS_ITEM_TYPE
-        });
-      },
-      settings: function settings() {
-        return acceptedItems[itemTypes.REPORT_SETTINGS_ITEM_TYPE] || reportSettings['default'];
-      },
-      title: function title() {
-        return LAYOUT_SETTINGS;
-      },
-      updater: onSettingChange
-    },
-    p_: {
-      details: function details(id) {
-        return _objectSpread(_objectSpread({
-          backgroundColor: layoutSettings.reportBackgroundColor
-        }, pages.find(function (page) {
-          return page.id === id;
-        })), {}, {
-          itemType: itemTypes.PAGE_SETTINGS_ITEM_TYPE
-        });
-      },
-      settings: function settings() {
-        var pageItem = acceptedItems[itemTypes.PAGE_SETTINGS_ITEM_TYPE] || pageSettings['default'];
-        return _objectSpread(_objectSpread({}, pageItem), {}, {
-          settings: pageItem.settings.map(function (setting) {
-            if (setting.key === 'pageLayer') {
-              return _objectSpread(_objectSpread({}, setting), {}, {
-                setActiveElement: setActiveElement,
-                updater: onItemChange
-              });
-            }
-
-            return setting;
-          }) || pageSettings['default'].settings
-        });
-      },
-      title: function title() {
-        return PAGE_SETTINGS;
-      },
-      updater: onPageChange
-    }
-  };
-  var editedEl;
-  var editedElId;
-  var selectedItem;
-  var element;
-  var updateFunc;
-  var title;
-
-  var panelConfig = function panelConfig() {
-    selectedItem = editedEl.details(editedElId);
-    element = editedEl.settings(selectedItem);
-    updateFunc = editedEl.updater;
-    title = editedEl.title(selectedItem);
-  };
-
-  var fallback = function fallback() {
-    setActiveElement(null);
-    editedEl = settingMap.l_;
-    editedElId = editedElement.substr(2);
-    panelConfig();
-  };
-
-  try {
-    editedEl = settingMap[editedElement.substr(0, 2)];
-    editedElId = editedElement.substr(2);
-    var checkSelectedItem = editedEl.details(editedElId);
-
-    if (Object.keys(checkSelectedItem).length === 0) {
-      fallback();
-    } else {
-      panelConfig();
+      p_: {
+        details: function details(id) {
+          return _objectSpread(_objectSpread({
+            backgroundColor: layoutSettings.reportBackgroundColor
+          }, pages.find(function (page) {
+            return page.id === id;
+          })), {}, {
+            itemType: itemTypes.PAGE_SETTINGS_ITEM_TYPE
+          });
+        },
+        settings: function settings() {
+          var pageItem = acceptedItems[itemTypes.PAGE_SETTINGS_ITEM_TYPE] || pageSettings['default'];
+          return _objectSpread(_objectSpread({}, pageItem), {}, {
+            settings: pageItem.settings.map(function (setting) {
+              if (setting.key === 'pageLayer') {
+                return _objectSpread(_objectSpread({}, setting), {}, {
+                  setActiveElement: setActiveElement,
+                  updater: onItemChange
+                });
+              }
+
+              return setting;
+            }) || pageSettings['default'].settings
+          });
+        },
+        title: function title() {
+          return translatedTexts.PAGE_SETTINGS;
+        },
+        updater: onPageChange
+      }
+    };
+  }, [acceptedItems, layoutSettings, onItemChange, onPageChange, onSettingChange, translatedTexts, pages, setActiveElement]);
+  var editedEl = React.useMemo(function () {
+    return settingMap[editedElement.substr(0, 2)] || settingMap.l_;
+  }, [editedElement, settingMap]);
+
+  var _useMemo = React.useMemo(function () {
+    var editedElId = editedElement.substr(2);
+
+    var _selectedItem = editedEl.details(editedElId);
+
+    if (!_selectedItem) {
+      var fallbackEditedEl = settingMap.l_;
+      return {
+        element: fallbackEditedEl.settings(),
+        selectedItem: fallbackEditedEl.details(),
+        title: fallbackEditedEl.title(),
+        updateFunc: fallbackEditedEl.updater
+      };
     }
-  } catch (e) {
-    fallback();
-  } // Tabs
+
+    return {
+      element: editedEl.settings(_selectedItem),
+      selectedItem: _selectedItem,
+      title: editedEl.title(_selectedItem),
+      updateFunc: editedEl.updater
+    };
+  }, [editedEl, editedElement, settingMap.l_]),
+      element = _useMemo.element,
+      selectedItem = _useMemo.selectedItem,
+      title = _useMemo.title,
+      updateFunc = _useMemo.updateFunc; // Tabs
 
 
   var tabsWithSettings = functions.getTabsWithSettings(element, selectedItem, itemAccessor);
@@ -169,14 +181,13 @@ var RightPanel = function RightPanel(_ref) {
       // This is due to conditionaly hiding tabs
       setActiveTab('right', 0);
     }
-  }, [activeTab, tabs]); // Panel className
+  }, [activeTab, tabs, tabsWithSettings, setActiveTab]); // Panel className
 
   var panelAdditionalClassName = classNames__default['default']('jfReport-settings forSettings f-height', {
     isIdle: !isRightPanelOpen,
     otherOpened: isSlidesPanelOpen
   });
-
-  var onClickOutsideForPanel = function onClickOutsideForPanel(e) {
+  var onClickOutsideForPanel = React.useCallback(function (e) {
     if (editedElement.substr(0, 2) === 'i_' || panelRef.current.contains(e.target) || panelRef.current.contains(document.activeElement) || Array.from(e.target.classList).some(function (xClass) {
       return exceptionalClasses.includes(xClass);
     }) || exceptionalClasses.some(function (xClass) {
@@ -187,14 +198,13 @@ var RightPanel = function RightPanel(_ref) {
 
     setIsRightPanelOpen(false);
     setActiveElement(null);
-  };
-
+  }, [editedElement, panelRef, setIsRightPanelOpen, setActiveElement]);
   React.useEffect(function () {
     if (isRightPanelOpen) window.addEventListener('click', onClickOutsideForPanel, false);
     return function () {
       window.removeEventListener('click', onClickOutsideForPanel, false);
     };
-  }, [isRightPanelOpen]);
+  }, [isRightPanelOpen, onClickOutsideForPanel]);
   return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
     children: /*#__PURE__*/jsxRuntime.jsxs(Panel, {
       ref: panelRef,
@@ -209,7 +219,6 @@ var RightPanel = function RightPanel(_ref) {
           }), /*#__PURE__*/jsxRuntime.jsx(Settings, {
             element: element,
             item: selectedItem,
-            itemAccessor: itemAccessor,
             onChange: updateFunc,
             settings: tabsWithSettings,
             tabs: tabs
@@ -220,20 +229,6 @@ var RightPanel = function RightPanel(_ref) {
   });
 };
 
-RightPanel.propTypes = {
-  itemAccessor: PropTypes__default['default'].func,
-  onItemChange: PropTypes__default['default'].func,
-  onPageChange: PropTypes__default['default'].func,
-  onSettingChange: PropTypes__default['default'].func,
-  pages: PropTypes__default['default'].arrayOf(PropTypes__default['default'].shape({}))
-};
-RightPanel.defaultProps = {
-  itemAccessor: function itemAccessor() {},
-  onItemChange: function onItemChange() {},
-  onPageChange: function onPageChange() {},
-  onSettingChange: function onSettingChange() {},
-  pages: []
-};
 var RightPanel$1 = /*#__PURE__*/React.memo(RightPanel);
 
 module.exports = RightPanel$1;

package/lib/cjs/components/Panels/RightPanel/RightPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"RightPanel.js","sources":["../../../../../src/components/Panels/RightPanel/RightPanel.js"],"sourcesContent":["import {\n  memo,\n  useEffect,\n  useRef,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport Panel from '../../Builder/Panel';\nimport Section from '../../Builder/Section';\nimport Layout from '../../../constants/reportSettings';\nimport Page from '../../../constants/pageSettings';\nimport { useBuilderContext } from '../../../utils/builderContext';\nimport { usePropContext } from '../../../utils/propContext';\nimport { findItemById, getTabsWithSettings } from '../../../utils/functions';\nimport { useTranslatedTexts } from '../../../utils/hooks';\nimport {\n  REPORT_SETTINGS_ITEM_TYPE, PAGE_SETTINGS_ITEM_TYPE,\n} from '../../../constants/itemTypes';\nimport Tabs from '../../Builder/Tabs';\nimport Settings from './Settings';\nimport RightPanelToggler from './RightPanelToggler';\nimport { capitalize } from '../../../utils/string';\n\nconst exceptionalClasses = [\n  'pageSettingSideBtn', 'paneClose', 'paneToggler', 'forZoom', 'jSheetContextMenu',\n];\n\nconst RightPanel = ({\n  itemAccessor,\n  onItemChange,\n  onPageChange,\n  onSettingChange,\n  pages,\n}) => {\n  const {\n    activeTab,\n    editedElement,\n    isRightPanelOpen,\n    isSlidesPanelOpen,\n    setActiveElement,\n    setActiveTab,\n    setIsRightPanelOpen,\n  } = useBuilderContext();\n  const { acceptedItems, settings: layoutSettings } = usePropContext();\n  const panelRef = useRef(null);\n  const { LAYOUT_SETTINGS, PAGE_SETTINGS, SETTINGS } = useTranslatedTexts();\n  const settingMap = {\n    i_: {\n      details: id => {\n        const item = findItemById(id, pages);\n        return item;\n      },\n      settings: item => {\n        return acceptedItems[item.itemType];\n      },\n      title: item => {\n        return `${capitalize(acceptedItems[item.itemType].title || item.itemType)} ${SETTINGS}`;\n      },\n      updater: onItemChange,\n    },\n    l_: {\n      details: () => {\n        return {\n          ...layoutSettings,\n          id: REPORT_SETTINGS_ITEM_TYPE,\n          itemType: REPORT_SETTINGS_ITEM_TYPE,\n        };\n      },\n      settings: () => {\n        return acceptedItems[REPORT_SETTINGS_ITEM_TYPE] || Layout;\n      },\n      title: () => LAYOUT_SETTINGS,\n      updater: onSettingChange,\n    },\n    p_: {\n      details: id => {\n        return {\n          backgroundColor: layoutSettings.reportBackgroundColor,\n          ...pages.find(page => page.id === id),\n          itemType: PAGE_SETTINGS_ITEM_TYPE,\n        };\n      },\n      settings: () => {\n        const pageItem = acceptedItems[PAGE_SETTINGS_ITEM_TYPE] || Page;\n        return {\n          ...pageItem,\n          settings: pageItem.settings.map(setting => {\n            if (setting.key === 'pageLayer') {\n              return { ...setting, setActiveElement, updater: onItemChange };\n            }\n            return setting;\n          }) || Page.settings,\n        };\n      },\n      title: () => PAGE_SETTINGS,\n      updater: onPageChange,\n    },\n  };\n\n  let editedEl;\n  let editedElId;\n  let selectedItem;\n  let element;\n  let updateFunc;\n  let title;\n\n  const panelConfig = () => {\n    selectedItem = editedEl.details(editedElId);\n    element = editedEl.settings(selectedItem);\n    updateFunc = editedEl.updater;\n    title = editedEl.title(selectedItem);\n  };\n\n  const fallback = () => {\n    setActiveElement(null);\n    editedEl = settingMap.l_;\n    editedElId = editedElement.substr(2);\n    panelConfig();\n  };\n\n  try {\n    editedEl = settingMap[editedElement.substr(0, 2)];\n    editedElId = editedElement.substr(2);\n    const checkSelectedItem = editedEl.details(editedElId);\n    if (Object.keys(checkSelectedItem).length === 0) {\n      fallback();\n    } else {\n      panelConfig();\n    }\n  } catch (e) {\n    fallback();\n  }\n\n  // Tabs\n  const tabsWithSettings = getTabsWithSettings(element, selectedItem, itemAccessor);\n  const tabs = Object.keys(tabsWithSettings);\n\n  useEffect(() => {\n    const currentTab = tabs[activeTab.right];\n    if (!tabsWithSettings[currentTab]) {\n      // This is due to conditionaly hiding tabs\n      setActiveTab('right', 0);\n    }\n  }, [activeTab, tabs]);\n\n  // Panel className\n  const panelAdditionalClassName = classNames(\n    'jfReport-settings forSettings f-height',\n    {\n      isIdle: !isRightPanelOpen,\n      otherOpened: isSlidesPanelOpen,\n    },\n  );\n\n  const onClickOutsideForPanel = e => {\n    if (editedElement.substr(0, 2) === 'i_'\n      || panelRef.current.contains(e.target)\n      || panelRef.current.contains(document.activeElement)\n      || Array.from(e.target.classList).some(xClass => exceptionalClasses.includes(xClass))\n      || exceptionalClasses.some(xClass => e.target.closest(`.${xClass}`))\n    ) {\n      return;\n    }\n    setIsRightPanelOpen(false);\n    setActiveElement(null);\n  };\n\n  useEffect(() => {\n    if (isRightPanelOpen) window.addEventListener('click', onClickOutsideForPanel, false);\n    return () => {\n      window.removeEventListener('click', onClickOutsideForPanel, false);\n    };\n  }, [isRightPanelOpen]);\n\n  return (\n    <>\n      <Panel\n        ref={panelRef}\n        additionalClassName={panelAdditionalClassName}\n      >\n        {isSlidesPanelOpen ? null : <RightPanelToggler />}\n        <div className=\"toolItemWrapper f-height d-flex dir-col\">\n          <Section title={title}>\n            <Tabs\n              panel=\"right\"\n              tabs={tabs}\n            />\n            <Settings\n              key={selectedItem.id}\n              element={element}\n              item={selectedItem}\n              itemAccessor={itemAccessor}\n              onChange={updateFunc}\n              settings={tabsWithSettings}\n              tabs={tabs}\n            />\n          </Section>\n        </div>\n      </Panel>\n    </>\n  );\n};\n\nRightPanel.propTypes = {\n  itemAccessor: PropTypes.func,\n  onItemChange: PropTypes.func,\n  onPageChange: PropTypes.func,\n  onSettingChange: PropTypes.func,\n  pages: PropTypes.arrayOf(\n    PropTypes.shape({}),\n  ),\n};\n\nRightPanel.defaultProps = {\n  itemAccessor: () => { },\n  onItemChange: () => { },\n  onPageChange: () => { },\n  onSettingChange: () => { },\n  pages: [],\n};\n\nexport default memo(RightPanel);\n"],"names":["exceptionalClasses","RightPanel","itemAccessor","onItemChange","onPageChange","onSettingChange","pages","useBuilderContext","activeTab","editedElement","isRightPanelOpen","isSlidesPanelOpen","setActiveElement","setActiveTab","setIsRightPanelOpen","usePropContext","acceptedItems","layoutSettings","settings","panelRef","useRef","useTranslatedTexts","LAYOUT_SETTINGS","PAGE_SETTINGS","SETTINGS","settingMap","i_","details","id","item","findItemById","itemType","title","capitalize","updater","l_","REPORT_SETTINGS_ITEM_TYPE","Layout","p_","backgroundColor","reportBackgroundColor","find","page","PAGE_SETTINGS_ITEM_TYPE","pageItem","Page","map","setting","key","editedEl","editedElId","selectedItem","element","updateFunc","panelConfig","fallback","substr","checkSelectedItem","Object","keys","length","e","tabsWithSettings","getTabsWithSettings","tabs","useEffect","currentTab","right","panelAdditionalClassName","classNames","isIdle","otherOpened","onClickOutsideForPanel","current","contains","target","document","activeElement","Array","from","classList","some","xClass","includes","closest","window","addEventListener","removeEventListener","_jsx","_jsxs","propTypes","PropTypes","func","arrayOf","shape","defaultProps","memo"],"mappings":"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"}
+{"version":3,"file":"RightPanel.js","sources":["../../../../../src/components/Panels/RightPanel/RightPanel.js"],"sourcesContent":["import {\n  memo,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n} from 'react';\nimport classNames from 'classnames';\nimport Panel from '../../Builder/Panel';\nimport Section from '../../Builder/Section';\nimport Layout from '../../../constants/reportSettings';\nimport Page from '../../../constants/pageSettings';\nimport { useBuilderStore } from '../../../contexts/BuilderContext';\nimport { usePropStore } from '../../../contexts/PropContext';\nimport { findItemById, getTabsWithSettings } from '../../../utils/functions';\nimport { useTranslatedTexts } from '../../../utils/hooks';\nimport {\n  REPORT_SETTINGS_ITEM_TYPE, PAGE_SETTINGS_ITEM_TYPE,\n} from '../../../constants/itemTypes';\nimport Tabs from '../../Builder/Tabs';\nimport Settings from './Settings';\nimport RightPanelToggler from './RightPanelToggler';\n\nconst exceptionalClasses = [\n  'pageSettingSideBtn', 'paneClose', 'paneToggler', 'forZoom', 'jSheetContextMenu',\n];\n\nconst RightPanel = () => {\n  const activeTab = useBuilderStore(state => state.activeTab);\n  const editedElement = useBuilderStore(state => state.editedElement);\n  const isRightPanelOpen = useBuilderStore(state => state.isRightPanelOpen);\n  const isSlidesPanelOpen = useBuilderStore(state => state.isSlidesPanelOpen);\n  const setActiveElement = useBuilderStore(state => state.setActiveElement);\n  const setActiveTab = useBuilderStore(state => state.setActiveTab);\n  const setIsRightPanelOpen = useBuilderStore(state => state.setIsRightPanelOpen);\n\n  const acceptedItems = usePropStore(state => state.acceptedItems);\n  const layoutSettings = usePropStore(state => state.settings);\n  const onItemChange = usePropStore(state => state.onItemChange);\n  const onPageChange = usePropStore(state => state.onPageChange);\n  const onSettingChange = usePropStore(state => state.onSettingChange);\n  const pages = usePropStore(state => state.pages);\n  const itemAccessor = usePropStore(state => state.itemAccessor);\n\n  const panelRef = useRef(null);\n  const translatedTexts = useTranslatedTexts();\n\n  const settingMap = useMemo(() => ({\n    i_: {\n      details: id => {\n        const item = findItemById(id, pages);\n        return item;\n      },\n      settings: item => {\n        return acceptedItems[item.itemType];\n      },\n      title: item => {\n        return translatedTexts[`${(acceptedItems[item.itemType].title || item.itemType).toLocaleUpperCase()}_SETTINGS`];\n      },\n      updater: onItemChange,\n    },\n    l_: {\n      details: () => {\n        return {\n          ...layoutSettings,\n          id: REPORT_SETTINGS_ITEM_TYPE,\n          itemType: REPORT_SETTINGS_ITEM_TYPE,\n        };\n      },\n      settings: () => {\n        return acceptedItems[REPORT_SETTINGS_ITEM_TYPE] || Layout;\n      },\n      title: () => translatedTexts.LAYOUT_SETTINGS,\n      updater: onSettingChange,\n    },\n    p_: {\n      details: id => {\n        return {\n          backgroundColor: layoutSettings.reportBackgroundColor,\n          ...pages.find(page => page.id === id),\n          itemType: PAGE_SETTINGS_ITEM_TYPE,\n        };\n      },\n      settings: () => {\n        const pageItem = acceptedItems[PAGE_SETTINGS_ITEM_TYPE] || Page;\n        return {\n          ...pageItem,\n          settings: pageItem.settings.map(setting => {\n            if (setting.key === 'pageLayer') {\n              return { ...setting, setActiveElement, updater: onItemChange };\n            }\n            return setting;\n          }) || Page.settings,\n        };\n      },\n      title: () => translatedTexts.PAGE_SETTINGS,\n      updater: onPageChange,\n    },\n  }), [\n    acceptedItems,\n    layoutSettings,\n    onItemChange,\n    onPageChange,\n    onSettingChange,\n    translatedTexts,\n    pages,\n    setActiveElement,\n  ]);\n\n  const editedEl = useMemo(() => {\n    return settingMap[editedElement.substr(0, 2)] || settingMap.l_;\n  }, [editedElement, settingMap]);\n\n  const {\n    element, selectedItem, title, updateFunc,\n  } = useMemo(() => {\n    const editedElId = editedElement.substr(2);\n    const _selectedItem = editedEl.details(editedElId);\n\n    if (!_selectedItem) {\n      const fallbackEditedEl = settingMap.l_;\n      return {\n        element: fallbackEditedEl.settings(),\n        selectedItem: fallbackEditedEl.details(),\n        title: fallbackEditedEl.title(),\n        updateFunc: fallbackEditedEl.updater,\n      };\n    }\n\n    return {\n      element: editedEl.settings(_selectedItem),\n      selectedItem: _selectedItem,\n      title: editedEl.title(_selectedItem),\n      updateFunc: editedEl.updater,\n    };\n  }, [editedEl, editedElement, settingMap.l_]);\n\n  // Tabs\n  const tabsWithSettings = getTabsWithSettings(element, selectedItem, itemAccessor);\n  const tabs = Object.keys(tabsWithSettings);\n\n  useEffect(() => {\n    const currentTab = tabs[activeTab.right];\n    if (!tabsWithSettings[currentTab]) {\n      // This is due to conditionaly hiding tabs\n      setActiveTab('right', 0);\n    }\n  }, [activeTab, tabs, tabsWithSettings, setActiveTab]);\n\n  // Panel className\n  const panelAdditionalClassName = classNames(\n    'jfReport-settings forSettings f-height',\n    {\n      isIdle: !isRightPanelOpen,\n      otherOpened: isSlidesPanelOpen,\n    },\n  );\n\n  const onClickOutsideForPanel = useCallback(e => {\n    if (editedElement.substr(0, 2) === 'i_'\n      || panelRef.current.contains(e.target)\n      || panelRef.current.contains(document.activeElement)\n      || Array.from(e.target.classList).some(xClass => exceptionalClasses.includes(xClass))\n      || exceptionalClasses.some(xClass => e.target.closest(`.${xClass}`))\n    ) {\n      return;\n    }\n    setIsRightPanelOpen(false);\n    setActiveElement(null);\n  }, [editedElement, panelRef, setIsRightPanelOpen, setActiveElement]);\n\n  useEffect(() => {\n    if (isRightPanelOpen) window.addEventListener('click', onClickOutsideForPanel, false);\n    return () => {\n      window.removeEventListener('click', onClickOutsideForPanel, false);\n    };\n  }, [isRightPanelOpen, onClickOutsideForPanel]);\n\n  return (\n    <>\n      <Panel\n        ref={panelRef}\n        additionalClassName={panelAdditionalClassName}\n      >\n        {isSlidesPanelOpen ? null : <RightPanelToggler />}\n        <div className=\"toolItemWrapper f-height d-flex dir-col\">\n          <Section title={title}>\n            <Tabs\n              panel=\"right\"\n              tabs={tabs}\n            />\n            <Settings\n              key={selectedItem.id}\n              element={element}\n              item={selectedItem}\n              onChange={updateFunc}\n              settings={tabsWithSettings}\n              tabs={tabs}\n            />\n          </Section>\n        </div>\n      </Panel>\n    </>\n  );\n};\n\nexport default memo(RightPanel);\n"],"names":["exceptionalClasses","RightPanel","activeTab","useBuilderStore","state","editedElement","isRightPanelOpen","isSlidesPanelOpen","setActiveElement","setActiveTab","setIsRightPanelOpen","acceptedItems","usePropStore","layoutSettings","settings","onItemChange","onPageChange","onSettingChange","pages","itemAccessor","panelRef","useRef","translatedTexts","useTranslatedTexts","settingMap","useMemo","i_","details","id","item","findItemById","itemType","title","toLocaleUpperCase","updater","l_","REPORT_SETTINGS_ITEM_TYPE","Layout","LAYOUT_SETTINGS","p_","backgroundColor","reportBackgroundColor","find","page","PAGE_SETTINGS_ITEM_TYPE","pageItem","Page","map","setting","key","PAGE_SETTINGS","editedEl","substr","editedElId","_selectedItem","fallbackEditedEl","element","selectedItem","updateFunc","tabsWithSettings","getTabsWithSettings","tabs","Object","keys","useEffect","currentTab","right","panelAdditionalClassName","classNames","isIdle","otherOpened","onClickOutsideForPanel","useCallback","e","current","contains","target","document","activeElement","Array","from","classList","some","xClass","includes","closest","window","addEventListener","removeEventListener","_jsx","_jsxs","memo"],"mappings":"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"}

package/lib/cjs/components/Panels/RightPanel/RightPanelToggler.js

@@ -1,16 +1,19 @@
 'use strict';
 
 var React = require('react');
-var builderContext = require('../../../utils/builderContext.js');
+var BuilderContext = require('../../../contexts/BuilderContext.js');
 var hooks = require('../../../utils/hooks.js');
 var jsxRuntime = require('react/jsx-runtime');
 var settings_toggle = require('../../../assets/svg/settings_toggle.svg.js');
 var close = require('../../../assets/svg/close.svg.js');
 
 var RightPanelToggler = function RightPanelToggler() {
-  var _useBuilderContext = builderContext.useBuilderContext(),
-      setActiveElement = _useBuilderContext.setActiveElement,
-      setIsRightPanelOpen = _useBuilderContext.setIsRightPanelOpen;
+  var setActiveElement = BuilderContext.useBuilderStore(function (state) {
+    return state.setActiveElement;
+  });
+  var setIsRightPanelOpen = BuilderContext.useBuilderStore(function (state) {
+    return state.setIsRightPanelOpen;
+  });
 
   var _useTranslatedTexts = hooks.useTranslatedTexts(),
       LAYOUT_SETTINGS = _useTranslatedTexts.LAYOUT_SETTINGS;

package/lib/cjs/components/Panels/RightPanel/RightPanelToggler.js.map

@@ -1 +1 @@
-{"version":3,"file":"RightPanelToggler.js","sources":["../../../../../src/components/Panels/RightPanel/RightPanelToggler.js"],"sourcesContent":["import { memo } from 'react';\nimport { useBuilderContext } from '../../../utils/builderContext';\nimport * as icons from '../../../utils/icons';\nimport { useTranslatedTexts } from '../../../utils/hooks';\n\nconst RightPanelToggler = () => {\n  const {\n    setActiveElement,\n    setIsRightPanelOpen,\n  } = useBuilderContext();\n  const { LAYOUT_SETTINGS } = useTranslatedTexts();\n\n  return (\n    <>\n      <button\n        className=\"paneToggler js-openRightPanel settingsToggle\"\n        onClick={() => {\n          setActiveElement(null);\n          setIsRightPanelOpen(true);\n        }}\n        title={LAYOUT_SETTINGS}\n        type=\"button\"\n      >\n        <icons.settingsToggle className=\"jfReportSVG isTick\" />\n      </button>\n      <button\n        className=\"paneClose p-absolute js-closeRightPanel\"\n        onClick={() => setIsRightPanelOpen(false)}\n        type=\"button\"\n      >\n        <icons.close className=\"jfReportSVG\" />\n      </button>\n    </>\n  );\n};\n\nexport default memo(RightPanelToggler);\n"],"names":["RightPanelToggler","useBuilderContext","setActiveElement","setIsRightPanelOpen","useTranslatedTexts","LAYOUT_SETTINGS","_jsxs","_jsx","icons.settingsToggle","icons.close","memo"],"mappings":";;;;;;;;;AAKA,IAAMA,iBAAiB,GAAG,SAApBA,iBAAoB,GAAM;AAC9B,2BAGIC,gCAAiB,EAHrB;AAAA,MACEC,gBADF,sBACEA,gBADF;AAAA,MAEEC,mBAFF,sBAEEA,mBAFF;;AAIA,4BAA4BC,wBAAkB,EAA9C;AAAA,MAAQC,eAAR,uBAAQA,eAAR;;AAEA,sBACEC;AAAA,4BACEC;AACE,MAAA,SAAS,EAAC,8CADZ;AAEE,MAAA,OAAO,EAAE,mBAAM;AACbL,QAAAA,gBAAgB,CAAC,IAAD,CAAhB;AACAC,QAAAA,mBAAmB,CAAC,IAAD,CAAnB;AACD,OALH;AAME,MAAA,KAAK,EAAEE,eANT;AAOE,MAAA,IAAI,EAAC,QAPP;AAAA,6BASEE,eAACC,eAAD;AAAsB,QAAA,SAAS,EAAC;AAAhC;AATF,MADF,eAYED;AACE,MAAA,SAAS,EAAC,yCADZ;AAEE,MAAA,OAAO,EAAE;AAAA,eAAMJ,mBAAmB,CAAC,KAAD,CAAzB;AAAA,OAFX;AAGE,MAAA,IAAI,EAAC,QAHP;AAAA,6BAKEI,eAACE,KAAD;AAAa,QAAA,SAAS,EAAC;AAAvB;AALF,MAZF;AAAA,IADF;AAsBD,CA7BD;;AA+BA,uCAAeC,UAAI,CAACV,iBAAD,CAAnB;;;;"}
+{"version":3,"file":"RightPanelToggler.js","sources":["../../../../../src/components/Panels/RightPanel/RightPanelToggler.js"],"sourcesContent":["import { memo } from 'react';\nimport { useBuilderStore } from '../../../contexts/BuilderContext';\nimport * as icons from '../../../utils/icons';\nimport { useTranslatedTexts } from '../../../utils/hooks';\n\nconst RightPanelToggler = () => {\n  const setActiveElement = useBuilderStore(state => state.setActiveElement);\n  const setIsRightPanelOpen = useBuilderStore(state => state.setIsRightPanelOpen);\n  const { LAYOUT_SETTINGS } = useTranslatedTexts();\n\n  return (\n    <>\n      <button\n        className=\"paneToggler js-openRightPanel settingsToggle\"\n        onClick={() => {\n          setActiveElement(null);\n          setIsRightPanelOpen(true);\n        }}\n        title={LAYOUT_SETTINGS}\n        type=\"button\"\n      >\n        <icons.settingsToggle className=\"jfReportSVG isTick\" />\n      </button>\n      <button\n        className=\"paneClose p-absolute js-closeRightPanel\"\n        onClick={() => setIsRightPanelOpen(false)}\n        type=\"button\"\n      >\n        <icons.close className=\"jfReportSVG\" />\n      </button>\n    </>\n  );\n};\n\nexport default memo(RightPanelToggler);\n"],"names":["RightPanelToggler","setActiveElement","useBuilderStore","state","setIsRightPanelOpen","useTranslatedTexts","LAYOUT_SETTINGS","_jsxs","_jsx","icons.settingsToggle","icons.close","memo"],"mappings":";;;;;;;;;AAKA,IAAMA,iBAAiB,GAAG,SAApBA,iBAAoB,GAAM;AAC9B,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;;AACA,4BAA4BC,wBAAkB,EAA9C;AAAA,MAAQC,eAAR,uBAAQA,eAAR;;AAEA,sBACEC;AAAA,4BACEC;AACE,MAAA,SAAS,EAAC,8CADZ;AAEE,MAAA,OAAO,EAAE,mBAAM;AACbP,QAAAA,gBAAgB,CAAC,IAAD,CAAhB;AACAG,QAAAA,mBAAmB,CAAC,IAAD,CAAnB;AACD,OALH;AAME,MAAA,KAAK,EAAEE,eANT;AAOE,MAAA,IAAI,EAAC,QAPP;AAAA,6BASEE,eAACC,eAAD;AAAsB,QAAA,SAAS,EAAC;AAAhC;AATF,MADF,eAYED;AACE,MAAA,SAAS,EAAC,yCADZ;AAEE,MAAA,OAAO,EAAE;AAAA,eAAMJ,mBAAmB,CAAC,KAAD,CAAzB;AAAA,OAFX;AAGE,MAAA,IAAI,EAAC,QAHP;AAAA,6BAKEI,eAACE,KAAD;AAAa,QAAA,SAAS,EAAC;AAAvB;AALF,MAZF;AAAA,IADF;AAsBD,CA3BD;;AA6BA,uCAAeC,UAAI,CAACX,iBAAD,CAAnB;;;;"}

package/lib/cjs/components/Panels/RightPanel/Settings.js

@@ -7,8 +7,8 @@ require('core-js/modules/es.regexp.to-string.js');
 var React = require('react');
 var PropTypes = require('prop-types');
 var classNames = require('classnames');
-var builderContext = require('../../../utils/builderContext.js');
-var propContext = require('../../../utils/propContext.js');
+var BuilderContext = require('../../../contexts/BuilderContext.js');
+var PropContext = require('../../../contexts/PropContext.js');
 var SettingsItemRenderer = require('../../Settings/SettingsItemRenderer.js');
 var functions = require('../../../utils/functions.js');
 var ErrorBoundary = require('../../ErrorBoundary.js');
@@ -26,19 +26,25 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 var Settings = function Settings(_ref) {
-  var element = _ref.element,
-      item = _ref.item,
-      itemAccessor = _ref.itemAccessor,
-      onChange = _ref.onChange,
-      settings = _ref.settings,
-      tabs = _ref.tabs;
-
-  var _useBuilderContext = builderContext.useBuilderContext(),
-      activeTab = _useBuilderContext.activeTab;
-
-  var _usePropContext = propContext.usePropContext(),
-      useExperimentalFeatures = _usePropContext.useExperimentalFeatures;
-
+  var _ref$element = _ref.element,
+      element = _ref$element === void 0 ? {} : _ref$element,
+      _ref$item = _ref.item,
+      item = _ref$item === void 0 ? {} : _ref$item,
+      _ref$onChange = _ref.onChange,
+      onChange = _ref$onChange === void 0 ? function () {} : _ref$onChange,
+      _ref$settings = _ref.settings,
+      settings = _ref$settings === void 0 ? {} : _ref$settings,
+      _ref$tabs = _ref.tabs,
+      tabs = _ref$tabs === void 0 ? [] : _ref$tabs;
+  var itemAccessor = PropContext.usePropStore(function (state) {
+    return state.itemAccessor;
+  });
+  var activeTab = BuilderContext.useBuilderStore(function (state) {
+    return state.activeTab;
+  });
+  var useExperimentalFeatures = PropContext.usePropStore(function (state) {
+    return state.useExperimentalFeatures;
+  });
   return tabs.map(function (tabKey, index) {
     return /*#__PURE__*/jsxRuntime.jsx("div", {
       className: classNames__default['default']('toolItem-tabContent', {
@@ -85,13 +91,6 @@ Settings.propTypes = {
   settings: PropTypes__default['default'].shape({}),
   tabs: PropTypes__default['default'].arrayOf(PropTypes__default['default'].string)
 };
-Settings.defaultProps = {
-  element: {},
-  item: {},
-  onChange: function onChange() {},
-  settings: {},
-  tabs: []
-};
 var Settings$1 = /*#__PURE__*/React.memo(Settings);
 
 module.exports = Settings$1;

package/lib/cjs/components/Panels/RightPanel/Settings.js.map

@@ -1 +1 @@
-{"version":3,"file":"Settings.js","sources":["../../../../../src/components/Panels/RightPanel/Settings.js"],"sourcesContent":["import { memo } from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { useBuilderContext } from '../../../utils/builderContext';\nimport { usePropContext } from '../../../utils/propContext';\nimport SettingsItemRenderer from '../../Settings/SettingsItemRenderer';\nimport { onChangeFunction } from '../../../utils/functions';\nimport ErrorBoundary from '../../ErrorBoundary';\n\nconst Settings = ({\n  element,\n  item,\n  itemAccessor,\n  onChange,\n  settings,\n  tabs,\n}) => {\n  const { activeTab } = useBuilderContext();\n  const { useExperimentalFeatures } = usePropContext();\n  return (tabs.map((tabKey, index) => {\n    return (\n      <div\n        key={index.toString()}\n        className={classNames(\n          'toolItem-tabContent',\n          { hidden: index !== activeTab.right },\n          { hasInnerScroll: tabKey === 'MY IMAGES' },\n        )}\n      >\n        {settings[tabKey].map((setting, itemIndex) => {\n          if (setting.experimental && !useExperimentalFeatures) {\n            return null;\n          }\n          const customUpdaterFunction = setting.onChange ? setting.onChange : false;\n          const defaultItem = element.defaultItem || {};\n          const value = (item[setting.key] || item[setting.key] === 0)\n            ? item[setting.key] : defaultItem[setting.key] || null;\n          const computedValue = setting.value ? setting.value(value, item, itemAccessor) : value;\n          const newItem = { ...defaultItem, ...item };\n          return (\n            <SettingsItemRenderer\n              key={`${itemIndex.toString()}_${item.id}_${setting.key}_${setting.uniqueId}`}\n              setting={setting}\n              settingValue={computedValue}\n            >\n              {SettingItem => {\n                return (\n                  <ErrorBoundary>\n                    <SettingItem\n                      config={setting}\n                      item={newItem}\n                      itemAccessor={itemAccessor}\n                      onItemChange={onChangeFunction(\n                        setting,\n                        onChange,\n                        newItem,\n                        customUpdaterFunction,\n                      )}\n                      value={computedValue}\n                    />\n                  </ErrorBoundary>\n                );\n              }}\n            </SettingsItemRenderer>\n          );\n        })}\n      </div>\n    );\n  }));\n};\n\nSettings.propTypes = {\n  element: PropTypes.shape({}),\n  item: PropTypes.shape({}),\n  onChange: PropTypes.func,\n  settings: PropTypes.shape({}),\n  tabs: PropTypes.arrayOf(PropTypes.string),\n};\n\nSettings.defaultProps = {\n  element: {},\n  item: {},\n  onChange: () => {},\n  settings: {},\n  tabs: [],\n};\n\nexport default memo(Settings);\n"],"names":["Settings","element","item","itemAccessor","onChange","settings","tabs","useBuilderContext","activeTab","usePropContext","useExperimentalFeatures","map","tabKey","index","_jsx","classNames","hidden","right","hasInnerScroll","setting","itemIndex","experimental","customUpdaterFunction","defaultItem","value","key","computedValue","newItem","SettingItem","onChangeFunction","toString","id","uniqueId","propTypes","PropTypes","shape","func","arrayOf","string","defaultProps","memo"],"mappings":"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"}
+{"version":3,"file":"Settings.js","sources":["../../../../../src/components/Panels/RightPanel/Settings.js"],"sourcesContent":["import { memo } from 'react';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { useBuilderStore } from '../../../contexts/BuilderContext';\nimport { usePropStore } from '../../../contexts/PropContext';\nimport SettingsItemRenderer from '../../Settings/SettingsItemRenderer';\nimport { onChangeFunction } from '../../../utils/functions';\nimport ErrorBoundary from '../../ErrorBoundary';\n\nconst Settings = ({\n  element = {},\n  item = {},\n  onChange = () => {},\n  settings = {},\n  tabs = [],\n}) => {\n  const itemAccessor = usePropStore(state => state.itemAccessor);\n  const activeTab = useBuilderStore(state => state.activeTab);\n  const useExperimentalFeatures = usePropStore(state => state.useExperimentalFeatures);\n\n  return (tabs.map((tabKey, index) => {\n    return (\n      <div\n        key={index.toString()}\n        className={classNames(\n          'toolItem-tabContent',\n          { hidden: index !== activeTab.right },\n          { hasInnerScroll: tabKey === 'MY IMAGES' },\n        )}\n      >\n        {settings[tabKey].map((setting, itemIndex) => {\n          if (setting.experimental && !useExperimentalFeatures) {\n            return null;\n          }\n          const customUpdaterFunction = setting.onChange ? setting.onChange : false;\n          const defaultItem = element.defaultItem || {};\n          const value = (item[setting.key] || item[setting.key] === 0)\n            ? item[setting.key] : defaultItem[setting.key] || null;\n          const computedValue = setting.value ? setting.value(value, item, itemAccessor) : value;\n          const newItem = { ...defaultItem, ...item };\n          return (\n            <SettingsItemRenderer\n              key={`${itemIndex.toString()}_${item.id}_${setting.key}_${setting.uniqueId}`}\n              setting={setting}\n              settingValue={computedValue}\n            >\n              {SettingItem => {\n                return (\n                  <ErrorBoundary>\n                    <SettingItem\n                      config={setting}\n                      item={newItem}\n                      itemAccessor={itemAccessor}\n                      onItemChange={onChangeFunction(\n                        setting,\n                        onChange,\n                        newItem,\n                        customUpdaterFunction,\n                      )}\n                      value={computedValue}\n                    />\n                  </ErrorBoundary>\n                );\n              }}\n            </SettingsItemRenderer>\n          );\n        })}\n      </div>\n    );\n  }));\n};\n\nSettings.propTypes = {\n  element: PropTypes.shape({}),\n  item: PropTypes.shape({}),\n  onChange: PropTypes.func,\n  settings: PropTypes.shape({}),\n  tabs: PropTypes.arrayOf(PropTypes.string),\n};\n\nexport default memo(Settings);\n"],"names":["Settings","element","item","onChange","settings","tabs","itemAccessor","usePropStore","state","activeTab","useBuilderStore","useExperimentalFeatures","map","tabKey","index","_jsx","classNames","hidden","right","hasInnerScroll","setting","itemIndex","experimental","customUpdaterFunction","defaultItem","value","key","computedValue","newItem","SettingItem","onChangeFunction","toString","id","uniqueId","propTypes","PropTypes","shape","func","arrayOf","string","memo"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,IAAMA,QAAQ,GAAG,SAAXA,QAAW,OAMX;AAAA,0BALJC,OAKI;AAAA,MALJA,OAKI,6BALM,EAKN;AAAA,uBAJJC,IAII;AAAA,MAJJA,IAII,0BAJG,EAIH;AAAA,2BAHJC,QAGI;AAAA,MAHJA,QAGI,8BAHO,YAAM,EAGb;AAAA,2BAFJC,QAEI;AAAA,MAFJA,QAEI,8BAFO,EAEP;AAAA,uBADJC,IACI;AAAA,MADJA,IACI,0BADG,EACH;AACJ,MAAMC,YAAY,GAAGC,wBAAY,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACF,YAAV;AAAA,GAAN,CAAjC;AACA,MAAMG,SAAS,GAAGC,8BAAe,CAAC,UAAAF,KAAK;AAAA,WAAIA,KAAK,CAACC,SAAV;AAAA,GAAN,CAAjC;AACA,MAAME,uBAAuB,GAAGJ,wBAAY,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACG,uBAAV;AAAA,GAAN,CAA5C;AAEA,SAAQN,IAAI,CAACO,GAAL,CAAS,UAACC,MAAD,EAASC,KAAT,EAAmB;AAClC,wBACEC;AAEE,MAAA,SAAS,EAAEC,8BAAU,CACnB,qBADmB,EAEnB;AAAEC,QAAAA,MAAM,EAAEH,KAAK,KAAKL,SAAS,CAACS;AAA9B,OAFmB,EAGnB;AAAEC,QAAAA,cAAc,EAAEN,MAAM,KAAK;AAA7B,OAHmB,CAFvB;AAAA,gBAQGT,QAAQ,CAACS,MAAD,CAAR,CAAiBD,GAAjB,CAAqB,UAACQ,OAAD,EAAUC,SAAV,EAAwB;AAC5C,YAAID,OAAO,CAACE,YAAR,IAAwB,CAACX,uBAA7B,EAAsD;AACpD,iBAAO,IAAP;AACD;;AACD,YAAMY,qBAAqB,GAAGH,OAAO,CAACjB,QAAR,GAAmBiB,OAAO,CAACjB,QAA3B,GAAsC,KAApE;AACA,YAAMqB,WAAW,GAAGvB,OAAO,CAACuB,WAAR,IAAuB,EAA3C;AACA,YAAMC,KAAK,GAAIvB,IAAI,CAACkB,OAAO,CAACM,GAAT,CAAJ,IAAqBxB,IAAI,CAACkB,OAAO,CAACM,GAAT,CAAJ,KAAsB,CAA5C,GACVxB,IAAI,CAACkB,OAAO,CAACM,GAAT,CADM,GACUF,WAAW,CAACJ,OAAO,CAACM,GAAT,CAAX,IAA4B,IADpD;AAEA,YAAMC,aAAa,GAAGP,OAAO,CAACK,KAAR,GAAgBL,OAAO,CAACK,KAAR,CAAcA,KAAd,EAAqBvB,IAArB,EAA2BI,YAA3B,CAAhB,GAA2DmB,KAAjF;;AACA,YAAMG,OAAO,mCAAQJ,WAAR,GAAwBtB,IAAxB,CAAb;;AACA,4BACEa,eAAC,oBAAD;AAEE,UAAA,OAAO,EAAEK,OAFX;AAGE,UAAA,YAAY,EAAEO,aAHhB;AAAA,oBAKG,kBAAAE,WAAW,EAAI;AACd,gCACEd,eAAC,aAAD;AAAA,qCACEA,eAAC,WAAD;AACE,gBAAA,MAAM,EAAEK,OADV;AAEE,gBAAA,IAAI,EAAEQ,OAFR;AAGE,gBAAA,YAAY,EAAEtB,YAHhB;AAIE,gBAAA,YAAY,EAAEwB,0BAAgB,CAC5BV,OAD4B,EAE5BjB,QAF4B,EAG5ByB,OAH4B,EAI5BL,qBAJ4B,CAJhC;AAUE,gBAAA,KAAK,EAAEI;AAVT;AADF,cADF;AAgBD;AAtBH,qBACUN,SAAS,CAACU,QAAV,EADV,cACkC7B,IAAI,CAAC8B,EADvC,cAC6CZ,OAAO,CAACM,GADrD,cAC4DN,OAAO,CAACa,QADpE,EADF;AA0BD,OApCA;AARH,OACOnB,KAAK,CAACiB,QAAN,EADP,CADF;AAgDD,GAjDO,CAAR;AAkDD,CA7DD;;AA+DA/B,QAAQ,CAACkC,SAAT,GAAqB;AACnBjC,EAAAA,OAAO,EAAEkC,6BAAS,CAACC,KAAV,CAAgB,EAAhB,CADU;AAEnBlC,EAAAA,IAAI,EAAEiC,6BAAS,CAACC,KAAV,CAAgB,EAAhB,CAFa;AAGnBjC,EAAAA,QAAQ,EAAEgC,6BAAS,CAACE,IAHD;AAInBjC,EAAAA,QAAQ,EAAE+B,6BAAS,CAACC,KAAV,CAAgB,EAAhB,CAJS;AAKnB/B,EAAAA,IAAI,EAAE8B,6BAAS,CAACG,OAAV,CAAkBH,6BAAS,CAACI,MAA5B;AALa,CAArB;AAQA,8BAAeC,UAAI,CAACxC,QAAD,CAAnB;;;;"}