@flozy/editor 5.2.9 → 5.3.0
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/Editor/ChatEditor.js +34 -25
- package/dist/Editor/CommonEditor.js +10 -16
- package/dist/Editor/Editor.css +16 -14
- package/dist/Editor/Elements/AI/AIInput.js +3 -0
- package/dist/Editor/Elements/AppHeader/AppHeader.js +6 -6
- package/dist/Editor/Elements/Button/EditorButton.js +2 -8
- package/dist/Editor/Elements/Color Picker/ColorButtons.js +2 -4
- package/dist/Editor/Elements/Form/Form.js +0 -1
- package/dist/Editor/Elements/FreeGrid/breakpointConstants.js +4 -4
- package/dist/Editor/Elements/FreeGrid/styles.js +1 -2
- package/dist/Editor/Elements/List/CheckList.js +1 -2
- package/dist/Editor/Elements/Search/SearchAttachment.js +0 -1
- package/dist/Editor/Elements/SimpleText/index.js +1 -8
- package/dist/Editor/Elements/SimpleText/style.js +1 -10
- package/dist/Editor/Elements/Table/Table.js +1 -1
- package/dist/Editor/Elements/TopBanner/TopBanner.js +1 -2
- package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +0 -10
- package/dist/Editor/Toolbar/PopupTool/TextFormat.js +0 -45
- package/dist/Editor/Toolbar/Toolbar.js +0 -6
- package/dist/Editor/Toolbar/toolbarGroups.js +0 -4
- package/dist/Editor/common/FontLoader/FontLoader.js +4 -4
- package/dist/Editor/common/Icon.js +0 -6
- package/dist/Editor/common/MentionsPopup/Styles.js +5 -2
- package/dist/Editor/common/RnD/ElementSettings/Settings/FormSettings.js +0 -1
- package/dist/Editor/common/RnD/GuideLines/styles.js +3 -3
- package/dist/Editor/common/RnD/ShadowElement.js +1 -1
- package/dist/Editor/common/RnD/SwitchViewport/SwitchViewport.js +2 -14
- package/dist/Editor/common/RnD/Utils/gridDropItem.js +6 -9
- package/dist/Editor/common/Shorthands/elements.js +1 -13
- package/dist/Editor/common/StyleBuilder/fieldTypes/backgroundImage.js +0 -5
- package/dist/Editor/common/StyleBuilder/fieldTypes/card.js +2 -10
- package/dist/Editor/common/StyleBuilder/fieldTypes/index.js +1 -3
- package/dist/Editor/common/StyleBuilder/pageSettingsStyle.js +0 -4
- package/dist/Editor/common/Uploader.js +0 -8
- package/dist/Editor/common/iconListV2.js +53 -53
- package/dist/Editor/common/iconslist.js +3 -6
- package/dist/Editor/commonStyle.js +0 -9
- package/dist/Editor/helper/index.js +2 -2
- package/dist/Editor/helper/theme.js +1 -24
- package/dist/Editor/hooks/useMouseMove.js +2 -5
- package/dist/Editor/plugins/withEmbeds.js +26 -30
- package/dist/Editor/plugins/withHTML.js +2 -42
- package/dist/Editor/plugins/withLayout.js +0 -42
- package/dist/Editor/utils/SlateUtilityFunctions.js +2 -25
- package/dist/Editor/utils/button.js +4 -4
- package/dist/Editor/utils/chatEditor/SlateUtilityFunctions.js +1 -26
- package/dist/Editor/utils/events.js +1 -0
- package/dist/Editor/utils/helper.js +1 -51
- package/dist/Editor/utils/pageSettings.js +2 -14
- package/dist/Editor/utils/serializeToText.js +0 -2
- package/package.json +1 -1
- package/dist/Editor/Elements/DataView/DataView.js +0 -124
- package/dist/Editor/Elements/DataView/DataViewButton.js +0 -23
- package/dist/Editor/Elements/DataView/Layouts/ColumnView.js +0 -68
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/CheckType.js +0 -33
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/Select.js +0 -162
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/SimpleSelect.js +0 -40
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/styles.js +0 -67
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/DateType.js +0 -35
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/MultiSelectType.js +0 -39
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/NumberType.js +0 -30
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/PersonType.js +0 -30
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/SelectType.js +0 -35
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/TextType.js +0 -36
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/index.js +0 -17
- package/dist/Editor/Elements/DataView/Layouts/FilterSort/SortOptions/ChooseField.js +0 -29
- package/dist/Editor/Elements/DataView/Layouts/FilterSort/SortOptions/ChooseSort.js +0 -38
- package/dist/Editor/Elements/DataView/Layouts/FilterSort/SortOptions/index.js +0 -74
- package/dist/Editor/Elements/DataView/Layouts/FilterSort/index.js +0 -64
- package/dist/Editor/Elements/DataView/Layouts/FilterSort/styles.js +0 -106
- package/dist/Editor/Elements/DataView/Layouts/FilterView.js +0 -174
- package/dist/Editor/Elements/DataView/Layouts/Formula.js +0 -29
- package/dist/Editor/Elements/DataView/Layouts/Options/AddOptions.js +0 -113
- package/dist/Editor/Elements/DataView/Layouts/Options/AddProperty.js +0 -37
- package/dist/Editor/Elements/DataView/Layouts/Options/AllProperties.js +0 -111
- package/dist/Editor/Elements/DataView/Layouts/Options/ChangeProperty.js +0 -60
- package/dist/Editor/Elements/DataView/Layouts/Options/ColumnsList.js +0 -36
- package/dist/Editor/Elements/DataView/Layouts/Options/Constants.js +0 -101
- package/dist/Editor/Elements/DataView/Layouts/Options/EditOption.js +0 -160
- package/dist/Editor/Elements/DataView/Layouts/Options/EditProperty.js +0 -190
- package/dist/Editor/Elements/DataView/Layouts/Options/FilterProperty.js +0 -42
- package/dist/Editor/Elements/DataView/Layouts/Options/PropertyList.js +0 -30
- package/dist/Editor/Elements/DataView/Layouts/Options/index.js +0 -110
- package/dist/Editor/Elements/DataView/Layouts/Options/styles.js +0 -179
- package/dist/Editor/Elements/DataView/Layouts/TableStyles.js +0 -112
- package/dist/Editor/Elements/DataView/Layouts/TableView.js +0 -227
- package/dist/Editor/Elements/DataView/Layouts/ViewData.js +0 -81
- package/dist/Editor/Elements/DataView/Layouts/index.js +0 -25
- package/dist/Editor/Elements/DataView/Providers/DataViewProvider.js +0 -273
- package/dist/Editor/Elements/DataView/Utils/globalSearch.js +0 -15
- package/dist/Editor/Elements/DataView/Utils/multiSortRows.js +0 -74
- package/dist/Editor/Elements/DataView/styles.js +0 -154
- package/dist/Editor/common/StyleBuilder/fieldTypes/lineSpacing.js +0 -79
- package/dist/Editor/helper/enforceDateFormat.js +0 -41
- package/dist/Editor/utils/dataView.js +0 -43
@@ -1,8 +1,9 @@
|
|
1
1
|
import React, { useCallback, useMemo, useRef, useState, useEffect, useImperativeHandle, forwardRef } from "react";
|
2
2
|
import { Editable, Slate, ReactEditor } from 'slate-react';
|
3
3
|
import { createEditor, Transforms, Editor } from 'slate';
|
4
|
+
import { useDebounce } from "use-debounce";
|
4
5
|
import withCommon from "./hooks/withCommon";
|
5
|
-
import { getBlock, getMarked
|
6
|
+
import { getBlock, getMarked } from "./utils/chatEditor/SlateUtilityFunctions";
|
6
7
|
import MiniTextFormat from "./Toolbar/PopupTool/MiniTextFormat";
|
7
8
|
import { commands, mentionsEvent } from "./utils/events";
|
8
9
|
import { insertEmoji } from "./utils/emoji";
|
@@ -14,7 +15,6 @@ import Shorthands from "./common/Shorthands";
|
|
14
15
|
import usePopupStyle from "./Toolbar/PopupTool/PopupToolStyle";
|
15
16
|
import { EditorProvider } from "./hooks/useMouseMove";
|
16
17
|
import decorators from "./utils/Decorators";
|
17
|
-
import { useDebouncedCallback } from "use-debounce";
|
18
18
|
import { jsx as _jsx } from "react/jsx-runtime";
|
19
19
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
20
20
|
const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
|
@@ -42,18 +42,8 @@ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
|
|
42
42
|
});
|
43
43
|
const [isInteracted, setIsInteracted] = useState(false);
|
44
44
|
const [value, setValue] = useState(convertedContent);
|
45
|
-
const
|
46
|
-
const
|
47
|
-
// function
|
48
|
-
value => {
|
49
|
-
const {
|
50
|
-
value: strVal,
|
51
|
-
...restVal
|
52
|
-
} = getOnSaveData(value);
|
53
|
-
onSave(strVal, restVal);
|
54
|
-
},
|
55
|
-
// delay in ms
|
56
|
-
500);
|
45
|
+
const [loadedValue] = useState(value);
|
46
|
+
const [deboundedValue] = useDebounce(value, 500);
|
57
47
|
const editor = useMemo(() => {
|
58
48
|
return withCommon(createEditor(), {
|
59
49
|
needLayout,
|
@@ -73,7 +63,7 @@ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
|
|
73
63
|
const {
|
74
64
|
value: strVal,
|
75
65
|
...restVal
|
76
|
-
} = getOnSaveData(
|
66
|
+
} = getOnSaveData(value);
|
77
67
|
onsubmit(false, {
|
78
68
|
strVal,
|
79
69
|
restVal
|
@@ -109,8 +99,7 @@ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
|
|
109
99
|
const newValue = draftToSlate({
|
110
100
|
data: content
|
111
101
|
});
|
112
|
-
|
113
|
-
|
102
|
+
setValue(newValue);
|
114
103
|
// setTimeout(() => {
|
115
104
|
if (editor.children.length === 0) {
|
116
105
|
Transforms.insertNodes(editor, newValue);
|
@@ -123,14 +112,27 @@ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
|
|
123
112
|
}
|
124
113
|
}
|
125
114
|
}));
|
115
|
+
|
116
|
+
// useEffect(() => {
|
117
|
+
// setIsExternalUpdate(true);
|
118
|
+
// setValue(draftToSlate({ data: content }));
|
119
|
+
// }, [content]);
|
120
|
+
|
121
|
+
useEffect(() => {
|
122
|
+
if (JSON.stringify(loadedValue) !== JSON.stringify(deboundedValue) && isInteracted && onSave) {
|
123
|
+
const {
|
124
|
+
value: strVal,
|
125
|
+
...restVal
|
126
|
+
} = getOnSaveData(deboundedValue);
|
127
|
+
onSave(strVal, restVal);
|
128
|
+
}
|
129
|
+
}, [deboundedValue]);
|
126
130
|
const getOnSaveData = val => {
|
127
131
|
const text = serializeToText(val);
|
128
|
-
const mentions = serializeMentions(val);
|
129
132
|
const title = val?.find(f => f.type === "title");
|
130
133
|
return {
|
131
134
|
value: JSON.stringify(val),
|
132
135
|
text: text,
|
133
|
-
mentions: mentions,
|
134
136
|
title: serializeToText(title?.children) || "Untitled"
|
135
137
|
};
|
136
138
|
};
|
@@ -178,8 +180,15 @@ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
|
|
178
180
|
});
|
179
181
|
};
|
180
182
|
const handleEditorChange = newValue => {
|
181
|
-
|
182
|
-
|
183
|
+
const value_txt = serializeToText(value);
|
184
|
+
if (!value_txt) {
|
185
|
+
const {
|
186
|
+
value: strVal,
|
187
|
+
...restVal
|
188
|
+
} = getOnSaveData(newValue);
|
189
|
+
onSave(strVal, restVal);
|
190
|
+
}
|
191
|
+
setValue(newValue);
|
183
192
|
if (!isInteracted) {
|
184
193
|
setIsInteracted(true);
|
185
194
|
}
|
@@ -219,7 +228,7 @@ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
|
|
219
228
|
editor
|
220
229
|
});
|
221
230
|
} else if (event.key === "Enter" && !isMobile) {
|
222
|
-
const isEmpty =
|
231
|
+
const isEmpty = value.length === 1 && value[0].type === 'paragraph' && value[0].children.length === 1 && value[0].children[0].text === '';
|
223
232
|
if (isEmpty) {
|
224
233
|
event.preventDefault();
|
225
234
|
return;
|
@@ -228,7 +237,7 @@ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
|
|
228
237
|
const {
|
229
238
|
value: strVal,
|
230
239
|
...restVal
|
231
|
-
} = getOnSaveData(
|
240
|
+
} = getOnSaveData(value);
|
232
241
|
onsubmit(false, {
|
233
242
|
strVal,
|
234
243
|
restVal
|
@@ -242,7 +251,7 @@ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
|
|
242
251
|
const {
|
243
252
|
value: strVal,
|
244
253
|
...restVal
|
245
|
-
} = getOnSaveData(
|
254
|
+
} = getOnSaveData(value);
|
246
255
|
onBlur({
|
247
256
|
strVal,
|
248
257
|
restVal
|
@@ -263,7 +272,7 @@ const ChatEditor = /*#__PURE__*/forwardRef((props, ref) => {
|
|
263
272
|
editor: editor,
|
264
273
|
children: /*#__PURE__*/_jsxs(Slate, {
|
265
274
|
editor: editor,
|
266
|
-
initialValue:
|
275
|
+
initialValue: value,
|
267
276
|
onChange: handleEditorChange,
|
268
277
|
children: [toolBar && /*#__PURE__*/_jsx(MiniTextFormat, {
|
269
278
|
classes: classes,
|
@@ -26,8 +26,8 @@ import editorStyles from "./Styles/EditorStyles";
|
|
26
26
|
import DragAndDrop from "./common/DnD";
|
27
27
|
import Section from "./common/Section";
|
28
28
|
import decorators from "./utils/Decorators";
|
29
|
-
import {
|
30
|
-
import {
|
29
|
+
import { getTRBLBreakPoints } from "./helper/theme";
|
30
|
+
import { handleInsertLastElement, isFreeGrid, isFreeGridFragment, isPageSettings, outsideEditorClickLabel } from "./utils/helper";
|
31
31
|
import useWindowResize from "./hooks/useWindowResize";
|
32
32
|
import PopoverAIInput from "./Elements/AI/PopoverAIInput";
|
33
33
|
import RnDCopy from "./common/RnD/RnDCopy";
|
@@ -137,8 +137,7 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
|
|
137
137
|
pageColor,
|
138
138
|
color: pageTextColor,
|
139
139
|
pageWidth,
|
140
|
-
maxWidth: pageMaxWidth
|
141
|
-
lineHeight
|
140
|
+
maxWidth: pageMaxWidth
|
142
141
|
} = pageSt?.pageProps || {
|
143
142
|
bannerSpacing: {
|
144
143
|
left: 0,
|
@@ -306,13 +305,11 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
|
|
306
305
|
hideTools: updatedHideTools || []
|
307
306
|
}) : [];
|
308
307
|
const handleEditorChange = newValue => {
|
309
|
-
if (
|
310
|
-
|
311
|
-
|
312
|
-
|
313
|
-
|
314
|
-
setIsInteracted(true);
|
315
|
-
}
|
308
|
+
if (JSON.stringify(newValue) !== JSON.stringify(debouncedValue?.current)) {
|
309
|
+
updateTopBanner(newValue, setTopBanner);
|
310
|
+
debounced(newValue);
|
311
|
+
if (!isInteracted) {
|
312
|
+
setIsInteracted(true);
|
316
313
|
}
|
317
314
|
}
|
318
315
|
};
|
@@ -331,7 +328,6 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
|
|
331
328
|
onDrawerOpen: onDrawerOpen,
|
332
329
|
ICON_API: "https://assets.agenciflow.com"
|
333
330
|
};
|
334
|
-
const lineH = getBreakpointLineSpacing(lineHeight, breakpoint);
|
335
331
|
const renderElement = useCallback(props => {
|
336
332
|
return /*#__PURE__*/_jsx(Element, {
|
337
333
|
...props,
|
@@ -505,7 +501,7 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
|
|
505
501
|
,
|
506
502
|
children: /*#__PURE__*/_jsxs(Slate, {
|
507
503
|
editor: editor,
|
508
|
-
initialValue:
|
504
|
+
initialValue: debouncedValue?.current,
|
509
505
|
onChange: handleEditorChange,
|
510
506
|
children: [/*#__PURE__*/_jsx(DragAndDrop, {
|
511
507
|
children: /*#__PURE__*/_jsxs(Overlay, {
|
@@ -534,7 +530,6 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
|
|
534
530
|
padding: {
|
535
531
|
...getTRBLBreakPoints(bannerSpacing)
|
536
532
|
},
|
537
|
-
lineHeight: lineH,
|
538
533
|
width: !pageWidth || pageWidth === "fixed" ? fixedWidth : fullWidth,
|
539
534
|
height: viewport.h ? `${viewport.h}px` : `100%`,
|
540
535
|
alignSelf: "center",
|
@@ -592,9 +587,8 @@ const CommonEditor = /*#__PURE__*/forwardRef((props, ref) => {
|
|
592
587
|
setIsTextSelected: setIsTextSelected,
|
593
588
|
customProps: customProps,
|
594
589
|
editorWrapper: editorWrapper
|
595
|
-
}) : null, !readOnly ? /*#__PURE__*/_jsx(SwitchViewport, {
|
590
|
+
}) : null, !readOnly && showViewport ? /*#__PURE__*/_jsx(SwitchViewport, {
|
596
591
|
breakpoint: breakpoint,
|
597
|
-
show: showViewport,
|
598
592
|
onChange: b => onSwitchBreakpoint(b)
|
599
593
|
}) : null]
|
600
594
|
})
|
package/dist/Editor/Editor.css
CHANGED
@@ -149,7 +149,7 @@ blockquote {
|
|
149
149
|
.grid-item-toolbar button,
|
150
150
|
.element-toolbar button,
|
151
151
|
.element-toolbar a {
|
152
|
-
border-radius:
|
152
|
+
border-radius: 10px;
|
153
153
|
border: 1px solid rgba(37, 99, 235, 0.32);
|
154
154
|
background: #fff;
|
155
155
|
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.16);
|
@@ -1236,19 +1236,6 @@ blockquote {
|
|
1236
1236
|
pointer-events: auto;
|
1237
1237
|
}
|
1238
1238
|
|
1239
|
-
@media (max-width: 899px) {
|
1240
|
-
.MuiPopover-root {
|
1241
|
-
z-index: 1302 !important;
|
1242
|
-
}
|
1243
|
-
canvas {
|
1244
|
-
max-width: 100% !important;
|
1245
|
-
}
|
1246
|
-
}
|
1247
|
-
|
1248
|
-
.settingsHeader {
|
1249
|
-
font-size: 14px !important;
|
1250
|
-
font-weight: 500 !important;
|
1251
|
-
}
|
1252
1239
|
.hideScroll {
|
1253
1240
|
overflow-anchor: none;
|
1254
1241
|
}
|
@@ -1264,6 +1251,20 @@ blockquote {
|
|
1264
1251
|
.hideScroll::-webkit-scrollbar-thumb:hover {
|
1265
1252
|
background: none !important;
|
1266
1253
|
}
|
1254
|
+
@media (max-width: 899px) {
|
1255
|
+
.MuiPopover-root {
|
1256
|
+
z-index: 1302 !important;
|
1257
|
+
}
|
1258
|
+
|
1259
|
+
canvas {
|
1260
|
+
max-width: 100% !important;
|
1261
|
+
}
|
1262
|
+
}
|
1263
|
+
|
1264
|
+
.settingsHeader {
|
1265
|
+
font-size: 14px !important;
|
1266
|
+
font-weight: 500 !important;
|
1267
|
+
}
|
1267
1268
|
|
1268
1269
|
.custom-scroll::-webkit-scrollbar {
|
1269
1270
|
height: .6rem;
|
@@ -1282,3 +1283,4 @@ blockquote {
|
|
1282
1283
|
.custom-scroll:hover::-webkit-scrollbar-thumb {
|
1283
1284
|
background: #A7AEC1;
|
1284
1285
|
}
|
1286
|
+
|
@@ -71,6 +71,9 @@ function AIInput({
|
|
71
71
|
}, [openAI]);
|
72
72
|
const isSendBtnDisabled = !inputValue || loading;
|
73
73
|
const props = getProps(openAI, generatedText) || {};
|
74
|
+
|
75
|
+
// const fromToolBar = openAI === "fromToolBar";
|
76
|
+
|
74
77
|
const handleSendBtnClick = () => {
|
75
78
|
if (isSendBtnDisabled) {
|
76
79
|
return;
|
@@ -250,10 +250,10 @@ function AppHeader(props) {
|
|
250
250
|
},
|
251
251
|
sx: {
|
252
252
|
mr: 2,
|
253
|
-
[theme
|
253
|
+
[theme.breakpoints.up("sm")]: {
|
254
254
|
display: "none"
|
255
255
|
},
|
256
|
-
[theme
|
256
|
+
[theme.breakpoints.between("xs", "md")]: {
|
257
257
|
display: "block"
|
258
258
|
}
|
259
259
|
},
|
@@ -272,10 +272,10 @@ function AppHeader(props) {
|
|
272
272
|
},
|
273
273
|
sx: {
|
274
274
|
flexGrow: 1,
|
275
|
-
[theme
|
275
|
+
[theme.breakpoints.up("sm")]: {
|
276
276
|
display: "block"
|
277
277
|
},
|
278
|
-
[theme
|
278
|
+
[theme.breakpoints.between("xs", "md")]: {
|
279
279
|
display: "none"
|
280
280
|
},
|
281
281
|
"& img": {
|
@@ -293,10 +293,10 @@ function AppHeader(props) {
|
|
293
293
|
}) : null, appTitle]
|
294
294
|
}), /*#__PURE__*/_jsxs(Box, {
|
295
295
|
sx: {
|
296
|
-
[theme
|
296
|
+
[theme.breakpoints.up("sm")]: {
|
297
297
|
display: "block"
|
298
298
|
},
|
299
|
-
[theme
|
299
|
+
[theme.breakpoints.between("xs", "md")]: {
|
300
300
|
display: "none"
|
301
301
|
}
|
302
302
|
},
|
@@ -11,7 +11,6 @@ import { handleLinkType, windowVar } from "../../utils/helper";
|
|
11
11
|
import LinkSettings from "../../common/LinkSettings";
|
12
12
|
import Icon from "../../common/Icon";
|
13
13
|
import { useEditorContext } from "../../hooks/useMouseMove";
|
14
|
-
import useCommonStyle from "../../commonStyle";
|
15
14
|
import { jsx as _jsx } from "react/jsx-runtime";
|
16
15
|
import { Fragment as _Fragment } from "react/jsx-runtime";
|
17
16
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
@@ -37,7 +36,6 @@ const EditorButton = props => {
|
|
37
36
|
const [edit, setEdit] = useState(false);
|
38
37
|
const [openNav, setOpenNav] = useState(false);
|
39
38
|
const [openMoreOptions, setOpenMoreOptions] = useState(false);
|
40
|
-
const classes = useCommonStyle(appTheme);
|
41
39
|
const {
|
42
40
|
label,
|
43
41
|
bgColor,
|
@@ -138,7 +136,6 @@ const EditorButton = props => {
|
|
138
136
|
arrow: true,
|
139
137
|
children: /*#__PURE__*/_jsx(IconButton, {
|
140
138
|
onClick: onMenuClick("edit"),
|
141
|
-
sx: classes.buttonMoreOption,
|
142
139
|
children: /*#__PURE__*/_jsx(Icon, {
|
143
140
|
icon: "pagesSettings"
|
144
141
|
})
|
@@ -148,7 +145,6 @@ const EditorButton = props => {
|
|
148
145
|
arrow: true,
|
149
146
|
children: /*#__PURE__*/_jsx(IconButton, {
|
150
147
|
onClick: onMenuClick("nav"),
|
151
|
-
sx: classes.buttonMoreOption,
|
152
148
|
children: /*#__PURE__*/_jsx(Icon, {
|
153
149
|
icon: "link"
|
154
150
|
})
|
@@ -161,8 +157,7 @@ const EditorButton = props => {
|
|
161
157
|
sx: {
|
162
158
|
display: "inline-flex",
|
163
159
|
color: "rgba(0, 0, 0, 0.54)",
|
164
|
-
marginBottom: "0px !important"
|
165
|
-
...classes.buttonMoreOption
|
160
|
+
marginBottom: "0px !important"
|
166
161
|
},
|
167
162
|
...btnProps,
|
168
163
|
children: /*#__PURE__*/_jsx(Icon, {
|
@@ -264,12 +259,11 @@ const EditorButton = props => {
|
|
264
259
|
...btnSp,
|
265
260
|
borderStyle: borderStyle || "solid",
|
266
261
|
color: `${textColor || "#FFFFFF"}`,
|
267
|
-
fontSize: textSize || "
|
262
|
+
fontSize: textSize || "inherit",
|
268
263
|
fontFamily: fontFamily || "PoppinsRegular",
|
269
264
|
display: "inline-flex",
|
270
265
|
alignItems: "center",
|
271
266
|
position: "relative",
|
272
|
-
lineHeight: 1.43,
|
273
267
|
"& .element-toolbar": {
|
274
268
|
display: "none"
|
275
269
|
},
|
@@ -109,13 +109,11 @@ const ColorButtons = props => {
|
|
109
109
|
forMiniTool,
|
110
110
|
openColorTool,
|
111
111
|
onClose,
|
112
|
-
onColorPickerClick
|
113
|
-
defaultColors = []
|
112
|
+
onColorPickerClick
|
114
113
|
} = props;
|
115
114
|
const [row1, ...restRows] = ColorChunks([]);
|
116
115
|
const [anchorEl, setAnchorEl] = useState(null);
|
117
116
|
const open = Boolean(anchorEl);
|
118
|
-
const firstRow = defaultColors?.length ? defaultColors : row1;
|
119
117
|
const handleMore = e => {
|
120
118
|
setAnchorEl(e.currentTarget);
|
121
119
|
};
|
@@ -133,7 +131,7 @@ const ColorButtons = props => {
|
|
133
131
|
sx: classes.colorButtons,
|
134
132
|
children: [forMiniTool ? null : /*#__PURE__*/_jsx(Box, {
|
135
133
|
className: "buttonsWrpr first",
|
136
|
-
children: [
|
134
|
+
children: [row1].map((m, i) => {
|
137
135
|
return /*#__PURE__*/_jsx(SingleColorButton, {
|
138
136
|
id: `p1_${id}`,
|
139
137
|
crs: m,
|
@@ -47,22 +47,22 @@ export function wrapThemeBreakpoints(sxProp, prop, theme) {
|
|
47
47
|
const formatedSxProp = Object.keys(sxProp).reduce((a, b) => {
|
48
48
|
switch (b) {
|
49
49
|
case "md":
|
50
|
-
a[theme
|
50
|
+
a[theme.breakpoints.up("lg")] = {
|
51
51
|
[prop]: sxProp["md"] || sxProp["lg"]
|
52
52
|
};
|
53
53
|
break;
|
54
54
|
case "sm":
|
55
|
-
a[theme
|
55
|
+
a[theme.breakpoints.up("lg")] = {
|
56
56
|
[prop]: sxProp["sm"] || sxProp["lg"]
|
57
57
|
};
|
58
58
|
break;
|
59
59
|
case "xs":
|
60
|
-
a[theme
|
60
|
+
a[theme.breakpoints.between("xs", "md")] = {
|
61
61
|
[prop]: sxProp["xs"] || sxProp["lg"]
|
62
62
|
};
|
63
63
|
break;
|
64
64
|
default:
|
65
|
-
a[theme
|
65
|
+
a[theme.breakpoints.up("lg")] = {
|
66
66
|
[prop]: sxProp["lg"]
|
67
67
|
};
|
68
68
|
}
|
@@ -171,7 +171,6 @@ const useFreeGridStyles = ({
|
|
171
171
|
height: "100%",
|
172
172
|
"& .signature-container": {
|
173
173
|
height: "100%",
|
174
|
-
LineHeight: 1.43,
|
175
174
|
"& .signature-btn-container": {
|
176
175
|
height: "100%",
|
177
176
|
display: "flex",
|
@@ -319,7 +318,7 @@ const useFreeGridStyles = ({
|
|
319
318
|
"& .element-toolbar": {
|
320
319
|
display: "none"
|
321
320
|
},
|
322
|
-
[theme
|
321
|
+
[theme.breakpoints.between("xs", "md")]: {
|
323
322
|
marginLeft: `calc((100% - 320px) * 0.5)`
|
324
323
|
}
|
325
324
|
},
|
@@ -49,7 +49,6 @@ const SearchAttachment = props => {
|
|
49
49
|
background: theme?.palette?.containers?.slashBrainCardBg,
|
50
50
|
cursor: 'pointer',
|
51
51
|
margin: '4px 0px',
|
52
|
-
lineHeight: 1.43,
|
53
52
|
"&.MuiPaper-root.MuiPaper-rounded": {
|
54
53
|
borderRadius: "7px !important",
|
55
54
|
paddingTop: '0px !important'
|
@@ -5,7 +5,6 @@ import { getPageSettings } from "../../utils/pageSettings";
|
|
5
5
|
import { isTextSelected } from "../../utils/helper";
|
6
6
|
import { useEditorContext } from "../../hooks/useMouseMove";
|
7
7
|
import SimpleTextStyle from "./style";
|
8
|
-
import { getBreakpointLineSpacing } from "../../helper/theme";
|
9
8
|
import { jsx as _jsx } from "react/jsx-runtime";
|
10
9
|
import { Fragment as _Fragment } from "react/jsx-runtime";
|
11
10
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
@@ -33,14 +32,8 @@ const SimpleText = props => {
|
|
33
32
|
const {
|
34
33
|
pageColor
|
35
34
|
} = pageSt?.pageProps || {};
|
36
|
-
const {
|
37
|
-
activeBreakPoint
|
38
|
-
} = useEditorContext();
|
39
|
-
const lineHeight = element?.children[0]?.lineHeight;
|
40
|
-
const lineH = getBreakpointLineSpacing(lineHeight, activeBreakPoint);
|
41
35
|
const classes = SimpleTextStyle({
|
42
|
-
pageColor: pageColor || theme?.palette?.editor?.background || "#FFFFFF"
|
43
|
-
lineHeight: lineH
|
36
|
+
pageColor: pageColor || theme?.palette?.editor?.background || "#FFFFFF"
|
44
37
|
});
|
45
38
|
const selected = useSelected();
|
46
39
|
const path = ReactEditor.findPath(editor, element);
|
@@ -1,17 +1,10 @@
|
|
1
1
|
import { invertColor } from "../../helper";
|
2
2
|
const SimpleTextStyle = ({
|
3
|
-
pageColor
|
4
|
-
lineHeight
|
3
|
+
pageColor
|
5
4
|
}) => ({
|
6
5
|
root: {
|
7
6
|
position: "relative",
|
8
7
|
padding: "0px",
|
9
|
-
lineHeight: lineHeight,
|
10
|
-
"&.dataView": {
|
11
|
-
"& .placeholder-simple-text": {
|
12
|
-
opacity: 0
|
13
|
-
}
|
14
|
-
},
|
15
8
|
"&.signature": {
|
16
9
|
"& .placeholder-simple-text": {
|
17
10
|
opacity: 0
|
@@ -35,8 +28,6 @@ const SimpleTextStyle = ({
|
|
35
28
|
height: "24px",
|
36
29
|
overflow: "hidden",
|
37
30
|
fontSize: "14px",
|
38
|
-
display: "inline-flex",
|
39
|
-
alignItems: "center",
|
40
31
|
"& .bg-pad-sl": {
|
41
32
|
padding: "2px 4px 2px 4px",
|
42
33
|
background: "transparent",
|
@@ -1,7 +1,7 @@
|
|
1
1
|
import React, { useEffect, useRef, useState } from "react";
|
2
2
|
import { Editor, Transforms } from "slate";
|
3
3
|
import { ReactEditor, useSelected, useSlateStatic } from "slate-react";
|
4
|
-
import { Box, IconButton, Tooltip, Table as TableComp, TableBody, useTheme, Popper, ClickAwayListener } from "@mui/material";
|
4
|
+
import { Box, IconButton, Tooltip, Table as TableComp, TableBody, useTheme, Popper, Fade, ClickAwayListener } from "@mui/material";
|
5
5
|
import { TableUtil } from "../../utils/table";
|
6
6
|
import TablePopup from "./TablePopup";
|
7
7
|
import { useEditorContext, useEditorSelection } from "../../hooks/useMouseMove";
|
@@ -77,7 +77,6 @@ const TopBanner = props => {
|
|
77
77
|
theme
|
78
78
|
} = useEditorContext();
|
79
79
|
const classes = TopBannerStyles(theme);
|
80
|
-
const renderHeaderAboveBanner = customProps?.metadata?.renderHeader ? customProps.metadata.renderHeader() : null;
|
81
80
|
return /*#__PURE__*/_jsxs(Box, {
|
82
81
|
component: "div",
|
83
82
|
...attributes,
|
@@ -88,7 +87,7 @@ const TopBanner = props => {
|
|
88
87
|
},
|
89
88
|
contentEditable: false,
|
90
89
|
sx: classes.root,
|
91
|
-
children: [
|
90
|
+
children: [/*#__PURE__*/_jsx("img", {
|
92
91
|
src: url,
|
93
92
|
alt: "Top Banner",
|
94
93
|
className: "top-banner-wrpr-ele",
|
@@ -177,11 +177,6 @@ const usePopupStyle = theme => ({
|
|
177
177
|
justifyContent: "start",
|
178
178
|
borderRadius: "10px !important",
|
179
179
|
transition: "background-color 0.3s ease",
|
180
|
-
// "& .colorBoxElementIcon": {
|
181
|
-
// "& path": {
|
182
|
-
// fill: theme?.palette?.type === "dark" ? "none" : "",
|
183
|
-
// },
|
184
|
-
// },
|
185
180
|
"& .signatureElementIcon": {
|
186
181
|
"& path": {
|
187
182
|
fill: `${theme?.palette?.editor?.closeButtonSvgStroke}`
|
@@ -394,11 +389,6 @@ const usePopupStyle = theme => ({
|
|
394
389
|
},
|
395
390
|
"& .MuiOutlinedInput-notchedOutline": {
|
396
391
|
border: `1px solid ${theme?.palette?.editor?.inputFieldBorder} !important`
|
397
|
-
},
|
398
|
-
'& .MuiInputBase-root': {
|
399
|
-
'& input': {
|
400
|
-
border: "none !important"
|
401
|
-
}
|
402
392
|
}
|
403
393
|
},
|
404
394
|
textFormatSelect: {
|
@@ -14,8 +14,6 @@ import SelectSuperSubscript from "./MiniTextFormat/SelectSuperSubscript";
|
|
14
14
|
import { ColorResetIcon, TextDefaultStyleIcon } from "../../common/iconListV2";
|
15
15
|
import FontFamilyAutocomplete from "../FormatTools/FontFamilyAutocomplete";
|
16
16
|
import { useEditorContext } from "../../hooks/useMouseMove";
|
17
|
-
import LineSpacing from "../../common/StyleBuilder/fieldTypes/lineSpacing";
|
18
|
-
import { getPageSettings } from "../../utils/pageSettings";
|
19
17
|
import { jsx as _jsx } from "react/jsx-runtime";
|
20
18
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
21
19
|
const allTools = toolbarGroups.flat();
|
@@ -33,18 +31,10 @@ const TextFormat = props => {
|
|
33
31
|
const [anchorEl, setAnchorEl] = useState(null);
|
34
32
|
const [type, setType] = useState(null);
|
35
33
|
const open = Boolean(anchorEl);
|
36
|
-
const {
|
37
|
-
element: pageSt
|
38
|
-
} = getPageSettings(editor) || {};
|
39
|
-
const pageSettingLine = pageSt?.pageProps?.lineHeight;
|
40
34
|
const {
|
41
35
|
fontFamilies,
|
42
36
|
theme
|
43
37
|
} = useEditorContext();
|
44
|
-
const {
|
45
|
-
activeBreakPoint
|
46
|
-
} = useEditorContext();
|
47
|
-
const breakpoint = activeBreakPoint === "" ? "lg" : activeBreakPoint;
|
48
38
|
const fontWeight = allTools.find(f => f.format === "fontWeight");
|
49
39
|
const fontStyle = allTools.filter(f => f.type === "mark" && f.format !== "strikethrough" && f.format !== "superscript" && f.format !== "subscript");
|
50
40
|
const fontAlign = allTools.filter(f => f.format?.indexOf("align") >= 0);
|
@@ -61,8 +51,6 @@ const TextFormat = props => {
|
|
61
51
|
color: "",
|
62
52
|
bgColor: ""
|
63
53
|
};
|
64
|
-
let lineSpacingValue = activeMark(editor, 'lineHeight');
|
65
|
-
lineSpacingValue = lineSpacingValue?.[breakpoint] !== undefined ? lineSpacingValue : pageSettingLine;
|
66
54
|
const handleColorPicker = type => e => {
|
67
55
|
setType(type);
|
68
56
|
setAnchorEl(e.currentTarget);
|
@@ -102,13 +90,6 @@ const TextFormat = props => {
|
|
102
90
|
value
|
103
91
|
});
|
104
92
|
};
|
105
|
-
const handleLineSpacing = data => {
|
106
|
-
const [[format, value]] = Object.entries(data);
|
107
|
-
addMarkData(editor, {
|
108
|
-
format,
|
109
|
-
value
|
110
|
-
});
|
111
|
-
};
|
112
93
|
return /*#__PURE__*/_jsxs(Grid, {
|
113
94
|
container: true,
|
114
95
|
sx: classes.textFormatWrapper,
|
@@ -376,32 +357,6 @@ const TextFormat = props => {
|
|
376
357
|
xs: 12,
|
377
358
|
sx: classes.dividerGrid,
|
378
359
|
children: /*#__PURE__*/_jsx(Divider, {})
|
379
|
-
}), /*#__PURE__*/_jsxs(Grid, {
|
380
|
-
item: true,
|
381
|
-
xs: 12,
|
382
|
-
children: [/*#__PURE__*/_jsx(Typography, {
|
383
|
-
variant: "body1",
|
384
|
-
color: "primary",
|
385
|
-
sx: classes.typoLabel,
|
386
|
-
children: "Line Spacing"
|
387
|
-
}), /*#__PURE__*/_jsx(Grid, {
|
388
|
-
item: true,
|
389
|
-
xs: 12,
|
390
|
-
className: "typo-icons",
|
391
|
-
sx: classes.evenSpace,
|
392
|
-
children: /*#__PURE__*/_jsx(LineSpacing, {
|
393
|
-
value: lineSpacingValue,
|
394
|
-
onChange: handleLineSpacing,
|
395
|
-
data: {
|
396
|
-
key: 'lineHeight'
|
397
|
-
}
|
398
|
-
})
|
399
|
-
})]
|
400
|
-
}), /*#__PURE__*/_jsx(Grid, {
|
401
|
-
item: true,
|
402
|
-
xs: 12,
|
403
|
-
sx: classes.dividerGrid,
|
404
|
-
children: /*#__PURE__*/_jsx(Divider, {})
|
405
360
|
}), /*#__PURE__*/_jsx(Grid, {
|
406
361
|
item: true,
|
407
362
|
xs: 12,
|