@flozy/editor 1.9.4 → 1.9.6
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/Editor/CommonEditor.js +15 -12
- package/dist/Editor/Editor.css +0 -6
- package/dist/Editor/Elements/Attachments/Attachments.js +9 -2
- package/dist/Editor/Elements/Button/EditorButton.js +4 -3
- package/dist/Editor/Elements/Color Picker/ColorButtons.js +3 -0
- package/dist/Editor/Elements/Color Picker/ColorPicker.js +6 -1
- package/dist/Editor/Elements/Color Picker/Styles.js +9 -4
- package/dist/Editor/Elements/Embed/Video.js +1 -0
- package/dist/Editor/Elements/Form/Workflow/FormWorkflow.js +2 -3
- package/dist/Editor/Elements/Form/Workflow/Styles.js +19 -1
- package/dist/Editor/Elements/Form/Workflow/UserInputs.js +6 -2
- package/dist/Editor/Elements/Form/Workflow/index.js +8 -2
- package/dist/Editor/Elements/Link/Link.js +6 -5
- package/dist/Editor/Elements/SimpleText.js +5 -1
- package/dist/Editor/Styles/EditorStyles.js +11 -2
- package/dist/Editor/Toolbar/FormatTools/Dropdown.js +6 -1
- package/dist/Editor/Toolbar/FormatTools/TextSize.js +2 -0
- package/dist/Editor/Toolbar/Mini/MiniToolbar.js +5 -4
- package/dist/Editor/Toolbar/Mini/Styles.js +15 -1
- package/dist/Editor/Toolbar/PopupTool/PopperHeader.js +1 -0
- package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +113 -9
- package/dist/Editor/Toolbar/PopupTool/TextFormat.js +3 -0
- package/dist/Editor/Toolbar/PopupTool/index.js +4 -1
- package/dist/Editor/common/ColorPickerButton.js +6 -8
- package/dist/Editor/common/ImageSelector/ImageSelector.js +6 -5
- package/dist/Editor/common/ImageSelector/Styles.js +59 -45
- package/dist/Editor/common/ImageSelector/UploadStyles.js +10 -10
- package/dist/Editor/common/MentionsPopup/Styles.js +16 -7
- package/dist/Editor/common/MentionsPopup/index.js +5 -4
- package/dist/Editor/common/StyleBuilder/fieldTypes/backgroundImage.js +5 -1
- package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +6 -4
- package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +6 -3
- package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +3 -1
- package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +3 -1
- package/dist/Editor/common/StyleBuilder/index.js +14 -4
- package/dist/Editor/common/iconslist.js +0 -2
- package/dist/Editor/commonStyle.js +50 -6
- package/dist/Editor/helper/index.js +30 -8
- package/dist/Editor/hooks/useMouseMove.js +3 -1
- package/dist/Editor/utils/draftToSlate.js +3 -1
- package/package.json +1 -1
@@ -2,8 +2,8 @@ import React, { useEffect, useState } from "react";
|
|
2
2
|
import { DialogTitle, DialogContent, DialogActions, Button, Grid, IconButton, Typography, Drawer } from "@mui/material";
|
3
3
|
import FieldMap from "./fieldTypes";
|
4
4
|
import CloseIcon from "@mui/icons-material/Close";
|
5
|
-
import
|
6
|
-
import {
|
5
|
+
import useCommonStyle from "../../commonStyle";
|
6
|
+
import { useEditorContext } from "../../hooks/useMouseMove";
|
7
7
|
import { jsx as _jsx } from "react/jsx-runtime";
|
8
8
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
9
9
|
const StyleContent = props => {
|
@@ -18,6 +18,10 @@ const StyleContent = props => {
|
|
18
18
|
const {
|
19
19
|
hideTools
|
20
20
|
} = customProps || {};
|
21
|
+
const {
|
22
|
+
theme
|
23
|
+
} = useEditorContext();
|
24
|
+
const classes = useCommonStyle(theme);
|
21
25
|
const tabContent = renderTabs.find(f => f.value === value);
|
22
26
|
const {
|
23
27
|
fields
|
@@ -37,7 +41,8 @@ const StyleContent = props => {
|
|
37
41
|
onChange: onChange,
|
38
42
|
elementProps: element,
|
39
43
|
customProps: customProps,
|
40
|
-
handleClose: handleClose
|
44
|
+
handleClose: handleClose,
|
45
|
+
classes: classes
|
41
46
|
}, `ei_stt_tab_${value}_${m.key}_${i}`) : null;
|
42
47
|
})
|
43
48
|
}, value);
|
@@ -52,6 +57,10 @@ const StyleBuilder = props => {
|
|
52
57
|
onDelete,
|
53
58
|
customProps
|
54
59
|
} = props;
|
60
|
+
const {
|
61
|
+
theme
|
62
|
+
} = useEditorContext();
|
63
|
+
const classes = useCommonStyle(theme);
|
55
64
|
const [elementProps, setElementProps] = useState(element);
|
56
65
|
const [tab] = useState(renderTabs[0]?.value);
|
57
66
|
const tabVal = renderTabs?.find(f => f.value === tab);
|
@@ -90,6 +99,7 @@ const StyleBuilder = props => {
|
|
90
99
|
style: {
|
91
100
|
zIndex: "1300"
|
92
101
|
},
|
102
|
+
sx: classes.sideBarDrawer,
|
93
103
|
children: /*#__PURE__*/_jsxs(Grid, {
|
94
104
|
item: true,
|
95
105
|
xs: 12,
|
@@ -159,4 +169,4 @@ const StyleBuilder = props => {
|
|
159
169
|
};
|
160
170
|
|
161
171
|
// export default StyleBuilder;
|
162
|
-
export default
|
172
|
+
export default StyleBuilder;
|
@@ -1183,7 +1183,6 @@ export const TextPlusIcon = props => /*#__PURE__*/_jsx("svg", {
|
|
1183
1183
|
fill: "none",
|
1184
1184
|
children: /*#__PURE__*/_jsx("path", {
|
1185
1185
|
d: "M1.08203 3.43359L3.51526 1.00036L5.94849 3.43359",
|
1186
|
-
stroke: "#64748B",
|
1187
1186
|
strokeLinecap: "round"
|
1188
1187
|
})
|
1189
1188
|
});
|
@@ -1195,7 +1194,6 @@ export const TextMinusIcon = props => /*#__PURE__*/_jsx("svg", {
|
|
1195
1194
|
fill: "none",
|
1196
1195
|
children: /*#__PURE__*/_jsx("path", {
|
1197
1196
|
d: "M1 0.805664L3.43323 3.2389L5.86646 0.805664",
|
1198
|
-
stroke: "#64748B",
|
1199
1197
|
strokeLinecap: "round"
|
1200
1198
|
})
|
1201
1199
|
});
|
@@ -1,11 +1,55 @@
|
|
1
|
-
const
|
2
|
-
|
1
|
+
const useCommonStyle = theme => ({
|
2
|
+
sideBarDrawer: {
|
3
|
+
"& .MuiPaper-root": {
|
4
|
+
backgroundColor: theme?.palette?.editor?.background
|
5
|
+
},
|
6
|
+
"& .MuiTypography-root": {
|
7
|
+
color: theme?.palette?.editor?.textColor
|
8
|
+
},
|
9
|
+
"& .MuiInputBase-input": {
|
10
|
+
color: theme?.palette?.editor?.textColor
|
11
|
+
},
|
12
|
+
"& .MuiCheckbox-root": {
|
13
|
+
color: theme?.palette?.editor?.textColor
|
14
|
+
},
|
15
|
+
"& .MuiOutlinedInput-notchedOutline": {
|
16
|
+
border: `1px solid ${theme?.palette?.editor?.borderColor}`
|
17
|
+
},
|
3
18
|
"& .close-popupbtn": {
|
4
|
-
|
19
|
+
color: theme?.palette?.editor?.textColor
|
5
20
|
}
|
6
21
|
},
|
7
|
-
|
8
|
-
|
22
|
+
sapcingInput: {
|
23
|
+
backgroundColor: theme?.palette?.editor?.background,
|
24
|
+
color: theme?.palette?.editor?.textColor
|
25
|
+
},
|
26
|
+
colorPickerPopup: {
|
27
|
+
"& .MuiPaper-root": {
|
28
|
+
overflow: "auto",
|
29
|
+
backgroundColor: theme?.palette?.editor?.background
|
30
|
+
},
|
31
|
+
"& .popup_tabs": {
|
32
|
+
backgroundColor: theme?.palette?.editor?.background
|
33
|
+
},
|
34
|
+
"& .popup_tabs-header": {
|
35
|
+
backgroundColor: theme?.palette?.editor?.background,
|
36
|
+
"& .popup_tabs-header-label-active": {
|
37
|
+
color: theme?.palette?.editor?.activeColor,
|
38
|
+
backgroundColor: theme?.palette?.editor?.background
|
39
|
+
}
|
40
|
+
},
|
41
|
+
"& .colorpicker": {
|
42
|
+
backgroundColor: theme?.palette?.editor?.background
|
43
|
+
},
|
44
|
+
"& .color-picker-panel": {
|
45
|
+
backgroundColor: theme?.palette?.editor?.background
|
46
|
+
},
|
47
|
+
"& .input_rgba": {
|
48
|
+
"& input": {
|
49
|
+
backgroundColor: theme?.palette?.editor?.background,
|
50
|
+
color: theme?.palette?.editor?.textColor
|
51
|
+
}
|
52
|
+
}
|
9
53
|
}
|
10
54
|
});
|
11
|
-
export default
|
55
|
+
export default useCommonStyle;
|
@@ -62,17 +62,39 @@ function padZero(str, len) {
|
|
62
62
|
var zeros = new Array(len).join("0");
|
63
63
|
return (zeros + str).slice(-len);
|
64
64
|
}
|
65
|
-
export function getEmbedURL(element) {
|
65
|
+
export function getEmbedURL(element, needType = false) {
|
66
66
|
let refUrl = element.href ? element.href : element.url;
|
67
67
|
refUrl = refUrl ? refUrl.includes("http") ? refUrl : `//${refUrl}` : "Link";
|
68
68
|
let embedUrl = refUrl;
|
69
|
-
|
70
|
-
if (embedUrl.includes("
|
71
|
-
|
72
|
-
|
73
|
-
|
74
|
-
if (embedUrl.includes("
|
75
|
-
|
69
|
+
let isEmbed = false;
|
70
|
+
if (embedUrl.includes("youtube")) {
|
71
|
+
isEmbed = true;
|
72
|
+
embedUrl = getQueryStrings(embedUrl);
|
73
|
+
}
|
74
|
+
if (embedUrl.includes("youtu.be")) {
|
75
|
+
isEmbed = true;
|
76
|
+
embedUrl = getQueryStrings(embedUrl);
|
77
|
+
}
|
78
|
+
if (embedUrl.includes("loom")) {
|
79
|
+
isEmbed = true;
|
80
|
+
embedUrl = embedUrl.replace(/\/share\//, "/embed/");
|
81
|
+
}
|
82
|
+
if (embedUrl.includes("vimeo")) {
|
83
|
+
isEmbed = true;
|
84
|
+
embedUrl = embedUrl.replace(/\/vimeo.com\//, "/player.vimeo.com/video/");
|
85
|
+
}
|
86
|
+
if (embedUrl.includes("dailymotion") && embedUrl.includes("video")) {
|
87
|
+
isEmbed = true;
|
88
|
+
embedUrl = embedUrl.replace(/www.dailymotion.com\//, "www.dailymotion.com/embed/");
|
89
|
+
}
|
90
|
+
if (embedUrl.includes("dai.ly")) {
|
91
|
+
isEmbed = true;
|
92
|
+
embedUrl = embedUrl.replace(/dai.ly\//, "www.dailymotion.com/embed/video/");
|
93
|
+
}
|
94
|
+
return needType ? {
|
95
|
+
embedUrl,
|
96
|
+
isEmbed
|
97
|
+
} : embedUrl;
|
76
98
|
}
|
77
99
|
export const isEmptyTextNode = element => {
|
78
100
|
try {
|
@@ -2,6 +2,7 @@ import { useEffect, useState, createContext, useContext, useMemo } from "react";
|
|
2
2
|
import { jsx as _jsx } from "react/jsx-runtime";
|
3
3
|
const EditorContext = /*#__PURE__*/createContext();
|
4
4
|
export const EditorProvider = ({
|
5
|
+
theme,
|
5
6
|
children
|
6
7
|
}) => {
|
7
8
|
const [event] = useMouseMove();
|
@@ -27,7 +28,8 @@ export const EditorProvider = ({
|
|
27
28
|
value: {
|
28
29
|
...(value || {}),
|
29
30
|
onDrop: onDrop,
|
30
|
-
drop
|
31
|
+
drop,
|
32
|
+
theme: theme
|
31
33
|
},
|
32
34
|
children: children
|
33
35
|
});
|