@jotforminc/dnd-builder 3.1.1 → 3.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +17 -0
- package/index.d.ts +428 -0
- package/lib/cjs/components/AlignmentGuides.js +28 -18
- package/lib/cjs/components/AlignmentGuides.js.map +1 -1
- package/lib/cjs/components/Builder/ContextMenu.js +4 -1
- package/lib/cjs/components/Builder/ContextMenu.js.map +1 -1
- package/lib/cjs/components/Builder/DraggableLayer.js +1 -5
- package/lib/cjs/components/Builder/DraggableLayer.js.map +1 -1
- package/lib/cjs/components/Builder/Element.js +7 -4
- package/lib/cjs/components/Builder/Element.js.map +1 -1
- package/lib/cjs/components/Builder/Page.js +56 -62
- package/lib/cjs/components/Builder/Page.js.map +1 -1
- package/lib/cjs/components/Builder/Scene.js +30 -251
- package/lib/cjs/components/Builder/Scene.js.map +1 -1
- package/lib/cjs/components/Builder/SelectionBox.js +48 -0
- package/lib/cjs/components/Builder/SelectionBox.js.map +1 -0
- package/lib/cjs/components/DraggableItem/DraggableItem.js +78 -135
- package/lib/cjs/components/DraggableItem/DraggableItem.js.map +1 -1
- package/lib/cjs/components/DraggableItem/DraggableItemActions.js +69 -29
- package/lib/cjs/components/DraggableItem/DraggableItemActions.js.map +1 -1
- package/lib/cjs/components/DraggableItem/DraggableItemLayer.js +8 -8
- package/lib/cjs/components/DraggableItem/DraggableItemLayer.js.map +1 -1
- package/lib/cjs/components/PageItemResizer.js +37 -43
- package/lib/cjs/components/PageItemResizer.js.map +1 -1
- package/lib/cjs/components/Panels/AllSlidesPanel/AllSlidesPanel.js +1 -3
- package/lib/cjs/components/Panels/AllSlidesPanel/AllSlidesPanel.js.map +1 -1
- package/lib/cjs/components/Panels/AllSlidesPanel/PageList.js +0 -6
- package/lib/cjs/components/Panels/AllSlidesPanel/PageList.js.map +1 -1
- package/lib/cjs/components/Panels/LeftPanel/LeftPanel.js +1 -4
- package/lib/cjs/components/Panels/LeftPanel/LeftPanel.js.map +1 -1
- package/lib/cjs/components/Panels/LeftPanel/LeftPanelOpener.js +6 -7
- package/lib/cjs/components/Panels/LeftPanel/LeftPanelOpener.js.map +1 -1
- package/lib/cjs/components/Panels/RightPanel/RightPanel.js +7 -7
- package/lib/cjs/components/Panels/RightPanel/RightPanel.js.map +1 -1
- package/lib/cjs/components/Panels/RightPanel/RightPanelToggler.js +9 -10
- package/lib/cjs/components/Panels/RightPanel/RightPanelToggler.js.map +1 -1
- package/lib/cjs/components/Panels/SlidesPanel/SlidesPanel.js +1 -3
- package/lib/cjs/components/Panels/SlidesPanel/SlidesPanel.js.map +1 -1
- package/lib/cjs/components/Panels/SlidesPanel/SlidesPanelToggler.js +8 -6
- package/lib/cjs/components/Panels/SlidesPanel/SlidesPanelToggler.js.map +1 -1
- package/lib/cjs/components/ReportItemsWrapper.js +5 -11
- package/lib/cjs/components/ReportItemsWrapper.js.map +1 -1
- package/lib/cjs/components/Settings/PageLayer/LayerDragOverlay.js +2 -4
- package/lib/cjs/components/Settings/PageLayer/LayerDragOverlay.js.map +1 -1
- package/lib/cjs/components/Settings/PageLayer/LayerItem.js +12 -7
- package/lib/cjs/components/Settings/PageLayer/LayerItem.js.map +1 -1
- package/lib/cjs/components/Settings/PageLayer/PageLayer.js +2 -4
- package/lib/cjs/components/Settings/PageLayer/PageLayer.js.map +1 -1
- package/lib/cjs/components/TextEditor/CustomToolbar/CustomToolbarWrapper.js +3 -8
- package/lib/cjs/components/TextEditor/CustomToolbar/CustomToolbarWrapper.js.map +1 -1
- package/lib/cjs/constants/texts.js +0 -1
- package/lib/cjs/constants/texts.js.map +1 -1
- package/lib/cjs/contexts/BuilderContext.js +47 -23
- package/lib/cjs/contexts/BuilderContext.js.map +1 -1
- package/lib/cjs/styles/_jfReportsPages.scss +8 -1
- package/lib/cjs/utils/functions.js +124 -34
- package/lib/cjs/utils/functions.js.map +1 -1
- package/lib/cjs/utils/hooks.js +7 -7
- package/lib/cjs/utils/hooks.js.map +1 -1
- package/lib/cjs/utils/useKeyboardActions.js +263 -0
- package/lib/cjs/utils/useKeyboardActions.js.map +1 -0
- package/lib/cjs/utils/useMarqueeSelection.js +156 -0
- package/lib/cjs/utils/useMarqueeSelection.js.map +1 -0
- package/lib/esm/components/AlignmentGuides.js +28 -18
- package/lib/esm/components/AlignmentGuides.js.map +1 -1
- package/lib/esm/components/Builder/ContextMenu.js +4 -1
- package/lib/esm/components/Builder/ContextMenu.js.map +1 -1
- package/lib/esm/components/Builder/DraggableLayer.js +1 -5
- package/lib/esm/components/Builder/DraggableLayer.js.map +1 -1
- package/lib/esm/components/Builder/Element.js +7 -4
- package/lib/esm/components/Builder/Element.js.map +1 -1
- package/lib/esm/components/Builder/Page.js +58 -64
- package/lib/esm/components/Builder/Page.js.map +1 -1
- package/lib/esm/components/Builder/Scene.js +32 -253
- package/lib/esm/components/Builder/Scene.js.map +1 -1
- package/lib/esm/components/Builder/SelectionBox.js +42 -0
- package/lib/esm/components/Builder/SelectionBox.js.map +1 -0
- package/lib/esm/components/DraggableItem/DraggableItem.js +80 -137
- package/lib/esm/components/DraggableItem/DraggableItem.js.map +1 -1
- package/lib/esm/components/DraggableItem/DraggableItemActions.js +72 -28
- package/lib/esm/components/DraggableItem/DraggableItemActions.js.map +1 -1
- package/lib/esm/components/DraggableItem/DraggableItemLayer.js +9 -9
- package/lib/esm/components/DraggableItem/DraggableItemLayer.js.map +1 -1
- package/lib/esm/components/PageItemResizer.js +38 -44
- package/lib/esm/components/PageItemResizer.js.map +1 -1
- package/lib/esm/components/Panels/AllSlidesPanel/AllSlidesPanel.js +2 -4
- package/lib/esm/components/Panels/AllSlidesPanel/AllSlidesPanel.js.map +1 -1
- package/lib/esm/components/Panels/AllSlidesPanel/PageList.js +0 -6
- package/lib/esm/components/Panels/AllSlidesPanel/PageList.js.map +1 -1
- package/lib/esm/components/Panels/LeftPanel/LeftPanel.js +3 -6
- package/lib/esm/components/Panels/LeftPanel/LeftPanel.js.map +1 -1
- package/lib/esm/components/Panels/LeftPanel/LeftPanelOpener.js +6 -7
- package/lib/esm/components/Panels/LeftPanel/LeftPanelOpener.js.map +1 -1
- package/lib/esm/components/Panels/RightPanel/RightPanel.js +7 -7
- package/lib/esm/components/Panels/RightPanel/RightPanel.js.map +1 -1
- package/lib/esm/components/Panels/RightPanel/RightPanelToggler.js +9 -10
- package/lib/esm/components/Panels/RightPanel/RightPanelToggler.js.map +1 -1
- package/lib/esm/components/Panels/SlidesPanel/SlidesPanel.js +2 -4
- package/lib/esm/components/Panels/SlidesPanel/SlidesPanel.js.map +1 -1
- package/lib/esm/components/Panels/SlidesPanel/SlidesPanelToggler.js +8 -6
- package/lib/esm/components/Panels/SlidesPanel/SlidesPanelToggler.js.map +1 -1
- package/lib/esm/components/ReportItemsWrapper.js +5 -11
- package/lib/esm/components/ReportItemsWrapper.js.map +1 -1
- package/lib/esm/components/Settings/PageLayer/LayerDragOverlay.js +2 -4
- package/lib/esm/components/Settings/PageLayer/LayerDragOverlay.js.map +1 -1
- package/lib/esm/components/Settings/PageLayer/LayerItem.js +12 -7
- package/lib/esm/components/Settings/PageLayer/LayerItem.js.map +1 -1
- package/lib/esm/components/Settings/PageLayer/PageLayer.js +2 -4
- package/lib/esm/components/Settings/PageLayer/PageLayer.js.map +1 -1
- package/lib/esm/components/TextEditor/CustomToolbar/CustomToolbarWrapper.js +3 -8
- package/lib/esm/components/TextEditor/CustomToolbar/CustomToolbarWrapper.js.map +1 -1
- package/lib/esm/constants/texts.js +0 -1
- package/lib/esm/constants/texts.js.map +1 -1
- package/lib/esm/contexts/BuilderContext.js +47 -23
- package/lib/esm/contexts/BuilderContext.js.map +1 -1
- package/lib/esm/styles/_jfReportsPages.scss +8 -1
- package/lib/esm/utils/functions.js +121 -34
- package/lib/esm/utils/functions.js.map +1 -1
- package/lib/esm/utils/hooks.js +7 -7
- package/lib/esm/utils/hooks.js.map +1 -1
- package/lib/esm/utils/useKeyboardActions.js +261 -0
- package/lib/esm/utils/useKeyboardActions.js.map +1 -0
- package/lib/esm/utils/useMarqueeSelection.js +154 -0
- package/lib/esm/utils/useMarqueeSelection.js.map +1 -0
- package/package.json +11 -7
|
@@ -1 +1 @@
|
|
|
1
|
-
{"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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"}
|
|
1
|
+
{"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 resetActiveElements = useBuilderStore(state => state.resetActiveElements);\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 const textKey = `${(acceptedItems[item.itemType].title || item.itemType).toLocaleUpperCase()}_SETTINGS`;\n return translatedTexts[textKey] || acceptedItems[item.itemType].title;\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, 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 ]);\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 resetActiveElements();\n }, [editedElement, setIsRightPanelOpen, resetActiveElements]);\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","resetActiveElements","setActiveTab","setIsRightPanelOpen","acceptedItems","usePropStore","layoutSettings","settings","onItemChange","onPageChange","onSettingChange","pages","itemAccessor","panelRef","useRef","translatedTexts","useTranslatedTexts","settingMap","useMemo","i_","details","id","item","findItemById","itemType","title","textKey","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":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAuBA,IAAMA,kBAAkB,GAAG,CACzB,oBADyB,EACH,WADG,EACU,aADV,EACyB,SADzB,EACoC,mBADpC,CAA3B;;AAIA,IAAMC,UAAU,GAAG,SAAbA,UAAa,GAAM;AACvB,MAAMC,SAAS,GAAGC,eAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACF,SAAV;AAAA,GAAN,CAAjC;AACA,MAAMG,aAAa,GAAGF,eAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACC,aAAV;AAAA,GAAN,CAArC;AACA,MAAMC,gBAAgB,GAAGH,eAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACE,gBAAV;AAAA,GAAN,CAAxC;AACA,MAAMC,iBAAiB,GAAGJ,eAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACG,iBAAV;AAAA,GAAN,CAAzC;AACA,MAAMC,mBAAmB,GAAGL,eAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACI,mBAAV;AAAA,GAAN,CAA3C;AACA,MAAMC,YAAY,GAAGN,eAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACK,YAAV;AAAA,GAAN,CAApC;AACA,MAAMC,mBAAmB,GAAGP,eAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACM,mBAAV;AAAA,GAAN,CAA3C;AAEA,MAAMC,aAAa,GAAGC,YAAY,CAAC,UAAAR,KAAK;AAAA,WAAIA,KAAK,CAACO,aAAV;AAAA,GAAN,CAAlC;AACA,MAAME,cAAc,GAAGD,YAAY,CAAC,UAAAR,KAAK;AAAA,WAAIA,KAAK,CAACU,QAAV;AAAA,GAAN,CAAnC;AACA,MAAMC,YAAY,GAAGH,YAAY,CAAC,UAAAR,KAAK;AAAA,WAAIA,KAAK,CAACW,YAAV;AAAA,GAAN,CAAjC;AACA,MAAMC,YAAY,GAAGJ,YAAY,CAAC,UAAAR,KAAK;AAAA,WAAIA,KAAK,CAACY,YAAV;AAAA,GAAN,CAAjC;AACA,MAAMC,eAAe,GAAGL,YAAY,CAAC,UAAAR,KAAK;AAAA,WAAIA,KAAK,CAACa,eAAV;AAAA,GAAN,CAApC;AACA,MAAMC,KAAK,GAAGN,YAAY,CAAC,UAAAR,KAAK;AAAA,WAAIA,KAAK,CAACc,KAAV;AAAA,GAAN,CAA1B;AACA,MAAMC,YAAY,GAAGP,YAAY,CAAC,UAAAR,KAAK;AAAA,WAAIA,KAAK,CAACe,YAAV;AAAA,GAAN,CAAjC;AAEA,MAAMC,QAAQ,GAAGC,MAAM,CAAC,IAAD,CAAvB;AACA,MAAMC,eAAe,GAAGC,kBAAkB,EAA1C;AAEA,MAAMC,UAAU,GAAGC,OAAO,CAAC;AAAA,WAAO;AAChCC,MAAAA,EAAE,EAAE;AACFC,QAAAA,OAAO,EAAE,iBAAAC,EAAE,EAAI;AACb,cAAMC,IAAI,GAAGC,YAAY,CAACF,EAAD,EAAKV,KAAL,CAAzB;AACA,iBAAOW,IAAP;AACD,SAJC;AAKFf,QAAAA,QAAQ,EAAE,kBAAAe,IAAI,EAAI;AAChB,iBAAOlB,aAAa,CAACkB,IAAI,CAACE,QAAN,CAApB;AACD,SAPC;AAQFC,QAAAA,KAAK,EAAE,eAAAH,IAAI,EAAI;AACb,cAAMI,OAAO,aAAM,CAACtB,aAAa,CAACkB,IAAI,CAACE,QAAN,CAAb,CAA6BC,KAA7B,IAAsCH,IAAI,CAACE,QAA5C,EAAsDG,iBAAtD,EAAN,cAAb;AACA,iBAAOZ,eAAe,CAACW,OAAD,CAAf,IAA4BtB,aAAa,CAACkB,IAAI,CAACE,QAAN,CAAb,CAA6BC,KAAhE;AACD,SAXC;AAYFG,QAAAA,OAAO,EAAEpB;AAZP,OAD4B;AAehCqB,MAAAA,EAAE,EAAE;AACFT,QAAAA,OAAO,EAAE,mBAAM;AACb,iDACKd,cADL;AAEEe,YAAAA,EAAE,EAAES,yBAFN;AAGEN,YAAAA,QAAQ,EAAEM;AAHZ;AAKD,SAPC;AAQFvB,QAAAA,QAAQ,EAAE,oBAAM;AACd,iBAAOH,aAAa,CAAC0B,yBAAD,CAAb,IAA4CC,MAAnD;AACD,SAVC;AAWFN,QAAAA,KAAK,EAAE;AAAA,iBAAMV,eAAe,CAACiB,eAAtB;AAAA,SAXL;AAYFJ,QAAAA,OAAO,EAAElB;AAZP,OAf4B;AA6BhCuB,MAAAA,EAAE,EAAE;AACFb,QAAAA,OAAO,EAAE,iBAAAC,EAAE,EAAI;AACb;AACEa,YAAAA,eAAe,EAAE5B,cAAc,CAAC6B;AADlC,aAEKxB,KAAK,CAACyB,IAAN,CAAW,UAAAC,IAAI;AAAA,mBAAIA,IAAI,CAAChB,EAAL,KAAYA,EAAhB;AAAA,WAAf,CAFL;AAGEG,YAAAA,QAAQ,EAAEc;AAHZ;AAKD,SAPC;AAQF/B,QAAAA,QAAQ,EAAE,oBAAM;AACd,cAAMgC,QAAQ,GAAGnC,aAAa,CAACkC,uBAAD,CAAb,IAA0CE,IAA3D;AACA,iDACKD,QADL;AAEEhC,YAAAA,QAAQ,EAAEgC,QAAQ,CAAChC,QAAT,CAAkBkC,GAAlB,CAAsB,UAAAC,OAAO,EAAI;AACzC,kBAAIA,OAAO,CAACC,GAAR,KAAgB,WAApB,EAAiC;AAC/B,uDAAYD,OAAZ;AAAqBd,kBAAAA,OAAO,EAAEpB;AAA9B;AACD;;AACD,qBAAOkC,OAAP;AACD,aALS,KAKJF,IAAI,CAACjC;AAPb;AASD,SAnBC;AAoBFkB,QAAAA,KAAK,EAAE;AAAA,iBAAMV,eAAe,CAAC6B,aAAtB;AAAA,SApBL;AAqBFhB,QAAAA,OAAO,EAAEnB;AArBP;AA7B4B,KAAP;AAAA,GAAD,EAoDtB,CACFL,aADE,EAEFE,cAFE,EAGFE,YAHE,EAIFC,YAJE,EAKFC,eALE,EAMFK,eANE,EAOFJ,KAPE,CApDsB,CAA1B;AA8DA,MAAMkC,QAAQ,GAAG3B,OAAO,CAAC,YAAM;AAC7B,WAAOD,UAAU,CAACnB,aAAa,CAACgD,MAAd,CAAqB,CAArB,EAAwB,CAAxB,CAAD,CAAV,IAA0C7B,UAAU,CAACY,EAA5D;AACD,GAFuB,EAErB,CAAC/B,aAAD,EAAgBmB,UAAhB,CAFqB,CAAxB;;AAIA,iBAEIC,OAAO,CAAC,YAAM;AAChB,QAAM6B,UAAU,GAAGjD,aAAa,CAACgD,MAAd,CAAqB,CAArB,CAAnB;;AACA,QAAME,aAAa,GAAGH,QAAQ,CAACzB,OAAT,CAAiB2B,UAAjB,CAAtB;;AAEA,QAAI,CAACC,aAAL,EAAoB;AAClB,UAAMC,gBAAgB,GAAGhC,UAAU,CAACY,EAApC;AACA,aAAO;AACLqB,QAAAA,OAAO,EAAED,gBAAgB,CAAC1C,QAAjB,EADJ;AAEL4C,QAAAA,YAAY,EAAEF,gBAAgB,CAAC7B,OAAjB,EAFT;AAGLK,QAAAA,KAAK,EAAEwB,gBAAgB,CAACxB,KAAjB,EAHF;AAIL2B,QAAAA,UAAU,EAAEH,gBAAgB,CAACrB;AAJxB,OAAP;AAMD;;AAED,WAAO;AACLsB,MAAAA,OAAO,EAAEL,QAAQ,CAACtC,QAAT,CAAkByC,aAAlB,CADJ;AAELG,MAAAA,YAAY,EAAEH,aAFT;AAGLvB,MAAAA,KAAK,EAAEoB,QAAQ,CAACpB,KAAT,CAAeuB,aAAf,CAHF;AAILI,MAAAA,UAAU,EAAEP,QAAQ,CAACjB;AAJhB,KAAP;AAMD,GApBU,EAoBR,CAACiB,QAAD,EAAW/C,aAAX,EAA0BmB,UAAU,CAACY,EAArC,CApBQ,CAFX;AAAA,MACEqB,OADF,YACEA,OADF;AAAA,MACWC,YADX,YACWA,YADX;AAAA,MACyB1B,KADzB,YACyBA,KADzB;AAAA,MACgC2B,UADhC,YACgCA,UADhC,CAtFuB;;;AA+GvB,MAAMC,gBAAgB,GAAGC,mBAAmB,CAACJ,OAAD,EAAUC,YAAV,EAAwBvC,YAAxB,CAA5C;AACA,MAAM2C,IAAI,GAAGC,MAAM,CAACC,IAAP,CAAYJ,gBAAZ,CAAb;AAEAK,EAAAA,SAAS,CAAC,YAAM;AACd,QAAMC,UAAU,GAAGJ,IAAI,CAAC5D,SAAS,CAACiE,KAAX,CAAvB;;AACA,QAAI,CAACP,gBAAgB,CAACM,UAAD,CAArB,EAAmC;AACjC;AACAzD,MAAAA,YAAY,CAAC,OAAD,EAAU,CAAV,CAAZ;AACD;AACF,GANQ,EAMN,CAACP,SAAD,EAAY4D,IAAZ,EAAkBF,gBAAlB,EAAoCnD,YAApC,CANM,CAAT,CAlHuB;;AA2HvB,MAAM2D,wBAAwB,GAAGC,UAAU,CACzC,wCADyC,EAEzC;AACEC,IAAAA,MAAM,EAAE,CAAChE,gBADX;AAEEiE,IAAAA,WAAW,EAAEhE;AAFf,GAFyC,CAA3C;AAQA,MAAMiE,sBAAsB,GAAGC,WAAW,CAAC,UAAAC,CAAC,EAAI;AAC9C,QAAIrE,aAAa,CAACgD,MAAd,CAAqB,CAArB,EAAwB,CAAxB,MAA+B,IAA/B,IACCjC,QAAQ,CAACuD,OAAT,CAAiBC,QAAjB,CAA0BF,CAAC,CAACG,MAA5B,CADD,IAECzD,QAAQ,CAACuD,OAAT,CAAiBC,QAAjB,CAA0BE,QAAQ,CAACC,aAAnC,CAFD,IAGCC,KAAK,CAACC,IAAN,CAAWP,CAAC,CAACG,MAAF,CAASK,SAApB,EAA+BC,IAA/B,CAAoC,UAAAC,MAAM;AAAA,aAAIpF,kBAAkB,CAACqF,QAAnB,CAA4BD,MAA5B,CAAJ;AAAA,KAA1C,CAHD,IAICpF,kBAAkB,CAACmF,IAAnB,CAAwB,UAAAC,MAAM;AAAA,aAAIV,CAAC,CAACG,MAAF,CAASS,OAAT,YAAqBF,MAArB,EAAJ;AAAA,KAA9B,CAJL,EAKE;AACA;AACD;;AACD1E,IAAAA,mBAAmB,CAAC,KAAD,CAAnB;AACAF,IAAAA,mBAAmB;AACpB,GAXyC,EAWvC,CAACH,aAAD,EAAgBK,mBAAhB,EAAqCF,mBAArC,CAXuC,CAA1C;AAaAyD,EAAAA,SAAS,CAAC,YAAM;AACd,QAAI3D,gBAAJ,EAAsBiF,MAAM,CAACC,gBAAP,CAAwB,OAAxB,EAAiChB,sBAAjC,EAAyD,KAAzD;AACtB,WAAO,YAAM;AACXe,MAAAA,MAAM,CAACE,mBAAP,CAA2B,OAA3B,EAAoCjB,sBAApC,EAA4D,KAA5D;AACD,KAFD;AAGD,GALQ,EAKN,CAAClE,gBAAD,EAAmBkE,sBAAnB,CALM,CAAT;AAOA,sBACEkB;AAAA,2BACEC,KAAC,KAAD;AACE,MAAA,GAAG,EAAEvE,QADP;AAEE,MAAA,mBAAmB,EAAEgD,wBAFvB;AAAA,iBAIG7D,iBAAiB,GAAG,IAAH,gBAAUmF,IAAC,iBAAD,KAJ9B,eAKEA;AAAK,QAAA,SAAS,EAAC,yCAAf;AAAA,+BACEC,KAAC,OAAD;AAAS,UAAA,KAAK,EAAE3D,KAAhB;AAAA,kCACE0D,IAAC,IAAD;AACE,YAAA,KAAK,EAAC,OADR;AAEE,YAAA,IAAI,EAAE5B;AAFR,YADF,eAKE4B,IAAC,QAAD;AAEE,YAAA,OAAO,EAAEjC,OAFX;AAGE,YAAA,IAAI,EAAEC,YAHR;AAIE,YAAA,QAAQ,EAAEC,UAJZ;AAKE,YAAA,QAAQ,EAAEC,gBALZ;AAME,YAAA,IAAI,EAAEE;AANR,aACOJ,YAAY,CAAC9B,EADpB,CALF;AAAA;AADF,QALF;AAAA;AADF,IADF;AA0BD,CAjLD;;AAmLA,gCAAegE,IAAI,CAAC3F,UAAD,CAAnB;;;;"}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { memo } from 'react';
|
|
2
1
|
import { useBuilderStore } from '../../../contexts/BuilderContext.js';
|
|
3
2
|
import { useTranslatedTexts } from '../../../utils/hooks.js';
|
|
4
3
|
import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
|
|
@@ -6,8 +5,8 @@ import SvgSettingsToggle from '../../../assets/svg/settings_toggle.svg.js';
|
|
|
6
5
|
import SvgClose from '../../../assets/svg/close.svg.js';
|
|
7
6
|
|
|
8
7
|
var RightPanelToggler = function RightPanelToggler() {
|
|
9
|
-
var
|
|
10
|
-
return state.
|
|
8
|
+
var resetActiveElements = useBuilderStore(function (state) {
|
|
9
|
+
return state.resetActiveElements;
|
|
11
10
|
});
|
|
12
11
|
var setIsRightPanelOpen = useBuilderStore(function (state) {
|
|
13
12
|
return state.setIsRightPanelOpen;
|
|
@@ -16,13 +15,15 @@ var RightPanelToggler = function RightPanelToggler() {
|
|
|
16
15
|
var _useTranslatedTexts = useTranslatedTexts(),
|
|
17
16
|
LAYOUT_SETTINGS = _useTranslatedTexts.LAYOUT_SETTINGS;
|
|
18
17
|
|
|
18
|
+
var onOpenRightPanel = function onOpenRightPanel() {
|
|
19
|
+
resetActiveElements();
|
|
20
|
+
setIsRightPanelOpen(true);
|
|
21
|
+
};
|
|
22
|
+
|
|
19
23
|
return /*#__PURE__*/jsxs(Fragment, {
|
|
20
24
|
children: [/*#__PURE__*/jsx("button", {
|
|
21
25
|
className: "paneToggler js-openRightPanel settingsToggle",
|
|
22
|
-
onClick:
|
|
23
|
-
setActiveElement(null);
|
|
24
|
-
setIsRightPanelOpen(true);
|
|
25
|
-
},
|
|
26
|
+
onClick: onOpenRightPanel,
|
|
26
27
|
title: LAYOUT_SETTINGS,
|
|
27
28
|
type: "button",
|
|
28
29
|
children: /*#__PURE__*/jsx(SvgSettingsToggle, {
|
|
@@ -41,7 +42,5 @@ var RightPanelToggler = function RightPanelToggler() {
|
|
|
41
42
|
});
|
|
42
43
|
};
|
|
43
44
|
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
export default RightPanelToggler$1;
|
|
45
|
+
export default RightPanelToggler;
|
|
47
46
|
//# sourceMappingURL=RightPanelToggler.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RightPanelToggler.js","sources":["../../../../../src/components/Panels/RightPanel/RightPanelToggler.js"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"RightPanelToggler.js","sources":["../../../../../src/components/Panels/RightPanel/RightPanelToggler.js"],"sourcesContent":["import { useBuilderStore } from '../../../contexts/BuilderContext';\nimport * as icons from '../../../utils/icons';\nimport { useTranslatedTexts } from '../../../utils/hooks';\n\nconst RightPanelToggler = () => {\n const resetActiveElements = useBuilderStore(state => state.resetActiveElements);\n const setIsRightPanelOpen = useBuilderStore(state => state.setIsRightPanelOpen);\n const { LAYOUT_SETTINGS } = useTranslatedTexts();\n\n const onOpenRightPanel = () => {\n resetActiveElements();\n setIsRightPanelOpen(true);\n };\n\n return (\n <>\n <button\n className=\"paneToggler js-openRightPanel settingsToggle\"\n onClick={onOpenRightPanel}\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 RightPanelToggler;\n"],"names":["RightPanelToggler","resetActiveElements","useBuilderStore","state","setIsRightPanelOpen","useTranslatedTexts","LAYOUT_SETTINGS","onOpenRightPanel","_jsxs","_jsx","icons.settingsToggle","icons.close"],"mappings":";;;;;;IAIMA,iBAAiB,GAAG,SAApBA,iBAAoB,GAAM;AAC9B,MAAMC,mBAAmB,GAAGC,eAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACF,mBAAV;AAAA,GAAN,CAA3C;AACA,MAAMG,mBAAmB,GAAGF,eAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACC,mBAAV;AAAA,GAAN,CAA3C;;AACA,4BAA4BC,kBAAkB,EAA9C;AAAA,MAAQC,eAAR,uBAAQA,eAAR;;AAEA,MAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB,GAAM;AAC7BN,IAAAA,mBAAmB;AACnBG,IAAAA,mBAAmB,CAAC,IAAD,CAAnB;AACD,GAHD;;AAKA,sBACEI;AAAA,4BACEC;AACE,MAAA,SAAS,EAAC,8CADZ;AAEE,MAAA,OAAO,EAAEF,gBAFX;AAGE,MAAA,KAAK,EAAED,eAHT;AAIE,MAAA,IAAI,EAAC,QAJP;AAAA,6BAMEG,IAACC,iBAAD;AAAsB,QAAA,SAAS,EAAC;AAAhC;AANF,MADF,eASED;AACE,MAAA,SAAS,EAAC,yCADZ;AAEE,MAAA,OAAO,EAAE;AAAA,eAAML,mBAAmB,CAAC,KAAD,CAAzB;AAAA,OAFX;AAGE,MAAA,IAAI,EAAC,QAHP;AAAA,6BAKEK,IAACE,QAAD;AAAa,QAAA,SAAS,EAAC;AAAvB;AALF,MATF;AAAA,IADF;AAmBD;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { useState, useCallback } from 'react';
|
|
2
2
|
import classNames from 'classnames';
|
|
3
3
|
import Panel from '../../Builder/Panel.js';
|
|
4
4
|
import SortablePageList from './SortablePageList.js';
|
|
@@ -122,7 +122,5 @@ var SlidesPanel = function SlidesPanel() {
|
|
|
122
122
|
});
|
|
123
123
|
};
|
|
124
124
|
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
export default SlidesPanel$1;
|
|
125
|
+
export default SlidesPanel;
|
|
128
126
|
//# sourceMappingURL=SlidesPanel.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SlidesPanel.js","sources":["../../../../../src/components/Panels/SlidesPanel/SlidesPanel.js"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"SlidesPanel.js","sources":["../../../../../src/components/Panels/SlidesPanel/SlidesPanel.js"],"sourcesContent":["import { useCallback, useState } from 'react';\nimport classNames from 'classnames';\nimport Panel from '../../Builder/Panel';\nimport SortablePageList from './SortablePageList';\nimport Section from '../../Builder/Section';\nimport { useBuilderStore } from '../../../contexts/BuilderContext';\nimport { usePropStore } from '../../../contexts/PropContext';\nimport { arrayMove } from '../../../utils/functions';\nimport SlidesPanelToggler from './SlidesPanelToggler';\nimport ListWrapper from './ListWrapper';\nimport Button from '../../Settings/Button';\nimport { useClickOutsideListener, useTranslatedTexts } from '../../../utils/hooks';\n\nconst SlidesPanel = () => {\n const isRightPanelOpen = useBuilderStore(state => state.isRightPanelOpen);\n const setIsAllSlidesPanelOpen = useBuilderStore(state => state.setIsAllSlidesPanelOpen);\n const isSlidesPanelOpen = useBuilderStore(state => state.isSlidesPanelOpen);\n const setIsSlidesPanelOpen = useBuilderStore(state => state.setIsSlidesPanelOpen);\n\n const pages = usePropStore(state => state.pages);\n const onPageOrdersChange = usePropStore(state => state.onPageOrdersChange);\n const onAnEventTrigger = usePropStore(state => state.onAnEventTrigger);\n const useExperimentalFeatures = usePropStore(state => state.useExperimentalFeatures);\n\n const [animationEnd, setAnimationEnd] = useState(true);\n\n const pageGetter = useCallback(index => {\n return pages[index];\n }, [pages]);\n\n const onPageSort = useCallback(({ newIndex, oldIndex }) => {\n const newPageOrders = arrayMove(pages, oldIndex, newIndex).reduce((acc, page, index) => {\n acc[page.id] = { order: index + 1 };\n return acc;\n }, {});\n\n onPageOrdersChange(newPageOrders);\n onAnEventTrigger('sortPageFromSlides');\n }, [pages, onPageOrdersChange, onAnEventTrigger]);\n\n // Panel className\n const panelAdditionalClassName = classNames(\n 'jfReport-settings forSlides f-height',\n {\n isIdle: !isSlidesPanelOpen,\n otherOpened: isRightPanelOpen,\n },\n );\n\n const onClosePanel = () => {\n setAnimationEnd(false);\n setIsSlidesPanelOpen(false);\n };\n\n const onAnimationEnd = useCallback(() => {\n if (!isSlidesPanelOpen) {\n setAnimationEnd(true);\n }\n }, [isSlidesPanelOpen]);\n\n useClickOutsideListener(\n ['jfReport-canvas', 'jfReport-viewport', 'jfReport-pageInfo'],\n isSlidesPanelOpen,\n onClosePanel,\n );\n\n const { SLIDES } = useTranslatedTexts();\n\n return (\n <Panel\n additionalClassName={panelAdditionalClassName}\n onAnimationEnd={onAnimationEnd}\n >\n {isRightPanelOpen\n ? null\n : <SlidesPanelToggler onClosePanel={onClosePanel} />}\n {(isSlidesPanelOpen || (!isSlidesPanelOpen && !animationEnd)) && (\n <div className=\"toolItemWrapper f-height d-flex dir-col\">\n <Section\n additionalComponent={useExperimentalFeatures ? (\n <Button\n classNames=\"jfReportButton isAccent showAll\"\n icon=\"allSlides\"\n onClick={() => setIsAllSlidesPanelOpen(true)}\n title=\"Show All\"\n />\n ) : null}\n icon=\"slides\"\n title={SLIDES}\n >\n <div className=\"toolItem-tabContent hasInnerScroll\">\n <ListWrapper\n component={SortablePageList()}\n onSortEnd={onPageSort}\n pageGetter={pageGetter}\n />\n </div>\n </Section>\n </div>\n )}\n </Panel>\n );\n};\n\nexport default SlidesPanel;\n"],"names":["SlidesPanel","isRightPanelOpen","useBuilderStore","state","setIsAllSlidesPanelOpen","isSlidesPanelOpen","setIsSlidesPanelOpen","pages","usePropStore","onPageOrdersChange","onAnEventTrigger","useExperimentalFeatures","useState","animationEnd","setAnimationEnd","pageGetter","useCallback","index","onPageSort","newIndex","oldIndex","newPageOrders","arrayMove","reduce","acc","page","id","order","panelAdditionalClassName","classNames","isIdle","otherOpened","onClosePanel","onAnimationEnd","useClickOutsideListener","useTranslatedTexts","SLIDES","_jsxs","_jsx","SortablePageList"],"mappings":"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"}
|
|
@@ -8,8 +8,8 @@ import SvgClose from '../../../assets/svg/close.svg.js';
|
|
|
8
8
|
var SlidesPanelToggler = function SlidesPanelToggler(_ref) {
|
|
9
9
|
var _ref$onClosePanel = _ref.onClosePanel,
|
|
10
10
|
onClosePanel = _ref$onClosePanel === void 0 ? function () {} : _ref$onClosePanel;
|
|
11
|
-
var
|
|
12
|
-
return state.
|
|
11
|
+
var resetActiveElements = useBuilderStore(function (state) {
|
|
12
|
+
return state.resetActiveElements;
|
|
13
13
|
});
|
|
14
14
|
var setIsSlidesPanelOpen = useBuilderStore(function (state) {
|
|
15
15
|
return state.setIsSlidesPanelOpen;
|
|
@@ -18,13 +18,15 @@ var SlidesPanelToggler = function SlidesPanelToggler(_ref) {
|
|
|
18
18
|
var _useTranslatedTexts = useTranslatedTexts(),
|
|
19
19
|
SLIDES = _useTranslatedTexts.SLIDES;
|
|
20
20
|
|
|
21
|
+
var onOpenSlidesPanel = function onOpenSlidesPanel() {
|
|
22
|
+
resetActiveElements();
|
|
23
|
+
setIsSlidesPanelOpen(true);
|
|
24
|
+
};
|
|
25
|
+
|
|
21
26
|
return /*#__PURE__*/jsxs(Fragment, {
|
|
22
27
|
children: [/*#__PURE__*/jsx("button", {
|
|
23
28
|
className: "paneToggler settingsToggle",
|
|
24
|
-
onClick:
|
|
25
|
-
setActiveElement(null);
|
|
26
|
-
setIsSlidesPanelOpen(true);
|
|
27
|
-
},
|
|
29
|
+
onClick: onOpenSlidesPanel,
|
|
28
30
|
title: SLIDES,
|
|
29
31
|
type: "button",
|
|
30
32
|
children: /*#__PURE__*/jsx(SvgSlides, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SlidesPanelToggler.js","sources":["../../../../../src/components/Panels/SlidesPanel/SlidesPanelToggler.js"],"sourcesContent":["import PropTypes from 'prop-types';\nimport { useBuilderStore } from '../../../contexts/BuilderContext';\nimport * as icons from '../../../utils/icons';\nimport { useTranslatedTexts } from '../../../utils/hooks';\n\nconst SlidesPanelToggler = ({ onClosePanel = () => {} }) => {\n const
|
|
1
|
+
{"version":3,"file":"SlidesPanelToggler.js","sources":["../../../../../src/components/Panels/SlidesPanel/SlidesPanelToggler.js"],"sourcesContent":["import PropTypes from 'prop-types';\nimport { useBuilderStore } from '../../../contexts/BuilderContext';\nimport * as icons from '../../../utils/icons';\nimport { useTranslatedTexts } from '../../../utils/hooks';\n\nconst SlidesPanelToggler = ({ onClosePanel = () => {} }) => {\n const resetActiveElements = useBuilderStore(state => state.resetActiveElements);\n const setIsSlidesPanelOpen = useBuilderStore(state => state.setIsSlidesPanelOpen);\n const { SLIDES } = useTranslatedTexts();\n\n const onOpenSlidesPanel = () => {\n resetActiveElements();\n setIsSlidesPanelOpen(true);\n };\n\n return (\n <>\n <button\n className=\"paneToggler settingsToggle\"\n onClick={onOpenSlidesPanel}\n title={SLIDES}\n type=\"button\"\n >\n <icons.slides className=\"jfReportSVG isTick\" />\n </button>\n <button\n className=\"paneClose p-absolute\"\n onClick={onClosePanel}\n type=\"button\"\n >\n <icons.close className=\"jfReportSVG\" />\n </button>\n </>\n );\n};\n\nSlidesPanelToggler.propTypes = {\n onClosePanel: PropTypes.func,\n};\n\nexport default SlidesPanelToggler;\n"],"names":["SlidesPanelToggler","onClosePanel","resetActiveElements","useBuilderStore","state","setIsSlidesPanelOpen","useTranslatedTexts","SLIDES","onOpenSlidesPanel","_jsxs","_jsx","icons.slides","icons.close","propTypes","PropTypes","func"],"mappings":";;;;;;;IAKMA,kBAAkB,GAAG,SAArBA,kBAAqB,OAAiC;AAAA,+BAA9BC,YAA8B;AAAA,MAA9BA,YAA8B,kCAAf,YAAM,EAAS;AAC1D,MAAMC,mBAAmB,GAAGC,eAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACF,mBAAV;AAAA,GAAN,CAA3C;AACA,MAAMG,oBAAoB,GAAGF,eAAe,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACC,oBAAV;AAAA,GAAN,CAA5C;;AACA,4BAAmBC,kBAAkB,EAArC;AAAA,MAAQC,MAAR,uBAAQA,MAAR;;AAEA,MAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,GAAM;AAC9BN,IAAAA,mBAAmB;AACnBG,IAAAA,oBAAoB,CAAC,IAAD,CAApB;AACD,GAHD;;AAKA,sBACEI;AAAA,4BACEC;AACE,MAAA,SAAS,EAAC,4BADZ;AAEE,MAAA,OAAO,EAAEF,iBAFX;AAGE,MAAA,KAAK,EAAED,MAHT;AAIE,MAAA,IAAI,EAAC,QAJP;AAAA,6BAMEG,IAACC,SAAD;AAAc,QAAA,SAAS,EAAC;AAAxB;AANF,MADF,eASED;AACE,MAAA,SAAS,EAAC,sBADZ;AAEE,MAAA,OAAO,EAAET,YAFX;AAGE,MAAA,IAAI,EAAC,QAHP;AAAA,6BAKES,IAACE,QAAD;AAAa,QAAA,SAAS,EAAC;AAAvB;AALF,MATF;AAAA,IADF;AAmBD;;AAEDZ,kBAAkB,CAACa,SAAnB,GAA+B;AAC7BZ,EAAAA,YAAY,EAAEa,SAAS,CAACC;AADK,CAA/B;;;;"}
|
|
@@ -11,14 +11,12 @@ import { usePropStore } from '../contexts/PropContext.js';
|
|
|
11
11
|
import { jsx } from 'react/jsx-runtime';
|
|
12
12
|
|
|
13
13
|
var ReportItemsWrapper = function ReportItemsWrapper(_ref) {
|
|
14
|
-
var
|
|
15
|
-
handleMatches = _ref.handleMatches,
|
|
16
|
-
items = _ref.items;
|
|
14
|
+
var items = _ref.items;
|
|
17
15
|
var acceptedItems = usePropStore(function (state) {
|
|
18
16
|
return state.acceptedItems;
|
|
19
17
|
});
|
|
20
|
-
var
|
|
21
|
-
return state.
|
|
18
|
+
var activeElements = useBuilderStore(function (state) {
|
|
19
|
+
return state.activeElements;
|
|
22
20
|
});
|
|
23
21
|
var itemAccessor = usePropStore(function (state) {
|
|
24
22
|
return state.itemAccessor;
|
|
@@ -34,15 +32,13 @@ var ReportItemsWrapper = function ReportItemsWrapper(_ref) {
|
|
|
34
32
|
}).map(function (item) {
|
|
35
33
|
var mergedItem = getMergedItem(item, acceptedItems);
|
|
36
34
|
return /*#__PURE__*/jsx(DraggableItem, {
|
|
37
|
-
getIntersectionsFromMatches: getIntersectionsFromMatches,
|
|
38
|
-
handleMatches: handleMatches,
|
|
39
35
|
item: item,
|
|
40
36
|
children: /*#__PURE__*/jsx(ReportItemRenderer, {
|
|
41
37
|
item: mergedItem,
|
|
42
38
|
children: function children(ReportItem) {
|
|
43
39
|
return /*#__PURE__*/jsx(ReportItem, {
|
|
44
|
-
isMultipleItemSelected:
|
|
45
|
-
isSelected: isSelectedItem(item.id,
|
|
40
|
+
isMultipleItemSelected: activeElements.length > 1,
|
|
41
|
+
isSelected: isSelectedItem(item.id, activeElements),
|
|
46
42
|
item: mergedItem,
|
|
47
43
|
itemAccessor: itemAccessor,
|
|
48
44
|
onAnEventTrigger: onAnEventTrigger,
|
|
@@ -55,8 +51,6 @@ var ReportItemsWrapper = function ReportItemsWrapper(_ref) {
|
|
|
55
51
|
};
|
|
56
52
|
|
|
57
53
|
ReportItemsWrapper.propTypes = {
|
|
58
|
-
getIntersectionsFromMatches: PropTypes.func,
|
|
59
|
-
handleMatches: PropTypes.func,
|
|
60
54
|
items: PropTypes.arrayOf(PropTypes.shape({}))
|
|
61
55
|
};
|
|
62
56
|
var ReportItemsWrapper$1 = /*#__PURE__*/memo(ReportItemsWrapper);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReportItemsWrapper.js","sources":["../../../src/components/ReportItemsWrapper.js"],"sourcesContent":["import { memo } from 'react';\nimport PropTypes from 'prop-types';\nimport ReportItemRenderer from './Builder/ReportItemRenderer';\nimport DraggableItem from './DraggableItem/DraggableItem';\nimport getMergedItem from '../utils/getMergedItem';\nimport { useBuilderStore } from '../contexts/BuilderContext';\nimport { isSelectedItem } from '../utils/functions';\nimport { usePropStore } from '../contexts/PropContext';\n\nconst ReportItemsWrapper = ({\n
|
|
1
|
+
{"version":3,"file":"ReportItemsWrapper.js","sources":["../../../src/components/ReportItemsWrapper.js"],"sourcesContent":["import { memo } from 'react';\nimport PropTypes from 'prop-types';\nimport ReportItemRenderer from './Builder/ReportItemRenderer';\nimport DraggableItem from './DraggableItem/DraggableItem';\nimport getMergedItem from '../utils/getMergedItem';\nimport { useBuilderStore } from '../contexts/BuilderContext';\nimport { isSelectedItem } from '../utils/functions';\nimport { usePropStore } from '../contexts/PropContext';\n\nconst ReportItemsWrapper = ({\n items,\n}) => {\n const acceptedItems = usePropStore(state => state.acceptedItems);\n const activeElements = useBuilderStore(state => state.activeElements);\n const itemAccessor = usePropStore(state => state.itemAccessor);\n const onAnEventTrigger = usePropStore(state => state.onAnEventTrigger);\n const onItemChange = usePropStore(state => state.onItemChange);\n\n return items\n .filter(item => (\n item.isVisible !== undefined\n ? item.isVisible\n : true\n ))\n .map(item => {\n const mergedItem = getMergedItem(item, acceptedItems);\n return (\n <DraggableItem\n key={item.id}\n item={item}\n >\n <ReportItemRenderer\n item={mergedItem}\n >\n {ReportItem => (\n <ReportItem\n isMultipleItemSelected={activeElements.length > 1}\n isSelected={isSelectedItem(item.id, activeElements)}\n item={mergedItem}\n itemAccessor={itemAccessor}\n onAnEventTrigger={onAnEventTrigger}\n onItemChange={onItemChange}\n />\n )}\n </ReportItemRenderer>\n </DraggableItem>\n );\n });\n};\n\nReportItemsWrapper.propTypes = {\n items: PropTypes.arrayOf(\n PropTypes.shape({}),\n ),\n};\n\nexport default memo(ReportItemsWrapper);\n"],"names":["ReportItemsWrapper","items","acceptedItems","usePropStore","state","activeElements","useBuilderStore","itemAccessor","onAnEventTrigger","onItemChange","filter","item","isVisible","undefined","map","mergedItem","getMergedItem","_jsx","ReportItem","length","isSelectedItem","id","propTypes","PropTypes","arrayOf","shape","memo"],"mappings":";;;;;;;;;;;;AASA,IAAMA,kBAAkB,GAAG,SAArBA,kBAAqB,OAErB;AAAA,MADJC,KACI,QADJA,KACI;AACJ,MAAMC,aAAa,GAAGC,YAAY,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACF,aAAV;AAAA,GAAN,CAAlC;AACA,MAAMG,cAAc,GAAGC,eAAe,CAAC,UAAAF,KAAK;AAAA,WAAIA,KAAK,CAACC,cAAV;AAAA,GAAN,CAAtC;AACA,MAAME,YAAY,GAAGJ,YAAY,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACG,YAAV;AAAA,GAAN,CAAjC;AACA,MAAMC,gBAAgB,GAAGL,YAAY,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACI,gBAAV;AAAA,GAAN,CAArC;AACA,MAAMC,YAAY,GAAGN,YAAY,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACK,YAAV;AAAA,GAAN,CAAjC;AAEA,SAAOR,KAAK,CACTS,MADI,CACG,UAAAC,IAAI;AAAA,WACVA,IAAI,CAACC,SAAL,KAAmBC,SAAnB,GACIF,IAAI,CAACC,SADT,GAEI,IAHM;AAAA,GADP,EAMJE,GANI,CAMA,UAAAH,IAAI,EAAI;AACX,QAAMI,UAAU,GAAGC,aAAa,CAACL,IAAD,EAAOT,aAAP,CAAhC;AACA,wBACEe,IAAC,aAAD;AAEE,MAAA,IAAI,EAAEN,IAFR;AAAA,6BAIEM,IAAC,kBAAD;AACE,QAAA,IAAI,EAAEF,UADR;AAAA,kBAGG,kBAAAG,UAAU;AAAA,8BACTD,IAAC,UAAD;AACE,YAAA,sBAAsB,EAAEZ,cAAc,CAACc,MAAf,GAAwB,CADlD;AAEE,YAAA,UAAU,EAAEC,cAAc,CAACT,IAAI,CAACU,EAAN,EAAUhB,cAAV,CAF5B;AAGE,YAAA,IAAI,EAAEU,UAHR;AAIE,YAAA,YAAY,EAAER,YAJhB;AAKE,YAAA,gBAAgB,EAAEC,gBALpB;AAME,YAAA,YAAY,EAAEC;AANhB,YADS;AAAA;AAHb;AAJF,OACOE,IAAI,CAACU,EADZ,CADF;AAqBD,GA7BI,CAAP;AA8BD,CAvCD;;AAyCArB,kBAAkB,CAACsB,SAAnB,GAA+B;AAC7BrB,EAAAA,KAAK,EAAEsB,SAAS,CAACC,OAAV,CACLD,SAAS,CAACE,KAAV,CAAgB,EAAhB,CADK;AADsB,CAA/B;AAMA,wCAAeC,IAAI,CAAC1B,kBAAD,CAAnB;;;;"}
|
|
@@ -17,8 +17,7 @@ var DragHandle = function DragHandle() {
|
|
|
17
17
|
};
|
|
18
18
|
|
|
19
19
|
var LayerDragOverlay = function LayerDragOverlay(_ref) {
|
|
20
|
-
var
|
|
21
|
-
activeItemData = _ref$activeItemData === void 0 ? null : _ref$activeItemData;
|
|
20
|
+
var activeItemData = _ref.activeItemData;
|
|
22
21
|
|
|
23
22
|
var _useTranslatedTexts = useTranslatedTexts(),
|
|
24
23
|
CHART_ELEMENT = _useTranslatedTexts.CHART_ELEMENT,
|
|
@@ -27,7 +26,6 @@ var LayerDragOverlay = function LayerDragOverlay(_ref) {
|
|
|
27
26
|
PAGE_ELEMENT = _useTranslatedTexts.PAGE_ELEMENT,
|
|
28
27
|
RECTANGLE = _useTranslatedTexts.RECTANGLE;
|
|
29
28
|
|
|
30
|
-
if (!activeItemData) return null;
|
|
31
29
|
var Icon = activeItemData.icon,
|
|
32
30
|
item = activeItemData.item;
|
|
33
31
|
var id = item.id,
|
|
@@ -113,7 +111,7 @@ LayerDragOverlay.propTypes = {
|
|
|
113
111
|
isVisible: PropTypes.bool,
|
|
114
112
|
itemType: PropTypes.string
|
|
115
113
|
})
|
|
116
|
-
})
|
|
114
|
+
}).isRequired
|
|
117
115
|
};
|
|
118
116
|
var LayerDragOverlay$1 = /*#__PURE__*/memo(LayerDragOverlay);
|
|
119
117
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LayerDragOverlay.js","sources":["../../../../../src/components/Settings/PageLayer/LayerDragOverlay.js"],"sourcesContent":["import { memo } from 'react';\nimport { DragOverlay } from '@dnd-kit/core';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { capitalize, stripHTML } from '../../../utils/string';\nimport * as icons from '../../../utils/icons';\nimport { useTranslatedTexts } from '../../../utils/hooks';\n\nconst DragHandle = () => (\n <span className=\"jfReportSelectOption-drag\">\n <icons.drag className=\"jfReportSVG icon-drag\" />\n </span>\n);\n\nconst LayerDragOverlay = ({\n activeItemData
|
|
1
|
+
{"version":3,"file":"LayerDragOverlay.js","sources":["../../../../../src/components/Settings/PageLayer/LayerDragOverlay.js"],"sourcesContent":["import { memo } from 'react';\nimport { DragOverlay } from '@dnd-kit/core';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport { capitalize, stripHTML } from '../../../utils/string';\nimport * as icons from '../../../utils/icons';\nimport { useTranslatedTexts } from '../../../utils/hooks';\n\nconst DragHandle = () => (\n <span className=\"jfReportSelectOption-drag\">\n <icons.drag className=\"jfReportSVG icon-drag\" />\n </span>\n);\n\nconst LayerDragOverlay = ({\n activeItemData,\n}) => {\n const {\n CHART_ELEMENT,\n CLICK_TO_EDIT_TEXT,\n CLIK_TO_EDIT_HEADER,\n PAGE_ELEMENT,\n RECTANGLE,\n } = useTranslatedTexts();\n\n const { icon: Icon, item } = activeItemData;\n const { id, isVisible } = item;\n const isVisib = isVisible !== undefined ? isVisible : true;\n\n const itemText = passedItem => {\n if (passedItem.itemType === 'shapes') {\n return capitalize(passedItem.shapeType || RECTANGLE);\n }\n if (passedItem.itemType === 'chart') {\n return passedItem.text || CHART_ELEMENT;\n }\n if (passedItem.itemType === 'header') {\n return passedItem.headerText || CLIK_TO_EDIT_HEADER;\n }\n if (passedItem.itemType === 'text') {\n return passedItem.value ? stripHTML(passedItem.value) : CLICK_TO_EDIT_TEXT;\n }\n return capitalize(passedItem.itemType || PAGE_ELEMENT);\n };\n\n const content = (\n <div className=\"jfReportSelectOption\">\n <div className=\"jfReportSelectOption-icon\">\n <Icon />\n </div>\n <div className=\"jfReportSelectOption-text\">\n {itemText(item)}\n </div>\n </div>\n );\n\n return (\n <DragOverlay\n adjustScale={false}\n dropAnimation={null}\n style={{ cursor: 'grabbing' }}\n >\n <div\n className={classNames('jfReportSelectOption forHelper withDnd', {\n isSelected: isVisib,\n })}\n style={{ opacity: 0.9, transform: 'rotate(2deg)' }}\n >\n <div className=\"jfReportSelectOption-visibility\">\n <label\n className=\"jfReportChoice isLight hasNotText\"\n htmlFor={`overlay-${id}`}\n >\n <input\n checked={isVisib}\n className=\"jfReportChoice-input\"\n id={`overlay-${id}`}\n readOnly\n type=\"checkbox\"\n />\n <div className=\"jfReportChoice-labelIcon\">\n <div className=\"jfReportChoice-label checkbox\" />\n </div>\n </label>\n </div>\n <div className=\"jfReportSelectOption-name\">\n <DragHandle />\n {content}\n </div>\n </div>\n </DragOverlay>\n );\n};\n\nLayerDragOverlay.propTypes = {\n activeItemData: PropTypes.shape({\n icon: PropTypes.elementType,\n item: PropTypes.shape({\n id: PropTypes.string.isRequired,\n isVisible: PropTypes.bool,\n itemType: PropTypes.string,\n }),\n }).isRequired,\n};\n\nexport default memo(LayerDragOverlay);\n"],"names":["DragHandle","_jsx","icons.drag","LayerDragOverlay","activeItemData","useTranslatedTexts","CHART_ELEMENT","CLICK_TO_EDIT_TEXT","CLIK_TO_EDIT_HEADER","PAGE_ELEMENT","RECTANGLE","Icon","icon","item","id","isVisible","isVisib","undefined","itemText","passedItem","itemType","capitalize","shapeType","text","headerText","value","stripHTML","content","_jsxs","cursor","classNames","isSelected","opacity","transform","propTypes","PropTypes","shape","elementType","string","isRequired","bool","memo"],"mappings":"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"}
|
|
@@ -7,6 +7,7 @@ import classNames from 'classnames';
|
|
|
7
7
|
import PropTypes from 'prop-types';
|
|
8
8
|
import { capitalize, stripHTML } from '../../../utils/string.js';
|
|
9
9
|
import { useTranslatedTexts } from '../../../utils/hooks.js';
|
|
10
|
+
import { useBuilderStore } from '../../../contexts/BuilderContext.js';
|
|
10
11
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
11
12
|
import SvgDrag from '../../../assets/svg/settings/drag.svg.js';
|
|
12
13
|
|
|
@@ -30,8 +31,7 @@ var LayerItem = function LayerItem(_ref) {
|
|
|
30
31
|
itemId = _ref.id,
|
|
31
32
|
item = _ref.item,
|
|
32
33
|
onItemChange = _ref.onItemChange,
|
|
33
|
-
optionKey = _ref.optionKey
|
|
34
|
-
setActiveElement = _ref.setActiveElement;
|
|
34
|
+
optionKey = _ref.optionKey;
|
|
35
35
|
|
|
36
36
|
var _useSortable = useSortable({
|
|
37
37
|
id: itemId
|
|
@@ -43,6 +43,9 @@ var LayerItem = function LayerItem(_ref) {
|
|
|
43
43
|
transform = _useSortable.transform,
|
|
44
44
|
transition = _useSortable.transition;
|
|
45
45
|
|
|
46
|
+
var setActiveElements = useBuilderStore(function (state) {
|
|
47
|
+
return state.setActiveElements;
|
|
48
|
+
});
|
|
46
49
|
var dragStyle = useMemo(function () {
|
|
47
50
|
return {
|
|
48
51
|
opacity: isDragging ? 0.5 : 1,
|
|
@@ -88,6 +91,11 @@ var LayerItem = function LayerItem(_ref) {
|
|
|
88
91
|
|
|
89
92
|
return capitalize(item.itemType || PAGE_ELEMENT);
|
|
90
93
|
}, [item.itemType, item.shapeType, item.headerText, item.text, item.value, RECTANGLE, CHART_ELEMENT, CLIK_TO_EDIT_HEADER, CLICK_TO_EDIT_TEXT, PAGE_ELEMENT]);
|
|
94
|
+
|
|
95
|
+
var handleClick = function handleClick() {
|
|
96
|
+
setActiveElements(id, false);
|
|
97
|
+
};
|
|
98
|
+
|
|
91
99
|
var content = useMemo(function () {
|
|
92
100
|
return /*#__PURE__*/jsxs("div", {
|
|
93
101
|
className: "jfReportSelectOption",
|
|
@@ -105,9 +113,7 @@ var LayerItem = function LayerItem(_ref) {
|
|
|
105
113
|
className: classNames('jfReportSelectOption', {
|
|
106
114
|
isSelected: isVisib
|
|
107
115
|
}),
|
|
108
|
-
onClick:
|
|
109
|
-
return setActiveElement(id, false);
|
|
110
|
-
},
|
|
116
|
+
onClick: handleClick,
|
|
111
117
|
onKeyDown: function onKeyDown() {},
|
|
112
118
|
style: dragStyle
|
|
113
119
|
}, attributes), listeners), {}, {
|
|
@@ -151,8 +157,7 @@ LayerItem.propTypes = {
|
|
|
151
157
|
value: PropTypes.string
|
|
152
158
|
}),
|
|
153
159
|
onItemChange: PropTypes.func,
|
|
154
|
-
optionKey: PropTypes.string
|
|
155
|
-
setActiveElement: PropTypes.func
|
|
160
|
+
optionKey: PropTypes.string
|
|
156
161
|
};
|
|
157
162
|
var LayerItem$1 = /*#__PURE__*/memo(LayerItem);
|
|
158
163
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LayerItem.js","sources":["../../../../../src/components/Settings/PageLayer/LayerItem.js"],"sourcesContent":["import { memo, useCallback, useMemo } from 'react';\nimport { useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport classNames from 'classnames';\nimport PropTypes from 'prop-types';\nimport { capitalize, stripHTML } from '../../../utils/string';\nimport * as icons from '../../../utils/icons';\nimport { useTranslatedTexts } from '../../../utils/hooks';\n\nconst DragHandle = () => (\n <span className=\"jfReportSelectOption-drag\">\n <icons.drag className=\"jfReportSVG icon-drag\" />\n </span>\n);\n\nconst LayerItem = ({\n icon: Icon,\n id: itemId,\n item,\n onItemChange,\n optionKey,\n
|
|
1
|
+
{"version":3,"file":"LayerItem.js","sources":["../../../../../src/components/Settings/PageLayer/LayerItem.js"],"sourcesContent":["import { memo, useCallback, useMemo } from 'react';\nimport { useSortable } from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport classNames from 'classnames';\nimport PropTypes from 'prop-types';\nimport { capitalize, stripHTML } from '../../../utils/string';\nimport * as icons from '../../../utils/icons';\nimport { useTranslatedTexts } from '../../../utils/hooks';\nimport { useBuilderStore } from '../../../contexts/BuilderContext';\n\nconst DragHandle = () => (\n <span className=\"jfReportSelectOption-drag\">\n <icons.drag className=\"jfReportSVG icon-drag\" />\n </span>\n);\n\nconst LayerItem = ({\n icon: Icon,\n id: itemId,\n item,\n onItemChange,\n optionKey,\n}) => {\n const {\n attributes,\n isDragging,\n listeners,\n setNodeRef,\n transform,\n transition,\n } = useSortable({ id: itemId });\n\n const setActiveElements = useBuilderStore(state => state.setActiveElements);\n const dragStyle = useMemo(() => ({\n opacity: isDragging ? 0.5 : 1,\n transform: CSS.Transform.toString(transform),\n transition: transition,\n }), [transform, transition, isDragging]);\n\n const { id, isVisible } = item;\n const isVisib = isVisible !== undefined ? isVisible : true;\n\n const {\n CHART_ELEMENT,\n CLICK_TO_EDIT_TEXT,\n CLIK_TO_EDIT_HEADER,\n PAGE_ELEMENT,\n RECTANGLE,\n } = useTranslatedTexts();\n\n const handleItemLock = useCallback(({ target }) => {\n onItemChange({ id }, { isVisible: target.checked });\n }, [id, onItemChange]);\n\n const itemText = useMemo(() => {\n if (item.itemType === 'shapes') {\n return capitalize(item.shapeType || RECTANGLE);\n }\n if (item.itemType === 'chart') {\n return item.text || CHART_ELEMENT;\n }\n if (item.itemType === 'header') {\n return item.headerText || CLIK_TO_EDIT_HEADER;\n }\n if (item.itemType === 'text') {\n return item.value ? stripHTML(item.value) : CLICK_TO_EDIT_TEXT;\n }\n return capitalize(item.itemType || PAGE_ELEMENT);\n }, [\n item.itemType,\n item.shapeType,\n item.headerText,\n item.text,\n item.value,\n RECTANGLE,\n CHART_ELEMENT,\n CLIK_TO_EDIT_HEADER,\n CLICK_TO_EDIT_TEXT,\n PAGE_ELEMENT,\n ]);\n\n const handleClick = () => {\n setActiveElements(id, false);\n };\n\n const content = useMemo(() => (\n <div className=\"jfReportSelectOption\">\n <div className=\"jfReportSelectOption-icon\">\n <Icon />\n </div>\n <div className=\"jfReportSelectOption-text\">\n {itemText}\n </div>\n </div>\n ), [itemText]);\n\n return (\n <div\n ref={setNodeRef}\n className={classNames('jfReportSelectOption', {\n isSelected: isVisib,\n })}\n onClick={handleClick}\n onKeyDown={() => {}}\n style={dragStyle}\n {...attributes}\n {...listeners}\n >\n <div className=\"jfReportSelectOption-visibility\">\n <label\n className=\"jfReportChoice isLight hasNotText\"\n htmlFor={optionKey}\n >\n <input\n checked={isVisib}\n className=\"jfReportChoice-input\"\n data-option-key={optionKey}\n id={optionKey}\n onChange={handleItemLock}\n type=\"checkbox\"\n />\n <div className=\"jfReportChoice-labelIcon\">\n <div className=\"jfReportChoice-label checkbox\" />\n </div>\n </label>\n </div>\n <div\n className=\"jfReportSelectOption-name\"\n // style={{ backgroundColor: option.color }}\n >\n <DragHandle />\n {content}\n </div>\n </div>\n );\n};\n\nLayerItem.propTypes = {\n icon: PropTypes.elementType,\n id: PropTypes.string,\n item: PropTypes.shape({\n headerText: PropTypes.string,\n id: PropTypes.string,\n isVisible: PropTypes.bool,\n itemType: PropTypes.string,\n shapeType: PropTypes.string,\n text: PropTypes.string,\n value: PropTypes.string,\n }),\n onItemChange: PropTypes.func,\n optionKey: PropTypes.string,\n};\n\nexport default memo(LayerItem);\n"],"names":["DragHandle","_jsx","icons.drag","LayerItem","Icon","icon","itemId","id","item","onItemChange","optionKey","useSortable","attributes","isDragging","listeners","setNodeRef","transform","transition","setActiveElements","useBuilderStore","state","dragStyle","useMemo","opacity","CSS","Transform","toString","isVisible","isVisib","undefined","useTranslatedTexts","CHART_ELEMENT","CLICK_TO_EDIT_TEXT","CLIK_TO_EDIT_HEADER","PAGE_ELEMENT","RECTANGLE","handleItemLock","useCallback","target","checked","itemText","itemType","capitalize","shapeType","text","headerText","value","stripHTML","handleClick","content","_jsxs","classNames","isSelected","propTypes","PropTypes","elementType","string","shape","bool","func","memo"],"mappings":"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"}
|
|
@@ -127,12 +127,11 @@ var PageLayer = function PageLayer(_ref) {
|
|
|
127
127
|
index: index,
|
|
128
128
|
item: item,
|
|
129
129
|
onItemChange: config.updater,
|
|
130
|
-
optionKey: index
|
|
131
|
-
setActiveElement: config.setActiveElement
|
|
130
|
+
optionKey: index
|
|
132
131
|
}, item.id);
|
|
133
132
|
})
|
|
134
133
|
})
|
|
135
|
-
}), /*#__PURE__*/jsx(LayerDragOverlay, {
|
|
134
|
+
}), activeItemData && /*#__PURE__*/jsx(LayerDragOverlay, {
|
|
136
135
|
activeItemData: activeItemData
|
|
137
136
|
})]
|
|
138
137
|
}) : /*#__PURE__*/jsx("div", {
|
|
@@ -143,7 +142,6 @@ var PageLayer = function PageLayer(_ref) {
|
|
|
143
142
|
|
|
144
143
|
PageLayer.propTypes = {
|
|
145
144
|
config: PropTypes.shape({
|
|
146
|
-
setActiveElement: PropTypes.func,
|
|
147
145
|
updater: PropTypes.func
|
|
148
146
|
}),
|
|
149
147
|
item: PropTypes.shape({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageLayer.js","sources":["../../../../../src/components/Settings/PageLayer/PageLayer.js"],"sourcesContent":["import { useCallback, useMemo, useState } from 'react';\nimport PropTypes from 'prop-types';\nimport {\n DndContext, closestCenter, KeyboardSensor, PointerSensor, useSensor, useSensors,\n} from '@dnd-kit/core';\nimport { SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable';\nimport { arrayMove } from '../../../utils/functions';\nimport LayerItem from './LayerItem';\nimport LayerDragOverlay from './LayerDragOverlay';\nimport { elementIcons } from '../../../constants/elementIcons';\nimport { useTranslatedTexts } from '../../../utils/hooks';\n\nconst PageLayer = ({\n config = {},\n item: page = {},\n onItemChange = () => {},\n}) => {\n const [activeId, setActiveId] = useState(null);\n\n const sensors = useSensors(\n useSensor(PointerSensor, {\n activationConstraint: {\n distance: 0,\n },\n }),\n useSensor(KeyboardSensor),\n );\n\n const handleDragStart = useCallback(event => {\n setActiveId(event.active.id);\n }, []);\n\n const handleDragEnd = useCallback(event => {\n const { active, over } = event;\n setActiveId(null);\n\n if (over && active.id !== over.id) {\n const reversedItems = [...page.items].reverse();\n const oldIndex = reversedItems.findIndex(item => item.id === active.id);\n const newIndex = reversedItems.findIndex(item => item.id === over.id);\n\n if (oldIndex !== -1 && newIndex !== -1) {\n const newItems = arrayMove(reversedItems, oldIndex, newIndex).map(i => i.id);\n onItemChange({\n id: page.id,\n }, { items: JSON.stringify([...newItems].reverse()) });\n }\n }\n }, [page.id, page.items, onItemChange]);\n\n const handleDragCancel = useCallback(() => {\n setActiveId(null);\n }, []);\n\n const { NO_ELEMENT_IN_PAGE } = useTranslatedTexts();\n\n const items = useMemo(() => {\n if (!page.items || page.items.length === 0) return [];\n return [...page.items].reverse().map(item => item.id);\n }, [page.items]);\n\n const activeItemData = useMemo(() => {\n if (!activeId || !page.items) return null;\n\n const reversedItems = [...page.items].reverse();\n const activeItem = reversedItems.find(item => item.id === activeId);\n if (!activeItem) return null;\n\n const icon = elementIcons[activeItem.itemType]\n ? elementIcons[activeItem.itemType]\n : elementIcons.default;\n\n return {\n icon,\n item: activeItem,\n };\n }, [activeId, page.items]);\n\n return (\n page.items && page.items.length > 0 ? (\n <DndContext\n collisionDetection={closestCenter}\n onDragCancel={handleDragCancel}\n onDragEnd={handleDragEnd}\n onDragStart={handleDragStart}\n sensors={sensors}\n >\n <SortableContext\n items={items}\n strategy={verticalListSortingStrategy}\n >\n <ul className=\"jfReportSelectOption-list withDnd forPageLayer\">\n {[...page.items].reverse().map((item, index) => {\n const icon = elementIcons[item.itemType]\n ? elementIcons[item.itemType]\n : elementIcons.default;\n return (\n <LayerItem\n key={item.id}\n icon={icon}\n id={item.id}\n index={index}\n item={item}\n onItemChange={config.updater}\n optionKey={index}\n
|
|
1
|
+
{"version":3,"file":"PageLayer.js","sources":["../../../../../src/components/Settings/PageLayer/PageLayer.js"],"sourcesContent":["import { useCallback, useMemo, useState } from 'react';\nimport PropTypes from 'prop-types';\nimport {\n DndContext, closestCenter, KeyboardSensor, PointerSensor, useSensor, useSensors,\n} from '@dnd-kit/core';\nimport { SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable';\nimport { arrayMove } from '../../../utils/functions';\nimport LayerItem from './LayerItem';\nimport LayerDragOverlay from './LayerDragOverlay';\nimport { elementIcons } from '../../../constants/elementIcons';\nimport { useTranslatedTexts } from '../../../utils/hooks';\n\nconst PageLayer = ({\n config = {},\n item: page = {},\n onItemChange = () => {},\n}) => {\n const [activeId, setActiveId] = useState(null);\n\n const sensors = useSensors(\n useSensor(PointerSensor, {\n activationConstraint: {\n distance: 0,\n },\n }),\n useSensor(KeyboardSensor),\n );\n\n const handleDragStart = useCallback(event => {\n setActiveId(event.active.id);\n }, []);\n\n const handleDragEnd = useCallback(event => {\n const { active, over } = event;\n setActiveId(null);\n\n if (over && active.id !== over.id) {\n const reversedItems = [...page.items].reverse();\n const oldIndex = reversedItems.findIndex(item => item.id === active.id);\n const newIndex = reversedItems.findIndex(item => item.id === over.id);\n\n if (oldIndex !== -1 && newIndex !== -1) {\n const newItems = arrayMove(reversedItems, oldIndex, newIndex).map(i => i.id);\n onItemChange({\n id: page.id,\n }, { items: JSON.stringify([...newItems].reverse()) });\n }\n }\n }, [page.id, page.items, onItemChange]);\n\n const handleDragCancel = useCallback(() => {\n setActiveId(null);\n }, []);\n\n const { NO_ELEMENT_IN_PAGE } = useTranslatedTexts();\n\n const items = useMemo(() => {\n if (!page.items || page.items.length === 0) return [];\n return [...page.items].reverse().map(item => item.id);\n }, [page.items]);\n\n const activeItemData = useMemo(() => {\n if (!activeId || !page.items) return null;\n\n const reversedItems = [...page.items].reverse();\n const activeItem = reversedItems.find(item => item.id === activeId);\n if (!activeItem) return null;\n\n const icon = elementIcons[activeItem.itemType]\n ? elementIcons[activeItem.itemType]\n : elementIcons.default;\n\n return {\n icon,\n item: activeItem,\n };\n }, [activeId, page.items]);\n\n return (\n page.items && page.items.length > 0 ? (\n <DndContext\n collisionDetection={closestCenter}\n onDragCancel={handleDragCancel}\n onDragEnd={handleDragEnd}\n onDragStart={handleDragStart}\n sensors={sensors}\n >\n <SortableContext\n items={items}\n strategy={verticalListSortingStrategy}\n >\n <ul className=\"jfReportSelectOption-list withDnd forPageLayer\">\n {[...page.items].reverse().map((item, index) => {\n const icon = elementIcons[item.itemType]\n ? elementIcons[item.itemType]\n : elementIcons.default;\n return (\n <LayerItem\n key={item.id}\n icon={icon}\n id={item.id}\n index={index}\n item={item}\n onItemChange={config.updater}\n optionKey={index}\n />\n );\n })}\n </ul>\n </SortableContext>\n {activeItemData && <LayerDragOverlay activeItemData={activeItemData} />}\n </DndContext>\n ) : (\n <div className=\"toolSection-notifier\">\n {NO_ELEMENT_IN_PAGE}\n </div>\n )\n );\n};\n\nPageLayer.propTypes = {\n config: PropTypes.shape({\n updater: PropTypes.func,\n }),\n item: PropTypes.shape({\n id: PropTypes.string,\n isVisible: PropTypes.bool,\n itemType: PropTypes.string,\n }),\n onItemChange: PropTypes.func,\n};\n\nexport default PageLayer;\n"],"names":["PageLayer","config","item","page","onItemChange","useState","activeId","setActiveId","sensors","useSensors","useSensor","PointerSensor","activationConstraint","distance","KeyboardSensor","handleDragStart","useCallback","event","active","id","handleDragEnd","over","reversedItems","items","reverse","oldIndex","findIndex","newIndex","newItems","arrayMove","map","i","JSON","stringify","handleDragCancel","useTranslatedTexts","NO_ELEMENT_IN_PAGE","useMemo","length","activeItemData","activeItem","find","icon","elementIcons","itemType","default","_jsxs","closestCenter","_jsx","verticalListSortingStrategy","index","updater","propTypes","PropTypes","shape","func","string","isVisible","bool"],"mappings":"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"}
|
|
@@ -1,14 +1,11 @@
|
|
|
1
|
-
import { memo } from 'react';
|
|
2
1
|
import PropTypes from 'prop-types';
|
|
3
2
|
import CustomToolbar from './CustomToolbar.js';
|
|
4
3
|
import { jsx } from 'react/jsx-runtime';
|
|
5
4
|
|
|
6
5
|
var CustomToolbarWrapper = function CustomToolbarWrapper(_ref) {
|
|
7
|
-
var _ref$
|
|
8
|
-
isTextEditorOpen = _ref$isTextEditorOpen === void 0 ? false : _ref$isTextEditorOpen,
|
|
9
|
-
_ref$itemWidth = _ref.itemWidth,
|
|
6
|
+
var _ref$itemWidth = _ref.itemWidth,
|
|
10
7
|
itemWidth = _ref$itemWidth === void 0 ? 0 : _ref$itemWidth;
|
|
11
|
-
return
|
|
8
|
+
return /*#__PURE__*/jsx("div", {
|
|
12
9
|
id: "toolbar",
|
|
13
10
|
style: {
|
|
14
11
|
pointerEvents: 'auto',
|
|
@@ -22,10 +19,8 @@ var CustomToolbarWrapper = function CustomToolbarWrapper(_ref) {
|
|
|
22
19
|
};
|
|
23
20
|
|
|
24
21
|
CustomToolbarWrapper.propTypes = {
|
|
25
|
-
isTextEditorOpen: PropTypes.bool,
|
|
26
22
|
itemWidth: PropTypes.number
|
|
27
23
|
};
|
|
28
|
-
var CustomToolbarWrapper$1 = /*#__PURE__*/memo(CustomToolbarWrapper);
|
|
29
24
|
|
|
30
|
-
export default CustomToolbarWrapper
|
|
25
|
+
export default CustomToolbarWrapper;
|
|
31
26
|
//# sourceMappingURL=CustomToolbarWrapper.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CustomToolbarWrapper.js","sources":["../../../../../src/components/TextEditor/CustomToolbar/CustomToolbarWrapper.js"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"file":"CustomToolbarWrapper.js","sources":["../../../../../src/components/TextEditor/CustomToolbar/CustomToolbarWrapper.js"],"sourcesContent":["import PropTypes from 'prop-types';\nimport CustomToolbar from './CustomToolbar';\n\nconst CustomToolbarWrapper = ({\n itemWidth = 0,\n}) => (\n <div\n id=\"toolbar\"\n style={{\n pointerEvents: 'auto',\n position: 'absolute',\n top: '100%',\n }}\n >\n <CustomToolbar itemWidth={itemWidth} />\n </div>\n);\n\nCustomToolbarWrapper.propTypes = {\n itemWidth: PropTypes.number,\n};\n\nexport default CustomToolbarWrapper;\n"],"names":["CustomToolbarWrapper","itemWidth","_jsx","pointerEvents","position","top","propTypes","PropTypes","number"],"mappings":";;;;IAGMA,oBAAoB,GAAG,SAAvBA,oBAAuB;AAAA,4BAC3BC,SAD2B;AAAA,MAC3BA,SAD2B,+BACf,CADe;AAAA,sBAG3BC;AACE,IAAA,EAAE,EAAC,SADL;AAEE,IAAA,KAAK,EAAE;AACLC,MAAAA,aAAa,EAAE,MADV;AAELC,MAAAA,QAAQ,EAAE,UAFL;AAGLC,MAAAA,GAAG,EAAE;AAHA,KAFT;AAAA,2BAQEH,IAAC,aAAD;AAAe,MAAA,SAAS,EAAED;AAA1B;AARF,IAH2B;AAAA;;AAe7BD,oBAAoB,CAACM,SAArB,GAAiC;AAC/BL,EAAAA,SAAS,EAAEM,SAAS,CAACC;AADU,CAAjC;;;;"}
|