@flozy/editor 10.4.2 → 10.4.4
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 +16 -17
- package/dist/Editor/CommonEditor.js +16 -131
- package/dist/Editor/DialogWrapper.js +25 -31
- package/dist/Editor/Editor.css +8 -46
- package/dist/Editor/Elements/AI/PopoverAIInput.js +3 -11
- package/dist/Editor/Elements/Accordion/Accordion.js +9 -46
- package/dist/Editor/Elements/Accordion/AccordionSummary.js +23 -1
- package/dist/Editor/Elements/AppHeader/AppHeader.js +5 -10
- package/dist/Editor/Elements/Button/EditorButton.js +9 -27
- package/dist/Editor/Elements/Carousel/CarouselItem.js +1 -2
- package/dist/Editor/Elements/Color Picker/ColorButtons.js +14 -61
- package/dist/Editor/Elements/Color Picker/ColorPicker.css +1 -25
- package/dist/Editor/Elements/Color Picker/ColorPicker.js +7 -10
- package/dist/Editor/Elements/Color Picker/Styles.js +13 -15
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/MultiSelect.js +26 -26
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/MultiSelectType.js +5 -5
- package/dist/Editor/Elements/DataView/Layouts/Options/AddOptions.js +1 -0
- package/dist/Editor/Elements/Embed/Video.js +1 -1
- package/dist/Editor/Elements/Form/Form.js +3 -3
- package/dist/Editor/Elements/Form/FormElements/FormTextArea.js +1 -0
- package/dist/Editor/Elements/Form/FormField.js +2 -3
- package/dist/Editor/Elements/Form/Workflow/Styles.js +22 -24
- package/dist/Editor/Elements/FreeGrid/FreeGrid.js +31 -35
- package/dist/Editor/Elements/FreeGrid/FreeGridBox.js +4 -7
- package/dist/Editor/Elements/FreeGrid/FreeGridItem.js +0 -1
- package/dist/Editor/Elements/FreeGrid/Options/More.js +7 -7
- package/dist/Editor/Elements/FreeGrid/Options/sectionItemOptions.js +1 -1
- package/dist/Editor/Elements/FreeGrid/styles.js +0 -14
- package/dist/Editor/Elements/Grid/Grid.js +2 -14
- package/dist/Editor/Elements/Grid/GridItem.js +1 -1
- package/dist/Editor/Elements/Signature/Signature.css +1 -2
- package/dist/Editor/Elements/Signature/SignatureOptions/DrawSignature.js +5 -18
- package/dist/Editor/Elements/Signature/SignatureOptions/UploadSignature.js +3 -16
- package/dist/Editor/Elements/SimpleText/style.js +2 -2
- package/dist/Editor/Elements/Table/DragButton.js +1 -0
- package/dist/Editor/Elements/Table/Draggable.js +2 -6
- package/dist/Editor/Elements/Table/Styles.js +0 -7
- package/dist/Editor/Elements/Table/Table.js +3 -3
- package/dist/Editor/Elements/Table/TableCell.js +5 -24
- package/dist/Editor/Elements/Title/title.js +6 -6
- package/dist/Editor/Elements/Variables/VariableButton.js +1 -10
- package/dist/Editor/MiniEditor.js +1 -2
- package/dist/Editor/Styles/EditorStyles.js +5 -5
- package/dist/Editor/Toolbar/FormatTools/Dropdown.js +3 -27
- package/dist/Editor/Toolbar/FormatTools/FontFamilyAutocomplete.js +3 -4
- package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
- package/dist/Editor/Toolbar/FormatTools/TextSize.js +13 -10
- package/dist/Editor/Toolbar/Mini/MiniToolbar.js +1 -2
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/MiniColorPicker.js +2 -4
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +13 -6
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +42 -167
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +4 -7
- package/dist/Editor/Toolbar/PopupTool/PopperHeader.js +1 -2
- package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +12 -72
- package/dist/Editor/Toolbar/PopupTool/TextFormat.js +10 -58
- package/dist/Editor/Toolbar/PopupTool/index.js +1 -1
- package/dist/Editor/Toolbar/toolbarGroups.js +6 -48
- package/dist/Editor/common/ColorPickerButton.js +16 -41
- package/dist/Editor/common/DnD/DragHandleButton.js +1 -1
- package/dist/Editor/common/FontLoader/FontLoader.js +0 -3
- package/dist/Editor/common/Icon.js +0 -28
- package/dist/Editor/common/ImageSelector/ImageSelector.js +2 -2
- package/dist/Editor/common/ImageSelector/Styles.js +9 -3
- package/dist/Editor/common/LinkSettings/NavComponents.js +65 -45
- package/dist/Editor/common/LinkSettings/index.js +28 -14
- package/dist/Editor/common/LinkSettings/navOptions.js +2 -2
- package/dist/Editor/common/LinkSettings/style.js +244 -164
- package/dist/Editor/common/MentionsPopup/index.js +1 -4
- package/dist/Editor/common/RnD/ElementOptions/Actions.js +5 -4
- package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Settings.js +1 -2
- package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Signature.js +3 -4
- package/dist/Editor/common/RnD/ElementSettings/Settings/AppHeaderSettings.js +2 -3
- package/dist/Editor/common/RnD/ElementSettings/Settings/BoxSettings.js +2 -3
- package/dist/Editor/common/RnD/ElementSettings/Settings/ButtonSettings.js +2 -3
- package/dist/Editor/common/RnD/ElementSettings/Settings/CodeSettings.js +2 -3
- package/dist/Editor/common/RnD/ElementSettings/Settings/FormSettings.js +2 -4
- package/dist/Editor/common/RnD/ElementSettings/Settings/ImageSettings.js +2 -3
- package/dist/Editor/common/RnD/ElementSettings/Settings/TableSettings.js +2 -3
- package/dist/Editor/common/RnD/ElementSettings/Settings/TextSettings.js +1 -3
- package/dist/Editor/common/RnD/ElementSettings/Settings/VideoSettings.js +2 -3
- package/dist/Editor/common/RnD/ElementSettings/styles.js +1 -0
- package/dist/Editor/common/RnD/OptionsPopup/style.js +1 -0
- package/dist/Editor/common/RnD/SwitchViewport/SwitchViewport.js +2 -11
- package/dist/Editor/common/RnD/Theme/ViewportStimulator.js +3 -6
- package/dist/Editor/common/RnD/Utils/gridDropItem.js +19 -28
- package/dist/Editor/common/RnD/Utils/index.js +1 -3
- package/dist/Editor/common/RnD/VirtualElement/VirtualTextElement.js +58 -42
- package/dist/Editor/common/RnD/VirtualElement/helper.js +132 -323
- package/dist/Editor/common/RnD/VirtualElement/styles.js +0 -16
- package/dist/Editor/common/RnD/index.js +39 -68
- package/dist/Editor/common/Select/index.js +7 -44
- package/dist/Editor/common/Select/styles.js +2 -30
- package/dist/Editor/common/Shorthands/elements.js +0 -54
- package/dist/Editor/common/StyleBuilder/accordionTitleBtnStyle.js +2 -2
- package/dist/Editor/common/StyleBuilder/accordionTitleStyle.js +9 -12
- package/dist/Editor/common/StyleBuilder/buttonStyle.js +2 -4
- package/dist/Editor/common/StyleBuilder/embedVideoStyle.js +0 -4
- package/dist/Editor/common/StyleBuilder/fieldTypes/backgroundImage.js +0 -5
- package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +2 -12
- package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +7 -15
- package/dist/Editor/common/StyleBuilder/fieldTypes/card.js +8 -16
- package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +10 -36
- package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +7 -16
- package/dist/Editor/common/StyleBuilder/fieldTypes/index.js +1 -3
- package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +7 -15
- package/dist/Editor/common/SwipeableDrawer/style.js +12 -14
- package/dist/Editor/common/Uploader.js +0 -16
- package/dist/Editor/common/iconListV2.js +0 -76
- package/dist/Editor/common/iconslist.js +0 -21
- package/dist/Editor/commonStyle.js +61 -116
- package/dist/Editor/helper/index.js +1 -5
- package/dist/Editor/helper/theme.js +2 -203
- package/dist/Editor/hooks/useMouseMove.js +3 -9
- package/dist/Editor/hooks/useTable.js +4 -5
- package/dist/Editor/plugins/withEmbeds.js +1 -1
- package/dist/Editor/plugins/withHTML.js +1 -3
- package/dist/Editor/plugins/withTable.js +1 -1
- package/dist/Editor/theme/ThemeList.js +173 -50
- package/dist/Editor/utils/SlateUtilityFunctions.js +37 -161
- package/dist/Editor/utils/accordion.js +4 -14
- package/dist/Editor/utils/button.js +17 -1
- package/dist/Editor/utils/customHooks/useTableResize.js +9 -49
- package/dist/Editor/utils/draftToSlate.js +2 -3
- package/dist/Editor/utils/events.js +6 -50
- package/dist/Editor/utils/font.js +37 -40
- package/dist/Editor/utils/formfield.js +0 -1
- package/dist/Editor/utils/helper.js +26 -210
- package/dist/Editor/utils/insertAppHeader.js +1 -1
- package/dist/Editor/utils/signature.js +9 -2
- package/package.json +4 -4
- package/dist/Editor/Elements/FreeGrid/helper.js +0 -115
- package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +0 -439
- package/dist/Editor/assets/svg/BackIcon.js +0 -18
- package/dist/Editor/assets/svg/ThemeIcons.js +0 -293
- package/dist/Editor/common/Checkbox/index.js +0 -46
- package/dist/Editor/common/Checkbox/styles.js +0 -45
- package/dist/Editor/common/CustomColorPicker/index.js +0 -130
- package/dist/Editor/common/CustomColorPicker/style.js +0 -53
- package/dist/Editor/common/CustomDialog2/index.js +0 -94
- package/dist/Editor/common/CustomDialog2/style.js +0 -67
- package/dist/Editor/common/CustomSelect.js +0 -43
- package/dist/Editor/common/RadioGroup/index.js +0 -48
- package/dist/Editor/common/RadioGroup/styles.js +0 -29
- package/dist/Editor/common/RnD/Theme/MainThemeProvider.js +0 -17
- package/dist/Editor/common/StyleBuilder/fieldTypes/embedUpload.js +0 -115
- package/dist/Editor/helper/textIndeces.js +0 -58
- package/dist/Editor/hooks/useEditorTheme.js +0 -153
- package/dist/Editor/hooks/useThemeValues.js +0 -63
- package/dist/Editor/theme/index.js +0 -149
- package/dist/Editor/themeSettings/ActiveTheme.js +0 -82
- package/dist/Editor/themeSettings/buttons/index.js +0 -300
- package/dist/Editor/themeSettings/buttons/style.js +0 -23
- package/dist/Editor/themeSettings/colorTheme/index.js +0 -310
- package/dist/Editor/themeSettings/colorTheme/style.js +0 -81
- package/dist/Editor/themeSettings/fonts/PreviewElement.js +0 -121
- package/dist/Editor/themeSettings/fonts/index.js +0 -240
- package/dist/Editor/themeSettings/fonts/style.js +0 -62
- package/dist/Editor/themeSettings/icons.js +0 -60
- package/dist/Editor/themeSettings/index.js +0 -380
- package/dist/Editor/themeSettings/style.js +0 -299
- package/dist/Editor/themeSettingsAI/icons.js +0 -96
- package/dist/Editor/themeSettingsAI/index.js +0 -355
- package/dist/Editor/themeSettingsAI/saveTheme.js +0 -202
- package/dist/Editor/themeSettingsAI/style.js +0 -332
- package/dist/Editor/utils/updateFormName.js +0 -22
@@ -34,12 +34,12 @@ import SimpleText from "../Elements/SimpleText";
|
|
34
34
|
import CheckList from "../Elements/List/CheckList";
|
35
35
|
import { getTextColor, isEmptyTextNode } from "../helper";
|
36
36
|
import Attachments from "../Elements/Attachments/Attachments";
|
37
|
-
import { getBreakpointLineSpacing, getBreakPointsValue, getDevice,
|
37
|
+
import { getBreakpointLineSpacing, getBreakPointsValue, getDevice, groupByBreakpoint } from "../helper/theme";
|
38
38
|
import Variables from "../Elements/Variables/Variable";
|
39
|
+
import insertNewLine from "./insertNewLine";
|
39
40
|
import Divider from "../Elements/Divider/Divider";
|
40
41
|
import { getBorderColor, getSlateDom } from "./helper";
|
41
42
|
import Code from "../Elements/EmbedScript/Code";
|
42
|
-
import { ReactEditor } from "slate-react";
|
43
43
|
import FreeGrid from "../Elements/FreeGrid/FreeGrid";
|
44
44
|
import FreeGridItem from "../Elements/FreeGrid/FreeGridItem";
|
45
45
|
import FreeGridBox from "../Elements/FreeGrid/FreeGridBox";
|
@@ -47,7 +47,7 @@ import DataView from "../Elements/DataView/DataView";
|
|
47
47
|
import ViewData from "../Elements/DataView/Layouts/ViewData";
|
48
48
|
import ColumnView from "../Elements/DataView/Layouts/ColumnView";
|
49
49
|
import SearchAttachment from "../Elements/Search/SearchAttachment";
|
50
|
-
import { wrapThemeBreakpoints } from "../Elements/FreeGrid/breakpointConstants";
|
50
|
+
// import { wrapThemeBreakpoints } from "../Elements/FreeGrid/breakpointConstants";
|
51
51
|
import { jsx as _jsx } from "react/jsx-runtime";
|
52
52
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
53
53
|
const alignment = ["alignLeft", "alignRight", "alignCenter", "alignJustify"];
|
@@ -56,17 +56,7 @@ const LIST_FORMAT_TYPE = {
|
|
56
56
|
orderedList: "list-item",
|
57
57
|
unorderedList: "list-item"
|
58
58
|
};
|
59
|
-
|
60
|
-
// const NEWLINESAFTER = [
|
61
|
-
// "headingOne",
|
62
|
-
// "headingTwo",
|
63
|
-
// "headingThree",
|
64
|
-
// "headingFour",
|
65
|
-
// "headingFive",
|
66
|
-
// "headingSix",
|
67
|
-
// ];
|
68
|
-
|
69
|
-
const THEME_BLOCK_FIELDS = ["headingOne", "headingTwo", "headingThree", "headingFour", "headingFive", "headingSix", "paragraphOne", "paragraphTwo", "paragraphThree"];
|
59
|
+
const NEWLINESAFTER = ["headingOne", "headingTwo", "headingThree", "headingFour", "headingFive", "headingSix"];
|
70
60
|
export const toggleBlock = (editor, format, selection = true, attr = {}) => {
|
71
61
|
const isActive = isBlockActive(editor, format);
|
72
62
|
const isList = list_types.includes(format);
|
@@ -99,9 +89,8 @@ export const toggleBlock = (editor, format, selection = true, attr = {}) => {
|
|
99
89
|
if (!selection) {
|
100
90
|
Transforms.insertText(editor, "");
|
101
91
|
}
|
102
|
-
const forActiveType = THEME_BLOCK_FIELDS.some(f => f === format) ? format : "paragraph";
|
103
92
|
Transforms.setNodes(editor, {
|
104
|
-
type: isActive ?
|
93
|
+
type: isActive ? "paragraph" : isList ? LIST_FORMAT_TYPE[format] : format,
|
105
94
|
...attr
|
106
95
|
});
|
107
96
|
if (isList && !isActive) {
|
@@ -110,12 +99,10 @@ export const toggleBlock = (editor, format, selection = true, attr = {}) => {
|
|
110
99
|
children: []
|
111
100
|
});
|
112
101
|
}
|
113
|
-
|
114
|
-
|
115
|
-
|
116
|
-
// }
|
102
|
+
if (NEWLINESAFTER.indexOf(format) > -1) {
|
103
|
+
insertNewLine(editor);
|
104
|
+
}
|
117
105
|
};
|
118
|
-
|
119
106
|
export const addMarkData = (editor, data) => {
|
120
107
|
try {
|
121
108
|
Editor.addMark(editor, data.format, data.value);
|
@@ -124,14 +111,9 @@ export const addMarkData = (editor, data) => {
|
|
124
111
|
}
|
125
112
|
};
|
126
113
|
export const toggleMark = (editor, format) => {
|
127
|
-
const isActive =
|
114
|
+
const isActive = isMarkActive(editor, format);
|
128
115
|
if (isActive) {
|
129
|
-
|
130
|
-
if (isThemeSupportedMark) {
|
131
|
-
Editor.addMark(editor, format, false);
|
132
|
-
} else {
|
133
|
-
Editor.removeMark(editor, format);
|
134
|
-
}
|
116
|
+
Editor.removeMark(editor, format);
|
135
117
|
} else {
|
136
118
|
Editor.addMark(editor, format, true);
|
137
119
|
}
|
@@ -145,58 +127,6 @@ export const isMarkActive = (editor, format) => {
|
|
145
127
|
return null;
|
146
128
|
}
|
147
129
|
};
|
148
|
-
export const isMarkBtnActive = (editor, format) => {
|
149
|
-
switch (format) {
|
150
|
-
case "bold":
|
151
|
-
{
|
152
|
-
const style = getSelectedElementStyle("font-weight", editor);
|
153
|
-
return style === "700";
|
154
|
-
}
|
155
|
-
case "italic":
|
156
|
-
{
|
157
|
-
const style = getSelectedElementStyle("font-style", editor);
|
158
|
-
return style === format;
|
159
|
-
}
|
160
|
-
// case "underline": {
|
161
|
-
// const style = getSelectedElementStyle("text-decoration");
|
162
|
-
|
163
|
-
// return style?.includes(format);
|
164
|
-
// }
|
165
|
-
// case "strikethrough": {
|
166
|
-
// const style = getSelectedElementStyle("text-decoration");
|
167
|
-
|
168
|
-
// return style?.includes("line-through");
|
169
|
-
// }
|
170
|
-
default:
|
171
|
-
return isMarkActive(editor, format);
|
172
|
-
}
|
173
|
-
};
|
174
|
-
export const getSelectedElementStyle = (styleProperty, editor, format) => {
|
175
|
-
try {
|
176
|
-
if (!editor.selection) {
|
177
|
-
return "";
|
178
|
-
}
|
179
|
-
if (Range.isCollapsed(editor.selection)) {
|
180
|
-
return "";
|
181
|
-
}
|
182
|
-
if (format) {
|
183
|
-
const value = activeMark(editor, format, true);
|
184
|
-
if (value) {
|
185
|
-
return value;
|
186
|
-
}
|
187
|
-
}
|
188
|
-
const domRange = ReactEditor.toDOMRange(editor, editor.selection);
|
189
|
-
const selectedDomNode = domRange.commonAncestorContainer;
|
190
|
-
|
191
|
-
// If it's a text node, get its parent element
|
192
|
-
const selectedElement = selectedDomNode.nodeType === 3 ? selectedDomNode.parentElement : selectedDomNode;
|
193
|
-
if (selectedElement) {
|
194
|
-
return getElementProperty(selectedElement, styleProperty);
|
195
|
-
}
|
196
|
-
} catch (err) {
|
197
|
-
console.log(err);
|
198
|
-
}
|
199
|
-
};
|
200
130
|
export const isBlockActive = (editor, format) => {
|
201
131
|
const [match] = Editor.nodes(editor, {
|
202
132
|
match: n => !Editor.isEditor(n) && SlateElement.isElement(n) && n.type === format
|
@@ -222,7 +152,7 @@ export const upateBlockActive = (editor, format, attr = {}) => {
|
|
222
152
|
});
|
223
153
|
}
|
224
154
|
};
|
225
|
-
export const activeMark = (editor, format
|
155
|
+
export const activeMark = (editor, format) => {
|
226
156
|
const defaultMarkData = {
|
227
157
|
color: "#000000",
|
228
158
|
bgColor: "#FFFFFF",
|
@@ -232,7 +162,7 @@ export const activeMark = (editor, format, noDefaultValue) => {
|
|
232
162
|
};
|
233
163
|
try {
|
234
164
|
const marks = Editor.marks(editor);
|
235
|
-
let defaultValue =
|
165
|
+
let defaultValue = defaultMarkData[format];
|
236
166
|
const {
|
237
167
|
selection
|
238
168
|
} = editor || {};
|
@@ -249,31 +179,6 @@ export const activeMark = (editor, format, noDefaultValue) => {
|
|
249
179
|
return null;
|
250
180
|
}
|
251
181
|
};
|
252
|
-
|
253
|
-
// to avoid the styles, that automatically assign from themes
|
254
|
-
const getThemeMarkedLeaf = (leaf, children) => {
|
255
|
-
const {
|
256
|
-
italic,
|
257
|
-
bold
|
258
|
-
} = leaf || {};
|
259
|
-
const style = {};
|
260
|
-
if (italic === false) {
|
261
|
-
style.fontStyle = "normal";
|
262
|
-
}
|
263
|
-
if (bold === false) {
|
264
|
-
style.fontWeight = "normal";
|
265
|
-
}
|
266
|
-
if (Object.keys(style).length) {
|
267
|
-
children = /*#__PURE__*/_jsx(Box, {
|
268
|
-
component: "span",
|
269
|
-
sx: {
|
270
|
-
"& span": style
|
271
|
-
},
|
272
|
-
children: children
|
273
|
-
});
|
274
|
-
}
|
275
|
-
return children;
|
276
|
-
};
|
277
182
|
export const getMarked = (leaf, children, theme) => {
|
278
183
|
const className = leaf?.doublequote ? "doublequote" : "";
|
279
184
|
const lineH = leaf?.lineHeight;
|
@@ -303,7 +208,6 @@ export const getMarked = (leaf, children, theme) => {
|
|
303
208
|
children: children
|
304
209
|
});
|
305
210
|
}
|
306
|
-
children = getThemeMarkedLeaf(leaf, children);
|
307
211
|
if (leaf.strikethrough) {
|
308
212
|
children = /*#__PURE__*/_jsx("span", {
|
309
213
|
style: {
|
@@ -331,15 +235,6 @@ export const getMarked = (leaf, children, theme) => {
|
|
331
235
|
if (leaf.color || leaf.bgColor || leaf.fontSize || leaf.fontFamily || leaf.fontWeight || lineHeight || className) {
|
332
236
|
const family = leaf?.fontFamily;
|
333
237
|
const textStyles = getTextColor(leaf?.color);
|
334
|
-
const fontSize = {
|
335
|
-
lg: sizeMap[leaf.fontSize] || leaf.fontSize,
|
336
|
-
...getBreakPointsValue(leaf.fontSize, null, "overrideText")
|
337
|
-
};
|
338
|
-
const fontSizesImportant = {};
|
339
|
-
Object.entries(fontSize).forEach(([key, value]) => {
|
340
|
-
fontSizesImportant[key] = `${value} !important`;
|
341
|
-
});
|
342
|
-
const fontSizeWithBreakpoints = wrapThemeBreakpoints(fontSizesImportant, "fontSize", theme);
|
343
238
|
children = /*#__PURE__*/_jsx("span", {
|
344
239
|
style: {
|
345
240
|
background: leaf.bgColor
|
@@ -348,13 +243,12 @@ export const getMarked = (leaf, children, theme) => {
|
|
348
243
|
className: `${className} leaf-item`,
|
349
244
|
component: "span",
|
350
245
|
sx: {
|
351
|
-
|
352
|
-
|
353
|
-
|
354
|
-
|
355
|
-
|
356
|
-
},
|
357
|
-
...fontSizeWithBreakpoints,
|
246
|
+
...groupByBreakpoint({
|
247
|
+
fontSize: {
|
248
|
+
lg: sizeMap[leaf.fontSize] || leaf.fontSize,
|
249
|
+
...getBreakPointsValue(leaf.fontSize, null, "overrideText")
|
250
|
+
}
|
251
|
+
}, theme),
|
358
252
|
// ...wrapThemeBreakpoints(
|
359
253
|
// {
|
360
254
|
// lg: sizeMap[leaf.fontSize] || leaf.fontSize,
|
@@ -406,23 +300,15 @@ export const getBlock = props => {
|
|
406
300
|
const {
|
407
301
|
translation
|
408
302
|
} = customProps;
|
409
|
-
const commonHeadingProps = () => ({
|
410
|
-
...attributes,
|
411
|
-
...element.attr,
|
412
|
-
className: `edt-headings content-editable ${isEmpty ? "empty" : ""} theme-element`
|
413
|
-
});
|
414
|
-
const commonParaProps = paraType => ({
|
415
|
-
...attributes,
|
416
|
-
...element.attr,
|
417
|
-
className: `edt-paragraphs content-editable ${isEmpty ? "empty" : ""} theme-element ${paraType}`
|
418
|
-
});
|
419
303
|
const breakpoint = getDevice(window.innerWidth);
|
420
304
|
const lineH = element?.children[0]?.lineHeight;
|
421
305
|
const selectedLineHeight = getBreakpointLineSpacing(lineH, breakpoint);
|
422
306
|
switch (element.type) {
|
423
307
|
case "headingOne":
|
424
308
|
return /*#__PURE__*/_jsxs("h1", {
|
425
|
-
...
|
309
|
+
...attributes,
|
310
|
+
...element.attr,
|
311
|
+
className: `edt-headings content-editable ${isEmpty ? "empty" : ""}`,
|
426
312
|
placeholder: translation("Heading 1"),
|
427
313
|
children: [children, /*#__PURE__*/_jsx("span", {
|
428
314
|
contentEditable: false
|
@@ -430,7 +316,9 @@ export const getBlock = props => {
|
|
430
316
|
});
|
431
317
|
case "headingTwo":
|
432
318
|
return /*#__PURE__*/_jsxs("h2", {
|
433
|
-
...
|
319
|
+
...attributes,
|
320
|
+
...element.attr,
|
321
|
+
className: `edt-headings content-editable ${isEmpty ? "empty" : ""}`,
|
434
322
|
placeholder: translation("Heading 2"),
|
435
323
|
children: [children, /*#__PURE__*/_jsx("span", {
|
436
324
|
contentEditable: false
|
@@ -438,7 +326,9 @@ export const getBlock = props => {
|
|
438
326
|
});
|
439
327
|
case "headingThree":
|
440
328
|
return /*#__PURE__*/_jsxs("h3", {
|
441
|
-
...
|
329
|
+
...attributes,
|
330
|
+
...element.attr,
|
331
|
+
className: `edt-headings content-editable ${isEmpty ? "empty" : ""}`,
|
442
332
|
placeholder: translation("Heading 3"),
|
443
333
|
children: [children, /*#__PURE__*/_jsx("span", {
|
444
334
|
contentEditable: false
|
@@ -446,7 +336,9 @@ export const getBlock = props => {
|
|
446
336
|
});
|
447
337
|
case "headingFour":
|
448
338
|
return /*#__PURE__*/_jsxs("h4", {
|
449
|
-
...
|
339
|
+
...attributes,
|
340
|
+
...element.attr,
|
341
|
+
className: `edt-headings content-editable ${isEmpty ? "empty" : ""}`,
|
450
342
|
placeholder: translation("Heading 4"),
|
451
343
|
children: [children, /*#__PURE__*/_jsx("span", {
|
452
344
|
contentEditable: false
|
@@ -454,7 +346,9 @@ export const getBlock = props => {
|
|
454
346
|
});
|
455
347
|
case "headingFive":
|
456
348
|
return /*#__PURE__*/_jsxs("h5", {
|
457
|
-
...
|
349
|
+
...attributes,
|
350
|
+
...element.attr,
|
351
|
+
className: `edt-headings content-editable ${isEmpty ? "empty" : ""}`,
|
458
352
|
placeholder: translation("Heading 5"),
|
459
353
|
children: [children, /*#__PURE__*/_jsx("span", {
|
460
354
|
contentEditable: false
|
@@ -462,30 +356,14 @@ export const getBlock = props => {
|
|
462
356
|
});
|
463
357
|
case "headingSix":
|
464
358
|
return /*#__PURE__*/_jsxs("h6", {
|
465
|
-
...
|
359
|
+
...attributes,
|
360
|
+
...element.attr,
|
361
|
+
className: `edt-headings content-editable ${isEmpty ? "empty" : ""}`,
|
466
362
|
placeholder: translation("Heading 6"),
|
467
363
|
children: [children, /*#__PURE__*/_jsx("span", {
|
468
364
|
contentEditable: false
|
469
365
|
})]
|
470
366
|
});
|
471
|
-
case "paragraphOne":
|
472
|
-
return /*#__PURE__*/_jsx("p", {
|
473
|
-
...commonParaProps("para1"),
|
474
|
-
placeholder: "Paragraph 1",
|
475
|
-
children: children
|
476
|
-
});
|
477
|
-
case "paragraphTwo":
|
478
|
-
return /*#__PURE__*/_jsx("p", {
|
479
|
-
...commonParaProps("para2"),
|
480
|
-
placeholder: "Paragraph 2",
|
481
|
-
children: children
|
482
|
-
});
|
483
|
-
case "paragraphThree":
|
484
|
-
return /*#__PURE__*/_jsx("p", {
|
485
|
-
...commonParaProps("para3"),
|
486
|
-
placeholder: "Paragraph 3",
|
487
|
-
children: children
|
488
|
-
});
|
489
367
|
case "blockquote":
|
490
368
|
return /*#__PURE__*/_jsx("blockquote", {
|
491
369
|
...attributes,
|
@@ -794,10 +672,8 @@ export const getQueryStrings = urlString => {
|
|
794
672
|
const newUrl = new URL(urlString);
|
795
673
|
var youCode = newUrl.searchParams.get("v");
|
796
674
|
if (!youCode) {
|
797
|
-
|
798
|
-
youCode = parts[parts.length - 1]; // video ID
|
675
|
+
youCode = newUrl.pathname.replace("/", "");
|
799
676
|
}
|
800
|
-
|
801
677
|
return `https://www.youtube.com/embed/${youCode}`;
|
802
678
|
} else {
|
803
679
|
return urlString;
|
@@ -1,13 +1,6 @@
|
|
1
1
|
import { Transforms } from "slate";
|
2
2
|
import insertNewLine from "./insertNewLine";
|
3
3
|
import { getSelectedText } from "./helper";
|
4
|
-
import { isMobileWindow } from "../helper";
|
5
|
-
const focusAccordion = (editor, upPath) => {
|
6
|
-
Transforms.select(editor, {
|
7
|
-
path: upPath,
|
8
|
-
offset: 0
|
9
|
-
});
|
10
|
-
};
|
11
4
|
export const insertAccordion = (editor, path) => {
|
12
5
|
try {
|
13
6
|
const selectedText = getSelectedText(editor);
|
@@ -43,14 +36,11 @@ export const insertAccordion = (editor, path) => {
|
|
43
36
|
// get title index
|
44
37
|
const summaryIndex = upPath.length - 3;
|
45
38
|
upPath[summaryIndex] = upPath[summaryIndex] === 0 ? 0 : upPath[summaryIndex] - 1;
|
46
|
-
|
47
39
|
// select accordion title by default
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
}
|
52
|
-
focusAccordion(editor, upPath);
|
53
|
-
}
|
40
|
+
Transforms.select(editor, {
|
41
|
+
path: upPath,
|
42
|
+
offset: 0
|
43
|
+
});
|
54
44
|
insertNewLine(editor);
|
55
45
|
} catch (err) {
|
56
46
|
console.log(err);
|
@@ -1,5 +1,6 @@
|
|
1
1
|
import { Path, Transforms } from "slate";
|
2
2
|
import insertNewLine from "./insertNewLine";
|
3
|
+
import { windowVar } from "./helper";
|
3
4
|
import { getCurrentElementText } from "../plugins/withHTML";
|
4
5
|
export const insertButton = editor => {
|
5
6
|
const button = {
|
@@ -10,7 +11,22 @@ export const insertButton = editor => {
|
|
10
11
|
buttonLink: {
|
11
12
|
linkType: "webAddress"
|
12
13
|
},
|
13
|
-
iconPosition: "start"
|
14
|
+
iconPosition: "start",
|
15
|
+
bgColor: "#2563EB",
|
16
|
+
textColor: "#FFF",
|
17
|
+
borderRadius: {
|
18
|
+
topLeft: 30,
|
19
|
+
topRight: 30,
|
20
|
+
bottomLeft: 30,
|
21
|
+
bottomRight: 30
|
22
|
+
},
|
23
|
+
bannerSpacing: {
|
24
|
+
left: 16,
|
25
|
+
top: 8,
|
26
|
+
right: 16,
|
27
|
+
bottom: 8
|
28
|
+
},
|
29
|
+
...(windowVar.lastButtonProps || {})
|
14
30
|
};
|
15
31
|
const hasText = getCurrentElementText(editor);
|
16
32
|
const insertPath = hasText ? Path.next(Path.parent(editor?.selection.focus.path)) : editor?.selection.focus.path;
|
@@ -1,10 +1,9 @@
|
|
1
|
-
import {
|
1
|
+
import { useState } from "react";
|
2
2
|
const useTableResize = ({
|
3
3
|
parentDOM,
|
4
4
|
size: defaultSize,
|
5
5
|
onDone,
|
6
|
-
minMaxProps = {}
|
7
|
-
isMobile
|
6
|
+
minMaxProps = {}
|
8
7
|
}) => {
|
9
8
|
const {
|
10
9
|
width
|
@@ -19,10 +18,6 @@ const useTableResize = ({
|
|
19
18
|
});
|
20
19
|
const [resizing, setResizing] = useState(false);
|
21
20
|
const [isDone, setIsDone] = useState(0);
|
22
|
-
const lastTouch = useRef({
|
23
|
-
x: 0,
|
24
|
-
y: 0
|
25
|
-
});
|
26
21
|
const onLoad = defaultSize => {
|
27
22
|
setSize({
|
28
23
|
widthInPercent: 100,
|
@@ -30,64 +25,29 @@ const useTableResize = ({
|
|
30
25
|
...defaultSize
|
31
26
|
});
|
32
27
|
};
|
33
|
-
const handleEventListeners = type => {
|
34
|
-
const listener = type === "add" ? document.addEventListener : document.removeEventListener;
|
35
|
-
const onMoveListener = isMobile ? "touchmove" : "pointermove";
|
36
|
-
const onEndListener = isMobile ? "touchend" : "pointerup";
|
37
|
-
listener(onMoveListener, onMouseMove);
|
38
|
-
listener(onEndListener, onMouseUp);
|
39
|
-
};
|
40
|
-
const updateLastTouch = ({
|
41
|
-
clientX,
|
42
|
-
clientY
|
43
|
-
}) => {
|
44
|
-
lastTouch.current.x = clientX;
|
45
|
-
lastTouch.current.y = clientY;
|
46
|
-
};
|
47
28
|
const onMouseDown = e => {
|
48
|
-
|
49
|
-
|
50
|
-
|
51
|
-
e.preventDefault();
|
52
|
-
}
|
53
|
-
handleEventListeners("add");
|
29
|
+
e.preventDefault();
|
30
|
+
document.addEventListener("pointermove", onMouseMove);
|
31
|
+
document.addEventListener("pointerup", onMouseUp);
|
54
32
|
setResizing(true);
|
55
33
|
setIsDone(0);
|
56
34
|
};
|
57
35
|
const onMouseUp = () => {
|
58
|
-
|
36
|
+
document.removeEventListener("pointermove", onMouseMove);
|
37
|
+
document.removeEventListener("pointerup", onMouseUp);
|
59
38
|
setResizing(false);
|
60
39
|
setIsDone(1);
|
61
40
|
};
|
62
41
|
const onMouseMove = e => {
|
63
|
-
let {
|
64
|
-
movementX,
|
65
|
-
movementY
|
66
|
-
} = e || {};
|
67
|
-
if (e.type === "touchmove") {
|
68
|
-
// for mobile
|
69
|
-
const {
|
70
|
-
x,
|
71
|
-
y
|
72
|
-
} = lastTouch.current || {};
|
73
|
-
const touches = e.touches[0];
|
74
|
-
const {
|
75
|
-
clientX,
|
76
|
-
clientY
|
77
|
-
} = touches;
|
78
|
-
movementX = clientX - x;
|
79
|
-
movementY = clientY - y;
|
80
|
-
updateLastTouch(touches);
|
81
|
-
}
|
82
42
|
const {
|
83
43
|
minWidth
|
84
44
|
} = minMaxProps || {};
|
85
45
|
setSize(currentSize => {
|
86
46
|
const width = currentSize?.width || parentDOM?.clientWidth;
|
87
|
-
const calcWidth = width + movementX;
|
47
|
+
const calcWidth = width + e.movementX;
|
88
48
|
return {
|
89
49
|
width: minWidth && calcWidth < minWidth ? minWidth : calcWidth,
|
90
|
-
height: currentSize.height + movementY,
|
50
|
+
height: currentSize.height + e.movementY,
|
91
51
|
widthInPercent: calcWidth / width * 100
|
92
52
|
};
|
93
53
|
});
|
@@ -82,8 +82,7 @@ const splitInlineStyleRanges = (text, inlineStyleRanges, data) => {
|
|
82
82
|
};
|
83
83
|
export const draftToSlate = props => {
|
84
84
|
const {
|
85
|
-
data
|
86
|
-
needLayout
|
85
|
+
data
|
87
86
|
} = props;
|
88
87
|
if (data?.blocks && data?.blocks?.length > 0) {
|
89
88
|
const converted = data?.blocks?.reduce((a, b) => {
|
@@ -105,7 +104,7 @@ export const draftToSlate = props => {
|
|
105
104
|
return data;
|
106
105
|
} else {
|
107
106
|
return [{
|
108
|
-
type:
|
107
|
+
type: "paragraph",
|
109
108
|
children: [{
|
110
109
|
text: ""
|
111
110
|
}]
|
@@ -1,11 +1,10 @@
|
|
1
|
-
import { Editor, Transforms, Element, Node, Path, Range
|
1
|
+
import { Editor, Transforms, Element, Node, Path, Range } from "slate";
|
2
2
|
import { toggleBlock } from "./SlateUtilityFunctions";
|
3
3
|
import insertNewLine from "./insertNewLine";
|
4
4
|
import { insertAccordion } from "./accordion";
|
5
|
-
import {
|
5
|
+
import { isListItem } from "./helper";
|
6
6
|
import RnDCtrlCmds from "./RnD/RnDCtrlCmds";
|
7
7
|
import EDITORCMDS from "../common/EditorCmds";
|
8
|
-
import { ReactEditor } from "slate-react";
|
9
8
|
const HOTKEYS = {
|
10
9
|
b: "bold",
|
11
10
|
i: "italic",
|
@@ -184,20 +183,6 @@ const checkListEnterEvent = (editor, type) => {
|
|
184
183
|
insertNewLine(editor);
|
185
184
|
}
|
186
185
|
};
|
187
|
-
const removeAccordion = (editor, accordionPath) => {
|
188
|
-
Transforms.removeNodes(editor, {
|
189
|
-
at: accordionPath
|
190
|
-
});
|
191
|
-
Transforms.insertNodes(editor, {
|
192
|
-
type: "paragraph",
|
193
|
-
children: [{
|
194
|
-
text: ""
|
195
|
-
}]
|
196
|
-
}, {
|
197
|
-
at: accordionPath,
|
198
|
-
select: true
|
199
|
-
});
|
200
|
-
};
|
201
186
|
export const enterEvent = (e, editor, isMobile) => {
|
202
187
|
try {
|
203
188
|
const ele = isListItem(editor);
|
@@ -240,7 +225,9 @@ export const enterEvent = (e, editor, isMobile) => {
|
|
240
225
|
e.preventDefault();
|
241
226
|
if (!text) {
|
242
227
|
const accordionIndex = ele[1].slice(0, Math.max(ele[1].length - 1));
|
243
|
-
|
228
|
+
Transforms.removeNodes(editor, {
|
229
|
+
at: accordionIndex
|
230
|
+
});
|
244
231
|
} else {
|
245
232
|
const nextPath = Path.next(Path.parent(ele[1]));
|
246
233
|
insertAccordion(editor, nextPath);
|
@@ -342,37 +329,6 @@ export const enterEvent = (e, editor, isMobile) => {
|
|
342
329
|
console.log(err);
|
343
330
|
}
|
344
331
|
};
|
345
|
-
export const handleAccordionOnBackspace = (e, editor) => {
|
346
|
-
try {
|
347
|
-
let isAccordion = false;
|
348
|
-
const [accordionDetails] = getNodeWithType(editor, "accordion-details");
|
349
|
-
const [accordionDetailsNode] = accordionDetails || [];
|
350
|
-
if (accordionDetailsNode) {
|
351
|
-
const dom = ReactEditor.toDOMNode(editor, accordionDetailsNode);
|
352
|
-
if (dom?.parentElement) {
|
353
|
-
dom.parentElement.style.display = "block";
|
354
|
-
}
|
355
|
-
}
|
356
|
-
const [accordionSummary] = getNodeWithType(editor, "accordion-summary");
|
357
|
-
const [accordionTitle, accordionTitlePath] = accordionSummary || [];
|
358
|
-
if (accordionTitle) {
|
359
|
-
// no selection
|
360
|
-
if (Range.isCollapsed(editor.selection)) {
|
361
|
-
const start = Editor.start(editor, accordionTitlePath);
|
362
|
-
const isCursorAtStart = Point.equals(editor.selection.focus, start);
|
363
|
-
if (isCursorAtStart) {
|
364
|
-
e.preventDefault();
|
365
|
-
const parentPath = Path.parent(accordionTitlePath);
|
366
|
-
removeAccordion(editor, parentPath);
|
367
|
-
isAccordion = true;
|
368
|
-
}
|
369
|
-
}
|
370
|
-
}
|
371
|
-
return isAccordion;
|
372
|
-
} catch (err) {
|
373
|
-
console.log(err);
|
374
|
-
}
|
375
|
-
};
|
376
332
|
export const upDownArrowKeyEvents = (e, editor) => {
|
377
333
|
try {
|
378
334
|
const {
|
@@ -392,7 +348,7 @@ export const upDownArrowKeyEvents = (e, editor) => {
|
|
392
348
|
}
|
393
349
|
Transforms.move(editor, {
|
394
350
|
distance: 0,
|
395
|
-
unit:
|
351
|
+
unit: 'offset',
|
396
352
|
reverse: false
|
397
353
|
});
|
398
354
|
Transforms.select(editor, {
|