@flozy/editor 3.8.9 → 3.9.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/dist/Editor/ChatEditor.js +55 -45
- package/dist/Editor/CommonEditor.js +8 -69
- package/dist/Editor/DialogWrapper.js +3 -4
- package/dist/Editor/Editor.css +12 -5
- package/dist/Editor/Elements/AI/PopoverAIInput.js +36 -47
- package/dist/Editor/Elements/Accordion/AccordionSummary.js +15 -4
- package/dist/Editor/Elements/AppHeader/AppHeader.js +23 -36
- package/dist/Editor/Elements/Button/EditorButton.js +16 -23
- package/dist/Editor/Elements/Embed/Image.js +14 -15
- package/dist/Editor/Elements/Embed/Video.js +8 -12
- package/dist/Editor/Elements/Emoji/EmojiButton.js +7 -11
- package/dist/Editor/Elements/Emoji/EmojiPicker.js +4 -2
- package/dist/Editor/Elements/Form/Form.js +1 -1
- package/dist/Editor/Elements/Grid/Grid.js +8 -12
- package/dist/Editor/Elements/Grid/GridItem.js +21 -31
- package/dist/Editor/Elements/PageSettings/PageSettingsButton.js +5 -1
- package/dist/Editor/Elements/SimpleText/index.js +8 -9
- package/dist/Editor/Elements/SimpleText/style.js +0 -37
- package/dist/Editor/Styles/EditorStyles.js +0 -23
- package/dist/Editor/Toolbar/Mini/MiniToolbar.js +25 -1
- package/dist/Editor/Toolbar/PopupTool/TextFormat.js +0 -1
- package/dist/Editor/Toolbar/PopupTool/index.js +0 -8
- package/dist/Editor/Toolbar/Toolbar.js +0 -7
- package/dist/Editor/Toolbar/toolbarGroups.js +0 -5
- package/dist/Editor/common/Icon.js +2 -9
- package/dist/Editor/common/MentionsPopup/MentionsListCard.js +6 -1
- package/dist/Editor/common/MentionsPopup/index.js +8 -12
- package/dist/Editor/common/Section/index.js +12 -21
- package/dist/Editor/common/Section/styles.js +1 -6
- package/dist/Editor/common/Shorthands/elements.js +0 -12
- package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +31 -32
- package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +18 -16
- package/dist/Editor/common/StyleBuilder/fieldTypes/selectBox.js +14 -3
- package/dist/Editor/common/StyleBuilder/fieldTypes/text.js +2 -4
- package/dist/Editor/common/StyleBuilder/index.js +2 -2
- package/dist/Editor/common/StyleBuilder/sectionStyle.js +2 -13
- package/dist/Editor/helper/index.js +0 -139
- package/dist/Editor/helper/theme.js +2 -50
- package/dist/Editor/hooks/useMouseMove.js +8 -36
- package/dist/Editor/hooks/withCommon.js +1 -2
- package/dist/Editor/utils/SlateUtilityFunctions.js +3 -23
- package/dist/Editor/utils/draftToSlate.js +1 -1
- package/dist/Editor/utils/events.js +0 -5
- package/dist/Editor/utils/helper.js +0 -29
- package/package.json +2 -5
- package/dist/Editor/Elements/FreeGrid/FreeGrid.js +0 -391
- package/dist/Editor/Elements/FreeGrid/FreeGridBox.js +0 -193
- package/dist/Editor/Elements/FreeGrid/FreeGridButton.js +0 -23
- package/dist/Editor/Elements/FreeGrid/FreeGridItem.js +0 -184
- package/dist/Editor/Elements/FreeGrid/Options/AddElement.js +0 -36
- package/dist/Editor/Elements/FreeGrid/Options/More.js +0 -24
- package/dist/Editor/Elements/FreeGrid/Options/SectionSettings.js +0 -47
- package/dist/Editor/Elements/FreeGrid/Options/sectionItemOptions.js +0 -11
- package/dist/Editor/Elements/FreeGrid/breakpointConstants.js +0 -75
- package/dist/Editor/Elements/FreeGrid/styles.js +0 -159
- package/dist/Editor/ErrorBoundary.js +0 -30
- package/dist/Editor/common/RnD/ContextMenu/CMenus.js +0 -105
- package/dist/Editor/common/RnD/ContextMenu/index.js +0 -38
- package/dist/Editor/common/RnD/ContextMenu/styles.js +0 -21
- package/dist/Editor/common/RnD/DragInfo/index.js +0 -31
- package/dist/Editor/common/RnD/DragInfo/styles.js +0 -15
- package/dist/Editor/common/RnD/DragOver/index.js +0 -46
- package/dist/Editor/common/RnD/DragOver/styles.js +0 -23
- package/dist/Editor/common/RnD/ElementOptions/Actions.js +0 -82
- package/dist/Editor/common/RnD/ElementOptions/Icons/LinkIcon.js +0 -26
- package/dist/Editor/common/RnD/ElementOptions/index.js +0 -93
- package/dist/Editor/common/RnD/ElementOptions/styles.js +0 -41
- package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Link.js +0 -153
- package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Settings.js +0 -58
- package/dist/Editor/common/RnD/ElementSettings/OtherSettings/index.js +0 -7
- package/dist/Editor/common/RnD/ElementSettings/Settings/BoxSettings.js +0 -46
- package/dist/Editor/common/RnD/ElementSettings/Settings/ButtonSettings.js +0 -46
- package/dist/Editor/common/RnD/ElementSettings/Settings/ImageSettings.js +0 -46
- package/dist/Editor/common/RnD/ElementSettings/Settings/TextSettings.js +0 -30
- package/dist/Editor/common/RnD/ElementSettings/Settings/VideoSettings.js +0 -46
- package/dist/Editor/common/RnD/ElementSettings/Settings/index.js +0 -13
- package/dist/Editor/common/RnD/ElementSettings/index.js +0 -17
- package/dist/Editor/common/RnD/ElementSettings/settingsConstants.js +0 -14
- package/dist/Editor/common/RnD/ElementSettings/styles.js +0 -76
- package/dist/Editor/common/RnD/GuideLines/BoundaryLine.js +0 -52
- package/dist/Editor/common/RnD/GuideLines/index.js +0 -33
- package/dist/Editor/common/RnD/GuideLines/styles.js +0 -60
- package/dist/Editor/common/RnD/OptionsPopup/index.js +0 -50
- package/dist/Editor/common/RnD/OptionsPopup/style.js +0 -36
- package/dist/Editor/common/RnD/RnDCopy.js +0 -23
- package/dist/Editor/common/RnD/ShadowElement.js +0 -34
- package/dist/Editor/common/RnD/SwitchViewport/SwitchViewport.js +0 -40
- package/dist/Editor/common/RnD/SwitchViewport/styles.js +0 -24
- package/dist/Editor/common/RnD/Theme/ViewportStimulator.js +0 -63
- package/dist/Editor/common/RnD/TransformHandles/CornerHandle.js +0 -19
- package/dist/Editor/common/RnD/TransformHandles/Icons/BottomRightIcon.js +0 -13
- package/dist/Editor/common/RnD/TransformHandles/SizeHandle.js +0 -18
- package/dist/Editor/common/RnD/TransformHandles/index.js +0 -62
- package/dist/Editor/common/RnD/Utils/alignmentDetection.js +0 -26
- package/dist/Editor/common/RnD/Utils/calculateDropItem.js +0 -98
- package/dist/Editor/common/RnD/Utils/collisionDetection.js +0 -52
- package/dist/Editor/common/RnD/Utils/gridDropItem.js +0 -148
- package/dist/Editor/common/RnD/Utils/index.js +0 -251
- package/dist/Editor/common/RnD/VirtualElement/index.js +0 -76
- package/dist/Editor/common/RnD/VirtualElement/styles.js +0 -27
- package/dist/Editor/common/RnD/VirtualElement/updateAutoProps.js +0 -28
- package/dist/Editor/common/RnD/index.js +0 -503
- package/dist/Editor/common/RnD/styles.js +0 -4
- package/dist/Editor/common/StyleBuilder/boxStyle.js +0 -30
- package/dist/Editor/helper/RnD/focusOnNewItem.js +0 -39
- package/dist/Editor/helper/RnD/scrollToNewSection.js +0 -24
- package/dist/Editor/helper/breakpoint.js +0 -5
- package/dist/Editor/hooks/useBreakpoints.js +0 -34
- package/dist/Editor/hooks/withErrorHandling.js +0 -14
- package/dist/Editor/utils/RnD/RnDCtrlCmds.js +0 -168
- package/dist/Editor/utils/freegrid.js +0 -49
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { Transforms, Node } from "slate";
|
|
3
|
-
import { Box } from "@mui/material";
|
|
4
|
-
import { StyleContent } from "../../../StyleBuilder";
|
|
5
|
-
import buttonStyle from "../../../StyleBuilder/buttonStyle";
|
|
6
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
7
|
-
const ButtonSettings = props => {
|
|
8
|
-
const {
|
|
9
|
-
editor,
|
|
10
|
-
path
|
|
11
|
-
} = props;
|
|
12
|
-
const item_path = path?.split("|").map(m => parseInt(m));
|
|
13
|
-
const element_path = [...item_path, 0];
|
|
14
|
-
const element = Node.get(editor, element_path);
|
|
15
|
-
const onChange = data => {
|
|
16
|
-
const updated_props = {
|
|
17
|
-
...element,
|
|
18
|
-
...data,
|
|
19
|
-
field_type: data?.element
|
|
20
|
-
};
|
|
21
|
-
delete updated_props.children;
|
|
22
|
-
Transforms.setNodes(editor, {
|
|
23
|
-
...updated_props
|
|
24
|
-
}, {
|
|
25
|
-
at: element_path
|
|
26
|
-
});
|
|
27
|
-
};
|
|
28
|
-
const handleClose = () => {
|
|
29
|
-
console.log("close");
|
|
30
|
-
};
|
|
31
|
-
return /*#__PURE__*/_jsx(Box, {
|
|
32
|
-
component: "div",
|
|
33
|
-
className: "item-w",
|
|
34
|
-
children: buttonStyle?.map((m, i) => {
|
|
35
|
-
return /*#__PURE__*/_jsx(StyleContent, {
|
|
36
|
-
renderTabs: buttonStyle,
|
|
37
|
-
value: m.value,
|
|
38
|
-
element: element,
|
|
39
|
-
onChange: onChange,
|
|
40
|
-
customProps: {},
|
|
41
|
-
handleClose: handleClose
|
|
42
|
-
}, `tab_${m.value}_$${i}`);
|
|
43
|
-
})
|
|
44
|
-
});
|
|
45
|
-
};
|
|
46
|
-
export default ButtonSettings;
|
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { Transforms, Node } from "slate";
|
|
3
|
-
import { Box } from "@mui/material";
|
|
4
|
-
import { StyleContent } from "../../../StyleBuilder";
|
|
5
|
-
import embedImageStyle from "../../../StyleBuilder/embedImageStyle";
|
|
6
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
7
|
-
const ImageSettings = props => {
|
|
8
|
-
const {
|
|
9
|
-
editor,
|
|
10
|
-
path
|
|
11
|
-
} = props;
|
|
12
|
-
const item_path = path?.split("|").map(m => parseInt(m));
|
|
13
|
-
const element_path = [...item_path, 0];
|
|
14
|
-
const element = Node.get(editor, element_path);
|
|
15
|
-
const onChange = data => {
|
|
16
|
-
const updated_props = {
|
|
17
|
-
...element,
|
|
18
|
-
...data,
|
|
19
|
-
field_type: data?.element
|
|
20
|
-
};
|
|
21
|
-
delete updated_props.children;
|
|
22
|
-
Transforms.setNodes(editor, {
|
|
23
|
-
...updated_props
|
|
24
|
-
}, {
|
|
25
|
-
at: element_path
|
|
26
|
-
});
|
|
27
|
-
};
|
|
28
|
-
const handleClose = () => {
|
|
29
|
-
console.log("close");
|
|
30
|
-
};
|
|
31
|
-
return /*#__PURE__*/_jsx(Box, {
|
|
32
|
-
component: "div",
|
|
33
|
-
className: "item-w",
|
|
34
|
-
children: embedImageStyle?.map((m, i) => {
|
|
35
|
-
return /*#__PURE__*/_jsx(StyleContent, {
|
|
36
|
-
renderTabs: embedImageStyle,
|
|
37
|
-
value: m.value,
|
|
38
|
-
element: element,
|
|
39
|
-
onChange: onChange,
|
|
40
|
-
customProps: {},
|
|
41
|
-
handleClose: handleClose
|
|
42
|
-
}, `tab_${m.value}_$${i}`);
|
|
43
|
-
})
|
|
44
|
-
});
|
|
45
|
-
};
|
|
46
|
-
export default ImageSettings;
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
import React, { useEffect } from "react";
|
|
2
|
-
import { Editor, Transforms } from "slate";
|
|
3
|
-
import TextFormat from "../../../../Toolbar/PopupTool/TextFormat";
|
|
4
|
-
import usePopupStyle from "../../../../Toolbar/PopupTool/PopupToolStyle";
|
|
5
|
-
import { ReactEditor } from "slate-react";
|
|
6
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
7
|
-
const TextSettings = props => {
|
|
8
|
-
const {
|
|
9
|
-
editor,
|
|
10
|
-
path
|
|
11
|
-
} = props;
|
|
12
|
-
const item_path = path.split("|").map(m => parseInt(m));
|
|
13
|
-
const element_path = [...item_path, 0];
|
|
14
|
-
const classes = usePopupStyle();
|
|
15
|
-
useEffect(() => {
|
|
16
|
-
try {
|
|
17
|
-
ReactEditor.focus(editor);
|
|
18
|
-
const range = Editor.range(editor, element_path);
|
|
19
|
-
Transforms.select(editor, range);
|
|
20
|
-
ReactEditor.focus(editor);
|
|
21
|
-
} catch (err) {
|
|
22
|
-
console.log(err);
|
|
23
|
-
}
|
|
24
|
-
}, []);
|
|
25
|
-
return /*#__PURE__*/_jsx(TextFormat, {
|
|
26
|
-
classes: classes,
|
|
27
|
-
editor: editor
|
|
28
|
-
});
|
|
29
|
-
};
|
|
30
|
-
export default TextSettings;
|
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { Transforms, Node } from "slate";
|
|
3
|
-
import { Box } from "@mui/material";
|
|
4
|
-
import { StyleContent } from "../../../StyleBuilder";
|
|
5
|
-
import embedVideoStyle from "../../../StyleBuilder/embedVideoStyle";
|
|
6
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
7
|
-
const VideoSettings = props => {
|
|
8
|
-
const {
|
|
9
|
-
editor,
|
|
10
|
-
path
|
|
11
|
-
} = props;
|
|
12
|
-
const item_path = path?.split("|").map(m => parseInt(m));
|
|
13
|
-
const element_path = [...item_path, 0];
|
|
14
|
-
const element = Node.get(editor, element_path);
|
|
15
|
-
const onChange = data => {
|
|
16
|
-
const updated_props = {
|
|
17
|
-
...element,
|
|
18
|
-
...data,
|
|
19
|
-
field_type: data?.element
|
|
20
|
-
};
|
|
21
|
-
delete updated_props.children;
|
|
22
|
-
Transforms.setNodes(editor, {
|
|
23
|
-
...updated_props
|
|
24
|
-
}, {
|
|
25
|
-
at: element_path
|
|
26
|
-
});
|
|
27
|
-
};
|
|
28
|
-
const handleClose = () => {
|
|
29
|
-
console.log("close");
|
|
30
|
-
};
|
|
31
|
-
return /*#__PURE__*/_jsx(Box, {
|
|
32
|
-
component: "div",
|
|
33
|
-
className: "item-w",
|
|
34
|
-
children: embedVideoStyle?.map((m, i) => {
|
|
35
|
-
return /*#__PURE__*/_jsx(StyleContent, {
|
|
36
|
-
renderTabs: embedVideoStyle,
|
|
37
|
-
value: m.value,
|
|
38
|
-
element: element,
|
|
39
|
-
onChange: onChange,
|
|
40
|
-
customProps: {},
|
|
41
|
-
handleClose: handleClose
|
|
42
|
-
}, `tab_${m.value}_$${i}`);
|
|
43
|
-
})
|
|
44
|
-
});
|
|
45
|
-
};
|
|
46
|
-
export default VideoSettings;
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import TextSettings from "./TextSettings";
|
|
2
|
-
import ButtonSettings from "./ButtonSettings";
|
|
3
|
-
import ImageSettings from "./ImageSettings";
|
|
4
|
-
import VideoSettings from "./VideoSettings";
|
|
5
|
-
import BoxSettings from "./BoxSettings";
|
|
6
|
-
const SettingsComponents = {
|
|
7
|
-
text: TextSettings,
|
|
8
|
-
button: ButtonSettings,
|
|
9
|
-
image: ImageSettings,
|
|
10
|
-
video: VideoSettings,
|
|
11
|
-
box: BoxSettings
|
|
12
|
-
};
|
|
13
|
-
export default SettingsComponents;
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import useElementSettingsStyle from "./styles";
|
|
3
|
-
import OtherSettings from "./OtherSettings";
|
|
4
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
5
|
-
const ElementSettings = props => {
|
|
6
|
-
const {
|
|
7
|
-
currentAction
|
|
8
|
-
} = props;
|
|
9
|
-
const classes = useElementSettingsStyle();
|
|
10
|
-
const Settings = OtherSettings[currentAction];
|
|
11
|
-
return Settings ? /*#__PURE__*/_jsx(Settings, {
|
|
12
|
-
classes: classes,
|
|
13
|
-
...props
|
|
14
|
-
}) : null;
|
|
15
|
-
};
|
|
16
|
-
ElementSettings.defaultProps = {};
|
|
17
|
-
export default ElementSettings;
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
export const settingsLabel = {
|
|
2
|
-
text: "Text Settings",
|
|
3
|
-
button: "Button Settings",
|
|
4
|
-
image: "Image Settings",
|
|
5
|
-
video: "Video Settings",
|
|
6
|
-
box: "Box Settings"
|
|
7
|
-
};
|
|
8
|
-
export const ItemTypes = {
|
|
9
|
-
text: "Text",
|
|
10
|
-
button: "Button",
|
|
11
|
-
image: "Image",
|
|
12
|
-
video: "Video",
|
|
13
|
-
box: "Box"
|
|
14
|
-
};
|
|
@@ -1,76 +0,0 @@
|
|
|
1
|
-
const useElementSettingsStyle = theme => ({
|
|
2
|
-
root: {
|
|
3
|
-
zIndex: 1200,
|
|
4
|
-
background: "#FFF",
|
|
5
|
-
borderRadius: "10px",
|
|
6
|
-
overflow: "hidden",
|
|
7
|
-
boxShadow: "0px 0px 12px 4px #00000014",
|
|
8
|
-
padding: "10px 16px",
|
|
9
|
-
"& .papper-root": {
|
|
10
|
-
width: "312px",
|
|
11
|
-
boxShadow: "none"
|
|
12
|
-
},
|
|
13
|
-
".MuiDivider-root": {
|
|
14
|
-
background: "#DCE4EC"
|
|
15
|
-
},
|
|
16
|
-
"& .closeBtn": {
|
|
17
|
-
borderRadius: "4px",
|
|
18
|
-
width: "26px",
|
|
19
|
-
height: "26px",
|
|
20
|
-
background: "#F8FAFC",
|
|
21
|
-
padding: "7px"
|
|
22
|
-
},
|
|
23
|
-
".MuiAccordionSummary-root": {
|
|
24
|
-
minHeight: "40px !important",
|
|
25
|
-
padding: "0px"
|
|
26
|
-
},
|
|
27
|
-
".MuiAccordionSummary-content": {
|
|
28
|
-
margin: "0px"
|
|
29
|
-
},
|
|
30
|
-
"& .MuiAccordion-root": {
|
|
31
|
-
boxShadow: "none",
|
|
32
|
-
"& .accordionTitle": {
|
|
33
|
-
display: "flex",
|
|
34
|
-
alignItems: "center"
|
|
35
|
-
},
|
|
36
|
-
"& .expandIcon": {
|
|
37
|
-
transform: "rotate(270deg)",
|
|
38
|
-
transition: "all 0.5s",
|
|
39
|
-
fill: "#64748B"
|
|
40
|
-
},
|
|
41
|
-
"&.Mui-expanded": {
|
|
42
|
-
"& .expandIcon": {
|
|
43
|
-
transform: "rotate(360deg)"
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
},
|
|
47
|
-
"& .item-w": {
|
|
48
|
-
maxHeight: "300px",
|
|
49
|
-
overflowX: "hidden",
|
|
50
|
-
overflowY: "auto"
|
|
51
|
-
},
|
|
52
|
-
"& .item-wrapper": {
|
|
53
|
-
fontFamily: "sans-serif",
|
|
54
|
-
padding: "5px 0px 12px 0px",
|
|
55
|
-
"& .text-formatter-popup": {
|
|
56
|
-
padding: "0px",
|
|
57
|
-
overflowX: "hidden"
|
|
58
|
-
},
|
|
59
|
-
"&.title": {
|
|
60
|
-
display: "flex",
|
|
61
|
-
fontSize: "16px",
|
|
62
|
-
fontWeight: "bold",
|
|
63
|
-
justifyContent: "space-between",
|
|
64
|
-
alignItems: "center",
|
|
65
|
-
"& .MuiIconButton-root": {
|
|
66
|
-
padding: "4px",
|
|
67
|
-
"& svg": {
|
|
68
|
-
width: "16px",
|
|
69
|
-
height: "16px"
|
|
70
|
-
}
|
|
71
|
-
}
|
|
72
|
-
}
|
|
73
|
-
}
|
|
74
|
-
}
|
|
75
|
-
});
|
|
76
|
-
export default useElementSettingsStyle;
|
|
@@ -1,52 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { Box, useTheme } from "@mui/material";
|
|
3
|
-
import useGuideLineStyle from "./styles";
|
|
4
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
5
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
6
|
-
const SVGDashed = () => {
|
|
7
|
-
return /*#__PURE__*/_jsx("svg", {
|
|
8
|
-
width: "1",
|
|
9
|
-
height: "100%",
|
|
10
|
-
version: "1.1",
|
|
11
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
12
|
-
children: /*#__PURE__*/_jsx("line", {
|
|
13
|
-
strokeDasharray: "5, 5",
|
|
14
|
-
x1: "0",
|
|
15
|
-
y1: "100%",
|
|
16
|
-
x2: "1",
|
|
17
|
-
y2: "1",
|
|
18
|
-
style: {
|
|
19
|
-
stroke: "rgb(0, 0, 0)",
|
|
20
|
-
strokeWidth: 2
|
|
21
|
-
}
|
|
22
|
-
})
|
|
23
|
-
});
|
|
24
|
-
};
|
|
25
|
-
const BoundaryLine = () => {
|
|
26
|
-
const theme = useTheme();
|
|
27
|
-
const classes = useGuideLineStyle({
|
|
28
|
-
theme
|
|
29
|
-
});
|
|
30
|
-
return /*#__PURE__*/_jsxs(Box, {
|
|
31
|
-
component: "div",
|
|
32
|
-
sx: classes.boundaryLine,
|
|
33
|
-
children: [/*#__PURE__*/_jsx(Box, {
|
|
34
|
-
component: "div",
|
|
35
|
-
className: "rnd-guideline-lv",
|
|
36
|
-
contentEditable: false,
|
|
37
|
-
children: /*#__PURE__*/_jsx(SVGDashed, {})
|
|
38
|
-
}), /*#__PURE__*/_jsx(Box, {
|
|
39
|
-
component: "div",
|
|
40
|
-
className: "rnd-guideline-rv",
|
|
41
|
-
contentEditable: false,
|
|
42
|
-
children: /*#__PURE__*/_jsx(SVGDashed, {})
|
|
43
|
-
}), /*#__PURE__*/_jsx(Box, {
|
|
44
|
-
component: "div",
|
|
45
|
-
className: "white-wrapper w_left"
|
|
46
|
-
}), /*#__PURE__*/_jsx(Box, {
|
|
47
|
-
component: "div",
|
|
48
|
-
className: "white-wrapper w_right"
|
|
49
|
-
})]
|
|
50
|
-
});
|
|
51
|
-
};
|
|
52
|
-
export default BoundaryLine;
|
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { Box, useTheme } from "@mui/material";
|
|
3
|
-
import useGuideLineStyle from "./styles";
|
|
4
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
5
|
-
const GuideLines = props => {
|
|
6
|
-
const theme = useTheme();
|
|
7
|
-
const classes = useGuideLineStyle({
|
|
8
|
-
theme
|
|
9
|
-
});
|
|
10
|
-
const {
|
|
11
|
-
lines
|
|
12
|
-
} = props;
|
|
13
|
-
const renderGuideLine = ({
|
|
14
|
-
x,
|
|
15
|
-
y,
|
|
16
|
-
width,
|
|
17
|
-
height
|
|
18
|
-
}, index) => {
|
|
19
|
-
return /*#__PURE__*/_jsx(Box, {
|
|
20
|
-
sx: classes.root,
|
|
21
|
-
component: "span",
|
|
22
|
-
className: "rnd-guideline",
|
|
23
|
-
style: {
|
|
24
|
-
left: x,
|
|
25
|
-
top: y,
|
|
26
|
-
width,
|
|
27
|
-
height
|
|
28
|
-
}
|
|
29
|
-
}, `rnd-gl-${index}_${x}_${y}`);
|
|
30
|
-
};
|
|
31
|
-
return lines?.length ? lines?.map(renderGuideLine) : null;
|
|
32
|
-
};
|
|
33
|
-
export default GuideLines;
|
|
@@ -1,60 +0,0 @@
|
|
|
1
|
-
const useGuideLineStyle = ({
|
|
2
|
-
theme
|
|
3
|
-
}) => ({
|
|
4
|
-
root: {
|
|
5
|
-
position: "fixed",
|
|
6
|
-
top: "0",
|
|
7
|
-
left: "0",
|
|
8
|
-
width: "2px",
|
|
9
|
-
height: "1px",
|
|
10
|
-
backgroundColor: "#FF70B4",
|
|
11
|
-
opacity: 1,
|
|
12
|
-
pointerEvents: "none",
|
|
13
|
-
zIndex: 1200
|
|
14
|
-
},
|
|
15
|
-
boundaryLine: {
|
|
16
|
-
"& .rnd-guideline-lv": {
|
|
17
|
-
position: "absolute",
|
|
18
|
-
left: "calc(50% - 490px)",
|
|
19
|
-
top: "0",
|
|
20
|
-
height: "100%",
|
|
21
|
-
width: "1px",
|
|
22
|
-
backgroundColor: "#FFF",
|
|
23
|
-
pointerEvents: "none",
|
|
24
|
-
[theme.breakpoints.between("xs", "md")]: {
|
|
25
|
-
left: "calc(50% - 160px)"
|
|
26
|
-
}
|
|
27
|
-
},
|
|
28
|
-
"& .rnd-guideline-rv": {
|
|
29
|
-
position: "absolute",
|
|
30
|
-
left: "calc(50% + 490px)",
|
|
31
|
-
top: "0",
|
|
32
|
-
height: "100%",
|
|
33
|
-
width: "1px",
|
|
34
|
-
backgroundColor: "#FFF",
|
|
35
|
-
pointerEvents: "none",
|
|
36
|
-
[theme.breakpoints.between("xs", "md")]: {
|
|
37
|
-
left: "calc(50% + 160px)"
|
|
38
|
-
}
|
|
39
|
-
},
|
|
40
|
-
"& .white-wrapper": {
|
|
41
|
-
overflowX: "hidden",
|
|
42
|
-
[theme.breakpoints.between("xs", "md")]: {
|
|
43
|
-
position: "absolute",
|
|
44
|
-
width: "calc(50% - 162px)",
|
|
45
|
-
height: "calc(100% - 2px)",
|
|
46
|
-
backgroundColor: "rgba(255,255,255,1)",
|
|
47
|
-
pointerEvents: "none",
|
|
48
|
-
top: 2,
|
|
49
|
-
"&.w_left": {
|
|
50
|
-
left: 2
|
|
51
|
-
},
|
|
52
|
-
"&.w_right": {
|
|
53
|
-
right: 2,
|
|
54
|
-
width: "calc(50% - 163px)"
|
|
55
|
-
}
|
|
56
|
-
}
|
|
57
|
-
}
|
|
58
|
-
}
|
|
59
|
-
});
|
|
60
|
-
export default useGuideLineStyle;
|
|
@@ -1,50 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { Box, Paper, Popper, Typography, Tooltip, IconButton } from "@mui/material";
|
|
3
|
-
import CloseIcon from "@mui/icons-material/Close";
|
|
4
|
-
import HelpIcon from "@mui/icons-material/Help";
|
|
5
|
-
import useOptionsPopupStyle from "./style";
|
|
6
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
7
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
8
|
-
const OptionsPopup = props => {
|
|
9
|
-
const classes = useOptionsPopupStyle();
|
|
10
|
-
const {
|
|
11
|
-
title,
|
|
12
|
-
children,
|
|
13
|
-
open,
|
|
14
|
-
anchorEl,
|
|
15
|
-
placement,
|
|
16
|
-
handleClose
|
|
17
|
-
} = props;
|
|
18
|
-
return anchorEl ? /*#__PURE__*/_jsx(Popper, {
|
|
19
|
-
sx: classes.root,
|
|
20
|
-
open: open,
|
|
21
|
-
anchorEl: anchorEl,
|
|
22
|
-
placement: placement,
|
|
23
|
-
onClose: handleClose,
|
|
24
|
-
children: /*#__PURE__*/_jsxs(Paper, {
|
|
25
|
-
className: "papper-root",
|
|
26
|
-
children: [/*#__PURE__*/_jsxs(Typography, {
|
|
27
|
-
variant: "div",
|
|
28
|
-
className: "item-wrapper title",
|
|
29
|
-
children: [title, /*#__PURE__*/_jsxs(Box, {
|
|
30
|
-
component: "div",
|
|
31
|
-
children: [/*#__PURE__*/_jsx(Tooltip, {
|
|
32
|
-
title: "Help",
|
|
33
|
-
arrow: true,
|
|
34
|
-
children: /*#__PURE__*/_jsx(IconButton, {
|
|
35
|
-
children: /*#__PURE__*/_jsx(HelpIcon, {})
|
|
36
|
-
})
|
|
37
|
-
}), /*#__PURE__*/_jsx(Tooltip, {
|
|
38
|
-
title: "Close",
|
|
39
|
-
arrow: true,
|
|
40
|
-
children: /*#__PURE__*/_jsx(IconButton, {
|
|
41
|
-
onClick: handleClose,
|
|
42
|
-
children: /*#__PURE__*/_jsx(CloseIcon, {})
|
|
43
|
-
})
|
|
44
|
-
})]
|
|
45
|
-
})]
|
|
46
|
-
}), children]
|
|
47
|
-
})
|
|
48
|
-
}) : null;
|
|
49
|
-
};
|
|
50
|
-
export default OptionsPopup;
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
const useOptionsPopupStyle = () => ({
|
|
2
|
-
root: {
|
|
3
|
-
zIndex: 1200,
|
|
4
|
-
background: "#FFF",
|
|
5
|
-
borderRadius: "5px",
|
|
6
|
-
overflow: "hidden",
|
|
7
|
-
boxShadow: "1px 1px 3px rgba(0,0,0,0.3)",
|
|
8
|
-
"& .papper-root": {
|
|
9
|
-
borderTop: "8px solid #1976d2",
|
|
10
|
-
width: "270px",
|
|
11
|
-
boxShadow: "none"
|
|
12
|
-
},
|
|
13
|
-
"& .item-list-wrpr": {
|
|
14
|
-
paddingTop: "0px",
|
|
15
|
-
paddingBottom: "0px"
|
|
16
|
-
},
|
|
17
|
-
"& .item-wrapper": {
|
|
18
|
-
padding: "12px",
|
|
19
|
-
fontFamily: "sans-serif",
|
|
20
|
-
"&.title": {
|
|
21
|
-
display: "flex",
|
|
22
|
-
fontWeight: "bold",
|
|
23
|
-
justifyContent: "space-between",
|
|
24
|
-
alignItems: "center",
|
|
25
|
-
"& .MuiIconButton-root": {
|
|
26
|
-
padding: "4px",
|
|
27
|
-
"& svg": {
|
|
28
|
-
width: "16px",
|
|
29
|
-
height: "16px"
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
}
|
|
33
|
-
}
|
|
34
|
-
}
|
|
35
|
-
});
|
|
36
|
-
export default useOptionsPopupStyle;
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import Box from "@mui/material/Box";
|
|
2
|
-
import { useEditorContext } from "../../hooks/useMouseMove";
|
|
3
|
-
import { useEffect } from "react";
|
|
4
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
5
|
-
const RnDCopy = props => {
|
|
6
|
-
const {
|
|
7
|
-
readOnly
|
|
8
|
-
} = props;
|
|
9
|
-
const {
|
|
10
|
-
selectedElement
|
|
11
|
-
} = useEditorContext();
|
|
12
|
-
useEffect(() => {
|
|
13
|
-
if (selectedElement?.path) {
|
|
14
|
-
window.selectedRnDElement = selectedElement;
|
|
15
|
-
}
|
|
16
|
-
}, [selectedElement?.path, selectedElement?.enable]);
|
|
17
|
-
return !readOnly ? /*#__PURE__*/_jsx(Box, {
|
|
18
|
-
sx: {
|
|
19
|
-
display: "none"
|
|
20
|
-
}
|
|
21
|
-
}) : null;
|
|
22
|
-
};
|
|
23
|
-
export default RnDCopy;
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import { Box, useTheme } from "@mui/material";
|
|
3
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
4
|
-
const useShadowElementStyles = ({
|
|
5
|
-
theme,
|
|
6
|
-
style
|
|
7
|
-
}) => ({
|
|
8
|
-
root: {
|
|
9
|
-
...style,
|
|
10
|
-
position: "relative",
|
|
11
|
-
backgroundColor: "rgba(0,0,0,0)",
|
|
12
|
-
marginLeft: `calc((100% - 980px) * 0.5)`,
|
|
13
|
-
[theme.breakpoints.between("xs", "md")]: {
|
|
14
|
-
marginLeft: `calc((100% - 320px) * 0.5)`
|
|
15
|
-
}
|
|
16
|
-
}
|
|
17
|
-
});
|
|
18
|
-
const ShadowElement = props => {
|
|
19
|
-
const theme = useTheme();
|
|
20
|
-
const {
|
|
21
|
-
type,
|
|
22
|
-
enable,
|
|
23
|
-
style
|
|
24
|
-
} = props;
|
|
25
|
-
const classes = useShadowElementStyles({
|
|
26
|
-
theme,
|
|
27
|
-
style
|
|
28
|
-
});
|
|
29
|
-
return type === "child" && enable === 1 ? /*#__PURE__*/_jsx(Box, {
|
|
30
|
-
component: "div",
|
|
31
|
-
sx: classes.root
|
|
32
|
-
}) : null;
|
|
33
|
-
};
|
|
34
|
-
export default ShadowElement;
|
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
import { Box, IconButton, Tooltip } from "@mui/material";
|
|
2
|
-
import PersonalVideoIcon from "@mui/icons-material/PersonalVideo";
|
|
3
|
-
import PhoneIphoneIcon from "@mui/icons-material/PhoneIphone";
|
|
4
|
-
import useSwitchViewport from "./styles";
|
|
5
|
-
import { useEffect } from "react";
|
|
6
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
7
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
8
|
-
const SwitchViewport = props => {
|
|
9
|
-
const {
|
|
10
|
-
breakpoint,
|
|
11
|
-
onChange
|
|
12
|
-
} = props;
|
|
13
|
-
const classes = useSwitchViewport();
|
|
14
|
-
useEffect(() => {
|
|
15
|
-
console.log(breakpoint);
|
|
16
|
-
}, [breakpoint]);
|
|
17
|
-
return /*#__PURE__*/_jsxs(Box, {
|
|
18
|
-
sx: classes.root,
|
|
19
|
-
children: [/*#__PURE__*/_jsx(Tooltip, {
|
|
20
|
-
title: "Desktop View",
|
|
21
|
-
children: /*#__PURE__*/_jsx(IconButton, {
|
|
22
|
-
className: `${!breakpoint || breakpoint === "lg" ? "active" : ""}`,
|
|
23
|
-
onClick: () => {
|
|
24
|
-
onChange("");
|
|
25
|
-
},
|
|
26
|
-
children: /*#__PURE__*/_jsx(PersonalVideoIcon, {})
|
|
27
|
-
})
|
|
28
|
-
}), /*#__PURE__*/_jsx(Tooltip, {
|
|
29
|
-
title: "Mobile View",
|
|
30
|
-
children: /*#__PURE__*/_jsx(IconButton, {
|
|
31
|
-
className: `${breakpoint === "xs" ? "active" : ""}`,
|
|
32
|
-
onClick: () => {
|
|
33
|
-
onChange("xs");
|
|
34
|
-
},
|
|
35
|
-
children: /*#__PURE__*/_jsx(PhoneIphoneIcon, {})
|
|
36
|
-
})
|
|
37
|
-
})]
|
|
38
|
-
});
|
|
39
|
-
};
|
|
40
|
-
export default SwitchViewport;
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
const useSwitchViewport = () => ({
|
|
2
|
-
root: {
|
|
3
|
-
position: "absolute",
|
|
4
|
-
right: 4,
|
|
5
|
-
top: 4,
|
|
6
|
-
margin: "auto",
|
|
7
|
-
padding: "4px",
|
|
8
|
-
zIndex: 100,
|
|
9
|
-
backgroundColor: "#FFF",
|
|
10
|
-
borderRadius: "12px",
|
|
11
|
-
display: "flex",
|
|
12
|
-
justifyContent: "center",
|
|
13
|
-
"& .MuiIconButton-root": {
|
|
14
|
-
padding: "4px",
|
|
15
|
-
"&.active": {
|
|
16
|
-
color: "#2563EB"
|
|
17
|
-
},
|
|
18
|
-
"& svg": {
|
|
19
|
-
height: "20px"
|
|
20
|
-
}
|
|
21
|
-
}
|
|
22
|
-
}
|
|
23
|
-
});
|
|
24
|
-
export default useSwitchViewport;
|