@flozy/editor 1.7.0 → 1.7.2
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/Editor/CommonEditor.js +9 -79
- package/dist/Editor/Editor.css +11 -0
- package/dist/Editor/Elements/Button/EditorButton.js +7 -3
- package/dist/Editor/Elements/Carousel/Carousel.js +4 -4
- package/dist/Editor/Elements/Embed/Image.js +5 -1
- package/dist/Editor/Elements/Form/Form.js +3 -3
- package/dist/Editor/Elements/Form/Workflow/FormWorkflow.js +17 -12
- package/dist/Editor/Elements/Form/Workflow/MoreOptions.js +4 -7
- package/dist/Editor/Elements/Form/Workflow/Styles.js +97 -89
- package/dist/Editor/Elements/Form/Workflow/UserInputs.js +10 -15
- package/dist/Editor/Elements/Form/Workflow/index.js +23 -24
- package/dist/Editor/Elements/Grid/Grid.js +9 -1
- package/dist/Editor/Elements/Grid/GridItem.js +3 -0
- package/dist/Editor/Elements/Signature/SignaturePopup.js +8 -3
- package/dist/Editor/Elements/SimpleText.js +9 -4
- package/dist/Editor/MiniEditor.js +118 -0
- package/dist/Editor/Styles/EditorStyles.js +20 -0
- package/dist/Editor/Toolbar/PopupTool/TextFormat.js +1 -1
- package/dist/Editor/common/DnD/DragHandle.js +99 -0
- package/dist/Editor/common/DnD/Draggable.js +41 -0
- package/dist/Editor/common/DnD/Droppable.js +28 -0
- package/dist/Editor/common/DnD/index.js +48 -0
- package/dist/Editor/common/StyleBuilder/sectionStyle.js +8 -0
- package/dist/Editor/common/iconslist.js +17 -1
- package/dist/Editor/hooks/useMouseMove.js +9 -1
- package/dist/Editor/utils/helper.js +1 -0
- package/dist/Editor/utils/pageSettings.js +2 -2
- package/dist/Editor/utils/serializeToHTML.js +5 -0
- package/dist/Editor/utils/{serializer.js → serializeToText.js} +3 -3
- package/dist/index.js +2 -0
- package/package.json +1 -1
- package/dist/Editor/Elements/Section.js +0 -42
@@ -0,0 +1,48 @@
|
|
1
|
+
import React from "react";
|
2
|
+
import { Transforms, Node } from "slate";
|
3
|
+
import { useSlateStatic } from "slate-react";
|
4
|
+
import { DndContext } from "@dnd-kit/core";
|
5
|
+
import { customCollisionDetectionAlgorithm } from "../../helper";
|
6
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
7
|
+
const DragAndDrop = ({
|
8
|
+
children
|
9
|
+
}) => {
|
10
|
+
const editor = useSlateStatic();
|
11
|
+
const handleDragStart = e => {
|
12
|
+
try {
|
13
|
+
// console.log(e);
|
14
|
+
} catch (err) {
|
15
|
+
console.log(err);
|
16
|
+
}
|
17
|
+
};
|
18
|
+
const handleDragEnd = e => {
|
19
|
+
try {
|
20
|
+
const {
|
21
|
+
active,
|
22
|
+
over
|
23
|
+
} = e;
|
24
|
+
const fromPath = active.id.split("_")[1].split("|");
|
25
|
+
const toPath = over.id.split("_")[1].split("|");
|
26
|
+
const toCloneNode = JSON.stringify(Node.get(editor, fromPath));
|
27
|
+
// set moved node delete
|
28
|
+
Transforms.setNodes(editor, {
|
29
|
+
moved: true
|
30
|
+
}, {
|
31
|
+
at: [...fromPath]
|
32
|
+
});
|
33
|
+
// clone node in the moved path
|
34
|
+
Transforms.insertNodes(editor, JSON.parse(toCloneNode), {
|
35
|
+
at: [...toPath]
|
36
|
+
});
|
37
|
+
} catch (err) {
|
38
|
+
console.log(err);
|
39
|
+
}
|
40
|
+
};
|
41
|
+
return /*#__PURE__*/_jsx(DndContext, {
|
42
|
+
collisionDetection: customCollisionDetectionAlgorithm,
|
43
|
+
onDragStart: handleDragStart,
|
44
|
+
onDragEnd: handleDragEnd,
|
45
|
+
children: children
|
46
|
+
});
|
47
|
+
};
|
48
|
+
export default DragAndDrop;
|
@@ -26,5 +26,13 @@ const gridStyle = [{
|
|
26
26
|
key: "sectionBannerSpacing",
|
27
27
|
type: "bannerSpacing"
|
28
28
|
}]
|
29
|
+
}, {
|
30
|
+
tab: "Border",
|
31
|
+
value: "sectionBorderRadius",
|
32
|
+
fields: [{
|
33
|
+
label: "Border",
|
34
|
+
key: "sectionBorderRadius",
|
35
|
+
type: "borderRadius"
|
36
|
+
}]
|
29
37
|
}];
|
30
38
|
export default gridStyle;
|
@@ -1529,4 +1529,20 @@ export const UploadImage = () => /*#__PURE__*/_jsx("svg", {
|
|
1529
1529
|
fill: "#64748B",
|
1530
1530
|
stroke: "#64748B"
|
1531
1531
|
})
|
1532
|
-
});
|
1532
|
+
});
|
1533
|
+
export const WorkflowIcon = () => {
|
1534
|
+
return /*#__PURE__*/_jsxs("svg", {
|
1535
|
+
xmlns: "http://www.w3.org/2000/svg",
|
1536
|
+
fill: "#000000",
|
1537
|
+
width: "800px",
|
1538
|
+
height: "800px",
|
1539
|
+
viewBox: "0 0 32 32",
|
1540
|
+
version: "1.1",
|
1541
|
+
children: [/*#__PURE__*/_jsx("title", {
|
1542
|
+
children: "lightning-bolt"
|
1543
|
+
}), /*#__PURE__*/_jsx("path", {
|
1544
|
+
d: "M23.5 13.187h-7.5v-12.187l-7.5 17.813h7.5v12.187l7.5-17.813z",
|
1545
|
+
fill: "#f3b814"
|
1546
|
+
})]
|
1547
|
+
});
|
1548
|
+
};
|
@@ -6,7 +6,11 @@ export const EditorProvider = ({
|
|
6
6
|
}) => {
|
7
7
|
const [event] = useMouseMove();
|
8
8
|
const [previous, setPrevious] = useState("");
|
9
|
+
const [drop, setDrop] = useState(0);
|
9
10
|
const path = event?.target?.getAttribute("data-path");
|
11
|
+
const onDrop = () => {
|
12
|
+
setDrop(drop + 1);
|
13
|
+
};
|
10
14
|
const value = useMemo(() => {
|
11
15
|
if (path) {
|
12
16
|
setPrevious(path);
|
@@ -20,7 +24,11 @@ export const EditorProvider = ({
|
|
20
24
|
}
|
21
25
|
}, [path]);
|
22
26
|
return /*#__PURE__*/_jsx(EditorContext.Provider, {
|
23
|
-
value:
|
27
|
+
value: {
|
28
|
+
...(value || {}),
|
29
|
+
onDrop: onDrop,
|
30
|
+
drop
|
31
|
+
},
|
24
32
|
children: children
|
25
33
|
});
|
26
34
|
};
|
@@ -1,4 +1,4 @@
|
|
1
|
-
export const
|
1
|
+
export const serializeToText = node => {
|
2
2
|
try {
|
3
3
|
if (!node?.type && node?.text) {
|
4
4
|
return node?.text;
|
@@ -6,8 +6,8 @@ export const serialize = node => {
|
|
6
6
|
let n = Array.isArray(node) ? node : node?.children;
|
7
7
|
n = n && Array.isArray(n) ? n : n ? [n] : [];
|
8
8
|
let block = n.map(m => {
|
9
|
-
return
|
10
|
-
}).join(
|
9
|
+
return serializeToText(m);
|
10
|
+
}).join(" ");
|
11
11
|
return block;
|
12
12
|
} catch (err) {
|
13
13
|
console.log(err);
|
package/dist/index.js
CHANGED
@@ -1,4 +1,6 @@
|
|
1
1
|
import Collaborative from "./Editor/CollaborativeEditor";
|
2
2
|
import CommonEditor from "./Editor/CommonEditor";
|
3
|
+
import Mini from "./Editor/MiniEditor";
|
3
4
|
export const Editor = CommonEditor;
|
5
|
+
export const MiniEditor = Mini;
|
4
6
|
export const CollaborativeEditor = Collaborative;
|
package/package.json
CHANGED
@@ -1,42 +0,0 @@
|
|
1
|
-
import React from "react";
|
2
|
-
import { Box } from "@mui/material";
|
3
|
-
import { ReactEditor, useSlateStatic } from "slate-react";
|
4
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
5
|
-
const SectionStyle = () => ({
|
6
|
-
root: {
|
7
|
-
position: "relative",
|
8
|
-
padding: "0px",
|
9
|
-
display: "flex",
|
10
|
-
alignItems: "center",
|
11
|
-
justifyContent: "center",
|
12
|
-
width: "100%",
|
13
|
-
"&.root-1": {
|
14
|
-
"& .section-inner-ed.root-1": {
|
15
|
-
width: "80%",
|
16
|
-
maxWidth: "1440px"
|
17
|
-
}
|
18
|
-
}
|
19
|
-
}
|
20
|
-
});
|
21
|
-
const Section = props => {
|
22
|
-
const {
|
23
|
-
element
|
24
|
-
} = props;
|
25
|
-
const editor = useSlateStatic();
|
26
|
-
const path = ReactEditor.findPath(editor, element);
|
27
|
-
console.log(path);
|
28
|
-
const classes = SectionStyle();
|
29
|
-
const {
|
30
|
-
children
|
31
|
-
} = props;
|
32
|
-
return /*#__PURE__*/_jsx(Box, {
|
33
|
-
component: "div",
|
34
|
-
className: `root-${path.length}`,
|
35
|
-
sx: classes.root,
|
36
|
-
children: /*#__PURE__*/_jsx("div", {
|
37
|
-
className: `section-inner-ed root-${path.length}`,
|
38
|
-
children: children
|
39
|
-
})
|
40
|
-
});
|
41
|
-
};
|
42
|
-
export default Section;
|