@flozy/editor 10.1.4 → 10.1.5
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 +17 -16
- package/dist/Editor/CommonEditor.js +120 -16
- package/dist/Editor/DialogWrapper.js +31 -25
- package/dist/Editor/Editor.css +42 -8
- package/dist/Editor/Elements/AI/PopoverAIInput.js +11 -3
- package/dist/Editor/Elements/Accordion/Accordion.js +6 -2
- package/dist/Editor/Elements/AppHeader/AppHeader.js +3 -3
- package/dist/Editor/Elements/Button/EditorButton.js +25 -9
- package/dist/Editor/Elements/Carousel/CarouselItem.js +2 -1
- package/dist/Editor/Elements/Color Picker/ColorButtons.js +61 -14
- package/dist/Editor/Elements/Color Picker/ColorPicker.css +25 -1
- package/dist/Editor/Elements/Color Picker/ColorPicker.js +10 -7
- package/dist/Editor/Elements/Color Picker/Styles.js +15 -13
- package/dist/Editor/Elements/DataView/Layouts/ColumnView.js +4 -2
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/Components/MultiSelect.js +454 -0
- package/dist/Editor/Elements/DataView/Layouts/DataTypes/MultiSelectType.js +21 -6
- package/dist/Editor/Elements/DataView/Layouts/Options/AddOptions.js +5 -1
- package/dist/Editor/Elements/DataView/Layouts/Options/EditOption.js +3 -2
- package/dist/Editor/Elements/DataView/Layouts/Options/index.js +11 -0
- package/dist/Editor/Elements/DataView/Layouts/ViewData.js +8 -4
- package/dist/Editor/Elements/Embed/Image.js +3 -2
- package/dist/Editor/Elements/Embed/Video.js +1 -1
- package/dist/Editor/Elements/EmbedScript/Code.js +14 -2
- package/dist/Editor/Elements/EmbedScript/EmbedScriptPopup.js +57 -28
- package/dist/Editor/Elements/EmbedScript/styles.js +89 -0
- package/dist/Editor/Elements/Form/Form.js +181 -168
- package/dist/Editor/Elements/Form/FormElements/FormText.js +23 -6
- package/dist/Editor/Elements/Form/FormElements/FormTextArea.js +3 -2
- package/dist/Editor/Elements/Form/FormField.js +13 -6
- package/dist/Editor/Elements/Form/Workflow/Styles.js +24 -22
- package/dist/Editor/Elements/FreeGrid/FreeGrid.js +6 -24
- package/dist/Editor/Elements/FreeGrid/FreeGridBox.js +7 -4
- package/dist/Editor/Elements/FreeGrid/Options/More.js +8 -8
- package/dist/Editor/Elements/FreeGrid/styles.js +67 -7
- package/dist/Editor/Elements/Grid/Grid.js +14 -2
- package/dist/Editor/Elements/Grid/GridItem.js +1 -1
- package/dist/Editor/Elements/List/CheckList.js +4 -1
- package/dist/Editor/Elements/Search/SearchAttachment.js +40 -9
- package/dist/Editor/Elements/Search/SearchButton.js +9 -8
- package/dist/Editor/Elements/Search/SearchList.js +9 -7
- package/dist/Editor/Elements/Signature/Signature.css +2 -1
- package/dist/Editor/Elements/Signature/SignatureOptions/DrawSignature.js +18 -5
- package/dist/Editor/Elements/Signature/SignatureOptions/UploadSignature.js +16 -3
- package/dist/Editor/Elements/SimpleText/index.js +6 -1
- package/dist/Editor/Elements/SimpleText/style.js +2 -2
- package/dist/Editor/Elements/Table/DragButton.js +0 -1
- package/dist/Editor/Elements/Table/Draggable.js +6 -2
- package/dist/Editor/Elements/Table/Styles.js +7 -0
- package/dist/Editor/Elements/Table/Table.js +3 -3
- package/dist/Editor/Elements/Table/TableCell.js +24 -5
- package/dist/Editor/Elements/Title/title.js +6 -6
- package/dist/Editor/Elements/Variables/VariableButton.js +10 -1
- package/dist/Editor/MiniEditor.js +2 -1
- package/dist/Editor/Styles/EditorStyles.js +5 -5
- package/dist/Editor/Toolbar/FormatTools/Dropdown.js +27 -3
- package/dist/Editor/Toolbar/FormatTools/FontFamilyAutocomplete.js +4 -3
- package/dist/Editor/Toolbar/FormatTools/MarkButton.js +2 -2
- package/dist/Editor/Toolbar/FormatTools/TextSize.js +10 -13
- package/dist/Editor/Toolbar/Mini/MiniToolbar.js +2 -1
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/MiniColorPicker.js +4 -2
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectFontSize.js +6 -13
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/SelectTypography.js +167 -42
- package/dist/Editor/Toolbar/PopupTool/MiniTextFormat/index.js +7 -4
- package/dist/Editor/Toolbar/PopupTool/PopperHeader.js +2 -1
- package/dist/Editor/Toolbar/PopupTool/PopupToolStyle.js +72 -12
- package/dist/Editor/Toolbar/PopupTool/TextFormat.js +100 -27
- package/dist/Editor/Toolbar/PopupTool/ThemeTextFormat.js +439 -0
- package/dist/Editor/Toolbar/PopupTool/index.js +1 -1
- package/dist/Editor/Toolbar/toolbarGroups.js +48 -6
- package/dist/Editor/assets/svg/BackIcon.js +18 -0
- package/dist/Editor/assets/svg/ClearAllRounded.js +31 -0
- package/dist/Editor/assets/svg/ResetIconNew.js +23 -0
- package/dist/Editor/assets/svg/SettingsIcon.js +1 -0
- package/dist/Editor/assets/svg/ThemeIcons.js +293 -0
- package/dist/Editor/common/ColorPickerButton.js +39 -17
- package/dist/Editor/common/CustomColorPicker/index.js +130 -0
- package/dist/Editor/common/CustomColorPicker/style.js +53 -0
- package/dist/Editor/common/CustomDialog2/index.js +94 -0
- package/dist/Editor/common/CustomDialog2/style.js +67 -0
- package/dist/Editor/common/CustomSelect.js +43 -0
- package/dist/Editor/common/DnD/DragHandleButton.js +1 -1
- package/dist/Editor/common/FontLoader/FontLoader.js +3 -0
- package/dist/Editor/common/Icon.js +31 -1
- package/dist/Editor/common/ImageSelector/Styles.js +3 -9
- package/dist/Editor/common/LinkSettings/NavComponents.js +34 -8
- package/dist/Editor/common/LinkSettings/index.js +84 -68
- package/dist/Editor/common/LinkSettings/style.js +245 -30
- package/dist/Editor/common/RnD/ElementOptions/Actions.js +13 -14
- package/dist/Editor/common/RnD/ElementOptions/Icons/LinkIcon.js +1 -0
- package/dist/Editor/common/RnD/ElementOptions/index.js +2 -2
- package/dist/Editor/common/RnD/ElementOptions/styles.js +28 -1
- package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Settings.js +6 -5
- package/dist/Editor/common/RnD/ElementSettings/OtherSettings/Signature.js +4 -3
- package/dist/Editor/common/RnD/ElementSettings/Settings/AppHeaderSettings.js +3 -2
- package/dist/Editor/common/RnD/ElementSettings/Settings/BoxSettings.js +3 -2
- package/dist/Editor/common/RnD/ElementSettings/Settings/ButtonSettings.js +3 -2
- package/dist/Editor/common/RnD/ElementSettings/Settings/CodeSettings.js +3 -2
- package/dist/Editor/common/RnD/ElementSettings/Settings/FormSettings.js +4 -2
- package/dist/Editor/common/RnD/ElementSettings/Settings/ImageSettings.js +3 -2
- package/dist/Editor/common/RnD/ElementSettings/Settings/TableSettings.js +3 -2
- package/dist/Editor/common/RnD/ElementSettings/Settings/TextSettings.js +3 -1
- package/dist/Editor/common/RnD/ElementSettings/Settings/VideoSettings.js +3 -2
- package/dist/Editor/common/RnD/ElementSettings/styles.js +147 -12
- package/dist/Editor/common/RnD/OptionsPopup/index.js +8 -5
- package/dist/Editor/common/RnD/OptionsPopup/style.js +121 -19
- package/dist/Editor/common/RnD/SwitchViewport/SwitchViewport.js +8 -5
- package/dist/Editor/common/RnD/Theme/MainThemeProvider.js +17 -0
- package/dist/Editor/common/RnD/Theme/ViewportStimulator.js +6 -3
- package/dist/Editor/common/RnD/Utils/gridDropItem.js +1 -2
- package/dist/Editor/common/RnD/VirtualElement/helper.js +3 -2
- package/dist/Editor/common/RnD/index.js +5 -6
- package/dist/Editor/common/Select/index.js +2 -0
- package/dist/Editor/common/Shorthands/elements.js +54 -0
- package/dist/Editor/common/SnackBar/index.js +43 -0
- package/dist/Editor/common/StyleBuilder/buttonStyle.js +4 -2
- package/dist/Editor/common/StyleBuilder/fieldTypes/backgroundImage.js +5 -0
- package/dist/Editor/common/StyleBuilder/fieldTypes/bannerSpacing.js +12 -2
- package/dist/Editor/common/StyleBuilder/fieldTypes/borderRadius.js +15 -7
- package/dist/Editor/common/StyleBuilder/fieldTypes/card.js +16 -8
- package/dist/Editor/common/StyleBuilder/fieldTypes/color.js +36 -10
- package/dist/Editor/common/StyleBuilder/fieldTypes/fontSize.js +16 -7
- package/dist/Editor/common/StyleBuilder/fieldTypes/lineSpacing.js +7 -6
- package/dist/Editor/common/StyleBuilder/fieldTypes/menusArray.js +13 -6
- package/dist/Editor/common/StyleBuilder/fieldTypes/textOptions.js +15 -7
- package/dist/Editor/common/StyleBuilder/pageSettingsStyle.js +5 -7
- package/dist/Editor/common/Uploader.js +8 -0
- package/dist/Editor/common/iconListV2.js +156 -6
- package/dist/Editor/common/iconslist.js +24 -0
- package/dist/Editor/commonStyle.js +168 -62
- package/dist/Editor/helper/index.js +4 -0
- package/dist/Editor/helper/textIndeces.js +58 -0
- package/dist/Editor/helper/theme.js +203 -2
- package/dist/Editor/hooks/useEditorTheme.js +153 -0
- package/dist/Editor/hooks/useMouseMove.js +8 -5
- package/dist/Editor/hooks/useTable.js +5 -4
- package/dist/Editor/hooks/useThemeValues.js +63 -0
- package/dist/Editor/plugins/withEmbeds.js +1 -1
- package/dist/Editor/plugins/withHTML.js +3 -1
- package/dist/Editor/plugins/withTable.js +1 -1
- package/dist/Editor/theme/ThemeList.js +50 -173
- package/dist/Editor/theme/index.js +149 -0
- package/dist/Editor/themeSettings/ActiveTheme.js +72 -0
- package/dist/Editor/themeSettings/buttons/index.js +292 -0
- package/dist/Editor/themeSettings/buttons/style.js +23 -0
- package/dist/Editor/themeSettings/colorTheme/index.js +309 -0
- package/dist/Editor/themeSettings/colorTheme/style.js +81 -0
- package/dist/Editor/themeSettings/fonts/PreviewElement.js +121 -0
- package/dist/Editor/themeSettings/fonts/index.js +240 -0
- package/dist/Editor/themeSettings/fonts/style.js +62 -0
- package/dist/Editor/themeSettings/icons.js +60 -0
- package/dist/Editor/themeSettings/index.js +361 -0
- package/dist/Editor/themeSettings/style.js +292 -0
- package/dist/Editor/themeSettingsAI/icons.js +96 -0
- package/dist/Editor/themeSettingsAI/index.js +355 -0
- package/dist/Editor/themeSettingsAI/saveTheme.js +202 -0
- package/dist/Editor/themeSettingsAI/style.js +324 -0
- package/dist/Editor/utils/SlateUtilityFunctions.js +166 -43
- package/dist/Editor/utils/accordion.js +14 -4
- package/dist/Editor/utils/button.js +1 -17
- package/dist/Editor/utils/customHooks/useTableResize.js +49 -9
- package/dist/Editor/utils/draftToSlate.js +3 -2
- package/dist/Editor/utils/events.js +50 -6
- package/dist/Editor/utils/font.js +40 -37
- package/dist/Editor/utils/form.js +4 -4
- package/dist/Editor/utils/formfield.js +8 -2
- package/dist/Editor/utils/helper.js +109 -19
- package/dist/Editor/utils/signature.js +2 -9
- package/package.json +4 -4
@@ -1,6 +1,13 @@
|
|
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
|
+
};
|
4
11
|
export const insertAccordion = (editor, path) => {
|
5
12
|
try {
|
6
13
|
const selectedText = getSelectedText(editor);
|
@@ -36,11 +43,14 @@ export const insertAccordion = (editor, path) => {
|
|
36
43
|
// get title index
|
37
44
|
const summaryIndex = upPath.length - 3;
|
38
45
|
upPath[summaryIndex] = upPath[summaryIndex] === 0 ? 0 : upPath[summaryIndex] - 1;
|
46
|
+
|
39
47
|
// select accordion title by default
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
}
|
48
|
+
if (isMobileWindow()) {
|
49
|
+
// timeout to resolve focus issue in mobile
|
50
|
+
setTimeout(() => focusAccordion(editor, upPath), 0);
|
51
|
+
} else {
|
52
|
+
focusAccordion(editor, upPath);
|
53
|
+
}
|
44
54
|
insertNewLine(editor);
|
45
55
|
} catch (err) {
|
46
56
|
console.log(err);
|
@@ -1,6 +1,5 @@
|
|
1
1
|
import { Path, Transforms } from "slate";
|
2
2
|
import insertNewLine from "./insertNewLine";
|
3
|
-
import { windowVar } from "./helper";
|
4
3
|
import { getCurrentElementText } from "../plugins/withHTML";
|
5
4
|
export const insertButton = editor => {
|
6
5
|
const button = {
|
@@ -11,22 +10,7 @@ export const insertButton = editor => {
|
|
11
10
|
buttonLink: {
|
12
11
|
linkType: "webAddress"
|
13
12
|
},
|
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 || {})
|
13
|
+
iconPosition: "start"
|
30
14
|
};
|
31
15
|
const hasText = getCurrentElementText(editor);
|
32
16
|
const insertPath = hasText ? Path.next(Path.parent(editor?.selection.focus.path)) : editor?.selection.focus.path;
|
@@ -1,9 +1,10 @@
|
|
1
|
-
import { useState } from "react";
|
1
|
+
import { useRef, useState } from "react";
|
2
2
|
const useTableResize = ({
|
3
3
|
parentDOM,
|
4
4
|
size: defaultSize,
|
5
5
|
onDone,
|
6
|
-
minMaxProps = {}
|
6
|
+
minMaxProps = {},
|
7
|
+
isMobile
|
7
8
|
}) => {
|
8
9
|
const {
|
9
10
|
width
|
@@ -18,6 +19,10 @@ const useTableResize = ({
|
|
18
19
|
});
|
19
20
|
const [resizing, setResizing] = useState(false);
|
20
21
|
const [isDone, setIsDone] = useState(0);
|
22
|
+
const lastTouch = useRef({
|
23
|
+
x: 0,
|
24
|
+
y: 0
|
25
|
+
});
|
21
26
|
const onLoad = defaultSize => {
|
22
27
|
setSize({
|
23
28
|
widthInPercent: 100,
|
@@ -25,29 +30,64 @@ const useTableResize = ({
|
|
25
30
|
...defaultSize
|
26
31
|
});
|
27
32
|
};
|
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
|
+
};
|
28
47
|
const onMouseDown = e => {
|
29
|
-
|
30
|
-
|
31
|
-
|
48
|
+
if (isMobile) {
|
49
|
+
updateLastTouch(e.touches[0]);
|
50
|
+
} else {
|
51
|
+
e.preventDefault();
|
52
|
+
}
|
53
|
+
handleEventListeners("add");
|
32
54
|
setResizing(true);
|
33
55
|
setIsDone(0);
|
34
56
|
};
|
35
57
|
const onMouseUp = () => {
|
36
|
-
|
37
|
-
document.removeEventListener("pointerup", onMouseUp);
|
58
|
+
handleEventListeners("remove");
|
38
59
|
setResizing(false);
|
39
60
|
setIsDone(1);
|
40
61
|
};
|
41
62
|
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
|
+
}
|
42
82
|
const {
|
43
83
|
minWidth
|
44
84
|
} = minMaxProps || {};
|
45
85
|
setSize(currentSize => {
|
46
86
|
const width = currentSize?.width || parentDOM?.clientWidth;
|
47
|
-
const calcWidth = width +
|
87
|
+
const calcWidth = width + movementX;
|
48
88
|
return {
|
49
89
|
width: minWidth && calcWidth < minWidth ? minWidth : calcWidth,
|
50
|
-
height: currentSize.height +
|
90
|
+
height: currentSize.height + movementY,
|
51
91
|
widthInPercent: calcWidth / width * 100
|
52
92
|
};
|
53
93
|
});
|
@@ -82,7 +82,8 @@ const splitInlineStyleRanges = (text, inlineStyleRanges, data) => {
|
|
82
82
|
};
|
83
83
|
export const draftToSlate = props => {
|
84
84
|
const {
|
85
|
-
data
|
85
|
+
data,
|
86
|
+
needLayout
|
86
87
|
} = props;
|
87
88
|
if (data?.blocks && data?.blocks?.length > 0) {
|
88
89
|
const converted = data?.blocks?.reduce((a, b) => {
|
@@ -104,7 +105,7 @@ export const draftToSlate = props => {
|
|
104
105
|
return data;
|
105
106
|
} else {
|
106
107
|
return [{
|
107
|
-
type: "paragraph",
|
108
|
+
type: needLayout ? "title" : "paragraph",
|
108
109
|
children: [{
|
109
110
|
text: ""
|
110
111
|
}]
|
@@ -1,10 +1,11 @@
|
|
1
|
-
import { Editor, Transforms, Element, Node, Path, Range } from "slate";
|
1
|
+
import { Editor, Transforms, Element, Node, Path, Range, Point } from "slate";
|
2
2
|
import { toggleBlock } from "./SlateUtilityFunctions";
|
3
3
|
import insertNewLine from "./insertNewLine";
|
4
4
|
import { insertAccordion } from "./accordion";
|
5
|
-
import { isListItem } from "./helper";
|
5
|
+
import { getNodeWithType, isListItem } from "./helper";
|
6
6
|
import RnDCtrlCmds from "./RnD/RnDCtrlCmds";
|
7
7
|
import EDITORCMDS from "../common/EditorCmds";
|
8
|
+
import { ReactEditor } from "slate-react";
|
8
9
|
const HOTKEYS = {
|
9
10
|
b: "bold",
|
10
11
|
i: "italic",
|
@@ -183,6 +184,20 @@ const checkListEnterEvent = (editor, type) => {
|
|
183
184
|
insertNewLine(editor);
|
184
185
|
}
|
185
186
|
};
|
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
|
+
};
|
186
201
|
export const enterEvent = (e, editor, isMobile) => {
|
187
202
|
try {
|
188
203
|
const ele = isListItem(editor);
|
@@ -225,9 +240,7 @@ export const enterEvent = (e, editor, isMobile) => {
|
|
225
240
|
e.preventDefault();
|
226
241
|
if (!text) {
|
227
242
|
const accordionIndex = ele[1].slice(0, Math.max(ele[1].length - 1));
|
228
|
-
|
229
|
-
at: accordionIndex
|
230
|
-
});
|
243
|
+
removeAccordion(editor, accordionIndex);
|
231
244
|
} else {
|
232
245
|
const nextPath = Path.next(Path.parent(ele[1]));
|
233
246
|
insertAccordion(editor, nextPath);
|
@@ -329,6 +342,37 @@ export const enterEvent = (e, editor, isMobile) => {
|
|
329
342
|
console.log(err);
|
330
343
|
}
|
331
344
|
};
|
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
|
+
};
|
332
376
|
export const upDownArrowKeyEvents = (e, editor) => {
|
333
377
|
try {
|
334
378
|
const {
|
@@ -348,7 +392,7 @@ export const upDownArrowKeyEvents = (e, editor) => {
|
|
348
392
|
}
|
349
393
|
Transforms.move(editor, {
|
350
394
|
distance: 0,
|
351
|
-
unit:
|
395
|
+
unit: "offset",
|
352
396
|
reverse: false
|
353
397
|
});
|
354
398
|
Transforms.select(editor, {
|
@@ -7,43 +7,43 @@ export const sizeMap = {
|
|
7
7
|
export const fontFamilyMap = {
|
8
8
|
PoppinsRegular: "PoppinsRegular",
|
9
9
|
PoppinsBold: "PoppinsBold",
|
10
|
-
sans:
|
11
|
-
serif:
|
12
|
-
monospace:
|
13
|
-
roboto: "
|
14
|
-
qwitcher: "
|
15
|
-
garamond: "
|
16
|
-
anton: "
|
17
|
-
dmserif: "
|
18
|
-
inter: "
|
19
|
-
libre: "
|
20
|
-
montserrat: "
|
21
|
-
opensans: "
|
22
|
-
publicsans: "
|
23
|
-
raleway: "
|
24
|
-
spacemono: "
|
25
|
-
bulgarian: "
|
26
|
-
impact: "
|
27
|
-
redacted: "
|
28
|
-
greatVibes: "
|
29
|
-
zeyada: "
|
30
|
-
allura: "
|
31
|
-
pinyon: "
|
32
|
-
muellerhoff: "
|
33
|
-
dawning: "
|
10
|
+
sans: 'Helvetica, Arial, "sans serif"',
|
11
|
+
serif: 'Georgia, "Times New Roaman", serif',
|
12
|
+
monospace: 'Monaco, "Courier New", monospace',
|
13
|
+
roboto: "Roboto, sans-serif",
|
14
|
+
qwitcher: '"Qwitcher Grypen", cursive',
|
15
|
+
garamond: '"EB Garamond", serif',
|
16
|
+
anton: "Anton, sans-serif",
|
17
|
+
dmserif: '"DM Serif Text", serif',
|
18
|
+
inter: "Inter, sans-serif",
|
19
|
+
libre: '"Libre Baskerville", serif',
|
20
|
+
montserrat: "Montserrat, sans-serif",
|
21
|
+
opensans: '"Open Sans", sans-serif',
|
22
|
+
publicsans: '"Public Sans", sans-serif',
|
23
|
+
raleway: "Raleway, sans-serif",
|
24
|
+
spacemono: '"Space Mono", sans-serif',
|
25
|
+
bulgarian: '"Bulgarian Garamond", monospace',
|
26
|
+
impact: "Impact, serif",
|
27
|
+
redacted: '"Redacted Script", cursive',
|
28
|
+
greatVibes: '"Great Vibes", cursive',
|
29
|
+
zeyada: "Zeyada, cursive",
|
30
|
+
allura: "Allura, cursive",
|
31
|
+
pinyon: '"Pinyon Script", cursive',
|
32
|
+
muellerhoff: '"Herr Von Muellerhoff", cursive',
|
33
|
+
dawning: '"Dawning of a New Day", cursive',
|
34
34
|
// New Font Added for Type Signature
|
35
|
-
comingsoon: "
|
36
|
-
dancingScript: "
|
37
|
-
engagement: "
|
38
|
-
gaegu: "
|
39
|
-
ingridDarling: "
|
40
|
-
kitaOne: "
|
41
|
-
laBelleAurore: "
|
42
|
-
lobster: "
|
43
|
-
meaCulpa: "
|
44
|
-
meddon: "
|
45
|
-
merriWeather: "
|
46
|
-
theGirlNextDoor: "
|
35
|
+
comingsoon: '"Coming Soon", cursive',
|
36
|
+
dancingScript: '"Dancing Script", cursive',
|
37
|
+
engagement: "Engagement, cursive",
|
38
|
+
gaegu: "Gaegu, cursive",
|
39
|
+
ingridDarling: '"Ingrid Darling", cursive',
|
40
|
+
kitaOne: "Times",
|
41
|
+
laBelleAurore: '"La Belle Aurore", cursive',
|
42
|
+
lobster: "Lobster, cursive",
|
43
|
+
meaCulpa: '"Mea Culpa", cursive',
|
44
|
+
meddon: "Meddon, cursive",
|
45
|
+
merriWeather: "Merriweather, serif",
|
46
|
+
theGirlNextDoor: '"The Girl Next Door", cursive'
|
47
47
|
};
|
48
48
|
export const fontOptions = Object.keys(fontFamilyMap).map(m => {
|
49
49
|
return {
|
@@ -62,7 +62,10 @@ export const signedTextFonts = Object.keys(fontFamilyMap).slice(-12).map(m => {
|
|
62
62
|
export const headingMap = {
|
63
63
|
headingOne: "32px",
|
64
64
|
headingTwo: "24px",
|
65
|
-
headingThree: "19px"
|
65
|
+
headingThree: "19px",
|
66
|
+
headingFour: "16px",
|
67
|
+
headingFive: "13px",
|
68
|
+
headingSix: "11px"
|
66
69
|
};
|
67
70
|
export const fontWeightOptions = [{
|
68
71
|
text: "Bold",
|
@@ -22,8 +22,14 @@ export const formField = data => {
|
|
22
22
|
},
|
23
23
|
fontFamily: data?.fontFamily ? data?.fontFamily : "",
|
24
24
|
textSize: data?.textSize ? data?.textSize : "",
|
25
|
-
textColor: data?.textColor
|
26
|
-
fontWeight: data?.fontWeight ? data?.fontWeight : "500"
|
25
|
+
textColor: data?.textColor && `${data?.textColor} !important`,
|
26
|
+
fontWeight: data?.fontWeight ? data?.fontWeight : "500",
|
27
|
+
borderRadius: {
|
28
|
+
topLeft: 8,
|
29
|
+
topRight: 8,
|
30
|
+
bottomLeft: 8,
|
31
|
+
bottomRight: 8
|
32
|
+
}
|
27
33
|
};
|
28
34
|
};
|
29
35
|
export const insertGridItem = editor => {
|
@@ -2,6 +2,8 @@ import { Editor, Node, Transforms, Element, Path, Range, Text } from "slate";
|
|
2
2
|
import { ReactEditor } from "slate-react";
|
3
3
|
import insertNewLine from "./insertNewLine";
|
4
4
|
import { getDevice } from "../helper/theme";
|
5
|
+
import { activeMark, getSelectedElementStyle } from "./SlateUtilityFunctions";
|
6
|
+
import { getCurrentElementText } from "../plugins/withHTML";
|
5
7
|
export const windowVar = {};
|
6
8
|
let ST_TIMEOUT = null;
|
7
9
|
const BLOCKS = ["grid", "dataView"];
|
@@ -480,6 +482,34 @@ export const decodeString = str => {
|
|
480
482
|
console.log(err);
|
481
483
|
}
|
482
484
|
};
|
485
|
+
export const getContrastColor = color => {
|
486
|
+
let r, g, b;
|
487
|
+
|
488
|
+
// Check if the color is in hex format
|
489
|
+
if (color.startsWith("#")) {
|
490
|
+
r = parseInt(color.substring(1, 3), 16);
|
491
|
+
g = parseInt(color.substring(3, 5), 16);
|
492
|
+
b = parseInt(color.substring(5, 7), 16);
|
493
|
+
}
|
494
|
+
// Check if the color is in RGB/RGBA format
|
495
|
+
else if (color.startsWith("rgb")) {
|
496
|
+
const rgbValues = color.replace(/^rgba?\(|\s+|\)$/g, "") // Remove the rgb/rgba and spaces
|
497
|
+
.split(","); // Split the values into an array
|
498
|
+
|
499
|
+
r = parseInt(rgbValues[0]);
|
500
|
+
g = parseInt(rgbValues[1]);
|
501
|
+
b = parseInt(rgbValues[2]);
|
502
|
+
} else {
|
503
|
+
// If the format is not recognized, default to black text
|
504
|
+
return "#000000";
|
505
|
+
}
|
506
|
+
|
507
|
+
// Calculate relative luminance
|
508
|
+
const luminance = (0.299 * r + 0.587 * g + 0.114 * b) / 255;
|
509
|
+
|
510
|
+
// Return black for light colors, white for dark colors
|
511
|
+
return luminance > 0.5 ? "#000000" : "#FFFFFF";
|
512
|
+
};
|
483
513
|
export const onDeleteKey = (event, {
|
484
514
|
editor
|
485
515
|
}) => {
|
@@ -697,6 +727,10 @@ export const isRestrictedNode = (event, editor) => {
|
|
697
727
|
return isNodeRestricted;
|
698
728
|
}
|
699
729
|
};
|
730
|
+
export function capitalizeFirstLetter(str) {
|
731
|
+
if (!str) return str;
|
732
|
+
return str.charAt(0).toUpperCase() + str.slice(1);
|
733
|
+
}
|
700
734
|
export const insertLineBreakAtEndOfPath = (editor, path) => {
|
701
735
|
try {
|
702
736
|
const [node, nodePath] = Editor.node(editor, path); // Get the node at the specified path
|
@@ -715,6 +749,13 @@ export const insertLineBreakAtEndOfPath = (editor, path) => {
|
|
715
749
|
console.log(err);
|
716
750
|
}
|
717
751
|
};
|
752
|
+
export function isHavingSelection(editor) {
|
753
|
+
try {
|
754
|
+
return editor?.selection && !Range.isCollapsed(editor.selection);
|
755
|
+
} catch (err) {
|
756
|
+
console.log(err);
|
757
|
+
}
|
758
|
+
}
|
718
759
|
const omitNodes = ["site-settings", "page-settings"];
|
719
760
|
export function getInitialValue(value = [], readOnly) {
|
720
761
|
if (readOnly === "readonly" && value?.length) {
|
@@ -745,20 +786,17 @@ export function getInitialValue(value = [], readOnly) {
|
|
745
786
|
}
|
746
787
|
return value;
|
747
788
|
}
|
748
|
-
export function capitalizeFirstLetter(str) {
|
749
|
-
if (!str) return str;
|
750
|
-
return str.charAt(0).toUpperCase() + str.slice(1);
|
751
|
-
}
|
752
|
-
export function isHavingSelection(editor) {
|
753
|
-
try {
|
754
|
-
return editor?.selection && !Range.isCollapsed(editor.selection);
|
755
|
-
} catch (err) {
|
756
|
-
console.log(err);
|
757
|
-
}
|
758
|
-
}
|
759
789
|
export function getSelectedCls(defaultCls = "", selected, selectedClsName = "selected") {
|
760
790
|
return `${defaultCls} ${selected ? selectedClsName : ""}`;
|
761
791
|
}
|
792
|
+
export function handleNegativeInteger(val) {
|
793
|
+
return val < 0 ? 0 : val;
|
794
|
+
}
|
795
|
+
export const containsSurrogatePair = text => {
|
796
|
+
// Match surrogate pairs (high and low surrogate)
|
797
|
+
const surrogatePairRegex = /[\uD800-\uDBFF][\uDC00-\uDFFF]/;
|
798
|
+
return surrogatePairRegex.test(text);
|
799
|
+
};
|
762
800
|
export const getNodeWithType = (editor, nodeType = "", otherOptions) => {
|
763
801
|
try {
|
764
802
|
const options = {
|
@@ -772,11 +810,6 @@ export const getNodeWithType = (editor, nodeType = "", otherOptions) => {
|
|
772
810
|
return [];
|
773
811
|
}
|
774
812
|
};
|
775
|
-
export const containsSurrogatePair = text => {
|
776
|
-
// Match surrogate pairs (high and low surrogate)
|
777
|
-
const surrogatePairRegex = /[\uD800-\uDBFF][\uDC00-\uDFFF]/;
|
778
|
-
return surrogatePairRegex.test(text);
|
779
|
-
};
|
780
813
|
export const getSlateDom = (editor, range) => {
|
781
814
|
try {
|
782
815
|
const slateDom = ReactEditor.toDOMRange(editor, range);
|
@@ -826,9 +859,24 @@ export const hideSlateSelection = () => {
|
|
826
859
|
const root = document.documentElement;
|
827
860
|
root.style.setProperty("--slate-highlight-bg", "none");
|
828
861
|
};
|
829
|
-
export
|
830
|
-
|
831
|
-
|
862
|
+
export const insertSlashNode = (editor, insertNode) => {
|
863
|
+
try {
|
864
|
+
// Delete the currently selected text
|
865
|
+
editor.deleteFragment();
|
866
|
+
const currentText = getCurrentElementText(editor);
|
867
|
+
const currentPath = editor?.selection?.anchor?.path;
|
868
|
+
let insertAt = currentPath;
|
869
|
+
if (currentText?.trim()) {
|
870
|
+
const parentPath = Path.parent(currentPath);
|
871
|
+
insertAt = Path.next(parentPath);
|
872
|
+
}
|
873
|
+
Transforms.insertNodes(editor, insertNode, {
|
874
|
+
at: insertAt
|
875
|
+
});
|
876
|
+
} catch (err) {
|
877
|
+
console.log(err);
|
878
|
+
}
|
879
|
+
};
|
832
880
|
export const isEverythingSelected = editor => {
|
833
881
|
const {
|
834
882
|
selection
|
@@ -858,4 +906,46 @@ export const getCurrentNodeText = editor => {
|
|
858
906
|
} catch (error) {
|
859
907
|
console.log("Error:", error);
|
860
908
|
}
|
909
|
+
};
|
910
|
+
function convertColorToRgb(color) {
|
911
|
+
if (color?.startsWith("#")) {
|
912
|
+
// HEX to RGB
|
913
|
+
let hex = color.replace("#", "");
|
914
|
+
let r, g, b;
|
915
|
+
if (hex.length === 3) {
|
916
|
+
hex = hex.split("").map(x => x + x).join("");
|
917
|
+
}
|
918
|
+
if (hex.length === 6) {
|
919
|
+
[r, g, b] = [hex.substring(0, 2), hex.substring(2, 4), hex.substring(4, 6)].map(val => parseInt(val, 16));
|
920
|
+
return `rgb(${r}, ${g}, ${b})`;
|
921
|
+
}
|
922
|
+
} else {
|
923
|
+
return color;
|
924
|
+
}
|
925
|
+
}
|
926
|
+
export const getSelectedColor = (selectedColor, theme, hideThemeColors) => {
|
927
|
+
const colorVars = hideThemeColors ? null : theme?.vars?.colors;
|
928
|
+
let selectedValue = selectedColor;
|
929
|
+
if (colorVars) {
|
930
|
+
const convertedColor = convertColorToRgb(selectedColor);
|
931
|
+
Object.entries(theme.colors).forEach(([key, value]) => {
|
932
|
+
const convertedThemeColor = convertColorToRgb(value);
|
933
|
+
if (convertedThemeColor === convertedColor) {
|
934
|
+
selectedValue = colorVars[key];
|
935
|
+
}
|
936
|
+
});
|
937
|
+
}
|
938
|
+
return selectedValue;
|
939
|
+
};
|
940
|
+
const themeTextFormats = ["headingOne", "headingTwo", "headingThree", "headingFour", "headingFive", "headingSix", "paragraphOne", "paragraphTwo", "paragraphThree"];
|
941
|
+
export const getSelectedElementColor = (editor, format, theme) => {
|
942
|
+
const [isThemeText] = Editor.nodes(editor, {
|
943
|
+
at: editor.selection,
|
944
|
+
match: n => themeTextFormats.includes(n?.type)
|
945
|
+
});
|
946
|
+
if (!isThemeText) {
|
947
|
+
return activeMark(editor, "color") || "#000000";
|
948
|
+
}
|
949
|
+
const color = getSelectedElementStyle(format, editor, format);
|
950
|
+
return getSelectedColor(color, theme);
|
861
951
|
};
|
@@ -1,9 +1,5 @@
|
|
1
|
-
import {
|
2
|
-
import insertNewLine from "./insertNewLine";
|
3
|
-
import { getCurrentElementText } from "../plugins/withHTML";
|
1
|
+
import { insertSlashNode } from "./helper";
|
4
2
|
export const insertSignature = editor => {
|
5
|
-
const hasText = getCurrentElementText(editor);
|
6
|
-
const insertPath = hasText ? Path.next(Path.parent(editor?.selection.focus.path)) : editor.selection.anchor.path;
|
7
3
|
const signature = {
|
8
4
|
type: "signature",
|
9
5
|
alignment: "center",
|
@@ -17,8 +13,5 @@ export const insertSignature = editor => {
|
|
17
13
|
text: " "
|
18
14
|
}]
|
19
15
|
};
|
20
|
-
|
21
|
-
at: insertPath
|
22
|
-
});
|
23
|
-
insertNewLine(editor);
|
16
|
+
insertSlashNode(editor, signature);
|
24
17
|
};
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@flozy/editor",
|
3
|
-
"version": "10.1.
|
3
|
+
"version": "10.1.5",
|
4
4
|
"description": "An Editor for flozy app brain",
|
5
5
|
"files": [
|
6
6
|
"dist"
|
@@ -38,7 +38,6 @@
|
|
38
38
|
"react-icons": "^4.10.1",
|
39
39
|
"react-katex": "^3.0.1",
|
40
40
|
"react-rnd": "^10.4.11",
|
41
|
-
"react-scripts": "5.0.1",
|
42
41
|
"react-signature-canvas": "^1.0.6",
|
43
42
|
"react-slick": "^0.29.0",
|
44
43
|
"sanitize-html": "^2.13.0",
|
@@ -69,7 +68,7 @@
|
|
69
68
|
"storybook": "storybook dev -p 6006",
|
70
69
|
"build-storybook": "NODE_OPTIONS='--max_old_space_size=4096' storybook build",
|
71
70
|
"publish:npm": "rm -rf dist && mkdir dist && babel src/components -d dist --copy-files",
|
72
|
-
"publish:local": "rm -rf /Users/
|
71
|
+
"publish:local": "rm -rf /Users/agenciflow08/Documents/flozyapp/client/node_modules/@flozy/editor/dist && babel src/components -d /Users/agenciflow08/Documents/flozyapp/client/node_modules/@flozy/editor/dist --copy-files",
|
73
72
|
"publish:flozy": "./publish-flozy.sh",
|
74
73
|
"publish:flozy2": "./publish-flozy2.sh",
|
75
74
|
"publish:permission": "chmod +x publish-flozy.sh && chmod +x publish-flozy2.sh"
|
@@ -122,7 +121,8 @@
|
|
122
121
|
"prop-types": "^15.8.1",
|
123
122
|
"source-map-explorer": "^2.5.3",
|
124
123
|
"storybook": "^7.4.0",
|
125
|
-
"webpack": "^5.88.2"
|
124
|
+
"webpack": "^5.88.2",
|
125
|
+
"react-scripts": "5.0.1"
|
126
126
|
},
|
127
127
|
"overrides": {
|
128
128
|
"react-refresh": "0.11.0"
|