@flozy/editor 1.8.5 → 1.8.6
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/Editor/CommonEditor.js +4 -2
- package/dist/Editor/Editor.css +4 -0
- package/dist/Editor/Elements/Embed/Video.js +1 -1
- package/dist/Editor/Elements/Signature/SignaturePopup.js +1 -1
- package/dist/Editor/Toolbar/Mini/MiniToolbar.js +5 -1
- package/dist/Editor/Toolbar/PopupTool/AddElements.js +5 -1
- package/dist/Editor/Toolbar/Toolbar.js +0 -8
- package/dist/Editor/common/Shorthands/elements.js +23 -2
- package/dist/Editor/common/StyleBuilder/index.js +5 -1
- package/package.json +1 -1
@@ -100,7 +100,8 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
|
|
100
100
|
CHARACTERS = [],
|
101
101
|
editorClass,
|
102
102
|
fixedWidth = "60%",
|
103
|
-
fullWidth = "80%"
|
103
|
+
fullWidth = "80%",
|
104
|
+
hideTools
|
104
105
|
} = otherProps || {};
|
105
106
|
const [drag, setDrag] = useState(null);
|
106
107
|
const editor = useMemo(() => {
|
@@ -243,7 +244,8 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
|
|
243
244
|
} = mentions;
|
244
245
|
const chars = type ? Shorthands[type]({
|
245
246
|
...mentions,
|
246
|
-
CHARACTERS
|
247
|
+
CHARACTERS,
|
248
|
+
hideTools: hideTools || []
|
247
249
|
}) : [];
|
248
250
|
const handleEditorChange = newValue => {
|
249
251
|
setValue(newValue);
|
package/dist/Editor/Editor.css
CHANGED
@@ -58,7 +58,7 @@ const Video = ({
|
|
58
58
|
bottomRight
|
59
59
|
} = borderRadius || {};
|
60
60
|
useEffect(() => {
|
61
|
-
if (editor && ele[1] !== undefined) {
|
61
|
+
if (editor && ele && ele[1] !== undefined) {
|
62
62
|
const dom = ReactEditor.toDOMNode(editor, Node.get(editor, ele[1]));
|
63
63
|
setParentDOM(dom);
|
64
64
|
onLoad(element?.size || {});
|
@@ -333,7 +333,7 @@ const SignaturePopup = props => {
|
|
333
333
|
return /*#__PURE__*/_jsx(IconButton, {
|
334
334
|
onClick: onBrushSize(m),
|
335
335
|
disableRipple: true,
|
336
|
-
className: brush.size === m ? "
|
336
|
+
className: brush.size === m ? "activeBrush" : "",
|
337
337
|
children: /*#__PURE__*/_jsx("span", {
|
338
338
|
style: {
|
339
339
|
width: 20 + m,
|
@@ -37,6 +37,10 @@ const MiniToolbar = props => {
|
|
37
37
|
const PopupComponent = POPUP_TYPES[popper] || null;
|
38
38
|
const open = Boolean(PopupComponent);
|
39
39
|
const DialogComp = !fullScreen ? Popper : Dialog;
|
40
|
+
const {
|
41
|
+
hideTools
|
42
|
+
} = customProps;
|
43
|
+
const UPDATED_MENU_OPTIONS = MENU_OPTIONS.filter(f => (hideTools || [])?.indexOf(f.type) === -1);
|
40
44
|
useEffect(() => {
|
41
45
|
if (popper) {
|
42
46
|
setPopper(null);
|
@@ -58,7 +62,7 @@ const MiniToolbar = props => {
|
|
58
62
|
component: "div",
|
59
63
|
className: "mini-tool-wrpr-ei",
|
60
64
|
sx: classes.root,
|
61
|
-
children:
|
65
|
+
children: UPDATED_MENU_OPTIONS.map(({
|
62
66
|
type,
|
63
67
|
label,
|
64
68
|
icon: Icon
|
@@ -11,6 +11,10 @@ const AddElements = props => {
|
|
11
11
|
editor,
|
12
12
|
customProps
|
13
13
|
} = props;
|
14
|
+
const {
|
15
|
+
hideTools
|
16
|
+
} = customProps;
|
17
|
+
const filteredElements = elements.filter(f => hideTools.indexOf(f.type) === -1);
|
14
18
|
return /*#__PURE__*/_jsx(Grid, {
|
15
19
|
container: true,
|
16
20
|
sx: classes.textFormatWrapper,
|
@@ -18,7 +22,7 @@ const AddElements = props => {
|
|
18
22
|
style: {
|
19
23
|
margin: 0
|
20
24
|
},
|
21
|
-
children:
|
25
|
+
children: filteredElements.map(m => {
|
22
26
|
return /*#__PURE__*/_jsx(Grid, {
|
23
27
|
item: true,
|
24
28
|
xs: 6,
|
@@ -157,14 +157,6 @@ export const RenderToolbarIcon = props => {
|
|
157
157
|
editor: editor,
|
158
158
|
customProps: customProps
|
159
159
|
}, element.id);
|
160
|
-
// case "drawer":
|
161
|
-
// return (
|
162
|
-
// <DrawerMenuButton
|
163
|
-
// key={element.id}
|
164
|
-
// editor={editor}
|
165
|
-
// customProps={customProps}
|
166
|
-
// />
|
167
|
-
// );
|
168
160
|
case "app-header":
|
169
161
|
return /*#__PURE__*/_jsx(AppHeaderButton, {
|
170
162
|
editor: editor,
|
@@ -14,6 +14,7 @@ const ELEMENTS_LIST = [{
|
|
14
14
|
name: "Heading 1",
|
15
15
|
desc: "",
|
16
16
|
group: "Text",
|
17
|
+
type: "headingOne",
|
17
18
|
icon: /*#__PURE__*/_jsx(Icon, {
|
18
19
|
icon: "headingOne"
|
19
20
|
}),
|
@@ -22,6 +23,7 @@ const ELEMENTS_LIST = [{
|
|
22
23
|
name: "Heading 2",
|
23
24
|
desc: "",
|
24
25
|
group: "Text",
|
26
|
+
type: "headingTwo",
|
25
27
|
icon: /*#__PURE__*/_jsx(Icon, {
|
26
28
|
icon: "headingTwo"
|
27
29
|
}),
|
@@ -30,6 +32,7 @@ const ELEMENTS_LIST = [{
|
|
30
32
|
name: "Heading 3",
|
31
33
|
desc: "",
|
32
34
|
group: "Text",
|
35
|
+
type: "headingThree",
|
33
36
|
icon: /*#__PURE__*/_jsx(Icon, {
|
34
37
|
icon: "headingThree"
|
35
38
|
}),
|
@@ -38,6 +41,7 @@ const ELEMENTS_LIST = [{
|
|
38
41
|
name: "Quote",
|
39
42
|
desc: "",
|
40
43
|
group: "Text",
|
44
|
+
type: "blockquote",
|
41
45
|
icon: /*#__PURE__*/_jsx(Icon, {
|
42
46
|
icon: "blockquote"
|
43
47
|
}),
|
@@ -48,6 +52,7 @@ const ELEMENTS_LIST = [{
|
|
48
52
|
name: "Colorbox",
|
49
53
|
desc: "",
|
50
54
|
group: "Text",
|
55
|
+
type: "colorbox",
|
51
56
|
icon: /*#__PURE__*/_jsx(Icon, {
|
52
57
|
icon: "colorbox"
|
53
58
|
}),
|
@@ -58,6 +63,7 @@ const ELEMENTS_LIST = [{
|
|
58
63
|
name: "Ordered List",
|
59
64
|
desc: "",
|
60
65
|
group: "List",
|
66
|
+
type: "orderedList",
|
61
67
|
icon: /*#__PURE__*/_jsx(Icon, {
|
62
68
|
icon: "orderedList"
|
63
69
|
}),
|
@@ -66,6 +72,7 @@ const ELEMENTS_LIST = [{
|
|
66
72
|
name: "Bulleted List",
|
67
73
|
desc: "",
|
68
74
|
group: "List",
|
75
|
+
type: "unorderedList",
|
69
76
|
icon: /*#__PURE__*/_jsx(Icon, {
|
70
77
|
icon: "unorderedList"
|
71
78
|
}),
|
@@ -74,6 +81,7 @@ const ELEMENTS_LIST = [{
|
|
74
81
|
name: "Check List",
|
75
82
|
desc: "",
|
76
83
|
group: "List",
|
84
|
+
type: "check-list-item",
|
77
85
|
icon: /*#__PURE__*/_jsx(Icon, {
|
78
86
|
icon: "check-list-item"
|
79
87
|
}),
|
@@ -82,6 +90,7 @@ const ELEMENTS_LIST = [{
|
|
82
90
|
name: "Image",
|
83
91
|
desc: "",
|
84
92
|
group: "Media",
|
93
|
+
type: "embed",
|
85
94
|
icon: /*#__PURE__*/_jsx(Icon, {
|
86
95
|
icon: "image"
|
87
96
|
}),
|
@@ -90,6 +99,7 @@ const ELEMENTS_LIST = [{
|
|
90
99
|
name: "Video",
|
91
100
|
desc: "",
|
92
101
|
group: "Media",
|
102
|
+
type: "embed",
|
93
103
|
icon: /*#__PURE__*/_jsx(Icon, {
|
94
104
|
icon: "video"
|
95
105
|
}),
|
@@ -98,6 +108,7 @@ const ELEMENTS_LIST = [{
|
|
98
108
|
name: "Embed",
|
99
109
|
desc: "",
|
100
110
|
group: "Media",
|
111
|
+
type: "embed",
|
101
112
|
icon: /*#__PURE__*/_jsx(Icon, {
|
102
113
|
icon: "embed"
|
103
114
|
}),
|
@@ -106,6 +117,7 @@ const ELEMENTS_LIST = [{
|
|
106
117
|
name: "Emoji",
|
107
118
|
group: "Elements",
|
108
119
|
desc: "",
|
120
|
+
type: "emoji",
|
109
121
|
renderComponent: rest => /*#__PURE__*/_jsx(EmojiButton, {
|
110
122
|
...rest,
|
111
123
|
icoBtnType: "cmd"
|
@@ -114,6 +126,7 @@ const ELEMENTS_LIST = [{
|
|
114
126
|
name: "Table",
|
115
127
|
group: "Elements",
|
116
128
|
desc: "",
|
129
|
+
type: "table",
|
117
130
|
icon: /*#__PURE__*/_jsx(Icon, {
|
118
131
|
icon: "table"
|
119
132
|
}),
|
@@ -125,6 +138,7 @@ const ELEMENTS_LIST = [{
|
|
125
138
|
name: "Grid",
|
126
139
|
group: "Elements",
|
127
140
|
desc: "",
|
141
|
+
type: "grid",
|
128
142
|
icon: /*#__PURE__*/_jsx(Icon, {
|
129
143
|
icon: "grid"
|
130
144
|
}),
|
@@ -135,6 +149,7 @@ const ELEMENTS_LIST = [{
|
|
135
149
|
name: "Accordion",
|
136
150
|
group: "Elements",
|
137
151
|
desc: "",
|
152
|
+
type: "accordion",
|
138
153
|
icon: /*#__PURE__*/_jsx(Icon, {
|
139
154
|
icon: "accordion"
|
140
155
|
}),
|
@@ -145,6 +160,7 @@ const ELEMENTS_LIST = [{
|
|
145
160
|
name: "Button",
|
146
161
|
group: "Elements",
|
147
162
|
desc: "",
|
163
|
+
type: "button",
|
148
164
|
icon: /*#__PURE__*/_jsx(Icon, {
|
149
165
|
icon: "button"
|
150
166
|
}),
|
@@ -155,6 +171,7 @@ const ELEMENTS_LIST = [{
|
|
155
171
|
name: "Signature",
|
156
172
|
group: "Elements",
|
157
173
|
desc: "",
|
174
|
+
type: "signature",
|
158
175
|
icon: /*#__PURE__*/_jsx(Icon, {
|
159
176
|
icon: "signature"
|
160
177
|
}),
|
@@ -165,6 +182,7 @@ const ELEMENTS_LIST = [{
|
|
165
182
|
name: "Carousel",
|
166
183
|
group: "Elements",
|
167
184
|
desc: "",
|
185
|
+
type: "carousel",
|
168
186
|
icon: /*#__PURE__*/_jsx(Icon, {
|
169
187
|
icon: "carousel"
|
170
188
|
}),
|
@@ -175,6 +193,7 @@ const ELEMENTS_LIST = [{
|
|
175
193
|
name: "Form",
|
176
194
|
group: "Elements",
|
177
195
|
desc: "",
|
196
|
+
type: "form",
|
178
197
|
icon: /*#__PURE__*/_jsx(Icon, {
|
179
198
|
icon: "form"
|
180
199
|
}),
|
@@ -184,8 +203,10 @@ const ELEMENTS_LIST = [{
|
|
184
203
|
}];
|
185
204
|
const elements = props => {
|
186
205
|
const {
|
187
|
-
search
|
206
|
+
search,
|
207
|
+
hideTools
|
188
208
|
} = props;
|
189
|
-
|
209
|
+
const filteredElements = ELEMENTS_LIST.filter(f => hideTools.indexOf(f.type) === -1);
|
210
|
+
return filteredElements.filter(c => c.name.toLowerCase().includes(search?.toLowerCase()));
|
190
211
|
};
|
191
212
|
export default elements;
|
@@ -15,17 +15,21 @@ const StyleContent = props => {
|
|
15
15
|
customProps,
|
16
16
|
handleClose
|
17
17
|
} = props;
|
18
|
+
const {
|
19
|
+
hideTools
|
20
|
+
} = customProps;
|
18
21
|
const tabContent = renderTabs.find(f => f.value === value);
|
19
22
|
const {
|
20
23
|
fields
|
21
24
|
} = tabContent || {
|
22
25
|
fields: []
|
23
26
|
};
|
27
|
+
const filteredFields = hideTools?.length > 0 ? fields.filter(f => hideTools.indexOf(f.key) === -1) : fields;
|
24
28
|
return /*#__PURE__*/_jsx(Grid, {
|
25
29
|
container: true,
|
26
30
|
spacing: 2,
|
27
31
|
className: "sidebar-wrpr-eds",
|
28
|
-
children: [...
|
32
|
+
children: [...filteredFields].map((m, i) => {
|
29
33
|
const FieldComponent = FieldMap[m.type];
|
30
34
|
return FieldComponent ? /*#__PURE__*/_jsx(FieldComponent, {
|
31
35
|
data: m,
|