@flozy/editor 4.6.1 → 4.6.2
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/Editor/CommonEditor.js +17 -17
- package/dist/Editor/Editor.css +1 -32
- package/dist/Editor/Elements/AI/AIInput.js +5 -4
- package/dist/Editor/Elements/AI/PopoverAIInput.js +29 -40
- package/dist/Editor/Elements/AI/Styles.js +1 -1
- package/dist/Editor/Elements/Button/EditorButton.js +4 -8
- package/dist/Editor/Elements/Divider/Divider.js +8 -107
- package/dist/Editor/Elements/Embed/Embed.css +1 -1
- package/dist/Editor/Elements/Embed/Image.js +3 -4
- package/dist/Editor/Elements/Embed/Video.js +7 -9
- package/dist/Editor/Elements/Emoji/EmojiButton.js +23 -1
- package/dist/Editor/Elements/Form/Form.js +1 -0
- package/dist/Editor/Elements/Form/Workflow/FormWorkflow.js +12 -3
- package/dist/Editor/Elements/FreeGrid/FreeGrid.js +3 -56
- package/dist/Editor/Elements/FreeGrid/FreeGridBox.js +0 -2
- package/dist/Editor/Elements/FreeGrid/FreeGridItem.js +3 -7
- package/dist/Editor/Elements/FreeGrid/Options/AddElement.js +2 -16
- package/dist/Editor/Elements/FreeGrid/Options/sectionItemOptions.js +2 -8
- package/dist/Editor/Elements/FreeGrid/styles.js +1 -82
- package/dist/Editor/Elements/Signature/SignaturePopup.js +7 -24
- package/dist/Editor/Elements/Signature/Signed.js +1 -1
- package/dist/Editor/Elements/SimpleText/index.js +8 -7
- package/dist/Editor/Elements/Table/TableRow.js +1 -1
- package/dist/Editor/Styles/EditorStyles.js +2 -2
- package/dist/Editor/Toolbar/Mini/MiniToolbar.js +2 -1
- package/dist/Editor/Toolbar/PopupTool/ButtonTemplatesCard.js +29 -35
- package/dist/Editor/Toolbar/PopupTool/FullViewCard.js +30 -35
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +4 -4
- package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +38 -22
- package/dist/Editor/Toolbar/PopupTool/TextFormat.js +1 -0
- package/dist/Editor/Toolbar/PopupTool/index.js +5 -5
- package/dist/Editor/common/FontLoader/FontLoader.js +6 -6
- package/dist/Editor/common/Icon.js +1 -1
- package/dist/Editor/common/LinkSettings/index.js +3 -3
- package/dist/Editor/common/LinkSettings/navOptions.js +1 -4
- package/dist/Editor/common/RnD/DragOver/index.js +1 -0
- package/dist/Editor/common/RnD/ElementOptions/Actions.js +2 -15
- package/dist/Editor/common/RnD/ElementOptions/styles.js +0 -5
- package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Settings.js +1 -1
- package/dist/Editor/common/RnD/ElementSettings/OtherSettings/index.js +2 -32
- package/dist/Editor/common/RnD/ElementSettings/Settings/index.js +1 -3
- package/dist/Editor/common/RnD/ElementSettings/settingsConstants.js +2 -5
- package/dist/Editor/common/RnD/RnDCopy.js +0 -2
- package/dist/Editor/common/RnD/Utils/gridDropItem.js +3 -5
- package/dist/Editor/common/RnD/VirtualElement/index.js +1 -1
- package/dist/Editor/common/RnD/index.js +37 -67
- package/dist/Editor/common/Section/index.js +1 -11
- package/dist/Editor/common/Section/styles.js +0 -16
- package/dist/Editor/common/StyleBuilder/embedVideoStyle.js +0 -19
- package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +4 -19
- package/dist/Editor/common/SwipeableDrawer/index.js +15 -4
- package/dist/Editor/common/SwipeableDrawer/style.js +11 -3
- package/dist/Editor/common/iconslist.js +0 -23
- package/dist/Editor/helper/index.js +2 -5
- package/dist/Editor/helper/theme.js +2 -2
- package/dist/Editor/hooks/useBreakpoints.js +1 -1
- package/dist/Editor/hooks/useMouseMove.js +4 -5
- package/dist/Editor/hooks/withCommon.js +0 -1
- package/dist/Editor/utils/Decorators/index.js +2 -3
- package/dist/Editor/utils/RnD/RnDCtrlCmds.js +1 -16
- package/dist/Editor/utils/SlateUtilityFunctions.js +5 -33
- package/dist/Editor/utils/customHooks/useResize.js +5 -4
- package/dist/Editor/utils/events.js +0 -71
- package/dist/Editor/utils/helper.js +0 -16
- package/package.json +1 -1
- package/dist/Editor/Elements/Divider/DividerPopup.js +0 -24
- package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Signature.js +0 -53
- package/dist/Editor/common/RnD/ElementSettings/Settings/DividerSettings.js +0 -49
- package/dist/Editor/common/StyleBuilder/dividerStyles.js +0 -56
- package/dist/Editor/helper/RnD/focusNode.js +0 -74
- package/dist/Editor/hooks/useDragging.js +0 -51
- package/dist/Editor/hooks/withRestrictedNodes.js +0 -48
- package/dist/Editor/utils/Decorators/highlightSelection.js +0 -16
@@ -11,14 +11,12 @@ import DragInfo from "./DragInfo";
|
|
11
11
|
import GuideLines from "./GuideLines";
|
12
12
|
import ShadowElement from "./ShadowElement";
|
13
13
|
import BoundaryLine from "./GuideLines/BoundaryLine";
|
14
|
+
import DragOver from "./DragOver";
|
14
15
|
import ContextMenu from "./ContextMenu";
|
15
16
|
import VirtualElement from "./VirtualElement";
|
16
17
|
import { ItemTypes } from "./ElementSettings/settingsConstants";
|
17
18
|
import { focusSelection, clearSelection } from "../../helper";
|
18
19
|
import { selectText } from "../../utils/helper";
|
19
|
-
import { removeSign } from "./ElementSettings/OtherSettings";
|
20
|
-
import useDragging from "../../hooks/useDragging";
|
21
|
-
import { dragOverOn } from "../../helper/RnD/focusNode";
|
22
20
|
import { jsx as _jsx } from "react/jsx-runtime";
|
23
21
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
24
22
|
import { Fragment as _Fragment } from "react/jsx-runtime";
|
@@ -59,6 +57,7 @@ const RnD = props => {
|
|
59
57
|
const {
|
60
58
|
isSelectedElement,
|
61
59
|
setSelectedElement,
|
60
|
+
dragging,
|
62
61
|
updateDragging,
|
63
62
|
contextMenu,
|
64
63
|
setContextMenu,
|
@@ -76,25 +75,21 @@ const RnD = props => {
|
|
76
75
|
const open = Boolean(enable);
|
77
76
|
const currentAction = str_path === sp ? selectedAction : null;
|
78
77
|
const positionRef = useRef();
|
79
|
-
const {
|
80
|
-
draggingRef,
|
81
|
-
startDragging,
|
82
|
-
stopDragging,
|
83
|
-
setDragOver
|
84
|
-
} = useDragging();
|
85
|
-
const dragging = draggingRef?.current;
|
86
78
|
const {
|
87
79
|
active,
|
88
80
|
id,
|
89
|
-
parentPath
|
81
|
+
parentPath,
|
82
|
+
dragOver
|
90
83
|
} = dragging;
|
91
84
|
const dragInfoOpen = id === str_path;
|
85
|
+
const dragOverStatus = dragOver === str_path && parentPath !== str_path;
|
92
86
|
const [absPosition, setAbsPosition] = useState({});
|
93
87
|
const openContextMenu = contextMenu?.path === str_path;
|
94
88
|
const [position, setPosition] = useState({
|
95
89
|
x: 0,
|
96
90
|
y: 0
|
97
91
|
});
|
92
|
+
const pathIsDragging = dragOver === str_path && dragging?.isDragging;
|
98
93
|
const parentSectionPath = str_path?.split("|").slice(0, 2).join("_");
|
99
94
|
useEffect(() => {
|
100
95
|
if (ITEM_TYPES.includes(type)) {
|
@@ -151,6 +146,12 @@ const RnD = props => {
|
|
151
146
|
e.preventDefault();
|
152
147
|
e.stopPropagation();
|
153
148
|
}
|
149
|
+
|
150
|
+
// to prevent auto scroll to top
|
151
|
+
// when no editor.selection
|
152
|
+
if (!editor.selection) {
|
153
|
+
// Transforms.select(editor, Editor.end(editor, []));
|
154
|
+
}
|
154
155
|
switch (e.detail) {
|
155
156
|
case 1:
|
156
157
|
if (!enable) {
|
@@ -161,9 +162,7 @@ const RnD = props => {
|
|
161
162
|
anchorEl: rndRef?.current
|
162
163
|
});
|
163
164
|
}
|
164
|
-
|
165
|
-
path
|
166
|
-
});
|
165
|
+
// ReactEditor.focus(editor);
|
167
166
|
break;
|
168
167
|
case 2:
|
169
168
|
focusSelection(editor, {
|
@@ -226,13 +225,6 @@ const RnD = props => {
|
|
226
225
|
selectedActionPath: path
|
227
226
|
});
|
228
227
|
break;
|
229
|
-
case "signatureSettings":
|
230
|
-
setSelectedElement({
|
231
|
-
...selectedElementProps,
|
232
|
-
selectedAction: actionType,
|
233
|
-
selectedActionPath: path
|
234
|
-
});
|
235
|
-
break;
|
236
228
|
case "imageFrame":
|
237
229
|
setSelectedElement({
|
238
230
|
...selectedElementProps,
|
@@ -241,9 +233,6 @@ const RnD = props => {
|
|
241
233
|
selectedActionPath: path
|
242
234
|
});
|
243
235
|
break;
|
244
|
-
case "removeSign":
|
245
|
-
removeSign(editor, sp);
|
246
|
-
break;
|
247
236
|
case "saveAsTemplate":
|
248
237
|
const curPath = type === "parent" ? Path.parent(path) : path;
|
249
238
|
const currentNode = Node.get(editor, curPath);
|
@@ -281,7 +270,6 @@ const RnD = props => {
|
|
281
270
|
dragOver: null
|
282
271
|
}, null);
|
283
272
|
}
|
284
|
-
stopDragging();
|
285
273
|
};
|
286
274
|
const onDragStart = e => {
|
287
275
|
e.preventDefault();
|
@@ -300,9 +288,6 @@ const RnD = props => {
|
|
300
288
|
diffX: parseInt(Math.abs(Math.floor(left - e.clientX))),
|
301
289
|
diffY: parseInt(Math.abs(Math.floor(top - e.clientY)))
|
302
290
|
};
|
303
|
-
const parentPath = getParentSectionPath({
|
304
|
-
ref
|
305
|
-
}, ".freegrid-container-parent");
|
306
291
|
updateDragging({
|
307
292
|
...dragging,
|
308
293
|
active: true,
|
@@ -315,25 +300,20 @@ const RnD = props => {
|
|
315
300
|
height
|
316
301
|
},
|
317
302
|
isDragging: 1,
|
318
|
-
parentPath
|
303
|
+
parentPath: getParentSectionPath({
|
304
|
+
ref
|
305
|
+
}, ".freegrid-container-parent")
|
319
306
|
});
|
320
307
|
setPosition({
|
321
308
|
...updatedPosition
|
322
309
|
});
|
323
|
-
startDragging({
|
324
|
-
active: true,
|
325
|
-
id: str_path,
|
326
|
-
position: {
|
327
|
-
...updatedPosition
|
328
|
-
},
|
329
|
-
isDragging: 1,
|
330
|
-
parentPath
|
331
|
-
});
|
332
310
|
}
|
333
311
|
};
|
334
|
-
const onDrag = e => {
|
312
|
+
const onDrag = (e, d) => {
|
335
313
|
e.preventDefault();
|
314
|
+
e.stopPropagation();
|
336
315
|
const lines = getClosestDraggable(e.clientX, e.clientY, `.freegrid-section_${parentSectionPath} .freegrid-container .freegrid-item.inactive-drag`.replace(/\|/g, "\\|"), ".freegrid-item.active-drag:not(.exclude-virtual)");
|
316
|
+
console.log(lines);
|
337
317
|
setAbsPosition({
|
338
318
|
...absPosition,
|
339
319
|
"--zIndex": 2000
|
@@ -353,34 +333,16 @@ const RnD = props => {
|
|
353
333
|
y: e.clientY,
|
354
334
|
lines: lines
|
355
335
|
});
|
356
|
-
const isDragOverOnParent = {};
|
357
|
-
let dragOverEle = e?.toElement?.dataset?.dragovertype !== "child" ? e?.toElement : e?.toElement?.closest(".freegrid-container-parent");
|
358
|
-
|
359
|
-
// some cases
|
360
|
-
if (dragOverEle?.dataset?.dragovertype === undefined) {
|
361
|
-
// means check for parent element
|
362
|
-
dragOverEle = e?.toElement?.parentElement;
|
363
|
-
}
|
364
|
-
if (dragOverEle?.dataset?.dragovertype !== "child") {
|
365
|
-
const oldPath = dragging.dragOver;
|
366
|
-
isDragOverOnParent.dragOver = dragOverEle?.dataset?.dragoverid;
|
367
|
-
isDragOverOnParent.dragOverType = dragOverEle?.dataset?.dragovertype;
|
368
|
-
dragOverOn(oldPath, dragOverEle?.dataset?.dragoverid);
|
369
|
-
}
|
370
|
-
startDragging({
|
371
|
-
isDragging: 2,
|
372
|
-
...isDragOverOnParent
|
373
|
-
});
|
374
336
|
};
|
375
337
|
const onDragStop = (e, d) => {
|
376
338
|
e.preventDefault();
|
377
339
|
e.stopPropagation();
|
378
|
-
if (dragging?.isDragging === 2 && dragging?.position?.strXY
|
340
|
+
if (dragging?.isDragging === 2 && dragging?.position?.strXY) {
|
379
341
|
d.x = e.x;
|
380
342
|
d.y = e.y;
|
381
343
|
d.offsetX = e.offsetX;
|
382
344
|
d.offsetY = e.offsetY;
|
383
|
-
d.dragOver =
|
345
|
+
d.dragOver = dragOver;
|
384
346
|
d.parentPath = parentPath;
|
385
347
|
d.diffX = position?.diffX;
|
386
348
|
d.diffY = position?.diffY;
|
@@ -408,11 +370,17 @@ const RnD = props => {
|
|
408
370
|
setAbsPosition({
|
409
371
|
...ud
|
410
372
|
});
|
411
|
-
stopDragging();
|
412
373
|
} else {
|
413
374
|
// invalid drags
|
414
375
|
// found in dev mode and in safari browser
|
415
|
-
|
376
|
+
updateDragging({
|
377
|
+
isDragging: 0,
|
378
|
+
position: {},
|
379
|
+
lines: [],
|
380
|
+
active: false,
|
381
|
+
id: null
|
382
|
+
});
|
383
|
+
setPosition({});
|
416
384
|
}
|
417
385
|
};
|
418
386
|
const onResizeStop = (e, direction, ref, d, position) => {
|
@@ -463,9 +431,6 @@ const RnD = props => {
|
|
463
431
|
e.stopPropagation();
|
464
432
|
}
|
465
433
|
if (type !== "child") {
|
466
|
-
setDragOver({
|
467
|
-
dragOver: str_path
|
468
|
-
});
|
469
434
|
updateDragging({
|
470
435
|
dragOver: str_path
|
471
436
|
}, str_path);
|
@@ -539,9 +504,14 @@ const RnD = props => {
|
|
539
504
|
"data-event": "rnd-click",
|
540
505
|
className: "editor-blocker",
|
541
506
|
"data-path": path,
|
542
|
-
contentEditable: false
|
543
|
-
|
544
|
-
|
507
|
+
contentEditable: false
|
508
|
+
}) : null, pathIsDragging ? /*#__PURE__*/_jsx(DragOver, {
|
509
|
+
status: dragOverStatus,
|
510
|
+
hover_on: dragOver,
|
511
|
+
path: str_path,
|
512
|
+
parentPath: parentPath,
|
513
|
+
type: type,
|
514
|
+
childType: childType
|
545
515
|
}) : null]
|
546
516
|
}, eId), !active && rndRef?.current && open ? /*#__PURE__*/_jsx(ElementOptions, {
|
547
517
|
id: `opt_ref_${str_path}`,
|
@@ -104,13 +104,6 @@ const Section = props => {
|
|
104
104
|
};
|
105
105
|
const isFreeGrid = element?.children?.find(f => f.type === "freegrid");
|
106
106
|
const needHover = element?.children?.find(f => f.type === "grid" && !list_types.includes(element.type)) ? "needHover" : "";
|
107
|
-
let tempProps = {};
|
108
|
-
if (element?.type === "temp") {
|
109
|
-
tempProps = {
|
110
|
-
"--left": `${element?.left}px`,
|
111
|
-
"--top": `${element?.top}px`
|
112
|
-
};
|
113
|
-
}
|
114
107
|
const sectionBgImage = sectionBackgroundImage && sectionBackgroundImage !== "none" ? {
|
115
108
|
backgroundImage: `url(${sectionBackgroundImage})`
|
116
109
|
} : {};
|
@@ -129,10 +122,7 @@ const Section = props => {
|
|
129
122
|
}, theme);
|
130
123
|
return path.length === 1 && !isFreeGrid ? /*#__PURE__*/_jsxs(Box, {
|
131
124
|
component: "div",
|
132
|
-
className: `ed-section-wrapper ${readOnly ? "" : "hselect"} ${needHover}
|
133
|
-
style: {
|
134
|
-
...tempProps
|
135
|
-
},
|
125
|
+
className: `ed-section-wrapper ${readOnly ? "" : "hselect"} ${needHover}`,
|
136
126
|
sx: {
|
137
127
|
...classes.root,
|
138
128
|
background: sectionBgColor,
|
@@ -52,22 +52,6 @@ const SectionStyle = theme => ({
|
|
52
52
|
[theme.breakpoints.between("xs", "md")]: {
|
53
53
|
maxWidth: `320px !important`
|
54
54
|
}
|
55
|
-
},
|
56
|
-
"&.is-temp": {
|
57
|
-
position: "fixed",
|
58
|
-
background: "transparent",
|
59
|
-
padding: "12px",
|
60
|
-
width: "10px",
|
61
|
-
height: "10px",
|
62
|
-
left: 0,
|
63
|
-
top: 0,
|
64
|
-
bottom: 0,
|
65
|
-
right: 0,
|
66
|
-
margin: "auto",
|
67
|
-
// left: "var(--left)",
|
68
|
-
// top: "var(--top)",
|
69
|
-
zIndex: 1000,
|
70
|
-
pointerEvents: "none"
|
71
55
|
}
|
72
56
|
}
|
73
57
|
});
|
@@ -6,25 +6,6 @@ const embedVideoStyle = [{
|
|
6
6
|
label: "URL",
|
7
7
|
key: "url",
|
8
8
|
type: "text"
|
9
|
-
}, {
|
10
|
-
label: "Aspect Ratio",
|
11
|
-
key: "aspectRatio",
|
12
|
-
type: "textOptions",
|
13
|
-
options: [{
|
14
|
-
text: "Cover (Default)",
|
15
|
-
value: ""
|
16
|
-
}, {
|
17
|
-
text: "16:9",
|
18
|
-
value: "16 / 9"
|
19
|
-
}, {
|
20
|
-
text: "9:16",
|
21
|
-
value: "9 / 16"
|
22
|
-
}],
|
23
|
-
renderOption: option => {
|
24
|
-
return /*#__PURE__*/_jsx("span", {
|
25
|
-
children: option.text
|
26
|
-
});
|
27
|
-
}
|
28
9
|
}]
|
29
10
|
}, {
|
30
11
|
tab: "Position",
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import React, { useEffect, useState } from "react";
|
2
|
-
import { Grid, TextField, InputAdornment, Typography
|
2
|
+
import { Grid, TextField, InputAdornment, Typography } from "@mui/material";
|
3
3
|
import ColorPickerButton from "../../ColorPickerButton";
|
4
4
|
import { jsx as _jsx } from "react/jsx-runtime";
|
5
5
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
@@ -46,30 +46,15 @@ const Color = props => {
|
|
46
46
|
item: true,
|
47
47
|
xs: 12,
|
48
48
|
className: "btnColorPicker",
|
49
|
-
children: [/*#__PURE__*/
|
49
|
+
children: [/*#__PURE__*/_jsx(Typography, {
|
50
50
|
variant: "body1",
|
51
51
|
color: "primary",
|
52
52
|
sx: {
|
53
53
|
fontSize: "14px",
|
54
54
|
fontWeight: 500,
|
55
|
-
marginBottom: "5px"
|
56
|
-
display: 'flex',
|
57
|
-
alignItems: 'center',
|
58
|
-
'& svg': {
|
59
|
-
width: '20px',
|
60
|
-
height: '20px'
|
61
|
-
}
|
55
|
+
marginBottom: "5px"
|
62
56
|
},
|
63
|
-
children:
|
64
|
-
arrow: true,
|
65
|
-
title: "Note: If color gradient is used, divider styles will not apply",
|
66
|
-
children: /*#__PURE__*/_jsx("span", {
|
67
|
-
style: {
|
68
|
-
display: 'inline-block'
|
69
|
-
},
|
70
|
-
children: data?.infoIcon
|
71
|
-
})
|
72
|
-
}) : null]
|
57
|
+
children: label
|
73
58
|
}), /*#__PURE__*/_jsx(TextField, {
|
74
59
|
fullWidth: true,
|
75
60
|
value: value,
|
@@ -2,6 +2,7 @@ import { Box, SwipeableDrawer } from "@mui/material";
|
|
2
2
|
import DrawerStyles from "./style";
|
3
3
|
import { grey } from "@mui/material/colors";
|
4
4
|
import { styled } from "@mui/material/styles";
|
5
|
+
import { useEditorContext } from "../../hooks/useMouseMove";
|
5
6
|
import { jsx as _jsx } from "react/jsx-runtime";
|
6
7
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
7
8
|
const Puller = styled("div")(({
|
@@ -17,15 +18,25 @@ const Puller = styled("div")(({
|
|
17
18
|
function SwipeableDrawerComponent({
|
18
19
|
open,
|
19
20
|
onClose,
|
20
|
-
children
|
21
|
+
children,
|
22
|
+
customClass
|
21
23
|
}) {
|
22
|
-
const
|
24
|
+
const {
|
25
|
+
theme
|
26
|
+
} = useEditorContext();
|
27
|
+
const classes = DrawerStyles(theme);
|
28
|
+
const handleClose = e => {
|
29
|
+
e.stopPropagation();
|
30
|
+
onClose();
|
31
|
+
};
|
23
32
|
return /*#__PURE__*/_jsxs(SwipeableDrawer, {
|
33
|
+
disableSwipeToOpen: true,
|
24
34
|
anchor: "bottom",
|
25
|
-
open:
|
26
|
-
onClose:
|
35
|
+
open: open,
|
36
|
+
onClose: handleClose,
|
27
37
|
sx: classes.drawerContainer,
|
28
38
|
children: [/*#__PURE__*/_jsx(Puller, {}), /*#__PURE__*/_jsx(Box, {
|
39
|
+
className: customClass,
|
29
40
|
sx: classes.childContainer,
|
30
41
|
children: children
|
31
42
|
})]
|
@@ -1,12 +1,20 @@
|
|
1
|
-
const Styles =
|
1
|
+
const Styles = theme => ({
|
2
2
|
drawerContainer: {
|
3
|
+
"&.MuiDrawer-root": {
|
4
|
+
zIndex: 1301
|
5
|
+
},
|
3
6
|
"& .MuiDrawer-paper": {
|
4
7
|
borderTopLeftRadius: 8,
|
5
|
-
borderTopRightRadius: 8
|
8
|
+
borderTopRightRadius: 8,
|
9
|
+
backgroundColor: theme.palette.containers.card
|
6
10
|
}
|
7
11
|
},
|
8
12
|
childContainer: {
|
9
|
-
padding: "20px"
|
13
|
+
padding: "20px",
|
14
|
+
'&.emojiDrawer': {
|
15
|
+
padding: 'unset',
|
16
|
+
paddingTop: '10px'
|
17
|
+
}
|
10
18
|
}
|
11
19
|
});
|
12
20
|
export default Styles;
|
@@ -2337,27 +2337,4 @@ export const ResetIcon = () => /*#__PURE__*/_jsxs("svg", {
|
|
2337
2337
|
strokeLinecap: "round",
|
2338
2338
|
strokeLinejoin: "round"
|
2339
2339
|
})]
|
2340
|
-
});
|
2341
|
-
export const SignaturePlaceholderIcon = () => /*#__PURE__*/_jsxs("svg", {
|
2342
|
-
width: "39",
|
2343
|
-
height: "29",
|
2344
|
-
viewBox: "0 0 39 29",
|
2345
|
-
fill: "none",
|
2346
|
-
xmlns: "http://www.w3.org/2000/svg",
|
2347
|
-
children: [/*#__PURE__*/_jsx("path", {
|
2348
|
-
d: "M32.9361 2.30469L18.7107 16.5287C17.8881 17.3501 17.8881 18.6836 18.7107 19.5061L19.4967 20.2922C20.3182 21.1137 21.6528 21.1137 22.4742 20.2922L36.701 6.06677L32.9361 2.30469Z",
|
2349
|
-
fill: "#64748B"
|
2350
|
-
}), /*#__PURE__*/_jsx("path", {
|
2351
|
-
d: "M18.0898 20.1246C17.7023 19.7372 17.4549 19.2631 17.3415 18.7656L17.277 18.9424C17.1454 19.3043 16.9272 19.899 16.7945 20.2609L15.9122 22.6728C15.9074 22.6848 15.906 22.6972 15.9023 22.7056L16.9701 21.6392C17.0787 21.532 17.254 21.532 17.3626 21.6392C17.4711 21.7489 17.4711 21.9245 17.3626 22.0317L16.2962 23.1006C16.3083 23.0958 16.3181 23.0933 16.3304 23.0885L18.7423 22.2073C19.1042 22.0743 19.6978 21.8575 20.0608 21.7248L20.2376 21.6602C19.739 21.5458 19.2649 21.2983 18.8774 20.9132L18.0898 20.1246Z",
|
2352
|
-
fill: "#64748B"
|
2353
|
-
}), /*#__PURE__*/_jsx("path", {
|
2354
|
-
d: "M38.3842 1.40407L37.5982 0.617994C36.7756 -0.205998 35.4421 -0.205998 34.6207 0.617994L33.5664 1.67231L37.3299 5.43583L38.3842 4.38151C39.2057 3.55896 39.2057 2.22547 38.3842 1.40407Z",
|
2355
|
-
fill: "#64748B"
|
2356
|
-
}), /*#__PURE__*/_jsx("path", {
|
2357
|
-
d: "M36.7307 7.02477L30.3199 13.4356C30.0626 13.6928 30.0626 14.1095 30.3199 14.3667C30.5772 14.624 30.9938 14.624 31.251 14.3667L37.6604 7.95591C37.9177 7.69865 37.9177 7.28204 37.6604 7.02477C37.4034 6.76779 36.9865 6.76779 36.7307 7.02477Z",
|
2358
|
-
fill: "#64748B"
|
2359
|
-
}), /*#__PURE__*/_jsx("path", {
|
2360
|
-
d: "M19.034 24.3978H14.2468C12.5175 24.3978 11.4972 24.7574 10.8208 24.9951C10.0347 25.2742 9.97013 25.295 9.23397 24.6259C9.00841 24.4185 8.79632 24.1408 8.57216 23.8445C8.02117 23.1207 7.33161 22.2115 6.14206 22.2833C4.44193 22.3784 4.29183 24.1467 4.20291 25.2035C4.18833 25.3814 4.17121 25.58 4.14821 25.775C4.03234 25.4131 3.9204 25.0181 3.83511 24.7159C3.69624 24.221 3.55232 23.7116 3.39746 23.2826C3.07567 22.3966 2.51371 22.276 2.17738 22.2833C1.84465 22.2906 0.959808 22.3088 0.0410129 25.2229C-0.105155 25.6847 0.151831 26.1773 0.613894 26.3246C1.0782 26.4697 1.57054 26.2124 1.71698 25.7506C1.81208 25.4485 1.92907 25.134 2.04719 24.8512C2.07889 24.9634 2.11171 25.0779 2.14341 25.1912C2.59566 26.7976 2.95282 28.0638 3.9229 28.2955C3.99725 28.3126 4.08982 28.3261 4.19699 28.3261C4.47474 28.3261 4.84534 28.2285 5.20499 27.8337C5.79863 27.1843 5.88139 26.2102 5.95321 25.3534C5.98744 24.9438 6.05196 24.1796 6.23853 24.0371C6.49214 24.0273 6.76625 24.3724 7.17334 24.9085C7.42331 25.2376 7.70723 25.6104 8.05091 25.9224C9.46232 27.2081 10.2594 27.0558 11.4048 26.6512C12.0338 26.4293 12.8174 26.1541 14.2457 26.1541H19.0329C19.518 26.1541 19.9116 25.7591 19.9116 25.2754C19.9127 24.7915 19.5205 24.3979 19.034 24.3979L19.034 24.3978Z",
|
2361
|
-
fill: "#64748B"
|
2362
|
-
})]
|
2363
2340
|
});
|
@@ -4,8 +4,6 @@ import html2canvas from "html2canvas";
|
|
4
4
|
import { rectIntersection, closestCenter } from "@dnd-kit/core";
|
5
5
|
import { getQueryStrings } from "../utils/SlateUtilityFunctions";
|
6
6
|
import { Node } from "slate";
|
7
|
-
import { focusUsingTemporaryNode } from "./RnD/focusNode";
|
8
|
-
// import { focusUsingTemporaryNode } from "./RnD/focusNode";
|
9
7
|
const HIDE_PLACHOLDERS = ["grid", "grid-item", "table"];
|
10
8
|
const PREVIEW_IMAGE_HIDE_CLASS = ["grid-container-toolbar", "grid-item-toolbar", "element-toolbar", "mini-tool-wrpr-ei", "element-selector", "element-selector-ctrl"];
|
11
9
|
const RND_ITEMS = ["freegridItem", "freegridBox"];
|
@@ -256,9 +254,8 @@ export const focusSelection = (editor, {
|
|
256
254
|
const selectedDOM = ReactEditor.toDOMNode(editor, selectedNode);
|
257
255
|
selectedDOM.scrollIntoView({
|
258
256
|
behavior: "smooth",
|
259
|
-
block: "
|
257
|
+
block: "center"
|
260
258
|
});
|
261
|
-
focusUsingTemporaryNode(editor, selectedDOM);
|
262
259
|
} catch (err) {
|
263
260
|
console.log(err);
|
264
261
|
}
|
@@ -305,7 +302,7 @@ export const getTextColor = (color = "") => {
|
|
305
302
|
WebkitTextFillColor: "transparent !important",
|
306
303
|
color: "transparent !important",
|
307
304
|
caretColor: "black",
|
308
|
-
|
305
|
+
'& span': {
|
309
306
|
color: "transparent !important"
|
310
307
|
}
|
311
308
|
} : {
|
@@ -139,10 +139,10 @@ export const groupByBreakpoint = (styleProps, theme) => {
|
|
139
139
|
return a;
|
140
140
|
}, {});
|
141
141
|
return {
|
142
|
-
[theme
|
142
|
+
[theme.breakpoints.up("lg")]: {
|
143
143
|
...groupedLG
|
144
144
|
},
|
145
|
-
[theme
|
145
|
+
[theme.breakpoints.between("xs", "md")]: {
|
146
146
|
...groupedXS
|
147
147
|
}
|
148
148
|
};
|
@@ -98,11 +98,10 @@ export const EditorProvider = ({
|
|
98
98
|
updateDragging,
|
99
99
|
fontFamilies,
|
100
100
|
setFontFamilies
|
101
|
-
}), [path, editor?.selection, selectedPath, selectedElement,
|
102
|
-
//
|
103
|
-
|
104
|
-
|
105
|
-
contextMenu, openAI, popupType, drop]);
|
101
|
+
}), [path, editor?.selection, selectedPath, selectedElement, dragging.active, dragging.isDragging, dragging.dragOver, contextMenu, openAI, popupType, drop
|
102
|
+
// fontFamilies,
|
103
|
+
]);
|
104
|
+
|
106
105
|
return /*#__PURE__*/_jsx(EditorContext.Provider, {
|
107
106
|
value: otherValues,
|
108
107
|
children: children
|
@@ -9,7 +9,6 @@ import withLayout from "../plugins/withLayout";
|
|
9
9
|
import withHtml from "../plugins/withHTML";
|
10
10
|
import withErrorHandling from "./withErrorHandling";
|
11
11
|
import withCustomDeleteBackward from "../plugins/withCustomDeleteBackward";
|
12
|
-
import withRestrictedNodes from "./withRestrictedNodes";
|
13
12
|
const withCommon = (props, {
|
14
13
|
needLayout = false,
|
15
14
|
isChatEditor = false
|
@@ -1,6 +1,5 @@
|
|
1
|
-
import highlightSelection from "./highlightSelection";
|
2
1
|
import link from "./link";
|
3
|
-
const decorators =
|
4
|
-
return [...link(d
|
2
|
+
const decorators = d => {
|
3
|
+
return [...link(d)];
|
5
4
|
};
|
6
5
|
export default decorators;
|
@@ -1,7 +1,6 @@
|
|
1
1
|
import { Editor, Transforms, Node, Path } from "slate";
|
2
2
|
import { isSelectionInNodeType, getCaretPosition, onPasteRnDNode, bringItemToFB } from "../../helper";
|
3
3
|
import focusOnNewItem from "../../helper/RnD/focusOnNewItem";
|
4
|
-
import { ReactEditor } from "slate-react";
|
5
4
|
const RND_ITEM_TYPES = ["freegrid", "freegridItem", "freegridBox"];
|
6
5
|
const parsePath = path => path?.split("|").map(m => parseInt(m));
|
7
6
|
const selectAll = (event, {
|
@@ -158,7 +157,7 @@ const onBringBack = (event, {
|
|
158
157
|
console.log(err);
|
159
158
|
}
|
160
159
|
};
|
161
|
-
export const onInsertFragment = ({
|
160
|
+
export const onInsertFragment = async ({
|
162
161
|
editor,
|
163
162
|
slateNodes
|
164
163
|
}) => {
|
@@ -182,20 +181,6 @@ export const onInsertFragment = ({
|
|
182
181
|
setSelectedElement: window.updateSelectedItem
|
183
182
|
});
|
184
183
|
}
|
185
|
-
} else {
|
186
|
-
ReactEditor.focus(editor);
|
187
|
-
if (editor.children.length === 0) {
|
188
|
-
Transforms.insertNodes(editor, {
|
189
|
-
text: ""
|
190
|
-
}, {
|
191
|
-
at: [0]
|
192
|
-
});
|
193
|
-
}
|
194
|
-
Transforms.insertNodes(editor, [{
|
195
|
-
...slateNodes
|
196
|
-
}], {
|
197
|
-
at: [editor.children.length - 1]
|
198
|
-
});
|
199
184
|
}
|
200
185
|
} catch (err) {
|
201
186
|
console.log(err);
|
@@ -34,7 +34,7 @@ import SimpleText from "../Elements/SimpleText";
|
|
34
34
|
import CheckList from "../Elements/List/CheckList";
|
35
35
|
import { getTextColor, isEmptyTextNode } from "../helper";
|
36
36
|
import Attachments from "../Elements/Attachments/Attachments";
|
37
|
-
import { getBreakPointsValue
|
37
|
+
import { getBreakPointsValue } from "../helper/theme";
|
38
38
|
import Variables from "../Elements/Variables/Variable";
|
39
39
|
import insertNewLine from "./insertNewLine";
|
40
40
|
import Divider from "../Elements/Divider/Divider";
|
@@ -216,20 +216,10 @@ export const getMarked = (leaf, children, theme) => {
|
|
216
216
|
className: className,
|
217
217
|
component: "span",
|
218
218
|
sx: {
|
219
|
-
...
|
220
|
-
|
221
|
-
|
222
|
-
|
223
|
-
}
|
224
|
-
}, theme),
|
225
|
-
// ...wrapThemeBreakpoints(
|
226
|
-
// {
|
227
|
-
// lg: sizeMap[leaf.fontSize] || leaf.fontSize,
|
228
|
-
// ...getBreakPointsValue(leaf.fontSize, null, "overrideText"),
|
229
|
-
// },
|
230
|
-
// "fontSize",
|
231
|
-
// theme
|
232
|
-
// ),
|
219
|
+
...wrapThemeBreakpoints({
|
220
|
+
lg: sizeMap[leaf.fontSize] || leaf.fontSize,
|
221
|
+
...getBreakPointsValue(leaf.fontSize, null, "overrideText")
|
222
|
+
}, "fontSize", theme),
|
233
223
|
// fontSize: {
|
234
224
|
// lg: sizeMap[leaf.fontSize] || leaf.fontSize,
|
235
225
|
// ...getBreakPointsValue(leaf.fontSize, null, "overrideText"),
|
@@ -242,15 +232,6 @@ export const getMarked = (leaf, children, theme) => {
|
|
242
232
|
})
|
243
233
|
});
|
244
234
|
}
|
245
|
-
if (leaf.highlight) {
|
246
|
-
children = /*#__PURE__*/_jsx("span", {
|
247
|
-
style: {
|
248
|
-
background: "#EAEBFE",
|
249
|
-
color: "inherit"
|
250
|
-
},
|
251
|
-
children: children
|
252
|
-
});
|
253
|
-
}
|
254
235
|
if (leaf.decoration === "link") {
|
255
236
|
children = /*#__PURE__*/_jsx("a", {
|
256
237
|
style: {
|
@@ -548,15 +529,6 @@ export const getBlock = props => {
|
|
548
529
|
return /*#__PURE__*/_jsx(Code, {
|
549
530
|
...props
|
550
531
|
});
|
551
|
-
// RnD Focus Node
|
552
|
-
case "temp":
|
553
|
-
return /*#__PURE__*/_jsx("span", {
|
554
|
-
...attributes,
|
555
|
-
...element.attr,
|
556
|
-
className: "temp-focus-node",
|
557
|
-
contentEditable: false,
|
558
|
-
children: children
|
559
|
-
});
|
560
532
|
default:
|
561
533
|
return /*#__PURE__*/_jsx(SimpleText, {
|
562
534
|
...props,
|
@@ -10,7 +10,7 @@ const useResize = ({
|
|
10
10
|
const defaultSize = getBreakPointsValue(allSize);
|
11
11
|
const {
|
12
12
|
width,
|
13
|
-
height
|
13
|
+
height = 370
|
14
14
|
} = parentDOM?.getBoundingClientRect() || {
|
15
15
|
...defaultSize
|
16
16
|
};
|
@@ -50,10 +50,11 @@ const useResize = ({
|
|
50
50
|
setSize(currentSize => {
|
51
51
|
const calcWidth = (currentSize.width || width) + e.movementX;
|
52
52
|
const cWP = calcWidth / width * 100;
|
53
|
+
const calcHeight = (parseInt(currentSize.height) || height) + e.movementY;
|
53
54
|
const calc = {
|
54
|
-
width: calcWidth,
|
55
|
-
height: (
|
56
|
-
widthInPercent: cWP > 100 ? 100 : cWP
|
55
|
+
width: Math.max(calcWidth, 140),
|
56
|
+
height: Math.max(calcHeight, 50),
|
57
|
+
widthInPercent: cWP > 100 ? 100 : Math.max(cWP, 15)
|
57
58
|
};
|
58
59
|
latest = calc;
|
59
60
|
return calc;
|