@flozy/editor 5.2.4 → 5.2.6
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/Editor/Elements/AI/CustomSelect.js +2 -1
- package/dist/Editor/Elements/Divider/Divider.js +1 -1
- package/dist/Editor/Elements/Embed/Image.js +1 -1
- package/dist/Editor/Elements/SimpleText/style.js +0 -5
- package/dist/Editor/Elements/Table/Table.js +36 -14
- package/dist/Editor/common/ColorPickerButton.js +44 -21
- package/dist/Editor/hooks/useTable.js +1 -1
- package/dist/Editor/plugins/withHTML.js +1 -1
- package/dist/Editor/utils/chatEditor/SlateUtilityFunctions.js +5 -1
- package/dist/Editor/utils/helper.js +3 -0
- package/package.json +1 -1
@@ -11,10 +11,11 @@ function CustomSelect({
|
|
11
11
|
show,
|
12
12
|
btnProps = {}
|
13
13
|
}) {
|
14
|
+
const isMobile = window.matchMedia("(max-width: 899px)")?.matches || false;
|
14
15
|
if (show) {
|
15
16
|
return /*#__PURE__*/_jsx(Box, {
|
16
17
|
component: "div",
|
17
|
-
sx: classes.customSelectContainer,
|
18
|
+
sx: !isMobile && classes.customSelectContainer,
|
18
19
|
className: "customSelectContainer",
|
19
20
|
children: options?.map((groupOption, index) => {
|
20
21
|
const {
|
@@ -4,7 +4,7 @@ import { Node, Transforms, Editor } from "slate";
|
|
4
4
|
import AspectRatioIcon from "@mui/icons-material/AspectRatio";
|
5
5
|
import useResize from "../../utils/customHooks/useResize";
|
6
6
|
import EmbedPopup from "./EmbedPopup";
|
7
|
-
import { IconButton, Tooltip, Box, useTheme
|
7
|
+
import { IconButton, Tooltip, Box, useTheme } from "@mui/material";
|
8
8
|
import { GridSettingsIcon, LinkIcon } from "../../common/iconslist";
|
9
9
|
import { useEditorContext } from "../../hooks/useMouseMove";
|
10
10
|
import { getTRBLBreakPoints, getBreakPointsValue, groupByBreakpoint } from "../../helper/theme";
|
@@ -13,6 +13,7 @@ import AddRowCol from "./AddRowCol";
|
|
13
13
|
import TableTool from "./TableTool";
|
14
14
|
import { MoreIcon, SettingsIcon } from "../../assets/svg/TableIcons";
|
15
15
|
import { getSelectedCls } from "../../utils/helper";
|
16
|
+
import SwipeableDrawerComponent from "../../common/SwipeableDrawer";
|
16
17
|
import { jsx as _jsx } from "react/jsx-runtime";
|
17
18
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
18
19
|
const hideRowDragBtns = (hide, dragRowBtnCls) => {
|
@@ -21,6 +22,26 @@ const hideRowDragBtns = (hide, dragRowBtnCls) => {
|
|
21
22
|
rowDragBtns?.forEach(btn => btn.style.display = hide);
|
22
23
|
}
|
23
24
|
};
|
25
|
+
const ToolTableComponent = props => {
|
26
|
+
const {
|
27
|
+
handleAction,
|
28
|
+
editorTheme
|
29
|
+
} = props;
|
30
|
+
const {
|
31
|
+
updateTableSelection
|
32
|
+
} = useTable();
|
33
|
+
return /*#__PURE__*/_jsx("div", {
|
34
|
+
children: /*#__PURE__*/_jsx(TableTool, {
|
35
|
+
theme: editorTheme,
|
36
|
+
handleToolAction: (type, option) => {
|
37
|
+
handleAction(type, option);
|
38
|
+
if (type === "duplicate") {
|
39
|
+
updateTableSelection(getDefaultTableSelection());
|
40
|
+
}
|
41
|
+
}
|
42
|
+
})
|
43
|
+
});
|
44
|
+
};
|
24
45
|
const MoreTableSettings = props => {
|
25
46
|
const {
|
26
47
|
exandTools,
|
@@ -28,10 +49,18 @@ const MoreTableSettings = props => {
|
|
28
49
|
editorTheme,
|
29
50
|
setExpandTools
|
30
51
|
} = props;
|
31
|
-
const
|
32
|
-
|
33
|
-
|
34
|
-
|
52
|
+
const isMobile = window.matchMedia("(max-width: 899px)")?.matches || false;
|
53
|
+
return isMobile ? /*#__PURE__*/_jsx(SwipeableDrawerComponent, {
|
54
|
+
open: Boolean(exandTools),
|
55
|
+
onClose: () => {
|
56
|
+
setExpandTools(false);
|
57
|
+
},
|
58
|
+
swipeableDrawer: false,
|
59
|
+
children: /*#__PURE__*/_jsx(ToolTableComponent, {
|
60
|
+
handleAction: handleAction,
|
61
|
+
editorTheme: editorTheme
|
62
|
+
})
|
63
|
+
}) : /*#__PURE__*/_jsx(Popper, {
|
35
64
|
open: Boolean(exandTools),
|
36
65
|
anchorEl: exandTools,
|
37
66
|
contentEditable: false,
|
@@ -41,16 +70,9 @@ const MoreTableSettings = props => {
|
|
41
70
|
placement: "bottom-start",
|
42
71
|
children: /*#__PURE__*/_jsx(ClickAwayListener, {
|
43
72
|
onClickAway: () => setExpandTools(false),
|
44
|
-
children: /*#__PURE__*/_jsx(
|
45
|
-
|
46
|
-
|
47
|
-
handleToolAction: (type, option) => {
|
48
|
-
handleAction(type, option);
|
49
|
-
if (type === "duplicate") {
|
50
|
-
updateTableSelection(getDefaultTableSelection());
|
51
|
-
}
|
52
|
-
}
|
53
|
-
})
|
73
|
+
children: /*#__PURE__*/_jsx(ToolTableComponent, {
|
74
|
+
handleAction: handleAction,
|
75
|
+
editorTheme: editorTheme
|
54
76
|
})
|
55
77
|
})
|
56
78
|
});
|
@@ -6,29 +6,19 @@ import SwipeableDrawerComponent from "./SwipeableDrawer";
|
|
6
6
|
import { jsx as _jsx } from "react/jsx-runtime";
|
7
7
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
8
8
|
import { Fragment as _Fragment } from "react/jsx-runtime";
|
9
|
-
const
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
} = props;
|
18
|
-
const [anchorEl, setAnchorEl] = useState(null);
|
9
|
+
const ColorPickerToolComponent = ({
|
10
|
+
value,
|
11
|
+
defaultColors = [],
|
12
|
+
onSave = () => {},
|
13
|
+
recentColors = [],
|
14
|
+
hideGradient,
|
15
|
+
handleClose
|
16
|
+
}) => {
|
19
17
|
const [color, setColor] = useState(value);
|
20
|
-
const open = Boolean(anchorEl);
|
21
|
-
const isMobile = window.matchMedia("(max-width: 899px)")?.matches || false;
|
22
|
-
const handleColorPicker = e => {
|
23
|
-
setAnchorEl(e.currentTarget);
|
24
|
-
};
|
25
18
|
const handleSave = () => {
|
26
19
|
onSave(color);
|
27
20
|
handleClose();
|
28
21
|
};
|
29
|
-
const handleClose = () => {
|
30
|
-
setAnchorEl(null);
|
31
|
-
};
|
32
22
|
const handleColorChange = color => {
|
33
23
|
setColor(color);
|
34
24
|
};
|
@@ -39,7 +29,7 @@ const ColorPickerButton = props => {
|
|
39
29
|
}
|
40
30
|
return colors;
|
41
31
|
}, [recentColors, defaultColors, hideGradient]);
|
42
|
-
|
32
|
+
return /*#__PURE__*/_jsxs(Grid, {
|
43
33
|
item: true,
|
44
34
|
xs: 12,
|
45
35
|
children: [/*#__PURE__*/_jsx("div", {
|
@@ -66,6 +56,25 @@ const ColorPickerButton = props => {
|
|
66
56
|
})]
|
67
57
|
})]
|
68
58
|
});
|
59
|
+
};
|
60
|
+
const ColorPickerButton = props => {
|
61
|
+
const {
|
62
|
+
value,
|
63
|
+
onSave,
|
64
|
+
defaultColors = [],
|
65
|
+
classes = {},
|
66
|
+
recentColors = [],
|
67
|
+
hideGradient
|
68
|
+
} = props;
|
69
|
+
const [anchorEl, setAnchorEl] = useState(null);
|
70
|
+
const open = Boolean(anchorEl);
|
71
|
+
const isMobile = window.matchMedia("(max-width: 899px)")?.matches || false;
|
72
|
+
const handleColorPicker = e => {
|
73
|
+
setAnchorEl(e.currentTarget);
|
74
|
+
};
|
75
|
+
const handleClose = () => {
|
76
|
+
setAnchorEl(null);
|
77
|
+
};
|
69
78
|
return /*#__PURE__*/_jsxs(_Fragment, {
|
70
79
|
children: [/*#__PURE__*/_jsx(Button, {
|
71
80
|
style: {
|
@@ -86,7 +95,14 @@ const ColorPickerButton = props => {
|
|
86
95
|
padding: 0,
|
87
96
|
className: "ed-cp-wrpr",
|
88
97
|
sx: classes.colorPickerPopup,
|
89
|
-
children: /*#__PURE__*/_jsx(ColorPickerToolComponent, {
|
98
|
+
children: /*#__PURE__*/_jsx(ColorPickerToolComponent, {
|
99
|
+
value: value,
|
100
|
+
defaultColors: defaultColors,
|
101
|
+
onSave: onSave,
|
102
|
+
recentColors: recentColors,
|
103
|
+
hideGradient: hideGradient,
|
104
|
+
handleClose: handleClose
|
105
|
+
})
|
90
106
|
})
|
91
107
|
}) : /*#__PURE__*/_jsx(Popover, {
|
92
108
|
open: open,
|
@@ -105,7 +121,14 @@ const ColorPickerButton = props => {
|
|
105
121
|
container: true,
|
106
122
|
padding: 0,
|
107
123
|
className: "ed-cp-wrpr",
|
108
|
-
children: /*#__PURE__*/_jsx(ColorPickerToolComponent, {
|
124
|
+
children: /*#__PURE__*/_jsx(ColorPickerToolComponent, {
|
125
|
+
value: value,
|
126
|
+
defaultColors: defaultColors,
|
127
|
+
onSave: onSave,
|
128
|
+
recentColors: recentColors,
|
129
|
+
hideGradient: hideGradient,
|
130
|
+
handleClose: handleClose
|
131
|
+
})
|
109
132
|
})
|
110
133
|
})]
|
111
134
|
});
|
@@ -1,7 +1,7 @@
|
|
1
1
|
import { ClickAwayListener } from "@mui/material";
|
2
2
|
import { createContext, useContext, useEffect, useMemo, useState } from "react";
|
3
3
|
import { clearCellText } from "../utils/table";
|
4
|
-
import { Editor, Element, Transforms
|
4
|
+
import { Editor, Element, Transforms } from "slate";
|
5
5
|
import { DndContext, DragOverlay, PointerSensor, useSensor, useSensors } from "@dnd-kit/core";
|
6
6
|
import { encodeToBase64, isHavingSelection } from "../utils/helper";
|
7
7
|
import { serializeToText } from "../utils/serializeToText";
|
@@ -3,6 +3,7 @@ import { Box } from "@mui/material";
|
|
3
3
|
import { fontFamilyMap, sizeMap } from "../font";
|
4
4
|
import Mentions from "../../Elements/Mentions/Mentions";
|
5
5
|
import CheckList from "../../Elements/List/CheckList";
|
6
|
+
import SimpleText from "../../Elements/SimpleText";
|
6
7
|
import { isEmptyTextNode } from "../../helper";
|
7
8
|
import { getBreakPointsValue } from "../../helper/theme";
|
8
9
|
import insertNewLine from "../insertNewLine";
|
@@ -363,6 +364,9 @@ export const getBlock = props => {
|
|
363
364
|
...props
|
364
365
|
});
|
365
366
|
default:
|
366
|
-
return
|
367
|
+
return /*#__PURE__*/_jsx(SimpleText, {
|
368
|
+
...props,
|
369
|
+
isEmpty: isEmpty
|
370
|
+
});
|
367
371
|
}
|
368
372
|
};
|
@@ -652,6 +652,7 @@ export function isHavingSelection(editor) {
|
|
652
652
|
console.log(err);
|
653
653
|
}
|
654
654
|
}
|
655
|
+
const omitNodes = ["site-settings", "page-settings"];
|
655
656
|
export function getInitialValue(value = [], readOnly) {
|
656
657
|
if (readOnly === "readonly" && value?.length) {
|
657
658
|
// remove last empty nodes on readonly mode, to remove empty spaces
|
@@ -668,6 +669,8 @@ export function getInitialValue(value = [], readOnly) {
|
|
668
669
|
const hasOnlyTextChildren = node.children.every(child => Text.isText(child));
|
669
670
|
const text = node.children[node.children.length - 1]?.text;
|
670
671
|
lastNonEmptyElementIndex = hasOnlyTextChildren ? text ? elementIndex : null : elementIndex;
|
672
|
+
} else if (omitNodes.includes(node?.type)) {
|
673
|
+
continue;
|
671
674
|
} else {
|
672
675
|
lastNonEmptyElementIndex = elementIndex;
|
673
676
|
}
|