@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,6 +1,3 @@
|
|
|
1
|
-
import 'core-js/modules/es.array.find.js';
|
|
2
|
-
import 'core-js/modules/es.array.find-index.js';
|
|
3
|
-
import 'core-js/modules/es.array.includes.js';
|
|
4
1
|
import 'core-js/modules/es.array.map.js';
|
|
5
2
|
import 'core-js/modules/es.number.constructor.js';
|
|
6
3
|
import 'core-js/modules/es.number.is-nan.js';
|
|
@@ -8,20 +5,20 @@ import 'core-js/modules/es.number.to-fixed.js';
|
|
|
8
5
|
import 'core-js/modules/es.object.to-string.js';
|
|
9
6
|
import 'core-js/modules/es.regexp.to-string.js';
|
|
10
7
|
import 'core-js/modules/web.dom-collections.for-each.js';
|
|
11
|
-
import {
|
|
8
|
+
import { useRef, createRef, useEffect, Fragment } from 'react';
|
|
12
9
|
import { mainWrapper, viewport, canvas, page } from '../../constants/classNames.js';
|
|
13
10
|
import ContextMenu from './ContextMenu.js';
|
|
14
11
|
import PageActions from './PageActions.js';
|
|
15
12
|
import PageAdder from './PageAdder.js';
|
|
16
13
|
import ZoomControls from './ZoomControls.js';
|
|
14
|
+
import SelectionBox from './SelectionBox.js';
|
|
17
15
|
import { useBuilderStore } from '../../contexts/BuilderContext.js';
|
|
18
16
|
import { usePropStore } from '../../contexts/PropContext.js';
|
|
19
17
|
import Page from './Page.js';
|
|
20
|
-
import { calculateGuidePositions, findItemById, findItemsOnPage
|
|
21
|
-
import { useActiveElement, useEventListener } from '../../utils/hooks.js';
|
|
22
|
-
import generateId from '../../utils/generateId.js';
|
|
23
|
-
import { EVENT_IGNORED_ROLES } from '../../constants/eventIgnoredRoles.js';
|
|
18
|
+
import { calculateGuidePositions, findItemById, findItemsOnPage } from '../../utils/functions.js';
|
|
24
19
|
import DraggableLayer from './DraggableLayer.js';
|
|
20
|
+
import useKeyboardActions from '../../utils/useKeyboardActions.js';
|
|
21
|
+
import useMarqueeSelection from '../../utils/useMarqueeSelection.js';
|
|
25
22
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
26
23
|
|
|
27
24
|
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; }
|
|
@@ -30,76 +27,45 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
|
|
|
30
27
|
|
|
31
28
|
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; }
|
|
32
29
|
|
|
33
|
-
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
34
|
-
|
|
35
|
-
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
36
|
-
|
|
37
|
-
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
38
|
-
|
|
39
|
-
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
40
|
-
|
|
41
|
-
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
42
|
-
|
|
43
|
-
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
44
|
-
|
|
45
30
|
var Scene = function Scene() {
|
|
46
31
|
var pages = usePropStore(function (state) {
|
|
47
32
|
return state.pages;
|
|
48
33
|
});
|
|
49
|
-
var onItemAdd = usePropStore(function (state) {
|
|
50
|
-
return state.onItemAdd;
|
|
51
|
-
});
|
|
52
|
-
var onItemRemove = usePropStore(function (state) {
|
|
53
|
-
return state.onItemRemove;
|
|
54
|
-
});
|
|
55
|
-
var onAnEventTrigger = usePropStore(function (state) {
|
|
56
|
-
return state.onAnEventTrigger;
|
|
57
|
-
});
|
|
58
34
|
var settings = usePropStore(function (state) {
|
|
59
35
|
return state.settings;
|
|
60
36
|
});
|
|
61
|
-
var onItemChange = usePropStore(function (state) {
|
|
62
|
-
return state.onItemChange;
|
|
63
|
-
});
|
|
64
|
-
var activeElement = useBuilderStore(function (state) {
|
|
65
|
-
return state.activeElement;
|
|
66
|
-
});
|
|
67
37
|
var contextMenuProps = useBuilderStore(function (state) {
|
|
68
38
|
return state.contextMenuProps;
|
|
69
39
|
});
|
|
70
|
-
var isRightPanelOpen = useBuilderStore(function (state) {
|
|
71
|
-
return state.isRightPanelOpen;
|
|
72
|
-
});
|
|
73
|
-
var setActiveElement = useBuilderStore(function (state) {
|
|
74
|
-
return state.setActiveElement;
|
|
75
|
-
});
|
|
76
40
|
var setContextMenuProps = useBuilderStore(function (state) {
|
|
77
41
|
return state.setContextMenuProps;
|
|
78
42
|
});
|
|
79
|
-
var
|
|
80
|
-
return state.
|
|
43
|
+
var setGuides = useBuilderStore(function (state) {
|
|
44
|
+
return state.setGuides;
|
|
81
45
|
});
|
|
82
46
|
var zoom = useBuilderStore(function (state) {
|
|
83
47
|
return state.zoom;
|
|
84
48
|
});
|
|
85
|
-
|
|
86
|
-
var _useState = useState(null),
|
|
87
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
88
|
-
itemToPaste = _useState2[0],
|
|
89
|
-
setItemToPaste = _useState2[1];
|
|
90
|
-
|
|
91
49
|
var lastScrollPosition = useBuilderStore(function (state) {
|
|
92
50
|
return state.lastScrollPosition;
|
|
93
51
|
});
|
|
94
52
|
var pageStyles = useRef({});
|
|
95
53
|
var pageContainerStyles = useRef({});
|
|
96
54
|
var viewPortRef = useRef({});
|
|
55
|
+
var canvasRef = useRef(null);
|
|
97
56
|
/* Page Refs */
|
|
98
57
|
|
|
99
58
|
var refs = useRef(pages.reduce(function (acc, curr) {
|
|
100
59
|
acc[curr.id] = /*#__PURE__*/createRef(null);
|
|
101
60
|
return acc;
|
|
102
|
-
}, {})); //
|
|
61
|
+
}, {})); // Custom hooks
|
|
62
|
+
|
|
63
|
+
useKeyboardActions();
|
|
64
|
+
|
|
65
|
+
var _useMarqueeSelection = useMarqueeSelection(canvasRef),
|
|
66
|
+
selectionBox = _useMarqueeSelection.selectionBox,
|
|
67
|
+
selectionPageId = _useMarqueeSelection.selectionPageId; // Update refs when new pages are added
|
|
68
|
+
|
|
103
69
|
|
|
104
70
|
useEffect(function () {
|
|
105
71
|
pages.forEach(function (page) {
|
|
@@ -107,13 +73,10 @@ var Scene = function Scene() {
|
|
|
107
73
|
refs.current[page.id] = /*#__PURE__*/createRef(null);
|
|
108
74
|
}
|
|
109
75
|
});
|
|
110
|
-
}, [pages]);
|
|
111
|
-
var isMultipleItemSelected = activeElement !== null && activeElement.length > 1;
|
|
112
|
-
/* Calculate snap guides */
|
|
76
|
+
}, [pages]); // Calculate guides for snap functionality
|
|
113
77
|
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
return pages.reduce(function (acc, page) {
|
|
78
|
+
useEffect(function () {
|
|
79
|
+
setGuides(pages.reduce(function (acc, page) {
|
|
117
80
|
var _pageGuides = {};
|
|
118
81
|
var pageRef = refs.current[page.id];
|
|
119
82
|
|
|
@@ -148,201 +111,14 @@ var Scene = function Scene() {
|
|
|
148
111
|
|
|
149
112
|
acc[page.id] = _pageGuides;
|
|
150
113
|
return acc;
|
|
151
|
-
}, {});
|
|
152
|
-
}, [pages, zoom]);
|
|
114
|
+
}, {}));
|
|
115
|
+
}, [pages, zoom, setGuides]); // Restore scroll position after mode change
|
|
116
|
+
|
|
153
117
|
useEffect(function () {
|
|
154
118
|
if (viewPortRef.current) {
|
|
155
119
|
viewPortRef.current.scrollTop = lastScrollPosition;
|
|
156
120
|
}
|
|
157
|
-
}, [lastScrollPosition]);
|
|
158
|
-
|
|
159
|
-
var foundItem = findItemById(activeElement === null ? null : activeElement[0], pages);
|
|
160
|
-
var selectedItems = useActiveElement();
|
|
161
|
-
|
|
162
|
-
var moveItemWithKeyboard = function moveItemWithKeyboard(event, direction, value) {
|
|
163
|
-
event.preventDefault();
|
|
164
|
-
selectedItems.forEach(function (item) {
|
|
165
|
-
if (item.isLocked) {
|
|
166
|
-
return false;
|
|
167
|
-
}
|
|
168
|
-
|
|
169
|
-
onItemChange({
|
|
170
|
-
id: item.id
|
|
171
|
-
}, _objectSpread(_objectSpread({}, item), {}, _defineProperty({}, direction, item[direction] + value)));
|
|
172
|
-
});
|
|
173
|
-
};
|
|
174
|
-
|
|
175
|
-
var selectNextOrPrevElement = function selectNextOrPrevElement(event, deletedItem) {
|
|
176
|
-
if (event.preventDefault) event.preventDefault();
|
|
177
|
-
var referenceItem = deletedItem ? deletedItem : foundItem;
|
|
178
|
-
var page = pages.find(function (_page) {
|
|
179
|
-
return _page.id === referenceItem.pageID;
|
|
180
|
-
});
|
|
181
|
-
if (!page || page && !page.items.length) return setActiveElement(null);
|
|
182
|
-
var items = page.items;
|
|
183
|
-
var currentIndex = items.findIndex(function (item) {
|
|
184
|
-
return item.id === referenceItem.id;
|
|
185
|
-
}); // Pages are not updated in time so here is an unnecessary check
|
|
186
|
-
|
|
187
|
-
if (items.length === 1 && deletedItem) {
|
|
188
|
-
return setActiveElement(null);
|
|
189
|
-
}
|
|
190
|
-
|
|
191
|
-
if (event.shiftKey) {
|
|
192
|
-
if (items[currentIndex - 1]) setActiveElement(items[currentIndex - 1].id);else setActiveElement(items[items.length - 1].id);
|
|
193
|
-
} else if (items[currentIndex + 1]) {
|
|
194
|
-
setActiveElement(items[currentIndex + 1].id);
|
|
195
|
-
} else setActiveElement(items[0].id);
|
|
196
|
-
};
|
|
197
|
-
|
|
198
|
-
var onItemRemoveFromPage = function onItemRemoveFromPage(e) {
|
|
199
|
-
// Firefox updates browser history on backspace
|
|
200
|
-
e.preventDefault();
|
|
201
|
-
if (isMultipleItemSelected) return;
|
|
202
|
-
|
|
203
|
-
if (foundItem.isLocked) {
|
|
204
|
-
return false;
|
|
205
|
-
}
|
|
206
|
-
|
|
207
|
-
setActiveElement(null);
|
|
208
|
-
onItemRemove(foundItem);
|
|
209
|
-
selectNextOrPrevElement({
|
|
210
|
-
shiftKey: false
|
|
211
|
-
}, foundItem);
|
|
212
|
-
onAnEventTrigger('removeItem', foundItem.itemType);
|
|
213
|
-
};
|
|
214
|
-
|
|
215
|
-
var handlePaste = function handlePaste() {
|
|
216
|
-
if (isMultipleItemSelected) return;
|
|
217
|
-
var itemID = generateId();
|
|
218
|
-
var pageID = getMostVisiblePage(true);
|
|
219
|
-
var offset = itemToPaste.pageID === pageID ? 50 : 0;
|
|
220
|
-
|
|
221
|
-
var item = _objectSpread(_objectSpread({}, itemToPaste), {}, {
|
|
222
|
-
id: itemID,
|
|
223
|
-
left: itemToPaste.left + offset,
|
|
224
|
-
pageID: pageID,
|
|
225
|
-
top: itemToPaste.top + offset
|
|
226
|
-
});
|
|
227
|
-
|
|
228
|
-
onItemAdd(item);
|
|
229
|
-
onAnEventTrigger('pasteItem', itemToPaste.itemType);
|
|
230
|
-
setActiveElement(itemID); // set as last reference to paste
|
|
231
|
-
|
|
232
|
-
setItemToPaste(item);
|
|
233
|
-
};
|
|
234
|
-
|
|
235
|
-
var keyboardActions = function keyboardActions(event) {
|
|
236
|
-
var key = event.key,
|
|
237
|
-
metaKey = event.metaKey,
|
|
238
|
-
shiftKey = event.shiftKey;
|
|
239
|
-
|
|
240
|
-
if (metaKey) {
|
|
241
|
-
if (key === 'l') {
|
|
242
|
-
// Lock
|
|
243
|
-
if (isMultipleItemSelected) return;
|
|
244
|
-
event.preventDefault(); // Dont focus to URL bar
|
|
245
|
-
|
|
246
|
-
onAnEventTrigger(foundItem.isLocked ? 'unlockReportItem' : 'lockReportItem', foundItem.itemType);
|
|
247
|
-
onItemChange({
|
|
248
|
-
id: foundItem.id
|
|
249
|
-
}, {
|
|
250
|
-
isLocked: foundItem.isLocked ? false : true
|
|
251
|
-
});
|
|
252
|
-
return;
|
|
253
|
-
}
|
|
254
|
-
|
|
255
|
-
if (key === 'c' || key === 'x') {
|
|
256
|
-
if (isMultipleItemSelected) return; // Copy or Cut
|
|
257
|
-
|
|
258
|
-
if (key === 'x') {
|
|
259
|
-
onItemRemoveFromPage(event);
|
|
260
|
-
onAnEventTrigger('cutItem', foundItem.itemType);
|
|
261
|
-
} else {
|
|
262
|
-
onAnEventTrigger('copyItem', foundItem.itemType);
|
|
263
|
-
}
|
|
264
|
-
|
|
265
|
-
setItemToPaste(foundItem);
|
|
266
|
-
return;
|
|
267
|
-
}
|
|
268
|
-
|
|
269
|
-
if (foundItem && key === 'd') {
|
|
270
|
-
if (isMultipleItemSelected) return; // Duplicate
|
|
271
|
-
|
|
272
|
-
event.preventDefault();
|
|
273
|
-
var itemID = generateId();
|
|
274
|
-
onItemAdd(_objectSpread(_objectSpread({}, foundItem), {}, {
|
|
275
|
-
id: itemID,
|
|
276
|
-
left: foundItem.left + 50,
|
|
277
|
-
top: foundItem.top + 50
|
|
278
|
-
}));
|
|
279
|
-
onAnEventTrigger('duplicateItem', foundItem.itemType);
|
|
280
|
-
setActiveElement(itemID);
|
|
281
|
-
|
|
282
|
-
if (!isRightPanelOpen) {
|
|
283
|
-
setIsRightPanelOpen(true);
|
|
284
|
-
}
|
|
285
|
-
|
|
286
|
-
return;
|
|
287
|
-
}
|
|
288
|
-
}
|
|
289
|
-
|
|
290
|
-
keyDownCount.current++;
|
|
291
|
-
var movementValue = shiftKey ? 10 : 1 + keyDownCount.current; // Others
|
|
292
|
-
|
|
293
|
-
switch (key) {
|
|
294
|
-
case 'Backspace':
|
|
295
|
-
return onItemRemoveFromPage(event);
|
|
296
|
-
|
|
297
|
-
case 'Delete':
|
|
298
|
-
return onItemRemoveFromPage(event);
|
|
299
|
-
|
|
300
|
-
case 'Escape':
|
|
301
|
-
return setActiveElement(null);
|
|
302
|
-
|
|
303
|
-
case 'ArrowLeft':
|
|
304
|
-
return moveItemWithKeyboard(event, 'left', -movementValue);
|
|
305
|
-
|
|
306
|
-
case 'ArrowUp':
|
|
307
|
-
return moveItemWithKeyboard(event, 'top', -movementValue);
|
|
308
|
-
|
|
309
|
-
case 'ArrowRight':
|
|
310
|
-
return moveItemWithKeyboard(event, 'left', movementValue);
|
|
311
|
-
|
|
312
|
-
case 'ArrowDown':
|
|
313
|
-
return moveItemWithKeyboard(event, 'top', movementValue);
|
|
314
|
-
|
|
315
|
-
case 'Tab':
|
|
316
|
-
return selectNextOrPrevElement(event);
|
|
317
|
-
}
|
|
318
|
-
};
|
|
319
|
-
|
|
320
|
-
var shouldSuppressKeyboardEvent = function shouldSuppressKeyboardEvent(e) {
|
|
321
|
-
return EVENT_IGNORED_ROLES.some(function (role) {
|
|
322
|
-
return e.target.closest("[role=".concat(role, "]"));
|
|
323
|
-
});
|
|
324
|
-
};
|
|
325
|
-
|
|
326
|
-
var handleKeyboardEvent = function handleKeyboardEvent(e) {
|
|
327
|
-
var shouldPaste = itemToPaste && e.key === 'v' && e.metaKey;
|
|
328
|
-
|
|
329
|
-
if (shouldSuppressKeyboardEvent(e)) {
|
|
330
|
-
return;
|
|
331
|
-
}
|
|
332
|
-
|
|
333
|
-
if (activeElement && !shouldPaste) {
|
|
334
|
-
var arrowKeyCodes = ['ArrowLeft', 'ArrowUp', 'ArrowDown', 'ArrowBottom'];
|
|
335
|
-
if (arrowKeyCodes.includes(e.key)) e.preventDefault();
|
|
336
|
-
keyboardActions(e);
|
|
337
|
-
} else if (shouldPaste) {
|
|
338
|
-
handlePaste();
|
|
339
|
-
}
|
|
340
|
-
};
|
|
341
|
-
|
|
342
|
-
useEventListener('keydown', handleKeyboardEvent);
|
|
343
|
-
useEventListener('keyup', function () {
|
|
344
|
-
keyDownCount.current = 0;
|
|
345
|
-
});
|
|
121
|
+
}, [lastScrollPosition]);
|
|
346
122
|
var _settings$reportLayou = settings.reportLayoutHeight,
|
|
347
123
|
reportLayoutHeight = _settings$reportLayou === void 0 ? 794 : _settings$reportLayou,
|
|
348
124
|
_settings$reportLayou2 = settings.reportLayoutWidth,
|
|
@@ -367,13 +143,13 @@ var Scene = function Scene() {
|
|
|
367
143
|
// Builder.js
|
|
368
144
|
className: mainWrapper,
|
|
369
145
|
children: [/*#__PURE__*/jsx(DraggableLayer, {
|
|
370
|
-
guides: guides,
|
|
371
146
|
pageRefs: refs.current
|
|
372
147
|
}), /*#__PURE__*/jsx("div", {
|
|
373
148
|
ref: viewPortRef,
|
|
374
149
|
className: viewport,
|
|
375
150
|
"data-zoom": zoom,
|
|
376
151
|
children: /*#__PURE__*/jsxs("div", {
|
|
152
|
+
ref: canvasRef,
|
|
377
153
|
className: canvas,
|
|
378
154
|
children: [pages.map(function (page$1, index) {
|
|
379
155
|
return (
|
|
@@ -383,20 +159,23 @@ var Scene = function Scene() {
|
|
|
383
159
|
children: [/*#__PURE__*/jsx(PageActions, {
|
|
384
160
|
order: page$1.order,
|
|
385
161
|
pageID: page$1.id
|
|
386
|
-
}), /*#__PURE__*/
|
|
162
|
+
}), /*#__PURE__*/jsxs("div", {
|
|
387
163
|
ref: refs.current[page$1.id],
|
|
388
164
|
className: page,
|
|
389
165
|
"data-id": page$1.id,
|
|
390
166
|
"data-order": page$1.order,
|
|
391
167
|
id: "presentation-page-".concat(page$1.id.toString()),
|
|
392
|
-
style: pageStyles.current,
|
|
393
|
-
|
|
394
|
-
|
|
168
|
+
style: _objectSpread(_objectSpread({}, pageStyles.current), {}, {
|
|
169
|
+
position: 'relative'
|
|
170
|
+
}),
|
|
171
|
+
children: [/*#__PURE__*/jsx(Page, {
|
|
395
172
|
items: page$1.items,
|
|
396
173
|
page: page$1,
|
|
397
174
|
pageIndex: index,
|
|
398
175
|
style: pageContainerStyles.current
|
|
399
|
-
})
|
|
176
|
+
}), selectionPageId === page$1.id && selectionBox && /*#__PURE__*/jsx(SelectionBox, {
|
|
177
|
+
selectionBox: selectionBox
|
|
178
|
+
})]
|
|
400
179
|
}, "page_".concat(page$1.id))]
|
|
401
180
|
}, page$1.id)
|
|
402
181
|
);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Scene.js","sources":["../../../../src/components/Builder/Scene.js"],"sourcesContent":["/* eslint-disable complexity */\nimport {\n createRef,\n Fragment,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport * as classNames from '../../constants/classNames';\nimport ContextMenu from './ContextMenu';\nimport PageActions from './PageActions';\nimport PageAdder from './PageAdder';\nimport ZoomControls from './ZoomControls';\nimport { useBuilderStore } from '../../contexts/BuilderContext';\nimport { usePropStore } from '../../contexts/PropContext';\nimport Page from './Page';\nimport {\n calculateGuidePositions,\n findItemById,\n findItemsOnPage,\n getMostVisiblePage,\n} from '../../utils/functions';\nimport { useActiveElement, useEventListener } from '../../utils/hooks';\nimport generateId from '../../utils/generateId';\nimport { EVENT_IGNORED_ROLES } from '../../constants/eventIgnoredRoles';\nimport DraggableLayer from './DraggableLayer';\n\nconst Scene = () => {\n const pages = usePropStore(state => state.pages);\n const onItemAdd = usePropStore(state => state.onItemAdd);\n const onItemRemove = usePropStore(state => state.onItemRemove);\n const onAnEventTrigger = usePropStore(state => state.onAnEventTrigger);\n const settings = usePropStore(state => state.settings);\n const onItemChange = usePropStore(state => state.onItemChange);\n\n const activeElement = useBuilderStore(state => state.activeElement);\n const contextMenuProps = useBuilderStore(state => state.contextMenuProps);\n const isRightPanelOpen = useBuilderStore(state => state.isRightPanelOpen);\n const setActiveElement = useBuilderStore(state => state.setActiveElement);\n const setContextMenuProps = useBuilderStore(state => state.setContextMenuProps);\n const setIsRightPanelOpen = useBuilderStore(state => state.setIsRightPanelOpen);\n const zoom = useBuilderStore(state => state.zoom);\n\n const [itemToPaste, setItemToPaste] = useState(null);\n const lastScrollPosition = useBuilderStore(state => state.lastScrollPosition);\n\n const pageStyles = useRef({});\n const pageContainerStyles = useRef({});\n const viewPortRef = useRef({});\n\n /* Page Refs */\n const refs = useRef(pages.reduce((acc, curr) => {\n acc[curr.id] = createRef(null);\n return acc;\n }, {}));\n\n // Update refs when new pages are added\n useEffect(() => {\n pages.forEach(page => {\n if (!refs.current[page.id]) {\n refs.current[page.id] = createRef(null);\n }\n });\n }, [pages]);\n\n const isMultipleItemSelected = activeElement !== null && activeElement.length > 1;\n\n /* Calculate snap guides */\n const keyDownCount = useRef(null);\n\n const guides = useMemo(() => {\n return pages.reduce((acc, page) => {\n const _pageGuides = {};\n const pageRef = refs.current[page.id];\n if (pageRef && pageRef.current) {\n const {\n height, left, top, width,\n } = pageRef.current.getBoundingClientRect();\n const boundingBox = {\n height, left, top, width,\n };\n _pageGuides.boundingBox = {\n x: calculateGuidePositions(boundingBox, 'x').map(value => value - boundingBox.left),\n y: calculateGuidePositions(boundingBox, 'y').map(value => value - boundingBox.top),\n };\n page.items.forEach(item => {\n _pageGuides[item.id] = {\n x: calculateGuidePositions(item, 'x', zoom),\n y: calculateGuidePositions(item, 'y', zoom),\n };\n });\n }\n acc[page.id] = _pageGuides;\n return acc;\n }, {});\n }, [pages, zoom]);\n\n useEffect(() => {\n if (viewPortRef.current) {\n viewPortRef.current.scrollTop = lastScrollPosition;\n }\n }, [lastScrollPosition]); // set last scroll position after changing mode\n\n const foundItem = findItemById(activeElement === null ? null : activeElement[0], pages);\n\n const selectedItems = useActiveElement();\n const moveItemWithKeyboard = (event, direction, value) => {\n event.preventDefault();\n selectedItems.forEach(item => {\n if (item.isLocked) {\n return false;\n }\n onItemChange(\n { id: item.id },\n {\n ...item,\n [direction]: item[direction] + value,\n },\n );\n });\n };\n\n const selectNextOrPrevElement = (event, deletedItem) => {\n if (event.preventDefault) event.preventDefault();\n const referenceItem = deletedItem ? deletedItem : foundItem;\n\n const page = pages.find(_page => _page.id === referenceItem.pageID);\n if (!page || (page && !page.items.length)) return setActiveElement(null);\n const { items } = page;\n\n const currentIndex = items.findIndex(item => item.id === referenceItem.id);\n\n // Pages are not updated in time so here is an unnecessary check\n if (items.length === 1 && deletedItem) {\n return setActiveElement(null);\n }\n\n if (event.shiftKey) {\n if (items[currentIndex - 1]) setActiveElement(items[currentIndex - 1].id);\n else setActiveElement(items[items.length - 1].id);\n } else if (items[currentIndex + 1]) {\n setActiveElement(items[currentIndex + 1].id);\n } else setActiveElement(items[0].id);\n };\n\n const onItemRemoveFromPage = e => {\n // Firefox updates browser history on backspace\n e.preventDefault();\n if (isMultipleItemSelected) return;\n if (foundItem.isLocked) {\n return false;\n }\n setActiveElement(null);\n onItemRemove(foundItem);\n selectNextOrPrevElement({ shiftKey: false }, foundItem);\n onAnEventTrigger('removeItem', foundItem.itemType);\n };\n\n const handlePaste = () => {\n if (isMultipleItemSelected) return;\n const itemID = generateId();\n const pageID = getMostVisiblePage(true);\n const offset = itemToPaste.pageID === pageID ? 50 : 0;\n\n const item = {\n ...itemToPaste,\n id: itemID,\n left: itemToPaste.left + offset,\n pageID,\n top: itemToPaste.top + offset,\n };\n\n onItemAdd(item);\n\n onAnEventTrigger('pasteItem', itemToPaste.itemType);\n setActiveElement(itemID);\n // set as last reference to paste\n setItemToPaste(item);\n };\n\n const keyboardActions = event => {\n const {\n key,\n metaKey,\n shiftKey,\n } = event;\n\n if (metaKey) {\n if (key === 'l') {\n // Lock\n if (isMultipleItemSelected) return;\n event.preventDefault(); // Dont focus to URL bar\n onAnEventTrigger(\n foundItem.isLocked ? 'unlockReportItem' : 'lockReportItem',\n foundItem.itemType,\n );\n onItemChange(\n { id: foundItem.id },\n { isLocked: foundItem.isLocked ? false : true },\n );\n return;\n }\n\n if (key === 'c' || key === 'x') {\n if (isMultipleItemSelected) return;\n // Copy or Cut\n if (key === 'x') {\n onItemRemoveFromPage(event);\n onAnEventTrigger('cutItem', foundItem.itemType);\n } else {\n onAnEventTrigger('copyItem', foundItem.itemType);\n }\n\n setItemToPaste(foundItem);\n return;\n }\n\n if (foundItem && key === 'd') {\n if (isMultipleItemSelected) return;\n // Duplicate\n event.preventDefault();\n const itemID = generateId();\n onItemAdd({\n ...foundItem,\n id: itemID,\n left: foundItem.left + 50,\n top: foundItem.top + 50,\n });\n onAnEventTrigger('duplicateItem', foundItem.itemType);\n setActiveElement(itemID);\n if (!isRightPanelOpen) {\n setIsRightPanelOpen(true);\n }\n return;\n }\n }\n\n keyDownCount.current++;\n const movementValue = shiftKey ? 10 : 1 + keyDownCount.current;\n\n // Others\n switch (key) {\n case 'Backspace': return onItemRemoveFromPage(event);\n case 'Delete': return onItemRemoveFromPage(event);\n case 'Escape': return setActiveElement(null);\n case 'ArrowLeft': return moveItemWithKeyboard(event, 'left', -movementValue);\n case 'ArrowUp': return moveItemWithKeyboard(event, 'top', -movementValue);\n case 'ArrowRight': return moveItemWithKeyboard(event, 'left', movementValue);\n case 'ArrowDown': return moveItemWithKeyboard(event, 'top', movementValue);\n case 'Tab': return selectNextOrPrevElement(event);\n default:\n }\n };\n\n const shouldSuppressKeyboardEvent = e => (\n EVENT_IGNORED_ROLES.some(role => e.target.closest(`[role=${role}]`))\n );\n\n const handleKeyboardEvent = e => {\n const shouldPaste = itemToPaste && e.key === 'v' && e.metaKey;\n\n if (shouldSuppressKeyboardEvent(e)) {\n return;\n }\n\n if (activeElement && !shouldPaste) {\n const arrowKeyCodes = ['ArrowLeft', 'ArrowUp', 'ArrowDown', 'ArrowBottom'];\n if (arrowKeyCodes.includes(e.key)) e.preventDefault();\n keyboardActions(e);\n } else if (shouldPaste) {\n handlePaste();\n }\n };\n\n useEventListener('keydown', handleKeyboardEvent);\n useEventListener('keyup', () => { keyDownCount.current = 0; });\n\n const { reportLayoutHeight = 794, reportLayoutWidth = 1123 } = settings;\n\n // TODO: Some strange shit is going on here on first render\n let width = parseInt(reportLayoutWidth, 10);\n let height = parseInt(reportLayoutHeight, 10);\n width = Number.isNaN(width) ? 1 : width;\n height = Number.isNaN(height) ? 1 : height;\n const zoomToUse = Number.isNaN(zoom) ? 1 : zoom;\n\n pageStyles.current = {\n height: parseFloat((height * zoomToUse).toFixed(1)),\n width: parseFloat((width * zoomToUse).toFixed(1)),\n };\n pageContainerStyles.current = {\n height,\n transform: `scale(${zoomToUse})`,\n transformOrigin: '0 0',\n width,\n };\n\n return (\n <main // Builder.js\n className={classNames.mainWrapper}\n >\n <DraggableLayer\n guides={guides}\n pageRefs={refs.current}\n />\n <div\n ref={viewPortRef}\n className={classNames.viewport}\n data-zoom={zoom}\n >\n <div\n className={classNames.canvas}\n >\n {pages.map((page, index) => (\n // TODO: This part can be moved into a different component\n <Fragment key={page.id}>\n <PageActions\n order={page.order}\n pageID={page.id}\n />\n <div\n key={`page_${page.id}`}\n ref={refs.current[page.id]}\n className={classNames.page}\n data-id={page.id}\n data-order={page.order}\n id={`presentation-page-${page.id.toString()}`}\n style={pageStyles.current}\n >\n <Page\n guides={guides}\n items={page.items}\n page={page}\n pageIndex={index}\n style={pageContainerStyles.current}\n />\n </div>\n </Fragment>\n ))}\n <PageAdder />\n </div>\n </div>\n <ZoomControls />\n {contextMenuProps\n && (\n <ContextMenu\n exceptionalClasses={['contextMenu-button']}\n height={height}\n item={findItemById(contextMenuProps.id, pages)}\n items={findItemsOnPage(contextMenuProps.pageID, pages)}\n onClickOutside={() => setContextMenuProps(null)}\n position={contextMenuProps.position}\n width={width}\n />\n )}\n </main>\n );\n};\n\nexport default Scene;\n"],"names":["Scene","pages","usePropStore","state","onItemAdd","onItemRemove","onAnEventTrigger","settings","onItemChange","activeElement","useBuilderStore","contextMenuProps","isRightPanelOpen","setActiveElement","setContextMenuProps","setIsRightPanelOpen","zoom","useState","itemToPaste","setItemToPaste","lastScrollPosition","pageStyles","useRef","pageContainerStyles","viewPortRef","refs","reduce","acc","curr","id","createRef","useEffect","forEach","page","current","isMultipleItemSelected","length","keyDownCount","guides","useMemo","_pageGuides","pageRef","getBoundingClientRect","height","left","top","width","boundingBox","x","calculateGuidePositions","map","value","y","items","item","scrollTop","foundItem","findItemById","selectedItems","useActiveElement","moveItemWithKeyboard","event","direction","preventDefault","isLocked","selectNextOrPrevElement","deletedItem","referenceItem","find","_page","pageID","currentIndex","findIndex","shiftKey","onItemRemoveFromPage","e","itemType","handlePaste","itemID","generateId","getMostVisiblePage","offset","keyboardActions","key","metaKey","movementValue","shouldSuppressKeyboardEvent","EVENT_IGNORED_ROLES","some","role","target","closest","handleKeyboardEvent","shouldPaste","arrowKeyCodes","includes","useEventListener","reportLayoutHeight","reportLayoutWidth","parseInt","Number","isNaN","zoomToUse","parseFloat","toFixed","transform","transformOrigin","_jsxs","classNames","_jsx","index","order","toString","findItemsOnPage","position"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Scene.js","sources":["../../../../src/components/Builder/Scene.js"],"sourcesContent":["/* eslint-disable complexity */\nimport {\n createRef,\n Fragment,\n useEffect,\n useRef,\n} from 'react';\nimport * as classNames from '../../constants/classNames';\nimport ContextMenu from './ContextMenu';\nimport PageActions from './PageActions';\nimport PageAdder from './PageAdder';\nimport ZoomControls from './ZoomControls';\nimport SelectionBox from './SelectionBox';\nimport { useBuilderStore } from '../../contexts/BuilderContext';\nimport { usePropStore } from '../../contexts/PropContext';\nimport Page from './Page';\nimport {\n calculateGuidePositions,\n findItemById,\n findItemsOnPage,\n} from '../../utils/functions';\nimport DraggableLayer from './DraggableLayer';\nimport useKeyboardActions from '../../utils/useKeyboardActions';\nimport useMarqueeSelection from '../../utils/useMarqueeSelection';\n\nconst Scene = () => {\n const pages = usePropStore(state => state.pages);\n const settings = usePropStore(state => state.settings);\n const contextMenuProps = useBuilderStore(state => state.contextMenuProps);\n const setContextMenuProps = useBuilderStore(state => state.setContextMenuProps);\n const setGuides = useBuilderStore(state => state.setGuides);\n const zoom = useBuilderStore(state => state.zoom);\n const lastScrollPosition = useBuilderStore(state => state.lastScrollPosition);\n\n const pageStyles = useRef({});\n const pageContainerStyles = useRef({});\n const viewPortRef = useRef({});\n const canvasRef = useRef(null);\n\n /* Page Refs */\n const refs = useRef(pages.reduce((acc, curr) => {\n acc[curr.id] = createRef(null);\n return acc;\n }, {}));\n\n // Custom hooks\n useKeyboardActions();\n const { selectionBox, selectionPageId } = useMarqueeSelection(canvasRef);\n\n // Update refs when new pages are added\n useEffect(() => {\n pages.forEach(page => {\n if (!refs.current[page.id]) {\n refs.current[page.id] = createRef(null);\n }\n });\n }, [pages]);\n\n // Calculate guides for snap functionality\n useEffect(() => {\n setGuides(pages.reduce((acc, page) => {\n const _pageGuides = {};\n const pageRef = refs.current[page.id];\n if (pageRef && pageRef.current) {\n const {\n height, left, top, width,\n } = pageRef.current.getBoundingClientRect();\n const boundingBox = {\n height, left, top, width,\n };\n _pageGuides.boundingBox = {\n x: calculateGuidePositions(boundingBox, 'x').map(value => value - boundingBox.left),\n y: calculateGuidePositions(boundingBox, 'y').map(value => value - boundingBox.top),\n };\n page.items.forEach(item => {\n _pageGuides[item.id] = {\n x: calculateGuidePositions(item, 'x', zoom),\n y: calculateGuidePositions(item, 'y', zoom),\n };\n });\n }\n acc[page.id] = _pageGuides;\n return acc;\n }, {}));\n }, [pages, zoom, setGuides]);\n\n // Restore scroll position after mode change\n useEffect(() => {\n if (viewPortRef.current) {\n viewPortRef.current.scrollTop = lastScrollPosition;\n }\n }, [lastScrollPosition]);\n\n const { reportLayoutHeight = 794, reportLayoutWidth = 1123 } = settings;\n\n // TODO: Some strange shit is going on here on first render\n let width = parseInt(reportLayoutWidth, 10);\n let height = parseInt(reportLayoutHeight, 10);\n width = Number.isNaN(width) ? 1 : width;\n height = Number.isNaN(height) ? 1 : height;\n const zoomToUse = Number.isNaN(zoom) ? 1 : zoom;\n\n pageStyles.current = {\n height: parseFloat((height * zoomToUse).toFixed(1)),\n width: parseFloat((width * zoomToUse).toFixed(1)),\n };\n pageContainerStyles.current = {\n height,\n transform: `scale(${zoomToUse})`,\n transformOrigin: '0 0',\n width,\n };\n\n return (\n <main // Builder.js\n className={classNames.mainWrapper}\n >\n <DraggableLayer\n pageRefs={refs.current}\n />\n <div\n ref={viewPortRef}\n className={classNames.viewport}\n data-zoom={zoom}\n >\n <div\n ref={canvasRef}\n className={classNames.canvas}\n >\n {pages.map((page, index) => (\n // TODO: This part can be moved into a different component\n <Fragment key={page.id}>\n <PageActions\n order={page.order}\n pageID={page.id}\n />\n <div\n key={`page_${page.id}`}\n ref={refs.current[page.id]}\n className={classNames.page}\n data-id={page.id}\n data-order={page.order}\n id={`presentation-page-${page.id.toString()}`}\n style={{ ...pageStyles.current, position: 'relative' }}\n >\n <Page\n items={page.items}\n page={page}\n pageIndex={index}\n style={pageContainerStyles.current}\n />\n {selectionPageId === page.id && selectionBox && (\n <SelectionBox selectionBox={selectionBox} />\n )}\n </div>\n </Fragment>\n ))}\n <PageAdder />\n </div>\n </div>\n <ZoomControls />\n {contextMenuProps\n && (\n <ContextMenu\n exceptionalClasses={['contextMenu-button']}\n height={height}\n item={findItemById(contextMenuProps.id, pages)}\n items={findItemsOnPage(contextMenuProps.pageID, pages)}\n onClickOutside={() => setContextMenuProps(null)}\n position={contextMenuProps.position}\n width={width}\n />\n )}\n </main>\n );\n};\n\nexport default Scene;\n"],"names":["Scene","pages","usePropStore","state","settings","contextMenuProps","useBuilderStore","setContextMenuProps","setGuides","zoom","lastScrollPosition","pageStyles","useRef","pageContainerStyles","viewPortRef","canvasRef","refs","reduce","acc","curr","id","createRef","useKeyboardActions","useMarqueeSelection","selectionBox","selectionPageId","useEffect","forEach","page","current","_pageGuides","pageRef","getBoundingClientRect","height","left","top","width","boundingBox","x","calculateGuidePositions","map","value","y","items","item","scrollTop","reportLayoutHeight","reportLayoutWidth","parseInt","Number","isNaN","zoomToUse","parseFloat","toFixed","transform","transformOrigin","_jsxs","classNames","_jsx","index","order","toString","position","findItemById","findItemsOnPage","pageID"],"mappings":"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"}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import PropTypes from 'prop-types';
|
|
2
|
+
import { jsx } from 'react/jsx-runtime';
|
|
3
|
+
|
|
4
|
+
var SelectionBox = function SelectionBox(_ref) {
|
|
5
|
+
var selectionBox = _ref.selectionBox;
|
|
6
|
+
var endX = selectionBox.endX,
|
|
7
|
+
endY = selectionBox.endY,
|
|
8
|
+
startX = selectionBox.startX,
|
|
9
|
+
startY = selectionBox.startY;
|
|
10
|
+
var left = Math.min(startX, endX);
|
|
11
|
+
var top = Math.min(startY, endY);
|
|
12
|
+
var width = Math.abs(endX - startX);
|
|
13
|
+
var height = Math.abs(endY - startY);
|
|
14
|
+
var style = {
|
|
15
|
+
backgroundColor: '#0099FF4A',
|
|
16
|
+
border: '2px solid #0066C3',
|
|
17
|
+
borderRadius: '2px',
|
|
18
|
+
height: height,
|
|
19
|
+
left: left,
|
|
20
|
+
pointerEvents: 'none',
|
|
21
|
+
position: 'absolute',
|
|
22
|
+
top: top,
|
|
23
|
+
width: width,
|
|
24
|
+
zIndex: 100000
|
|
25
|
+
};
|
|
26
|
+
return /*#__PURE__*/jsx("div", {
|
|
27
|
+
className: "selection-box",
|
|
28
|
+
style: style
|
|
29
|
+
});
|
|
30
|
+
};
|
|
31
|
+
|
|
32
|
+
SelectionBox.propTypes = {
|
|
33
|
+
selectionBox: PropTypes.shape({
|
|
34
|
+
endX: PropTypes.number,
|
|
35
|
+
endY: PropTypes.number,
|
|
36
|
+
startX: PropTypes.number,
|
|
37
|
+
startY: PropTypes.number
|
|
38
|
+
})
|
|
39
|
+
};
|
|
40
|
+
|
|
41
|
+
export default SelectionBox;
|
|
42
|
+
//# sourceMappingURL=SelectionBox.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"SelectionBox.js","sources":["../../../../src/components/Builder/SelectionBox.js"],"sourcesContent":["import PropTypes from 'prop-types';\n\nconst SelectionBox = ({ selectionBox }) => {\n const {\n endX, endY, startX, startY,\n } = selectionBox;\n\n const left = Math.min(startX, endX);\n const top = Math.min(startY, endY);\n const width = Math.abs(endX - startX);\n const height = Math.abs(endY - startY);\n\n const style = {\n backgroundColor: '#0099FF4A',\n border: '2px solid #0066C3',\n borderRadius: '2px',\n height,\n left,\n pointerEvents: 'none',\n position: 'absolute',\n top,\n width,\n zIndex: 100000,\n };\n\n return (\n <div\n className=\"selection-box\"\n style={style}\n />\n );\n};\n\nSelectionBox.propTypes = {\n selectionBox: PropTypes.shape({\n endX: PropTypes.number,\n endY: PropTypes.number,\n startX: PropTypes.number,\n startY: PropTypes.number,\n }),\n};\n\nexport default SelectionBox;\n"],"names":["SelectionBox","selectionBox","endX","endY","startX","startY","left","Math","min","top","width","abs","height","style","backgroundColor","border","borderRadius","pointerEvents","position","zIndex","_jsx","propTypes","PropTypes","shape","number"],"mappings":";;;IAEMA,YAAY,GAAG,SAAfA,YAAe,OAAsB;AAAA,MAAnBC,YAAmB,QAAnBA,YAAmB;AACzC,MACEC,IADF,GAEID,YAFJ,CACEC,IADF;AAAA,MACQC,IADR,GAEIF,YAFJ,CACQE,IADR;AAAA,MACcC,MADd,GAEIH,YAFJ,CACcG,MADd;AAAA,MACsBC,MADtB,GAEIJ,YAFJ,CACsBI,MADtB;AAIA,MAAMC,IAAI,GAAGC,IAAI,CAACC,GAAL,CAASJ,MAAT,EAAiBF,IAAjB,CAAb;AACA,MAAMO,GAAG,GAAGF,IAAI,CAACC,GAAL,CAASH,MAAT,EAAiBF,IAAjB,CAAZ;AACA,MAAMO,KAAK,GAAGH,IAAI,CAACI,GAAL,CAAST,IAAI,GAAGE,MAAhB,CAAd;AACA,MAAMQ,MAAM,GAAGL,IAAI,CAACI,GAAL,CAASR,IAAI,GAAGE,MAAhB,CAAf;AAEA,MAAMQ,KAAK,GAAG;AACZC,IAAAA,eAAe,EAAE,WADL;AAEZC,IAAAA,MAAM,EAAE,mBAFI;AAGZC,IAAAA,YAAY,EAAE,KAHF;AAIZJ,IAAAA,MAAM,EAANA,MAJY;AAKZN,IAAAA,IAAI,EAAJA,IALY;AAMZW,IAAAA,aAAa,EAAE,MANH;AAOZC,IAAAA,QAAQ,EAAE,UAPE;AAQZT,IAAAA,GAAG,EAAHA,GARY;AASZC,IAAAA,KAAK,EAALA,KATY;AAUZS,IAAAA,MAAM,EAAE;AAVI,GAAd;AAaA,sBACEC;AACE,IAAA,SAAS,EAAC,eADZ;AAEE,IAAA,KAAK,EAAEP;AAFT,IADF;AAMD;;AAEDb,YAAY,CAACqB,SAAb,GAAyB;AACvBpB,EAAAA,YAAY,EAAEqB,SAAS,CAACC,KAAV,CAAgB;AAC5BrB,IAAAA,IAAI,EAAEoB,SAAS,CAACE,MADY;AAE5BrB,IAAAA,IAAI,EAAEmB,SAAS,CAACE,MAFY;AAG5BpB,IAAAA,MAAM,EAAEkB,SAAS,CAACE,MAHU;AAI5BnB,IAAAA,MAAM,EAAEiB,SAAS,CAACE;AAJU,GAAhB;AADS,CAAzB;;;;"}
|