@flozy/editor 5.3.3 → 5.3.4
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/Editor/Editor.css +22 -7
- package/dist/Editor/Elements/Accordion/Accordion.js +8 -1
- package/dist/Editor/Elements/Button/EditorButton.js +2 -1
- package/dist/Editor/Elements/Divider/Divider.js +24 -9
- package/dist/Editor/Elements/Embed/Image.js +31 -12
- package/dist/Editor/Elements/Embed/Video.js +13 -2
- package/dist/Editor/Elements/Grid/GridItem.js +2 -0
- package/dist/Editor/Elements/Grid/Styles.js +44 -0
- package/dist/Editor/Elements/PageSettings/PageSettingsButton.js +1 -0
- package/dist/Editor/Elements/Signature/SignaturePopup.js +4 -4
- package/dist/Editor/Styles/EditorStyles.js +3 -1
- package/dist/Editor/Toolbar/FormatTools/FontFamilyAutocomplete.js +17 -1
- package/dist/Editor/Toolbar/FormatTools/TextSize.js +5 -3
- package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +200 -72
- package/dist/Editor/Toolbar/PopupTool/TextFormat.js +10 -8
- package/dist/Editor/assets/svg/SettingsIcon.js +4 -4
- package/dist/Editor/common/ColorPickerButton.js +5 -3
- package/dist/Editor/common/DnD/Draggable.js +2 -1
- package/dist/Editor/common/ImageSelector/Options/Upload.js +2 -1
- package/dist/Editor/common/ImageSelector/Styles.js +47 -6
- package/dist/Editor/common/ImageSelector/UploadStyles.js +18 -6
- package/dist/Editor/common/MentionsPopup/Styles.js +108 -118
- package/dist/Editor/common/Section/index.js +3 -3
- package/dist/Editor/common/Section/styles.js +5 -1
- package/dist/Editor/common/StyleBuilder/fieldTypes/backgroundImage.js +4 -3
- package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +27 -3
- package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +15 -2
- package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +2 -1
- package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +1 -1
- package/dist/Editor/common/StyleBuilder/fieldTypes/icons.js +2 -0
- package/dist/Editor/common/StyleBuilder/fieldTypes/radiusStyle.js +4 -4
- package/dist/Editor/common/StyleBuilder/fieldTypes/saveAsTemplate.js +22 -6
- package/dist/Editor/common/StyleBuilder/fieldTypes/selectBox.js +21 -2
- package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +7 -0
- package/dist/Editor/common/StyleBuilder/index.js +5 -4
- package/dist/Editor/common/ToolbarIcon.js +2 -1
- package/dist/Editor/common/Uploader.js +42 -40
- package/dist/Editor/common/iconListV2.js +295 -77
- package/dist/Editor/commonStyle.js +281 -4
- package/dist/Editor/plugins/withCustomDeleteBackward.js +33 -2
- package/dist/Editor/plugins/withLayout.js +0 -41
- package/dist/Editor/utils/helper.js +6 -1
- package/package.json +2 -2
@@ -3,6 +3,8 @@ import { Grid, Button, Typography, Select, MenuItem, TextField } from "@mui/mate
|
|
3
3
|
import CloudUploadIcon from "@mui/icons-material/CloudUpload";
|
4
4
|
import { convertBase64 } from "../../../utils/helper";
|
5
5
|
import { uploadFile } from "../../../service/fileupload";
|
6
|
+
import { useEditorContext } from "../../../hooks/useMouseMove";
|
7
|
+
import useCommonStyle from "../../../commonStyle";
|
6
8
|
import { jsx as _jsx } from "react/jsx-runtime";
|
7
9
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
8
10
|
import { Fragment as _Fragment } from "react/jsx-runtime";
|
@@ -30,6 +32,10 @@ const SaveAsTemplate = props => {
|
|
30
32
|
});
|
31
33
|
const [base64, setBase64] = useState(value);
|
32
34
|
const [uploading, setUploading] = useState(false);
|
35
|
+
const {
|
36
|
+
theme
|
37
|
+
} = useEditorContext();
|
38
|
+
const classes = useCommonStyle(theme);
|
33
39
|
const handleChange = async e => {
|
34
40
|
const file = e.target.files[0];
|
35
41
|
const strImage = await convertBase64(file);
|
@@ -76,6 +82,9 @@ const SaveAsTemplate = props => {
|
|
76
82
|
onSaveTemplate(formData, params);
|
77
83
|
handleClose();
|
78
84
|
};
|
85
|
+
if (!onSaveTemplate) {
|
86
|
+
return null;
|
87
|
+
}
|
79
88
|
return /*#__PURE__*/_jsxs(_Fragment, {
|
80
89
|
children: [/*#__PURE__*/_jsx(Grid, {
|
81
90
|
item: true,
|
@@ -149,9 +158,14 @@ const SaveAsTemplate = props => {
|
|
149
158
|
justifyContent: "space-between",
|
150
159
|
alignItems: "center",
|
151
160
|
children: [/*#__PURE__*/_jsxs(Button, {
|
152
|
-
component: "label"
|
153
|
-
variant
|
161
|
+
component: "label"
|
162
|
+
// variant="contained"
|
163
|
+
,
|
164
|
+
className: "gradientFillBtn",
|
154
165
|
startIcon: /*#__PURE__*/_jsx(CloudUploadIcon, {}),
|
166
|
+
sx: {
|
167
|
+
...classes.gradientFillBtn
|
168
|
+
},
|
155
169
|
children: ["Upload file", /*#__PURE__*/_jsx("input", {
|
156
170
|
type: "file",
|
157
171
|
style: {
|
@@ -194,12 +208,14 @@ const SaveAsTemplate = props => {
|
|
194
208
|
},
|
195
209
|
className: "action-btn-wrpr",
|
196
210
|
children: [/*#__PURE__*/_jsx(Button, {
|
197
|
-
className: "savebtn",
|
211
|
+
className: "savebtn gradientFillBtn",
|
198
212
|
onClick: handleSave,
|
199
213
|
sx: {
|
200
|
-
fontWeight: 700
|
201
|
-
|
202
|
-
|
214
|
+
fontWeight: 700,
|
215
|
+
...classes.gradientFillBtn
|
216
|
+
}
|
217
|
+
// variant="contained"
|
218
|
+
,
|
203
219
|
children: saveText
|
204
220
|
}), closeText ? /*#__PURE__*/_jsx(Button, {
|
205
221
|
className: "closebtn",
|
@@ -1,5 +1,8 @@
|
|
1
1
|
import React, { useEffect, useState, useRef } from "react";
|
2
|
-
import { Grid, Checkbox, FormControlLabel, FormHelperText } from "@mui/material";
|
2
|
+
import { Grid, Checkbox, FormControlLabel, FormHelperText, IconButton } from "@mui/material";
|
3
|
+
import useCommonStyle from "../../../commonStyle";
|
4
|
+
import { useEditorContext } from "../../../hooks/useMouseMove";
|
5
|
+
import { CheckedBoxCheckIcon } from "../../iconListV2";
|
3
6
|
import { jsx as _jsx } from "react/jsx-runtime";
|
4
7
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
5
8
|
const SelectBox = props => {
|
@@ -15,6 +18,10 @@ const SelectBox = props => {
|
|
15
18
|
} = data;
|
16
19
|
const [checkedValue, setCheckedValue] = useState(false);
|
17
20
|
const isFirstRender = useRef(true);
|
21
|
+
const {
|
22
|
+
theme
|
23
|
+
} = useEditorContext();
|
24
|
+
const classes = useCommonStyle(theme);
|
18
25
|
useEffect(() => {
|
19
26
|
if (isFirstRender.current && elementProps.element === "email" && value === undefined) {
|
20
27
|
setCheckedValue(true);
|
@@ -35,10 +42,22 @@ const SelectBox = props => {
|
|
35
42
|
marginBottom: "12px"
|
36
43
|
},
|
37
44
|
children: [/*#__PURE__*/_jsx(FormControlLabel, {
|
45
|
+
className: "ccheckbox-primary",
|
46
|
+
sx: {
|
47
|
+
...classes.customCheckBox
|
48
|
+
},
|
38
49
|
control: /*#__PURE__*/_jsx(Checkbox, {
|
39
50
|
value: value,
|
40
51
|
checked: checkedValue,
|
41
|
-
onChange: handleChange
|
52
|
+
onChange: handleChange,
|
53
|
+
className: "checkBox",
|
54
|
+
checkedIcon: /*#__PURE__*/_jsx(IconButton, {
|
55
|
+
className: "checkedIcon",
|
56
|
+
children: /*#__PURE__*/_jsx(CheckedBoxCheckIcon, {})
|
57
|
+
}),
|
58
|
+
icon: /*#__PURE__*/_jsx(IconButton, {
|
59
|
+
className: "unCheckedIcon"
|
60
|
+
})
|
42
61
|
}),
|
43
62
|
label: placeholder
|
44
63
|
}), /*#__PURE__*/_jsx(FormHelperText, {
|
@@ -5,6 +5,7 @@ import useWindowResize from "../../../hooks/useWindowResize";
|
|
5
5
|
import { useEditorContext } from "../../../hooks/useMouseMove";
|
6
6
|
import FontFamilyAutocomplete from "../../../Toolbar/FormatTools/FontFamilyAutocomplete";
|
7
7
|
import { useSlate } from "slate-react";
|
8
|
+
import KeyboardArrowDownRoundedIcon from "@mui/icons-material/KeyboardArrowDownRounded";
|
8
9
|
|
9
10
|
// hideMetaDataOptions -- pass true to hide metadata option in select field
|
10
11
|
import { jsx as _jsx } from "react/jsx-runtime";
|
@@ -90,6 +91,12 @@ const TextOptions = props => {
|
|
90
91
|
marginBottom: "16px"
|
91
92
|
},
|
92
93
|
sx: classes.textOptions,
|
94
|
+
IconComponent: KeyboardArrowDownRoundedIcon,
|
95
|
+
MenuProps: {
|
96
|
+
sx: {
|
97
|
+
...classes.textOptionsList
|
98
|
+
}
|
99
|
+
},
|
93
100
|
children: updatedOption?.map((m, i) => {
|
94
101
|
return m?.value === "listSubHeader" ? /*#__PURE__*/_jsx(ListSubheader, {
|
95
102
|
children: m?.label
|
@@ -1,11 +1,11 @@
|
|
1
1
|
import React, { useEffect, useState } from "react";
|
2
2
|
import { DialogTitle, DialogContent, DialogActions, Button, Grid, IconButton, Typography, Drawer, SwipeableDrawer, Accordion, AccordionSummary, AccordionDetails, createTheme } from "@mui/material";
|
3
3
|
import FieldMap from "./fieldTypes";
|
4
|
-
import
|
4
|
+
import CloseRoundedIcon from '@mui/icons-material/CloseRounded';
|
5
5
|
import useCommonStyle from "../../commonStyle";
|
6
6
|
import { useEditorContext } from "../../hooks/useMouseMove";
|
7
7
|
import { ThemeProvider } from "@mui/material/styles";
|
8
|
-
import {
|
8
|
+
import { ExpandMoreSharp } from "@mui/icons-material";
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
10
10
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
11
11
|
import { Fragment as _Fragment } from "react/jsx-runtime";
|
@@ -143,7 +143,8 @@ const StyleBuilder = props => {
|
|
143
143
|
xs: 12,
|
144
144
|
sx: {
|
145
145
|
p: 2,
|
146
|
-
width: isMobile ? "100%" : "
|
146
|
+
width: isMobile ? "100%" : "312px",
|
147
|
+
...classes.pageSettingPopUpRoot
|
147
148
|
},
|
148
149
|
children: [/*#__PURE__*/_jsx(DialogTitle, {
|
149
150
|
sx: {
|
@@ -166,7 +167,7 @@ const StyleBuilder = props => {
|
|
166
167
|
children: /*#__PURE__*/_jsx(IconButton, {
|
167
168
|
onClick: onClose,
|
168
169
|
className: "close-popupbtn",
|
169
|
-
children: /*#__PURE__*/_jsx(
|
170
|
+
children: /*#__PURE__*/_jsx(CloseRoundedIcon, {})
|
170
171
|
})
|
171
172
|
})]
|
172
173
|
})
|
@@ -11,6 +11,7 @@ const ToolbarIcon = props => {
|
|
11
11
|
style,
|
12
12
|
icoBtnType
|
13
13
|
} = props;
|
14
|
+
console.log("Props:", props);
|
14
15
|
const renderIconText = () => {
|
15
16
|
if (icoBtnType === "mini") {
|
16
17
|
return /*#__PURE__*/_jsx("span", {
|
@@ -39,7 +40,7 @@ const ToolbarIcon = props => {
|
|
39
40
|
title: title,
|
40
41
|
arrow: true,
|
41
42
|
children: /*#__PURE__*/_jsxs(IconButton, {
|
42
|
-
className: `${className} ${icoBtnType}`,
|
43
|
+
className: `${className} ${icoBtnType} accordionIcon`,
|
43
44
|
onClick: onClick,
|
44
45
|
style: style,
|
45
46
|
children: [icon, renderIconText()]
|
@@ -83,55 +83,57 @@ const Uploader = props => {
|
|
83
83
|
});
|
84
84
|
}
|
85
85
|
};
|
86
|
-
return /*#__PURE__*/_jsxs(
|
87
|
-
container: true,
|
88
|
-
sx: classes.uploadContainer,
|
86
|
+
return /*#__PURE__*/_jsxs(_Fragment, {
|
89
87
|
children: [/*#__PURE__*/_jsx(Grid, {
|
90
88
|
item: true,
|
91
89
|
xs: 12,
|
92
90
|
children: uploading ? "Uploading..." : ""
|
93
91
|
}), /*#__PURE__*/_jsx(Grid, {
|
94
|
-
|
95
|
-
|
96
|
-
|
97
|
-
|
98
|
-
|
99
|
-
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
|
107
|
-
|
108
|
-
|
109
|
-
|
110
|
-
|
111
|
-
variant: "text",
|
112
|
-
style: {
|
113
|
-
background: "none",
|
114
|
-
width: "100%"
|
92
|
+
container: true,
|
93
|
+
sx: classes.uploadContainer,
|
94
|
+
children: /*#__PURE__*/_jsx(Grid, {
|
95
|
+
item: true,
|
96
|
+
xs: 12,
|
97
|
+
className: "btn--wrpr",
|
98
|
+
style: {
|
99
|
+
...getBackground()
|
100
|
+
},
|
101
|
+
sx: classes.uploadField,
|
102
|
+
children: !uploading ? /*#__PURE__*/_jsx(Grid, {
|
103
|
+
className: "uploadImageSection",
|
104
|
+
children: base64 ? renderThumb() : /*#__PURE__*/_jsx(Grid, {
|
105
|
+
className: "uploadImageText",
|
106
|
+
sx: {
|
107
|
+
background: `${theme?.palette?.editor?.inputFieldBgColor}`,
|
108
|
+
border: `1px solid ${theme?.palette?.editor?.inputFieldBorder}`
|
115
109
|
},
|
116
|
-
|
117
|
-
|
118
|
-
|
119
|
-
style: {
|
120
|
-
opacity: 0,
|
121
|
-
width: "0px"
|
122
|
-
},
|
123
|
-
onChange: handleChange
|
124
|
-
}), /*#__PURE__*/_jsx(Icon, {
|
125
|
-
icon: "fileUpload"
|
126
|
-
}), /*#__PURE__*/_jsxs("span", {
|
110
|
+
children: /*#__PURE__*/_jsxs(Button, {
|
111
|
+
component: "label",
|
112
|
+
variant: "text",
|
127
113
|
style: {
|
128
|
-
|
114
|
+
background: "none",
|
115
|
+
width: "100%"
|
129
116
|
},
|
130
|
-
|
131
|
-
|
117
|
+
sx: classes.uploadIcon,
|
118
|
+
children: [/*#__PURE__*/_jsx("input", {
|
119
|
+
type: "file",
|
120
|
+
style: {
|
121
|
+
opacity: 0,
|
122
|
+
width: "0px"
|
123
|
+
},
|
124
|
+
onChange: handleChange
|
125
|
+
}), /*#__PURE__*/_jsx(Icon, {
|
126
|
+
icon: "fileUpload"
|
127
|
+
}), /*#__PURE__*/_jsxs("span", {
|
128
|
+
style: {
|
129
|
+
paddingLeft: "8px"
|
130
|
+
},
|
131
|
+
children: ["upload ", title || "image"]
|
132
|
+
})]
|
133
|
+
})
|
132
134
|
})
|
133
|
-
})
|
134
|
-
})
|
135
|
+
}) : null
|
136
|
+
})
|
135
137
|
})]
|
136
138
|
});
|
137
139
|
};
|